{"version":3,"file":"index-0QBzu3Xk.js","sources":["../../node_modules/react/cjs/react.production.min.js","../../node_modules/react/index.js","../../node_modules/react/cjs/react-jsx-runtime.production.min.js","../../node_modules/react/jsx-runtime.js","../../node_modules/scheduler/cjs/scheduler.production.min.js","../../node_modules/scheduler/index.js","../../node_modules/react-dom/cjs/react-dom.production.min.js","../../node_modules/react-dom/index.js","../../node_modules/react-dom/client.js","../../node_modules/@axa-fr/oidc-client/dist/index.js","../../node_modules/@axa-fr/react-oidc/dist/index.js","../../src/global/config.tsx","../../node_modules/@remix-run/router/dist/router.js","../../node_modules/react-router/dist/index.js","../../node_modules/react-router-dom/dist/index.js","../../node_modules/@syncfusion/ej2-base/src/util.js","../../node_modules/@syncfusion/ej2-base/src/intl/parser-base.js","../../node_modules/@syncfusion/ej2-base/src/hijri-parser.js","../../node_modules/@syncfusion/ej2-base/src/intl/date-formatter.js","../../node_modules/@syncfusion/ej2-base/src/intl/number-formatter.js","../../node_modules/@syncfusion/ej2-base/src/intl/date-parser.js","../../node_modules/@syncfusion/ej2-base/src/intl/number-parser.js","../../node_modules/@syncfusion/ej2-base/src/observer.js","../../node_modules/@syncfusion/ej2-base/src/internationalization.js","../../node_modules/@syncfusion/ej2-base/src/intl/intl-base.js","../../node_modules/@syncfusion/ej2-base/src/ajax.js","../../node_modules/@syncfusion/ej2-base/src/fetch.js","../../node_modules/@syncfusion/ej2-base/src/browser.js","../../node_modules/@syncfusion/ej2-base/src/event-handler.js","../../node_modules/@syncfusion/ej2-base/src/dom.js","../../node_modules/@syncfusion/ej2-base/src/base.js","../../node_modules/@syncfusion/ej2-base/src/notify-property-change.js","../../node_modules/@syncfusion/ej2-base/src/animation.js","../../node_modules/@syncfusion/ej2-base/src/module-loader.js","../../node_modules/@syncfusion/ej2-base/src/child-property.js","../../node_modules/@syncfusion/ej2-base/src/validate-lic.js","../../node_modules/@syncfusion/ej2-base/src/component.js","../../node_modules/@syncfusion/ej2-base/src/draggable.js","../../node_modules/@syncfusion/ej2-base/src/droppable.js","../../node_modules/@syncfusion/ej2-base/src/keyboard.js","../../node_modules/@syncfusion/ej2-base/src/l10n.js","../../node_modules/@syncfusion/ej2-base/src/touch.js","../../node_modules/@syncfusion/ej2-base/src/template.js","../../node_modules/@syncfusion/ej2-base/src/template-engine.js","../../node_modules/@syncfusion/ej2-base/src/sanitize-helper.js","../../node_modules/redux/dist/redux.mjs","../../node_modules/immer/dist/immer.mjs","../../node_modules/reselect/dist/reselect.mjs","../../node_modules/redux-thunk/dist/redux-thunk.mjs","../../node_modules/@reduxjs/toolkit/dist/redux-toolkit.modern.mjs","../../node_modules/axios/lib/helpers/bind.js","../../node_modules/axios/lib/utils.js","../../node_modules/axios/lib/core/AxiosError.js","../../node_modules/axios/lib/helpers/null.js","../../node_modules/axios/lib/helpers/toFormData.js","../../node_modules/axios/lib/helpers/AxiosURLSearchParams.js","../../node_modules/axios/lib/helpers/buildURL.js","../../node_modules/axios/lib/core/InterceptorManager.js","../../node_modules/axios/lib/defaults/transitional.js","../../node_modules/axios/lib/platform/browser/classes/URLSearchParams.js","../../node_modules/axios/lib/platform/browser/classes/FormData.js","../../node_modules/axios/lib/platform/browser/classes/Blob.js","../../node_modules/axios/lib/platform/browser/index.js","../../node_modules/axios/lib/platform/common/utils.js","../../node_modules/axios/lib/platform/index.js","../../node_modules/axios/lib/helpers/toURLEncodedForm.js","../../node_modules/axios/lib/helpers/formDataToJSON.js","../../node_modules/axios/lib/defaults/index.js","../../node_modules/axios/lib/helpers/parseHeaders.js","../../node_modules/axios/lib/core/AxiosHeaders.js","../../node_modules/axios/lib/core/transformData.js","../../node_modules/axios/lib/cancel/isCancel.js","../../node_modules/axios/lib/cancel/CanceledError.js","../../node_modules/axios/lib/core/settle.js","../../node_modules/axios/lib/helpers/parseProtocol.js","../../node_modules/axios/lib/helpers/speedometer.js","../../node_modules/axios/lib/helpers/throttle.js","../../node_modules/axios/lib/helpers/progressEventReducer.js","../../node_modules/axios/lib/helpers/isURLSameOrigin.js","../../node_modules/axios/lib/helpers/cookies.js","../../node_modules/axios/lib/helpers/isAbsoluteURL.js","../../node_modules/axios/lib/helpers/combineURLs.js","../../node_modules/axios/lib/core/buildFullPath.js","../../node_modules/axios/lib/core/mergeConfig.js","../../node_modules/axios/lib/helpers/resolveConfig.js","../../node_modules/axios/lib/adapters/xhr.js","../../node_modules/axios/lib/helpers/composeSignals.js","../../node_modules/axios/lib/helpers/trackStream.js","../../node_modules/axios/lib/adapters/fetch.js","../../node_modules/axios/lib/adapters/adapters.js","../../node_modules/axios/lib/core/dispatchRequest.js","../../node_modules/axios/lib/env/data.js","../../node_modules/axios/lib/helpers/validator.js","../../node_modules/axios/lib/core/Axios.js","../../node_modules/axios/lib/cancel/CancelToken.js","../../node_modules/axios/lib/helpers/spread.js","../../node_modules/axios/lib/helpers/isAxiosError.js","../../node_modules/axios/lib/helpers/HttpStatusCode.js","../../node_modules/axios/lib/axios.js","../../node_modules/axios/index.js","../../src/services/fetchDataFromApi.tsx","../../src/redux/settingSlice.tsx","../../src/redux/eventSlice.tsx","../../src/redux/registerSlice.tsx","../../src/redux/docentSlice.tsx","../../src/redux/sideBarSlice.tsx","../../src/redux/appSlice.tsx","../../src/redux/store.tsx","../../node_modules/use-sync-external-store/cjs/use-sync-external-store-with-selector.production.min.js","../../node_modules/use-sync-external-store/with-selector.js","../../node_modules/react-redux/dist/react-redux.mjs","../../node_modules/@syncfusion/ej2-react-base/src/component-base.js","../../node_modules/@syncfusion/ej2-react-base/src/util.js","../../node_modules/@syncfusion/ej2-react-base/src/complex-base.js","../../node_modules/@syncfusion/ej2-react-base/src/services.js","../../node_modules/@syncfusion/ej2-react-base/src/template.js","../../node_modules/@syncfusion/ej2-navigations/src/common/h-scroll.js","../../node_modules/@syncfusion/ej2-navigations/src/common/v-scroll.js","../../node_modules/@syncfusion/ej2-navigations/src/common/menu-scroll.js","../../node_modules/@syncfusion/ej2-data/src/query.js","../../node_modules/@syncfusion/ej2-data/src/util.js","../../node_modules/@syncfusion/ej2-data/src/adaptors.js","../../node_modules/@syncfusion/ej2-data/src/manager.js","../../node_modules/@syncfusion/ej2-buttons/src/common/common.js","../../node_modules/@syncfusion/ej2-buttons/src/button/button.js","../../node_modules/@syncfusion/ej2-buttons/src/check-box/check-box.js","../../node_modules/@syncfusion/ej2-buttons/src/radio-button/radio-button.js","../../node_modules/@syncfusion/ej2-lists/src/common/list-base.js","../../node_modules/@syncfusion/ej2-popups/src/common/position.js","../../node_modules/@syncfusion/ej2-popups/src/common/collision.js","../../node_modules/@syncfusion/ej2-popups/src/popup/popup.js","../../node_modules/@syncfusion/ej2-popups/src/common/resize.js","../../node_modules/@syncfusion/ej2-popups/src/dialog/dialog.js","../../node_modules/@syncfusion/ej2-popups/src/tooltip/tooltip.js","../../node_modules/@syncfusion/ej2-popups/src/spinner/spinner.js","../../node_modules/@syncfusion/ej2-navigations/src/common/menu-base.js","../../node_modules/@syncfusion/ej2-navigations/src/toolbar/toolbar.js","../../node_modules/@syncfusion/ej2-navigations/src/context-menu/context-menu.js","../../node_modules/@syncfusion/ej2-navigations/src/tab/tab.js","../../node_modules/@syncfusion/ej2-inputs/src/input/input.js","../../node_modules/@syncfusion/ej2-inputs/src/numerictextbox/numerictextbox.js","../../node_modules/@syncfusion/ej2-inputs/src/slider/slider.js","../../node_modules/@syncfusion/ej2-inputs/src/uploader/uploader.js","../../node_modules/@syncfusion/ej2-splitbuttons/src/common/common.js","../../node_modules/@syncfusion/ej2-splitbuttons/src/drop-down-button/drop-down-button.js","../../node_modules/@syncfusion/ej2-splitbuttons/src/split-button/split-button.js","../../node_modules/@syncfusion/ej2-inputs/src/color-picker/color-picker.js","../../node_modules/@syncfusion/ej2-inputs/src/textbox/textbox.js","../../node_modules/@syncfusion/ej2-navigations/src/sidebar/sidebar.js","../../node_modules/@syncfusion/ej2-navigations/src/appbar/appbar.js","../../node_modules/@syncfusion/ej2-react-navigations/src/tab/tab.component.js","../../node_modules/@syncfusion/ej2-react-navigations/src/sidebar/sidebar.component.js","../../node_modules/@syncfusion/ej2-react-navigations/src/appbar/appbar.component.js","../../node_modules/@babel/runtime/helpers/interopRequireDefault.js","../../node_modules/@babel/runtime/helpers/esm/extends.js","../../node_modules/@mui/utils/deepmerge/deepmerge.js","../../node_modules/@mui/utils/formatMuiErrorMessage/formatMuiErrorMessage.js","../../node_modules/react-is/cjs/react-is.production.min.js","../../node_modules/react-is/index.js","../../node_modules/@mui/utils/getDisplayName/getDisplayName.js","../../node_modules/@mui/utils/capitalize/capitalize.js","../../node_modules/@mui/utils/createChainedFunction/createChainedFunction.js","../../node_modules/@mui/utils/debounce/debounce.js","../../node_modules/@mui/utils/deprecatedPropType/deprecatedPropType.js","../../node_modules/@mui/utils/isMuiElement/isMuiElement.js","../../node_modules/@mui/utils/ownerDocument/ownerDocument.js","../../node_modules/@mui/utils/ownerWindow/ownerWindow.js","../../node_modules/@mui/utils/requirePropFactory/requirePropFactory.js","../../node_modules/@mui/utils/setRef/setRef.js","../../node_modules/@mui/utils/useEnhancedEffect/useEnhancedEffect.js","../../node_modules/@mui/utils/useId/useId.js","../../node_modules/@mui/utils/unsupportedProp/unsupportedProp.js","../../node_modules/@mui/utils/useControlled/useControlled.js","../../node_modules/@mui/utils/useEventCallback/useEventCallback.js","../../node_modules/@mui/utils/useForkRef/useForkRef.js","../../node_modules/@mui/utils/useTimeout/useTimeout.js","../../node_modules/@mui/utils/useIsFocusVisible/useIsFocusVisible.js","../../node_modules/@mui/utils/resolveProps/resolveProps.js","../../node_modules/@mui/utils/composeClasses/composeClasses.js","../../node_modules/@mui/utils/ClassNameGenerator/ClassNameGenerator.js","../../node_modules/@mui/utils/generateUtilityClass/generateUtilityClass.js","../../node_modules/@mui/utils/generateUtilityClasses/generateUtilityClasses.js","../../node_modules/@mui/utils/clamp/clamp.js","../../node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js","../../node_modules/clsx/dist/clsx.mjs","../../node_modules/@mui/system/esm/useThemeProps/getThemeProps.js","../../node_modules/@mui/system/esm/createTheme/createBreakpoints.js","../../node_modules/@mui/system/esm/createTheme/shape.js","../../node_modules/@mui/system/esm/merge.js","../../node_modules/@mui/system/esm/breakpoints.js","../../node_modules/@mui/system/esm/style.js","../../node_modules/@mui/system/esm/memoize.js","../../node_modules/@mui/system/esm/spacing.js","../../node_modules/@mui/system/esm/createTheme/createSpacing.js","../../node_modules/@mui/system/esm/compose.js","../../node_modules/@mui/system/esm/borders.js","../../node_modules/@mui/system/esm/cssGrid.js","../../node_modules/@mui/system/esm/palette.js","../../node_modules/@mui/system/esm/sizing.js","../../node_modules/@mui/system/esm/styleFunctionSx/defaultSxConfig.js","../../node_modules/@mui/system/esm/styleFunctionSx/styleFunctionSx.js","../../node_modules/@mui/system/esm/createTheme/applyStyles.js","../../node_modules/@mui/system/esm/createTheme/createTheme.js","../../node_modules/@emotion/memoize/dist/emotion-memoize.esm.js","../../node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js","../../node_modules/@emotion/sheet/dist/emotion-sheet.browser.esm.js","../../node_modules/stylis/src/Enum.js","../../node_modules/stylis/src/Utility.js","../../node_modules/stylis/src/Tokenizer.js","../../node_modules/stylis/src/Parser.js","../../node_modules/stylis/src/Serializer.js","../../node_modules/stylis/src/Middleware.js","../../node_modules/@emotion/cache/dist/emotion-cache.browser.esm.js","../../node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js","../../node_modules/hoist-non-react-statics/node_modules/react-is/index.js","../../node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js","../../node_modules/@emotion/utils/dist/emotion-utils.browser.esm.js","../../node_modules/@emotion/hash/dist/emotion-hash.esm.js","../../node_modules/@emotion/unitless/dist/emotion-unitless.esm.js","../../node_modules/@emotion/serialize/dist/emotion-serialize.browser.esm.js","../../node_modules/@emotion/use-insertion-effect-with-fallbacks/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js","../../node_modules/@emotion/react/dist/emotion-element-43c6fea0.browser.esm.js","../../node_modules/@babel/runtime/helpers/extends.js","../../node_modules/@emotion/react/dist/emotion-react.browser.esm.js","../../node_modules/@emotion/styled/base/dist/emotion-styled-base.browser.esm.js","../../node_modules/@emotion/styled/dist/emotion-styled.browser.esm.js","../../node_modules/@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js","../../node_modules/@mui/styled-engine/GlobalStyles/GlobalStyles.js","../../node_modules/@mui/styled-engine/index.js","../../node_modules/@mui/system/esm/useThemeWithoutDefault.js","../../node_modules/@mui/system/esm/useTheme.js","../../node_modules/@mui/system/esm/useThemeProps/useThemeProps.js","../../node_modules/@mui/system/esm/styleFunctionSx/extendSxProp.js","../../node_modules/@mui/material/styles/createMixins.js","../../node_modules/@mui/system/colorManipulator.js","../../node_modules/@mui/material/colors/common.js","../../node_modules/@mui/material/colors/grey.js","../../node_modules/@mui/material/colors/purple.js","../../node_modules/@mui/material/colors/red.js","../../node_modules/@mui/material/colors/orange.js","../../node_modules/@mui/material/colors/blue.js","../../node_modules/@mui/material/colors/lightBlue.js","../../node_modules/@mui/material/colors/green.js","../../node_modules/@mui/material/styles/createPalette.js","../../node_modules/@mui/material/styles/createTypography.js","../../node_modules/@mui/material/styles/shadows.js","../../node_modules/@mui/material/styles/createTransitions.js","../../node_modules/@mui/material/styles/zIndex.js","../../node_modules/@mui/material/styles/createTheme.js","../../node_modules/@mui/material/styles/defaultTheme.js","../../node_modules/@mui/material/styles/identifier.js","../../node_modules/@mui/material/styles/useThemeProps.js","../../node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js","../../node_modules/@mui/system/createStyled.js","../../node_modules/@mui/material/styles/slotShouldForwardProp.js","../../node_modules/@mui/material/styles/rootShouldForwardProp.js","../../node_modules/@mui/material/styles/styled.js","../../node_modules/@mui/material/SvgIcon/svgIconClasses.js","../../node_modules/@mui/material/SvgIcon/SvgIcon.js","../../node_modules/@mui/material/utils/createSvgIcon.js","../../node_modules/@mui/material/utils/index.js","../../node_modules/@mui/icons-material/utils/createSvgIcon.js","../../node_modules/@mui/icons-material/ViewComfy.js","../../node_modules/@mui/icons-material/CalendarMonth.js","../../node_modules/@syncfusion/ej2-react-popups/src/dialog/dialog.component.js","../../node_modules/@syncfusion/ej2-react-popups/src/tooltip/tooltip.component.js","../../node_modules/ua-parser-js/dist/ua-parser.min.js","../../node_modules/react-device-detect/dist/lib.js","../../src/hooks/reduxHooks.tsx","../../src/hooks/useGracefulHover.tsx","../../node_modules/@mui/icons-material/esm/Groups2.js","../../node_modules/@mui/icons-material/esm/Person.js","../../node_modules/@mui/icons-material/esm/UploadFile.js","../../node_modules/immutable/dist/immutable.es.js","../../src/hooks/useUserRoles.tsx","../../src/global/Auth/SideBar.tsx","../../node_modules/react-hook-form/dist/index.esm.mjs","../../node_modules/@syncfusion/ej2-react-buttons/src/button/button.component.js","../../node_modules/@syncfusion/ej2-react-buttons/src/check-box/checkbox.component.js","../../src/components/CustomCard.tsx","../../node_modules/@syncfusion/ej2-react-inputs/src/textbox/textbox.component.js","../../node_modules/@syncfusion/ej2-react-inputs/src/uploader/uploader.component.js","../../src/pages/03_Register_Profile/components/CommunicationData.tsx","../../node_modules/@syncfusion/ej2-dropdowns/src/common/incremental-search.js","../../node_modules/@syncfusion/ej2-dropdowns/src/common/highlight-search.js","../../node_modules/@syncfusion/ej2-notifications/src/toast/toast.js","../../node_modules/@syncfusion/ej2-notifications/src/message/message.js","../../node_modules/@syncfusion/ej2-notifications/src/skeleton/skeleton.js","../../node_modules/@syncfusion/ej2-dropdowns/src/drop-down-base/drop-down-base.js","../../node_modules/@syncfusion/ej2-dropdowns/src/drop-down-list/drop-down-list.js","../../node_modules/@syncfusion/ej2-dropdowns/src/combo-box/combo-box.js","../../node_modules/@syncfusion/ej2-dropdowns/src/auto-complete/auto-complete.js","../../node_modules/@syncfusion/ej2-react-dropdowns/src/drop-down-list/dropdownlist.component.js","../../src/pages/03_Register_Profile/components/GeneralData.tsx","../../src/pages/03_Register_Profile/components/AddressData.tsx","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/base/constant.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/base/classes.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/base/enum.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/models/items.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/models/default-locale.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/base/util.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/isformatted.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/base/constant.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/selection/selection.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/common/util.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/toolbar-status.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/toolbar-renderer.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/base-toolbar.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/dropdown-buttons.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/services/service-locator.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/services/renderer-factory.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/toolbar-action.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/toolbar.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/keyboard.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/color-picker.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/base-quick-toolbar.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/popup-renderer.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/quick-toolbar.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/execute-command-callback.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/common/constant.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/formatter/formatter.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/common/config.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/dom-node.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/lists.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/insert-methods.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/nodecutter.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/formats.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/inserthtml.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/link.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/alignments.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/indents.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/base/classes.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/image.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/audio.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/video.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/table.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/selection-commands.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/selection-exec.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/inserthtml-exec.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/clearformat.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/clearformat-exec.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/undo.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/ms-word-clean-up.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/insert-text.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/emoji-picker-action.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/plugin/format-painter-actions.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/editor-manager/base/editor-manager.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/formatter/html-formatter.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/html-toolbar-status.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/content-renderer.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/iframe-content-renderer.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/xhtml-validation.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/html-editor.js","../../node_modules/@syncfusion/ej2-filemanager/src/file-manager/models/ajax-settings.js","../../node_modules/@syncfusion/ej2-filemanager/src/file-manager/models/toolbar-settings.js","../../node_modules/@syncfusion/ej2-filemanager/src/file-manager/models/search-settings.js","../../node_modules/@syncfusion/ej2-filemanager/src/file-manager/models/details-view-settings.js","../../node_modules/@syncfusion/ej2-filemanager/src/file-manager/models/contextMenu-settings.js","../../node_modules/@syncfusion/ej2-filemanager/src/file-manager/models/navigation-pane-settings.js","../../node_modules/@syncfusion/ej2-filemanager/src/file-manager/models/upload-settings.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/value-formatter.js","../../node_modules/@syncfusion/ej2-grids/src/grid/models/column.js","../../node_modules/@syncfusion/ej2-grids/src/grid/base/constant.js","../../node_modules/@syncfusion/ej2-grids/src/grid/base/enum.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/data.js","../../node_modules/@syncfusion/ej2-grids/src/grid/models/row.js","../../node_modules/@syncfusion/ej2-grids/src/grid/models/cell.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/cell-merge-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/base/string-literals.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/row-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/row-model-generator.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/summary-model-generator.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/group-model-generator.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/content-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/header-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/aria-service.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/header-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/stacked-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/indent-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/caption-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/expand-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/header-indent-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/detail-header-indent-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/detail-expand-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/row-drag-drop-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/row-drag-header-indent-render.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/render.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/cell-render-factory.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/responsive-dialog-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/service-locator.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/renderer-factory.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/width-controller.js","../../node_modules/@syncfusion/ej2-grids/src/grid/services/focus-strategy.js","../../node_modules/@syncfusion/ej2-grids/src/grid/models/page-settings.js","../../node_modules/@syncfusion/ej2-grids/src/grid/models/column-chooser-settings.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/selection.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/search.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/show-hide.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/scroll.js","../../node_modules/@syncfusion/ej2-grids/src/grid/models/aggregate.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/clipboard.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/logger.js","../../node_modules/@syncfusion/ej2-grids/src/grid/base/grid.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/print.js","../../node_modules/@syncfusion/ej2-grids/src/grid/base/util.js","../../node_modules/@syncfusion/ej2-grids/src/grid/common/checkbox-filter-base.js","../../node_modules/@syncfusion/ej2-calendars/src/calendar/calendar.js","../../node_modules/@syncfusion/ej2-calendars/src/datepicker/datepicker.js","../../node_modules/@syncfusion/ej2-calendars/src/timepicker/timepicker.js","../../node_modules/@syncfusion/ej2-calendars/src/datetimepicker/datetimepicker.js","../../node_modules/@syncfusion/ej2-grids/src/grid/common/excel-filter-base.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/filter-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/filter-menu-operator.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/string-filter-ui.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/number-filter-ui.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/boolean-filter-ui.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/date-filter-ui.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/filter-menu-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/checkbox-filter.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/excel-filter.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/filter.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/toolbar.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/footer-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/summary-cell-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/aggregate.js","../../node_modules/@syncfusion/ej2-grids/src/grid/renderer/command-column-renderer.js","../../node_modules/@syncfusion/ej2-grids/src/grid/actions/command-column.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/full-screen.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/html-attributes.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/render.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/link-module.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/view-source.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/table-module.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/renderer/dialog-renderer.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/base/interface.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/models/toolbar-settings.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/models/iframe-settings.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/models/inline-mode.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/actions/enter-key.js","../../node_modules/@syncfusion/ej2-richtexteditor/src/rich-text-editor/base/rich-text-editor.js","../../node_modules/@syncfusion/ej2-react-richtexteditor/src/rich-text-editor/richtexteditor.component.js","../../src/pages/03_Register_Profile/components/QualificationsData.tsx","../../src/components/global/MenuHeaderBar.tsx","../../src/pages/03_Register_Profile/components/RegistrationStatusMsg.tsx","../../node_modules/@syncfusion/ej2-react-notifications/src/toast/toast.component.js","../../node_modules/@syncfusion/ej2-react-notifications/src/message/message.component.js","../../src/components/global/NotificationToast.tsx","../../node_modules/dayjs/dayjs.min.js","../../src/pages/03_Register_Profile/components/VersionSelectDd.tsx","../../src/pages/03_Register_Profile/components/TopicSelection.tsx","../../src/pages/03_Register_Profile/Register.tsx","../../src/global/Auth/RouteGuard.tsx","../../node_modules/@syncfusion/ej2-react-grids/src/grid/columns-directive.js","../../node_modules/@syncfusion/ej2-react-grids/src/grid/aggregates-directive.js","../../node_modules/@syncfusion/ej2-react-grids/src/grid/aggregate-columns-directive.js","../../node_modules/@syncfusion/ej2-react-grids/src/grid/grid.component.js","../../src/pages/02_dozent_(intern)/InstructorList.tsx","../../src/components/IconText.tsx","../../src/pages/01_events/eventDetails.tsx","../../node_modules/@mui/icons-material/People.js","../../src/pages/01_events/eventList.tsx","../../src/pages/01_events/_eventRoutes.tsx","../../src/pages/03_Register_Profile/components/BankData.tsx","../../src/pages/03_Register_Profile/components/WebData.tsx","../../src/pages/03_Register_Profile/components/DocumentUpload.tsx","../../src/pages/03_Register_Profile/components/DocumentsData.tsx","../../src/pages/03_Register_Profile/components/dlgAddressSelector.tsx","../../src/pages/03_Register_Profile/components/DlgCreateAddress.tsx","../../src/pages/03_Register_Profile/components/SemiAddressAssignment.tsx","../../src/hooks/useFetchProfileData.tsx","../../src/pages/03_Register_Profile/Profile.tsx","../../node_modules/uuid/dist/esm-browser/rng.js","../../node_modules/uuid/dist/esm-browser/stringify.js","../../node_modules/uuid/dist/esm-browser/native.js","../../node_modules/uuid/dist/esm-browser/v4.js","../../src/components/global/UploadComponent.tsx","../../src/pages/04_upload/uploadPage.tsx","../../src/global/Auth/Pages.tsx","../../src/global/Auth/PageLayout.tsx","../../src/global/Auth/Header.tsx","../../src/global/Auth/Footer.tsx","../../src/global/LandingPage.tsx","../../src/translations/sf-translations.tsx","../../src/App.tsx","../../src/main.tsx"],"sourcesContent":["/**\n * @license React\n * react.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var l=Symbol.for(\"react.element\"),n=Symbol.for(\"react.portal\"),p=Symbol.for(\"react.fragment\"),q=Symbol.for(\"react.strict_mode\"),r=Symbol.for(\"react.profiler\"),t=Symbol.for(\"react.provider\"),u=Symbol.for(\"react.context\"),v=Symbol.for(\"react.forward_ref\"),w=Symbol.for(\"react.suspense\"),x=Symbol.for(\"react.memo\"),y=Symbol.for(\"react.lazy\"),z=Symbol.iterator;function A(a){if(null===a||\"object\"!==typeof a)return null;a=z&&a[z]||a[\"@@iterator\"];return\"function\"===typeof a?a:null}\nvar B={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},C=Object.assign,D={};function E(a,b,e){this.props=a;this.context=b;this.refs=D;this.updater=e||B}E.prototype.isReactComponent={};\nE.prototype.setState=function(a,b){if(\"object\"!==typeof a&&\"function\"!==typeof a&&null!=a)throw Error(\"setState(...): takes an object of state variables to update or a function which returns an object of state variables.\");this.updater.enqueueSetState(this,a,b,\"setState\")};E.prototype.forceUpdate=function(a){this.updater.enqueueForceUpdate(this,a,\"forceUpdate\")};function F(){}F.prototype=E.prototype;function G(a,b,e){this.props=a;this.context=b;this.refs=D;this.updater=e||B}var H=G.prototype=new F;\nH.constructor=G;C(H,E.prototype);H.isPureReactComponent=!0;var I=Array.isArray,J=Object.prototype.hasOwnProperty,K={current:null},L={key:!0,ref:!0,__self:!0,__source:!0};\nfunction M(a,b,e){var d,c={},k=null,h=null;if(null!=b)for(d in void 0!==b.ref&&(h=b.ref),void 0!==b.key&&(k=\"\"+b.key),b)J.call(b,d)&&!L.hasOwnProperty(d)&&(c[d]=b[d]);var g=arguments.length-2;if(1===g)c.children=e;else if(1>>1,e=a[d];if(0>>1;dg(C,c))ng(x,C)?(a[d]=x,a[n]=c,d=n):(a[d]=C,a[m]=c,d=m);else if(ng(x,c))a[d]=x,a[n]=c,d=n;else break a}}return b}\nfunction g(a,b){var c=a.sortIndex-b.sortIndex;return 0!==c?c:a.id-b.id}if(\"object\"===typeof performance&&\"function\"===typeof performance.now){var l=performance;exports.unstable_now=function(){return l.now()}}else{var p=Date,q=p.now();exports.unstable_now=function(){return p.now()-q}}var r=[],t=[],u=1,v=null,y=3,z=!1,A=!1,B=!1,D=\"function\"===typeof setTimeout?setTimeout:null,E=\"function\"===typeof clearTimeout?clearTimeout:null,F=\"undefined\"!==typeof setImmediate?setImmediate:null;\n\"undefined\"!==typeof navigator&&void 0!==navigator.scheduling&&void 0!==navigator.scheduling.isInputPending&&navigator.scheduling.isInputPending.bind(navigator.scheduling);function G(a){for(var b=h(t);null!==b;){if(null===b.callback)k(t);else if(b.startTime<=a)k(t),b.sortIndex=b.expirationTime,f(r,b);else break;b=h(t)}}function H(a){B=!1;G(a);if(!A)if(null!==h(r))A=!0,I(J);else{var b=h(t);null!==b&&K(H,b.startTime-a)}}\nfunction J(a,b){A=!1;B&&(B=!1,E(L),L=-1);z=!0;var c=y;try{G(b);for(v=h(r);null!==v&&(!(v.expirationTime>b)||a&&!M());){var d=v.callback;if(\"function\"===typeof d){v.callback=null;y=v.priorityLevel;var e=d(v.expirationTime<=b);b=exports.unstable_now();\"function\"===typeof e?v.callback=e:v===h(r)&&k(r);G(b)}else k(r);v=h(r)}if(null!==v)var w=!0;else{var m=h(t);null!==m&&K(H,m.startTime-b);w=!1}return w}finally{v=null,y=c,z=!1}}var N=!1,O=null,L=-1,P=5,Q=-1;\nfunction M(){return exports.unstable_now()-Qa||125d?(a.sortIndex=c,f(t,a),null===h(r)&&a===h(t)&&(B?(E(L),L=-1):B=!0,K(H,c-d))):(a.sortIndex=e,f(r,a),A||z||(A=!0,I(J)));return a};\nexports.unstable_shouldYield=M;exports.unstable_wrapCallback=function(a){var b=y;return function(){var c=y;y=b;try{return a.apply(this,arguments)}finally{y=c}}};\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n module.exports = require('./cjs/scheduler.production.min.js');\n} else {\n module.exports = require('./cjs/scheduler.development.js');\n}\n","/**\n * @license React\n * react-dom.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n/*\n Modernizr 3.0.0pre (Custom Build) | MIT\n*/\n'use strict';var aa=require(\"react\"),ca=require(\"scheduler\");function p(a){for(var b=\"https://reactjs.org/docs/error-decoder.html?invariant=\"+a,c=1;cb}return!1}function v(a,b,c,d,e,f,g){this.acceptsBooleans=2===b||3===b||4===b;this.attributeName=d;this.attributeNamespace=e;this.mustUseProperty=c;this.propertyName=a;this.type=b;this.sanitizeURL=f;this.removeEmptyString=g}var z={};\n\"children dangerouslySetInnerHTML defaultValue defaultChecked innerHTML suppressContentEditableWarning suppressHydrationWarning style\".split(\" \").forEach(function(a){z[a]=new v(a,0,!1,a,null,!1,!1)});[[\"acceptCharset\",\"accept-charset\"],[\"className\",\"class\"],[\"htmlFor\",\"for\"],[\"httpEquiv\",\"http-equiv\"]].forEach(function(a){var b=a[0];z[b]=new v(b,1,!1,a[1],null,!1,!1)});[\"contentEditable\",\"draggable\",\"spellCheck\",\"value\"].forEach(function(a){z[a]=new v(a,2,!1,a.toLowerCase(),null,!1,!1)});\n[\"autoReverse\",\"externalResourcesRequired\",\"focusable\",\"preserveAlpha\"].forEach(function(a){z[a]=new v(a,2,!1,a,null,!1,!1)});\"allowFullScreen async autoFocus autoPlay controls default defer disabled disablePictureInPicture disableRemotePlayback formNoValidate hidden loop noModule noValidate open playsInline readOnly required reversed scoped seamless itemScope\".split(\" \").forEach(function(a){z[a]=new v(a,3,!1,a.toLowerCase(),null,!1,!1)});\n[\"checked\",\"multiple\",\"muted\",\"selected\"].forEach(function(a){z[a]=new v(a,3,!0,a,null,!1,!1)});[\"capture\",\"download\"].forEach(function(a){z[a]=new v(a,4,!1,a,null,!1,!1)});[\"cols\",\"rows\",\"size\",\"span\"].forEach(function(a){z[a]=new v(a,6,!1,a,null,!1,!1)});[\"rowSpan\",\"start\"].forEach(function(a){z[a]=new v(a,5,!1,a.toLowerCase(),null,!1,!1)});var ra=/[\\-:]([a-z])/g;function sa(a){return a[1].toUpperCase()}\n\"accent-height alignment-baseline arabic-form baseline-shift cap-height clip-path clip-rule color-interpolation color-interpolation-filters color-profile color-rendering dominant-baseline enable-background fill-opacity fill-rule flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-name glyph-orientation-horizontal glyph-orientation-vertical horiz-adv-x horiz-origin-x image-rendering letter-spacing lighting-color marker-end marker-mid marker-start overline-position overline-thickness paint-order panose-1 pointer-events rendering-intent shape-rendering stop-color stop-opacity strikethrough-position strikethrough-thickness stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering underline-position underline-thickness unicode-bidi unicode-range units-per-em v-alphabetic v-hanging v-ideographic v-mathematical vector-effect vert-adv-y vert-origin-x vert-origin-y word-spacing writing-mode xmlns:xlink x-height\".split(\" \").forEach(function(a){var b=a.replace(ra,\nsa);z[b]=new v(b,1,!1,a,null,!1,!1)});\"xlink:actuate xlink:arcrole xlink:role xlink:show xlink:title xlink:type\".split(\" \").forEach(function(a){var b=a.replace(ra,sa);z[b]=new v(b,1,!1,a,\"http://www.w3.org/1999/xlink\",!1,!1)});[\"xml:base\",\"xml:lang\",\"xml:space\"].forEach(function(a){var b=a.replace(ra,sa);z[b]=new v(b,1,!1,a,\"http://www.w3.org/XML/1998/namespace\",!1,!1)});[\"tabIndex\",\"crossOrigin\"].forEach(function(a){z[a]=new v(a,1,!1,a.toLowerCase(),null,!1,!1)});\nz.xlinkHref=new v(\"xlinkHref\",1,!1,\"xlink:href\",\"http://www.w3.org/1999/xlink\",!0,!1);[\"src\",\"href\",\"action\",\"formAction\"].forEach(function(a){z[a]=new v(a,1,!1,a.toLowerCase(),null,!0,!0)});\nfunction ta(a,b,c,d){var e=z.hasOwnProperty(b)?z[b]:null;if(null!==e?0!==e.type:d||!(2h||e[g]!==f[h]){var k=\"\\n\"+e[g].replace(\" at new \",\" at \");a.displayName&&k.includes(\"\")&&(k=k.replace(\"\",a.displayName));return k}while(1<=g&&0<=h)}break}}}finally{Na=!1,Error.prepareStackTrace=c}return(a=a?a.displayName||a.name:\"\")?Ma(a):\"\"}\nfunction Pa(a){switch(a.tag){case 5:return Ma(a.type);case 16:return Ma(\"Lazy\");case 13:return Ma(\"Suspense\");case 19:return Ma(\"SuspenseList\");case 0:case 2:case 15:return a=Oa(a.type,!1),a;case 11:return a=Oa(a.type.render,!1),a;case 1:return a=Oa(a.type,!0),a;default:return\"\"}}\nfunction Qa(a){if(null==a)return null;if(\"function\"===typeof a)return a.displayName||a.name||null;if(\"string\"===typeof a)return a;switch(a){case ya:return\"Fragment\";case wa:return\"Portal\";case Aa:return\"Profiler\";case za:return\"StrictMode\";case Ea:return\"Suspense\";case Fa:return\"SuspenseList\"}if(\"object\"===typeof a)switch(a.$$typeof){case Ca:return(a.displayName||\"Context\")+\".Consumer\";case Ba:return(a._context.displayName||\"Context\")+\".Provider\";case Da:var b=a.render;a=a.displayName;a||(a=b.displayName||\nb.name||\"\",a=\"\"!==a?\"ForwardRef(\"+a+\")\":\"ForwardRef\");return a;case Ga:return b=a.displayName||null,null!==b?b:Qa(a.type)||\"Memo\";case Ha:b=a._payload;a=a._init;try{return Qa(a(b))}catch(c){}}return null}\nfunction Ra(a){var b=a.type;switch(a.tag){case 24:return\"Cache\";case 9:return(b.displayName||\"Context\")+\".Consumer\";case 10:return(b._context.displayName||\"Context\")+\".Provider\";case 18:return\"DehydratedFragment\";case 11:return a=b.render,a=a.displayName||a.name||\"\",b.displayName||(\"\"!==a?\"ForwardRef(\"+a+\")\":\"ForwardRef\");case 7:return\"Fragment\";case 5:return b;case 4:return\"Portal\";case 3:return\"Root\";case 6:return\"Text\";case 16:return Qa(b);case 8:return b===za?\"StrictMode\":\"Mode\";case 22:return\"Offscreen\";\ncase 12:return\"Profiler\";case 21:return\"Scope\";case 13:return\"Suspense\";case 19:return\"SuspenseList\";case 25:return\"TracingMarker\";case 1:case 0:case 17:case 2:case 14:case 15:if(\"function\"===typeof b)return b.displayName||b.name||null;if(\"string\"===typeof b)return b}return null}function Sa(a){switch(typeof a){case \"boolean\":case \"number\":case \"string\":case \"undefined\":return a;case \"object\":return a;default:return\"\"}}\nfunction Ta(a){var b=a.type;return(a=a.nodeName)&&\"input\"===a.toLowerCase()&&(\"checkbox\"===b||\"radio\"===b)}\nfunction Ua(a){var b=Ta(a)?\"checked\":\"value\",c=Object.getOwnPropertyDescriptor(a.constructor.prototype,b),d=\"\"+a[b];if(!a.hasOwnProperty(b)&&\"undefined\"!==typeof c&&\"function\"===typeof c.get&&\"function\"===typeof c.set){var e=c.get,f=c.set;Object.defineProperty(a,b,{configurable:!0,get:function(){return e.call(this)},set:function(a){d=\"\"+a;f.call(this,a)}});Object.defineProperty(a,b,{enumerable:c.enumerable});return{getValue:function(){return d},setValue:function(a){d=\"\"+a},stopTracking:function(){a._valueTracker=\nnull;delete a[b]}}}}function Va(a){a._valueTracker||(a._valueTracker=Ua(a))}function Wa(a){if(!a)return!1;var b=a._valueTracker;if(!b)return!0;var c=b.getValue();var d=\"\";a&&(d=Ta(a)?a.checked?\"true\":\"false\":a.value);a=d;return a!==c?(b.setValue(a),!0):!1}function Xa(a){a=a||(\"undefined\"!==typeof document?document:void 0);if(\"undefined\"===typeof a)return null;try{return a.activeElement||a.body}catch(b){return a.body}}\nfunction Ya(a,b){var c=b.checked;return A({},b,{defaultChecked:void 0,defaultValue:void 0,value:void 0,checked:null!=c?c:a._wrapperState.initialChecked})}function Za(a,b){var c=null==b.defaultValue?\"\":b.defaultValue,d=null!=b.checked?b.checked:b.defaultChecked;c=Sa(null!=b.value?b.value:c);a._wrapperState={initialChecked:d,initialValue:c,controlled:\"checkbox\"===b.type||\"radio\"===b.type?null!=b.checked:null!=b.value}}function ab(a,b){b=b.checked;null!=b&&ta(a,\"checked\",b,!1)}\nfunction bb(a,b){ab(a,b);var c=Sa(b.value),d=b.type;if(null!=c)if(\"number\"===d){if(0===c&&\"\"===a.value||a.value!=c)a.value=\"\"+c}else a.value!==\"\"+c&&(a.value=\"\"+c);else if(\"submit\"===d||\"reset\"===d){a.removeAttribute(\"value\");return}b.hasOwnProperty(\"value\")?cb(a,b.type,c):b.hasOwnProperty(\"defaultValue\")&&cb(a,b.type,Sa(b.defaultValue));null==b.checked&&null!=b.defaultChecked&&(a.defaultChecked=!!b.defaultChecked)}\nfunction db(a,b,c){if(b.hasOwnProperty(\"value\")||b.hasOwnProperty(\"defaultValue\")){var d=b.type;if(!(\"submit\"!==d&&\"reset\"!==d||void 0!==b.value&&null!==b.value))return;b=\"\"+a._wrapperState.initialValue;c||b===a.value||(a.value=b);a.defaultValue=b}c=a.name;\"\"!==c&&(a.name=\"\");a.defaultChecked=!!a._wrapperState.initialChecked;\"\"!==c&&(a.name=c)}\nfunction cb(a,b,c){if(\"number\"!==b||Xa(a.ownerDocument)!==a)null==c?a.defaultValue=\"\"+a._wrapperState.initialValue:a.defaultValue!==\"\"+c&&(a.defaultValue=\"\"+c)}var eb=Array.isArray;\nfunction fb(a,b,c,d){a=a.options;if(b){b={};for(var e=0;e\"+b.valueOf().toString()+\"\";for(b=mb.firstChild;a.firstChild;)a.removeChild(a.firstChild);for(;b.firstChild;)a.appendChild(b.firstChild)}});\nfunction ob(a,b){if(b){var c=a.firstChild;if(c&&c===a.lastChild&&3===c.nodeType){c.nodeValue=b;return}}a.textContent=b}\nvar pb={animationIterationCount:!0,aspectRatio:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,\nzoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},qb=[\"Webkit\",\"ms\",\"Moz\",\"O\"];Object.keys(pb).forEach(function(a){qb.forEach(function(b){b=b+a.charAt(0).toUpperCase()+a.substring(1);pb[b]=pb[a]})});function rb(a,b,c){return null==b||\"boolean\"===typeof b||\"\"===b?\"\":c||\"number\"!==typeof b||0===b||pb.hasOwnProperty(a)&&pb[a]?(\"\"+b).trim():b+\"px\"}\nfunction sb(a,b){a=a.style;for(var c in b)if(b.hasOwnProperty(c)){var d=0===c.indexOf(\"--\"),e=rb(c,b[c],d);\"float\"===c&&(c=\"cssFloat\");d?a.setProperty(c,e):a[c]=e}}var tb=A({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0});\nfunction ub(a,b){if(b){if(tb[a]&&(null!=b.children||null!=b.dangerouslySetInnerHTML))throw Error(p(137,a));if(null!=b.dangerouslySetInnerHTML){if(null!=b.children)throw Error(p(60));if(\"object\"!==typeof b.dangerouslySetInnerHTML||!(\"__html\"in b.dangerouslySetInnerHTML))throw Error(p(61));}if(null!=b.style&&\"object\"!==typeof b.style)throw Error(p(62));}}\nfunction vb(a,b){if(-1===a.indexOf(\"-\"))return\"string\"===typeof b.is;switch(a){case \"annotation-xml\":case \"color-profile\":case \"font-face\":case \"font-face-src\":case \"font-face-uri\":case \"font-face-format\":case \"font-face-name\":case \"missing-glyph\":return!1;default:return!0}}var wb=null;function xb(a){a=a.target||a.srcElement||window;a.correspondingUseElement&&(a=a.correspondingUseElement);return 3===a.nodeType?a.parentNode:a}var yb=null,zb=null,Ab=null;\nfunction Bb(a){if(a=Cb(a)){if(\"function\"!==typeof yb)throw Error(p(280));var b=a.stateNode;b&&(b=Db(b),yb(a.stateNode,a.type,b))}}function Eb(a){zb?Ab?Ab.push(a):Ab=[a]:zb=a}function Fb(){if(zb){var a=zb,b=Ab;Ab=zb=null;Bb(a);if(b)for(a=0;a>>=0;return 0===a?32:31-(pc(a)/qc|0)|0}var rc=64,sc=4194304;\nfunction tc(a){switch(a&-a){case 1:return 1;case 2:return 2;case 4:return 4;case 8:return 8;case 16:return 16;case 32:return 32;case 64:case 128:case 256:case 512:case 1024:case 2048:case 4096:case 8192:case 16384:case 32768:case 65536:case 131072:case 262144:case 524288:case 1048576:case 2097152:return a&4194240;case 4194304:case 8388608:case 16777216:case 33554432:case 67108864:return a&130023424;case 134217728:return 134217728;case 268435456:return 268435456;case 536870912:return 536870912;case 1073741824:return 1073741824;\ndefault:return a}}function uc(a,b){var c=a.pendingLanes;if(0===c)return 0;var d=0,e=a.suspendedLanes,f=a.pingedLanes,g=c&268435455;if(0!==g){var h=g&~e;0!==h?d=tc(h):(f&=g,0!==f&&(d=tc(f)))}else g=c&~e,0!==g?d=tc(g):0!==f&&(d=tc(f));if(0===d)return 0;if(0!==b&&b!==d&&0===(b&e)&&(e=d&-d,f=b&-b,e>=f||16===e&&0!==(f&4194240)))return b;0!==(d&4)&&(d|=c&16);b=a.entangledLanes;if(0!==b)for(a=a.entanglements,b&=d;0c;c++)b.push(a);return b}\nfunction Ac(a,b,c){a.pendingLanes|=b;536870912!==b&&(a.suspendedLanes=0,a.pingedLanes=0);a=a.eventTimes;b=31-oc(b);a[b]=c}function Bc(a,b){var c=a.pendingLanes&~b;a.pendingLanes=b;a.suspendedLanes=0;a.pingedLanes=0;a.expiredLanes&=b;a.mutableReadLanes&=b;a.entangledLanes&=b;b=a.entanglements;var d=a.eventTimes;for(a=a.expirationTimes;0=be),ee=String.fromCharCode(32),fe=!1;\nfunction ge(a,b){switch(a){case \"keyup\":return-1!==$d.indexOf(b.keyCode);case \"keydown\":return 229!==b.keyCode;case \"keypress\":case \"mousedown\":case \"focusout\":return!0;default:return!1}}function he(a){a=a.detail;return\"object\"===typeof a&&\"data\"in a?a.data:null}var ie=!1;function je(a,b){switch(a){case \"compositionend\":return he(b);case \"keypress\":if(32!==b.which)return null;fe=!0;return ee;case \"textInput\":return a=b.data,a===ee&&fe?null:a;default:return null}}\nfunction ke(a,b){if(ie)return\"compositionend\"===a||!ae&&ge(a,b)?(a=nd(),md=ld=kd=null,ie=!1,a):null;switch(a){case \"paste\":return null;case \"keypress\":if(!(b.ctrlKey||b.altKey||b.metaKey)||b.ctrlKey&&b.altKey){if(b.char&&1=b)return{node:c,offset:b-a};a=d}a:{for(;c;){if(c.nextSibling){c=c.nextSibling;break a}c=c.parentNode}c=void 0}c=Je(c)}}function Le(a,b){return a&&b?a===b?!0:a&&3===a.nodeType?!1:b&&3===b.nodeType?Le(a,b.parentNode):\"contains\"in a?a.contains(b):a.compareDocumentPosition?!!(a.compareDocumentPosition(b)&16):!1:!1}\nfunction Me(){for(var a=window,b=Xa();b instanceof a.HTMLIFrameElement;){try{var c=\"string\"===typeof b.contentWindow.location.href}catch(d){c=!1}if(c)a=b.contentWindow;else break;b=Xa(a.document)}return b}function Ne(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return b&&(\"input\"===b&&(\"text\"===a.type||\"search\"===a.type||\"tel\"===a.type||\"url\"===a.type||\"password\"===a.type)||\"textarea\"===b||\"true\"===a.contentEditable)}\nfunction Oe(a){var b=Me(),c=a.focusedElem,d=a.selectionRange;if(b!==c&&c&&c.ownerDocument&&Le(c.ownerDocument.documentElement,c)){if(null!==d&&Ne(c))if(b=d.start,a=d.end,void 0===a&&(a=b),\"selectionStart\"in c)c.selectionStart=b,c.selectionEnd=Math.min(a,c.value.length);else if(a=(b=c.ownerDocument||document)&&b.defaultView||window,a.getSelection){a=a.getSelection();var e=c.textContent.length,f=Math.min(d.start,e);d=void 0===d.end?f:Math.min(d.end,e);!a.extend&&f>d&&(e=d,d=f,f=e);e=Ke(c,f);var g=Ke(c,\nd);e&&g&&(1!==a.rangeCount||a.anchorNode!==e.node||a.anchorOffset!==e.offset||a.focusNode!==g.node||a.focusOffset!==g.offset)&&(b=b.createRange(),b.setStart(e.node,e.offset),a.removeAllRanges(),f>d?(a.addRange(b),a.extend(g.node,g.offset)):(b.setEnd(g.node,g.offset),a.addRange(b)))}b=[];for(a=c;a=a.parentNode;)1===a.nodeType&&b.push({element:a,left:a.scrollLeft,top:a.scrollTop});\"function\"===typeof c.focus&&c.focus();for(c=0;c=document.documentMode,Qe=null,Re=null,Se=null,Te=!1;\nfunction Ue(a,b,c){var d=c.window===c?c.document:9===c.nodeType?c:c.ownerDocument;Te||null==Qe||Qe!==Xa(d)||(d=Qe,\"selectionStart\"in d&&Ne(d)?d={start:d.selectionStart,end:d.selectionEnd}:(d=(d.ownerDocument&&d.ownerDocument.defaultView||window).getSelection(),d={anchorNode:d.anchorNode,anchorOffset:d.anchorOffset,focusNode:d.focusNode,focusOffset:d.focusOffset}),Se&&Ie(Se,d)||(Se=d,d=oe(Re,\"onSelect\"),0Tf||(a.current=Sf[Tf],Sf[Tf]=null,Tf--)}function G(a,b){Tf++;Sf[Tf]=a.current;a.current=b}var Vf={},H=Uf(Vf),Wf=Uf(!1),Xf=Vf;function Yf(a,b){var c=a.type.contextTypes;if(!c)return Vf;var d=a.stateNode;if(d&&d.__reactInternalMemoizedUnmaskedChildContext===b)return d.__reactInternalMemoizedMaskedChildContext;var e={},f;for(f in c)e[f]=b[f];d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=b,a.__reactInternalMemoizedMaskedChildContext=e);return e}\nfunction Zf(a){a=a.childContextTypes;return null!==a&&void 0!==a}function $f(){E(Wf);E(H)}function ag(a,b,c){if(H.current!==Vf)throw Error(p(168));G(H,b);G(Wf,c)}function bg(a,b,c){var d=a.stateNode;b=b.childContextTypes;if(\"function\"!==typeof d.getChildContext)return c;d=d.getChildContext();for(var e in d)if(!(e in b))throw Error(p(108,Ra(a)||\"Unknown\",e));return A({},c,d)}\nfunction cg(a){a=(a=a.stateNode)&&a.__reactInternalMemoizedMergedChildContext||Vf;Xf=H.current;G(H,a);G(Wf,Wf.current);return!0}function dg(a,b,c){var d=a.stateNode;if(!d)throw Error(p(169));c?(a=bg(a,b,Xf),d.__reactInternalMemoizedMergedChildContext=a,E(Wf),E(H),G(H,a)):E(Wf);G(Wf,c)}var eg=null,fg=!1,gg=!1;function hg(a){null===eg?eg=[a]:eg.push(a)}function ig(a){fg=!0;hg(a)}\nfunction jg(){if(!gg&&null!==eg){gg=!0;var a=0,b=C;try{var c=eg;for(C=1;a>=g;e-=g;rg=1<<32-oc(b)+e|c<w?(x=u,u=null):x=u.sibling;var n=r(e,u,h[w],k);if(null===n){null===u&&(u=x);break}a&&u&&null===n.alternate&&b(e,u);g=f(n,g,w);null===m?l=n:m.sibling=n;m=n;u=x}if(w===h.length)return c(e,u),I&&tg(e,w),l;if(null===u){for(;ww?(x=m,m=null):x=m.sibling;var t=r(e,m,n.value,k);if(null===t){null===m&&(m=x);break}a&&m&&null===t.alternate&&b(e,m);g=f(t,g,w);null===u?l=t:u.sibling=t;u=t;m=x}if(n.done)return c(e,\nm),I&&tg(e,w),l;if(null===m){for(;!n.done;w++,n=h.next())n=q(e,n.value,k),null!==n&&(g=f(n,g,w),null===u?l=n:u.sibling=n,u=n);I&&tg(e,w);return l}for(m=d(e,m);!n.done;w++,n=h.next())n=y(m,e,w,n.value,k),null!==n&&(a&&null!==n.alternate&&m.delete(null===n.key?w:n.key),g=f(n,g,w),null===u?l=n:u.sibling=n,u=n);a&&m.forEach(function(a){return b(e,a)});I&&tg(e,w);return l}function J(a,d,f,h){\"object\"===typeof f&&null!==f&&f.type===ya&&null===f.key&&(f=f.props.children);if(\"object\"===typeof f&&null!==f){switch(f.$$typeof){case va:a:{for(var k=\nf.key,l=d;null!==l;){if(l.key===k){k=f.type;if(k===ya){if(7===l.tag){c(a,l.sibling);d=e(l,f.props.children);d.return=a;a=d;break a}}else if(l.elementType===k||\"object\"===typeof k&&null!==k&&k.$$typeof===Ha&&Ng(k)===l.type){c(a,l.sibling);d=e(l,f.props);d.ref=Lg(a,l,f);d.return=a;a=d;break a}c(a,l);break}else b(a,l);l=l.sibling}f.type===ya?(d=Tg(f.props.children,a.mode,h,f.key),d.return=a,a=d):(h=Rg(f.type,f.key,f.props,null,a.mode,h),h.ref=Lg(a,d,f),h.return=a,a=h)}return g(a);case wa:a:{for(l=f.key;null!==\nd;){if(d.key===l)if(4===d.tag&&d.stateNode.containerInfo===f.containerInfo&&d.stateNode.implementation===f.implementation){c(a,d.sibling);d=e(d,f.children||[]);d.return=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=Sg(f,a.mode,h);d.return=a;a=d}return g(a);case Ha:return l=f._init,J(a,d,l(f._payload),h)}if(eb(f))return n(a,d,f,h);if(Ka(f))return t(a,d,f,h);Mg(a,f)}return\"string\"===typeof f&&\"\"!==f||\"number\"===typeof f?(f=\"\"+f,null!==d&&6===d.tag?(c(a,d.sibling),d=e(d,f),d.return=a,a=d):\n(c(a,d),d=Qg(f,a.mode,h),d.return=a,a=d),g(a)):c(a,d)}return J}var Ug=Og(!0),Vg=Og(!1),Wg=Uf(null),Xg=null,Yg=null,Zg=null;function $g(){Zg=Yg=Xg=null}function ah(a){var b=Wg.current;E(Wg);a._currentValue=b}function bh(a,b,c){for(;null!==a;){var d=a.alternate;(a.childLanes&b)!==b?(a.childLanes|=b,null!==d&&(d.childLanes|=b)):null!==d&&(d.childLanes&b)!==b&&(d.childLanes|=b);if(a===c)break;a=a.return}}\nfunction ch(a,b){Xg=a;Zg=Yg=null;a=a.dependencies;null!==a&&null!==a.firstContext&&(0!==(a.lanes&b)&&(dh=!0),a.firstContext=null)}function eh(a){var b=a._currentValue;if(Zg!==a)if(a={context:a,memoizedValue:b,next:null},null===Yg){if(null===Xg)throw Error(p(308));Yg=a;Xg.dependencies={lanes:0,firstContext:a}}else Yg=Yg.next=a;return b}var fh=null;function gh(a){null===fh?fh=[a]:fh.push(a)}\nfunction hh(a,b,c,d){var e=b.interleaved;null===e?(c.next=c,gh(b)):(c.next=e.next,e.next=c);b.interleaved=c;return ih(a,d)}function ih(a,b){a.lanes|=b;var c=a.alternate;null!==c&&(c.lanes|=b);c=a;for(a=a.return;null!==a;)a.childLanes|=b,c=a.alternate,null!==c&&(c.childLanes|=b),c=a,a=a.return;return 3===c.tag?c.stateNode:null}var jh=!1;function kh(a){a.updateQueue={baseState:a.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null,interleaved:null,lanes:0},effects:null}}\nfunction lh(a,b){a=a.updateQueue;b.updateQueue===a&&(b.updateQueue={baseState:a.baseState,firstBaseUpdate:a.firstBaseUpdate,lastBaseUpdate:a.lastBaseUpdate,shared:a.shared,effects:a.effects})}function mh(a,b){return{eventTime:a,lane:b,tag:0,payload:null,callback:null,next:null}}\nfunction nh(a,b,c){var d=a.updateQueue;if(null===d)return null;d=d.shared;if(0!==(K&2)){var e=d.pending;null===e?b.next=b:(b.next=e.next,e.next=b);d.pending=b;return ih(a,c)}e=d.interleaved;null===e?(b.next=b,gh(d)):(b.next=e.next,e.next=b);d.interleaved=b;return ih(a,c)}function oh(a,b,c){b=b.updateQueue;if(null!==b&&(b=b.shared,0!==(c&4194240))){var d=b.lanes;d&=a.pendingLanes;c|=d;b.lanes=c;Cc(a,c)}}\nfunction ph(a,b){var c=a.updateQueue,d=a.alternate;if(null!==d&&(d=d.updateQueue,c===d)){var e=null,f=null;c=c.firstBaseUpdate;if(null!==c){do{var g={eventTime:c.eventTime,lane:c.lane,tag:c.tag,payload:c.payload,callback:c.callback,next:null};null===f?e=f=g:f=f.next=g;c=c.next}while(null!==c);null===f?e=f=b:f=f.next=b}else e=f=b;c={baseState:d.baseState,firstBaseUpdate:e,lastBaseUpdate:f,shared:d.shared,effects:d.effects};a.updateQueue=c;return}a=c.lastBaseUpdate;null===a?c.firstBaseUpdate=b:a.next=\nb;c.lastBaseUpdate=b}\nfunction qh(a,b,c,d){var e=a.updateQueue;jh=!1;var f=e.firstBaseUpdate,g=e.lastBaseUpdate,h=e.shared.pending;if(null!==h){e.shared.pending=null;var k=h,l=k.next;k.next=null;null===g?f=l:g.next=l;g=k;var m=a.alternate;null!==m&&(m=m.updateQueue,h=m.lastBaseUpdate,h!==g&&(null===h?m.firstBaseUpdate=l:h.next=l,m.lastBaseUpdate=k))}if(null!==f){var q=e.baseState;g=0;m=l=k=null;h=f;do{var r=h.lane,y=h.eventTime;if((d&r)===r){null!==m&&(m=m.next={eventTime:y,lane:0,tag:h.tag,payload:h.payload,callback:h.callback,\nnext:null});a:{var n=a,t=h;r=b;y=c;switch(t.tag){case 1:n=t.payload;if(\"function\"===typeof n){q=n.call(y,q,r);break a}q=n;break a;case 3:n.flags=n.flags&-65537|128;case 0:n=t.payload;r=\"function\"===typeof n?n.call(y,q,r):n;if(null===r||void 0===r)break a;q=A({},q,r);break a;case 2:jh=!0}}null!==h.callback&&0!==h.lane&&(a.flags|=64,r=e.effects,null===r?e.effects=[h]:r.push(h))}else y={eventTime:y,lane:r,tag:h.tag,payload:h.payload,callback:h.callback,next:null},null===m?(l=m=y,k=q):m=m.next=y,g|=r;\nh=h.next;if(null===h)if(h=e.shared.pending,null===h)break;else r=h,h=r.next,r.next=null,e.lastBaseUpdate=r,e.shared.pending=null}while(1);null===m&&(k=q);e.baseState=k;e.firstBaseUpdate=l;e.lastBaseUpdate=m;b=e.shared.interleaved;if(null!==b){e=b;do g|=e.lane,e=e.next;while(e!==b)}else null===f&&(e.shared.lanes=0);rh|=g;a.lanes=g;a.memoizedState=q}}\nfunction sh(a,b,c){a=b.effects;b.effects=null;if(null!==a)for(b=0;bc?c:4;a(!0);var d=Gh.transition;Gh.transition={};try{a(!1),b()}finally{C=c,Gh.transition=d}}function wi(){return Uh().memoizedState}\nfunction xi(a,b,c){var d=yi(a);c={lane:d,action:c,hasEagerState:!1,eagerState:null,next:null};if(zi(a))Ai(b,c);else if(c=hh(a,b,c,d),null!==c){var e=R();gi(c,a,d,e);Bi(c,b,d)}}\nfunction ii(a,b,c){var d=yi(a),e={lane:d,action:c,hasEagerState:!1,eagerState:null,next:null};if(zi(a))Ai(b,e);else{var f=a.alternate;if(0===a.lanes&&(null===f||0===f.lanes)&&(f=b.lastRenderedReducer,null!==f))try{var g=b.lastRenderedState,h=f(g,c);e.hasEagerState=!0;e.eagerState=h;if(He(h,g)){var k=b.interleaved;null===k?(e.next=e,gh(b)):(e.next=k.next,k.next=e);b.interleaved=e;return}}catch(l){}finally{}c=hh(a,b,e,d);null!==c&&(e=R(),gi(c,a,d,e),Bi(c,b,d))}}\nfunction zi(a){var b=a.alternate;return a===M||null!==b&&b===M}function Ai(a,b){Jh=Ih=!0;var c=a.pending;null===c?b.next=b:(b.next=c.next,c.next=b);a.pending=b}function Bi(a,b,c){if(0!==(c&4194240)){var d=b.lanes;d&=a.pendingLanes;c|=d;b.lanes=c;Cc(a,c)}}\nvar Rh={readContext:eh,useCallback:P,useContext:P,useEffect:P,useImperativeHandle:P,useInsertionEffect:P,useLayoutEffect:P,useMemo:P,useReducer:P,useRef:P,useState:P,useDebugValue:P,useDeferredValue:P,useTransition:P,useMutableSource:P,useSyncExternalStore:P,useId:P,unstable_isNewReconciler:!1},Oh={readContext:eh,useCallback:function(a,b){Th().memoizedState=[a,void 0===b?null:b];return a},useContext:eh,useEffect:mi,useImperativeHandle:function(a,b,c){c=null!==c&&void 0!==c?c.concat([a]):null;return ki(4194308,\n4,pi.bind(null,b,a),c)},useLayoutEffect:function(a,b){return ki(4194308,4,a,b)},useInsertionEffect:function(a,b){return ki(4,2,a,b)},useMemo:function(a,b){var c=Th();b=void 0===b?null:b;a=a();c.memoizedState=[a,b];return a},useReducer:function(a,b,c){var d=Th();b=void 0!==c?c(b):b;d.memoizedState=d.baseState=b;a={pending:null,interleaved:null,lanes:0,dispatch:null,lastRenderedReducer:a,lastRenderedState:b};d.queue=a;a=a.dispatch=xi.bind(null,M,a);return[d.memoizedState,a]},useRef:function(a){var b=\nTh();a={current:a};return b.memoizedState=a},useState:hi,useDebugValue:ri,useDeferredValue:function(a){return Th().memoizedState=a},useTransition:function(){var a=hi(!1),b=a[0];a=vi.bind(null,a[1]);Th().memoizedState=a;return[b,a]},useMutableSource:function(){},useSyncExternalStore:function(a,b,c){var d=M,e=Th();if(I){if(void 0===c)throw Error(p(407));c=c()}else{c=b();if(null===Q)throw Error(p(349));0!==(Hh&30)||di(d,b,c)}e.memoizedState=c;var f={value:c,getSnapshot:b};e.queue=f;mi(ai.bind(null,d,\nf,a),[a]);d.flags|=2048;bi(9,ci.bind(null,d,f,c,b),void 0,null);return c},useId:function(){var a=Th(),b=Q.identifierPrefix;if(I){var c=sg;var d=rg;c=(d&~(1<<32-oc(d)-1)).toString(32)+c;b=\":\"+b+\"R\"+c;c=Kh++;0\\x3c/script>\",a=a.removeChild(a.firstChild)):\n\"string\"===typeof d.is?a=g.createElement(c,{is:d.is}):(a=g.createElement(c),\"select\"===c&&(g=a,d.multiple?g.multiple=!0:d.size&&(g.size=d.size))):a=g.createElementNS(a,c);a[Of]=b;a[Pf]=d;zj(a,b,!1,!1);b.stateNode=a;a:{g=vb(c,d);switch(c){case \"dialog\":D(\"cancel\",a);D(\"close\",a);e=d;break;case \"iframe\":case \"object\":case \"embed\":D(\"load\",a);e=d;break;case \"video\":case \"audio\":for(e=0;eGj&&(b.flags|=128,d=!0,Dj(f,!1),b.lanes=4194304)}else{if(!d)if(a=Ch(g),null!==a){if(b.flags|=128,d=!0,c=a.updateQueue,null!==c&&(b.updateQueue=c,b.flags|=4),Dj(f,!0),null===f.tail&&\"hidden\"===f.tailMode&&!g.alternate&&!I)return S(b),null}else 2*B()-f.renderingStartTime>Gj&&1073741824!==c&&(b.flags|=128,d=!0,Dj(f,!1),b.lanes=4194304);f.isBackwards?(g.sibling=b.child,b.child=g):(c=f.last,null!==c?c.sibling=g:b.child=g,f.last=g)}if(null!==f.tail)return b=f.tail,f.rendering=\nb,f.tail=b.sibling,f.renderingStartTime=B(),b.sibling=null,c=L.current,G(L,d?c&1|2:c&1),b;S(b);return null;case 22:case 23:return Hj(),d=null!==b.memoizedState,null!==a&&null!==a.memoizedState!==d&&(b.flags|=8192),d&&0!==(b.mode&1)?0!==(fj&1073741824)&&(S(b),b.subtreeFlags&6&&(b.flags|=8192)):S(b),null;case 24:return null;case 25:return null}throw Error(p(156,b.tag));}\nfunction Ij(a,b){wg(b);switch(b.tag){case 1:return Zf(b.type)&&$f(),a=b.flags,a&65536?(b.flags=a&-65537|128,b):null;case 3:return zh(),E(Wf),E(H),Eh(),a=b.flags,0!==(a&65536)&&0===(a&128)?(b.flags=a&-65537|128,b):null;case 5:return Bh(b),null;case 13:E(L);a=b.memoizedState;if(null!==a&&null!==a.dehydrated){if(null===b.alternate)throw Error(p(340));Ig()}a=b.flags;return a&65536?(b.flags=a&-65537|128,b):null;case 19:return E(L),null;case 4:return zh(),null;case 10:return ah(b.type._context),null;case 22:case 23:return Hj(),\nnull;case 24:return null;default:return null}}var Jj=!1,U=!1,Kj=\"function\"===typeof WeakSet?WeakSet:Set,V=null;function Lj(a,b){var c=a.ref;if(null!==c)if(\"function\"===typeof c)try{c(null)}catch(d){W(a,b,d)}else c.current=null}function Mj(a,b,c){try{c()}catch(d){W(a,b,d)}}var Nj=!1;\nfunction Oj(a,b){Cf=dd;a=Me();if(Ne(a)){if(\"selectionStart\"in a)var c={start:a.selectionStart,end:a.selectionEnd};else a:{c=(c=a.ownerDocument)&&c.defaultView||window;var d=c.getSelection&&c.getSelection();if(d&&0!==d.rangeCount){c=d.anchorNode;var e=d.anchorOffset,f=d.focusNode;d=d.focusOffset;try{c.nodeType,f.nodeType}catch(F){c=null;break a}var g=0,h=-1,k=-1,l=0,m=0,q=a,r=null;b:for(;;){for(var y;;){q!==c||0!==e&&3!==q.nodeType||(h=g+e);q!==f||0!==d&&3!==q.nodeType||(k=g+d);3===q.nodeType&&(g+=\nq.nodeValue.length);if(null===(y=q.firstChild))break;r=q;q=y}for(;;){if(q===a)break b;r===c&&++l===e&&(h=g);r===f&&++m===d&&(k=g);if(null!==(y=q.nextSibling))break;q=r;r=q.parentNode}q=y}c=-1===h||-1===k?null:{start:h,end:k}}else c=null}c=c||{start:0,end:0}}else c=null;Df={focusedElem:a,selectionRange:c};dd=!1;for(V=b;null!==V;)if(b=V,a=b.child,0!==(b.subtreeFlags&1028)&&null!==a)a.return=b,V=a;else for(;null!==V;){b=V;try{var n=b.alternate;if(0!==(b.flags&1024))switch(b.tag){case 0:case 11:case 15:break;\ncase 1:if(null!==n){var t=n.memoizedProps,J=n.memoizedState,x=b.stateNode,w=x.getSnapshotBeforeUpdate(b.elementType===b.type?t:Ci(b.type,t),J);x.__reactInternalSnapshotBeforeUpdate=w}break;case 3:var u=b.stateNode.containerInfo;1===u.nodeType?u.textContent=\"\":9===u.nodeType&&u.documentElement&&u.removeChild(u.documentElement);break;case 5:case 6:case 4:case 17:break;default:throw Error(p(163));}}catch(F){W(b,b.return,F)}a=b.sibling;if(null!==a){a.return=b.return;V=a;break}V=b.return}n=Nj;Nj=!1;return n}\nfunction Pj(a,b,c){var d=b.updateQueue;d=null!==d?d.lastEffect:null;if(null!==d){var e=d=d.next;do{if((e.tag&a)===a){var f=e.destroy;e.destroy=void 0;void 0!==f&&Mj(b,c,f)}e=e.next}while(e!==d)}}function Qj(a,b){b=b.updateQueue;b=null!==b?b.lastEffect:null;if(null!==b){var c=b=b.next;do{if((c.tag&a)===a){var d=c.create;c.destroy=d()}c=c.next}while(c!==b)}}function Rj(a){var b=a.ref;if(null!==b){var c=a.stateNode;switch(a.tag){case 5:a=c;break;default:a=c}\"function\"===typeof b?b(a):b.current=a}}\nfunction Sj(a){var b=a.alternate;null!==b&&(a.alternate=null,Sj(b));a.child=null;a.deletions=null;a.sibling=null;5===a.tag&&(b=a.stateNode,null!==b&&(delete b[Of],delete b[Pf],delete b[of],delete b[Qf],delete b[Rf]));a.stateNode=null;a.return=null;a.dependencies=null;a.memoizedProps=null;a.memoizedState=null;a.pendingProps=null;a.stateNode=null;a.updateQueue=null}function Tj(a){return 5===a.tag||3===a.tag||4===a.tag}\nfunction Uj(a){a:for(;;){for(;null===a.sibling;){if(null===a.return||Tj(a.return))return null;a=a.return}a.sibling.return=a.return;for(a=a.sibling;5!==a.tag&&6!==a.tag&&18!==a.tag;){if(a.flags&2)continue a;if(null===a.child||4===a.tag)continue a;else a.child.return=a,a=a.child}if(!(a.flags&2))return a.stateNode}}\nfunction Vj(a,b,c){var d=a.tag;if(5===d||6===d)a=a.stateNode,b?8===c.nodeType?c.parentNode.insertBefore(a,b):c.insertBefore(a,b):(8===c.nodeType?(b=c.parentNode,b.insertBefore(a,c)):(b=c,b.appendChild(a)),c=c._reactRootContainer,null!==c&&void 0!==c||null!==b.onclick||(b.onclick=Bf));else if(4!==d&&(a=a.child,null!==a))for(Vj(a,b,c),a=a.sibling;null!==a;)Vj(a,b,c),a=a.sibling}\nfunction Wj(a,b,c){var d=a.tag;if(5===d||6===d)a=a.stateNode,b?c.insertBefore(a,b):c.appendChild(a);else if(4!==d&&(a=a.child,null!==a))for(Wj(a,b,c),a=a.sibling;null!==a;)Wj(a,b,c),a=a.sibling}var X=null,Xj=!1;function Yj(a,b,c){for(c=c.child;null!==c;)Zj(a,b,c),c=c.sibling}\nfunction Zj(a,b,c){if(lc&&\"function\"===typeof lc.onCommitFiberUnmount)try{lc.onCommitFiberUnmount(kc,c)}catch(h){}switch(c.tag){case 5:U||Lj(c,b);case 6:var d=X,e=Xj;X=null;Yj(a,b,c);X=d;Xj=e;null!==X&&(Xj?(a=X,c=c.stateNode,8===a.nodeType?a.parentNode.removeChild(c):a.removeChild(c)):X.removeChild(c.stateNode));break;case 18:null!==X&&(Xj?(a=X,c=c.stateNode,8===a.nodeType?Kf(a.parentNode,c):1===a.nodeType&&Kf(a,c),bd(a)):Kf(X,c.stateNode));break;case 4:d=X;e=Xj;X=c.stateNode.containerInfo;Xj=!0;\nYj(a,b,c);X=d;Xj=e;break;case 0:case 11:case 14:case 15:if(!U&&(d=c.updateQueue,null!==d&&(d=d.lastEffect,null!==d))){e=d=d.next;do{var f=e,g=f.destroy;f=f.tag;void 0!==g&&(0!==(f&2)?Mj(c,b,g):0!==(f&4)&&Mj(c,b,g));e=e.next}while(e!==d)}Yj(a,b,c);break;case 1:if(!U&&(Lj(c,b),d=c.stateNode,\"function\"===typeof d.componentWillUnmount))try{d.props=c.memoizedProps,d.state=c.memoizedState,d.componentWillUnmount()}catch(h){W(c,b,h)}Yj(a,b,c);break;case 21:Yj(a,b,c);break;case 22:c.mode&1?(U=(d=U)||null!==\nc.memoizedState,Yj(a,b,c),U=d):Yj(a,b,c);break;default:Yj(a,b,c)}}function ak(a){var b=a.updateQueue;if(null!==b){a.updateQueue=null;var c=a.stateNode;null===c&&(c=a.stateNode=new Kj);b.forEach(function(b){var d=bk.bind(null,a,b);c.has(b)||(c.add(b),b.then(d,d))})}}\nfunction ck(a,b){var c=b.deletions;if(null!==c)for(var d=0;de&&(e=g);d&=~f}d=e;d=B()-d;d=(120>d?120:480>d?480:1080>d?1080:1920>d?1920:3E3>d?3E3:4320>d?4320:1960*lk(d/1960))-d;if(10a?16:a;if(null===wk)var d=!1;else{a=wk;wk=null;xk=0;if(0!==(K&6))throw Error(p(331));var e=K;K|=4;for(V=a.current;null!==V;){var f=V,g=f.child;if(0!==(V.flags&16)){var h=f.deletions;if(null!==h){for(var k=0;kB()-fk?Kk(a,0):rk|=c);Dk(a,b)}function Yk(a,b){0===b&&(0===(a.mode&1)?b=1:(b=sc,sc<<=1,0===(sc&130023424)&&(sc=4194304)));var c=R();a=ih(a,b);null!==a&&(Ac(a,b,c),Dk(a,c))}function uj(a){var b=a.memoizedState,c=0;null!==b&&(c=b.retryLane);Yk(a,c)}\nfunction bk(a,b){var c=0;switch(a.tag){case 13:var d=a.stateNode;var e=a.memoizedState;null!==e&&(c=e.retryLane);break;case 19:d=a.stateNode;break;default:throw Error(p(314));}null!==d&&d.delete(b);Yk(a,c)}var Vk;\nVk=function(a,b,c){if(null!==a)if(a.memoizedProps!==b.pendingProps||Wf.current)dh=!0;else{if(0===(a.lanes&c)&&0===(b.flags&128))return dh=!1,yj(a,b,c);dh=0!==(a.flags&131072)?!0:!1}else dh=!1,I&&0!==(b.flags&1048576)&&ug(b,ng,b.index);b.lanes=0;switch(b.tag){case 2:var d=b.type;ij(a,b);a=b.pendingProps;var e=Yf(b,H.current);ch(b,c);e=Nh(null,b,d,a,e,c);var f=Sh();b.flags|=1;\"object\"===typeof e&&null!==e&&\"function\"===typeof e.render&&void 0===e.$$typeof?(b.tag=1,b.memoizedState=null,b.updateQueue=\nnull,Zf(d)?(f=!0,cg(b)):f=!1,b.memoizedState=null!==e.state&&void 0!==e.state?e.state:null,kh(b),e.updater=Ei,b.stateNode=e,e._reactInternals=b,Ii(b,d,a,c),b=jj(null,b,d,!0,f,c)):(b.tag=0,I&&f&&vg(b),Xi(null,b,e,c),b=b.child);return b;case 16:d=b.elementType;a:{ij(a,b);a=b.pendingProps;e=d._init;d=e(d._payload);b.type=d;e=b.tag=Zk(d);a=Ci(d,a);switch(e){case 0:b=cj(null,b,d,a,c);break a;case 1:b=hj(null,b,d,a,c);break a;case 11:b=Yi(null,b,d,a,c);break a;case 14:b=$i(null,b,d,Ci(d.type,a),c);break a}throw Error(p(306,\nd,\"\"));}return b;case 0:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),cj(a,b,d,e,c);case 1:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),hj(a,b,d,e,c);case 3:a:{kj(b);if(null===a)throw Error(p(387));d=b.pendingProps;f=b.memoizedState;e=f.element;lh(a,b);qh(b,d,null,c);var g=b.memoizedState;d=g.element;if(f.isDehydrated)if(f={element:d,isDehydrated:!1,cache:g.cache,pendingSuspenseBoundaries:g.pendingSuspenseBoundaries,transitions:g.transitions},b.updateQueue.baseState=\nf,b.memoizedState=f,b.flags&256){e=Ji(Error(p(423)),b);b=lj(a,b,d,c,e);break a}else if(d!==e){e=Ji(Error(p(424)),b);b=lj(a,b,d,c,e);break a}else for(yg=Lf(b.stateNode.containerInfo.firstChild),xg=b,I=!0,zg=null,c=Vg(b,null,d,c),b.child=c;c;)c.flags=c.flags&-3|4096,c=c.sibling;else{Ig();if(d===e){b=Zi(a,b,c);break a}Xi(a,b,d,c)}b=b.child}return b;case 5:return Ah(b),null===a&&Eg(b),d=b.type,e=b.pendingProps,f=null!==a?a.memoizedProps:null,g=e.children,Ef(d,e)?g=null:null!==f&&Ef(d,f)&&(b.flags|=32),\ngj(a,b),Xi(a,b,g,c),b.child;case 6:return null===a&&Eg(b),null;case 13:return oj(a,b,c);case 4:return yh(b,b.stateNode.containerInfo),d=b.pendingProps,null===a?b.child=Ug(b,null,d,c):Xi(a,b,d,c),b.child;case 11:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),Yi(a,b,d,e,c);case 7:return Xi(a,b,b.pendingProps,c),b.child;case 8:return Xi(a,b,b.pendingProps.children,c),b.child;case 12:return Xi(a,b,b.pendingProps.children,c),b.child;case 10:a:{d=b.type._context;e=b.pendingProps;f=b.memoizedProps;\ng=e.value;G(Wg,d._currentValue);d._currentValue=g;if(null!==f)if(He(f.value,g)){if(f.children===e.children&&!Wf.current){b=Zi(a,b,c);break a}}else for(f=b.child,null!==f&&(f.return=b);null!==f;){var h=f.dependencies;if(null!==h){g=f.child;for(var k=h.firstContext;null!==k;){if(k.context===d){if(1===f.tag){k=mh(-1,c&-c);k.tag=2;var l=f.updateQueue;if(null!==l){l=l.shared;var m=l.pending;null===m?k.next=k:(k.next=m.next,m.next=k);l.pending=k}}f.lanes|=c;k=f.alternate;null!==k&&(k.lanes|=c);bh(f.return,\nc,b);h.lanes|=c;break}k=k.next}}else if(10===f.tag)g=f.type===b.type?null:f.child;else if(18===f.tag){g=f.return;if(null===g)throw Error(p(341));g.lanes|=c;h=g.alternate;null!==h&&(h.lanes|=c);bh(g,c,b);g=f.sibling}else g=f.child;if(null!==g)g.return=f;else for(g=f;null!==g;){if(g===b){g=null;break}f=g.sibling;if(null!==f){f.return=g.return;g=f;break}g=g.return}f=g}Xi(a,b,e.children,c);b=b.child}return b;case 9:return e=b.type,d=b.pendingProps.children,ch(b,c),e=eh(e),d=d(e),b.flags|=1,Xi(a,b,d,c),\nb.child;case 14:return d=b.type,e=Ci(d,b.pendingProps),e=Ci(d.type,e),$i(a,b,d,e,c);case 15:return bj(a,b,b.type,b.pendingProps,c);case 17:return d=b.type,e=b.pendingProps,e=b.elementType===d?e:Ci(d,e),ij(a,b),b.tag=1,Zf(d)?(a=!0,cg(b)):a=!1,ch(b,c),Gi(b,d,e),Ii(b,d,e,c),jj(null,b,d,!0,a,c);case 19:return xj(a,b,c);case 22:return dj(a,b,c)}throw Error(p(156,b.tag));};function Fk(a,b){return ac(a,b)}\nfunction $k(a,b,c,d){this.tag=a;this.key=c;this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null;this.index=0;this.ref=null;this.pendingProps=b;this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null;this.mode=d;this.subtreeFlags=this.flags=0;this.deletions=null;this.childLanes=this.lanes=0;this.alternate=null}function Bg(a,b,c,d){return new $k(a,b,c,d)}function aj(a){a=a.prototype;return!(!a||!a.isReactComponent)}\nfunction Zk(a){if(\"function\"===typeof a)return aj(a)?1:0;if(void 0!==a&&null!==a){a=a.$$typeof;if(a===Da)return 11;if(a===Ga)return 14}return 2}\nfunction Pg(a,b){var c=a.alternate;null===c?(c=Bg(a.tag,b,a.key,a.mode),c.elementType=a.elementType,c.type=a.type,c.stateNode=a.stateNode,c.alternate=a,a.alternate=c):(c.pendingProps=b,c.type=a.type,c.flags=0,c.subtreeFlags=0,c.deletions=null);c.flags=a.flags&14680064;c.childLanes=a.childLanes;c.lanes=a.lanes;c.child=a.child;c.memoizedProps=a.memoizedProps;c.memoizedState=a.memoizedState;c.updateQueue=a.updateQueue;b=a.dependencies;c.dependencies=null===b?null:{lanes:b.lanes,firstContext:b.firstContext};\nc.sibling=a.sibling;c.index=a.index;c.ref=a.ref;return c}\nfunction Rg(a,b,c,d,e,f){var g=2;d=a;if(\"function\"===typeof a)aj(a)&&(g=1);else if(\"string\"===typeof a)g=5;else a:switch(a){case ya:return Tg(c.children,e,f,b);case za:g=8;e|=8;break;case Aa:return a=Bg(12,c,b,e|2),a.elementType=Aa,a.lanes=f,a;case Ea:return a=Bg(13,c,b,e),a.elementType=Ea,a.lanes=f,a;case Fa:return a=Bg(19,c,b,e),a.elementType=Fa,a.lanes=f,a;case Ia:return pj(c,e,f,b);default:if(\"object\"===typeof a&&null!==a)switch(a.$$typeof){case Ba:g=10;break a;case Ca:g=9;break a;case Da:g=11;\nbreak a;case Ga:g=14;break a;case Ha:g=16;d=null;break a}throw Error(p(130,null==a?a:typeof a,\"\"));}b=Bg(g,c,b,e);b.elementType=a;b.type=d;b.lanes=f;return b}function Tg(a,b,c,d){a=Bg(7,a,d,b);a.lanes=c;return a}function pj(a,b,c,d){a=Bg(22,a,d,b);a.elementType=Ia;a.lanes=c;a.stateNode={isHidden:!1};return a}function Qg(a,b,c){a=Bg(6,a,null,b);a.lanes=c;return a}\nfunction Sg(a,b,c){b=Bg(4,null!==a.children?a.children:[],a.key,b);b.lanes=c;b.stateNode={containerInfo:a.containerInfo,pendingChildren:null,implementation:a.implementation};return b}\nfunction al(a,b,c,d,e){this.tag=b;this.containerInfo=a;this.finishedWork=this.pingCache=this.current=this.pendingChildren=null;this.timeoutHandle=-1;this.callbackNode=this.pendingContext=this.context=null;this.callbackPriority=0;this.eventTimes=zc(0);this.expirationTimes=zc(-1);this.entangledLanes=this.finishedLanes=this.mutableReadLanes=this.expiredLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0;this.entanglements=zc(0);this.identifierPrefix=d;this.onRecoverableError=e;this.mutableSourceEagerHydrationData=\nnull}function bl(a,b,c,d,e,f,g,h,k){a=new al(a,b,c,h,k);1===b?(b=1,!0===f&&(b|=8)):b=0;f=Bg(3,null,null,b);a.current=f;f.stateNode=a;f.memoizedState={element:d,isDehydrated:c,cache:null,transitions:null,pendingSuspenseBoundaries:null};kh(f);return a}function cl(a,b,c){var d=3 {\n this._frame.onload = () => {\n n();\n }, window.document.body.appendChild(this._frame), this._boundMessageEvent = this._message.bind(this), window.addEventListener(\"message\", this._boundMessageEvent, !1);\n });\n }\n _message(n) {\n n.origin === this._frame_origin && n.source === this._frame.contentWindow && (n.data === \"error\" ? (R.error(\"CheckSessionIFrame: error message from check session op iframe\"), this._stopOnError && this.stop()) : n.data === \"changed\" ? (R.debug(n), R.debug(\"CheckSessionIFrame: changed message from check session op iframe\"), this.stop(), this._callback()) : R.debug(\"CheckSessionIFrame: \" + n.data + \" message from check session op iframe\"));\n }\n start(n) {\n R.debug(\"CheckSessionIFrame.start :\" + n), this.stop();\n const t = () => {\n this._frame.contentWindow.postMessage(this._client_id + \" \" + n, this._frame_origin);\n };\n t(), this._timer = window.setInterval(t, this._interval);\n }\n stop() {\n this._timer && (R.debug(\"CheckSessionIFrame.stop\"), window.clearInterval(this._timer), this._timer = null);\n }\n}\nconst p = {\n service_worker_not_supported_by_browser: \"service_worker_not_supported_by_browser\",\n token_aquired: \"token_aquired\",\n logout_from_another_tab: \"logout_from_another_tab\",\n logout_from_same_tab: \"logout_from_same_tab\",\n token_renewed: \"token_renewed\",\n token_timer: \"token_timer\",\n loginAsync_begin: \"loginAsync_begin\",\n loginAsync_error: \"loginAsync_error\",\n loginCallbackAsync_begin: \"loginCallbackAsync_begin\",\n loginCallbackAsync_end: \"loginCallbackAsync_end\",\n loginCallbackAsync_error: \"loginCallbackAsync_error\",\n refreshTokensAsync_begin: \"refreshTokensAsync_begin\",\n refreshTokensAsync: \"refreshTokensAsync\",\n refreshTokensAsync_end: \"refreshTokensAsync_end\",\n refreshTokensAsync_error: \"refreshTokensAsync_error\",\n refreshTokensAsync_silent_error: \"refreshTokensAsync_silent_error\",\n tryKeepExistingSessionAsync_begin: \"tryKeepExistingSessionAsync_begin\",\n tryKeepExistingSessionAsync_end: \"tryKeepExistingSessionAsync_end\",\n tryKeepExistingSessionAsync_error: \"tryKeepExistingSessionAsync_error\",\n silentLoginAsync_begin: \"silentLoginAsync_begin\",\n silentLoginAsync: \"silentLoginAsync\",\n silentLoginAsync_end: \"silentLoginAsync_end\",\n silentLoginAsync_error: \"silentLoginAsync_error\",\n syncTokensAsync_begin: \"syncTokensAsync_begin\",\n syncTokensAsync_lock_not_available: \"syncTokensAsync_lock_not_available\",\n syncTokensAsync_end: \"syncTokensAsync_end\",\n syncTokensAsync_error: \"syncTokensAsync_error\",\n tokensInvalidAndWaitingActionsToRefresh: \"tokensInvalidAndWaitingActionsToRefresh\"\n}, I = (e, n = sessionStorage) => {\n const t = (y) => (n[`oidc.${e}`] = JSON.stringify({ tokens: null, status: y }), Promise.resolve()), s = async () => {\n if (!n[`oidc.${e}`])\n return n[`oidc.${e}`] = JSON.stringify({ tokens: null, status: null }), { tokens: null, status: null };\n const y = JSON.parse(n[`oidc.${e}`]);\n return Promise.resolve({ tokens: y.tokens, status: y.status });\n }, o = (y) => {\n n[`oidc.${e}`] = JSON.stringify({ tokens: y });\n }, r = async (y) => {\n n[`oidc.session_state.${e}`] = y;\n }, i = async () => n[`oidc.session_state.${e}`], l = (y) => {\n n[`oidc.nonce.${e}`] = y.nonce;\n }, a = (y) => {\n n[`oidc.jwk.${e}`] = JSON.stringify(y);\n }, f = () => JSON.parse(n[`oidc.jwk.${e}`]), _ = async () => ({ nonce: n[`oidc.nonce.${e}`] }), c = async (y) => {\n n[`oidc.dpop_nonce.${e}`] = y;\n }, u = () => n[`oidc.dpop_nonce.${e}`], h = () => n[`oidc.${e}`] ? JSON.stringify({ tokens: JSON.parse(n[`oidc.${e}`]).tokens }) : null;\n let g = {};\n return {\n clearAsync: t,\n initAsync: s,\n setTokens: o,\n getTokens: h,\n setSessionStateAsync: r,\n getSessionStateAsync: i,\n setNonceAsync: l,\n getNonceAsync: _,\n setLoginParams: (y) => {\n g[e] = y, n[`oidc.login.${e}`] = JSON.stringify(y);\n },\n getLoginParams: () => {\n const y = n[`oidc.login.${e}`];\n return y ? (g[e] || (g[e] = JSON.parse(y)), g[e]) : (console.warn(`storage[oidc.login.${e}] is empty, you should have an bad OIDC or code configuration somewhere.`), null);\n },\n getStateAsync: async () => n[`oidc.state.${e}`],\n setStateAsync: async (y) => {\n n[`oidc.state.${e}`] = y;\n },\n getCodeVerifierAsync: async () => n[`oidc.code_verifier.${e}`],\n setCodeVerifierAsync: async (y) => {\n n[`oidc.code_verifier.${e}`] = y;\n },\n setDemonstratingProofOfPossessionNonce: c,\n getDemonstratingProofOfPossessionNonce: u,\n setDemonstratingProofOfPossessionJwkAsync: a,\n getDemonstratingProofOfPossessionJwkAsync: f\n };\n};\nvar V = /* @__PURE__ */ ((e) => (e.AutomaticBeforeTokenExpiration = \"AutomaticBeforeTokensExpiration\", e.AutomaticOnlyWhenFetchExecuted = \"AutomaticOnlyWhenFetchExecuted\", e))(V || {});\nconst Pe = (e) => decodeURIComponent(Array.prototype.map.call(atob(e), (n) => \"%\" + (\"00\" + n.charCodeAt(0).toString(16)).slice(-2)).join(\"\")), Ie = (e) => JSON.parse(Pe(e.replaceAll(/-/g, \"+\").replaceAll(/_/g, \"/\"))), ae = (e) => {\n try {\n return e && Ce(e, \".\") === 2 ? Ie(e.split(\".\")[1]) : null;\n } catch (n) {\n console.warn(n);\n }\n return null;\n}, Ce = (e, n) => e.split(n).length - 1, Z = {\n access_token_or_id_token_invalid: \"access_token_or_id_token_invalid\",\n access_token_invalid: \"access_token_invalid\",\n id_token_invalid: \"id_token_invalid\"\n};\nfunction Ne(e, n, t) {\n if (e.issuedAt) {\n if (typeof e.issuedAt == \"string\")\n return parseInt(e.issuedAt, 10);\n } else\n return n && n.iat ? n.iat : t && t.iat ? t.iat : (/* @__PURE__ */ new Date()).getTime() / 1e3;\n return e.issuedAt;\n}\nconst z = (e, n = null, t) => {\n if (!e)\n return null;\n let s;\n const o = typeof e.expiresIn == \"string\" ? parseInt(e.expiresIn, 10) : e.expiresIn;\n e.accessTokenPayload !== void 0 ? s = e.accessTokenPayload : s = ae(e.accessToken);\n let r;\n n != null && \"idToken\" in n && !(\"idToken\" in e) ? r = n.idToken : r = e.idToken;\n const i = e.idTokenPayload ? e.idTokenPayload : ae(r), l = i && i.exp ? i.exp : Number.MAX_VALUE, a = s && s.exp ? s.exp : e.issuedAt + o;\n e.issuedAt = Ne(e, s, i);\n let f;\n e.expiresAt ? f = e.expiresAt : t === Z.access_token_invalid ? f = a : t === Z.id_token_invalid ? f = l : f = l < a ? l : a;\n const _ = { ...e, idTokenPayload: i, accessTokenPayload: s, expiresAt: f, idToken: r };\n if (n != null && \"refreshToken\" in n && !(\"refreshToken\" in e)) {\n const c = n.refreshToken;\n return { ..._, refreshToken: c };\n }\n return _;\n}, oe = (e, n, t) => {\n if (!e)\n return null;\n if (!e.issued_at) {\n const o = (/* @__PURE__ */ new Date()).getTime() / 1e3;\n e.issued_at = o;\n }\n const s = {\n accessToken: e.access_token,\n expiresIn: e.expires_in,\n idToken: e.id_token,\n scope: e.scope,\n tokenType: e.token_type,\n issuedAt: e.issued_at\n };\n return \"refresh_token\" in e && (s.refreshToken = e.refresh_token), e.accessTokenPayload !== void 0 && (s.accessTokenPayload = e.accessTokenPayload), e.idTokenPayload !== void 0 && (s.idTokenPayload = e.idTokenPayload), z(s, n, t);\n}, U = (e, n) => {\n const t = (/* @__PURE__ */ new Date()).getTime() / 1e3, s = n - t;\n return Math.round(s - e);\n}, ce = (e) => e ? U(0, e.expiresAt) > 0 : !1, ge = async (e, n = 200, t = 50) => {\n let s = t;\n if (!e.tokens)\n return null;\n for (; !ce(e.tokens) && s > 0; ) {\n if (e.configuration.token_automatic_renew_mode == V.AutomaticOnlyWhenFetchExecuted) {\n await e.renewTokensAsync({});\n break;\n } else\n await M({ milliseconds: n });\n s = s - 1;\n }\n return {\n isTokensValid: ce(e.tokens),\n tokens: e.tokens,\n numberWaited: s - t\n };\n}, ke = (e, n, t) => {\n if (e.idTokenPayload) {\n const s = e.idTokenPayload;\n if (t.issuer !== s.iss)\n return { isValid: !1, reason: `Issuer does not match (oidcServerConfiguration issuer) ${t.issuer} !== (idTokenPayload issuer) ${s.iss}` };\n const o = (/* @__PURE__ */ new Date()).getTime() / 1e3;\n if (s.exp && s.exp < o)\n return { isValid: !1, reason: `Token expired (idTokenPayload exp) ${s.exp} < (currentTimeUnixSecond) ${o}` };\n const r = 60 * 60 * 24 * 7;\n if (s.iat && s.iat + r < o)\n return { isValid: !1, reason: `Token is used from too long time (idTokenPayload iat + timeInSevenDays) ${s.iat + r} < (currentTimeUnixSecond) ${o}` };\n if (s.nonce && s.nonce !== n)\n return { isValid: !1, reason: `Nonce does not match (idTokenPayload nonce) ${s.nonce} !== (nonce) ${n}` };\n }\n return { isValid: !0, reason: \"\" };\n}, B = function() {\n const e = function() {\n let a, f;\n const _ = (function() {\n const u = {}, h = {\n setTimeout: function(m, d, w) {\n u[d] = setTimeout(function() {\n m.postMessage(d), u[d] = null;\n }, w);\n },\n setInterval: function(m, d, w) {\n u[d] = setInterval(function() {\n m.postMessage(d);\n }, w);\n },\n clearTimeout: function(m, d) {\n clearTimeout(u[d]), u[d] = null;\n },\n clearInterval: function(m, d) {\n clearInterval(u[d]), u[d] = null;\n }\n };\n function g(m, d) {\n const w = d.data[0], A = d.data[1], v = d.data[2];\n h[w] && h[w](m, A, v);\n }\n this.onmessage = function(m) {\n g(self, m);\n }, this.onconnect = function(m) {\n const d = m.ports[0];\n d.onmessage = function(w) {\n g(d, w);\n };\n };\n }).toString();\n try {\n const u = new Blob([\"(\", _, \")()\"], { type: \"application/javascript\" });\n f = URL.createObjectURL(u);\n } catch {\n return null;\n }\n const c = typeof process > \"u\";\n try {\n if (SharedWorker)\n return a = new SharedWorker(f), a.port;\n } catch {\n c && console.warn(\"SharedWorker not available\");\n }\n try {\n if (Worker)\n return a = new Worker(f), a;\n } catch {\n c && console.warn(\"Worker not available\");\n }\n return null;\n }();\n if (!e) {\n const a = typeof window > \"u\" ? global : window;\n return {\n setTimeout: setTimeout.bind(a),\n clearTimeout: clearTimeout.bind(a),\n setInterval: setInterval.bind(a),\n clearInterval: clearInterval.bind(a)\n };\n }\n const n = /* @__PURE__ */ function() {\n let a = 0;\n return function() {\n return a++, a;\n };\n }(), t = {}, s = {};\n e.onmessage = function(a) {\n const f = a.data, _ = t[f];\n if (_) {\n _(), t[f] = null;\n return;\n }\n const c = s[f];\n c && c();\n };\n function o(a, f) {\n const _ = n();\n return e.postMessage([\"setTimeout\", _, f]), t[_] = a, _;\n }\n function r(a) {\n e.postMessage([\"clearTimeout\", a]), t[a] = null;\n }\n function i(a, f) {\n const _ = n();\n return e.postMessage([\"setInterval\", _, f]), s[_] = a, _;\n }\n function l(a) {\n e.postMessage([\"clearInterval\", a]), s[a] = null;\n }\n return {\n setTimeout: o,\n clearTimeout: r,\n setInterval: i,\n clearInterval: l\n };\n}(), le = \"7.22.6\";\nlet ue = null, q;\nconst M = ({ milliseconds: e }) => new Promise((n) => B.setTimeout(n, e)), me = (e = \"/\") => {\n try {\n q = new AbortController(), fetch(`${e}OidcKeepAliveServiceWorker.json?minSleepSeconds=150`, { signal: q.signal }).catch((s) => {\n console.log(s);\n }), M({ milliseconds: 150 * 1e3 }).then(me);\n } catch (n) {\n console.log(n);\n }\n}, xe = () => {\n q && q.abort();\n}, We = (e = \"/\") => fetch(`${e}OidcKeepAliveServiceWorker.json`, {\n headers: {\n \"oidc-vanilla\": \"true\"\n }\n}).then((n) => n.statusText === \"oidc-service-worker\").catch((n) => {\n console.log(n);\n}), Le = (e) => async (n, t) => {\n t(), await n.update();\n const s = await n.unregister();\n console.log(`Service worker unregistering ${s}`), await M({ milliseconds: 2e3 }), e.reload();\n}, O = (e) => (n) => new Promise(function(t, s) {\n const o = new MessageChannel();\n o.port1.onmessage = function(r) {\n r.data && r.data.error ? s(r.data.error) : t(r.data);\n }, e.active.postMessage(n, [o.port2]);\n}), C = async (e, n) => {\n const t = e.service_worker_relative_url;\n if (typeof window > \"u\" || typeof navigator > \"u\" || !navigator.serviceWorker || !t || e.service_worker_activate() === !1)\n return null;\n let s = null;\n e.register ? s = await e.service_worker_register(t) : s = await navigator.serviceWorker.register(t);\n try {\n await navigator.serviceWorker.ready, navigator.serviceWorker.controller || await O(s)({ type: \"claim\" });\n } catch {\n return null;\n }\n const o = async (k) => O(s)({ type: \"clear\", data: { status: k }, configurationName: n }), r = async (k, S, P) => {\n const b = await O(s)({\n type: \"init\",\n data: {\n oidcServerConfiguration: k,\n where: S,\n oidcConfiguration: {\n token_renew_mode: P.token_renew_mode,\n service_worker_convert_all_requests_to_cors: P.service_worker_convert_all_requests_to_cors\n }\n },\n configurationName: n\n }), D = b.version;\n return D !== le && (console.warn(`Service worker ${D} version mismatch with js client version ${le}, unregistering and reloading`), await P.service_worker_update_require_callback(s, xe)), { tokens: oe(b.tokens, null, P.token_renew_mode), status: b.status };\n }, i = (k = \"/\") => {\n ue == null && (ue = \"not_null\", me(k));\n }, l = (k) => O(s)({ type: \"setSessionState\", data: { sessionState: k }, configurationName: n }), a = async () => (await O(s)({ type: \"getSessionState\", data: null, configurationName: n })).sessionState, f = (k) => (sessionStorage[`oidc.nonce.${n}`] = k.nonce, O(s)({ type: \"setNonce\", data: { nonce: k }, configurationName: n })), _ = async () => {\n let S = (await O(s)({ type: \"getNonce\", data: null, configurationName: n })).nonce;\n return S || (S = sessionStorage[`oidc.nonce.${n}`], console.warn(\"nonce not found in service worker, using sessionStorage\")), { nonce: S };\n };\n let c = {};\n return {\n clearAsync: o,\n initAsync: r,\n startKeepAliveServiceWorker: () => i(e.service_worker_keep_alive_path),\n isServiceWorkerProxyActiveAsync: () => We(e.service_worker_keep_alive_path),\n setSessionStateAsync: l,\n getSessionStateAsync: a,\n setNonceAsync: f,\n getNonceAsync: _,\n setLoginParams: (k) => {\n c[n] = k, localStorage[`oidc.login.${n}`] = JSON.stringify(k);\n },\n getLoginParams: () => {\n const k = localStorage[`oidc.login.${n}`];\n return c[n] || (c[n] = JSON.parse(k)), c[n];\n },\n getStateAsync: async () => {\n let S = (await O(s)({ type: \"getState\", data: null, configurationName: n })).state;\n return S || (S = sessionStorage[`oidc.state.${n}`], console.warn(\"state not found in service worker, using sessionStorage\")), S;\n },\n setStateAsync: async (k) => (sessionStorage[`oidc.state.${n}`] = k, O(s)({ type: \"setState\", data: { state: k }, configurationName: n })),\n getCodeVerifierAsync: async () => {\n let S = (await O(s)({ type: \"getCodeVerifier\", data: null, configurationName: n })).codeVerifier;\n return S || (S = sessionStorage[`oidc.code_verifier.${n}`], console.warn(\"codeVerifier not found in service worker, using sessionStorage\")), S;\n },\n setCodeVerifierAsync: async (k) => (sessionStorage[`oidc.code_verifier.${n}`] = k, O(s)({ type: \"setCodeVerifier\", data: { codeVerifier: k }, configurationName: n })),\n setDemonstratingProofOfPossessionNonce: async (k) => {\n await O(s)({ type: \"setDemonstratingProofOfPossessionNonce\", data: { demonstratingProofOfPossessionNonce: k }, configurationName: n });\n },\n getDemonstratingProofOfPossessionNonce: async () => (await O(s)({ type: \"getDemonstratingProofOfPossessionNonce\", data: null, configurationName: n })).demonstratingProofOfPossessionNonce,\n setDemonstratingProofOfPossessionJwkAsync: async (k) => {\n const S = JSON.stringify(k);\n await O(s)({ type: \"setDemonstratingProofOfPossessionJwk\", data: { demonstratingProofOfPossessionJwkJson: S }, configurationName: n });\n },\n getDemonstratingProofOfPossessionJwkAsync: async () => {\n const k = await O(s)({ type: \"getDemonstratingProofOfPossessionJwk\", data: null, configurationName: n });\n return k.demonstratingProofOfPossessionJwkJson ? JSON.parse(k.demonstratingProofOfPossessionJwkJson) : null;\n }\n };\n}, $ = {}, De = (e, n = window.sessionStorage, t) => {\n if (!$[e] && n) {\n const o = n.getItem(e);\n o && ($[e] = JSON.parse(o));\n }\n const s = 1e3 * t;\n return $[e] && $[e].timestamp + s > Date.now() ? $[e].result : null;\n}, Re = (e, n, t = window.sessionStorage) => {\n const s = Date.now();\n $[e] = { result: n, timestamp: s }, t && t.setItem(e, JSON.stringify({ result: n, timestamp: s }));\n};\nfunction pe(e) {\n return new TextEncoder().encode(e);\n}\nfunction we(e) {\n return btoa(e).replace(/\\+/g, \"-\").replace(/\\//g, \"_\").replace(/=+/g, \"\");\n}\nfunction $e(e) {\n return encodeURIComponent(e).replace(/%([0-9A-F]{2})/g, function(t, s) {\n return String.fromCharCode(parseInt(s, 16));\n });\n}\nconst re = (e) => {\n let n = \"\";\n return e.forEach(function(t) {\n n += String.fromCharCode(t);\n }), we(n);\n};\nfunction _e(e) {\n return we($e(e));\n}\nconst Ke = {\n importKeyAlgorithm: {\n name: \"ECDSA\",\n namedCurve: \"P-256\",\n hash: { name: \"ES256\" }\n },\n signAlgorithm: { name: \"ECDSA\", hash: { name: \"SHA-256\" } },\n generateKeyAlgorithm: {\n name: \"ECDSA\",\n namedCurve: \"P-256\"\n },\n digestAlgorithm: { name: \"SHA-256\" },\n jwtHeaderAlgorithm: \"ES256\"\n}, Ue = (e) => async (n, t, s, o, r = \"dpop+jwt\") => {\n switch (n = Object.assign({}, n), t.typ = r, t.alg = o.jwtHeaderAlgorithm, t.alg) {\n case \"ES256\":\n t.jwk = { kty: n.kty, crv: n.crv, x: n.x, y: n.y };\n break;\n case \"RS256\":\n t.jwk = { kty: n.kty, n: n.n, e: n.e, kid: t.kid };\n break;\n default:\n throw new Error(\"Unknown or not implemented JWS algorithm\");\n }\n const i = {\n // @ts-ignore\n // JWT \"headers\" really means JWS \"protected headers\"\n protected: _e(JSON.stringify(t)),\n // @ts-ignore\n // JWT \"claims\" are really a JSON-defined JWS \"payload\"\n payload: _e(JSON.stringify(s))\n }, l = o.importKeyAlgorithm, a = !0, f = [\"sign\"], _ = await e.crypto.subtle.importKey(\"jwk\", n, l, a, f), c = pe(`${i.protected}.${i.payload}`), u = o.signAlgorithm, h = await e.crypto.subtle.sign(u, _, c);\n return i.signature = re(new Uint8Array(h)), `${i.protected}.${i.payload}.${i.signature}`;\n};\nvar Fe = { sign: Ue };\nconst Ve = (e) => async (n) => {\n const t = n, s = !0, o = [\"sign\", \"verify\"], r = await e.crypto.subtle.generateKey(t, s, o);\n return await e.crypto.subtle.exportKey(\"jwk\", r.privateKey);\n}, Me = (e) => {\n const n = Object.assign({}, e);\n return delete n.d, n.key_ops = [\"verify\"], n;\n}, Je = {\n generate: Ve,\n neuter: Me\n}, Be = (e) => async (n, t) => {\n let s;\n switch (n.kty) {\n case \"EC\":\n s = '{\"crv\":\"CRV\",\"kty\":\"EC\",\"x\":\"X\",\"y\":\"Y\"}'.replace(\"CRV\", n.crv).replace(\"X\", n.x).replace(\"Y\", n.y);\n break;\n case \"RSA\":\n s = '{\"e\":\"E\",\"kty\":\"RSA\",\"n\":\"N\"}'.replace(\"E\", n.e).replace(\"N\", n.n);\n break;\n default:\n throw new Error(\"Unknown or not implemented JWK type\");\n }\n const o = await e.crypto.subtle.digest(t, pe(s));\n return re(new Uint8Array(o));\n};\nvar He = { thumbprint: Be };\nconst je = (e) => async (n) => await Je.generate(e)(n), Ae = (e) => (n) => async (t, s = \"POST\", o, r = {}) => {\n const i = {\n // https://www.rfc-editor.org/rfc/rfc9449.html#name-concept\n jti: btoa(qe()),\n htm: s,\n htu: o,\n iat: Math.round(Date.now() / 1e3),\n ...r\n }, l = await He.thumbprint(e)(t, n.digestAlgorithm);\n return await Fe.sign(e)(t, { kid: l }, i, n);\n}, qe = () => {\n const e = \"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx\", n = \"0123456789abcdef\";\n let t = 0, s = \"\";\n for (let o = 0; o < 36; o++)\n e[o] !== \"-\" && e[o] !== \"4\" && (t = Math.random() * 16 | 0), e[o] === \"x\" ? s += n[t] : e[o] === \"y\" ? (t &= 3, t |= 8, s += n[t]) : s += e[o];\n return s;\n}, Se = () => {\n const e = typeof window < \"u\" && !!window.crypto, n = e && !!window.crypto.subtle;\n return { hasCrypto: e, hasSubtleCrypto: n };\n}, ee = \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789\", Ge = (e) => {\n const n = [];\n for (let t = 0; t < e.byteLength; t += 1) {\n const s = e[t] % ee.length;\n n.push(ee[s]);\n }\n return n.join(\"\");\n}, ne = (e) => {\n const n = new Uint8Array(e), { hasCrypto: t } = Se();\n if (t)\n window.crypto.getRandomValues(n);\n else\n for (let s = 0; s < e; s += 1)\n n[s] = Math.random() * ee.length | 0;\n return Ge(n);\n};\nfunction Ye(e) {\n const n = new ArrayBuffer(e.length), t = new Uint8Array(n);\n for (let s = 0; s < e.length; s++)\n t[s] = e.charCodeAt(s);\n return t;\n}\nfunction ve(e) {\n return new Promise((n, t) => {\n crypto.subtle.digest(\"SHA-256\", Ye(e)).then((s) => n(re(new Uint8Array(s))), (s) => t(s));\n });\n}\nconst Xe = (e) => {\n if (e.length < 43 || e.length > 128)\n return Promise.reject(new Error(\"Invalid code length.\"));\n const { hasSubtleCrypto: n } = Se();\n return n ? ve(e) : Promise.reject(new Error(\"window.crypto.subtle is unavailable.\"));\n}, ze = 60 * 60, Qe = (e) => async (n, t = ze, s = window.sessionStorage, o = 1e4) => {\n const r = `${n}/.well-known/openid-configuration`, i = `oidc.server:${n}`, l = De(i, s, t);\n if (l)\n return new se(l);\n const a = await H(e)(r, {}, o);\n if (a.status !== 200)\n return null;\n const f = await a.json();\n return Re(i, f, s), new se(f);\n}, H = (e) => async (n, t = {}, s = 1e4, o = 0) => {\n let r;\n try {\n const i = new AbortController();\n setTimeout(() => i.abort(), s), r = await e(n, { ...t, signal: i.signal });\n } catch (i) {\n if (i.name === \"AbortError\" || i.message === \"Network request failed\") {\n if (o <= 1)\n return await H(e)(n, t, s, o + 1);\n throw i;\n } else\n throw console.error(i.message), i;\n }\n return r;\n}, te = {\n refresh_token: \"refresh_token\",\n access_token: \"access_token\"\n}, fe = (e) => async (n, t, s = te.refresh_token, o, r = {}, i = 1e4) => {\n const l = {\n token: t,\n token_type_hint: s,\n client_id: o\n };\n for (const [c, u] of Object.entries(r))\n l[c] === void 0 && (l[c] = u);\n const a = [];\n for (const c in l) {\n const u = encodeURIComponent(c), h = encodeURIComponent(l[c]);\n a.push(`${u}=${h}`);\n }\n const f = a.join(\"&\");\n return (await H(e)(n, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/x-www-form-urlencoded;charset=UTF-8\"\n },\n body: f\n }, i)).status !== 200 ? { success: !1 } : {\n success: !0\n };\n}, Ze = (e) => async (n, t, s, o, r = {}, i, l = 1e4) => {\n for (const [h, g] of Object.entries(s))\n t[h] === void 0 && (t[h] = g);\n const a = [];\n for (const h in t) {\n const g = encodeURIComponent(h), m = encodeURIComponent(t[h]);\n a.push(`${g}=${m}`);\n }\n const f = a.join(\"&\"), _ = await H(e)(n, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/x-www-form-urlencoded;charset=UTF-8\",\n ...r\n },\n body: f\n }, l);\n if (_.status !== 200)\n return {\n success: !1,\n status: _.status,\n demonstratingProofOfPossessionNonce: null\n };\n const c = await _.json();\n let u = null;\n return _.headers.has(G) && (u = _.headers.get(G)), {\n success: !0,\n status: _.status,\n data: oe(c, o, i),\n demonstratingProofOfPossessionNonce: u\n };\n}, en = (e, n) => async (t, s) => {\n s = s ? { ...s } : {};\n const o = ne(128), r = await Xe(o);\n await e.setCodeVerifierAsync(o), await e.setStateAsync(s.state), s.code_challenge = r, s.code_challenge_method = \"S256\";\n let i = \"\";\n if (s)\n for (const [l, a] of Object.entries(s))\n i === \"\" ? i += \"?\" : i += \"&\", i += `${l}=${encodeURIComponent(a)}`;\n n.open(`${t}${i}`);\n}, G = \"DPoP-Nonce\", nn = (e) => async (n, t, s, o, r = 1e4) => {\n t = t ? { ...t } : {}, t.code_verifier = await e.getCodeVerifierAsync();\n const i = [];\n for (const c in t) {\n const u = encodeURIComponent(c), h = encodeURIComponent(t[c]);\n i.push(`${u}=${h}`);\n }\n const l = i.join(\"&\"), a = await H(fetch)(n, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/x-www-form-urlencoded;charset=UTF-8\",\n ...s\n },\n body: l\n }, r);\n if (await Promise.all([e.setCodeVerifierAsync(null), e.setStateAsync(null)]), a.status !== 200)\n return { success: !1, status: a.status };\n let f = null;\n a.headers.has(G) && (f = a.headers.get(G));\n const _ = await a.json();\n return {\n success: !0,\n data: {\n state: t.state,\n tokens: oe(_, null, o),\n demonstratingProofOfPossessionNonce: f\n }\n };\n};\nasync function de(e, n, t) {\n const s = (l) => {\n e.tokens = l;\n }, { tokens: o, status: r } = await j(e)(0, n, t, s);\n return await C(e.configuration, e.configurationName) || await I(e.configurationName, e.configuration.storage).setTokens(e.tokens), e.tokens ? o : (await e.destroyAsync(r), null);\n}\nconst tn = async (e, n) => {\n const t = await C(n, e.configurationName);\n if (t) {\n const s = await e.initAsync(n.authority, n.authority_configuration), { tokens: o } = await t.initAsync(s, \"tryKeepExistingSessionAsync\", n);\n return o;\n } else {\n const s = I(e.configurationName, n.storage ?? sessionStorage);\n let { tokens: o } = await s.initAsync();\n return o = z(o, e.tokens, n.token_renew_mode), o;\n }\n};\nasync function Te(e, n = !1, t = null) {\n const s = e.configuration, o = `${s.client_id}_${e.configurationName}_${s.authority}`;\n let r;\n const i = await C(e.configuration, e.configurationName);\n return (s == null ? void 0 : s.storage) === (window == null ? void 0 : window.sessionStorage) && !i ? r = await de(e, n, t) : r = await navigator.locks.request(o, { ifAvailable: !0 }, async (l) => l ? await de(e, n, t) : (e.publishEvent(N.eventNames.syncTokensAsync_lock_not_available, { lock: \"lock not available\" }), await tn(e, s))), r ? (e.timeoutId && (e.timeoutId = J(e, e.tokens.expiresAt, t)), e.tokens) : null;\n}\nconst J = (e, n, t = null) => {\n const s = e.configuration.refresh_time_before_tokens_expiration_in_second;\n return B.setTimeout(async () => {\n const r = { timeLeft: U(s, n) };\n e.publishEvent(N.eventNames.token_timer, r), await Te(e, !1, t);\n }, 1e3);\n}, x = {\n FORCE_REFRESH: \"FORCE_REFRESH\",\n SESSION_LOST: \"SESSION_LOST\",\n NOT_CONNECTED: \"NOT_CONNECTED\",\n TOKENS_VALID: \"TOKENS_VALID\",\n TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_VALID: \"TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_VALID\",\n LOGOUT_FROM_ANOTHER_TAB: \"LOGOUT_FROM_ANOTHER_TAB\",\n REQUIRE_SYNC_TOKENS: \"REQUIRE_SYNC_TOKENS\"\n}, sn = (e) => async (n, t, s, o = !1) => {\n const r = { nonce: null };\n if (!s)\n return { tokens: null, status: \"NOT_CONNECTED\", nonce: r };\n let i = r;\n const l = await e.initAsync(n.authority, n.authority_configuration), a = await C(n, t);\n if (a) {\n const { status: c, tokens: u } = await a.initAsync(l, \"syncTokensAsync\", n);\n if (c === \"LOGGED_OUT\")\n return { tokens: null, status: \"LOGOUT_FROM_ANOTHER_TAB\", nonce: r };\n if (c === \"SESSIONS_LOST\")\n return { tokens: null, status: \"SESSIONS_LOST\", nonce: r };\n if (!c || !u)\n return { tokens: null, status: \"REQUIRE_SYNC_TOKENS\", nonce: r };\n if (u.issuedAt !== s.issuedAt) {\n const g = U(n.refresh_time_before_tokens_expiration_in_second, u.expiresAt) > 0 ? \"TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_VALID\" : \"TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_INVALID\", m = await a.getNonceAsync();\n return { tokens: u, status: g, nonce: m };\n }\n i = await a.getNonceAsync();\n } else {\n const c = I(t, n.storage ?? sessionStorage);\n let { tokens: u, status: h } = await c.initAsync();\n if (u && (u = z(u, e.tokens, n.token_renew_mode)), u) {\n if (h === \"SESSIONS_LOST\")\n return { tokens: null, status: \"SESSIONS_LOST\", nonce: r };\n if (u.issuedAt !== s.issuedAt) {\n const m = U(n.refresh_time_before_tokens_expiration_in_second, u.expiresAt) > 0 ? \"TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_VALID\" : \"TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_INVALID\", d = await c.getNonceAsync();\n return { tokens: u, status: m, nonce: d };\n }\n } else\n return { tokens: null, status: \"LOGOUT_FROM_ANOTHER_TAB\", nonce: r };\n i = await c.getNonceAsync();\n }\n const _ = U(n.refresh_time_before_tokens_expiration_in_second, s.expiresAt) > 0 ? \"TOKENS_VALID\" : \"TOKENS_INVALID\";\n return o ? { tokens: s, status: \"FORCE_REFRESH\", nonce: i } : { tokens: s, status: _, nonce: i };\n}, j = (e) => async (n = 0, t = !1, s = null, o) => {\n for (; !navigator.onLine && document.hidden; )\n await M({ milliseconds: 1e3 }), e.publishEvent(p.refreshTokensAsync, { message: \"wait because navigator is offline and hidden\" });\n let r = 6;\n for (; !navigator.onLine && r > 0; )\n await M({ milliseconds: 1e3 }), r--, e.publishEvent(p.refreshTokensAsync, { message: `wait because navigator is offline try ${r}` });\n const i = document.hidden, l = n + 1;\n s || (s = {});\n const a = e.configuration, f = (c, u = null, h = null) => ie(e.configurationName, e.configuration, e.publishEvent.bind(e))(c, u, h), _ = async () => {\n try {\n let c;\n const u = await C(a, e.configurationName);\n u ? c = u.getLoginParams() : c = I(e.configurationName, a.storage).getLoginParams();\n const h = await f({\n ...c.extras,\n ...s,\n prompt: \"none\"\n });\n return h ? h.error ? (o(null), e.publishEvent(p.refreshTokensAsync_error, { message: \"refresh token silent\" }), { tokens: null, status: \"SESSION_LOST\" }) : (o(h.tokens), e.publishEvent(N.eventNames.token_renewed, {}), { tokens: h.tokens, status: \"LOGGED\" }) : (o(null), e.publishEvent(p.refreshTokensAsync_error, { message: \"refresh token silent not active\" }), { tokens: null, status: \"SESSION_LOST\" });\n } catch (c) {\n return console.error(c), e.publishEvent(p.refreshTokensAsync_silent_error, { message: \"exceptionSilent\", exception: c.message }), await j(e)(l, t, s, o);\n }\n };\n if (n > 4)\n return i ? { tokens: e.tokens, status: \"GIVE_UP\" } : (o(null), e.publishEvent(p.refreshTokensAsync_error, { message: \"refresh token\" }), { tokens: null, status: \"SESSION_LOST\" });\n try {\n const { status: c, tokens: u, nonce: h } = await sn(e)(a, e.configurationName, e.tokens, t);\n switch (c) {\n case x.SESSION_LOST:\n return o(null), e.publishEvent(p.refreshTokensAsync_error, { message: \"refresh token session lost\" }), { tokens: null, status: \"SESSION_LOST\" };\n case x.NOT_CONNECTED:\n return o(null), { tokens: null, status: null };\n case x.TOKENS_VALID:\n return o(u), { tokens: u, status: \"LOGGED_IN\" };\n case x.TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_VALID:\n return o(u), e.publishEvent(N.eventNames.token_renewed, { reason: \"TOKEN_UPDATED_BY_ANOTHER_TAB_TOKENS_VALID\" }), { tokens: u, status: \"LOGGED_IN\" };\n case x.LOGOUT_FROM_ANOTHER_TAB:\n return o(null), e.publishEvent(p.logout_from_another_tab, { status: \"session syncTokensAsync\" }), { tokens: null, status: \"LOGGED_OUT\" };\n case x.REQUIRE_SYNC_TOKENS:\n return a.token_automatic_renew_mode == V.AutomaticOnlyWhenFetchExecuted && x.FORCE_REFRESH !== c ? (e.publishEvent(p.tokensInvalidAndWaitingActionsToRefresh, {}), { tokens: e.tokens, status: \"GIVE_UP\" }) : (e.publishEvent(p.refreshTokensAsync_begin, { tryNumber: n }), await _());\n default: {\n if (a.token_automatic_renew_mode == V.AutomaticOnlyWhenFetchExecuted && x.FORCE_REFRESH !== c)\n return e.publishEvent(p.tokensInvalidAndWaitingActionsToRefresh, {}), { tokens: e.tokens, status: \"GIVE_UP\" };\n if (e.publishEvent(p.refreshTokensAsync_begin, { refreshToken: u.refreshToken, status: c, tryNumber: n }), !u.refreshToken)\n return await _();\n const g = a.client_id, m = a.redirect_uri, d = a.authority, A = { ...a.token_request_extras ? a.token_request_extras : {} };\n for (const [T, y] of Object.entries(s))\n T.endsWith(\":token_request\") && (A[T.replace(\":token_request\", \"\")] = y);\n return await (async () => {\n const T = {\n client_id: g,\n redirect_uri: m,\n grant_type: \"refresh_token\",\n refresh_token: u.refreshToken\n }, y = await e.initAsync(d, a.authority_configuration), k = document.hidden ? 1e4 : 3e4 * 10, S = y.tokenEndpoint, P = {};\n a.demonstrating_proof_of_possession && (P.DPoP = await e.generateDemonstrationOfProofOfPossessionAsync(u.accessToken, S, \"POST\"));\n const b = await Ze(e.getFetch())(\n S,\n T,\n A,\n u,\n P,\n a.token_renew_mode,\n k\n );\n if (b.success) {\n const { isValid: D, reason: E } = ke(b.data, h.nonce, y);\n if (!D)\n return o(null), e.publishEvent(p.refreshTokensAsync_error, { message: `refresh token return not valid tokens, reason: ${E}` }), { tokens: null, status: \"SESSION_LOST\" };\n if (o(b.data), b.demonstratingProofOfPossessionNonce) {\n const L = await C(a, e.configurationName);\n L ? await L.setDemonstratingProofOfPossessionNonce(b.demonstratingProofOfPossessionNonce) : await I(e.configurationName, a.storage).setDemonstratingProofOfPossessionNonce(b.demonstratingProofOfPossessionNonce);\n }\n return e.publishEvent(p.refreshTokensAsync_end, { success: b.success }), e.publishEvent(N.eventNames.token_renewed, { reason: \"REFRESH_TOKEN\" }), { tokens: b.data, status: \"LOGGED_IN\" };\n } else\n return e.publishEvent(p.refreshTokensAsync_silent_error, {\n message: \"bad request\",\n tokenResponse: b\n }), b.status >= 400 && b.status < 500 ? (o(null), e.publishEvent(p.refreshTokensAsync_error, { message: `session lost: ${b.status}` }), { tokens: null, status: \"SESSION_LOST\" }) : await j(e)(l, t, s, o);\n })();\n }\n }\n } catch (c) {\n return console.error(c), e.publishEvent(p.refreshTokensAsync_silent_error, { message: \"exception\", exception: c.message }), j(e)(l, t, s, o);\n }\n}, ie = (e, n, t) => (s = null, o = null, r = null) => {\n if (!n.silent_redirect_uri || !n.silent_login_uri)\n return Promise.resolve(null);\n try {\n t(p.silentLoginAsync_begin, {});\n let i = \"\";\n if (o && (s == null && (s = {}), s.state = o), r && (s == null && (s = {}), s.scope = r), s != null)\n for (const [c, u] of Object.entries(s))\n i === \"\" ? i = `?${encodeURIComponent(c)}=${encodeURIComponent(u)}` : i += `&${encodeURIComponent(c)}=${encodeURIComponent(u)}`;\n const l = n.silent_login_uri + i, a = l.indexOf(\"/\", l.indexOf(\"//\") + 2), f = l.substring(0, a), _ = document.createElement(\"iframe\");\n return _.width = \"0px\", _.height = \"0px\", _.id = `${e}_oidc_iframe`, _.setAttribute(\"src\", l), document.body.appendChild(_), new Promise((c, u) => {\n let h = !1;\n const g = () => {\n window.removeEventListener(\"message\", m), _.remove(), h = !0;\n }, m = (d) => {\n if (d.origin === f && d.source === _.contentWindow) {\n const w = `${e}_oidc_tokens:`, A = `${e}_oidc_error:`, v = `${e}_oidc_exception:`, T = d.data;\n if (T && typeof T == \"string\" && !h) {\n if (T.startsWith(w)) {\n const y = JSON.parse(d.data.replace(w, \"\"));\n t(p.silentLoginAsync_end, {}), c(y), g();\n } else if (T.startsWith(A)) {\n const y = JSON.parse(d.data.replace(A, \"\"));\n t(p.silentLoginAsync_error, y), c({ error: \"oidc_\" + y.error, tokens: null, sessionState: null }), g();\n } else if (T.startsWith(v)) {\n const y = JSON.parse(d.data.replace(v, \"\"));\n t(p.silentLoginAsync_error, y), u(new Error(y.error)), g();\n }\n }\n }\n };\n try {\n window.addEventListener(\"message\", m);\n const d = n.silent_login_timeout;\n setTimeout(() => {\n h || (g(), t(p.silentLoginAsync_error, { reason: \"timeout\" }), u(new Error(\"timeout\")));\n }, d);\n } catch (d) {\n g(), t(p.silentLoginAsync_error, d), u(d);\n }\n });\n } catch (i) {\n throw t(p.silentLoginAsync_error, i), i;\n }\n}, on = (e, n, t, s, o) => (r = null, i = void 0) => {\n r = { ...r };\n const l = (f, _, c) => ie(n, t, s.bind(o))(f, _, c);\n return (async () => {\n o.timeoutId && B.clearTimeout(o.timeoutId);\n let f;\n r && \"state\" in r && (f = r.state, delete r.state);\n try {\n const _ = t.extras ? { ...t.extras, ...r } : r, c = await l({\n ..._,\n prompt: \"none\"\n }, f, i);\n if (c)\n return o.tokens = c.tokens, s(p.token_aquired, {}), o.timeoutId = J(o, o.tokens.expiresAt, r), {};\n } catch (_) {\n return _;\n }\n })();\n}, rn = (e, n, t) => (s, o, r, i = !1) => {\n const l = (a, f = void 0, _ = void 0) => ie(e.configurationName, t, e.publishEvent.bind(e))(a, f, _);\n return new Promise((a, f) => {\n if (t.silent_login_uri && t.silent_redirect_uri && t.monitor_session && s && r && !i) {\n const _ = () => {\n e.checkSessionIFrame.stop();\n const c = e.tokens;\n if (c === null)\n return;\n const u = c.idToken, h = c.idTokenPayload;\n return l({\n prompt: \"none\",\n id_token_hint: u,\n scope: t.scope || \"openid\"\n }).then((g) => {\n if (g.error)\n throw new Error(g.error);\n const m = g.tokens.idTokenPayload;\n if (h.sub === m.sub) {\n const d = g.sessionState;\n e.checkSessionIFrame.start(g.sessionState), h.sid === m.sid ? console.debug(\"SessionMonitor._callback: Same sub still logged in at OP, restarting check session iframe; session_state:\", d) : console.debug(\"SessionMonitor._callback: Same sub still logged in at OP, session state has changed, restarting check session iframe; session_state:\", d);\n } else\n console.debug(\"SessionMonitor._callback: Different subject signed into OP:\", m.sub);\n }).catch(async (g) => {\n console.warn(\"SessionMonitor._callback: Silent login failed, logging out other tabs:\", g);\n for (const [m, d] of Object.entries(n))\n await d.logoutOtherTabAsync(t.client_id, h.sub);\n });\n };\n e.checkSessionIFrame = new Oe(_, o, s), e.checkSessionIFrame.load().then(() => {\n e.checkSessionIFrame.start(r), a(e.checkSessionIFrame);\n }).catch((c) => {\n f(c);\n });\n } else\n a(null);\n });\n}, be = (e) => {\n const n = e.match(\n // eslint-disable-next-line no-useless-escape\n /^([a-z][\\w-]+\\:)\\/\\/(([^:\\/?#]*)(?:\\:([0-9]+))?)([\\/]{0,1}[^?#]*)(\\?[^#]*|)(#.*|)$/\n );\n if (!n)\n throw new Error(\"Invalid URL\");\n let t = n[6], s = n[7];\n if (s) {\n const o = s.split(\"?\");\n o.length === 2 && (s = o[0], t = o[1]);\n }\n return t.startsWith(\"?\") && (t = t.slice(1)), n && {\n href: e,\n protocol: n[1],\n host: n[2],\n hostname: n[3],\n port: n[4],\n path: n[5],\n search: t,\n hash: s\n };\n}, Tn = (e) => {\n const n = be(e);\n let { path: t } = n;\n t.endsWith(\"/\") && (t = t.slice(0, -1));\n let { hash: s } = n;\n return s === \"#_=_\" && (s = \"\"), s && (t += s), t;\n}, Y = (e) => {\n const n = be(e), { search: t } = n;\n return an(t);\n}, an = (e) => {\n const n = {};\n let t, s, o;\n const r = e.split(\"&\");\n for (s = 0, o = r.length; s < o; s++)\n t = r[s].split(\"=\"), n[decodeURIComponent(t[0])] = decodeURIComponent(t[1]);\n return n;\n}, cn = (e, n, t, s, o) => (r = void 0, i = null, l = !1, a = void 0) => {\n const f = i;\n return i = { ...i }, (async () => {\n const c = r || o.getPath();\n if (\"state\" in i || (i.state = ne(16)), t(p.loginAsync_begin, {}), i)\n for (const u of Object.keys(i))\n u.endsWith(\":token_request\") && delete i[u];\n try {\n const u = l ? n.silent_redirect_uri : n.redirect_uri;\n a || (a = n.scope);\n const h = n.extras ? { ...n.extras, ...i } : i;\n h.nonce || (h.nonce = ne(12));\n const g = { nonce: h.nonce }, m = await C(n, e), d = await s(n.authority, n.authority_configuration);\n let w;\n if (m)\n m.setLoginParams({ callbackPath: c, extras: f }), await m.initAsync(d, \"loginAsync\", n), await m.setNonceAsync(g), m.startKeepAliveServiceWorker(), w = m;\n else {\n const v = I(e, n.storage ?? sessionStorage);\n v.setLoginParams({ callbackPath: c, extras: f }), await v.setNonceAsync(g), w = v;\n }\n const A = {\n client_id: n.client_id,\n redirect_uri: u,\n scope: a,\n response_type: \"code\",\n ...h\n };\n await en(w, o)(d.authorizationEndpoint, A);\n } catch (u) {\n throw t(p.loginAsync_error, u), u;\n }\n })();\n}, ln = (e) => async (n = !1) => {\n try {\n e.publishEvent(p.loginCallbackAsync_begin, {});\n const t = e.configuration, s = t.client_id, o = n ? t.silent_redirect_uri : t.redirect_uri, r = t.authority, i = t.token_request_timeout, l = await e.initAsync(r, t.authority_configuration), a = e.location.getCurrentHref(), _ = Y(a).session_state, c = await C(t, e.configurationName);\n let u, h, g, m;\n if (c)\n await c.initAsync(l, \"loginCallbackAsync\", t), await c.setSessionStateAsync(_), h = await c.getNonceAsync(), g = c.getLoginParams(), m = await c.getStateAsync(), c.startKeepAliveServiceWorker(), u = c;\n else {\n const E = I(e.configurationName, t.storage ?? sessionStorage);\n await E.setSessionStateAsync(_), h = await E.getNonceAsync(), g = E.getLoginParams(), m = await E.getStateAsync(), u = E;\n }\n const d = Y(a);\n if (d.error || d.error_description)\n throw new Error(`Error from OIDC server: ${d.error} - ${d.error_description}`);\n if (d.iss && d.iss !== l.issuer)\n throw console.error(), new Error(`Issuer not valid (expected: ${l.issuer}, received: ${d.iss})`);\n if (d.state && d.state !== m)\n throw new Error(`State not valid (expected: ${m}, received: ${d.state})`);\n const w = {\n code: d.code,\n grant_type: \"authorization_code\",\n client_id: t.client_id,\n redirect_uri: o\n }, A = {};\n if (t.token_request_extras)\n for (const [E, L] of Object.entries(t.token_request_extras))\n A[E] = L;\n if (g && g.extras)\n for (const [E, L] of Object.entries(g.extras))\n E.endsWith(\":token_request\") && (A[E.replace(\":token_request\", \"\")] = L);\n const v = l.tokenEndpoint, T = {};\n if (t.demonstrating_proof_of_possession)\n if (c)\n T.DPoP = `DPOP_SECURED_BY_OIDC_SERVICE_WORKER_${e.configurationName}`;\n else {\n const E = await je(window)(t.demonstrating_proof_of_possession_configuration.generateKeyAlgorithm);\n await I(e.configurationName, t.storage).setDemonstratingProofOfPossessionJwkAsync(E), T.DPoP = await Ae(window)(t.demonstrating_proof_of_possession_configuration)(E, \"POST\", v);\n }\n const y = await nn(u)(\n v,\n { ...w, ...A },\n T,\n e.configuration.token_renew_mode,\n i\n );\n if (!y.success)\n throw new Error(\"Token request failed\");\n let k;\n const S = y.data.tokens, P = y.data.demonstratingProofOfPossessionNonce;\n if (y.data.state !== A.state)\n throw new Error(\"state is not valid\");\n const { isValid: b, reason: D } = ke(S, h.nonce, l);\n if (!b)\n throw new Error(`Tokens are not OpenID valid, reason: ${D}`);\n if (c) {\n if (S.refreshToken && !S.refreshToken.includes(\"SECURED_BY_OIDC_SERVICE_WORKER\"))\n throw new Error(\"Refresh token should be hidden by service worker\");\n if (P && S.accessToken && S.accessToken.includes(\"SECURED_BY_OIDC_SERVICE_WORKER\"))\n throw new Error(\"Demonstration of proof of possession require Access token not hidden by service worker\");\n }\n if (c)\n await c.initAsync(l, \"syncTokensAsync\", t), k = c.getLoginParams(), P && await c.setDemonstratingProofOfPossessionNonce(P);\n else {\n const E = I(e.configurationName, t.storage);\n k = E.getLoginParams(), P && await E.setDemonstratingProofOfPossessionNonce(P);\n }\n return await e.startCheckSessionAsync(l.checkSessionIframe, s, _, n), e.publishEvent(p.loginCallbackAsync_end, {}), {\n tokens: S,\n state: \"request.state\",\n callbackPath: k.callbackPath\n };\n } catch (t) {\n throw console.error(t), e.publishEvent(p.loginCallbackAsync_error, t), t;\n }\n}, he = {\n access_token: \"access_token\",\n refresh_token: \"refresh_token\"\n}, Q = (e, n) => {\n const t = {};\n if (e) {\n for (const [s, o] of Object.entries(e))\n if (s.endsWith(n)) {\n const r = s.replace(n, \"\");\n t[r] = o;\n }\n return t;\n }\n return t;\n}, un = (e) => {\n const n = {};\n if (e) {\n for (const [t, s] of Object.entries(e))\n t.includes(\":\") || (n[t] = s);\n return n;\n }\n return n;\n}, _n = (e) => async (n) => {\n B.clearTimeout(e.timeoutId), e.timeoutId = null, e.checkSessionIFrame && e.checkSessionIFrame.stop();\n const t = await C(e.configuration, e.configurationName);\n t ? await t.clearAsync(n) : await I(e.configurationName, e.configuration.storage).clearAsync(n), e.tokens = null, e.userInfo = null;\n}, fn = (e, n, t, s, o) => async (r = void 0, i = null) => {\n const l = e.configuration, a = await e.initAsync(l.authority, l.authority_configuration);\n r && typeof r != \"string\" && (r = void 0, s.warn(\"callbackPathOrUrl path is not a string\"));\n const f = r ?? o.getPath();\n let _ = !1;\n r && (_ = r.includes(\"https://\") || r.includes(\"http://\"));\n const c = _ ? r : o.getOrigin() + f, u = e.tokens ? e.tokens.idToken : \"\";\n try {\n const w = a.revocationEndpoint;\n if (w) {\n const A = [], v = e.tokens ? e.tokens.accessToken : null;\n if (v && l.logout_tokens_to_invalidate.includes(he.access_token)) {\n const y = Q(i, \":revoke_access_token\"), k = fe(t)(\n w,\n v,\n te.access_token,\n l.client_id,\n y\n );\n A.push(k);\n }\n const T = e.tokens ? e.tokens.refreshToken : null;\n if (T && l.logout_tokens_to_invalidate.includes(he.refresh_token)) {\n const y = Q(i, \":revoke_refresh_token\"), k = fe(t)(\n w,\n T,\n te.refresh_token,\n l.client_id,\n y\n );\n A.push(k);\n }\n A.length > 0 && await Promise.all(A);\n }\n } catch (w) {\n s.warn(\"logoutAsync: error when revoking tokens, if the error persist, you ay configure property logout_tokens_to_invalidate from configuration to avoid this error\"), s.warn(w);\n }\n const h = e.tokens && e.tokens.idTokenPayload ? e.tokens.idTokenPayload.sub : null;\n await e.destroyAsync(\"LOGGED_OUT\");\n for (const [w, A] of Object.entries(n))\n A !== e ? await e.logoutSameTabAsync(e.configuration.client_id, h) : e.publishEvent(p.logout_from_same_tab, {});\n const g = Q(i, \":oidc\");\n if (g && g.no_reload === \"true\")\n return;\n const d = un(i);\n if (a.endSessionEndpoint) {\n \"id_token_hint\" in d || (d.id_token_hint = u), !(\"post_logout_redirect_uri\" in d) && r !== null && (d.post_logout_redirect_uri = c);\n let w = \"\";\n for (const [A, v] of Object.entries(d))\n v != null && (w === \"\" ? w += \"?\" : w += \"&\", w += `${A}=${encodeURIComponent(v)}`);\n o.open(`${a.endSessionEndpoint}${w}`);\n } else\n o.reload();\n}, Ee = (e, n, t = !1) => async (...s) => {\n var h;\n const [o, r, ...i] = s, l = r ? { ...r } : { method: \"GET\" };\n let a = new Headers();\n l.headers && (a = l.headers instanceof Headers ? l.headers : new Headers(l.headers));\n const f = n, _ = await ge(f), c = (h = _ == null ? void 0 : _.tokens) == null ? void 0 : h.accessToken;\n if (a.has(\"Accept\") || a.set(\"Accept\", \"application/json\"), c) {\n if (f.configuration.demonstrating_proof_of_possession && t) {\n const g = await f.generateDemonstrationOfProofOfPossessionAsync(c, o.toString(), l.method);\n a.set(\"Authorization\", `PoP ${c}`), a.set(\"DPoP\", g);\n } else\n a.set(\"Authorization\", `Bearer ${c}`);\n l.credentials || (l.credentials = \"same-origin\");\n }\n const u = { ...l, headers: a };\n return await e(o, u, ...i);\n}, dn = (e) => async (n = !1, t = !1) => {\n if (e.userInfo != null && !n)\n return e.userInfo;\n const s = e.configuration, r = (await e.initAsync(s.authority, s.authority_configuration)).userInfoEndpoint, l = await (async () => {\n const f = await Ee(fetch, e, t)(r);\n return f.status !== 200 ? null : f.json();\n })();\n return e.userInfo = l, l;\n};\nclass X {\n open(n) {\n window.location.href = n;\n }\n reload() {\n window.location.reload();\n }\n getCurrentHref() {\n return window.location.href;\n }\n getPath() {\n const n = window.location;\n return n.pathname + (n.search || \"\") + (n.hash || \"\");\n }\n getOrigin() {\n return window.origin;\n }\n}\nconst hn = (e) => !!(e.os === \"iOS\" && e.osVersion.startsWith(\"12\") || e.os === \"Mac OS X\" && e.osVersion.startsWith(\"10_15_6\")), yn = (e) => {\n const n = e.appVersion, t = e.userAgent, s = \"-\";\n let o = s;\n const r = [\n { s: \"Windows 10\", r: /(Windows 10.0|Windows NT 10.0)/ },\n { s: \"Windows 8.1\", r: /(Windows 8.1|Windows NT 6.3)/ },\n { s: \"Windows 8\", r: /(Windows 8|Windows NT 6.2)/ },\n { s: \"Windows 7\", r: /(Windows 7|Windows NT 6.1)/ },\n { s: \"Windows Vista\", r: /Windows NT 6.0/ },\n { s: \"Windows Server 2003\", r: /Windows NT 5.2/ },\n { s: \"Windows XP\", r: /(Windows NT 5.1|Windows XP)/ },\n { s: \"Windows 2000\", r: /(Windows NT 5.0|Windows 2000)/ },\n { s: \"Windows ME\", r: /(Win 9x 4.90|Windows ME)/ },\n { s: \"Windows 98\", r: /(Windows 98|Win98)/ },\n { s: \"Windows 95\", r: /(Windows 95|Win95|Windows_95)/ },\n { s: \"Windows NT 4.0\", r: /(Windows NT 4.0|WinNT4.0|WinNT|Windows NT)/ },\n { s: \"Windows CE\", r: /Windows CE/ },\n { s: \"Windows 3.11\", r: /Win16/ },\n { s: \"Android\", r: /Android/ },\n { s: \"Open BSD\", r: /OpenBSD/ },\n { s: \"Sun OS\", r: /SunOS/ },\n { s: \"Chrome OS\", r: /CrOS/ },\n { s: \"Linux\", r: /(Linux|X11(?!.*CrOS))/ },\n { s: \"iOS\", r: /(iPhone|iPad|iPod)/ },\n { s: \"Mac OS X\", r: /Mac OS X/ },\n { s: \"Mac OS\", r: /(Mac OS|MacPPC|MacIntel|Mac_PowerPC|Macintosh)/ },\n { s: \"QNX\", r: /QNX/ },\n { s: \"UNIX\", r: /UNIX/ },\n { s: \"BeOS\", r: /BeOS/ },\n { s: \"OS/2\", r: /OS\\/2/ },\n { s: \"Search Bot\", r: /(nuhk|Googlebot|Yammybot|Openbot|Slurp|MSNBot|Ask Jeeves\\/Teoma|ia_archiver)/ }\n ];\n for (const l in r) {\n const a = r[l];\n if (a.r.test(t)) {\n o = a.s;\n break;\n }\n }\n let i = s;\n switch (/Windows/.test(o) && (i = /Windows (.*)/.exec(o)[1], o = \"Windows\"), o) {\n case \"Mac OS\":\n case \"Mac OS X\":\n case \"Android\":\n i = /(?:Android|Mac OS|Mac OS X|MacPPC|MacIntel|Mac_PowerPC|Macintosh) ([._\\d]+)/.exec(t)[1];\n break;\n case \"iOS\": {\n const l = /OS (\\d+)_(\\d+)_?(\\d+)?/.exec(n);\n l != null && l.length > 2 && (i = l[1] + \".\" + l[2] + \".\" + (parseInt(l[3]) | 0));\n break;\n }\n }\n return {\n os: o,\n osVersion: i\n };\n};\nfunction gn() {\n const e = navigator.userAgent;\n let n, t = e.match(/(opera|chrome|safari|firefox|msie|trident(?=\\/))\\/?\\s*(\\d+)/i) || [];\n if (/trident/i.test(t[1]))\n return n = /\\brv[ :]+(\\d+)/g.exec(e) || [], { name: \"ie\", version: n[1] || \"\" };\n if (t[1] === \"Chrome\" && (n = e.match(/\\bOPR|Edge\\/(\\d+)/), n != null)) {\n let s = n[1];\n if (!s) {\n const o = e.split(n[0] + \"/\");\n o.length > 1 && (s = o[1]);\n }\n return { name: \"opera\", version: s };\n }\n return t = t[2] ? [t[1], t[2]] : [navigator.appName, navigator.appVersion, \"-?\"], (n = e.match(/version\\/(\\d+)/i)) != null && t.splice(1, 1, n[1]), {\n name: t[0].toLowerCase(),\n version: t[1]\n };\n}\nconst kn = () => {\n const { name: e, version: n } = gn();\n if (e === \"chrome\" && parseInt(n) <= 70 || e === \"opera\" && (!n || parseInt(n.split(\".\")[0]) < 80) || e === \"ie\")\n return !1;\n const t = yn(navigator);\n return !hn(t);\n}, mn = async (e) => {\n let n;\n if (e.tokens != null)\n return !1;\n e.publishEvent(p.tryKeepExistingSessionAsync_begin, {});\n try {\n const t = e.configuration, s = await e.initAsync(t.authority, t.authority_configuration);\n if (n = await C(t, e.configurationName), n) {\n const { tokens: o } = await n.initAsync(s, \"tryKeepExistingSessionAsync\", t);\n if (o) {\n n.startKeepAliveServiceWorker(), e.tokens = o;\n const r = n.getLoginParams(e.configurationName);\n e.timeoutId = J(e, e.tokens.expiresAt, r.extras);\n const i = await n.getSessionStateAsync();\n return await e.startCheckSessionAsync(s.check_session_iframe, t.client_id, i), t.preload_user_info && await e.userInfoAsync(), e.publishEvent(p.tryKeepExistingSessionAsync_end, {\n success: !0,\n message: \"tokens inside ServiceWorker are valid\"\n }), !0;\n }\n e.publishEvent(p.tryKeepExistingSessionAsync_end, {\n success: !1,\n message: \"no exiting session found\"\n });\n } else {\n t.service_worker_relative_url && e.publishEvent(p.service_worker_not_supported_by_browser, {\n message: \"service worker is not supported by this browser\"\n });\n const o = I(e.configurationName, t.storage ?? sessionStorage), { tokens: r } = await o.initAsync();\n if (r) {\n e.tokens = z(r, null, t.token_renew_mode);\n const i = o.getLoginParams();\n e.timeoutId = J(e, e.tokens.expiresAt, i.extras);\n const l = await o.getSessionStateAsync();\n return await e.startCheckSessionAsync(s.check_session_iframe, t.client_id, l), t.preload_user_info && await e.userInfoAsync(), e.publishEvent(p.tryKeepExistingSessionAsync_end, {\n success: !0,\n message: \"tokens inside storage are valid\"\n }), !0;\n }\n }\n return e.publishEvent(p.tryKeepExistingSessionAsync_end, {\n success: !1,\n message: n ? \"service worker sessions not retrieved\" : \"session storage sessions not retrieved\"\n }), !1;\n } catch (t) {\n return console.error(t), n && await n.clearAsync(), e.publishEvent(p.tryKeepExistingSessionAsync_error, \"tokens inside ServiceWorker are invalid\"), !1;\n }\n}, pn = () => fetch;\nclass se {\n constructor(n) {\n this.authorizationEndpoint = n.authorization_endpoint, this.tokenEndpoint = n.token_endpoint, this.revocationEndpoint = n.revocation_endpoint, this.userInfoEndpoint = n.userinfo_endpoint, this.checkSessionIframe = n.check_session_iframe, this.issuer = n.issuer, this.endSessionEndpoint = n.end_session_endpoint;\n }\n}\nconst W = {}, wn = (e, n = new X()) => (t, s = \"default\") => (W[s] || (W[s] = new N(t, s, e, n)), W[s]), An = async (e) => {\n const { parsedTokens: n, callbackPath: t } = await e.loginCallbackAsync();\n return e.timeoutId = J(e, n.expiresAt), { callbackPath: t };\n}, Sn = (e) => Math.floor(Math.random() * e), F = class F {\n constructor(n, t = \"default\", s, o = new X()) {\n this.initPromise = null, this.tryKeepExistingSessionPromise = null, this.loginPromise = null, this.loginCallbackPromise = null, this.loginCallbackWithAutoTokensRenewPromise = null, this.userInfoPromise = null, this.renewTokensPromise = null, this.logoutPromise = null;\n let r = n.silent_login_uri;\n n.silent_redirect_uri && !n.silent_login_uri && (r = `${n.silent_redirect_uri.replace(\"-callback\", \"\").replace(\"callback\", \"\")}-login`);\n let i = n.refresh_time_before_tokens_expiration_in_second ?? 120;\n i > 60 && (i = i - Math.floor(Math.random() * 40)), this.location = o ?? new X();\n const l = n.service_worker_update_require_callback ?? Le(this.location);\n this.configuration = {\n ...n,\n silent_login_uri: r,\n token_automatic_renew_mode: n.token_automatic_renew_mode ?? V.AutomaticBeforeTokenExpiration,\n monitor_session: n.monitor_session ?? !1,\n refresh_time_before_tokens_expiration_in_second: i,\n silent_login_timeout: n.silent_login_timeout ?? 12e3,\n token_renew_mode: n.token_renew_mode ?? Z.access_token_or_id_token_invalid,\n demonstrating_proof_of_possession: n.demonstrating_proof_of_possession ?? !1,\n authority_timeout_wellknowurl_in_millisecond: n.authority_timeout_wellknowurl_in_millisecond ?? 1e4,\n logout_tokens_to_invalidate: n.logout_tokens_to_invalidate ?? [\"access_token\", \"refresh_token\"],\n service_worker_update_require_callback: l,\n service_worker_activate: n.service_worker_activate ?? kn,\n demonstrating_proof_of_possession_configuration: n.demonstrating_proof_of_possession_configuration ?? Ke,\n preload_user_info: n.preload_user_info ?? !1\n }, this.getFetch = s ?? pn, this.configurationName = t, this.tokens = null, this.userInfo = null, this.events = [], this.timeoutId = null, this.loginCallbackWithAutoTokensRenewAsync.bind(this), this.initAsync.bind(this), this.loginCallbackAsync.bind(this), this.subscribeEvents.bind(this), this.removeEventSubscription.bind(this), this.publishEvent.bind(this), this.destroyAsync.bind(this), this.logoutAsync.bind(this), this.renewTokensAsync.bind(this), this.initAsync(this.configuration.authority, this.configuration.authority_configuration);\n }\n subscribeEvents(n) {\n const t = Sn(9999999999999).toString();\n return this.events.push({ id: t, func: n }), t;\n }\n removeEventSubscription(n) {\n const t = this.events.filter((s) => s.id !== n);\n this.events = t;\n }\n publishEvent(n, t) {\n this.events.forEach((s) => {\n s.func(n, t);\n });\n }\n static get(n = \"default\") {\n const t = typeof process > \"u\";\n if (!Object.prototype.hasOwnProperty.call(W, n) && t)\n throw Error(`OIDC library does seem initialized.\nPlease checkout that you are using OIDC hook inside a component.`);\n return W[n];\n }\n _silentLoginCallbackFromIFrame() {\n if (this.configuration.silent_redirect_uri && this.configuration.silent_login_uri) {\n const n = this.location, t = Y(n.getCurrentHref());\n window.parent.postMessage(`${this.configurationName}_oidc_tokens:${JSON.stringify({ tokens: this.tokens, sessionState: t.session_state })}`, n.getOrigin());\n }\n }\n _silentLoginErrorCallbackFromIFrame(n = null) {\n if (this.configuration.silent_redirect_uri && this.configuration.silent_login_uri) {\n const t = this.location, s = Y(t.getCurrentHref());\n s.error ? window.parent.postMessage(`${this.configurationName}_oidc_error:${JSON.stringify({ error: s.error })}`, t.getOrigin()) : window.parent.postMessage(`${this.configurationName}_oidc_exception:${JSON.stringify({ error: n == null ? \"\" : n.toString() })}`, t.getOrigin());\n }\n }\n async silentLoginCallbackAsync() {\n try {\n await this.loginCallbackAsync(!0), this._silentLoginCallbackFromIFrame();\n } catch (n) {\n console.error(n), this._silentLoginErrorCallbackFromIFrame(n);\n }\n }\n async initAsync(n, t) {\n if (this.initPromise !== null)\n return this.initPromise;\n const s = async () => {\n if (t != null)\n return new se({\n authorization_endpoint: t.authorization_endpoint,\n end_session_endpoint: t.end_session_endpoint,\n revocation_endpoint: t.revocation_endpoint,\n token_endpoint: t.token_endpoint,\n userinfo_endpoint: t.userinfo_endpoint,\n check_session_iframe: t.check_session_iframe,\n issuer: t.issuer\n });\n const r = await C(this.configuration, this.configurationName) ? window.localStorage : null;\n return await Qe(this.getFetch())(n, this.configuration.authority_time_cache_wellknowurl_in_second ?? 60 * 60, r, this.configuration.authority_timeout_wellknowurl_in_millisecond);\n };\n return this.initPromise = s(), this.initPromise.then((o) => (this.initPromise = null, o));\n }\n async tryKeepExistingSessionAsync() {\n return this.tryKeepExistingSessionPromise !== null ? this.tryKeepExistingSessionPromise : (this.tryKeepExistingSessionPromise = mn(this), this.tryKeepExistingSessionPromise.then((n) => (this.tryKeepExistingSessionPromise = null, n)));\n }\n async startCheckSessionAsync(n, t, s, o = !1) {\n await rn(this, W, this.configuration)(n, t, s, o);\n }\n async loginAsync(n = void 0, t = null, s = !1, o = void 0, r = !1) {\n return this.loginPromise !== null ? this.loginPromise : r ? on(window, this.configurationName, this.configuration, this.publishEvent.bind(this), this)(t, o) : (this.loginPromise = cn(this.configurationName, this.configuration, this.publishEvent.bind(this), this.initAsync.bind(this), this.location)(n, t, s, o), this.loginPromise.then((i) => (this.loginPromise = null, i)));\n }\n async loginCallbackAsync(n = !1) {\n if (this.loginCallbackPromise !== null)\n return this.loginCallbackPromise;\n const t = async () => {\n const s = await ln(this)(n), o = s.tokens;\n return this.tokens = o, await C(this.configuration, this.configurationName) || I(this.configurationName, this.configuration.storage).setTokens(o), this.publishEvent(F.eventNames.token_aquired, o), this.configuration.preload_user_info && await this.userInfoAsync(), { parsedTokens: o, state: s.state, callbackPath: s.callbackPath };\n };\n return this.loginCallbackPromise = t(), this.loginCallbackPromise.then((s) => (this.loginCallbackPromise = null, s));\n }\n async generateDemonstrationOfProofOfPossessionAsync(n, t, s, o = {}) {\n const r = this.configuration, i = {\n ath: await ve(n),\n ...o\n }, l = await C(r, this.configurationName);\n let a;\n if (l)\n return `DPOP_SECURED_BY_OIDC_SERVICE_WORKER_${this.configurationName}`;\n const f = I(this.configurationName, r.storage);\n let _ = await f.getDemonstratingProofOfPossessionJwkAsync();\n return a = await f.getDemonstratingProofOfPossessionNonce(), a && (i.nonce = a), await Ae(window)(r.demonstrating_proof_of_possession_configuration)(_, s, t, i);\n }\n loginCallbackWithAutoTokensRenewAsync() {\n return this.loginCallbackWithAutoTokensRenewPromise !== null ? this.loginCallbackWithAutoTokensRenewPromise : (this.loginCallbackWithAutoTokensRenewPromise = An(this), this.loginCallbackWithAutoTokensRenewPromise.then((n) => (this.loginCallbackWithAutoTokensRenewPromise = null, n)));\n }\n userInfoAsync(n = !1, t = !1) {\n return this.userInfoPromise !== null ? this.userInfoPromise : (this.userInfoPromise = dn(this)(n, t), this.userInfoPromise.then((s) => (this.userInfoPromise = null, s)));\n }\n async renewTokensAsync(n = null) {\n if (this.renewTokensPromise !== null)\n return this.renewTokensPromise;\n if (this.timeoutId)\n return B.clearTimeout(this.timeoutId), this.renewTokensPromise = Te(this, !0, n), this.renewTokensPromise.then((t) => (this.renewTokensPromise = null, t));\n }\n async destroyAsync(n) {\n return await _n(this)(n);\n }\n async logoutSameTabAsync(n, t) {\n this.configuration.monitor_session && this.configuration.client_id === n && t && this.tokens && this.tokens.idTokenPayload && this.tokens.idTokenPayload.sub === t && (await this.destroyAsync(\"LOGGED_OUT\"), this.publishEvent(p.logout_from_same_tab, { mmessage: \"SessionMonitor\", sub: t }));\n }\n async logoutOtherTabAsync(n, t) {\n this.configuration.monitor_session && this.configuration.client_id === n && t && this.tokens && this.tokens.idTokenPayload && this.tokens.idTokenPayload.sub === t && (await this.destroyAsync(\"LOGGED_OUT\"), this.publishEvent(p.logout_from_another_tab, { message: \"SessionMonitor\", sub: t }));\n }\n async logoutAsync(n = void 0, t = null) {\n return this.logoutPromise ? this.logoutPromise : (this.logoutPromise = fn(this, W, this.getFetch(), console, this.location)(n, t), this.logoutPromise.then((s) => (this.logoutPromise = null, s)));\n }\n};\nF.getOrCreate = (n, t) => (s, o = \"default\") => wn(n, t)(s, o), F.eventNames = p;\nlet N = F;\nconst K = class K {\n constructor(n) {\n this._oidc = n;\n }\n subscribeEvents(n) {\n return this._oidc.subscribeEvents(n);\n }\n removeEventSubscription(n) {\n this._oidc.removeEventSubscription(n);\n }\n publishEvent(n, t) {\n this._oidc.publishEvent(n, t);\n }\n static get(n = \"default\") {\n return new K(N.get(n));\n }\n tryKeepExistingSessionAsync() {\n return this._oidc.tryKeepExistingSessionAsync();\n }\n loginAsync(n = void 0, t = null, s = !1, o = void 0, r = !1) {\n return this._oidc.loginAsync(n, t, s, o, r);\n }\n logoutAsync(n = void 0, t = null) {\n return this._oidc.logoutAsync(n, t);\n }\n silentLoginCallbackAsync() {\n return this._oidc.silentLoginCallbackAsync();\n }\n renewTokensAsync(n = null) {\n return this._oidc.renewTokensAsync(n);\n }\n loginCallbackAsync() {\n return this._oidc.loginCallbackWithAutoTokensRenewAsync();\n }\n get tokens() {\n return this._oidc.tokens;\n }\n get configuration() {\n return this._oidc.configuration;\n }\n async generateDemonstrationOfProofOfPossessionAsync(n, t, s, o = {}) {\n return this._oidc.generateDemonstrationOfProofOfPossessionAsync(n, t, s, o);\n }\n async getValidTokenAsync(n = 200, t = 50) {\n return ge(this._oidc, n, t);\n }\n fetchWithTokens(n, t) {\n return Ee(n, this, t);\n }\n async userInfoAsync(n = !1, t = !1) {\n return this._oidc.userInfoAsync(n, t);\n }\n userInfo() {\n return this._oidc.userInfo;\n }\n};\nK.getOrCreate = (n, t = new X()) => (s, o = \"default\") => new K(N.getOrCreate(n, t)(s, o)), K.eventNames = N.eventNames;\nlet ye = K;\nexport {\n ye as OidcClient,\n X as OidcLocation,\n V as TokenAutomaticRenewMode,\n Z as TokenRenewMode,\n pn as getFetchDefault,\n Y as getParseQueryStringFromLocation,\n Tn as getPath\n};\n","import { jsx as i, jsxs as E, Fragment as b } from \"react/jsx-runtime\";\nimport { OidcClient as r, getParseQueryStringFromLocation as V, getPath as O, OidcLocation as M, getFetchDefault as X } from \"@axa-fr/oidc-client\";\nimport { OidcClient as Me, OidcLocation as De, TokenAutomaticRenewMode as xe, TokenRenewMode as We } from \"@axa-fr/oidc-client\";\nimport Z, { useCallback as ee, useState as f, useEffect as v } from \"react\";\nconst x = \"default\", te = (t, s, e = !1) => async (...n) => await s().fetchWithTokens(t, e)(...n), Oe = (t = null, s = x, e = !1) => (n) => (o) => {\n const { fetch: c } = ne(t || o.fetch, s, e);\n return /* @__PURE__ */ i(n, { ...o, fetch: c });\n}, ne = (t = null, s = x, e = !1) => {\n const n = t || window.fetch, o = r.get;\n return { fetch: ee(\n (l, a) => te(n, () => o(s), e)(l, a),\n [n, s]\n ) };\n}, W = () => /* @__PURE__ */ i(\"div\", { className: \"oidc-authenticating\", children: /* @__PURE__ */ E(\"div\", { className: \"oidc-authenticating__container\", children: [\n /* @__PURE__ */ i(\"h1\", { className: \"oidc-authenticating__title\", children: \"Error authentication\" }),\n /* @__PURE__ */ i(\"p\", { className: \"oidc-authenticating__content\", children: \"An error occurred during authentication.\" })\n] }) }), se = () => /* @__PURE__ */ i(\"div\", { className: \"oidc-authenticating\", children: /* @__PURE__ */ E(\"div\", { className: \"oidc-authenticating__container\", children: [\n /* @__PURE__ */ i(\"h1\", { className: \"oidc-authenticating__title\", children: \"Authentication in progress\" }),\n /* @__PURE__ */ i(\"p\", { className: \"oidc-authenticating__content\", children: \"You will be redirected to the login page.\" })\n] }) }), oe = () => Math.random().toString(36).substr(2, 6), ce = (t, s) => (e, n) => {\n if (typeof t.CustomEvent == \"function\")\n return new t.CustomEvent(e, n);\n const o = n || { bubbles: !1, cancelable: !1, detail: void 0 }, c = s.createEvent(\"CustomEvent\");\n return c.initCustomEvent(e, o.bubbles, o.cancelable, o.detail), c.prototype = t.Event.prototype, c;\n}, re = (t, s, e) => ({\n replaceState: (n, o) => {\n const c = e(), l = o || t.history.state;\n t.history.replaceState({ key: c, state: l }, null, n), t.dispatchEvent(s(\"popstate\"));\n }\n}), ie = () => re(window, ce(window, document), oe), R = () => /* @__PURE__ */ i(\"div\", { className: \"oidc-callback\", children: /* @__PURE__ */ E(\"div\", { className: \"oidc-callback__container\", children: [\n /* @__PURE__ */ i(\"h1\", { className: \"oidc-callback__title\", children: \"Authentication complete\" }),\n /* @__PURE__ */ i(\"p\", { className: \"oidc-callback__content\", children: \"You will be redirected to your application.\" })\n] }) }), ae = ({ callBackError: t, callBackSuccess: s, configurationName: e, withCustomHistory: n }) => {\n const [o, c] = f(!1);\n v(() => {\n let d = !0;\n return (async () => {\n const _ = r.get;\n try {\n const { callbackPath: h } = await _(e).loginCallbackAsync();\n (n ? n() : ie()).replaceState(h || \"/\");\n } catch (h) {\n d && (console.warn(h), c(!0));\n }\n })(), () => {\n d = !1;\n };\n }, []);\n const l = t || W, a = s || R;\n return o ? /* @__PURE__ */ i(l, { configurationName: e }) : /* @__PURE__ */ i(a, { configurationName: e });\n}, le = () => /* @__PURE__ */ i(\"span\", { className: \"oidc-loading\", children: \"Loading\" }), de = () => /* @__PURE__ */ i(\"div\", { className: \"oidc-serviceworker\", children: /* @__PURE__ */ E(\"div\", { className: \"oidc-serviceworker__container\", children: [\n /* @__PURE__ */ i(\"h1\", { className: \"oidc-serviceworker__title\", children: \"Unable to authenticate on this browser\" }),\n /* @__PURE__ */ i(\"p\", { className: \"oidc-serviceworker__content\", children: \"Your browser is not secure enough to make authentication work. Try updating your browser or use a newer browser.\" })\n] }) }), ue = () => /* @__PURE__ */ i(\"div\", { className: \"oidc-session-lost\", children: /* @__PURE__ */ E(\"div\", { className: \"oidc-session-lost__container\", children: [\n /* @__PURE__ */ i(\"h1\", { className: \"oidc-session-lost__title\", children: \"Session timed out\" }),\n /* @__PURE__ */ i(\"p\", { className: \"oidc-session-lost__content\", children: \"Your session has expired. Please re-authenticate.\" })\n] }) }), ke = ({ configurationName: t }) => (v(() => {\n (async () => {\n const e = r.get;\n e(t).silentLoginCallbackAsync();\n })();\n}, []), /* @__PURE__ */ i(b, {})), he = ({ configurationName: t }) => {\n const s = V(window.location.href), e = r.get, n = e(t);\n let o = null;\n for (const [c, l] of Object.entries(s))\n c === \"state\" || c === \"scope\" || (o === null && (o = {}), o[c] = l);\n return v(() => {\n n.tokens || n.loginAsync(null, o, !0, s.scope);\n }, []), /* @__PURE__ */ i(b, {});\n}, _e = ({\n callbackErrorComponent: t,\n callbackSuccessComponent: s,\n redirect_uri: e,\n silent_redirect_uri: n,\n silent_login_uri: o,\n children: c,\n configurationName: l,\n withCustomHistory: a = null,\n location: d\n}) => {\n const u = window ? O(window.location.href) : \"\", [_, h] = f(u);\n v(() => {\n const g = () => h(O(window.location.href));\n return g(), window.addEventListener(\"popstate\", g, !1), () => window.removeEventListener(\"popstate\", g, !1);\n }, []);\n const p = O(e);\n if (n && _ === O(n))\n return /* @__PURE__ */ i(ke, { configurationName: l });\n if (o && _ === O(o))\n return /* @__PURE__ */ i(he, { configurationName: l });\n switch (_) {\n case p:\n return /* @__PURE__ */ i(ae, { callBackError: t, callBackSuccess: s, configurationName: l, withCustomHistory: a });\n default:\n return /* @__PURE__ */ i(b, { children: c });\n }\n}, fe = Z.memo(_e), D = { name: \"\", data: null }, ve = ({ loadingComponent: t, children: s, configurationName: e }) => {\n const [n, o] = f(!0), c = r.get, l = c(e);\n return v(() => {\n let d = !0;\n return l && l.tryKeepExistingSessionAsync().then(() => {\n d && o(!1);\n }), () => {\n d = !1;\n };\n }, [e]), /* @__PURE__ */ i(b, { children: n ? /* @__PURE__ */ i(t, { configurationName: e }) : /* @__PURE__ */ i(b, { children: s }) });\n}, P = ({ isLoading: t, loadingComponent: s, children: e, configurationName: n }) => {\n const o = s;\n return t ? /* @__PURE__ */ i(o, { configurationName: n, children: e }) : /* @__PURE__ */ i(b, { children: e });\n}, Pe = ({\n children: t,\n configuration: s,\n configurationName: e = \"default\",\n callbackSuccessComponent: n = R,\n authenticatingComponent: o = se,\n loadingComponent: c = le,\n serviceWorkerNotSupportedComponent: l = de,\n authenticatingErrorComponent: a = W,\n sessionLostComponent: d = ue,\n onSessionLost: u = null,\n onLogoutFromAnotherTab: _ = null,\n onLogoutFromSameTab: h = null,\n withCustomHistory: p = null,\n onEvent: g = null,\n getFetch: y = null,\n location: S = null\n}) => {\n const w = (L = \"default\") => r.getOrCreate(y ?? X, S ?? new M())(s, L), [j, B] = f(!0), [z, C] = f(D), [K, $] = f(\"default\");\n v(() => {\n const I = w(e).subscribeEvents((k, T) => {\n g && g(e, k, T);\n });\n return () => {\n w(e).removeEventSubscription(I);\n };\n }, [e, g]), v(() => {\n const I = w(e).subscribeEvents((k, T) => {\n if (k === r.eventNames.refreshTokensAsync_error || k === r.eventNames.syncTokensAsync_error) {\n if (u != null) {\n u();\n return;\n }\n C({ name: k, data: T });\n } else if (k === r.eventNames.logout_from_another_tab) {\n if (_ != null) {\n _();\n return;\n }\n C({ name: k, data: T });\n } else\n k === r.eventNames.logout_from_same_tab ? h != null && h() : k === r.eventNames.loginAsync_begin || k === r.eventNames.loginCallbackAsync_end || k === r.eventNames.loginAsync_error || k === r.eventNames.loginCallbackAsync_error ? C({ name: k, data: T }) : k === r.eventNames.service_worker_not_supported_by_browser && s.service_worker_only === !0 && C({ name: k, data: T });\n });\n return $(e), B(!1), () => {\n w(e).removeEventSubscription(I), C(D);\n };\n }, [s, e]);\n const G = d, H = o, m = c, Q = l, J = a, A = j || K !== e, N = w(e);\n switch (z.name) {\n case r.eventNames.service_worker_not_supported_by_browser:\n return /* @__PURE__ */ i(P, { loadingComponent: m, isLoading: A, configurationName: e, children: /* @__PURE__ */ i(Q, { configurationName: e }) });\n case r.eventNames.loginAsync_begin:\n return /* @__PURE__ */ i(P, { loadingComponent: m, isLoading: A, configurationName: e, children: /* @__PURE__ */ i(H, { configurationName: e }) });\n case r.eventNames.loginAsync_error:\n case r.eventNames.loginCallbackAsync_error:\n return /* @__PURE__ */ i(P, { loadingComponent: m, isLoading: A, configurationName: e, children: /* @__PURE__ */ i(J, { configurationName: e }) });\n case r.eventNames.refreshTokensAsync_error:\n case r.eventNames.syncTokensAsync_error:\n case r.eventNames.logout_from_another_tab:\n return /* @__PURE__ */ i(P, { loadingComponent: m, isLoading: A, configurationName: e, children: /* @__PURE__ */ i(G, { configurationName: e }) });\n default:\n return /* @__PURE__ */ i(P, { loadingComponent: m, isLoading: A, configurationName: e, children: /* @__PURE__ */ i(\n fe,\n {\n redirect_uri: N.configuration.redirect_uri,\n silent_redirect_uri: N.configuration.silent_redirect_uri,\n silent_login_uri: N.configuration.silent_login_uri,\n callbackSuccessComponent: n,\n callbackErrorComponent: a,\n authenticatingComponent: o,\n configurationName: e,\n withCustomHistory: p,\n location: S ?? new M(),\n children: /* @__PURE__ */ i(ve, { loadingComponent: m, configurationName: e, children: t })\n }\n ) });\n }\n}, ge = ({ children: t, callbackPath: s = null, extras: e = null, configurationName: n = \"default\" }) => {\n const o = r.get, c = o(n);\n return v(() => {\n c.tokens || c.loginAsync(s, e);\n }, [n, s, e]), c.tokens ? /* @__PURE__ */ i(b, { children: t }) : null;\n}, Ee = (t, s = null, e = null, n = \"default\") => (o) => /* @__PURE__ */ i(ge, { callbackPath: s, extras: e, configurationName: n, children: /* @__PURE__ */ i(t, { ...o }) }), F = \"default\", U = (t, s) => {\n let e = !1;\n return t(s) && (e = t(s).tokens != null), e;\n}, Se = (t = F) => {\n const s = r.get, [e, n] = f(U(s, t));\n return v(() => {\n let a = !0;\n const d = s(t);\n n(U(s, t));\n const u = d.subscribeEvents((_, h) => {\n (_ === r.eventNames.logout_from_another_tab || _ === r.eventNames.logout_from_same_tab || _ === r.eventNames.token_aquired) && a && n(U(s, t));\n });\n return () => {\n a = !1, d.removeEventSubscription(u);\n };\n }, [t]), { login: (a = void 0, d = null, u = !1) => s(t).loginAsync(a, d, !1, void 0, u), logout: (a = void 0, d = null) => s(t).logoutAsync(a, d), renewTokens: async (a = null) => {\n const d = await s(t).renewTokensAsync(a);\n return {\n // @ts-ignore\n accessToken: d.accessToken,\n // @ts-ignore\n accessTokenPayload: d.accessTokenPayload,\n // @ts-ignore\n idToken: d.idToken,\n // @ts-ignore\n idTokenPayload: d.idTokenPayload\n };\n }, isAuthenticated: e };\n}, q = { accessToken: null, accessTokenPayload: null }, pe = (t) => {\n const s = r.get, e = s(t);\n if (e.tokens) {\n const n = e.tokens;\n return {\n accessToken: n.accessToken,\n accessTokenPayload: n.accessTokenPayload,\n generateDemonstrationOfProofOfPossessionAsync: e.configuration.demonstrating_proof_of_possession ? (o, c) => e.generateDemonstrationOfProofOfPossessionAsync(n.accessToken, o, c) : null\n };\n }\n return q;\n};\nfunction ye(t, s) {\n return t.configuration.demonstrating_proof_of_possession ? (e, n, o = {}) => t.generateDemonstrationOfProofOfPossessionAsync(s.accessToken, e, n, o) : null;\n}\nconst Ne = (t = F) => {\n const s = r.get, [e, n] = f(pe(t));\n return v(() => {\n let o = !0;\n const c = s(t);\n if (c.tokens) {\n const a = c.tokens;\n n({ accessToken: a.accessToken, accessTokenPayload: a.accessTokenPayload });\n }\n const l = c.subscribeEvents((a, d) => {\n if ((a === r.eventNames.token_renewed || a === r.eventNames.token_aquired || a === r.eventNames.logout_from_another_tab || a === r.eventNames.logout_from_same_tab || a === r.eventNames.refreshTokensAsync_error || a === r.eventNames.syncTokensAsync_error) && o) {\n const u = c.tokens;\n n(u != null ? {\n accessToken: u.accessToken,\n accessTokenPayload: u.accessTokenPayload,\n generateDemonstrationOfProofOfPossessionAsync: ye(c, u)\n } : q);\n }\n });\n return () => {\n o = !1, c.removeEventSubscription(l);\n };\n }, [t]), e;\n}, Y = { idToken: null, idTokenPayload: null }, be = (t) => {\n const s = r.get, e = s(t);\n if (e.tokens) {\n const n = e.tokens;\n return { idToken: n.idToken, idTokenPayload: n.idTokenPayload };\n }\n return Y;\n}, Le = (t = F) => {\n const s = r.get, [e, n] = f(be(t));\n return v(() => {\n let o = !0;\n const c = s(t);\n if (c.tokens) {\n const a = c.tokens;\n n({ idToken: a.idToken, idTokenPayload: a.idTokenPayload });\n }\n const l = c.subscribeEvents((a, d) => {\n if ((a === r.eventNames.token_renewed || a === r.eventNames.token_aquired || a === r.eventNames.logout_from_another_tab || a === r.eventNames.logout_from_same_tab || a === r.eventNames.refreshTokensAsync_error || a === r.eventNames.syncTokensAsync_error) && o) {\n const u = c.tokens;\n n(u != null ? { idToken: u.idToken, idTokenPayload: u.idTokenPayload } : Y);\n }\n });\n return () => {\n o = !1, c.removeEventSubscription(l);\n };\n }, [t]), e;\n};\nvar me = /* @__PURE__ */ ((t) => (t.Unauthenticated = \"Unauthenticated\", t.Loading = \"Loading user\", t.Loaded = \"User loaded\", t.LoadingError = \"Error loading user\", t))(me || {});\nconst Ie = (t = \"default\", s = !1) => {\n const n = r.get(t).userInfo(), [o, c] = f({\n user: n,\n status: n ? \"User loaded\" : \"Unauthenticated\"\n /* Unauthenticated */\n }), [l, a] = f(n ? 1 : 0), [d, u] = f(n ? 1 : 0);\n v(() => {\n const h = r.get(t);\n let p = !0;\n if (h && h.tokens) {\n const y = l === d;\n if (y && h.userInfo())\n return;\n c({\n ...o,\n status: \"Loading user\"\n /* Loading */\n }), h.userInfoAsync(!y, s).then((S) => {\n p && c({\n user: S,\n status: \"User loaded\"\n /* Loaded */\n });\n }).catch(() => c({\n ...o,\n status: \"Error loading user\"\n /* LoadingError */\n })), u(l);\n } else\n c({\n user: null,\n status: \"Unauthenticated\"\n /* Unauthenticated */\n });\n const g = h.subscribeEvents((y) => {\n (y === r.eventNames.logout_from_another_tab || y === r.eventNames.logout_from_same_tab) && p && c({\n user: null,\n status: \"Unauthenticated\"\n /* Unauthenticated */\n });\n });\n return () => {\n p = !1, h.removeEventSubscription(g);\n };\n }, [l]);\n const _ = () => {\n a(l + 1);\n };\n return { oidcUser: o.user, oidcUserLoadingState: o.status, reloadOidcUser: _ };\n};\nexport {\n Me as OidcClient,\n De as OidcLocation,\n Pe as OidcProvider,\n ge as OidcSecure,\n me as OidcUserStatus,\n xe as TokenAutomaticRenewMode,\n We as TokenRenewMode,\n Se as useOidc,\n Ne as useOidcAccessToken,\n ne as useOidcFetch,\n Le as useOidcIdToken,\n Ie as useOidcUser,\n Oe as withOidcFetch,\n Ee as withOidcSecure\n};\n","export const baseUrl = import.meta.env.VITE_API_URL || 'Fallback-URL'\r\nexport const baseUrlIdent = import.meta.env.VITE_IDENT_URL || 'Fallback-URL'\r\nexport const protectedResources = {\r\n apiList: {\r\n createOrUpdateDashboard: baseUrl + '/dashboard/createOrUpdate',\r\n deleteDashboard: baseUrl + '/dashboard/delete',\r\n readDashboard: baseUrl + '/dashboard/read',\r\n\r\n readSalutation: baseUrl + '/salutation/read',\r\n\r\n readTitles: baseUrl + '/title/read',\r\n\r\n readEvent: baseUrl + '/event/read',\r\n readEventParticipants: baseUrl + '/event/readParticipantList',\r\n readDocTemplate: baseUrl + '/event/readDocTemplate',\r\n\r\n readFileTypes: baseUrl + '/Setting/FileTypes',\r\n\r\n readProfile: baseUrl + '/profile/read',\r\n createOrUpdateProfile: baseUrl + '/profile/CreateOrUpdate',\r\n createOrUpdateDocent: baseUrl + '/Profile/CreateOrUpdateDocent',\r\n\r\n createFile: baseUrl + '/File/save',\r\n readFiles: baseUrl + '/File/read',\r\n readFileContent: baseUrl + '/File/readFile',\r\n deleteFile: baseUrl + '/File/delete',\r\n\r\n readAllDocent: baseUrl + '/Docent/read/all',\r\n readRequestedDocent: baseUrl + '/Docent/read/requested',\r\n readDocentByAdrNo: baseUrl + '/Docent',\r\n\r\n readTopicAreas: baseUrl + '/Setting/ReadTopicsAreas',\r\n\r\n readInstructors: baseUrl + '/Setting/ReadInstructors',\r\n\r\n videoUpload: baseUrl + '/Upload/save',\r\n videoUploadRemove: baseUrl + '/Upload/remove',\r\n },\r\n}\r\n\r\nexport const appRoles = {\r\n Teilnehmer: 'Teilnehmer',\r\n Kunde: 'Kunde',\r\n Dozent: 'Dozent',\r\n Intern: 'Intern',\r\n Anonym: 'Anonym',\r\n}\r\n\r\nimport { TokenRenewMode } from '@axa-fr/react-oidc'\r\n\r\nexport const configurationIdentityServer = {\r\n client_id: '5f5f361a-b6bd-44f3-82de-73e40bb02c52',\r\n redirect_uri: window.location.origin + '/#authentication-callback',\r\n silent_redirect_uri: window.location.origin + '/#silent-callback',\r\n silent_login_uri: window.location.origin + '/#silent-login',\r\n scope: 'openid profile skoruba_identity_admin_api email roles offline_access dozent_portal_api',\r\n authority: import.meta.env.VITE_IDENT_URL,\r\n refresh_time_before_tokens_expiration_in_second: 40,\r\n //service_worker_relative_url: './OidcServiceWorker.js',\r\n service_worker_only: false,\r\n monitor_session: true,\r\n token_renew_mode: TokenRenewMode.access_token_invalid,\r\n}\r\n","/**\n * @remix-run/router v1.16.1\n *\n * Copyright (c) Remix Software Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE.md file in the root directory of this source tree.\n *\n * @license MIT\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\n////////////////////////////////////////////////////////////////////////////////\n//#region Types and Constants\n////////////////////////////////////////////////////////////////////////////////\n/**\n * Actions represent the type of change to a location value.\n */\nvar Action;\n(function (Action) {\n /**\n * A POP indicates a change to an arbitrary index in the history stack, such\n * as a back or forward navigation. It does not describe the direction of the\n * navigation, only that the current index changed.\n *\n * Note: This is the default action for newly created history objects.\n */\n Action[\"Pop\"] = \"POP\";\n /**\n * A PUSH indicates a new entry being added to the history stack, such as when\n * a link is clicked and a new page loads. When this happens, all subsequent\n * entries in the stack are lost.\n */\n Action[\"Push\"] = \"PUSH\";\n /**\n * A REPLACE indicates the entry at the current index in the history stack\n * being replaced by a new one.\n */\n Action[\"Replace\"] = \"REPLACE\";\n})(Action || (Action = {}));\nconst PopStateEventType = \"popstate\";\n/**\n * Memory history stores the current location in memory. It is designed for use\n * in stateful non-browser environments like tests and React Native.\n */\nfunction createMemoryHistory(options) {\n if (options === void 0) {\n options = {};\n }\n let {\n initialEntries = [\"/\"],\n initialIndex,\n v5Compat = false\n } = options;\n let entries; // Declare so we can access from createMemoryLocation\n entries = initialEntries.map((entry, index) => createMemoryLocation(entry, typeof entry === \"string\" ? null : entry.state, index === 0 ? \"default\" : undefined));\n let index = clampIndex(initialIndex == null ? entries.length - 1 : initialIndex);\n let action = Action.Pop;\n let listener = null;\n function clampIndex(n) {\n return Math.min(Math.max(n, 0), entries.length - 1);\n }\n function getCurrentLocation() {\n return entries[index];\n }\n function createMemoryLocation(to, state, key) {\n if (state === void 0) {\n state = null;\n }\n let location = createLocation(entries ? getCurrentLocation().pathname : \"/\", to, state, key);\n warning(location.pathname.charAt(0) === \"/\", \"relative pathnames are not supported in memory history: \" + JSON.stringify(to));\n return location;\n }\n function createHref(to) {\n return typeof to === \"string\" ? to : createPath(to);\n }\n let history = {\n get index() {\n return index;\n },\n get action() {\n return action;\n },\n get location() {\n return getCurrentLocation();\n },\n createHref,\n createURL(to) {\n return new URL(createHref(to), \"http://localhost\");\n },\n encodeLocation(to) {\n let path = typeof to === \"string\" ? parsePath(to) : to;\n return {\n pathname: path.pathname || \"\",\n search: path.search || \"\",\n hash: path.hash || \"\"\n };\n },\n push(to, state) {\n action = Action.Push;\n let nextLocation = createMemoryLocation(to, state);\n index += 1;\n entries.splice(index, entries.length, nextLocation);\n if (v5Compat && listener) {\n listener({\n action,\n location: nextLocation,\n delta: 1\n });\n }\n },\n replace(to, state) {\n action = Action.Replace;\n let nextLocation = createMemoryLocation(to, state);\n entries[index] = nextLocation;\n if (v5Compat && listener) {\n listener({\n action,\n location: nextLocation,\n delta: 0\n });\n }\n },\n go(delta) {\n action = Action.Pop;\n let nextIndex = clampIndex(index + delta);\n let nextLocation = entries[nextIndex];\n index = nextIndex;\n if (listener) {\n listener({\n action,\n location: nextLocation,\n delta\n });\n }\n },\n listen(fn) {\n listener = fn;\n return () => {\n listener = null;\n };\n }\n };\n return history;\n}\n/**\n * Browser history stores the location in regular URLs. This is the standard for\n * most web apps, but it requires some configuration on the server to ensure you\n * serve the same app at multiple URLs.\n *\n * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#createbrowserhistory\n */\nfunction createBrowserHistory(options) {\n if (options === void 0) {\n options = {};\n }\n function createBrowserLocation(window, globalHistory) {\n let {\n pathname,\n search,\n hash\n } = window.location;\n return createLocation(\"\", {\n pathname,\n search,\n hash\n },\n // state defaults to `null` because `window.history.state` does\n globalHistory.state && globalHistory.state.usr || null, globalHistory.state && globalHistory.state.key || \"default\");\n }\n function createBrowserHref(window, to) {\n return typeof to === \"string\" ? to : createPath(to);\n }\n return getUrlBasedHistory(createBrowserLocation, createBrowserHref, null, options);\n}\n/**\n * Hash history stores the location in window.location.hash. This makes it ideal\n * for situations where you don't want to send the location to the server for\n * some reason, either because you do cannot configure it or the URL space is\n * reserved for something else.\n *\n * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#createhashhistory\n */\nfunction createHashHistory(options) {\n if (options === void 0) {\n options = {};\n }\n function createHashLocation(window, globalHistory) {\n let {\n pathname = \"/\",\n search = \"\",\n hash = \"\"\n } = parsePath(window.location.hash.substr(1));\n // Hash URL should always have a leading / just like window.location.pathname\n // does, so if an app ends up at a route like /#something then we add a\n // leading slash so all of our path-matching behaves the same as if it would\n // in a browser router. This is particularly important when there exists a\n // root splat route () since that matches internally against\n // \"/*\" and we'd expect /#something to 404 in a hash router app.\n if (!pathname.startsWith(\"/\") && !pathname.startsWith(\".\")) {\n pathname = \"/\" + pathname;\n }\n return createLocation(\"\", {\n pathname,\n search,\n hash\n },\n // state defaults to `null` because `window.history.state` does\n globalHistory.state && globalHistory.state.usr || null, globalHistory.state && globalHistory.state.key || \"default\");\n }\n function createHashHref(window, to) {\n let base = window.document.querySelector(\"base\");\n let href = \"\";\n if (base && base.getAttribute(\"href\")) {\n let url = window.location.href;\n let hashIndex = url.indexOf(\"#\");\n href = hashIndex === -1 ? url : url.slice(0, hashIndex);\n }\n return href + \"#\" + (typeof to === \"string\" ? to : createPath(to));\n }\n function validateHashLocation(location, to) {\n warning(location.pathname.charAt(0) === \"/\", \"relative pathnames are not supported in hash history.push(\" + JSON.stringify(to) + \")\");\n }\n return getUrlBasedHistory(createHashLocation, createHashHref, validateHashLocation, options);\n}\nfunction invariant(value, message) {\n if (value === false || value === null || typeof value === \"undefined\") {\n throw new Error(message);\n }\n}\nfunction warning(cond, message) {\n if (!cond) {\n // eslint-disable-next-line no-console\n if (typeof console !== \"undefined\") console.warn(message);\n try {\n // Welcome to debugging history!\n //\n // This error is thrown as a convenience, so you can more easily\n // find the source for a warning that appears in the console by\n // enabling \"pause on exceptions\" in your JavaScript debugger.\n throw new Error(message);\n // eslint-disable-next-line no-empty\n } catch (e) {}\n }\n}\nfunction createKey() {\n return Math.random().toString(36).substr(2, 8);\n}\n/**\n * For browser-based histories, we combine the state and key into an object\n */\nfunction getHistoryState(location, index) {\n return {\n usr: location.state,\n key: location.key,\n idx: index\n };\n}\n/**\n * Creates a Location object with a unique key from the given Path\n */\nfunction createLocation(current, to, state, key) {\n if (state === void 0) {\n state = null;\n }\n let location = _extends({\n pathname: typeof current === \"string\" ? current : current.pathname,\n search: \"\",\n hash: \"\"\n }, typeof to === \"string\" ? parsePath(to) : to, {\n state,\n // TODO: This could be cleaned up. push/replace should probably just take\n // full Locations now and avoid the need to run through this flow at all\n // But that's a pretty big refactor to the current test suite so going to\n // keep as is for the time being and just let any incoming keys take precedence\n key: to && to.key || key || createKey()\n });\n return location;\n}\n/**\n * Creates a string URL path from the given pathname, search, and hash components.\n */\nfunction createPath(_ref) {\n let {\n pathname = \"/\",\n search = \"\",\n hash = \"\"\n } = _ref;\n if (search && search !== \"?\") pathname += search.charAt(0) === \"?\" ? search : \"?\" + search;\n if (hash && hash !== \"#\") pathname += hash.charAt(0) === \"#\" ? hash : \"#\" + hash;\n return pathname;\n}\n/**\n * Parses a string URL path into its separate pathname, search, and hash components.\n */\nfunction parsePath(path) {\n let parsedPath = {};\n if (path) {\n let hashIndex = path.indexOf(\"#\");\n if (hashIndex >= 0) {\n parsedPath.hash = path.substr(hashIndex);\n path = path.substr(0, hashIndex);\n }\n let searchIndex = path.indexOf(\"?\");\n if (searchIndex >= 0) {\n parsedPath.search = path.substr(searchIndex);\n path = path.substr(0, searchIndex);\n }\n if (path) {\n parsedPath.pathname = path;\n }\n }\n return parsedPath;\n}\nfunction getUrlBasedHistory(getLocation, createHref, validateLocation, options) {\n if (options === void 0) {\n options = {};\n }\n let {\n window = document.defaultView,\n v5Compat = false\n } = options;\n let globalHistory = window.history;\n let action = Action.Pop;\n let listener = null;\n let index = getIndex();\n // Index should only be null when we initialize. If not, it's because the\n // user called history.pushState or history.replaceState directly, in which\n // case we should log a warning as it will result in bugs.\n if (index == null) {\n index = 0;\n globalHistory.replaceState(_extends({}, globalHistory.state, {\n idx: index\n }), \"\");\n }\n function getIndex() {\n let state = globalHistory.state || {\n idx: null\n };\n return state.idx;\n }\n function handlePop() {\n action = Action.Pop;\n let nextIndex = getIndex();\n let delta = nextIndex == null ? null : nextIndex - index;\n index = nextIndex;\n if (listener) {\n listener({\n action,\n location: history.location,\n delta\n });\n }\n }\n function push(to, state) {\n action = Action.Push;\n let location = createLocation(history.location, to, state);\n if (validateLocation) validateLocation(location, to);\n index = getIndex() + 1;\n let historyState = getHistoryState(location, index);\n let url = history.createHref(location);\n // try...catch because iOS limits us to 100 pushState calls :/\n try {\n globalHistory.pushState(historyState, \"\", url);\n } catch (error) {\n // If the exception is because `state` can't be serialized, let that throw\n // outwards just like a replace call would so the dev knows the cause\n // https://html.spec.whatwg.org/multipage/nav-history-apis.html#shared-history-push/replace-state-steps\n // https://html.spec.whatwg.org/multipage/structured-data.html#structuredserializeinternal\n if (error instanceof DOMException && error.name === \"DataCloneError\") {\n throw error;\n }\n // They are going to lose state here, but there is no real\n // way to warn them about it since the page will refresh...\n window.location.assign(url);\n }\n if (v5Compat && listener) {\n listener({\n action,\n location: history.location,\n delta: 1\n });\n }\n }\n function replace(to, state) {\n action = Action.Replace;\n let location = createLocation(history.location, to, state);\n if (validateLocation) validateLocation(location, to);\n index = getIndex();\n let historyState = getHistoryState(location, index);\n let url = history.createHref(location);\n globalHistory.replaceState(historyState, \"\", url);\n if (v5Compat && listener) {\n listener({\n action,\n location: history.location,\n delta: 0\n });\n }\n }\n function createURL(to) {\n // window.location.origin is \"null\" (the literal string value) in Firefox\n // under certain conditions, notably when serving from a local HTML file\n // See https://bugzilla.mozilla.org/show_bug.cgi?id=878297\n let base = window.location.origin !== \"null\" ? window.location.origin : window.location.href;\n let href = typeof to === \"string\" ? to : createPath(to);\n // Treating this as a full URL will strip any trailing spaces so we need to\n // pre-encode them since they might be part of a matching splat param from\n // an ancestor route\n href = href.replace(/ $/, \"%20\");\n invariant(base, \"No window.location.(origin|href) available to create URL for href: \" + href);\n return new URL(href, base);\n }\n let history = {\n get action() {\n return action;\n },\n get location() {\n return getLocation(window, globalHistory);\n },\n listen(fn) {\n if (listener) {\n throw new Error(\"A history only accepts one active listener\");\n }\n window.addEventListener(PopStateEventType, handlePop);\n listener = fn;\n return () => {\n window.removeEventListener(PopStateEventType, handlePop);\n listener = null;\n };\n },\n createHref(to) {\n return createHref(window, to);\n },\n createURL,\n encodeLocation(to) {\n // Encode a Location the same way window.location would\n let url = createURL(to);\n return {\n pathname: url.pathname,\n search: url.search,\n hash: url.hash\n };\n },\n push,\n replace,\n go(n) {\n return globalHistory.go(n);\n }\n };\n return history;\n}\n//#endregion\n\nvar ResultType;\n(function (ResultType) {\n ResultType[\"data\"] = \"data\";\n ResultType[\"deferred\"] = \"deferred\";\n ResultType[\"redirect\"] = \"redirect\";\n ResultType[\"error\"] = \"error\";\n})(ResultType || (ResultType = {}));\nconst immutableRouteKeys = new Set([\"lazy\", \"caseSensitive\", \"path\", \"id\", \"index\", \"children\"]);\nfunction isIndexRoute(route) {\n return route.index === true;\n}\n// Walk the route tree generating unique IDs where necessary, so we are working\n// solely with AgnosticDataRouteObject's within the Router\nfunction convertRoutesToDataRoutes(routes, mapRouteProperties, parentPath, manifest) {\n if (parentPath === void 0) {\n parentPath = [];\n }\n if (manifest === void 0) {\n manifest = {};\n }\n return routes.map((route, index) => {\n let treePath = [...parentPath, index];\n let id = typeof route.id === \"string\" ? route.id : treePath.join(\"-\");\n invariant(route.index !== true || !route.children, \"Cannot specify children on an index route\");\n invariant(!manifest[id], \"Found a route id collision on id \\\"\" + id + \"\\\". Route \" + \"id's must be globally unique within Data Router usages\");\n if (isIndexRoute(route)) {\n let indexRoute = _extends({}, route, mapRouteProperties(route), {\n id\n });\n manifest[id] = indexRoute;\n return indexRoute;\n } else {\n let pathOrLayoutRoute = _extends({}, route, mapRouteProperties(route), {\n id,\n children: undefined\n });\n manifest[id] = pathOrLayoutRoute;\n if (route.children) {\n pathOrLayoutRoute.children = convertRoutesToDataRoutes(route.children, mapRouteProperties, treePath, manifest);\n }\n return pathOrLayoutRoute;\n }\n });\n}\n/**\n * Matches the given routes to a location and returns the match data.\n *\n * @see https://reactrouter.com/utils/match-routes\n */\nfunction matchRoutes(routes, locationArg, basename) {\n if (basename === void 0) {\n basename = \"/\";\n }\n let location = typeof locationArg === \"string\" ? parsePath(locationArg) : locationArg;\n let pathname = stripBasename(location.pathname || \"/\", basename);\n if (pathname == null) {\n return null;\n }\n let branches = flattenRoutes(routes);\n rankRouteBranches(branches);\n let matches = null;\n for (let i = 0; matches == null && i < branches.length; ++i) {\n // Incoming pathnames are generally encoded from either window.location\n // or from router.navigate, but we want to match against the unencoded\n // paths in the route definitions. Memory router locations won't be\n // encoded here but there also shouldn't be anything to decode so this\n // should be a safe operation. This avoids needing matchRoutes to be\n // history-aware.\n let decoded = decodePath(pathname);\n matches = matchRouteBranch(branches[i], decoded);\n }\n return matches;\n}\nfunction convertRouteMatchToUiMatch(match, loaderData) {\n let {\n route,\n pathname,\n params\n } = match;\n return {\n id: route.id,\n pathname,\n params,\n data: loaderData[route.id],\n handle: route.handle\n };\n}\nfunction flattenRoutes(routes, branches, parentsMeta, parentPath) {\n if (branches === void 0) {\n branches = [];\n }\n if (parentsMeta === void 0) {\n parentsMeta = [];\n }\n if (parentPath === void 0) {\n parentPath = \"\";\n }\n let flattenRoute = (route, index, relativePath) => {\n let meta = {\n relativePath: relativePath === undefined ? route.path || \"\" : relativePath,\n caseSensitive: route.caseSensitive === true,\n childrenIndex: index,\n route\n };\n if (meta.relativePath.startsWith(\"/\")) {\n invariant(meta.relativePath.startsWith(parentPath), \"Absolute route path \\\"\" + meta.relativePath + \"\\\" nested under path \" + (\"\\\"\" + parentPath + \"\\\" is not valid. An absolute child route path \") + \"must start with the combined path of all its parent routes.\");\n meta.relativePath = meta.relativePath.slice(parentPath.length);\n }\n let path = joinPaths([parentPath, meta.relativePath]);\n let routesMeta = parentsMeta.concat(meta);\n // Add the children before adding this route to the array, so we traverse the\n // route tree depth-first and child routes appear before their parents in\n // the \"flattened\" version.\n if (route.children && route.children.length > 0) {\n invariant(\n // Our types know better, but runtime JS may not!\n // @ts-expect-error\n route.index !== true, \"Index routes must not have child routes. Please remove \" + (\"all child routes from route path \\\"\" + path + \"\\\".\"));\n flattenRoutes(route.children, branches, routesMeta, path);\n }\n // Routes without a path shouldn't ever match by themselves unless they are\n // index routes, so don't add them to the list of possible branches.\n if (route.path == null && !route.index) {\n return;\n }\n branches.push({\n path,\n score: computeScore(path, route.index),\n routesMeta\n });\n };\n routes.forEach((route, index) => {\n var _route$path;\n // coarse-grain check for optional params\n if (route.path === \"\" || !((_route$path = route.path) != null && _route$path.includes(\"?\"))) {\n flattenRoute(route, index);\n } else {\n for (let exploded of explodeOptionalSegments(route.path)) {\n flattenRoute(route, index, exploded);\n }\n }\n });\n return branches;\n}\n/**\n * Computes all combinations of optional path segments for a given path,\n * excluding combinations that are ambiguous and of lower priority.\n *\n * For example, `/one/:two?/three/:four?/:five?` explodes to:\n * - `/one/three`\n * - `/one/:two/three`\n * - `/one/three/:four`\n * - `/one/three/:five`\n * - `/one/:two/three/:four`\n * - `/one/:two/three/:five`\n * - `/one/three/:four/:five`\n * - `/one/:two/three/:four/:five`\n */\nfunction explodeOptionalSegments(path) {\n let segments = path.split(\"/\");\n if (segments.length === 0) return [];\n let [first, ...rest] = segments;\n // Optional path segments are denoted by a trailing `?`\n let isOptional = first.endsWith(\"?\");\n // Compute the corresponding required segment: `foo?` -> `foo`\n let required = first.replace(/\\?$/, \"\");\n if (rest.length === 0) {\n // Intepret empty string as omitting an optional segment\n // `[\"one\", \"\", \"three\"]` corresponds to omitting `:two` from `/one/:two?/three` -> `/one/three`\n return isOptional ? [required, \"\"] : [required];\n }\n let restExploded = explodeOptionalSegments(rest.join(\"/\"));\n let result = [];\n // All child paths with the prefix. Do this for all children before the\n // optional version for all children, so we get consistent ordering where the\n // parent optional aspect is preferred as required. Otherwise, we can get\n // child sections interspersed where deeper optional segments are higher than\n // parent optional segments, where for example, /:two would explode _earlier_\n // then /:one. By always including the parent as required _for all children_\n // first, we avoid this issue\n result.push(...restExploded.map(subpath => subpath === \"\" ? required : [required, subpath].join(\"/\")));\n // Then, if this is an optional value, add all child versions without\n if (isOptional) {\n result.push(...restExploded);\n }\n // for absolute paths, ensure `/` instead of empty segment\n return result.map(exploded => path.startsWith(\"/\") && exploded === \"\" ? \"/\" : exploded);\n}\nfunction rankRouteBranches(branches) {\n branches.sort((a, b) => a.score !== b.score ? b.score - a.score // Higher score first\n : compareIndexes(a.routesMeta.map(meta => meta.childrenIndex), b.routesMeta.map(meta => meta.childrenIndex)));\n}\nconst paramRe = /^:[\\w-]+$/;\nconst dynamicSegmentValue = 3;\nconst indexRouteValue = 2;\nconst emptySegmentValue = 1;\nconst staticSegmentValue = 10;\nconst splatPenalty = -2;\nconst isSplat = s => s === \"*\";\nfunction computeScore(path, index) {\n let segments = path.split(\"/\");\n let initialScore = segments.length;\n if (segments.some(isSplat)) {\n initialScore += splatPenalty;\n }\n if (index) {\n initialScore += indexRouteValue;\n }\n return segments.filter(s => !isSplat(s)).reduce((score, segment) => score + (paramRe.test(segment) ? dynamicSegmentValue : segment === \"\" ? emptySegmentValue : staticSegmentValue), initialScore);\n}\nfunction compareIndexes(a, b) {\n let siblings = a.length === b.length && a.slice(0, -1).every((n, i) => n === b[i]);\n return siblings ?\n // If two routes are siblings, we should try to match the earlier sibling\n // first. This allows people to have fine-grained control over the matching\n // behavior by simply putting routes with identical paths in the order they\n // want them tried.\n a[a.length - 1] - b[b.length - 1] :\n // Otherwise, it doesn't really make sense to rank non-siblings by index,\n // so they sort equally.\n 0;\n}\nfunction matchRouteBranch(branch, pathname) {\n let {\n routesMeta\n } = branch;\n let matchedParams = {};\n let matchedPathname = \"/\";\n let matches = [];\n for (let i = 0; i < routesMeta.length; ++i) {\n let meta = routesMeta[i];\n let end = i === routesMeta.length - 1;\n let remainingPathname = matchedPathname === \"/\" ? pathname : pathname.slice(matchedPathname.length) || \"/\";\n let match = matchPath({\n path: meta.relativePath,\n caseSensitive: meta.caseSensitive,\n end\n }, remainingPathname);\n if (!match) return null;\n Object.assign(matchedParams, match.params);\n let route = meta.route;\n matches.push({\n // TODO: Can this as be avoided?\n params: matchedParams,\n pathname: joinPaths([matchedPathname, match.pathname]),\n pathnameBase: normalizePathname(joinPaths([matchedPathname, match.pathnameBase])),\n route\n });\n if (match.pathnameBase !== \"/\") {\n matchedPathname = joinPaths([matchedPathname, match.pathnameBase]);\n }\n }\n return matches;\n}\n/**\n * Returns a path with params interpolated.\n *\n * @see https://reactrouter.com/utils/generate-path\n */\nfunction generatePath(originalPath, params) {\n if (params === void 0) {\n params = {};\n }\n let path = originalPath;\n if (path.endsWith(\"*\") && path !== \"*\" && !path.endsWith(\"/*\")) {\n warning(false, \"Route path \\\"\" + path + \"\\\" will be treated as if it were \" + (\"\\\"\" + path.replace(/\\*$/, \"/*\") + \"\\\" because the `*` character must \") + \"always follow a `/` in the pattern. To get rid of this warning, \" + (\"please change the route path to \\\"\" + path.replace(/\\*$/, \"/*\") + \"\\\".\"));\n path = path.replace(/\\*$/, \"/*\");\n }\n // ensure `/` is added at the beginning if the path is absolute\n const prefix = path.startsWith(\"/\") ? \"/\" : \"\";\n const stringify = p => p == null ? \"\" : typeof p === \"string\" ? p : String(p);\n const segments = path.split(/\\/+/).map((segment, index, array) => {\n const isLastSegment = index === array.length - 1;\n // only apply the splat if it's the last segment\n if (isLastSegment && segment === \"*\") {\n const star = \"*\";\n // Apply the splat\n return stringify(params[star]);\n }\n const keyMatch = segment.match(/^:([\\w-]+)(\\??)$/);\n if (keyMatch) {\n const [, key, optional] = keyMatch;\n let param = params[key];\n invariant(optional === \"?\" || param != null, \"Missing \\\":\" + key + \"\\\" param\");\n return stringify(param);\n }\n // Remove any optional markers from optional static segments\n return segment.replace(/\\?$/g, \"\");\n })\n // Remove empty segments\n .filter(segment => !!segment);\n return prefix + segments.join(\"/\");\n}\n/**\n * Performs pattern matching on a URL pathname and returns information about\n * the match.\n *\n * @see https://reactrouter.com/utils/match-path\n */\nfunction matchPath(pattern, pathname) {\n if (typeof pattern === \"string\") {\n pattern = {\n path: pattern,\n caseSensitive: false,\n end: true\n };\n }\n let [matcher, compiledParams] = compilePath(pattern.path, pattern.caseSensitive, pattern.end);\n let match = pathname.match(matcher);\n if (!match) return null;\n let matchedPathname = match[0];\n let pathnameBase = matchedPathname.replace(/(.)\\/+$/, \"$1\");\n let captureGroups = match.slice(1);\n let params = compiledParams.reduce((memo, _ref, index) => {\n let {\n paramName,\n isOptional\n } = _ref;\n // We need to compute the pathnameBase here using the raw splat value\n // instead of using params[\"*\"] later because it will be decoded then\n if (paramName === \"*\") {\n let splatValue = captureGroups[index] || \"\";\n pathnameBase = matchedPathname.slice(0, matchedPathname.length - splatValue.length).replace(/(.)\\/+$/, \"$1\");\n }\n const value = captureGroups[index];\n if (isOptional && !value) {\n memo[paramName] = undefined;\n } else {\n memo[paramName] = (value || \"\").replace(/%2F/g, \"/\");\n }\n return memo;\n }, {});\n return {\n params,\n pathname: matchedPathname,\n pathnameBase,\n pattern\n };\n}\nfunction compilePath(path, caseSensitive, end) {\n if (caseSensitive === void 0) {\n caseSensitive = false;\n }\n if (end === void 0) {\n end = true;\n }\n warning(path === \"*\" || !path.endsWith(\"*\") || path.endsWith(\"/*\"), \"Route path \\\"\" + path + \"\\\" will be treated as if it were \" + (\"\\\"\" + path.replace(/\\*$/, \"/*\") + \"\\\" because the `*` character must \") + \"always follow a `/` in the pattern. To get rid of this warning, \" + (\"please change the route path to \\\"\" + path.replace(/\\*$/, \"/*\") + \"\\\".\"));\n let params = [];\n let regexpSource = \"^\" + path.replace(/\\/*\\*?$/, \"\") // Ignore trailing / and /*, we'll handle it below\n .replace(/^\\/*/, \"/\") // Make sure it has a leading /\n .replace(/[\\\\.*+^${}|()[\\]]/g, \"\\\\$&\") // Escape special regex chars\n .replace(/\\/:([\\w-]+)(\\?)?/g, (_, paramName, isOptional) => {\n params.push({\n paramName,\n isOptional: isOptional != null\n });\n return isOptional ? \"/?([^\\\\/]+)?\" : \"/([^\\\\/]+)\";\n });\n if (path.endsWith(\"*\")) {\n params.push({\n paramName: \"*\"\n });\n regexpSource += path === \"*\" || path === \"/*\" ? \"(.*)$\" // Already matched the initial /, just match the rest\n : \"(?:\\\\/(.+)|\\\\/*)$\"; // Don't include the / in params[\"*\"]\n } else if (end) {\n // When matching to the end, ignore trailing slashes\n regexpSource += \"\\\\/*$\";\n } else if (path !== \"\" && path !== \"/\") {\n // If our path is non-empty and contains anything beyond an initial slash,\n // then we have _some_ form of path in our regex, so we should expect to\n // match only if we find the end of this path segment. Look for an optional\n // non-captured trailing slash (to match a portion of the URL) or the end\n // of the path (if we've matched to the end). We used to do this with a\n // word boundary but that gives false positives on routes like\n // /user-preferences since `-` counts as a word boundary.\n regexpSource += \"(?:(?=\\\\/|$))\";\n } else ;\n let matcher = new RegExp(regexpSource, caseSensitive ? undefined : \"i\");\n return [matcher, params];\n}\nfunction decodePath(value) {\n try {\n return value.split(\"/\").map(v => decodeURIComponent(v).replace(/\\//g, \"%2F\")).join(\"/\");\n } catch (error) {\n warning(false, \"The URL path \\\"\" + value + \"\\\" could not be decoded because it is is a \" + \"malformed URL segment. This is probably due to a bad percent \" + (\"encoding (\" + error + \").\"));\n return value;\n }\n}\n/**\n * @private\n */\nfunction stripBasename(pathname, basename) {\n if (basename === \"/\") return pathname;\n if (!pathname.toLowerCase().startsWith(basename.toLowerCase())) {\n return null;\n }\n // We want to leave trailing slash behavior in the user's control, so if they\n // specify a basename with a trailing slash, we should support it\n let startIndex = basename.endsWith(\"/\") ? basename.length - 1 : basename.length;\n let nextChar = pathname.charAt(startIndex);\n if (nextChar && nextChar !== \"/\") {\n // pathname does not start with basename/\n return null;\n }\n return pathname.slice(startIndex) || \"/\";\n}\n/**\n * Returns a resolved path object relative to the given pathname.\n *\n * @see https://reactrouter.com/utils/resolve-path\n */\nfunction resolvePath(to, fromPathname) {\n if (fromPathname === void 0) {\n fromPathname = \"/\";\n }\n let {\n pathname: toPathname,\n search = \"\",\n hash = \"\"\n } = typeof to === \"string\" ? parsePath(to) : to;\n let pathname = toPathname ? toPathname.startsWith(\"/\") ? toPathname : resolvePathname(toPathname, fromPathname) : fromPathname;\n return {\n pathname,\n search: normalizeSearch(search),\n hash: normalizeHash(hash)\n };\n}\nfunction resolvePathname(relativePath, fromPathname) {\n let segments = fromPathname.replace(/\\/+$/, \"\").split(\"/\");\n let relativeSegments = relativePath.split(\"/\");\n relativeSegments.forEach(segment => {\n if (segment === \"..\") {\n // Keep the root \"\" segment so the pathname starts at /\n if (segments.length > 1) segments.pop();\n } else if (segment !== \".\") {\n segments.push(segment);\n }\n });\n return segments.length > 1 ? segments.join(\"/\") : \"/\";\n}\nfunction getInvalidPathError(char, field, dest, path) {\n return \"Cannot include a '\" + char + \"' character in a manually specified \" + (\"`to.\" + field + \"` field [\" + JSON.stringify(path) + \"]. Please separate it out to the \") + (\"`to.\" + dest + \"` field. Alternatively you may provide the full path as \") + \"a string in and the router will parse it for you.\";\n}\n/**\n * @private\n *\n * When processing relative navigation we want to ignore ancestor routes that\n * do not contribute to the path, such that index/pathless layout routes don't\n * interfere.\n *\n * For example, when moving a route element into an index route and/or a\n * pathless layout route, relative link behavior contained within should stay\n * the same. Both of the following examples should link back to the root:\n *\n * \n * \n * \n *\n * \n * \n * }> // <-- Does not contribute\n * // <-- Does not contribute\n * \n * \n */\nfunction getPathContributingMatches(matches) {\n return matches.filter((match, index) => index === 0 || match.route.path && match.route.path.length > 0);\n}\n// Return the array of pathnames for the current route matches - used to\n// generate the routePathnames input for resolveTo()\nfunction getResolveToMatches(matches, v7_relativeSplatPath) {\n let pathMatches = getPathContributingMatches(matches);\n // When v7_relativeSplatPath is enabled, use the full pathname for the leaf\n // match so we include splat values for \".\" links. See:\n // https://github.com/remix-run/react-router/issues/11052#issuecomment-1836589329\n if (v7_relativeSplatPath) {\n return pathMatches.map((match, idx) => idx === matches.length - 1 ? match.pathname : match.pathnameBase);\n }\n return pathMatches.map(match => match.pathnameBase);\n}\n/**\n * @private\n */\nfunction resolveTo(toArg, routePathnames, locationPathname, isPathRelative) {\n if (isPathRelative === void 0) {\n isPathRelative = false;\n }\n let to;\n if (typeof toArg === \"string\") {\n to = parsePath(toArg);\n } else {\n to = _extends({}, toArg);\n invariant(!to.pathname || !to.pathname.includes(\"?\"), getInvalidPathError(\"?\", \"pathname\", \"search\", to));\n invariant(!to.pathname || !to.pathname.includes(\"#\"), getInvalidPathError(\"#\", \"pathname\", \"hash\", to));\n invariant(!to.search || !to.search.includes(\"#\"), getInvalidPathError(\"#\", \"search\", \"hash\", to));\n }\n let isEmptyPath = toArg === \"\" || to.pathname === \"\";\n let toPathname = isEmptyPath ? \"/\" : to.pathname;\n let from;\n // Routing is relative to the current pathname if explicitly requested.\n //\n // If a pathname is explicitly provided in `to`, it should be relative to the\n // route context. This is explained in `Note on `` values` in our\n // migration guide from v5 as a means of disambiguation between `to` values\n // that begin with `/` and those that do not. However, this is problematic for\n // `to` values that do not provide a pathname. `to` can simply be a search or\n // hash string, in which case we should assume that the navigation is relative\n // to the current location's pathname and *not* the route pathname.\n if (toPathname == null) {\n from = locationPathname;\n } else {\n let routePathnameIndex = routePathnames.length - 1;\n // With relative=\"route\" (the default), each leading .. segment means\n // \"go up one route\" instead of \"go up one URL segment\". This is a key\n // difference from how works and a major reason we call this a\n // \"to\" value instead of a \"href\".\n if (!isPathRelative && toPathname.startsWith(\"..\")) {\n let toSegments = toPathname.split(\"/\");\n while (toSegments[0] === \"..\") {\n toSegments.shift();\n routePathnameIndex -= 1;\n }\n to.pathname = toSegments.join(\"/\");\n }\n from = routePathnameIndex >= 0 ? routePathnames[routePathnameIndex] : \"/\";\n }\n let path = resolvePath(to, from);\n // Ensure the pathname has a trailing slash if the original \"to\" had one\n let hasExplicitTrailingSlash = toPathname && toPathname !== \"/\" && toPathname.endsWith(\"/\");\n // Or if this was a link to the current path which has a trailing slash\n let hasCurrentTrailingSlash = (isEmptyPath || toPathname === \".\") && locationPathname.endsWith(\"/\");\n if (!path.pathname.endsWith(\"/\") && (hasExplicitTrailingSlash || hasCurrentTrailingSlash)) {\n path.pathname += \"/\";\n }\n return path;\n}\n/**\n * @private\n */\nfunction getToPathname(to) {\n // Empty strings should be treated the same as / paths\n return to === \"\" || to.pathname === \"\" ? \"/\" : typeof to === \"string\" ? parsePath(to).pathname : to.pathname;\n}\n/**\n * @private\n */\nconst joinPaths = paths => paths.join(\"/\").replace(/\\/\\/+/g, \"/\");\n/**\n * @private\n */\nconst normalizePathname = pathname => pathname.replace(/\\/+$/, \"\").replace(/^\\/*/, \"/\");\n/**\n * @private\n */\nconst normalizeSearch = search => !search || search === \"?\" ? \"\" : search.startsWith(\"?\") ? search : \"?\" + search;\n/**\n * @private\n */\nconst normalizeHash = hash => !hash || hash === \"#\" ? \"\" : hash.startsWith(\"#\") ? hash : \"#\" + hash;\n/**\n * This is a shortcut for creating `application/json` responses. Converts `data`\n * to JSON and sets the `Content-Type` header.\n */\nconst json = function json(data, init) {\n if (init === void 0) {\n init = {};\n }\n let responseInit = typeof init === \"number\" ? {\n status: init\n } : init;\n let headers = new Headers(responseInit.headers);\n if (!headers.has(\"Content-Type\")) {\n headers.set(\"Content-Type\", \"application/json; charset=utf-8\");\n }\n return new Response(JSON.stringify(data), _extends({}, responseInit, {\n headers\n }));\n};\nclass AbortedDeferredError extends Error {}\nclass DeferredData {\n constructor(data, responseInit) {\n this.pendingKeysSet = new Set();\n this.subscribers = new Set();\n this.deferredKeys = [];\n invariant(data && typeof data === \"object\" && !Array.isArray(data), \"defer() only accepts plain objects\");\n // Set up an AbortController + Promise we can race against to exit early\n // cancellation\n let reject;\n this.abortPromise = new Promise((_, r) => reject = r);\n this.controller = new AbortController();\n let onAbort = () => reject(new AbortedDeferredError(\"Deferred data aborted\"));\n this.unlistenAbortSignal = () => this.controller.signal.removeEventListener(\"abort\", onAbort);\n this.controller.signal.addEventListener(\"abort\", onAbort);\n this.data = Object.entries(data).reduce((acc, _ref2) => {\n let [key, value] = _ref2;\n return Object.assign(acc, {\n [key]: this.trackPromise(key, value)\n });\n }, {});\n if (this.done) {\n // All incoming values were resolved\n this.unlistenAbortSignal();\n }\n this.init = responseInit;\n }\n trackPromise(key, value) {\n if (!(value instanceof Promise)) {\n return value;\n }\n this.deferredKeys.push(key);\n this.pendingKeysSet.add(key);\n // We store a little wrapper promise that will be extended with\n // _data/_error props upon resolve/reject\n let promise = Promise.race([value, this.abortPromise]).then(data => this.onSettle(promise, key, undefined, data), error => this.onSettle(promise, key, error));\n // Register rejection listeners to avoid uncaught promise rejections on\n // errors or aborted deferred values\n promise.catch(() => {});\n Object.defineProperty(promise, \"_tracked\", {\n get: () => true\n });\n return promise;\n }\n onSettle(promise, key, error, data) {\n if (this.controller.signal.aborted && error instanceof AbortedDeferredError) {\n this.unlistenAbortSignal();\n Object.defineProperty(promise, \"_error\", {\n get: () => error\n });\n return Promise.reject(error);\n }\n this.pendingKeysSet.delete(key);\n if (this.done) {\n // Nothing left to abort!\n this.unlistenAbortSignal();\n }\n // If the promise was resolved/rejected with undefined, we'll throw an error as you\n // should always resolve with a value or null\n if (error === undefined && data === undefined) {\n let undefinedError = new Error(\"Deferred data for key \\\"\" + key + \"\\\" resolved/rejected with `undefined`, \" + \"you must resolve/reject with a value or `null`.\");\n Object.defineProperty(promise, \"_error\", {\n get: () => undefinedError\n });\n this.emit(false, key);\n return Promise.reject(undefinedError);\n }\n if (data === undefined) {\n Object.defineProperty(promise, \"_error\", {\n get: () => error\n });\n this.emit(false, key);\n return Promise.reject(error);\n }\n Object.defineProperty(promise, \"_data\", {\n get: () => data\n });\n this.emit(false, key);\n return data;\n }\n emit(aborted, settledKey) {\n this.subscribers.forEach(subscriber => subscriber(aborted, settledKey));\n }\n subscribe(fn) {\n this.subscribers.add(fn);\n return () => this.subscribers.delete(fn);\n }\n cancel() {\n this.controller.abort();\n this.pendingKeysSet.forEach((v, k) => this.pendingKeysSet.delete(k));\n this.emit(true);\n }\n async resolveData(signal) {\n let aborted = false;\n if (!this.done) {\n let onAbort = () => this.cancel();\n signal.addEventListener(\"abort\", onAbort);\n aborted = await new Promise(resolve => {\n this.subscribe(aborted => {\n signal.removeEventListener(\"abort\", onAbort);\n if (aborted || this.done) {\n resolve(aborted);\n }\n });\n });\n }\n return aborted;\n }\n get done() {\n return this.pendingKeysSet.size === 0;\n }\n get unwrappedData() {\n invariant(this.data !== null && this.done, \"Can only unwrap data on initialized and settled deferreds\");\n return Object.entries(this.data).reduce((acc, _ref3) => {\n let [key, value] = _ref3;\n return Object.assign(acc, {\n [key]: unwrapTrackedPromise(value)\n });\n }, {});\n }\n get pendingKeys() {\n return Array.from(this.pendingKeysSet);\n }\n}\nfunction isTrackedPromise(value) {\n return value instanceof Promise && value._tracked === true;\n}\nfunction unwrapTrackedPromise(value) {\n if (!isTrackedPromise(value)) {\n return value;\n }\n if (value._error) {\n throw value._error;\n }\n return value._data;\n}\nconst defer = function defer(data, init) {\n if (init === void 0) {\n init = {};\n }\n let responseInit = typeof init === \"number\" ? {\n status: init\n } : init;\n return new DeferredData(data, responseInit);\n};\n/**\n * A redirect response. Sets the status code and the `Location` header.\n * Defaults to \"302 Found\".\n */\nconst redirect = function redirect(url, init) {\n if (init === void 0) {\n init = 302;\n }\n let responseInit = init;\n if (typeof responseInit === \"number\") {\n responseInit = {\n status: responseInit\n };\n } else if (typeof responseInit.status === \"undefined\") {\n responseInit.status = 302;\n }\n let headers = new Headers(responseInit.headers);\n headers.set(\"Location\", url);\n return new Response(null, _extends({}, responseInit, {\n headers\n }));\n};\n/**\n * A redirect response that will force a document reload to the new location.\n * Sets the status code and the `Location` header.\n * Defaults to \"302 Found\".\n */\nconst redirectDocument = (url, init) => {\n let response = redirect(url, init);\n response.headers.set(\"X-Remix-Reload-Document\", \"true\");\n return response;\n};\n/**\n * @private\n * Utility class we use to hold auto-unwrapped 4xx/5xx Response bodies\n *\n * We don't export the class for public use since it's an implementation\n * detail, but we export the interface above so folks can build their own\n * abstractions around instances via isRouteErrorResponse()\n */\nclass ErrorResponseImpl {\n constructor(status, statusText, data, internal) {\n if (internal === void 0) {\n internal = false;\n }\n this.status = status;\n this.statusText = statusText || \"\";\n this.internal = internal;\n if (data instanceof Error) {\n this.data = data.toString();\n this.error = data;\n } else {\n this.data = data;\n }\n }\n}\n/**\n * Check if the given error is an ErrorResponse generated from a 4xx/5xx\n * Response thrown from an action/loader\n */\nfunction isRouteErrorResponse(error) {\n return error != null && typeof error.status === \"number\" && typeof error.statusText === \"string\" && typeof error.internal === \"boolean\" && \"data\" in error;\n}\n\nconst validMutationMethodsArr = [\"post\", \"put\", \"patch\", \"delete\"];\nconst validMutationMethods = new Set(validMutationMethodsArr);\nconst validRequestMethodsArr = [\"get\", ...validMutationMethodsArr];\nconst validRequestMethods = new Set(validRequestMethodsArr);\nconst redirectStatusCodes = new Set([301, 302, 303, 307, 308]);\nconst redirectPreserveMethodStatusCodes = new Set([307, 308]);\nconst IDLE_NAVIGATION = {\n state: \"idle\",\n location: undefined,\n formMethod: undefined,\n formAction: undefined,\n formEncType: undefined,\n formData: undefined,\n json: undefined,\n text: undefined\n};\nconst IDLE_FETCHER = {\n state: \"idle\",\n data: undefined,\n formMethod: undefined,\n formAction: undefined,\n formEncType: undefined,\n formData: undefined,\n json: undefined,\n text: undefined\n};\nconst IDLE_BLOCKER = {\n state: \"unblocked\",\n proceed: undefined,\n reset: undefined,\n location: undefined\n};\nconst ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\\/\\/)/i;\nconst defaultMapRouteProperties = route => ({\n hasErrorBoundary: Boolean(route.hasErrorBoundary)\n});\nconst TRANSITIONS_STORAGE_KEY = \"remix-router-transitions\";\n//#endregion\n////////////////////////////////////////////////////////////////////////////////\n//#region createRouter\n////////////////////////////////////////////////////////////////////////////////\n/**\n * Create a router and listen to history POP navigations\n */\nfunction createRouter(init) {\n const routerWindow = init.window ? init.window : typeof window !== \"undefined\" ? window : undefined;\n const isBrowser = typeof routerWindow !== \"undefined\" && typeof routerWindow.document !== \"undefined\" && typeof routerWindow.document.createElement !== \"undefined\";\n const isServer = !isBrowser;\n invariant(init.routes.length > 0, \"You must provide a non-empty routes array to createRouter\");\n let mapRouteProperties;\n if (init.mapRouteProperties) {\n mapRouteProperties = init.mapRouteProperties;\n } else if (init.detectErrorBoundary) {\n // If they are still using the deprecated version, wrap it with the new API\n let detectErrorBoundary = init.detectErrorBoundary;\n mapRouteProperties = route => ({\n hasErrorBoundary: detectErrorBoundary(route)\n });\n } else {\n mapRouteProperties = defaultMapRouteProperties;\n }\n // Routes keyed by ID\n let manifest = {};\n // Routes in tree format for matching\n let dataRoutes = convertRoutesToDataRoutes(init.routes, mapRouteProperties, undefined, manifest);\n let inFlightDataRoutes;\n let basename = init.basename || \"/\";\n let dataStrategyImpl = init.unstable_dataStrategy || defaultDataStrategy;\n // Config driven behavior flags\n let future = _extends({\n v7_fetcherPersist: false,\n v7_normalizeFormMethod: false,\n v7_partialHydration: false,\n v7_prependBasename: false,\n v7_relativeSplatPath: false,\n unstable_skipActionErrorRevalidation: false\n }, init.future);\n // Cleanup function for history\n let unlistenHistory = null;\n // Externally-provided functions to call on all state changes\n let subscribers = new Set();\n // Externally-provided object to hold scroll restoration locations during routing\n let savedScrollPositions = null;\n // Externally-provided function to get scroll restoration keys\n let getScrollRestorationKey = null;\n // Externally-provided function to get current scroll position\n let getScrollPosition = null;\n // One-time flag to control the initial hydration scroll restoration. Because\n // we don't get the saved positions from until _after_\n // the initial render, we need to manually trigger a separate updateState to\n // send along the restoreScrollPosition\n // Set to true if we have `hydrationData` since we assume we were SSR'd and that\n // SSR did the initial scroll restoration.\n let initialScrollRestored = init.hydrationData != null;\n let initialMatches = matchRoutes(dataRoutes, init.history.location, basename);\n let initialErrors = null;\n if (initialMatches == null) {\n // If we do not match a user-provided-route, fall back to the root\n // to allow the error boundary to take over\n let error = getInternalRouterError(404, {\n pathname: init.history.location.pathname\n });\n let {\n matches,\n route\n } = getShortCircuitMatches(dataRoutes);\n initialMatches = matches;\n initialErrors = {\n [route.id]: error\n };\n }\n let initialized;\n let hasLazyRoutes = initialMatches.some(m => m.route.lazy);\n let hasLoaders = initialMatches.some(m => m.route.loader);\n if (hasLazyRoutes) {\n // All initialMatches need to be loaded before we're ready. If we have lazy\n // functions around still then we'll need to run them in initialize()\n initialized = false;\n } else if (!hasLoaders) {\n // If we've got no loaders to run, then we're good to go\n initialized = true;\n } else if (future.v7_partialHydration) {\n // If partial hydration is enabled, we're initialized so long as we were\n // provided with hydrationData for every route with a loader, and no loaders\n // were marked for explicit hydration\n let loaderData = init.hydrationData ? init.hydrationData.loaderData : null;\n let errors = init.hydrationData ? init.hydrationData.errors : null;\n let isRouteInitialized = m => {\n // No loader, nothing to initialize\n if (!m.route.loader) {\n return true;\n }\n // Explicitly opting-in to running on hydration\n if (typeof m.route.loader === \"function\" && m.route.loader.hydrate === true) {\n return false;\n }\n // Otherwise, initialized if hydrated with data or an error\n return loaderData && loaderData[m.route.id] !== undefined || errors && errors[m.route.id] !== undefined;\n };\n // If errors exist, don't consider routes below the boundary\n if (errors) {\n let idx = initialMatches.findIndex(m => errors[m.route.id] !== undefined);\n initialized = initialMatches.slice(0, idx + 1).every(isRouteInitialized);\n } else {\n initialized = initialMatches.every(isRouteInitialized);\n }\n } else {\n // Without partial hydration - we're initialized if we were provided any\n // hydrationData - which is expected to be complete\n initialized = init.hydrationData != null;\n }\n let router;\n let state = {\n historyAction: init.history.action,\n location: init.history.location,\n matches: initialMatches,\n initialized,\n navigation: IDLE_NAVIGATION,\n // Don't restore on initial updateState() if we were SSR'd\n restoreScrollPosition: init.hydrationData != null ? false : null,\n preventScrollReset: false,\n revalidation: \"idle\",\n loaderData: init.hydrationData && init.hydrationData.loaderData || {},\n actionData: init.hydrationData && init.hydrationData.actionData || null,\n errors: init.hydrationData && init.hydrationData.errors || initialErrors,\n fetchers: new Map(),\n blockers: new Map()\n };\n // -- Stateful internal variables to manage navigations --\n // Current navigation in progress (to be committed in completeNavigation)\n let pendingAction = Action.Pop;\n // Should the current navigation prevent the scroll reset if scroll cannot\n // be restored?\n let pendingPreventScrollReset = false;\n // AbortController for the active navigation\n let pendingNavigationController;\n // Should the current navigation enable document.startViewTransition?\n let pendingViewTransitionEnabled = false;\n // Store applied view transitions so we can apply them on POP\n let appliedViewTransitions = new Map();\n // Cleanup function for persisting applied transitions to sessionStorage\n let removePageHideEventListener = null;\n // We use this to avoid touching history in completeNavigation if a\n // revalidation is entirely uninterrupted\n let isUninterruptedRevalidation = false;\n // Use this internal flag to force revalidation of all loaders:\n // - submissions (completed or interrupted)\n // - useRevalidator()\n // - X-Remix-Revalidate (from redirect)\n let isRevalidationRequired = false;\n // Use this internal array to capture routes that require revalidation due\n // to a cancelled deferred on action submission\n let cancelledDeferredRoutes = [];\n // Use this internal array to capture fetcher loads that were cancelled by an\n // action navigation and require revalidation\n let cancelledFetcherLoads = [];\n // AbortControllers for any in-flight fetchers\n let fetchControllers = new Map();\n // Track loads based on the order in which they started\n let incrementingLoadId = 0;\n // Track the outstanding pending navigation data load to be compared against\n // the globally incrementing load when a fetcher load lands after a completed\n // navigation\n let pendingNavigationLoadId = -1;\n // Fetchers that triggered data reloads as a result of their actions\n let fetchReloadIds = new Map();\n // Fetchers that triggered redirect navigations\n let fetchRedirectIds = new Set();\n // Most recent href/match for fetcher.load calls for fetchers\n let fetchLoadMatches = new Map();\n // Ref-count mounted fetchers so we know when it's ok to clean them up\n let activeFetchers = new Map();\n // Fetchers that have requested a delete when using v7_fetcherPersist,\n // they'll be officially removed after they return to idle\n let deletedFetchers = new Set();\n // Store DeferredData instances for active route matches. When a\n // route loader returns defer() we stick one in here. Then, when a nested\n // promise resolves we update loaderData. If a new navigation starts we\n // cancel active deferreds for eliminated routes.\n let activeDeferreds = new Map();\n // Store blocker functions in a separate Map outside of router state since\n // we don't need to update UI state if they change\n let blockerFunctions = new Map();\n // Flag to ignore the next history update, so we can revert the URL change on\n // a POP navigation that was blocked by the user without touching router state\n let ignoreNextHistoryUpdate = false;\n // Initialize the router, all side effects should be kicked off from here.\n // Implemented as a Fluent API for ease of:\n // let router = createRouter(init).initialize();\n function initialize() {\n // If history informs us of a POP navigation, start the navigation but do not update\n // state. We'll update our own state once the navigation completes\n unlistenHistory = init.history.listen(_ref => {\n let {\n action: historyAction,\n location,\n delta\n } = _ref;\n // Ignore this event if it was just us resetting the URL from a\n // blocked POP navigation\n if (ignoreNextHistoryUpdate) {\n ignoreNextHistoryUpdate = false;\n return;\n }\n warning(blockerFunctions.size === 0 || delta != null, \"You are trying to use a blocker on a POP navigation to a location \" + \"that was not created by @remix-run/router. This will fail silently in \" + \"production. This can happen if you are navigating outside the router \" + \"via `window.history.pushState`/`window.location.hash` instead of using \" + \"router navigation APIs. This can also happen if you are using \" + \"createHashRouter and the user manually changes the URL.\");\n let blockerKey = shouldBlockNavigation({\n currentLocation: state.location,\n nextLocation: location,\n historyAction\n });\n if (blockerKey && delta != null) {\n // Restore the URL to match the current UI, but don't update router state\n ignoreNextHistoryUpdate = true;\n init.history.go(delta * -1);\n // Put the blocker into a blocked state\n updateBlocker(blockerKey, {\n state: \"blocked\",\n location,\n proceed() {\n updateBlocker(blockerKey, {\n state: \"proceeding\",\n proceed: undefined,\n reset: undefined,\n location\n });\n // Re-do the same POP navigation we just blocked\n init.history.go(delta);\n },\n reset() {\n let blockers = new Map(state.blockers);\n blockers.set(blockerKey, IDLE_BLOCKER);\n updateState({\n blockers\n });\n }\n });\n return;\n }\n return startNavigation(historyAction, location);\n });\n if (isBrowser) {\n // FIXME: This feels gross. How can we cleanup the lines between\n // scrollRestoration/appliedTransitions persistance?\n restoreAppliedTransitions(routerWindow, appliedViewTransitions);\n let _saveAppliedTransitions = () => persistAppliedTransitions(routerWindow, appliedViewTransitions);\n routerWindow.addEventListener(\"pagehide\", _saveAppliedTransitions);\n removePageHideEventListener = () => routerWindow.removeEventListener(\"pagehide\", _saveAppliedTransitions);\n }\n // Kick off initial data load if needed. Use Pop to avoid modifying history\n // Note we don't do any handling of lazy here. For SPA's it'll get handled\n // in the normal navigation flow. For SSR it's expected that lazy modules are\n // resolved prior to router creation since we can't go into a fallbackElement\n // UI for SSR'd apps\n if (!state.initialized) {\n startNavigation(Action.Pop, state.location, {\n initialHydration: true\n });\n }\n return router;\n }\n // Clean up a router and it's side effects\n function dispose() {\n if (unlistenHistory) {\n unlistenHistory();\n }\n if (removePageHideEventListener) {\n removePageHideEventListener();\n }\n subscribers.clear();\n pendingNavigationController && pendingNavigationController.abort();\n state.fetchers.forEach((_, key) => deleteFetcher(key));\n state.blockers.forEach((_, key) => deleteBlocker(key));\n }\n // Subscribe to state updates for the router\n function subscribe(fn) {\n subscribers.add(fn);\n return () => subscribers.delete(fn);\n }\n // Update our state and notify the calling context of the change\n function updateState(newState, opts) {\n if (opts === void 0) {\n opts = {};\n }\n state = _extends({}, state, newState);\n // Prep fetcher cleanup so we can tell the UI which fetcher data entries\n // can be removed\n let completedFetchers = [];\n let deletedFetchersKeys = [];\n if (future.v7_fetcherPersist) {\n state.fetchers.forEach((fetcher, key) => {\n if (fetcher.state === \"idle\") {\n if (deletedFetchers.has(key)) {\n // Unmounted from the UI and can be totally removed\n deletedFetchersKeys.push(key);\n } else {\n // Returned to idle but still mounted in the UI, so semi-remains for\n // revalidations and such\n completedFetchers.push(key);\n }\n }\n });\n }\n // Iterate over a local copy so that if flushSync is used and we end up\n // removing and adding a new subscriber due to the useCallback dependencies,\n // we don't get ourselves into a loop calling the new subscriber immediately\n [...subscribers].forEach(subscriber => subscriber(state, {\n deletedFetchers: deletedFetchersKeys,\n unstable_viewTransitionOpts: opts.viewTransitionOpts,\n unstable_flushSync: opts.flushSync === true\n }));\n // Remove idle fetchers from state since we only care about in-flight fetchers.\n if (future.v7_fetcherPersist) {\n completedFetchers.forEach(key => state.fetchers.delete(key));\n deletedFetchersKeys.forEach(key => deleteFetcher(key));\n }\n }\n // Complete a navigation returning the state.navigation back to the IDLE_NAVIGATION\n // and setting state.[historyAction/location/matches] to the new route.\n // - Location is a required param\n // - Navigation will always be set to IDLE_NAVIGATION\n // - Can pass any other state in newState\n function completeNavigation(location, newState, _temp) {\n var _location$state, _location$state2;\n let {\n flushSync\n } = _temp === void 0 ? {} : _temp;\n // Deduce if we're in a loading/actionReload state:\n // - We have committed actionData in the store\n // - The current navigation was a mutation submission\n // - We're past the submitting state and into the loading state\n // - The location being loaded is not the result of a redirect\n let isActionReload = state.actionData != null && state.navigation.formMethod != null && isMutationMethod(state.navigation.formMethod) && state.navigation.state === \"loading\" && ((_location$state = location.state) == null ? void 0 : _location$state._isRedirect) !== true;\n let actionData;\n if (newState.actionData) {\n if (Object.keys(newState.actionData).length > 0) {\n actionData = newState.actionData;\n } else {\n // Empty actionData -> clear prior actionData due to an action error\n actionData = null;\n }\n } else if (isActionReload) {\n // Keep the current data if we're wrapping up the action reload\n actionData = state.actionData;\n } else {\n // Clear actionData on any other completed navigations\n actionData = null;\n }\n // Always preserve any existing loaderData from re-used routes\n let loaderData = newState.loaderData ? mergeLoaderData(state.loaderData, newState.loaderData, newState.matches || [], newState.errors) : state.loaderData;\n // On a successful navigation we can assume we got through all blockers\n // so we can start fresh\n let blockers = state.blockers;\n if (blockers.size > 0) {\n blockers = new Map(blockers);\n blockers.forEach((_, k) => blockers.set(k, IDLE_BLOCKER));\n }\n // Always respect the user flag. Otherwise don't reset on mutation\n // submission navigations unless they redirect\n let preventScrollReset = pendingPreventScrollReset === true || state.navigation.formMethod != null && isMutationMethod(state.navigation.formMethod) && ((_location$state2 = location.state) == null ? void 0 : _location$state2._isRedirect) !== true;\n if (inFlightDataRoutes) {\n dataRoutes = inFlightDataRoutes;\n inFlightDataRoutes = undefined;\n }\n if (isUninterruptedRevalidation) ; else if (pendingAction === Action.Pop) ; else if (pendingAction === Action.Push) {\n init.history.push(location, location.state);\n } else if (pendingAction === Action.Replace) {\n init.history.replace(location, location.state);\n }\n let viewTransitionOpts;\n // On POP, enable transitions if they were enabled on the original navigation\n if (pendingAction === Action.Pop) {\n // Forward takes precedence so they behave like the original navigation\n let priorPaths = appliedViewTransitions.get(state.location.pathname);\n if (priorPaths && priorPaths.has(location.pathname)) {\n viewTransitionOpts = {\n currentLocation: state.location,\n nextLocation: location\n };\n } else if (appliedViewTransitions.has(location.pathname)) {\n // If we don't have a previous forward nav, assume we're popping back to\n // the new location and enable if that location previously enabled\n viewTransitionOpts = {\n currentLocation: location,\n nextLocation: state.location\n };\n }\n } else if (pendingViewTransitionEnabled) {\n // Store the applied transition on PUSH/REPLACE\n let toPaths = appliedViewTransitions.get(state.location.pathname);\n if (toPaths) {\n toPaths.add(location.pathname);\n } else {\n toPaths = new Set([location.pathname]);\n appliedViewTransitions.set(state.location.pathname, toPaths);\n }\n viewTransitionOpts = {\n currentLocation: state.location,\n nextLocation: location\n };\n }\n updateState(_extends({}, newState, {\n actionData,\n loaderData,\n historyAction: pendingAction,\n location,\n initialized: true,\n navigation: IDLE_NAVIGATION,\n revalidation: \"idle\",\n restoreScrollPosition: getSavedScrollPosition(location, newState.matches || state.matches),\n preventScrollReset,\n blockers\n }), {\n viewTransitionOpts,\n flushSync: flushSync === true\n });\n // Reset stateful navigation vars\n pendingAction = Action.Pop;\n pendingPreventScrollReset = false;\n pendingViewTransitionEnabled = false;\n isUninterruptedRevalidation = false;\n isRevalidationRequired = false;\n cancelledDeferredRoutes = [];\n cancelledFetcherLoads = [];\n }\n // Trigger a navigation event, which can either be a numerical POP or a PUSH\n // replace with an optional submission\n async function navigate(to, opts) {\n if (typeof to === \"number\") {\n init.history.go(to);\n return;\n }\n let normalizedPath = normalizeTo(state.location, state.matches, basename, future.v7_prependBasename, to, future.v7_relativeSplatPath, opts == null ? void 0 : opts.fromRouteId, opts == null ? void 0 : opts.relative);\n let {\n path,\n submission,\n error\n } = normalizeNavigateOptions(future.v7_normalizeFormMethod, false, normalizedPath, opts);\n let currentLocation = state.location;\n let nextLocation = createLocation(state.location, path, opts && opts.state);\n // When using navigate as a PUSH/REPLACE we aren't reading an already-encoded\n // URL from window.location, so we need to encode it here so the behavior\n // remains the same as POP and non-data-router usages. new URL() does all\n // the same encoding we'd get from a history.pushState/window.location read\n // without having to touch history\n nextLocation = _extends({}, nextLocation, init.history.encodeLocation(nextLocation));\n let userReplace = opts && opts.replace != null ? opts.replace : undefined;\n let historyAction = Action.Push;\n if (userReplace === true) {\n historyAction = Action.Replace;\n } else if (userReplace === false) ; else if (submission != null && isMutationMethod(submission.formMethod) && submission.formAction === state.location.pathname + state.location.search) {\n // By default on submissions to the current location we REPLACE so that\n // users don't have to double-click the back button to get to the prior\n // location. If the user redirects to a different location from the\n // action/loader this will be ignored and the redirect will be a PUSH\n historyAction = Action.Replace;\n }\n let preventScrollReset = opts && \"preventScrollReset\" in opts ? opts.preventScrollReset === true : undefined;\n let flushSync = (opts && opts.unstable_flushSync) === true;\n let blockerKey = shouldBlockNavigation({\n currentLocation,\n nextLocation,\n historyAction\n });\n if (blockerKey) {\n // Put the blocker into a blocked state\n updateBlocker(blockerKey, {\n state: \"blocked\",\n location: nextLocation,\n proceed() {\n updateBlocker(blockerKey, {\n state: \"proceeding\",\n proceed: undefined,\n reset: undefined,\n location: nextLocation\n });\n // Send the same navigation through\n navigate(to, opts);\n },\n reset() {\n let blockers = new Map(state.blockers);\n blockers.set(blockerKey, IDLE_BLOCKER);\n updateState({\n blockers\n });\n }\n });\n return;\n }\n return await startNavigation(historyAction, nextLocation, {\n submission,\n // Send through the formData serialization error if we have one so we can\n // render at the right error boundary after we match routes\n pendingError: error,\n preventScrollReset,\n replace: opts && opts.replace,\n enableViewTransition: opts && opts.unstable_viewTransition,\n flushSync\n });\n }\n // Revalidate all current loaders. If a navigation is in progress or if this\n // is interrupted by a navigation, allow this to \"succeed\" by calling all\n // loaders during the next loader round\n function revalidate() {\n interruptActiveLoads();\n updateState({\n revalidation: \"loading\"\n });\n // If we're currently submitting an action, we don't need to start a new\n // navigation, we'll just let the follow up loader execution call all loaders\n if (state.navigation.state === \"submitting\") {\n return;\n }\n // If we're currently in an idle state, start a new navigation for the current\n // action/location and mark it as uninterrupted, which will skip the history\n // update in completeNavigation\n if (state.navigation.state === \"idle\") {\n startNavigation(state.historyAction, state.location, {\n startUninterruptedRevalidation: true\n });\n return;\n }\n // Otherwise, if we're currently in a loading state, just start a new\n // navigation to the navigation.location but do not trigger an uninterrupted\n // revalidation so that history correctly updates once the navigation completes\n startNavigation(pendingAction || state.historyAction, state.navigation.location, {\n overrideNavigation: state.navigation\n });\n }\n // Start a navigation to the given action/location. Can optionally provide a\n // overrideNavigation which will override the normalLoad in the case of a redirect\n // navigation\n async function startNavigation(historyAction, location, opts) {\n // Abort any in-progress navigations and start a new one. Unset any ongoing\n // uninterrupted revalidations unless told otherwise, since we want this\n // new navigation to update history normally\n pendingNavigationController && pendingNavigationController.abort();\n pendingNavigationController = null;\n pendingAction = historyAction;\n isUninterruptedRevalidation = (opts && opts.startUninterruptedRevalidation) === true;\n // Save the current scroll position every time we start a new navigation,\n // and track whether we should reset scroll on completion\n saveScrollPosition(state.location, state.matches);\n pendingPreventScrollReset = (opts && opts.preventScrollReset) === true;\n pendingViewTransitionEnabled = (opts && opts.enableViewTransition) === true;\n let routesToUse = inFlightDataRoutes || dataRoutes;\n let loadingNavigation = opts && opts.overrideNavigation;\n let matches = matchRoutes(routesToUse, location, basename);\n let flushSync = (opts && opts.flushSync) === true;\n // Short circuit with a 404 on the root error boundary if we match nothing\n if (!matches) {\n let error = getInternalRouterError(404, {\n pathname: location.pathname\n });\n let {\n matches: notFoundMatches,\n route\n } = getShortCircuitMatches(routesToUse);\n // Cancel all pending deferred on 404s since we don't keep any routes\n cancelActiveDeferreds();\n completeNavigation(location, {\n matches: notFoundMatches,\n loaderData: {},\n errors: {\n [route.id]: error\n }\n }, {\n flushSync\n });\n return;\n }\n // Short circuit if it's only a hash change and not a revalidation or\n // mutation submission.\n //\n // Ignore on initial page loads because since the initial load will always\n // be \"same hash\". For example, on /page#hash and submit a
\n // which will default to a navigation to /page\n if (state.initialized && !isRevalidationRequired && isHashChangeOnly(state.location, location) && !(opts && opts.submission && isMutationMethod(opts.submission.formMethod))) {\n completeNavigation(location, {\n matches\n }, {\n flushSync\n });\n return;\n }\n // Create a controller/Request for this navigation\n pendingNavigationController = new AbortController();\n let request = createClientSideRequest(init.history, location, pendingNavigationController.signal, opts && opts.submission);\n let pendingActionResult;\n if (opts && opts.pendingError) {\n // If we have a pendingError, it means the user attempted a GET submission\n // with binary FormData so assign here and skip to handleLoaders. That\n // way we handle calling loaders above the boundary etc. It's not really\n // different from an actionError in that sense.\n pendingActionResult = [findNearestBoundary(matches).route.id, {\n type: ResultType.error,\n error: opts.pendingError\n }];\n } else if (opts && opts.submission && isMutationMethod(opts.submission.formMethod)) {\n // Call action if we received an action submission\n let actionResult = await handleAction(request, location, opts.submission, matches, {\n replace: opts.replace,\n flushSync\n });\n if (actionResult.shortCircuited) {\n return;\n }\n pendingActionResult = actionResult.pendingActionResult;\n loadingNavigation = getLoadingNavigation(location, opts.submission);\n flushSync = false;\n // Create a GET request for the loaders\n request = createClientSideRequest(init.history, request.url, request.signal);\n }\n // Call loaders\n let {\n shortCircuited,\n loaderData,\n errors\n } = await handleLoaders(request, location, matches, loadingNavigation, opts && opts.submission, opts && opts.fetcherSubmission, opts && opts.replace, opts && opts.initialHydration === true, flushSync, pendingActionResult);\n if (shortCircuited) {\n return;\n }\n // Clean up now that the action/loaders have completed. Don't clean up if\n // we short circuited because pendingNavigationController will have already\n // been assigned to a new controller for the next navigation\n pendingNavigationController = null;\n completeNavigation(location, _extends({\n matches\n }, getActionDataForCommit(pendingActionResult), {\n loaderData,\n errors\n }));\n }\n // Call the action matched by the leaf route for this navigation and handle\n // redirects/errors\n async function handleAction(request, location, submission, matches, opts) {\n if (opts === void 0) {\n opts = {};\n }\n interruptActiveLoads();\n // Put us in a submitting state\n let navigation = getSubmittingNavigation(location, submission);\n updateState({\n navigation\n }, {\n flushSync: opts.flushSync === true\n });\n // Call our action and get the result\n let result;\n let actionMatch = getTargetMatch(matches, location);\n if (!actionMatch.route.action && !actionMatch.route.lazy) {\n result = {\n type: ResultType.error,\n error: getInternalRouterError(405, {\n method: request.method,\n pathname: location.pathname,\n routeId: actionMatch.route.id\n })\n };\n } else {\n let results = await callDataStrategy(\"action\", request, [actionMatch], matches);\n result = results[0];\n if (request.signal.aborted) {\n return {\n shortCircuited: true\n };\n }\n }\n if (isRedirectResult(result)) {\n let replace;\n if (opts && opts.replace != null) {\n replace = opts.replace;\n } else {\n // If the user didn't explicity indicate replace behavior, replace if\n // we redirected to the exact same location we're currently at to avoid\n // double back-buttons\n let location = normalizeRedirectLocation(result.response.headers.get(\"Location\"), new URL(request.url), basename);\n replace = location === state.location.pathname + state.location.search;\n }\n await startRedirectNavigation(request, result, {\n submission,\n replace\n });\n return {\n shortCircuited: true\n };\n }\n if (isDeferredResult(result)) {\n throw getInternalRouterError(400, {\n type: \"defer-action\"\n });\n }\n if (isErrorResult(result)) {\n // Store off the pending error - we use it to determine which loaders\n // to call and will commit it when we complete the navigation\n let boundaryMatch = findNearestBoundary(matches, actionMatch.route.id);\n // By default, all submissions are REPLACE navigations, but if the\n // action threw an error that'll be rendered in an errorElement, we fall\n // back to PUSH so that the user can use the back button to get back to\n // the pre-submission form location to try again\n if ((opts && opts.replace) !== true) {\n pendingAction = Action.Push;\n }\n return {\n pendingActionResult: [boundaryMatch.route.id, result]\n };\n }\n return {\n pendingActionResult: [actionMatch.route.id, result]\n };\n }\n // Call all applicable loaders for the given matches, handling redirects,\n // errors, etc.\n async function handleLoaders(request, location, matches, overrideNavigation, submission, fetcherSubmission, replace, initialHydration, flushSync, pendingActionResult) {\n // Figure out the right navigation we want to use for data loading\n let loadingNavigation = overrideNavigation || getLoadingNavigation(location, submission);\n // If this was a redirect from an action we don't have a \"submission\" but\n // we have it on the loading navigation so use that if available\n let activeSubmission = submission || fetcherSubmission || getSubmissionFromNavigation(loadingNavigation);\n let routesToUse = inFlightDataRoutes || dataRoutes;\n let [matchesToLoad, revalidatingFetchers] = getMatchesToLoad(init.history, state, matches, activeSubmission, location, future.v7_partialHydration && initialHydration === true, future.unstable_skipActionErrorRevalidation, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, pendingActionResult);\n // Cancel pending deferreds for no-longer-matched routes or routes we're\n // about to reload. Note that if this is an action reload we would have\n // already cancelled all pending deferreds so this would be a no-op\n cancelActiveDeferreds(routeId => !(matches && matches.some(m => m.route.id === routeId)) || matchesToLoad && matchesToLoad.some(m => m.route.id === routeId));\n pendingNavigationLoadId = ++incrementingLoadId;\n // Short circuit if we have no loaders to run\n if (matchesToLoad.length === 0 && revalidatingFetchers.length === 0) {\n let updatedFetchers = markFetchRedirectsDone();\n completeNavigation(location, _extends({\n matches,\n loaderData: {},\n // Commit pending error if we're short circuiting\n errors: pendingActionResult && isErrorResult(pendingActionResult[1]) ? {\n [pendingActionResult[0]]: pendingActionResult[1].error\n } : null\n }, getActionDataForCommit(pendingActionResult), updatedFetchers ? {\n fetchers: new Map(state.fetchers)\n } : {}), {\n flushSync\n });\n return {\n shortCircuited: true\n };\n }\n // If this is an uninterrupted revalidation, we remain in our current idle\n // state. If not, we need to switch to our loading state and load data,\n // preserving any new action data or existing action data (in the case of\n // a revalidation interrupting an actionReload)\n // If we have partialHydration enabled, then don't update the state for the\n // initial data load since it's not a \"navigation\"\n if (!isUninterruptedRevalidation && (!future.v7_partialHydration || !initialHydration)) {\n revalidatingFetchers.forEach(rf => {\n let fetcher = state.fetchers.get(rf.key);\n let revalidatingFetcher = getLoadingFetcher(undefined, fetcher ? fetcher.data : undefined);\n state.fetchers.set(rf.key, revalidatingFetcher);\n });\n let actionData;\n if (pendingActionResult && !isErrorResult(pendingActionResult[1])) {\n // This is cast to `any` currently because `RouteData`uses any and it\n // would be a breaking change to use any.\n // TODO: v7 - change `RouteData` to use `unknown` instead of `any`\n actionData = {\n [pendingActionResult[0]]: pendingActionResult[1].data\n };\n } else if (state.actionData) {\n if (Object.keys(state.actionData).length === 0) {\n actionData = null;\n } else {\n actionData = state.actionData;\n }\n }\n updateState(_extends({\n navigation: loadingNavigation\n }, actionData !== undefined ? {\n actionData\n } : {}, revalidatingFetchers.length > 0 ? {\n fetchers: new Map(state.fetchers)\n } : {}), {\n flushSync\n });\n }\n revalidatingFetchers.forEach(rf => {\n if (fetchControllers.has(rf.key)) {\n abortFetcher(rf.key);\n }\n if (rf.controller) {\n // Fetchers use an independent AbortController so that aborting a fetcher\n // (via deleteFetcher) does not abort the triggering navigation that\n // triggered the revalidation\n fetchControllers.set(rf.key, rf.controller);\n }\n });\n // Proxy navigation abort through to revalidation fetchers\n let abortPendingFetchRevalidations = () => revalidatingFetchers.forEach(f => abortFetcher(f.key));\n if (pendingNavigationController) {\n pendingNavigationController.signal.addEventListener(\"abort\", abortPendingFetchRevalidations);\n }\n let {\n loaderResults,\n fetcherResults\n } = await callLoadersAndMaybeResolveData(state.matches, matches, matchesToLoad, revalidatingFetchers, request);\n if (request.signal.aborted) {\n return {\n shortCircuited: true\n };\n }\n // Clean up _after_ loaders have completed. Don't clean up if we short\n // circuited because fetchControllers would have been aborted and\n // reassigned to new controllers for the next navigation\n if (pendingNavigationController) {\n pendingNavigationController.signal.removeEventListener(\"abort\", abortPendingFetchRevalidations);\n }\n revalidatingFetchers.forEach(rf => fetchControllers.delete(rf.key));\n // If any loaders returned a redirect Response, start a new REPLACE navigation\n let redirect = findRedirect([...loaderResults, ...fetcherResults]);\n if (redirect) {\n if (redirect.idx >= matchesToLoad.length) {\n // If this redirect came from a fetcher make sure we mark it in\n // fetchRedirectIds so it doesn't get revalidated on the next set of\n // loader executions\n let fetcherKey = revalidatingFetchers[redirect.idx - matchesToLoad.length].key;\n fetchRedirectIds.add(fetcherKey);\n }\n await startRedirectNavigation(request, redirect.result, {\n replace\n });\n return {\n shortCircuited: true\n };\n }\n // Process and commit output from loaders\n let {\n loaderData,\n errors\n } = processLoaderData(state, matches, matchesToLoad, loaderResults, pendingActionResult, revalidatingFetchers, fetcherResults, activeDeferreds);\n // Wire up subscribers to update loaderData as promises settle\n activeDeferreds.forEach((deferredData, routeId) => {\n deferredData.subscribe(aborted => {\n // Note: No need to updateState here since the TrackedPromise on\n // loaderData is stable across resolve/reject\n // Remove this instance if we were aborted or if promises have settled\n if (aborted || deferredData.done) {\n activeDeferreds.delete(routeId);\n }\n });\n });\n // During partial hydration, preserve SSR errors for routes that don't re-run\n if (future.v7_partialHydration && initialHydration && state.errors) {\n Object.entries(state.errors).filter(_ref2 => {\n let [id] = _ref2;\n return !matchesToLoad.some(m => m.route.id === id);\n }).forEach(_ref3 => {\n let [routeId, error] = _ref3;\n errors = Object.assign(errors || {}, {\n [routeId]: error\n });\n });\n }\n let updatedFetchers = markFetchRedirectsDone();\n let didAbortFetchLoads = abortStaleFetchLoads(pendingNavigationLoadId);\n let shouldUpdateFetchers = updatedFetchers || didAbortFetchLoads || revalidatingFetchers.length > 0;\n return _extends({\n loaderData,\n errors\n }, shouldUpdateFetchers ? {\n fetchers: new Map(state.fetchers)\n } : {});\n }\n // Trigger a fetcher load/submit for the given fetcher key\n function fetch(key, routeId, href, opts) {\n if (isServer) {\n throw new Error(\"router.fetch() was called during the server render, but it shouldn't be. \" + \"You are likely calling a useFetcher() method in the body of your component. \" + \"Try moving it to a useEffect or a callback.\");\n }\n if (fetchControllers.has(key)) abortFetcher(key);\n let flushSync = (opts && opts.unstable_flushSync) === true;\n let routesToUse = inFlightDataRoutes || dataRoutes;\n let normalizedPath = normalizeTo(state.location, state.matches, basename, future.v7_prependBasename, href, future.v7_relativeSplatPath, routeId, opts == null ? void 0 : opts.relative);\n let matches = matchRoutes(routesToUse, normalizedPath, basename);\n if (!matches) {\n setFetcherError(key, routeId, getInternalRouterError(404, {\n pathname: normalizedPath\n }), {\n flushSync\n });\n return;\n }\n let {\n path,\n submission,\n error\n } = normalizeNavigateOptions(future.v7_normalizeFormMethod, true, normalizedPath, opts);\n if (error) {\n setFetcherError(key, routeId, error, {\n flushSync\n });\n return;\n }\n let match = getTargetMatch(matches, path);\n pendingPreventScrollReset = (opts && opts.preventScrollReset) === true;\n if (submission && isMutationMethod(submission.formMethod)) {\n handleFetcherAction(key, routeId, path, match, matches, flushSync, submission);\n return;\n }\n // Store off the match so we can call it's shouldRevalidate on subsequent\n // revalidations\n fetchLoadMatches.set(key, {\n routeId,\n path\n });\n handleFetcherLoader(key, routeId, path, match, matches, flushSync, submission);\n }\n // Call the action for the matched fetcher.submit(), and then handle redirects,\n // errors, and revalidation\n async function handleFetcherAction(key, routeId, path, match, requestMatches, flushSync, submission) {\n interruptActiveLoads();\n fetchLoadMatches.delete(key);\n if (!match.route.action && !match.route.lazy) {\n let error = getInternalRouterError(405, {\n method: submission.formMethod,\n pathname: path,\n routeId: routeId\n });\n setFetcherError(key, routeId, error, {\n flushSync\n });\n return;\n }\n // Put this fetcher into it's submitting state\n let existingFetcher = state.fetchers.get(key);\n updateFetcherState(key, getSubmittingFetcher(submission, existingFetcher), {\n flushSync\n });\n // Call the action for the fetcher\n let abortController = new AbortController();\n let fetchRequest = createClientSideRequest(init.history, path, abortController.signal, submission);\n fetchControllers.set(key, abortController);\n let originatingLoadId = incrementingLoadId;\n let actionResults = await callDataStrategy(\"action\", fetchRequest, [match], requestMatches);\n let actionResult = actionResults[0];\n if (fetchRequest.signal.aborted) {\n // We can delete this so long as we weren't aborted by our own fetcher\n // re-submit which would have put _new_ controller is in fetchControllers\n if (fetchControllers.get(key) === abortController) {\n fetchControllers.delete(key);\n }\n return;\n }\n // When using v7_fetcherPersist, we don't want errors bubbling up to the UI\n // or redirects processed for unmounted fetchers so we just revert them to\n // idle\n if (future.v7_fetcherPersist && deletedFetchers.has(key)) {\n if (isRedirectResult(actionResult) || isErrorResult(actionResult)) {\n updateFetcherState(key, getDoneFetcher(undefined));\n return;\n }\n // Let SuccessResult's fall through for revalidation\n } else {\n if (isRedirectResult(actionResult)) {\n fetchControllers.delete(key);\n if (pendingNavigationLoadId > originatingLoadId) {\n // A new navigation was kicked off after our action started, so that\n // should take precedence over this redirect navigation. We already\n // set isRevalidationRequired so all loaders for the new route should\n // fire unless opted out via shouldRevalidate\n updateFetcherState(key, getDoneFetcher(undefined));\n return;\n } else {\n fetchRedirectIds.add(key);\n updateFetcherState(key, getLoadingFetcher(submission));\n return startRedirectNavigation(fetchRequest, actionResult, {\n fetcherSubmission: submission\n });\n }\n }\n // Process any non-redirect errors thrown\n if (isErrorResult(actionResult)) {\n setFetcherError(key, routeId, actionResult.error);\n return;\n }\n }\n if (isDeferredResult(actionResult)) {\n throw getInternalRouterError(400, {\n type: \"defer-action\"\n });\n }\n // Start the data load for current matches, or the next location if we're\n // in the middle of a navigation\n let nextLocation = state.navigation.location || state.location;\n let revalidationRequest = createClientSideRequest(init.history, nextLocation, abortController.signal);\n let routesToUse = inFlightDataRoutes || dataRoutes;\n let matches = state.navigation.state !== \"idle\" ? matchRoutes(routesToUse, state.navigation.location, basename) : state.matches;\n invariant(matches, \"Didn't find any matches after fetcher action\");\n let loadId = ++incrementingLoadId;\n fetchReloadIds.set(key, loadId);\n let loadFetcher = getLoadingFetcher(submission, actionResult.data);\n state.fetchers.set(key, loadFetcher);\n let [matchesToLoad, revalidatingFetchers] = getMatchesToLoad(init.history, state, matches, submission, nextLocation, false, future.unstable_skipActionErrorRevalidation, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, [match.route.id, actionResult]);\n // Put all revalidating fetchers into the loading state, except for the\n // current fetcher which we want to keep in it's current loading state which\n // contains it's action submission info + action data\n revalidatingFetchers.filter(rf => rf.key !== key).forEach(rf => {\n let staleKey = rf.key;\n let existingFetcher = state.fetchers.get(staleKey);\n let revalidatingFetcher = getLoadingFetcher(undefined, existingFetcher ? existingFetcher.data : undefined);\n state.fetchers.set(staleKey, revalidatingFetcher);\n if (fetchControllers.has(staleKey)) {\n abortFetcher(staleKey);\n }\n if (rf.controller) {\n fetchControllers.set(staleKey, rf.controller);\n }\n });\n updateState({\n fetchers: new Map(state.fetchers)\n });\n let abortPendingFetchRevalidations = () => revalidatingFetchers.forEach(rf => abortFetcher(rf.key));\n abortController.signal.addEventListener(\"abort\", abortPendingFetchRevalidations);\n let {\n loaderResults,\n fetcherResults\n } = await callLoadersAndMaybeResolveData(state.matches, matches, matchesToLoad, revalidatingFetchers, revalidationRequest);\n if (abortController.signal.aborted) {\n return;\n }\n abortController.signal.removeEventListener(\"abort\", abortPendingFetchRevalidations);\n fetchReloadIds.delete(key);\n fetchControllers.delete(key);\n revalidatingFetchers.forEach(r => fetchControllers.delete(r.key));\n let redirect = findRedirect([...loaderResults, ...fetcherResults]);\n if (redirect) {\n if (redirect.idx >= matchesToLoad.length) {\n // If this redirect came from a fetcher make sure we mark it in\n // fetchRedirectIds so it doesn't get revalidated on the next set of\n // loader executions\n let fetcherKey = revalidatingFetchers[redirect.idx - matchesToLoad.length].key;\n fetchRedirectIds.add(fetcherKey);\n }\n return startRedirectNavigation(revalidationRequest, redirect.result);\n }\n // Process and commit output from loaders\n let {\n loaderData,\n errors\n } = processLoaderData(state, state.matches, matchesToLoad, loaderResults, undefined, revalidatingFetchers, fetcherResults, activeDeferreds);\n // Since we let revalidations complete even if the submitting fetcher was\n // deleted, only put it back to idle if it hasn't been deleted\n if (state.fetchers.has(key)) {\n let doneFetcher = getDoneFetcher(actionResult.data);\n state.fetchers.set(key, doneFetcher);\n }\n abortStaleFetchLoads(loadId);\n // If we are currently in a navigation loading state and this fetcher is\n // more recent than the navigation, we want the newer data so abort the\n // navigation and complete it with the fetcher data\n if (state.navigation.state === \"loading\" && loadId > pendingNavigationLoadId) {\n invariant(pendingAction, \"Expected pending action\");\n pendingNavigationController && pendingNavigationController.abort();\n completeNavigation(state.navigation.location, {\n matches,\n loaderData,\n errors,\n fetchers: new Map(state.fetchers)\n });\n } else {\n // otherwise just update with the fetcher data, preserving any existing\n // loaderData for loaders that did not need to reload. We have to\n // manually merge here since we aren't going through completeNavigation\n updateState({\n errors,\n loaderData: mergeLoaderData(state.loaderData, loaderData, matches, errors),\n fetchers: new Map(state.fetchers)\n });\n isRevalidationRequired = false;\n }\n }\n // Call the matched loader for fetcher.load(), handling redirects, errors, etc.\n async function handleFetcherLoader(key, routeId, path, match, matches, flushSync, submission) {\n let existingFetcher = state.fetchers.get(key);\n updateFetcherState(key, getLoadingFetcher(submission, existingFetcher ? existingFetcher.data : undefined), {\n flushSync\n });\n // Call the loader for this fetcher route match\n let abortController = new AbortController();\n let fetchRequest = createClientSideRequest(init.history, path, abortController.signal);\n fetchControllers.set(key, abortController);\n let originatingLoadId = incrementingLoadId;\n let results = await callDataStrategy(\"loader\", fetchRequest, [match], matches);\n let result = results[0];\n // Deferred isn't supported for fetcher loads, await everything and treat it\n // as a normal load. resolveDeferredData will return undefined if this\n // fetcher gets aborted, so we just leave result untouched and short circuit\n // below if that happens\n if (isDeferredResult(result)) {\n result = (await resolveDeferredData(result, fetchRequest.signal, true)) || result;\n }\n // We can delete this so long as we weren't aborted by our our own fetcher\n // re-load which would have put _new_ controller is in fetchControllers\n if (fetchControllers.get(key) === abortController) {\n fetchControllers.delete(key);\n }\n if (fetchRequest.signal.aborted) {\n return;\n }\n // We don't want errors bubbling up or redirects followed for unmounted\n // fetchers, so short circuit here if it was removed from the UI\n if (deletedFetchers.has(key)) {\n updateFetcherState(key, getDoneFetcher(undefined));\n return;\n }\n // If the loader threw a redirect Response, start a new REPLACE navigation\n if (isRedirectResult(result)) {\n if (pendingNavigationLoadId > originatingLoadId) {\n // A new navigation was kicked off after our loader started, so that\n // should take precedence over this redirect navigation\n updateFetcherState(key, getDoneFetcher(undefined));\n return;\n } else {\n fetchRedirectIds.add(key);\n await startRedirectNavigation(fetchRequest, result);\n return;\n }\n }\n // Process any non-redirect errors thrown\n if (isErrorResult(result)) {\n setFetcherError(key, routeId, result.error);\n return;\n }\n invariant(!isDeferredResult(result), \"Unhandled fetcher deferred data\");\n // Put the fetcher back into an idle state\n updateFetcherState(key, getDoneFetcher(result.data));\n }\n /**\n * Utility function to handle redirects returned from an action or loader.\n * Normally, a redirect \"replaces\" the navigation that triggered it. So, for\n * example:\n *\n * - user is on /a\n * - user clicks a link to /b\n * - loader for /b redirects to /c\n *\n * In a non-JS app the browser would track the in-flight navigation to /b and\n * then replace it with /c when it encountered the redirect response. In\n * the end it would only ever update the URL bar with /c.\n *\n * In client-side routing using pushState/replaceState, we aim to emulate\n * this behavior and we also do not update history until the end of the\n * navigation (including processed redirects). This means that we never\n * actually touch history until we've processed redirects, so we just use\n * the history action from the original navigation (PUSH or REPLACE).\n */\n async function startRedirectNavigation(request, redirect, _temp2) {\n let {\n submission,\n fetcherSubmission,\n replace\n } = _temp2 === void 0 ? {} : _temp2;\n if (redirect.response.headers.has(\"X-Remix-Revalidate\")) {\n isRevalidationRequired = true;\n }\n let location = redirect.response.headers.get(\"Location\");\n invariant(location, \"Expected a Location header on the redirect Response\");\n location = normalizeRedirectLocation(location, new URL(request.url), basename);\n let redirectLocation = createLocation(state.location, location, {\n _isRedirect: true\n });\n if (isBrowser) {\n let isDocumentReload = false;\n if (redirect.response.headers.has(\"X-Remix-Reload-Document\")) {\n // Hard reload if the response contained X-Remix-Reload-Document\n isDocumentReload = true;\n } else if (ABSOLUTE_URL_REGEX.test(location)) {\n const url = init.history.createURL(location);\n isDocumentReload =\n // Hard reload if it's an absolute URL to a new origin\n url.origin !== routerWindow.location.origin ||\n // Hard reload if it's an absolute URL that does not match our basename\n stripBasename(url.pathname, basename) == null;\n }\n if (isDocumentReload) {\n if (replace) {\n routerWindow.location.replace(location);\n } else {\n routerWindow.location.assign(location);\n }\n return;\n }\n }\n // There's no need to abort on redirects, since we don't detect the\n // redirect until the action/loaders have settled\n pendingNavigationController = null;\n let redirectHistoryAction = replace === true ? Action.Replace : Action.Push;\n // Use the incoming submission if provided, fallback on the active one in\n // state.navigation\n let {\n formMethod,\n formAction,\n formEncType\n } = state.navigation;\n if (!submission && !fetcherSubmission && formMethod && formAction && formEncType) {\n submission = getSubmissionFromNavigation(state.navigation);\n }\n // If this was a 307/308 submission we want to preserve the HTTP method and\n // re-submit the GET/POST/PUT/PATCH/DELETE as a submission navigation to the\n // redirected location\n let activeSubmission = submission || fetcherSubmission;\n if (redirectPreserveMethodStatusCodes.has(redirect.response.status) && activeSubmission && isMutationMethod(activeSubmission.formMethod)) {\n await startNavigation(redirectHistoryAction, redirectLocation, {\n submission: _extends({}, activeSubmission, {\n formAction: location\n }),\n // Preserve this flag across redirects\n preventScrollReset: pendingPreventScrollReset\n });\n } else {\n // If we have a navigation submission, we will preserve it through the\n // redirect navigation\n let overrideNavigation = getLoadingNavigation(redirectLocation, submission);\n await startNavigation(redirectHistoryAction, redirectLocation, {\n overrideNavigation,\n // Send fetcher submissions through for shouldRevalidate\n fetcherSubmission,\n // Preserve this flag across redirects\n preventScrollReset: pendingPreventScrollReset\n });\n }\n }\n // Utility wrapper for calling dataStrategy client-side without having to\n // pass around the manifest, mapRouteProperties, etc.\n async function callDataStrategy(type, request, matchesToLoad, matches) {\n try {\n let results = await callDataStrategyImpl(dataStrategyImpl, type, request, matchesToLoad, matches, manifest, mapRouteProperties);\n return await Promise.all(results.map((result, i) => {\n if (isRedirectHandlerResult(result)) {\n let response = result.result;\n return {\n type: ResultType.redirect,\n response: normalizeRelativeRoutingRedirectResponse(response, request, matchesToLoad[i].route.id, matches, basename, future.v7_relativeSplatPath)\n };\n }\n return convertHandlerResultToDataResult(result);\n }));\n } catch (e) {\n // If the outer dataStrategy method throws, just return the error for all\n // matches - and it'll naturally bubble to the root\n return matchesToLoad.map(() => ({\n type: ResultType.error,\n error: e\n }));\n }\n }\n async function callLoadersAndMaybeResolveData(currentMatches, matches, matchesToLoad, fetchersToLoad, request) {\n let [loaderResults, ...fetcherResults] = await Promise.all([matchesToLoad.length ? callDataStrategy(\"loader\", request, matchesToLoad, matches) : [], ...fetchersToLoad.map(f => {\n if (f.matches && f.match && f.controller) {\n let fetcherRequest = createClientSideRequest(init.history, f.path, f.controller.signal);\n return callDataStrategy(\"loader\", fetcherRequest, [f.match], f.matches).then(r => r[0]);\n } else {\n return Promise.resolve({\n type: ResultType.error,\n error: getInternalRouterError(404, {\n pathname: f.path\n })\n });\n }\n })]);\n await Promise.all([resolveDeferredResults(currentMatches, matchesToLoad, loaderResults, loaderResults.map(() => request.signal), false, state.loaderData), resolveDeferredResults(currentMatches, fetchersToLoad.map(f => f.match), fetcherResults, fetchersToLoad.map(f => f.controller ? f.controller.signal : null), true)]);\n return {\n loaderResults,\n fetcherResults\n };\n }\n function interruptActiveLoads() {\n // Every interruption triggers a revalidation\n isRevalidationRequired = true;\n // Cancel pending route-level deferreds and mark cancelled routes for\n // revalidation\n cancelledDeferredRoutes.push(...cancelActiveDeferreds());\n // Abort in-flight fetcher loads\n fetchLoadMatches.forEach((_, key) => {\n if (fetchControllers.has(key)) {\n cancelledFetcherLoads.push(key);\n abortFetcher(key);\n }\n });\n }\n function updateFetcherState(key, fetcher, opts) {\n if (opts === void 0) {\n opts = {};\n }\n state.fetchers.set(key, fetcher);\n updateState({\n fetchers: new Map(state.fetchers)\n }, {\n flushSync: (opts && opts.flushSync) === true\n });\n }\n function setFetcherError(key, routeId, error, opts) {\n if (opts === void 0) {\n opts = {};\n }\n let boundaryMatch = findNearestBoundary(state.matches, routeId);\n deleteFetcher(key);\n updateState({\n errors: {\n [boundaryMatch.route.id]: error\n },\n fetchers: new Map(state.fetchers)\n }, {\n flushSync: (opts && opts.flushSync) === true\n });\n }\n function getFetcher(key) {\n if (future.v7_fetcherPersist) {\n activeFetchers.set(key, (activeFetchers.get(key) || 0) + 1);\n // If this fetcher was previously marked for deletion, unmark it since we\n // have a new instance\n if (deletedFetchers.has(key)) {\n deletedFetchers.delete(key);\n }\n }\n return state.fetchers.get(key) || IDLE_FETCHER;\n }\n function deleteFetcher(key) {\n let fetcher = state.fetchers.get(key);\n // Don't abort the controller if this is a deletion of a fetcher.submit()\n // in it's loading phase since - we don't want to abort the corresponding\n // revalidation and want them to complete and land\n if (fetchControllers.has(key) && !(fetcher && fetcher.state === \"loading\" && fetchReloadIds.has(key))) {\n abortFetcher(key);\n }\n fetchLoadMatches.delete(key);\n fetchReloadIds.delete(key);\n fetchRedirectIds.delete(key);\n deletedFetchers.delete(key);\n state.fetchers.delete(key);\n }\n function deleteFetcherAndUpdateState(key) {\n if (future.v7_fetcherPersist) {\n let count = (activeFetchers.get(key) || 0) - 1;\n if (count <= 0) {\n activeFetchers.delete(key);\n deletedFetchers.add(key);\n } else {\n activeFetchers.set(key, count);\n }\n } else {\n deleteFetcher(key);\n }\n updateState({\n fetchers: new Map(state.fetchers)\n });\n }\n function abortFetcher(key) {\n let controller = fetchControllers.get(key);\n invariant(controller, \"Expected fetch controller: \" + key);\n controller.abort();\n fetchControllers.delete(key);\n }\n function markFetchersDone(keys) {\n for (let key of keys) {\n let fetcher = getFetcher(key);\n let doneFetcher = getDoneFetcher(fetcher.data);\n state.fetchers.set(key, doneFetcher);\n }\n }\n function markFetchRedirectsDone() {\n let doneKeys = [];\n let updatedFetchers = false;\n for (let key of fetchRedirectIds) {\n let fetcher = state.fetchers.get(key);\n invariant(fetcher, \"Expected fetcher: \" + key);\n if (fetcher.state === \"loading\") {\n fetchRedirectIds.delete(key);\n doneKeys.push(key);\n updatedFetchers = true;\n }\n }\n markFetchersDone(doneKeys);\n return updatedFetchers;\n }\n function abortStaleFetchLoads(landedId) {\n let yeetedKeys = [];\n for (let [key, id] of fetchReloadIds) {\n if (id < landedId) {\n let fetcher = state.fetchers.get(key);\n invariant(fetcher, \"Expected fetcher: \" + key);\n if (fetcher.state === \"loading\") {\n abortFetcher(key);\n fetchReloadIds.delete(key);\n yeetedKeys.push(key);\n }\n }\n }\n markFetchersDone(yeetedKeys);\n return yeetedKeys.length > 0;\n }\n function getBlocker(key, fn) {\n let blocker = state.blockers.get(key) || IDLE_BLOCKER;\n if (blockerFunctions.get(key) !== fn) {\n blockerFunctions.set(key, fn);\n }\n return blocker;\n }\n function deleteBlocker(key) {\n state.blockers.delete(key);\n blockerFunctions.delete(key);\n }\n // Utility function to update blockers, ensuring valid state transitions\n function updateBlocker(key, newBlocker) {\n let blocker = state.blockers.get(key) || IDLE_BLOCKER;\n // Poor mans state machine :)\n // https://mermaid.live/edit#pako:eNqVkc9OwzAMxl8l8nnjAYrEtDIOHEBIgwvKJTReGy3_lDpIqO27k6awMG0XcrLlnz87nwdonESogKXXBuE79rq75XZO3-yHds0RJVuv70YrPlUrCEe2HfrORS3rubqZfuhtpg5C9wk5tZ4VKcRUq88q9Z8RS0-48cE1iHJkL0ugbHuFLus9L6spZy8nX9MP2CNdomVaposqu3fGayT8T8-jJQwhepo_UtpgBQaDEUom04dZhAN1aJBDlUKJBxE1ceB2Smj0Mln-IBW5AFU2dwUiktt_2Qaq2dBfaKdEup85UV7Yd-dKjlnkabl2Pvr0DTkTreM\n invariant(blocker.state === \"unblocked\" && newBlocker.state === \"blocked\" || blocker.state === \"blocked\" && newBlocker.state === \"blocked\" || blocker.state === \"blocked\" && newBlocker.state === \"proceeding\" || blocker.state === \"blocked\" && newBlocker.state === \"unblocked\" || blocker.state === \"proceeding\" && newBlocker.state === \"unblocked\", \"Invalid blocker state transition: \" + blocker.state + \" -> \" + newBlocker.state);\n let blockers = new Map(state.blockers);\n blockers.set(key, newBlocker);\n updateState({\n blockers\n });\n }\n function shouldBlockNavigation(_ref4) {\n let {\n currentLocation,\n nextLocation,\n historyAction\n } = _ref4;\n if (blockerFunctions.size === 0) {\n return;\n }\n // We ony support a single active blocker at the moment since we don't have\n // any compelling use cases for multi-blocker yet\n if (blockerFunctions.size > 1) {\n warning(false, \"A router only supports one blocker at a time\");\n }\n let entries = Array.from(blockerFunctions.entries());\n let [blockerKey, blockerFunction] = entries[entries.length - 1];\n let blocker = state.blockers.get(blockerKey);\n if (blocker && blocker.state === \"proceeding\") {\n // If the blocker is currently proceeding, we don't need to re-check\n // it and can let this navigation continue\n return;\n }\n // At this point, we know we're unblocked/blocked so we need to check the\n // user-provided blocker function\n if (blockerFunction({\n currentLocation,\n nextLocation,\n historyAction\n })) {\n return blockerKey;\n }\n }\n function cancelActiveDeferreds(predicate) {\n let cancelledRouteIds = [];\n activeDeferreds.forEach((dfd, routeId) => {\n if (!predicate || predicate(routeId)) {\n // Cancel the deferred - but do not remove from activeDeferreds here -\n // we rely on the subscribers to do that so our tests can assert proper\n // cleanup via _internalActiveDeferreds\n dfd.cancel();\n cancelledRouteIds.push(routeId);\n activeDeferreds.delete(routeId);\n }\n });\n return cancelledRouteIds;\n }\n // Opt in to capturing and reporting scroll positions during navigations,\n // used by the component\n function enableScrollRestoration(positions, getPosition, getKey) {\n savedScrollPositions = positions;\n getScrollPosition = getPosition;\n getScrollRestorationKey = getKey || null;\n // Perform initial hydration scroll restoration, since we miss the boat on\n // the initial updateState() because we've not yet rendered \n // and therefore have no savedScrollPositions available\n if (!initialScrollRestored && state.navigation === IDLE_NAVIGATION) {\n initialScrollRestored = true;\n let y = getSavedScrollPosition(state.location, state.matches);\n if (y != null) {\n updateState({\n restoreScrollPosition: y\n });\n }\n }\n return () => {\n savedScrollPositions = null;\n getScrollPosition = null;\n getScrollRestorationKey = null;\n };\n }\n function getScrollKey(location, matches) {\n if (getScrollRestorationKey) {\n let key = getScrollRestorationKey(location, matches.map(m => convertRouteMatchToUiMatch(m, state.loaderData)));\n return key || location.key;\n }\n return location.key;\n }\n function saveScrollPosition(location, matches) {\n if (savedScrollPositions && getScrollPosition) {\n let key = getScrollKey(location, matches);\n savedScrollPositions[key] = getScrollPosition();\n }\n }\n function getSavedScrollPosition(location, matches) {\n if (savedScrollPositions) {\n let key = getScrollKey(location, matches);\n let y = savedScrollPositions[key];\n if (typeof y === \"number\") {\n return y;\n }\n }\n return null;\n }\n function _internalSetRoutes(newRoutes) {\n manifest = {};\n inFlightDataRoutes = convertRoutesToDataRoutes(newRoutes, mapRouteProperties, undefined, manifest);\n }\n router = {\n get basename() {\n return basename;\n },\n get future() {\n return future;\n },\n get state() {\n return state;\n },\n get routes() {\n return dataRoutes;\n },\n get window() {\n return routerWindow;\n },\n initialize,\n subscribe,\n enableScrollRestoration,\n navigate,\n fetch,\n revalidate,\n // Passthrough to history-aware createHref used by useHref so we get proper\n // hash-aware URLs in DOM paths\n createHref: to => init.history.createHref(to),\n encodeLocation: to => init.history.encodeLocation(to),\n getFetcher,\n deleteFetcher: deleteFetcherAndUpdateState,\n dispose,\n getBlocker,\n deleteBlocker,\n _internalFetchControllers: fetchControllers,\n _internalActiveDeferreds: activeDeferreds,\n // TODO: Remove setRoutes, it's temporary to avoid dealing with\n // updating the tree while validating the update algorithm.\n _internalSetRoutes\n };\n return router;\n}\n//#endregion\n////////////////////////////////////////////////////////////////////////////////\n//#region createStaticHandler\n////////////////////////////////////////////////////////////////////////////////\nconst UNSAFE_DEFERRED_SYMBOL = Symbol(\"deferred\");\nfunction createStaticHandler(routes, opts) {\n invariant(routes.length > 0, \"You must provide a non-empty routes array to createStaticHandler\");\n let manifest = {};\n let basename = (opts ? opts.basename : null) || \"/\";\n let mapRouteProperties;\n if (opts != null && opts.mapRouteProperties) {\n mapRouteProperties = opts.mapRouteProperties;\n } else if (opts != null && opts.detectErrorBoundary) {\n // If they are still using the deprecated version, wrap it with the new API\n let detectErrorBoundary = opts.detectErrorBoundary;\n mapRouteProperties = route => ({\n hasErrorBoundary: detectErrorBoundary(route)\n });\n } else {\n mapRouteProperties = defaultMapRouteProperties;\n }\n // Config driven behavior flags\n let future = _extends({\n v7_relativeSplatPath: false,\n v7_throwAbortReason: false\n }, opts ? opts.future : null);\n let dataRoutes = convertRoutesToDataRoutes(routes, mapRouteProperties, undefined, manifest);\n /**\n * The query() method is intended for document requests, in which we want to\n * call an optional action and potentially multiple loaders for all nested\n * routes. It returns a StaticHandlerContext object, which is very similar\n * to the router state (location, loaderData, actionData, errors, etc.) and\n * also adds SSR-specific information such as the statusCode and headers\n * from action/loaders Responses.\n *\n * It _should_ never throw and should report all errors through the\n * returned context.errors object, properly associating errors to their error\n * boundary. Additionally, it tracks _deepestRenderedBoundaryId which can be\n * used to emulate React error boundaries during SSr by performing a second\n * pass only down to the boundaryId.\n *\n * The one exception where we do not return a StaticHandlerContext is when a\n * redirect response is returned or thrown from any action/loader. We\n * propagate that out and return the raw Response so the HTTP server can\n * return it directly.\n *\n * - `opts.requestContext` is an optional server context that will be passed\n * to actions/loaders in the `context` parameter\n * - `opts.skipLoaderErrorBubbling` is an optional parameter that will prevent\n * the bubbling of errors which allows single-fetch-type implementations\n * where the client will handle the bubbling and we may need to return data\n * for the handling route\n */\n async function query(request, _temp3) {\n let {\n requestContext,\n skipLoaderErrorBubbling,\n unstable_dataStrategy\n } = _temp3 === void 0 ? {} : _temp3;\n let url = new URL(request.url);\n let method = request.method;\n let location = createLocation(\"\", createPath(url), null, \"default\");\n let matches = matchRoutes(dataRoutes, location, basename);\n // SSR supports HEAD requests while SPA doesn't\n if (!isValidMethod(method) && method !== \"HEAD\") {\n let error = getInternalRouterError(405, {\n method\n });\n let {\n matches: methodNotAllowedMatches,\n route\n } = getShortCircuitMatches(dataRoutes);\n return {\n basename,\n location,\n matches: methodNotAllowedMatches,\n loaderData: {},\n actionData: null,\n errors: {\n [route.id]: error\n },\n statusCode: error.status,\n loaderHeaders: {},\n actionHeaders: {},\n activeDeferreds: null\n };\n } else if (!matches) {\n let error = getInternalRouterError(404, {\n pathname: location.pathname\n });\n let {\n matches: notFoundMatches,\n route\n } = getShortCircuitMatches(dataRoutes);\n return {\n basename,\n location,\n matches: notFoundMatches,\n loaderData: {},\n actionData: null,\n errors: {\n [route.id]: error\n },\n statusCode: error.status,\n loaderHeaders: {},\n actionHeaders: {},\n activeDeferreds: null\n };\n }\n let result = await queryImpl(request, location, matches, requestContext, unstable_dataStrategy || null, skipLoaderErrorBubbling === true, null);\n if (isResponse(result)) {\n return result;\n }\n // When returning StaticHandlerContext, we patch back in the location here\n // since we need it for React Context. But this helps keep our submit and\n // loadRouteData operating on a Request instead of a Location\n return _extends({\n location,\n basename\n }, result);\n }\n /**\n * The queryRoute() method is intended for targeted route requests, either\n * for fetch ?_data requests or resource route requests. In this case, we\n * are only ever calling a single action or loader, and we are returning the\n * returned value directly. In most cases, this will be a Response returned\n * from the action/loader, but it may be a primitive or other value as well -\n * and in such cases the calling context should handle that accordingly.\n *\n * We do respect the throw/return differentiation, so if an action/loader\n * throws, then this method will throw the value. This is important so we\n * can do proper boundary identification in Remix where a thrown Response\n * must go to the Catch Boundary but a returned Response is happy-path.\n *\n * One thing to note is that any Router-initiated Errors that make sense\n * to associate with a status code will be thrown as an ErrorResponse\n * instance which include the raw Error, such that the calling context can\n * serialize the error as they see fit while including the proper response\n * code. Examples here are 404 and 405 errors that occur prior to reaching\n * any user-defined loaders.\n *\n * - `opts.routeId` allows you to specify the specific route handler to call.\n * If not provided the handler will determine the proper route by matching\n * against `request.url`\n * - `opts.requestContext` is an optional server context that will be passed\n * to actions/loaders in the `context` parameter\n */\n async function queryRoute(request, _temp4) {\n let {\n routeId,\n requestContext,\n unstable_dataStrategy\n } = _temp4 === void 0 ? {} : _temp4;\n let url = new URL(request.url);\n let method = request.method;\n let location = createLocation(\"\", createPath(url), null, \"default\");\n let matches = matchRoutes(dataRoutes, location, basename);\n // SSR supports HEAD requests while SPA doesn't\n if (!isValidMethod(method) && method !== \"HEAD\" && method !== \"OPTIONS\") {\n throw getInternalRouterError(405, {\n method\n });\n } else if (!matches) {\n throw getInternalRouterError(404, {\n pathname: location.pathname\n });\n }\n let match = routeId ? matches.find(m => m.route.id === routeId) : getTargetMatch(matches, location);\n if (routeId && !match) {\n throw getInternalRouterError(403, {\n pathname: location.pathname,\n routeId\n });\n } else if (!match) {\n // This should never hit I don't think?\n throw getInternalRouterError(404, {\n pathname: location.pathname\n });\n }\n let result = await queryImpl(request, location, matches, requestContext, unstable_dataStrategy || null, false, match);\n if (isResponse(result)) {\n return result;\n }\n let error = result.errors ? Object.values(result.errors)[0] : undefined;\n if (error !== undefined) {\n // If we got back result.errors, that means the loader/action threw\n // _something_ that wasn't a Response, but it's not guaranteed/required\n // to be an `instanceof Error` either, so we have to use throw here to\n // preserve the \"error\" state outside of queryImpl.\n throw error;\n }\n // Pick off the right state value to return\n if (result.actionData) {\n return Object.values(result.actionData)[0];\n }\n if (result.loaderData) {\n var _result$activeDeferre;\n let data = Object.values(result.loaderData)[0];\n if ((_result$activeDeferre = result.activeDeferreds) != null && _result$activeDeferre[match.route.id]) {\n data[UNSAFE_DEFERRED_SYMBOL] = result.activeDeferreds[match.route.id];\n }\n return data;\n }\n return undefined;\n }\n async function queryImpl(request, location, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch) {\n invariant(request.signal, \"query()/queryRoute() requests must contain an AbortController signal\");\n try {\n if (isMutationMethod(request.method.toLowerCase())) {\n let result = await submit(request, matches, routeMatch || getTargetMatch(matches, location), requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch != null);\n return result;\n }\n let result = await loadRouteData(request, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch);\n return isResponse(result) ? result : _extends({}, result, {\n actionData: null,\n actionHeaders: {}\n });\n } catch (e) {\n // If the user threw/returned a Response in callLoaderOrAction for a\n // `queryRoute` call, we throw the `HandlerResult` to bail out early\n // and then return or throw the raw Response here accordingly\n if (isHandlerResult(e) && isResponse(e.result)) {\n if (e.type === ResultType.error) {\n throw e.result;\n }\n return e.result;\n }\n // Redirects are always returned since they don't propagate to catch\n // boundaries\n if (isRedirectResponse(e)) {\n return e;\n }\n throw e;\n }\n }\n async function submit(request, matches, actionMatch, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, isRouteRequest) {\n let result;\n if (!actionMatch.route.action && !actionMatch.route.lazy) {\n let error = getInternalRouterError(405, {\n method: request.method,\n pathname: new URL(request.url).pathname,\n routeId: actionMatch.route.id\n });\n if (isRouteRequest) {\n throw error;\n }\n result = {\n type: ResultType.error,\n error\n };\n } else {\n let results = await callDataStrategy(\"action\", request, [actionMatch], matches, isRouteRequest, requestContext, unstable_dataStrategy);\n result = results[0];\n if (request.signal.aborted) {\n throwStaticHandlerAbortedError(request, isRouteRequest, future);\n }\n }\n if (isRedirectResult(result)) {\n // Uhhhh - this should never happen, we should always throw these from\n // callLoaderOrAction, but the type narrowing here keeps TS happy and we\n // can get back on the \"throw all redirect responses\" train here should\n // this ever happen :/\n throw new Response(null, {\n status: result.response.status,\n headers: {\n Location: result.response.headers.get(\"Location\")\n }\n });\n }\n if (isDeferredResult(result)) {\n let error = getInternalRouterError(400, {\n type: \"defer-action\"\n });\n if (isRouteRequest) {\n throw error;\n }\n result = {\n type: ResultType.error,\n error\n };\n }\n if (isRouteRequest) {\n // Note: This should only be non-Response values if we get here, since\n // isRouteRequest should throw any Response received in callLoaderOrAction\n if (isErrorResult(result)) {\n throw result.error;\n }\n return {\n matches: [actionMatch],\n loaderData: {},\n actionData: {\n [actionMatch.route.id]: result.data\n },\n errors: null,\n // Note: statusCode + headers are unused here since queryRoute will\n // return the raw Response or value\n statusCode: 200,\n loaderHeaders: {},\n actionHeaders: {},\n activeDeferreds: null\n };\n }\n // Create a GET request for the loaders\n let loaderRequest = new Request(request.url, {\n headers: request.headers,\n redirect: request.redirect,\n signal: request.signal\n });\n if (isErrorResult(result)) {\n // Store off the pending error - we use it to determine which loaders\n // to call and will commit it when we complete the navigation\n let boundaryMatch = skipLoaderErrorBubbling ? actionMatch : findNearestBoundary(matches, actionMatch.route.id);\n let context = await loadRouteData(loaderRequest, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, null, [boundaryMatch.route.id, result]);\n // action status codes take precedence over loader status codes\n return _extends({}, context, {\n statusCode: isRouteErrorResponse(result.error) ? result.error.status : result.statusCode != null ? result.statusCode : 500,\n actionData: null,\n actionHeaders: _extends({}, result.headers ? {\n [actionMatch.route.id]: result.headers\n } : {})\n });\n }\n let context = await loadRouteData(loaderRequest, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, null);\n return _extends({}, context, {\n actionData: {\n [actionMatch.route.id]: result.data\n }\n }, result.statusCode ? {\n statusCode: result.statusCode\n } : {}, {\n actionHeaders: result.headers ? {\n [actionMatch.route.id]: result.headers\n } : {}\n });\n }\n async function loadRouteData(request, matches, requestContext, unstable_dataStrategy, skipLoaderErrorBubbling, routeMatch, pendingActionResult) {\n let isRouteRequest = routeMatch != null;\n // Short circuit if we have no loaders to run (queryRoute())\n if (isRouteRequest && !(routeMatch != null && routeMatch.route.loader) && !(routeMatch != null && routeMatch.route.lazy)) {\n throw getInternalRouterError(400, {\n method: request.method,\n pathname: new URL(request.url).pathname,\n routeId: routeMatch == null ? void 0 : routeMatch.route.id\n });\n }\n let requestMatches = routeMatch ? [routeMatch] : pendingActionResult && isErrorResult(pendingActionResult[1]) ? getLoaderMatchesUntilBoundary(matches, pendingActionResult[0]) : matches;\n let matchesToLoad = requestMatches.filter(m => m.route.loader || m.route.lazy);\n // Short circuit if we have no loaders to run (query())\n if (matchesToLoad.length === 0) {\n return {\n matches,\n // Add a null for all matched routes for proper revalidation on the client\n loaderData: matches.reduce((acc, m) => Object.assign(acc, {\n [m.route.id]: null\n }), {}),\n errors: pendingActionResult && isErrorResult(pendingActionResult[1]) ? {\n [pendingActionResult[0]]: pendingActionResult[1].error\n } : null,\n statusCode: 200,\n loaderHeaders: {},\n activeDeferreds: null\n };\n }\n let results = await callDataStrategy(\"loader\", request, matchesToLoad, matches, isRouteRequest, requestContext, unstable_dataStrategy);\n if (request.signal.aborted) {\n throwStaticHandlerAbortedError(request, isRouteRequest, future);\n }\n // Process and commit output from loaders\n let activeDeferreds = new Map();\n let context = processRouteLoaderData(matches, matchesToLoad, results, pendingActionResult, activeDeferreds, skipLoaderErrorBubbling);\n // Add a null for any non-loader matches for proper revalidation on the client\n let executedLoaders = new Set(matchesToLoad.map(match => match.route.id));\n matches.forEach(match => {\n if (!executedLoaders.has(match.route.id)) {\n context.loaderData[match.route.id] = null;\n }\n });\n return _extends({}, context, {\n matches,\n activeDeferreds: activeDeferreds.size > 0 ? Object.fromEntries(activeDeferreds.entries()) : null\n });\n }\n // Utility wrapper for calling dataStrategy server-side without having to\n // pass around the manifest, mapRouteProperties, etc.\n async function callDataStrategy(type, request, matchesToLoad, matches, isRouteRequest, requestContext, unstable_dataStrategy) {\n let results = await callDataStrategyImpl(unstable_dataStrategy || defaultDataStrategy, type, request, matchesToLoad, matches, manifest, mapRouteProperties, requestContext);\n return await Promise.all(results.map((result, i) => {\n if (isRedirectHandlerResult(result)) {\n let response = result.result;\n // Throw redirects and let the server handle them with an HTTP redirect\n throw normalizeRelativeRoutingRedirectResponse(response, request, matchesToLoad[i].route.id, matches, basename, future.v7_relativeSplatPath);\n }\n if (isResponse(result.result) && isRouteRequest) {\n // For SSR single-route requests, we want to hand Responses back\n // directly without unwrapping\n throw result;\n }\n return convertHandlerResultToDataResult(result);\n }));\n }\n return {\n dataRoutes,\n query,\n queryRoute\n };\n}\n//#endregion\n////////////////////////////////////////////////////////////////////////////////\n//#region Helpers\n////////////////////////////////////////////////////////////////////////////////\n/**\n * Given an existing StaticHandlerContext and an error thrown at render time,\n * provide an updated StaticHandlerContext suitable for a second SSR render\n */\nfunction getStaticContextFromError(routes, context, error) {\n let newContext = _extends({}, context, {\n statusCode: isRouteErrorResponse(error) ? error.status : 500,\n errors: {\n [context._deepestRenderedBoundaryId || routes[0].id]: error\n }\n });\n return newContext;\n}\nfunction throwStaticHandlerAbortedError(request, isRouteRequest, future) {\n if (future.v7_throwAbortReason && request.signal.reason !== undefined) {\n throw request.signal.reason;\n }\n let method = isRouteRequest ? \"queryRoute\" : \"query\";\n throw new Error(method + \"() call aborted: \" + request.method + \" \" + request.url);\n}\nfunction isSubmissionNavigation(opts) {\n return opts != null && (\"formData\" in opts && opts.formData != null || \"body\" in opts && opts.body !== undefined);\n}\nfunction normalizeTo(location, matches, basename, prependBasename, to, v7_relativeSplatPath, fromRouteId, relative) {\n let contextualMatches;\n let activeRouteMatch;\n if (fromRouteId) {\n // Grab matches up to the calling route so our route-relative logic is\n // relative to the correct source route\n contextualMatches = [];\n for (let match of matches) {\n contextualMatches.push(match);\n if (match.route.id === fromRouteId) {\n activeRouteMatch = match;\n break;\n }\n }\n } else {\n contextualMatches = matches;\n activeRouteMatch = matches[matches.length - 1];\n }\n // Resolve the relative path\n let path = resolveTo(to ? to : \".\", getResolveToMatches(contextualMatches, v7_relativeSplatPath), stripBasename(location.pathname, basename) || location.pathname, relative === \"path\");\n // When `to` is not specified we inherit search/hash from the current\n // location, unlike when to=\".\" and we just inherit the path.\n // See https://github.com/remix-run/remix/issues/927\n if (to == null) {\n path.search = location.search;\n path.hash = location.hash;\n }\n // Add an ?index param for matched index routes if we don't already have one\n if ((to == null || to === \"\" || to === \".\") && activeRouteMatch && activeRouteMatch.route.index && !hasNakedIndexQuery(path.search)) {\n path.search = path.search ? path.search.replace(/^\\?/, \"?index&\") : \"?index\";\n }\n // If we're operating within a basename, prepend it to the pathname. If\n // this is a root navigation, then just use the raw basename which allows\n // the basename to have full control over the presence of a trailing slash\n // on root actions\n if (prependBasename && basename !== \"/\") {\n path.pathname = path.pathname === \"/\" ? basename : joinPaths([basename, path.pathname]);\n }\n return createPath(path);\n}\n// Normalize navigation options by converting formMethod=GET formData objects to\n// URLSearchParams so they behave identically to links with query params\nfunction normalizeNavigateOptions(normalizeFormMethod, isFetcher, path, opts) {\n // Return location verbatim on non-submission navigations\n if (!opts || !isSubmissionNavigation(opts)) {\n return {\n path\n };\n }\n if (opts.formMethod && !isValidMethod(opts.formMethod)) {\n return {\n path,\n error: getInternalRouterError(405, {\n method: opts.formMethod\n })\n };\n }\n let getInvalidBodyError = () => ({\n path,\n error: getInternalRouterError(400, {\n type: \"invalid-body\"\n })\n });\n // Create a Submission on non-GET navigations\n let rawFormMethod = opts.formMethod || \"get\";\n let formMethod = normalizeFormMethod ? rawFormMethod.toUpperCase() : rawFormMethod.toLowerCase();\n let formAction = stripHashFromPath(path);\n if (opts.body !== undefined) {\n if (opts.formEncType === \"text/plain\") {\n // text only support POST/PUT/PATCH/DELETE submissions\n if (!isMutationMethod(formMethod)) {\n return getInvalidBodyError();\n }\n let text = typeof opts.body === \"string\" ? opts.body : opts.body instanceof FormData || opts.body instanceof URLSearchParams ?\n // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#plain-text-form-data\n Array.from(opts.body.entries()).reduce((acc, _ref5) => {\n let [name, value] = _ref5;\n return \"\" + acc + name + \"=\" + value + \"\\n\";\n }, \"\") : String(opts.body);\n return {\n path,\n submission: {\n formMethod,\n formAction,\n formEncType: opts.formEncType,\n formData: undefined,\n json: undefined,\n text\n }\n };\n } else if (opts.formEncType === \"application/json\") {\n // json only supports POST/PUT/PATCH/DELETE submissions\n if (!isMutationMethod(formMethod)) {\n return getInvalidBodyError();\n }\n try {\n let json = typeof opts.body === \"string\" ? JSON.parse(opts.body) : opts.body;\n return {\n path,\n submission: {\n formMethod,\n formAction,\n formEncType: opts.formEncType,\n formData: undefined,\n json,\n text: undefined\n }\n };\n } catch (e) {\n return getInvalidBodyError();\n }\n }\n }\n invariant(typeof FormData === \"function\", \"FormData is not available in this environment\");\n let searchParams;\n let formData;\n if (opts.formData) {\n searchParams = convertFormDataToSearchParams(opts.formData);\n formData = opts.formData;\n } else if (opts.body instanceof FormData) {\n searchParams = convertFormDataToSearchParams(opts.body);\n formData = opts.body;\n } else if (opts.body instanceof URLSearchParams) {\n searchParams = opts.body;\n formData = convertSearchParamsToFormData(searchParams);\n } else if (opts.body == null) {\n searchParams = new URLSearchParams();\n formData = new FormData();\n } else {\n try {\n searchParams = new URLSearchParams(opts.body);\n formData = convertSearchParamsToFormData(searchParams);\n } catch (e) {\n return getInvalidBodyError();\n }\n }\n let submission = {\n formMethod,\n formAction,\n formEncType: opts && opts.formEncType || \"application/x-www-form-urlencoded\",\n formData,\n json: undefined,\n text: undefined\n };\n if (isMutationMethod(submission.formMethod)) {\n return {\n path,\n submission\n };\n }\n // Flatten submission onto URLSearchParams for GET submissions\n let parsedPath = parsePath(path);\n // On GET navigation submissions we can drop the ?index param from the\n // resulting location since all loaders will run. But fetcher GET submissions\n // only run a single loader so we need to preserve any incoming ?index params\n if (isFetcher && parsedPath.search && hasNakedIndexQuery(parsedPath.search)) {\n searchParams.append(\"index\", \"\");\n }\n parsedPath.search = \"?\" + searchParams;\n return {\n path: createPath(parsedPath),\n submission\n };\n}\n// Filter out all routes below any caught error as they aren't going to\n// render so we don't need to load them\nfunction getLoaderMatchesUntilBoundary(matches, boundaryId) {\n let boundaryMatches = matches;\n if (boundaryId) {\n let index = matches.findIndex(m => m.route.id === boundaryId);\n if (index >= 0) {\n boundaryMatches = matches.slice(0, index);\n }\n }\n return boundaryMatches;\n}\nfunction getMatchesToLoad(history, state, matches, submission, location, isInitialLoad, skipActionErrorRevalidation, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, pendingActionResult) {\n let actionResult = pendingActionResult ? isErrorResult(pendingActionResult[1]) ? pendingActionResult[1].error : pendingActionResult[1].data : undefined;\n let currentUrl = history.createURL(state.location);\n let nextUrl = history.createURL(location);\n // Pick navigation matches that are net-new or qualify for revalidation\n let boundaryId = pendingActionResult && isErrorResult(pendingActionResult[1]) ? pendingActionResult[0] : undefined;\n let boundaryMatches = boundaryId ? getLoaderMatchesUntilBoundary(matches, boundaryId) : matches;\n // Don't revalidate loaders by default after action 4xx/5xx responses\n // when the flag is enabled. They can still opt-into revalidation via\n // `shouldRevalidate` via `actionResult`\n let actionStatus = pendingActionResult ? pendingActionResult[1].statusCode : undefined;\n let shouldSkipRevalidation = skipActionErrorRevalidation && actionStatus && actionStatus >= 400;\n let navigationMatches = boundaryMatches.filter((match, index) => {\n let {\n route\n } = match;\n if (route.lazy) {\n // We haven't loaded this route yet so we don't know if it's got a loader!\n return true;\n }\n if (route.loader == null) {\n return false;\n }\n if (isInitialLoad) {\n if (typeof route.loader !== \"function\" || route.loader.hydrate) {\n return true;\n }\n return state.loaderData[route.id] === undefined && (\n // Don't re-run if the loader ran and threw an error\n !state.errors || state.errors[route.id] === undefined);\n }\n // Always call the loader on new route instances and pending defer cancellations\n if (isNewLoader(state.loaderData, state.matches[index], match) || cancelledDeferredRoutes.some(id => id === match.route.id)) {\n return true;\n }\n // This is the default implementation for when we revalidate. If the route\n // provides it's own implementation, then we give them full control but\n // provide this value so they can leverage it if needed after they check\n // their own specific use cases\n let currentRouteMatch = state.matches[index];\n let nextRouteMatch = match;\n return shouldRevalidateLoader(match, _extends({\n currentUrl,\n currentParams: currentRouteMatch.params,\n nextUrl,\n nextParams: nextRouteMatch.params\n }, submission, {\n actionResult,\n unstable_actionStatus: actionStatus,\n defaultShouldRevalidate: shouldSkipRevalidation ? false :\n // Forced revalidation due to submission, useRevalidator, or X-Remix-Revalidate\n isRevalidationRequired || currentUrl.pathname + currentUrl.search === nextUrl.pathname + nextUrl.search ||\n // Search params affect all loaders\n currentUrl.search !== nextUrl.search || isNewRouteInstance(currentRouteMatch, nextRouteMatch)\n }));\n });\n // Pick fetcher.loads that need to be revalidated\n let revalidatingFetchers = [];\n fetchLoadMatches.forEach((f, key) => {\n // Don't revalidate:\n // - on initial load (shouldn't be any fetchers then anyway)\n // - if fetcher won't be present in the subsequent render\n // - no longer matches the URL (v7_fetcherPersist=false)\n // - was unmounted but persisted due to v7_fetcherPersist=true\n if (isInitialLoad || !matches.some(m => m.route.id === f.routeId) || deletedFetchers.has(key)) {\n return;\n }\n let fetcherMatches = matchRoutes(routesToUse, f.path, basename);\n // If the fetcher path no longer matches, push it in with null matches so\n // we can trigger a 404 in callLoadersAndMaybeResolveData. Note this is\n // currently only a use-case for Remix HMR where the route tree can change\n // at runtime and remove a route previously loaded via a fetcher\n if (!fetcherMatches) {\n revalidatingFetchers.push({\n key,\n routeId: f.routeId,\n path: f.path,\n matches: null,\n match: null,\n controller: null\n });\n return;\n }\n // Revalidating fetchers are decoupled from the route matches since they\n // load from a static href. They revalidate based on explicit revalidation\n // (submission, useRevalidator, or X-Remix-Revalidate)\n let fetcher = state.fetchers.get(key);\n let fetcherMatch = getTargetMatch(fetcherMatches, f.path);\n let shouldRevalidate = false;\n if (fetchRedirectIds.has(key)) {\n // Never trigger a revalidation of an actively redirecting fetcher\n shouldRevalidate = false;\n } else if (cancelledFetcherLoads.includes(key)) {\n // Always revalidate if the fetcher was cancelled\n shouldRevalidate = true;\n } else if (fetcher && fetcher.state !== \"idle\" && fetcher.data === undefined) {\n // If the fetcher hasn't ever completed loading yet, then this isn't a\n // revalidation, it would just be a brand new load if an explicit\n // revalidation is required\n shouldRevalidate = isRevalidationRequired;\n } else {\n // Otherwise fall back on any user-defined shouldRevalidate, defaulting\n // to explicit revalidations only\n shouldRevalidate = shouldRevalidateLoader(fetcherMatch, _extends({\n currentUrl,\n currentParams: state.matches[state.matches.length - 1].params,\n nextUrl,\n nextParams: matches[matches.length - 1].params\n }, submission, {\n actionResult,\n unstable_actionStatus: actionStatus,\n defaultShouldRevalidate: shouldSkipRevalidation ? false : isRevalidationRequired\n }));\n }\n if (shouldRevalidate) {\n revalidatingFetchers.push({\n key,\n routeId: f.routeId,\n path: f.path,\n matches: fetcherMatches,\n match: fetcherMatch,\n controller: new AbortController()\n });\n }\n });\n return [navigationMatches, revalidatingFetchers];\n}\nfunction isNewLoader(currentLoaderData, currentMatch, match) {\n let isNew =\n // [a] -> [a, b]\n !currentMatch ||\n // [a, b] -> [a, c]\n match.route.id !== currentMatch.route.id;\n // Handle the case that we don't have data for a re-used route, potentially\n // from a prior error or from a cancelled pending deferred\n let isMissingData = currentLoaderData[match.route.id] === undefined;\n // Always load if this is a net-new route or we don't yet have data\n return isNew || isMissingData;\n}\nfunction isNewRouteInstance(currentMatch, match) {\n let currentPath = currentMatch.route.path;\n return (\n // param change for this match, /users/123 -> /users/456\n currentMatch.pathname !== match.pathname ||\n // splat param changed, which is not present in match.path\n // e.g. /files/images/avatar.jpg -> files/finances.xls\n currentPath != null && currentPath.endsWith(\"*\") && currentMatch.params[\"*\"] !== match.params[\"*\"]\n );\n}\nfunction shouldRevalidateLoader(loaderMatch, arg) {\n if (loaderMatch.route.shouldRevalidate) {\n let routeChoice = loaderMatch.route.shouldRevalidate(arg);\n if (typeof routeChoice === \"boolean\") {\n return routeChoice;\n }\n }\n return arg.defaultShouldRevalidate;\n}\n/**\n * Execute route.lazy() methods to lazily load route modules (loader, action,\n * shouldRevalidate) and update the routeManifest in place which shares objects\n * with dataRoutes so those get updated as well.\n */\nasync function loadLazyRouteModule(route, mapRouteProperties, manifest) {\n if (!route.lazy) {\n return;\n }\n let lazyRoute = await route.lazy();\n // If the lazy route function was executed and removed by another parallel\n // call then we can return - first lazy() to finish wins because the return\n // value of lazy is expected to be static\n if (!route.lazy) {\n return;\n }\n let routeToUpdate = manifest[route.id];\n invariant(routeToUpdate, \"No route found in manifest\");\n // Update the route in place. This should be safe because there's no way\n // we could yet be sitting on this route as we can't get there without\n // resolving lazy() first.\n //\n // This is different than the HMR \"update\" use-case where we may actively be\n // on the route being updated. The main concern boils down to \"does this\n // mutation affect any ongoing navigations or any current state.matches\n // values?\". If not, it should be safe to update in place.\n let routeUpdates = {};\n for (let lazyRouteProperty in lazyRoute) {\n let staticRouteValue = routeToUpdate[lazyRouteProperty];\n let isPropertyStaticallyDefined = staticRouteValue !== undefined &&\n // This property isn't static since it should always be updated based\n // on the route updates\n lazyRouteProperty !== \"hasErrorBoundary\";\n warning(!isPropertyStaticallyDefined, \"Route \\\"\" + routeToUpdate.id + \"\\\" has a static property \\\"\" + lazyRouteProperty + \"\\\" \" + \"defined but its lazy function is also returning a value for this property. \" + (\"The lazy route property \\\"\" + lazyRouteProperty + \"\\\" will be ignored.\"));\n if (!isPropertyStaticallyDefined && !immutableRouteKeys.has(lazyRouteProperty)) {\n routeUpdates[lazyRouteProperty] = lazyRoute[lazyRouteProperty];\n }\n }\n // Mutate the route with the provided updates. Do this first so we pass\n // the updated version to mapRouteProperties\n Object.assign(routeToUpdate, routeUpdates);\n // Mutate the `hasErrorBoundary` property on the route based on the route\n // updates and remove the `lazy` function so we don't resolve the lazy\n // route again.\n Object.assign(routeToUpdate, _extends({}, mapRouteProperties(routeToUpdate), {\n lazy: undefined\n }));\n}\n// Default implementation of `dataStrategy` which fetches all loaders in parallel\nfunction defaultDataStrategy(opts) {\n return Promise.all(opts.matches.map(m => m.resolve()));\n}\nasync function callDataStrategyImpl(dataStrategyImpl, type, request, matchesToLoad, matches, manifest, mapRouteProperties, requestContext) {\n let routeIdsToLoad = matchesToLoad.reduce((acc, m) => acc.add(m.route.id), new Set());\n let loadedMatches = new Set();\n // Send all matches here to allow for a middleware-type implementation.\n // handler will be a no-op for unneeded routes and we filter those results\n // back out below.\n let results = await dataStrategyImpl({\n matches: matches.map(match => {\n let shouldLoad = routeIdsToLoad.has(match.route.id);\n // `resolve` encapsulates the route.lazy, executing the\n // loader/action, and mapping return values/thrown errors to a\n // HandlerResult. Users can pass a callback to take fine-grained control\n // over the execution of the loader/action\n let resolve = handlerOverride => {\n loadedMatches.add(match.route.id);\n return shouldLoad ? callLoaderOrAction(type, request, match, manifest, mapRouteProperties, handlerOverride, requestContext) : Promise.resolve({\n type: ResultType.data,\n result: undefined\n });\n };\n return _extends({}, match, {\n shouldLoad,\n resolve\n });\n }),\n request,\n params: matches[0].params,\n context: requestContext\n });\n // Throw if any loadRoute implementations not called since they are what\n // ensures a route is fully loaded\n matches.forEach(m => invariant(loadedMatches.has(m.route.id), \"`match.resolve()` was not called for route id \\\"\" + m.route.id + \"\\\". \" + \"You must call `match.resolve()` on every match passed to \" + \"`dataStrategy` to ensure all routes are properly loaded.\"));\n // Filter out any middleware-only matches for which we didn't need to run handlers\n return results.filter((_, i) => routeIdsToLoad.has(matches[i].route.id));\n}\n// Default logic for calling a loader/action is the user has no specified a dataStrategy\nasync function callLoaderOrAction(type, request, match, manifest, mapRouteProperties, handlerOverride, staticContext) {\n let result;\n let onReject;\n let runHandler = handler => {\n // Setup a promise we can race against so that abort signals short circuit\n let reject;\n // This will never resolve so safe to type it as Promise to\n // satisfy the function return value\n let abortPromise = new Promise((_, r) => reject = r);\n onReject = () => reject();\n request.signal.addEventListener(\"abort\", onReject);\n let actualHandler = ctx => {\n if (typeof handler !== \"function\") {\n return Promise.reject(new Error(\"You cannot call the handler for a route which defines a boolean \" + (\"\\\"\" + type + \"\\\" [routeId: \" + match.route.id + \"]\")));\n }\n return handler({\n request,\n params: match.params,\n context: staticContext\n }, ...(ctx !== undefined ? [ctx] : []));\n };\n let handlerPromise;\n if (handlerOverride) {\n handlerPromise = handlerOverride(ctx => actualHandler(ctx));\n } else {\n handlerPromise = (async () => {\n try {\n let val = await actualHandler();\n return {\n type: \"data\",\n result: val\n };\n } catch (e) {\n return {\n type: \"error\",\n result: e\n };\n }\n })();\n }\n return Promise.race([handlerPromise, abortPromise]);\n };\n try {\n let handler = match.route[type];\n if (match.route.lazy) {\n if (handler) {\n // Run statically defined handler in parallel with lazy()\n let handlerError;\n let [value] = await Promise.all([\n // If the handler throws, don't let it immediately bubble out,\n // since we need to let the lazy() execution finish so we know if this\n // route has a boundary that can handle the error\n runHandler(handler).catch(e => {\n handlerError = e;\n }), loadLazyRouteModule(match.route, mapRouteProperties, manifest)]);\n if (handlerError !== undefined) {\n throw handlerError;\n }\n result = value;\n } else {\n // Load lazy route module, then run any returned handler\n await loadLazyRouteModule(match.route, mapRouteProperties, manifest);\n handler = match.route[type];\n if (handler) {\n // Handler still runs even if we got interrupted to maintain consistency\n // with un-abortable behavior of handler execution on non-lazy or\n // previously-lazy-loaded routes\n result = await runHandler(handler);\n } else if (type === \"action\") {\n let url = new URL(request.url);\n let pathname = url.pathname + url.search;\n throw getInternalRouterError(405, {\n method: request.method,\n pathname,\n routeId: match.route.id\n });\n } else {\n // lazy() route has no loader to run. Short circuit here so we don't\n // hit the invariant below that errors on returning undefined.\n return {\n type: ResultType.data,\n result: undefined\n };\n }\n }\n } else if (!handler) {\n let url = new URL(request.url);\n let pathname = url.pathname + url.search;\n throw getInternalRouterError(404, {\n pathname\n });\n } else {\n result = await runHandler(handler);\n }\n invariant(result.result !== undefined, \"You defined \" + (type === \"action\" ? \"an action\" : \"a loader\") + \" for route \" + (\"\\\"\" + match.route.id + \"\\\" but didn't return anything from your `\" + type + \"` \") + \"function. Please return a value or `null`.\");\n } catch (e) {\n // We should already be catching and converting normal handler executions to\n // HandlerResults and returning them, so anything that throws here is an\n // unexpected error we still need to wrap\n return {\n type: ResultType.error,\n result: e\n };\n } finally {\n if (onReject) {\n request.signal.removeEventListener(\"abort\", onReject);\n }\n }\n return result;\n}\nasync function convertHandlerResultToDataResult(handlerResult) {\n let {\n result,\n type,\n status\n } = handlerResult;\n if (isResponse(result)) {\n let data;\n try {\n let contentType = result.headers.get(\"Content-Type\");\n // Check between word boundaries instead of startsWith() due to the last\n // paragraph of https://httpwg.org/specs/rfc9110.html#field.content-type\n if (contentType && /\\bapplication\\/json\\b/.test(contentType)) {\n if (result.body == null) {\n data = null;\n } else {\n data = await result.json();\n }\n } else {\n data = await result.text();\n }\n } catch (e) {\n return {\n type: ResultType.error,\n error: e\n };\n }\n if (type === ResultType.error) {\n return {\n type: ResultType.error,\n error: new ErrorResponseImpl(result.status, result.statusText, data),\n statusCode: result.status,\n headers: result.headers\n };\n }\n return {\n type: ResultType.data,\n data,\n statusCode: result.status,\n headers: result.headers\n };\n }\n if (type === ResultType.error) {\n return {\n type: ResultType.error,\n error: result,\n statusCode: isRouteErrorResponse(result) ? result.status : status\n };\n }\n if (isDeferredData(result)) {\n var _result$init, _result$init2;\n return {\n type: ResultType.deferred,\n deferredData: result,\n statusCode: (_result$init = result.init) == null ? void 0 : _result$init.status,\n headers: ((_result$init2 = result.init) == null ? void 0 : _result$init2.headers) && new Headers(result.init.headers)\n };\n }\n return {\n type: ResultType.data,\n data: result,\n statusCode: status\n };\n}\n// Support relative routing in internal redirects\nfunction normalizeRelativeRoutingRedirectResponse(response, request, routeId, matches, basename, v7_relativeSplatPath) {\n let location = response.headers.get(\"Location\");\n invariant(location, \"Redirects returned/thrown from loaders/actions must have a Location header\");\n if (!ABSOLUTE_URL_REGEX.test(location)) {\n let trimmedMatches = matches.slice(0, matches.findIndex(m => m.route.id === routeId) + 1);\n location = normalizeTo(new URL(request.url), trimmedMatches, basename, true, location, v7_relativeSplatPath);\n response.headers.set(\"Location\", location);\n }\n return response;\n}\nfunction normalizeRedirectLocation(location, currentUrl, basename) {\n if (ABSOLUTE_URL_REGEX.test(location)) {\n // Strip off the protocol+origin for same-origin + same-basename absolute redirects\n let normalizedLocation = location;\n let url = normalizedLocation.startsWith(\"//\") ? new URL(currentUrl.protocol + normalizedLocation) : new URL(normalizedLocation);\n let isSameBasename = stripBasename(url.pathname, basename) != null;\n if (url.origin === currentUrl.origin && isSameBasename) {\n return url.pathname + url.search + url.hash;\n }\n }\n return location;\n}\n// Utility method for creating the Request instances for loaders/actions during\n// client-side navigations and fetches. During SSR we will always have a\n// Request instance from the static handler (query/queryRoute)\nfunction createClientSideRequest(history, location, signal, submission) {\n let url = history.createURL(stripHashFromPath(location)).toString();\n let init = {\n signal\n };\n if (submission && isMutationMethod(submission.formMethod)) {\n let {\n formMethod,\n formEncType\n } = submission;\n // Didn't think we needed this but it turns out unlike other methods, patch\n // won't be properly normalized to uppercase and results in a 405 error.\n // See: https://fetch.spec.whatwg.org/#concept-method\n init.method = formMethod.toUpperCase();\n if (formEncType === \"application/json\") {\n init.headers = new Headers({\n \"Content-Type\": formEncType\n });\n init.body = JSON.stringify(submission.json);\n } else if (formEncType === \"text/plain\") {\n // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request)\n init.body = submission.text;\n } else if (formEncType === \"application/x-www-form-urlencoded\" && submission.formData) {\n // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request)\n init.body = convertFormDataToSearchParams(submission.formData);\n } else {\n // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request)\n init.body = submission.formData;\n }\n }\n return new Request(url, init);\n}\nfunction convertFormDataToSearchParams(formData) {\n let searchParams = new URLSearchParams();\n for (let [key, value] of formData.entries()) {\n // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#converting-an-entry-list-to-a-list-of-name-value-pairs\n searchParams.append(key, typeof value === \"string\" ? value : value.name);\n }\n return searchParams;\n}\nfunction convertSearchParamsToFormData(searchParams) {\n let formData = new FormData();\n for (let [key, value] of searchParams.entries()) {\n formData.append(key, value);\n }\n return formData;\n}\nfunction processRouteLoaderData(matches, matchesToLoad, results, pendingActionResult, activeDeferreds, skipLoaderErrorBubbling) {\n // Fill in loaderData/errors from our loaders\n let loaderData = {};\n let errors = null;\n let statusCode;\n let foundError = false;\n let loaderHeaders = {};\n let pendingError = pendingActionResult && isErrorResult(pendingActionResult[1]) ? pendingActionResult[1].error : undefined;\n // Process loader results into state.loaderData/state.errors\n results.forEach((result, index) => {\n let id = matchesToLoad[index].route.id;\n invariant(!isRedirectResult(result), \"Cannot handle redirect results in processLoaderData\");\n if (isErrorResult(result)) {\n let error = result.error;\n // If we have a pending action error, we report it at the highest-route\n // that throws a loader error, and then clear it out to indicate that\n // it was consumed\n if (pendingError !== undefined) {\n error = pendingError;\n pendingError = undefined;\n }\n errors = errors || {};\n if (skipLoaderErrorBubbling) {\n errors[id] = error;\n } else {\n // Look upwards from the matched route for the closest ancestor error\n // boundary, defaulting to the root match. Prefer higher error values\n // if lower errors bubble to the same boundary\n let boundaryMatch = findNearestBoundary(matches, id);\n if (errors[boundaryMatch.route.id] == null) {\n errors[boundaryMatch.route.id] = error;\n }\n }\n // Clear our any prior loaderData for the throwing route\n loaderData[id] = undefined;\n // Once we find our first (highest) error, we set the status code and\n // prevent deeper status codes from overriding\n if (!foundError) {\n foundError = true;\n statusCode = isRouteErrorResponse(result.error) ? result.error.status : 500;\n }\n if (result.headers) {\n loaderHeaders[id] = result.headers;\n }\n } else {\n if (isDeferredResult(result)) {\n activeDeferreds.set(id, result.deferredData);\n loaderData[id] = result.deferredData.data;\n // Error status codes always override success status codes, but if all\n // loaders are successful we take the deepest status code.\n if (result.statusCode != null && result.statusCode !== 200 && !foundError) {\n statusCode = result.statusCode;\n }\n if (result.headers) {\n loaderHeaders[id] = result.headers;\n }\n } else {\n loaderData[id] = result.data;\n // Error status codes always override success status codes, but if all\n // loaders are successful we take the deepest status code.\n if (result.statusCode && result.statusCode !== 200 && !foundError) {\n statusCode = result.statusCode;\n }\n if (result.headers) {\n loaderHeaders[id] = result.headers;\n }\n }\n }\n });\n // If we didn't consume the pending action error (i.e., all loaders\n // resolved), then consume it here. Also clear out any loaderData for the\n // throwing route\n if (pendingError !== undefined && pendingActionResult) {\n errors = {\n [pendingActionResult[0]]: pendingError\n };\n loaderData[pendingActionResult[0]] = undefined;\n }\n return {\n loaderData,\n errors,\n statusCode: statusCode || 200,\n loaderHeaders\n };\n}\nfunction processLoaderData(state, matches, matchesToLoad, results, pendingActionResult, revalidatingFetchers, fetcherResults, activeDeferreds) {\n let {\n loaderData,\n errors\n } = processRouteLoaderData(matches, matchesToLoad, results, pendingActionResult, activeDeferreds, false // This method is only called client side so we always want to bubble\n );\n // Process results from our revalidating fetchers\n for (let index = 0; index < revalidatingFetchers.length; index++) {\n let {\n key,\n match,\n controller\n } = revalidatingFetchers[index];\n invariant(fetcherResults !== undefined && fetcherResults[index] !== undefined, \"Did not find corresponding fetcher result\");\n let result = fetcherResults[index];\n // Process fetcher non-redirect errors\n if (controller && controller.signal.aborted) {\n // Nothing to do for aborted fetchers\n continue;\n } else if (isErrorResult(result)) {\n let boundaryMatch = findNearestBoundary(state.matches, match == null ? void 0 : match.route.id);\n if (!(errors && errors[boundaryMatch.route.id])) {\n errors = _extends({}, errors, {\n [boundaryMatch.route.id]: result.error\n });\n }\n state.fetchers.delete(key);\n } else if (isRedirectResult(result)) {\n // Should never get here, redirects should get processed above, but we\n // keep this to type narrow to a success result in the else\n invariant(false, \"Unhandled fetcher revalidation redirect\");\n } else if (isDeferredResult(result)) {\n // Should never get here, deferred data should be awaited for fetchers\n // in resolveDeferredResults\n invariant(false, \"Unhandled fetcher deferred data\");\n } else {\n let doneFetcher = getDoneFetcher(result.data);\n state.fetchers.set(key, doneFetcher);\n }\n }\n return {\n loaderData,\n errors\n };\n}\nfunction mergeLoaderData(loaderData, newLoaderData, matches, errors) {\n let mergedLoaderData = _extends({}, newLoaderData);\n for (let match of matches) {\n let id = match.route.id;\n if (newLoaderData.hasOwnProperty(id)) {\n if (newLoaderData[id] !== undefined) {\n mergedLoaderData[id] = newLoaderData[id];\n }\n } else if (loaderData[id] !== undefined && match.route.loader) {\n // Preserve existing keys not included in newLoaderData and where a loader\n // wasn't removed by HMR\n mergedLoaderData[id] = loaderData[id];\n }\n if (errors && errors.hasOwnProperty(id)) {\n // Don't keep any loader data below the boundary\n break;\n }\n }\n return mergedLoaderData;\n}\nfunction getActionDataForCommit(pendingActionResult) {\n if (!pendingActionResult) {\n return {};\n }\n return isErrorResult(pendingActionResult[1]) ? {\n // Clear out prior actionData on errors\n actionData: {}\n } : {\n actionData: {\n [pendingActionResult[0]]: pendingActionResult[1].data\n }\n };\n}\n// Find the nearest error boundary, looking upwards from the leaf route (or the\n// route specified by routeId) for the closest ancestor error boundary,\n// defaulting to the root match\nfunction findNearestBoundary(matches, routeId) {\n let eligibleMatches = routeId ? matches.slice(0, matches.findIndex(m => m.route.id === routeId) + 1) : [...matches];\n return eligibleMatches.reverse().find(m => m.route.hasErrorBoundary === true) || matches[0];\n}\nfunction getShortCircuitMatches(routes) {\n // Prefer a root layout route if present, otherwise shim in a route object\n let route = routes.length === 1 ? routes[0] : routes.find(r => r.index || !r.path || r.path === \"/\") || {\n id: \"__shim-error-route__\"\n };\n return {\n matches: [{\n params: {},\n pathname: \"\",\n pathnameBase: \"\",\n route\n }],\n route\n };\n}\nfunction getInternalRouterError(status, _temp5) {\n let {\n pathname,\n routeId,\n method,\n type\n } = _temp5 === void 0 ? {} : _temp5;\n let statusText = \"Unknown Server Error\";\n let errorMessage = \"Unknown @remix-run/router error\";\n if (status === 400) {\n statusText = \"Bad Request\";\n if (method && pathname && routeId) {\n errorMessage = \"You made a \" + method + \" request to \\\"\" + pathname + \"\\\" but \" + (\"did not provide a `loader` for route \\\"\" + routeId + \"\\\", \") + \"so there is no way to handle the request.\";\n } else if (type === \"defer-action\") {\n errorMessage = \"defer() is not supported in actions\";\n } else if (type === \"invalid-body\") {\n errorMessage = \"Unable to encode submission body\";\n }\n } else if (status === 403) {\n statusText = \"Forbidden\";\n errorMessage = \"Route \\\"\" + routeId + \"\\\" does not match URL \\\"\" + pathname + \"\\\"\";\n } else if (status === 404) {\n statusText = \"Not Found\";\n errorMessage = \"No route matches URL \\\"\" + pathname + \"\\\"\";\n } else if (status === 405) {\n statusText = \"Method Not Allowed\";\n if (method && pathname && routeId) {\n errorMessage = \"You made a \" + method.toUpperCase() + \" request to \\\"\" + pathname + \"\\\" but \" + (\"did not provide an `action` for route \\\"\" + routeId + \"\\\", \") + \"so there is no way to handle the request.\";\n } else if (method) {\n errorMessage = \"Invalid request method \\\"\" + method.toUpperCase() + \"\\\"\";\n }\n }\n return new ErrorResponseImpl(status || 500, statusText, new Error(errorMessage), true);\n}\n// Find any returned redirect errors, starting from the lowest match\nfunction findRedirect(results) {\n for (let i = results.length - 1; i >= 0; i--) {\n let result = results[i];\n if (isRedirectResult(result)) {\n return {\n result,\n idx: i\n };\n }\n }\n}\nfunction stripHashFromPath(path) {\n let parsedPath = typeof path === \"string\" ? parsePath(path) : path;\n return createPath(_extends({}, parsedPath, {\n hash: \"\"\n }));\n}\nfunction isHashChangeOnly(a, b) {\n if (a.pathname !== b.pathname || a.search !== b.search) {\n return false;\n }\n if (a.hash === \"\") {\n // /page -> /page#hash\n return b.hash !== \"\";\n } else if (a.hash === b.hash) {\n // /page#hash -> /page#hash\n return true;\n } else if (b.hash !== \"\") {\n // /page#hash -> /page#other\n return true;\n }\n // If the hash is removed the browser will re-perform a request to the server\n // /page#hash -> /page\n return false;\n}\nfunction isHandlerResult(result) {\n return result != null && typeof result === \"object\" && \"type\" in result && \"result\" in result && (result.type === ResultType.data || result.type === ResultType.error);\n}\nfunction isRedirectHandlerResult(result) {\n return isResponse(result.result) && redirectStatusCodes.has(result.result.status);\n}\nfunction isDeferredResult(result) {\n return result.type === ResultType.deferred;\n}\nfunction isErrorResult(result) {\n return result.type === ResultType.error;\n}\nfunction isRedirectResult(result) {\n return (result && result.type) === ResultType.redirect;\n}\nfunction isDeferredData(value) {\n let deferred = value;\n return deferred && typeof deferred === \"object\" && typeof deferred.data === \"object\" && typeof deferred.subscribe === \"function\" && typeof deferred.cancel === \"function\" && typeof deferred.resolveData === \"function\";\n}\nfunction isResponse(value) {\n return value != null && typeof value.status === \"number\" && typeof value.statusText === \"string\" && typeof value.headers === \"object\" && typeof value.body !== \"undefined\";\n}\nfunction isRedirectResponse(result) {\n if (!isResponse(result)) {\n return false;\n }\n let status = result.status;\n let location = result.headers.get(\"Location\");\n return status >= 300 && status <= 399 && location != null;\n}\nfunction isValidMethod(method) {\n return validRequestMethods.has(method.toLowerCase());\n}\nfunction isMutationMethod(method) {\n return validMutationMethods.has(method.toLowerCase());\n}\nasync function resolveDeferredResults(currentMatches, matchesToLoad, results, signals, isFetcher, currentLoaderData) {\n for (let index = 0; index < results.length; index++) {\n let result = results[index];\n let match = matchesToLoad[index];\n // If we don't have a match, then we can have a deferred result to do\n // anything with. This is for revalidating fetchers where the route was\n // removed during HMR\n if (!match) {\n continue;\n }\n let currentMatch = currentMatches.find(m => m.route.id === match.route.id);\n let isRevalidatingLoader = currentMatch != null && !isNewRouteInstance(currentMatch, match) && (currentLoaderData && currentLoaderData[match.route.id]) !== undefined;\n if (isDeferredResult(result) && (isFetcher || isRevalidatingLoader)) {\n // Note: we do not have to touch activeDeferreds here since we race them\n // against the signal in resolveDeferredData and they'll get aborted\n // there if needed\n let signal = signals[index];\n invariant(signal, \"Expected an AbortSignal for revalidating fetcher deferred result\");\n await resolveDeferredData(result, signal, isFetcher).then(result => {\n if (result) {\n results[index] = result || results[index];\n }\n });\n }\n }\n}\nasync function resolveDeferredData(result, signal, unwrap) {\n if (unwrap === void 0) {\n unwrap = false;\n }\n let aborted = await result.deferredData.resolveData(signal);\n if (aborted) {\n return;\n }\n if (unwrap) {\n try {\n return {\n type: ResultType.data,\n data: result.deferredData.unwrappedData\n };\n } catch (e) {\n // Handle any TrackedPromise._error values encountered while unwrapping\n return {\n type: ResultType.error,\n error: e\n };\n }\n }\n return {\n type: ResultType.data,\n data: result.deferredData.data\n };\n}\nfunction hasNakedIndexQuery(search) {\n return new URLSearchParams(search).getAll(\"index\").some(v => v === \"\");\n}\nfunction getTargetMatch(matches, location) {\n let search = typeof location === \"string\" ? parsePath(location).search : location.search;\n if (matches[matches.length - 1].route.index && hasNakedIndexQuery(search || \"\")) {\n // Return the leaf index route when index is present\n return matches[matches.length - 1];\n }\n // Otherwise grab the deepest \"path contributing\" match (ignoring index and\n // pathless layout routes)\n let pathMatches = getPathContributingMatches(matches);\n return pathMatches[pathMatches.length - 1];\n}\nfunction getSubmissionFromNavigation(navigation) {\n let {\n formMethod,\n formAction,\n formEncType,\n text,\n formData,\n json\n } = navigation;\n if (!formMethod || !formAction || !formEncType) {\n return;\n }\n if (text != null) {\n return {\n formMethod,\n formAction,\n formEncType,\n formData: undefined,\n json: undefined,\n text\n };\n } else if (formData != null) {\n return {\n formMethod,\n formAction,\n formEncType,\n formData,\n json: undefined,\n text: undefined\n };\n } else if (json !== undefined) {\n return {\n formMethod,\n formAction,\n formEncType,\n formData: undefined,\n json,\n text: undefined\n };\n }\n}\nfunction getLoadingNavigation(location, submission) {\n if (submission) {\n let navigation = {\n state: \"loading\",\n location,\n formMethod: submission.formMethod,\n formAction: submission.formAction,\n formEncType: submission.formEncType,\n formData: submission.formData,\n json: submission.json,\n text: submission.text\n };\n return navigation;\n } else {\n let navigation = {\n state: \"loading\",\n location,\n formMethod: undefined,\n formAction: undefined,\n formEncType: undefined,\n formData: undefined,\n json: undefined,\n text: undefined\n };\n return navigation;\n }\n}\nfunction getSubmittingNavigation(location, submission) {\n let navigation = {\n state: \"submitting\",\n location,\n formMethod: submission.formMethod,\n formAction: submission.formAction,\n formEncType: submission.formEncType,\n formData: submission.formData,\n json: submission.json,\n text: submission.text\n };\n return navigation;\n}\nfunction getLoadingFetcher(submission, data) {\n if (submission) {\n let fetcher = {\n state: \"loading\",\n formMethod: submission.formMethod,\n formAction: submission.formAction,\n formEncType: submission.formEncType,\n formData: submission.formData,\n json: submission.json,\n text: submission.text,\n data\n };\n return fetcher;\n } else {\n let fetcher = {\n state: \"loading\",\n formMethod: undefined,\n formAction: undefined,\n formEncType: undefined,\n formData: undefined,\n json: undefined,\n text: undefined,\n data\n };\n return fetcher;\n }\n}\nfunction getSubmittingFetcher(submission, existingFetcher) {\n let fetcher = {\n state: \"submitting\",\n formMethod: submission.formMethod,\n formAction: submission.formAction,\n formEncType: submission.formEncType,\n formData: submission.formData,\n json: submission.json,\n text: submission.text,\n data: existingFetcher ? existingFetcher.data : undefined\n };\n return fetcher;\n}\nfunction getDoneFetcher(data) {\n let fetcher = {\n state: \"idle\",\n formMethod: undefined,\n formAction: undefined,\n formEncType: undefined,\n formData: undefined,\n json: undefined,\n text: undefined,\n data\n };\n return fetcher;\n}\nfunction restoreAppliedTransitions(_window, transitions) {\n try {\n let sessionPositions = _window.sessionStorage.getItem(TRANSITIONS_STORAGE_KEY);\n if (sessionPositions) {\n let json = JSON.parse(sessionPositions);\n for (let [k, v] of Object.entries(json || {})) {\n if (v && Array.isArray(v)) {\n transitions.set(k, new Set(v || []));\n }\n }\n }\n } catch (e) {\n // no-op, use default empty object\n }\n}\nfunction persistAppliedTransitions(_window, transitions) {\n if (transitions.size > 0) {\n let json = {};\n for (let [k, v] of transitions) {\n json[k] = [...v];\n }\n try {\n _window.sessionStorage.setItem(TRANSITIONS_STORAGE_KEY, JSON.stringify(json));\n } catch (error) {\n warning(false, \"Failed to save applied view transitions in sessionStorage (\" + error + \").\");\n }\n }\n}\n//#endregion\n\nexport { AbortedDeferredError, Action, IDLE_BLOCKER, IDLE_FETCHER, IDLE_NAVIGATION, UNSAFE_DEFERRED_SYMBOL, DeferredData as UNSAFE_DeferredData, ErrorResponseImpl as UNSAFE_ErrorResponseImpl, convertRouteMatchToUiMatch as UNSAFE_convertRouteMatchToUiMatch, convertRoutesToDataRoutes as UNSAFE_convertRoutesToDataRoutes, getResolveToMatches as UNSAFE_getResolveToMatches, invariant as UNSAFE_invariant, warning as UNSAFE_warning, createBrowserHistory, createHashHistory, createMemoryHistory, createPath, createRouter, createStaticHandler, defer, generatePath, getStaticContextFromError, getToPathname, isDeferredData, isRouteErrorResponse, joinPaths, json, matchPath, matchRoutes, normalizePathname, parsePath, redirect, redirectDocument, resolvePath, resolveTo, stripBasename };\n//# sourceMappingURL=router.js.map\n","/**\n * React Router v6.23.1\n *\n * Copyright (c) Remix Software Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE.md file in the root directory of this source tree.\n *\n * @license MIT\n */\nimport * as React from 'react';\nimport { UNSAFE_invariant, joinPaths, matchPath, UNSAFE_getResolveToMatches, UNSAFE_warning, resolveTo, parsePath, matchRoutes, Action, UNSAFE_convertRouteMatchToUiMatch, stripBasename, IDLE_BLOCKER, isRouteErrorResponse, createMemoryHistory, AbortedDeferredError, createRouter } from '@remix-run/router';\nexport { AbortedDeferredError, Action as NavigationType, createPath, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, resolvePath } from '@remix-run/router';\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\n// Create react-specific types from the agnostic types in @remix-run/router to\n// export from react-router\nconst DataRouterContext = /*#__PURE__*/React.createContext(null);\nif (process.env.NODE_ENV !== \"production\") {\n DataRouterContext.displayName = \"DataRouter\";\n}\nconst DataRouterStateContext = /*#__PURE__*/React.createContext(null);\nif (process.env.NODE_ENV !== \"production\") {\n DataRouterStateContext.displayName = \"DataRouterState\";\n}\nconst AwaitContext = /*#__PURE__*/React.createContext(null);\nif (process.env.NODE_ENV !== \"production\") {\n AwaitContext.displayName = \"Await\";\n}\n\n/**\n * A Navigator is a \"location changer\"; it's how you get to different locations.\n *\n * Every history instance conforms to the Navigator interface, but the\n * distinction is useful primarily when it comes to the low-level `` API\n * where both the location and a navigator must be provided separately in order\n * to avoid \"tearing\" that may occur in a suspense-enabled app if the action\n * and/or location were to be read directly from the history instance.\n */\n\nconst NavigationContext = /*#__PURE__*/React.createContext(null);\nif (process.env.NODE_ENV !== \"production\") {\n NavigationContext.displayName = \"Navigation\";\n}\nconst LocationContext = /*#__PURE__*/React.createContext(null);\nif (process.env.NODE_ENV !== \"production\") {\n LocationContext.displayName = \"Location\";\n}\nconst RouteContext = /*#__PURE__*/React.createContext({\n outlet: null,\n matches: [],\n isDataRoute: false\n});\nif (process.env.NODE_ENV !== \"production\") {\n RouteContext.displayName = \"Route\";\n}\nconst RouteErrorContext = /*#__PURE__*/React.createContext(null);\nif (process.env.NODE_ENV !== \"production\") {\n RouteErrorContext.displayName = \"RouteError\";\n}\n\n/**\n * Returns the full href for the given \"to\" value. This is useful for building\n * custom links that are also accessible and preserve right-click behavior.\n *\n * @see https://reactrouter.com/hooks/use-href\n */\nfunction useHref(to, _temp) {\n let {\n relative\n } = _temp === void 0 ? {} : _temp;\n !useInRouterContext() ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the\n // router loaded. We can help them understand how to avoid that.\n \"useHref() may be used only in the context of a component.\") : UNSAFE_invariant(false) : void 0;\n let {\n basename,\n navigator\n } = React.useContext(NavigationContext);\n let {\n hash,\n pathname,\n search\n } = useResolvedPath(to, {\n relative\n });\n let joinedPathname = pathname;\n\n // If we're operating within a basename, prepend it to the pathname prior\n // to creating the href. If this is a root navigation, then just use the raw\n // basename which allows the basename to have full control over the presence\n // of a trailing slash on root links\n if (basename !== \"/\") {\n joinedPathname = pathname === \"/\" ? basename : joinPaths([basename, pathname]);\n }\n return navigator.createHref({\n pathname: joinedPathname,\n search,\n hash\n });\n}\n\n/**\n * Returns true if this component is a descendant of a ``.\n *\n * @see https://reactrouter.com/hooks/use-in-router-context\n */\nfunction useInRouterContext() {\n return React.useContext(LocationContext) != null;\n}\n\n/**\n * Returns the current location object, which represents the current URL in web\n * browsers.\n *\n * Note: If you're using this it may mean you're doing some of your own\n * \"routing\" in your app, and we'd like to know what your use case is. We may\n * be able to provide something higher-level to better suit your needs.\n *\n * @see https://reactrouter.com/hooks/use-location\n */\nfunction useLocation() {\n !useInRouterContext() ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the\n // router loaded. We can help them understand how to avoid that.\n \"useLocation() may be used only in the context of a component.\") : UNSAFE_invariant(false) : void 0;\n return React.useContext(LocationContext).location;\n}\n\n/**\n * Returns the current navigation action which describes how the router came to\n * the current location, either by a pop, push, or replace on the history stack.\n *\n * @see https://reactrouter.com/hooks/use-navigation-type\n */\nfunction useNavigationType() {\n return React.useContext(LocationContext).navigationType;\n}\n\n/**\n * Returns a PathMatch object if the given pattern matches the current URL.\n * This is useful for components that need to know \"active\" state, e.g.\n * ``.\n *\n * @see https://reactrouter.com/hooks/use-match\n */\nfunction useMatch(pattern) {\n !useInRouterContext() ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the\n // router loaded. We can help them understand how to avoid that.\n \"useMatch() may be used only in the context of a component.\") : UNSAFE_invariant(false) : void 0;\n let {\n pathname\n } = useLocation();\n return React.useMemo(() => matchPath(pattern, pathname), [pathname, pattern]);\n}\n\n/**\n * The interface for the navigate() function returned from useNavigate().\n */\n\nconst navigateEffectWarning = \"You should call navigate() in a React.useEffect(), not when \" + \"your component is first rendered.\";\n\n// Mute warnings for calls to useNavigate in SSR environments\nfunction useIsomorphicLayoutEffect(cb) {\n let isStatic = React.useContext(NavigationContext).static;\n if (!isStatic) {\n // We should be able to get rid of this once react 18.3 is released\n // See: https://github.com/facebook/react/pull/26395\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useLayoutEffect(cb);\n }\n}\n\n/**\n * Returns an imperative method for changing the location. Used by ``s, but\n * may also be used by other elements to change the location.\n *\n * @see https://reactrouter.com/hooks/use-navigate\n */\nfunction useNavigate() {\n let {\n isDataRoute\n } = React.useContext(RouteContext);\n // Conditional usage is OK here because the usage of a data router is static\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return isDataRoute ? useNavigateStable() : useNavigateUnstable();\n}\nfunction useNavigateUnstable() {\n !useInRouterContext() ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the\n // router loaded. We can help them understand how to avoid that.\n \"useNavigate() may be used only in the context of a component.\") : UNSAFE_invariant(false) : void 0;\n let dataRouterContext = React.useContext(DataRouterContext);\n let {\n basename,\n future,\n navigator\n } = React.useContext(NavigationContext);\n let {\n matches\n } = React.useContext(RouteContext);\n let {\n pathname: locationPathname\n } = useLocation();\n let routePathnamesJson = JSON.stringify(UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath));\n let activeRef = React.useRef(false);\n useIsomorphicLayoutEffect(() => {\n activeRef.current = true;\n });\n let navigate = React.useCallback(function (to, options) {\n if (options === void 0) {\n options = {};\n }\n process.env.NODE_ENV !== \"production\" ? UNSAFE_warning(activeRef.current, navigateEffectWarning) : void 0;\n\n // Short circuit here since if this happens on first render the navigate\n // is useless because we haven't wired up our history listener yet\n if (!activeRef.current) return;\n if (typeof to === \"number\") {\n navigator.go(to);\n return;\n }\n let path = resolveTo(to, JSON.parse(routePathnamesJson), locationPathname, options.relative === \"path\");\n\n // If we're operating within a basename, prepend it to the pathname prior\n // to handing off to history (but only if we're not in a data router,\n // otherwise it'll prepend the basename inside of the router).\n // If this is a root navigation, then we navigate to the raw basename\n // which allows the basename to have full control over the presence of a\n // trailing slash on root links\n if (dataRouterContext == null && basename !== \"/\") {\n path.pathname = path.pathname === \"/\" ? basename : joinPaths([basename, path.pathname]);\n }\n (!!options.replace ? navigator.replace : navigator.push)(path, options.state, options);\n }, [basename, navigator, routePathnamesJson, locationPathname, dataRouterContext]);\n return navigate;\n}\nconst OutletContext = /*#__PURE__*/React.createContext(null);\n\n/**\n * Returns the context (if provided) for the child route at this level of the route\n * hierarchy.\n * @see https://reactrouter.com/hooks/use-outlet-context\n */\nfunction useOutletContext() {\n return React.useContext(OutletContext);\n}\n\n/**\n * Returns the element for the child route at this level of the route\n * hierarchy. Used internally by `` to render child routes.\n *\n * @see https://reactrouter.com/hooks/use-outlet\n */\nfunction useOutlet(context) {\n let outlet = React.useContext(RouteContext).outlet;\n if (outlet) {\n return /*#__PURE__*/React.createElement(OutletContext.Provider, {\n value: context\n }, outlet);\n }\n return outlet;\n}\n\n/**\n * Returns an object of key/value pairs of the dynamic params from the current\n * URL that were matched by the route path.\n *\n * @see https://reactrouter.com/hooks/use-params\n */\nfunction useParams() {\n let {\n matches\n } = React.useContext(RouteContext);\n let routeMatch = matches[matches.length - 1];\n return routeMatch ? routeMatch.params : {};\n}\n\n/**\n * Resolves the pathname of the given `to` value against the current location.\n *\n * @see https://reactrouter.com/hooks/use-resolved-path\n */\nfunction useResolvedPath(to, _temp2) {\n let {\n relative\n } = _temp2 === void 0 ? {} : _temp2;\n let {\n future\n } = React.useContext(NavigationContext);\n let {\n matches\n } = React.useContext(RouteContext);\n let {\n pathname: locationPathname\n } = useLocation();\n let routePathnamesJson = JSON.stringify(UNSAFE_getResolveToMatches(matches, future.v7_relativeSplatPath));\n return React.useMemo(() => resolveTo(to, JSON.parse(routePathnamesJson), locationPathname, relative === \"path\"), [to, routePathnamesJson, locationPathname, relative]);\n}\n\n/**\n * Returns the element of the route that matched the current location, prepared\n * with the correct context to render the remainder of the route tree. Route\n * elements in the tree must render an `` to render their child route's\n * element.\n *\n * @see https://reactrouter.com/hooks/use-routes\n */\nfunction useRoutes(routes, locationArg) {\n return useRoutesImpl(routes, locationArg);\n}\n\n// Internal implementation with accept optional param for RouterProvider usage\nfunction useRoutesImpl(routes, locationArg, dataRouterState, future) {\n !useInRouterContext() ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, // TODO: This error is probably because they somehow have 2 versions of the\n // router loaded. We can help them understand how to avoid that.\n \"useRoutes() may be used only in the context of a component.\") : UNSAFE_invariant(false) : void 0;\n let {\n navigator\n } = React.useContext(NavigationContext);\n let {\n matches: parentMatches\n } = React.useContext(RouteContext);\n let routeMatch = parentMatches[parentMatches.length - 1];\n let parentParams = routeMatch ? routeMatch.params : {};\n let parentPathname = routeMatch ? routeMatch.pathname : \"/\";\n let parentPathnameBase = routeMatch ? routeMatch.pathnameBase : \"/\";\n let parentRoute = routeMatch && routeMatch.route;\n if (process.env.NODE_ENV !== \"production\") {\n // You won't get a warning about 2 different under a \n // without a trailing *, but this is a best-effort warning anyway since we\n // cannot even give the warning unless they land at the parent route.\n //\n // Example:\n //\n // \n // {/* This route path MUST end with /* because otherwise\n // it will never match /blog/post/123 */}\n // } />\n // } />\n // \n //\n // function Blog() {\n // return (\n // \n // } />\n // \n // );\n // }\n let parentPath = parentRoute && parentRoute.path || \"\";\n warningOnce(parentPathname, !parentRoute || parentPath.endsWith(\"*\"), \"You rendered descendant (or called `useRoutes()`) at \" + (\"\\\"\" + parentPathname + \"\\\" (under ) but the \") + \"parent route path has no trailing \\\"*\\\". This means if you navigate \" + \"deeper, the parent won't match anymore and therefore the child \" + \"routes will never render.\\n\\n\" + (\"Please change the parent to .\"));\n }\n let locationFromContext = useLocation();\n let location;\n if (locationArg) {\n var _parsedLocationArg$pa;\n let parsedLocationArg = typeof locationArg === \"string\" ? parsePath(locationArg) : locationArg;\n !(parentPathnameBase === \"/\" || ((_parsedLocationArg$pa = parsedLocationArg.pathname) == null ? void 0 : _parsedLocationArg$pa.startsWith(parentPathnameBase))) ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, \"When overriding the location using `` or `useRoutes(routes, location)`, \" + \"the location pathname must begin with the portion of the URL pathname that was \" + (\"matched by all parent routes. The current pathname base is \\\"\" + parentPathnameBase + \"\\\" \") + (\"but pathname \\\"\" + parsedLocationArg.pathname + \"\\\" was given in the `location` prop.\")) : UNSAFE_invariant(false) : void 0;\n location = parsedLocationArg;\n } else {\n location = locationFromContext;\n }\n let pathname = location.pathname || \"/\";\n let remainingPathname = pathname;\n if (parentPathnameBase !== \"/\") {\n // Determine the remaining pathname by removing the # of URL segments the\n // parentPathnameBase has, instead of removing based on character count.\n // This is because we can't guarantee that incoming/outgoing encodings/\n // decodings will match exactly.\n // We decode paths before matching on a per-segment basis with\n // decodeURIComponent(), but we re-encode pathnames via `new URL()` so they\n // match what `window.location.pathname` would reflect. Those don't 100%\n // align when it comes to encoded URI characters such as % and &.\n //\n // So we may end up with:\n // pathname: \"/descendant/a%25b/match\"\n // parentPathnameBase: \"/descendant/a%b\"\n //\n // And the direct substring removal approach won't work :/\n let parentSegments = parentPathnameBase.replace(/^\\//, \"\").split(\"/\");\n let segments = pathname.replace(/^\\//, \"\").split(\"/\");\n remainingPathname = \"/\" + segments.slice(parentSegments.length).join(\"/\");\n }\n let matches = matchRoutes(routes, {\n pathname: remainingPathname\n });\n if (process.env.NODE_ENV !== \"production\") {\n process.env.NODE_ENV !== \"production\" ? UNSAFE_warning(parentRoute || matches != null, \"No routes matched location \\\"\" + location.pathname + location.search + location.hash + \"\\\" \") : void 0;\n process.env.NODE_ENV !== \"production\" ? UNSAFE_warning(matches == null || matches[matches.length - 1].route.element !== undefined || matches[matches.length - 1].route.Component !== undefined || matches[matches.length - 1].route.lazy !== undefined, \"Matched leaf route at location \\\"\" + location.pathname + location.search + location.hash + \"\\\" \" + \"does not have an element or Component. This means it will render an with a \" + \"null value by default resulting in an \\\"empty\\\" page.\") : void 0;\n }\n let renderedMatches = _renderMatches(matches && matches.map(match => Object.assign({}, match, {\n params: Object.assign({}, parentParams, match.params),\n pathname: joinPaths([parentPathnameBase,\n // Re-encode pathnames that were decoded inside matchRoutes\n navigator.encodeLocation ? navigator.encodeLocation(match.pathname).pathname : match.pathname]),\n pathnameBase: match.pathnameBase === \"/\" ? parentPathnameBase : joinPaths([parentPathnameBase,\n // Re-encode pathnames that were decoded inside matchRoutes\n navigator.encodeLocation ? navigator.encodeLocation(match.pathnameBase).pathname : match.pathnameBase])\n })), parentMatches, dataRouterState, future);\n\n // When a user passes in a `locationArg`, the associated routes need to\n // be wrapped in a new `LocationContext.Provider` in order for `useLocation`\n // to use the scoped location instead of the global location.\n if (locationArg && renderedMatches) {\n return /*#__PURE__*/React.createElement(LocationContext.Provider, {\n value: {\n location: _extends({\n pathname: \"/\",\n search: \"\",\n hash: \"\",\n state: null,\n key: \"default\"\n }, location),\n navigationType: Action.Pop\n }\n }, renderedMatches);\n }\n return renderedMatches;\n}\nfunction DefaultErrorComponent() {\n let error = useRouteError();\n let message = isRouteErrorResponse(error) ? error.status + \" \" + error.statusText : error instanceof Error ? error.message : JSON.stringify(error);\n let stack = error instanceof Error ? error.stack : null;\n let lightgrey = \"rgba(200,200,200, 0.5)\";\n let preStyles = {\n padding: \"0.5rem\",\n backgroundColor: lightgrey\n };\n let codeStyles = {\n padding: \"2px 4px\",\n backgroundColor: lightgrey\n };\n let devInfo = null;\n if (process.env.NODE_ENV !== \"production\") {\n console.error(\"Error handled by React Router default ErrorBoundary:\", error);\n devInfo = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"p\", null, \"\\uD83D\\uDCBF Hey developer \\uD83D\\uDC4B\"), /*#__PURE__*/React.createElement(\"p\", null, \"You can provide a way better UX than this when your app throws errors by providing your own \", /*#__PURE__*/React.createElement(\"code\", {\n style: codeStyles\n }, \"ErrorBoundary\"), \" or\", \" \", /*#__PURE__*/React.createElement(\"code\", {\n style: codeStyles\n }, \"errorElement\"), \" prop on your route.\"));\n }\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(\"h2\", null, \"Unexpected Application Error!\"), /*#__PURE__*/React.createElement(\"h3\", {\n style: {\n fontStyle: \"italic\"\n }\n }, message), stack ? /*#__PURE__*/React.createElement(\"pre\", {\n style: preStyles\n }, stack) : null, devInfo);\n}\nconst defaultErrorElement = /*#__PURE__*/React.createElement(DefaultErrorComponent, null);\nclass RenderErrorBoundary extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n location: props.location,\n revalidation: props.revalidation,\n error: props.error\n };\n }\n static getDerivedStateFromError(error) {\n return {\n error: error\n };\n }\n static getDerivedStateFromProps(props, state) {\n // When we get into an error state, the user will likely click \"back\" to the\n // previous page that didn't have an error. Because this wraps the entire\n // application, that will have no effect--the error page continues to display.\n // This gives us a mechanism to recover from the error when the location changes.\n //\n // Whether we're in an error state or not, we update the location in state\n // so that when we are in an error state, it gets reset when a new location\n // comes in and the user recovers from the error.\n if (state.location !== props.location || state.revalidation !== \"idle\" && props.revalidation === \"idle\") {\n return {\n error: props.error,\n location: props.location,\n revalidation: props.revalidation\n };\n }\n\n // If we're not changing locations, preserve the location but still surface\n // any new errors that may come through. We retain the existing error, we do\n // this because the error provided from the app state may be cleared without\n // the location changing.\n return {\n error: props.error !== undefined ? props.error : state.error,\n location: state.location,\n revalidation: props.revalidation || state.revalidation\n };\n }\n componentDidCatch(error, errorInfo) {\n console.error(\"React Router caught the following error during render\", error, errorInfo);\n }\n render() {\n return this.state.error !== undefined ? /*#__PURE__*/React.createElement(RouteContext.Provider, {\n value: this.props.routeContext\n }, /*#__PURE__*/React.createElement(RouteErrorContext.Provider, {\n value: this.state.error,\n children: this.props.component\n })) : this.props.children;\n }\n}\nfunction RenderedRoute(_ref) {\n let {\n routeContext,\n match,\n children\n } = _ref;\n let dataRouterContext = React.useContext(DataRouterContext);\n\n // Track how deep we got in our render pass to emulate SSR componentDidCatch\n // in a DataStaticRouter\n if (dataRouterContext && dataRouterContext.static && dataRouterContext.staticContext && (match.route.errorElement || match.route.ErrorBoundary)) {\n dataRouterContext.staticContext._deepestRenderedBoundaryId = match.route.id;\n }\n return /*#__PURE__*/React.createElement(RouteContext.Provider, {\n value: routeContext\n }, children);\n}\nfunction _renderMatches(matches, parentMatches, dataRouterState, future) {\n var _dataRouterState2;\n if (parentMatches === void 0) {\n parentMatches = [];\n }\n if (dataRouterState === void 0) {\n dataRouterState = null;\n }\n if (future === void 0) {\n future = null;\n }\n if (matches == null) {\n var _dataRouterState;\n if ((_dataRouterState = dataRouterState) != null && _dataRouterState.errors) {\n // Don't bail if we have data router errors so we can render them in the\n // boundary. Use the pre-matched (or shimmed) matches\n matches = dataRouterState.matches;\n } else {\n return null;\n }\n }\n let renderedMatches = matches;\n\n // If we have data errors, trim matches to the highest error boundary\n let errors = (_dataRouterState2 = dataRouterState) == null ? void 0 : _dataRouterState2.errors;\n if (errors != null) {\n let errorIndex = renderedMatches.findIndex(m => m.route.id && (errors == null ? void 0 : errors[m.route.id]) !== undefined);\n !(errorIndex >= 0) ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, \"Could not find a matching route for errors on route IDs: \" + Object.keys(errors).join(\",\")) : UNSAFE_invariant(false) : void 0;\n renderedMatches = renderedMatches.slice(0, Math.min(renderedMatches.length, errorIndex + 1));\n }\n\n // If we're in a partial hydration mode, detect if we need to render down to\n // a given HydrateFallback while we load the rest of the hydration data\n let renderFallback = false;\n let fallbackIndex = -1;\n if (dataRouterState && future && future.v7_partialHydration) {\n for (let i = 0; i < renderedMatches.length; i++) {\n let match = renderedMatches[i];\n // Track the deepest fallback up until the first route without data\n if (match.route.HydrateFallback || match.route.hydrateFallbackElement) {\n fallbackIndex = i;\n }\n if (match.route.id) {\n let {\n loaderData,\n errors\n } = dataRouterState;\n let needsToRunLoader = match.route.loader && loaderData[match.route.id] === undefined && (!errors || errors[match.route.id] === undefined);\n if (match.route.lazy || needsToRunLoader) {\n // We found the first route that's not ready to render (waiting on\n // lazy, or has a loader that hasn't run yet). Flag that we need to\n // render a fallback and render up until the appropriate fallback\n renderFallback = true;\n if (fallbackIndex >= 0) {\n renderedMatches = renderedMatches.slice(0, fallbackIndex + 1);\n } else {\n renderedMatches = [renderedMatches[0]];\n }\n break;\n }\n }\n }\n }\n return renderedMatches.reduceRight((outlet, match, index) => {\n // Only data routers handle errors/fallbacks\n let error;\n let shouldRenderHydrateFallback = false;\n let errorElement = null;\n let hydrateFallbackElement = null;\n if (dataRouterState) {\n error = errors && match.route.id ? errors[match.route.id] : undefined;\n errorElement = match.route.errorElement || defaultErrorElement;\n if (renderFallback) {\n if (fallbackIndex < 0 && index === 0) {\n warningOnce(\"route-fallback\", false, \"No `HydrateFallback` element provided to render during initial hydration\");\n shouldRenderHydrateFallback = true;\n hydrateFallbackElement = null;\n } else if (fallbackIndex === index) {\n shouldRenderHydrateFallback = true;\n hydrateFallbackElement = match.route.hydrateFallbackElement || null;\n }\n }\n }\n let matches = parentMatches.concat(renderedMatches.slice(0, index + 1));\n let getChildren = () => {\n let children;\n if (error) {\n children = errorElement;\n } else if (shouldRenderHydrateFallback) {\n children = hydrateFallbackElement;\n } else if (match.route.Component) {\n // Note: This is a de-optimized path since React won't re-use the\n // ReactElement since it's identity changes with each new\n // React.createElement call. We keep this so folks can use\n // `` in `` but generally `Component`\n // usage is only advised in `RouterProvider` when we can convert it to\n // `element` ahead of time.\n children = /*#__PURE__*/React.createElement(match.route.Component, null);\n } else if (match.route.element) {\n children = match.route.element;\n } else {\n children = outlet;\n }\n return /*#__PURE__*/React.createElement(RenderedRoute, {\n match: match,\n routeContext: {\n outlet,\n matches,\n isDataRoute: dataRouterState != null\n },\n children: children\n });\n };\n // Only wrap in an error boundary within data router usages when we have an\n // ErrorBoundary/errorElement on this route. Otherwise let it bubble up to\n // an ancestor ErrorBoundary/errorElement\n return dataRouterState && (match.route.ErrorBoundary || match.route.errorElement || index === 0) ? /*#__PURE__*/React.createElement(RenderErrorBoundary, {\n location: dataRouterState.location,\n revalidation: dataRouterState.revalidation,\n component: errorElement,\n error: error,\n children: getChildren(),\n routeContext: {\n outlet: null,\n matches,\n isDataRoute: true\n }\n }) : getChildren();\n }, null);\n}\nvar DataRouterHook = /*#__PURE__*/function (DataRouterHook) {\n DataRouterHook[\"UseBlocker\"] = \"useBlocker\";\n DataRouterHook[\"UseRevalidator\"] = \"useRevalidator\";\n DataRouterHook[\"UseNavigateStable\"] = \"useNavigate\";\n return DataRouterHook;\n}(DataRouterHook || {});\nvar DataRouterStateHook = /*#__PURE__*/function (DataRouterStateHook) {\n DataRouterStateHook[\"UseBlocker\"] = \"useBlocker\";\n DataRouterStateHook[\"UseLoaderData\"] = \"useLoaderData\";\n DataRouterStateHook[\"UseActionData\"] = \"useActionData\";\n DataRouterStateHook[\"UseRouteError\"] = \"useRouteError\";\n DataRouterStateHook[\"UseNavigation\"] = \"useNavigation\";\n DataRouterStateHook[\"UseRouteLoaderData\"] = \"useRouteLoaderData\";\n DataRouterStateHook[\"UseMatches\"] = \"useMatches\";\n DataRouterStateHook[\"UseRevalidator\"] = \"useRevalidator\";\n DataRouterStateHook[\"UseNavigateStable\"] = \"useNavigate\";\n DataRouterStateHook[\"UseRouteId\"] = \"useRouteId\";\n return DataRouterStateHook;\n}(DataRouterStateHook || {});\nfunction getDataRouterConsoleError(hookName) {\n return hookName + \" must be used within a data router. See https://reactrouter.com/routers/picking-a-router.\";\n}\nfunction useDataRouterContext(hookName) {\n let ctx = React.useContext(DataRouterContext);\n !ctx ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName)) : UNSAFE_invariant(false) : void 0;\n return ctx;\n}\nfunction useDataRouterState(hookName) {\n let state = React.useContext(DataRouterStateContext);\n !state ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName)) : UNSAFE_invariant(false) : void 0;\n return state;\n}\nfunction useRouteContext(hookName) {\n let route = React.useContext(RouteContext);\n !route ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, getDataRouterConsoleError(hookName)) : UNSAFE_invariant(false) : void 0;\n return route;\n}\n\n// Internal version with hookName-aware debugging\nfunction useCurrentRouteId(hookName) {\n let route = useRouteContext(hookName);\n let thisRoute = route.matches[route.matches.length - 1];\n !thisRoute.route.id ? process.env.NODE_ENV !== \"production\" ? UNSAFE_invariant(false, hookName + \" can only be used on routes that contain a unique \\\"id\\\"\") : UNSAFE_invariant(false) : void 0;\n return thisRoute.route.id;\n}\n\n/**\n * Returns the ID for the nearest contextual route\n */\nfunction useRouteId() {\n return useCurrentRouteId(DataRouterStateHook.UseRouteId);\n}\n\n/**\n * Returns the current navigation, defaulting to an \"idle\" navigation when\n * no navigation is in progress\n */\nfunction useNavigation() {\n let state = useDataRouterState(DataRouterStateHook.UseNavigation);\n return state.navigation;\n}\n\n/**\n * Returns a revalidate function for manually triggering revalidation, as well\n * as the current state of any manual revalidations\n */\nfunction useRevalidator() {\n let dataRouterContext = useDataRouterContext(DataRouterHook.UseRevalidator);\n let state = useDataRouterState(DataRouterStateHook.UseRevalidator);\n return React.useMemo(() => ({\n revalidate: dataRouterContext.router.revalidate,\n state: state.revalidation\n }), [dataRouterContext.router.revalidate, state.revalidation]);\n}\n\n/**\n * Returns the active route matches, useful for accessing loaderData for\n * parent/child routes or the route \"handle\" property\n */\nfunction useMatches() {\n let {\n matches,\n loaderData\n } = useDataRouterState(DataRouterStateHook.UseMatches);\n return React.useMemo(() => matches.map(m => UNSAFE_convertRouteMatchToUiMatch(m, loaderData)), [matches, loaderData]);\n}\n\n/**\n * Returns the loader data for the nearest ancestor Route loader\n */\nfunction useLoaderData() {\n let state = useDataRouterState(DataRouterStateHook.UseLoaderData);\n let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);\n if (state.errors && state.errors[routeId] != null) {\n console.error(\"You cannot `useLoaderData` in an errorElement (routeId: \" + routeId + \")\");\n return undefined;\n }\n return state.loaderData[routeId];\n}\n\n/**\n * Returns the loaderData for the given routeId\n */\nfunction useRouteLoaderData(routeId) {\n let state = useDataRouterState(DataRouterStateHook.UseRouteLoaderData);\n return state.loaderData[routeId];\n}\n\n/**\n * Returns the action data for the nearest ancestor Route action\n */\nfunction useActionData() {\n let state = useDataRouterState(DataRouterStateHook.UseActionData);\n let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData);\n return state.actionData ? state.actionData[routeId] : undefined;\n}\n\n/**\n * Returns the nearest ancestor Route error, which could be a loader/action\n * error or a render error. This is intended to be called from your\n * ErrorBoundary/errorElement to display a proper error message.\n */\nfunction useRouteError() {\n var _state$errors;\n let error = React.useContext(RouteErrorContext);\n let state = useDataRouterState(DataRouterStateHook.UseRouteError);\n let routeId = useCurrentRouteId(DataRouterStateHook.UseRouteError);\n\n // If this was a render error, we put it in a RouteError context inside\n // of RenderErrorBoundary\n if (error !== undefined) {\n return error;\n }\n\n // Otherwise look for errors from our data router state\n return (_state$errors = state.errors) == null ? void 0 : _state$errors[routeId];\n}\n\n/**\n * Returns the happy-path data from the nearest ancestor `` value\n */\nfunction useAsyncValue() {\n let value = React.useContext(AwaitContext);\n return value == null ? void 0 : value._data;\n}\n\n/**\n * Returns the error from the nearest ancestor `` value\n */\nfunction useAsyncError() {\n let value = React.useContext(AwaitContext);\n return value == null ? void 0 : value._error;\n}\nlet blockerId = 0;\n\n/**\n * Allow the application to block navigations within the SPA and present the\n * user a confirmation dialog to confirm the navigation. Mostly used to avoid\n * using half-filled form data. This does not handle hard-reloads or\n * cross-origin navigations.\n */\nfunction useBlocker(shouldBlock) {\n let {\n router,\n basename\n } = useDataRouterContext(DataRouterHook.UseBlocker);\n let state = useDataRouterState(DataRouterStateHook.UseBlocker);\n let [blockerKey, setBlockerKey] = React.useState(\"\");\n let blockerFunction = React.useCallback(arg => {\n if (typeof shouldBlock !== \"function\") {\n return !!shouldBlock;\n }\n if (basename === \"/\") {\n return shouldBlock(arg);\n }\n\n // If they provided us a function and we've got an active basename, strip\n // it from the locations we expose to the user to match the behavior of\n // useLocation\n let {\n currentLocation,\n nextLocation,\n historyAction\n } = arg;\n return shouldBlock({\n currentLocation: _extends({}, currentLocation, {\n pathname: stripBasename(currentLocation.pathname, basename) || currentLocation.pathname\n }),\n nextLocation: _extends({}, nextLocation, {\n pathname: stripBasename(nextLocation.pathname, basename) || nextLocation.pathname\n }),\n historyAction\n });\n }, [basename, shouldBlock]);\n\n // This effect is in charge of blocker key assignment and deletion (which is\n // tightly coupled to the key)\n React.useEffect(() => {\n let key = String(++blockerId);\n setBlockerKey(key);\n return () => router.deleteBlocker(key);\n }, [router]);\n\n // This effect handles assigning the blockerFunction. This is to handle\n // unstable blocker function identities, and happens only after the prior\n // effect so we don't get an orphaned blockerFunction in the router with a\n // key of \"\". Until then we just have the IDLE_BLOCKER.\n React.useEffect(() => {\n if (blockerKey !== \"\") {\n router.getBlocker(blockerKey, blockerFunction);\n }\n }, [router, blockerKey, blockerFunction]);\n\n // Prefer the blocker from `state` not `router.state` since DataRouterContext\n // is memoized so this ensures we update on blocker state updates\n return blockerKey && state.blockers.has(blockerKey) ? state.blockers.get(blockerKey) : IDLE_BLOCKER;\n}\n\n/**\n * Stable version of useNavigate that is used when we are in the context of\n * a RouterProvider.\n */\nfunction useNavigateStable() {\n let {\n router\n } = useDataRouterContext(DataRouterHook.UseNavigateStable);\n let id = useCurrentRouteId(DataRouterStateHook.UseNavigateStable);\n let activeRef = React.useRef(false);\n useIsomorphicLayoutEffect(() => {\n activeRef.current = true;\n });\n let navigate = React.useCallback(function (to, options) {\n if (options === void 0) {\n options = {};\n }\n process.env.NODE_ENV !== \"production\" ? UNSAFE_warning(activeRef.current, navigateEffectWarning) : void 0;\n\n // Short circuit here since if this happens on first render the navigate\n // is useless because we haven't wired up our router subscriber yet\n if (!activeRef.current) return;\n if (typeof to === \"number\") {\n router.navigate(to);\n } else {\n router.navigate(to, _extends({\n fromRouteId: id\n }, options));\n }\n }, [router, id]);\n return navigate;\n}\nconst alreadyWarned = {};\nfunction warningOnce(key, cond, message) {\n if (!cond && !alreadyWarned[key]) {\n alreadyWarned[key] = true;\n process.env.NODE_ENV !== \"production\" ? UNSAFE_warning(false, message) : void 0;\n }\n}\n\n/**\n Webpack + React 17 fails to compile on any of the following because webpack\n complains that `startTransition` doesn't exist in `React`:\n * import { startTransition } from \"react\"\n * import * as React from from \"react\";\n \"startTransition\" in React ? React.startTransition(() => setState()) : setState()\n * import * as React from from \"react\";\n \"startTransition\" in React ? React[\"startTransition\"](() => setState()) : setState()\n\n Moving it to a constant such as the following solves the Webpack/React 17 issue:\n * import * as React from from \"react\";\n const START_TRANSITION = \"startTransition\";\n START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState()\n\n However, that introduces webpack/terser minification issues in production builds\n in React 18 where minification/obfuscation ends up removing the call of\n React.startTransition entirely from the first half of the ternary. Grabbing\n this exported reference once up front resolves that issue.\n\n See https://github.com/remix-run/react-router/issues/10579\n*/\nconst START_TRANSITION = \"startTransition\";\nconst startTransitionImpl = React[START_TRANSITION];\n\n/**\n * Given a Remix Router instance, render the appropriate UI\n */\nfunction RouterProvider(_ref) {\n let {\n fallbackElement,\n router,\n future\n } = _ref;\n let [state, setStateImpl] = React.useState(router.state);\n let {\n v7_startTransition\n } = future || {};\n let setState = React.useCallback(newState => {\n if (v7_startTransition && startTransitionImpl) {\n startTransitionImpl(() => setStateImpl(newState));\n } else {\n setStateImpl(newState);\n }\n }, [setStateImpl, v7_startTransition]);\n\n // Need to use a layout effect here so we are subscribed early enough to\n // pick up on any render-driven redirects/navigations (useEffect/)\n React.useLayoutEffect(() => router.subscribe(setState), [router, setState]);\n React.useEffect(() => {\n process.env.NODE_ENV !== \"production\" ? UNSAFE_warning(fallbackElement == null || !router.future.v7_partialHydration, \"`` is deprecated when using \" + \"`v7_partialHydration`, use a `HydrateFallback` component instead\") : void 0;\n // Only log this once on initial mount\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n let navigator = React.useMemo(() => {\n return {\n createHref: router.createHref,\n encodeLocation: router.encodeLocation,\n go: n => router.navigate(n),\n push: (to, state, opts) => router.navigate(to, {\n state,\n preventScrollReset: opts == null ? void 0 : opts.preventScrollReset\n }),\n replace: (to, state, opts) => router.navigate(to, {\n replace: true,\n state,\n preventScrollReset: opts == null ? void 0 : opts.preventScrollReset\n })\n };\n }, [router]);\n let basename = router.basename || \"/\";\n let dataRouterContext = React.useMemo(() => ({\n router,\n navigator,\n static: false,\n basename\n }), [router, navigator, basename]);\n\n // The fragment and {null} here are important! We need them to keep React 18's\n // useId happy when we are server-rendering since we may have a ' + '');\n printWindow.document.close();\n printWindow.focus();\n // eslint-disable-next-line\n var interval = setInterval(function () {\n if (printWindow.ready) {\n printWindow.print();\n printWindow.close();\n clearInterval(interval);\n }\n }, 500);\n return printWindow;\n}\n/**\n * Function to normalize the units applied to the element.\n *\n * @param {number|string} value ?\n * @returns {string} result\n * @private\n */\nexport function formatUnit(value) {\n var result = value + '';\n if (result.match(/auto|cm|mm|in|px|pt|pc|%|em|ex|ch|rem|vw|vh|vmin|vmax/)) {\n return result;\n }\n return result + 'px';\n}\n/**\n * Function to check whether the platform is blazor or not.\n *\n * @returns {void} result\n * @private\n */\nexport function enableBlazorMode() {\n isBlazorPlatform = true;\n}\n/**\n * Function to check whether the platform is blazor or not.\n *\n * @returns {boolean} result\n * @private\n */\nexport function isBlazor() {\n return isBlazorPlatform;\n}\n/**\n * Function to convert xPath to DOM element in blazor platform\n *\n * @returns {HTMLElement} result\n * @param {HTMLElement | object} element ?\n * @private\n */\nexport function getElement(element) {\n var xPath = 'xPath';\n if (!(element instanceof Node) && isBlazor() && !isNullOrUndefined(element[\"\" + xPath])) {\n return document.evaluate(element[\"\" + xPath], document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;\n }\n return element;\n}\n/**\n * Function to fetch the Instances of a HTML element for the given component.\n *\n * @param {string | HTMLElement} element ?\n * @param {any} component ?\n * @returns {Object} ?\n * @private\n */\n// eslint-disable-next-line\nexport function getInstance(element, component) {\n // eslint-disable-next-line\n var elem = (typeof (element) === 'string') ? document.querySelector(element) : element;\n if (elem[\"\" + instances]) {\n for (var _i = 0, _a = elem[\"\" + instances]; _i < _a.length; _i++) {\n var inst = _a[_i];\n if (inst instanceof component) {\n return inst;\n }\n }\n }\n return null;\n}\n/**\n * Function to add instances for the given element.\n *\n * @param {string | HTMLElement} element ?\n * @param {Object} instance ?\n * @returns {void} ?\n * @private\n */\nexport function addInstance(element, instance) {\n // eslint-disable-next-line\n var elem = (typeof (element) === 'string') ? document.querySelector(element) : element;\n if (elem[\"\" + instances]) {\n elem[\"\" + instances].push(instance);\n }\n else {\n elem[\"\" + instances] = [instance];\n }\n}\n/**\n * Function to generate the unique id.\n *\n * @returns {any} ?\n * @private\n */\n// eslint-disable-next-line\nexport function uniqueID() {\n if ((typeof window) === 'undefined') {\n return;\n }\n // eslint-disable-next-line\n var num = new Uint16Array(5);\n var intCrypto = window.msCrypto || window.crypto;\n return intCrypto.getRandomValues(num);\n}\n/**\n *\n * @param {Int16Array} num ?\n * @returns {string} ?\n */\nfunction combineArray(num) {\n var ret = '';\n for (var i = 0; i < 5; i++) {\n ret += (i ? ',' : '') + num[parseInt(i.toString(), 10)];\n }\n return ret;\n}\n","/**\n * Parser\n */\nvar defaultNumberingSystem = {\n 'latn': {\n '_digits': '0123456789',\n '_type': 'numeric'\n }\n};\nimport { isUndefined, getValue, isBlazor } from '../util';\nvar defaultNumberSymbols = {\n 'decimal': '.',\n 'group': ',',\n 'percentSign': '%',\n 'plusSign': '+',\n 'minusSign': '-',\n 'infinity': '∞',\n 'nan': 'NaN',\n 'exponential': 'E'\n};\nvar latnNumberSystem = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];\n/**\n * Interface for parser base\n *\n * @private\n */\nvar ParserBase = /** @class */ (function () {\n function ParserBase() {\n }\n /**\n * Returns the cldr object for the culture specifies\n *\n * @param {Object} obj - Specifies the object from which culture object to be acquired.\n * @param {string} cName - Specifies the culture name.\n * @returns {Object} ?\n */\n ParserBase.getMainObject = function (obj, cName) {\n var value = isBlazor() ? cName : 'main.' + cName;\n return getValue(value, obj);\n };\n /**\n * Returns the numbering system object from given cldr data.\n *\n * @param {Object} obj - Specifies the object from which number system is acquired.\n * @returns {Object} ?\n */\n ParserBase.getNumberingSystem = function (obj) {\n return getValue('supplemental.numberingSystems', obj) || this.numberingSystems;\n };\n /**\n * Returns the reverse of given object keys or keys specified.\n *\n * @param {Object} prop - Specifies the object to be reversed.\n * @param {number[]} keys - Optional parameter specifies the custom keyList for reversal.\n * @returns {Object} ?\n */\n ParserBase.reverseObject = function (prop, keys) {\n var propKeys = keys || Object.keys(prop);\n var res = {};\n for (var _i = 0, propKeys_1 = propKeys; _i < propKeys_1.length; _i++) {\n var key = propKeys_1[_i];\n // eslint-disable-next-line\n if (!res.hasOwnProperty(prop[key])) {\n // eslint-disable-next-line\n res[prop[key]] = key;\n }\n }\n return res;\n };\n /**\n * Returns the symbol regex by skipping the escape sequence.\n *\n * @param {string[]} props - Specifies the array values to be skipped.\n * @returns {RegExp} ?\n */\n ParserBase.getSymbolRegex = function (props) {\n var regexStr = props.map(function (str) {\n return str.replace(/([.*+?^=!:${}()|[\\]/\\\\])/g, '\\\\$1');\n }).join('|');\n var regExp = RegExp;\n return new regExp(regexStr, 'g');\n };\n /**\n *\n * @param {Object} prop ?\n * @returns {Object} ?\n */\n ParserBase.getSymbolMatch = function (prop) {\n var matchKeys = Object.keys(defaultNumberSymbols);\n var ret = {};\n for (var _i = 0, matchKeys_1 = matchKeys; _i < matchKeys_1.length; _i++) {\n var key = matchKeys_1[_i];\n // eslint-disable-next-line\n ret[prop[key]] = defaultNumberSymbols[key];\n }\n return ret;\n };\n /**\n * Returns regex string for provided value\n *\n * @param {string} val ?\n * @returns {string} ?\n */\n ParserBase.constructRegex = function (val) {\n var len = val.length;\n var ret = '';\n for (var i = 0; i < len; i++) {\n if (i !== len - 1) {\n ret += val[parseInt(i.toString(), 10)] + '|';\n }\n else {\n ret += val[parseInt(i.toString(), 10)];\n }\n }\n return ret;\n };\n /**\n * Returns the replaced value of matching regex and obj mapper.\n *\n * @param {string} value - Specifies the values to be replaced.\n * @param {RegExp} regex - Specifies the regex to search.\n * @param {Object} obj - Specifies the object matcher to be replace value parts.\n * @returns {string} ?\n */\n ParserBase.convertValueParts = function (value, regex, obj) {\n return value.replace(regex, function (str) {\n // eslint-disable-next-line\n return obj[str];\n });\n };\n /**\n * Returns default numbering system object for formatting from cldr data\n *\n * @param {Object} obj ?\n * @returns {NumericObject} ?\n */\n ParserBase.getDefaultNumberingSystem = function (obj) {\n var ret = {};\n ret.obj = getValue('numbers', obj);\n ret.nSystem = getValue('defaultNumberingSystem', ret.obj);\n return ret;\n };\n /**\n * Returns the replaced value of matching regex and obj mapper.\n *\n * @param {Object} curObj ?\n * @param {Object} numberSystem ?\n * @param {boolean} needSymbols ?\n * @param {boolean} blazorMode ?\n * @returns {Object} ?\n */\n ParserBase.getCurrentNumericOptions = function (curObj, numberSystem, needSymbols, blazorMode) {\n var ret = {};\n var cur = this.getDefaultNumberingSystem(curObj);\n if (!isUndefined(cur.nSystem) || blazorMode) {\n var digits = blazorMode ? getValue('obj.mapperDigits', cur) : getValue(cur.nSystem + '._digits', numberSystem);\n if (!isUndefined(digits)) {\n ret.numericPair = this.reverseObject(digits, latnNumberSystem);\n var regExp = RegExp;\n ret.numberParseRegex = new regExp(this.constructRegex(digits), 'g');\n ret.numericRegex = '[' + digits[0] + '-' + digits[9] + ']';\n if (needSymbols) {\n ret.numericRegex = digits[0] + '-' + digits[9];\n ret.symbolNumberSystem = getValue(blazorMode ? 'numberSymbols' : 'symbols-numberSystem-' + cur.nSystem, cur.obj);\n ret.symbolMatch = this.getSymbolMatch(ret.symbolNumberSystem);\n ret.numberSystem = cur.nSystem;\n }\n }\n }\n return ret;\n };\n /**\n * Returns number mapper object for the provided cldr data\n *\n * @param {Object} curObj ?\n * @param {Object} numberSystem ?\n * @param {boolean} isNumber ?\n * @returns {NumberMapper} ?\n */\n // eslint-disable-next-line\n ParserBase.getNumberMapper = function (curObj, numberSystem, isNumber) {\n var ret = { mapper: {} };\n var cur = this.getDefaultNumberingSystem(curObj);\n if (!isUndefined(cur.nSystem)) {\n ret.numberSystem = cur.nSystem;\n ret.numberSymbols = getValue('symbols-numberSystem-' + cur.nSystem, cur.obj);\n ret.timeSeparator = getValue('timeSeparator', ret.numberSymbols);\n var digits = getValue(cur.nSystem + '._digits', numberSystem);\n if (!isUndefined(digits)) {\n for (var _i = 0, latnNumberSystem_1 = latnNumberSystem; _i < latnNumberSystem_1.length; _i++) {\n var i = latnNumberSystem_1[_i];\n // eslint-disable-next-line\n ret.mapper[i] = digits[i];\n }\n }\n }\n return ret;\n };\n ParserBase.nPair = 'numericPair';\n ParserBase.nRegex = 'numericRegex';\n ParserBase.numberingSystems = defaultNumberingSystem;\n return ParserBase;\n}());\nexport { ParserBase };\n/**\n * @private\n */\nvar blazorCurrencyData = {\n 'DJF': 'Fdj',\n 'ERN': 'Nfk',\n 'ETB': 'Br',\n 'NAD': '$',\n 'ZAR': 'R',\n 'XAF': 'FCFA',\n 'GHS': 'GH₵',\n 'XDR': 'XDR',\n 'AED': 'د.إ.',\n 'BHD': 'د.ب.',\n 'DZD': 'د.ج.',\n 'EGP': 'ج.م.',\n 'ILS': '₪',\n 'IQD': 'د.ع.',\n 'JOD': 'د.ا.',\n 'KMF': 'CF',\n 'KWD': 'د.ك.',\n 'LBP': 'ل.ل.',\n 'LYD': 'د.ل.',\n 'MAD': 'د.م.',\n 'MRU': 'أ.م.',\n 'OMR': 'ر.ع.',\n 'QAR': 'ر.ق.',\n 'SAR': 'ر.س.',\n 'SDG': 'ج.س.',\n 'SOS': 'S',\n 'SSP': '£',\n 'SYP': 'ل.س.',\n 'TND': 'د.ت.',\n 'YER': 'ر.ي.',\n 'CLP': '$',\n 'INR': '₹',\n 'TZS': 'TSh',\n 'EUR': '€',\n 'AZN': '₼',\n 'RUB': '₽',\n 'BYN': 'Br',\n 'ZMW': 'K',\n 'BGN': 'лв.',\n 'NGN': '₦',\n 'XOF': 'CFA',\n 'BDT': '৳',\n 'CNY': '¥',\n 'BAM': 'КМ',\n 'UGX': 'USh',\n 'USD': '$',\n 'CZK': 'Kč',\n 'GBP': '£',\n 'DKK': 'kr.',\n 'KES': 'Ksh',\n 'CHF': 'CHF',\n 'MVR': 'ރ.',\n 'BTN': 'Nu.',\n 'XCD': 'EC$',\n 'AUD': '$',\n 'BBD': '$',\n 'BIF': 'FBu',\n 'BMD': '$',\n 'BSD': '$',\n 'BWP': 'P',\n 'BZD': '$',\n 'CAD': '$',\n 'NZD': '$',\n 'FJD': '$',\n 'FKP': '£',\n 'GIP': '£',\n 'GMD': 'D',\n 'GYD': '$',\n 'HKD': '$',\n 'IDR': 'Rp',\n 'JMD': '$',\n 'KYD': '$',\n 'LRD': '$',\n 'MGA': 'Ar',\n 'MOP': 'MOP$',\n 'MUR': 'Rs',\n 'MWK': 'MK',\n 'MYR': 'RM',\n 'PGK': 'K',\n 'PHP': '₱',\n 'PKR': 'Rs',\n 'RWF': 'RF',\n 'SBD': '$',\n 'SCR': 'SR',\n 'SEK': 'kr',\n 'SGD': '$',\n 'SHP': '£',\n 'SLL': 'Le',\n 'ANG': 'NAf.',\n 'SZL': 'E',\n 'TOP': 'T$',\n 'TTD': '$',\n 'VUV': 'VT',\n 'WST': 'WS$',\n 'ARS': '$',\n 'BOB': 'Bs',\n 'BRL': 'R$',\n 'COP': '$',\n 'CRC': '₡',\n 'CUP': '$',\n 'DOP': '$',\n 'GTQ': 'Q',\n 'HNL': 'L',\n 'MXN': '$',\n 'NIO': 'C$',\n 'PAB': 'B/.',\n 'PEN': 'S/',\n 'PYG': '₲',\n 'UYU': '$',\n 'VES': 'Bs.S',\n 'IRR': 'ريال',\n 'GNF': 'FG',\n 'CDF': 'FC',\n 'HTG': 'G',\n 'XPF': 'FCFP',\n 'HRK': 'kn',\n 'HUF': 'Ft',\n 'AMD': '֏',\n 'ISK': 'kr',\n 'JPY': '¥',\n 'GEL': '₾',\n 'CVE': '​',\n 'KZT': '₸',\n 'KHR': '៛',\n 'KPW': '₩',\n 'KRW': '₩',\n 'KGS': 'сом',\n 'AOA': 'Kz',\n 'LAK': '₭',\n 'MZN': 'MTn',\n 'MKD': 'ден',\n 'MNT': '₮',\n 'BND': '$',\n 'MMK': 'K',\n 'NOK': 'kr',\n 'NPR': 'रु',\n 'AWG': 'Afl.',\n 'SRD': '$',\n 'PLN': 'zł',\n 'AFN': '؋',\n 'STN': 'Db',\n 'MDL': 'L',\n 'RON': 'lei',\n 'UAH': '₴',\n 'LKR': 'රු.',\n 'ALL': 'Lekë',\n 'RSD': 'дин.',\n 'TJS': 'смн',\n 'THB': '฿',\n 'TMT': 'm.',\n 'TRY': '₺',\n 'UZS': 'сўм',\n 'VND': '₫',\n 'TWD': 'NT$'\n};\n/**\n *\n * @param {string} currencyCode ?\n * @returns {string} ?\n */\nexport function getBlazorCurrencySymbol(currencyCode) {\n return getValue(currencyCode || '', blazorCurrencyData);\n}\n","/***\n * Hijri parser\n */\n// eslint-disable-next-line\nexport var HijriParser;\n(function (HijriParser) {\n var dateCorrection = [28607, 28636, 28665, 28695, 28724, 28754, 28783, 28813, 28843, 28872, 28901, 28931, 28960, 28990,\n 29019, 29049, 29078, 29108, 29137, 29167, 29196, 29226, 29255, 29285, 29315, 29345, 29375, 29404, 29434, 29463, 29492, 29522,\n 29551, 29580, 29610, 29640, 29669, 29699, 29729, 29759, 29788, 29818, 29847, 29876, 29906, 29935, 29964, 29994, 30023, 30053,\n 30082, 30112, 30141, 30171, 30200, 30230, 30259, 30289, 30318, 30348, 30378, 30408, 30437, 30467, 30496, 30526, 30555, 30585,\n 30614, 30644, 30673, 30703, 30732, 30762, 30791, 30821, 30850, 30880, 30909, 30939, 30968, 30998, 31027, 31057, 31086, 31116,\n 31145, 31175, 31204, 31234, 31263, 31293, 31322, 31352, 31381, 31411, 31441, 31471, 31500, 31530, 31559, 31589, 31618, 31648,\n 31676, 31706, 31736, 31766, 31795, 31825, 31854, 31884, 31913, 31943, 31972, 32002, 32031, 32061, 32090, 32120, 32150, 32180,\n 32209, 32239, 32268, 32298, 32327, 32357, 32386, 32416, 32445, 32475, 32504, 32534, 32563, 32593, 32622, 32652, 32681, 32711,\n 32740, 32770, 32799, 32829, 32858, 32888, 32917, 32947, 32976, 33006, 33035, 33065, 33094, 33124, 33153, 33183, 33213, 33243,\n 33272, 33302, 33331, 33361, 33390, 33420, 33450, 33479, 33509, 33539, 33568, 33598, 33627, 33657, 33686, 33716, 33745, 33775,\n 33804, 33834, 33863, 33893, 33922, 33952, 33981, 34011, 34040, 34069, 34099, 34128, 34158, 34187, 34217, 34247, 34277, 34306,\n 34336, 34365, 34395, 34424, 34454, 34483, 34512, 34542, 34571, 34601, 34631, 34660, 34690, 34719, 34749, 34778, 34808, 34837,\n 34867, 34896, 34926, 34955, 34985, 35015, 35044, 35074, 35103, 35133, 35162, 35192, 35222, 35251, 35280, 35310, 35340, 35370,\n 35399, 35429, 35458, 35488, 35517, 35547, 35576, 35605, 35635, 35665, 35694, 35723, 35753, 35782, 35811, 35841, 35871, 35901,\n 35930, 35960, 35989, 36019, 36048, 36078, 36107, 36136, 36166, 36195, 36225, 36254, 36284, 36314, 36343, 36373, 36403, 36433,\n 36462, 36492, 36521, 36551, 36580, 36610, 36639, 36669, 36698, 36728, 36757, 36786, 36816, 36845, 36875, 36904, 36934, 36963,\n 36993, 37022, 37052, 37081, 37111, 37141, 37170, 37200, 37229, 37259, 37288, 37318, 37347, 37377, 37406, 37436, 37465, 37495,\n 37524, 37554, 37584, 37613, 37643, 37672, 37701, 37731, 37760, 37790, 37819, 37849, 37878, 37908, 37938, 37967, 37997, 38027,\n 38056, 38085, 38115, 38144, 38174, 38203, 38233, 38262, 38292, 38322, 38351, 38381, 38410, 38440, 38469, 38499, 38528, 38558,\n 38587, 38617, 38646, 38676, 38705, 38735, 38764, 38794, 38823, 38853, 38882, 38912, 38941, 38971, 39001, 39030, 39059, 39089,\n 39118, 39148, 39178, 39208, 39237, 39267, 39297, 39326, 39355, 39385, 39414, 39444, 39473, 39503, 39532, 39562, 39592, 39621,\n 39650, 39680, 39709, 39739, 39768, 39798, 39827, 39857, 39886, 39916, 39946, 39975, 40005, 40035, 40064, 40094, 40123, 40153,\n 40182, 40212, 40241, 40271, 40300, 40330, 40359, 40389, 40418, 40448, 40477, 40507, 40536, 40566, 40595, 40625, 40655, 40685,\n 40714, 40744, 40773, 40803, 40832, 40862, 40892, 40921, 40951, 40980, 41009, 41039, 41068, 41098, 41127, 41157, 41186, 41216,\n 41245, 41275, 41304, 41334, 41364, 41393, 41422, 41452, 41481, 41511, 41540, 41570, 41599, 41629, 41658, 41688, 41718, 41748,\n 41777, 41807, 41836, 41865, 41894, 41924, 41953, 41983, 42012, 42042, 42072, 42102, 42131, 42161, 42190, 42220, 42249, 42279,\n 42308, 42337, 42367, 42397, 42426, 42456, 42485, 42515, 42545, 42574, 42604, 42633, 42662, 42692, 42721, 42751, 42780, 42810,\n 42839, 42869, 42899, 42929, 42958, 42988, 43017, 43046, 43076, 43105, 43135, 43164, 43194, 43223, 43253, 43283, 43312, 43342,\n 43371, 43401, 43430, 43460, 43489, 43519, 43548, 43578, 43607, 43637, 43666, 43696, 43726, 43755, 43785, 43814, 43844, 43873,\n 43903, 43932, 43962, 43991, 44021, 44050, 44080, 44109, 44139, 44169, 44198, 44228, 44258, 44287, 44317, 44346, 44375, 44405,\n 44434, 44464, 44493, 44523, 44553, 44582, 44612, 44641, 44671, 44700, 44730, 44759, 44788, 44818, 44847, 44877, 44906, 44936,\n 44966, 44996, 45025, 45055, 45084, 45114, 45143, 45172, 45202, 45231, 45261, 45290, 45320, 45350, 45380, 45409, 45439, 45468,\n 45498, 45527, 45556, 45586, 45615, 45644, 45674, 45704, 45733, 45763, 45793, 45823, 45852, 45882, 45911, 45940, 45970, 45999,\n 46028, 46058, 46088, 46117, 46147, 46177, 46206, 46236, 46265, 46295, 46324, 46354, 46383, 46413, 46442, 46472, 46501, 46531,\n 46560, 46590, 46620, 46649, 46679, 46708, 46738, 46767, 46797, 46826, 46856, 46885, 46915, 46944, 46974, 47003, 47033, 47063,\n 47092, 47122, 47151, 47181, 47210, 47240, 47269, 47298, 47328, 47357, 47387, 47417, 47446, 47476, 47506, 47535, 47565, 47594,\n 47624, 47653, 47682, 47712, 47741, 47771, 47800, 47830, 47860, 47890, 47919, 47949, 47978, 48008, 48037, 48066, 48096, 48125,\n 48155, 48184, 48214, 48244, 48273, 48303, 48333, 48362, 48392, 48421, 48450, 48480, 48509, 48538, 48568, 48598, 48627, 48657,\n 48687, 48717, 48746, 48776, 48805, 48834, 48864, 48893, 48922, 48952, 48982, 49011, 49041, 49071, 49100, 49130, 49160, 49189,\n 49218, 49248, 49277, 49306, 49336, 49365, 49395, 49425, 49455, 49484, 49514, 49543, 49573, 49602, 49632, 49661, 49690, 49720,\n 49749, 49779, 49809, 49838, 49868, 49898, 49927, 49957, 49986, 50016, 50045, 50075, 50104, 50133, 50163, 50192, 50222, 50252,\n 50281, 50311, 50340, 50370, 50400, 50429, 50459, 50488, 50518, 50547, 50576, 50606, 50635, 50665, 50694, 50724, 50754, 50784,\n 50813, 50843, 50872, 50902, 50931, 50960, 50990, 51019, 51049, 51078, 51108, 51138, 51167, 51197, 51227, 51256, 51286, 51315,\n 51345, 51374, 51403, 51433, 51462, 51492, 51522, 51552, 51582, 51611, 51641, 51670, 51699, 51729, 51758, 51787, 51816, 51846,\n 51876, 51906, 51936, 51965, 51995, 52025, 52054, 52083, 52113, 52142, 52171, 52200, 52230, 52260, 52290, 52319, 52349, 52379,\n 52408, 52438, 52467, 52497, 52526, 52555, 52585, 52614, 52644, 52673, 52703, 52733, 52762, 52792, 52822, 52851, 52881, 52910,\n 52939, 52969, 52998, 53028, 53057, 53087, 53116, 53146, 53176, 53205, 53235, 53264, 53294, 53324, 53353, 53383, 53412, 53441,\n 53471, 53500, 53530, 53559, 53589, 53619, 53648, 53678, 53708, 53737, 53767, 53796, 53825, 53855, 53884, 53913, 53943, 53973,\n 54003, 54032, 54062, 54092, 54121, 54151, 54180, 54209, 54239, 54268, 54297, 54327, 54357, 54387, 54416, 54446, 54476, 54505,\n 54535, 54564, 54593, 54623, 54652, 54681, 54711, 54741, 54770, 54800, 54830, 54859, 54889, 54919, 54948, 54977, 55007, 55036,\n 55066, 55095, 55125, 55154, 55184, 55213, 55243, 55273, 55302, 55332, 55361, 55391, 55420, 55450, 55479, 55508, 55538, 55567,\n 55597, 55627, 55657, 55686, 55716, 55745, 55775, 55804, 55834, 55863, 55892, 55922, 55951, 55981, 56011, 56040, 56070, 56100,\n 56129, 56159, 56188, 56218, 56247, 56276, 56306, 56335, 56365, 56394, 56424, 56454, 56483, 56513, 56543, 56572, 56601, 56631,\n 56660, 56690, 56719, 56749, 56778, 56808, 56837, 56867, 56897, 56926, 56956, 56985, 57015, 57044, 57074, 57103, 57133, 57162,\n 57192, 57221, 57251, 57280, 57310, 57340, 57369, 57399, 57429, 57458, 57487, 57517, 57546, 57576, 57605, 57634, 57664, 57694,\n 57723, 57753, 57783, 57813, 57842, 57871, 57901, 57930, 57959, 57989, 58018, 58048, 58077, 58107, 58137, 58167, 58196, 58226,\n 58255, 58285, 58314, 58343, 58373, 58402, 58432, 58461, 58491, 58521, 58551, 58580, 58610, 58639, 58669, 58698, 58727, 58757,\n 58786, 58816, 58845, 58875, 58905, 58934, 58964, 58994, 59023, 59053, 59082, 59111, 59141, 59170, 59200, 59229, 59259, 59288,\n 59318, 59348, 59377, 59407, 59436, 59466, 59495, 59525, 59554, 59584, 59613, 59643, 59672, 59702, 59731, 59761, 59791, 59820,\n 59850, 59879, 59909, 59939, 59968, 59997, 60027, 60056, 60086, 60115, 60145, 60174, 60204, 60234, 60264, 60293, 60323, 60352,\n 60381, 60411, 60440, 60469, 60499, 60528, 60558, 60588, 60618, 60648, 60677, 60707, 60736, 60765, 60795, 60824, 60853, 60883,\n 60912, 60942, 60972, 61002, 61031, 61061, 61090, 61120, 61149, 61179, 61208, 61237, 61267, 61296, 61326, 61356, 61385, 61415,\n 61445, 61474, 61504, 61533, 61563, 61592, 61621, 61651, 61680, 61710, 61739, 61769, 61799, 61828, 61858, 61888, 61917, 61947,\n 61976, 62006, 62035, 62064, 62094, 62123, 62153, 62182, 62212, 62242, 62271, 62301, 62331, 62360, 62390, 62419, 62448, 62478,\n 62507, 62537, 62566, 62596, 62625, 62655, 62685, 62715, 62744, 62774, 62803, 62832, 62862, 62891, 62921, 62950, 62980, 63009,\n 63039, 63069, 63099, 63128, 63157, 63187, 63216, 63246, 63275, 63305, 63334, 63363, 63393, 63423, 63453, 63482, 63512, 63541,\n 63571, 63600, 63630, 63659, 63689, 63718, 63747, 63777, 63807, 63836, 63866, 63895, 63925, 63955, 63984, 64014, 64043, 64073,\n 64102, 64131, 64161, 64190, 64220, 64249, 64279, 64309, 64339, 64368, 64398, 64427, 64457, 64486, 64515, 64545, 64574, 64603,\n 64633, 64663, 64692, 64722, 64752, 64782, 64811, 64841, 64870, 64899, 64929, 64958, 64987, 65017, 65047, 65076, 65106, 65136,\n 65166, 65195, 65225, 65254, 65283, 65313, 65342, 65371, 65401, 65431, 65460, 65490, 65520, 65549, 65579, 65608, 65638, 65667,\n 65697, 65726, 65755, 65785, 65815, 65844, 65874, 65903, 65933, 65963, 65992, 66022, 66051, 66081, 66110, 66140, 66169, 66199,\n 66228, 66258, 66287, 66317, 66346, 66376, 66405, 66435, 66465, 66494, 66524, 66553, 66583, 66612, 66641, 66671, 66700, 66730,\n 66760, 66789, 66819, 66849, 66878, 66908, 66937, 66967, 66996, 67025, 67055, 67084, 67114, 67143, 67173, 67203, 67233, 67262,\n 67292, 67321, 67351, 67380, 67409, 67439, 67468, 67497, 67527, 67557, 67587, 67617, 67646, 67676, 67705, 67735, 67764, 67793,\n 67823, 67852, 67882, 67911, 67941, 67971, 68000, 68030, 68060, 68089, 68119, 68148, 68177, 68207, 68236, 68266, 68295, 68325,\n 68354, 68384, 68414, 68443, 68473, 68502, 68532, 68561, 68591, 68620, 68650, 68679, 68708, 68738, 68768, 68797, 68827, 68857,\n 68886, 68916, 68946, 68975, 69004, 69034, 69063, 69092, 69122, 69152, 69181, 69211, 69240, 69270, 69300, 69330, 69359, 69388,\n 69418, 69447, 69476, 69506, 69535, 69565, 69595, 69624, 69654, 69684, 69713, 69743, 69772, 69802, 69831, 69861, 69890, 69919,\n 69949, 69978, 70008, 70038, 70067, 70097, 70126, 70156, 70186, 70215, 70245, 70274, 70303, 70333, 70362, 70392, 70421, 70451,\n 70481, 70510, 70540, 70570, 70599, 70629, 70658, 70687, 70717, 70746, 70776, 70805, 70835, 70864, 70894, 70924, 70954, 70983,\n 71013, 71042, 71071, 71101, 71130, 71159, 71189, 71218, 71248, 71278, 71308, 71337, 71367, 71397, 71426, 71455, 71485, 71514,\n 71543, 71573, 71602, 71632, 71662, 71691, 71721, 71751, 71781, 71810, 71839, 71869, 71898, 71927, 71957, 71986, 72016, 72046,\n 72075, 72105, 72135, 72164, 72194, 72223, 72253, 72282, 72311, 72341, 72370, 72400, 72429, 72459, 72489, 72518, 72548, 72577,\n 72607, 72637, 72666, 72695, 72725, 72754, 72784, 72813, 72843, 72872, 72902, 72931, 72961, 72991, 73020, 73050, 73080, 73109,\n 73139, 73168, 73197, 73227, 73256, 73286, 73315, 73345, 73375, 73404, 73434, 73464, 73493, 73523, 73552, 73581, 73611, 73640,\n 73669, 73699, 73729, 73758, 73788, 73818, 73848, 73877, 73907, 73936, 73965, 73995, 74024, 74053, 74083, 74113, 74142, 74172,\n 74202, 74231, 74261, 74291, 74320, 74349, 74379, 74408, 74437, 74467, 74497, 74526, 74556, 74586, 74615, 74645, 74675, 74704,\n 74733, 74763, 74792, 74822, 74851, 74881, 74910, 74940, 74969, 74999, 75029, 75058, 75088, 75117, 75147, 75176, 75206, 75235,\n 75264, 75294, 75323, 75353, 75383, 75412, 75442, 75472, 75501, 75531, 75560, 75590, 75619, 75648, 75678, 75707, 75737, 75766,\n 75796, 75826, 75856, 75885, 75915, 75944, 75974, 76003, 76032, 76062, 76091, 76121, 76150, 76180, 76210, 76239, 76269, 76299,\n 76328, 76358, 76387, 76416, 76446, 76475, 76505, 76534, 76564, 76593, 76623, 76653, 76682, 76712, 76741, 76771, 76801, 76830,\n 76859, 76889, 76918, 76948, 76977, 77007, 77036, 77066, 77096, 77125, 77155, 77185, 77214, 77243, 77273, 77302, 77332, 77361,\n 77390, 77420, 77450, 77479, 77509, 77539, 77569, 77598, 77627, 77657, 77686, 77715, 77745, 77774, 77804, 77833, 77863, 77893,\n 77923, 77952, 77982, 78011, 78041, 78070, 78099, 78129, 78158, 78188, 78217, 78247, 78277, 78307, 78336, 78366, 78395, 78425,\n 78454, 78483, 78513, 78542, 78572, 78601, 78631, 78661, 78690, 78720, 78750, 78779, 78808, 78838, 78867, 78897, 78926, 78956,\n 78985, 79015, 79044, 79074, 79104, 79133, 79163, 79192, 79222, 79251, 79281, 79310, 79340, 79369, 79399, 79428, 79458, 79487,\n 79517, 79546, 79576, 79606, 79635, 79665, 79695, 79724, 79753, 79783, 79812, 79841, 79871, 79900, 79930, 79960, 79990\n ];\n /**\n *\n * @param {Date} gDate ?\n * @returns {Object} ?\n */\n function getHijriDate(gDate) {\n var day = gDate.getDate();\n var month = gDate.getMonth();\n var year = gDate.getFullYear();\n var tMonth = month + 1;\n var tYear = year;\n if (tMonth < 3) {\n tYear -= 1;\n tMonth += 12;\n }\n var yPrefix = Math.floor(tYear / 100.);\n var julilanOffset = yPrefix - Math.floor(yPrefix / 4.) - 2;\n var julianNumber = Math.floor(365.25 * (tYear + 4716)) + Math.floor(30.6001 * (tMonth + 1)) + day - julilanOffset - 1524;\n yPrefix = Math.floor((julianNumber - 1867216.25) / 36524.25);\n julilanOffset = yPrefix - Math.floor(yPrefix / 4.) + 1;\n var b = julianNumber + julilanOffset + 1524;\n var c = Math.floor((b - 122.1) / 365.25);\n var d = Math.floor(365.25 * c);\n var tempMonth = Math.floor((b - d) / 30.6001);\n day = (b - d) - Math.floor(30.6001 * tempMonth);\n month = Math.floor((b - d) / 20.6001);\n if (month > 13) {\n c += 1;\n month -= 12;\n }\n month -= 1;\n year = c - 4716;\n var modifiedJulianDate = julianNumber - 2400000;\n // date calculation for year after 2077\n var iyear = 10631. / 30.;\n var z = julianNumber - 1948084;\n var cyc = Math.floor(z / 10631.);\n z = z - 10631 * cyc;\n var j = Math.floor((z - 0.1335) / iyear);\n var iy = 30 * cyc + j;\n z = z - Math.floor(j * iyear + 0.1335);\n var im = Math.floor((z + 28.5001) / 29.5);\n /* istanbul ignore next */\n if (im === 13) {\n im = 12;\n }\n var tempDay = z - Math.floor(29.5001 * im - 29);\n var i = 0;\n for (; i < dateCorrection.length; i++) {\n if (dateCorrection[parseInt(i.toString(), 10)] > modifiedJulianDate) {\n break;\n }\n }\n var iln = i + 16260;\n var ii = Math.floor((iln - 1) / 12);\n var hYear = ii + 1;\n var hmonth = iln - 12 * ii;\n var hDate = modifiedJulianDate - dateCorrection[i - 1] + 1;\n if ((hDate + '').length > 2) {\n hDate = tempDay;\n hmonth = im;\n hYear = iy;\n }\n return { year: hYear, month: hmonth, date: hDate };\n }\n HijriParser.getHijriDate = getHijriDate;\n /**\n *\n * @param {number} year ?\n * @param {number} month ?\n * @param {number} day ?\n * @returns {Date} ?\n */\n function toGregorian(year, month, day) {\n var iy = year;\n var im = month;\n var id = day;\n var ii = iy - 1;\n var iln = (ii * 12) + 1 + (im - 1);\n var i = iln - 16260;\n var mcjdn = id + dateCorrection[i - 1] - 1;\n var julianDate = mcjdn + 2400000;\n var z = Math.floor(julianDate + 0.5);\n var a = Math.floor((z - 1867216.25) / 36524.25);\n a = z + 1 + a - Math.floor(a / 4);\n var b = a + 1524;\n var c = Math.floor((b - 122.1) / 365.25);\n var d = Math.floor(365.25 * c);\n var e = Math.floor((b - d) / 30.6001);\n var gDay = b - d - Math.floor(e * 30.6001);\n var gMonth = e - (e > 13.5 ? 13 : 1);\n var gYear = c - (gMonth > 2.5 ? 4716 : 4715);\n /* istanbul ignore next */\n if (gYear <= 0) {\n gMonth--;\n } // No year zero\n return new Date(gYear + '/' + (gMonth) + '/' + gDay);\n }\n HijriParser.toGregorian = toGregorian;\n})(HijriParser || (HijriParser = {}));\n","import { ParserBase as parser } from './parser-base';\nimport { IntlBase as base } from './intl-base';\nimport { isUndefined, throwError, getValue, isBlazor } from '../util';\nimport { HijriParser } from '../hijri-parser';\nimport { isNullOrUndefined, extend } from '../util';\nvar abbreviateRegexGlobal = /\\/MMMMM|MMMM|MMM|a|LLLL|LLL|EEEEE|EEEE|E|K|cccc|ccc|WW|W|G+|z+/gi;\nvar standalone = 'stand-alone';\nvar weekdayKey = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];\nexport var basicPatterns = ['short', 'medium', 'long', 'full'];\nvar timeSetter = {\n m: 'getMinutes',\n h: 'getHours',\n H: 'getHours',\n s: 'getSeconds',\n d: 'getDate',\n f: 'getMilliseconds'\n};\nexport var datePartMatcher = {\n 'M': 'month',\n 'd': 'day',\n 'E': 'weekday',\n 'c': 'weekday',\n 'y': 'year',\n 'm': 'minute',\n 'h': 'hour',\n 'H': 'hour',\n 's': 'second',\n 'L': 'month',\n 'a': 'designator',\n 'z': 'timeZone',\n 'Z': 'timeZone',\n 'G': 'era',\n 'f': 'milliseconds'\n};\nvar timeSeparator = 'timeSeparator';\n/* tslint:disable no-any */\n/**\n * Date Format is a framework provides support for date formatting.\n *\n * @private\n */\nvar DateFormat = /** @class */ (function () {\n function DateFormat() {\n }\n /**\n * Returns the formatter function for given skeleton.\n *\n * @param {string} culture - Specifies the culture name to be which formatting.\n * @param {DateFormatOptions} option - Specific the format in which date will format.\n * @param {Object} cldr - Specifies the global cldr data collection.\n * @returns {Function} ?\n */\n DateFormat.dateFormat = function (culture, option, cldr) {\n var _this = this;\n var dependable = base.getDependables(cldr, culture, option.calendar);\n var numObject = getValue('parserObject.numbers', dependable);\n var dateObject = dependable.dateObject;\n var formatOptions = { isIslamic: base.islamicRegex.test(option.calendar) };\n if (isBlazor() && option.isServerRendered) {\n option = base.compareBlazorDateFormats(option, culture);\n }\n var resPattern = option.format ||\n base.getResultantPattern(option.skeleton, dependable.dateObject, option.type, false, isBlazor() ? culture : '');\n formatOptions.dateSeperator = isBlazor() ? getValue('dateSeperator', dateObject) : base.getDateSeparator(dependable.dateObject);\n if (isUndefined(resPattern)) {\n throwError('Format options or type given must be invalid');\n }\n else {\n resPattern = base.ConvertDateToWeekFormat(resPattern);\n if (isBlazor()) {\n resPattern = resPattern.replace(/tt/, 'a');\n }\n formatOptions.pattern = resPattern;\n formatOptions.numMapper = isBlazor() ?\n extend({}, numObject) : parser.getNumberMapper(dependable.parserObject, parser.getNumberingSystem(cldr));\n var patternMatch = resPattern.match(abbreviateRegexGlobal) || [];\n for (var _i = 0, patternMatch_1 = patternMatch; _i < patternMatch_1.length; _i++) {\n var str = patternMatch_1[_i];\n var len = str.length;\n var char = str[0];\n if (char === 'K') {\n char = 'h';\n }\n switch (char) {\n case 'E':\n case 'c':\n if (isBlazor()) {\n // eslint-disable-next-line\n formatOptions.weekday = getValue('days.' + base.monthIndex[len], dateObject);\n }\n else {\n // eslint-disable-next-line\n formatOptions.weekday = dependable.dateObject[base.days][standalone][base.monthIndex[len]];\n }\n break;\n case 'M':\n case 'L':\n if (isBlazor()) {\n // eslint-disable-next-line\n formatOptions.month = getValue('months.' + base.monthIndex[len], dateObject);\n }\n else {\n // eslint-disable-next-line\n formatOptions.month = dependable.dateObject[base.month][standalone][base.monthIndex[len]];\n }\n break;\n case 'a':\n formatOptions.designator = isBlazor() ?\n getValue('dayPeriods', dateObject) : getValue('dayPeriods.format.wide', dateObject);\n break;\n case 'G':\n // eslint-disable-next-line\n var eText = (len <= 3) ? 'eraAbbr' : (len === 4) ? 'eraNames' : 'eraNarrow';\n formatOptions.era = isBlazor() ? getValue('eras', dateObject) : getValue('eras.' + eText, dependable.dateObject);\n break;\n case 'z':\n formatOptions.timeZone = getValue('dates.timeZoneNames', dependable.parserObject);\n break;\n }\n }\n }\n return function (value) {\n if (isNaN(value.getDate())) {\n return null;\n }\n return _this.intDateFormatter(value, formatOptions);\n };\n };\n /**\n * Returns formatted date string based on options passed.\n *\n * @param {Date} value ?\n * @param {FormatOptions} options ?\n * @returns {string} ?\n */\n DateFormat.intDateFormatter = function (value, options) {\n var pattern = options.pattern;\n var ret = '';\n var matches = pattern.match(base.dateParseRegex);\n var dObject = this.getCurrentDateValue(value, options.isIslamic);\n for (var _i = 0, matches_1 = matches; _i < matches_1.length; _i++) {\n var match = matches_1[_i];\n var length_1 = match.length;\n var char = match[0];\n if (char === 'K') {\n char = 'h';\n }\n var curval = void 0;\n var curvalstr = '';\n var isNumber = void 0;\n var processNumber = void 0;\n var curstr = '';\n switch (char) {\n case 'M':\n case 'L':\n curval = dObject.month;\n if (length_1 > 2) {\n // eslint-disable-next-line\n ret += options.month[curval];\n }\n else {\n isNumber = true;\n }\n break;\n case 'E':\n case 'c':\n // eslint-disable-next-line\n ret += options.weekday[weekdayKey[value.getDay()]];\n break;\n case 'H':\n case 'h':\n case 'm':\n case 's':\n case 'd':\n case 'f':\n isNumber = true;\n if (char === 'd') {\n curval = dObject.date;\n }\n else if (char === 'f') {\n isNumber = false;\n processNumber = true;\n // eslint-disable-next-line\n curvalstr = value[timeSetter[char]]().toString();\n curvalstr = curvalstr.substring(0, length_1);\n var curlength = curvalstr.length;\n if (length_1 !== curlength) {\n if (length_1 > 3) {\n continue;\n }\n for (var i = 0; i < length_1 - curlength; i++) {\n curvalstr = '0' + curvalstr.toString();\n }\n }\n curstr += curvalstr;\n }\n else {\n // eslint-disable-next-line\n curval = value[timeSetter[char]]();\n }\n if (char === 'h') {\n curval = curval % 12 || 12;\n }\n break;\n case 'y':\n processNumber = true;\n curstr += dObject.year;\n if (length_1 === 2) {\n curstr = curstr.substr(curstr.length - 2);\n }\n break;\n case 'a':\n // eslint-disable-next-line\n var desig = value.getHours() < 12 ? 'am' : 'pm';\n // eslint-disable-next-line\n ret += options.designator[desig];\n break;\n case 'G':\n // eslint-disable-next-line\n var dec = value.getFullYear() < 0 ? 0 : 1;\n // eslint-disable-next-line\n var retu = options.era[dec];\n if (isNullOrUndefined(retu)) {\n // eslint-disable-next-line\n retu = options.era[dec ? 0 : 1];\n }\n ret += retu || '';\n break;\n case '\\'':\n ret += (match === '\\'\\'') ? '\\'' : match.replace(/'/g, '');\n break;\n case 'z':\n // eslint-disable-next-line\n var timezone = value.getTimezoneOffset();\n // eslint-disable-next-line\n var pattern_1 = (length_1 < 4) ? '+H;-H' : options.timeZone.hourFormat;\n pattern_1 = pattern_1.replace(/:/g, options.numMapper.timeSeparator);\n if (timezone === 0) {\n ret += options.timeZone.gmtZeroFormat;\n }\n else {\n processNumber = true;\n curstr = this.getTimeZoneValue(timezone, pattern_1);\n }\n curstr = options.timeZone.gmtFormat.replace(/\\{0\\}/, curstr);\n break;\n case ':':\n // eslint-disable-next-line\n ret += options.numMapper.numberSymbols[timeSeparator];\n break;\n case '/':\n ret += options.dateSeperator;\n break;\n case 'W':\n isNumber = true;\n curval = base.getWeekOfYear(value);\n break;\n default:\n ret += match;\n }\n if (isNumber) {\n processNumber = true;\n curstr = this.checkTwodigitNumber(curval, length_1);\n }\n if (processNumber) {\n ret += parser.convertValueParts(curstr, base.latnParseRegex, options.numMapper.mapper);\n }\n }\n return ret;\n };\n DateFormat.getCurrentDateValue = function (value, isIslamic) {\n if (isIslamic) {\n return HijriParser.getHijriDate(value);\n }\n return { year: value.getFullYear(), month: value.getMonth() + 1, date: value.getDate() };\n };\n /**\n * Returns two digit numbers for given value and length\n *\n * @param {number} val ?\n * @param {number} len ?\n * @returns {string} ?\n */\n DateFormat.checkTwodigitNumber = function (val, len) {\n var ret = val + '';\n if (len === 2 && ret.length !== 2) {\n return '0' + ret;\n }\n return ret;\n };\n /**\n * Returns the value of the Time Zone.\n *\n * @param {number} tVal ?\n * @param {string} pattern ?\n * @returns {string} ?\n * @private\n */\n DateFormat.getTimeZoneValue = function (tVal, pattern) {\n var _this = this;\n var splt = pattern.split(';');\n var curPattern = splt[tVal > 0 ? 1 : 0];\n var no = Math.abs(tVal);\n return curPattern = curPattern.replace(/HH?|mm/g, function (str) {\n var len = str.length;\n var ishour = str.indexOf('H') !== -1;\n return _this.checkTwodigitNumber(Math.floor(ishour ? (no / 60) : (no % 60)), len);\n });\n };\n return DateFormat;\n}());\nexport { DateFormat };\n","import { isUndefined, throwError, isNullOrUndefined, extend, isBlazor, getValue } from '../util';\nimport { defaultCurrencyCode } from '../internationalization';\nimport { IntlBase as base } from './intl-base';\nimport { ParserBase as parser } from './parser-base';\nvar errorText = {\n 'ms': 'minimumSignificantDigits',\n 'ls': 'maximumSignificantDigits',\n 'mf': 'minimumFractionDigits',\n 'lf': 'maximumFractionDigits'\n};\nvar percentSign = 'percentSign';\nvar minusSign = 'minusSign';\nvar mapper = ['infinity', 'nan', 'group', 'decimal', 'exponential'];\n/**\n * Module for number formatting.\n *\n * @private\n */\nvar NumberFormat = /** @class */ (function () {\n function NumberFormat() {\n }\n /**\n * Returns the formatter function for given skeleton.\n *\n * @param {string} culture - Specifies the culture name to be which formatting.\n * @param {NumberFormatOptions} option - Specific the format in which number will format.\n * @param {Object} cldr - Specifies the global cldr data collection.\n * @returns {Function} ?\n */\n NumberFormat.numberFormatter = function (culture, option, cldr) {\n var _this = this;\n var fOptions = extend({}, option);\n var cOptions = {};\n var dOptions = {};\n var symbolPattern;\n var dependable = base.getDependables(cldr, culture, '', true);\n var numObject = dependable.numericObject;\n dOptions.numberMapper = isBlazor() ? extend({}, numObject) :\n parser.getNumberMapper(dependable.parserObject, parser.getNumberingSystem(cldr), true);\n dOptions.currencySymbol = isBlazor() ? getValue('currencySymbol', numObject) : base.getCurrencySymbol(dependable.numericObject, fOptions.currency || defaultCurrencyCode, option.altSymbol);\n /* eslint-disable @typescript-eslint/no-explicit-any */\n dOptions.percentSymbol = isBlazor() ? getValue('numberSymbols.percentSign', numObject) :\n dOptions.numberMapper.numberSymbols[\"\" + percentSign];\n dOptions.minusSymbol = isBlazor() ? getValue('numberSymbols.minusSign', numObject) :\n dOptions.numberMapper.numberSymbols[\"\" + minusSign];\n var symbols = dOptions.numberMapper.numberSymbols;\n if ((option.format) && !(base.formatRegex.test(option.format))) {\n cOptions = base.customFormat(option.format, dOptions, dependable.numericObject);\n }\n else {\n extend(fOptions, base.getProperNumericSkeleton(option.format || 'N'));\n fOptions.isCurrency = fOptions.type === 'currency';\n fOptions.isPercent = fOptions.type === 'percent';\n if (!isBlazor()) {\n symbolPattern = base.getSymbolPattern(fOptions.type, dOptions.numberMapper.numberSystem, dependable.numericObject, fOptions.isAccount);\n }\n fOptions.groupOne = this.checkValueRange(fOptions.maximumSignificantDigits, fOptions.minimumSignificantDigits, true);\n this.checkValueRange(fOptions.maximumFractionDigits, fOptions.minimumFractionDigits, false, true);\n if (!isUndefined(fOptions.fractionDigits)) {\n fOptions.minimumFractionDigits = fOptions.maximumFractionDigits = fOptions.fractionDigits;\n }\n if (isUndefined(fOptions.useGrouping)) {\n fOptions.useGrouping = true;\n }\n if (fOptions.isCurrency && !isBlazor()) {\n symbolPattern = symbolPattern.replace(/\\u00A4/g, base.defaultCurrency);\n }\n if (!isBlazor()) {\n var split = symbolPattern.split(';');\n cOptions.nData = base.getFormatData(split[1] || '-' + split[0], true, dOptions.currencySymbol);\n cOptions.pData = base.getFormatData(split[0], false, dOptions.currencySymbol);\n if (fOptions.useGrouping) {\n fOptions.groupSeparator = symbols[mapper[2]];\n fOptions.groupData = this.getGroupingDetails(split[0]);\n }\n }\n else {\n cOptions.nData = extend({}, {}, getValue(fOptions.type + 'nData', numObject));\n cOptions.pData = extend({}, {}, getValue(fOptions.type + 'pData', numObject));\n if (fOptions.type === 'currency' && option.currency) {\n base.replaceBlazorCurrency([cOptions.pData, cOptions.nData], dOptions.currencySymbol, option.currency);\n }\n }\n var minFrac = isUndefined(fOptions.minimumFractionDigits);\n if (minFrac) {\n fOptions.minimumFractionDigits = cOptions.nData.minimumFraction;\n }\n if (isUndefined(fOptions.maximumFractionDigits)) {\n var mval = cOptions.nData.maximumFraction;\n fOptions.maximumFractionDigits = isUndefined(mval) && fOptions.isPercent ? 0 : mval;\n }\n var mfrac = fOptions.minimumFractionDigits;\n var lfrac = fOptions.maximumFractionDigits;\n if (!isUndefined(mfrac) && !isUndefined(lfrac)) {\n if (mfrac > lfrac) {\n fOptions.maximumFractionDigits = mfrac;\n }\n }\n }\n extend(cOptions.nData, fOptions);\n extend(cOptions.pData, fOptions);\n return function (value) {\n if (isNaN(value)) {\n return symbols[mapper[1]];\n }\n else if (!isFinite(value)) {\n return symbols[mapper[0]];\n }\n return _this.intNumberFormatter(value, cOptions, dOptions, option);\n };\n };\n /**\n * Returns grouping details for the pattern provided\n *\n * @param {string} pattern ?\n * @returns {GroupDetails} ?\n */\n NumberFormat.getGroupingDetails = function (pattern) {\n var ret = {};\n var match = pattern.match(base.negativeDataRegex);\n if (match && match[4]) {\n var pattern_1 = match[4];\n var p = pattern_1.lastIndexOf(',');\n if (p !== -1) {\n var temp = pattern_1.split('.')[0];\n ret.primary = (temp.length - p) - 1;\n var s = pattern_1.lastIndexOf(',', p - 1);\n if (s !== -1) {\n ret.secondary = p - 1 - s;\n }\n }\n }\n return ret;\n };\n /**\n * Returns if the provided integer range is valid.\n *\n * @param {number} val1 ?\n * @param {number} val2 ?\n * @param {boolean} checkbothExist ?\n * @param {boolean} isFraction ?\n * @returns {boolean} ?\n */\n NumberFormat.checkValueRange = function (val1, val2, checkbothExist, isFraction) {\n var decide = isFraction ? 'f' : 's';\n var dint = 0;\n var str1 = errorText['l' + decide];\n // eslint-disable-next-line\n var str2 = errorText['m' + decide];\n if (!isUndefined(val1)) {\n this.checkRange(val1, str1, isFraction);\n dint++;\n }\n if (!isUndefined(val2)) {\n this.checkRange(val2, str2, isFraction);\n dint++;\n }\n if (dint === 2) {\n if (val1 < val2) {\n throwError(str2 + 'specified must be less than the' + str1);\n }\n else {\n return true;\n }\n }\n else if (checkbothExist && dint === 1) {\n throwError('Both' + str2 + 'and' + str2 + 'must be present');\n }\n return false;\n };\n /**\n * Check if the provided fraction range is valid\n *\n * @param {number} val ?\n * @param {string} text ?\n * @param {boolean} isFraction ?\n * @returns {void} ?\n */\n NumberFormat.checkRange = function (val, text, isFraction) {\n var range = isFraction ? [0, 20] : [1, 21];\n if (val < range[0] || val > range[1]) {\n throwError(text + 'value must be within the range' + range[0] + 'to' + range[1]);\n }\n };\n /**\n * Returns formatted numeric string for provided formatting options\n *\n * @param {number} value ?\n * @param {base.GenericFormatOptions} fOptions ?\n * @param {CommonOptions} dOptions ?\n * @param {NumberFormatOptions} [option] ?\n * @returns {string} ?\n */\n NumberFormat.intNumberFormatter = function (value, fOptions, dOptions, option) {\n var curData;\n if (isUndefined(fOptions.nData.type)) {\n return undefined;\n }\n else {\n if (value < 0) {\n value = value * -1;\n curData = fOptions.nData;\n }\n else if (value === 0) {\n curData = fOptions.zeroData || fOptions.pData;\n }\n else {\n curData = fOptions.pData;\n }\n var fValue = '';\n if (curData.isPercent) {\n value = value * 100;\n }\n if (curData.groupOne) {\n fValue = this.processSignificantDigits(value, curData.minimumSignificantDigits, curData.maximumSignificantDigits);\n }\n else {\n fValue = this.processFraction(value, curData.minimumFractionDigits, curData.maximumFractionDigits, option);\n if (curData.minimumIntegerDigits) {\n fValue = this.processMinimumIntegers(fValue, curData.minimumIntegerDigits);\n }\n if (dOptions.isCustomFormat && curData.minimumFractionDigits < curData.maximumFractionDigits\n && /\\d+\\.\\d+/.test(fValue)) {\n var temp = fValue.split('.');\n var decimalPart = temp[1];\n var len = decimalPart.length;\n for (var i = len - 1; i >= 0; i--) {\n if (decimalPart[\"\" + i] === '0' && i >= curData.minimumFractionDigits) {\n decimalPart = decimalPart.slice(0, i);\n }\n else {\n break;\n }\n }\n fValue = temp[0] + '.' + decimalPart;\n }\n }\n if (curData.type === 'scientific') {\n fValue = value.toExponential(curData.maximumFractionDigits);\n fValue = fValue.replace('e', dOptions.numberMapper.numberSymbols[mapper[4]]);\n }\n fValue = fValue.replace('.', dOptions.numberMapper.numberSymbols[mapper[3]]);\n fValue = curData.format === '#,###,,;(#,###,,)' ? this.customPivotFormat(parseInt(fValue, 10)) : fValue;\n if (curData.useGrouping) {\n /* eslint-disable @typescript-eslint/no-explicit-any */\n fValue = this.groupNumbers(fValue, curData.groupData.primary, curData.groupSeparator || ',', dOptions.numberMapper.numberSymbols[mapper[3]] || '.', curData.groupData.secondary);\n }\n fValue = parser.convertValueParts(fValue, base.latnParseRegex, dOptions.numberMapper.mapper);\n if (curData.nlead === 'N/A') {\n return curData.nlead;\n }\n else {\n if (fValue === '0' && option && option.format === '0') {\n return fValue + curData.nend;\n }\n return curData.nlead + fValue + curData.nend;\n }\n }\n };\n /**\n * Returns significant digits processed numeric string\n *\n * @param {number} value ?\n * @param {number} min ?\n * @param {number} max ?\n * @returns {string} ?\n */\n NumberFormat.processSignificantDigits = function (value, min, max) {\n var temp = value + '';\n var tn;\n var length = temp.length;\n if (length < min) {\n return value.toPrecision(min);\n }\n else {\n temp = value.toPrecision(max);\n tn = +temp;\n return tn + '';\n }\n };\n /**\n * Returns grouped numeric string\n *\n * @param {string} val ?\n * @param {number} level1 ?\n * @param {string} sep ?\n * @param {string} decimalSymbol ?\n * @param {number} level2 ?\n * @returns {string} ?\n */\n NumberFormat.groupNumbers = function (val, level1, sep, decimalSymbol, level2) {\n var flag = !isNullOrUndefined(level2) && level2 !== 0;\n var split = val.split(decimalSymbol);\n var prefix = split[0];\n var length = prefix.length;\n var str = '';\n while (length > level1) {\n str = prefix.slice(length - level1, length) + (str.length ?\n (sep + str) : '');\n length -= level1;\n if (flag) {\n level1 = level2;\n flag = false;\n }\n }\n split[0] = prefix.slice(0, length) + (str.length ? sep : '') + str;\n return split.join(decimalSymbol);\n };\n /**\n * Returns fraction processed numeric string\n *\n * @param {number} value ?\n * @param {number} min ?\n * @param {number} max ?\n * @param {NumberFormatOptions} [option] ?\n * @returns {string} ?\n */\n NumberFormat.processFraction = function (value, min, max, option) {\n var temp = (value + '').split('.')[1];\n var length = temp ? temp.length : 0;\n if (min && length < min) {\n var ret = '';\n if (length === 0) {\n ret = value.toFixed(min);\n }\n else {\n ret += value;\n for (var j = 0; j < min - length; j++) {\n ret += '0';\n }\n return ret;\n }\n return value.toFixed(min);\n }\n else if (!isNullOrUndefined(max) && (length > max || max === 0)) {\n return value.toFixed(max);\n }\n var str = value + '';\n if (str[0] === '0' && option && option.format === '###.00') {\n str = str.slice(1);\n }\n return str;\n };\n /**\n * Returns integer processed numeric string\n *\n * @param {string} value ?\n * @param {number} min ?\n * @returns {string} ?\n */\n NumberFormat.processMinimumIntegers = function (value, min) {\n var temp = value.split('.');\n var lead = temp[0];\n var len = lead.length;\n if (len < min) {\n for (var i = 0; i < min - len; i++) {\n lead = '0' + lead;\n }\n temp[0] = lead;\n }\n return temp.join('.');\n };\n /**\n * Returns custom format for pivot table\n *\n * @param {number} value ?\n * @returns {string} ?\n */\n NumberFormat.customPivotFormat = function (value) {\n if (value >= 500000) {\n value /= 1000000;\n // eslint-disable-next-line\n var _a = value.toString().split('.'), integer = _a[0], decimal = _a[1];\n return decimal && +decimal.substring(0, 1) >= 5\n ? Math.ceil(value).toString()\n : Math.floor(value).toString();\n }\n return '';\n };\n return NumberFormat;\n}());\nexport { NumberFormat };\n","import { IntlBase as base } from './intl-base';\nimport { ParserBase as parser } from './parser-base';\nimport { isUndefined, throwError, getValue, isNullOrUndefined, isBlazor } from '../util';\nimport { datePartMatcher } from './date-formatter';\nimport { HijriParser } from '../hijri-parser';\nvar standalone = 'stand-alone';\nvar latnRegex = /^[0-9]*$/;\nvar timeSetter = {\n minute: 'setMinutes',\n hour: 'setHours',\n second: 'setSeconds',\n day: 'setDate',\n month: 'setMonth',\n milliseconds: 'setMilliseconds'\n};\nvar month = 'months';\n/* tslint:disable no-any */\n/**\n * Date Parser.\n *\n * @private\n */\nvar DateParser = /** @class */ (function () {\n function DateParser() {\n }\n /**\n * Returns the parser function for given skeleton.\n *\n * @param {string} culture - Specifies the culture name to be which formatting.\n * @param {DateFormatOptions} option - Specific the format in which string date will be parsed.\n * @param {Object} cldr - Specifies the global cldr data collection.\n * @returns {Function} ?\n */\n DateParser.dateParser = function (culture, option, cldr) {\n var _this = this;\n var dependable = base.getDependables(cldr, culture, option.calendar);\n var numOptions = parser.getCurrentNumericOptions(dependable.parserObject, parser.getNumberingSystem(cldr), false, isBlazor());\n var parseOptions = {};\n if (isBlazor() && option.isServerRendered) {\n option = base.compareBlazorDateFormats(option, culture);\n }\n var resPattern = option.format ||\n base.getResultantPattern(option.skeleton, dependable.dateObject, option.type, false, isBlazor() ? culture : '');\n var regexString = '';\n var hourOnly;\n if (isUndefined(resPattern)) {\n throwError('Format options or type given must be invalid');\n }\n else {\n resPattern = base.ConvertDateToWeekFormat(resPattern);\n parseOptions = { isIslamic: base.islamicRegex.test(option.calendar), pattern: resPattern, evalposition: {}, culture: culture };\n var patternMatch = resPattern.match(base.dateParseRegex) || [];\n var length_1 = patternMatch.length;\n var gmtCorrection = 0;\n var zCorrectTemp = 0;\n var isgmtTraversed = false;\n var nRegx = numOptions.numericRegex;\n // eslint-disable-next-line\n var numMapper = isBlazor() ? dependable.parserObject.numbers :\n parser.getNumberMapper(dependable.parserObject, parser.getNumberingSystem(cldr));\n for (var i = 0; i < length_1; i++) {\n var str = patternMatch[parseInt(i.toString(), 10)];\n var len = str.length;\n var char = (str[0] === 'K') ? 'h' : str[0];\n var isNumber = void 0;\n var canUpdate = void 0;\n // eslint-disable-next-line\n var charKey = datePartMatcher[char];\n var optional = (len === 2) ? '' : '?';\n if (isgmtTraversed) {\n gmtCorrection = zCorrectTemp;\n isgmtTraversed = false;\n }\n switch (char) {\n case 'E':\n case 'c':\n // eslint-disable-next-line\n var weekData = void 0;\n if (isBlazor()) {\n // eslint-disable-next-line\n weekData = getValue('days.' + base.monthIndex[len], dependable.dateObject);\n }\n else {\n // eslint-disable-next-line\n weekData = dependable.dateObject[base.days][standalone][base.monthIndex[len]];\n }\n // eslint-disable-next-line\n var weekObject = parser.reverseObject(weekData);\n // tslint:enable\n regexString += '(' + Object.keys(weekObject).join('|') + ')';\n break;\n case 'M':\n case 'L':\n case 'd':\n case 'm':\n case 's':\n case 'h':\n case 'H':\n case 'f':\n canUpdate = true;\n if ((char === 'M' || char === 'L') && len > 2) {\n var monthData = void 0;\n if (isBlazor()) {\n // eslint-disable-next-line\n monthData = getValue('months.' + base.monthIndex[len], dependable.dateObject);\n }\n else {\n // eslint-disable-next-line\n monthData = dependable.dateObject[month][standalone][base.monthIndex[len]];\n }\n // eslint-disable-next-line\n parseOptions[charKey] = parser.reverseObject(monthData);\n // eslint-disable-next-line\n regexString += '(' + Object.keys(parseOptions[charKey]).join('|') + ')';\n }\n else if (char === 'f') {\n if (len > 3) {\n continue;\n }\n isNumber = true;\n regexString += '(' + nRegx + nRegx + '?' + nRegx + '?' + ')';\n }\n else {\n isNumber = true;\n regexString += '(' + nRegx + nRegx + optional + ')';\n }\n if (char === 'h') {\n parseOptions.hour12 = true;\n }\n break;\n case 'W':\n // eslint-disable-next-line\n var opt = len === 1 ? '?' : '';\n regexString += '(' + nRegx + opt + nRegx + ')';\n break;\n case 'y':\n canUpdate = isNumber = true;\n if (len === 2) {\n regexString += '(' + nRegx + nRegx + ')';\n }\n else {\n regexString += '(' + nRegx + '{' + len + ',})';\n }\n break;\n case 'a':\n canUpdate = true;\n // eslint-disable-next-line\n var periodValur = isBlazor() ?\n getValue('dayPeriods', dependable.dateObject) :\n getValue('dayPeriods.format.wide', dependable.dateObject);\n // eslint-disable-next-line\n parseOptions[charKey] = parser.reverseObject(periodValur);\n // eslint-disable-next-line\n regexString += '(' + Object.keys(parseOptions[charKey]).join('|') + ')';\n break;\n case 'G':\n canUpdate = true;\n // eslint-disable-next-line\n var eText = (len <= 3) ? 'eraAbbr' : (len === 4) ? 'eraNames' : 'eraNarrow';\n // eslint-disable-next-line\n parseOptions[charKey] = parser.reverseObject(isBlazor() ?\n getValue('eras', dependable.dateObject) : getValue('eras.' + eText, dependable.dateObject));\n // eslint-disable-next-line\n regexString += '(' + Object.keys(parseOptions[charKey]).join('|') + '?)';\n break;\n case 'z':\n // eslint-disable-next-line\n var tval = new Date().getTimezoneOffset();\n canUpdate = (tval !== 0);\n // eslint-disable-next-line\n parseOptions[charKey] = getValue('dates.timeZoneNames', dependable.parserObject);\n // eslint-disable-next-line\n var tzone = parseOptions[charKey];\n hourOnly = (len < 4);\n // eslint-disable-next-line\n var hpattern = hourOnly ? '+H;-H' : tzone.hourFormat;\n hpattern = hpattern.replace(/:/g, numMapper.timeSeparator);\n regexString += '(' + this.parseTimeZoneRegx(hpattern, tzone, nRegx) + ')?';\n isgmtTraversed = true;\n zCorrectTemp = hourOnly ? 6 : 12;\n break;\n case '\\'':\n // eslint-disable-next-line\n var iString = str.replace(/'/g, '');\n regexString += '(' + iString + ')?';\n break;\n default:\n regexString += '([\\\\D])';\n break;\n }\n if (canUpdate) {\n parseOptions.evalposition[\"\" + charKey] = { isNumber: isNumber, pos: i + 1 + gmtCorrection, hourOnly: hourOnly };\n }\n if (i === length_1 - 1 && !isNullOrUndefined(regexString)) {\n var regExp = RegExp;\n parseOptions.parserRegex = new regExp('^' + regexString + '$', 'i');\n }\n }\n }\n return function (value) {\n var parsedDateParts = _this.internalDateParse(value, parseOptions, numOptions);\n if (isNullOrUndefined(parsedDateParts) || !Object.keys(parsedDateParts).length) {\n return null;\n }\n if (parseOptions.isIslamic) {\n var dobj = {};\n var tYear = parsedDateParts.year;\n var tDate = parsedDateParts.day;\n var tMonth = parsedDateParts.month;\n var ystrig = tYear ? (tYear + '') : '';\n var is2DigitYear = (ystrig.length === 2);\n if (!tYear || !tMonth || !tDate || is2DigitYear) {\n dobj = HijriParser.getHijriDate(new Date());\n }\n if (is2DigitYear) {\n tYear = parseInt((dobj.year + '').slice(0, 2) + ystrig, 10);\n }\n // tslint:disable-next-line\n var dateObject = HijriParser.toGregorian(tYear || dobj.year, tMonth || dobj.month, tDate || dobj.date);\n parsedDateParts.year = dateObject.getFullYear();\n parsedDateParts.month = dateObject.getMonth() + 1;\n parsedDateParts.day = dateObject.getDate();\n }\n return _this.getDateObject(parsedDateParts);\n };\n };\n /* tslint:disable */\n /**\n * Returns date object for provided date options\n *\n * @param {DateParts} options ?\n * @param {Date} value ?\n * @returns {Date} ?\n */\n DateParser.getDateObject = function (options, value) {\n var res = value || new Date();\n res.setMilliseconds(0);\n var tKeys = ['hour', 'minute', 'second', 'milliseconds', 'month', 'day'];\n var y = options.year;\n var desig = options.designator;\n var tzone = options.timeZone;\n if (!isUndefined(y)) {\n var len = (y + '').length;\n if (len <= 2) {\n var century = Math.floor(res.getFullYear() / 100) * 100;\n y += century;\n }\n res.setFullYear(y);\n }\n for (var _i = 0, tKeys_1 = tKeys; _i < tKeys_1.length; _i++) {\n var key = tKeys_1[_i];\n // eslint-disable-next-line\n var tValue = options[key];\n if (isUndefined(tValue) && key === 'day') {\n res.setDate(1);\n }\n if (!isUndefined(tValue)) {\n if (key === 'month') {\n tValue -= 1;\n if (tValue < 0 || tValue > 11) {\n return new Date('invalid');\n }\n var pDate = res.getDate();\n res.setDate(1);\n // eslint-disable-next-line\n res[timeSetter[key]](tValue);\n var lDate = new Date(res.getFullYear(), tValue + 1, 0).getDate();\n res.setDate(pDate < lDate ? pDate : lDate);\n }\n else {\n if (key === 'day') {\n var lastDay = new Date(res.getFullYear(), res.getMonth() + 1, 0).getDate();\n if ((tValue < 1 || tValue > lastDay)) {\n return null;\n }\n }\n // eslint-disable-next-line\n res[timeSetter[key]](tValue);\n }\n }\n }\n if (!isUndefined(desig)) {\n var hour = res.getHours();\n if (desig === 'pm') {\n res.setHours(hour + (hour === 12 ? 0 : 12));\n }\n else if (hour === 12) {\n res.setHours(0);\n }\n }\n if (!isUndefined(tzone)) {\n var tzValue = tzone - res.getTimezoneOffset();\n if (tzValue !== 0) {\n res.setMinutes(res.getMinutes() + tzValue);\n }\n }\n return res;\n };\n /**\n * Returns date parsing options for provided value along with parse and numeric options\n *\n * @param {string} value ?\n * @param {ParseOptions} parseOptions ?\n * @param {NumericOptions} num ?\n * @returns {DateParts} ?\n */\n DateParser.internalDateParse = function (value, parseOptions, num) {\n var matches = value.match(parseOptions.parserRegex);\n var retOptions = { 'hour': 0, 'minute': 0, 'second': 0 };\n if (isNullOrUndefined(matches)) {\n return null;\n }\n else {\n var props = Object.keys(parseOptions.evalposition);\n for (var _i = 0, props_1 = props; _i < props_1.length; _i++) {\n var prop = props_1[_i];\n var curObject = parseOptions.evalposition[\"\" + prop];\n var matchString = matches[curObject.pos];\n if (curObject.isNumber) {\n // eslint-disable-next-line\n retOptions[prop] = this.internalNumberParser(matchString, num);\n }\n else {\n if (prop === 'timeZone' && !isUndefined(matchString)) {\n var pos = curObject.pos;\n var val = void 0;\n var tmatch = matches[pos + 1];\n var flag = !isUndefined(tmatch);\n if (curObject.hourOnly) {\n val = this.getZoneValue(flag, tmatch, matches[pos + 4], num) * 60;\n }\n else {\n val = this.getZoneValue(flag, tmatch, matches[pos + 7], num) * 60;\n val += this.getZoneValue(flag, matches[pos + 4], matches[pos + 10], num);\n }\n if (!isNullOrUndefined(val)) {\n retOptions[\"\" + prop] = val;\n }\n }\n else {\n var cultureOptions = ['en-US', 'en-MH', 'en-MP'];\n // eslint-disable-next-line\n matchString = ((prop === 'month') && (!parseOptions.isIslamic) && (parseOptions.culture === 'en' || parseOptions.culture === 'en-GB' || parseOptions.culture === 'en-US'))\n ? matchString[0].toUpperCase() + matchString.substring(1).toLowerCase() : matchString;\n // eslint-disable-next-line\n matchString = ((prop !== 'month') && (prop === 'designator') && parseOptions.culture && parseOptions.culture.indexOf('en-') !== -1 && cultureOptions.indexOf(parseOptions.culture) === -1)\n ? matchString.toLowerCase() : matchString;\n // eslint-disable-next-line\n retOptions[prop] = parseOptions[prop][matchString];\n }\n }\n }\n if (parseOptions.hour12) {\n retOptions.hour12 = true;\n }\n }\n return retOptions;\n };\n /**\n * Returns parsed number for provided Numeric string and Numeric Options\n *\n * @param {string} value ?\n * @param {NumericOptions} option ?\n * @returns {number} ?\n */\n DateParser.internalNumberParser = function (value, option) {\n value = parser.convertValueParts(value, option.numberParseRegex, option.numericPair);\n if (latnRegex.test(value)) {\n return +value;\n }\n return null;\n };\n /**\n * Returns parsed time zone RegExp for provided hour format and time zone\n *\n * @param {string} hourFormat ?\n * @param {base.TimeZoneOptions} tZone ?\n * @param {string} nRegex ?\n * @returns {string} ?\n */\n DateParser.parseTimeZoneRegx = function (hourFormat, tZone, nRegex) {\n var pattern = tZone.gmtFormat;\n var ret;\n var cRegex = '(' + nRegex + ')' + '(' + nRegex + ')';\n var splitStr;\n ret = hourFormat.replace('+', '\\\\+');\n if (hourFormat.indexOf('HH') !== -1) {\n ret = ret.replace(/HH|mm/g, '(' + cRegex + ')');\n }\n else {\n ret = ret.replace(/H|m/g, '(' + cRegex + '?)');\n }\n // eslint-disable-next-line\n splitStr = (ret.split(';').map(function (str) {\n return pattern.replace('{0}', str);\n }));\n ret = splitStr.join('|') + '|' + tZone.gmtZeroFormat;\n return ret;\n };\n /**\n * Returns zone based value.\n *\n * @param {boolean} flag ?\n * @param {string} val1 ?\n * @param {string} val2 ?\n * @param {NumericOptions} num ?\n * @returns {number} ?\n */\n DateParser.getZoneValue = function (flag, val1, val2, num) {\n var ival = flag ? val1 : val2;\n if (!ival) {\n return 0;\n }\n var value = this.internalNumberParser(ival, num);\n if (flag) {\n return -value;\n }\n return value;\n };\n return DateParser;\n}());\nexport { DateParser };\n","import { extend, isNullOrUndefined, isBlazor, getValue } from '../util';\nimport { ParserBase as parser } from './parser-base';\nimport { IntlBase as base } from './intl-base';\nvar regExp = RegExp;\n// eslint-disable-next-line\nvar parseRegex = new regExp('^([^0-9]*)' + '(([0-9,]*[0-9]+)(\\.[0-9]+)?)' + '([Ee][+-]?[0-9]+)?([^0-9]*)$');\nvar groupRegex = /,/g;\nvar keys = ['minusSign', 'infinity'];\n/**\n * Module for Number Parser.\n *\n * @private\n */\nvar NumberParser = /** @class */ (function () {\n function NumberParser() {\n }\n /**\n * Returns the parser function for given skeleton.\n *\n * @param {string} culture - Specifies the culture name to be which formatting.\n * @param {NumberFormatOptions} option - Specific the format in which number will parsed.\n * @param {Object} cldr - Specifies the global cldr data collection.\n * @returns {Function} ?\n */\n NumberParser.numberParser = function (culture, option, cldr) {\n var _this = this;\n var dependable = base.getDependables(cldr, culture, '', true);\n var parseOptions = { custom: true };\n var numOptions;\n if ((base.formatRegex.test(option.format)) || !(option.format)) {\n extend(parseOptions, base.getProperNumericSkeleton(option.format || 'N'));\n parseOptions.custom = false;\n if (!parseOptions.fractionDigits) {\n if (option.maximumFractionDigits) {\n parseOptions.maximumFractionDigits = option.maximumFractionDigits;\n }\n }\n }\n else {\n extend(parseOptions, base.customFormat(option.format, null, null));\n }\n var numbers = getValue('numbers', dependable.parserObject);\n // eslint-disable-next-line\n numOptions = parser.getCurrentNumericOptions(dependable.parserObject, parser.getNumberingSystem(cldr), true, isBlazor());\n parseOptions.symbolRegex = parser.getSymbolRegex(Object.keys(numOptions.symbolMatch));\n // eslint-disable-next-line\n parseOptions.infinity = numOptions.symbolNumberSystem[keys[1]];\n var symbolpattern;\n if (!isBlazor()) {\n symbolpattern = base.getSymbolPattern(parseOptions.type, numOptions.numberSystem, dependable.numericObject, parseOptions.isAccount);\n if (symbolpattern) {\n symbolpattern = symbolpattern.replace(/\\u00A4/g, base.defaultCurrency);\n var split = symbolpattern.split(';');\n parseOptions.nData = base.getFormatData(split[1] || '-' + split[0], true, '');\n parseOptions.pData = base.getFormatData(split[0], true, '');\n }\n }\n else {\n parseOptions.nData = extend({}, {}, getValue(parseOptions.type + 'nData', numbers));\n parseOptions.pData = extend({}, {}, getValue(parseOptions.type + 'pData', numbers));\n if (parseOptions.type === 'currency' && option.currency) {\n base.replaceBlazorCurrency([parseOptions.pData, parseOptions.nData], getValue('currencySymbol', numbers), option.currency);\n }\n }\n return function (value) {\n return _this.getParsedNumber(value, parseOptions, numOptions);\n };\n };\n /**\n * Returns parsed number for the provided formatting options\n *\n * @param {string} value ?\n * @param {NumericParts} options ?\n * @param {NumericOptions} numOptions ?\n * @returns {number} ?\n */\n NumberParser.getParsedNumber = function (value, options, numOptions) {\n var isNegative;\n var isPercent;\n var tempValue;\n var lead;\n var end;\n var ret;\n if (value.indexOf(options.infinity) !== -1) {\n return Infinity;\n }\n else {\n value = parser.convertValueParts(value, options.symbolRegex, numOptions.symbolMatch);\n value = parser.convertValueParts(value, numOptions.numberParseRegex, numOptions.numericPair);\n value = value.indexOf('-') !== -1 ? value.replace('-.', '-0.') : value;\n if (value.indexOf('.') === 0) {\n value = '0' + value;\n }\n var matches = value.match(parseRegex);\n if (isNullOrUndefined(matches)) {\n return NaN;\n }\n lead = matches[1];\n tempValue = matches[2];\n var exponent = matches[5];\n end = matches[6];\n isNegative = options.custom ? ((lead === options.nData.nlead) && (end === options.nData.nend)) :\n ((lead.indexOf(options.nData.nlead) !== -1) && (end.indexOf(options.nData.nend) !== -1));\n isPercent = isNegative ?\n options.nData.isPercent :\n options.pData.isPercent;\n tempValue = tempValue.replace(groupRegex, '');\n if (exponent) {\n tempValue += exponent;\n }\n ret = +tempValue;\n if (options.type === 'percent' || isPercent) {\n ret = ret / 100;\n }\n if (options.custom || options.fractionDigits) {\n ret = parseFloat(ret.toFixed(options.custom ?\n (isNegative ? options.nData.maximumFractionDigits : options.pData.maximumFractionDigits) : options.fractionDigits));\n }\n if (options.maximumFractionDigits) {\n ret = this.convertMaxFracDigits(tempValue, options, ret, isNegative);\n }\n if (isNegative) {\n ret *= -1;\n }\n return ret;\n }\n };\n NumberParser.convertMaxFracDigits = function (value, options, ret, isNegative) {\n var decimalSplitValue = value.split('.');\n if (decimalSplitValue[1] && decimalSplitValue[1].length > options.maximumFractionDigits) {\n ret = +(ret.toFixed(options.custom ?\n (isNegative ? options.nData.maximumFractionDigits : options.pData.maximumFractionDigits) : options.maximumFractionDigits));\n }\n return ret;\n };\n return NumberParser;\n}());\nexport { NumberParser };\n","import { isNullOrUndefined, getValue, extend, isBlazor } from './util';\nvar Observer = /** @class */ (function () {\n function Observer(context) {\n this.ranArray = [];\n this.boundedEvents = {};\n if (isNullOrUndefined(context)) {\n return;\n }\n this.context = context;\n }\n /**\n * To attach handler for given property in current context.\n *\n * @param {string} property - specifies the name of the event.\n * @param {Function} handler - Specifies the handler function to be called while event notified.\n * @param {Object} context - Specifies the context binded to the handler.\n * @param {string} id - specifies the random generated id.\n * @returns {void}\n */\n Observer.prototype.on = function (property, handler, context, id) {\n if (isNullOrUndefined(handler)) {\n return;\n }\n var cntxt = context || this.context;\n if (this.notExist(property)) {\n this.boundedEvents[\"\" + property] = [{ handler: handler, context: cntxt, id: id }];\n return;\n }\n if (!isNullOrUndefined(id)) {\n if (this.ranArray.indexOf(id) === -1) {\n this.ranArray.push(id);\n this.boundedEvents[\"\" + property].push({ handler: handler, context: cntxt, id: id });\n }\n }\n else if (!this.isHandlerPresent(this.boundedEvents[\"\" + property], handler)) {\n this.boundedEvents[\"\" + property].push({ handler: handler, context: cntxt });\n }\n };\n /**\n * To remove handlers from a event attached using on() function.\n *\n * @param {string} property - specifies the name of the event.\n * @param {Function} handler - Optional argument specifies the handler function to be called while event notified.\n * @param {string} id - specifies the random generated id.\n * @returns {void} ?\n */\n Observer.prototype.off = function (property, handler, id) {\n if (this.notExist(property)) {\n return;\n }\n var curObject = getValue(property, this.boundedEvents);\n if (handler) {\n for (var i = 0; i < curObject.length; i++) {\n if (id) {\n if (curObject[parseInt(i.toString(), 10)].id === id) {\n curObject.splice(i, 1);\n var indexLocation = this.ranArray.indexOf(id);\n if (indexLocation !== -1) {\n this.ranArray.splice(indexLocation, 1);\n }\n break;\n }\n }\n else if (handler === curObject[parseInt(i.toString(), 10)].handler) {\n curObject.splice(i, 1);\n break;\n }\n }\n }\n else {\n delete this.boundedEvents[\"\" + property];\n }\n };\n /**\n * To notify the handlers in the specified event.\n *\n * @param {string} property - Specifies the event to be notify.\n * @param {Object} argument - Additional parameters to pass while calling the handler.\n * @param {Function} successHandler - this function will invoke after event successfully triggered\n * @param {Function} errorHandler - this function will invoke after event if it was failure to call.\n * @returns {void} ?\n */\n Observer.prototype.notify = function (property, argument, successHandler, errorHandler) {\n if (this.notExist(property)) {\n if (successHandler) {\n successHandler.call(this, argument);\n }\n return;\n }\n if (argument) {\n argument.name = property;\n }\n var blazor = 'Blazor';\n var curObject = getValue(property, this.boundedEvents).slice(0);\n if (window[\"\" + blazor]) {\n return this.blazorCallback(curObject, argument, successHandler, errorHandler, 0);\n }\n else {\n for (var _i = 0, curObject_1 = curObject; _i < curObject_1.length; _i++) {\n var cur = curObject_1[_i];\n cur.handler.call(cur.context, argument);\n }\n if (successHandler) {\n successHandler.call(this, argument);\n }\n }\n };\n Observer.prototype.blazorCallback = function (objs, argument, successHandler, errorHandler, index) {\n var _this = this;\n var isTrigger = index === objs.length - 1;\n if (index < objs.length) {\n var obj_1 = objs[parseInt(index.toString(), 10)];\n var promise = obj_1.handler.call(obj_1.context, argument);\n if (promise && typeof promise.then === 'function') {\n if (!successHandler) {\n return promise;\n }\n promise.then(function (data) {\n data = typeof data === 'string' && _this.isJson(data) ? JSON.parse(data, _this.dateReviver) : data;\n extend(argument, argument, data, true);\n if (successHandler && isTrigger) {\n successHandler.call(obj_1.context, argument);\n }\n else {\n return _this.blazorCallback(objs, argument, successHandler, errorHandler, index + 1);\n }\n }).catch(function (data) {\n if (errorHandler) {\n errorHandler.call(obj_1.context, typeof data === 'string' &&\n _this.isJson(data) ? JSON.parse(data, _this.dateReviver) : data);\n }\n });\n }\n else if (successHandler && isTrigger) {\n successHandler.call(obj_1.context, argument);\n }\n else {\n return this.blazorCallback(objs, argument, successHandler, errorHandler, index + 1);\n }\n }\n };\n // eslint-disable-next-line\n Observer.prototype.dateReviver = function (key, value) {\n var dPattern = /^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}/;\n if (isBlazor && typeof value === 'string' && value.match(dPattern) !== null) {\n return (new Date(value));\n }\n return (value);\n };\n Observer.prototype.isJson = function (value) {\n try {\n JSON.parse(value);\n }\n catch (e) {\n return false;\n }\n return true;\n };\n /**\n * To destroy handlers in the event\n *\n * @returns {void} ?\n */\n Observer.prototype.destroy = function () {\n this.boundedEvents = this.context = undefined;\n };\n /**\n * To remove internationalization events\n *\n * @returns {void} ?\n */\n Observer.prototype.offIntlEvents = function () {\n // eslint-disable-next-line\n var eventsArr = this.boundedEvents['notifyExternalChange'];\n if (eventsArr) {\n for (var i = 0; i < eventsArr.length; i++) {\n // eslint-disable-next-line\n var curContext = eventsArr[\"\" + i].context;\n if (curContext && curContext.detectFunction && curContext.randomId && !curContext.isRendered) {\n this.off('notifyExternalChange', curContext.detectFunction, curContext.randomId);\n i--;\n }\n }\n if (!this.boundedEvents['notifyExternalChange'].length) {\n delete this.boundedEvents['notifyExternalChange'];\n }\n }\n };\n /**\n * Returns if the property exists.\n *\n * @param {string} prop ?\n * @returns {boolean} ?\n */\n Observer.prototype.notExist = function (prop) {\n // eslint-disable-next-line\n return this.boundedEvents.hasOwnProperty(prop) === false || this.boundedEvents[prop].length <= 0;\n };\n /**\n * Returns if the handler is present.\n *\n * @param {BoundOptions[]} boundedEvents ?\n * @param {Function} handler ?\n * @returns {boolean} ?\n */\n Observer.prototype.isHandlerPresent = function (boundedEvents, handler) {\n for (var _i = 0, boundedEvents_1 = boundedEvents; _i < boundedEvents_1.length; _i++) {\n var cur = boundedEvents_1[_i];\n if (cur.handler === handler) {\n return true;\n }\n }\n return false;\n };\n return Observer;\n}());\nexport { Observer };\n","import { DateFormat } from './intl/date-formatter';\nimport { NumberFormat } from './intl/number-formatter';\nimport { DateParser } from './intl/date-parser';\nimport { NumberParser } from './intl/number-parser';\nimport { IntlBase } from './intl/intl-base';\nimport { extend, getValue, isBlazor } from './util';\nimport { Observer } from './observer';\n/**\n * Specifies the observer used for external change detection.\n */\nexport var onIntlChange = new Observer();\n/**\n * Specifies the default rtl status for EJ2 components.\n */\nexport var rightToLeft = false;\n/**\n * Specifies the CLDR data loaded for internationalization functionalities.\n *\n * @private\n */\nexport var cldrData = {};\n/**\n * Specifies the default culture value to be considered.\n *\n * @private\n */\nexport var defaultCulture = 'en-US';\n/**\n * Specifies default currency code to be considered\n *\n * @private\n */\nexport var defaultCurrencyCode = 'USD';\nvar mapper = ['numericObject', 'dateObject'];\n/**\n * Internationalization class provides support to parse and format the number and date object to the desired format.\n * ```typescript\n * // To set the culture globally\n * setCulture('en-GB');\n *\n * // To set currency code globally\n * setCurrencyCode('EUR');\n *\n * //Load cldr data\n * loadCldr(gregorainData);\n * loadCldr(timeZoneData);\n * loadCldr(numbersData);\n * loadCldr(numberSystemData);\n *\n * // To use formatter in component side\n * let Intl:Internationalization = new Internationalization();\n *\n * // Date formatting\n * let dateFormatter: Function = Intl.getDateFormat({skeleton:'long',type:'dateTime'});\n * dateFormatter(new Date('11/2/2016'));\n * dateFormatter(new Date('25/2/2030'));\n * Intl.formatDate(new Date(),{skeleton:'E'});\n *\n * //Number formatting\n * let numberFormatter: Function = Intl.getNumberFormat({skeleton:'C5'})\n * numberFormatter(24563334);\n * Intl.formatNumber(123123,{skeleton:'p2'});\n *\n * // Date parser\n * let dateParser: Function = Intl.getDateParser({skeleton:'short',type:'time'});\n * dateParser('10:30 PM');\n * Intl.parseDate('10',{skeleton:'H'});\n * ```\n */\nvar Internationalization = /** @class */ (function () {\n function Internationalization(cultureName) {\n if (cultureName) {\n this.culture = cultureName;\n }\n }\n /**\n * Returns the format function for given options.\n *\n * @param {DateFormatOptions} options - Specifies the format options in which the format function will return.\n * @returns {Function} ?\n */\n Internationalization.prototype.getDateFormat = function (options) {\n return DateFormat.dateFormat(this.getCulture(), options || { type: 'date', skeleton: 'short' }, cldrData);\n };\n /**\n * Returns the format function for given options.\n *\n * @param {NumberFormatOptions} options - Specifies the format options in which the format function will return.\n * @returns {Function} ?\n */\n Internationalization.prototype.getNumberFormat = function (options) {\n if (options && !options.currency) {\n options.currency = defaultCurrencyCode;\n }\n if (isBlazor() && options && !options.format) {\n options.minimumFractionDigits = 0;\n }\n return NumberFormat.numberFormatter(this.getCulture(), options || {}, cldrData);\n };\n /**\n * Returns the parser function for given options.\n *\n * @param {DateFormatOptions} options - Specifies the format options in which the parser function will return.\n * @returns {Function} ?\n */\n Internationalization.prototype.getDateParser = function (options) {\n return DateParser.dateParser(this.getCulture(), options || { skeleton: 'short', type: 'date' }, cldrData);\n };\n /**\n * Returns the parser function for given options.\n *\n * @param {NumberFormatOptions} options - Specifies the format options in which the parser function will return.\n * @returns {Function} ?\n */\n Internationalization.prototype.getNumberParser = function (options) {\n if (isBlazor() && options && !options.format) {\n options.minimumFractionDigits = 0;\n }\n return NumberParser.numberParser(this.getCulture(), options || { format: 'N' }, cldrData);\n };\n /**\n * Returns the formatted string based on format options.\n *\n * @param {number} value - Specifies the number to format.\n * @param {NumberFormatOptions} option - Specifies the format options in which the number will be formatted.\n * @returns {string} ?\n */\n Internationalization.prototype.formatNumber = function (value, option) {\n return this.getNumberFormat(option)(value);\n };\n /**\n * Returns the formatted date string based on format options.\n *\n * @param {Date} value - Specifies the number to format.\n * @param {DateFormatOptions} option - Specifies the format options in which the number will be formatted.\n * @returns {string} ?\n */\n Internationalization.prototype.formatDate = function (value, option) {\n return this.getDateFormat(option)(value);\n };\n /**\n * Returns the date object for given date string and options.\n *\n * @param {string} value - Specifies the string to parse.\n * @param {DateFormatOptions} option - Specifies the parse options in which the date string will be parsed.\n * @returns {Date} ?\n */\n Internationalization.prototype.parseDate = function (value, option) {\n return this.getDateParser(option)(value);\n };\n /**\n * Returns the number object from the given string value and options.\n *\n * @param {string} value - Specifies the string to parse.\n * @param {NumberFormatOptions} option - Specifies the parse options in which the string number will be parsed.\n * @returns {number} ?\n */\n Internationalization.prototype.parseNumber = function (value, option) {\n return this.getNumberParser(option)(value);\n };\n /**\n * Returns Native Date Time Pattern\n *\n * @param {DateFormatOptions} option - Specifies the parse options for resultant date time pattern.\n * @param {boolean} isExcelFormat - Specifies format value to be converted to excel pattern.\n * @returns {string} ?\n * @private\n */\n Internationalization.prototype.getDatePattern = function (option, isExcelFormat) {\n return IntlBase.getActualDateTimeFormat(this.getCulture(), option, cldrData, isExcelFormat);\n };\n /**\n * Returns Native Number Pattern\n *\n * @param {NumberFormatOptions} option - Specifies the parse options for resultant number pattern.\n * @param {boolean} isExcel ?\n * @returns {string} ?\n * @private\n */\n Internationalization.prototype.getNumberPattern = function (option, isExcel) {\n return IntlBase.getActualNumberFormat(this.getCulture(), option, cldrData, isExcel);\n };\n /**\n * Returns the First Day of the Week\n *\n * @returns {number} ?\n */\n Internationalization.prototype.getFirstDayOfWeek = function () {\n return IntlBase.getWeekData(this.getCulture(), cldrData);\n };\n /**\n * Returns the culture\n *\n * @returns {string} ?\n */\n Internationalization.prototype.getCulture = function () {\n return this.culture || defaultCulture;\n };\n return Internationalization;\n}());\nexport { Internationalization };\n/**\n * Set the default culture to all EJ2 components\n *\n * @param {string} cultureName - Specifies the culture name to be set as default culture.\n * @returns {void} ?\n */\nexport function setCulture(cultureName) {\n defaultCulture = cultureName;\n onIntlChange.notify('notifyExternalChange', { 'locale': defaultCulture });\n}\n/**\n * Set the default currency code to all EJ2 components\n *\n * @param {string} currencyCode Specifies the culture name to be set as default culture.\n * @returns {void} ?\n */\nexport function setCurrencyCode(currencyCode) {\n defaultCurrencyCode = currencyCode;\n onIntlChange.notify('notifyExternalChange', { 'currencyCode': defaultCurrencyCode });\n}\n/**\n * Load the CLDR data into context\n *\n * @param {Object[]} data Specifies the CLDR data's to be used for formatting and parser.\n * @returns {void} ?\n */\nexport function loadCldr() {\n var data = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n data[_i] = arguments[_i];\n }\n for (var _a = 0, data_1 = data; _a < data_1.length; _a++) {\n var obj = data_1[_a];\n extend(cldrData, obj, {}, true);\n }\n}\n/**\n * To enable or disable RTL functionality for all components globally.\n *\n * @param {boolean} status - Optional argument Specifies the status value to enable or disable rtl option.\n * @returns {void} ?\n */\nexport function enableRtl(status) {\n if (status === void 0) { status = true; }\n rightToLeft = status;\n onIntlChange.notify('notifyExternalChange', { enableRtl: rightToLeft });\n}\n/**\n * To get the numeric CLDR object for given culture\n *\n * @param {string} locale - Specifies the locale for which numericObject to be returned.\n * @param {string} type ?\n * @returns {Object} ?\n * @ignore\n * @private\n */\nexport function getNumericObject(locale, type) {\n // eslint-disable-next-line\n var numObject = IntlBase.getDependables(cldrData, locale, '', true)[mapper[0]];\n // eslint-disable-next-line\n var dateObject = IntlBase.getDependables(cldrData, locale, '')[mapper[1]];\n var numSystem = getValue('defaultNumberingSystem', numObject);\n var symbPattern = isBlazor() ? getValue('numberSymbols', numObject) : getValue('symbols-numberSystem-' + numSystem, numObject);\n var pattern = IntlBase.getSymbolPattern(type || 'decimal', numSystem, numObject, false);\n return extend(symbPattern, IntlBase.getFormatData(pattern, true, '', true), { 'dateSeparator': IntlBase.getDateSeparator(dateObject) });\n}\n/**\n * To get the numeric CLDR number base object for given culture\n *\n * @param {string} locale - Specifies the locale for which numericObject to be returned.\n * @param {string} currency - Specifies the currency for which numericObject to be returned.\n * @returns {string} ?\n * @ignore\n * @private\n */\nexport function getNumberDependable(locale, currency) {\n // eslint-disable-next-line\n var numObject = IntlBase.getDependables(cldrData, locale, '', true);\n // eslint-disable-next-line\n return IntlBase.getCurrencySymbol(numObject.numericObject, currency);\n}\n/**\n * To get the default date CLDR object.\n *\n * @param {string} mode ?\n * @returns {Object} ?\n * @ignore\n * @private\n */\nexport function getDefaultDateObject(mode) {\n // eslint-disable-next-line\n return IntlBase.getDependables(cldrData, '', mode, false)[mapper[1]];\n}\n","import { defaultCurrencyCode } from '../internationalization';\nimport { getValue, isNullOrUndefined, extend, isBlazor } from '../util';\nimport { ParserBase as parser, getBlazorCurrencySymbol } from './parser-base';\nimport { DateFormat } from './date-formatter';\nimport { NumberFormat } from './number-formatter';\nimport { isUndefined } from '../util';\nvar regExp = RegExp;\nexport var blazorCultureFormats = {\n 'en-US': {\n 'd': 'M/d/y',\n 'D': 'EEEE, MMMM d, y',\n 'f': 'EEEE, MMMM d, y h:mm a',\n 'F': 'EEEE, MMMM d, y h:mm:s a',\n 'g': 'M/d/y h:mm a',\n 'G': 'M/d/yyyy h:mm:ss tt',\n 'm': 'MMMM d',\n 'M': 'MMMM d',\n 'r': 'ddd, dd MMM yyyy HH\\':\\'mm\\':\\'ss \\'GMT\\'',\n 'R': 'ddd, dd MMM yyyy HH\\':\\'mm\\':\\'ss \\'GMT\\'',\n 's': 'yyyy\\'-\\'MM\\'-\\'dd\\'T\\'HH\\':\\'mm\\':\\'ss',\n 't': 'h:mm tt',\n 'T': 'h:m:s tt',\n 'u': 'yyyy\\'-\\'MM\\'-\\'dd HH\\':\\'mm\\':\\'ss\\'Z\\'',\n 'U': 'dddd, MMMM d, yyyy h:mm:ss tt',\n 'y': 'MMMM yyyy',\n 'Y': 'MMMM yyyy'\n }\n};\n/**\n * Date base common constants and function for date parser and formatter.\n */\n// eslint-disable-next-line\nexport var IntlBase;\n(function (IntlBase) {\n /* eslint-disable */\n // tslint:disable-next-line:max-line-length.\n IntlBase.negativeDataRegex = /^(('[^']+'|''|[^*#@0,.E])*)(\\*.)?((([#,]*[0,]*0+)(\\.0*[0-9]*#*)?)|([#,]*@+#*))(E\\+?0+)?(('[^']+'|''|[^*#@0,.E])*)$/;\n IntlBase.customRegex = /^(('[^']+'|''|[^*#@0,.])*)(\\*.)?((([0#,]*[0,]*[0#]*[0#\\ ]*)(\\.[0#]*)?)|([#,]*@+#*))(E\\+?0+)?(('[^']+'|''|[^*#@0,.E])*)$/;\n IntlBase.latnParseRegex = /0|1|2|3|4|5|6|7|8|9/g;\n var fractionRegex = /[0-9]/g;\n IntlBase.defaultCurrency = '$';\n var mapper = ['infinity', 'nan', 'group', 'decimal'];\n var patternRegex = /G|M|L|H|c|'| a|yy|y|EEEE|E/g;\n var patternMatch = {\n 'G': '',\n 'M': 'm',\n 'L': 'm',\n 'H': 'h',\n 'c': 'd',\n '\\'': '\"',\n ' a': ' AM/PM',\n 'yy': 'yy',\n 'y': 'yyyy',\n 'EEEE': 'dddd',\n 'E': 'ddd'\n };\n IntlBase.dateConverterMapper = /dddd|ddd/ig;\n var defaultFirstDay = 'sun';\n IntlBase.islamicRegex = /^islamic/;\n var firstDayMapper = {\n 'sun': 0,\n 'mon': 1,\n 'tue': 2,\n 'wed': 3,\n 'thu': 4,\n 'fri': 5,\n 'sat': 6\n };\n IntlBase.formatRegex = new regExp(\"(^[ncpae]{1})([0-1]?[0-9]|20)?$\", \"i\");\n IntlBase.currencyFormatRegex = new regExp(\"(^[ca]{1})([0-1]?[0-9]|20)?$\", \"i\");\n IntlBase.curWithoutNumberRegex = /(c|a)$/ig;\n var typeMapper = {\n '$': 'isCurrency',\n '%': 'isPercent',\n '-': 'isNegative',\n 0: 'nlead',\n 1: 'nend'\n };\n IntlBase.dateParseRegex = /([a-z])\\1*|'([^']|'')+'|''|./gi;\n IntlBase.basicPatterns = ['short', 'medium', 'long', 'full'];\n /* tslint:disable:quotemark */\n IntlBase.defaultObject = {\n 'dates': {\n 'calendars': {\n 'gregorian': {\n 'months': {\n 'stand-alone': {\n 'abbreviated': {\n '1': 'Jan',\n '2': 'Feb',\n '3': 'Mar',\n '4': 'Apr',\n '5': 'May',\n '6': 'Jun',\n '7': 'Jul',\n '8': 'Aug',\n '9': 'Sep',\n '10': 'Oct',\n '11': 'Nov',\n '12': 'Dec'\n },\n 'narrow': {\n '1': 'J',\n '2': 'F',\n '3': 'M',\n '4': 'A',\n '5': 'M',\n '6': 'J',\n '7': 'J',\n '8': 'A',\n '9': 'S',\n '10': 'O',\n '11': 'N',\n '12': 'D'\n },\n 'wide': {\n '1': 'January',\n '2': 'February',\n '3': 'March',\n '4': 'April',\n '5': 'May',\n '6': 'June',\n '7': 'July',\n '8': 'August',\n '9': 'September',\n '10': 'October',\n '11': 'November',\n '12': 'December'\n }\n }\n },\n 'days': {\n 'stand-alone': {\n 'abbreviated': {\n 'sun': 'Sun',\n 'mon': 'Mon',\n 'tue': 'Tue',\n 'wed': 'Wed',\n 'thu': 'Thu',\n 'fri': 'Fri',\n 'sat': 'Sat'\n },\n 'narrow': {\n 'sun': 'S',\n 'mon': 'M',\n 'tue': 'T',\n 'wed': 'W',\n 'thu': 'T',\n 'fri': 'F',\n 'sat': 'S'\n },\n 'short': {\n 'sun': 'Su',\n 'mon': 'Mo',\n 'tue': 'Tu',\n 'wed': 'We',\n 'thu': 'Th',\n 'fri': 'Fr',\n 'sat': 'Sa'\n },\n 'wide': {\n 'sun': 'Sunday',\n 'mon': 'Monday',\n 'tue': 'Tuesday',\n 'wed': 'Wednesday',\n 'thu': 'Thursday',\n 'fri': 'Friday',\n 'sat': 'Saturday'\n }\n }\n },\n 'dayPeriods': {\n 'format': {\n 'wide': {\n 'am': 'AM',\n 'pm': 'PM'\n }\n }\n },\n 'eras': {\n 'eraNames': {\n '0': 'Before Christ',\n '0-alt-variant': 'Before Common Era',\n '1': 'Anno Domini',\n '1-alt-variant': 'Common Era'\n },\n 'eraAbbr': {\n '0': 'BC',\n '0-alt-variant': 'BCE',\n '1': 'AD',\n '1-alt-variant': 'CE'\n },\n 'eraNarrow': {\n '0': 'B',\n '0-alt-variant': 'BCE',\n '1': 'A',\n '1-alt-variant': 'CE'\n }\n },\n 'dateFormats': {\n 'full': 'EEEE, MMMM d, y',\n 'long': 'MMMM d, y',\n 'medium': 'MMM d, y',\n 'short': 'M/d/yy'\n },\n 'timeFormats': {\n 'full': 'h:mm:ss a zzzz',\n 'long': 'h:mm:ss a z',\n 'medium': 'h:mm:ss a',\n 'short': 'h:mm a'\n },\n 'dateTimeFormats': {\n 'full': '{1} \\'at\\' {0}',\n 'long': '{1} \\'at\\' {0}',\n 'medium': '{1}, {0}',\n 'short': '{1}, {0}',\n 'availableFormats': {\n 'd': 'd',\n 'E': 'ccc',\n 'Ed': 'd E',\n 'Ehm': 'E h:mm a',\n 'EHm': 'E HH:mm',\n 'Ehms': 'E h:mm:ss a',\n 'EHms': 'E HH:mm:ss',\n 'Gy': 'y G',\n 'GyMMM': 'MMM y G',\n 'GyMMMd': 'MMM d, y G',\n 'GyMMMEd': 'E, MMM d, y G',\n 'h': 'h a',\n 'H': 'HH',\n 'hm': 'h:mm a',\n 'Hm': 'HH:mm',\n 'hms': 'h:mm:ss a',\n 'Hms': 'HH:mm:ss',\n 'hmsv': 'h:mm:ss a v',\n 'Hmsv': 'HH:mm:ss v',\n 'hmv': 'h:mm a v',\n 'Hmv': 'HH:mm v',\n 'M': 'L',\n 'Md': 'M/d',\n 'MEd': 'E, M/d',\n 'MMM': 'LLL',\n 'MMMd': 'MMM d',\n 'MMMEd': 'E, MMM d',\n 'MMMMd': 'MMMM d',\n 'ms': 'mm:ss',\n 'y': 'y',\n 'yM': 'M/y',\n 'yMd': 'M/d/y',\n 'yMEd': 'E, M/d/y',\n 'yMMM': 'MMM y',\n 'yMMMd': 'MMM d, y',\n 'yMMMEd': 'E, MMM d, y',\n 'yMMMM': 'MMMM y'\n }\n }\n },\n 'islamic': {\n 'months': {\n 'stand-alone': {\n 'abbreviated': {\n '1': 'Muh.',\n '2': 'Saf.',\n '3': 'Rab. I',\n '4': 'Rab. II',\n '5': 'Jum. I',\n '6': 'Jum. II',\n '7': 'Raj.',\n '8': 'Sha.',\n '9': 'Ram.',\n '10': 'Shaw.',\n '11': 'Dhuʻl-Q.',\n '12': 'Dhuʻl-H.'\n },\n 'narrow': {\n '1': '1',\n '2': '2',\n '3': '3',\n '4': '4',\n '5': '5',\n '6': '6',\n '7': '7',\n '8': '8',\n '9': '9',\n '10': '10',\n '11': '11',\n '12': '12'\n },\n 'wide': {\n '1': 'Muharram',\n '2': 'Safar',\n '3': 'Rabiʻ I',\n '4': 'Rabiʻ II',\n '5': 'Jumada I',\n '6': 'Jumada II',\n '7': 'Rajab',\n '8': 'Shaʻban',\n '9': 'Ramadan',\n '10': 'Shawwal',\n '11': 'Dhuʻl-Qiʻdah',\n '12': 'Dhuʻl-Hijjah'\n }\n }\n },\n 'days': {\n 'stand-alone': {\n 'abbreviated': {\n 'sun': 'Sun',\n 'mon': 'Mon',\n 'tue': 'Tue',\n 'wed': 'Wed',\n 'thu': 'Thu',\n 'fri': 'Fri',\n 'sat': 'Sat'\n },\n 'narrow': {\n 'sun': 'S',\n 'mon': 'M',\n 'tue': 'T',\n 'wed': 'W',\n 'thu': 'T',\n 'fri': 'F',\n 'sat': 'S'\n },\n 'short': {\n 'sun': 'Su',\n 'mon': 'Mo',\n 'tue': 'Tu',\n 'wed': 'We',\n 'thu': 'Th',\n 'fri': 'Fr',\n 'sat': 'Sa'\n },\n 'wide': {\n 'sun': 'Sunday',\n 'mon': 'Monday',\n 'tue': 'Tuesday',\n 'wed': 'Wednesday',\n 'thu': 'Thursday',\n 'fri': 'Friday',\n 'sat': 'Saturday'\n }\n }\n },\n 'dayPeriods': {\n 'format': {\n 'wide': {\n 'am': 'AM',\n 'pm': 'PM'\n }\n }\n },\n 'eras': {\n 'eraNames': {\n '0': 'AH'\n },\n 'eraAbbr': {\n '0': 'AH'\n },\n 'eraNarrow': {\n '0': 'AH'\n }\n },\n 'dateFormats': {\n 'full': 'EEEE, MMMM d, y G',\n 'long': 'MMMM d, y G',\n 'medium': 'MMM d, y G',\n 'short': 'M/d/y GGGGG'\n },\n 'timeFormats': {\n 'full': 'h:mm:ss a zzzz',\n 'long': 'h:mm:ss a z',\n 'medium': 'h:mm:ss a',\n 'short': 'h:mm a'\n },\n 'dateTimeFormats': {\n 'full': '{1} \\'at\\' {0}',\n 'long': '{1} \\'at\\' {0}',\n 'medium': '{1}, {0}',\n 'short': '{1}, {0}',\n 'availableFormats': {\n 'd': 'd',\n 'E': 'ccc',\n 'Ed': 'd E',\n 'Ehm': 'E h:mm a',\n 'EHm': 'E HH:mm',\n 'Ehms': 'E h:mm:ss a',\n 'EHms': 'E HH:mm:ss',\n 'Gy': 'y G',\n 'GyMMM': 'MMM y G',\n 'GyMMMd': 'MMM d, y G',\n 'GyMMMEd': 'E, MMM d, y G',\n 'h': 'h a',\n 'H': 'HH',\n 'hm': 'h:mm a',\n 'Hm': 'HH:mm',\n 'hms': 'h:mm:ss a',\n 'Hms': 'HH:mm:ss',\n 'M': 'L',\n 'Md': 'M/d',\n 'MEd': 'E, M/d',\n 'MMM': 'LLL',\n 'MMMd': 'MMM d',\n 'MMMEd': 'E, MMM d',\n 'MMMMd': 'MMMM d',\n 'ms': 'mm:ss',\n 'y': 'y G',\n 'yyyy': 'y G',\n 'yyyyM': 'M/y GGGGG',\n 'yyyyMd': 'M/d/y GGGGG',\n 'yyyyMEd': 'E, M/d/y GGGGG',\n 'yyyyMMM': 'MMM y G',\n 'yyyyMMMd': 'MMM d, y G',\n 'yyyyMMMEd': 'E, MMM d, y G',\n 'yyyyMMMM': 'MMMM y G',\n 'yyyyQQQ': 'QQQ y G',\n 'yyyyQQQQ': 'QQQQ y G'\n }\n }\n }\n },\n 'timeZoneNames': {\n 'hourFormat': '+HH:mm;-HH:mm',\n 'gmtFormat': 'GMT{0}',\n 'gmtZeroFormat': 'GMT'\n }\n },\n 'numbers': {\n 'currencies': {\n 'USD': {\n 'displayName': 'US Dollar',\n 'symbol': '$',\n 'symbol-alt-narrow': '$'\n },\n 'EUR': {\n 'displayName': 'Euro',\n 'symbol': '€',\n 'symbol-alt-narrow': '€'\n },\n 'GBP': {\n 'displayName': 'British Pound',\n 'symbol-alt-narrow': '£'\n }\n },\n 'defaultNumberingSystem': 'latn',\n 'minimumGroupingDigits': '1',\n 'symbols-numberSystem-latn': {\n 'decimal': '.',\n 'group': ',',\n 'list': ';',\n 'percentSign': '%',\n 'plusSign': '+',\n 'minusSign': '-',\n 'exponential': 'E',\n 'superscriptingExponent': '×',\n 'perMille': '‰',\n 'infinity': '∞',\n 'nan': 'NaN',\n 'timeSeparator': ':'\n },\n 'decimalFormats-numberSystem-latn': {\n 'standard': '#,##0.###'\n },\n 'percentFormats-numberSystem-latn': {\n 'standard': '#,##0%'\n },\n 'currencyFormats-numberSystem-latn': {\n 'standard': '¤#,##0.00',\n 'accounting': '¤#,##0.00;(¤#,##0.00)'\n },\n 'scientificFormats-numberSystem-latn': {\n 'standard': '#E0'\n }\n }\n };\n IntlBase.blazorDefaultObject = {\n 'numbers': {\n 'mapper': {\n '0': '0',\n '1': '1',\n '2': '2',\n '3': '3',\n '4': '4',\n '5': '5',\n '6': '6',\n '7': '7',\n '8': '8',\n '9': '9'\n },\n 'mapperDigits': '0123456789',\n 'numberSymbols': {\n 'decimal': '.',\n 'group': ',',\n 'plusSign': '+',\n 'minusSign': '-',\n 'percentSign': '%',\n 'nan': 'NaN',\n 'timeSeparator': ':',\n 'infinity': '∞'\n },\n 'timeSeparator': ':',\n 'currencySymbol': '$',\n 'currencypData': {\n 'nlead': '$',\n 'nend': '',\n 'groupSeparator': ',',\n 'groupData': {\n 'primary': 3\n },\n 'maximumFraction': 2,\n 'minimumFraction': 2\n },\n 'percentpData': {\n 'nlead': '',\n 'nend': '%',\n 'groupSeparator': ',',\n 'groupData': {\n 'primary': 3\n },\n 'maximumFraction': 2,\n 'minimumFraction': 2\n },\n 'percentnData': {\n 'nlead': '-',\n 'nend': '%',\n 'groupSeparator': ',',\n 'groupData': {\n 'primary': 3\n },\n 'maximumFraction': 2,\n 'minimumFraction': 2\n },\n 'currencynData': {\n 'nlead': '($',\n 'nend': ')',\n 'groupSeparator': ',',\n 'groupData': {\n 'primary': 3\n },\n 'maximumFraction': 2,\n 'minimumFraction': 2\n },\n 'decimalnData': {\n 'nlead': '-',\n 'nend': '',\n 'groupData': {\n 'primary': 3\n },\n 'maximumFraction': 2,\n 'minimumFraction': 2\n },\n 'decimalpData': {\n 'nlead': '',\n 'nend': '',\n 'groupData': {\n 'primary': 3\n },\n 'maximumFraction': 2,\n 'minimumFraction': 2\n }\n },\n 'dates': {\n 'dayPeriods': {\n 'am': 'AM',\n 'pm': 'PM'\n },\n 'dateSeperator': '/',\n 'days': {\n 'abbreviated': {\n 'sun': 'Sun',\n 'mon': 'Mon',\n 'tue': 'Tue',\n 'wed': 'Wed',\n 'thu': 'Thu',\n 'fri': 'Fri',\n 'sat': 'Sat'\n },\n 'short': {\n 'sun': 'Su',\n 'mon': 'Mo',\n 'tue': 'Tu',\n 'wed': 'We',\n 'thu': 'Th',\n 'fri': 'Fr',\n 'sat': 'Sa'\n },\n 'wide': {\n 'sun': 'Sunday',\n 'mon': 'Monday',\n 'tue': 'Tuesday',\n 'wed': 'Wednesday',\n 'thu': 'Thursday',\n 'fri': 'Friday',\n 'sat': 'Saturday'\n }\n },\n 'months': {\n 'abbreviated': {\n '1': 'Jan',\n '2': 'Feb',\n '3': 'Mar',\n '4': 'Apr',\n '5': 'May',\n '6': 'Jun',\n '7': 'Jul',\n '8': 'Aug',\n '9': 'Sep',\n '10': 'Oct',\n '11': 'Nov',\n '12': 'Dec'\n },\n 'wide': {\n '1': 'January',\n '2': 'February',\n '3': 'March',\n '4': 'April',\n '5': 'May',\n '6': 'June',\n '7': 'July',\n '8': 'August',\n '9': 'September',\n '10': 'October',\n '11': 'November',\n '12': 'December'\n }\n },\n 'eras': {\n '1': 'AD'\n }\n }\n };\n /* tslint:enable:quotemark */\n IntlBase.monthIndex = {\n 3: 'abbreviated',\n 4: 'wide',\n 5: 'narrow',\n 1: 'abbreviated'\n };\n /**\n *\n */\n IntlBase.month = 'months';\n IntlBase.days = 'days';\n /**\n * Default numerber Object\n */\n IntlBase.patternMatcher = {\n C: 'currency',\n P: 'percent',\n N: 'decimal',\n A: 'currency',\n E: 'scientific'\n };\n /**\n * Returns the resultant pattern based on the skeleton, dateObject and the type provided\n *\n * @private\n * @param {string} skeleton ?\n * @param {Object} dateObject ?\n * @param {string} type ?\n * @param {boolean} isIslamic ?\n * @param {string} blazorCulture ?\n * @returns {string} ?\n */\n function getResultantPattern(skeleton, dateObject, type, isIslamic, blazorCulture) {\n var resPattern;\n var iType = type || 'date';\n if (blazorCulture) {\n resPattern = compareBlazorDateFormats({ skeleton: skeleton }, blazorCulture).format ||\n compareBlazorDateFormats({ skeleton: 'd' }, 'en-US').format;\n }\n else {\n if (IntlBase.basicPatterns.indexOf(skeleton) !== -1) {\n resPattern = getValue(iType + 'Formats.' + skeleton, dateObject);\n if (iType === 'dateTime') {\n var dPattern = getValue('dateFormats.' + skeleton, dateObject);\n var tPattern = getValue('timeFormats.' + skeleton, dateObject);\n resPattern = resPattern.replace('{1}', dPattern).replace('{0}', tPattern);\n }\n }\n else {\n resPattern = getValue('dateTimeFormats.availableFormats.' + skeleton, dateObject);\n }\n if (isUndefined(resPattern) && skeleton === 'yMd') {\n resPattern = 'M/d/y';\n }\n }\n return resPattern;\n }\n IntlBase.getResultantPattern = getResultantPattern;\n /**\n * Returns the dependable object for provided cldr data and culture\n *\n * @private\n * @param {Object} cldr ?\n * @param {string} culture ?\n * @param {string} mode ?\n * @param {boolean} isNumber ?\n * @returns {any} ?\n */\n function getDependables(cldr, culture, mode, isNumber) {\n var ret = {};\n var calendartype = mode || 'gregorian';\n ret.parserObject = parser.getMainObject(cldr, culture) || (isBlazor() ? IntlBase.blazorDefaultObject : IntlBase.defaultObject);\n if (isNumber) {\n ret.numericObject = getValue('numbers', ret.parserObject);\n }\n else {\n var dateString = isBlazor() ? 'dates' : ('dates.calendars.' + calendartype);\n ret.dateObject = getValue(dateString, ret.parserObject);\n }\n return ret;\n }\n IntlBase.getDependables = getDependables;\n /**\n * Returns the symbol pattern for provided parameters\n *\n * @private\n * @param {string} type ?\n * @param {string} numSystem ?\n * @param {Object} obj ?\n * @param {boolean} isAccount ?\n * @returns {string} ?\n */\n function getSymbolPattern(type, numSystem, obj, isAccount) {\n return getValue(type + 'Formats-numberSystem-' +\n numSystem + (isAccount ? '.accounting' : '.standard'), obj) || (isAccount ? getValue(type + 'Formats-numberSystem-' +\n numSystem + '.standard', obj) : '');\n }\n IntlBase.getSymbolPattern = getSymbolPattern;\n /**\n *\n * @param {string} format ?\n * @returns {string} ?\n */\n function ConvertDateToWeekFormat(format) {\n var convertMapper = format.match(IntlBase.dateConverterMapper);\n if (convertMapper && isBlazor()) {\n var tempString = convertMapper[0].length === 3 ? 'EEE' : 'EEEE';\n return format.replace(IntlBase.dateConverterMapper, tempString);\n }\n return format;\n }\n IntlBase.ConvertDateToWeekFormat = ConvertDateToWeekFormat;\n /**\n *\n * @param {DateFormatOptions} formatOptions ?\n * @param {string} culture ?\n * @returns {DateFormatOptions} ?\n */\n function compareBlazorDateFormats(formatOptions, culture) {\n var format = formatOptions.format || formatOptions.skeleton;\n var curFormatMapper = getValue((culture || 'en-US') + '.' + format, blazorCultureFormats);\n if (!curFormatMapper) {\n curFormatMapper = getValue('en-US.' + format, blazorCultureFormats);\n }\n if (curFormatMapper) {\n curFormatMapper = ConvertDateToWeekFormat(curFormatMapper);\n formatOptions.format = curFormatMapper.replace(/tt/, 'a');\n }\n return formatOptions;\n }\n IntlBase.compareBlazorDateFormats = compareBlazorDateFormats;\n /**\n * Returns proper numeric skeleton\n *\n * @private\n * @param {string} skeleton ?\n * @returns {any} ?\n */\n function getProperNumericSkeleton(skeleton) {\n var matches = skeleton.match(IntlBase.formatRegex);\n var ret = {};\n var pattern = matches[1].toUpperCase();\n ret.isAccount = (pattern === 'A');\n ret.type = IntlBase.patternMatcher[pattern];\n if (skeleton.length > 1) {\n ret.fractionDigits = parseInt(matches[2], 10);\n }\n return ret;\n }\n IntlBase.getProperNumericSkeleton = getProperNumericSkeleton;\n /**\n * Returns format data for number formatting like minimum fraction, maximum fraction, etc..,\n *\n * @private\n * @param {string} pattern ?\n * @param {boolean} needFraction ?\n * @param {string} cSymbol ?\n * @param {boolean} fractionOnly ?\n * @returns {any} ?\n */\n function getFormatData(pattern, needFraction, cSymbol, fractionOnly) {\n var nData = fractionOnly ? {} : { nlead: '', nend: '' };\n var match = pattern.match(IntlBase.customRegex);\n if (match) {\n if (!fractionOnly) {\n nData.nlead = changeCurrencySymbol(match[1], cSymbol);\n nData.nend = changeCurrencySymbol(match[10], cSymbol);\n nData.groupPattern = match[4];\n }\n var fraction = match[7];\n if (fraction && needFraction) {\n var fmatch = fraction.match(fractionRegex);\n if (!isNullOrUndefined(fmatch)) {\n nData.minimumFraction = fmatch.length;\n }\n else {\n nData.minimumFraction = 0;\n }\n nData.maximumFraction = fraction.length - 1;\n }\n }\n return nData;\n }\n IntlBase.getFormatData = getFormatData;\n /**\n * Changes currency symbol\n *\n * @private\n * @param {string} val ?\n * @param {string} sym ?\n * @returns {string} ?\n */\n function changeCurrencySymbol(val, sym) {\n if (val) {\n val = val.replace(IntlBase.defaultCurrency, sym);\n return (sym === '') ? val.trim() : val;\n }\n return '';\n }\n IntlBase.changeCurrencySymbol = changeCurrencySymbol;\n /**\n * Returns currency symbol based on currency code ?\n *\n * @private\n * @param {Object} numericObject ?\n * @param {string} currencyCode ?\n * @param {string} altSymbol ?\n * @returns {string} ?\n */\n function getCurrencySymbol(numericObject, currencyCode, altSymbol) {\n var symbol = altSymbol ? ('.' + altSymbol) : '.symbol';\n var getCurrency = getValue('currencies.' + currencyCode + symbol, numericObject) ||\n getValue('currencies.' + currencyCode + '.symbol-alt-narrow', numericObject) || '$';\n return getCurrency;\n }\n IntlBase.getCurrencySymbol = getCurrencySymbol;\n /**\n * Returns formatting options for custom number format\n *\n * @private\n * @param {string} format ?\n * @param {CommonOptions} dOptions ?\n * @param {any} obj ?\n * @returns {any} ?\n */\n function customFormat(format, dOptions, obj) {\n var options = {};\n var formatSplit = format.split(';');\n var data = ['pData', 'nData', 'zeroData'];\n for (var i = 0; i < formatSplit.length; i++) {\n options[data[i]] = customNumberFormat(formatSplit[i], dOptions, obj);\n }\n if (isNullOrUndefined(options.nData)) {\n options.nData = extend({}, options.pData);\n options.nData.nlead = isNullOrUndefined(dOptions) ? '-' + options.nData.nlead : dOptions.minusSymbol + options.nData.nlead;\n }\n return options;\n }\n IntlBase.customFormat = customFormat;\n /**\n * Returns custom formatting options\n *\n * @private\n * @param {string} format ?\n * @param {CommonOptions} dOptions ?\n * @param {Object} numObject ?\n * @returns {any} ?\n */\n function customNumberFormat(format, dOptions, numObject) {\n var cOptions = { type: 'decimal', minimumFractionDigits: 0, maximumFractionDigits: 0 };\n var pattern = format.match(IntlBase.customRegex);\n if (isNullOrUndefined(pattern) || (pattern[5] === '' && format !== 'N/A')) {\n cOptions.type = undefined;\n return cOptions;\n }\n cOptions.nlead = pattern[1];\n cOptions.nend = pattern[10];\n var integerPart = pattern[6];\n var spaceCapture = integerPart.match(/\\ $/g) ? true : false;\n var spaceGrouping = integerPart.replace(/\\ $/g, '').indexOf(' ') !== -1;\n cOptions.useGrouping = integerPart.indexOf(',') !== -1 || spaceGrouping;\n integerPart = integerPart.replace(/,/g, '');\n var fractionPart = pattern[7];\n if (integerPart.indexOf('0') !== -1) {\n cOptions.minimumIntegerDigits = integerPart.length - integerPart.indexOf('0');\n }\n if (!isNullOrUndefined(fractionPart)) {\n cOptions.minimumFractionDigits = fractionPart.lastIndexOf('0');\n cOptions.maximumFractionDigits = fractionPart.lastIndexOf('#');\n if (cOptions.minimumFractionDigits === -1) {\n cOptions.minimumFractionDigits = 0;\n }\n if (cOptions.maximumFractionDigits === -1 || cOptions.maximumFractionDigits < cOptions.minimumFractionDigits) {\n cOptions.maximumFractionDigits = cOptions.minimumFractionDigits;\n }\n }\n if (!isNullOrUndefined(dOptions)) {\n dOptions.isCustomFormat = true;\n extend(cOptions, isCurrencyPercent([cOptions.nlead, cOptions.nend], '$', dOptions.currencySymbol));\n if (!cOptions.isCurrency) {\n extend(cOptions, isCurrencyPercent([cOptions.nlead, cOptions.nend], '%', dOptions.percentSymbol));\n }\n }\n else {\n extend(cOptions, isCurrencyPercent([cOptions.nlead, cOptions.nend], '%', '%'));\n }\n if (!isNullOrUndefined(numObject)) {\n var symbolPattern = getSymbolPattern(cOptions.type, dOptions.numberMapper.numberSystem, numObject, false);\n if (cOptions.useGrouping) {\n cOptions.groupSeparator = spaceGrouping ? ' ' : dOptions.numberMapper.numberSymbols[mapper[2]];\n cOptions.groupData = NumberFormat.getGroupingDetails(symbolPattern.split(';')[0]);\n }\n cOptions.nlead = cOptions.nlead.replace(/'/g, '');\n cOptions.nend = spaceCapture ? ' ' + cOptions.nend.replace(/'/g, '') : cOptions.nend.replace(/'/g, '');\n }\n return cOptions;\n }\n IntlBase.customNumberFormat = customNumberFormat;\n /**\n * Returns formatting options for currency or percent type\n *\n * @private\n * @param {string[]} parts ?\n * @param {string} actual ?\n * @param {string} symbol ?\n * @returns {any} ?\n */\n function isCurrencyPercent(parts, actual, symbol) {\n var options = { nlead: parts[0], nend: parts[1] };\n for (var i = 0; i < 2; i++) {\n var part = parts[parseInt(i.toString(), 10)];\n var loc = part.indexOf(actual);\n if ((loc !== -1) && ((loc < part.indexOf('\\'')) || (loc > part.lastIndexOf('\\'')))) {\n options[typeMapper[i]] = part.substr(0, loc) + symbol + part.substr(loc + 1);\n options[typeMapper[actual]] = true;\n options.type = options.isCurrency ? 'currency' : 'percent';\n break;\n }\n }\n return options;\n }\n IntlBase.isCurrencyPercent = isCurrencyPercent;\n /**\n * Returns culture based date separator\n *\n * @private\n * @param {Object} dateObj ?\n * @returns {string} ?\n */\n function getDateSeparator(dateObj) {\n var value = (getValue('dateFormats.short', dateObj) || '').match(/[d‏M‏]([^d‏M])[d‏M‏]/i);\n return value ? value[1] : '/';\n }\n IntlBase.getDateSeparator = getDateSeparator;\n /**\n * Returns Native Date Time pattern\n *\n * @private\n * @param {string} culture ?\n * @param {DateFormatOptions} options ?\n * @param {Object} cldr ?\n * @param {boolean} isExcelFormat ?\n * @returns {string} ?\n */\n function getActualDateTimeFormat(culture, options, cldr, isExcelFormat) {\n var dependable = getDependables(cldr, culture, options.calendar);\n if (isBlazor()) {\n options = compareBlazorDateFormats(options, culture);\n }\n var actualPattern = options.format || getResultantPattern(options.skeleton, dependable.dateObject, options.type);\n if (isExcelFormat) {\n actualPattern = actualPattern.replace(patternRegex, function (pattern) {\n return patternMatch[pattern];\n });\n if (actualPattern.indexOf('z') !== -1) {\n var tLength = actualPattern.match(/z/g).length;\n var timeZonePattern = void 0;\n var options_1 = { 'timeZone': {} };\n options_1.numMapper = parser.getNumberMapper(dependable.parserObject, parser.getNumberingSystem(cldr));\n options_1.timeZone = getValue('dates.timeZoneNames', dependable.parserObject);\n var value = new Date();\n var timezone = value.getTimezoneOffset();\n var pattern = (tLength < 4) ? '+H;-H' : options_1.timeZone.hourFormat;\n pattern = pattern.replace(/:/g, options_1.numMapper.timeSeparator);\n if (timezone === 0) {\n timeZonePattern = options_1.timeZone.gmtZeroFormat;\n }\n else {\n timeZonePattern = DateFormat.getTimeZoneValue(timezone, pattern);\n timeZonePattern = options_1.timeZone.gmtFormat.replace(/\\{0\\}/, timeZonePattern);\n }\n actualPattern = actualPattern.replace(/[z]+/, '\"' + timeZonePattern + '\"');\n }\n actualPattern = actualPattern.replace(/ $/, '');\n }\n return actualPattern;\n }\n IntlBase.getActualDateTimeFormat = getActualDateTimeFormat;\n /**\n *\n * @param {string} actual ?\n * @param {any} option ?\n * @returns {any} ?\n */\n function processSymbol(actual, option) {\n if (actual.indexOf(',') !== -1) {\n var split = actual.split(',');\n actual = (split[0] + getValue('numberMapper.numberSymbols.group', option) +\n split[1].replace('.', getValue('numberMapper.numberSymbols.decimal', option)));\n }\n else {\n actual = actual.replace('.', getValue('numberMapper.numberSymbols.decimal', option));\n }\n return actual;\n }\n /**\n * Returns Native Number pattern\n *\n * @private\n * @param {string} culture ?\n * @param {NumberFormatOptions} options ?\n * @param {Object} cldr ?\n * @param {boolean} isExcel ?\n * @returns {string} ?\n */\n function getActualNumberFormat(culture, options, cldr, isExcel) {\n var dependable = getDependables(cldr, culture, '', true);\n var parseOptions = { custom: true };\n var numrericObject = dependable.numericObject;\n var minFrac;\n var curObj = {};\n var curMatch = (options.format || '').match(IntlBase.currencyFormatRegex);\n var type = IntlBase.formatRegex.test(options.format) ? getProperNumericSkeleton(options.format || 'N') : {};\n var dOptions = {};\n if (curMatch) {\n dOptions.numberMapper = isBlazor() ?\n extend({}, dependable.numericObject) :\n parser.getNumberMapper(dependable.parserObject, parser.getNumberingSystem(cldr), true);\n var curCode = isBlazor() ? getValue('currencySymbol', dependable.numericObject) :\n getCurrencySymbol(dependable.numericObject, options.currency || defaultCurrencyCode, options.altSymbol);\n var symbolPattern = getSymbolPattern('currency', dOptions.numberMapper.numberSystem, dependable.numericObject, (/a/i).test(options.format));\n symbolPattern = symbolPattern.replace(/\\u00A4/g, curCode);\n var split = symbolPattern.split(';');\n curObj.hasNegativePattern = isBlazor() ? true : (split.length > 1);\n curObj.nData = isBlazor() ? getValue(type.type + 'nData', numrericObject) :\n getFormatData(split[1] || '-' + split[0], true, curCode);\n curObj.pData = isBlazor() ? getValue(type.type + 'pData', numrericObject) :\n getFormatData(split[0], false, curCode);\n if (!curMatch[2] && !options.minimumFractionDigits && !options.maximumFractionDigits) {\n minFrac = getFormatData(symbolPattern.split(';')[0], true, '', true).minimumFraction;\n }\n }\n var actualPattern;\n if ((IntlBase.formatRegex.test(options.format)) || !(options.format)) {\n extend(parseOptions, getProperNumericSkeleton(options.format || 'N'));\n parseOptions.custom = false;\n actualPattern = '###0';\n if (parseOptions.fractionDigits || options.minimumFractionDigits || options.maximumFractionDigits || minFrac) {\n var defaultMinimum = 0;\n if (parseOptions.fractionDigits) {\n options.minimumFractionDigits = options.maximumFractionDigits = parseOptions.fractionDigits;\n }\n actualPattern = fractionDigitsPattern(actualPattern, minFrac || parseOptions.fractionDigits ||\n options.minimumFractionDigits || defaultMinimum, options.maximumFractionDigits || defaultMinimum);\n }\n if (options.minimumIntegerDigits) {\n actualPattern = minimumIntegerPattern(actualPattern, options.minimumIntegerDigits);\n }\n if (options.useGrouping) {\n actualPattern = groupingPattern(actualPattern);\n }\n if (parseOptions.type === 'currency' || (parseOptions.type && isBlazor())) {\n if (isBlazor() && parseOptions.type !== 'currency') {\n curObj.pData = getValue(parseOptions.type + 'pData', numrericObject);\n curObj.nData = getValue(parseOptions.type + 'nData', numrericObject);\n }\n var cPattern = actualPattern;\n actualPattern = curObj.pData.nlead + cPattern + curObj.pData.nend;\n if (curObj.hasNegativePattern || isBlazor()) {\n actualPattern += ';' + curObj.nData.nlead + cPattern + curObj.nData.nend;\n }\n }\n if (parseOptions.type === 'percent' && !isBlazor()) {\n actualPattern += ' %';\n }\n }\n else {\n actualPattern = options.format.replace(/'/g, '\"');\n }\n if (Object.keys(dOptions).length > 0) {\n actualPattern = !isExcel ? processSymbol(actualPattern, dOptions) : actualPattern;\n }\n return actualPattern;\n }\n IntlBase.getActualNumberFormat = getActualNumberFormat;\n /**\n *\n * @param {string} pattern ?\n * @param {number} minDigits ?\n * @param {number} maxDigits ?\n * @returns {string} ?\n */\n function fractionDigitsPattern(pattern, minDigits, maxDigits) {\n pattern += '.';\n for (var a = 0; a < minDigits; a++) {\n pattern += '0';\n }\n if (minDigits < maxDigits) {\n var diff = maxDigits - minDigits;\n for (var b = 0; b < diff; b++) {\n pattern += '#';\n }\n }\n return pattern;\n }\n IntlBase.fractionDigitsPattern = fractionDigitsPattern;\n /**\n *\n * @param {string} pattern ?\n * @param {number} digits ?\n * @returns {string} ?\n */\n function minimumIntegerPattern(pattern, digits) {\n var temp = pattern.split('.');\n var integer = '';\n for (var x = 0; x < digits; x++) {\n integer += '0';\n }\n return temp[1] ? (integer + '.' + temp[1]) : integer;\n }\n IntlBase.minimumIntegerPattern = minimumIntegerPattern;\n /**\n *\n * @param {string} pattern ?\n * @returns {string} ?\n */\n function groupingPattern(pattern) {\n var temp = pattern.split('.');\n var integer = temp[0];\n var no = 3 - integer.length % 3;\n var hash = (no && no === 1) ? '#' : (no === 2 ? '##' : '');\n integer = hash + integer;\n pattern = '';\n for (var x = integer.length - 1; x > 0; x = x - 3) {\n pattern = ',' + integer[x - 2] + integer[x - 1] + integer[parseInt(x.toString(), 10)] + pattern;\n }\n pattern = pattern.slice(1);\n return temp[1] ? (pattern + '.' + temp[1]) : pattern;\n }\n IntlBase.groupingPattern = groupingPattern;\n /**\n *\n * @param {string} culture ?\n * @param {Object} cldr ?\n * @returns {number} ?\n */\n function getWeekData(culture, cldr) {\n var firstDay = defaultFirstDay;\n var mapper = getValue('supplemental.weekData.firstDay', cldr);\n var iCulture = culture;\n if ((/en-/).test(iCulture)) {\n iCulture = iCulture.slice(3);\n }\n iCulture = iCulture.slice(0, 2).toUpperCase() + iCulture.substr(2);\n if (mapper) {\n firstDay = mapper[\"\" + iCulture] || mapper[iCulture.slice(0, 2)] || defaultFirstDay;\n }\n return firstDayMapper[\"\" + firstDay];\n }\n IntlBase.getWeekData = getWeekData;\n /**\n * @private\n * @param {any} pData ?\n * @param {string} aCurrency ?\n * @param {string} rCurrency ?\n * @returns {void} ?\n */\n function replaceBlazorCurrency(pData, aCurrency, rCurrency) {\n var iCurrency = getBlazorCurrencySymbol(rCurrency);\n if (aCurrency !== iCurrency) {\n for (var _i = 0, pData_1 = pData; _i < pData_1.length; _i++) {\n var data = pData_1[_i];\n data.nend = data.nend.replace(aCurrency, iCurrency);\n data.nlead = data.nlead.replace(aCurrency, iCurrency);\n }\n }\n }\n IntlBase.replaceBlazorCurrency = replaceBlazorCurrency;\n /**\n * @private\n * @param {Date} date ?\n * @returns {number} ?\n */\n function getWeekOfYear(date) {\n var newYear = new Date(date.getFullYear(), 0, 1);\n var day = newYear.getDay();\n var weeknum;\n day = (day >= 0 ? day : day + 7);\n var daynum = Math.floor((date.getTime() - newYear.getTime() -\n (date.getTimezoneOffset() - newYear.getTimezoneOffset()) * 60000) / 86400000) + 1;\n if (day < 4) {\n weeknum = Math.floor((daynum + day - 1) / 7) + 1;\n if (weeknum > 52) {\n var nYear = new Date(date.getFullYear() + 1, 0, 1);\n var nday = nYear.getDay();\n nday = nday >= 0 ? nday : nday + 7;\n weeknum = nday < 4 ? 1 : 53;\n }\n }\n else {\n weeknum = Math.floor((daynum + day - 1) / 7);\n }\n return weeknum;\n }\n IntlBase.getWeekOfYear = getWeekOfYear;\n})(IntlBase || (IntlBase = {}));\n","import { isNullOrUndefined, merge } from './util';\nvar headerRegex = /^(.*?):[ \\t]*([^\\r\\n]*)$/gm;\nvar defaultType = 'GET';\n/**\n * Ajax class provides ability to make asynchronous HTTP request to the server\n * ```typescript\n * var ajax = new Ajax(\"index.html\", \"GET\", true);\n * ajax.send().then(\n * function (value) {\n * console.log(value);\n * },\n * function (reason) {\n * console.log(reason);\n * });\n * ```\n */\nvar Ajax = /** @class */ (function () {\n /**\n * Constructor for Ajax class\n *\n * @param {string|Object} options ?\n * @param {string} type ?\n * @param {boolean} async ?\n * @returns defaultType any\n */\n function Ajax(options, type, async, contentType) {\n /**\n * A boolean value indicating whether the request should be sent asynchronous or not.\n *\n * @default true\n */\n this.mode = true;\n /**\n * A boolean value indicating whether to ignore the promise reject.\n *\n * @private\n * @default true\n */\n this.emitError = true;\n this.options = {};\n if (typeof options === 'string') {\n this.url = options;\n this.type = type ? type.toUpperCase() : defaultType;\n this.mode = !isNullOrUndefined(async) ? async : true;\n }\n else if (typeof options === 'object') {\n this.options = options;\n merge(this, this.options);\n }\n this.type = this.type ? this.type.toUpperCase() : defaultType;\n this.contentType = (this.contentType !== undefined) ? this.contentType : contentType;\n }\n /**\n *\n * Send the request to server.\n *\n * @param {any} data - To send the user data\n * @return {Promise} ?\n */\n Ajax.prototype.send = function (data) {\n var _this = this;\n this.data = isNullOrUndefined(data) ? this.data : data;\n var eventArgs = {\n cancel: false,\n httpRequest: null\n };\n var promise = new Promise(function (resolve, reject) {\n _this.httpRequest = new XMLHttpRequest();\n _this.httpRequest.onreadystatechange = function () { _this.stateChange(resolve, reject); };\n if (!isNullOrUndefined(_this.onLoad)) {\n _this.httpRequest.onload = _this.onLoad;\n }\n if (!isNullOrUndefined(_this.onProgress)) {\n _this.httpRequest.onprogress = _this.onProgress;\n }\n /* istanbul ignore next */\n if (!isNullOrUndefined(_this.onAbort)) {\n _this.httpRequest.onabort = _this.onAbort;\n }\n /* istanbul ignore next */\n if (!isNullOrUndefined(_this.onError)) {\n _this.httpRequest.onerror = _this.onError;\n }\n //** Upload Events **/\n /* istanbul ignore next */\n if (!isNullOrUndefined(_this.onUploadProgress)) {\n _this.httpRequest.upload.onprogress = _this.onUploadProgress;\n }\n _this.httpRequest.open(_this.type, _this.url, _this.mode);\n // Set default headers\n if (!isNullOrUndefined(_this.data) && _this.contentType !== null) {\n _this.httpRequest.setRequestHeader('Content-Type', _this.contentType || 'application/json; charset=utf-8');\n }\n if (_this.beforeSend) {\n eventArgs.httpRequest = _this.httpRequest;\n _this.beforeSend(eventArgs);\n }\n if (!eventArgs.cancel) {\n _this.httpRequest.send(!isNullOrUndefined(_this.data) ? _this.data : null);\n }\n });\n return promise;\n };\n Ajax.prototype.successHandler = function (data) {\n if (this.onSuccess) {\n this.onSuccess(data, this);\n }\n return data;\n };\n Ajax.prototype.failureHandler = function (reason) {\n if (this.onFailure) {\n this.onFailure(this.httpRequest);\n }\n return reason;\n };\n Ajax.prototype.stateChange = function (resolve, reject) {\n var data = this.httpRequest.responseText;\n if (this.dataType && this.dataType.toLowerCase() === 'json') {\n if (data === '') {\n data = undefined;\n }\n else {\n try {\n data = JSON.parse(data);\n }\n catch (error) {\n // no exception handle\n }\n }\n }\n if (this.httpRequest.readyState === 4) {\n //success range should be 200 to 299\n if ((this.httpRequest.status >= 200 && this.httpRequest.status <= 299) || this.httpRequest.status === 304) {\n resolve(this.successHandler(data));\n }\n else {\n if (this.emitError) {\n reject(new Error(this.failureHandler(this.httpRequest.statusText)));\n }\n else {\n resolve();\n }\n }\n }\n };\n /**\n * To get the response header from XMLHttpRequest\n *\n * @param {string} key Key to search in the response header\n * @returns {string} ?\n */\n Ajax.prototype.getResponseHeader = function (key) {\n var responseHeaders;\n var header;\n // eslint-disable-next-line\n responseHeaders = {};\n var headers = headerRegex.exec(this.httpRequest.getAllResponseHeaders());\n while (headers) {\n responseHeaders[headers[1].toLowerCase()] = headers[2];\n headers = headerRegex.exec(this.httpRequest.getAllResponseHeaders());\n }\n // eslint-disable-next-line\n header = responseHeaders[key.toLowerCase()];\n return isNullOrUndefined(header) ? null : header;\n };\n return Ajax;\n}());\nexport { Ajax };\n","import { isNullOrUndefined as isNOU, isObject, merge } from './util';\n/**\n * The Fetch class provides a way to make asynchronous network requests, typically to retrieve resources from a server.\n * ```typescript\n * var fetchApi = new Fetch('index.html', 'GET');\n * fetchApi.send()\n * .then((value) => {\n * console.log(value);\n * }).catch((error) => {\n * console.log(error);\n * });\n * ```\n */\nvar Fetch = /** @class */ (function () {\n /**\n * Constructor for Fetch class.\n *\n * @param {string|Object} options - Specifies the URL or Request object with URL to which the request is to be sent.\n * @param {string} type - Specifies which request method is to be used, such as GET, POST, etc.\n * @param {string} contentType - Specifies the content type of the request, which is used to indicate the original media type of the resource.\n */\n function Fetch(options, type, contentType) {\n /**\n * Specifies which request method is to be used, such as GET, POST, etc.\n *\n * @default GET\n */\n this.type = 'GET';\n /**\n * A boolean value indicating whether to reject the promise or not.\n *\n * @private\n * @default true\n */\n this.emitError = true;\n if (typeof options === 'string') {\n this.url = options;\n this.type = !isNOU(type) ? type.toUpperCase() : this.type;\n this.contentType = contentType;\n }\n else if (isObject(options) && Object.keys(options).length > 0) {\n merge(this, options);\n }\n this.contentType = !isNOU(this.contentType) ? this.contentType : 'application/json; charset=utf-8';\n }\n /**\n * Send the request to server.\n *\n * @param {string|Object} data - Specifies the data that needs to be added to the request.\n * @returns {Promise} - Returns the response to a request.\n */\n Fetch.prototype.send = function (data) {\n var _this = this;\n var contentTypes = {\n 'application/json': 'json',\n 'multipart/form-data': 'formData',\n 'application/octet-stream': 'blob',\n 'application/x-www-form-urlencoded': 'formData'\n };\n try {\n if (isNOU(this.fetchRequest) && this.type === 'GET') {\n this.fetchRequest = new Request(this.url, { method: this.type });\n }\n else if (isNOU(this.fetchRequest)) {\n this.data = !isNOU(data) ? data : this.data;\n this.fetchRequest = new Request(this.url, {\n method: this.type,\n headers: { 'Content-Type': this.contentType },\n body: this.data\n });\n }\n var eventArgs = { cancel: false, fetchRequest: this.fetchRequest };\n this.triggerEvent(this['beforeSend'], eventArgs);\n if (eventArgs.cancel) {\n return null;\n }\n this.fetchResponse = fetch(this.fetchRequest);\n return this.fetchResponse.then(function (response) {\n _this.triggerEvent(_this['onLoad'], response);\n if (!response.ok) {\n throw response;\n }\n var responseType = 'text';\n for (var _i = 0, _a = Object.keys(contentTypes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (response.headers.get('Content-Type') && response.headers.get('Content-Type').indexOf(key) !== -1) {\n responseType = contentTypes[key];\n }\n }\n return response[responseType]();\n // eslint-disable-next-line\n }).then(function (data) {\n _this.triggerEvent(_this['onSuccess'], data, _this);\n return data;\n // eslint-disable-next-line\n }).catch(function (error) {\n var returnVal = {};\n if (_this.emitError) {\n _this.triggerEvent(_this['onFailure'], error);\n returnVal = Promise.reject(error);\n }\n return returnVal;\n });\n }\n catch (error) {\n return error;\n }\n };\n Fetch.prototype.triggerEvent = function (callback, data, instance) {\n if (!isNOU(callback) && typeof callback === 'function') {\n callback(data, instance);\n }\n };\n return Fetch;\n}());\nexport { Fetch };\n","import { isUndefined } from './util';\nvar REGX_MOBILE = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini|mobile/i;\nvar REGX_IE = /msie|trident/i;\nvar REGX_IE11 = /Trident\\/7\\./;\nvar REGX_IOS = /(ipad|iphone|ipod touch)/i;\nvar REGX_IOS7 = /(ipad|iphone|ipod touch);.*os 7_\\d|(ipad|iphone|ipod touch);.*os 8_\\d/i;\nvar REGX_ANDROID = /android/i;\nvar REGX_WINDOWS = /trident|windows phone|edge/i;\nvar REGX_VERSION = /(version)[ /]([\\w.]+)/i;\nvar REGX_BROWSER = {\n OPERA: /(opera|opr)(?:.*version|)[ /]([\\w.]+)/i,\n EDGE: /(edge)(?:.*version|)[ /]([\\w.]+)/i,\n CHROME: /(chrome|crios)[ /]([\\w.]+)/i,\n PANTHOMEJS: /(phantomjs)[ /]([\\w.]+)/i,\n SAFARI: /(safari)[ /]([\\w.]+)/i,\n WEBKIT: /(webkit)[ /]([\\w.]+)/i,\n MSIE: /(msie|trident) ([\\w.]+)/i,\n MOZILLA: /(mozilla)(?:.*? rv:([\\w.]+)|)/i\n};\n/* istanbul ignore else */\nif (typeof window !== 'undefined') {\n window.browserDetails = window.browserDetails || {};\n}\n/**\n * Get configuration details for Browser\n *\n * @private\n */\nvar Browser = /** @class */ (function () {\n function Browser() {\n }\n Browser.extractBrowserDetail = function () {\n var browserInfo = { culture: {} };\n var keys = Object.keys(REGX_BROWSER);\n var clientInfo = [];\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n clientInfo = Browser.userAgent.match(REGX_BROWSER[\"\" + key]);\n if (clientInfo) {\n browserInfo.name = (clientInfo[1].toLowerCase() === 'opr' ? 'opera' : clientInfo[1].toLowerCase());\n browserInfo.name = (clientInfo[1].toLowerCase() === 'crios' ? 'chrome' : browserInfo.name);\n browserInfo.version = clientInfo[2];\n browserInfo.culture.name = browserInfo.culture.language = navigator.language;\n // eslint-disable-next-line\n if (!!Browser.userAgent.match(REGX_IE11)) {\n browserInfo.name = 'msie';\n break;\n }\n var version = Browser.userAgent.match(REGX_VERSION);\n if (browserInfo.name === 'safari' && version) {\n browserInfo.version = version[2];\n }\n break;\n }\n }\n return browserInfo;\n };\n /**\n * To get events from the browser\n *\n * @param {string} event - type of event triggered.\n * @returns {boolean}\n */\n Browser.getEvent = function (event) {\n // eslint-disable-next-line\n var events = {\n start: {\n isPointer: 'pointerdown', isTouch: 'touchstart', isDevice: 'mousedown'\n },\n move: {\n isPointer: 'pointermove', isTouch: 'touchmove', isDevice: 'mousemove'\n },\n end: {\n isPointer: 'pointerup', isTouch: 'touchend', isDevice: 'mouseup'\n },\n cancel: {\n isPointer: 'pointercancel', isTouch: 'touchcancel', isDevice: 'mouseleave'\n }\n };\n return (Browser.isPointer ? events[\"\" + event].isPointer :\n (Browser.isTouch ? events[\"\" + event].isTouch + (!Browser.isDevice ? ' ' + events[\"\" + event].isDevice : '')\n : events[\"\" + event].isDevice));\n };\n /**\n * To get the Touch start event from browser\n *\n * @returns {string}\n */\n Browser.getTouchStartEvent = function () {\n return Browser.getEvent('start');\n };\n /**\n * To get the Touch end event from browser\n *\n * @returns {string}\n */\n Browser.getTouchEndEvent = function () {\n return Browser.getEvent('end');\n };\n /**\n * To get the Touch move event from browser\n *\n * @returns {string}\n */\n Browser.getTouchMoveEvent = function () {\n return Browser.getEvent('move');\n };\n /**\n * To cancel the touch event from browser\n *\n * @returns {string}\n */\n Browser.getTouchCancelEvent = function () {\n return Browser.getEvent('cancel');\n };\n /**\n * Check whether the browser on the iPad device is Safari or not\n *\n * @returns {boolean}\n */\n Browser.isSafari = function () {\n return (Browser.isDevice && Browser.isIos && Browser.isTouch && typeof window !== 'undefined'\n && window.navigator.userAgent.toLowerCase().indexOf('iphone') === -1\n && window.navigator.userAgent.toLowerCase().indexOf('safari') > -1);\n };\n /**\n * To get the value based on provided key and regX\n *\n * @param {string} key ?\n * @param {RegExp} regX ?\n * @returns {Object} ?\n */\n Browser.getValue = function (key, regX) {\n var browserDetails = typeof window !== 'undefined' ? window.browserDetails : {};\n if (typeof navigator !== 'undefined' && navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1 && Browser.isTouch === true && !REGX_BROWSER.CHROME.test(navigator.userAgent)) {\n browserDetails['isIos'] = true;\n browserDetails['isDevice'] = true;\n browserDetails['isTouch'] = true;\n browserDetails['isPointer'] = true;\n }\n if ('undefined' === typeof browserDetails[\"\" + key]) {\n return browserDetails[\"\" + key] = regX.test(Browser.userAgent);\n }\n return browserDetails[\"\" + key];\n };\n Object.defineProperty(Browser, \"userAgent\", {\n get: function () {\n return Browser.uA;\n },\n //Properties\n /**\n * Property specifies the userAgent of the browser. Default userAgent value is based on the browser.\n * Also we can set our own userAgent.\n *\n * @param {string} uA ?\n */\n set: function (uA) {\n Browser.uA = uA;\n window.browserDetails = {};\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"info\", {\n //Read Only Properties\n /**\n * Property is to get the browser information like Name, Version and Language\n *\n * @returns {BrowserInfo} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.info)) {\n return window.browserDetails.info = Browser.extractBrowserDetail();\n }\n return window.browserDetails.info;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isIE\", {\n /**\n * Property is to get whether the userAgent is based IE.\n *\n * @returns {boolean} ?\n */\n get: function () {\n return Browser.getValue('isIE', REGX_IE);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isTouch\", {\n /**\n * Property is to get whether the browser has touch support.\n *\n * @returns {boolean} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.isTouch)) {\n return (window.browserDetails.isTouch =\n ('ontouchstart' in window.navigator) ||\n (window &&\n window.navigator &&\n (window.navigator.maxTouchPoints > 0)) || ('ontouchstart' in window));\n }\n return window.browserDetails.isTouch;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isPointer\", {\n /**\n * Property is to get whether the browser has Pointer support.\n *\n * @returns {boolean} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.isPointer)) {\n return window.browserDetails.isPointer = ('pointerEnabled' in window.navigator);\n }\n return window.browserDetails.isPointer;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isMSPointer\", {\n /**\n * Property is to get whether the browser has MSPointer support.\n *\n * @returns {boolean} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.isMSPointer)) {\n return window.browserDetails.isMSPointer = ('msPointerEnabled' in window.navigator);\n }\n return window.browserDetails.isMSPointer;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isDevice\", {\n /**\n * Property is to get whether the userAgent is device based.\n *\n * @returns {boolean} ?\n */\n get: function () {\n return Browser.getValue('isDevice', REGX_MOBILE);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isIos\", {\n /**\n * Property is to get whether the userAgent is IOS.\n *\n * @returns {boolean} ?\n */\n get: function () {\n return Browser.getValue('isIos', REGX_IOS);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isIos7\", {\n /**\n * Property is to get whether the userAgent is Ios7.\n *\n * @returns {boolean} ?\n */\n get: function () {\n return Browser.getValue('isIos7', REGX_IOS7);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isAndroid\", {\n /**\n * Property is to get whether the userAgent is Android.\n *\n * @returns {boolean} ?\n */\n get: function () {\n return Browser.getValue('isAndroid', REGX_ANDROID);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isWebView\", {\n /**\n * Property is to identify whether application ran in web view.\n *\n * @returns {boolean} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.isWebView)) {\n window.browserDetails.isWebView = !(isUndefined(window.cordova) && isUndefined(window.PhoneGap)\n && isUndefined(window.phonegap) && window.forge !== 'object');\n return window.browserDetails.isWebView;\n }\n return window.browserDetails.isWebView;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"isWindows\", {\n /**\n * Property is to get whether the userAgent is Windows.\n *\n * @returns {boolean} ?\n */\n get: function () {\n return Browser.getValue('isWindows', REGX_WINDOWS);\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"touchStartEvent\", {\n /**\n * Property is to get the touch start event. It returns event name based on browser.\n *\n * @returns {string} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.touchStartEvent)) {\n return window.browserDetails.touchStartEvent = Browser.getTouchStartEvent();\n }\n return window.browserDetails.touchStartEvent;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"touchMoveEvent\", {\n /**\n * Property is to get the touch move event. It returns event name based on browser.\n *\n * @returns {string} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.touchMoveEvent)) {\n return window.browserDetails.touchMoveEvent = Browser.getTouchMoveEvent();\n }\n return window.browserDetails.touchMoveEvent;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"touchEndEvent\", {\n /**\n * Property is to get the touch end event. It returns event name based on browser.\n *\n * @returns {string} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.touchEndEvent)) {\n return window.browserDetails.touchEndEvent = Browser.getTouchEndEvent();\n }\n return window.browserDetails.touchEndEvent;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Browser, \"touchCancelEvent\", {\n /**\n * Property is to cancel the touch end event.\n *\n * @returns {string} ?\n */\n get: function () {\n if (isUndefined(window.browserDetails.touchCancelEvent)) {\n return window.browserDetails.touchCancelEvent = Browser.getTouchCancelEvent();\n }\n return window.browserDetails.touchCancelEvent;\n },\n enumerable: true,\n configurable: true\n });\n /* istanbul ignore next */\n Browser.uA = typeof navigator !== 'undefined' ? navigator.userAgent : '';\n return Browser;\n}());\nexport { Browser };\n","import { debounce, extend } from './util';\nimport { Browser } from './browser';\n/**\n * EventHandler class provides option to add, remove, clear and trigger events to a HTML DOM element\n * ```html\n *
\n * \n * ```\n */\nvar EventHandler = /** @class */ (function () {\n function EventHandler() {\n }\n // to get the event data based on element\n EventHandler.addOrGetEventData = function (element) {\n if ('__eventList' in element) {\n return element.__eventList.events;\n }\n else {\n element.__eventList = {};\n return element.__eventList.events = [];\n }\n };\n /**\n * Add an event to the specified DOM element.\n *\n * @param {any} element - Target HTML DOM element\n * @param {string} eventName - A string that specifies the name of the event\n * @param {Function} listener - Specifies the function to run when the event occurs\n * @param {Object} bindTo - A object that binds 'this' variable in the event handler\n * @param {number} intDebounce - Specifies at what interval given event listener should be triggered.\n * @returns {Function} ?\n */\n EventHandler.add = function (element, eventName, listener, bindTo, intDebounce) {\n var eventData = EventHandler.addOrGetEventData(element);\n var debounceListener;\n if (intDebounce) {\n debounceListener = debounce(listener, intDebounce);\n }\n else {\n debounceListener = listener;\n }\n if (bindTo) {\n debounceListener = debounceListener.bind(bindTo);\n }\n var event = eventName.split(' ');\n for (var i = 0; i < event.length; i++) {\n eventData.push({\n name: event[parseInt(i.toString(), 10)],\n listener: listener,\n debounce: debounceListener\n });\n if (Browser.isIE) {\n element.addEventListener(event[parseInt(i.toString(), 10)], debounceListener);\n }\n else {\n element.addEventListener(event[parseInt(i.toString(), 10)], debounceListener, { passive: false });\n }\n }\n return debounceListener;\n };\n /**\n * Remove an event listener that has been attached before.\n *\n * @param {any} element - Specifies the target html element to remove the event\n * @param {string} eventName - A string that specifies the name of the event to remove\n * @param {Function} listener - Specifies the function to remove\n * @returns {void} ?\n */\n EventHandler.remove = function (element, eventName, listener) {\n var eventData = EventHandler.addOrGetEventData(element);\n var event = eventName.split(' ');\n var _loop_1 = function (j) {\n var index = -1;\n var debounceListener;\n if (eventData && eventData.length !== 0) {\n eventData.some(function (x, i) {\n return x.name === event[parseInt(j.toString(), 10)] && x.listener === listener ?\n (index = i, debounceListener = x.debounce, true) : false;\n });\n }\n if (index !== -1) {\n eventData.splice(index, 1);\n }\n if (debounceListener) {\n element.removeEventListener(event[parseInt(j.toString(), 10)], debounceListener);\n }\n };\n for (var j = 0; j < event.length; j++) {\n _loop_1(j);\n }\n };\n /**\n * Clear all the event listeners that has been previously attached to the element.\n *\n * @param {any} element - Specifies the target html element to clear the events\n * @returns {void} ?\n */\n EventHandler.clearEvents = function (element) {\n var eventData;\n var copyData;\n // eslint-disable-next-line\n eventData = EventHandler.addOrGetEventData(element);\n // eslint-disable-next-line\n copyData = extend([], copyData, eventData);\n for (var i = 0; i < copyData.length; i++) {\n var parseValue = copyData[parseInt(i.toString(), 10)];\n element.removeEventListener(parseValue.name, parseValue.debounce);\n eventData.shift();\n }\n };\n /**\n * Trigger particular event of the element.\n *\n * @param {any} element - Specifies the target html element to trigger the events\n * @param {string} eventName - Specifies the event to trigger for the specified element.\n * Can be a custom event, or any of the standard events.\n * @param {any} eventProp - Additional parameters to pass on to the event properties\n * @returns {void} ?\n */\n EventHandler.trigger = function (element, eventName, eventProp) {\n var eventData = EventHandler.addOrGetEventData(element);\n for (var _i = 0, eventData_1 = eventData; _i < eventData_1.length; _i++) {\n var event_1 = eventData_1[_i];\n if (event_1.name === eventName) {\n event_1.debounce.call(this, eventProp);\n }\n }\n };\n return EventHandler;\n}());\nexport { EventHandler };\n","/**\n * Functions related to dom operations.\n */\nimport { EventHandler } from './event-handler';\nimport { isNullOrUndefined, getValue, setValue, isObject, extend } from './util';\nvar SVG_REG = /^svg|^path|^g/;\n/**\n * Function to create Html element.\n *\n * @param {string} tagName - Name of the tag, id and class names.\n * @param {ElementProperties} properties - Object to set properties in the element.\n * @param {ElementProperties} properties.id - To set the id to the created element.\n * @param {ElementProperties} properties.className - To add classes to the element.\n * @param {ElementProperties} properties.innerHTML - To set the innerHTML to element.\n * @param {ElementProperties} properties.styles - To set the some custom styles to element.\n * @param {ElementProperties} properties.attrs - To set the attributes to element.\n * @returns {any} ?\n * @private\n */\nexport function createElement(tagName, properties) {\n var element = (SVG_REG.test(tagName) ? document.createElementNS('http://www.w3.org/2000/svg', tagName) : document.createElement(tagName));\n if (typeof (properties) === 'undefined') {\n return element;\n }\n element.innerHTML = (properties.innerHTML ? properties.innerHTML : '');\n if (properties.className !== undefined) {\n element.className = properties.className;\n }\n if (properties.id !== undefined) {\n element.id = properties.id;\n }\n if (properties.styles !== undefined) {\n element.setAttribute('style', properties.styles);\n }\n if (properties.attrs !== undefined) {\n attributes(element, properties.attrs);\n }\n return element;\n}\n/**\n * The function used to add the classes to array of elements\n *\n * @param {Element[]|NodeList} elements - An array of elements that need to add a list of classes\n * @param {string|string[]} classes - String or array of string that need to add an individual element as a class\n * @returns {any} .\n * @private\n */\nexport function addClass(elements, classes) {\n var classList = getClassList(classes);\n var regExp = RegExp;\n for (var _i = 0, _a = elements; _i < _a.length; _i++) {\n var ele = _a[_i];\n for (var _b = 0, classList_1 = classList; _b < classList_1.length; _b++) {\n var className = classList_1[_b];\n if (isObject(ele)) {\n var curClass = getValue('attributes.className', ele);\n if (isNullOrUndefined(curClass)) {\n setValue('attributes.className', className, ele);\n }\n else if (!new regExp('\\\\b' + className + '\\\\b', 'i').test(curClass)) {\n setValue('attributes.className', curClass + ' ' + className, ele);\n }\n }\n else {\n if (!ele.classList.contains(className)) {\n ele.classList.add(className);\n }\n }\n }\n }\n return elements;\n}\n/**\n * The function used to add the classes to array of elements\n *\n * @param {Element[]|NodeList} elements - An array of elements that need to remove a list of classes\n * @param {string|string[]} classes - String or array of string that need to add an individual element as a class\n * @returns {any} .\n * @private\n */\nexport function removeClass(elements, classes) {\n var classList = getClassList(classes);\n for (var _i = 0, _a = elements; _i < _a.length; _i++) {\n var ele = _a[_i];\n var flag = isObject(ele);\n var canRemove = flag ? getValue('attributes.className', ele) : ele.className !== '';\n if (canRemove) {\n for (var _b = 0, classList_2 = classList; _b < classList_2.length; _b++) {\n var className = classList_2[_b];\n if (flag) {\n var classes_1 = getValue('attributes.className', ele);\n var classArr = classes_1.split(' ');\n var index = classArr.indexOf(className);\n if (index !== -1) {\n classArr.splice(index, 1);\n }\n setValue('attributes.className', classArr.join(' '), ele);\n }\n else {\n ele.classList.remove(className);\n }\n }\n }\n }\n return elements;\n}\n/**\n * The function used to get classlist.\n *\n * @param {string | string[]} classes - An element the need to check visibility\n * @returns {string[]} ?\n * @private\n */\nfunction getClassList(classes) {\n var classList = [];\n if (typeof classes === 'string') {\n classList.push(classes);\n }\n else {\n classList = classes;\n }\n return classList;\n}\n/**\n * The function used to check element is visible or not.\n *\n * @param {Element|Node} element - An element the need to check visibility\n * @returns {boolean} ?\n * @private\n */\nexport function isVisible(element) {\n var ele = element;\n return (ele.style.visibility === '' && ele.offsetWidth > 0);\n}\n/**\n * The function used to insert an array of elements into a first of the element.\n *\n * @param {Element[]|NodeList} fromElements - An array of elements that need to prepend.\n * @param {Element} toElement - An element that is going to prepend.\n * @param {boolean} isEval - ?\n * @returns {Element[] | NodeList} ?\n * @private\n */\nexport function prepend(fromElements, toElement, isEval) {\n var docFrag = document.createDocumentFragment();\n for (var _i = 0, _a = fromElements; _i < _a.length; _i++) {\n var ele = _a[_i];\n docFrag.appendChild(ele);\n }\n toElement.insertBefore(docFrag, toElement.firstElementChild);\n if (isEval) {\n executeScript(toElement);\n }\n return fromElements;\n}\n/**\n * The function used to insert an array of elements into last of the element.\n *\n * @param {Element[]|NodeList} fromElements - An array of elements that need to append.\n * @param {Element} toElement - An element that is going to prepend.\n * @param {boolean} isEval - ?\n * @returns {Element[] | NodeList} ?\n * @private\n */\nexport function append(fromElements, toElement, isEval) {\n var docFrag = document.createDocumentFragment();\n if (fromElements instanceof NodeList) {\n while (fromElements.length > 0) {\n docFrag.appendChild(fromElements[0]);\n }\n }\n else {\n for (var _i = 0, _a = fromElements; _i < _a.length; _i++) {\n var ele = _a[_i];\n docFrag.appendChild(ele);\n }\n }\n toElement.appendChild(docFrag);\n if (isEval) {\n executeScript(toElement);\n }\n return fromElements;\n}\n/**\n * The function is used to evaluate script from Ajax request\n *\n * @param {Element} ele - An element is going to evaluate the script\n * @returns {void} ?\n */\nfunction executeScript(ele) {\n var eleArray = ele.querySelectorAll('script');\n eleArray.forEach(function (element) {\n var script = document.createElement('script');\n script.text = element.innerHTML;\n document.head.appendChild(script);\n detach(script);\n });\n}\n/**\n * The function used to remove the element from parentnode\n *\n * @param {Element|Node|HTMLElement} element - An element that is going to detach from the Dom\n * @returns {any} ?\n * @private\n */\n// eslint-disable-next-line\nexport function detach(element) {\n var parentNode = element.parentNode;\n if (parentNode) {\n return parentNode.removeChild(element);\n }\n}\n/**\n * The function used to remove the element from Dom also clear the bounded events\n *\n * @param {Element|Node|HTMLElement} element - An element remove from the Dom\n * @returns {void} ?\n * @private\n */\nexport function remove(element) {\n var parentNode = element.parentNode;\n EventHandler.clearEvents(element);\n parentNode.removeChild(element);\n}\n/**\n * The function helps to set multiple attributes to an element\n *\n * @param {Element|Node} element - An element that need to set attributes.\n * @param {string} attributes - JSON Object that is going to as attributes.\n * @returns {Element} ?\n * @private\n */\n// eslint-disable-next-line\nexport function attributes(element, attributes) {\n var keys = Object.keys(attributes);\n var ele = element;\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n if (isObject(ele)) {\n var iKey = key;\n if (key === 'tabindex') {\n iKey = 'tabIndex';\n }\n ele.attributes[\"\" + iKey] = attributes[\"\" + key];\n }\n else {\n ele.setAttribute(key, attributes[\"\" + key]);\n }\n }\n return ele;\n}\n/**\n * The function selects the element from giving context.\n *\n * @param {string} selector - Selector string need fetch element\n * @param {Document|Element} context - It is an optional type, That specifies a Dom context.\n * @param {boolean} needsVDOM ?\n * @returns {any} ?\n * @private\n */\n// eslint-disable-next-line\nexport function select(selector, context, needsVDOM) {\n if (context === void 0) { context = document; }\n selector = querySelectId(selector);\n return context.querySelector(selector);\n}\n/**\n * The function selects an array of element from the given context.\n *\n * @param {string} selector - Selector string need fetch element\n * @param {Document|Element} context - It is an optional type, That specifies a Dom context.\n * @param {boolean} needsVDOM ?\n * @returns {HTMLElement[]} ?\n * @private\n */\n// eslint-disable-next-line\nexport function selectAll(selector, context, needsVDOM) {\n if (context === void 0) { context = document; }\n selector = querySelectId(selector);\n var nodeList = context.querySelectorAll(selector);\n return nodeList;\n}\n/**\n * The function selects an id of element from the given context.\n *\n * @param {string} selector - Selector string need fetch element\n * @returns {string} ?\n * @private\n */\nfunction querySelectId(selector) {\n var charRegex = /(!|\"|\\$|%|&|'|\\(|\\)|\\*|\\/|:|;|<|=|\\?|@|\\]|\\^|`|{|}|\\||\\+|~)/g;\n if (selector.match(/#[0-9]/g) || selector.match(charRegex)) {\n var idList = selector.split(',');\n for (var i = 0; i < idList.length; i++) {\n var list = idList[parseInt(i.toString(), 10)].split(' ');\n for (var j = 0; j < list.length; j++) {\n if (list[parseInt(j.toString(), 10)].indexOf('#') > -1) {\n if (!list[parseInt(j.toString(), 10)].match(/\\[.*\\]/)) {\n var splitId = list[parseInt(j.toString(), 10)].split('#');\n if (splitId[1].match(/^\\d/) || splitId[1].match(charRegex)) {\n var setId = list[parseInt(j.toString(), 10)].split('.');\n setId[0] = setId[0].replace(/#/, '[id=\\'') + '\\']';\n list[parseInt(j.toString(), 10)] = setId.join('.');\n }\n }\n }\n }\n idList[parseInt(i.toString(), 10)] = list.join(' ');\n }\n return idList.join(',');\n }\n return selector;\n}\n/**\n * Returns single closest parent element based on class selector.\n *\n * @param {Element} element - An element that need to find the closest element.\n * @param {string} selector - A classSelector of closest element.\n * @returns {Element} ?\n * @private\n */\nexport function closest(element, selector) {\n var el = element;\n if (typeof el.closest === 'function') {\n return el.closest(selector);\n }\n while (el && el.nodeType === 1) {\n if (matches(el, selector)) {\n return el;\n }\n el = el.parentNode;\n }\n return null;\n}\n/**\n * Returns all sibling elements of the given element.\n *\n * @param {Element|Node} element - An element that need to get siblings.\n * @returns {Element[]} ?\n * @private\n */\nexport function siblings(element) {\n var siblings = [];\n var childNodes = Array.prototype.slice.call(element.parentNode.childNodes);\n for (var _i = 0, childNodes_1 = childNodes; _i < childNodes_1.length; _i++) {\n var curNode = childNodes_1[_i];\n if (curNode.nodeType === Node.ELEMENT_NODE && element !== curNode) {\n siblings.push(curNode);\n }\n }\n return siblings;\n}\n/**\n * set the value if not exist. Otherwise set the existing value\n *\n * @param {HTMLElement} element - An element to which we need to set value.\n * @param {string} property - Property need to get or set.\n * @param {string} value - value need to set.\n * @returns {string} ?\n * @private\n */\nexport function getAttributeOrDefault(element, property, value) {\n var attrVal;\n var isObj = isObject(element);\n if (isObj) {\n attrVal = getValue('attributes.' + property, element);\n }\n else {\n attrVal = element.getAttribute(property);\n }\n if (isNullOrUndefined(attrVal) && value) {\n if (!isObj) {\n element.setAttribute(property, value.toString());\n }\n else {\n element.attributes[\"\" + property] = value;\n }\n attrVal = value;\n }\n return attrVal;\n}\n/**\n * Set the style attributes to Html element.\n *\n * @param {HTMLElement} element - Element which we want to set attributes\n * @param {any} attrs - Set the given attributes to element\n * @returns {void} ?\n * @private\n */\nexport function setStyleAttribute(element, attrs) {\n if (attrs !== undefined) {\n Object.keys(attrs).forEach(function (key) {\n // eslint-disable-next-line\n element.style[key] = attrs[key];\n });\n }\n}\n/**\n * Method for add and remove classes to a dom element.\n *\n * @param {Element} element - Element for add and remove classes\n * @param {string[]} addClasses - List of classes need to be add to the element\n * @param {string[]} removeClasses - List of classes need to be remove from the element\n * @returns {void} ?\n * @private\n */\nexport function classList(element, addClasses, removeClasses) {\n addClass([element], addClasses);\n removeClass([element], removeClasses);\n}\n/**\n * Method to check whether the element matches the given selector.\n *\n * @param {Element} element - Element to compare with the selector.\n * @param {string} selector - String selector which element will satisfy.\n * @returns {void} ?\n * @private\n */\nexport function matches(element, selector) {\n // eslint-disable-next-line\n var matches = element.matches || element.msMatchesSelector || element.webkitMatchesSelector;\n if (matches) {\n return matches.call(element, selector);\n }\n else {\n return [].indexOf.call(document.querySelectorAll(selector), element) !== -1;\n }\n}\n/**\n * Method to get the html text from DOM.\n *\n * @param {HTMLElement} ele - Element to compare with the selector.\n * @param {string} innerHTML - String selector which element will satisfy.\n * @returns {void} ?\n * @private\n */\nexport function includeInnerHTML(ele, innerHTML) {\n ele.innerHTML = innerHTML;\n}\n/**\n * Method to get the containsclass.\n *\n * @param {HTMLElement} ele - Element to compare with the selector.\n * @param {string} className - String selector which element will satisfy.\n * @returns {any} ?\n * @private\n */\n// eslint-disable-next-line\nexport function containsClass(ele, className) {\n if (isObject(ele)) {\n // eslint-disable-next-line\n return new RegExp('\\\\b' + className + '\\\\b', 'i').test(ele.attributes.className);\n }\n else {\n return ele.classList.contains(className);\n }\n}\n/**\n * Method to check whether the element matches the given selector.\n *\n * @param {Object} element - Element to compare with the selector.\n * @param {boolean} deep ?\n * @returns {any} ?\n * @private\n */\n// eslint-disable-next-line\nexport function cloneNode(element, deep) {\n if (isObject(element)) {\n if (deep) {\n return extend({}, {}, element, true);\n }\n }\n else {\n return element.cloneNode(deep);\n }\n}\n","import { isUndefined, isNullOrUndefined, merge, setImmediate, setValue, isBlazor, getValue, extend } from './util';\nimport { addClass, removeClass } from './dom';\nimport { Observer } from './observer';\nvar isColEName = new RegExp(']');\n/* tslint:enable:no-any */\n/**\n * Base library module is common module for Framework modules like touch,keyboard and etc.,\n *\n * @private\n */\nvar Base = /** @class */ (function () {\n /**\n * Base constructor accept options and element\n *\n * @param {Object} options ?\n * @param {string} element ?\n */\n function Base(options, element) {\n this.isRendered = false;\n this.isComplexArraySetter = false;\n this.isServerRendered = false;\n this.allowServerDataBinding = true;\n this.isProtectedOnChange = true;\n this.properties = {};\n this.changedProperties = {};\n this.oldProperties = {};\n this.bulkChanges = {};\n this.refreshing = false;\n this.ignoreCollectionWatch = false;\n // eslint-disable-next-line\n this.finalUpdate = function () { };\n this.childChangedProperties = {};\n this.modelObserver = new Observer(this);\n if (!isUndefined(element)) {\n if ('string' === typeof (element)) {\n this.element = document.querySelector(element);\n }\n else {\n this.element = element;\n }\n if (!isNullOrUndefined(this.element)) {\n this.isProtectedOnChange = false;\n this.addInstance();\n }\n }\n if (!isUndefined(options)) {\n this.setProperties(options, true);\n }\n this.isDestroyed = false;\n }\n /** Property base section */\n /**\n * Function used to set bunch of property at a time.\n *\n * @private\n * @param {Object} prop - JSON object which holds components properties.\n * @param {boolean} muteOnChange ? - Specifies to true when we set properties.\n * @returns {void} ?\n */\n Base.prototype.setProperties = function (prop, muteOnChange) {\n var prevDetection = this.isProtectedOnChange;\n this.isProtectedOnChange = !!muteOnChange;\n merge(this, prop);\n if (muteOnChange !== true) {\n merge(this.changedProperties, prop);\n this.dataBind();\n }\n else if (isBlazor() && this.isRendered) {\n this.serverDataBind(prop);\n }\n this.finalUpdate();\n this.changedProperties = {};\n this.oldProperties = {};\n this.isProtectedOnChange = prevDetection;\n };\n /**\n * Calls for child element data bind\n *\n * @param {Object} obj ?\n * @param {Object} parent ?\n * @returns {void} ?\n */\n // tslint:disable-next-line:no-any\n Base.callChildDataBind = function (obj, parent) {\n var keys = Object.keys(obj);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n if (parent[\"\" + key] instanceof Array) {\n for (var _a = 0, _b = parent[\"\" + key]; _a < _b.length; _a++) {\n var obj_1 = _b[_a];\n if (obj_1.dataBind !== undefined) {\n obj_1.dataBind();\n }\n }\n }\n else {\n parent[\"\" + key].dataBind();\n }\n }\n };\n Base.prototype.clearChanges = function () {\n this.finalUpdate();\n this.changedProperties = {};\n this.oldProperties = {};\n this.childChangedProperties = {};\n };\n /**\n * Bind property changes immediately to components\n *\n * @returns {void} ?\n */\n Base.prototype.dataBind = function () {\n Base.callChildDataBind(this.childChangedProperties, this);\n if (Object.getOwnPropertyNames(this.changedProperties).length) {\n var prevDetection = this.isProtectedOnChange;\n var newChanges = this.changedProperties;\n var oldChanges = this.oldProperties;\n this.clearChanges();\n this.isProtectedOnChange = true;\n this.onPropertyChanged(newChanges, oldChanges);\n this.isProtectedOnChange = prevDetection;\n }\n };\n /* tslint:disable:no-any */\n Base.prototype.serverDataBind = function (newChanges) {\n if (!isBlazor()) {\n return;\n }\n newChanges = newChanges ? newChanges : {};\n extend(this.bulkChanges, {}, newChanges, true);\n var sfBlazor = 'sfBlazor';\n if (this.allowServerDataBinding && window[\"\" + sfBlazor].updateModel) {\n window[\"\" + sfBlazor].updateModel(this);\n this.bulkChanges = {};\n }\n };\n /* tslint:enable:no-any */\n Base.prototype.saveChanges = function (key, newValue, oldValue) {\n if (isBlazor()) {\n // tslint:disable-next-line:no-any\n var newChanges = {};\n newChanges[\"\" + key] = newValue;\n this.serverDataBind(newChanges);\n }\n if (this.isProtectedOnChange) {\n return;\n }\n this.oldProperties[\"\" + key] = oldValue;\n this.changedProperties[\"\" + key] = newValue;\n this.finalUpdate();\n this.finalUpdate = setImmediate(this.dataBind.bind(this));\n };\n /** Event Base Section */\n /**\n * Adds the handler to the given event listener.\n *\n * @param {string} eventName - A String that specifies the name of the event\n * @param {Function} handler - Specifies the call to run when the event occurs.\n * @returns {void} ?\n */\n Base.prototype.addEventListener = function (eventName, handler) {\n this.modelObserver.on(eventName, handler);\n };\n /**\n * Removes the handler from the given event listener.\n *\n * @param {string} eventName - A String that specifies the name of the event to remove\n * @param {Function} handler - Specifies the function to remove\n * @returns {void} ?\n */\n Base.prototype.removeEventListener = function (eventName, handler) {\n this.modelObserver.off(eventName, handler);\n };\n /**\n * Triggers the handlers in the specified event.\n *\n * @private\n * @param {string} eventName - Specifies the event to trigger for the specified component properties.\n * Can be a custom event, or any of the standard events.\n * @param {Event} eventProp - Additional parameters to pass on to the event properties\n * @param {Function} successHandler - this function will invoke after event successfully triggered\n * @param {Function} errorHandler - this function will invoke after event if it failured to call.\n * @returns {void} ?\n */\n Base.prototype.trigger = function (eventName, eventProp, successHandler, errorHandler) {\n var _this = this;\n if (this.isDestroyed !== true) {\n var prevDetection = this.isProtectedOnChange;\n this.isProtectedOnChange = false;\n var data = this.modelObserver.notify(eventName, eventProp, successHandler, errorHandler);\n if (isColEName.test(eventName)) {\n var handler = getValue(eventName, this);\n if (handler) {\n var blazor = 'Blazor';\n if (window[\"\" + blazor]) {\n var promise = handler.call(this, eventProp);\n if (promise && typeof promise.then === 'function') {\n if (!successHandler) {\n data = promise;\n }\n else {\n promise.then(function (data) {\n if (successHandler) {\n data = typeof data === 'string' && _this.modelObserver.isJson(data) ?\n JSON.parse(data) : data;\n successHandler.call(_this, data);\n }\n }).catch(function (data) {\n if (errorHandler) {\n data = typeof data === 'string' && _this.modelObserver.isJson(data) ? JSON.parse(data) : data;\n errorHandler.call(_this, data);\n }\n });\n }\n }\n else if (successHandler) {\n successHandler.call(this, eventProp);\n }\n }\n else {\n handler.call(this, eventProp);\n if (successHandler) {\n successHandler.call(this, eventProp);\n }\n }\n }\n else if (successHandler) {\n successHandler.call(this, eventProp);\n }\n }\n this.isProtectedOnChange = prevDetection;\n return data;\n }\n };\n /**\n * To maintain instance in base class\n *\n * @returns {void} ?\n */\n Base.prototype.addInstance = function () {\n // Add module class to the root element\n var moduleClass = 'e-' + this.getModuleName().toLowerCase();\n addClass([this.element], ['e-lib', moduleClass]);\n if (!isNullOrUndefined(this.element.ej2_instances)) {\n this.element.ej2_instances.push(this);\n }\n else {\n setValue('ej2_instances', [this], this.element);\n }\n };\n /**\n * To remove the instance from the element\n *\n * @returns {void} ?\n */\n Base.prototype.destroy = function () {\n var _this = this;\n // eslint-disable-next-line\n this.element.ej2_instances =\n this.element.ej2_instances ?\n this.element.ej2_instances.filter(function (i) {\n if (proxyToRaw) {\n return proxyToRaw(i) !== proxyToRaw(_this);\n }\n return i !== _this;\n })\n : [];\n removeClass([this.element], ['e-' + this.getModuleName()]);\n if (this.element.ej2_instances.length === 0) {\n // Remove module class from the root element\n removeClass([this.element], ['e-lib']);\n }\n this.clearChanges();\n this.modelObserver.destroy();\n this.isDestroyed = true;\n };\n return Base;\n}());\nexport { Base };\n/**\n * Global function to get the component instance from the rendered element.\n *\n * @param {HTMLElement} elem Specifies the HTMLElement or element id string.\n * @param {string} comp Specifies the component module name or Component.\n * @returns {any} ?\n */\n// tslint:disable-next-line:no-any\nexport function getComponent(elem, comp) {\n var instance;\n var i;\n var ele = typeof elem === 'string' ? document.getElementById(elem) : elem;\n for (i = 0; i < ele.ej2_instances.length; i++) {\n instance = ele.ej2_instances[parseInt(i.toString(), 10)];\n if (typeof comp === 'string') {\n var compName = instance.getModuleName();\n if (comp === compName) {\n return instance;\n }\n }\n else {\n // tslint:disable-next-line:no-any\n if (instance instanceof comp) {\n return instance;\n }\n }\n }\n return undefined;\n}\n/**\n * Function to remove the child instances.\n *\n * @param {HTMLElement} element ?\n * @return {void}\n * @private\n */\n// tslint:disable-next-line:no-any\nexport function removeChildInstance(element) {\n // tslint:disable-next-line:no-any\n var childEle = [].slice.call(element.getElementsByClassName('e-control'));\n for (var i = 0; i < childEle.length; i++) {\n var compName = childEle[parseInt(i.toString(), 10)].classList[1].split('e-')[1];\n // tslint:disable-next-line:no-any\n var compInstance = getComponent(childEle[parseInt(i.toString(), 10)], compName);\n if (!isUndefined(compInstance)) {\n compInstance.destroy();\n }\n }\n}\nexport var proxyToRaw;\nexport var setProxyToRaw = function (toRaw) { proxyToRaw = toRaw; };\n","import { createInstance, isUndefined, merge, extend, getValue } from './util';\n/**\n * Returns the Class Object\n *\n * @param {ClassObject} instance - instance of ClassObject\n * @param {string} curKey - key of the current instance\n * @param {Object} defaultValue - default Value\n * @param {Object[]} type ?\n * @returns {ClassObject} ?\n */\n// eslint-disable-next-line\nfunction getObject(instance, curKey, defaultValue, type) {\n // eslint-disable-next-line\n if (!instance.properties.hasOwnProperty(curKey) || !(instance.properties[curKey] instanceof type)) {\n instance.properties[\"\" + curKey] = createInstance(type, [instance, curKey, defaultValue]);\n }\n return instance.properties[\"\" + curKey];\n}\n/**\n * Returns object array\n *\n * @param {ClassObject} instance ?\n * @param {string} curKey ?\n * @param {Object[]} defaultValue ?\n * @param {Object} type ?\n * @param {boolean} isSetter ?\n * @param {boolean} isFactory ?\n * @returns {Object[]} ?\n */\n// eslint-disable-next-line\nfunction getObjectArray(instance, curKey, defaultValue, type, isSetter, isFactory) {\n var result = [];\n var len = defaultValue ? defaultValue.length : 0;\n for (var i = 0; i < len; i++) {\n var curType = type;\n if (isFactory) {\n curType = type(defaultValue[parseInt(i.toString(), 10)], instance);\n }\n if (isSetter) {\n var inst = createInstance(curType, [instance, curKey, {}, true]);\n inst.setProperties(defaultValue[parseInt(i.toString(), 10)], true);\n result.push(inst);\n }\n else {\n result.push(createInstance(curType, [instance, curKey, defaultValue[parseInt(i.toString(), 10)], false]));\n }\n }\n return result;\n}\n/**\n * Returns the properties of the object\n *\n * @param {Object} defaultValue ?\n * @param {string} curKey ?\n * @returns {void} ?\n */\nfunction propertyGetter(defaultValue, curKey) {\n return function () {\n // eslint-disable-next-line\n if (!this.properties.hasOwnProperty(curKey)) {\n this.properties[\"\" + curKey] = defaultValue;\n }\n return this.properties[\"\" + curKey];\n };\n}\n/**\n * Set the properties for the object\n *\n * @param {Object} defaultValue ?\n * @param {string} curKey ?\n * @returns {void} ?\n */\nfunction propertySetter(defaultValue, curKey) {\n return function (newValue) {\n if (this.properties[\"\" + curKey] !== newValue) {\n // eslint-disable-next-line\n var oldVal = this.properties.hasOwnProperty(curKey) ? this.properties[curKey] : defaultValue;\n this.saveChanges(curKey, newValue, oldVal);\n this.properties[\"\" + curKey] = newValue;\n }\n };\n}\n/**\n * Returns complex objects\n *\n * @param {Object} defaultValue ?\n * @param {string} curKey ?\n * @param {Object[]} type ?\n * @returns {void} ?\n */\n// eslint-disable-next-line\nfunction complexGetter(defaultValue, curKey, type) {\n return function () {\n return getObject(this, curKey, defaultValue, type);\n };\n}\n/**\n * Sets complex objects\n *\n * @param {Object} defaultValue ?\n * @param {string} curKey ?\n * @param {Object[]} type ?\n * @returns {void} ?\n */\nfunction complexSetter(defaultValue, curKey, type) {\n return function (newValue) {\n getObject(this, curKey, defaultValue, type).setProperties(newValue);\n };\n}\n/**\n *\n * @param {Object} defaultValue ?\n * @param {string} curKey ?\n * @param {FunctionConstructor} type ?\n * @returns {void} ?\n */\n// eslint-disable-next-line\nfunction complexFactoryGetter(defaultValue, curKey, type) {\n return function () {\n var curType = type({});\n // eslint-disable-next-line\n if (this.properties.hasOwnProperty(curKey)) {\n return this.properties[\"\" + curKey];\n }\n else {\n return getObject(this, curKey, defaultValue, curType);\n }\n };\n}\n/**\n *\n * @param {Object} defaultValue ?\n * @param {string} curKey ?\n * @param {Object[]} type ?\n * @returns {void} ?\n */\nfunction complexFactorySetter(defaultValue, curKey, type) {\n return function (newValue) {\n var curType = type(newValue, this);\n getObject(this, curKey, defaultValue, curType).setProperties(newValue);\n };\n}\n/**\n *\n * @param {Object[]} defaultValue ?\n * @param {string} curKey ?\n * @param {Object[]} type ?\n * @returns {void} ?\n */\nfunction complexArrayGetter(defaultValue, curKey, type) {\n return function () {\n var _this = this;\n // eslint-disable-next-line\n if (!this.properties.hasOwnProperty(curKey)) {\n var defCollection = getObjectArray(this, curKey, defaultValue, type, false);\n this.properties[\"\" + curKey] = defCollection;\n }\n var ignore = ((this.controlParent !== undefined && this.controlParent.ignoreCollectionWatch)\n || this.ignoreCollectionWatch);\n // eslint-disable-next-line\n if (!this.properties[curKey].hasOwnProperty('push') && !ignore) {\n ['push', 'pop'].forEach(function (extendFunc) {\n var descriptor = {\n value: complexArrayDefinedCallback(extendFunc, curKey, type, _this.properties[\"\" + curKey]).bind(_this),\n configurable: true\n };\n Object.defineProperty(_this.properties[\"\" + curKey], extendFunc, descriptor);\n });\n }\n // eslint-disable-next-line\n if (!this.properties[curKey].hasOwnProperty('isComplexArray')) {\n Object.defineProperty(this.properties[\"\" + curKey], 'isComplexArray', { value: true });\n }\n return this.properties[\"\" + curKey];\n };\n}\n/**\n *\n * @param {Object[]} defaultValue ?\n * @param {string} curKey ?\n * @param {Object[]} type ?\n * @returns {void} ?\n */\nfunction complexArraySetter(defaultValue, curKey, type) {\n return function (newValue) {\n this.isComplexArraySetter = true;\n var oldValueCollection = getObjectArray(this, curKey, defaultValue, type, false);\n var newValCollection = getObjectArray(this, curKey, newValue, type, true);\n this.isComplexArraySetter = false;\n this.saveChanges(curKey, newValCollection, oldValueCollection);\n this.properties[\"\" + curKey] = newValCollection;\n };\n}\n/**\n *\n * @param {Object[]} defaultValue ?\n * @param {string} curKey ?\n * @param {Object[]} type ?\n * @returns {void} ?\n */\nfunction complexArrayFactorySetter(defaultValue, curKey, type) {\n return function (newValue) {\n // eslint-disable-next-line\n var oldValueCollection = this.properties.hasOwnProperty(curKey) ? this.properties[curKey] : defaultValue;\n var newValCollection = getObjectArray(this, curKey, newValue, type, true, true);\n this.saveChanges(curKey, newValCollection, oldValueCollection);\n this.properties[\"\" + curKey] = newValCollection;\n };\n}\n/**\n *\n * @param {Object[]} defaultValue ?\n * @param {string} curKey ?\n * @param {FunctionConstructor} type ?\n * @returns {void} ?\n */\nfunction complexArrayFactoryGetter(defaultValue, curKey, type) {\n return function () {\n var curType = type({});\n // eslint-disable-next-line\n if (!this.properties.hasOwnProperty(curKey)) {\n var defCollection = getObjectArray(this, curKey, defaultValue, curType, false);\n this.properties[\"\" + curKey] = defCollection;\n }\n return this.properties[\"\" + curKey];\n };\n}\n/**\n *\n * @param {string} dFunc ?\n * @param {string} curKey ?\n * @param {Object} type ?\n * @param {Object} prop ?\n * @returns {Object} ?\n */\nfunction complexArrayDefinedCallback(dFunc, curKey, type, prop) {\n /* tslint:disable no-function-expression */\n return function () {\n var newValue = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n newValue[_i] = arguments[_i];\n }\n var keyString = this.propName ? this.getParentKey() + '.' + curKey + '-' : curKey + '-';\n switch (dFunc) {\n case 'push':\n for (var i = 0; i < newValue.length; i++) {\n var newValueParse = newValue[parseInt(i.toString(), 10)];\n Array.prototype[\"\" + dFunc].apply(prop, [newValueParse]);\n var model_1 = getArrayModel(keyString + (prop.length - 1), newValueParse, !this.controlParent, dFunc);\n this.serverDataBind(model_1, newValue[parseInt(i.toString(), 10)], false, dFunc);\n }\n break;\n case 'pop':\n Array.prototype[\"\" + dFunc].apply(prop);\n // eslint-disable-next-line\n var model = getArrayModel(keyString + prop.length, null, !this.controlParent, dFunc);\n this.serverDataBind(model, { ejsAction: 'pop' }, false, dFunc);\n break;\n }\n return prop;\n };\n}\n/**\n *\n * @param {string} keyString ?\n * @param {Object} value ?\n * @param {boolean} isControlParent ?\n * @param {string} arrayFunction ?\n * @returns {Object} ?\n */\nfunction getArrayModel(keyString, value, isControlParent, arrayFunction) {\n var modelObject = keyString;\n if (isControlParent) {\n modelObject = {};\n modelObject[\"\" + keyString] = value;\n if (value && typeof value === 'object') {\n var action = 'ejsAction';\n modelObject[\"\" + keyString][\"\" + action] = arrayFunction;\n }\n }\n return modelObject;\n}\n// eslint-disable-next-line\n/**\n * Method used to create property. General syntax below.\n *\n * @param {Object} defaultValue - Specifies the default value of property.\n * @returns {PropertyDecorator} ?\n * ```\n * @Property('TypeScript')\n * propertyName: Type;\n * ```\n * @private\n */\nexport function Property(defaultValue) {\n return function (target, key) {\n var propertyDescriptor = {\n set: propertySetter(defaultValue, key),\n get: propertyGetter(defaultValue, key),\n enumerable: true,\n configurable: true\n };\n //new property creation\n Object.defineProperty(target, key, propertyDescriptor);\n addPropertyCollection(target, key, 'prop', defaultValue);\n };\n}\n/**\n * Method used to create complex property. General syntax below.\n *\n * @param {any} defaultValue - Specifies the default value of property.\n * @param {Function} type - Specifies the class type of complex object.\n * @returns {PropertyDecorator} ?\n * ```\n * @Complex({},Type)\n * propertyName: Type;\n * ```\n * @private\n */\nexport function Complex(defaultValue, type) {\n return function (target, key) {\n var propertyDescriptor = {\n set: complexSetter(defaultValue, key, type),\n get: complexGetter(defaultValue, key, type),\n enumerable: true,\n configurable: true\n };\n //new property creation\n Object.defineProperty(target, key, propertyDescriptor);\n addPropertyCollection(target, key, 'complexProp', defaultValue, type);\n };\n}\n/**\n * Method used to create complex Factory property. General syntax below.\n *\n * @param {Function} type - Specifies the class factory type of complex object.\n * @returns {PropertyDecorator} ?\n * ```\n * @ComplexFactory(defaultType, factoryFunction)\n * propertyName: Type1 | Type2;\n * ```\n * @private\n */\nexport function ComplexFactory(type) {\n return function (target, key) {\n var propertyDescriptor = {\n set: complexFactorySetter({}, key, type),\n get: complexFactoryGetter({}, key, type),\n enumerable: true,\n configurable: true\n };\n //new property creation\n Object.defineProperty(target, key, propertyDescriptor);\n addPropertyCollection(target, key, 'complexProp', {}, type);\n };\n}\n/**\n * Method used to create complex array property. General syntax below.\n *\n * @param {any} defaultValue - Specifies the default value of property.\n * @param {Function} type - Specifies the class type of complex object.\n * @returns {PropertyDecorator} ?\n * ```\n * @Collection([], Type);\n * propertyName: Type;\n * ```\n * @private\n */\nexport function Collection(defaultValue, type) {\n return function (target, key) {\n var propertyDescriptor = {\n set: complexArraySetter(defaultValue, key, type),\n get: complexArrayGetter(defaultValue, key, type),\n enumerable: true,\n configurable: true\n };\n //new property creation\n Object.defineProperty(target, key, propertyDescriptor);\n addPropertyCollection(target, key, 'colProp', defaultValue, type);\n };\n}\n/**\n * Method used to create complex factory array property. General syntax below.\n *\n * @param {Function} type - Specifies the class type of complex object.\n * @returns {PropertyCollectionInfo} ?\n * ```\n * @Collection([], Type);\n * propertyName: Type;\n * ```\n * @private\n */\nexport function CollectionFactory(type) {\n return function (target, key) {\n var propertyDescriptor = {\n set: complexArrayFactorySetter([], key, type),\n get: complexArrayFactoryGetter([], key, type),\n enumerable: true,\n configurable: true\n };\n //new property creation\n Object.defineProperty(target, key, propertyDescriptor);\n addPropertyCollection(target, key, 'colProp', {}, type);\n };\n}\n/**\n * Method used to create event property. General syntax below.\n *\n * @returns {PropertyDecorator} ?\n * ```\n * @Event(()=>{return true;})\n * ```\n * @private\n */\nexport function Event() {\n return function (target, key) {\n var eventDescriptor = {\n set: function (newValue) {\n var oldValue = this.properties[\"\" + key];\n if (oldValue !== newValue) {\n var finalContext = getParentContext(this, key);\n if (isUndefined(oldValue) === false) {\n finalContext.context.removeEventListener(finalContext.prefix, oldValue);\n }\n finalContext.context.addEventListener(finalContext.prefix, newValue);\n this.properties[\"\" + key] = newValue;\n }\n },\n get: propertyGetter(undefined, key),\n enumerable: true,\n configurable: true\n };\n Object.defineProperty(target, key, eventDescriptor);\n addPropertyCollection(target, key, 'event');\n };\n}\n/**\n * NotifyPropertyChanges is triggers the call back when the property has been changed.\n *\n * @param {Function} classConstructor ?\n * @returns {void} ?\n * ```\n * @NotifyPropertyChanges\n * class DemoClass implements INotifyPropertyChanged {\n *\n * @Property()\n * property1: string;\n *\n * dataBind: () => void;\n *\n * constructor() { }\n *\n * onPropertyChanged(newProp: any, oldProp: any) {\n * // Called when property changed\n * }\n * }\n * ```\n * @private\n */\n// eslint-disable-next-line\nexport function NotifyPropertyChanges(classConstructor) {\n /** Need to code */\n}\n/**\n * Method used to create the builderObject for the target component.\n *\n * @param {BuildInfo} target ?\n * @param {string} key ?\n * @param {string} propertyType ?\n * @param {Object} defaultValue ?\n * @param {Function} type ?\n * @returns {void} ?\n * @private\n */\nfunction addPropertyCollection(target, key, propertyType, defaultValue, type) {\n if (isUndefined(target.propList)) {\n target.propList = {\n props: [],\n complexProps: [],\n colProps: [],\n events: [],\n propNames: [],\n complexPropNames: [],\n colPropNames: [],\n eventNames: []\n };\n }\n // eslint-disable-next-line\n target.propList[propertyType + 's'].push({\n propertyName: key,\n defaultValue: defaultValue,\n type: type\n });\n // eslint-disable-next-line\n target.propList[propertyType + 'Names'].push(key);\n}\n/**\n * Returns an object containing the builder properties\n *\n * @param {Function} component ?\n * @returns {Object} ?\n * @private\n */\nfunction getBuilderProperties(component) {\n if (isUndefined(component.prototype.builderObject)) {\n component.prototype.builderObject = {\n properties: {}, propCollections: [], add: function () {\n this.isPropertyArray = true;\n this.propCollections.push(extend({}, this.properties, {}));\n }\n };\n var rex = /complex/;\n for (var _i = 0, _a = Object.keys(component.prototype.propList); _i < _a.length; _i++) {\n var key = _a[_i];\n var _loop_1 = function (prop) {\n if (rex.test(key)) {\n component.prototype.builderObject[prop.propertyName] = function (value) {\n var childType = {};\n merge(childType, getBuilderProperties(prop.type));\n value(childType);\n var tempValue;\n if (!childType.isPropertyArray) {\n tempValue = extend({}, childType.properties, {});\n }\n else {\n tempValue = childType.propCollections;\n }\n this.properties[prop.propertyName] = tempValue;\n childType.properties = {};\n childType.propCollections = [];\n childType.isPropertyArray = false;\n return this;\n };\n }\n else {\n component.prototype.builderObject[prop.propertyName] = function (value) {\n this.properties[prop.propertyName] = value;\n return this;\n };\n }\n };\n for (var _b = 0, _c = component.prototype.propList[\"\" + key]; _b < _c.length; _b++) {\n var prop = _c[_b];\n _loop_1(prop);\n }\n }\n }\n return component.prototype.builderObject;\n}\n/**\n * Method used to create builder for the components\n *\n * @param {any} component -specifies the target component for which builder to be created.\n * @returns {Object} ?\n * @private\n */\nexport function CreateBuilder(component) {\n var builderFunction = function (element) {\n this.element = element;\n return this;\n };\n var instanceFunction = function (element) {\n // eslint-disable-next-line\n if (!builderFunction.prototype.hasOwnProperty('create')) {\n builderFunction.prototype = getBuilderProperties(component);\n builderFunction.prototype.create = function () {\n var temp = extend({}, {}, this.properties);\n this.properties = {};\n return new component(temp, this.element);\n };\n }\n return new builderFunction(element);\n };\n return instanceFunction;\n}\n/**\n * Returns parent options for the object\n *\n * @param {Object} context ?\n * @param {string} prefix ?\n * @returns {ParentOption} ?\n * @private\n */\nfunction getParentContext(context, prefix) {\n // eslint-disable-next-line\n if (context.hasOwnProperty('parentObj') === false) {\n return { context: context, prefix: prefix };\n }\n else {\n var curText = getValue('propName', context);\n if (curText) {\n prefix = curText + '-' + prefix;\n }\n return getParentContext(getValue('parentObj', context), prefix);\n }\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { createElement, selectAll, closest } from './dom';\nimport { Base } from './base';\nimport { Browser } from './browser';\nimport { EventHandler } from './event-handler';\nimport { Property, NotifyPropertyChanges, Event } from './notify-property-change';\n/**\n * The Animation framework provide options to animate the html DOM elements\n * ```typescript\n * let animeObject = new Animation({\n * name: 'SlideLeftIn',\n * duration: 1000\n * });\n * animeObject.animate('#anime1');\n * animeObject.animate('#anime2', { duration: 500 });\n * ```\n */\nvar Animation = /** @class */ (function (_super) {\n __extends(Animation, _super);\n function Animation(options) {\n var _this = _super.call(this, options, undefined) || this;\n /**\n * @private\n */\n _this.easing = {\n ease: 'cubic-bezier(0.250, 0.100, 0.250, 1.000)',\n linear: 'cubic-bezier(0.250, 0.250, 0.750, 0.750)',\n easeIn: 'cubic-bezier(0.420, 0.000, 1.000, 1.000)',\n easeOut: 'cubic-bezier(0.000, 0.000, 0.580, 1.000)',\n easeInOut: 'cubic-bezier(0.420, 0.000, 0.580, 1.000)',\n elasticInOut: 'cubic-bezier(0.5,-0.58,0.38,1.81)',\n elasticIn: 'cubic-bezier(0.17,0.67,0.59,1.81)',\n elasticOut: 'cubic-bezier(0.7,-0.75,0.99,1.01)'\n };\n return _this;\n }\n Animation_1 = Animation;\n /**\n * Applies animation to the current element.\n *\n * @param {string | HTMLElement} element - Element which needs to be animated.\n * @param {AnimationModel} options - Overriding default animation settings.\n * @returns {void} ?\n */\n Animation.prototype.animate = function (element, options) {\n options = !options ? {} : options;\n var model = this.getModel(options);\n if (typeof element === 'string') {\n var elements = Array.prototype.slice.call(selectAll(element, document));\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var element_1 = elements_1[_i];\n model.element = element_1;\n Animation_1.delayAnimation(model);\n }\n }\n else {\n model.element = element;\n Animation_1.delayAnimation(model);\n }\n };\n /**\n * Stop the animation effect on animated element.\n *\n * @param {HTMLElement} element - Element which needs to be stop the animation.\n * @param {AnimationOptions} model - Handling the animation model at stop function.\n * @return {void}\n */\n Animation.stop = function (element, model) {\n element.style.animation = '';\n element.removeAttribute('e-animate');\n var animationId = element.getAttribute('e-animation-id');\n if (animationId) {\n var frameId = parseInt(animationId, 10);\n cancelAnimationFrame(frameId);\n element.removeAttribute('e-animation-id');\n }\n if (model && model.end) {\n model.end.call(this, model);\n }\n };\n /**\n * Set delay to animation element\n *\n * @param {AnimationModel} model ?\n * @returns {void}\n */\n Animation.delayAnimation = function (model) {\n if (animationMode === 'Disable' || animationMode === GlobalAnimationMode.Disable) {\n if (model.begin) {\n model.begin.call(this, model);\n }\n if (model.end) {\n model.end.call(this, model);\n }\n }\n else {\n if (model.delay) {\n setTimeout(function () { Animation_1.applyAnimation(model); }, model.delay);\n }\n else {\n Animation_1.applyAnimation(model);\n }\n }\n };\n /**\n * Triggers animation\n *\n * @param {AnimationModel} model ?\n * @returns {void}\n */\n Animation.applyAnimation = function (model) {\n var _this = this;\n model.timeStamp = 0;\n var step = 0;\n var timerId = 0;\n var prevTimeStamp = 0;\n var duration = model.duration;\n model.element.setAttribute('e-animate', 'true');\n var startAnimation = function (timeStamp) {\n try {\n if (timeStamp) {\n // let step: number = model.timeStamp = timeStamp - startTime;\n /** phantomjs workaround for timestamp fix */\n prevTimeStamp = prevTimeStamp === 0 ? timeStamp : prevTimeStamp;\n model.timeStamp = (timeStamp + model.timeStamp) - prevTimeStamp;\n prevTimeStamp = timeStamp;\n /** phantomjs workaround end */\n // trigger animation begin event\n if (!step && model.begin) {\n model.begin.call(_this, model);\n }\n step = step + 1;\n var avg = model.timeStamp / step;\n if (model.timeStamp < duration && model.timeStamp + avg < duration && model.element.getAttribute('e-animate')) {\n // apply animation effect to the current element\n model.element.style.animation = model.name + ' ' + model.duration + 'ms ' + model.timingFunction;\n if (model.progress) {\n model.progress.call(_this, model);\n }\n // repeat requestAnimationFrame\n requestAnimationFrame(startAnimation);\n }\n else {\n // clear requestAnimationFrame\n cancelAnimationFrame(timerId);\n model.element.removeAttribute('e-animation-id');\n model.element.removeAttribute('e-animate');\n model.element.style.animation = '';\n if (model.end) {\n model.end.call(_this, model);\n }\n }\n }\n else {\n //startTime = performance.now();\n // set initial requestAnimationFrame\n timerId = requestAnimationFrame(startAnimation);\n model.element.setAttribute('e-animation-id', timerId.toString());\n }\n }\n catch (e) {\n cancelAnimationFrame(timerId);\n model.element.removeAttribute('e-animation-id');\n if (model.fail) {\n model.fail.call(_this, e);\n }\n }\n };\n startAnimation();\n };\n /**\n * Returns Animation Model\n *\n * @param {AnimationModel} options ?\n * @returns {AnimationModel} ?\n */\n Animation.prototype.getModel = function (options) {\n return {\n name: options.name || this.name,\n delay: options.delay || this.delay,\n duration: (options.duration !== undefined ? options.duration : this.duration),\n begin: options.begin || this.begin,\n end: options.end || this.end,\n fail: options.fail || this.fail,\n progress: options.progress || this.progress,\n timingFunction: this.easing[options.timingFunction] ? this.easing[options.timingFunction] :\n (options.timingFunction || this.easing[this.timingFunction])\n };\n };\n /**\n * @private\n * @param {AnimationModel} newProp ?\n * @param {AnimationModel} oldProp ?\n * @returns {void} ?\n */\n // eslint-disable-next-line\n Animation.prototype.onPropertyChanged = function (newProp, oldProp) {\n // no code needed\n };\n /**\n * Returns module name as animation\n *\n * @private\n * @returns {void} ?\n */\n Animation.prototype.getModuleName = function () {\n return 'animation';\n };\n /**\n *\n * @private\n * @returns {void} ?\n */\n Animation.prototype.destroy = function () {\n //Override base destroy;\n };\n var Animation_1;\n __decorate([\n Property('FadeIn')\n ], Animation.prototype, \"name\", void 0);\n __decorate([\n Property(400)\n ], Animation.prototype, \"duration\", void 0);\n __decorate([\n Property('ease')\n ], Animation.prototype, \"timingFunction\", void 0);\n __decorate([\n Property(0)\n ], Animation.prototype, \"delay\", void 0);\n __decorate([\n Event()\n ], Animation.prototype, \"progress\", void 0);\n __decorate([\n Event()\n ], Animation.prototype, \"begin\", void 0);\n __decorate([\n Event()\n ], Animation.prototype, \"end\", void 0);\n __decorate([\n Event()\n ], Animation.prototype, \"fail\", void 0);\n Animation = Animation_1 = __decorate([\n NotifyPropertyChanges\n ], Animation);\n return Animation;\n}(Base));\nexport { Animation };\n/**\n * Ripple provides material theme's wave effect when an element is clicked\n * ```html\n *
\n * \n * ```\n *\n * @private\n * @param {HTMLElement} element - Target element\n * @param {RippleOptions} rippleOptions - Ripple options .\n * @param {Function} done .\n * @returns {void} .\n */\nexport function rippleEffect(element, rippleOptions, done) {\n var rippleModel = getRippleModel(rippleOptions);\n if (rippleModel.rippleFlag === false || (rippleModel.rippleFlag === undefined && !isRippleEnabled)) {\n return (function () {\n // do nothing.\n });\n }\n element.setAttribute('data-ripple', 'true');\n EventHandler.add(element, 'mousedown', rippleHandler, { parent: element, rippleOptions: rippleModel });\n EventHandler.add(element, 'mouseup', rippleUpHandler, { parent: element, rippleOptions: rippleModel, done: done });\n EventHandler.add(element, 'mouseleave', rippleLeaveHandler, { parent: element, rippleOptions: rippleModel });\n if (Browser.isPointer) {\n EventHandler.add(element, 'transitionend', rippleLeaveHandler, { parent: element, rippleOptions: rippleModel });\n }\n return (function () {\n element.removeAttribute('data-ripple');\n EventHandler.remove(element, 'mousedown', rippleHandler);\n EventHandler.remove(element, 'mouseup', rippleUpHandler);\n EventHandler.remove(element, 'mouseleave', rippleLeaveHandler);\n EventHandler.remove(element, 'transitionend', rippleLeaveHandler);\n });\n}\n/**\n * Handler for ripple model\n *\n * @param {RippleOptions} rippleOptions ?\n * @returns {RippleOptions} ?\n */\nfunction getRippleModel(rippleOptions) {\n var rippleModel = {\n selector: rippleOptions && rippleOptions.selector ? rippleOptions.selector : null,\n ignore: rippleOptions && rippleOptions.ignore ? rippleOptions.ignore : null,\n rippleFlag: rippleOptions && rippleOptions.rippleFlag,\n isCenterRipple: rippleOptions && rippleOptions.isCenterRipple,\n duration: rippleOptions && rippleOptions.duration ? rippleOptions.duration : 350\n };\n return rippleModel;\n}\n/**\n * Handler for ripple event\n *\n * @param {MouseEvent} e ?\n * @returns {void} ?\n * @private\n */\nfunction rippleHandler(e) {\n var target = (e.target);\n var selector = this.rippleOptions.selector;\n var element = selector ? closest(target, selector) : target;\n if (!element || (this.rippleOptions && closest(target, this.rippleOptions.ignore))) {\n return;\n }\n var offset = element.getBoundingClientRect();\n var offsetX = e.pageX - document.body.scrollLeft;\n var offsetY = e.pageY - ((!document.body.scrollTop && document.documentElement) ?\n document.documentElement.scrollTop : document.body.scrollTop);\n var pageX = Math.max(Math.abs(offsetX - offset.left), Math.abs(offsetX - offset.right));\n var pageY = Math.max(Math.abs(offsetY - offset.top), Math.abs(offsetY - offset.bottom));\n var radius = Math.sqrt(pageX * pageX + pageY * pageY);\n var diameter = radius * 2 + 'px';\n var x = offsetX - offset.left - radius;\n var y = offsetY - offset.top - radius;\n if (this.rippleOptions && this.rippleOptions.isCenterRipple) {\n x = 0;\n y = 0;\n diameter = '100%';\n }\n element.classList.add('e-ripple');\n var duration = this.rippleOptions.duration.toString();\n var styles = 'width: ' + diameter + ';height: ' + diameter + ';left: ' + x + 'px;top: ' + y + 'px;' +\n 'transition-duration: ' + duration + 'ms;';\n var rippleElement = createElement('div', { className: 'e-ripple-element', styles: styles });\n element.appendChild(rippleElement);\n window.getComputedStyle(rippleElement).getPropertyValue('opacity');\n rippleElement.style.transform = 'scale(1)';\n if (element !== this.parent) {\n EventHandler.add(element, 'mouseleave', rippleLeaveHandler, { parent: this.parent, rippleOptions: this.rippleOptions });\n }\n}\n/**\n * Handler for ripple element mouse up event\n *\n * @param {MouseEvent} e ?\n * @returns {void} ?\n * @private\n */\nfunction rippleUpHandler(e) {\n removeRipple(e, this);\n}\n/**\n * Handler for ripple element mouse move event\n *\n * @param {MouseEvent} e ?\n * @returns {void} ?\n * @private\n */\nfunction rippleLeaveHandler(e) {\n removeRipple(e, this);\n}\n/**\n * Handler for removing ripple element\n *\n * @param {MouseEvent} e ?\n * @param {RippleArgs} eventArgs ?\n * @returns {void} ?\n * @private\n */\nfunction removeRipple(e, eventArgs) {\n var duration = eventArgs.rippleOptions.duration;\n var target = (e.target);\n var selector = eventArgs.rippleOptions.selector;\n var element = selector ? closest(target, selector) : target;\n if (!element || (element && element.className.indexOf('e-ripple') === -1)) {\n return;\n }\n var rippleElements = selectAll('.e-ripple-element', element);\n var rippleElement = rippleElements[rippleElements.length - 1];\n if (rippleElement) {\n rippleElement.style.opacity = '0.5';\n }\n if (eventArgs.parent !== element) {\n EventHandler.remove(element, 'mouseleave', rippleLeaveHandler);\n }\n /* tslint:disable:align */\n setTimeout(function () {\n if (rippleElement && rippleElement.parentNode) {\n rippleElement.parentNode.removeChild(rippleElement);\n }\n if (!element.getElementsByClassName('e-ripple-element').length) {\n element.classList.remove('e-ripple');\n }\n if (eventArgs.done) {\n eventArgs.done(e);\n }\n }, duration);\n}\nexport var isRippleEnabled = false;\n/**\n * Animation Module provides support to enable ripple effect functionality to Essential JS 2 components.\n *\n * @param {boolean} isRipple Specifies the boolean value to enable or disable ripple effect.\n * @returns {boolean} ?\n */\nexport function enableRipple(isRipple) {\n isRippleEnabled = isRipple;\n return isRippleEnabled;\n}\n/**\n * Defines the Modes of Global animation.\n *\n * @private\n */\nexport var animationMode;\n/**\n * This method is used to enable or disable the animation for all components.\n *\n * @param {string|GlobalAnimationMode} value - Specifies the value to enable or disable the animation for all components. When set to 'enable', it enables the animation for all components, regardless of the individual component's animation settings. When set to 'disable', it disables the animation for all components, regardless of the individual component's animation settings.\n * @returns {void}\n */\nexport function setGlobalAnimation(value) {\n animationMode = value;\n}\n/**\n * Defines the global animation modes for all components.\n */\nexport var GlobalAnimationMode;\n(function (GlobalAnimationMode) {\n /**\n * Defines the global animation mode as Default. Animation is enabled or disabled based on the component's animation settings.\n */\n GlobalAnimationMode[\"Default\"] = \"Default\";\n /**\n * Defines the global animation mode as Enable. Enables the animation for all components, regardless of the individual component's animation settings.\n */\n GlobalAnimationMode[\"Enable\"] = \"Enable\";\n /**\n * Defines the global animation mode as Disable. Disables the animation for all components, regardless of the individual component's animation settings.\n */\n GlobalAnimationMode[\"Disable\"] = \"Disable\";\n})(GlobalAnimationMode || (GlobalAnimationMode = {}));\n","/**\n * Module loading operations\n */\nimport { createInstance, setValue, getValue, deleteObject } from './util';\nvar MODULE_SUFFIX = 'Module';\nvar ModuleLoader = /** @class */ (function () {\n function ModuleLoader(parent) {\n this.loadedModules = [];\n this.parent = parent;\n }\n /**\n * Inject required modules in component library\n *\n * @returns {void} ?\n * @param {ModuleDeclaration[]} requiredModules - Array of modules to be required\n * @param {Function[]} moduleList - Array of modules to be injected from sample side\n */\n ModuleLoader.prototype.inject = function (requiredModules, moduleList) {\n var reqLength = requiredModules.length;\n if (reqLength === 0) {\n this.clean();\n return;\n }\n if (this.loadedModules.length) {\n this.clearUnusedModule(requiredModules);\n }\n for (var i = 0; i < reqLength; i++) {\n var modl = requiredModules[parseInt(i.toString(), 10)];\n for (var _i = 0, moduleList_1 = moduleList; _i < moduleList_1.length; _i++) {\n var module = moduleList_1[_i];\n var modName = modl.member;\n if (module && module.prototype.getModuleName() === modl.member && !this.isModuleLoaded(modName)) {\n var moduleObject = createInstance(module, modl.args);\n var memberName = this.getMemberName(modName);\n if (modl.isProperty) {\n setValue(memberName, module, this.parent);\n }\n else {\n setValue(memberName, moduleObject, this.parent);\n }\n var loadedModule = modl;\n loadedModule.member = memberName;\n this.loadedModules.push(loadedModule);\n }\n }\n }\n };\n /**\n * To remove the created object while destroying the control\n *\n * @returns {void}\n */\n ModuleLoader.prototype.clean = function () {\n for (var _i = 0, _a = this.loadedModules; _i < _a.length; _i++) {\n var modules = _a[_i];\n if (!modules.isProperty) {\n getValue(modules.member, this.parent).destroy();\n }\n }\n this.loadedModules = [];\n };\n /**\n * Returns the array of modules that are not loaded in the component library.\n *\n * @param {ModuleDeclaration[]} requiredModules - Array of modules to be required\n * @returns {ModuleDeclaration[]} ?\n * @private\n */\n ModuleLoader.prototype.getNonInjectedModules = function (requiredModules) {\n var _this = this;\n return requiredModules.filter(function (module) { return !_this.isModuleLoaded(module.member); });\n };\n /**\n * Removes all unused modules\n *\n * @param {ModuleDeclaration[]} moduleList ?\n * @returns {void} ?\n */\n ModuleLoader.prototype.clearUnusedModule = function (moduleList) {\n var _this = this;\n var usedModules = moduleList.map(function (arg) { return _this.getMemberName(arg.member); });\n var removableModule = this.loadedModules.filter(function (module) {\n return usedModules.indexOf(module.member) === -1;\n });\n for (var _i = 0, removableModule_1 = removableModule; _i < removableModule_1.length; _i++) {\n var mod = removableModule_1[_i];\n if (!mod.isProperty) {\n getValue(mod.member, this.parent).destroy();\n }\n this.loadedModules.splice(this.loadedModules.indexOf(mod), 1);\n deleteObject(this.parent, mod.member);\n }\n };\n /**\n * To get the name of the member.\n *\n * @param {string} name ?\n * @returns {string} ?\n */\n ModuleLoader.prototype.getMemberName = function (name) {\n return name[0].toLowerCase() + name.substring(1) + MODULE_SUFFIX;\n };\n /**\n * Returns boolean based on whether the module specified is loaded or not\n *\n * @param {string} modName ?\n * @returns {boolean} ?\n */\n ModuleLoader.prototype.isModuleLoaded = function (modName) {\n for (var _i = 0, _a = this.loadedModules; _i < _a.length; _i++) {\n var mod = _a[_i];\n if (mod.member === this.getMemberName(modName)) {\n return true;\n }\n }\n return false;\n };\n return ModuleLoader;\n}());\nexport { ModuleLoader };\n","import { getValue, setValue, merge, isBlazor } from './util';\nimport { Base } from './base';\n/**\n * To detect the changes for inner properties.\n *\n * @private\n */\nvar ChildProperty = /** @class */ (function () {\n function ChildProperty(parent, propName, defaultValue, isArray) {\n this.isComplexArraySetter = false;\n this.properties = {};\n this.changedProperties = {};\n this.childChangedProperties = {};\n this.oldProperties = {};\n // eslint-disable-next-line\n this.finalUpdate = function () { };\n this.callChildDataBind = getValue('callChildDataBind', Base);\n this.parentObj = parent;\n this.controlParent = this.parentObj.controlParent || this.parentObj;\n this.propName = propName;\n this.isParentArray = isArray;\n this.setProperties(defaultValue, true);\n }\n /**\n * Updates the property changes\n *\n * @param {boolean} val ?\n * @param {string} propName ?\n * @returns {void} ?\n */\n ChildProperty.prototype.updateChange = function (val, propName) {\n if (val === true) {\n this.parentObj.childChangedProperties[\"\" + propName] = val;\n }\n else {\n delete this.parentObj.childChangedProperties[\"\" + propName];\n }\n if (this.parentObj.updateChange) {\n this.parentObj.updateChange(val, this.parentObj.propName);\n }\n };\n /**\n * Updates time out duration\n *\n * @returns {void} ?\n */\n ChildProperty.prototype.updateTimeOut = function () {\n if (this.parentObj.updateTimeOut) {\n this.parentObj.finalUpdate();\n this.parentObj.updateTimeOut();\n }\n else {\n var changeTime_1 = setTimeout(this.parentObj.dataBind.bind(this.parentObj));\n var clearUpdate = function () {\n clearTimeout(changeTime_1);\n };\n this.finalUpdate = clearUpdate;\n }\n };\n /**\n * Clears changed properties\n *\n * @returns {void} ?\n */\n ChildProperty.prototype.clearChanges = function () {\n this.finalUpdate();\n this.updateChange(false, this.propName);\n this.oldProperties = {};\n this.changedProperties = {};\n };\n /**\n * Set property changes\n *\n * @param {Object} prop ?\n * @param {boolean} muteOnChange ?\n * @returns {void} ?\n */\n ChildProperty.prototype.setProperties = function (prop, muteOnChange) {\n if (muteOnChange === true) {\n merge(this, prop);\n this.updateChange(false, this.propName);\n this.clearChanges();\n }\n else {\n merge(this, prop);\n }\n };\n /**\n * Binds data\n *\n * @returns {void} ?\n */\n ChildProperty.prototype.dataBind = function () {\n this.callChildDataBind(this.childChangedProperties, this);\n if (this.isParentArray) {\n var curIndex = this.parentObj[this.propName].indexOf(this);\n if (Object.keys(this.changedProperties).length) {\n setValue(this.propName + '.' + curIndex, this.changedProperties, this.parentObj.changedProperties);\n setValue(this.propName + '.' + curIndex, this.oldProperties, this.parentObj.oldProperties);\n }\n }\n else {\n this.parentObj.changedProperties[this.propName] = this.changedProperties;\n this.parentObj.oldProperties[this.propName] = this.oldProperties;\n }\n this.clearChanges();\n };\n /**\n * Saves changes to newer values\n *\n * @param {string} key ?\n * @param {Object} newValue ?\n * @param {Object} oldValue ?\n * @param {boolean} restrictServerDataBind ?\n * @returns {void} ?\n */\n ChildProperty.prototype.saveChanges = function (key, newValue, oldValue, restrictServerDataBind) {\n if (this.controlParent.isProtectedOnChange) {\n return;\n }\n if (!restrictServerDataBind) {\n this.serverDataBind(key, newValue, true);\n }\n this.oldProperties[\"\" + key] = oldValue;\n this.changedProperties[\"\" + key] = newValue;\n this.updateChange(true, this.propName);\n this.finalUpdate();\n this.updateTimeOut();\n };\n ChildProperty.prototype.serverDataBind = function (key, value, isSaveChanges, action) {\n if (isBlazor() && !this.parentObj.isComplexArraySetter) {\n var parent_1;\n var newChanges = {};\n var parentKey = isSaveChanges ? this.getParentKey(true) + '.' + key : key;\n /* istanbul ignore else */\n if (parentKey.indexOf('.') !== -1) {\n var complexKeys = parentKey.split('.');\n parent_1 = newChanges;\n for (var i = 0; i < complexKeys.length; i++) {\n var isFinal = i === complexKeys.length - 1;\n parent_1[complexKeys[parseInt(i.toString(), 10)]] = isFinal ? value : {};\n parent_1 = isFinal ? parent_1 : parent_1[complexKeys[parseInt(i.toString(), 10)]];\n }\n }\n else {\n newChanges[\"\" + parentKey] = {};\n parent_1 = newChanges[\"\" + parentKey];\n newChanges[\"\" + parentKey][\"\" + key] = value;\n }\n /* istanbul ignore next */\n if (this.isParentArray) {\n var actionProperty = 'ejsAction';\n parent_1[\"\" + actionProperty] = action ? action : 'none';\n }\n this.controlParent.serverDataBind(newChanges);\n }\n };\n ChildProperty.prototype.getParentKey = function (isSaveChanges) {\n // eslint-disable-next-line\n var index = '';\n var propName = this.propName;\n /* istanbul ignore next */\n if (this.isParentArray) {\n index = this.parentObj[this.propName].indexOf(this);\n var valueLength = this.parentObj[this.propName].length;\n valueLength = isSaveChanges ? valueLength : (valueLength > 0 ? valueLength - 1 : 0);\n index = index !== -1 ? '-' + index : '-' + valueLength;\n propName = propName + index;\n }\n if (this.controlParent !== this.parentObj) {\n propName = this.parentObj.getParentKey() + '.' + this.propName + index;\n }\n return propName;\n };\n return ChildProperty;\n}());\nexport { ChildProperty };\n","import { createElement } from './dom';\nimport { getValue, containerObject, setValue, isNullOrUndefined } from './util';\nexport var componentList = ['grid', 'pivotview', 'treegrid', 'spreadsheet', 'rangeNavigator', 'DocumentEditor', 'listbox', 'inplaceeditor', 'PdfViewer', 'richtexteditor', 'DashboardLayout', 'chart', 'stockChart', 'circulargauge', 'diagram', 'heatmap', 'lineargauge', 'maps', 'slider', 'smithchart', 'barcode', 'sparkline', 'treemap', 'bulletChart', 'kanban', 'daterangepicker', 'schedule', 'gantt', 'signature', 'query-builder', 'drop-down-tree', 'carousel', 'filemanager', 'uploader', 'accordion', 'tab', 'treeview'];\nvar bypassKey = [115, 121, 110, 99, 102, 117, 115, 105,\n 111, 110, 46, 105, 115, 76, 105, 99, 86, 97, 108,\n 105, 100, 97, 116, 101, 100];\nvar accountURL;\n/**\n * License validation module\n *\n * @private\n */\nvar LicenseValidator = /** @class */ (function () {\n function LicenseValidator(key) {\n this.isValidated = false;\n this.isLicensed = true;\n this.version = '25';\n this.platform = /JavaScript|ASPNET|ASPNETCORE|ASPNETMVC|FileFormats|essentialstudio/i;\n this.errors = {\n noLicense: 'This application was built using a trial version of Syncfusion Essential Studio.' +\n ' To remove the license validation message permanently, a valid license key must be included.',\n trailExpired: 'This application was built using a trial version of Syncfusion Essential Studio.' +\n ' To remove the license validation message permanently, a valid license key must be included.',\n versionMismatched: 'The included Syncfusion license key is invalid.',\n platformMismatched: 'The included Syncfusion license key is invalid.',\n invalidKey: 'The included Syncfusion license key is invalid.'\n };\n /**\n * To manage licensing operation.\n */\n this.manager = (function () {\n var licKey = null;\n /**\n * Sets the license key.\n *\n * @param {string} key - Specifies the license key.\n * @returns {void}\n */\n function set(key) { licKey = key; }\n /**\n * Gets the license key.\n *\n * @returns {string} -Gets the license key.\n */\n function get() { return licKey; }\n return {\n setKey: set,\n getKey: get\n };\n })();\n /**\n * To manage npx licensing operation.\n */\n this.npxManager = (function () {\n var npxLicKey = 'npxKeyReplace';\n /**\n * Gets the license key.\n *\n * @returns {string} - Gets the license key.\n */\n function get() { return npxLicKey; }\n return {\n getKey: get\n };\n })();\n this.manager.setKey(key);\n }\n /**\n * To validate the provided license key.\n *\n * @returns {boolean} ?\n */\n LicenseValidator.prototype.validate = function () {\n var contentKey = [115, 121, 110, 99, 102, 117, 115, 105, 111, 110, 46,\n 108, 105, 99, 101, 110, 115, 101, 67, 111, 110, 116, 101, 110, 116];\n var URLKey = [115, 121, 110, 99, 102, 117, 115, 105, 111, 110, 46,\n 99, 108, 97, 105, 109, 65, 99, 99, 111, 117, 110, 116, 85, 82, 76];\n if (!this.isValidated && (containerObject && !getValue(convertToChar(bypassKey), containerObject) && !getValue('Blazor', containerObject))) {\n var validateMsg = void 0;\n var validateURL = void 0;\n if ((this.manager && this.manager.getKey()) || (this.npxManager && this.npxManager.getKey() !== 'npxKeyReplace')) {\n var result = this.getInfoFromKey();\n if (result && result.length) {\n for (var _i = 0, result_1 = result; _i < result_1.length; _i++) {\n var res = result_1[_i];\n if (!this.platform.test(res.platform) || res.invalidPlatform) {\n validateMsg = this.errors.platformMismatched;\n }\n else if (res.version.indexOf(this.version) === -1) {\n validateMsg = this.errors.versionMismatched;\n validateMsg = validateMsg.replace('##LicenseVersion', res.version);\n validateMsg = validateMsg.replace('##Requireversion', this.version + '.x');\n }\n else if (res.expiryDate) {\n var expDate = new Date(res.expiryDate);\n var currDate = new Date();\n if (expDate !== currDate && expDate < currDate) {\n validateMsg = this.errors.trailExpired;\n }\n else {\n break;\n }\n }\n }\n }\n else {\n validateMsg = this.errors.invalidKey;\n }\n }\n else {\n var licenseContent = getValue(convertToChar(contentKey), containerObject);\n validateURL = getValue(convertToChar(URLKey), containerObject);\n if (licenseContent && licenseContent !== '') {\n validateMsg = licenseContent;\n }\n else {\n validateMsg = this.errors.noLicense;\n }\n }\n if (validateMsg && typeof document !== 'undefined' && !isNullOrUndefined(document)) {\n accountURL = (validateURL && validateURL !== '') ? validateURL : 'https://www.syncfusion.com/account/claim-license-key?pl=SmF2YVNjcmlwdA==&vs=MjU=&utm_source=es_license_validation_banner&utm_medium=listing&utm_campaign=license-information';\n var errorDiv = createElement('div', {\n innerHTML: \"\" + validateMsg + ' ' + 'Claim your free account'\n });\n errorDiv.setAttribute('style', \"position: fixed;\\n top: 10px;\\n left: 10px;\\n right: 10px;\\n font-size: 14px;\\n background: #EEF2FF;\\n color: #222222;\\n z-index: 999999999;\\n text-align: left;\\n border: 1px solid #EEEEEE;\\n padding: 10px 11px 10px 50px;\\n border-radius: 8px;\\n font-family: Helvetica Neue, Helvetica, Arial;\");\n document.body.appendChild(errorDiv);\n this.isLicensed = false;\n }\n this.isValidated = true;\n setValue(convertToChar(bypassKey), this.isValidated, containerObject);\n }\n return this.isLicensed;\n };\n LicenseValidator.prototype.getDecryptedData = function (key) {\n try {\n return atob(key);\n }\n catch (error) {\n return '';\n }\n };\n /**\n * Get license information from key.\n *\n * @returns {IValidator} - Get license information from key.\n */\n LicenseValidator.prototype.getInfoFromKey = function () {\n try {\n var licKey = '';\n var pkey = [5439488, 7929856, 5111808, 6488064, 4587520, 7667712, 5439488,\n 6881280, 5177344, 7208960, 4194304, 4456448, 6619136, 7733248, 5242880, 7077888,\n 6356992, 7602176, 4587520, 7274496, 7471104, 7143424];\n var decryptedStr = [];\n var resultArray = [];\n var invalidPlatform = false;\n var isNpxKey = false;\n if (this.manager.getKey()) {\n licKey = this.manager.getKey();\n }\n else {\n isNpxKey = true;\n licKey = this.npxManager.getKey().split('npxKeyReplace')[1];\n }\n var licKeySplit = licKey.split(';');\n for (var _i = 0, licKeySplit_1 = licKeySplit; _i < licKeySplit_1.length; _i++) {\n var lKey = licKeySplit_1[_i];\n var decodeStr = this.getDecryptedData(lKey);\n if (!decodeStr) {\n continue;\n }\n var k = 0;\n var buffr = '';\n if (!isNpxKey) {\n for (var i = 0; i < decodeStr.length; i++, k++) {\n if (k === pkey.length) {\n k = 0;\n }\n var c = decodeStr.charCodeAt(i);\n buffr += String.fromCharCode(c ^ (pkey[parseInt(k.toString(), 10)] >> 16));\n }\n }\n else {\n var charKey = decodeStr[decodeStr.length - 1];\n var decryptedKey = [];\n for (var i = 0; i < decodeStr.length; i++) {\n decryptedKey[\"\" + i] = decodeStr[\"\" + i].charCodeAt(0) - charKey.charCodeAt(0);\n }\n for (var i = 0; i < decryptedKey.length; i++) {\n buffr += String.fromCharCode(decryptedKey[parseInt(i.toString(), 10)]);\n }\n }\n if (this.platform.test(buffr)) {\n decryptedStr = buffr.split(';');\n invalidPlatform = false;\n // checked the length to verify the key in proper strucutre\n if (decryptedStr.length > 3) {\n resultArray.push({ platform: decryptedStr[0],\n version: decryptedStr[1],\n expiryDate: decryptedStr[2] });\n }\n }\n else if (buffr && buffr.split(';').length > 3) {\n invalidPlatform = true;\n }\n }\n if (invalidPlatform && !resultArray.length) {\n return [{ invalidPlatform: invalidPlatform }];\n }\n else {\n return resultArray.length ? resultArray : null;\n }\n }\n catch (error) {\n return null;\n }\n };\n return LicenseValidator;\n}());\nvar licenseValidator = new LicenseValidator();\n/**\n * Converts the given number to characters.\n *\n * @param {number} cArr - Specifies the license key as number.\n * @returns {string} ?\n */\nfunction convertToChar(cArr) {\n var ret = '';\n for (var _i = 0, cArr_1 = cArr; _i < cArr_1.length; _i++) {\n var arr = cArr_1[_i];\n ret += String.fromCharCode(arr);\n }\n return ret;\n}\n/**\n * To set license key.\n *\n * @param {string} key - license key\n * @returns {void}\n */\nexport function registerLicense(key) {\n licenseValidator = new LicenseValidator(key);\n}\nexport var validateLicense = function (key) {\n if (key) {\n registerLicense(key);\n }\n return licenseValidator.validate();\n};\nexport var getVersion = function () {\n return licenseValidator.version;\n};\n// Method for create overlay over the sample\nexport var createLicenseOverlay = function () {\n var bannerTemplate = \"\\n
\\n
\\n
\\n \\n
\\n
Claim your FREE account and get a key in less than a minute
\\n
    \\n
  • Access to a 30-day free trial of any of our products.
    • \\n
  • Access to 24x5 support by developers via the support tickets, forum, feature & feedback page and chat.
    • \\n
  • 200+ ebooks on the latest technologies, industry trends, and research topics.\\n
    • \\n
  • Largest collection of over 7,000 flat and wireframe icons for free with Syncfusion Metro Studio.
    • \\n
  • Free and unlimited access to Syncfusion technical blogs and whitepapers.
    • \\n
\\n
Syncfusion is trusted by 29,000+ businesses worldwide
\\n \\n Claim your FREE account\\n
have a Syncfusion account? Sign In
\\n
\\n
\";\n if (typeof document !== 'undefined' && !isNullOrUndefined(document)) {\n var errorBackground = createElement('div', {\n innerHTML: bannerTemplate\n });\n document.body.appendChild(errorBackground);\n }\n};\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { isUndefined, getValue, isNullOrUndefined, setValue, uniqueID, isBlazor } from './util';\nimport { ModuleLoader } from './module-loader';\nimport { Base } from './base';\nimport { Observer } from './observer';\nimport { ChildProperty } from './child-property';\nimport { Property, NotifyPropertyChanges } from './notify-property-change';\nimport { onIntlChange, rightToLeft, defaultCulture } from './internationalization';\nimport { createElement, addClass, removeClass, select } from './dom';\nimport { validateLicense, createLicenseOverlay, componentList } from './validate-lic';\nvar componentCount = 0;\nvar lastPageID;\nvar lastHistoryLen = 0;\n// Decalre the static variable to count the instance\nvar instancecount = 0;\n// Decalre the static variable to find if control limit exceed or not\nvar isvalid = true;\n// We have added styles to inline type so here declare the static variable to detect if banner is added or not\nvar isBannerAdded = false;\nexport var versionBasedStatePersistence = false;\n/**\n * To enable or disable version based statePersistence functionality for all components globally.\n *\n * @param {boolean} status - Optional argument Specifies the status value to enable or disable versionBasedStatePersistence option.\n * @returns {void}\n */\nexport function enableVersionBasedPersistence(status) {\n versionBasedStatePersistence = status;\n}\n/**\n * Base class for all Essential JavaScript components\n */\nvar Component = /** @class */ (function (_super) {\n __extends(Component, _super);\n /**\n * Initialize the constructor for component base\n *\n * @param {Object} options ?\n * @param {string} selector ?\n */\n function Component(options, selector) {\n var _this = _super.call(this, options, selector) || this;\n _this.randomId = uniqueID();\n /**\n * string template option for Blazor template rendering\n *\n * @private\n */\n _this.isStringTemplate = false;\n _this.needsID = false;\n _this.isReactHybrid = false;\n if (isNullOrUndefined(_this.enableRtl)) {\n _this.setProperties({ 'enableRtl': rightToLeft }, true);\n }\n if (isNullOrUndefined(_this.locale)) {\n _this.setProperties({ 'locale': defaultCulture }, true);\n }\n _this.moduleLoader = new ModuleLoader(_this);\n _this.localObserver = new Observer(_this);\n // tslint:disable-next-line:no-function-constructor-with-string-args\n onIntlChange.on('notifyExternalChange', _this.detectFunction, _this, _this.randomId);\n // Based on the considered control list we have count the instance\n if (typeof window !== 'undefined' && typeof document !== 'undefined' && !validateLicense()) {\n if (componentList.indexOf(_this.getModuleName()) !== -1) {\n instancecount = instancecount + 1;\n if (instancecount > 5) {\n isvalid = false;\n }\n }\n }\n if (!isUndefined(selector)) {\n _this.appendTo();\n }\n return _this;\n }\n Component.prototype.requiredModules = function () {\n return [];\n };\n /**\n * Destroys the sub modules while destroying the widget\n *\n * @returns {void} ?\n */\n Component.prototype.destroy = function () {\n if (this.isDestroyed) {\n return;\n }\n if (this.enablePersistence) {\n this.setPersistData();\n this.detachUnloadEvent();\n }\n this.localObserver.destroy();\n if (this.refreshing) {\n return;\n }\n removeClass([this.element], ['e-control']);\n this.trigger('destroyed', { cancel: false });\n _super.prototype.destroy.call(this);\n this.moduleLoader.clean();\n onIntlChange.off('notifyExternalChange', this.detectFunction, this.randomId);\n };\n /**\n * Applies all the pending property changes and render the component again.\n *\n * @returns {void} ?\n */\n Component.prototype.refresh = function () {\n this.refreshing = true;\n this.moduleLoader.clean();\n this.destroy();\n this.clearChanges();\n this.localObserver = new Observer(this);\n this.preRender();\n this.injectModules();\n this.render();\n this.refreshing = false;\n };\n Component.prototype.accessMount = function () {\n if (this.mount && !this.isReactHybrid) {\n this.mount();\n }\n };\n /**\n * Returns the route element of the component\n *\n * @returns {HTMLElement} ?\n */\n Component.prototype.getRootElement = function () {\n if (this.isReactHybrid) {\n // eslint-disable-next-line\n return this.actualElement;\n }\n else {\n return this.element;\n }\n };\n /**\n * Returns the persistence data for component\n *\n * @returns {any} ?\n */\n // eslint-disable-next-line\n Component.prototype.getLocalData = function () {\n var eleId = this.getModuleName() + this.element.id;\n if (versionBasedStatePersistence) {\n return window.localStorage.getItem(eleId + this.ej2StatePersistenceVersion);\n }\n else {\n return window.localStorage.getItem(eleId);\n }\n };\n /**\n * Adding unload event to persist data when enable persistence true\n *\n * @returns {void}\n */\n Component.prototype.attachUnloadEvent = function () {\n this.handleUnload = this.handleUnload.bind(this);\n window.addEventListener('pagehide', this.handleUnload);\n };\n /**\n * Handling unload event to persist data when enable persistence true\n *\n * @returns {void}\n */\n Component.prototype.handleUnload = function () {\n this.setPersistData();\n };\n /**\n * Removing unload event to persist data when enable persistence true\n *\n * @returns {void}\n */\n Component.prototype.detachUnloadEvent = function () {\n window.removeEventListener('pagehide', this.handleUnload);\n };\n /**\n * Appends the control within the given HTML element\n *\n * @param {string | HTMLElement} selector - Target element where control needs to be appended\n * @returns {void} ?\n */\n Component.prototype.appendTo = function (selector) {\n if (!isNullOrUndefined(selector) && typeof (selector) === 'string') {\n this.element = select(selector, document);\n }\n else if (!isNullOrUndefined(selector)) {\n this.element = selector;\n }\n if (!isNullOrUndefined(this.element)) {\n var moduleClass = 'e-' + this.getModuleName().toLowerCase();\n addClass([this.element], ['e-control', moduleClass]);\n this.isProtectedOnChange = false;\n if (this.needsID && !this.element.id) {\n this.element.id = this.getUniqueID(this.getModuleName());\n }\n if (this.enablePersistence) {\n this.mergePersistData();\n this.attachUnloadEvent();\n }\n var inst = getValue('ej2_instances', this.element);\n if (!inst || inst.indexOf(this) === -1) {\n _super.prototype.addInstance.call(this);\n }\n this.preRender();\n this.injectModules();\n // Throw a warning for the required modules to be injected.\n var ignoredComponents = {\n schedule: 'all',\n diagram: 'all',\n PdfViewer: 'all',\n grid: ['logger'],\n richtexteditor: ['link', 'table', 'image', 'audio', 'video', 'formatPainter', 'emojiPicker', 'pasteCleanup', 'htmlEditor', 'toolbar'],\n treegrid: ['filter'],\n gantt: ['tooltip'],\n chart: ['Export', 'Zoom'],\n accumulationchart: ['Export']\n };\n var component = this.getModuleName();\n if (this.requiredModules && (!ignoredComponents[\"\" + component] || ignoredComponents[\"\" + component] !== 'all')) {\n var modulesRequired = this.requiredModules();\n for (var _i = 0, _a = this.moduleLoader.getNonInjectedModules(modulesRequired); _i < _a.length; _i++) {\n var module = _a[_i];\n var moduleName = module.name ? module.name : module.member;\n if (ignoredComponents[\"\" + component] && ignoredComponents[\"\" + component].indexOf(module.member) !== -1) {\n continue;\n }\n var componentName = component.charAt(0).toUpperCase() + component.slice(1); // To capitalize the component name\n console.warn(\"[WARNING] :: Module \\\"\" + moduleName + \"\\\" is not available in \" + componentName + \" component! You either misspelled the module name or forgot to load it.\");\n }\n }\n // Checked weather cases are valid or not. If control leads to more than five counts\n if (!isvalid && !isBannerAdded) {\n createLicenseOverlay();\n isBannerAdded = true;\n }\n this.render();\n if (!this.mount) {\n this.trigger('created');\n }\n else {\n this.accessMount();\n }\n }\n };\n /**\n * It is used to process the post rendering functionalities to a component.\n *\n * @param {Node} wrapperElement ?\n * @returns {void} ?\n */\n Component.prototype.renderComplete = function (wrapperElement) {\n if (isBlazor()) {\n var sfBlazor = 'sfBlazor';\n // eslint-disable-next-line\n window[sfBlazor].renderComplete(this.element, wrapperElement);\n }\n this.isRendered = true;\n };\n /**\n * When invoked, applies the pending property changes immediately to the component.\n *\n * @returns {void} ?\n */\n Component.prototype.dataBind = function () {\n this.injectModules();\n _super.prototype.dataBind.call(this);\n };\n /**\n * Attach one or more event handler to the current component context.\n * It is used for internal handling event internally within the component only.\n *\n * @param {BoundOptions[]| string} event - It is optional type either to Set the collection of event list or the eventName.\n * @param {Function} handler - optional parameter Specifies the handler to run when the event occurs\n * @param {Object} context - optional parameter Specifies the context to be bind in the handler.\n * @returns {void} ?\n * @private\n */\n Component.prototype.on = function (event, handler, context) {\n if (typeof event === 'string') {\n this.localObserver.on(event, handler, context);\n }\n else {\n for (var _i = 0, event_1 = event; _i < event_1.length; _i++) {\n var arg = event_1[_i];\n this.localObserver.on(arg.event, arg.handler, arg.context);\n }\n }\n };\n /**\n * To remove one or more event handler that has been attached with the on() method.\n *\n * @param {BoundOptions[]| string} event - It is optional type either to Set the collection of event list or the eventName.\n * @param {Function} handler - optional parameter Specifies the function to run when the event occurs\n * @returns {void} ?\n * @private\n */\n Component.prototype.off = function (event, handler) {\n if (typeof event === 'string') {\n this.localObserver.off(event, handler);\n }\n else {\n for (var _i = 0, event_2 = event; _i < event_2.length; _i++) {\n var arg = event_2[_i];\n this.localObserver.off(arg.event, arg.handler);\n }\n }\n };\n /**\n * To notify the handlers in the specified event.\n *\n * @param {string} property - Specifies the event to be notify.\n * @param {Object} argument - Additional parameters to pass while calling the handler.\n * @returns {void} ?\n * @private\n */\n Component.prototype.notify = function (property, argument) {\n if (this.isDestroyed !== true) {\n this.localObserver.notify(property, argument);\n }\n };\n /**\n * Get injected modules\n *\n * @returns {Function} ?\n * @private\n */\n Component.prototype.getInjectedModules = function () {\n return this.injectedModules;\n };\n /**\n * Dynamically injects the required modules to the component.\n *\n * @param {Function} moduleList ?\n * @returns {void} ?\n */\n Component.Inject = function () {\n var moduleList = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n moduleList[_i] = arguments[_i];\n }\n if (!this.prototype.injectedModules) {\n this.prototype.injectedModules = [];\n }\n for (var i = 0; i < moduleList.length; i++) {\n if (this.prototype.injectedModules.indexOf(moduleList[parseInt(i.toString(), 10)]) === -1) {\n this.prototype.injectedModules.push(moduleList[parseInt(i.toString(), 10)]);\n }\n }\n };\n /**\n * This is a instance method to create an element.\n *\n * @param {string} tagName ?\n * @param {ElementProperties} prop ?\n * @param {boolean} isVDOM ?\n * @returns {any} ?\n * @private\n */\n // eslint-disable-next-line\n Component.prototype.createElement = function (tagName, prop, isVDOM) {\n return createElement(tagName, prop);\n };\n /**\n *\n * @param {Function} handler - handler to be triggered after state Updated.\n * @param {any} argument - Arguments to be passed to caller.\n * @returns {void} .\n * @private\n */\n // eslint-disable-next-line\n Component.prototype.triggerStateChange = function (handler, argument) {\n if (this.isReactHybrid) {\n // eslint-disable-next-line\n this.setState();\n this.currentContext = { calls: handler, args: argument };\n }\n };\n // tslint: enable: no-any\n Component.prototype.injectModules = function () {\n if (this.injectedModules && this.injectedModules.length) {\n this.moduleLoader.inject(this.requiredModules(), this.injectedModules);\n }\n };\n Component.prototype.detectFunction = function (args) {\n var prop = Object.keys(args);\n if (prop.length) {\n this[prop[0]] = args[prop[0]];\n }\n };\n Component.prototype.mergePersistData = function () {\n var data;\n if (versionBasedStatePersistence) {\n data = window.localStorage.getItem(this.getModuleName() + this.element.id + this.ej2StatePersistenceVersion);\n }\n else {\n data = window.localStorage.getItem(this.getModuleName() + this.element.id);\n }\n if (!(isNullOrUndefined(data) || (data === ''))) {\n this.setProperties(JSON.parse(data), true);\n }\n };\n Component.prototype.setPersistData = function () {\n if (!this.isDestroyed) {\n if (versionBasedStatePersistence) {\n window.localStorage.setItem(this.getModuleName() +\n this.element.id + this.ej2StatePersistenceVersion, this.getPersistData());\n }\n else {\n window.localStorage.setItem(this.getModuleName() + this.element.id, this.getPersistData());\n }\n }\n };\n // eslint-disable-next-line\n Component.prototype.renderReactTemplates = function (callback) {\n if (!isNullOrUndefined(callback)) {\n callback();\n }\n };\n // eslint-disable-next-line\n Component.prototype.clearTemplate = function (templateName, index) {\n //No Code\n };\n Component.prototype.getUniqueID = function (definedName) {\n if (this.isHistoryChanged()) {\n componentCount = 0;\n }\n lastPageID = this.pageID(location.href);\n lastHistoryLen = history.length;\n return definedName + '_' + lastPageID + '_' + componentCount++;\n };\n Component.prototype.pageID = function (url) {\n var hash = 0;\n if (url.length === 0) {\n return hash;\n }\n for (var i = 0; i < url.length; i++) {\n var char = url.charCodeAt(i);\n hash = ((hash << 5) - hash) + char;\n hash = hash & hash; // Convert to 32bit integer\n }\n return Math.abs(hash);\n };\n Component.prototype.isHistoryChanged = function () {\n return lastPageID !== this.pageID(location.href) || lastHistoryLen !== history.length;\n };\n Component.prototype.addOnPersist = function (options) {\n var _this = this;\n var persistObj = {};\n for (var _i = 0, options_1 = options; _i < options_1.length; _i++) {\n var key = options_1[_i];\n var objValue = void 0;\n // eslint-disable-next-line\n objValue = getValue(key, this);\n if (!isUndefined(objValue)) {\n setValue(key, this.getActualProperties(objValue), persistObj);\n }\n }\n return JSON.stringify(persistObj, function (key, value) {\n return _this.getActualProperties(value);\n });\n };\n Component.prototype.getActualProperties = function (obj) {\n if (obj instanceof ChildProperty) {\n return getValue('properties', obj);\n }\n else {\n return obj;\n }\n };\n Component.prototype.ignoreOnPersist = function (options) {\n return JSON.stringify(this.iterateJsonProperties(this.properties, options));\n };\n Component.prototype.iterateJsonProperties = function (obj, ignoreList) {\n var newObj = {};\n var _loop_1 = function (key) {\n if (ignoreList.indexOf(key) === -1) {\n // eslint-disable-next-line\n var value = obj[key];\n if (typeof value === 'object' && !(value instanceof Array)) {\n var newList = ignoreList.filter(function (str) {\n var regExp = RegExp;\n return new regExp(key + '.').test(str);\n }).map(function (str) {\n return str.replace(key + '.', '');\n });\n newObj[\"\" + key] = this_1.iterateJsonProperties(this_1.getActualProperties(value), newList);\n }\n else {\n newObj[\"\" + key] = value;\n }\n }\n };\n var this_1 = this;\n for (var _i = 0, _a = Object.keys(obj); _i < _a.length; _i++) {\n var key = _a[_i];\n _loop_1(key);\n }\n return newObj;\n };\n __decorate([\n Property(false)\n ], Component.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property()\n ], Component.prototype, \"enableRtl\", void 0);\n __decorate([\n Property()\n ], Component.prototype, \"locale\", void 0);\n Component = __decorate([\n NotifyPropertyChanges\n ], Component);\n return Component;\n}(Base));\nexport { Component };\n//Function handling for page navigation detection\n/* istanbul ignore next */\n(function () {\n if (typeof window !== 'undefined') {\n window.addEventListener('popstate', \n /* istanbul ignore next */\n function () {\n componentCount = 0;\n });\n }\n})();\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Base } from './base';\nimport { Browser } from './browser';\nimport { isVisible } from './dom';\nimport { Property, Complex, NotifyPropertyChanges, Event } from './notify-property-change';\nimport { EventHandler } from './event-handler';\nimport { ChildProperty } from './child-property';\nimport { select, closest, setStyleAttribute, addClass, createElement } from './dom';\nimport { extend, isUndefined, isNullOrUndefined, compareElementParent, isBlazor } from './util';\nvar defaultPosition = { left: 0, top: 0, bottom: 0, right: 0 };\nvar isDraggedObject = { isDragged: false };\n/**\n * Specifies the position coordinates\n */\nvar Position = /** @class */ (function (_super) {\n __extends(Position, _super);\n function Position() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(0)\n ], Position.prototype, \"left\", void 0);\n __decorate([\n Property(0)\n ], Position.prototype, \"top\", void 0);\n return Position;\n}(ChildProperty));\nexport { Position };\n/**\n * Draggable Module provides support to enable draggable functionality in Dom Elements.\n * ```html\n *
Draggable
\n * \n * ```\n */\nvar Draggable = /** @class */ (function (_super) {\n __extends(Draggable, _super);\n function Draggable(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.dragLimit = Draggable_1.getDefaultPosition();\n _this.borderWidth = Draggable_1.getDefaultPosition();\n _this.padding = Draggable_1.getDefaultPosition();\n _this.diffX = 0;\n _this.prevLeft = 0;\n _this.prevTop = 0;\n _this.dragProcessStarted = false;\n _this.eleTop = 0;\n /* eslint-disable @typescript-eslint/no-explicit-any */\n _this.tapHoldTimer = 0;\n _this.externalInitialize = false;\n _this.diffY = 0;\n _this.parentScrollX = 0;\n _this.parentScrollY = 0;\n _this.droppables = {};\n _this.bind();\n return _this;\n }\n Draggable_1 = Draggable;\n Draggable.prototype.bind = function () {\n this.toggleEvents();\n if (Browser.isIE) {\n addClass([this.element], 'e-block-touch');\n }\n this.droppables[this.scope] = {};\n };\n Draggable.getDefaultPosition = function () {\n return extend({}, defaultPosition);\n };\n Draggable.prototype.toggleEvents = function (isUnWire) {\n var ele;\n if (!isUndefined(this.handle)) {\n ele = select(this.handle, this.element);\n }\n var handler = (this.enableTapHold && Browser.isDevice && Browser.isTouch) ? this.mobileInitialize : this.initialize;\n if (isUnWire) {\n EventHandler.remove(ele || this.element, Browser.isSafari() ? 'touchstart' : Browser.touchStartEvent, handler);\n }\n else {\n EventHandler.add(ele || this.element, Browser.isSafari() ? 'touchstart' : Browser.touchStartEvent, handler, this);\n }\n };\n /* istanbul ignore next */\n Draggable.prototype.mobileInitialize = function (evt) {\n var _this = this;\n var target = evt.currentTarget;\n this.tapHoldTimer = setTimeout(function () {\n _this.externalInitialize = true;\n _this.removeTapholdTimer();\n _this.initialize(evt, target);\n }, this.tapHoldThreshold);\n EventHandler.add(document, Browser.isSafari() ? 'touchmove' : Browser.touchMoveEvent, this.removeTapholdTimer, this);\n EventHandler.add(document, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.removeTapholdTimer, this);\n };\n /* istanbul ignore next */\n Draggable.prototype.removeTapholdTimer = function () {\n clearTimeout(this.tapHoldTimer);\n EventHandler.remove(document, Browser.isSafari() ? 'touchmove' : Browser.touchMoveEvent, this.removeTapholdTimer);\n EventHandler.remove(document, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.removeTapholdTimer);\n };\n /* istanbul ignore next */\n Draggable.prototype.getScrollableParent = function (element, axis) {\n var scroll = { 'vertical': 'scrollHeight', 'horizontal': 'scrollWidth' };\n var client = { 'vertical': 'clientHeight', 'horizontal': 'clientWidth' };\n if (isNullOrUndefined(element)) {\n return null;\n }\n if (element[scroll[\"\" + axis]] > element[client[\"\" + axis]]) {\n if (axis === 'vertical' ? element.scrollTop > 0 : element.scrollLeft > 0) {\n if (axis === 'vertical') {\n this.parentScrollY = this.parentScrollY +\n (this.parentScrollY === 0 ? element.scrollTop : element.scrollTop - this.parentScrollY);\n this.tempScrollHeight = element.scrollHeight;\n }\n else {\n this.parentScrollX = this.parentScrollX +\n (this.parentScrollX === 0 ? element.scrollLeft : element.scrollLeft - this.parentScrollX);\n this.tempScrollWidth = element.scrollWidth;\n }\n if (!isNullOrUndefined(element)) {\n return this.getScrollableParent(element.parentNode, axis);\n }\n else {\n return element;\n }\n }\n else {\n return this.getScrollableParent(element.parentNode, axis);\n }\n }\n else {\n return this.getScrollableParent(element.parentNode, axis);\n }\n };\n /* eslint-disable */\n Draggable.prototype.getScrollableValues = function () {\n this.parentScrollX = 0;\n this.parentScrollY = 0;\n var isModalDialog = this.element.classList.contains('e-dialog') && this.element.classList.contains('e-dlg-modal');\n var verticalScrollParent = this.getScrollableParent(this.element.parentNode, 'vertical');\n var horizontalScrollParent = this.getScrollableParent(this.element.parentNode, 'horizontal');\n };\n /* eslint-enable */\n Draggable.prototype.initialize = function (evt, curTarget) {\n this.currentStateTarget = evt.target;\n if (this.isDragStarted()) {\n return;\n }\n else {\n this.isDragStarted(true);\n this.externalInitialize = false;\n }\n this.target = (evt.currentTarget || curTarget);\n this.dragProcessStarted = false;\n if (this.abort) {\n /* tslint:disable no-any */\n // eslint-disable-next-line\n var abortSelectors = this.abort;\n if (typeof abortSelectors === 'string') {\n abortSelectors = [abortSelectors];\n }\n for (var i = 0; i < abortSelectors.length; i++) {\n if (!isNullOrUndefined(closest(evt.target, abortSelectors[parseInt(i.toString(), 10)]))) {\n /* istanbul ignore next */\n if (this.isDragStarted()) {\n this.isDragStarted(true);\n }\n return;\n }\n }\n }\n if (this.preventDefault && !isUndefined(evt.changedTouches) && evt.type !== 'touchstart') {\n evt.preventDefault();\n }\n this.element.setAttribute('aria-grabbed', 'true');\n var intCoord = this.getCoordinates(evt);\n this.initialPosition = { x: intCoord.pageX, y: intCoord.pageY };\n if (!this.clone) {\n var pos = this.element.getBoundingClientRect();\n this.getScrollableValues();\n if (evt.clientX === evt.pageX) {\n this.parentScrollX = 0;\n }\n if (evt.clientY === evt.pageY) {\n this.parentScrollY = 0;\n }\n this.relativeXPosition = intCoord.pageX - (pos.left + this.parentScrollX);\n this.relativeYPosition = intCoord.pageY - (pos.top + this.parentScrollY);\n }\n if (this.externalInitialize) {\n this.intDragStart(evt);\n }\n else {\n EventHandler.add(document, Browser.isSafari() ? 'touchmove' : Browser.touchMoveEvent, this.intDragStart, this);\n EventHandler.add(document, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.intDestroy, this);\n }\n this.toggleEvents(true);\n if (evt.type !== 'touchstart' && this.isPreventSelect) {\n document.body.classList.add('e-prevent-select');\n }\n this.externalInitialize = false;\n EventHandler.trigger(document.documentElement, Browser.isSafari() ? 'touchstart' : Browser.touchStartEvent, evt);\n };\n Draggable.prototype.intDragStart = function (evt) {\n this.removeTapholdTimer();\n var isChangeTouch = !isUndefined(evt.changedTouches);\n if (isChangeTouch && (evt.changedTouches.length !== 1)) {\n return;\n }\n var intCordinate = this.getCoordinates(evt);\n var pos;\n var styleProp = getComputedStyle(this.element);\n this.margin = {\n left: parseInt(styleProp.marginLeft, 10),\n top: parseInt(styleProp.marginTop, 10),\n right: parseInt(styleProp.marginRight, 10),\n bottom: parseInt(styleProp.marginBottom, 10)\n };\n var element = this.element;\n if (this.clone && this.dragTarget) {\n var intClosest = closest(evt.target, this.dragTarget);\n if (!isNullOrUndefined(intClosest)) {\n element = intClosest;\n }\n }\n /* istanbul ignore next */\n if (this.isReplaceDragEle) {\n // eslint-disable-next-line\n element = this.currentStateCheck(evt.target, element);\n }\n this.offset = this.calculateParentPosition(element);\n this.position = this.getMousePosition(evt, this.isDragScroll);\n var x = this.initialPosition.x - intCordinate.pageX;\n var y = this.initialPosition.y - intCordinate.pageY;\n var distance = Math.sqrt((x * x) + (y * y));\n if ((distance >= this.distance || this.externalInitialize)) {\n var ele = this.getHelperElement(evt);\n if (!ele || isNullOrUndefined(ele)) {\n return;\n }\n if (isChangeTouch) {\n evt.preventDefault();\n }\n var dragTargetElement = this.helperElement = ele;\n this.parentClientRect = this.calculateParentPosition(dragTargetElement.offsetParent);\n if (this.dragStart) {\n var curTarget = this.getProperTargetElement(evt);\n var args = {\n event: evt,\n element: element,\n target: curTarget,\n bindEvents: isBlazor() ? this.bindDragEvents.bind(this) : null,\n dragElement: dragTargetElement\n };\n this.trigger('dragStart', args);\n }\n if (this.dragArea) {\n this.setDragArea();\n }\n else {\n this.dragLimit = { left: 0, right: 0, bottom: 0, top: 0 };\n this.borderWidth = { top: 0, left: 0 };\n }\n pos = { left: this.position.left - this.parentClientRect.left, top: this.position.top - this.parentClientRect.top };\n if (this.clone && !this.enableTailMode) {\n this.diffX = this.position.left - this.offset.left;\n this.diffY = this.position.top - this.offset.top;\n }\n this.getScrollableValues();\n // when drag element has margin-top\n var styles = getComputedStyle(element);\n var marginTop = parseFloat(styles.marginTop);\n /* istanbul ignore next */\n if (this.clone && marginTop !== 0) {\n pos.top += marginTop;\n }\n this.eleTop = !isNaN(parseFloat(styles.top)) ? parseFloat(styles.top) - this.offset.top : 0;\n /* istanbul ignore next */\n // if (this.eleTop > 0) {\n // pos.top += this.eleTop;\n // }\n if (this.enableScrollHandler && !this.clone) {\n pos.top -= this.parentScrollY;\n pos.left -= this.parentScrollX;\n }\n var posValue = this.getProcessedPositionValue({\n top: (pos.top - this.diffY) + 'px',\n left: (pos.left - this.diffX) + 'px'\n });\n if (this.dragArea && typeof this.dragArea !== 'string' && this.dragArea.classList.contains('e-kanban-content') && this.dragArea.style.position === 'relative') {\n pos.top += this.dragArea.scrollTop;\n }\n this.dragElePosition = { top: pos.top, left: pos.left };\n setStyleAttribute(dragTargetElement, this.getDragPosition({ position: 'absolute', left: posValue.left, top: posValue.top }));\n EventHandler.remove(document, Browser.isSafari() ? 'touchmove' : Browser.touchMoveEvent, this.intDragStart);\n EventHandler.remove(document, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.intDestroy);\n if (!isBlazor()) {\n this.bindDragEvents(dragTargetElement);\n }\n }\n };\n Draggable.prototype.bindDragEvents = function (dragTargetElement) {\n if (isVisible(dragTargetElement)) {\n EventHandler.add(document, Browser.isSafari() ? 'touchmove' : Browser.touchMoveEvent, this.intDrag, this);\n EventHandler.add(document, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.intDragStop, this);\n this.setGlobalDroppables(false, this.element, dragTargetElement);\n }\n else {\n this.toggleEvents();\n document.body.classList.remove('e-prevent-select');\n }\n };\n Draggable.prototype.elementInViewport = function (el) {\n this.top = el.offsetTop;\n this.left = el.offsetLeft;\n this.width = el.offsetWidth;\n this.height = el.offsetHeight;\n while (el.offsetParent) {\n el = el.offsetParent;\n this.top += el.offsetTop;\n this.left += el.offsetLeft;\n }\n return (this.top >= window.pageYOffset &&\n this.left >= window.pageXOffset &&\n (this.top + this.height) <= (window.pageYOffset + window.innerHeight) &&\n (this.left + this.width) <= (window.pageXOffset + window.innerWidth));\n };\n Draggable.prototype.getProcessedPositionValue = function (value) {\n if (this.queryPositionInfo) {\n return this.queryPositionInfo(value);\n }\n return value;\n };\n Draggable.prototype.calculateParentPosition = function (ele) {\n if (isNullOrUndefined(ele)) {\n return { left: 0, top: 0 };\n }\n var rect = ele.getBoundingClientRect();\n var style = getComputedStyle(ele);\n return {\n left: (rect.left + window.pageXOffset) - parseInt(style.marginLeft, 10),\n top: (rect.top + window.pageYOffset) - parseInt(style.marginTop, 10)\n };\n };\n // tslint:disable-next-line:max-func-body-length\n Draggable.prototype.intDrag = function (evt) {\n if (!isUndefined(evt.changedTouches) && (evt.changedTouches.length !== 1)) {\n return;\n }\n if (this.clone && evt.changedTouches && Browser.isDevice && Browser.isTouch) {\n evt.preventDefault();\n }\n var left;\n var top;\n this.position = this.getMousePosition(evt, this.isDragScroll);\n var docHeight = this.getDocumentWidthHeight('Height');\n if (docHeight < this.position.top) {\n this.position.top = docHeight;\n }\n var docWidth = this.getDocumentWidthHeight('Width');\n if (docWidth < this.position.left) {\n this.position.left = docWidth;\n }\n if (this.drag) {\n var curTarget = this.getProperTargetElement(evt);\n this.trigger('drag', { event: evt, element: this.element, target: curTarget });\n }\n var eleObj = this.checkTargetElement(evt);\n if (eleObj.target && eleObj.instance) {\n /* tslint:disable no-any */\n var flag = true;\n if (this.hoverObject) {\n if (this.hoverObject.instance !== eleObj.instance) {\n this.triggerOutFunction(evt, eleObj);\n }\n else {\n flag = false;\n }\n }\n if (flag) {\n // eslint-disable-next-line\n eleObj.instance.dragData[this.scope] = this.droppables[this.scope];\n eleObj.instance.intOver(evt, eleObj.target);\n this.hoverObject = eleObj;\n }\n }\n else if (this.hoverObject) {\n this.triggerOutFunction(evt, eleObj);\n }\n var helperElement = this.droppables[this.scope].helper;\n this.parentClientRect = this.calculateParentPosition(this.helperElement.offsetParent);\n var tLeft = this.parentClientRect.left;\n var tTop = this.parentClientRect.top;\n var intCoord = this.getCoordinates(evt);\n var pagex = intCoord.pageX;\n var pagey = intCoord.pageY;\n var dLeft = this.position.left - this.diffX;\n var dTop = this.position.top - this.diffY;\n var styles = getComputedStyle(helperElement);\n if (this.dragArea) {\n if (this.enableAutoScroll) {\n this.setDragArea();\n }\n if (this.pageX !== pagex || this.skipDistanceCheck) {\n var helperWidth = helperElement.offsetWidth + (parseFloat(styles.marginLeft)\n + parseFloat(styles.marginRight));\n if (this.dragLimit.left > dLeft && dLeft > 0) {\n left = this.dragLimit.left;\n }\n else if (this.dragLimit.right + window.pageXOffset < dLeft + helperWidth && dLeft > 0) {\n left = dLeft - (dLeft - this.dragLimit.right) + window.pageXOffset - helperWidth;\n }\n else {\n left = dLeft < 0 ? this.dragLimit.left : dLeft;\n }\n }\n if (this.pageY !== pagey || this.skipDistanceCheck) {\n var helperHeight = helperElement.offsetHeight + (parseFloat(styles.marginTop)\n + parseFloat(styles.marginBottom));\n if (this.dragLimit.top > dTop && dTop > 0) {\n top = this.dragLimit.top;\n }\n else if (this.dragLimit.bottom + window.pageYOffset < dTop + helperHeight && dTop > 0) {\n top = dTop - (dTop - this.dragLimit.bottom) + window.pageYOffset - helperHeight;\n }\n else {\n top = dTop < 0 ? this.dragLimit.top : dTop;\n }\n }\n }\n else {\n left = dLeft;\n top = dTop;\n }\n var iTop = tTop + this.borderWidth.top;\n var iLeft = tLeft + this.borderWidth.left;\n if (this.dragProcessStarted) {\n if (isNullOrUndefined(top)) {\n top = this.prevTop;\n }\n if (isNullOrUndefined(left)) {\n left = this.prevLeft;\n }\n }\n var draEleTop;\n var draEleLeft;\n if (this.helperElement.classList.contains('e-treeview')) {\n if (this.dragArea) {\n this.dragLimit.top = this.clone ? this.dragLimit.top : 0;\n draEleTop = (top - iTop) < 0 ? this.dragLimit.top : (top - this.borderWidth.top);\n draEleLeft = (left - iLeft) < 0 ? this.dragLimit.left : (left - this.borderWidth.left);\n }\n else {\n draEleTop = top - this.borderWidth.top;\n draEleLeft = left - this.borderWidth.left;\n }\n }\n else {\n if (this.dragArea) {\n var isDialogEle = this.helperElement.classList.contains('e-dialog');\n this.dragLimit.top = this.clone ? this.dragLimit.top : 0;\n draEleTop = (top - iTop) < 0 ? this.dragLimit.top : (top - iTop);\n draEleLeft = (left - iLeft) < 0 ? isDialogEle ? (left - (iLeft - this.borderWidth.left)) :\n this.dragElePosition.left : (left - iLeft);\n }\n else {\n draEleTop = top - iTop;\n draEleLeft = left - iLeft;\n }\n }\n var marginTop = parseFloat(getComputedStyle(this.element).marginTop);\n // when drag-element has margin-top\n /* istanbul ignore next */\n if (marginTop > 0) {\n if (this.clone) {\n draEleTop += marginTop;\n if (dTop < 0) {\n if ((marginTop + dTop) >= 0) {\n draEleTop = marginTop + dTop;\n }\n else {\n draEleTop -= marginTop;\n }\n }\n if (this.dragArea) {\n draEleTop = (this.dragLimit.bottom < draEleTop) ? this.dragLimit.bottom : draEleTop;\n }\n }\n if ((top - iTop) < 0) {\n if (dTop + marginTop + (helperElement.offsetHeight - iTop) >= 0) {\n var tempDraEleTop = this.dragLimit.top + dTop - iTop;\n if ((tempDraEleTop + marginTop + iTop) < 0) {\n draEleTop -= marginTop + iTop;\n }\n else {\n draEleTop = tempDraEleTop;\n }\n }\n else {\n draEleTop -= marginTop + iTop;\n }\n }\n }\n if (this.dragArea && this.helperElement.classList.contains('e-treeview')) {\n var helperHeight = helperElement.offsetHeight + (parseFloat(styles.marginTop)\n + parseFloat(styles.marginBottom));\n draEleTop = (draEleTop + helperHeight) > this.dragLimit.bottom ? (this.dragLimit.bottom - helperHeight) : draEleTop;\n }\n /* istanbul ignore next */\n // if(this.eleTop > 0) {\n // draEleTop += this.eleTop;\n // }\n if (this.enableScrollHandler && !this.clone) {\n draEleTop -= this.parentScrollY;\n draEleLeft -= this.parentScrollX;\n }\n if (this.dragArea && typeof this.dragArea !== 'string' && this.dragArea.classList.contains('e-kanban-content') && this.dragArea.style.position === 'relative') {\n draEleTop += this.dragArea.scrollTop;\n }\n var dragValue = this.getProcessedPositionValue({ top: draEleTop + 'px', left: draEleLeft + 'px' });\n setStyleAttribute(helperElement, this.getDragPosition(dragValue));\n if (!this.elementInViewport(helperElement) && this.enableAutoScroll && !this.helperElement.classList.contains('e-treeview')) {\n this.helperElement.scrollIntoView();\n }\n var elements = document.querySelectorAll(':hover');\n if (this.enableAutoScroll && this.helperElement.classList.contains('e-treeview')) {\n if (elements.length === 0) {\n elements = this.getPathElements(evt);\n }\n /* tslint:disable no-any */\n // eslint-disable-next-line\n var scrollParent = this.getScrollParent(elements, false);\n if (this.elementInViewport(this.helperElement)) {\n this.getScrollPosition(scrollParent, draEleTop);\n }\n else if (!this.elementInViewport(this.helperElement)) {\n elements = [].slice.call(document.querySelectorAll(':hover'));\n if (elements.length === 0) {\n elements = this.getPathElements(evt);\n }\n scrollParent = this.getScrollParent(elements, true);\n this.getScrollPosition(scrollParent, draEleTop);\n }\n }\n this.dragProcessStarted = true;\n this.prevLeft = left;\n this.prevTop = top;\n this.position.left = left;\n this.position.top = top;\n this.pageX = pagex;\n this.pageY = pagey;\n };\n /* tslint:disable no-any */\n // eslint-disable-next-line\n Draggable.prototype.getScrollParent = function (node, reverse) {\n /* tslint:disable no-any */\n // eslint-disable-next-line\n var nodeEl = reverse ? node.reverse() : node;\n var hasScroll;\n for (var i = nodeEl.length - 1; i >= 0; i--) {\n hasScroll = window.getComputedStyle(nodeEl[parseInt(i.toString(), 10)])['overflow-y'];\n if ((hasScroll === 'auto' || hasScroll === 'scroll')\n && nodeEl[parseInt(i.toString(), 10)].scrollHeight > nodeEl[parseInt(i.toString(), 10)].clientHeight) {\n return nodeEl[parseInt(i.toString(), 10)];\n }\n }\n hasScroll = window.getComputedStyle(document.scrollingElement)['overflow-y'];\n if (hasScroll === 'visible') {\n document.scrollingElement.style.overflow = 'auto';\n return document.scrollingElement;\n }\n };\n Draggable.prototype.getScrollPosition = function (nodeEle, draEleTop) {\n if (nodeEle && nodeEle === document.scrollingElement) {\n if ((nodeEle.clientHeight + document.scrollingElement.scrollTop - this.helperElement.clientHeight) < draEleTop\n && nodeEle.getBoundingClientRect().height + this.parentClientRect.top > draEleTop) {\n nodeEle.scrollTop += this.helperElement.clientHeight;\n }\n else if (nodeEle.scrollTop > draEleTop - this.helperElement.clientHeight) {\n nodeEle.scrollTop -= this.helperElement.clientHeight;\n }\n }\n else if (nodeEle && nodeEle !== document.scrollingElement) {\n var docScrollTop = document.scrollingElement.scrollTop;\n var helperClientHeight = this.helperElement.clientHeight;\n if ((nodeEle.clientHeight + nodeEle.getBoundingClientRect().top - helperClientHeight + docScrollTop) < draEleTop) {\n nodeEle.scrollTop += this.helperElement.clientHeight;\n }\n else if (nodeEle.getBoundingClientRect().top > (draEleTop - helperClientHeight - docScrollTop)) {\n nodeEle.scrollTop -= this.helperElement.clientHeight;\n }\n }\n };\n Draggable.prototype.getPathElements = function (evt) {\n var elementTop = evt.clientX > 0 ? evt.clientX : 0;\n var elementLeft = evt.clientY > 0 ? evt.clientY : 0;\n return document.elementsFromPoint(elementTop, elementLeft);\n };\n Draggable.prototype.triggerOutFunction = function (evt, eleObj) {\n this.hoverObject.instance.intOut(evt, eleObj.target);\n this.hoverObject.instance.dragData[this.scope] = null;\n this.hoverObject = null;\n };\n Draggable.prototype.getDragPosition = function (dragValue) {\n var temp = extend({}, dragValue);\n if (this.axis) {\n if (this.axis === 'x') {\n delete temp.top;\n }\n else if (this.axis === 'y') {\n delete temp.left;\n }\n }\n return temp;\n };\n Draggable.prototype.getDocumentWidthHeight = function (str) {\n var docBody = document.body;\n var docEle = document.documentElement;\n var returnValue = Math.max(docBody['scroll' + str], docEle['scroll' + str], docBody['offset' + str], docEle['offset' + str], docEle['client' + str]);\n return returnValue;\n };\n Draggable.prototype.intDragStop = function (evt) {\n this.dragProcessStarted = false;\n if (!isUndefined(evt.changedTouches) && (evt.changedTouches.length !== 1)) {\n return;\n }\n var type = ['touchend', 'pointerup', 'mouseup'];\n if (type.indexOf(evt.type) !== -1) {\n if (this.dragStop) {\n var curTarget = this.getProperTargetElement(evt);\n this.trigger('dragStop', { event: evt, element: this.element, target: curTarget, helper: this.helperElement });\n }\n this.intDestroy(evt);\n }\n else {\n this.element.setAttribute('aria-grabbed', 'false');\n }\n var eleObj = this.checkTargetElement(evt);\n if (eleObj.target && eleObj.instance) {\n eleObj.instance.dragStopCalled = true;\n // eslint-disable-next-line\n eleObj.instance.dragData[this.scope] = this.droppables[this.scope];\n eleObj.instance.intDrop(evt, eleObj.target);\n }\n this.setGlobalDroppables(true);\n document.body.classList.remove('e-prevent-select');\n };\n /**\n * @param {MouseEvent | TouchEvent} evt ?\n * @returns {void}\n * @private\n */\n // eslint-disable-next-line\n Draggable.prototype.intDestroy = function (evt) {\n this.dragProcessStarted = false;\n this.toggleEvents();\n document.body.classList.remove('e-prevent-select');\n this.element.setAttribute('aria-grabbed', 'false');\n EventHandler.remove(document, Browser.isSafari() ? 'touchmove' : Browser.touchMoveEvent, this.intDragStart);\n EventHandler.remove(document, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.intDragStop);\n EventHandler.remove(document, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.intDestroy);\n EventHandler.remove(document, Browser.isSafari() ? 'touchmove' : Browser.touchMoveEvent, this.intDrag);\n if (this.isDragStarted()) {\n this.isDragStarted(true);\n }\n };\n // triggers when property changed\n // eslint-disable-next-line\n Draggable.prototype.onPropertyChanged = function (newProp, oldProp) {\n //No Code to handle\n };\n Draggable.prototype.getModuleName = function () {\n return 'draggable';\n };\n Draggable.prototype.isDragStarted = function (change) {\n if (change) {\n isDraggedObject.isDragged = !isDraggedObject.isDragged;\n }\n return isDraggedObject.isDragged;\n };\n Draggable.prototype.setDragArea = function () {\n var eleWidthBound;\n var eleHeightBound;\n var top = 0;\n var left = 0;\n var ele;\n var type = typeof this.dragArea;\n if (type === 'string') {\n ele = select(this.dragArea);\n }\n else {\n ele = this.dragArea;\n }\n if (ele) {\n var elementArea = ele.getBoundingClientRect();\n eleWidthBound = ele.scrollWidth ? ele.scrollWidth : elementArea.right - elementArea.left;\n eleHeightBound = ele.scrollHeight ? (this.dragArea && !isNullOrUndefined(this.helperElement) && this.helperElement.classList.contains('e-treeview')) ? ele.clientHeight : ele.scrollHeight : elementArea.bottom - elementArea.top;\n var keys = ['Top', 'Left', 'Bottom', 'Right'];\n /* eslint-disable */\n var styles = getComputedStyle(ele);\n for (var i = 0; i < keys.length; i++) {\n var key = keys[parseInt(i.toString(), 10)];\n var tborder = styles['border' + key + 'Width'];\n var tpadding = styles['padding' + key];\n var lowerKey = key.toLowerCase();\n this.borderWidth[\"\" + lowerKey] = isNaN(parseFloat(tborder)) ? 0 : parseFloat(tborder);\n this.padding[\"\" + lowerKey] = isNaN(parseFloat(tpadding)) ? 0 : parseFloat(tpadding);\n }\n /* eslint-enable */\n if (this.dragArea && !isNullOrUndefined(this.helperElement) && this.helperElement.classList.contains('e-treeview')) {\n top = elementArea.top + document.scrollingElement.scrollTop;\n }\n else {\n top = elementArea.top;\n }\n left = elementArea.left;\n this.dragLimit.left = left + this.borderWidth.left + this.padding.left;\n this.dragLimit.top = ele.offsetTop + this.borderWidth.top + this.padding.top;\n this.dragLimit.right = left + eleWidthBound - (this.borderWidth.right + this.padding.right);\n this.dragLimit.bottom = top + eleHeightBound - (this.borderWidth.bottom + this.padding.bottom);\n }\n };\n Draggable.prototype.getProperTargetElement = function (evt) {\n var intCoord = this.getCoordinates(evt);\n var ele;\n var prevStyle = this.helperElement.style.pointerEvents || '';\n var isPointer = evt.type.indexOf('pointer') !== -1 && Browser.info.name === 'safari' && parseInt(Browser.info.version, 10) > 12;\n if (compareElementParent(evt.target, this.helperElement) || evt.type.indexOf('touch') !== -1 || isPointer) {\n this.helperElement.style.pointerEvents = 'none';\n ele = document.elementFromPoint(intCoord.clientX, intCoord.clientY);\n this.helperElement.style.pointerEvents = prevStyle;\n }\n else {\n ele = evt.target;\n }\n return ele;\n };\n /* istanbul ignore next */\n Draggable.prototype.currentStateCheck = function (ele, oldEle) {\n var elem;\n if (!isNullOrUndefined(this.currentStateTarget) && this.currentStateTarget !== ele) {\n elem = this.currentStateTarget;\n }\n else {\n elem = !isNullOrUndefined(oldEle) ? oldEle : ele;\n }\n return elem;\n };\n Draggable.prototype.getMousePosition = function (evt, isdragscroll) {\n /* tslint:disable no-any */\n // eslint-disable-next-line\n var dragEle = evt.srcElement !== undefined ? evt.srcElement : evt.target;\n var intCoord = this.getCoordinates(evt);\n var pageX;\n var pageY;\n var isOffsetParent = isNullOrUndefined(dragEle.offsetParent);\n /* istanbul ignore next */\n if (isdragscroll) {\n pageX = this.clone ? intCoord.pageX :\n (intCoord.pageX + (isOffsetParent ? 0 : dragEle.offsetParent.scrollLeft)) - this.relativeXPosition;\n pageY = this.clone ? intCoord.pageY :\n (intCoord.pageY + (isOffsetParent ? 0 : dragEle.offsetParent.scrollTop)) - this.relativeYPosition;\n }\n else {\n pageX = this.clone ? intCoord.pageX : (intCoord.pageX + window.pageXOffset) - this.relativeXPosition;\n pageY = this.clone ? intCoord.pageY : (intCoord.pageY + window.pageYOffset) - this.relativeYPosition;\n }\n if (document.scrollingElement && (!isdragscroll && !this.clone)) {\n var ele = document.scrollingElement;\n var isVerticalScroll = ele.scrollHeight > 0 && ele.scrollHeight > ele.clientHeight && ele.scrollTop > 0;\n var isHorrizontalScroll = ele.scrollWidth > 0 && ele.scrollWidth > ele.clientWidth && ele.scrollLeft > 0;\n pageX = isHorrizontalScroll ? pageX - ele.scrollLeft : pageX;\n pageY = isVerticalScroll ? pageY - ele.scrollTop : pageY;\n }\n return {\n left: pageX - (this.margin.left + this.cursorAt.left),\n top: pageY - (this.margin.top + this.cursorAt.top)\n };\n };\n Draggable.prototype.getCoordinates = function (evt) {\n if (evt.type.indexOf('touch') > -1) {\n return evt.changedTouches[0];\n }\n return evt;\n };\n Draggable.prototype.getHelperElement = function (evt) {\n var element;\n if (this.clone) {\n if (this.helper) {\n element = this.helper({ sender: evt, element: this.target });\n }\n else {\n element = createElement('div', { className: 'e-drag-helper e-block-touch', innerHTML: 'Draggable' });\n document.body.appendChild(element);\n }\n }\n else {\n element = this.element;\n }\n return element;\n };\n Draggable.prototype.setGlobalDroppables = function (reset, drag, helper) {\n this.droppables[this.scope] = reset ? null : {\n draggable: drag,\n helper: helper,\n draggedElement: this.element\n };\n };\n Draggable.prototype.checkTargetElement = function (evt) {\n var target = this.getProperTargetElement(evt);\n var dropIns = this.getDropInstance(target);\n if (!dropIns && target && !isNullOrUndefined(target.parentNode)) {\n var parent_1 = closest(target.parentNode, '.e-droppable') || target.parentElement;\n if (parent_1) {\n dropIns = this.getDropInstance(parent_1);\n }\n }\n return { target: target, instance: dropIns };\n };\n Draggable.prototype.getDropInstance = function (ele) {\n var name = 'getModuleName';\n var drop;\n var eleInst = ele && ele.ej2_instances;\n if (eleInst) {\n for (var _i = 0, eleInst_1 = eleInst; _i < eleInst_1.length; _i++) {\n var inst = eleInst_1[_i];\n if (inst[\"\" + name]() === 'droppable') {\n drop = inst;\n break;\n }\n }\n }\n return drop;\n };\n Draggable.prototype.destroy = function () {\n this.toggleEvents(true);\n _super.prototype.destroy.call(this);\n };\n var Draggable_1;\n __decorate([\n Complex({}, Position)\n ], Draggable.prototype, \"cursorAt\", void 0);\n __decorate([\n Property(true)\n ], Draggable.prototype, \"clone\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"dragArea\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"isDragScroll\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"isReplaceDragEle\", void 0);\n __decorate([\n Property(true)\n ], Draggable.prototype, \"isPreventSelect\", void 0);\n __decorate([\n Event()\n ], Draggable.prototype, \"drag\", void 0);\n __decorate([\n Event()\n ], Draggable.prototype, \"dragStart\", void 0);\n __decorate([\n Event()\n ], Draggable.prototype, \"dragStop\", void 0);\n __decorate([\n Property(1)\n ], Draggable.prototype, \"distance\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"handle\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"abort\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"helper\", void 0);\n __decorate([\n Property('default')\n ], Draggable.prototype, \"scope\", void 0);\n __decorate([\n Property('')\n ], Draggable.prototype, \"dragTarget\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"axis\", void 0);\n __decorate([\n Property()\n ], Draggable.prototype, \"queryPositionInfo\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"enableTailMode\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"skipDistanceCheck\", void 0);\n __decorate([\n Property(true)\n ], Draggable.prototype, \"preventDefault\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"enableAutoScroll\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"enableTapHold\", void 0);\n __decorate([\n Property(750)\n ], Draggable.prototype, \"tapHoldThreshold\", void 0);\n __decorate([\n Property(false)\n ], Draggable.prototype, \"enableScrollHandler\", void 0);\n Draggable = Draggable_1 = __decorate([\n NotifyPropertyChanges\n ], Draggable);\n return Draggable;\n}(Base));\nexport { Draggable };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Base } from './base';\nimport { Browser } from './browser';\nimport { isVisible, matches } from './dom';\nimport { Property, NotifyPropertyChanges, Event } from './notify-property-change';\nimport { EventHandler } from './event-handler';\nimport { compareElementParent } from './util';\n/**\n * Droppable Module provides support to enable droppable functionality in Dom Elements.\n * ```html\n *
Droppable
\n * \n * ```\n */\nvar Droppable = /** @class */ (function (_super) {\n __extends(Droppable, _super);\n function Droppable(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.mouseOver = false;\n _this.dragData = {};\n _this.dragStopCalled = false;\n _this.bind();\n return _this;\n }\n Droppable.prototype.bind = function () {\n this.wireEvents();\n };\n Droppable.prototype.wireEvents = function () {\n EventHandler.add(this.element, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.intDrop, this);\n };\n // triggers when property changed\n // eslint-disable-next-line\n Droppable.prototype.onPropertyChanged = function (newProp, oldProp) {\n //No Code to handle\n };\n Droppable.prototype.getModuleName = function () {\n return 'droppable';\n };\n Droppable.prototype.intOver = function (event, element) {\n if (!this.mouseOver) {\n var drag = this.dragData[this.scope];\n this.trigger('over', { event: event, target: element, dragData: drag });\n this.mouseOver = true;\n }\n };\n Droppable.prototype.intOut = function (event, element) {\n if (this.mouseOver) {\n this.trigger('out', { evt: event, target: element });\n this.mouseOver = false;\n }\n };\n Droppable.prototype.intDrop = function (evt, element) {\n if (!this.dragStopCalled) {\n return;\n }\n else {\n this.dragStopCalled = false;\n }\n var accept = true;\n var drag = this.dragData[this.scope];\n var isDrag = drag ? (drag.helper && isVisible(drag.helper)) : false;\n var area;\n if (isDrag) {\n area = this.isDropArea(evt, drag.helper, element);\n if (this.accept) {\n accept = matches(drag.helper, this.accept);\n }\n }\n if (isDrag && this.drop && area.canDrop && accept) {\n this.trigger('drop', { event: evt, target: area.target, droppedElement: drag.helper, dragData: drag });\n }\n this.mouseOver = false;\n };\n Droppable.prototype.isDropArea = function (evt, helper, element) {\n var area = { canDrop: true, target: element || evt.target };\n var isTouch = evt.type === 'touchend';\n if (isTouch || area.target === helper) {\n helper.style.display = 'none';\n var coord = isTouch ? (evt.changedTouches[0]) : evt;\n var ele = document.elementFromPoint(coord.clientX, coord.clientY);\n area.canDrop = false;\n area.canDrop = compareElementParent(ele, this.element);\n if (area.canDrop) {\n area.target = ele;\n }\n helper.style.display = '';\n }\n return area;\n };\n Droppable.prototype.destroy = function () {\n EventHandler.remove(this.element, Browser.isSafari() ? 'touchend' : Browser.touchEndEvent, this.intDrop);\n _super.prototype.destroy.call(this);\n };\n __decorate([\n Property()\n ], Droppable.prototype, \"accept\", void 0);\n __decorate([\n Property('default')\n ], Droppable.prototype, \"scope\", void 0);\n __decorate([\n Event()\n ], Droppable.prototype, \"drop\", void 0);\n __decorate([\n Event()\n ], Droppable.prototype, \"over\", void 0);\n __decorate([\n Event()\n ], Droppable.prototype, \"out\", void 0);\n Droppable = __decorate([\n NotifyPropertyChanges\n ], Droppable);\n return Droppable;\n}(Base));\nexport { Droppable };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, NotifyPropertyChanges, Event } from './notify-property-change';\nimport { Base } from './base';\nvar keyCode = {\n 'backspace': 8,\n 'tab': 9,\n 'enter': 13,\n 'shift': 16,\n 'control': 17,\n 'alt': 18,\n 'pause': 19,\n 'capslock': 20,\n 'space': 32,\n 'escape': 27,\n 'pageup': 33,\n 'pagedown': 34,\n 'end': 35,\n 'home': 36,\n 'leftarrow': 37,\n 'uparrow': 38,\n 'rightarrow': 39,\n 'downarrow': 40,\n 'insert': 45,\n 'delete': 46,\n 'f1': 112,\n 'f2': 113,\n 'f3': 114,\n 'f4': 115,\n 'f5': 116,\n 'f6': 117,\n 'f7': 118,\n 'f8': 119,\n 'f9': 120,\n 'f10': 121,\n 'f11': 122,\n 'f12': 123,\n 'semicolon': 186,\n 'plus': 187,\n 'comma': 188,\n 'minus': 189,\n 'dot': 190,\n 'forwardslash': 191,\n 'graveaccent': 192,\n 'openbracket': 219,\n 'backslash': 220,\n 'closebracket': 221,\n 'singlequote': 222\n};\n/**\n * KeyboardEvents class enables you to bind key action desired key combinations for ex., Ctrl+A, Delete, Alt+Space etc.\n * ```html\n *
;\n * \n * ```\n */\nvar KeyboardEvents = /** @class */ (function (_super) {\n __extends(KeyboardEvents, _super);\n /**\n * Initializes the KeyboardEvents\n *\n * @param {HTMLElement} element ?\n * @param {KeyboardEventsModel} options ?\n */\n function KeyboardEvents(element, options) {\n var _this = _super.call(this, options, element) || this;\n /**\n * To handle a key press event returns null\n *\n * @param {KeyboardEventArgs} e ?\n * @returns {void} ?\n */\n _this.keyPressHandler = function (e) {\n var isAltKey = e.altKey;\n var isCtrlKey = e.ctrlKey;\n var isShiftKey = e.shiftKey;\n var curkeyCode = e.which;\n var keys = Object.keys(_this.keyConfigs);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n var configCollection = _this.keyConfigs[\"\" + key].split(',');\n for (var _a = 0, configCollection_1 = configCollection; _a < configCollection_1.length; _a++) {\n var rconfig = configCollection_1[_a];\n var rKeyObj = KeyboardEvents_1.getKeyConfigData(rconfig.trim());\n if (isAltKey === rKeyObj.altKey && isCtrlKey === rKeyObj.ctrlKey &&\n isShiftKey === rKeyObj.shiftKey && curkeyCode === rKeyObj.keyCode) {\n e.action = key;\n if (_this.keyAction) {\n _this.keyAction(e);\n }\n }\n }\n }\n };\n _this.bind();\n return _this;\n }\n KeyboardEvents_1 = KeyboardEvents;\n /**\n * Unwire bound events and destroy the instance.\n *\n * @returns {void} ?\n */\n KeyboardEvents.prototype.destroy = function () {\n this.unwireEvents();\n _super.prototype.destroy.call(this);\n };\n /**\n * Function can be used to specify certain action if a property is changed\n *\n * @param {KeyboardEventsModel} newProp ?\n * @param {KeyboardEventsModel} oldProp ?\n * @returns {void} ?\n * @private\n */\n // eslint-disable-next-line\n KeyboardEvents.prototype.onPropertyChanged = function (newProp, oldProp) {\n // No code are needed\n };\n KeyboardEvents.prototype.bind = function () {\n this.wireEvents();\n };\n /**\n * To get the module name, returns 'keyboard'.\n *\n * @returns {string} ?\n * @private\n */\n KeyboardEvents.prototype.getModuleName = function () {\n return 'keyboard';\n };\n /**\n * Wiring event handlers to events\n *\n * @returns {void} ?\n * @private\n */\n KeyboardEvents.prototype.wireEvents = function () {\n this.element.addEventListener(this.eventName, this.keyPressHandler);\n };\n /**\n * Unwiring event handlers to events\n *\n * @returns {void} ?\n * @private\n */\n KeyboardEvents.prototype.unwireEvents = function () {\n this.element.removeEventListener(this.eventName, this.keyPressHandler);\n };\n /**\n * To get the key configuration data\n *\n * @param {string} config - configuration data\n * @returns {KeyData} ?\n */\n KeyboardEvents.getKeyConfigData = function (config) {\n if (config in this.configCache) {\n return this.configCache[\"\" + config];\n }\n var keys = config.toLowerCase().split('+');\n var keyData = {\n altKey: (keys.indexOf('alt') !== -1 ? true : false),\n ctrlKey: (keys.indexOf('ctrl') !== -1 ? true : false),\n shiftKey: (keys.indexOf('shift') !== -1 ? true : false),\n keyCode: null\n };\n if (keys[keys.length - 1].length > 1 && !!Number(keys[keys.length - 1])) {\n keyData.keyCode = Number(keys[keys.length - 1]);\n }\n else {\n keyData.keyCode = KeyboardEvents_1.getKeyCode(keys[keys.length - 1]);\n }\n KeyboardEvents_1.configCache[\"\" + config] = keyData;\n return keyData;\n };\n // Return the keycode value as string\n KeyboardEvents.getKeyCode = function (keyVal) {\n return keyCode[\"\" + keyVal] || keyVal.toUpperCase().charCodeAt(0);\n };\n var KeyboardEvents_1;\n KeyboardEvents.configCache = {};\n __decorate([\n Property({})\n ], KeyboardEvents.prototype, \"keyConfigs\", void 0);\n __decorate([\n Property('keyup')\n ], KeyboardEvents.prototype, \"eventName\", void 0);\n __decorate([\n Event()\n ], KeyboardEvents.prototype, \"keyAction\", void 0);\n KeyboardEvents = KeyboardEvents_1 = __decorate([\n NotifyPropertyChanges\n ], KeyboardEvents);\n return KeyboardEvents;\n}(Base));\nexport { KeyboardEvents };\n","import { extend, isNullOrUndefined } from './util';\nimport { defaultCulture } from './internationalization';\n/**\n * L10n modules provides localized text for different culture.\n * ```typescript\n * import {setCulture} from '@syncfusion/ts-base-library';\n * //load global locale object common for all components.\n * L10n.load({\n * 'fr-BE': {\n * 'button': {\n * 'check': 'vérifié'\n * }\n * }\n * });\n * //set globale default locale culture.\n * setCulture('fr-BE');\n * let instance: L10n = new L10n('button', {\n * check: 'checked'\n * });\n * //Get locale text for current property.\n * instance.getConstant('check');\n * //Change locale culture in a component.\n * instance.setLocale('en-US');\n * ```\n */\nvar L10n = /** @class */ (function () {\n /**\n * Constructor\n *\n * @param {string} controlName ?\n * @param {Object} localeStrings ?\n * @param {string} locale ?\n */\n function L10n(controlName, localeStrings, locale) {\n this.controlName = controlName;\n this.localeStrings = localeStrings;\n this.setLocale(locale || defaultCulture);\n }\n /**\n * Sets the locale text\n *\n * @param {string} locale ?\n * @returns {void} ?\n */\n L10n.prototype.setLocale = function (locale) {\n var intLocale = this.intGetControlConstant(L10n.locale, locale);\n this.currentLocale = intLocale || this.localeStrings;\n };\n /**\n * Sets the global locale for all components.\n *\n * @param {Object} localeObject - specifies the localeObject to be set as global locale.\n * @returns {void} ?\n */\n L10n.load = function (localeObject) {\n this.locale = extend(this.locale, localeObject, {}, true);\n };\n /**\n * Returns current locale text for the property based on the culture name and control name.\n *\n * @param {string} prop - specifies the property for which localize text to be returned.\n * @returns {string} ?\n */\n L10n.prototype.getConstant = function (prop) {\n // Removed conditional operator because this method does not return correct value when passing 0 as value in localization\n if (!isNullOrUndefined(this.currentLocale[\"\" + prop])) {\n return this.currentLocale[\"\" + prop];\n }\n else {\n return this.localeStrings[\"\" + prop] || '';\n }\n };\n /**\n * Returns the control constant object for current object and the locale specified.\n *\n * @param {Object} curObject ?\n * @param {string} locale ?\n * @returns {Object} ?\n */\n L10n.prototype.intGetControlConstant = function (curObject, locale) {\n if ((curObject)[\"\" + locale]) {\n return (curObject)[\"\" + locale][this.controlName];\n }\n return null;\n };\n L10n.locale = {};\n return L10n;\n}());\nexport { L10n };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { extend } from './util';\nimport { Property, Complex, NotifyPropertyChanges, Event } from './notify-property-change';\nimport { Browser } from './browser';\nimport { Base } from './base';\nimport { ChildProperty } from './child-property';\nimport { EventHandler } from './event-handler';\n/**\n * SwipeSettings is a framework module that provides support to handle swipe event like swipe up, swipe right, etc..,\n */\nvar SwipeSettings = /** @class */ (function (_super) {\n __extends(SwipeSettings, _super);\n function SwipeSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(50)\n ], SwipeSettings.prototype, \"swipeThresholdDistance\", void 0);\n return SwipeSettings;\n}(ChildProperty));\nexport { SwipeSettings };\nvar swipeRegex = /(Up|Down)/;\n/**\n * Touch class provides support to handle the touch event like tap, double tap, tap hold, etc..,\n * ```typescript\n * let node: HTMLElement;\n * let touchObj: Touch = new Touch({\n * element: node,\n * tap: function (e) {\n * // tap handler function code\n * }\n * tapHold: function (e) {\n * // tap hold handler function code\n * }\n * scroll: function (e) {\n * // scroll handler function code\n * }\n * swipe: function (e) {\n * // swipe handler function code\n * }\n * });\n * ```\n */\nvar Touch = /** @class */ (function (_super) {\n __extends(Touch, _super);\n /* End-Properties */\n function Touch(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.touchAction = true;\n _this.tapCount = 0;\n /**\n *\n * @param {MouseEventArgs | TouchEventArgs} evt ?\n * @returns {void} ?\n */\n _this.startEvent = function (evt) {\n if (_this.touchAction === true) {\n var point = _this.updateChangeTouches(evt);\n if (evt.changedTouches !== undefined) {\n _this.touchAction = false;\n }\n _this.isTouchMoved = false;\n _this.movedDirection = '';\n _this.startPoint = _this.lastMovedPoint = { clientX: point.clientX, clientY: point.clientY };\n _this.startEventData = point;\n _this.hScrollLocked = _this.vScrollLocked = false;\n _this.tStampStart = Date.now();\n _this.timeOutTapHold = setTimeout(function () { _this.tapHoldEvent(evt); }, _this.tapHoldThreshold);\n EventHandler.add(_this.element, Browser.touchMoveEvent, _this.moveEvent, _this);\n EventHandler.add(_this.element, Browser.touchEndEvent, _this.endEvent, _this);\n EventHandler.add(_this.element, Browser.touchCancelEvent, _this.cancelEvent, _this);\n }\n };\n /**\n *\n * @param {MouseEventArgs | TouchEventArgs} evt ?\n * @returns {void} ?\n */\n _this.moveEvent = function (evt) {\n var point = _this.updateChangeTouches(evt);\n _this.movedPoint = point;\n _this.isTouchMoved = !(point.clientX === _this.startPoint.clientX && point.clientY === _this.startPoint.clientY);\n var eScrollArgs = {};\n if (_this.isTouchMoved) {\n clearTimeout(_this.timeOutTapHold);\n _this.calcScrollPoints(evt);\n var scrollArg = {\n startEvents: _this.startEventData,\n originalEvent: evt, startX: _this.startPoint.clientX,\n startY: _this.startPoint.clientY, distanceX: _this.distanceX,\n distanceY: _this.distanceY, scrollDirection: _this.scrollDirection,\n velocity: _this.getVelocity(point)\n };\n eScrollArgs = extend(eScrollArgs, {}, scrollArg);\n _this.trigger('scroll', eScrollArgs);\n _this.lastMovedPoint = { clientX: point.clientX, clientY: point.clientY };\n }\n };\n /**\n *\n * @param {MouseEventArgs | TouchEventArgs} evt ?\n * @returns {void} ?\n */\n _this.cancelEvent = function (evt) {\n clearTimeout(_this.timeOutTapHold);\n clearTimeout(_this.timeOutTap);\n _this.tapCount = 0;\n _this.swipeFn(evt);\n EventHandler.remove(_this.element, Browser.touchCancelEvent, _this.cancelEvent);\n };\n /**\n *\n * @param {MouseEventArgs | TouchEventArgs} evt ?\n * @returns {void} ?\n */\n _this.endEvent = function (evt) {\n _this.swipeFn(evt);\n if (!_this.isTouchMoved) {\n if (typeof _this.tap === 'function') {\n _this.trigger('tap', { originalEvent: evt, tapCount: ++_this.tapCount });\n _this.timeOutTap = setTimeout(function () {\n _this.tapCount = 0;\n }, _this.tapThreshold);\n }\n }\n _this.modeclear();\n };\n /**\n *\n * @param {MouseEventArgs | TouchEventArgs} evt ?\n * @returns {void} ?\n */\n _this.swipeFn = function (evt) {\n clearTimeout(_this.timeOutTapHold);\n clearTimeout(_this.timeOutTap);\n var point = _this.updateChangeTouches(evt);\n var diffX = point.clientX - _this.startPoint.clientX;\n var diffY = point.clientY - _this.startPoint.clientY;\n diffX = Math.floor(diffX < 0 ? -1 * diffX : diffX);\n diffY = Math.floor(diffY < 0 ? -1 * diffY : diffX);\n _this.isTouchMoved = diffX > 1 || diffY > 1;\n var isFirefox = (/Firefox/).test(Browser.userAgent);\n if (isFirefox && point.clientX === 0 && point.clientY === 0 && evt.type === 'mouseup') {\n _this.isTouchMoved = false;\n }\n _this.endPoint = point;\n _this.calcPoints(evt);\n var swipeArgs = {\n originalEvent: evt,\n startEvents: _this.startEventData,\n startX: _this.startPoint.clientX,\n startY: _this.startPoint.clientY,\n distanceX: _this.distanceX, distanceY: _this.distanceY, swipeDirection: _this.movedDirection,\n velocity: _this.getVelocity(point)\n };\n if (_this.isTouchMoved) {\n var eSwipeArgs = void 0;\n var tDistance = _this.swipeSettings.swipeThresholdDistance;\n // eslint-disable-next-line\n eSwipeArgs = extend(eSwipeArgs, _this.defaultArgs, swipeArgs);\n var canTrigger = false;\n var ele = _this.element;\n var scrollBool = _this.isScrollable(ele);\n var moved = swipeRegex.test(_this.movedDirection);\n if ((tDistance < _this.distanceX && !moved) || (tDistance < _this.distanceY && moved)) {\n if (!scrollBool) {\n canTrigger = true;\n }\n else {\n canTrigger = _this.checkSwipe(ele, moved);\n }\n }\n if (canTrigger) {\n _this.trigger('swipe', eSwipeArgs);\n }\n }\n _this.modeclear();\n };\n _this.modeclear = function () {\n _this.modeClear = setTimeout(function () {\n _this.touchAction = true;\n }, (typeof _this.tap !== 'function' ? 0 : 20));\n _this.lastTapTime = new Date().getTime();\n EventHandler.remove(_this.element, Browser.touchMoveEvent, _this.moveEvent);\n EventHandler.remove(_this.element, Browser.touchEndEvent, _this.endEvent);\n EventHandler.remove(_this.element, Browser.touchCancelEvent, _this.cancelEvent);\n };\n _this.bind();\n return _this;\n }\n // triggers when property changed\n /**\n *\n * @private\n * @param {TouchModel} newProp ?\n * @param {TouchModel} oldProp ?\n * @returns {void} ?\n */\n // eslint-disable-next-line\n Touch.prototype.onPropertyChanged = function (newProp, oldProp) {\n //No Code to handle\n };\n Touch.prototype.bind = function () {\n this.wireEvents();\n if (Browser.isIE) {\n this.element.classList.add('e-block-touch');\n }\n };\n /**\n * To destroy the touch instance.\n *\n * @returns {void}\n */\n Touch.prototype.destroy = function () {\n this.unwireEvents();\n _super.prototype.destroy.call(this);\n };\n // Need to changes the event binding once we updated the event handler.\n Touch.prototype.wireEvents = function () {\n EventHandler.add(this.element, Browser.touchStartEvent, this.startEvent, this);\n };\n Touch.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, Browser.touchStartEvent, this.startEvent);\n };\n /**\n * Returns module name as touch\n *\n * @returns {string} ?\n * @private\n */\n Touch.prototype.getModuleName = function () {\n return 'touch';\n };\n /**\n * Returns if the HTML element is Scrollable.\n *\n * @param {HTMLElement} element - HTML Element to check if Scrollable.\n * @returns {boolean} ?\n */\n Touch.prototype.isScrollable = function (element) {\n var eleStyle = getComputedStyle(element);\n var style = eleStyle.overflow + eleStyle.overflowX + eleStyle.overflowY;\n if ((/(auto|scroll)/).test(style)) {\n return true;\n }\n return false;\n };\n /**\n *\n * @param {MouseEventArgs | TouchEventArgs} evt ?\n * @returns {void} ?\n */\n Touch.prototype.tapHoldEvent = function (evt) {\n this.tapCount = 0;\n this.touchAction = true;\n var eTapArgs;\n EventHandler.remove(this.element, Browser.touchMoveEvent, this.moveEvent);\n EventHandler.remove(this.element, Browser.touchEndEvent, this.endEvent);\n // eslint-disable-next-line\n eTapArgs = { originalEvent: evt };\n this.trigger('tapHold', eTapArgs);\n EventHandler.remove(this.element, Browser.touchCancelEvent, this.cancelEvent);\n };\n Touch.prototype.calcPoints = function (evt) {\n var point = this.updateChangeTouches(evt);\n this.defaultArgs = { originalEvent: evt };\n this.distanceX = Math.abs((Math.abs(point.clientX) - Math.abs(this.startPoint.clientX)));\n this.distanceY = Math.abs((Math.abs(point.clientY) - Math.abs(this.startPoint.clientY)));\n if (this.distanceX > this.distanceY) {\n this.movedDirection = (point.clientX > this.startPoint.clientX) ? 'Right' : 'Left';\n }\n else {\n this.movedDirection = (point.clientY < this.startPoint.clientY) ? 'Up' : 'Down';\n }\n };\n Touch.prototype.calcScrollPoints = function (evt) {\n var point = this.updateChangeTouches(evt);\n this.defaultArgs = { originalEvent: evt };\n this.distanceX = Math.abs((Math.abs(point.clientX) - Math.abs(this.lastMovedPoint.clientX)));\n this.distanceY = Math.abs((Math.abs(point.clientY) - Math.abs(this.lastMovedPoint.clientY)));\n if ((this.distanceX > this.distanceY || this.hScrollLocked === true) && this.vScrollLocked === false) {\n this.scrollDirection = (point.clientX > this.lastMovedPoint.clientX) ? 'Right' : 'Left';\n this.hScrollLocked = true;\n }\n else {\n this.scrollDirection = (point.clientY < this.lastMovedPoint.clientY) ? 'Up' : 'Down';\n this.vScrollLocked = true;\n }\n };\n Touch.prototype.getVelocity = function (pnt) {\n var newX = pnt.clientX;\n var newY = pnt.clientY;\n var newT = Date.now();\n var xDist = newX - this.startPoint.clientX;\n var yDist = newY - this.startPoint.clientX;\n var interval = newT - this.tStampStart;\n return Math.sqrt(xDist * xDist + yDist * yDist) / interval;\n };\n // eslint-disable-next-line\n Touch.prototype.checkSwipe = function (ele, flag) {\n var keys = ['scroll', 'offset'];\n var temp = flag ? ['Height', 'Top'] : ['Width', 'Left'];\n if ((ele[keys[0] + temp[0]] <= ele[keys[1] + temp[0]])) {\n return true;\n }\n return (ele[keys[0] + temp[1]] === 0) ||\n (ele[keys[1] + temp[0]] + ele[keys[0] + temp[1]] >= ele[keys[0] + temp[0]]);\n };\n Touch.prototype.updateChangeTouches = function (evt) {\n var point = evt.changedTouches && evt.changedTouches.length !== 0 ? evt.changedTouches[0] : evt;\n return point;\n };\n __decorate([\n Event()\n ], Touch.prototype, \"tap\", void 0);\n __decorate([\n Event()\n ], Touch.prototype, \"tapHold\", void 0);\n __decorate([\n Event()\n ], Touch.prototype, \"swipe\", void 0);\n __decorate([\n Event()\n ], Touch.prototype, \"scroll\", void 0);\n __decorate([\n Property(350)\n ], Touch.prototype, \"tapThreshold\", void 0);\n __decorate([\n Property(750)\n ], Touch.prototype, \"tapHoldThreshold\", void 0);\n __decorate([\n Complex({}, SwipeSettings)\n ], Touch.prototype, \"swipeSettings\", void 0);\n Touch = __decorate([\n NotifyPropertyChanges\n ], Touch);\n return Touch;\n}(Base));\nexport { Touch };\n","/**\n * Template Engine\n */\nvar LINES = new RegExp('\\\\n|\\\\r|\\\\s\\\\s+', 'g');\nvar QUOTES = new RegExp(/'|\"/g);\nvar IF_STMT = new RegExp('if ?\\\\(');\nvar ELSEIF_STMT = new RegExp('else if ?\\\\(');\nvar ELSE_STMT = new RegExp('else');\nvar FOR_STMT = new RegExp('for ?\\\\(');\nvar IF_OR_FOR = new RegExp('(/if|/for)');\nvar CALL_FUNCTION = new RegExp('\\\\((.*)\\\\)', '');\nvar NOT_NUMBER = new RegExp('^[0-9]+$', 'g');\nvar WORD = new RegExp('[\\\\w\"\\'.\\\\s+]+', 'g');\nvar DBL_QUOTED_STR = new RegExp('\"(.*?)\"', 'g');\nvar WORDIF = new RegExp('[\\\\w\"\\'@#$.\\\\s-+]+', 'g');\nvar exp = new RegExp('\\\\${([^}]*)}', 'g');\n// let cachedTemplate: Object = {};\nvar ARR_OBJ = /^\\..*/gm;\nvar SINGLE_SLASH = /\\\\/gi;\nvar DOUBLE_SLASH = /\\\\\\\\/gi;\nvar WORDFUNC = new RegExp('[\\\\w\"\\'@#$.\\\\s+]+', 'g');\nvar WINDOWFUNC = /\\window\\./gm;\n/**\n * The function to set regular expression for template expression string.\n *\n * @param {RegExp} value - Value expression.\n * @returns {RegExp} ?\n * @private\n */\nexport function expression(value) {\n if (value) {\n exp = value;\n }\n return exp;\n}\n// /**\n// * To render the template string from the given data.\n// * @param {string} template - String Template.\n// * @param {Object[]|JSON} data - DataSource for the template.\n// * @param {Object} helper? - custom helper object.\n// */\n// export function template(template: string, data: JSON, helper?: Object): string {\n// let hash: string = hashCode(template);\n// let tmpl: Function;\n// if (!cachedTemplate[hash]) {\n// tmpl = cachedTemplate[hash] = compile(template, helper);\n// } else {\n// tmpl = cachedTemplate[hash];\n// }\n// return tmpl(data);\n// }\n/**\n * Compile the template string into template function.\n *\n * @param {string | Function} template - The template string which is going to convert.\n * @param {Object} helper - Helper functions as an object.\n * @param {boolean} ignorePrefix ?\n * @returns {string} ?\n * @private\n */\nexport function compile(template, helper, ignorePrefix) {\n if (typeof template === 'function') {\n return template;\n }\n else {\n var argName = 'data';\n var evalExpResult = evalExp(template, argName, helper, ignorePrefix);\n /* eslint-disable */\n var condtion = \"var valueRegEx = (/value=\\\\'([A-Za-z0-9 _]*)((.)([\\\\w)(!-;?-\\u25A0\\\\s]+)['])/g);\\n var hrefRegex = (/(?:href)([\\\\s='\\\"./]+)([\\\\w-./?=&\\\\\\\\#\\\"]+)((.)([\\\\w)(!-;/?-\\u25A0\\\\s]+)['])/g);\\n if(str.match(valueRegEx)){\\n var check = str.match(valueRegEx);\\n var str1 = str;\\n for (var i=0; i < check.length; i++) {\\n var check1 = str.match(valueRegEx)[i].split('value=')[1];\\n var change = check1.match(/^'/) !== null ? check1.replace(/^'/, '\\\"') : check1;\\n change =change.match(/.$/)[0] === '\\\\'' ? change.replace(/.$/,'\\\"') : change;\\n str1 = str1.replace(check1, change);\\n }\\n str = str.replace(str, str1);\\n }\\n else if (str.match(/(?:href='')/) === null) {\\n if(str.match(hrefRegex)) {\\n var check = str.match(hrefRegex);\\n var str1 = str;\\n for (var i=0; i < check.length; i++) {\\n var check1 = str.match(hrefRegex)[i].split('href=')[1];\\n if (check1) {\\n var change = check1.match(/^'/) !== null ? check1.replace(/^'/, '\\\"') : check1;\\n change =change.match(/.$/)[0] === '\\\\'' ? change.replace(/.$/,'\\\"') : change;\\n str1 = str1.replace(check1, change);\\n }\\n }\\n str = str.replace(str, str1);\\n }\\n }\\n \";\n var fnCode = 'var str=\\\"' + evalExpResult + '\\\";' + condtion + ' return str;';\n /* eslint-enable */\n var fn = new Function(argName, fnCode);\n return fn.bind(helper);\n }\n}\n/** function used to evaluate the function expression\n *\n * @param {string} str ?\n * @param {string} nameSpace ?\n * @param {Object} helper ?\n * @param {boolean} ignorePrefix ?\n * @returns {string} ?\n */\nfunction evalExp(str, nameSpace, helper, ignorePrefix) {\n var varCOunt = 0;\n /**\n * Variable containing Local Keys\n */\n var localKeys = [];\n var isClass = str.match(/class=\"([^\"]+|)\\s{2}/g);\n var singleSpace = '';\n if (isClass) {\n isClass.forEach(function (value) {\n singleSpace = value.replace(/\\s\\s+/g, ' ');\n str = str.replace(value, singleSpace);\n });\n }\n if (exp.test(str)) {\n var insideBraces = false;\n var outputString = '';\n for (var i = 0; i < str.length; i++) {\n if (str[i + ''] === '$' && str[i + 1] === '{') {\n insideBraces = true;\n }\n else if (str[i + ''] === '}') {\n insideBraces = false;\n }\n outputString += (str[i + ''] === '\"' && !insideBraces) ? '\\\\\"' : str[i + ''];\n }\n str = outputString;\n }\n else {\n str = str.replace(/\\\\?\"/g, '\\\\\"');\n }\n return str.replace(LINES, '').replace(DBL_QUOTED_STR, '\\'$1\\'').replace(exp, \n // eslint-disable-next-line\n function (match, cnt, offset, matchStr) {\n var SPECIAL_CHAR = /@|#|\\$/gm;\n var matches = cnt.match(CALL_FUNCTION);\n // matches to detect any function calls\n if (matches) {\n var rlStr = matches[1];\n if (ELSEIF_STMT.test(cnt)) {\n //handling else-if condition\n cnt = '\";} ' + cnt.replace(matches[1], rlStr.replace(WORD, function (str) {\n str = str.trim();\n return addNameSpace(str, !(QUOTES.test(str)) && (localKeys.indexOf(str) === -1), nameSpace, localKeys, ignorePrefix);\n })) + '{ \\n str = str + \"';\n }\n else if (IF_STMT.test(cnt)) {\n //handling if condition\n cnt = '\"; ' + cnt.replace(matches[1], rlStr.replace(WORDIF, function (strs) {\n return HandleSpecialCharArrObj(strs, nameSpace, localKeys, ignorePrefix);\n })) + '{ \\n str = str + \"';\n }\n else if (FOR_STMT.test(cnt)) {\n //handling for condition\n var rlStr_1 = matches[1].split(' of ');\n // replace for each into actual JavaScript\n // eslint-disable-next-line\n cnt = '\"; ' + cnt.replace(matches[1], function (mtc) {\n localKeys.push(rlStr_1[0]);\n localKeys.push(rlStr_1[0] + 'Index');\n varCOunt = varCOunt + 1;\n // tslint:disable-next-line\n return 'var i' + varCOunt + '=0; i' + varCOunt + ' < ' + addNameSpace(rlStr_1[1], true, nameSpace, localKeys, ignorePrefix) + '.length; i' + varCOunt + '++';\n }) + '{ \\n ' + rlStr_1[0] + '= ' + addNameSpace(rlStr_1[1], true, nameSpace, localKeys, ignorePrefix)\n + '[i' + varCOunt + ']; \\n var ' + rlStr_1[0] + 'Index=i' + varCOunt + '; \\n str = str + \"';\n }\n else {\n //helper function handling\n var fnStr = cnt.split('(');\n // eslint-disable-next-line\n var fNameSpace = (helper && helper.hasOwnProperty(fnStr[0]) ? 'this.' : 'global');\n fNameSpace = (/\\./.test(fnStr[0]) ? '' : fNameSpace);\n var ftArray = matches[1].split(',');\n if (matches[1].length !== 0 && !(/data/).test(ftArray[0]) && !(/window./).test(ftArray[0])) {\n matches[1] = (fNameSpace === 'global' ? nameSpace + '.' + matches[1] : matches[1]);\n }\n var splRegexp = /@|\\$|#/gm;\n var arrObj = /\\]\\./gm;\n if (WINDOWFUNC.test(cnt) && arrObj.test(cnt) || splRegexp.test(cnt)) {\n var splArrRegexp = /@|\\$|#|\\]\\./gm;\n if (splArrRegexp.test(cnt)) {\n // tslint:disable-next-line\n cnt = '\"+ ' + (fNameSpace === 'global' ? '' : fNameSpace) + cnt.replace(matches[1], rlStr.replace(WORDFUNC, function (strs) {\n return HandleSpecialCharArrObj(strs, nameSpace, localKeys, ignorePrefix);\n })) + '+ \"';\n }\n }\n else {\n cnt = '\" + ' + (fNameSpace === 'global' ? '' : fNameSpace) +\n cnt.replace(rlStr, addNameSpace(matches[1].replace(/,( |)data.|,/gi, ',' + nameSpace + '.').replace(/,( |)data.window/gi, ',window'), (fNameSpace === 'global' ? false : true), nameSpace, localKeys, ignorePrefix)) +\n '+\"';\n }\n }\n }\n else if (ELSE_STMT.test(cnt)) {\n // handling else condition\n cnt = '\"; ' + cnt.replace(ELSE_STMT, '} else { \\n str = str + \"');\n // eslint-disable-next-line\n }\n else if (!!cnt.match(IF_OR_FOR)) {\n // close condition\n cnt = cnt.replace(IF_OR_FOR, '\"; \\n } \\n str = str + \"');\n }\n else if (SPECIAL_CHAR.test(cnt)) {\n // template string with double slash with special character\n if (cnt.match(SINGLE_SLASH)) {\n cnt = SlashReplace(cnt);\n }\n cnt = '\"+' + NameSpaceForspecialChar(cnt, (localKeys.indexOf(cnt) === -1), nameSpace, localKeys) + '\"]+\"';\n }\n else {\n // template string with double slash\n if (cnt.match(SINGLE_SLASH)) {\n cnt = SlashReplace(cnt);\n cnt = '\"+' + NameSpaceForspecialChar(cnt, (localKeys.indexOf(cnt) === -1), nameSpace, localKeys) + '\"]+\"';\n }\n else {\n // evaluate normal expression\n cnt = cnt !== '' ? '\"+' + addNameSpace(cnt.replace(/,/gi, '+' + nameSpace + '.'), (localKeys.indexOf(cnt) === -1), nameSpace, localKeys, ignorePrefix) + '+\"' : '${}';\n }\n }\n return cnt;\n });\n}\n/**\n *\n * @param {string} str ?\n * @param {boolean} addNS ?\n * @param {string} nameSpace ?\n * @param {string[]} ignoreList ?\n * @param {boolean} ignorePrefix ?\n * @returns {string} ?\n */\nfunction addNameSpace(str, addNS, nameSpace, ignoreList, ignorePrefix) {\n return ((addNS && !(NOT_NUMBER.test(str)) && ignoreList.indexOf(str.split('.')[0]) === -1 && !ignorePrefix && str !== 'true' && str !== 'false') ? nameSpace + '.' + str : str);\n}\n/**\n *\n * @param {string} str ?\n * @param {boolean} addNS ?\n * @param {string} nameSpace ?\n * @param {string[]} ignoreList ?\n * @returns {string} ?\n */\nfunction NameSpaceArrObj(str, addNS, nameSpace, ignoreList) {\n var arrObjReg = /^\\..*/gm;\n return ((addNS && !(NOT_NUMBER.test(str)) &&\n ignoreList.indexOf(str.split('.')[0]) === -1 && !(arrObjReg.test(str))) ? nameSpace + '.' + str : str);\n}\n// // Create hashCode for template string to storeCached function\n// function hashCode(str: string): string {\n// return str.split('').reduce((a: number, b: string) => { a = ((a << 5) - a) + b.charCodeAt(0); return a & a; }, 0).toString();\n// }\n/**\n *\n * @param {string} str ?\n * @param {boolean} addNS ?\n * @param {string} nameSpace ?\n * @param {string[]} ignoreList ?\n * @returns {string} ?\n */\nfunction NameSpaceForspecialChar(str, addNS, nameSpace, ignoreList) {\n return ((addNS && !(NOT_NUMBER.test(str)) && ignoreList.indexOf(str.split('.')[0]) === -1) ? nameSpace + '[\"' + str : str);\n}\n// eslint-disable-next-line\nfunction SlashReplace(tempStr) {\n var double = '\\\\\\\\';\n if (tempStr.match(DOUBLE_SLASH)) {\n // eslint-disable-next-line\n tempStr = tempStr;\n }\n else {\n tempStr = tempStr.replace(SINGLE_SLASH, double);\n }\n return tempStr;\n}\n/**\n *\n * @param {string} str ?\n * @param {string} nameSpaceNew ?\n * @param {string[]} keys ?\n * @param {boolean} ignorePrefix ?\n * @returns {string} ?\n */\nfunction HandleSpecialCharArrObj(str, nameSpaceNew, keys, ignorePrefix) {\n str = str.trim();\n var windowFunc = /\\window\\./gm;\n if (!windowFunc.test(str)) {\n var quotes = /'|\"/gm;\n var splRegexp = /@|\\$|#/gm;\n if (splRegexp.test(str)) {\n str = NameSpaceForspecialChar(str, (keys.indexOf(str) === -1), nameSpaceNew, keys) + '\"]';\n }\n if (ARR_OBJ.test(str)) {\n return NameSpaceArrObj(str, !(quotes.test(str)) && (keys.indexOf(str) === -1), nameSpaceNew, keys);\n }\n else {\n return addNameSpace(str, !(quotes.test(str)) && (keys.indexOf(str) === -1), nameSpaceNew, keys, ignorePrefix);\n }\n }\n else {\n return str;\n }\n}\n","/**\n * Template Engine Bridge\n */\nimport { compile as render } from './template';\nimport { createElement } from './dom';\nimport { isNullOrUndefined, isBlazor } from './util';\nvar HAS_ROW = /^[\\n\\r.]+ 0) {\n elements.forEach(function (element) {\n detach(element);\n });\n }\n else {\n return;\n }\n };\n SanitizeHtmlHelper.removeJsEvents = function () {\n var elements = this.wrapElement.querySelectorAll('[' + jsEvents.join('],[') + ']');\n if (elements.length > 0) {\n elements.forEach(function (element) {\n jsEvents.forEach(function (attr) {\n if (element.hasAttribute(attr)) {\n element.removeAttribute(attr);\n }\n });\n });\n }\n else {\n return;\n }\n };\n SanitizeHtmlHelper.removeXssAttrs = function () {\n var _this = this;\n // eslint-disable-next-line\n this.removeAttrs.forEach(function (item, index) {\n var elements = _this.wrapElement.querySelectorAll(item.selector);\n if (elements.length > 0) {\n elements.forEach(function (element) {\n element.removeAttribute(item.attribute);\n });\n }\n });\n };\n return SanitizeHtmlHelper;\n}());\nexport { SanitizeHtmlHelper };\n","// src/utils/formatProdErrorMessage.ts\nfunction formatProdErrorMessage(code) {\n return `Minified Redux error #${code}; visit https://redux.js.org/Errors?code=${code} for the full message or use the non-minified dev environment for full errors. `;\n}\n\n// src/utils/symbol-observable.ts\nvar $$observable = /* @__PURE__ */ (() => typeof Symbol === \"function\" && Symbol.observable || \"@@observable\")();\nvar symbol_observable_default = $$observable;\n\n// src/utils/actionTypes.ts\nvar randomString = () => Math.random().toString(36).substring(7).split(\"\").join(\".\");\nvar ActionTypes = {\n INIT: `@@redux/INIT${/* @__PURE__ */ randomString()}`,\n REPLACE: `@@redux/REPLACE${/* @__PURE__ */ randomString()}`,\n PROBE_UNKNOWN_ACTION: () => `@@redux/PROBE_UNKNOWN_ACTION${randomString()}`\n};\nvar actionTypes_default = ActionTypes;\n\n// src/utils/isPlainObject.ts\nfunction isPlainObject(obj) {\n if (typeof obj !== \"object\" || obj === null)\n return false;\n let proto = obj;\n while (Object.getPrototypeOf(proto) !== null) {\n proto = Object.getPrototypeOf(proto);\n }\n return Object.getPrototypeOf(obj) === proto || Object.getPrototypeOf(obj) === null;\n}\n\n// src/utils/kindOf.ts\nfunction miniKindOf(val) {\n if (val === void 0)\n return \"undefined\";\n if (val === null)\n return \"null\";\n const type = typeof val;\n switch (type) {\n case \"boolean\":\n case \"string\":\n case \"number\":\n case \"symbol\":\n case \"function\": {\n return type;\n }\n }\n if (Array.isArray(val))\n return \"array\";\n if (isDate(val))\n return \"date\";\n if (isError(val))\n return \"error\";\n const constructorName = ctorName(val);\n switch (constructorName) {\n case \"Symbol\":\n case \"Promise\":\n case \"WeakMap\":\n case \"WeakSet\":\n case \"Map\":\n case \"Set\":\n return constructorName;\n }\n return Object.prototype.toString.call(val).slice(8, -1).toLowerCase().replace(/\\s/g, \"\");\n}\nfunction ctorName(val) {\n return typeof val.constructor === \"function\" ? val.constructor.name : null;\n}\nfunction isError(val) {\n return val instanceof Error || typeof val.message === \"string\" && val.constructor && typeof val.constructor.stackTraceLimit === \"number\";\n}\nfunction isDate(val) {\n if (val instanceof Date)\n return true;\n return typeof val.toDateString === \"function\" && typeof val.getDate === \"function\" && typeof val.setDate === \"function\";\n}\nfunction kindOf(val) {\n let typeOfVal = typeof val;\n if (process.env.NODE_ENV !== \"production\") {\n typeOfVal = miniKindOf(val);\n }\n return typeOfVal;\n}\n\n// src/createStore.ts\nfunction createStore(reducer, preloadedState, enhancer) {\n if (typeof reducer !== \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(2) : `Expected the root reducer to be a function. Instead, received: '${kindOf(reducer)}'`);\n }\n if (typeof preloadedState === \"function\" && typeof enhancer === \"function\" || typeof enhancer === \"function\" && typeof arguments[3] === \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(0) : \"It looks like you are passing several store enhancers to createStore(). This is not supported. Instead, compose them together to a single function. See https://redux.js.org/tutorials/fundamentals/part-4-store#creating-a-store-with-enhancers for an example.\");\n }\n if (typeof preloadedState === \"function\" && typeof enhancer === \"undefined\") {\n enhancer = preloadedState;\n preloadedState = void 0;\n }\n if (typeof enhancer !== \"undefined\") {\n if (typeof enhancer !== \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(1) : `Expected the enhancer to be a function. Instead, received: '${kindOf(enhancer)}'`);\n }\n return enhancer(createStore)(reducer, preloadedState);\n }\n let currentReducer = reducer;\n let currentState = preloadedState;\n let currentListeners = /* @__PURE__ */ new Map();\n let nextListeners = currentListeners;\n let listenerIdCounter = 0;\n let isDispatching = false;\n function ensureCanMutateNextListeners() {\n if (nextListeners === currentListeners) {\n nextListeners = /* @__PURE__ */ new Map();\n currentListeners.forEach((listener, key) => {\n nextListeners.set(key, listener);\n });\n }\n }\n function getState() {\n if (isDispatching) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(3) : \"You may not call store.getState() while the reducer is executing. The reducer has already received the state as an argument. Pass it down from the top reducer instead of reading it from the store.\");\n }\n return currentState;\n }\n function subscribe(listener) {\n if (typeof listener !== \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(4) : `Expected the listener to be a function. Instead, received: '${kindOf(listener)}'`);\n }\n if (isDispatching) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(5) : \"You may not call store.subscribe() while the reducer is executing. If you would like to be notified after the store has been updated, subscribe from a component and invoke store.getState() in the callback to access the latest state. See https://redux.js.org/api/store#subscribelistener for more details.\");\n }\n let isSubscribed = true;\n ensureCanMutateNextListeners();\n const listenerId = listenerIdCounter++;\n nextListeners.set(listenerId, listener);\n return function unsubscribe() {\n if (!isSubscribed) {\n return;\n }\n if (isDispatching) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(6) : \"You may not unsubscribe from a store listener while the reducer is executing. See https://redux.js.org/api/store#subscribelistener for more details.\");\n }\n isSubscribed = false;\n ensureCanMutateNextListeners();\n nextListeners.delete(listenerId);\n currentListeners = null;\n };\n }\n function dispatch(action) {\n if (!isPlainObject(action)) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(7) : `Actions must be plain objects. Instead, the actual type was: '${kindOf(action)}'. You may need to add middleware to your store setup to handle dispatching other values, such as 'redux-thunk' to handle dispatching functions. See https://redux.js.org/tutorials/fundamentals/part-4-store#middleware and https://redux.js.org/tutorials/fundamentals/part-6-async-logic#using-the-redux-thunk-middleware for examples.`);\n }\n if (typeof action.type === \"undefined\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(8) : 'Actions may not have an undefined \"type\" property. You may have misspelled an action type string constant.');\n }\n if (typeof action.type !== \"string\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(17) : `Action \"type\" property must be a string. Instead, the actual type was: '${kindOf(action.type)}'. Value was: '${action.type}' (stringified)`);\n }\n if (isDispatching) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(9) : \"Reducers may not dispatch actions.\");\n }\n try {\n isDispatching = true;\n currentState = currentReducer(currentState, action);\n } finally {\n isDispatching = false;\n }\n const listeners = currentListeners = nextListeners;\n listeners.forEach((listener) => {\n listener();\n });\n return action;\n }\n function replaceReducer(nextReducer) {\n if (typeof nextReducer !== \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(10) : `Expected the nextReducer to be a function. Instead, received: '${kindOf(nextReducer)}`);\n }\n currentReducer = nextReducer;\n dispatch({\n type: actionTypes_default.REPLACE\n });\n }\n function observable() {\n const outerSubscribe = subscribe;\n return {\n /**\n * The minimal observable subscription method.\n * @param observer Any object that can be used as an observer.\n * The observer object should have a `next` method.\n * @returns An object with an `unsubscribe` method that can\n * be used to unsubscribe the observable from the store, and prevent further\n * emission of values from the observable.\n */\n subscribe(observer) {\n if (typeof observer !== \"object\" || observer === null) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(11) : `Expected the observer to be an object. Instead, received: '${kindOf(observer)}'`);\n }\n function observeState() {\n const observerAsObserver = observer;\n if (observerAsObserver.next) {\n observerAsObserver.next(getState());\n }\n }\n observeState();\n const unsubscribe = outerSubscribe(observeState);\n return {\n unsubscribe\n };\n },\n [symbol_observable_default]() {\n return this;\n }\n };\n }\n dispatch({\n type: actionTypes_default.INIT\n });\n const store = {\n dispatch,\n subscribe,\n getState,\n replaceReducer,\n [symbol_observable_default]: observable\n };\n return store;\n}\nfunction legacy_createStore(reducer, preloadedState, enhancer) {\n return createStore(reducer, preloadedState, enhancer);\n}\n\n// src/utils/warning.ts\nfunction warning(message) {\n if (typeof console !== \"undefined\" && typeof console.error === \"function\") {\n console.error(message);\n }\n try {\n throw new Error(message);\n } catch (e) {\n }\n}\n\n// src/combineReducers.ts\nfunction getUnexpectedStateShapeWarningMessage(inputState, reducers, action, unexpectedKeyCache) {\n const reducerKeys = Object.keys(reducers);\n const argumentName = action && action.type === actionTypes_default.INIT ? \"preloadedState argument passed to createStore\" : \"previous state received by the reducer\";\n if (reducerKeys.length === 0) {\n return \"Store does not have a valid reducer. Make sure the argument passed to combineReducers is an object whose values are reducers.\";\n }\n if (!isPlainObject(inputState)) {\n return `The ${argumentName} has unexpected type of \"${kindOf(inputState)}\". Expected argument to be an object with the following keys: \"${reducerKeys.join('\", \"')}\"`;\n }\n const unexpectedKeys = Object.keys(inputState).filter((key) => !reducers.hasOwnProperty(key) && !unexpectedKeyCache[key]);\n unexpectedKeys.forEach((key) => {\n unexpectedKeyCache[key] = true;\n });\n if (action && action.type === actionTypes_default.REPLACE)\n return;\n if (unexpectedKeys.length > 0) {\n return `Unexpected ${unexpectedKeys.length > 1 ? \"keys\" : \"key\"} \"${unexpectedKeys.join('\", \"')}\" found in ${argumentName}. Expected to find one of the known reducer keys instead: \"${reducerKeys.join('\", \"')}\". Unexpected keys will be ignored.`;\n }\n}\nfunction assertReducerShape(reducers) {\n Object.keys(reducers).forEach((key) => {\n const reducer = reducers[key];\n const initialState = reducer(void 0, {\n type: actionTypes_default.INIT\n });\n if (typeof initialState === \"undefined\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(12) : `The slice reducer for key \"${key}\" returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value for this reducer, you can use null instead of undefined.`);\n }\n if (typeof reducer(void 0, {\n type: actionTypes_default.PROBE_UNKNOWN_ACTION()\n }) === \"undefined\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(13) : `The slice reducer for key \"${key}\" returned undefined when probed with a random type. Don't try to handle '${actionTypes_default.INIT}' or other actions in \"redux/*\" namespace. They are considered private. Instead, you must return the current state for any unknown actions, unless it is undefined, in which case you must return the initial state, regardless of the action type. The initial state may not be undefined, but can be null.`);\n }\n });\n}\nfunction combineReducers(reducers) {\n const reducerKeys = Object.keys(reducers);\n const finalReducers = {};\n for (let i = 0; i < reducerKeys.length; i++) {\n const key = reducerKeys[i];\n if (process.env.NODE_ENV !== \"production\") {\n if (typeof reducers[key] === \"undefined\") {\n warning(`No reducer provided for key \"${key}\"`);\n }\n }\n if (typeof reducers[key] === \"function\") {\n finalReducers[key] = reducers[key];\n }\n }\n const finalReducerKeys = Object.keys(finalReducers);\n let unexpectedKeyCache;\n if (process.env.NODE_ENV !== \"production\") {\n unexpectedKeyCache = {};\n }\n let shapeAssertionError;\n try {\n assertReducerShape(finalReducers);\n } catch (e) {\n shapeAssertionError = e;\n }\n return function combination(state = {}, action) {\n if (shapeAssertionError) {\n throw shapeAssertionError;\n }\n if (process.env.NODE_ENV !== \"production\") {\n const warningMessage = getUnexpectedStateShapeWarningMessage(state, finalReducers, action, unexpectedKeyCache);\n if (warningMessage) {\n warning(warningMessage);\n }\n }\n let hasChanged = false;\n const nextState = {};\n for (let i = 0; i < finalReducerKeys.length; i++) {\n const key = finalReducerKeys[i];\n const reducer = finalReducers[key];\n const previousStateForKey = state[key];\n const nextStateForKey = reducer(previousStateForKey, action);\n if (typeof nextStateForKey === \"undefined\") {\n const actionType = action && action.type;\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(14) : `When called with an action of type ${actionType ? `\"${String(actionType)}\"` : \"(unknown type)\"}, the slice reducer for key \"${key}\" returned undefined. To ignore an action, you must explicitly return the previous state. If you want this reducer to hold no value, you can return null instead of undefined.`);\n }\n nextState[key] = nextStateForKey;\n hasChanged = hasChanged || nextStateForKey !== previousStateForKey;\n }\n hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length;\n return hasChanged ? nextState : state;\n };\n}\n\n// src/bindActionCreators.ts\nfunction bindActionCreator(actionCreator, dispatch) {\n return function(...args) {\n return dispatch(actionCreator.apply(this, args));\n };\n}\nfunction bindActionCreators(actionCreators, dispatch) {\n if (typeof actionCreators === \"function\") {\n return bindActionCreator(actionCreators, dispatch);\n }\n if (typeof actionCreators !== \"object\" || actionCreators === null) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(16) : `bindActionCreators expected an object or a function, but instead received: '${kindOf(actionCreators)}'. Did you write \"import ActionCreators from\" instead of \"import * as ActionCreators from\"?`);\n }\n const boundActionCreators = {};\n for (const key in actionCreators) {\n const actionCreator = actionCreators[key];\n if (typeof actionCreator === \"function\") {\n boundActionCreators[key] = bindActionCreator(actionCreator, dispatch);\n }\n }\n return boundActionCreators;\n}\n\n// src/compose.ts\nfunction compose(...funcs) {\n if (funcs.length === 0) {\n return (arg) => arg;\n }\n if (funcs.length === 1) {\n return funcs[0];\n }\n return funcs.reduce((a, b) => (...args) => a(b(...args)));\n}\n\n// src/applyMiddleware.ts\nfunction applyMiddleware(...middlewares) {\n return (createStore2) => (reducer, preloadedState) => {\n const store = createStore2(reducer, preloadedState);\n let dispatch = () => {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(15) : \"Dispatching while constructing your middleware is not allowed. Other middleware would not be applied to this dispatch.\");\n };\n const middlewareAPI = {\n getState: store.getState,\n dispatch: (action, ...args) => dispatch(action, ...args)\n };\n const chain = middlewares.map((middleware) => middleware(middlewareAPI));\n dispatch = compose(...chain)(store.dispatch);\n return {\n ...store,\n dispatch\n };\n };\n}\n\n// src/utils/isAction.ts\nfunction isAction(action) {\n return isPlainObject(action) && \"type\" in action && typeof action.type === \"string\";\n}\nexport {\n actionTypes_default as __DO_NOT_USE__ActionTypes,\n applyMiddleware,\n bindActionCreators,\n combineReducers,\n compose,\n createStore,\n isAction,\n isPlainObject,\n legacy_createStore\n};\n//# sourceMappingURL=redux.mjs.map","// src/utils/env.ts\nvar NOTHING = Symbol.for(\"immer-nothing\");\nvar DRAFTABLE = Symbol.for(\"immer-draftable\");\nvar DRAFT_STATE = Symbol.for(\"immer-state\");\n\n// src/utils/errors.ts\nvar errors = process.env.NODE_ENV !== \"production\" ? [\n // All error codes, starting by 0:\n function(plugin) {\n return `The plugin for '${plugin}' has not been loaded into Immer. To enable the plugin, import and call \\`enable${plugin}()\\` when initializing your application.`;\n },\n function(thing) {\n return `produce can only be called on things that are draftable: plain objects, arrays, Map, Set or classes that are marked with '[immerable]: true'. Got '${thing}'`;\n },\n \"This object has been frozen and should not be mutated\",\n function(data) {\n return \"Cannot use a proxy that has been revoked. Did you pass an object from inside an immer function to an async process? \" + data;\n },\n \"An immer producer returned a new value *and* modified its draft. Either return a new value *or* modify the draft.\",\n \"Immer forbids circular references\",\n \"The first or second argument to `produce` must be a function\",\n \"The third argument to `produce` must be a function or undefined\",\n \"First argument to `createDraft` must be a plain object, an array, or an immerable object\",\n \"First argument to `finishDraft` must be a draft returned by `createDraft`\",\n function(thing) {\n return `'current' expects a draft, got: ${thing}`;\n },\n \"Object.defineProperty() cannot be used on an Immer draft\",\n \"Object.setPrototypeOf() cannot be used on an Immer draft\",\n \"Immer only supports deleting array indices\",\n \"Immer only supports setting array indices and the 'length' property\",\n function(thing) {\n return `'original' expects a draft, got: ${thing}`;\n }\n // Note: if more errors are added, the errorOffset in Patches.ts should be increased\n // See Patches.ts for additional errors\n] : [];\nfunction die(error, ...args) {\n if (process.env.NODE_ENV !== \"production\") {\n const e = errors[error];\n const msg = typeof e === \"function\" ? e.apply(null, args) : e;\n throw new Error(`[Immer] ${msg}`);\n }\n throw new Error(\n `[Immer] minified error nr: ${error}. Full error at: https://bit.ly/3cXEKWf`\n );\n}\n\n// src/utils/common.ts\nvar getPrototypeOf = Object.getPrototypeOf;\nfunction isDraft(value) {\n return !!value && !!value[DRAFT_STATE];\n}\nfunction isDraftable(value) {\n if (!value)\n return false;\n return isPlainObject(value) || Array.isArray(value) || !!value[DRAFTABLE] || !!value.constructor?.[DRAFTABLE] || isMap(value) || isSet(value);\n}\nvar objectCtorString = Object.prototype.constructor.toString();\nfunction isPlainObject(value) {\n if (!value || typeof value !== \"object\")\n return false;\n const proto = getPrototypeOf(value);\n if (proto === null) {\n return true;\n }\n const Ctor = Object.hasOwnProperty.call(proto, \"constructor\") && proto.constructor;\n if (Ctor === Object)\n return true;\n return typeof Ctor == \"function\" && Function.toString.call(Ctor) === objectCtorString;\n}\nfunction original(value) {\n if (!isDraft(value))\n die(15, value);\n return value[DRAFT_STATE].base_;\n}\nfunction each(obj, iter) {\n if (getArchtype(obj) === 0 /* Object */) {\n Object.entries(obj).forEach(([key, value]) => {\n iter(key, value, obj);\n });\n } else {\n obj.forEach((entry, index) => iter(index, entry, obj));\n }\n}\nfunction getArchtype(thing) {\n const state = thing[DRAFT_STATE];\n return state ? state.type_ : Array.isArray(thing) ? 1 /* Array */ : isMap(thing) ? 2 /* Map */ : isSet(thing) ? 3 /* Set */ : 0 /* Object */;\n}\nfunction has(thing, prop) {\n return getArchtype(thing) === 2 /* Map */ ? thing.has(prop) : Object.prototype.hasOwnProperty.call(thing, prop);\n}\nfunction get(thing, prop) {\n return getArchtype(thing) === 2 /* Map */ ? thing.get(prop) : thing[prop];\n}\nfunction set(thing, propOrOldValue, value) {\n const t = getArchtype(thing);\n if (t === 2 /* Map */)\n thing.set(propOrOldValue, value);\n else if (t === 3 /* Set */) {\n thing.add(value);\n } else\n thing[propOrOldValue] = value;\n}\nfunction is(x, y) {\n if (x === y) {\n return x !== 0 || 1 / x === 1 / y;\n } else {\n return x !== x && y !== y;\n }\n}\nfunction isMap(target) {\n return target instanceof Map;\n}\nfunction isSet(target) {\n return target instanceof Set;\n}\nfunction latest(state) {\n return state.copy_ || state.base_;\n}\nfunction shallowCopy(base, strict) {\n if (isMap(base)) {\n return new Map(base);\n }\n if (isSet(base)) {\n return new Set(base);\n }\n if (Array.isArray(base))\n return Array.prototype.slice.call(base);\n if (!strict && isPlainObject(base)) {\n if (!getPrototypeOf(base)) {\n const obj = /* @__PURE__ */ Object.create(null);\n return Object.assign(obj, base);\n }\n return { ...base };\n }\n const descriptors = Object.getOwnPropertyDescriptors(base);\n delete descriptors[DRAFT_STATE];\n let keys = Reflect.ownKeys(descriptors);\n for (let i = 0; i < keys.length; i++) {\n const key = keys[i];\n const desc = descriptors[key];\n if (desc.writable === false) {\n desc.writable = true;\n desc.configurable = true;\n }\n if (desc.get || desc.set)\n descriptors[key] = {\n configurable: true,\n writable: true,\n // could live with !!desc.set as well here...\n enumerable: desc.enumerable,\n value: base[key]\n };\n }\n return Object.create(getPrototypeOf(base), descriptors);\n}\nfunction freeze(obj, deep = false) {\n if (isFrozen(obj) || isDraft(obj) || !isDraftable(obj))\n return obj;\n if (getArchtype(obj) > 1) {\n obj.set = obj.add = obj.clear = obj.delete = dontMutateFrozenCollections;\n }\n Object.freeze(obj);\n if (deep)\n each(obj, (_key, value) => freeze(value, true), true);\n return obj;\n}\nfunction dontMutateFrozenCollections() {\n die(2);\n}\nfunction isFrozen(obj) {\n return Object.isFrozen(obj);\n}\n\n// src/utils/plugins.ts\nvar plugins = {};\nfunction getPlugin(pluginKey) {\n const plugin = plugins[pluginKey];\n if (!plugin) {\n die(0, pluginKey);\n }\n return plugin;\n}\nfunction loadPlugin(pluginKey, implementation) {\n if (!plugins[pluginKey])\n plugins[pluginKey] = implementation;\n}\n\n// src/core/scope.ts\nvar currentScope;\nfunction getCurrentScope() {\n return currentScope;\n}\nfunction createScope(parent_, immer_) {\n return {\n drafts_: [],\n parent_,\n immer_,\n // Whenever the modified draft contains a draft from another scope, we\n // need to prevent auto-freezing so the unowned draft can be finalized.\n canAutoFreeze_: true,\n unfinalizedDrafts_: 0\n };\n}\nfunction usePatchesInScope(scope, patchListener) {\n if (patchListener) {\n getPlugin(\"Patches\");\n scope.patches_ = [];\n scope.inversePatches_ = [];\n scope.patchListener_ = patchListener;\n }\n}\nfunction revokeScope(scope) {\n leaveScope(scope);\n scope.drafts_.forEach(revokeDraft);\n scope.drafts_ = null;\n}\nfunction leaveScope(scope) {\n if (scope === currentScope) {\n currentScope = scope.parent_;\n }\n}\nfunction enterScope(immer2) {\n return currentScope = createScope(currentScope, immer2);\n}\nfunction revokeDraft(draft) {\n const state = draft[DRAFT_STATE];\n if (state.type_ === 0 /* Object */ || state.type_ === 1 /* Array */)\n state.revoke_();\n else\n state.revoked_ = true;\n}\n\n// src/core/finalize.ts\nfunction processResult(result, scope) {\n scope.unfinalizedDrafts_ = scope.drafts_.length;\n const baseDraft = scope.drafts_[0];\n const isReplaced = result !== void 0 && result !== baseDraft;\n if (isReplaced) {\n if (baseDraft[DRAFT_STATE].modified_) {\n revokeScope(scope);\n die(4);\n }\n if (isDraftable(result)) {\n result = finalize(scope, result);\n if (!scope.parent_)\n maybeFreeze(scope, result);\n }\n if (scope.patches_) {\n getPlugin(\"Patches\").generateReplacementPatches_(\n baseDraft[DRAFT_STATE].base_,\n result,\n scope.patches_,\n scope.inversePatches_\n );\n }\n } else {\n result = finalize(scope, baseDraft, []);\n }\n revokeScope(scope);\n if (scope.patches_) {\n scope.patchListener_(scope.patches_, scope.inversePatches_);\n }\n return result !== NOTHING ? result : void 0;\n}\nfunction finalize(rootScope, value, path) {\n if (isFrozen(value))\n return value;\n const state = value[DRAFT_STATE];\n if (!state) {\n each(\n value,\n (key, childValue) => finalizeProperty(rootScope, state, value, key, childValue, path),\n true\n // See #590, don't recurse into non-enumerable of non drafted objects\n );\n return value;\n }\n if (state.scope_ !== rootScope)\n return value;\n if (!state.modified_) {\n maybeFreeze(rootScope, state.base_, true);\n return state.base_;\n }\n if (!state.finalized_) {\n state.finalized_ = true;\n state.scope_.unfinalizedDrafts_--;\n const result = state.copy_;\n let resultEach = result;\n let isSet2 = false;\n if (state.type_ === 3 /* Set */) {\n resultEach = new Set(result);\n result.clear();\n isSet2 = true;\n }\n each(\n resultEach,\n (key, childValue) => finalizeProperty(rootScope, state, result, key, childValue, path, isSet2)\n );\n maybeFreeze(rootScope, result, false);\n if (path && rootScope.patches_) {\n getPlugin(\"Patches\").generatePatches_(\n state,\n path,\n rootScope.patches_,\n rootScope.inversePatches_\n );\n }\n }\n return state.copy_;\n}\nfunction finalizeProperty(rootScope, parentState, targetObject, prop, childValue, rootPath, targetIsSet) {\n if (process.env.NODE_ENV !== \"production\" && childValue === targetObject)\n die(5);\n if (isDraft(childValue)) {\n const path = rootPath && parentState && parentState.type_ !== 3 /* Set */ && // Set objects are atomic since they have no keys.\n !has(parentState.assigned_, prop) ? rootPath.concat(prop) : void 0;\n const res = finalize(rootScope, childValue, path);\n set(targetObject, prop, res);\n if (isDraft(res)) {\n rootScope.canAutoFreeze_ = false;\n } else\n return;\n } else if (targetIsSet) {\n targetObject.add(childValue);\n }\n if (isDraftable(childValue) && !isFrozen(childValue)) {\n if (!rootScope.immer_.autoFreeze_ && rootScope.unfinalizedDrafts_ < 1) {\n return;\n }\n finalize(rootScope, childValue);\n if (!parentState || !parentState.scope_.parent_)\n maybeFreeze(rootScope, childValue);\n }\n}\nfunction maybeFreeze(scope, value, deep = false) {\n if (!scope.parent_ && scope.immer_.autoFreeze_ && scope.canAutoFreeze_) {\n freeze(value, deep);\n }\n}\n\n// src/core/proxy.ts\nfunction createProxyProxy(base, parent) {\n const isArray = Array.isArray(base);\n const state = {\n type_: isArray ? 1 /* Array */ : 0 /* Object */,\n // Track which produce call this is associated with.\n scope_: parent ? parent.scope_ : getCurrentScope(),\n // True for both shallow and deep changes.\n modified_: false,\n // Used during finalization.\n finalized_: false,\n // Track which properties have been assigned (true) or deleted (false).\n assigned_: {},\n // The parent draft state.\n parent_: parent,\n // The base state.\n base_: base,\n // The base proxy.\n draft_: null,\n // set below\n // The base copy with any updated values.\n copy_: null,\n // Called by the `produce` function.\n revoke_: null,\n isManual_: false\n };\n let target = state;\n let traps = objectTraps;\n if (isArray) {\n target = [state];\n traps = arrayTraps;\n }\n const { revoke, proxy } = Proxy.revocable(target, traps);\n state.draft_ = proxy;\n state.revoke_ = revoke;\n return proxy;\n}\nvar objectTraps = {\n get(state, prop) {\n if (prop === DRAFT_STATE)\n return state;\n const source = latest(state);\n if (!has(source, prop)) {\n return readPropFromProto(state, source, prop);\n }\n const value = source[prop];\n if (state.finalized_ || !isDraftable(value)) {\n return value;\n }\n if (value === peek(state.base_, prop)) {\n prepareCopy(state);\n return state.copy_[prop] = createProxy(value, state);\n }\n return value;\n },\n has(state, prop) {\n return prop in latest(state);\n },\n ownKeys(state) {\n return Reflect.ownKeys(latest(state));\n },\n set(state, prop, value) {\n const desc = getDescriptorFromProto(latest(state), prop);\n if (desc?.set) {\n desc.set.call(state.draft_, value);\n return true;\n }\n if (!state.modified_) {\n const current2 = peek(latest(state), prop);\n const currentState = current2?.[DRAFT_STATE];\n if (currentState && currentState.base_ === value) {\n state.copy_[prop] = value;\n state.assigned_[prop] = false;\n return true;\n }\n if (is(value, current2) && (value !== void 0 || has(state.base_, prop)))\n return true;\n prepareCopy(state);\n markChanged(state);\n }\n if (state.copy_[prop] === value && // special case: handle new props with value 'undefined'\n (value !== void 0 || prop in state.copy_) || // special case: NaN\n Number.isNaN(value) && Number.isNaN(state.copy_[prop]))\n return true;\n state.copy_[prop] = value;\n state.assigned_[prop] = true;\n return true;\n },\n deleteProperty(state, prop) {\n if (peek(state.base_, prop) !== void 0 || prop in state.base_) {\n state.assigned_[prop] = false;\n prepareCopy(state);\n markChanged(state);\n } else {\n delete state.assigned_[prop];\n }\n if (state.copy_) {\n delete state.copy_[prop];\n }\n return true;\n },\n // Note: We never coerce `desc.value` into an Immer draft, because we can't make\n // the same guarantee in ES5 mode.\n getOwnPropertyDescriptor(state, prop) {\n const owner = latest(state);\n const desc = Reflect.getOwnPropertyDescriptor(owner, prop);\n if (!desc)\n return desc;\n return {\n writable: true,\n configurable: state.type_ !== 1 /* Array */ || prop !== \"length\",\n enumerable: desc.enumerable,\n value: owner[prop]\n };\n },\n defineProperty() {\n die(11);\n },\n getPrototypeOf(state) {\n return getPrototypeOf(state.base_);\n },\n setPrototypeOf() {\n die(12);\n }\n};\nvar arrayTraps = {};\neach(objectTraps, (key, fn) => {\n arrayTraps[key] = function() {\n arguments[0] = arguments[0][0];\n return fn.apply(this, arguments);\n };\n});\narrayTraps.deleteProperty = function(state, prop) {\n if (process.env.NODE_ENV !== \"production\" && isNaN(parseInt(prop)))\n die(13);\n return arrayTraps.set.call(this, state, prop, void 0);\n};\narrayTraps.set = function(state, prop, value) {\n if (process.env.NODE_ENV !== \"production\" && prop !== \"length\" && isNaN(parseInt(prop)))\n die(14);\n return objectTraps.set.call(this, state[0], prop, value, state[0]);\n};\nfunction peek(draft, prop) {\n const state = draft[DRAFT_STATE];\n const source = state ? latest(state) : draft;\n return source[prop];\n}\nfunction readPropFromProto(state, source, prop) {\n const desc = getDescriptorFromProto(source, prop);\n return desc ? `value` in desc ? desc.value : (\n // This is a very special case, if the prop is a getter defined by the\n // prototype, we should invoke it with the draft as context!\n desc.get?.call(state.draft_)\n ) : void 0;\n}\nfunction getDescriptorFromProto(source, prop) {\n if (!(prop in source))\n return void 0;\n let proto = getPrototypeOf(source);\n while (proto) {\n const desc = Object.getOwnPropertyDescriptor(proto, prop);\n if (desc)\n return desc;\n proto = getPrototypeOf(proto);\n }\n return void 0;\n}\nfunction markChanged(state) {\n if (!state.modified_) {\n state.modified_ = true;\n if (state.parent_) {\n markChanged(state.parent_);\n }\n }\n}\nfunction prepareCopy(state) {\n if (!state.copy_) {\n state.copy_ = shallowCopy(\n state.base_,\n state.scope_.immer_.useStrictShallowCopy_\n );\n }\n}\n\n// src/core/immerClass.ts\nvar Immer2 = class {\n constructor(config) {\n this.autoFreeze_ = true;\n this.useStrictShallowCopy_ = false;\n /**\n * The `produce` function takes a value and a \"recipe function\" (whose\n * return value often depends on the base state). The recipe function is\n * free to mutate its first argument however it wants. All mutations are\n * only ever applied to a __copy__ of the base state.\n *\n * Pass only a function to create a \"curried producer\" which relieves you\n * from passing the recipe function every time.\n *\n * Only plain objects and arrays are made mutable. All other objects are\n * considered uncopyable.\n *\n * Note: This function is __bound__ to its `Immer` instance.\n *\n * @param {any} base - the initial state\n * @param {Function} recipe - function that receives a proxy of the base state as first argument and which can be freely modified\n * @param {Function} patchListener - optional function that will be called with all the patches produced here\n * @returns {any} a new state, or the initial state if nothing was modified\n */\n this.produce = (base, recipe, patchListener) => {\n if (typeof base === \"function\" && typeof recipe !== \"function\") {\n const defaultBase = recipe;\n recipe = base;\n const self = this;\n return function curriedProduce(base2 = defaultBase, ...args) {\n return self.produce(base2, (draft) => recipe.call(this, draft, ...args));\n };\n }\n if (typeof recipe !== \"function\")\n die(6);\n if (patchListener !== void 0 && typeof patchListener !== \"function\")\n die(7);\n let result;\n if (isDraftable(base)) {\n const scope = enterScope(this);\n const proxy = createProxy(base, void 0);\n let hasError = true;\n try {\n result = recipe(proxy);\n hasError = false;\n } finally {\n if (hasError)\n revokeScope(scope);\n else\n leaveScope(scope);\n }\n usePatchesInScope(scope, patchListener);\n return processResult(result, scope);\n } else if (!base || typeof base !== \"object\") {\n result = recipe(base);\n if (result === void 0)\n result = base;\n if (result === NOTHING)\n result = void 0;\n if (this.autoFreeze_)\n freeze(result, true);\n if (patchListener) {\n const p = [];\n const ip = [];\n getPlugin(\"Patches\").generateReplacementPatches_(base, result, p, ip);\n patchListener(p, ip);\n }\n return result;\n } else\n die(1, base);\n };\n this.produceWithPatches = (base, recipe) => {\n if (typeof base === \"function\") {\n return (state, ...args) => this.produceWithPatches(state, (draft) => base(draft, ...args));\n }\n let patches, inversePatches;\n const result = this.produce(base, recipe, (p, ip) => {\n patches = p;\n inversePatches = ip;\n });\n return [result, patches, inversePatches];\n };\n if (typeof config?.autoFreeze === \"boolean\")\n this.setAutoFreeze(config.autoFreeze);\n if (typeof config?.useStrictShallowCopy === \"boolean\")\n this.setUseStrictShallowCopy(config.useStrictShallowCopy);\n }\n createDraft(base) {\n if (!isDraftable(base))\n die(8);\n if (isDraft(base))\n base = current(base);\n const scope = enterScope(this);\n const proxy = createProxy(base, void 0);\n proxy[DRAFT_STATE].isManual_ = true;\n leaveScope(scope);\n return proxy;\n }\n finishDraft(draft, patchListener) {\n const state = draft && draft[DRAFT_STATE];\n if (!state || !state.isManual_)\n die(9);\n const { scope_: scope } = state;\n usePatchesInScope(scope, patchListener);\n return processResult(void 0, scope);\n }\n /**\n * Pass true to automatically freeze all copies created by Immer.\n *\n * By default, auto-freezing is enabled.\n */\n setAutoFreeze(value) {\n this.autoFreeze_ = value;\n }\n /**\n * Pass true to enable strict shallow copy.\n *\n * By default, immer does not copy the object descriptors such as getter, setter and non-enumrable properties.\n */\n setUseStrictShallowCopy(value) {\n this.useStrictShallowCopy_ = value;\n }\n applyPatches(base, patches) {\n let i;\n for (i = patches.length - 1; i >= 0; i--) {\n const patch = patches[i];\n if (patch.path.length === 0 && patch.op === \"replace\") {\n base = patch.value;\n break;\n }\n }\n if (i > -1) {\n patches = patches.slice(i + 1);\n }\n const applyPatchesImpl = getPlugin(\"Patches\").applyPatches_;\n if (isDraft(base)) {\n return applyPatchesImpl(base, patches);\n }\n return this.produce(\n base,\n (draft) => applyPatchesImpl(draft, patches)\n );\n }\n};\nfunction createProxy(value, parent) {\n const draft = isMap(value) ? getPlugin(\"MapSet\").proxyMap_(value, parent) : isSet(value) ? getPlugin(\"MapSet\").proxySet_(value, parent) : createProxyProxy(value, parent);\n const scope = parent ? parent.scope_ : getCurrentScope();\n scope.drafts_.push(draft);\n return draft;\n}\n\n// src/core/current.ts\nfunction current(value) {\n if (!isDraft(value))\n die(10, value);\n return currentImpl(value);\n}\nfunction currentImpl(value) {\n if (!isDraftable(value) || isFrozen(value))\n return value;\n const state = value[DRAFT_STATE];\n let copy;\n if (state) {\n if (!state.modified_)\n return state.base_;\n state.finalized_ = true;\n copy = shallowCopy(value, state.scope_.immer_.useStrictShallowCopy_);\n } else {\n copy = shallowCopy(value, true);\n }\n each(copy, (key, childValue) => {\n set(copy, key, currentImpl(childValue));\n });\n if (state) {\n state.finalized_ = false;\n }\n return copy;\n}\n\n// src/plugins/patches.ts\nfunction enablePatches() {\n const errorOffset = 16;\n if (process.env.NODE_ENV !== \"production\") {\n errors.push(\n 'Sets cannot have \"replace\" patches.',\n function(op) {\n return \"Unsupported patch operation: \" + op;\n },\n function(path) {\n return \"Cannot apply patch, path doesn't resolve: \" + path;\n },\n \"Patching reserved attributes like __proto__, prototype and constructor is not allowed\"\n );\n }\n const REPLACE = \"replace\";\n const ADD = \"add\";\n const REMOVE = \"remove\";\n function generatePatches_(state, basePath, patches, inversePatches) {\n switch (state.type_) {\n case 0 /* Object */:\n case 2 /* Map */:\n return generatePatchesFromAssigned(\n state,\n basePath,\n patches,\n inversePatches\n );\n case 1 /* Array */:\n return generateArrayPatches(state, basePath, patches, inversePatches);\n case 3 /* Set */:\n return generateSetPatches(\n state,\n basePath,\n patches,\n inversePatches\n );\n }\n }\n function generateArrayPatches(state, basePath, patches, inversePatches) {\n let { base_, assigned_ } = state;\n let copy_ = state.copy_;\n if (copy_.length < base_.length) {\n ;\n [base_, copy_] = [copy_, base_];\n [patches, inversePatches] = [inversePatches, patches];\n }\n for (let i = 0; i < base_.length; i++) {\n if (assigned_[i] && copy_[i] !== base_[i]) {\n const path = basePath.concat([i]);\n patches.push({\n op: REPLACE,\n path,\n // Need to maybe clone it, as it can in fact be the original value\n // due to the base/copy inversion at the start of this function\n value: clonePatchValueIfNeeded(copy_[i])\n });\n inversePatches.push({\n op: REPLACE,\n path,\n value: clonePatchValueIfNeeded(base_[i])\n });\n }\n }\n for (let i = base_.length; i < copy_.length; i++) {\n const path = basePath.concat([i]);\n patches.push({\n op: ADD,\n path,\n // Need to maybe clone it, as it can in fact be the original value\n // due to the base/copy inversion at the start of this function\n value: clonePatchValueIfNeeded(copy_[i])\n });\n }\n for (let i = copy_.length - 1; base_.length <= i; --i) {\n const path = basePath.concat([i]);\n inversePatches.push({\n op: REMOVE,\n path\n });\n }\n }\n function generatePatchesFromAssigned(state, basePath, patches, inversePatches) {\n const { base_, copy_ } = state;\n each(state.assigned_, (key, assignedValue) => {\n const origValue = get(base_, key);\n const value = get(copy_, key);\n const op = !assignedValue ? REMOVE : has(base_, key) ? REPLACE : ADD;\n if (origValue === value && op === REPLACE)\n return;\n const path = basePath.concat(key);\n patches.push(op === REMOVE ? { op, path } : { op, path, value });\n inversePatches.push(\n op === ADD ? { op: REMOVE, path } : op === REMOVE ? { op: ADD, path, value: clonePatchValueIfNeeded(origValue) } : { op: REPLACE, path, value: clonePatchValueIfNeeded(origValue) }\n );\n });\n }\n function generateSetPatches(state, basePath, patches, inversePatches) {\n let { base_, copy_ } = state;\n let i = 0;\n base_.forEach((value) => {\n if (!copy_.has(value)) {\n const path = basePath.concat([i]);\n patches.push({\n op: REMOVE,\n path,\n value\n });\n inversePatches.unshift({\n op: ADD,\n path,\n value\n });\n }\n i++;\n });\n i = 0;\n copy_.forEach((value) => {\n if (!base_.has(value)) {\n const path = basePath.concat([i]);\n patches.push({\n op: ADD,\n path,\n value\n });\n inversePatches.unshift({\n op: REMOVE,\n path,\n value\n });\n }\n i++;\n });\n }\n function generateReplacementPatches_(baseValue, replacement, patches, inversePatches) {\n patches.push({\n op: REPLACE,\n path: [],\n value: replacement === NOTHING ? void 0 : replacement\n });\n inversePatches.push({\n op: REPLACE,\n path: [],\n value: baseValue\n });\n }\n function applyPatches_(draft, patches) {\n patches.forEach((patch) => {\n const { path, op } = patch;\n let base = draft;\n for (let i = 0; i < path.length - 1; i++) {\n const parentType = getArchtype(base);\n let p = path[i];\n if (typeof p !== \"string\" && typeof p !== \"number\") {\n p = \"\" + p;\n }\n if ((parentType === 0 /* Object */ || parentType === 1 /* Array */) && (p === \"__proto__\" || p === \"constructor\"))\n die(errorOffset + 3);\n if (typeof base === \"function\" && p === \"prototype\")\n die(errorOffset + 3);\n base = get(base, p);\n if (typeof base !== \"object\")\n die(errorOffset + 2, path.join(\"/\"));\n }\n const type = getArchtype(base);\n const value = deepClonePatchValue(patch.value);\n const key = path[path.length - 1];\n switch (op) {\n case REPLACE:\n switch (type) {\n case 2 /* Map */:\n return base.set(key, value);\n case 3 /* Set */:\n die(errorOffset);\n default:\n return base[key] = value;\n }\n case ADD:\n switch (type) {\n case 1 /* Array */:\n return key === \"-\" ? base.push(value) : base.splice(key, 0, value);\n case 2 /* Map */:\n return base.set(key, value);\n case 3 /* Set */:\n return base.add(value);\n default:\n return base[key] = value;\n }\n case REMOVE:\n switch (type) {\n case 1 /* Array */:\n return base.splice(key, 1);\n case 2 /* Map */:\n return base.delete(key);\n case 3 /* Set */:\n return base.delete(patch.value);\n default:\n return delete base[key];\n }\n default:\n die(errorOffset + 1, op);\n }\n });\n return draft;\n }\n function deepClonePatchValue(obj) {\n if (!isDraftable(obj))\n return obj;\n if (Array.isArray(obj))\n return obj.map(deepClonePatchValue);\n if (isMap(obj))\n return new Map(\n Array.from(obj.entries()).map(([k, v]) => [k, deepClonePatchValue(v)])\n );\n if (isSet(obj))\n return new Set(Array.from(obj).map(deepClonePatchValue));\n const cloned = Object.create(getPrototypeOf(obj));\n for (const key in obj)\n cloned[key] = deepClonePatchValue(obj[key]);\n if (has(obj, DRAFTABLE))\n cloned[DRAFTABLE] = obj[DRAFTABLE];\n return cloned;\n }\n function clonePatchValueIfNeeded(obj) {\n if (isDraft(obj)) {\n return deepClonePatchValue(obj);\n } else\n return obj;\n }\n loadPlugin(\"Patches\", {\n applyPatches_,\n generatePatches_,\n generateReplacementPatches_\n });\n}\n\n// src/plugins/mapset.ts\nfunction enableMapSet() {\n class DraftMap extends Map {\n constructor(target, parent) {\n super();\n this[DRAFT_STATE] = {\n type_: 2 /* Map */,\n parent_: parent,\n scope_: parent ? parent.scope_ : getCurrentScope(),\n modified_: false,\n finalized_: false,\n copy_: void 0,\n assigned_: void 0,\n base_: target,\n draft_: this,\n isManual_: false,\n revoked_: false\n };\n }\n get size() {\n return latest(this[DRAFT_STATE]).size;\n }\n has(key) {\n return latest(this[DRAFT_STATE]).has(key);\n }\n set(key, value) {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n if (!latest(state).has(key) || latest(state).get(key) !== value) {\n prepareMapCopy(state);\n markChanged(state);\n state.assigned_.set(key, true);\n state.copy_.set(key, value);\n state.assigned_.set(key, true);\n }\n return this;\n }\n delete(key) {\n if (!this.has(key)) {\n return false;\n }\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n prepareMapCopy(state);\n markChanged(state);\n if (state.base_.has(key)) {\n state.assigned_.set(key, false);\n } else {\n state.assigned_.delete(key);\n }\n state.copy_.delete(key);\n return true;\n }\n clear() {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n if (latest(state).size) {\n prepareMapCopy(state);\n markChanged(state);\n state.assigned_ = /* @__PURE__ */ new Map();\n each(state.base_, (key) => {\n state.assigned_.set(key, false);\n });\n state.copy_.clear();\n }\n }\n forEach(cb, thisArg) {\n const state = this[DRAFT_STATE];\n latest(state).forEach((_value, key, _map) => {\n cb.call(thisArg, this.get(key), key, this);\n });\n }\n get(key) {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n const value = latest(state).get(key);\n if (state.finalized_ || !isDraftable(value)) {\n return value;\n }\n if (value !== state.base_.get(key)) {\n return value;\n }\n const draft = createProxy(value, state);\n prepareMapCopy(state);\n state.copy_.set(key, draft);\n return draft;\n }\n keys() {\n return latest(this[DRAFT_STATE]).keys();\n }\n values() {\n const iterator = this.keys();\n return {\n [Symbol.iterator]: () => this.values(),\n next: () => {\n const r = iterator.next();\n if (r.done)\n return r;\n const value = this.get(r.value);\n return {\n done: false,\n value\n };\n }\n };\n }\n entries() {\n const iterator = this.keys();\n return {\n [Symbol.iterator]: () => this.entries(),\n next: () => {\n const r = iterator.next();\n if (r.done)\n return r;\n const value = this.get(r.value);\n return {\n done: false,\n value: [r.value, value]\n };\n }\n };\n }\n [(DRAFT_STATE, Symbol.iterator)]() {\n return this.entries();\n }\n }\n function proxyMap_(target, parent) {\n return new DraftMap(target, parent);\n }\n function prepareMapCopy(state) {\n if (!state.copy_) {\n state.assigned_ = /* @__PURE__ */ new Map();\n state.copy_ = new Map(state.base_);\n }\n }\n class DraftSet extends Set {\n constructor(target, parent) {\n super();\n this[DRAFT_STATE] = {\n type_: 3 /* Set */,\n parent_: parent,\n scope_: parent ? parent.scope_ : getCurrentScope(),\n modified_: false,\n finalized_: false,\n copy_: void 0,\n base_: target,\n draft_: this,\n drafts_: /* @__PURE__ */ new Map(),\n revoked_: false,\n isManual_: false\n };\n }\n get size() {\n return latest(this[DRAFT_STATE]).size;\n }\n has(value) {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n if (!state.copy_) {\n return state.base_.has(value);\n }\n if (state.copy_.has(value))\n return true;\n if (state.drafts_.has(value) && state.copy_.has(state.drafts_.get(value)))\n return true;\n return false;\n }\n add(value) {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n if (!this.has(value)) {\n prepareSetCopy(state);\n markChanged(state);\n state.copy_.add(value);\n }\n return this;\n }\n delete(value) {\n if (!this.has(value)) {\n return false;\n }\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n prepareSetCopy(state);\n markChanged(state);\n return state.copy_.delete(value) || (state.drafts_.has(value) ? state.copy_.delete(state.drafts_.get(value)) : (\n /* istanbul ignore next */\n false\n ));\n }\n clear() {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n if (latest(state).size) {\n prepareSetCopy(state);\n markChanged(state);\n state.copy_.clear();\n }\n }\n values() {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n prepareSetCopy(state);\n return state.copy_.values();\n }\n entries() {\n const state = this[DRAFT_STATE];\n assertUnrevoked(state);\n prepareSetCopy(state);\n return state.copy_.entries();\n }\n keys() {\n return this.values();\n }\n [(DRAFT_STATE, Symbol.iterator)]() {\n return this.values();\n }\n forEach(cb, thisArg) {\n const iterator = this.values();\n let result = iterator.next();\n while (!result.done) {\n cb.call(thisArg, result.value, result.value, this);\n result = iterator.next();\n }\n }\n }\n function proxySet_(target, parent) {\n return new DraftSet(target, parent);\n }\n function prepareSetCopy(state) {\n if (!state.copy_) {\n state.copy_ = /* @__PURE__ */ new Set();\n state.base_.forEach((value) => {\n if (isDraftable(value)) {\n const draft = createProxy(value, state);\n state.drafts_.set(value, draft);\n state.copy_.add(draft);\n } else {\n state.copy_.add(value);\n }\n });\n }\n }\n function assertUnrevoked(state) {\n if (state.revoked_)\n die(3, JSON.stringify(latest(state)));\n }\n loadPlugin(\"MapSet\", { proxyMap_, proxySet_ });\n}\n\n// src/immer.ts\nvar immer = new Immer2();\nvar produce = immer.produce;\nvar produceWithPatches = immer.produceWithPatches.bind(\n immer\n);\nvar setAutoFreeze = immer.setAutoFreeze.bind(immer);\nvar setUseStrictShallowCopy = immer.setUseStrictShallowCopy.bind(immer);\nvar applyPatches = immer.applyPatches.bind(immer);\nvar createDraft = immer.createDraft.bind(immer);\nvar finishDraft = immer.finishDraft.bind(immer);\nfunction castDraft(value) {\n return value;\n}\nfunction castImmutable(value) {\n return value;\n}\nexport {\n Immer2 as Immer,\n applyPatches,\n castDraft,\n castImmutable,\n createDraft,\n current,\n enableMapSet,\n enablePatches,\n finishDraft,\n freeze,\n DRAFTABLE as immerable,\n isDraft,\n isDraftable,\n NOTHING as nothing,\n original,\n produce,\n produceWithPatches,\n setAutoFreeze,\n setUseStrictShallowCopy\n};\n//# sourceMappingURL=immer.mjs.map","// src/devModeChecks/identityFunctionCheck.ts\nvar runIdentityFunctionCheck = (resultFunc, inputSelectorsResults, outputSelectorResult) => {\n if (inputSelectorsResults.length === 1 && inputSelectorsResults[0] === outputSelectorResult) {\n let isInputSameAsOutput = false;\n try {\n const emptyObject = {};\n if (resultFunc(emptyObject) === emptyObject)\n isInputSameAsOutput = true;\n } catch {\n }\n if (isInputSameAsOutput) {\n let stack = void 0;\n try {\n throw new Error();\n } catch (e) {\n ;\n ({ stack } = e);\n }\n console.warn(\n \"The result function returned its own inputs without modification. e.g\\n`createSelector([state => state.todos], todos => todos)`\\nThis could lead to inefficient memoization and unnecessary re-renders.\\nEnsure transformation logic is in the result function, and extraction logic is in the input selectors.\",\n { stack }\n );\n }\n }\n};\n\n// src/devModeChecks/inputStabilityCheck.ts\nvar runInputStabilityCheck = (inputSelectorResultsObject, options, inputSelectorArgs) => {\n const { memoize, memoizeOptions } = options;\n const { inputSelectorResults, inputSelectorResultsCopy } = inputSelectorResultsObject;\n const createAnEmptyObject = memoize(() => ({}), ...memoizeOptions);\n const areInputSelectorResultsEqual = createAnEmptyObject.apply(null, inputSelectorResults) === createAnEmptyObject.apply(null, inputSelectorResultsCopy);\n if (!areInputSelectorResultsEqual) {\n let stack = void 0;\n try {\n throw new Error();\n } catch (e) {\n ;\n ({ stack } = e);\n }\n console.warn(\n \"An input selector returned a different result when passed same arguments.\\nThis means your output selector will likely run more frequently than intended.\\nAvoid returning a new reference inside your input selector, e.g.\\n`createSelector([state => state.todos.map(todo => todo.id)], todoIds => todoIds.length)`\",\n {\n arguments: inputSelectorArgs,\n firstInputs: inputSelectorResults,\n secondInputs: inputSelectorResultsCopy,\n stack\n }\n );\n }\n};\n\n// src/devModeChecks/setGlobalDevModeChecks.ts\nvar globalDevModeChecks = {\n inputStabilityCheck: \"once\",\n identityFunctionCheck: \"once\"\n};\nvar setGlobalDevModeChecks = (devModeChecks) => {\n Object.assign(globalDevModeChecks, devModeChecks);\n};\n\n// src/utils.ts\nvar NOT_FOUND = \"NOT_FOUND\";\nfunction assertIsFunction(func, errorMessage = `expected a function, instead received ${typeof func}`) {\n if (typeof func !== \"function\") {\n throw new TypeError(errorMessage);\n }\n}\nfunction assertIsObject(object, errorMessage = `expected an object, instead received ${typeof object}`) {\n if (typeof object !== \"object\") {\n throw new TypeError(errorMessage);\n }\n}\nfunction assertIsArrayOfFunctions(array, errorMessage = `expected all items to be functions, instead received the following types: `) {\n if (!array.every((item) => typeof item === \"function\")) {\n const itemTypes = array.map(\n (item) => typeof item === \"function\" ? `function ${item.name || \"unnamed\"}()` : typeof item\n ).join(\", \");\n throw new TypeError(`${errorMessage}[${itemTypes}]`);\n }\n}\nvar ensureIsArray = (item) => {\n return Array.isArray(item) ? item : [item];\n};\nfunction getDependencies(createSelectorArgs) {\n const dependencies = Array.isArray(createSelectorArgs[0]) ? createSelectorArgs[0] : createSelectorArgs;\n assertIsArrayOfFunctions(\n dependencies,\n `createSelector expects all input-selectors to be functions, but received the following types: `\n );\n return dependencies;\n}\nfunction collectInputSelectorResults(dependencies, inputSelectorArgs) {\n const inputSelectorResults = [];\n const { length } = dependencies;\n for (let i = 0; i < length; i++) {\n inputSelectorResults.push(dependencies[i].apply(null, inputSelectorArgs));\n }\n return inputSelectorResults;\n}\nvar getDevModeChecksExecutionInfo = (firstRun, devModeChecks) => {\n const { identityFunctionCheck, inputStabilityCheck } = {\n ...globalDevModeChecks,\n ...devModeChecks\n };\n return {\n identityFunctionCheck: {\n shouldRun: identityFunctionCheck === \"always\" || identityFunctionCheck === \"once\" && firstRun,\n run: runIdentityFunctionCheck\n },\n inputStabilityCheck: {\n shouldRun: inputStabilityCheck === \"always\" || inputStabilityCheck === \"once\" && firstRun,\n run: runInputStabilityCheck\n }\n };\n};\n\n// src/autotrackMemoize/autotracking.ts\nvar $REVISION = 0;\nvar CURRENT_TRACKER = null;\nvar Cell = class {\n revision = $REVISION;\n _value;\n _lastValue;\n _isEqual = tripleEq;\n constructor(initialValue, isEqual = tripleEq) {\n this._value = this._lastValue = initialValue;\n this._isEqual = isEqual;\n }\n // Whenever a storage value is read, it'll add itself to the current tracker if\n // one exists, entangling its state with that cache.\n get value() {\n CURRENT_TRACKER?.add(this);\n return this._value;\n }\n // Whenever a storage value is updated, we bump the global revision clock,\n // assign the revision for this storage to the new value, _and_ we schedule a\n // rerender. This is important, and it's what makes autotracking _pull_\n // based. We don't actively tell the caches which depend on the storage that\n // anything has happened. Instead, we recompute the caches when needed.\n set value(newValue) {\n if (this.value === newValue)\n return;\n this._value = newValue;\n this.revision = ++$REVISION;\n }\n};\nfunction tripleEq(a, b) {\n return a === b;\n}\nvar TrackingCache = class {\n _cachedValue;\n _cachedRevision = -1;\n _deps = [];\n hits = 0;\n fn;\n constructor(fn) {\n this.fn = fn;\n }\n clear() {\n this._cachedValue = void 0;\n this._cachedRevision = -1;\n this._deps = [];\n this.hits = 0;\n }\n get value() {\n if (this.revision > this._cachedRevision) {\n const { fn } = this;\n const currentTracker = /* @__PURE__ */ new Set();\n const prevTracker = CURRENT_TRACKER;\n CURRENT_TRACKER = currentTracker;\n this._cachedValue = fn();\n CURRENT_TRACKER = prevTracker;\n this.hits++;\n this._deps = Array.from(currentTracker);\n this._cachedRevision = this.revision;\n }\n CURRENT_TRACKER?.add(this);\n return this._cachedValue;\n }\n get revision() {\n return Math.max(...this._deps.map((d) => d.revision), 0);\n }\n};\nfunction getValue(cell) {\n if (!(cell instanceof Cell)) {\n console.warn(\"Not a valid cell! \", cell);\n }\n return cell.value;\n}\nfunction setValue(storage, value) {\n if (!(storage instanceof Cell)) {\n throw new TypeError(\n \"setValue must be passed a tracked store created with `createStorage`.\"\n );\n }\n storage.value = storage._lastValue = value;\n}\nfunction createCell(initialValue, isEqual = tripleEq) {\n return new Cell(initialValue, isEqual);\n}\nfunction createCache(fn) {\n assertIsFunction(\n fn,\n \"the first parameter to `createCache` must be a function\"\n );\n return new TrackingCache(fn);\n}\n\n// src/autotrackMemoize/tracking.ts\nvar neverEq = (a, b) => false;\nfunction createTag() {\n return createCell(null, neverEq);\n}\nfunction dirtyTag(tag, value) {\n setValue(tag, value);\n}\nvar consumeCollection = (node) => {\n let tag = node.collectionTag;\n if (tag === null) {\n tag = node.collectionTag = createTag();\n }\n getValue(tag);\n};\nvar dirtyCollection = (node) => {\n const tag = node.collectionTag;\n if (tag !== null) {\n dirtyTag(tag, null);\n }\n};\n\n// src/autotrackMemoize/proxy.ts\nvar REDUX_PROXY_LABEL = Symbol();\nvar nextId = 0;\nvar proto = Object.getPrototypeOf({});\nvar ObjectTreeNode = class {\n constructor(value) {\n this.value = value;\n this.value = value;\n this.tag.value = value;\n }\n proxy = new Proxy(this, objectProxyHandler);\n tag = createTag();\n tags = {};\n children = {};\n collectionTag = null;\n id = nextId++;\n};\nvar objectProxyHandler = {\n get(node, key) {\n function calculateResult() {\n const { value } = node;\n const childValue = Reflect.get(value, key);\n if (typeof key === \"symbol\") {\n return childValue;\n }\n if (key in proto) {\n return childValue;\n }\n if (typeof childValue === \"object\" && childValue !== null) {\n let childNode = node.children[key];\n if (childNode === void 0) {\n childNode = node.children[key] = createNode(childValue);\n }\n if (childNode.tag) {\n getValue(childNode.tag);\n }\n return childNode.proxy;\n } else {\n let tag = node.tags[key];\n if (tag === void 0) {\n tag = node.tags[key] = createTag();\n tag.value = childValue;\n }\n getValue(tag);\n return childValue;\n }\n }\n const res = calculateResult();\n return res;\n },\n ownKeys(node) {\n consumeCollection(node);\n return Reflect.ownKeys(node.value);\n },\n getOwnPropertyDescriptor(node, prop) {\n return Reflect.getOwnPropertyDescriptor(node.value, prop);\n },\n has(node, prop) {\n return Reflect.has(node.value, prop);\n }\n};\nvar ArrayTreeNode = class {\n constructor(value) {\n this.value = value;\n this.value = value;\n this.tag.value = value;\n }\n proxy = new Proxy([this], arrayProxyHandler);\n tag = createTag();\n tags = {};\n children = {};\n collectionTag = null;\n id = nextId++;\n};\nvar arrayProxyHandler = {\n get([node], key) {\n if (key === \"length\") {\n consumeCollection(node);\n }\n return objectProxyHandler.get(node, key);\n },\n ownKeys([node]) {\n return objectProxyHandler.ownKeys(node);\n },\n getOwnPropertyDescriptor([node], prop) {\n return objectProxyHandler.getOwnPropertyDescriptor(node, prop);\n },\n has([node], prop) {\n return objectProxyHandler.has(node, prop);\n }\n};\nfunction createNode(value) {\n if (Array.isArray(value)) {\n return new ArrayTreeNode(value);\n }\n return new ObjectTreeNode(value);\n}\nfunction updateNode(node, newValue) {\n const { value, tags, children } = node;\n node.value = newValue;\n if (Array.isArray(value) && Array.isArray(newValue) && value.length !== newValue.length) {\n dirtyCollection(node);\n } else {\n if (value !== newValue) {\n let oldKeysSize = 0;\n let newKeysSize = 0;\n let anyKeysAdded = false;\n for (const _key in value) {\n oldKeysSize++;\n }\n for (const key in newValue) {\n newKeysSize++;\n if (!(key in value)) {\n anyKeysAdded = true;\n break;\n }\n }\n const isDifferent = anyKeysAdded || oldKeysSize !== newKeysSize;\n if (isDifferent) {\n dirtyCollection(node);\n }\n }\n }\n for (const key in tags) {\n const childValue = value[key];\n const newChildValue = newValue[key];\n if (childValue !== newChildValue) {\n dirtyCollection(node);\n dirtyTag(tags[key], newChildValue);\n }\n if (typeof newChildValue === \"object\" && newChildValue !== null) {\n delete tags[key];\n }\n }\n for (const key in children) {\n const childNode = children[key];\n const newChildValue = newValue[key];\n const childValue = childNode.value;\n if (childValue === newChildValue) {\n continue;\n } else if (typeof newChildValue === \"object\" && newChildValue !== null) {\n updateNode(childNode, newChildValue);\n } else {\n deleteNode(childNode);\n delete children[key];\n }\n }\n}\nfunction deleteNode(node) {\n if (node.tag) {\n dirtyTag(node.tag, null);\n }\n dirtyCollection(node);\n for (const key in node.tags) {\n dirtyTag(node.tags[key], null);\n }\n for (const key in node.children) {\n deleteNode(node.children[key]);\n }\n}\n\n// src/lruMemoize.ts\nfunction createSingletonCache(equals) {\n let entry;\n return {\n get(key) {\n if (entry && equals(entry.key, key)) {\n return entry.value;\n }\n return NOT_FOUND;\n },\n put(key, value) {\n entry = { key, value };\n },\n getEntries() {\n return entry ? [entry] : [];\n },\n clear() {\n entry = void 0;\n }\n };\n}\nfunction createLruCache(maxSize, equals) {\n let entries = [];\n function get(key) {\n const cacheIndex = entries.findIndex((entry) => equals(key, entry.key));\n if (cacheIndex > -1) {\n const entry = entries[cacheIndex];\n if (cacheIndex > 0) {\n entries.splice(cacheIndex, 1);\n entries.unshift(entry);\n }\n return entry.value;\n }\n return NOT_FOUND;\n }\n function put(key, value) {\n if (get(key) === NOT_FOUND) {\n entries.unshift({ key, value });\n if (entries.length > maxSize) {\n entries.pop();\n }\n }\n }\n function getEntries() {\n return entries;\n }\n function clear() {\n entries = [];\n }\n return { get, put, getEntries, clear };\n}\nvar referenceEqualityCheck = (a, b) => a === b;\nfunction createCacheKeyComparator(equalityCheck) {\n return function areArgumentsShallowlyEqual(prev, next) {\n if (prev === null || next === null || prev.length !== next.length) {\n return false;\n }\n const { length } = prev;\n for (let i = 0; i < length; i++) {\n if (!equalityCheck(prev[i], next[i])) {\n return false;\n }\n }\n return true;\n };\n}\nfunction lruMemoize(func, equalityCheckOrOptions) {\n const providedOptions = typeof equalityCheckOrOptions === \"object\" ? equalityCheckOrOptions : { equalityCheck: equalityCheckOrOptions };\n const {\n equalityCheck = referenceEqualityCheck,\n maxSize = 1,\n resultEqualityCheck\n } = providedOptions;\n const comparator = createCacheKeyComparator(equalityCheck);\n let resultsCount = 0;\n const cache = maxSize === 1 ? createSingletonCache(comparator) : createLruCache(maxSize, comparator);\n function memoized() {\n let value = cache.get(arguments);\n if (value === NOT_FOUND) {\n value = func.apply(null, arguments);\n resultsCount++;\n if (resultEqualityCheck) {\n const entries = cache.getEntries();\n const matchingEntry = entries.find(\n (entry) => resultEqualityCheck(entry.value, value)\n );\n if (matchingEntry) {\n value = matchingEntry.value;\n resultsCount !== 0 && resultsCount--;\n }\n }\n cache.put(arguments, value);\n }\n return value;\n }\n memoized.clearCache = () => {\n cache.clear();\n memoized.resetResultsCount();\n };\n memoized.resultsCount = () => resultsCount;\n memoized.resetResultsCount = () => {\n resultsCount = 0;\n };\n return memoized;\n}\n\n// src/autotrackMemoize/autotrackMemoize.ts\nfunction autotrackMemoize(func) {\n const node = createNode(\n []\n );\n let lastArgs = null;\n const shallowEqual = createCacheKeyComparator(referenceEqualityCheck);\n const cache = createCache(() => {\n const res = func.apply(null, node.proxy);\n return res;\n });\n function memoized() {\n if (!shallowEqual(lastArgs, arguments)) {\n updateNode(node, arguments);\n lastArgs = arguments;\n }\n return cache.value;\n }\n memoized.clearCache = () => {\n return cache.clear();\n };\n return memoized;\n}\n\n// src/weakMapMemoize.ts\nvar StrongRef = class {\n constructor(value) {\n this.value = value;\n }\n deref() {\n return this.value;\n }\n};\nvar Ref = typeof WeakRef !== \"undefined\" ? WeakRef : StrongRef;\nvar UNTERMINATED = 0;\nvar TERMINATED = 1;\nfunction createCacheNode() {\n return {\n s: UNTERMINATED,\n v: void 0,\n o: null,\n p: null\n };\n}\nfunction weakMapMemoize(func, options = {}) {\n let fnNode = createCacheNode();\n const { resultEqualityCheck } = options;\n let lastResult;\n let resultsCount = 0;\n function memoized() {\n let cacheNode = fnNode;\n const { length } = arguments;\n for (let i = 0, l = length; i < l; i++) {\n const arg = arguments[i];\n if (typeof arg === \"function\" || typeof arg === \"object\" && arg !== null) {\n let objectCache = cacheNode.o;\n if (objectCache === null) {\n cacheNode.o = objectCache = /* @__PURE__ */ new WeakMap();\n }\n const objectNode = objectCache.get(arg);\n if (objectNode === void 0) {\n cacheNode = createCacheNode();\n objectCache.set(arg, cacheNode);\n } else {\n cacheNode = objectNode;\n }\n } else {\n let primitiveCache = cacheNode.p;\n if (primitiveCache === null) {\n cacheNode.p = primitiveCache = /* @__PURE__ */ new Map();\n }\n const primitiveNode = primitiveCache.get(arg);\n if (primitiveNode === void 0) {\n cacheNode = createCacheNode();\n primitiveCache.set(arg, cacheNode);\n } else {\n cacheNode = primitiveNode;\n }\n }\n }\n const terminatedNode = cacheNode;\n let result;\n if (cacheNode.s === TERMINATED) {\n result = cacheNode.v;\n } else {\n result = func.apply(null, arguments);\n resultsCount++;\n }\n terminatedNode.s = TERMINATED;\n if (resultEqualityCheck) {\n const lastResultValue = lastResult?.deref?.() ?? lastResult;\n if (lastResultValue != null && resultEqualityCheck(lastResultValue, result)) {\n result = lastResultValue;\n resultsCount !== 0 && resultsCount--;\n }\n const needsWeakRef = typeof result === \"object\" && result !== null || typeof result === \"function\";\n lastResult = needsWeakRef ? new Ref(result) : result;\n }\n terminatedNode.v = result;\n return result;\n }\n memoized.clearCache = () => {\n fnNode = createCacheNode();\n memoized.resetResultsCount();\n };\n memoized.resultsCount = () => resultsCount;\n memoized.resetResultsCount = () => {\n resultsCount = 0;\n };\n return memoized;\n}\n\n// src/createSelectorCreator.ts\nfunction createSelectorCreator(memoizeOrOptions, ...memoizeOptionsFromArgs) {\n const createSelectorCreatorOptions = typeof memoizeOrOptions === \"function\" ? {\n memoize: memoizeOrOptions,\n memoizeOptions: memoizeOptionsFromArgs\n } : memoizeOrOptions;\n const createSelector2 = (...createSelectorArgs) => {\n let recomputations = 0;\n let dependencyRecomputations = 0;\n let lastResult;\n let directlyPassedOptions = {};\n let resultFunc = createSelectorArgs.pop();\n if (typeof resultFunc === \"object\") {\n directlyPassedOptions = resultFunc;\n resultFunc = createSelectorArgs.pop();\n }\n assertIsFunction(\n resultFunc,\n `createSelector expects an output function after the inputs, but received: [${typeof resultFunc}]`\n );\n const combinedOptions = {\n ...createSelectorCreatorOptions,\n ...directlyPassedOptions\n };\n const {\n memoize,\n memoizeOptions = [],\n argsMemoize = weakMapMemoize,\n argsMemoizeOptions = [],\n devModeChecks = {}\n } = combinedOptions;\n const finalMemoizeOptions = ensureIsArray(memoizeOptions);\n const finalArgsMemoizeOptions = ensureIsArray(argsMemoizeOptions);\n const dependencies = getDependencies(createSelectorArgs);\n const memoizedResultFunc = memoize(function recomputationWrapper() {\n recomputations++;\n return resultFunc.apply(\n null,\n arguments\n );\n }, ...finalMemoizeOptions);\n let firstRun = true;\n const selector = argsMemoize(function dependenciesChecker() {\n dependencyRecomputations++;\n const inputSelectorResults = collectInputSelectorResults(\n dependencies,\n arguments\n );\n lastResult = memoizedResultFunc.apply(null, inputSelectorResults);\n if (process.env.NODE_ENV !== \"production\") {\n const { identityFunctionCheck, inputStabilityCheck } = getDevModeChecksExecutionInfo(firstRun, devModeChecks);\n if (identityFunctionCheck.shouldRun) {\n identityFunctionCheck.run(\n resultFunc,\n inputSelectorResults,\n lastResult\n );\n }\n if (inputStabilityCheck.shouldRun) {\n const inputSelectorResultsCopy = collectInputSelectorResults(\n dependencies,\n arguments\n );\n inputStabilityCheck.run(\n { inputSelectorResults, inputSelectorResultsCopy },\n { memoize, memoizeOptions: finalMemoizeOptions },\n arguments\n );\n }\n if (firstRun)\n firstRun = false;\n }\n return lastResult;\n }, ...finalArgsMemoizeOptions);\n return Object.assign(selector, {\n resultFunc,\n memoizedResultFunc,\n dependencies,\n dependencyRecomputations: () => dependencyRecomputations,\n resetDependencyRecomputations: () => {\n dependencyRecomputations = 0;\n },\n lastResult: () => lastResult,\n recomputations: () => recomputations,\n resetRecomputations: () => {\n recomputations = 0;\n },\n memoize,\n argsMemoize\n });\n };\n Object.assign(createSelector2, {\n withTypes: () => createSelector2\n });\n return createSelector2;\n}\nvar createSelector = /* @__PURE__ */ createSelectorCreator(weakMapMemoize);\n\n// src/createStructuredSelector.ts\nvar createStructuredSelector = Object.assign(\n (inputSelectorsObject, selectorCreator = createSelector) => {\n assertIsObject(\n inputSelectorsObject,\n `createStructuredSelector expects first argument to be an object where each property is a selector, instead received a ${typeof inputSelectorsObject}`\n );\n const inputSelectorKeys = Object.keys(inputSelectorsObject);\n const dependencies = inputSelectorKeys.map(\n (key) => inputSelectorsObject[key]\n );\n const structuredSelector = selectorCreator(\n dependencies,\n (...inputSelectorResults) => {\n return inputSelectorResults.reduce((composition, value, index) => {\n composition[inputSelectorKeys[index]] = value;\n return composition;\n }, {});\n }\n );\n return structuredSelector;\n },\n { withTypes: () => createStructuredSelector }\n);\nexport {\n createSelector,\n createSelectorCreator,\n createStructuredSelector,\n lruMemoize,\n referenceEqualityCheck,\n setGlobalDevModeChecks,\n autotrackMemoize as unstable_autotrackMemoize,\n weakMapMemoize\n};\n//# sourceMappingURL=reselect.mjs.map","// src/index.ts\nfunction createThunkMiddleware(extraArgument) {\n const middleware = ({ dispatch, getState }) => (next) => (action) => {\n if (typeof action === \"function\") {\n return action(dispatch, getState, extraArgument);\n }\n return next(action);\n };\n return middleware;\n}\nvar thunk = createThunkMiddleware();\nvar withExtraArgument = createThunkMiddleware;\nexport {\n thunk,\n withExtraArgument\n};\n","// src/index.ts\nexport * from \"redux\";\nimport { produce, current as current4, freeze, original as original2, isDraft as isDraft6 } from \"immer\";\nimport { createSelector, createSelectorCreator as createSelectorCreator2, lruMemoize, weakMapMemoize as weakMapMemoize2 } from \"reselect\";\n\n// src/createDraftSafeSelector.ts\nimport { current, isDraft } from \"immer\";\nimport { createSelectorCreator, weakMapMemoize } from \"reselect\";\nvar createDraftSafeSelectorCreator = (...args) => {\n const createSelector2 = createSelectorCreator(...args);\n const createDraftSafeSelector2 = Object.assign((...args2) => {\n const selector = createSelector2(...args2);\n const wrappedSelector = (value, ...rest) => selector(isDraft(value) ? current(value) : value, ...rest);\n Object.assign(wrappedSelector, selector);\n return wrappedSelector;\n }, {\n withTypes: () => createDraftSafeSelector2\n });\n return createDraftSafeSelector2;\n};\nvar createDraftSafeSelector = createDraftSafeSelectorCreator(weakMapMemoize);\n\n// src/configureStore.ts\nimport { applyMiddleware, createStore, compose as compose2, combineReducers, isPlainObject as isPlainObject2 } from \"redux\";\n\n// src/devtoolsExtension.ts\nimport { compose } from \"redux\";\nvar composeWithDevTools = typeof window !== \"undefined\" && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ : function() {\n if (arguments.length === 0)\n return void 0;\n if (typeof arguments[0] === \"object\")\n return compose;\n return compose.apply(null, arguments);\n};\nvar devToolsEnhancer = typeof window !== \"undefined\" && window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__ : function() {\n return function(noop3) {\n return noop3;\n };\n};\n\n// src/getDefaultMiddleware.ts\nimport { thunk as thunkMiddleware, withExtraArgument } from \"redux-thunk\";\n\n// src/createAction.ts\nimport { isAction } from \"redux\";\n\n// src/tsHelpers.ts\nvar hasMatchFunction = (v) => {\n return v && typeof v.match === \"function\";\n};\n\n// src/createAction.ts\nfunction createAction(type, prepareAction) {\n function actionCreator(...args) {\n if (prepareAction) {\n let prepared = prepareAction(...args);\n if (!prepared) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(0) : \"prepareAction did not return an object\");\n }\n return {\n type,\n payload: prepared.payload,\n ...\"meta\" in prepared && {\n meta: prepared.meta\n },\n ...\"error\" in prepared && {\n error: prepared.error\n }\n };\n }\n return {\n type,\n payload: args[0]\n };\n }\n actionCreator.toString = () => `${type}`;\n actionCreator.type = type;\n actionCreator.match = (action) => isAction(action) && action.type === type;\n return actionCreator;\n}\nfunction isActionCreator(action) {\n return typeof action === \"function\" && \"type\" in action && // hasMatchFunction only wants Matchers but I don't see the point in rewriting it\n hasMatchFunction(action);\n}\nfunction isFSA(action) {\n return isAction(action) && Object.keys(action).every(isValidKey);\n}\nfunction isValidKey(key) {\n return [\"type\", \"payload\", \"error\", \"meta\"].indexOf(key) > -1;\n}\n\n// src/actionCreatorInvariantMiddleware.ts\nfunction getMessage(type) {\n const splitType = type ? `${type}`.split(\"/\") : [];\n const actionName = splitType[splitType.length - 1] || \"actionCreator\";\n return `Detected an action creator with type \"${type || \"unknown\"}\" being dispatched. \nMake sure you're calling the action creator before dispatching, i.e. \\`dispatch(${actionName}())\\` instead of \\`dispatch(${actionName})\\`. This is necessary even if the action has no payload.`;\n}\nfunction createActionCreatorInvariantMiddleware(options = {}) {\n if (process.env.NODE_ENV === \"production\") {\n return () => (next) => (action) => next(action);\n }\n const {\n isActionCreator: isActionCreator2 = isActionCreator\n } = options;\n return () => (next) => (action) => {\n if (isActionCreator2(action)) {\n console.warn(getMessage(action.type));\n }\n return next(action);\n };\n}\n\n// src/utils.ts\nimport { produce as createNextState, isDraftable } from \"immer\";\nfunction getTimeMeasureUtils(maxDelay, fnName) {\n let elapsed = 0;\n return {\n measureTime(fn) {\n const started = Date.now();\n try {\n return fn();\n } finally {\n const finished = Date.now();\n elapsed += finished - started;\n }\n },\n warnIfExceeded() {\n if (elapsed > maxDelay) {\n console.warn(`${fnName} took ${elapsed}ms, which is more than the warning threshold of ${maxDelay}ms. \nIf your state or actions are very large, you may want to disable the middleware as it might cause too much of a slowdown in development mode. See https://redux-toolkit.js.org/api/getDefaultMiddleware for instructions.\nIt is disabled in production builds, so you don't need to worry about that.`);\n }\n }\n };\n}\nfunction find(iterable, comparator) {\n for (const entry of iterable) {\n if (comparator(entry)) {\n return entry;\n }\n }\n return void 0;\n}\nvar Tuple = class _Tuple extends Array {\n constructor(...items) {\n super(...items);\n Object.setPrototypeOf(this, _Tuple.prototype);\n }\n static get [Symbol.species]() {\n return _Tuple;\n }\n concat(...arr) {\n return super.concat.apply(this, arr);\n }\n prepend(...arr) {\n if (arr.length === 1 && Array.isArray(arr[0])) {\n return new _Tuple(...arr[0].concat(this));\n }\n return new _Tuple(...arr.concat(this));\n }\n};\nfunction freezeDraftable(val) {\n return isDraftable(val) ? createNextState(val, () => {\n }) : val;\n}\nfunction emplace(map, key, handler) {\n if (map.has(key)) {\n let value = map.get(key);\n if (handler.update) {\n value = handler.update(value, key, map);\n map.set(key, value);\n }\n return value;\n }\n if (!handler.insert)\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(10) : \"No insert provided for key not already in map\");\n const inserted = handler.insert(key, map);\n map.set(key, inserted);\n return inserted;\n}\n\n// src/immutableStateInvariantMiddleware.ts\nfunction isImmutableDefault(value) {\n return typeof value !== \"object\" || value == null || Object.isFrozen(value);\n}\nfunction trackForMutations(isImmutable, ignorePaths, obj) {\n const trackedProperties = trackProperties(isImmutable, ignorePaths, obj);\n return {\n detectMutations() {\n return detectMutations(isImmutable, ignorePaths, trackedProperties, obj);\n }\n };\n}\nfunction trackProperties(isImmutable, ignorePaths = [], obj, path = \"\", checkedObjects = /* @__PURE__ */ new Set()) {\n const tracked = {\n value: obj\n };\n if (!isImmutable(obj) && !checkedObjects.has(obj)) {\n checkedObjects.add(obj);\n tracked.children = {};\n for (const key in obj) {\n const childPath = path ? path + \".\" + key : key;\n if (ignorePaths.length && ignorePaths.indexOf(childPath) !== -1) {\n continue;\n }\n tracked.children[key] = trackProperties(isImmutable, ignorePaths, obj[key], childPath);\n }\n }\n return tracked;\n}\nfunction detectMutations(isImmutable, ignoredPaths = [], trackedProperty, obj, sameParentRef = false, path = \"\") {\n const prevObj = trackedProperty ? trackedProperty.value : void 0;\n const sameRef = prevObj === obj;\n if (sameParentRef && !sameRef && !Number.isNaN(obj)) {\n return {\n wasMutated: true,\n path\n };\n }\n if (isImmutable(prevObj) || isImmutable(obj)) {\n return {\n wasMutated: false\n };\n }\n const keysToDetect = {};\n for (let key in trackedProperty.children) {\n keysToDetect[key] = true;\n }\n for (let key in obj) {\n keysToDetect[key] = true;\n }\n const hasIgnoredPaths = ignoredPaths.length > 0;\n for (let key in keysToDetect) {\n const nestedPath = path ? path + \".\" + key : key;\n if (hasIgnoredPaths) {\n const hasMatches = ignoredPaths.some((ignored) => {\n if (ignored instanceof RegExp) {\n return ignored.test(nestedPath);\n }\n return nestedPath === ignored;\n });\n if (hasMatches) {\n continue;\n }\n }\n const result = detectMutations(isImmutable, ignoredPaths, trackedProperty.children[key], obj[key], sameRef, nestedPath);\n if (result.wasMutated) {\n return result;\n }\n }\n return {\n wasMutated: false\n };\n}\nfunction createImmutableStateInvariantMiddleware(options = {}) {\n if (process.env.NODE_ENV === \"production\") {\n return () => (next) => (action) => next(action);\n } else {\n let stringify2 = function(obj, serializer, indent, decycler) {\n return JSON.stringify(obj, getSerialize2(serializer, decycler), indent);\n }, getSerialize2 = function(serializer, decycler) {\n let stack = [], keys = [];\n if (!decycler)\n decycler = function(_, value) {\n if (stack[0] === value)\n return \"[Circular ~]\";\n return \"[Circular ~.\" + keys.slice(0, stack.indexOf(value)).join(\".\") + \"]\";\n };\n return function(key, value) {\n if (stack.length > 0) {\n var thisPos = stack.indexOf(this);\n ~thisPos ? stack.splice(thisPos + 1) : stack.push(this);\n ~thisPos ? keys.splice(thisPos, Infinity, key) : keys.push(key);\n if (~stack.indexOf(value))\n value = decycler.call(this, key, value);\n } else\n stack.push(value);\n return serializer == null ? value : serializer.call(this, key, value);\n };\n };\n var stringify = stringify2, getSerialize = getSerialize2;\n let {\n isImmutable = isImmutableDefault,\n ignoredPaths,\n warnAfter = 32\n } = options;\n const track = trackForMutations.bind(null, isImmutable, ignoredPaths);\n return ({\n getState\n }) => {\n let state = getState();\n let tracker = track(state);\n let result;\n return (next) => (action) => {\n const measureUtils = getTimeMeasureUtils(warnAfter, \"ImmutableStateInvariantMiddleware\");\n measureUtils.measureTime(() => {\n state = getState();\n result = tracker.detectMutations();\n tracker = track(state);\n if (result.wasMutated) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(19) : `A state mutation was detected between dispatches, in the path '${result.path || \"\"}'. This may cause incorrect behavior. (https://redux.js.org/style-guide/style-guide#do-not-mutate-state)`);\n }\n });\n const dispatchedAction = next(action);\n measureUtils.measureTime(() => {\n state = getState();\n result = tracker.detectMutations();\n tracker = track(state);\n if (result.wasMutated) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(20) : `A state mutation was detected inside a dispatch, in the path: ${result.path || \"\"}. Take a look at the reducer(s) handling the action ${stringify2(action)}. (https://redux.js.org/style-guide/style-guide#do-not-mutate-state)`);\n }\n });\n measureUtils.warnIfExceeded();\n return dispatchedAction;\n };\n };\n }\n}\n\n// src/serializableStateInvariantMiddleware.ts\nimport { isAction as isAction2, isPlainObject } from \"redux\";\nfunction isPlain(val) {\n const type = typeof val;\n return val == null || type === \"string\" || type === \"boolean\" || type === \"number\" || Array.isArray(val) || isPlainObject(val);\n}\nfunction findNonSerializableValue(value, path = \"\", isSerializable = isPlain, getEntries, ignoredPaths = [], cache) {\n let foundNestedSerializable;\n if (!isSerializable(value)) {\n return {\n keyPath: path || \"\",\n value\n };\n }\n if (typeof value !== \"object\" || value === null) {\n return false;\n }\n if (cache?.has(value))\n return false;\n const entries = getEntries != null ? getEntries(value) : Object.entries(value);\n const hasIgnoredPaths = ignoredPaths.length > 0;\n for (const [key, nestedValue] of entries) {\n const nestedPath = path ? path + \".\" + key : key;\n if (hasIgnoredPaths) {\n const hasMatches = ignoredPaths.some((ignored) => {\n if (ignored instanceof RegExp) {\n return ignored.test(nestedPath);\n }\n return nestedPath === ignored;\n });\n if (hasMatches) {\n continue;\n }\n }\n if (!isSerializable(nestedValue)) {\n return {\n keyPath: nestedPath,\n value: nestedValue\n };\n }\n if (typeof nestedValue === \"object\") {\n foundNestedSerializable = findNonSerializableValue(nestedValue, nestedPath, isSerializable, getEntries, ignoredPaths, cache);\n if (foundNestedSerializable) {\n return foundNestedSerializable;\n }\n }\n }\n if (cache && isNestedFrozen(value))\n cache.add(value);\n return false;\n}\nfunction isNestedFrozen(value) {\n if (!Object.isFrozen(value))\n return false;\n for (const nestedValue of Object.values(value)) {\n if (typeof nestedValue !== \"object\" || nestedValue === null)\n continue;\n if (!isNestedFrozen(nestedValue))\n return false;\n }\n return true;\n}\nfunction createSerializableStateInvariantMiddleware(options = {}) {\n if (process.env.NODE_ENV === \"production\") {\n return () => (next) => (action) => next(action);\n } else {\n const {\n isSerializable = isPlain,\n getEntries,\n ignoredActions = [],\n ignoredActionPaths = [\"meta.arg\", \"meta.baseQueryMeta\"],\n ignoredPaths = [],\n warnAfter = 32,\n ignoreState = false,\n ignoreActions = false,\n disableCache = false\n } = options;\n const cache = !disableCache && WeakSet ? /* @__PURE__ */ new WeakSet() : void 0;\n return (storeAPI) => (next) => (action) => {\n if (!isAction2(action)) {\n return next(action);\n }\n const result = next(action);\n const measureUtils = getTimeMeasureUtils(warnAfter, \"SerializableStateInvariantMiddleware\");\n if (!ignoreActions && !(ignoredActions.length && ignoredActions.indexOf(action.type) !== -1)) {\n measureUtils.measureTime(() => {\n const foundActionNonSerializableValue = findNonSerializableValue(action, \"\", isSerializable, getEntries, ignoredActionPaths, cache);\n if (foundActionNonSerializableValue) {\n const {\n keyPath,\n value\n } = foundActionNonSerializableValue;\n console.error(`A non-serializable value was detected in an action, in the path: \\`${keyPath}\\`. Value:`, value, \"\\nTake a look at the logic that dispatched this action: \", action, \"\\n(See https://redux.js.org/faq/actions#why-should-type-be-a-string-or-at-least-serializable-why-should-my-action-types-be-constants)\", \"\\n(To allow non-serializable values see: https://redux-toolkit.js.org/usage/usage-guide#working-with-non-serializable-data)\");\n }\n });\n }\n if (!ignoreState) {\n measureUtils.measureTime(() => {\n const state = storeAPI.getState();\n const foundStateNonSerializableValue = findNonSerializableValue(state, \"\", isSerializable, getEntries, ignoredPaths, cache);\n if (foundStateNonSerializableValue) {\n const {\n keyPath,\n value\n } = foundStateNonSerializableValue;\n console.error(`A non-serializable value was detected in the state, in the path: \\`${keyPath}\\`. Value:`, value, `\nTake a look at the reducer(s) handling this action type: ${action.type}.\n(See https://redux.js.org/faq/organizing-state#can-i-put-functions-promises-or-other-non-serializable-items-in-my-store-state)`);\n }\n });\n measureUtils.warnIfExceeded();\n }\n return result;\n };\n }\n}\n\n// src/getDefaultMiddleware.ts\nfunction isBoolean(x) {\n return typeof x === \"boolean\";\n}\nvar buildGetDefaultMiddleware = () => function getDefaultMiddleware(options) {\n const {\n thunk = true,\n immutableCheck = true,\n serializableCheck = true,\n actionCreatorCheck = true\n } = options ?? {};\n let middlewareArray = new Tuple();\n if (thunk) {\n if (isBoolean(thunk)) {\n middlewareArray.push(thunkMiddleware);\n } else {\n middlewareArray.push(withExtraArgument(thunk.extraArgument));\n }\n }\n if (process.env.NODE_ENV !== \"production\") {\n if (immutableCheck) {\n let immutableOptions = {};\n if (!isBoolean(immutableCheck)) {\n immutableOptions = immutableCheck;\n }\n middlewareArray.unshift(createImmutableStateInvariantMiddleware(immutableOptions));\n }\n if (serializableCheck) {\n let serializableOptions = {};\n if (!isBoolean(serializableCheck)) {\n serializableOptions = serializableCheck;\n }\n middlewareArray.push(createSerializableStateInvariantMiddleware(serializableOptions));\n }\n if (actionCreatorCheck) {\n let actionCreatorOptions = {};\n if (!isBoolean(actionCreatorCheck)) {\n actionCreatorOptions = actionCreatorCheck;\n }\n middlewareArray.unshift(createActionCreatorInvariantMiddleware(actionCreatorOptions));\n }\n }\n return middlewareArray;\n};\n\n// src/autoBatchEnhancer.ts\nvar SHOULD_AUTOBATCH = \"RTK_autoBatch\";\nvar prepareAutoBatched = () => (payload) => ({\n payload,\n meta: {\n [SHOULD_AUTOBATCH]: true\n }\n});\nvar createQueueWithTimer = (timeout) => {\n return (notify) => {\n setTimeout(notify, timeout);\n };\n};\nvar rAF = typeof window !== \"undefined\" && window.requestAnimationFrame ? window.requestAnimationFrame : createQueueWithTimer(10);\nvar autoBatchEnhancer = (options = {\n type: \"raf\"\n}) => (next) => (...args) => {\n const store = next(...args);\n let notifying = true;\n let shouldNotifyAtEndOfTick = false;\n let notificationQueued = false;\n const listeners = /* @__PURE__ */ new Set();\n const queueCallback = options.type === \"tick\" ? queueMicrotask : options.type === \"raf\" ? rAF : options.type === \"callback\" ? options.queueNotification : createQueueWithTimer(options.timeout);\n const notifyListeners = () => {\n notificationQueued = false;\n if (shouldNotifyAtEndOfTick) {\n shouldNotifyAtEndOfTick = false;\n listeners.forEach((l) => l());\n }\n };\n return Object.assign({}, store, {\n // Override the base `store.subscribe` method to keep original listeners\n // from running if we're delaying notifications\n subscribe(listener2) {\n const wrappedListener = () => notifying && listener2();\n const unsubscribe = store.subscribe(wrappedListener);\n listeners.add(listener2);\n return () => {\n unsubscribe();\n listeners.delete(listener2);\n };\n },\n // Override the base `store.dispatch` method so that we can check actions\n // for the `shouldAutoBatch` flag and determine if batching is active\n dispatch(action) {\n try {\n notifying = !action?.meta?.[SHOULD_AUTOBATCH];\n shouldNotifyAtEndOfTick = !notifying;\n if (shouldNotifyAtEndOfTick) {\n if (!notificationQueued) {\n notificationQueued = true;\n queueCallback(notifyListeners);\n }\n }\n return store.dispatch(action);\n } finally {\n notifying = true;\n }\n }\n });\n};\n\n// src/getDefaultEnhancers.ts\nvar buildGetDefaultEnhancers = (middlewareEnhancer) => function getDefaultEnhancers(options) {\n const {\n autoBatch = true\n } = options ?? {};\n let enhancerArray = new Tuple(middlewareEnhancer);\n if (autoBatch) {\n enhancerArray.push(autoBatchEnhancer(typeof autoBatch === \"object\" ? autoBatch : void 0));\n }\n return enhancerArray;\n};\n\n// src/configureStore.ts\nvar IS_PRODUCTION = process.env.NODE_ENV === \"production\";\nfunction configureStore(options) {\n const getDefaultMiddleware = buildGetDefaultMiddleware();\n const {\n reducer = void 0,\n middleware,\n devTools = true,\n preloadedState = void 0,\n enhancers = void 0\n } = options || {};\n let rootReducer;\n if (typeof reducer === \"function\") {\n rootReducer = reducer;\n } else if (isPlainObject2(reducer)) {\n rootReducer = combineReducers(reducer);\n } else {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(1) : \"`reducer` is a required argument, and must be a function or an object of functions that can be passed to combineReducers\");\n }\n if (!IS_PRODUCTION && middleware && typeof middleware !== \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(2) : \"`middleware` field must be a callback\");\n }\n let finalMiddleware;\n if (typeof middleware === \"function\") {\n finalMiddleware = middleware(getDefaultMiddleware);\n if (!IS_PRODUCTION && !Array.isArray(finalMiddleware)) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(3) : \"when using a middleware builder function, an array of middleware must be returned\");\n }\n } else {\n finalMiddleware = getDefaultMiddleware();\n }\n if (!IS_PRODUCTION && finalMiddleware.some((item) => typeof item !== \"function\")) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(4) : \"each middleware provided to configureStore must be a function\");\n }\n let finalCompose = compose2;\n if (devTools) {\n finalCompose = composeWithDevTools({\n // Enable capture of stack traces for dispatched Redux actions\n trace: !IS_PRODUCTION,\n ...typeof devTools === \"object\" && devTools\n });\n }\n const middlewareEnhancer = applyMiddleware(...finalMiddleware);\n const getDefaultEnhancers = buildGetDefaultEnhancers(middlewareEnhancer);\n if (!IS_PRODUCTION && enhancers && typeof enhancers !== \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(5) : \"`enhancers` field must be a callback\");\n }\n let storeEnhancers = typeof enhancers === \"function\" ? enhancers(getDefaultEnhancers) : getDefaultEnhancers();\n if (!IS_PRODUCTION && !Array.isArray(storeEnhancers)) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(6) : \"`enhancers` callback must return an array\");\n }\n if (!IS_PRODUCTION && storeEnhancers.some((item) => typeof item !== \"function\")) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(7) : \"each enhancer provided to configureStore must be a function\");\n }\n if (!IS_PRODUCTION && finalMiddleware.length && !storeEnhancers.includes(middlewareEnhancer)) {\n console.error(\"middlewares were provided, but middleware enhancer was not included in final enhancers - make sure to call `getDefaultEnhancers`\");\n }\n const composedEnhancer = finalCompose(...storeEnhancers);\n return createStore(rootReducer, preloadedState, composedEnhancer);\n}\n\n// src/createReducer.ts\nimport { produce as createNextState2, isDraft as isDraft2, isDraftable as isDraftable2 } from \"immer\";\n\n// src/mapBuilders.ts\nfunction executeReducerBuilderCallback(builderCallback) {\n const actionsMap = {};\n const actionMatchers = [];\n let defaultCaseReducer;\n const builder = {\n addCase(typeOrActionCreator, reducer) {\n if (process.env.NODE_ENV !== \"production\") {\n if (actionMatchers.length > 0) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(26) : \"`builder.addCase` should only be called before calling `builder.addMatcher`\");\n }\n if (defaultCaseReducer) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(27) : \"`builder.addCase` should only be called before calling `builder.addDefaultCase`\");\n }\n }\n const type = typeof typeOrActionCreator === \"string\" ? typeOrActionCreator : typeOrActionCreator.type;\n if (!type) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(28) : \"`builder.addCase` cannot be called with an empty action type\");\n }\n if (type in actionsMap) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(29) : `\\`builder.addCase\\` cannot be called with two reducers for the same action type '${type}'`);\n }\n actionsMap[type] = reducer;\n return builder;\n },\n addMatcher(matcher, reducer) {\n if (process.env.NODE_ENV !== \"production\") {\n if (defaultCaseReducer) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(30) : \"`builder.addMatcher` should only be called before calling `builder.addDefaultCase`\");\n }\n }\n actionMatchers.push({\n matcher,\n reducer\n });\n return builder;\n },\n addDefaultCase(reducer) {\n if (process.env.NODE_ENV !== \"production\") {\n if (defaultCaseReducer) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(31) : \"`builder.addDefaultCase` can only be called once\");\n }\n }\n defaultCaseReducer = reducer;\n return builder;\n }\n };\n builderCallback(builder);\n return [actionsMap, actionMatchers, defaultCaseReducer];\n}\n\n// src/createReducer.ts\nfunction isStateFunction(x) {\n return typeof x === \"function\";\n}\nfunction createReducer(initialState, mapOrBuilderCallback) {\n if (process.env.NODE_ENV !== \"production\") {\n if (typeof mapOrBuilderCallback === \"object\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(8) : \"The object notation for `createReducer` has been removed. Please use the 'builder callback' notation instead: https://redux-toolkit.js.org/api/createReducer\");\n }\n }\n let [actionsMap, finalActionMatchers, finalDefaultCaseReducer] = executeReducerBuilderCallback(mapOrBuilderCallback);\n let getInitialState;\n if (isStateFunction(initialState)) {\n getInitialState = () => freezeDraftable(initialState());\n } else {\n const frozenInitialState = freezeDraftable(initialState);\n getInitialState = () => frozenInitialState;\n }\n function reducer(state = getInitialState(), action) {\n let caseReducers = [actionsMap[action.type], ...finalActionMatchers.filter(({\n matcher\n }) => matcher(action)).map(({\n reducer: reducer2\n }) => reducer2)];\n if (caseReducers.filter((cr) => !!cr).length === 0) {\n caseReducers = [finalDefaultCaseReducer];\n }\n return caseReducers.reduce((previousState, caseReducer) => {\n if (caseReducer) {\n if (isDraft2(previousState)) {\n const draft = previousState;\n const result = caseReducer(draft, action);\n if (result === void 0) {\n return previousState;\n }\n return result;\n } else if (!isDraftable2(previousState)) {\n const result = caseReducer(previousState, action);\n if (result === void 0) {\n if (previousState === null) {\n return previousState;\n }\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(9) : \"A case reducer on a non-draftable value must not return undefined\");\n }\n return result;\n } else {\n return createNextState2(previousState, (draft) => {\n return caseReducer(draft, action);\n });\n }\n }\n return previousState;\n }, state);\n }\n reducer.getInitialState = getInitialState;\n return reducer;\n}\n\n// src/nanoid.ts\nvar urlAlphabet = \"ModuleSymbhasOwnPr-0123456789ABCDEFGHNRVfgctiUvz_KqYTJkLxpZXIjQW\";\nvar nanoid = (size = 21) => {\n let id = \"\";\n let i = size;\n while (i--) {\n id += urlAlphabet[Math.random() * 64 | 0];\n }\n return id;\n};\n\n// src/matchers.ts\nvar matches = (matcher, action) => {\n if (hasMatchFunction(matcher)) {\n return matcher.match(action);\n } else {\n return matcher(action);\n }\n};\nfunction isAnyOf(...matchers) {\n return (action) => {\n return matchers.some((matcher) => matches(matcher, action));\n };\n}\nfunction isAllOf(...matchers) {\n return (action) => {\n return matchers.every((matcher) => matches(matcher, action));\n };\n}\nfunction hasExpectedRequestMetadata(action, validStatus) {\n if (!action || !action.meta)\n return false;\n const hasValidRequestId = typeof action.meta.requestId === \"string\";\n const hasValidRequestStatus = validStatus.indexOf(action.meta.requestStatus) > -1;\n return hasValidRequestId && hasValidRequestStatus;\n}\nfunction isAsyncThunkArray(a) {\n return typeof a[0] === \"function\" && \"pending\" in a[0] && \"fulfilled\" in a[0] && \"rejected\" in a[0];\n}\nfunction isPending(...asyncThunks) {\n if (asyncThunks.length === 0) {\n return (action) => hasExpectedRequestMetadata(action, [\"pending\"]);\n }\n if (!isAsyncThunkArray(asyncThunks)) {\n return isPending()(asyncThunks[0]);\n }\n return isAnyOf(...asyncThunks.map((asyncThunk) => asyncThunk.pending));\n}\nfunction isRejected(...asyncThunks) {\n if (asyncThunks.length === 0) {\n return (action) => hasExpectedRequestMetadata(action, [\"rejected\"]);\n }\n if (!isAsyncThunkArray(asyncThunks)) {\n return isRejected()(asyncThunks[0]);\n }\n return isAnyOf(...asyncThunks.map((asyncThunk) => asyncThunk.rejected));\n}\nfunction isRejectedWithValue(...asyncThunks) {\n const hasFlag = (action) => {\n return action && action.meta && action.meta.rejectedWithValue;\n };\n if (asyncThunks.length === 0) {\n return isAllOf(isRejected(...asyncThunks), hasFlag);\n }\n if (!isAsyncThunkArray(asyncThunks)) {\n return isRejectedWithValue()(asyncThunks[0]);\n }\n return isAllOf(isRejected(...asyncThunks), hasFlag);\n}\nfunction isFulfilled(...asyncThunks) {\n if (asyncThunks.length === 0) {\n return (action) => hasExpectedRequestMetadata(action, [\"fulfilled\"]);\n }\n if (!isAsyncThunkArray(asyncThunks)) {\n return isFulfilled()(asyncThunks[0]);\n }\n return isAnyOf(...asyncThunks.map((asyncThunk) => asyncThunk.fulfilled));\n}\nfunction isAsyncThunkAction(...asyncThunks) {\n if (asyncThunks.length === 0) {\n return (action) => hasExpectedRequestMetadata(action, [\"pending\", \"fulfilled\", \"rejected\"]);\n }\n if (!isAsyncThunkArray(asyncThunks)) {\n return isAsyncThunkAction()(asyncThunks[0]);\n }\n return isAnyOf(...asyncThunks.flatMap((asyncThunk) => [asyncThunk.pending, asyncThunk.rejected, asyncThunk.fulfilled]));\n}\n\n// src/createAsyncThunk.ts\nvar commonProperties = [\"name\", \"message\", \"stack\", \"code\"];\nvar RejectWithValue = class {\n constructor(payload, meta) {\n this.payload = payload;\n this.meta = meta;\n }\n /*\n type-only property to distinguish between RejectWithValue and FulfillWithMeta\n does not exist at runtime\n */\n _type;\n};\nvar FulfillWithMeta = class {\n constructor(payload, meta) {\n this.payload = payload;\n this.meta = meta;\n }\n /*\n type-only property to distinguish between RejectWithValue and FulfillWithMeta\n does not exist at runtime\n */\n _type;\n};\nvar miniSerializeError = (value) => {\n if (typeof value === \"object\" && value !== null) {\n const simpleError = {};\n for (const property of commonProperties) {\n if (typeof value[property] === \"string\") {\n simpleError[property] = value[property];\n }\n }\n return simpleError;\n }\n return {\n message: String(value)\n };\n};\nvar createAsyncThunk = /* @__PURE__ */ (() => {\n function createAsyncThunk2(typePrefix, payloadCreator, options) {\n const fulfilled = createAction(typePrefix + \"/fulfilled\", (payload, requestId, arg, meta) => ({\n payload,\n meta: {\n ...meta || {},\n arg,\n requestId,\n requestStatus: \"fulfilled\"\n }\n }));\n const pending = createAction(typePrefix + \"/pending\", (requestId, arg, meta) => ({\n payload: void 0,\n meta: {\n ...meta || {},\n arg,\n requestId,\n requestStatus: \"pending\"\n }\n }));\n const rejected = createAction(typePrefix + \"/rejected\", (error, requestId, arg, payload, meta) => ({\n payload,\n error: (options && options.serializeError || miniSerializeError)(error || \"Rejected\"),\n meta: {\n ...meta || {},\n arg,\n requestId,\n rejectedWithValue: !!payload,\n requestStatus: \"rejected\",\n aborted: error?.name === \"AbortError\",\n condition: error?.name === \"ConditionError\"\n }\n }));\n function actionCreator(arg) {\n return (dispatch, getState, extra) => {\n const requestId = options?.idGenerator ? options.idGenerator(arg) : nanoid();\n const abortController = new AbortController();\n let abortHandler;\n let abortReason;\n function abort(reason) {\n abortReason = reason;\n abortController.abort();\n }\n const promise = async function() {\n let finalAction;\n try {\n let conditionResult = options?.condition?.(arg, {\n getState,\n extra\n });\n if (isThenable(conditionResult)) {\n conditionResult = await conditionResult;\n }\n if (conditionResult === false || abortController.signal.aborted) {\n throw {\n name: \"ConditionError\",\n message: \"Aborted due to condition callback returning false.\"\n };\n }\n const abortedPromise = new Promise((_, reject) => {\n abortHandler = () => {\n reject({\n name: \"AbortError\",\n message: abortReason || \"Aborted\"\n });\n };\n abortController.signal.addEventListener(\"abort\", abortHandler);\n });\n dispatch(pending(requestId, arg, options?.getPendingMeta?.({\n requestId,\n arg\n }, {\n getState,\n extra\n })));\n finalAction = await Promise.race([abortedPromise, Promise.resolve(payloadCreator(arg, {\n dispatch,\n getState,\n extra,\n requestId,\n signal: abortController.signal,\n abort,\n rejectWithValue: (value, meta) => {\n return new RejectWithValue(value, meta);\n },\n fulfillWithValue: (value, meta) => {\n return new FulfillWithMeta(value, meta);\n }\n })).then((result) => {\n if (result instanceof RejectWithValue) {\n throw result;\n }\n if (result instanceof FulfillWithMeta) {\n return fulfilled(result.payload, requestId, arg, result.meta);\n }\n return fulfilled(result, requestId, arg);\n })]);\n } catch (err) {\n finalAction = err instanceof RejectWithValue ? rejected(null, requestId, arg, err.payload, err.meta) : rejected(err, requestId, arg);\n } finally {\n if (abortHandler) {\n abortController.signal.removeEventListener(\"abort\", abortHandler);\n }\n }\n const skipDispatch = options && !options.dispatchConditionRejection && rejected.match(finalAction) && finalAction.meta.condition;\n if (!skipDispatch) {\n dispatch(finalAction);\n }\n return finalAction;\n }();\n return Object.assign(promise, {\n abort,\n requestId,\n arg,\n unwrap() {\n return promise.then(unwrapResult);\n }\n });\n };\n }\n return Object.assign(actionCreator, {\n pending,\n rejected,\n fulfilled,\n settled: isAnyOf(rejected, fulfilled),\n typePrefix\n });\n }\n createAsyncThunk2.withTypes = () => createAsyncThunk2;\n return createAsyncThunk2;\n})();\nfunction unwrapResult(action) {\n if (action.meta && action.meta.rejectedWithValue) {\n throw action.payload;\n }\n if (action.error) {\n throw action.error;\n }\n return action.payload;\n}\nfunction isThenable(value) {\n return value !== null && typeof value === \"object\" && typeof value.then === \"function\";\n}\n\n// src/createSlice.ts\nvar asyncThunkSymbol = /* @__PURE__ */ Symbol.for(\"rtk-slice-createasyncthunk\");\nvar asyncThunkCreator = {\n [asyncThunkSymbol]: createAsyncThunk\n};\nvar ReducerType = /* @__PURE__ */ ((ReducerType2) => {\n ReducerType2[\"reducer\"] = \"reducer\";\n ReducerType2[\"reducerWithPrepare\"] = \"reducerWithPrepare\";\n ReducerType2[\"asyncThunk\"] = \"asyncThunk\";\n return ReducerType2;\n})(ReducerType || {});\nfunction getType(slice, actionKey) {\n return `${slice}/${actionKey}`;\n}\nfunction buildCreateSlice({\n creators\n} = {}) {\n const cAT = creators?.asyncThunk?.[asyncThunkSymbol];\n return function createSlice2(options) {\n const {\n name,\n reducerPath = name\n } = options;\n if (!name) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(11) : \"`name` is a required option for createSlice\");\n }\n if (typeof process !== \"undefined\" && process.env.NODE_ENV === \"development\") {\n if (options.initialState === void 0) {\n console.error(\"You must provide an `initialState` value that is not `undefined`. You may have misspelled `initialState`\");\n }\n }\n const reducers = (typeof options.reducers === \"function\" ? options.reducers(buildReducerCreators()) : options.reducers) || {};\n const reducerNames = Object.keys(reducers);\n const context = {\n sliceCaseReducersByName: {},\n sliceCaseReducersByType: {},\n actionCreators: {},\n sliceMatchers: []\n };\n const contextMethods = {\n addCase(typeOrActionCreator, reducer2) {\n const type = typeof typeOrActionCreator === \"string\" ? typeOrActionCreator : typeOrActionCreator.type;\n if (!type) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(12) : \"`context.addCase` cannot be called with an empty action type\");\n }\n if (type in context.sliceCaseReducersByType) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(13) : \"`context.addCase` cannot be called with two reducers for the same action type: \" + type);\n }\n context.sliceCaseReducersByType[type] = reducer2;\n return contextMethods;\n },\n addMatcher(matcher, reducer2) {\n context.sliceMatchers.push({\n matcher,\n reducer: reducer2\n });\n return contextMethods;\n },\n exposeAction(name2, actionCreator) {\n context.actionCreators[name2] = actionCreator;\n return contextMethods;\n },\n exposeCaseReducer(name2, reducer2) {\n context.sliceCaseReducersByName[name2] = reducer2;\n return contextMethods;\n }\n };\n reducerNames.forEach((reducerName) => {\n const reducerDefinition = reducers[reducerName];\n const reducerDetails = {\n reducerName,\n type: getType(name, reducerName),\n createNotation: typeof options.reducers === \"function\"\n };\n if (isAsyncThunkSliceReducerDefinition(reducerDefinition)) {\n handleThunkCaseReducerDefinition(reducerDetails, reducerDefinition, contextMethods, cAT);\n } else {\n handleNormalReducerDefinition(reducerDetails, reducerDefinition, contextMethods);\n }\n });\n function buildReducer() {\n if (process.env.NODE_ENV !== \"production\") {\n if (typeof options.extraReducers === \"object\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(14) : \"The object notation for `createSlice.extraReducers` has been removed. Please use the 'builder callback' notation instead: https://redux-toolkit.js.org/api/createSlice\");\n }\n }\n const [extraReducers = {}, actionMatchers = [], defaultCaseReducer = void 0] = typeof options.extraReducers === \"function\" ? executeReducerBuilderCallback(options.extraReducers) : [options.extraReducers];\n const finalCaseReducers = {\n ...extraReducers,\n ...context.sliceCaseReducersByType\n };\n return createReducer(options.initialState, (builder) => {\n for (let key in finalCaseReducers) {\n builder.addCase(key, finalCaseReducers[key]);\n }\n for (let sM of context.sliceMatchers) {\n builder.addMatcher(sM.matcher, sM.reducer);\n }\n for (let m of actionMatchers) {\n builder.addMatcher(m.matcher, m.reducer);\n }\n if (defaultCaseReducer) {\n builder.addDefaultCase(defaultCaseReducer);\n }\n });\n }\n const selectSelf = (state) => state;\n const injectedSelectorCache = /* @__PURE__ */ new Map();\n let _reducer;\n function reducer(state, action) {\n if (!_reducer)\n _reducer = buildReducer();\n return _reducer(state, action);\n }\n function getInitialState() {\n if (!_reducer)\n _reducer = buildReducer();\n return _reducer.getInitialState();\n }\n function makeSelectorProps(reducerPath2, injected = false) {\n function selectSlice(state) {\n let sliceState = state[reducerPath2];\n if (typeof sliceState === \"undefined\") {\n if (injected) {\n sliceState = getInitialState();\n } else if (process.env.NODE_ENV !== \"production\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(15) : \"selectSlice returned undefined for an uninjected slice reducer\");\n }\n }\n return sliceState;\n }\n function getSelectors(selectState = selectSelf) {\n const selectorCache = emplace(injectedSelectorCache, injected, {\n insert: () => /* @__PURE__ */ new WeakMap()\n });\n return emplace(selectorCache, selectState, {\n insert: () => {\n const map = {};\n for (const [name2, selector] of Object.entries(options.selectors ?? {})) {\n map[name2] = wrapSelector(selector, selectState, getInitialState, injected);\n }\n return map;\n }\n });\n }\n return {\n reducerPath: reducerPath2,\n getSelectors,\n get selectors() {\n return getSelectors(selectSlice);\n },\n selectSlice\n };\n }\n const slice = {\n name,\n reducer,\n actions: context.actionCreators,\n caseReducers: context.sliceCaseReducersByName,\n getInitialState,\n ...makeSelectorProps(reducerPath),\n injectInto(injectable, {\n reducerPath: pathOpt,\n ...config\n } = {}) {\n const newReducerPath = pathOpt ?? reducerPath;\n injectable.inject({\n reducerPath: newReducerPath,\n reducer\n }, config);\n return {\n ...slice,\n ...makeSelectorProps(newReducerPath, true)\n };\n }\n };\n return slice;\n };\n}\nfunction wrapSelector(selector, selectState, getInitialState, injected) {\n function wrapper(rootState, ...args) {\n let sliceState = selectState(rootState);\n if (typeof sliceState === \"undefined\") {\n if (injected) {\n sliceState = getInitialState();\n } else if (process.env.NODE_ENV !== \"production\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(16) : \"selectState returned undefined for an uninjected slice reducer\");\n }\n }\n return selector(sliceState, ...args);\n }\n wrapper.unwrapped = selector;\n return wrapper;\n}\nvar createSlice = /* @__PURE__ */ buildCreateSlice();\nfunction buildReducerCreators() {\n function asyncThunk(payloadCreator, config) {\n return {\n _reducerDefinitionType: \"asyncThunk\" /* asyncThunk */,\n payloadCreator,\n ...config\n };\n }\n asyncThunk.withTypes = () => asyncThunk;\n return {\n reducer(caseReducer) {\n return Object.assign({\n // hack so the wrapping function has the same name as the original\n // we need to create a wrapper so the `reducerDefinitionType` is not assigned to the original\n [caseReducer.name](...args) {\n return caseReducer(...args);\n }\n }[caseReducer.name], {\n _reducerDefinitionType: \"reducer\" /* reducer */\n });\n },\n preparedReducer(prepare, reducer) {\n return {\n _reducerDefinitionType: \"reducerWithPrepare\" /* reducerWithPrepare */,\n prepare,\n reducer\n };\n },\n asyncThunk\n };\n}\nfunction handleNormalReducerDefinition({\n type,\n reducerName,\n createNotation\n}, maybeReducerWithPrepare, context) {\n let caseReducer;\n let prepareCallback;\n if (\"reducer\" in maybeReducerWithPrepare) {\n if (createNotation && !isCaseReducerWithPrepareDefinition(maybeReducerWithPrepare)) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(17) : \"Please use the `create.preparedReducer` notation for prepared action creators with the `create` notation.\");\n }\n caseReducer = maybeReducerWithPrepare.reducer;\n prepareCallback = maybeReducerWithPrepare.prepare;\n } else {\n caseReducer = maybeReducerWithPrepare;\n }\n context.addCase(type, caseReducer).exposeCaseReducer(reducerName, caseReducer).exposeAction(reducerName, prepareCallback ? createAction(type, prepareCallback) : createAction(type));\n}\nfunction isAsyncThunkSliceReducerDefinition(reducerDefinition) {\n return reducerDefinition._reducerDefinitionType === \"asyncThunk\" /* asyncThunk */;\n}\nfunction isCaseReducerWithPrepareDefinition(reducerDefinition) {\n return reducerDefinition._reducerDefinitionType === \"reducerWithPrepare\" /* reducerWithPrepare */;\n}\nfunction handleThunkCaseReducerDefinition({\n type,\n reducerName\n}, reducerDefinition, context, cAT) {\n if (!cAT) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(18) : \"Cannot use `create.asyncThunk` in the built-in `createSlice`. Use `buildCreateSlice({ creators: { asyncThunk: asyncThunkCreator } })` to create a customised version of `createSlice`.\");\n }\n const {\n payloadCreator,\n fulfilled,\n pending,\n rejected,\n settled,\n options\n } = reducerDefinition;\n const thunk = cAT(type, payloadCreator, options);\n context.exposeAction(reducerName, thunk);\n if (fulfilled) {\n context.addCase(thunk.fulfilled, fulfilled);\n }\n if (pending) {\n context.addCase(thunk.pending, pending);\n }\n if (rejected) {\n context.addCase(thunk.rejected, rejected);\n }\n if (settled) {\n context.addMatcher(thunk.settled, settled);\n }\n context.exposeCaseReducer(reducerName, {\n fulfilled: fulfilled || noop,\n pending: pending || noop,\n rejected: rejected || noop,\n settled: settled || noop\n });\n}\nfunction noop() {\n}\n\n// src/entities/entity_state.ts\nfunction getInitialEntityState() {\n return {\n ids: [],\n entities: {}\n };\n}\nfunction createInitialStateFactory(stateAdapter) {\n function getInitialState(additionalState = {}, entities) {\n const state = Object.assign(getInitialEntityState(), additionalState);\n return entities ? stateAdapter.setAll(state, entities) : state;\n }\n return {\n getInitialState\n };\n}\n\n// src/entities/state_selectors.ts\nfunction createSelectorsFactory() {\n function getSelectors(selectState, options = {}) {\n const {\n createSelector: createSelector2 = createDraftSafeSelector\n } = options;\n const selectIds = (state) => state.ids;\n const selectEntities = (state) => state.entities;\n const selectAll = createSelector2(selectIds, selectEntities, (ids, entities) => ids.map((id) => entities[id]));\n const selectId = (_, id) => id;\n const selectById = (entities, id) => entities[id];\n const selectTotal = createSelector2(selectIds, (ids) => ids.length);\n if (!selectState) {\n return {\n selectIds,\n selectEntities,\n selectAll,\n selectTotal,\n selectById: createSelector2(selectEntities, selectId, selectById)\n };\n }\n const selectGlobalizedEntities = createSelector2(selectState, selectEntities);\n return {\n selectIds: createSelector2(selectState, selectIds),\n selectEntities: selectGlobalizedEntities,\n selectAll: createSelector2(selectState, selectAll),\n selectTotal: createSelector2(selectState, selectTotal),\n selectById: createSelector2(selectGlobalizedEntities, selectId, selectById)\n };\n }\n return {\n getSelectors\n };\n}\n\n// src/entities/sorted_state_adapter.ts\nimport { current as current3 } from \"immer\";\n\n// src/entities/state_adapter.ts\nimport { produce as createNextState3, isDraft as isDraft3 } from \"immer\";\nvar isDraftTyped = isDraft3;\nfunction createSingleArgumentStateOperator(mutator) {\n const operator = createStateOperator((_, state) => mutator(state));\n return function operation(state) {\n return operator(state, void 0);\n };\n}\nfunction createStateOperator(mutator) {\n return function operation(state, arg) {\n function isPayloadActionArgument(arg2) {\n return isFSA(arg2);\n }\n const runMutator = (draft) => {\n if (isPayloadActionArgument(arg)) {\n mutator(arg.payload, draft);\n } else {\n mutator(arg, draft);\n }\n };\n if (isDraftTyped(state)) {\n runMutator(state);\n return state;\n }\n return createNextState3(state, runMutator);\n };\n}\n\n// src/entities/utils.ts\nimport { current as current2, isDraft as isDraft4 } from \"immer\";\nfunction selectIdValue(entity, selectId) {\n const key = selectId(entity);\n if (process.env.NODE_ENV !== \"production\" && key === void 0) {\n console.warn(\"The entity passed to the `selectId` implementation returned undefined.\", \"You should probably provide your own `selectId` implementation.\", \"The entity that was passed:\", entity, \"The `selectId` implementation:\", selectId.toString());\n }\n return key;\n}\nfunction ensureEntitiesArray(entities) {\n if (!Array.isArray(entities)) {\n entities = Object.values(entities);\n }\n return entities;\n}\nfunction getCurrent(value) {\n return isDraft4(value) ? current2(value) : value;\n}\nfunction splitAddedUpdatedEntities(newEntities, selectId, state) {\n newEntities = ensureEntitiesArray(newEntities);\n const existingIdsArray = getCurrent(state.ids);\n const existingIds = new Set(existingIdsArray);\n const added = [];\n const updated = [];\n for (const entity of newEntities) {\n const id = selectIdValue(entity, selectId);\n if (existingIds.has(id)) {\n updated.push({\n id,\n changes: entity\n });\n } else {\n added.push(entity);\n }\n }\n return [added, updated, existingIdsArray];\n}\n\n// src/entities/unsorted_state_adapter.ts\nfunction createUnsortedStateAdapter(selectId) {\n function addOneMutably(entity, state) {\n const key = selectIdValue(entity, selectId);\n if (key in state.entities) {\n return;\n }\n state.ids.push(key);\n state.entities[key] = entity;\n }\n function addManyMutably(newEntities, state) {\n newEntities = ensureEntitiesArray(newEntities);\n for (const entity of newEntities) {\n addOneMutably(entity, state);\n }\n }\n function setOneMutably(entity, state) {\n const key = selectIdValue(entity, selectId);\n if (!(key in state.entities)) {\n state.ids.push(key);\n }\n ;\n state.entities[key] = entity;\n }\n function setManyMutably(newEntities, state) {\n newEntities = ensureEntitiesArray(newEntities);\n for (const entity of newEntities) {\n setOneMutably(entity, state);\n }\n }\n function setAllMutably(newEntities, state) {\n newEntities = ensureEntitiesArray(newEntities);\n state.ids = [];\n state.entities = {};\n addManyMutably(newEntities, state);\n }\n function removeOneMutably(key, state) {\n return removeManyMutably([key], state);\n }\n function removeManyMutably(keys, state) {\n let didMutate = false;\n keys.forEach((key) => {\n if (key in state.entities) {\n delete state.entities[key];\n didMutate = true;\n }\n });\n if (didMutate) {\n state.ids = state.ids.filter((id) => id in state.entities);\n }\n }\n function removeAllMutably(state) {\n Object.assign(state, {\n ids: [],\n entities: {}\n });\n }\n function takeNewKey(keys, update, state) {\n const original3 = state.entities[update.id];\n if (original3 === void 0) {\n return false;\n }\n const updated = Object.assign({}, original3, update.changes);\n const newKey = selectIdValue(updated, selectId);\n const hasNewKey = newKey !== update.id;\n if (hasNewKey) {\n keys[update.id] = newKey;\n delete state.entities[update.id];\n }\n ;\n state.entities[newKey] = updated;\n return hasNewKey;\n }\n function updateOneMutably(update, state) {\n return updateManyMutably([update], state);\n }\n function updateManyMutably(updates, state) {\n const newKeys = {};\n const updatesPerEntity = {};\n updates.forEach((update) => {\n if (update.id in state.entities) {\n updatesPerEntity[update.id] = {\n id: update.id,\n // Spreads ignore falsy values, so this works even if there isn't\n // an existing update already at this key\n changes: {\n ...updatesPerEntity[update.id] ? updatesPerEntity[update.id].changes : null,\n ...update.changes\n }\n };\n }\n });\n updates = Object.values(updatesPerEntity);\n const didMutateEntities = updates.length > 0;\n if (didMutateEntities) {\n const didMutateIds = updates.filter((update) => takeNewKey(newKeys, update, state)).length > 0;\n if (didMutateIds) {\n state.ids = Object.values(state.entities).map((e) => selectIdValue(e, selectId));\n }\n }\n }\n function upsertOneMutably(entity, state) {\n return upsertManyMutably([entity], state);\n }\n function upsertManyMutably(newEntities, state) {\n const [added, updated] = splitAddedUpdatedEntities(newEntities, selectId, state);\n updateManyMutably(updated, state);\n addManyMutably(added, state);\n }\n return {\n removeAll: createSingleArgumentStateOperator(removeAllMutably),\n addOne: createStateOperator(addOneMutably),\n addMany: createStateOperator(addManyMutably),\n setOne: createStateOperator(setOneMutably),\n setMany: createStateOperator(setManyMutably),\n setAll: createStateOperator(setAllMutably),\n updateOne: createStateOperator(updateOneMutably),\n updateMany: createStateOperator(updateManyMutably),\n upsertOne: createStateOperator(upsertOneMutably),\n upsertMany: createStateOperator(upsertManyMutably),\n removeOne: createStateOperator(removeOneMutably),\n removeMany: createStateOperator(removeManyMutably)\n };\n}\n\n// src/entities/sorted_state_adapter.ts\nfunction findInsertIndex(sortedItems, item, comparisonFunction) {\n let lowIndex = 0;\n let highIndex = sortedItems.length;\n while (lowIndex < highIndex) {\n let middleIndex = lowIndex + highIndex >>> 1;\n const currentItem = sortedItems[middleIndex];\n const res = comparisonFunction(item, currentItem);\n if (res >= 0) {\n lowIndex = middleIndex + 1;\n } else {\n highIndex = middleIndex;\n }\n }\n return lowIndex;\n}\nfunction insert(sortedItems, item, comparisonFunction) {\n const insertAtIndex = findInsertIndex(sortedItems, item, comparisonFunction);\n sortedItems.splice(insertAtIndex, 0, item);\n return sortedItems;\n}\nfunction createSortedStateAdapter(selectId, comparer) {\n const {\n removeOne,\n removeMany,\n removeAll\n } = createUnsortedStateAdapter(selectId);\n function addOneMutably(entity, state) {\n return addManyMutably([entity], state);\n }\n function addManyMutably(newEntities, state, existingIds) {\n newEntities = ensureEntitiesArray(newEntities);\n const existingKeys = new Set(existingIds ?? current3(state.ids));\n const models = newEntities.filter((model) => !existingKeys.has(selectIdValue(model, selectId)));\n if (models.length !== 0) {\n mergeFunction(state, models);\n }\n }\n function setOneMutably(entity, state) {\n return setManyMutably([entity], state);\n }\n function setManyMutably(newEntities, state) {\n newEntities = ensureEntitiesArray(newEntities);\n if (newEntities.length !== 0) {\n for (const item of newEntities) {\n delete state.entities[selectId(item)];\n }\n mergeFunction(state, newEntities);\n }\n }\n function setAllMutably(newEntities, state) {\n newEntities = ensureEntitiesArray(newEntities);\n state.entities = {};\n state.ids = [];\n addManyMutably(newEntities, state, []);\n }\n function updateOneMutably(update, state) {\n return updateManyMutably([update], state);\n }\n function updateManyMutably(updates, state) {\n let appliedUpdates = false;\n let replacedIds = false;\n for (let update of updates) {\n const entity = state.entities[update.id];\n if (!entity) {\n continue;\n }\n appliedUpdates = true;\n Object.assign(entity, update.changes);\n const newId = selectId(entity);\n if (update.id !== newId) {\n replacedIds = true;\n delete state.entities[update.id];\n const oldIndex = state.ids.indexOf(update.id);\n state.ids[oldIndex] = newId;\n state.entities[newId] = entity;\n }\n }\n if (appliedUpdates) {\n mergeFunction(state, [], appliedUpdates, replacedIds);\n }\n }\n function upsertOneMutably(entity, state) {\n return upsertManyMutably([entity], state);\n }\n function upsertManyMutably(newEntities, state) {\n const [added, updated, existingIdsArray] = splitAddedUpdatedEntities(newEntities, selectId, state);\n if (updated.length) {\n updateManyMutably(updated, state);\n }\n if (added.length) {\n addManyMutably(added, state, existingIdsArray);\n }\n }\n function areArraysEqual(a, b) {\n if (a.length !== b.length) {\n return false;\n }\n for (let i = 0; i < a.length && i < b.length; i++) {\n if (a[i] === b[i]) {\n continue;\n }\n return false;\n }\n return true;\n }\n const mergeInsertion = (state, addedItems, appliedUpdates, replacedIds) => {\n const currentEntities = getCurrent(state.entities);\n const currentIds = getCurrent(state.ids);\n const stateEntities = state.entities;\n let ids = currentIds;\n if (replacedIds) {\n ids = Array.from(new Set(currentIds));\n }\n let sortedEntities = [];\n for (const id of ids) {\n const entity = currentEntities[id];\n if (entity) {\n sortedEntities.push(entity);\n }\n }\n const wasPreviouslyEmpty = sortedEntities.length === 0;\n for (const item of addedItems) {\n stateEntities[selectId(item)] = item;\n if (!wasPreviouslyEmpty) {\n insert(sortedEntities, item, comparer);\n }\n }\n if (wasPreviouslyEmpty) {\n sortedEntities = addedItems.slice().sort(comparer);\n } else if (appliedUpdates) {\n sortedEntities.sort(comparer);\n }\n const newSortedIds = sortedEntities.map(selectId);\n if (!areArraysEqual(currentIds, newSortedIds)) {\n state.ids = newSortedIds;\n }\n };\n const mergeFunction = mergeInsertion;\n return {\n removeOne,\n removeMany,\n removeAll,\n addOne: createStateOperator(addOneMutably),\n updateOne: createStateOperator(updateOneMutably),\n upsertOne: createStateOperator(upsertOneMutably),\n setOne: createStateOperator(setOneMutably),\n setMany: createStateOperator(setManyMutably),\n setAll: createStateOperator(setAllMutably),\n addMany: createStateOperator(addManyMutably),\n updateMany: createStateOperator(updateManyMutably),\n upsertMany: createStateOperator(upsertManyMutably)\n };\n}\n\n// src/entities/create_adapter.ts\nfunction createEntityAdapter(options = {}) {\n const {\n selectId,\n sortComparer\n } = {\n sortComparer: false,\n selectId: (instance) => instance.id,\n ...options\n };\n const stateAdapter = sortComparer ? createSortedStateAdapter(selectId, sortComparer) : createUnsortedStateAdapter(selectId);\n const stateFactory = createInitialStateFactory(stateAdapter);\n const selectorsFactory = createSelectorsFactory();\n return {\n selectId,\n sortComparer,\n ...stateFactory,\n ...selectorsFactory,\n ...stateAdapter\n };\n}\n\n// src/listenerMiddleware/index.ts\nimport { isAction as isAction3 } from \"redux\";\n\n// src/listenerMiddleware/exceptions.ts\nvar task = \"task\";\nvar listener = \"listener\";\nvar completed = \"completed\";\nvar cancelled = \"cancelled\";\nvar taskCancelled = `task-${cancelled}`;\nvar taskCompleted = `task-${completed}`;\nvar listenerCancelled = `${listener}-${cancelled}`;\nvar listenerCompleted = `${listener}-${completed}`;\nvar TaskAbortError = class {\n constructor(code) {\n this.code = code;\n this.message = `${task} ${cancelled} (reason: ${code})`;\n }\n name = \"TaskAbortError\";\n message;\n};\n\n// src/listenerMiddleware/utils.ts\nvar assertFunction = (func, expected) => {\n if (typeof func !== \"function\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(32) : `${expected} is not a function`);\n }\n};\nvar noop2 = () => {\n};\nvar catchRejection = (promise, onError = noop2) => {\n promise.catch(onError);\n return promise;\n};\nvar addAbortSignalListener = (abortSignal, callback) => {\n abortSignal.addEventListener(\"abort\", callback, {\n once: true\n });\n return () => abortSignal.removeEventListener(\"abort\", callback);\n};\nvar abortControllerWithReason = (abortController, reason) => {\n const signal = abortController.signal;\n if (signal.aborted) {\n return;\n }\n if (!(\"reason\" in signal)) {\n Object.defineProperty(signal, \"reason\", {\n enumerable: true,\n value: reason,\n configurable: true,\n writable: true\n });\n }\n ;\n abortController.abort(reason);\n};\n\n// src/listenerMiddleware/task.ts\nvar validateActive = (signal) => {\n if (signal.aborted) {\n const {\n reason\n } = signal;\n throw new TaskAbortError(reason);\n }\n};\nfunction raceWithSignal(signal, promise) {\n let cleanup = noop2;\n return new Promise((resolve, reject) => {\n const notifyRejection = () => reject(new TaskAbortError(signal.reason));\n if (signal.aborted) {\n notifyRejection();\n return;\n }\n cleanup = addAbortSignalListener(signal, notifyRejection);\n promise.finally(() => cleanup()).then(resolve, reject);\n }).finally(() => {\n cleanup = noop2;\n });\n}\nvar runTask = async (task2, cleanUp) => {\n try {\n await Promise.resolve();\n const value = await task2();\n return {\n status: \"ok\",\n value\n };\n } catch (error) {\n return {\n status: error instanceof TaskAbortError ? \"cancelled\" : \"rejected\",\n error\n };\n } finally {\n cleanUp?.();\n }\n};\nvar createPause = (signal) => {\n return (promise) => {\n return catchRejection(raceWithSignal(signal, promise).then((output) => {\n validateActive(signal);\n return output;\n }));\n };\n};\nvar createDelay = (signal) => {\n const pause = createPause(signal);\n return (timeoutMs) => {\n return pause(new Promise((resolve) => setTimeout(resolve, timeoutMs)));\n };\n};\n\n// src/listenerMiddleware/index.ts\nvar {\n assign\n} = Object;\nvar INTERNAL_NIL_TOKEN = {};\nvar alm = \"listenerMiddleware\";\nvar createFork = (parentAbortSignal, parentBlockingPromises) => {\n const linkControllers = (controller) => addAbortSignalListener(parentAbortSignal, () => abortControllerWithReason(controller, parentAbortSignal.reason));\n return (taskExecutor, opts) => {\n assertFunction(taskExecutor, \"taskExecutor\");\n const childAbortController = new AbortController();\n linkControllers(childAbortController);\n const result = runTask(async () => {\n validateActive(parentAbortSignal);\n validateActive(childAbortController.signal);\n const result2 = await taskExecutor({\n pause: createPause(childAbortController.signal),\n delay: createDelay(childAbortController.signal),\n signal: childAbortController.signal\n });\n validateActive(childAbortController.signal);\n return result2;\n }, () => abortControllerWithReason(childAbortController, taskCompleted));\n if (opts?.autoJoin) {\n parentBlockingPromises.push(result.catch(noop2));\n }\n return {\n result: createPause(parentAbortSignal)(result),\n cancel() {\n abortControllerWithReason(childAbortController, taskCancelled);\n }\n };\n };\n};\nvar createTakePattern = (startListening, signal) => {\n const take = async (predicate, timeout) => {\n validateActive(signal);\n let unsubscribe = () => {\n };\n const tuplePromise = new Promise((resolve, reject) => {\n let stopListening = startListening({\n predicate,\n effect: (action, listenerApi) => {\n listenerApi.unsubscribe();\n resolve([action, listenerApi.getState(), listenerApi.getOriginalState()]);\n }\n });\n unsubscribe = () => {\n stopListening();\n reject();\n };\n });\n const promises = [tuplePromise];\n if (timeout != null) {\n promises.push(new Promise((resolve) => setTimeout(resolve, timeout, null)));\n }\n try {\n const output = await raceWithSignal(signal, Promise.race(promises));\n validateActive(signal);\n return output;\n } finally {\n unsubscribe();\n }\n };\n return (predicate, timeout) => catchRejection(take(predicate, timeout));\n};\nvar getListenerEntryPropsFrom = (options) => {\n let {\n type,\n actionCreator,\n matcher,\n predicate,\n effect\n } = options;\n if (type) {\n predicate = createAction(type).match;\n } else if (actionCreator) {\n type = actionCreator.type;\n predicate = actionCreator.match;\n } else if (matcher) {\n predicate = matcher;\n } else if (predicate) {\n } else {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(21) : \"Creating or removing a listener requires one of the known fields for matching an action\");\n }\n assertFunction(effect, \"options.listener\");\n return {\n predicate,\n type,\n effect\n };\n};\nvar createListenerEntry = Object.assign((options) => {\n const {\n type,\n predicate,\n effect\n } = getListenerEntryPropsFrom(options);\n const id = nanoid();\n const entry = {\n id,\n effect,\n type,\n predicate,\n pending: /* @__PURE__ */ new Set(),\n unsubscribe: () => {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(22) : \"Unsubscribe not initialized\");\n }\n };\n return entry;\n}, {\n withTypes: () => createListenerEntry\n});\nvar cancelActiveListeners = (entry) => {\n entry.pending.forEach((controller) => {\n abortControllerWithReason(controller, listenerCancelled);\n });\n};\nvar createClearListenerMiddleware = (listenerMap) => {\n return () => {\n listenerMap.forEach(cancelActiveListeners);\n listenerMap.clear();\n };\n};\nvar safelyNotifyError = (errorHandler, errorToNotify, errorInfo) => {\n try {\n errorHandler(errorToNotify, errorInfo);\n } catch (errorHandlerError) {\n setTimeout(() => {\n throw errorHandlerError;\n }, 0);\n }\n};\nvar addListener = Object.assign(createAction(`${alm}/add`), {\n withTypes: () => addListener\n});\nvar clearAllListeners = createAction(`${alm}/removeAll`);\nvar removeListener = Object.assign(createAction(`${alm}/remove`), {\n withTypes: () => removeListener\n});\nvar defaultErrorHandler = (...args) => {\n console.error(`${alm}/error`, ...args);\n};\nvar createListenerMiddleware = (middlewareOptions = {}) => {\n const listenerMap = /* @__PURE__ */ new Map();\n const {\n extra,\n onError = defaultErrorHandler\n } = middlewareOptions;\n assertFunction(onError, \"onError\");\n const insertEntry = (entry) => {\n entry.unsubscribe = () => listenerMap.delete(entry.id);\n listenerMap.set(entry.id, entry);\n return (cancelOptions) => {\n entry.unsubscribe();\n if (cancelOptions?.cancelActive) {\n cancelActiveListeners(entry);\n }\n };\n };\n const startListening = (options) => {\n let entry = find(Array.from(listenerMap.values()), (existingEntry) => existingEntry.effect === options.effect);\n if (!entry) {\n entry = createListenerEntry(options);\n }\n return insertEntry(entry);\n };\n Object.assign(startListening, {\n withTypes: () => startListening\n });\n const stopListening = (options) => {\n const {\n type,\n effect,\n predicate\n } = getListenerEntryPropsFrom(options);\n const entry = find(Array.from(listenerMap.values()), (entry2) => {\n const matchPredicateOrType = typeof type === \"string\" ? entry2.type === type : entry2.predicate === predicate;\n return matchPredicateOrType && entry2.effect === effect;\n });\n if (entry) {\n entry.unsubscribe();\n if (options.cancelActive) {\n cancelActiveListeners(entry);\n }\n }\n return !!entry;\n };\n Object.assign(stopListening, {\n withTypes: () => stopListening\n });\n const notifyListener = async (entry, action, api, getOriginalState) => {\n const internalTaskController = new AbortController();\n const take = createTakePattern(startListening, internalTaskController.signal);\n const autoJoinPromises = [];\n try {\n entry.pending.add(internalTaskController);\n await Promise.resolve(entry.effect(\n action,\n // Use assign() rather than ... to avoid extra helper functions added to bundle\n assign({}, api, {\n getOriginalState,\n condition: (predicate, timeout) => take(predicate, timeout).then(Boolean),\n take,\n delay: createDelay(internalTaskController.signal),\n pause: createPause(internalTaskController.signal),\n extra,\n signal: internalTaskController.signal,\n fork: createFork(internalTaskController.signal, autoJoinPromises),\n unsubscribe: entry.unsubscribe,\n subscribe: () => {\n listenerMap.set(entry.id, entry);\n },\n cancelActiveListeners: () => {\n entry.pending.forEach((controller, _, set) => {\n if (controller !== internalTaskController) {\n abortControllerWithReason(controller, listenerCancelled);\n set.delete(controller);\n }\n });\n },\n cancel: () => {\n abortControllerWithReason(internalTaskController, listenerCancelled);\n entry.pending.delete(internalTaskController);\n },\n throwIfCancelled: () => {\n validateActive(internalTaskController.signal);\n }\n })\n ));\n } catch (listenerError) {\n if (!(listenerError instanceof TaskAbortError)) {\n safelyNotifyError(onError, listenerError, {\n raisedBy: \"effect\"\n });\n }\n } finally {\n await Promise.all(autoJoinPromises);\n abortControllerWithReason(internalTaskController, listenerCompleted);\n entry.pending.delete(internalTaskController);\n }\n };\n const clearListenerMiddleware = createClearListenerMiddleware(listenerMap);\n const middleware = (api) => (next) => (action) => {\n if (!isAction3(action)) {\n return next(action);\n }\n if (addListener.match(action)) {\n return startListening(action.payload);\n }\n if (clearAllListeners.match(action)) {\n clearListenerMiddleware();\n return;\n }\n if (removeListener.match(action)) {\n return stopListening(action.payload);\n }\n let originalState = api.getState();\n const getOriginalState = () => {\n if (originalState === INTERNAL_NIL_TOKEN) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(23) : `${alm}: getOriginalState can only be called synchronously`);\n }\n return originalState;\n };\n let result;\n try {\n result = next(action);\n if (listenerMap.size > 0) {\n const currentState = api.getState();\n const listenerEntries = Array.from(listenerMap.values());\n for (const entry of listenerEntries) {\n let runListener = false;\n try {\n runListener = entry.predicate(action, currentState, originalState);\n } catch (predicateError) {\n runListener = false;\n safelyNotifyError(onError, predicateError, {\n raisedBy: \"predicate\"\n });\n }\n if (!runListener) {\n continue;\n }\n notifyListener(entry, action, api, getOriginalState);\n }\n }\n } finally {\n originalState = INTERNAL_NIL_TOKEN;\n }\n return result;\n };\n return {\n middleware,\n startListening,\n stopListening,\n clearListeners: clearListenerMiddleware\n };\n};\n\n// src/dynamicMiddleware/index.ts\nimport { compose as compose3 } from \"redux\";\nvar createMiddlewareEntry = (middleware) => ({\n id: nanoid(),\n middleware,\n applied: /* @__PURE__ */ new Map()\n});\nvar matchInstance = (instanceId) => (action) => action?.meta?.instanceId === instanceId;\nvar createDynamicMiddleware = () => {\n const instanceId = nanoid();\n const middlewareMap = /* @__PURE__ */ new Map();\n const withMiddleware = Object.assign(createAction(\"dynamicMiddleware/add\", (...middlewares) => ({\n payload: middlewares,\n meta: {\n instanceId\n }\n })), {\n withTypes: () => withMiddleware\n });\n const addMiddleware = Object.assign(function addMiddleware2(...middlewares) {\n middlewares.forEach((middleware2) => {\n let entry = find(Array.from(middlewareMap.values()), (entry2) => entry2.middleware === middleware2);\n if (!entry) {\n entry = createMiddlewareEntry(middleware2);\n }\n middlewareMap.set(entry.id, entry);\n });\n }, {\n withTypes: () => addMiddleware\n });\n const getFinalMiddleware = (api) => {\n const appliedMiddleware = Array.from(middlewareMap.values()).map((entry) => emplace(entry.applied, api, {\n insert: () => entry.middleware(api)\n }));\n return compose3(...appliedMiddleware);\n };\n const isWithMiddleware = isAllOf(withMiddleware, matchInstance(instanceId));\n const middleware = (api) => (next) => (action) => {\n if (isWithMiddleware(action)) {\n addMiddleware(...action.payload);\n return api.dispatch;\n }\n return getFinalMiddleware(api)(next)(action);\n };\n return {\n middleware,\n addMiddleware,\n withMiddleware,\n instanceId\n };\n};\n\n// src/combineSlices.ts\nimport { combineReducers as combineReducers2 } from \"redux\";\nvar isSliceLike = (maybeSliceLike) => \"reducerPath\" in maybeSliceLike && typeof maybeSliceLike.reducerPath === \"string\";\nvar getReducers = (slices) => slices.flatMap((sliceOrMap) => isSliceLike(sliceOrMap) ? [[sliceOrMap.reducerPath, sliceOrMap.reducer]] : Object.entries(sliceOrMap));\nvar ORIGINAL_STATE = Symbol.for(\"rtk-state-proxy-original\");\nvar isStateProxy = (value) => !!value && !!value[ORIGINAL_STATE];\nvar stateProxyMap = /* @__PURE__ */ new WeakMap();\nvar createStateProxy = (state, reducerMap) => emplace(stateProxyMap, state, {\n insert: () => new Proxy(state, {\n get: (target, prop, receiver) => {\n if (prop === ORIGINAL_STATE)\n return target;\n const result = Reflect.get(target, prop, receiver);\n if (typeof result === \"undefined\") {\n const reducer = reducerMap[prop.toString()];\n if (reducer) {\n const reducerResult = reducer(void 0, {\n type: nanoid()\n });\n if (typeof reducerResult === \"undefined\") {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(24) : `The slice reducer for key \"${prop.toString()}\" returned undefined when called for selector(). If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value for this reducer, you can use null instead of undefined.`);\n }\n return reducerResult;\n }\n }\n return result;\n }\n })\n});\nvar original = (state) => {\n if (!isStateProxy(state)) {\n throw new Error(process.env.NODE_ENV === \"production\" ? formatProdErrorMessage(25) : \"original must be used on state Proxy\");\n }\n return state[ORIGINAL_STATE];\n};\nvar noopReducer = (state = {}) => state;\nfunction combineSlices(...slices) {\n const reducerMap = Object.fromEntries(getReducers(slices));\n const getReducer = () => Object.keys(reducerMap).length ? combineReducers2(reducerMap) : noopReducer;\n let reducer = getReducer();\n function combinedReducer(state, action) {\n return reducer(state, action);\n }\n combinedReducer.withLazyLoadedSlices = () => combinedReducer;\n const inject = (slice, config = {}) => {\n const {\n reducerPath,\n reducer: reducerToInject\n } = slice;\n const currentReducer = reducerMap[reducerPath];\n if (!config.overrideExisting && currentReducer && currentReducer !== reducerToInject) {\n if (typeof process !== \"undefined\" && process.env.NODE_ENV === \"development\") {\n console.error(`called \\`inject\\` to override already-existing reducer ${reducerPath} without specifying \\`overrideExisting: true\\``);\n }\n return combinedReducer;\n }\n reducerMap[reducerPath] = reducerToInject;\n reducer = getReducer();\n return combinedReducer;\n };\n const selector = Object.assign(function makeSelector(selectorFn, selectState) {\n return function selector2(state, ...args) {\n return selectorFn(createStateProxy(selectState ? selectState(state, ...args) : state, reducerMap), ...args);\n };\n }, {\n original\n });\n return Object.assign(combinedReducer, {\n inject,\n selector\n });\n}\n\n// src/formatProdErrorMessage.ts\nfunction formatProdErrorMessage(code) {\n return `Minified Redux Toolkit error #${code}; visit https://redux-toolkit.js.org/Errors?code=${code} for the full message or use the non-minified dev environment for full errors. `;\n}\nexport {\n ReducerType,\n SHOULD_AUTOBATCH,\n TaskAbortError,\n Tuple,\n addListener,\n asyncThunkCreator,\n autoBatchEnhancer,\n buildCreateSlice,\n clearAllListeners,\n combineSlices,\n configureStore,\n createAction,\n createActionCreatorInvariantMiddleware,\n createAsyncThunk,\n createDraftSafeSelector,\n createDraftSafeSelectorCreator,\n createDynamicMiddleware,\n createEntityAdapter,\n createImmutableStateInvariantMiddleware,\n createListenerMiddleware,\n produce as createNextState,\n createReducer,\n createSelector,\n createSelectorCreator2 as createSelectorCreator,\n createSerializableStateInvariantMiddleware,\n createSlice,\n current4 as current,\n findNonSerializableValue,\n formatProdErrorMessage,\n freeze,\n isActionCreator,\n isAllOf,\n isAnyOf,\n isAsyncThunkAction,\n isDraft6 as isDraft,\n isFSA as isFluxStandardAction,\n isFulfilled,\n isImmutableDefault,\n isPending,\n isPlain,\n isRejected,\n isRejectedWithValue,\n lruMemoize,\n miniSerializeError,\n nanoid,\n original2 as original,\n prepareAutoBatched,\n removeListener,\n unwrapResult,\n weakMapMemoize2 as weakMapMemoize\n};\n//# sourceMappingURL=redux-toolkit.modern.mjs.map","'use strict';\n\nexport default function bind(fn, thisArg) {\n return function wrap() {\n return fn.apply(thisArg, arguments);\n };\n}\n","'use strict';\n\nimport bind from './helpers/bind.js';\n\n// utils is a library of generic helper functions non-specific to axios\n\nconst {toString} = Object.prototype;\nconst {getPrototypeOf} = Object;\n\nconst kindOf = (cache => thing => {\n const str = toString.call(thing);\n return cache[str] || (cache[str] = str.slice(8, -1).toLowerCase());\n})(Object.create(null));\n\nconst kindOfTest = (type) => {\n type = type.toLowerCase();\n return (thing) => kindOf(thing) === type\n}\n\nconst typeOfTest = type => thing => typeof thing === type;\n\n/**\n * Determine if a value is an Array\n *\n * @param {Object} val The value to test\n *\n * @returns {boolean} True if value is an Array, otherwise false\n */\nconst {isArray} = Array;\n\n/**\n * Determine if a value is undefined\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if the value is undefined, otherwise false\n */\nconst isUndefined = typeOfTest('undefined');\n\n/**\n * Determine if a value is a Buffer\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a Buffer, otherwise false\n */\nfunction isBuffer(val) {\n return val !== null && !isUndefined(val) && val.constructor !== null && !isUndefined(val.constructor)\n && isFunction(val.constructor.isBuffer) && val.constructor.isBuffer(val);\n}\n\n/**\n * Determine if a value is an ArrayBuffer\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is an ArrayBuffer, otherwise false\n */\nconst isArrayBuffer = kindOfTest('ArrayBuffer');\n\n\n/**\n * Determine if a value is a view on an ArrayBuffer\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a view on an ArrayBuffer, otherwise false\n */\nfunction isArrayBufferView(val) {\n let result;\n if ((typeof ArrayBuffer !== 'undefined') && (ArrayBuffer.isView)) {\n result = ArrayBuffer.isView(val);\n } else {\n result = (val) && (val.buffer) && (isArrayBuffer(val.buffer));\n }\n return result;\n}\n\n/**\n * Determine if a value is a String\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a String, otherwise false\n */\nconst isString = typeOfTest('string');\n\n/**\n * Determine if a value is a Function\n *\n * @param {*} val The value to test\n * @returns {boolean} True if value is a Function, otherwise false\n */\nconst isFunction = typeOfTest('function');\n\n/**\n * Determine if a value is a Number\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a Number, otherwise false\n */\nconst isNumber = typeOfTest('number');\n\n/**\n * Determine if a value is an Object\n *\n * @param {*} thing The value to test\n *\n * @returns {boolean} True if value is an Object, otherwise false\n */\nconst isObject = (thing) => thing !== null && typeof thing === 'object';\n\n/**\n * Determine if a value is a Boolean\n *\n * @param {*} thing The value to test\n * @returns {boolean} True if value is a Boolean, otherwise false\n */\nconst isBoolean = thing => thing === true || thing === false;\n\n/**\n * Determine if a value is a plain Object\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a plain Object, otherwise false\n */\nconst isPlainObject = (val) => {\n if (kindOf(val) !== 'object') {\n return false;\n }\n\n const prototype = getPrototypeOf(val);\n return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in val) && !(Symbol.iterator in val);\n}\n\n/**\n * Determine if a value is a Date\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a Date, otherwise false\n */\nconst isDate = kindOfTest('Date');\n\n/**\n * Determine if a value is a File\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a File, otherwise false\n */\nconst isFile = kindOfTest('File');\n\n/**\n * Determine if a value is a Blob\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a Blob, otherwise false\n */\nconst isBlob = kindOfTest('Blob');\n\n/**\n * Determine if a value is a FileList\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a File, otherwise false\n */\nconst isFileList = kindOfTest('FileList');\n\n/**\n * Determine if a value is a Stream\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a Stream, otherwise false\n */\nconst isStream = (val) => isObject(val) && isFunction(val.pipe);\n\n/**\n * Determine if a value is a FormData\n *\n * @param {*} thing The value to test\n *\n * @returns {boolean} True if value is an FormData, otherwise false\n */\nconst isFormData = (thing) => {\n let kind;\n return thing && (\n (typeof FormData === 'function' && thing instanceof FormData) || (\n isFunction(thing.append) && (\n (kind = kindOf(thing)) === 'formdata' ||\n // detect form-data instance\n (kind === 'object' && isFunction(thing.toString) && thing.toString() === '[object FormData]')\n )\n )\n )\n}\n\n/**\n * Determine if a value is a URLSearchParams object\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a URLSearchParams object, otherwise false\n */\nconst isURLSearchParams = kindOfTest('URLSearchParams');\n\nconst [isReadableStream, isRequest, isResponse, isHeaders] = ['ReadableStream', 'Request', 'Response', 'Headers'].map(kindOfTest);\n\n/**\n * Trim excess whitespace off the beginning and end of a string\n *\n * @param {String} str The String to trim\n *\n * @returns {String} The String freed of excess whitespace\n */\nconst trim = (str) => str.trim ?\n str.trim() : str.replace(/^[\\s\\uFEFF\\xA0]+|[\\s\\uFEFF\\xA0]+$/g, '');\n\n/**\n * Iterate over an Array or an Object invoking a function for each item.\n *\n * If `obj` is an Array callback will be called passing\n * the value, index, and complete array for each item.\n *\n * If 'obj' is an Object callback will be called passing\n * the value, key, and complete object for each property.\n *\n * @param {Object|Array} obj The object to iterate\n * @param {Function} fn The callback to invoke for each item\n *\n * @param {Boolean} [allOwnKeys = false]\n * @returns {any}\n */\nfunction forEach(obj, fn, {allOwnKeys = false} = {}) {\n // Don't bother if no value provided\n if (obj === null || typeof obj === 'undefined') {\n return;\n }\n\n let i;\n let l;\n\n // Force an array if not already something iterable\n if (typeof obj !== 'object') {\n /*eslint no-param-reassign:0*/\n obj = [obj];\n }\n\n if (isArray(obj)) {\n // Iterate over array values\n for (i = 0, l = obj.length; i < l; i++) {\n fn.call(null, obj[i], i, obj);\n }\n } else {\n // Iterate over object keys\n const keys = allOwnKeys ? Object.getOwnPropertyNames(obj) : Object.keys(obj);\n const len = keys.length;\n let key;\n\n for (i = 0; i < len; i++) {\n key = keys[i];\n fn.call(null, obj[key], key, obj);\n }\n }\n}\n\nfunction findKey(obj, key) {\n key = key.toLowerCase();\n const keys = Object.keys(obj);\n let i = keys.length;\n let _key;\n while (i-- > 0) {\n _key = keys[i];\n if (key === _key.toLowerCase()) {\n return _key;\n }\n }\n return null;\n}\n\nconst _global = (() => {\n /*eslint no-undef:0*/\n if (typeof globalThis !== \"undefined\") return globalThis;\n return typeof self !== \"undefined\" ? self : (typeof window !== 'undefined' ? window : global)\n})();\n\nconst isContextDefined = (context) => !isUndefined(context) && context !== _global;\n\n/**\n * Accepts varargs expecting each argument to be an object, then\n * immutably merges the properties of each object and returns result.\n *\n * When multiple objects contain the same key the later object in\n * the arguments list will take precedence.\n *\n * Example:\n *\n * ```js\n * var result = merge({foo: 123}, {foo: 456});\n * console.log(result.foo); // outputs 456\n * ```\n *\n * @param {Object} obj1 Object to merge\n *\n * @returns {Object} Result of all merge properties\n */\nfunction merge(/* obj1, obj2, obj3, ... */) {\n const {caseless} = isContextDefined(this) && this || {};\n const result = {};\n const assignValue = (val, key) => {\n const targetKey = caseless && findKey(result, key) || key;\n if (isPlainObject(result[targetKey]) && isPlainObject(val)) {\n result[targetKey] = merge(result[targetKey], val);\n } else if (isPlainObject(val)) {\n result[targetKey] = merge({}, val);\n } else if (isArray(val)) {\n result[targetKey] = val.slice();\n } else {\n result[targetKey] = val;\n }\n }\n\n for (let i = 0, l = arguments.length; i < l; i++) {\n arguments[i] && forEach(arguments[i], assignValue);\n }\n return result;\n}\n\n/**\n * Extends object a by mutably adding to it the properties of object b.\n *\n * @param {Object} a The object to be extended\n * @param {Object} b The object to copy properties from\n * @param {Object} thisArg The object to bind function to\n *\n * @param {Boolean} [allOwnKeys]\n * @returns {Object} The resulting value of object a\n */\nconst extend = (a, b, thisArg, {allOwnKeys}= {}) => {\n forEach(b, (val, key) => {\n if (thisArg && isFunction(val)) {\n a[key] = bind(val, thisArg);\n } else {\n a[key] = val;\n }\n }, {allOwnKeys});\n return a;\n}\n\n/**\n * Remove byte order marker. This catches EF BB BF (the UTF-8 BOM)\n *\n * @param {string} content with BOM\n *\n * @returns {string} content value without BOM\n */\nconst stripBOM = (content) => {\n if (content.charCodeAt(0) === 0xFEFF) {\n content = content.slice(1);\n }\n return content;\n}\n\n/**\n * Inherit the prototype methods from one constructor into another\n * @param {function} constructor\n * @param {function} superConstructor\n * @param {object} [props]\n * @param {object} [descriptors]\n *\n * @returns {void}\n */\nconst inherits = (constructor, superConstructor, props, descriptors) => {\n constructor.prototype = Object.create(superConstructor.prototype, descriptors);\n constructor.prototype.constructor = constructor;\n Object.defineProperty(constructor, 'super', {\n value: superConstructor.prototype\n });\n props && Object.assign(constructor.prototype, props);\n}\n\n/**\n * Resolve object with deep prototype chain to a flat object\n * @param {Object} sourceObj source object\n * @param {Object} [destObj]\n * @param {Function|Boolean} [filter]\n * @param {Function} [propFilter]\n *\n * @returns {Object}\n */\nconst toFlatObject = (sourceObj, destObj, filter, propFilter) => {\n let props;\n let i;\n let prop;\n const merged = {};\n\n destObj = destObj || {};\n // eslint-disable-next-line no-eq-null,eqeqeq\n if (sourceObj == null) return destObj;\n\n do {\n props = Object.getOwnPropertyNames(sourceObj);\n i = props.length;\n while (i-- > 0) {\n prop = props[i];\n if ((!propFilter || propFilter(prop, sourceObj, destObj)) && !merged[prop]) {\n destObj[prop] = sourceObj[prop];\n merged[prop] = true;\n }\n }\n sourceObj = filter !== false && getPrototypeOf(sourceObj);\n } while (sourceObj && (!filter || filter(sourceObj, destObj)) && sourceObj !== Object.prototype);\n\n return destObj;\n}\n\n/**\n * Determines whether a string ends with the characters of a specified string\n *\n * @param {String} str\n * @param {String} searchString\n * @param {Number} [position= 0]\n *\n * @returns {boolean}\n */\nconst endsWith = (str, searchString, position) => {\n str = String(str);\n if (position === undefined || position > str.length) {\n position = str.length;\n }\n position -= searchString.length;\n const lastIndex = str.indexOf(searchString, position);\n return lastIndex !== -1 && lastIndex === position;\n}\n\n\n/**\n * Returns new array from array like object or null if failed\n *\n * @param {*} [thing]\n *\n * @returns {?Array}\n */\nconst toArray = (thing) => {\n if (!thing) return null;\n if (isArray(thing)) return thing;\n let i = thing.length;\n if (!isNumber(i)) return null;\n const arr = new Array(i);\n while (i-- > 0) {\n arr[i] = thing[i];\n }\n return arr;\n}\n\n/**\n * Checking if the Uint8Array exists and if it does, it returns a function that checks if the\n * thing passed in is an instance of Uint8Array\n *\n * @param {TypedArray}\n *\n * @returns {Array}\n */\n// eslint-disable-next-line func-names\nconst isTypedArray = (TypedArray => {\n // eslint-disable-next-line func-names\n return thing => {\n return TypedArray && thing instanceof TypedArray;\n };\n})(typeof Uint8Array !== 'undefined' && getPrototypeOf(Uint8Array));\n\n/**\n * For each entry in the object, call the function with the key and value.\n *\n * @param {Object} obj - The object to iterate over.\n * @param {Function} fn - The function to call for each entry.\n *\n * @returns {void}\n */\nconst forEachEntry = (obj, fn) => {\n const generator = obj && obj[Symbol.iterator];\n\n const iterator = generator.call(obj);\n\n let result;\n\n while ((result = iterator.next()) && !result.done) {\n const pair = result.value;\n fn.call(obj, pair[0], pair[1]);\n }\n}\n\n/**\n * It takes a regular expression and a string, and returns an array of all the matches\n *\n * @param {string} regExp - The regular expression to match against.\n * @param {string} str - The string to search.\n *\n * @returns {Array}\n */\nconst matchAll = (regExp, str) => {\n let matches;\n const arr = [];\n\n while ((matches = regExp.exec(str)) !== null) {\n arr.push(matches);\n }\n\n return arr;\n}\n\n/* Checking if the kindOfTest function returns true when passed an HTMLFormElement. */\nconst isHTMLForm = kindOfTest('HTMLFormElement');\n\nconst toCamelCase = str => {\n return str.toLowerCase().replace(/[-_\\s]([a-z\\d])(\\w*)/g,\n function replacer(m, p1, p2) {\n return p1.toUpperCase() + p2;\n }\n );\n};\n\n/* Creating a function that will check if an object has a property. */\nconst hasOwnProperty = (({hasOwnProperty}) => (obj, prop) => hasOwnProperty.call(obj, prop))(Object.prototype);\n\n/**\n * Determine if a value is a RegExp object\n *\n * @param {*} val The value to test\n *\n * @returns {boolean} True if value is a RegExp object, otherwise false\n */\nconst isRegExp = kindOfTest('RegExp');\n\nconst reduceDescriptors = (obj, reducer) => {\n const descriptors = Object.getOwnPropertyDescriptors(obj);\n const reducedDescriptors = {};\n\n forEach(descriptors, (descriptor, name) => {\n let ret;\n if ((ret = reducer(descriptor, name, obj)) !== false) {\n reducedDescriptors[name] = ret || descriptor;\n }\n });\n\n Object.defineProperties(obj, reducedDescriptors);\n}\n\n/**\n * Makes all methods read-only\n * @param {Object} obj\n */\n\nconst freezeMethods = (obj) => {\n reduceDescriptors(obj, (descriptor, name) => {\n // skip restricted props in strict mode\n if (isFunction(obj) && ['arguments', 'caller', 'callee'].indexOf(name) !== -1) {\n return false;\n }\n\n const value = obj[name];\n\n if (!isFunction(value)) return;\n\n descriptor.enumerable = false;\n\n if ('writable' in descriptor) {\n descriptor.writable = false;\n return;\n }\n\n if (!descriptor.set) {\n descriptor.set = () => {\n throw Error('Can not rewrite read-only method \\'' + name + '\\'');\n };\n }\n });\n}\n\nconst toObjectSet = (arrayOrString, delimiter) => {\n const obj = {};\n\n const define = (arr) => {\n arr.forEach(value => {\n obj[value] = true;\n });\n }\n\n isArray(arrayOrString) ? define(arrayOrString) : define(String(arrayOrString).split(delimiter));\n\n return obj;\n}\n\nconst noop = () => {}\n\nconst toFiniteNumber = (value, defaultValue) => {\n return value != null && Number.isFinite(value = +value) ? value : defaultValue;\n}\n\nconst ALPHA = 'abcdefghijklmnopqrstuvwxyz'\n\nconst DIGIT = '0123456789';\n\nconst ALPHABET = {\n DIGIT,\n ALPHA,\n ALPHA_DIGIT: ALPHA + ALPHA.toUpperCase() + DIGIT\n}\n\nconst generateString = (size = 16, alphabet = ALPHABET.ALPHA_DIGIT) => {\n let str = '';\n const {length} = alphabet;\n while (size--) {\n str += alphabet[Math.random() * length|0]\n }\n\n return str;\n}\n\n/**\n * If the thing is a FormData object, return true, otherwise return false.\n *\n * @param {unknown} thing - The thing to check.\n *\n * @returns {boolean}\n */\nfunction isSpecCompliantForm(thing) {\n return !!(thing && isFunction(thing.append) && thing[Symbol.toStringTag] === 'FormData' && thing[Symbol.iterator]);\n}\n\nconst toJSONObject = (obj) => {\n const stack = new Array(10);\n\n const visit = (source, i) => {\n\n if (isObject(source)) {\n if (stack.indexOf(source) >= 0) {\n return;\n }\n\n if(!('toJSON' in source)) {\n stack[i] = source;\n const target = isArray(source) ? [] : {};\n\n forEach(source, (value, key) => {\n const reducedValue = visit(value, i + 1);\n !isUndefined(reducedValue) && (target[key] = reducedValue);\n });\n\n stack[i] = undefined;\n\n return target;\n }\n }\n\n return source;\n }\n\n return visit(obj, 0);\n}\n\nconst isAsyncFn = kindOfTest('AsyncFunction');\n\nconst isThenable = (thing) =>\n thing && (isObject(thing) || isFunction(thing)) && isFunction(thing.then) && isFunction(thing.catch);\n\nexport default {\n isArray,\n isArrayBuffer,\n isBuffer,\n isFormData,\n isArrayBufferView,\n isString,\n isNumber,\n isBoolean,\n isObject,\n isPlainObject,\n isReadableStream,\n isRequest,\n isResponse,\n isHeaders,\n isUndefined,\n isDate,\n isFile,\n isBlob,\n isRegExp,\n isFunction,\n isStream,\n isURLSearchParams,\n isTypedArray,\n isFileList,\n forEach,\n merge,\n extend,\n trim,\n stripBOM,\n inherits,\n toFlatObject,\n kindOf,\n kindOfTest,\n endsWith,\n toArray,\n forEachEntry,\n matchAll,\n isHTMLForm,\n hasOwnProperty,\n hasOwnProp: hasOwnProperty, // an alias to avoid ESLint no-prototype-builtins detection\n reduceDescriptors,\n freezeMethods,\n toObjectSet,\n toCamelCase,\n noop,\n toFiniteNumber,\n findKey,\n global: _global,\n isContextDefined,\n ALPHABET,\n generateString,\n isSpecCompliantForm,\n toJSONObject,\n isAsyncFn,\n isThenable\n};\n","'use strict';\n\nimport utils from '../utils.js';\n\n/**\n * Create an Error with the specified message, config, error code, request and response.\n *\n * @param {string} message The error message.\n * @param {string} [code] The error code (for example, 'ECONNABORTED').\n * @param {Object} [config] The config.\n * @param {Object} [request] The request.\n * @param {Object} [response] The response.\n *\n * @returns {Error} The created error.\n */\nfunction AxiosError(message, code, config, request, response) {\n Error.call(this);\n\n if (Error.captureStackTrace) {\n Error.captureStackTrace(this, this.constructor);\n } else {\n this.stack = (new Error()).stack;\n }\n\n this.message = message;\n this.name = 'AxiosError';\n code && (this.code = code);\n config && (this.config = config);\n request && (this.request = request);\n response && (this.response = response);\n}\n\nutils.inherits(AxiosError, Error, {\n toJSON: function toJSON() {\n return {\n // Standard\n message: this.message,\n name: this.name,\n // Microsoft\n description: this.description,\n number: this.number,\n // Mozilla\n fileName: this.fileName,\n lineNumber: this.lineNumber,\n columnNumber: this.columnNumber,\n stack: this.stack,\n // Axios\n config: utils.toJSONObject(this.config),\n code: this.code,\n status: this.response && this.response.status ? this.response.status : null\n };\n }\n});\n\nconst prototype = AxiosError.prototype;\nconst descriptors = {};\n\n[\n 'ERR_BAD_OPTION_VALUE',\n 'ERR_BAD_OPTION',\n 'ECONNABORTED',\n 'ETIMEDOUT',\n 'ERR_NETWORK',\n 'ERR_FR_TOO_MANY_REDIRECTS',\n 'ERR_DEPRECATED',\n 'ERR_BAD_RESPONSE',\n 'ERR_BAD_REQUEST',\n 'ERR_CANCELED',\n 'ERR_NOT_SUPPORT',\n 'ERR_INVALID_URL'\n// eslint-disable-next-line func-names\n].forEach(code => {\n descriptors[code] = {value: code};\n});\n\nObject.defineProperties(AxiosError, descriptors);\nObject.defineProperty(prototype, 'isAxiosError', {value: true});\n\n// eslint-disable-next-line func-names\nAxiosError.from = (error, code, config, request, response, customProps) => {\n const axiosError = Object.create(prototype);\n\n utils.toFlatObject(error, axiosError, function filter(obj) {\n return obj !== Error.prototype;\n }, prop => {\n return prop !== 'isAxiosError';\n });\n\n AxiosError.call(axiosError, error.message, code, config, request, response);\n\n axiosError.cause = error;\n\n axiosError.name = error.name;\n\n customProps && Object.assign(axiosError, customProps);\n\n return axiosError;\n};\n\nexport default AxiosError;\n","// eslint-disable-next-line strict\nexport default null;\n","'use strict';\n\nimport utils from '../utils.js';\nimport AxiosError from '../core/AxiosError.js';\n// temporary hotfix to avoid circular references until AxiosURLSearchParams is refactored\nimport PlatformFormData from '../platform/node/classes/FormData.js';\n\n/**\n * Determines if the given thing is a array or js object.\n *\n * @param {string} thing - The object or array to be visited.\n *\n * @returns {boolean}\n */\nfunction isVisitable(thing) {\n return utils.isPlainObject(thing) || utils.isArray(thing);\n}\n\n/**\n * It removes the brackets from the end of a string\n *\n * @param {string} key - The key of the parameter.\n *\n * @returns {string} the key without the brackets.\n */\nfunction removeBrackets(key) {\n return utils.endsWith(key, '[]') ? key.slice(0, -2) : key;\n}\n\n/**\n * It takes a path, a key, and a boolean, and returns a string\n *\n * @param {string} path - The path to the current key.\n * @param {string} key - The key of the current object being iterated over.\n * @param {string} dots - If true, the key will be rendered with dots instead of brackets.\n *\n * @returns {string} The path to the current key.\n */\nfunction renderKey(path, key, dots) {\n if (!path) return key;\n return path.concat(key).map(function each(token, i) {\n // eslint-disable-next-line no-param-reassign\n token = removeBrackets(token);\n return !dots && i ? '[' + token + ']' : token;\n }).join(dots ? '.' : '');\n}\n\n/**\n * If the array is an array and none of its elements are visitable, then it's a flat array.\n *\n * @param {Array} arr - The array to check\n *\n * @returns {boolean}\n */\nfunction isFlatArray(arr) {\n return utils.isArray(arr) && !arr.some(isVisitable);\n}\n\nconst predicates = utils.toFlatObject(utils, {}, null, function filter(prop) {\n return /^is[A-Z]/.test(prop);\n});\n\n/**\n * Convert a data object to FormData\n *\n * @param {Object} obj\n * @param {?Object} [formData]\n * @param {?Object} [options]\n * @param {Function} [options.visitor]\n * @param {Boolean} [options.metaTokens = true]\n * @param {Boolean} [options.dots = false]\n * @param {?Boolean} [options.indexes = false]\n *\n * @returns {Object}\n **/\n\n/**\n * It converts an object into a FormData object\n *\n * @param {Object} obj - The object to convert to form data.\n * @param {string} formData - The FormData object to append to.\n * @param {Object} options\n *\n * @returns\n */\nfunction toFormData(obj, formData, options) {\n if (!utils.isObject(obj)) {\n throw new TypeError('target must be an object');\n }\n\n // eslint-disable-next-line no-param-reassign\n formData = formData || new (PlatformFormData || FormData)();\n\n // eslint-disable-next-line no-param-reassign\n options = utils.toFlatObject(options, {\n metaTokens: true,\n dots: false,\n indexes: false\n }, false, function defined(option, source) {\n // eslint-disable-next-line no-eq-null,eqeqeq\n return !utils.isUndefined(source[option]);\n });\n\n const metaTokens = options.metaTokens;\n // eslint-disable-next-line no-use-before-define\n const visitor = options.visitor || defaultVisitor;\n const dots = options.dots;\n const indexes = options.indexes;\n const _Blob = options.Blob || typeof Blob !== 'undefined' && Blob;\n const useBlob = _Blob && utils.isSpecCompliantForm(formData);\n\n if (!utils.isFunction(visitor)) {\n throw new TypeError('visitor must be a function');\n }\n\n function convertValue(value) {\n if (value === null) return '';\n\n if (utils.isDate(value)) {\n return value.toISOString();\n }\n\n if (!useBlob && utils.isBlob(value)) {\n throw new AxiosError('Blob is not supported. Use a Buffer instead.');\n }\n\n if (utils.isArrayBuffer(value) || utils.isTypedArray(value)) {\n return useBlob && typeof Blob === 'function' ? new Blob([value]) : Buffer.from(value);\n }\n\n return value;\n }\n\n /**\n * Default visitor.\n *\n * @param {*} value\n * @param {String|Number} key\n * @param {Array} path\n * @this {FormData}\n *\n * @returns {boolean} return true to visit the each prop of the value recursively\n */\n function defaultVisitor(value, key, path) {\n let arr = value;\n\n if (value && !path && typeof value === 'object') {\n if (utils.endsWith(key, '{}')) {\n // eslint-disable-next-line no-param-reassign\n key = metaTokens ? key : key.slice(0, -2);\n // eslint-disable-next-line no-param-reassign\n value = JSON.stringify(value);\n } else if (\n (utils.isArray(value) && isFlatArray(value)) ||\n ((utils.isFileList(value) || utils.endsWith(key, '[]')) && (arr = utils.toArray(value))\n )) {\n // eslint-disable-next-line no-param-reassign\n key = removeBrackets(key);\n\n arr.forEach(function each(el, index) {\n !(utils.isUndefined(el) || el === null) && formData.append(\n // eslint-disable-next-line no-nested-ternary\n indexes === true ? renderKey([key], index, dots) : (indexes === null ? key : key + '[]'),\n convertValue(el)\n );\n });\n return false;\n }\n }\n\n if (isVisitable(value)) {\n return true;\n }\n\n formData.append(renderKey(path, key, dots), convertValue(value));\n\n return false;\n }\n\n const stack = [];\n\n const exposedHelpers = Object.assign(predicates, {\n defaultVisitor,\n convertValue,\n isVisitable\n });\n\n function build(value, path) {\n if (utils.isUndefined(value)) return;\n\n if (stack.indexOf(value) !== -1) {\n throw Error('Circular reference detected in ' + path.join('.'));\n }\n\n stack.push(value);\n\n utils.forEach(value, function each(el, key) {\n const result = !(utils.isUndefined(el) || el === null) && visitor.call(\n formData, el, utils.isString(key) ? key.trim() : key, path, exposedHelpers\n );\n\n if (result === true) {\n build(el, path ? path.concat(key) : [key]);\n }\n });\n\n stack.pop();\n }\n\n if (!utils.isObject(obj)) {\n throw new TypeError('data must be an object');\n }\n\n build(obj);\n\n return formData;\n}\n\nexport default toFormData;\n","'use strict';\n\nimport toFormData from './toFormData.js';\n\n/**\n * It encodes a string by replacing all characters that are not in the unreserved set with\n * their percent-encoded equivalents\n *\n * @param {string} str - The string to encode.\n *\n * @returns {string} The encoded string.\n */\nfunction encode(str) {\n const charMap = {\n '!': '%21',\n \"'\": '%27',\n '(': '%28',\n ')': '%29',\n '~': '%7E',\n '%20': '+',\n '%00': '\\x00'\n };\n return encodeURIComponent(str).replace(/[!'()~]|%20|%00/g, function replacer(match) {\n return charMap[match];\n });\n}\n\n/**\n * It takes a params object and converts it to a FormData object\n *\n * @param {Object} params - The parameters to be converted to a FormData object.\n * @param {Object} options - The options object passed to the Axios constructor.\n *\n * @returns {void}\n */\nfunction AxiosURLSearchParams(params, options) {\n this._pairs = [];\n\n params && toFormData(params, this, options);\n}\n\nconst prototype = AxiosURLSearchParams.prototype;\n\nprototype.append = function append(name, value) {\n this._pairs.push([name, value]);\n};\n\nprototype.toString = function toString(encoder) {\n const _encode = encoder ? function(value) {\n return encoder.call(this, value, encode);\n } : encode;\n\n return this._pairs.map(function each(pair) {\n return _encode(pair[0]) + '=' + _encode(pair[1]);\n }, '').join('&');\n};\n\nexport default AxiosURLSearchParams;\n","'use strict';\n\nimport utils from '../utils.js';\nimport AxiosURLSearchParams from '../helpers/AxiosURLSearchParams.js';\n\n/**\n * It replaces all instances of the characters `:`, `$`, `,`, `+`, `[`, and `]` with their\n * URI encoded counterparts\n *\n * @param {string} val The value to be encoded.\n *\n * @returns {string} The encoded value.\n */\nfunction encode(val) {\n return encodeURIComponent(val).\n replace(/%3A/gi, ':').\n replace(/%24/g, '$').\n replace(/%2C/gi, ',').\n replace(/%20/g, '+').\n replace(/%5B/gi, '[').\n replace(/%5D/gi, ']');\n}\n\n/**\n * Build a URL by appending params to the end\n *\n * @param {string} url The base of the url (e.g., http://www.google.com)\n * @param {object} [params] The params to be appended\n * @param {?object} options\n *\n * @returns {string} The formatted url\n */\nexport default function buildURL(url, params, options) {\n /*eslint no-param-reassign:0*/\n if (!params) {\n return url;\n }\n \n const _encode = options && options.encode || encode;\n\n const serializeFn = options && options.serialize;\n\n let serializedParams;\n\n if (serializeFn) {\n serializedParams = serializeFn(params, options);\n } else {\n serializedParams = utils.isURLSearchParams(params) ?\n params.toString() :\n new AxiosURLSearchParams(params, options).toString(_encode);\n }\n\n if (serializedParams) {\n const hashmarkIndex = url.indexOf(\"#\");\n\n if (hashmarkIndex !== -1) {\n url = url.slice(0, hashmarkIndex);\n }\n url += (url.indexOf('?') === -1 ? '?' : '&') + serializedParams;\n }\n\n return url;\n}\n","'use strict';\n\nimport utils from './../utils.js';\n\nclass InterceptorManager {\n constructor() {\n this.handlers = [];\n }\n\n /**\n * Add a new interceptor to the stack\n *\n * @param {Function} fulfilled The function to handle `then` for a `Promise`\n * @param {Function} rejected The function to handle `reject` for a `Promise`\n *\n * @return {Number} An ID used to remove interceptor later\n */\n use(fulfilled, rejected, options) {\n this.handlers.push({\n fulfilled,\n rejected,\n synchronous: options ? options.synchronous : false,\n runWhen: options ? options.runWhen : null\n });\n return this.handlers.length - 1;\n }\n\n /**\n * Remove an interceptor from the stack\n *\n * @param {Number} id The ID that was returned by `use`\n *\n * @returns {Boolean} `true` if the interceptor was removed, `false` otherwise\n */\n eject(id) {\n if (this.handlers[id]) {\n this.handlers[id] = null;\n }\n }\n\n /**\n * Clear all interceptors from the stack\n *\n * @returns {void}\n */\n clear() {\n if (this.handlers) {\n this.handlers = [];\n }\n }\n\n /**\n * Iterate over all the registered interceptors\n *\n * This method is particularly useful for skipping over any\n * interceptors that may have become `null` calling `eject`.\n *\n * @param {Function} fn The function to call for each interceptor\n *\n * @returns {void}\n */\n forEach(fn) {\n utils.forEach(this.handlers, function forEachHandler(h) {\n if (h !== null) {\n fn(h);\n }\n });\n }\n}\n\nexport default InterceptorManager;\n","'use strict';\n\nexport default {\n silentJSONParsing: true,\n forcedJSONParsing: true,\n clarifyTimeoutError: false\n};\n","'use strict';\n\nimport AxiosURLSearchParams from '../../../helpers/AxiosURLSearchParams.js';\nexport default typeof URLSearchParams !== 'undefined' ? URLSearchParams : AxiosURLSearchParams;\n","'use strict';\n\nexport default typeof FormData !== 'undefined' ? FormData : null;\n","'use strict'\n\nexport default typeof Blob !== 'undefined' ? Blob : null\n","import URLSearchParams from './classes/URLSearchParams.js'\nimport FormData from './classes/FormData.js'\nimport Blob from './classes/Blob.js'\n\nexport default {\n isBrowser: true,\n classes: {\n URLSearchParams,\n FormData,\n Blob\n },\n protocols: ['http', 'https', 'file', 'blob', 'url', 'data']\n};\n","const hasBrowserEnv = typeof window !== 'undefined' && typeof document !== 'undefined';\n\n/**\n * Determine if we're running in a standard browser environment\n *\n * This allows axios to run in a web worker, and react-native.\n * Both environments support XMLHttpRequest, but not fully standard globals.\n *\n * web workers:\n * typeof window -> undefined\n * typeof document -> undefined\n *\n * react-native:\n * navigator.product -> 'ReactNative'\n * nativescript\n * navigator.product -> 'NativeScript' or 'NS'\n *\n * @returns {boolean}\n */\nconst hasStandardBrowserEnv = (\n (product) => {\n return hasBrowserEnv && ['ReactNative', 'NativeScript', 'NS'].indexOf(product) < 0\n })(typeof navigator !== 'undefined' && navigator.product);\n\n/**\n * Determine if we're running in a standard browser webWorker environment\n *\n * Although the `isStandardBrowserEnv` method indicates that\n * `allows axios to run in a web worker`, the WebWorker will still be\n * filtered out due to its judgment standard\n * `typeof window !== 'undefined' && typeof document !== 'undefined'`.\n * This leads to a problem when axios post `FormData` in webWorker\n */\nconst hasStandardBrowserWebWorkerEnv = (() => {\n return (\n typeof WorkerGlobalScope !== 'undefined' &&\n // eslint-disable-next-line no-undef\n self instanceof WorkerGlobalScope &&\n typeof self.importScripts === 'function'\n );\n})();\n\nconst origin = hasBrowserEnv && window.location.href || 'http://localhost';\n\nexport {\n hasBrowserEnv,\n hasStandardBrowserWebWorkerEnv,\n hasStandardBrowserEnv,\n origin\n}\n","import platform from './node/index.js';\nimport * as utils from './common/utils.js';\n\nexport default {\n ...utils,\n ...platform\n}\n","'use strict';\n\nimport utils from '../utils.js';\nimport toFormData from './toFormData.js';\nimport platform from '../platform/index.js';\n\nexport default function toURLEncodedForm(data, options) {\n return toFormData(data, new platform.classes.URLSearchParams(), Object.assign({\n visitor: function(value, key, path, helpers) {\n if (platform.isNode && utils.isBuffer(value)) {\n this.append(key, value.toString('base64'));\n return false;\n }\n\n return helpers.defaultVisitor.apply(this, arguments);\n }\n }, options));\n}\n","'use strict';\n\nimport utils from '../utils.js';\n\n/**\n * It takes a string like `foo[x][y][z]` and returns an array like `['foo', 'x', 'y', 'z']\n *\n * @param {string} name - The name of the property to get.\n *\n * @returns An array of strings.\n */\nfunction parsePropPath(name) {\n // foo[x][y][z]\n // foo.x.y.z\n // foo-x-y-z\n // foo x y z\n return utils.matchAll(/\\w+|\\[(\\w*)]/g, name).map(match => {\n return match[0] === '[]' ? '' : match[1] || match[0];\n });\n}\n\n/**\n * Convert an array to an object.\n *\n * @param {Array} arr - The array to convert to an object.\n *\n * @returns An object with the same keys and values as the array.\n */\nfunction arrayToObject(arr) {\n const obj = {};\n const keys = Object.keys(arr);\n let i;\n const len = keys.length;\n let key;\n for (i = 0; i < len; i++) {\n key = keys[i];\n obj[key] = arr[key];\n }\n return obj;\n}\n\n/**\n * It takes a FormData object and returns a JavaScript object\n *\n * @param {string} formData The FormData object to convert to JSON.\n *\n * @returns {Object | null} The converted object.\n */\nfunction formDataToJSON(formData) {\n function buildPath(path, value, target, index) {\n let name = path[index++];\n\n if (name === '__proto__') return true;\n\n const isNumericKey = Number.isFinite(+name);\n const isLast = index >= path.length;\n name = !name && utils.isArray(target) ? target.length : name;\n\n if (isLast) {\n if (utils.hasOwnProp(target, name)) {\n target[name] = [target[name], value];\n } else {\n target[name] = value;\n }\n\n return !isNumericKey;\n }\n\n if (!target[name] || !utils.isObject(target[name])) {\n target[name] = [];\n }\n\n const result = buildPath(path, value, target[name], index);\n\n if (result && utils.isArray(target[name])) {\n target[name] = arrayToObject(target[name]);\n }\n\n return !isNumericKey;\n }\n\n if (utils.isFormData(formData) && utils.isFunction(formData.entries)) {\n const obj = {};\n\n utils.forEachEntry(formData, (name, value) => {\n buildPath(parsePropPath(name), value, obj, 0);\n });\n\n return obj;\n }\n\n return null;\n}\n\nexport default formDataToJSON;\n","'use strict';\n\nimport utils from '../utils.js';\nimport AxiosError from '../core/AxiosError.js';\nimport transitionalDefaults from './transitional.js';\nimport toFormData from '../helpers/toFormData.js';\nimport toURLEncodedForm from '../helpers/toURLEncodedForm.js';\nimport platform from '../platform/index.js';\nimport formDataToJSON from '../helpers/formDataToJSON.js';\n\n/**\n * It takes a string, tries to parse it, and if it fails, it returns the stringified version\n * of the input\n *\n * @param {any} rawValue - The value to be stringified.\n * @param {Function} parser - A function that parses a string into a JavaScript object.\n * @param {Function} encoder - A function that takes a value and returns a string.\n *\n * @returns {string} A stringified version of the rawValue.\n */\nfunction stringifySafely(rawValue, parser, encoder) {\n if (utils.isString(rawValue)) {\n try {\n (parser || JSON.parse)(rawValue);\n return utils.trim(rawValue);\n } catch (e) {\n if (e.name !== 'SyntaxError') {\n throw e;\n }\n }\n }\n\n return (encoder || JSON.stringify)(rawValue);\n}\n\nconst defaults = {\n\n transitional: transitionalDefaults,\n\n adapter: ['xhr', 'http', 'fetch'],\n\n transformRequest: [function transformRequest(data, headers) {\n const contentType = headers.getContentType() || '';\n const hasJSONContentType = contentType.indexOf('application/json') > -1;\n const isObjectPayload = utils.isObject(data);\n\n if (isObjectPayload && utils.isHTMLForm(data)) {\n data = new FormData(data);\n }\n\n const isFormData = utils.isFormData(data);\n\n if (isFormData) {\n return hasJSONContentType ? JSON.stringify(formDataToJSON(data)) : data;\n }\n\n if (utils.isArrayBuffer(data) ||\n utils.isBuffer(data) ||\n utils.isStream(data) ||\n utils.isFile(data) ||\n utils.isBlob(data) ||\n utils.isReadableStream(data)\n ) {\n return data;\n }\n if (utils.isArrayBufferView(data)) {\n return data.buffer;\n }\n if (utils.isURLSearchParams(data)) {\n headers.setContentType('application/x-www-form-urlencoded;charset=utf-8', false);\n return data.toString();\n }\n\n let isFileList;\n\n if (isObjectPayload) {\n if (contentType.indexOf('application/x-www-form-urlencoded') > -1) {\n return toURLEncodedForm(data, this.formSerializer).toString();\n }\n\n if ((isFileList = utils.isFileList(data)) || contentType.indexOf('multipart/form-data') > -1) {\n const _FormData = this.env && this.env.FormData;\n\n return toFormData(\n isFileList ? {'files[]': data} : data,\n _FormData && new _FormData(),\n this.formSerializer\n );\n }\n }\n\n if (isObjectPayload || hasJSONContentType ) {\n headers.setContentType('application/json', false);\n return stringifySafely(data);\n }\n\n return data;\n }],\n\n transformResponse: [function transformResponse(data) {\n const transitional = this.transitional || defaults.transitional;\n const forcedJSONParsing = transitional && transitional.forcedJSONParsing;\n const JSONRequested = this.responseType === 'json';\n\n if (utils.isResponse(data) || utils.isReadableStream(data)) {\n return data;\n }\n\n if (data && utils.isString(data) && ((forcedJSONParsing && !this.responseType) || JSONRequested)) {\n const silentJSONParsing = transitional && transitional.silentJSONParsing;\n const strictJSONParsing = !silentJSONParsing && JSONRequested;\n\n try {\n return JSON.parse(data);\n } catch (e) {\n if (strictJSONParsing) {\n if (e.name === 'SyntaxError') {\n throw AxiosError.from(e, AxiosError.ERR_BAD_RESPONSE, this, null, this.response);\n }\n throw e;\n }\n }\n }\n\n return data;\n }],\n\n /**\n * A timeout in milliseconds to abort a request. If set to 0 (default) a\n * timeout is not created.\n */\n timeout: 0,\n\n xsrfCookieName: 'XSRF-TOKEN',\n xsrfHeaderName: 'X-XSRF-TOKEN',\n\n maxContentLength: -1,\n maxBodyLength: -1,\n\n env: {\n FormData: platform.classes.FormData,\n Blob: platform.classes.Blob\n },\n\n validateStatus: function validateStatus(status) {\n return status >= 200 && status < 300;\n },\n\n headers: {\n common: {\n 'Accept': 'application/json, text/plain, */*',\n 'Content-Type': undefined\n }\n }\n};\n\nutils.forEach(['delete', 'get', 'head', 'post', 'put', 'patch'], (method) => {\n defaults.headers[method] = {};\n});\n\nexport default defaults;\n","'use strict';\n\nimport utils from './../utils.js';\n\n// RawAxiosHeaders whose duplicates are ignored by node\n// c.f. https://nodejs.org/api/http.html#http_message_headers\nconst ignoreDuplicateOf = utils.toObjectSet([\n 'age', 'authorization', 'content-length', 'content-type', 'etag',\n 'expires', 'from', 'host', 'if-modified-since', 'if-unmodified-since',\n 'last-modified', 'location', 'max-forwards', 'proxy-authorization',\n 'referer', 'retry-after', 'user-agent'\n]);\n\n/**\n * Parse headers into an object\n *\n * ```\n * Date: Wed, 27 Aug 2014 08:58:49 GMT\n * Content-Type: application/json\n * Connection: keep-alive\n * Transfer-Encoding: chunked\n * ```\n *\n * @param {String} rawHeaders Headers needing to be parsed\n *\n * @returns {Object} Headers parsed into an object\n */\nexport default rawHeaders => {\n const parsed = {};\n let key;\n let val;\n let i;\n\n rawHeaders && rawHeaders.split('\\n').forEach(function parser(line) {\n i = line.indexOf(':');\n key = line.substring(0, i).trim().toLowerCase();\n val = line.substring(i + 1).trim();\n\n if (!key || (parsed[key] && ignoreDuplicateOf[key])) {\n return;\n }\n\n if (key === 'set-cookie') {\n if (parsed[key]) {\n parsed[key].push(val);\n } else {\n parsed[key] = [val];\n }\n } else {\n parsed[key] = parsed[key] ? parsed[key] + ', ' + val : val;\n }\n });\n\n return parsed;\n};\n","'use strict';\n\nimport utils from '../utils.js';\nimport parseHeaders from '../helpers/parseHeaders.js';\n\nconst $internals = Symbol('internals');\n\nfunction normalizeHeader(header) {\n return header && String(header).trim().toLowerCase();\n}\n\nfunction normalizeValue(value) {\n if (value === false || value == null) {\n return value;\n }\n\n return utils.isArray(value) ? value.map(normalizeValue) : String(value);\n}\n\nfunction parseTokens(str) {\n const tokens = Object.create(null);\n const tokensRE = /([^\\s,;=]+)\\s*(?:=\\s*([^,;]+))?/g;\n let match;\n\n while ((match = tokensRE.exec(str))) {\n tokens[match[1]] = match[2];\n }\n\n return tokens;\n}\n\nconst isValidHeaderName = (str) => /^[-_a-zA-Z0-9^`|~,!#$%&'*+.]+$/.test(str.trim());\n\nfunction matchHeaderValue(context, value, header, filter, isHeaderNameFilter) {\n if (utils.isFunction(filter)) {\n return filter.call(this, value, header);\n }\n\n if (isHeaderNameFilter) {\n value = header;\n }\n\n if (!utils.isString(value)) return;\n\n if (utils.isString(filter)) {\n return value.indexOf(filter) !== -1;\n }\n\n if (utils.isRegExp(filter)) {\n return filter.test(value);\n }\n}\n\nfunction formatHeader(header) {\n return header.trim()\n .toLowerCase().replace(/([a-z\\d])(\\w*)/g, (w, char, str) => {\n return char.toUpperCase() + str;\n });\n}\n\nfunction buildAccessors(obj, header) {\n const accessorName = utils.toCamelCase(' ' + header);\n\n ['get', 'set', 'has'].forEach(methodName => {\n Object.defineProperty(obj, methodName + accessorName, {\n value: function(arg1, arg2, arg3) {\n return this[methodName].call(this, header, arg1, arg2, arg3);\n },\n configurable: true\n });\n });\n}\n\nclass AxiosHeaders {\n constructor(headers) {\n headers && this.set(headers);\n }\n\n set(header, valueOrRewrite, rewrite) {\n const self = this;\n\n function setHeader(_value, _header, _rewrite) {\n const lHeader = normalizeHeader(_header);\n\n if (!lHeader) {\n throw new Error('header name must be a non-empty string');\n }\n\n const key = utils.findKey(self, lHeader);\n\n if(!key || self[key] === undefined || _rewrite === true || (_rewrite === undefined && self[key] !== false)) {\n self[key || _header] = normalizeValue(_value);\n }\n }\n\n const setHeaders = (headers, _rewrite) =>\n utils.forEach(headers, (_value, _header) => setHeader(_value, _header, _rewrite));\n\n if (utils.isPlainObject(header) || header instanceof this.constructor) {\n setHeaders(header, valueOrRewrite)\n } else if(utils.isString(header) && (header = header.trim()) && !isValidHeaderName(header)) {\n setHeaders(parseHeaders(header), valueOrRewrite);\n } else if (utils.isHeaders(header)) {\n for (const [key, value] of header.entries()) {\n setHeader(value, key, rewrite);\n }\n } else {\n header != null && setHeader(valueOrRewrite, header, rewrite);\n }\n\n return this;\n }\n\n get(header, parser) {\n header = normalizeHeader(header);\n\n if (header) {\n const key = utils.findKey(this, header);\n\n if (key) {\n const value = this[key];\n\n if (!parser) {\n return value;\n }\n\n if (parser === true) {\n return parseTokens(value);\n }\n\n if (utils.isFunction(parser)) {\n return parser.call(this, value, key);\n }\n\n if (utils.isRegExp(parser)) {\n return parser.exec(value);\n }\n\n throw new TypeError('parser must be boolean|regexp|function');\n }\n }\n }\n\n has(header, matcher) {\n header = normalizeHeader(header);\n\n if (header) {\n const key = utils.findKey(this, header);\n\n return !!(key && this[key] !== undefined && (!matcher || matchHeaderValue(this, this[key], key, matcher)));\n }\n\n return false;\n }\n\n delete(header, matcher) {\n const self = this;\n let deleted = false;\n\n function deleteHeader(_header) {\n _header = normalizeHeader(_header);\n\n if (_header) {\n const key = utils.findKey(self, _header);\n\n if (key && (!matcher || matchHeaderValue(self, self[key], key, matcher))) {\n delete self[key];\n\n deleted = true;\n }\n }\n }\n\n if (utils.isArray(header)) {\n header.forEach(deleteHeader);\n } else {\n deleteHeader(header);\n }\n\n return deleted;\n }\n\n clear(matcher) {\n const keys = Object.keys(this);\n let i = keys.length;\n let deleted = false;\n\n while (i--) {\n const key = keys[i];\n if(!matcher || matchHeaderValue(this, this[key], key, matcher, true)) {\n delete this[key];\n deleted = true;\n }\n }\n\n return deleted;\n }\n\n normalize(format) {\n const self = this;\n const headers = {};\n\n utils.forEach(this, (value, header) => {\n const key = utils.findKey(headers, header);\n\n if (key) {\n self[key] = normalizeValue(value);\n delete self[header];\n return;\n }\n\n const normalized = format ? formatHeader(header) : String(header).trim();\n\n if (normalized !== header) {\n delete self[header];\n }\n\n self[normalized] = normalizeValue(value);\n\n headers[normalized] = true;\n });\n\n return this;\n }\n\n concat(...targets) {\n return this.constructor.concat(this, ...targets);\n }\n\n toJSON(asStrings) {\n const obj = Object.create(null);\n\n utils.forEach(this, (value, header) => {\n value != null && value !== false && (obj[header] = asStrings && utils.isArray(value) ? value.join(', ') : value);\n });\n\n return obj;\n }\n\n [Symbol.iterator]() {\n return Object.entries(this.toJSON())[Symbol.iterator]();\n }\n\n toString() {\n return Object.entries(this.toJSON()).map(([header, value]) => header + ': ' + value).join('\\n');\n }\n\n get [Symbol.toStringTag]() {\n return 'AxiosHeaders';\n }\n\n static from(thing) {\n return thing instanceof this ? thing : new this(thing);\n }\n\n static concat(first, ...targets) {\n const computed = new this(first);\n\n targets.forEach((target) => computed.set(target));\n\n return computed;\n }\n\n static accessor(header) {\n const internals = this[$internals] = (this[$internals] = {\n accessors: {}\n });\n\n const accessors = internals.accessors;\n const prototype = this.prototype;\n\n function defineAccessor(_header) {\n const lHeader = normalizeHeader(_header);\n\n if (!accessors[lHeader]) {\n buildAccessors(prototype, _header);\n accessors[lHeader] = true;\n }\n }\n\n utils.isArray(header) ? header.forEach(defineAccessor) : defineAccessor(header);\n\n return this;\n }\n}\n\nAxiosHeaders.accessor(['Content-Type', 'Content-Length', 'Accept', 'Accept-Encoding', 'User-Agent', 'Authorization']);\n\n// reserved names hotfix\nutils.reduceDescriptors(AxiosHeaders.prototype, ({value}, key) => {\n let mapped = key[0].toUpperCase() + key.slice(1); // map `set` => `Set`\n return {\n get: () => value,\n set(headerValue) {\n this[mapped] = headerValue;\n }\n }\n});\n\nutils.freezeMethods(AxiosHeaders);\n\nexport default AxiosHeaders;\n","'use strict';\n\nimport utils from './../utils.js';\nimport defaults from '../defaults/index.js';\nimport AxiosHeaders from '../core/AxiosHeaders.js';\n\n/**\n * Transform the data for a request or a response\n *\n * @param {Array|Function} fns A single function or Array of functions\n * @param {?Object} response The response object\n *\n * @returns {*} The resulting transformed data\n */\nexport default function transformData(fns, response) {\n const config = this || defaults;\n const context = response || config;\n const headers = AxiosHeaders.from(context.headers);\n let data = context.data;\n\n utils.forEach(fns, function transform(fn) {\n data = fn.call(config, data, headers.normalize(), response ? response.status : undefined);\n });\n\n headers.normalize();\n\n return data;\n}\n","'use strict';\n\nexport default function isCancel(value) {\n return !!(value && value.__CANCEL__);\n}\n","'use strict';\n\nimport AxiosError from '../core/AxiosError.js';\nimport utils from '../utils.js';\n\n/**\n * A `CanceledError` is an object that is thrown when an operation is canceled.\n *\n * @param {string=} message The message.\n * @param {Object=} config The config.\n * @param {Object=} request The request.\n *\n * @returns {CanceledError} The created error.\n */\nfunction CanceledError(message, config, request) {\n // eslint-disable-next-line no-eq-null,eqeqeq\n AxiosError.call(this, message == null ? 'canceled' : message, AxiosError.ERR_CANCELED, config, request);\n this.name = 'CanceledError';\n}\n\nutils.inherits(CanceledError, AxiosError, {\n __CANCEL__: true\n});\n\nexport default CanceledError;\n","'use strict';\n\nimport AxiosError from './AxiosError.js';\n\n/**\n * Resolve or reject a Promise based on response status.\n *\n * @param {Function} resolve A function that resolves the promise.\n * @param {Function} reject A function that rejects the promise.\n * @param {object} response The response.\n *\n * @returns {object} The response.\n */\nexport default function settle(resolve, reject, response) {\n const validateStatus = response.config.validateStatus;\n if (!response.status || !validateStatus || validateStatus(response.status)) {\n resolve(response);\n } else {\n reject(new AxiosError(\n 'Request failed with status code ' + response.status,\n [AxiosError.ERR_BAD_REQUEST, AxiosError.ERR_BAD_RESPONSE][Math.floor(response.status / 100) - 4],\n response.config,\n response.request,\n response\n ));\n }\n}\n","'use strict';\n\nexport default function parseProtocol(url) {\n const match = /^([-+\\w]{1,25})(:?\\/\\/|:)/.exec(url);\n return match && match[1] || '';\n}\n","'use strict';\n\n/**\n * Calculate data maxRate\n * @param {Number} [samplesCount= 10]\n * @param {Number} [min= 1000]\n * @returns {Function}\n */\nfunction speedometer(samplesCount, min) {\n samplesCount = samplesCount || 10;\n const bytes = new Array(samplesCount);\n const timestamps = new Array(samplesCount);\n let head = 0;\n let tail = 0;\n let firstSampleTS;\n\n min = min !== undefined ? min : 1000;\n\n return function push(chunkLength) {\n const now = Date.now();\n\n const startedAt = timestamps[tail];\n\n if (!firstSampleTS) {\n firstSampleTS = now;\n }\n\n bytes[head] = chunkLength;\n timestamps[head] = now;\n\n let i = tail;\n let bytesCount = 0;\n\n while (i !== head) {\n bytesCount += bytes[i++];\n i = i % samplesCount;\n }\n\n head = (head + 1) % samplesCount;\n\n if (head === tail) {\n tail = (tail + 1) % samplesCount;\n }\n\n if (now - firstSampleTS < min) {\n return;\n }\n\n const passed = startedAt && now - startedAt;\n\n return passed ? Math.round(bytesCount * 1000 / passed) : undefined;\n };\n}\n\nexport default speedometer;\n","'use strict';\n\n/**\n * Throttle decorator\n * @param {Function} fn\n * @param {Number} freq\n * @return {Function}\n */\nfunction throttle(fn, freq) {\n let timestamp = 0;\n const threshold = 1000 / freq;\n let timer = null;\n return function throttled() {\n const force = this === true;\n\n const now = Date.now();\n if (force || now - timestamp > threshold) {\n if (timer) {\n clearTimeout(timer);\n timer = null;\n }\n timestamp = now;\n return fn.apply(null, arguments);\n }\n if (!timer) {\n timer = setTimeout(() => {\n timer = null;\n timestamp = Date.now();\n return fn.apply(null, arguments);\n }, threshold - (now - timestamp));\n }\n };\n}\n\nexport default throttle;\n","import speedometer from \"./speedometer.js\";\nimport throttle from \"./throttle.js\";\n\nexport default (listener, isDownloadStream, freq = 3) => {\n let bytesNotified = 0;\n const _speedometer = speedometer(50, 250);\n\n return throttle(e => {\n const loaded = e.loaded;\n const total = e.lengthComputable ? e.total : undefined;\n const progressBytes = loaded - bytesNotified;\n const rate = _speedometer(progressBytes);\n const inRange = loaded <= total;\n\n bytesNotified = loaded;\n\n const data = {\n loaded,\n total,\n progress: total ? (loaded / total) : undefined,\n bytes: progressBytes,\n rate: rate ? rate : undefined,\n estimated: rate && total && inRange ? (total - loaded) / rate : undefined,\n event: e,\n lengthComputable: total != null\n };\n\n data[isDownloadStream ? 'download' : 'upload'] = true;\n\n listener(data);\n }, freq);\n}\n","'use strict';\n\nimport utils from './../utils.js';\nimport platform from '../platform/index.js';\n\nexport default platform.hasStandardBrowserEnv ?\n\n// Standard browser envs have full support of the APIs needed to test\n// whether the request URL is of the same origin as current location.\n (function standardBrowserEnv() {\n const msie = /(msie|trident)/i.test(navigator.userAgent);\n const urlParsingNode = document.createElement('a');\n let originURL;\n\n /**\n * Parse a URL to discover its components\n *\n * @param {String} url The URL to be parsed\n * @returns {Object}\n */\n function resolveURL(url) {\n let href = url;\n\n if (msie) {\n // IE needs attribute set twice to normalize properties\n urlParsingNode.setAttribute('href', href);\n href = urlParsingNode.href;\n }\n\n urlParsingNode.setAttribute('href', href);\n\n // urlParsingNode provides the UrlUtils interface - http://url.spec.whatwg.org/#urlutils\n return {\n href: urlParsingNode.href,\n protocol: urlParsingNode.protocol ? urlParsingNode.protocol.replace(/:$/, '') : '',\n host: urlParsingNode.host,\n search: urlParsingNode.search ? urlParsingNode.search.replace(/^\\?/, '') : '',\n hash: urlParsingNode.hash ? urlParsingNode.hash.replace(/^#/, '') : '',\n hostname: urlParsingNode.hostname,\n port: urlParsingNode.port,\n pathname: (urlParsingNode.pathname.charAt(0) === '/') ?\n urlParsingNode.pathname :\n '/' + urlParsingNode.pathname\n };\n }\n\n originURL = resolveURL(window.location.href);\n\n /**\n * Determine if a URL shares the same origin as the current location\n *\n * @param {String} requestURL The URL to test\n * @returns {boolean} True if URL shares the same origin, otherwise false\n */\n return function isURLSameOrigin(requestURL) {\n const parsed = (utils.isString(requestURL)) ? resolveURL(requestURL) : requestURL;\n return (parsed.protocol === originURL.protocol &&\n parsed.host === originURL.host);\n };\n })() :\n\n // Non standard browser envs (web workers, react-native) lack needed support.\n (function nonStandardBrowserEnv() {\n return function isURLSameOrigin() {\n return true;\n };\n })();\n","import utils from './../utils.js';\nimport platform from '../platform/index.js';\n\nexport default platform.hasStandardBrowserEnv ?\n\n // Standard browser envs support document.cookie\n {\n write(name, value, expires, path, domain, secure) {\n const cookie = [name + '=' + encodeURIComponent(value)];\n\n utils.isNumber(expires) && cookie.push('expires=' + new Date(expires).toGMTString());\n\n utils.isString(path) && cookie.push('path=' + path);\n\n utils.isString(domain) && cookie.push('domain=' + domain);\n\n secure === true && cookie.push('secure');\n\n document.cookie = cookie.join('; ');\n },\n\n read(name) {\n const match = document.cookie.match(new RegExp('(^|;\\\\s*)(' + name + ')=([^;]*)'));\n return (match ? decodeURIComponent(match[3]) : null);\n },\n\n remove(name) {\n this.write(name, '', Date.now() - 86400000);\n }\n }\n\n :\n\n // Non-standard browser env (web workers, react-native) lack needed support.\n {\n write() {},\n read() {\n return null;\n },\n remove() {}\n };\n\n","'use strict';\n\n/**\n * Determines whether the specified URL is absolute\n *\n * @param {string} url The URL to test\n *\n * @returns {boolean} True if the specified URL is absolute, otherwise false\n */\nexport default function isAbsoluteURL(url) {\n // A URL is considered absolute if it begins with \"://\" or \"//\" (protocol-relative URL).\n // RFC 3986 defines scheme name as a sequence of characters beginning with a letter and followed\n // by any combination of letters, digits, plus, period, or hyphen.\n return /^([a-z][a-z\\d+\\-.]*:)?\\/\\//i.test(url);\n}\n","'use strict';\n\n/**\n * Creates a new URL by combining the specified URLs\n *\n * @param {string} baseURL The base URL\n * @param {string} relativeURL The relative URL\n *\n * @returns {string} The combined URL\n */\nexport default function combineURLs(baseURL, relativeURL) {\n return relativeURL\n ? baseURL.replace(/\\/?\\/$/, '') + '/' + relativeURL.replace(/^\\/+/, '')\n : baseURL;\n}\n","'use strict';\n\nimport isAbsoluteURL from '../helpers/isAbsoluteURL.js';\nimport combineURLs from '../helpers/combineURLs.js';\n\n/**\n * Creates a new URL by combining the baseURL with the requestedURL,\n * only when the requestedURL is not already an absolute URL.\n * If the requestURL is absolute, this function returns the requestedURL untouched.\n *\n * @param {string} baseURL The base URL\n * @param {string} requestedURL Absolute or relative URL to combine\n *\n * @returns {string} The combined full path\n */\nexport default function buildFullPath(baseURL, requestedURL) {\n if (baseURL && !isAbsoluteURL(requestedURL)) {\n return combineURLs(baseURL, requestedURL);\n }\n return requestedURL;\n}\n","'use strict';\n\nimport utils from '../utils.js';\nimport AxiosHeaders from \"./AxiosHeaders.js\";\n\nconst headersToObject = (thing) => thing instanceof AxiosHeaders ? { ...thing } : thing;\n\n/**\n * Config-specific merge-function which creates a new config-object\n * by merging two configuration objects together.\n *\n * @param {Object} config1\n * @param {Object} config2\n *\n * @returns {Object} New object resulting from merging config2 to config1\n */\nexport default function mergeConfig(config1, config2) {\n // eslint-disable-next-line no-param-reassign\n config2 = config2 || {};\n const config = {};\n\n function getMergedValue(target, source, caseless) {\n if (utils.isPlainObject(target) && utils.isPlainObject(source)) {\n return utils.merge.call({caseless}, target, source);\n } else if (utils.isPlainObject(source)) {\n return utils.merge({}, source);\n } else if (utils.isArray(source)) {\n return source.slice();\n }\n return source;\n }\n\n // eslint-disable-next-line consistent-return\n function mergeDeepProperties(a, b, caseless) {\n if (!utils.isUndefined(b)) {\n return getMergedValue(a, b, caseless);\n } else if (!utils.isUndefined(a)) {\n return getMergedValue(undefined, a, caseless);\n }\n }\n\n // eslint-disable-next-line consistent-return\n function valueFromConfig2(a, b) {\n if (!utils.isUndefined(b)) {\n return getMergedValue(undefined, b);\n }\n }\n\n // eslint-disable-next-line consistent-return\n function defaultToConfig2(a, b) {\n if (!utils.isUndefined(b)) {\n return getMergedValue(undefined, b);\n } else if (!utils.isUndefined(a)) {\n return getMergedValue(undefined, a);\n }\n }\n\n // eslint-disable-next-line consistent-return\n function mergeDirectKeys(a, b, prop) {\n if (prop in config2) {\n return getMergedValue(a, b);\n } else if (prop in config1) {\n return getMergedValue(undefined, a);\n }\n }\n\n const mergeMap = {\n url: valueFromConfig2,\n method: valueFromConfig2,\n data: valueFromConfig2,\n baseURL: defaultToConfig2,\n transformRequest: defaultToConfig2,\n transformResponse: defaultToConfig2,\n paramsSerializer: defaultToConfig2,\n timeout: defaultToConfig2,\n timeoutMessage: defaultToConfig2,\n withCredentials: defaultToConfig2,\n withXSRFToken: defaultToConfig2,\n adapter: defaultToConfig2,\n responseType: defaultToConfig2,\n xsrfCookieName: defaultToConfig2,\n xsrfHeaderName: defaultToConfig2,\n onUploadProgress: defaultToConfig2,\n onDownloadProgress: defaultToConfig2,\n decompress: defaultToConfig2,\n maxContentLength: defaultToConfig2,\n maxBodyLength: defaultToConfig2,\n beforeRedirect: defaultToConfig2,\n transport: defaultToConfig2,\n httpAgent: defaultToConfig2,\n httpsAgent: defaultToConfig2,\n cancelToken: defaultToConfig2,\n socketPath: defaultToConfig2,\n responseEncoding: defaultToConfig2,\n validateStatus: mergeDirectKeys,\n headers: (a, b) => mergeDeepProperties(headersToObject(a), headersToObject(b), true)\n };\n\n utils.forEach(Object.keys(Object.assign({}, config1, config2)), function computeConfigValue(prop) {\n const merge = mergeMap[prop] || mergeDeepProperties;\n const configValue = merge(config1[prop], config2[prop], prop);\n (utils.isUndefined(configValue) && merge !== mergeDirectKeys) || (config[prop] = configValue);\n });\n\n return config;\n}\n","import platform from \"../platform/index.js\";\nimport utils from \"../utils.js\";\nimport isURLSameOrigin from \"./isURLSameOrigin.js\";\nimport cookies from \"./cookies.js\";\nimport buildFullPath from \"../core/buildFullPath.js\";\nimport mergeConfig from \"../core/mergeConfig.js\";\nimport AxiosHeaders from \"../core/AxiosHeaders.js\";\nimport buildURL from \"./buildURL.js\";\n\nexport default (config) => {\n const newConfig = mergeConfig({}, config);\n\n let {data, withXSRFToken, xsrfHeaderName, xsrfCookieName, headers, auth} = newConfig;\n\n newConfig.headers = headers = AxiosHeaders.from(headers);\n\n newConfig.url = buildURL(buildFullPath(newConfig.baseURL, newConfig.url), config.params, config.paramsSerializer);\n\n // HTTP basic authentication\n if (auth) {\n headers.set('Authorization', 'Basic ' +\n btoa((auth.username || '') + ':' + (auth.password ? unescape(encodeURIComponent(auth.password)) : ''))\n );\n }\n\n let contentType;\n\n if (utils.isFormData(data)) {\n if (platform.hasStandardBrowserEnv || platform.hasStandardBrowserWebWorkerEnv) {\n headers.setContentType(undefined); // Let the browser set it\n } else if ((contentType = headers.getContentType()) !== false) {\n // fix semicolon duplication issue for ReactNative FormData implementation\n const [type, ...tokens] = contentType ? contentType.split(';').map(token => token.trim()).filter(Boolean) : [];\n headers.setContentType([type || 'multipart/form-data', ...tokens].join('; '));\n }\n }\n\n // Add xsrf header\n // This is only done if running in a standard browser environment.\n // Specifically not if we're in a web worker, or react-native.\n\n if (platform.hasStandardBrowserEnv) {\n withXSRFToken && utils.isFunction(withXSRFToken) && (withXSRFToken = withXSRFToken(newConfig));\n\n if (withXSRFToken || (withXSRFToken !== false && isURLSameOrigin(newConfig.url))) {\n // Add xsrf header\n const xsrfValue = xsrfHeaderName && xsrfCookieName && cookies.read(xsrfCookieName);\n\n if (xsrfValue) {\n headers.set(xsrfHeaderName, xsrfValue);\n }\n }\n }\n\n return newConfig;\n}\n\n","import utils from './../utils.js';\nimport settle from './../core/settle.js';\nimport transitionalDefaults from '../defaults/transitional.js';\nimport AxiosError from '../core/AxiosError.js';\nimport CanceledError from '../cancel/CanceledError.js';\nimport parseProtocol from '../helpers/parseProtocol.js';\nimport platform from '../platform/index.js';\nimport AxiosHeaders from '../core/AxiosHeaders.js';\nimport progressEventReducer from '../helpers/progressEventReducer.js';\nimport resolveConfig from \"../helpers/resolveConfig.js\";\n\nconst isXHRAdapterSupported = typeof XMLHttpRequest !== 'undefined';\n\nexport default isXHRAdapterSupported && function (config) {\n return new Promise(function dispatchXhrRequest(resolve, reject) {\n const _config = resolveConfig(config);\n let requestData = _config.data;\n const requestHeaders = AxiosHeaders.from(_config.headers).normalize();\n let {responseType} = _config;\n let onCanceled;\n function done() {\n if (_config.cancelToken) {\n _config.cancelToken.unsubscribe(onCanceled);\n }\n\n if (_config.signal) {\n _config.signal.removeEventListener('abort', onCanceled);\n }\n }\n\n let request = new XMLHttpRequest();\n\n request.open(_config.method.toUpperCase(), _config.url, true);\n\n // Set the request timeout in MS\n request.timeout = _config.timeout;\n\n function onloadend() {\n if (!request) {\n return;\n }\n // Prepare the response\n const responseHeaders = AxiosHeaders.from(\n 'getAllResponseHeaders' in request && request.getAllResponseHeaders()\n );\n const responseData = !responseType || responseType === 'text' || responseType === 'json' ?\n request.responseText : request.response;\n const response = {\n data: responseData,\n status: request.status,\n statusText: request.statusText,\n headers: responseHeaders,\n config,\n request\n };\n\n settle(function _resolve(value) {\n resolve(value);\n done();\n }, function _reject(err) {\n reject(err);\n done();\n }, response);\n\n // Clean up request\n request = null;\n }\n\n if ('onloadend' in request) {\n // Use onloadend if available\n request.onloadend = onloadend;\n } else {\n // Listen for ready state to emulate onloadend\n request.onreadystatechange = function handleLoad() {\n if (!request || request.readyState !== 4) {\n return;\n }\n\n // The request errored out and we didn't get a response, this will be\n // handled by onerror instead\n // With one exception: request that using file: protocol, most browsers\n // will return status as 0 even though it's a successful request\n if (request.status === 0 && !(request.responseURL && request.responseURL.indexOf('file:') === 0)) {\n return;\n }\n // readystate handler is calling before onerror or ontimeout handlers,\n // so we should call onloadend on the next 'tick'\n setTimeout(onloadend);\n };\n }\n\n // Handle browser request cancellation (as opposed to a manual cancellation)\n request.onabort = function handleAbort() {\n if (!request) {\n return;\n }\n\n reject(new AxiosError('Request aborted', AxiosError.ECONNABORTED, _config, request));\n\n // Clean up request\n request = null;\n };\n\n // Handle low level network errors\n request.onerror = function handleError() {\n // Real errors are hidden from us by the browser\n // onerror should only fire if it's a network error\n reject(new AxiosError('Network Error', AxiosError.ERR_NETWORK, _config, request));\n\n // Clean up request\n request = null;\n };\n\n // Handle timeout\n request.ontimeout = function handleTimeout() {\n let timeoutErrorMessage = _config.timeout ? 'timeout of ' + _config.timeout + 'ms exceeded' : 'timeout exceeded';\n const transitional = _config.transitional || transitionalDefaults;\n if (_config.timeoutErrorMessage) {\n timeoutErrorMessage = _config.timeoutErrorMessage;\n }\n reject(new AxiosError(\n timeoutErrorMessage,\n transitional.clarifyTimeoutError ? AxiosError.ETIMEDOUT : AxiosError.ECONNABORTED,\n _config,\n request));\n\n // Clean up request\n request = null;\n };\n\n // Remove Content-Type if data is undefined\n requestData === undefined && requestHeaders.setContentType(null);\n\n // Add headers to the request\n if ('setRequestHeader' in request) {\n utils.forEach(requestHeaders.toJSON(), function setRequestHeader(val, key) {\n request.setRequestHeader(key, val);\n });\n }\n\n // Add withCredentials to request if needed\n if (!utils.isUndefined(_config.withCredentials)) {\n request.withCredentials = !!_config.withCredentials;\n }\n\n // Add responseType to request if needed\n if (responseType && responseType !== 'json') {\n request.responseType = _config.responseType;\n }\n\n // Handle progress if needed\n if (typeof _config.onDownloadProgress === 'function') {\n request.addEventListener('progress', progressEventReducer(_config.onDownloadProgress, true));\n }\n\n // Not all browsers support upload events\n if (typeof _config.onUploadProgress === 'function' && request.upload) {\n request.upload.addEventListener('progress', progressEventReducer(_config.onUploadProgress));\n }\n\n if (_config.cancelToken || _config.signal) {\n // Handle cancellation\n // eslint-disable-next-line func-names\n onCanceled = cancel => {\n if (!request) {\n return;\n }\n reject(!cancel || cancel.type ? new CanceledError(null, config, request) : cancel);\n request.abort();\n request = null;\n };\n\n _config.cancelToken && _config.cancelToken.subscribe(onCanceled);\n if (_config.signal) {\n _config.signal.aborted ? onCanceled() : _config.signal.addEventListener('abort', onCanceled);\n }\n }\n\n const protocol = parseProtocol(_config.url);\n\n if (protocol && platform.protocols.indexOf(protocol) === -1) {\n reject(new AxiosError('Unsupported protocol ' + protocol + ':', AxiosError.ERR_BAD_REQUEST, config));\n return;\n }\n\n\n // Send the request\n request.send(requestData || null);\n });\n}\n","import CanceledError from \"../cancel/CanceledError.js\";\nimport AxiosError from \"../core/AxiosError.js\";\n\nconst composeSignals = (signals, timeout) => {\n let controller = new AbortController();\n\n let aborted;\n\n const onabort = function (cancel) {\n if (!aborted) {\n aborted = true;\n unsubscribe();\n const err = cancel instanceof Error ? cancel : this.reason;\n controller.abort(err instanceof AxiosError ? err : new CanceledError(err instanceof Error ? err.message : err));\n }\n }\n\n let timer = timeout && setTimeout(() => {\n onabort(new AxiosError(`timeout ${timeout} of ms exceeded`, AxiosError.ETIMEDOUT))\n }, timeout)\n\n const unsubscribe = () => {\n if (signals) {\n timer && clearTimeout(timer);\n timer = null;\n signals.forEach(signal => {\n signal &&\n (signal.removeEventListener ? signal.removeEventListener('abort', onabort) : signal.unsubscribe(onabort));\n });\n signals = null;\n }\n }\n\n signals.forEach((signal) => signal && signal.addEventListener && signal.addEventListener('abort', onabort));\n\n const {signal} = controller;\n\n signal.unsubscribe = unsubscribe;\n\n return [signal, () => {\n timer && clearTimeout(timer);\n timer = null;\n }];\n}\n\nexport default composeSignals;\n","\n\nexport const streamChunk = function* (chunk, chunkSize) {\n let len = chunk.byteLength;\n\n if (!chunkSize || len < chunkSize) {\n yield chunk;\n return;\n }\n\n let pos = 0;\n let end;\n\n while (pos < len) {\n end = pos + chunkSize;\n yield chunk.slice(pos, end);\n pos = end;\n }\n}\n\nexport const readBytes = async function* (iterable, chunkSize, encode) {\n for await (const chunk of iterable) {\n yield* streamChunk(ArrayBuffer.isView(chunk) ? chunk : (await encode(String(chunk))), chunkSize);\n }\n}\n\nexport const trackStream = (stream, chunkSize, onProgress, onFinish, encode) => {\n const iterator = readBytes(stream, chunkSize, encode);\n\n let bytes = 0;\n\n return new ReadableStream({\n type: 'bytes',\n\n async pull(controller) {\n const {done, value} = await iterator.next();\n\n if (done) {\n controller.close();\n onFinish();\n return;\n }\n\n let len = value.byteLength;\n onProgress && onProgress(bytes += len);\n controller.enqueue(new Uint8Array(value));\n },\n cancel(reason) {\n onFinish(reason);\n return iterator.return();\n }\n }, {\n highWaterMark: 2\n })\n}\n","import platform from \"../platform/index.js\";\nimport utils from \"../utils.js\";\nimport AxiosError from \"../core/AxiosError.js\";\nimport composeSignals from \"../helpers/composeSignals.js\";\nimport {trackStream} from \"../helpers/trackStream.js\";\nimport AxiosHeaders from \"../core/AxiosHeaders.js\";\nimport progressEventReducer from \"../helpers/progressEventReducer.js\";\nimport resolveConfig from \"../helpers/resolveConfig.js\";\nimport settle from \"../core/settle.js\";\n\nconst fetchProgressDecorator = (total, fn) => {\n const lengthComputable = total != null;\n return (loaded) => setTimeout(() => fn({\n lengthComputable,\n total,\n loaded\n }));\n}\n\nconst isFetchSupported = typeof fetch === 'function' && typeof Request === 'function' && typeof Response === 'function';\nconst isReadableStreamSupported = isFetchSupported && typeof ReadableStream === 'function';\n\n// used only inside the fetch adapter\nconst encodeText = isFetchSupported && (typeof TextEncoder === 'function' ?\n ((encoder) => (str) => encoder.encode(str))(new TextEncoder()) :\n async (str) => new Uint8Array(await new Response(str).arrayBuffer())\n);\n\nconst supportsRequestStream = isReadableStreamSupported && (() => {\n let duplexAccessed = false;\n\n const hasContentType = new Request(platform.origin, {\n body: new ReadableStream(),\n method: 'POST',\n get duplex() {\n duplexAccessed = true;\n return 'half';\n },\n }).headers.has('Content-Type');\n\n return duplexAccessed && !hasContentType;\n})();\n\nconst DEFAULT_CHUNK_SIZE = 64 * 1024;\n\nconst supportsResponseStream = isReadableStreamSupported && !!(()=> {\n try {\n return utils.isReadableStream(new Response('').body);\n } catch(err) {\n // return undefined\n }\n})();\n\nconst resolvers = {\n stream: supportsResponseStream && ((res) => res.body)\n};\n\nisFetchSupported && (((res) => {\n ['text', 'arrayBuffer', 'blob', 'formData', 'stream'].forEach(type => {\n !resolvers[type] && (resolvers[type] = utils.isFunction(res[type]) ? (res) => res[type]() :\n (_, config) => {\n throw new AxiosError(`Response type '${type}' is not supported`, AxiosError.ERR_NOT_SUPPORT, config);\n })\n });\n})(new Response));\n\nconst getBodyLength = async (body) => {\n if (body == null) {\n return 0;\n }\n\n if(utils.isBlob(body)) {\n return body.size;\n }\n\n if(utils.isSpecCompliantForm(body)) {\n return (await new Request(body).arrayBuffer()).byteLength;\n }\n\n if(utils.isArrayBufferView(body)) {\n return body.byteLength;\n }\n\n if(utils.isURLSearchParams(body)) {\n body = body + '';\n }\n\n if(utils.isString(body)) {\n return (await encodeText(body)).byteLength;\n }\n}\n\nconst resolveBodyLength = async (headers, body) => {\n const length = utils.toFiniteNumber(headers.getContentLength());\n\n return length == null ? getBodyLength(body) : length;\n}\n\nexport default isFetchSupported && (async (config) => {\n let {\n url,\n method,\n data,\n signal,\n cancelToken,\n timeout,\n onDownloadProgress,\n onUploadProgress,\n responseType,\n headers,\n withCredentials = 'same-origin',\n fetchOptions\n } = resolveConfig(config);\n\n responseType = responseType ? (responseType + '').toLowerCase() : 'text';\n\n let [composedSignal, stopTimeout] = (signal || cancelToken || timeout) ?\n composeSignals([signal, cancelToken], timeout) : [];\n\n let finished, request;\n\n const onFinish = () => {\n !finished && setTimeout(() => {\n composedSignal && composedSignal.unsubscribe();\n });\n\n finished = true;\n }\n\n let requestContentLength;\n\n try {\n if (\n onUploadProgress && supportsRequestStream && method !== 'get' && method !== 'head' &&\n (requestContentLength = await resolveBodyLength(headers, data)) !== 0\n ) {\n let _request = new Request(url, {\n method: 'POST',\n body: data,\n duplex: \"half\"\n });\n\n let contentTypeHeader;\n\n if (utils.isFormData(data) && (contentTypeHeader = _request.headers.get('content-type'))) {\n headers.setContentType(contentTypeHeader)\n }\n\n if (_request.body) {\n data = trackStream(_request.body, DEFAULT_CHUNK_SIZE, fetchProgressDecorator(\n requestContentLength,\n progressEventReducer(onUploadProgress)\n ), null, encodeText);\n }\n }\n\n if (!utils.isString(withCredentials)) {\n withCredentials = withCredentials ? 'cors' : 'omit';\n }\n\n request = new Request(url, {\n ...fetchOptions,\n signal: composedSignal,\n method: method.toUpperCase(),\n headers: headers.normalize().toJSON(),\n body: data,\n duplex: \"half\",\n withCredentials\n });\n\n let response = await fetch(request);\n\n const isStreamResponse = supportsResponseStream && (responseType === 'stream' || responseType === 'response');\n\n if (supportsResponseStream && (onDownloadProgress || isStreamResponse)) {\n const options = {};\n\n ['status', 'statusText', 'headers'].forEach(prop => {\n options[prop] = response[prop];\n });\n\n const responseContentLength = utils.toFiniteNumber(response.headers.get('content-length'));\n\n response = new Response(\n trackStream(response.body, DEFAULT_CHUNK_SIZE, onDownloadProgress && fetchProgressDecorator(\n responseContentLength,\n progressEventReducer(onDownloadProgress, true)\n ), isStreamResponse && onFinish, encodeText),\n options\n );\n }\n\n responseType = responseType || 'text';\n\n let responseData = await resolvers[utils.findKey(resolvers, responseType) || 'text'](response, config);\n\n !isStreamResponse && onFinish();\n\n stopTimeout && stopTimeout();\n\n return await new Promise((resolve, reject) => {\n settle(resolve, reject, {\n data: responseData,\n headers: AxiosHeaders.from(response.headers),\n status: response.status,\n statusText: response.statusText,\n config,\n request\n })\n })\n } catch (err) {\n onFinish();\n\n if (err && err.name === 'TypeError' && /fetch/i.test(err.message)) {\n throw Object.assign(\n new AxiosError('Network Error', AxiosError.ERR_NETWORK, config, request),\n {\n cause: err.cause || err\n }\n )\n }\n\n throw AxiosError.from(err, err && err.code, config, request);\n }\n});\n\n\n","import utils from '../utils.js';\nimport httpAdapter from './http.js';\nimport xhrAdapter from './xhr.js';\nimport fetchAdapter from './fetch.js';\nimport AxiosError from \"../core/AxiosError.js\";\n\nconst knownAdapters = {\n http: httpAdapter,\n xhr: xhrAdapter,\n fetch: fetchAdapter\n}\n\nutils.forEach(knownAdapters, (fn, value) => {\n if (fn) {\n try {\n Object.defineProperty(fn, 'name', {value});\n } catch (e) {\n // eslint-disable-next-line no-empty\n }\n Object.defineProperty(fn, 'adapterName', {value});\n }\n});\n\nconst renderReason = (reason) => `- ${reason}`;\n\nconst isResolvedHandle = (adapter) => utils.isFunction(adapter) || adapter === null || adapter === false;\n\nexport default {\n getAdapter: (adapters) => {\n adapters = utils.isArray(adapters) ? adapters : [adapters];\n\n const {length} = adapters;\n let nameOrAdapter;\n let adapter;\n\n const rejectedReasons = {};\n\n for (let i = 0; i < length; i++) {\n nameOrAdapter = adapters[i];\n let id;\n\n adapter = nameOrAdapter;\n\n if (!isResolvedHandle(nameOrAdapter)) {\n adapter = knownAdapters[(id = String(nameOrAdapter)).toLowerCase()];\n\n if (adapter === undefined) {\n throw new AxiosError(`Unknown adapter '${id}'`);\n }\n }\n\n if (adapter) {\n break;\n }\n\n rejectedReasons[id || '#' + i] = adapter;\n }\n\n if (!adapter) {\n\n const reasons = Object.entries(rejectedReasons)\n .map(([id, state]) => `adapter ${id} ` +\n (state === false ? 'is not supported by the environment' : 'is not available in the build')\n );\n\n let s = length ?\n (reasons.length > 1 ? 'since :\\n' + reasons.map(renderReason).join('\\n') : ' ' + renderReason(reasons[0])) :\n 'as no adapter specified';\n\n throw new AxiosError(\n `There is no suitable adapter to dispatch the request ` + s,\n 'ERR_NOT_SUPPORT'\n );\n }\n\n return adapter;\n },\n adapters: knownAdapters\n}\n","'use strict';\n\nimport transformData from './transformData.js';\nimport isCancel from '../cancel/isCancel.js';\nimport defaults from '../defaults/index.js';\nimport CanceledError from '../cancel/CanceledError.js';\nimport AxiosHeaders from '../core/AxiosHeaders.js';\nimport adapters from \"../adapters/adapters.js\";\n\n/**\n * Throws a `CanceledError` if cancellation has been requested.\n *\n * @param {Object} config The config that is to be used for the request\n *\n * @returns {void}\n */\nfunction throwIfCancellationRequested(config) {\n if (config.cancelToken) {\n config.cancelToken.throwIfRequested();\n }\n\n if (config.signal && config.signal.aborted) {\n throw new CanceledError(null, config);\n }\n}\n\n/**\n * Dispatch a request to the server using the configured adapter.\n *\n * @param {object} config The config that is to be used for the request\n *\n * @returns {Promise} The Promise to be fulfilled\n */\nexport default function dispatchRequest(config) {\n throwIfCancellationRequested(config);\n\n config.headers = AxiosHeaders.from(config.headers);\n\n // Transform request data\n config.data = transformData.call(\n config,\n config.transformRequest\n );\n\n if (['post', 'put', 'patch'].indexOf(config.method) !== -1) {\n config.headers.setContentType('application/x-www-form-urlencoded', false);\n }\n\n const adapter = adapters.getAdapter(config.adapter || defaults.adapter);\n\n return adapter(config).then(function onAdapterResolution(response) {\n throwIfCancellationRequested(config);\n\n // Transform response data\n response.data = transformData.call(\n config,\n config.transformResponse,\n response\n );\n\n response.headers = AxiosHeaders.from(response.headers);\n\n return response;\n }, function onAdapterRejection(reason) {\n if (!isCancel(reason)) {\n throwIfCancellationRequested(config);\n\n // Transform response data\n if (reason && reason.response) {\n reason.response.data = transformData.call(\n config,\n config.transformResponse,\n reason.response\n );\n reason.response.headers = AxiosHeaders.from(reason.response.headers);\n }\n }\n\n return Promise.reject(reason);\n });\n}\n","export const VERSION = \"1.7.2\";","'use strict';\n\nimport {VERSION} from '../env/data.js';\nimport AxiosError from '../core/AxiosError.js';\n\nconst validators = {};\n\n// eslint-disable-next-line func-names\n['object', 'boolean', 'number', 'function', 'string', 'symbol'].forEach((type, i) => {\n validators[type] = function validator(thing) {\n return typeof thing === type || 'a' + (i < 1 ? 'n ' : ' ') + type;\n };\n});\n\nconst deprecatedWarnings = {};\n\n/**\n * Transitional option validator\n *\n * @param {function|boolean?} validator - set to false if the transitional option has been removed\n * @param {string?} version - deprecated version / removed since version\n * @param {string?} message - some message with additional info\n *\n * @returns {function}\n */\nvalidators.transitional = function transitional(validator, version, message) {\n function formatMessage(opt, desc) {\n return '[Axios v' + VERSION + '] Transitional option \\'' + opt + '\\'' + desc + (message ? '. ' + message : '');\n }\n\n // eslint-disable-next-line func-names\n return (value, opt, opts) => {\n if (validator === false) {\n throw new AxiosError(\n formatMessage(opt, ' has been removed' + (version ? ' in ' + version : '')),\n AxiosError.ERR_DEPRECATED\n );\n }\n\n if (version && !deprecatedWarnings[opt]) {\n deprecatedWarnings[opt] = true;\n // eslint-disable-next-line no-console\n console.warn(\n formatMessage(\n opt,\n ' has been deprecated since v' + version + ' and will be removed in the near future'\n )\n );\n }\n\n return validator ? validator(value, opt, opts) : true;\n };\n};\n\n/**\n * Assert object's properties type\n *\n * @param {object} options\n * @param {object} schema\n * @param {boolean?} allowUnknown\n *\n * @returns {object}\n */\n\nfunction assertOptions(options, schema, allowUnknown) {\n if (typeof options !== 'object') {\n throw new AxiosError('options must be an object', AxiosError.ERR_BAD_OPTION_VALUE);\n }\n const keys = Object.keys(options);\n let i = keys.length;\n while (i-- > 0) {\n const opt = keys[i];\n const validator = schema[opt];\n if (validator) {\n const value = options[opt];\n const result = value === undefined || validator(value, opt, options);\n if (result !== true) {\n throw new AxiosError('option ' + opt + ' must be ' + result, AxiosError.ERR_BAD_OPTION_VALUE);\n }\n continue;\n }\n if (allowUnknown !== true) {\n throw new AxiosError('Unknown option ' + opt, AxiosError.ERR_BAD_OPTION);\n }\n }\n}\n\nexport default {\n assertOptions,\n validators\n};\n","'use strict';\n\nimport utils from './../utils.js';\nimport buildURL from '../helpers/buildURL.js';\nimport InterceptorManager from './InterceptorManager.js';\nimport dispatchRequest from './dispatchRequest.js';\nimport mergeConfig from './mergeConfig.js';\nimport buildFullPath from './buildFullPath.js';\nimport validator from '../helpers/validator.js';\nimport AxiosHeaders from './AxiosHeaders.js';\n\nconst validators = validator.validators;\n\n/**\n * Create a new instance of Axios\n *\n * @param {Object} instanceConfig The default config for the instance\n *\n * @return {Axios} A new instance of Axios\n */\nclass Axios {\n constructor(instanceConfig) {\n this.defaults = instanceConfig;\n this.interceptors = {\n request: new InterceptorManager(),\n response: new InterceptorManager()\n };\n }\n\n /**\n * Dispatch a request\n *\n * @param {String|Object} configOrUrl The config specific for this request (merged with this.defaults)\n * @param {?Object} config\n *\n * @returns {Promise} The Promise to be fulfilled\n */\n async request(configOrUrl, config) {\n try {\n return await this._request(configOrUrl, config);\n } catch (err) {\n if (err instanceof Error) {\n let dummy;\n\n Error.captureStackTrace ? Error.captureStackTrace(dummy = {}) : (dummy = new Error());\n\n // slice off the Error: ... line\n const stack = dummy.stack ? dummy.stack.replace(/^.+\\n/, '') : '';\n try {\n if (!err.stack) {\n err.stack = stack;\n // match without the 2 top stack lines\n } else if (stack && !String(err.stack).endsWith(stack.replace(/^.+\\n.+\\n/, ''))) {\n err.stack += '\\n' + stack\n }\n } catch (e) {\n // ignore the case where \"stack\" is an un-writable property\n }\n }\n\n throw err;\n }\n }\n\n _request(configOrUrl, config) {\n /*eslint no-param-reassign:0*/\n // Allow for axios('example/url'[, config]) a la fetch API\n if (typeof configOrUrl === 'string') {\n config = config || {};\n config.url = configOrUrl;\n } else {\n config = configOrUrl || {};\n }\n\n config = mergeConfig(this.defaults, config);\n\n const {transitional, paramsSerializer, headers} = config;\n\n if (transitional !== undefined) {\n validator.assertOptions(transitional, {\n silentJSONParsing: validators.transitional(validators.boolean),\n forcedJSONParsing: validators.transitional(validators.boolean),\n clarifyTimeoutError: validators.transitional(validators.boolean)\n }, false);\n }\n\n if (paramsSerializer != null) {\n if (utils.isFunction(paramsSerializer)) {\n config.paramsSerializer = {\n serialize: paramsSerializer\n }\n } else {\n validator.assertOptions(paramsSerializer, {\n encode: validators.function,\n serialize: validators.function\n }, true);\n }\n }\n\n // Set config.method\n config.method = (config.method || this.defaults.method || 'get').toLowerCase();\n\n // Flatten headers\n let contextHeaders = headers && utils.merge(\n headers.common,\n headers[config.method]\n );\n\n headers && utils.forEach(\n ['delete', 'get', 'head', 'post', 'put', 'patch', 'common'],\n (method) => {\n delete headers[method];\n }\n );\n\n config.headers = AxiosHeaders.concat(contextHeaders, headers);\n\n // filter out skipped interceptors\n const requestInterceptorChain = [];\n let synchronousRequestInterceptors = true;\n this.interceptors.request.forEach(function unshiftRequestInterceptors(interceptor) {\n if (typeof interceptor.runWhen === 'function' && interceptor.runWhen(config) === false) {\n return;\n }\n\n synchronousRequestInterceptors = synchronousRequestInterceptors && interceptor.synchronous;\n\n requestInterceptorChain.unshift(interceptor.fulfilled, interceptor.rejected);\n });\n\n const responseInterceptorChain = [];\n this.interceptors.response.forEach(function pushResponseInterceptors(interceptor) {\n responseInterceptorChain.push(interceptor.fulfilled, interceptor.rejected);\n });\n\n let promise;\n let i = 0;\n let len;\n\n if (!synchronousRequestInterceptors) {\n const chain = [dispatchRequest.bind(this), undefined];\n chain.unshift.apply(chain, requestInterceptorChain);\n chain.push.apply(chain, responseInterceptorChain);\n len = chain.length;\n\n promise = Promise.resolve(config);\n\n while (i < len) {\n promise = promise.then(chain[i++], chain[i++]);\n }\n\n return promise;\n }\n\n len = requestInterceptorChain.length;\n\n let newConfig = config;\n\n i = 0;\n\n while (i < len) {\n const onFulfilled = requestInterceptorChain[i++];\n const onRejected = requestInterceptorChain[i++];\n try {\n newConfig = onFulfilled(newConfig);\n } catch (error) {\n onRejected.call(this, error);\n break;\n }\n }\n\n try {\n promise = dispatchRequest.call(this, newConfig);\n } catch (error) {\n return Promise.reject(error);\n }\n\n i = 0;\n len = responseInterceptorChain.length;\n\n while (i < len) {\n promise = promise.then(responseInterceptorChain[i++], responseInterceptorChain[i++]);\n }\n\n return promise;\n }\n\n getUri(config) {\n config = mergeConfig(this.defaults, config);\n const fullPath = buildFullPath(config.baseURL, config.url);\n return buildURL(fullPath, config.params, config.paramsSerializer);\n }\n}\n\n// Provide aliases for supported request methods\nutils.forEach(['delete', 'get', 'head', 'options'], function forEachMethodNoData(method) {\n /*eslint func-names:0*/\n Axios.prototype[method] = function(url, config) {\n return this.request(mergeConfig(config || {}, {\n method,\n url,\n data: (config || {}).data\n }));\n };\n});\n\nutils.forEach(['post', 'put', 'patch'], function forEachMethodWithData(method) {\n /*eslint func-names:0*/\n\n function generateHTTPMethod(isForm) {\n return function httpMethod(url, data, config) {\n return this.request(mergeConfig(config || {}, {\n method,\n headers: isForm ? {\n 'Content-Type': 'multipart/form-data'\n } : {},\n url,\n data\n }));\n };\n }\n\n Axios.prototype[method] = generateHTTPMethod();\n\n Axios.prototype[method + 'Form'] = generateHTTPMethod(true);\n});\n\nexport default Axios;\n","'use strict';\n\nimport CanceledError from './CanceledError.js';\n\n/**\n * A `CancelToken` is an object that can be used to request cancellation of an operation.\n *\n * @param {Function} executor The executor function.\n *\n * @returns {CancelToken}\n */\nclass CancelToken {\n constructor(executor) {\n if (typeof executor !== 'function') {\n throw new TypeError('executor must be a function.');\n }\n\n let resolvePromise;\n\n this.promise = new Promise(function promiseExecutor(resolve) {\n resolvePromise = resolve;\n });\n\n const token = this;\n\n // eslint-disable-next-line func-names\n this.promise.then(cancel => {\n if (!token._listeners) return;\n\n let i = token._listeners.length;\n\n while (i-- > 0) {\n token._listeners[i](cancel);\n }\n token._listeners = null;\n });\n\n // eslint-disable-next-line func-names\n this.promise.then = onfulfilled => {\n let _resolve;\n // eslint-disable-next-line func-names\n const promise = new Promise(resolve => {\n token.subscribe(resolve);\n _resolve = resolve;\n }).then(onfulfilled);\n\n promise.cancel = function reject() {\n token.unsubscribe(_resolve);\n };\n\n return promise;\n };\n\n executor(function cancel(message, config, request) {\n if (token.reason) {\n // Cancellation has already been requested\n return;\n }\n\n token.reason = new CanceledError(message, config, request);\n resolvePromise(token.reason);\n });\n }\n\n /**\n * Throws a `CanceledError` if cancellation has been requested.\n */\n throwIfRequested() {\n if (this.reason) {\n throw this.reason;\n }\n }\n\n /**\n * Subscribe to the cancel signal\n */\n\n subscribe(listener) {\n if (this.reason) {\n listener(this.reason);\n return;\n }\n\n if (this._listeners) {\n this._listeners.push(listener);\n } else {\n this._listeners = [listener];\n }\n }\n\n /**\n * Unsubscribe from the cancel signal\n */\n\n unsubscribe(listener) {\n if (!this._listeners) {\n return;\n }\n const index = this._listeners.indexOf(listener);\n if (index !== -1) {\n this._listeners.splice(index, 1);\n }\n }\n\n /**\n * Returns an object that contains a new `CancelToken` and a function that, when called,\n * cancels the `CancelToken`.\n */\n static source() {\n let cancel;\n const token = new CancelToken(function executor(c) {\n cancel = c;\n });\n return {\n token,\n cancel\n };\n }\n}\n\nexport default CancelToken;\n","'use strict';\n\n/**\n * Syntactic sugar for invoking a function and expanding an array for arguments.\n *\n * Common use case would be to use `Function.prototype.apply`.\n *\n * ```js\n * function f(x, y, z) {}\n * var args = [1, 2, 3];\n * f.apply(null, args);\n * ```\n *\n * With `spread` this example can be re-written.\n *\n * ```js\n * spread(function(x, y, z) {})([1, 2, 3]);\n * ```\n *\n * @param {Function} callback\n *\n * @returns {Function}\n */\nexport default function spread(callback) {\n return function wrap(arr) {\n return callback.apply(null, arr);\n };\n}\n","'use strict';\n\nimport utils from './../utils.js';\n\n/**\n * Determines whether the payload is an error thrown by Axios\n *\n * @param {*} payload The value to test\n *\n * @returns {boolean} True if the payload is an error thrown by Axios, otherwise false\n */\nexport default function isAxiosError(payload) {\n return utils.isObject(payload) && (payload.isAxiosError === true);\n}\n","const HttpStatusCode = {\n Continue: 100,\n SwitchingProtocols: 101,\n Processing: 102,\n EarlyHints: 103,\n Ok: 200,\n Created: 201,\n Accepted: 202,\n NonAuthoritativeInformation: 203,\n NoContent: 204,\n ResetContent: 205,\n PartialContent: 206,\n MultiStatus: 207,\n AlreadyReported: 208,\n ImUsed: 226,\n MultipleChoices: 300,\n MovedPermanently: 301,\n Found: 302,\n SeeOther: 303,\n NotModified: 304,\n UseProxy: 305,\n Unused: 306,\n TemporaryRedirect: 307,\n PermanentRedirect: 308,\n BadRequest: 400,\n Unauthorized: 401,\n PaymentRequired: 402,\n Forbidden: 403,\n NotFound: 404,\n MethodNotAllowed: 405,\n NotAcceptable: 406,\n ProxyAuthenticationRequired: 407,\n RequestTimeout: 408,\n Conflict: 409,\n Gone: 410,\n LengthRequired: 411,\n PreconditionFailed: 412,\n PayloadTooLarge: 413,\n UriTooLong: 414,\n UnsupportedMediaType: 415,\n RangeNotSatisfiable: 416,\n ExpectationFailed: 417,\n ImATeapot: 418,\n MisdirectedRequest: 421,\n UnprocessableEntity: 422,\n Locked: 423,\n FailedDependency: 424,\n TooEarly: 425,\n UpgradeRequired: 426,\n PreconditionRequired: 428,\n TooManyRequests: 429,\n RequestHeaderFieldsTooLarge: 431,\n UnavailableForLegalReasons: 451,\n InternalServerError: 500,\n NotImplemented: 501,\n BadGateway: 502,\n ServiceUnavailable: 503,\n GatewayTimeout: 504,\n HttpVersionNotSupported: 505,\n VariantAlsoNegotiates: 506,\n InsufficientStorage: 507,\n LoopDetected: 508,\n NotExtended: 510,\n NetworkAuthenticationRequired: 511,\n};\n\nObject.entries(HttpStatusCode).forEach(([key, value]) => {\n HttpStatusCode[value] = key;\n});\n\nexport default HttpStatusCode;\n","'use strict';\n\nimport utils from './utils.js';\nimport bind from './helpers/bind.js';\nimport Axios from './core/Axios.js';\nimport mergeConfig from './core/mergeConfig.js';\nimport defaults from './defaults/index.js';\nimport formDataToJSON from './helpers/formDataToJSON.js';\nimport CanceledError from './cancel/CanceledError.js';\nimport CancelToken from './cancel/CancelToken.js';\nimport isCancel from './cancel/isCancel.js';\nimport {VERSION} from './env/data.js';\nimport toFormData from './helpers/toFormData.js';\nimport AxiosError from './core/AxiosError.js';\nimport spread from './helpers/spread.js';\nimport isAxiosError from './helpers/isAxiosError.js';\nimport AxiosHeaders from \"./core/AxiosHeaders.js\";\nimport adapters from './adapters/adapters.js';\nimport HttpStatusCode from './helpers/HttpStatusCode.js';\n\n/**\n * Create an instance of Axios\n *\n * @param {Object} defaultConfig The default config for the instance\n *\n * @returns {Axios} A new instance of Axios\n */\nfunction createInstance(defaultConfig) {\n const context = new Axios(defaultConfig);\n const instance = bind(Axios.prototype.request, context);\n\n // Copy axios.prototype to instance\n utils.extend(instance, Axios.prototype, context, {allOwnKeys: true});\n\n // Copy context to instance\n utils.extend(instance, context, null, {allOwnKeys: true});\n\n // Factory for creating new instances\n instance.create = function create(instanceConfig) {\n return createInstance(mergeConfig(defaultConfig, instanceConfig));\n };\n\n return instance;\n}\n\n// Create the default instance to be exported\nconst axios = createInstance(defaults);\n\n// Expose Axios class to allow class inheritance\naxios.Axios = Axios;\n\n// Expose Cancel & CancelToken\naxios.CanceledError = CanceledError;\naxios.CancelToken = CancelToken;\naxios.isCancel = isCancel;\naxios.VERSION = VERSION;\naxios.toFormData = toFormData;\n\n// Expose AxiosError class\naxios.AxiosError = AxiosError;\n\n// alias for CanceledError for backward compatibility\naxios.Cancel = axios.CanceledError;\n\n// Expose all/spread\naxios.all = function all(promises) {\n return Promise.all(promises);\n};\n\naxios.spread = spread;\n\n// Expose isAxiosError\naxios.isAxiosError = isAxiosError;\n\n// Expose mergeConfig\naxios.mergeConfig = mergeConfig;\n\naxios.AxiosHeaders = AxiosHeaders;\n\naxios.formToJSON = thing => formDataToJSON(utils.isHTMLForm(thing) ? new FormData(thing) : thing);\n\naxios.getAdapter = adapters.getAdapter;\n\naxios.HttpStatusCode = HttpStatusCode;\n\naxios.default = axios;\n\n// this module should only have a default export\nexport default axios\n","import axios from './lib/axios.js';\n\n// This module is intended to unwrap Axios default export as named.\n// Keep top-level export same with static properties\n// so that it can keep same with es module or cjs\nconst {\n Axios,\n AxiosError,\n CanceledError,\n isCancel,\n CancelToken,\n VERSION,\n all,\n Cancel,\n isAxiosError,\n spread,\n toFormData,\n AxiosHeaders,\n HttpStatusCode,\n formToJSON,\n getAdapter,\n mergeConfig\n} = axios;\n\nexport {\n axios as default,\n Axios,\n AxiosError,\n CanceledError,\n isCancel,\n CancelToken,\n VERSION,\n all,\n Cancel,\n isAxiosError,\n spread,\n toFormData,\n AxiosHeaders,\n HttpStatusCode,\n formToJSON,\n getAdapter,\n mergeConfig\n}\n","import axios, { AxiosError, AxiosResponse, Method } from 'axios'\r\n\r\ntype AllowedResponseTypes = 'json' | 'blob' | 'arraybuffer' | 'text'\r\n\r\nexport const fetchDataFromApi = async (url: string, token: string, method: Method = 'get', responseType?: AllowedResponseTypes, bodyData?: any) => {\r\n try {\r\n const axiosInstance = axios.create()\r\n axiosInstance.interceptors.request.use(\r\n (config) => {\r\n // Füge das Access Token zum Autorisierungs-Header hinzu, wenn es verfügbar ist\r\n if (token) {\r\n config.headers.Authorization = `Bearer ${token}`\r\n config.headers['Content-Type'] = 'application/json'\r\n }\r\n return config\r\n },\r\n (error: AxiosError) => {\r\n return error.response\r\n }\r\n )\r\n\r\n axiosInstance.interceptors.response.use(\r\n (response) => {\r\n return response\r\n },\r\n (error: AxiosError) => {\r\n return error\r\n }\r\n )\r\n\r\n const response: AxiosResponse = await axiosInstance.request({\r\n method: method,\r\n url: url,\r\n responseType: responseType,\r\n data: `${JSON.stringify(bodyData)}`,\r\n })\r\n // Überprüfe den HTTP-Statuscode auf Erfolg (2xx)\r\n return response\r\n } catch (error) {\r\n if (import.meta.env.DEV) console.log(error)\r\n return Promise.reject(error)\r\n }\r\n}\r\n","import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'\r\nimport { AxiosError, AxiosResponse } from 'axios'\r\nimport { fetchDataFromApi } from '../services/fetchDataFromApi.tsx'\r\nimport { NwTitle } from '../types/settingTypes/NwTitle.tsx'\r\nimport { Salutations } from '../types/settingTypes/Salutation.tsx'\r\nimport { NwFileType } from '../types/settingTypes/NwFileType.tsx'\r\n\r\ninterface SettingState {\r\n titleList: NwTitle[] | null\r\n besanList: Salutations[] | null\r\n fileTypeList: NwFileType[] | undefined\r\n loading: 'idle' | 'pending' | 'succeeded' | 'failed'\r\n error: string | null\r\n statusCode: number | null\r\n}\r\n\r\ninterface FetchApiDataOptions {\r\n url: string\r\n token: string\r\n method?: string\r\n}\r\n\r\nconst initialState: SettingState = {\r\n titleList: null,\r\n besanList: null,\r\n fileTypeList: undefined,\r\n loading: 'idle',\r\n error: null,\r\n statusCode: null,\r\n}\r\n\r\n//BESAN = Anreden\r\nexport const fetchBesanFromApiData = createAsyncThunk('api/fetchBesanFromApiData', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\n// Titles\r\nexport const fetchTitlesFromApiData = createAsyncThunk('api/fetchTitlesFromApiData', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\n// File typen\r\nexport const fetchFileTypesFromApiData = createAsyncThunk('api/fetchFileTypesFromApiData', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\nconst settingSlice = createSlice({\r\n name: 'settingStore',\r\n initialState,\r\n reducers: {},\r\n extraReducers: (builder) => {\r\n builder\r\n\r\n //Anreden\r\n .addCase(fetchBesanFromApiData.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchBesanFromApiData.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.besanList = action.payload?.data\r\n state.statusCode = result.status\r\n }\r\n })\r\n .addCase(fetchBesanFromApiData.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n\r\n //Titles\r\n .addCase(fetchTitlesFromApiData.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchTitlesFromApiData.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.titleList = action.payload?.data\r\n state.statusCode = result.status\r\n }\r\n })\r\n .addCase(fetchTitlesFromApiData.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n\r\n // File Typen\r\n .addCase(fetchFileTypesFromApiData.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchFileTypesFromApiData.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.fileTypeList = action.payload?.data\r\n state.statusCode = result.status\r\n }\r\n })\r\n .addCase(fetchFileTypesFromApiData.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n },\r\n})\r\nexport default settingSlice.reducer\r\n","import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'\r\nimport { AxiosError, AxiosResponse } from 'axios'\r\nimport { fetchDataFromApi } from '../services/fetchDataFromApi'\r\nimport { DashBoardEventDto } from '../types/DashBoardEventDto.tsx'\r\nimport { EventDetailsDto } from '../types/EventDetailsDto.tsx'\r\n\r\ninterface ApiState {\r\n allEventCount: number\r\n eventsInTimespan: number\r\n eventDtos: DashBoardEventDto[] | undefined\r\n selectedEventDashboard: DashBoardEventDto | null\r\n selectedEvent: EventDetailsDto | null\r\n selectedYear: number\r\n url: string\r\n loading: 'idle' | 'pending' | 'succeeded' | 'failed'\r\n error: string | null\r\n statusCode: number | null\r\n}\r\n\r\nconst initialState: ApiState = {\r\n allEventCount: 0,\r\n eventsInTimespan: 0,\r\n eventDtos: undefined,\r\n selectedYear: new Date().getFullYear(),\r\n selectedEventDashboard: null,\r\n selectedEvent: null,\r\n url: '',\r\n loading: 'idle',\r\n error: null,\r\n statusCode: null,\r\n}\r\n\r\nexport interface FetchApiDataOptions {\r\n url: string\r\n token: string\r\n method?: string\r\n bodyData?: object\r\n}\r\n\r\n// Eventliste und meta data (counter)\r\nexport const fetchEventsFromApiData = createAsyncThunk('api/fetchEventsFromApiData', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\n// Einzelnes Event\r\nexport const fetchEventFromApiData = createAsyncThunk('api/fetchEventFromApiData', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\n// Sperrzeiten add/update\r\nexport const createOrUpdateSperrzeit = createAsyncThunk('api/createOrUpdateSperrzeit', async ({ url, token, bodyData }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token, 'POST', 'json', bodyData)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\nconst eventSlice = createSlice({\r\n name: 'eventStore',\r\n initialState,\r\n reducers: {\r\n addEvent: (state, action) => {\r\n if (state.eventDtos)\r\n state.eventDtos = [...state.eventDtos, action.payload]\r\n },\r\n removeEvent: (state, action) => {\r\n if (state.eventDtos)\r\n state.eventDtos = state.eventDtos.filter((event) => event.uniqueDocId !== action.payload.uniqueDocId)\r\n },\r\n setSelectedEvent: (state, action) => {\r\n state.selectedEvent = action.payload\r\n },\r\n setSelectedDashboardEvent: (state, action) => {\r\n state.selectedEventDashboard = action.payload\r\n },\r\n setSelectedYear: (state, action) => {\r\n state.selectedYear = action.payload\r\n },\r\n clearEventList: (state) => {\r\n state.eventDtos = undefined\r\n },\r\n clearSelectedEvent: (state) => {\r\n state.selectedEvent = null\r\n },\r\n clearSelectedDashboardEvent: (state) => {\r\n state.selectedEventDashboard = null\r\n },\r\n },\r\n extraReducers: (builder) => {\r\n builder\r\n // Event liste + counts\r\n .addCase(fetchEventsFromApiData.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchEventsFromApiData.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.allEventCount = action.payload?.data.allEventCount\r\n state.eventsInTimespan = action.payload?.data.eventsInTimespan\r\n state.eventDtos = action.payload?.data.eventDtos\r\n state.statusCode = result.status\r\n }\r\n })\r\n .addCase(fetchEventsFromApiData.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n\r\n // Einzel Event\r\n .addCase(fetchEventFromApiData.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchEventFromApiData.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.selectedEvent = action.payload?.data\r\n }\r\n })\r\n .addCase(fetchEventFromApiData.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n\r\n // Sperrzeit add/update\r\n .addCase(createOrUpdateSperrzeit.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(createOrUpdateSperrzeit.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n\r\n state.loading = 'succeeded'\r\n if (state.eventDtos) {\r\n const index = state.eventDtos.findIndex((item) => item.uniqueDocId === action.payload?.data?.uniqueDocId)\r\n if (index !== -1) {\r\n // Dublikat gefunden -> update/replace\r\n if (state.eventDtos)\r\n state.eventDtos[index] = { ...state.eventDtos[index], ...action.payload?.data }\r\n } else {\r\n // Keines gefunden -> add\r\n state.eventDtos = [...state.eventDtos, action.payload?.data]\r\n }\r\n }\r\n }\r\n })\r\n .addCase(createOrUpdateSperrzeit.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n },\r\n})\r\n\r\nexport const { setSelectedYear, setSelectedEvent, setSelectedDashboardEvent, clearEventList, clearSelectedEvent, clearSelectedDashboardEvent, addEvent, removeEvent } = eventSlice.actions\r\n\r\nexport default eventSlice.reducer\r\n","import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'\r\nimport { FetchApiDataOptions } from './eventSlice'\r\nimport { AxiosError, AxiosResponse } from 'axios'\r\nimport { fetchDataFromApi } from '../services/fetchDataFromApi'\r\nimport { NwLecturerApplicationDto } from '../types/NwLecturerApplicationDto.tsx'\r\nimport { NwDbFile } from '../types/settingTypes/NwDbFile.tsx'\r\n\r\ninterface ApiState {\r\n selectedRegistration: NwLecturerApplicationDto | undefined\r\n selectedIdx: number | undefined\r\n registrations: NwLecturerApplicationDto[]\r\n files: NwDbFile[]\r\n loading: 'idle' | 'pending' | 'succeeded' | 'failed'\r\n error: string | null\r\n statusCode: number | null\r\n}\r\n\r\nconst initialState: ApiState = {\r\n selectedRegistration: undefined,\r\n selectedIdx: undefined,\r\n registrations: [],\r\n files: [],\r\n loading: 'idle',\r\n error: '',\r\n statusCode: 0,\r\n}\r\n\r\n// Sperrzeiten add/update\r\nexport const deleteFile = createAsyncThunk('api/deleteFile', async ({ url, token, bodyData }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token, 'DELETE', 'json', bodyData)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\nconst register = createSlice({\r\n name: 'registerStore',\r\n initialState,\r\n reducers: {\r\n setSelectedRegistration: (state, action) => {\r\n state.selectedRegistration = action.payload as NwLecturerApplicationDto\r\n },\r\n clearSelectedRegistration: (state) => {\r\n state.selectedRegistration = undefined\r\n },\r\n setRegistrations: (state, action) => {\r\n state.registrations = action.payload as NwLecturerApplicationDto[]\r\n state.selectedIdx = state.registrations.length - 1\r\n },\r\n clearRegistrations: (state) => {\r\n state.registrations = []\r\n state.selectedRegistration = undefined\r\n state.selectedIdx = undefined\r\n },\r\n addRegistrationToList: (state, action) => {\r\n state.registrations = [...state.registrations, action.payload]\r\n state.selectedIdx = state.registrations.length - 1\r\n },\r\n setSelectedRegIdxFromDd: (state, action) => {\r\n state.selectedIdx = action.payload\r\n console.log(state.selectedIdx)\r\n },\r\n setFiles: (state, action) => {\r\n state.files = action.payload\r\n },\r\n removeFile: (state, action) => {\r\n state.files = state.files.filter((file) => file.id !== action.payload.id)\r\n console.log('removed')\r\n },\r\n },\r\n extraReducers: (builder) => {\r\n builder\r\n\r\n .addCase(deleteFile.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(deleteFile.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n .addCase(deleteFile.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n }\r\n })\r\n },\r\n})\r\n\r\nexport const { clearSelectedRegistration, addRegistrationToList, setSelectedRegistration, setRegistrations, setSelectedRegIdxFromDd, setFiles, removeFile, clearRegistrations } = register.actions\r\nexport default register.reducer\r\n","import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'\r\nimport { AxiosError, AxiosResponse } from 'axios'\r\nimport { fetchDataFromApi } from '../services/fetchDataFromApi.tsx'\r\nimport { NwLecturerApplicationDto } from '../types/NwLecturerApplicationDto.tsx'\r\n\r\ninterface SettingState {\r\n selectedDocent: NwLecturerApplicationDto | null\r\n docentList: NwLecturerApplicationDto[] | undefined\r\n docentRequestedList: NwLecturerApplicationDto[] | undefined\r\n loading: 'idle' | 'pending' | 'succeeded' | 'failed'\r\n error: string | null\r\n statusCode: number | null\r\n}\r\n\r\ninterface FetchApiDataOptions {\r\n url: string\r\n token: string\r\n method?: string\r\n}\r\n\r\nconst initialState: SettingState = {\r\n selectedDocent: null,\r\n docentList: undefined,\r\n docentRequestedList: undefined,\r\n loading: 'idle',\r\n error: null,\r\n statusCode: null,\r\n}\r\n\r\n// Alle Dozenten\r\nexport const fetchAllDocentFromApi = createAsyncThunk('api/fetchAllDocentFromApi', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\n// All Dozenten mit Anfrage\r\nexport const fetchRequestedDocentFromApi = createAsyncThunk('api/fetchRequesteDocentFromApi', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\nconst docentSlice = createSlice({\r\n name: 'docentStore',\r\n initialState,\r\n reducers: {\r\n setSelectedDocent: (state, action) => {\r\n state.selectedDocent = action.payload\r\n },\r\n },\r\n extraReducers: (builder) => {\r\n builder\r\n\r\n // Alle Dozenten\r\n .addCase(fetchAllDocentFromApi.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchAllDocentFromApi.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.docentList = action.payload?.data\r\n state.statusCode = result.status\r\n }\r\n })\r\n .addCase(fetchAllDocentFromApi.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n\r\n // Alle Anfragen Dozenten\r\n .addCase(fetchRequestedDocentFromApi.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchRequestedDocentFromApi.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.docentRequestedList = action.payload?.data\r\n state.statusCode = result.status\r\n }\r\n })\r\n .addCase(fetchRequestedDocentFromApi.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n },\r\n})\r\nexport const { setSelectedDocent } = docentSlice.actions\r\nexport default docentSlice.reducer\r\n","import { createSlice } from '@reduxjs/toolkit'\r\n\r\ninterface SideBarState {\r\n isToggled: boolean\r\n}\r\n\r\nconst initialState: SideBarState = {\r\n isToggled: false,\r\n}\r\n\r\nconst sideBar = createSlice({\r\n name: 'sideBarStore',\r\n initialState,\r\n reducers: {\r\n triggerAction: (state, action) => {\r\n state.isToggled = action.payload\r\n },\r\n },\r\n})\r\n\r\nexport const { triggerAction } = sideBar.actions\r\nexport default sideBar.reducer\r\n","import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'\r\nimport { AxiosError, AxiosResponse } from 'axios'\r\nimport { fetchDataFromApi } from '../services/fetchDataFromApi.tsx'\r\n\r\ninterface AppState {\r\n adrNo: string\r\n selectedDocIdx: number | undefined\r\n loading: 'idle' | 'pending' | 'succeeded' | 'failed'\r\n error: string | null\r\n statusCode: number | null\r\n}\r\n\r\ninterface FetchApiDataOptions {\r\n url: string\r\n token: string\r\n method?: string\r\n}\r\n\r\nconst initialState: AppState = {\r\n adrNo: '',\r\n selectedDocIdx: undefined,\r\n loading: 'idle',\r\n error: null,\r\n statusCode: null,\r\n}\r\n\r\n// Dozenten ID per Adress Nr holen\r\nexport const fetchDocentIdByAdressNr = createAsyncThunk('api/fetchDocentIdByAdressNr', async ({ url, token }: FetchApiDataOptions) => {\r\n try {\r\n const data: AxiosResponse | AxiosError = await fetchDataFromApi(url, token)\r\n return data\r\n } catch (error: any) {\r\n // Fehlerbehandlung\r\n }\r\n})\r\n\r\nconst appSlice = createSlice({\r\n name: 'appStore',\r\n initialState,\r\n reducers: {\r\n setAddressNr: (state, action) => {\r\n state.adrNo = action.payload\r\n },\r\n clearAddressNr: (state) => {\r\n state.adrNo = ''\r\n },\r\n setSelectedDocentId: (state, action) => {\r\n state.selectedDocIdx = action.payload\r\n },\r\n clearSelectedDocentId: (state) => {\r\n state.selectedDocIdx = undefined\r\n },\r\n },\r\n extraReducers: (builder) => {\r\n builder\r\n // Dozenten ID per Adress Nr holen\r\n .addCase(fetchDocentIdByAdressNr.pending, (state) => {\r\n state.loading = 'pending'\r\n })\r\n .addCase(fetchDocentIdByAdressNr.fulfilled, (state, action) => {\r\n const result = action.payload\r\n if (result instanceof AxiosError) {\r\n if (result?.status < 200 || result.status >= 300) {\r\n state.statusCode = result.status\r\n } else if (result.code === 'ERR_NETWORK') {\r\n state.statusCode = 503\r\n } else if (result.code === 'ERR_BAD_REQUEST') {\r\n state.statusCode = 403\r\n } else {\r\n state.statusCode = result.status\r\n }\r\n state.loading = 'failed'\r\n state.error = result.statusText\r\n } else if (result) {\r\n state.loading = 'succeeded'\r\n state.selectedDocIdx = action.payload?.data\r\n state.statusCode = result.status\r\n }\r\n })\r\n .addCase(fetchDocentIdByAdressNr.rejected, (state, action) => {\r\n state.loading = 'failed'\r\n state.error = action.error.message || 'An error occurred'\r\n })\r\n },\r\n})\r\n\r\nexport const { setAddressNr, setSelectedDocentId, clearSelectedDocentId, clearAddressNr } = appSlice.actions\r\n\r\nexport default appSlice.reducer\r\n","import { configureStore } from '@reduxjs/toolkit'\r\nimport settingSlice from './settingSlice'\r\nimport eventSlice from './eventSlice'\r\nimport registerSlice from './registerSlice'\r\nimport docentSlice from './docentSlice'\r\nimport sidebarSlice from './sideBarSlice.tsx'\r\nimport appSlice from './appSlice.tsx'\r\n\r\nconst store = configureStore({\r\n reducer: {\r\n app: appSlice,\r\n setting: settingSlice,\r\n event: eventSlice,\r\n register: registerSlice,\r\n docent: docentSlice,\r\n sideBar: sidebarSlice,\r\n },\r\n middleware: (getDefaultMiddleware) => {\r\n return getDefaultMiddleware({ serializableCheck: false })\r\n },\r\n})\r\n\r\n// Infer the `RootState` and `AppDispatch` types from the store itself\r\nexport type RootState = ReturnType\r\n// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}\r\nexport type AppDispatch = typeof store.dispatch\r\nexport default store\r\n","/**\n * @license React\n * use-sync-external-store-with-selector.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var g=require(\"react\");function n(a,b){return a===b&&(0!==a||1/a===1/b)||a!==a&&b!==b}var p=\"function\"===typeof Object.is?Object.is:n,q=g.useSyncExternalStore,r=g.useRef,t=g.useEffect,u=g.useMemo,v=g.useDebugValue;\nexports.useSyncExternalStoreWithSelector=function(a,b,e,l,h){var c=r(null);if(null===c.current){var f={hasValue:!1,value:null};c.current=f}else f=c.current;c=u(function(){function a(a){if(!c){c=!0;d=a;a=l(a);if(void 0!==h&&f.hasValue){var b=f.value;if(h(b,a))return k=b}return k=a}b=k;if(p(d,a))return b;var e=l(a);if(void 0!==h&&h(b,e))return b;d=a;return k=e}var c=!1,d,k,m=void 0===e?null:e;return[function(){return a(b())},null===m?void 0:function(){return a(m())}]},[b,e,l,h]);var d=q(a,c[0],c[1]);\nt(function(){f.hasValue=!0;f.value=d},[d]);v(d);return d};\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n module.exports = require('./cjs/use-sync-external-store-with-selector.production.min.js');\n} else {\n module.exports = require('./cjs/use-sync-external-store-with-selector.development.js');\n}\n","// src/index.ts\nimport * as React2 from \"react\";\nimport { useSyncExternalStoreWithSelector as useSyncExternalStoreWithSelector2 } from \"use-sync-external-store/with-selector.js\";\n\n// src/utils/react.ts\nimport * as ReactOriginal from \"react\";\nvar React = (\n // prettier-ignore\n // @ts-ignore\n \"default\" in ReactOriginal ? ReactOriginal[\"default\"] : ReactOriginal\n);\n\n// src/components/Context.ts\nvar ContextKey = Symbol.for(`react-redux-context`);\nvar gT = typeof globalThis !== \"undefined\" ? globalThis : (\n /* fall back to a per-module scope (pre-8.1 behaviour) if `globalThis` is not available */\n {}\n);\nfunction getContext() {\n if (!React.createContext)\n return {};\n const contextMap = gT[ContextKey] ?? (gT[ContextKey] = /* @__PURE__ */ new Map());\n let realContext = contextMap.get(React.createContext);\n if (!realContext) {\n realContext = React.createContext(\n null\n );\n if (process.env.NODE_ENV !== \"production\") {\n realContext.displayName = \"ReactRedux\";\n }\n contextMap.set(React.createContext, realContext);\n }\n return realContext;\n}\nvar ReactReduxContext = /* @__PURE__ */ getContext();\n\n// src/utils/useSyncExternalStore.ts\nvar notInitialized = () => {\n throw new Error(\"uSES not initialized!\");\n};\n\n// src/hooks/useReduxContext.ts\nfunction createReduxContextHook(context = ReactReduxContext) {\n return function useReduxContext2() {\n const contextValue = React.useContext(context);\n if (process.env.NODE_ENV !== \"production\" && !contextValue) {\n throw new Error(\n \"could not find react-redux context value; please ensure the component is wrapped in a \"\n );\n }\n return contextValue;\n };\n}\nvar useReduxContext = /* @__PURE__ */ createReduxContextHook();\n\n// src/hooks/useSelector.ts\nvar useSyncExternalStoreWithSelector = notInitialized;\nvar initializeUseSelector = (fn) => {\n useSyncExternalStoreWithSelector = fn;\n};\nvar refEquality = (a, b) => a === b;\nfunction createSelectorHook(context = ReactReduxContext) {\n const useReduxContext2 = context === ReactReduxContext ? useReduxContext : createReduxContextHook(context);\n const useSelector2 = (selector, equalityFnOrOptions = {}) => {\n const { equalityFn = refEquality, devModeChecks = {} } = typeof equalityFnOrOptions === \"function\" ? { equalityFn: equalityFnOrOptions } : equalityFnOrOptions;\n if (process.env.NODE_ENV !== \"production\") {\n if (!selector) {\n throw new Error(`You must pass a selector to useSelector`);\n }\n if (typeof selector !== \"function\") {\n throw new Error(`You must pass a function as a selector to useSelector`);\n }\n if (typeof equalityFn !== \"function\") {\n throw new Error(\n `You must pass a function as an equality function to useSelector`\n );\n }\n }\n const {\n store,\n subscription,\n getServerState,\n stabilityCheck,\n identityFunctionCheck\n } = useReduxContext2();\n const firstRun = React.useRef(true);\n const wrappedSelector = React.useCallback(\n {\n [selector.name](state) {\n const selected = selector(state);\n if (process.env.NODE_ENV !== \"production\") {\n const {\n identityFunctionCheck: finalIdentityFunctionCheck,\n stabilityCheck: finalStabilityCheck\n } = {\n stabilityCheck,\n identityFunctionCheck,\n ...devModeChecks\n };\n if (finalStabilityCheck === \"always\" || finalStabilityCheck === \"once\" && firstRun.current) {\n const toCompare = selector(state);\n if (!equalityFn(selected, toCompare)) {\n let stack = void 0;\n try {\n throw new Error();\n } catch (e) {\n ;\n ({ stack } = e);\n }\n console.warn(\n \"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 {\n state,\n selected,\n selected2: toCompare,\n stack\n }\n );\n }\n }\n if (finalIdentityFunctionCheck === \"always\" || finalIdentityFunctionCheck === \"once\" && firstRun.current) {\n if (selected === state) {\n let stack = void 0;\n try {\n throw new Error();\n } catch (e) {\n ;\n ({ stack } = e);\n }\n console.warn(\n \"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 if (firstRun.current)\n firstRun.current = false;\n }\n return selected;\n }\n }[selector.name],\n [selector, stabilityCheck, devModeChecks.stabilityCheck]\n );\n const selectedState = useSyncExternalStoreWithSelector(\n subscription.addNestedSub,\n store.getState,\n getServerState || store.getState,\n wrappedSelector,\n equalityFn\n );\n React.useDebugValue(selectedState);\n return selectedState;\n };\n Object.assign(useSelector2, {\n withTypes: () => useSelector2\n });\n return useSelector2;\n}\nvar useSelector = /* @__PURE__ */ createSelectorHook();\n\n// src/utils/react-is.ts\nvar REACT_ELEMENT_TYPE = Symbol.for(\"react.element\");\nvar REACT_PORTAL_TYPE = Symbol.for(\"react.portal\");\nvar REACT_FRAGMENT_TYPE = Symbol.for(\"react.fragment\");\nvar REACT_STRICT_MODE_TYPE = Symbol.for(\"react.strict_mode\");\nvar REACT_PROFILER_TYPE = Symbol.for(\"react.profiler\");\nvar REACT_PROVIDER_TYPE = Symbol.for(\"react.provider\");\nvar REACT_CONTEXT_TYPE = Symbol.for(\"react.context\");\nvar REACT_SERVER_CONTEXT_TYPE = Symbol.for(\"react.server_context\");\nvar REACT_FORWARD_REF_TYPE = Symbol.for(\"react.forward_ref\");\nvar REACT_SUSPENSE_TYPE = Symbol.for(\"react.suspense\");\nvar REACT_SUSPENSE_LIST_TYPE = Symbol.for(\"react.suspense_list\");\nvar REACT_MEMO_TYPE = Symbol.for(\"react.memo\");\nvar REACT_LAZY_TYPE = Symbol.for(\"react.lazy\");\nvar REACT_OFFSCREEN_TYPE = Symbol.for(\"react.offscreen\");\nvar REACT_CLIENT_REFERENCE = Symbol.for(\"react.client.reference\");\nvar ForwardRef = REACT_FORWARD_REF_TYPE;\nvar Memo = REACT_MEMO_TYPE;\nfunction isValidElementType(type) {\n if (typeof type === \"string\" || typeof type === \"function\") {\n return true;\n }\n if (type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || type === REACT_OFFSCREEN_TYPE) {\n return true;\n }\n if (typeof type === \"object\" && type !== null) {\n if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || // This needs to include all possible module reference object\n // types supported by any Flight configuration anywhere since\n // we don't know which Flight build this will end up being used\n // with.\n type.$$typeof === REACT_CLIENT_REFERENCE || type.getModuleId !== void 0) {\n return true;\n }\n }\n return false;\n}\nfunction typeOf(object) {\n if (typeof object === \"object\" && object !== null) {\n const $$typeof = object.$$typeof;\n switch ($$typeof) {\n case REACT_ELEMENT_TYPE: {\n const type = object.type;\n switch (type) {\n case REACT_FRAGMENT_TYPE:\n case REACT_PROFILER_TYPE:\n case REACT_STRICT_MODE_TYPE:\n case REACT_SUSPENSE_TYPE:\n case REACT_SUSPENSE_LIST_TYPE:\n return type;\n default: {\n const $$typeofType = type && type.$$typeof;\n switch ($$typeofType) {\n case REACT_SERVER_CONTEXT_TYPE:\n case REACT_CONTEXT_TYPE:\n case REACT_FORWARD_REF_TYPE:\n case REACT_LAZY_TYPE:\n case REACT_MEMO_TYPE:\n case REACT_PROVIDER_TYPE:\n return $$typeofType;\n default:\n return $$typeof;\n }\n }\n }\n }\n case REACT_PORTAL_TYPE: {\n return $$typeof;\n }\n }\n }\n return void 0;\n}\nfunction isContextConsumer(object) {\n return typeOf(object) === REACT_CONTEXT_TYPE;\n}\nfunction isMemo(object) {\n return typeOf(object) === REACT_MEMO_TYPE;\n}\n\n// src/utils/warning.ts\nfunction warning(message) {\n if (typeof console !== \"undefined\" && typeof console.error === \"function\") {\n console.error(message);\n }\n try {\n throw new Error(message);\n } catch (e) {\n }\n}\n\n// src/connect/verifySubselectors.ts\nfunction verify(selector, methodName) {\n if (!selector) {\n throw new Error(`Unexpected value for ${methodName} in connect.`);\n } else if (methodName === \"mapStateToProps\" || methodName === \"mapDispatchToProps\") {\n if (!Object.prototype.hasOwnProperty.call(selector, \"dependsOnOwnProps\")) {\n warning(\n `The selector for ${methodName} of connect did not specify a value for dependsOnOwnProps.`\n );\n }\n }\n}\nfunction verifySubselectors(mapStateToProps, mapDispatchToProps, mergeProps) {\n verify(mapStateToProps, \"mapStateToProps\");\n verify(mapDispatchToProps, \"mapDispatchToProps\");\n verify(mergeProps, \"mergeProps\");\n}\n\n// src/connect/selectorFactory.ts\nfunction pureFinalPropsSelectorFactory(mapStateToProps, mapDispatchToProps, mergeProps, dispatch, {\n areStatesEqual,\n areOwnPropsEqual,\n areStatePropsEqual\n}) {\n let hasRunAtLeastOnce = false;\n let state;\n let ownProps;\n let stateProps;\n let dispatchProps;\n let mergedProps;\n function handleFirstCall(firstState, firstOwnProps) {\n state = firstState;\n ownProps = firstOwnProps;\n stateProps = mapStateToProps(state, ownProps);\n dispatchProps = mapDispatchToProps(dispatch, ownProps);\n mergedProps = mergeProps(stateProps, dispatchProps, ownProps);\n hasRunAtLeastOnce = true;\n return mergedProps;\n }\n function handleNewPropsAndNewState() {\n stateProps = mapStateToProps(state, ownProps);\n if (mapDispatchToProps.dependsOnOwnProps)\n dispatchProps = mapDispatchToProps(dispatch, ownProps);\n mergedProps = mergeProps(stateProps, dispatchProps, ownProps);\n return mergedProps;\n }\n function handleNewProps() {\n if (mapStateToProps.dependsOnOwnProps)\n stateProps = mapStateToProps(state, ownProps);\n if (mapDispatchToProps.dependsOnOwnProps)\n dispatchProps = mapDispatchToProps(dispatch, ownProps);\n mergedProps = mergeProps(stateProps, dispatchProps, ownProps);\n return mergedProps;\n }\n function handleNewState() {\n const nextStateProps = mapStateToProps(state, ownProps);\n const statePropsChanged = !areStatePropsEqual(nextStateProps, stateProps);\n stateProps = nextStateProps;\n if (statePropsChanged)\n mergedProps = mergeProps(stateProps, dispatchProps, ownProps);\n return mergedProps;\n }\n function handleSubsequentCalls(nextState, nextOwnProps) {\n const propsChanged = !areOwnPropsEqual(nextOwnProps, ownProps);\n const stateChanged = !areStatesEqual(\n nextState,\n state,\n nextOwnProps,\n ownProps\n );\n state = nextState;\n ownProps = nextOwnProps;\n if (propsChanged && stateChanged)\n return handleNewPropsAndNewState();\n if (propsChanged)\n return handleNewProps();\n if (stateChanged)\n return handleNewState();\n return mergedProps;\n }\n return function pureFinalPropsSelector(nextState, nextOwnProps) {\n return hasRunAtLeastOnce ? handleSubsequentCalls(nextState, nextOwnProps) : handleFirstCall(nextState, nextOwnProps);\n };\n}\nfunction finalPropsSelectorFactory(dispatch, {\n initMapStateToProps,\n initMapDispatchToProps,\n initMergeProps,\n ...options\n}) {\n const mapStateToProps = initMapStateToProps(dispatch, options);\n const mapDispatchToProps = initMapDispatchToProps(dispatch, options);\n const mergeProps = initMergeProps(dispatch, options);\n if (process.env.NODE_ENV !== \"production\") {\n verifySubselectors(mapStateToProps, mapDispatchToProps, mergeProps);\n }\n return pureFinalPropsSelectorFactory(mapStateToProps, mapDispatchToProps, mergeProps, dispatch, options);\n}\n\n// src/utils/bindActionCreators.ts\nfunction bindActionCreators(actionCreators, dispatch) {\n const boundActionCreators = {};\n for (const key in actionCreators) {\n const actionCreator = actionCreators[key];\n if (typeof actionCreator === \"function\") {\n boundActionCreators[key] = (...args) => dispatch(actionCreator(...args));\n }\n }\n return boundActionCreators;\n}\n\n// src/utils/isPlainObject.ts\nfunction isPlainObject(obj) {\n if (typeof obj !== \"object\" || obj === null)\n return false;\n const proto = Object.getPrototypeOf(obj);\n if (proto === null)\n return true;\n let baseProto = proto;\n while (Object.getPrototypeOf(baseProto) !== null) {\n baseProto = Object.getPrototypeOf(baseProto);\n }\n return proto === baseProto;\n}\n\n// src/utils/verifyPlainObject.ts\nfunction verifyPlainObject(value, displayName, methodName) {\n if (!isPlainObject(value)) {\n warning(\n `${methodName}() in ${displayName} must return a plain object. Instead received ${value}.`\n );\n }\n}\n\n// src/connect/wrapMapToProps.ts\nfunction wrapMapToPropsConstant(getConstant) {\n return function initConstantSelector(dispatch) {\n const constant = getConstant(dispatch);\n function constantSelector() {\n return constant;\n }\n constantSelector.dependsOnOwnProps = false;\n return constantSelector;\n };\n}\nfunction getDependsOnOwnProps(mapToProps) {\n return mapToProps.dependsOnOwnProps ? Boolean(mapToProps.dependsOnOwnProps) : mapToProps.length !== 1;\n}\nfunction wrapMapToPropsFunc(mapToProps, methodName) {\n return function initProxySelector(dispatch, { displayName }) {\n const proxy = function mapToPropsProxy(stateOrDispatch, ownProps) {\n return proxy.dependsOnOwnProps ? proxy.mapToProps(stateOrDispatch, ownProps) : proxy.mapToProps(stateOrDispatch, void 0);\n };\n proxy.dependsOnOwnProps = true;\n proxy.mapToProps = function detectFactoryAndVerify(stateOrDispatch, ownProps) {\n proxy.mapToProps = mapToProps;\n proxy.dependsOnOwnProps = getDependsOnOwnProps(mapToProps);\n let props = proxy(stateOrDispatch, ownProps);\n if (typeof props === \"function\") {\n proxy.mapToProps = props;\n proxy.dependsOnOwnProps = getDependsOnOwnProps(props);\n props = proxy(stateOrDispatch, ownProps);\n }\n if (process.env.NODE_ENV !== \"production\")\n verifyPlainObject(props, displayName, methodName);\n return props;\n };\n return proxy;\n };\n}\n\n// src/connect/invalidArgFactory.ts\nfunction createInvalidArgFactory(arg, name) {\n return (dispatch, options) => {\n throw new Error(\n `Invalid value of type ${typeof arg} for ${name} argument when connecting component ${options.wrappedComponentName}.`\n );\n };\n}\n\n// src/connect/mapDispatchToProps.ts\nfunction mapDispatchToPropsFactory(mapDispatchToProps) {\n return mapDispatchToProps && typeof mapDispatchToProps === \"object\" ? wrapMapToPropsConstant(\n (dispatch) => (\n // @ts-ignore\n bindActionCreators(mapDispatchToProps, dispatch)\n )\n ) : !mapDispatchToProps ? wrapMapToPropsConstant((dispatch) => ({\n dispatch\n })) : typeof mapDispatchToProps === \"function\" ? (\n // @ts-ignore\n wrapMapToPropsFunc(mapDispatchToProps, \"mapDispatchToProps\")\n ) : createInvalidArgFactory(mapDispatchToProps, \"mapDispatchToProps\");\n}\n\n// src/connect/mapStateToProps.ts\nfunction mapStateToPropsFactory(mapStateToProps) {\n return !mapStateToProps ? wrapMapToPropsConstant(() => ({})) : typeof mapStateToProps === \"function\" ? (\n // @ts-ignore\n wrapMapToPropsFunc(mapStateToProps, \"mapStateToProps\")\n ) : createInvalidArgFactory(mapStateToProps, \"mapStateToProps\");\n}\n\n// src/connect/mergeProps.ts\nfunction defaultMergeProps(stateProps, dispatchProps, ownProps) {\n return { ...ownProps, ...stateProps, ...dispatchProps };\n}\nfunction wrapMergePropsFunc(mergeProps) {\n return function initMergePropsProxy(dispatch, { displayName, areMergedPropsEqual }) {\n let hasRunOnce = false;\n let mergedProps;\n return function mergePropsProxy(stateProps, dispatchProps, ownProps) {\n const nextMergedProps = mergeProps(stateProps, dispatchProps, ownProps);\n if (hasRunOnce) {\n if (!areMergedPropsEqual(nextMergedProps, mergedProps))\n mergedProps = nextMergedProps;\n } else {\n hasRunOnce = true;\n mergedProps = nextMergedProps;\n if (process.env.NODE_ENV !== \"production\")\n verifyPlainObject(mergedProps, displayName, \"mergeProps\");\n }\n return mergedProps;\n };\n };\n}\nfunction mergePropsFactory(mergeProps) {\n return !mergeProps ? () => defaultMergeProps : typeof mergeProps === \"function\" ? wrapMergePropsFunc(mergeProps) : createInvalidArgFactory(mergeProps, \"mergeProps\");\n}\n\n// src/utils/batch.ts\nfunction defaultNoopBatch(callback) {\n callback();\n}\n\n// src/utils/Subscription.ts\nfunction createListenerCollection() {\n let first = null;\n let last = null;\n return {\n clear() {\n first = null;\n last = null;\n },\n notify() {\n defaultNoopBatch(() => {\n let listener = first;\n while (listener) {\n listener.callback();\n listener = listener.next;\n }\n });\n },\n get() {\n const listeners = [];\n let listener = first;\n while (listener) {\n listeners.push(listener);\n listener = listener.next;\n }\n return listeners;\n },\n subscribe(callback) {\n let isSubscribed = true;\n const listener = last = {\n callback,\n next: null,\n prev: last\n };\n if (listener.prev) {\n listener.prev.next = listener;\n } else {\n first = listener;\n }\n return function unsubscribe() {\n if (!isSubscribed || first === null)\n return;\n isSubscribed = false;\n if (listener.next) {\n listener.next.prev = listener.prev;\n } else {\n last = listener.prev;\n }\n if (listener.prev) {\n listener.prev.next = listener.next;\n } else {\n first = listener.next;\n }\n };\n }\n };\n}\nvar nullListeners = {\n notify() {\n },\n get: () => []\n};\nfunction createSubscription(store, parentSub) {\n let unsubscribe;\n let listeners = nullListeners;\n let subscriptionsAmount = 0;\n let selfSubscribed = false;\n function addNestedSub(listener) {\n trySubscribe();\n const cleanupListener = listeners.subscribe(listener);\n let removed = false;\n return () => {\n if (!removed) {\n removed = true;\n cleanupListener();\n tryUnsubscribe();\n }\n };\n }\n function notifyNestedSubs() {\n listeners.notify();\n }\n function handleChangeWrapper() {\n if (subscription.onStateChange) {\n subscription.onStateChange();\n }\n }\n function isSubscribed() {\n return selfSubscribed;\n }\n function trySubscribe() {\n subscriptionsAmount++;\n if (!unsubscribe) {\n unsubscribe = parentSub ? parentSub.addNestedSub(handleChangeWrapper) : store.subscribe(handleChangeWrapper);\n listeners = createListenerCollection();\n }\n }\n function tryUnsubscribe() {\n subscriptionsAmount--;\n if (unsubscribe && subscriptionsAmount === 0) {\n unsubscribe();\n unsubscribe = void 0;\n listeners.clear();\n listeners = nullListeners;\n }\n }\n function trySubscribeSelf() {\n if (!selfSubscribed) {\n selfSubscribed = true;\n trySubscribe();\n }\n }\n function tryUnsubscribeSelf() {\n if (selfSubscribed) {\n selfSubscribed = false;\n tryUnsubscribe();\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}\n\n// src/utils/useIsomorphicLayoutEffect.ts\nvar canUseDOM = !!(typeof window !== \"undefined\" && typeof window.document !== \"undefined\" && typeof window.document.createElement !== \"undefined\");\nvar isReactNative = typeof navigator !== \"undefined\" && navigator.product === \"ReactNative\";\nvar useIsomorphicLayoutEffect = canUseDOM || isReactNative ? React.useLayoutEffect : React.useEffect;\n\n// src/utils/shallowEqual.ts\nfunction is(x, y) {\n if (x === y) {\n return x !== 0 || y !== 0 || 1 / x === 1 / y;\n } else {\n return x !== x && y !== y;\n }\n}\nfunction shallowEqual(objA, objB) {\n if (is(objA, objB))\n return true;\n if (typeof objA !== \"object\" || objA === null || typeof objB !== \"object\" || objB === null) {\n return false;\n }\n const keysA = Object.keys(objA);\n const keysB = Object.keys(objB);\n if (keysA.length !== keysB.length)\n return false;\n for (let i = 0; i < keysA.length; i++) {\n if (!Object.prototype.hasOwnProperty.call(objB, keysA[i]) || !is(objA[keysA[i]], objB[keysA[i]])) {\n return false;\n }\n }\n return true;\n}\n\n// src/utils/hoistStatics.ts\nvar REACT_STATICS = {\n childContextTypes: true,\n contextType: true,\n contextTypes: true,\n defaultProps: true,\n displayName: true,\n getDefaultProps: true,\n getDerivedStateFromError: true,\n getDerivedStateFromProps: true,\n mixins: true,\n propTypes: true,\n type: true\n};\nvar KNOWN_STATICS = {\n name: true,\n length: true,\n prototype: true,\n caller: true,\n callee: true,\n arguments: true,\n arity: true\n};\nvar FORWARD_REF_STATICS = {\n $$typeof: true,\n render: true,\n defaultProps: true,\n displayName: true,\n propTypes: true\n};\nvar MEMO_STATICS = {\n $$typeof: true,\n compare: true,\n defaultProps: true,\n displayName: true,\n propTypes: true,\n type: true\n};\nvar TYPE_STATICS = {\n [ForwardRef]: FORWARD_REF_STATICS,\n [Memo]: MEMO_STATICS\n};\nfunction getStatics(component) {\n if (isMemo(component)) {\n return MEMO_STATICS;\n }\n return TYPE_STATICS[component[\"$$typeof\"]] || REACT_STATICS;\n}\nvar defineProperty = Object.defineProperty;\nvar getOwnPropertyNames = Object.getOwnPropertyNames;\nvar getOwnPropertySymbols = Object.getOwnPropertySymbols;\nvar getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;\nvar getPrototypeOf = Object.getPrototypeOf;\nvar objectPrototype = Object.prototype;\nfunction hoistNonReactStatics(targetComponent, sourceComponent) {\n if (typeof sourceComponent !== \"string\") {\n if (objectPrototype) {\n const inheritedComponent = getPrototypeOf(sourceComponent);\n if (inheritedComponent && inheritedComponent !== objectPrototype) {\n hoistNonReactStatics(targetComponent, inheritedComponent);\n }\n }\n let keys = getOwnPropertyNames(sourceComponent);\n if (getOwnPropertySymbols) {\n keys = keys.concat(getOwnPropertySymbols(sourceComponent));\n }\n const targetStatics = getStatics(targetComponent);\n const sourceStatics = getStatics(sourceComponent);\n for (let i = 0; i < keys.length; ++i) {\n const key = keys[i];\n if (!KNOWN_STATICS[key] && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {\n const descriptor = getOwnPropertyDescriptor(sourceComponent, key);\n try {\n defineProperty(targetComponent, key, descriptor);\n } catch (e) {\n }\n }\n }\n }\n return targetComponent;\n}\n\n// src/components/connect.tsx\nvar useSyncExternalStore = notInitialized;\nvar initializeConnect = (fn) => {\n useSyncExternalStore = fn;\n};\nvar NO_SUBSCRIPTION_ARRAY = [null, null];\nvar stringifyComponent = (Comp) => {\n try {\n return JSON.stringify(Comp);\n } catch (err) {\n return String(Comp);\n }\n};\nfunction useIsomorphicLayoutEffectWithArgs(effectFunc, effectArgs, dependencies) {\n useIsomorphicLayoutEffect(() => effectFunc(...effectArgs), dependencies);\n}\nfunction captureWrapperProps(lastWrapperProps, lastChildProps, renderIsScheduled, wrapperProps, childPropsFromStoreUpdate, notifyNestedSubs) {\n lastWrapperProps.current = wrapperProps;\n renderIsScheduled.current = false;\n if (childPropsFromStoreUpdate.current) {\n childPropsFromStoreUpdate.current = null;\n notifyNestedSubs();\n }\n}\nfunction subscribeUpdates(shouldHandleStateChanges, store, subscription, childPropsSelector, lastWrapperProps, lastChildProps, renderIsScheduled, isMounted, childPropsFromStoreUpdate, notifyNestedSubs, additionalSubscribeListener) {\n if (!shouldHandleStateChanges)\n return () => {\n };\n let didUnsubscribe = false;\n let lastThrownError = null;\n const checkForUpdates = () => {\n if (didUnsubscribe || !isMounted.current) {\n return;\n }\n const latestStoreState = store.getState();\n let newChildProps, error;\n try {\n newChildProps = childPropsSelector(\n latestStoreState,\n lastWrapperProps.current\n );\n } catch (e) {\n error = e;\n lastThrownError = e;\n }\n if (!error) {\n lastThrownError = null;\n }\n if (newChildProps === lastChildProps.current) {\n if (!renderIsScheduled.current) {\n notifyNestedSubs();\n }\n } else {\n lastChildProps.current = newChildProps;\n childPropsFromStoreUpdate.current = newChildProps;\n renderIsScheduled.current = true;\n additionalSubscribeListener();\n }\n };\n subscription.onStateChange = checkForUpdates;\n subscription.trySubscribe();\n checkForUpdates();\n const unsubscribeWrapper = () => {\n didUnsubscribe = true;\n subscription.tryUnsubscribe();\n subscription.onStateChange = null;\n if (lastThrownError) {\n throw lastThrownError;\n }\n };\n return unsubscribeWrapper;\n}\nfunction strictEqual(a, b) {\n return a === b;\n}\nvar hasWarnedAboutDeprecatedPureOption = false;\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 !== void 0 && !hasWarnedAboutDeprecatedPureOption) {\n hasWarnedAboutDeprecatedPureOption = true;\n warning(\n '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 const wrapWithConnect = (WrappedComponent) => {\n if (process.env.NODE_ENV !== \"production\") {\n const isValid = /* @__PURE__ */ isValidElementType(WrappedComponent);\n if (!isValid)\n throw new Error(\n `You must pass a component to the function returned by connect. Instead received ${stringifyComponent(\n WrappedComponent\n )}`\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 function ConnectFunction(props) {\n const [propsContext, reactReduxForwardedRef, wrapperProps] = React.useMemo(() => {\n const { reactReduxForwardedRef: reactReduxForwardedRef2, ...wrapperProps2 } = props;\n return [props.context, reactReduxForwardedRef2, wrapperProps2];\n }, [props]);\n const ContextToUse = React.useMemo(() => {\n let ResultContext = Context;\n if (propsContext?.Consumer) {\n if (process.env.NODE_ENV !== \"production\") {\n const isValid = /* @__PURE__ */ isContextConsumer(\n // @ts-ignore\n /* @__PURE__ */ React.createElement(propsContext.Consumer, null)\n );\n if (!isValid) {\n throw new Error(\n \"You must pass a valid React context consumer as `props.context`\"\n );\n }\n ResultContext = propsContext;\n }\n }\n return ResultContext;\n }, [propsContext, Context]);\n const contextValue = React.useContext(ContextToUse);\n const didStoreComeFromProps = Boolean(props.store) && Boolean(props.store.getState) && Boolean(props.store.dispatch);\n const didStoreComeFromContext = Boolean(contextValue) && Boolean(contextValue.store);\n if (process.env.NODE_ENV !== \"production\" && !didStoreComeFromProps && !didStoreComeFromContext) {\n throw new Error(\n `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 );\n }\n const store = didStoreComeFromProps ? props.store : contextValue.store;\n const getServerState = didStoreComeFromContext ? contextValue.getServerState : store.getState;\n const childPropsSelector = React.useMemo(() => {\n return finalPropsSelectorFactory(store.dispatch, selectorFactoryOptions);\n }, [store]);\n const [subscription, notifyNestedSubs] = React.useMemo(() => {\n if (!shouldHandleStateChanges)\n return NO_SUBSCRIPTION_ARRAY;\n const subscription2 = createSubscription(\n store,\n didStoreComeFromProps ? void 0 : contextValue.subscription\n );\n const notifyNestedSubs2 = subscription2.notifyNestedSubs.bind(subscription2);\n return [subscription2, notifyNestedSubs2];\n }, [store, didStoreComeFromProps, contextValue]);\n const overriddenContextValue = React.useMemo(() => {\n if (didStoreComeFromProps) {\n return contextValue;\n }\n return {\n ...contextValue,\n subscription\n };\n }, [didStoreComeFromProps, contextValue, subscription]);\n const lastChildProps = React.useRef(void 0);\n const lastWrapperProps = React.useRef(wrapperProps);\n const childPropsFromStoreUpdate = React.useRef(void 0);\n const renderIsScheduled = React.useRef(false);\n const isMounted = React.useRef(false);\n const latestSubscriptionCallbackError = React.useRef(\n void 0\n );\n useIsomorphicLayoutEffect(() => {\n isMounted.current = true;\n return () => {\n isMounted.current = false;\n };\n }, []);\n const actualChildPropsSelector = React.useMemo(() => {\n const selector = () => {\n if (childPropsFromStoreUpdate.current && wrapperProps === lastWrapperProps.current) {\n return childPropsFromStoreUpdate.current;\n }\n return childPropsSelector(store.getState(), wrapperProps);\n };\n return selector;\n }, [store, wrapperProps]);\n const subscribeForReact = React.useMemo(() => {\n const subscribe = (reactListener) => {\n if (!subscription) {\n return () => {\n };\n }\n return subscribeUpdates(\n shouldHandleStateChanges,\n store,\n subscription,\n // @ts-ignore\n childPropsSelector,\n lastWrapperProps,\n lastChildProps,\n renderIsScheduled,\n isMounted,\n childPropsFromStoreUpdate,\n notifyNestedSubs,\n reactListener\n );\n };\n return subscribe;\n }, [subscription]);\n useIsomorphicLayoutEffectWithArgs(captureWrapperProps, [\n lastWrapperProps,\n lastChildProps,\n renderIsScheduled,\n wrapperProps,\n childPropsFromStoreUpdate,\n notifyNestedSubs\n ]);\n let actualChildProps;\n try {\n actualChildProps = useSyncExternalStore(\n // TODO We're passing through a big wrapper that does a bunch of extra side effects besides subscribing\n subscribeForReact,\n // 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,\n getServerState ? () => childPropsSelector(getServerState(), wrapperProps) : actualChildPropsSelector\n );\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 throw err;\n }\n useIsomorphicLayoutEffect(() => {\n latestSubscriptionCallbackError.current = void 0;\n childPropsFromStoreUpdate.current = void 0;\n lastChildProps.current = actualChildProps;\n });\n const renderedWrappedComponent = React.useMemo(() => {\n return (\n // @ts-ignore\n /* @__PURE__ */ React.createElement(\n WrappedComponent,\n {\n ...actualChildProps,\n ref: reactReduxForwardedRef\n }\n )\n );\n }, [reactReduxForwardedRef, WrappedComponent, actualChildProps]);\n const renderedChild = React.useMemo(() => {\n if (shouldHandleStateChanges) {\n return /* @__PURE__ */ React.createElement(ContextToUse.Provider, { value: overriddenContextValue }, renderedWrappedComponent);\n }\n return renderedWrappedComponent;\n }, [ContextToUse, renderedWrappedComponent, overriddenContextValue]);\n return renderedChild;\n }\n const _Connect = React.memo(ConnectFunction);\n const Connect = _Connect;\n Connect.WrappedComponent = WrappedComponent;\n Connect.displayName = ConnectFunction.displayName = displayName;\n if (forwardRef) {\n const _forwarded = React.forwardRef(\n function forwardConnectRef(props, ref) {\n return /* @__PURE__ */ React.createElement(Connect, { ...props, reactReduxForwardedRef: ref });\n }\n );\n const forwarded = _forwarded;\n forwarded.displayName = displayName;\n forwarded.WrappedComponent = WrappedComponent;\n return /* @__PURE__ */ hoistNonReactStatics(forwarded, WrappedComponent);\n }\n return /* @__PURE__ */ hoistNonReactStatics(Connect, WrappedComponent);\n };\n return wrapWithConnect;\n}\nvar connect_default = connect;\n\n// src/components/Provider.tsx\nfunction Provider({\n store,\n context,\n children,\n serverState,\n stabilityCheck = \"once\",\n identityFunctionCheck = \"once\"\n}) {\n const contextValue = React.useMemo(() => {\n const subscription = createSubscription(store);\n return {\n store,\n subscription,\n getServerState: serverState ? () => serverState : void 0,\n stabilityCheck,\n identityFunctionCheck\n };\n }, [store, serverState, stabilityCheck, identityFunctionCheck]);\n const previousState = React.useMemo(() => store.getState(), [store]);\n useIsomorphicLayoutEffect(() => {\n const { subscription } = contextValue;\n subscription.onStateChange = subscription.notifyNestedSubs;\n subscription.trySubscribe();\n if (previousState !== store.getState()) {\n subscription.notifyNestedSubs();\n }\n return () => {\n subscription.tryUnsubscribe();\n subscription.onStateChange = void 0;\n };\n }, [contextValue, previousState]);\n const Context = context || ReactReduxContext;\n return /* @__PURE__ */ React.createElement(Context.Provider, { value: contextValue }, children);\n}\nvar Provider_default = Provider;\n\n// src/hooks/useStore.ts\nfunction createStoreHook(context = ReactReduxContext) {\n const useReduxContext2 = context === ReactReduxContext ? useReduxContext : (\n // @ts-ignore\n createReduxContextHook(context)\n );\n const useStore2 = () => {\n const { store } = useReduxContext2();\n return store;\n };\n Object.assign(useStore2, {\n withTypes: () => useStore2\n });\n return useStore2;\n}\nvar useStore = /* @__PURE__ */ createStoreHook();\n\n// src/hooks/useDispatch.ts\nfunction createDispatchHook(context = ReactReduxContext) {\n const useStore2 = context === ReactReduxContext ? useStore : createStoreHook(context);\n const useDispatch2 = () => {\n const store = useStore2();\n return store.dispatch;\n };\n Object.assign(useDispatch2, {\n withTypes: () => useDispatch2\n });\n return useDispatch2;\n}\nvar useDispatch = /* @__PURE__ */ createDispatchHook();\n\n// src/exports.ts\nvar batch = defaultNoopBatch;\n\n// src/index.ts\ninitializeUseSelector(useSyncExternalStoreWithSelector2);\ninitializeConnect(React2.useSyncExternalStore);\nexport {\n Provider_default as Provider,\n ReactReduxContext,\n batch,\n connect_default as connect,\n createDispatchHook,\n createSelectorHook,\n createStoreHook,\n shallowEqual,\n useDispatch,\n useSelector,\n useStore\n};\n//# sourceMappingURL=react-redux.mjs.map","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * React Component Base\n */\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { extend, isNullOrUndefined, setValue, getValue, isObject, onIntlChange } from '@syncfusion/ej2-base';\nvar defaulthtmlkeys = ['alt', 'className', 'disabled', 'form', 'id',\n 'readOnly', 'style', 'tabIndex', 'title', 'type', 'name',\n 'onClick', 'onFocus', 'onBlur'];\nvar delayUpdate = ['accordion', 'tab', 'splitter'];\nvar isColEName = /\\]/;\n// tslint:disable\n/* eslint-disable @typescript-eslint/no-explicit-any */\nvar ComponentBase = /** @class */ (function (_super) {\n __extends(ComponentBase, _super);\n function ComponentBase() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.mountingState = false;\n _this.attrKeys = [];\n _this.cachedTimeOut = 0;\n _this.isAppendCalled = false;\n _this.initRenderCalled = false;\n _this.isReactForeceUpdate = false;\n _this.isReact = true;\n _this.isshouldComponentUpdateCalled = false;\n _this.isCreated = false;\n return _this;\n }\n // Lifecycle methods are changed by React team and so we can deprecate this method and use\n // Reference link:https://reactjs.org/docs/react-component.html#unsafe_componentWillMount\n // tslint:disable-next-line:no-any\n ComponentBase.prototype.componentDidMount = function () {\n this.refreshChild(true);\n this.canDelayUpdate = delayUpdate.indexOf(this.getModuleName()) !== -1;\n // Used timeout to resolve template binding\n // Reference link: https://github.com/facebook/react/issues/10309#issuecomment-318433235\n // tslint:disable-next-line:no-any\n this.renderReactComponent();\n if (this.portals && this.portals.length) {\n this.mountingState = true;\n this.renderReactTemplates();\n this.mountingState = false;\n }\n };\n ComponentBase.prototype.componentDidUpdate = function (prev) {\n if (!this.isshouldComponentUpdateCalled && this.initRenderCalled && !this.isReactForeceUpdate) {\n if (prev !== this.props) {\n this.isshouldComponentUpdateCalled = true;\n this.updateProperties(this.props, false, prev);\n }\n }\n };\n ComponentBase.prototype.renderReactComponent = function () {\n var ele = this.reactElement;\n if (ele && !this.isAppendCalled) {\n this.isAppendCalled = true;\n this.appendTo(ele);\n }\n };\n // Lifecycle methods are changed by React team and so we can deprecate this method and use\n // Reference link:https://reactjs.org/docs/react-component.html#unsafe_componentwillreceiveprops\n // tslint:disable-next-line:no-any\n /**\n * @param {Object} nextProps - Specifies the property value.\n * @returns {boolean} - Returns boolean value.\n * @private\n */\n ComponentBase.prototype.shouldComponentUpdate = function (nextProps) {\n this.isshouldComponentUpdateCalled = true;\n if (!this.initRenderCalled) {\n this.updateProperties(nextProps, true);\n return true;\n }\n if (!this.isAppendCalled) {\n clearTimeout(this.cachedTimeOut);\n this.isAppendCalled = true;\n this.appendTo(this.reactElement);\n }\n this.updateProperties(nextProps);\n return true;\n };\n ComponentBase.prototype.updateProperties = function (nextProps, silent, prev) {\n var _this = this;\n var dProps = extend({}, nextProps);\n var keys = Object.keys(nextProps);\n var prevProps = extend({}, prev || this.props);\n // The statelessTemplates props value is taken from sample level property or default component property.\n var statelessTemplates = !isNullOrUndefined(prevProps['statelessTemplates']) ? prevProps['statelessTemplates'] :\n (!isNullOrUndefined(this['statelessTemplateProps']) ? this['statelessTemplateProps'] : []);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var propkey = keys_1[_i];\n var isClassName = propkey === 'className';\n if (propkey === 'children') {\n continue;\n }\n if (!isClassName && !isNullOrUndefined(this.htmlattributes[\"\" + propkey]) &&\n this.htmlattributes[\"\" + propkey] !== dProps[\"\" + propkey]) {\n this.htmlattributes[\"\" + propkey] = dProps[\"\" + propkey];\n }\n if (this.compareValues(prevProps[\"\" + propkey], nextProps[\"\" + propkey])) {\n delete dProps[\"\" + propkey];\n }\n else if (this.attrKeys.indexOf(propkey) !== -1) {\n if (isClassName) {\n this.clsName = true;\n var propsClsName = prevProps[\"\" + propkey].split(' ');\n for (var i = 0; i < propsClsName.length; i++) {\n this.element.classList.remove(propsClsName[parseInt(i.toString(), 10)]);\n }\n var dpropsClsName = dProps[\"\" + propkey].split(' ');\n for (var j = 0; j < dpropsClsName.length; j++) {\n this.element.classList.add(dpropsClsName[parseInt(j.toString(), 10)]);\n }\n }\n else if (propkey !== 'disabled' && !Object.prototype.hasOwnProperty.call(this.properties, propkey)) {\n delete dProps[\"\" + propkey];\n }\n }\n else if (propkey === 'value' && nextProps[\"\" + propkey] === this[\"\" + propkey]) {\n delete dProps[\"\" + propkey];\n }\n else if (statelessTemplates.indexOf(propkey) > -1 && ((propkey === 'content' && typeof dProps[\"\" + propkey] === 'function') || (nextProps[\"\" + propkey].toString() === this[\"\" + propkey].toString()))) {\n delete dProps[\"\" + propkey];\n }\n }\n if (dProps['children']) {\n delete dProps['children'];\n }\n // tslint:disable-next-line:no-any\n if (this.initRenderCalled && (this.canDelayUpdate || prevProps.delayUpdate)) {\n setTimeout(function () {\n _this.refreshProperties(dProps, nextProps, silent);\n });\n }\n else {\n this.refreshProperties(dProps, nextProps, silent);\n }\n };\n ComponentBase.prototype.refreshProperties = function (dProps, nextProps, silent) {\n var statelessTemplates = !isNullOrUndefined(this.props['statelessTemplates']) ? this.props['statelessTemplates'] : [];\n if (Object.keys(dProps).length) {\n if (!silent) {\n // tslint:disable-next-line:no-any\n this.processComplexTemplate(dProps, this);\n }\n this.setProperties(dProps, silent);\n }\n if (statelessTemplates.indexOf('directiveTemplates') === -1) {\n this.refreshChild(silent, nextProps);\n }\n };\n ComponentBase.prototype.processComplexTemplate = function (curObject, context) {\n var compTemplate = context.complexTemplate;\n if (compTemplate) {\n // eslint-disable-next-line\n for (var prop in compTemplate) {\n var PropVal = compTemplate[\"\" + prop];\n if (curObject[\"\" + prop]) {\n setValue(PropVal, getValue(prop, curObject), curObject);\n }\n }\n }\n };\n ComponentBase.prototype.getDefaultAttributes = function () {\n var _this = this;\n this.isReact = true;\n var propKeys = Object.keys(this.props);\n //let stringValue: string[] = ['autocomplete', 'dropdownlist', 'combobox'];\n var ignoreProps = ['children', 'statelessTemplates', 'immediateRender', 'isLegacyTemplate', 'delayUpdate'];\n // if ((stringValue.indexOf(this.getModuleName()) !== -1) && (!isNullOrUndefined(this.props[\"value\"]))) {\n // this.value = (<{ [key: string]: Object }>this.props)[\"value\"];\n // }\n if (!this.htmlattributes) {\n this.htmlattributes = {};\n }\n this.attrKeys = defaulthtmlkeys.concat(this.controlAttributes || []);\n for (var _i = 0, propKeys_1 = propKeys; _i < propKeys_1.length; _i++) {\n var prop = propKeys_1[_i];\n if (prop.indexOf('data-') !== -1 || prop.indexOf('aria-') !== -1 || this.attrKeys.indexOf(prop) !== -1 || (Object.keys(this.properties).indexOf(\"\" + prop) === -1 && ignoreProps.indexOf(\"\" + prop) === -1)) {\n if (this.htmlattributes[\"\" + prop] !== this.props[\"\" + prop]) {\n this.htmlattributes[\"\" + prop] = this.props[\"\" + prop];\n }\n }\n }\n if (!this.htmlattributes.ref) {\n /* tslint:disable:no-any */\n this.htmlattributes.ref = function (ele) {\n _this.reactElement = ele;\n };\n var keycompoentns = ['autocomplete', 'combobox', 'dropdownlist', 'dropdowntree', 'multiselect',\n 'listbox', 'colorpicker', 'numerictextbox', 'textbox',\n 'uploader', 'maskedtextbox', 'slider', 'datepicker', 'datetimepicker', 'daterangepicker', 'timepicker', 'checkbox', 'switch', 'radio', 'rating', 'textarea'];\n if (keycompoentns.indexOf(this.getModuleName()) !== -1) {\n this.htmlattributes.key = '' + ComponentBase.reactUid;\n ComponentBase.reactUid++;\n if (this.type && !this.htmlattributes['type']) {\n this.htmlattributes['type'] = this.multiline ? 'hidden' : this.type;\n }\n if (this.name && !this.htmlattributes['name']) {\n this.htmlattributes['name'] = this.name;\n }\n }\n }\n if (this.clsName) {\n var clsList = this.element.classList;\n var className = this.htmlattributes['className'];\n for (var i = 0; i < clsList.length; i++) {\n if ((className.indexOf(clsList[parseInt(i.toString(), 10)]) === -1)) {\n this.htmlattributes['className'] = this.htmlattributes['className'] + ' ' + clsList[parseInt(i.toString(), 10)];\n }\n }\n }\n return this.htmlattributes;\n };\n /* tslint:disable:no-any */\n // eslint-disable-next-line\n ComponentBase.prototype.trigger = function (eventName, eventProp, successHandler) {\n var _this = this;\n if (this.isDestroyed !== true && this.modelObserver) {\n if (isColEName.test(eventName)) {\n var handler = getValue(eventName, this);\n if (handler) {\n handler.call(this, eventProp);\n if (successHandler) {\n successHandler.call(this, eventProp);\n }\n }\n else if (successHandler) {\n successHandler.call(this, eventProp);\n }\n }\n if ((eventName === 'change' || eventName === 'input')) {\n if (this.props.onChange && eventProp.event) {\n this.props.onChange.call(undefined, {\n syntheticEvent: eventProp.event,\n nativeEvent: { text: eventProp.value },\n value: eventProp.value,\n target: this\n });\n }\n }\n var prevDetection = this.isProtectedOnChange;\n this.isProtectedOnChange = false;\n if (eventName === 'created') {\n setTimeout(function () {\n _this.isCreated = true;\n if (!_this.isDestroyed) {\n _this.modelObserver.notify(eventName, eventProp, successHandler);\n }\n }, 10);\n }\n else {\n this.modelObserver.notify(eventName, eventProp, successHandler);\n }\n this.isProtectedOnChange = prevDetection;\n }\n };\n ComponentBase.prototype.compareValues = function (value1, value2) {\n var typeVal = typeof value1;\n var typeVal2 = typeof value2;\n if (typeVal === typeVal2) {\n if (value1 === value2) {\n return true;\n }\n if ((!isNullOrUndefined(value1) && value1.constructor) !== (!isNullOrUndefined(value2) && value2.constructor)) {\n return false;\n }\n if (value1 instanceof Date ||\n value1 instanceof RegExp ||\n value1 instanceof String ||\n value1 instanceof Number) {\n return value1.toString() === value2.toString();\n }\n if (isObject(value1) || Array.isArray(value1)) {\n var tempVal = value1;\n var tempVal2 = value2;\n if (isObject(tempVal)) {\n tempVal = [value1];\n tempVal2 = [value2];\n }\n return this.compareObjects(tempVal, tempVal2).status;\n }\n if (value1.constructor &&\n value1.constructor.name === value2.constructor.name &&\n (value1.constructor.name === 'Query' ||\n value1.constructor.name === 'DataManager')) {\n if (JSON.stringify(value1) === JSON.stringify(value2)) {\n return true;\n }\n }\n }\n return false;\n };\n // eslint-disable-next-line\n ComponentBase.prototype.compareObjects = function (oldProps, newProps, propName) {\n var status = true;\n var lenSimilarity = (oldProps.length === newProps.length);\n var diffArray = [];\n var templateProps = !isNullOrUndefined(this['templateProps']) ? this['templateProps'] : [];\n if (lenSimilarity) {\n for (var i = 0, len = newProps.length; i < len; i++) {\n var curObj = {};\n var oldProp = oldProps[parseInt(i.toString(), 10)];\n var newProp = newProps[parseInt(i.toString(), 10)];\n var keys = Object.keys(newProp);\n if (keys.length !== 0) {\n for (var _i = 0, keys_2 = keys; _i < keys_2.length; _i++) {\n var key = keys_2[_i];\n var oldValue = oldProp[\"\" + key];\n var newValue = newProp[\"\" + key];\n if (key === 'items') {\n for (var _j = 0; _j < newValue.length; _j++) {\n if (this.getModuleName() === 'richtexteditor' && typeof (newValue[parseInt(_j.toString(), 10)]) === 'object') {\n return { status: true };\n }\n }\n }\n if (this.getModuleName() === 'grid' && key === 'field') {\n curObj[\"\" + key] = newValue;\n }\n if (!Object.prototype.hasOwnProperty.call(oldProp, key) || !((templateProps.length > 0 && templateProps.indexOf(\"\" + key) === -1 && typeof (newValue) === 'function') ? this.compareValues(oldValue.toString(), newValue.toString()) : this.compareValues(oldValue, newValue))) {\n if (!propName) {\n return { status: false };\n }\n status = false;\n curObj[\"\" + key] = newValue;\n }\n }\n }\n else if (newProps[parseInt(i.toString(), 10)] === oldProps[parseInt(i.toString(), 10)]) {\n status = true;\n }\n else {\n if (!propName) {\n return { status: false };\n }\n status = false;\n }\n if (this.getModuleName() === 'grid' && propName === 'columns' && isNullOrUndefined(curObj['field'])) {\n curObj['field'] = undefined;\n }\n if (Object.keys(curObj).length) {\n diffArray.push({ index: i, value: curObj, key: propName });\n }\n }\n }\n else {\n status = false;\n }\n return { status: status, changedProperties: diffArray };\n };\n ComponentBase.prototype.refreshChild = function (silent, props) {\n if (this.checkInjectedModules) {\n var prevModule = this.getInjectedModules() || [];\n var curModule = this.getInjectedServices() || [];\n for (var _i = 0, curModule_1 = curModule; _i < curModule_1.length; _i++) {\n var mod = curModule_1[_i];\n if (prevModule.indexOf(mod) === -1) {\n prevModule.push(mod);\n }\n }\n this.injectedModules = prevModule;\n }\n if (this.directivekeys) {\n var changedProps = [];\n var key = '';\n var directiveValue = this.validateChildren({}, this.directivekeys, (props || this.props));\n if (directiveValue && Object.keys(directiveValue).length) {\n if (!silent && this.skipRefresh) {\n for (var _a = 0, _b = this.skipRefresh; _a < _b.length; _a++) {\n var fields = _b[_a];\n delete directiveValue[\"\" + fields];\n }\n }\n if (this.prevProperties) {\n var dKeys = Object.keys(this.prevProperties);\n for (var i = 0; i < dKeys.length; i++) {\n key = dKeys[parseInt(i.toString(), 10)];\n if (!Object.prototype.hasOwnProperty.call(directiveValue, key)) {\n continue;\n }\n var compareOutput = this.compareObjects(this.prevProperties[\"\" + key], directiveValue[\"\" + key], key);\n if (compareOutput.status) {\n delete directiveValue[\"\" + key];\n }\n else {\n if (compareOutput.changedProperties.length) {\n changedProps = changedProps.concat(compareOutput.changedProperties);\n }\n var obj = {};\n obj[\"\" + key] = directiveValue[\"\" + key];\n this.prevProperties = extend(this.prevProperties, obj);\n }\n }\n }\n else {\n this.prevProperties = extend({}, directiveValue, {}, true);\n }\n if (changedProps.length) {\n if (this.getModuleName() === 'grid' && key === 'columns') {\n for (var _c1 = 0, allColumns = this.columns; _c1 < allColumns.length; _c1++) {\n var compareField1 = getValue('field', allColumns[parseInt(_c1.toString(), 10)]);\n var compareField2 = getValue(_c1 + '.value.field', changedProps);\n if (compareField1 === compareField2) {\n var propInstance = getValue(changedProps[parseInt(_c1.toString(), 10)].key + '.' + changedProps[parseInt(_c1.toString(), 10)].index, this);\n if (propInstance && propInstance.setProperties) {\n propInstance.setProperties(changedProps[parseInt(_c1.toString(), 10)].value);\n }\n else {\n extend(propInstance, changedProps[parseInt(_c1.toString(), 10)].value);\n }\n }\n else {\n this.setProperties(directiveValue, silent);\n }\n }\n }\n else {\n for (var _c = 0, changedProps_1 = changedProps; _c < changedProps_1.length; _c++) {\n var changes = changedProps_1[_c];\n var propInstance = getValue(changes.key + '.' + changes.index, this);\n if (propInstance && propInstance.setProperties) {\n propInstance.setProperties(changes.value);\n }\n else {\n extend(propInstance, changes.value);\n }\n }\n }\n }\n else {\n this.setProperties(directiveValue, silent);\n }\n }\n }\n };\n ComponentBase.prototype.componentWillUnmount = function () {\n clearTimeout(this.cachedTimeOut);\n var modulesName = ['dropdowntree', 'checkbox'];\n var hasModule = ((!modulesName.indexOf(this.getModuleName())) ? document.body.contains(this.element) : true);\n // tslint:disable-next-line:no-any\n if (this.initRenderCalled && this.isAppendCalled && this.element && hasModule && !this.isDestroyed && this.isCreated) {\n this.destroy();\n }\n onIntlChange.offIntlEvents();\n };\n // tslint:disable:no-any\n // eslint-disable-next-line\n ComponentBase.prototype.appendReactElement = function (element, container) {\n var portal = ReactDOM.createPortal(element, container);\n if (!this.portals) {\n this.portals = [portal];\n }\n else {\n this.portals.push(portal);\n }\n };\n // tslint:disable:no-any\n // eslint-disable-next-line\n ComponentBase.prototype.renderReactTemplates = function (callback) {\n this.isReactForeceUpdate = true;\n if (callback) {\n this.forceUpdate(callback);\n }\n else {\n this.forceUpdate();\n }\n this.isReactForeceUpdate = false;\n };\n // tslint:disable:no-any\n // eslint-disable-next-line\n ComponentBase.prototype.clearTemplate = function (templateNames, index, callback) {\n var _this = this;\n var tempPortal = [];\n if (templateNames && templateNames.length) {\n Array.prototype.forEach.call(templateNames, function (propName) {\n var propIndexCount = 0;\n _this.portals.forEach(function (portal) {\n if (portal.propName === propName) {\n tempPortal.push(propIndexCount);\n propIndexCount++;\n }\n });\n if (!isNullOrUndefined(index) && _this.portals[index] && _this.portals[index].propName === propName) {\n _this.portals.splice(index, 1);\n }\n else {\n for (var i = 0; i < _this.portals.length; i++) {\n if (_this.portals[parseInt(i.toString(), 10)].propName === propName) {\n _this.portals.splice(i, 1);\n i--;\n }\n }\n }\n });\n }\n else {\n this.portals = [];\n }\n this.renderReactTemplates(callback);\n };\n /* tslint:disable:no-any */\n ComponentBase.prototype.validateChildren = function (childCache, mapper, props) {\n var flag = false;\n var childs = React.Children.toArray(props.children);\n for (var _i = 0, childs_1 = childs; _i < childs_1.length; _i++) {\n var child = childs_1[_i];\n var ifield = this.getChildType(child);\n var key = mapper[\"\" + ifield];\n if (ifield && mapper) {\n // tslint:disable\n var childProps = this.getChildProps(React.Children.toArray(child.props.children), key);\n if (childProps.length) {\n flag = true;\n // tslint:disable\n childCache[child.type.propertyName || ifield] = childProps;\n }\n }\n }\n if (flag) {\n return childCache;\n }\n return null;\n };\n // tslint:disable:no-any\n ComponentBase.prototype.getChildType = function (child) {\n if (child.type && child.type.isDirective) {\n return child.type.moduleName || '';\n }\n return '';\n };\n ComponentBase.prototype.getChildProps = function (subChild, matcher) {\n var ret = [];\n for (var _i = 0, subChild_1 = subChild; _i < subChild_1.length; _i++) {\n var child = subChild_1[_i];\n var accessProp = false;\n var key = void 0;\n if (typeof matcher === 'string') {\n accessProp = true;\n key = matcher;\n }\n else {\n key = Object.keys(matcher)[0];\n }\n var prop = child.props;\n // tslint:disable-next-line:no-any\n var field = this.getChildType(child);\n if (field === key) {\n if (accessProp || !prop.children) {\n // tslint:disable\n var cacheVal = extend({}, prop, {}, true);\n // tslint:disable\n this.processComplexTemplate(cacheVal, child.type);\n ret.push(cacheVal);\n }\n else {\n var cachedValue = this.validateChildren(extend({}, prop), matcher[\"\" + key], prop) || prop;\n if (cachedValue['children']) {\n delete cachedValue['children'];\n }\n // tslint:disable\n this.processComplexTemplate(cachedValue, child.type);\n ret.push(cachedValue);\n }\n }\n }\n return ret;\n };\n // tslint:disable:no-any\n ComponentBase.prototype.getInjectedServices = function () {\n var childs = React.Children.toArray(this.props.children);\n for (var _i = 0, childs_2 = childs; _i < childs_2.length; _i++) {\n var child = childs_2[_i];\n /* tslint:disable:no-any */\n if (child.type && child.type.isService) {\n return child.props.services;\n }\n }\n return [];\n };\n /**\n * @private\n */\n ComponentBase.reactUid = 1;\n return ComponentBase;\n}(React.Component));\nexport { ComponentBase };\n/* tslint:enable:no-any */\n","// eslint-disable-next-line\nexport function applyMixins(derivedClass, baseClass) {\n // tslint:disable:typedef\n baseClass.forEach(function (baseClass) {\n Object.getOwnPropertyNames(baseClass.prototype).forEach(function (name) {\n if (name !== 'isMounted' && name !== 'replaceState' && name !== 'render') {\n derivedClass.prototype[\"\" + name] = baseClass.prototype[\"\" + name];\n }\n });\n });\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\n/**\n * Directory base\n */\nvar ComplexBase = /** @class */ (function (_super) {\n __extends(ComplexBase, _super);\n function ComplexBase() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n ComplexBase.prototype.render = function () {\n return null;\n };\n ComplexBase.isDirective = true;\n return ComplexBase;\n}(React.PureComponent));\nexport { ComplexBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\n/**\n * Dependency injection\n */\nimport * as React from 'react';\nvar Inject = /** @class */ (function (_super) {\n __extends(Inject, _super);\n function Inject() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n // eslint-disable-next-line\n Inject.prototype.render = function () {\n return null;\n };\n Inject.isService = true;\n return Inject;\n}(React.PureComponent));\nexport { Inject };\n","/**\n * Template compiler for react\n */\nimport { setTemplateEngine, getTemplateEngine, extend } from '@syncfusion/ej2-base';\nimport * as ReactDOM from 'react-dom';\nimport * as React from 'react';\n/* eslint-disable @typescript-eslint/no-explicit-any */\nvar stringCompiler = getTemplateEngine();\n// eslint-disable-next-line\nexport function compile(templateElement, helper) {\n if (typeof templateElement === 'string' || (templateElement.prototype && templateElement.prototype.CSPTemplate && typeof templateElement === 'function')) {\n return stringCompiler(templateElement, helper);\n }\n else {\n return function (data, component, prop, element) {\n var actTemplate = templateElement;\n var actData = data;\n if (typeof actTemplate === 'object') {\n actTemplate = templateElement.template;\n actData = extend({}, data, templateElement.data || {});\n }\n var cEle;\n if (element) {\n cEle = element;\n }\n else {\n cEle = document.createElement('div');\n }\n var rele = React.createElement(actTemplate, actData);\n var portal = ReactDOM.createPortal(rele, cEle);\n portal.propName = prop;\n if (!component.portals) {\n component.portals = [portal];\n }\n else {\n component.portals.push(portal);\n }\n if (!element) {\n return [cEle];\n }\n };\n }\n}\nsetTemplateEngine({ compile: compile });\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Touch, Component, EventHandler, selectAll, getUniqueID } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, Property, Browser, detach } from '@syncfusion/ej2-base';\nimport { classList, isNullOrUndefined } from '@syncfusion/ej2-base';\nvar CLS_ROOT = 'e-hscroll';\nvar CLS_RTL = 'e-rtl';\nvar CLS_DISABLE = 'e-overlay';\nvar CLS_HSCROLLBAR = 'e-hscroll-bar';\nvar CLS_HSCROLLCON = 'e-hscroll-content';\nvar CLS_NAVARROW = 'e-nav-arrow';\nvar CLS_NAVRIGHTARROW = 'e-nav-right-arrow';\nvar CLS_NAVLEFTARROW = 'e-nav-left-arrow';\nvar CLS_HSCROLLNAV = 'e-scroll-nav';\nvar CLS_HSCROLLNAVRIGHT = 'e-scroll-right-nav';\nvar CLS_HSCROLLNAVLEFT = 'e-scroll-left-nav';\nvar CLS_DEVICE = 'e-scroll-device';\nvar CLS_OVERLAY = 'e-scroll-overlay';\nvar CLS_RIGHTOVERLAY = 'e-scroll-right-overlay';\nvar CLS_LEFTOVERLAY = 'e-scroll-left-overlay';\nvar OVERLAY_MAXWID = 40;\n/**\n * HScroll module is introduces horizontal scroller when content exceeds the current viewing area.\n * It can be useful for the components like Toolbar, Tab which needs horizontal scrolling alone.\n * Hidden content can be view by touch moving or icon click.\n * ```html\n *
\n * \n * ```\n */\nvar HScroll = /** @class */ (function (_super) {\n __extends(HScroll, _super);\n /**\n * Initializes a new instance of the HScroll class.\n *\n * @param {HScrollModel} options - Specifies HScroll model properties as options.\n * @param {string | HTMLElement} element - Specifies the element for which horizontal scrolling applies.\n */\n function HScroll(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Initialize the event handler\n *\n * @private\n * @returns {void}\n */\n HScroll.prototype.preRender = function () {\n this.browser = Browser.info.name;\n this.browserCheck = this.browser === 'mozilla';\n this.isDevice = Browser.isDevice;\n this.customStep = true;\n var element = this.element;\n this.ieCheck = this.browser === 'edge' || this.browser === 'msie';\n this.initialize();\n if (element.id === '') {\n element.id = getUniqueID('hscroll');\n this.uniqueId = true;\n }\n element.style.display = 'block';\n if (this.enableRtl) {\n element.classList.add(CLS_RTL);\n }\n };\n /**\n * To Initialize the horizontal scroll rendering\n *\n * @private\n * @returns {void}\n */\n HScroll.prototype.render = function () {\n this.touchModule = new Touch(this.element, { scroll: this.touchHandler.bind(this), swipe: this.swipeHandler.bind(this) });\n EventHandler.add(this.scrollEle, 'scroll', this.scrollHandler, this);\n if (!this.isDevice) {\n this.createNavIcon(this.element);\n }\n else {\n this.element.classList.add(CLS_DEVICE);\n this.createOverlay(this.element);\n }\n this.setScrollState();\n };\n HScroll.prototype.setScrollState = function () {\n if (isNullOrUndefined(this.scrollStep) || this.scrollStep < 0) {\n this.scrollStep = this.scrollEle.offsetWidth;\n this.customStep = false;\n }\n else {\n this.customStep = true;\n }\n };\n HScroll.prototype.initialize = function () {\n var scrollEle = this.createElement('div', { className: CLS_HSCROLLCON });\n var scrollDiv = this.createElement('div', { className: CLS_HSCROLLBAR });\n scrollDiv.setAttribute('tabindex', '-1');\n var ele = this.element;\n var innerEle = [].slice.call(ele.children);\n for (var _i = 0, innerEle_1 = innerEle; _i < innerEle_1.length; _i++) {\n var ele_1 = innerEle_1[_i];\n scrollEle.appendChild(ele_1);\n }\n scrollDiv.appendChild(scrollEle);\n ele.appendChild(scrollDiv);\n scrollDiv.style.overflowX = 'hidden';\n this.scrollEle = scrollDiv;\n this.scrollItems = scrollEle;\n };\n HScroll.prototype.getPersistData = function () {\n var keyEntity = ['scrollStep'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Returns the current module name.\n *\n * @returns {string} - It returns the current module name.\n * @private\n */\n HScroll.prototype.getModuleName = function () {\n return 'hScroll';\n };\n /**\n * Removes the control from the DOM and also removes all its related events.\n *\n * @returns {void}\n */\n HScroll.prototype.destroy = function () {\n var ele = this.element;\n ele.style.display = '';\n ele.classList.remove(CLS_ROOT);\n ele.classList.remove(CLS_DEVICE);\n ele.classList.remove(CLS_RTL);\n var nav = selectAll('.e-' + ele.id + '_nav.' + CLS_HSCROLLNAV, ele);\n var overlay = selectAll('.' + CLS_OVERLAY, ele);\n [].slice.call(overlay).forEach(function (ele) {\n detach(ele);\n });\n for (var _i = 0, _a = [].slice.call(this.scrollItems.children); _i < _a.length; _i++) {\n var elem = _a[_i];\n ele.appendChild(elem);\n }\n if (this.uniqueId) {\n this.element.removeAttribute('id');\n }\n detach(this.scrollEle);\n if (nav.length > 0) {\n detach(nav[0]);\n if (!isNullOrUndefined(nav[1])) {\n detach(nav[1]);\n }\n }\n EventHandler.remove(this.scrollEle, 'scroll', this.scrollHandler);\n this.touchModule.destroy();\n this.touchModule = null;\n _super.prototype.destroy.call(this);\n };\n /**\n * Specifies the value to disable/enable the HScroll component.\n * When set to `true` , the component will be disabled.\n *\n * @param {boolean} value - Based on this Boolean value, HScroll will be enabled (false) or disabled (true).\n * @returns {void}.\n */\n HScroll.prototype.disable = function (value) {\n var navEles = selectAll('.e-scroll-nav:not(.' + CLS_DISABLE + ')', this.element);\n if (value) {\n this.element.classList.add(CLS_DISABLE);\n }\n else {\n this.element.classList.remove(CLS_DISABLE);\n }\n [].slice.call(navEles).forEach(function (el) {\n el.setAttribute('tabindex', !value ? '0' : '-1');\n });\n };\n HScroll.prototype.createOverlay = function (element) {\n var id = element.id.concat('_nav');\n var rightOverlayEle = this.createElement('div', { className: CLS_OVERLAY + ' ' + CLS_RIGHTOVERLAY });\n var clsRight = 'e-' + element.id.concat('_nav ' + CLS_HSCROLLNAV + ' ' + CLS_HSCROLLNAVRIGHT);\n var rightEle = this.createElement('div', { id: id.concat('_right'), className: clsRight });\n var navItem = this.createElement('div', { className: CLS_NAVRIGHTARROW + ' ' + CLS_NAVARROW + ' e-icons' });\n rightEle.appendChild(navItem);\n var leftEle = this.createElement('div', { className: CLS_OVERLAY + ' ' + CLS_LEFTOVERLAY });\n if (this.ieCheck) {\n rightEle.classList.add('e-ie-align');\n }\n element.appendChild(rightOverlayEle);\n element.appendChild(rightEle);\n element.insertBefore(leftEle, element.firstChild);\n this.eventBinding([rightEle]);\n };\n HScroll.prototype.createNavIcon = function (element) {\n var id = element.id.concat('_nav');\n var clsRight = 'e-' + element.id.concat('_nav ' + CLS_HSCROLLNAV + ' ' + CLS_HSCROLLNAVRIGHT);\n var rightAttributes = { 'role': 'button', 'id': id.concat('_right'), 'aria-label': 'Scroll right' };\n var nav = this.createElement('div', { className: clsRight, attrs: rightAttributes });\n nav.setAttribute('aria-disabled', 'false');\n var navItem = this.createElement('div', { className: CLS_NAVRIGHTARROW + ' ' + CLS_NAVARROW + ' e-icons' });\n var clsLeft = 'e-' + element.id.concat('_nav ' + CLS_HSCROLLNAV + ' ' + CLS_HSCROLLNAVLEFT);\n var leftAttributes = { 'role': 'button', 'id': id.concat('_left'), 'aria-label': 'Scroll left' };\n var navEle = this.createElement('div', { className: clsLeft + ' ' + CLS_DISABLE, attrs: leftAttributes });\n navEle.setAttribute('aria-disabled', 'true');\n var navLeftItem = this.createElement('div', { className: CLS_NAVLEFTARROW + ' ' + CLS_NAVARROW + ' e-icons' });\n navEle.appendChild(navLeftItem);\n nav.appendChild(navItem);\n element.appendChild(nav);\n element.insertBefore(navEle, element.firstChild);\n if (this.ieCheck) {\n nav.classList.add('e-ie-align');\n navEle.classList.add('e-ie-align');\n }\n this.eventBinding([nav, navEle]);\n };\n HScroll.prototype.onKeyPress = function (e) {\n var _this = this;\n if (e.key === 'Enter') {\n var timeoutFun_1 = function () {\n _this.keyTimeout = true;\n _this.eleScrolling(10, e.target, true);\n };\n this.keyTimer = window.setTimeout(function () {\n timeoutFun_1();\n }, 100);\n }\n };\n HScroll.prototype.onKeyUp = function (e) {\n if (e.key !== 'Enter') {\n return;\n }\n if (this.keyTimeout) {\n this.keyTimeout = false;\n }\n else {\n e.target.click();\n }\n clearTimeout(this.keyTimer);\n };\n HScroll.prototype.eventBinding = function (ele) {\n var _this = this;\n [].slice.call(ele).forEach(function (el) {\n new Touch(el, { tapHold: _this.tabHoldHandler.bind(_this), tapHoldThreshold: 500 });\n el.addEventListener('keydown', _this.onKeyPress.bind(_this));\n el.addEventListener('keyup', _this.onKeyUp.bind(_this));\n el.addEventListener('mouseup', _this.repeatScroll.bind(_this));\n el.addEventListener('touchend', _this.repeatScroll.bind(_this));\n el.addEventListener('contextmenu', function (e) {\n e.preventDefault();\n });\n EventHandler.add(el, 'click', _this.clickEventHandler, _this);\n });\n };\n HScroll.prototype.repeatScroll = function () {\n clearInterval(this.timeout);\n };\n HScroll.prototype.tabHoldHandler = function (e) {\n var _this = this;\n var trgt = e.originalEvent.target;\n trgt = this.contains(trgt, CLS_HSCROLLNAV) ? trgt.firstElementChild : trgt;\n var scrollDis = 10;\n var timeoutFun = function () {\n _this.eleScrolling(scrollDis, trgt, true);\n };\n this.timeout = window.setInterval(function () {\n timeoutFun();\n }, 50);\n };\n HScroll.prototype.contains = function (ele, className) {\n return ele.classList.contains(className);\n };\n HScroll.prototype.eleScrolling = function (scrollDis, trgt, isContinuous) {\n var rootEle = this.element;\n var classList = trgt.classList;\n if (classList.contains(CLS_HSCROLLNAV)) {\n classList = trgt.querySelector('.' + CLS_NAVARROW).classList;\n }\n if (this.contains(rootEle, CLS_RTL) && this.browserCheck) {\n scrollDis = -scrollDis;\n }\n if ((!this.contains(rootEle, CLS_RTL) || this.browserCheck) || this.ieCheck) {\n if (classList.contains(CLS_NAVRIGHTARROW)) {\n this.frameScrollRequest(scrollDis, 'add', isContinuous);\n }\n else {\n this.frameScrollRequest(scrollDis, '', isContinuous);\n }\n }\n else {\n if (classList.contains(CLS_NAVLEFTARROW)) {\n this.frameScrollRequest(scrollDis, 'add', isContinuous);\n }\n else {\n this.frameScrollRequest(scrollDis, '', isContinuous);\n }\n }\n };\n HScroll.prototype.clickEventHandler = function (e) {\n this.eleScrolling(this.scrollStep, e.target, false);\n };\n HScroll.prototype.swipeHandler = function (e) {\n var swipeEle = this.scrollEle;\n var distance;\n if (e.velocity <= 1) {\n distance = e.distanceX / (e.velocity * 10);\n }\n else {\n distance = e.distanceX / e.velocity;\n }\n var start = 0.5;\n var animate = function () {\n var step = Math.sin(start);\n if (step <= 0) {\n window.cancelAnimationFrame(step);\n }\n else {\n if (e.swipeDirection === 'Left') {\n swipeEle.scrollLeft += distance * step;\n }\n else if (e.swipeDirection === 'Right') {\n swipeEle.scrollLeft -= distance * step;\n }\n start -= 0.5;\n window.requestAnimationFrame(animate);\n }\n };\n animate();\n };\n HScroll.prototype.scrollUpdating = function (scrollVal, action) {\n if (action === 'add') {\n this.scrollEle.scrollLeft += scrollVal;\n }\n else {\n this.scrollEle.scrollLeft -= scrollVal;\n }\n if (this.enableRtl && this.scrollEle.scrollLeft > 0) {\n this.scrollEle.scrollLeft = 0;\n }\n };\n HScroll.prototype.frameScrollRequest = function (scrollVal, action, isContinuous) {\n var _this = this;\n var step = 10;\n if (isContinuous) {\n this.scrollUpdating(scrollVal, action);\n return;\n }\n if (!this.customStep) {\n [].slice.call(selectAll('.' + CLS_OVERLAY, this.element)).forEach(function (el) {\n scrollVal -= el.offsetWidth;\n });\n }\n var animate = function () {\n var scrollValue;\n var scrollStep;\n if (_this.contains(_this.element, CLS_RTL) && _this.browserCheck) {\n scrollValue = -scrollVal;\n scrollStep = -step;\n }\n else {\n scrollValue = scrollVal;\n scrollStep = step;\n }\n if (scrollValue < step) {\n window.cancelAnimationFrame(scrollStep);\n }\n else {\n _this.scrollUpdating(scrollStep, action);\n scrollVal -= scrollStep;\n window.requestAnimationFrame(animate);\n }\n };\n animate();\n };\n HScroll.prototype.touchHandler = function (e) {\n var ele = this.scrollEle;\n var distance = e.distanceX;\n if ((this.ieCheck) && this.contains(this.element, CLS_RTL)) {\n distance = -distance;\n }\n if (e.scrollDirection === 'Left') {\n ele.scrollLeft = ele.scrollLeft + distance;\n }\n else if (e.scrollDirection === 'Right') {\n ele.scrollLeft = ele.scrollLeft - distance;\n }\n };\n HScroll.prototype.arrowDisabling = function (addDisable, removeDisable) {\n if (this.isDevice) {\n var arrowEle = isNullOrUndefined(addDisable) ? removeDisable : addDisable;\n var arrowIcon = arrowEle.querySelector('.' + CLS_NAVARROW);\n if (isNullOrUndefined(addDisable)) {\n classList(arrowIcon, [CLS_NAVRIGHTARROW], [CLS_NAVLEFTARROW]);\n }\n else {\n classList(arrowIcon, [CLS_NAVLEFTARROW], [CLS_NAVRIGHTARROW]);\n }\n }\n else if (addDisable && removeDisable) {\n addDisable.classList.add(CLS_DISABLE);\n addDisable.setAttribute('aria-disabled', 'true');\n addDisable.removeAttribute('tabindex');\n removeDisable.classList.remove(CLS_DISABLE);\n removeDisable.setAttribute('aria-disabled', 'false');\n removeDisable.setAttribute('tabindex', '0');\n }\n this.repeatScroll();\n };\n HScroll.prototype.scrollHandler = function (e) {\n var target = e.target;\n var width = target.offsetWidth;\n var rootEle = this.element;\n var navLeftEle = this.element.querySelector('.' + CLS_HSCROLLNAVLEFT);\n var navRightEle = this.element.querySelector('.' + CLS_HSCROLLNAVRIGHT);\n var leftOverlay = this.element.querySelector('.' + CLS_LEFTOVERLAY);\n var rightOverlay = this.element.querySelector('.' + CLS_RIGHTOVERLAY);\n var scrollLeft = target.scrollLeft;\n if (scrollLeft <= 0) {\n scrollLeft = -scrollLeft;\n }\n if (this.isDevice) {\n if (this.enableRtl && !(this.browserCheck || this.ieCheck)) {\n leftOverlay = this.element.querySelector('.' + CLS_RIGHTOVERLAY);\n rightOverlay = this.element.querySelector('.' + CLS_LEFTOVERLAY);\n }\n if (scrollLeft < OVERLAY_MAXWID) {\n leftOverlay.style.width = scrollLeft + 'px';\n }\n else {\n leftOverlay.style.width = '40px';\n }\n if ((target.scrollWidth - Math.ceil(width + scrollLeft)) < OVERLAY_MAXWID) {\n rightOverlay.style.width = (target.scrollWidth - Math.ceil(width + scrollLeft)) + 'px';\n }\n else {\n rightOverlay.style.width = '40px';\n }\n }\n if (scrollLeft === 0) {\n this.arrowDisabling(navLeftEle, navRightEle);\n }\n else if (Math.ceil(width + scrollLeft + .1) >= target.scrollWidth) {\n this.arrowDisabling(navRightEle, navLeftEle);\n }\n else {\n var disEle = this.element.querySelector('.' + CLS_HSCROLLNAV + '.' + CLS_DISABLE);\n if (disEle) {\n disEle.classList.remove(CLS_DISABLE);\n disEle.setAttribute('aria-disabled', 'false');\n disEle.setAttribute('tabindex', '0');\n }\n }\n };\n /**\n * Gets called when the model property changes.The data that describes the old and new values of property that changed.\n *\n * @param {HScrollModel} newProp - It contains the new value of data.\n * @param {HScrollModel} oldProp - It contains the old value of data.\n * @returns {void}\n * @private\n */\n HScroll.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'scrollStep':\n this.setScrollState();\n break;\n case 'enableRtl':\n newProp.enableRtl ? this.element.classList.add(CLS_RTL) : this.element.classList.remove(CLS_RTL);\n break;\n }\n }\n };\n __decorate([\n Property(null)\n ], HScroll.prototype, \"scrollStep\", void 0);\n HScroll = __decorate([\n NotifyPropertyChanges\n ], HScroll);\n return HScroll;\n}(Component));\nexport { HScroll };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Touch, Component, EventHandler, selectAll, getUniqueID, removeClass } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, Property, Browser, detach, createElement as buildTag } from '@syncfusion/ej2-base';\nimport { classList, isNullOrUndefined } from '@syncfusion/ej2-base';\nvar CLS_ROOT = 'e-vscroll';\nvar CLS_RTL = 'e-rtl';\nvar CLS_DISABLE = 'e-overlay';\nvar CLS_VSCROLLBAR = 'e-vscroll-bar';\nvar CLS_VSCROLLCON = 'e-vscroll-content';\nvar CLS_NAVARROW = 'e-nav-arrow';\nvar CLS_NAVUPARROW = 'e-nav-up-arrow';\nvar CLS_NAVDOWNARROW = 'e-nav-down-arrow';\nvar CLS_VSCROLLNAV = 'e-scroll-nav';\nvar CLS_VSCROLLNAVUP = 'e-scroll-up-nav';\nvar CLS_VSCROLLNAVDOWN = 'e-scroll-down-nav';\nvar CLS_DEVICE = 'e-scroll-device';\nvar CLS_OVERLAY = 'e-scroll-overlay';\nvar CLS_UPOVERLAY = 'e-scroll-up-overlay';\nvar CLS_DOWNOVERLAY = 'e-scroll-down-overlay';\nvar OVERLAY_MAXWID = 40;\n/**\n * VScroll module is introduces vertical scroller when content exceeds the current viewing area.\n * It can be useful for the components like Toolbar, Tab which needs vertical scrolling alone.\n * Hidden content can be view by touch moving or icon click.\n * ```html\n *
\n * \n * ```\n */\nvar VScroll = /** @class */ (function (_super) {\n __extends(VScroll, _super);\n /**\n * Initializes a new instance of the VScroll class.\n *\n * @param {VScrollModel} options - Specifies VScroll model properties as options.\n * @param {string | HTMLElement} element - Specifies the element for which vertical scrolling applies.\n */\n function VScroll(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Initialize the event handler\n *\n * @private\n * @returns {void}\n */\n VScroll.prototype.preRender = function () {\n this.browser = Browser.info.name;\n this.browserCheck = this.browser === 'mozilla';\n this.isDevice = Browser.isDevice;\n this.customStep = true;\n var ele = this.element;\n this.ieCheck = this.browser === 'edge' || this.browser === 'msie';\n this.initialize();\n if (ele.id === '') {\n ele.id = getUniqueID('vscroll');\n this.uniqueId = true;\n }\n ele.style.display = 'block';\n if (this.enableRtl) {\n ele.classList.add(CLS_RTL);\n }\n };\n /**\n * To Initialize the vertical scroll rendering\n *\n * @private\n * @returns {void}\n */\n VScroll.prototype.render = function () {\n this.touchModule = new Touch(this.element, { scroll: this.touchHandler.bind(this), swipe: this.swipeHandler.bind(this) });\n EventHandler.add(this.scrollEle, 'scroll', this.scrollEventHandler, this);\n if (!this.isDevice) {\n this.createNavIcon(this.element);\n }\n else {\n this.element.classList.add(CLS_DEVICE);\n this.createOverlayElement(this.element);\n }\n this.setScrollState();\n EventHandler.add(this.element, 'wheel', this.wheelEventHandler, this);\n };\n VScroll.prototype.setScrollState = function () {\n if (isNullOrUndefined(this.scrollStep) || this.scrollStep < 0) {\n this.scrollStep = this.scrollEle.offsetHeight;\n this.customStep = false;\n }\n else {\n this.customStep = true;\n }\n };\n VScroll.prototype.initialize = function () {\n var scrollCnt = buildTag('div', { className: CLS_VSCROLLCON });\n var scrollBar = buildTag('div', { className: CLS_VSCROLLBAR });\n scrollBar.setAttribute('tabindex', '-1');\n var ele = this.element;\n var innerEle = [].slice.call(ele.children);\n for (var _i = 0, innerEle_1 = innerEle; _i < innerEle_1.length; _i++) {\n var ele_1 = innerEle_1[_i];\n scrollCnt.appendChild(ele_1);\n }\n scrollBar.appendChild(scrollCnt);\n ele.appendChild(scrollBar);\n scrollBar.style.overflow = 'hidden';\n this.scrollEle = scrollBar;\n this.scrollItems = scrollCnt;\n };\n VScroll.prototype.getPersistData = function () {\n var keyEntity = ['scrollStep'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Returns the current module name.\n *\n * @returns {string} - It returns the current module name.\n * @private\n */\n VScroll.prototype.getModuleName = function () {\n return 'vScroll';\n };\n /**\n * Removes the control from the DOM and also removes all its related events.\n *\n * @returns {void}\n */\n VScroll.prototype.destroy = function () {\n var el = this.element;\n el.style.display = '';\n removeClass([this.element], [CLS_ROOT, CLS_DEVICE, CLS_RTL]);\n var navs = selectAll('.e-' + el.id + '_nav.' + CLS_VSCROLLNAV, el);\n var overlays = selectAll('.' + CLS_OVERLAY, el);\n [].slice.call(overlays).forEach(function (ele) {\n detach(ele);\n });\n for (var _i = 0, _a = [].slice.call(this.scrollItems.children); _i < _a.length; _i++) {\n var elem = _a[_i];\n el.appendChild(elem);\n }\n if (this.uniqueId) {\n this.element.removeAttribute('id');\n }\n detach(this.scrollEle);\n if (navs.length > 0) {\n detach(navs[0]);\n if (!isNullOrUndefined(navs[1])) {\n detach(navs[1]);\n }\n }\n EventHandler.remove(this.scrollEle, 'scroll', this.scrollEventHandler);\n this.touchModule.destroy();\n this.touchModule = null;\n _super.prototype.destroy.call(this);\n };\n /**\n * Specifies the value to disable/enable the VScroll component.\n * When set to `true` , the component will be disabled.\n *\n * @param {boolean} value - Based on this Boolean value, VScroll will be enabled (false) or disabled (true).\n * @returns {void}.\n */\n VScroll.prototype.disable = function (value) {\n var navEle = selectAll('.e-scroll-nav:not(.' + CLS_DISABLE + ')', this.element);\n if (value) {\n this.element.classList.add(CLS_DISABLE);\n }\n else {\n this.element.classList.remove(CLS_DISABLE);\n }\n [].slice.call(navEle).forEach(function (el) {\n el.setAttribute('tabindex', !value ? '0' : '-1');\n });\n };\n VScroll.prototype.createOverlayElement = function (element) {\n var id = element.id.concat('_nav');\n var downOverlayEle = buildTag('div', { className: CLS_OVERLAY + ' ' + CLS_DOWNOVERLAY });\n var clsDown = 'e-' + element.id.concat('_nav ' + CLS_VSCROLLNAV + ' ' + CLS_VSCROLLNAVDOWN);\n var downEle = buildTag('div', { id: id.concat('down'), className: clsDown });\n var navItem = buildTag('div', { className: CLS_NAVDOWNARROW + ' ' + CLS_NAVARROW + ' e-icons' });\n downEle.appendChild(navItem);\n var upEle = buildTag('div', { className: CLS_OVERLAY + ' ' + CLS_UPOVERLAY });\n if (this.ieCheck) {\n downEle.classList.add('e-ie-align');\n }\n element.appendChild(downOverlayEle);\n element.appendChild(downEle);\n element.insertBefore(upEle, element.firstChild);\n this.eventBinding([downEle]);\n };\n VScroll.prototype.createNavIcon = function (element) {\n var id = element.id.concat('_nav');\n var clsDown = 'e-' + element.id.concat('_nav ' + CLS_VSCROLLNAV + ' ' + CLS_VSCROLLNAVDOWN);\n var nav = buildTag('div', { id: id.concat('_down'), className: clsDown });\n nav.setAttribute('aria-disabled', 'false');\n var navItem = buildTag('div', { className: CLS_NAVDOWNARROW + ' ' + CLS_NAVARROW + ' e-icons' });\n var clsUp = 'e-' + element.id.concat('_nav ' + CLS_VSCROLLNAV + ' ' + CLS_VSCROLLNAVUP);\n var navElement = buildTag('div', { id: id.concat('_up'), className: clsUp + ' ' + CLS_DISABLE });\n navElement.setAttribute('aria-disabled', 'true');\n var navUpItem = buildTag('div', { className: CLS_NAVUPARROW + ' ' + CLS_NAVARROW + ' e-icons' });\n navElement.appendChild(navUpItem);\n nav.appendChild(navItem);\n nav.setAttribute('tabindex', '0');\n element.appendChild(nav);\n element.insertBefore(navElement, element.firstChild);\n if (this.ieCheck) {\n nav.classList.add('e-ie-align');\n navElement.classList.add('e-ie-align');\n }\n this.eventBinding([nav, navElement]);\n };\n VScroll.prototype.onKeyPress = function (ev) {\n var _this = this;\n if (ev.key === 'Enter') {\n var timeoutFun_1 = function () {\n _this.keyTimeout = true;\n _this.eleScrolling(10, ev.target, true);\n };\n this.keyTimer = window.setTimeout(function () {\n timeoutFun_1();\n }, 100);\n }\n };\n VScroll.prototype.onKeyUp = function (ev) {\n if (ev.key !== 'Enter') {\n return;\n }\n if (this.keyTimeout) {\n this.keyTimeout = false;\n }\n else {\n ev.target.click();\n }\n clearTimeout(this.keyTimer);\n };\n VScroll.prototype.eventBinding = function (element) {\n var _this = this;\n [].slice.call(element).forEach(function (ele) {\n new Touch(ele, { tapHold: _this.tabHoldHandler.bind(_this), tapHoldThreshold: 500 });\n ele.addEventListener('keydown', _this.onKeyPress.bind(_this));\n ele.addEventListener('keyup', _this.onKeyUp.bind(_this));\n ele.addEventListener('mouseup', _this.repeatScroll.bind(_this));\n ele.addEventListener('touchend', _this.repeatScroll.bind(_this));\n ele.addEventListener('contextmenu', function (e) {\n e.preventDefault();\n });\n EventHandler.add(ele, 'click', _this.clickEventHandler, _this);\n });\n };\n VScroll.prototype.repeatScroll = function () {\n clearInterval(this.timeout);\n };\n VScroll.prototype.tabHoldHandler = function (ev) {\n var _this = this;\n var trgt = ev.originalEvent.target;\n trgt = this.contains(trgt, CLS_VSCROLLNAV) ? trgt.firstElementChild : trgt;\n var scrollDistance = 10;\n var timeoutFun = function () {\n _this.eleScrolling(scrollDistance, trgt, true);\n };\n this.timeout = window.setInterval(function () {\n timeoutFun();\n }, 50);\n };\n VScroll.prototype.contains = function (element, className) {\n return element.classList.contains(className);\n };\n VScroll.prototype.eleScrolling = function (scrollDis, trgt, isContinuous) {\n var classList = trgt.classList;\n if (classList.contains(CLS_VSCROLLNAV)) {\n classList = trgt.querySelector('.' + CLS_NAVARROW).classList;\n }\n if (classList.contains(CLS_NAVDOWNARROW)) {\n this.frameScrollRequest(scrollDis, 'add', isContinuous);\n }\n else if (classList.contains(CLS_NAVUPARROW)) {\n this.frameScrollRequest(scrollDis, '', isContinuous);\n }\n };\n VScroll.prototype.clickEventHandler = function (event) {\n this.eleScrolling(this.scrollStep, event.target, false);\n };\n VScroll.prototype.wheelEventHandler = function (e) {\n e.preventDefault();\n this.frameScrollRequest(this.scrollStep, (e.deltaY > 0 ? 'add' : ''), false);\n };\n VScroll.prototype.swipeHandler = function (e) {\n var swipeElement = this.scrollEle;\n var distance;\n if (e.velocity <= 1) {\n distance = e.distanceY / (e.velocity * 10);\n }\n else {\n distance = e.distanceY / e.velocity;\n }\n var start = 0.5;\n var animate = function () {\n var step = Math.sin(start);\n if (step <= 0) {\n window.cancelAnimationFrame(step);\n }\n else {\n if (e.swipeDirection === 'Up') {\n swipeElement.scrollTop += distance * step;\n }\n else if (e.swipeDirection === 'Down') {\n swipeElement.scrollTop -= distance * step;\n }\n start -= 0.02;\n window.requestAnimationFrame(animate);\n }\n };\n animate();\n };\n VScroll.prototype.scrollUpdating = function (scrollVal, action) {\n if (action === 'add') {\n this.scrollEle.scrollTop += scrollVal;\n }\n else {\n this.scrollEle.scrollTop -= scrollVal;\n }\n };\n VScroll.prototype.frameScrollRequest = function (scrollValue, action, isContinuous) {\n var _this = this;\n var step = 10;\n if (isContinuous) {\n this.scrollUpdating(scrollValue, action);\n return;\n }\n if (!this.customStep) {\n [].slice.call(selectAll('.' + CLS_OVERLAY, this.element)).forEach(function (el) {\n scrollValue -= el.offsetHeight;\n });\n }\n var animate = function () {\n if (scrollValue < step) {\n window.cancelAnimationFrame(step);\n }\n else {\n _this.scrollUpdating(step, action);\n scrollValue -= step;\n window.requestAnimationFrame(animate);\n }\n };\n animate();\n };\n VScroll.prototype.touchHandler = function (e) {\n var el = this.scrollEle;\n var distance = e.distanceY;\n if (e.scrollDirection === 'Up') {\n el.scrollTop = el.scrollTop + distance;\n }\n else if (e.scrollDirection === 'Down') {\n el.scrollTop = el.scrollTop - distance;\n }\n };\n VScroll.prototype.arrowDisabling = function (addDisableCls, removeDisableCls) {\n if (this.isDevice) {\n var arrowEle = isNullOrUndefined(addDisableCls) ? removeDisableCls : addDisableCls;\n var arrowIcon = arrowEle.querySelector('.' + CLS_NAVARROW);\n if (isNullOrUndefined(addDisableCls)) {\n classList(arrowIcon, [CLS_NAVDOWNARROW], [CLS_NAVUPARROW]);\n }\n else {\n classList(arrowIcon, [CLS_NAVUPARROW], [CLS_NAVDOWNARROW]);\n }\n }\n else {\n addDisableCls.classList.add(CLS_DISABLE);\n addDisableCls.setAttribute('aria-disabled', 'true');\n addDisableCls.removeAttribute('tabindex');\n removeDisableCls.classList.remove(CLS_DISABLE);\n removeDisableCls.setAttribute('aria-disabled', 'false');\n removeDisableCls.setAttribute('tabindex', '0');\n }\n this.repeatScroll();\n };\n VScroll.prototype.scrollEventHandler = function (e) {\n var target = e.target;\n var height = target.offsetHeight;\n var navUpEle = this.element.querySelector('.' + CLS_VSCROLLNAVUP);\n var navDownEle = this.element.querySelector('.' + CLS_VSCROLLNAVDOWN);\n var upOverlay = this.element.querySelector('.' + CLS_UPOVERLAY);\n var downOverlay = this.element.querySelector('.' + CLS_DOWNOVERLAY);\n var scrollTop = target.scrollTop;\n if (scrollTop <= 0) {\n scrollTop = -scrollTop;\n }\n if (this.isDevice) {\n if (scrollTop < OVERLAY_MAXWID) {\n upOverlay.style.height = scrollTop + 'px';\n }\n else {\n upOverlay.style.height = '40px';\n }\n if ((target.scrollHeight - Math.ceil(height + scrollTop)) < OVERLAY_MAXWID) {\n downOverlay.style.height = (target.scrollHeight - Math.ceil(height + scrollTop)) + 'px';\n }\n else {\n downOverlay.style.height = '40px';\n }\n }\n if (scrollTop === 0) {\n this.arrowDisabling(navUpEle, navDownEle);\n }\n else if (Math.ceil(height + scrollTop + .1) >= target.scrollHeight) {\n this.arrowDisabling(navDownEle, navUpEle);\n }\n else {\n var disEle = this.element.querySelector('.' + CLS_VSCROLLNAV + '.' + CLS_DISABLE);\n if (disEle) {\n disEle.classList.remove(CLS_DISABLE);\n disEle.setAttribute('aria-disabled', 'false');\n disEle.setAttribute('tabindex', '0');\n }\n }\n };\n /**\n * Gets called when the model property changes.The data that describes the old and new values of property that changed.\n *\n * @param {VScrollModel} newProp - It contains the new value of data.\n * @param {VScrollModel} oldProp - It contains the old value of data.\n * @returns {void}\n * @private\n */\n VScroll.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'scrollStep':\n this.setScrollState();\n break;\n case 'enableRtl':\n if (newProp.enableRtl) {\n this.element.classList.add(CLS_RTL);\n }\n else {\n this.element.classList.remove(CLS_RTL);\n }\n break;\n }\n }\n };\n __decorate([\n Property(null)\n ], VScroll.prototype, \"scrollStep\", void 0);\n VScroll = __decorate([\n NotifyPropertyChanges\n ], VScroll);\n return VScroll;\n}(Component));\nexport { VScroll };\n","import { select, detach } from '@syncfusion/ej2-base';\nimport { VScroll } from './v-scroll';\nimport { HScroll } from './h-scroll';\n/**\n * Used to add scroll in menu.\n *\n * @param {createElementType} createElement - Specifies the create element model\n * @param {HTMLElement} container - Specifies the element container\n * @param {HTMLElement} content - Specifies the content element\n * @param {string} scrollType - Specifies the scroll type\n * @param {boolean} enableRtl - Specifies the enable RTL property\n * @param {boolean} offset - Specifies the offset value\n * @returns {HTMLElement} - Element\n * @hidden\n */\nexport function addScrolling(createElement, container, content, scrollType, enableRtl, offset) {\n var containerOffset;\n var contentOffset;\n var parentElem = container.parentElement;\n if (scrollType === 'vscroll') {\n containerOffset = offset || container.getBoundingClientRect().height;\n contentOffset = content.getBoundingClientRect().height;\n }\n else {\n containerOffset = container.getBoundingClientRect().width;\n contentOffset = content.getBoundingClientRect().width;\n }\n if (containerOffset < contentOffset) {\n return createScrollbar(createElement, container, content, scrollType, enableRtl, offset);\n }\n else if (parentElem) {\n var width = parentElem.getBoundingClientRect().width;\n if (width < containerOffset && scrollType === 'hscroll') {\n contentOffset = width;\n container.style.maxWidth = width + 'px';\n return createScrollbar(createElement, container, content, scrollType, enableRtl, offset);\n }\n return content;\n }\n else {\n return content;\n }\n}\n/**\n * Used to create scroll bar in menu.\n *\n * @param {createElementType} createElement - Specifies the create element model\n * @param {HTMLElement} container - Specifies the element container\n * @param {HTMLElement} content - Specifies the content element\n * @param {string} scrollType - Specifies the scroll type\n * @param {boolean} enableRtl - Specifies the enable RTL property\n * @param {boolean} offset - Specifies the offset value\n * @returns {HTMLElement} - Element\n * @hidden\n */\nfunction createScrollbar(createElement, container, content, scrollType, enableRtl, offset) {\n var scrollEle = createElement('div', { className: 'e-menu-' + scrollType });\n container.appendChild(scrollEle);\n scrollEle.appendChild(content);\n if (offset) {\n scrollEle.style.overflow = 'hidden';\n scrollEle.style.height = offset + 'px';\n }\n else {\n scrollEle.style.maxHeight = container.style.maxHeight;\n container.style.overflow = 'hidden';\n }\n var scrollObj;\n if (scrollType === 'vscroll') {\n scrollObj = new VScroll({ enableRtl: enableRtl }, scrollEle);\n scrollObj.scrollStep = select('.e-' + scrollType + '-bar', container).offsetHeight / 2;\n }\n else {\n scrollObj = new HScroll({ enableRtl: enableRtl }, scrollEle);\n scrollObj.scrollStep = select('.e-' + scrollType + '-bar', container).offsetWidth;\n }\n return scrollEle;\n}\n/**\n * Used to destroy the scroll option.\n *\n * @param {VScroll | HScroll} scrollObj - Specifies the scroller object\n * @param {Element} element - Specifies the element\n * @param {HTMLElement} skipEle - Specifies the skip element\n * @returns {void}\n * @hidden\n */\nexport function destroyScroll(scrollObj, element, skipEle) {\n if (scrollObj) {\n var menu = select('.e-menu-parent', element);\n if (menu) {\n if (!skipEle || skipEle === menu) {\n scrollObj.destroy();\n element.parentElement.appendChild(menu);\n detach(element);\n }\n }\n else {\n scrollObj.destroy();\n detach(element);\n }\n }\n}\n","/* eslint-disable valid-jsdoc */\n/* eslint-disable security/detect-object-injection */\nimport { DataUtil } from './util';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * Query class is used to build query which is used by the DataManager to communicate with datasource.\n */\nvar Query = /** @class */ (function () {\n /**\n * Constructor for Query class.\n *\n * @param {string|string[]} from?\n * @param from\n * @hidden\n */\n function Query(from) {\n /** @hidden */\n this.subQuery = null;\n /** @hidden */\n this.isChild = false;\n /** @hidden */\n this.distincts = [];\n this.queries = [];\n this.key = '';\n this.fKey = '';\n if (typeof from === 'string') {\n this.fromTable = from;\n }\n else if (from && from instanceof Array) {\n this.lookups = from;\n }\n this.expands = [];\n this.sortedColumns = [];\n this.groupedColumns = [];\n this.subQuery = null;\n this.isChild = false;\n this.params = [];\n this.lazyLoad = [];\n return this;\n }\n /**\n * Sets the primary key.\n *\n * @param {string} field - Defines the column field.\n */\n Query.prototype.setKey = function (field) {\n this.key = field;\n return this;\n };\n /**\n * Sets default DataManager to execute query.\n *\n * @param {DataManager} dataManager - Defines the DataManager.\n */\n Query.prototype.using = function (dataManager) {\n this.dataManager = dataManager;\n return this;\n };\n /**\n * Executes query with the given DataManager.\n *\n * @param {DataManager} dataManager - Defines the DataManager.\n * @param {Function} done - Defines the success callback.\n * @param {Function} fail - Defines the failure callback.\n * @param {Function} always - Defines the callback which will be invoked on either success or failure.\n *\n * 
\n     * let dataManager: DataManager = new DataManager([{ ID: '10' }, { ID: '2' }, { ID: '1' }, { ID: '20' }]);\n     * let query: Query = new Query();\n     * query.sortBy('ID', (x: string, y: string): number => { return parseInt(x, 10) - parseInt(y, 10) });\n     * let promise: Promise< Object > = query.execute(dataManager);\n     * promise.then((e: { result: Object }) => { });\n     *
\n */\n Query.prototype.execute = function (dataManager, done, fail, always) {\n dataManager = dataManager || this.dataManager;\n if (dataManager) {\n return dataManager.executeQuery(this, done, fail, always);\n }\n return DataUtil.throwError('Query - execute() : dataManager needs to be is set using \"using\" function or should be passed as argument');\n };\n /**\n * Executes query with the local datasource.\n *\n * @param {DataManager} dataManager - Defines the DataManager.\n */\n Query.prototype.executeLocal = function (dataManager) {\n dataManager = dataManager || this.dataManager;\n if (dataManager) {\n return dataManager.executeLocal(this);\n }\n return DataUtil.throwError('Query - executeLocal() : dataManager needs to be is set using \"using\" function or should be passed as argument');\n };\n /**\n * Creates deep copy of the Query object.\n */\n Query.prototype.clone = function () {\n var cloned = new Query();\n cloned.queries = this.queries.slice(0);\n cloned.key = this.key;\n cloned.isChild = this.isChild;\n cloned.dataManager = this.dataManager;\n cloned.fromTable = this.fromTable;\n cloned.params = this.params.slice(0);\n cloned.expands = this.expands.slice(0);\n cloned.sortedColumns = this.sortedColumns.slice(0);\n cloned.groupedColumns = this.groupedColumns.slice(0);\n cloned.subQuerySelector = this.subQuerySelector;\n cloned.subQuery = this.subQuery;\n cloned.fKey = this.fKey;\n cloned.isCountRequired = this.isCountRequired;\n cloned.distincts = this.distincts.slice(0);\n cloned.lazyLoad = this.lazyLoad.slice(0);\n return cloned;\n };\n /**\n * Specifies the name of table to retrieve data in query execution.\n *\n * @param {string} tableName - Defines the table name.\n */\n Query.prototype.from = function (tableName) {\n this.fromTable = tableName;\n return this;\n };\n /**\n * Adds additional parameter which will be sent along with the request which will be generated while DataManager execute.\n *\n * @param {string} key - Defines the key of additional parameter.\n * @param {Function|string} value - Defines the value for the key.\n */\n Query.prototype.addParams = function (key, value) {\n if (typeof value === 'function') {\n this.params.push({ key: key, fn: value });\n }\n else {\n this.params.push({ key: key, value: value });\n }\n return this;\n };\n /**\n * @param fields\n * @hidden\n */\n Query.prototype.distinct = function (fields) {\n if (typeof fields === 'string') {\n this.distincts = [].slice.call([fields], 0);\n }\n else {\n this.distincts = fields.slice(0);\n }\n return this;\n };\n /**\n * Expands the related table.\n *\n * @param {string|Object[]} tables\n */\n Query.prototype.expand = function (tables) {\n if (typeof tables === 'string') {\n this.expands = [].slice.call([tables], 0);\n }\n else {\n this.expands = tables.slice(0);\n }\n return this;\n };\n /**\n * Filter data with given filter criteria.\n *\n * @param {string|Predicate} fieldName - Defines the column field or Predicate.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string|number|boolean} value - Defines the values to match with data.\n * @param {boolean} ignoreCase - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n * @param ignoreAccent\n * @param matchCase\n */\n Query.prototype.where = function (fieldName, operator, value, ignoreCase, ignoreAccent, matchCase) {\n operator = operator ? (operator).toLowerCase() : null;\n var predicate = null;\n if (typeof fieldName === 'string') {\n predicate = new Predicate(fieldName, operator, value, ignoreCase, ignoreAccent, matchCase);\n }\n else if (fieldName instanceof Predicate) {\n predicate = fieldName;\n }\n this.queries.push({\n fn: 'onWhere',\n e: predicate\n });\n return this;\n };\n /**\n * Search data with given search criteria.\n *\n * @param {string|number|boolean} searchKey - Defines the search key.\n * @param {string|string[]} fieldNames - Defines the collection of column fields.\n * @param {string} operator - Defines the operator how to search data.\n * @param {boolean} ignoreCase - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n * @param ignoreAccent\n */\n Query.prototype.search = function (searchKey, fieldNames, operator, ignoreCase, ignoreAccent) {\n if (typeof fieldNames === 'string') {\n fieldNames = [fieldNames];\n }\n if (!operator || operator === 'none') {\n operator = 'contains';\n }\n var comparer = DataUtil.fnOperators[operator];\n this.queries.push({\n fn: 'onSearch',\n e: {\n fieldNames: fieldNames,\n operator: operator,\n searchKey: searchKey,\n ignoreCase: ignoreCase,\n ignoreAccent: ignoreAccent,\n comparer: comparer\n }\n });\n return this;\n };\n /**\n * Sort the data with given sort criteria.\n * By default, sort direction is ascending.\n *\n * @param {string|string[]} fieldName - Defines the single or collection of column fields.\n * @param {string|Function} comparer - Defines the sort direction or custom sort comparer function.\n * @param isFromGroup\n */\n Query.prototype.sortBy = function (fieldName, comparer, isFromGroup) {\n return this.sortByForeignKey(fieldName, comparer, isFromGroup);\n };\n /**\n * Sort the data with given sort criteria.\n * By default, sort direction is ascending.\n *\n * @param {string|string[]} fieldName - Defines the single or collection of column fields.\n * @param {string|Function} comparer - Defines the sort direction or custom sort comparer function.\n * @param isFromGroup\n * @param {string} direction - Defines the sort direction .\n */\n Query.prototype.sortByForeignKey = function (fieldName, comparer, isFromGroup, direction) {\n var order = !isNullOrUndefined(direction) ? direction : 'ascending';\n var sorts;\n var temp;\n if (typeof fieldName === 'string' && DataUtil.endsWith(fieldName.toLowerCase(), ' desc')) {\n fieldName = fieldName.replace(/ desc$/i, '');\n comparer = 'descending';\n }\n if (!comparer || typeof comparer === 'string') {\n order = comparer ? comparer.toLowerCase() : 'ascending';\n comparer = DataUtil.fnSort(comparer);\n }\n if (isFromGroup) {\n sorts = Query.filterQueries(this.queries, 'onSortBy');\n for (var i = 0; i < sorts.length; i++) {\n temp = sorts[i].e.fieldName;\n if (typeof temp === 'string') {\n if (temp === fieldName) {\n return this;\n }\n }\n else if (temp instanceof Array) {\n for (var j = 0; j < temp.length; j++) {\n if (temp[j] === fieldName || fieldName.toLowerCase() === temp[j] + ' desc') {\n return this;\n }\n }\n }\n }\n }\n this.queries.push({\n fn: 'onSortBy',\n e: {\n fieldName: fieldName,\n comparer: comparer,\n direction: order\n }\n });\n return this;\n };\n /**\n * Sorts data in descending order.\n *\n * @param {string} fieldName - Defines the column field.\n */\n Query.prototype.sortByDesc = function (fieldName) {\n return this.sortBy(fieldName, 'descending');\n };\n /**\n * Groups data with the given field name.\n *\n * @param {string} fieldName - Defines the column field.\n * @param fn\n * @param format\n */\n Query.prototype.group = function (fieldName, fn, format) {\n this.sortBy(fieldName, null, true);\n this.queries.push({\n fn: 'onGroup',\n e: {\n fieldName: fieldName,\n comparer: fn ? fn : null,\n format: format ? format : null\n }\n });\n return this;\n };\n /**\n * Gets data based on the given page index and size.\n *\n * @param {number} pageIndex - Defines the current page index.\n * @param {number} pageSize - Defines the no of records per page.\n */\n Query.prototype.page = function (pageIndex, pageSize) {\n this.queries.push({\n fn: 'onPage',\n e: {\n pageIndex: pageIndex,\n pageSize: pageSize\n }\n });\n return this;\n };\n /**\n * Gets data based on the given start and end index.\n *\n * @param {number} start - Defines the start index of the datasource.\n * @param {number} end - Defines the end index of the datasource.\n */\n Query.prototype.range = function (start, end) {\n this.queries.push({\n fn: 'onRange',\n e: {\n start: start,\n end: end\n }\n });\n return this;\n };\n /**\n * Gets data from the top of the data source based on given number of records count.\n *\n * @param {number} nos - Defines the no of records to retrieve from datasource.\n */\n Query.prototype.take = function (nos) {\n this.queries.push({\n fn: 'onTake',\n e: {\n nos: nos\n }\n });\n return this;\n };\n /**\n * Skips data with given number of records count from the top of the data source.\n *\n * @param {number} nos - Defines the no of records skip in the datasource.\n */\n Query.prototype.skip = function (nos) {\n this.queries.push({\n fn: 'onSkip',\n e: { nos: nos }\n });\n return this;\n };\n /**\n * Selects specified columns from the data source.\n *\n * @param {string|string[]} fieldNames - Defines the collection of column fields.\n */\n Query.prototype.select = function (fieldNames) {\n if (typeof fieldNames === 'string') {\n fieldNames = [].slice.call([fieldNames], 0);\n }\n this.queries.push({\n fn: 'onSelect',\n e: { fieldNames: fieldNames }\n });\n return this;\n };\n /**\n * Gets the records in hierarchical relationship from two tables. It requires the foreign key to relate two tables.\n *\n * @param {Query} query - Defines the query to relate two tables.\n * @param {Function} selectorFn - Defines the custom function to select records.\n */\n Query.prototype.hierarchy = function (query, selectorFn) {\n this.subQuerySelector = selectorFn;\n this.subQuery = query;\n return this;\n };\n /**\n * Sets the foreign key which is used to get data from the related table.\n *\n * @param {string} key - Defines the foreign key.\n */\n Query.prototype.foreignKey = function (key) {\n this.fKey = key;\n return this;\n };\n /**\n * It is used to get total number of records in the DataManager execution result.\n */\n Query.prototype.requiresCount = function () {\n this.isCountRequired = true;\n return this;\n };\n //type - sum, avg, min, max\n /**\n * Aggregate the data with given type and field name.\n *\n * @param {string} type - Defines the aggregate type.\n * @param {string} field - Defines the column field to aggregate.\n */\n Query.prototype.aggregate = function (type, field) {\n this.queries.push({\n fn: 'onAggregates',\n e: { field: field, type: type }\n });\n return this;\n };\n /**\n * Pass array of filterColumn query for performing filter operation.\n *\n * @param {QueryOptions[]} queries\n * @param {string} name\n * @hidden\n */\n Query.filterQueries = function (queries, name) {\n return queries.filter(function (q) {\n return q.fn === name;\n });\n };\n /**\n * To get the list of queries which is already filtered in current data source.\n *\n * @param {Object[]} queries\n * @param {string[]} singles\n * @hidden\n */\n Query.filterQueryLists = function (queries, singles) {\n var filtered = queries.filter(function (q) {\n return singles.indexOf(q.fn) !== -1;\n });\n var res = {};\n for (var i = 0; i < filtered.length; i++) {\n if (!res[filtered[i].fn]) {\n res[filtered[i].fn] = filtered[i].e;\n }\n }\n return res;\n };\n return Query;\n}());\nexport { Query };\n/**\n * Predicate class is used to generate complex filter criteria.\n * This will be used by DataManager to perform multiple filtering operation.\n */\nvar Predicate = /** @class */ (function () {\n /**\n * Constructor for Predicate class.\n *\n * @param {string|Predicate} field\n * @param {string} operator\n * @param {string|number|boolean|Predicate|Predicate[]} value\n * @param {boolean=false} ignoreCase\n * @param ignoreAccent\n * @param {boolean} matchCase\n * @hidden\n */\n function Predicate(field, operator, value, ignoreCase, ignoreAccent, matchCase) {\n if (ignoreCase === void 0) { ignoreCase = false; }\n /** @hidden */\n this.ignoreAccent = false;\n /** @hidden */\n this.isComplex = false;\n if (typeof field === 'string') {\n this.field = field;\n this.operator = operator.toLowerCase();\n this.value = value;\n this.matchCase = matchCase;\n this.ignoreCase = ignoreCase;\n this.ignoreAccent = ignoreAccent;\n this.isComplex = false;\n this.comparer = DataUtil.fnOperators.processOperator(this.operator);\n }\n else if (field instanceof Predicate && value instanceof Predicate || value instanceof Array) {\n this.isComplex = true;\n this.condition = operator.toLowerCase();\n this.predicates = [field];\n this.matchCase = field.matchCase;\n this.ignoreCase = field.ignoreCase;\n this.ignoreAccent = field.ignoreAccent;\n if (value instanceof Array) {\n [].push.apply(this.predicates, value);\n }\n else {\n this.predicates.push(value);\n }\n }\n return this;\n }\n /**\n * Adds n-number of new predicates on existing predicate with “and” condition.\n *\n * @param {Object[]} args - Defines the collection of predicates.\n */\n Predicate.and = function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n return Predicate.combinePredicates([].slice.call(args, 0), 'and');\n };\n /**\n * Adds new predicate on existing predicate with “and” condition.\n *\n * @param {string} field - Defines the column field.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string} value - Defines the values to match with data.\n * @param {boolean} ignoreCase? - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n * @param ignoreCase\n * @param ignoreAccent\n */\n Predicate.prototype.and = function (field, operator, value, ignoreCase, ignoreAccent) {\n return Predicate.combine(this, field, operator, value, 'and', ignoreCase, ignoreAccent);\n };\n /**\n * Adds n-number of new predicates on existing predicate with “or” condition.\n *\n * @param {Object[]} args - Defines the collection of predicates.\n */\n Predicate.or = function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n return Predicate.combinePredicates([].slice.call(args, 0), 'or');\n };\n /**\n * Adds new predicate on existing predicate with “or” condition.\n *\n * @param {string} field - Defines the column field.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string} value - Defines the values to match with data.\n * @param {boolean} ignoreCase? - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n * @param ignoreCase\n * @param ignoreAccent\n */\n Predicate.prototype.or = function (field, operator, value, ignoreCase, ignoreAccent) {\n return Predicate.combine(this, field, operator, value, 'or', ignoreCase, ignoreAccent);\n };\n /**\n * Adds n-number of new predicates on existing predicate with “and not” condition.\n *\n * @param {Object[]} args - Defines the collection of predicates.\n */\n Predicate.ornot = function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n return Predicate.combinePredicates([].slice.call(args, 0), 'or not');\n };\n /**\n * Adds new predicate on existing predicate with “and not” condition.\n *\n * @param {string} field - Defines the column field.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string} value - Defines the values to match with data.\n * @param {boolean} ignoreCase? - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n * @param ignoreCase\n * @param ignoreAccent\n */\n Predicate.prototype.ornot = function (field, operator, value, ignoreCase, ignoreAccent) {\n return Predicate.combine(this, field, operator, value, 'ornot', ignoreCase, ignoreAccent);\n };\n /**\n * Adds n-number of new predicates on existing predicate with “and not” condition.\n *\n * @param {Object[]} args - Defines the collection of predicates.\n */\n Predicate.andnot = function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n return Predicate.combinePredicates([].slice.call(args, 0), 'and not');\n };\n /**\n * Adds new predicate on existing predicate with “and not” condition.\n *\n * @param {string} field - Defines the column field.\n * @param {string} operator - Defines the operator how to filter data.\n * @param {string} value - Defines the values to match with data.\n * @param {boolean} ignoreCase? - If ignore case set to false, then filter data with exact match or else\n * filter data with case insensitive.\n * @param ignoreCase\n * @param ignoreAccent\n */\n Predicate.prototype.andnot = function (field, operator, value, ignoreCase, ignoreAccent) {\n return Predicate.combine(this, field, operator, value, 'andnot', ignoreCase, ignoreAccent);\n };\n /**\n * Converts plain JavaScript object to Predicate object.\n *\n * @param {Predicate[]|Predicate} json - Defines single or collection of Predicate.\n */\n Predicate.fromJson = function (json) {\n if (json instanceof Array) {\n var res = [];\n for (var i = 0, len = json.length; i < len; i++) {\n res.push(this.fromJSONData(json[i]));\n }\n return res;\n }\n var pred = json;\n return this.fromJSONData(pred);\n };\n /**\n * Validate the record based on the predicates.\n *\n * @param {Object} record - Defines the datasource record.\n */\n Predicate.prototype.validate = function (record) {\n var predicate = this.predicates ? this.predicates : [];\n var ret;\n var isAnd;\n if (!this.isComplex && this.comparer) {\n if (this.condition && this.condition.indexOf('not') !== -1) {\n this.condition = this.condition.split('not')[0] === '' ? undefined : this.condition.split('not')[0];\n return !this.comparer.call(this, DataUtil.getObject(this.field, record), this.value, this.ignoreCase, this.ignoreAccent);\n }\n else {\n return this.comparer.call(this, DataUtil.getObject(this.field, record), this.value, this.ignoreCase, this.ignoreAccent);\n }\n }\n if (this.condition && this.condition.indexOf('not') !== -1) {\n isAnd = this.condition.indexOf('and') !== -1;\n }\n else {\n isAnd = this.condition === 'and';\n }\n for (var i = 0; i < predicate.length; i++) {\n if (i > 0 && this.condition && this.condition.indexOf('not') !== -1) {\n predicate[i].condition = predicate[i].condition ? predicate[i].condition + 'not' : 'not';\n }\n ret = predicate[i].validate(record);\n if (isAnd) {\n if (!ret) {\n return false;\n }\n }\n else {\n if (ret) {\n return true;\n }\n }\n }\n return isAnd;\n };\n /**\n * Converts predicates to plain JavaScript.\n * This method is uses Json stringify when serializing Predicate object.\n */\n Predicate.prototype.toJson = function () {\n var predicates;\n var p;\n if (this.isComplex) {\n predicates = [];\n p = this.predicates;\n for (var i = 0; i < p.length; i++) {\n predicates.push(p[i].toJson());\n }\n }\n return {\n isComplex: this.isComplex,\n field: this.field,\n operator: this.operator,\n value: this.value,\n ignoreCase: this.ignoreCase,\n ignoreAccent: this.ignoreAccent,\n condition: this.condition,\n predicates: predicates,\n matchCase: this.matchCase\n };\n };\n Predicate.combinePredicates = function (predicates, operator) {\n if (predicates.length === 1) {\n if (!(predicates[0] instanceof Array)) {\n return predicates[0];\n }\n predicates = predicates[0];\n }\n return new Predicate(predicates[0], operator, predicates.slice(1));\n };\n Predicate.combine = function (pred, field, operator, value, condition, ignoreCase, ignoreAccent) {\n if (field instanceof Predicate) {\n return Predicate[condition](pred, field);\n }\n if (typeof field === 'string') {\n return Predicate[condition](pred, new Predicate(field, operator, value, ignoreCase, ignoreAccent));\n }\n return DataUtil.throwError('Predicate - ' + condition + ' : invalid arguments');\n };\n Predicate.fromJSONData = function (json) {\n var preds = json.predicates || [];\n var len = preds.length;\n var predicates = [];\n var result;\n for (var i = 0; i < len; i++) {\n predicates.push(this.fromJSONData(preds[i]));\n }\n if (!json.isComplex) {\n result = new Predicate(json.field, json.operator, json.value, json.ignoreCase, json.ignoreAccent);\n }\n else {\n result = new Predicate(predicates[0], json.condition, predicates.slice(1));\n }\n return result;\n };\n return Predicate;\n}());\nexport { Predicate };\n","/* eslint-disable valid-jsdoc */\n/* eslint-disable security/detect-object-injection */\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataManager } from './manager';\nimport { Query, Predicate } from './query';\nvar consts = { GroupGuid: '{271bbba0-1ee7}' };\n/**\n * Data manager common utility methods.\n *\n * @hidden\n */\nvar DataUtil = /** @class */ (function () {\n function DataUtil() {\n }\n /**\n * Returns the value by invoking the provided parameter function.\n * If the paramater is not of type function then it will be returned as it is.\n *\n * @param {Function|string|string[]|number} value\n * @param {Object} inst?\n * @param inst\n * @hidden\n */\n DataUtil.getValue = function (value, inst) {\n if (typeof value === 'function') {\n return value.call(inst || {});\n }\n return value;\n };\n /**\n * Returns true if the input string ends with given string.\n *\n * @param {string} input\n * @param {string} substr\n */\n DataUtil.endsWith = function (input, substr) {\n return input.slice && input.slice(-substr.length) === substr;\n };\n /**\n * Returns true if the input string not ends with given string.\n *\n * @param {string} input\n * @param {string} substr\n */\n DataUtil.notEndsWith = function (input, substr) {\n return input.slice && input.slice(-substr.length) !== substr;\n };\n /**\n * Returns true if the input string starts with given string.\n *\n * @param {string} str\n * @param {string} startstr\n * @param input\n * @param start\n */\n DataUtil.startsWith = function (input, start) {\n return input.slice(0, start.length) === start;\n };\n /**\n * Returns true if the input string not starts with given string.\n *\n * @param {string} str\n * @param {string} startstr\n * @param input\n * @param start\n */\n DataUtil.notStartsWith = function (input, start) {\n return input.slice(0, start.length) !== start;\n };\n /**\n * Returns true if the input string pattern(wildcard) matches with given string.\n *\n * @param {string} str\n * @param {string} startstr\n * @param input\n * @param pattern\n */\n DataUtil.wildCard = function (input, pattern) {\n var asteriskSplit;\n var optionalSplit;\n // special character allowed search\n if (pattern.indexOf('[') !== -1) {\n pattern = pattern.split('[').join('[[]');\n }\n if (pattern.indexOf('(') !== -1) {\n pattern = pattern.split('(').join('[(]');\n }\n if (pattern.indexOf(')') !== -1) {\n pattern = pattern.split(')').join('[)]');\n }\n if (pattern.indexOf('\\\\') !== -1) {\n pattern = pattern.split('\\\\').join('[\\\\\\\\]');\n }\n if (pattern.indexOf('*') !== -1) {\n if (pattern.charAt(0) !== '*') {\n pattern = '^' + pattern;\n }\n if (pattern.charAt(pattern.length - 1) !== '*') {\n pattern = pattern + '$';\n }\n asteriskSplit = pattern.split('*');\n for (var i = 0; i < asteriskSplit.length; i++) {\n if (asteriskSplit[i].indexOf('.') === -1) {\n asteriskSplit[i] = asteriskSplit[i] + '.*';\n }\n else {\n asteriskSplit[i] = asteriskSplit[i] + '*';\n }\n }\n pattern = asteriskSplit.join('');\n }\n if (pattern.indexOf('%3f') !== -1 || pattern.indexOf('?') !== -1) {\n optionalSplit = pattern.indexOf('%3f') !== -1 ? pattern.split('%3f') : pattern.split('?');\n pattern = optionalSplit.join('.');\n }\n // eslint-disable-next-line security/detect-non-literal-regexp\n var regexPattern = new RegExp(pattern, 'g');\n return regexPattern.test(input);\n };\n /**\n * Returns true if the input string pattern(like) matches with given string.\n *\n * @param {string} str\n * @param {string} startstr\n * @param input\n * @param pattern\n */\n DataUtil.like = function (input, pattern) {\n if (pattern.indexOf('%') !== -1) {\n if (pattern.charAt(0) === '%' && pattern.lastIndexOf('%') < 2) {\n pattern = pattern.substring(1, pattern.length);\n return DataUtil.startsWith(DataUtil.toLowerCase(input), DataUtil.toLowerCase(pattern));\n }\n else if (pattern.charAt(pattern.length - 1) === '%' && pattern.indexOf('%') > pattern.length - 3) {\n pattern = pattern.substring(0, pattern.length - 1);\n return DataUtil.endsWith(DataUtil.toLowerCase(input), DataUtil.toLowerCase(pattern));\n }\n else if (pattern.lastIndexOf('%') !== pattern.indexOf('%') && pattern.lastIndexOf('%') > pattern.indexOf('%') + 1) {\n pattern = pattern.substring(pattern.indexOf('%') + 1, pattern.lastIndexOf('%'));\n return input.indexOf(pattern) !== -1;\n }\n else {\n return input.indexOf(pattern) !== -1;\n }\n }\n else {\n return false;\n }\n };\n /**\n * To return the sorting function based on the string.\n *\n * @param {string} order\n * @hidden\n */\n DataUtil.fnSort = function (order) {\n order = order ? DataUtil.toLowerCase(order) : 'ascending';\n if (order === 'ascending') {\n return this.fnAscending;\n }\n return this.fnDescending;\n };\n /**\n * Comparer function which is used to sort the data in ascending order.\n *\n * @param {string|number} x\n * @param {string|number} y\n * @returns number\n */\n DataUtil.fnAscending = function (x, y) {\n if (isNullOrUndefined(x) && isNullOrUndefined(y)) {\n return -1;\n }\n if (y === null || y === undefined) {\n return -1;\n }\n if (typeof x === 'string') {\n return x.localeCompare(y);\n }\n if (x === null || x === undefined) {\n return 1;\n }\n return x - y;\n };\n /**\n * Comparer function which is used to sort the data in descending order.\n *\n * @param {string|number} x\n * @param {string|number} y\n * @returns number\n */\n DataUtil.fnDescending = function (x, y) {\n if (isNullOrUndefined(x) && isNullOrUndefined(y)) {\n return -1;\n }\n if (y === null || y === undefined) {\n return 1;\n }\n if (typeof x === 'string') {\n return x.localeCompare(y) * -1;\n }\n if (x === null || x === undefined) {\n return -1;\n }\n return y - x;\n };\n DataUtil.extractFields = function (obj, fields) {\n var newObj = {};\n for (var i = 0; i < fields.length; i++) {\n newObj = this.setValue(fields[i], this.getObject(fields[i], obj), newObj);\n }\n return newObj;\n };\n /**\n * Select objects by given fields from jsonArray.\n *\n * @param {Object[]} jsonArray\n * @param {string[]} fields\n */\n DataUtil.select = function (jsonArray, fields) {\n var newData = [];\n for (var i = 0; i < jsonArray.length; i++) {\n newData.push(this.extractFields(jsonArray[i], fields));\n }\n return newData;\n };\n /**\n * Group the input data based on the field name.\n * It also performs aggregation of the grouped records based on the aggregates paramater.\n *\n * @param {Object[]} jsonArray\n * @param {string} field?\n * @param {Object[]} agg?\n * @param {number} level?\n * @param {Object[]} groupDs?\n * @param field\n * @param aggregates\n * @param level\n * @param groupDs\n * @param format\n * @param isLazyLoad\n */\n DataUtil.group = function (jsonArray, field, aggregates, level, groupDs, format, isLazyLoad) {\n level = level || 1;\n var jsonData = jsonArray;\n var guid = 'GroupGuid';\n if (jsonData.GroupGuid === consts[guid]) {\n var _loop_1 = function (j) {\n if (!isNullOrUndefined(groupDs)) {\n var indx = -1;\n var temp = groupDs.filter(function (e) { return e.key === jsonData[j].key; });\n indx = groupDs.indexOf(temp[0]);\n jsonData[j].items = this_1.group(jsonData[j].items, field, aggregates, jsonData.level + 1, groupDs[indx].items, format, isLazyLoad);\n jsonData[j].count = groupDs[indx].count;\n }\n else {\n jsonData[j].items = this_1.group(jsonData[j].items, field, aggregates, jsonData.level + 1, null, format, isLazyLoad);\n jsonData[j].count = jsonData[j].items.length;\n }\n };\n var this_1 = this;\n for (var j = 0; j < jsonData.length; j++) {\n _loop_1(j);\n }\n jsonData.childLevels += 1;\n return jsonData;\n }\n var grouped = {};\n var groupedArray = [];\n groupedArray.GroupGuid = consts[guid];\n groupedArray.level = level;\n groupedArray.childLevels = 0;\n groupedArray.records = jsonData;\n var _loop_2 = function (i) {\n var val = this_2.getVal(jsonData, i, field);\n if (!isNullOrUndefined(format)) {\n val = format(val, field);\n }\n if (!grouped[val]) {\n grouped[val] = {\n key: val,\n count: 0,\n items: [],\n aggregates: {},\n field: field\n };\n groupedArray.push(grouped[val]);\n if (!isNullOrUndefined(groupDs)) {\n var tempObj = groupDs.filter(function (e) { return e.key === grouped[val].key; });\n grouped[val].count = tempObj[0].count;\n }\n }\n grouped[val].count = !isNullOrUndefined(groupDs) ? grouped[val].count : grouped[val].count += 1;\n if (!isLazyLoad || (isLazyLoad && aggregates.length)) {\n grouped[val].items.push(jsonData[i]);\n }\n };\n var this_2 = this;\n for (var i = 0; i < jsonData.length; i++) {\n _loop_2(i);\n }\n if (aggregates && aggregates.length) {\n var _loop_3 = function (i) {\n var res = {};\n var fn = void 0;\n var aggs = aggregates;\n for (var j = 0; j < aggregates.length; j++) {\n fn = DataUtil.aggregates[aggregates[j].type];\n if (!isNullOrUndefined(groupDs)) {\n var temp = groupDs.filter(function (e) { return e.key === groupedArray[i].key; });\n if (fn) {\n res[aggs[j].field + ' - ' + aggs[j].type] = fn(temp[0].items, aggs[j].field);\n }\n }\n else {\n if (fn) {\n res[aggs[j].field + ' - ' + aggs[j].type] = fn(groupedArray[i].items, aggs[j].field);\n }\n }\n }\n groupedArray[i].aggregates = res;\n };\n for (var i = 0; i < groupedArray.length; i++) {\n _loop_3(i);\n }\n }\n if (isLazyLoad && groupedArray.length && aggregates.length) {\n for (var i = 0; i < groupedArray.length; i++) {\n groupedArray[i].items = [];\n }\n }\n return jsonData.length && groupedArray || jsonData;\n };\n /**\n * It is used to categorize the multiple items based on a specific field in jsonArray.\n * The hierarchical queries are commonly required when you use foreign key binding.\n *\n * @param {string} fKey\n * @param {string} from\n * @param {Object[]} source\n * @param {Group} lookup?\n * @param {string} pKey?\n * @param lookup\n * @param pKey\n * @hidden\n */\n DataUtil.buildHierarchy = function (fKey, from, source, lookup, pKey) {\n var i;\n var grp = {};\n var temp;\n if (lookup.result) {\n lookup = lookup.result;\n }\n if (lookup.GroupGuid) {\n this.throwError('DataManager: Do not have support Grouping in hierarchy');\n }\n for (i = 0; i < lookup.length; i++) {\n var fKeyData = this.getObject(fKey, lookup[i]);\n temp = grp[fKeyData] || (grp[fKeyData] = []);\n temp.push(lookup[i]);\n }\n for (i = 0; i < source.length; i++) {\n var fKeyData = this.getObject(pKey || fKey, source[i]);\n source[i][from] = grp[fKeyData];\n }\n };\n /**\n * The method used to get the field names which started with specified characters.\n *\n * @param {Object} obj\n * @param {string[]} fields?\n * @param {string} prefix?\n * @param fields\n * @param prefix\n * @hidden\n */\n DataUtil.getFieldList = function (obj, fields, prefix) {\n if (prefix === undefined) {\n prefix = '';\n }\n if (fields === undefined || fields === null) {\n return this.getFieldList(obj, [], prefix);\n }\n var copyObj = obj;\n var keys = Object.keys(obj);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var prop = keys_1[_i];\n if (typeof copyObj[prop] === 'object' && !(copyObj[prop] instanceof Array)) {\n this.getFieldList(copyObj[prop], fields, prefix + prop + '.');\n }\n else {\n fields.push(prefix + prop);\n }\n }\n return fields;\n };\n /**\n * Gets the value of the property in the given object.\n * The complex object can be accessed by providing the field names concatenated with dot(.).\n *\n * @param {string} nameSpace - The name of the property to be accessed.\n * @param {Object} from - Defines the source object.\n */\n DataUtil.getObject = function (nameSpace, from) {\n if (!nameSpace) {\n return from;\n }\n if (!from) {\n return undefined;\n }\n if (nameSpace.indexOf('.') === -1) {\n var lowerCaseNameSpace = nameSpace.charAt(0).toLowerCase() + nameSpace.slice(1);\n var upperCaseNameSpace = nameSpace.charAt(0).toUpperCase() + nameSpace.slice(1);\n if (!isNullOrUndefined(from[nameSpace])) {\n return from[nameSpace];\n }\n else {\n if (!isNullOrUndefined(from[lowerCaseNameSpace])) {\n return from[lowerCaseNameSpace];\n }\n else if (!isNullOrUndefined(from[upperCaseNameSpace])) {\n return from[upperCaseNameSpace];\n }\n else {\n return null;\n }\n }\n }\n var value = from;\n var splits = nameSpace.split('.');\n for (var i = 0; i < splits.length; i++) {\n if (value == null) {\n break;\n }\n value = value[splits[i]];\n if (value === undefined) {\n var casing = splits[i].charAt(0).toUpperCase() + splits[i].slice(1);\n value = from[casing] || from[casing.charAt(0).toLowerCase() + casing.slice(1)] || null;\n }\n from = value;\n }\n return value;\n };\n /**\n * To set value for the nameSpace in desired object.\n *\n * @param {string} nameSpace - String value to the get the inner object.\n * @param {Object} value - Value that you need to set.\n * @param {Object} obj - Object to get the inner object value.\n * @return { [key: string]: Object; } | Object\n * @hidden\n */\n DataUtil.setValue = function (nameSpace, value, obj) {\n var keys = nameSpace.toString().split('.');\n var start = obj || {};\n var fromObj = start;\n var i;\n var length = keys.length;\n var key;\n for (i = 0; i < length; i++) {\n key = keys[i];\n if (i + 1 === length) {\n fromObj[key] = value === undefined ? undefined : value;\n }\n else if (isNullOrUndefined(fromObj[key])) {\n fromObj[key] = {};\n }\n fromObj = fromObj[key];\n }\n return start;\n };\n /**\n * Sort the given data based on the field and comparer.\n *\n * @param {Object[]} ds - Defines the input data.\n * @param {string} field - Defines the field to be sorted.\n * @param {Function} comparer - Defines the comparer function used to sort the records.\n */\n DataUtil.sort = function (ds, field, comparer) {\n if (ds.length <= 1) {\n return ds;\n }\n var middle = parseInt((ds.length / 2).toString(), 10);\n var left = ds.slice(0, middle);\n var right = ds.slice(middle);\n left = this.sort(left, field, comparer);\n right = this.sort(right, field, comparer);\n return this.merge(left, right, field, comparer);\n };\n DataUtil.ignoreDiacritics = function (value) {\n if (typeof value !== 'string') {\n return value;\n }\n var result = value.split('');\n var newValue = result.map(function (temp) { return temp in DataUtil.diacritics ? DataUtil.diacritics[temp] : temp; });\n return newValue.join('');\n };\n DataUtil.merge = function (left, right, fieldName, comparer) {\n var result = [];\n var current;\n while (left.length > 0 || right.length > 0) {\n if (left.length > 0 && right.length > 0) {\n if (comparer) {\n current = comparer(this.getVal(left, 0, fieldName), this.getVal(right, 0, fieldName), left[0], right[0]) <= 0 ? left : right;\n }\n else {\n current = left[0][fieldName] < left[0][fieldName] ? left : right;\n }\n }\n else {\n current = left.length > 0 ? left : right;\n }\n result.push(current.shift());\n }\n return result;\n };\n DataUtil.getVal = function (array, index, field) {\n return field ? this.getObject(field, array[index]) : array[index];\n };\n DataUtil.toLowerCase = function (val) {\n return val ? typeof val === 'string' ? val.toLowerCase() : val.toString() : (val === 0 || val === false) ? val.toString() : '';\n };\n /**\n * To perform the filter operation with specified adaptor and returns the result.\n *\n * @param {Object} adaptor\n * @param {string} fnName\n * @param {Object} param1?\n * @param {Object} param2?\n * @param param1\n * @param param2\n * @hidden\n */\n DataUtil.callAdaptorFunction = function (adaptor, fnName, param1, param2) {\n if (fnName in adaptor) {\n var res = adaptor[fnName](param1, param2);\n if (!isNullOrUndefined(res)) {\n param1 = res;\n }\n }\n return param1;\n };\n DataUtil.getAddParams = function (adp, dm, query) {\n var req = {};\n DataUtil.callAdaptorFunction(adp, 'addParams', {\n dm: dm,\n query: query,\n params: query.params,\n reqParams: req\n });\n return req;\n };\n /**\n * Checks wheather the given input is a plain object or not.\n *\n * @param {Object|Object[]} obj\n */\n DataUtil.isPlainObject = function (obj) {\n return (!!obj) && (obj.constructor === Object);\n };\n /**\n * Returns true when the browser cross origin request.\n */\n DataUtil.isCors = function () {\n var xhr = null;\n var request = 'XMLHttpRequest';\n try {\n xhr = new window[request]();\n }\n catch (e) {\n // No exception handling\n }\n return !!xhr && ('withCredentials' in xhr);\n };\n /**\n * Generate random GUID value which will be prefixed with the given value.\n *\n * @param {string} prefix\n */\n DataUtil.getGuid = function (prefix) {\n var hexs = '0123456789abcdef';\n var rand;\n return (prefix || '') + '00000000-0000-4000-0000-000000000000'.replace(/0/g, function (val, i) {\n if ('crypto' in window && 'getRandomValues' in crypto) {\n var arr = new Uint8Array(1);\n window.crypto.getRandomValues(arr);\n rand = arr[0] % 16 | 0;\n }\n else {\n rand = Math.random() * 16 | 0;\n }\n return hexs[i === 19 ? rand & 0x3 | 0x8 : rand];\n });\n };\n /**\n * Checks wheather the given value is null or not.\n *\n * @param {string|Object} val\n * @returns boolean\n */\n DataUtil.isNull = function (val) {\n return val === undefined || val === null;\n };\n /**\n * To get the required items from collection of objects.\n *\n * @param {Object[]} array\n * @param {string} field\n * @param {Function} comparer\n * @returns Object\n * @hidden\n */\n DataUtil.getItemFromComparer = function (array, field, comparer) {\n var keyVal;\n var current;\n var key;\n var i = 0;\n var castRequired = typeof DataUtil.getVal(array, 0, field) === 'string';\n if (array.length) {\n while (isNullOrUndefined(keyVal) && i < array.length) {\n keyVal = DataUtil.getVal(array, i, field);\n key = array[i++];\n }\n }\n for (; i < array.length; i++) {\n current = DataUtil.getVal(array, i, field);\n if (isNullOrUndefined(current)) {\n continue;\n }\n if (castRequired) {\n keyVal = +keyVal;\n current = +current;\n }\n if (comparer(keyVal, current) > 0) {\n keyVal = current;\n key = array[i];\n }\n }\n return key;\n };\n /**\n * To get distinct values of Array or Array of Objects.\n *\n * @param {Object[]} json\n * @param {string} field\n * @param fieldName\n * @param {boolean} requiresCompleteRecord\n * @returns Object[]\n * * distinct array of objects is return when requiresCompleteRecord set as true.\n * @hidden\n */\n DataUtil.distinct = function (json, fieldName, requiresCompleteRecord) {\n requiresCompleteRecord = isNullOrUndefined(requiresCompleteRecord) ? false : requiresCompleteRecord;\n var result = [];\n var val;\n var tmp = {};\n json.forEach(function (data, index) {\n val = typeof (json[index]) === 'object' ? DataUtil.getVal(json, index, fieldName) : json[index];\n if (!(val in tmp)) {\n result.push(!requiresCompleteRecord ? val : json[index]);\n tmp[val] = 1;\n }\n });\n return result;\n };\n /**\n * Process the given records based on the datamanager string.\n *\n * @param {string} datamanager\n * @param dm\n * @param {Object[]} records\n */\n DataUtil.processData = function (dm, records) {\n var query = this.prepareQuery(dm);\n var sampledata = new DataManager(records);\n if (dm.requiresCounts) {\n query.requiresCount();\n }\n /* eslint-disable @typescript-eslint/no-explicit-any */\n // tslint:disable-next-line:no-any\n var result = sampledata.executeLocal(query);\n /* eslint-enable @typescript-eslint/no-explicit-any */\n var returnValue = {\n result: dm.requiresCounts ? result.result : result,\n count: result.count,\n aggregates: JSON.stringify(result.aggregates)\n };\n return dm.requiresCounts ? returnValue : result;\n };\n DataUtil.prepareQuery = function (dm) {\n var _this = this;\n var query = new Query();\n if (dm.select) {\n query.select(dm.select);\n }\n if (dm.where) {\n var where = DataUtil.parse.parseJson(dm.where);\n where.filter(function (pred) {\n if (isNullOrUndefined(pred.condition)) {\n query.where(pred.field, pred.operator, pred.value, pred.ignoreCase, pred.ignoreAccent);\n }\n else {\n var predicateList = [];\n if (pred.field) {\n predicateList.push(new Predicate(pred.field, pred.operator, pred.value, pred.ignoreCase, pred.ignoreAccent));\n }\n else {\n predicateList = predicateList.concat(_this.getPredicate(pred.predicates));\n }\n if (pred.condition === 'or') {\n query.where(Predicate.or(predicateList));\n }\n else if (pred.condition === 'and') {\n query.where(Predicate.and(predicateList));\n }\n }\n });\n }\n if (dm.search) {\n var search = DataUtil.parse.parseJson(dm.search);\n // tslint:disable-next-line:no-string-literal\n search.filter(function (e) { return query.search(e.key, e.fields, e['operator'], \n // tslint:disable-next-line:no-string-literal\n e['ignoreCase'], e['ignoreAccent']); });\n }\n if (dm.aggregates) {\n dm.aggregates.filter(function (e) { return query.aggregate(e.type, e.field); });\n }\n if (dm.sorted) {\n dm.sorted.filter(function (e) { return query.sortBy(e.name, e.direction); });\n }\n if (dm.skip) {\n query.skip(dm.skip);\n }\n if (dm.take) {\n query.take(dm.take);\n }\n if (dm.group) {\n dm.group.filter(function (grp) { return query.group(grp); });\n }\n return query;\n };\n DataUtil.getPredicate = function (pred) {\n var mainPred = [];\n for (var i = 0; i < pred.length; i++) {\n var e = pred[i];\n if (e.field) {\n mainPred.push(new Predicate(e.field, e.operator, e.value, e.ignoreCase, e.ignoreAccent));\n }\n else {\n var childPred = [];\n // tslint:disable-next-line:typedef\n var cpre = this.getPredicate(e.predicates);\n for (var _i = 0, _a = Object.keys(cpre); _i < _a.length; _i++) {\n var prop = _a[_i];\n childPred.push(cpre[prop]);\n }\n mainPred.push(e.condition === 'or' ? Predicate.or(childPred) : Predicate.and(childPred));\n }\n }\n return mainPred;\n };\n /**\n * Specifies the value which will be used to adjust the date value to server timezone.\n *\n * @default null\n */\n DataUtil.serverTimezoneOffset = null;\n /**\n * Species whether are not to be parsed with serverTimezoneOffset value.\n *\n * @hidden\n */\n DataUtil.timeZoneHandling = true;\n /**\n * Throw error with the given string as message.\n *\n * @param {string} er\n * @param error\n */\n DataUtil.throwError = function (error) {\n try {\n throw new Error(error);\n }\n catch (e) {\n // eslint-disable-next-line no-throw-literal\n throw e.message + '\\n' + e.stack;\n }\n };\n DataUtil.aggregates = {\n /**\n * Calculate sum of the given field in the data.\n *\n * @param {Object[]} ds\n * @param {string} field\n */\n sum: function (ds, field) {\n var result = 0;\n var val;\n var castRequired = typeof DataUtil.getVal(ds, 0, field) !== 'number';\n for (var i = 0; i < ds.length; i++) {\n val = DataUtil.getVal(ds, i, field);\n if (!isNaN(val) && val !== null) {\n if (castRequired) {\n val = +val;\n }\n result += val;\n }\n }\n return result;\n },\n /**\n * Calculate average value of the given field in the data.\n *\n * @param {Object[]} ds\n * @param {string} field\n */\n average: function (ds, field) {\n return DataUtil.aggregates.sum(ds, field) / ds.length;\n },\n /**\n * Returns the min value of the data based on the field.\n *\n * @param {Object[]} ds\n * @param {string|Function} field\n */\n min: function (ds, field) {\n var comparer;\n if (typeof field === 'function') {\n comparer = field;\n field = null;\n }\n return DataUtil.getObject(field, DataUtil.getItemFromComparer(ds, field, comparer || DataUtil.fnAscending));\n },\n /**\n * Returns the max value of the data based on the field.\n *\n * @param {Object[]} ds\n * @param {string} field\n * @returns number\n */\n max: function (ds, field) {\n var comparer;\n if (typeof field === 'function') {\n comparer = field;\n field = null;\n }\n return DataUtil.getObject(field, DataUtil.getItemFromComparer(ds, field, comparer || DataUtil.fnDescending));\n },\n /**\n * Returns the total number of true value present in the data based on the given boolean field name.\n *\n * @param {Object[]} ds\n * @param {string} field\n */\n truecount: function (ds, field) {\n return new DataManager(ds).executeLocal(new Query().where(field, 'equal', true, true)).length;\n },\n /**\n * Returns the total number of false value present in the data based on the given boolean field name.\n *\n * @param {Object[]} ds\n * @param {string} field\n */\n falsecount: function (ds, field) {\n return new DataManager(ds).executeLocal(new Query().where(field, 'equal', false, true)).length;\n },\n /**\n * Returns the length of the given data.\n *\n * @param {Object[]} ds\n * @param {string} field?\n * @param field\n * @returns number\n */\n count: function (ds, field) {\n return ds.length;\n }\n };\n /**\n * Specifies the Object with filter operators.\n */\n DataUtil.operatorSymbols = {\n '<': 'lessthan',\n '>': 'greaterthan',\n '<=': 'lessthanorequal',\n '>=': 'greaterthanorequal',\n '==': 'equal',\n '!=': 'notequal',\n '*=': 'contains',\n '$=': 'endswith',\n '^=': 'startswith'\n };\n /**\n * Specifies the Object with filter operators which will be used for OData filter query generation.\n * * It will be used for date/number type filter query.\n */\n DataUtil.odBiOperator = {\n '<': ' lt ',\n '>': ' gt ',\n '<=': ' le ',\n '>=': ' ge ',\n '==': ' eq ',\n '!=': ' ne ',\n 'lessthan': ' lt ',\n 'lessthanorequal': ' le ',\n 'greaterthan': ' gt ',\n 'greaterthanorequal': ' ge ',\n 'equal': ' eq ',\n 'notequal': ' ne '\n };\n /**\n * Specifies the Object with filter operators which will be used for OData filter query generation.\n * It will be used for string type filter query.\n */\n DataUtil.odUniOperator = {\n '$=': 'endswith',\n '^=': 'startswith',\n '*=': 'substringof',\n 'endswith': 'endswith',\n 'startswith': 'startswith',\n 'contains': 'substringof',\n 'doesnotendwith': 'not endswith',\n 'doesnotstartwith': 'not startswith',\n 'doesnotcontain': 'not substringof',\n 'wildcard': 'wildcard',\n 'like': 'like'\n };\n /**\n * Specifies the Object with filter operators which will be used for ODataV4 filter query generation.\n * It will be used for string type filter query.\n */\n DataUtil.odv4UniOperator = {\n '$=': 'endswith',\n '^=': 'startswith',\n '*=': 'contains',\n 'endswith': 'endswith',\n 'startswith': 'startswith',\n 'contains': 'contains',\n 'doesnotendwith': 'not endswith',\n 'doesnotstartwith': 'not startswith',\n 'doesnotcontain': 'not contains',\n 'wildcard': 'wildcard',\n 'like': 'like'\n };\n DataUtil.diacritics = {\n '\\u24B6': 'A',\n '\\uFF21': 'A',\n '\\u00C0': 'A',\n '\\u00C1': 'A',\n '\\u00C2': 'A',\n '\\u1EA6': 'A',\n '\\u1EA4': 'A',\n '\\u1EAA': 'A',\n '\\u1EA8': 'A',\n '\\u00C3': 'A',\n '\\u0100': 'A',\n '\\u0102': 'A',\n '\\u1EB0': 'A',\n '\\u1EAE': 'A',\n '\\u1EB4': 'A',\n '\\u1EB2': 'A',\n '\\u0226': 'A',\n '\\u01E0': 'A',\n '\\u00C4': 'A',\n '\\u01DE': 'A',\n '\\u1EA2': 'A',\n '\\u00C5': 'A',\n '\\u01FA': 'A',\n '\\u01CD': 'A',\n '\\u0200': 'A',\n '\\u0202': 'A',\n '\\u1EA0': 'A',\n '\\u1EAC': 'A',\n '\\u1EB6': 'A',\n '\\u1E00': 'A',\n '\\u0104': 'A',\n '\\u023A': 'A',\n '\\u2C6F': 'A',\n '\\uA732': 'AA',\n '\\u00C6': 'AE',\n '\\u01FC': 'AE',\n '\\u01E2': 'AE',\n '\\uA734': 'AO',\n '\\uA736': 'AU',\n '\\uA738': 'AV',\n '\\uA73A': 'AV',\n '\\uA73C': 'AY',\n '\\u24B7': 'B',\n '\\uFF22': 'B',\n '\\u1E02': 'B',\n '\\u1E04': 'B',\n '\\u1E06': 'B',\n '\\u0243': 'B',\n '\\u0182': 'B',\n '\\u0181': 'B',\n '\\u24B8': 'C',\n '\\uFF23': 'C',\n '\\u0106': 'C',\n '\\u0108': 'C',\n '\\u010A': 'C',\n '\\u010C': 'C',\n '\\u00C7': 'C',\n '\\u1E08': 'C',\n '\\u0187': 'C',\n '\\u023B': 'C',\n '\\uA73E': 'C',\n '\\u24B9': 'D',\n '\\uFF24': 'D',\n '\\u1E0A': 'D',\n '\\u010E': 'D',\n '\\u1E0C': 'D',\n '\\u1E10': 'D',\n '\\u1E12': 'D',\n '\\u1E0E': 'D',\n '\\u0110': 'D',\n '\\u018B': 'D',\n '\\u018A': 'D',\n '\\u0189': 'D',\n '\\uA779': 'D',\n '\\u01F1': 'DZ',\n '\\u01C4': 'DZ',\n '\\u01F2': 'Dz',\n '\\u01C5': 'Dz',\n '\\u24BA': 'E',\n '\\uFF25': 'E',\n '\\u00C8': 'E',\n '\\u00C9': 'E',\n '\\u00CA': 'E',\n '\\u1EC0': 'E',\n '\\u1EBE': 'E',\n '\\u1EC4': 'E',\n '\\u1EC2': 'E',\n '\\u1EBC': 'E',\n '\\u0112': 'E',\n '\\u1E14': 'E',\n '\\u1E16': 'E',\n '\\u0114': 'E',\n '\\u0116': 'E',\n '\\u00CB': 'E',\n '\\u1EBA': 'E',\n '\\u011A': 'E',\n '\\u0204': 'E',\n '\\u0206': 'E',\n '\\u1EB8': 'E',\n '\\u1EC6': 'E',\n '\\u0228': 'E',\n '\\u1E1C': 'E',\n '\\u0118': 'E',\n '\\u1E18': 'E',\n '\\u1E1A': 'E',\n '\\u0190': 'E',\n '\\u018E': 'E',\n '\\u24BB': 'F',\n '\\uFF26': 'F',\n '\\u1E1E': 'F',\n '\\u0191': 'F',\n '\\uA77B': 'F',\n '\\u24BC': 'G',\n '\\uFF27': 'G',\n '\\u01F4': 'G',\n '\\u011C': 'G',\n '\\u1E20': 'G',\n '\\u011E': 'G',\n '\\u0120': 'G',\n '\\u01E6': 'G',\n '\\u0122': 'G',\n '\\u01E4': 'G',\n '\\u0193': 'G',\n '\\uA7A0': 'G',\n '\\uA77D': 'G',\n '\\uA77E': 'G',\n '\\u24BD': 'H',\n '\\uFF28': 'H',\n '\\u0124': 'H',\n '\\u1E22': 'H',\n '\\u1E26': 'H',\n '\\u021E': 'H',\n '\\u1E24': 'H',\n '\\u1E28': 'H',\n '\\u1E2A': 'H',\n '\\u0126': 'H',\n '\\u2C67': 'H',\n '\\u2C75': 'H',\n '\\uA78D': 'H',\n '\\u24BE': 'I',\n '\\uFF29': 'I',\n '\\u00CC': 'I',\n '\\u00CD': 'I',\n '\\u00CE': 'I',\n '\\u0128': 'I',\n '\\u012A': 'I',\n '\\u012C': 'I',\n '\\u0130': 'I',\n '\\u00CF': 'I',\n '\\u1E2E': 'I',\n '\\u1EC8': 'I',\n '\\u01CF': 'I',\n '\\u0208': 'I',\n '\\u020A': 'I',\n '\\u1ECA': 'I',\n '\\u012E': 'I',\n '\\u1E2C': 'I',\n '\\u0197': 'I',\n '\\u24BF': 'J',\n '\\uFF2A': 'J',\n '\\u0134': 'J',\n '\\u0248': 'J',\n '\\u24C0': 'K',\n '\\uFF2B': 'K',\n '\\u1E30': 'K',\n '\\u01E8': 'K',\n '\\u1E32': 'K',\n '\\u0136': 'K',\n '\\u1E34': 'K',\n '\\u0198': 'K',\n '\\u2C69': 'K',\n '\\uA740': 'K',\n '\\uA742': 'K',\n '\\uA744': 'K',\n '\\uA7A2': 'K',\n '\\u24C1': 'L',\n '\\uFF2C': 'L',\n '\\u013F': 'L',\n '\\u0139': 'L',\n '\\u013D': 'L',\n '\\u1E36': 'L',\n '\\u1E38': 'L',\n '\\u013B': 'L',\n '\\u1E3C': 'L',\n '\\u1E3A': 'L',\n '\\u0141': 'L',\n '\\u023D': 'L',\n '\\u2C62': 'L',\n '\\u2C60': 'L',\n '\\uA748': 'L',\n '\\uA746': 'L',\n '\\uA780': 'L',\n '\\u01C7': 'LJ',\n '\\u01C8': 'Lj',\n '\\u24C2': 'M',\n '\\uFF2D': 'M',\n '\\u1E3E': 'M',\n '\\u1E40': 'M',\n '\\u1E42': 'M',\n '\\u2C6E': 'M',\n '\\u019C': 'M',\n '\\u24C3': 'N',\n '\\uFF2E': 'N',\n '\\u01F8': 'N',\n '\\u0143': 'N',\n '\\u00D1': 'N',\n '\\u1E44': 'N',\n '\\u0147': 'N',\n '\\u1E46': 'N',\n '\\u0145': 'N',\n '\\u1E4A': 'N',\n '\\u1E48': 'N',\n '\\u0220': 'N',\n '\\u019D': 'N',\n '\\uA790': 'N',\n '\\uA7A4': 'N',\n '\\u01CA': 'NJ',\n '\\u01CB': 'Nj',\n '\\u24C4': 'O',\n '\\uFF2F': 'O',\n '\\u00D2': 'O',\n '\\u00D3': 'O',\n '\\u00D4': 'O',\n '\\u1ED2': 'O',\n '\\u1ED0': 'O',\n '\\u1ED6': 'O',\n '\\u1ED4': 'O',\n '\\u00D5': 'O',\n '\\u1E4C': 'O',\n '\\u022C': 'O',\n '\\u1E4E': 'O',\n '\\u014C': 'O',\n '\\u1E50': 'O',\n '\\u1E52': 'O',\n '\\u014E': 'O',\n '\\u022E': 'O',\n '\\u0230': 'O',\n '\\u00D6': 'O',\n '\\u022A': 'O',\n '\\u1ECE': 'O',\n '\\u0150': 'O',\n '\\u01D1': 'O',\n '\\u020C': 'O',\n '\\u020E': 'O',\n '\\u01A0': 'O',\n '\\u1EDC': 'O',\n '\\u1EDA': 'O',\n '\\u1EE0': 'O',\n '\\u1EDE': 'O',\n '\\u1EE2': 'O',\n '\\u1ECC': 'O',\n '\\u1ED8': 'O',\n '\\u01EA': 'O',\n '\\u01EC': 'O',\n '\\u00D8': 'O',\n '\\u01FE': 'O',\n '\\u0186': 'O',\n '\\u019F': 'O',\n '\\uA74A': 'O',\n '\\uA74C': 'O',\n '\\u01A2': 'OI',\n '\\uA74E': 'OO',\n '\\u0222': 'OU',\n '\\u24C5': 'P',\n '\\uFF30': 'P',\n '\\u1E54': 'P',\n '\\u1E56': 'P',\n '\\u01A4': 'P',\n '\\u2C63': 'P',\n '\\uA750': 'P',\n '\\uA752': 'P',\n '\\uA754': 'P',\n '\\u24C6': 'Q',\n '\\uFF31': 'Q',\n '\\uA756': 'Q',\n '\\uA758': 'Q',\n '\\u024A': 'Q',\n '\\u24C7': 'R',\n '\\uFF32': 'R',\n '\\u0154': 'R',\n '\\u1E58': 'R',\n '\\u0158': 'R',\n '\\u0210': 'R',\n '\\u0212': 'R',\n '\\u1E5A': 'R',\n '\\u1E5C': 'R',\n '\\u0156': 'R',\n '\\u1E5E': 'R',\n '\\u024C': 'R',\n '\\u2C64': 'R',\n '\\uA75A': 'R',\n '\\uA7A6': 'R',\n '\\uA782': 'R',\n '\\u24C8': 'S',\n '\\uFF33': 'S',\n '\\u1E9E': 'S',\n '\\u015A': 'S',\n '\\u1E64': 'S',\n '\\u015C': 'S',\n '\\u1E60': 'S',\n '\\u0160': 'S',\n '\\u1E66': 'S',\n '\\u1E62': 'S',\n '\\u1E68': 'S',\n '\\u0218': 'S',\n '\\u015E': 'S',\n '\\u2C7E': 'S',\n '\\uA7A8': 'S',\n '\\uA784': 'S',\n '\\u24C9': 'T',\n '\\uFF34': 'T',\n '\\u1E6A': 'T',\n '\\u0164': 'T',\n '\\u1E6C': 'T',\n '\\u021A': 'T',\n '\\u0162': 'T',\n '\\u1E70': 'T',\n '\\u1E6E': 'T',\n '\\u0166': 'T',\n '\\u01AC': 'T',\n '\\u01AE': 'T',\n '\\u023E': 'T',\n '\\uA786': 'T',\n '\\uA728': 'TZ',\n '\\u24CA': 'U',\n '\\uFF35': 'U',\n '\\u00D9': 'U',\n '\\u00DA': 'U',\n '\\u00DB': 'U',\n '\\u0168': 'U',\n '\\u1E78': 'U',\n '\\u016A': 'U',\n '\\u1E7A': 'U',\n '\\u016C': 'U',\n '\\u00DC': 'U',\n '\\u01DB': 'U',\n '\\u01D7': 'U',\n '\\u01D5': 'U',\n '\\u01D9': 'U',\n '\\u1EE6': 'U',\n '\\u016E': 'U',\n '\\u0170': 'U',\n '\\u01D3': 'U',\n '\\u0214': 'U',\n '\\u0216': 'U',\n '\\u01AF': 'U',\n '\\u1EEA': 'U',\n '\\u1EE8': 'U',\n '\\u1EEE': 'U',\n '\\u1EEC': 'U',\n '\\u1EF0': 'U',\n '\\u1EE4': 'U',\n '\\u1E72': 'U',\n '\\u0172': 'U',\n '\\u1E76': 'U',\n '\\u1E74': 'U',\n '\\u0244': 'U',\n '\\u24CB': 'V',\n '\\uFF36': 'V',\n '\\u1E7C': 'V',\n '\\u1E7E': 'V',\n '\\u01B2': 'V',\n '\\uA75E': 'V',\n '\\u0245': 'V',\n '\\uA760': 'VY',\n '\\u24CC': 'W',\n '\\uFF37': 'W',\n '\\u1E80': 'W',\n '\\u1E82': 'W',\n '\\u0174': 'W',\n '\\u1E86': 'W',\n '\\u1E84': 'W',\n '\\u1E88': 'W',\n '\\u2C72': 'W',\n '\\u24CD': 'X',\n '\\uFF38': 'X',\n '\\u1E8A': 'X',\n '\\u1E8C': 'X',\n '\\u24CE': 'Y',\n '\\uFF39': 'Y',\n '\\u1EF2': 'Y',\n '\\u00DD': 'Y',\n '\\u0176': 'Y',\n '\\u1EF8': 'Y',\n '\\u0232': 'Y',\n '\\u1E8E': 'Y',\n '\\u0178': 'Y',\n '\\u1EF6': 'Y',\n '\\u1EF4': 'Y',\n '\\u01B3': 'Y',\n '\\u024E': 'Y',\n '\\u1EFE': 'Y',\n '\\u24CF': 'Z',\n '\\uFF3A': 'Z',\n '\\u0179': 'Z',\n '\\u1E90': 'Z',\n '\\u017B': 'Z',\n '\\u017D': 'Z',\n '\\u1E92': 'Z',\n '\\u1E94': 'Z',\n '\\u01B5': 'Z',\n '\\u0224': 'Z',\n '\\u2C7F': 'Z',\n '\\u2C6B': 'Z',\n '\\uA762': 'Z',\n '\\u24D0': 'a',\n '\\uFF41': 'a',\n '\\u1E9A': 'a',\n '\\u00E0': 'a',\n '\\u00E1': 'a',\n '\\u00E2': 'a',\n '\\u1EA7': 'a',\n '\\u1EA5': 'a',\n '\\u1EAB': 'a',\n '\\u1EA9': 'a',\n '\\u00E3': 'a',\n '\\u0101': 'a',\n '\\u0103': 'a',\n '\\u1EB1': 'a',\n '\\u1EAF': 'a',\n '\\u1EB5': 'a',\n '\\u1EB3': 'a',\n '\\u0227': 'a',\n '\\u01E1': 'a',\n '\\u00E4': 'a',\n '\\u01DF': 'a',\n '\\u1EA3': 'a',\n '\\u00E5': 'a',\n '\\u01FB': 'a',\n '\\u01CE': 'a',\n '\\u0201': 'a',\n '\\u0203': 'a',\n '\\u1EA1': 'a',\n '\\u1EAD': 'a',\n '\\u1EB7': 'a',\n '\\u1E01': 'a',\n '\\u0105': 'a',\n '\\u2C65': 'a',\n '\\u0250': 'a',\n '\\uA733': 'aa',\n '\\u00E6': 'ae',\n '\\u01FD': 'ae',\n '\\u01E3': 'ae',\n '\\uA735': 'ao',\n '\\uA737': 'au',\n '\\uA739': 'av',\n '\\uA73B': 'av',\n '\\uA73D': 'ay',\n '\\u24D1': 'b',\n '\\uFF42': 'b',\n '\\u1E03': 'b',\n '\\u1E05': 'b',\n '\\u1E07': 'b',\n '\\u0180': 'b',\n '\\u0183': 'b',\n '\\u0253': 'b',\n '\\u24D2': 'c',\n '\\uFF43': 'c',\n '\\u0107': 'c',\n '\\u0109': 'c',\n '\\u010B': 'c',\n '\\u010D': 'c',\n '\\u00E7': 'c',\n '\\u1E09': 'c',\n '\\u0188': 'c',\n '\\u023C': 'c',\n '\\uA73F': 'c',\n '\\u2184': 'c',\n '\\u24D3': 'd',\n '\\uFF44': 'd',\n '\\u1E0B': 'd',\n '\\u010F': 'd',\n '\\u1E0D': 'd',\n '\\u1E11': 'd',\n '\\u1E13': 'd',\n '\\u1E0F': 'd',\n '\\u0111': 'd',\n '\\u018C': 'd',\n '\\u0256': 'd',\n '\\u0257': 'd',\n '\\uA77A': 'd',\n '\\u01F3': 'dz',\n '\\u01C6': 'dz',\n '\\u24D4': 'e',\n '\\uFF45': 'e',\n '\\u00E8': 'e',\n '\\u00E9': 'e',\n '\\u00EA': 'e',\n '\\u1EC1': 'e',\n '\\u1EBF': 'e',\n '\\u1EC5': 'e',\n '\\u1EC3': 'e',\n '\\u1EBD': 'e',\n '\\u0113': 'e',\n '\\u1E15': 'e',\n '\\u1E17': 'e',\n '\\u0115': 'e',\n '\\u0117': 'e',\n '\\u00EB': 'e',\n '\\u1EBB': 'e',\n '\\u011B': 'e',\n '\\u0205': 'e',\n '\\u0207': 'e',\n '\\u1EB9': 'e',\n '\\u1EC7': 'e',\n '\\u0229': 'e',\n '\\u1E1D': 'e',\n '\\u0119': 'e',\n '\\u1E19': 'e',\n '\\u1E1B': 'e',\n '\\u0247': 'e',\n '\\u025B': 'e',\n '\\u01DD': 'e',\n '\\u24D5': 'f',\n '\\uFF46': 'f',\n '\\u1E1F': 'f',\n '\\u0192': 'f',\n '\\uA77C': 'f',\n '\\u24D6': 'g',\n '\\uFF47': 'g',\n '\\u01F5': 'g',\n '\\u011D': 'g',\n '\\u1E21': 'g',\n '\\u011F': 'g',\n '\\u0121': 'g',\n '\\u01E7': 'g',\n '\\u0123': 'g',\n '\\u01E5': 'g',\n '\\u0260': 'g',\n '\\uA7A1': 'g',\n '\\u1D79': 'g',\n '\\uA77F': 'g',\n '\\u24D7': 'h',\n '\\uFF48': 'h',\n '\\u0125': 'h',\n '\\u1E23': 'h',\n '\\u1E27': 'h',\n '\\u021F': 'h',\n '\\u1E25': 'h',\n '\\u1E29': 'h',\n '\\u1E2B': 'h',\n '\\u1E96': 'h',\n '\\u0127': 'h',\n '\\u2C68': 'h',\n '\\u2C76': 'h',\n '\\u0265': 'h',\n '\\u0195': 'hv',\n '\\u24D8': 'i',\n '\\uFF49': 'i',\n '\\u00EC': 'i',\n '\\u00ED': 'i',\n '\\u00EE': 'i',\n '\\u0129': 'i',\n '\\u012B': 'i',\n '\\u012D': 'i',\n '\\u00EF': 'i',\n '\\u1E2F': 'i',\n '\\u1EC9': 'i',\n '\\u01D0': 'i',\n '\\u0209': 'i',\n '\\u020B': 'i',\n '\\u1ECB': 'i',\n '\\u012F': 'i',\n '\\u1E2D': 'i',\n '\\u0268': 'i',\n '\\u0131': 'i',\n '\\u24D9': 'j',\n '\\uFF4A': 'j',\n '\\u0135': 'j',\n '\\u01F0': 'j',\n '\\u0249': 'j',\n '\\u24DA': 'k',\n '\\uFF4B': 'k',\n '\\u1E31': 'k',\n '\\u01E9': 'k',\n '\\u1E33': 'k',\n '\\u0137': 'k',\n '\\u1E35': 'k',\n '\\u0199': 'k',\n '\\u2C6A': 'k',\n '\\uA741': 'k',\n '\\uA743': 'k',\n '\\uA745': 'k',\n '\\uA7A3': 'k',\n '\\u24DB': 'l',\n '\\uFF4C': 'l',\n '\\u0140': 'l',\n '\\u013A': 'l',\n '\\u013E': 'l',\n '\\u1E37': 'l',\n '\\u1E39': 'l',\n '\\u013C': 'l',\n '\\u1E3D': 'l',\n '\\u1E3B': 'l',\n '\\u017F': 'l',\n '\\u0142': 'l',\n '\\u019A': 'l',\n '\\u026B': 'l',\n '\\u2C61': 'l',\n '\\uA749': 'l',\n '\\uA781': 'l',\n '\\uA747': 'l',\n '\\u01C9': 'lj',\n '\\u24DC': 'm',\n '\\uFF4D': 'm',\n '\\u1E3F': 'm',\n '\\u1E41': 'm',\n '\\u1E43': 'm',\n '\\u0271': 'm',\n '\\u026F': 'm',\n '\\u24DD': 'n',\n '\\uFF4E': 'n',\n '\\u01F9': 'n',\n '\\u0144': 'n',\n '\\u00F1': 'n',\n '\\u1E45': 'n',\n '\\u0148': 'n',\n '\\u1E47': 'n',\n '\\u0146': 'n',\n '\\u1E4B': 'n',\n '\\u1E49': 'n',\n '\\u019E': 'n',\n '\\u0272': 'n',\n '\\u0149': 'n',\n '\\uA791': 'n',\n '\\uA7A5': 'n',\n '\\u01CC': 'nj',\n '\\u24DE': 'o',\n '\\uFF4F': 'o',\n '\\u00F2': 'o',\n '\\u00F3': 'o',\n '\\u00F4': 'o',\n '\\u1ED3': 'o',\n '\\u1ED1': 'o',\n '\\u1ED7': 'o',\n '\\u1ED5': 'o',\n '\\u00F5': 'o',\n '\\u1E4D': 'o',\n '\\u022D': 'o',\n '\\u1E4F': 'o',\n '\\u014D': 'o',\n '\\u1E51': 'o',\n '\\u1E53': 'o',\n '\\u014F': 'o',\n '\\u022F': 'o',\n '\\u0231': 'o',\n '\\u00F6': 'o',\n '\\u022B': 'o',\n '\\u1ECF': 'o',\n '\\u0151': 'o',\n '\\u01D2': 'o',\n '\\u020D': 'o',\n '\\u020F': 'o',\n '\\u01A1': 'o',\n '\\u1EDD': 'o',\n '\\u1EDB': 'o',\n '\\u1EE1': 'o',\n '\\u1EDF': 'o',\n '\\u1EE3': 'o',\n '\\u1ECD': 'o',\n '\\u1ED9': 'o',\n '\\u01EB': 'o',\n '\\u01ED': 'o',\n '\\u00F8': 'o',\n '\\u01FF': 'o',\n '\\u0254': 'o',\n '\\uA74B': 'o',\n '\\uA74D': 'o',\n '\\u0275': 'o',\n '\\u01A3': 'oi',\n '\\u0223': 'ou',\n '\\uA74F': 'oo',\n '\\u24DF': 'p',\n '\\uFF50': 'p',\n '\\u1E55': 'p',\n '\\u1E57': 'p',\n '\\u01A5': 'p',\n '\\u1D7D': 'p',\n '\\uA751': 'p',\n '\\uA753': 'p',\n '\\uA755': 'p',\n '\\u24E0': 'q',\n '\\uFF51': 'q',\n '\\u024B': 'q',\n '\\uA757': 'q',\n '\\uA759': 'q',\n '\\u24E1': 'r',\n '\\uFF52': 'r',\n '\\u0155': 'r',\n '\\u1E59': 'r',\n '\\u0159': 'r',\n '\\u0211': 'r',\n '\\u0213': 'r',\n '\\u1E5B': 'r',\n '\\u1E5D': 'r',\n '\\u0157': 'r',\n '\\u1E5F': 'r',\n '\\u024D': 'r',\n '\\u027D': 'r',\n '\\uA75B': 'r',\n '\\uA7A7': 'r',\n '\\uA783': 'r',\n '\\u24E2': 's',\n '\\uFF53': 's',\n '\\u00DF': 's',\n '\\u015B': 's',\n '\\u1E65': 's',\n '\\u015D': 's',\n '\\u1E61': 's',\n '\\u0161': 's',\n '\\u1E67': 's',\n '\\u1E63': 's',\n '\\u1E69': 's',\n '\\u0219': 's',\n '\\u015F': 's',\n '\\u023F': 's',\n '\\uA7A9': 's',\n '\\uA785': 's',\n '\\u1E9B': 's',\n '\\u24E3': 't',\n '\\uFF54': 't',\n '\\u1E6B': 't',\n '\\u1E97': 't',\n '\\u0165': 't',\n '\\u1E6D': 't',\n '\\u021B': 't',\n '\\u0163': 't',\n '\\u1E71': 't',\n '\\u1E6F': 't',\n '\\u0167': 't',\n '\\u01AD': 't',\n '\\u0288': 't',\n '\\u2C66': 't',\n '\\uA787': 't',\n '\\uA729': 'tz',\n '\\u24E4': 'u',\n '\\uFF55': 'u',\n '\\u00F9': 'u',\n '\\u00FA': 'u',\n '\\u00FB': 'u',\n '\\u0169': 'u',\n '\\u1E79': 'u',\n '\\u016B': 'u',\n '\\u1E7B': 'u',\n '\\u016D': 'u',\n '\\u00FC': 'u',\n '\\u01DC': 'u',\n '\\u01D8': 'u',\n '\\u01D6': 'u',\n '\\u01DA': 'u',\n '\\u1EE7': 'u',\n '\\u016F': 'u',\n '\\u0171': 'u',\n '\\u01D4': 'u',\n '\\u0215': 'u',\n '\\u0217': 'u',\n '\\u01B0': 'u',\n '\\u1EEB': 'u',\n '\\u1EE9': 'u',\n '\\u1EEF': 'u',\n '\\u1EED': 'u',\n '\\u1EF1': 'u',\n '\\u1EE5': 'u',\n '\\u1E73': 'u',\n '\\u0173': 'u',\n '\\u1E77': 'u',\n '\\u1E75': 'u',\n '\\u0289': 'u',\n '\\u24E5': 'v',\n '\\uFF56': 'v',\n '\\u1E7D': 'v',\n '\\u1E7F': 'v',\n '\\u028B': 'v',\n '\\uA75F': 'v',\n '\\u028C': 'v',\n '\\uA761': 'vy',\n '\\u24E6': 'w',\n '\\uFF57': 'w',\n '\\u1E81': 'w',\n '\\u1E83': 'w',\n '\\u0175': 'w',\n '\\u1E87': 'w',\n '\\u1E85': 'w',\n '\\u1E98': 'w',\n '\\u1E89': 'w',\n '\\u2C73': 'w',\n '\\u24E7': 'x',\n '\\uFF58': 'x',\n '\\u1E8B': 'x',\n '\\u1E8D': 'x',\n '\\u24E8': 'y',\n '\\uFF59': 'y',\n '\\u1EF3': 'y',\n '\\u00FD': 'y',\n '\\u0177': 'y',\n '\\u1EF9': 'y',\n '\\u0233': 'y',\n '\\u1E8F': 'y',\n '\\u00FF': 'y',\n '\\u1EF7': 'y',\n '\\u1E99': 'y',\n '\\u1EF5': 'y',\n '\\u01B4': 'y',\n '\\u024F': 'y',\n '\\u1EFF': 'y',\n '\\u24E9': 'z',\n '\\uFF5A': 'z',\n '\\u017A': 'z',\n '\\u1E91': 'z',\n '\\u017C': 'z',\n '\\u017E': 'z',\n '\\u1E93': 'z',\n '\\u1E95': 'z',\n '\\u01B6': 'z',\n '\\u0225': 'z',\n '\\u0240': 'z',\n '\\u2C6C': 'z',\n '\\uA763': 'z',\n '\\u0386': '\\u0391',\n '\\u0388': '\\u0395',\n '\\u0389': '\\u0397',\n '\\u038A': '\\u0399',\n '\\u03AA': '\\u0399',\n '\\u038C': '\\u039F',\n '\\u038E': '\\u03A5',\n '\\u03AB': '\\u03A5',\n '\\u038F': '\\u03A9',\n '\\u03AC': '\\u03B1',\n '\\u03AD': '\\u03B5',\n '\\u03AE': '\\u03B7',\n '\\u03AF': '\\u03B9',\n '\\u03CA': '\\u03B9',\n '\\u0390': '\\u03B9',\n '\\u03CC': '\\u03BF',\n '\\u03CD': '\\u03C5',\n '\\u03CB': '\\u03C5',\n '\\u03B0': '\\u03C5',\n '\\u03C9': '\\u03C9',\n '\\u03C2': '\\u03C3'\n };\n DataUtil.fnOperators = {\n /**\n * Returns true when the actual input is equal to the given input.\n *\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n * @param {boolean} ignoreAccent?\n * @param ignoreCase\n * @param ignoreAccent\n */\n equal: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) === DataUtil.toLowerCase(expected);\n }\n return actual === expected;\n },\n /**\n * Returns true when the actual input is not equal to the given input.\n *\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n * @param ignoreAccent\n */\n notequal: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n return !DataUtil.fnOperators.equal(actual, expected, ignoreCase);\n },\n /**\n * Returns true when the actual input is less than to the given input.\n *\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n */\n lessthan: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) < DataUtil.toLowerCase(expected);\n }\n if (isNullOrUndefined(actual)) {\n actual = undefined;\n }\n return actual < expected;\n },\n /**\n * Returns true when the actual input is greater than to the given input.\n *\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n */\n greaterthan: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) > DataUtil.toLowerCase(expected);\n }\n return actual > expected;\n },\n /**\n * Returns true when the actual input is less than or equal to the given input.\n *\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n */\n lessthanorequal: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) <= DataUtil.toLowerCase(expected);\n }\n if (isNullOrUndefined(actual)) {\n actual = undefined;\n }\n return actual <= expected;\n },\n /**\n * Returns true when the actual input is greater than or equal to the given input.\n *\n * @param {string|number|boolean} actual\n * @param {string|number|boolean} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n */\n greaterthanorequal: function (actual, expected, ignoreCase) {\n if (ignoreCase) {\n return DataUtil.toLowerCase(actual) >= DataUtil.toLowerCase(expected);\n }\n return actual >= expected;\n },\n /**\n * Returns true when the actual input contains the given string.\n *\n * @param {string|number} actual\n * @param {string|number} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n * @param ignoreAccent\n */\n contains: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return !isNullOrUndefined(actual) && !isNullOrUndefined(expected) &&\n DataUtil.toLowerCase(actual).indexOf(DataUtil.toLowerCase(expected)) !== -1;\n }\n return !isNullOrUndefined(actual) && !isNullOrUndefined(expected) &&\n actual.toString().indexOf(expected) !== -1;\n },\n /**\n * Returns true when the actual input not contains the given string.\n *\n * @param {string|number} actual\n * @param {string|number} expected\n * @param {boolean} ignoreCase?\n */\n doesnotcontain: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return !isNullOrUndefined(actual) && !isNullOrUndefined(expected) &&\n DataUtil.toLowerCase(actual).indexOf(DataUtil.toLowerCase(expected)) === -1;\n }\n return !isNullOrUndefined(actual) && !isNullOrUndefined(expected) &&\n actual.toString().indexOf(expected) === -1;\n },\n /**\n * Returns true when the given input value is not null.\n *\n * @param {string|number} actual\n * @returns boolean\n */\n isnotnull: function (actual) {\n return actual !== null && actual !== undefined;\n },\n /**\n * Returns true when the given input value is null.\n *\n * @param {string|number} actual\n * @returns boolean\n */\n isnull: function (actual) {\n return actual === null || actual === undefined;\n },\n /**\n * Returns true when the actual input starts with the given string\n *\n * @param {string} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n * @param ignoreAccent\n */\n startswith: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return actual && expected && DataUtil.startsWith(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return actual && expected && DataUtil.startsWith(actual, expected);\n },\n /**\n * Returns true when the actual input not starts with the given string\n *\n * @param {string} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n */\n doesnotstartwith: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return actual && expected && DataUtil.notStartsWith(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return actual && expected && DataUtil.notStartsWith(actual, expected);\n },\n /**\n * Returns true when the actual input like with the given string.\n *\n * @param {string} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n */\n like: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return actual && expected && DataUtil.like(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return actual && expected && DataUtil.like(actual, expected);\n },\n /**\n * Returns true when the given input value is empty.\n *\n * @param {string|number} actual\n * @returns boolean\n */\n isempty: function (actual) {\n return actual === undefined || actual === '';\n },\n /**\n * Returns true when the given input value is not empty.\n *\n * @param {string|number} actual\n * @returns boolean\n */\n isnotempty: function (actual) {\n return actual !== undefined && actual !== '';\n },\n /**\n * Returns true when the actual input pattern(wildcard) matches with the given string.\n *\n * @param {string|Date} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n */\n wildcard: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return (actual || typeof actual === 'boolean') && expected && typeof actual !== 'object' &&\n DataUtil.wildCard(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return (actual || typeof actual === 'boolean') && expected && DataUtil.wildCard(actual, expected);\n },\n /**\n * Returns true when the actual input ends with the given string.\n *\n * @param {string} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n * @param ignoreCase\n * @param ignoreAccent\n */\n endswith: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return actual && expected && DataUtil.endsWith(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return actual && expected && DataUtil.endsWith(actual, expected);\n },\n /**\n * Returns true when the actual input not ends with the given string.\n *\n * @param {string} actual\n * @param {string} expected\n * @param {boolean} ignoreCase?\n */\n doesnotendwith: function (actual, expected, ignoreCase, ignoreAccent) {\n if (ignoreAccent) {\n actual = DataUtil.ignoreDiacritics(actual);\n expected = DataUtil.ignoreDiacritics(expected);\n }\n if (ignoreCase) {\n return actual && expected && DataUtil.notEndsWith(DataUtil.toLowerCase(actual), DataUtil.toLowerCase(expected));\n }\n return actual && expected && DataUtil.notEndsWith(actual, expected);\n },\n /**\n * It will return the filter operator based on the filter symbol.\n *\n * @param {string} operator\n * @hidden\n */\n processSymbols: function (operator) {\n var fnName = DataUtil.operatorSymbols[operator];\n if (fnName) {\n var fn = DataUtil.fnOperators[fnName];\n return fn;\n }\n return DataUtil.throwError('Query - Process Operator : Invalid operator');\n },\n /**\n * It will return the valid filter operator based on the specified operators.\n *\n * @param {string} operator\n * @hidden\n */\n processOperator: function (operator) {\n var fn = DataUtil.fnOperators[operator];\n if (fn) {\n return fn;\n }\n return DataUtil.fnOperators.processSymbols(operator);\n }\n };\n /**\n * To perform the parse operation on JSON data, like convert to string from JSON or convert to JSON from string.\n */\n DataUtil.parse = {\n /**\n * Parse the given string to the plain JavaScript object.\n *\n * @param {string|Object|Object[]} jsonText\n */\n parseJson: function (jsonText) {\n if (typeof jsonText === 'string' && (/^[\\s]*\\[|^[\\s]*\\{(.)+:/g.test(jsonText) || jsonText.indexOf('\"') === -1)) {\n jsonText = JSON.parse(jsonText, DataUtil.parse.jsonReviver);\n }\n else if (jsonText instanceof Array) {\n DataUtil.parse.iterateAndReviveArray(jsonText);\n }\n else if (typeof jsonText === 'object' && jsonText !== null) {\n DataUtil.parse.iterateAndReviveJson(jsonText);\n }\n return jsonText;\n },\n /**\n * It will perform on array of values.\n *\n * @param {string[]|Object[]} array\n * @hidden\n */\n iterateAndReviveArray: function (array) {\n for (var i = 0; i < array.length; i++) {\n if (typeof array[i] === 'object' && array[i] !== null) {\n DataUtil.parse.iterateAndReviveJson(array[i]);\n // eslint-disable-next-line no-useless-escape\n }\n else if (typeof array[i] === 'string' && (!/^[\\s]*\\[|^[\\s]*\\{(.)+:|\\\"/g.test(array[i]) ||\n array[i].toString().indexOf('\"') === -1)) {\n array[i] = DataUtil.parse.jsonReviver('', array[i]);\n }\n else {\n array[i] = DataUtil.parse.parseJson(array[i]);\n }\n }\n },\n /**\n * It will perform on JSON values\n *\n * @param {JSON} json\n * @hidden\n */\n iterateAndReviveJson: function (json) {\n var value;\n var keys = Object.keys(json);\n for (var _i = 0, keys_2 = keys; _i < keys_2.length; _i++) {\n var prop = keys_2[_i];\n if (DataUtil.startsWith(prop, '__')) {\n continue;\n }\n value = json[prop];\n if (typeof value === 'object') {\n if (value instanceof Array) {\n DataUtil.parse.iterateAndReviveArray(value);\n }\n else if (value) {\n DataUtil.parse.iterateAndReviveJson(value);\n }\n }\n else {\n json[prop] = DataUtil.parse.jsonReviver(json[prop], value);\n }\n }\n },\n /**\n * It will perform on JSON values\n *\n * @param {string} field\n * @param {string|Date} value\n * @hidden\n */\n jsonReviver: function (field, value) {\n if (typeof value === 'string') {\n // eslint-disable-next-line security/detect-unsafe-regex\n var ms = /^\\/Date\\(([+-]?[0-9]+)([+-][0-9]{4})?\\)\\/$/.exec(value);\n var offSet = DataUtil.timeZoneHandling ? DataUtil.serverTimezoneOffset : null;\n if (ms) {\n return DataUtil.dateParse.toTimeZone(new Date(parseInt(ms[1], 10)), offSet, true);\n // eslint-disable-next-line no-useless-escape, security/detect-unsafe-regex\n }\n else if (/^(\\d{4}\\-\\d\\d\\-\\d\\d([tT][\\d:\\.]*){1})([zZ]|([+\\-])(\\d\\d):?(\\d\\d))?$/.test(value)) {\n var isUTC = value.indexOf('Z') > -1 || value.indexOf('z') > -1;\n var arr = value.split(/[^0-9.]/);\n if (isUTC) {\n if (arr[5].indexOf('.') > -1) {\n var secondsMs = arr[5].split('.');\n arr[5] = secondsMs[0];\n arr[6] = new Date(value).getUTCMilliseconds().toString();\n }\n else {\n arr[6] = '00';\n }\n value = DataUtil.dateParse\n .toTimeZone(new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, parseInt(arr[2], 10), parseInt(arr[3], 10), parseInt(arr[4], 10), parseInt(arr[5] ? arr[5] : '00', 10), parseInt(arr[6], 10)), DataUtil.serverTimezoneOffset, false);\n }\n else {\n var utcFormat = new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, parseInt(arr[2], 10), parseInt(arr[3], 10), parseInt(arr[4], 10), parseInt(arr[5] ? arr[5] : '00', 10));\n var hrs = parseInt(arr[6], 10);\n var mins = parseInt(arr[7], 10);\n if (isNaN(hrs) && isNaN(mins)) {\n return utcFormat;\n }\n if (value.indexOf('+') > -1) {\n utcFormat.setHours(utcFormat.getHours() - hrs, utcFormat.getMinutes() - mins);\n }\n else {\n utcFormat.setHours(utcFormat.getHours() + hrs, utcFormat.getMinutes() + mins);\n }\n value = DataUtil.dateParse\n .toTimeZone(utcFormat, DataUtil.serverTimezoneOffset, false);\n }\n if (DataUtil.serverTimezoneOffset == null) {\n value = DataUtil.dateParse.addSelfOffset(value);\n }\n }\n }\n return value;\n },\n /**\n * Check wheather the given value is JSON or not.\n *\n * @param {Object[]} jsonData\n */\n isJson: function (jsonData) {\n if (typeof jsonData[0] === 'string') {\n return jsonData;\n }\n return DataUtil.parse.parseJson(jsonData);\n },\n /**\n * Checks wheather the given value is GUID or not.\n *\n * @param {string} value\n */\n isGuid: function (value) {\n // eslint-disable-next-line security/detect-unsafe-regex\n var regex = /[A-Fa-f0-9]{8}(?:-[A-Fa-f0-9]{4}){3}-[A-Fa-f0-9]{12}/i;\n var match = regex.exec(value);\n return match != null;\n },\n /**\n * The method used to replace the value based on the type.\n *\n * @param {Object} value\n * @param {boolean} stringify\n * @hidden\n */\n replacer: function (value, stringify) {\n if (DataUtil.isPlainObject(value)) {\n return DataUtil.parse.jsonReplacer(value, stringify);\n }\n if (value instanceof Array) {\n return DataUtil.parse.arrayReplacer(value);\n }\n if (value instanceof Date) {\n return DataUtil.parse.jsonReplacer({ val: value }, stringify).val;\n }\n return value;\n },\n /**\n * It will replace the JSON value.\n *\n * @param {string} key\n * @param {Object} val\n * @param stringify\n * @hidden\n */\n jsonReplacer: function (val, stringify) {\n var value;\n var keys = Object.keys(val);\n for (var _i = 0, keys_3 = keys; _i < keys_3.length; _i++) {\n var prop = keys_3[_i];\n value = val[prop];\n if (!(value instanceof Date)) {\n continue;\n }\n var d = value;\n if (DataUtil.serverTimezoneOffset == null) {\n val[prop] = DataUtil.dateParse.toTimeZone(d, null).toJSON();\n }\n else {\n d = new Date(+d + DataUtil.serverTimezoneOffset * 3600000);\n val[prop] = DataUtil.dateParse.toTimeZone(DataUtil.dateParse.addSelfOffset(d), null).toJSON();\n }\n }\n return val;\n },\n /**\n * It will replace the Array of value.\n *\n * @param {string} key\n * @param {Object[]} val\n * @hidden\n */\n arrayReplacer: function (val) {\n for (var i = 0; i < val.length; i++) {\n if (DataUtil.isPlainObject(val[i])) {\n val[i] = DataUtil.parse.jsonReplacer(val[i]);\n }\n else if (val[i] instanceof Date) {\n val[i] = DataUtil.parse.jsonReplacer({ date: val[i] }).date;\n }\n }\n return val;\n },\n /**\n * It will replace the Date object with respective to UTC format value.\n *\n * @param {string} key\n * @param {any} value\n * @hidden\n */\n /* eslint-disable @typescript-eslint/no-explicit-any */\n /* tslint:disable-next-line:no-any */\n jsonDateReplacer: function (key, value) {\n /* eslint-enable @typescript-eslint/no-explicit-any */\n if (key === 'value' && value) {\n if (typeof value === 'string') {\n // eslint-disable-next-line security/detect-unsafe-regex\n var ms = /^\\/Date\\(([+-]?[0-9]+)([+-][0-9]{4})?\\)\\/$/.exec(value);\n if (ms) {\n value = DataUtil.dateParse.toTimeZone(new Date(parseInt(ms[1], 10)), null, true);\n // eslint-disable-next-line no-useless-escape, security/detect-unsafe-regex\n }\n else if (/^(\\d{4}\\-\\d\\d\\-\\d\\d([tT][\\d:\\.]*){1})([zZ]|([+\\-])(\\d\\d):?(\\d\\d))?$/.test(value)) {\n var arr = value.split(/[^0-9]/);\n value = DataUtil.dateParse\n .toTimeZone(new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, parseInt(arr[2], 10), parseInt(arr[3], 10), parseInt(arr[4], 10), parseInt(arr[5], 10)), null, true);\n }\n }\n if (value instanceof Date) {\n value = DataUtil.dateParse.addSelfOffset(value);\n if (DataUtil.serverTimezoneOffset === null) {\n return DataUtil.dateParse.toTimeZone(DataUtil.dateParse.addSelfOffset(value), null).toJSON();\n }\n else {\n value = DataUtil.dateParse.toTimeZone(value, ((value.getTimezoneOffset() / 60)\n - DataUtil.serverTimezoneOffset), false);\n return value.toJSON();\n }\n }\n }\n return value;\n }\n };\n /**\n * @hidden\n */\n DataUtil.dateParse = {\n addSelfOffset: function (input) {\n return new Date(+input - (input.getTimezoneOffset() * 60000));\n },\n toUTC: function (input) {\n return new Date(+input + (input.getTimezoneOffset() * 60000));\n },\n toTimeZone: function (input, offset, utc) {\n if (offset === null) {\n return input;\n }\n var unix = utc ? DataUtil.dateParse.toUTC(input) : input;\n return new Date(+unix - (offset * 3600000));\n },\n toLocalTime: function (input) {\n var datefn = input;\n var timeZone = -datefn.getTimezoneOffset();\n var differenceString = timeZone >= 0 ? '+' : '-';\n var localtimefn = function (num) {\n var norm = Math.floor(Math.abs(num));\n return (norm < 10 ? '0' : '') + norm;\n };\n var val = datefn.getFullYear() + '-' + localtimefn(datefn.getMonth() + 1) + '-' + localtimefn(datefn.getDate()) +\n 'T' + localtimefn(datefn.getHours()) +\n ':' + localtimefn(datefn.getMinutes()) +\n ':' + localtimefn(datefn.getSeconds()) +\n differenceString + localtimefn(timeZone / 60) +\n ':' + localtimefn(timeZone % 60);\n return val;\n }\n };\n return DataUtil;\n}());\nexport { DataUtil };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { merge, extend, isNullOrUndefined, setValue, getValue } from '@syncfusion/ej2-base';\nimport { DataUtil } from './util';\nimport { Query, Predicate } from './query';\nvar consts = { GroupGuid: '{271bbba0-1ee7}' };\n/**\n * Adaptors are specific data source type aware interfaces that are used by DataManager to communicate with DataSource.\n * This is the base adaptor class that other adaptors can extend.\n *\n * @hidden\n */\nvar Adaptor = /** @class */ (function () {\n /**\n * Constructor for Adaptor class\n *\n * @param {DataOptions} ds?\n * @param ds\n * @hidden\n * @returns aggregates\n */\n function Adaptor(ds) {\n // common options for all the adaptors\n this.options = {\n from: 'table',\n requestType: 'json',\n sortBy: 'sorted',\n select: 'select',\n skip: 'skip',\n group: 'group',\n take: 'take',\n search: 'search',\n count: 'requiresCounts',\n where: 'where',\n aggregates: 'aggregates',\n expand: 'expand'\n };\n /**\n * Specifies the type of adaptor.\n *\n * @default Adaptor\n */\n this.type = Adaptor;\n this.dataSource = ds;\n this.pvt = {};\n }\n /**\n * Returns the data from the query processing.\n *\n * @param {Object} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {Request} xhr?\n * @param ds\n * @param query\n * @param xhr\n * @returns Object\n */\n Adaptor.prototype.processResponse = function (data, ds, query, xhr) {\n return data;\n };\n return Adaptor;\n}());\nexport { Adaptor };\n/**\n * JsonAdaptor is used to process JSON data. It contains methods to process the given JSON data based on the queries.\n *\n * @hidden\n */\nvar JsonAdaptor = /** @class */ (function (_super) {\n __extends(JsonAdaptor, _super);\n function JsonAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Process the JSON data based on the provided queries.\n *\n * @param {DataManager} dataManager\n * @param {Query} query\n * @returns Object\n */\n JsonAdaptor.prototype.processQuery = function (dataManager, query) {\n var result = dataManager.dataSource.json.slice(0);\n var count = result.length;\n var countFlg = true;\n var ret;\n var key;\n var lazyLoad = {};\n var keyCount = 0;\n var group = [];\n var page;\n for (var i = 0; i < query.lazyLoad.length; i++) {\n keyCount++;\n lazyLoad[query.lazyLoad[i].key] = query.lazyLoad[i].value;\n }\n var agg = {};\n for (var i = 0; i < query.queries.length; i++) {\n key = query.queries[i];\n if ((key.fn === 'onPage' || key.fn === 'onGroup') && query.lazyLoad.length) {\n if (key.fn === 'onGroup') {\n group.push(key.e);\n }\n if (key.fn === 'onPage') {\n page = key.e;\n }\n continue;\n }\n ret = this[key.fn].call(this, result, key.e, query);\n if (key.fn === 'onAggregates') {\n agg[key.e.field + ' - ' + key.e.type] = ret;\n }\n else {\n result = ret !== undefined ? ret : result;\n }\n if (key.fn === 'onPage' || key.fn === 'onSkip' || key.fn === 'onTake' || key.fn === 'onRange') {\n countFlg = false;\n }\n if (countFlg) {\n count = result.length;\n }\n }\n if (keyCount) {\n var args = {\n query: query, lazyLoad: lazyLoad, result: result, group: group, page: page\n };\n var lazyLoadData = this.lazyLoadGroup(args);\n result = lazyLoadData.result;\n count = lazyLoadData.count;\n }\n if (query.isCountRequired) {\n result = {\n result: result,\n count: count,\n aggregates: agg\n };\n }\n return result;\n };\n /**\n * Perform lazy load grouping in JSON array based on the given query and lazy load details.\n *\n * @param {LazyLoadGroupArgs} args\n */\n JsonAdaptor.prototype.lazyLoadGroup = function (args) {\n var count = 0;\n var agg = this.getAggregate(args.query);\n var result = args.result;\n if (!isNullOrUndefined(args.lazyLoad.onDemandGroupInfo)) {\n var req = args.lazyLoad.onDemandGroupInfo;\n for (var i = req.where.length - 1; i >= 0; i--) {\n result = this.onWhere(result, req.where[i]);\n }\n if (args.group.length !== req.level) {\n var field = args.group[req.level].fieldName;\n result = DataUtil.group(result, field, agg, null, null, args.group[0].comparer, true);\n }\n count = result.length;\n var data = result;\n result = result.slice(req.skip);\n result = result.slice(0, req.take);\n if (args.group.length !== req.level) {\n this.formGroupResult(result, data);\n }\n }\n else {\n var field = args.group[0].fieldName;\n result = DataUtil.group(result, field, agg, null, null, args.group[0].comparer, true);\n count = result.length;\n var data = result;\n if (args.page) {\n result = this.onPage(result, args.page, args.query);\n }\n this.formGroupResult(result, data);\n }\n return { result: result, count: count };\n };\n JsonAdaptor.prototype.formGroupResult = function (result, data) {\n if (result.length && data.length) {\n var uid = 'GroupGuid';\n var childLevel = 'childLevels';\n var level = 'level';\n var records = 'records';\n result[uid] = data[uid];\n result[childLevel] = data[childLevel];\n result[level] = data[level];\n result[records] = data[records];\n }\n return result;\n };\n /**\n * Separate the aggregate query from the given queries\n *\n * @param {Query} query\n */\n JsonAdaptor.prototype.getAggregate = function (query) {\n var aggQuery = Query.filterQueries(query.queries, 'onAggregates');\n var agg = [];\n if (aggQuery.length) {\n var tmp = void 0;\n for (var i = 0; i < aggQuery.length; i++) {\n tmp = aggQuery[i].e;\n agg.push({ type: tmp.type, field: DataUtil.getValue(tmp.field, query) });\n }\n }\n return agg;\n };\n /**\n * Performs batch update in the JSON array which add, remove and update records.\n *\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n */\n JsonAdaptor.prototype.batchRequest = function (dm, changes, e) {\n var i;\n var deletedRecordsLen = changes.deletedRecords.length;\n for (i = 0; i < changes.addedRecords.length; i++) {\n this.insert(dm, changes.addedRecords[i]);\n }\n for (i = 0; i < changes.changedRecords.length; i++) {\n this.update(dm, e.key, changes.changedRecords[i]);\n }\n for (i = 0; i < deletedRecordsLen; i++) {\n this.remove(dm, e.key, changes.deletedRecords[i]);\n }\n return changes;\n };\n /**\n * Performs filter operation with the given data and where query.\n *\n * @param {Object[]} ds\n * @param {{validate:Function}} e\n * @param e.validate\n */\n JsonAdaptor.prototype.onWhere = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.filter(function (obj) {\n if (e) {\n return e.validate(obj);\n }\n });\n };\n /**\n * Returns aggregate function based on the aggregate type.\n *\n * @param {Object[]} ds\n * @param e\n * @param {string} } type\n * @param e.field\n * @param e.type\n */\n JsonAdaptor.prototype.onAggregates = function (ds, e) {\n var fn = DataUtil.aggregates[e.type];\n if (!ds || !fn || ds.length === 0) {\n return null;\n }\n return fn(ds, e.field);\n };\n /**\n * Performs search operation based on the given query.\n *\n * @param {Object[]} ds\n * @param {QueryOptions} e\n */\n JsonAdaptor.prototype.onSearch = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n if (e.fieldNames.length === 0) {\n DataUtil.getFieldList(ds[0], e.fieldNames);\n }\n return ds.filter(function (obj) {\n for (var j = 0; j < e.fieldNames.length; j++) {\n if (e.comparer.call(obj, DataUtil.getObject(e.fieldNames[j], obj), e.searchKey, e.ignoreCase, e.ignoreAccent)) {\n return true;\n }\n }\n return false;\n });\n };\n /**\n * Sort the data with given direction and field.\n *\n * @param {Object[]} ds\n * @param e\n * @param {Object} b\n * @param e.comparer\n * @param e.fieldName\n * @param query\n */\n JsonAdaptor.prototype.onSortBy = function (ds, e, query) {\n if (!ds || !ds.length) {\n return ds;\n }\n var fnCompare;\n var field = DataUtil.getValue(e.fieldName, query);\n if (!field) {\n return ds.sort(e.comparer);\n }\n if (field instanceof Array) {\n field = field.slice(0);\n for (var i = field.length - 1; i >= 0; i--) {\n if (!field[i]) {\n continue;\n }\n fnCompare = e.comparer;\n if (DataUtil.endsWith(field[i], ' desc')) {\n fnCompare = DataUtil.fnSort('descending');\n field[i] = field[i].replace(' desc', '');\n }\n ds = DataUtil.sort(ds, field[i], fnCompare);\n }\n return ds;\n }\n return DataUtil.sort(ds, field, e.comparer);\n };\n /**\n * Group the data based on the given query.\n *\n * @param {Object[]} ds\n * @param {QueryOptions} e\n * @param {Query} query\n */\n JsonAdaptor.prototype.onGroup = function (ds, e, query) {\n if (!ds || !ds.length) {\n return ds;\n }\n var agg = this.getAggregate(query);\n return DataUtil.group(ds, DataUtil.getValue(e.fieldName, query), agg, null, null, e.comparer);\n };\n /**\n * Retrieves records based on the given page index and size.\n *\n * @param {Object[]} ds\n * @param e\n * @param {number} } pageIndex\n * @param e.pageSize\n * @param {Query} query\n * @param e.pageIndex\n */\n JsonAdaptor.prototype.onPage = function (ds, e, query) {\n var size = DataUtil.getValue(e.pageSize, query);\n var start = (DataUtil.getValue(e.pageIndex, query) - 1) * size;\n var end = start + size;\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(start, end);\n };\n /**\n * Retrieves records based on the given start and end index from query.\n *\n * @param {Object[]} ds\n * @param e\n * @param {number} } end\n * @param e.start\n * @param e.end\n */\n JsonAdaptor.prototype.onRange = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(DataUtil.getValue(e.start), DataUtil.getValue(e.end));\n };\n /**\n * Picks the given count of records from the top of the datasource.\n *\n * @param {Object[]} ds\n * @param {{nos:number}} e\n * @param e.nos\n */\n JsonAdaptor.prototype.onTake = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(0, DataUtil.getValue(e.nos));\n };\n /**\n * Skips the given count of records from the data source.\n *\n * @param {Object[]} ds\n * @param {{nos:number}} e\n * @param e.nos\n */\n JsonAdaptor.prototype.onSkip = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return ds.slice(DataUtil.getValue(e.nos));\n };\n /**\n * Selects specified columns from the data source.\n *\n * @param {Object[]} ds\n * @param {{fieldNames:string}} e\n * @param e.fieldNames\n */\n JsonAdaptor.prototype.onSelect = function (ds, e) {\n if (!ds || !ds.length) {\n return ds;\n }\n return DataUtil.select(ds, DataUtil.getValue(e.fieldNames));\n };\n /**\n * Inserts new record in the table.\n *\n * @param {DataManager} dm\n * @param {Object} data\n * @param tableName\n * @param query\n * @param {number} position\n */\n JsonAdaptor.prototype.insert = function (dm, data, tableName, query, position) {\n if (isNullOrUndefined(position)) {\n return dm.dataSource.json.push(data);\n }\n else {\n return dm.dataSource.json.splice(position, 0, data);\n }\n };\n /**\n * Remove the data from the dataSource based on the key field value.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @param tableName\n * @returns null\n */\n JsonAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n var ds = dm.dataSource.json;\n var i;\n if (typeof value === 'object' && !(value instanceof Date)) {\n value = DataUtil.getObject(keyField, value);\n }\n for (i = 0; i < ds.length; i++) {\n if (DataUtil.getObject(keyField, ds[i]) === value) {\n break;\n }\n }\n return i !== ds.length ? ds.splice(i, 1) : null;\n };\n /**\n * Updates existing record and saves the changes to the table.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @param tableName\n * @returns null\n */\n JsonAdaptor.prototype.update = function (dm, keyField, value, tableName) {\n var ds = dm.dataSource.json;\n var i;\n var key;\n if (!isNullOrUndefined(keyField)) {\n key = getValue(keyField, value);\n }\n for (i = 0; i < ds.length; i++) {\n if (!isNullOrUndefined(keyField) && (getValue(keyField, ds[i])) === key) {\n break;\n }\n }\n return i < ds.length ? merge(ds[i], value) : null;\n };\n return JsonAdaptor;\n}(Adaptor));\nexport { JsonAdaptor };\n/**\n * URL Adaptor of DataManager can be used when you are required to use remote service to retrieve data.\n * It interacts with server-side for all DataManager Queries and CRUD operations.\n *\n * @hidden\n */\nvar UrlAdaptor = /** @class */ (function (_super) {\n __extends(UrlAdaptor, _super);\n function UrlAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Process the query to generate request body.\n *\n * @param {DataManager} dm\n * @param {Query} query\n * @param {Object[]} hierarchyFilters?\n * @param hierarchyFilters\n * @returns p\n */\n // tslint:disable-next-line:max-func-body-length\n UrlAdaptor.prototype.processQuery = function (dm, query, hierarchyFilters) {\n var queries = this.getQueryRequest(query);\n var singles = Query.filterQueryLists(query.queries, ['onSelect', 'onPage', 'onSkip', 'onTake', 'onRange']);\n var params = query.params;\n var url = dm.dataSource.url;\n var temp;\n var skip;\n var take = null;\n var options = this.options;\n var request = { sorts: [], groups: [], filters: [], searches: [], aggregates: [] };\n // calc Paging & Range\n if ('onPage' in singles) {\n temp = singles.onPage;\n skip = DataUtil.getValue(temp.pageIndex, query);\n take = DataUtil.getValue(temp.pageSize, query);\n skip = (skip - 1) * take;\n }\n else if ('onRange' in singles) {\n temp = singles.onRange;\n skip = temp.start;\n take = temp.end - temp.start;\n }\n // Sorting\n for (var i = 0; i < queries.sorts.length; i++) {\n temp = DataUtil.getValue(queries.sorts[i].e.fieldName, query);\n request.sorts.push(DataUtil.callAdaptorFunction(this, 'onEachSort', { name: temp, direction: queries.sorts[i].e.direction }, query));\n }\n // hierarchy\n if (hierarchyFilters) {\n temp = this.getFiltersFrom(hierarchyFilters, query);\n if (temp) {\n request.filters.push(DataUtil.callAdaptorFunction(this, 'onEachWhere', temp.toJson(), query));\n }\n }\n // Filters\n for (var i = 0; i < queries.filters.length; i++) {\n var res = DataUtil.callAdaptorFunction(this, 'onEachWhere', queries.filters[i].e.toJson(), query);\n if ((this.getModuleName &&\n this.getModuleName() === 'ODataV4Adaptor') &&\n !isNullOrUndefined(queries.filters[i].e.key) && queries.filters.length > 1) {\n res = '(' + res + ')';\n }\n request.filters.push(res);\n var keys_3 = typeof request.filters[i] === 'object' ? Object.keys(request.filters[i]) : [];\n for (var _i = 0, keys_1 = keys_3; _i < keys_1.length; _i++) {\n var prop = keys_1[_i];\n if (DataUtil.isNull((request)[prop])) {\n delete request[prop];\n }\n }\n }\n // Searches\n for (var i = 0; i < queries.searches.length; i++) {\n temp = queries.searches[i].e;\n request.searches.push(DataUtil.callAdaptorFunction(this, 'onEachSearch', {\n fields: temp.fieldNames,\n operator: temp.operator,\n key: temp.searchKey,\n ignoreCase: temp.ignoreCase\n }, query));\n }\n // Grouping\n for (var i = 0; i < queries.groups.length; i++) {\n request.groups.push(DataUtil.getValue(queries.groups[i].e.fieldName, query));\n }\n // aggregates\n for (var i = 0; i < queries.aggregates.length; i++) {\n temp = queries.aggregates[i].e;\n request.aggregates.push({ type: temp.type, field: DataUtil.getValue(temp.field, query) });\n }\n var req = {};\n this.getRequestQuery(options, query, singles, request, req);\n // Params\n DataUtil.callAdaptorFunction(this, 'addParams', { dm: dm, query: query, params: params, reqParams: req });\n if (query.lazyLoad.length) {\n for (var i = 0; i < query.lazyLoad.length; i++) {\n req[query.lazyLoad[i].key] = query.lazyLoad[i].value;\n }\n }\n // cleanup\n var keys = Object.keys(req);\n for (var _a = 0, keys_2 = keys; _a < keys_2.length; _a++) {\n var prop = keys_2[_a];\n if (DataUtil.isNull(req[prop]) || req[prop] === '' || req[prop].length === 0) {\n delete req[prop];\n }\n }\n if (!(options.skip in req && options.take in req) && take !== null) {\n req[options.skip] = DataUtil.callAdaptorFunction(this, 'onSkip', skip, query);\n req[options.take] = DataUtil.callAdaptorFunction(this, 'onTake', take, query);\n }\n var p = this.pvt;\n this.pvt = {};\n if (this.options.requestType === 'json') {\n return {\n data: JSON.stringify(req, DataUtil.parse.jsonDateReplacer),\n url: url,\n pvtData: p,\n type: 'POST',\n contentType: 'application/json; charset=utf-8'\n };\n }\n temp = this.convertToQueryString(req, query, dm);\n temp = (dm.dataSource.url.indexOf('?') !== -1 ? '&' : '/') + temp;\n return {\n type: 'GET', url: temp.length ? url.replace(/\\/*$/, temp) : url, pvtData: p\n };\n };\n UrlAdaptor.prototype.getRequestQuery = function (options, query, singles, request, request1) {\n var param = 'param';\n var req = request1;\n req[options.from] = query.fromTable;\n if (options.apply && query.distincts.length) {\n req[options.apply] = 'onDistinct' in this ? DataUtil.callAdaptorFunction(this, 'onDistinct', query.distincts) : '';\n }\n if (!query.distincts.length && options.expand) {\n req[options.expand] = 'onExpand' in this && 'onSelect' in singles ?\n DataUtil.callAdaptorFunction(this, 'onExpand', { selects: DataUtil.getValue(singles.onSelect.fieldNames, query), expands: query.expands }, query) : query.expands;\n }\n req[options.select] = 'onSelect' in singles && !query.distincts.length ?\n DataUtil.callAdaptorFunction(this, 'onSelect', DataUtil.getValue(singles.onSelect.fieldNames, query), query) : '';\n req[options.count] = query.isCountRequired ? DataUtil.callAdaptorFunction(this, 'onCount', query.isCountRequired, query) : '';\n req[options.search] = request.searches.length ? DataUtil.callAdaptorFunction(this, 'onSearch', request.searches, query) : '';\n req[options.skip] = 'onSkip' in singles ?\n DataUtil.callAdaptorFunction(this, 'onSkip', DataUtil.getValue(singles.onSkip.nos, query), query) : '';\n req[options.take] = 'onTake' in singles ?\n DataUtil.callAdaptorFunction(this, 'onTake', DataUtil.getValue(singles.onTake.nos, query), query) : '';\n req[options.where] = request.filters.length || request.searches.length ?\n DataUtil.callAdaptorFunction(this, 'onWhere', request.filters, query) : '';\n req[options.sortBy] = request.sorts.length ? DataUtil.callAdaptorFunction(this, 'onSortBy', request.sorts, query) : '';\n req[options.group] = request.groups.length ? DataUtil.callAdaptorFunction(this, 'onGroup', request.groups, query) : '';\n req[options.aggregates] = request.aggregates.length ?\n DataUtil.callAdaptorFunction(this, 'onAggregates', request.aggregates, query) : '';\n req[param] = [];\n };\n /**\n * Convert the object from processQuery to string which can be added query string.\n *\n * @param {Object} req\n * @param request\n * @param {Query} query\n * @param {DataManager} dm\n */\n UrlAdaptor.prototype.convertToQueryString = function (request, query, dm) {\n return '';\n // this needs to be overridden\n };\n /**\n * Return the data from the data manager processing.\n *\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {Request} xhr?\n * @param {Object} request?\n * @param {CrudOptions} changes?\n * @param ds\n * @param query\n * @param xhr\n * @param request\n * @param changes\n */\n UrlAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n if (xhr && xhr.headers.get('Content-Type') &&\n xhr.headers.get('Content-Type').indexOf('application/json') !== -1) {\n var handleTimeZone = DataUtil.timeZoneHandling;\n if (ds && !ds.timeZoneHandling) {\n DataUtil.timeZoneHandling = false;\n }\n data = DataUtil.parse.parseJson(data);\n DataUtil.timeZoneHandling = handleTimeZone;\n }\n var requests = request;\n var pvt = requests.pvtData || {};\n var groupDs = data ? data.groupDs : [];\n if (xhr && xhr.headers.get('Content-Type') &&\n xhr.headers.get('Content-Type').indexOf('xml') !== -1) {\n return (query.isCountRequired ? { result: [], count: 0 } : []);\n }\n var d = JSON.parse(requests.data);\n if (d && d.action === 'batch' && data && data.addedRecords) {\n changes.addedRecords = data.addedRecords;\n return changes;\n }\n if (data && data.d) {\n data = data.d;\n }\n var args = {};\n if (data && 'count' in data) {\n args.count = data.count;\n }\n args.result = data && data.result ? data.result : data;\n var isExpand = false;\n if (Array.isArray(data.result) && data.result.length) {\n var key = 'key';\n var val = 'value';\n var level = 'level';\n if (!isNullOrUndefined(data.result[0][key])) {\n args.result = this.formRemoteGroupedData(args.result, 1, pvt.groups.length - 1);\n }\n if (query && query.lazyLoad.length && pvt.groups.length) {\n for (var i = 0; i < query.lazyLoad.length; i++) {\n if (query.lazyLoad[i][key] === 'onDemandGroupInfo') {\n var value = query.lazyLoad[i][val][level];\n if (pvt.groups.length === value) {\n isExpand = true;\n }\n }\n }\n }\n }\n if (!isExpand) {\n this.getAggregateResult(pvt, data, args, groupDs, query);\n }\n return DataUtil.isNull(args.count) ? args.result : { result: args.result, count: args.count, aggregates: args.aggregates };\n };\n UrlAdaptor.prototype.formRemoteGroupedData = function (data, level, childLevel) {\n for (var i = 0; i < data.length; i++) {\n if (data[i].items.length && Object.keys(data[i].items[0]).indexOf('key') > -1) {\n this.formRemoteGroupedData(data[i].items, level + 1, childLevel - 1);\n }\n }\n var uid = 'GroupGuid';\n var childLvl = 'childLevels';\n var lvl = 'level';\n var records = 'records';\n data[uid] = consts[uid];\n data[lvl] = level;\n data[childLvl] = childLevel;\n data[records] = data[0].items.length ? this.getGroupedRecords(data, !isNullOrUndefined(data[0].items[records])) : [];\n return data;\n };\n UrlAdaptor.prototype.getGroupedRecords = function (data, hasRecords) {\n var childGroupedRecords = [];\n var records = 'records';\n for (var i = 0; i < data.length; i++) {\n if (!hasRecords) {\n for (var j = 0; j < data[i].items.length; j++) {\n childGroupedRecords.push(data[i].items[j]);\n }\n }\n else {\n childGroupedRecords = childGroupedRecords.concat(data[i].items[records]);\n }\n }\n return childGroupedRecords;\n };\n /**\n * Add the group query to the adaptor`s option.\n *\n * @param {Object[]} e\n * @returns void\n */\n UrlAdaptor.prototype.onGroup = function (e) {\n this.pvt.groups = e;\n return e;\n };\n /**\n * Add the aggregate query to the adaptor`s option.\n *\n * @param {Aggregates[]} e\n * @returns void\n */\n UrlAdaptor.prototype.onAggregates = function (e) {\n this.pvt.aggregates = e;\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * The result is used by the batch request.\n *\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {Object} e\n * @param query\n * @param original\n */\n UrlAdaptor.prototype.batchRequest = function (dm, changes, e, query, original) {\n var url;\n var key;\n return {\n type: 'POST',\n url: dm.dataSource.batchUrl || dm.dataSource.crudUrl || dm.dataSource.removeUrl || dm.dataSource.url,\n contentType: 'application/json; charset=utf-8',\n dataType: 'json',\n data: JSON.stringify(extend({}, {\n changed: changes.changedRecords,\n added: changes.addedRecords,\n deleted: changes.deletedRecords,\n action: 'batch',\n table: e[url],\n key: e[key]\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n *\n * @param {DataManager} dm\n * @param {Request} request\n * @returns void\n */\n UrlAdaptor.prototype.beforeSend = function (dm, request) {\n // need to extend this method\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n *\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName\n * @param query\n */\n UrlAdaptor.prototype.insert = function (dm, data, tableName, query) {\n return {\n url: dm.dataSource.insertUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: data,\n table: tableName,\n action: 'insert'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {number|string} value\n * @param {string} tableName\n * @param query\n */\n UrlAdaptor.prototype.remove = function (dm, keyField, value, tableName, query) {\n return {\n type: 'POST',\n url: dm.dataSource.removeUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n key: value,\n keyColumn: keyField,\n table: tableName,\n action: 'remove'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * Prepare and return request body which is used to update record.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName\n * @param query\n */\n UrlAdaptor.prototype.update = function (dm, keyField, value, tableName, query) {\n return {\n type: 'POST',\n url: dm.dataSource.updateUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: value,\n action: 'update',\n keyColumn: keyField,\n key: DataUtil.getObject(keyField, value),\n table: tableName\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n /**\n * To generate the predicate based on the filtered query.\n *\n * @param {Object[]|string[]|number[]} data\n * @param {Query} query\n * @hidden\n */\n UrlAdaptor.prototype.getFiltersFrom = function (data, query) {\n var key = query.fKey;\n var value;\n var prop = key;\n var pKey = query.key;\n var predicats = [];\n if (typeof data[0] !== 'object') {\n prop = null;\n }\n for (var i = 0; i < data.length; i++) {\n if (typeof data[0] === 'object') {\n value = DataUtil.getObject(pKey || prop, data[i]);\n }\n else {\n value = data[i];\n }\n predicats.push(new Predicate(key, 'equal', value));\n }\n return Predicate.or(predicats);\n };\n UrlAdaptor.prototype.getAggregateResult = function (pvt, data, args, groupDs, query) {\n var pData = data;\n if (data && data.result) {\n pData = data.result;\n }\n if (pvt && pvt.aggregates && pvt.aggregates.length) {\n var agg = pvt.aggregates;\n var fn = void 0;\n var aggregateData = pData;\n var res = {};\n if (data.aggregate) {\n aggregateData = data.aggregate;\n }\n for (var i = 0; i < agg.length; i++) {\n fn = DataUtil.aggregates[agg[i].type];\n if (fn) {\n res[agg[i].field + ' - ' + agg[i].type] = fn(aggregateData, agg[i].field);\n }\n }\n args.aggregates = res;\n }\n var key = 'key';\n var isServerGrouping = Array.isArray(data.result) && data.result.length && !isNullOrUndefined(data.result[0][key]);\n if (pvt && pvt.groups && pvt.groups.length && !isServerGrouping) {\n var groups = pvt.groups;\n for (var i = 0; i < groups.length; i++) {\n var level = null;\n if (!isNullOrUndefined(groupDs)) {\n groupDs = DataUtil.group(groupDs, groups[i]);\n }\n var groupQuery = Query.filterQueries(query.queries, 'onGroup')[i].e;\n pData = DataUtil.group(pData, groups[i], pvt.aggregates, level, groupDs, groupQuery.comparer);\n }\n args.result = pData;\n }\n return args;\n };\n UrlAdaptor.prototype.getQueryRequest = function (query) {\n var req = { sorts: [], groups: [], filters: [], searches: [], aggregates: [] };\n req.sorts = Query.filterQueries(query.queries, 'onSortBy');\n req.groups = Query.filterQueries(query.queries, 'onGroup');\n req.filters = Query.filterQueries(query.queries, 'onWhere');\n req.searches = Query.filterQueries(query.queries, 'onSearch');\n req.aggregates = Query.filterQueries(query.queries, 'onAggregates');\n return req;\n };\n UrlAdaptor.prototype.addParams = function (options) {\n var req = options.reqParams;\n if (options.params.length) {\n req.params = {};\n }\n for (var _i = 0, _a = options.params; _i < _a.length; _i++) {\n var tmp = _a[_i];\n if (req[tmp.key]) {\n throw new Error('Query() - addParams: Custom Param is conflicting other request arguments');\n }\n req[tmp.key] = tmp.value;\n if (tmp.fn) {\n req[tmp.key] = tmp.fn.call(options.query, tmp.key, options.query, options.dm);\n }\n req.params[tmp.key] = req[tmp.key];\n }\n };\n return UrlAdaptor;\n}(Adaptor));\nexport { UrlAdaptor };\n/**\n * OData Adaptor that is extended from URL Adaptor, is used for consuming data through OData Service.\n *\n * @hidden\n */\nvar ODataAdaptor = /** @class */ (function (_super) {\n __extends(ODataAdaptor, _super);\n function ODataAdaptor(props) {\n var _this = _super.call(this) || this;\n // options replaced the default adaptor options\n _this.options = extend({}, _this.options, {\n requestType: 'get',\n accept: 'application/json;odata=light;q=1,application/json;odata=verbose;q=0.5',\n multipartAccept: 'multipart/mixed',\n sortBy: '$orderby',\n select: '$select',\n skip: '$skip',\n take: '$top',\n count: '$inlinecount',\n where: '$filter',\n expand: '$expand',\n batch: '$batch',\n changeSet: '--changeset_',\n batchPre: 'batch_',\n contentId: 'Content-Id: ',\n batchContent: 'Content-Type: multipart/mixed; boundary=',\n changeSetContent: 'Content-Type: application/http\\nContent-Transfer-Encoding: binary ',\n batchChangeSetContentType: 'Content-Type: application/json; charset=utf-8 ',\n updateType: 'PUT'\n });\n extend(_this.options, props || {});\n return _this;\n }\n ODataAdaptor.prototype.getModuleName = function () {\n return 'ODataAdaptor';\n };\n /**\n * Generate request string based on the filter criteria from query.\n *\n * @param {Predicate} pred\n * @param {boolean} requiresCast?\n * @param predicate\n * @param query\n * @param requiresCast\n */\n ODataAdaptor.prototype.onPredicate = function (predicate, query, requiresCast) {\n var returnValue = '';\n var operator;\n var guid;\n var val = predicate.value;\n var type = typeof val;\n var field = predicate.field ? ODataAdaptor.getField(predicate.field) : null;\n if (val instanceof Date) {\n val = 'datetime\\'' + DataUtil.parse.replacer(val) + '\\'';\n }\n if (type === 'string') {\n val = val.replace(/'/g, '\\'\\'');\n if (predicate.ignoreCase) {\n val = val.toLowerCase();\n }\n if (predicate.operator !== 'like') {\n val = encodeURIComponent(val);\n }\n if (predicate.operator !== 'wildcard' && predicate.operator !== 'like') {\n val = '\\'' + val + '\\'';\n }\n if (requiresCast) {\n field = 'cast(' + field + ', \\'Edm.String\\')';\n }\n if (DataUtil.parse.isGuid(val)) {\n guid = 'guid';\n }\n if (predicate.ignoreCase) {\n if (!guid) {\n field = 'tolower(' + field + ')';\n }\n val = val.toLowerCase();\n }\n }\n if (predicate.operator === 'isempty' || predicate.operator === 'isnull' || predicate.operator === 'isnotempty' ||\n predicate.operator === 'isnotnull') {\n operator = predicate.operator.indexOf('isnot') !== -1 ? DataUtil.odBiOperator['notequal'] : DataUtil.odBiOperator['equal'];\n val = predicate.operator === 'isnull' || predicate.operator === 'isnotnull' ? null : '\\'\\'';\n }\n else {\n operator = DataUtil.odBiOperator[predicate.operator];\n }\n if (operator) {\n returnValue += field;\n returnValue += operator;\n if (guid) {\n returnValue += guid;\n }\n return returnValue + val;\n }\n if (!isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor') {\n operator = DataUtil.odv4UniOperator[predicate.operator];\n }\n else {\n operator = DataUtil.odUniOperator[predicate.operator];\n }\n if (operator === 'like') {\n val = val;\n if (val.indexOf('%') !== -1) {\n if (val.charAt(0) === '%' && val.lastIndexOf('%') < 2) {\n val = val.substring(1, val.length);\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['startswith'] : DataUtil.odUniOperator['startswith'];\n }\n else if (val.charAt(val.length - 1) === '%' && val.indexOf('%') > val.length - 3) {\n val = val.substring(0, val.length - 1);\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['endswith'] : DataUtil.odUniOperator['endswith'];\n }\n else if (val.lastIndexOf('%') !== val.indexOf('%') && val.lastIndexOf('%') > val.indexOf('%') + 1) {\n val = val.substring(val.indexOf('%') + 1, val.lastIndexOf('%'));\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['contains'] : DataUtil.odUniOperator['contains'];\n }\n else {\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['contains'] : DataUtil.odUniOperator['contains'];\n }\n }\n val = encodeURIComponent(val);\n val = '\\'' + val + '\\'';\n }\n else if (operator === 'wildcard') {\n val = val;\n if (val.indexOf('*') !== -1) {\n var splittedStringValue = val.split('*');\n var splittedValue = void 0;\n var count = 0;\n if (val.indexOf('*') !== 0 && splittedStringValue[0].indexOf('%3f') === -1 &&\n splittedStringValue[0].indexOf('?') === -1) {\n splittedValue = splittedStringValue[0];\n splittedValue = '\\'' + splittedValue + '\\'';\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['startswith'] : DataUtil.odUniOperator['startswith'];\n returnValue += operator + '(';\n returnValue += field + ',';\n if (guid) {\n returnValue += guid;\n }\n returnValue += splittedValue + ')';\n count++;\n }\n if (val.lastIndexOf('*') !== val.length - 1 && splittedStringValue[splittedStringValue.length - 1].indexOf('%3f') === -1 &&\n splittedStringValue[splittedStringValue.length - 1].indexOf('?') === -1) {\n splittedValue = splittedStringValue[splittedStringValue.length - 1];\n splittedValue = '\\'' + splittedValue + '\\'';\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['endswith'] : DataUtil.odUniOperator['endswith'];\n if (count > 0) {\n returnValue += ' and ';\n }\n returnValue += operator + '(';\n returnValue += field + ',';\n if (guid) {\n returnValue += guid;\n }\n returnValue += splittedValue + ')';\n count++;\n }\n if (splittedStringValue.length > 2) {\n for (var i = 1; i < splittedStringValue.length - 1; i++) {\n if (splittedStringValue[i].indexOf('%3f') === -1 && splittedStringValue[i].indexOf('?') === -1) {\n splittedValue = splittedStringValue[i];\n splittedValue = '\\'' + splittedValue + '\\'';\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['contains'] : DataUtil.odUniOperator['contains'];\n if (count > 0) {\n returnValue += ' and ';\n }\n if (operator === 'substringof' || operator === 'not substringof') {\n var temp = splittedValue;\n splittedValue = field;\n field = temp;\n }\n returnValue += operator + '(';\n returnValue += field + ',';\n if (guid) {\n returnValue += guid;\n }\n returnValue += splittedValue + ')';\n count++;\n }\n }\n }\n if (count === 0) {\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['contains'] : DataUtil.odUniOperator['contains'];\n if (val.indexOf('?') !== -1 || val.indexOf('%3f') !== -1) {\n val = val.indexOf('?') !== -1 ? val.split('?').join('') : val.split('%3f').join('');\n }\n val = '\\'' + val + '\\'';\n }\n else {\n operator = 'wildcard';\n }\n }\n else {\n operator = !isNullOrUndefined(this.getModuleName) && this.getModuleName() === 'ODataV4Adaptor' ?\n DataUtil.odv4UniOperator['contains'] : DataUtil.odUniOperator['contains'];\n if (val.indexOf('?') !== -1 || val.indexOf('%3f') !== -1) {\n val = val.indexOf('?') !== -1 ? val.split('?').join('') : val.split('%3f').join('');\n }\n val = '\\'' + val + '\\'';\n }\n }\n if (operator === 'substringof' || operator === 'not substringof') {\n var temp = val;\n val = field;\n field = temp;\n }\n if (operator !== 'wildcard') {\n returnValue += operator + '(';\n returnValue += field + ',';\n if (guid) {\n returnValue += guid;\n }\n returnValue += val + ')';\n }\n return returnValue;\n };\n ODataAdaptor.prototype.addParams = function (options) {\n _super.prototype.addParams.call(this, options);\n delete options.reqParams.params;\n };\n /**\n * Generate request string based on the multiple filter criteria from query.\n *\n * @param {Predicate} pred\n * @param {boolean} requiresCast?\n * @param predicate\n * @param query\n * @param requiresCast\n */\n ODataAdaptor.prototype.onComplexPredicate = function (predicate, query, requiresCast) {\n var res = [];\n for (var i = 0; i < predicate.predicates.length; i++) {\n res.push('(' + this.onEachWhere(predicate.predicates[i], query, requiresCast) + ')');\n }\n return res.join(' ' + predicate.condition + ' ');\n };\n /**\n * Generate query string based on the multiple filter criteria from query.\n *\n * @param {Predicate} filter\n * @param {boolean} requiresCast?\n * @param query\n * @param requiresCast\n */\n ODataAdaptor.prototype.onEachWhere = function (filter, query, requiresCast) {\n return filter.isComplex ? this.onComplexPredicate(filter, query, requiresCast) : this.onPredicate(filter, query, requiresCast);\n };\n /**\n * Generate query string based on the multiple filter criteria from query.\n *\n * @param {string[]} filters\n */\n ODataAdaptor.prototype.onWhere = function (filters) {\n if (this.pvt.search) {\n filters.push(this.onEachWhere(this.pvt.search, null, true));\n }\n return filters.join(' and ');\n };\n /**\n * Generate query string based on the multiple search criteria from query.\n *\n * @param e\n * @param {string} operator\n * @param {string} key\n * @param {boolean} } ignoreCase\n * @param e.fields\n * @param e.operator\n * @param e.key\n * @param e.ignoreCase\n */\n ODataAdaptor.prototype.onEachSearch = function (e) {\n if (e.fields && e.fields.length === 0) {\n DataUtil.throwError('Query() - Search : oData search requires list of field names to search');\n }\n var filter = this.pvt.search || [];\n for (var i = 0; i < e.fields.length; i++) {\n filter.push(new Predicate(e.fields[i], e.operator, e.key, e.ignoreCase));\n }\n this.pvt.search = filter;\n };\n /**\n * Generate query string based on the search criteria from query.\n *\n * @param {Object} e\n */\n ODataAdaptor.prototype.onSearch = function (e) {\n this.pvt.search = Predicate.or(this.pvt.search);\n return '';\n };\n /**\n * Generate query string based on multiple sort criteria from query.\n *\n * @param {QueryOptions} e\n */\n ODataAdaptor.prototype.onEachSort = function (e) {\n var res = [];\n if (e.name instanceof Array) {\n for (var i = 0; i < e.name.length; i++) {\n res.push(ODataAdaptor.getField(e.name[i]) + (e.direction === 'descending' ? ' desc' : ''));\n }\n }\n else {\n res.push(ODataAdaptor.getField(e.name) + (e.direction === 'descending' ? ' desc' : ''));\n }\n return res.join(',');\n };\n /**\n * Returns sort query string.\n *\n * @param {string[]} e\n */\n ODataAdaptor.prototype.onSortBy = function (e) {\n return e.reverse().join(',');\n };\n /**\n * Adds the group query to the adaptor option.\n *\n * @param {Object[]} e\n * @returns string\n */\n ODataAdaptor.prototype.onGroup = function (e) {\n this.pvt.groups = e;\n return [];\n };\n /**\n * Returns the select query string.\n *\n * @param {string[]} e\n */\n ODataAdaptor.prototype.onSelect = function (e) {\n for (var i = 0; i < e.length; i++) {\n e[i] = ODataAdaptor.getField(e[i]);\n }\n return e.join(',');\n };\n /**\n * Add the aggregate query to the adaptor option.\n *\n * @param {Object[]} e\n * @returns string\n */\n ODataAdaptor.prototype.onAggregates = function (e) {\n this.pvt.aggregates = e;\n return '';\n };\n /**\n * Returns the query string which requests total count from the data source.\n *\n * @param {boolean} e\n * @returns string\n */\n ODataAdaptor.prototype.onCount = function (e) {\n return e === true ? 'allpages' : '';\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n *\n * @param {DataManager} dm\n * @param {Request} request\n * @param {Fetch} settings?\n * @param settings\n */\n ODataAdaptor.prototype.beforeSend = function (dm, request, settings) {\n if (DataUtil.endsWith(settings.url, this.options.batch) && settings.type.toLowerCase() === 'post') {\n request.headers.set('Accept', this.options.multipartAccept);\n request.headers.set('DataServiceVersion', '2.0');\n //request.overrideMimeType('text/plain; charset=x-user-defined');\n }\n else {\n request.headers.set('Accept', this.options.accept);\n }\n request.headers.set('DataServiceVersion', '2.0');\n request.headers.set('MaxDataServiceVersion', '2.0');\n };\n /**\n * Returns the data from the query processing.\n *\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {Request} xhr?\n * @param {Fetch} request?\n * @param {CrudOptions} changes?\n * @param ds\n * @param query\n * @param xhr\n * @param request\n * @param changes\n * @returns aggregateResult\n */\n ODataAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n var metaCheck = 'odata.metadata';\n if ((request && request.type === 'GET') && !this.rootUrl && data[metaCheck]) {\n var dataUrls = data[metaCheck].split('/$metadata#');\n this.rootUrl = dataUrls[0];\n this.resourceTableName = dataUrls[1];\n }\n var pvtData = 'pvtData';\n if (!isNullOrUndefined(data.d)) {\n var dataCopy = ((query && query.isCountRequired) ? data.d.results : data.d);\n var metaData = '__metadata';\n if (!isNullOrUndefined(dataCopy)) {\n for (var i = 0; i < dataCopy.length; i++) {\n if (!isNullOrUndefined(dataCopy[i][metaData])) {\n delete dataCopy[i][metaData];\n }\n }\n }\n }\n var pvt = request && request[pvtData];\n var emptyAndBatch = this.processBatchResponse(data, query, xhr, request, changes);\n if (emptyAndBatch) {\n return emptyAndBatch;\n }\n var versionCheck = xhr && request.fetchRequest.headers.get('DataServiceVersion');\n var count = null;\n var version = (versionCheck && parseInt(versionCheck, 10)) || 2;\n if (query && query.isCountRequired) {\n var oDataCount = '__count';\n if (data[oDataCount] || data['odata.count']) {\n count = data[oDataCount] || data['odata.count'];\n }\n if (data.d) {\n data = data.d;\n }\n if (data[oDataCount] || data['odata.count']) {\n count = data[oDataCount] || data['odata.count'];\n }\n }\n if (version === 3 && data.value) {\n data = data.value;\n }\n if (data.d) {\n data = data.d;\n }\n if (version < 3 && data.results) {\n data = data.results;\n }\n var args = {};\n args.count = count;\n args.result = data;\n this.getAggregateResult(pvt, data, args, null, query);\n return DataUtil.isNull(count) ? args.result : { result: args.result, count: args.count, aggregates: args.aggregates };\n };\n /**\n * Converts the request object to query string.\n *\n * @param {Object} req\n * @param request\n * @param {Query} query\n * @param {DataManager} dm\n * @returns tableName\n */\n ODataAdaptor.prototype.convertToQueryString = function (request, query, dm) {\n var res = [];\n var table = 'table';\n var tableName = request[table] || '';\n var format = '$format';\n delete request[table];\n if (dm.dataSource.requiresFormat) {\n request[format] = 'json';\n }\n var keys = Object.keys(request);\n for (var _i = 0, keys_4 = keys; _i < keys_4.length; _i++) {\n var prop = keys_4[_i];\n res.push(prop + '=' + request[prop]);\n }\n res = res.join('&');\n if (dm.dataSource.url && dm.dataSource.url.indexOf('?') !== -1 && !tableName) {\n return res;\n }\n return res.length ? tableName + '?' + res : tableName || '';\n };\n ODataAdaptor.prototype.localTimeReplacer = function (key, convertObj) {\n for (var _i = 0, _a = !isNullOrUndefined(convertObj) ? Object.keys(convertObj) : []; _i < _a.length; _i++) {\n var prop = _a[_i];\n if ((convertObj[prop] instanceof Date)) {\n convertObj[prop] = DataUtil.dateParse.toLocalTime(convertObj[prop]);\n }\n }\n return convertObj;\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n *\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName?\n * @param tableName\n */\n ODataAdaptor.prototype.insert = function (dm, data, tableName) {\n return {\n url: (dm.dataSource.insertUrl || dm.dataSource.url).replace(/\\/*$/, tableName ? '/' + tableName : ''),\n data: JSON.stringify(data, this.options.localTime ? this.localTimeReplacer : null)\n };\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {number} value\n * @param {string} tableName?\n * @param tableName\n */\n ODataAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n var url;\n if (typeof value === 'string' && !DataUtil.parse.isGuid(value)) {\n url = \"('\" + value + \"')\";\n }\n else {\n url = \"(\" + value + \")\";\n }\n return {\n type: 'DELETE',\n url: (dm.dataSource.removeUrl || dm.dataSource.url).replace(/\\/*$/, tableName ? '/' + tableName : '') + url\n };\n };\n /**\n * Updates existing record and saves the changes to the table.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @param tableName\n * @param query\n * @param original\n * @returns this\n */\n ODataAdaptor.prototype.update = function (dm, keyField, value, tableName, query, original) {\n if (this.options.updateType === 'PATCH' && !isNullOrUndefined(original)) {\n value = this.compareAndRemove(value, original, keyField);\n }\n var url;\n if (typeof value[keyField] === 'string' && !DataUtil.parse.isGuid(value[keyField])) {\n url = \"('\" + value[keyField] + \"')\";\n }\n else {\n url = \"(\" + value[keyField] + \")\";\n }\n return {\n type: this.options.updateType,\n url: (dm.dataSource.updateUrl || dm.dataSource.url).replace(/\\/*$/, tableName ? '/' + tableName : '') + url,\n data: JSON.stringify(value, this.options.localTime ? this.localTimeReplacer : null),\n accept: this.options.accept\n };\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * The result is used by the batch request.\n *\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n * @param query\n * @param original\n * @returns {Object}\n */\n ODataAdaptor.prototype.batchRequest = function (dm, changes, e, query, original) {\n var initialGuid = e.guid = DataUtil.getGuid(this.options.batchPre);\n var url = this.rootUrl ? this.rootUrl + '/' + this.options.batch :\n dm.dataSource.url.replace(/\\/*$/, '/' + this.options.batch);\n e.url = this.resourceTableName ? this.resourceTableName : e.url;\n var args = {\n url: e.url,\n key: e.key,\n cid: 1,\n cSet: DataUtil.getGuid(this.options.changeSet)\n };\n var req = '--' + initialGuid + '\\n';\n req += 'Content-Type: multipart/mixed; boundary=' + args.cSet.replace('--', '') + '\\n';\n this.pvt.changeSet = 0;\n req += this.generateInsertRequest(changes.addedRecords, args, dm);\n req += this.generateUpdateRequest(changes.changedRecords, args, dm, original ? original.changedRecords : []);\n req += this.generateDeleteRequest(changes.deletedRecords, args, dm);\n req += args.cSet + '--\\n';\n req += '--' + initialGuid + '--';\n return {\n type: 'POST',\n url: url,\n dataType: 'json',\n contentType: 'multipart/mixed; charset=UTF-8;boundary=' + initialGuid,\n data: req\n };\n };\n /**\n * Generate the string content from the removed records.\n * The result will be send during batch update.\n *\n * @param {Object[]} arr\n * @param {RemoteArgs} e\n * @param dm\n * @returns this\n */\n ODataAdaptor.prototype.generateDeleteRequest = function (arr, e, dm) {\n if (!arr) {\n return '';\n }\n var req = '';\n var stat = {\n 'method': 'DELETE ',\n 'url': function (data, i, key) {\n var url = DataUtil.getObject(key, data[i]);\n if (typeof url === 'number' || DataUtil.parse.isGuid(url)) {\n return '(' + url + ')';\n }\n else if (url instanceof Date) {\n var dateTime = data[i][key];\n return '(' + dateTime.toJSON() + ')';\n }\n else {\n return \"('\" + url + \"')\";\n }\n },\n 'data': function (data, i) { return ''; }\n };\n req = this.generateBodyContent(arr, e, stat, dm);\n return req + '\\n';\n };\n /**\n * Generate the string content from the inserted records.\n * The result will be send during batch update.\n *\n * @param {Object[]} arr\n * @param {RemoteArgs} e\n * @param dm\n */\n ODataAdaptor.prototype.generateInsertRequest = function (arr, e, dm) {\n if (!arr) {\n return '';\n }\n var req = '';\n var stat = {\n 'method': 'POST ',\n 'url': function (data, i, key) { return ''; },\n 'data': function (data, i) { return JSON.stringify(data[i]) + '\\n\\n'; }\n };\n req = this.generateBodyContent(arr, e, stat, dm);\n return req;\n };\n /**\n * Generate the string content from the updated records.\n * The result will be send during batch update.\n *\n * @param {Object[]} arr\n * @param {RemoteArgs} e\n * @param dm\n * @param org\n */\n ODataAdaptor.prototype.generateUpdateRequest = function (arr, e, dm, org) {\n var _this = this;\n if (!arr) {\n return '';\n }\n var req = '';\n arr.forEach(function (change) { return change = _this.compareAndRemove(change, org.filter(function (o) { return DataUtil.getObject(e.key, o) === DataUtil.getObject(e.key, change); })[0], e.key); });\n var stat = {\n 'method': this.options.updateType + ' ',\n 'url': function (data, i, key) {\n if (typeof data[i][key] === 'number' || DataUtil.parse.isGuid(data[i][key])) {\n return '(' + data[i][key] + ')';\n }\n else if (data[i][key] instanceof Date) {\n var date = data[i][key];\n return '(' + date.toJSON() + ')';\n }\n else {\n return \"('\" + data[i][key] + \"')\";\n }\n },\n 'data': function (data, i) { return JSON.stringify(data[i]) + '\\n\\n'; }\n };\n req = this.generateBodyContent(arr, e, stat, dm);\n return req;\n };\n ODataAdaptor.getField = function (prop) {\n return prop.replace(/\\./g, '/');\n };\n ODataAdaptor.prototype.generateBodyContent = function (arr, e, stat, dm) {\n var req = '';\n for (var i = 0; i < arr.length; i++) {\n req += '\\n' + e.cSet + '\\n';\n req += this.options.changeSetContent + '\\n\\n';\n req += stat.method;\n if (stat.method === 'POST ') {\n req += (dm.dataSource.insertUrl || dm.dataSource.crudUrl || e.url) + stat.url(arr, i, e.key) + ' HTTP/1.1\\n';\n }\n else if (stat.method === 'PUT ' || stat.method === 'PATCH ') {\n req += (dm.dataSource.updateUrl || dm.dataSource.crudUrl || e.url) + stat.url(arr, i, e.key) + ' HTTP/1.1\\n';\n }\n else if (stat.method === 'DELETE ') {\n req += (dm.dataSource.removeUrl || dm.dataSource.crudUrl || e.url) + stat.url(arr, i, e.key) + ' HTTP/1.1\\n';\n }\n req += 'Accept: ' + this.options.accept + '\\n';\n req += 'Content-Id: ' + this.pvt.changeSet++ + '\\n';\n req += this.options.batchChangeSetContentType + '\\n';\n if (!isNullOrUndefined(arr[i]['@odata.etag'])) {\n req += 'If-Match: ' + arr[i]['@odata.etag'] + '\\n\\n';\n delete arr[i]['@odata.etag'];\n }\n else {\n req += '\\n';\n }\n req += stat.data(arr, i);\n }\n return req;\n };\n ODataAdaptor.prototype.processBatchResponse = function (data, query, xhr, request, changes) {\n if (xhr && xhr.headers.get('Content-Type') && xhr.headers.get('Content-Type').indexOf('xml') !== -1) {\n return (query.isCountRequired ? { result: [], count: 0 } : []);\n }\n if (request && this.options.batch && DataUtil.endsWith(request.url, this.options.batch) && request.type.toLowerCase() === 'post') {\n var guid = xhr.headers.get('Content-Type');\n var cIdx = void 0;\n var jsonObj = void 0;\n var d = data + '';\n guid = guid.substring(guid.indexOf('=batchresponse') + 1);\n d = d.split(guid);\n if (d.length < 2) {\n return {};\n }\n d = d[1];\n var exVal = /(?:\\bContent-Type.+boundary=)(changesetresponse.+)/i.exec(d);\n if (exVal) {\n d.replace(exVal[0], '');\n }\n var changeGuid = exVal ? exVal[1] : '';\n d = d.split(changeGuid);\n for (var i = d.length; i > -1; i--) {\n if (!/\\bContent-ID:/i.test(d[i]) || !/\\bHTTP.+201/.test(d[i])) {\n continue;\n }\n cIdx = parseInt(/\\bContent-ID: (\\d+)/i.exec(d[i])[1], 10);\n if (changes.addedRecords[cIdx]) {\n jsonObj = DataUtil.parse.parseJson(/^\\{.+\\}/m.exec(d[i])[0]);\n extend({}, changes.addedRecords[cIdx], this.processResponse(jsonObj));\n }\n }\n return changes;\n }\n return null;\n };\n ODataAdaptor.prototype.compareAndRemove = function (data, original, key) {\n var _this = this;\n if (isNullOrUndefined(original)) {\n return data;\n }\n Object.keys(data).forEach(function (prop) {\n if (prop !== key && prop !== '@odata.etag') {\n if (DataUtil.isPlainObject(data[prop])) {\n _this.compareAndRemove(data[prop], original[prop]);\n var final = Object.keys(data[prop]).filter(function (data) { return data !== '@odata.etag'; });\n if (final.length === 0) {\n delete data[prop];\n }\n }\n else if (data[prop] === original[prop]) {\n delete data[prop];\n }\n else if (data[prop] && original[prop] && data[prop].valueOf() === original[prop].valueOf()) {\n delete data[prop];\n }\n }\n });\n return data;\n };\n return ODataAdaptor;\n}(UrlAdaptor));\nexport { ODataAdaptor };\n/**\n * The OData v4 is an improved version of OData protocols.\n * The DataManager uses the ODataV4Adaptor to consume OData v4 services.\n *\n * @hidden\n */\nvar ODataV4Adaptor = /** @class */ (function (_super) {\n __extends(ODataV4Adaptor, _super);\n function ODataV4Adaptor(props) {\n var _this = _super.call(this, props) || this;\n // options replaced the default adaptor options\n _this.options = extend({}, _this.options, {\n requestType: 'get',\n accept: 'application/json, text/javascript, */*; q=0.01',\n multipartAccept: 'multipart/mixed',\n sortBy: '$orderby',\n select: '$select',\n skip: '$skip',\n take: '$top',\n count: '$count',\n search: '$search',\n where: '$filter',\n expand: '$expand',\n batch: '$batch',\n changeSet: '--changeset_',\n batchPre: 'batch_',\n contentId: 'Content-Id: ',\n batchContent: 'Content-Type: multipart/mixed; boundary=',\n changeSetContent: 'Content-Type: application/http\\nContent-Transfer-Encoding: binary ',\n batchChangeSetContentType: 'Content-Type: application/json; charset=utf-8 ',\n updateType: 'PATCH',\n localTime: false,\n apply: '$apply'\n });\n extend(_this.options, props || {});\n return _this;\n }\n /**\n * @hidden\n */\n ODataV4Adaptor.prototype.getModuleName = function () {\n return 'ODataV4Adaptor';\n };\n /**\n * Returns the query string which requests total count from the data source.\n *\n * @param {boolean} e\n * @returns string\n */\n ODataV4Adaptor.prototype.onCount = function (e) {\n return e === true ? 'true' : '';\n };\n /**\n * Generate request string based on the filter criteria from query.\n *\n * @param {Predicate} pred\n * @param {boolean} requiresCast?\n * @param predicate\n * @param query\n * @param requiresCast\n */\n ODataV4Adaptor.prototype.onPredicate = function (predicate, query, requiresCast) {\n var returnValue = '';\n var val = predicate.value;\n var isDate = val instanceof Date;\n if (query instanceof Query) {\n var queries = this.getQueryRequest(query);\n for (var i = 0; i < queries.filters.length; i++) {\n if (queries.filters[i].e.key === predicate.value) {\n requiresCast = true;\n }\n }\n }\n returnValue = _super.prototype.onPredicate.call(this, predicate, query, requiresCast);\n if (isDate) {\n returnValue = returnValue.replace(/datetime'(.*)'$/, '$1');\n }\n if (DataUtil.parse.isGuid(val)) {\n returnValue = returnValue.replace('guid', '').replace(/'/g, '');\n }\n return returnValue;\n };\n /**\n * Generate query string based on the multiple search criteria from query.\n *\n * @param e\n * @param {string} operator\n * @param {string} key\n * @param {boolean} } ignoreCase\n * @param e.fields\n * @param e.operator\n * @param e.key\n * @param e.ignoreCase\n */\n ODataV4Adaptor.prototype.onEachSearch = function (e) {\n var search = this.pvt.searches || [];\n search.push(e.key);\n this.pvt.searches = search;\n };\n /**\n * Generate query string based on the search criteria from query.\n *\n * @param {Object} e\n */\n ODataV4Adaptor.prototype.onSearch = function (e) {\n return this.pvt.searches.join(' OR ');\n };\n /**\n * Returns the expand query string.\n *\n * @param {string} e\n * @param e.selects\n * @param e.expands\n */\n ODataV4Adaptor.prototype.onExpand = function (e) {\n var _this = this;\n var selected = {};\n var expanded = {};\n var expands = e.expands.slice();\n var exArr = [];\n var selects = e.selects.filter(function (item) { return item.indexOf('.') > -1; });\n selects.forEach(function (select) {\n var splits = select.split('.');\n if (!(splits[0] in selected)) {\n selected[splits[0]] = [];\n }\n if (splits.length === 2) {\n if (selected[splits[0]].length && Object.keys(selected).indexOf(splits[0]) !== -1) {\n if (selected[splits[0]][0].indexOf('$expand') !== -1 && selected[splits[0]][0].indexOf(';$select=') === -1) {\n selected[splits[0]][0] = selected[splits[0]][0] + ';' + '$select=' + splits[1];\n }\n else {\n selected[splits[0]][0] = selected[splits[0]][0] + ',' + splits[1];\n }\n }\n else {\n selected[splits[0]].push('$select=' + splits[1]);\n }\n }\n else {\n var sel = '$select=' + splits[splits.length - 1];\n var exp = '';\n var close_1 = '';\n for (var i = 1; i < splits.length - 1; i++) {\n exp = exp + '$expand=' + splits[i] + '(';\n close_1 = close_1 + ')';\n }\n var combineVal = exp + sel + close_1;\n if (selected[splits[0]].length && Object.keys(selected).indexOf(splits[0]) !== -1 &&\n _this.expandQueryIndex(selected[splits[0]], true)) {\n var idx = _this.expandQueryIndex(selected[splits[0]]);\n selected[splits[0]][idx] = selected[splits[0]][idx] + combineVal.replace('$expand=', ',');\n }\n else {\n selected[splits[0]].push(combineVal);\n }\n }\n });\n //Auto expand from select query\n Object.keys(selected).forEach(function (expand) {\n if ((expands.indexOf(expand) === -1)) {\n expands.push(expand);\n }\n });\n expands.forEach(function (expand) {\n expanded[expand] = expand in selected ? expand + \"(\" + selected[expand].join(';') + \")\" : expand;\n });\n Object.keys(expanded).forEach(function (ex) { return exArr.push(expanded[ex]); });\n return exArr.join(',');\n };\n ODataV4Adaptor.prototype.expandQueryIndex = function (query, isExpand) {\n for (var i = 0; i < query.length; i++) {\n if (query[i].indexOf('$expand') !== -1) {\n return isExpand ? true : i;\n }\n }\n return isExpand ? false : 0;\n };\n /**\n * Returns the groupby query string.\n *\n * @param {string} e\n * @param distinctFields\n */\n ODataV4Adaptor.prototype.onDistinct = function (distinctFields) {\n var fields = distinctFields.map(function (field) { return ODataAdaptor.getField(field); }).join(',');\n return \"groupby((\" + fields + \"))\";\n };\n /**\n * Returns the select query string.\n *\n * @param {string[]} e\n */\n ODataV4Adaptor.prototype.onSelect = function (e) {\n return _super.prototype.onSelect.call(this, e.filter(function (item) { return item.indexOf('.') === -1; }));\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n *\n * @param {DataManager} dm\n * @param {Request} request\n * @param {Fetch} settings\n * @returns void\n */\n ODataV4Adaptor.prototype.beforeSend = function (dm, request, settings) {\n if (settings.type === 'POST' || settings.type === 'PUT' || settings.type === 'PATCH') {\n request.headers.set('Prefer', 'return=representation');\n }\n request.headers.set('Accept', this.options.accept);\n };\n /**\n * Returns the data from the query processing.\n *\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {Request} xhr?\n * @param {Fetch} request?\n * @param {CrudOptions} changes?\n * @param ds\n * @param query\n * @param xhr\n * @param request\n * @param changes\n * @returns aggregateResult\n */\n ODataV4Adaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n var metaName = '@odata.context';\n var metaV4Name = '@context';\n if ((request && request.type === 'GET') && !this.rootUrl && (data[metaName] || data[metaV4Name])) {\n var dataUrl = data[metaName] ? data[metaName].split('/$metadata#') : data[metaV4Name].split('/$metadata#');\n this.rootUrl = dataUrl[0];\n this.resourceTableName = dataUrl[1];\n }\n var pvtData = 'pvtData';\n var pvt = request && request[pvtData];\n var emptyAndBatch = _super.prototype.processBatchResponse.call(this, data, query, xhr, request, changes);\n if (emptyAndBatch) {\n return emptyAndBatch;\n }\n var count = null;\n var dataCount = '@odata.count';\n var dataV4Count = '@count';\n if (query && query.isCountRequired) {\n if (dataCount in data) {\n count = data[dataCount];\n }\n else if (dataV4Count in data) {\n count = data[dataV4Count];\n }\n }\n data = !isNullOrUndefined(data.value) ? data.value : data;\n var args = {};\n args.count = count;\n args.result = data;\n this.getAggregateResult(pvt, data, args, null, query);\n return DataUtil.isNull(count) ? args.result : { result: args.result, count: count, aggregates: args.aggregates };\n };\n return ODataV4Adaptor;\n}(ODataAdaptor));\nexport { ODataV4Adaptor };\n/**\n * The Web API is a programmatic interface to define the request and response messages system that is mostly exposed in JSON or XML.\n * The DataManager uses the WebApiAdaptor to consume Web API.\n * Since this adaptor is targeted to interact with Web API created using OData endpoint, it is extended from ODataAdaptor\n *\n * @hidden\n */\nvar WebApiAdaptor = /** @class */ (function (_super) {\n __extends(WebApiAdaptor, _super);\n function WebApiAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n WebApiAdaptor.prototype.getModuleName = function () {\n return 'WebApiAdaptor';\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n *\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName?\n * @param tableName\n */\n WebApiAdaptor.prototype.insert = function (dm, data, tableName) {\n return {\n type: 'POST',\n url: dm.dataSource.url,\n data: JSON.stringify(data)\n };\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {number} value\n * @param {string} tableName?\n * @param tableName\n */\n WebApiAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n return {\n type: 'DELETE',\n url: dm.dataSource.url + '/' + value,\n data: JSON.stringify(value)\n };\n };\n /**\n * Prepare and return request body which is used to update record.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @param tableName\n */\n WebApiAdaptor.prototype.update = function (dm, keyField, value, tableName) {\n return {\n type: 'PUT',\n url: dm.dataSource.url,\n data: JSON.stringify(value)\n };\n };\n WebApiAdaptor.prototype.batchRequest = function (dm, changes, e) {\n var _this = this;\n var initialGuid = e.guid = DataUtil.getGuid(this.options.batchPre);\n var url = dm.dataSource.url.replace(/\\/*$/, '/' + this.options.batch);\n e.url = this.resourceTableName ? this.resourceTableName : e.url;\n var req = [];\n var _loop_1 = function (i, x) {\n changes.addedRecords.forEach(function (j, d) {\n var stat = {\n 'method': 'POST ',\n 'url': function (data, i, key) { return ''; },\n 'data': function (data, i) { return JSON.stringify(data[i]) + '\\n\\n'; }\n };\n req.push('--' + initialGuid);\n req.push('Content-Type: application/http; msgtype=request', '');\n req.push('POST ' + '/api/' + (dm.dataSource.insertUrl || dm.dataSource.crudUrl || e.url)\n + stat.url(changes.addedRecords, i, e.key) + ' HTTP/1.1');\n req.push('Content-Type: ' + 'application/json; charset=utf-8');\n req.push('Host: ' + location.host);\n req.push('', j ? JSON.stringify(j) : '');\n });\n };\n //insertion\n for (var i = 0, x = changes.addedRecords.length; i < x; i++) {\n _loop_1(i, x);\n }\n var _loop_2 = function (i, x) {\n changes.changedRecords.forEach(function (j, d) {\n var stat = {\n 'method': _this.options.updateType + ' ',\n 'url': function (data, i, key) { return ''; },\n 'data': function (data, i) { return JSON.stringify(data[i]) + '\\n\\n'; }\n };\n req.push('--' + initialGuid);\n req.push('Content-Type: application/http; msgtype=request', '');\n req.push('PUT ' + '/api/' + (dm.dataSource.updateUrl || dm.dataSource.crudUrl || e.url)\n + stat.url(changes.changedRecords, i, e.key) + ' HTTP/1.1');\n req.push('Content-Type: ' + 'application/json; charset=utf-8');\n req.push('Host: ' + location.host);\n req.push('', j ? JSON.stringify(j) : '');\n });\n };\n //updation\n for (var i = 0, x = changes.changedRecords.length; i < x; i++) {\n _loop_2(i, x);\n }\n var _loop_3 = function (i, x) {\n changes.deletedRecords.forEach(function (j, d) {\n var state = {\n 'mtd': 'DELETE ',\n 'url': function (data, i, key) {\n var url = DataUtil.getObject(key, data[i]);\n if (typeof url === 'number' || DataUtil.parse.isGuid(url)) {\n return '/' + url;\n }\n else if (url instanceof Date) {\n var datTime = data[i][key];\n return '/' + datTime.toJSON();\n }\n else {\n return \"/'\" + url + \"'\";\n }\n },\n 'data': function (data, i) { return ''; }\n };\n req.push('--' + initialGuid);\n req.push('Content-Type: application/http; msgtype=request', '');\n req.push('DELETE ' + '/api/' + (dm.dataSource.removeUrl || dm.dataSource.crudUrl || e.url)\n + state.url(changes.deletedRecords, i, e.key) + ' HTTP/1.1');\n req.push('Content-Type: ' + 'application/json; charset=utf-8');\n req.push('Host: ' + location.host);\n req.push('', j ? JSON.stringify(j) : '');\n });\n };\n //deletion\n for (var i = 0, x = changes.deletedRecords.length; i < x; i++) {\n _loop_3(i, x);\n }\n req.push('--' + initialGuid + '--', '');\n return {\n type: 'POST',\n url: url,\n contentType: 'multipart/mixed; boundary=' + initialGuid,\n data: req.join('\\r\\n')\n };\n };\n /**\n * Method will trigger before send the request to server side.\n * Used to set the custom header or modify the request options.\n *\n * @param {DataManager} dm\n * @param {Request} request\n * @param {Fetch} settings\n * @returns void\n */\n WebApiAdaptor.prototype.beforeSend = function (dm, request, settings) {\n request.headers.set('Accept', 'application/json, text/javascript, */*; q=0.01');\n };\n /**\n * Returns the data from the query processing.\n *\n * @param {DataResult} data\n * @param {DataOptions} ds?\n * @param {Query} query?\n * @param {Request} xhr?\n * @param {Fetch} request?\n * @param {CrudOptions} changes?\n * @param ds\n * @param query\n * @param xhr\n * @param request\n * @param changes\n * @returns aggregateResult\n */\n WebApiAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n var pvtData = 'pvtData';\n var pvt = request && request[pvtData];\n var count = null;\n var args = {};\n if (request && request.type.toLowerCase() !== 'post') {\n var versionCheck = xhr && request.fetchRequest.headers.get('DataServiceVersion');\n var version = (versionCheck && parseInt(versionCheck, 10)) || 2;\n if (query && query.isCountRequired) {\n if (!DataUtil.isNull(data.Count)) {\n count = data.Count;\n }\n }\n if (version < 3 && data.Items) {\n data = data.Items;\n }\n args.count = count;\n args.result = data;\n this.getAggregateResult(pvt, data, args, null, query);\n }\n args.result = args.result || data;\n return DataUtil.isNull(count) ? args.result : { result: args.result, count: args.count, aggregates: args.aggregates };\n };\n return WebApiAdaptor;\n}(ODataAdaptor));\nexport { WebApiAdaptor };\n/**\n * WebMethodAdaptor can be used by DataManager to interact with web method.\n *\n * @hidden\n */\nvar WebMethodAdaptor = /** @class */ (function (_super) {\n __extends(WebMethodAdaptor, _super);\n function WebMethodAdaptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Prepare the request body based on the query.\n * The query information can be accessed at the WebMethod using variable named `value`.\n *\n * @param {DataManager} dm\n * @param {Query} query\n * @param {Object[]} hierarchyFilters?\n * @param hierarchyFilters\n * @returns application\n */\n WebMethodAdaptor.prototype.processQuery = function (dm, query, hierarchyFilters) {\n var obj = new UrlAdaptor().processQuery(dm, query, hierarchyFilters);\n var getData = 'data';\n var data = DataUtil.parse.parseJson(obj[getData]);\n var result = {};\n var value = 'value';\n if (data.param) {\n for (var i = 0; i < data.param.length; i++) {\n var param = data.param[i];\n var key = Object.keys(param)[0];\n result[key] = param[key];\n }\n }\n result[value] = data;\n var pvtData = 'pvtData';\n var url = 'url';\n return {\n data: JSON.stringify(result),\n url: obj[url],\n pvtData: obj[pvtData],\n type: 'POST',\n contentType: 'application/json; charset=utf-8'\n };\n };\n return WebMethodAdaptor;\n}(UrlAdaptor));\nexport { WebMethodAdaptor };\n/**\n * RemoteSaveAdaptor, extended from JsonAdaptor and it is used for binding local data and performs all DataManager queries in client-side.\n * It interacts with server-side only for CRUD operations.\n *\n * @hidden\n */\nvar RemoteSaveAdaptor = /** @class */ (function (_super) {\n __extends(RemoteSaveAdaptor, _super);\n /**\n * @hidden\n */\n function RemoteSaveAdaptor() {\n var _this = _super.call(this) || this;\n setValue('beforeSend', UrlAdaptor.prototype.beforeSend, _this);\n return _this;\n }\n RemoteSaveAdaptor.prototype.insert = function (dm, data, tableName, query, position) {\n this.pvt.position = position;\n this.updateType = 'add';\n return {\n url: dm.dataSource.insertUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: data,\n table: tableName,\n action: 'insert'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n RemoteSaveAdaptor.prototype.remove = function (dm, keyField, val, tableName, query) {\n _super.prototype.remove.call(this, dm, keyField, val);\n return {\n type: 'POST',\n url: dm.dataSource.removeUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n key: val,\n keyColumn: keyField,\n table: tableName,\n action: 'remove'\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n RemoteSaveAdaptor.prototype.update = function (dm, keyField, val, tableName, query) {\n this.updateType = 'update';\n this.updateKey = keyField;\n return {\n type: 'POST',\n url: dm.dataSource.updateUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n data: JSON.stringify(extend({}, {\n value: val,\n action: 'update',\n keyColumn: keyField,\n key: val[keyField],\n table: tableName\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n RemoteSaveAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes, e) {\n var i;\n var newData = request ? JSON.parse(request.data) : data;\n data = newData.action === 'batch' ? DataUtil.parse.parseJson(data) : data;\n if (this.updateType === 'add') {\n _super.prototype.insert.call(this, ds, data, null, null, this.pvt.position);\n }\n if (this.updateType === 'update') {\n _super.prototype.update.call(this, ds, this.updateKey, data);\n }\n this.updateType = undefined;\n if (data.added) {\n for (i = 0; i < data.added.length; i++) {\n _super.prototype.insert.call(this, ds, data.added[i]);\n }\n }\n if (data.changed) {\n for (i = 0; i < data.changed.length; i++) {\n _super.prototype.update.call(this, ds, e.key, data.changed[i]);\n }\n }\n if (data.deleted) {\n for (i = 0; i < data.deleted.length; i++) {\n _super.prototype.remove.call(this, ds, e.key, data.deleted[i]);\n }\n }\n return data;\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * Also perform the changes in the locally cached data to sync with the remote data.\n * The result is used by the batch request.\n *\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n * @param query\n * @param original\n */\n RemoteSaveAdaptor.prototype.batchRequest = function (dm, changes, e, query, original) {\n return {\n type: 'POST',\n url: dm.dataSource.batchUrl || dm.dataSource.crudUrl || dm.dataSource.url,\n contentType: 'application/json; charset=utf-8',\n dataType: 'json',\n data: JSON.stringify(extend({}, {\n changed: changes.changedRecords,\n added: changes.addedRecords,\n deleted: changes.deletedRecords,\n action: 'batch',\n table: e.url,\n key: e.key\n }, DataUtil.getAddParams(this, dm, query)))\n };\n };\n RemoteSaveAdaptor.prototype.addParams = function (options) {\n var urlParams = new UrlAdaptor();\n urlParams.addParams(options);\n };\n return RemoteSaveAdaptor;\n}(JsonAdaptor));\nexport { RemoteSaveAdaptor };\n/**\n * Fetch Adaptor that is extended from URL Adaptor, is used for handle data operations with user defined functions.\n *\n * @hidden\n */\nvar CustomDataAdaptor = /** @class */ (function (_super) {\n __extends(CustomDataAdaptor, _super);\n function CustomDataAdaptor(props) {\n var _this = _super.call(this) || this;\n // options replaced the default adaptor options\n _this.options = extend({}, _this.options, {\n getData: new Function(),\n addRecord: new Function(),\n updateRecord: new Function(),\n deleteRecord: new Function(),\n batchUpdate: new Function()\n });\n extend(_this.options, props || {});\n return _this;\n }\n CustomDataAdaptor.prototype.getModuleName = function () {\n return 'CustomDataAdaptor';\n };\n return CustomDataAdaptor;\n}(UrlAdaptor));\nexport { CustomDataAdaptor };\n/**\n * The GraphqlAdaptor that is extended from URL Adaptor, is used for retrieving data from the Graphql server.\n * It interacts with the Graphql server with all the DataManager Queries and performs CRUD operations.\n *\n * @hidden\n */\nvar GraphQLAdaptor = /** @class */ (function (_super) {\n __extends(GraphQLAdaptor, _super);\n function GraphQLAdaptor(options) {\n var _this = _super.call(this) || this;\n _this.opt = options;\n _this.schema = _this.opt.response;\n _this.query = _this.opt.query;\n /* eslint-disable @typescript-eslint/no-empty-function */\n // tslint:disable-next-line:no-empty\n _this.getVariables = _this.opt.getVariables ? _this.opt.getVariables : function () { };\n /* eslint-enable @typescript-eslint/no-empty-function */\n _this.getQuery = function () { return _this.query; };\n return _this;\n }\n GraphQLAdaptor.prototype.getModuleName = function () {\n return 'GraphQLAdaptor';\n };\n /**\n * Process the JSON data based on the provided queries.\n *\n * @param {DataManager} dm\n * @param {Query} query?\n * @param datamanager\n * @param query\n */\n GraphQLAdaptor.prototype.processQuery = function (datamanager, query) {\n var urlQuery = _super.prototype.processQuery.apply(this, arguments);\n var dm = JSON.parse(urlQuery.data);\n // constructing GraphQL parameters\n var keys = ['skip', 'take', 'sorted', 'table', 'select', 'where',\n 'search', 'requiresCounts', 'aggregates', 'params'];\n var temp = {};\n var str = 'searchwhereparams';\n keys.filter(function (e) {\n temp[e] = str.indexOf(e) > -1 ? JSON.stringify(dm[e]) : dm[e];\n });\n var vars = this.getVariables() || {};\n // tslint:disable-next-line:no-string-literal\n vars['datamanager'] = temp;\n var data = JSON.stringify({\n query: this.getQuery(),\n variables: vars\n });\n urlQuery.data = data;\n return urlQuery;\n };\n /**\n * Returns the data from the query processing.\n * It will also cache the data for later usage.\n *\n * @param {DataResult} data\n * @param {DataManager} ds?\n * @param {Query} query?\n * @param {Request} xhr?\n * @param {Object} request?\n * @param resData\n * @param ds\n * @param query\n * @param xhr\n * @param request\n * @returns DataResult\n */\n GraphQLAdaptor.prototype.processResponse = function (resData, ds, query, xhr, request) {\n var res = resData;\n var count;\n var aggregates;\n var result = getValue(this.schema.result, res.data);\n if (this.schema.count) {\n count = getValue(this.schema.count, res.data);\n }\n if (this.schema.aggregates) {\n aggregates = getValue(this.schema.aggregates, res.data);\n aggregates = !isNullOrUndefined(aggregates) ? DataUtil.parse.parseJson(aggregates) : aggregates;\n }\n var pvt = request.pvtData || {};\n var args = { result: result, aggregates: aggregates };\n var data = args;\n if (pvt && pvt.groups && pvt.groups.length) {\n this.getAggregateResult(pvt, data, args, null, query);\n }\n return !isNullOrUndefined(count) ? { result: args.result, count: count, aggregates: aggregates } : args.result;\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n */\n GraphQLAdaptor.prototype.insert = function () {\n var inserted = _super.prototype.insert.apply(this, arguments);\n return this.generateCrudData(inserted, 'insert');\n };\n /**\n * Prepare and returns request body which is used to update a new record in the table.\n */\n GraphQLAdaptor.prototype.update = function () {\n var inserted = _super.prototype.update.apply(this, arguments);\n return this.generateCrudData(inserted, 'update');\n };\n /**\n * Prepare and returns request body which is used to remove a new record in the table.\n */\n GraphQLAdaptor.prototype.remove = function () {\n var inserted = _super.prototype.remove.apply(this, arguments);\n return this.generateCrudData(inserted, 'remove');\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * The result is used by the batch request.\n *\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {Object} e\n * @param e.key\n * @param {Query} query\n * @param {Object} original\n */\n GraphQLAdaptor.prototype.batchRequest = function (dm, changes, e, query, original) {\n var batch = _super.prototype.batchRequest.apply(this, arguments);\n // tslint:disable-next-line:typedef\n var bData = JSON.parse(batch.data);\n bData.key = e.key;\n batch.data = JSON.stringify(bData);\n return this.generateCrudData(batch, 'batch');\n };\n GraphQLAdaptor.prototype.generateCrudData = function (crudData, action) {\n var parsed = JSON.parse(crudData.data);\n crudData.data = JSON.stringify({\n query: this.opt.getMutation(action),\n variables: parsed\n });\n return crudData;\n };\n return GraphQLAdaptor;\n}(UrlAdaptor));\nexport { GraphQLAdaptor };\n/**\n * Cache Adaptor is used to cache the data of the visited pages. It prevents new requests for the previously visited pages.\n * You can configure cache page size and duration of caching by using cachingPageSize and timeTillExpiration properties of the DataManager\n *\n * @hidden\n */\nvar CacheAdaptor = /** @class */ (function (_super) {\n __extends(CacheAdaptor, _super);\n /**\n * Constructor for CacheAdaptor class.\n *\n * @param {CacheAdaptor} adaptor?\n * @param {number} timeStamp?\n * @param {number} pageSize?\n * @param adaptor\n * @param timeStamp\n * @param pageSize\n * @hidden\n */\n function CacheAdaptor(adaptor, timeStamp, pageSize) {\n var _this = _super.call(this) || this;\n _this.isCrudAction = false;\n _this.isInsertAction = false;\n if (!isNullOrUndefined(adaptor)) {\n _this.cacheAdaptor = adaptor;\n }\n _this.pageSize = pageSize;\n _this.guidId = DataUtil.getGuid('cacheAdaptor');\n var obj = { keys: [], results: [] };\n window.localStorage.setItem(_this.guidId, JSON.stringify(obj));\n var guid = _this.guidId;\n if (!isNullOrUndefined(timeStamp)) {\n setInterval(function () {\n var data = DataUtil.parse.parseJson(window.localStorage.getItem(guid));\n var forDel = [];\n for (var i = 0; i < data.results.length; i++) {\n var currentTime = +new Date();\n var requestTime = +new Date(data.results[i].timeStamp);\n data.results[i].timeStamp = currentTime - requestTime;\n if (currentTime - requestTime > timeStamp) {\n forDel.push(i);\n }\n }\n for (var i = 0; i < forDel.length; i++) {\n data.results.splice(forDel[i], 1);\n data.keys.splice(forDel[i], 1);\n }\n window.localStorage.removeItem(guid);\n window.localStorage.setItem(guid, JSON.stringify(data));\n }, timeStamp);\n }\n return _this;\n }\n /**\n * It will generate the key based on the URL when we send a request to server.\n *\n * @param {string} url\n * @param {Query} query?\n * @param query\n * @hidden\n */\n CacheAdaptor.prototype.generateKey = function (url, query) {\n var queries = this.getQueryRequest(query);\n var singles = Query.filterQueryLists(query.queries, ['onSelect', 'onPage', 'onSkip', 'onTake', 'onRange']);\n var key = url;\n var page = 'onPage';\n if (page in singles) {\n key += singles[page].pageIndex;\n }\n queries.sorts.forEach(function (obj) {\n key += obj.e.direction + obj.e.fieldName;\n });\n queries.groups.forEach(function (obj) {\n key += obj.e.fieldName;\n });\n queries.searches.forEach(function (obj) {\n key += obj.e.searchKey;\n });\n for (var filter = 0; filter < queries.filters.length; filter++) {\n var currentFilter = queries.filters[filter];\n if (currentFilter.e.isComplex) {\n var newQuery = query.clone();\n newQuery.queries = [];\n for (var i = 0; i < currentFilter.e.predicates.length; i++) {\n newQuery.queries.push({ fn: 'onWhere', e: currentFilter.e.predicates[i], filter: query.queries.filter });\n }\n key += currentFilter.e.condition + this.generateKey(url, newQuery);\n }\n else {\n key += currentFilter.e.field + currentFilter.e.operator + currentFilter.e.value;\n }\n }\n return key;\n };\n /**\n * Process the query to generate request body.\n * If the data is already cached, it will return the cached data.\n *\n * @param {DataManager} dm\n * @param {Query} query?\n * @param {Object[]} hierarchyFilters?\n * @param query\n * @param hierarchyFilters\n */\n CacheAdaptor.prototype.processQuery = function (dm, query, hierarchyFilters) {\n var key = this.generateKey(dm.dataSource.url, query);\n var cachedItems = DataUtil.parse.parseJson(window.localStorage.getItem(this.guidId));\n var data = cachedItems ? cachedItems.results[cachedItems.keys.indexOf(key)] : null;\n if (data != null && !this.isCrudAction && !this.isInsertAction) {\n return data;\n }\n this.isCrudAction = null;\n this.isInsertAction = null;\n /* eslint-disable prefer-spread */\n return this.cacheAdaptor.processQuery.apply(this.cacheAdaptor, [].slice.call(arguments, 0));\n /* eslint-enable prefer-spread */\n };\n /**\n * Returns the data from the query processing.\n * It will also cache the data for later usage.\n *\n * @param {DataResult} data\n * @param {DataManager} ds?\n * @param {Query} query?\n * @param {Request} xhr?\n * @param {Fetch} request?\n * @param {CrudOptions} changes?\n * @param ds\n * @param query\n * @param xhr\n * @param request\n * @param changes\n */\n CacheAdaptor.prototype.processResponse = function (data, ds, query, xhr, request, changes) {\n if (this.isInsertAction || (request && this.cacheAdaptor.options.batch &&\n DataUtil.endsWith(request.url, this.cacheAdaptor.options.batch) && request.type.toLowerCase() === 'post')) {\n return this.cacheAdaptor.processResponse(data, ds, query, xhr, request, changes);\n }\n /* eslint-disable prefer-spread */\n data = this.cacheAdaptor.processResponse.apply(this.cacheAdaptor, [].slice.call(arguments, 0));\n /* eslint-enable prefer-spread */\n var key = query ? this.generateKey(ds.dataSource.url, query) : ds.dataSource.url;\n var obj = {};\n obj = DataUtil.parse.parseJson(window.localStorage.getItem(this.guidId));\n var index = obj.keys.indexOf(key);\n if (index !== -1) {\n obj.results.splice(index, 1);\n obj.keys.splice(index, 1);\n }\n obj.results[obj.keys.push(key) - 1] = { keys: key, result: data.result, timeStamp: new Date(), count: data.count };\n while (obj.results.length > this.pageSize) {\n obj.results.splice(0, 1);\n obj.keys.splice(0, 1);\n }\n window.localStorage.setItem(this.guidId, JSON.stringify(obj));\n return data;\n };\n /**\n * Method will trigger before send the request to server side. Used to set the custom header or modify the request options.\n *\n * @param {DataManager} dm\n * @param {Request} request\n * @param {Fetch} settings?\n * @param settings\n */\n CacheAdaptor.prototype.beforeSend = function (dm, request, settings) {\n if (!isNullOrUndefined(this.cacheAdaptor.options.batch) && DataUtil.endsWith(settings.url, this.cacheAdaptor.options.batch)\n && settings.type.toLowerCase() === 'post') {\n request.headers.set('Accept', this.cacheAdaptor.options.multipartAccept);\n }\n if (!dm.dataSource.crossDomain) {\n request.headers.set('Accept', this.cacheAdaptor.options.accept);\n }\n };\n /**\n * Updates existing record and saves the changes to the table.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName\n */\n CacheAdaptor.prototype.update = function (dm, keyField, value, tableName) {\n this.isCrudAction = true;\n return this.cacheAdaptor.update(dm, keyField, value, tableName);\n };\n /**\n * Prepare and returns request body which is used to insert a new record in the table.\n *\n * @param {DataManager} dm\n * @param {Object} data\n * @param {string} tableName?\n * @param tableName\n */\n CacheAdaptor.prototype.insert = function (dm, data, tableName) {\n this.isInsertAction = true;\n return this.cacheAdaptor.insert(dm, data, tableName);\n };\n /**\n * Prepare and return request body which is used to remove record from the table.\n *\n * @param {DataManager} dm\n * @param {string} keyField\n * @param {Object} value\n * @param {string} tableName?\n * @param tableName\n */\n CacheAdaptor.prototype.remove = function (dm, keyField, value, tableName) {\n this.isCrudAction = true;\n return this.cacheAdaptor.remove(dm, keyField, value, tableName);\n };\n /**\n * Prepare the request body based on the newly added, removed and updated records.\n * The result is used by the batch request.\n *\n * @param {DataManager} dm\n * @param {CrudOptions} changes\n * @param {RemoteArgs} e\n */\n CacheAdaptor.prototype.batchRequest = function (dm, changes, e) {\n return this.cacheAdaptor.batchRequest(dm, changes, e);\n };\n return CacheAdaptor;\n}(UrlAdaptor));\nexport { CacheAdaptor };\n","/* eslint-disable valid-jsdoc */\n/* eslint-disable security/detect-object-injection */\nimport { Fetch } from '@syncfusion/ej2-base';\nimport { extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { DataUtil } from './util';\nimport { Predicate, Query } from './query';\nimport { ODataAdaptor, JsonAdaptor, CacheAdaptor, RemoteSaveAdaptor, CustomDataAdaptor } from './adaptors';\n/**\n * DataManager is used to manage and manipulate relational data.\n */\nvar DataManager = /** @class */ (function () {\n /**\n * Constructor for DataManager class\n *\n * @param {DataOptions|JSON[]} dataSource?\n * @param {Query} query?\n * @param {AdaptorOptions|string} adaptor?\n * @param dataSource\n * @param query\n * @param adaptor\n * @hidden\n */\n function DataManager(dataSource, query, adaptor) {\n var _this = this;\n /** @hidden */\n this.dateParse = true;\n /** @hidden */\n this.timeZoneHandling = true;\n this.persistQuery = {};\n this.isInitialLoad = false;\n this.requests = [];\n this.isInitialLoad = true;\n if (!dataSource && !this.dataSource) {\n dataSource = [];\n }\n adaptor = adaptor || dataSource.adaptor;\n if (dataSource && dataSource.timeZoneHandling === false) {\n this.timeZoneHandling = dataSource.timeZoneHandling;\n }\n var data;\n if (dataSource instanceof Array) {\n data = {\n json: dataSource,\n offline: true\n };\n }\n else if (typeof dataSource === 'object') {\n if (!dataSource.json) {\n dataSource.json = [];\n }\n if (!dataSource.enablePersistence) {\n dataSource.enablePersistence = false;\n }\n if (!dataSource.id) {\n dataSource.id = '';\n }\n if (!dataSource.ignoreOnPersist) {\n dataSource.ignoreOnPersist = [];\n }\n data = {\n url: dataSource.url,\n insertUrl: dataSource.insertUrl,\n removeUrl: dataSource.removeUrl,\n updateUrl: dataSource.updateUrl,\n crudUrl: dataSource.crudUrl,\n batchUrl: dataSource.batchUrl,\n json: dataSource.json,\n headers: dataSource.headers,\n accept: dataSource.accept,\n data: dataSource.data,\n timeTillExpiration: dataSource.timeTillExpiration,\n cachingPageSize: dataSource.cachingPageSize,\n enableCaching: dataSource.enableCaching,\n requestType: dataSource.requestType,\n key: dataSource.key,\n crossDomain: dataSource.crossDomain,\n jsonp: dataSource.jsonp,\n dataType: dataSource.dataType,\n offline: dataSource.offline !== undefined ? dataSource.offline\n : dataSource.adaptor instanceof RemoteSaveAdaptor || dataSource.adaptor instanceof CustomDataAdaptor ?\n false : dataSource.url ? false : true,\n requiresFormat: dataSource.requiresFormat,\n enablePersistence: dataSource.enablePersistence,\n id: dataSource.id,\n ignoreOnPersist: dataSource.ignoreOnPersist\n };\n }\n else {\n DataUtil.throwError('DataManager: Invalid arguments');\n }\n if (data.requiresFormat === undefined && !DataUtil.isCors()) {\n data.requiresFormat = isNullOrUndefined(data.crossDomain) ? true : data.crossDomain;\n }\n if (data.dataType === undefined) {\n data.dataType = 'json';\n }\n this.dataSource = data;\n this.defaultQuery = query;\n if (this.dataSource.enablePersistence && this.dataSource.id) {\n window.addEventListener('unload', this.setPersistData.bind(this));\n }\n if (data.url && data.offline && !data.json.length) {\n this.isDataAvailable = false;\n this.adaptor = adaptor || new ODataAdaptor();\n this.dataSource.offline = false;\n this.ready = this.executeQuery(query || new Query());\n this.ready.then(function (e) {\n _this.dataSource.offline = true;\n _this.isDataAvailable = true;\n data.json = e.result;\n _this.adaptor = new JsonAdaptor();\n });\n }\n else {\n this.adaptor = data.offline ? new JsonAdaptor() : new ODataAdaptor();\n }\n if (!data.jsonp && this.adaptor instanceof ODataAdaptor) {\n data.jsonp = 'callback';\n }\n this.adaptor = adaptor || this.adaptor;\n if (data.enableCaching) {\n this.adaptor = new CacheAdaptor(this.adaptor, data.timeTillExpiration, data.cachingPageSize);\n }\n return this;\n }\n /**\n * Get the queries maintained in the persisted state.\n * @param {string} id - The identifier of the persisted query to retrieve.\n * @returns {object} The persisted data object.\n */\n DataManager.prototype.getPersistedData = function (id) {\n var persistedData = localStorage.getItem(id || this.dataSource.id);\n return JSON.parse(persistedData);\n };\n /**\n * Set the queries to be maintained in the persisted state.\n * @param {Event} e - The event parameter that triggers the setPersistData method.\n * @param {string} id - The identifier of the persisted query to set.\n * @param {object} persistData - The data to be persisted.\n * @returns {void} .\n */\n DataManager.prototype.setPersistData = function (e, id, persistData) {\n localStorage.setItem(id || this.dataSource.id, JSON.stringify(persistData || this.persistQuery));\n };\n DataManager.prototype.setPersistQuery = function (query) {\n var _this = this;\n var persistedQuery = this.getPersistedData();\n if (this.isInitialLoad && persistedQuery && Object.keys(persistedQuery).length) {\n this.persistQuery = persistedQuery;\n this.persistQuery.queries = this.persistQuery.queries.filter(function (query) {\n if (_this.dataSource.ignoreOnPersist && _this.dataSource.ignoreOnPersist.length) {\n if (query.fn && _this.dataSource.ignoreOnPersist.some(function (keyword) { return query.fn === keyword; })) {\n return false; // Exclude the matching query\n }\n }\n if (query.fn === 'onWhere') {\n var e = query.e;\n if (e && e.isComplex && e.predicates instanceof Array) {\n var allPredicates = e.predicates.map(function (predicateObj) {\n if (predicateObj.predicates && predicateObj.predicates instanceof Array) {\n // Process nested predicate array\n var nestedPredicates = predicateObj.predicates.map(function (nestedPredicate) {\n var field = nestedPredicate.field, operator = nestedPredicate.operator, value = nestedPredicate.value, ignoreCase = nestedPredicate.ignoreCase, ignoreAccent = nestedPredicate.ignoreAccent, matchCase = nestedPredicate.matchCase;\n return new Predicate(field, operator, value, ignoreCase, ignoreAccent, matchCase);\n });\n return predicateObj.condition === 'and' ? Predicate.and(nestedPredicates) : Predicate.or(nestedPredicates);\n }\n else {\n // Process individual predicate\n var field = predicateObj.field, operator = predicateObj.operator, value = predicateObj.value, ignoreCase = predicateObj.ignoreCase, ignoreAccent = predicateObj.ignoreAccent, matchCase = predicateObj.matchCase;\n return new Predicate(field, operator, value, ignoreCase, ignoreAccent, matchCase);\n }\n });\n query.e = new Predicate(allPredicates[0], e.condition, allPredicates.slice(1));\n }\n }\n return true; // Keep all other queries\n });\n var newQuery = extend(new Query(), this.persistQuery);\n this.isInitialLoad = false;\n return (newQuery);\n }\n else {\n this.persistQuery = query;\n this.isInitialLoad = false;\n return query;\n }\n };\n /**\n * Overrides DataManager's default query with given query.\n *\n * @param {Query} query - Defines the new default query.\n */\n DataManager.prototype.setDefaultQuery = function (query) {\n this.defaultQuery = query;\n return this;\n };\n /**\n * Executes the given query with local data source.\n *\n * @param {Query} query - Defines the query to retrieve data.\n */\n DataManager.prototype.executeLocal = function (query) {\n if (!this.defaultQuery && !(query instanceof Query)) {\n DataUtil.throwError('DataManager - executeLocal() : A query is required to execute');\n }\n if (!this.dataSource.json) {\n DataUtil.throwError('DataManager - executeLocal() : Json data is required to execute');\n }\n if (this.dataSource.enablePersistence && this.dataSource.id) {\n query = this.setPersistQuery(query);\n }\n query = query || this.defaultQuery;\n var result = this.adaptor.processQuery(this, query);\n if (query.subQuery) {\n var from = query.subQuery.fromTable;\n var lookup = query.subQuery.lookups;\n var res = query.isCountRequired ? result.result :\n result;\n if (lookup && lookup instanceof Array) {\n DataUtil.buildHierarchy(query.subQuery.fKey, from, res, lookup, query.subQuery.key);\n }\n for (var j = 0; j < res.length; j++) {\n if (res[j][from] instanceof Array) {\n res[j] = extend({}, {}, res[j]);\n res[j][from] = this.adaptor.processResponse(query.subQuery.using(new DataManager(res[j][from].slice(0))).executeLocal(), this, query);\n }\n }\n }\n return this.adaptor.processResponse(result, this, query);\n };\n /**\n * Executes the given query with either local or remote data source.\n * It will be executed as asynchronously and returns Promise object which will be resolved or rejected after action completed.\n *\n * @param {Query|Function} query - Defines the query to retrieve data.\n * @param {Function} done - Defines the callback function and triggers when the Promise is resolved.\n * @param {Function} fail - Defines the callback function and triggers when the Promise is rejected.\n * @param {Function} always - Defines the callback function and triggers when the Promise is resolved or rejected.\n */\n DataManager.prototype.executeQuery = function (query, done, fail, always) {\n var _this = this;\n var makeRequest = 'makeRequest';\n if (this.dataSource.enablePersistence && this.dataSource.id) {\n query = this.setPersistQuery(query);\n }\n if (typeof query === 'function') {\n always = fail;\n fail = done;\n done = query;\n query = null;\n }\n if (!query) {\n query = this.defaultQuery;\n }\n if (!(query instanceof Query)) {\n DataUtil.throwError('DataManager - executeQuery() : A query is required to execute');\n }\n var deffered = new Deferred();\n var args = { query: query };\n if (!this.dataSource.offline && (this.dataSource.url !== undefined && this.dataSource.url !== '')\n || (!isNullOrUndefined(this.adaptor[makeRequest])) || this.isCustomDataAdaptor(this.adaptor)) {\n var result = this.adaptor.processQuery(this, query);\n if (!isNullOrUndefined(this.adaptor[makeRequest])) {\n this.adaptor[makeRequest](result, deffered, args, query);\n }\n else if (!isNullOrUndefined(result.url) || this.isCustomDataAdaptor(this.adaptor)) {\n this.requests = [];\n this.makeRequest(result, deffered, args, query);\n }\n else {\n args = DataManager.getDeferedArgs(query, result, args);\n deffered.resolve(args);\n }\n }\n else {\n DataManager.nextTick(function () {\n var res = _this.executeLocal(query);\n args = DataManager.getDeferedArgs(query, res, args);\n deffered.resolve(args);\n });\n }\n if (done || fail) {\n deffered.promise.then(done, fail);\n }\n if (always) {\n deffered.promise.then(always, always);\n }\n return deffered.promise;\n };\n DataManager.getDeferedArgs = function (query, result, args) {\n if (query.isCountRequired) {\n args.result = result.result;\n args.count = result.count;\n args.aggregates = result.aggregates;\n }\n else {\n args.result = result;\n }\n return args;\n };\n DataManager.nextTick = function (fn) {\n /* eslint-disable @typescript-eslint/no-explicit-any */\n // tslint:disable-next-line:no-any\n (window.setImmediate || window.setTimeout)(fn, 0);\n /* eslint-enable @typescript-eslint/no-explicit-any */\n };\n DataManager.prototype.extendRequest = function (url, fnSuccess, fnFail) {\n return extend({}, {\n type: 'GET',\n dataType: this.dataSource.dataType,\n crossDomain: this.dataSource.crossDomain,\n jsonp: this.dataSource.jsonp,\n cache: true,\n processData: false,\n onSuccess: fnSuccess,\n onFailure: fnFail\n }, url);\n };\n // tslint:disable-next-line:max-func-body-length\n DataManager.prototype.makeRequest = function (url, deffered, args, query) {\n var _this = this;\n var isSelector = !!query.subQuerySelector;\n var fnFail = function (e) {\n args.error = e;\n deffered.reject(args);\n };\n var process = function (data, count, xhr, request, actual, aggregates, virtualSelectRecords) {\n args.xhr = xhr;\n args.count = count ? parseInt(count.toString(), 10) : 0;\n args.result = data;\n args.request = request;\n args.aggregates = aggregates;\n args.actual = actual;\n args.virtualSelectRecords = virtualSelectRecords;\n deffered.resolve(args);\n };\n var fnQueryChild = function (data, selector) {\n var subDeffer = new Deferred();\n var childArgs = { parent: args };\n query.subQuery.isChild = true;\n var subUrl = _this.adaptor.processQuery(_this, query.subQuery, data ? _this.adaptor.processResponse(data) : selector);\n var childReq = _this.makeRequest(subUrl, subDeffer, childArgs, query.subQuery);\n if (!isSelector) {\n subDeffer.then(function (subData) {\n if (data) {\n DataUtil.buildHierarchy(query.subQuery.fKey, query.subQuery.fromTable, data, subData, query.subQuery.key);\n process(data, subData.count, subData.xhr);\n }\n }, fnFail);\n }\n return childReq;\n };\n var fnSuccess = function (data, request) {\n if (_this.isGraphQLAdaptor(_this.adaptor)) {\n // tslint:disable-next-line:no-string-literal\n if (!isNullOrUndefined(data['errors'])) {\n // tslint:disable-next-line:no-string-literal\n return fnFail(data['errors'], request);\n }\n }\n if (_this.isCustomDataAdaptor(_this.adaptor)) {\n request = extend({}, _this.fetchReqOption, request);\n }\n if (request.contentType.indexOf('xml') === -1 && _this.dateParse) {\n data = DataUtil.parse.parseJson(data);\n }\n var result = _this.adaptor.processResponse(data, _this, query, request.fetchRequest, request);\n var count = 0;\n var aggregates = null;\n var virtualSelectRecords = 'virtualSelectRecords';\n var virtualRecords = data[virtualSelectRecords];\n if (query.isCountRequired) {\n count = result.count;\n aggregates = result.aggregates;\n result = result.result;\n }\n if (!query.subQuery) {\n process(result, count, request.fetchRequest, request.type, data, aggregates, virtualRecords);\n return;\n }\n if (!isSelector) {\n fnQueryChild(result, request);\n }\n };\n var req = this.extendRequest(url, fnSuccess, fnFail);\n if (!this.isCustomDataAdaptor(this.adaptor)) {\n var fetch_1 = new Fetch(req);\n fetch_1.beforeSend = function () {\n _this.beforeSend(fetch_1.fetchRequest, fetch_1);\n };\n req = fetch_1.send();\n req.catch(function (e) { return true; }); // to handle failure remote requests.\n this.requests.push(fetch_1);\n }\n else {\n this.fetchReqOption = req;\n var request = req;\n this.adaptor.options.getData({\n data: request.data,\n onSuccess: request.onSuccess, onFailure: request.onFailure\n });\n }\n if (isSelector) {\n var promise = void 0;\n var res = query.subQuerySelector.call(this, { query: query.subQuery, parent: query });\n if (res && res.length) {\n promise = Promise.all([req, fnQueryChild(null, res)]);\n promise.then(function () {\n var args = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n args[_i] = arguments[_i];\n }\n var result = args[0];\n var pResult = _this.adaptor.processResponse(result[0], _this, query, _this.requests[0].fetchRequest, _this.requests[0]);\n var count = 0;\n if (query.isCountRequired) {\n count = pResult.count;\n pResult = pResult.result;\n }\n var cResult = _this.adaptor.processResponse(result[1], _this, query.subQuery, _this.requests[1].fetchRequest, _this.requests[1]);\n count = 0;\n if (query.subQuery.isCountRequired) {\n count = cResult.count;\n cResult = cResult.result;\n }\n DataUtil.buildHierarchy(query.subQuery.fKey, query.subQuery.fromTable, pResult, cResult, query.subQuery.key);\n isSelector = false;\n process(pResult, count, _this.requests[0].fetchRequest);\n });\n }\n else {\n isSelector = false;\n }\n }\n return req;\n };\n DataManager.prototype.beforeSend = function (request, settings) {\n this.adaptor.beforeSend(this, request, settings);\n var headers = this.dataSource.headers;\n var props;\n for (var i = 0; headers && i < headers.length; i++) {\n props = [];\n var keys = Object.keys(headers[i]);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var prop = keys_1[_i];\n props.push(prop);\n request.headers.set(prop, headers[i][prop]);\n }\n }\n };\n /**\n * Save bulk changes to the given table name.\n * User can add a new record, edit an existing record, and delete a record at the same time.\n * If the datasource from remote, then updated in a single post.\n *\n * @param {Object} changes - Defines the CrudOptions.\n * @param {string} key - Defines the column field.\n * @param {string|Query} tableName - Defines the table name.\n * @param {Query} query - Sets default query for the DataManager.\n * @param original\n */\n DataManager.prototype.saveChanges = function (changes, key, tableName, query, original) {\n var _this = this;\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var args = {\n url: tableName,\n key: key || this.dataSource.key\n };\n var req = this.adaptor.batchRequest(this, changes, args, query || new Query(), original);\n var dofetchRequest = 'dofetchRequest';\n if (this.dataSource.offline) {\n return req;\n }\n if (!isNullOrUndefined(this.adaptor[dofetchRequest])) {\n return this.adaptor[dofetchRequest](req);\n }\n else if (!this.isCustomDataAdaptor(this.adaptor)) {\n var deff_1 = new Deferred();\n var fetch_2 = new Fetch(req);\n fetch_2.beforeSend = function () {\n _this.beforeSend(fetch_2.fetchRequest, fetch_2);\n };\n fetch_2.onSuccess = function (data, request) {\n if (_this.isGraphQLAdaptor(_this.adaptor)) {\n // tslint:disable-next-line:no-string-literal\n if (!isNullOrUndefined(data['errors'])) {\n // tslint:disable-next-line:no-string-literal\n fetch_2.onFailure(JSON.stringify(data['errors']));\n }\n }\n deff_1.resolve(_this.adaptor.processResponse(data, _this, null, request.fetchRequest, request, changes, args));\n };\n fetch_2.onFailure = function (e) {\n deff_1.reject([{ error: e }]);\n };\n fetch_2.send().catch(function (e) { return true; }); // to handle the failure requests.\n return deff_1.promise;\n }\n else {\n return this.dofetchRequest(req, this.adaptor.options.batchUpdate);\n }\n };\n /**\n * Inserts new record in the given table.\n *\n * @param {Object} data - Defines the data to insert.\n * @param {string|Query} tableName - Defines the table name.\n * @param {Query} query - Sets default query for the DataManager.\n * @param position\n */\n DataManager.prototype.insert = function (data, tableName, query, position) {\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var req = this.adaptor.insert(this, data, tableName, query, position);\n var dofetchRequest = 'dofetchRequest';\n if (this.dataSource.offline) {\n return req;\n }\n if (!isNullOrUndefined(this.adaptor[dofetchRequest])) {\n return this.adaptor[dofetchRequest](req);\n }\n else {\n return this.dofetchRequest(req, this.adaptor.options.addRecord);\n }\n };\n /**\n * Removes data from the table with the given key.\n *\n * @param {string} keyField - Defines the column field.\n * @param {Object} value - Defines the value to find the data in the specified column.\n * @param {string|Query} tableName - Defines the table name\n * @param {Query} query - Sets default query for the DataManager.\n */\n DataManager.prototype.remove = function (keyField, value, tableName, query) {\n if (typeof value === 'object') {\n value = DataUtil.getObject(keyField, value);\n }\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var res = this.adaptor.remove(this, keyField, value, tableName, query);\n var dofetchRequest = 'dofetchRequest';\n if (this.dataSource.offline) {\n return res;\n }\n if (!isNullOrUndefined(this.adaptor[dofetchRequest])) {\n return this.adaptor[dofetchRequest](res);\n }\n else {\n var remove = this.adaptor.options.deleteRecord;\n return this.dofetchRequest(res, remove);\n }\n };\n /**\n * Updates existing record in the given table.\n *\n * @param {string} keyField - Defines the column field.\n * @param {Object} value - Defines the value to find the data in the specified column.\n * @param {string|Query} tableName - Defines the table name\n * @param {Query} query - Sets default query for the DataManager.\n * @param original\n */\n DataManager.prototype.update = function (keyField, value, tableName, query, original) {\n if (tableName instanceof Query) {\n query = tableName;\n tableName = null;\n }\n var res = this.adaptor.update(this, keyField, value, tableName, query, original);\n var dofetchRequest = 'dofetchRequest';\n if (this.dataSource.offline) {\n return res;\n }\n if (!isNullOrUndefined(this.adaptor[dofetchRequest])) {\n return this.adaptor[dofetchRequest](res);\n }\n else {\n var update = this.adaptor.options.updateRecord;\n return this.dofetchRequest(res, update);\n }\n };\n DataManager.prototype.isCustomDataAdaptor = function (dataSource) {\n return this.adaptor.getModuleName &&\n this.adaptor.getModuleName() === 'CustomDataAdaptor';\n };\n DataManager.prototype.isGraphQLAdaptor = function (dataSource) {\n return this.adaptor.getModuleName &&\n this.adaptor.getModuleName() === 'GraphQLAdaptor';\n };\n DataManager.prototype.successFunc = function (record, request) {\n if (this.isGraphQLAdaptor(this.adaptor)) {\n var data = typeof record === 'object' ? record : JSON.parse(record);\n // tslint:disable-next-line:no-string-literal\n if (!isNullOrUndefined(data['errors'])) {\n // tslint:disable-next-line:no-string-literal\n this.failureFunc(JSON.stringify(data['errors']));\n }\n }\n if (this.isCustomDataAdaptor(this.adaptor)) {\n request = extend({}, this.fetchReqOption, request);\n }\n try {\n DataUtil.parse.parseJson(record);\n }\n catch (e) {\n record = [];\n }\n record = this.adaptor.processResponse(DataUtil.parse.parseJson(record), this, null, request.fetchRequest, request);\n this.fetchDeffered.resolve(record);\n };\n DataManager.prototype.failureFunc = function (e) {\n this.fetchDeffered.reject([{ error: e }]);\n };\n DataManager.prototype.dofetchRequest = function (res, fetchFunc) {\n var _this = this;\n res = extend({}, {\n type: 'POST',\n contentType: 'application/json; charset=utf-8',\n processData: false\n }, res);\n this.fetchDeffered = new Deferred();\n if (!this.isCustomDataAdaptor(this.adaptor)) {\n var fetch_3 = new Fetch(res);\n fetch_3.beforeSend = function () {\n _this.beforeSend(fetch_3.fetchRequest, fetch_3);\n };\n fetch_3.onSuccess = this.successFunc.bind(this);\n fetch_3.onFailure = this.failureFunc.bind(this);\n fetch_3.send().catch(function (e) { return true; }); // to handle the failure requests.\n }\n else {\n this.fetchReqOption = res;\n fetchFunc.call(this, {\n data: res.data, onSuccess: this.successFunc.bind(this),\n onFailure: this.failureFunc.bind(this)\n });\n }\n return this.fetchDeffered.promise;\n };\n DataManager.prototype.clearPersistence = function () {\n window.removeEventListener('unload', this.setPersistData.bind(this));\n this.dataSource.enablePersistence = false;\n this.persistQuery = {};\n window.localStorage.setItem(this.dataSource.id, '[]');\n };\n return DataManager;\n}());\nexport { DataManager };\n/**\n * Deferred is used to handle asynchronous operation.\n */\nvar Deferred = /** @class */ (function () {\n function Deferred() {\n var _this = this;\n /**\n * Promise is an object that represents a value that may not be available yet, but will be resolved at some point in the future.\n */\n this.promise = new Promise(function (resolve, reject) {\n _this.resolve = resolve;\n _this.reject = reject;\n });\n /**\n * Defines the callback function triggers when the Deferred object is resolved.\n */\n this.then = this.promise.then.bind(this.promise);\n /**\n * Defines the callback function triggers when the Deferred object is rejected.\n */\n this.catch = this.promise.catch.bind(this.promise);\n }\n return Deferred;\n}());\nexport { Deferred };\n","import { detach, getUniqueID, rippleEffect, setValue, attributes } from '@syncfusion/ej2-base';\nimport { getValue, addClass, deleteObject } from '@syncfusion/ej2-base';\n/**\n * Initialize wrapper element for angular.\n *\n * @private\n *\n * @param {CreateElementArgs} createElement - Specifies created element args\n * @param {string} tag - Specifies tag name\n * @param {string} type - Specifies type name\n * @param {HTMLInputElement} element - Specifies input element\n * @param {string} WRAPPER - Specifies wrapper element\n * @param {string} role - Specifies role\n * @returns {HTMLInputElement} - Input Element\n */\nexport function wrapperInitialize(createElement, tag, type, element, WRAPPER, role) {\n var input = element;\n if (element.tagName === tag) {\n var ejInstance = getValue('ej2_instances', element);\n input = createElement('input', { attrs: { 'type': type } });\n var props = ['change', 'cssClass', 'label', 'labelPosition', 'id'];\n for (var index = 0, len = element.attributes.length; index < len; index++) {\n if (props.indexOf(element.attributes[index].nodeName) === -1) {\n input.setAttribute(element.attributes[index].nodeName, element.attributes[index].nodeValue);\n }\n }\n attributes(element, { 'class': WRAPPER });\n element.appendChild(input);\n setValue('ej2_instances', ejInstance, input);\n deleteObject(element, 'ej2_instances');\n }\n return input;\n}\n/**\n * Get the text node.\n *\n * @param {HTMLElement} element - Specifies html element\n * @private\n * @returns {Node} - Text node.\n */\nexport function getTextNode(element) {\n var node;\n var childnode = element.childNodes;\n for (var i = 0; i < childnode.length; i++) {\n node = childnode[i];\n if (node.nodeType === 3) {\n return node;\n }\n }\n return null;\n}\n/**\n * Destroy the button components.\n *\n * @private\n * @param {Switch | CheckBox} ejInst - Specifies eJ2 Instance\n * @param {Element} wrapper - Specifies wrapper element\n * @param {string} tagName - Specifies tag name\n * @returns {void}\n */\nexport function destroy(ejInst, wrapper, tagName) {\n if (tagName === 'INPUT') {\n wrapper.parentNode.insertBefore(ejInst.element, wrapper);\n detach(wrapper);\n ejInst.element.checked = false;\n ['name', 'value', 'disabled'].forEach(function (key) {\n ejInst.element.removeAttribute(key);\n });\n }\n else {\n ['role', 'aria-checked', 'class'].forEach(function (key) {\n wrapper.removeAttribute(key);\n });\n wrapper.innerHTML = '';\n ejInst.element = wrapper;\n }\n}\n/**\n * Initialize control pre rendering.\n *\n * @private\n * @param {Switch | CheckBox} proxy - Specifies proxy\n * @param {string} control - Specifies control\n * @param {string} wrapper - Specifies wrapper element\n * @param {HTMLInputElement} element - Specifies input element\n * @param {string} moduleName - Specifies module name\n * @returns {void}\n */\nexport function preRender(proxy, control, wrapper, element, moduleName) {\n element = wrapperInitialize(proxy.createElement, control, 'checkbox', element, wrapper, moduleName);\n proxy.element = element;\n if (proxy.element.getAttribute('type') !== 'checkbox') {\n proxy.element.setAttribute('type', 'checkbox');\n }\n if (!proxy.element.id) {\n proxy.element.id = getUniqueID('e-' + moduleName);\n }\n}\n/**\n * Creates CheckBox component UI with theming and ripple support.\n *\n * @private\n * @param {CreateElementArgs} createElement - Specifies Created Element args\n * @param {boolean} enableRipple - Specifies ripple effect\n * @param {CheckBoxUtilModel} options - Specifies Checkbox util Model\n * @returns {Element} - Checkbox Element\n */\nexport function createCheckBox(createElement, enableRipple, options) {\n if (enableRipple === void 0) { enableRipple = false; }\n if (options === void 0) { options = {}; }\n var wrapper = createElement('div', { className: 'e-checkbox-wrapper e-css' });\n if (options.cssClass) {\n addClass([wrapper], options.cssClass.split(' '));\n }\n if (options.enableRtl) {\n wrapper.classList.add('e-rtl');\n }\n if (enableRipple) {\n var rippleSpan = createElement('span', { className: 'e-ripple-container' });\n rippleEffect(rippleSpan, { isCenterRipple: true, duration: 400 });\n wrapper.appendChild(rippleSpan);\n }\n var frameSpan = createElement('span', { className: 'e-frame e-icons' });\n if (options.checked) {\n frameSpan.classList.add('e-check');\n }\n wrapper.appendChild(frameSpan);\n if (options.label) {\n var labelSpan = createElement('span', { className: 'e-label' });\n if (options.disableHtmlEncode) {\n labelSpan.textContent = options.label;\n }\n else {\n labelSpan.innerHTML = options.label;\n }\n wrapper.appendChild(labelSpan);\n }\n return wrapper;\n}\n/**\n * Handles ripple mouse.\n *\n * @private\n * @param {MouseEvent} e - Specifies mouse event\n * @param {Element} rippleSpan - Specifies Ripple span element\n * @returns {void}\n */\nexport function rippleMouseHandler(e, rippleSpan) {\n if (rippleSpan) {\n var event_1 = document.createEvent('MouseEvents');\n event_1.initEvent(e.type, false, true);\n rippleSpan.dispatchEvent(event_1);\n }\n}\n/**\n * Append hidden input to given element\n *\n * @private\n * @param {Switch | CheckBox} proxy - Specifies Proxy\n * @param {Element} wrap - Specifies Wrapper ELement\n * @returns {void}\n */\nexport function setHiddenInput(proxy, wrap) {\n if (proxy.element.getAttribute('ejs-for')) {\n wrap.appendChild(proxy.createElement('input', {\n attrs: { 'name': proxy.name || proxy.element.name, 'value': 'false', 'type': 'hidden' }\n }));\n }\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, NotifyPropertyChanges, Component, isBlazor, isRippleEnabled } from '@syncfusion/ej2-base';\nimport { addClass, Event, detach, removeClass } from '@syncfusion/ej2-base';\nimport { rippleEffect, EventHandler, Observer, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { getTextNode } from '../common/common';\n/**\n * Defines the icon position of button.\n */\nexport var IconPosition;\n(function (IconPosition) {\n /**\n * Positions the Icon at the left of the text content in the Button.\n */\n IconPosition[\"Left\"] = \"Left\";\n /**\n * Positions the Icon at the right of the text content in the Button.\n */\n IconPosition[\"Right\"] = \"Right\";\n /**\n * Positions the Icon at the top of the text content in the Button.\n */\n IconPosition[\"Top\"] = \"Top\";\n /**\n * Positions the Icon at the bottom of the text content in the Button.\n */\n IconPosition[\"Bottom\"] = \"Bottom\";\n})(IconPosition || (IconPosition = {}));\nexport var buttonObserver = new Observer();\nvar cssClassName = {\n RTL: 'e-rtl',\n BUTTON: 'e-btn',\n PRIMARY: 'e-primary',\n ICONBTN: 'e-icon-btn'\n};\n/**\n * The Button is a graphical user interface element that triggers an event on its click action. It can contain a text, an image, or both.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar Button = /** @class */ (function (_super) {\n __extends(Button, _super);\n /**\n * Constructor for creating the widget\n *\n * @param {ButtonModel} options - Specifies the button model\n * @param {string|HTMLButtonElement} element - Specifies the target element\n */\n function Button(options, element) {\n return _super.call(this, options, element) || this;\n }\n Button.prototype.preRender = function () {\n // pre render code snippets\n };\n /**\n * Initialize the control rendering\n *\n * @returns {void}\n * @private\n */\n Button.prototype.render = function () {\n this.initialize();\n this.removeRippleEffect = rippleEffect(this.element, { selector: '.' + cssClassName.BUTTON });\n this.renderComplete();\n };\n Button.prototype.initialize = function () {\n if (this.cssClass) {\n addClass([this.element], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n if (this.isPrimary) {\n this.element.classList.add(cssClassName.PRIMARY);\n }\n if (!isBlazor() || (isBlazor() && this.getModuleName() !== 'progress-btn')) {\n if (this.content) {\n var tempContent = (this.enableHtmlSanitizer) ? SanitizeHtmlHelper.sanitize(this.content) : this.content;\n this.element.innerHTML = tempContent;\n }\n this.setIconCss();\n }\n if (this.enableRtl) {\n this.element.classList.add(cssClassName.RTL);\n }\n if (this.disabled) {\n this.controlStatus(this.disabled);\n }\n else {\n this.wireEvents();\n }\n };\n Button.prototype.controlStatus = function (disabled) {\n this.element.disabled = disabled;\n };\n Button.prototype.setIconCss = function () {\n if (this.iconCss) {\n var span = this.createElement('span', { className: 'e-btn-icon ' + this.iconCss });\n if (!this.element.textContent.trim()) {\n this.element.classList.add(cssClassName.ICONBTN);\n }\n else {\n span.classList.add('e-icon-' + this.iconPosition.toLowerCase());\n if (this.iconPosition === 'Top' || this.iconPosition === 'Bottom') {\n this.element.classList.add('e-' + this.iconPosition.toLowerCase() + '-icon-btn');\n }\n }\n var node = this.element.childNodes[0];\n if (node && (this.iconPosition === 'Left' || this.iconPosition === 'Top')) {\n this.element.insertBefore(span, node);\n }\n else {\n this.element.appendChild(span);\n }\n }\n };\n Button.prototype.wireEvents = function () {\n if (this.isToggle) {\n EventHandler.add(this.element, 'click', this.btnClickHandler, this);\n }\n };\n Button.prototype.unWireEvents = function () {\n if (this.isToggle) {\n EventHandler.remove(this.element, 'click', this.btnClickHandler);\n }\n };\n Button.prototype.btnClickHandler = function () {\n if (this.element.classList.contains('e-active')) {\n this.element.classList.remove('e-active');\n }\n else {\n this.element.classList.add('e-active');\n }\n };\n /**\n * Destroys the widget.\n *\n * @returns {void}\n */\n Button.prototype.destroy = function () {\n var classList = [cssClassName.PRIMARY, cssClassName.RTL, cssClassName.ICONBTN, 'e-success', 'e-info', 'e-danger',\n 'e-warning', 'e-flat', 'e-outline', 'e-small', 'e-bigger', 'e-active', 'e-round',\n 'e-top-icon-btn', 'e-bottom-icon-btn'];\n if (this.cssClass) {\n classList = classList.concat(this.cssClass.split(' '));\n }\n _super.prototype.destroy.call(this);\n removeClass([this.element], classList);\n if (!this.element.getAttribute('class')) {\n this.element.removeAttribute('class');\n }\n if (this.disabled) {\n this.element.removeAttribute('disabled');\n }\n if (this.content) {\n this.element.innerHTML = this.element.innerHTML.replace(this.content, '');\n }\n var span = this.element.querySelector('span.e-btn-icon');\n if (span) {\n detach(span);\n }\n this.unWireEvents();\n if (isRippleEnabled) {\n this.removeRippleEffect();\n }\n };\n /**\n * Get component name.\n *\n * @returns {string} - Module name\n * @private\n */\n Button.prototype.getModuleName = function () {\n return 'btn';\n };\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @returns {string} - Persist Data\n * @private\n */\n Button.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Dynamically injects the required modules to the component.\n *\n * @private\n * @returns {void}\n */\n Button.Inject = function () {\n // Inject code snippets\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {ButtonModel} newProp - Specifies new properties\n * @param {ButtonModel} oldProp - Specifies old properties\n * @returns {void}\n * @private\n */\n Button.prototype.onPropertyChanged = function (newProp, oldProp) {\n var span = this.element.querySelector('span.e-btn-icon');\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'isPrimary':\n if (newProp.isPrimary) {\n this.element.classList.add(cssClassName.PRIMARY);\n }\n else {\n this.element.classList.remove(cssClassName.PRIMARY);\n }\n break;\n case 'disabled':\n this.controlStatus(newProp.disabled);\n break;\n case 'iconCss': {\n span = this.element.querySelector('span.e-btn-icon');\n if (span) {\n if (newProp.iconCss) {\n span.className = 'e-btn-icon ' + newProp.iconCss;\n if (this.element.textContent.trim()) {\n if (this.iconPosition === 'Left') {\n span.classList.add('e-icon-left');\n }\n else {\n span.classList.add('e-icon-right');\n }\n }\n }\n else {\n detach(span);\n }\n }\n else {\n this.setIconCss();\n }\n break;\n }\n case 'iconPosition':\n removeClass([this.element], ['e-top-icon-btn', 'e-bottom-icon-btn']);\n span = this.element.querySelector('span.e-btn-icon');\n if (span) {\n detach(span);\n }\n this.setIconCss();\n break;\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([this.element], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([this.element], newProp.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n break;\n case 'enableRtl':\n if (newProp.enableRtl) {\n this.element.classList.add(cssClassName.RTL);\n }\n else {\n this.element.classList.remove(cssClassName.RTL);\n }\n break;\n case 'content': {\n var node = getTextNode(this.element);\n if (!node) {\n this.element.classList.remove(cssClassName.ICONBTN);\n }\n if (!isBlazor() || (isBlazor() && !this.isServerRendered && this.getModuleName() !== 'progress-btn')) {\n if (this.enableHtmlSanitizer) {\n newProp.content = SanitizeHtmlHelper.sanitize(newProp.content);\n }\n this.element.innerHTML = newProp.content;\n this.setIconCss();\n }\n break;\n }\n case 'isToggle':\n if (newProp.isToggle) {\n EventHandler.add(this.element, 'click', this.btnClickHandler, this);\n }\n else {\n EventHandler.remove(this.element, 'click', this.btnClickHandler);\n removeClass([this.element], ['e-active']);\n }\n break;\n }\n }\n };\n /**\n * Click the button element\n * its native method\n *\n * @public\n * @returns {void}\n */\n Button.prototype.click = function () {\n this.element.click();\n };\n /**\n * Sets the focus to Button\n * its native method\n *\n * @public\n * @returns {void}\n */\n Button.prototype.focusIn = function () {\n this.element.focus();\n };\n __decorate([\n Property('Left')\n ], Button.prototype, \"iconPosition\", void 0);\n __decorate([\n Property('')\n ], Button.prototype, \"iconCss\", void 0);\n __decorate([\n Property(false)\n ], Button.prototype, \"disabled\", void 0);\n __decorate([\n Property(false)\n ], Button.prototype, \"isPrimary\", void 0);\n __decorate([\n Property('')\n ], Button.prototype, \"cssClass\", void 0);\n __decorate([\n Property('')\n ], Button.prototype, \"content\", void 0);\n __decorate([\n Property(false)\n ], Button.prototype, \"isToggle\", void 0);\n __decorate([\n Property()\n ], Button.prototype, \"locale\", void 0);\n __decorate([\n Property(true)\n ], Button.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Event()\n ], Button.prototype, \"created\", void 0);\n Button = __decorate([\n NotifyPropertyChanges\n ], Button);\n return Button;\n}(Component));\nexport { Button };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, Property, setValue } from '@syncfusion/ej2-base';\nimport { Event, EventHandler, isNullOrUndefined, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { addClass, detach, getUniqueID, isRippleEnabled, removeClass, rippleEffect, closest } from '@syncfusion/ej2-base';\nimport { wrapperInitialize, rippleMouseHandler, setHiddenInput } from './../common/common';\nvar CHECK = 'e-check';\nvar DISABLED = 'e-checkbox-disabled';\nvar FRAME = 'e-frame';\nvar INDETERMINATE = 'e-stop';\nvar LABEL = 'e-label';\nvar RIPPLE = 'e-ripple-container';\nvar RIPPLECHECK = 'e-ripple-check';\nvar RIPPLEINDETERMINATE = 'e-ripple-stop';\nvar RTL = 'e-rtl';\nvar WRAPPER = 'e-checkbox-wrapper';\nvar containerAttr = ['title', 'class', 'style', 'disabled', 'readonly', 'name', 'value', 'id', 'tabindex'];\n/**\n * The CheckBox is a graphical user interface element that allows you to select one or more options from the choices.\n * It contains checked, unchecked, and indeterminate states.\n * ```html\n * \n * \n * ```\n */\nvar CheckBox = /** @class */ (function (_super) {\n __extends(CheckBox, _super);\n /**\n * Constructor for creating the widget\n *\n * @private\n * @param {CheckBoxModel} options - Specifies checkbox model\n * @param {string | HTMLInputElement} element - Specifies target element\n */\n function CheckBox(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isFocused = false;\n _this.isMouseClick = false;\n _this.clickTriggered = false;\n _this.validCheck = true;\n return _this;\n }\n CheckBox.prototype.changeState = function (state, isInitialize) {\n var ariaState;\n var wrapper = this.getWrapper();\n var rippleSpan = null;\n var frameSpan = null;\n if (wrapper) {\n frameSpan = wrapper.getElementsByClassName(FRAME)[0];\n if (isRippleEnabled) {\n rippleSpan = wrapper.getElementsByClassName(RIPPLE)[0];\n }\n }\n if (state === 'check') {\n if (frameSpan) {\n frameSpan.classList.remove(INDETERMINATE);\n frameSpan.classList.add(CHECK);\n }\n if (rippleSpan) {\n rippleSpan.classList.remove(RIPPLEINDETERMINATE);\n rippleSpan.classList.add(RIPPLECHECK);\n }\n ariaState = 'true';\n this.element.checked = true;\n if ((this.element.required || closest(this.element, 'form') && closest(this.element, 'form').classList.contains('e-formvalidator')) && this.validCheck && !isInitialize) {\n this.element.checked = false;\n this.validCheck = false;\n }\n else if (this.element.required || closest(this.element, 'form') && closest(this.element, 'form').classList.contains('e-formvalidator')) {\n this.validCheck = true;\n }\n }\n else if (state === 'uncheck') {\n if (frameSpan) {\n removeClass([frameSpan], [CHECK, INDETERMINATE]);\n }\n if (rippleSpan) {\n removeClass([rippleSpan], [RIPPLECHECK, RIPPLEINDETERMINATE]);\n }\n ariaState = 'false';\n this.element.checked = false;\n if ((this.element.required || closest(this.element, 'form') && closest(this.element, 'form').classList.contains('e-formvalidator')) && this.validCheck && !isInitialize) {\n this.element.checked = true;\n this.validCheck = false;\n }\n else if (this.element.required || closest(this.element, 'form') && closest(this.element, 'form').classList.contains('e-formvalidator')) {\n this.validCheck = true;\n }\n }\n else {\n if (frameSpan) {\n frameSpan.classList.remove(CHECK);\n frameSpan.classList.add(INDETERMINATE);\n }\n if (rippleSpan) {\n rippleSpan.classList.remove(RIPPLECHECK);\n rippleSpan.classList.add(RIPPLEINDETERMINATE);\n }\n ariaState = 'mixed';\n this.element.indeterminate = true;\n this.indeterminate = true;\n }\n };\n CheckBox.prototype.clickHandler = function (event) {\n if (event.target.tagName === 'INPUT' && this.clickTriggered) {\n if (this.isVue) {\n this.changeState(this.checked ? 'check' : 'uncheck');\n }\n this.clickTriggered = false;\n return;\n }\n if (event.target.tagName === 'SPAN' || event.target.tagName === 'LABEL') {\n this.clickTriggered = true;\n }\n if (this.isMouseClick) {\n this.focusOutHandler();\n this.isMouseClick = false;\n }\n if (this.indeterminate) {\n this.changeState(this.checked ? 'check' : 'uncheck');\n this.indeterminate = false;\n this.element.indeterminate = false;\n }\n else if (this.checked) {\n this.changeState('uncheck');\n this.checked = false;\n }\n else {\n this.changeState('check');\n this.checked = true;\n }\n var changeEventArgs = { checked: this.updateVueArrayModel(false), event: event };\n this.trigger('change', changeEventArgs);\n event.stopPropagation();\n };\n /**\n * Destroys the widget.\n *\n * @returns {void}\n */\n CheckBox.prototype.destroy = function () {\n var _this = this;\n var wrapper = this.getWrapper();\n _super.prototype.destroy.call(this);\n if (this.wrapper) {\n wrapper = this.wrapper;\n if (!this.disabled) {\n this.unWireEvents();\n }\n if (this.tagName === 'INPUT') {\n if (this.getWrapper() && wrapper.parentNode) {\n wrapper.parentNode.insertBefore(this.element, wrapper);\n }\n detach(wrapper);\n this.element.checked = false;\n if (this.indeterminate) {\n this.element.indeterminate = false;\n }\n ['name', 'value', 'disabled'].forEach(function (key) {\n _this.element.removeAttribute(key);\n });\n }\n else {\n ['class'].forEach(function (key) {\n wrapper.removeAttribute(key);\n });\n wrapper.innerHTML = '';\n this.element = wrapper;\n if (this.refreshing) {\n ['e-control', 'e-checkbox', 'e-lib'].forEach(function (key) {\n _this.element.classList.add(key);\n });\n setValue('ej2_instances', [this], this.element);\n }\n }\n }\n };\n CheckBox.prototype.focusHandler = function () {\n this.isFocused = true;\n };\n CheckBox.prototype.focusOutHandler = function () {\n var wrapper = this.getWrapper();\n if (wrapper) {\n wrapper.classList.remove('e-focus');\n }\n this.isFocused = false;\n };\n /**\n * Gets the module name.\n *\n * @private\n * @returns {string} - Module Name\n */\n CheckBox.prototype.getModuleName = function () {\n return 'checkbox';\n };\n /**\n * Gets the properties to be maintained in the persistence state.\n *\n * @private\n * @returns {string} - Persist Data\n */\n CheckBox.prototype.getPersistData = function () {\n return this.addOnPersist(['checked', 'indeterminate']);\n };\n CheckBox.prototype.getWrapper = function () {\n if (this.element && this.element.parentElement) {\n return this.element.parentElement.parentElement;\n }\n else {\n return null;\n }\n };\n CheckBox.prototype.getLabel = function () {\n if (this.element) {\n return this.element.parentElement;\n }\n else {\n return null;\n }\n };\n CheckBox.prototype.initialize = function () {\n if (isNullOrUndefined(this.initialCheckedValue)) {\n this.initialCheckedValue = this.checked;\n }\n if (this.name) {\n this.element.setAttribute('name', this.name);\n }\n if (this.value) {\n this.element.setAttribute('value', this.value);\n if (this.isVue && typeof this.value === 'boolean' && this.value === true) {\n this.setProperties({ 'checked': true }, true);\n }\n }\n if (this.checked) {\n this.changeState('check', true);\n }\n if (this.indeterminate) {\n this.changeState();\n }\n if (this.disabled) {\n this.setDisabled();\n }\n };\n CheckBox.prototype.initWrapper = function () {\n var wrapper = this.element.parentElement;\n if (!wrapper.classList.contains(WRAPPER)) {\n wrapper = this.createElement('div', {\n className: WRAPPER\n });\n if (this.element.parentNode) {\n this.element.parentNode.insertBefore(wrapper, this.element);\n }\n }\n var label = this.createElement('label', { attrs: { for: this.element.id } });\n var frameSpan = this.createElement('span', { className: 'e-icons ' + FRAME });\n wrapper.classList.add('e-wrapper');\n if (this.enableRtl) {\n wrapper.classList.add(RTL);\n }\n if (this.cssClass) {\n addClass([wrapper], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n wrapper.appendChild(label);\n label.appendChild(this.element);\n setHiddenInput(this, label);\n label.appendChild(frameSpan);\n if (isRippleEnabled) {\n var rippleSpan = this.createElement('span', { className: RIPPLE });\n if (this.labelPosition === 'Before') {\n label.appendChild(rippleSpan);\n }\n else {\n label.insertBefore(rippleSpan, frameSpan);\n }\n rippleEffect(rippleSpan, { duration: 400, isCenterRipple: true });\n }\n if (this.label) {\n this.setText(this.label);\n }\n };\n CheckBox.prototype.keyUpHandler = function () {\n if (this.isFocused) {\n this.getWrapper().classList.add('e-focus');\n }\n };\n CheckBox.prototype.labelMouseDownHandler = function (e) {\n this.isMouseClick = true;\n var rippleSpan = this.getWrapper().getElementsByClassName(RIPPLE)[0];\n rippleMouseHandler(e, rippleSpan);\n };\n CheckBox.prototype.labelMouseLeaveHandler = function (e) {\n var rippleSpan = this.getLabel().getElementsByClassName(RIPPLE)[0];\n if (rippleSpan) {\n var rippleElem = rippleSpan.querySelectorAll('.e-ripple-element');\n for (var i = rippleElem.length - 1; i > 0; i--) {\n rippleSpan.removeChild(rippleSpan.childNodes[i]);\n }\n rippleMouseHandler(e, rippleSpan);\n }\n };\n CheckBox.prototype.labelMouseUpHandler = function (e) {\n this.isMouseClick = true;\n var rippleSpan = this.getWrapper().getElementsByClassName(RIPPLE)[0];\n if (rippleSpan) {\n var rippleElem = rippleSpan.querySelectorAll('.e-ripple-element');\n for (var i = 0; i < rippleElem.length - 1; i++) {\n rippleSpan.removeChild(rippleSpan.childNodes[i]);\n }\n rippleMouseHandler(e, rippleSpan);\n }\n };\n /**\n * Called internally if any of the property value changes.\n *\n * @private\n * @param {CheckBoxModel} newProp - Specifies new Properties\n * @param {CheckBoxModel} oldProp - Specifies old Properties\n *\n * @returns {void}\n */\n CheckBox.prototype.onPropertyChanged = function (newProp, oldProp) {\n var wrapper = this.getWrapper();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'checked':\n this.indeterminate = false;\n this.element.indeterminate = false;\n this.changeState(newProp.checked ? 'check' : 'uncheck');\n break;\n case 'indeterminate':\n if (newProp.indeterminate) {\n this.changeState();\n }\n else {\n this.element.indeterminate = false;\n this.changeState(this.checked ? 'check' : 'uncheck');\n }\n break;\n case 'disabled':\n if (newProp.disabled) {\n this.setDisabled();\n this.wrapper = this.getWrapper();\n this.unWireEvents();\n }\n else {\n this.element.disabled = false;\n wrapper.classList.remove(DISABLED);\n wrapper.setAttribute('aria-disabled', 'false');\n this.wireEvents();\n }\n break;\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([wrapper], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([wrapper], newProp.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n break;\n case 'enableRtl':\n if (newProp.enableRtl) {\n wrapper.classList.add(RTL);\n }\n else {\n wrapper.classList.remove(RTL);\n }\n break;\n case 'label':\n this.setText(newProp.label);\n break;\n case 'labelPosition': {\n var label = wrapper.getElementsByClassName(LABEL)[0];\n var labelWrap = wrapper.getElementsByTagName('label')[0];\n detach(label);\n if (newProp.labelPosition === 'After') {\n labelWrap.appendChild(label);\n }\n else {\n labelWrap.insertBefore(label, wrapper.getElementsByClassName(FRAME)[0]);\n }\n break;\n }\n case 'name':\n this.element.setAttribute('name', newProp.name);\n break;\n case 'value':\n if (this.isVue && typeof newProp.value === 'object') {\n break;\n }\n this.element.setAttribute('value', newProp.value);\n break;\n case 'htmlAttributes':\n this.updateHtmlAttributeToWrapper();\n break;\n }\n }\n };\n /**\n * Initialize Angular, React and Unique ID support.\n *\n * @private\n * @returns {void}\n */\n CheckBox.prototype.preRender = function () {\n var element = this.element;\n this.tagName = this.element.tagName;\n element = wrapperInitialize(this.createElement, 'EJS-CHECKBOX', 'checkbox', element, WRAPPER, 'checkbox');\n this.element = element;\n if (this.element.getAttribute('type') !== 'checkbox') {\n this.element.setAttribute('type', 'checkbox');\n }\n if (!this.element.id) {\n this.element.id = getUniqueID('e-' + this.getModuleName());\n }\n };\n /**\n * Initialize the control rendering.\n *\n * @private\n * @returns {void}\n */\n CheckBox.prototype.render = function () {\n this.initWrapper();\n this.initialize();\n if (!this.disabled) {\n this.wireEvents();\n }\n this.updateHtmlAttributeToWrapper();\n this.updateVueArrayModel(true);\n this.renderComplete();\n this.wrapper = this.getWrapper();\n };\n CheckBox.prototype.setDisabled = function () {\n var wrapper = this.getWrapper();\n this.element.disabled = true;\n wrapper.classList.add(DISABLED);\n wrapper.setAttribute('aria-disabled', 'true');\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n CheckBox.prototype.setText = function (text) {\n var wrapper = this.getWrapper();\n if (!wrapper) {\n return;\n }\n var label = wrapper.getElementsByClassName(LABEL)[0];\n if (label) {\n label.textContent = text;\n }\n else {\n text = (this.enableHtmlSanitizer) ? SanitizeHtmlHelper.sanitize(text) : text;\n label = this.createElement('span', { className: LABEL, innerHTML: text });\n var labelWrap = wrapper.getElementsByTagName('label')[0];\n if (this.labelPosition === 'Before') {\n labelWrap.insertBefore(label, wrapper.getElementsByClassName(FRAME)[0]);\n }\n else {\n labelWrap.appendChild(label);\n }\n }\n };\n CheckBox.prototype.changeHandler = function (e) {\n e.stopPropagation();\n };\n CheckBox.prototype.formResetHandler = function () {\n this.checked = this.initialCheckedValue;\n this.element.checked = this.initialCheckedValue;\n };\n CheckBox.prototype.unWireEvents = function () {\n var wrapper = this.wrapper;\n EventHandler.remove(wrapper, 'click', this.clickHandler);\n EventHandler.remove(this.element, 'keyup', this.keyUpHandler);\n EventHandler.remove(this.element, 'focus', this.focusHandler);\n EventHandler.remove(this.element, 'focusout', this.focusOutHandler);\n var label = wrapper.getElementsByTagName('label')[0];\n if (label) {\n EventHandler.remove(label, 'mousedown', this.labelMouseDownHandler);\n EventHandler.remove(label, 'mouseup', this.labelMouseUpHandler);\n EventHandler.remove(label, 'mouseleave', this.labelMouseLeaveHandler);\n }\n var formElem = closest(this.element, 'form');\n if (formElem) {\n EventHandler.remove(formElem, 'reset', this.formResetHandler);\n }\n if (this.tagName === 'EJS-CHECKBOX') {\n EventHandler.remove(this.element, 'change', this.changeHandler);\n }\n };\n CheckBox.prototype.wireEvents = function () {\n var wrapper = this.getWrapper();\n EventHandler.add(wrapper, 'click', this.clickHandler, this);\n EventHandler.add(this.element, 'keyup', this.keyUpHandler, this);\n EventHandler.add(this.element, 'focus', this.focusHandler, this);\n EventHandler.add(this.element, 'focusout', this.focusOutHandler, this);\n var label = wrapper.getElementsByTagName('label')[0];\n EventHandler.add(label, 'mousedown', this.labelMouseDownHandler, this);\n EventHandler.add(label, 'mouseup', this.labelMouseUpHandler, this);\n EventHandler.add(label, 'mouseleave', this.labelMouseLeaveHandler, this);\n var formElem = closest(this.element, 'form');\n if (formElem) {\n EventHandler.add(formElem, 'reset', this.formResetHandler, this);\n }\n if (this.tagName === 'EJS-CHECKBOX') {\n EventHandler.add(this.element, 'change', this.changeHandler, this);\n }\n };\n CheckBox.prototype.updateVueArrayModel = function (init) {\n if (this.isVue && typeof this.value === 'object') {\n var value = this.element.value;\n if (value && this.value) {\n if (init) {\n for (var i = 0; i < this.value.length; i++) {\n if (value === this.value[i]) {\n this.changeState('check');\n this.setProperties({ 'checked': true }, true);\n }\n }\n }\n else {\n var index = this.value.indexOf(value);\n if (this.checked) {\n if (index < 0) {\n this.value.push(value);\n }\n }\n else {\n if (index > -1) {\n this.value.splice(index, 1);\n }\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return this.value;\n }\n }\n }\n return this.validCheck ? this.element.checked : !this.element.checked;\n };\n CheckBox.prototype.updateHtmlAttributeToWrapper = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n var wrapper = this.getWrapper();\n if (containerAttr.indexOf(key) > -1) {\n if (key === 'class') {\n addClass([wrapper], this.htmlAttributes[\"\" + key].split(' '));\n }\n else if (key === 'title') {\n wrapper.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n else if (key === 'style') {\n var frameSpan = this.getWrapper().getElementsByClassName(FRAME)[0];\n frameSpan.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n else if (key === 'disabled') {\n if (this.htmlAttributes[\"\" + key] === 'true') {\n this.setDisabled();\n }\n this.element.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n else {\n this.element.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n else {\n wrapper.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n }\n };\n /**\n * Click the CheckBox element\n * its native method\n *\n * @public\n * @returns {void}\n */\n CheckBox.prototype.click = function () {\n this.element.click();\n };\n /**\n * Sets the focus to CheckBox\n * its native method\n *\n * @public\n * @returns {void}\n */\n CheckBox.prototype.focusIn = function () {\n this.element.focus();\n };\n __decorate([\n Event()\n ], CheckBox.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], CheckBox.prototype, \"created\", void 0);\n __decorate([\n Property(false)\n ], CheckBox.prototype, \"checked\", void 0);\n __decorate([\n Property('')\n ], CheckBox.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], CheckBox.prototype, \"disabled\", void 0);\n __decorate([\n Property(false)\n ], CheckBox.prototype, \"indeterminate\", void 0);\n __decorate([\n Property('')\n ], CheckBox.prototype, \"label\", void 0);\n __decorate([\n Property('After')\n ], CheckBox.prototype, \"labelPosition\", void 0);\n __decorate([\n Property('')\n ], CheckBox.prototype, \"name\", void 0);\n __decorate([\n Property('')\n ], CheckBox.prototype, \"value\", void 0);\n __decorate([\n Property(true)\n ], CheckBox.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property({})\n ], CheckBox.prototype, \"htmlAttributes\", void 0);\n CheckBox = __decorate([\n NotifyPropertyChanges\n ], CheckBox);\n return CheckBox;\n}(Component));\nexport { CheckBox };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, rippleEffect, NotifyPropertyChanges, Property, closest, setValue } from '@syncfusion/ej2-base';\nimport { addClass, getInstance, getUniqueID, isRippleEnabled, removeClass, attributes, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { detach, Event, EventHandler, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { wrapperInitialize, rippleMouseHandler } from './../common/common';\nvar LABEL = 'e-label';\nvar RIPPLE = 'e-ripple-container';\nvar RTL = 'e-rtl';\nvar WRAPPER = 'e-radio-wrapper';\nvar ATTRIBUTES = ['title', 'class', 'style', 'disabled', 'readonly', 'name', 'value', 'id', 'tabindex'];\n/**\n * The RadioButton is a graphical user interface element that allows you to select one option from the choices.\n * It contains checked and unchecked states.\n * ```html\n * \n * \n * ```\n */\nvar RadioButton = /** @class */ (function (_super) {\n __extends(RadioButton, _super);\n /**\n * Constructor for creating the widget\n *\n * @private\n * @param {RadioButtonModel} options - Specifies Radio button model\n * @param {string | HTMLInputElement} element - Specifies target element\n */\n function RadioButton(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isFocused = false;\n return _this;\n }\n RadioButton_1 = RadioButton;\n RadioButton.prototype.changeHandler = function (event) {\n this.checked = true;\n this.dataBind();\n var value = this.element.getAttribute('value');\n value = this.isVue && value ? this.element.value : this.value;\n var type = typeof this.value;\n if (this.isVue && type === 'boolean') {\n value = value === 'true' ? true : false;\n }\n this.trigger('change', { value: value, event: event });\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isAngular) {\n event.stopPropagation();\n }\n };\n RadioButton.prototype.updateChange = function () {\n var input;\n var instance;\n var radioGrp = this.getRadioGroup();\n for (var i = 0; i < radioGrp.length; i++) {\n input = radioGrp[i];\n if (input !== this.element) {\n instance = getInstance(input, RadioButton_1);\n instance.checked = false;\n if (this.tagName === 'EJS-RADIOBUTTON') {\n instance.angularValue = this.value;\n }\n }\n }\n };\n /**\n * Destroys the widget.\n *\n * @returns {void}\n */\n RadioButton.prototype.destroy = function () {\n var _this = this;\n var radioWrap = this.wrapper;\n _super.prototype.destroy.call(this);\n if (radioWrap) {\n if (!this.disabled) {\n this.unWireEvents();\n }\n if (this.tagName === 'INPUT') {\n if (radioWrap.parentNode) {\n radioWrap.parentNode.insertBefore(this.element, radioWrap);\n }\n detach(radioWrap);\n this.element.checked = false;\n ['name', 'value', 'disabled'].forEach(function (key) {\n _this.element.removeAttribute(key);\n });\n }\n else {\n ['role', 'aria-checked', 'class'].forEach(function (key) {\n radioWrap.removeAttribute(key);\n });\n radioWrap.innerHTML = '';\n this.element = this.wrapper;\n if (this.refreshing) {\n ['e-control', 'e-radio', 'e-lib'].forEach(function (key) {\n _this.element.classList.add(key);\n });\n setValue('ej2_instances', [this], this.element);\n }\n }\n }\n };\n RadioButton.prototype.focusHandler = function () {\n this.isFocused = true;\n };\n RadioButton.prototype.focusOutHandler = function () {\n var label = this.getLabel();\n if (label) {\n label.classList.remove('e-focus');\n }\n };\n RadioButton.prototype.getModuleName = function () {\n return 'radio';\n };\n /**\n * To get the value of selected radio button in a group.\n *\n * @method getSelectedValue\n * @returns {string} - Selected Value\n */\n RadioButton.prototype.getSelectedValue = function () {\n var input;\n var radioGrp = this.getRadioGroup();\n for (var i = 0, len = radioGrp.length; i < len; i++) {\n input = radioGrp[i];\n if (input.checked) {\n return input.value;\n }\n }\n return '';\n };\n RadioButton.prototype.getRadioGroup = function () {\n return document.querySelectorAll('input.e-radio[name=\"' + this.element.getAttribute('name') + '\"]');\n };\n /**\n * Gets the properties to be maintained in the persistence state.\n *\n * @private\n * @returns {string} - Persist Data\n */\n RadioButton.prototype.getPersistData = function () {\n return this.addOnPersist(['checked']);\n };\n RadioButton.prototype.getWrapper = function () {\n if (this.element.parentElement) {\n return this.element.parentElement;\n }\n else {\n return null;\n }\n };\n RadioButton.prototype.getLabel = function () {\n if (this.element.nextElementSibling) {\n return this.element.nextElementSibling;\n }\n else {\n return null;\n }\n };\n RadioButton.prototype.initialize = function () {\n if (isNullOrUndefined(this.initialCheckedValue)) {\n this.initialCheckedValue = this.checked;\n }\n this.initWrapper();\n this.updateHtmlAttribute();\n if (this.name) {\n this.element.setAttribute('name', this.name);\n }\n var value = this.element.getAttribute('value');\n var type = typeof this.value;\n if (this.isVue && type === 'boolean') {\n value = value === 'true' ? true : false;\n }\n if (this.isVue ? this.value && type !== 'boolean' && !value : this.value) {\n this.element.setAttribute('value', this.value);\n }\n if (this.checked) {\n this.element.checked = true;\n }\n if (this.disabled) {\n this.setDisabled();\n }\n };\n RadioButton.prototype.initWrapper = function () {\n var rippleSpan;\n var wrapper = this.element.parentElement;\n if (!wrapper.classList.contains(WRAPPER)) {\n wrapper = this.createElement('div', { className: WRAPPER });\n if (this.element.parentNode) {\n this.element.parentNode.insertBefore(wrapper, this.element);\n }\n }\n var label = this.createElement('label', { attrs: { for: this.element.id } });\n wrapper.appendChild(this.element);\n wrapper.appendChild(label);\n if (isRippleEnabled) {\n rippleSpan = this.createElement('span', { className: (RIPPLE) });\n label.appendChild(rippleSpan);\n rippleEffect(rippleSpan, {\n duration: 400,\n isCenterRipple: true\n });\n }\n wrapper.classList.add('e-wrapper');\n if (this.enableRtl) {\n label.classList.add(RTL);\n }\n if (this.cssClass) {\n addClass([wrapper], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n if (this.label) {\n this.setText(this.label);\n }\n };\n RadioButton.prototype.keyUpHandler = function () {\n if (this.isFocused) {\n this.getLabel().classList.add('e-focus');\n }\n };\n RadioButton.prototype.labelMouseDownHandler = function (e) {\n var rippleSpan = this.getLabel().getElementsByClassName(RIPPLE)[0];\n rippleMouseHandler(e, rippleSpan);\n };\n RadioButton.prototype.labelMouseLeaveHandler = function (e) {\n var rippleSpan = this.getLabel().getElementsByClassName(RIPPLE)[0];\n if (rippleSpan) {\n var rippleElem = rippleSpan.querySelectorAll('.e-ripple-element');\n for (var i = rippleElem.length - 1; i > 0; i--) {\n rippleSpan.removeChild(rippleSpan.childNodes[i]);\n }\n rippleMouseHandler(e, rippleSpan);\n }\n };\n RadioButton.prototype.labelMouseUpHandler = function (e) {\n var rippleSpan = this.getLabel().getElementsByClassName(RIPPLE)[0];\n if (rippleSpan) {\n var rippleElem = rippleSpan.querySelectorAll('.e-ripple-element');\n for (var i = rippleElem.length - 1; i > 0; i--) {\n rippleSpan.removeChild(rippleSpan.childNodes[i]);\n }\n rippleMouseHandler(e, rippleSpan);\n }\n };\n RadioButton.prototype.formResetHandler = function () {\n this.checked = this.initialCheckedValue;\n if (this.initialCheckedValue) {\n attributes(this.element, { 'checked': 'true' });\n }\n };\n /**\n * Called internally if any of the property value changes.\n *\n * @private\n * @param {RadioButtonModel} newProp - Specifies New Properties\n * @param {RadioButtonModel} oldProp - Specifies Old Properties\n * @returns {void}\n */\n RadioButton.prototype.onPropertyChanged = function (newProp, oldProp) {\n var wrap = this.getWrapper();\n var label = this.getLabel();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'checked':\n if (newProp.checked) {\n this.updateChange();\n }\n this.element.checked = newProp.checked;\n break;\n case 'disabled':\n if (newProp.disabled) {\n this.setDisabled();\n this.unWireEvents();\n }\n else {\n this.element.disabled = false;\n this.wireEvents();\n }\n break;\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([wrap], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([wrap], newProp.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n break;\n case 'enableRtl':\n if (newProp.enableRtl) {\n label.classList.add(RTL);\n }\n else {\n label.classList.remove(RTL);\n }\n break;\n case 'label':\n this.setText(newProp.label);\n break;\n case 'labelPosition':\n if (newProp.labelPosition === 'Before') {\n label.classList.add('e-right');\n }\n else {\n label.classList.remove('e-right');\n }\n break;\n case 'name':\n this.element.setAttribute('name', newProp.name);\n break;\n case 'value':\n var type = typeof this.htmlAttributes.value;\n if (!isNullOrUndefined(this.htmlAttributes) && (this.htmlAttributes.value || type === 'boolean' && !this.htmlAttributes.value)) {\n break;\n }\n this.element.setAttribute('value', newProp.value);\n break;\n case 'htmlAttributes':\n this.updateHtmlAttribute();\n break;\n }\n }\n };\n /**\n * Initialize checked Property, Angular and React and Unique ID support.\n *\n * @private\n * @returns {void}\n */\n RadioButton.prototype.preRender = function () {\n var element = this.element;\n this.formElement = closest(this.element, 'form');\n this.tagName = this.element.tagName;\n element = wrapperInitialize(this.createElement, 'EJS-RADIOBUTTON', 'radio', element, WRAPPER, 'radio');\n this.element = element;\n if (this.element.getAttribute('type') !== 'radio') {\n this.element.setAttribute('type', 'radio');\n }\n if (!this.element.id) {\n this.element.id = getUniqueID('e-' + this.getModuleName());\n }\n if (this.tagName === 'EJS-RADIOBUTTON') {\n var formControlName = this.element.getAttribute('formcontrolname');\n if (formControlName) {\n this.setProperties({ 'name': formControlName }, true);\n this.element.setAttribute('name', formControlName);\n }\n }\n };\n /**\n * Initialize the control rendering\n *\n * @private\n * @returns {void}\n */\n RadioButton.prototype.render = function () {\n this.initialize();\n if (!this.disabled) {\n this.wireEvents();\n }\n this.renderComplete();\n this.wrapper = this.getWrapper();\n };\n RadioButton.prototype.setDisabled = function () {\n this.element.disabled = true;\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n RadioButton.prototype.setText = function (text) {\n var label = this.getLabel();\n var textLabel = label.getElementsByClassName(LABEL)[0];\n if (textLabel) {\n textLabel.textContent = text;\n }\n else {\n text = (this.enableHtmlSanitizer) ? SanitizeHtmlHelper.sanitize(text) : text;\n textLabel = this.createElement('span', { className: LABEL, innerHTML: text });\n label.appendChild(textLabel);\n }\n if (this.labelPosition === 'Before') {\n this.getLabel().classList.add('e-right');\n }\n else {\n this.getLabel().classList.remove('e-right');\n }\n };\n RadioButton.prototype.updateHtmlAttribute = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n var wrapper = this.element.parentElement;\n if (ATTRIBUTES.indexOf(key) > -1) {\n if (key === 'class') {\n addClass([wrapper], this.htmlAttributes[\"\" + key].replace(/\\s+/g, ' ').trim().split(' '));\n }\n else if (key === 'title' || key === 'style') {\n wrapper.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n else {\n this.element.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n else {\n wrapper.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n }\n };\n RadioButton.prototype.unWireEvents = function () {\n var label = this.wrapper;\n EventHandler.remove(this.element, 'change', this.changeHandler);\n EventHandler.remove(this.element, 'focus', this.focusHandler);\n EventHandler.remove(this.element, 'focusout', this.focusOutHandler);\n EventHandler.remove(this.element, 'keyup', this.keyUpHandler);\n var rippleLabel = label.getElementsByTagName('label')[0];\n if (rippleLabel) {\n EventHandler.remove(rippleLabel, 'mousedown', this.labelMouseDownHandler);\n EventHandler.remove(rippleLabel, 'mouseup', this.labelMouseUpHandler);\n EventHandler.remove(rippleLabel, 'mouseleave', this.labelMouseLeaveHandler);\n }\n if (this.formElement) {\n EventHandler.remove(this.formElement, 'reset', this.formResetHandler);\n }\n };\n RadioButton.prototype.wireEvents = function () {\n var label = this.getLabel();\n EventHandler.add(this.element, 'change', this.changeHandler, this);\n EventHandler.add(this.element, 'keyup', this.keyUpHandler, this);\n EventHandler.add(this.element, 'focus', this.focusHandler, this);\n EventHandler.add(this.element, 'focusout', this.focusOutHandler, this);\n var rippleLabel = label.getElementsByClassName(LABEL)[0];\n if (rippleLabel) {\n EventHandler.add(rippleLabel, 'mousedown', this.labelMouseDownHandler, this);\n EventHandler.add(rippleLabel, 'mouseup', this.labelMouseUpHandler, this);\n EventHandler.add(rippleLabel, 'mouseleave', this.labelMouseLeaveHandler, this);\n }\n if (this.formElement) {\n EventHandler.add(this.formElement, 'reset', this.formResetHandler, this);\n }\n };\n /**\n * Click the RadioButton element\n * its native method\n *\n * @public\n * @returns {void}\n */\n RadioButton.prototype.click = function () {\n this.element.click();\n };\n /**\n * Sets the focus to RadioButton\n * its native method\n *\n * @public\n * @returns {void}\n */\n RadioButton.prototype.focusIn = function () {\n this.element.focus();\n };\n var RadioButton_1;\n __decorate([\n Event()\n ], RadioButton.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], RadioButton.prototype, \"created\", void 0);\n __decorate([\n Property(false)\n ], RadioButton.prototype, \"checked\", void 0);\n __decorate([\n Property('')\n ], RadioButton.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], RadioButton.prototype, \"disabled\", void 0);\n __decorate([\n Property('')\n ], RadioButton.prototype, \"label\", void 0);\n __decorate([\n Property('After')\n ], RadioButton.prototype, \"labelPosition\", void 0);\n __decorate([\n Property('')\n ], RadioButton.prototype, \"name\", void 0);\n __decorate([\n Property('')\n ], RadioButton.prototype, \"value\", void 0);\n __decorate([\n Property(true)\n ], RadioButton.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property({})\n ], RadioButton.prototype, \"htmlAttributes\", void 0);\n RadioButton = RadioButton_1 = __decorate([\n NotifyPropertyChanges\n ], RadioButton);\n return RadioButton;\n}(Component));\nexport { RadioButton };\n","/* eslint-disable no-inner-declarations */\nimport { extend, merge, isNullOrUndefined, getValue, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { attributes, prepend, isVisible, append, addClass } from '@syncfusion/ej2-base';\nimport { compile } from '@syncfusion/ej2-base';\nimport { DataManager, Query } from '@syncfusion/ej2-data';\nexport var cssClass = {\n li: 'e-list-item',\n ul: 'e-list-parent e-ul',\n group: 'e-list-group-item',\n icon: 'e-list-icon',\n text: 'e-list-text',\n check: 'e-list-check',\n checked: 'e-checked',\n selected: 'e-selected',\n expanded: 'e-expanded',\n textContent: 'e-text-content',\n hasChild: 'e-has-child',\n level: 'e-level',\n url: 'e-list-url',\n collapsible: 'e-icon-collapsible',\n disabled: 'e-disabled',\n image: 'e-list-img',\n iconWrapper: 'e-icon-wrapper',\n anchorWrap: 'e-anchor-wrap',\n navigable: 'e-navigable'\n};\n/**\n * Base List Generator\n */\n// eslint-disable-next-line @typescript-eslint/no-namespace\nexport var ListBase;\n(function (ListBase) {\n /**\n *\n * Default mapped fields.\n */\n ListBase.defaultMappedFields = {\n id: 'id',\n text: 'text',\n url: 'url',\n value: 'value',\n isChecked: 'isChecked',\n enabled: 'enabled',\n expanded: 'expanded',\n selected: 'selected',\n iconCss: 'iconCss',\n child: 'child',\n isVisible: 'isVisible',\n hasChildren: 'hasChildren',\n tooltip: 'tooltip',\n htmlAttributes: 'htmlAttributes',\n urlAttributes: 'urlAttributes',\n imageAttributes: 'imageAttributes',\n imageUrl: 'imageUrl',\n groupBy: null,\n sortBy: null\n };\n var defaultAriaAttributes = {\n level: 1,\n listRole: 'presentation',\n itemRole: 'presentation',\n groupItemRole: 'group',\n itemText: 'list-item',\n wrapperRole: 'presentation'\n };\n var defaultListBaseOptions = {\n showCheckBox: false,\n showIcon: false,\n enableHtmlSanitizer: false,\n expandCollapse: false,\n fields: ListBase.defaultMappedFields,\n ariaAttributes: defaultAriaAttributes,\n listClass: '',\n itemClass: '',\n processSubChild: false,\n sortOrder: 'None',\n template: null,\n groupTemplate: null,\n headerTemplate: null,\n expandIconClass: 'e-icon-collapsible',\n moduleName: 'list',\n expandIconPosition: 'Right',\n itemNavigable: false\n };\n /**\n * Function helps to created and return the UL Li element based on your data.\n *\n * @param {createElementParams} createElement - Specifies an array of JSON data.\n *\n * @param {{Object}[]} dataSource - Specifies an array of JSON data.\n *\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n *\n * @param {boolean} isSingleLevel? - Specifies the list options that need to provide.\n *\n * @param {any} componentInstance? - Specifies the list options that need to provide.\n *\n * @returns {createElement} createListFromJson - Specifies the list options that need to provide.\n */\n function createList(createElement, dataSource, \n // eslint-disable-next-line\n options, isSingleLevel, componentInstance) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var type = typeofData(dataSource).typeof;\n if (type === 'string' || type === 'number') {\n return createListFromArray(createElement, dataSource, isSingleLevel, options, componentInstance);\n }\n else {\n return createListFromJson(createElement, dataSource, options, ariaAttributes.level, isSingleLevel, componentInstance);\n }\n }\n ListBase.createList = createList;\n /**\n * Function helps to created an element list based on string array input .\n *\n * @param {createElementParams} createElement - Specifies an array of JSON data.\n *\n * @param {{Object}[]} dataSource - Specifies an array of JSON data.\n *\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n *\n * @param {boolean} isSingleLevel? - Specifies the list options that need to provide.\n *\n * @param {any} componentInstance? - Specifies the list options that need to provide.\n *\n * @returns {createElement} generateUL - returns the list options that need to provide.\n */\n function createListFromArray(createElement, dataSource, \n // tslint:disable-next-line\n // eslint-disable-next-line\n isSingleLevel, options, componentInstance) {\n var subChild = createListItemFromArray(createElement, dataSource, isSingleLevel, options, componentInstance);\n return generateUL(createElement, subChild, null, options);\n }\n ListBase.createListFromArray = createListFromArray;\n /**\n * Function helps to created an element list based on string array input .\n *\n * @param {createElementParams} createElement - Specifies an array of JSON data.\n *\n * @param {{Object}[]} dataSource - Specifies an array of JSON data.\n *\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n *\n * @param {boolean} isSingleLevel? - Specifies the list options that need to provide.\n *\n * @param {any} componentInstance? - Specifies the list options that need to provide.\n *\n * @returns {HTMLElement[]} subChild - returns the list options that need to provide.\n */\n function createListItemFromArray(createElement, dataSource, \n // eslint-disable-next-line\n isSingleLevel, options, componentInstance) {\n var subChild = [];\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var id = generateId(); // generate id for drop-down-list option.\n for (var i = 0; i < dataSource.length; i++) {\n if (isNullOrUndefined(dataSource[i])) {\n continue;\n }\n var li = void 0;\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: dataSource[i],\n options: curOpt\n };\n curOpt.itemCreating(curData);\n }\n if (isSingleLevel) {\n li = generateSingleLevelLI(createElement, dataSource[i], undefined, null, null, [], null, id, i, options);\n }\n else {\n li = generateLI(createElement, dataSource[i], undefined, null, null, options, componentInstance);\n }\n if (curOpt.itemCreated && typeof curOpt.itemCreated === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: dataSource[i],\n item: li,\n options: curOpt\n };\n curOpt.itemCreated(curData);\n }\n subChild.push(li);\n }\n return subChild;\n }\n ListBase.createListItemFromArray = createListItemFromArray;\n /**\n * Function helps to created an element list based on array of JSON input .\n *\n * @param {createElementParams} createElement - Specifies an array of JSON data.\n *\n * @param {{Object}[]} dataSource - Specifies an array of JSON data.\n *\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n *\n * @param {boolean} isSingleLevel? - Specifies the list options that need to provide.\n *\n * @param {number} level? - Specifies the list options that need to provide.\n *\n * @param {any} componentInstance? - Specifies the list options that need to provide.\n *\n * @returns {HTMLElement[]} child - returns the list options that need to provide.\n */\n function createListItemFromJson(createElement, dataSource, \n // eslint-disable-next-line\n options, level, isSingleLevel, componentInstance) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var fields = (componentInstance &&\n (componentInstance.getModuleName() === 'listview' || componentInstance.getModuleName() === 'multiselect'))\n ? curOpt.fields : extend({}, ListBase.defaultMappedFields, curOpt.fields);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var id;\n var checkboxElement = [];\n if (level) {\n ariaAttributes.level = level;\n }\n var child = [];\n var li;\n var anchorElement;\n if (dataSource && dataSource.length && !isNullOrUndefined(typeofData(dataSource).item) &&\n // eslint-disable-next-line no-prototype-builtins\n !typeofData(dataSource).item.hasOwnProperty(fields.id)) {\n id = generateId(); // generate id for drop-down-list option.\n }\n for (var i = 0; i < dataSource.length; i++) {\n var fieldData = getFieldValues(dataSource[i], fields);\n if (isNullOrUndefined(dataSource[i])) {\n continue;\n }\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: fieldData[fields.text],\n options: curOpt,\n fields: fields\n };\n curOpt.itemCreating(curData);\n }\n var curItem = dataSource[i];\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n fieldData = getFieldValues(dataSource[i], fields);\n }\n // eslint-disable-next-line no-prototype-builtins\n if (fieldData.hasOwnProperty(fields.id) && !isNullOrUndefined(fieldData[fields.id])) {\n id = fieldData[fields.id];\n }\n var innerEle = [];\n if (curOpt.showCheckBox) {\n if (curOpt.itemNavigable && (fieldData[fields.url] || fieldData[fields.urlAttributes])) {\n checkboxElement.push(createElement('input', { className: cssClass.check, attrs: { type: 'checkbox' } }));\n }\n else {\n innerEle.push(createElement('input', { className: cssClass.check, attrs: { type: 'checkbox' } }));\n }\n }\n if (isSingleLevel === true) {\n // eslint-disable-next-line no-prototype-builtins\n if (curOpt.showIcon && fieldData.hasOwnProperty(fields.iconCss) && !isNullOrUndefined(fieldData[fields.iconCss])) {\n innerEle.push(createElement('span', { className: cssClass.icon + ' ' + fieldData[fields.iconCss] }));\n }\n li = generateSingleLevelLI(createElement, curItem, fieldData, fields, curOpt.itemClass, innerEle, \n // eslint-disable-next-line no-prototype-builtins\n (curItem.hasOwnProperty('isHeader') &&\n curItem.isHeader) ? true : false, id, i, options);\n anchorElement = li.querySelector('.' + cssClass.anchorWrap);\n if (curOpt.itemNavigable && checkboxElement.length) {\n prepend(checkboxElement, li.firstElementChild);\n }\n }\n else {\n li = generateLI(createElement, curItem, fieldData, fields, curOpt.itemClass, options, componentInstance);\n li.classList.add(cssClass.level + '-' + ariaAttributes.level);\n li.setAttribute('aria-level', ariaAttributes.level.toString());\n if (ariaAttributes.groupItemRole === 'presentation' || ariaAttributes.itemRole === 'presentation') {\n li.removeAttribute('aria-level');\n }\n anchorElement = li.querySelector('.' + cssClass.anchorWrap);\n // eslint-disable-next-line no-prototype-builtins\n if (fieldData.hasOwnProperty(fields.tooltip)) {\n var tooltipText = fieldData[fields.tooltip];\n if (options && options.enableHtmlSanitizer) {\n tooltipText = SanitizeHtmlHelper.sanitize(tooltipText);\n }\n else {\n var tooltipTextElement = createElement('span', { innerHTML: tooltipText });\n tooltipText = tooltipTextElement.innerText;\n tooltipTextElement = null;\n }\n li.setAttribute('title', tooltipText);\n }\n // eslint-disable-next-line no-prototype-builtins\n if (fieldData.hasOwnProperty(fields.htmlAttributes) && fieldData[fields.htmlAttributes]) {\n var htmlAttributes = fieldData[fields.htmlAttributes];\n // Check if 'class' attribute is present and not an empty string\n if ('class' in htmlAttributes && typeof htmlAttributes['class'] === 'string' && htmlAttributes['class'].trim() === '') {\n delete htmlAttributes['class'];\n }\n setAttribute(li, htmlAttributes);\n }\n // eslint-disable-next-line no-prototype-builtins\n if (fieldData.hasOwnProperty(fields.enabled) && fieldData[fields.enabled] === false) {\n li.classList.add(cssClass.disabled);\n }\n // eslint-disable-next-line no-prototype-builtins\n if (fieldData.hasOwnProperty(fields.isVisible) && fieldData[fields.isVisible] === false) {\n li.style.display = 'none';\n }\n // eslint-disable-next-line no-prototype-builtins\n if (fieldData.hasOwnProperty(fields.imageUrl) && !isNullOrUndefined(fieldData[fields.imageUrl])\n && !curOpt.template) {\n var attr = { src: fieldData[fields.imageUrl] };\n merge(attr, fieldData[fields.imageAttributes]);\n var imageElemnt = createElement('img', { className: cssClass.image, attrs: attr });\n if (anchorElement) {\n anchorElement.insertAdjacentElement('afterbegin', imageElemnt);\n }\n else {\n prepend([imageElemnt], li.firstElementChild);\n }\n }\n // eslint-disable-next-line no-prototype-builtins\n if (curOpt.showIcon && fieldData.hasOwnProperty(fields.iconCss) &&\n !isNullOrUndefined(fieldData[fields.iconCss]) && !curOpt.template) {\n var iconElement = createElement('div', { className: cssClass.icon + ' ' + fieldData[fields.iconCss] });\n if (anchorElement) {\n anchorElement.insertAdjacentElement('afterbegin', iconElement);\n }\n else {\n prepend([iconElement], li.firstElementChild);\n }\n }\n if (innerEle.length) {\n prepend(innerEle, li.firstElementChild);\n }\n if (curOpt.itemNavigable && checkboxElement.length) {\n prepend(checkboxElement, li.firstElementChild);\n }\n processSubChild(createElement, fieldData, fields, dataSource, curOpt, li, ariaAttributes.level);\n }\n if (anchorElement) {\n addClass([li], [cssClass.navigable]);\n }\n if (curOpt.itemCreated && typeof curOpt.itemCreated === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: dataSource[i],\n text: fieldData[fields.text],\n item: li,\n options: curOpt,\n fields: fields\n };\n curOpt.itemCreated(curData);\n }\n checkboxElement = [];\n child.push(li);\n }\n return child;\n }\n ListBase.createListItemFromJson = createListItemFromJson;\n /**\n * Function helps to created an element list based on array of JSON input .\n *\n * @param {createElementParams} createElement - Specifies an array of JSON data.\n *\n * @param {{Object}[]} dataSource - Specifies an array of JSON data.\n *\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n *\n * @param {number} level? - Specifies the list options that need to provide.\n *\n * @param {boolean} isSingleLevel? - Specifies the list options that need to provide.\n *\n * @param {any} componentInstance? - Specifies the list options that need to provide.\n *\n * @returns {createElement} generateUL - Specifies the list options that need to provide.\n */\n function createListFromJson(createElement, dataSource, \n // eslint-disable-next-line\n options, level, isSingleLevel, componentInstance) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var li = createListItemFromJson(createElement, dataSource, options, level, isSingleLevel, componentInstance);\n return generateUL(createElement, li, curOpt.listClass, options);\n }\n ListBase.createListFromJson = createListFromJson;\n /**\n * Return the next or previous visible element.\n *\n * @param {Element[]|NodeList} elementArray - An element array to find next or previous element.\n * @param {Element} li - An element to find next or previous after this element.\n * @param {boolean} isPrevious? - Specify when the need get previous element from array.\n */\n function getSiblingLI(elementArray, element, isPrevious) {\n cssClass = getModuleClass(defaultListBaseOptions.moduleName);\n if (!elementArray || !elementArray.length) {\n return void 0;\n }\n var siblingLI;\n var liIndex;\n var liCollections = Array.prototype.slice.call(elementArray);\n if (element) {\n liIndex = indexOf(element, liCollections);\n }\n else {\n liIndex = (isPrevious === true ? liCollections.length : -1);\n }\n siblingLI = liCollections[liIndex + (isPrevious === true ? -1 : 1)];\n while (siblingLI && (!isVisible(siblingLI) || siblingLI.classList.contains(cssClass.disabled))) {\n liIndex = liIndex + (isPrevious === true ? -1 : 1);\n siblingLI = liCollections[liIndex];\n }\n return siblingLI;\n }\n ListBase.getSiblingLI = getSiblingLI;\n /**\n * Return the index of the li element\n *\n * @param {Element} item - An element to find next or previous after this element.\n * @param {Element[]} elementArray - An element array to find index of given li.\n */\n function indexOf(item, elementArray) {\n if (!elementArray || !item) {\n return void 0;\n }\n else {\n var liCollections = elementArray;\n liCollections = Array.prototype.slice.call(elementArray);\n return liCollections.indexOf(item);\n }\n }\n ListBase.indexOf = indexOf;\n /**\n * Returns the grouped data from given dataSource.\n *\n * @param {{Object}[]} dataSource - The JSON data which is necessary to process.\n * @param {FieldsMapping} fields - Fields that are mapped from the data source.\n * @param {SortOrder} sortOrder- Specifies final result sort order.\n */\n function groupDataSource(dataSource, fields, sortOrder) {\n if (sortOrder === void 0) { sortOrder = 'None'; }\n var curFields = extend({}, ListBase.defaultMappedFields, fields);\n var cusQuery = new Query().group(curFields.groupBy);\n // need to remove once sorting issues fixed in DataManager\n cusQuery = addSorting(sortOrder, 'key', cusQuery);\n var ds = getDataSource(dataSource, cusQuery);\n dataSource = [];\n for (var j = 0; j < ds.length; j++) {\n var itemObj = ds[j].items;\n var grpItem = {};\n var hdr = 'isHeader';\n grpItem[curFields.text] = ds[j].key;\n grpItem[\"\" + hdr] = true;\n var newtext = curFields.text;\n if (newtext === 'id') {\n newtext = 'text';\n grpItem[\"\" + newtext] = ds[j].key;\n }\n grpItem._id = 'group-list-item-' + (ds[j].key ?\n ds[j].key.toString().trim() : 'undefined');\n grpItem.items = itemObj;\n dataSource.push(grpItem);\n for (var k = 0; k < itemObj.length; k++) {\n dataSource.push(itemObj[k]);\n }\n }\n return dataSource;\n }\n ListBase.groupDataSource = groupDataSource;\n /**\n * Returns a sorted query object.\n *\n * @param {SortOrder} sortOrder - Specifies that sort order.\n * @param {string} sortBy - Specifies sortBy fields.\n * @param {Query} query - Pass if any existing query.\n */\n function addSorting(sortOrder, sortBy, query) {\n if (query === void 0) { query = new Query(); }\n if (sortOrder === 'Ascending') {\n query.sortBy(sortBy, 'ascending', true);\n }\n else if (sortOrder === 'Descending') {\n query.sortBy(sortBy, 'descending', true);\n }\n else {\n for (var i = 0; i < query.queries.length; i++) {\n if (query.queries[i].fn === 'onSortBy') {\n query.queries.splice(i, 1);\n }\n }\n }\n return query;\n }\n ListBase.addSorting = addSorting;\n /**\n * Return an array of JSON Data that processed based on queries.\n *\n * @param {{Object}[]} dataSource - Specifies local JSON data source.\n *\n * @param {Query} query - Specifies query that need to process.\n */\n function getDataSource(dataSource, query) {\n // eslint-disable-next-line\n return new DataManager(dataSource)\n .executeLocal(query);\n }\n ListBase.getDataSource = getDataSource;\n /**\n * Created JSON data based the UL and LI element\n *\n * @param {HTMLElement|Element} element - UL element that need to convert as a JSON\n * @param {ListBaseOptions} options? - Specifies listbase option for fields.\n */\n function createJsonFromElement(element, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var fields = extend({}, ListBase.defaultMappedFields, curOpt.fields);\n var curEle = element.cloneNode(true);\n var jsonAr = [];\n curEle.classList.add('json-parent');\n var childs = curEle.querySelectorAll('.json-parent>li');\n curEle.classList.remove('json-parent');\n for (var i = 0; i < childs.length; i++) {\n var li = childs[i];\n var anchor = li.querySelector('a');\n var ul = li.querySelector('ul');\n var json = {};\n var childNodes = anchor ? anchor.childNodes : li.childNodes;\n var keys = Object.keys(childNodes);\n for (var i_1 = 0; i_1 < childNodes.length; i_1++) {\n if (!(childNodes[Number(keys[i_1])]).hasChildNodes()) {\n json[fields.text] = childNodes[Number(keys[i_1])].textContent;\n }\n }\n var attributes_1 = getAllAttributes(li);\n if (attributes_1.id) {\n json[fields.id] = attributes_1.id;\n delete attributes_1.id;\n }\n else {\n json[fields.id] = generateId();\n }\n if (Object.keys(attributes_1).length) {\n json[fields.htmlAttributes] = attributes_1;\n }\n if (anchor) {\n attributes_1 = getAllAttributes(anchor);\n if (Object.keys(attributes_1).length) {\n json[fields.urlAttributes] = attributes_1;\n }\n }\n if (ul) {\n json[fields.child] = createJsonFromElement(ul, options);\n }\n jsonAr.push(json);\n }\n return jsonAr;\n }\n ListBase.createJsonFromElement = createJsonFromElement;\n function typeofData(data) {\n var match = { typeof: null, item: null };\n for (var i = 0; i < data.length; i++) {\n if (!isNullOrUndefined(data[i])) {\n return match = { typeof: typeof data[i], item: data[i] };\n }\n }\n return match;\n }\n function setAttribute(element, elementAttributes) {\n var attr = {};\n merge(attr, elementAttributes);\n if (attr.class) {\n addClass([element], attr.class.split(' '));\n delete attr.class;\n }\n attributes(element, attr);\n }\n function getAllAttributes(element) {\n var attributes = {};\n var attr = element.attributes;\n for (var index = 0; index < attr.length; index++) {\n attributes[attr[index].nodeName] = attr[index].nodeValue;\n }\n return attributes;\n }\n /**\n * Created UL element from content template.\n *\n * @param {string} template - that need to convert and generate li element.\n * @param {{Object}[]} dataSource - Specifies local JSON data source.\n * @param {ListBaseOptions} options? - Specifies listbase option for fields.\n */\n function renderContentTemplate(createElement, template, dataSource, \n // eslint-disable-next-line\n fields, options, componentInstance) {\n cssClass = getModuleClass(defaultListBaseOptions.moduleName);\n var ulElement = createElement('ul', { className: cssClass.ul, attrs: { role: 'presentation' } });\n var curOpt = extend({}, defaultListBaseOptions, options);\n var curFields = extend({}, ListBase.defaultMappedFields, fields);\n var compiledString = compileTemplate(template);\n var liCollection = [];\n var value;\n var id = generateId(); // generate id for drop-down-list option.\n for (var i = 0; i < dataSource.length; i++) {\n var fieldData = getFieldValues(dataSource[i], curFields);\n var curItem = dataSource[i];\n var isHeader = curItem.isHeader;\n if (typeof dataSource[i] === 'string' || typeof dataSource[i] === 'number') {\n value = curItem;\n }\n else {\n value = fieldData[curFields.value];\n }\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: curItem,\n text: value,\n options: curOpt,\n fields: curFields\n };\n curOpt.itemCreating(curData);\n }\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n fieldData = getFieldValues(dataSource[i], curFields);\n if (typeof dataSource[i] === 'string' || typeof dataSource[i] === 'number') {\n value = curItem;\n }\n else {\n value = fieldData[curFields.value];\n }\n }\n var li = createElement('li', {\n id: id + '-' + i,\n className: isHeader ? cssClass.group : cssClass.li, attrs: { role: 'presentation' }\n });\n if (isHeader) {\n if (typeof dataSource[i] === 'string' || typeof dataSource[i] === 'number') {\n li.innerText = curItem;\n }\n else {\n li.innerText = fieldData[curFields.text];\n }\n }\n else {\n var currentID = isHeader ? curOpt.groupTemplateID : curOpt.templateID;\n if (isHeader) {\n if (componentInstance && componentInstance.getModuleName() !== 'listview') {\n // eslint-disable-next-line\n var compiledElement = compiledString(curItem, componentInstance, 'headerTemplate', currentID, !!curOpt.isStringTemplate, null, li);\n if (compiledElement) {\n append(compiledElement, li);\n }\n }\n else {\n append(compiledString(curItem, componentInstance, 'headerTemplate', currentID, !!curOpt.isStringTemplate), li);\n }\n }\n else {\n if (componentInstance && componentInstance.getModuleName() !== 'listview') {\n // eslint-disable-next-line\n var compiledElement = compiledString(curItem, componentInstance, 'template', currentID, !!curOpt.isStringTemplate, null, li);\n if (compiledElement) {\n append(compiledElement, li);\n }\n }\n else {\n append(compiledString(curItem, componentInstance, 'template', currentID, !!curOpt.isStringTemplate), li);\n }\n }\n li.setAttribute('data-value', isNullOrUndefined(value) ? 'null' : value);\n li.setAttribute('role', 'option');\n }\n if (curOpt.itemCreated && typeof curOpt.itemCreated === 'function') {\n var curData = {\n dataSource: dataSource,\n curData: curItem,\n text: value,\n item: li,\n options: curOpt,\n fields: curFields\n };\n curOpt.itemCreated(curData);\n }\n liCollection.push(li);\n }\n append(liCollection, ulElement);\n return ulElement;\n }\n ListBase.renderContentTemplate = renderContentTemplate;\n /**\n * Created header items from group template.\n *\n * @param {string} template - that need to convert and generate li element.\n *\n * @param {{Object}[]} dataSource - Specifies local JSON data source.\n *\n * @param {FieldsMapping} fields - Specifies fields for mapping the dataSource.\n *\n * @param {Element[]} headerItems? - Specifies listbase header items.\n */\n // tslint:disable-next-line\n function renderGroupTemplate(groupTemplate, groupDataSource, fields, \n // eslint-disable-next-line\n headerItems, options, componentInstance) {\n var compiledString = compileTemplate(groupTemplate);\n var curFields = extend({}, ListBase.defaultMappedFields, fields);\n var curOpt = extend({}, defaultListBaseOptions, options);\n var category = curFields.groupBy;\n for (var _i = 0, headerItems_1 = headerItems; _i < headerItems_1.length; _i++) {\n var header = headerItems_1[_i];\n var headerData = {};\n headerData[\"\" + category] = header.textContent;\n header.innerHTML = '';\n if (componentInstance && componentInstance.getModuleName() !== 'listview') {\n // eslint-disable-next-line\n var compiledElement = compiledString(headerData, componentInstance, 'groupTemplate', curOpt.groupTemplateID, !!curOpt.isStringTemplate, null, header);\n if (compiledElement) {\n append(compiledElement, header);\n }\n }\n else {\n append(compiledString(headerData, componentInstance, 'groupTemplate', curOpt.groupTemplateID, !!curOpt.isStringTemplate), header);\n }\n }\n return headerItems;\n }\n ListBase.renderGroupTemplate = renderGroupTemplate;\n function generateId() {\n return Math.floor((1 + Math.random()) * 0x10000)\n .toString(16)\n .substring(1);\n }\n ListBase.generateId = generateId;\n function processSubChild(createElement, fieldData, fields, ds, options, element, level) {\n // Get SubList\n var subDS = fieldData[fields.child] || [];\n var hasChildren = fieldData[fields.hasChildren];\n //Create Sub child\n if (subDS.length) {\n hasChildren = true;\n element.classList.add(cssClass.hasChild);\n if (options.processSubChild) {\n var subLi = createListFromJson(createElement, subDS, options, ++level);\n element.appendChild(subLi);\n }\n }\n // Create expand and collapse node\n if (!!options.expandCollapse && hasChildren && !options.template) {\n element.firstElementChild.classList.add(cssClass.iconWrapper);\n var expandElement = options.expandIconPosition === 'Left' ? prepend : append;\n expandElement([createElement('div', { className: 'e-icons ' + options.expandIconClass })], element.querySelector('.' + cssClass.textContent));\n }\n }\n function generateSingleLevelLI(createElement, item, fieldData, fields, className, innerElements, grpLI, id, index, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var text = item;\n var value = item;\n var dataSource;\n if (typeof item !== 'string' && typeof item !== 'number' && typeof item !== 'boolean') {\n dataSource = item;\n text = (typeof fieldData[fields.text] === 'boolean' || typeof fieldData[fields.text] === 'number') ?\n fieldData[fields.text] : (fieldData[fields.text] || '');\n value = fieldData[fields.value];\n }\n var elementID;\n if (!isNullOrUndefined(dataSource) && !isNullOrUndefined(fieldData[fields.id])\n && fieldData[fields.id] !== '') {\n elementID = id;\n }\n else {\n elementID = id + '-' + index;\n }\n var li = createElement('li', {\n className: (grpLI === true ? cssClass.group : cssClass.li) + ' ' + (isNullOrUndefined(className) ? '' : className),\n id: elementID, attrs: (ariaAttributes.groupItemRole !== '' && ariaAttributes.itemRole !== '' ?\n { role: (grpLI === true ? ariaAttributes.groupItemRole : ariaAttributes.itemRole) } : {})\n });\n // eslint-disable-next-line no-prototype-builtins\n if (dataSource && fieldData.hasOwnProperty(fields.enabled) && fieldData[fields.enabled].toString() === 'false') {\n li.classList.add(cssClass.disabled);\n }\n if (grpLI) {\n li.innerText = text;\n }\n else {\n li.setAttribute('data-value', isNullOrUndefined(value) ? 'null' : value);\n li.setAttribute('role', 'option');\n // eslint-disable-next-line no-prototype-builtins\n if (dataSource && fieldData.hasOwnProperty(fields.htmlAttributes) && fieldData[fields.htmlAttributes]) {\n setAttribute(li, fieldData[fields.htmlAttributes]);\n }\n if (innerElements.length && !curOpt.itemNavigable) {\n append(innerElements, li);\n }\n if (dataSource && (fieldData[fields.url] || (fieldData[fields.urlAttributes] &&\n fieldData[fields.urlAttributes].href))) {\n li.appendChild(anchorTag(createElement, dataSource, fields, text, innerElements, curOpt.itemNavigable));\n }\n else {\n if (innerElements.length && curOpt.itemNavigable) {\n append(innerElements, li);\n }\n li.appendChild(document.createTextNode(text));\n }\n }\n return li;\n }\n function getModuleClass(moduleName) {\n var moduleClass;\n // eslint-disable-next-line\n return moduleClass = {\n li: \"e-\" + moduleName + \"-item\",\n ul: \"e-\" + moduleName + \"-parent e-ul\",\n group: \"e-\" + moduleName + \"-group-item\",\n icon: \"e-\" + moduleName + \"-icon\",\n text: \"e-\" + moduleName + \"-text\",\n check: \"e-\" + moduleName + \"-check\",\n checked: 'e-checked',\n selected: 'e-selected',\n expanded: 'e-expanded',\n textContent: 'e-text-content',\n hasChild: 'e-has-child',\n level: 'e-level',\n url: \"e-\" + moduleName + \"-url\",\n collapsible: 'e-icon-collapsible',\n disabled: 'e-disabled',\n image: \"e-\" + moduleName + \"-img\",\n iconWrapper: 'e-icon-wrapper',\n anchorWrap: 'e-anchor-wrap',\n navigable: 'e-navigable'\n };\n }\n function anchorTag(createElement, dataSource, fields, text, innerElements, isFullNavigation) {\n var fieldData = getFieldValues(dataSource, fields);\n var attr = { href: fieldData[fields.url] };\n // eslint-disable-next-line no-prototype-builtins\n if (fieldData.hasOwnProperty(fields.urlAttributes) && fieldData[fields.urlAttributes]) {\n merge(attr, fieldData[fields.urlAttributes]);\n attr.href = fieldData[fields.url] ? fieldData[fields.url] :\n fieldData[fields.urlAttributes].href;\n }\n var anchorTag;\n if (!isFullNavigation) {\n anchorTag = createElement('a', { className: cssClass.text + ' ' + cssClass.url, innerHTML: text });\n }\n else {\n anchorTag = createElement('a', { className: cssClass.text + ' ' + cssClass.url });\n var anchorWrapper = createElement('div', { className: cssClass.anchorWrap });\n if (innerElements && innerElements.length) {\n append(innerElements, anchorWrapper);\n }\n anchorWrapper.appendChild(document.createTextNode(text));\n append([anchorWrapper], anchorTag);\n }\n setAttribute(anchorTag, attr);\n return anchorTag;\n }\n // tslint:disable-next-line\n /* tslint:disable:align */\n function generateLI(createElement, item, fieldData, \n // eslint-disable-next-line\n fields, className, options, componentInstance) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var text = item;\n var uID;\n var grpLI;\n var dataSource;\n if (typeof item !== 'string' && typeof item !== 'number') {\n dataSource = item;\n text = fieldData[fields.text] || '';\n // tslint:disable-next-line\n uID = (isNullOrUndefined(fieldData['_id'])) ? fieldData[fields.id] : fieldData['_id'];\n // eslint-disable-next-line no-prototype-builtins\n grpLI = (item.hasOwnProperty('isHeader') && item.isHeader)\n ? true : false;\n }\n if (options && options.enableHtmlSanitizer) {\n // eslint-disable-next-line no-self-assign\n text = text;\n }\n var li = createElement('li', {\n className: (grpLI === true ? cssClass.group : cssClass.li) + ' ' + (isNullOrUndefined(className) ? '' : className),\n attrs: (ariaAttributes.groupItemRole !== '' && ariaAttributes.itemRole !== '' ?\n { role: (grpLI === true ? ariaAttributes.groupItemRole : ariaAttributes.itemRole) } : {})\n });\n if (!isNullOrUndefined(uID) === true) {\n li.setAttribute('data-uid', uID);\n }\n else {\n li.setAttribute('data-uid', generateId());\n }\n if (grpLI && options && options.groupTemplate) {\n var compiledString = compileTemplate(options.groupTemplate);\n if (componentInstance && componentInstance.getModuleName() !== 'listview') {\n // eslint-disable-next-line\n var compiledElement = compiledString(item, componentInstance, 'groupTemplate', curOpt.groupTemplateID, !!curOpt.isStringTemplate, null, li);\n if (compiledElement) {\n append(compiledElement, li);\n }\n }\n else {\n append(compiledString(item, componentInstance, 'groupTemplate', curOpt.groupTemplateID, !!curOpt.isStringTemplate), li);\n }\n }\n else if (!grpLI && options && options.template) {\n var compiledString = compileTemplate(options.template);\n if (componentInstance && componentInstance.getModuleName() !== 'listview') {\n // eslint-disable-next-line\n var compiledElement = compiledString(item, componentInstance, 'template', curOpt.templateID, !!curOpt.isStringTemplate, null, li);\n if (compiledElement) {\n append(compiledElement, li);\n }\n }\n else {\n append(compiledString(item, componentInstance, 'template', curOpt.templateID, !!curOpt.isStringTemplate), li);\n }\n }\n else {\n var innerDiv = createElement('div', {\n className: cssClass.textContent,\n attrs: (ariaAttributes.wrapperRole !== '' ? { role: ariaAttributes.wrapperRole } : {})\n });\n if (dataSource && (fieldData[fields.url] || (fieldData[fields.urlAttributes] &&\n fieldData[fields.urlAttributes].href))) {\n innerDiv.appendChild(anchorTag(createElement, dataSource, fields, text, null, curOpt.itemNavigable));\n }\n else {\n var element = createElement('span', {\n className: cssClass.text,\n attrs: (ariaAttributes.itemText !== '' ? { role: ariaAttributes.itemText } : {})\n });\n if (options && options.enableHtmlSanitizer) {\n element.innerText = SanitizeHtmlHelper.sanitize(text);\n }\n else {\n element.innerHTML = text;\n }\n innerDiv.appendChild(element);\n }\n li.appendChild(innerDiv);\n }\n return li;\n }\n /**\n * Returns UL element based on the given LI element.\n *\n * @param {HTMLElement[]} liElement - Specifies array of LI element.\n *\n * @param {string} className? - Specifies class name that need to be added in UL element.\n *\n * @param {ListBaseOptions} options? - Specifies ListBase options.\n */\n function generateUL(createElement, liElement, className, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n cssClass = getModuleClass(curOpt.moduleName);\n var ulElement = createElement('ul', {\n className: cssClass.ul + ' ' + (isNullOrUndefined(className) ? '' : className),\n attrs: (ariaAttributes.listRole !== '' ? { role: ariaAttributes.listRole } : {})\n });\n append(liElement, ulElement);\n return ulElement;\n }\n ListBase.generateUL = generateUL;\n /**\n * Returns LI element with additional DIV tag based on the given LI element.\n *\n * @param {liElement} liElement - Specifies LI element.\n *\n * @param {string} className? - Specifies class name that need to be added in created DIV element.\n *\n * @param {ListBaseOptions} options? - Specifies ListBase options.\n */\n function generateIcon(createElement, liElement, className, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var expandElement = curOpt.expandIconPosition === 'Left' ? prepend : append;\n expandElement([createElement('div', {\n className: 'e-icons ' + curOpt.expandIconClass + ' ' +\n (isNullOrUndefined(className) ? '' : className)\n })], liElement.querySelector('.' + cssClass.textContent));\n return liElement;\n }\n ListBase.generateIcon = generateIcon;\n})(ListBase || (ListBase = {}));\n/**\n * Used to get dataSource item from complex data using fields.\n *\n * @param {Object} dataSource - Specifies an JSON or String data.\n *\n * @param {FieldsMapping} fields - Fields that are mapped from the dataSource.\n */\nexport function getFieldValues(dataItem, fields) {\n var fieldData = {};\n if (isNullOrUndefined(dataItem) || typeof (dataItem) === 'string' || typeof (dataItem) === 'number'\n || !isNullOrUndefined(dataItem.isHeader)) {\n return dataItem;\n }\n else {\n for (var _i = 0, _a = Object.keys(fields); _i < _a.length; _i++) {\n var field = _a[_i];\n var dataField = fields[\"\" + field];\n var value = !isNullOrUndefined(dataField) &&\n typeof (dataField) === 'string' ? getValue(dataField, dataItem) : undefined;\n if (!isNullOrUndefined(value)) {\n fieldData[\"\" + dataField] = value;\n }\n }\n }\n return fieldData;\n}\nfunction compileTemplate(template) {\n if (template) {\n try {\n if (typeof template !== 'function' && document.querySelector(template)) {\n return compile(document.querySelector(template).innerHTML.trim());\n }\n else {\n return compile(template);\n }\n }\n catch (e) {\n return compile(template);\n }\n }\n return undefined;\n}\n","/**\n * Position library\n */\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nvar elementRect;\nvar popupRect;\nvar element;\nvar parentDocument;\nvar fixedParent = false;\n/**\n *\n * @param {HTMLElement} anchor - specifies the element\n * @param {HTMLElement} element - specifies the element\n * @returns {OffsetPosition} - returns the value\n */\nexport function calculateRelativeBasedPosition(anchor, element) {\n var fixedElement = false;\n var anchorPos = { left: 0, top: 0 };\n var tempAnchor = anchor;\n if (!anchor || !element) {\n return anchorPos;\n }\n if (isNullOrUndefined(element.offsetParent) && element.style.position === 'fixed') {\n fixedElement = true;\n }\n while ((element.offsetParent || fixedElement) && anchor && element.offsetParent !== anchor) {\n anchorPos.left += anchor.offsetLeft;\n anchorPos.top += anchor.offsetTop;\n anchor = anchor.offsetParent;\n }\n anchor = tempAnchor;\n while ((element.offsetParent || fixedElement) && anchor && element.offsetParent !== anchor) {\n anchorPos.left -= anchor.scrollLeft;\n anchorPos.top -= anchor.scrollTop;\n anchor = anchor.parentElement;\n }\n return anchorPos;\n}\n/**\n *\n * @param {Element} currentElement - specifies the element\n * @param {string} positionX - specifies the position\n * @param {string} positionY - specifies the position\n * @param {boolean} parentElement - specifies the boolean\n * @param {ClientRect} targetValues - specifies the client\n * @returns {OffsetPosition} - returns the position\n */\nexport function calculatePosition(currentElement, positionX, positionY, parentElement, targetValues) {\n popupRect = undefined;\n popupRect = targetValues;\n fixedParent = parentElement ? true : false;\n if (!currentElement) {\n return { left: 0, top: 0 };\n }\n if (!positionX) {\n positionX = 'left';\n }\n if (!positionY) {\n positionY = 'top';\n }\n parentDocument = currentElement.ownerDocument;\n element = currentElement;\n var pos = { left: 0, top: 0 };\n return updatePosition(positionX.toLowerCase(), positionY.toLowerCase(), pos);\n}\n/**\n *\n * @param {number} value - specifies the number\n * @param {OffsetPosition} pos - specifies the position\n * @returns {void}\n */\nfunction setPosx(value, pos) {\n pos.left = value;\n}\n/**\n *\n * @param {number} value - specifies the number\n * @param {OffsetPosition} pos - specifies the position\n * @returns {void}\n */\nfunction setPosy(value, pos) {\n pos.top = value;\n}\n/**\n *\n * @param {string} posX - specifies the position\n * @param {string} posY - specifies the position\n * @param {OffsetPosition} pos - specifies the position\n * @returns {OffsetPosition} - returns the postion\n */\nfunction updatePosition(posX, posY, pos) {\n elementRect = element.getBoundingClientRect();\n switch (posY + posX) {\n case 'topcenter':\n setPosx(getElementHCenter(), pos);\n setPosy(getElementTop(), pos);\n break;\n case 'topright':\n setPosx(getElementRight(), pos);\n setPosy(getElementTop(), pos);\n break;\n case 'centercenter':\n setPosx(getElementHCenter(), pos);\n setPosy(getElementVCenter(), pos);\n break;\n case 'centerright':\n setPosx(getElementRight(), pos);\n setPosy(getElementVCenter(), pos);\n break;\n case 'centerleft':\n setPosx(getElementLeft(), pos);\n setPosy(getElementVCenter(), pos);\n break;\n case 'bottomcenter':\n setPosx(getElementHCenter(), pos);\n setPosy(getElementBottom(), pos);\n break;\n case 'bottomright':\n setPosx(getElementRight(), pos);\n setPosy(getElementBottom(), pos);\n break;\n case 'bottomleft':\n setPosx(getElementLeft(), pos);\n setPosy(getElementBottom(), pos);\n break;\n default:\n case 'topleft':\n setPosx(getElementLeft(), pos);\n setPosy(getElementTop(), pos);\n break;\n }\n element = null;\n return pos;\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getBodyScrollTop() {\n return parentDocument.documentElement.scrollTop || parentDocument.body.scrollTop;\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getBodyScrollLeft() {\n return parentDocument.documentElement.scrollLeft || parentDocument.body.scrollLeft;\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getElementBottom() {\n return fixedParent ? elementRect.bottom : elementRect.bottom + getBodyScrollTop();\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getElementVCenter() {\n return getElementTop() + (elementRect.height / 2);\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getElementTop() {\n return fixedParent ? elementRect.top : elementRect.top + getBodyScrollTop();\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getElementLeft() {\n return elementRect.left + getBodyScrollLeft();\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getElementRight() {\n var popupWidth = (element && (element.classList.contains('e-date-wrapper') || element.classList.contains('e-datetime-wrapper') || element.classList.contains('e-date-range-wrapper'))) ? (popupRect ? popupRect.width : 0) :\n (popupRect && (elementRect.width >= popupRect.width) ? popupRect.width : 0);\n return elementRect.right + getBodyScrollLeft() - popupWidth;\n}\n/**\n * @returns {number} - specifies the number value\n */\nfunction getElementHCenter() {\n return getElementLeft() + (elementRect.width / 2);\n}\n","/**\n * Collision module.\n */\nimport { calculatePosition } from './position';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nvar parentDocument;\nvar targetContainer;\n/**\n *\n * @param {HTMLElement} element - specifies the element\n * @param {HTMLElement} viewPortElement - specifies the element\n * @param {CollisionCoordinates} axis - specifies the collision coordinates\n * @param {OffsetPosition} position - specifies the position\n * @returns {void}\n */\nexport function fit(element, viewPortElement, axis, position) {\n if (viewPortElement === void 0) { viewPortElement = null; }\n if (axis === void 0) { axis = { X: false, Y: false }; }\n if (!axis.Y && !axis.X) {\n return { left: 0, top: 0 };\n }\n var elemData = element.getBoundingClientRect();\n targetContainer = viewPortElement;\n parentDocument = element.ownerDocument;\n if (!position) {\n position = calculatePosition(element, 'left', 'top');\n }\n if (axis.X) {\n var containerWidth = targetContainer ? getTargetContainerWidth() : getViewPortWidth();\n var containerLeft = ContainerLeft();\n var containerRight = ContainerRight();\n var overLeft = containerLeft - position.left;\n var overRight = position.left + elemData.width - containerRight;\n if (elemData.width > containerWidth) {\n if (overLeft > 0 && overRight <= 0) {\n position.left = containerRight - elemData.width;\n }\n else if (overRight > 0 && overLeft <= 0) {\n position.left = containerLeft;\n }\n else {\n position.left = overLeft > overRight ? (containerRight - elemData.width) : containerLeft;\n }\n }\n else if (overLeft > 0) {\n position.left += overLeft;\n }\n else if (overRight > 0) {\n position.left -= overRight;\n }\n }\n if (axis.Y) {\n var containerHeight = targetContainer ? getTargetContainerHeight() : getViewPortHeight();\n var containerTop = ContainerTop();\n var containerBottom = ContainerBottom();\n var overTop = containerTop - position.top;\n var overBottom = position.top + elemData.height - containerBottom;\n if (elemData.height > containerHeight) {\n if (overTop > 0 && overBottom <= 0) {\n position.top = containerBottom - elemData.height;\n }\n else if (overBottom > 0 && overTop <= 0) {\n position.top = containerTop;\n }\n else {\n position.top = overTop > overBottom ? (containerBottom - elemData.height) : containerTop;\n }\n }\n else if (overTop > 0) {\n position.top += overTop;\n }\n else if (overBottom > 0) {\n position.top -= overBottom;\n }\n }\n return position;\n}\n/**\n *\n * @param {HTMLElement} element - specifies the html element\n * @param {HTMLElement} viewPortElement - specifies the html element\n * @param {number} x - specifies the number\n * @param {number} y - specifies the number\n * @returns {string[]} - returns the string value\n */\nexport function isCollide(element, viewPortElement, x, y) {\n if (viewPortElement === void 0) { viewPortElement = null; }\n var elemOffset = calculatePosition(element, 'left', 'top');\n if (x) {\n elemOffset.left = x;\n }\n if (y) {\n elemOffset.top = y;\n }\n var data = [];\n targetContainer = viewPortElement;\n parentDocument = element.ownerDocument;\n var elementRect = element.getBoundingClientRect();\n var top = elemOffset.top;\n var left = elemOffset.left;\n var right = elemOffset.left + elementRect.width;\n var bottom = elemOffset.top + elementRect.height;\n // eslint-disable-next-line\n var topData = '', leftData = '';\n var yAxis = topCollideCheck(top, bottom);\n var xAxis = leftCollideCheck(left, right);\n if (yAxis.topSide) {\n data.push('top');\n }\n if (xAxis.rightSide) {\n data.push('right');\n }\n if (xAxis.leftSide) {\n data.push('left');\n }\n if (yAxis.bottomSide) {\n data.push('bottom');\n }\n return data;\n}\n/**\n *\n * @param {HTMLElement} element - specifies the element\n * @param {HTMLElement} target - specifies the element\n * @param {number} offsetX - specifies the number\n * @param {number} offsetY - specifies the number\n * @param {string} positionX - specifies the string value\n * @param {string} positionY - specifies the string value\n * @param {HTMLElement} viewPortElement - specifies the element\n * @param {CollisionCoordinates} axis - specifies the collision axis\n * @param {boolean} fixedParent - specifies the boolean\n * @returns {void}\n */\nexport function flip(element, target, offsetX, offsetY, positionX, positionY, viewPortElement, \n/* eslint-disable */\naxis, fixedParent) {\n if (viewPortElement === void 0) { viewPortElement = null; }\n if (axis === void 0) { axis = { X: true, Y: true }; }\n if (!target || !element || !positionX || !positionY || (!axis.X && !axis.Y)) {\n return;\n }\n var tEdge = { TL: null,\n TR: null,\n BL: null,\n BR: null\n }, eEdge = {\n TL: null,\n TR: null,\n BL: null,\n BR: null\n /* eslint-enable */\n };\n var elementRect;\n if (window.getComputedStyle(element).display === 'none') {\n var oldVisibility = element.style.visibility;\n element.style.visibility = 'hidden';\n element.style.display = 'block';\n elementRect = element.getBoundingClientRect();\n element.style.removeProperty('display');\n element.style.visibility = oldVisibility;\n }\n else {\n elementRect = element.getBoundingClientRect();\n }\n var pos = {\n posX: positionX, posY: positionY, offsetX: offsetX, offsetY: offsetY, position: { left: 0, top: 0 }\n };\n targetContainer = viewPortElement;\n parentDocument = target.ownerDocument;\n updateElementData(target, tEdge, pos, fixedParent, elementRect);\n setPosition(eEdge, pos, elementRect);\n if (axis.X) {\n leftFlip(target, eEdge, tEdge, pos, elementRect, true);\n }\n if (axis.Y && tEdge.TL.top > -1) {\n topFlip(target, eEdge, tEdge, pos, elementRect, true);\n }\n setPopup(element, pos, elementRect);\n}\n/**\n *\n * @param {HTMLElement} element - specifies the element\n * @param {PositionLocation} pos - specifies the location\n * @param {ClientRect} elementRect - specifies the client rect\n * @returns {void}\n */\nfunction setPopup(element, pos, elementRect) {\n //eslint-disable-next-line\n var left = 0, top = 0;\n if (element.offsetParent != null\n && (getComputedStyle(element.offsetParent).position === 'absolute' ||\n getComputedStyle(element.offsetParent).position === 'relative')) {\n var data = calculatePosition(element.offsetParent, 'left', 'top', false, elementRect);\n left = data.left;\n top = data.top;\n }\n var scaleX = 1;\n var scaleY = 1;\n if (element.offsetParent) {\n var transformStyle = getComputedStyle(element.offsetParent).transform;\n if (transformStyle !== 'none') {\n var matrix = new DOMMatrix(transformStyle);\n scaleX = matrix.a;\n scaleY = matrix.d;\n }\n }\n element.style.top = ((pos.position.top / scaleY) + pos.offsetY - (top)) + 'px';\n element.style.left = ((pos.position.left / scaleX) + pos.offsetX - (left)) + 'px';\n}\n/**\n *\n * @param {HTMLElement} target - specifies the element\n * @param {EdgeOffset} edge - specifies the offset\n * @param {PositionLocation} pos - specifies theloaction\n * @param {boolean} fixedParent - specifies the boolean\n * @param {ClientRect} elementRect - specifies the client rect\n * @returns {void}\n */\nfunction updateElementData(target, edge, pos, fixedParent, elementRect) {\n pos.position = calculatePosition(target, pos.posX, pos.posY, fixedParent, elementRect);\n edge.TL = calculatePosition(target, 'left', 'top', fixedParent, elementRect);\n edge.TR = calculatePosition(target, 'right', 'top', fixedParent, elementRect);\n edge.BR = calculatePosition(target, 'left', 'bottom', fixedParent, elementRect);\n edge.BL = calculatePosition(target, 'right', 'bottom', fixedParent, elementRect);\n}\n/**\n *\n * @param {EdgeOffset} eStatus - specifies the status\n * @param {PositionLocation} pos - specifies the location\n * @param {ClientRect} elementRect - specifies the client\n * @returns {void}\n */\nfunction setPosition(eStatus, pos, elementRect) {\n eStatus.TL = { top: pos.position.top + pos.offsetY, left: pos.position.left + pos.offsetX };\n eStatus.TR = { top: eStatus.TL.top, left: eStatus.TL.left + elementRect.width };\n eStatus.BL = { top: eStatus.TL.top + elementRect.height,\n left: eStatus.TL.left };\n eStatus.BR = { top: eStatus.TL.top + elementRect.height,\n left: eStatus.TL.left + elementRect.width };\n}\n/**\n *\n * @param {number} left - specifies the number\n * @param {number} right - specifies the number\n * @returns {LeftCorners} - returns the value\n */\nfunction leftCollideCheck(left, right) {\n //eslint-disable-next-line\n var leftSide = false, rightSide = false;\n if (((left - getBodyScrollLeft()) < ContainerLeft())) {\n leftSide = true;\n }\n if (right > ContainerRight()) {\n rightSide = true;\n }\n return { leftSide: leftSide, rightSide: rightSide };\n}\n/**\n *\n * @param {HTMLElement} target - specifies the element\n * @param {EdgeOffset} edge - specifes the element\n * @param {EdgeOffset} tEdge - specifies the edge offset\n * @param {PositionLocation} pos - specifes the location\n * @param {ClientRect} elementRect - specifies the client\n * @param {boolean} deepCheck - specifies the boolean value\n * @returns {void}\n */\nfunction leftFlip(target, edge, tEdge, pos, elementRect, deepCheck) {\n var collideSide = leftCollideCheck(edge.TL.left, edge.TR.left);\n if ((tEdge.TL.left - getBodyScrollLeft()) <= ContainerLeft()) {\n collideSide.leftSide = false;\n }\n if (tEdge.TR.left > ContainerRight()) {\n collideSide.rightSide = false;\n }\n if ((collideSide.leftSide && !collideSide.rightSide) || (!collideSide.leftSide && collideSide.rightSide)) {\n if (pos.posX === 'right') {\n pos.posX = 'left';\n }\n else {\n pos.posX = 'right';\n }\n pos.offsetX = pos.offsetX + elementRect.width;\n pos.offsetX = -1 * pos.offsetX;\n pos.position = calculatePosition(target, pos.posX, pos.posY, false);\n setPosition(edge, pos, elementRect);\n if (deepCheck) {\n leftFlip(target, edge, tEdge, pos, elementRect, false);\n }\n }\n}\n/**\n *\n * @param {HTMLElement} target - specifies the element\n * @param {EdgeOffset} edge - specifies the offset\n * @param {EdgeOffset} tEdge - specifies the offset\n * @param {PositionLocation} pos - specifies the location\n * @param {ClientRect} elementRect - specifies the client rect\n * @param {boolean} deepCheck - specifies the boolean\n * @returns {void}\n */\nfunction topFlip(target, edge, tEdge, pos, elementRect, deepCheck) {\n var collideSide = topCollideCheck(edge.TL.top, edge.BL.top);\n if ((tEdge.TL.top - getBodyScrollTop()) <= ContainerTop()) {\n collideSide.topSide = false;\n }\n if (tEdge.BL.top >= ContainerBottom() && target.getBoundingClientRect().bottom < window.innerHeight) {\n collideSide.bottomSide = false;\n }\n if ((collideSide.topSide && !collideSide.bottomSide) || (!collideSide.topSide && collideSide.bottomSide)) {\n if (pos.posY === 'top') {\n pos.posY = 'bottom';\n }\n else {\n pos.posY = 'top';\n }\n pos.offsetY = pos.offsetY + elementRect.height;\n pos.offsetY = -1 * pos.offsetY;\n pos.position = calculatePosition(target, pos.posX, pos.posY, false, elementRect);\n setPosition(edge, pos, elementRect);\n if (deepCheck) {\n topFlip(target, edge, tEdge, pos, elementRect, false);\n }\n }\n}\n/**\n *\n * @param {number} top - specifies the number\n * @param {number} bottom - specifies the number\n * @returns {TopCorners} - retyrns the value\n */\nfunction topCollideCheck(top, bottom) {\n //eslint-disable-next-line\n var topSide = false, bottomSide = false;\n if ((top - getBodyScrollTop()) < ContainerTop()) {\n topSide = true;\n }\n if (bottom > ContainerBottom()) {\n bottomSide = true;\n }\n return { topSide: topSide, bottomSide: bottomSide };\n}\n/**\n * @returns {void}\n */\nfunction getTargetContainerWidth() {\n return targetContainer.getBoundingClientRect().width;\n}\n/**\n * @returns {void}\n */\nfunction getTargetContainerHeight() {\n return targetContainer.getBoundingClientRect().height;\n}\n/**\n * @returns {void}\n */\nfunction getTargetContainerLeft() {\n return targetContainer.getBoundingClientRect().left;\n}\n/**\n * @returns {void}\n */\nfunction getTargetContainerTop() {\n return targetContainer.getBoundingClientRect().top;\n}\n//eslint-disable-next-line\nfunction ContainerTop() {\n if (targetContainer) {\n return getTargetContainerTop();\n }\n return 0;\n}\n//eslint-disable-next-line\nfunction ContainerLeft() {\n if (targetContainer) {\n return getTargetContainerLeft();\n }\n return 0;\n}\n//eslint-disable-next-line\nfunction ContainerRight() {\n if (targetContainer) {\n return (getBodyScrollLeft() + getTargetContainerLeft() + getTargetContainerWidth());\n }\n return (getBodyScrollLeft() + getViewPortWidth());\n}\n//eslint-disable-next-line\nfunction ContainerBottom() {\n if (targetContainer) {\n return (getBodyScrollTop() + getTargetContainerTop() + getTargetContainerHeight());\n }\n return (getBodyScrollTop() + getViewPortHeight());\n}\n/**\n * @returns {void}\n */\nfunction getBodyScrollTop() {\n // if(targetContainer)\n // return targetContainer.scrollTop;\n return parentDocument.documentElement.scrollTop || parentDocument.body.scrollTop;\n}\n/**\n * @returns {void}\n */\nfunction getBodyScrollLeft() {\n // if(targetContainer)\n // return targetContainer.scrollLeft;\n return parentDocument.documentElement.scrollLeft || parentDocument.body.scrollLeft;\n}\n/**\n * @returns {void}\n */\nfunction getViewPortHeight() {\n return window.innerHeight;\n}\n/**\n * @returns {void}\n */\nfunction getViewPortWidth() {\n var windowWidth = window.innerWidth;\n var documentReact = document.documentElement.getBoundingClientRect();\n var offsetWidth = (isNullOrUndefined(document.documentElement)) ? 0 : documentReact.width;\n return windowWidth - (windowWidth - offsetWidth);\n}\nexport function destroy() {\n targetContainer = null;\n parentDocument = null;\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { setStyleAttribute, addClass, removeClass, ChildProperty, Complex } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit } from '@syncfusion/ej2-base';\nimport { Browser } from '@syncfusion/ej2-base';\nimport { calculatePosition, calculateRelativeBasedPosition } from '../common/position';\nimport { Animation, Property, Event, Component } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { EventHandler } from '@syncfusion/ej2-base';\nimport { flip, fit, isCollide, destroy as collisionDestroy } from '../common/collision';\n/**\n * Specifies the offset position values.\n */\nvar PositionData = /** @class */ (function (_super) {\n __extends(PositionData, _super);\n function PositionData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('left')\n ], PositionData.prototype, \"X\", void 0);\n __decorate([\n Property('top')\n ], PositionData.prototype, \"Y\", void 0);\n return PositionData;\n}(ChildProperty));\nexport { PositionData };\n// don't use space in classNames\nvar CLASSNAMES = {\n ROOT: 'e-popup',\n RTL: 'e-rtl',\n OPEN: 'e-popup-open',\n CLOSE: 'e-popup-close'\n};\n/**\n * Represents the Popup Component\n * ```html\n *
\n *
Popup Content
\n * ```\n * ```typescript\n * \n * ```\n */\nvar Popup = /** @class */ (function (_super) {\n __extends(Popup, _super);\n function Popup(element, options) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Called internally if any of the property value changed.\n *\n * @param {PopupModel} newProp - specifies the new property\n * @param {PopupModel} oldProp - specifies the old property\n * @private\n * @returns {void}\n */\n Popup.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'width':\n setStyleAttribute(this.element, { 'width': formatUnit(newProp.width) });\n break;\n case 'height':\n setStyleAttribute(this.element, { 'height': formatUnit(newProp.height) });\n break;\n case 'zIndex':\n setStyleAttribute(this.element, { 'zIndex': newProp.zIndex });\n break;\n case 'enableRtl':\n this.setEnableRtl();\n break;\n case 'position':\n case 'relateTo':\n this.refreshPosition();\n break;\n case 'offsetX':\n // eslint-disable-next-line\n var x = newProp.offsetX - oldProp.offsetX;\n this.element.style.left = (parseInt(this.element.style.left, 10) + (x)).toString() + 'px';\n break;\n case 'offsetY':\n // eslint-disable-next-line\n var y = newProp.offsetY - oldProp.offsetY;\n this.element.style.top = (parseInt(this.element.style.top, 10) + (y)).toString() + 'px';\n break;\n case 'content':\n this.setContent();\n break;\n case 'actionOnScroll':\n if (newProp.actionOnScroll !== 'none') {\n this.wireScrollEvents();\n }\n else {\n this.unwireScrollEvents();\n }\n break;\n }\n }\n };\n /**\n * gets the Component module name.\n *\n * @returns {void}\n * @private\n */\n Popup.prototype.getModuleName = function () {\n return 'popup';\n };\n /**\n * To resolve if any collision occurs.\n *\n * @returns {void}\n */\n Popup.prototype.resolveCollision = function () {\n this.checkCollision();\n };\n /**\n * gets the persisted state properties of the Component.\n *\n * @returns {void}\n */\n Popup.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * To destroy the control.\n *\n * @returns {void}\n */\n Popup.prototype.destroy = function () {\n if (this.element.classList.contains('e-popup-open')) {\n this.unwireEvents();\n }\n this.element.classList.remove(CLASSNAMES.ROOT, CLASSNAMES.RTL, CLASSNAMES.OPEN, CLASSNAMES.CLOSE);\n this.content = null;\n this.relateTo = null;\n collisionDestroy();\n _super.prototype.destroy.call(this);\n };\n /**\n * To Initialize the control rendering\n *\n * @returns {void}\n * @private\n */\n Popup.prototype.render = function () {\n this.element.classList.add(CLASSNAMES.ROOT);\n var styles = {};\n if (this.zIndex !== 1000) {\n styles.zIndex = this.zIndex;\n }\n if (this.width !== 'auto') {\n styles.width = formatUnit(this.width);\n }\n if (this.height !== 'auto') {\n styles.height = formatUnit(this.height);\n }\n setStyleAttribute(this.element, styles);\n this.fixedParent = false;\n this.setEnableRtl();\n this.setContent();\n };\n Popup.prototype.wireEvents = function () {\n if (Browser.isDevice) {\n EventHandler.add(window, 'orientationchange', this.orientationOnChange, this);\n }\n if (this.actionOnScroll !== 'none') {\n this.wireScrollEvents();\n }\n };\n Popup.prototype.wireScrollEvents = function () {\n if (this.getRelateToElement()) {\n for (var _i = 0, _a = this.getScrollableParent(this.getRelateToElement()); _i < _a.length; _i++) {\n var parent_1 = _a[_i];\n EventHandler.add(parent_1, 'scroll', this.scrollRefresh, this);\n }\n }\n };\n Popup.prototype.unwireEvents = function () {\n if (Browser.isDevice) {\n EventHandler.remove(window, 'orientationchange', this.orientationOnChange);\n }\n if (this.actionOnScroll !== 'none') {\n this.unwireScrollEvents();\n }\n };\n Popup.prototype.unwireScrollEvents = function () {\n if (this.getRelateToElement()) {\n for (var _i = 0, _a = this.getScrollableParent(this.getRelateToElement()); _i < _a.length; _i++) {\n var parent_2 = _a[_i];\n EventHandler.remove(parent_2, 'scroll', this.scrollRefresh);\n }\n }\n };\n Popup.prototype.getRelateToElement = function () {\n var relateToElement = this.relateTo === '' || isNullOrUndefined(this.relateTo) ?\n document.body : this.relateTo;\n this.setProperties({ relateTo: relateToElement }, true);\n return ((typeof this.relateTo) === 'string') ?\n document.querySelector(this.relateTo) : this.relateTo;\n };\n Popup.prototype.scrollRefresh = function (e) {\n if (this.actionOnScroll === 'reposition') {\n if (!isNullOrUndefined(this.element) && !(this.element.offsetParent === e.target ||\n (this.element.offsetParent && this.element.offsetParent.tagName === 'BODY' &&\n e.target.parentElement == null))) {\n this.refreshPosition();\n }\n }\n else if (this.actionOnScroll === 'hide') {\n this.hide();\n }\n if (this.actionOnScroll !== 'none') {\n if (this.getRelateToElement()) {\n var targetVisible = this.isElementOnViewport(this.getRelateToElement(), e.target);\n if (!targetVisible && !this.targetInvisibleStatus) {\n this.trigger('targetExitViewport');\n this.targetInvisibleStatus = true;\n }\n else if (targetVisible) {\n this.targetInvisibleStatus = false;\n }\n }\n }\n };\n /**\n * This method is to get the element visibility on viewport when scroll\n * the page. This method will returns true even though 1 px of element\n * part is in visible.\n *\n * @param {HTMLElement} relateToElement - specifies the element\n * @param {HTMLElement} scrollElement - specifies the scroll element\n * @returns {boolean} - retruns the boolean\n */\n // eslint-disable-next-line\n Popup.prototype.isElementOnViewport = function (relateToElement, scrollElement) {\n var scrollParents = this.getScrollableParent(relateToElement);\n for (var parent_3 = 0; parent_3 < scrollParents.length; parent_3++) {\n if (this.isElementVisible(relateToElement, scrollParents[parent_3])) {\n continue;\n }\n else {\n return false;\n }\n }\n return true;\n };\n Popup.prototype.isElementVisible = function (relateToElement, scrollElement) {\n var rect = this.checkGetBoundingClientRect(relateToElement);\n if (!rect.height || !rect.width) {\n return false;\n }\n if (!isNullOrUndefined(this.checkGetBoundingClientRect(scrollElement))) {\n var parent_4 = scrollElement.getBoundingClientRect();\n return !(rect.bottom < parent_4.top) &&\n (!(rect.bottom > parent_4.bottom) &&\n (!(rect.right > parent_4.right) &&\n !(rect.left < parent_4.left)));\n }\n else {\n var win = window;\n var windowView = {\n top: win.scrollY,\n left: win.scrollX,\n right: win.scrollX + win.outerWidth,\n bottom: win.scrollY + win.outerHeight\n };\n var off = calculatePosition(relateToElement);\n var ele = {\n top: off.top,\n left: off.left,\n right: off.left + rect.width,\n bottom: off.top + rect.height\n };\n var elementView = {\n top: windowView.bottom - ele.top,\n left: windowView.right - ele.left,\n bottom: ele.bottom - windowView.top,\n right: ele.right - windowView.left\n };\n return elementView.top > 0\n && elementView.left > 0\n && elementView.right > 0\n && elementView.bottom > 0;\n }\n };\n /**\n * Initialize the event handler\n *\n * @returns {void}\n * @private\n */\n Popup.prototype.preRender = function () {\n //There is no event handler\n };\n Popup.prototype.setEnableRtl = function () {\n this.reposition();\n // eslint-disable-next-line\n this.enableRtl ? this.element.classList.add(CLASSNAMES.RTL) : this.element.classList.remove(CLASSNAMES.RTL);\n };\n Popup.prototype.setContent = function () {\n if (!isNullOrUndefined(this.content)) {\n this.element.innerHTML = '';\n if (typeof (this.content) === 'string') {\n this.element.textContent = this.content;\n }\n else {\n var relateToElem = this.getRelateToElement();\n // eslint-disable-next-line\n var props = this.content.props;\n if (!relateToElem.classList.contains('e-dropdown-btn') || isNullOrUndefined(props)) {\n this.element.appendChild(this.content);\n }\n }\n }\n };\n Popup.prototype.orientationOnChange = function () {\n var _this = this;\n setTimeout(function () {\n _this.refreshPosition();\n }, 200);\n };\n // eslint-disable-next-line\n /**\n * Based on the `relative` element and `offset` values, `Popup` element position will refreshed.\n *\n * @returns {void}\n */\n Popup.prototype.refreshPosition = function (target, collision) {\n if (!isNullOrUndefined(target)) {\n this.checkFixedParent(target);\n }\n this.reposition();\n if (!collision) {\n this.checkCollision();\n }\n };\n Popup.prototype.reposition = function () {\n var pos;\n var position;\n var relateToElement = this.getRelateToElement();\n if (typeof this.position.X === 'number' && typeof this.position.Y === 'number') {\n pos = { left: this.position.X, top: this.position.Y };\n }\n else if ((typeof this.position.X === 'string' && typeof this.position.Y === 'number') ||\n (typeof this.position.X === 'number' && typeof this.position.Y === 'string')) {\n var parentDisplay = void 0;\n var display = this.element.style.display;\n this.element.style.display = 'block';\n if (this.element.classList.contains('e-dlg-modal')) {\n parentDisplay = this.element.parentElement.style.display;\n this.element.parentElement.style.display = 'block';\n }\n position = this.getAnchorPosition(relateToElement, this.element, this.position, this.offsetX, this.offsetY);\n if (typeof this.position.X === 'string') {\n pos = { left: position.left, top: this.position.Y };\n }\n else {\n pos = { left: this.position.X, top: position.top };\n }\n this.element.style.display = display;\n if (this.element.classList.contains('e-dlg-modal')) {\n this.element.parentElement.style.display = parentDisplay;\n }\n }\n else if (relateToElement) {\n var height = this.element.clientHeight;\n var display = this.element.style.display;\n this.element.style.display = 'block';\n pos = this.getAnchorPosition(relateToElement, this.element, this.position, this.offsetX, this.offsetY, height);\n this.element.style.display = display;\n }\n else {\n pos = { left: 0, top: 0 };\n }\n if (!isNullOrUndefined(pos)) {\n this.element.style.left = pos.left + 'px';\n this.element.style.top = pos.top + 'px';\n }\n };\n Popup.prototype.checkGetBoundingClientRect = function (ele) {\n var eleRect;\n try {\n eleRect = ele.getBoundingClientRect();\n return eleRect;\n }\n catch (error) {\n return null;\n }\n };\n Popup.prototype.getAnchorPosition = function (anchorEle, ele, position, offsetX, offsetY, height) {\n if (height === void 0) { height = 0; }\n var eleRect = this.checkGetBoundingClientRect(ele);\n var anchorRect = this.checkGetBoundingClientRect(anchorEle);\n if (isNullOrUndefined(eleRect) || isNullOrUndefined(anchorRect)) {\n return null;\n }\n var anchor = anchorEle;\n var anchorPos = { left: 0, top: 0 };\n if (ele.offsetParent && ele.offsetParent.tagName === 'BODY' && anchorEle.tagName === 'BODY') {\n anchorPos = calculatePosition(anchorEle);\n }\n else {\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName !== 'BODY')) {\n ele = ele.parentElement;\n }\n anchorPos = calculateRelativeBasedPosition(anchor, ele);\n }\n switch (position.X) {\n default:\n case 'left':\n break;\n case 'center':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.left += (window.innerWidth / 2 - eleRect.width / 2);\n }\n else if (this.targetType === 'container') {\n anchorPos.left += (anchorRect.width / 2 - eleRect.width / 2);\n }\n else {\n anchorPos.left += (anchorRect.width / 2);\n }\n break;\n case 'right':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.left += (window.innerWidth - eleRect.width);\n }\n else if (this.targetType === 'container') {\n anchorPos.left += (anchorRect.width - eleRect.width);\n }\n else {\n anchorPos.left += (anchorRect.width);\n }\n break;\n }\n switch (position.Y) {\n default:\n case 'top':\n break;\n case 'center':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.top += (window.innerHeight / 2 - eleRect.height / 2);\n }\n else if (this.targetType === 'container') {\n anchorPos.top += (anchorRect.height / 2 - eleRect.height / 2);\n }\n else {\n anchorPos.top += (anchorRect.height / 2);\n }\n break;\n case 'bottom':\n if ((ele.classList.contains('e-dlg-modal') && anchor.tagName === 'BODY' && this.targetType === 'container')) {\n anchorPos.top += (window.innerHeight - eleRect.height);\n }\n else if (this.targetType === 'container' && !ele.classList.contains('e-dialog')) {\n anchorPos.top += (anchorRect.height - eleRect.height);\n }\n else if (this.targetType === 'container' && ele.classList.contains('e-dialog')) {\n anchorPos.top += (anchorRect.height - height);\n }\n else {\n anchorPos.top += (anchorRect.height);\n }\n break;\n }\n anchorPos.left += offsetX;\n anchorPos.top += offsetY;\n return anchorPos;\n };\n Popup.prototype.callFlip = function (param) {\n var relateToElement = this.getRelateToElement();\n flip(this.element, relateToElement, this.offsetX, this.offsetY, this.position.X, this.position.Y, this.viewPortElement, param, this.fixedParent);\n };\n Popup.prototype.callFit = function (param) {\n if (isCollide(this.element, this.viewPortElement).length !== 0) {\n if (isNullOrUndefined(this.viewPortElement)) {\n var data = fit(this.element, this.viewPortElement, param);\n if (param.X) {\n this.element.style.left = data.left + 'px';\n }\n if (param.Y) {\n this.element.style.top = data.top + 'px';\n }\n }\n else {\n var elementRect = this.checkGetBoundingClientRect(this.element);\n var viewPortRect = this.checkGetBoundingClientRect(this.viewPortElement);\n if (isNullOrUndefined(elementRect) || isNullOrUndefined(viewPortRect)) {\n return null;\n }\n if (param && param.Y === true) {\n if (viewPortRect.top > elementRect.top) {\n this.element.style.top = '0px';\n }\n else if (viewPortRect.bottom < elementRect.bottom) {\n this.element.style.top = parseInt(this.element.style.top, 10) - (elementRect.bottom - viewPortRect.bottom) + 'px';\n }\n }\n if (param && param.X === true) {\n if (viewPortRect.right < elementRect.right) {\n this.element.style.left = parseInt(this.element.style.left, 10) - (elementRect.right - viewPortRect.right) + 'px';\n }\n else if (viewPortRect.left > elementRect.left) {\n this.element.style.left = parseInt(this.element.style.left, 10) + (viewPortRect.left - elementRect.left) + 'px';\n }\n }\n }\n }\n };\n Popup.prototype.checkCollision = function () {\n var horz = this.collision.X;\n var vert = this.collision.Y;\n if (horz === 'none' && vert === 'none') {\n return;\n }\n if (horz === 'flip' && vert === 'flip') {\n this.callFlip({ X: true, Y: true });\n }\n else if (horz === 'fit' && vert === 'fit') {\n this.callFit({ X: true, Y: true });\n }\n else {\n if (horz === 'flip') {\n this.callFlip({ X: true, Y: false });\n }\n else if (vert === 'flip') {\n this.callFlip({ Y: true, X: false });\n }\n if (horz === 'fit') {\n this.callFit({ X: true, Y: false });\n }\n else if (vert === 'fit') {\n this.callFit({ X: false, Y: true });\n }\n }\n };\n /**\n * Shows the popup element from screen.\n *\n * @returns {void}\n * @param {AnimationModel} animationOptions - specifies the model\n * @param { HTMLElement } relativeElement - To calculate the zIndex value dynamically.\n */\n Popup.prototype.show = function (animationOptions, relativeElement) {\n var _this = this;\n var relateToElement = this.getRelateToElement();\n if (relateToElement.classList.contains('e-filemanager')) {\n this.fmDialogContainer = this.element.getElementsByClassName('e-file-select-wrap')[0];\n }\n this.wireEvents();\n if (!isNullOrUndefined(this.fmDialogContainer) && Browser.isIos) {\n this.fmDialogContainer.style.display = 'block';\n }\n if (this.zIndex === 1000 || !isNullOrUndefined(relativeElement)) {\n var zIndexElement = (isNullOrUndefined(relativeElement)) ? this.element : relativeElement;\n this.zIndex = getZindexPartial(zIndexElement);\n setStyleAttribute(this.element, { 'zIndex': this.zIndex });\n }\n animationOptions = (!isNullOrUndefined(animationOptions) && typeof animationOptions === 'object') ?\n animationOptions : this.showAnimation;\n if (this.collision.X !== 'none' || this.collision.Y !== 'none') {\n removeClass([this.element], CLASSNAMES.CLOSE);\n addClass([this.element], CLASSNAMES.OPEN);\n this.checkCollision();\n removeClass([this.element], CLASSNAMES.OPEN);\n addClass([this.element], CLASSNAMES.CLOSE);\n }\n if (!isNullOrUndefined(animationOptions)) {\n animationOptions.begin = function () {\n if (!_this.isDestroyed) {\n removeClass([_this.element], CLASSNAMES.CLOSE);\n addClass([_this.element], CLASSNAMES.OPEN);\n }\n };\n animationOptions.end = function () {\n if (!_this.isDestroyed) {\n _this.trigger('open');\n }\n };\n new Animation(animationOptions).animate(this.element);\n }\n else {\n removeClass([this.element], CLASSNAMES.CLOSE);\n addClass([this.element], CLASSNAMES.OPEN);\n this.trigger('open');\n }\n };\n /**\n * Hides the popup element from screen.\n *\n * @param {AnimationModel} animationOptions - To give the animation options.\n * @returns {void}\n */\n Popup.prototype.hide = function (animationOptions) {\n var _this = this;\n animationOptions = (!isNullOrUndefined(animationOptions) && typeof animationOptions === 'object') ?\n animationOptions : this.hideAnimation;\n if (!isNullOrUndefined(animationOptions)) {\n animationOptions.end = function () {\n if (!_this.isDestroyed) {\n removeClass([_this.element], CLASSNAMES.OPEN);\n addClass([_this.element], CLASSNAMES.CLOSE);\n _this.trigger('close');\n }\n };\n new Animation(animationOptions).animate(this.element);\n }\n else {\n removeClass([this.element], CLASSNAMES.OPEN);\n addClass([this.element], CLASSNAMES.CLOSE);\n this.trigger('close');\n }\n this.unwireEvents();\n };\n /**\n * Gets scrollable parent elements for the given element.\n *\n * @returns {void}\n * @param { HTMLElement } element - Specify the element to get the scrollable parents of it.\n */\n Popup.prototype.getScrollableParent = function (element) {\n this.checkFixedParent(element);\n return getScrollableParent(element, this.fixedParent);\n };\n Popup.prototype.checkFixedParent = function (element) {\n var parent = element.parentElement;\n while (parent && parent.tagName !== 'HTML') {\n var parentStyle = getComputedStyle(parent);\n if ((parentStyle.position === 'fixed' || parentStyle.position === 'sticky') && !isNullOrUndefined(this.element) && this.element.offsetParent &&\n this.element.offsetParent.tagName === 'BODY' && getComputedStyle(this.element.offsetParent).overflow !== 'hidden') {\n this.element.style.top = window.scrollY > parseInt(this.element.style.top, 10) ?\n formatUnit(window.scrollY - parseInt(this.element.style.top, 10))\n : formatUnit(parseInt(this.element.style.top, 10) - window.scrollY);\n this.element.style.position = 'fixed';\n this.fixedParent = true;\n }\n parent = parent.parentElement;\n if (!isNullOrUndefined(this.element) && isNullOrUndefined(this.element.offsetParent) && parentStyle.position === 'fixed'\n && this.element.style.position === 'fixed') {\n this.fixedParent = true;\n }\n }\n };\n __decorate([\n Property('auto')\n ], Popup.prototype, \"height\", void 0);\n __decorate([\n Property('auto')\n ], Popup.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"content\", void 0);\n __decorate([\n Property('container')\n ], Popup.prototype, \"targetType\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"viewPortElement\", void 0);\n __decorate([\n Property({ X: 'none', Y: 'none' })\n ], Popup.prototype, \"collision\", void 0);\n __decorate([\n Property('')\n ], Popup.prototype, \"relateTo\", void 0);\n __decorate([\n Complex({}, PositionData)\n ], Popup.prototype, \"position\", void 0);\n __decorate([\n Property(0)\n ], Popup.prototype, \"offsetX\", void 0);\n __decorate([\n Property(0)\n ], Popup.prototype, \"offsetY\", void 0);\n __decorate([\n Property(1000)\n ], Popup.prototype, \"zIndex\", void 0);\n __decorate([\n Property(false)\n ], Popup.prototype, \"enableRtl\", void 0);\n __decorate([\n Property('reposition')\n ], Popup.prototype, \"actionOnScroll\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"showAnimation\", void 0);\n __decorate([\n Property(null)\n ], Popup.prototype, \"hideAnimation\", void 0);\n __decorate([\n Event()\n ], Popup.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], Popup.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], Popup.prototype, \"targetExitViewport\", void 0);\n Popup = __decorate([\n NotifyPropertyChanges\n ], Popup);\n return Popup;\n}(Component));\nexport { Popup };\n/**\n * Gets scrollable parent elements for the given element.\n *\n * @param { HTMLElement } element - Specify the element to get the scrollable parents of it.\n * @param {boolean} fixedParent - specifies the parent element\n * @private\n * @returns {void}\n */\nexport function getScrollableParent(element, fixedParent) {\n var eleStyle = getComputedStyle(element);\n var scrollParents = [];\n var overflowRegex = /(auto|scroll)/;\n var parent = element.parentElement;\n while (parent && parent.tagName !== 'HTML') {\n var parentStyle = getComputedStyle(parent);\n if (!(eleStyle.position === 'absolute' && parentStyle.position === 'static')\n && overflowRegex.test(parentStyle.overflow + parentStyle.overflowY + parentStyle.overflowX)) {\n scrollParents.push(parent);\n }\n parent = parent.parentElement;\n }\n if (!fixedParent) {\n scrollParents.push(document);\n }\n return scrollParents;\n}\n/**\n * Gets the maximum z-index of the given element.\n *\n * @returns {void}\n * @param { HTMLElement } element - Specify the element to get the maximum z-index of it.\n * @private\n */\nexport function getZindexPartial(element) {\n // upto body traversal\n var parent = element.parentElement;\n var parentZindex = [];\n while (parent) {\n if (parent.tagName !== 'BODY') {\n var index = document.defaultView.getComputedStyle(parent, null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(parent, null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n parentZindex.push(index);\n }\n parent = parent.parentElement;\n }\n else {\n break;\n }\n }\n var childrenZindex = [];\n for (var i = 0; i < document.body.children.length; i++) {\n if (!element.isEqualNode(document.body.children[i])) {\n var index = document.defaultView.getComputedStyle(document.body.children[i], null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(document.body.children[i], null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n childrenZindex.push(index);\n }\n }\n }\n childrenZindex.push('999');\n var siblingsZindex = [];\n if (!isNullOrUndefined(element.parentElement) && element.parentElement.tagName !== 'BODY') {\n var childNodes = [].slice.call(element.parentElement.children);\n for (var i = 0; i < childNodes.length; i++) {\n if (!element.isEqualNode(childNodes[i])) {\n var index = document.defaultView.getComputedStyle(childNodes[i], null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(childNodes[i], null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n siblingsZindex.push(index);\n }\n }\n }\n }\n var finalValue = parentZindex.concat(childrenZindex, siblingsZindex);\n // eslint-disable-next-line\n var currentZindexValue = Math.max.apply(Math, finalValue) + 1;\n return currentZindexValue > 2147483647 ? 2147483647 : currentZindexValue;\n}\n/**\n * Gets the maximum z-index of the page.\n *\n * @returns {void}\n * @param { HTMLElement } tagName - Specify the tagName to get the maximum z-index of it.\n * @private\n */\nexport function getMaxZindex(tagName) {\n if (tagName === void 0) { tagName = ['*']; }\n var maxZindex = [];\n for (var i = 0; i < tagName.length; i++) {\n var elements = document.getElementsByTagName(tagName[i]);\n for (var i_1 = 0; i_1 < elements.length; i_1++) {\n var index = document.defaultView.getComputedStyle(elements[i_1], null).getPropertyValue('z-index');\n var position = document.defaultView.getComputedStyle(elements[i_1], null).getPropertyValue('position');\n if (index !== 'auto' && position !== 'static') {\n maxZindex.push(index);\n }\n }\n }\n // eslint-disable-next-line\n var currentZindexValue = Math.max.apply(Math, maxZindex) + 1;\n return currentZindexValue > 2147483647 ? 2147483647 : currentZindexValue;\n}\n","/**\n * Resize library\n */\nimport { isNullOrUndefined as isNOU, createElement, EventHandler, detach, Browser } from '@syncfusion/ej2-base';\n/* eslint-disable */\nvar elementClass = ['north-west', 'north', 'north-east', 'west', 'east', 'south-west', 'south', 'south-east'];\nvar RESIZE_HANDLER = 'e-resize-handle';\nvar FOCUSED_HANDLER = 'e-focused-handle';\nvar DIALOG_RESIZABLE = 'e-dlg-resizable';\nvar RESTRICT_LEFT = ['e-restrict-left'];\nvar RESIZE_WITHIN_VIEWPORT = 'e-resize-viewport';\nvar dialogBorderResize = ['north', 'west', 'east', 'south'];\nvar targetElement;\nvar selectedHandler;\nvar originalWidth = 0;\nvar originalHeight = 0;\nvar originalX = 0;\nvar originalY = 0;\nvar originalMouseX = 0;\nvar originalMouseY = 0;\nvar minHeight;\nvar maxHeight;\nvar minWidth;\nvar maxWidth;\nvar containerElement;\nvar resizeStart = null;\nvar resize = null;\nvar resizeEnd = null;\n/* eslint-enable */\nvar resizeWestWidth;\nvar setLeft = true;\nvar previousWidth = 0;\nvar setWidth = true;\n// eslint-disable-next-line\nvar proxy;\n/**\n *\n * @param {ResizeArgs} args - specifies the resize args\n * @returns {void}\n */\nexport function createResize(args) {\n resizeStart = args.resizeBegin;\n resize = args.resizing;\n resizeEnd = args.resizeComplete;\n targetElement = getDOMElement(args.element);\n containerElement = getDOMElement(args.boundary);\n var directions = args.direction.split(' ');\n for (var i = 0; i < directions.length; i++) {\n if (dialogBorderResize.indexOf(directions[i]) >= 0 && directions[i]) {\n setBorderResizeElm(directions[i]);\n }\n else if (directions[i].trim() !== '') {\n var resizeHandler = createElement('div', { className: 'e-icons ' + RESIZE_HANDLER + ' ' + 'e-' + directions[i] });\n targetElement.appendChild(resizeHandler);\n }\n }\n minHeight = args.minHeight;\n minWidth = args.minWidth;\n maxWidth = args.maxWidth;\n maxHeight = args.maxHeight;\n if (args.proxy && args.proxy.element && args.proxy.element.classList.contains('e-dialog')) {\n wireEvents(args.proxy);\n }\n else {\n wireEvents();\n }\n}\n/**\n *\n * @param {string} direction - specifies the string\n * @returns {void}\n */\nfunction setBorderResizeElm(direction) {\n calculateValues();\n var borderBottom = createElement('span', {\n attrs: {\n 'unselectable': 'on', 'contenteditable': 'false'\n }\n });\n borderBottom.setAttribute('class', 'e-dialog-border-resize e-' + direction);\n if (direction === 'south') {\n borderBottom.style.height = '2px';\n borderBottom.style.width = '100%';\n borderBottom.style.bottom = '0px';\n borderBottom.style.left = '0px';\n }\n if (direction === 'north') {\n borderBottom.style.height = '2px';\n borderBottom.style.width = '100%';\n borderBottom.style.top = '0px';\n borderBottom.style.left = '0px';\n }\n if (direction === 'east') {\n borderBottom.style.height = '100%';\n borderBottom.style.width = '2px';\n borderBottom.style.right = '0px';\n borderBottom.style.top = '0px';\n }\n if (direction === 'west') {\n borderBottom.style.height = '100%';\n borderBottom.style.width = '2px';\n borderBottom.style.left = '0px';\n borderBottom.style.top = '0px';\n }\n targetElement.appendChild(borderBottom);\n}\n/**\n *\n * @param {string} element - specifies the element\n * @returns {HTMLElement} - returns the element\n */\nfunction getDOMElement(element) {\n var domElement;\n if (!isNOU(element)) {\n if (typeof (element) === 'string') {\n domElement = document.querySelector(element);\n }\n else {\n domElement = element;\n }\n }\n return domElement;\n}\n// eslint-disable-next-line\nfunction wireEvents(args) {\n if (isNOU(args)) {\n args = this;\n }\n var resizers = targetElement.querySelectorAll('.' + RESIZE_HANDLER);\n for (var i = 0; i < resizers.length; i++) {\n selectedHandler = resizers[i];\n EventHandler.add(selectedHandler, 'mousedown', onMouseDown, args);\n var eventName = (Browser.info.name === 'msie') ? 'pointerdown' : 'touchstart';\n EventHandler.add(selectedHandler, eventName, onTouchStart, args);\n }\n var borderResizers = targetElement.querySelectorAll('.e-dialog-border-resize');\n if (!isNOU(borderResizers)) {\n for (var i = 0; i < borderResizers.length; i++) {\n selectedHandler = borderResizers[i];\n EventHandler.add(selectedHandler, 'mousedown', onMouseDown, args);\n var eventName = (Browser.info.name === 'msie') ? 'pointerdown' : 'touchstart';\n EventHandler.add(selectedHandler, eventName, onTouchStart, args);\n }\n }\n}\n/* istanbul ignore next */\n/**\n *\n * @param {string} e - specifies the string\n * @returns {string} - returns the string\n */\nfunction getEventType(e) {\n return (e.indexOf('mouse') > -1) ? 'mouse' : 'touch';\n}\n/* istanbul ignore next */\n/**\n *\n * @param {MouseEvent} e - specifies the mouse event\n * @returns {void}\n */\nfunction onMouseDown(e) {\n e.preventDefault();\n targetElement = e.target.parentElement;\n calculateValues();\n originalMouseX = e.pageX;\n originalMouseY = e.pageY;\n e.target.classList.add(FOCUSED_HANDLER);\n if (!isNOU(resizeStart)) {\n proxy = this;\n if (resizeStart(e, proxy) === true) {\n return;\n }\n }\n if (this.targetEle && targetElement && targetElement.querySelector('.' + DIALOG_RESIZABLE)) {\n containerElement = this.target === ('body' || 'document.body' || document.body) ? null : this.targetEle;\n maxWidth = this.targetEle.clientWidth;\n maxHeight = this.targetEle.clientHeight;\n }\n var target = (isNOU(containerElement)) ? document : containerElement;\n EventHandler.add(target, 'mousemove', onMouseMove, this);\n EventHandler.add(document, 'mouseup', onMouseUp, this);\n for (var i = 0; i < RESTRICT_LEFT.length; i++) {\n if (targetElement.classList.contains(RESTRICT_LEFT[i])) {\n setLeft = false;\n }\n else {\n setLeft = true;\n }\n }\n}\n/* istanbul ignore next */\n/**\n *\n * @param {MouseEvent} e - specifies the event\n * @returns {void}\n */\nfunction onMouseUp(e) {\n var touchMoveEvent = (Browser.info.name === 'msie') ? 'pointermove' : 'touchmove';\n var touchEndEvent = (Browser.info.name === 'msie') ? 'pointerup' : 'touchend';\n var target = (isNOU(containerElement)) ? document : containerElement;\n var eventName = (Browser.info.name === 'msie') ? 'pointerdown' : 'touchstart';\n EventHandler.remove(target, 'mousemove', onMouseMove);\n EventHandler.remove(target, touchMoveEvent, onMouseMove);\n EventHandler.remove(target, eventName, onMouseMove);\n if (!isNOU(document.body.querySelector('.' + FOCUSED_HANDLER))) {\n document.body.querySelector('.' + FOCUSED_HANDLER).classList.remove(FOCUSED_HANDLER);\n }\n if (!isNOU(resizeEnd)) {\n proxy = this;\n resizeEnd(e, proxy);\n }\n EventHandler.remove(document, 'mouseup', onMouseUp);\n EventHandler.remove(document, touchEndEvent, onMouseUp);\n}\n/* istanbul ignore next */\n/**\n * @returns {void}\n */\nfunction calculateValues() {\n originalWidth = parseFloat(getComputedStyle(targetElement, null).getPropertyValue('width').replace('px', ''));\n originalHeight = parseFloat(getComputedStyle(targetElement, null).getPropertyValue('height').replace('px', ''));\n originalX = targetElement.getBoundingClientRect().left;\n originalY = targetElement.getBoundingClientRect().top;\n}\n/* istanbul ignore next */\n/**\n *\n * @param {MouseEvent} e - specifies the event\n * @returns {void}\n */\nfunction onTouchStart(e) {\n targetElement = e.target.parentElement;\n calculateValues();\n var dialogResizeElement = targetElement.classList.contains('e-dialog');\n if ((e.target.classList.contains(RESIZE_HANDLER) || e.target.classList.contains('e-dialog-border-resize')) && dialogResizeElement) {\n e.target.classList.add(FOCUSED_HANDLER);\n }\n var coordinates = e.touches ? e.changedTouches[0] : e;\n originalMouseX = coordinates.pageX;\n originalMouseY = coordinates.pageY;\n if (!isNOU(resizeStart)) {\n proxy = this;\n if (resizeStart(e, proxy) === true) {\n return;\n }\n }\n var touchMoveEvent = (Browser.info.name === 'msie') ? 'pointermove' : 'touchmove';\n var touchEndEvent = (Browser.info.name === 'msie') ? 'pointerup' : 'touchend';\n var target = (isNOU(containerElement)) ? document : containerElement;\n EventHandler.add(target, touchMoveEvent, onMouseMove, this);\n EventHandler.add(document, touchEndEvent, onMouseUp, this);\n}\n/* istanbul ignore next */\n/**\n *\n * @param {MouseEvent} e - specifies the event\n * @returns {void}\n */\nfunction onMouseMove(e) {\n if (e.target.classList.contains(RESIZE_HANDLER) && e.target.classList.contains(FOCUSED_HANDLER)) {\n selectedHandler = e.target;\n }\n else if (!isNOU(document.body.querySelector('.' + FOCUSED_HANDLER))) {\n selectedHandler = document.body.querySelector('.' + FOCUSED_HANDLER);\n }\n if (!isNOU(selectedHandler)) {\n var resizeTowards = '';\n for (var i = 0; i < elementClass.length; i++) {\n if (selectedHandler.classList.contains('e-' + elementClass[i])) {\n resizeTowards = elementClass[i];\n }\n }\n if (!isNOU(resize)) {\n proxy = this;\n resize(e, proxy);\n }\n switch (resizeTowards) {\n case 'south':\n resizeSouth(e);\n break;\n case 'north':\n resizeNorth(e);\n break;\n case 'west':\n resizeWest(e);\n break;\n case 'east':\n resizeEast(e);\n break;\n case 'south-east':\n resizeSouth(e);\n resizeEast(e);\n break;\n case 'south-west':\n resizeSouth(e);\n resizeWest(e);\n break;\n case 'north-east':\n resizeNorth(e);\n resizeEast(e);\n break;\n case 'north-west':\n resizeNorth(e);\n resizeWest(e);\n break;\n default: break;\n }\n }\n}\n/* istanbul ignore next */\n/**\n *\n * @param {HTMLElement} element - specifies the eleemnt\n * @returns {ClientRect} - returns the client\n */\nfunction getClientRectValues(element) {\n return element.getBoundingClientRect();\n}\n/* istanbul ignore next */\n// eslint-disable-next-line\nfunction resizeSouth(e) {\n var documentHeight = document.documentElement.clientHeight;\n var calculateValue = false;\n var coordinates = e.touches ? e.changedTouches[0] : e;\n var currentpageY = coordinates.pageY;\n var targetRectValues = getClientRectValues(targetElement);\n var containerRectValues;\n if (!isNOU(containerElement)) {\n containerRectValues = getClientRectValues(containerElement);\n }\n if (!isNOU(containerElement)) {\n calculateValue = true;\n }\n else if (isNOU(containerElement) && ((documentHeight - currentpageY) >= 0 || (targetRectValues.top < 0))) {\n calculateValue = true;\n }\n var calculatedHeight = originalHeight + (currentpageY - originalMouseY);\n calculatedHeight = (calculatedHeight > minHeight) ? calculatedHeight : minHeight;\n var containerTop = 0;\n if (!isNOU(containerElement)) {\n containerTop = containerRectValues.top;\n }\n var borderValue = isNOU(containerElement) ? 0 : containerElement.offsetHeight - containerElement.clientHeight;\n var topWithoutborder = (targetRectValues.top - containerTop) - (borderValue / 2);\n topWithoutborder = (topWithoutborder < 0) ? 0 : topWithoutborder;\n if (targetRectValues.top > 0 && (topWithoutborder + calculatedHeight) > maxHeight) {\n calculateValue = false;\n if (targetElement.classList.contains(RESIZE_WITHIN_VIEWPORT)) {\n return;\n }\n targetElement.style.height = (maxHeight - parseInt(topWithoutborder.toString(), 10)) + 'px';\n return;\n }\n var targetTop = 0;\n if (calculateValue) {\n if (targetRectValues.top < 0 && (documentHeight + (targetRectValues.height + targetRectValues.top) > 0)) {\n targetTop = targetRectValues.top;\n if ((calculatedHeight + targetTop) <= 30) {\n calculatedHeight = (targetRectValues.height - (targetRectValues.height + targetRectValues.top)) + 30;\n }\n }\n if (((calculatedHeight + targetRectValues.top) >= maxHeight)) {\n targetElement.style.height = targetRectValues.height +\n (documentHeight - (targetRectValues.height + targetRectValues.top)) + 'px';\n }\n var calculatedTop = (isNOU(containerElement)) ? targetTop : topWithoutborder;\n if (calculatedHeight >= minHeight && ((calculatedHeight + calculatedTop) <= maxHeight)) {\n targetElement.style.height = calculatedHeight + 'px';\n }\n }\n}\n/* istanbul ignore next */\n// eslint-disable-next-line\nfunction resizeNorth(e) {\n var calculateValue = false;\n var boundaryRectValues;\n var pageY = (getEventType(e.type) === 'mouse') ? e.pageY : e.touches[0].pageY;\n var targetRectValues = getClientRectValues(targetElement);\n if (!isNOU(containerElement)) {\n boundaryRectValues = getClientRectValues(containerElement);\n }\n if (!isNOU(containerElement) && (targetRectValues.top - boundaryRectValues.top) > 0) {\n calculateValue = true;\n }\n else if (isNOU(containerElement) && pageY > 0) {\n calculateValue = true;\n }\n var currentHeight = originalHeight - (pageY - originalMouseY);\n if (calculateValue) {\n if (currentHeight >= minHeight && currentHeight <= maxHeight) {\n var containerTop = 0;\n if (!isNOU(containerElement)) {\n containerTop = boundaryRectValues.top;\n }\n var top_1 = (originalY - containerTop) + (pageY - originalMouseY);\n top_1 = top_1 > 0 ? top_1 : 1;\n targetElement.style.height = currentHeight + 'px';\n targetElement.style.top = top_1 + 'px';\n }\n }\n}\n/* istanbul ignore next */\n// eslint-disable-next-line\nfunction resizeWest(e) {\n var documentWidth = document.documentElement.clientWidth;\n var calculateValue = false;\n var rectValues;\n if (!isNOU(containerElement)) {\n rectValues = getClientRectValues(containerElement);\n }\n var pageX = (getEventType(e.type) === 'mouse') ? e.pageX : e.touches[0].pageX;\n var targetRectValues = getClientRectValues(targetElement);\n var borderValue = isNOU(containerElement) ? 0 : containerElement.offsetWidth - containerElement.clientWidth;\n /* eslint-disable */\n var left = isNOU(containerElement) ? 0 : rectValues.left;\n var containerWidth = isNOU(containerElement) ? 0 : rectValues.width;\n /* eslint-enable */\n if (isNOU(resizeWestWidth)) {\n if (!isNOU(containerElement)) {\n resizeWestWidth = (((targetRectValues.left - left) - borderValue / 2)) + targetRectValues.width;\n resizeWestWidth = resizeWestWidth + (containerWidth - borderValue - resizeWestWidth);\n }\n else {\n resizeWestWidth = documentWidth;\n }\n }\n if (!isNOU(containerElement) &&\n (Math.floor((targetRectValues.left - rectValues.left) + targetRectValues.width +\n (rectValues.right - targetRectValues.right)) - borderValue) <= maxWidth) {\n calculateValue = true;\n }\n else if (isNOU(containerElement) && pageX >= 0) {\n calculateValue = true;\n }\n var calculatedWidth = originalWidth - (pageX - originalMouseX);\n if (setLeft) {\n calculatedWidth = (calculatedWidth > resizeWestWidth) ? resizeWestWidth : calculatedWidth;\n }\n if (calculateValue) {\n if (calculatedWidth >= minWidth && calculatedWidth <= maxWidth) {\n var containerLeft = 0;\n if (!isNOU(containerElement)) {\n containerLeft = rectValues.left;\n }\n var left_1 = (originalX - containerLeft) + (pageX - originalMouseX);\n left_1 = (left_1 > 0) ? left_1 : 1;\n if (calculatedWidth !== previousWidth && setWidth) {\n targetElement.style.width = calculatedWidth + 'px';\n }\n if (setLeft) {\n targetElement.style.left = left_1 + 'px';\n if (left_1 === 1) {\n setWidth = false;\n }\n else {\n setWidth = true;\n }\n }\n }\n }\n previousWidth = calculatedWidth;\n}\n/* istanbul ignore next */\n// eslint-disable-next-line\nfunction resizeEast(e) {\n var documentWidth = document.documentElement.clientWidth;\n var calculateValue = false;\n var containerRectValues;\n if (!isNOU(containerElement)) {\n containerRectValues = getClientRectValues(containerElement);\n }\n var coordinates = e.touches ? e.changedTouches[0] : e;\n var pageX = coordinates.pageX;\n var targetRectValues = getClientRectValues(targetElement);\n if (!isNOU(containerElement) && (((targetRectValues.left - containerRectValues.left) + targetRectValues.width) <= maxWidth\n || (targetRectValues.right - containerRectValues.left) >= targetRectValues.width)) {\n calculateValue = true;\n }\n else if (isNOU(containerElement) && (documentWidth - pageX) > 0) {\n calculateValue = true;\n }\n var calculatedWidth = originalWidth + (pageX - originalMouseX);\n var containerLeft = 0;\n if (!isNOU(containerElement)) {\n containerLeft = containerRectValues.left;\n }\n if (((targetRectValues.left - containerLeft) + calculatedWidth) > maxWidth) {\n calculateValue = false;\n if (targetElement.classList.contains(RESIZE_WITHIN_VIEWPORT)) {\n return;\n }\n targetElement.style.width = maxWidth - (targetRectValues.left - containerLeft) + 'px';\n }\n if (calculateValue) {\n if (calculatedWidth >= minWidth && calculatedWidth <= maxWidth) {\n targetElement.style.width = calculatedWidth + 'px';\n }\n }\n}\n/* istanbul ignore next */\n/**\n *\n * @param {number} minimumHeight - specifies the number\n * @returns {void}\n */\nexport function setMinHeight(minimumHeight) {\n minHeight = minimumHeight;\n}\n/**\n *\n * @param {number} value - specifies the number value\n * @returns {void}\n */\nexport function setMaxWidth(value) {\n maxWidth = value;\n}\n/**\n *\n * @param {number} value - specifies the number value\n * @returns {void}\n */\nexport function setMaxHeight(value) {\n maxHeight = value;\n}\n/**\n * @returns {void}\n */\nexport function removeResize() {\n var handlers = targetElement.querySelectorAll('.' + RESIZE_HANDLER);\n for (var i = 0; i < handlers.length; i++) {\n detach(handlers[i]);\n }\n var borderResizers = targetElement.querySelectorAll('.e-dialog-border-resize');\n if (!isNOU(borderResizers)) {\n for (var i = 0; i < borderResizers.length; i++) {\n detach(borderResizers[i]);\n }\n }\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, Event, Collection, L10n, Complex, compile, createElement, animationMode } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, detach, attributes, prepend, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty, isBlazor } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, append, EventHandler, Draggable, extend } from '@syncfusion/ej2-base';\nimport { SanitizeHtmlHelper, Browser } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { Popup, PositionData, getZindexPartial } from '../popup/popup';\nimport { createResize, removeResize, setMinHeight, setMaxWidth, setMaxHeight } from '../common/resize';\nvar ButtonProps = /** @class */ (function (_super) {\n __extends(ButtonProps, _super);\n function ButtonProps() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], ButtonProps.prototype, \"isFlat\", void 0);\n __decorate([\n Property()\n ], ButtonProps.prototype, \"buttonModel\", void 0);\n __decorate([\n Property('Button')\n ], ButtonProps.prototype, \"type\", void 0);\n __decorate([\n Event()\n ], ButtonProps.prototype, \"click\", void 0);\n return ButtonProps;\n}(ChildProperty));\nexport { ButtonProps };\n/**\n * Configures the animation properties for both open and close the dialog.\n */\nvar AnimationSettings = /** @class */ (function (_super) {\n __extends(AnimationSettings, _super);\n function AnimationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Fade')\n ], AnimationSettings.prototype, \"effect\", void 0);\n __decorate([\n Property(400)\n ], AnimationSettings.prototype, \"duration\", void 0);\n __decorate([\n Property(0)\n ], AnimationSettings.prototype, \"delay\", void 0);\n return AnimationSettings;\n}(ChildProperty));\nexport { AnimationSettings };\nvar ROOT = 'e-dialog';\nvar RTL = 'e-rtl';\nvar DLG_HEADER_CONTENT = 'e-dlg-header-content';\nvar DLG_HEADER = 'e-dlg-header';\nvar DLG_FOOTER_CONTENT = 'e-footer-content';\nvar MODAL_DLG = 'e-dlg-modal';\nvar DLG_CONTENT = 'e-dlg-content';\nvar DLG_CLOSE_ICON = 'e-icon-dlg-close';\nvar DLG_OVERLAY = 'e-dlg-overlay';\nvar DLG_TARGET = 'e-dlg-target';\nvar DLG_CONTAINER = 'e-dlg-container';\nvar SCROLL_DISABLED = 'e-scroll-disabled';\nvar DLG_PRIMARY_BUTTON = 'e-primary';\nvar ICON = 'e-icons';\nvar POPUP_ROOT = 'e-popup';\nvar DEVICE = 'e-device';\nvar FULLSCREEN = 'e-dlg-fullscreen';\nvar DLG_CLOSE_ICON_BTN = 'e-dlg-closeicon-btn';\nvar DLG_HIDE = 'e-popup-close';\nvar DLG_SHOW = 'e-popup-open';\nvar DLG_UTIL_DEFAULT_TITLE = 'Information';\nvar DLG_UTIL_ROOT = 'e-scroll-disabled';\nvar DLG_UTIL_ALERT = 'e-alert-dialog';\nvar DLG_UTIL_CONFIRM = 'e-confirm-dialog';\nvar DLG_RESIZABLE = 'e-dlg-resizable';\nvar DLG_RESTRICT_LEFT_VALUE = 'e-restrict-left';\nvar DLG_RESTRICT_WIDTH_VALUE = 'e-resize-viewport';\nvar DLG_REF_ELEMENT = 'e-dlg-ref-element';\nvar DLG_USER_ACTION_CLOSED = 'user action';\nvar DLG_CLOSE_ICON_CLOSED = 'close icon';\nvar DLG_ESCAPE_CLOSED = 'escape';\nvar DLG_OVERLAYCLICK_CLOSED = 'overlayClick';\nvar DLG_DRAG = 'e-draggable';\n/**\n * Represents the dialog component that displays the information and get input from the user.\n * Two types of dialog components are `Modal and Modeless (non-modal)` depending on its interaction with parent application.\n * ```html\n *
\n * ```\n * ```typescript\n * \n * ```\n */\nvar Dialog = /** @class */ (function (_super) {\n __extends(Dialog, _super);\n /*\n * * Constructor for creating the widget\n *\n * @param\n * @param\n * @hidden\n */\n function Dialog(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.needsID = true;\n return _this;\n }\n /**\n *Initialize the control rendering\n *\n * @returns {void}\n * @private\n */\n Dialog.prototype.render = function () {\n this.initialize();\n this.initRender();\n this.wireEvents();\n if (this.width === '100%') {\n this.element.style.width = '';\n }\n if (this.minHeight !== '') {\n this.element.style.minHeight = formatUnit(this.minHeight);\n }\n if (this.enableResize) {\n this.setResize();\n if (this.animationSettings.effect === 'None') {\n this.getMinHeight();\n }\n }\n this.renderComplete();\n };\n Dialog.prototype.initializeValue = function () {\n this.dlgClosedBy = DLG_USER_ACTION_CLOSED;\n };\n /**\n *Initialize the event handler\n *\n * @returns {void}\n * @private\n */\n Dialog.prototype.preRender = function () {\n var _this = this;\n this.initializeValue();\n this.headerContent = null;\n this.allowMaxHeight = true;\n this.preventVisibility = true;\n this.clonedEle = this.element.cloneNode(true);\n this.closeIconClickEventHandler = function (event) {\n _this.dlgClosedBy = DLG_CLOSE_ICON_CLOSED;\n _this.hide(event);\n };\n this.dlgOverlayClickEventHandler = function (event) {\n _this.dlgClosedBy = DLG_OVERLAYCLICK_CLOSED;\n event.preventFocus = false;\n _this.trigger('overlayClick', event, function (overlayClickEventArgs) {\n if (!overlayClickEventArgs.preventFocus) {\n _this.focusContent();\n }\n _this.dlgClosedBy = DLG_USER_ACTION_CLOSED;\n });\n };\n var localeText = { close: 'Close' };\n this.l10n = new L10n('dialog', localeText, this.locale);\n this.checkPositionData();\n if (isNullOrUndefined(this.target)) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.target = document.body;\n this.isProtectedOnChange = prevOnChange;\n }\n };\n Dialog.prototype.updatePersistData = function () {\n if (this.enablePersistence) {\n this.setProperties({ width: parseFloat(this.element.style.width), height: parseFloat(this.element.style.height),\n position: { X: parseFloat(this.dragObj.element.style.left), Y: parseFloat(this.dragObj.element.style.top) } }, true);\n }\n };\n Dialog.prototype.isNumberValue = function (value) {\n var isNumber = /^[-+]?\\d*\\.?\\d+$/.test(value);\n return isNumber;\n };\n Dialog.prototype.checkPositionData = function () {\n if (!isNullOrUndefined(this.position)) {\n if (!isNullOrUndefined(this.position.X) && (typeof (this.position.X) !== 'number')) {\n var isNumber = this.isNumberValue(this.position.X);\n if (isNumber) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.position.X = parseFloat(this.position.X);\n this.isProtectedOnChange = prevOnChange;\n }\n }\n if (!isNullOrUndefined(this.position.Y) && (typeof (this.position.Y) !== 'number')) {\n var isNumber = this.isNumberValue(this.position.Y);\n if (isNumber) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.position.Y = parseFloat(this.position.Y);\n this.isProtectedOnChange = prevOnChange;\n }\n }\n }\n };\n Dialog.prototype.getEle = function (list, selector) {\n var element = undefined;\n for (var i = 0; i < list.length; i++) {\n if (list[i].classList.contains(selector)) {\n element = list[i];\n break;\n }\n }\n return element;\n };\n /* istanbul ignore next */\n Dialog.prototype.getMinHeight = function () {\n var computedHeaderHeight = '0px';\n var computedFooterHeight = '0px';\n if (!isNullOrUndefined(this.element.querySelector('.' + DLG_HEADER_CONTENT))) {\n computedHeaderHeight = getComputedStyle(this.headerContent).height;\n }\n var footerEle = this.getEle(this.element.children, DLG_FOOTER_CONTENT);\n if (!isNullOrUndefined(footerEle)) {\n computedFooterHeight = getComputedStyle(footerEle).height;\n }\n var headerHeight = parseInt(computedHeaderHeight.slice(0, computedHeaderHeight.indexOf('p')), 10);\n var footerHeight = parseInt(computedFooterHeight.slice(0, computedFooterHeight.indexOf('p')), 10);\n setMinHeight(headerHeight + 30 + (isNaN(footerHeight) ? 0 : footerHeight));\n return (headerHeight + 30 + footerHeight);\n };\n Dialog.prototype.onResizeStart = function (args, dialogObj) {\n dialogObj.trigger('resizeStart', args);\n return args.cancel;\n };\n Dialog.prototype.onResizing = function (args, dialogObj) {\n dialogObj.trigger('resizing', args);\n };\n Dialog.prototype.onResizeComplete = function (args, dialogObj) {\n dialogObj.trigger('resizeStop', args);\n this.updatePersistData();\n };\n Dialog.prototype.setResize = function () {\n if (this.enableResize) {\n if (this.isBlazorServerRender() && !isNullOrUndefined(this.element.querySelector('.e-icons.e-resize-handle'))) {\n return;\n }\n this.element.classList.add(DLG_RESIZABLE);\n var computedHeight = getComputedStyle(this.element).minHeight;\n var computedWidth = getComputedStyle(this.element).minWidth;\n var direction = '';\n for (var i = 0; i < this.resizeHandles.length; i++) {\n if (this.resizeHandles[i] === 'All') {\n direction = 'south north east west north-east north-west south-east south-west';\n break;\n }\n else {\n var directionValue = '';\n switch (this.resizeHandles[i].toString()) {\n case 'SouthEast':\n directionValue = 'south-east';\n break;\n case 'SouthWest':\n directionValue = 'south-west';\n break;\n case 'NorthEast':\n directionValue = 'north-east';\n break;\n case 'NorthWest':\n directionValue = 'north-west';\n break;\n default:\n directionValue = this.resizeHandles[i].toString();\n break;\n }\n direction += directionValue.toLocaleLowerCase() + ' ';\n }\n }\n if (this.enableRtl && direction.trim() === 'south-east') {\n direction = 'south-west';\n }\n else if (this.enableRtl && direction.trim() === 'south-west') {\n direction = 'south-east';\n }\n if (this.isModal && this.enableRtl) {\n this.element.classList.add(DLG_RESTRICT_LEFT_VALUE);\n }\n else if (this.isModal && this.target === document.body) {\n this.element.classList.add(DLG_RESTRICT_WIDTH_VALUE);\n }\n createResize({\n element: this.element,\n direction: direction,\n minHeight: parseInt(computedHeight.slice(0, computedWidth.indexOf('p')), 10),\n maxHeight: this.targetEle.clientHeight,\n minWidth: parseInt(computedWidth.slice(0, computedWidth.indexOf('p')), 10),\n maxWidth: this.targetEle.clientWidth,\n boundary: this.target === document.body ? null : this.targetEle,\n resizeBegin: this.onResizeStart.bind(this),\n resizeComplete: this.onResizeComplete.bind(this),\n resizing: this.onResizing.bind(this),\n proxy: this\n });\n this.wireWindowResizeEvent();\n }\n else {\n removeResize();\n this.unWireWindowResizeEvent();\n if (this.isModal) {\n this.element.classList.remove(DLG_RESTRICT_LEFT_VALUE);\n }\n else {\n this.element.classList.remove(DLG_RESTRICT_WIDTH_VALUE);\n }\n this.element.classList.remove(DLG_RESIZABLE);\n }\n };\n Dialog.prototype.getFocusElement = function (target) {\n var value = 'input,select,textarea,button:enabled,a,[contenteditable=\"true\"],[tabindex]';\n var items = target.querySelectorAll(value);\n return { element: items[items.length - 1] };\n };\n /* istanbul ignore next */\n Dialog.prototype.keyDown = function (event) {\n var _this = this;\n if (event.keyCode === 9) {\n if (this.isModal) {\n var buttonObj = void 0;\n if (!isNullOrUndefined(this.btnObj)) {\n buttonObj = this.btnObj[this.btnObj.length - 1];\n }\n if ((isNullOrUndefined(this.btnObj)) && (!isNullOrUndefined(this.ftrTemplateContent))) {\n buttonObj = this.getFocusElement(this.ftrTemplateContent);\n }\n if (isNullOrUndefined(this.btnObj) && isNullOrUndefined(this.ftrTemplateContent) && !isNullOrUndefined(this.contentEle)) {\n buttonObj = this.getFocusElement(this.contentEle);\n }\n if (!isNullOrUndefined(buttonObj) && document.activeElement === buttonObj.element && !event.shiftKey) {\n event.preventDefault();\n this.focusableElements(this.element).focus();\n }\n if (document.activeElement === this.focusableElements(this.element) && event.shiftKey) {\n event.preventDefault();\n if (!isNullOrUndefined(buttonObj)) {\n buttonObj.element.focus();\n }\n }\n }\n }\n var element = document.activeElement;\n var isTagName = (['input', 'textarea'].indexOf(element.tagName.toLowerCase()) > -1);\n var isContentEdit = false;\n if (!isTagName) {\n isContentEdit = element.hasAttribute('contenteditable') && element.getAttribute('contenteditable') === 'true';\n }\n if (event.keyCode === 27 && this.closeOnEscape) {\n this.dlgClosedBy = DLG_ESCAPE_CLOSED;\n var query = document.querySelector('.e-popup-open:not(.e-dialog)');\n // 'document.querySelector' is used to find the elements rendered based on body\n if (!(!isNullOrUndefined(query) && !query.classList.contains('e-toolbar-pop'))) {\n this.hide(event);\n }\n }\n if ((event.keyCode === 13 && !event.ctrlKey && element.tagName.toLowerCase() !== 'textarea' &&\n isTagName && !isNullOrUndefined(this.primaryButtonEle)) ||\n (event.keyCode === 13 && event.ctrlKey && (element.tagName.toLowerCase() === 'textarea' ||\n isContentEdit)) && !isNullOrUndefined(this.primaryButtonEle)) {\n var buttonIndex_1;\n var firstPrimary = this.buttons.some(function (data, index) {\n buttonIndex_1 = index;\n // eslint-disable-next-line\n var buttonModel = data.buttonModel;\n return !isNullOrUndefined(buttonModel) && buttonModel.isPrimary === true;\n });\n if (firstPrimary && typeof (this.buttons[buttonIndex_1].click) === 'function') {\n setTimeout(function () {\n _this.buttons[buttonIndex_1].click.call(_this, event);\n });\n }\n }\n };\n /**\n * Initialize the control rendering\n *\n * @returns {void}\n * @private\n */\n Dialog.prototype.initialize = function () {\n if (!isNullOrUndefined(this.target)) {\n this.targetEle = ((typeof this.target) === 'string') ?\n document.querySelector(this.target) : this.target;\n }\n if (!this.isBlazorServerRender()) {\n addClass([this.element], ROOT);\n }\n if (Browser.isDevice) {\n addClass([this.element], DEVICE);\n }\n if (!this.isBlazorServerRender()) {\n this.setCSSClass();\n }\n this.setMaxHeight();\n };\n /**\n * Initialize the rendering\n *\n * @returns {void}\n * @private\n */\n Dialog.prototype.initRender = function () {\n var _this = this;\n this.initialRender = true;\n if (!this.isBlazorServerRender()) {\n attributes(this.element, { role: 'dialog' });\n }\n if (this.zIndex === 1000) {\n this.setzIndex(this.element, false);\n this.calculatezIndex = true;\n }\n else {\n this.calculatezIndex = false;\n }\n if (this.isBlazorServerRender() && isNullOrUndefined(this.headerContent)) {\n this.headerContent = this.element.getElementsByClassName('e-dlg-header-content')[0];\n }\n if (this.isBlazorServerRender() && isNullOrUndefined(this.contentEle)) {\n this.contentEle = this.element.querySelector('#' + this.element.id + '_dialog-content');\n }\n if (!this.isBlazorServerRender()) {\n this.setTargetContent();\n if (this.header !== '' && !isNullOrUndefined(this.header)) {\n this.setHeader();\n }\n this.renderCloseIcon();\n this.setContent();\n if (this.footerTemplate !== '' && !isNullOrUndefined(this.footerTemplate)) {\n this.setFooterTemplate();\n }\n else if (!isNullOrUndefined(this.buttons[0].buttonModel)) {\n this.setButton();\n }\n }\n if (this.isBlazorServerRender()) {\n if (!isNullOrUndefined(this.buttons[0].buttonModel) && this.footerTemplate === '') {\n this.setButton();\n }\n }\n if (this.allowDragging && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n if (!this.isBlazorServerRender()) {\n attributes(this.element, { 'aria-modal': (this.isModal ? 'true' : 'false') });\n if (this.isModal) {\n this.setIsModal();\n }\n }\n if (this.isBlazorServerRender() && isNullOrUndefined(this.dlgContainer)) {\n this.dlgContainer = this.element.parentElement;\n for (var i = 0, childNodes = this.dlgContainer.children; i < childNodes.length; i++) {\n if (childNodes[i].classList.contains('e-dlg-overlay')) {\n this.dlgOverlay = childNodes[i];\n }\n }\n }\n if (this.element.classList.contains(DLG_UTIL_ALERT) !== true && this.element.classList.contains(DLG_UTIL_CONFIRM) !== true\n && !isNullOrUndefined(this.element.parentElement)) {\n var parentEle = this.isModal ? this.dlgContainer.parentElement : this.element.parentElement;\n this.refElement = this.createElement('div', { className: DLG_REF_ELEMENT });\n parentEle.insertBefore(this.refElement, (this.isModal ? this.dlgContainer : this.element));\n }\n if (!isNullOrUndefined(this.targetEle)) {\n // eslint-disable-next-line\n this.isModal ? this.targetEle.appendChild(this.dlgContainer) : this.targetEle.appendChild(this.element);\n }\n this.popupObj = new Popup(this.element, {\n height: this.height,\n width: this.width,\n zIndex: this.zIndex,\n relateTo: this.target,\n actionOnScroll: 'none',\n enableRtl: this.enableRtl,\n // eslint-disable-next-line\n open: function (event) {\n var eventArgs = {\n container: _this.isModal ? _this.dlgContainer : _this.element,\n element: _this.element,\n target: _this.target,\n preventFocus: false\n };\n if (_this.enableResize) {\n _this.resetResizeIcon();\n }\n _this.trigger('open', eventArgs, function (openEventArgs) {\n if (!openEventArgs.preventFocus) {\n _this.focusContent();\n }\n });\n },\n // eslint-disable-next-line\n close: function (event) {\n if (_this.isModal) {\n addClass([_this.dlgOverlay], 'e-fade');\n }\n _this.unBindEvent(_this.element);\n if (_this.isModal) {\n _this.dlgContainer.style.display = 'none';\n }\n _this.trigger('close', _this.closeArgs);\n var activeEle = document.activeElement;\n if (!isNullOrUndefined(activeEle) && !isNullOrUndefined((activeEle).blur)) {\n activeEle.blur();\n }\n if (!isNullOrUndefined(_this.storeActiveElement) && !isNullOrUndefined(_this.storeActiveElement.focus)) {\n _this.storeActiveElement.focus();\n }\n }\n });\n this.positionChange();\n this.setEnableRTL();\n if (!this.isBlazorServerRender()) {\n addClass([this.element], DLG_HIDE);\n if (this.isModal) {\n this.setOverlayZindex();\n }\n }\n if (this.visible) {\n this.show();\n if (this.isModal) {\n var targetType = this.getTargetContainer(this.target);\n if (targetType instanceof Element) {\n var computedStyle = window.getComputedStyle(targetType);\n if (computedStyle.getPropertyValue('direction') === 'rtl') {\n this.setPopupPosition();\n }\n }\n }\n }\n else {\n if (this.isModal) {\n this.dlgOverlay.style.display = 'none';\n }\n }\n this.initialRender = false;\n };\n Dialog.prototype.getTargetContainer = function (targetValue) {\n var targetElement = null;\n if (typeof targetValue === 'string') {\n if (targetValue.startsWith('#')) {\n targetElement = document.getElementById(targetValue.substring(1));\n }\n else if (targetValue.startsWith('.')) {\n var elements = document.getElementsByClassName(targetValue.substring(1));\n targetElement = elements.length > 0 ? elements[0] : null;\n }\n else {\n if (!(targetValue instanceof HTMLElement) && targetValue !== document.body) {\n targetElement = document.querySelector(targetValue);\n }\n }\n }\n else if (targetValue instanceof HTMLElement) {\n targetElement = targetValue;\n }\n return targetElement;\n };\n Dialog.prototype.resetResizeIcon = function () {\n var dialogConHeight = this.getMinHeight();\n if (this.targetEle.offsetHeight < dialogConHeight) {\n var className = this.enableRtl ? 'e-south-west' : 'e-south-east';\n var resizeIcon = this.element.querySelector('.' + className);\n if (!isNullOrUndefined(resizeIcon)) {\n resizeIcon.style.bottom = '-' + dialogConHeight.toString() + 'px';\n }\n }\n };\n Dialog.prototype.setOverlayZindex = function (zIndexValue) {\n var zIndex;\n if (isNullOrUndefined(zIndexValue)) {\n zIndex = parseInt(this.element.style.zIndex, 10) ? parseInt(this.element.style.zIndex, 10) : this.zIndex;\n }\n else {\n zIndex = zIndexValue;\n }\n this.dlgOverlay.style.zIndex = (zIndex - 1).toString();\n this.dlgContainer.style.zIndex = zIndex.toString();\n };\n Dialog.prototype.positionChange = function () {\n if (this.isModal) {\n if (!isNaN(parseFloat(this.position.X)) && !isNaN(parseFloat(this.position.Y))) {\n this.setPopupPosition();\n }\n else if ((!isNaN(parseFloat(this.position.X)) && isNaN(parseFloat(this.position.Y)))\n || (isNaN(parseFloat(this.position.X)) && !isNaN(parseFloat(this.position.Y)))) {\n this.setPopupPosition();\n }\n else {\n this.element.style.top = '0px';\n this.element.style.left = '0px';\n this.dlgContainer.classList.add('e-dlg-' + this.position.X + '-' + this.position.Y);\n }\n }\n else {\n this.setPopupPosition();\n }\n };\n Dialog.prototype.setPopupPosition = function () {\n this.popupObj.setProperties({\n position: {\n X: this.position.X, Y: this.position.Y\n }\n });\n };\n Dialog.prototype.setAllowDragging = function () {\n var _this = this;\n var handleContent = '.' + DLG_HEADER_CONTENT;\n if (!this.element.classList.contains(DLG_DRAG)) {\n this.dragObj = new Draggable(this.element, {\n clone: false,\n isDragScroll: true,\n abort: '.e-dlg-closeicon-btn',\n handle: handleContent,\n dragStart: function (event) {\n _this.trigger('dragStart', event, function (dragEventArgs) {\n if (isBlazor()) {\n dragEventArgs.bindEvents(event.dragElement);\n }\n });\n },\n dragStop: function (event) {\n if (_this.isModal) {\n if (!isNullOrUndefined(_this.position)) {\n _this.dlgContainer.classList.remove('e-dlg-' + _this.position.X + '-' + _this.position.Y);\n }\n // Reset the dialog position after drag completion.\n var targetType = _this.getTargetContainer(_this.target);\n if (targetType instanceof Element) {\n var computedStyle = window.getComputedStyle(targetType);\n if (computedStyle.getPropertyValue('direction') === 'rtl') {\n _this.element.style.position = 'absolute';\n }\n else {\n _this.element.style.position = 'relative';\n }\n }\n else {\n _this.element.style.position = 'relative';\n }\n }\n _this.trigger('dragStop', event);\n _this.element.classList.remove(DLG_RESTRICT_LEFT_VALUE);\n _this.updatePersistData();\n },\n drag: function (event) {\n _this.trigger('drag', event);\n }\n });\n if (!isNullOrUndefined(this.targetEle)) {\n this.dragObj.dragArea = this.targetEle;\n }\n }\n };\n Dialog.prototype.setButton = function () {\n if (!this.isBlazorServerRender()) {\n this.buttonContent = [];\n this.btnObj = [];\n // eslint-disable-next-line\n var primaryBtnFlag = true;\n for (var i = 0; i < this.buttons.length; i++) {\n var buttonType = !isNullOrUndefined(this.buttons[i].type) ? this.buttons[i].type.toLowerCase() : 'button';\n var btn = this.createElement('button', { className: this.cssClass, attrs: { type: buttonType } });\n this.buttonContent.push(btn.outerHTML);\n }\n this.setFooterTemplate();\n }\n var footerBtn;\n for (var i = 0, childNodes = this.element.children; i < childNodes.length; i++) {\n if (childNodes[i].classList.contains(DLG_FOOTER_CONTENT)) {\n footerBtn = childNodes[i].querySelectorAll('button');\n }\n }\n for (var i = 0; i < this.buttons.length; i++) {\n if (!this.isBlazorServerRender()) {\n this.btnObj[i] = new Button(this.buttons[i].buttonModel);\n }\n if (this.isBlazorServerRender()) {\n this.ftrTemplateContent = this.element.querySelector('.' + DLG_FOOTER_CONTENT);\n }\n if (!isNullOrUndefined(this.ftrTemplateContent) && footerBtn.length > 0) {\n if (typeof (this.buttons[i].click) === 'function') {\n EventHandler.add(footerBtn[i], 'click', this.buttons[i].click, this);\n }\n if (typeof (this.buttons[i].click) === 'object') {\n EventHandler.add(footerBtn[i], 'click', this.buttonClickHandler.bind(this, i), this);\n }\n }\n if (!this.isBlazorServerRender() && !isNullOrUndefined(this.ftrTemplateContent)) {\n this.btnObj[i].appendTo(this.ftrTemplateContent.children[i]);\n if (this.buttons[i].isFlat) {\n this.btnObj[i].element.classList.add('e-flat');\n }\n this.primaryButtonEle = this.element.getElementsByClassName('e-primary')[0];\n }\n }\n };\n Dialog.prototype.buttonClickHandler = function (index) {\n this.trigger('buttons[' + index + '].click', {});\n };\n Dialog.prototype.setContent = function () {\n this.contentEle = this.createElement('div', { className: DLG_CONTENT, id: this.element.id + '_dialog-content' });\n if (this.headerEle) {\n attributes(this.element, { 'aria-describedby': this.element.id + '_title' + ' ' + this.element.id + '_dialog-content' });\n }\n else {\n attributes(this.element, { 'aria-describedby': this.element.id + '_dialog-content' });\n }\n if (this.innerContentElement) {\n this.contentEle.appendChild(this.innerContentElement);\n }\n else if (!isNullOrUndefined(this.content) && this.content !== '' || !this.initialRender) {\n // eslint-disable-next-line\n var blazorContain = Object.keys(window);\n if (typeof (this.content) === 'string' && !isBlazor()) {\n this.setTemplate(this.content, this.contentEle, 'content');\n }\n else if (this.content instanceof HTMLElement) {\n this.contentEle.appendChild(this.content);\n }\n else {\n this.setTemplate(this.content, this.contentEle, 'content');\n }\n }\n if (!isNullOrUndefined(this.headerContent)) {\n this.element.insertBefore(this.contentEle, this.element.children[1]);\n }\n else {\n this.element.insertBefore(this.contentEle, this.element.children[0]);\n }\n if (this.height === 'auto') {\n if (!this.isBlazorServerRender() && Browser.isIE && this.element.style.width === '' && !isNullOrUndefined(this.width)) {\n this.element.style.width = formatUnit(this.width);\n }\n this.setMaxHeight();\n }\n };\n Dialog.prototype.setTemplate = function (template, toElement, prop) {\n var templateFn;\n var templateProps;\n // eslint-disable-next-line\n var blazorContain = Object.keys(window);\n if (toElement.classList.contains(DLG_HEADER)) {\n templateProps = this.element.id + 'header';\n }\n else if (toElement.classList.contains(DLG_FOOTER_CONTENT)) {\n templateProps = this.element.id + 'footerTemplate';\n }\n else {\n templateProps = this.element.id + 'content';\n }\n var templateValue;\n if (!isNullOrUndefined(template.outerHTML)) {\n toElement.appendChild(template);\n }\n else if ((typeof template === 'string') || (typeof template !== 'string') || (isBlazor() && !this.isStringTemplate)) {\n if ((typeof template === 'string')) {\n template = this.sanitizeHelper(template);\n }\n if (this.isVue || typeof template !== 'string') {\n templateFn = compile(template);\n templateValue = template;\n }\n else {\n toElement.innerHTML = template;\n }\n }\n var fromElements = [];\n if (!isNullOrUndefined(templateFn)) {\n var isString = (isBlazor() &&\n !this.isStringTemplate && (templateValue).indexOf('
Blazor') === 0) ?\n this.isStringTemplate : true;\n for (var _i = 0, _a = templateFn({}, this, prop, templateProps, isString); _i < _a.length; _i++) {\n var item = _a[_i];\n fromElements.push(item);\n }\n append([].slice.call(fromElements), toElement);\n }\n };\n /*\n * @returns {void}\n * @hidden\n * @value\n */\n Dialog.prototype.sanitizeHelper = function (value) {\n if (this.enableHtmlSanitizer) {\n var dialogItem = SanitizeHtmlHelper.beforeSanitize();\n var beforeEvent = {\n cancel: false,\n helper: null\n };\n extend(dialogItem, dialogItem, beforeEvent);\n this.trigger('beforeSanitizeHtml', dialogItem);\n if (dialogItem.cancel && !isNullOrUndefined(dialogItem.helper)) {\n value = dialogItem.helper(value);\n }\n else if (!dialogItem.cancel) {\n value = SanitizeHtmlHelper.serializeValue(dialogItem, value);\n }\n }\n return value;\n };\n Dialog.prototype.setMaxHeight = function () {\n if (!this.allowMaxHeight) {\n return;\n }\n var display = this.element.style.display;\n this.element.style.display = 'none';\n this.element.style.maxHeight = (!isNullOrUndefined(this.target)) && (this.targetEle.offsetHeight < window.innerHeight) ?\n (this.targetEle.offsetHeight - 20) + 'px' : (window.innerHeight - 20) + 'px';\n this.element.style.display = display;\n if (Browser.isIE && this.height === 'auto' && !isNullOrUndefined(this.contentEle)\n && this.element.offsetHeight < this.contentEle.offsetHeight) {\n this.element.style.height = 'inherit';\n }\n };\n Dialog.prototype.setEnableRTL = function () {\n if (!this.isBlazorServerRender()) {\n // eslint-disable-next-line\n this.enableRtl ? addClass([this.element], RTL) : removeClass([this.element], RTL);\n }\n if (!isNullOrUndefined(this.element.querySelector('.e-resize-handle'))) {\n removeResize();\n this.setResize();\n }\n };\n Dialog.prototype.setTargetContent = function () {\n var _this = this;\n if (isNullOrUndefined(this.content) || this.content === '') {\n var isContent = this.element.innerHTML.replace(/\\s|<(\\/?|\\/?)(!--!--)>/g, '') !== '';\n if (this.element.children.length > 0 || isContent) {\n this.innerContentElement = document.createDocumentFragment();\n [].slice.call(this.element.childNodes).forEach(function (el) {\n if (el.nodeType !== 8) {\n _this.innerContentElement.appendChild(el);\n }\n });\n }\n }\n };\n Dialog.prototype.setHeader = function () {\n if (this.headerEle) {\n this.headerEle.innerHTML = '';\n }\n else {\n this.headerEle = this.createElement('div', { id: this.element.id + '_title', className: DLG_HEADER });\n }\n this.createHeaderContent();\n this.headerContent.appendChild(this.headerEle);\n this.setTemplate(this.header, this.headerEle, 'header');\n attributes(this.element, { 'aria-describedby': this.element.id + '_title' });\n attributes(this.element, { 'aria-label': \"dialog\" });\n this.element.insertBefore(this.headerContent, this.element.children[0]);\n if (this.allowDragging && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n };\n Dialog.prototype.setFooterTemplate = function () {\n if (this.ftrTemplateContent) {\n this.ftrTemplateContent.innerHTML = '';\n }\n else {\n this.ftrTemplateContent = this.createElement('div', {\n className: DLG_FOOTER_CONTENT\n });\n }\n if (this.footerTemplate !== '' && !isNullOrUndefined(this.footerTemplate)) {\n this.setTemplate(this.footerTemplate, this.ftrTemplateContent, 'footerTemplate');\n }\n else {\n this.ftrTemplateContent.innerHTML = this.buttonContent.join('');\n }\n this.element.appendChild(this.ftrTemplateContent);\n };\n Dialog.prototype.createHeaderContent = function () {\n if (isNullOrUndefined(this.headerContent)) {\n this.headerContent = this.createElement('div', { id: this.element.id + '_dialog-header', className: DLG_HEADER_CONTENT });\n }\n };\n Dialog.prototype.renderCloseIcon = function () {\n if (this.showCloseIcon) {\n this.closeIcon = this.createElement('button', { className: DLG_CLOSE_ICON_BTN, attrs: { type: 'button' } });\n this.closeIconBtnObj = new Button({ cssClass: 'e-flat', iconCss: DLG_CLOSE_ICON + ' ' + ICON });\n this.closeIconTitle();\n if (!isNullOrUndefined(this.headerContent)) {\n prepend([this.closeIcon], this.headerContent);\n }\n else {\n this.createHeaderContent();\n prepend([this.closeIcon], this.headerContent);\n this.element.insertBefore(this.headerContent, this.element.children[0]);\n }\n this.closeIconBtnObj.appendTo(this.closeIcon);\n }\n };\n Dialog.prototype.closeIconTitle = function () {\n this.l10n.setLocale(this.locale);\n var closeIconTitle = this.l10n.getConstant('close');\n this.closeIcon.setAttribute('title', closeIconTitle);\n this.closeIcon.setAttribute('aria-label', closeIconTitle);\n };\n Dialog.prototype.setCSSClass = function (oldCSSClass) {\n if (oldCSSClass) {\n removeClass([this.element], oldCSSClass.split(' '));\n if (this.isModal && !isNullOrUndefined(this.dlgContainer)) {\n removeClass([this.dlgContainer], oldCSSClass.split(' '));\n }\n }\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n if (this.isModal && !isNullOrUndefined(this.dlgContainer)) {\n addClass([this.dlgContainer], this.cssClass.split(' '));\n }\n }\n };\n Dialog.prototype.setIsModal = function () {\n this.dlgContainer = this.createElement('div', { className: DLG_CONTAINER });\n this.setCSSClass();\n this.element.classList.remove(DLG_SHOW);\n this.element.parentNode.insertBefore(this.dlgContainer, this.element);\n this.dlgContainer.appendChild(this.element);\n addClass([this.element], MODAL_DLG);\n this.dlgOverlay = this.createElement('div', { className: DLG_OVERLAY });\n this.dlgOverlay.style.zIndex = (this.zIndex - 1).toString();\n this.dlgContainer.appendChild(this.dlgOverlay);\n };\n Dialog.prototype.getValidFocusNode = function (items) {\n var node;\n for (var u = 0; u < items.length; u++) {\n node = items[u];\n if ((node.clientHeight > 0 || (node.tagName.toLowerCase() === 'a' && node.hasAttribute('href'))) && node.tabIndex > -1 &&\n !node.disabled && !this.disableElement(node, '[disabled],[aria-disabled=\"true\"],[type=\"hidden\"]')) {\n return node;\n }\n else {\n node = null;\n }\n }\n return node;\n };\n Dialog.prototype.focusableElements = function (content) {\n if (!isNullOrUndefined(content)) {\n var value = 'input,select,textarea,button,a,[contenteditable=\"true\"],[tabindex]';\n var items = content.querySelectorAll(value);\n return this.getValidFocusNode(items);\n }\n return null;\n };\n Dialog.prototype.getAutoFocusNode = function (container) {\n var node = container.querySelector('.' + DLG_CLOSE_ICON_BTN);\n var value = '[autofocus]';\n var items = container.querySelectorAll(value);\n var validNode = this.getValidFocusNode(items);\n if (isBlazor()) {\n this.primaryButtonEle = this.element.getElementsByClassName('e-primary')[0];\n }\n if (!isNullOrUndefined(validNode)) {\n node = validNode;\n }\n else {\n validNode = this.focusableElements(this.contentEle);\n if (!isNullOrUndefined(validNode)) {\n return node = validNode;\n }\n else if (!isNullOrUndefined(this.primaryButtonEle)) {\n return this.element.querySelector('.' + DLG_PRIMARY_BUTTON);\n }\n }\n return node;\n };\n Dialog.prototype.disableElement = function (element, t) {\n var elementMatch = element ? element.matches || element.webkitMatchesSelector || element.msGetRegionContent : null;\n if (elementMatch) {\n for (; element; element = element.parentNode) {\n if (element instanceof Element && elementMatch.call(element, t)) {\n /* istanbul ignore next */\n return element;\n }\n }\n }\n return null;\n };\n Dialog.prototype.focusContent = function () {\n var element = this.getAutoFocusNode(this.element);\n var node = !isNullOrUndefined(element) ? element : this.element;\n var userAgent = Browser.userAgent;\n if (userAgent.indexOf('MSIE ') > 0 || userAgent.indexOf('Trident/') > 0) {\n this.element.focus();\n }\n node.focus();\n this.unBindEvent(this.element);\n this.bindEvent(this.element);\n };\n Dialog.prototype.bindEvent = function (element) {\n EventHandler.add(element, 'keydown', this.keyDown, this);\n };\n Dialog.prototype.unBindEvent = function (element) {\n EventHandler.remove(element, 'keydown', this.keyDown);\n };\n Dialog.prototype.updateSanitizeContent = function () {\n if (!this.isBlazorServerRender()) {\n this.contentEle.innerHTML = this.sanitizeHelper(this.content);\n }\n };\n Dialog.prototype.isBlazorServerRender = function () {\n return isBlazor() && this.isServerRendered;\n };\n /**\n * Module required function\n *\n * @returns {void}\n * @private\n */\n Dialog.prototype.getModuleName = function () {\n return 'dialog';\n };\n /**\n * Called internally if any of the property value changed\n *\n * @param {DialogModel} newProp - specifies the new property\n * @param {DialogModel} oldProp - specifies the old property\n * @private\n * @returns {void}\n */\n Dialog.prototype.onPropertyChanged = function (newProp, oldProp) {\n if (!this.element.classList.contains(ROOT)) {\n return;\n }\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'content':\n if (!isNullOrUndefined(this.content) && this.content !== '') {\n if (this.isBlazorServerRender()) {\n this.contentEle = this.element.querySelector('.e-dlg-content');\n }\n if (!isNullOrUndefined(this.contentEle) && this.contentEle.getAttribute('role') !== 'dialog') {\n if (!this.isBlazorServerRender()) {\n this.contentEle.innerHTML = '';\n }\n if (typeof (this.content) === 'function') {\n this.clearTemplate(['content']);\n detach(this.contentEle);\n this.contentEle = null;\n this.setContent();\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n typeof (this.content) === 'string' ? (this.isBlazorServerRender() && (this.contentEle.innerText === '')) ?\n this.contentEle.insertAdjacentHTML('beforeend', this.sanitizeHelper(this.content)) :\n this.updateSanitizeContent() : this.contentEle.appendChild(this.content);\n }\n this.setMaxHeight();\n }\n else {\n if (!this.isBlazorServerRender() ||\n isNullOrUndefined(this.element.querySelector('.e-dlg-content'))) {\n this.setContent();\n }\n }\n }\n else if (!isNullOrUndefined(this.contentEle)) {\n detach(this.contentEle);\n this.contentEle = null;\n }\n break;\n case 'header':\n if (this.header === '' || isNullOrUndefined(this.header)) {\n if (this.headerEle) {\n detach(this.headerEle);\n this.headerEle = null;\n }\n }\n else {\n if (!this.isBlazorServerRender() ||\n isNullOrUndefined(this.element.querySelector('.e-dlg-header-content'))) {\n this.setHeader();\n }\n }\n break;\n case 'footerTemplate':\n if (this.footerTemplate === '' || isNullOrUndefined(this.footerTemplate)) {\n if (!this.ftrTemplateContent) {\n return;\n }\n detach(this.ftrTemplateContent);\n this.ftrTemplateContent = null;\n this.buttons = [{}];\n }\n else {\n if (!this.isBlazorServerRender() ||\n isNullOrUndefined(this.element.querySelector('.e-footer-content'))) {\n this.setFooterTemplate();\n }\n this.buttons = [{}];\n }\n break;\n case 'showCloseIcon':\n if (this.element.getElementsByClassName(DLG_CLOSE_ICON).length > 0) {\n if (!this.showCloseIcon && (this.header === '' || isNullOrUndefined(this.header))) {\n detach(this.headerContent);\n this.headerContent = null;\n }\n else if (!this.showCloseIcon) {\n detach(this.closeIcon);\n }\n else {\n if (this.isBlazorServerRender()) {\n this.wireEvents();\n }\n }\n }\n else {\n if (!this.isBlazorServerRender()) {\n this.renderCloseIcon();\n }\n this.wireEvents();\n }\n break;\n case 'locale':\n if (this.showCloseIcon) {\n this.closeIconTitle();\n }\n break;\n case 'visible':\n // eslint-disable-next-line\n this.visible ? this.show() : this.hide();\n break;\n case 'isModal':\n this.updateIsModal();\n break;\n case 'height':\n setStyleAttribute(this.element, { 'height': formatUnit(newProp.height) });\n this.updatePersistData();\n break;\n case 'width':\n setStyleAttribute(this.element, { 'width': formatUnit(newProp.width) });\n this.updatePersistData();\n break;\n case 'zIndex':\n this.popupObj.zIndex = this.zIndex;\n if (this.isModal) {\n this.setOverlayZindex(this.zIndex);\n }\n if (this.element.style.zIndex !== this.zIndex.toString()) {\n this.calculatezIndex = false;\n }\n break;\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n case 'buttons': {\n var buttonCount = this.buttons.length;\n if (!isNullOrUndefined(this.ftrTemplateContent) && !this.isBlazorServerRender()) {\n detach(this.ftrTemplateContent);\n this.ftrTemplateContent = null;\n }\n for (var i = 0; i < buttonCount; i++) {\n if (!isNullOrUndefined(this.buttons[i].buttonModel)) {\n this.footerTemplate = '';\n this.setButton();\n }\n }\n break;\n }\n case 'allowDragging':\n if (this.allowDragging && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n else {\n this.dragObj.destroy();\n }\n break;\n case 'target':\n this.setTarget(newProp.target);\n break;\n case 'position':\n this.checkPositionData();\n if (this.isModal) {\n var positionX = !isNullOrUndefined(oldProp.position) && !isNullOrUndefined(oldProp.position.X) ? oldProp.position.X : this.position.X;\n var positionY = !isNullOrUndefined(oldProp.position) && !isNullOrUndefined(oldProp.position.Y) ? oldProp.position.Y : this.position.Y;\n if (this.dlgContainer.classList.contains('e-dlg-' + positionX + '-' + positionY)) {\n this.dlgContainer.classList.remove('e-dlg-' + positionX + '-' + positionY);\n }\n }\n this.positionChange();\n this.updatePersistData();\n break;\n case 'enableRtl':\n this.setEnableRTL();\n break;\n case 'enableResize':\n this.setResize();\n break;\n case 'minHeight':\n if (this.minHeight !== '') {\n this.element.style.minHeight = formatUnit(this.minHeight);\n }\n break;\n }\n }\n };\n Dialog.prototype.setTarget = function (target) {\n this.popupObj.relateTo = target;\n this.target = target;\n this.targetEle = ((typeof this.target) === 'string') ?\n document.querySelector(this.target) : this.target;\n if (this.dragObj) {\n this.dragObj.dragArea = this.targetEle;\n }\n this.setMaxHeight();\n if (this.isModal) {\n this.updateIsModal();\n }\n if (this.enableResize) {\n this.setResize();\n }\n };\n Dialog.prototype.updateIsModal = function () {\n this.element.setAttribute('aria-modal', this.isModal ? 'true' : 'false');\n if (this.isModal) {\n if (isNullOrUndefined(this.dlgOverlay)) {\n this.setIsModal();\n this.element.style.top = '0px';\n this.element.style.left = '0px';\n if (!isNullOrUndefined(this.targetEle)) {\n this.targetEle.appendChild(this.dlgContainer);\n }\n }\n }\n else {\n removeClass([this.element], MODAL_DLG);\n removeClass([document.body], [DLG_TARGET, SCROLL_DISABLED]);\n detach(this.dlgOverlay);\n while (this.dlgContainer.firstChild) {\n this.dlgContainer.parentElement.insertBefore(this.dlgContainer.firstChild, this.dlgContainer);\n }\n this.dlgContainer.parentElement.removeChild(this.dlgContainer);\n }\n if (this.visible) {\n this.show();\n }\n this.positionChange();\n if (this.isModal && this.dlgOverlay) {\n EventHandler.add(this.dlgOverlay, 'click', this.dlgOverlayClickEventHandler, this);\n }\n };\n Dialog.prototype.setzIndex = function (zIndexElement, setPopupZindex) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n var currentzIndex = getZindexPartial(zIndexElement);\n this.zIndex = currentzIndex > this.zIndex ? currentzIndex : this.zIndex;\n this.isProtectedOnChange = prevOnChange;\n if (setPopupZindex) {\n this.popupObj.zIndex = this.zIndex;\n }\n };\n Dialog.prototype.windowResizeHandler = function () {\n setMaxWidth(this.targetEle.clientWidth);\n setMaxHeight(this.targetEle.clientHeight);\n this.setMaxHeight();\n };\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @returns {void}\n * @private\n */\n Dialog.prototype.getPersistData = function () {\n return this.addOnPersist(['width', 'height', 'position']);\n };\n Dialog.prototype.removeAllChildren = function (element) {\n while (element.children[0]) {\n this.removeAllChildren(element.children[0]);\n element.removeChild(element.children[0]);\n }\n };\n /**\n * To destroy the widget\n *\n * @returns {void}\n */\n Dialog.prototype.destroy = function () {\n if (this.isDestroyed) {\n return;\n }\n var classArray = [RTL, MODAL_DLG, DLG_RESIZABLE, DLG_RESTRICT_LEFT_VALUE, FULLSCREEN, DEVICE];\n var attrs = ['role', 'aria-modal', 'aria-labelledby', 'aria-describedby', 'aria-grabbed', 'tabindex', 'style'];\n removeClass([this.targetEle], [DLG_TARGET, SCROLL_DISABLED]);\n if (!isNullOrUndefined(this.element) && this.element.classList.contains(FULLSCREEN)) {\n removeClass([document.body], [DLG_TARGET, SCROLL_DISABLED]);\n }\n if (this.isModal) {\n removeClass([(!isNullOrUndefined(this.targetEle) ? this.targetEle : document.body)], SCROLL_DISABLED);\n }\n this.unWireEvents();\n if (!isNullOrUndefined(this.btnObj)) {\n for (var i = 0; i < this.btnObj.length; i++) {\n this.btnObj[i].destroy();\n }\n }\n if (!isNullOrUndefined(this.closeIconBtnObj)) {\n this.closeIconBtnObj.destroy();\n }\n if (!isNullOrUndefined(this.dragObj)) {\n this.dragObj.destroy();\n }\n if (!isNullOrUndefined(this.popupObj.element) && this.popupObj.element.classList.contains(POPUP_ROOT)) {\n this.popupObj.destroy();\n }\n removeClass([this.element], classArray);\n if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {\n removeClass([this.element], this.cssClass.split(' '));\n }\n if (!isNullOrUndefined(this.refElement) && !isNullOrUndefined(this.refElement.parentElement)) {\n this.refElement.parentElement.insertBefore((this.isModal ? this.dlgContainer : this.element), this.refElement);\n detach(this.refElement);\n this.refElement = undefined;\n }\n if (this.isModal && !this.isBlazorServerRender()) {\n detach(this.dlgOverlay);\n this.dlgContainer.parentNode.insertBefore(this.element, this.dlgContainer);\n detach(this.dlgContainer);\n }\n if (!this.isBlazorServerRender()) {\n this.element.innerHTML = this.clonedEle.innerHTML;\n }\n if (this.isBlazorServerRender()) {\n if (!isNullOrUndefined(this.element.children)) {\n for (var i = 0; i <= this.element.children.length; i++) {\n i = i - i;\n detach(this.element.children[i]);\n }\n }\n }\n for (var i = 0; i < attrs.length; i++) {\n this.element.removeAttribute(attrs[i]);\n }\n this.ftrTemplateContent = null;\n this.headerContent = null;\n if (!this.isReact && !this.isVue && !isNullOrUndefined(this.contentEle)) {\n this.removeAllChildren(this.contentEle);\n }\n this.contentEle = null;\n if (!this.isBlazorServerRender()) {\n _super.prototype.destroy.call(this);\n }\n else {\n this.isDestroyed = true;\n }\n // eslint-disable-next-line\n if (this.isReact) {\n this.clearTemplate();\n }\n };\n Dialog.prototype.wireWindowResizeEvent = function () {\n this.boundWindowResizeHandler = this.windowResizeHandler.bind(this);\n window.addEventListener('resize', this.boundWindowResizeHandler);\n };\n Dialog.prototype.unWireWindowResizeEvent = function () {\n window.removeEventListener('resize', this.boundWindowResizeHandler);\n this.boundWindowResizeHandler = null;\n };\n /**\n * Binding event to the element while widget creation\n *\n * @returns {void}\n * @hidden\n */\n Dialog.prototype.wireEvents = function () {\n if (this.isBlazorServerRender() && this.showCloseIcon) {\n this.closeIcon = this.element.getElementsByClassName('e-dlg-closeicon-btn')[0];\n }\n if (this.showCloseIcon) {\n EventHandler.add(this.closeIcon, 'click', this.closeIconClickEventHandler, this);\n }\n if (this.isModal && this.dlgOverlay) {\n EventHandler.add(this.dlgOverlay, 'click', this.dlgOverlayClickEventHandler, this);\n }\n };\n /**\n * Unbinding event to the element while widget destroy\n *\n * @returns {void}\n * @hidden\n */\n Dialog.prototype.unWireEvents = function () {\n if (this.showCloseIcon) {\n EventHandler.remove(this.closeIcon, 'click', this.closeIconClickEventHandler);\n }\n if (this.isModal) {\n EventHandler.remove(this.dlgOverlay, 'click', this.dlgOverlayClickEventHandler);\n }\n if (this.buttons.length > 0 && !isNullOrUndefined(this.buttons[0].buttonModel) && this.footerTemplate === '') {\n for (var i = 0; i < this.buttons.length; i++) {\n if (typeof (this.buttons[i].click) === 'function') {\n EventHandler.remove(this.ftrTemplateContent.children[i], 'click', this.buttons[i].click);\n }\n }\n }\n };\n /**\n * Refreshes the dialog's position when the user changes its header and footer height/width dynamically.\n *\n * @returns {void}\n */\n Dialog.prototype.refreshPosition = function () {\n this.popupObj.refreshPosition();\n if (this.element.classList.contains(MODAL_DLG)) {\n this.positionChange();\n }\n };\n /**\n * Returns the current width and height of the Dialog\n *\n * @returns {DialogDimension}- returns the dialog element Dimension.\n * @public\n */\n Dialog.prototype.getDimension = function () {\n var dialogWidth = this.element.offsetWidth;\n var dialogHeight = this.element.offsetHeight;\n return { width: dialogWidth, height: dialogHeight };\n };\n /**\n * Opens the dialog if it is in hidden state.\n * To open the dialog with full screen width, set the parameter to true.\n *\n * @param { boolean } isFullScreen - Enable the fullScreen Dialog.\n * @returns {void}\n */\n Dialog.prototype.show = function (isFullScreen) {\n var _this = this;\n if (!this.element.classList.contains(ROOT)) {\n return;\n }\n if (!this.element.classList.contains(DLG_SHOW) || (!isNullOrUndefined(isFullScreen))) {\n if (!isNullOrUndefined(isFullScreen)) {\n this.fullScreen(isFullScreen);\n }\n var eventArgs_1 = isBlazor() ? {\n cancel: false,\n element: this.element,\n container: this.isModal ? this.dlgContainer : this.element,\n maxHeight: this.element.style.maxHeight\n } : {\n cancel: false,\n element: this.element,\n container: this.isModal ? this.dlgContainer : this.element,\n target: this.target,\n maxHeight: this.element.style.maxHeight\n };\n this.trigger('beforeOpen', eventArgs_1, function (beforeOpenArgs) {\n if (!beforeOpenArgs.cancel) {\n if (_this.element.style.maxHeight !== eventArgs_1.maxHeight) {\n _this.allowMaxHeight = false;\n _this.element.style.maxHeight = eventArgs_1.maxHeight;\n }\n if (_this.enableResize && _this.boundWindowResizeHandler == null && !_this.initialRender) {\n _this.wireWindowResizeEvent();\n }\n _this.storeActiveElement = document.activeElement;\n _this.element.tabIndex = -1;\n if (_this.isModal && (!isNullOrUndefined(_this.dlgOverlay))) {\n _this.dlgOverlay.style.display = 'block';\n _this.dlgContainer.style.display = 'flex';\n removeClass([_this.dlgOverlay], 'e-fade');\n if (!isNullOrUndefined(_this.targetEle)) {\n if (_this.targetEle === document.body) {\n _this.dlgContainer.style.position = 'fixed';\n }\n else {\n _this.dlgContainer.style.position = 'absolute';\n }\n _this.dlgOverlay.style.position = 'absolute';\n var targetType = _this.getTargetContainer(_this.target);\n if (targetType instanceof Element) {\n var computedStyle = window.getComputedStyle(targetType);\n if (computedStyle.getPropertyValue('direction') === 'rtl') {\n _this.element.style.position = 'absolute';\n }\n else {\n _this.element.style.position = 'relative';\n }\n }\n else {\n _this.element.style.position = 'relative';\n }\n addClass([_this.targetEle], [DLG_TARGET, SCROLL_DISABLED]);\n }\n else {\n addClass([document.body], [DLG_TARGET, SCROLL_DISABLED]);\n }\n }\n var openAnimation = {\n name: (_this.animationSettings.effect === 'None' && animationMode === 'Enable') ? 'Zoom' + 'In' : _this.animationSettings.effect + 'In',\n duration: _this.animationSettings.duration,\n delay: _this.animationSettings.delay\n };\n var zIndexElement = (_this.isModal) ? _this.element.parentElement : _this.element;\n if (_this.calculatezIndex) {\n _this.setzIndex(zIndexElement, true);\n setStyleAttribute(_this.element, { 'zIndex': _this.zIndex });\n if (_this.isModal) {\n _this.setOverlayZindex(_this.zIndex);\n }\n }\n // eslint-disable-next-line\n (_this.animationSettings.effect === 'None' && animationMode === 'Enable') ? _this.popupObj.show(openAnimation) : ((_this.animationSettings.effect === 'None') ? _this.popupObj.show() : _this.popupObj.show(openAnimation));\n _this.dialogOpen = true;\n var prevOnChange = _this.isProtectedOnChange;\n _this.isProtectedOnChange = true;\n _this.visible = true;\n _this.preventVisibility = true;\n _this.isProtectedOnChange = prevOnChange;\n }\n });\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n /**\n * Closes the dialog if it is in visible state.\n *\n * @param { Event } event - specifies the event\n * @returns {void}\n */\n Dialog.prototype.hide = function (event) {\n var _this = this;\n if (!this.element.classList.contains(ROOT)) {\n return;\n }\n if (this.preventVisibility) {\n var eventArgs = isBlazor() ? {\n cancel: false,\n isInteracted: event ? true : false,\n element: this.element,\n container: this.isModal ? this.dlgContainer : this.element,\n event: event\n } : {\n cancel: false,\n isInteracted: event ? true : false,\n element: this.element,\n target: this.target,\n container: this.isModal ? this.dlgContainer : this.element,\n event: event,\n closedBy: this.dlgClosedBy\n };\n this.closeArgs = eventArgs;\n this.trigger('beforeClose', eventArgs, function (beforeCloseArgs) {\n if (!beforeCloseArgs.cancel) {\n if (_this.isModal) {\n if (!isNullOrUndefined(_this.targetEle)) {\n removeClass([_this.targetEle], [DLG_TARGET, SCROLL_DISABLED]);\n }\n }\n if (_this.enableResize) {\n _this.unWireWindowResizeEvent();\n }\n if (document.body.classList.contains(DLG_TARGET) &&\n document.body.classList.contains(SCROLL_DISABLED)) {\n removeClass([document.body], [DLG_TARGET, SCROLL_DISABLED]);\n }\n var closeAnimation = {\n name: (_this.animationSettings.effect === 'None' && animationMode === 'Enable') ? 'Zoom' + 'Out' : _this.animationSettings.effect + 'Out',\n duration: _this.animationSettings.duration,\n delay: _this.animationSettings.delay\n };\n // eslint-disable-next-line\n (_this.animationSettings.effect === 'None' && animationMode === 'Enable') ? _this.popupObj.hide(closeAnimation) : ((_this.animationSettings.effect === 'None') ? _this.popupObj.hide() : _this.popupObj.hide(closeAnimation));\n _this.dialogOpen = false;\n var prevOnChange = _this.isProtectedOnChange;\n _this.isProtectedOnChange = true;\n _this.visible = false;\n _this.preventVisibility = false;\n _this.isProtectedOnChange = prevOnChange;\n }\n _this.dlgClosedBy = DLG_USER_ACTION_CLOSED;\n });\n }\n };\n // eslint-disable-next-line\n /**\n * Specifies to view the Full screen Dialog.\n *\n * @returns {void}\n * @private\n */\n Dialog.prototype.fullScreen = function (args) {\n /* eslint-disable */\n var top = this.element.offsetTop;\n var left = this.element.offsetLeft;\n /* eslint-enable */\n if (args) {\n if (!this.isModal) {\n this.element.style.top = document.scrollingElement.scrollTop + 'px';\n }\n addClass([this.element], FULLSCREEN);\n var display = this.element.style.display;\n this.element.style.display = 'none';\n this.element.style.maxHeight = (!isNullOrUndefined(this.target)) ?\n (this.targetEle.offsetHeight) + 'px' : (window.innerHeight) + 'px';\n this.element.style.display = display;\n addClass([document.body], [DLG_TARGET, SCROLL_DISABLED]);\n if (this.allowDragging && !isNullOrUndefined(this.dragObj)) {\n this.dragObj.destroy();\n }\n }\n else {\n removeClass([this.element], FULLSCREEN);\n removeClass([document.body], [DLG_TARGET, SCROLL_DISABLED]);\n if (this.allowDragging && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n }\n return args;\n };\n /**\n * Returns the dialog button instances.\n * Based on that, you can dynamically change the button states.\n *\n * @param { number } index - Index of the button.\n * @returns {Button} - returns the button element\n */\n Dialog.prototype.getButtons = function (index) {\n if (!isNullOrUndefined(index)) {\n return this.btnObj[index];\n }\n return this.btnObj;\n };\n __decorate([\n Property('')\n ], Dialog.prototype, \"content\", void 0);\n __decorate([\n Property(true)\n ], Dialog.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"showCloseIcon\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"isModal\", void 0);\n __decorate([\n Property('')\n ], Dialog.prototype, \"header\", void 0);\n __decorate([\n Property(true)\n ], Dialog.prototype, \"visible\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"enableResize\", void 0);\n __decorate([\n Property(['South-East'])\n ], Dialog.prototype, \"resizeHandles\", void 0);\n __decorate([\n Property('auto')\n ], Dialog.prototype, \"height\", void 0);\n __decorate([\n Property('')\n ], Dialog.prototype, \"minHeight\", void 0);\n __decorate([\n Property('100%')\n ], Dialog.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], Dialog.prototype, \"cssClass\", void 0);\n __decorate([\n Property(1000)\n ], Dialog.prototype, \"zIndex\", void 0);\n __decorate([\n Property(null)\n ], Dialog.prototype, \"target\", void 0);\n __decorate([\n Property('')\n ], Dialog.prototype, \"footerTemplate\", void 0);\n __decorate([\n Property(false)\n ], Dialog.prototype, \"allowDragging\", void 0);\n __decorate([\n Collection([{}], ButtonProps)\n ], Dialog.prototype, \"buttons\", void 0);\n __decorate([\n Property(true)\n ], Dialog.prototype, \"closeOnEscape\", void 0);\n __decorate([\n Complex({}, AnimationSettings)\n ], Dialog.prototype, \"animationSettings\", void 0);\n __decorate([\n Complex({ X: 'center', Y: 'center' }, PositionData)\n ], Dialog.prototype, \"position\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"beforeSanitizeHtml\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"dragStart\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"dragStop\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"drag\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"overlayClick\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"resizeStart\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"resizing\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"resizeStop\", void 0);\n __decorate([\n Event()\n ], Dialog.prototype, \"destroyed\", void 0);\n Dialog = __decorate([\n NotifyPropertyChanges\n ], Dialog);\n return Dialog;\n}(Component));\nexport { Dialog };\n/**\n * Base for creating Alert and Confirmation Dialog through util method.\n */\n// eslint-disable-next-line\nexport var DialogUtility;\n(function (DialogUtility) {\n /**\n * An alert dialog box is used to display warning like messages to the users.\n * ```\n * Eg : DialogUtility.alert('Alert message');\n *\n * ```\n */\n /* istanbul ignore next */\n /**\n *\n * @param {AlertDialogArgs} args - specifies the string\n * @returns {Dialog} - returns the dialog element.\n */\n function alert(args) {\n // eslint-disable-next-line\n var dialogComponent;\n var dialogElement = createElement('div', { 'className': DLG_UTIL_ALERT });\n document.body.appendChild(dialogElement);\n var alertDialogObj;\n var okButtonModel = [{\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n }];\n if (typeof (args) === 'string') {\n alertDialogObj = createDialog({ content: args,\n position: { X: 'center', Y: 'top' },\n isModal: true, header: DLG_UTIL_DEFAULT_TITLE,\n buttons: okButtonModel }, dialogElement);\n }\n else {\n alertDialogObj = createDialog(alertOptions(args), dialogElement);\n }\n alertDialogObj.close = function () {\n if (args && args.close) {\n args.close.apply(alertDialogObj);\n }\n alertDialogObj.destroy();\n if (alertDialogObj.element.classList.contains('e-dlg-modal')) {\n alertDialogObj.element.parentElement.remove();\n alertDialogObj.target.classList.remove(DLG_UTIL_ROOT);\n }\n else {\n alertDialogObj.element.remove();\n }\n };\n return alertDialogObj;\n }\n DialogUtility.alert = alert;\n /**\n * A confirm dialog displays a specified message along with ‘OK’ and ‘Cancel’ button.\n * ```\n * Eg : DialogUtility.confirm('Confirm dialog message');\n *\n * ```\n */\n /* istanbul ignore next */\n /**\n *\n * @param {ConfirmDialogArgs} args - specifies the args\n * @returns {Dialog} - returns te element\n */\n function confirm(args) {\n // eslint-disable-next-line\n var dialogComponent;\n var dialogElement = createElement('div', { 'className': DLG_UTIL_CONFIRM });\n document.body.appendChild(dialogElement);\n var confirmDialogObj;\n var okCancelButtonModel = [{\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n }, {\n buttonModel: { content: 'Cancel' },\n click: function () {\n this.hide();\n }\n }];\n if (typeof (args) === 'string') {\n confirmDialogObj = createDialog({ position: { X: 'center', Y: 'top' }, content: args, isModal: true,\n header: DLG_UTIL_DEFAULT_TITLE, buttons: okCancelButtonModel\n }, dialogElement);\n }\n else {\n confirmDialogObj = createDialog(confirmOptions(args), dialogElement);\n }\n confirmDialogObj.close = function () {\n if (args && args.close) {\n args.close.apply(confirmDialogObj);\n }\n confirmDialogObj.destroy();\n if (confirmDialogObj.element.classList.contains('e-dlg-modal')) {\n confirmDialogObj.element.parentElement.remove();\n confirmDialogObj.target.classList.remove(DLG_UTIL_ROOT);\n }\n else {\n confirmDialogObj.element.remove();\n }\n };\n return confirmDialogObj;\n }\n DialogUtility.confirm = confirm;\n // eslint-disable-next-line\n function createDialog(options, element) {\n var dialogObject = new Dialog(options);\n dialogObject.appendTo(element);\n return dialogObject;\n }\n // eslint-disable-next-line\n function alertOptions(option) {\n var options = {};\n options.buttons = [];\n options = formOptions(options, option);\n options = setAlertButtonModel(options, option);\n return options;\n }\n // eslint-disable-next-line\n function confirmOptions(option) {\n var options = {};\n options.buttons = [];\n options = formOptions(options, option);\n options = setConfirmButtonModel(options, option);\n return options;\n }\n // eslint-disable-next-line\n function formOptions(options, option) {\n options.header = !isNullOrUndefined(option.title) ? option.title : null;\n options.content = !isNullOrUndefined(option.content) ? option.content : '';\n options.isModal = !isNullOrUndefined(option.isModal) ? option.isModal : true;\n options.showCloseIcon = !isNullOrUndefined(option.showCloseIcon) ? option.showCloseIcon : false;\n options.allowDragging = !isNullOrUndefined(option.isDraggable) ? option.isDraggable : false;\n options.closeOnEscape = !isNullOrUndefined(option.closeOnEscape) ? option.closeOnEscape : false;\n options.position = !isNullOrUndefined(option.position) ? option.position : { X: 'center', Y: 'top' };\n options.animationSettings = !isNullOrUndefined(option.animationSettings) ? option.animationSettings :\n { effect: 'Fade', duration: 400, delay: 0 };\n options.cssClass = !isNullOrUndefined(option.cssClass) ? option.cssClass : '';\n options.zIndex = !isNullOrUndefined(option.zIndex) ? option.zIndex : 1000;\n options.open = !isNullOrUndefined(option.open) ? option.open : null;\n options.width = !isNullOrUndefined(option.width) ? option.width : 'auto';\n options.height = !isNullOrUndefined(option.height) ? option.height : 'auto';\n return options;\n }\n // eslint-disable-next-line\n function setAlertButtonModel(options, option) {\n var alertButtonModel = [{\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n }];\n if (!isNullOrUndefined(option.okButton)) {\n options.buttons[0] = formButtonModel(options.buttons[0], option.okButton, alertButtonModel[0]);\n }\n else {\n options.buttons = alertButtonModel;\n }\n return options;\n }\n // eslint-disable-next-line\n function setConfirmButtonModel(options, option) {\n var okButtonModel = {\n buttonModel: { isPrimary: true, content: 'OK' },\n click: function () {\n this.hide();\n }\n };\n var cancelButtonModel = {\n buttonModel: { content: 'Cancel' },\n click: function () {\n this.hide();\n }\n };\n if (!isNullOrUndefined(option.okButton)) {\n options.buttons[0] = formButtonModel(options.buttons[0], option.okButton, okButtonModel);\n }\n else {\n options.buttons[0] = okButtonModel;\n }\n if (!isNullOrUndefined(option.cancelButton)) {\n options.buttons[1] = formButtonModel(options.buttons[1], option.cancelButton, cancelButtonModel);\n }\n else {\n options.buttons[1] = cancelButtonModel;\n }\n return options;\n }\n // eslint-disable-next-line\n function formButtonModel(buttonModel, option, buttonPropModel) {\n var buttonProps = buttonPropModel;\n if (!isNullOrUndefined(option.text)) {\n buttonProps.buttonModel.content = option.text;\n }\n if (!isNullOrUndefined(option.icon)) {\n buttonProps.buttonModel.iconCss = option.icon;\n }\n if (!isNullOrUndefined(option.cssClass)) {\n buttonProps.buttonModel.cssClass = option.cssClass;\n }\n if (!isNullOrUndefined(option.click)) {\n buttonProps.click = option.click;\n }\n if (!isNullOrUndefined(option.isFlat)) {\n buttonProps.isFlat = option.isFlat;\n }\n return buttonProps;\n }\n})(DialogUtility || (DialogUtility = {}));\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, ChildProperty, Event, append, compile } from '@syncfusion/ej2-base';\nimport { EventHandler, Touch, Browser, Animation as PopupAnimation, animationMode } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, getUniqueID, formatUnit, select, selectAll } from '@syncfusion/ej2-base';\nimport { attributes, closest, removeClass, addClass, remove } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, Complex, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { Popup } from '../popup/popup';\nimport { calculatePosition } from '../common/position';\nimport { isCollide, fit, destroy as collisionDestroy } from '../common/collision';\nvar TOUCHEND_HIDE_DELAY = 1500;\nvar TAPHOLD_THRESHOLD = 500;\nvar SHOW_POINTER_TIP_GAP = 0;\nvar HIDE_POINTER_TIP_GAP = 8;\nvar MOUSE_TRAIL_GAP = 2;\nvar POINTER_ADJUST = 2;\nvar ROOT = 'e-tooltip';\nvar RTL = 'e-rtl';\nvar DEVICE = 'e-bigger';\nvar ICON = 'e-icons';\nvar CLOSE = 'e-tooltip-close';\nvar TOOLTIP_WRAP = 'e-tooltip-wrap';\nvar CONTENT = 'e-tip-content';\nvar ARROW_TIP = 'e-arrow-tip';\nvar ARROW_TIP_OUTER = 'e-arrow-tip-outer';\nvar ARROW_TIP_INNER = 'e-arrow-tip-inner';\nvar TIP_BOTTOM = 'e-tip-bottom';\nvar TIP_TOP = 'e-tip-top';\nvar TIP_LEFT = 'e-tip-left';\nvar TIP_RIGHT = 'e-tip-right';\nvar POPUP_ROOT = 'e-popup';\nvar POPUP_OPEN = 'e-popup-open';\nvar POPUP_CLOSE = 'e-popup-close';\nvar POPUP_LIB = 'e-lib';\nvar HIDE_POPUP = 'e-hidden';\nvar POPUP_CONTAINER = 'e-tooltip-popup-container';\nvar Animation = /** @class */ (function (_super) {\n __extends(Animation, _super);\n function Animation() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property({ effect: 'FadeIn', duration: 150, delay: 0 })\n ], Animation.prototype, \"open\", void 0);\n __decorate([\n Property({ effect: 'FadeOut', duration: 150, delay: 0 })\n ], Animation.prototype, \"close\", void 0);\n return Animation;\n}(ChildProperty));\nexport { Animation };\n/**\n * Represents the Tooltip component that displays a piece of information about the target element on mouse hover.\n * ```html\n *
Show Tooltip
\n * ```\n * ```typescript\n * \n * ```\n */\nvar Tooltip = /** @class */ (function (_super) {\n __extends(Tooltip, _super);\n /* eslint-enable */\n /**\n * Constructor for creating the Tooltip Component\n *\n * @param {TooltipModel} options - specifies the options for the constructor\n * @param {string| HTMLElement} element - specifies the element for the constructor\n *\n */\n function Tooltip(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.mouseMoveEvent = null;\n _this.mouseMoveTarget = null;\n _this.containerElement = null;\n _this.isBodyContainer = true;\n return _this;\n }\n Tooltip.prototype.initialize = function () {\n this.formatPosition();\n addClass([this.element], ROOT);\n };\n Tooltip.prototype.formatPosition = function () {\n var _a, _b;\n if (this.position.indexOf('Top') === 0 || this.position.indexOf('Bottom') === 0) {\n _a = this.position.split(/(?=[A-Z])/), this.tooltipPositionY = _a[0], this.tooltipPositionX = _a[1];\n }\n else {\n _b = this.position.split(/(?=[A-Z])/), this.tooltipPositionX = _b[0], this.tooltipPositionY = _b[1];\n }\n };\n Tooltip.prototype.renderArrow = function () {\n this.setTipClass(this.position);\n var tip = this.createElement('div', { className: ARROW_TIP + ' ' + this.tipClass });\n tip.appendChild(this.createElement('div', { className: ARROW_TIP_OUTER + ' ' + this.tipClass }));\n tip.appendChild(this.createElement('div', { className: ARROW_TIP_INNER + ' ' + this.tipClass }));\n this.tooltipEle.appendChild(tip);\n };\n Tooltip.prototype.setTipClass = function (position) {\n if (position.indexOf('Right') === 0) {\n this.tipClass = TIP_LEFT;\n }\n else if (position.indexOf('Bottom') === 0) {\n this.tipClass = TIP_TOP;\n }\n else if (position.indexOf('Left') === 0) {\n this.tipClass = TIP_RIGHT;\n }\n else {\n this.tipClass = TIP_BOTTOM;\n }\n };\n Tooltip.prototype.renderPopup = function (target) {\n var elePos = this.mouseTrail ? { top: 0, left: 0 } : this.getTooltipPosition(target);\n this.tooltipEle.classList.remove(POPUP_LIB);\n this.popupObj = new Popup(this.tooltipEle, {\n height: this.height,\n width: this.width,\n position: { X: elePos.left, Y: elePos.top },\n enableRtl: this.enableRtl,\n open: this.openPopupHandler.bind(this),\n close: this.closePopupHandler.bind(this)\n });\n };\n Tooltip.prototype.getScalingFactor = function (target) {\n if (!target) {\n return { x: 1, y: 1 };\n }\n var scalingFactors = { x: 1, y: 1 };\n var elementsWithTransform = target.closest('[style*=\"transform: scale\"]');\n if (elementsWithTransform && elementsWithTransform != this.tooltipEle && elementsWithTransform.contains(this.tooltipEle)) {\n var computedStyle = window.getComputedStyle(elementsWithTransform);\n var transformValue = computedStyle.getPropertyValue(\"transform\");\n var matrixValues = transformValue.match(/matrix\\(([^)]+)\\)/)[1].split(\",\").map(parseFloat);\n scalingFactors.x = matrixValues[0];\n scalingFactors.y = matrixValues[3];\n }\n return scalingFactors;\n };\n Tooltip.prototype.getTooltipPosition = function (target) {\n this.tooltipEle.style.display = 'block';\n var parentWithZoomStyle = this.element.closest('[style*=\"zoom\"]');\n if (parentWithZoomStyle) {\n if (!parentWithZoomStyle.contains(this.tooltipEle)) {\n this.tooltipEle.style.zoom = getComputedStyle(parentWithZoomStyle).zoom;\n }\n }\n var pos = calculatePosition(target, this.tooltipPositionX, this.tooltipPositionY, !this.isBodyContainer, this.isBodyContainer ? null : this.containerElement.getBoundingClientRect());\n var scalingFactors = this.getScalingFactor(target);\n var offsetPos = this.calculateTooltipOffset(this.position, scalingFactors.x, scalingFactors.y);\n var collisionPosition = this.calculateElementPosition(pos, offsetPos);\n var collisionLeft = collisionPosition[0];\n var collisionTop = collisionPosition[1];\n var elePos = this.collisionFlipFit(target, collisionLeft, collisionTop);\n elePos.left = elePos.left / scalingFactors.x;\n elePos.top = elePos.top / scalingFactors.y;\n this.tooltipEle.style.display = '';\n return elePos;\n };\n Tooltip.prototype.windowResize = function () {\n this.reposition(this.findTarget());\n };\n Tooltip.prototype.reposition = function (target) {\n if (this.popupObj && target) {\n var elePos = this.getTooltipPosition(target);\n this.popupObj.position = { X: elePos.left, Y: elePos.top };\n this.popupObj.dataBind();\n }\n };\n Tooltip.prototype.openPopupHandler = function () {\n if (!this.mouseTrail && this.needTemplateReposition()) {\n this.reposition(this.findTarget());\n }\n this.trigger('afterOpen', this.tooltipEventArgs);\n this.tooltipEventArgs = null;\n };\n Tooltip.prototype.closePopupHandler = function () {\n if (this.isReact && !(this.opensOn === 'Click' && typeof (this.content) === 'function')) {\n this.clearTemplate(['content']);\n }\n this.clear();\n this.trigger('afterClose', this.tooltipEventArgs);\n this.tooltipEventArgs = null;\n };\n Tooltip.prototype.calculateTooltipOffset = function (position, xScalingFactor, yScalingFactor) {\n if (xScalingFactor === void 0) { xScalingFactor = 1; }\n if (yScalingFactor === void 0) { yScalingFactor = 1; }\n var pos = { top: 0, left: 0 };\n var tipWidth, tipHeight, tooltipEleWidth, tooltipEleHeight, arrowEle;\n var tipAdjust, tipHeightAdjust, tipWidthAdjust;\n if (xScalingFactor != 1 || yScalingFactor != 1) {\n var tooltipEleRect = this.tooltipEle.getBoundingClientRect();\n var arrowEleRect = void 0;\n tooltipEleWidth = Math.round(tooltipEleRect.width);\n tooltipEleHeight = Math.round(tooltipEleRect.height);\n arrowEle = select('.' + ARROW_TIP, this.tooltipEle);\n if (arrowEle) {\n arrowEleRect = arrowEle.getBoundingClientRect();\n }\n tipWidth = arrowEle ? Math.round(arrowEleRect.width) : 0;\n tipHeight = arrowEle ? Math.round(arrowEleRect.height) : 0;\n tipAdjust = (this.showTipPointer ? SHOW_POINTER_TIP_GAP : HIDE_POINTER_TIP_GAP);\n tipHeightAdjust = (tipHeight / 2) + POINTER_ADJUST + (tooltipEleHeight - (this.tooltipEle.clientHeight * yScalingFactor));\n tipWidthAdjust = (tipWidth / 2) + POINTER_ADJUST + (tooltipEleWidth - (this.tooltipEle.clientWidth * xScalingFactor));\n }\n else {\n tooltipEleWidth = this.tooltipEle.offsetWidth;\n tooltipEleHeight = this.tooltipEle.offsetHeight;\n arrowEle = select('.' + ARROW_TIP, this.tooltipEle);\n tipWidth = arrowEle ? arrowEle.offsetWidth : 0;\n tipHeight = arrowEle ? arrowEle.offsetHeight : 0;\n tipAdjust = (this.showTipPointer ? SHOW_POINTER_TIP_GAP : HIDE_POINTER_TIP_GAP);\n tipHeightAdjust = (tipHeight / 2) + POINTER_ADJUST + (this.tooltipEle.offsetHeight - this.tooltipEle.clientHeight);\n tipWidthAdjust = (tipWidth / 2) + POINTER_ADJUST + (this.tooltipEle.offsetWidth - this.tooltipEle.clientWidth);\n }\n if (this.mouseTrail) {\n tipAdjust += MOUSE_TRAIL_GAP;\n }\n switch (position) {\n case 'RightTop':\n pos.left += tipWidth + tipAdjust;\n pos.top -= tooltipEleHeight - tipHeightAdjust;\n break;\n case 'RightCenter':\n pos.left += tipWidth + tipAdjust;\n pos.top -= (tooltipEleHeight / 2);\n break;\n case 'RightBottom':\n pos.left += tipWidth + tipAdjust;\n pos.top -= (tipHeightAdjust);\n break;\n case 'BottomRight':\n pos.top += (tipHeight + tipAdjust);\n pos.left -= (tipWidthAdjust);\n break;\n case 'BottomCenter':\n pos.top += (tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth / 2);\n break;\n case 'BottomLeft':\n pos.top += (tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth - tipWidthAdjust);\n break;\n case 'LeftBottom':\n pos.left -= (tipWidth + tooltipEleWidth + tipAdjust);\n pos.top -= (tipHeightAdjust);\n break;\n case 'LeftCenter':\n pos.left -= (tipWidth + tooltipEleWidth + tipAdjust);\n pos.top -= (tooltipEleHeight / 2);\n break;\n case 'LeftTop':\n pos.left -= (tipWidth + tooltipEleWidth + tipAdjust);\n pos.top -= (tooltipEleHeight - tipHeightAdjust);\n break;\n case 'TopLeft':\n pos.top -= (tooltipEleHeight + tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth - tipWidthAdjust);\n break;\n case 'TopRight':\n pos.top -= (tooltipEleHeight + tipHeight + tipAdjust);\n pos.left -= (tipWidthAdjust);\n break;\n default:\n pos.top -= (tooltipEleHeight + tipHeight + tipAdjust);\n pos.left -= (tooltipEleWidth / 2);\n break;\n }\n pos.left += this.offsetX;\n pos.top += this.offsetY;\n return pos;\n };\n Tooltip.prototype.updateTipPosition = function (position) {\n var selEle = selectAll('.' + ARROW_TIP + ',.' + ARROW_TIP_OUTER + ',.' + ARROW_TIP_INNER, this.tooltipEle);\n var removeList = [TIP_BOTTOM, TIP_TOP, TIP_LEFT, TIP_RIGHT];\n removeClass(selEle, removeList);\n this.setTipClass(position);\n addClass(selEle, this.tipClass);\n };\n Tooltip.prototype.adjustArrow = function (target, position, tooltipPositionX, tooltipPositionY) {\n var arrowEle = select('.' + ARROW_TIP, this.tooltipEle);\n if (this.showTipPointer === false || arrowEle === null) {\n return;\n }\n this.updateTipPosition(position);\n var leftValue;\n var topValue;\n this.tooltipEle.style.display = 'block';\n var tooltipWidth = this.tooltipEle.clientWidth;\n var tooltipHeight = this.tooltipEle.clientHeight;\n var arrowInnerELe = select('.' + ARROW_TIP_INNER, this.tooltipEle);\n var tipWidth = arrowEle.offsetWidth;\n var tipHeight = arrowEle.offsetHeight;\n this.tooltipEle.style.display = '';\n if (this.tipClass === TIP_BOTTOM || this.tipClass === TIP_TOP) {\n if (this.tipClass === TIP_BOTTOM) {\n topValue = '99.9%';\n // Arrow icon aligned -2px height from ArrowOuterTip div\n arrowInnerELe.style.top = '-' + (tipHeight - 2) + 'px';\n }\n else {\n topValue = -(tipHeight - 1) + 'px';\n // Arrow icon aligned -6px height from ArrowOuterTip div\n arrowInnerELe.style.top = '-' + (tipHeight - 6) + 'px';\n }\n if (target) {\n var tipPosExclude = tooltipPositionX !== 'Center' || (tooltipWidth > target.offsetWidth) || this.mouseTrail;\n if ((tipPosExclude && tooltipPositionX === 'Left') || (!tipPosExclude && this.tipPointerPosition === 'End')) {\n leftValue = (tooltipWidth - tipWidth - POINTER_ADJUST) + 'px';\n }\n else if ((tipPosExclude && tooltipPositionX === 'Right') || (!tipPosExclude && this.tipPointerPosition === 'Start')) {\n leftValue = POINTER_ADJUST + 'px';\n }\n else if ((tipPosExclude) && (this.tipPointerPosition === 'End' || this.tipPointerPosition === 'Start')) {\n leftValue = (this.tipPointerPosition === 'End') ? ((target.offsetWidth + ((this.tooltipEle.offsetWidth - target.offsetWidth) / 2)) - (tipWidth / 2)) - POINTER_ADJUST + 'px'\n : ((this.tooltipEle.offsetWidth - target.offsetWidth) / 2) - (tipWidth / 2) + POINTER_ADJUST + 'px';\n }\n else {\n leftValue = ((tooltipWidth / 2) - (tipWidth / 2)) + 'px';\n }\n }\n }\n else {\n if (this.tipClass === TIP_RIGHT) {\n leftValue = '99.9%';\n // Arrow icon aligned -2px left from ArrowOuterTip div\n arrowInnerELe.style.left = '-' + (tipWidth - 2) + 'px';\n }\n else {\n leftValue = -(tipWidth - 1) + 'px';\n // Arrow icon aligned -2px from ArrowOuterTip width\n arrowInnerELe.style.left = (-(tipWidth) + (tipWidth - 2)) + 'px';\n }\n var tipPosExclude = tooltipPositionY !== 'Center' || (tooltipHeight > target.offsetHeight) || this.mouseTrail;\n if ((tipPosExclude && tooltipPositionY === 'Top') || (!tipPosExclude && this.tipPointerPosition === 'End')) {\n topValue = (tooltipHeight - tipHeight - POINTER_ADJUST) + 'px';\n }\n else if ((tipPosExclude && tooltipPositionY === 'Bottom') || (!tipPosExclude && this.tipPointerPosition === 'Start')) {\n topValue = POINTER_ADJUST + 'px';\n }\n else {\n topValue = ((tooltipHeight / 2) - (tipHeight / 2)) + 'px';\n }\n }\n arrowEle.style.top = topValue;\n arrowEle.style.left = leftValue;\n };\n Tooltip.prototype.renderContent = function (target) {\n var tooltipContent = select('.' + CONTENT, this.tooltipEle);\n if (this.cssClass) {\n addClass([this.tooltipEle], this.cssClass.split(' '));\n }\n if (target && !isNullOrUndefined(target.getAttribute('title'))) {\n target.setAttribute('data-content', target.getAttribute('title'));\n target.removeAttribute('title');\n }\n if (!isNullOrUndefined(this.content)) {\n tooltipContent.innerHTML = '';\n if (this.content instanceof HTMLElement) {\n tooltipContent.appendChild(this.content);\n }\n else if (typeof this.content === 'string') {\n if (this.enableHtmlSanitizer) {\n this.setProperties({ content: SanitizeHtmlHelper.sanitize(this.content) }, true);\n }\n if (this.enableHtmlParse) {\n var tempFunction = compile(this.content);\n var tempArr = tempFunction({}, this, 'content', this.element.id + 'content', undefined, undefined, tooltipContent, this.root);\n if (tempArr) {\n append(tempArr, tooltipContent);\n }\n }\n else {\n tooltipContent['textContent'] = this.content;\n }\n }\n else {\n var templateFunction = compile(this.content);\n var tempArr = templateFunction({}, this, 'content', this.element.id + 'content', undefined, undefined, tooltipContent);\n if (tempArr) {\n append(tempArr, tooltipContent);\n }\n this.renderReactTemplates();\n }\n }\n else {\n if (target && !isNullOrUndefined(target.getAttribute('data-content'))) {\n tooltipContent.innerHTML = target.getAttribute('data-content');\n }\n }\n };\n Tooltip.prototype.renderCloseIcon = function () {\n if (!this.isSticky) {\n var existingCloseIcon = this.tooltipEle.querySelector('.' + ICON + '.' + CLOSE);\n if (existingCloseIcon) {\n remove(existingCloseIcon);\n }\n return;\n }\n var tipClose = this.createElement('div', { className: ICON + ' ' + CLOSE });\n this.tooltipEle.appendChild(tipClose);\n EventHandler.add(tipClose, Browser.touchStartEvent, this.onStickyClose, this);\n };\n Tooltip.prototype.addDescribedBy = function (target, id) {\n var describedby = (target.getAttribute('aria-describedby') || '').split(/\\s+/);\n if (describedby.indexOf(id) < 0) {\n describedby.push(id);\n }\n attributes(target, { 'aria-describedby': describedby.join(' ').trim(), 'data-tooltip-id': id });\n };\n Tooltip.prototype.removeDescribedBy = function (target) {\n var id = target.getAttribute('data-tooltip-id');\n var describedby = (target.getAttribute('aria-describedby') || '').split(/\\s+/);\n var index = describedby.indexOf(id);\n if (index !== -1) {\n describedby.splice(index, 1);\n }\n target.removeAttribute('data-tooltip-id');\n var orgdescribedby = describedby.join(' ').trim();\n if (orgdescribedby) {\n target.setAttribute('aria-describedby', orgdescribedby);\n }\n else {\n target.removeAttribute('aria-describedby');\n }\n };\n Tooltip.prototype.tapHoldHandler = function (evt) {\n clearTimeout(this.autoCloseTimer);\n this.targetHover(evt.originalEvent);\n };\n Tooltip.prototype.touchEndHandler = function (e) {\n var _this = this;\n if (this.isSticky) {\n return;\n }\n var close = function () {\n _this.close();\n };\n this.autoCloseTimer = setTimeout(close, TOUCHEND_HIDE_DELAY);\n };\n Tooltip.prototype.targetClick = function (e) {\n var target;\n if (this.target) {\n target = closest(e.target, this.target);\n }\n else {\n target = this.element;\n }\n if (isNullOrUndefined(target)) {\n return;\n }\n if (target.getAttribute('data-tooltip-id') === null) {\n this.targetHover(e);\n }\n else if (!this.isSticky) {\n this.hideTooltip(this.animation.close, e, target);\n }\n };\n Tooltip.prototype.targetHover = function (e) {\n var target;\n if (this.target) {\n target = closest(e.target, this.target);\n }\n else {\n target = this.element;\n }\n if (isNullOrUndefined(target) || (target.getAttribute('data-tooltip-id') !== null && this.closeDelay === 0)) {\n return;\n }\n var targetList = [].slice.call(selectAll('[data-tooltip-id= \"' + this.ctrlId + '_content\"]', document));\n for (var _i = 0, targetList_1 = targetList; _i < targetList_1.length; _i++) {\n var target_1 = targetList_1[_i];\n this.restoreElement(target_1);\n }\n this.showTooltip(target, this.animation.open, e);\n };\n Tooltip.prototype.mouseMoveBeforeOpen = function (e) {\n this.mouseMoveEvent = e;\n };\n Tooltip.prototype.mouseMoveBeforeRemove = function () {\n if (this.mouseMoveTarget) {\n EventHandler.remove(this.mouseMoveTarget, 'mousemove touchstart', this.mouseMoveBeforeOpen);\n }\n };\n Tooltip.prototype.showTooltip = function (target, showAnimation, e) {\n var _this = this;\n clearTimeout(this.showTimer);\n clearTimeout(this.hideTimer);\n if (this.openDelay && this.mouseTrail) {\n this.mouseMoveBeforeRemove();\n this.mouseMoveTarget = target;\n EventHandler.add(this.mouseMoveTarget, 'mousemove touchstart', this.mouseMoveBeforeOpen, this);\n }\n this.tooltipEventArgs = {\n type: e ? e.type : null, cancel: false, target: target, event: e ? e : null,\n element: this.tooltipEle, isInteracted: !isNullOrUndefined(e)\n };\n var observeCallback = function (beforeRenderArgs) {\n _this.beforeRenderCallback(beforeRenderArgs, target, e, showAnimation);\n };\n this.trigger('beforeRender', this.tooltipEventArgs, observeCallback.bind(this));\n };\n Tooltip.prototype.beforeRenderCallback = function (beforeRenderArgs, target, e, showAnimation) {\n if (beforeRenderArgs.cancel) {\n this.isHidden = true;\n this.clear();\n this.mouseMoveBeforeRemove();\n }\n else {\n this.isHidden = false;\n if (isNullOrUndefined(this.tooltipEle)) {\n this.ctrlId = this.element.getAttribute('id') ?\n getUniqueID(this.element.getAttribute('id')) : getUniqueID('tooltip');\n this.tooltipEle = this.createElement('div', {\n className: TOOLTIP_WRAP + ' ' + POPUP_ROOT + ' ' + POPUP_LIB, attrs: {\n role: 'tooltip', 'aria-hidden': 'false', 'id': this.ctrlId + '_content'\n }, styles: 'width:' +\n formatUnit(this.width) + ';height:' + formatUnit(this.height) + ';position:absolute;'\n });\n this.tooltipBeforeRender(target, this);\n this.tooltipAfterRender(target, e, showAnimation, this);\n }\n else {\n if (target) {\n this.adjustArrow(target, this.position, this.tooltipPositionX, this.tooltipPositionY);\n this.addDescribedBy(target, this.ctrlId + '_content');\n this.renderContent(target);\n PopupAnimation.stop(this.tooltipEle);\n this.reposition(target);\n this.tooltipAfterRender(target, e, showAnimation, this);\n }\n }\n }\n };\n Tooltip.prototype.appendContainer = function (ctrlObj) {\n if (typeof this.container == 'string') {\n if (this.container === 'body') {\n this.containerElement = document.body;\n }\n else {\n this.isBodyContainer = false;\n this.containerElement = select(this.container, document);\n }\n }\n else if (this.container instanceof HTMLElement) {\n this.containerElement = this.container;\n this.isBodyContainer = this.containerElement.tagName === 'BODY';\n }\n if (!this.isBodyContainer) {\n addClass([this.containerElement], POPUP_CONTAINER);\n }\n this.containerElement.appendChild(ctrlObj.tooltipEle);\n };\n Tooltip.prototype.tooltipBeforeRender = function (target, ctrlObj) {\n if (target) {\n if (Browser.isDevice) {\n addClass([ctrlObj.tooltipEle], DEVICE);\n }\n if (ctrlObj.width !== 'auto') {\n ctrlObj.tooltipEle.style.maxWidth = formatUnit(ctrlObj.width);\n }\n ctrlObj.tooltipEle.appendChild(ctrlObj.createElement('div', { className: CONTENT }));\n this.appendContainer(ctrlObj);\n removeClass([ctrlObj.tooltipEle], HIDE_POPUP);\n ctrlObj.addDescribedBy(target, ctrlObj.ctrlId + '_content');\n ctrlObj.renderContent(target);\n addClass([ctrlObj.tooltipEle], POPUP_OPEN);\n if (ctrlObj.showTipPointer) {\n ctrlObj.renderArrow();\n }\n ctrlObj.renderCloseIcon();\n ctrlObj.renderPopup(target);\n ctrlObj.adjustArrow(target, ctrlObj.position, ctrlObj.tooltipPositionX, ctrlObj.tooltipPositionY);\n PopupAnimation.stop(ctrlObj.tooltipEle);\n ctrlObj.reposition(target);\n }\n };\n Tooltip.prototype.tooltipAfterRender = function (target, e, showAnimation, ctrlObj) {\n if (target) {\n removeClass([ctrlObj.tooltipEle], POPUP_OPEN);\n addClass([ctrlObj.tooltipEle], POPUP_CLOSE);\n ctrlObj.tooltipEventArgs = {\n type: e ? e.type : null, cancel: false, target: target, event: e ? e : null,\n element: ctrlObj.tooltipEle, isInteracted: !isNullOrUndefined(e)\n };\n if (ctrlObj.needTemplateReposition() && !ctrlObj.mouseTrail && (showAnimation.effect == 'None' || showAnimation.effect == 'FadeIn' ||\n (this.isReact && typeof ctrlObj.content != 'string'))) {\n ctrlObj.tooltipEle.style.display = 'none';\n }\n var observeCallback = function (observedArgs) {\n ctrlObj.beforeOpenCallback(observedArgs, target, showAnimation, e);\n };\n ctrlObj.trigger('beforeOpen', ctrlObj.tooltipEventArgs, observeCallback.bind(ctrlObj));\n }\n };\n Tooltip.prototype.beforeOpenCallback = function (observedArgs, target, showAnimation, e) {\n var _this = this;\n if (observedArgs.cancel) {\n this.isHidden = true;\n this.clear();\n this.mouseMoveBeforeRemove();\n this.restoreElement(target);\n }\n else {\n var openAnimation_1 = {\n name: (showAnimation.effect === 'None' && animationMode === 'Enable') ? 'FadeIn' : this.animation.open.effect,\n duration: showAnimation.duration,\n delay: showAnimation.delay,\n timingFunction: 'easeOut'\n };\n if (showAnimation.effect === 'None') {\n openAnimation_1 = undefined;\n }\n if (this.openDelay > 0) {\n var show = function () {\n if (_this.mouseTrail) {\n EventHandler.add(target, 'mousemove touchstart mouseenter', _this.onMouseMove, _this);\n }\n if (_this.popupObj) {\n _this.popupObj.show(openAnimation_1, target);\n if (_this.mouseMoveEvent && _this.mouseTrail) {\n _this.onMouseMove(_this.mouseMoveEvent);\n }\n }\n };\n this.showTimer = setTimeout(show, this.openDelay);\n }\n else {\n if (this.popupObj) {\n this.popupObj.show(openAnimation_1, target);\n }\n }\n }\n if (e) {\n this.wireMouseEvents(e, target);\n }\n };\n Tooltip.prototype.needTemplateReposition = function () {\n // eslint-disable-next-line\n var tooltip = this;\n return !isNullOrUndefined(tooltip.viewContainerRef)\n && typeof tooltip.viewContainerRef !== 'string' || this.isReact;\n };\n Tooltip.prototype.checkCollision = function (target, x, y) {\n var elePos = {\n left: x, top: y, position: this.position,\n horizontal: this.tooltipPositionX, vertical: this.tooltipPositionY\n };\n var affectedPos = isCollide(this.tooltipEle, this.checkCollideTarget(), x, y);\n if (affectedPos.length > 0) {\n elePos.horizontal = affectedPos.indexOf('left') >= 0 ? 'Right' : affectedPos.indexOf('right') >= 0 ? 'Left' :\n this.tooltipPositionX;\n elePos.vertical = affectedPos.indexOf('top') >= 0 ? 'Bottom' : affectedPos.indexOf('bottom') >= 0 ? 'Top' :\n this.tooltipPositionY;\n }\n return elePos;\n };\n Tooltip.prototype.calculateElementPosition = function (pos, offsetPos) {\n return [this.isBodyContainer ? pos.left + offsetPos.left :\n (pos.left - this.containerElement.getBoundingClientRect().left) + offsetPos.left + window.pageXOffset + this.containerElement.scrollLeft,\n this.isBodyContainer ? pos.top + offsetPos.top :\n (pos.top - this.containerElement.getBoundingClientRect().top) + offsetPos.top + window.pageYOffset + this.containerElement.scrollTop];\n };\n Tooltip.prototype.collisionFlipFit = function (target, x, y) {\n var elePos = this.checkCollision(target, x, y);\n var newpos = elePos.position;\n if (this.tooltipPositionY !== elePos.vertical) {\n newpos = ((this.position.indexOf('Bottom') === 0 || this.position.indexOf('Top') === 0) ?\n elePos.vertical + this.tooltipPositionX : this.tooltipPositionX + elePos.vertical);\n }\n if (this.tooltipPositionX !== elePos.horizontal) {\n if (newpos.indexOf('Left') === 0) {\n elePos.vertical = (newpos === 'LeftTop' || newpos === 'LeftCenter') ? 'Top' : 'Bottom';\n newpos = (elePos.vertical + 'Left');\n }\n if (newpos.indexOf('Right') === 0) {\n elePos.vertical = (newpos === 'RightTop' || newpos === 'RightCenter') ? 'Top' : 'Bottom';\n newpos = (elePos.vertical + 'Right');\n }\n elePos.horizontal = this.tooltipPositionX;\n }\n this.tooltipEventArgs = {\n type: null, cancel: false, target: target, event: null,\n element: this.tooltipEle, collidedPosition: newpos\n };\n this.trigger('beforeCollision', this.tooltipEventArgs);\n if (this.tooltipEventArgs.cancel) {\n newpos = this.position;\n }\n else {\n var elePosVertical = elePos.vertical;\n var elePosHorizontal = elePos.horizontal;\n if (elePos.position !== newpos) {\n var pos = calculatePosition(target, elePosHorizontal, elePosVertical, !this.isBodyContainer, this.isBodyContainer ? null : this.containerElement.getBoundingClientRect());\n this.adjustArrow(target, newpos, elePosHorizontal, elePosVertical);\n var scalingFactors = this.getScalingFactor(target);\n var offsetPos = this.calculateTooltipOffset(newpos, scalingFactors.x, scalingFactors.y);\n offsetPos.top -= this.getOffSetPosition('TopBottom', newpos, this.offsetY);\n offsetPos.left -= this.getOffSetPosition('RightLeft', newpos, this.offsetX);\n elePos.position = newpos;\n var elePosition = this.calculateElementPosition(pos, offsetPos);\n elePos.left = elePosition[0];\n elePos.top = elePosition[1];\n }\n else {\n this.adjustArrow(target, newpos, elePosHorizontal, elePosVertical);\n }\n }\n var eleOffset = { left: elePos.left, top: elePos.top };\n var position = this.isBodyContainer ?\n fit(this.tooltipEle, this.checkCollideTarget(), { X: true, Y: this.windowCollision }, eleOffset) : eleOffset;\n this.tooltipEle.style.display = 'block';\n var arrowEle = select('.' + ARROW_TIP, this.tooltipEle);\n if (this.showTipPointer && arrowEle != null && (newpos.indexOf('Bottom') === 0 || newpos.indexOf('Top') === 0)) {\n var arrowleft = parseInt(arrowEle.style.left, 10) - (position.left - elePos.left);\n if (arrowleft < 0) {\n arrowleft = 0;\n }\n else if ((arrowleft + arrowEle.offsetWidth) > this.tooltipEle.clientWidth) {\n arrowleft = this.tooltipEle.clientWidth - arrowEle.offsetWidth;\n }\n arrowEle.style.left = arrowleft.toString() + 'px';\n }\n this.tooltipEle.style.display = '';\n eleOffset.left = position.left;\n eleOffset.top = position.top;\n return eleOffset;\n };\n Tooltip.prototype.getOffSetPosition = function (positionString, newPos, offsetType) {\n return ((positionString.indexOf(this.position.split(/(?=[A-Z])/)[0]) !== -1) &&\n (positionString.indexOf(newPos.split(/(?=[A-Z])/)[0]) !== -1)) ? (2 * offsetType) : 0;\n };\n Tooltip.prototype.checkCollideTarget = function () {\n return !this.windowCollision && this.target ? this.element : null;\n };\n Tooltip.prototype.hideTooltip = function (hideAnimation, e, targetElement) {\n var _this = this;\n if (this.closeDelay > 0) {\n clearTimeout(this.hideTimer);\n clearTimeout(this.showTimer);\n var hide = function () {\n if (_this.closeDelay && _this.tooltipEle && _this.isTooltipOpen) {\n return;\n }\n _this.tooltipHide(hideAnimation, e, targetElement);\n };\n this.hideTimer = setTimeout(hide, this.closeDelay);\n }\n else {\n this.tooltipHide(hideAnimation, e, targetElement);\n }\n };\n Tooltip.prototype.tooltipHide = function (hideAnimation, e, targetElement) {\n var _this = this;\n var target;\n if (e) {\n target = this.target ? (targetElement || e.target) : this.element;\n }\n else {\n target = select('[data-tooltip-id= \"' + this.ctrlId + '_content\"]', document);\n }\n this.tooltipEventArgs = {\n type: e ? e.type : null, cancel: false, target: target, event: e ? e : null,\n element: this.tooltipEle, isInteracted: !isNullOrUndefined(e)\n };\n // this line commented for close the tooltip popup element even the target element destroyed in a page.\n //if (isNullOrUndefined(target)) { return; }\n this.trigger('beforeClose', this.tooltipEventArgs, function (observedArgs) {\n if (!observedArgs.cancel) {\n _this.mouseMoveBeforeRemove();\n _this.popupHide(hideAnimation, target, e);\n }\n else {\n _this.isHidden = false;\n }\n });\n this.tooltipEventArgs = null;\n };\n Tooltip.prototype.popupHide = function (hideAnimation, target, e) {\n if (target && e) {\n this.restoreElement(target);\n }\n this.isHidden = true;\n var closeAnimation = {\n name: (hideAnimation.effect === 'None' && animationMode === 'Enable') ? 'FadeOut' : this.animation.close.effect,\n duration: hideAnimation.duration,\n delay: hideAnimation.delay,\n timingFunction: 'easeIn'\n };\n if (hideAnimation.effect === 'None') {\n closeAnimation = undefined;\n }\n if (this.popupObj) {\n this.popupObj.hide(closeAnimation);\n }\n };\n Tooltip.prototype.restoreElement = function (target) {\n this.unwireMouseEvents(target);\n if (!isNullOrUndefined(target.getAttribute('data-content'))) {\n target.setAttribute('title', target.getAttribute('data-content'));\n target.removeAttribute('data-content');\n }\n this.removeDescribedBy(target);\n };\n Tooltip.prototype.clear = function () {\n var target = this.findTarget();\n if (target) {\n this.restoreElement(target);\n }\n if (this.tooltipEle) {\n removeClass([this.tooltipEle], POPUP_CLOSE);\n addClass([this.tooltipEle], POPUP_OPEN);\n }\n if (this.isHidden) {\n if (this.popupObj) {\n this.popupObj.destroy();\n }\n if (this.tooltipEle) {\n remove(this.tooltipEle);\n }\n this.tooltipEle = null;\n this.popupObj = null;\n }\n };\n Tooltip.prototype.tooltipHover = function (e) {\n if (this.tooltipEle) {\n this.isTooltipOpen = true;\n }\n };\n Tooltip.prototype.tooltipMouseOut = function (e) {\n this.isTooltipOpen = false;\n this.hideTooltip(this.animation.close, e, this.findTarget());\n };\n Tooltip.prototype.onMouseOut = function (e) {\n var enteredElement = e.relatedTarget;\n // don't close the tooltip only if it is tooltip content element\n if (enteredElement && !this.mouseTrail) {\n var checkForTooltipElement = closest(enteredElement, \".\" + TOOLTIP_WRAP + \".\" + POPUP_LIB + \".\" + POPUP_ROOT);\n if (checkForTooltipElement) {\n EventHandler.add(checkForTooltipElement, 'mouseleave', this.tooltipElementMouseOut, this);\n }\n else {\n this.hideTooltip(this.animation.close, e, this.findTarget());\n if (this.closeDelay === 0 && this.animation.close.effect == 'None') {\n this.clear();\n }\n }\n }\n else {\n this.hideTooltip(this.animation.close, e, this.findTarget());\n this.clear();\n }\n };\n Tooltip.prototype.tooltipElementMouseOut = function (e) {\n this.hideTooltip(this.animation.close, e, this.findTarget());\n EventHandler.remove(this.element, 'mouseleave', this.tooltipElementMouseOut);\n this.clear();\n };\n Tooltip.prototype.onStickyClose = function (e) {\n this.close();\n };\n Tooltip.prototype.onMouseMove = function (event) {\n var eventPageX = 0;\n var eventPageY = 0;\n if (event.type.indexOf('touch') > -1) {\n event.preventDefault();\n eventPageX = event.touches[0].pageX;\n eventPageY = event.touches[0].pageY;\n }\n else {\n eventPageX = event.pageX;\n eventPageY = event.pageY;\n }\n PopupAnimation.stop(this.tooltipEle);\n removeClass([this.tooltipEle], POPUP_CLOSE);\n addClass([this.tooltipEle], POPUP_OPEN);\n this.adjustArrow(event.target, this.position, this.tooltipPositionX, this.tooltipPositionY);\n var scalingFactors = this.getScalingFactor(event.target);\n var pos = this.calculateTooltipOffset(this.position, scalingFactors.x, scalingFactors.y);\n var x = eventPageX + pos.left + this.offsetX;\n var y = eventPageY + pos.top + this.offsetY;\n var elePos = this.checkCollision(event.target, x, y);\n if (this.tooltipPositionX !== elePos.horizontal || this.tooltipPositionY !== elePos.vertical) {\n var newpos = (this.position.indexOf('Bottom') === 0 || this.position.indexOf('Top') === 0) ?\n elePos.vertical + elePos.horizontal : elePos.horizontal + elePos.vertical;\n elePos.position = newpos;\n this.adjustArrow(event.target, elePos.position, elePos.horizontal, elePos.vertical);\n var colpos = this.calculateTooltipOffset(elePos.position, scalingFactors.x, scalingFactors.y);\n elePos.left = eventPageX + colpos.left - this.offsetX;\n elePos.top = eventPageY + colpos.top - this.offsetY;\n }\n this.tooltipEle.style.left = elePos.left + 'px';\n this.tooltipEle.style.top = elePos.top + 'px';\n };\n Tooltip.prototype.keyDown = function (event) {\n if (this.tooltipEle && event.keyCode === 27) {\n this.close();\n }\n };\n Tooltip.prototype.touchEnd = function (e) {\n if (this.tooltipEle && closest(e.target, '.' + ROOT) === null && !this.isSticky) {\n this.close();\n }\n };\n Tooltip.prototype.scrollHandler = function (e) {\n if (this.tooltipEle && !this.isSticky) {\n if (!(closest(e.target, \".\" + TOOLTIP_WRAP + \".\" + POPUP_LIB + \".\" + POPUP_ROOT))\n && !this.isSticky) {\n this.close();\n }\n }\n };\n /**\n * Core method that initializes the control rendering.\n *\n * @private\n * @returns {void}\n */\n Tooltip.prototype.render = function () {\n this.initialize();\n this.wireEvents(this.opensOn);\n this.renderComplete();\n };\n /**\n * Initializes the values of private members.\n *\n * @private\n * @returns {void}\n */\n Tooltip.prototype.preRender = function () {\n this.tipClass = TIP_BOTTOM;\n this.tooltipPositionX = 'Center';\n this.tooltipPositionY = 'Top';\n this.isHidden = true;\n };\n /**\n * Binding events to the Tooltip element.\n *\n * @hidden\n * @param {string} trigger - specify the trigger string to the function\n * @returns {void}\n *\n */\n Tooltip.prototype.wireEvents = function (trigger) {\n var triggerList = this.getTriggerList(trigger);\n for (var _i = 0, triggerList_1 = triggerList; _i < triggerList_1.length; _i++) {\n var opensOn = triggerList_1[_i];\n if (opensOn === 'Custom') {\n return;\n }\n if (opensOn === 'Focus') {\n this.wireFocusEvents();\n }\n if (opensOn === 'Click') {\n EventHandler.add(this.element, Browser.touchStartEvent, this.targetClick, this);\n }\n if (opensOn === 'Hover') {\n if (Browser.isDevice) {\n this.touchModule = new Touch(this.element, {\n tapHoldThreshold: TAPHOLD_THRESHOLD,\n tapHold: this.tapHoldHandler.bind(this)\n });\n EventHandler.add(this.element, Browser.touchEndEvent, this.touchEndHandler, this);\n }\n else {\n EventHandler.add(this.element, 'mouseover', this.targetHover, this);\n }\n }\n }\n EventHandler.add(document, 'touchend', this.touchEnd, this);\n EventHandler.add(document, 'scroll wheel', this.scrollHandler, this);\n EventHandler.add(window, 'resize', this.windowResize, this);\n EventHandler.add(document, 'keydown', this.keyDown, this);\n };\n Tooltip.prototype.getTriggerList = function (trigger) {\n if (trigger === 'Auto') {\n trigger = (Browser.isDevice) ? 'Hover' : 'Hover Focus';\n }\n return trigger.split(' ');\n };\n Tooltip.prototype.wireFocusEvents = function () {\n if (!isNullOrUndefined(this.target)) {\n var targetList = [].slice.call(selectAll(this.target, this.element));\n this.targetsList = targetList;\n if (!isNullOrUndefined(this.targetsList) && this.targetsList.length > 0) {\n for (var _i = 0, targetList_2 = targetList; _i < targetList_2.length; _i++) {\n var target = targetList_2[_i];\n EventHandler.add(target, 'focus', this.targetHover, this);\n }\n }\n else {\n EventHandler.add(this.element, 'focusin', this.targetHover, this);\n }\n }\n else {\n EventHandler.add(this.element, 'focusin', this.targetHover, this);\n }\n };\n Tooltip.prototype.wireMouseEvents = function (e, target) {\n if (this.tooltipEle) {\n if (!this.isSticky) {\n if (e.type === 'focus') {\n EventHandler.add(target, 'blur', this.onMouseOut, this);\n }\n if (e.type === 'focusin') {\n EventHandler.add(target, 'focusout', this.onMouseOut, this);\n }\n if (e.type === 'mouseover') {\n EventHandler.add(target, 'mouseleave', this.onMouseOut, this);\n }\n if (this.closeDelay) {\n EventHandler.add(this.tooltipEle, 'mouseenter', this.tooltipHover, this);\n EventHandler.add(this.tooltipEle, 'mouseleave', this.tooltipMouseOut, this);\n }\n }\n if (this.mouseTrail && this.openDelay === 0) {\n EventHandler.add(target, 'mousemove touchstart mouseenter', this.onMouseMove, this);\n }\n }\n };\n /**\n * Unbinding events from the element on widget destroy.\n *\n * @hidden\n *\n * @param {string} trigger - specify the trigger string to the function\n * @returns {void}\n *\n */\n Tooltip.prototype.unwireEvents = function (trigger) {\n var triggerList = this.getTriggerList(trigger);\n for (var _i = 0, triggerList_2 = triggerList; _i < triggerList_2.length; _i++) {\n var opensOn = triggerList_2[_i];\n if (opensOn === 'Custom') {\n return;\n }\n if (opensOn === 'Focus') {\n this.unwireFocusEvents();\n }\n if (opensOn === 'Click') {\n EventHandler.remove(this.element, Browser.touchStartEvent, this.targetClick);\n }\n if (opensOn === 'Hover') {\n if (Browser.isDevice) {\n if (this.touchModule) {\n this.touchModule.destroy();\n }\n EventHandler.remove(this.element, Browser.touchEndEvent, this.touchEndHandler);\n }\n else {\n EventHandler.remove(this.element, 'mouseover', this.targetHover);\n }\n }\n }\n EventHandler.remove(document, 'touchend', this.touchEnd);\n EventHandler.remove(document, 'scroll wheel', this.scrollHandler);\n EventHandler.remove(window, 'resize', this.windowResize);\n EventHandler.remove(document, 'keydown', this.keyDown);\n };\n Tooltip.prototype.unwireFocusEvents = function () {\n if (!isNullOrUndefined(this.target)) {\n var targetList = [].slice.call(selectAll(this.target, this.element));\n if (!isNullOrUndefined(this.targetsList) && this.targetsList.length > 0) {\n for (var _i = 0, targetList_3 = targetList; _i < targetList_3.length; _i++) {\n var target = targetList_3[_i];\n EventHandler.remove(target, 'focus', this.targetHover);\n }\n }\n else {\n EventHandler.remove(this.element, 'focusin', this.targetHover);\n }\n }\n else {\n EventHandler.remove(this.element, 'focusin', this.targetHover);\n }\n };\n Tooltip.prototype.unwireMouseEvents = function (target) {\n if (!this.isSticky) {\n var triggerList = this.getTriggerList(this.opensOn);\n for (var _i = 0, triggerList_3 = triggerList; _i < triggerList_3.length; _i++) {\n var opensOn = triggerList_3[_i];\n if (opensOn === 'Focus') {\n EventHandler.remove(target, 'blur', this.onMouseOut);\n EventHandler.remove(target, 'focusout', this.onMouseOut);\n }\n if (opensOn === 'Hover' && !Browser.isDevice) {\n EventHandler.remove(target, 'mouseleave', this.onMouseOut);\n }\n }\n if (this.closeDelay) {\n EventHandler.remove(target, 'mouseenter', this.tooltipHover);\n EventHandler.remove(target, 'mouseleave', this.tooltipMouseOut);\n }\n }\n if (this.mouseTrail) {\n EventHandler.remove(target, 'mousemove touchstart mouseenter', this.onMouseMove);\n }\n };\n Tooltip.prototype.findTarget = function () {\n var target = select('[data-tooltip-id= \"' + this.ctrlId + '_content\"]', document);\n return target;\n };\n /**\n * Core method to return the component name.\n *\n * @private\n *\n * @returns {string} - this method returns module name.\n */\n Tooltip.prototype.getModuleName = function () {\n return 'tooltip';\n };\n /**\n * Returns the properties to be maintained in the persisted state.\n *\n * @private\n *\n * @returns {string} - this method returns persisted data.\n */\n Tooltip.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Called internally, if any of the property value changed.\n *\n * @private\n *\n * @param {TooltipModel} newProp - this param gives new property values to the method\n * @param {TooltipModel} oldProp - this param gives old property values to the method\n * @returns {void}\n *\n */\n Tooltip.prototype.onPropertyChanged = function (newProp, oldProp) {\n var targetElement = this.findTarget();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'width':\n if (this.tooltipEle && targetElement) {\n this.tooltipEle.style.width = this.tooltipEle.style.maxWidth = formatUnit(newProp.width);\n this.reposition(targetElement);\n }\n break;\n case 'height':\n if (this.tooltipEle && targetElement) {\n this.tooltipEle.style.height = formatUnit(newProp.height);\n this.reposition(targetElement);\n }\n break;\n case 'content':\n if (this.tooltipEle) {\n this.renderContent();\n }\n break;\n case 'opensOn':\n this.unwireEvents(oldProp.opensOn);\n this.wireEvents(newProp.opensOn);\n break;\n case 'position':\n this.formatPosition();\n if (this.tooltipEle && targetElement) {\n var arrowInnerELe = select('.' + ARROW_TIP_INNER, this.tooltipEle);\n if (arrowInnerELe) {\n arrowInnerELe.style.top = arrowInnerELe.style.left = null;\n }\n this.reposition(targetElement);\n }\n break;\n case 'tipPointerPosition':\n if (this.tooltipEle && targetElement) {\n this.reposition(targetElement);\n }\n break;\n case 'offsetX':\n if (this.tooltipEle) {\n var x = newProp.offsetX - oldProp.offsetX;\n this.tooltipEle.style.left = (parseInt(this.tooltipEle.style.left, 10) + (x)).toString() + 'px';\n }\n break;\n case 'offsetY':\n if (this.tooltipEle) {\n var y = newProp.offsetY - oldProp.offsetY;\n this.tooltipEle.style.top = (parseInt(this.tooltipEle.style.top, 10) + (y)).toString() + 'px';\n }\n break;\n case 'cssClass':\n if (this.tooltipEle) {\n if (oldProp.cssClass) {\n removeClass([this.tooltipEle], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([this.tooltipEle], newProp.cssClass.split(' '));\n }\n }\n break;\n case 'enableRtl':\n if (this.tooltipEle) {\n if (this.enableRtl) {\n addClass([this.tooltipEle], RTL);\n }\n else {\n removeClass([this.tooltipEle], RTL);\n }\n }\n break;\n case 'isSticky':\n if (this.tooltipEle && targetElement) {\n this.renderCloseIcon();\n this.reposition(targetElement);\n }\n break;\n case 'container':\n if (!isNullOrUndefined(this.containerElement)) {\n removeClass([this.containerElement], POPUP_CONTAINER);\n }\n this.container = newProp.container;\n if (this.tooltipEle && targetElement) {\n this.appendContainer(this);\n this.reposition(targetElement);\n }\n }\n }\n };\n /**\n * It is used to show the Tooltip on the specified target with specific animation settings.\n *\n * @param {HTMLElement} element - Target element where the Tooltip is to be displayed. (It is an optional parameter)\n * @param {TooltipAnimationSettings} animation - Sets the specific animation, while showing the Tooltip on the screen. (It is an optional parameter)\n * @returns {void}\n */\n Tooltip.prototype.open = function (element, animation) {\n if (isNullOrUndefined(animation)) {\n animation = this.animation.open;\n }\n if (isNullOrUndefined(element)) {\n element = this.element;\n }\n if (element.style.display === 'none') {\n return;\n }\n this.showTooltip(element, animation);\n };\n /**\n * It is used to hide the Tooltip with specific animation effect.\n *\n * @param {TooltipAnimationSettings} animation - Sets the specific animation when hiding Tooltip from the screen. (It is an optional parameter)\n * @returns {void}\n */\n Tooltip.prototype.close = function (animation) {\n if (!animation) {\n animation = this.animation.close;\n }\n this.hideTooltip(animation);\n };\n /**\n * It is used to refresh the Tooltip content and its position.\n *\n * @param {HTMLElement} target - Target element where the Tooltip content or position needs to be refreshed.\n * @returns {void}\n */\n Tooltip.prototype.refresh = function (target) {\n if (this.tooltipEle) {\n this.renderContent(target);\n }\n if (this.popupObj && target) {\n this.reposition(target);\n }\n if (!isNullOrUndefined(this.targetsList) && !isNullOrUndefined(this.target)) {\n var target_2 = selectAll(this.target, this.element);\n if (target_2.length !== this.targetsList.length) {\n this.unwireEvents(this.opensOn);\n this.wireEvents(this.opensOn);\n }\n }\n };\n /**\n * It is used to destroy the Tooltip component.\n * @method destroy\n * @returns {void}\n * @memberof Tooltip\n */\n Tooltip.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n if (this.tooltipEle) {\n remove(this.tooltipEle);\n }\n if (this.popupObj) {\n this.popupObj.destroy();\n }\n collisionDestroy();\n removeClass([this.element], ROOT);\n this.unwireEvents(this.opensOn);\n this.unwireMouseEvents(this.element);\n this.tooltipEle = null;\n this.popupObj = null;\n var currentTarget = selectAll('[data-tooltip-id= \"' + this.ctrlId + '_content\"]', this.element);\n for (var _i = 0, currentTarget_1 = currentTarget; _i < currentTarget_1.length; _i++) {\n var target = currentTarget_1[_i];\n this.restoreElement(target);\n }\n };\n __decorate([\n Property('auto')\n ], Tooltip.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], Tooltip.prototype, \"height\", void 0);\n __decorate([\n Property()\n ], Tooltip.prototype, \"content\", void 0);\n __decorate([\n Property('body')\n ], Tooltip.prototype, \"container\", void 0);\n __decorate([\n Property()\n ], Tooltip.prototype, \"target\", void 0);\n __decorate([\n Property('TopCenter')\n ], Tooltip.prototype, \"position\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"offsetX\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"offsetY\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"showTipPointer\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"enableHtmlParse\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"windowCollision\", void 0);\n __decorate([\n Property('Auto')\n ], Tooltip.prototype, \"tipPointerPosition\", void 0);\n __decorate([\n Property('Auto')\n ], Tooltip.prototype, \"opensOn\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"mouseTrail\", void 0);\n __decorate([\n Property(false)\n ], Tooltip.prototype, \"isSticky\", void 0);\n __decorate([\n Complex({}, Animation)\n ], Tooltip.prototype, \"animation\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"openDelay\", void 0);\n __decorate([\n Property(0)\n ], Tooltip.prototype, \"closeDelay\", void 0);\n __decorate([\n Property()\n ], Tooltip.prototype, \"cssClass\", void 0);\n __decorate([\n Property(true)\n ], Tooltip.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property('')\n ], Tooltip.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeRender\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"afterOpen\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"afterClose\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"beforeCollision\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Tooltip.prototype, \"destroyed\", void 0);\n Tooltip = __decorate([\n NotifyPropertyChanges\n ], Tooltip);\n return Tooltip;\n}(Component));\nexport { Tooltip };\n","import { isNullOrUndefined, classList, createElement, Browser } from '@syncfusion/ej2-base';\nvar globalTimeOut = {};\nvar DEFT_MAT_WIDTH = 30;\nvar DEFT_MAT3_WIDTH = 30;\nvar DEFT_FAB_WIDTH = 30;\nvar DEFT_FLUENT_WIDTH = 30;\nvar DEFT_BOOT_WIDTH = 30;\nvar DEFT_BOOT4_WIDTH = 36;\nvar DEFT_BOOT5_WIDTH = 36;\nvar CLS_SHOWSPIN = 'e-spin-show';\nvar CLS_HIDESPIN = 'e-spin-hide';\nvar CLS_MATERIALSPIN = 'e-spin-material';\nvar CLS_MATERIAL3SPIN = 'e-spin-material3';\nvar CLS_FABRICSPIN = 'e-spin-fabric';\nvar CLS_FLUENTSPIN = 'e-spin-fluent';\nvar CLS_TAILWINDSPIN = 'e-spin-tailwind';\nvar CLS_BOOTSPIN = 'e-spin-bootstrap';\nvar CLS_BOOT4SPIN = 'e-spin-bootstrap4';\nvar CLS_BOOT5SPIN = 'e-spin-bootstrap5';\nvar CLS_HIGHCONTRASTSPIN = 'e-spin-high-contrast';\nvar CLS_SPINWRAP = 'e-spinner-pane';\nvar CLS_SPININWRAP = 'e-spinner-inner';\nvar CLS_SPINCIRCLE = 'e-path-circle';\nvar CLS_SPINARC = 'e-path-arc';\nvar CLS_SPINLABEL = 'e-spin-label';\nvar CLS_SPINTEMPLATE = 'e-spin-template';\nvar spinTemplate = null;\nvar spinCSSClass = null;\n// eslint-disable-next-line\n/**\n * Function to change the Spinners in a page globally from application end.\n * ```\n * E.g : blazorSpinner({ action: \"Create\", options: {target: targetElement}, type: \"\" });\n * ```\n *\n * @param {string} action - specifies the string\n * @param {CreateArgs} options - specifies the args\n * @param {string} target - specifies the target\n * @param {string} type - specifes the type\n * @returns {void}\n * @private\n */\nexport function Spinner(action, options, target, type) {\n switch (action) {\n case 'Create':\n /* eslint-disable */\n var element = document.querySelector(options.target);\n var args = { type: type, target: element, cssClass: options.cssClass,\n label: options.label, width: options.width };\n /* eslint-enable */\n createSpinner(args);\n break;\n case 'Show':\n showSpinner(document.querySelector(target));\n break;\n case 'Hide':\n hideSpinner(document.querySelector(target));\n break;\n case 'Set':\n // eslint-disable-next-line\n var setArgs = { cssClass: options.cssClass, type: type };\n setSpinner(setArgs);\n break;\n }\n}\n/**\n * Create a spinner for the specified target element.\n * ```\n * E.g : createSpinner({ target: targetElement, width: '34px', label: 'Loading..' });\n * ```\n *\n * @param {SpinnerArgs} args - specifies the args\n * @param {CreateElementArgs} internalCreateElement - specifis the element args\n * @returns {void}\n * @private\n */\nexport function createSpinner(args, internalCreateElement) {\n var _a;\n if (!args.target) {\n return;\n }\n var radius;\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n // eslint-disable-next-line\n var container = create_spinner_container(args.target, makeElement);\n if (!isNullOrUndefined(args.cssClass)) {\n var classNames = args.cssClass.split(' ').filter(function (className) { return className.trim() !== ''; });\n (_a = container.wrap.classList).add.apply(_a, classNames);\n }\n if (!isNullOrUndefined(args.template) || !isNullOrUndefined(spinTemplate)) {\n var template = !isNullOrUndefined(args.template) ? args.template : spinTemplate;\n container.wrap.classList.add(CLS_SPINTEMPLATE);\n replaceContent(container.wrap, template, spinCSSClass);\n }\n else {\n var theme = !isNullOrUndefined(args.type) ? args.type : getTheme(container.wrap);\n var width = !isNullOrUndefined(args.width) ? args.width : undefined;\n radius = calculateRadius(width, theme);\n setTheme(theme, container.wrap, radius, makeElement);\n if (!isNullOrUndefined(args.label)) {\n createLabel(container.inner_wrap, args.label, makeElement);\n }\n }\n container.wrap.classList.add(CLS_HIDESPIN);\n container = null;\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {string} label - specifies the string\n * @param {createElementParams} makeElement - specifies the element\n * @returns {HTMLElement} - returns the element\n */\nfunction createLabel(container, label, makeElement) {\n var labelEle = makeElement('div', {});\n labelEle.classList.add(CLS_SPINLABEL);\n labelEle.innerHTML = label;\n container.appendChild(labelEle);\n return labelEle;\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createMaterialSpinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Material', radius: radius };\n create_material_element(container, uniqueID, makeElement, CLS_MATERIALSPIN);\n mat_calculate_attributes(radius, container, 'Material', CLS_MATERIALSPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createMaterial3Spinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Material3', radius: radius };\n create_material_element(container, uniqueID, makeElement, CLS_MATERIAL3SPIN);\n mat_calculate_attributes(radius, container, 'Material3', CLS_MATERIAL3SPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createBootstrap4Spinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Bootstrap4', radius: radius };\n create_material_element(container, uniqueID, makeElement, CLS_BOOT4SPIN);\n mat_calculate_attributes(radius, container, 'Bootstrap4', CLS_BOOT4SPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createBootstrap5Spinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Bootstrap5', radius: radius };\n create_material_element(container, uniqueID, makeElement, CLS_BOOT5SPIN);\n mat_calculate_attributes(radius, container, 'Bootstrap5', CLS_BOOT5SPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {string} uniqueID - specifies the id.\n * @param {number} radius - specifies the radius\n * @returns {void}\n */\nfunction startMatAnimate(container, uniqueID, radius) {\n var globalObject = {};\n var timeOutVar = 0;\n globalTimeOut[\"\" + uniqueID].timeOut = 0;\n globalObject[\"\" + uniqueID] = globalVariables(uniqueID, radius, 0, 0);\n // eslint-disable-next-line\n var spinnerInfo = { uniqueID: uniqueID, container: container, globalInfo: globalObject, timeOutVar: timeOutVar };\n animateMaterial(spinnerInfo);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createFabricSpinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Fabric', radius: radius };\n create_fabric_element(container, uniqueID, CLS_FABRICSPIN, makeElement);\n fb_calculate_attributes(radius, container, CLS_FABRICSPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createFluentSinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Fluent', radius: radius };\n create_fabric_element(container, uniqueID, CLS_FLUENTSPIN, makeElement);\n fb_calculate_attributes(radius, container, CLS_FLUENTSPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createTailwindSpinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Tailwind', radius: radius };\n create_fabric_element(container, uniqueID, CLS_TAILWINDSPIN, makeElement);\n fb_calculate_attributes(radius, container, CLS_TAILWINDSPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createHighContrastSpinner(container, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'HighContrast', radius: radius };\n create_fabric_element(container, uniqueID, CLS_HIGHCONTRASTSPIN, makeElement);\n fb_calculate_attributes(radius, container, CLS_HIGHCONTRASTSPIN);\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @returns {string} - returns the string\n */\nfunction getTheme(container) {\n var theme = window.getComputedStyle(container, ':after').getPropertyValue('content');\n return theme.replace(/['\"]+/g, '');\n}\n/**\n *\n * @param {string} theme - specifies the theme\n * @param {HTMLElement} container - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction setTheme(theme, container, radius, makeElement) {\n var innerContainer = container.querySelector('.' + CLS_SPININWRAP);\n var svg = innerContainer.querySelector('svg');\n if (!isNullOrUndefined(svg)) {\n innerContainer.removeChild(svg);\n }\n switch (theme) {\n case 'Material':\n createMaterialSpinner(innerContainer, radius, makeElement);\n break;\n case 'Material3':\n createMaterial3Spinner(innerContainer, radius, makeElement);\n break;\n case 'Fabric':\n createFabricSpinner(innerContainer, radius, makeElement);\n break;\n case 'Fluent':\n createFluentSinner(innerContainer, radius, makeElement);\n break;\n case 'Bootstrap':\n createBootstrapSpinner(innerContainer, radius, makeElement);\n break;\n case 'HighContrast':\n createHighContrastSpinner(innerContainer, radius, makeElement);\n break;\n case 'Bootstrap4':\n createBootstrap4Spinner(innerContainer, radius, makeElement);\n break;\n case 'Bootstrap5':\n createBootstrap5Spinner(innerContainer, radius, makeElement);\n break;\n case 'Tailwind':\n case 'Tailwind-dark':\n createTailwindSpinner(innerContainer, radius, makeElement);\n break;\n }\n}\n/**\n *\n * @param {HTMLElement} innerContainer - specifies the element\n * @param {number} radius - specifies the radius\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\nfunction createBootstrapSpinner(innerContainer, radius, makeElement) {\n var uniqueID = random_generator();\n globalTimeOut[\"\" + uniqueID] = { timeOut: 0, type: 'Bootstrap', radius: radius };\n create_bootstrap_element(innerContainer, uniqueID, makeElement);\n boot_calculate_attributes(innerContainer, radius);\n}\n/**\n *\n * @param {HTMLElement} innerContainer - specifies the element\n * @param {string} uniqueID - specifies the id\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\n// eslint-disable-next-line\nfunction create_bootstrap_element(innerContainer, uniqueID, makeElement) {\n var svgBoot = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n var viewBoxValue = 64;\n var trans = 32;\n var defaultRadius = 2;\n svgBoot.setAttribute('id', uniqueID);\n svgBoot.setAttribute('class', CLS_BOOTSPIN);\n svgBoot.setAttribute('viewBox', '0 0 ' + viewBoxValue + ' ' + viewBoxValue);\n innerContainer.insertBefore(svgBoot, innerContainer.firstChild);\n for (var item = 0; item <= 7; item++) {\n var bootCircle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\n bootCircle.setAttribute('class', CLS_SPINCIRCLE + '_' + item);\n bootCircle.setAttribute('r', defaultRadius + '');\n bootCircle.setAttribute('transform', 'translate(' + trans + ',' + trans + ')');\n svgBoot.appendChild(bootCircle);\n }\n}\n/**\n *\n * @param {HTMLElement} innerContainer - specifies the element\n * @param {number} radius - specifies the radius\n * @returns {void}\n */\n// eslint-disable-next-line\nfunction boot_calculate_attributes(innerContainer, radius) {\n var svg = innerContainer.querySelector('svg.e-spin-bootstrap');\n var x = 0;\n var y = 0;\n var rad = 24;\n svg.style.width = svg.style.height = radius + 'px';\n var startArc = 90;\n for (var item = 0; item <= 7; item++) {\n var start = defineArcPoints(x, y, rad, startArc);\n var circleEle = svg.querySelector('.' + CLS_SPINCIRCLE + '_' + item);\n circleEle.setAttribute('cx', start.x + '');\n circleEle.setAttribute('cy', start.y + '');\n startArc = startArc >= 360 ? 0 : startArc;\n startArc = startArc + 45;\n }\n}\n/**\n *\n * @param {number} begin - specifies the number\n * @param {number} stop - specifirs the number\n * @returns {number[]} - returns the array of number\n */\nfunction generateSeries(begin, stop) {\n var series = [];\n var start = begin;\n var end = stop;\n // eslint-disable-next-line\n var increment = false, count = 1;\n formSeries(start);\n /**\n *\n * @param {number} i - specifies the number\n * @returns {void}\n */\n function formSeries(i) {\n series.push(i);\n if (i !== end || count === 1) {\n if (i <= start && i > 1 && !increment) {\n i = parseFloat((i - 0.2).toFixed(2));\n }\n else if (i === 1) {\n i = 7;\n i = parseFloat((i + 0.2).toFixed(2));\n increment = true;\n }\n else if (i < 8 && increment) {\n i = parseFloat((i + 0.2).toFixed(2));\n if (i === 8) {\n increment = false;\n }\n }\n else if (i <= 8 && !increment) {\n i = parseFloat((i - 0.2).toFixed(2));\n }\n ++count;\n formSeries(i);\n }\n }\n return series;\n}\n/**\n *\n * @param {HTMLElement} innerContainer - specifies the element\n * @returns {void}\n */\nfunction animateBootstrap(innerContainer) {\n var svg = innerContainer.querySelector('svg.e-spin-bootstrap');\n var id = svg.getAttribute('id');\n for (var i = 1; i <= 8; i++) {\n var circleEle = (innerContainer.getElementsByClassName('e-path-circle_' +\n (i === 8 ? 0 : i))[0]);\n rotation(circleEle, i, i, generateSeries(i, i), id);\n }\n /**\n *\n * @param {SVGCircleElement} circle - specifies the circl element\n * @param {number} start - specifies the number\n * @param {number} end - specifies the end number\n * @param {number} series - specifies the series\n * @param {string} id - specifies the id\n * @returns {void}\n */\n function rotation(circle, start, end, series, id) {\n var count = 0;\n boot_animate(start);\n // eslint-disable-next-line\n function boot_animate(radius) {\n if (globalTimeOut[\"\" + id].isAnimate) {\n ++count;\n circle.setAttribute('r', radius + '');\n if (count >= series.length) {\n count = 0;\n }\n // eslint-disable-next-line\n globalTimeOut[id].timeOut = setTimeout(boot_animate.bind(null, series[count]), 18);\n }\n }\n }\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {string} template - specifies the template\n * @param {string} cssClass - specifies the css class.\n * @returns {void}\n */\nfunction replaceContent(container, template, cssClass) {\n if (!isNullOrUndefined(cssClass)) {\n container.classList.add(cssClass);\n }\n var inner = container.querySelector('.e-spinner-inner');\n inner.innerHTML = template;\n}\n/**\n *\n * @param {string} width - specifies the width\n * @param {string} theme - specifies the string\n * @returns {number} - returns the number\n */\nfunction calculateRadius(width, theme) {\n var defaultSize;\n switch (theme) {\n case 'Material':\n defaultSize = DEFT_MAT_WIDTH;\n break;\n case 'Material3':\n defaultSize = DEFT_MAT3_WIDTH;\n break;\n case 'Fabric':\n defaultSize = DEFT_FAB_WIDTH;\n break;\n case 'Tailwind':\n case 'Tailwind-dark':\n defaultSize = DEFT_FAB_WIDTH;\n break;\n case 'Fluent':\n defaultSize = DEFT_FLUENT_WIDTH;\n break;\n case 'Bootstrap4':\n defaultSize = DEFT_BOOT4_WIDTH;\n break;\n case 'Bootstrap5':\n defaultSize = DEFT_BOOT5_WIDTH;\n break;\n default:\n defaultSize = DEFT_BOOT_WIDTH;\n }\n width = width ? parseFloat(width + '') : defaultSize;\n return theme === 'Bootstrap' ? width : width / 2;\n}\n/**\n *\n * @param {string} id - specifies the id\n * @param {number} radius - specifies the radius\n * @param {number} count - specifies the number count\n * @param {number} previousId - specifies the previous id\n * @returns {GlobalVariables} - returns the variables\n */\nfunction globalVariables(id, radius, count, previousId) {\n return {\n radius: radius,\n count: count,\n previousId: previousId\n };\n}\n/**\n * @returns {string} - returns the string\n */\n// eslint-disable-next-line\nfunction random_generator() {\n var random = '';\n var combine = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';\n for (var i = 0; i < 5; i++) {\n random += combine.charAt(Math.floor(Math.random() * combine.length));\n }\n return random;\n}\n/**\n *\n * @param {HTMLElement} innerCon - specifies the element\n * @param {string} uniqueID - specifies the unique id\n * @param {string} themeClass - specifies the string\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\n// eslint-disable-next-line\nfunction create_fabric_element(innerCon, uniqueID, themeClass, makeElement) {\n var svgFabric = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n svgFabric.setAttribute('id', uniqueID);\n svgFabric.setAttribute('class', themeClass);\n var fabricCirclePath = document.createElementNS('http://www.w3.org/2000/svg', 'path');\n fabricCirclePath.setAttribute('class', CLS_SPINCIRCLE);\n var fabricCircleArc = document.createElementNS('http://www.w3.org/2000/svg', 'path');\n fabricCircleArc.setAttribute('class', CLS_SPINARC);\n innerCon.insertBefore(svgFabric, innerCon.firstChild);\n svgFabric.appendChild(fabricCirclePath);\n svgFabric.appendChild(fabricCircleArc);\n}\n/**\n *\n * @param {HTMLElement} innerContainer - specifies the element\n * @param {string} uniqueID - specifies the unique id\n * @param {createElementParams} makeElement - specifies the element\n * @param {string} cls - specifies the string\n * @returns {void}\n */\n// eslint-disable-next-line\nfunction create_material_element(innerContainer, uniqueID, makeElement, cls) {\n var svgMaterial = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n var matCirclePath = document.createElementNS('http://www.w3.org/2000/svg', 'path');\n svgMaterial.setAttribute('class', cls);\n svgMaterial.setAttribute('id', uniqueID);\n matCirclePath.setAttribute('class', CLS_SPINCIRCLE);\n innerContainer.insertBefore(svgMaterial, innerContainer.firstChild);\n svgMaterial.appendChild(matCirclePath);\n}\n/**\n *\n * @param {HTMLElement} target - specifies the element\n * @param {createElementParams} makeElement - specifies the element\n * @returns {void}\n */\n// eslint-disable-next-line\nfunction create_spinner_container(target, makeElement) {\n var spinnerContainer = makeElement('div', {});\n var spinnerInnerContainer = makeElement('div', {});\n spinnerContainer.classList.add(CLS_SPINWRAP);\n spinnerInnerContainer.classList.add(CLS_SPININWRAP);\n spinnerInnerContainer.setAttribute('aria-disabled', 'true');\n target.appendChild(spinnerContainer);\n spinnerContainer.appendChild(spinnerInnerContainer);\n // eslint-disable-next-line\n return { wrap: spinnerContainer, inner_wrap: spinnerInnerContainer };\n}\n/**\n *\n * @param {SpinnerInfo} spinnerInfo - specifies the spinner\n * @returns {void}\n */\nfunction animateMaterial(spinnerInfo) {\n var start = 1;\n var end = 149;\n var duration = 1333;\n var max = 75;\n createCircle(start, end, easeAnimation, duration, spinnerInfo.globalInfo[spinnerInfo.uniqueID].count, max, spinnerInfo);\n spinnerInfo.globalInfo[spinnerInfo.uniqueID].count = ++spinnerInfo.globalInfo[spinnerInfo.uniqueID].count % 4;\n}\n/**\n *\n * @param {number} start - specifies the number\n * @param {number} end - specifies the end number\n * @param {Function} easing - specifies the function\n * @param {number} duration - specifies the duration\n * @param {number} count - specifies the count\n * @param {number} max - specifies the max number\n * @param {SpinnerInfo} spinnerInfo - specifies the spinner info\n * @returns {void}\n */\nfunction createCircle(start, end, easing, duration, count, max, spinnerInfo) {\n var id = ++spinnerInfo.globalInfo[spinnerInfo.uniqueID].previousId;\n var startTime = new Date().getTime();\n var change = end - start;\n var diameter = getSize((spinnerInfo.globalInfo[spinnerInfo.uniqueID].radius * 2) + '');\n var strokeSize = getStrokeSize(diameter);\n var rotate = -90 * (spinnerInfo.globalInfo[spinnerInfo.uniqueID].count || 0);\n mat_animation(spinnerInfo);\n // eslint-disable-next-line\n function mat_animation(spinnerInfo) {\n var currentTime = Math.max(0, Math.min(new Date().getTime() - startTime, duration));\n updatePath(easing(currentTime, start, change, duration), spinnerInfo.container);\n if (id === spinnerInfo.globalInfo[spinnerInfo.uniqueID].previousId && currentTime < duration) {\n // eslint-disable-next-line\n globalTimeOut[spinnerInfo.uniqueID].timeOut = setTimeout(mat_animation.bind(null, spinnerInfo), 1);\n }\n else {\n animateMaterial(spinnerInfo);\n }\n }\n /**\n *\n * @param {number} value - specifies the number value\n * @param {HTMLElement} container - specifies the container\n * @returns {void}\n */\n function updatePath(value, container) {\n if (!isNullOrUndefined(container.querySelector('svg.e-spin-material')) || !isNullOrUndefined(container.querySelector('svg.e-spin-material3'))) {\n var svg = void 0;\n if (!isNullOrUndefined(container.querySelector('svg.e-spin-material')) && !isNullOrUndefined(container.querySelector('svg.e-spin-material').querySelector('path.e-path-circle'))) {\n svg = container.querySelector('svg.e-spin-material');\n }\n else if (!isNullOrUndefined(container.querySelector('svg.e-spin-material3')) && !isNullOrUndefined(container.querySelector('svg.e-spin-material3').querySelector('path.e-path-circle'))) {\n svg = container.querySelector('svg.e-spin-material3');\n }\n if (!isNullOrUndefined(svg)) {\n var path = svg.querySelector('path.e-path-circle');\n path.setAttribute('stroke-dashoffset', getDashOffset(diameter, strokeSize, value, max) + '');\n path.setAttribute('transform', 'rotate(' + (rotate) + ' ' + diameter / 2 + ' ' + diameter / 2 + ')');\n }\n }\n }\n}\n/**\n *\n * @param {number} radius - specifies the number\n * @param {HTMLElement} container - specifies the element\n * @param {string} type - specifies the string type\n * @param {string} cls - specifies the string\n * @returns {void}\n */\n// eslint-disable-next-line\nfunction mat_calculate_attributes(radius, container, type, cls) {\n var diameter = radius * 2;\n var svg = container.querySelector('svg.' + cls);\n var path = svg.querySelector('path.e-path-circle');\n var strokeSize = getStrokeSize(diameter);\n var transformOrigin = (diameter / 2) + 'px';\n svg.setAttribute('viewBox', '0 0 ' + diameter + ' ' + diameter);\n svg.style.width = svg.style.height = diameter + 'px';\n svg.style.transformOrigin = transformOrigin + ' ' + transformOrigin + ' ' + transformOrigin;\n path.setAttribute('d', drawArc(diameter, strokeSize));\n if (type === 'Material' || type === 'Material3') {\n path.setAttribute('stroke-width', strokeSize + '');\n path.setAttribute('stroke-dasharray', ((diameter - strokeSize) * Math.PI * 0.75) + '');\n path.setAttribute('stroke-dashoffset', getDashOffset(diameter, strokeSize, 1, 75) + '');\n }\n}\n/**\n *\n * @param {string} value - specifies the value\n * @returns {number} - returns the number\n */\nfunction getSize(value) {\n var parsed = parseFloat(value);\n return parsed;\n}\n/**\n *\n * @param {number} diameter - specifies the diameter\n * @param {number} strokeSize - specifies the size\n * @returns {string} - returns the string\n */\nfunction drawArc(diameter, strokeSize) {\n var radius = diameter / 2;\n var offset = strokeSize / 2;\n return 'M' + radius + ',' + offset\n + 'A' + (radius - offset) + ',' + (radius - offset) + ' 0 1 1 ' + offset + ',' + radius;\n}\n/**\n *\n * @param {number} diameter - specifies the number\n * @returns {number} - returns the number\n */\nfunction getStrokeSize(diameter) {\n return 10 / 100 * diameter;\n}\n/**\n *\n * @param {number} diameter - specifies the number\n * @param {number} strokeSize - specifies the stroke size\n * @param {number} value - specifies the value\n * @param {number} max - specifies the max number\n * @returns {number} - returns the number\n */\nfunction getDashOffset(diameter, strokeSize, value, max) {\n return (diameter - strokeSize) * Math.PI * ((3 * (max) / 100) - (value / 100));\n}\n/**\n *\n * @param {number} current - specifies the number\n * @param {number} start - specifies the stroke size\n * @param {number} change - specifies the value\n * @param {number} duration - specifies the max number\n * @returns {number} - returns the number\n */\nfunction easeAnimation(current, start, change, duration) {\n var timestamp = (current /= duration) * current;\n var timecount = timestamp * current;\n return start + change * (6 * timecount * timestamp + -15 * timestamp * timestamp + 10 * timecount);\n}\n/**\n *\n * @param {number} radius - specifies the number\n * @param {HTMLElement} innerConainer - specifies the element\n * @param {string} trgClass - specifies the class\n * @returns {void}\n */\n// eslint-disable-next-line\nfunction fb_calculate_attributes(radius, innerConainer, trgClass) {\n var centerX = radius;\n var centerY = radius;\n var diameter = radius * 2;\n // eslint-disable-next-line\n var startArc = 315, endArc = 45;\n var svg = innerConainer.querySelector('.' + trgClass);\n var circle = svg.querySelector('.e-path-circle');\n var path = svg.querySelector('.e-path-arc');\n var transformOrigin = (diameter / 2) + 'px';\n circle.setAttribute('d', defineCircle(centerX, centerY, radius));\n path.setAttribute('d', defineArc(centerX, centerY, radius, startArc, endArc));\n svg.setAttribute('viewBox', '0 0 ' + diameter + ' ' + diameter);\n svg.style.transformOrigin = transformOrigin + ' ' + transformOrigin + ' ' + transformOrigin;\n svg.style.width = svg.style.height = diameter + 'px';\n}\n/**\n *\n * @param {number} centerX - specifies the number\n * @param {number} centerY - specifies the stroke size\n * @param {number} radius - specifies the value\n * @param {number} angle - specifies the max number\n * @returns {number} - returns the number\n */\nfunction defineArcPoints(centerX, centerY, radius, angle) {\n var radians = (angle - 90) * Math.PI / 180.0;\n return {\n x: centerX + (radius * Math.cos(radians)),\n y: centerY + (radius * Math.sin(radians))\n };\n}\n/**\n *\n * @param {number} x - specifies the number\n * @param {number} y - specifies the stroke size\n * @param {number} radius - specifies the radius\n * @param {number} startArc - specifies the value\n * @param {number} endArc - specifies the max number\n * @returns {number} - returns the number\n */\nfunction defineArc(x, y, radius, startArc, endArc) {\n var start = defineArcPoints(x, y, radius, endArc);\n var end = defineArcPoints(x, y, radius, startArc);\n var d = [\n 'M', start.x, start.y,\n 'A', radius, radius, 0, 0, 0, end.x, end.y\n ].join(' ');\n return d;\n}\n/**\n *\n * @param {number} x - specifies the number\n * @param {number} y - specifies the stroke size\n * @param {number} radius - specifies the value\n * @returns {string} - returns the string\n */\nfunction defineCircle(x, y, radius) {\n var d = [\n 'M', x, y,\n 'm', -radius, 0,\n 'a', radius, radius, 0, 1, 0, radius * 2, 0,\n 'a', radius, radius, 0, 1, 0, -radius * 2, 0\n ].join(' ');\n return d;\n}\n/**\n * Function to show the Spinner.\n *\n * @param {HTMLElement} container - Specify the target of the Spinner.\n * @returns {void}\n * @private\n */\nexport function showSpinner(container) {\n showHideSpinner(container, false);\n container = null;\n}\n/**\n *\n * @param {HTMLElement} container - specifies the element\n * @param {boolean} isHide - specifies the boolean\n * @returns {void}\n */\nfunction showHideSpinner(container, isHide) {\n var spinnerWrap;\n if (container) {\n if (container.classList.contains(CLS_SPINWRAP)) {\n spinnerWrap = container;\n }\n else {\n var spinWrapCollection = container.querySelectorAll('.' + CLS_SPINWRAP);\n if (Browser.isIE) {\n for (var i = 0; i < spinWrapCollection.length; i++) {\n // eslint-disable-next-line\n if (spinWrapCollection[i].parentElement && spinWrapCollection[i].parentElement === container) {\n // eslint-disable-next-line\n spinnerWrap = spinWrapCollection[i];\n break;\n }\n }\n }\n else {\n spinnerWrap = Array.from(spinWrapCollection).find(function (wrap) { return wrap.parentElement === container; }) || null;\n }\n }\n }\n if (container && spinnerWrap) {\n var inner = spinnerWrap.querySelector('.' + CLS_SPININWRAP);\n var spinCheck = void 0;\n // eslint-disable-next-line\n spinCheck = isHide ? !spinnerWrap.classList.contains(CLS_SPINTEMPLATE) && !spinnerWrap.classList.contains(CLS_HIDESPIN) :\n !spinnerWrap.classList.contains(CLS_SPINTEMPLATE) && !spinnerWrap.classList.contains(CLS_SHOWSPIN);\n if (spinCheck) {\n var svgEle = spinnerWrap.querySelector('svg');\n if (isNullOrUndefined(svgEle)) {\n return;\n }\n var id = svgEle.getAttribute('id');\n globalTimeOut[\"\" + id].isAnimate = !isHide;\n switch (globalTimeOut[\"\" + id].type) {\n case 'Material':\n case 'Material3':\n // eslint-disable-next-line\n isHide ? clearTimeout(globalTimeOut[id].timeOut) : startMatAnimate(inner, id, globalTimeOut[id].radius);\n break;\n case 'Bootstrap':\n // eslint-disable-next-line\n isHide ? clearTimeout(globalTimeOut[id].timeOut) : animateBootstrap(inner);\n break;\n }\n }\n // eslint-disable-next-line\n isHide ? classList(spinnerWrap, [CLS_HIDESPIN], [CLS_SHOWSPIN]) : classList(spinnerWrap, [CLS_SHOWSPIN], [CLS_HIDESPIN]);\n container = null;\n }\n}\n/**\n * Function to hide the Spinner.\n *\n * @param {HTMLElement} container - Specify the target of the Spinner.\n * @returns {void}\n * @private\n */\nexport function hideSpinner(container) {\n showHideSpinner(container, true);\n container = null;\n}\n// eslint-disable-next-line\n/**\n * Function to change the Spinners in a page globally from application end.\n * ```\n * E.g : setSpinner({ cssClass: 'custom-css'; type: 'Material' });\n * ```\n *\n * @param {SetSpinnerArgs} args - specifies the args\n * @param {createElementParams} internalCreateElement - specifies the element params\n * @returns {void}\n * @private\n */\nexport function setSpinner(args, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n if (args.template !== undefined) {\n spinTemplate = args.template;\n if (args.template !== undefined) {\n spinCSSClass = args.cssClass;\n }\n }\n var container = document.querySelectorAll('.' + CLS_SPINWRAP);\n for (var index = 0; index < container.length; index++) {\n ensureTemplate(args.template, container[index], args.type, args.cssClass, makeElement);\n }\n}\n/**\n *\n * @param {string} template - specifies the string\n * @param {HTMLElement} container - specifies the container\n * @param {string} theme - specifies the theme\n * @param {string} cssClass - specifies the string class\n * @param {createElementParams} makeEle - specifies the params\n * @returns {void}\n */\nfunction ensureTemplate(template, container, theme, cssClass, makeEle) {\n if (isNullOrUndefined(template) && !container.classList.contains(CLS_SPINTEMPLATE)) {\n replaceTheme(container, theme, cssClass, makeEle);\n if (container.classList.contains(CLS_SHOWSPIN)) {\n container.classList.remove(CLS_SHOWSPIN);\n showSpinner(container);\n }\n else {\n container.classList.remove(CLS_HIDESPIN);\n hideSpinner(container);\n }\n }\n else {\n spinTemplate = template;\n if (!isNullOrUndefined(cssClass)) {\n spinCSSClass = cssClass;\n }\n if (!isNullOrUndefined(spinTemplate)) {\n replaceContent(container, spinTemplate, spinCSSClass);\n }\n }\n}\n/**\n *\n * @param {HTMLElement} container - specifies the container\n * @param {string} theme - specifies the theme\n * @param {string} cssClass - specifies the string class\n * @param {createElementParams} makeEle - specifies the params\n * @returns {void}\n */\nfunction replaceTheme(container, theme, cssClass, makeEle) {\n if (!isNullOrUndefined(cssClass)) {\n container.classList.add(cssClass);\n }\n var svgElement = container.querySelector('svg');\n if (!isNullOrUndefined(svgElement)) {\n var radius = theme === 'Bootstrap' ? parseFloat(svgElement.style.height) : parseFloat(svgElement.style.height) / 2;\n var classNames = svgElement.getAttribute('class');\n var svgClassList = classNames.split(/\\s/);\n if (svgClassList.indexOf('e-spin-material') >= 0) {\n var id = svgElement.getAttribute('id');\n clearTimeout(globalTimeOut[\"\" + id].timeOut);\n }\n setTheme(theme, container, radius, makeEle);\n }\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, ChildProperty, NotifyPropertyChanges, isBlazor } from '@syncfusion/ej2-base';\nimport { Event, EventHandler, KeyboardEvents, Touch } from '@syncfusion/ej2-base';\nimport { Animation } from '@syncfusion/ej2-base';\nimport { Browser, Collection, setValue, getValue, getUniqueID, getInstance, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { select, selectAll, closest, detach, append, rippleEffect, isVisible, Complex, addClass, removeClass } from '@syncfusion/ej2-base';\nimport { ListBase } from '@syncfusion/ej2-lists';\nimport { getZindexPartial, calculatePosition, isCollide, fit, Popup } from '@syncfusion/ej2-popups';\nimport { SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { getScrollableParent } from '@syncfusion/ej2-popups';\nimport { HScroll } from '../common/h-scroll';\nimport { VScroll } from '../common/v-scroll';\nimport { addScrolling, destroyScroll } from '../common/menu-scroll';\nvar ENTER = 'enter';\nvar ESCAPE = 'escape';\nvar FOCUSED = 'e-focused';\nvar HEADER = 'e-menu-header';\nvar SELECTED = 'e-selected';\nvar SEPARATOR = 'e-separator';\nvar UPARROW = 'uparrow';\nvar DOWNARROW = 'downarrow';\nvar LEFTARROW = 'leftarrow';\nvar RIGHTARROW = 'rightarrow';\nvar HOME = 'home';\nvar END = 'end';\nvar TAB = 'tab';\nvar CARET = 'e-caret';\nvar ITEM = 'e-menu-item';\nvar DISABLED = 'e-disabled';\nvar HIDE = 'e-menu-hide';\nvar ICONS = 'e-icons';\nvar RTL = 'e-rtl';\nvar POPUP = 'e-menu-popup';\nvar TEMPLATE_PROPERTY = 'Template';\n/**\n * Configures the field options of the Menu.\n */\nvar FieldSettings = /** @class */ (function (_super) {\n __extends(FieldSettings, _super);\n function FieldSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('id')\n ], FieldSettings.prototype, \"itemId\", void 0);\n __decorate([\n Property('parentId')\n ], FieldSettings.prototype, \"parentId\", void 0);\n __decorate([\n Property('text')\n ], FieldSettings.prototype, \"text\", void 0);\n __decorate([\n Property('iconCss')\n ], FieldSettings.prototype, \"iconCss\", void 0);\n __decorate([\n Property('url')\n ], FieldSettings.prototype, \"url\", void 0);\n __decorate([\n Property('separator')\n ], FieldSettings.prototype, \"separator\", void 0);\n __decorate([\n Property('items')\n ], FieldSettings.prototype, \"children\", void 0);\n return FieldSettings;\n}(ChildProperty));\nexport { FieldSettings };\n/**\n * Specifies menu items.\n */\nvar MenuItem = /** @class */ (function (_super) {\n __extends(MenuItem, _super);\n function MenuItem() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], MenuItem.prototype, \"iconCss\", void 0);\n __decorate([\n Property('')\n ], MenuItem.prototype, \"id\", void 0);\n __decorate([\n Property(false)\n ], MenuItem.prototype, \"separator\", void 0);\n __decorate([\n Collection([], MenuItem)\n ], MenuItem.prototype, \"items\", void 0);\n __decorate([\n Property('')\n ], MenuItem.prototype, \"text\", void 0);\n __decorate([\n Property('')\n ], MenuItem.prototype, \"url\", void 0);\n return MenuItem;\n}(ChildProperty));\nexport { MenuItem };\n/**\n * Animation configuration settings.\n */\nvar MenuAnimationSettings = /** @class */ (function (_super) {\n __extends(MenuAnimationSettings, _super);\n function MenuAnimationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('SlideDown')\n ], MenuAnimationSettings.prototype, \"effect\", void 0);\n __decorate([\n Property(400)\n ], MenuAnimationSettings.prototype, \"duration\", void 0);\n __decorate([\n Property('ease')\n ], MenuAnimationSettings.prototype, \"easing\", void 0);\n return MenuAnimationSettings;\n}(ChildProperty));\nexport { MenuAnimationSettings };\n/**\n * Base class for Menu and ContextMenu components.\n *\n * @private\n */\nvar MenuBase = /** @class */ (function (_super) {\n __extends(MenuBase, _super);\n /**\n * Constructor for creating the widget.\n *\n * @private\n * @param {MenuBaseModel} options - Specifies the menu base model\n * @param {string | HTMLUListElement} element - Specifies the element\n */\n function MenuBase(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.navIdx = [];\n _this.animation = new Animation({});\n _this.isTapHold = false;\n _this.tempItem = [];\n _this.showSubMenuOn = 'Auto';\n return _this;\n }\n /**\n * Initialized third party configuration settings.\n *\n * @private\n * @returns {void}\n */\n MenuBase.prototype.preRender = function () {\n if (!this.isMenu) {\n var ul = void 0;\n if (this.element.tagName === 'EJS-CONTEXTMENU') {\n ul = this.createElement('ul', {\n id: getUniqueID(this.getModuleName()), className: 'e-control e-lib e-' + this.getModuleName()\n });\n var ejInst = getValue('ej2_instances', this.element);\n removeClass([this.element], ['e-control', 'e-lib', 'e-' + this.getModuleName()]);\n this.clonedElement = this.element;\n this.element = ul;\n setValue('ej2_instances', ejInst, this.element);\n }\n else {\n ul = this.createElement('ul', { id: getUniqueID(this.getModuleName()) });\n append([].slice.call(this.element.cloneNode(true).children), ul);\n var refEle = this.element.nextElementSibling;\n if (refEle) {\n this.element.parentElement.insertBefore(ul, refEle);\n }\n else {\n this.element.parentElement.appendChild(ul);\n }\n this.clonedElement = ul;\n }\n this.clonedElement.style.display = 'none';\n }\n if (this.element.tagName === 'EJS-MENU') {\n var ele = this.element;\n var ejInstance = getValue('ej2_instances', ele);\n var ul = this.createElement('ul');\n var wrapper = this.createElement('EJS-MENU', { className: 'e-' + this.getModuleName() + '-wrapper' });\n for (var idx = 0, len = ele.attributes.length; idx < len; idx++) {\n ul.setAttribute(ele.attributes[idx].nodeName, ele.attributes[idx].nodeValue);\n }\n ele.parentNode.insertBefore(wrapper, ele);\n detach(ele);\n ele = ul;\n wrapper.appendChild(ele);\n setValue('ej2_instances', ejInstance, ele);\n this.clonedElement = wrapper;\n this.element = ele;\n if (!this.element.id) {\n this.element.id = getUniqueID(this.getModuleName());\n }\n }\n };\n /**\n * Initialize the control rendering.\n *\n * @private\n * @returns {void}\n */\n MenuBase.prototype.render = function () {\n var _this = this;\n this.initialize();\n this.renderItems();\n this.wireEvents();\n this.renderComplete();\n var wrapper = this.getWrapper();\n // eslint-disable-next-line\n if (this.template && this.enableScrolling && (this.isReact || this.isAngular)) {\n requestAnimationFrame(function () {\n addScrolling(_this.createElement, wrapper, _this.element, 'hscroll', _this.enableRtl);\n });\n }\n };\n MenuBase.prototype.initialize = function () {\n var wrapper = this.getWrapper();\n if (!wrapper) {\n wrapper = this.createElement('div', { className: 'e-' + this.getModuleName() + '-wrapper' });\n if (this.isMenu) {\n this.element.parentElement.insertBefore(wrapper, this.element);\n }\n else {\n document.body.appendChild(wrapper);\n }\n }\n if (this.cssClass) {\n addClass([wrapper], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n if (this.enableRtl) {\n wrapper.classList.add(RTL);\n }\n wrapper.appendChild(this.element);\n if (this.isMenu && this.hamburgerMode) {\n if (!this.target) {\n this.createHeaderContainer(wrapper);\n }\n }\n this.defaultOption = this.showItemOnClick;\n };\n MenuBase.prototype.renderItems = function () {\n if (!this.items.length) {\n var items = ListBase.createJsonFromElement(this.element, { fields: { child: 'items' } });\n this.setProperties({ items: items }, true);\n if (isBlazor() && !this.isMenu) {\n this.element = this.removeChildElement(this.element);\n }\n else {\n this.element.innerHTML = '';\n }\n }\n var ul = this.createItems(this.items);\n append(Array.prototype.slice.call(ul.children), this.element);\n this.element.classList.add('e-menu-parent');\n if (this.isMenu) {\n if (!this.hamburgerMode && this.element.classList.contains('e-vertical')) {\n this.setBlankIconStyle(this.element);\n }\n if (this.enableScrolling) {\n var wrapper = this.getWrapper();\n if (this.element.classList.contains('e-vertical')) {\n addScrolling(this.createElement, wrapper, this.element, 'vscroll', this.enableRtl);\n }\n else {\n addScrolling(this.createElement, wrapper, this.element, 'hscroll', this.enableRtl);\n }\n }\n }\n else {\n this.element.parentElement.setAttribute('role', 'dialog');\n this.element.parentElement.setAttribute('aria-label', 'context menu');\n }\n };\n MenuBase.prototype.wireEvents = function () {\n var wrapper = this.getWrapper();\n if (this.target) {\n var target = void 0;\n var targetElems = selectAll(this.target);\n for (var i = 0, len = targetElems.length; i < len; i++) {\n target = targetElems[i];\n if (this.isMenu) {\n EventHandler.add(target, 'click', this.menuHeaderClickHandler, this);\n }\n else {\n if (Browser.isIos) {\n new Touch(target, { tapHold: this.touchHandler.bind(this) });\n }\n else {\n EventHandler.add(target, 'contextmenu', this.cmenuHandler, this);\n }\n }\n }\n this.targetElement = target;\n if (!this.isMenu) {\n EventHandler.add(this.targetElement, 'scroll', this.scrollHandler, this);\n for (var _i = 0, _a = getScrollableParent(this.targetElement); _i < _a.length; _i++) {\n var parent_1 = _a[_i];\n EventHandler.add(parent_1, 'scroll', this.scrollHandler, this);\n }\n }\n }\n if (!Browser.isDevice) {\n this.delegateMoverHandler = this.moverHandler.bind(this);\n this.delegateMouseDownHandler = this.mouseDownHandler.bind(this);\n EventHandler.add(this.isMenu ? document : wrapper, 'mouseover', this.delegateMoverHandler, this);\n EventHandler.add(document, 'mousedown', this.delegateMouseDownHandler, this);\n }\n this.delegateClickHandler = this.clickHandler.bind(this);\n EventHandler.add(document, 'click', this.delegateClickHandler, this);\n this.wireKeyboardEvent(wrapper);\n this.rippleFn = rippleEffect(wrapper, { selector: '.' + ITEM });\n };\n MenuBase.prototype.wireKeyboardEvent = function (element) {\n var keyConfigs = {\n downarrow: DOWNARROW,\n uparrow: UPARROW,\n enter: ENTER,\n leftarrow: LEFTARROW,\n rightarrow: RIGHTARROW,\n escape: ESCAPE\n };\n if (this.isMenu) {\n keyConfigs.home = HOME;\n keyConfigs.end = END;\n keyConfigs.tab = TAB;\n }\n new KeyboardEvents(element, {\n keyAction: this.keyBoardHandler.bind(this),\n keyConfigs: keyConfigs\n });\n };\n MenuBase.prototype.mouseDownHandler = function (e) {\n if (closest(e.target, '.e-' + this.getModuleName() + '-wrapper') !== this.getWrapper()\n && (!closest(e.target, '.e-' + this.getModuleName() + '-popup'))) {\n this.closeMenu(this.isMenu ? null : this.navIdx.length, e);\n }\n };\n MenuBase.prototype.keyHandler = function (e) {\n if (e.keyCode === 38 || e.keyCode === 40) {\n if (e.target && (e.target.classList.contains('e-contextmenu') || e.target.classList.contains('e-menu-item'))) {\n e.preventDefault();\n }\n }\n };\n MenuBase.prototype.keyBoardHandler = function (e) {\n var actionName = '';\n var trgt = e.target;\n var actionNeeded = this.isMenu && !this.hamburgerMode && !this.element.classList.contains('e-vertical')\n && this.navIdx.length < 1;\n e.preventDefault();\n if (this.enableScrolling && e.keyCode === 13 && trgt.classList.contains('e-scroll-nav')) {\n this.removeLIStateByClass([FOCUSED, SELECTED], [closest(trgt, '.e-' + this.getModuleName() + '-wrapper')]);\n }\n if (actionNeeded) {\n switch (e.action) {\n case RIGHTARROW:\n actionName = RIGHTARROW;\n e.action = DOWNARROW;\n break;\n case LEFTARROW:\n actionName = LEFTARROW;\n e.action = UPARROW;\n break;\n case DOWNARROW:\n actionName = DOWNARROW;\n e.action = RIGHTARROW;\n break;\n case UPARROW:\n actionName = UPARROW;\n e.action = '';\n break;\n }\n }\n else if (this.enableRtl) {\n switch (e.action) {\n case LEFTARROW:\n actionNeeded = true;\n actionName = LEFTARROW;\n e.action = RIGHTARROW;\n break;\n case RIGHTARROW:\n actionNeeded = true;\n actionName = RIGHTARROW;\n e.action = LEFTARROW;\n break;\n }\n }\n switch (e.action) {\n case DOWNARROW:\n case UPARROW:\n case END:\n case HOME:\n case TAB:\n this.upDownKeyHandler(e);\n break;\n case RIGHTARROW:\n this.rightEnterKeyHandler(e);\n break;\n case LEFTARROW:\n this.leftEscKeyHandler(e);\n break;\n case ENTER:\n if (this.hamburgerMode && trgt.tagName === 'SPAN' && trgt.classList.contains('e-menu-icon')) {\n this.menuHeaderClickHandler(e);\n }\n else {\n this.rightEnterKeyHandler(e);\n }\n break;\n case ESCAPE:\n this.leftEscKeyHandler(e);\n break;\n }\n if (actionNeeded) {\n e.action = actionName;\n }\n };\n MenuBase.prototype.upDownKeyHandler = function (e) {\n var cul = this.getUlByNavIdx();\n var defaultIdx = (e.action === DOWNARROW || e.action === HOME || e.action === TAB) ? 0 : cul.childElementCount - 1;\n var fliIdx = defaultIdx;\n var fli = this.getLIByClass(cul, FOCUSED);\n if (fli) {\n if (e.action !== END && e.action !== HOME) {\n fliIdx = this.getIdx(cul, fli);\n }\n fli.classList.remove(FOCUSED);\n if (e.action !== END && e.action !== HOME) {\n if (e.action === DOWNARROW) {\n fliIdx++;\n }\n else {\n fliIdx--;\n }\n if (fliIdx === (e.action === DOWNARROW ? cul.childElementCount : -1)) {\n fliIdx = defaultIdx;\n }\n }\n }\n var cli = cul.children[fliIdx];\n fliIdx = this.isValidLI(cli, fliIdx, e.action);\n cul.children[fliIdx].classList.add(FOCUSED);\n cul.children[fliIdx].focus();\n };\n MenuBase.prototype.isValidLI = function (cli, index, action) {\n var cul = this.getUlByNavIdx();\n var defaultIdx = (action === DOWNARROW || action === HOME || action === TAB) ? 0 : cul.childElementCount - 1;\n if (cli.classList.contains(SEPARATOR) || cli.classList.contains(DISABLED) || cli.classList.contains(HIDE)) {\n if (action === DOWNARROW && index === cul.childElementCount - 1) {\n index = defaultIdx;\n }\n else if (action === UPARROW && index === 0) {\n index = defaultIdx;\n }\n else if ((action === DOWNARROW) || (action === RIGHTARROW)) {\n index++;\n }\n else if (action === 'tab' && cli.classList.contains(SEPARATOR)) {\n index++;\n }\n else {\n index--;\n }\n }\n cli = cul.children[index];\n if (cli && (cli.classList.contains(SEPARATOR) || cli.classList.contains(DISABLED) || cli.classList.contains(HIDE))) {\n index = this.isValidLI(cli, index, action);\n }\n return index;\n };\n MenuBase.prototype.getUlByNavIdx = function (navIdxLen) {\n var _this = this;\n if (navIdxLen === void 0) { navIdxLen = this.navIdx.length; }\n if (this.isMenu) {\n var popup = [this.getWrapper()].concat([].slice.call(selectAll('.' + POPUP)))[navIdxLen];\n var popups_1 = [];\n var allPopup = selectAll('.' + POPUP);\n allPopup.forEach(function (elem) {\n if (_this.element.id === elem.id.split('-')[2] || elem.id.split('-')[2] + '-' + elem.id.split('-')[3]) {\n popups_1.push(elem);\n }\n });\n popup = [this.getWrapper()].concat([].slice.call(popups_1))[navIdxLen];\n return isNullOrUndefined(popup) ? null : select('.e-menu-parent', popup);\n }\n else {\n return this.getWrapper().children[navIdxLen];\n }\n };\n MenuBase.prototype.rightEnterKeyHandler = function (e) {\n var eventArgs;\n var cul = this.getUlByNavIdx();\n var fli = this.getLIByClass(cul, FOCUSED);\n if (fli) {\n var fliIdx = this.getIdx(cul, fli);\n var navIdx = this.navIdx.concat(fliIdx);\n var item = this.getItem(navIdx);\n if (item.items.length) {\n this.navIdx.push(fliIdx);\n this.keyType = 'right';\n this.action = e.action;\n this.openMenu(fli, item, -1, -1, e);\n }\n else {\n if (e.action === ENTER) {\n if (this.isMenu && this.navIdx.length === 0) {\n this.removeLIStateByClass([SELECTED], [this.getWrapper()]);\n }\n else {\n fli.classList.remove(FOCUSED);\n }\n fli.classList.add(SELECTED);\n eventArgs = { element: fli, item: item, event: e };\n this.trigger('select', eventArgs);\n var aEle = fli.querySelector('.e-menu-url');\n if (item.url && aEle) {\n switch (aEle.getAttribute('target')) {\n case '_blank':\n window.open(item.url, '_blank');\n break;\n case '_parent':\n window.parent.location.href = item.url;\n break;\n default:\n window.location.href = item.url;\n }\n }\n this.closeMenu(null, e);\n var sli = this.getLIByClass(this.getUlByNavIdx(), SELECTED);\n if (sli) {\n sli.classList.add(FOCUSED);\n sli.focus();\n }\n }\n }\n }\n };\n MenuBase.prototype.leftEscKeyHandler = function (e) {\n if (this.navIdx.length) {\n this.keyType = 'left';\n this.closeMenu(this.navIdx.length, e);\n }\n else {\n if (e.action === ESCAPE) {\n this.closeMenu(null, e);\n }\n }\n };\n MenuBase.prototype.scrollHandler = function (e) {\n this.closeMenu(null, e);\n };\n MenuBase.prototype.touchHandler = function (e) {\n this.isTapHold = true;\n this.cmenuHandler(e.originalEvent);\n };\n MenuBase.prototype.cmenuHandler = function (e) {\n e.preventDefault();\n this.currentTarget = e.target;\n this.isCMenu = true;\n this.pageX = e.changedTouches ? e.changedTouches[0].pageX + 1 : e.pageX + 1;\n this.pageY = e.changedTouches ? e.changedTouches[0].pageY + 1 : e.pageY + 1;\n this.closeMenu(null, e);\n if (this.isCMenu) {\n if (this.canOpen(e.target)) {\n this.openMenu(null, null, this.pageY, this.pageX, e);\n }\n this.isCMenu = false;\n }\n };\n // eslint:disable-next-line:max-func-body-length\n MenuBase.prototype.closeMenu = function (ulIndex, e, isIterated) {\n var _this = this;\n if (ulIndex === void 0) { ulIndex = 0; }\n if (e === void 0) { e = null; }\n if (this.isMenuVisible()) {\n var sli = void 0;\n var item_1;\n var wrapper_1 = this.getWrapper();\n var beforeCloseArgs = void 0;\n var items_1;\n var popups = this.getPopups();\n var isClose = false;\n var cnt = this.isMenu ? popups.length + 1 : wrapper_1.childElementCount;\n var ul_1 = this.isMenu && cnt !== 1 ? select('.e-ul', popups[cnt - 2])\n : selectAll('.e-menu-parent', wrapper_1)[cnt - 1];\n if (this.isMenu && ul_1.classList.contains('e-menu')) {\n sli = this.getLIByClass(ul_1, SELECTED);\n if (sli) {\n sli.classList.remove(SELECTED);\n }\n isClose = true;\n }\n if (!isClose) {\n var liElem_1 = e && e.target && this.getLI(e.target);\n if (liElem_1) {\n this.cli = liElem_1;\n }\n else {\n this.cli = ul_1.children[0];\n }\n item_1 = this.navIdx.length ? this.getItem(this.navIdx) : null;\n items_1 = item_1 ? item_1.items : this.items;\n beforeCloseArgs = { element: ul_1, parentItem: item_1, items: items_1, event: e, cancel: false, isFocused: true };\n this.trigger('beforeClose', beforeCloseArgs, function (observedCloseArgs) {\n var popupEle;\n var closeArgs;\n var popupId = '';\n var popupObj;\n var isOpen = !observedCloseArgs.cancel;\n if (isOpen || _this.isCMenu) {\n if (_this.isMenu) {\n popupEle = closest(ul_1, '.' + POPUP);\n if (_this.hamburgerMode) {\n popupEle.parentElement.style.minHeight = '';\n closest(ul_1, '.e-menu-item').setAttribute('aria-expanded', 'false');\n }\n _this.unWireKeyboardEvent(popupEle);\n destroyScroll(getInstance(popupEle.children[0], VScroll), popupEle.children[0]);\n popupObj = getInstance(popupEle, Popup);\n popupObj.hide();\n popupId = popupEle.id;\n popupObj.destroy();\n detach(popupEle);\n }\n else {\n _this.toggleAnimation(ul_1, false);\n }\n closeArgs = { element: ul_1, parentItem: item_1, items: items_1 };\n _this.trigger('onClose', closeArgs);\n _this.navIdx.pop();\n if (_this.navIdx.length === 0 && e && e.type === 'keyup') {\n _this.showSubMenu = false;\n }\n if (!_this.isMenu) {\n EventHandler.remove(ul_1, 'keydown', _this.keyHandler);\n if (_this.keyType === 'right') {\n _this.keyType = '';\n }\n }\n }\n _this.updateReactTemplate();\n var trgtliId;\n var closedLi;\n var trgtLi;\n var trgtpopUp = _this.getWrapper() && _this.getUlByNavIdx();\n if (_this.isCMenu) {\n if (_this.canOpen(e.target)) {\n _this.openMenu(null, null, _this.pageY, _this.pageX, e);\n }\n _this.isCMenu = false;\n }\n if (_this.isMenu && trgtpopUp && popupId.length) {\n // eslint-disable-next-line\n trgtliId = new RegExp('(.*)-ej2menu-' + _this.element.id + '-popup').exec(popupId)[1];\n closedLi = trgtpopUp.querySelector('[id=\"' + trgtliId + '\"]');\n trgtLi = (liElem_1 && trgtpopUp.querySelector('[id=\"' + liElem_1.id + '\"]'));\n }\n else if (trgtpopUp) {\n closedLi = trgtpopUp.querySelector('.e-menu-item.e-selected');\n trgtLi = (liElem_1 && trgtpopUp.querySelector('[id=\"' + liElem_1.id + '\"]'));\n }\n var submenus = liElem_1 && liElem_1.querySelectorAll('.e-menu-item');\n if (isOpen && _this.hamburgerMode && ulIndex && !(submenus.length)) {\n _this.afterCloseMenu(e);\n }\n else if (isOpen && !_this.hamburgerMode && closedLi && !trgtLi && _this.keyType !== 'left' && (_this.navIdx.length || !_this.isMenu && _this.navIdx.length === 0)) {\n var ele = (e && (e.target.classList.contains('e-vscroll') || e.target.classList.contains('e-scroll-nav')))\n ? closest(e.target, '.e-menu-wrapper') : null;\n if (ele) {\n ele = ele.querySelector('.e-menu-item');\n if (_this.showItemOnClick || (ele && _this.getIndex(ele.id, true).length <= _this.navIdx.length)) {\n _this.closeMenu(_this.navIdx[_this.navIdx.length - 1], e, true);\n }\n }\n else {\n if (!(e && e.target.classList.contains('e-nav-arrow'))) {\n _this.closeMenu(_this.navIdx[_this.navIdx.length - 1], e);\n }\n }\n }\n else if (isOpen && !isIterated && !ulIndex && ((_this.hamburgerMode && _this.navIdx.length) ||\n _this.navIdx.length === 1 && liElem_1 && trgtpopUp !== liElem_1.parentElement)) {\n _this.closeMenu(null, e);\n }\n else if (isOpen && isNullOrUndefined(ulIndex) && _this.navIdx.length) {\n _this.closeMenu(null, e);\n }\n else if (isOpen && !_this.isMenu && !ulIndex && _this.navIdx.length === 0 && !_this.isMenusClosed && !_this.isCmenuHover) {\n _this.isMenusClosed = true;\n _this.closeMenu(0, e);\n }\n else if (isOpen && _this.isMenu && e && e.target &&\n _this.navIdx.length !== 0 && closest(e.target, '.e-menu-parent.e-control')) {\n _this.closeMenu(0, e);\n }\n else if (isOpen && !_this.isMenu && selectAll('.e-menu-parent', wrapper_1)[ulIndex - 1] && e.which === 3) {\n _this.closeMenu(null, e);\n }\n else {\n if (isOpen && (_this.keyType === 'right' || _this.keyType === 'click')) {\n _this.afterCloseMenu(e);\n }\n else {\n var cul = _this.getUlByNavIdx();\n var sli_1 = _this.getLIByClass(cul, SELECTED);\n if (sli_1) {\n sli_1.setAttribute('aria-expanded', 'false');\n sli_1.classList.remove(SELECTED);\n if (observedCloseArgs.isFocused && liElem_1 || _this.keyType === 'left') {\n sli_1.classList.add(FOCUSED);\n if (!e.target || !e.target.classList.contains('e-edit-template')) {\n sli_1.focus();\n }\n }\n }\n if (!isOpen && _this.hamburgerMode && liElem_1 && liElem_1.getAttribute('aria-expanded') === 'false' &&\n liElem_1.getAttribute('aria-haspopup') === 'true') {\n if (closest(liElem_1, '.e-menu-parent.e-control')) {\n _this.navIdx = [];\n }\n else {\n _this.navIdx.pop();\n }\n _this.navIdx.push(_this.cliIdx);\n var item_2 = _this.getItem(_this.navIdx);\n liElem_1.setAttribute('aria-expanded', 'true');\n _this.openMenu(liElem_1, item_2, -1, -1, e);\n }\n }\n if (_this.navIdx.length < 1) {\n if (_this.showSubMenuOn === 'Hover' || _this.showSubMenuOn === 'Click') {\n _this.showItemOnClick = _this.defaultOption;\n _this.showSubMenuOn = 'Auto';\n }\n }\n }\n _this.removeStateWrapper();\n });\n }\n }\n };\n MenuBase.prototype.updateReactTemplate = function () {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isReact && this.template && this.navIdx.length === 0) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var portals = this.portals.splice(0, this.items.length);\n this.clearTemplate(['template']);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.portals = portals;\n this.renderReactTemplates();\n }\n };\n MenuBase.prototype.getMenuItemModel = function (item, level) {\n if (isNullOrUndefined(item)) {\n return null;\n }\n if (isNullOrUndefined(level)) {\n level = 0;\n }\n var fields = this.getFields(level);\n return { text: item[fields.text], id: item[fields.id], items: item[fields.child], separator: item[fields.separator],\n iconCss: item[fields.iconCss], url: item[fields.url] };\n };\n MenuBase.prototype.getPopups = function () {\n var _this = this;\n var popups = [];\n [].slice.call(document.querySelectorAll('.' + POPUP)).forEach(function (elem) {\n if (!isNullOrUndefined(elem.querySelector('.' + ITEM)) && _this.getIndex(elem.querySelector('.' + ITEM).id, true).length) {\n popups.push(elem);\n }\n });\n return popups;\n };\n MenuBase.prototype.isMenuVisible = function () {\n return (this.navIdx.length > 0 || (this.element.classList.contains('e-contextmenu') && isVisible(this.element).valueOf()));\n };\n MenuBase.prototype.canOpen = function (target) {\n var canOpen = true;\n if (this.filter) {\n canOpen = false;\n var filter = this.filter.split(' ');\n for (var i = 0, len = filter.length; i < len; i++) {\n if (closest(target, '.' + filter[i])) {\n canOpen = true;\n break;\n }\n }\n }\n return canOpen;\n };\n MenuBase.prototype.openMenu = function (li, item, top, left, e, target) {\n var _this = this;\n if (top === void 0) { top = 0; }\n if (left === void 0) { left = 0; }\n if (e === void 0) { e = null; }\n if (target === void 0) { target = this.targetElement; }\n var wrapper = this.getWrapper();\n this.lItem = li;\n var elemId = this.element.id !== '' ? this.element.id : 'menu';\n this.isMenusClosed = false;\n if (isNullOrUndefined(top)) {\n top = -1;\n }\n if (isNullOrUndefined(left)) {\n left = -1;\n }\n if (li) {\n this.uList = this.createItems(item[this.getField('children', this.navIdx.length - 1)]);\n if (!this.isMenu && Browser.isDevice) {\n wrapper.lastChild.style.display = 'none';\n var data = {\n text: item[this.getField('text')].toString(), iconCss: ICONS + ' e-previous'\n };\n var hdata = new MenuItem(this.items[0], 'items', data, true);\n var hli = this.createItems([hdata]).children[0];\n hli.classList.add(HEADER);\n this.uList.insertBefore(hli, this.uList.children[0]);\n }\n if (this.isMenu) {\n this.popupWrapper = this.createElement('div', {\n className: 'e-' + this.getModuleName() + '-wrapper ' + POPUP, id: li.id + '-ej2menu-' + elemId + '-popup'\n });\n if (this.hamburgerMode) {\n top = li.offsetHeight;\n li.appendChild(this.popupWrapper);\n }\n else {\n document.body.appendChild(this.popupWrapper);\n }\n this.isNestedOrVertical = this.element.classList.contains('e-vertical') || this.navIdx.length !== 1;\n this.popupObj = this.generatePopup(this.popupWrapper, this.uList, li, this.isNestedOrVertical);\n if (this.template) {\n this.renderReactTemplates();\n }\n if (this.hamburgerMode) {\n this.calculateIndentSize(this.uList, li);\n }\n else {\n if (this.cssClass) {\n addClass([this.popupWrapper], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n this.popupObj.hide();\n }\n if (!this.hamburgerMode && !this.showItemOnClick && this.hoverDelay) {\n window.clearInterval(this.timer);\n this.timer = window.setTimeout(function () { _this.triggerBeforeOpen(li, _this.uList, item, e, 0, 0, 'menu'); }, this.hoverDelay);\n }\n else {\n this.triggerBeforeOpen(li, this.uList, item, e, 0, 0, 'menu');\n }\n }\n else {\n this.uList.style.zIndex = this.element.style.zIndex;\n wrapper.appendChild(this.uList);\n if (!this.showItemOnClick && this.hoverDelay) {\n window.clearInterval(this.timer);\n this.timer = window.setTimeout(function () { _this.triggerBeforeOpen(li, _this.uList, item, e, top, left, 'none'); }, this.hoverDelay);\n }\n else {\n this.triggerBeforeOpen(li, this.uList, item, e, top, left, 'none');\n }\n }\n }\n else {\n this.uList = this.element;\n this.uList.style.zIndex = getZindexPartial(target ? target : this.element).toString();\n if (isNullOrUndefined(e)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var ev = document.createEvent('MouseEvents');\n ev.initEvent('click', true, false);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var targetEvent = this.copyObject(ev, {});\n targetEvent.target = targetEvent.srcElement = target;\n targetEvent.currentTarget = target;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.triggerBeforeOpen(li, this.uList, item, targetEvent, top, left, 'none');\n }\n else {\n this.triggerBeforeOpen(li, this.uList, item, e, top, left, 'none');\n }\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n MenuBase.prototype.copyObject = function (source, destination) {\n for (var prop in source) {\n destination[\"\" + prop] = source[\"\" + prop];\n }\n return destination;\n };\n MenuBase.prototype.calculateIndentSize = function (ul, li) {\n var liStyle = getComputedStyle(li);\n var liIndent = parseInt(liStyle.textIndent, 10);\n if (this.navIdx.length < 2 && !li.classList.contains('e-blankicon')) {\n liIndent *= 2;\n }\n else {\n liIndent += (liIndent / 4);\n }\n ul.style.textIndent = liIndent + 'px';\n var blankIconElem = ul.querySelectorAll('.e-blankicon');\n if (blankIconElem && blankIconElem.length) {\n var menuIconElem = ul.querySelector('.e-menu-icon');\n var menuIconElemStyle = getComputedStyle(menuIconElem);\n var blankIconIndent = (parseInt(menuIconElemStyle.marginRight, 10) + menuIconElem.offsetWidth + liIndent);\n for (var i = 0; i < blankIconElem.length; i++) {\n blankIconElem[i].style.textIndent = blankIconIndent + 'px';\n }\n }\n };\n MenuBase.prototype.generatePopup = function (popupWrapper, ul, li, isNestedOrVertical) {\n var _this = this;\n var popupObj = new Popup(popupWrapper, {\n actionOnScroll: this.hamburgerMode ? 'none' : 'reposition',\n relateTo: li,\n collision: this.hamburgerMode ? { X: 'none', Y: 'none' } : { X: isNestedOrVertical ||\n this.enableRtl ? 'none' : 'flip', Y: 'fit' },\n position: (isNestedOrVertical && !this.hamburgerMode) ? { X: 'right', Y: 'top' } : { X: 'left', Y: 'bottom' },\n targetType: 'relative',\n enableRtl: this.enableRtl,\n content: ul,\n open: function () {\n var scrollEle = select('.e-menu-vscroll', popupObj.element);\n if (scrollEle) {\n scrollEle.style.height = 'inherit';\n scrollEle.style.maxHeight = '';\n }\n var ul = select('.e-ul', popupObj.element);\n popupObj.element.style.maxHeight = '';\n ul.focus();\n _this.triggerOpen(ul);\n }\n });\n return popupObj;\n };\n MenuBase.prototype.createHeaderContainer = function (wrapper) {\n wrapper = wrapper || this.getWrapper();\n var spanElem = this.createElement('span', { className: 'e-' + this.getModuleName() + '-header' });\n var tempTitle = (this.enableHtmlSanitizer) ? SanitizeHtmlHelper.sanitize(this.title) : this.title;\n var spanTitle = this.createElement('span', {\n className: 'e-' + this.getModuleName() + '-title', innerHTML: tempTitle\n });\n var spanIcon = this.createElement('span', {\n className: 'e-icons e-' + this.getModuleName() + '-icon', attrs: { 'tabindex': '0' }\n });\n spanElem.appendChild(spanTitle);\n spanElem.appendChild(spanIcon);\n wrapper.insertBefore(spanElem, this.element);\n };\n MenuBase.prototype.openHamburgerMenu = function (e) {\n if (this.hamburgerMode) {\n this.triggerBeforeOpen(null, this.element, null, e, 0, 0, 'hamburger');\n }\n };\n MenuBase.prototype.closeHamburgerMenu = function (e) {\n var _this = this;\n var beforeCloseArgs = { element: this.element, parentItem: null, event: e,\n items: this.items, cancel: false };\n this.trigger('beforeClose', beforeCloseArgs, function (observedHamburgerCloseArgs) {\n if (!observedHamburgerCloseArgs.cancel) {\n _this.closeMenu(null, e);\n _this.element.classList.add('e-hide-menu');\n _this.trigger('onClose', { element: _this.element, parentItem: null, items: _this.items });\n }\n });\n };\n MenuBase.prototype.callFit = function (element, x, y, top, left) {\n return fit(element, null, { X: x, Y: y }, { top: top, left: left });\n };\n MenuBase.prototype.triggerBeforeOpen = function (li, ul, item, e, top, left, type) {\n var _this = this;\n var items = li ? item[this.getField('children', this.navIdx.length - 1)] : this.items;\n var eventArgs = {\n element: ul, items: items, parentItem: item, event: e, cancel: false, top: top, left: left, showSubMenuOn: 'Auto'\n };\n var menuType = type;\n this.trigger('beforeOpen', eventArgs, function (observedOpenArgs) {\n switch (menuType) {\n case 'menu':\n if (!_this.hamburgerMode) {\n if (observedOpenArgs.showSubMenuOn !== 'Auto') {\n _this.showItemOnClick = !_this.defaultOption;\n _this.showSubMenuOn = observedOpenArgs.showSubMenuOn;\n }\n _this.top = observedOpenArgs.top;\n _this.left = observedOpenArgs.left;\n }\n _this.popupWrapper.style.display = 'block';\n if (!_this.hamburgerMode) {\n _this.popupWrapper.style.maxHeight = _this.popupWrapper.getBoundingClientRect().height + 'px';\n if (_this.enableScrolling) {\n addScrolling(_this.createElement, _this.popupWrapper, _this.uList, 'vscroll', _this.enableRtl);\n }\n _this.checkScrollOffset(e);\n }\n if (!_this.hamburgerMode && !_this.left && !_this.top) {\n _this.popupObj.refreshPosition(_this.lItem, true);\n _this.left = parseInt(_this.popupWrapper.style.left, 10);\n _this.top = parseInt(_this.popupWrapper.style.top, 10);\n if (_this.enableRtl) {\n _this.left =\n _this.isNestedOrVertical ? _this.left - _this.popupWrapper.offsetWidth - _this.lItem.parentElement.offsetWidth + 2\n : _this.left - _this.popupWrapper.offsetWidth + _this.lItem.offsetWidth;\n }\n // eslint-disable-next-line\n if (_this.template && (_this.isReact || _this.isAngular)) {\n requestAnimationFrame(function () {\n _this.collision();\n _this.popupWrapper.style.display = '';\n });\n }\n else {\n _this.collision();\n _this.popupWrapper.style.display = '';\n }\n }\n else {\n _this.popupObj.collision = { X: 'none', Y: 'none' };\n _this.popupWrapper.style.display = '';\n }\n break;\n case 'none':\n _this.top = observedOpenArgs.top;\n _this.left = observedOpenArgs.left;\n break;\n case 'hamburger':\n if (!observedOpenArgs.cancel) {\n _this.element.classList.remove('e-hide-menu');\n _this.triggerOpen(_this.element);\n }\n break;\n }\n if (menuType !== 'hamburger') {\n if (observedOpenArgs.cancel) {\n if (_this.isMenu) {\n _this.popupObj.destroy();\n detach(_this.popupWrapper);\n }\n else if (ul.className.indexOf('e-ul') > -1) {\n detach(ul);\n }\n _this.navIdx.pop();\n }\n else {\n if (_this.isMenu) {\n if (_this.hamburgerMode) {\n _this.popupWrapper.style.top = _this.top + 'px';\n _this.popupWrapper.style.left = 0 + 'px';\n _this.toggleAnimation(_this.popupWrapper);\n }\n else {\n _this.setBlankIconStyle(_this.popupWrapper);\n _this.wireKeyboardEvent(_this.popupWrapper);\n rippleEffect(_this.popupWrapper, { selector: '.' + ITEM });\n _this.popupWrapper.style.left = _this.left + 'px';\n _this.popupWrapper.style.top = _this.top + 'px';\n var animationOptions = _this.animationSettings.effect !== 'None' ? {\n name: _this.animationSettings.effect, duration: _this.animationSettings.duration,\n timingFunction: _this.animationSettings.easing\n } : null;\n _this.popupObj.show(animationOptions, _this.lItem);\n }\n }\n else {\n _this.setBlankIconStyle(_this.uList);\n _this.setPosition(_this.lItem, _this.uList, _this.top, _this.left);\n _this.toggleAnimation(_this.uList);\n }\n }\n }\n if (_this.keyType === 'right') {\n var cul = _this.getUlByNavIdx();\n li.classList.remove(FOCUSED);\n if (_this.isMenu && _this.navIdx.length === 1) {\n _this.removeLIStateByClass([SELECTED], [_this.getWrapper()]);\n }\n li.classList.add(SELECTED);\n if (_this.action === ENTER) {\n var eventArgs_1 = { element: li, item: item, event: e };\n _this.trigger('select', eventArgs_1);\n }\n li.focus();\n cul = _this.getUlByNavIdx();\n if (cul) {\n var index = _this.isValidLI(cul.children[0], 0, _this.action);\n cul.children[index].classList.add(FOCUSED);\n cul.children[index].focus();\n }\n }\n });\n };\n MenuBase.prototype.collision = function () {\n var collide;\n collide = isCollide(this.popupWrapper, null, this.left, this.top);\n if ((this.isNestedOrVertical || this.enableRtl) && (collide.indexOf('right') > -1\n || collide.indexOf('left') > -1)) {\n this.popupObj.collision.X = 'none';\n var offWidth = closest(this.lItem, '.e-' + this.getModuleName() + '-wrapper').offsetWidth;\n this.left =\n this.enableRtl ? calculatePosition(this.lItem, this.isNestedOrVertical ? 'right' : 'left', 'top').left\n : this.left - this.popupWrapper.offsetWidth - offWidth + 2;\n }\n collide = isCollide(this.popupWrapper, null, this.left, this.top);\n if (collide.indexOf('left') > -1 || collide.indexOf('right') > -1) {\n this.left = this.callFit(this.popupWrapper, true, false, this.top, this.left).left;\n }\n this.popupWrapper.style.left = this.left + 'px';\n };\n MenuBase.prototype.setBlankIconStyle = function (menu) {\n var blankIconList = [].slice.call(menu.getElementsByClassName('e-blankicon'));\n if (!blankIconList.length) {\n return;\n }\n var iconLi = menu.querySelector('.e-menu-item:not(.e-blankicon):not(.e-separator)');\n if (!iconLi) {\n return;\n }\n var icon = iconLi.querySelector('.e-menu-icon');\n if (!icon) {\n return;\n }\n var cssProp = this.enableRtl ? { padding: 'paddingRight', margin: 'marginLeft' } :\n { padding: 'paddingLeft', margin: 'marginRight' };\n var iconCssProps = getComputedStyle(icon);\n var iconSize = parseInt(iconCssProps.fontSize, 10);\n if (!!parseInt(iconCssProps.width, 10) && parseInt(iconCssProps.width, 10) > iconSize) {\n iconSize = parseInt(iconCssProps.width, 10);\n }\n // eslint:disable\n var size = iconSize + parseInt(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n iconCssProps[cssProp.margin], 10) + parseInt(getComputedStyle(iconLi)[cssProp.padding], 10) + \"px\";\n blankIconList.forEach(function (li) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n li.style[cssProp.padding] = size;\n });\n // eslint:enable\n };\n MenuBase.prototype.checkScrollOffset = function (e) {\n var wrapper = this.getWrapper();\n if (wrapper.children[0].classList.contains('e-menu-hscroll') && this.navIdx.length === 1) {\n var trgt = isNullOrUndefined(e) ? this.element : closest(e.target, '.' + ITEM);\n var offsetEle = select('.e-hscroll-bar', wrapper);\n if (offsetEle.scrollLeft > trgt.offsetLeft) {\n offsetEle.scrollLeft -= (offsetEle.scrollLeft - trgt.offsetLeft);\n }\n var offsetLeft = offsetEle.scrollLeft + offsetEle.offsetWidth;\n var offsetRight = trgt.offsetLeft + trgt.offsetWidth;\n if (offsetLeft < offsetRight) {\n offsetEle.scrollLeft += (offsetRight - offsetLeft);\n }\n }\n };\n MenuBase.prototype.setPosition = function (li, ul, top, left) {\n var px = 'px';\n this.toggleVisiblity(ul);\n if (ul === this.element || (left > -1 && top > -1)) {\n var collide = isCollide(ul, null, left, top);\n if (collide.indexOf('right') > -1) {\n left = left - ul.offsetWidth;\n }\n if (collide.indexOf('bottom') > -1) {\n var offset = this.callFit(ul, false, true, top, left);\n top = offset.top - 20;\n if (top < 0) {\n var newTop = (pageYOffset + document.documentElement.clientHeight) - ul.getBoundingClientRect().height;\n if (newTop > -1) {\n top = newTop;\n }\n }\n }\n collide = isCollide(ul, null, left, top);\n if (collide.indexOf('left') > -1) {\n var offset = this.callFit(ul, true, false, top, left);\n left = offset.left;\n }\n }\n else {\n if (Browser.isDevice) {\n top = Number(this.element.style.top.replace(px, ''));\n left = Number(this.element.style.left.replace(px, ''));\n }\n else {\n var x = this.enableRtl ? 'left' : 'right';\n var offset = calculatePosition(li, x, 'top');\n top = offset.top;\n left = offset.left;\n var collide = isCollide(ul, null, this.enableRtl ? left - ul.offsetWidth : left, top);\n var xCollision = collide.indexOf('left') > -1 || collide.indexOf('right') > -1;\n if (xCollision) {\n offset = calculatePosition(li, this.enableRtl ? 'right' : 'left', 'top');\n left = offset.left;\n }\n if (this.enableRtl || xCollision) {\n left = (this.enableRtl && xCollision) ? left : left - ul.offsetWidth;\n }\n if (collide.indexOf('bottom') > -1) {\n offset = this.callFit(ul, false, true, top, left);\n top = offset.top;\n }\n }\n }\n this.toggleVisiblity(ul, false);\n ul.style.top = top + px;\n ul.style.left = left + px;\n };\n MenuBase.prototype.toggleVisiblity = function (ul, isVisible) {\n if (isVisible === void 0) { isVisible = true; }\n ul.style.visibility = isVisible ? 'hidden' : '';\n ul.style.display = isVisible ? 'block' : 'none';\n };\n MenuBase.prototype.createItems = function (items) {\n var _this = this;\n var level = this.navIdx ? this.navIdx.length : 0;\n var fields = this.getFields(level);\n var showIcon = this.hasField(items, this.getField('iconCss', level));\n var listBaseOptions = {\n showIcon: showIcon,\n moduleName: 'menu',\n fields: fields,\n template: this.template,\n itemNavigable: true,\n itemCreating: function (args) {\n if (!args.curData[args.fields[fields.id]]) {\n args.curData[args.fields[fields.id]] = getUniqueID('menuitem');\n }\n if (isNullOrUndefined(args.curData.htmlAttributes)) {\n args.curData.htmlAttributes = {};\n }\n if (Browser.isIE) {\n args.curData.htmlAttributes.role = 'menuitem';\n args.curData.htmlAttributes.tabindex = '-1';\n }\n else {\n Object.assign(args.curData.htmlAttributes, { role: 'menuitem', tabindex: '-1' });\n }\n if (_this.isMenu && !args.curData[_this.getField('separator', level)]) {\n args.curData.htmlAttributes['aria-label'] = args.curData[args.fields.text] ?\n args.curData[args.fields.text] : args.curData[args.fields.id];\n }\n if (args.curData[args.fields[fields.iconCss]] === '') {\n args.curData[args.fields[fields.iconCss]] = null;\n }\n },\n itemCreated: function (args) {\n if (args.curData[_this.getField('separator', level)]) {\n args.item.classList.add(SEPARATOR);\n args.item.setAttribute('role', 'separator');\n }\n if (showIcon && !args.curData[args.fields.iconCss]\n && !args.curData[_this.getField('separator', level)]) {\n args.item.classList.add('e-blankicon');\n }\n if (args.curData[args.fields.child]\n && args.curData[args.fields.child].length) {\n var span = _this.createElement('span', { className: ICONS + ' ' + CARET });\n args.item.appendChild(span);\n args.item.setAttribute('aria-haspopup', 'true');\n args.item.setAttribute('aria-expanded', 'false');\n args.item.classList.add('e-menu-caret-icon');\n }\n if (_this.isMenu && _this.template) {\n args.item.setAttribute('id', args.curData[args.fields.id].toString());\n args.item.removeAttribute('data-uid');\n if (args.item.classList.contains('e-level-1')) {\n args.item.classList.remove('e-level-1');\n }\n if (args.item.classList.contains('e-has-child')) {\n args.item.classList.remove('e-has-child');\n }\n args.item.removeAttribute('aria-level');\n }\n var eventArgs = { item: args.curData, element: args.item };\n _this.trigger('beforeItemRender', eventArgs);\n }\n };\n this.setProperties({ 'items': this.items }, true);\n if (this.isMenu) {\n listBaseOptions.templateID = this.element.id + TEMPLATE_PROPERTY;\n }\n var ul = ListBase.createList(this.createElement, items, listBaseOptions, !this.template, this);\n ul.setAttribute('tabindex', '0');\n if (this.isMenu) {\n ul.setAttribute('role', 'menu');\n }\n else {\n ul.setAttribute('role', 'menubar');\n }\n return ul;\n };\n MenuBase.prototype.moverHandler = function (e) {\n var trgt = e.target;\n this.liTrgt = trgt;\n if (!this.isMenu)\n this.isCmenuHover = true;\n var cli = this.getLI(trgt);\n var wrapper = cli ? closest(cli, '.e-' + this.getModuleName() + '-wrapper') : this.getWrapper();\n var hdrWrapper = this.getWrapper();\n var regex = new RegExp('-ej2menu-(.*)-popup');\n var ulId;\n var isDifferentElem = false;\n if (!wrapper) {\n return;\n }\n if (wrapper.id !== '') {\n ulId = regex.exec(wrapper.id)[1];\n }\n else {\n ulId = wrapper.querySelector('ul').id;\n }\n if (ulId !== this.element.id) {\n this.removeLIStateByClass([FOCUSED, SELECTED], [this.getWrapper()]);\n if (this.navIdx.length) {\n isDifferentElem = true;\n }\n else {\n return;\n }\n }\n if (cli && closest(cli, '.e-' + this.getModuleName() + '-wrapper') && !isDifferentElem) {\n this.removeLIStateByClass([FOCUSED], this.isMenu ? [wrapper].concat(this.getPopups()) : [wrapper]);\n this.removeLIStateByClass([FOCUSED], this.isMenu ? [hdrWrapper].concat(this.getPopups()) : [hdrWrapper]);\n cli.classList.add(FOCUSED);\n if (!this.showItemOnClick) {\n this.clickHandler(e);\n }\n }\n else if (this.isMenu && this.showItemOnClick && !isDifferentElem) {\n this.removeLIStateByClass([FOCUSED], [wrapper].concat(this.getPopups()));\n }\n if (this.isMenu) {\n if (!this.showItemOnClick && (trgt.parentElement !== wrapper && !closest(trgt, '.e-' + this.getModuleName() + '-popup'))\n && (!cli || (cli && !this.getIndex(cli.id, true).length)) && this.showSubMenuOn !== 'Hover') {\n this.removeLIStateByClass([FOCUSED], [wrapper]);\n if (this.navIdx.length) {\n this.isClosed = true;\n this.closeMenu(null, e);\n }\n }\n else if (isDifferentElem && !this.showItemOnClick) {\n if (this.navIdx.length) {\n this.isClosed = true;\n this.closeMenu(null, e);\n }\n }\n if (!this.isClosed) {\n this.removeStateWrapper();\n }\n this.isClosed = false;\n }\n if (!this.isMenu)\n this.isCmenuHover = false;\n };\n MenuBase.prototype.removeStateWrapper = function () {\n if (this.liTrgt) {\n var wrapper = closest(this.liTrgt, '.e-menu-vscroll');\n if (this.liTrgt.tagName === 'DIV' && wrapper) {\n this.removeLIStateByClass([FOCUSED, SELECTED], [wrapper]);\n }\n }\n };\n MenuBase.prototype.removeLIStateByClass = function (classList, element) {\n var li;\n var _loop_1 = function (i) {\n classList.forEach(function (className) {\n li = select('.' + className, element[i]);\n if (li) {\n li.classList.remove(className);\n }\n });\n };\n for (var i = 0; i < element.length; i++) {\n _loop_1(i);\n }\n };\n MenuBase.prototype.getField = function (propName, level) {\n if (level === void 0) { level = 0; }\n var fieldName = this.fields[\"\" + propName];\n return typeof fieldName === 'string' ? fieldName :\n (!fieldName[level] ? fieldName[fieldName.length - 1].toString()\n : fieldName[level].toString());\n };\n MenuBase.prototype.getFields = function (level) {\n if (level === void 0) { level = 0; }\n return {\n id: this.getField('itemId', level),\n iconCss: this.getField('iconCss', level),\n text: this.getField('text', level),\n url: this.getField('url', level),\n child: this.getField('children', level),\n separator: this.getField('separator', level)\n };\n };\n MenuBase.prototype.hasField = function (items, field) {\n for (var i = 0, len = items.length; i < len; i++) {\n if (items[i][\"\" + field]) {\n return true;\n }\n }\n return false;\n };\n MenuBase.prototype.menuHeaderClickHandler = function (e) {\n var menuWrapper = closest(e.target, '.e-menu-wrapper');\n if (menuWrapper && menuWrapper.querySelector('ul.e-menu-parent').id !== this.element.id) {\n return;\n }\n if (this.element.className.indexOf('e-hide-menu') > -1) {\n this.openHamburgerMenu(e);\n }\n else {\n this.closeHamburgerMenu(e);\n }\n };\n MenuBase.prototype.clickHandler = function (e) {\n this.isTapHold = this.isTapHold ? false : this.isTapHold;\n var wrapper = this.getWrapper();\n var trgt = e.target;\n var cli = this.cli = this.getLI(trgt);\n var regex = new RegExp('-ej2menu-(.*)-popup');\n var cliWrapper = cli ? closest(cli, '.e-' + this.getModuleName() + '-wrapper') : null;\n var isInstLI = cli && cliWrapper && (this.isMenu ? this.getIndex(cli.id, true).length > 0\n : wrapper.firstElementChild.id === cliWrapper.firstElementChild.id);\n if (Browser.isDevice && this.isMenu) {\n this.removeLIStateByClass([FOCUSED], [wrapper].concat(this.getPopups()));\n this.mouseDownHandler(e);\n }\n if (cli && cliWrapper && this.isMenu) {\n var cliWrapperId = cliWrapper.id ? regex.exec(cliWrapper.id)[1] : cliWrapper.querySelector('.e-menu-parent').id;\n if (this.element.id !== cliWrapperId) {\n return;\n }\n }\n if (isInstLI && e.type === 'click' && !cli.classList.contains(HEADER)) {\n this.setLISelected(cli);\n var navIdx = this.getIndex(cli.id, true);\n var item = this.getItem(navIdx);\n var eventArgs = { element: cli, item: item, event: e };\n this.trigger('select', eventArgs);\n }\n if (isInstLI && (e.type === 'mouseover' || Browser.isDevice || this.showItemOnClick)) {\n var ul = void 0;\n if (cli.classList.contains(HEADER)) {\n ul = wrapper.children[this.navIdx.length - 1];\n this.toggleAnimation(ul);\n var sli = this.getLIByClass(ul, SELECTED);\n if (sli) {\n sli.classList.remove(SELECTED);\n }\n detach(cli.parentNode);\n this.navIdx.pop();\n }\n else {\n if (!cli.classList.contains(SEPARATOR)) {\n this.showSubMenu = true;\n var cul = cli.parentNode;\n if (isNullOrUndefined(cul)) {\n return;\n }\n this.cliIdx = this.getIdx(cul, cli);\n if (this.isMenu || !Browser.isDevice) {\n var culIdx = this.isMenu ? Array.prototype.indexOf.call([wrapper].concat(this.getPopups()), closest(cul, '.' + 'e-' + this.getModuleName() + '-wrapper'))\n : this.getIdx(wrapper, cul);\n if (this.navIdx[culIdx] === this.cliIdx) {\n this.showSubMenu = false;\n }\n if (culIdx !== this.navIdx.length && (e.type !== 'mouseover' || this.showSubMenu)) {\n var sli = this.getLIByClass(cul, SELECTED);\n if (sli) {\n sli.classList.remove(SELECTED);\n }\n this.isClosed = true;\n this.keyType = 'click';\n if (this.showItemOnClick) {\n this.setLISelected(cli);\n if (!this.isMenu)\n this.isCmenuHover = true;\n }\n this.closeMenu(culIdx + 1, e);\n if (this.showItemOnClick) {\n this.setLISelected(cli);\n if (!this.isMenu)\n this.isCmenuHover = false;\n }\n }\n }\n if (!this.isClosed) {\n this.afterCloseMenu(e);\n }\n this.isClosed = false;\n }\n }\n }\n else {\n if (this.isMenu && trgt.tagName === 'DIV' && this.navIdx.length && closest(trgt, '.e-menu-vscroll')) {\n var popupEle = closest(trgt, '.' + POPUP);\n var cIdx = Array.prototype.indexOf.call(this.getPopups(), popupEle) + 1;\n if (cIdx < this.navIdx.length) {\n this.closeMenu(cIdx + 1, e);\n if (popupEle) {\n this.removeLIStateByClass([FOCUSED, SELECTED], [popupEle]);\n }\n }\n }\n else if (this.isMenu && this.hamburgerMode && trgt.tagName === 'SPAN'\n && trgt.classList.contains('e-menu-icon')) {\n this.menuHeaderClickHandler(e);\n }\n else {\n if (trgt.tagName !== 'UL' || (this.isMenu ? trgt.parentElement.classList.contains('e-menu-wrapper') &&\n !this.getIndex(trgt.querySelector('.' + ITEM).id, true).length : trgt.parentElement !== wrapper)) {\n if (!cli) {\n this.removeLIStateByClass([SELECTED], [wrapper]);\n }\n if (!cli || !cli.querySelector('.' + CARET)) {\n this.closeMenu(null, e);\n }\n }\n }\n }\n };\n MenuBase.prototype.afterCloseMenu = function (e) {\n if (isNullOrUndefined(e)) {\n return;\n }\n var isHeader;\n if (this.showSubMenu) {\n if (this.showItemOnClick && this.navIdx.length === 0) {\n isHeader = closest(e.target, '.e-menu-parent.e-control');\n }\n else {\n isHeader = closest(this.element, '.e-menu-parent.e-control');\n }\n var idx = this.navIdx.concat(this.cliIdx);\n var item = this.getItem(idx);\n if (item && item[this.getField('children', idx.length - 1)] &&\n item[this.getField('children', idx.length - 1)].length) {\n if (e.type === 'mouseover' || (Browser.isDevice && this.isMenu)) {\n this.setLISelected(this.cli);\n }\n if ((!this.hamburgerMode && isHeader) || (this.hamburgerMode && this.cli.getAttribute('aria-expanded') === 'false')) {\n this.cli.setAttribute('aria-expanded', 'true');\n this.navIdx.push(this.cliIdx);\n this.openMenu(this.cli, item, null, null, e);\n }\n }\n else {\n if (e.type !== 'mouseover') {\n this.closeMenu(null, e);\n }\n }\n if (!isHeader) {\n var cul = this.getUlByNavIdx();\n var sli = this.getLIByClass(cul, SELECTED);\n if (sli) {\n sli.setAttribute('aria-expanded', 'false');\n sli.classList.remove(SELECTED);\n }\n }\n }\n this.keyType = '';\n };\n MenuBase.prototype.setLISelected = function (li) {\n var sli = this.getLIByClass(li.parentElement, SELECTED);\n if (sli) {\n sli.classList.remove(SELECTED);\n }\n if (!this.isMenu) {\n li.classList.remove(FOCUSED);\n }\n li.classList.add(SELECTED);\n };\n MenuBase.prototype.getLIByClass = function (ul, classname) {\n if (ul) {\n for (var i = 0, len = ul.children.length; i < len; i++) {\n if (ul.children[i].classList.contains(classname)) {\n return ul.children[i];\n }\n }\n }\n return null;\n };\n /**\n * This method is used to get the index of the menu item in the Menu based on the argument.\n *\n * @param {MenuItem | string} item - item be passed to get the index | id to be passed to get the item index.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.getItemIndex = function (item, isUniqueId) {\n var idx;\n if (typeof item === 'string') {\n idx = item;\n }\n else {\n idx = item.id;\n }\n var isText = (isUniqueId === false) ? false : true;\n var navIdx = this.getIndex(idx, isText);\n return navIdx;\n };\n /**\n * This method is used to set the menu item in the Menu based on the argument.\n *\n * @param {MenuItem} item - item need to be updated.\n * @param {string} id - id / text to be passed to update the item.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.setItem = function (item, id, isUniqueId) {\n var idx;\n if (isUniqueId) {\n idx = id ? id : item.id;\n }\n else {\n idx = id ? id : item.text;\n }\n var navIdx = this.getIndex(idx, isUniqueId);\n var newItem = this.getItem(navIdx);\n Object.assign(newItem, item);\n };\n MenuBase.prototype.getItem = function (navIdx) {\n navIdx = navIdx.slice();\n var idx = navIdx.pop();\n var items = this.getItems(navIdx);\n return items[idx];\n };\n MenuBase.prototype.getItems = function (navIdx) {\n var items = this.items;\n for (var i = 0; i < navIdx.length; i++) {\n items = items[navIdx[i]][this.getField('children', i)];\n }\n return items;\n };\n MenuBase.prototype.setItems = function (newItems, navIdx) {\n var items = this.getItems(navIdx);\n items.splice(0, items.length);\n for (var i = 0; i < newItems.length; i++) {\n items.splice(i, 0, newItems[i]);\n }\n };\n MenuBase.prototype.getIdx = function (ul, li, skipHdr) {\n if (skipHdr === void 0) { skipHdr = true; }\n var idx = Array.prototype.indexOf.call(ul.children, li);\n if (skipHdr && ul.children[0].classList.contains(HEADER)) {\n idx--;\n }\n return idx;\n };\n MenuBase.prototype.getLI = function (elem) {\n if (elem.tagName === 'LI' && elem.classList.contains('e-menu-item')) {\n return elem;\n }\n return closest(elem, 'li.e-menu-item');\n };\n MenuBase.prototype.updateItemsByNavIdx = function () {\n var items = this.items;\n var count = 0;\n for (var index = 0; index < this.navIdx.length; index++) {\n items = items[index].items;\n if (!items) {\n break;\n }\n count++;\n var ul = this.getUlByNavIdx(count);\n if (!ul) {\n break;\n }\n this.updateItem(ul, items);\n }\n };\n MenuBase.prototype.removeChildElement = function (elem) {\n while (elem.firstElementChild) {\n elem.removeChild(elem.firstElementChild);\n }\n return elem;\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @private\n * @param {MenuBaseModel} newProp - Specifies the new properties\n * @param {MenuBaseModel} oldProp - Specifies the old properties\n * @returns {void}\n */\n MenuBase.prototype.onPropertyChanged = function (newProp, oldProp) {\n var _this = this;\n var wrapper = this.getWrapper();\n var _loop_2 = function (prop) {\n switch (prop) {\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([wrapper], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([wrapper], newProp.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n break;\n case 'enableRtl':\n if (this_1.enableRtl) {\n wrapper.classList.add(RTL);\n }\n else {\n wrapper.classList.remove(RTL);\n }\n break;\n case 'showItemOnClick':\n this_1.unWireEvents();\n this_1.showItemOnClick = newProp.showItemOnClick;\n this_1.wireEvents();\n break;\n case 'enableScrolling':\n if (newProp.enableScrolling) {\n var ul_2;\n if (this_1.element.classList.contains('e-vertical')) {\n addScrolling(this_1.createElement, wrapper, this_1.element, 'vscroll', this_1.enableRtl);\n }\n else {\n addScrolling(this_1.createElement, wrapper, this_1.element, 'hscroll', this_1.enableRtl);\n }\n this_1.getPopups().forEach(function (wrapper) {\n ul_2 = select('.e-ul', wrapper);\n addScrolling(_this.createElement, wrapper, ul_2, 'vscroll', _this.enableRtl);\n });\n }\n else {\n var ul_3 = wrapper.children[0];\n if (this_1.element.classList.contains('e-vertical')) {\n destroyScroll(getInstance(ul_3, VScroll), ul_3);\n }\n else {\n destroyScroll(getInstance(ul_3, HScroll), ul_3);\n }\n wrapper.style.overflow = '';\n wrapper.appendChild(this_1.element);\n this_1.getPopups().forEach(function (wrapper) {\n ul_3 = wrapper.children[0];\n destroyScroll(getInstance(ul_3, VScroll), ul_3);\n wrapper.style.overflow = '';\n });\n }\n break;\n case 'items': {\n var idx = void 0;\n var navIdx = void 0;\n var item = void 0;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this_1.isReact && this_1.template) {\n this_1.clearTemplate(['template']);\n }\n if (!Object.keys(oldProp.items).length) {\n this_1.updateItem(this_1.element, this_1.items);\n if (this_1.enableScrolling && this_1.element.parentElement.classList.contains('e-custom-scroll')) {\n if (this_1.element.classList.contains('e-vertical')) {\n addScrolling(this_1.createElement, wrapper, this_1.element, 'vscroll', this_1.enableRtl);\n }\n else {\n addScrolling(this_1.createElement, wrapper, this_1.element, 'hscroll', this_1.enableRtl);\n }\n }\n if (!this_1.hamburgerMode) {\n for (var i = 1, count = wrapper.childElementCount; i < count; i++) {\n detach(wrapper.lastElementChild);\n }\n }\n this_1.navIdx = [];\n }\n else {\n var keys = Object.keys(newProp.items);\n for (var i = 0; i < keys.length; i++) {\n navIdx = this_1.getChangedItemIndex(newProp, [], Number(keys[i]));\n if (navIdx.length <= this_1.getWrapper().children.length) {\n idx = navIdx.pop();\n item = this_1.getItems(navIdx);\n this_1.insertAfter([item[idx]], item[idx].text);\n this_1.removeItem(item, navIdx, idx);\n this_1.setItems(item, navIdx);\n }\n navIdx.length = 0;\n }\n }\n break;\n }\n }\n };\n var this_1 = this;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n _loop_2(prop);\n }\n };\n MenuBase.prototype.updateItem = function (ul, items) {\n if (isBlazor() && !this.isMenu) {\n ul = this.removeChildElement(ul);\n }\n else {\n if (this.enableScrolling) {\n var wrapper1 = this.getWrapper();\n var ul1 = wrapper1.children[0];\n if (this.element.classList.contains('e-vertical')) {\n destroyScroll(getInstance(ul1, VScroll), ul1);\n }\n else {\n destroyScroll(getInstance(ul1, HScroll), ul1);\n }\n }\n ul.innerHTML = '';\n }\n var lis = [].slice.call(this.createItems(items).children);\n lis.forEach(function (li) {\n ul.appendChild(li);\n });\n };\n MenuBase.prototype.getChangedItemIndex = function (newProp, index, idx) {\n index.push(idx);\n var key = Object.keys(newProp.items[idx]).pop();\n if (key === 'items') {\n var item = newProp.items[idx];\n var popStr = Object.keys(item.items).pop();\n if (popStr) {\n this.getChangedItemIndex(item, index, Number(popStr));\n }\n }\n else {\n if (key === 'isParentArray' && index.length > 1) {\n index.pop();\n }\n }\n return index;\n };\n MenuBase.prototype.removeItem = function (item, navIdx, idx) {\n item.splice(idx, 1);\n var uls = this.getWrapper().children;\n if (navIdx.length < uls.length) {\n detach(uls[navIdx.length].children[idx]);\n }\n };\n /**\n * Used to unwire the bind events.\n *\n * @private\n * @param {string} targetSelctor - Specifies the target selector\n * @returns {void}\n */\n MenuBase.prototype.unWireEvents = function (targetSelctor) {\n if (targetSelctor === void 0) { targetSelctor = this.target; }\n var wrapper = this.getWrapper();\n if (targetSelctor) {\n var target = void 0;\n var touchModule = void 0;\n var targetElems = selectAll(targetSelctor);\n for (var i = 0, len = targetElems.length; i < len; i++) {\n target = targetElems[i];\n if (this.isMenu) {\n EventHandler.remove(target, 'click', this.menuHeaderClickHandler);\n }\n else {\n if (Browser.isIos) {\n touchModule = getInstance(target, Touch);\n if (touchModule) {\n touchModule.destroy();\n }\n }\n else {\n EventHandler.remove(target, 'contextmenu', this.cmenuHandler);\n }\n }\n }\n if (!this.isMenu) {\n EventHandler.remove(this.targetElement, 'scroll', this.scrollHandler);\n for (var _i = 0, _a = getScrollableParent(this.targetElement); _i < _a.length; _i++) {\n var parent_2 = _a[_i];\n EventHandler.remove(parent_2, 'scroll', this.scrollHandler);\n }\n }\n }\n if (!Browser.isDevice) {\n EventHandler.remove(this.isMenu ? document : wrapper, 'mouseover', this.delegateMoverHandler);\n EventHandler.remove(document, 'mousedown', this.delegateMouseDownHandler);\n }\n EventHandler.remove(document, 'click', this.delegateClickHandler);\n this.unWireKeyboardEvent(wrapper);\n this.rippleFn();\n };\n MenuBase.prototype.unWireKeyboardEvent = function (element) {\n var keyboardModule = getInstance(element, KeyboardEvents);\n if (keyboardModule) {\n keyboardModule.destroy();\n }\n };\n MenuBase.prototype.toggleAnimation = function (ul, isMenuOpen) {\n var _this = this;\n if (isMenuOpen === void 0) { isMenuOpen = true; }\n var pUlHeight;\n var pElement;\n if (this.animationSettings.effect === 'None' || !isMenuOpen) {\n this.end(ul, isMenuOpen);\n }\n else {\n this.animation.animate(ul, {\n name: this.animationSettings.effect,\n duration: this.animationSettings.duration,\n timingFunction: this.animationSettings.easing,\n begin: function (options) {\n if (_this.hamburgerMode) {\n pElement = options.element.parentElement;\n options.element.style.position = 'absolute';\n pUlHeight = pElement.offsetHeight;\n options.element.style.maxHeight = options.element.offsetHeight + 'px';\n pElement.style.maxHeight = '';\n }\n else {\n options.element.style.display = 'block';\n options.element.style.maxHeight = options.element.getBoundingClientRect().height + 'px';\n }\n },\n progress: function (options) {\n if (_this.hamburgerMode) {\n pElement.style.minHeight = (pUlHeight + options.element.offsetHeight) + 'px';\n }\n },\n end: function (options) {\n if (_this.hamburgerMode) {\n options.element.style.position = '';\n options.element.style.maxHeight = '';\n pElement.style.minHeight = '';\n options.element.style.top = 0 + 'px';\n options.element.children[0].focus();\n _this.triggerOpen(options.element.children[0]);\n }\n else {\n _this.end(options.element, isMenuOpen);\n }\n }\n });\n }\n };\n MenuBase.prototype.triggerOpen = function (ul) {\n var item = this.navIdx.length ? this.getItem(this.navIdx) : null;\n var eventArgs = {\n element: ul, parentItem: item, items: item ? item.items : this.items\n };\n this.trigger('onOpen', eventArgs);\n if (!this.isMenu) {\n EventHandler.add(ul, 'keydown', this.keyHandler, this);\n }\n };\n MenuBase.prototype.end = function (ul, isMenuOpen) {\n if (isMenuOpen) {\n if (this.isMenu || !Browser.isDevice)\n ul.style.display = 'block';\n ul.style.maxHeight = '';\n this.triggerOpen(ul);\n if (ul.querySelector('.' + FOCUSED)) {\n ul.querySelector('.' + FOCUSED).focus();\n }\n else {\n var ele = this.getWrapper().children[this.getIdx(this.getWrapper(), ul) - 1];\n if (this.currentTarget) {\n if (!(this.currentTarget.classList.contains('e-numerictextbox') || this.currentTarget.classList.contains('e-textbox') || this.currentTarget.tagName === 'INPUT')) {\n if (ele) {\n ele.querySelector('.' + SELECTED).focus();\n }\n else {\n this.element.focus();\n }\n }\n }\n else {\n if (ele) {\n ele.querySelector('.' + SELECTED).focus();\n }\n else {\n this.element.focus();\n }\n }\n }\n }\n else {\n if (ul === this.element) {\n var fli = this.getLIByClass(this.element, FOCUSED);\n if (fli) {\n fli.classList.remove(FOCUSED);\n }\n var sli = this.getLIByClass(this.element, SELECTED);\n if (sli) {\n sli.classList.remove(SELECTED);\n }\n ul.style.display = 'none';\n }\n else {\n detach(ul);\n }\n }\n };\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @returns {string} - Persist data\n */\n MenuBase.prototype.getPersistData = function () {\n return '';\n };\n /**\n * Get wrapper element.\n *\n * @returns {Element} - Wrapper element\n * @private\n */\n MenuBase.prototype.getWrapper = function () {\n return closest(this.element, '.e-' + this.getModuleName() + '-wrapper');\n };\n MenuBase.prototype.getIndex = function (data, isUniqueId, items, nIndex, isCallBack, level) {\n if (items === void 0) { items = this.items; }\n if (nIndex === void 0) { nIndex = []; }\n if (isCallBack === void 0) { isCallBack = false; }\n if (level === void 0) { level = 0; }\n var item;\n level = isCallBack ? level + 1 : 0;\n for (var i = 0, len = items.length; i < len; i++) {\n item = items[i];\n if ((isUniqueId ? item[this.getField('itemId', level)] : item[this.getField('text', level)]) === data) {\n nIndex.push(i);\n break;\n }\n else if (item[this.getField('children', level)]\n && item[this.getField('children', level)].length) {\n nIndex = this.getIndex(data, isUniqueId, item[this.getField('children', level)], nIndex, true, level);\n if (nIndex[nIndex.length - 1] === -1) {\n if (i !== len - 1) {\n nIndex.pop();\n }\n }\n else {\n nIndex.unshift(i);\n break;\n }\n }\n else {\n if (i === len - 1) {\n nIndex.push(-1);\n }\n }\n }\n return (!isCallBack && nIndex[0] === -1) ? [] : nIndex;\n };\n /**\n * This method is used to enable or disable the menu items in the Menu based on the items and enable argument.\n *\n * @param {string[]} items - Text items that needs to be enabled/disabled.\n * @param {boolean} enable - Set `true`/`false` to enable/disable the list items.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.enableItems = function (items, enable, isUniqueId) {\n if (enable === void 0) { enable = true; }\n var ul;\n var idx;\n var navIdx;\n var disabled = DISABLED;\n var skipItem;\n for (var i = 0; i < items.length; i++) {\n navIdx = this.getIndex(items[i], isUniqueId);\n if (this.navIdx.length) {\n if (navIdx.length !== 1) {\n skipItem = false;\n for (var i_1 = 0, len = navIdx.length - 1; i_1 < len; i_1++) {\n if (navIdx[i_1] !== this.navIdx[i_1]) {\n skipItem = true;\n break;\n }\n }\n if (skipItem) {\n continue;\n }\n }\n }\n else {\n if (navIdx.length !== 1) {\n continue;\n }\n }\n idx = navIdx.pop();\n ul = this.getUlByNavIdx(navIdx.length);\n if (ul && !isNullOrUndefined(idx)) {\n if (enable) {\n if (this.isMenu) {\n ul.children[idx].classList.remove(disabled);\n ul.children[idx].removeAttribute('aria-disabled');\n }\n else {\n if (Browser.isDevice && !ul.classList.contains('e-contextmenu')) {\n ul.children[idx + 1].classList.remove(disabled);\n }\n else {\n ul.children[idx].classList.remove(disabled);\n }\n }\n }\n else {\n if (this.isMenu) {\n ul.children[idx].classList.add(disabled);\n ul.children[idx].setAttribute('aria-disabled', 'true');\n }\n else {\n if (Browser.isDevice && !ul.classList.contains('e-contextmenu')) {\n ul.children[idx + 1].classList.add(disabled);\n }\n else {\n ul.children[idx].classList.add(disabled);\n }\n }\n }\n }\n }\n };\n /**\n * This method is used to show the menu items in the Menu based on the items text.\n *\n * @param {string[]} items - Text items that needs to be shown.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.showItems = function (items, isUniqueId) {\n this.showHideItems(items, false, isUniqueId);\n };\n /**\n * This method is used to hide the menu items in the Menu based on the items text.\n *\n * @param {string[]} items - Text items that needs to be hidden.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.hideItems = function (items, isUniqueId) {\n this.showHideItems(items, true, isUniqueId);\n };\n MenuBase.prototype.showHideItems = function (items, ishide, isUniqueId) {\n var ul;\n var index;\n var navIdx;\n var item;\n for (var i = 0; i < items.length; i++) {\n navIdx = this.getIndex(items[i], isUniqueId);\n index = navIdx.pop();\n ul = this.getUlByNavIdx(navIdx.length);\n item = this.getItems(navIdx);\n if (ul) {\n var validUl = isUniqueId ? ul.children[index].id : item[index].text.toString();\n if (ishide && validUl === items[i]) {\n ul.children[index].classList.add(HIDE);\n }\n else if (!ishide && validUl === items[i]) {\n ul.children[index].classList.remove(HIDE);\n }\n }\n }\n };\n /**\n * It is used to remove the menu items from the Menu based on the items text.\n *\n * @param {string[]} items Text items that needs to be removed.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.removeItems = function (items, isUniqueId) {\n var idx;\n var navIdx;\n var iitems;\n for (var i = 0; i < items.length; i++) {\n navIdx = this.getIndex(items[i], isUniqueId);\n idx = navIdx.pop();\n iitems = this.getItems(navIdx);\n if (!isNullOrUndefined(idx)) {\n this.removeItem(iitems, navIdx, idx);\n }\n }\n };\n /**\n * It is used to insert the menu items after the specified menu item text.\n *\n * @param {MenuItemModel[]} items - Items that needs to be inserted.\n * @param {string} text - Text item after that the element to be inserted.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.insertAfter = function (items, text, isUniqueId) {\n this.insertItems(items, text, isUniqueId);\n };\n /**\n * It is used to insert the menu items before the specified menu item text.\n *\n * @param {MenuItemModel[]} items - Items that needs to be inserted.\n * @param {string} text - Text item before that the element to be inserted.\n * @param {boolean} isUniqueId - Set `true` if it is a unique id.\n * @returns {void}\n */\n MenuBase.prototype.insertBefore = function (items, text, isUniqueId) {\n this.insertItems(items, text, isUniqueId, false);\n };\n MenuBase.prototype.insertItems = function (items, text, isUniqueId, isAfter) {\n if (isAfter === void 0) { isAfter = true; }\n var li;\n var idx;\n var navIdx;\n var iitems;\n var menuitem;\n for (var i = 0; i < items.length; i++) {\n navIdx = this.getIndex(text, isUniqueId);\n idx = navIdx.pop();\n iitems = this.getItems(navIdx);\n menuitem = new MenuItem(iitems[0], 'items', items[i], true);\n iitems.splice(isAfter ? idx + 1 : idx, 0, menuitem);\n var uls = this.isMenu ? [this.getWrapper()].concat(this.getPopups()) : [].slice.call(this.getWrapper().children);\n if (!isNullOrUndefined(idx) && navIdx.length < uls.length) {\n idx = isAfter ? idx + 1 : idx;\n li = this.createItems(iitems).children[idx];\n var ul = this.isMenu ? select('.e-menu-parent', uls[navIdx.length]) : uls[navIdx.length];\n ul.insertBefore(li, ul.children[idx]);\n }\n }\n };\n MenuBase.prototype.removeAttributes = function () {\n var _this = this;\n ['top', 'left', 'display', 'z-index'].forEach(function (key) {\n _this.element.style.removeProperty(key);\n });\n ['role', 'tabindex', 'class', 'style'].forEach(function (key) {\n if (key === 'class' && _this.element.classList.contains('e-menu-parent')) {\n _this.element.classList.remove('e-menu-parent');\n }\n if (['class', 'style'].indexOf(key) === -1 || !_this.element.getAttribute(key)) {\n _this.element.removeAttribute(key);\n }\n if (_this.isMenu && key === 'class' && _this.element.classList.contains('e-vertical')) {\n _this.element.classList.remove('e-vertical');\n }\n });\n };\n /**\n * Destroys the widget.\n *\n * @returns {void}\n */\n MenuBase.prototype.destroy = function () {\n var wrapper = this.getWrapper();\n if (wrapper) {\n this.unWireEvents();\n if (!this.isMenu) {\n this.clonedElement.style.display = '';\n if (this.clonedElement.tagName === 'EJS-CONTEXTMENU') {\n addClass([this.clonedElement], ['e-control', 'e-lib', 'e-' + this.getModuleName()]);\n this.element = this.clonedElement;\n }\n else {\n if (this.refreshing && this.clonedElement.childElementCount && this.clonedElement.children[0].tagName === 'LI') {\n this.setProperties({ 'items': [] }, true);\n }\n if (document.getElementById(this.clonedElement.id)) {\n var refEle = this.clonedElement.nextElementSibling;\n if (refEle && refEle !== wrapper) {\n this.clonedElement.parentElement.insertBefore(this.element, refEle);\n }\n else {\n this.clonedElement.parentElement.appendChild(this.element);\n }\n if (isBlazor() && !this.isMenu) {\n this.element = this.removeChildElement(this.element);\n }\n else {\n this.element.innerHTML = '';\n }\n append([].slice.call(this.clonedElement.children), this.element);\n detach(this.clonedElement);\n this.removeAttributes();\n }\n }\n this.clonedElement = null;\n }\n else {\n this.closeMenu();\n if (isBlazor() && !this.isMenu) {\n this.element = this.removeChildElement(this.element);\n }\n else {\n this.element.innerHTML = '';\n }\n this.removeAttributes();\n wrapper.parentNode.insertBefore(this.element, wrapper);\n this.clonedElement = null;\n }\n if (this.isMenu && this.clonedElement) {\n detach(this.element);\n wrapper.style.display = '';\n wrapper.classList.remove('e-' + this.getModuleName() + '-wrapper');\n wrapper.removeAttribute('data-ripple');\n }\n else {\n detach(wrapper);\n }\n _super.prototype.destroy.call(this);\n if (this.template) {\n this.clearTemplate(['template']);\n }\n }\n this.rippleFn = null;\n };\n __decorate([\n Event()\n ], MenuBase.prototype, \"beforeItemRender\", void 0);\n __decorate([\n Event()\n ], MenuBase.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], MenuBase.prototype, \"onOpen\", void 0);\n __decorate([\n Event()\n ], MenuBase.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], MenuBase.prototype, \"onClose\", void 0);\n __decorate([\n Event()\n ], MenuBase.prototype, \"select\", void 0);\n __decorate([\n Event()\n ], MenuBase.prototype, \"created\", void 0);\n __decorate([\n Property('')\n ], MenuBase.prototype, \"cssClass\", void 0);\n __decorate([\n Property(0)\n ], MenuBase.prototype, \"hoverDelay\", void 0);\n __decorate([\n Property(false)\n ], MenuBase.prototype, \"showItemOnClick\", void 0);\n __decorate([\n Property('')\n ], MenuBase.prototype, \"target\", void 0);\n __decorate([\n Property('')\n ], MenuBase.prototype, \"filter\", void 0);\n __decorate([\n Property(null)\n ], MenuBase.prototype, \"template\", void 0);\n __decorate([\n Property(false)\n ], MenuBase.prototype, \"enableScrolling\", void 0);\n __decorate([\n Property(true)\n ], MenuBase.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Complex({ itemId: 'id', text: 'text', parentId: 'parentId', iconCss: 'iconCss', url: 'url', separator: 'separator', children: 'items' }, FieldSettings)\n ], MenuBase.prototype, \"fields\", void 0);\n __decorate([\n Collection([], MenuItem)\n ], MenuBase.prototype, \"items\", void 0);\n __decorate([\n Complex({ duration: 400, easing: 'ease', effect: 'SlideDown' }, MenuAnimationSettings)\n ], MenuBase.prototype, \"animationSettings\", void 0);\n MenuBase = __decorate([\n NotifyPropertyChanges\n ], MenuBase);\n return MenuBase;\n}(Component));\nexport { MenuBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Component, EventHandler, Property, Event } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, isVisible, closest, attributes, detach, classList, KeyboardEvents } from '@syncfusion/ej2-base';\nimport { selectAll, setStyleAttribute as setStyle, select } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, getUniqueID, formatUnit, Collection, compile as templateCompiler } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty, Browser, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { Popup } from '@syncfusion/ej2-popups';\nimport { calculatePosition } from '@syncfusion/ej2-popups';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { HScroll } from '../common/h-scroll';\nimport { VScroll } from '../common/v-scroll';\nvar CLS_VERTICAL = 'e-vertical';\nvar CLS_ITEMS = 'e-toolbar-items';\nvar CLS_ITEM = 'e-toolbar-item';\nvar CLS_RTL = 'e-rtl';\nvar CLS_SEPARATOR = 'e-separator';\nvar CLS_POPUPICON = 'e-popup-up-icon';\nvar CLS_POPUPDOWN = 'e-popup-down-icon';\nvar CLS_POPUPOPEN = 'e-popup-open';\nvar CLS_TEMPLATE = 'e-template';\nvar CLS_DISABLE = 'e-overlay';\nvar CLS_POPUPTEXT = 'e-toolbar-text';\nvar CLS_TBARTEXT = 'e-popup-text';\nvar CLS_TBAROVERFLOW = 'e-overflow-show';\nvar CLS_POPOVERFLOW = 'e-overflow-hide';\nvar CLS_TBARBTN = 'e-tbar-btn';\nvar CLS_TBARNAV = 'e-hor-nav';\nvar CLS_TBARSCRLNAV = 'e-scroll-nav';\nvar CLS_TBARRIGHT = 'e-toolbar-right';\nvar CLS_TBARLEFT = 'e-toolbar-left';\nvar CLS_TBARCENTER = 'e-toolbar-center';\nvar CLS_TBARPOS = 'e-tbar-pos';\nvar CLS_HSCROLLCNT = 'e-hscroll-content';\nvar CLS_VSCROLLCNT = 'e-vscroll-content';\nvar CLS_HSCROLLBAR = 'e-hscroll-bar';\nvar CLS_POPUPNAV = 'e-hor-nav';\nvar CLS_POPUPCLASS = 'e-toolbar-pop';\nvar CLS_POPUP = 'e-toolbar-popup';\nvar CLS_TBARBTNTEXT = 'e-tbar-btn-text';\nvar CLS_TBARNAVACT = 'e-nav-active';\nvar CLS_TBARIGNORE = 'e-ignore';\nvar CLS_POPPRI = 'e-popup-alone';\nvar CLS_HIDDEN = 'e-hidden';\nvar CLS_MULTIROW = 'e-toolbar-multirow';\nvar CLS_MULTIROWPOS = 'e-multirow-pos';\nvar CLS_MULTIROW_SEPARATOR = 'e-multirow-separator';\nvar CLS_EXTENDABLE_SEPARATOR = 'e-extended-separator';\nvar CLS_EXTEANDABLE_TOOLBAR = 'e-extended-toolbar';\nvar CLS_EXTENDABLECLASS = 'e-toolbar-extended';\nvar CLS_EXTENDPOPUP = 'e-expended-nav';\nvar CLS_EXTENDEDPOPOPEN = 'e-tbar-extended';\n/**\n * An item object that is used to configure Toolbar commands.\n */\nvar Item = /** @class */ (function (_super) {\n __extends(Item, _super);\n function Item() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Item.prototype, \"id\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"text\", void 0);\n __decorate([\n Property('auto')\n ], Item.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], Item.prototype, \"showAlwaysInPopup\", void 0);\n __decorate([\n Property(false)\n ], Item.prototype, \"disabled\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"prefixIcon\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"suffixIcon\", void 0);\n __decorate([\n Property(true)\n ], Item.prototype, \"visible\", void 0);\n __decorate([\n Property('None')\n ], Item.prototype, \"overflow\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"template\", void 0);\n __decorate([\n Property('Button')\n ], Item.prototype, \"type\", void 0);\n __decorate([\n Property('Both')\n ], Item.prototype, \"showTextOn\", void 0);\n __decorate([\n Property(null)\n ], Item.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"tooltipText\", void 0);\n __decorate([\n Property('Left')\n ], Item.prototype, \"align\", void 0);\n __decorate([\n Event()\n ], Item.prototype, \"click\", void 0);\n __decorate([\n Property(-1)\n ], Item.prototype, \"tabIndex\", void 0);\n return Item;\n}(ChildProperty));\nexport { Item };\n/**\n * The Toolbar control contains a group of commands that are aligned horizontally.\n * ```html\n *
\n * \n * ```\n */\nvar Toolbar = /** @class */ (function (_super) {\n __extends(Toolbar, _super);\n /**\n * Initializes a new instance of the Toolbar class.\n *\n * @param {ToolbarModel} options - Specifies Toolbar model properties as options.\n * @param { string | HTMLElement} element - Specifies the element that is rendered as a Toolbar.\n */\n function Toolbar(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.resizeContext = _this.resize.bind(_this);\n _this.orientationChangeContext = _this.orientationChange.bind(_this);\n /**\n * Contains the keyboard configuration of the Toolbar.\n */\n _this.keyConfigs = {\n moveLeft: 'leftarrow',\n moveRight: 'rightarrow',\n moveUp: 'uparrow',\n moveDown: 'downarrow',\n popupOpen: 'enter',\n popupClose: 'escape',\n tab: 'tab',\n home: 'home',\n end: 'end'\n };\n return _this;\n }\n /**\n * Removes the control from the DOM and also removes all its related events.\n *\n * @returns {void}.\n */\n Toolbar.prototype.destroy = function () {\n var _this = this;\n if (this.isReact || this.isAngular) {\n this.clearTemplate();\n }\n var btnItems = this.element.querySelectorAll('.e-control.e-btn');\n [].slice.call(btnItems).forEach(function (el) {\n if (!isNOU(el) && !isNOU(el.ej2_instances) && !isNOU(el.ej2_instances[0]) && !(el.ej2_instances[0].isDestroyed)) {\n el.ej2_instances[0].destroy();\n }\n });\n this.unwireEvents();\n this.tempId.forEach(function (ele) {\n if (!isNOU(_this.element.querySelector(ele))) {\n document.body.appendChild(_this.element.querySelector(ele)).style.display = 'none';\n }\n });\n this.destroyItems();\n while (this.element.lastElementChild) {\n this.element.removeChild(this.element.lastElementChild);\n }\n if (this.trgtEle) {\n this.element.appendChild(this.ctrlTem);\n this.trgtEle = null;\n this.ctrlTem = null;\n }\n if (this.popObj) {\n this.popObj.destroy();\n detach(this.popObj.element);\n }\n if (this.activeEle) {\n this.activeEle = null;\n }\n this.popObj = null;\n this.tbarAlign = null;\n this.tbarItemsCol = [];\n this.remove(this.element, 'e-toolpop');\n if (this.cssClass) {\n removeClass([this.element], this.cssClass.split(' '));\n }\n this.element.removeAttribute('style');\n ['aria-disabled', 'aria-orientation', 'role'].forEach(function (attrb) {\n return _this.element.removeAttribute(attrb);\n });\n _super.prototype.destroy.call(this);\n };\n /**\n * Initialize the event handler\n *\n * @private\n * @returns {void}\n */\n Toolbar.prototype.preRender = function () {\n var eventArgs = { enableCollision: this.enableCollision, scrollStep: this.scrollStep };\n this.trigger('beforeCreate', eventArgs);\n this.enableCollision = eventArgs.enableCollision;\n this.scrollStep = eventArgs.scrollStep;\n this.scrollModule = null;\n this.popObj = null;\n this.tempId = [];\n this.tbarItemsCol = this.items;\n this.isVertical = this.element.classList.contains(CLS_VERTICAL) ? true : false;\n this.isExtendedOpen = false;\n this.popupPriCount = 0;\n if (this.enableRtl) {\n this.add(this.element, CLS_RTL);\n }\n };\n Toolbar.prototype.wireEvents = function () {\n EventHandler.add(this.element, 'click', this.clickHandler, this);\n window.addEventListener('resize', this.resizeContext);\n window.addEventListener('orientationchange', this.orientationChangeContext);\n if (this.allowKeyboard) {\n this.wireKeyboardEvent();\n }\n };\n Toolbar.prototype.wireKeyboardEvent = function () {\n this.keyModule = new KeyboardEvents(this.element, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: this.keyConfigs\n });\n EventHandler.add(this.element, 'keydown', this.docKeyDown, this);\n this.updateTabIndex('0');\n };\n Toolbar.prototype.updateTabIndex = function (tabIndex) {\n var ele = this.element.querySelector('.' + CLS_ITEM + ':not(.' + CLS_DISABLE + ' ):not(.' + CLS_SEPARATOR + ' ):not(.' + CLS_HIDDEN + ' )');\n if (!isNOU(ele) && !isNOU(ele.firstElementChild)) {\n var dataTabIndex = ele.firstElementChild.getAttribute('data-tabindex');\n if (dataTabIndex && dataTabIndex === '-1' && ele.firstElementChild.tagName !== 'INPUT') {\n ele.firstElementChild.setAttribute('tabindex', tabIndex);\n }\n }\n };\n Toolbar.prototype.unwireKeyboardEvent = function () {\n if (this.keyModule) {\n EventHandler.remove(this.element, 'keydown', this.docKeyDown);\n this.keyModule.destroy();\n this.keyModule = null;\n }\n };\n Toolbar.prototype.docKeyDown = function (e) {\n if (e.target.tagName === 'INPUT') {\n return;\n }\n var popCheck = !isNOU(this.popObj) && isVisible(this.popObj.element) && this.overflowMode !== 'Extended';\n if (e.keyCode === 9 && e.target.classList.contains('e-hor-nav') === true && popCheck) {\n this.popObj.hide({ name: 'FadeOut', duration: 100 });\n }\n var keyCheck = (e.keyCode === 40 || e.keyCode === 38 || e.keyCode === 35 || e.keyCode === 36);\n if (keyCheck) {\n e.preventDefault();\n }\n };\n Toolbar.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, 'click', this.clickHandler);\n this.destroyScroll();\n this.unwireKeyboardEvent();\n window.removeEventListener('resize', this.resizeContext);\n window.removeEventListener('orientationchange', this.orientationChangeContext);\n EventHandler.remove(document, 'scroll', this.docEvent);\n EventHandler.remove(document, 'click', this.docEvent);\n };\n Toolbar.prototype.clearProperty = function () {\n this.tbarEle = [];\n this.tbarAlgEle = { lefts: [], centers: [], rights: [] };\n };\n Toolbar.prototype.docEvent = function (e) {\n var popEle = closest(e.target, '.e-popup');\n if (this.popObj && isVisible(this.popObj.element) && !popEle && this.overflowMode === 'Popup') {\n this.popObj.hide({ name: 'FadeOut', duration: 100 });\n }\n };\n Toolbar.prototype.destroyScroll = function () {\n if (this.scrollModule) {\n if (this.tbarAlign) {\n this.add(this.scrollModule.element, CLS_TBARPOS);\n }\n this.scrollModule.destroy();\n this.scrollModule = null;\n }\n };\n Toolbar.prototype.destroyItems = function () {\n if (this.element) {\n [].slice.call(this.element.querySelectorAll('.' + CLS_ITEM)).forEach(function (el) { detach(el); });\n }\n if (this.tbarAlign) {\n var tbarItems = this.element.querySelector('.' + CLS_ITEMS);\n [].slice.call(tbarItems.children).forEach(function (el) {\n detach(el);\n });\n this.tbarAlign = false;\n this.remove(tbarItems, CLS_TBARPOS);\n }\n this.clearProperty();\n };\n Toolbar.prototype.destroyMode = function () {\n if (this.scrollModule) {\n this.remove(this.scrollModule.element, CLS_RTL);\n this.destroyScroll();\n }\n this.remove(this.element, CLS_EXTENDEDPOPOPEN);\n this.remove(this.element, CLS_EXTEANDABLE_TOOLBAR);\n var tempEle = this.element.querySelector('.e-toolbar-multirow');\n if (tempEle) {\n this.remove(tempEle, CLS_MULTIROW);\n }\n if (this.popObj) {\n this.popupRefresh(this.popObj.element, true);\n }\n };\n Toolbar.prototype.add = function (ele, val) {\n ele.classList.add(val);\n };\n Toolbar.prototype.remove = function (ele, val) {\n ele.classList.remove(val);\n };\n Toolbar.prototype.elementFocus = function (ele) {\n var fChild = ele.firstElementChild;\n if (fChild) {\n fChild.focus();\n this.activeEleSwitch(ele);\n }\n else {\n ele.focus();\n }\n };\n Toolbar.prototype.clstElement = function (tbrNavChk, trgt) {\n var clst;\n if (tbrNavChk && this.popObj && isVisible(this.popObj.element)) {\n clst = this.popObj.element.querySelector('.' + CLS_ITEM);\n }\n else if (this.element === trgt || tbrNavChk) {\n clst = this.element.querySelector('.' + CLS_ITEM + ':not(.' + CLS_DISABLE + ' ):not(.' + CLS_SEPARATOR + ' ):not(.' + CLS_HIDDEN + ' )');\n }\n else {\n clst = closest(trgt, '.' + CLS_ITEM);\n }\n return clst;\n };\n Toolbar.prototype.keyHandling = function (clst, e, trgt, navChk, scrollChk) {\n var popObj = this.popObj;\n var rootEle = this.element;\n var popAnimate = { name: 'FadeOut', duration: 100 };\n var value = e.action === 'moveUp' ? 'previous' : 'next';\n var ele;\n var nodes;\n switch (e.action) {\n case 'moveRight':\n if (this.isVertical) {\n return;\n }\n if (rootEle === trgt) {\n this.elementFocus(clst);\n }\n else if (!navChk) {\n this.eleFocus(clst, 'next');\n }\n break;\n case 'moveLeft':\n if (this.isVertical) {\n return;\n }\n if (!navChk) {\n this.eleFocus(clst, 'previous');\n }\n break;\n case 'home':\n case 'end':\n if (clst) {\n var popupCheck = closest(clst, '.e-popup');\n var extendedPopup = this.element.querySelector('.' + CLS_EXTENDABLECLASS);\n if (this.overflowMode === 'Extended' && extendedPopup && extendedPopup.classList.contains('e-popup-open')) {\n popupCheck = e.action === 'end' ? extendedPopup : null;\n }\n if (popupCheck) {\n if (isVisible(this.popObj.element)) {\n nodes = [].slice.call(popupCheck.children);\n if (e.action === 'home') {\n ele = this.focusFirstVisibleEle(nodes);\n }\n else {\n ele = this.focusLastVisibleEle(nodes);\n }\n }\n }\n else {\n nodes = this.element.querySelectorAll('.' + CLS_ITEMS + ' .' + CLS_ITEM + ':not(.' + CLS_SEPARATOR + ')');\n if (e.action === 'home') {\n ele = this.focusFirstVisibleEle(nodes);\n }\n else {\n ele = this.focusLastVisibleEle(nodes);\n }\n }\n if (ele) {\n this.elementFocus(ele);\n }\n }\n break;\n case 'moveUp':\n case 'moveDown':\n if (!this.isVertical) {\n if (popObj && closest(trgt, '.e-popup')) {\n var popEle = popObj.element;\n var popFrstEle = popEle.firstElementChild;\n if ((value === 'previous' && popFrstEle === clst)) {\n popEle.lastElementChild.firstChild.focus();\n }\n else if (value === 'next' && popEle.lastElementChild === clst) {\n popFrstEle.firstChild.focus();\n }\n else {\n this.eleFocus(clst, value);\n }\n }\n else if (e.action === 'moveDown' && popObj && isVisible(popObj.element)) {\n this.elementFocus(clst);\n }\n }\n else {\n if (e.action === 'moveUp') {\n this.eleFocus(clst, 'previous');\n }\n else {\n this.eleFocus(clst, 'next');\n }\n }\n break;\n case 'tab':\n if (!scrollChk && !navChk) {\n var ele_1 = clst.firstElementChild;\n if (rootEle === trgt) {\n if (this.activeEle) {\n this.activeEle.focus();\n }\n else {\n this.activeEleRemove(ele_1);\n ele_1.focus();\n }\n }\n }\n break;\n case 'popupClose':\n if (popObj && this.overflowMode !== 'Extended') {\n popObj.hide(popAnimate);\n }\n break;\n case 'popupOpen':\n if (!navChk) {\n return;\n }\n if (popObj && !isVisible(popObj.element)) {\n popObj.element.style.top = rootEle.offsetHeight + 'px';\n popObj.show({ name: 'FadeIn', duration: 100 });\n }\n else {\n popObj.hide(popAnimate);\n }\n break;\n }\n };\n Toolbar.prototype.keyActionHandler = function (e) {\n var trgt = e.target;\n if (trgt.tagName === 'INPUT' || trgt.tagName === 'TEXTAREA' || this.element.classList.contains(CLS_DISABLE)) {\n return;\n }\n e.preventDefault();\n var tbrNavChk = trgt.classList.contains(CLS_TBARNAV);\n var tbarScrollChk = trgt.classList.contains(CLS_TBARSCRLNAV);\n var clst = this.clstElement(tbrNavChk, trgt);\n if (clst || tbarScrollChk) {\n this.keyHandling(clst, e, trgt, tbrNavChk, tbarScrollChk);\n }\n };\n /**\n * Specifies the value to disable/enable the Toolbar component.\n * When set to `true`, the component will be disabled.\n *\n * @param {boolean} value - Based on this Boolean value, Toolbar will be enabled (false) or disabled (true).\n * @returns {void}.\n */\n Toolbar.prototype.disable = function (value) {\n var rootEle = this.element;\n if (value) {\n rootEle.classList.add(CLS_DISABLE);\n }\n else {\n rootEle.classList.remove(CLS_DISABLE);\n }\n if (this.activeEle) {\n this.activeEle.setAttribute('tabindex', this.activeEle.getAttribute('data-tabindex'));\n }\n if (this.scrollModule) {\n this.scrollModule.disable(value);\n }\n if (this.popObj) {\n if (isVisible(this.popObj.element) && this.overflowMode !== 'Extended') {\n this.popObj.hide();\n }\n rootEle.querySelector('#' + rootEle.id + '_nav').setAttribute('tabindex', !value ? '0' : '-1');\n }\n };\n Toolbar.prototype.eleContains = function (el) {\n return el.classList.contains(CLS_SEPARATOR) || el.classList.contains(CLS_DISABLE) || el.getAttribute('disabled') || el.classList.contains(CLS_HIDDEN) || !isVisible(el) || !el.classList.contains(CLS_ITEM);\n };\n Toolbar.prototype.focusFirstVisibleEle = function (nodes) {\n var element;\n var index = 0;\n while (index < nodes.length) {\n var ele = nodes[parseInt(index.toString(), 10)];\n if (!ele.classList.contains(CLS_HIDDEN) && !ele.classList.contains(CLS_DISABLE)) {\n return ele;\n }\n index++;\n }\n return element;\n };\n Toolbar.prototype.focusLastVisibleEle = function (nodes) {\n var element;\n var index = nodes.length - 1;\n while (index >= 0) {\n var ele = nodes[parseInt(index.toString(), 10)];\n if (!ele.classList.contains(CLS_HIDDEN) && !ele.classList.contains(CLS_DISABLE)) {\n return ele;\n }\n index--;\n }\n return element;\n };\n Toolbar.prototype.eleFocus = function (closest, pos) {\n var sib = Object(closest)[pos + 'ElementSibling'];\n if (sib) {\n var skipEle = this.eleContains(sib);\n if (skipEle) {\n this.eleFocus(sib, pos);\n return;\n }\n this.elementFocus(sib);\n }\n else if (this.tbarAlign) {\n var elem = Object(closest.parentElement)[pos + 'ElementSibling'];\n if (!isNOU(elem) && elem.children.length === 0) {\n elem = Object(elem)[pos + 'ElementSibling'];\n }\n if (!isNOU(elem) && elem.children.length > 0) {\n if (pos === 'next') {\n var el = elem.querySelector('.' + CLS_ITEM);\n if (this.eleContains(el)) {\n this.eleFocus(el, pos);\n }\n else {\n el.firstElementChild.focus();\n this.activeEleSwitch(el);\n }\n }\n else {\n var el = elem.lastElementChild;\n if (this.eleContains(el)) {\n this.eleFocus(el, pos);\n }\n else {\n this.elementFocus(el);\n }\n }\n }\n }\n else if (!isNOU(closest)) {\n var tbrItems = this.element.querySelectorAll('.' + CLS_ITEMS + ' .' + CLS_ITEM + ':not(.' + CLS_SEPARATOR + ')' + ':not(.' + CLS_DISABLE + ')' + ':not(.' + CLS_HIDDEN + ')');\n if (pos === 'next' && tbrItems) {\n this.elementFocus(tbrItems[0]);\n }\n else if (pos === 'previous' && tbrItems) {\n this.elementFocus(tbrItems[tbrItems.length - 1]);\n }\n }\n };\n Toolbar.prototype.clickHandler = function (e) {\n var _this = this;\n var trgt = e.target;\n var ele = this.element;\n var isPopupElement = !isNOU(closest(trgt, '.' + CLS_POPUPCLASS));\n var clsList = trgt.classList;\n var popupNav = closest(trgt, ('.' + CLS_TBARNAV));\n if (!popupNav) {\n popupNav = trgt;\n }\n if (!ele.children[0].classList.contains('e-hscroll') && !ele.children[0].classList.contains('e-vscroll')\n && (clsList.contains(CLS_TBARNAV))) {\n clsList = trgt.querySelector('.e-icons').classList;\n }\n if (clsList.contains(CLS_POPUPICON) || clsList.contains(CLS_POPUPDOWN)) {\n this.popupClickHandler(ele, popupNav, CLS_RTL);\n }\n var itemObj;\n var clst = closest(e.target, '.' + CLS_ITEM);\n if ((isNOU(clst) || clst.classList.contains(CLS_DISABLE)) && !popupNav.classList.contains(CLS_TBARNAV)) {\n return;\n }\n if (clst) {\n var tempItem = this.items[this.tbarEle.indexOf(clst)];\n itemObj = tempItem;\n }\n var eventArgs = { originalEvent: e, item: itemObj };\n var isClickBinded = itemObj && !isNOU(itemObj.click) && typeof itemObj.click == 'object' ? !isNOU(itemObj.click.observers) && itemObj.click.observers.length > 0 : !isNOU(itemObj) && !isNOU(itemObj.click);\n if (isClickBinded) {\n this.trigger('items[' + this.tbarEle.indexOf(clst) + '].click', eventArgs);\n }\n if (!eventArgs.cancel) {\n this.trigger('clicked', eventArgs, function (clickedArgs) {\n if (!isNOU(_this.popObj) && isPopupElement && !clickedArgs.cancel && _this.overflowMode === 'Popup' &&\n clickedArgs.item && clickedArgs.item.type !== 'Input') {\n _this.popObj.hide({ name: 'FadeOut', duration: 100 });\n }\n });\n }\n };\n Toolbar.prototype.popupClickHandler = function (ele, popupNav, CLS_RTL) {\n var popObj = this.popObj;\n if (isVisible(popObj.element)) {\n popupNav.classList.remove(CLS_TBARNAVACT);\n popObj.hide({ name: 'FadeOut', duration: 100 });\n }\n else {\n if (ele.classList.contains(CLS_RTL)) {\n popObj.enableRtl = true;\n popObj.position = { X: 'left', Y: 'top' };\n }\n if (popObj.offsetX === 0 && !ele.classList.contains(CLS_RTL)) {\n popObj.enableRtl = false;\n popObj.position = { X: 'right', Y: 'top' };\n }\n if (this.overflowMode === 'Extended') {\n popObj.element.style.minHeight = '0px';\n popObj.width = this.getToolbarPopupWidth(this.element);\n }\n popObj.dataBind();\n popObj.refreshPosition();\n popObj.element.style.top = this.getElementOffsetY() + 'px';\n popupNav.classList.add(CLS_TBARNAVACT);\n popObj.show({ name: 'FadeIn', duration: 100 });\n }\n };\n Toolbar.prototype.getToolbarPopupWidth = function (ele) {\n var eleStyles = window.getComputedStyle(ele);\n return parseFloat(eleStyles.width) + ((parseFloat(eleStyles.borderRightWidth)) * 2);\n };\n /**\n * To Initialize the control rendering\n *\n * @private\n * @returns {void}\n */\n Toolbar.prototype.render = function () {\n var _this = this;\n this.initialize();\n this.renderControl();\n this.wireEvents();\n this.renderComplete();\n if (this.isReact && this.portals && this.portals.length > 0) {\n this.renderReactTemplates(function () {\n _this.refreshOverflow();\n });\n }\n };\n Toolbar.prototype.initialize = function () {\n var width = formatUnit(this.width);\n var height = formatUnit(this.height);\n if (Browser.info.name !== 'msie' || this.height !== 'auto' || this.overflowMode === 'MultiRow') {\n setStyle(this.element, { 'height': height });\n }\n setStyle(this.element, { 'width': width });\n var ariaAttr = {\n 'role': 'toolbar', 'aria-disabled': 'false',\n 'aria-orientation': !this.isVertical ? 'horizontal' : 'vertical'\n };\n attributes(this.element, ariaAttr);\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n };\n Toolbar.prototype.renderControl = function () {\n var ele = this.element;\n this.trgtEle = (ele.children.length > 0) ? ele.querySelector('div') : null;\n this.tbarAlgEle = { lefts: [], centers: [], rights: [] };\n this.renderItems();\n this.renderLayout();\n };\n Toolbar.prototype.renderLayout = function () {\n this.renderOverflowMode();\n if (this.tbarAlign) {\n this.itemPositioning();\n }\n if (this.popObj && this.popObj.element.childElementCount > 1 && this.checkPopupRefresh(this.element, this.popObj.element)) {\n this.popupRefresh(this.popObj.element, false);\n }\n this.separator();\n };\n Toolbar.prototype.itemsAlign = function (items, itemEleDom) {\n var innerItem;\n var innerPos;\n if (!this.tbarEle) {\n this.tbarEle = [];\n }\n for (var i = 0; i < items.length; i++) {\n innerItem = this.renderSubComponent(items[parseInt(i.toString(), 10)], i);\n if (this.tbarEle.indexOf(innerItem) === -1) {\n this.tbarEle.push(innerItem);\n }\n if (!this.tbarAlign) {\n this.tbarItemAlign(items[parseInt(i.toString(), 10)], itemEleDom, i);\n }\n innerPos = itemEleDom.querySelector('.e-toolbar-' + items[parseInt(i.toString(), 10)].align.toLowerCase());\n if (innerPos) {\n if (!(items[parseInt(i.toString(), 10)].showAlwaysInPopup && items[parseInt(i.toString(), 10)].overflow !== 'Show')) {\n this.tbarAlgEle[(items[parseInt(i.toString(), 10)].align + 's').toLowerCase()].push(innerItem);\n }\n innerPos.appendChild(innerItem);\n }\n else {\n itemEleDom.appendChild(innerItem);\n }\n }\n if (this.isReact) {\n var portals = 'portals';\n this.notify('render-react-toolbar-template', this[\"\" + portals]);\n this.renderReactTemplates();\n }\n };\n /**\n * @hidden\n * @returns {void}\n */\n Toolbar.prototype.changeOrientation = function () {\n var ele = this.element;\n if (this.isVertical) {\n ele.classList.remove(CLS_VERTICAL);\n this.isVertical = false;\n if (this.height === 'auto' || this.height === '100%') {\n ele.style.height = this.height;\n }\n ele.setAttribute('aria-orientation', 'horizontal');\n }\n else {\n ele.classList.add(CLS_VERTICAL);\n this.isVertical = true;\n ele.setAttribute('aria-orientation', 'vertical');\n setStyle(this.element, { 'height': formatUnit(this.height), 'width': formatUnit(this.width) });\n }\n this.destroyMode();\n this.refreshOverflow();\n };\n Toolbar.prototype.initScroll = function (element, innerItems) {\n if (!this.scrollModule && this.checkOverflow(element, innerItems[0])) {\n if (this.tbarAlign) {\n this.element.querySelector('.' + CLS_ITEMS + ' .' + CLS_TBARCENTER).removeAttribute('style');\n }\n if (this.isVertical) {\n this.scrollModule = new VScroll({ scrollStep: this.scrollStep, enableRtl: this.enableRtl }, innerItems[0]);\n }\n else {\n this.scrollModule = new HScroll({ scrollStep: this.scrollStep, enableRtl: this.enableRtl }, innerItems[0]);\n }\n if (this.cssClass) {\n addClass([innerItems[0]], this.cssClass.split(' '));\n }\n var scrollEle = this.scrollModule.element.querySelector('.' + CLS_HSCROLLBAR + ', .' + 'e-vscroll-bar');\n if (scrollEle) {\n scrollEle.removeAttribute('tabindex');\n }\n this.remove(this.scrollModule.element, CLS_TBARPOS);\n setStyle(this.element, { overflow: 'hidden' });\n }\n };\n Toolbar.prototype.itemWidthCal = function (items) {\n var _this = this;\n var width = 0;\n var style;\n [].slice.call(selectAll('.' + CLS_ITEM, items)).forEach(function (el) {\n if (isVisible(el)) {\n style = window.getComputedStyle(el);\n width += _this.isVertical ? el.offsetHeight : el.offsetWidth;\n width += parseFloat(_this.isVertical ? style.marginTop : style.marginRight);\n width += parseFloat(_this.isVertical ? style.marginBottom : style.marginLeft);\n }\n });\n return width;\n };\n Toolbar.prototype.getScrollCntEle = function (innerItem) {\n var trgClass = (this.isVertical) ? '.e-vscroll-content' : '.e-hscroll-content';\n return innerItem.querySelector(trgClass);\n };\n Toolbar.prototype.checkOverflow = function (element, innerItem) {\n if (isNOU(element) || isNOU(innerItem) || !isVisible(element)) {\n return false;\n }\n var eleWidth = this.isVertical ? element.offsetHeight : element.offsetWidth;\n var itemWidth = this.isVertical ? innerItem.offsetHeight : innerItem.offsetWidth;\n if (this.tbarAlign || this.scrollModule || (eleWidth === itemWidth)) {\n itemWidth = this.itemWidthCal(this.scrollModule ? this.getScrollCntEle(innerItem) : innerItem);\n }\n var popNav = element.querySelector('.' + CLS_TBARNAV);\n var scrollNav = element.querySelector('.' + CLS_TBARSCRLNAV);\n var navEleWidth = 0;\n if (popNav) {\n navEleWidth = this.isVertical ? popNav.offsetHeight : popNav.offsetWidth;\n }\n else if (scrollNav) {\n navEleWidth = this.isVertical ? (scrollNav.offsetHeight * (2)) : (scrollNav.offsetWidth * 2);\n }\n if (itemWidth > eleWidth - navEleWidth) {\n return true;\n }\n else {\n return false;\n }\n };\n /**\n * Refresh the whole Toolbar component without re-rendering.\n * - It is used to manually refresh the Toolbar overflow modes such as scrollable, popup, multi row, and extended.\n * - It will refresh the Toolbar component after loading items dynamically.\n *\n * @returns {void}.\n */\n Toolbar.prototype.refreshOverflow = function () {\n this.resize();\n };\n Toolbar.prototype.toolbarAlign = function (innerItems) {\n if (this.tbarAlign) {\n this.add(innerItems, CLS_TBARPOS);\n this.itemPositioning();\n }\n };\n Toolbar.prototype.renderOverflowMode = function () {\n var ele = this.element;\n var innerItems = ele.querySelector('.' + CLS_ITEMS);\n var priorityCheck = this.popupPriCount > 0;\n if (ele && ele.children.length > 0) {\n this.offsetWid = ele.offsetWidth;\n this.remove(this.element, 'e-toolpop');\n if (Browser.info.name === 'msie' && this.height === 'auto') {\n ele.style.height = '';\n }\n switch (this.overflowMode) {\n case 'Scrollable':\n if (isNOU(this.scrollModule)) {\n this.initScroll(ele, [].slice.call(ele.getElementsByClassName(CLS_ITEMS)));\n }\n break;\n case 'Popup':\n this.add(this.element, 'e-toolpop');\n if (this.tbarAlign) {\n this.removePositioning();\n }\n if (this.checkOverflow(ele, innerItems) || priorityCheck) {\n this.setOverflowAttributes(ele);\n }\n this.toolbarAlign(innerItems);\n break;\n case 'MultiRow':\n this.add(innerItems, CLS_MULTIROW);\n if (this.checkOverflow(ele, innerItems) && this.tbarAlign) {\n this.removePositioning();\n this.add(innerItems, CLS_MULTIROWPOS);\n }\n if (ele.style.overflow === 'hidden') {\n ele.style.overflow = '';\n }\n if (Browser.info.name === 'msie' || ele.style.height !== 'auto') {\n ele.style.height = 'auto';\n }\n break;\n case 'Extended':\n this.add(this.element, CLS_EXTEANDABLE_TOOLBAR);\n if (this.checkOverflow(ele, innerItems) || priorityCheck) {\n if (this.tbarAlign) {\n this.removePositioning();\n }\n this.setOverflowAttributes(ele);\n }\n this.toolbarAlign(innerItems);\n }\n }\n };\n Toolbar.prototype.setOverflowAttributes = function (ele) {\n this.createPopupEle(ele, [].slice.call(selectAll('.' + CLS_ITEMS + ' .' + CLS_ITEM, ele)));\n var ariaAttr = {\n 'tabindex': '0', 'role': 'button', 'aria-haspopup': 'true',\n 'aria-label': 'overflow'\n };\n attributes(this.element.querySelector('.' + CLS_TBARNAV), ariaAttr);\n };\n Toolbar.prototype.separator = function () {\n var element = this.element;\n var eleItem = [].slice.call(element.querySelectorAll('.' + CLS_SEPARATOR));\n var multiVar = element.querySelector('.' + CLS_MULTIROW_SEPARATOR);\n var extendVar = element.querySelector('.' + CLS_EXTENDABLE_SEPARATOR);\n var eleInlineItem = this.overflowMode === 'MultiRow' ? multiVar : extendVar;\n if (eleInlineItem !== null) {\n if (this.overflowMode === 'MultiRow') {\n eleInlineItem.classList.remove(CLS_MULTIROW_SEPARATOR);\n }\n else if (this.overflowMode === 'Extended') {\n eleInlineItem.classList.remove(CLS_EXTENDABLE_SEPARATOR);\n }\n }\n for (var i = 0; i <= eleItem.length - 1; i++) {\n if (eleItem[parseInt(i.toString(), 10)].offsetLeft < 30 && eleItem[parseInt(i.toString(), 10)].offsetLeft !== 0) {\n if (this.overflowMode === 'MultiRow') {\n eleItem[parseInt(i.toString(), 10)].classList.add(CLS_MULTIROW_SEPARATOR);\n }\n else if (this.overflowMode === 'Extended') {\n eleItem[parseInt(i.toString(), 10)].classList.add(CLS_EXTENDABLE_SEPARATOR);\n }\n }\n }\n };\n Toolbar.prototype.createPopupEle = function (ele, innerEle) {\n var innerNav = ele.querySelector('.' + CLS_TBARNAV);\n var vertical = this.isVertical;\n if (!innerNav) {\n this.createPopupIcon(ele);\n }\n innerNav = ele.querySelector('.' + CLS_TBARNAV);\n var innerNavDom = (vertical ? innerNav.offsetHeight : innerNav.offsetWidth);\n var eleWidth = ((vertical ? ele.offsetHeight : ele.offsetWidth) - (innerNavDom));\n this.element.classList.remove('e-rtl');\n setStyle(this.element, { direction: 'initial' });\n this.checkPriority(ele, innerEle, eleWidth, true);\n if (this.enableRtl) {\n this.element.classList.add('e-rtl');\n }\n this.element.style.removeProperty('direction');\n this.createPopup();\n };\n Toolbar.prototype.pushingPoppedEle = function (tbarObj, popupPri, ele, eleHeight, sepHeight) {\n var element = tbarObj.element;\n var poppedEle = [].slice.call(selectAll('.' + CLS_POPUP, element.querySelector('.' + CLS_ITEMS)));\n var nodes = selectAll('.' + CLS_TBAROVERFLOW, ele);\n var nodeIndex = 0;\n var nodePri = 0;\n poppedEle.forEach(function (el, index) {\n nodes = selectAll('.' + CLS_TBAROVERFLOW, ele);\n if (el.classList.contains(CLS_TBAROVERFLOW) && nodes.length > 0) {\n if (tbarObj.tbResize && nodes.length > index) {\n ele.insertBefore(el, nodes[parseInt(index.toString(), 10)]);\n ++nodePri;\n }\n else {\n ele.insertBefore(el, ele.children[nodes.length]);\n ++nodePri;\n }\n }\n else if (el.classList.contains(CLS_TBAROVERFLOW)) {\n ele.insertBefore(el, ele.firstChild);\n ++nodePri;\n }\n else if (tbarObj.tbResize && el.classList.contains(CLS_POPOVERFLOW) && ele.children.length > 0 && nodes.length === 0) {\n ele.insertBefore(el, ele.firstChild);\n ++nodePri;\n }\n else if (el.classList.contains(CLS_POPOVERFLOW)) {\n popupPri.push(el);\n }\n else if (tbarObj.tbResize) {\n ele.insertBefore(el, ele.childNodes[nodeIndex + nodePri]);\n ++nodeIndex;\n }\n else {\n ele.appendChild(el);\n }\n if (el.classList.contains(CLS_SEPARATOR)) {\n setStyle(el, { display: '', height: sepHeight + 'px' });\n }\n else {\n setStyle(el, { display: '', height: eleHeight + 'px' });\n }\n });\n popupPri.forEach(function (el) {\n ele.appendChild(el);\n });\n var tbarEle = selectAll('.' + CLS_ITEM, element.querySelector('.' + CLS_ITEMS));\n for (var i = tbarEle.length - 1; i >= 0; i--) {\n var tbarElement = tbarEle[parseInt(i.toString(), 10)];\n if (tbarElement.classList.contains(CLS_SEPARATOR) && this.overflowMode !== 'Extended') {\n setStyle(tbarElement, { display: 'none' });\n }\n else {\n break;\n }\n }\n };\n Toolbar.prototype.createPopup = function () {\n var element = this.element;\n var sepHeight;\n var sepItem;\n if (this.overflowMode === 'Extended') {\n sepItem = element.querySelector('.' + CLS_SEPARATOR);\n sepHeight =\n (element.style.height === 'auto' || element.style.height === '') ? null : (sepItem && sepItem.offsetHeight);\n }\n var eleItem = element.querySelector('.' + CLS_ITEM + ':not(.' + CLS_SEPARATOR + '):not(.' + CLS_POPUP + ')');\n var eleHeight = (element.style.height === 'auto' || element.style.height === '') ? null : (eleItem && eleItem.offsetHeight);\n var ele;\n var popupPri = [];\n if (select('#' + element.id + '_popup.' + CLS_POPUPCLASS, element)) {\n ele = select('#' + element.id + '_popup.' + CLS_POPUPCLASS, element);\n }\n else {\n var extendEle = this.createElement('div', {\n id: element.id + '_popup', className: CLS_POPUPCLASS + ' ' + CLS_EXTENDABLECLASS\n });\n var popupEle = this.createElement('div', { id: element.id + '_popup', className: CLS_POPUPCLASS });\n ele = this.overflowMode === 'Extended' ? extendEle : popupEle;\n }\n this.pushingPoppedEle(this, popupPri, ele, eleHeight, sepHeight);\n this.popupInit(element, ele);\n };\n Toolbar.prototype.getElementOffsetY = function () {\n return (this.overflowMode === 'Extended' && window.getComputedStyle(this.element).getPropertyValue('box-sizing') === 'border-box' ?\n this.element.clientHeight : this.element.offsetHeight);\n };\n Toolbar.prototype.popupInit = function (element, ele) {\n if (!this.popObj) {\n element.appendChild(ele);\n if (this.cssClass) {\n addClass([ele], this.cssClass.split(' '));\n }\n setStyle(this.element, { overflow: '' });\n var eleStyles = window.getComputedStyle(this.element);\n var popup = new Popup(null, {\n relateTo: this.element,\n offsetY: (this.isVertical) ? 0 : this.getElementOffsetY(),\n enableRtl: this.enableRtl,\n open: this.popupOpen.bind(this),\n close: this.popupClose.bind(this),\n collision: { Y: this.enableCollision ? 'flip' : 'none' },\n position: this.enableRtl ? { X: 'left', Y: 'top' } : { X: 'right', Y: 'top' }\n });\n if (this.overflowMode === 'Extended') {\n popup.width = this.getToolbarPopupWidth(this.element);\n popup.offsetX = 0;\n }\n popup.appendTo(ele);\n EventHandler.add(document, 'scroll', this.docEvent.bind(this));\n EventHandler.add(document, 'click ', this.docEvent.bind(this));\n if (this.overflowMode !== 'Extended') {\n popup.element.style.maxHeight = popup.element.offsetHeight + 'px';\n }\n if (this.isVertical) {\n popup.element.style.visibility = 'hidden';\n }\n if (this.isExtendedOpen) {\n var popupNav = this.element.querySelector('.' + CLS_TBARNAV);\n popupNav.classList.add(CLS_TBARNAVACT);\n classList(popupNav.firstElementChild, [CLS_POPUPICON], [CLS_POPUPDOWN]);\n this.element.querySelector('.' + CLS_EXTENDABLECLASS).classList.add(CLS_POPUPOPEN);\n }\n else {\n popup.hide();\n }\n this.popObj = popup;\n }\n else if (this.overflowMode !== 'Extended') {\n var popupEle = this.popObj.element;\n setStyle(popupEle, { maxHeight: '', display: 'block' });\n setStyle(popupEle, { maxHeight: popupEle.offsetHeight + 'px', display: '' });\n }\n };\n Toolbar.prototype.tbarPopupHandler = function (isOpen) {\n if (this.overflowMode === 'Extended') {\n if (isOpen) {\n this.add(this.element, CLS_EXTENDEDPOPOPEN);\n }\n else {\n this.remove(this.element, CLS_EXTENDEDPOPOPEN);\n }\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Toolbar.prototype.popupOpen = function (e) {\n var popObj = this.popObj;\n if (!this.isVertical) {\n popObj.offsetY = this.getElementOffsetY();\n popObj.dataBind();\n }\n var popupEle = this.popObj.element;\n var toolEle = this.popObj.element.parentElement;\n var popupNav = toolEle.querySelector('.' + CLS_TBARNAV);\n popupNav.setAttribute('aria-expanded', 'true');\n if (this.overflowMode === 'Extended') {\n popObj.element.style.minHeight = '';\n }\n else {\n setStyle(popObj.element, { height: 'auto', maxHeight: '' });\n popObj.element.style.maxHeight = popObj.element.offsetHeight + 'px';\n }\n var popupElePos = popupEle.offsetTop + popupEle.offsetHeight + calculatePosition(toolEle).top;\n var popIcon = popupNav.firstElementChild;\n popupNav.classList.add(CLS_TBARNAVACT);\n classList(popIcon, [CLS_POPUPICON], [CLS_POPUPDOWN]);\n this.tbarPopupHandler(true);\n var scrollVal = isNOU(window.scrollY) ? 0 : window.scrollY;\n if (!this.isVertical && ((window.innerHeight + scrollVal) < popupElePos) && (this.element.offsetTop < popupEle.offsetHeight)) {\n var overflowHeight = (popupEle.offsetHeight - ((popupElePos - window.innerHeight - scrollVal) + 5));\n popObj.height = overflowHeight + 'px';\n for (var i = 0; i <= popupEle.childElementCount; i++) {\n var ele = popupEle.children[parseInt(i.toString(), 10)];\n if (ele.offsetTop + ele.offsetHeight > overflowHeight) {\n overflowHeight = ele.offsetTop;\n break;\n }\n }\n if (this.overflowMode !== 'Extended') {\n setStyle(popObj.element, { maxHeight: overflowHeight + 'px' });\n }\n }\n else if (this.isVertical && this.overflowMode !== 'Extended') {\n var tbEleData = this.element.getBoundingClientRect();\n setStyle(popObj.element, { maxHeight: (tbEleData.top + this.element.offsetHeight) + 'px', bottom: 0, visibility: '' });\n }\n if (popObj) {\n var popupOffset = popupEle.getBoundingClientRect();\n if (popupOffset.right > document.documentElement.clientWidth && popupOffset.width > toolEle.getBoundingClientRect().width) {\n popObj.collision = { Y: 'none' };\n popObj.dataBind();\n }\n popObj.refreshPosition();\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Toolbar.prototype.popupClose = function (e) {\n var element = this.element;\n var popupNav = element.querySelector('.' + CLS_TBARNAV);\n popupNav.setAttribute('aria-expanded', 'false');\n var popIcon = popupNav.firstElementChild;\n popupNav.classList.remove(CLS_TBARNAVACT);\n classList(popIcon, [CLS_POPUPDOWN], [CLS_POPUPICON]);\n this.tbarPopupHandler(false);\n };\n Toolbar.prototype.checkPriority = function (ele, inEle, eleWidth, pre) {\n var popPriority = this.popupPriCount > 0;\n var len = inEle.length;\n var eleWid = eleWidth;\n var eleOffset;\n var checkoffset;\n var sepCheck = 0;\n var itemCount = 0;\n var itemPopCount = 0;\n var checkClass = function (ele, val) {\n var rVal = false;\n val.forEach(function (cls) {\n if (ele.classList.contains(cls)) {\n rVal = true;\n }\n });\n return rVal;\n };\n for (var i = len - 1; i >= 0; i--) {\n var mrgn = void 0;\n var compuStyle = window.getComputedStyle(inEle[parseInt(i.toString(), 10)]);\n if (this.isVertical) {\n mrgn = parseFloat((compuStyle).marginTop);\n mrgn += parseFloat((compuStyle).marginBottom);\n }\n else {\n mrgn = parseFloat((compuStyle).marginRight);\n mrgn += parseFloat((compuStyle).marginLeft);\n }\n var fstEleCheck = inEle[parseInt(i.toString(), 10)] === this.tbarEle[0];\n if (fstEleCheck) {\n this.tbarEleMrgn = mrgn;\n }\n eleOffset = this.isVertical ? inEle[parseInt(i.toString(), 10)].offsetHeight : inEle[parseInt(i.toString(), 10)].offsetWidth;\n var eleWid_1 = fstEleCheck ? (eleOffset + mrgn) : eleOffset;\n if (checkClass(inEle[parseInt(i.toString(), 10)], [CLS_POPPRI]) && popPriority) {\n inEle[parseInt(i.toString(), 10)].classList.add(CLS_POPUP);\n if (this.isVertical) {\n setStyle(inEle[parseInt(i.toString(), 10)], { display: 'none', minHeight: eleWid_1 + 'px' });\n }\n else {\n setStyle(inEle[parseInt(i.toString(), 10)], { display: 'none', minWidth: eleWid_1 + 'px' });\n }\n itemPopCount++;\n }\n if (this.isVertical) {\n checkoffset =\n (inEle[parseInt(i.toString(), 10)].offsetTop + inEle[parseInt(i.toString(), 10)].offsetHeight + mrgn) > eleWidth;\n }\n else {\n checkoffset =\n (inEle[parseInt(i.toString(), 10)].offsetLeft + inEle[parseInt(i.toString(), 10)].offsetWidth + mrgn) > eleWidth;\n }\n if (checkoffset) {\n if (inEle[parseInt(i.toString(), 10)].classList.contains(CLS_SEPARATOR)) {\n if (this.overflowMode === 'Extended') {\n var sepEle = inEle[parseInt(i.toString(), 10)];\n if (checkClass(sepEle, [CLS_SEPARATOR, CLS_TBARIGNORE])) {\n inEle[parseInt(i.toString(), 10)].classList.add(CLS_POPUP);\n itemPopCount++;\n }\n itemCount++;\n }\n else if (this.overflowMode === 'Popup') {\n if (sepCheck > 0 && itemCount === itemPopCount) {\n var sepEle = inEle[i + itemCount + (sepCheck - 1)];\n if (checkClass(sepEle, [CLS_SEPARATOR, CLS_TBARIGNORE])) {\n setStyle(sepEle, { display: 'none' });\n }\n }\n sepCheck++;\n itemCount = 0;\n itemPopCount = 0;\n }\n }\n else {\n itemCount++;\n }\n if (inEle[parseInt(i.toString(), 10)].classList.contains(CLS_TBAROVERFLOW) && pre) {\n eleWidth -= ((this.isVertical ? inEle[parseInt(i.toString(), 10)].offsetHeight :\n inEle[parseInt(i.toString(), 10)].offsetWidth) + (mrgn));\n }\n else if (!checkClass(inEle[parseInt(i.toString(), 10)], [CLS_SEPARATOR, CLS_TBARIGNORE])) {\n inEle[parseInt(i.toString(), 10)].classList.add(CLS_POPUP);\n if (this.isVertical) {\n setStyle(inEle[parseInt(i.toString(), 10)], { display: 'none', minHeight: eleWid_1 + 'px' });\n }\n else {\n setStyle(inEle[parseInt(i.toString(), 10)], { display: 'none', minWidth: eleWid_1 + 'px' });\n }\n itemPopCount++;\n }\n else {\n eleWidth -= ((this.isVertical ? inEle[parseInt(i.toString(), 10)].offsetHeight :\n inEle[parseInt(i.toString(), 10)].offsetWidth) + (mrgn));\n }\n }\n }\n if (pre) {\n var popedEle = selectAll('.' + CLS_ITEM + ':not(.' + CLS_POPUP + ')', this.element);\n this.checkPriority(ele, popedEle, eleWid, false);\n }\n };\n Toolbar.prototype.createPopupIcon = function (element) {\n var id = element.id.concat('_nav');\n var className = 'e-' + element.id.concat('_nav ' + CLS_POPUPNAV);\n className = this.overflowMode === 'Extended' ? className + ' ' + CLS_EXTENDPOPUP : className;\n var nav = this.createElement('div', { id: id, className: className });\n if (Browser.info.name === 'msie' || Browser.info.name === 'edge') {\n nav.classList.add('e-ie-align');\n }\n var navItem = this.createElement('div', { className: CLS_POPUPDOWN + ' e-icons' });\n nav.appendChild(navItem);\n nav.setAttribute('tabindex', '0');\n nav.setAttribute('role', 'button');\n element.appendChild(nav);\n };\n Toolbar.prototype.tbarPriRef = function (inEle, indx, sepPri, el, des, elWid, wid, ig, eleStyles) {\n var ignoreCount = ig;\n var popEle = this.popObj.element;\n var query = '.' + CLS_ITEM + ':not(.' + CLS_SEPARATOR + '):not(.' + CLS_TBAROVERFLOW + ')';\n var priEleCnt = selectAll('.' + CLS_POPUP + ':not(.' + CLS_TBAROVERFLOW + ')', popEle).length;\n var checkClass = function (ele, val) {\n return ele.classList.contains(val);\n };\n if (selectAll(query, inEle).length === 0) {\n var eleSep = inEle.children[indx - (indx - sepPri) - 1];\n var ignoreCheck = (!isNOU(eleSep) && checkClass(eleSep, CLS_TBARIGNORE));\n if ((!isNOU(eleSep) && checkClass(eleSep, CLS_SEPARATOR) && !isVisible(eleSep)) || ignoreCheck) {\n eleSep.style.display = 'unset';\n var eleSepWidth = eleSep.offsetWidth + (parseFloat(window.getComputedStyle(eleSep).marginRight) * 2);\n var prevSep = eleSep.previousElementSibling;\n if ((elWid + eleSepWidth) < wid || des) {\n inEle.insertBefore(el, inEle.children[(indx + ignoreCount) - (indx - sepPri)]);\n if (!isNOU(prevSep)) {\n prevSep.style.display = '';\n }\n }\n else {\n setStyle(el, eleStyles);\n if (prevSep.classList.contains(CLS_SEPARATOR)) {\n prevSep.style.display = 'none';\n }\n }\n eleSep.style.display = '';\n }\n else {\n inEle.insertBefore(el, inEle.children[(indx + ignoreCount) - (indx - sepPri)]);\n }\n }\n else {\n inEle.insertBefore(el, inEle.children[(indx + ignoreCount) - priEleCnt]);\n }\n };\n Toolbar.prototype.popupRefresh = function (popupEle, destroy) {\n var _this = this;\n var ele = this.element;\n var isVer = this.isVertical;\n var innerEle = ele.querySelector('.' + CLS_ITEMS);\n var popNav = ele.querySelector('.' + CLS_TBARNAV);\n if (isNOU(popNav)) {\n return;\n }\n innerEle.removeAttribute('style');\n popupEle.style.display = 'block';\n var dimension;\n if (isVer) {\n dimension = ele.offsetHeight - (popNav.offsetHeight + innerEle.offsetHeight);\n }\n else {\n dimension = ele.offsetWidth - (popNav.offsetWidth + innerEle.offsetWidth);\n }\n var popupEleWidth = 0;\n [].slice.call(popupEle.children).forEach(function (el) {\n popupEleWidth += _this.popupEleWidth(el);\n setStyle(el, { 'position': '' });\n });\n if ((dimension + (isVer ? popNav.offsetHeight : popNav.offsetWidth)) > (popupEleWidth) && this.popupPriCount === 0) {\n destroy = true;\n }\n this.popupEleRefresh(dimension, popupEle, destroy);\n popupEle.style.display = '';\n if (popupEle.children.length === 0 && popNav && this.popObj) {\n detach(popNav);\n popNav = null;\n this.popObj.destroy();\n detach(this.popObj.element);\n this.popObj = null;\n }\n };\n Toolbar.prototype.ignoreEleFetch = function (index, innerEle) {\n var ignoreEle = [].slice.call(innerEle.querySelectorAll('.' + CLS_TBARIGNORE));\n var ignoreInx = [];\n var count = 0;\n if (ignoreEle.length > 0) {\n ignoreEle.forEach(function (ele) {\n ignoreInx.push([].slice.call(innerEle.children).indexOf(ele));\n });\n }\n else {\n return 0;\n }\n ignoreInx.forEach(function (val) {\n if (val <= index) {\n count++;\n }\n });\n return count;\n };\n Toolbar.prototype.checkPopupRefresh = function (root, popEle) {\n popEle.style.display = 'block';\n var elWid = this.popupEleWidth(popEle.firstElementChild);\n popEle.firstElementChild.style.removeProperty('Position');\n var tbarWidth = root.offsetWidth - root.querySelector('.' + CLS_TBARNAV).offsetWidth;\n var tbarItemsWid = root.querySelector('.' + CLS_ITEMS).offsetWidth;\n popEle.style.removeProperty('display');\n if (tbarWidth > (elWid + tbarItemsWid)) {\n return true;\n }\n return false;\n };\n Toolbar.prototype.popupEleWidth = function (el) {\n el.style.position = 'absolute';\n var elWidth = this.isVertical ? el.offsetHeight : el.offsetWidth;\n var btnText = el.querySelector('.' + CLS_TBARBTNTEXT);\n if (el.classList.contains('e-tbtn-align') || el.classList.contains(CLS_TBARTEXT)) {\n var btn = el.children[0];\n if (!isNOU(btnText) && el.classList.contains(CLS_TBARTEXT)) {\n btnText.style.display = 'none';\n }\n else if (!isNOU(btnText) && el.classList.contains(CLS_POPUPTEXT)) {\n btnText.style.display = 'block';\n }\n btn.style.minWidth = '0%';\n elWidth = parseFloat(!this.isVertical ? el.style.minWidth : el.style.minHeight);\n btn.style.minWidth = '';\n btn.style.minHeight = '';\n if (!isNOU(btnText)) {\n btnText.style.display = '';\n }\n }\n return elWidth;\n };\n Toolbar.prototype.popupEleRefresh = function (width, popupEle, destroy) {\n var popPriority = this.popupPriCount > 0;\n var eleSplice = this.tbarEle;\n var priEleCnt;\n var index;\n var innerEle = this.element.querySelector('.' + CLS_ITEMS);\n var ignoreCount = 0;\n var _loop_1 = function (el) {\n if (el.classList.contains(CLS_POPPRI) && popPriority && !destroy) {\n return \"continue\";\n }\n var elWidth = this_1.popupEleWidth(el);\n if (el === this_1.tbarEle[0]) {\n elWidth += this_1.tbarEleMrgn;\n }\n el.style.position = '';\n if (elWidth < width || destroy) {\n var inlineStyles = { minWidth: el.style.minWidth, height: el.style.height, minHeight: el.style.minHeight };\n setStyle(el, { minWidth: '', height: '', minHeight: '' });\n if (!el.classList.contains(CLS_POPOVERFLOW)) {\n el.classList.remove(CLS_POPUP);\n }\n index = this_1.tbarEle.indexOf(el);\n if (this_1.tbarAlign) {\n var pos = this_1.items[parseInt(index.toString(), 10)].align;\n index = this_1.tbarAlgEle[(pos + 's').toLowerCase()].indexOf(el);\n eleSplice = this_1.tbarAlgEle[(pos + 's').toLowerCase()];\n innerEle = this_1.element.querySelector('.' + CLS_ITEMS + ' .' + 'e-toolbar-' + pos.toLowerCase());\n }\n var sepBeforePri_1 = 0;\n if (this_1.overflowMode !== 'Extended') {\n eleSplice.slice(0, index).forEach(function (el) {\n if (el.classList.contains(CLS_TBAROVERFLOW) || el.classList.contains(CLS_SEPARATOR)) {\n if (el.classList.contains(CLS_SEPARATOR)) {\n el.style.display = '';\n width -= el.offsetWidth;\n }\n sepBeforePri_1++;\n }\n });\n }\n ignoreCount = this_1.ignoreEleFetch(index, innerEle);\n if (el.classList.contains(CLS_TBAROVERFLOW)) {\n this_1.tbarPriRef(innerEle, index, sepBeforePri_1, el, destroy, elWidth, width, ignoreCount, inlineStyles);\n width -= el.offsetWidth;\n }\n else if (index === 0) {\n innerEle.insertBefore(el, innerEle.firstChild);\n width -= el.offsetWidth;\n }\n else {\n priEleCnt = selectAll('.' + CLS_TBAROVERFLOW, this_1.popObj.element).length;\n innerEle.insertBefore(el, innerEle.children[(index + ignoreCount) - priEleCnt]);\n width -= el.offsetWidth;\n }\n el.style.height = '';\n }\n else {\n return \"break\";\n }\n };\n var this_1 = this;\n for (var _i = 0, _a = [].slice.call(popupEle.children); _i < _a.length; _i++) {\n var el = _a[_i];\n var state_1 = _loop_1(el);\n if (state_1 === \"break\")\n break;\n }\n var checkOverflow = this.checkOverflow(this.element, this.element.getElementsByClassName(CLS_ITEMS)[0]);\n if (checkOverflow && !destroy) {\n this.renderOverflowMode();\n }\n };\n Toolbar.prototype.removePositioning = function () {\n var item = this.element.querySelector('.' + CLS_ITEMS);\n if (isNOU(item) || !item.classList.contains(CLS_TBARPOS)) {\n return;\n }\n this.remove(item, CLS_TBARPOS);\n var innerItem = [].slice.call(item.childNodes);\n innerItem[1].removeAttribute('style');\n innerItem[2].removeAttribute('style');\n };\n Toolbar.prototype.refreshPositioning = function () {\n var item = this.element.querySelector('.' + CLS_ITEMS);\n this.add(item, CLS_TBARPOS);\n this.itemPositioning();\n };\n Toolbar.prototype.itemPositioning = function () {\n var item = this.element.querySelector('.' + CLS_ITEMS);\n var margin;\n if (isNOU(item) || !item.classList.contains(CLS_TBARPOS)) {\n return;\n }\n var popupNav = this.element.querySelector('.' + CLS_TBARNAV);\n var innerItem;\n if (this.scrollModule) {\n var trgClass = (this.isVertical) ? CLS_VSCROLLCNT : CLS_HSCROLLCNT;\n innerItem = [].slice.call(item.querySelector('.' + trgClass).children);\n }\n else {\n innerItem = [].slice.call(item.childNodes);\n }\n if (this.isVertical) {\n margin = innerItem[0].offsetHeight + innerItem[2].offsetHeight;\n }\n else {\n margin = innerItem[0].offsetWidth + innerItem[2].offsetWidth;\n }\n var tbarWid = this.isVertical ? this.element.offsetHeight : this.element.offsetWidth;\n if (popupNav) {\n tbarWid -= (this.isVertical ? popupNav.offsetHeight : popupNav.offsetWidth);\n var popWid = (this.isVertical ? popupNav.offsetHeight : popupNav.offsetWidth) + 'px';\n innerItem[2].removeAttribute('style');\n if (this.isVertical) {\n if (this.enableRtl) {\n innerItem[2].style.top = popWid;\n }\n else {\n innerItem[2].style.bottom = popWid;\n }\n }\n else {\n if (this.enableRtl) {\n innerItem[2].style.left = popWid;\n }\n else {\n innerItem[2].style.right = popWid;\n }\n }\n }\n if (tbarWid <= margin) {\n return;\n }\n var value = (((tbarWid - margin)) - (!this.isVertical ? innerItem[1].offsetWidth : innerItem[1].offsetHeight)) / 2;\n innerItem[1].removeAttribute('style');\n var mrgn = ((!this.isVertical ? innerItem[0].offsetWidth : innerItem[0].offsetHeight) + value) + 'px';\n if (this.isVertical) {\n if (this.enableRtl) {\n innerItem[1].style.marginBottom = mrgn;\n }\n else {\n innerItem[1].style.marginTop = mrgn;\n }\n }\n else {\n if (this.enableRtl) {\n innerItem[1].style.marginRight = mrgn;\n }\n else {\n innerItem[1].style.marginLeft = mrgn;\n }\n }\n };\n Toolbar.prototype.tbarItemAlign = function (item, itemEle, pos) {\n var _this = this;\n if (item.showAlwaysInPopup && item.overflow !== 'Show') {\n return;\n }\n var alignDiv = [];\n alignDiv.push(this.createElement('div', { className: CLS_TBARLEFT }));\n alignDiv.push(this.createElement('div', { className: CLS_TBARCENTER }));\n alignDiv.push(this.createElement('div', { className: CLS_TBARRIGHT }));\n if (pos === 0 && item.align !== 'Left') {\n alignDiv.forEach(function (ele) {\n itemEle.appendChild(ele);\n });\n this.tbarAlign = true;\n this.add(itemEle, CLS_TBARPOS);\n }\n else if (item.align !== 'Left') {\n var alignEle = itemEle.childNodes;\n var leftAlign_1 = alignDiv[0];\n [].slice.call(alignEle).forEach(function (el) {\n _this.tbarAlgEle.lefts.push(el);\n leftAlign_1.appendChild(el);\n });\n itemEle.appendChild(leftAlign_1);\n itemEle.appendChild(alignDiv[1]);\n itemEle.appendChild(alignDiv[2]);\n this.tbarAlign = true;\n this.add(itemEle, CLS_TBARPOS);\n }\n };\n Toolbar.prototype.ctrlTemplate = function () {\n var _this = this;\n this.ctrlTem = this.trgtEle.cloneNode(true);\n this.add(this.trgtEle, CLS_ITEMS);\n this.tbarEle = [];\n var innerEle = [].slice.call(this.trgtEle.children);\n innerEle.forEach(function (ele) {\n if (ele.tagName === 'DIV') {\n _this.tbarEle.push(ele);\n if (!isNOU(ele.firstElementChild)) {\n ele.firstElementChild.setAttribute('aria-disabled', 'false');\n }\n _this.add(ele, CLS_ITEM);\n }\n });\n };\n Toolbar.prototype.renderItems = function () {\n var ele = this.element;\n var items = this.items;\n if (this.trgtEle != null) {\n this.ctrlTemplate();\n }\n else if (ele && items.length > 0) {\n var itemEleDom = void 0;\n if (ele && ele.children.length > 0) {\n itemEleDom = ele.querySelector('.' + CLS_ITEMS);\n }\n if (!itemEleDom) {\n itemEleDom = this.createElement('div', { className: CLS_ITEMS });\n }\n this.itemsAlign(items, itemEleDom);\n ele.appendChild(itemEleDom);\n }\n };\n Toolbar.prototype.setAttr = function (attr, element) {\n var key = Object.keys(attr);\n var keyVal;\n for (var i = 0; i < key.length; i++) {\n keyVal = key[parseInt(i.toString(), 10)];\n if (keyVal === 'class') {\n this.add(element, attr[\"\" + keyVal]);\n }\n else {\n element.setAttribute(keyVal, attr[\"\" + keyVal]);\n }\n }\n };\n /**\n * Enables or disables the specified Toolbar item.\n *\n * @param {number|HTMLElement|NodeList} items - DOM element or an array of items to be enabled or disabled.\n * @param {boolean} isEnable - Boolean value that determines whether the command should be enabled or disabled.\n * By default, `isEnable` is set to true.\n * @returns {void}.\n */\n Toolbar.prototype.enableItems = function (items, isEnable) {\n var elements = items;\n var len = elements.length;\n var ele;\n if (isNOU(isEnable)) {\n isEnable = true;\n }\n var enable = function (isEnable, ele) {\n if (isEnable) {\n ele.classList.remove(CLS_DISABLE);\n if (!isNOU(ele.firstElementChild)) {\n ele.firstElementChild.setAttribute('aria-disabled', 'false');\n }\n }\n else {\n ele.classList.add(CLS_DISABLE);\n if (!isNOU(ele.firstElementChild)) {\n ele.firstElementChild.setAttribute('aria-disabled', 'true');\n }\n }\n };\n if (!isNOU(len) && len >= 1) {\n for (var a = 0, element = [].slice.call(elements); a < len; a++) {\n var itemElement = element[parseInt(a.toString(), 10)];\n if (typeof (itemElement) === 'number') {\n ele = this.getElementByIndex(itemElement);\n if (isNOU(ele)) {\n return;\n }\n else {\n elements[parseInt(a.toString(), 10)] = ele;\n }\n }\n else {\n ele = itemElement;\n }\n enable(isEnable, ele);\n }\n if (isEnable) {\n removeClass(elements, CLS_DISABLE);\n }\n else {\n addClass(elements, CLS_DISABLE);\n }\n }\n else {\n if (typeof (elements) === 'number') {\n ele = this.getElementByIndex(elements);\n if (isNOU(ele)) {\n return;\n }\n }\n else {\n ele = items;\n }\n enable(isEnable, ele);\n }\n };\n Toolbar.prototype.getElementByIndex = function (index) {\n if (this.tbarEle[parseInt(index.toString(), 10)]) {\n return this.tbarEle[parseInt(index.toString(), 10)];\n }\n return null;\n };\n /**\n * Adds new items to the Toolbar that accepts an array as Toolbar items.\n *\n * @param {ItemModel[]} items - DOM element or an array of items to be added to the Toolbar.\n * @param {number} index - Number value that determines where the command is to be added. By default, index is 0.\n * @returns {void}.\n */\n Toolbar.prototype.addItems = function (items, index) {\n var innerItems;\n this.extendedOpen();\n var itemsDiv = this.element.querySelector('.' + CLS_ITEMS);\n if (isNOU(itemsDiv)) {\n this.itemsRerender(items);\n return;\n }\n var innerEle;\n var itemAgn = 'Left';\n if (isNOU(index)) {\n index = 0;\n }\n items.forEach(function (e) {\n if (!isNOU(e.align) && e.align !== 'Left' && itemAgn === 'Left') {\n itemAgn = e.align;\n }\n });\n for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {\n var item = items_1[_i];\n if (isNOU(item.type)) {\n item.type = 'Button';\n }\n innerItems = selectAll('.' + CLS_ITEM, this.element);\n item.align = itemAgn;\n innerEle = this.renderSubComponent(item, index);\n if (this.tbarEle.length >= index && innerItems.length >= 0) {\n if (isNOU(this.scrollModule)) {\n this.destroyMode();\n }\n var algIndex = item.align[0] === 'L' ? 0 : item.align[0] === 'C' ? 1 : 2;\n var ele = void 0;\n if (!this.tbarAlign && itemAgn !== 'Left') {\n this.tbarItemAlign(item, itemsDiv, 1);\n this.tbarAlign = true;\n ele = closest(innerItems[0], '.' + CLS_ITEMS).children[parseInt(algIndex.toString(), 10)];\n ele.appendChild(innerEle);\n this.tbarAlgEle[(item.align + 's').toLowerCase()].push(innerEle);\n this.refreshPositioning();\n }\n else if (this.tbarAlign) {\n ele = closest(innerItems[0], '.' + CLS_ITEMS).children[parseInt(algIndex.toString(), 10)];\n ele.insertBefore(innerEle, ele.children[parseInt(index.toString(), 10)]);\n this.tbarAlgEle[(item.align + 's').toLowerCase()].splice(index, 0, innerEle);\n this.refreshPositioning();\n }\n else if (innerItems.length === 0) {\n innerItems = selectAll('.' + CLS_ITEMS, this.element);\n innerItems[0].appendChild(innerEle);\n }\n else {\n innerItems[0].parentNode.insertBefore(innerEle, innerItems[parseInt(index.toString(), 10)]);\n }\n this.items.splice(index, 0, item);\n if (item.template) {\n this.tbarEle.splice(this.tbarEle.length - 1, 1);\n }\n this.tbarEle.splice(index, 0, innerEle);\n index++;\n this.offsetWid = itemsDiv.offsetWidth;\n }\n }\n itemsDiv.style.width = '';\n this.renderOverflowMode();\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n /**\n * Removes the items from the Toolbar. Acceptable arguments are index of item/HTMLElement/node list.\n *\n * @param {number|HTMLElement|NodeList|HTMLElement[]} args\n * Index or DOM element or an Array of item which is to be removed from the Toolbar.\n * @returns {void}.\n */\n Toolbar.prototype.removeItems = function (args) {\n var elements = args;\n var index;\n var innerItems = [].slice.call(selectAll('.' + CLS_ITEM, this.element));\n if (typeof (elements) === 'number') {\n index = parseInt(args.toString(), 10);\n this.removeItemByIndex(index, innerItems);\n }\n else {\n if (elements && elements.length > 1) {\n for (var _i = 0, _a = [].slice.call(elements); _i < _a.length; _i++) {\n var ele = _a[_i];\n index = this.tbarEle.indexOf(ele);\n this.removeItemByIndex(index, innerItems);\n innerItems = selectAll('.' + CLS_ITEM, this.element);\n }\n }\n else {\n var ele = (elements && elements.length && elements.length === 1) ? elements[0] : args;\n index = innerItems.indexOf(ele);\n this.removeItemByIndex(index, innerItems);\n }\n }\n this.resize();\n };\n Toolbar.prototype.removeItemByIndex = function (index, innerItems) {\n if (this.tbarEle[parseInt(index.toString(), 10)] && innerItems[parseInt(index.toString(), 10)]) {\n var eleIdx = this.tbarEle.indexOf(innerItems[parseInt(index.toString(), 10)]);\n if (this.tbarAlign) {\n var indexAgn = this.tbarAlgEle[(this.items[parseInt(eleIdx.toString(), 10)].align + 's').toLowerCase()].indexOf(this.tbarEle[parseInt(eleIdx.toString(), 10)]);\n this.tbarAlgEle[(this.items[parseInt(eleIdx.toString(), 10)].align + 's').toLowerCase()].splice(parseInt(indexAgn.toString(), 10), 1);\n }\n if (this.isReact) {\n this.clearToolbarTemplate(innerItems[parseInt(index.toString(), 10)]);\n }\n var btnItem = innerItems[parseInt(index.toString(), 10)].querySelector('.e-control.e-btn');\n if (!isNOU(btnItem) && !isNOU(btnItem.ej2_instances[0]) && !(btnItem.ej2_instances[0].isDestroyed)) {\n btnItem.ej2_instances[0].destroy();\n }\n detach(innerItems[parseInt(index.toString(), 10)]);\n this.items.splice(eleIdx, 1);\n this.tbarEle.splice(eleIdx, 1);\n }\n };\n Toolbar.prototype.templateRender = function (templateProp, innerEle, item, index) {\n var itemType = item.type;\n var eleObj = templateProp;\n var isComponent;\n if (typeof (templateProp) === 'object') {\n isComponent = typeof (eleObj.appendTo) === 'function';\n }\n if (typeof (templateProp) === 'string' || !isComponent) {\n var templateFn = void 0;\n var val = templateProp;\n var regEx = new RegExp(/<(?=.*? .*?\\/ ?>|br|hr|input|!--|wbr)[a-z]+.*?>|<([a-z]+).*?<\\/\\1>/i);\n val = (typeof (templateProp) === 'string') ? templateProp.trim() : templateProp;\n try {\n if (typeof (templateProp) === 'object' && !isNOU(templateProp.tagName)) {\n innerEle.appendChild(templateProp);\n }\n else if (typeof (templateProp) === 'string' && regEx.test(val)) {\n innerEle.innerHTML = val;\n }\n else if (document.querySelectorAll(val).length) {\n var ele = document.querySelector(val);\n var tempStr = ele.outerHTML.trim();\n innerEle.appendChild(ele);\n ele.style.display = '';\n if (!isNOU(tempStr)) {\n this.tempId.push(val);\n }\n }\n else {\n templateFn = templateCompiler(val);\n }\n }\n catch (e) {\n templateFn = templateCompiler(val);\n }\n var tempArray = void 0;\n if (!isNOU(templateFn)) {\n var toolbarTemplateID = this.element.id + index + '_template';\n tempArray = templateFn({}, this, 'template', toolbarTemplateID, this.isStringTemplate, undefined, undefined, this.root);\n }\n if (!isNOU(tempArray) && tempArray.length > 0) {\n [].slice.call(tempArray).forEach(function (ele) {\n if (!isNOU(ele.tagName)) {\n ele.style.display = '';\n }\n innerEle.appendChild(ele);\n });\n }\n }\n else if (itemType === 'Input') {\n var ele = this.createElement('input');\n if (item.id) {\n ele.id = item.id;\n }\n else {\n ele.id = getUniqueID('tbr-ipt');\n }\n innerEle.appendChild(ele);\n eleObj.appendTo(ele);\n }\n this.add(innerEle, CLS_TEMPLATE);\n var firstChild = innerEle.firstElementChild;\n if (!isNOU(firstChild)) {\n firstChild.setAttribute('tabindex', isNOU(firstChild.getAttribute(\"tabIndex\")) ? '-1' : this.getDataTabindex(firstChild));\n firstChild.setAttribute('data-tabindex', isNOU(firstChild.getAttribute(\"tabIndex\")) ? '-1' : this.getDataTabindex(firstChild));\n }\n this.tbarEle.push(innerEle);\n };\n Toolbar.prototype.buttonRendering = function (item, innerEle) {\n var dom = this.createElement('button', { className: CLS_TBARBTN });\n dom.setAttribute('type', 'button');\n var textStr = item.text;\n var iconCss;\n var iconPos;\n if (item.id) {\n dom.id = item.id;\n }\n else {\n dom.id = getUniqueID('e-tbr-btn');\n }\n var btnTxt = this.createElement('span', { className: 'e-tbar-btn-text' });\n if (textStr) {\n btnTxt.innerHTML = this.enableHtmlSanitizer ? SanitizeHtmlHelper.sanitize(textStr) : textStr;\n dom.appendChild(btnTxt);\n dom.classList.add('e-tbtn-txt');\n }\n else {\n this.add(innerEle, 'e-tbtn-align');\n }\n if (item.prefixIcon || item.suffixIcon) {\n if ((item.prefixIcon && item.suffixIcon) || item.prefixIcon) {\n iconCss = item.prefixIcon + ' e-icons';\n iconPos = 'Left';\n }\n else {\n iconCss = item.suffixIcon + ' e-icons';\n iconPos = 'Right';\n }\n }\n var btnObj = new Button({ iconCss: iconCss, iconPosition: iconPos });\n btnObj.createElement = this.createElement;\n btnObj.appendTo(dom);\n if (item.width) {\n setStyle(dom, { 'width': formatUnit(item.width) });\n }\n return dom;\n };\n Toolbar.prototype.renderSubComponent = function (item, index) {\n var dom;\n var innerEle = this.createElement('div', { className: CLS_ITEM });\n var tempDom = this.createElement('div', {\n innerHTML: this.enableHtmlSanitizer && !isNOU(item.tooltipText) ?\n SanitizeHtmlHelper.sanitize(item.tooltipText) : item.tooltipText\n });\n if (!this.tbarEle) {\n this.tbarEle = [];\n }\n if (item.htmlAttributes) {\n this.setAttr(item.htmlAttributes, innerEle);\n }\n if (item.tooltipText) {\n innerEle.setAttribute('title', tempDom.textContent);\n }\n if (item.cssClass) {\n innerEle.className = innerEle.className + ' ' + item.cssClass;\n }\n if (item.template) {\n this.templateRender(item.template, innerEle, item, index);\n }\n else {\n switch (item.type) {\n case 'Button':\n dom = this.buttonRendering(item, innerEle);\n dom.setAttribute('tabindex', isNOU(item.tabIndex) ? '-1' : item.tabIndex.toString());\n dom.setAttribute('data-tabindex', isNOU(item.tabIndex) ? '-1' : item.tabIndex.toString());\n dom.setAttribute('aria-label', (item.text || item.tooltipText));\n dom.setAttribute('aria-disabled', 'false');\n innerEle.appendChild(dom);\n innerEle.addEventListener('click', this.itemClick.bind(this));\n break;\n case 'Separator':\n this.add(innerEle, CLS_SEPARATOR);\n break;\n }\n }\n if (item.showTextOn) {\n var sTxt = item.showTextOn;\n if (sTxt === 'Toolbar') {\n this.add(innerEle, CLS_POPUPTEXT);\n this.add(innerEle, 'e-tbtn-align');\n }\n else if (sTxt === 'Overflow') {\n this.add(innerEle, CLS_TBARTEXT);\n }\n }\n if (item.overflow) {\n var overflow = item.overflow;\n if (overflow === 'Show') {\n this.add(innerEle, CLS_TBAROVERFLOW);\n }\n else if (overflow === 'Hide') {\n if (!innerEle.classList.contains(CLS_SEPARATOR)) {\n this.add(innerEle, CLS_POPOVERFLOW);\n }\n }\n }\n if (item.overflow !== 'Show' && item.showAlwaysInPopup && !innerEle.classList.contains(CLS_SEPARATOR)) {\n this.add(innerEle, CLS_POPPRI);\n this.popupPriCount++;\n }\n if (item.disabled) {\n this.add(innerEle, CLS_DISABLE);\n }\n if (item.visible === false) {\n this.add(innerEle, CLS_HIDDEN);\n }\n return innerEle;\n };\n Toolbar.prototype.getDataTabindex = function (ele) {\n return isNOU(ele.getAttribute('data-tabindex')) ? '-1' : ele.getAttribute('data-tabindex');\n };\n Toolbar.prototype.itemClick = function (e) {\n this.activeEleSwitch(e.currentTarget);\n };\n Toolbar.prototype.activeEleSwitch = function (ele) {\n this.activeEleRemove(ele.firstElementChild);\n this.activeEle.focus();\n };\n Toolbar.prototype.activeEleRemove = function (curEle) {\n var previousEle = this.element.querySelector('.' + CLS_ITEM + ':not(.' + CLS_DISABLE + ' ):not(.' + CLS_SEPARATOR + ' ):not(.' + CLS_HIDDEN + ' )');\n if (!isNOU(this.activeEle)) {\n this.activeEle.setAttribute('tabindex', this.getDataTabindex(this.activeEle));\n if (previousEle) {\n previousEle.removeAttribute('tabindex');\n }\n previousEle = this.activeEle;\n }\n this.activeEle = curEle;\n if (this.getDataTabindex(this.activeEle) === '-1') {\n if (isNOU(this.trgtEle) && !curEle.parentElement.classList.contains(CLS_TEMPLATE)) {\n if (!isNOU(this.element.querySelector('.e-hor-nav')) && this.element.querySelector('.e-hor-nav').classList.contains('e-nav-active')) {\n this.updateTabIndex('0');\n this.getDataTabindex(previousEle) === '-1' ? previousEle.setAttribute('tabindex', '0') :\n previousEle.setAttribute('tabindex', this.getDataTabindex(previousEle));\n }\n else {\n this.updateTabIndex('-1');\n }\n curEle.removeAttribute('tabindex');\n }\n else {\n var tabIndex = parseInt(this.getDataTabindex(this.activeEle)) + 1;\n this.activeEle.setAttribute('tabindex', tabIndex.toString());\n }\n }\n };\n Toolbar.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Returns the current module name.\n *\n * @returns {string} - Returns the module name as string.\n * @private\n */\n Toolbar.prototype.getModuleName = function () {\n return 'toolbar';\n };\n Toolbar.prototype.itemsRerender = function (newProp) {\n this.items = this.tbarItemsCol;\n if (this.isReact || this.isAngular) {\n this.clearTemplate();\n }\n this.destroyMode();\n this.destroyItems();\n this.items = newProp;\n this.tbarItemsCol = this.items;\n this.renderItems();\n this.renderOverflowMode();\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n Toolbar.prototype.resize = function () {\n var ele = this.element;\n this.tbResize = true;\n if (this.tbarAlign) {\n this.itemPositioning();\n }\n if (this.popObj && this.overflowMode === 'Popup') {\n this.popObj.hide();\n }\n var checkOverflow = this.checkOverflow(ele, ele.getElementsByClassName(CLS_ITEMS)[0]);\n if (!checkOverflow) {\n this.destroyScroll();\n var multirowele = ele.querySelector('.' + CLS_ITEMS);\n if (!isNOU(multirowele)) {\n this.remove(multirowele, CLS_MULTIROWPOS);\n if (this.tbarAlign) {\n this.add(multirowele, CLS_TBARPOS);\n }\n }\n }\n if (checkOverflow && this.scrollModule && (this.offsetWid === ele.offsetWidth)) {\n return;\n }\n if (this.offsetWid > ele.offsetWidth || checkOverflow) {\n this.renderOverflowMode();\n }\n if (this.popObj) {\n if (this.overflowMode === 'Extended') {\n this.popObj.width = this.getToolbarPopupWidth(this.element);\n }\n if (this.tbarAlign) {\n this.removePositioning();\n }\n this.popupRefresh(this.popObj.element, false);\n if (this.tbarAlign) {\n this.refreshPositioning();\n }\n }\n if (this.element.querySelector('.' + CLS_HSCROLLBAR)) {\n this.scrollStep = this.element.querySelector('.' + CLS_HSCROLLBAR).offsetWidth;\n }\n this.offsetWid = ele.offsetWidth;\n this.tbResize = false;\n this.separator();\n };\n Toolbar.prototype.orientationChange = function () {\n var _this = this;\n setTimeout(function () {\n _this.resize();\n }, 500);\n };\n Toolbar.prototype.extendedOpen = function () {\n var sib = this.element.querySelector('.' + CLS_EXTENDABLECLASS);\n if (this.overflowMode === 'Extended' && sib) {\n this.isExtendedOpen = sib.classList.contains(CLS_POPUPOPEN);\n }\n };\n Toolbar.prototype.updateHideEleTabIndex = function (ele, isHidden, isElement, eleIndex, innerItems) {\n if (isElement) {\n eleIndex = innerItems.indexOf(ele);\n }\n var nextEle = innerItems[++eleIndex];\n while (nextEle) {\n var skipEle = this.eleContains(nextEle);\n if (!skipEle) {\n var dataTabIndex = nextEle.firstElementChild.getAttribute('data-tabindex');\n if (isHidden && dataTabIndex === '-1') {\n nextEle.firstElementChild.setAttribute('tabindex', '0');\n }\n else if (dataTabIndex !== nextEle.firstElementChild.getAttribute('tabindex')) {\n nextEle.firstElementChild.setAttribute('tabindex', dataTabIndex);\n }\n break;\n }\n nextEle = innerItems[++eleIndex];\n }\n };\n Toolbar.prototype.clearToolbarTemplate = function (templateEle) {\n if (this.registeredTemplate && this.registeredTemplate[\"\" + 'template']) {\n var registeredTemplates = this.registeredTemplate;\n for (var index = 0; index < registeredTemplates[\"\" + 'template'].length; index++) {\n var registeredItem = registeredTemplates[\"\" + 'template'][parseInt(index.toString(), 10)].rootNodes[0];\n var closestItem = closest(registeredItem, '.' + CLS_ITEM);\n if (!isNOU(closestItem) && closestItem === templateEle) {\n this.clearTemplate(['template'], [registeredTemplates[\"\" + 'template'][parseInt(index.toString(), 10)]]);\n break;\n }\n }\n }\n else if (this.portals && this.portals.length > 0) {\n var portals = this.portals;\n for (var index = 0; index < portals.length; index++) {\n var portalItem = portals[parseInt(index.toString(), 10)];\n var closestItem = closest(portalItem.containerInfo, '.' + CLS_ITEM);\n if (!isNOU(closestItem) && closestItem === templateEle) {\n this.clearTemplate(['template'], index);\n break;\n }\n }\n }\n };\n /**\n * Gets called when the model property changes.The data that describes the old and new values of the property that changed.\n *\n * @param {ToolbarModel} newProp - It contains new value of the data.\n * @param {ToolbarModel} oldProp - It contains old value of the data.\n * @returns {void}\n * @private\n */\n Toolbar.prototype.onPropertyChanged = function (newProp, oldProp) {\n var tEle = this.element;\n var wid = tEle.offsetWidth;\n this.extendedOpen();\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'items':\n if (!(newProp.items instanceof Array && oldProp.items instanceof Array)) {\n var changedProb = Object.keys(newProp.items);\n for (var i = 0; i < changedProb.length; i++) {\n var index = parseInt(Object.keys(newProp.items)[parseInt(i.toString(), 10)], 10);\n var property = Object.keys(newProp.items[parseInt(index.toString(), 10)])[0];\n var newProperty = Object(newProp.items[parseInt(index.toString(), 10)])[\"\" + property];\n if (this.tbarAlign || property === 'align') {\n this.refresh();\n this.trigger('created');\n break;\n }\n var popupPriCheck = property === 'showAlwaysInPopup' && !newProperty;\n var booleanCheck = property === 'overflow' && this.popupPriCount !== 0;\n if ((popupPriCheck) || (this.items[parseInt(index.toString(), 10)].showAlwaysInPopup) && booleanCheck) {\n --this.popupPriCount;\n }\n if (isNOU(this.scrollModule)) {\n this.destroyMode();\n }\n var itemCol = [].slice.call(selectAll('.' + CLS_ITEMS + ' .' + CLS_ITEM, tEle));\n if (this.isReact && this.items[parseInt(index.toString(), 10)].template) {\n this.clearToolbarTemplate(itemCol[parseInt(index.toString(), 10)]);\n }\n detach(itemCol[parseInt(index.toString(), 10)]);\n this.tbarEle.splice(index, 1);\n this.addItems([this.items[parseInt(index.toString(), 10)]], index);\n this.items.splice(index, 1);\n if (this.items[parseInt(index.toString(), 10)].template) {\n this.tbarEle.splice(this.items.length, 1);\n }\n }\n }\n else {\n this.itemsRerender(newProp.items);\n }\n break;\n case 'width':\n setStyle(tEle, { 'width': formatUnit(newProp.width) });\n this.refreshOverflow();\n break;\n case 'height':\n setStyle(this.element, { 'height': formatUnit(newProp.height) });\n break;\n case 'overflowMode':\n this.destroyMode();\n this.renderOverflowMode();\n if (this.enableRtl) {\n this.add(tEle, CLS_RTL);\n }\n this.refreshOverflow();\n break;\n case 'enableRtl':\n if (newProp.enableRtl) {\n this.add(tEle, CLS_RTL);\n }\n else {\n this.remove(tEle, CLS_RTL);\n }\n if (!isNOU(this.scrollModule)) {\n if (newProp.enableRtl) {\n this.add(this.scrollModule.element, CLS_RTL);\n }\n else {\n this.remove(this.scrollModule.element, CLS_RTL);\n }\n }\n if (!isNOU(this.popObj)) {\n if (newProp.enableRtl) {\n this.add(this.popObj.element, CLS_RTL);\n }\n else {\n this.remove(this.popObj.element, CLS_RTL);\n }\n }\n if (this.tbarAlign) {\n this.itemPositioning();\n }\n break;\n case 'scrollStep':\n if (this.scrollModule) {\n this.scrollModule.scrollStep = this.scrollStep;\n }\n break;\n case 'enableCollision':\n if (this.popObj) {\n this.popObj.collision = { Y: this.enableCollision ? 'flip' : 'none' };\n }\n break;\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([this.element], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([this.element], newProp.cssClass.split(' '));\n }\n break;\n case 'allowKeyboard':\n this.unwireKeyboardEvent();\n if (newProp.allowKeyboard) {\n this.wireKeyboardEvent();\n }\n break;\n }\n }\n };\n /**\n * Shows or hides the Toolbar item that is in the specified index.\n *\n * @param {number | HTMLElement} index - Index value of target item or DOM element of items to be hidden or shown.\n * @param {boolean} value - Based on this Boolean value, item will be hide (true) or show (false). By default, value is false.\n * @returns {void}.\n */\n Toolbar.prototype.hideItem = function (index, value) {\n var isElement = (typeof (index) === 'object') ? true : false;\n var eleIndex = index;\n var ele;\n if (!isElement && isNOU(eleIndex)) {\n return;\n }\n var innerItems = [].slice.call(selectAll('.' + CLS_ITEM, this.element));\n if (isElement) {\n ele = index;\n }\n else if (this.tbarEle[parseInt(eleIndex.toString(), 10)]) {\n var innerItems_1 = [].slice.call(selectAll('.' + CLS_ITEM, this.element));\n ele = innerItems_1[parseInt(eleIndex.toString(), 10)];\n }\n if (ele) {\n if (value) {\n ele.classList.add(CLS_HIDDEN);\n if (!ele.classList.contains(CLS_SEPARATOR)) {\n if (isNOU(ele.firstElementChild.getAttribute('tabindex')) ||\n ele.firstElementChild.getAttribute('tabindex') !== '-1') {\n this.updateHideEleTabIndex(ele, value, isElement, eleIndex, innerItems);\n }\n }\n }\n else {\n ele.classList.remove(CLS_HIDDEN);\n if (!ele.classList.contains(CLS_SEPARATOR)) {\n this.updateHideEleTabIndex(ele, value, isElement, eleIndex, innerItems);\n }\n }\n this.refreshOverflow();\n }\n };\n __decorate([\n Collection([], Item)\n ], Toolbar.prototype, \"items\", void 0);\n __decorate([\n Property('auto')\n ], Toolbar.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], Toolbar.prototype, \"height\", void 0);\n __decorate([\n Property('')\n ], Toolbar.prototype, \"cssClass\", void 0);\n __decorate([\n Property('Scrollable')\n ], Toolbar.prototype, \"overflowMode\", void 0);\n __decorate([\n Property()\n ], Toolbar.prototype, \"scrollStep\", void 0);\n __decorate([\n Property(true)\n ], Toolbar.prototype, \"enableCollision\", void 0);\n __decorate([\n Property(true)\n ], Toolbar.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property(true)\n ], Toolbar.prototype, \"allowKeyboard\", void 0);\n __decorate([\n Event()\n ], Toolbar.prototype, \"clicked\", void 0);\n __decorate([\n Event()\n ], Toolbar.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Toolbar.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], Toolbar.prototype, \"beforeCreate\", void 0);\n Toolbar = __decorate([\n NotifyPropertyChanges\n ], Toolbar);\n return Toolbar;\n}(Component));\nexport { Toolbar };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/* eslint-disable @typescript-eslint/triple-slash-reference */\n/// \nimport { attributes, getUniqueID, Collection, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';\nimport { getZindexPartial } from '@syncfusion/ej2-popups';\nimport { MenuBase, MenuItem } from '../common/menu-base';\n/**\n * The ContextMenu is a graphical user interface that appears on the user right click/touch hold operation.\n * ```html\n *
\n *
    \n * ```\n * ```typescript\n * \n * ```\n */\nvar ContextMenu = /** @class */ (function (_super) {\n __extends(ContextMenu, _super);\n /**\n * Constructor for creating the widget.\n *\n * @private\n * @param {ContextMenuModel} options - Specifies the context menu model\n * @param {string} element - Specifies the element\n */\n function ContextMenu(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * For internal use only - prerender processing.\n *\n * @private\n * @returns {void}\n */\n ContextMenu.prototype.preRender = function () {\n this.isMenu = false;\n this.element.id = this.element.id || getUniqueID('ej2-contextmenu');\n _super.prototype.preRender.call(this);\n };\n ContextMenu.prototype.initialize = function () {\n _super.prototype.initialize.call(this);\n attributes(this.element, { 'role': 'menubar', 'tabindex': '0' });\n this.element.style.zIndex = getZindexPartial(this.element).toString();\n };\n /**\n * This method is used to open the ContextMenu in specified position.\n *\n * @param {number} top - To specify ContextMenu vertical positioning.\n * @param {number} left - To specify ContextMenu horizontal positioning.\n * @param {HTMLElement} target - To calculate z-index for ContextMenu based upon the specified target.\n * @function open\n * @returns {void}\n */\n ContextMenu.prototype.open = function (top, left, target) {\n _super.prototype.openMenu.call(this, null, null, top, left, null, target);\n };\n /**\n * Closes the ContextMenu if it is opened.\n *\n * @function close\n * @returns {void}\n */\n ContextMenu.prototype.close = function () {\n _super.prototype.closeMenu.call(this);\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @private\n * @param {ContextMenuModel} newProp - Specifies new properties\n * @param {ContextMenuModel} oldProp - Specifies old properties\n * @returns {void}\n */\n ContextMenu.prototype.onPropertyChanged = function (newProp, oldProp) {\n _super.prototype.onPropertyChanged.call(this, newProp, oldProp);\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'filter':\n this.close();\n this.filter = newProp.filter;\n break;\n case 'target':\n this.unWireEvents(oldProp.target);\n this.wireEvents();\n break;\n }\n }\n };\n /**\n * Get module name.\n *\n * @returns {string} - Module Name\n * @private\n */\n ContextMenu.prototype.getModuleName = function () {\n return 'contextmenu';\n };\n __decorate([\n Property('')\n ], ContextMenu.prototype, \"target\", void 0);\n __decorate([\n Property('')\n ], ContextMenu.prototype, \"filter\", void 0);\n __decorate([\n Collection([], MenuItem)\n ], ContextMenu.prototype, \"items\", void 0);\n ContextMenu = __decorate([\n NotifyPropertyChanges\n ], ContextMenu);\n return ContextMenu;\n}(MenuBase));\nexport { ContextMenu };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, Event, closest, Collection, Complex, attributes, detach, isNullOrUndefined, animationMode } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty, select, isVisible } from '@syncfusion/ej2-base';\nimport { KeyboardEvents, Browser, formatUnit, L10n } from '@syncfusion/ej2-base';\nimport { setStyleAttribute as setStyle, isNullOrUndefined as isNOU, selectAll, addClass, removeClass, remove } from '@syncfusion/ej2-base';\nimport { EventHandler, rippleEffect, Touch, compile, Animation } from '@syncfusion/ej2-base';\nimport { getRandomId, SanitizeHtmlHelper, Draggable } from '@syncfusion/ej2-base';\nimport { Toolbar } from '../toolbar/toolbar';\nvar CLS_TAB = 'e-tab';\nvar CLS_HEADER = 'e-tab-header';\nvar CLS_BLA_TEM = 'blazor-template';\nvar CLS_CONTENT = 'e-content';\nvar CLS_NEST = 'e-nested';\nvar CLS_ITEMS = 'e-items';\nvar CLS_ITEM = 'e-item';\nvar CLS_TEMPLATE = 'e-template';\nvar CLS_RTL = 'e-rtl';\nvar CLS_ACTIVE = 'e-active';\nvar CLS_DISABLE = 'e-disable';\nvar CLS_HIDDEN = 'e-hidden';\nvar CLS_FOCUS = 'e-focused';\nvar CLS_ICONS = 'e-icons';\nvar CLS_ICON = 'e-icon';\nvar CLS_ICON_TAB = 'e-icon-tab';\nvar CLS_ICON_CLOSE = 'e-close-icon';\nvar CLS_CLOSE_SHOW = 'e-close-show';\nvar CLS_TEXT = 'e-tab-text';\nvar CLS_INDICATOR = 'e-indicator';\nvar CLS_WRAP = 'e-tab-wrap';\nvar CLS_TEXT_WRAP = 'e-text-wrap';\nvar CLS_TAB_ICON = 'e-tab-icon';\nvar CLS_TB_ITEMS = 'e-toolbar-items';\nvar CLS_TB_ITEM = 'e-toolbar-item';\nvar CLS_TB_POP = 'e-toolbar-pop';\nvar CLS_TB_POPUP = 'e-toolbar-popup';\nvar CLS_HOR_NAV = 'e-hor-nav';\nvar CLS_POPUP_OPEN = 'e-popup-open';\nvar CLS_POPUP_CLOSE = 'e-popup-close';\nvar CLS_PROGRESS = 'e-progress';\nvar CLS_IGNORE = 'e-ignore';\nvar CLS_OVERLAY = 'e-overlay';\nvar CLS_HSCRCNT = 'e-hscroll-content';\nvar CLS_VSCRCNT = 'e-vscroll-content';\nvar CLS_VTAB = 'e-vertical-tab';\nvar CLS_VERTICAL = 'e-vertical';\nvar CLS_VLEFT = 'e-vertical-left';\nvar CLS_VRIGHT = 'e-vertical-right';\nvar CLS_HBOTTOM = 'e-horizontal-bottom';\nvar CLS_FILL = 'e-fill-mode';\nvar TABITEMPREFIX = 'tabitem_';\nvar CLS_REORDER_ACTIVE_ITEM = 'e-reorder-active-item';\n/**\n * Objects used for configuring the Tab selecting item action properties.\n */\nvar TabActionSettings = /** @class */ (function (_super) {\n __extends(TabActionSettings, _super);\n function TabActionSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('SlideLeftIn')\n ], TabActionSettings.prototype, \"effect\", void 0);\n __decorate([\n Property(600)\n ], TabActionSettings.prototype, \"duration\", void 0);\n __decorate([\n Property('ease')\n ], TabActionSettings.prototype, \"easing\", void 0);\n return TabActionSettings;\n}(ChildProperty));\nexport { TabActionSettings };\n/**\n * Objects used for configuring the Tab animation properties.\n */\nvar TabAnimationSettings = /** @class */ (function (_super) {\n __extends(TabAnimationSettings, _super);\n function TabAnimationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({ effect: 'SlideLeftIn', duration: 600, easing: 'ease' }, TabActionSettings)\n ], TabAnimationSettings.prototype, \"previous\", void 0);\n __decorate([\n Complex({ effect: 'SlideRightIn', duration: 600, easing: 'ease' }, TabActionSettings)\n ], TabAnimationSettings.prototype, \"next\", void 0);\n return TabAnimationSettings;\n}(ChildProperty));\nexport { TabAnimationSettings };\n/**\n * Objects used for configuring the Tab item header properties.\n */\nvar Header = /** @class */ (function (_super) {\n __extends(Header, _super);\n function Header() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Header.prototype, \"text\", void 0);\n __decorate([\n Property('')\n ], Header.prototype, \"iconCss\", void 0);\n __decorate([\n Property('left')\n ], Header.prototype, \"iconPosition\", void 0);\n return Header;\n}(ChildProperty));\nexport { Header };\n/**\n * An array of object that is used to configure the Tab.\n */\nvar TabItem = /** @class */ (function (_super) {\n __extends(TabItem, _super);\n function TabItem() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({}, Header)\n ], TabItem.prototype, \"header\", void 0);\n __decorate([\n Property(null)\n ], TabItem.prototype, \"headerTemplate\", void 0);\n __decorate([\n Property('')\n ], TabItem.prototype, \"content\", void 0);\n __decorate([\n Property('')\n ], TabItem.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], TabItem.prototype, \"disabled\", void 0);\n __decorate([\n Property(true)\n ], TabItem.prototype, \"visible\", void 0);\n __decorate([\n Property()\n ], TabItem.prototype, \"id\", void 0);\n __decorate([\n Property(-1)\n ], TabItem.prototype, \"tabIndex\", void 0);\n return TabItem;\n}(ChildProperty));\nexport { TabItem };\n/**\n * Tab is a content panel to show multiple contents in a single space, one at a time.\n * Each Tab item has an associated content, that will be displayed based on the active Tab header item.\n * ```html\n *
    \n * \n * ```\n */\nvar Tab = /** @class */ (function (_super) {\n __extends(Tab, _super);\n /**\n * Initializes a new instance of the Tab class.\n *\n * @param {TabModel} options - Specifies Tab model properties as options.\n * @param {string | HTMLElement} element - Specifies the element that is rendered as a Tab.\n */\n function Tab(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.show = {};\n _this.hide = {};\n _this.maxHeight = 0;\n _this.title = 'Close';\n _this.isInteracted = false;\n _this.lastIndex = 0;\n _this.isAdd = false;\n _this.isIconAlone = false;\n _this.draggableItems = [];\n _this.resizeContext = _this.refreshActiveTabBorder.bind(_this);\n /**\n * Contains the keyboard configuration of the Tab.\n */\n _this.keyConfigs = {\n tab: 'tab',\n home: 'home',\n end: 'end',\n enter: 'enter',\n space: 'space',\n delete: 'delete',\n moveLeft: 'leftarrow',\n moveRight: 'rightarrow',\n moveUp: 'uparrow',\n moveDown: 'downarrow'\n };\n return _this;\n }\n /**\n * Removes the component from the DOM and detaches all its related event handlers, attributes and classes.\n *\n * @returns {void}\n */\n Tab.prototype.destroy = function () {\n if (this.isReact || this.isAngular) {\n this.clearTemplate();\n }\n if (!isNOU(this.tbObj)) {\n this.tbObj.destroy();\n this.tbObj = null;\n }\n this.unWireEvents();\n this.element.removeAttribute('aria-disabled');\n this.expTemplateContent();\n if (!this.isTemplate) {\n while (this.element.firstElementChild) {\n remove(this.element.firstElementChild);\n }\n }\n else {\n var cntEle = select('.' + CLS_TAB + ' > .' + CLS_CONTENT, this.element);\n this.element.classList.remove(CLS_TEMPLATE);\n if (!isNOU(cntEle)) {\n cntEle.innerHTML = this.cnt;\n }\n }\n if (this.btnCls) {\n this.btnCls = null;\n }\n this.hdrEle = null;\n this.cntEle = null;\n this.tbItems = null;\n this.tbItem = null;\n this.tbPop = null;\n this.prevItem = null;\n this.popEle = null;\n this.bdrLine = null;\n this.content = null;\n this.dragItem = null;\n this.cloneElement = null;\n this.draggingItems = [];\n if (this.draggableItems && this.draggableItems.length > 0) {\n for (var i = 0; i < this.draggableItems.length; i++) {\n this.draggableItems[i].destroy();\n this.draggableItems[i] = null;\n }\n this.draggableItems = [];\n }\n _super.prototype.destroy.call(this);\n this.trigger('destroyed');\n };\n /**\n * Refresh the tab component\n *\n * @returns {void}\n */\n Tab.prototype.refresh = function () {\n if (this.isReact) {\n this.clearTemplate();\n }\n _super.prototype.refresh.call(this);\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n /**\n * Initialize component\n *\n * @private\n * @returns {void}\n */\n Tab.prototype.preRender = function () {\n var nested = closest(this.element, '.' + CLS_CONTENT);\n this.prevIndex = 0;\n this.isNested = false;\n this.isPopup = false;\n this.initRender = true;\n this.isSwiped = false;\n this.itemIndexArray = [];\n this.templateEle = [];\n if (this.allowDragAndDrop) {\n this.dragArea = !isNOU(this.dragArea) ? this.dragArea : '#' + this.element.id + ' ' + ('.' + CLS_HEADER);\n }\n if (!isNOU(nested)) {\n nested.parentElement.classList.add(CLS_NEST);\n this.isNested = true;\n }\n var name = Browser.info.name;\n var css = (name === 'msie') ? 'e-ie' : (name === 'edge') ? 'e-edge' : (name === 'safari') ? 'e-safari' : '';\n setStyle(this.element, { 'width': formatUnit(this.width), 'height': formatUnit(this.height) });\n this.setCssClass(this.element, this.cssClass, true);\n attributes(this.element, { 'aria-disabled': 'false' });\n this.setCssClass(this.element, css, true);\n this.updatePopAnimationConfig();\n };\n /**\n * Initialize the component rendering\n *\n * @private\n * @returns {void}\n */\n Tab.prototype.render = function () {\n var _this = this;\n this.btnCls = this.createElement('span', { className: CLS_ICONS + ' ' + CLS_ICON_CLOSE, attrs: { title: this.title } });\n this.tabId = this.element.id.length > 0 ? ('-' + this.element.id) : getRandomId();\n this.renderContainer();\n this.wireEvents();\n this.initRender = false;\n if (this.isReact && this.portals && this.portals.length > 0) {\n this.renderReactTemplates(function () {\n if (!isNOU(_this.tbObj)) {\n _this.tbObj.refreshOverflow();\n }\n _this.refreshActiveBorder();\n });\n }\n };\n Tab.prototype.renderContainer = function () {\n var ele = this.element;\n this.items.forEach(function (item, index) {\n if (isNOU(item.id) && !isNOU(item.setProperties)) {\n item.setProperties({ id: TABITEMPREFIX + index.toString() }, true);\n }\n });\n if (this.items.length > 0 && ele.children.length === 0) {\n ele.appendChild(this.createElement('div', { className: CLS_CONTENT }));\n this.setOrientation(this.headerPlacement, this.createElement('div', { className: CLS_HEADER }));\n this.isTemplate = false;\n }\n else if (this.element.children.length > 0) {\n this.isTemplate = true;\n ele.classList.add(CLS_TEMPLATE);\n var header = ele.querySelector('.' + CLS_HEADER);\n if (header && this.headerPlacement === 'Bottom') {\n this.setOrientation(this.headerPlacement, header);\n }\n }\n if (!isNOU(select('.' + CLS_HEADER, this.element)) && !isNOU(select('.' + CLS_CONTENT, this.element))) {\n this.renderHeader();\n this.tbItems = select('.' + CLS_HEADER + ' .' + CLS_TB_ITEMS, this.element);\n if (!isNOU(this.tbItems)) {\n rippleEffect(this.tbItems, { selector: '.e-tab-wrap' });\n }\n this.renderContent();\n if (selectAll('.' + CLS_TB_ITEM, this.element).length > 0) {\n this.tbItems = select('.' + CLS_HEADER + ' .' + CLS_TB_ITEMS, this.element);\n this.bdrLine = this.createElement('div', { className: CLS_INDICATOR + ' ' + CLS_HIDDEN + ' ' + CLS_IGNORE });\n var scrCnt = select('.' + this.scrCntClass, this.tbItems);\n if (!isNOU(scrCnt)) {\n scrCnt.insertBefore(this.bdrLine, scrCnt.firstChild);\n }\n else {\n this.tbItems.insertBefore(this.bdrLine, this.tbItems.firstChild);\n }\n this.setContentHeight(true);\n this.select(this.selectedItem);\n }\n this.setRTL(this.enableRtl);\n }\n };\n Tab.prototype.renderHeader = function () {\n var _this = this;\n var hdrPlace = this.headerPlacement;\n var tabItems = [];\n this.hdrEle = this.getTabHeader();\n this.addVerticalClass();\n if (!this.isTemplate) {\n tabItems = this.parseObject(this.items, 0);\n }\n else {\n if (this.element.children.length > 1 && this.element.children[1].classList.contains(CLS_HEADER)) {\n this.setProperties({ headerPlacement: 'Bottom' }, true);\n }\n var count = this.hdrEle.children.length;\n var hdrItems = [];\n for (var i = 0; i < count; i++) {\n hdrItems.push(this.hdrEle.children.item(i));\n }\n if (count > 0) {\n var tabItems_1 = this.createElement('div', { className: CLS_ITEMS });\n this.hdrEle.appendChild(tabItems_1);\n hdrItems.forEach(function (item, index) {\n _this.lastIndex = index;\n var attr = {\n className: CLS_ITEM, id: CLS_ITEM + _this.tabId + '_' + index\n };\n var txt = _this.createElement('span', {\n className: CLS_TEXT, attrs: { 'role': 'presentation' }\n }).outerHTML;\n var cont = _this.createElement('div', {\n className: CLS_TEXT_WRAP, innerHTML: txt + _this.btnCls.outerHTML\n }).outerHTML;\n var wrap = _this.createElement('div', {\n className: CLS_WRAP, innerHTML: cont,\n attrs: { role: 'tab', tabIndex: '-1', 'aria-selected': 'false', 'aria-controls': CLS_CONTENT + _this.tabId + '_' + index, 'aria-disabled': 'false' }\n });\n wrap.querySelector('.' + CLS_TEXT).appendChild(item);\n tabItems_1.appendChild(_this.createElement('div', attr));\n selectAll('.' + CLS_ITEM, tabItems_1)[index].appendChild(wrap);\n });\n }\n }\n this.tbObj = new Toolbar({\n width: (hdrPlace === 'Left' || hdrPlace === 'Right') ? 'auto' : '100%',\n height: (hdrPlace === 'Left' || hdrPlace === 'Right') ? '100%' : 'auto',\n overflowMode: this.overflowMode,\n items: (tabItems.length !== 0) ? tabItems : [],\n clicked: this.clickHandler.bind(this),\n scrollStep: this.scrollStep,\n enableHtmlSanitizer: this.enableHtmlSanitizer,\n cssClass: this.cssClass\n });\n this.tbObj.isStringTemplate = true;\n this.tbObj.createElement = this.createElement;\n this.tbObj.appendTo(this.hdrEle);\n attributes(this.hdrEle, { role: 'tablist' });\n if (!isNOU(this.element.getAttribute('aria-label'))) {\n this.hdrEle.setAttribute('aria-label', this.element.getAttribute('aria-label'));\n this.element.removeAttribute('aria-label');\n }\n else if (!isNOU(this.element.getAttribute('aria-labelledby'))) {\n this.hdrEle.setAttribute('aria-labelledby', this.element.getAttribute('aria-labelledby'));\n this.element.removeAttribute('aria-labelledby');\n }\n this.setCloseButton(this.showCloseButton);\n var toolbarHeader = this.tbObj.element.querySelector('.' + CLS_TB_ITEMS);\n if (!isNOU(toolbarHeader)) {\n if (isNOU(toolbarHeader.id) || toolbarHeader.id === '') {\n toolbarHeader.id = this.element.id + '_' + 'tab_header_items';\n }\n }\n };\n Tab.prototype.renderContent = function () {\n this.cntEle = select('.' + CLS_CONTENT, this.element);\n var hdrItem = selectAll('.' + CLS_TB_ITEM, this.element);\n if (this.isTemplate) {\n this.cnt = (this.cntEle.children.length > 0) ? this.cntEle.innerHTML : '';\n var contents = this.cntEle.children;\n for (var i = 0; i < hdrItem.length; i++) {\n if (contents.length - 1 >= i) {\n addClass([contents.item(i)], CLS_ITEM);\n attributes(contents.item(i), { 'role': 'tabpanel', 'aria-labelledby': CLS_ITEM + this.tabId + '_' + i });\n contents.item(i).id = CLS_CONTENT + this.tabId + '_' + i;\n }\n }\n }\n };\n Tab.prototype.reRenderItems = function () {\n this.renderContainer();\n if (!isNOU(this.cntEle)) {\n this.touchModule = new Touch(this.cntEle, { swipe: this.swipeHandler.bind(this) });\n }\n };\n Tab.prototype.parseObject = function (items, index) {\n var _this = this;\n var tbItems = Array.prototype.slice.call(selectAll('.e-tab-header .' + CLS_TB_ITEM, this.element));\n var maxId = this.lastIndex;\n if (!this.isReplace && tbItems.length > 0) {\n var idList_1 = [];\n tbItems.forEach(function (item) {\n idList_1.push(_this.getIndexFromEle(item.id));\n });\n maxId = Math.max.apply(Math, idList_1);\n }\n var tItems = [];\n var txtWrapEle;\n var spliceArray = [];\n var i = 0;\n items.forEach(function (item, i) {\n var pos = (isNOU(item.header) || isNOU(item.header.iconPosition)) ? '' : item.header.iconPosition;\n var css = (isNOU(item.header) || isNOU(item.header.iconCss)) ? '' : item.header.iconCss;\n if ((isNOU(item.headerTemplate)) && (isNOU(item.header) || isNOU(item.header.text) ||\n ((item.header.text.length === 0)) && (css === ''))) {\n spliceArray.push(i);\n return;\n }\n var txt = item.headerTemplate || item.header.text;\n if (typeof txt === 'string' && _this.enableHtmlSanitizer) {\n txt = SanitizeHtmlHelper.sanitize(txt);\n }\n var itemIndex;\n if (_this.isReplace && !isNOU(_this.tbId) && _this.tbId !== '') {\n itemIndex = parseInt(_this.tbId.substring(_this.tbId.lastIndexOf('_') + 1), 10);\n _this.tbId = '';\n }\n else {\n itemIndex = index + i;\n }\n _this.lastIndex = ((tbItems.length === 0) ? i : ((_this.isReplace) ? (itemIndex) : (maxId + 1 + i)));\n var disabled = (item.disabled) ? ' ' + CLS_DISABLE + ' ' + CLS_OVERLAY : '';\n var hidden = (item.visible === false) ? ' ' + CLS_HIDDEN : '';\n txtWrapEle = _this.createElement('div', { className: CLS_TEXT, attrs: { 'role': 'presentation' } });\n var tHtml = ((txt instanceof Object) ? txt.outerHTML : txt);\n var txtEmpty = (!isNOU(tHtml) && tHtml !== '');\n if (!isNOU(txt.tagName)) {\n txtWrapEle.appendChild(txt);\n }\n else {\n _this.headerTextCompile(txtWrapEle, txt, i);\n }\n var tEle;\n var icon = _this.createElement('span', {\n className: CLS_ICONS + ' ' + CLS_TAB_ICON + ' ' + CLS_ICON + '-' + pos + ' ' + css\n });\n var tCont = _this.createElement('div', { className: CLS_TEXT_WRAP });\n tCont.appendChild(txtWrapEle);\n if ((txt !== '' && txt !== undefined) && css !== '') {\n if ((pos === 'left' || pos === 'top')) {\n tCont.insertBefore(icon, tCont.firstElementChild);\n }\n else {\n tCont.appendChild(icon);\n }\n tEle = txtWrapEle;\n _this.isIconAlone = false;\n }\n else {\n tEle = ((css === '') ? txtWrapEle : icon);\n if (tEle === icon) {\n detach(txtWrapEle);\n tCont.appendChild(icon);\n _this.isIconAlone = true;\n }\n }\n var tabIndex = isNOU(item.tabIndex) ? '-1' : item.tabIndex.toString();\n var wrapAttrs = (item.disabled) ? {} : { tabIndex: tabIndex, 'data-tabindex': tabIndex, role: 'tab', 'aria-selected': 'false', 'aria-disabled': 'false' };\n tCont.appendChild(_this.btnCls.cloneNode(true));\n var wrap = _this.createElement('div', { className: CLS_WRAP, attrs: wrapAttrs });\n wrap.appendChild(tCont);\n if (_this.itemIndexArray instanceof Array) {\n _this.itemIndexArray.splice((index + i), 0, CLS_ITEM + _this.tabId + '_' + _this.lastIndex);\n }\n var attrObj = {\n id: CLS_ITEM + _this.tabId + '_' + _this.lastIndex, 'data-id': item.id\n };\n var tItem = { htmlAttributes: attrObj, template: wrap };\n tItem.cssClass = ((item.cssClass !== undefined) ? item.cssClass : ' ') + ' ' + disabled + ' ' + hidden + ' '\n + ((css !== '') ? 'e-i' + pos : '') + ' ' + ((!txtEmpty) ? CLS_ICON : '');\n if (pos === 'top' || pos === 'bottom') {\n _this.element.classList.add('e-vertical-icon');\n }\n tItems.push(tItem);\n i++;\n });\n if (!this.isAdd) {\n spliceArray.forEach(function (spliceItemIndex) {\n _this.items.splice(spliceItemIndex, 1);\n });\n }\n if (this.isIconAlone) {\n this.element.classList.add(CLS_ICON_TAB);\n }\n else {\n this.element.classList.remove(CLS_ICON_TAB);\n }\n return tItems;\n };\n Tab.prototype.removeActiveClass = function () {\n var tabHeader = this.getTabHeader();\n if (tabHeader) {\n var tabItems = selectAll('.' + CLS_TB_ITEM + '.' + CLS_ACTIVE, tabHeader);\n [].slice.call(tabItems).forEach(function (node) { return node.classList.remove(CLS_ACTIVE); });\n [].slice.call(tabItems).forEach(function (node) { return node.firstElementChild.setAttribute('aria-selected', 'false'); });\n }\n };\n Tab.prototype.checkPopupOverflow = function (ele) {\n this.tbPop = select('.' + CLS_TB_POP, this.element);\n var popIcon = select('.e-hor-nav', this.element);\n var tbrItems = select('.' + CLS_TB_ITEMS, this.element);\n var lastChild = tbrItems.lastChild;\n var isOverflow = false;\n if (!this.isVertical() && ((this.enableRtl && ((popIcon.offsetLeft + popIcon.offsetWidth) > tbrItems.offsetLeft))\n || (!this.enableRtl && popIcon.offsetLeft < tbrItems.offsetWidth))) {\n isOverflow = true;\n }\n else if (this.isVertical() && (popIcon.offsetTop < lastChild.offsetTop + lastChild.offsetHeight)) {\n isOverflow = true;\n }\n if (isOverflow) {\n ele.classList.add(CLS_TB_POPUP);\n this.tbPop.insertBefore(ele, selectAll('.' + CLS_TB_POPUP, this.tbPop)[0]);\n }\n return true;\n };\n Tab.prototype.popupHandler = function (target) {\n var ripEle = target.querySelector('.e-ripple-element');\n if (!isNOU(ripEle)) {\n ripEle.outerHTML = '';\n target.querySelector('.' + CLS_WRAP).classList.remove('e-ripple');\n }\n this.tbItem = selectAll('.' + CLS_TB_ITEMS + ' .' + CLS_TB_ITEM, this.hdrEle);\n var lastChild = this.tbItem[this.tbItem.length - 1];\n if (this.tbItem.length !== 0) {\n target.classList.remove(CLS_TB_POPUP);\n target.removeAttribute('style');\n this.tbItems.appendChild(target);\n this.actEleId = target.id;\n if (this.checkPopupOverflow(lastChild)) {\n var prevEle = this.tbItems.lastChild.previousElementSibling;\n this.checkPopupOverflow(prevEle);\n }\n this.isPopup = true;\n }\n return selectAll('.' + CLS_TB_ITEM, this.tbItems).length - 1;\n };\n Tab.prototype.setCloseButton = function (val) {\n var trg = select('.' + CLS_HEADER, this.element);\n if (val === true) {\n trg.classList.add(CLS_CLOSE_SHOW);\n }\n else {\n trg.classList.remove(CLS_CLOSE_SHOW);\n }\n this.tbObj.refreshOverflow();\n this.refreshActiveTabBorder();\n };\n Tab.prototype.prevCtnAnimation = function (prev, current) {\n var animation;\n var checkRTL = this.enableRtl || this.element.classList.contains(CLS_RTL);\n if (this.isPopup || prev <= current) {\n if (this.animation.previous.effect === 'SlideLeftIn') {\n animation = {\n name: 'SlideLeftOut',\n duration: this.animation.previous.duration, timingFunction: this.animation.previous.easing\n };\n }\n else {\n animation = null;\n }\n }\n else {\n if (this.animation.next.effect === 'SlideRightIn') {\n animation = {\n name: 'SlideRightOut',\n duration: this.animation.next.duration, timingFunction: this.animation.next.easing\n };\n }\n else {\n animation = null;\n }\n }\n return animation;\n };\n Tab.prototype.triggerPrevAnimation = function (oldCnt, prevIndex) {\n var _this = this;\n var animateObj = this.prevCtnAnimation(prevIndex, this.selectedItem);\n if (!isNOU(animateObj)) {\n animateObj.begin = function () {\n setStyle(oldCnt, { 'position': 'absolute' });\n oldCnt.classList.add(CLS_PROGRESS);\n oldCnt.classList.add('e-view');\n };\n animateObj.end = function () {\n oldCnt.style.display = 'none';\n oldCnt.classList.remove(CLS_ACTIVE);\n oldCnt.classList.remove(CLS_PROGRESS);\n oldCnt.classList.remove('e-view');\n setStyle(oldCnt, { 'display': '', 'position': '' });\n if (oldCnt.childNodes.length === 0 && !_this.isTemplate) {\n detach(oldCnt);\n }\n };\n new Animation(animateObj).animate(oldCnt);\n }\n else {\n oldCnt.classList.remove(CLS_ACTIVE);\n }\n };\n Tab.prototype.triggerAnimation = function (id, value) {\n var _this = this;\n var prevIndex = this.prevIndex;\n var oldCnt;\n var itemCollection = [].slice.call(this.element.querySelector('.' + CLS_CONTENT).children);\n itemCollection.forEach(function (item) {\n if (item.id === _this.prevActiveEle) {\n oldCnt = item;\n }\n });\n var prevEle = this.tbItem[prevIndex];\n var newCnt = this.getTrgContent(this.cntEle, this.extIndex(id));\n if (isNOU(oldCnt) && !isNOU(prevEle)) {\n var idNo = this.extIndex(prevEle.id);\n oldCnt = this.getTrgContent(this.cntEle, idNo);\n }\n if (!isNOU(newCnt)) {\n this.prevActiveEle = newCnt.id;\n }\n var isPrevent = isNOU(this.animation) || isNOU(this.animation.next.effect) || isNOU(this.animation.previous.effect)\n || this.animation.previous.effect === 'None' || this.animation.next.effect === 'None';\n if (this.initRender || value === false || isPrevent) {\n if (oldCnt && oldCnt !== newCnt) {\n oldCnt.classList.remove(CLS_ACTIVE);\n }\n return;\n }\n var cnt = select('.' + CLS_CONTENT, this.element);\n var animateObj;\n if (this.prevIndex > this.selectedItem && !this.isPopup) {\n var openEff = this.animation.previous.effect;\n animateObj = {\n name: ((openEff === 'None') ? '' : ((openEff !== 'SlideLeftIn') ? openEff : 'SlideLeftIn')),\n duration: (this.animation.previous.duration === 0 && animationMode === 'Enable') ? 600 : this.animation.previous.duration,\n timingFunction: this.animation.previous.easing\n };\n }\n else if (this.isPopup || this.prevIndex < this.selectedItem || this.prevIndex === this.selectedItem) {\n var clsEff = this.animation.next.effect;\n animateObj = {\n name: ((clsEff === 'None') ? '' : ((clsEff !== 'SlideRightIn') ? clsEff : 'SlideRightIn')),\n duration: (this.animation.next.duration === 0 && animationMode === 'Enable') ? 600 : this.animation.next.duration,\n timingFunction: this.animation.next.easing\n };\n }\n animateObj.progress = function () {\n cnt.classList.add(CLS_PROGRESS);\n _this.setActiveBorder();\n };\n animateObj.end = function () {\n cnt.classList.remove(CLS_PROGRESS);\n newCnt.classList.add(CLS_ACTIVE);\n };\n if (!this.initRender && !isNOU(oldCnt)) {\n this.triggerPrevAnimation(oldCnt, prevIndex);\n }\n this.isPopup = false;\n if (animateObj.name === '') {\n newCnt.classList.add(CLS_ACTIVE);\n }\n else {\n new Animation(animateObj).animate(newCnt);\n }\n };\n Tab.prototype.keyPressed = function (trg) {\n var trgParent = closest(trg, '.' + CLS_HEADER + ' .' + CLS_TB_ITEM);\n var trgIndex = this.getEleIndex(trgParent);\n if (!isNOU(this.popEle) && trg.classList.contains('e-hor-nav')) {\n (this.popEle.classList.contains(CLS_POPUP_OPEN)) ? this.popObj.hide(this.hide) : this.popObj.show(this.show);\n }\n else if (trg.classList.contains('e-scroll-nav')) {\n trg.click();\n }\n else {\n if (!isNOU(trgParent) && trgParent.classList.contains(CLS_ACTIVE) === false) {\n this.selectTab(trgIndex, null, true);\n if (!isNOU(this.popEle)) {\n this.popObj.hide(this.hide);\n }\n }\n }\n };\n Tab.prototype.getTabHeader = function () {\n if (isNOU(this.element)) {\n return undefined;\n }\n var headers = [].slice.call(this.element.children).filter(function (e) { return e.classList.contains(CLS_HEADER); });\n if (headers.length > 0) {\n return headers[0];\n }\n else {\n var wrap = [].slice.call(this.element.children).filter(function (e) { return !e.classList.contains(CLS_BLA_TEM); })[0];\n if (!wrap) {\n return undefined;\n }\n return [].slice.call(wrap.children).filter(function (e) { return e.classList.contains(CLS_HEADER); })[0];\n }\n };\n Tab.prototype.getEleIndex = function (item) {\n return Array.prototype.indexOf.call(selectAll('.' + CLS_TB_ITEM, this.getTabHeader()), item);\n };\n Tab.prototype.extIndex = function (id) {\n return id.replace(CLS_ITEM + this.tabId + '_', '');\n };\n Tab.prototype.expTemplateContent = function () {\n var _this = this;\n this.templateEle.forEach(function (eleStr) {\n if (!isNOU(_this.element.querySelector(eleStr))) {\n document.body.appendChild(_this.element.querySelector(eleStr)).style.display = 'none';\n }\n });\n };\n Tab.prototype.templateCompile = function (ele, cnt, index) {\n var tempEle = this.createElement('div');\n this.compileElement(tempEle, cnt, 'content', index);\n if (tempEle.childNodes.length !== 0) {\n ele.appendChild(tempEle);\n }\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n Tab.prototype.compileElement = function (ele, val, prop, index) {\n var templateFn;\n if (typeof val === 'string') {\n val = val.trim();\n if (this.isVue) {\n templateFn = compile(this.enableHtmlSanitizer ? SanitizeHtmlHelper.sanitize(val) : val);\n }\n else {\n ele.innerHTML = this.enableHtmlSanitizer ? SanitizeHtmlHelper.sanitize(val) : val;\n }\n }\n else {\n templateFn = compile(val);\n }\n var templateFUN;\n if (!isNOU(templateFn)) {\n templateFUN = templateFn({}, this, prop);\n }\n if (!isNOU(templateFn) && templateFUN.length > 0) {\n [].slice.call(templateFUN).forEach(function (el) {\n ele.appendChild(el);\n });\n }\n };\n Tab.prototype.headerTextCompile = function (element, text, index) {\n this.compileElement(element, text, 'headerTemplate', index);\n };\n Tab.prototype.getContent = function (ele, cnt, callType, index) {\n var eleStr;\n cnt = isNOU(cnt) ? '' : cnt;\n if (typeof cnt === 'string' || isNOU(cnt.innerHTML)) {\n if (typeof cnt === 'string' && this.enableHtmlSanitizer) {\n cnt = SanitizeHtmlHelper.sanitize(cnt);\n }\n if (cnt[0] === '.' || cnt[0] === '#') {\n if (document.querySelectorAll(cnt).length) {\n var eleVal = document.querySelector(cnt);\n eleStr = eleVal.outerHTML.trim();\n if (callType === 'clone') {\n ele.appendChild(eleVal.cloneNode(true));\n }\n else {\n ele.appendChild(eleVal);\n eleVal.style.display = '';\n }\n }\n else {\n this.templateCompile(ele, cnt, index);\n }\n }\n else {\n this.templateCompile(ele, cnt, index);\n }\n }\n else {\n ele.appendChild(cnt);\n }\n if (!isNOU(eleStr)) {\n if (this.templateEle.indexOf(cnt.toString()) === -1) {\n this.templateEle.push(cnt.toString());\n }\n }\n };\n Tab.prototype.getTrgContent = function (cntEle, no) {\n var ele;\n if (this.element.classList.contains(CLS_NEST)) {\n ele = select('.' + CLS_NEST + '> .' + CLS_CONTENT + ' > #' + CLS_CONTENT + this.tabId + '_' + no, this.element);\n }\n else {\n ele = this.findEle(cntEle.children, CLS_CONTENT + this.tabId + '_' + no);\n }\n return ele;\n };\n Tab.prototype.findEle = function (items, key) {\n var ele;\n for (var i = 0; i < items.length; i++) {\n if (items[i].id === key) {\n ele = items[i];\n break;\n }\n }\n return ele;\n };\n Tab.prototype.isVertical = function () {\n var isVertical = (this.headerPlacement === 'Left' || this.headerPlacement === 'Right') ? true : false;\n this.scrCntClass = (isVertical) ? CLS_VSCRCNT : CLS_HSCRCNT;\n return isVertical;\n };\n Tab.prototype.addVerticalClass = function () {\n if (this.isVertical()) {\n var tbPos = (this.headerPlacement === 'Left') ? CLS_VLEFT : CLS_VRIGHT;\n addClass([this.hdrEle], [CLS_VERTICAL, tbPos]);\n if (!this.element.classList.contains(CLS_NEST)) {\n addClass([this.element], [CLS_VTAB, tbPos]);\n }\n else {\n addClass([this.hdrEle], [CLS_VTAB, tbPos]);\n }\n }\n if (this.headerPlacement === 'Bottom') {\n addClass([this.hdrEle], [CLS_HBOTTOM]);\n }\n };\n Tab.prototype.updatePopAnimationConfig = function () {\n this.show = { name: (this.isVertical() ? 'FadeIn' : 'SlideDown'), duration: 100 };\n this.hide = { name: (this.isVertical() ? 'FadeOut' : 'SlideUp'), duration: 100 };\n };\n Tab.prototype.changeOrientation = function (place) {\n this.setOrientation(place, this.hdrEle);\n var activeTab = this.hdrEle.querySelector('.' + CLS_ACTIVE);\n var isVertical = this.hdrEle.classList.contains(CLS_VERTICAL) ? true : false;\n removeClass([this.element], [CLS_VTAB]);\n removeClass([this.hdrEle], [CLS_VERTICAL, CLS_VLEFT, CLS_VRIGHT]);\n if (isVertical !== this.isVertical()) {\n this.changeToolbarOrientation();\n if (!isNOU(activeTab) && activeTab.classList.contains(CLS_TB_POPUP)) {\n this.popupHandler(activeTab);\n }\n }\n this.addVerticalClass();\n this.setActiveBorder();\n this.focusItem();\n };\n Tab.prototype.focusItem = function () {\n var curActItem = select(' #' + CLS_ITEM + this.tabId + '_' + this.selectedItem, this.hdrEle);\n if (!isNOU(curActItem)) {\n curActItem.firstElementChild.focus();\n }\n };\n Tab.prototype.changeToolbarOrientation = function () {\n this.tbObj.setProperties({ height: (this.isVertical() ? '100%' : 'auto'), width: (this.isVertical() ? 'auto' : '100%') }, true);\n this.tbObj.changeOrientation();\n this.updatePopAnimationConfig();\n };\n Tab.prototype.setOrientation = function (place, ele) {\n var headerPos = Array.prototype.indexOf.call(this.element.children, ele);\n var contentPos = Array.prototype.indexOf.call(this.element.children, this.element.querySelector('.' + CLS_CONTENT));\n if (place === 'Bottom' && (contentPos > headerPos)) {\n this.element.appendChild(ele);\n }\n else {\n removeClass([ele], [CLS_HBOTTOM]);\n this.element.insertBefore(ele, select('.' + CLS_CONTENT, this.element));\n }\n };\n Tab.prototype.setCssClass = function (ele, cls, val) {\n if (cls === '') {\n return;\n }\n var list = cls.split(' ');\n for (var i = 0; i < list.length; i++) {\n if (val) {\n ele.classList.add(list[i]);\n }\n else {\n ele.classList.remove(list[i]);\n }\n }\n };\n Tab.prototype.setContentHeight = function (val) {\n if (this.element.classList.contains(CLS_FILL)) {\n removeClass([this.element], [CLS_FILL]);\n }\n if (isNOU(this.cntEle)) {\n return;\n }\n var hdrEle = this.getTabHeader();\n if (this.heightAdjustMode === 'None') {\n if (this.height === 'auto') {\n return;\n }\n else {\n if (!this.isVertical()) {\n setStyle(this.cntEle, { 'height': (this.element.clientHeight - hdrEle.offsetHeight) + 'px' });\n }\n }\n }\n else if (this.heightAdjustMode === 'Fill') {\n addClass([this.element], [CLS_FILL]);\n setStyle(this.element, { 'height': '100%' });\n this.cntEle.style.height = 'calc(100% - ' + this.hdrEle.offsetHeight + 'px)';\n }\n else if (this.heightAdjustMode === 'Auto') {\n if (this.isTemplate === true) {\n var cnt = selectAll('.' + CLS_CONTENT + ' > .' + CLS_ITEM, this.element);\n for (var i = 0; i < cnt.length; i++) {\n cnt[i].setAttribute('style', 'display:block; visibility: visible');\n this.maxHeight = Math.max(this.maxHeight, this.getHeight(cnt[i]));\n cnt[i].style.removeProperty('display');\n cnt[i].style.removeProperty('visibility');\n }\n }\n else {\n this.cntEle = select('.' + CLS_CONTENT, this.element);\n if (val === true) {\n this.cntEle.appendChild(this.createElement('div', {\n id: (CLS_CONTENT + this.tabId + '_' + 0), className: CLS_ITEM + ' ' + CLS_ACTIVE,\n attrs: { 'role': 'tabpanel', 'aria-labelledby': CLS_ITEM + this.tabId + '_' + 0 }\n }));\n }\n var ele = this.cntEle.children.item(0);\n for (var i = 0; i < this.items.length; i++) {\n this.getContent(ele, this.items[i].content, 'clone', i);\n this.maxHeight = Math.max(this.maxHeight, this.getHeight(ele));\n while (ele.firstChild) {\n ele.removeChild(ele.firstChild);\n }\n }\n if (this.isReact || this.isAngular || this.isVue) {\n this.clearTemplate(['content']);\n }\n this.templateEle = [];\n this.getContent(ele, this.items[0].content, 'render', 0);\n if (this.prevIndex !== this.selectedItem) {\n ele.classList.remove(CLS_ACTIVE);\n }\n }\n setStyle(this.cntEle, { 'height': this.maxHeight + 'px' });\n }\n else {\n setStyle(this.cntEle, { 'height': 'auto' });\n }\n };\n Tab.prototype.getHeight = function (ele) {\n var cs = window.getComputedStyle(ele);\n return ele.offsetHeight + parseFloat(cs.getPropertyValue('padding-top')) + parseFloat(cs.getPropertyValue('padding-bottom')) +\n parseFloat(cs.getPropertyValue('margin-top')) + parseFloat(cs.getPropertyValue('margin-bottom'));\n };\n Tab.prototype.setActiveBorder = function () {\n var trgHdrEle = this.getTabHeader();\n var trg = select('.' + CLS_TB_ITEM + '.' + CLS_ACTIVE, trgHdrEle);\n if (isNOU(trg)) {\n return;\n }\n if (!this.reorderActiveTab) {\n if (trg.classList.contains(CLS_TB_POPUP) && !this.bdrLine.classList.contains(CLS_HIDDEN)) {\n this.bdrLine.classList.add(CLS_HIDDEN);\n }\n if (trgHdrEle && !trgHdrEle.classList.contains(CLS_REORDER_ACTIVE_ITEM)) {\n trgHdrEle.classList.add(CLS_REORDER_ACTIVE_ITEM);\n }\n }\n else if (trgHdrEle) {\n trgHdrEle.classList.remove(CLS_REORDER_ACTIVE_ITEM);\n }\n var root = closest(trg, '.' + CLS_TAB);\n if (this.element !== root) {\n return;\n }\n this.tbItems = select('.' + CLS_TB_ITEMS, trgHdrEle);\n var bar = select('.' + CLS_INDICATOR, trgHdrEle);\n var scrollCnt = select('.' + CLS_TB_ITEMS + ' .' + this.scrCntClass, trgHdrEle);\n if (this.isVertical()) {\n setStyle(bar, { 'left': '', 'right': '' });\n var tbHeight = (isNOU(scrollCnt)) ? this.tbItems.offsetHeight : scrollCnt.offsetHeight;\n if (tbHeight !== 0) {\n setStyle(bar, { 'top': trg.offsetTop + 'px', 'height': trg.offsetHeight + 'px' });\n }\n else {\n setStyle(bar, { 'top': 0, 'height': 0 });\n }\n }\n else {\n if (this.overflowMode === 'MultiRow') {\n var top_1 = this.headerPlacement === 'Bottom' ? trg.offsetTop : trg.offsetHeight + trg.offsetTop;\n setStyle(bar, { 'top': top_1 + 'px', 'height': '' });\n }\n else {\n setStyle(bar, { 'top': '', 'height': '' });\n }\n var tbWidth = (isNOU(scrollCnt)) ? this.tbItems.offsetWidth : scrollCnt.offsetWidth;\n if (tbWidth !== 0) {\n setStyle(bar, { 'left': trg.offsetLeft + 'px', 'right': tbWidth - (trg.offsetLeft + trg.offsetWidth) + 'px' });\n }\n else {\n setStyle(bar, { 'left': 'auto', 'right': 'auto' });\n }\n }\n if (!isNOU(this.bdrLine) && !trg.classList.contains(CLS_TB_POPUP)) {\n this.bdrLine.classList.remove(CLS_HIDDEN);\n }\n };\n Tab.prototype.setActive = function (value, skipDataBind, isInteracted) {\n if (skipDataBind === void 0) { skipDataBind = false; }\n if (isInteracted === void 0) { isInteracted = false; }\n this.tbItem = selectAll('.' + CLS_TB_ITEM, this.getTabHeader());\n var trg = this.tbItem[value];\n if (value < 0 || isNaN(value) || this.tbItem.length === 0 || !isNOU(trg) && trg.classList.contains(CLS_DISABLE)) {\n return;\n }\n if (value >= 0 && !skipDataBind) {\n this.allowServerDataBinding = false;\n this.setProperties({ selectedItem: value }, true);\n this.allowServerDataBinding = true;\n if (!this.initRender) {\n this.serverDataBind();\n }\n }\n if (trg.classList.contains(CLS_ACTIVE)) {\n this.setActiveBorder();\n return;\n }\n if (!this.isTemplate) {\n attributes(trg.firstElementChild, { 'aria-controls': CLS_CONTENT + this.tabId + '_' + value });\n }\n var id = trg.id;\n this.removeActiveClass();\n trg.classList.add(CLS_ACTIVE);\n trg.firstElementChild.setAttribute('aria-selected', 'true');\n var no = Number(this.extIndex(id));\n if (isNOU(this.prevActiveEle)) {\n this.prevActiveEle = CLS_CONTENT + this.tabId + '_' + no;\n }\n if (this.isTemplate) {\n if (select('.' + CLS_CONTENT, this.element).children.length > 0) {\n var trg_1 = this.findEle(select('.' + CLS_CONTENT, this.element).children, CLS_CONTENT + this.tabId + '_' + no);\n if (!isNOU(trg_1)) {\n trg_1.classList.add(CLS_ACTIVE);\n }\n this.triggerAnimation(id, this.enableAnimation);\n }\n }\n else {\n this.cntEle = select('.' + CLS_TAB + ' > .' + CLS_CONTENT, this.element);\n var item = this.getTrgContent(this.cntEle, this.extIndex(id));\n if (isNOU(item)) {\n this.cntEle.appendChild(this.createElement('div', {\n id: CLS_CONTENT + this.tabId + '_' + this.extIndex(id), className: CLS_ITEM + ' ' + CLS_ACTIVE,\n attrs: { role: 'tabpanel', 'aria-labelledby': CLS_ITEM + this.tabId + '_' + this.extIndex(id) }\n }));\n var eleTrg = this.getTrgContent(this.cntEle, this.extIndex(id));\n var itemIndex = Array.prototype.indexOf.call(this.itemIndexArray, id);\n this.getContent(eleTrg, this.items[itemIndex].content, 'render', itemIndex);\n }\n else {\n item.classList.add(CLS_ACTIVE);\n }\n this.triggerAnimation(id, this.enableAnimation);\n }\n this.setActiveBorder();\n this.refreshItemVisibility(trg);\n if (!this.initRender && !skipDataBind) {\n var eventArg = {\n previousItem: this.prevItem,\n previousIndex: this.prevIndex,\n selectedItem: trg,\n selectedIndex: value,\n selectedContent: select('#' + CLS_CONTENT + this.tabId + '_' + this.selectingID, this.content),\n isSwiped: this.isSwiped,\n isInteracted: isInteracted,\n preventFocus: false\n };\n this.trigger('selected', eventArg, function (selectEventArgs) {\n if (!selectEventArgs.preventFocus) {\n trg.firstElementChild.focus();\n }\n });\n }\n };\n Tab.prototype.setItems = function (items) {\n this.isReplace = true;\n this.tbItems = select('.' + CLS_TB_ITEMS, this.getTabHeader());\n this.tbObj.items = this.parseObject(items, 0);\n this.tbObj.dataBind();\n this.isReplace = false;\n };\n Tab.prototype.setRTL = function (value) {\n this.tbObj.enableRtl = value;\n this.tbObj.dataBind();\n this.setCssClass(this.element, CLS_RTL, value);\n this.refreshActiveBorder();\n };\n Tab.prototype.refreshActiveBorder = function () {\n if (!isNOU(this.bdrLine)) {\n this.bdrLine.classList.add(CLS_HIDDEN);\n }\n this.setActiveBorder();\n };\n Tab.prototype.showPopup = function (config) {\n var tbPop = select('.e-popup.e-toolbar-pop', this.hdrEle);\n if (tbPop && tbPop.classList.contains('e-popup-close')) {\n var tbPopObj = (tbPop && tbPop.ej2_instances[0]);\n tbPopObj.position.X = (this.headerPlacement === 'Left' || this.element.classList.contains(CLS_RTL)) ? 'left' : 'right';\n tbPopObj.dataBind();\n tbPopObj.show(config);\n }\n };\n Tab.prototype.bindDraggable = function () {\n var _this = this;\n if (this.allowDragAndDrop) {\n var tabHeader = this.element.querySelector('.' + CLS_HEADER);\n if (tabHeader) {\n var items = Array.prototype.slice.call(tabHeader.querySelectorAll('.' + CLS_TB_ITEM));\n items.forEach(function (element) {\n _this.initializeDrag(element);\n });\n }\n }\n };\n Tab.prototype.wireEvents = function () {\n this.bindDraggable();\n window.addEventListener('resize', this.resizeContext);\n EventHandler.add(this.element, 'mouseover', this.hoverHandler, this);\n EventHandler.add(this.element, 'keydown', this.spaceKeyDown, this);\n if (!isNOU(this.cntEle)) {\n this.touchModule = new Touch(this.cntEle, { swipe: this.swipeHandler.bind(this) });\n }\n this.keyModule = new KeyboardEvents(this.element, { keyAction: this.keyHandler.bind(this), keyConfigs: this.keyConfigs });\n this.tabKeyModule = new KeyboardEvents(this.element, {\n keyAction: this.keyHandler.bind(this),\n keyConfigs: { openPopup: 'shift+f10', tab: 'tab', shiftTab: 'shift+tab' },\n eventName: 'keydown'\n });\n };\n Tab.prototype.unWireEvents = function () {\n if (!isNOU(this.keyModule)) {\n this.keyModule.destroy();\n }\n if (!isNOU(this.tabKeyModule)) {\n this.tabKeyModule.destroy();\n }\n if (!isNOU(this.cntEle) && !isNOU(this.touchModule)) {\n this.touchModule.destroy();\n this.touchModule = null;\n }\n window.removeEventListener('resize', this.resizeContext);\n EventHandler.remove(this.element, 'mouseover', this.hoverHandler);\n EventHandler.remove(this.element, 'keydown', this.spaceKeyDown);\n this.element.classList.remove(CLS_RTL);\n this.element.classList.remove(CLS_FOCUS);\n };\n Tab.prototype.clickHandler = function (args) {\n this.element.classList.remove(CLS_FOCUS);\n var trg = args.originalEvent.target;\n var trgParent = closest(trg, '.' + CLS_TB_ITEM);\n var trgIndex = this.getEleIndex(trgParent);\n if (trg.classList.contains(CLS_ICON_CLOSE)) {\n this.removeTab(trgIndex);\n }\n else if (this.isVertical() && closest(trg, '.' + CLS_HOR_NAV)) {\n this.showPopup(this.show);\n }\n else {\n this.isPopup = false;\n if (!isNOU(trgParent) && (trgIndex !== this.selectedItem)) {\n this.selectTab(trgIndex, args.originalEvent, true);\n }\n }\n };\n Tab.prototype.swipeHandler = function (e) {\n if (e.velocity < 3 && isNOU(e.originalEvent.changedTouches)) {\n return;\n }\n if (this.isNested) {\n this.element.setAttribute('data-swipe', 'true');\n }\n var nestedTab = this.element.querySelector('[data-swipe=\"true\"]');\n if (nestedTab) {\n nestedTab.removeAttribute('data-swipe');\n return;\n }\n this.isSwiped = true;\n if (e.swipeDirection === 'Right' && this.selectedItem !== 0) {\n for (var k = this.selectedItem - 1; k >= 0; k--) {\n if (!this.tbItem[k].classList.contains(CLS_HIDDEN)) {\n this.selectTab(k, null, true);\n break;\n }\n }\n }\n else if (e.swipeDirection === 'Left' && (this.selectedItem !== selectAll('.' + CLS_TB_ITEM, this.element).length - 1)) {\n for (var i = this.selectedItem + 1; i < this.tbItem.length; i++) {\n if (!this.tbItem[i].classList.contains(CLS_HIDDEN)) {\n this.selectTab(i, null, true);\n break;\n }\n }\n }\n this.isSwiped = false;\n };\n Tab.prototype.spaceKeyDown = function (e) {\n if ((e.keyCode === 32 && e.which === 32) || (e.keyCode === 35 && e.which === 35)) {\n var clstHead = closest(e.target, '.' + CLS_HEADER);\n if (!isNOU(clstHead)) {\n e.preventDefault();\n }\n }\n };\n Tab.prototype.keyHandler = function (e) {\n if (this.element.classList.contains(CLS_DISABLE)) {\n return;\n }\n this.element.classList.add(CLS_FOCUS);\n var trg = e.target;\n var tabHeader = this.getTabHeader();\n var actEle = select('.' + CLS_ACTIVE, tabHeader);\n this.popEle = select('.' + CLS_TB_POP, tabHeader);\n if (!isNOU(this.popEle)) {\n this.popObj = this.popEle.ej2_instances[0];\n }\n var item = closest(document.activeElement, '.' + CLS_TB_ITEM);\n var trgParent = closest(trg, '.' + CLS_TB_ITEM);\n switch (e.action) {\n case 'space':\n case 'enter':\n if (trg.parentElement.classList.contains(CLS_DISABLE)) {\n return;\n }\n if (e.action === 'enter' && trg.classList.contains('e-hor-nav')) {\n this.showPopup(this.show);\n break;\n }\n this.keyPressed(trg);\n break;\n case 'tab':\n case 'shiftTab':\n if (trg.classList.contains(CLS_WRAP)\n && closest(trg, '.' + CLS_TB_ITEM).classList.contains(CLS_ACTIVE) === false) {\n trg.setAttribute('tabindex', trg.getAttribute('data-tabindex'));\n }\n if (this.popObj && isVisible(this.popObj.element)) {\n this.popObj.hide(this.hide);\n }\n if (!isNOU(actEle) && actEle.children.item(0).getAttribute('tabindex') === '-1') {\n actEle.children.item(0).setAttribute('tabindex', '0');\n }\n break;\n case 'moveLeft':\n case 'moveRight':\n if (!isNOU(item)) {\n this.refreshItemVisibility(item);\n }\n break;\n case 'openPopup':\n e.preventDefault();\n if (!isNOU(this.popEle) && this.popEle.classList.contains(CLS_POPUP_CLOSE)) {\n this.popObj.show(this.show);\n }\n break;\n case 'delete':\n if (this.showCloseButton === true && !isNOU(trgParent)) {\n var nxtSib = trgParent.nextSibling;\n if (!isNOU(nxtSib) && nxtSib.classList.contains(CLS_TB_ITEM)) {\n nxtSib.firstElementChild.focus();\n }\n this.removeTab(this.getEleIndex(trgParent));\n }\n this.setActiveBorder();\n break;\n }\n };\n Tab.prototype.refreshItemVisibility = function (target) {\n var scrCnt = select('.' + this.scrCntClass, this.tbItems);\n if (!this.isVertical() && !isNOU(scrCnt)) {\n var scrBar = select('.e-hscroll-bar', this.tbItems);\n var scrStart = scrBar.scrollLeft;\n var scrEnd = scrStart + scrBar.offsetWidth;\n var eleStart = target.offsetLeft;\n var eleWidth = target.offsetWidth;\n var eleEnd = target.offsetLeft + target.offsetWidth;\n if ((scrStart < eleStart) && (scrEnd < eleEnd)) {\n var eleViewRange = scrEnd - eleStart;\n scrBar.scrollLeft = scrStart + (eleWidth - eleViewRange);\n }\n else {\n if ((scrStart > eleStart) && (scrEnd > eleEnd)) {\n var eleViewRange = eleEnd - scrStart;\n scrBar.scrollLeft = scrStart - (eleWidth - eleViewRange);\n }\n }\n }\n else {\n return;\n }\n };\n Tab.prototype.getIndexFromEle = function (id) {\n return parseInt(id.substring(id.lastIndexOf('_') + 1), 10);\n };\n Tab.prototype.hoverHandler = function (e) {\n var trg = e.target;\n if (!isNOU(trg.classList) && trg.classList.contains(CLS_ICON_CLOSE)) {\n trg.setAttribute('title', new L10n('tab', { closeButtonTitle: this.title }, this.locale).getConstant('closeButtonTitle'));\n }\n };\n Tab.prototype.evalOnPropertyChangeItems = function (newProp, oldProp) {\n var _this = this;\n if (!(newProp.items instanceof Array && oldProp.items instanceof Array)) {\n var changedProp = Object.keys(newProp.items);\n for (var i = 0; i < changedProp.length; i++) {\n var index = parseInt(Object.keys(newProp.items)[i], 10);\n var properties = Object.keys(newProp.items[index]);\n for (var j = 0; j < properties.length; j++) {\n var oldVal = Object(oldProp.items[index])[properties[j]];\n var newVal = Object(newProp.items[index])[properties[j]];\n var hdr = this.element.querySelectorAll('.' + CLS_TB_ITEM)[index];\n var itemIndex = void 0;\n if (hdr && !isNOU(hdr.id) && hdr.id !== '') {\n itemIndex = this.getIndexFromEle(hdr.id);\n }\n else {\n itemIndex = index;\n }\n var hdrItem = select('.' + CLS_TB_ITEMS + ' #' + CLS_ITEM + this.tabId + '_' + itemIndex, this.element);\n var cntItem = select('.' + CLS_CONTENT + ' #' + CLS_CONTENT + this.tabId + '_' + itemIndex, this.element);\n if (properties[j] === 'header' || properties[j] === 'headerTemplate') {\n var icon = (isNOU(this.items[index].header) ||\n isNOU(this.items[index].header.iconCss)) ? '' : this.items[index].header.iconCss;\n var textVal = this.items[index].headerTemplate || this.items[index].header.text;\n if (properties[j] === 'headerTemplate') {\n this.clearTabTemplate(hdrItem, properties[j], CLS_TB_ITEM);\n }\n if ((textVal === '') && (icon === '')) {\n this.removeTab(index);\n }\n else {\n this.tbId = hdr.id;\n var arr = [];\n arr.push(this.items[index]);\n this.items.splice(index, 1);\n this.itemIndexArray.splice(index, 1);\n this.tbObj.items.splice(index, 1);\n var isHiddenEle = hdrItem.classList.contains(CLS_HIDDEN);\n detach(hdrItem);\n this.isReplace = true;\n this.addTab(arr, index);\n if (isHiddenEle) {\n this.hideTab(index);\n }\n this.isReplace = false;\n }\n }\n if (properties[j] === 'content' && !isNOU(cntItem)) {\n var strVal = typeof newVal === 'string' || isNOU(newVal.innerHTML);\n if (strVal && (newVal[0] === '.' || newVal[0] === '#') && newVal.length) {\n var eleVal = document.querySelector(newVal);\n cntItem.appendChild(eleVal);\n eleVal.style.display = '';\n }\n else if (newVal === '' && oldVal[0] === '#') {\n document.body.appendChild(this.element.querySelector(oldVal)).style.display = 'none';\n cntItem.innerHTML = newVal;\n }\n else if (this.isAngular || this.isReact) {\n this.clearTabTemplate(cntItem, properties[j], CLS_ITEM);\n cntItem.innerHTML = '';\n this.templateCompile(cntItem, newVal, index);\n }\n else if (typeof newVal !== 'function') {\n cntItem.innerHTML = newVal;\n }\n }\n if (properties[j] === 'cssClass') {\n if (!isNOU(hdrItem)) {\n hdrItem.classList.remove(oldVal);\n hdrItem.classList.add(newVal);\n }\n if (!isNOU(cntItem)) {\n cntItem.classList.remove(oldVal);\n cntItem.classList.add(newVal);\n }\n }\n if (properties[j] === 'disabled') {\n this.enableTab(index, ((newVal === true) ? false : true));\n }\n if (properties[j] === 'visible') {\n this.hideTab(index, ((newVal === true) ? false : true));\n }\n }\n }\n if (this.isReact && this.portals && this.portals.length > 0) {\n this.renderReactTemplates(function () {\n _this.refreshActiveTabBorder();\n });\n }\n }\n else {\n this.lastIndex = 0;\n if (isNOU(this.tbObj)) {\n this.reRenderItems();\n }\n else {\n if (this.isReact || this.isAngular) {\n this.clearTemplate();\n }\n this.setItems(newProp.items);\n if (this.templateEle.length > 0) {\n this.expTemplateContent();\n }\n this.templateEle = [];\n var selectElement = select('.' + CLS_TAB + ' > .' + CLS_CONTENT, this.element);\n while (selectElement.firstElementChild) {\n detach(selectElement.firstElementChild);\n }\n this.select(this.selectedItem);\n this.draggableItems = [];\n this.bindDraggable();\n }\n }\n };\n Tab.prototype.clearTabTemplate = function (templateEle, templateName, className) {\n if (!this.clearTemplates) {\n return;\n }\n if (this.registeredTemplate && this.registeredTemplate[templateName]) {\n var registeredTemplates = this.registeredTemplate;\n for (var index = 0; index < registeredTemplates[templateName].length; index++) {\n var registeredItem = registeredTemplates[templateName][index].rootNodes[0];\n var closestItem = closest(registeredItem, '.' + className);\n if (!isNullOrUndefined(closestItem) && closestItem === templateEle) {\n this.clearTemplate([templateName], [registeredTemplates[templateName][index]]);\n break;\n }\n }\n }\n else if (this.portals && this.portals.length > 0) {\n var portals = this.portals;\n for (var index = 0; index < portals.length; index++) {\n var portalItem = portals[index];\n var closestItem = closest(portalItem.containerInfo, '.' + className);\n if (!isNullOrUndefined(closestItem) && closestItem === templateEle) {\n this.clearTemplate([templateName], index);\n break;\n }\n }\n }\n };\n Tab.prototype.initializeDrag = function (target) {\n var _this = this;\n var dragObj = new Draggable(target, {\n dragArea: this.dragArea,\n dragTarget: '.' + CLS_TB_ITEM,\n clone: true,\n helper: this.helper.bind(this),\n dragStart: this.itemDragStart.bind(this),\n drag: function (e) {\n var dragIndex = _this.getEleIndex(_this.dragItem);\n var dropIndex;\n var dropItem;\n var dragArgs = {\n draggedItem: _this.dragItem,\n event: e.event,\n target: e.target,\n droppedItem: e.target.closest('.' + CLS_TB_ITEM),\n clonedElement: _this.cloneElement,\n index: dragIndex\n };\n if (!isNOU(e.target.closest('.' + CLS_TAB)) && !e.target.closest('.' + CLS_TAB).isEqualNode(_this.element) &&\n _this.dragArea !== '.' + CLS_HEADER) {\n _this.trigger('dragging', dragArgs);\n }\n else {\n if (!(e.target.closest(_this.dragArea)) && _this.overflowMode !== 'Popup') {\n document.body.style.cursor = 'not-allowed';\n addClass([_this.cloneElement], CLS_HIDDEN);\n if (_this.dragItem.classList.contains(CLS_HIDDEN)) {\n removeClass([_this.dragItem], CLS_HIDDEN);\n }\n _this.dragItem.querySelector('.' + CLS_WRAP).style.visibility = 'visible';\n }\n else {\n document.body.style.cursor = '';\n _this.dragItem.querySelector('.' + CLS_WRAP).style.visibility = 'hidden';\n if (_this.cloneElement.classList.contains(CLS_HIDDEN)) {\n removeClass([_this.cloneElement], CLS_HIDDEN);\n }\n }\n if (_this.overflowMode === 'Scrollable' && !isNOU(_this.element.querySelector('.e-hscroll'))) {\n var scrollRightNavEle = _this.element.querySelector('.e-scroll-right-nav');\n var scrollLeftNavEle = _this.element.querySelector('.e-scroll-left-nav');\n var hscrollBar = _this.element.querySelector('.e-hscroll-bar');\n if (!isNOU(scrollRightNavEle) && Math.abs((scrollRightNavEle.offsetWidth / 2) +\n scrollRightNavEle.offsetLeft) > _this.cloneElement.offsetLeft + _this.cloneElement.offsetWidth) {\n hscrollBar.scrollLeft -= 10;\n }\n if (!isNOU(scrollLeftNavEle) && Math.abs((scrollLeftNavEle.offsetLeft + scrollLeftNavEle.offsetWidth) -\n _this.cloneElement.offsetLeft) > (scrollLeftNavEle.offsetWidth / 2)) {\n hscrollBar.scrollLeft += 10;\n }\n }\n _this.cloneElement.style.pointerEvents = 'none';\n dropItem = closest(e.target, '.' + CLS_TB_ITEM + '.e-draggable');\n var scrollContentWidth = 0;\n if (_this.overflowMode === 'Scrollable' && !isNOU(_this.element.querySelector('.e-hscroll'))) {\n scrollContentWidth = _this.element.querySelector('.e-hscroll-content').offsetWidth;\n }\n if (dropItem != null && !dropItem.isSameNode(_this.dragItem) &&\n dropItem.closest('.' + CLS_TAB).isSameNode(_this.dragItem.closest('.' + CLS_TAB))) {\n dropIndex = _this.getEleIndex(dropItem);\n if (dropIndex < dragIndex &&\n (Math.abs((dropItem.offsetLeft + dropItem.offsetWidth) -\n _this.cloneElement.offsetLeft) > (dropItem.offsetWidth / 2))) {\n _this.dragAction(dropItem, dragIndex, dropIndex);\n }\n if (dropIndex > dragIndex &&\n (Math.abs(dropItem.offsetWidth / 2) + dropItem.offsetLeft -\n scrollContentWidth) < _this.cloneElement.offsetLeft + _this.cloneElement.offsetWidth) {\n _this.dragAction(dropItem, dragIndex, dropIndex);\n }\n }\n _this.droppedIndex = _this.getEleIndex(_this.dragItem);\n _this.trigger('dragging', dragArgs);\n }\n },\n dragStop: this.itemDragStop.bind(this)\n });\n this.draggableItems.push(dragObj);\n };\n Tab.prototype.helper = function (e) {\n this.cloneElement = this.createElement('div');\n if (e.element) {\n this.cloneElement = (e.element.cloneNode(true));\n addClass([this.cloneElement], 'e-tab-clone-element');\n if (this.element.querySelector('.' + CLS_HEADER).classList.contains(CLS_CLOSE_SHOW)) {\n addClass([this.cloneElement], CLS_CLOSE_SHOW);\n }\n removeClass([this.cloneElement.querySelector('.' + CLS_WRAP)], 'e-ripple');\n if (!isNOU(this.cloneElement.querySelector('.e-ripple-element'))) {\n remove(this.cloneElement.querySelector('.e-ripple-element'));\n }\n document.body.appendChild(this.cloneElement);\n }\n return this.cloneElement;\n };\n Tab.prototype.itemDragStart = function (e) {\n var _this = this;\n this.draggingItems = this.items.map(function (x) { return x; });\n this.dragItem = e.element;\n var dragArgs = {\n draggedItem: e.element,\n event: e.event,\n target: e.target,\n droppedItem: null,\n index: this.getEleIndex(this.dragItem),\n clonedElement: this.cloneElement,\n cancel: false\n };\n this.trigger('onDragStart', dragArgs, function (tabItemDragArgs) {\n if (tabItemDragArgs.cancel) {\n var dragObj = e.element.ej2_instances[0];\n if (!isNullOrUndefined(dragObj)) {\n dragObj.intDestroy(e.event);\n }\n detach(_this.cloneElement);\n }\n else {\n _this.removeActiveClass();\n addClass([_this.tbItems.querySelector('.' + CLS_INDICATOR)], CLS_HIDDEN);\n _this.dragItem.querySelector('.' + CLS_WRAP).style.visibility = 'hidden';\n }\n });\n };\n Tab.prototype.dragAction = function (dropItem, dragsIndex, dropIndex) {\n if (this.items.length > 0) {\n var item = this.draggingItems[dragsIndex];\n this.draggingItems.splice(dragsIndex, 1);\n this.draggingItems.splice(dropIndex, 0, item);\n }\n if (this.overflowMode === 'MultiRow') {\n dropItem.parentNode.insertBefore(this.dragItem, dropItem.nextElementSibling);\n }\n if (dragsIndex > dropIndex) {\n if (!(this.dragItem.parentElement).isSameNode(dropItem.parentElement)) {\n if (this.overflowMode === 'Extended') {\n if (dropItem.isSameNode(dropItem.parentElement.lastChild)) {\n var popupContainer = this.dragItem.parentNode;\n dropItem.parentNode.insertBefore(this.dragItem, dropItem);\n popupContainer.insertBefore(dropItem.parentElement.lastChild, popupContainer.childNodes[0]);\n }\n else {\n this.dragItem.parentNode.insertBefore((dropItem.parentElement.lastChild), this.dragItem.parentElement.childNodes[0]);\n dropItem.parentNode.insertBefore(this.dragItem, dropItem);\n }\n }\n else {\n var lastEle = (dropItem.parentElement).lastChild;\n if (dropItem.isSameNode(lastEle)) {\n var popupContainer = this.dragItem.parentNode;\n dropItem.parentNode.insertBefore(this.dragItem, dropItem);\n popupContainer.insertBefore(lastEle, popupContainer.childNodes[0]);\n }\n else {\n this.dragItem.parentNode.insertBefore((dropItem.parentElement).lastChild, this.dragItem.parentElement.childNodes[0]);\n dropItem.parentNode.insertBefore(this.dragItem, dropItem);\n }\n }\n }\n else {\n this.dragItem.parentNode.insertBefore(this.dragItem, dropItem);\n }\n }\n if (dragsIndex < dropIndex) {\n if (!(this.dragItem.parentElement).isSameNode(dropItem.parentElement)) {\n if (this.overflowMode === 'Extended') {\n this.dragItem.parentElement.appendChild(dropItem.parentElement.firstElementChild);\n dropItem.parentNode.insertBefore(this.dragItem, dropItem.nextSibling);\n }\n else {\n this.dragItem.parentNode.insertBefore((dropItem.parentElement).lastChild, this.dragItem.parentElement.childNodes[0]);\n dropItem.parentNode.insertBefore(this.dragItem, dropItem);\n }\n }\n else {\n this.dragItem.parentNode.insertBefore(this.dragItem, dropItem.nextElementSibling);\n }\n }\n };\n Tab.prototype.itemDragStop = function (e) {\n var _this = this;\n detach(this.cloneElement);\n this.cloneElement = null;\n this.dragItem.querySelector('.' + CLS_WRAP).style.visibility = 'visible';\n document.body.style.cursor = '';\n var dragStopArgs = {\n draggedItem: this.dragItem,\n event: e.event,\n target: e.target,\n droppedItem: this.tbItem[this.droppedIndex],\n clonedElement: null,\n index: this.droppedIndex,\n cancel: false\n };\n this.trigger('dragged', dragStopArgs, function (tabItemDropArgs) {\n if (tabItemDropArgs.cancel) {\n _this.refresh();\n }\n else {\n if (_this.items.length > 0 && _this.draggingItems.length > 0) {\n _this.items = _this.draggingItems;\n _this.selectedItem = _this.droppedIndex;\n _this.refresh();\n }\n else {\n _this.dragItem.querySelector('.' + CLS_WRAP).style.visibility = '';\n removeClass([_this.tbItems.querySelector('.' + CLS_INDICATOR)], CLS_HIDDEN);\n _this.selectTab(_this.droppedIndex, null, true);\n }\n }\n });\n this.dragItem = null;\n };\n /**\n * Enables or disables the specified Tab item. On passing value as `false`, the item will be disabled.\n *\n * @param {number} index - Index value of target Tab item.\n * @param {boolean} value - Boolean value that determines whether the command should be enabled or disabled.\n * By default, isEnable is true.\n * @returns {void}.\n */\n Tab.prototype.enableTab = function (index, value) {\n var tbItems = selectAll('.' + CLS_TB_ITEM, this.element)[index];\n if (isNOU(tbItems)) {\n return;\n }\n if (value === true) {\n tbItems.classList.remove(CLS_DISABLE, CLS_OVERLAY);\n tbItems.firstElementChild.setAttribute('tabindex', tbItems.firstElementChild.getAttribute('data-tabindex'));\n }\n else {\n tbItems.classList.add(CLS_DISABLE, CLS_OVERLAY);\n tbItems.firstElementChild.removeAttribute('tabindex');\n if (tbItems.classList.contains(CLS_ACTIVE)) {\n this.select(index + 1);\n }\n }\n if (!isNOU(this.items[index])) {\n this.items[index].disabled = !value;\n this.dataBind();\n }\n tbItems.firstElementChild.setAttribute('aria-disabled', (value === true) ? 'false' : 'true');\n };\n /**\n * Adds new items to the Tab that accepts an array as Tab items.\n *\n * @param {TabItemModel[]} items - An array of item that is added to the Tab.\n * @param {number} index - Number value that determines where the items to be added. By default, index is 0.\n * @returns {void}.\n */\n Tab.prototype.addTab = function (items, index) {\n var _this = this;\n var addArgs = { addedItems: items, cancel: false };\n if (!this.isReplace) {\n this.trigger('adding', addArgs, function (tabAddingArgs) {\n if (!tabAddingArgs.cancel) {\n _this.addingTabContent(items, index);\n }\n });\n }\n else {\n this.addingTabContent(items, index);\n }\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n Tab.prototype.addingTabContent = function (items, index) {\n var _this = this;\n var lastEleIndex = 0;\n this.hdrEle = select('.' + CLS_HEADER, this.element);\n if (isNOU(this.hdrEle)) {\n this.items = items;\n this.reRenderItems();\n this.bindDraggable();\n }\n else {\n var itemsCount = selectAll('.e-tab-header .' + CLS_TB_ITEM, this.element).length;\n if (itemsCount !== 0) {\n lastEleIndex = this.lastIndex + 1;\n }\n if (isNOU(index)) {\n index = itemsCount - 1;\n }\n if (itemsCount < index || index < 0 || isNaN(index)) {\n return;\n }\n if (itemsCount === 0 && !isNOU(this.hdrEle)) {\n this.hdrEle.style.display = '';\n }\n if (!isNOU(this.bdrLine)) {\n this.bdrLine.classList.add(CLS_HIDDEN);\n }\n this.tbItems = select('.' + CLS_TB_ITEMS, this.getTabHeader());\n this.isAdd = true;\n var tabItems_2 = this.parseObject(items, index);\n this.isAdd = false;\n var i_1 = 0;\n var textValue_1;\n items.forEach(function (item, place) {\n textValue_1 = item.headerTemplate || item.header.text;\n if (!(isNOU(item.headerTemplate || item.header) || isNOU(textValue_1) ||\n (textValue_1.length === 0) && !isNOU(item.header) && isNOU(item.header.iconCss))) {\n if (tabItems_2[place]) {\n if (isNOU(item.id)) {\n item.id = CLS_ITEM + _this.tabId + '_' + TABITEMPREFIX + (lastEleIndex + place).toString();\n }\n tabItems_2[place].htmlAttributes['data-id'] = item.id;\n }\n _this.items.splice((index + i_1), 0, item);\n i_1++;\n }\n if (_this.isTemplate && !isNOU(item.header) && !isNOU(item.header.text)) {\n var no = lastEleIndex + place;\n var ele = _this.createElement('div', {\n id: CLS_CONTENT + _this.tabId + '_' + no, className: CLS_ITEM,\n attrs: { role: 'tabpanel', 'aria-labelledby': CLS_ITEM + '_' + no }\n });\n _this.cntEle.insertBefore(ele, _this.cntEle.children[(index + place)]);\n var eleTrg = _this.getTrgContent(_this.cntEle, no.toString());\n _this.getContent(eleTrg, item.content, 'render', index);\n }\n });\n this.tbObj.addItems(tabItems_2, index);\n if (!this.isReplace) {\n this.trigger('added', { addedItems: items });\n }\n if (this.selectedItem === index) {\n this.select(index);\n }\n else {\n this.setActiveBorder();\n this.tbItem = selectAll('.' + CLS_TB_ITEM, this.getTabHeader());\n }\n this.bindDraggable();\n }\n };\n /**\n * Removes the items in the Tab from the specified index.\n *\n * @param {number} index - Index of target item that is going to be removed.\n * @returns {void}.\n */\n Tab.prototype.removeTab = function (index) {\n var _this = this;\n var trg = selectAll('.' + CLS_TB_ITEM, this.element)[index];\n if (isNOU(trg)) {\n return;\n }\n var removeArgs = { removedItem: trg, removedIndex: index, cancel: false };\n this.trigger('removing', removeArgs, function (tabRemovingArgs) {\n if (!tabRemovingArgs.cancel) {\n var header = select('#' + CLS_ITEM + _this.tabId + '_' + _this.extIndex(trg.id), select('.' + CLS_TB_ITEMS, _this.element));\n if (!isNOU(header)) {\n _this.clearTabTemplate(header, 'headerTemplate', CLS_TB_ITEM);\n }\n _this.tbObj.removeItems(index);\n if (_this.allowDragAndDrop && (index !== Array.prototype.indexOf.call(_this.itemIndexArray, trg.id))) {\n index = Array.prototype.indexOf.call(_this.itemIndexArray, trg.id);\n }\n var targetEleIndex = _this.itemIndexArray.indexOf(trg.id);\n _this.items.splice(targetEleIndex, 1);\n _this.itemIndexArray.splice(targetEleIndex, 1);\n _this.refreshActiveBorder();\n var cntTrg = select('#' + CLS_CONTENT + _this.tabId + '_' + _this.extIndex(trg.id), select('.' + CLS_CONTENT, _this.element));\n if (!isNOU(cntTrg)) {\n _this.clearTabTemplate(cntTrg, 'content', CLS_ITEM);\n detach(cntTrg);\n }\n _this.trigger('removed', tabRemovingArgs);\n if (_this.draggableItems && _this.draggableItems.length > 0) {\n _this.draggableItems[index].destroy();\n _this.draggableItems[index] = null;\n _this.draggableItems.splice(index, 1);\n }\n if (trg.classList.contains(CLS_ACTIVE)) {\n index = (index > selectAll('.' + CLS_TB_ITEM + ':not(.' + CLS_TB_POPUP + ')', _this.element).length - 1) ? index - 1 : index;\n _this.enableAnimation = false;\n _this.selectedItem = index;\n _this.select(index);\n }\n else if (index !== _this.selectedItem) {\n if (index < _this.selectedItem) {\n index = _this.itemIndexArray.indexOf(_this.tbItem[_this.selectedItem].id);\n _this.setProperties({ selectedItem: index > -1 ? index : _this.selectedItem }, true);\n _this.prevIndex = _this.selectedItem;\n }\n _this.tbItem = selectAll('.' + CLS_TB_ITEM, _this.getTabHeader());\n }\n if (selectAll('.' + CLS_TB_ITEM, _this.element).length === 0) {\n _this.hdrEle.style.display = 'none';\n }\n _this.enableAnimation = true;\n }\n });\n };\n /**\n * Shows or hides the Tab that is in the specified index.\n *\n * @param {number} index - Index value of target item.\n * @param {boolean} value - Based on this Boolean value, item will be hide (false) or show (true). By default, value is true.\n * @returns {void}.\n */\n Tab.prototype.hideTab = function (index, value) {\n var items;\n var item = selectAll('.' + CLS_TB_ITEM, this.element)[index];\n if (isNOU(item)) {\n return;\n }\n if (isNOU(value)) {\n value = true;\n }\n this.bdrLine.classList.add(CLS_HIDDEN);\n if (value === true) {\n item.classList.add(CLS_HIDDEN);\n items = selectAll('.' + CLS_TB_ITEM + ':not(.' + CLS_HIDDEN + ')', this.tbItems);\n if (items.length !== 0 && item.classList.contains(CLS_ACTIVE)) {\n if (index !== 0) {\n for (var i = index - 1; i >= 0; i--) {\n if (!this.tbItem[i].classList.contains(CLS_HIDDEN)) {\n this.select(i);\n break;\n }\n else if (i === 0) {\n for (var k = index + 1; k < this.tbItem.length; k++) {\n if (!this.tbItem[k].classList.contains(CLS_HIDDEN)) {\n this.select(k);\n break;\n }\n }\n }\n }\n }\n else {\n for (var k = index + 1; k < this.tbItem.length; k++) {\n if (!this.tbItem[k].classList.contains(CLS_HIDDEN)) {\n this.select(k);\n break;\n }\n }\n }\n }\n else if (items.length === 0) {\n this.element.classList.add(CLS_HIDDEN);\n }\n }\n else {\n this.element.classList.remove(CLS_HIDDEN);\n items = selectAll('.' + CLS_TB_ITEM + ':not(.' + CLS_HIDDEN + ')', this.tbItems);\n item.classList.remove(CLS_HIDDEN);\n if (items.length === 0) {\n this.select(index);\n }\n }\n this.setActiveBorder();\n if (!isNullOrUndefined(item.firstElementChild)) {\n item.firstElementChild.setAttribute('aria-hidden', '' + value);\n }\n if (this.overflowMode === 'Popup' && this.tbObj) {\n this.tbObj.refreshOverflow();\n }\n };\n Tab.prototype.selectTab = function (args, event, isInteracted) {\n if (event === void 0) { event = null; }\n if (isInteracted === void 0) { isInteracted = false; }\n this.isInteracted = isInteracted;\n this.select(args, event);\n };\n /**\n * Specifies the index or HTMLElement to select an item from the Tab.\n *\n * @param {number | HTMLElement} args - Index or DOM element is used for selecting an item from the Tab.\n * @param {Event} event - An event which takes place in DOM.\n * @returns {void}\n */\n Tab.prototype.select = function (args, event) {\n var _this = this;\n var tabHeader = this.getTabHeader();\n this.tbItems = select('.' + CLS_TB_ITEMS, tabHeader);\n this.tbItem = selectAll('.' + CLS_TB_ITEM, tabHeader);\n this.content = select('.' + CLS_CONTENT, this.element);\n this.prevItem = this.tbItem[this.prevIndex];\n if (isNOU(this.selectedItem) || (this.selectedItem < 0) || (this.tbItem.length <= this.selectedItem) || isNaN(this.selectedItem)) {\n this.selectedItem = 0;\n }\n else {\n this.selectedID = this.extIndex(this.tbItem[this.selectedItem].id);\n }\n var trg = this.tbItem[args];\n if (isNOU(trg)) {\n this.selectedID = '0';\n }\n else {\n this.selectingID = this.extIndex(trg.id);\n }\n if (!isNOU(this.prevItem) && !this.prevItem.classList.contains(CLS_DISABLE)) {\n this.prevItem.children.item(0).setAttribute('tabindex', this.prevItem.firstElementChild.getAttribute('tabindex'));\n }\n var eventArg = {\n event: event,\n previousItem: this.prevItem,\n previousIndex: this.prevIndex,\n selectedItem: this.tbItem[this.selectedItem],\n selectedIndex: this.selectedItem,\n selectedContent: !isNOU(this.content) ?\n select('#' + CLS_CONTENT + this.tabId + '_' + this.selectedID, this.content) : null,\n selectingItem: trg,\n selectingIndex: args,\n selectingContent: !isNOU(this.content) ?\n select('#' + CLS_CONTENT + this.tabId + '_' + this.selectingID, this.content) : null,\n isSwiped: this.isSwiped,\n isInteracted: this.isInteracted,\n cancel: false\n };\n if (!this.initRender) {\n this.trigger('selecting', eventArg, function (selectArgs) {\n if (!selectArgs.cancel) {\n _this.selectingContent(args, _this.isInteracted);\n }\n });\n }\n else {\n this.selectingContent(args, this.isInteracted);\n }\n this.isInteracted = false;\n };\n Tab.prototype.selectingContent = function (args, isInteracted) {\n if (typeof args === 'number') {\n if (!isNOU(this.tbItem[args]) && (this.tbItem[args].classList.contains(CLS_DISABLE) ||\n this.tbItem[args].classList.contains(CLS_HIDDEN))) {\n for (var i = args + 1; i < this.items.length; i++) {\n if (this.items[i].disabled === false && this.items[i].visible === true) {\n args = i;\n break;\n }\n else {\n args = 0;\n }\n }\n }\n if (this.tbItem.length > args && args >= 0 && !isNaN(args)) {\n this.prevIndex = this.selectedItem;\n this.prevItem = this.tbItem[this.prevIndex];\n if (this.tbItem[args].classList.contains(CLS_TB_POPUP) && this.reorderActiveTab) {\n this.setActive(this.popupHandler(this.tbItem[args]), null, isInteracted);\n if ((!isNOU(this.items) && this.items.length > 0) && this.allowDragAndDrop) {\n this.tbItem = selectAll('.' + CLS_TB_ITEMS + ' .' + CLS_TB_ITEM, this.hdrEle);\n var item = this.items[args];\n this.items.splice(args, 1);\n this.items.splice(this.tbItem.length - 1, 0, item);\n var itemId = this.itemIndexArray[args];\n this.itemIndexArray.splice(args, 1);\n this.itemIndexArray.splice(this.tbItem.length - 1, 0, itemId);\n }\n }\n else {\n this.setActive(args, null, isInteracted);\n }\n }\n else {\n this.setActive(0, null, isInteracted);\n }\n }\n else if (args instanceof (HTMLElement)) {\n this.setActive(this.getEleIndex(args), null, isInteracted);\n }\n };\n /**\n * Gets the item index from the Tab.\n *\n * @param {string} tabItemId - Item ID is used for getting index from the Tab.\n * @returns {number} - It returns item index.\n */\n Tab.prototype.getItemIndex = function (tabItemId) {\n var tabIndex;\n for (var i = 0; i < this.tbItem.length; i++) {\n var value = this.tbItem[i].getAttribute('data-id');\n if (tabItemId === value) {\n tabIndex = i;\n break;\n }\n }\n return tabIndex;\n };\n /**\n * Specifies the value to disable/enable the Tab component.\n * When set to `true`, the component will be disabled.\n *\n * @param {boolean} value - Based on this Boolean value, Tab will be enabled (false) or disabled (true).\n * @returns {void}.\n */\n Tab.prototype.disable = function (value) {\n this.setCssClass(this.element, CLS_DISABLE, value);\n this.element.setAttribute('aria-disabled', '' + value);\n };\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @returns {string} - It returns the persisted state.\n */\n Tab.prototype.getPersistData = function () {\n return this.addOnPersist(['selectedItem', 'actEleId']);\n };\n /**\n * Returns the current module name.\n *\n * @returns {string} - It returns the current module name.\n * @private\n */\n Tab.prototype.getModuleName = function () {\n return 'tab';\n };\n /**\n * Gets called when the model property changes.The data that describes the old and new values of the property that changed.\n *\n * @param {TabModel} newProp - It contains the new value of data.\n * @param {TabModel} oldProp - It contains the old value of data.\n * @returns {void}\n * @private\n */\n Tab.prototype.onPropertyChanged = function (newProp, oldProp) {\n var _this = this;\n var sortedKeys = Object.keys(newProp).sort(function (a, b) {\n if (a === 'items')\n return -1;\n if (b === 'items')\n return 1;\n return 0;\n });\n for (var _i = 0, sortedKeys_1 = sortedKeys; _i < sortedKeys_1.length; _i++) {\n var prop = sortedKeys_1[_i];\n switch (prop) {\n case 'width':\n setStyle(this.element, { width: formatUnit(newProp.width) });\n break;\n case 'height':\n setStyle(this.element, { height: formatUnit(newProp.height) });\n this.setContentHeight(false);\n break;\n case 'cssClass':\n var headerEle = this.element.querySelector('.' + CLS_HEADER);\n if (oldProp.cssClass !== '' && !isNullOrUndefined(oldProp.cssClass)) {\n this.setCssClass(this.element, oldProp.cssClass, false);\n this.setCssClass(this.element, newProp.cssClass, true);\n if (!isNullOrUndefined(headerEle)) {\n this.setCssClass(headerEle, oldProp.cssClass, false);\n this.setCssClass(headerEle, newProp.cssClass, true);\n }\n }\n else {\n this.setCssClass(this.element, newProp.cssClass, true);\n if (!isNullOrUndefined(headerEle)) {\n this.setCssClass(headerEle, newProp.cssClass, true);\n }\n }\n break;\n case 'items':\n this.evalOnPropertyChangeItems(newProp, oldProp);\n break;\n case 'showCloseButton':\n this.setCloseButton(newProp.showCloseButton);\n break;\n case 'reorderActiveTab':\n this.refreshActiveTabBorder();\n break;\n case 'selectedItem':\n this.selectedItem = oldProp.selectedItem;\n this.select(newProp.selectedItem);\n break;\n case 'headerPlacement':\n this.changeOrientation(newProp.headerPlacement);\n break;\n case 'enableRtl':\n this.setRTL(newProp.enableRtl);\n break;\n case 'overflowMode':\n this.tbObj.overflowMode = newProp.overflowMode;\n this.tbObj.dataBind();\n this.refreshActiveTabBorder();\n break;\n case 'heightAdjustMode':\n this.setContentHeight(false);\n this.select(this.selectedItem);\n break;\n case 'scrollStep':\n if (this.tbObj) {\n this.tbObj.scrollStep = this.scrollStep;\n }\n break;\n case 'allowDragAndDrop':\n this.bindDraggable();\n break;\n case 'dragArea':\n if (this.allowDragAndDrop) {\n this.draggableItems.forEach(function (item) {\n item.dragArea = _this.dragArea;\n });\n this.refresh();\n }\n break;\n }\n }\n };\n /**\n * To refresh the active tab contents.\n *\n * @returns {void}\n */\n Tab.prototype.refreshActiveTab = function () {\n if (this.isReact && this.isTemplate) {\n this.clearTemplate();\n }\n if (!this.isTemplate) {\n if (this.element.querySelector('.' + CLS_TB_ITEM + '.' + CLS_ACTIVE)) {\n detach(this.element.querySelector('.' + CLS_TB_ITEM + '.' + CLS_ACTIVE).children[0]);\n detach(this.element.querySelector('.' + CLS_CONTENT).querySelector('.' + CLS_ACTIVE).children[0]);\n var item = this.items[this.selectedItem];\n var pos = (isNOU(item.header) || isNOU(item.header.iconPosition)) ? '' : item.header.iconPosition;\n var css = (isNOU(item.header) || isNOU(item.header.iconCss)) ? '' : item.header.iconCss;\n var text = item.headerTemplate || item.header.text;\n var txtWrap = this.createElement('div', { className: CLS_TEXT, attrs: { 'role': 'presentation' } });\n if (!isNOU(text.tagName)) {\n txtWrap.appendChild(text);\n }\n else {\n this.headerTextCompile(txtWrap, text, this.selectedItem);\n }\n var tEle = void 0;\n var icon = this.createElement('span', {\n className: CLS_ICONS + ' ' + CLS_TAB_ICON + ' ' + CLS_ICON + '-' + pos + ' ' + css\n });\n var tConts = this.createElement('div', { className: CLS_TEXT_WRAP });\n tConts.appendChild(txtWrap);\n if ((text !== '' && text !== undefined) && css !== '') {\n if ((pos === 'left' || pos === 'top')) {\n tConts.insertBefore(icon, tConts.firstElementChild);\n }\n else {\n tConts.appendChild(icon);\n }\n tEle = txtWrap;\n this.isIconAlone = false;\n }\n else {\n tEle = ((css === '') ? txtWrap : icon);\n if (tEle === icon) {\n detach(txtWrap);\n tConts.appendChild(icon);\n this.isIconAlone = true;\n }\n }\n var tabIndex = isNOU(item.tabIndex) ? '-1' : item.tabIndex.toString();\n var wrapAtt = (item.disabled) ? {} : { tabIndex: tabIndex, 'data-tabindex': tabIndex, role: 'tab', 'aria-selected': 'true', 'aria-disabled': 'false' };\n tConts.appendChild(this.btnCls.cloneNode(true));\n var wraper = this.createElement('div', { className: CLS_WRAP, attrs: wrapAtt });\n wraper.appendChild(tConts);\n if (pos === 'top' || pos === 'bottom') {\n this.element.classList.add('e-vertical-icon');\n }\n this.element.querySelector('.' + CLS_TB_ITEM + '.' + CLS_ACTIVE).appendChild(wraper);\n var crElem = this.createElement('div');\n var cnt = item.content;\n var eleStr = void 0;\n if (typeof cnt === 'string' || isNOU(cnt.innerHTML)) {\n if (typeof cnt === 'string' && this.enableHtmlSanitizer) {\n cnt = SanitizeHtmlHelper.sanitize(cnt);\n }\n if (cnt[0] === '.' || cnt[0] === '#') {\n if (document.querySelectorAll(cnt).length) {\n var eleVal = document.querySelector(cnt);\n eleStr = eleVal.outerHTML.trim();\n crElem.appendChild(eleVal);\n eleVal.style.display = '';\n }\n else {\n this.compileElement(crElem, cnt, 'content', this.selectedItem);\n }\n }\n else {\n this.compileElement(crElem, cnt, 'content', this.selectedItem);\n }\n }\n else {\n crElem.appendChild(cnt);\n }\n if (!isNOU(eleStr)) {\n if (this.templateEle.indexOf(cnt.toString()) === -1) {\n this.templateEle.push(cnt.toString());\n }\n }\n this.element.querySelector('.' + CLS_ITEM + '.' + CLS_ACTIVE).appendChild(crElem);\n }\n }\n else {\n var tabItems = this.element.querySelector('.' + CLS_TB_ITEMS);\n var element = this.element.querySelector('.' + CLS_TB_ITEM + '.' + CLS_ACTIVE);\n var index = this.getIndexFromEle(element.id);\n var header = element.innerText;\n var detachContent = this.element.querySelector('.' + CLS_CONTENT).querySelector('.' + CLS_ACTIVE).children[0];\n var mainContents = detachContent.innerHTML;\n detach(element);\n detach(detachContent);\n var attr = {\n className: CLS_TB_ITEM + ' ' + CLS_TEMPLATE + ' ' + CLS_ACTIVE, id: CLS_ITEM + this.tabId + '_' + index\n };\n var txtString = this.createElement('span', {\n className: CLS_TEXT, innerHTML: header, attrs: { 'role': 'presentation' }\n }).outerHTML;\n var conte = this.createElement('div', {\n className: CLS_TEXT_WRAP, innerHTML: txtString + this.btnCls.outerHTML\n }).outerHTML;\n var tabIndex = element.firstElementChild.getAttribute('data-tabindex');\n var wrap = this.createElement('div', {\n className: CLS_WRAP, innerHTML: conte,\n attrs: { tabIndex: tabIndex, 'data-tabindex': tabIndex, role: 'tab', 'aria-controls': CLS_CONTENT + this.tabId + '_' + index, 'aria-selected': 'true', 'aria-disabled': 'false' }\n });\n tabItems.insertBefore(this.createElement('div', attr), tabItems.children[index + 1]);\n this.element.querySelector('.' + CLS_TB_ITEM + '.' + CLS_ACTIVE).appendChild(wrap);\n var crElem = this.createElement('div', { innerHTML: mainContents });\n this.element.querySelector('.' + CLS_CONTENT).querySelector('.' + CLS_ACTIVE).appendChild(crElem);\n }\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n /**\n * To refresh the active tab indicator.\n *\n * @returns {void}\n */\n Tab.prototype.refreshActiveTabBorder = function () {\n var activeEle = select('.' + CLS_TB_ITEM + '.' + CLS_TB_POPUP + '.' + CLS_ACTIVE, this.element);\n if (!isNOU(activeEle) && this.reorderActiveTab) {\n this.select(this.getEleIndex(activeEle));\n }\n this.refreshActiveBorder();\n };\n __decorate([\n Collection([], TabItem)\n ], Tab.prototype, \"items\", void 0);\n __decorate([\n Property('100%')\n ], Tab.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], Tab.prototype, \"height\", void 0);\n __decorate([\n Property('')\n ], Tab.prototype, \"cssClass\", void 0);\n __decorate([\n Property(0)\n ], Tab.prototype, \"selectedItem\", void 0);\n __decorate([\n Property('Top')\n ], Tab.prototype, \"headerPlacement\", void 0);\n __decorate([\n Property('Content')\n ], Tab.prototype, \"heightAdjustMode\", void 0);\n __decorate([\n Property('Scrollable')\n ], Tab.prototype, \"overflowMode\", void 0);\n __decorate([\n Property('Dynamic')\n ], Tab.prototype, \"loadOn\", void 0);\n __decorate([\n Property(false)\n ], Tab.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(true)\n ], Tab.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property(false)\n ], Tab.prototype, \"showCloseButton\", void 0);\n __decorate([\n Property(true)\n ], Tab.prototype, \"reorderActiveTab\", void 0);\n __decorate([\n Property()\n ], Tab.prototype, \"scrollStep\", void 0);\n __decorate([\n Property()\n ], Tab.prototype, \"dragArea\", void 0);\n __decorate([\n Property(false)\n ], Tab.prototype, \"allowDragAndDrop\", void 0);\n __decorate([\n Property(true)\n ], Tab.prototype, \"clearTemplates\", void 0);\n __decorate([\n Complex({}, TabAnimationSettings)\n ], Tab.prototype, \"animation\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"adding\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"added\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"selecting\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"selected\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"removing\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"removed\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"onDragStart\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"dragging\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"dragged\", void 0);\n __decorate([\n Event()\n ], Tab.prototype, \"destroyed\", void 0);\n Tab = __decorate([\n NotifyPropertyChanges\n ], Tab);\n return Tab;\n}(Component));\nexport { Tab };\n","/* eslint-disable valid-jsdoc, jsdoc/require-jsdoc, jsdoc/require-returns, jsdoc/require-param */\nimport { createElement, attributes, addClass, removeClass, detach, classList } from '@syncfusion/ej2-base';\nimport { closest, formatUnit, isNullOrUndefined, remove } from '@syncfusion/ej2-base';\nvar CLASSNAMES = {\n RTL: 'e-rtl',\n DISABLE: 'e-disabled',\n INPUT: 'e-input',\n TEXTAREA: 'e-multi-line-input',\n INPUTGROUP: 'e-input-group',\n FLOATINPUT: 'e-float-input',\n FLOATLINE: 'e-float-line',\n FLOATTEXT: 'e-float-text',\n FLOATTEXTCONTENT: 'e-float-text-content',\n CLEARICON: 'e-clear-icon',\n CLEARICONHIDE: 'e-clear-icon-hide',\n LABELTOP: 'e-label-top',\n LABELBOTTOM: 'e-label-bottom',\n NOFLOATLABEL: 'e-no-float-label',\n INPUTCUSTOMTAG: 'e-input-custom-tag',\n FLOATCUSTOMTAG: 'e-float-custom-tag'\n};\n/**\n * Defines the constant attributes for the input element container.\n */\nexport var containerAttributes = ['title', 'style', 'class'];\n/**\n * Defines the constant focus class for the input element.\n */\nexport var TEXTBOX_FOCUS = 'e-input-focus';\n/**\n * Base for Input creation through util methods.\n */\n// eslint-disable-next-line @typescript-eslint/no-namespace\nexport var Input;\n(function (Input) {\n var privateInputObj = {\n container: null,\n buttons: [],\n clearButton: null\n };\n var floatType;\n var isBindClearAction = true;\n /**\n * Create a wrapper to input element with multiple span elements and set the basic properties to input based components.\n * ```\n * E.g : Input.createInput({ element: element, floatLabelType : \"Auto\", properties: { placeholder: 'Search' } });\n * ```\n *\n */\n function createInput(args, internalCreateElement) {\n args.element.__eventHandlers = {};\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var inputObject = { container: null, buttons: [], clearButton: null };\n floatType = args.floatLabelType;\n isBindClearAction = args.bindClearAction;\n if (isNullOrUndefined(args.floatLabelType) || args.floatLabelType === 'Never') {\n inputObject.container = createInputContainer(args, CLASSNAMES.INPUTGROUP, CLASSNAMES.INPUTCUSTOMTAG, 'span', makeElement);\n args.element.parentNode.insertBefore(inputObject.container, args.element);\n addClass([args.element], CLASSNAMES.INPUT);\n inputObject.container.appendChild(args.element);\n }\n else {\n createFloatingInput(args, inputObject, makeElement);\n }\n bindInitialEvent(args);\n if (!isNullOrUndefined(args.properties) && !isNullOrUndefined(args.properties.showClearButton) &&\n args.properties.showClearButton) {\n setClearButton(args.properties.showClearButton, args.element, inputObject, true, makeElement);\n inputObject.clearButton.setAttribute('role', 'button');\n if (inputObject.container.classList.contains(CLASSNAMES.FLOATINPUT)) {\n addClass([inputObject.container], CLASSNAMES.INPUTGROUP);\n }\n }\n if (!isNullOrUndefined(args.buttons)) {\n for (var i = 0; i < args.buttons.length; i++) {\n inputObject.buttons.push(appendSpan(args.buttons[i], inputObject.container, makeElement));\n }\n }\n if (!isNullOrUndefined(args.element) && args.element.tagName === 'TEXTAREA') {\n addClass([inputObject.container], CLASSNAMES.TEXTAREA);\n }\n validateInputType(inputObject.container, args.element);\n inputObject = setPropertyValue(args, inputObject);\n createSpanElement(inputObject.container, makeElement);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n privateInputObj = inputObject;\n return inputObject;\n }\n Input.createInput = createInput;\n function bindFocusEventHandler(args) {\n var parent = getParentNode(args.element);\n if (parent.classList.contains('e-input-group') || parent.classList.contains('e-outline') || parent.classList.contains('e-filled')) {\n parent.classList.add('e-input-focus');\n }\n if (args.floatLabelType !== 'Never') {\n setTimeout(function () {\n Input.calculateWidth(args.element, parent);\n }, 80);\n }\n }\n function bindBlurEventHandler(args) {\n var parent = getParentNode(args.element);\n if (parent.classList.contains('e-input-group') || parent.classList.contains('e-outline') || parent.classList.contains('e-filled')) {\n parent.classList.remove('e-input-focus');\n }\n if (args.floatLabelType !== 'Never') {\n setTimeout(function () {\n Input.calculateWidth(args.element, parent);\n }, 80);\n }\n }\n function bindInputEventHandler(args) {\n checkInputValue(args.floatLabelType, args.element);\n }\n function bindInitialEvent(args) {\n checkInputValue(args.floatLabelType, args.element);\n var focusHandler = function () { return bindFocusEventHandler(args); };\n var blurHandler = function () { return bindBlurEventHandler(args); };\n var inputHandler = function () { return bindInputEventHandler(args); };\n args.element.addEventListener('focus', focusHandler);\n args.element.addEventListener('blur', blurHandler);\n args.element.addEventListener('input', inputHandler);\n args.element.__eventHandlers[\"inputFocusHandler\"] = { focusHandler: focusHandler };\n args.element.__eventHandlers[\"inputBlurHandler\"] = { blurHandler: blurHandler };\n args.element.__eventHandlers[\"inputHandler\"] = { inputHandler: inputHandler };\n }\n Input.bindInitialEvent = bindInitialEvent;\n function unbindInitialEvent(args) {\n if (!isNullOrUndefined(args.element)) {\n if (!isNullOrUndefined(args.element.__eventHandlers)) {\n if (!isNullOrUndefined(args.element.__eventHandlers[\"inputFocusHandler\"])\n && !isNullOrUndefined(args.element.__eventHandlers[\"inputBlurHandler\"])\n && !isNullOrUndefined(args.element.__eventHandlers[\"inputHandler\"])) {\n var focusHandler_1 = args.element.__eventHandlers[\"inputFocusHandler\"].focusHandler;\n var blurHandler_1 = args.element.__eventHandlers[\"inputBlurHandler\"].blurHandler;\n var inputHandler_1 = args.element.__eventHandlers[\"inputHandler\"].inputHandler;\n args.element.removeEventListener('focus', focusHandler_1);\n args.element.removeEventListener('blur', blurHandler_1);\n args.element.removeEventListener('input', inputHandler_1);\n // Clean up stored bound functions\n delete args.element.__eventHandlers[\"inputFocusHandler\"];\n delete args.element.__eventHandlers[\"inputBlurHandler\"];\n delete args.element.__eventHandlers[\"inputHandler\"];\n }\n }\n }\n }\n function checkInputValue(floatLabelType, inputElement) {\n var inputValue = inputElement.value;\n var inputParent = inputElement.parentElement;\n var grandParent = inputParent.parentElement;\n if (inputValue !== '' && !isNullOrUndefined(inputValue)) {\n if (inputParent && inputParent.classList.contains('e-input-group')) {\n inputParent.classList.add('e-valid-input');\n }\n else if (grandParent && grandParent.classList.contains('e-input-group')) {\n grandParent.classList.add('e-valid-input');\n }\n }\n else if (floatLabelType !== 'Always') {\n if (inputParent && inputParent.classList.contains('e-input-group')) {\n inputParent.classList.remove('e-valid-input');\n }\n else if (grandParent && grandParent.classList.contains('e-input-group')) {\n grandParent.classList.remove('e-valid-input');\n }\n }\n }\n function _focusFn() {\n var label = getParentNode(this).getElementsByClassName('e-float-text')[0];\n if (!isNullOrUndefined(label)) {\n addClass([label], CLASSNAMES.LABELTOP);\n if (label.classList.contains(CLASSNAMES.LABELBOTTOM)) {\n removeClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n }\n function _blurFn() {\n var parent = getParentNode(this);\n if ((parent.getElementsByTagName('textarea')[0]) ? parent.getElementsByTagName('textarea')[0].value === '' :\n parent.getElementsByTagName('input')[0].value === '') {\n var label = parent.getElementsByClassName('e-float-text')[0];\n if (!isNullOrUndefined(label)) {\n if (label.classList.contains(CLASSNAMES.LABELTOP)) {\n removeClass([label], CLASSNAMES.LABELTOP);\n }\n addClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n }\n function wireFloatingEvents(element) {\n element.addEventListener('focus', _focusFn);\n element.addEventListener('blur', _blurFn);\n }\n Input.wireFloatingEvents = wireFloatingEvents;\n function unwireFloatingEvents(element) {\n if (!isNullOrUndefined(element)) {\n element.removeEventListener('focus', _focusFn);\n element.removeEventListener('blur', _blurFn);\n }\n }\n function inputEventHandler(args) {\n validateLabel(args.element, args.floatLabelType);\n }\n function blurEventHandler(args) {\n validateLabel(args.element, args.floatLabelType);\n }\n function createFloatingInput(args, inputObject, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n if (args.floatLabelType === 'Auto') {\n wireFloatingEvents(args.element);\n }\n if (isNullOrUndefined(inputObject.container)) {\n inputObject.container = createInputContainer(args, CLASSNAMES.FLOATINPUT, CLASSNAMES.FLOATCUSTOMTAG, 'div', makeElement);\n inputObject.container.classList.add(CLASSNAMES.INPUTGROUP);\n if (args.element.parentNode) {\n args.element.parentNode.insertBefore(inputObject.container, args.element);\n }\n }\n else {\n if (!isNullOrUndefined(args.customTag)) {\n inputObject.container.classList.add(CLASSNAMES.FLOATCUSTOMTAG);\n }\n inputObject.container.classList.add(CLASSNAMES.FLOATINPUT);\n }\n var floatLinelement = makeElement('span', { className: CLASSNAMES.FLOATLINE });\n var floatLabelElement = makeElement('label', { className: CLASSNAMES.FLOATTEXT });\n if (!isNullOrUndefined(args.element.id) && args.element.id !== '') {\n floatLabelElement.id = 'label_' + args.element.id.replace(/ /g, '_');\n attributes(args.element, { 'aria-labelledby': floatLabelElement.id });\n }\n if (!isNullOrUndefined(args.element.placeholder) && args.element.placeholder !== '') {\n floatLabelElement.innerText = encodePlaceHolder(args.element.placeholder);\n args.element.removeAttribute('placeholder');\n }\n if (!isNullOrUndefined(args.properties) && !isNullOrUndefined(args.properties.placeholder) &&\n args.properties.placeholder !== '') {\n floatLabelElement.innerText = encodePlaceHolder(args.properties.placeholder);\n }\n if (!floatLabelElement.innerText) {\n inputObject.container.classList.add(CLASSNAMES.NOFLOATLABEL);\n }\n if (inputObject.container.classList.contains('e-float-icon-left')) {\n var inputWrap = inputObject.container.querySelector('.e-input-in-wrap');\n inputWrap.appendChild(args.element);\n inputWrap.appendChild(floatLinelement);\n inputWrap.appendChild(floatLabelElement);\n }\n else {\n inputObject.container.appendChild(args.element);\n inputObject.container.appendChild(floatLinelement);\n inputObject.container.appendChild(floatLabelElement);\n }\n updateLabelState(args.element.value, floatLabelElement);\n if (args.floatLabelType === 'Always') {\n if (floatLabelElement.classList.contains(CLASSNAMES.LABELBOTTOM)) {\n removeClass([floatLabelElement], CLASSNAMES.LABELBOTTOM);\n }\n addClass([floatLabelElement], CLASSNAMES.LABELTOP);\n }\n if (args.floatLabelType === 'Auto') {\n var inputFloatHandler = function () { return inputEventHandler(args); };\n var blurFloatHandler = function () { return blurEventHandler(args); };\n // Add event listeners using the defined functions\n args.element.addEventListener('input', inputFloatHandler);\n args.element.addEventListener('blur', blurFloatHandler);\n // Store the event handler functions to remove them later\n args.element.__eventHandlers[\"floatInputHandler\"] = { inputFloatHandler: inputFloatHandler };\n args.element.__eventHandlers[\"floatBlurHandler\"] = { blurFloatHandler: blurFloatHandler };\n }\n else {\n unWireFloatLabelEvents(args);\n }\n if (!isNullOrUndefined(args.element.getAttribute('id'))) {\n floatLabelElement.setAttribute('for', args.element.getAttribute('id'));\n }\n }\n function unWireFloatLabelEvents(args) {\n if (!isNullOrUndefined(args.element) && !isNullOrUndefined(args.element.__eventHandlers)\n && !isNullOrUndefined(args.element.__eventHandlers[\"floatInputHandler\"])\n && !isNullOrUndefined(args.element.__eventHandlers[\"floatBlurHandler\"])) {\n var inputFloatHandler = args.element.__eventHandlers[\"floatInputHandler\"].inputFloatHandler;\n var blurFloatHandler = args.element.__eventHandlers[\"floatBlurHandler\"].blurFloatHandler;\n // Remove the event listeners using the defined functions\n args.element.removeEventListener('input', inputFloatHandler);\n args.element.removeEventListener('blur', blurFloatHandler);\n // Clean up stored event handler functions\n delete args.element.__eventHandlers[\"floatInputHandler\"];\n delete args.element.__eventHandlers[\"floatBlurHandler\"];\n }\n }\n function checkFloatLabelType(type, container) {\n if (type === 'Always' && container.classList.contains('e-outline')) {\n container.classList.add('e-valid-input');\n }\n }\n function setPropertyValue(args, inputObject) {\n if (!isNullOrUndefined(args.properties)) {\n for (var _i = 0, _a = Object.keys(args.properties); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'cssClass':\n setCssClass(args.properties.cssClass, [inputObject.container]);\n checkFloatLabelType(args.floatLabelType, inputObject.container);\n break;\n case 'enabled':\n setEnabled(args.properties.enabled, args.element, args.floatLabelType, inputObject.container);\n break;\n case 'enableRtl':\n setEnableRtl(args.properties.enableRtl, [inputObject.container]);\n break;\n case 'placeholder':\n setPlaceholder(args.properties.placeholder, args.element);\n break;\n case 'readonly':\n setReadonly(args.properties.readonly, args.element);\n break;\n }\n }\n }\n return inputObject;\n }\n function updateIconState(value, button, readonly) {\n if (!isNullOrUndefined(button)) {\n if (value && !readonly) {\n removeClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n else {\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n }\n }\n function updateLabelState(value, label, element) {\n if (element === void 0) { element = null; }\n if (value) {\n addClass([label], CLASSNAMES.LABELTOP);\n if (label.classList.contains(CLASSNAMES.LABELBOTTOM)) {\n removeClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n else {\n var isNotFocused = element != null ? element !== document.activeElement : true;\n if (isNotFocused) {\n if (label.classList.contains(CLASSNAMES.LABELTOP)) {\n removeClass([label], CLASSNAMES.LABELTOP);\n }\n addClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n }\n function getParentNode(element) {\n var parentNode = isNullOrUndefined(element.parentNode) ? element\n : element.parentNode;\n if (parentNode && parentNode.classList.contains('e-input-in-wrap')) {\n parentNode = parentNode.parentNode;\n }\n return parentNode;\n }\n /**\n * To create clear button.\n */\n function createClearButton(element, inputObject, initial, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var button = makeElement('span', { className: CLASSNAMES.CLEARICON });\n var container = inputObject.container;\n if (!isNullOrUndefined(initial)) {\n container.appendChild(button);\n }\n else {\n var baseElement = inputObject.container.classList.contains(CLASSNAMES.FLOATINPUT) ?\n inputObject.container.querySelector('.' + CLASSNAMES.FLOATTEXT) : element;\n baseElement.insertAdjacentElement('afterend', button);\n }\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n wireClearBtnEvents(element, button, container);\n button.setAttribute('aria-label', 'close');\n return button;\n }\n function clickHandler(event, element, button) {\n if (!(element.classList.contains(CLASSNAMES.DISABLE) || element.readOnly)) {\n event.preventDefault();\n if (element !== document.activeElement) {\n element.focus();\n }\n element.value = '';\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n }\n function inputHandler(element, button) {\n updateIconState(element.value, button);\n }\n function focusHandler(element, button) {\n updateIconState(element.value, button, element.readOnly);\n }\n function blurHandler(element, button) {\n setTimeout(function () {\n if (!isNullOrUndefined(button)) {\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n button = !isNullOrUndefined(element) && element.classList.contains('e-combobox') ? null : button;\n }\n }, 200);\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n function wireClearBtnEvents(element, button, container) {\n if (isBindClearAction === undefined || isBindClearAction) {\n var clickHandlerEvent = function (e) { return clickHandler(e, element, button); };\n button.addEventListener('click', clickHandlerEvent);\n element.__eventHandlers[\"clearClickHandler\"] = { clickHandlerEvent: clickHandlerEvent };\n }\n var inputHandlerEvent = function () { return inputHandler(element, button); };\n var focusHandlerEvent = function () { return focusHandler(element, button); };\n var blurHandlerEvent = function () { return blurHandler(element, button); };\n element.addEventListener('input', inputHandlerEvent);\n element.addEventListener('focus', focusHandlerEvent);\n element.addEventListener('blur', blurHandlerEvent);\n // Store the bound functions to remove them later\n element.__eventHandlers[\"clearInputHandler\"] = { inputHandlerEvent: inputHandlerEvent };\n element.__eventHandlers[\"clearFocusHandler\"] = { focusHandlerEvent: focusHandlerEvent };\n element.__eventHandlers[\"clearBlurHandler\"] = { blurHandlerEvent: blurHandlerEvent };\n }\n Input.wireClearBtnEvents = wireClearBtnEvents;\n function unWireClearBtnEvents(element, button) {\n if (!isNullOrUndefined(element) && !isNullOrUndefined(element.__eventHandlers)) {\n if (!isNullOrUndefined(element.__eventHandlers[\"clearClickHandler\"])) {\n var clickHandlerEvent = element.__eventHandlers[\"clearClickHandler\"].clickHandlerEvent;\n if (isBindClearAction === undefined || isBindClearAction) {\n if (!isNullOrUndefined(button)) {\n button.removeEventListener('click', clickHandlerEvent);\n }\n }\n delete element.__eventHandlers[\"clearClickHandler\"];\n }\n if (!isNullOrUndefined(element.__eventHandlers[\"clearInputHandler\"])\n && !isNullOrUndefined(element.__eventHandlers[\"clearFocusHandler\"])\n && !isNullOrUndefined(element.__eventHandlers[\"clearBlurHandler\"])) {\n var inputHandlerEvent = element.__eventHandlers[\"clearInputHandler\"].inputHandlerEvent;\n var focusHandlerEvent = element.__eventHandlers[\"clearFocusHandler\"].focusHandlerEvent;\n var blurHandlerEvent = element.__eventHandlers[\"clearBlurHandler\"].blurHandlerEvent;\n element.removeEventListener('input', inputHandlerEvent);\n element.removeEventListener('focus', focusHandlerEvent);\n element.removeEventListener('blur', blurHandlerEvent);\n // Clean up stored Event functions\n delete element.__eventHandlers[\"clearInputHandler\"];\n delete element.__eventHandlers[\"clearFocusHandler\"];\n delete element.__eventHandlers[\"clearBlurHandler\"];\n }\n }\n }\n function destroy(args, button) {\n if (button === void 0) { button = null; }\n unbindInitialEvent(args);\n if (args.floatLabelType === 'Auto') {\n unWireFloatLabelEvents(args);\n }\n if (args.properties.showClearButton) {\n unWireClearBtnEvents(args.element, button);\n }\n if (!isNullOrUndefined(args.buttons)) {\n _internalRipple(false, null, args.buttons);\n }\n unwireFloatingEvents(args.element);\n if (!isNullOrUndefined(args.element)) {\n delete args.element.__eventHandlers;\n }\n privateInputObj = null;\n }\n Input.destroy = destroy;\n function validateLabel(element, floatLabelType) {\n var parent = getParentNode(element);\n if (parent.classList.contains(CLASSNAMES.FLOATINPUT) && floatLabelType === 'Auto') {\n var label = getParentNode(element).getElementsByClassName('e-float-text')[0];\n updateLabelState(element.value, label, element);\n }\n }\n /**\n * To create input box contianer.\n */\n function createInputContainer(args, className, tagClass, tag, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var container;\n if (!isNullOrUndefined(args.customTag)) {\n container = makeElement(args.customTag, { className: className });\n container.classList.add(tagClass);\n }\n else {\n container = makeElement(tag, { className: className });\n }\n container.classList.add('e-control-wrapper');\n return container;\n }\n function encodePlaceHolder(placeholder) {\n var result = '';\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n var spanEle = document.createElement('span');\n spanEle.innerHTML = '';\n var hiddenInput = (spanEle.children[0]);\n result = hiddenInput.placeholder;\n }\n return result;\n }\n /**\n * Sets the value to the input element.\n * ```\n * E.g : Input.setValue('content', element, \"Auto\", true );\n * ```\n *\n * @param {string} value - Specify the value of the input element.\n * @param {HTMLInputElement | HTMLTextAreaElement} element - The element on which the specified value is updated.\n * @param {string} floatLabelType - Specify the float label type of the input element.\n * @param {boolean} clearButton - Boolean value to specify whether the clear icon is enabled / disabled on the input.\n */\n function setValue(value, element, floatLabelType, clearButton) {\n element.value = value;\n if (floatLabelType !== 'Never') {\n calculateWidth(element, element.parentElement);\n }\n if ((!isNullOrUndefined(floatLabelType)) && floatLabelType === 'Auto') {\n validateLabel(element, floatLabelType);\n }\n if (!isNullOrUndefined(clearButton) && clearButton) {\n var parentElement = getParentNode(element);\n if (!isNullOrUndefined(parentElement)) {\n var button = parentElement.getElementsByClassName(CLASSNAMES.CLEARICON)[0];\n if (!isNullOrUndefined(button)) {\n if (element.value && !isNullOrUndefined(parentElement) && parentElement.classList.contains('e-input-focus')) {\n removeClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n else {\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n }\n }\n }\n checkInputValue(floatLabelType, element);\n }\n Input.setValue = setValue;\n /**\n * Sets the single or multiple cssClass to wrapper of input element.\n * ```\n * E.g : Input.setCssClass('e-custom-class', [element]);\n * ```\n *\n * @param {string} cssClass - Css class names which are needed to add.\n * @param {Element[] | NodeList} elements - The elements which are needed to add / remove classes.\n * @param {string} oldClass\n * - Css class names which are needed to remove. If old classes are need to remove, can give this optional parameter.\n */\n function setCssClass(cssClass, elements, oldClass) {\n if (!isNullOrUndefined(oldClass) && oldClass !== '') {\n removeClass(elements, oldClass.split(' '));\n }\n if (!isNullOrUndefined(cssClass) && cssClass !== '') {\n addClass(elements, cssClass.split(' '));\n }\n }\n Input.setCssClass = setCssClass;\n /**\n * Set the width to the placeholder when it overflows on the button such as spinbutton, clearbutton, icon etc\n * ```\n * E.g : Input.calculateWidth(element, container);\n * ```\n *\n * @param {any} element - Input element which is need to add.\n * @param {HTMLElement} container - The parent element which is need to get the label span to calculate width\n */\n function calculateWidth(element, container, moduleName) {\n if (moduleName !== 'multiselect' && !_isElementVisible(element)) {\n return;\n }\n var elementWidth = moduleName === 'multiselect' ? element : element.clientWidth - parseInt(getComputedStyle(element, null).getPropertyValue('padding-left'), 10);\n if (!isNullOrUndefined(container.getElementsByClassName('e-float-text-content')[0])) {\n if (container.getElementsByClassName('e-float-text-content')[0].classList.contains('e-float-text-overflow')) {\n container.getElementsByClassName('e-float-text-content')[0].classList.remove('e-float-text-overflow');\n }\n if (elementWidth < container.getElementsByClassName('e-float-text-content')[0].clientWidth || elementWidth === container.getElementsByClassName('e-float-text-content')[0].clientWidth) {\n container.getElementsByClassName('e-float-text-content')[0].classList.add('e-float-text-overflow');\n }\n }\n }\n Input.calculateWidth = calculateWidth;\n /**\n * Set the width to the wrapper of input element.\n * ```\n * E.g : Input.setWidth('200px', container);\n * ```\n *\n * @param {number | string} width - Width value which is need to add.\n * @param {HTMLElement} container - The element on which the width is need to add.\n */\n function setWidth(width, container) {\n if (typeof width === 'number') {\n container.style.width = formatUnit(width);\n }\n else if (typeof width === 'string') {\n container.style.width = (width.match(/px|%|em/)) ? (width) : (formatUnit(width));\n }\n calculateWidth(container.firstChild, container);\n }\n Input.setWidth = setWidth;\n /**\n * Set the placeholder attribute to the input element.\n * ```\n * E.g : Input.setPlaceholder('Search here', element);\n * ```\n *\n * @param {string} placeholder - Placeholder value which is need to add.\n * @param {HTMLInputElement | HTMLTextAreaElement} element - The element on which the placeholder is need to add.\n */\n function setPlaceholder(placeholder, element) {\n placeholder = encodePlaceHolder(placeholder);\n var parentElement = getParentNode(element);\n if (parentElement.classList.contains(CLASSNAMES.FLOATINPUT)) {\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n parentElement.getElementsByClassName('e-float-text-content')[0] ? parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].children[0].textContent = placeholder : parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = placeholder;\n parentElement.classList.remove(CLASSNAMES.NOFLOATLABEL);\n element.removeAttribute('placeholder');\n }\n else {\n parentElement.classList.add(CLASSNAMES.NOFLOATLABEL);\n parentElement.getElementsByClassName('e-float-text-content')[0] ? parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].children[0].textContent = '' : parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = '';\n }\n }\n else {\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n attributes(element, { 'placeholder': placeholder });\n }\n else {\n element.removeAttribute('placeholder');\n }\n }\n }\n Input.setPlaceholder = setPlaceholder;\n /**\n * Set the read only attribute to the input element\n * ```\n * E.g : Input.setReadonly(true, element);\n * ```\n *\n * @param {boolean} isReadonly\n * - Boolean value to specify whether to set read only. Setting \"True\" value enables read only.\n * @param {HTMLInputElement | HTMLTextAreaElement} element\n * - The element which is need to enable read only.\n */\n function setReadonly(isReadonly, element, floatLabelType) {\n if (isReadonly) {\n attributes(element, { readonly: '' });\n }\n else {\n element.removeAttribute('readonly');\n }\n if (!isNullOrUndefined(floatLabelType)) {\n validateLabel(element, floatLabelType);\n }\n }\n Input.setReadonly = setReadonly;\n /**\n * Displays the element direction from right to left when its enabled.\n * ```\n * E.g : Input.setEnableRtl(true, [inputObj.container]);\n * ```\n *\n * @param {boolean} isRtl\n * - Boolean value to specify whether to set RTL. Setting \"True\" value enables the RTL mode.\n * @param {Element[] | NodeList} elements\n * - The elements that are needed to enable/disable RTL.\n */\n function setEnableRtl(isRtl, elements) {\n if (isRtl) {\n addClass(elements, CLASSNAMES.RTL);\n }\n else {\n removeClass(elements, CLASSNAMES.RTL);\n }\n }\n Input.setEnableRtl = setEnableRtl;\n /**\n * Enables or disables the given input element.\n * ```\n * E.g : Input.setEnabled(false, element);\n * ```\n *\n * @param {boolean} isEnable\n * - Boolean value to specify whether to enable or disable.\n * @param {HTMLInputElement | HTMLTextAreaElement} element\n * - Element to be enabled or disabled.\n */\n function setEnabled(isEnable, element, floatLabelType, inputContainer) {\n var disabledAttrs = { 'disabled': '', 'aria-disabled': 'true' };\n var considerWrapper = isNullOrUndefined(inputContainer) ? false : true;\n if (isEnable) {\n element.classList.remove(CLASSNAMES.DISABLE);\n removeAttributes(disabledAttrs, element);\n if (considerWrapper) {\n removeClass([inputContainer], CLASSNAMES.DISABLE);\n }\n }\n else {\n element.classList.add(CLASSNAMES.DISABLE);\n addAttributes(disabledAttrs, element);\n if (considerWrapper) {\n addClass([inputContainer], CLASSNAMES.DISABLE);\n }\n }\n if (!isNullOrUndefined(floatLabelType)) {\n validateLabel(element, floatLabelType);\n }\n }\n Input.setEnabled = setEnabled;\n function setClearButton(isClear, element, inputObject, initial, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n if (isClear) {\n inputObject.clearButton = createClearButton(element, inputObject, initial, makeElement);\n }\n else {\n remove(inputObject.clearButton);\n inputObject.clearButton = null;\n }\n }\n Input.setClearButton = setClearButton;\n /**\n * Removing the multiple attributes from the given element such as \"disabled\",\"id\" , etc.\n * ```\n * E.g : Input.removeAttributes({ 'disabled': 'disabled', 'aria-disabled': 'true' }, element);\n * ```\n *\n * @param {string} attrs\n * - Array of attributes which are need to removed from the element.\n * @param {HTMLInputElement | HTMLElement} element\n * - Element on which the attributes are needed to be removed.\n */\n function removeAttributes(attrs, element) {\n for (var _i = 0, _a = Object.keys(attrs); _i < _a.length; _i++) {\n var key = _a[_i];\n var parentElement = getParentNode(element);\n if (key === 'disabled') {\n element.classList.remove(CLASSNAMES.DISABLE);\n }\n if (key === 'disabled' && parentElement.classList.contains(CLASSNAMES.INPUTGROUP)) {\n parentElement.classList.remove(CLASSNAMES.DISABLE);\n }\n if (key === 'placeholder' && parentElement.classList.contains(CLASSNAMES.FLOATINPUT)) {\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = '';\n }\n else {\n element.removeAttribute(key);\n }\n }\n }\n Input.removeAttributes = removeAttributes;\n /**\n * Adding the multiple attributes to the given element such as \"disabled\",\"id\" , etc.\n * ```\n * E.g : Input.addAttributes({ 'id': 'inputpopup' }, element);\n * ```\n *\n * @param {string} attrs\n * - Array of attributes which is added to element.\n * @param {HTMLInputElement | HTMLElement} element\n * - Element on which the attributes are needed to be added.\n */\n function addAttributes(attrs, element) {\n for (var _i = 0, _a = Object.keys(attrs); _i < _a.length; _i++) {\n var key = _a[_i];\n var parentElement = getParentNode(element);\n if (key === 'disabled') {\n element.classList.add(CLASSNAMES.DISABLE);\n }\n if (key === 'disabled' && parentElement.classList.contains(CLASSNAMES.INPUTGROUP)) {\n parentElement.classList.add(CLASSNAMES.DISABLE);\n }\n if (key === 'placeholder' && parentElement.classList.contains(CLASSNAMES.FLOATINPUT)) {\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = attrs[\"\" + key];\n }\n else {\n element.setAttribute(key, attrs[\"\" + key]);\n }\n }\n }\n Input.addAttributes = addAttributes;\n function removeFloating(input) {\n var container = input.container;\n if (!isNullOrUndefined(container) && container.classList.contains(CLASSNAMES.FLOATINPUT)) {\n var inputEle = container.querySelector('textarea') ? container.querySelector('textarea') :\n container.querySelector('input');\n var placeholder = container.querySelector('.' + CLASSNAMES.FLOATTEXT).textContent;\n var clearButton = container.querySelector('.e-clear-icon') !== null;\n detach(container.querySelector('.' + CLASSNAMES.FLOATLINE));\n detach(container.querySelector('.' + CLASSNAMES.FLOATTEXT));\n classList(container, [CLASSNAMES.INPUTGROUP], [CLASSNAMES.FLOATINPUT]);\n unwireFloatingEvents(inputEle);\n attributes(inputEle, { 'placeholder': placeholder });\n inputEle.classList.add(CLASSNAMES.INPUT);\n if (!clearButton && inputEle.tagName === 'INPUT') {\n inputEle.removeAttribute('required');\n }\n }\n }\n Input.removeFloating = removeFloating;\n function addFloating(input, type, placeholder, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var container = closest(input, '.' + CLASSNAMES.INPUTGROUP);\n floatType = type;\n var customTag = container.tagName;\n customTag = customTag !== 'DIV' && customTag !== 'SPAN' ? customTag : null;\n var args = { element: input, floatLabelType: type,\n customTag: customTag, properties: { placeholder: placeholder } };\n if (type !== 'Never') {\n var iconEle = container.querySelector('.e-clear-icon');\n var inputObj = { container: container };\n input.classList.remove(CLASSNAMES.INPUT);\n createFloatingInput(args, inputObj, makeElement);\n createSpanElement(inputObj.container, makeElement);\n calculateWidth(args.element, inputObj.container);\n var isPrependIcon = container.classList.contains('e-float-icon-left');\n if (isNullOrUndefined(iconEle)) {\n if (isPrependIcon) {\n var inputWrap = container.querySelector('.e-input-in-wrap');\n iconEle = inputWrap.querySelector('.e-input-group-icon');\n }\n else {\n iconEle = container.querySelector('.e-input-group-icon');\n }\n }\n if (isNullOrUndefined(iconEle)) {\n if (isPrependIcon) {\n iconEle = container.querySelector('.e-input-group-icon');\n }\n }\n else {\n var floatLine = container.querySelector('.' + CLASSNAMES.FLOATLINE);\n var floatText = container.querySelector('.' + CLASSNAMES.FLOATTEXT);\n var wrapper = isPrependIcon ? container.querySelector('.e-input-in-wrap') : container;\n wrapper.insertBefore(input, iconEle);\n wrapper.insertBefore(floatLine, iconEle);\n wrapper.insertBefore(floatText, iconEle);\n }\n }\n else {\n unWireFloatLabelEvents(args);\n }\n checkFloatLabelType(type, input.parentElement);\n }\n Input.addFloating = addFloating;\n /**\n * Create the span inside the label and add the label text into the span textcontent\n * ```\n * E.g : Input.createSpanElement(inputObject, makeElement);\n * ```\n *\n * @param {InputObject} inputObject\n * - Element which is need to get the label\n * @param {createElementParams} makeElement\n * - Element which is need to create the span\n */\n function createSpanElement(inputObject, makeElement) {\n if (inputObject.classList.contains('e-outline') && inputObject.getElementsByClassName('e-float-text')[0]) {\n var labelSpanElement = makeElement('span', { className: CLASSNAMES.FLOATTEXTCONTENT });\n labelSpanElement.innerHTML = inputObject.getElementsByClassName('e-float-text')[0].innerHTML;\n inputObject.getElementsByClassName('e-float-text')[0].innerHTML = '';\n inputObject.getElementsByClassName('e-float-text')[0].appendChild(labelSpanElement);\n }\n }\n Input.createSpanElement = createSpanElement;\n /**\n * Enable or Disable the ripple effect on the icons inside the Input. Ripple effect is only applicable for material theme.\n * ```\n * E.g : Input.setRipple(true, [inputObjects]);\n * ```\n *\n * @param {boolean} isRipple\n * - Boolean value to specify whether to enable the ripple effect.\n * @param {InputObject[]} inputObj\n * - Specify the collection of input objects.\n */\n function setRipple(isRipple, inputObj) {\n for (var i = 0; i < inputObj.length; i++) {\n _internalRipple(isRipple, inputObj[parseInt(i.toString())].container);\n }\n }\n Input.setRipple = setRipple;\n function _internalRipple(isRipple, container, button) {\n var argsButton = [];\n argsButton.push(button);\n var buttons = isNullOrUndefined(button) ?\n container.querySelectorAll('.e-input-group-icon') : argsButton;\n if (isRipple && buttons.length > 0) {\n for (var index = 0; index < buttons.length; index++) {\n buttons[parseInt(index.toString())].addEventListener('mousedown', _onMouseDownRipple, false);\n buttons[parseInt(index.toString())].addEventListener('mouseup', _onMouseUpRipple, false);\n }\n }\n else if (buttons.length > 0) {\n for (var index = 0; index < buttons.length; index++) {\n buttons[parseInt(index.toString())].removeEventListener('mousedown', _onMouseDownRipple);\n buttons[parseInt(index.toString())].removeEventListener('mouseup', _onMouseUpRipple);\n }\n }\n }\n function _onMouseRipple(container, button) {\n if (!container.classList.contains('e-disabled') && !container.querySelector('input').readOnly) {\n button.classList.add('e-input-btn-ripple');\n }\n }\n function _isElementVisible(element) {\n if (!element) {\n return false;\n }\n // Check if the element or any of its parents are hidden using display: none\n var currentElement = element;\n while (currentElement && currentElement !== document.body) {\n var style = window.getComputedStyle(currentElement);\n if (style.display === 'none') {\n return false;\n }\n currentElement = currentElement.parentElement;\n }\n // If none of the elements have display: none, the element is considered visible\n return true;\n }\n function _onMouseDownRipple() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var ele = this;\n var parentEle = this.parentElement;\n while (!parentEle.classList.contains('e-input-group')) {\n parentEle = parentEle.parentElement;\n }\n _onMouseRipple(parentEle, ele);\n }\n function _onMouseUpRipple() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var ele = this;\n setTimeout(function () {\n ele.classList.remove('e-input-btn-ripple');\n }, 500);\n }\n function createIconEle(iconClass, makeElement) {\n var button = makeElement('span', { className: iconClass });\n button.classList.add('e-input-group-icon');\n return button;\n }\n /**\n * Creates a new span element with the given icons added and append it in container element.\n * ```\n * E.g : Input.addIcon('append', 'e-icon-spin', inputObj.container, inputElement);\n * ```\n *\n * @param {string} position - Specify the icon placement on the input.Possible values are append and prepend.\n * @param {string | string[]} icons - Icon classes which are need to add to the span element which is going to created.\n * Span element acts as icon or button element for input.\n * @param {HTMLElement} container - The container on which created span element is going to append.\n * @param {HTMLElement} input - The inputElement on which created span element is going to prepend.\n */\n /* eslint-disable @typescript-eslint/indent */\n function addIcon(position, icons, container, input, internalCreate) {\n /* eslint-enable @typescript-eslint/indent */\n var result = typeof (icons) === 'string' ? icons.split(',')\n : icons;\n if (position.toLowerCase() === 'append') {\n for (var _i = 0, result_1 = result; _i < result_1.length; _i++) {\n var icon = result_1[_i];\n appendSpan(icon, container, internalCreate);\n }\n }\n else {\n for (var _a = 0, result_2 = result; _a < result_2.length; _a++) {\n var icon = result_2[_a];\n prependSpan(icon, container, input, internalCreate);\n }\n }\n if (container.getElementsByClassName('e-input-group-icon')[0] && container.getElementsByClassName('e-float-text-overflow')[0]) {\n container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n }\n Input.addIcon = addIcon;\n /**\n * Creates a new span element with the given icons added and prepend it in input element.\n * ```\n * E.g : Input.prependSpan('e-icon-spin', inputObj.container, inputElement);\n * ```\n *\n * @param {string} iconClass - Icon classes which are need to add to the span element which is going to created.\n * Span element acts as icon or button element for input.\n * @param {HTMLElement} container - The container on which created span element is going to append.\n * @param {HTMLElement} inputElement - The inputElement on which created span element is going to prepend.\n */\n /* eslint-disable @typescript-eslint/indent */\n function prependSpan(iconClass, container, inputElement, internalCreateElement) {\n /* eslint-enable @typescript-eslint/indent */\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var button = createIconEle(iconClass, makeElement);\n container.classList.add('e-float-icon-left');\n var innerWrapper = container.querySelector('.e-input-in-wrap');\n if (isNullOrUndefined(innerWrapper)) {\n innerWrapper = makeElement('span', { className: 'e-input-in-wrap' });\n inputElement.parentNode.insertBefore(innerWrapper, inputElement);\n var result = container.querySelectorAll(inputElement.tagName + ' ~ *');\n innerWrapper.appendChild(inputElement);\n for (var i = 0; i < result.length; i++) {\n var element = result[parseInt(i.toString())];\n var parentElement = innerWrapper.parentElement;\n if (!(element.classList.contains('e-float-line')) || (!(parentElement && parentElement.classList.contains('e-filled')) && parentElement)) {\n innerWrapper.appendChild(element);\n }\n }\n }\n innerWrapper.parentNode.insertBefore(button, innerWrapper);\n _internalRipple(true, container, button);\n return button;\n }\n Input.prependSpan = prependSpan;\n /**\n * Creates a new span element with the given icons added and append it in container element.\n * ```\n * E.g : Input.appendSpan('e-icon-spin', inputObj.container);\n * ```\n *\n * @param {string} iconClass - Icon classes which are need to add to the span element which is going to created.\n * Span element acts as icon or button element for input.\n * @param {HTMLElement} container - The container on which created span element is going to append.\n */\n function appendSpan(iconClass, container, internalCreateElement) {\n var makeElement = !isNullOrUndefined(internalCreateElement) ? internalCreateElement : createElement;\n var button = createIconEle(iconClass, makeElement);\n var wrap = (container.classList.contains('e-float-icon-left')) ? container.querySelector('.e-input-in-wrap') :\n container;\n wrap.appendChild(button);\n _internalRipple(true, container, button);\n return button;\n }\n Input.appendSpan = appendSpan;\n function validateInputType(containerElement, input) {\n if (input.type === 'hidden') {\n containerElement.classList.add('e-hidden');\n }\n else if (containerElement.classList.contains('e-hidden')) {\n containerElement.classList.remove('e-hidden');\n }\n }\n Input.validateInputType = validateInputType;\n function updateHTMLAttributesToElement(htmlAttributes, element) {\n if (!isNullOrUndefined(htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (containerAttributes.indexOf(key) < 0) {\n element.setAttribute(key, htmlAttributes[\"\" + key]);\n }\n }\n }\n }\n Input.updateHTMLAttributesToElement = updateHTMLAttributesToElement;\n function updateCssClass(newClass, oldClass, container) {\n setCssClass(getInputValidClassList(newClass), [container], getInputValidClassList(oldClass));\n }\n Input.updateCssClass = updateCssClass;\n function getInputValidClassList(inputClassName) {\n var result = inputClassName;\n if (!isNullOrUndefined(inputClassName) && inputClassName !== '') {\n result = (inputClassName.replace(/\\s+/g, ' ')).trim();\n }\n return result;\n }\n Input.getInputValidClassList = getInputValidClassList;\n function updateHTMLAttributesToWrapper(htmlAttributes, container) {\n if (!isNullOrUndefined(htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (containerAttributes.indexOf(key) > -1) {\n if (key === 'class') {\n var updatedClassValues = this.getInputValidClassList(htmlAttributes[\"\" + key]);\n if (updatedClassValues !== '') {\n addClass([container], updatedClassValues.split(' '));\n }\n }\n else if (key === 'style') {\n var setStyle = container.getAttribute(key);\n setStyle = !isNullOrUndefined(setStyle) ? (setStyle + htmlAttributes[\"\" + key]) :\n htmlAttributes[\"\" + key];\n container.setAttribute(key, setStyle);\n }\n else {\n container.setAttribute(key, htmlAttributes[\"\" + key]);\n }\n }\n }\n }\n }\n Input.updateHTMLAttributesToWrapper = updateHTMLAttributesToWrapper;\n function isBlank(inputString) {\n return (!inputString || /^\\s*$/.test(inputString));\n }\n Input.isBlank = isBlank;\n})(Input || (Input = {}));\n/* eslint-enable valid-jsdoc, jsdoc/require-jsdoc, jsdoc/require-returns, jsdoc/require-param */\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, EventHandler, Property, Event, Browser, L10n, getUniqueID } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { attributes, addClass, removeClass, detach, closest } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, getValue, formatUnit, setValue, merge } from '@syncfusion/ej2-base';\nimport { Internationalization, getNumericObject } from '@syncfusion/ej2-base';\nimport { Input } from '../input/input';\nvar ROOT = 'e-control-wrapper e-numeric';\nvar SPINICON = 'e-input-group-icon';\nvar SPINUP = 'e-spin-up';\nvar SPINDOWN = 'e-spin-down';\nvar ERROR = 'e-error';\nvar INCREMENT = 'increment';\nvar DECREMENT = 'decrement';\nvar INTREGEXP = new RegExp('^(-)?(\\\\d*)$');\nvar DECIMALSEPARATOR = '.';\nvar COMPONENT = 'e-numerictextbox';\nvar CONTROL = 'e-control';\nvar NUMERIC_FOCUS = 'e-input-focus';\nvar HIDDENELEMENT = 'e-numeric-hidden';\nvar wrapperAttributes = ['title', 'style', 'class'];\nvar selectionTimeOut = 0;\n/**\n * Represents the NumericTextBox component that allows the user to enter only numeric values.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar NumericTextBox = /** @class */ (function (_super) {\n __extends(NumericTextBox, _super);\n /**\n *\n * @param {NumericTextBoxModel} options - Specifies the NumericTextBox model.\n * @param {string | HTMLInputElement} element - Specifies the element to render as component.\n * @private\n */\n function NumericTextBox(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isVue = false;\n _this.preventChange = false;\n _this.isAngular = false;\n _this.isDynamicChange = false;\n _this.numericOptions = options;\n return _this;\n }\n NumericTextBox.prototype.preRender = function () {\n this.isPrevFocused = false;\n this.decimalSeparator = '.';\n // eslint-disable-next-line no-useless-escape\n this.intRegExp = new RegExp('/^(-)?(\\d*)$/');\n this.isCalled = false;\n var ejInstance = getValue('ej2_instances', this.element);\n this.cloneElement = this.element.cloneNode(true);\n removeClass([this.cloneElement], [CONTROL, COMPONENT, 'e-lib']);\n this.angularTagName = null;\n this.formEle = closest(this.element, 'form');\n if (this.element.tagName === 'EJS-NUMERICTEXTBOX') {\n this.angularTagName = this.element.tagName;\n var input = this.createElement('input');\n var index = 0;\n for (index; index < this.element.attributes.length; index++) {\n var attributeName = this.element.attributes[index].nodeName;\n if (attributeName !== 'id' && attributeName !== 'class') {\n input.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);\n input.innerHTML = this.element.innerHTML;\n }\n else if (attributeName === 'class') {\n input.setAttribute(attributeName, this.element.className.split(' ').filter(function (item) { return item.indexOf('ng-') !== 0; }).join(' '));\n }\n }\n if (this.element.hasAttribute('name')) {\n this.element.removeAttribute('name');\n }\n this.element.classList.remove('e-control', 'e-numerictextbox');\n this.element.appendChild(input);\n this.element = input;\n setValue('ej2_instances', ejInstance, this.element);\n }\n attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off' });\n var localeText = {\n incrementTitle: 'Increment value', decrementTitle: 'Decrement value', placeholder: this.placeholder\n };\n this.l10n = new L10n('numerictextbox', localeText, this.locale);\n if (this.l10n.getConstant('placeholder') !== '') {\n this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);\n }\n if (!this.element.hasAttribute('id')) {\n this.element.setAttribute('id', getUniqueID('numerictextbox'));\n }\n this.isValidState = true;\n this.inputStyle = null;\n this.inputName = null;\n this.cultureInfo = {};\n this.initCultureInfo();\n this.initCultureFunc();\n this.prevValue = this.value;\n this.updateHTMLAttrToElement();\n this.checkAttributes(false);\n if (this.formEle) {\n this.inputEleValue = this.value;\n }\n this.validateMinMax();\n this.validateStep();\n if (this.placeholder === null) {\n this.updatePlaceholder();\n }\n };\n /**\n * To Initialize the control rendering\n *\n * @returns {void}\n * @private\n */\n NumericTextBox.prototype.render = function () {\n if (this.element.tagName.toLowerCase() === 'input') {\n this.createWrapper();\n if (this.showSpinButton) {\n this.spinBtnCreation();\n }\n this.setElementWidth(this.width);\n if (!this.container.classList.contains('e-input-group')) {\n this.container.classList.add('e-input-group');\n }\n this.changeValue(this.value === null || isNaN(this.value) ?\n null : this.strictMode ? this.trimValue(this.value) : this.value);\n this.wireEvents();\n if (this.value !== null && !isNaN(this.value)) {\n if (this.decimals) {\n this.setProperties({ value: this.roundNumber(this.value, this.decimals) }, true);\n }\n }\n if (this.element.getAttribute('value') || this.value) {\n this.element.setAttribute('value', this.element.value);\n this.hiddenInput.setAttribute('value', this.hiddenInput.value);\n }\n this.elementPrevValue = this.element.value;\n if (this.element.hasAttribute('data-val')) {\n this.element.setAttribute('data-val', 'false');\n }\n if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {\n this.enabled = false;\n }\n this.renderComplete();\n }\n };\n NumericTextBox.prototype.checkAttributes = function (isDynamic) {\n var attributes = isDynamic ? isNullOrUndefined(this.htmlAttributes) ? [] : Object.keys(this.htmlAttributes) :\n ['value', 'min', 'max', 'step', 'disabled', 'readonly', 'style', 'name', 'placeholder'];\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var prop = attributes_1[_i];\n if (!isNullOrUndefined(this.element.getAttribute(prop))) {\n switch (prop) {\n case 'disabled':\n if ((isNullOrUndefined(this.numericOptions) || (this.numericOptions['enabled'] === undefined)) || isDynamic) {\n var enabled = this.element.getAttribute(prop) === 'disabled' || this.element.getAttribute(prop) === ''\n || this.element.getAttribute(prop) === 'true' ? false : true;\n this.setProperties({ enabled: enabled }, !isDynamic);\n }\n break;\n case 'readonly':\n if ((isNullOrUndefined(this.numericOptions) || (this.numericOptions['readonly'] === undefined)) || isDynamic) {\n var readonly = this.element.getAttribute(prop) === 'readonly' || this.element.getAttribute(prop) === ''\n || this.element.getAttribute(prop) === 'true' ? true : false;\n this.setProperties({ readonly: readonly }, !isDynamic);\n }\n break;\n case 'placeholder':\n if ((isNullOrUndefined(this.numericOptions) || (this.numericOptions['placeholder'] === undefined)) || isDynamic) {\n this.setProperties({ placeholder: this.element.placeholder }, !isDynamic);\n }\n break;\n case 'value':\n if ((isNullOrUndefined(this.numericOptions) || (this.numericOptions['value'] === undefined)) || isDynamic) {\n var setNumber = this.instance.getNumberParser({ format: 'n' })(this.element.getAttribute(prop));\n this.setProperties(setValue(prop, setNumber, {}), !isDynamic);\n }\n break;\n case 'min':\n if ((isNullOrUndefined(this.numericOptions) || (this.numericOptions['min'] === undefined)) || isDynamic) {\n var minValue = this.instance.getNumberParser({ format: 'n' })(this.element.getAttribute(prop));\n if (minValue !== null && !isNaN(minValue)) {\n this.setProperties(setValue(prop, minValue, {}), !isDynamic);\n }\n }\n break;\n case 'max':\n if ((isNullOrUndefined(this.numericOptions) || (this.numericOptions['max'] === undefined)) || isDynamic) {\n var maxValue = this.instance.getNumberParser({ format: 'n' })(this.element.getAttribute(prop));\n if (maxValue !== null && !isNaN(maxValue)) {\n this.setProperties(setValue(prop, maxValue, {}), !isDynamic);\n }\n }\n break;\n case 'step':\n if ((isNullOrUndefined(this.numericOptions) || (this.numericOptions['step'] === undefined)) || isDynamic) {\n var stepValue = this.instance.getNumberParser({ format: 'n' })(this.element.getAttribute(prop));\n if (stepValue !== null && !isNaN(stepValue)) {\n this.setProperties(setValue(prop, stepValue, {}), !isDynamic);\n }\n }\n break;\n case 'style':\n this.inputStyle = this.element.getAttribute(prop);\n break;\n case 'name':\n this.inputName = this.element.getAttribute(prop);\n break;\n default:\n {\n var value = this.instance.getNumberParser({ format: 'n' })(this.element.getAttribute(prop));\n if ((value !== null && !isNaN(value)) || (prop === 'value')) {\n this.setProperties(setValue(prop, value, {}), true);\n }\n }\n break;\n }\n }\n }\n };\n NumericTextBox.prototype.updatePlaceholder = function () {\n this.setProperties({ placeholder: this.l10n.getConstant('placeholder') }, true);\n };\n NumericTextBox.prototype.initCultureFunc = function () {\n this.instance = new Internationalization(this.locale);\n };\n NumericTextBox.prototype.initCultureInfo = function () {\n this.cultureInfo.format = this.format;\n if (getValue('currency', this) !== null) {\n setValue('currency', this.currency, this.cultureInfo);\n this.setProperties({ currencyCode: this.currency }, true);\n }\n };\n /* Wrapper creation */\n NumericTextBox.prototype.createWrapper = function () {\n var updatedCssClassValue = this.cssClass;\n if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {\n updatedCssClassValue = this.getNumericValidClassList(this.cssClass);\n }\n var inputObj = Input.createInput({\n element: this.element,\n floatLabelType: this.floatLabelType,\n properties: {\n readonly: this.readonly,\n placeholder: this.placeholder,\n cssClass: updatedCssClassValue,\n enableRtl: this.enableRtl,\n showClearButton: this.showClearButton,\n enabled: this.enabled\n }\n }, this.createElement);\n this.inputWrapper = inputObj;\n this.container = inputObj.container;\n this.container.setAttribute('class', ROOT + ' ' + this.container.getAttribute('class'));\n this.updateHTMLAttrToWrapper();\n if (this.readonly) {\n attributes(this.element, { 'aria-readonly': 'true' });\n }\n this.hiddenInput = (this.createElement('input', { attrs: { type: 'text',\n 'validateHidden': 'true', 'aria-label': 'hidden', 'class': HIDDENELEMENT } }));\n this.inputName = this.inputName !== null ? this.inputName : this.element.id;\n this.element.removeAttribute('name');\n if (this.isAngular && this.angularTagName === 'EJS-NUMERICTEXTBOX' && this.cloneElement.id.length > 0) {\n attributes(this.hiddenInput, { 'name': this.cloneElement.id });\n }\n else {\n attributes(this.hiddenInput, { 'name': this.inputName });\n }\n this.container.insertBefore(this.hiddenInput, this.container.childNodes[1]);\n this.updateDataAttribute(false);\n if (this.inputStyle !== null) {\n attributes(this.container, { 'style': this.inputStyle });\n }\n };\n NumericTextBox.prototype.updateDataAttribute = function (isDynamic) {\n var attr = {};\n if (!isDynamic) {\n for (var a = 0; a < this.element.attributes.length; a++) {\n attr[this.element.attributes[a].name] = this.element.getAttribute(this.element.attributes[a].name);\n }\n }\n else {\n attr = this.htmlAttributes;\n }\n for (var _i = 0, _a = Object.keys(attr); _i < _a.length; _i++) {\n var key = _a[_i];\n if (key.indexOf('data') === 0) {\n this.hiddenInput.setAttribute(key, attr[\"\" + key]);\n }\n }\n };\n NumericTextBox.prototype.updateHTMLAttrToElement = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var pro = _a[_i];\n if (wrapperAttributes.indexOf(pro) < 0) {\n this.element.setAttribute(pro, this.htmlAttributes[\"\" + pro]);\n }\n }\n }\n };\n NumericTextBox.prototype.updateCssClass = function (newClass, oldClass) {\n Input.setCssClass(this.getNumericValidClassList(newClass), [this.container], this.getNumericValidClassList(oldClass));\n };\n NumericTextBox.prototype.getNumericValidClassList = function (numericClassName) {\n var result = numericClassName;\n if (!isNullOrUndefined(numericClassName) && numericClassName !== '') {\n result = (numericClassName.replace(/\\s+/g, ' ')).trim();\n }\n return result;\n };\n NumericTextBox.prototype.updateHTMLAttrToWrapper = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var pro = _a[_i];\n if (wrapperAttributes.indexOf(pro) > -1) {\n if (pro === 'class') {\n var updatedClassValue = this.getNumericValidClassList(this.htmlAttributes[\"\" + pro]);\n if (updatedClassValue !== '') {\n addClass([this.container], updatedClassValue.split(' '));\n }\n }\n else if (pro === 'style') {\n var numericStyle = this.container.getAttribute(pro);\n numericStyle = !isNullOrUndefined(numericStyle) ? (numericStyle + this.htmlAttributes[\"\" + pro]) :\n this.htmlAttributes[\"\" + pro];\n this.container.setAttribute(pro, numericStyle);\n }\n else {\n this.container.setAttribute(pro, this.htmlAttributes[\"\" + pro]);\n }\n }\n }\n }\n };\n NumericTextBox.prototype.setElementWidth = function (width) {\n if (!isNullOrUndefined(width)) {\n if (typeof width === 'number') {\n this.container.style.width = formatUnit(width);\n }\n else if (typeof width === 'string') {\n this.container.style.width = (width.match(/px|%|em/)) ? (width) : (formatUnit(width));\n }\n }\n };\n /* Spinner creation */\n NumericTextBox.prototype.spinBtnCreation = function () {\n this.spinDown = Input.appendSpan(SPINICON + ' ' + SPINDOWN, this.container, this.createElement);\n attributes(this.spinDown, {\n 'title': this.l10n.getConstant('decrementTitle')\n });\n this.spinUp = Input.appendSpan(SPINICON + ' ' + SPINUP, this.container, this.createElement);\n attributes(this.spinUp, {\n 'title': this.l10n.getConstant('incrementTitle')\n });\n this.wireSpinBtnEvents();\n };\n NumericTextBox.prototype.validateMinMax = function () {\n if (!(typeof (this.min) === 'number' && !isNaN(this.min))) {\n this.setProperties({ min: -(Number.MAX_VALUE) }, true);\n }\n if (!(typeof (this.max) === 'number' && !isNaN(this.max))) {\n this.setProperties({ max: Number.MAX_VALUE }, true);\n }\n if (this.decimals !== null) {\n if (this.min !== -(Number.MAX_VALUE)) {\n this.setProperties({ min: this.instance.getNumberParser({ format: 'n' })(this.formattedValue(this.decimals, this.min)) }, true);\n }\n if (this.max !== (Number.MAX_VALUE)) {\n this.setProperties({ max: this.instance.getNumberParser({ format: 'n' })(this.formattedValue(this.decimals, this.max)) }, true);\n }\n }\n this.setProperties({ min: this.min > this.max ? this.max : this.min }, true);\n if (this.min !== -(Number.MAX_VALUE)) {\n attributes(this.element, { 'aria-valuemin': this.min.toString() });\n }\n if (this.max !== (Number.MAX_VALUE)) {\n attributes(this.element, { 'aria-valuemax': this.max.toString() });\n }\n };\n NumericTextBox.prototype.formattedValue = function (decimals, value) {\n return this.instance.getNumberFormat({\n maximumFractionDigits: decimals,\n minimumFractionDigits: decimals, useGrouping: false\n })(value);\n };\n NumericTextBox.prototype.validateStep = function () {\n if (this.decimals !== null) {\n this.setProperties({ step: this.instance.getNumberParser({ format: 'n' })(this.formattedValue(this.decimals, this.step)) }, true);\n }\n };\n NumericTextBox.prototype.action = function (operation, event) {\n this.isInteract = true;\n var value = this.isFocused ? this.instance.getNumberParser({ format: 'n' })(this.element.value) : this.value;\n this.changeValue(this.performAction(value, this.step, operation));\n this.raiseChangeEvent(event);\n };\n NumericTextBox.prototype.checkErrorClass = function () {\n if (this.isValidState) {\n removeClass([this.container], ERROR);\n }\n else {\n addClass([this.container], ERROR);\n }\n attributes(this.element, { 'aria-invalid': this.isValidState ? 'false' : 'true' });\n };\n NumericTextBox.prototype.bindClearEvent = function () {\n if (this.showClearButton) {\n EventHandler.add(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler, this);\n }\n };\n NumericTextBox.prototype.resetHandler = function (e) {\n e.preventDefault();\n if (!(this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide')) || this.inputWrapper.container.classList.contains('e-static-clear')) {\n this.clear(e);\n }\n this.isInteract = true;\n this.raiseChangeEvent(e);\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n NumericTextBox.prototype.clear = function (event) {\n this.setProperties({ value: null }, true);\n this.setElementValue('');\n this.hiddenInput.value = '';\n var formElement = closest(this.element, 'form');\n if (formElement) {\n var element = this.element.nextElementSibling;\n var keyupEvent = document.createEvent('KeyboardEvent');\n keyupEvent.initEvent('keyup', false, true);\n element.dispatchEvent(keyupEvent);\n }\n };\n NumericTextBox.prototype.resetFormHandler = function () {\n if (this.element.tagName === 'EJS-NUMERICTEXTBOX') {\n this.updateValue(null);\n }\n else {\n this.updateValue(this.inputEleValue);\n }\n };\n NumericTextBox.prototype.setSpinButton = function () {\n if (!isNullOrUndefined(this.spinDown)) {\n attributes(this.spinDown, {\n 'title': this.l10n.getConstant('decrementTitle'),\n 'aria-label': this.l10n.getConstant('decrementTitle')\n });\n }\n if (!isNullOrUndefined(this.spinUp)) {\n attributes(this.spinUp, {\n 'title': this.l10n.getConstant('incrementTitle'),\n 'aria-label': this.l10n.getConstant('incrementTitle')\n });\n }\n };\n NumericTextBox.prototype.wireEvents = function () {\n EventHandler.add(this.element, 'focus', this.focusHandler, this);\n EventHandler.add(this.element, 'blur', this.focusOutHandler, this);\n EventHandler.add(this.element, 'keydown', this.keyDownHandler, this);\n EventHandler.add(this.element, 'keyup', this.keyUpHandler, this);\n EventHandler.add(this.element, 'input', this.inputHandler, this);\n EventHandler.add(this.element, 'keypress', this.keyPressHandler, this);\n EventHandler.add(this.element, 'change', this.changeHandler, this);\n EventHandler.add(this.element, 'paste', this.pasteHandler, this);\n if (this.enabled) {\n this.bindClearEvent();\n if (this.formEle) {\n EventHandler.add(this.formEle, 'reset', this.resetFormHandler, this);\n }\n }\n };\n NumericTextBox.prototype.wireSpinBtnEvents = function () {\n /* bind spin button events */\n EventHandler.add(this.spinUp, Browser.touchStartEvent, this.mouseDownOnSpinner, this);\n EventHandler.add(this.spinDown, Browser.touchStartEvent, this.mouseDownOnSpinner, this);\n EventHandler.add(this.spinUp, Browser.touchEndEvent, this.mouseUpOnSpinner, this);\n EventHandler.add(this.spinDown, Browser.touchEndEvent, this.mouseUpOnSpinner, this);\n EventHandler.add(this.spinUp, Browser.touchMoveEvent, this.touchMoveOnSpinner, this);\n EventHandler.add(this.spinDown, Browser.touchMoveEvent, this.touchMoveOnSpinner, this);\n };\n NumericTextBox.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, 'focus', this.focusHandler);\n EventHandler.remove(this.element, 'blur', this.focusOutHandler);\n EventHandler.remove(this.element, 'keyup', this.keyUpHandler);\n EventHandler.remove(this.element, 'input', this.inputHandler);\n EventHandler.remove(this.element, 'keydown', this.keyDownHandler);\n EventHandler.remove(this.element, 'keypress', this.keyPressHandler);\n EventHandler.remove(this.element, 'change', this.changeHandler);\n EventHandler.remove(this.element, 'paste', this.pasteHandler);\n if (this.formEle) {\n EventHandler.remove(this.formEle, 'reset', this.resetFormHandler);\n }\n };\n NumericTextBox.prototype.unwireSpinBtnEvents = function () {\n /* unbind spin button events */\n EventHandler.remove(this.spinUp, Browser.touchStartEvent, this.mouseDownOnSpinner);\n EventHandler.remove(this.spinDown, Browser.touchStartEvent, this.mouseDownOnSpinner);\n EventHandler.remove(this.spinUp, Browser.touchEndEvent, this.mouseUpOnSpinner);\n EventHandler.remove(this.spinDown, Browser.touchEndEvent, this.mouseUpOnSpinner);\n EventHandler.remove(this.spinUp, Browser.touchMoveEvent, this.touchMoveOnSpinner);\n EventHandler.remove(this.spinDown, Browser.touchMoveEvent, this.touchMoveOnSpinner);\n };\n NumericTextBox.prototype.changeHandler = function (event) {\n event.stopPropagation();\n if (!this.element.value.length) {\n this.setProperties({ value: null }, true);\n }\n var parsedInput = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n this.updateValue(parsedInput, event);\n };\n NumericTextBox.prototype.raiseChangeEvent = function (event) {\n this.inputValue = (isNullOrUndefined(this.inputValue) || isNaN(this.inputValue)) ? null : this.inputValue;\n if (this.prevValue !== this.value || this.prevValue !== this.inputValue) {\n var eventArgs = {};\n this.changeEventArgs = { value: this.value, previousValue: this.prevValue, isInteracted: this.isInteract,\n isInteraction: this.isInteract, event: event };\n if (event) {\n this.changeEventArgs.event = event;\n }\n if (this.changeEventArgs.event === undefined) {\n this.changeEventArgs.isInteracted = false;\n this.changeEventArgs.isInteraction = false;\n }\n merge(eventArgs, this.changeEventArgs);\n this.prevValue = this.value;\n this.isInteract = false;\n this.elementPrevValue = this.element.value;\n this.preventChange = false;\n this.trigger('change', eventArgs);\n }\n };\n NumericTextBox.prototype.pasteHandler = function () {\n var _this = this;\n if (!this.enabled || this.readonly) {\n return;\n }\n var beforeUpdate = this.element.value;\n setTimeout(function () {\n if (!_this.numericRegex().test(_this.element.value)) {\n _this.setElementValue(beforeUpdate);\n }\n });\n };\n NumericTextBox.prototype.preventHandler = function () {\n var _this = this;\n var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);\n setTimeout(function () {\n if (_this.element.selectionStart > 0) {\n var currentPos = _this.element.selectionStart;\n var prevPos = _this.element.selectionStart - 1;\n var start = 0;\n var valArray = _this.element.value.split('');\n var numericObject = getNumericObject(_this.locale);\n var decimalSeparator = getValue('decimal', numericObject);\n var ignoreKeyCode = decimalSeparator.charCodeAt(0);\n if (_this.element.value[prevPos] === ' ' && _this.element.selectionStart > 0 && !iOS) {\n if (isNullOrUndefined(_this.prevVal)) {\n _this.element.value = _this.element.value.trim();\n }\n else if (prevPos !== 0) {\n _this.element.value = _this.prevVal;\n }\n else if (prevPos === 0) {\n _this.element.value = _this.element.value.trim();\n }\n _this.element.setSelectionRange(prevPos, prevPos);\n }\n else if (isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 1])) &&\n _this.element.value[_this.element.selectionStart - 1].charCodeAt(0) !== 45) {\n if ((valArray.indexOf(_this.element.value[_this.element.selectionStart - 1]) !==\n valArray.lastIndexOf(_this.element.value[_this.element.selectionStart - 1]) &&\n _this.element.value[_this.element.selectionStart - 1].charCodeAt(0) === ignoreKeyCode) ||\n _this.element.value[_this.element.selectionStart - 1].charCodeAt(0) !== ignoreKeyCode) {\n _this.element.value = _this.element.value.substring(0, prevPos) +\n _this.element.value.substring(currentPos, _this.element.value.length);\n _this.element.setSelectionRange(prevPos, prevPos);\n if (isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 1])) && _this.element.selectionStart > 0\n && _this.element.value.length) {\n _this.preventHandler();\n }\n }\n }\n else if (isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 2])) && _this.element.selectionStart > 1 &&\n _this.element.value[_this.element.selectionStart - 2].charCodeAt(0) !== 45) {\n if ((valArray.indexOf(_this.element.value[_this.element.selectionStart - 2]) !==\n valArray.lastIndexOf(_this.element.value[_this.element.selectionStart - 2]) &&\n _this.element.value[_this.element.selectionStart - 2].charCodeAt(0) === ignoreKeyCode) ||\n _this.element.value[_this.element.selectionStart - 2].charCodeAt(0) !== ignoreKeyCode) {\n _this.element.setSelectionRange(prevPos, prevPos);\n _this.nextEle = _this.element.value[_this.element.selectionStart];\n _this.cursorPosChanged = true;\n _this.preventHandler();\n }\n }\n if (_this.cursorPosChanged === true && _this.element.value[_this.element.selectionStart] === _this.nextEle &&\n isNaN(parseFloat(_this.element.value[_this.element.selectionStart - 1]))) {\n _this.element.setSelectionRange(_this.element.selectionStart + 1, _this.element.selectionStart + 1);\n _this.cursorPosChanged = false;\n _this.nextEle = null;\n }\n if (_this.element.value.trim() === '') {\n _this.element.setSelectionRange(start, start);\n }\n if (_this.element.selectionStart > 0) {\n if ((_this.element.value[_this.element.selectionStart - 1].charCodeAt(0) === 45) && _this.element.selectionStart > 1) {\n if (isNullOrUndefined(_this.prevVal)) {\n // eslint-disable-next-line no-self-assign\n _this.element.value = _this.element.value;\n }\n else {\n _this.element.value = _this.prevVal;\n }\n _this.element.setSelectionRange(_this.element.selectionStart, _this.element.selectionStart);\n }\n if (_this.element.value[_this.element.selectionStart - 1] === decimalSeparator && _this.decimals === 0 && _this.validateDecimalOnType) {\n _this.element.value = _this.element.value.substring(0, prevPos) +\n _this.element.value.substring(currentPos, _this.element.value.length);\n }\n }\n _this.prevVal = _this.element.value;\n }\n });\n };\n NumericTextBox.prototype.keyUpHandler = function () {\n if (!this.enabled || this.readonly) {\n return;\n }\n var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);\n if (!iOS && Browser.isDevice) {\n this.preventHandler();\n }\n var parseValue = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n parseValue = parseValue === null || isNaN(parseValue) ? null : parseValue;\n this.hiddenInput.value = parseValue || parseValue === 0 ? parseValue.toString() : null;\n var formElement = closest(this.element, 'form');\n if (formElement) {\n var element = this.element.nextElementSibling;\n var keyupEvent = document.createEvent('KeyboardEvent');\n keyupEvent.initEvent('keyup', false, true);\n element.dispatchEvent(keyupEvent);\n }\n };\n NumericTextBox.prototype.inputHandler = function (event) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-this-alias\n var numerictextboxObj = this;\n if (!this.enabled || this.readonly) {\n return;\n }\n var iOS = !!navigator.platform && /iPad|iPhone|iPod/.test(navigator.platform);\n var fireFox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;\n if ((fireFox || iOS) && Browser.isDevice) {\n this.preventHandler();\n }\n /* istanbul ignore next */\n if (this.isAngular\n && this.element.value !== getValue('decimal', getNumericObject(this.locale))\n && this.element.value !== getValue('minusSign', getNumericObject(this.locale))) {\n var parsedValue = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n parsedValue = isNaN(parsedValue) ? null : parsedValue;\n numerictextboxObj.localChange({ value: parsedValue });\n this.preventChange = true;\n }\n if (this.isVue) {\n var current = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n var previous = this.instance.getNumberParser({ format: 'n' })(this.elementPrevValue);\n //EJ2-54963-if type \".\" or \".0\" or \"-.0\" it converts to \"0\" automatically when binding v-model\n var nonZeroRegex = new RegExp('[^0-9]+$');\n if (nonZeroRegex.test(this.element.value) || ((this.elementPrevValue.indexOf('.') !== -1 || this.elementPrevValue.indexOf('-') !== -1) && this.element.value[this.element.value.length - 1] === '0')) {\n current = this.value;\n }\n var eventArgs = {\n event: event,\n value: (current === null || isNaN(current) ? null : current),\n previousValue: (previous === null || isNaN(previous) ? null : previous)\n };\n this.preventChange = true;\n this.elementPrevValue = this.element.value;\n this.trigger('input', eventArgs);\n }\n };\n NumericTextBox.prototype.keyDownHandler = function (event) {\n if (!this.readonly) {\n switch (event.keyCode) {\n case 38:\n event.preventDefault();\n this.action(INCREMENT, event);\n break;\n case 40:\n event.preventDefault();\n this.action(DECREMENT, event);\n break;\n default: break;\n }\n }\n };\n NumericTextBox.prototype.performAction = function (value, step, operation) {\n if (value === null || isNaN(value)) {\n value = 0;\n }\n var updatedValue = operation === INCREMENT ? value + step : value - step;\n updatedValue = this.correctRounding(value, step, updatedValue);\n return this.strictMode ? this.trimValue(updatedValue) : updatedValue;\n };\n NumericTextBox.prototype.correctRounding = function (value, step, result) {\n var floatExp = new RegExp('[,.](.*)');\n var floatValue = floatExp.test(value.toString());\n var floatStep = floatExp.test(step.toString());\n if (floatValue || floatStep) {\n var valueCount = floatValue ? floatExp.exec(value.toString())[0].length : 0;\n var stepCount = floatStep ? floatExp.exec(step.toString())[0].length : 0;\n var max = Math.max(valueCount, stepCount);\n return value = this.roundValue(result, max);\n }\n return result;\n };\n NumericTextBox.prototype.roundValue = function (result, precision) {\n precision = precision || 0;\n var divide = Math.pow(10, precision);\n return result *= divide, result = Math.round(result) / divide;\n };\n NumericTextBox.prototype.updateValue = function (value, event) {\n if (event) {\n this.isInteract = true;\n }\n if (value !== null && !isNaN(value)) {\n if (this.decimals) {\n value = this.roundNumber(value, this.decimals);\n }\n }\n this.inputValue = value;\n this.changeValue(value === null || isNaN(value) ? null : this.strictMode ? this.trimValue(value) : value);\n /* istanbul ignore next */\n if (!this.isDynamicChange) {\n this.raiseChangeEvent(event);\n }\n };\n NumericTextBox.prototype.updateCurrency = function (prop, propVal) {\n setValue(prop, propVal, this.cultureInfo);\n this.updateValue(this.value);\n };\n NumericTextBox.prototype.changeValue = function (value) {\n if (!(value || value === 0)) {\n value = null;\n this.setProperties({ value: value }, true);\n }\n else {\n var numberOfDecimals = this.getNumberOfDecimals(value);\n this.setProperties({ value: this.roundNumber(value, numberOfDecimals) }, true);\n }\n this.modifyText();\n if (!this.strictMode) {\n this.validateState();\n }\n };\n NumericTextBox.prototype.modifyText = function () {\n if (this.value || this.value === 0) {\n var value = this.formatNumber();\n var elementValue = this.isFocused ? value : this.instance.getNumberFormat(this.cultureInfo)(this.value);\n this.setElementValue(elementValue);\n attributes(this.element, { 'aria-valuenow': value });\n this.hiddenInput.value = this.value.toString();\n if (this.value !== null && this.serverDecimalSeparator) {\n this.hiddenInput.value = this.hiddenInput.value.replace('.', this.serverDecimalSeparator);\n }\n }\n else {\n this.setElementValue('');\n this.element.removeAttribute('aria-valuenow');\n this.hiddenInput.value = null;\n }\n };\n NumericTextBox.prototype.setElementValue = function (val, element) {\n Input.setValue(val, (element ? element : this.element), this.floatLabelType, this.showClearButton);\n };\n NumericTextBox.prototype.validateState = function () {\n this.isValidState = true;\n if (this.value || this.value === 0) {\n this.isValidState = !(this.value > this.max || this.value < this.min);\n }\n this.checkErrorClass();\n };\n NumericTextBox.prototype.getNumberOfDecimals = function (value) {\n var numberOfDecimals;\n // eslint-disable-next-line no-useless-escape\n var EXPREGEXP = new RegExp('[eE][\\-+]?([0-9]+)');\n var valueString = value.toString();\n if (EXPREGEXP.test(valueString)) {\n var result = EXPREGEXP.exec(valueString);\n if (!isNullOrUndefined(result)) {\n valueString = value.toFixed(Math.min(parseInt(result[1], 10), 20));\n }\n }\n var decimalPart = valueString.split('.')[1];\n numberOfDecimals = !decimalPart || !decimalPart.length ? 0 : decimalPart.length;\n if (this.decimals !== null) {\n numberOfDecimals = numberOfDecimals < this.decimals ? numberOfDecimals : this.decimals;\n }\n return numberOfDecimals;\n };\n NumericTextBox.prototype.formatNumber = function () {\n var numberOfDecimals = this.getNumberOfDecimals(this.value);\n return this.instance.getNumberFormat({\n maximumFractionDigits: numberOfDecimals,\n minimumFractionDigits: numberOfDecimals, useGrouping: false\n })(this.value);\n };\n NumericTextBox.prototype.trimValue = function (value) {\n if (value > this.max) {\n return this.max;\n }\n if (value < this.min) {\n return this.min;\n }\n return value;\n };\n NumericTextBox.prototype.roundNumber = function (value, precision) {\n var result = value;\n var decimals = precision || 0;\n var result1 = result.toString().split('e');\n result = Math.round(Number(result1[0] + 'e' + (result1[1] ? (Number(result1[1]) + decimals) : decimals)));\n var result2 = result.toString().split('e');\n result = Number(result2[0] + 'e' + (result2[1] ? (Number(result2[1]) - decimals) : -decimals));\n return Number(result.toFixed(decimals));\n };\n NumericTextBox.prototype.cancelEvent = function (event) {\n event.preventDefault();\n return false;\n };\n NumericTextBox.prototype.keyPressHandler = function (event) {\n if (!this.enabled || this.readonly) {\n return true;\n }\n if (!Browser.isDevice && Browser.info.version === '11.0' && event.keyCode === 13) {\n var parsedInput = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n this.updateValue(parsedInput, event);\n return true;\n }\n if (event.which === 0 || event.metaKey || event.ctrlKey || event.keyCode === 8 || event.keyCode === 13) {\n return true;\n }\n var currentChar = String.fromCharCode(event.which);\n var decimalSeparator = getValue('decimal', getNumericObject(this.locale));\n var isAlterNumPadDecimalChar = event.code === 'NumpadDecimal' && currentChar !== decimalSeparator;\n //EJ2-59813-replace the culture decimal separator value with numberpad decimal separator value when culture decimal separator and numberpad decimal separator are different\n if (isAlterNumPadDecimalChar) {\n currentChar = decimalSeparator;\n }\n var text = this.element.value;\n text = text.substring(0, this.element.selectionStart) + currentChar + text.substring(this.element.selectionEnd);\n if (!this.numericRegex().test(text)) {\n event.preventDefault();\n event.stopPropagation();\n return false;\n }\n else {\n //EJ2-59813-update the numberpad decimal separator and update the cursor position\n if (isAlterNumPadDecimalChar) {\n var start = this.element.selectionStart + 1;\n this.element.value = text;\n this.element.setSelectionRange(start, start);\n event.preventDefault();\n event.stopPropagation();\n }\n return true;\n }\n };\n NumericTextBox.prototype.numericRegex = function () {\n var numericObject = getNumericObject(this.locale);\n var decimalSeparator = getValue('decimal', numericObject);\n var fractionRule = '*';\n if (decimalSeparator === DECIMALSEPARATOR) {\n decimalSeparator = '\\\\' + decimalSeparator;\n }\n if (this.decimals === 0 && this.validateDecimalOnType) {\n return INTREGEXP;\n }\n if (this.decimals && this.validateDecimalOnType) {\n fractionRule = '{0,' + this.decimals + '}';\n }\n /* eslint-disable-next-line security/detect-non-literal-regexp */\n return new RegExp('^(-)?(((\\\\d+(' + decimalSeparator + '\\\\d' + fractionRule +\n ')?)|(' + decimalSeparator + '\\\\d' + fractionRule + ')))?$');\n };\n NumericTextBox.prototype.mouseWheel = function (event) {\n event.preventDefault();\n var delta;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var rawEvent = event;\n if (rawEvent.wheelDelta) {\n delta = rawEvent.wheelDelta / 120;\n }\n else if (rawEvent.detail) {\n delta = -rawEvent.detail / 3;\n }\n if (delta > 0) {\n this.action(INCREMENT, event);\n }\n else if (delta < 0) {\n this.action(DECREMENT, event);\n }\n this.cancelEvent(event);\n };\n NumericTextBox.prototype.focusHandler = function (event) {\n var _this = this;\n clearTimeout(selectionTimeOut);\n this.focusEventArgs = { event: event, value: this.value, container: this.container };\n this.trigger('focus', this.focusEventArgs);\n if (!this.enabled || this.readonly) {\n return;\n }\n this.isFocused = true;\n removeClass([this.container], ERROR);\n this.prevValue = this.value;\n if ((this.value || this.value === 0)) {\n var formatValue_1 = this.formatNumber();\n this.setElementValue(formatValue_1);\n if (!this.isPrevFocused) {\n if (!Browser.isDevice && Browser.info.version === '11.0') {\n this.element.setSelectionRange(0, formatValue_1.length);\n }\n else {\n var delay = (Browser.isDevice && Browser.isIos) ? 600 : 0;\n selectionTimeOut = setTimeout(function () {\n _this.element.setSelectionRange(0, formatValue_1.length);\n }, delay);\n }\n }\n }\n if (!Browser.isDevice) {\n EventHandler.add(this.element, 'mousewheel DOMMouseScroll', this.mouseWheel, this);\n }\n };\n NumericTextBox.prototype.focusOutHandler = function (event) {\n var _this = this;\n this.blurEventArgs = { event: event, value: this.value, container: this.container };\n this.trigger('blur', this.blurEventArgs);\n if (!this.enabled || this.readonly) {\n return;\n }\n if (this.isPrevFocused) {\n event.preventDefault();\n if (Browser.isDevice) {\n var value_1 = this.element.value;\n this.element.focus();\n this.isPrevFocused = false;\n var ele_1 = this.element;\n setTimeout(function () {\n _this.setElementValue(value_1, ele_1);\n }, 200);\n }\n }\n else {\n this.isFocused = false;\n if (!this.element.value.length) {\n this.setProperties({ value: null }, true);\n }\n var parsedInput = this.instance.getNumberParser({ format: 'n' })(this.element.value);\n this.updateValue(parsedInput);\n if (!Browser.isDevice) {\n EventHandler.remove(this.element, 'mousewheel DOMMouseScroll', this.mouseWheel);\n }\n }\n var formElement = closest(this.element, 'form');\n if (formElement) {\n var element = this.element.nextElementSibling;\n var focusEvent = document.createEvent('FocusEvent');\n focusEvent.initEvent('focusout', false, true);\n element.dispatchEvent(focusEvent);\n }\n };\n NumericTextBox.prototype.mouseDownOnSpinner = function (event) {\n var _this = this;\n if (this.isFocused) {\n this.isPrevFocused = true;\n event.preventDefault();\n }\n if (!this.getElementData(event)) {\n return;\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n var result = this.getElementData(event);\n var target = event.currentTarget;\n var action = (target.classList.contains(SPINUP)) ? INCREMENT : DECREMENT;\n EventHandler.add(target, 'mouseleave', this.mouseUpClick, this);\n this.timeOut = setInterval(function () {\n _this.isCalled = true;\n _this.action(action, event);\n }, 150);\n EventHandler.add(document, 'mouseup', this.mouseUpClick, this);\n };\n NumericTextBox.prototype.touchMoveOnSpinner = function (event) {\n var target;\n if (event.type === 'touchmove') {\n var touchEvent = event.touches;\n target = touchEvent.length && document.elementFromPoint(touchEvent[0].pageX, touchEvent[0].pageY);\n }\n else {\n target = document.elementFromPoint(event.clientX, event.clientY);\n }\n if (!(target.classList.contains(SPINICON))) {\n clearInterval(this.timeOut);\n }\n };\n NumericTextBox.prototype.mouseUpOnSpinner = function (event) {\n this.prevValue = this.value;\n if (this.isPrevFocused) {\n this.element.focus();\n if (!Browser.isDevice) {\n this.isPrevFocused = false;\n }\n }\n if (!Browser.isDevice) {\n event.preventDefault();\n }\n if (!this.getElementData(event)) {\n return;\n }\n var target = event.currentTarget;\n var action = (target.classList.contains(SPINUP)) ? INCREMENT : DECREMENT;\n EventHandler.remove(target, 'mouseleave', this.mouseUpClick);\n if (!this.isCalled) {\n this.action(action, event);\n }\n this.isCalled = false;\n EventHandler.remove(document, 'mouseup', this.mouseUpClick);\n var formElement = closest(this.element, 'form');\n if (formElement) {\n var element = this.element.nextElementSibling;\n var keyupEvent = document.createEvent('KeyboardEvent');\n keyupEvent.initEvent('keyup', false, true);\n element.dispatchEvent(keyupEvent);\n }\n };\n NumericTextBox.prototype.getElementData = function (event) {\n if ((event.which && event.which === 3) || (event.button && event.button === 2)\n || !this.enabled || this.readonly) {\n return false;\n }\n clearInterval(this.timeOut);\n return true;\n };\n NumericTextBox.prototype.floatLabelTypeUpdate = function () {\n Input.removeFloating(this.inputWrapper);\n var hiddenInput = this.hiddenInput;\n this.hiddenInput.remove();\n Input.addFloating(this.element, this.floatLabelType, this.placeholder, this.createElement);\n this.container.insertBefore(hiddenInput, this.container.childNodes[1]);\n };\n NumericTextBox.prototype.mouseUpClick = function (event) {\n event.stopPropagation();\n clearInterval(this.timeOut);\n this.isCalled = false;\n if (this.spinUp) {\n EventHandler.remove(this.spinUp, 'mouseleave', this.mouseUpClick);\n }\n if (this.spinDown) {\n EventHandler.remove(this.spinDown, 'mouseleave', this.mouseUpClick);\n }\n };\n /**\n * Increments the NumericTextBox value with the specified step value.\n *\n * @param {number} step - Specifies the value used to increment the NumericTextBox value.\n * if its not given then numeric value will be incremented based on the step property value.\n * @returns {void}\n */\n NumericTextBox.prototype.increment = function (step) {\n if (step === void 0) { step = this.step; }\n this.isInteract = false;\n this.changeValue(this.performAction(this.value, step, INCREMENT));\n this.raiseChangeEvent();\n };\n /**\n * Decrements the NumericTextBox value with specified step value.\n *\n * @param {number} step - Specifies the value used to decrement the NumericTextBox value.\n * if its not given then numeric value will be decremented based on the step property value.\n * @returns {void}\n */\n NumericTextBox.prototype.decrement = function (step) {\n if (step === void 0) { step = this.step; }\n this.isInteract = false;\n this.changeValue(this.performAction(this.value, step, DECREMENT));\n this.raiseChangeEvent();\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers.\n * Also it maintains the initial input element from the DOM.\n *\n * @method destroy\n * @returns {void}\n */\n NumericTextBox.prototype.destroy = function () {\n this.unwireEvents();\n if (this.showClearButton) {\n this.clearButton = document.getElementsByClassName('e-clear-icon')[0];\n }\n detach(this.hiddenInput);\n if (this.showSpinButton) {\n this.unwireSpinBtnEvents();\n detach(this.spinUp);\n detach(this.spinDown);\n }\n var attrArray = ['aria-labelledby', 'role', 'autocomplete', 'aria-readonly',\n 'aria-disabled', 'autocapitalize', 'spellcheck', 'aria-autocomplete', 'tabindex',\n 'aria-valuemin', 'aria-valuemax', 'aria-valuenow', 'aria-invalid'];\n for (var i = 0; i < attrArray.length; i++) {\n this.element.removeAttribute(attrArray[i]);\n }\n this.element.classList.remove('e-input');\n this.container.insertAdjacentElement('afterend', this.element);\n detach(this.container);\n this.spinUp = null;\n this.spinDown = null;\n this.container = null;\n this.hiddenInput = null;\n this.changeEventArgs = null;\n this.blurEventArgs = null;\n this.focusEventArgs = null;\n this.inputWrapper = null;\n Input.destroy({\n element: this.element,\n floatLabelType: this.floatLabelType,\n properties: this.properties\n }, this.clearButton);\n _super.prototype.destroy.call(this);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns */\n /**\n * Returns the value of NumericTextBox with the format applied to the NumericTextBox.\n *\n */\n NumericTextBox.prototype.getText = function () {\n return this.element.value;\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns */\n /**\n * Sets the focus to widget for interaction.\n *\n * @returns {void}\n */\n NumericTextBox.prototype.focusIn = function () {\n if (document.activeElement !== this.element && this.enabled) {\n this.element.focus();\n addClass([this.container], [NUMERIC_FOCUS]);\n }\n };\n /**\n * Remove the focus from widget, if the widget is in focus state.\n *\n * @returns {void}\n */\n NumericTextBox.prototype.focusOut = function () {\n if (document.activeElement === this.element && this.enabled) {\n this.element.blur();\n removeClass([this.container], [NUMERIC_FOCUS]);\n }\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the properties to be maintained in the persisted state.\n *\n * @returns {string}\n */\n NumericTextBox.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Calls internally if any of the property value is changed.\n *\n * @param {NumericTextBoxModel} newProp - Returns the dynamic property value of the component.\n * @param {NumericTextBoxModel} oldProp - Returns the previous property value of the component.\n * @returns {void}\n * @private\n */\n NumericTextBox.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'width':\n this.setElementWidth(newProp.width);\n Input.calculateWidth(this.element, this.container);\n break;\n case 'cssClass':\n this.updateCssClass(newProp.cssClass, oldProp.cssClass);\n break;\n case 'enabled':\n Input.setEnabled(newProp.enabled, this.element);\n this.bindClearEvent();\n break;\n case 'enableRtl':\n Input.setEnableRtl(newProp.enableRtl, [this.container]);\n break;\n case 'readonly':\n Input.setReadonly(newProp.readonly, this.element);\n if (this.readonly) {\n attributes(this.element, { 'aria-readonly': 'true' });\n }\n else {\n this.element.removeAttribute('aria-readonly');\n }\n break;\n case 'htmlAttributes':\n this.updateHTMLAttrToElement();\n this.updateHTMLAttrToWrapper();\n this.updateDataAttribute(true);\n this.checkAttributes(true);\n Input.validateInputType(this.container, this.element);\n break;\n case 'placeholder':\n Input.setPlaceholder(newProp.placeholder, this.element);\n Input.calculateWidth(this.element, this.container);\n break;\n case 'step':\n this.step = newProp.step;\n this.validateStep();\n break;\n case 'showSpinButton':\n this.updateSpinButton(newProp);\n break;\n case 'showClearButton':\n this.updateClearButton(newProp);\n break;\n case 'floatLabelType':\n this.floatLabelType = newProp.floatLabelType;\n this.floatLabelTypeUpdate();\n break;\n case 'value':\n this.isDynamicChange = (this.isAngular || this.isVue) && this.preventChange;\n this.updateValue(newProp.value);\n if (this.isDynamicChange) {\n this.preventChange = false;\n this.isDynamicChange = false;\n }\n break;\n case 'min':\n case 'max':\n setValue(prop, getValue(prop, newProp), this);\n this.validateMinMax();\n this.updateValue(this.value);\n break;\n case 'strictMode':\n this.strictMode = newProp.strictMode;\n this.updateValue(this.value);\n this.validateState();\n break;\n case 'locale':\n this.initCultureFunc();\n this.l10n.setLocale(this.locale);\n this.setSpinButton();\n this.updatePlaceholder();\n Input.setPlaceholder(this.placeholder, this.element);\n this.updateValue(this.value);\n break;\n case 'currency':\n {\n var propVal = getValue(prop, newProp);\n this.setProperties({ currencyCode: propVal }, true);\n this.updateCurrency(prop, propVal);\n }\n break;\n case 'currencyCode':\n {\n var propValue = getValue(prop, newProp);\n this.setProperties({ currency: propValue }, true);\n this.updateCurrency('currency', propValue);\n }\n break;\n case 'format':\n setValue(prop, getValue(prop, newProp), this);\n this.initCultureInfo();\n this.updateValue(this.value);\n break;\n case 'decimals':\n this.decimals = newProp.decimals;\n this.updateValue(this.value);\n }\n }\n };\n NumericTextBox.prototype.updateClearButton = function (newProp) {\n Input.setClearButton(newProp.showClearButton, this.element, this.inputWrapper, undefined, this.createElement);\n this.bindClearEvent();\n };\n NumericTextBox.prototype.updateSpinButton = function (newProp) {\n if (newProp.showSpinButton) {\n this.spinBtnCreation();\n }\n else {\n detach(this.spinUp);\n detach(this.spinDown);\n }\n };\n /**\n * Gets the component name\n *\n * @returns {string} Returns the component name.\n * @private\n */\n NumericTextBox.prototype.getModuleName = function () {\n return 'numerictextbox';\n };\n __decorate([\n Property('')\n ], NumericTextBox.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"value\", void 0);\n __decorate([\n Property(-(Number.MAX_VALUE))\n ], NumericTextBox.prototype, \"min\", void 0);\n __decorate([\n Property(Number.MAX_VALUE)\n ], NumericTextBox.prototype, \"max\", void 0);\n __decorate([\n Property(1)\n ], NumericTextBox.prototype, \"step\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"placeholder\", void 0);\n __decorate([\n Property({})\n ], NumericTextBox.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(true)\n ], NumericTextBox.prototype, \"showSpinButton\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"readonly\", void 0);\n __decorate([\n Property(true)\n ], NumericTextBox.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property('n2')\n ], NumericTextBox.prototype, \"format\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"decimals\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"currency\", void 0);\n __decorate([\n Property(null)\n ], NumericTextBox.prototype, \"currencyCode\", void 0);\n __decorate([\n Property(true)\n ], NumericTextBox.prototype, \"strictMode\", void 0);\n __decorate([\n Property(false)\n ], NumericTextBox.prototype, \"validateDecimalOnType\", void 0);\n __decorate([\n Property('Never')\n ], NumericTextBox.prototype, \"floatLabelType\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"focus\", void 0);\n __decorate([\n Event()\n ], NumericTextBox.prototype, \"blur\", void 0);\n NumericTextBox = __decorate([\n NotifyPropertyChanges\n ], NumericTextBox);\n return NumericTextBox;\n}(Component));\nexport { NumericTextBox };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, EventHandler, Property, Event, Complex, Collection } from '@syncfusion/ej2-base';\nimport { L10n, Internationalization } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty } from '@syncfusion/ej2-base';\nimport { attributes, addClass, removeClass, setStyleAttribute, detach, closest } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, Browser, SanitizeHtmlHelper, initializeCSPTemplate } from '@syncfusion/ej2-base';\nimport { Tooltip, getZindexPartial } from '@syncfusion/ej2-popups';\n/**\n * Configures the ticks data of the Slider.\n */\nvar TicksData = /** @class */ (function (_super) {\n __extends(TicksData, _super);\n function TicksData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('None')\n ], TicksData.prototype, \"placement\", void 0);\n __decorate([\n Property(10)\n ], TicksData.prototype, \"largeStep\", void 0);\n __decorate([\n Property(1)\n ], TicksData.prototype, \"smallStep\", void 0);\n __decorate([\n Property(false)\n ], TicksData.prototype, \"showSmallTicks\", void 0);\n __decorate([\n Property(null)\n ], TicksData.prototype, \"format\", void 0);\n return TicksData;\n}(ChildProperty));\nexport { TicksData };\n/**\n * It illustrates the color track data in slider.\n * {% codeBlock src='slider/colorrange/index.md' %}{% endcodeBlock %}\n */\nvar ColorRangeData = /** @class */ (function (_super) {\n __extends(ColorRangeData, _super);\n function ColorRangeData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ColorRangeData.prototype, \"color\", void 0);\n __decorate([\n Property(null)\n ], ColorRangeData.prototype, \"start\", void 0);\n __decorate([\n Property(null)\n ], ColorRangeData.prototype, \"end\", void 0);\n return ColorRangeData;\n}(ChildProperty));\nexport { ColorRangeData };\n/**\n * It illustrates the limit data in slider.\n * {% codeBlock src='slider/limits/index.md' %}{% endcodeBlock %}\n */\nvar LimitData = /** @class */ (function (_super) {\n __extends(LimitData, _super);\n function LimitData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], LimitData.prototype, \"enabled\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"minStart\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"minEnd\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"maxStart\", void 0);\n __decorate([\n Property(null)\n ], LimitData.prototype, \"maxEnd\", void 0);\n __decorate([\n Property(false)\n ], LimitData.prototype, \"startHandleFixed\", void 0);\n __decorate([\n Property(false)\n ], LimitData.prototype, \"endHandleFixed\", void 0);\n return LimitData;\n}(ChildProperty));\nexport { LimitData };\n/**\n * It illustrates the tooltip data in slider.\n */\nvar TooltipData = /** @class */ (function (_super) {\n __extends(TooltipData, _super);\n function TooltipData() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], TooltipData.prototype, \"cssClass\", void 0);\n __decorate([\n Property('Before')\n ], TooltipData.prototype, \"placement\", void 0);\n __decorate([\n Property('Focus')\n ], TooltipData.prototype, \"showOn\", void 0);\n __decorate([\n Property(false)\n ], TooltipData.prototype, \"isVisible\", void 0);\n __decorate([\n Property(null)\n ], TooltipData.prototype, \"format\", void 0);\n return TooltipData;\n}(ChildProperty));\nexport { TooltipData };\nvar bootstrapTooltipOffset = 6;\nvar bootstrap4TooltipOffset = 3;\nvar classNames = {\n root: 'e-slider',\n rtl: 'e-rtl',\n sliderHiddenInput: 'e-slider-input',\n controlWrapper: 'e-control-wrapper',\n sliderHandle: 'e-handle',\n rangeBar: 'e-range',\n sliderButton: 'e-slider-button',\n firstButton: 'e-first-button',\n secondButton: 'e-second-button',\n scale: 'e-scale',\n tick: 'e-tick',\n large: 'e-large',\n tickValue: 'e-tick-value',\n sliderTooltip: 'e-slider-tooltip',\n sliderHover: 'e-slider-hover',\n sliderFirstHandle: 'e-handle-first',\n sliderSecondHandle: 'e-handle-second',\n sliderDisabled: 'e-disabled',\n sliderContainer: 'e-slider-container',\n horizontalTooltipBefore: 'e-slider-horizontal-before',\n horizontalTooltipAfter: 'e-slider-horizontal-after',\n verticalTooltipBefore: 'e-slider-vertical-before',\n verticalTooltipAfter: 'e-slider-vertical-after',\n materialTooltip: 'e-material-tooltip',\n materialTooltipOpen: 'e-material-tooltip-open',\n materialTooltipActive: 'e-tooltip-active',\n materialSlider: 'e-material-slider',\n sliderTrack: 'e-slider-track',\n sliderHorizantalColor: 'e-slider-horizantal-color',\n sliderVerticalColor: 'e-slider-vertical-color',\n sliderHandleFocused: 'e-handle-focused',\n verticalSlider: 'e-vertical',\n horizontalSlider: 'e-horizontal',\n sliderHandleStart: 'e-handle-start',\n sliderTooltipStart: 'e-material-tooltip-start',\n sliderTabHandle: 'e-tab-handle',\n sliderButtonIcon: 'e-button-icon',\n sliderSmallSize: 'e-small-size',\n sliderTickPosition: 'e-tick-pos',\n sliderFirstTick: 'e-first-tick',\n sliderLastTick: 'e-last-tick',\n sliderButtonClass: 'e-slider-btn',\n sliderTooltipWrapper: 'e-tooltip-wrap',\n sliderTabTrack: 'e-tab-track',\n sliderTabRange: 'e-tab-range',\n sliderActiveHandle: 'e-handle-active',\n sliderMaterialHandle: 'e-material-handle',\n sliderMaterialRange: 'e-material-range',\n sliderMaterialDefault: 'e-material-default',\n materialTooltipShow: 'e-material-tooltip-show',\n materialTooltipHide: 'e-material-tooltip-hide',\n readonly: 'e-read-only',\n limits: 'e-limits',\n limitBarDefault: 'e-limit-bar',\n limitBarFirst: 'e-limit-first',\n limitBarSecond: 'e-limit-second',\n dragHorizontal: 'e-drag-horizontal',\n dragVertical: 'e-drag-vertical'\n};\n/**\n * The Slider component allows the user to select a value or range\n * of values in-between a min and max range, by dragging the handle over the slider bar.\n * ```html\n *
    \n * ```\n * ```typescript\n * \n * ```\n */\nvar Slider = /** @class */ (function (_super) {\n __extends(Slider, _super);\n function Slider(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.horDir = 'left';\n _this.verDir = 'bottom';\n _this.transition = {\n handle: 'left .4s cubic-bezier(.25, .8, .25, 1), right .4s cubic-bezier(.25, .8, .25, 1), ' +\n 'top .4s cubic-bezier(.25, .8, .25, 1) , bottom .4s cubic-bezier(.25, .8, .25, 1)',\n rangeBar: 'all .4s cubic-bezier(.25, .8, .25, 1)'\n };\n _this.transitionOnMaterialTooltip = {\n handle: 'left 1ms ease-out, right 1ms ease-out, bottom 1ms ease-out, top 1ms ease-out',\n rangeBar: 'left 1ms ease-out, right 1ms ease-out, bottom 1ms ease-out, width 1ms ease-out, height 1ms ease-out'\n };\n _this.scaleTransform = 'transform .4s cubic-bezier(.25, .8, .25, 1)';\n _this.customAriaText = null;\n _this.drag = true;\n _this.isDragComplete = false;\n _this.initialTooltip = true;\n return _this;\n }\n Slider.prototype.preRender = function () {\n // eslint-disable-next-line\n var localeText = { incrementTitle: 'Increase', decrementTitle: 'Decrease' };\n this.l10n = new L10n('slider', localeText, this.locale);\n this.isElementFocused = false;\n this.tickElementCollection = [];\n this.tooltipFormatInfo = {};\n this.ticksFormatInfo = {};\n this.initCultureInfo();\n this.initCultureFunc();\n this.formChecker();\n };\n Slider.prototype.formChecker = function () {\n var formElement = closest(this.element, 'form');\n if (formElement) {\n this.isForm = true;\n // this condition needs to be checked, if the slider is going to be refreshed by `refresh()`\n // then we need to revert the slider `value` back to `formResetValue` to preserve the initial value\n if (!isNullOrUndefined(this.formResetValue)) {\n this.setProperties({ 'value': this.formResetValue }, true);\n }\n this.formResetValue = this.value;\n if (this.type === 'Range' &&\n (isNullOrUndefined(this.formResetValue) || typeof (this.formResetValue) !== 'object')) {\n this.formResetValue = [parseFloat(formatUnit(this.min)), parseFloat(formatUnit(this.max))];\n }\n else if (isNullOrUndefined(this.formResetValue)) {\n this.formResetValue = parseFloat(formatUnit(this.min));\n }\n this.formElement = formElement;\n }\n else {\n this.isForm = false;\n }\n };\n Slider.prototype.initCultureFunc = function () {\n this.internationalization = new Internationalization(this.locale);\n };\n Slider.prototype.initCultureInfo = function () {\n this.tooltipFormatInfo.format = (!isNullOrUndefined(this.tooltip.format)) ? this.tooltip.format : null;\n this.ticksFormatInfo.format = (!isNullOrUndefined(this.ticks.format)) ? this.ticks.format : null;\n };\n Slider.prototype.formatString = function (value, formatInfo) {\n var formatValue = null;\n var formatString = null;\n if ((value || value === 0)) {\n formatValue = this.formatNumber(value);\n var numberOfDecimals = this.numberOfDecimals(value);\n formatString = this.internationalization.getNumberFormat(formatInfo)(this.makeRoundNumber(value, numberOfDecimals));\n }\n return { elementVal: formatValue, formatString: formatString };\n };\n Slider.prototype.formatNumber = function (value) {\n var numberOfDecimals = this.numberOfDecimals(value);\n return this.internationalization.getNumberFormat({\n maximumFractionDigits: numberOfDecimals,\n minimumFractionDigits: numberOfDecimals, useGrouping: false\n })(value);\n };\n Slider.prototype.numberOfDecimals = function (value) {\n var decimalPart = value.toString().split('.')[1];\n var numberOfDecimals = !decimalPart || !decimalPart.length ? 0 : decimalPart.length;\n return numberOfDecimals;\n };\n Slider.prototype.makeRoundNumber = function (value, precision) {\n var decimals = precision || 0;\n return Number(value.toFixed(decimals));\n };\n Slider.prototype.fractionalToInteger = function (value) {\n value = (this.numberOfDecimals(value) === 0) ? Number(value).toFixed(this.noOfDecimals) : value;\n var tens = 1;\n for (var i = 0; i < this.noOfDecimals; i++) {\n tens *= 10;\n }\n value = Number((value * tens).toFixed(0));\n return value;\n };\n /**\n * To Initialize the control rendering\n *\n * @private\n */\n Slider.prototype.render = function () {\n var _this = this;\n this.initialize();\n this.initRender();\n this.wireEvents();\n this.setZindex();\n this.renderComplete();\n if (this.element.tagName === 'EJS-SLIDER') {\n if (this.getTheme(this.sliderContainer) == 'none') {\n setTimeout(function () {\n _this.refresh();\n }, 0);\n }\n }\n };\n Slider.prototype.initialize = function () {\n addClass([this.element], classNames.root);\n this.setCSSClass();\n };\n Slider.prototype.setElementWidth = function (width) {\n if (!isNullOrUndefined(width) && !isNullOrUndefined(this.sliderContainer)) {\n if (typeof width === 'number') {\n this.sliderContainer.style.width = formatUnit(width);\n }\n else if (typeof width === 'string') {\n this.sliderContainer.style.width = (width.match(/px|%|em/)) ? (width) : (formatUnit(width));\n }\n }\n };\n Slider.prototype.setCSSClass = function (oldCSSClass) {\n if (oldCSSClass) {\n removeClass([this.element], oldCSSClass.split(' '));\n }\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n };\n Slider.prototype.setEnabled = function () {\n if (!this.enabled) {\n addClass([this.sliderContainer], [classNames.sliderDisabled]);\n if (this.tooltip.isVisible && this.tooltipElement && this.tooltip.showOn === 'Always') {\n this.tooltipElement.classList.add(classNames.sliderDisabled);\n }\n this.unwireEvents();\n }\n else {\n removeClass([this.sliderContainer], [classNames.sliderDisabled]);\n if (this.tooltip.isVisible && this.tooltipElement && this.tooltip.showOn === 'Always') {\n this.tooltipElement.classList.remove(classNames.sliderDisabled);\n }\n this.wireEvents();\n }\n };\n Slider.prototype.getTheme = function (container) {\n var theme = window.getComputedStyle(container, ':after').getPropertyValue('content');\n return theme.replace(/['\"]+/g, '');\n };\n /**\n * Initialize the rendering\n *\n * @private\n */\n Slider.prototype.initRender = function () {\n this.sliderContainer = this.createElement('div', { className: classNames.sliderContainer + ' ' + classNames.controlWrapper });\n this.element.parentNode.insertBefore(this.sliderContainer, this.element);\n this.sliderContainer.appendChild(this.element);\n this.sliderTrack = this.createElement('div', { className: classNames.sliderTrack });\n this.element.appendChild(this.sliderTrack);\n this.setElementWidth(this.width);\n this.element.tabIndex = -1;\n this.getThemeInitialization();\n this.setHandler();\n this.createRangeBar();\n if (this.limits.enabled) {\n this.createLimitBar();\n }\n this.setOrientClass();\n this.hiddenInput = (this.createElement('input', {\n attrs: {\n type: 'hidden', value: (isNullOrUndefined(this.value) ? this.min.toString() : this.value.toString()),\n name: this.element.getAttribute('name') || this.element.getAttribute('id') ||\n '_' + (Math.random() * 1000).toFixed(0) + 'slider', class: classNames.sliderHiddenInput\n }\n }));\n this.hiddenInput.tabIndex = -1;\n this.sliderContainer.appendChild(this.hiddenInput);\n if (this.showButtons) {\n this.setButtons();\n }\n this.setEnableRTL();\n if (this.type === 'Range') {\n this.rangeValueUpdate();\n }\n else {\n this.value = isNullOrUndefined(this.value) ? parseFloat(formatUnit(this.min.toString())) : this.value;\n }\n this.previousVal = this.type !== 'Range' ? this.checkHandleValue(parseFloat(formatUnit(this.value.toString()))) :\n [this.checkHandleValue(parseFloat(formatUnit(this.value[0].toString()))),\n this.checkHandleValue(parseFloat(formatUnit(this.value[1].toString())))];\n this.previousChanged = this.previousVal;\n if (!isNullOrUndefined(this.element.hasAttribute('name'))) {\n this.element.removeAttribute('name');\n }\n this.setValue();\n if (this.limits.enabled) {\n this.setLimitBar();\n }\n if (this.ticks.placement !== 'None') {\n this.renderScale();\n }\n if (this.tooltip.isVisible) {\n this.renderTooltip();\n }\n if (!this.enabled) {\n addClass([this.sliderContainer], [classNames.sliderDisabled]);\n }\n else {\n removeClass([this.sliderContainer], [classNames.sliderDisabled]);\n }\n if (this.readonly) {\n addClass([this.sliderContainer], [classNames.readonly]);\n }\n else {\n removeClass([this.sliderContainer], [classNames.readonly]);\n }\n };\n Slider.prototype.getThemeInitialization = function () {\n this.isMaterial = this.getTheme(this.sliderContainer) === 'material'\n || this.getTheme(this.sliderContainer) === 'material-dark';\n this.isMaterial3 = this.getTheme(this.sliderContainer) === 'Material3'\n || this.getTheme(this.sliderContainer) === 'Material3-dark';\n this.isBootstrap = this.getTheme(this.sliderContainer) === 'bootstrap'\n || this.getTheme(this.sliderContainer) === 'bootstrap-dark';\n this.isBootstrap4 = this.getTheme(this.sliderContainer) === 'bootstrap4';\n this.isTailwind = this.getTheme(this.sliderContainer) === 'tailwind' || this.getTheme(this.sliderContainer) === 'tailwind-dark';\n this.isBootstrap5 = this.getTheme(this.sliderContainer) === 'bootstrap5';\n this.isFluent = this.getTheme(this.sliderContainer) === 'FluentUI';\n this.isMaterialTooltip = (this.isMaterial || this.isMaterial3) && this.type !== 'Range' && this.tooltip.isVisible;\n };\n Slider.prototype.createRangeBar = function () {\n if (this.type !== 'Default') {\n this.rangeBar = (this.createElement('div', { attrs: { class: classNames.rangeBar } }));\n this.element.appendChild(this.rangeBar);\n if (this.drag && this.type === 'Range') {\n if (this.orientation === 'Horizontal') {\n this.rangeBar.classList.add(classNames.dragHorizontal);\n }\n else {\n this.rangeBar.classList.add(classNames.dragVertical);\n }\n }\n }\n };\n Slider.prototype.createLimitBar = function () {\n var firstElementClassName = this.type !== 'Range' ? classNames.limitBarDefault :\n classNames.limitBarFirst;\n firstElementClassName += ' ' + classNames.limits;\n this.limitBarFirst = (this.createElement('div', {\n attrs: { class: firstElementClassName }\n }));\n this.element.appendChild(this.limitBarFirst);\n if (this.type === 'Range') {\n this.limitBarSecond = (this.createElement('div', {\n attrs: {\n class: classNames.limitBarSecond + ' ' + classNames.limits\n }\n }));\n this.element.appendChild(this.limitBarSecond);\n }\n };\n Slider.prototype.setOrientClass = function () {\n if (this.orientation !== 'Vertical') {\n this.sliderContainer.classList.remove(classNames.verticalSlider);\n this.sliderContainer.classList.add(classNames.horizontalSlider);\n this.firstHandle.setAttribute('aria-orientation', 'horizontal');\n if (this.type === 'Range') {\n this.secondHandle.setAttribute('aria-orientation', 'horizontal');\n }\n }\n else {\n this.sliderContainer.classList.remove(classNames.horizontalSlider);\n this.sliderContainer.classList.add(classNames.verticalSlider);\n this.firstHandle.setAttribute('aria-orientation', 'vertical');\n if (this.type === 'Range') {\n this.secondHandle.setAttribute('aria-orientation', 'vertical');\n }\n }\n };\n Slider.prototype.setAriaAttributes = function (element) {\n var _this = this;\n var min = this.min;\n var max = this.max;\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n min = this.customValues[0];\n max = this.customValues[this.customValues.length - 1];\n }\n if (this.type !== 'Range') {\n attributes(element, {\n 'aria-valuemin': min.toString(), 'aria-valuemax': max.toString()\n });\n }\n else {\n var range = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 ?\n [[min.toString(), (this.customValues[this.value[1]]).toString()],\n [(this.customValues[this.value[0]]).toString(), max.toString()]] :\n [[min.toString(), this.value[1].toString()], [this.value[0].toString(), max.toString()]];\n range.forEach(function (range, index) {\n var element = index === 0 ? _this.firstHandle : _this.secondHandle;\n if (element) {\n attributes(element, {\n 'aria-valuemin': range[0], 'aria-valuemax': range[1]\n });\n }\n });\n }\n };\n Slider.prototype.createSecondHandle = function () {\n this.secondHandle = this.createElement('div', {\n attrs: {\n class: classNames.sliderHandle, 'role': 'slider', tabIndex: '0', 'aria-label': 'slider'\n }\n });\n this.secondHandle.classList.add(classNames.sliderSecondHandle);\n this.element.appendChild(this.secondHandle);\n };\n Slider.prototype.createFirstHandle = function () {\n this.firstHandle = this.createElement('div', {\n attrs: {\n class: classNames.sliderHandle, 'role': 'slider', tabIndex: '0', 'aria-label': 'slider'\n }\n });\n this.firstHandle.classList.add(classNames.sliderFirstHandle);\n this.element.appendChild(this.firstHandle);\n if (this.isMaterialTooltip) {\n this.materialHandle = this.createElement('div', {\n attrs: {\n class: classNames.sliderHandle + ' ' +\n classNames.sliderMaterialHandle\n }\n });\n this.element.appendChild(this.materialHandle);\n }\n };\n Slider.prototype.wireFirstHandleEvt = function (destroy) {\n if (!destroy) {\n EventHandler.add(this.firstHandle, 'mousedown touchstart', this.handleFocus, this);\n EventHandler.add(this.firstHandle, 'transitionend', this.transitionEnd, this);\n EventHandler.add(this.firstHandle, 'mouseenter touchenter', this.handleOver, this);\n EventHandler.add(this.firstHandle, 'mouseleave touchend', this.handleLeave, this);\n }\n else {\n EventHandler.remove(this.firstHandle, 'mousedown touchstart', this.handleFocus);\n EventHandler.remove(this.firstHandle, 'transitionend', this.transitionEnd);\n EventHandler.remove(this.firstHandle, 'mouseenter touchenter', this.handleOver);\n EventHandler.remove(this.firstHandle, 'mouseleave touchend', this.handleLeave);\n }\n };\n Slider.prototype.wireSecondHandleEvt = function (destroy) {\n if (!destroy) {\n EventHandler.add(this.secondHandle, 'mousedown touchstart', this.handleFocus, this);\n EventHandler.add(this.secondHandle, 'transitionend', this.transitionEnd, this);\n EventHandler.add(this.secondHandle, 'mouseenter touchenter', this.handleOver, this);\n EventHandler.add(this.secondHandle, 'mouseleave touchend', this.handleLeave, this);\n }\n else {\n EventHandler.remove(this.secondHandle, 'mousedown touchstart', this.handleFocus);\n EventHandler.remove(this.secondHandle, 'transitionend', this.transitionEnd);\n EventHandler.remove(this.secondHandle, 'mouseenter touchenter', this.handleOver);\n EventHandler.remove(this.secondHandle, 'mouseleave touchend', this.handleLeave);\n }\n };\n Slider.prototype.handleStart = function () {\n if (this.type !== 'Range') {\n this.firstHandle.classList[this.handlePos1 === 0 ? 'add' : 'remove'](classNames.sliderHandleStart);\n if (this.isMaterialTooltip) {\n this.materialHandle.classList[this.handlePos1 === 0 ? 'add' : 'remove'](classNames.sliderHandleStart);\n if (this.tooltipElement) {\n this.tooltipElement.classList[this.handlePos1 === 0 ? 'add' : 'remove'](classNames.sliderTooltipStart);\n }\n }\n }\n };\n Slider.prototype.transitionEnd = function (e) {\n if (e.propertyName !== 'transform') {\n this.handleStart();\n if (!this.enableAnimation) {\n this.getHandle().style.transition = 'none';\n }\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n if ((this.isMaterial || this.isMaterial3) && this.tooltip.isVisible && this.type === 'Default') {\n this.tooltipElement.style.transition = this.transition.handle;\n }\n this.tooltipToggle(this.getHandle());\n this.closeTooltip();\n }\n };\n Slider.prototype.handleFocusOut = function () {\n if (this.firstHandle.classList.contains(classNames.sliderHandleFocused)) {\n this.firstHandle.classList.remove(classNames.sliderHandleFocused);\n }\n if (this.type === 'Range') {\n if (this.secondHandle.classList.contains(classNames.sliderHandleFocused)) {\n this.secondHandle.classList.remove(classNames.sliderHandleFocused);\n }\n }\n };\n Slider.prototype.handleFocus = function (e) {\n this.focusSliderElement();\n this.sliderBarClick(e);\n if (e.currentTarget === this.firstHandle) {\n this.firstHandle.classList.add(classNames.sliderHandleFocused);\n this.firstHandle.classList.add(classNames.sliderTabHandle);\n }\n else {\n this.secondHandle.classList.add(classNames.sliderHandleFocused);\n this.secondHandle.classList.add(classNames.sliderTabHandle);\n }\n EventHandler.add(document, 'mousemove touchmove', this.sliderBarMove, this);\n EventHandler.add(document, 'mouseup touchend', this.sliderBarUp, this);\n };\n Slider.prototype.handleOver = function (e) {\n if (this.tooltip.isVisible && this.tooltip.showOn === 'Hover') {\n this.tooltipToggle(e.currentTarget);\n }\n if (this.type === 'Default') {\n this.tooltipToggle(this.getHandle());\n }\n };\n Slider.prototype.handleLeave = function (e) {\n if (this.tooltip.isVisible && this.tooltip.showOn === 'Hover' &&\n !e.currentTarget.classList.contains(classNames.sliderHandleFocused) &&\n !e.currentTarget.classList.contains(classNames.sliderTabHandle)) {\n this.closeTooltip();\n }\n };\n Slider.prototype.setHandler = function () {\n this.createFirstHandle();\n if (this.type === 'Range') {\n this.createSecondHandle();\n }\n };\n Slider.prototype.setEnableRTL = function () {\n this.enableRtl && this.orientation !== 'Vertical' ? addClass([this.sliderContainer], classNames.rtl) :\n removeClass([this.sliderContainer], classNames.rtl);\n var preDir = (this.orientation !== 'Vertical') ? this.horDir : this.verDir;\n if (this.enableRtl) {\n this.horDir = 'right';\n this.verDir = 'bottom';\n }\n else {\n this.horDir = 'left';\n this.verDir = 'bottom';\n }\n var currDir = (this.orientation !== 'Vertical') ? this.horDir : this.verDir;\n if (preDir !== currDir) {\n if (this.orientation === 'Horizontal') {\n setStyleAttribute(this.firstHandle, { 'right': '', 'left': 'auto' });\n if (this.type === 'Range') {\n setStyleAttribute(this.secondHandle, { 'top': '', 'left': 'auto' });\n }\n }\n }\n this.setBarColor();\n };\n Slider.prototype.tooltipValue = function () {\n var _this = this;\n var text;\n var args = {\n value: this.value,\n text: ''\n };\n if (this.initialTooltip) {\n this.initialTooltip = false;\n this.setTooltipContent();\n args.text = text = (typeof (this.tooltipObj.content) === 'function' ? this.tooltipObj.content() : this.tooltipObj.content);\n this.trigger('tooltipChange', args, function (observedArgs) {\n _this.addTooltipClass(observedArgs.text);\n if (text !== observedArgs.text) {\n _this.customAriaText = observedArgs.text;\n if (_this.enableHtmlSanitizer) {\n observedArgs.text = SanitizeHtmlHelper.sanitize(observedArgs.text.toString());\n }\n else {\n observedArgs.text = observedArgs.text.toString();\n }\n var contentTemp = function () {\n return observedArgs.text;\n };\n _this.tooltipObj.content = initializeCSPTemplate(contentTemp);\n _this.setAriaAttrValue(_this.firstHandle);\n if (_this.type === 'Range') {\n _this.setAriaAttrValue(_this.secondHandle);\n }\n }\n });\n if (this.isMaterialTooltip) {\n this.setPreviousVal('change', this.value);\n }\n }\n };\n Slider.prototype.setTooltipContent = function () {\n var content;\n content = this.formatContent(this.tooltipFormatInfo, false);\n var contentTemp = function () {\n return content;\n };\n this.tooltipObj.content = initializeCSPTemplate(contentTemp);\n };\n Slider.prototype.formatContent = function (formatInfo, ariaContent) {\n var content = '';\n var handle1 = this.handleVal1;\n var handle2 = this.handleVal2;\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n handle1 = this.customValues[this.handleVal1];\n handle2 = this.customValues[this.handleVal2];\n }\n if (!ariaContent) {\n if (this.type === 'Range') {\n if (this.enableRtl && this.orientation !== 'Vertical') {\n content = (!isNullOrUndefined(formatInfo.format)) ? (this.formatString(handle2, formatInfo)\n .formatString + ' - ' + this.formatString(handle1, formatInfo).formatString) :\n (handle2.toString() + ' - ' + handle1.toString());\n }\n else {\n content = (!isNullOrUndefined(formatInfo.format)) ? (this.formatString(handle1, formatInfo)\n .formatString + ' - ' + this.formatString(handle2, formatInfo).formatString) :\n (handle1.toString() + ' - ' + handle2.toString());\n }\n }\n else {\n if (!isNullOrUndefined(handle1)) {\n content = (!isNullOrUndefined(formatInfo.format)) ?\n this.formatString(handle1, formatInfo).formatString : handle1.toString();\n }\n }\n return content;\n }\n else {\n if (this.type === 'Range') {\n if (this.enableRtl && this.orientation !== 'Vertical') {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n (this.formatString(handle2, formatInfo).elementVal + ' - ' +\n this.formatString(handle1, formatInfo).elementVal) :\n (handle2.toString() + ' - ' + handle1.toString());\n }\n else {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n (this.formatString(handle1, formatInfo).elementVal + ' - ' +\n this.formatString(handle2, formatInfo).elementVal) :\n (handle1.toString() + ' - ' + handle2.toString());\n }\n }\n else {\n if (!isNullOrUndefined(handle1)) {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n this.formatString(handle1, formatInfo).elementVal : handle1.toString();\n }\n }\n return content;\n }\n };\n Slider.prototype.addTooltipClass = function (content) {\n if (this.isMaterialTooltip) {\n var count = content.toString().length;\n if (!this.tooltipElement) {\n var cssClass = count > 4 ? classNames.sliderMaterialRange : classNames.sliderMaterialDefault;\n this.tooltipObj.cssClass = classNames.sliderTooltip + ' ' + cssClass;\n }\n else {\n var cssClass = count > 4 ?\n { oldCss: classNames.sliderMaterialDefault, newCss: classNames.sliderMaterialRange } :\n { oldCss: classNames.sliderMaterialRange, newCss: classNames.sliderMaterialDefault };\n this.tooltipElement.classList.remove(cssClass.oldCss);\n if (!this.tooltipElement.classList.contains(cssClass.newCss)) {\n this.tooltipElement.classList.add(cssClass.newCss);\n this.tooltipElement.style.transform = count > 4 ? 'scale(1)' :\n this.getTooltipTransformProperties(this.previousTooltipClass).rotate;\n }\n }\n }\n };\n Slider.prototype.tooltipPlacement = function () {\n return this.orientation === 'Horizontal' ? (this.tooltip.placement === 'Before' ? 'TopCenter' : 'BottomCenter') :\n (this.tooltip.placement === 'Before' ? 'LeftCenter' : 'RightCenter');\n };\n Slider.prototype.tooltipBeforeOpen = function (args) {\n this.tooltipElement = args.element;\n if (this.tooltip.cssClass) {\n addClass([this.tooltipElement], this.tooltip.cssClass.split(' ').filter(function (css) { return css; }));\n }\n args.target.removeAttribute('aria-describedby');\n if (this.isMaterialTooltip) {\n this.tooltipElement.firstElementChild.classList.add(classNames.materialTooltipHide);\n this.handleStart();\n this.setTooltipTransform();\n }\n };\n Slider.prototype.tooltipCollision = function (position) {\n if (this.isBootstrap || this.isBootstrap4 || ((this.isMaterial || this.isMaterial3) && !this.isMaterialTooltip)) {\n var tooltipOffsetValue = this.isBootstrap4 ? bootstrap4TooltipOffset : bootstrapTooltipOffset;\n switch (position) {\n case 'TopCenter':\n this.tooltipObj.setProperties({ 'offsetY': -(tooltipOffsetValue) }, false);\n break;\n case 'BottomCenter':\n this.tooltipObj.setProperties({ 'offsetY': tooltipOffsetValue }, false);\n break;\n case 'LeftCenter':\n this.tooltipObj.setProperties({ 'offsetX': -(tooltipOffsetValue) }, false);\n break;\n case 'RightCenter':\n this.tooltipObj.setProperties({ 'offsetX': tooltipOffsetValue }, false);\n break;\n }\n }\n };\n Slider.prototype.materialTooltipEventCallBack = function (event) {\n this.sliderBarClick(event);\n EventHandler.add(document, 'mousemove touchmove', this.sliderBarMove, this);\n EventHandler.add(document, 'mouseup touchend', this.sliderBarUp, this);\n };\n Slider.prototype.wireMaterialTooltipEvent = function (destroy) {\n if (this.isMaterialTooltip) {\n if (!destroy) {\n EventHandler.add(this.tooltipElement, 'mousedown touchstart', this.materialTooltipEventCallBack, this);\n }\n else {\n EventHandler.remove(this.tooltipElement, 'mousedown touchstart', this.materialTooltipEventCallBack);\n }\n }\n };\n Slider.prototype.tooltipPositionCalculation = function (position) {\n var cssClass;\n switch (position) {\n case 'TopCenter':\n cssClass = classNames.horizontalTooltipBefore;\n break;\n case 'BottomCenter':\n cssClass = classNames.horizontalTooltipAfter;\n break;\n case 'LeftCenter':\n cssClass = classNames.verticalTooltipBefore;\n break;\n case 'RightCenter':\n cssClass = classNames.verticalTooltipAfter;\n break;\n }\n return cssClass;\n };\n Slider.prototype.getTooltipTransformProperties = function (className) {\n var transformProperties;\n if (this.tooltipElement) {\n var position = this.orientation === 'Horizontal' ?\n ((this.tooltipElement.clientHeight + 14) - (this.tooltipElement.clientHeight / 2)) :\n ((this.tooltipElement.clientWidth + 14) - (this.tooltipElement.clientWidth / 2));\n transformProperties = this.orientation === 'Horizontal' ?\n (className === classNames.horizontalTooltipBefore ? { rotate: 'rotate(45deg)', translate: \"translateY(\" + position + \"px)\" } :\n { rotate: 'rotate(225deg)', translate: \"translateY(\" + -(position) + \"px)\" }) :\n (className === classNames.verticalTooltipBefore ? { rotate: 'rotate(-45deg)', translate: \"translateX(\" + position + \"px)\" } :\n { rotate: 'rotate(-225deg)', translate: \"translateX(\" + (-position) + \"px)\" });\n }\n return transformProperties;\n };\n Slider.prototype.openMaterialTooltip = function () {\n var _this = this;\n if (this.isMaterialTooltip) {\n this.refreshTooltip(this.firstHandle);\n var tooltipContentElement = this.tooltipElement.firstElementChild;\n tooltipContentElement.classList.remove(classNames.materialTooltipHide);\n tooltipContentElement.classList.add(classNames.materialTooltipShow);\n this.firstHandle.style.cursor = 'default';\n this.tooltipElement.style.transition = this.scaleTransform;\n this.tooltipElement.classList.add(classNames.materialTooltipOpen);\n this.materialHandle.style.transform = 'scale(0)';\n if (tooltipContentElement.innerText.length > 4) {\n this.tooltipElement.style.transform = 'scale(1)';\n }\n else {\n this.tooltipElement.style.transform = this.getTooltipTransformProperties(this.previousTooltipClass).rotate;\n }\n if (this.type === 'Default') {\n setTimeout(function () { if (_this.tooltipElement)\n _this.tooltipElement.style.transition = _this.transition.handle; }, 2500);\n }\n else {\n setTimeout(function () { if (_this.tooltipElement)\n _this.tooltipElement.style.transition = 'none'; }, 2500);\n }\n }\n };\n Slider.prototype.closeMaterialTooltip = function () {\n var _this = this;\n if (this.isMaterialTooltip) {\n var tooltipContentElement = this.tooltipElement.firstElementChild;\n this.tooltipElement.style.transition = this.scaleTransform;\n tooltipContentElement.classList.remove(classNames.materialTooltipShow);\n tooltipContentElement.classList.add(classNames.materialTooltipHide);\n this.firstHandle.style.cursor = '-webkit-grab';\n this.firstHandle.style.cursor = 'grab';\n if (this.materialHandle) {\n this.materialHandle.style.transform = 'scale(1)';\n }\n this.tooltipElement.classList.remove(classNames.materialTooltipOpen);\n this.setTooltipTransform();\n this.tooltipTarget = undefined;\n setTimeout(function () { if (_this.tooltipElement)\n _this.tooltipElement.style.transition = 'none'; }, 2500);\n }\n };\n Slider.prototype.checkTooltipPosition = function (args) {\n var tooltipClass = this.tooltipPositionCalculation(args.collidedPosition);\n if (this.tooltipCollidedPosition === undefined ||\n this.tooltipCollidedPosition !== args.collidedPosition || !args.element.classList.contains(tooltipClass)) {\n if (this.isMaterialTooltip) {\n if (tooltipClass !== undefined) {\n args.element.classList.remove(this.previousTooltipClass);\n args.element.classList.add(tooltipClass);\n this.previousTooltipClass = tooltipClass;\n }\n if (args.element.style.transform && args.element.classList.contains(classNames.materialTooltipOpen) &&\n args.element.firstElementChild.innerText.length <= 4) {\n args.element.style.transform = this.getTooltipTransformProperties(this.previousTooltipClass).rotate;\n }\n }\n this.tooltipCollidedPosition = args.collidedPosition;\n }\n if (this.isMaterialTooltip && this.tooltipElement && this.tooltipElement.style.transform.indexOf('translate') !== -1) {\n this.setTooltipTransform();\n }\n };\n Slider.prototype.setTooltipTransform = function () {\n var transformProperties = this.getTooltipTransformProperties(this.previousTooltipClass);\n if (isNullOrUndefined(this.tooltipElement))\n return;\n if (this.tooltipElement.firstElementChild.innerText.length > 4) {\n this.tooltipElement.style.transform = transformProperties.translate + \" scale(0.01)\";\n }\n else {\n this.tooltipElement.style.transform = transformProperties.translate + \" \" + transformProperties.rotate + \" scale(0.01)\";\n }\n };\n Slider.prototype.renderTooltip = function () {\n this.tooltipObj = new Tooltip({\n showTipPointer: this.isBootstrap || this.isMaterial || this.isMaterial3 || this.isBootstrap4 || this.isTailwind || this.isBootstrap5 || this.isFluent,\n cssClass: classNames.sliderTooltip,\n height: (this.isMaterial || this.isMaterial3) ? 30 : 'auto',\n animation: { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } },\n opensOn: 'Custom',\n beforeOpen: this.tooltipBeforeOpen.bind(this),\n beforeCollision: this.checkTooltipPosition.bind(this),\n beforeClose: this.tooltipBeforeClose.bind(this),\n enableHtmlSanitizer: this.enableHtmlSanitizer\n });\n this.tooltipObj.appendTo(this.firstHandle);\n this.initializeTooltipProps();\n };\n Slider.prototype.initializeTooltipProps = function () {\n var tooltipShowOn = (this.tooltip.showOn === 'Auto' ? 'Hover' : this.tooltip.showOn);\n this.setProperties({ tooltip: { showOn: tooltipShowOn } }, true);\n this.tooltipObj.position = this.tooltipPlacement();\n this.tooltipCollision(this.tooltipObj.position);\n [this.firstHandle, this.rangeBar, this.secondHandle].forEach(function (handle) {\n if (!isNullOrUndefined(handle)) {\n handle.style.transition = 'none';\n }\n });\n if (this.isMaterialTooltip) {\n this.sliderContainer.classList.add(classNames.materialSlider);\n this.tooltipValue();\n this.tooltipObj.animation.close.effect = 'None';\n this.tooltipObj.open(this.firstHandle);\n }\n };\n Slider.prototype.tooltipBeforeClose = function () {\n this.tooltipElement = undefined;\n this.tooltipCollidedPosition = undefined;\n };\n Slider.prototype.setButtons = function () {\n this.firstBtn = this.createElement('div', { className: classNames.sliderButton + ' ' + classNames.firstButton });\n this.firstBtn.appendChild(this.createElement('span', { className: classNames.sliderButtonIcon }));\n if (this.isTailwind) {\n this.firstBtn.querySelector('span').classList.add('e-icons');\n }\n this.firstBtn.tabIndex = -1;\n this.secondBtn = this.createElement('div', { className: classNames.sliderButton + ' ' + classNames.secondButton });\n this.secondBtn.appendChild(this.createElement('span', { className: classNames.sliderButtonIcon }));\n if (this.isTailwind) {\n this.secondBtn.querySelector('span').classList.add('e-icons');\n }\n this.secondBtn.tabIndex = -1;\n this.sliderContainer.classList.add(classNames.sliderButtonClass);\n this.sliderContainer.appendChild(this.firstBtn);\n this.sliderContainer.appendChild(this.secondBtn);\n this.sliderContainer.appendChild(this.element);\n this.buttonTitle();\n };\n Slider.prototype.buttonTitle = function () {\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n this.l10n.setLocale(this.locale);\n var decrementTitle = this.l10n.getConstant('decrementTitle');\n var incrementTitle = this.l10n.getConstant('incrementTitle');\n attributes(enabledRTL ? this.secondBtn : this.firstBtn, { 'aria-label': decrementTitle, title: decrementTitle });\n attributes(enabledRTL ? this.firstBtn : this.secondBtn, { 'aria-label': incrementTitle, title: incrementTitle });\n };\n Slider.prototype.buttonFocusOut = function () {\n if (this.isMaterial || this.isMaterial3) {\n this.getHandle().classList.remove('e-large-thumb-size');\n }\n };\n Slider.prototype.repeatButton = function (args) {\n var hVal = this.handleValueUpdate();\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n var value;\n if (args.target.parentElement.classList.contains(classNames.firstButton)\n || args.target.classList.contains(classNames.firstButton)) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), true)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), false));\n }\n else if (args.target.parentElement.classList.contains(classNames.secondButton)\n || (args.target.classList.contains(classNames.secondButton))) {\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), false)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), true));\n }\n if (this.limits.enabled) {\n value = this.getLimitCorrectedValues(value);\n }\n if (value >= this.min && value <= this.max) {\n this.changeHandleValue(value);\n this.tooltipToggle(this.getHandle());\n }\n };\n Slider.prototype.repeatHandlerMouse = function (args) {\n args.preventDefault();\n if (args.type === ('mousedown') || args.type === ('touchstart')) {\n this.buttonClick(args);\n this.repeatInterval = setInterval(this.repeatButton.bind(this), 180, args);\n }\n };\n Slider.prototype.materialChange = function () {\n if (!this.getHandle().classList.contains('e-large-thumb-size')) {\n this.getHandle().classList.add('e-large-thumb-size');\n }\n };\n Slider.prototype.focusHandle = function () {\n if (!this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.getHandle().classList.add(classNames.sliderTabHandle);\n }\n };\n Slider.prototype.repeatHandlerUp = function (e) {\n this.changeEvent('changed', e);\n this.closeTooltip();\n clearInterval(this.repeatInterval);\n this.getHandle().focus();\n };\n Slider.prototype.customTickCounter = function (bigNum) {\n var tickCount = 4;\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n if (bigNum > 4) {\n tickCount = 3;\n }\n if (bigNum > 7) {\n tickCount = 2;\n }\n if (bigNum > 14) {\n tickCount = 1;\n }\n if (bigNum > 28) {\n tickCount = 0;\n }\n }\n return tickCount;\n };\n // tslint:disable-next-line:max-func-body-length\n Slider.prototype.renderScale = function () {\n var liElementPosition = 0;\n var orien = this.orientation === 'Vertical' ? 'v' : 'h';\n var spanText;\n this.noOfDecimals = this.numberOfDecimals(this.step);\n this.ul = this.createElement('ul', {\n className: classNames.scale + ' ' + 'e-' + orien + '-scale ' + classNames.tick + '-' + this.ticks.placement.toLowerCase(),\n attrs: { role: 'presentation', tabIndex: '-1', 'aria-hidden': 'true' }\n });\n this.ul.style.zIndex = '-1';\n if (Browser.isAndroid && orien === 'h') {\n this.ul.classList.add(classNames.sliderTickPosition);\n }\n var smallStep = this.ticks.smallStep;\n if (!this.ticks.showSmallTicks) {\n this.ticks.largeStep > 0 ? (smallStep = this.ticks.largeStep) :\n (smallStep = (parseFloat(formatUnit(this.max))) - (parseFloat(formatUnit(this.min))));\n }\n else if (smallStep <= 0) {\n smallStep = parseFloat(formatUnit(this.step));\n }\n var min = this.fractionalToInteger(this.min);\n var max = this.fractionalToInteger(this.max);\n var steps = this.fractionalToInteger(smallStep);\n var bigNum = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 && this.customValues.length - 1;\n var customStep = this.customTickCounter(bigNum);\n var count = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 ?\n (bigNum * customStep) + bigNum : Math.abs((max - min) / steps);\n this.element.appendChild(this.ul);\n var li;\n var start = parseFloat(this.min.toString());\n if (orien === 'v') {\n start = parseFloat(this.max.toString());\n }\n var left = 0;\n var islargeTick;\n var tickWidth = 100 / count;\n if (tickWidth === Infinity) {\n tickWidth = 5;\n }\n for (var i = 0, y = !isNullOrUndefined(this.customValues) && this.customValues.length > 0 ?\n this.customValues.length - 1 : 0, k = 0; i <= count; i++) {\n li = (this.createElement('li', {\n attrs: {\n class: classNames.tick, role: 'presentation', tabIndex: '-1',\n 'aria-hidden': 'true'\n }\n }));\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n islargeTick = i % (customStep + 1) === 0;\n if (islargeTick) {\n if (orien === 'h') {\n start = this.customValues[k];\n k++;\n }\n else {\n start = this.customValues[y];\n y--;\n }\n li.setAttribute('title', start.toString());\n }\n }\n else {\n li.setAttribute('title', start.toString());\n if (this.numberOfDecimals(this.max) === 0 && this.numberOfDecimals(this.min) === 0 &&\n this.numberOfDecimals(this.step) === 0) {\n if (orien === 'h') {\n islargeTick = ((start - parseFloat(this.min.toString())) % this.ticks.largeStep === 0) ? true : false;\n }\n else {\n islargeTick = (Math.abs(start - parseFloat(this.max.toString())) % this.ticks.largeStep === 0) ? true : false;\n }\n }\n else {\n var largestep = this.fractionalToInteger(this.ticks.largeStep);\n var startValue = this.fractionalToInteger(start);\n if (orien === 'h') {\n islargeTick = ((startValue - min) % largestep === 0) ? true : false;\n }\n else {\n islargeTick = (Math.abs(startValue - parseFloat(max.toString())) % largestep === 0) ? true : false;\n }\n }\n }\n if (islargeTick) {\n li.classList.add(classNames.large);\n }\n (orien === 'h') ? (li.style.width = tickWidth + '%') : (li.style.height = tickWidth + '%');\n var repeat = islargeTick ? (this.ticks.placement === 'Both' ? 2 : 1) : 0;\n if (islargeTick) {\n for (var j = 0; j < repeat; j++) {\n this.createTick(li, start, tickWidth);\n }\n }\n else if (isNullOrUndefined(this.customValues)) {\n this.formatTicksValue(li, start);\n }\n this.ul.appendChild(li);\n this.tickElementCollection.push(li);\n var decimalPoints = void 0;\n if (isNullOrUndefined(this.customValues)) {\n if (this.numberOfDecimals(smallStep) > this.numberOfDecimals(start)) {\n decimalPoints = this.numberOfDecimals(smallStep);\n }\n else {\n decimalPoints = this.numberOfDecimals(start);\n }\n if (orien === 'h') {\n start = this.makeRoundNumber(start + smallStep, decimalPoints);\n }\n else {\n if (this.min > this.max) {\n start = this.makeRoundNumber(start + smallStep, decimalPoints);\n }\n else {\n start = this.makeRoundNumber(start - smallStep, decimalPoints);\n }\n }\n left = this.makeRoundNumber(left + smallStep, decimalPoints);\n }\n }\n this.ticksAlignment(orien, tickWidth);\n };\n Slider.prototype.ticksAlignment = function (orien, tickWidth, triggerEvent) {\n if (triggerEvent === void 0) { triggerEvent = true; }\n this.firstChild = this.ul.firstElementChild;\n this.lastChild = this.ul.lastElementChild;\n this.firstChild.classList.add(classNames.sliderFirstTick);\n this.lastChild.classList.add(classNames.sliderLastTick);\n this.sliderContainer.classList.add(classNames.scale + '-' + this.ticks.placement.toLowerCase());\n if (orien === 'h') {\n this.firstChild.style.width = tickWidth / 2 + '%';\n this.lastChild.style.width = tickWidth / 2 + '%';\n }\n else {\n this.firstChild.style.height = tickWidth / 2 + '%';\n this.lastChild.style.height = tickWidth / 2 + '%';\n }\n var eventArgs = { ticksWrapper: this.ul, tickElements: this.tickElementCollection };\n if (triggerEvent) {\n this.trigger('renderedTicks', eventArgs);\n }\n this.scaleAlignment();\n };\n Slider.prototype.createTick = function (li, start, tickWidth) {\n var span = this.createElement('span', {\n className: classNames.tickValue + ' ' + classNames.tick + '-' + this.ticks.placement.toLowerCase(),\n attrs: { role: 'presentation', tabIndex: '-1', 'aria-hidden': 'true' }\n });\n li.appendChild(span);\n if (isNullOrUndefined(this.customValues)) {\n this.formatTicksValue(li, start, span, tickWidth);\n }\n else {\n if (this.enableHtmlSanitizer) {\n span.innerHTML = SanitizeHtmlHelper.sanitize(start.toString());\n }\n else {\n span.innerHTML = start.toString();\n }\n }\n };\n Slider.prototype.formatTicksValue = function (li, start, spanElement, tickWidth) {\n var _this = this;\n var tickText = this.formatNumber(start);\n var text = !isNullOrUndefined(this.ticks) && !isNullOrUndefined(this.ticks.format) ?\n this.formatString(start, this.ticksFormatInfo).formatString : tickText;\n var eventArgs = { value: start, text: text, tickElement: li };\n this.trigger('renderingTicks', eventArgs, function (observedArgs) {\n li.setAttribute('title', observedArgs.text.toString());\n if (spanElement) {\n if (_this.enableHtmlSanitizer) {\n spanElement.innerHTML = SanitizeHtmlHelper.sanitize(observedArgs.text.toString());\n }\n else {\n spanElement.innerHTML = observedArgs.text.toString();\n }\n }\n });\n };\n Slider.prototype.scaleAlignment = function () {\n this.tickValuePosition();\n var smallTick = 12;\n var largeTick = 20;\n var half = largeTick / 2;\n var orien = this.orientation === 'Vertical' ? 'v' : 'h';\n if (this.orientation === 'Vertical') {\n (this.element.getBoundingClientRect().width <= 15) ?\n this.sliderContainer.classList.add(classNames.sliderSmallSize) :\n this.sliderContainer.classList.remove(classNames.sliderSmallSize);\n }\n else {\n (this.element.getBoundingClientRect().height <= 15) ?\n this.sliderContainer.classList.add(classNames.sliderSmallSize) :\n this.sliderContainer.classList.remove(classNames.sliderSmallSize);\n }\n };\n Slider.prototype.tickValuePosition = function () {\n this.firstChild = this.element.querySelector('ul').children[0];\n var first = this.firstChild.getBoundingClientRect();\n var firstChild;\n var otherChild;\n var smallStep = this.ticks.smallStep;\n var count = Math.abs((parseFloat(formatUnit(this.max))) - (parseFloat(formatUnit(this.min)))) / smallStep;\n if (this.firstChild.children.length > 0) {\n firstChild = this.firstChild.children[0].getBoundingClientRect();\n }\n var tickElements = [this.sliderContainer.querySelectorAll('.' + classNames.tick + '.' +\n classNames.large + ' .' + classNames.tickValue)];\n var other;\n if (this.ticks.placement === 'Both') {\n other = [].slice.call(tickElements[0], 2);\n }\n else {\n other = [].slice.call(tickElements[0], 1);\n }\n var tickWidth = this.orientation === 'Vertical' ?\n (first.height * 2) : (first.width * 2);\n for (var i = 0; i < this.firstChild.children.length; i++) {\n if (this.orientation === 'Vertical') {\n this.firstChild.children[i].style.top = -(firstChild.height / 2) + 'px';\n }\n else {\n if (!this.enableRtl) {\n this.firstChild.children[i].style.left = -(firstChild.width / 2) + 'px';\n }\n else {\n this.firstChild.children[i].style.left = (tickWidth -\n this.firstChild.children[i].getBoundingClientRect().width) / 2 + 'px';\n }\n }\n }\n for (var i = 0; i < other.length; i++) {\n otherChild = other[i].getBoundingClientRect();\n if (this.orientation === 'Vertical') {\n setStyleAttribute(other[i], { top: (tickWidth - otherChild.height) / 2 + 'px' });\n }\n else {\n setStyleAttribute(other[i], { left: (tickWidth - otherChild.width) / 2 + 'px' });\n }\n }\n if (this.enableRtl && this.lastChild.children.length && count !== 0) {\n this.lastChild.children[0].style.left = -(this.lastChild.getBoundingClientRect().width / 2) + 'px';\n if (this.ticks.placement === 'Both') {\n this.lastChild.children[1].style.left = -(this.lastChild.getBoundingClientRect().width / 2) + 'px';\n }\n }\n if (count === 0) {\n if (this.orientation === 'Horizontal') {\n if (!this.enableRtl) {\n this.firstChild.classList.remove(classNames.sliderLastTick);\n this.firstChild.style.left = this.firstHandle.style.left;\n }\n else {\n this.firstChild.classList.remove(classNames.sliderLastTick);\n this.firstChild.style.right = this.firstHandle.style.right;\n this.firstChild.children[0].style.left =\n (this.firstChild.getBoundingClientRect().width / 2) + 2 + 'px';\n if (this.ticks.placement === 'Both') {\n this.firstChild.children[1].style.left =\n (this.firstChild.getBoundingClientRect().width / 2) + 2 + 'px';\n }\n }\n }\n if (this.orientation === 'Vertical') {\n this.firstChild.classList.remove(classNames.sliderLastTick);\n }\n }\n };\n Slider.prototype.setAriaAttrValue = function (element) {\n var ariaValueText;\n var isTickFormatted = ((!isNullOrUndefined(this.ticks) && !isNullOrUndefined(this.ticks.format))) ? true : false;\n var text = !isTickFormatted ?\n this.formatContent(this.ticksFormatInfo, false) : this.formatContent(this.tooltipFormatInfo, false);\n var valuenow = isTickFormatted ? this.formatContent(this.ticksFormatInfo, true) :\n this.formatContent(this.tooltipFormatInfo, true);\n text = (!this.customAriaText) ? (text) : (this.customAriaText);\n if (text.split(' - ').length === 2) {\n ariaValueText = text.split(' - ');\n }\n else {\n ariaValueText = [text, text];\n }\n this.setAriaAttributes(element);\n if (this.type !== 'Range') {\n attributes(element, { 'aria-valuenow': valuenow, 'aria-valuetext': text });\n }\n else {\n // eslint-disable-next-line\n (!this.enableRtl) ? ((element === this.firstHandle) ?\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[0], 'aria-valuetext': ariaValueText[0] }) :\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[1], 'aria-valuetext': ariaValueText[1] })) :\n ((element === this.firstHandle) ?\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[1], 'aria-valuetext': ariaValueText[1] }) :\n attributes(element, { 'aria-valuenow': valuenow.split(' - ')[0], 'aria-valuetext': ariaValueText[0] }));\n }\n };\n Slider.prototype.handleValueUpdate = function () {\n var hVal;\n if (this.type === 'Range') {\n if (this.activeHandle === 1) {\n hVal = this.handleVal1;\n }\n else {\n hVal = this.handleVal2;\n }\n }\n else {\n hVal = this.handleVal1;\n }\n return hVal;\n };\n Slider.prototype.getLimitCorrectedValues = function (value) {\n if (this.type === 'MinRange' || this.type === 'Default') {\n value = (this.getLimitValueAndPosition(value, this.limits.minStart, this.limits.minEnd))[0];\n }\n else {\n if (this.activeHandle === 1) {\n value = (this.getLimitValueAndPosition(value, this.limits.minStart, this.limits.minEnd))[0];\n }\n else {\n value = (this.getLimitValueAndPosition(value, this.limits.maxStart, this.limits.maxEnd))[0];\n }\n }\n return value;\n };\n Slider.prototype.focusSliderElement = function () {\n if (!this.isElementFocused) {\n this.element.focus();\n this.isElementFocused = true;\n }\n };\n Slider.prototype.buttonClick = function (args) {\n this.focusSliderElement();\n var value;\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n var hVal = this.handleValueUpdate();\n if ((args.keyCode === 40) || (args.keyCode === 37)\n || args.currentTarget.classList.contains(classNames.firstButton)) {\n // eslint-disable-next-line\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), true)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), false));\n }\n else if ((args.keyCode === 38) || (args.keyCode === 39) ||\n args.currentTarget.classList.contains(classNames.secondButton)) {\n // eslint-disable-next-line\n enabledRTL ? (value = this.add(hVal, parseFloat(this.step.toString()), false)) :\n (value = this.add(hVal, parseFloat(this.step.toString()), true));\n }\n else if ((args.keyCode === 33\n || args.currentTarget.classList.contains(classNames.firstButton))) {\n // eslint-disable-next-line\n enabledRTL ? (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), false)) :\n (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), true));\n }\n else if ((args.keyCode === 34) ||\n args.currentTarget.classList.contains(classNames.secondButton)) {\n // eslint-disable-next-line\n enabledRTL ? (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), true)) :\n (value = this.add(hVal, parseFloat(this.ticks.largeStep.toString()), false));\n }\n else if ((args.keyCode === 36)) {\n value = parseFloat(this.min < this.max ? this.min.toString() : this.max.toString());\n }\n else if ((args.keyCode === 35)) {\n value = parseFloat(this.min < this.max ? this.max.toString() : this.min.toString());\n }\n if (this.limits.enabled) {\n value = this.getLimitCorrectedValues(value);\n }\n this.changeHandleValue(value);\n if ((this.isMaterial || this.isMaterial3) && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.tooltipToggle(this.getHandle());\n this.getHandle().focus();\n this.focusHandle();\n if (args.currentTarget.classList.contains(classNames.firstButton)) {\n EventHandler.add(this.firstBtn, 'mouseup touchend', this.buttonUp, this);\n }\n if (args.currentTarget.classList.contains(classNames.secondButton)) {\n EventHandler.add(this.secondBtn, 'mouseup touchend', this.buttonUp, this);\n }\n };\n Slider.prototype.tooltipToggle = function (target) {\n if (this.isMaterialTooltip) {\n // eslint-disable-next-line\n !this.tooltipElement.classList.contains(classNames.materialTooltipOpen) ?\n this.openMaterialTooltip() : this.refreshTooltip(this.firstHandle);\n }\n else {\n // eslint-disable-next-line\n !this.tooltipElement ? this.openTooltip(target) : this.refreshTooltip(target);\n }\n };\n Slider.prototype.buttonUp = function (args) {\n if (args.currentTarget.classList.contains(classNames.firstButton)) {\n EventHandler.remove(this.firstBtn, 'mouseup touchend', this.buttonUp);\n }\n if (args.currentTarget.classList.contains(classNames.secondButton)) {\n EventHandler.remove(this.secondBtn, 'mouseup touchend', this.buttonUp);\n }\n };\n Slider.prototype.setRangeBar = function () {\n if (this.orientation === 'Horizontal' && !isNullOrUndefined(this.rangeBar)) {\n if (this.type === 'MinRange') {\n // eslint-disable-next-line\n this.enableRtl ? (this.rangeBar.style.right = '0px') : (this.rangeBar.style.left = '0px');\n setStyleAttribute(this.rangeBar, { 'width': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else {\n // eslint-disable-next-line\n this.enableRtl ? (this.rangeBar.style.right =\n this.handlePos1 + 'px') : (this.rangeBar.style.left = this.handlePos1 + 'px');\n setStyleAttribute(this.rangeBar, { 'width': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n else if (!isNullOrUndefined(this.rangeBar)) {\n if (this.type === 'MinRange') {\n this.rangeBar.style.bottom = this.min > this.max ? this.handlePos1 + 'px' : '0px';\n setStyleAttribute(this.rangeBar, { 'height': isNullOrUndefined(this.handlePos1) ? 0 : this.min > this.max ? this.element.clientHeight - this.handlePos1 + 'px' : this.handlePos1 + 'px' });\n }\n else {\n this.rangeBar.style.bottom = this.min > this.max ? this.handlePos2 + 'px' : this.handlePos1 + 'px';\n setStyleAttribute(this.rangeBar, { 'height': this.min > this.max ? this.handlePos1 - this.handlePos2 + 'px' : this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n };\n Slider.prototype.checkValidValueAndPos = function (value) {\n value = this.checkHandleValue(value);\n value = this.checkHandlePosition(value);\n return value;\n };\n Slider.prototype.setLimitBarPositions = function (fromMinPostion, fromMaxpostion, toMinPostion, toMaxpostion) {\n if (this.orientation === 'Horizontal') {\n if (!this.enableRtl) {\n this.limitBarFirst.style.left = fromMinPostion + 'px';\n this.limitBarFirst.style.width = (fromMaxpostion - fromMinPostion) + 'px';\n }\n else {\n this.limitBarFirst.style.right = fromMinPostion + 'px';\n this.limitBarFirst.style.width = (fromMaxpostion - fromMinPostion) + 'px';\n }\n }\n else {\n this.limitBarFirst.style.bottom = (this.min < this.max ? fromMinPostion : fromMaxpostion) + 'px';\n this.limitBarFirst.style.height = (this.min < this.max ? (fromMaxpostion - fromMinPostion) : (fromMinPostion - fromMaxpostion)) + 'px';\n }\n if (this.type === 'Range') {\n if (this.orientation === 'Horizontal') {\n if (!this.enableRtl) {\n this.limitBarSecond.style.left = toMinPostion + 'px';\n this.limitBarSecond.style.width = (toMaxpostion - toMinPostion) + 'px';\n }\n else {\n this.limitBarSecond.style.right = toMinPostion + 'px';\n this.limitBarSecond.style.width = (toMaxpostion - toMinPostion) + 'px';\n }\n }\n else {\n this.limitBarSecond.style.bottom = (this.min < this.max ? toMinPostion : toMaxpostion) + 'px';\n this.limitBarSecond.style.height = (this.min < this.max ? (toMaxpostion - toMinPostion) : (toMinPostion - toMaxpostion)) + 'px';\n }\n }\n };\n Slider.prototype.setLimitBar = function () {\n if (this.type === 'Default' || this.type === 'MinRange') {\n var fromPosition = (this.getLimitValueAndPosition(this.limits.minStart, this.limits.minStart, this.limits.minEnd, true))[0];\n fromPosition = this.checkValidValueAndPos(fromPosition);\n var toPosition = (this.getLimitValueAndPosition(this.limits.minEnd, this.limits.minStart, this.limits.minEnd, true))[0];\n toPosition = this.checkValidValueAndPos(toPosition);\n this.setLimitBarPositions(fromPosition, toPosition);\n }\n else if (this.type === 'Range') {\n var fromMinPostion = (this.getLimitValueAndPosition(this.limits.minStart, this.limits.minStart, this.limits.minEnd, true))[0];\n fromMinPostion = this.checkValidValueAndPos(fromMinPostion);\n var fromMaxpostion = (this.getLimitValueAndPosition(this.limits.minEnd, this.limits.minStart, this.limits.minEnd, true))[0];\n fromMaxpostion = this.checkValidValueAndPos(fromMaxpostion);\n var toMinPostion = (this.getLimitValueAndPosition(this.limits.maxStart, this.limits.maxStart, this.limits.maxEnd, true))[0];\n toMinPostion = this.checkValidValueAndPos(toMinPostion);\n var toMaxpostion = (this.getLimitValueAndPosition(this.limits.maxEnd, this.limits.maxStart, this.limits.maxEnd, true))[0];\n toMaxpostion = this.checkValidValueAndPos(toMaxpostion);\n this.setLimitBarPositions(fromMinPostion, fromMaxpostion, toMinPostion, toMaxpostion);\n }\n };\n Slider.prototype.getLimitValueAndPosition = function (currentValue, minValue, maxValue, limitBar) {\n if (isNullOrUndefined(minValue)) {\n minValue = this.min < this.max ? this.min : this.max;\n if (isNullOrUndefined(currentValue) && limitBar) {\n currentValue = minValue;\n }\n }\n if (isNullOrUndefined(maxValue)) {\n maxValue = this.min < this.max ? this.max : this.min;\n if (isNullOrUndefined(currentValue) && limitBar) {\n currentValue = maxValue;\n }\n }\n if (currentValue < minValue) {\n currentValue = minValue;\n }\n if (currentValue > maxValue) {\n currentValue = maxValue;\n }\n return [currentValue, this.checkHandlePosition(currentValue)];\n };\n Slider.prototype.setValue = function () {\n if (!isNullOrUndefined(this.customValues) && this.customValues.length > 0) {\n this.min = 0;\n this.max = this.customValues.length - 1;\n this.setBarColor();\n }\n this.setAriaAttributes(this.firstHandle);\n this.handleVal1 = isNullOrUndefined(this.value) ? this.checkHandleValue(parseFloat(this.min.toString())) :\n this.checkHandleValue(parseFloat(this.value.toString()));\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n this.preHandlePos1 = this.handlePos1;\n // eslint-disable-next-line\n isNullOrUndefined(this.activeHandle) ? (this.type === 'Range' ? this.activeHandle = 2 : this.activeHandle = 1) :\n // eslint-disable-next-line no-self-assign\n this.activeHandle = this.activeHandle;\n if (this.type === 'Default' || this.type === 'MinRange') {\n if (this.limits.enabled) {\n var values = this.getLimitValueAndPosition(this.handleVal1, this.limits.minStart, this.limits.minEnd);\n this.handleVal1 = values[0];\n this.handlePos1 = values[1];\n this.preHandlePos1 = this.handlePos1;\n }\n this.setHandlePosition(null);\n this.handleStart();\n this.value = this.handleVal1;\n this.setAriaAttrValue(this.firstHandle);\n this.changeEvent('changed', null);\n }\n else {\n this.validateRangeValue();\n }\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n if (this.limits.enabled) {\n this.setLimitBar();\n }\n };\n Slider.prototype.rangeValueUpdate = function () {\n if (this.value === null || typeof (this.value) !== 'object') {\n this.value = [parseFloat(formatUnit(this.min)), parseFloat(formatUnit(this.max))];\n }\n };\n Slider.prototype.validateRangeValue = function () {\n this.rangeValueUpdate();\n this.setRangeValue();\n };\n Slider.prototype.modifyZindex = function () {\n if (this.type === 'Range' && !isNullOrUndefined(this.firstHandle) && !isNullOrUndefined(this.secondHandle)) {\n if (this.activeHandle === 1) {\n this.firstHandle.style.zIndex = (this.zIndex + 4) + '';\n this.secondHandle.style.zIndex = (this.zIndex + 3) + '';\n }\n else {\n this.firstHandle.style.zIndex = (this.zIndex + 3) + '';\n this.secondHandle.style.zIndex = (this.zIndex + 4) + '';\n }\n }\n else if (this.isMaterialTooltip && this.tooltipElement) {\n this.tooltipElement.style.zIndex = getZindexPartial(this.element) + '';\n }\n };\n Slider.prototype.setHandlePosition = function (event) {\n var _this = this;\n var handle;\n var pos = (this.activeHandle === 1) ? this.handlePos1 : this.handlePos2;\n if (this.isMaterialTooltip) {\n handle = [this.firstHandle, this.materialHandle];\n }\n else {\n handle = [this.getHandle()];\n }\n this.handleStart();\n handle.forEach(function (handle) {\n if (_this.orientation === 'Horizontal') {\n // eslint-disable-next-line\n _this.enableRtl ? (handle.style.right =\n pos + \"px\") : (handle.style.left = pos + \"px\");\n }\n else {\n handle.style.bottom = pos + \"px\";\n }\n });\n this.changeEvent('change', event);\n };\n Slider.prototype.getHandle = function () {\n return (this.activeHandle === 1) ? this.firstHandle : this.secondHandle;\n };\n Slider.prototype.setRangeValue = function () {\n this.updateRangeValue();\n this.activeHandle = 1;\n this.setHandlePosition(null);\n this.activeHandle = 2;\n this.setHandlePosition(null);\n this.activeHandle = 1;\n };\n Slider.prototype.changeEvent = function (eventName, e) {\n var previous = eventName === 'change' ? this.previousVal : this.previousChanged;\n if (this.type !== 'Range') {\n this.setProperties({ 'value': this.handleVal1 }, true);\n if (previous !== this.value && (!this.isMaterialTooltip || !this.initialTooltip)) {\n this.trigger(eventName, this.changeEventArgs(eventName, e));\n this.initialTooltip = true;\n this.setPreviousVal(eventName, this.value);\n }\n this.setAriaAttrValue(this.firstHandle);\n }\n else {\n var value = this.value = [this.handleVal1, this.handleVal2];\n this.setProperties({ 'value': value }, true);\n if (previous.length === this.value.length\n && this.value[0] !== previous[0] || this.value[1] !== previous[1]) {\n this.initialTooltip = false;\n this.trigger(eventName, this.changeEventArgs(eventName, e));\n this.initialTooltip = true;\n this.setPreviousVal(eventName, this.value);\n }\n this.setAriaAttrValue(this.getHandle());\n }\n this.hiddenInput.value = this.value.toString();\n };\n Slider.prototype.changeEventArgs = function (eventName, e) {\n var eventArgs;\n if (this.tooltip.isVisible && this.tooltipObj && this.initialTooltip) {\n this.tooltipValue();\n eventArgs = {\n value: this.value,\n previousValue: eventName === 'change' ? this.previousVal : this.previousChanged,\n action: eventName, text: (typeof (this.tooltipObj.content) === 'function' ? this.tooltipObj.content() : this.tooltipObj.content), isInteracted: isNullOrUndefined(e) ? false : true\n };\n }\n else {\n eventArgs = {\n value: this.value,\n previousValue: eventName === 'change' ? this.previousVal : this.previousChanged,\n action: eventName, text: isNullOrUndefined(this.ticksFormatInfo.format) ? this.value.toString() :\n (this.type !== 'Range' ? this.formatString(this.value, this.ticksFormatInfo).formatString :\n (this.formatString(this.value[0], this.ticksFormatInfo).formatString + ' - ' +\n this.formatString(this.value[1], this.ticksFormatInfo).formatString)),\n isInteracted: isNullOrUndefined(e) ? false : true\n };\n }\n return eventArgs;\n };\n Slider.prototype.setPreviousVal = function (eventName, value) {\n if (eventName === 'change') {\n this.previousVal = value;\n }\n else {\n this.previousChanged = value;\n }\n };\n Slider.prototype.updateRangeValue = function () {\n var values = this.value.toString().split(',').map(Number);\n if ((this.enableRtl && this.orientation !== 'Vertical') || this.rtl) {\n this.value = [values[1], values[0]];\n }\n else {\n this.value = [values[0], values[1]];\n }\n if (this.enableRtl && this.orientation !== 'Vertical') {\n this.handleVal1 = this.checkHandleValue(this.value[1]);\n this.handleVal2 = this.checkHandleValue(this.value[0]);\n }\n else {\n this.handleVal1 = this.checkHandleValue(this.value[0]);\n this.handleVal2 = this.checkHandleValue(this.value[1]);\n }\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n if (this.min < this.max && this.handlePos1 > this.handlePos2) {\n this.handlePos1 = this.handlePos2;\n this.handleVal1 = this.handleVal2;\n }\n if (this.min > this.max && this.handlePos1 < this.handlePos2) {\n this.handlePos2 = this.handlePos1;\n this.handleVal2 = this.handleVal1;\n }\n this.preHandlePos1 = this.handlePos1;\n this.preHandlePos2 = this.handlePos2;\n if (this.limits.enabled) {\n this.activeHandle = 1;\n var values_1 = this.getLimitValueAndPosition(this.handleVal1, this.limits.minStart, this.limits.minEnd);\n this.handleVal1 = values_1[0];\n this.handlePos1 = values_1[1];\n this.preHandlePos1 = this.handlePos1;\n this.activeHandle = 2;\n values_1 = this.getLimitValueAndPosition(this.handleVal2, this.limits.maxStart, this.limits.maxEnd);\n this.handleVal2 = values_1[0];\n this.handlePos2 = values_1[1];\n this.preHandlePos2 = this.handlePos2;\n }\n };\n Slider.prototype.checkHandlePosition = function (value) {\n var pos;\n value = (100 *\n (value - (parseFloat(formatUnit(this.min))))) / ((parseFloat(formatUnit(this.max))) - (parseFloat(formatUnit(this.min))));\n if (this.orientation === 'Horizontal') {\n pos = this.element.getBoundingClientRect().width * (value / 100);\n }\n else {\n pos = this.element.getBoundingClientRect().height * (value / 100);\n }\n if (((parseFloat(formatUnit(this.max))) === (parseFloat(formatUnit(this.min))))) {\n if (this.orientation === 'Horizontal') {\n pos = this.element.getBoundingClientRect().width;\n }\n else {\n pos = this.element.getBoundingClientRect().height;\n }\n }\n return pos;\n };\n Slider.prototype.checkHandleValue = function (value) {\n if (this.min === this.max) {\n return (parseFloat(formatUnit(this.max)));\n }\n var handle = this.tempStartEnd();\n if (value < handle.start) {\n value = handle.start;\n }\n else if (value > handle.end) {\n value = handle.end;\n }\n return value;\n };\n /**\n * It is used to reposition slider.\n *\n * @returns void\n */\n Slider.prototype.reposition = function () {\n var _this = this;\n if (!isNullOrUndefined(this.firstHandle))\n this.firstHandle.style.transition = 'none';\n if (this.type !== 'Default' && !isNullOrUndefined(this.rangeBar)) {\n this.rangeBar.style.transition = 'none';\n }\n if (this.type === 'Range' && !isNullOrUndefined(this.secondHandle)) {\n this.secondHandle.style.transition = 'none';\n }\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n if (this.handleVal2) {\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n }\n if (this.orientation === 'Horizontal') {\n // eslint-disable-next-line\n this.enableRtl ? this.firstHandle.style.right =\n this.handlePos1 + \"px\" : this.firstHandle.style.left = this.handlePos1 + \"px\";\n if (this.isMaterialTooltip && !isNullOrUndefined(this.materialHandle)) {\n // eslint-disable-next-line\n this.enableRtl ? this.materialHandle.style.right =\n this.handlePos1 + \"px\" : this.materialHandle.style.left = this.handlePos1 + \"px\";\n }\n if (this.type === 'MinRange' && !isNullOrUndefined(this.rangeBar)) {\n // eslint-disable-next-line\n this.enableRtl ? (this.rangeBar.style.right = '0px') : (this.rangeBar.style.left = '0px');\n setStyleAttribute(this.rangeBar, { 'width': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else if (this.type === 'Range' && !isNullOrUndefined(this.secondHandle) && !isNullOrUndefined(this.rangeBar)) {\n // eslint-disable-next-line\n this.enableRtl ? this.secondHandle.style.right =\n this.handlePos2 + \"px\" : this.secondHandle.style.left = this.handlePos2 + \"px\";\n // eslint-disable-next-line\n this.enableRtl ? (this.rangeBar.style.right =\n this.handlePos1 + 'px') : (this.rangeBar.style.left = this.handlePos1 + 'px');\n setStyleAttribute(this.rangeBar, { 'width': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n else {\n this.firstHandle.style.bottom = this.handlePos1 + \"px\";\n if (this.isMaterialTooltip) {\n this.materialHandle.style.bottom = this.handlePos1 + \"px\";\n }\n if (this.type === 'MinRange') {\n this.rangeBar.style.bottom = this.min > this.max ? this.handlePos1 + 'px' : '0px';\n setStyleAttribute(this.rangeBar, { 'height': isNullOrUndefined(this.handlePos1) ? 0 : this.min > this.max ? this.element.clientHeight - this.handlePos1 + 'px' : this.handlePos1 + 'px' });\n }\n else if (this.type === 'Range') {\n this.secondHandle.style.bottom = this.handlePos2 + \"px\";\n this.rangeBar.style.bottom = this.min > this.max ? this.handlePos2 + 'px' : this.handlePos1 + 'px';\n setStyleAttribute(this.rangeBar, { 'height': this.min > this.max ? this.handlePos1 - this.handlePos2 + 'px' : this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n if (this.limits.enabled) {\n this.setLimitBar();\n }\n if (this.ticks.placement !== 'None' && this.ul) {\n this.removeElement(this.ul);\n this.ul = undefined;\n this.renderScale();\n }\n this.handleStart();\n if (!this.tooltip.isVisible) {\n setTimeout(function () {\n if (!isNullOrUndefined(_this.firstHandle))\n _this.firstHandle.style.transition = _this.scaleTransform;\n if (_this.type === 'Range' && !isNullOrUndefined(_this.secondHandle)) {\n _this.secondHandle.style.transition = _this.scaleTransform;\n }\n });\n }\n this.refreshTooltip(this.tooltipTarget);\n this.setBarColor();\n };\n Slider.prototype.changeHandleValue = function (value) {\n var position = null;\n if (this.activeHandle === 1) {\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n this.handleVal1 = this.checkHandleValue(value);\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n if (this.type === 'Range' && ((this.handlePos1 > this.handlePos2 && this.min < this.max) || (this.handlePos1 < this.handlePos2 && this.min > this.max))) {\n this.handlePos1 = this.handlePos2;\n this.handleVal1 = this.handleVal2;\n }\n if (this.handlePos1 !== this.preHandlePos1) {\n position = this.preHandlePos1 = this.handlePos1;\n }\n }\n this.modifyZindex();\n }\n else {\n if (!(this.limits.enabled && this.limits.endHandleFixed)) {\n this.handleVal2 = this.checkHandleValue(value);\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n if (this.type === 'Range' && ((this.handlePos2 < this.handlePos1 && this.min < this.max) || (this.handlePos2 > this.handlePos1 && this.min > this.max))) {\n this.handlePos2 = this.handlePos1;\n this.handleVal2 = this.handleVal1;\n }\n if (this.handlePos2 !== this.preHandlePos2) {\n position = this.preHandlePos2 = this.handlePos2;\n }\n }\n this.modifyZindex();\n }\n if (position !== null) {\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n this.setHandlePosition(null);\n }\n };\n // eslint-disable-next-line\n Slider.prototype.tempStartEnd = function () {\n if (this.min > this.max) {\n return {\n start: this.max,\n end: this.min\n };\n }\n else {\n return {\n start: this.min,\n end: this.max\n };\n }\n };\n // eslint-disable-next-line\n Slider.prototype.xyToPosition = function (position) {\n var pos;\n if (this.min === this.max) {\n return 100;\n }\n if (this.orientation === 'Horizontal') {\n var left = position.x - this.element.getBoundingClientRect().left;\n var num = this.element.offsetWidth / 100;\n this.val = (left / num);\n }\n else {\n var top_1 = position.y - this.element.getBoundingClientRect().top;\n var num = this.element.offsetHeight / 100;\n this.val = 100 - (top_1 / num);\n }\n var val = this.stepValueCalculation(this.val);\n if (val < 0) {\n val = 0;\n }\n else if (val > 100) {\n val = 100;\n }\n if (this.enableRtl && this.orientation !== 'Vertical') {\n val = 100 - val;\n }\n if (this.orientation === 'Horizontal') {\n pos = this.element.getBoundingClientRect().width * (val / 100);\n }\n else {\n pos = this.element.getBoundingClientRect().height * (val / 100);\n }\n return pos;\n };\n Slider.prototype.stepValueCalculation = function (value) {\n if (this.step === 0) {\n this.step = 1;\n }\n var percentStep = (parseFloat(formatUnit(this.step))) / ((parseFloat(formatUnit(this.max)) - parseFloat(formatUnit(this.min))) / 100);\n var remain = value % Math.abs(percentStep);\n if (remain !== 0) {\n if ((percentStep / 2) > remain) {\n value -= remain;\n }\n else {\n value += Math.abs(percentStep) - remain;\n }\n }\n return value;\n };\n Slider.prototype.add = function (a, b, addition) {\n var precision;\n var x = Math.pow(10, precision || 3);\n var val;\n if (addition) {\n val = (Math.round(a * x) + Math.round(b * x)) / x;\n }\n else {\n val = (Math.round(a * x) - Math.round(b * x)) / x;\n }\n return val;\n };\n Slider.prototype.positionToValue = function (pos) {\n var val;\n var diff = parseFloat(formatUnit(this.max)) - parseFloat(formatUnit(this.min));\n if (this.orientation === 'Horizontal') {\n val = (pos / this.element.getBoundingClientRect().width) * diff;\n }\n else {\n val = (pos / this.element.getBoundingClientRect().height) * diff;\n }\n var total = this.add(val, parseFloat(this.min.toString()), true);\n return (total);\n };\n Slider.prototype.sliderBarClick = function (evt) {\n evt.preventDefault();\n // eslint-disable-next-line\n var pos;\n if (evt.type === 'mousedown' || evt.type === 'mouseup' || evt.type === 'click') {\n pos = { x: evt.clientX, y: evt.clientY };\n }\n else if (evt.type === 'touchend' || evt.type === 'touchstart') {\n pos = { x: evt.changedTouches[0].clientX, y: evt.changedTouches[0].clientY };\n }\n var handlepos = this.xyToPosition(pos);\n var handleVal = this.positionToValue(handlepos);\n if (this.type === 'Range' && (this.min < (this.max) && (this.handlePos2 - handlepos) < (handlepos - this.handlePos1) || (this.min > this.max) && (this.handlePos1 - handlepos) > (handlepos - this.handlePos2))) {\n this.activeHandle = 2;\n if (!(this.limits.enabled && this.limits.endHandleFixed)) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.maxStart, this.limits.maxEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.secondHandle.classList.add(classNames.sliderActiveHandle);\n this.handlePos2 = this.preHandlePos2 = handlepos;\n this.handleVal2 = handleVal;\n }\n this.modifyZindex();\n this.secondHandle.focus();\n }\n else {\n this.activeHandle = 1;\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.minStart, this.limits.minEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n this.handlePos1 = this.preHandlePos1 = handlepos;\n this.handleVal1 = handleVal;\n }\n this.modifyZindex();\n this.firstHandle.focus();\n }\n if (this.isMaterialTooltip) {\n this.tooltipElement.classList.add(classNames.materialTooltipActive);\n }\n var focusedElement = this.element.querySelector('.' + classNames.sliderTabHandle);\n if (focusedElement && this.getHandle() !== focusedElement) {\n focusedElement.classList.remove(classNames.sliderTabHandle);\n }\n var handle = this.activeHandle === 1 ? this.firstHandle : this.secondHandle;\n var behindElement;\n if ((evt.type === 'click' || evt.type === 'mousedown') && evt.target === handle) {\n var eventX = evt.clientX, eventY = evt.clientY;\n behindElement = document.elementFromPoint(eventX, eventY);\n }\n if (evt.target === handle && behindElement != handle) {\n if ((this.isMaterial || this.isMaterial3) && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.sliderBarUp(evt);\n this.tooltipToggle(this.getHandle());\n return;\n }\n if (!this.checkRepeatedValue(handleVal)) {\n return;\n }\n var transition = (this.isMaterial || this.isMaterial3) && this.tooltip.isVisible ?\n this.transitionOnMaterialTooltip : this.transition;\n this.getHandle().style.transition = transition.handle;\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = transition.rangeBar;\n }\n this.setHandlePosition(evt);\n if (this.isMaterialTooltip) {\n this.initialTooltip = false;\n }\n if (evt.target != handle) {\n this.changeEvent('changed', evt);\n }\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n };\n Slider.prototype.handleValueAdjust = function (handleValue, assignValue, handleNumber) {\n if (handleNumber === 1) {\n this.handleVal1 = assignValue;\n this.handleVal2 = this.handleVal1 + this.minDiff;\n }\n else if (handleNumber === 2) {\n this.handleVal2 = assignValue;\n this.handleVal1 = this.handleVal2 - this.minDiff;\n }\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n };\n Slider.prototype.dragRangeBarMove = function (event) {\n var _a, _b;\n if (event.type !== 'touchmove') {\n event.preventDefault();\n }\n this.rangeBarDragged = true;\n var pos;\n this.rangeBar.style.transition = 'none';\n this.firstHandle.style.transition = 'none';\n this.secondHandle.style.transition = 'none';\n var xPostion;\n var yPostion;\n if (event.type === 'mousemove') {\n _a = [event.clientX, event.clientY], xPostion = _a[0], yPostion = _a[1];\n }\n else {\n _b = [event.changedTouches[0].clientX, event.changedTouches[0].clientY], xPostion = _b[0], yPostion = _b[1];\n }\n if (!(this.limits.enabled && this.limits.startHandleFixed) && !(this.limits.enabled && this.limits.endHandleFixed)) {\n if (!this.enableRtl) {\n pos = { x: xPostion - this.firstPartRemain, y: yPostion + this.secondPartRemain };\n }\n else {\n pos = { x: xPostion + this.secondPartRemain, y: yPostion + this.secondPartRemain };\n }\n if (this.min > this.max) {\n this.handlePos2 = this.xyToPosition(pos);\n this.handleVal2 = this.positionToValue(this.handlePos2);\n }\n else {\n this.handlePos1 = this.xyToPosition(pos);\n this.handleVal1 = this.positionToValue(this.handlePos1);\n }\n if (!this.enableRtl) {\n pos = { x: xPostion + this.secondPartRemain, y: yPostion - this.firstPartRemain };\n }\n else {\n pos = { x: xPostion - this.firstPartRemain, y: yPostion - this.firstPartRemain };\n }\n if (this.min > this.max) {\n this.handlePos1 = this.xyToPosition(pos);\n this.handleVal1 = this.positionToValue(this.handlePos1);\n }\n else {\n this.handlePos2 = this.xyToPosition(pos);\n this.handleVal2 = this.positionToValue(this.handlePos2);\n }\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(this.handleVal1, this.limits.minStart, this.limits.minEnd);\n this.handleVal1 = value[0];\n this.handlePos1 = value[1];\n if (this.handleVal1 === this.limits.minEnd) {\n this.handleValueAdjust(this.handleVal1, this.limits.minEnd, 1);\n }\n if (this.handleVal1 === this.limits.minStart) {\n this.handleValueAdjust(this.handleVal1, this.limits.minStart, 1);\n }\n value = this.getLimitValueAndPosition(this.handleVal2, this.limits.maxStart, this.limits.maxEnd);\n this.handleVal2 = value[0];\n this.handlePos2 = value[1];\n if (this.handleVal2 === this.limits.maxStart) {\n this.handleValueAdjust(this.handleVal2, this.limits.maxStart, 2);\n }\n if (this.handleVal2 === this.limits.maxEnd) {\n this.handleValueAdjust(this.handleVal2, this.limits.maxEnd, 2);\n }\n }\n if (this.handleVal2 === (this.min > this.max ? this.min : this.max)) {\n this.handleValueAdjust(this.handleVal2, (this.min > this.max ? this.min : this.max), 2);\n }\n if (this.handleVal1 === (this.min > this.max ? this.max : this.min)) {\n this.handleValueAdjust(this.handleVal1, (this.min > this.max ? this.max : this.min), 1);\n }\n }\n this.activeHandle = 1;\n this.setHandlePosition(event);\n this.activeHandle = 2;\n this.setHandlePosition(event);\n this.tooltipToggle(this.rangeBar);\n this.setRangeBar();\n };\n Slider.prototype.sliderBarUp = function (event) {\n this.changeEvent('changed', event);\n this.handleFocusOut();\n this.firstHandle.classList.remove(classNames.sliderActiveHandle);\n if (this.type === 'Range') {\n this.initialTooltip = false;\n this.secondHandle.classList.remove(classNames.sliderActiveHandle);\n }\n this.closeTooltip();\n if (this.isMaterial || this.isMaterial3) {\n this.getHandle().classList.remove('e-large-thumb-size');\n if (this.isMaterialTooltip) {\n this.tooltipElement.classList.remove(classNames.materialTooltipActive);\n }\n }\n EventHandler.remove(document, 'mousemove touchmove', this.sliderBarMove);\n EventHandler.remove(document, 'mouseup touchend', this.sliderBarUp);\n };\n Slider.prototype.sliderBarMove = function (evt) {\n if (evt.type !== 'touchmove') {\n evt.preventDefault();\n }\n var pos;\n if (evt.type === 'mousemove') {\n pos = { x: evt.clientX, y: evt.clientY };\n }\n else {\n pos = { x: evt.changedTouches[0].clientX, y: evt.changedTouches[0].clientY };\n }\n var handlepos = this.xyToPosition(pos);\n var handleVal = this.positionToValue(handlepos);\n handlepos = Math.round(handlepos);\n if (this.type !== 'Range' && this.activeHandle === 1) {\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n if (this.limits.enabled) {\n var valueAndPostion = this.getLimitValueAndPosition(handleVal, this.limits.minStart, this.limits.minEnd);\n handlepos = valueAndPostion[1];\n handleVal = valueAndPostion[0];\n }\n this.handlePos1 = handlepos;\n this.handleVal1 = handleVal;\n }\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n }\n if (this.type === 'Range') {\n if (this.activeHandle === 1) {\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n if (!(this.limits.enabled && this.limits.startHandleFixed)) {\n if ((this.min < this.max && handlepos > this.handlePos2 || (this.min > this.max && handlepos < this.handlePos2))) {\n handlepos = this.handlePos2;\n handleVal = this.handleVal2;\n }\n if (handlepos !== this.preHandlePos1) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.minStart, this.limits.minEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.handlePos1 = this.preHandlePos1 = handlepos;\n this.handleVal1 = handleVal;\n this.activeHandle = 1;\n }\n }\n }\n else if (this.activeHandle === 2) {\n this.secondHandle.classList.add(classNames.sliderActiveHandle);\n if (!(this.limits.enabled && this.limits.endHandleFixed)) {\n if ((this.min < this.max && handlepos < this.handlePos1) || (this.min > this.max && handlepos > this.handlePos1)) {\n handlepos = this.handlePos1;\n handleVal = this.handleVal1;\n }\n if (handlepos !== this.preHandlePos2) {\n if (this.limits.enabled) {\n var value = this.getLimitValueAndPosition(handleVal, this.limits.maxStart, this.limits.maxEnd);\n handleVal = value[0];\n handlepos = value[1];\n }\n this.handlePos2 = this.preHandlePos2 = handlepos;\n this.handleVal2 = handleVal;\n this.activeHandle = 2;\n }\n }\n }\n }\n if (!this.checkRepeatedValue(handleVal)) {\n return;\n }\n this.getHandle().style.transition = this.scaleTransform;\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n this.setHandlePosition(evt);\n if ((this.isMaterial || this.isMaterial3) && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.tooltipToggle(this.getHandle());\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n };\n Slider.prototype.dragRangeBarUp = function (event) {\n if (!this.rangeBarDragged) {\n this.focusSliderElement();\n this.sliderBarClick(event);\n }\n else {\n this.isDragComplete = true;\n }\n this.changeEvent('changed', event);\n this.closeTooltip();\n EventHandler.remove(document, 'mousemove touchmove', this.dragRangeBarMove);\n EventHandler.remove(document, 'mouseup touchend', this.dragRangeBarUp);\n this.rangeBarDragged = false;\n };\n Slider.prototype.checkRepeatedValue = function (currentValue) {\n if (this.type === 'Range') {\n var previousVal = this.enableRtl && this.orientation !== 'Vertical' ? (this.activeHandle === 1 ?\n this.previousVal[1] : this.previousVal[0]) :\n (this.activeHandle === 1 ? this.previousVal[0] : this.previousVal[1]);\n if (currentValue === previousVal) {\n return 0;\n }\n }\n else {\n if (currentValue === this.previousVal) {\n return 0;\n }\n }\n return 1;\n };\n Slider.prototype.refreshTooltip = function (target) {\n if (this.tooltip.isVisible && this.tooltipObj) {\n this.tooltipValue();\n if (target) {\n this.tooltipObj.refresh(target);\n this.tooltipTarget = target;\n }\n }\n };\n Slider.prototype.openTooltip = function (target) {\n if (this.tooltip.isVisible && this.tooltipObj && !this.isMaterialTooltip) {\n this.tooltipValue();\n this.tooltipObj.open(target);\n this.tooltipTarget = target;\n }\n };\n Slider.prototype.closeTooltip = function () {\n if (this.tooltip.isVisible && this.tooltipObj && this.tooltip.showOn !== 'Always' && !this.isMaterialTooltip) {\n this.tooltipValue();\n this.tooltipObj.close();\n this.tooltipTarget = undefined;\n }\n };\n Slider.prototype.keyDown = function (event) {\n switch (event.keyCode) {\n case 37:\n case 38:\n case 39:\n case 40:\n case 33:\n case 34:\n case 36:\n case 35:\n event.preventDefault();\n this.buttonClick(event);\n break;\n }\n };\n Slider.prototype.wireButtonEvt = function (destroy) {\n if (!destroy) {\n EventHandler.add(this.firstBtn, 'mouseleave touchleave', this.buttonFocusOut, this);\n EventHandler.add(this.secondBtn, 'mouseleave touchleave', this.buttonFocusOut, this);\n EventHandler.add(this.firstBtn, 'mousedown touchstart', this.repeatHandlerMouse, this);\n EventHandler.add(this.firstBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp, this);\n EventHandler.add(this.secondBtn, 'mousedown touchstart', this.repeatHandlerMouse, this);\n EventHandler.add(this.secondBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp, this);\n EventHandler.add(this.firstBtn, 'focusout', this.sliderFocusOut, this);\n EventHandler.add(this.secondBtn, 'focusout', this.sliderFocusOut, this);\n }\n else {\n EventHandler.remove(this.firstBtn, 'mouseleave touchleave', this.buttonFocusOut);\n EventHandler.remove(this.secondBtn, 'mouseleave touchleave', this.buttonFocusOut);\n EventHandler.remove(this.firstBtn, 'mousedown touchstart', this.repeatHandlerMouse);\n EventHandler.remove(this.firstBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp);\n EventHandler.remove(this.secondBtn, 'mousedown touchstart', this.repeatHandlerMouse);\n EventHandler.remove(this.secondBtn, 'mouseup mouseleave touchup touchend', this.repeatHandlerUp);\n EventHandler.remove(this.firstBtn, 'focusout', this.sliderFocusOut);\n EventHandler.remove(this.secondBtn, 'focusout', this.sliderFocusOut);\n }\n };\n Slider.prototype.rangeBarMousedown = function (event) {\n var _a, _b;\n event.preventDefault();\n this.focusSliderElement();\n if (this.type === 'Range' && this.drag && event.target === this.rangeBar) {\n var xPostion = void 0;\n var yPostion = void 0;\n if (event.type === 'mousedown') {\n _a = [event.clientX, event.clientY], xPostion = _a[0], yPostion = _a[1];\n }\n else if (event.type === 'touchstart') {\n _b = [event.changedTouches[0].clientX, event.changedTouches[0].clientY], xPostion = _b[0], yPostion = _b[1];\n }\n if (this.orientation === 'Horizontal') {\n this.firstPartRemain = xPostion - this.rangeBar.getBoundingClientRect().left;\n this.secondPartRemain = this.rangeBar.getBoundingClientRect().right - xPostion;\n }\n else {\n this.firstPartRemain = yPostion - this.rangeBar.getBoundingClientRect().top;\n this.secondPartRemain = this.rangeBar.getBoundingClientRect().bottom - yPostion;\n }\n this.minDiff = this.handleVal2 - this.handleVal1;\n this.tooltipToggle(this.rangeBar);\n var focusedElement = this.element.querySelector('.' + classNames.sliderTabHandle);\n if (focusedElement) {\n focusedElement.classList.remove(classNames.sliderTabHandle);\n }\n EventHandler.add(document, 'mousemove touchmove', this.dragRangeBarMove, this);\n EventHandler.add(document, 'mouseup touchend', this.dragRangeBarUp, this);\n }\n };\n Slider.prototype.elementClick = function (event) {\n if (this.isDragComplete) {\n this.isDragComplete = false;\n return;\n }\n event.preventDefault();\n this.focusSliderElement();\n this.sliderBarClick(event);\n this.focusHandle();\n };\n Slider.prototype.wireEvents = function () {\n this.onresize = this.reposition.bind(this);\n window.addEventListener('resize', this.onresize);\n if (this.enabled && !this.readonly) {\n EventHandler.add(this.element, 'click', this.elementClick, this);\n if (this.type === 'Range' && this.drag) {\n EventHandler.add(this.rangeBar, 'mousedown touchstart', this.rangeBarMousedown, this);\n }\n EventHandler.add(this.sliderContainer, 'keydown', this.keyDown, this);\n EventHandler.add(this.sliderContainer, 'keyup', this.keyUp, this);\n EventHandler.add(this.element, 'focusout', this.sliderFocusOut, this);\n EventHandler.add(this.sliderContainer, 'mouseover mouseout touchstart touchend', this.hover, this);\n this.wireFirstHandleEvt(false);\n if (this.type === 'Range') {\n this.wireSecondHandleEvt(false);\n }\n if (this.showButtons) {\n this.wireButtonEvt(false);\n }\n this.wireMaterialTooltipEvent(false);\n if (this.isForm) {\n EventHandler.add(this.formElement, 'reset', this.formResetHandler, this);\n }\n }\n };\n Slider.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, 'click', this.elementClick);\n if (this.type === 'Range' && this.drag) {\n EventHandler.remove(this.rangeBar, 'mousedown touchstart', this.rangeBarMousedown);\n }\n EventHandler.remove(this.sliderContainer, 'keydown', this.keyDown);\n EventHandler.remove(this.sliderContainer, 'keyup', this.keyUp);\n EventHandler.remove(this.element, 'focusout', this.sliderFocusOut);\n EventHandler.remove(this.sliderContainer, 'mouseover mouseout touchstart touchend', this.hover);\n this.wireFirstHandleEvt(true);\n if (this.type === 'Range') {\n this.wireSecondHandleEvt(true);\n }\n if (this.showButtons) {\n this.wireButtonEvt(true);\n }\n this.wireMaterialTooltipEvent(true);\n EventHandler.remove(this.element, 'reset', this.formResetHandler);\n };\n Slider.prototype.formResetHandler = function () {\n this.setProperties({ 'value': this.formResetValue }, true);\n this.setValue();\n };\n Slider.prototype.keyUp = function (event) {\n if (event.keyCode === 9 && event.target.classList.contains(classNames.sliderHandle)) {\n this.focusSliderElement();\n if (!event.target.classList.contains(classNames.sliderTabHandle)) {\n if (this.element.querySelector('.' + classNames.sliderTabHandle)) {\n this.element.querySelector('.' + classNames.sliderTabHandle).classList.remove(classNames.sliderTabHandle);\n }\n event.target.classList.add(classNames.sliderTabHandle);\n var parentElement = event.target.parentElement;\n if (parentElement === this.element) {\n parentElement.querySelector('.' + classNames.sliderTrack).classList.add(classNames.sliderTabTrack);\n if (this.type === 'Range' || this.type === 'MinRange') {\n parentElement.querySelector('.' + classNames.rangeBar).classList.add(classNames.sliderTabRange);\n }\n }\n if (this.type === 'Range') {\n (event.target.previousSibling).classList.contains(classNames.sliderHandle) ?\n this.activeHandle = 2 : this.activeHandle = 1;\n }\n this.getHandle().focus();\n this.tooltipToggle(this.getHandle());\n }\n }\n this.closeTooltip();\n this.changeEvent('changed', event);\n };\n Slider.prototype.hover = function (event) {\n if (!isNullOrUndefined(event)) {\n if (event.type === 'mouseover' || event.type === 'touchmove' || event.type === 'mousemove' ||\n event.type === 'pointermove' || event.type === 'touchstart') {\n this.sliderContainer.classList.add(classNames.sliderHover);\n }\n else {\n this.sliderContainer.classList.remove(classNames.sliderHover);\n var curTarget = event.currentTarget;\n if (this.tooltip.isVisible && this.tooltip.showOn !== 'Always' && this.tooltipObj && this.isMaterialTooltip &&\n !curTarget.classList.contains(classNames.sliderHandleFocused) &&\n !curTarget.classList.contains(classNames.sliderTabHandle)) {\n this.closeMaterialTooltip();\n }\n }\n }\n };\n Slider.prototype.sliderFocusOut = function (event) {\n if (event.relatedTarget !== this.secondHandle && event.relatedTarget !== this.firstHandle &&\n event.relatedTarget !== this.element && event.relatedTarget !== this.firstBtn && event.relatedTarget !== this.secondBtn) {\n this.closeMaterialTooltip();\n this.closeTooltip();\n if (this.element.querySelector('.' + classNames.sliderTabHandle)) {\n this.element.querySelector('.' + classNames.sliderTabHandle).classList.remove(classNames.sliderTabHandle);\n }\n if (this.element.querySelector('.' + classNames.sliderTabTrack)) {\n this.element.querySelector('.' + classNames.sliderTabTrack).classList.remove(classNames.sliderTabTrack);\n if ((this.type === 'Range' || this.type === 'MinRange') &&\n this.element.querySelector('.' + classNames.sliderTabRange)) {\n this.element.querySelector('.' + classNames.sliderTabRange).classList.remove(classNames.sliderTabRange);\n }\n }\n this.hiddenInput.focus();\n this.hiddenInput.blur();\n this.isElementFocused = false;\n }\n };\n Slider.prototype.removeElement = function (element) {\n if (element.parentNode) {\n element.parentNode.removeChild(element);\n }\n };\n Slider.prototype.changeSliderType = function (type, args) {\n if (this.isMaterialTooltip && this.materialHandle) {\n this.sliderContainer.classList.remove(classNames.materialSlider);\n this.removeElement(this.materialHandle);\n this.materialHandle = undefined;\n }\n this.removeElement(this.firstHandle);\n this.firstHandle = undefined;\n if (type !== 'Default') {\n if (type === 'Range') {\n this.removeElement(this.secondHandle);\n this.secondHandle = undefined;\n }\n this.removeElement(this.rangeBar);\n this.rangeBar = undefined;\n }\n if (this.tooltip.isVisible && !isNullOrUndefined(this.tooltipObj)) {\n this.tooltipObj.destroy();\n this.tooltipElement = undefined;\n this.tooltipCollidedPosition = undefined;\n }\n if (this.limits.enabled) {\n if (type === 'MinRange' || type === 'Default') {\n if (!isNullOrUndefined(this.limitBarFirst)) {\n this.removeElement(this.limitBarFirst);\n this.limitBarFirst = undefined;\n }\n }\n else {\n if (!isNullOrUndefined(this.limitBarSecond)) {\n this.removeElement(this.limitBarSecond);\n this.limitBarSecond = undefined;\n }\n }\n }\n this.activeHandle = 1;\n this.getThemeInitialization();\n if (this.type === 'Range') {\n this.rangeValueUpdate();\n }\n this.createRangeBar();\n if (this.limits.enabled) {\n this.createLimitBar();\n }\n this.setHandler();\n this.setOrientClass();\n this.wireFirstHandleEvt(false);\n if (this.type === 'Range') {\n this.wireSecondHandleEvt(false);\n }\n this.setValue();\n if (this.tooltip.isVisible) {\n this.renderTooltip();\n this.wireMaterialTooltipEvent(false);\n }\n this.setBarColor();\n if (args !== 'tooltip') {\n this.updateConfig();\n }\n if (this.readonly) {\n this.sliderContainer.classList.remove(classNames.readonly);\n this.setReadOnly();\n }\n };\n Slider.prototype.changeRtl = function () {\n if (!this.enableRtl && this.type === 'Range') {\n this.value = [this.handleVal2, this.handleVal1];\n }\n this.updateConfig();\n if (this.tooltip.isVisible) {\n this.tooltipObj.refresh(this.firstHandle);\n }\n if (this.showButtons) {\n var enabledRTL = this.enableRtl && this.orientation !== 'Vertical';\n attributes(enabledRTL ? this.secondBtn : this.firstBtn, { 'aria-label': 'Decrease', title: 'Decrease' });\n attributes(enabledRTL ? this.firstBtn : this.secondBtn, { 'aria-label': 'Increase', title: 'Increase' });\n }\n };\n Slider.prototype.changeOrientation = function () {\n this.changeSliderType(this.type, 'null');\n };\n Slider.prototype.updateConfig = function () {\n this.setEnableRTL();\n this.setValue();\n if (this.tooltip.isVisible) {\n this.refreshTooltip(this.tooltipTarget);\n }\n if (this.ticks.placement !== 'None') {\n if (this.ul) {\n this.removeElement(this.ul);\n this.ul = undefined;\n this.renderScale();\n }\n }\n this.limitsPropertyChange();\n };\n Slider.prototype.limitsPropertyChange = function () {\n if (this.limits.enabled) {\n if (isNullOrUndefined(this.limitBarFirst) && this.type !== 'Range') {\n this.createLimitBar();\n }\n if (isNullOrUndefined(this.limitBarFirst) && isNullOrUndefined(this.limitBarSecond) && this.type === 'Range') {\n this.createLimitBar();\n }\n this.setLimitBar();\n this.setValue();\n }\n else {\n if (!isNullOrUndefined(this.limitBarFirst)) {\n detach(this.limitBarFirst);\n }\n if (!isNullOrUndefined(this.limitBarSecond)) {\n detach(this.limitBarSecond);\n }\n }\n };\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @private\n */\n Slider.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers.\n * Also it removes the attributes and classes.\n *\n * @method destroy\n * @return {void}\n */\n Slider.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n this.unwireEvents();\n window.removeEventListener('resize', this.onresize);\n removeClass([this.sliderContainer], [classNames.sliderDisabled]);\n this.firstHandle.removeAttribute('aria-orientation');\n if (this.type === 'Range') {\n this.secondHandle.removeAttribute('aria-orientation');\n }\n this.sliderContainer.parentNode.insertBefore(this.element, this.sliderContainer);\n detach(this.sliderContainer);\n if (this.tooltip.isVisible) {\n this.tooltipObj.destroy();\n }\n this.element.innerHTML = '';\n this.hiddenInput = null;\n this.sliderContainer = null;\n this.sliderTrack = null;\n this.rangeBar = null;\n this.firstHandle = null;\n this.secondHandle = null;\n this.tickElementCollection = null;\n this.ul = null;\n this.firstBtn = null;\n this.secondBtn = null;\n this.materialHandle = null;\n this.tooltipObj = null;\n this.tooltipTarget = null;\n this.limitBarFirst = null;\n this.limitBarSecond = null;\n this.firstChild = null;\n this.lastChild = null;\n this.tooltipElement = null;\n };\n /**\n * Calls internally if any of the property value is changed.\n *\n * @private\n */\n // tslint:disable-next-line\n Slider.prototype.onPropertyChanged = function (newProp, oldProp) {\n var _this = this;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n case 'value':\n if (newProp && oldProp) {\n var value = isNullOrUndefined(newProp.value) ?\n (this.type === 'Range' ? [this.min, this.max] : this.min) : newProp.value;\n this.setProperties({ 'value': value }, true);\n if (!isNullOrUndefined(oldProp.value) && oldProp.value.toString() !== value.toString()) {\n this.setValue();\n this.refreshTooltip(this.tooltipTarget);\n if (this.type === 'Range') {\n if (isNullOrUndefined(newProp.value) || oldProp.value[1] === value[1]) {\n this.activeHandle = 1;\n }\n else {\n this.activeHandle = 2;\n }\n }\n }\n }\n break;\n case 'min':\n case 'step':\n case 'max':\n this.setMinMaxValue();\n break;\n case 'tooltip':\n if (!isNullOrUndefined(newProp.tooltip) && !isNullOrUndefined(oldProp.tooltip)) {\n this.initialTooltip = true;\n this.setTooltip(prop);\n if (!this.showButtons) {\n this.wireEvents();\n }\n }\n break;\n case 'type':\n if (!isNullOrUndefined(oldProp) && Object.keys(oldProp).length\n && !isNullOrUndefined(oldProp.type)) {\n this.changeSliderType(oldProp.type, prop);\n this.setZindex();\n }\n break;\n case 'enableRtl':\n if (oldProp.enableRtl !== newProp.enableRtl && this.orientation !== 'Vertical') {\n this.rtl = oldProp.enableRtl;\n this.changeRtl();\n }\n break;\n case 'limits':\n this.limitsPropertyChange();\n break;\n case 'orientation':\n this.changeOrientation();\n break;\n case 'ticks':\n if (!isNullOrUndefined(this.sliderContainer.querySelector('.' + classNames.scale))) {\n detach(this.ul);\n Array.prototype.forEach.call(this.sliderContainer.classList, function (className) {\n if (className.match(/e-scale-/)) {\n _this.sliderContainer.classList.remove(className);\n }\n });\n }\n if (this.ticks.placement !== 'None') {\n this.renderScale();\n this.setZindex();\n }\n break;\n case 'locale':\n if (this.showButtons) {\n this.buttonTitle();\n }\n break;\n case 'showButtons':\n if (newProp.showButtons) {\n this.setButtons();\n this.reposition();\n if (this.enabled && !this.readonly) {\n this.wireButtonEvt(false);\n }\n }\n else {\n if (this.firstBtn && this.secondBtn) {\n this.sliderContainer.removeChild(this.firstBtn);\n this.sliderContainer.removeChild(this.secondBtn);\n this.sliderContainer.classList.remove(classNames.sliderButtonClass);\n this.firstBtn = undefined;\n this.secondBtn = undefined;\n this.reposition();\n }\n }\n break;\n case 'enabled':\n this.setEnabled();\n break;\n case 'readonly':\n this.setReadOnly();\n break;\n case 'customValues':\n this.setValue();\n this.reposition();\n break;\n case 'colorRange':\n this.reposition();\n break;\n case 'width':\n this.setElementWidth(newProp.width);\n this.setMinMaxValue();\n if (this.limits) {\n this.limitsPropertyChange();\n }\n break;\n }\n }\n };\n Slider.prototype.setReadOnly = function () {\n if (this.readonly) {\n this.unwireEvents();\n this.sliderContainer.classList.add(classNames.readonly);\n }\n else {\n this.wireEvents();\n this.sliderContainer.classList.remove(classNames.readonly);\n }\n };\n Slider.prototype.setMinMaxValue = function () {\n var _this = this;\n this.setValue();\n this.refreshTooltip(this.tooltipTarget);\n if (!isNullOrUndefined(this.sliderContainer.querySelector('.' + classNames.scale))) {\n if (this.ul) {\n detach(this.ul);\n Array.prototype.forEach.call(this.sliderContainer.classList, function (className) {\n if (className.match(/e-scale-/)) {\n _this.sliderContainer.classList.remove(className);\n }\n });\n }\n }\n if (this.ticks.placement !== 'None') {\n this.renderScale();\n this.setZindex();\n }\n };\n Slider.prototype.setZindex = function () {\n this.zIndex = 6;\n if (!isNullOrUndefined(this.ticks) && this.ticks.placement !== 'None' && !isNullOrUndefined(this.ul) && !isNullOrUndefined(this.element)) {\n this.ul.style.zIndex = (this.zIndex + -7) + '';\n this.element.style.zIndex = (this.zIndex + 2) + '';\n }\n if (!this.isMaterial && !this.isMaterial3 && !isNullOrUndefined(this.ticks) && this.ticks.placement === 'Both') {\n this.element.style.zIndex = (this.zIndex + 2) + '';\n }\n if (!isNullOrUndefined(this.firstHandle))\n this.firstHandle.style.zIndex = (this.zIndex + 3) + '';\n if (this.type === 'Range' && !isNullOrUndefined(this.secondHandle)) {\n this.secondHandle.style.zIndex = (this.zIndex + 4) + '';\n }\n };\n Slider.prototype.setTooltip = function (args) {\n this.changeSliderType(this.type, args);\n };\n Slider.prototype.setBarColor = function () {\n var trackPosition;\n var trackClassName;\n var child = this.sliderTrack.lastElementChild;\n while (child) {\n this.sliderTrack.removeChild(child);\n child = this.sliderTrack.lastElementChild;\n }\n for (var i = 0; i < this.colorRange.length; i++) {\n if (!isNullOrUndefined(this.colorRange[i].start) && !isNullOrUndefined(this.colorRange[i].end)) {\n if (this.colorRange[i].end > this.colorRange[i].start) {\n if (this.colorRange[i].start < this.min) {\n this.colorRange[i].start = this.min;\n }\n if (this.colorRange[i].end > this.max) {\n this.colorRange[i].end = this.max;\n }\n var startingPosition = this.checkHandlePosition(this.colorRange[i].start);\n var endPosition = this.checkHandlePosition(this.colorRange[i].end);\n var trackContainer = this.createElement('div');\n trackContainer.style.backgroundColor = this.colorRange[i].color;\n trackContainer.style.border = '1px solid ' + this.colorRange[i].color;\n if (this.orientation === 'Horizontal') {\n trackClassName = classNames.sliderHorizantalColor;\n if (this.enableRtl) {\n if (isNullOrUndefined(this.customValues)) {\n trackPosition = this.checkHandlePosition(this.max) - this.checkHandlePosition(this.colorRange[i].end);\n }\n else {\n trackPosition = this.checkHandlePosition(this.customValues.length - this.colorRange[i].end - 1);\n }\n }\n else {\n trackPosition = this.checkHandlePosition(this.colorRange[i].start);\n }\n trackContainer.style.width = endPosition - startingPosition + 'px';\n trackContainer.style.left = trackPosition + 'px';\n }\n else {\n trackClassName = classNames.sliderVerticalColor;\n trackPosition = this.checkHandlePosition(this.colorRange[i].start);\n trackContainer.style.height = endPosition - startingPosition + 'px';\n trackContainer.style.bottom = trackPosition + 'px';\n }\n trackContainer.classList.add(trackClassName);\n this.sliderTrack.appendChild(trackContainer);\n }\n }\n }\n };\n /**\n * Gets the component name\n *\n * @private\n */\n Slider.prototype.getModuleName = function () {\n return 'slider';\n };\n __decorate([\n Property(null)\n ], Slider.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], Slider.prototype, \"customValues\", void 0);\n __decorate([\n Property(1)\n ], Slider.prototype, \"step\", void 0);\n __decorate([\n Property(null)\n ], Slider.prototype, \"width\", void 0);\n __decorate([\n Property(0)\n ], Slider.prototype, \"min\", void 0);\n __decorate([\n Property(100)\n ], Slider.prototype, \"max\", void 0);\n __decorate([\n Property(false)\n ], Slider.prototype, \"readonly\", void 0);\n __decorate([\n Property('Default')\n ], Slider.prototype, \"type\", void 0);\n __decorate([\n Collection([{}], ColorRangeData)\n ], Slider.prototype, \"colorRange\", void 0);\n __decorate([\n Complex({}, TicksData)\n ], Slider.prototype, \"ticks\", void 0);\n __decorate([\n Complex({}, LimitData)\n ], Slider.prototype, \"limits\", void 0);\n __decorate([\n Property(true)\n ], Slider.prototype, \"enabled\", void 0);\n __decorate([\n Complex({}, TooltipData)\n ], Slider.prototype, \"tooltip\", void 0);\n __decorate([\n Property(false)\n ], Slider.prototype, \"showButtons\", void 0);\n __decorate([\n Property(true)\n ], Slider.prototype, \"enableAnimation\", void 0);\n __decorate([\n Property('Horizontal')\n ], Slider.prototype, \"orientation\", void 0);\n __decorate([\n Property('')\n ], Slider.prototype, \"cssClass\", void 0);\n __decorate([\n Property(true)\n ], Slider.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"changed\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"renderingTicks\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"renderedTicks\", void 0);\n __decorate([\n Event()\n ], Slider.prototype, \"tooltipChange\", void 0);\n Slider = __decorate([\n NotifyPropertyChanges\n ], Slider);\n return Slider;\n}(Component));\nexport { Slider };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Component, Property, Event, EventHandler, L10n, compile, isNullOrUndefined, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, detach, append, Animation } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, KeyboardEvents, setValue, getValue, ChildProperty } from '@syncfusion/ej2-base';\nimport { Collection, Complex, Browser, Ajax, getUniqueID, closest, remove } from '@syncfusion/ej2-base';\nimport { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nimport { select, selectAll } from '@syncfusion/ej2-base';\nvar CONTROL_WRAPPER = 'e-upload e-control-wrapper';\nvar INPUT_WRAPPER = 'e-file-select';\nvar DROP_AREA = 'e-file-drop';\nvar DROP_WRAPPER = 'e-file-select-wrap';\nvar LIST_PARENT = 'e-upload-files';\nvar FILE = 'e-upload-file-list';\nvar STATUS = 'e-file-status';\nvar ACTION_BUTTONS = 'e-upload-actions';\nvar UPLOAD_BUTTONS = 'e-file-upload-btn e-css e-btn e-flat e-primary';\nvar CLEAR_BUTTONS = 'e-file-clear-btn e-css e-btn e-flat';\nvar FILE_NAME = 'e-file-name';\nvar FILE_TYPE = 'e-file-type';\nvar FILE_SIZE = 'e-file-size';\nvar REMOVE_ICON = 'e-file-remove-btn';\nvar DELETE_ICON = 'e-file-delete-btn';\nvar SPINNER_PANE = 'e-spinner-pane';\nvar ABORT_ICON = 'e-file-abort-btn';\nvar RETRY_ICON = 'e-file-reload-btn';\nvar DRAG_HOVER = 'e-upload-drag-hover';\nvar PROGRESS_WRAPPER = 'e-upload-progress-wrap';\nvar PROGRESSBAR = 'e-upload-progress-bar';\nvar PROGRESSBAR_TEXT = 'e-progress-bar-text';\nvar UPLOAD_INPROGRESS = 'e-upload-progress';\nvar UPLOAD_SUCCESS = 'e-upload-success';\nvar UPLOAD_FAILED = 'e-upload-fails';\nvar TEXT_CONTAINER = 'e-file-container';\nvar VALIDATION_FAILS = 'e-validation-fails';\nvar RTL = 'e-rtl';\nvar DISABLED = 'e-disabled';\nvar RTL_CONTAINER = 'e-rtl-container';\nvar ICON_FOCUSED = 'e-clear-icon-focus';\nvar PROGRESS_INNER_WRAPPER = 'e-progress-inner-wrap';\nvar PAUSE_UPLOAD = 'e-file-pause-btn';\nvar RESUME_UPLOAD = 'e-file-play-btn';\nvar RESTRICT_RETRY = 'e-restrict-retry';\nvar wrapperAttr = ['title', 'style', 'class'];\nvar FORM_UPLOAD = 'e-form-upload';\nvar HIDDEN_INPUT = 'e-hidden-file-input';\nvar INVALID_FILE = 'e-file-invalid';\nvar INFORMATION = 'e-file-information';\nvar FilesProp = /** @class */ (function (_super) {\n __extends(FilesProp, _super);\n function FilesProp() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], FilesProp.prototype, \"name\", void 0);\n __decorate([\n Property(null)\n ], FilesProp.prototype, \"size\", void 0);\n __decorate([\n Property('')\n ], FilesProp.prototype, \"type\", void 0);\n return FilesProp;\n}(ChildProperty));\nexport { FilesProp };\nvar ButtonsProps = /** @class */ (function (_super) {\n __extends(ButtonsProps, _super);\n function ButtonsProps() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Browse...')\n ], ButtonsProps.prototype, \"browse\", void 0);\n __decorate([\n Property('Upload')\n ], ButtonsProps.prototype, \"upload\", void 0);\n __decorate([\n Property('Clear')\n ], ButtonsProps.prototype, \"clear\", void 0);\n return ButtonsProps;\n}(ChildProperty));\nexport { ButtonsProps };\nvar AsyncSettings = /** @class */ (function (_super) {\n __extends(AsyncSettings, _super);\n function AsyncSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], AsyncSettings.prototype, \"saveUrl\", void 0);\n __decorate([\n Property('')\n ], AsyncSettings.prototype, \"removeUrl\", void 0);\n __decorate([\n Property(0)\n ], AsyncSettings.prototype, \"chunkSize\", void 0);\n __decorate([\n Property(3)\n ], AsyncSettings.prototype, \"retryCount\", void 0);\n __decorate([\n Property(500)\n ], AsyncSettings.prototype, \"retryAfterDelay\", void 0);\n return AsyncSettings;\n}(ChildProperty));\nexport { AsyncSettings };\n/**\n * The uploader component allows to upload images, documents, and other files from local to server.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar Uploader = /** @class */ (function (_super) {\n __extends(Uploader, _super);\n /**\n * Triggers when change the Uploader value.\n *\n * @param {UploaderModel} options - Specifies the Uploader model.\n * @param {string | HTMLInputElement} element - Specifies the element to render as component.\n * @private\n */\n function Uploader(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.initialAttr = { accept: null, multiple: false, disabled: false };\n _this.uploadedFilesData = [];\n _this.base64String = [];\n _this.isForm = false;\n _this.allTypes = false;\n _this.pausedData = [];\n _this.uploadMetaData = [];\n _this.tabIndex = '0';\n _this.btnTabIndex = '0';\n _this.disableKeyboardNavigation = false;\n _this.count = -1;\n _this.actionCompleteCount = 0;\n _this.flag = true;\n _this.selectedFiles = [];\n _this.uploaderName = 'UploadFiles';\n _this.fileStreams = [];\n _this.newFileRef = 0;\n _this.isFirstFileOnSelection = false;\n _this.dragCounter = 0;\n _this.isAngular = false;\n /**\n * Get the file item(li) which are shown in file list.\n *\n * @private\n */\n _this.fileList = [];\n /**\n * Get the data of files which are shown in file list.\n *\n * @private\n */\n _this.filesData = [];\n _this.uploaderOptions = options;\n return _this;\n }\n /**\n * Calls internally if any of the property value is changed.\n *\n * @param {UploaderModel} newProp - Returns the dynamic property value of the component.\n * @param {UploaderModel} oldProp - Returns the previous property value of the component.\n * @returns {void}\n * @private\n */\n Uploader.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'allowedExtensions':\n this.setExtensions(this.allowedExtensions);\n this.clearAll();\n break;\n case 'enabled':\n this.setControlStatus();\n break;\n case 'multiple':\n this.setMultipleSelection();\n break;\n case 'enableRtl':\n this.setRTL();\n this.reRenderFileList();\n break;\n case 'buttons':\n this.buttons.browse = isNullOrUndefined(this.buttons.browse) ? '' : this.buttons.browse;\n this.buttons.clear = isNullOrUndefined(this.buttons.clear) ? '' : this.buttons.clear;\n this.buttons.upload = isNullOrUndefined(this.buttons.upload) ? '' : this.buttons.upload;\n this.renderButtonTemplates();\n break;\n case 'dropArea':\n this.unBindDropEvents();\n this.updateDropArea();\n break;\n case 'htmlAttributes':\n this.updateHTMLAttrToElement();\n this.updateHTMLAttrToWrapper();\n this.checkHTMLAttributes(true);\n break;\n case 'files':\n this.renderPreLoadFiles();\n break;\n case 'directoryUpload':\n this.updateDirectoryAttributes();\n break;\n case 'template':\n var ejInstance = getValue('ej2_instances', this.element);\n if (ejInstance[0].isReact) {\n this.reRenderFileList();\n }\n else {\n this.clearAll();\n }\n break;\n case 'minFileSize':\n case 'maxFileSize':\n case 'autoUpload':\n this.clearAll();\n break;\n case 'sequentialUpload':\n this.clearAll();\n break;\n case 'locale':\n this.l10n.setLocale(this.locale);\n this.setLocalizedTexts();\n this.preLocaleObj = getValue('currentLocale', this.l10n);\n break;\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n }\n }\n };\n Uploader.prototype.setLocalizedTexts = function () {\n if (isNullOrUndefined(this.template)) {\n if (typeof (this.buttons.browse) === 'string') {\n this.browseButton.innerText = (this.buttons.browse === 'Browse...') ?\n this.localizedTexts('Browse') : this.buttons.browse;\n this.browseButton.setAttribute('title', this.browseButton.innerText);\n if (this.uploadWrapper && !isNullOrUndefined(this.uploadWrapper.querySelector('.' + DROP_AREA))) {\n this.uploadWrapper.querySelector('.' + DROP_AREA).innerHTML = this.localizedTexts('dropFilesHint');\n }\n }\n this.updateFileList();\n }\n };\n Uploader.prototype.getKeyValue = function (val) {\n var keyValue;\n for (var _i = 0, _a = Object.keys(this.preLocaleObj); _i < _a.length; _i++) {\n var key = _a[_i];\n if (this.preLocaleObj[\"\" + key] === val) {\n keyValue = key;\n }\n }\n return keyValue;\n };\n Uploader.prototype.updateFileList = function () {\n var element;\n /* istanbul ignore next */\n if (this.fileList.length > 0 && !isNullOrUndefined(this.uploadWrapper.querySelector('.' + LIST_PARENT))) {\n for (var i = 0; i < this.fileList.length; i++) {\n element = this.fileList[i].querySelector('.e-file-status');\n element.innerHTML = this.localizedTexts(this.getKeyValue(this.filesData[i].status));\n this.filesData[i].status = this.localizedTexts(this.getKeyValue(this.filesData[i].status));\n if (this.fileList[i].classList.contains(UPLOAD_SUCCESS)) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('delete'));\n }\n if (this.fileList[i].querySelector('.e-file-play-btn')) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('resume'));\n }\n if (this.fileList[i].querySelector('.e-file-remove-btn')) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('remove'));\n }\n if (this.fileList[i].querySelector('.e-file-reload-btn')) {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('retry'));\n }\n if (!this.autoUpload) {\n this.uploadButton.innerText = (this.buttons.upload === 'Upload') ?\n this.localizedTexts('Upload') : this.buttons.upload;\n this.uploadButton.setAttribute('title', this.localizedTexts('Upload'));\n this.clearButton.innerText = (this.buttons.clear === 'Clear') ?\n this.localizedTexts('Clear') : this.buttons.clear;\n this.clearButton.setAttribute('title', this.localizedTexts('Clear'));\n }\n }\n }\n };\n Uploader.prototype.reRenderFileList = function () {\n if (this.listParent) {\n detach(this.listParent);\n this.listParent = null;\n this.fileList = [];\n this.internalCreateFileList(this.filesData);\n if (this.actionButtons) {\n this.removeActionButtons();\n this.renderActionButtons();\n this.checkActionButtonStatus();\n }\n }\n };\n Uploader.prototype.preRender = function () {\n this.localeText = { Browse: 'Browse...', Clear: 'Clear', Upload: 'Upload', invalidFileName: 'File Name is not allowed',\n dropFilesHint: 'Or drop files here', invalidMaxFileSize: 'File size is too large',\n invalidMinFileSize: 'File size is too small', invalidFileType: 'File type is not allowed',\n uploadFailedMessage: 'File failed to upload', uploadSuccessMessage: 'File uploaded successfully',\n removedSuccessMessage: 'File removed successfully', removedFailedMessage: 'Unable to remove file', inProgress: 'Uploading',\n readyToUploadMessage: 'Ready to upload', abort: 'Abort', remove: 'Remove', cancel: 'Cancel', delete: 'Delete file',\n pauseUpload: 'File upload paused', pause: 'Pause', resume: 'Resume', retry: 'Retry',\n fileUploadCancel: 'File upload canceled', invalidFileSelection: 'Invalid files selected', totalFiles: 'Total files',\n size: 'Size'\n };\n this.l10n = new L10n('uploader', this.localeText, this.locale);\n this.preLocaleObj = getValue('currentLocale', this.l10n);\n this.formRendered();\n this.updateHTMLAttrToElement();\n this.checkHTMLAttributes(false);\n var ejInstance = getValue('ej2_instances', this.element);\n /* istanbul ignore next */\n if (this.element.tagName === 'EJS-UPLOADER') {\n var inputElement = this.createElement('input', { attrs: { type: 'file' } });\n var index = 0;\n for (index; index < this.element.attributes.length; index++) {\n if (this.element.attributes[index].nodeName !== 'id') {\n inputElement.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);\n }\n else if (this.element.attributes[index].nodeName === 'id') {\n inputElement.setAttribute(this.element.attributes[index].nodeName, getUniqueID('uploader'));\n }\n inputElement.innerHTML = this.element.innerHTML;\n }\n if (!inputElement.hasAttribute('name')) {\n inputElement.setAttribute('name', 'UploadFiles');\n }\n this.element.appendChild(inputElement);\n this.element = inputElement;\n setValue('ej2_instances', ejInstance, this.element);\n }\n /* istanbul ignore next */\n if (ejInstance[0].isPureReactComponent) {\n if (!isNullOrUndefined(ejInstance[0].props.name)) {\n this.element.setAttribute('name', ejInstance[0].props.name);\n }\n else if (!isNullOrUndefined(ejInstance[0].props.id) && isNullOrUndefined(ejInstance[0].props.name)) {\n this.element.setAttribute('name', ejInstance[0].props.id);\n }\n else {\n this.element.setAttribute('name', 'UploadFiles');\n }\n }\n if (isNullOrUndefined(this.element.getAttribute('name'))) {\n this.element.setAttribute('name', this.element.getAttribute('id'));\n }\n if (!this.element.hasAttribute('type')) {\n this.element.setAttribute('type', 'file');\n }\n this.updateDirectoryAttributes();\n this.keyConfigs = {\n enter: 'enter'\n };\n if (this.element.hasAttribute('tabindex')) {\n this.tabIndex = this.element.getAttribute('tabindex');\n }\n this.browserName = Browser.info.name;\n this.uploaderName = this.element.getAttribute('name');\n };\n Uploader.prototype.formRendered = function () {\n var parentEle = closest(this.element, 'form');\n if (!isNullOrUndefined(parentEle)) {\n for (; parentEle && parentEle !== document.documentElement; parentEle = parentEle.parentElement) {\n if (parentEle.tagName === 'FORM') {\n this.isForm = true;\n this.formElement = parentEle;\n parentEle.setAttribute('enctype', 'multipart/form-data');\n parentEle.setAttribute('encoding', 'multipart/form-data');\n }\n }\n }\n };\n Uploader.prototype.getPersistData = function () {\n return this.addOnPersist(['filesData']);\n };\n /**\n * Return the module name of the component.\n *\n * @returns {string} Returns the component name.\n */\n Uploader.prototype.getModuleName = function () {\n return 'uploader';\n };\n Uploader.prototype.updateDirectoryAttributes = function () {\n if (this.directoryUpload) {\n this.element.setAttribute('directory', 'true');\n this.element.setAttribute('webkitdirectory', 'true');\n }\n else {\n this.element.removeAttribute('directory');\n this.element.removeAttribute('webkitdirectory');\n }\n };\n /**\n * To Initialize the control rendering\n *\n * @private\n * @returns {void}\n */\n Uploader.prototype.render = function () {\n this.renderBrowseButton();\n this.initializeUpload();\n this.updateHTMLAttrToWrapper();\n this.wireEvents();\n this.setMultipleSelection();\n this.setExtensions(this.allowedExtensions);\n this.setRTL();\n this.renderPreLoadFiles();\n this.setControlStatus();\n this.setCSSClass();\n };\n Uploader.prototype.renderBrowseButton = function () {\n this.browseButton = this.createElement('button', { className: 'e-css e-btn', attrs: { 'type': 'button' } });\n this.browseButton.setAttribute('tabindex', this.tabIndex);\n if (typeof (this.buttons.browse) === 'string') {\n this.browseButton.textContent = (this.buttons.browse === 'Browse...') ?\n this.localizedTexts('Browse') : this.buttons.browse;\n this.browseButton.setAttribute('title', this.browseButton.innerText);\n }\n else {\n this.browseButton.appendChild(this.buttons.browse);\n }\n this.element.setAttribute('aria-label', 'Uploader');\n };\n Uploader.prototype.renderActionButtons = function () {\n this.element.setAttribute('tabindex', '-1');\n this.actionButtons = this.createElement('div', { className: ACTION_BUTTONS });\n this.uploadButton = this.createElement('button', { className: UPLOAD_BUTTONS,\n attrs: { 'type': 'button', 'tabindex': this.btnTabIndex } });\n this.clearButton = this.createElement('button', { className: CLEAR_BUTTONS,\n attrs: { 'type': 'button', 'tabindex': this.btnTabIndex } });\n this.actionButtons.appendChild(this.clearButton);\n this.actionButtons.appendChild(this.uploadButton);\n this.renderButtonTemplates();\n this.uploadWrapper.appendChild(this.actionButtons);\n this.browseButton.blur();\n if (!this.isPreloadFiles) {\n this.uploadButton.focus();\n }\n this.wireActionButtonEvents();\n };\n /* istanbul ignore next */\n Uploader.prototype.serverActionButtonsEventBind = function (element) {\n if (element && !this.isForm) {\n this.browseButton.blur();\n this.actionButtons = element;\n this.uploadButton = this.actionButtons.querySelector('.e-file-upload-btn');\n this.clearButton = this.actionButtons.querySelector('.e-file-clear-btn');\n this.uploadButton.focus();\n this.unwireActionButtonEvents();\n this.wireActionButtonEvents();\n this.checkActionButtonStatus();\n }\n };\n Uploader.prototype.wireActionButtonEvents = function () {\n EventHandler.add(this.uploadButton, 'click', this.uploadButtonClick, this);\n EventHandler.add(this.clearButton, 'click', this.clearButtonClick, this);\n };\n Uploader.prototype.unwireActionButtonEvents = function () {\n EventHandler.remove(this.uploadButton, 'click', this.uploadButtonClick);\n EventHandler.remove(this.clearButton, 'click', this.clearButtonClick);\n };\n Uploader.prototype.removeActionButtons = function () {\n if (this.actionButtons) {\n this.unwireActionButtonEvents();\n detach(this.actionButtons);\n this.actionButtons = null;\n }\n };\n Uploader.prototype.renderButtonTemplates = function () {\n if (typeof (this.buttons.browse) === 'string') {\n this.browseButton.textContent = (this.buttons.browse === 'Browse...') ?\n this.localizedTexts('Browse') : this.buttons.browse;\n this.browseButton.setAttribute('title', this.browseButton.textContent);\n }\n else {\n this.browseButton.innerHTML = '';\n this.browseButton.appendChild(this.buttons.browse);\n }\n if (this.uploadButton) {\n var uploadText = isNullOrUndefined(this.buttons.upload) ? 'Upload' : this.buttons.upload;\n this.buttons.upload = uploadText;\n if (typeof (this.buttons.upload) === 'string') {\n this.uploadButton.textContent = (this.buttons.upload === 'Upload') ?\n this.localizedTexts('Upload') : this.buttons.upload;\n this.uploadButton.setAttribute('title', this.uploadButton.textContent);\n }\n else {\n this.uploadButton.innerHTML = '';\n this.uploadButton.appendChild(this.buttons.upload);\n }\n }\n if (this.clearButton) {\n var clearText = isNullOrUndefined(this.buttons.clear) ? 'Clear' : this.buttons.clear;\n this.buttons.clear = clearText;\n if (typeof (this.buttons.clear) === 'string') {\n this.clearButton.textContent = (this.buttons.clear === 'Clear') ?\n this.localizedTexts('Clear') : this.buttons.clear;\n this.clearButton.setAttribute('title', this.clearButton.textContent);\n }\n else {\n this.clearButton.innerHTML = '';\n this.clearButton.appendChild(this.buttons.clear);\n }\n }\n };\n Uploader.prototype.initializeUpload = function () {\n this.element.setAttribute('tabindex', '-1');\n var inputWrapper = this.createElement('span', { className: INPUT_WRAPPER });\n this.element.parentElement.insertBefore(inputWrapper, this.element);\n this.dropAreaWrapper = this.createElement('div', { className: DROP_WRAPPER });\n this.element.parentElement.insertBefore(this.dropAreaWrapper, this.element);\n inputWrapper.appendChild(this.element);\n this.dropAreaWrapper.appendChild(this.browseButton);\n this.dropAreaWrapper.appendChild(inputWrapper);\n this.uploadWrapper = this.createElement('div', { className: CONTROL_WRAPPER });\n this.dropAreaWrapper.parentElement.insertBefore(this.uploadWrapper, this.dropAreaWrapper);\n this.uploadWrapper.appendChild(this.dropAreaWrapper);\n this.setDropArea();\n };\n Uploader.prototype.renderPreLoadFiles = function () {\n if (this.files.length) {\n if (this.enablePersistence && this.filesData.length) {\n this.internalCreateFileList(this.filesData);\n return;\n }\n if (isNullOrUndefined(this.files[0].size)) {\n return;\n }\n this.isPreloadFiles = true;\n var files = [].slice.call(this.files);\n var filesData = [];\n if (!this.multiple) {\n this.clearData();\n files = [files[0]];\n }\n for (var _i = 0, files_1 = files; _i < files_1.length; _i++) {\n var data = files_1[_i];\n var fileData = {\n name: data.name + '.' + data.type.split('.')[data.type.split('.').length - 1],\n rawFile: '',\n size: data.size,\n status: this.localizedTexts('uploadSuccessMessage'),\n type: data.type,\n validationMessages: { minSize: '', maxSize: '' },\n statusCode: '2'\n };\n filesData.push(fileData);\n this.filesData.push(fileData);\n }\n this.internalCreateFileList(filesData);\n if (!this.autoUpload && this.listParent && !this.actionButtons && (!this.isForm || this.allowUpload()) && this.showFileList) {\n this.renderActionButtons();\n }\n this.checkActionButtonStatus();\n if (this.sequentialUpload) {\n this.count = this.filesData.length - 1;\n }\n this.isPreloadFiles = false;\n }\n };\n Uploader.prototype.checkActionButtonStatus = function () {\n if (this.actionButtons) {\n var length_1 = this.uploadWrapper.querySelectorAll('.' + VALIDATION_FAILS).length +\n this.uploadWrapper.querySelectorAll('.e-upload-fails:not(.e-upload-progress)').length +\n this.uploadWrapper.querySelectorAll('span.' + UPLOAD_SUCCESS).length +\n this.uploadWrapper.querySelectorAll('span.' + UPLOAD_INPROGRESS).length;\n if (length_1 > 0 && length_1 === this.uploadWrapper.querySelectorAll('li').length) {\n this.uploadButton.setAttribute('disabled', 'disabled');\n }\n else {\n this.uploadButton.removeAttribute('disabled');\n }\n }\n };\n Uploader.prototype.setDropArea = function () {\n var dropTextArea = this.dropAreaWrapper.querySelector('.e-file-drop');\n if (this.dropArea) {\n this.dropZoneElement = (typeof (this.dropArea) !== 'string') ? this.dropArea :\n select(this.dropArea, document);\n var element = this.element;\n var enableDropText = false;\n while (element.parentNode) {\n element = element.parentNode;\n if (element === this.dropZoneElement) {\n enableDropText = true;\n if (!dropTextArea) {\n this.createDropTextHint();\n }\n else {\n dropTextArea.innerHTML = this.localizedTexts('dropFilesHint');\n }\n }\n }\n if (!enableDropText && dropTextArea) {\n remove(dropTextArea);\n }\n }\n else if (!isNullOrUndefined(this.uploaderOptions) && this.uploaderOptions.dropArea === undefined) {\n this.createDropTextHint();\n this.dropZoneElement = this.uploadWrapper;\n this.setProperties({ dropArea: this.uploadWrapper }, true);\n }\n this.bindDropEvents();\n };\n Uploader.prototype.updateDropArea = function () {\n if (this.dropArea) {\n this.setDropArea();\n }\n else {\n this.dropZoneElement = null;\n var dropTextArea = this.dropAreaWrapper.querySelector('.e-file-drop');\n if (dropTextArea) {\n remove(dropTextArea);\n }\n }\n };\n Uploader.prototype.createDropTextHint = function () {\n var fileDropArea = this.createElement('span', { className: DROP_AREA });\n fileDropArea.innerHTML = this.localizedTexts('dropFilesHint');\n this.dropAreaWrapper.appendChild(fileDropArea);\n };\n Uploader.prototype.updateHTMLAttrToElement = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var pro = _a[_i];\n if (wrapperAttr.indexOf(pro) < 0) {\n this.element.setAttribute(pro, this.htmlAttributes[\"\" + pro]);\n }\n }\n }\n };\n Uploader.prototype.updateHTMLAttrToWrapper = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var pro = _a[_i];\n if (wrapperAttr.indexOf(pro) > -1) {\n if (pro === 'class') {\n var updatedClassValues = (this.htmlAttributes[\"\" + pro].replace(/\\s+/g, ' ')).trim();\n if (updatedClassValues !== '') {\n addClass([this.uploadWrapper], updatedClassValues.split(' '));\n }\n }\n else if (pro === 'style') {\n var uploadStyle = this.uploadWrapper.getAttribute(pro);\n uploadStyle = !isNullOrUndefined(uploadStyle) ? (uploadStyle + this.htmlAttributes[\"\" + pro]) :\n this.htmlAttributes[\"\" + pro];\n this.uploadWrapper.setAttribute(pro, uploadStyle);\n }\n else {\n this.uploadWrapper.setAttribute(pro, this.htmlAttributes[\"\" + pro]);\n }\n }\n }\n }\n };\n Uploader.prototype.setMultipleSelection = function () {\n if (this.multiple && !this.element.hasAttribute('multiple')) {\n var newAttr = document.createAttribute('multiple');\n newAttr.value = 'multiple';\n this.element.setAttributeNode(newAttr);\n }\n else if (!this.multiple) {\n this.element.removeAttribute('multiple');\n }\n };\n Uploader.prototype.checkAutoUpload = function (fileData) {\n if (this.autoUpload) {\n if (this.sequentialUpload) {\n /* istanbul ignore next */\n this.sequenceUpload(fileData);\n }\n else {\n this.upload(fileData);\n }\n this.removeActionButtons();\n }\n else if (!this.actionButtons) {\n this.renderActionButtons();\n }\n this.checkActionButtonStatus();\n };\n Uploader.prototype.sequenceUpload = function (fileData) {\n if (this.filesData.length - fileData.length === 0 ||\n this.filesData[(this.filesData.length - fileData.length - 1)].statusCode !== '1') {\n if (this.multiple || this.count < 0) {\n ++this.count;\n }\n var isFileListCreated = this.showFileList ? false : true;\n if (typeof this.filesData[this.count] === 'object') {\n this.isFirstFileOnSelection = false;\n this.upload(this.filesData[this.count], isFileListCreated);\n if (this.filesData[this.count].statusCode === '0') {\n this.sequenceUpload(fileData);\n }\n }\n else {\n --this.count;\n }\n }\n };\n Uploader.prototype.setCSSClass = function (oldCSSClass) {\n var updatedOldCssClass = oldCSSClass;\n if (!isNullOrUndefined(oldCSSClass)) {\n updatedOldCssClass = (oldCSSClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(oldCSSClass) && updatedOldCssClass !== '') {\n removeClass([this.uploadWrapper], updatedOldCssClass.split(' '));\n }\n var updatedCssClassValue = this.cssClass;\n if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {\n updatedCssClassValue = (this.cssClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(this.cssClass) && updatedCssClassValue !== '') {\n addClass([this.uploadWrapper], updatedCssClassValue.split(updatedCssClassValue.indexOf(',') > -1 ? ',' : ' '));\n }\n };\n Uploader.prototype.wireEvents = function () {\n EventHandler.add(this.browseButton, 'click', this.browseButtonClick, this);\n EventHandler.add(this.element, 'change', this.onSelectFiles, this);\n EventHandler.add(document, 'click', this.removeFocus, this);\n this.keyboardModule = new KeyboardEvents(this.uploadWrapper, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: this.keyConfigs,\n eventName: 'keydown'\n });\n if (this.isForm) {\n EventHandler.add(this.formElement, 'reset', this.resetForm, this);\n }\n };\n Uploader.prototype.unWireEvents = function () {\n EventHandler.remove(this.browseButton, 'click', this.browseButtonClick);\n EventHandler.remove(this.element, 'change', this.onSelectFiles);\n EventHandler.remove(document, 'click', this.removeFocus);\n if (this.isForm) {\n EventHandler.remove(this.formElement, 'reset', this.resetForm);\n }\n if (this.keyboardModule) {\n this.keyboardModule.destroy();\n }\n };\n Uploader.prototype.resetForm = function () {\n this.clearAll();\n };\n Uploader.prototype.keyActionHandler = function (e) {\n var targetElement = e.target;\n switch (e.action) {\n case 'enter':\n if (e.target === this.clearButton) {\n this.clearButtonClick();\n }\n else if (e.target === this.uploadButton) {\n this.uploadButtonClick();\n }\n else if (e.target === this.browseButton) {\n this.browseButtonClick();\n }\n else if (targetElement.classList.contains(PAUSE_UPLOAD)) {\n var metaData = this.getCurrentMetaData(null, e);\n metaData.file.statusCode = '4';\n metaData.file.status = this.localizedTexts('pauseUpload');\n this.abortUpload(metaData, false);\n }\n else if (targetElement.classList.contains(RESUME_UPLOAD)) {\n this.resumeUpload(this.getCurrentMetaData(null, e), e);\n }\n else if (targetElement.classList.contains(RETRY_ICON)) {\n var metaData = this.getCurrentMetaData(null, e);\n if (!isNullOrUndefined(metaData)) {\n metaData.file.statusCode = '1';\n metaData.file.status = this.localizedTexts('readyToUploadMessage');\n this.chunkUpload(metaData.file);\n }\n else {\n var target = e.target.parentElement;\n var fileData = this.filesData[this.fileList.indexOf(target)];\n this.retry(fileData);\n }\n }\n else {\n this.removeFiles(e);\n if (!targetElement.classList.contains(ABORT_ICON)) {\n this.browseButton.focus();\n }\n }\n e.preventDefault();\n e.stopPropagation();\n break;\n }\n };\n Uploader.prototype.getCurrentMetaData = function (fileInfo, e) {\n var fileData;\n var targetMetaData;\n if (isNullOrUndefined(fileInfo)) {\n var target = e.target.parentElement;\n fileData = this.filesData[this.fileList.indexOf(target)];\n }\n else {\n fileData = fileInfo;\n }\n for (var i = 0; i < this.uploadMetaData.length; i++) {\n if (this.uploadMetaData[i].file.name === fileData.name) {\n targetMetaData = this.uploadMetaData[i];\n }\n }\n return targetMetaData;\n };\n Uploader.prototype.removeFocus = function () {\n if (this.uploadWrapper && this.listParent && this.listParent.querySelector('.' + ICON_FOCUSED)) {\n document.activeElement.blur();\n this.listParent.querySelector('.' + ICON_FOCUSED).classList.remove(ICON_FOCUSED);\n }\n };\n Uploader.prototype.browseButtonClick = function () {\n this.element.click();\n };\n Uploader.prototype.uploadButtonClick = function () {\n if (this.sequentialUpload) {\n this.sequenceUpload(this.filesData);\n }\n else {\n this.upload(this.filesData);\n }\n };\n Uploader.prototype.clearButtonClick = function () {\n this.clearAll();\n /* istanbul ignore next */\n if (this.sequentialUpload) {\n this.count = -1;\n }\n this.actionCompleteCount = 0;\n };\n Uploader.prototype.bindDropEvents = function () {\n if (this.dropZoneElement) {\n EventHandler.add(this.dropZoneElement, 'drop', this.dropElement, this);\n EventHandler.add(this.dropZoneElement, 'dragover', this.dragHover, this);\n EventHandler.add(this.dropZoneElement, 'dragleave', this.onDragLeave, this);\n EventHandler.add(this.dropZoneElement, 'paste', this.onPasteFile, this);\n EventHandler.add(this.dropZoneElement, 'dragenter', this.onDragEnter, this);\n }\n };\n Uploader.prototype.unBindDropEvents = function () {\n if (this.dropZoneElement) {\n EventHandler.remove(this.dropZoneElement, 'drop', this.dropElement);\n EventHandler.remove(this.dropZoneElement, 'dragover', this.dragHover);\n EventHandler.remove(this.dropZoneElement, 'dragleave', this.onDragLeave);\n EventHandler.remove(this.dropZoneElement, 'dragenter', this.onDragEnter);\n }\n };\n Uploader.prototype.onDragEnter = function (e) {\n if (!this.enabled) {\n return;\n }\n this.dropZoneElement.classList.add(DRAG_HOVER);\n this.dragCounter = this.dragCounter + 1;\n e.preventDefault();\n e.stopPropagation();\n };\n Uploader.prototype.onDragLeave = function () {\n if (!this.enabled) {\n return;\n }\n this.dragCounter = this.dragCounter - 1;\n if (!this.dragCounter) {\n this.dropZoneElement.classList.remove(DRAG_HOVER);\n }\n };\n Uploader.prototype.dragHover = function (e) {\n if (!this.enabled) {\n return;\n }\n if (this.dropEffect !== 'Default') {\n e.dataTransfer.dropEffect = this.dropEffect.toLowerCase();\n }\n e.preventDefault();\n e.stopPropagation();\n };\n /* istanbul ignore next */\n Uploader.prototype.dropElement = function (e) {\n this.dragCounter = 0;\n this.dropZoneElement.classList.remove(DRAG_HOVER);\n this.onSelectFiles(e);\n e.preventDefault();\n e.stopPropagation();\n };\n /* istanbul ignore next */\n Uploader.prototype.onPasteFile = function (event) {\n var item = event.clipboardData.items;\n if (event.type === 'paste' && this.browserName !== 'msie' && this.browserName !== 'edge' && this.browserName !== 'safari') {\n this.element.files = event.clipboardData.files;\n }\n if (item.length !== 1 && !this.multiple) {\n return;\n }\n for (var file = 0; file < item.length; file++) {\n var pasteFile = [].slice.call(item)[file];\n if ((pasteFile.kind === 'file') || pasteFile.type.match('^image/')) {\n this.renderSelectedFiles(event, [pasteFile.getAsFile()], false, true);\n }\n }\n };\n Uploader.prototype.getSelectedFiles = function (index) {\n var data = [];\n var liElement = this.fileList[index];\n var allFiles = this.getFilesData();\n var nameElements = +liElement.getAttribute('data-files-count');\n var startIndex = 0;\n for (var i = 0; i < index; i++) {\n startIndex += (+this.fileList[i].getAttribute('data-files-count'));\n }\n for (var j = startIndex; j < (startIndex + nameElements); j++) {\n data.push(allFiles[j]);\n }\n return data;\n };\n Uploader.prototype.removeFiles = function (args) {\n if (!this.enabled) {\n return;\n }\n var selectedElement = args.target.parentElement;\n var index = this.fileList.indexOf(selectedElement);\n var liElement = this.fileList[index];\n var formUpload = this.isFormUpload();\n var fileData = formUpload ? this.getSelectedFiles(index) : this.getFilesInArray(this.filesData[index]);\n if (isNullOrUndefined(fileData)) {\n return;\n }\n if (args.target.classList.contains(ABORT_ICON) && !formUpload) {\n fileData[0].statusCode = '5';\n if (!isNullOrUndefined(liElement)) {\n var spinnerTarget = liElement.querySelector('.' + ABORT_ICON);\n createSpinner({ target: spinnerTarget, width: '20px' });\n showSpinner(spinnerTarget);\n }\n if (this.sequentialUpload) {\n /* istanbul ignore next */\n this.uploadSequential();\n }\n if (!(liElement.classList.contains(RESTRICT_RETRY))) {\n this.checkActionComplete(true);\n }\n }\n else if (!closest(args.target, '.' + SPINNER_PANE)) {\n this.remove(fileData, false, false, true, args);\n }\n this.checkActionButtonStatus();\n };\n Uploader.prototype.removeFilesData = function (file, customTemplate) {\n var index;\n if (customTemplate) {\n if (!this.showFileList) {\n index = this.filesData.indexOf(file);\n this.filesData.splice(index, 1);\n }\n return;\n }\n var selectedElement = this.getLiElement(file);\n if (isNullOrUndefined(selectedElement)) {\n return;\n }\n this.element.value = '';\n detach(selectedElement);\n index = this.fileList.indexOf(selectedElement);\n this.fileList.splice(index, 1);\n this.filesData.splice(index, 1);\n if (this.fileList.length === 0 && !isNullOrUndefined(this.listParent)) {\n detach(this.listParent);\n this.listParent = null;\n this.removeActionButtons();\n }\n if (this.sequentialUpload) {\n /* istanbul ignore next */\n if (index <= this.count) {\n --this.count;\n }\n }\n };\n Uploader.prototype.removeUploadedFile = function (file, eventArgs, removeDirectly, custom) {\n var _this = this;\n var selectedFiles = file;\n var ajax = new Ajax(this.asyncSettings.removeUrl, 'POST', true, null);\n ajax.emitError = false;\n var formData = new FormData();\n ajax.beforeSend = function (e) {\n eventArgs.currentRequest = ajax.httpRequest;\n if (!removeDirectly) {\n _this.trigger('removing', eventArgs, function (eventArgs) {\n if (eventArgs.cancel) {\n e.cancel = true;\n }\n else {\n _this.removingEventCallback(eventArgs, formData, selectedFiles, file);\n }\n });\n }\n else {\n _this.removingEventCallback(eventArgs, formData, selectedFiles, file);\n }\n };\n ajax.onLoad = function (e) {\n _this.removeCompleted(e, selectedFiles, custom);\n return {};\n };\n /* istanbul ignore next */\n ajax.onError = function (e) {\n _this.removeFailed(e, selectedFiles, custom);\n return {};\n };\n ajax.send(formData);\n };\n Uploader.prototype.removingEventCallback = function (eventArgs, formData, selectedFiles, file) {\n /* istanbul ignore next */\n var name = this.element.getAttribute('name');\n var liElement = this.getLiElement(file);\n if (!isNullOrUndefined(liElement) && (!isNullOrUndefined(liElement.querySelector('.' + DELETE_ICON)) ||\n !isNullOrUndefined(liElement.querySelector('.' + REMOVE_ICON)))) {\n var spinnerTarget = liElement.querySelector('.' + DELETE_ICON) ?\n liElement.querySelector('.' + DELETE_ICON) :\n liElement.querySelector('.' + REMOVE_ICON);\n createSpinner({ target: spinnerTarget, width: '20px' });\n showSpinner(spinnerTarget);\n }\n if (eventArgs.postRawFile && !isNullOrUndefined(selectedFiles.rawFile) && selectedFiles.rawFile !== '') {\n formData.append(name, selectedFiles.rawFile, selectedFiles.name);\n }\n else {\n formData.append(name, selectedFiles.name);\n }\n this.updateFormData(formData, eventArgs.customFormData);\n };\n /* istanbul ignore next */\n Uploader.prototype.updateFormData = function (formData, customData) {\n if (customData.length > 0 && customData[0]) {\n var _loop_1 = function (i) {\n var data = customData[i];\n // eslint-disable-next-line @typescript-eslint/tslint/config\n var value = Object.keys(data).map(function (e) {\n return data[\"\" + e];\n });\n formData.append(Object.keys(data)[0], value);\n };\n for (var i = 0; i < customData.length; i++) {\n _loop_1(i);\n }\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.updateCustomheader = function (request, currentRequest) {\n if (currentRequest.length > 0 && currentRequest[0]) {\n var _loop_2 = function (i) {\n var data = currentRequest[i];\n // eslint-disable-next-line @typescript-eslint/tslint/config\n var value = Object.keys(data).map(function (e) {\n return data[\"\" + e];\n });\n request.setRequestHeader(Object.keys(data)[0], value);\n };\n for (var i = 0; i < currentRequest.length; i++) {\n _loop_2(i);\n }\n }\n };\n Uploader.prototype.removeCompleted = function (e, files, customTemplate) {\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var status = e.target;\n if (status.readyState === 4 && status.status >= 200 && status.status <= 299) {\n var args = {\n e: e, response: response, operation: 'remove', file: this.updateStatus(files, this.localizedTexts('removedSuccessMessage'), '2')\n };\n this.trigger('success', args);\n this.removeFilesData(files, customTemplate);\n var index = this.uploadedFilesData.indexOf(files);\n this.uploadedFilesData.splice(index, 1);\n this.trigger('change', { files: this.uploadedFilesData });\n }\n else {\n this.removeFailed(e, files, customTemplate);\n }\n };\n Uploader.prototype.removeFailed = function (e, files, customTemplate) {\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var args = {\n e: e, response: response, operation: 'remove', file: this.updateStatus(files, this.localizedTexts('removedFailedMessage'), '0')\n };\n if (!customTemplate) {\n var index = this.filesData.indexOf(files);\n var rootElement = this.fileList[index];\n if (rootElement) {\n rootElement.classList.remove(UPLOAD_SUCCESS);\n rootElement.classList.add(UPLOAD_FAILED);\n var statusElement = rootElement.querySelector('.' + STATUS);\n if (statusElement) {\n statusElement.classList.remove(UPLOAD_SUCCESS);\n statusElement.classList.add(UPLOAD_FAILED);\n }\n }\n this.checkActionButtonStatus();\n }\n this.trigger('failure', args);\n var liElement = this.getLiElement(files);\n /* istanbul ignore next */\n if (!isNullOrUndefined(liElement) && !isNullOrUndefined(liElement.querySelector('.' + DELETE_ICON))) {\n var spinnerTarget = liElement.querySelector('.' + DELETE_ICON);\n hideSpinner(spinnerTarget);\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.getFilesFromFolder = function (event) {\n this.filesEntries = [];\n var items = this.multiple ?\n event.dataTransfer.items : [event.dataTransfer.items[0]];\n var validDirectoryUpload = this.checkDirectoryUpload(items);\n if (!validDirectoryUpload) {\n return;\n }\n var _loop_3 = function (i) {\n var item = items[i].webkitGetAsEntry();\n if (item.isFile) {\n var files_2 = [];\n (item).file(function (fileObj) {\n var path = item.fullPath;\n files_2.push({ 'path': path, 'file': fileObj });\n });\n this_1.renderSelectedFiles(event, files_2, true);\n }\n else if (item.isDirectory) {\n this_1.traverseFileTree(item, event);\n }\n };\n var this_1 = this;\n for (var i = 0; i < items.length; i++) {\n _loop_3(i);\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.checkDirectoryUpload = function (items) {\n for (var i = 0; items && i < items.length; i++) {\n var item = items[i].webkitGetAsEntry();\n if (item.isDirectory) {\n return true;\n }\n }\n return false;\n };\n /* eslint-disable @typescript-eslint/explicit-module-boundary-types */\n /* istanbul ignore next */\n Uploader.prototype.traverseFileTree = function (item, event) {\n /* eslint-enable @typescript-eslint/explicit-module-boundary-types */\n if (item.isFile) {\n this.filesEntries.push(item);\n }\n else if (item.isDirectory) {\n var directoryReader = item.createReader();\n this.readFileFromDirectory(directoryReader, event);\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.readFileFromDirectory = function (directoryReader, event) {\n var _this = this;\n directoryReader.readEntries(function (entries) {\n for (var i = 0; i < entries.length; i++) {\n _this.traverseFileTree(entries[i], event);\n }\n _this.pushFilesEntries(event);\n if (entries.length) {\n _this.readFileFromDirectory(directoryReader);\n }\n });\n };\n Uploader.prototype.pushFilesEntries = function (event) {\n var _this = this;\n var files = [];\n var _loop_4 = function (i) {\n this_2.filesEntries[i].file(function (fileObj) {\n if (_this.filesEntries.length) {\n var path = _this.filesEntries[i].fullPath;\n files.push({ 'path': path, 'file': fileObj });\n if (i === _this.filesEntries.length - 1) {\n _this.filesEntries = [];\n _this.renderSelectedFiles(event, files, true);\n }\n }\n });\n };\n var this_2 = this;\n for (var i = 0; i < this.filesEntries.length; i++) {\n _loop_4(i);\n }\n };\n Uploader.prototype.onSelectFiles = function (args) {\n if (!this.enabled) {\n return;\n }\n var targetFiles;\n /* istanbul ignore next */\n if (args.type === 'drop') {\n if (this.directoryUpload) {\n this.getFilesFromFolder(args);\n }\n else {\n var files = this.sortFilesList = args.dataTransfer.files;\n if (this.browserName !== 'msie' && this.browserName !== 'edge' && this.browserName !== 'safari') {\n this.element.files = files;\n }\n if (files.length > 0) {\n targetFiles = this.multiple ? this.sortFileList(files) : [files[0]];\n this.renderSelectedFiles(args, targetFiles);\n }\n }\n }\n else {\n targetFiles = [].slice.call(args.target.files);\n this.renderSelectedFiles(args, targetFiles);\n }\n if (this.isAngular || this.isReact) {\n args.stopPropagation();\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.getBase64 = function (file) {\n return new Promise(function (resolve, reject) {\n var fileReader = new FileReader();\n fileReader.readAsDataURL(file);\n fileReader.onload = function () { return resolve(fileReader.result); };\n fileReader.onerror = function (error) { return reject(error); };\n });\n };\n /* istanbul ignore next */\n /* tslint:ignore */\n Uploader.prototype.renderSelectedFiles = function (args, targetFiles, directory, paste) {\n var _this = this;\n this.base64String = [];\n var eventArgs = {\n event: args,\n cancel: false,\n filesData: [],\n isModified: false,\n modifiedFilesData: [],\n progressInterval: '',\n isCanceled: false,\n currentRequest: null,\n customFormData: null\n };\n /* istanbul ignore next */\n if (targetFiles.length < 1) {\n eventArgs.isCanceled = true;\n this.trigger('selected', eventArgs);\n return;\n }\n this.flag = true;\n var fileData = [];\n if (!this.multiple) {\n this.clearData(true);\n this.actionCompleteCount = 0;\n targetFiles = [targetFiles[0]];\n }\n for (var i = 0; i < targetFiles.length; i++) {\n var file = directory ? targetFiles[i].file : targetFiles[i];\n this.updateInitialFileDetails(args, targetFiles, file, i, fileData, directory, paste);\n }\n eventArgs.filesData = fileData;\n if (this.allowedExtensions.indexOf('*') > -1) {\n this.allTypes = true;\n }\n if (this.enableHtmlSanitizer) {\n for (var i = 0; i < fileData.length; i++) {\n var sanitizeFile = SanitizeHtmlHelper.beforeSanitize();\n var sanitizeFileName = SanitizeHtmlHelper.serializeValue(sanitizeFile, fileData[parseInt(i.toString())].name);\n var currentFileName = fileData[parseInt(i.toString())].name;\n var isUTF8 = false;\n for (var i_1 = 0; i_1 < currentFileName.length; i_1++) {\n if (currentFileName.charCodeAt(i_1) > 127) {\n isUTF8 = true;\n break;\n }\n }\n var htmlTagRegex = /<([a-z][a-z0-9]*)\\b[^>]*>(.*?)<\\/\\1>/i;\n var hasHTMLString = htmlTagRegex.test(currentFileName);\n if ((sanitizeFileName !== fileData[parseInt(i.toString())].name) && !(isUTF8 && !hasHTMLString)) {\n var encodedFileName = targetFiles[parseInt(i.toString())].name.replace(/[\\u00A0-\\u9999<>\\&]/g, function (i) {\n return '&#' + i.charCodeAt(0) + ';';\n });\n fileData[parseInt(i.toString())].name = encodedFileName;\n fileData[parseInt(i.toString())].status = this.localizedTexts('invalidFileName');\n fileData[parseInt(i.toString())].statusCode = '0';\n }\n }\n }\n if (!this.allTypes) {\n fileData = this.checkExtension(fileData);\n }\n this.trigger('selected', eventArgs, function (eventArgs) {\n _this._internalRenderSelect(eventArgs, fileData);\n });\n };\n Uploader.prototype.updateInitialFileDetails = function (args, \n // eslint-disable-next-line @typescript-eslint/indent\n targetFiles, file, i, fileData, directory, paste) {\n var fileName = directory ? targetFiles[i].path.substring(1, targetFiles[i].path.length) : paste ?\n getUniqueID(file.name.substring(0, file.name.lastIndexOf('.'))) + '.' + this.getFileType(file.name) :\n this.directoryUpload ? targetFiles[i].webkitRelativePath : file.name;\n var fileDetails = {\n name: fileName,\n rawFile: file,\n size: file.size,\n status: this.localizedTexts('readyToUploadMessage'),\n type: this.getFileType(file.name),\n validationMessages: this.validatedFileSize(file.size),\n statusCode: '1',\n id: getUniqueID(file.name.substring(0, file.name.lastIndexOf('.'))) + '.' + this.getFileType(file.name)\n };\n /* istanbul ignore next */\n if (paste) {\n fileDetails.fileSource = 'paste';\n }\n fileDetails.status = fileDetails.validationMessages.minSize !== '' ? this.localizedTexts('invalidMinFileSize') :\n fileDetails.validationMessages.maxSize !== '' ? this.localizedTexts('invalidMaxFileSize') : fileDetails.status;\n if (fileDetails.validationMessages.minSize !== '' || fileDetails.validationMessages.maxSize !== '') {\n fileDetails.statusCode = '0';\n }\n fileData.push(fileDetails);\n };\n Uploader.prototype._internalRenderSelect = function (eventArgs, fileData) {\n if (!eventArgs.cancel) {\n /* istanbul ignore next */\n this.selectedFiles = this.selectedFiles.concat(fileData);\n this.btnTabIndex = this.disableKeyboardNavigation ? '-1' : '0';\n if (this.showFileList) {\n if (eventArgs.isModified && eventArgs.modifiedFilesData.length > 0) {\n for (var j = 0; j < eventArgs.modifiedFilesData.length; j++) {\n for (var k = 0; k < fileData.length; k++) {\n if (eventArgs.modifiedFilesData[j].id === fileData[k].id) {\n eventArgs.modifiedFilesData[j].rawFile = fileData[k].rawFile;\n }\n }\n }\n var dataFiles = this.allTypes ? eventArgs.modifiedFilesData :\n this.checkExtension(eventArgs.modifiedFilesData);\n this.updateSortedFileList(dataFiles);\n this.filesData = this.filesData.concat(dataFiles);\n if (!this.isForm || this.allowUpload()) {\n this.checkAutoUpload(dataFiles);\n }\n }\n else {\n this.internalCreateFileList(fileData);\n if (this.autoUpload && this.sequenceUpload && this.sequentialUpload && this.filesData.length > 0 && this.filesData[this.filesData.length - 1].statusCode !== '2' && this.filesData[this.filesData.length - 1].statusCode !== '0') {\n this.filesData = this.filesData.concat(fileData);\n return;\n }\n this.filesData = this.filesData.concat(fileData);\n if (!this.isForm || this.allowUpload()) {\n this.checkAutoUpload(fileData);\n }\n }\n if (!isNullOrUndefined(eventArgs.progressInterval) && eventArgs.progressInterval !== '') {\n this.progressInterval = eventArgs.progressInterval;\n }\n }\n else {\n this.filesData = this.filesData.concat(fileData);\n if (this.autoUpload) {\n this.upload(this.filesData, true);\n }\n }\n for (var item = 0; item < this.filesData.length; item++) {\n if (this.filesData[item].statusCode === '0') {\n this.checkActionComplete(true);\n }\n }\n this.isFirstFileOnSelection = true;\n }\n };\n Uploader.prototype.allowUpload = function () {\n var allowFormUpload = false;\n if (this.isForm && (!isNullOrUndefined(this.asyncSettings.saveUrl) && this.asyncSettings.saveUrl !== '')) {\n allowFormUpload = true;\n }\n return allowFormUpload;\n };\n Uploader.prototype.isFormUpload = function () {\n var isFormUpload = false;\n if (this.isForm && ((isNullOrUndefined(this.asyncSettings.saveUrl) || this.asyncSettings.saveUrl === '')\n && (isNullOrUndefined(this.asyncSettings.removeUrl) || this.asyncSettings.removeUrl === ''))) {\n isFormUpload = true;\n }\n return isFormUpload;\n };\n Uploader.prototype.clearData = function (singleUpload) {\n if (!isNullOrUndefined(this.listParent)) {\n detach(this.listParent);\n this.listParent = null;\n }\n if (this.browserName !== 'msie' && !singleUpload) {\n this.element.value = '';\n }\n this.fileList = [];\n this.filesData = [];\n this.removeActionButtons();\n };\n Uploader.prototype.updateSortedFileList = function (filesData) {\n var previousListClone = this.createElement('div', { id: 'clonewrapper' });\n var added = -1;\n var removedList;\n if (this.listParent) {\n for (var i = 0; i < this.listParent.querySelectorAll('li').length; i++) {\n var liElement = this.listParent.querySelectorAll('li')[i];\n previousListClone.appendChild(liElement.cloneNode(true));\n }\n this.removeActionButtons();\n var oldList = [].slice.call(previousListClone.childNodes);\n this.createParentUL();\n for (var index = 0; index < filesData.length; index++) {\n for (var j = 0; j < this.filesData.length; j++) {\n if (this.filesData[j].name === filesData[index].name) {\n this.listParent.appendChild(oldList[j]);\n EventHandler.add(oldList[j].querySelector('.e-icons'), 'click', this.removeFiles, this);\n this.fileList.push(oldList[j]);\n added = index;\n }\n }\n if (added !== index) {\n this.internalCreateFileList([filesData[index]]);\n }\n }\n }\n else {\n this.internalCreateFileList(filesData);\n }\n };\n Uploader.prototype.isBlank = function (str) {\n return (!str || /^\\s*$/.test(str));\n };\n Uploader.prototype.checkExtension = function (files) {\n var dropFiles = files;\n if (!this.isBlank(this.allowedExtensions)) {\n var allowedExtensions = [];\n var extensions = this.allowedExtensions.split(',');\n for (var _i = 0, extensions_1 = extensions; _i < extensions_1.length; _i++) {\n var extension = extensions_1[_i];\n allowedExtensions.push(extension.trim().toLocaleLowerCase());\n }\n for (var i = 0; i < files.length; i++) {\n var checkFileType = files[i].type.indexOf(\".\") !== -1 ? files[i].type.replace(\".\", \"\") : files[i].type;\n if (allowedExtensions.indexOf(('.' + checkFileType).toLocaleLowerCase()) === -1) {\n files[i].status = this.localizedTexts('invalidFileType');\n files[i].statusCode = '0';\n }\n }\n }\n return dropFiles;\n };\n Uploader.prototype.validatedFileSize = function (fileSize) {\n var minSizeError = '';\n var maxSizeError = '';\n if (fileSize < this.minFileSize) {\n minSizeError = this.localizedTexts('invalidMinFileSize');\n }\n else if (fileSize > this.maxFileSize) {\n maxSizeError = this.localizedTexts('invalidMaxFileSize');\n }\n else {\n minSizeError = '';\n maxSizeError = '';\n }\n var errorMessage = { minSize: minSizeError, maxSize: maxSizeError };\n return errorMessage;\n };\n Uploader.prototype.isPreLoadFile = function (fileData) {\n var isPreload = false;\n for (var i = 0; i < this.files.length; i++) {\n if (this.files[i].name === fileData.name.slice(0, fileData.name.lastIndexOf('.')) && this.files[i].type === fileData.type) {\n isPreload = true;\n }\n }\n return isPreload;\n };\n Uploader.prototype.createCustomfileList = function (fileData) {\n this.createParentUL();\n for (var _i = 0, fileData_1 = fileData; _i < fileData_1.length; _i++) {\n var listItem = fileData_1[_i];\n var listElement = this.createElement('li', { className: FILE, attrs: { 'data-file-name': listItem.name } });\n this.uploadTemplateFn = this.templateComplier(this.template);\n var liTempCompiler = this.uploadTemplateFn(listItem, this, 'template', this.element.id + 'Template', this.isStringTemplate, null, listElement);\n if (liTempCompiler) {\n var fromElements = [].slice.call(liTempCompiler);\n append(fromElements, listElement);\n }\n var index = fileData.indexOf(listItem);\n var eventArgs = {\n element: listElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n var eventsArgs = {\n element: listElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n this.trigger('rendering', eventArgs);\n this.trigger('fileListRendering', eventsArgs);\n this.listParent.appendChild(listElement);\n this.fileList.push(listElement);\n }\n this.renderReactTemplates();\n };\n Uploader.prototype.createParentUL = function () {\n if (isNullOrUndefined(this.listParent)) {\n this.listParent = this.createElement('ul', { className: LIST_PARENT });\n this.uploadWrapper.appendChild(this.listParent);\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Uploader.prototype.formFileList = function (fileData, files) {\n var fileList = this.createElement('li', { className: FILE });\n fileList.setAttribute('data-files-count', fileData.length + '');\n var fileContainer = this.createElement('span', { className: TEXT_CONTAINER });\n var statusMessage;\n for (var _i = 0, fileData_2 = fileData; _i < fileData_2.length; _i++) {\n var listItem = fileData_2[_i];\n var fileNameEle = this.createElement('span', { className: FILE_NAME });\n fileNameEle.innerHTML = this.getFileNameOnly(listItem.name);\n var fileTypeEle = this.createElement('span', { className: FILE_TYPE });\n var fileType = this.getFileType(listItem.name);\n fileTypeEle.innerHTML = '.' + fileType;\n if (!fileType) {\n fileTypeEle.classList.add('e-hidden');\n }\n if (!this.enableRtl) {\n fileContainer.appendChild(fileNameEle);\n fileContainer.appendChild(fileTypeEle);\n }\n else {\n var rtlContainer = this.createElement('span', { className: RTL_CONTAINER });\n rtlContainer.appendChild(fileTypeEle);\n rtlContainer.appendChild(fileNameEle);\n fileContainer.appendChild(rtlContainer);\n }\n this.truncateName(fileNameEle);\n statusMessage = this.formValidateFileInfo(listItem, fileList);\n }\n fileList.appendChild(fileContainer);\n this.setListToFileInfo(fileData, fileList);\n var index = this.listParent.querySelectorAll('li').length;\n var infoEle = this.createElement('span');\n if (fileList.classList.contains(INVALID_FILE)) {\n infoEle.classList.add(STATUS);\n infoEle.classList.add(INVALID_FILE);\n infoEle.innerText = fileData.length > 1 ? this.localizedTexts('invalidFileSelection') : statusMessage;\n }\n else {\n infoEle.classList.add(fileData.length > 1 ? INFORMATION : FILE_SIZE);\n infoEle.innerText = fileData.length > 1 ? this.localizedTexts('totalFiles') + ': ' + fileData.length + ' , '\n + this.localizedTexts('size') + ': ' +\n this.bytesToSize(this.getFileSize(fileData)) : this.bytesToSize(fileData[0].size);\n this.createFormInput(fileData);\n }\n fileContainer.appendChild(infoEle);\n if (isNullOrUndefined(fileList.querySelector('.e-icons'))) {\n var iconElement = this.createElement('span', { className: 'e-icons', attrs: { 'tabindex': this.btnTabIndex } });\n /* istanbul ignore next */\n if (this.browserName === 'msie') {\n iconElement.classList.add('e-msie');\n }\n iconElement.setAttribute('title', this.localizedTexts('remove'));\n fileList.appendChild(fileContainer);\n fileList.appendChild(iconElement);\n EventHandler.add(iconElement, 'click', this.removeFiles, this);\n iconElement.classList.add(REMOVE_ICON);\n }\n var eventArgs = {\n element: fileList,\n fileInfo: this.mergeFileInfo(fileData, fileList),\n index: index,\n isPreload: this.isPreLoadFile(this.mergeFileInfo(fileData, fileList))\n };\n var eventsArgs = {\n element: fileList,\n fileInfo: this.mergeFileInfo(fileData, fileList),\n index: index,\n isPreload: this.isPreLoadFile(this.mergeFileInfo(fileData, fileList))\n };\n this.trigger('rendering', eventArgs);\n this.trigger('fileListRendering', eventsArgs);\n this.listParent.appendChild(fileList);\n this.fileList.push(fileList);\n };\n Uploader.prototype.formValidateFileInfo = function (listItem, fileList) {\n var statusMessage = listItem.status;\n var validationMessages = this.validatedFileSize(listItem.size);\n if (validationMessages.minSize !== '' || validationMessages.maxSize !== '') {\n this.addInvalidClass(fileList);\n statusMessage = validationMessages.minSize !== '' ? this.localizedTexts('invalidMinFileSize') :\n validationMessages.maxSize !== '' ? this.localizedTexts('invalidMaxFileSize') : statusMessage;\n }\n var typeValidationMessage = this.checkExtension(this.getFilesInArray(listItem))[0].status;\n if (typeValidationMessage === this.localizedTexts('invalidFileType')) {\n this.addInvalidClass(fileList);\n statusMessage = typeValidationMessage;\n }\n return statusMessage;\n };\n Uploader.prototype.addInvalidClass = function (fileList) {\n fileList.classList.add(INVALID_FILE);\n };\n Uploader.prototype.createFormInput = function (fileData) {\n if (this.browserName !== 'safari') {\n var inputElement = this.element.cloneNode(true);\n inputElement.classList.add(HIDDEN_INPUT);\n for (var _i = 0, fileData_3 = fileData; _i < fileData_3.length; _i++) {\n var listItem = fileData_3[_i];\n listItem.input = inputElement;\n }\n inputElement.setAttribute('id', getUniqueID('hiddenUploader'));\n inputElement.setAttribute('name', this.uploaderName);\n this.uploadWrapper.querySelector('.' + INPUT_WRAPPER).appendChild(inputElement);\n if (this.browserName !== 'msie' && this.browserName !== 'edge') {\n this.element.value = '';\n }\n }\n };\n Uploader.prototype.getFileSize = function (fileData) {\n var fileSize = 0;\n for (var _i = 0, fileData_4 = fileData; _i < fileData_4.length; _i++) {\n var file = fileData_4[_i];\n fileSize += file.size;\n }\n return fileSize;\n };\n Uploader.prototype.mergeFileInfo = function (fileData, fileList) {\n var result = {\n name: '',\n rawFile: '',\n size: 0,\n status: '',\n type: '',\n validationMessages: { minSize: '', maxSize: '' },\n statusCode: '1',\n list: fileList\n };\n var fileNames = [];\n var type = '';\n for (var _i = 0, fileData_5 = fileData; _i < fileData_5.length; _i++) {\n var listItem = fileData_5[_i];\n fileNames.push(listItem.name);\n type = listItem.type;\n }\n result.name = fileNames.join(', ');\n result.size = this.getFileSize(fileData);\n result.type = type;\n result.status = this.statusForFormUpload(fileData, fileList);\n return result;\n };\n Uploader.prototype.statusForFormUpload = function (fileData, fileList) {\n var isValid = true;\n var statusMessage;\n for (var _i = 0, fileData_6 = fileData; _i < fileData_6.length; _i++) {\n var listItem = fileData_6[_i];\n statusMessage = listItem.status;\n var validationMessages = this.validatedFileSize(listItem.size);\n if (validationMessages.minSize !== '' || validationMessages.maxSize !== '') {\n isValid = false;\n statusMessage = validationMessages.minSize !== '' ? this.localizedTexts('invalidMinFileSize') :\n validationMessages.maxSize !== '' ? this.localizedTexts('invalidMaxFileSize') : statusMessage;\n }\n var typeValidationMessage = this.checkExtension(this.getFilesInArray(listItem))[0].status;\n if (typeValidationMessage === this.localizedTexts('invalidFileType')) {\n isValid = false;\n statusMessage = typeValidationMessage;\n }\n }\n if (!isValid) {\n fileList.classList.add(INVALID_FILE);\n statusMessage = fileData.length > 1 ? this.localizedTexts('invalidFileSelection') : statusMessage;\n }\n else {\n statusMessage = this.localizedTexts('totalFiles') + ': ' + fileData.length + ' , '\n + this.localizedTexts('size') + ': ' +\n this.bytesToSize(this.getFileSize(fileData));\n }\n return statusMessage;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Uploader.prototype.formCustomFileList = function (fileData, files) {\n this.createParentUL();\n var fileList = this.createElement('li', { className: FILE });\n fileList.setAttribute('data-files-count', fileData.length + '');\n this.setListToFileInfo(fileData, fileList);\n var result = this.mergeFileInfo(fileData, fileList);\n fileList.setAttribute('data-file-name', result.name);\n this.uploadTemplateFn = this.templateComplier(this.template);\n var liTempCompiler = this.uploadTemplateFn(result, this, 'template', this.element.id + 'Template', this.isStringTemplate, null, fileList);\n if (liTempCompiler) {\n var fromElements = [].slice.call(liTempCompiler);\n append(fromElements, fileList);\n }\n var index = this.listParent.querySelectorAll('li').length;\n if (!fileList.classList.contains(INVALID_FILE)) {\n this.createFormInput(fileData);\n }\n var eventArgs = {\n element: fileList,\n fileInfo: result,\n index: index,\n isPreload: this.isPreLoadFile(result)\n };\n var eventsArgs = {\n element: fileList,\n fileInfo: result,\n index: index,\n isPreload: this.isPreLoadFile(result)\n };\n this.trigger('rendering', eventArgs);\n this.trigger('fileListRendering', eventsArgs);\n this.listParent.appendChild(fileList);\n this.fileList.push(fileList);\n this.renderReactTemplates();\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Create the file list for specified files data.\n *\n * @param { FileInfo[] } fileData - Specifies the files data for file list creation.\n * @returns {void}\n */\n Uploader.prototype.createFileList = function (fileData) {\n this.filesData = this.filesData && this.filesData.length > 0 ? this.filesData.concat(fileData) : fileData;\n this.internalCreateFileList(fileData);\n };\n Uploader.prototype.internalCreateFileList = function (fileData) {\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n this.createParentUL();\n if (this.template !== '' && !isNullOrUndefined(this.template)) {\n if (this.isFormUpload()) {\n this.uploadWrapper.classList.add(FORM_UPLOAD);\n this.formCustomFileList(fileData, this.element.files);\n }\n else {\n this.createCustomfileList(fileData);\n }\n }\n else if (this.isFormUpload()) {\n this.uploadWrapper.classList.add(FORM_UPLOAD);\n this.formFileList(fileData, this.element.files);\n }\n else {\n for (var _i = 0, fileData_7 = fileData; _i < fileData_7.length; _i++) {\n var listItem = fileData_7[_i];\n var liElement = this.createElement('li', {\n className: FILE,\n attrs: { 'data-file-name': listItem.name, 'data-files-count': '1' }\n });\n var textContainer = this.createElement('span', { className: TEXT_CONTAINER });\n var textElement = this.createElement('span', { className: FILE_NAME, attrs: { 'title': listItem.name } });\n textElement.innerHTML = this.getFileNameOnly(listItem.name);\n var fileExtension = this.createElement('span', { className: FILE_TYPE });\n var fileType = this.getFileType(listItem.name);\n fileExtension.innerHTML = '.' + fileType;\n if (!fileType) {\n fileExtension.classList.add('e-hidden');\n }\n if (!this.enableRtl) {\n textContainer.appendChild(textElement);\n textContainer.appendChild(fileExtension);\n }\n else {\n var rtlContainer = this.createElement('span', { className: RTL_CONTAINER });\n rtlContainer.appendChild(fileExtension);\n rtlContainer.appendChild(textElement);\n textContainer.appendChild(rtlContainer);\n }\n var fileSize = this.createElement('span', { className: FILE_SIZE });\n fileSize.innerHTML = this.bytesToSize(listItem.size);\n textContainer.appendChild(fileSize);\n var statusElement = this.createElement('span', { className: STATUS });\n textContainer.appendChild(statusElement);\n statusElement.innerHTML = listItem.status;\n liElement.appendChild(textContainer);\n var iconElement = this.createElement('span', { className: ' e-icons',\n attrs: { 'tabindex': this.btnTabIndex } });\n /* istanbul ignore next */\n if (this.browserName === 'msie') {\n iconElement.classList.add('e-msie');\n }\n iconElement.setAttribute('title', this.localizedTexts('remove'));\n liElement.appendChild(iconElement);\n EventHandler.add(iconElement, 'click', this.removeFiles, this);\n if (listItem.statusCode === '2') {\n statusElement.classList.add(UPLOAD_SUCCESS);\n iconElement.classList.add(DELETE_ICON);\n iconElement.setAttribute('title', this.localizedTexts('delete'));\n }\n else if (listItem.statusCode !== '1') {\n statusElement.classList.remove(UPLOAD_SUCCESS);\n statusElement.classList.add(VALIDATION_FAILS);\n }\n if (this.autoUpload && listItem.statusCode === '1' && this.asyncSettings.saveUrl !== '') {\n statusElement.innerHTML = '';\n }\n if (!iconElement.classList.contains(DELETE_ICON)) {\n iconElement.classList.add(REMOVE_ICON);\n }\n var index = fileData.indexOf(listItem);\n var eventArgs = {\n element: liElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n var eventsArgs = {\n element: liElement,\n fileInfo: listItem,\n index: index,\n isPreload: this.isPreLoadFile(listItem)\n };\n this.trigger('rendering', eventArgs);\n this.trigger('fileListRendering', eventsArgs);\n this.listParent.appendChild(liElement);\n this.fileList.push(liElement);\n this.truncateName(textElement);\n var preventActionComplete = this.flag;\n if (this.isPreLoadFile(listItem)) {\n this.flag = false;\n this.checkActionComplete(true);\n this.flag = preventActionComplete;\n }\n }\n }\n };\n Uploader.prototype.getSlicedName = function (nameElement) {\n var text = nameElement.textContent;\n nameElement.dataset.tail = text.slice(text.length - 10);\n };\n Uploader.prototype.setListToFileInfo = function (fileData, fileList) {\n for (var _i = 0, fileData_8 = fileData; _i < fileData_8.length; _i++) {\n var listItem = fileData_8[_i];\n listItem.list = fileList;\n }\n };\n Uploader.prototype.truncateName = function (name) {\n var nameElement = name;\n if (this.browserName !== 'edge' && nameElement.offsetWidth < nameElement.scrollWidth) {\n this.getSlicedName(nameElement);\n /* istanbul ignore next */\n }\n else if (nameElement.offsetWidth + 1 < nameElement.scrollWidth) {\n this.getSlicedName(nameElement);\n }\n };\n Uploader.prototype.getFileType = function (name) {\n var extension;\n var index = name.lastIndexOf('.');\n if (index >= 0) {\n extension = name.substring(index + 1);\n }\n return extension ? extension : '';\n };\n Uploader.prototype.getFileNameOnly = function (name) {\n var type = this.getFileType(name);\n var names = name.split('.' + type);\n return type = names[0];\n };\n Uploader.prototype.setInitialAttributes = function () {\n if (this.initialAttr.accept) {\n this.element.setAttribute('accept', this.initialAttr.accept);\n }\n if (this.initialAttr.disabled) {\n this.element.setAttribute('disabled', 'disabled');\n }\n if (this.initialAttr.multiple) {\n var newAttr = document.createAttribute('multiple');\n this.element.setAttributeNode(newAttr);\n }\n };\n Uploader.prototype.filterfileList = function (files) {\n var filterFiles = [];\n var li;\n for (var i = 0; i < files.length; i++) {\n li = this.getLiElement(files[i]);\n if (!isNullOrUndefined(li) && !li.classList.contains(UPLOAD_SUCCESS)) {\n filterFiles.push(files[i]);\n }\n else if (!this.showFileList && files[i].status !== \"File uploaded successfully\") {\n filterFiles.push(files[i]);\n }\n }\n return filterFiles;\n };\n Uploader.prototype.updateStatus = function (files, status, statusCode, updateLiStatus) {\n if (updateLiStatus === void 0) { updateLiStatus = true; }\n if (!(status === '' || isNullOrUndefined(status)) && !(statusCode === '' || isNullOrUndefined(statusCode))) {\n files.status = status;\n files.statusCode = statusCode;\n }\n if (updateLiStatus) {\n var li = this.getLiElement(files);\n if (!isNullOrUndefined(li)) {\n if (!isNullOrUndefined(li.querySelector('.' + STATUS)) && !((status === '' || isNullOrUndefined(status)))) {\n li.querySelector('.' + STATUS).textContent = status;\n }\n }\n }\n return files;\n };\n Uploader.prototype.getLiElement = function (files) {\n var index;\n for (var i = 0; i < this.filesData.length; i++) {\n if (!isNullOrUndefined(files) && ((!isNullOrUndefined(this.filesData[i].id) &&\n !isNullOrUndefined(files.id)) ? (this.filesData[i].name === files.name &&\n this.filesData[i].id === files.id) : this.filesData[i].name === files.name)) {\n index = i;\n }\n }\n return this.fileList[index];\n };\n Uploader.prototype.createProgressBar = function (liElement) {\n var progressbarWrapper = this.createElement('span', { className: PROGRESS_WRAPPER });\n var progressBar = this.createElement('progressbar', { className: PROGRESSBAR, attrs: { value: '0', max: '100' } });\n var progressbarInnerWrapper = this.createElement('span', { className: PROGRESS_INNER_WRAPPER });\n progressBar.setAttribute('style', 'width: 0%');\n var progressbarText = this.createElement('span', { className: PROGRESSBAR_TEXT });\n progressbarText.textContent = '0%';\n progressbarInnerWrapper.appendChild(progressBar);\n progressbarWrapper.appendChild(progressbarInnerWrapper);\n progressbarWrapper.appendChild(progressbarText);\n liElement.querySelector('.' + TEXT_CONTAINER).appendChild(progressbarWrapper);\n };\n /* istanbul ignore next */\n Uploader.prototype.updateProgressbar = function (e, li) {\n if (!isNaN(Math.round((e.loaded / e.total) * 100)) && !isNullOrUndefined(li.querySelector('.' + PROGRESSBAR))) {\n if (!isNullOrUndefined(this.progressInterval) && this.progressInterval !== '') {\n var value = (Math.round((e.loaded / e.total) * 100)) % parseInt(this.progressInterval, 10);\n if (value === 0 || value === 100) {\n this.changeProgressValue(li, Math.round((e.loaded / e.total) * 100).toString() + '%');\n }\n }\n else {\n this.changeProgressValue(li, Math.round((e.loaded / e.total) * 100).toString() + '%');\n }\n }\n };\n Uploader.prototype.changeProgressValue = function (li, progressValue) {\n li.querySelector('.' + PROGRESSBAR).setAttribute('style', 'width:' + progressValue);\n li.querySelector('.' + PROGRESSBAR_TEXT).textContent = progressValue;\n };\n Uploader.prototype.uploadInProgress = function (e, files, customUI, request) {\n var li = this.getLiElement(files);\n if (isNullOrUndefined(li) && (!customUI)) {\n return;\n }\n if (!isNullOrUndefined(li)) {\n /* istanbul ignore next */\n if (files.statusCode === '5') {\n this.cancelUploadingFile(files, e, request, li);\n }\n if (!(li.querySelectorAll('.' + PROGRESS_WRAPPER).length > 0) && li.querySelector('.' + STATUS)) {\n li.querySelector('.' + STATUS).classList.add(UPLOAD_INPROGRESS);\n this.createProgressBar(li);\n this.updateProgressBarClasses(li, UPLOAD_INPROGRESS);\n li.querySelector('.' + STATUS).classList.remove(UPLOAD_FAILED);\n }\n this.updateProgressbar(e, li);\n var iconEle = li.querySelector('.' + REMOVE_ICON);\n if (!isNullOrUndefined(iconEle)) {\n iconEle.classList.add(ABORT_ICON, UPLOAD_INPROGRESS);\n iconEle.setAttribute('title', this.localizedTexts('abort'));\n iconEle.classList.remove(REMOVE_ICON);\n }\n }\n else {\n this.cancelUploadingFile(files, e, request);\n }\n var args = { e: e, operation: 'upload', file: this.updateStatus(files, this.localizedTexts('inProgress'), '3') };\n this.trigger('progress', args);\n };\n /* istanbul ignore next */\n Uploader.prototype.cancelUploadingFile = function (files, e, request, li) {\n var _this = this;\n if (files.statusCode === '5') {\n var eventArgs = {\n event: e,\n fileData: files,\n cancel: false,\n customFormData: [],\n currentRequest: null\n };\n this.trigger('canceling', eventArgs, function (eventArgs) {\n if (eventArgs.cancel) {\n files.statusCode = '3';\n if (!isNullOrUndefined(li)) {\n var spinnerTarget = li.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(spinnerTarget)) {\n hideSpinner(spinnerTarget);\n detach(li.querySelector('.e-spinner-pane'));\n }\n }\n }\n else {\n request.emitError = false;\n request.httpRequest.abort();\n var formData = new FormData();\n if (files.statusCode === '5') {\n var name_1 = _this.element.getAttribute('name');\n formData.append(name_1, files.name);\n formData.append('cancel-uploading', files.name);\n _this.updateFormData(formData, eventArgs.customFormData);\n var ajax_1 = new Ajax(_this.asyncSettings.removeUrl, 'POST', true, null);\n ajax_1.emitError = false;\n ajax_1.beforeSend = function (e) {\n if (eventArgs.currentRequest) {\n _this.updateCustomheader(ajax_1.httpRequest, eventArgs.currentRequest);\n }\n };\n ajax_1.onLoad = function (e) {\n _this.removecanceledFile(e, files);\n return {};\n };\n ajax_1.send(formData);\n }\n }\n });\n }\n };\n Uploader.prototype.removecanceledFile = function (e, file) {\n var liElement = this.getLiElement(file);\n if (isNullOrUndefined(liElement) || liElement.querySelector('.' + RETRY_ICON) || isNullOrUndefined(liElement.querySelector('.' + ABORT_ICON))) {\n return;\n }\n this.updateStatus(file, this.localizedTexts('fileUploadCancel'), '5');\n this.renderFailureState(e, file, liElement);\n var spinnerTarget = liElement.querySelector('.' + REMOVE_ICON);\n if (!isNullOrUndefined(liElement)) {\n hideSpinner(spinnerTarget);\n if (!isNullOrUndefined(liElement.querySelector('.e-spinner-pane'))) {\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n }\n var requestResponse = e && e.currentTarget ? this.getResponse(e) : null;\n var args = { event: e, response: requestResponse, operation: 'cancel', file: file };\n this.trigger('success', args);\n };\n Uploader.prototype.renderFailureState = function (e, file, liElement) {\n var _this = this;\n this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n this.removeProgressbar(liElement, 'failure');\n if (!isNullOrUndefined(liElement.querySelector('.e-file-status'))) {\n liElement.querySelector('.e-file-status').classList.add(UPLOAD_FAILED);\n }\n var deleteIcon = liElement.querySelector('.' + ABORT_ICON);\n if (isNullOrUndefined(deleteIcon)) {\n return;\n }\n deleteIcon.classList.remove(ABORT_ICON, UPLOAD_INPROGRESS);\n deleteIcon.classList.add(REMOVE_ICON);\n deleteIcon.setAttribute('title', this.localizedTexts('remove'));\n this.pauseButton = this.createElement('span', { className: 'e-icons e-file-reload-btn', attrs: { 'tabindex': this.btnTabIndex } });\n deleteIcon.parentElement.insertBefore(this.pauseButton, deleteIcon);\n this.pauseButton.setAttribute('title', this.localizedTexts('retry'));\n var retryElement = liElement.querySelector('.' + RETRY_ICON);\n /* istanbul ignore next */\n retryElement.addEventListener('click', function (e) {\n _this.reloadcanceledFile(e, file, liElement, false);\n }, false);\n };\n Uploader.prototype.reloadcanceledFile = function (e, file, liElement, custom) {\n file.statusCode = '1';\n file.status = this.localizedTexts('readyToUploadMessage');\n if (!custom) {\n if (!isNullOrUndefined(liElement.querySelector('.' + STATUS))) {\n liElement.querySelector('.' + STATUS).classList.remove(UPLOAD_FAILED);\n }\n if (!isNullOrUndefined(liElement.querySelector('.' + RETRY_ICON))) {\n detach(liElement.querySelector('.' + RETRY_ICON));\n }\n this.pauseButton = null;\n }\n /* istanbul ignore next */\n if (!isNullOrUndefined(liElement)) {\n liElement.classList.add(RESTRICT_RETRY);\n }\n this.upload([file]);\n };\n /* istanbul ignore next */\n Uploader.prototype.uploadComplete = function (e, file, customUI) {\n var status = e.target;\n if (status.readyState === 4 && status.status >= 200 && status.status <= 299) {\n var li = this.getLiElement(file);\n if (isNullOrUndefined(li) && (!customUI || isNullOrUndefined(customUI)) && this.showFileList) {\n return;\n }\n if (!isNullOrUndefined(li)) {\n this.updateProgressBarClasses(li, UPLOAD_SUCCESS);\n this.removeProgressbar(li, 'success');\n var iconEle = li.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(iconEle)) {\n iconEle.classList.add(DELETE_ICON);\n iconEle.setAttribute('title', this.localizedTexts('delete'));\n iconEle.classList.remove(ABORT_ICON);\n iconEle.classList.remove(UPLOAD_INPROGRESS);\n }\n }\n this.raiseSuccessEvent(e, file);\n }\n else {\n this.uploadFailed(e, file);\n }\n };\n Uploader.prototype.getResponse = function (e) {\n var target = e.currentTarget;\n var response = {\n readyState: target.readyState,\n statusCode: target.status,\n statusText: target.statusText,\n headers: target.getAllResponseHeaders(),\n withCredentials: target.withCredentials\n };\n return response;\n };\n Uploader.prototype.raiseSuccessEvent = function (e, file) {\n var _this = this;\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var statusMessage = this.localizedTexts('uploadSuccessMessage');\n var args = {\n e: e, response: response, operation: 'upload', file: this.updateStatus(file, statusMessage, '2', false), statusText: statusMessage\n };\n var liElement = this.getLiElement(file);\n if (!isNullOrUndefined(liElement)) {\n var spinnerEle = liElement.querySelector('.' + SPINNER_PANE);\n if (!isNullOrUndefined(spinnerEle)) {\n hideSpinner(liElement);\n detach(spinnerEle);\n }\n }\n this.trigger('success', args, function (args) {\n _this.updateStatus(file, args.statusText, '2');\n _this.uploadedFilesData.push(file);\n _this.trigger('change', { file: _this.uploadedFilesData });\n _this.checkActionButtonStatus();\n if (_this.fileList.length > 0) {\n if ((!(_this.getLiElement(file)).classList.contains(RESTRICT_RETRY))) {\n _this.uploadSequential();\n _this.checkActionComplete(true);\n }\n else {\n /* istanbul ignore next */\n (_this.getLiElement(file)).classList.remove(RESTRICT_RETRY);\n }\n }\n else if (!_this.showFileList) {\n _this.checkActionComplete(true);\n }\n });\n };\n Uploader.prototype.uploadFailed = function (e, file) {\n var _this = this;\n var li = this.getLiElement(file);\n var response = e && e.currentTarget ? this.getResponse(e) : null;\n var statusMessage = this.localizedTexts('uploadFailedMessage');\n var args = {\n e: e, response: response, operation: 'upload', file: this.updateStatus(file, statusMessage, '0', false), statusText: statusMessage\n };\n if (!isNullOrUndefined(li)) {\n this.renderFailureState(e, file, li);\n }\n this.trigger('failure', args, function (args) {\n _this.updateStatus(file, args.statusText, '0');\n _this.checkActionButtonStatus();\n _this.uploadSequential();\n _this.checkActionComplete(true);\n });\n };\n Uploader.prototype.uploadSequential = function () {\n if (this.sequentialUpload) {\n if (this.autoUpload) {\n /* istanbul ignore next */\n this.checkAutoUpload(this.filesData);\n }\n else {\n this.uploadButtonClick();\n }\n }\n };\n Uploader.prototype.checkActionComplete = function (increment) {\n if (increment) {\n ++this.actionCompleteCount;\n }\n else {\n --this.actionCompleteCount;\n }\n this.raiseActionComplete();\n };\n Uploader.prototype.raiseActionComplete = function () {\n if ((this.filesData.length === this.actionCompleteCount) && this.flag) {\n this.flag = false;\n var eventArgs = {\n fileData: []\n };\n eventArgs.fileData = this.getSelectedFileStatus(this.selectedFiles);\n this.trigger('actionComplete', eventArgs);\n }\n };\n Uploader.prototype.getSelectedFileStatus = function (selectedFiles) {\n var matchFiles = [];\n var matchFilesIndex = 0;\n for (var selectFileIndex = 0; selectFileIndex < selectedFiles.length; selectFileIndex++) {\n var selectedFileData = selectedFiles[selectFileIndex];\n for (var fileDataIndex = 0; fileDataIndex < this.filesData.length; fileDataIndex++) {\n if (this.filesData[fileDataIndex].name === selectedFileData.name && this.filesData[fileDataIndex].status === selectedFileData.status) {\n matchFiles[matchFilesIndex] = this.filesData[fileDataIndex];\n ++matchFilesIndex;\n }\n }\n }\n return matchFiles;\n };\n Uploader.prototype.updateProgressBarClasses = function (li, className) {\n var progressBar = li.querySelector('.' + PROGRESSBAR);\n if (!isNullOrUndefined(progressBar)) {\n progressBar.classList.add(className);\n }\n };\n Uploader.prototype.removeProgressbar = function (li, callType) {\n var _this = this;\n if (!isNullOrUndefined(li.querySelector('.' + PROGRESS_WRAPPER))) {\n this.progressAnimation = new Animation({ duration: 1250 });\n this.progressAnimation.animate(li.querySelector('.' + PROGRESS_WRAPPER), { name: 'FadeOut' });\n this.progressAnimation.animate(li.querySelector('.' + PROGRESSBAR_TEXT), { name: 'FadeOut' });\n setTimeout(function () {\n _this.animateProgressBar(li, callType);\n }, 750);\n }\n };\n /* istanbul ignore next */\n Uploader.prototype.animateProgressBar = function (li, callType) {\n if (callType === 'success') {\n li.classList.add(UPLOAD_SUCCESS);\n if (!isNullOrUndefined(li.querySelector('.' + STATUS))) {\n li.querySelector('.' + STATUS).classList.remove(UPLOAD_INPROGRESS);\n this.progressAnimation.animate(li.querySelector('.' + STATUS), { name: 'FadeIn' });\n li.querySelector('.' + STATUS).classList.add(UPLOAD_SUCCESS);\n }\n }\n else {\n if (!isNullOrUndefined(li.querySelector('.' + STATUS))) {\n li.querySelector('.' + STATUS).classList.remove(UPLOAD_INPROGRESS);\n this.progressAnimation.animate(li.querySelector('.' + STATUS), { name: 'FadeIn' });\n li.querySelector('.' + STATUS).classList.add(UPLOAD_FAILED);\n }\n }\n if (li.querySelector('.' + PROGRESS_WRAPPER)) {\n detach(li.querySelector('.' + PROGRESS_WRAPPER));\n }\n };\n Uploader.prototype.setExtensions = function (extensions) {\n if (extensions !== '' && !isNullOrUndefined(extensions)) {\n this.element.setAttribute('accept', extensions);\n }\n else {\n this.element.removeAttribute('accept');\n }\n };\n Uploader.prototype.templateComplier = function (uploadTemplate) {\n if (uploadTemplate) {\n try {\n if (typeof uploadTemplate !== 'function' && selectAll(uploadTemplate, document).length) {\n return compile(select(uploadTemplate, document).innerHTML.trim());\n }\n else {\n return compile(uploadTemplate);\n }\n }\n catch (exception) {\n return compile(uploadTemplate);\n }\n }\n return undefined;\n };\n Uploader.prototype.setRTL = function () {\n if (this.enableRtl) {\n addClass([this.uploadWrapper], RTL);\n }\n else {\n removeClass([this.uploadWrapper], RTL);\n }\n };\n Uploader.prototype.localizedTexts = function (localeText) {\n this.l10n.setLocale(this.locale);\n return this.l10n.getConstant(localeText);\n };\n Uploader.prototype.setControlStatus = function () {\n if (!this.enabled) {\n this.uploadWrapper.classList.add(DISABLED);\n this.element.setAttribute('disabled', 'disabled');\n this.browseButton.setAttribute('disabled', 'disabled');\n if (!isNullOrUndefined(this.clearButton)) {\n this.clearButton.setAttribute('disabled', 'disabled');\n }\n if (!isNullOrUndefined(this.uploadButton)) {\n this.uploadButton.setAttribute('disabled', 'disabled');\n }\n }\n else {\n if (this.uploadWrapper.classList.contains(DISABLED)) {\n this.uploadWrapper.classList.remove(DISABLED);\n }\n if (!isNullOrUndefined(this.browseButton) && this.element.hasAttribute('disabled')) {\n this.element.removeAttribute('disabled');\n this.browseButton.removeAttribute('disabled');\n }\n if (!isNullOrUndefined(this.clearButton) && this.clearButton.hasAttribute('disabled')) {\n this.clearButton.removeAttribute('disabled');\n }\n if (!isNullOrUndefined(this.uploadButton) && this.uploadButton.hasAttribute('disabled')) {\n this.uploadButton.hasAttribute('disabled');\n }\n }\n };\n Uploader.prototype.checkHTMLAttributes = function (isDynamic) {\n var attributes = isDynamic ? isNullOrUndefined(this.htmlAttributes) ? [] : Object.keys(this.htmlAttributes) :\n ['accept', 'multiple', 'disabled'];\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var prop = attributes_1[_i];\n if (!isNullOrUndefined(this.element.getAttribute(prop))) {\n switch (prop) {\n case 'accept':\n if ((isNullOrUndefined(this.uploaderOptions) || (this.uploaderOptions['allowedExtensions'] === undefined))\n || isDynamic) {\n this.setProperties({ allowedExtensions: this.element.getAttribute('accept') }, !isDynamic);\n this.initialAttr.accept = this.allowedExtensions;\n }\n break;\n case 'multiple':\n if ((isNullOrUndefined(this.uploaderOptions) || (this.uploaderOptions['multiple'] === undefined)) || isDynamic) {\n var isMutiple = this.element.getAttribute(prop) === 'multiple' ||\n this.element.getAttribute(prop) === '' || this.element.getAttribute(prop) === 'true' ? true : false;\n this.setProperties({ multiple: isMutiple }, !isDynamic);\n this.initialAttr.multiple = true;\n }\n break;\n case 'disabled':\n if ((isNullOrUndefined(this.uploaderOptions) || (this.uploaderOptions['enabled'] === undefined)) || isDynamic) {\n var isDisabled = this.element.getAttribute(prop) === 'disabled' ||\n this.element.getAttribute(prop) === '' || this.element.getAttribute(prop) === 'true' ? false : true;\n this.setProperties({ enabled: isDisabled }, !isDynamic);\n this.initialAttr.disabled = true;\n }\n }\n }\n }\n };\n Uploader.prototype.chunkUpload = function (file, custom, fileIndex) {\n var start = 0;\n var end = Math.min(this.asyncSettings.chunkSize, file.size);\n var index = 0;\n var blob = file.rawFile.slice(start, end);\n var metaData = { chunkIndex: index, blob: blob, file: file, start: start, end: end, retryCount: 0, request: null };\n this.sendRequest(file, metaData, custom, fileIndex);\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Uploader.prototype.sendRequest = function (file, metaData, custom, fileIndex) {\n var _this = this;\n var formData = new FormData();\n var blob = file.rawFile.slice(metaData.start, metaData.end);\n formData.append(this.uploaderName, blob, file.name);\n formData.append('chunk-index', metaData.chunkIndex.toString());\n formData.append('chunkIndex', metaData.chunkIndex.toString());\n var totalChunk = Math.max(Math.ceil(file.size / this.asyncSettings.chunkSize), 1);\n formData.append('total-chunk', totalChunk.toString());\n formData.append('totalChunk', totalChunk.toString());\n var ajax = new Ajax({ url: this.asyncSettings.saveUrl, type: 'POST', async: true, contentType: null });\n ajax.emitError = false;\n ajax.onLoad = function (e) {\n _this.chunkUploadComplete(e, metaData, custom);\n return {};\n };\n ajax.onUploadProgress = function (e) {\n _this.chunkUploadInProgress(e, metaData, custom);\n return {};\n };\n var eventArgs = {\n fileData: file,\n customFormData: [],\n cancel: false,\n chunkSize: this.asyncSettings.chunkSize === 0 ? null : this.asyncSettings.chunkSize\n };\n ajax.beforeSend = function (e) {\n eventArgs.currentRequest = ajax.httpRequest;\n eventArgs.currentChunkIndex = metaData.chunkIndex;\n if (eventArgs.currentChunkIndex === 0) {\n // This event is currently not required but to avoid breaking changes for previous customer, we have included.\n _this.trigger('uploading', eventArgs, function (eventArgs) {\n _this.uploadingEventCallback(formData, eventArgs, e, file);\n });\n }\n else {\n _this.trigger('chunkUploading', eventArgs, function (eventArgs) {\n _this.uploadingEventCallback(formData, eventArgs, e, file);\n });\n }\n };\n /* istanbul ignore next */\n ajax.onError = function (e) {\n _this.chunkUploadFailed(e, metaData, custom);\n return {};\n };\n ajax.send(formData);\n metaData.request = ajax;\n };\n Uploader.prototype.uploadingEventCallback = function (formData, eventArgs, e, file) {\n if (eventArgs.cancel) {\n this.eventCancelByArgs(e, eventArgs, file);\n }\n else {\n this.updateFormData(formData, eventArgs.customFormData);\n }\n };\n Uploader.prototype.eventCancelByArgs = function (e, eventArgs, file) {\n var _this = this;\n e.cancel = true;\n if (eventArgs.fileData.statusCode === '5') {\n return;\n }\n eventArgs.fileData.statusCode = '5';\n eventArgs.fileData.status = this.localizedTexts('fileUploadCancel');\n var liElement = this.getLiElement(eventArgs.fileData);\n if (liElement) {\n if (!isNullOrUndefined(liElement.querySelector('.' + STATUS))) {\n liElement.querySelector('.' + STATUS).innerHTML = this.localizedTexts('fileUploadCancel');\n liElement.querySelector('.' + STATUS).classList.add(UPLOAD_FAILED);\n }\n this.pauseButton = this.createElement('span', { className: 'e-icons e-file-reload-btn', attrs: { 'tabindex': this.btnTabIndex } });\n var removeIcon = liElement.querySelector('.' + REMOVE_ICON);\n if (removeIcon) {\n removeIcon.parentElement.insertBefore(this.pauseButton, removeIcon);\n }\n this.pauseButton.setAttribute('title', this.localizedTexts('retry'));\n /* istanbul ignore next */\n this.pauseButton.addEventListener('click', function (e) {\n _this.reloadcanceledFile(e, file, liElement);\n }, false);\n this.checkActionButtonStatus();\n }\n };\n Uploader.prototype.checkChunkUpload = function () {\n return (this.asyncSettings.chunkSize <= 0 || isNullOrUndefined(this.asyncSettings.chunkSize)) ? false : true;\n };\n Uploader.prototype.chunkUploadComplete = function (e, metaData, custom) {\n var _this = this;\n var response = e.target;\n var liElement;\n if (response.readyState === 4 && response.status >= 200 && response.status < 300) {\n var requestResponse = e && e.currentTarget ? this.getResponse(e) : null;\n var totalChunk = Math.max(Math.ceil(metaData.file.size / this.asyncSettings.chunkSize), 1);\n var eventArgs = {\n event: e,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n totalChunk: totalChunk,\n chunkSize: this.asyncSettings.chunkSize,\n response: requestResponse\n };\n this.trigger('chunkSuccess', eventArgs);\n if (isNullOrUndefined(custom) || !custom) {\n liElement = this.getLiElement(metaData.file);\n }\n this.updateMetaData(metaData);\n if (metaData.end === metaData.file.size) {\n metaData.file.statusCode = '3';\n }\n if (metaData.file.statusCode === '5') {\n var eventArgs_1 = { event: e, fileData: metaData.file, cancel: false, customFormData: [] };\n this.trigger('canceling', eventArgs_1, function (eventArgs) {\n /* istanbul ignore next */\n if (eventArgs.cancel) {\n metaData.file.statusCode = '3';\n var spinnerTarget = liElement.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(liElement) && !isNullOrUndefined(spinnerTarget)) {\n hideSpinner(spinnerTarget);\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n _this.sendNextRequest(metaData);\n }\n else {\n metaData.request.emitError = false;\n response.abort();\n var formData = new FormData();\n var name_2 = _this.element.getAttribute('name');\n formData.append(name_2, metaData.file.name);\n formData.append('cancel-uploading', metaData.file.name);\n formData.append('cancelUploading', metaData.file.name);\n _this.updateFormData(formData, eventArgs.customFormData);\n var ajax = new Ajax(_this.asyncSettings.removeUrl, 'POST', true, null);\n ajax.emitError = false;\n ajax.onLoad = function (e) {\n _this.removeChunkFile(e, metaData, custom);\n return {};\n };\n ajax.send(formData);\n }\n });\n }\n else {\n if ((totalChunk - 1) === metaData.chunkIndex && totalChunk > metaData.chunkIndex) {\n var index = this.pausedData.indexOf(metaData);\n if (index >= 0) {\n this.pausedData.splice(index, 1);\n }\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom) && liElement) {\n if (liElement && !isNullOrUndefined(liElement.querySelector('.' + PAUSE_UPLOAD))) {\n detach(liElement.querySelector('.' + PAUSE_UPLOAD));\n }\n this.removeChunkProgressBar(metaData);\n }\n this.raiseSuccessEvent(e, metaData.file);\n return;\n }\n if (metaData.file.statusCode !== '4') {\n this.sendNextRequest(metaData);\n }\n }\n }\n else {\n this.chunkUploadFailed(e, metaData);\n }\n };\n Uploader.prototype.sendNextRequest = function (metaData) {\n metaData.start = metaData.end;\n metaData.end += this.asyncSettings.chunkSize;\n metaData.end = Math.min(metaData.end, metaData.file.size);\n metaData.chunkIndex += 1;\n this.sendRequest(metaData.file, metaData);\n };\n Uploader.prototype.removeChunkFile = function (e, metaData, custom) {\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) && !custom)) {\n var liElement = this.getLiElement(metaData.file);\n var deleteIcon = liElement.querySelector('.' + ABORT_ICON);\n var spinnerTarget = deleteIcon;\n this.updateStatus(metaData.file, this.localizedTexts('fileUploadCancel'), '5');\n this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n this.removeProgressbar(liElement, 'failure');\n (deleteIcon && deleteIcon.classList.remove(ABORT_ICON));\n (deleteIcon && deleteIcon.classList.add(REMOVE_ICON));\n (deleteIcon && deleteIcon.setAttribute('title', this.localizedTexts('remove')));\n var pauseIcon = liElement.querySelector('.' + PAUSE_UPLOAD);\n (pauseIcon && pauseIcon.classList.add(RETRY_ICON));\n (pauseIcon && pauseIcon.classList.remove(PAUSE_UPLOAD));\n (pauseIcon && pauseIcon.setAttribute('title', this.localizedTexts('retry')));\n if (!isNullOrUndefined(liElement) && !isNullOrUndefined(deleteIcon)\n && !isNullOrUndefined(liElement.querySelector('.e-spinner-pane'))) {\n hideSpinner(spinnerTarget);\n detach(liElement.querySelector('.e-spinner-pane'));\n }\n }\n };\n Uploader.prototype.pauseUpload = function (metaData, e, custom) {\n metaData.file.statusCode = '4';\n metaData.file.status = this.localizedTexts('pause');\n this.updateMetaData(metaData);\n var eventArgs = {\n event: e ? e : null,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n chunkCount: Math.round(metaData.file.size / this.asyncSettings.chunkSize),\n chunkSize: this.asyncSettings.chunkSize\n };\n this.abortUpload(metaData, custom, eventArgs);\n };\n Uploader.prototype.abortUpload = function (metaData, custom, eventArgs) {\n if (metaData.file.statusCode !== '4') {\n metaData.request.emitError = false;\n metaData.request.httpRequest.abort();\n }\n var liElement = this.getLiElement(metaData.file);\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom)) {\n var targetElement = liElement.querySelector('.' + PAUSE_UPLOAD);\n targetElement.classList.remove(PAUSE_UPLOAD);\n targetElement.classList.add(RESUME_UPLOAD);\n targetElement.setAttribute('title', this.localizedTexts('resume'));\n targetElement.nextElementSibling.classList.add(REMOVE_ICON);\n targetElement.nextElementSibling.classList.remove(ABORT_ICON);\n targetElement.nextElementSibling.setAttribute('title', this.localizedTexts('remove'));\n }\n for (var i = 0; i < this.pausedData.length; i++) {\n if (this.pausedData[i].file.name === metaData.file.name) {\n this.pausedData.splice(i, 1);\n }\n }\n this.pausedData.push(metaData);\n this.trigger('pausing', eventArgs);\n };\n Uploader.prototype.resumeUpload = function (metaData, e, custom) {\n var liElement = this.getLiElement(metaData.file);\n var targetElement;\n if (!isNullOrUndefined(liElement)) {\n targetElement = liElement.querySelector('.' + RESUME_UPLOAD);\n }\n if (!isNullOrUndefined(targetElement) && (isNullOrUndefined(custom) || !custom)) {\n targetElement.classList.remove(RESUME_UPLOAD);\n targetElement.classList.add(PAUSE_UPLOAD);\n targetElement.setAttribute('title', this.localizedTexts('pause'));\n targetElement.nextElementSibling.classList.remove(REMOVE_ICON);\n targetElement.nextElementSibling.classList.add(ABORT_ICON);\n targetElement.nextElementSibling.setAttribute('title', this.localizedTexts('abort'));\n }\n metaData.file.status = this.localizedTexts('inProgress');\n metaData.file.statusCode = '3';\n this.updateMetaData(metaData);\n var eventArgs = {\n event: e ? e : null,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n chunkCount: Math.round(metaData.file.size / this.asyncSettings.chunkSize),\n chunkSize: this.asyncSettings.chunkSize\n };\n this.trigger('resuming', eventArgs);\n for (var i = 0; i < this.pausedData.length; i++) {\n if (this.pausedData[i].end === this.pausedData[i].file.size) {\n this.chunkUploadComplete(e, metaData, custom);\n }\n else {\n if (this.pausedData[i].file.name === metaData.file.name) {\n this.pausedData[i].start = this.pausedData[i].end;\n this.pausedData[i].end = this.pausedData[i].end + this.asyncSettings.chunkSize;\n this.pausedData[i].end = Math.min(this.pausedData[i].end, this.pausedData[i].file.size);\n this.pausedData[i].chunkIndex = this.pausedData[i].chunkIndex + 1;\n this.sendRequest(this.pausedData[i].file, this.pausedData[i], custom);\n }\n }\n }\n };\n Uploader.prototype.updateMetaData = function (metaData) {\n if (this.uploadMetaData.indexOf(metaData) === -1) {\n this.uploadMetaData.push(metaData);\n }\n else {\n this.uploadMetaData.splice(this.uploadMetaData.indexOf(metaData), 1);\n this.uploadMetaData.push(metaData);\n }\n };\n Uploader.prototype.removeChunkProgressBar = function (metaData) {\n var liElement = this.getLiElement(metaData.file);\n if (!isNullOrUndefined(liElement)) {\n this.updateProgressBarClasses(liElement, UPLOAD_SUCCESS);\n this.removeProgressbar(liElement, 'success');\n var cancelButton = liElement.querySelector('.' + ABORT_ICON);\n if (!isNullOrUndefined(cancelButton)) {\n cancelButton.classList.add(DELETE_ICON);\n cancelButton.setAttribute('title', this.localizedTexts('delete'));\n cancelButton.classList.remove(ABORT_ICON, UPLOAD_INPROGRESS);\n }\n }\n };\n Uploader.prototype.chunkUploadFailed = function (e, metaData, custom) {\n var _this = this;\n var chunkCount = Math.max(Math.ceil(metaData.file.size / this.asyncSettings.chunkSize), 1);\n var liElement;\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom)) {\n liElement = this.getLiElement(metaData.file);\n }\n var requestResponse = e && e.currentTarget ? this.getResponse(e) : null;\n var eventArgs = {\n event: e,\n file: metaData.file,\n chunkIndex: metaData.chunkIndex,\n totalChunk: chunkCount,\n chunkSize: this.asyncSettings.chunkSize,\n cancel: false,\n response: requestResponse\n };\n this.trigger('chunkFailure', eventArgs, function (eventArgs) {\n // To prevent triggering of failure event\n if (!eventArgs.cancel) {\n if (metaData.retryCount < _this.asyncSettings.retryCount) {\n setTimeout(function () {\n _this.retryRequest(liElement, metaData, custom);\n }, _this.asyncSettings.retryAfterDelay);\n }\n else {\n if (!isNullOrUndefined(liElement)) {\n var pauseButton = liElement.querySelector('.' + PAUSE_UPLOAD) ?\n liElement.querySelector('.' + PAUSE_UPLOAD) : liElement.querySelector('.' + RESUME_UPLOAD);\n if (!isNullOrUndefined(pauseButton)) {\n pauseButton.classList.add(RETRY_ICON);\n pauseButton.classList.remove(PAUSE_UPLOAD, RESUME_UPLOAD);\n }\n _this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n _this.removeProgressbar(liElement, 'failure');\n liElement.querySelector('.e-icons').classList.remove(UPLOAD_INPROGRESS);\n var iconElement = liElement.querySelector('.' + ABORT_ICON) ?\n liElement.querySelector('.' + ABORT_ICON) : liElement.querySelector('.' + REMOVE_ICON);\n iconElement.classList.remove(ABORT_ICON);\n if (!isNullOrUndefined(liElement.querySelector('.' + PAUSE_UPLOAD))) {\n detach(liElement.querySelector('.' + PAUSE_UPLOAD));\n }\n if (metaData.start > 0) {\n iconElement.classList.add(DELETE_ICON);\n iconElement.setAttribute('title', _this.localizedTexts('delete'));\n }\n else {\n iconElement.classList.add(REMOVE_ICON);\n iconElement.setAttribute('title', _this.localizedTexts('remove'));\n }\n }\n metaData.retryCount = 0;\n var file_1 = metaData.file;\n var failureMessage = _this.localizedTexts('uploadFailedMessage');\n var args = {\n e: e, response: requestResponse,\n operation: 'upload',\n file: _this.updateStatus(file_1, failureMessage, '0', false),\n statusText: failureMessage\n };\n _this.trigger('failure', args, function (args) {\n _this.updateStatus(file_1, args.statusText, '0');\n _this.uploadSequential();\n _this.checkActionComplete(true);\n });\n }\n }\n });\n };\n Uploader.prototype.retryRequest = function (liElement, metaData, custom) {\n if (isNullOrUndefined(this.template) && (isNullOrUndefined(custom) || !custom) && liElement) {\n this.updateProgressBarClasses(liElement, UPLOAD_FAILED);\n }\n metaData.retryCount += 1;\n this.sendRequest(metaData.file, metaData);\n };\n Uploader.prototype.checkPausePlayAction = function (e) {\n var targetElement = e.target;\n var selectedElement = e.target.parentElement;\n var index = this.fileList.indexOf(selectedElement);\n var fileData = this.filesData[index];\n var metaData = this.getCurrentMetaData(fileData);\n if (targetElement.classList.contains(PAUSE_UPLOAD)) {\n /* istanbul ignore next */\n this.pauseUpload(metaData, e);\n }\n else if (targetElement.classList.contains(RESUME_UPLOAD)) {\n /* istanbul ignore next */\n this.resumeUpload(metaData, e);\n }\n else if (targetElement.classList.contains(RETRY_ICON)) {\n if (metaData.file.status === this.localizedTexts('fileUploadCancel')) {\n this.retryUpload(metaData, false);\n }\n else {\n this.retryUpload(metaData, true);\n }\n }\n };\n Uploader.prototype.retryUpload = function (metaData, fromcanceledStage) {\n if (fromcanceledStage) {\n metaData.end = metaData.end + this.asyncSettings.chunkSize;\n metaData.start = metaData.start + this.asyncSettings.chunkSize;\n this.sendRequest(metaData.file, metaData);\n }\n else {\n metaData.file.statusCode = '1';\n metaData.file.status = this.localizedTexts('readyToUploadMessage');\n this.chunkUpload(metaData.file);\n }\n /* istanbul ignore next */\n (this.getLiElement(metaData.file)).classList.add(RESTRICT_RETRY);\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Uploader.prototype.chunkUploadInProgress = function (e, metaData, custom) {\n var _this = this;\n if (metaData.file.statusCode === '4') {\n return;\n }\n if (metaData.file.statusCode !== '4' && metaData.file.statusCode !== '5') {\n metaData.file.statusCode = '3';\n metaData.file.status = this.localizedTexts('inProgress');\n }\n this.updateMetaData(metaData);\n var liElement = this.getLiElement(metaData.file);\n if (isNullOrUndefined(liElement)) {\n return;\n }\n var retryElement = liElement.querySelector('.' + RETRY_ICON);\n if (!isNullOrUndefined(retryElement)) {\n retryElement.classList.add(PAUSE_UPLOAD);\n retryElement.setAttribute('title', this.localizedTexts('pause'));\n retryElement.classList.remove(RETRY_ICON);\n }\n if (!isNullOrUndefined(liElement)) {\n if (!(liElement.querySelectorAll('.' + PROGRESS_WRAPPER).length > 0)) {\n var statusElement = liElement.querySelector('.' + STATUS);\n if (isNullOrUndefined(this.template)) {\n statusElement.classList.add(UPLOAD_INPROGRESS);\n statusElement.classList.remove(UPLOAD_FAILED);\n this.createProgressBar(liElement);\n this.updateProgressBarClasses(liElement, UPLOAD_INPROGRESS);\n }\n var clearIcon = liElement.querySelector('.' + REMOVE_ICON) ? liElement.querySelector('.' + REMOVE_ICON) :\n liElement.querySelector('.' + DELETE_ICON);\n if (!isNullOrUndefined(clearIcon)) {\n clearIcon.classList.add(ABORT_ICON);\n clearIcon.setAttribute('title', this.localizedTexts('abort'));\n clearIcon.classList.remove(REMOVE_ICON);\n }\n }\n if (!isNaN(Math.round((e.loaded / e.total) * 100)) && isNullOrUndefined(this.template) && metaData.file.statusCode !== '4') {\n var progressVal = void 0;\n var totalChunks = Math.ceil(metaData.file.size / this.asyncSettings.chunkSize) - 1;\n if (this.asyncSettings.chunkSize && totalChunks) {\n progressVal = Math.round(metaData.chunkIndex / totalChunks * 100);\n this.changeProgressValue(liElement, progressVal.toString() + '%');\n }\n }\n if (metaData.chunkIndex === 0) {\n this.checkActionButtonStatus();\n }\n }\n if (isNullOrUndefined(liElement.querySelector('.' + PAUSE_UPLOAD)) && isNullOrUndefined(this.template)\n && isNullOrUndefined(liElement.querySelector('.' + DELETE_ICON))) {\n this.pauseButton = this.createElement('span', { className: 'e-icons e-file-pause-btn', attrs: { 'tabindex': this.btnTabIndex } });\n if (this.browserName === 'msie') {\n this.pauseButton.classList.add('e-msie');\n }\n var abortIcon = liElement.querySelector('.' + ABORT_ICON);\n abortIcon.parentElement.insertBefore(this.pauseButton, abortIcon);\n this.pauseButton.setAttribute('title', this.localizedTexts('pause'));\n this.pauseButton.addEventListener('click', function (e) {\n _this.checkPausePlayAction(e);\n }, false);\n }\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * It is used to convert bytes value into kilobytes or megabytes depending on the size based\n * on [binary prefix](https://en.wikipedia.org/wiki/Binary_prefix).\n *\n * @param { number } bytes - Specifies the file size in bytes.\n * @returns {string}\n */\n Uploader.prototype.bytesToSize = function (bytes) {\n var i = -1;\n if (!bytes) {\n return '0.0 KB';\n }\n do {\n bytes = bytes / 1024;\n i++;\n } while (bytes > 99);\n if (i >= 2) {\n bytes = bytes * 1024;\n i = 1;\n }\n return Math.max(bytes, 0).toFixed(1) + ' ' + ['KB', 'MB'][i];\n };\n /**\n * Allows you to sort the file data alphabetically based on its file name clearly.\n *\n * @param { FileList } filesData - specifies the files data for upload.\n * @returns {File[]}\n */\n /* istanbul ignore next */\n Uploader.prototype.sortFileList = function (filesData) {\n filesData = filesData ? filesData : this.sortFilesList;\n var files = filesData;\n var fileNames = [];\n for (var i = 0; i < files.length; i++) {\n fileNames.push(files[i].name);\n }\n var sortedFileNames = fileNames.sort();\n var sortedFilesData = [];\n for (var _i = 0, sortedFileNames_1 = sortedFileNames; _i < sortedFileNames_1.length; _i++) {\n var name_3 = sortedFileNames_1[_i];\n for (var i = 0; i < files.length; i++) {\n if (name_3 === files[i].name) {\n sortedFilesData.push(files[i]);\n }\n }\n }\n return sortedFilesData;\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.\n *\n * @method destroy\n * @returns {void}\n */\n Uploader.prototype.destroy = function () {\n this.element.value = null;\n this.clearTemplate();\n this.clearAll();\n this.unWireEvents();\n this.unBindDropEvents();\n if (this.multiple) {\n this.element.removeAttribute('multiple');\n }\n if (!this.enabled) {\n this.element.removeAttribute('disabled');\n }\n this.element.removeAttribute('accept');\n this.setInitialAttributes();\n var attributes = ['aria-label', 'directory', 'webkitdirectory', 'tabindex'];\n for (var _i = 0, attributes_2 = attributes; _i < attributes_2.length; _i++) {\n var key = attributes_2[_i];\n this.element.removeAttribute(key);\n }\n if (!isNullOrUndefined(this.uploadWrapper)) {\n this.uploadWrapper.parentElement.appendChild(this.element);\n detach(this.uploadWrapper);\n }\n this.uploadWrapper = null;\n this.uploadWrapper = null;\n this.browseButton = null;\n this.dropAreaWrapper = null;\n this.dropZoneElement = null;\n this.dropArea = null;\n this.keyboardModule = null;\n this.clearButton = null;\n this.uploadButton = null;\n _super.prototype.destroy.call(this);\n };\n /**\n * Allows you to call the upload process manually by calling save URL action.\n * To process the selected files (added in upload queue), pass an empty argument otherwise\n * upload the specific file based on its argument.\n *\n * @param { FileInfo | FileInfo[] } files - Specifies the files data for upload.\n * @param {boolean} custom - Specifies whether the uploader is rendered with custom file list.\n * @returns {void}\n */\n Uploader.prototype.upload = function (files, custom) {\n var _this = this;\n files = files ? files : this.filesData;\n if (this.sequentialUpload && (this.isFirstFileOnSelection || custom)) {\n this.sequenceUpload(files);\n }\n else {\n var uploadFiles_1 = this.getFilesInArray(files);\n var eventArgs = {\n customFormData: [],\n currentRequest: null,\n cancel: false\n };\n this.trigger('beforeUpload', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel) {\n _this.uploadFiles(uploadFiles_1, custom);\n }\n });\n }\n };\n Uploader.prototype.getFilesInArray = function (files) {\n var uploadFiles = [];\n if (files instanceof Array) {\n uploadFiles = files;\n }\n else {\n uploadFiles.push(files);\n }\n return uploadFiles;\n };\n /* istanbul ignore next */\n Uploader.prototype.serverReadFileBase64 = function (fileIndex, position, totalCount) {\n var _this = this;\n return new Promise(function (resolve, reject) {\n var file = _this.fileStreams[fileIndex].rawFile;\n try {\n var reader = new FileReader();\n reader.onload = (function (args) {\n return function () {\n try {\n var contents = args.result;\n var data = contents ? contents.split(';base64,')[1] : null;\n resolve(data);\n }\n catch (e) {\n reject(e);\n }\n };\n })(reader);\n reader.readAsDataURL(file.slice(position, position + totalCount));\n }\n catch (e) {\n reject(e);\n }\n });\n };\n /* eslint-disable @typescript-eslint/no-unused-vars */\n /* istanbul ignore next */\n Uploader.prototype.uploadFileCount = function (ele) {\n /* eslint-enable @typescript-eslint/no-unused-vars */\n var files = this.filesData;\n if (!files || files.length === 0) {\n return -1;\n }\n var result = files.length;\n return result;\n };\n /* eslint-disable @typescript-eslint/no-unused-vars */\n /* istanbul ignore next */\n Uploader.prototype.getFileRead = function (index, ele) {\n /* eslint-enable @typescript-eslint/no-unused-vars */\n var files = this.filesData;\n if (!files || files.length === 0) {\n return -1;\n }\n var file = files[index];\n var fileCount = this.newFileRef++;\n this.fileStreams[fileCount] = file;\n return fileCount;\n };\n /* eslint-disable @typescript-eslint/no-unused-vars */\n /* istanbul ignore next */\n Uploader.prototype.getFileInfo = function (index, ele) {\n /* eslint-enable @typescript-eslint/no-unused-vars */\n var files = this.filesData;\n if (!files || files.length === 0) {\n return null;\n }\n var file = files[index];\n if (!file) {\n return null;\n }\n return this.filesData[index];\n };\n Uploader.prototype.uploadFiles = function (files, custom) {\n var selectedFiles = [];\n if (this.asyncSettings.saveUrl === '' || isNullOrUndefined(this.asyncSettings.saveUrl)) {\n return;\n }\n if (!custom || isNullOrUndefined(custom)) {\n if (!this.multiple) {\n var file = [];\n file.push(files[0]);\n selectedFiles = this.filterfileList(file);\n }\n else {\n selectedFiles = this.filterfileList(files);\n }\n }\n else {\n selectedFiles = files;\n }\n for (var i = 0; i < selectedFiles.length; i++) {\n this.uploadFilesRequest(selectedFiles, i, custom);\n }\n };\n Uploader.prototype.uploadFilesRequest = function (selectedFiles, i, custom) {\n var _this = this;\n var cloneFiles = [];\n var chunkEnabled = this.checkChunkUpload();\n var ajax = new Ajax(this.asyncSettings.saveUrl, 'POST', true, null);\n ajax.emitError = false;\n var getFileData;\n var eventArgs = {\n fileData: selectedFiles[i],\n customFormData: [],\n cancel: false\n };\n var formData = new FormData();\n ajax.beforeSend = function (e) {\n eventArgs.currentRequest = ajax.httpRequest;\n _this.trigger('uploading', eventArgs, function (eventArgs) {\n /* istanbul ignore next */\n if (eventArgs.cancel) {\n _this.eventCancelByArgs(e, eventArgs, selectedFiles[i]);\n }\n _this.updateFormData(formData, eventArgs.customFormData);\n });\n };\n if (selectedFiles[i].statusCode === '1') {\n var name_4 = this.element.getAttribute('name');\n formData.append(name_4, selectedFiles[i].rawFile, selectedFiles[i].name);\n if (chunkEnabled && selectedFiles[i].size > this.asyncSettings.chunkSize) {\n this.chunkUpload(selectedFiles[i], custom, i);\n }\n else {\n ajax.onLoad = function (e) {\n if (eventArgs.cancel) {\n return {};\n }\n else {\n _this.uploadComplete(e, selectedFiles[i], custom);\n return {};\n }\n };\n ajax.onUploadProgress = function (e) {\n if (eventArgs.cancel) {\n return {};\n }\n else {\n _this.uploadInProgress(e, selectedFiles[i], custom, ajax);\n return {};\n }\n };\n /* istanbul ignore next */\n ajax.onError = function (e) {\n _this.uploadFailed(e, selectedFiles[i]);\n return {};\n };\n ajax.send(formData);\n }\n }\n };\n Uploader.prototype.spliceFiles = function (liIndex) {\n var liElement = this.fileList[liIndex];\n var allFiles = this.getFilesData();\n var nameElements = +liElement.getAttribute('data-files-count');\n var startIndex = 0;\n for (var i = 0; i < liIndex; i++) {\n startIndex += (+this.fileList[i].getAttribute('data-files-count'));\n }\n var endIndex = (startIndex + nameElements) - 1;\n for (var j = endIndex; j >= startIndex; j--) {\n allFiles.splice(j, 1);\n }\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Remove the uploaded file from server manually by calling the remove URL action.\n * If you pass an empty argument to this method, the complete file list can be cleared,\n * otherwise remove the specific file based on its argument (“file_data”).\n *\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to remove from file list/server.\n * @param { boolean } customTemplate - Set true if the component rendering with customize template.\n * @param { boolean } removeDirectly - Set true if files remove without removing event.\n * @param { boolean } postRawFile - Set false, to post file name only to the remove action.\n * @returns {void}\n */\n Uploader.prototype.remove = function (fileData, customTemplate, removeDirectly, postRawFile, args) {\n var _this = this;\n if (isNullOrUndefined(postRawFile)) {\n postRawFile = true;\n }\n var eventArgs = {\n event: args,\n cancel: false,\n filesData: [],\n customFormData: [],\n postRawFile: postRawFile,\n currentRequest: null\n };\n var beforeEventArgs = {\n cancel: false,\n customFormData: [],\n currentRequest: null\n };\n this.trigger('beforeRemove', beforeEventArgs, function (beforeEventArgs) {\n if (!beforeEventArgs.cancel) {\n if (_this.isFormUpload()) {\n eventArgs.filesData = fileData;\n _this.trigger('removing', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel) {\n var removingFiles = _this.getFilesInArray(fileData);\n var isLiRemoved = false;\n var liIndex = void 0;\n for (var _i = 0, removingFiles_1 = removingFiles; _i < removingFiles_1.length; _i++) {\n var data = removingFiles_1[_i];\n if (!isLiRemoved) {\n liIndex = _this.fileList.indexOf(data.list);\n }\n if (liIndex > -1) {\n var inputElement = !isNullOrUndefined(data.input) ? data.input : null;\n if (inputElement) {\n detach(inputElement);\n }\n _this.spliceFiles(liIndex);\n detach(_this.fileList[liIndex]);\n _this.fileList.splice(liIndex, 1);\n isLiRemoved = true;\n liIndex = -1;\n }\n }\n }\n });\n }\n else if (_this.isForm && (isNullOrUndefined(_this.asyncSettings.removeUrl) || _this.asyncSettings.removeUrl === '')) {\n eventArgs.filesData = _this.getFilesData();\n _this.trigger('removing', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel) {\n _this.clearAll();\n }\n });\n }\n else {\n var removeFiles = [];\n fileData = !isNullOrUndefined(fileData) ? fileData : _this.filesData;\n if (fileData instanceof Array) {\n removeFiles = fileData;\n }\n else {\n removeFiles.push(fileData);\n }\n eventArgs.filesData = removeFiles;\n var removeUrl = _this.asyncSettings.removeUrl;\n var validUrl = (removeUrl === '' || isNullOrUndefined(removeUrl)) ? false : true;\n var _loop_5 = function (files) {\n var fileUploadedIndex = _this.uploadedFilesData.indexOf(files);\n if ((files.statusCode === '2' || files.statusCode === '4' || (files.statusCode === '0' &&\n fileUploadedIndex !== -1)) && validUrl) {\n _this.removeUploadedFile(files, eventArgs, removeDirectly, customTemplate);\n }\n else {\n if (!removeDirectly) {\n _this.trigger('removing', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel) {\n _this.removeFilesData(files, customTemplate);\n }\n });\n }\n else {\n _this.removeFilesData(files, customTemplate);\n }\n }\n if (args && !args.target.classList.contains(REMOVE_ICON)) {\n _this.checkActionComplete(false);\n }\n };\n for (var _i = 0, removeFiles_1 = removeFiles; _i < removeFiles_1.length; _i++) {\n var files = removeFiles_1[_i];\n _loop_5(files);\n }\n }\n }\n });\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n /**\n * Clear all the file entries from list that can be uploaded files or added in upload queue.\n *\n * @returns {void}\n */\n Uploader.prototype.clearAll = function () {\n var _this = this;\n if (isNullOrUndefined(this.listParent)) {\n if (this.browserName !== 'msie') {\n this.element.value = '';\n }\n this.filesData = [];\n return;\n }\n var eventArgs = {\n cancel: false,\n filesData: this.filesData\n };\n this.trigger('clearing', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel) {\n _this.clearData();\n _this.actionCompleteCount = 0;\n _this.count = -1;\n }\n });\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Get the data of files which are shown in file list.\n *\n * @param { number } index - specifies the file list item(li) index.\n * @returns {FileInfo[]}\n */\n Uploader.prototype.getFilesData = function (index) {\n if (isNullOrUndefined(index)) {\n return this.filesData;\n }\n else {\n return this.getSelectedFiles(index);\n }\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Pauses the in-progress chunked upload based on the file data.\n *\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to pause from uploading.\n * @param { boolean } custom - Set true if used custom UI.\n * @returns {void}\n */\n Uploader.prototype.pause = function (fileData, custom) {\n fileData = fileData ? fileData : this.filesData;\n var fileDataFiles = this.getFilesInArray(fileData);\n this.pauseUploading(fileDataFiles, custom);\n };\n Uploader.prototype.pauseUploading = function (fileData, custom) {\n var files = this.getFiles(fileData);\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '3') {\n this.pauseUpload(this.getCurrentMetaData(files[i], null), null, custom);\n }\n }\n };\n Uploader.prototype.getFiles = function (fileData) {\n var files = [];\n if (!isNullOrUndefined(fileData) && !(fileData instanceof Array)) {\n files.push(fileData);\n }\n else {\n files = fileData;\n }\n return files;\n };\n /**\n * Resumes the chunked upload that is previously paused based on the file data.\n *\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to resume the paused file.\n * @param { boolean } custom - Set true if used custom UI.\n * @returns {void}\n */\n Uploader.prototype.resume = function (fileData, custom) {\n fileData = fileData ? fileData : this.filesData;\n var fileDataFiles = this.getFilesInArray(fileData);\n this.resumeFiles(fileDataFiles, custom);\n };\n Uploader.prototype.resumeFiles = function (fileData, custom) {\n var files = this.getFiles(fileData);\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '4') {\n this.resumeUpload(this.getCurrentMetaData(files[i], null), null, custom);\n }\n }\n };\n /**\n * Retries the canceled or failed file upload based on the file data.\n *\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to retry the canceled or failed file.\n * @param { boolean } fromcanceledStage - Set true to retry from canceled stage and set false to retry from initial stage.\n * @param {boolean} custom -Specifies whether the uploader is rendered with custom file list.\n * @returns {void}\n */\n Uploader.prototype.retry = function (fileData, fromcanceledStage, custom) {\n fileData = fileData ? fileData : this.filesData;\n var fileDataFiles = this.getFilesInArray(fileData);\n if (this.sequentialUpload && this.isFirstFileOnSelection) {\n this.isFirstFileOnSelection = false;\n }\n this.retryFailedFiles(fileDataFiles, fromcanceledStage, custom);\n };\n Uploader.prototype.retryFailedFiles = function (fileData, fromcanceledStage, custom) {\n var files = this.getFiles(fileData);\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '5' || files[i].statusCode === '0') {\n if (this.asyncSettings.chunkSize > 0 && this.getCurrentMetaData(files[i], null)) {\n this.retryUpload(this.getCurrentMetaData(files[i], null), fromcanceledStage);\n }\n else {\n var liElement = void 0;\n if (!custom) {\n liElement = this.fileList[this.filesData.indexOf(files[i])];\n }\n this.reloadcanceledFile(null, files[i], liElement, custom);\n }\n }\n }\n };\n /**\n * Stops the in-progress chunked upload based on the file data.\n * When the file upload is canceled, the partially uploaded file is removed from server.\n *\n * @param { FileInfo | FileInfo[] } fileData - specifies the files data to cancel the progressing file.\n * @returns {void}\n */\n Uploader.prototype.cancel = function (fileData) {\n fileData = fileData ? fileData : this.filesData;\n var cancelingFiles = this.getFilesInArray(fileData);\n this.cancelUpload(cancelingFiles);\n };\n Uploader.prototype.cancelUpload = function (fileData) {\n var files = this.getFiles(fileData);\n if (this.asyncSettings.chunkSize > 0) {\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '3') {\n var metaData = this.getCurrentMetaData(files[i], null);\n metaData.file.statusCode = '5';\n metaData.file.status = this.localizedTexts('fileUploadCancel');\n this.updateMetaData(metaData);\n this.showHideUploadSpinner(files[i]);\n }\n }\n }\n else {\n for (var i = 0; i < files.length; i++) {\n if (files[i].statusCode === '3') {\n files[i].statusCode = '5';\n files[i].status = this.localizedTexts('fileUploadCancel');\n this.showHideUploadSpinner(files[i]);\n }\n }\n }\n };\n Uploader.prototype.showHideUploadSpinner = function (files) {\n var liElement = this.getLiElement(files);\n if (!isNullOrUndefined(liElement) && isNullOrUndefined(this.template)) {\n var spinnerTarget = liElement.querySelector('.' + ABORT_ICON);\n createSpinner({ target: spinnerTarget, width: '20px' });\n showSpinner(spinnerTarget);\n }\n };\n __decorate([\n Complex({ saveUrl: '', removeUrl: '' }, AsyncSettings)\n ], Uploader.prototype, \"asyncSettings\", void 0);\n __decorate([\n Property(false)\n ], Uploader.prototype, \"sequentialUpload\", void 0);\n __decorate([\n Property({})\n ], Uploader.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property('')\n ], Uploader.prototype, \"cssClass\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"enabled\", void 0);\n __decorate([\n Property(null)\n ], Uploader.prototype, \"template\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"multiple\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"autoUpload\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Complex({}, ButtonsProps)\n ], Uploader.prototype, \"buttons\", void 0);\n __decorate([\n Property('')\n ], Uploader.prototype, \"allowedExtensions\", void 0);\n __decorate([\n Property(0)\n ], Uploader.prototype, \"minFileSize\", void 0);\n __decorate([\n Property(30000000)\n ], Uploader.prototype, \"maxFileSize\", void 0);\n __decorate([\n Property(null)\n ], Uploader.prototype, \"dropArea\", void 0);\n __decorate([\n Collection([{}], FilesProp)\n ], Uploader.prototype, \"files\", void 0);\n __decorate([\n Property(true)\n ], Uploader.prototype, \"showFileList\", void 0);\n __decorate([\n Property(false)\n ], Uploader.prototype, \"directoryUpload\", void 0);\n __decorate([\n Property('Default')\n ], Uploader.prototype, \"dropEffect\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"actionComplete\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"rendering\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"beforeUpload\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"fileListRendering\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"selected\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"uploading\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"success\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"failure\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"removing\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"beforeRemove\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"clearing\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"progress\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"chunkSuccess\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"chunkFailure\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"chunkUploading\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"canceling\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"pausing\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"resuming\", void 0);\n Uploader = __decorate([\n NotifyPropertyChanges\n ], Uploader);\n return Uploader;\n}(Component));\nexport { Uploader };\n/* eslint-enable @typescript-eslint/no-explicit-any */\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { ChildProperty, extend, deleteObject, Property, addClass, isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * @param {Object} props - Specifies the properties\n * @param {string[]} model - Specifies the model\n * @returns {Object} Component Model\n */\nexport function getModel(props, model) {\n var obj = extend({}, props);\n for (var _i = 0, _a = Object.keys(obj); _i < _a.length; _i++) {\n var prop = _a[_i];\n if ((model).indexOf(prop) < 0) {\n deleteObject(obj, prop);\n }\n }\n return obj;\n}\n/** @hidden\n * @param {HTMLElement} ul - Specifies the UL element\n * @param {number} keyCode - Specifies the keycode\n * @returns {void}\n */\nexport function upDownKeyHandler(ul, keyCode) {\n var defaultIdx = keyCode === 40 ? 0 : ul.childElementCount - 1;\n var liIdx = defaultIdx;\n var li;\n var selectedLi = ul.querySelector('.e-selected');\n if (selectedLi) {\n selectedLi.classList.remove('e-selected');\n }\n for (var i = 0, len = ul.children.length; i < len; i++) {\n if (ul.children[i].classList.contains('e-focused')) {\n li = ul.children[i];\n liIdx = i;\n li.classList.remove('e-focused');\n if (keyCode === 40) {\n liIdx++;\n }\n else {\n liIdx--;\n }\n if (liIdx === (keyCode === 40 ? ul.childElementCount : -1)) {\n liIdx = defaultIdx;\n }\n }\n }\n li = ul.children[liIdx];\n liIdx = isValidLI(ul, li, liIdx, keyCode);\n if (liIdx !== -1) {\n addClass([ul.children[liIdx]], 'e-focused');\n ul.children[liIdx].focus();\n }\n}\n/**\n * Get Valid LI element\n *\n * @param {HTMLElement} ul - Specifies the UL element\n * @param {Element} li - Specifies the LI element\n * @param {number} index - Specifies the index\n * @param {number} keyCode - Specifies the keycode\n * @param {number} count - Specifies the count\n * @returns {number} - Index\n */\nfunction isValidLI(ul, li, index, keyCode, count) {\n if (count === void 0) { count = 0; }\n if (li.classList.contains('e-separator') || li.classList.contains('e-disabled')) {\n if (index === (keyCode === 40 ? ul.childElementCount - 1 : 0)) {\n index = keyCode === 40 ? 0 : ul.childElementCount - 1;\n }\n else {\n if (keyCode === 40) {\n index++;\n }\n else {\n index--;\n }\n }\n }\n li = ul.children[index];\n if (li.classList.contains('e-separator') || li.classList.contains('e-disabled')) {\n count++;\n if (count === ul.childElementCount) {\n return index = -1;\n }\n index = isValidLI(ul, li, index, keyCode, count);\n }\n return index;\n}\n/** @hidden\n * @param {HTMLElement} popup - Specifies the popup element.\n * @returns {void}\n */\nexport function setBlankIconStyle(popup, blankIcon) {\n var blankIconList = [].slice.call(popup.getElementsByClassName('e-blank-icon'));\n if (blankIcon) {\n var menuItem = [].slice.call(popup.getElementsByClassName('e-item'));\n menuItem.forEach(function (li) {\n if (li.style.paddingLeft || li.style.paddingRight) {\n li.removeAttribute('style');\n }\n });\n }\n if (!blankIconList.length) {\n return;\n }\n var iconLi = popup.querySelector('.e-item:not(.e-blank-icon):not(.e-separator)');\n if (isNullOrUndefined(iconLi)) {\n return;\n }\n if (iconLi.classList.contains('e-url')) {\n iconLi = iconLi.querySelector('.e-menu-url');\n }\n var icon = iconLi.querySelector('.e-menu-icon');\n var cssProp;\n var enableRtl = popup.classList.contains('e-rtl');\n if (enableRtl) {\n cssProp = { padding: 'paddingRight', margin: 'marginLeft' };\n }\n else {\n cssProp = { padding: 'paddingLeft', margin: 'marginRight' };\n }\n /* eslint-disable */\n var size = parseInt(getComputedStyle(icon).fontSize, 10) + parseInt((enableRtl ? getComputedStyle(icon)[cssProp.margin] : getComputedStyle(icon)[cssProp.margin]), 10)\n + parseInt(getComputedStyle(iconLi).paddingLeft, 10) + \"px\";\n blankIconList.forEach(function (li) {\n if (li.classList.contains('e-url')) {\n li.querySelector('.e-menu-url').style[cssProp.padding] = size;\n }\n else {\n li.style[cssProp.padding] = size;\n }\n });\n /* eslint-enable */\n}\n/**\n * Defines the items of Split Button/DropDownButton.\n */\nvar Item = /** @class */ (function (_super) {\n __extends(Item, _super);\n function Item() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], Item.prototype, \"iconCss\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"id\", void 0);\n __decorate([\n Property(false)\n ], Item.prototype, \"separator\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"text\", void 0);\n __decorate([\n Property('')\n ], Item.prototype, \"url\", void 0);\n __decorate([\n Property(false)\n ], Item.prototype, \"disabled\", void 0);\n return Item;\n}(ChildProperty));\nexport { Item };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Collection, Event, NotifyPropertyChanges, detach, Property, EventHandler, isRippleEnabled, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { addClass, getUniqueID, rippleEffect, getComponent } from '@syncfusion/ej2-base';\nimport { attributes, Component, closest, select, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { classList, removeClass } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { Popup } from '@syncfusion/ej2-popups';\nimport { upDownKeyHandler } from './../common/common';\nimport { getModel, Item, setBlankIconStyle } from './../common/common';\nvar classNames = {\n DISABLED: 'e-disabled',\n FOCUS: 'e-focused',\n ICON: 'e-menu-icon',\n ITEM: 'e-item',\n POPUP: 'e-dropdown-popup',\n RTL: 'e-rtl',\n SEPARATOR: 'e-separator',\n VERTICAL: 'e-vertical'\n};\n/**\n * DropDownButton component is used to toggle contextual overlays for displaying list of action items.\n * It can contain both text and images.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar DropDownButton = /** @class */ (function (_super) {\n __extends(DropDownButton, _super);\n /**\n * Constructor for creating the widget\n *\n * @param {DropDownButtonModel} options - Specifies dropdown button model\n * @param {string|HTMLButtonElement} element - Specifies element\n * @hidden\n */\n function DropDownButton(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isPopupCreated = true;\n return _this;\n }\n DropDownButton.prototype.preRender = function () {\n /** */\n };\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @returns {string} - Persist data\n */\n DropDownButton.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * To open/close DropDownButton popup based on current state of the DropDownButton.\n *\n * @returns {void}\n */\n DropDownButton.prototype.toggle = function () {\n if (this.canOpen()) {\n this.openPopUp();\n }\n else if (this.createPopupOnClick && !this.isPopupCreated) {\n this.createPopup();\n this.openPopUp();\n }\n else {\n this.closePopup();\n }\n };\n /**\n * Initialize the Component rendering\n *\n * @returns {void}\n * @private\n */\n DropDownButton.prototype.render = function () {\n this.initialize();\n if (!this.disabled) {\n this.wireEvents();\n }\n this.renderComplete();\n };\n /**\n * Adds a new item to the menu. By default, new item appends to the list as the last item,\n * but you can insert based on the text parameter.\n *\n * @param { ItemModel[] } items - Specifies an array of JSON data.\n * @param { string } text - Specifies the text to insert the newly added item in the menu.\n * @returns {void}.\n */\n DropDownButton.prototype.addItems = function (items, text) {\n var newItem;\n var idx = this.items.length;\n for (var j = 0, len = this.items.length; j < len; j++) {\n if (text === this.items[j].text) {\n idx = j;\n break;\n }\n }\n for (var i = items.length - 1; i >= 0; i--) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n newItem = new Item(this, 'items', items[i], true);\n this.items.splice(idx, 0, newItem);\n }\n if (!this.canOpen()) {\n this.createItems();\n }\n };\n /**\n * Removes the items from the menu.\n *\n * @param { string[] } items - Specifies an array of string to remove the items.\n * @param { string } isUniqueId - Set `true` if specified items is a collection of unique id.\n * @returns {void}.\n */\n DropDownButton.prototype.removeItems = function (items, isUniqueId) {\n var refresh = false;\n for (var i = 0, len = items.length; i < len; i++) {\n for (var j = 0, len_1 = this.items.length; j < len_1; j++) {\n if (items[i] === (isUniqueId ? this.items[j].id : this.items[j].text)) {\n this.items.splice(j, 1);\n refresh = true;\n break;\n }\n }\n }\n if (refresh && this.getULElement()) {\n this.createItems();\n }\n };\n DropDownButton.prototype.createPopup = function () {\n var _a;\n var div = this.createElement('div', {\n className: classNames.POPUP,\n id: this.element.id + '-popup'\n });\n document.body.appendChild(div);\n this.dropDown = new Popup(div, {\n relateTo: this.element,\n collision: { X: 'fit', Y: 'flip' },\n position: { X: 'left', Y: 'bottom' },\n targetType: 'relative',\n content: this.target ? this.getTargetElement() : '',\n enableRtl: this.enableRtl\n });\n this.dropDown.element.setAttribute('role', 'dialog');\n this.dropDown.element.setAttribute('aria-label', 'dropdown menu');\n if (!isNullOrUndefined(this.popupContent)) {\n this.popupContent.style.display = '';\n }\n if (this.dropDown.element.style.position === 'fixed') {\n this.dropDown.refreshPosition(this.element);\n }\n this.dropDown.hide();\n attributes(this.element, (_a = {},\n _a['aria-haspopup'] = this.items.length || this.target ? 'true' : 'false',\n _a['aria-expanded'] = 'false',\n _a['type'] = 'button',\n _a));\n if (this.cssClass) {\n addClass([div], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n this.isPopupCreated = true;\n };\n DropDownButton.prototype.getTargetElement = function () {\n if (this.createPopupOnClick && !this.isColorPicker() && !isNullOrUndefined(this.popupContent)) {\n return this.popupContent;\n }\n return typeof (this.target) === 'string' ? select(this.target) : this.target;\n };\n DropDownButton.prototype.createItems = function (appendItems) {\n var items = this.items;\n var showIcon = this.hasIcon(this.items, 'iconCss');\n var span;\n var item;\n var li;\n var eventArgs;\n var ul = this.getULElement();\n if (ul) {\n ul.innerHTML = '';\n }\n else {\n ul = this.createElement('ul', {\n attrs: { 'role': 'menu', 'tabindex': '0' }\n });\n }\n for (var i = 0; i < items.length; i++) {\n item = items[i];\n var tempItem = item.text;\n li = this.createElement('li', {\n innerHTML: item.url ? '' : tempItem,\n className: item.separator ? classNames.ITEM + ' ' + classNames.SEPARATOR : classNames.ITEM,\n attrs: item.separator ? { 'role': 'separator', 'tabindex': '-1', 'aria-label': 'separator', 'aria-hidden': 'true' } : { 'role': 'menuitem', 'tabindex': '-1', 'aria-label': tempItem },\n id: item.id ? item.id : getUniqueID('e-' + this.getModuleName() + '-item')\n });\n if (this.enableHtmlSanitizer) {\n li.textContent = item.url ? '' : tempItem;\n }\n else {\n li.innerHTML = item.url ? '' : tempItem;\n }\n if (item.url) {\n li.appendChild(this.createAnchor(item));\n li.classList.add('e-url');\n }\n if (item.iconCss) {\n span = this.createElement('span', { className: classNames.ICON + ' ' + item.iconCss });\n if (item.url) {\n li.childNodes[0].appendChild(span);\n }\n else {\n li.insertBefore(span, li.childNodes[0]);\n }\n }\n else {\n if (showIcon && !item.separator) {\n li.classList.add('e-blank-icon');\n }\n }\n var beforeDisabled = item.disabled;\n if (item.disabled) {\n li.classList.add('e-disabled');\n }\n eventArgs = { item: item, element: li };\n this.trigger('beforeItemRender', eventArgs);\n var afterDisabled = eventArgs.item.disabled;\n if (beforeDisabled !== afterDisabled) {\n if (eventArgs.item.disabled) {\n li.classList.add('e-disabled');\n }\n else {\n li.classList.remove('e-disabled');\n }\n }\n ul.appendChild(li);\n }\n if (appendItems) {\n this.getPopUpElement().appendChild(ul);\n }\n if (showIcon) {\n setBlankIconStyle(this.getPopUpElement());\n }\n };\n DropDownButton.prototype.hasIcon = function (items, field) {\n for (var i = 0, len = items.length; i < len; i++) {\n if (items[i][\"\" + field]) {\n return true;\n }\n }\n return false;\n };\n DropDownButton.prototype.createAnchor = function (item) {\n var tempItem = (this.enableHtmlSanitizer) ? SanitizeHtmlHelper.sanitize(item.text) : item.text;\n return this.createElement('a', { className: 'e-menu-text e-menu-url', innerHTML: tempItem, attrs: { 'href': item.url } });\n };\n DropDownButton.prototype.initialize = function () {\n this.button = new Button({\n iconCss: this.iconCss, iconPosition: this.iconPosition, cssClass: this.cssClass, content: this.content,\n disabled: this.disabled, enableRtl: this.enableRtl, enablePersistence: this.enablePersistence\n });\n this.button.createElement = this.createElement;\n this.button.appendTo(this.element);\n if (!this.element.id) {\n this.element.id = getUniqueID('e-' + this.getModuleName());\n }\n this.appendArrowSpan();\n this.setActiveElem([this.element]);\n this.element.setAttribute('tabindex', '0');\n this.element.setAttribute('aria-label', this.element.textContent ? this.element.textContent : 'dropdownbutton');\n if ((this.target && !this.isColorPicker() && !this.createPopupOnClick) || !this.createPopupOnClick) {\n this.createPopup();\n }\n else {\n this.isPopupCreated = false;\n if (this.target && !this.isColorPicker() && this.createPopupOnClick) {\n this.popupContent = this.getTargetElement();\n this.popupContent.style.display = 'none';\n }\n }\n };\n DropDownButton.prototype.isColorPicker = function () {\n if (!this.element) {\n return false;\n }\n var prevElem = this.element.previousSibling;\n if (prevElem && prevElem.classList && prevElem.classList.contains('e-split-colorpicker')) {\n return true;\n }\n return false;\n };\n DropDownButton.prototype.appendArrowSpan = function () {\n this.element.appendChild(this.createElement('span', {\n className: 'e-btn-icon e-icons ' + 'e-icon-' + (this.cssClass.indexOf(classNames.VERTICAL) > -1\n ? 'bottom' : 'right') + ' e-caret'\n }));\n };\n DropDownButton.prototype.setActiveElem = function (elem) {\n this.activeElem = elem;\n };\n /**\n * Get component name.\n *\n * @returns {string} - Module Name\n * @private\n */\n DropDownButton.prototype.getModuleName = function () {\n return 'dropdown-btn';\n };\n DropDownButton.prototype.canOpen = function () {\n var val = false;\n if (this.isPopupCreated) {\n val = this.getPopUpElement().classList.contains('e-popup-close');\n }\n return val;\n };\n /**\n * Destroys the widget.\n *\n * @returns {void}\n */\n DropDownButton.prototype.destroy = function () {\n var _this = this;\n _super.prototype.destroy.call(this);\n if (this.getModuleName() === 'dropdown-btn') {\n var classList_1;\n if (this.element.querySelector('span.e-caret')) {\n detach(this.element.querySelector('span.e-caret'));\n }\n if (this.cssClass) {\n classList_1 = this.cssClass.split(' ');\n }\n this.button.destroy();\n if (classList_1) {\n removeClass([this.element], classList_1);\n }\n removeClass(this.activeElem, ['e-active']);\n var attrList = this.element.getAttribute('class') ? ['aria-haspopup', 'aria-expanded', 'aria-owns', 'type']\n : ['aria-haspopup', 'aria-expanded', 'aria-owns', 'type', 'class'];\n attrList.forEach(function (key) {\n _this.element.removeAttribute(key);\n });\n this.popupUnWireEvents();\n this.destroyPopup();\n this.isPopupCreated = false;\n if (!this.disabled) {\n this.unWireEvents();\n }\n }\n };\n DropDownButton.prototype.destroyPopup = function () {\n if (this.isPopupCreated) {\n this.dropDown.destroy();\n if (this.getPopUpElement()) {\n var popupEle = document.getElementById(this.getPopUpElement().id);\n if (popupEle) {\n removeClass([popupEle], ['e-popup-open', 'e-popup-close']);\n detach(popupEle);\n }\n }\n EventHandler.remove(this.getPopUpElement(), 'click', this.clickHandler);\n EventHandler.remove(this.getPopUpElement(), 'keydown', this.keyBoardHandler);\n if (this.isPopupCreated && this.dropDown) {\n this.dropDown.element = null;\n this.dropDown = undefined;\n }\n }\n this.isPopupCreated = false;\n };\n DropDownButton.prototype.getPopUpElement = function () {\n var val = null;\n if (!this.dropDown && this.activeElem[0].classList.contains('e-split-btn')) {\n var dropDownBtn = getComponent(this.activeElem[1], 'dropdown-btn');\n if (dropDownBtn) {\n this.dropDown = dropDownBtn.dropDown;\n }\n }\n if (this.dropDown) {\n val = this.dropDown.element;\n }\n return val;\n };\n DropDownButton.prototype.getULElement = function () {\n var val = null;\n if (this.getPopUpElement()) {\n val = this.getPopUpElement().children[0];\n }\n return val;\n };\n DropDownButton.prototype.wireEvents = function () {\n this.delegateMousedownHandler = this.mousedownHandler.bind(this);\n if (!this.createPopupOnClick) {\n EventHandler.add(document, 'mousedown touchstart', this.delegateMousedownHandler, this);\n }\n EventHandler.add(this.element, 'click', this.clickHandler, this);\n EventHandler.add(this.element, 'keydown', this.keyBoardHandler, this);\n EventHandler.add(window, 'resize', this.windowResize, this);\n };\n DropDownButton.prototype.windowResize = function () {\n if (!this.canOpen() && this.dropDown) {\n this.dropDown.refreshPosition(this.element);\n }\n };\n DropDownButton.prototype.popupWireEvents = function () {\n if (!this.delegateMousedownHandler) {\n this.delegateMousedownHandler = this.mousedownHandler.bind(this);\n }\n var popupElement = this.getPopUpElement();\n if (this.createPopupOnClick) {\n EventHandler.add(document, 'mousedown touchstart', this.delegateMousedownHandler, this);\n }\n if (popupElement) {\n EventHandler.add(popupElement, 'click', this.clickHandler, this);\n EventHandler.add(popupElement, 'keydown', this.keyBoardHandler, this);\n if (this.closeActionEvents) {\n EventHandler.add(popupElement, this.closeActionEvents, this.focusoutHandler, this);\n }\n }\n this.rippleFn = rippleEffect(popupElement, { selector: '.' + classNames.ITEM });\n };\n DropDownButton.prototype.popupUnWireEvents = function () {\n var popupElement = this.getPopUpElement();\n if (this.createPopupOnClick) {\n EventHandler.remove(document, 'mousedown touchstart', this.delegateMousedownHandler);\n }\n if (popupElement && popupElement.parentElement) {\n EventHandler.remove(popupElement, 'click', this.clickHandler);\n EventHandler.remove(popupElement, 'keydown', this.keyBoardHandler);\n if (this.closeActionEvents) {\n EventHandler.remove(popupElement, this.closeActionEvents, this.focusoutHandler);\n }\n }\n if (isRippleEnabled && this.rippleFn) {\n this.rippleFn();\n }\n };\n /**\n * Handles the keyboard interactions.\n *\n * @param {KeyboardEventArgs} e - Specifies keyboard event args.\n * @returns {void}\n * @hidden\n */\n DropDownButton.prototype.keyBoardHandler = function (e) {\n if (e.target === this.element && (e.keyCode === 9 || (!e.altKey && e.keyCode === 40) || e.keyCode === 38)) {\n return;\n }\n switch (e.keyCode) {\n case 38:\n case 40:\n if (e.altKey && (e.keyCode === 38 || e.keyCode === 40)) {\n this.keyEventHandler(e);\n }\n else {\n this.upDownKeyHandler(e);\n }\n break;\n case 9:\n case 13:\n case 27:\n case 32:\n this.keyEventHandler(e);\n break;\n }\n };\n DropDownButton.prototype.upDownKeyHandler = function (e) {\n if (this.target && (e.keyCode === 38 || e.keyCode === 40)) {\n return;\n }\n e.preventDefault();\n upDownKeyHandler(this.getULElement(), e.keyCode);\n };\n DropDownButton.prototype.keyEventHandler = function (e) {\n if (this.target && (e.keyCode === 13 || e.keyCode === 9)) {\n return;\n }\n if (e.keyCode === 13 && this.activeElem[0].classList.contains('e-split-btn')) {\n this.triggerSelect(e);\n this.activeElem[0].focus();\n return;\n }\n if (e.target && e.target.className.indexOf('e-edit-template') > -1 && e.keyCode === 32) {\n return;\n }\n if (e.keyCode !== 9) {\n e.preventDefault();\n }\n if (e.keyCode === 27 || e.keyCode === 38 || e.keyCode === 9) {\n if (!this.canOpen()) {\n this.closePopup(e, this.element);\n }\n }\n else {\n this.clickHandler(e);\n }\n };\n DropDownButton.prototype.getLI = function (elem) {\n return elem.tagName === 'LI' ? elem : closest(elem, 'li');\n };\n DropDownButton.prototype.mousedownHandler = function (e) {\n var trgt = e.target;\n if (this.dropDown && !this.canOpen() && !(closest(trgt, '[id=\"' + this.getPopUpElement().id + '\"]')\n || closest(trgt, '[id=\"' + this.element.id + '\"]'))) {\n this.closePopup(e);\n }\n };\n DropDownButton.prototype.focusoutHandler = function (e) {\n if (this.isPopupCreated && !this.canOpen()) {\n var liTarget = e.relatedTarget;\n if (liTarget && liTarget.className.indexOf('e-item') > -1) {\n var li = this.getLI(liTarget);\n if (li) {\n var liIdx = Array.prototype.indexOf.call(this.getULElement().children, li);\n var item = this.items[liIdx];\n if (item) {\n var selectEventArgs = { element: li, item: item, event: e };\n this.trigger('select', selectEventArgs);\n }\n }\n }\n this.closePopup(e);\n }\n };\n DropDownButton.prototype.clickHandler = function (e) {\n var trgt = e.target;\n if (closest(trgt, '[id=\"' + this.element.id + '\"]')) {\n if (!this.createPopupOnClick || (this.target && this.target !== '' && !this.isColorPicker() && !this.createPopupOnClick)) {\n if (this.getPopUpElement().classList.contains('e-popup-close')) {\n this.openPopUp(e);\n }\n else {\n this.closePopup(e);\n }\n }\n else if (this.isPopupCreated) {\n this.closePopup(e, this.activeElem[0]);\n }\n else {\n this.createPopup();\n this.openPopUp(e);\n }\n }\n else {\n if (closest(trgt, '[id=\"' + this.getPopUpElement().id + '\"]')) {\n var li = this.getLI(e.target);\n if (li) {\n this.triggerSelect(e);\n this.closePopup(e, this.activeElem[0]);\n }\n }\n }\n };\n DropDownButton.prototype.triggerSelect = function (e) {\n var eventArgs;\n var liIdx;\n var item;\n var li = this.getLI(e.target);\n if (li) {\n liIdx = Array.prototype.indexOf.call(this.getULElement().children, li);\n item = this.items[liIdx];\n if (item) {\n eventArgs = { element: li, item: item, event: e };\n this.trigger('select', eventArgs);\n }\n }\n };\n DropDownButton.prototype.openPopUp = function (e) {\n var _this = this;\n if (e === void 0) { e = null; }\n var isReact = false;\n var popupElem = this.getPopUpElement();\n if (!this.target) {\n this.createItems(true);\n }\n else {\n if (this.activeElem.length > 1) {\n var splitButton = getComponent(this.activeElem[0], 'split-btn');\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (splitButton.isReact && popupElem.childNodes.length < 1) {\n isReact = true;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n splitButton.appendReactElement(this.getTargetElement(), this.getPopUpElement());\n this.renderReactTemplates();\n }\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isReact && popupElem.childNodes.length < 1) {\n isReact = true;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.appendReactElement(this.getTargetElement(), this.getPopUpElement());\n this.renderReactTemplates();\n }\n }\n }\n var ul = this.getULElement();\n this.popupWireEvents();\n var beforeOpenArgs = { element: ul, items: this.items, event: e, cancel: false };\n this.trigger('beforeOpen', beforeOpenArgs, function (observedArgs) {\n if (!observedArgs.cancel) {\n var ul_1 = _this.getULElement();\n _this.dropDown.show(null, _this.element);\n addClass([_this.element], 'e-active');\n _this.element.setAttribute('aria-expanded', 'true');\n _this.element.setAttribute('aria-owns', _this.getPopUpElement().id);\n if (ul_1) {\n ul_1.focus();\n }\n if (_this.enableRtl && ul_1.parentElement.style.left !== '0px') {\n var wrapperWidth = void 0;\n if (_this.element.parentElement && _this.element.parentElement.classList.contains('e-split-btn-wrapper')) {\n wrapperWidth = _this.element.parentElement.offsetWidth;\n }\n else {\n wrapperWidth = _this.element.offsetWidth;\n }\n var popupRect = ul_1.parentElement.offsetWidth - wrapperWidth;\n var popupLeft = parseFloat(ul_1.parentElement.style.left) - popupRect;\n if (popupLeft < 0) {\n popupLeft = 0;\n }\n ul_1.parentElement.style.left = popupLeft + \"px\";\n }\n var openArgs = { element: ul_1, items: _this.items };\n _this.trigger('open', openArgs);\n }\n });\n };\n DropDownButton.prototype.closePopup = function (e, focusEle) {\n var _this = this;\n if (e === void 0) { e = null; }\n var ul = this.getULElement();\n var beforeCloseArgs = { element: ul, items: this.items, event: e, cancel: false };\n this.trigger('beforeClose', beforeCloseArgs, function (observedArgs) {\n if (!observedArgs.cancel) {\n var popupElement = _this.getPopUpElement();\n if (popupElement) {\n EventHandler.remove(popupElement, 'keydown', _this.keyBoardHandler);\n }\n _this.popupUnWireEvents();\n var ul_2 = _this.getULElement();\n var selectedLi = void 0;\n if (ul_2) {\n selectedLi = ul_2.querySelector('.e-selected');\n }\n if (selectedLi) {\n selectedLi.classList.remove('e-selected');\n }\n _this.dropDown.hide();\n removeClass(_this.activeElem, 'e-active');\n _this.element.setAttribute('aria-expanded', 'false');\n _this.element.removeAttribute('aria-owns');\n if (focusEle) {\n focusEle.focus();\n }\n var closeArgs = { element: ul_2, items: _this.items };\n _this.trigger('close', closeArgs);\n if (!_this.target && ul_2) {\n detach(ul_2);\n }\n if (!_this.target || _this.isColorPicker() || (_this.target && !_this.isColorPicker())) {\n if (_this.createPopupOnClick) {\n _this.destroyPopup();\n }\n }\n }\n else {\n if (ul) {\n ul.focus();\n }\n }\n });\n };\n DropDownButton.prototype.unWireEvents = function () {\n if (!this.createPopupOnClick) {\n EventHandler.remove(document, 'mousedown touchstart', this.delegateMousedownHandler);\n }\n EventHandler.remove(this.element, 'click', this.clickHandler);\n EventHandler.remove(this.element, 'keydown', this.keyBoardHandler);\n if (this.isPopupCreated) {\n EventHandler.remove(this.getPopUpElement(), 'click', this.clickHandler);\n EventHandler.remove(this.getPopUpElement(), 'keydown', this.keyBoardHandler);\n }\n EventHandler.remove(window, 'resize', this.windowResize);\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {DropDownButtonModel} newProp - Specifies new properties\n * @param {DropDownButtonModel} oldProp - Specifies old properties\n * @returns {void}\n * @private\n */\n DropDownButton.prototype.onPropertyChanged = function (newProp, oldProp) {\n var btnModel = ['content', 'cssClass', 'iconCss', 'iconPosition', 'disabled', 'enableRtl'];\n this.button.setProperties(getModel(newProp, btnModel));\n var popupElement;\n if (this.isPopupCreated) {\n popupElement = this.getPopUpElement();\n this.dropDown.setProperties(getModel(newProp, ['enableRtl']));\n }\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'content':\n if (!this.element.querySelector('span.e-caret')) {\n this.appendArrowSpan();\n }\n break;\n case 'disabled':\n if (newProp.disabled) {\n this.unWireEvents();\n if (this.isPopupCreated && !this.canOpen()) {\n this.closePopup();\n }\n }\n else {\n this.wireEvents();\n }\n break;\n case 'cssClass':\n if (newProp.cssClass.indexOf(classNames.VERTICAL) > -1 || oldProp.cssClass.indexOf(classNames.VERTICAL) > -1) {\n if (!this.element.querySelector('span.e-caret')) {\n this.appendArrowSpan();\n }\n var arrowSpan = this.element.querySelector('span.e-caret');\n newProp.cssClass.indexOf(classNames.VERTICAL) > -1 ? classList(arrowSpan, ['e-icon-bottom'], ['e-icon-right'])\n : classList(arrowSpan, ['e-icon-right'], ['e-icon-bottom']);\n }\n if (this.isPopupCreated) {\n if (oldProp.cssClass) {\n removeClass([popupElement], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([popupElement], newProp.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n }\n break;\n case 'target':\n this.dropDown.content = this.getTargetElement();\n this.dropDown.dataBind();\n break;\n case 'items':\n if (this.isPopupCreated && this.getULElement()) {\n this.createItems();\n }\n break;\n case 'createPopupOnClick':\n if (newProp.createPopupOnClick) {\n this.destroyPopup();\n }\n else {\n this.createPopup();\n }\n break;\n }\n }\n };\n /**\n * Sets the focus to DropDownButton\n * its native method\n *\n * @public\n * @returns {void}\n */\n DropDownButton.prototype.focusIn = function () {\n this.element.focus();\n };\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"content\", void 0);\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], DropDownButton.prototype, \"disabled\", void 0);\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"iconCss\", void 0);\n __decorate([\n Property('Left')\n ], DropDownButton.prototype, \"iconPosition\", void 0);\n __decorate([\n Property(true)\n ], DropDownButton.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Collection([], Item)\n ], DropDownButton.prototype, \"items\", void 0);\n __decorate([\n Property(false)\n ], DropDownButton.prototype, \"createPopupOnClick\", void 0);\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"target\", void 0);\n __decorate([\n Property('')\n ], DropDownButton.prototype, \"closeActionEvents\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"beforeItemRender\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"select\", void 0);\n __decorate([\n Event()\n ], DropDownButton.prototype, \"created\", void 0);\n DropDownButton = __decorate([\n NotifyPropertyChanges\n ], DropDownButton);\n return DropDownButton;\n}(Component));\nexport { DropDownButton };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// \nimport { Event, remove, addClass, removeClass, detach, getValue, setValue } from '@syncfusion/ej2-base';\nimport { EventHandler, Collection, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';\nimport { attributes, getUniqueID, getInstance, KeyboardEvents } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { getModel, Item } from './../common/common';\nimport { DropDownButton } from '../drop-down-button/drop-down-button';\nvar RTL = 'e-rtl';\nvar TAGNAME = 'EJS-SPLITBUTTON';\n/**\n * SplitButton component has primary and secondary button. Primary button is used to select\n * default action and secondary button is used to toggle contextual overlays for displaying list of\n * action items. It can contain both text and images.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar SplitButton = /** @class */ (function (_super) {\n __extends(SplitButton, _super);\n /**\n * Constructor for creating the widget\n *\n * @param {SplitButtonModel} options - Specifies the splitbutton model\n * @param {string|HTMLButtonElement} element - Specifies the element\n * @hidden\n */\n function SplitButton(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Initialize Angular support.\n *\n * @private\n * @returns {void}\n */\n SplitButton.prototype.preRender = function () {\n var ele = this.element;\n if (ele.tagName === TAGNAME) {\n var ejInstance = getValue('ej2_instances', ele);\n var btn = this.createElement('button', { attrs: { 'type': 'button' } });\n var wrapper = this.createElement(TAGNAME, { className: 'e-' + this.getModuleName() + '-wrapper' });\n for (var idx = 0, len = ele.attributes.length; idx < len; idx++) {\n btn.setAttribute(ele.attributes[idx].nodeName, ele.attributes[idx].nodeValue);\n }\n ele.parentNode.insertBefore(wrapper, ele);\n detach(ele);\n ele = btn;\n wrapper.appendChild(ele);\n setValue('ej2_instances', ejInstance, ele);\n this.wrapper = wrapper;\n this.element = ele;\n }\n if (!this.element.id) {\n this.element.id = getUniqueID('e-' + this.getModuleName());\n }\n };\n /**\n * Initialize the Component rendering.\n *\n * @returns {void}\n * @private\n */\n SplitButton.prototype.render = function () {\n this.initWrapper();\n this.createPrimaryButton();\n this.renderControl();\n };\n SplitButton.prototype.renderControl = function () {\n this.createSecondaryButton();\n this.setActiveElem([this.element, this.secondaryBtnObj.element]);\n this.setAria();\n this.wireEvents();\n this.renderComplete();\n };\n /**\n * Adds a new item to the menu. By default, new item appends to the list as the last item,\n * but you can insert based on the text parameter.\n *\n * @param { ItemModel[] } items - Specifies an array of JSON data.\n * @param { string } text - Specifies the text to insert the newly added item in the menu.\n * @returns {void}.\n */\n SplitButton.prototype.addItems = function (items, text) {\n _super.prototype.addItems.call(this, items, text);\n this.secondaryBtnObj.items = this.items;\n };\n /**\n * Removes the items from the menu.\n *\n * @param { string[] } items - Specifies an array of string to remove the items.\n * @param { string } isUniqueId - Set `true` if specified items is a collection of unique id.\n * @returns {void}.\n */\n SplitButton.prototype.removeItems = function (items, isUniqueId) {\n _super.prototype.removeItems.call(this, items, isUniqueId);\n this.secondaryBtnObj.items = this.items;\n };\n SplitButton.prototype.initWrapper = function () {\n if (!this.wrapper) {\n this.wrapper = this.createElement('div', { className: 'e-' + this.getModuleName() + '-wrapper' });\n this.element.parentNode.insertBefore(this.wrapper, this.element);\n }\n this.element.classList.remove('e-' + this.getModuleName());\n if (this.enableRtl) {\n this.wrapper.classList.add(RTL);\n }\n if (this.cssClass) {\n addClass([this.wrapper], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n };\n SplitButton.prototype.createPrimaryButton = function () {\n var btnModel = {\n cssClass: this.cssClass,\n enableRtl: this.enableRtl,\n iconCss: this.iconCss,\n iconPosition: this.iconPosition,\n content: this.content,\n disabled: this.disabled\n };\n this.primaryBtnObj = new Button(btnModel);\n this.primaryBtnObj.createElement = this.createElement;\n this.primaryBtnObj.appendTo(this.element);\n this.element.classList.add('e-' + this.getModuleName());\n this.element.type = 'button';\n this.wrapper.appendChild(this.element);\n };\n SplitButton.prototype.createSecondaryButton = function () {\n var _this = this;\n var btnElem = this.createElement('button', {\n className: 'e-icon-btn',\n attrs: { 'tabindex': '-1' },\n id: this.element.id + '_dropdownbtn'\n });\n this.wrapper.appendChild(btnElem);\n var dropDownBtnModel = {\n cssClass: this.cssClass,\n disabled: this.disabled,\n enableRtl: this.enableRtl,\n items: this.items,\n target: this.target,\n createPopupOnClick: this.createPopupOnClick\n };\n dropDownBtnModel.beforeItemRender = function (args) {\n if (_this.createPopupOnClick) {\n _this.secondaryBtnObj.dropDown.relateTo = _this.wrapper;\n _this.dropDown = _this.secondaryBtnObj.dropDown;\n }\n _this.trigger('beforeItemRender', args);\n };\n dropDownBtnModel.open = function (args) {\n _this.trigger('open', args);\n };\n dropDownBtnModel.close = function (args) {\n _this.trigger('close', args);\n };\n dropDownBtnModel.select = function (args) {\n _this.trigger('select', args);\n };\n dropDownBtnModel.beforeOpen = function (args) {\n if (_this.createPopupOnClick && _this.items.length == 0) {\n _this.secondaryBtnObj.dropDown.relateTo = _this.wrapper;\n _this.dropDown = _this.secondaryBtnObj.dropDown;\n }\n var callBackPromise = new Deferred();\n _this.trigger('beforeOpen', args, function (observedArgs) {\n callBackPromise.resolve(observedArgs);\n });\n return callBackPromise;\n };\n dropDownBtnModel.beforeClose = function (args) {\n var callBackPromise = new Deferred();\n _this.trigger('beforeClose', args, function (observedArgs) {\n callBackPromise.resolve(observedArgs);\n });\n return callBackPromise;\n };\n this.secondaryBtnObj = new DropDownButton(dropDownBtnModel);\n this.secondaryBtnObj.createElement = this.createElement;\n this.secondaryBtnObj.appendTo(btnElem);\n if (!this.createPopupOnClick) {\n this.secondaryBtnObj.dropDown.relateTo = this.wrapper;\n this.dropDown = this.secondaryBtnObj.dropDown;\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.isPopupCreated = this.secondaryBtnObj.isPopupCreated;\n this.secondaryBtnObj.activeElem = [this.element, this.secondaryBtnObj.element];\n this.secondaryBtnObj.element.querySelector('.e-btn-icon').classList.remove('e-icon-right');\n if (this.disabled) {\n this.wrapper.classList.add('e-splitbtn-disabled');\n }\n };\n SplitButton.prototype.setAria = function () {\n attributes(this.element, {\n 'aria-expanded': 'false', 'aria-haspopup': 'true',\n 'aria-label': this.element.textContent ? this.element.textContent + ' splitbutton' : 'splitbutton', 'aria-owns': this.element.id + '_dropdownbtn-popup'\n });\n };\n /**\n * Get component name.\n *\n * @returns {string} - Module Name\n * @private\n */\n SplitButton.prototype.getModuleName = function () {\n return 'split-btn';\n };\n /**\n * To open/close SplitButton popup based on current state of the SplitButton.\n *\n * @returns {void}\n */\n SplitButton.prototype.toggle = function () {\n this.secondaryBtnObj.toggle();\n };\n SplitButton.prototype.destroy = function () {\n var _this = this;\n var classList = [RTL];\n if (this.cssClass) {\n classList = classList.concat(this.cssClass.split(' '));\n }\n if (this.element) {\n var element = document.getElementById(this.element.id);\n if (element && element.parentElement === this.wrapper) {\n if (this.wrapper.tagName === TAGNAME) {\n this.wrapper.innerHTML = '';\n removeClass([this.wrapper], ['e-rtl', 'e-' + this.getModuleName() + '-wrapper']);\n removeClass([this.wrapper], this.cssClass.split(' '));\n }\n else {\n removeClass([this.element], classList);\n ['aria-label', 'aria-haspopup', 'aria-expanded', 'aria-owns', 'type'].forEach(function (key) {\n _this.element.removeAttribute(key);\n });\n this.wrapper.parentNode.insertBefore(this.element, this.wrapper);\n remove(this.wrapper);\n }\n this.unWireEvents();\n }\n }\n this.primaryBtnObj.destroy();\n this.secondaryBtnObj.destroy();\n _super.prototype.destroy.call(this);\n if (this.element && !this.element.getAttribute('class')) {\n this.element.removeAttribute('class');\n }\n if (this.refreshing && this.isAngular) {\n this.element = this.wrapper;\n ['e-control', 'e-split-btn', 'e-lib'].forEach(function (key) {\n _this.element.classList.add(key);\n });\n setValue('ej2_instances', [this], this.element);\n }\n this.wrapper = null;\n };\n SplitButton.prototype.wireEvents = function () {\n EventHandler.add(this.element, 'click', this.primaryBtnClickHandler, this);\n new KeyboardEvents(this.element, {\n keyAction: this.btnKeyBoardHandler.bind(this),\n keyConfigs: {\n altdownarrow: 'alt+downarrow',\n enter: 'enter'\n }\n });\n };\n SplitButton.prototype.unWireEvents = function () {\n EventHandler.remove(this.element, 'click', this.primaryBtnClickHandler);\n getInstance(this.element, KeyboardEvents).destroy();\n };\n SplitButton.prototype.primaryBtnClickHandler = function () {\n this.trigger('click', { element: this.element });\n };\n SplitButton.prototype.btnKeyBoardHandler = function (e) {\n switch (e.action) {\n case 'altdownarrow':\n this.clickHandler(e);\n break;\n case 'enter':\n this.clickHandler(e);\n if (this.getPopUpElement() && !this.getPopUpElement().classList.contains('e-popup-close')) {\n this.element.classList.remove('e-active');\n this.secondaryBtnObj.element.classList.add('e-active');\n }\n else {\n this.secondaryBtnObj.element.classList.remove('e-active');\n }\n break;\n }\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {SplitButtonModel} newProp - Specifies new properties\n * @param {SplitButtonModel} oldProp - Specifies old properties\n * @returns {void}\n */\n SplitButton.prototype.onPropertyChanged = function (newProp, oldProp) {\n var model = ['content', 'iconCss', 'iconPosition', 'cssClass', 'disabled', 'enableRtl'];\n this.primaryBtnObj.setProperties(getModel(newProp, model));\n model = ['beforeOpen', 'beforeItemRender', 'select', 'open',\n 'close', 'cssClass', 'disabled', 'enableRtl', 'createPopupOnClick'];\n if (Object.keys(newProp).indexOf('items') > -1) {\n this.secondaryBtnObj.items = newProp.items;\n this.secondaryBtnObj.dataBind();\n }\n this.secondaryBtnObj.setProperties(getModel(newProp, model));\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([this.wrapper], oldProp.cssClass.split(' '));\n }\n addClass([this.wrapper], newProp.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n break;\n case 'enableRtl':\n if (newProp.enableRtl) {\n addClass([this.wrapper], RTL);\n }\n else {\n removeClass([this.wrapper], RTL);\n }\n break;\n case 'disabled':\n if (newProp.disabled) {\n addClass([this.wrapper], 'e-splitbtn-disabled');\n }\n else {\n removeClass([this.wrapper], 'e-splitbtn-disabled');\n }\n }\n }\n };\n /**\n * Sets the focus to SplitButton\n * its native method\n *\n * @public\n * @returns {void}\n */\n SplitButton.prototype.focusIn = function () {\n this.element.focus();\n };\n __decorate([\n Property('')\n ], SplitButton.prototype, \"content\", void 0);\n __decorate([\n Property('')\n ], SplitButton.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], SplitButton.prototype, \"disabled\", void 0);\n __decorate([\n Property('')\n ], SplitButton.prototype, \"iconCss\", void 0);\n __decorate([\n Property('Left')\n ], SplitButton.prototype, \"iconPosition\", void 0);\n __decorate([\n Property(false)\n ], SplitButton.prototype, \"createPopupOnClick\", void 0);\n __decorate([\n Collection([], Item)\n ], SplitButton.prototype, \"items\", void 0);\n __decorate([\n Property('')\n ], SplitButton.prototype, \"target\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"beforeItemRender\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"click\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"select\", void 0);\n __decorate([\n Event()\n ], SplitButton.prototype, \"created\", void 0);\n SplitButton = __decorate([\n NotifyPropertyChanges\n ], SplitButton);\n return SplitButton;\n}(DropDownButton));\nexport { SplitButton };\n/**\n * Deferred is used to handle asynchronous operation.\n */\nvar Deferred = /** @class */ (function () {\n function Deferred() {\n var _this = this;\n /**\n * Promise is an object that represents a value that may not be available yet, but will be resolved at some point in the future.\n */\n this.promise = new Promise(function (resolve, reject) {\n _this.resolve = resolve;\n _this.reject = reject;\n });\n /**\n * Defines the callback function triggers when the Deferred object is rejected.\n */\n this.catch = this.promise.catch.bind(this.promise);\n /**\n * Defines the callback function triggers when the Deferred object is resolved.\n */\n this.then = this.promise.then.bind(this.promise);\n }\n return Deferred;\n}());\nexport { Deferred };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/* eslint-disable prefer-spread */\nimport { Component, Event, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';\nimport { Browser, closest, detach, EventHandler, getInstance, select, selectAll, formatUnit } from '@syncfusion/ej2-base';\nimport { addClass, attributes, classList, isNullOrUndefined, L10n } from '@syncfusion/ej2-base';\nimport { remove, removeClass, rippleEffect } from '@syncfusion/ej2-base';\nimport { SplitButton, getModel } from '@syncfusion/ej2-splitbuttons';\nimport { Deferred } from '@syncfusion/ej2-splitbuttons';\nimport { Tooltip, getZindexPartial, Popup, isCollide } from '@syncfusion/ej2-popups';\nimport { Input } from './../input/index';\nimport { NumericTextBox } from './../numerictextbox/index';\nimport { Slider } from './../slider/slider';\nvar APPLY = 'e-apply';\nvar CANCEL = 'e-cancel';\nvar CURRENT = 'e-current';\nvar CONTAINER = 'e-container';\nvar CTRLBTN = 'e-ctrl-btn';\nvar CTRLSWITCH = 'e-switch-ctrl-btn';\nvar DISABLED = 'e-disabled';\nvar FORMATSWITCH = 'e-value-switch-btn';\nvar HANDLER = 'e-handler';\nvar HEX = 'e-hex';\nvar HIDEHEX = 'e-hide-hex-value';\nvar HIDEOPACITY = 'e-hide-opacity';\nvar HIDERGBA = 'e-hide-switchable-value';\nvar HIDEVALUE = 'e-hide-value';\nvar HIDEVALUESWITCH = 'e-hide-valueswitcher';\nvar HSVAREA = 'e-hsv-color';\nvar HSVCONTAINER = 'e-hsv-container';\nvar INPUTWRAPPER = 'e-selected-value';\nvar MODESWITCH = 'e-mode-switch-btn';\nvar NOCOLOR = 'e-nocolor-item';\nvar OPACITY = 'e-opacity-value';\nvar PALETTES = 'e-palette';\nvar PALETTECONTENT = 'e-color-palette';\nvar PICKERCONTENT = 'e-color-picker';\nvar PREVIEW = 'e-preview-container';\nvar PREVIOUS = 'e-previous';\nvar RTL = 'e-rtl';\nvar SHOWVALUE = 'e-show-value';\nvar SELECT = 'e-selected';\nvar SPLITPREVIEW = 'e-split-preview';\nvar TILE = 'e-tile';\nvar presets = {\n default: ['#000000', '#f44336', '#e91e63', '#9c27b0', '#673ab7', '#2196f3', '#03a9f4', '#00bcd4', '#009688', '#ffeb3b',\n '#ffffff', '#ffebee', '#fce4ec', '#f3e5f5', '#ede7f6', '#e3f2fd', '#e1f5fe', '#e0f7fa', '#e0f2f1', '#fffde7',\n '#f2f2f2', '#ffcdd2', '#f8bbd0', '#e1bee7', '#d1c4e9', '#bbdefb', '#b3e5fc', '#b2ebf2', '#b2dfdb', '#fff9c4',\n '#e6e6e6', '#ef9a9a', '#f48fb1', '#ce93d8', '#b39ddb', '#90caf9', '#81d4fa', '#80deea', '#80cbc4', '#fff59d',\n '#cccccc', '#e57373', '#f06292', '#ba68c8', '#9575cd', '#64b5f6', '#4fc3f7', '#4dd0e1', '#4db6ac', '#fff176',\n '#b3b3b3', '#ef5350', '#ec407a', '#ab47bc', '#7e57c2', '#42a5f5', '#29b6f6', '#26c6da', '#26a69a', '#ffee58',\n '#999999', '#e53935', '#d81b60', '#8e24aa', '#5e35b1', '#1e88e5', '#039be5', '#00acc1', '#00897b', '#fdd835',\n '#808080', '#d32f2f', '#c2185b', '#7b1fa2', '#512da8', '#1976d2', '#0288d1', '#0097a7', '#00796b', '#fbc02d',\n '#666666', '#c62828', '#ad1457', '#6a1b9a', '#4527a0', '#1565c0', '#0277bd', '#00838f', '#00695c', '#f9a825',\n '#4d4d4d', '#b71c1c', '#880e4f', '#4a148c', '#311b92', '#0d47a1', '#01579b', '#006064', '#004d40', '#f57f17']\n};\n/**\n * ColorPicker component is a user interface to select and adjust color values. It provides supports for various\n * color specification like Red Green Blue, Hue Saturation Value and Hex codes.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar ColorPicker = /** @class */ (function (_super) {\n __extends(ColorPicker, _super);\n function ColorPicker(options, element) {\n return _super.call(this, options, element) || this;\n }\n ColorPicker.prototype.preRender = function () {\n var ele = this.element;\n this.formElement = closest(this.element, 'form');\n if (this.formElement) {\n EventHandler.add(this.formElement, 'reset', this.formResetHandler, this);\n }\n var localeText = { Apply: 'Apply', Cancel: 'Cancel', ModeSwitcher: 'Switch Mode' };\n this.l10n = new L10n('colorpicker', localeText, this.locale);\n if (ele.getAttribute('ejs-for') && !ele.getAttribute('name')) {\n ele.setAttribute('name', ele.id);\n }\n };\n /**\n * To Initialize the component rendering\n *\n * @private\n * @returns {void}\n */\n ColorPicker.prototype.render = function () {\n this.initWrapper();\n if (this.inline) {\n this.createWidget();\n }\n else {\n this.createSplitBtn();\n }\n if (!this.enableOpacity) {\n addClass([this.container.parentElement], HIDEOPACITY);\n }\n this.renderComplete();\n };\n ColorPicker.prototype.initWrapper = function () {\n var wrapper = this.createElement('div', { className: 'e-' + this.getModuleName() + '-wrapper' });\n this.element.parentNode.insertBefore(wrapper, this.element);\n wrapper.appendChild(this.element);\n attributes(this.element, { 'tabindex': '-1', 'spellcheck': 'false', 'aria-label': 'colorpicker' });\n this.container = this.createElement('div', { className: CONTAINER });\n this.getWrapper().appendChild(this.container);\n var value = this.value ? this.roundValue(this.value).toLowerCase() : '#008000ff';\n if (this.noColor && this.mode === 'Palette' && this.value === '') {\n value = '';\n }\n var slicedValue = value.slice(0, 7);\n if (isNullOrUndefined(this.initialInputValue)) {\n this.initialInputValue = slicedValue;\n }\n this.element.value = slicedValue;\n if (this.enableOpacity) {\n this.setProperties({ 'value': value }, true);\n }\n else {\n this.setProperties({ 'value': slicedValue }, true);\n }\n if (this.enableRtl) {\n wrapper.classList.add(RTL);\n }\n if (this.cssClass) {\n addClass([wrapper], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n this.tileRipple = rippleEffect(this.container, { selector: '.' + TILE });\n this.ctrlBtnRipple = rippleEffect(this.container, { selector: '.e-btn' });\n };\n ColorPicker.prototype.getWrapper = function () {\n return this.element.parentElement;\n };\n ColorPicker.prototype.createWidget = function () {\n if (this.mode === 'Palette') {\n this.createPalette();\n if (!this.inline) {\n this.firstPaletteFocus();\n }\n }\n else {\n this.createPicker();\n if (!this.inline) {\n this.getDragHandler().focus();\n }\n }\n this.isRgb = true;\n this.createInput();\n this.createCtrlBtn();\n if (!this.disabled) {\n this.wireEvents();\n }\n if (this.inline && this.disabled) {\n this.toggleDisabled(true);\n }\n if (Browser.isDevice) {\n this.refreshPopupPos();\n }\n };\n ColorPicker.prototype.createSplitBtn = function () {\n var _this = this;\n var splitButton = this.createElement('button', { className: 'e-split-colorpicker' });\n this.getWrapper().appendChild(splitButton);\n this.splitBtn = new SplitButton({\n iconCss: 'e-selected-color',\n target: this.container,\n disabled: this.disabled,\n enableRtl: this.enableRtl,\n createPopupOnClick: this.createPopupOnClick,\n open: this.onOpen.bind(this),\n click: function () {\n var ev = new MouseEvent('click', { bubbles: true, cancelable: false });\n _this.trigger('change', {\n currentValue: { hex: _this.value.slice(0, 7), rgba: _this.convertToRgbString(_this.hexToRgb(_this.value)) },\n previousValue: { hex: null, rgba: null }, value: _this.value, event: ev\n });\n }\n });\n this.splitBtn.createElement = this.createElement;\n this.splitBtn.appendTo(splitButton);\n var preview = this.createElement('span', { className: SPLITPREVIEW });\n select('.e-selected-color', splitButton).appendChild(preview);\n preview.style.backgroundColor = this.convertToRgbString(this.hexToRgb(this.value));\n var popupEle = this.getPopupEle();\n addClass([popupEle], 'e-colorpicker-popup');\n if (this.cssClass) {\n addClass([popupEle], this.cssClass.replace(/\\s+/g, ' ').trim().split(' '));\n }\n if (Browser.isDevice && !this.createPopupOnClick) {\n var popupInst = this.getPopupInst();\n popupInst.relateTo = document.body;\n popupInst.position = { X: 'center', Y: 'center' };\n popupInst.targetType = 'container';\n popupInst.collision = { X: 'fit', Y: 'fit' };\n popupInst.offsetY = 4;\n popupEle.style.zIndex = getZindexPartial(this.splitBtn.element).toString();\n }\n this.bindCallBackEvent();\n };\n ColorPicker.prototype.onOpen = function () {\n this.trigger('open', { element: this.container });\n if (!Browser.isDevice) {\n var popupInst = this.getPopupInst();\n var collision = isCollide(popupInst.element);\n if (collision.length > 0) {\n popupInst.collision = { X: 'flip', Y: 'fit' };\n popupInst.position = { X: 'right', Y: 'bottom' };\n popupInst.targetType = 'container';\n }\n }\n };\n ColorPicker.prototype.getPopupInst = function () {\n return getInstance(this.getPopupEle(), Popup);\n };\n ColorPicker.prototype.bindCallBackEvent = function () {\n var _this = this;\n this.splitBtn.beforeOpen = function (args) {\n var callBackPromise = new Deferred();\n _this.trigger('beforeOpen', args, function (observeOpenArgs) {\n if (!observeOpenArgs.cancel) {\n var popupEle = _this.getPopupEle();\n popupEle.style.top = formatUnit(0 + pageYOffset);\n popupEle.style.left = formatUnit(0 + pageXOffset);\n popupEle.style.display = 'block';\n _this.createWidget();\n popupEle.style.display = '';\n if (Browser.isDevice) {\n if (_this.createPopupOnClick) {\n var popupInst = _this.getPopupInst();\n popupInst.relateTo = document.body;\n popupInst.position = { X: 'center', Y: 'center' };\n popupInst.targetType = 'container';\n popupInst.collision = { X: 'fit', Y: 'fit' };\n popupInst.offsetY = 4;\n popupEle.style.zIndex = getZindexPartial(_this.splitBtn.element).toString();\n }\n _this.modal = _this.createElement('div');\n _this.modal.className = 'e-' + _this.getModuleName() + ' e-modal';\n _this.modal.style.display = 'none';\n document.body.insertBefore(_this.modal, popupEle);\n document.body.className += ' e-colorpicker-overflow';\n _this.modal.style.display = 'block';\n _this.modal.style.zIndex = (Number(popupEle.style.zIndex) - 1).toString();\n }\n }\n args.cancel = observeOpenArgs.cancel;\n callBackPromise.resolve(observeOpenArgs);\n });\n return callBackPromise;\n };\n this.splitBtn.beforeClose = function (args) {\n var callBackPromise = new Deferred();\n if (!isNullOrUndefined(args.event)) {\n var beforeCloseArgs = { element: _this.container, event: args.event, cancel: false };\n _this.trigger('beforeClose', beforeCloseArgs, function (observedCloseArgs) {\n if (Browser.isDevice && args.event.target === _this.modal) {\n observedCloseArgs.cancel = true;\n }\n if (!observedCloseArgs.cancel) {\n _this.onPopupClose();\n }\n args.cancel = observedCloseArgs.cancel;\n callBackPromise.resolve(observedCloseArgs);\n });\n }\n else {\n callBackPromise.resolve(args);\n }\n return callBackPromise;\n };\n };\n ColorPicker.prototype.onPopupClose = function () {\n this.unWireEvents();\n this.destroyOtherComp();\n this.container.style.width = '';\n select('.' + SPLITPREVIEW, this.splitBtn.element).style.backgroundColor\n = this.convertToRgbString(this.hexToRgb(this.value));\n this.container.innerHTML = '';\n removeClass([this.container], [PICKERCONTENT, PALETTECONTENT]);\n if (Browser.isDevice && this.modal) {\n removeClass([document.body], 'e-colorpicker-overflow');\n this.modal.style.display = 'none';\n this.modal.outerHTML = '';\n this.modal = null;\n }\n };\n ColorPicker.prototype.createPalette = function () {\n classList(this.container, [PALETTECONTENT], [PICKERCONTENT]);\n if (this.presetColors) {\n var paletteGroup = this.createElement('div', { className: 'e-custom-palette' });\n this.appendElement(paletteGroup);\n var keys = Object.keys(this.presetColors);\n if (keys.length === 1) {\n this.appendPalette(this.presetColors[keys[0]], keys[0], paletteGroup);\n }\n else {\n for (var i = 0, len = keys.length; i < len; i++) {\n this.appendPalette(this.presetColors[keys[i]], keys[i], paletteGroup);\n }\n }\n if (selectAll('.e-row', paletteGroup).length > 10) {\n addClass([paletteGroup], 'e-palette-group');\n }\n }\n else {\n this.appendPalette(presets.default, 'default');\n }\n if (this.mode === 'Palette' && !this.modeSwitcher && this.noColor) {\n this.setNoColor();\n }\n var width = parseInt(getComputedStyle(this.container).borderBottomWidth, 10);\n this.container.style.width = formatUnit(this.container.children[0].offsetWidth + width + width);\n this.rgb = this.hexToRgb(this.roundValue(this.value));\n this.hsv = this.rgbToHsv.apply(this, this.rgb);\n };\n ColorPicker.prototype.firstPaletteFocus = function () {\n if (!select('.' + SELECT, this.container.children[0])) {\n selectAll('.' + PALETTES, this.container)[0].focus();\n }\n };\n ColorPicker.prototype.appendPalette = function (colors, key, refEle) {\n var palette = this.createElement('div', { className: PALETTES, attrs: { 'tabindex': '0', 'role': 'grid' } });\n if (refEle) {\n refEle.appendChild(palette);\n }\n else {\n this.appendElement(palette);\n }\n var row;\n var tile;\n var roundedColor;\n for (var i = 0, len = colors.length; i < len; i++) {\n if (i === 0 || i % this.columns === 0) {\n row = this.createElement('div', {\n className: 'e-row', attrs: { 'role': 'row' }\n });\n palette.appendChild(row);\n }\n roundedColor = this.roundValue(colors[i]).toLowerCase();\n tile = this.createElement('span', {\n className: TILE, attrs: { 'role': 'gridcell', 'aria-label': roundedColor, 'aria-selected': 'false', 'tabindex': '0' }\n });\n this.trigger('beforeTileRender', { element: tile, presetName: key, value: colors[i] });\n row.appendChild(tile);\n if (this.value === roundedColor) {\n this.addTileSelection(tile);\n palette.focus();\n }\n tile.style.backgroundColor = this.convertToRgbString(this.hexToRgb(roundedColor));\n }\n };\n ColorPicker.prototype.setNoColor = function () {\n var noColorEle = this.container.querySelector('.e-row').children[0];\n noColorEle.classList.add(NOCOLOR);\n if (!this.value) {\n noColorEle.classList.add(SELECT);\n closest(noColorEle, '.' + PALETTES).focus();\n }\n ['aria-selected', 'aria-label'].forEach(function (attr) { noColorEle.removeAttribute(attr); });\n noColorEle.style.backgroundColor = '';\n };\n ColorPicker.prototype.appendElement = function (ele, insertPos) {\n if (insertPos === void 0) { insertPos = 0; }\n var refEle = this.container.children[insertPos];\n if (refEle) {\n this.container.insertBefore(ele, refEle);\n }\n else {\n this.container.appendChild(ele);\n }\n };\n ColorPicker.prototype.addTileSelection = function (ele) {\n ele.classList.add(SELECT);\n ele.setAttribute('aria-selected', 'true');\n };\n ColorPicker.prototype.createPicker = function () {\n classList(this.container, [PICKERCONTENT], [PALETTECONTENT]);\n var hsvContainer = this.createElement('div', { className: HSVCONTAINER });\n this.appendElement(hsvContainer);\n hsvContainer.appendChild(this.createElement('div', { className: HSVAREA }));\n var dragHandler = this.createElement('span', { className: HANDLER, attrs: { 'tabindex': '0' } });\n hsvContainer.appendChild(dragHandler);\n if (this.value === null || this.value === '') {\n this.value = '#008000ff';\n }\n this.rgb = this.hexToRgb(this.value);\n this.hsv = this.rgbToHsv.apply(this, this.rgb);\n this.setHsvContainerBg();\n this.setHandlerPosition();\n this.createSlider();\n this.createDragTooltip();\n };\n ColorPicker.prototype.setHsvContainerBg = function (h) {\n if (h === void 0) { h = this.hsv[0]; }\n this.getHsvContainer().style.backgroundColor = this.convertToRgbString(this.hsvToRgb(h, 100, 100, 1));\n };\n ColorPicker.prototype.getHsvContainer = function () {\n return select('.' + HSVCONTAINER, this.container);\n };\n ColorPicker.prototype.setHandlerPosition = function () {\n var dragHandler = this.getDragHandler();\n var hsvArea = select('.' + HSVAREA, this.container);\n if (this.enableRtl) {\n dragHandler.style.left = formatUnit(hsvArea.offsetWidth * Math.abs(100 - this.hsv[1]) / 100);\n }\n else {\n dragHandler.style.left = formatUnit(hsvArea.offsetWidth * this.hsv[1] / 100);\n }\n dragHandler.style.top = formatUnit(hsvArea.offsetHeight * (100 - this.hsv[2]) / 100);\n };\n ColorPicker.prototype.createSlider = function () {\n var sliderPreviewWrapper = this.createElement('div', { className: 'e-slider-preview' });\n this.appendElement(sliderPreviewWrapper, 1);\n this.createPreview(sliderPreviewWrapper);\n var sliderWrapper = this.createElement('div', { className: 'e-colorpicker-slider' });\n sliderPreviewWrapper.insertBefore(sliderWrapper, sliderPreviewWrapper.children[0]);\n var slider = this.createElement('div', { className: 'e-hue-slider' });\n sliderWrapper.appendChild(slider);\n this.hueSlider = new Slider({\n value: this.hsv[0],\n min: 0,\n max: 359,\n enableRtl: this.enableRtl,\n enabled: !this.disabled,\n change: this.hueChange.bind(this)\n });\n this.hueSlider.createElement = this.createElement;\n this.hueSlider.appendTo(slider);\n if (this.enableOpacity) {\n slider = this.createElement('div', { className: 'e-opacity-slider' });\n sliderWrapper.appendChild(slider);\n this.createOpacitySlider(slider);\n }\n };\n ColorPicker.prototype.createOpacitySlider = function (slider) {\n this.opacitySlider = new Slider({\n value: this.rgb[3] * 100,\n min: 0,\n max: 100,\n enableRtl: this.enableRtl,\n enabled: !this.disabled,\n change: this.opacityChange.bind(this)\n });\n this.opacitySlider.createElement = this.createElement;\n this.opacitySlider.appendTo(slider);\n var opacityBgTrack = this.createElement('div', { className: 'e-opacity-empty-track' });\n slider.appendChild(opacityBgTrack);\n this.updateOpacitySliderBg();\n };\n ColorPicker.prototype.updateOpacitySliderBg = function () {\n var direction = this.enableRtl ? 'to left' : 'to right';\n var opacityEle = select('.e-opacity-empty-track', this.opacitySlider.element);\n if (opacityEle) {\n opacityEle.style.background =\n 'linear-gradient(' + direction + ', rgba(' + this.rgb.slice(0, 3) + ', 0) 0%, ' +\n this.convertToRgbString(this.rgb.slice(0, 3)) + ' 100%)';\n }\n };\n ColorPicker.prototype.hueChange = function (args) {\n this.hsv[0] = args.value;\n this.setHsvContainerBg();\n this.convertToOtherFormat();\n };\n ColorPicker.prototype.opacityChange = function (args) {\n var value = args.value;\n var pValue = this.rgbToHex(this.rgb);\n this.hsv[3] = value / 100;\n this.rgb[3] = value / 100;\n var cValue = this.rgbToHex(this.rgb);\n this.updateOpacityInput(value);\n var rgb = this.convertToRgbString(this.rgb);\n this.updatePreview(rgb);\n this.triggerEvent(cValue, pValue, rgb);\n };\n ColorPicker.prototype.updateOpacityInput = function (value) {\n if (this.enableOpacity && !this.getWrapper().classList.contains(HIDEVALUE)) {\n var opacityTextBoxInst = getInstance(select('.' + OPACITY, this.container), NumericTextBox);\n opacityTextBoxInst.value = value;\n opacityTextBoxInst.dataBind();\n }\n };\n ColorPicker.prototype.createPreview = function (parentEle) {\n var previewContainer = this.createElement('div', { className: PREVIEW });\n parentEle.appendChild(previewContainer);\n var preview = this.createElement('span', { className: 'e-preview ' + CURRENT });\n previewContainer.appendChild(preview);\n var colorValue = this.convertToRgbString(this.rgb);\n preview.style.backgroundColor = colorValue;\n preview = this.createElement('span', { className: 'e-preview ' + PREVIOUS });\n previewContainer.appendChild(preview);\n preview.style.backgroundColor = colorValue;\n };\n ColorPicker.prototype.isPicker = function () {\n return !this.container.classList.contains(PALETTECONTENT);\n };\n ColorPicker.prototype.getPopupEle = function () {\n return this.container.parentElement;\n };\n ColorPicker.prototype.createNumericInput = function (element, value, label, max) {\n var _this = this;\n var numericInput = new NumericTextBox({\n value: value,\n placeholder: label,\n min: 0,\n max: max,\n format: '###.##',\n showSpinButton: false,\n floatLabelType: 'Always',\n enableRtl: this.enableRtl,\n enabled: !this.disabled,\n readonly: this.isPicker() ? false : true,\n change: function (args) {\n if (args.event) {\n _this.inputHandler(args.event);\n }\n }\n });\n numericInput.createElement = this.createElement;\n numericInput.appendTo(element);\n };\n ColorPicker.prototype.createInput = function () {\n var isPicker = this.isPicker();\n var wrapper = this.getWrapper();\n if ((isPicker && !wrapper.classList.contains(HIDEVALUE)) || (!isPicker && wrapper.classList.contains(SHOWVALUE))) {\n var inputWrap = this.createElement('div', { className: INPUTWRAPPER });\n if (isPicker) {\n this.appendElement(inputWrap, 2);\n }\n else {\n this.appendElement(inputWrap, 1);\n }\n var container = this.createElement('div', { className: 'e-input-container' });\n inputWrap.appendChild(container);\n if (!wrapper.classList.contains(HIDEVALUESWITCH)) {\n this.appendValueSwitchBtn(inputWrap);\n }\n if (!wrapper.classList.contains(HIDEHEX)) {\n var hexInput = this.createElement('input', {\n className: HEX,\n attrs: { 'maxlength': '7', 'spellcheck': 'false', 'aria-label': 'HEX' }\n });\n container.appendChild(hexInput);\n Input.createInput({\n element: hexInput,\n floatLabelType: 'Always',\n properties: {\n placeholder: 'HEX',\n enableRtl: this.enableRtl,\n enabled: !this.disabled,\n readonly: this.isPicker() ? false : true\n }\n }, this.createElement);\n Input.setValue(this.value.slice(0, 7), hexInput);\n hexInput.addEventListener('input', this.inputHandler.bind(this));\n }\n if (!wrapper.classList.contains(HIDERGBA)) {\n var label = void 0;\n var value = void 0;\n if (this.isRgb) {\n label = 'RGB';\n value = this.rgb;\n }\n else {\n label = 'HSV';\n value = this.hsv;\n }\n var clsName = ['rh', 'gs', 'bv'];\n for (var i = 0; i < 3; i++) {\n this.createNumericInput(container.appendChild(this.createElement('input', { className: 'e-' + clsName[i] + '-value' })), value[i], label[i], 255);\n }\n if (this.enableOpacity) {\n this.appendOpacityValue(container);\n }\n }\n }\n };\n ColorPicker.prototype.appendOpacityValue = function (container) {\n this.createNumericInput(container.appendChild(this.createElement('input', { className: OPACITY })), this.rgb[3] * 100, 'A', 100);\n };\n ColorPicker.prototype.appendValueSwitchBtn = function (targetEle) {\n var valueSwitchBtn = this.createElement('button', {\n className: 'e-icons e-css e-btn e-flat e-icon-btn ' + FORMATSWITCH,\n attrs: { 'title': 'Toggle format' }\n });\n targetEle.appendChild(valueSwitchBtn);\n if (this.isPicker() && !this.getWrapper().classList.contains(HIDERGBA)) {\n valueSwitchBtn.addEventListener('click', this.formatSwitchHandler.bind(this));\n }\n };\n ColorPicker.prototype.createCtrlBtn = function () {\n if (this.modeSwitcher || this.showButtons) {\n this.l10n.setLocale(this.locale);\n var btnWrapper = this.createElement('div', { className: CTRLSWITCH });\n this.container.appendChild(btnWrapper);\n if (this.showButtons) {\n var controlBtnWrapper = this.createElement('div', { className: CTRLBTN });\n btnWrapper.appendChild(controlBtnWrapper);\n var apply = this.l10n.getConstant('Apply');\n controlBtnWrapper.appendChild(this.createElement('button', {\n innerHTML: apply,\n className: 'e-btn e-css e-flat e-primary e-small ' + APPLY,\n attrs: { 'title': apply }\n }));\n var cancel = this.l10n.getConstant('Cancel');\n controlBtnWrapper.appendChild(this.createElement('button', {\n innerHTML: cancel,\n className: 'e-btn e-css e-flat e-small ' + CANCEL,\n attrs: { 'title': cancel }\n }));\n }\n if (this.modeSwitcher) {\n this.appendModeSwitchBtn();\n }\n }\n };\n ColorPicker.prototype.appendModeSwitchBtn = function () {\n var modeSwitcher = this.createElement('button', {\n className: 'e-icons e-btn e-flat e-icon-btn ' + MODESWITCH, attrs: { title: this.l10n.getConstant('ModeSwitcher') }\n });\n select('.' + CTRLSWITCH, this.container).insertBefore(modeSwitcher, select('.' + CTRLBTN, this.container));\n };\n ColorPicker.prototype.createDragTooltip = function () {\n var _this = this;\n var tooltip = new Tooltip({\n opensOn: 'Custom',\n showTipPointer: false,\n cssClass: 'e-color-picker-tooltip',\n htmlAttributes: { title: 'tooltip' },\n beforeOpen: function (args) {\n _this.tooltipEle = args.element;\n },\n animation: { open: { effect: 'None' }, close: { effect: 'None' } }\n });\n tooltip.createElement = this.createElement;\n tooltip.appendTo(this.container);\n tooltip.open(this.container);\n this.tooltipEle.style.zIndex = getZindexPartial(this.tooltipEle).toString();\n this.tooltipEle.setAttribute('aria-label', 'colorpicker-tooltip');\n select('.e-tip-content', this.tooltipEle).appendChild(this.createElement('div', { className: 'e-tip-transparent' }));\n };\n ColorPicker.prototype.getTooltipInst = function () {\n return getInstance(this.container, Tooltip);\n };\n ColorPicker.prototype.setTooltipOffset = function (value) {\n this.getTooltipInst().offsetY = value;\n };\n ColorPicker.prototype.toggleDisabled = function (enable) {\n if (enable) {\n this.getWrapper().classList.add(DISABLED);\n }\n else {\n this.getWrapper().classList.remove(DISABLED);\n }\n if (this.showButtons) {\n ([].slice.call(selectAll('.e-btn', this.container))).forEach(function (ele) {\n if (enable) {\n attributes(ele, { 'disabled': '' });\n }\n else {\n ele.removeAttribute('disabled');\n }\n });\n }\n };\n ColorPicker.prototype.convertToRgbString = function (rgb) {\n return rgb.length ? rgb.length === 4 ? 'rgba(' + rgb.join() + ')' : 'rgb(' + rgb.join() + ')' : '';\n };\n ColorPicker.prototype.convertToHsvString = function (hsv) {\n return hsv.length === 4 ? 'hsva(' + hsv.join() + ')' : 'hsv(' + hsv.join() + ')';\n };\n ColorPicker.prototype.updateHsv = function () {\n this.hsv[1] = this.hsv[1] > 100 ? 100 : this.hsv[1];\n this.hsv[2] = this.hsv[2] > 100 ? 100 : this.hsv[2];\n this.setHandlerPosition();\n };\n ColorPicker.prototype.convertToOtherFormat = function (isKey, e) {\n if (isKey === void 0) { isKey = false; }\n var pValue = this.rgbToHex(this.rgb);\n this.rgb = this.hsvToRgb.apply(this, this.hsv);\n var cValue = this.rgbToHex(this.rgb);\n var rgba = this.convertToRgbString(this.rgb);\n this.updatePreview(rgba);\n this.updateInput(cValue);\n this.triggerEvent(cValue, pValue, rgba, isKey, e);\n };\n ColorPicker.prototype.updateInput = function (value) {\n var wrapper = this.getWrapper();\n if (!wrapper.classList.contains(HIDEVALUE)) {\n if (!wrapper.classList.contains(HIDEHEX)) {\n Input.setValue(value.substr(0, 7), select('.' + HEX, this.container));\n }\n if (!wrapper.classList.contains(HIDERGBA)) {\n if (this.isRgb) {\n this.updateValue(this.rgb, false);\n }\n else {\n this.updateValue(this.hsv, false);\n }\n }\n }\n };\n ColorPicker.prototype.updatePreview = function (value) {\n if (this.enableOpacity) {\n this.updateOpacitySliderBg();\n }\n select('.e-tip-transparent', this.tooltipEle).style.backgroundColor = value;\n select('.' + PREVIEW + ' .' + CURRENT, this.container).style.backgroundColor = value;\n select('.' + PREVIEW + ' .' + PREVIOUS, this.container).style.backgroundColor\n = this.convertToRgbString(this.hexToRgb(this.value));\n };\n ColorPicker.prototype.getDragHandler = function () {\n return select('.' + HANDLER, this.container);\n };\n ColorPicker.prototype.removeTileSelection = function () {\n var selectedEle = [].slice.call(selectAll('.' + SELECT, this.container.children[0]));\n selectedEle.forEach(function (ele) {\n ele.classList.remove(SELECT);\n ele.setAttribute('aria-selected', 'false');\n });\n };\n ColorPicker.prototype.convertRgbToNumberArray = function (value) {\n return (value.slice(value.indexOf('(') + 1, value.indexOf(')'))).split(',').map(function (n, i) {\n return (i !== 3) ? parseInt(n, 10) : parseFloat(n);\n });\n };\n /**\n * To get color value in specified type.\n *\n * @param {string} value - Specify the color value.\n * @param {string} type - Specify the type to which the specified color needs to be converted.\n * @method getValue\n * @returns {string} - Color value\n */\n ColorPicker.prototype.getValue = function (value, type) {\n if (!value) {\n value = this.value;\n }\n type = !type ? 'hex' : type.toLowerCase();\n if (value[0] === 'r') {\n var cValue = this.convertRgbToNumberArray(value);\n if (type === 'hex' || type === 'hexa') {\n var hex = this.rgbToHex(cValue);\n return type === 'hex' ? hex.slice(0, 7) : hex;\n }\n else {\n if (type === 'hsv') {\n return this.convertToHsvString(this.rgbToHsv.apply(this, cValue.slice(0, 3)));\n }\n else {\n if (type === 'hsva') {\n return this.convertToHsvString(this.rgbToHsv.apply(this, cValue));\n }\n else {\n return 'null';\n }\n }\n }\n }\n else {\n if (value[0] === 'h') {\n var cValue = this.hsvToRgb.apply(this, this.convertRgbToNumberArray(value));\n if (type === 'rgba') {\n return this.convertToRgbString(cValue);\n }\n else {\n if (type === 'hex' || type === 'hexa') {\n var hex = this.rgbToHex(cValue);\n return type === 'hex' ? hex.slice(0, 7) : hex;\n }\n else {\n if (type === 'rgb') {\n return this.convertToRgbString(cValue.slice(0, 3));\n }\n else {\n return 'null';\n }\n }\n }\n }\n else {\n value = this.roundValue(value);\n var rgb = this.hexToRgb(value);\n if (type === 'rgb' || type === 'hsv') {\n rgb = rgb.slice(0, 3);\n }\n if (type === 'rgba' || type === 'rgb') {\n return this.convertToRgbString(rgb);\n }\n else {\n if (type === 'hsva' || type === 'hsv') {\n return this.convertToHsvString(this.rgbToHsv.apply(this, rgb));\n }\n else {\n if (type === 'hex') {\n return value.slice(0, 7);\n }\n else {\n if (type === 'a') {\n return rgb[3].toString();\n }\n else {\n return 'null';\n }\n }\n }\n }\n }\n }\n };\n /**\n * To show/hide ColorPicker popup based on current state of the SplitButton.\n *\n * @method toggle\n * @returns {void}\n */\n ColorPicker.prototype.toggle = function () {\n if (this.container.parentElement.classList.contains('e-popup-close')) {\n this.splitBtn.toggle();\n }\n else {\n this.closePopup(null);\n }\n };\n /**\n * Get component name.\n *\n * @returns {string} - Module Name\n * @private\n */\n ColorPicker.prototype.getModuleName = function () {\n return 'colorpicker';\n };\n /**\n * Gets the properties to be maintained in the persisted state.\n *\n * @returns {string} - Persist data\n */\n ColorPicker.prototype.getPersistData = function () {\n return this.addOnPersist(['value']);\n };\n ColorPicker.prototype.wireEvents = function () {\n if (this.isPicker()) {\n var dragHandler = this.getDragHandler();\n EventHandler.add(dragHandler, 'keydown', this.pickerKeyDown, this);\n var ctrlBtn = select('.' + CTRLBTN, this.container);\n if (ctrlBtn) {\n EventHandler.add(ctrlBtn, 'keydown', this.ctrlBtnKeyDown, this);\n }\n EventHandler.add(this.getHsvContainer(), 'mousedown touchstart', this.handlerDown, this);\n if (this.modeSwitcher || this.showButtons) {\n this.addCtrlSwitchEvent();\n }\n EventHandler.add(select('.' + PREVIOUS, this.container), 'click', this.previewHandler, this);\n }\n else {\n EventHandler.add(this.container, 'click', this.paletteClickHandler, this);\n EventHandler.add(this.container, 'keydown', this.paletteKeyDown, this);\n }\n };\n ColorPicker.prototype.formResetHandler = function () {\n this.value = this.initialInputValue;\n attributes(this.element, { 'value': this.initialInputValue });\n };\n ColorPicker.prototype.addCtrlSwitchEvent = function () {\n var ctrlSwitchBtn = select('.' + CTRLSWITCH, this.container);\n if (ctrlSwitchBtn) {\n EventHandler.add(ctrlSwitchBtn, 'click', this.btnClickHandler, this);\n }\n };\n ColorPicker.prototype.ctrlBtnKeyDown = function (e) {\n if (e.keyCode === 13) {\n var applyBtn = select('.' + APPLY, this.container);\n if (applyBtn) {\n var cValue = this.rgbToHex(this.rgb);\n this.triggerChangeEvent(cValue);\n }\n this.splitBtn.element.focus();\n }\n };\n ColorPicker.prototype.pickerKeyDown = function (e) {\n switch (e.keyCode) {\n case 39:\n this.handlerDragPosition(1, this.enableRtl ? -1 : 1, e);\n break;\n case 37:\n this.handlerDragPosition(1, this.enableRtl ? 1 : -1, e);\n break;\n case 38:\n this.handlerDragPosition(2, 1, e);\n break;\n case 40:\n this.handlerDragPosition(2, -1, e);\n break;\n case 13: {\n e.preventDefault();\n var cValue = this.rgbToHex(this.rgb);\n this.enterKeyHandler(cValue, e);\n }\n }\n };\n ColorPicker.prototype.enterKeyHandler = function (value, e) {\n this.triggerChangeEvent(value);\n if (!this.inline) {\n this.splitBtn.element.focus();\n }\n };\n ColorPicker.prototype.closePopup = function (e) {\n var _this = this;\n var beforeCloseArgs = { element: this.container, event: e, cancel: false };\n this.trigger('beforeClose', beforeCloseArgs, function (observedcloseArgs) {\n if (!observedcloseArgs.cancel) {\n _this.splitBtn.toggle();\n _this.onPopupClose();\n }\n });\n };\n ColorPicker.prototype.triggerChangeEvent = function (value, e) {\n var hex = value.slice(0, 7);\n this.trigger('change', {\n currentValue: { hex: hex, rgba: this.convertToRgbString(this.rgb) }, event: e,\n previousValue: { hex: this.value.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(this.value)) },\n value: this.enableOpacity ? value : hex\n });\n if (this.enableOpacity) {\n this.setProperties({ 'value': value }, true);\n }\n else {\n this.setProperties({ 'value': hex }, true);\n }\n this.element.value = hex ? hex : '#000000';\n };\n ColorPicker.prototype.handlerDragPosition = function (prob, value, e) {\n e.preventDefault();\n this.hsv[prob] += value * (e.ctrlKey ? 1 : 3);\n if (this.hsv[prob] < 0) {\n this.hsv[prob] = 0;\n }\n this.updateHsv();\n this.convertToOtherFormat(true, e);\n };\n ColorPicker.prototype.handlerDown = function (e) {\n e.preventDefault();\n if (e.type === 'mousedown') {\n this.clientX = Math.abs(e.pageX - pageXOffset);\n this.clientY = Math.abs(e.pageY - pageYOffset);\n this.setTooltipOffset(8);\n }\n else {\n this.clientX = Math.abs(e.changedTouches[0].pageX - pageXOffset);\n this.clientY = Math.abs(e.changedTouches[0].pageY - pageYOffset);\n this.setTooltipOffset(-8);\n }\n this.setHsv(this.clientX, this.clientY);\n this.getDragHandler().style.transition = 'left .4s cubic-bezier(.25, .8, .25, 1), top .4s cubic-bezier(.25, .8, .25, 1)';\n this.updateHsv();\n this.convertToOtherFormat(false, e);\n this.getDragHandler().focus();\n EventHandler.add(document, 'mousemove touchmove', this.handlerMove, this);\n EventHandler.add(document, 'mouseup touchend', this.handlerEnd, this);\n };\n ColorPicker.prototype.handlerMove = function (e) {\n if (e.type !== 'touchmove') {\n e.preventDefault();\n }\n var x;\n var y;\n if (e.type === 'mousemove') {\n x = Math.abs(e.pageX - pageXOffset);\n y = Math.abs(e.pageY - pageYOffset);\n }\n else {\n x = Math.abs(e.changedTouches[0].pageX - pageXOffset);\n y = Math.abs(e.changedTouches[0].pageY - pageYOffset);\n }\n this.setHsv(x, y);\n var dragHandler = this.getDragHandler();\n this.updateHsv();\n this.convertToOtherFormat(false, e);\n this.getTooltipInst().refresh(dragHandler);\n if (!this.tooltipEle.style.transform) {\n if (Math.abs(this.clientX - x) > 8 || Math.abs(this.clientY - y) > 8) {\n select('.' + HSVAREA, this.container).style.cursor = 'pointer';\n dragHandler.style.transition = 'none';\n if (!this.inline) {\n this.tooltipEle.style.zIndex = (parseInt(this.getPopupEle().style.zIndex, 10) + 1).toString();\n }\n this.tooltipEle.style.transform = 'rotate(45deg)';\n dragHandler.classList.add('e-hide-handler');\n }\n }\n };\n ColorPicker.prototype.setHsv = function (clientX, clientY) {\n var ele = select('.' + HSVAREA, this.container);\n var position = ele.getBoundingClientRect();\n if (this.enableRtl) {\n clientX = clientX > position.right ? 0 : Math.abs(clientX - position.right);\n }\n else {\n clientX = clientX > position.left ? Math.abs(clientX - position.left) : 0;\n }\n clientY = clientY > position.top ? Math.abs(clientY - position.top) : 0;\n this.hsv[2] = Math.round(Number(100 * (ele.offsetHeight -\n Math.max(0, Math.min(ele.offsetHeight, (clientY - ele.offsetTop)))) / ele.offsetHeight) * 10) / 10;\n this.hsv[1] =\n Math.round(Number(100 * (Math.max(0, Math.min(ele.offsetWidth, (clientX - ele.offsetLeft)))) / ele.offsetWidth) * 10) / 10;\n };\n ColorPicker.prototype.handlerEnd = function (e) {\n if (e.type !== 'touchend') {\n e.preventDefault();\n }\n EventHandler.remove(document, 'mousemove touchmove', this.handlerMove);\n EventHandler.remove(document, 'mouseup touchend', this.handlerEnd);\n var dragHandler = this.getDragHandler();\n select('.' + HSVAREA, this.container).style.cursor = '';\n if (this.tooltipEle.style.transform) {\n this.tooltipEle.style.transform = '';\n dragHandler.classList.remove('e-hide-handler');\n }\n if (!this.inline && !this.showButtons) {\n this.closePopup(e);\n }\n };\n ColorPicker.prototype.btnClickHandler = function (e) {\n var target = e.target;\n if (closest(target, '.' + MODESWITCH)) {\n e.stopPropagation();\n this.switchToPalette();\n }\n else {\n if (target.classList.contains(APPLY) || target.classList.contains(CANCEL)) {\n this.ctrlBtnClick(target, e);\n }\n }\n };\n ColorPicker.prototype.switchToPalette = function () {\n this.trigger('beforeModeSwitch', { element: this.container, mode: 'Palette' });\n this.unWireEvents();\n this.destroyOtherComp();\n detach(select('.e-slider-preview', this.container));\n if (!this.getWrapper().classList.contains(HIDEVALUE)) {\n remove(select('.' + INPUTWRAPPER, this.container));\n }\n detach(this.getHsvContainer());\n this.createPalette();\n this.firstPaletteFocus();\n this.createInput();\n this.refreshPopupPos();\n //for image editor popup position refreshing\n if (this.element.parentElement && this.element.parentElement.parentElement && this.element.parentElement.parentElement.classList.contains('e-ie-ddb-popup')) {\n this.refreshImageEditorPopupPos();\n }\n ;\n this.wireEvents();\n this.trigger('onModeSwitch', { element: this.container, mode: 'Palette' });\n };\n //for image editor popup position refreshing\n ColorPicker.prototype.refreshImageEditorPopupPos = function () {\n if (Browser.isDevice) {\n var popupEle = this.getPopupEle();\n popupEle.style.left = formatUnit(0 + pageXOffset);\n popupEle.style.top = formatUnit(0 + pageYOffset);\n var btnElem = document.querySelector(\"#\" + this.element.parentElement.parentElement.id.split('-popup')[0]);\n if (btnElem) {\n popupEle.parentElement.ej2_instances[0].refreshPosition(btnElem);\n }\n }\n };\n ColorPicker.prototype.refreshPopupPos = function () {\n if (!this.inline) {\n var popupEle = this.getPopupEle();\n popupEle.style.left = formatUnit(0 + pageXOffset);\n popupEle.style.top = formatUnit(0 + pageYOffset);\n this.getPopupInst().refreshPosition(this.splitBtn.element.parentElement);\n }\n };\n ColorPicker.prototype.formatSwitchHandler = function () {\n if (this.isRgb) {\n this.updateValue(this.hsv, true, 3, [360, 100, 100]);\n this.isRgb = false;\n }\n else {\n this.updateValue(this.rgb, true, 2);\n this.isRgb = true;\n }\n };\n ColorPicker.prototype.updateValue = function (value, format, idx, max) {\n var clsName = ['e-rh-value', 'e-gs-value', 'e-bv-value'];\n var inst;\n for (var i = 0, len = clsName.length; i < len; i++) {\n inst = getInstance(select('.' + clsName[i], this.container), NumericTextBox);\n inst.value = Math.round(value[i]);\n if (format) {\n inst.placeholder = clsName[i].substr(idx, 1).toUpperCase();\n inst.max = max ? max[i] : 255;\n }\n inst.dataBind();\n }\n };\n ColorPicker.prototype.previewHandler = function (e) {\n var target = e.target;\n var pValue = this.rgbToHex(this.rgb);\n this.rgb = this.convertRgbToNumberArray(target.style.backgroundColor);\n if (!this.rgb[3]) {\n this.rgb[3] = 1;\n }\n var cValue = this.rgbToHex(this.rgb);\n var hsv = this.rgbToHsv.apply(this, this.rgb);\n if (hsv[0] !== this.hsv[0]) {\n this.hueSlider.setProperties({ 'value': hsv[0] }, true);\n this.hueSlider.refresh();\n }\n this.setHsvContainerBg(hsv[0]);\n if (this.enableOpacity && hsv[3] !== this.hsv[3]) {\n this.opacitySlider.setProperties({ 'value': hsv[3] * 100 }, true);\n this.opacitySlider.refresh();\n this.updateOpacitySliderBg();\n }\n this.hsv = hsv;\n this.setHandlerPosition();\n this.updateInput(cValue);\n select('.' + PREVIEW + ' .' + CURRENT, this.container).style.backgroundColor = this.convertToRgbString(this.rgb);\n this.triggerEvent(cValue, pValue, this.convertToRgbString(this.rgb), false, e);\n };\n ColorPicker.prototype.paletteClickHandler = function (e) {\n e.preventDefault();\n var target = e.target;\n if (target.classList.contains(TILE)) {\n this.removeTileSelection();\n this.addTileSelection(target);\n if (target.classList.contains(NOCOLOR)) {\n this.noColorTile();\n }\n else {\n var cValue = target.getAttribute('aria-label');\n var pValue = this.rgbToHex(this.rgb);\n this.rgb = this.hexToRgb(this.roundValue(cValue));\n this.hsv = this.rgbToHsv.apply(this, this.rgb);\n if (this.getWrapper().classList.contains(SHOWVALUE)) {\n this.updateInput(cValue);\n }\n this.triggerEvent(cValue, pValue, this.convertToRgbString(this.rgb), false, e);\n }\n if (!this.inline && !this.showButtons) {\n this.closePopup(e);\n }\n }\n else {\n if (closest(target, '.' + MODESWITCH)) {\n this.switchToPicker();\n }\n else {\n if (target.classList.contains(APPLY) || target.classList.contains(CANCEL)) {\n this.ctrlBtnClick(target, e);\n }\n else {\n if (this.getWrapper().classList.contains(SHOWVALUE) && closest(target, '.' + FORMATSWITCH)) {\n this.formatSwitchHandler();\n }\n }\n }\n }\n };\n ColorPicker.prototype.noColorTile = function (isKey) {\n if (isKey === void 0) { isKey = false; }\n var pValue = this.rgbToHex(this.rgb);\n this.rgb = [];\n this.hsv = [];\n this.triggerEvent('', pValue, '', isKey);\n };\n ColorPicker.prototype.switchToPicker = function () {\n var wrapper = this.getWrapper();\n this.trigger('beforeModeSwitch', { element: this.container, mode: 'Picker' });\n this.unWireEvents();\n ([].slice.call(selectAll('.' + PALETTES, this.container))).forEach(function (ele) {\n detach(ele);\n });\n if (wrapper.classList.contains(SHOWVALUE)) {\n detach(select('.' + INPUTWRAPPER, this.container));\n }\n this.container.style.width = '';\n var grpEle = select('.e-custom-palette', this.container);\n if (this.presetColors) {\n remove(grpEle);\n }\n this.createPicker();\n this.getDragHandler().focus();\n this.createInput();\n this.refreshPopupPos();\n //for image editor popup position refreshing\n if (this.element.parentElement && this.element.parentElement.parentElement && this.element.parentElement.parentElement.classList.contains('e-ie-ddb-popup')) {\n this.refreshImageEditorPopupPos();\n }\n ;\n this.wireEvents();\n this.trigger('onModeSwitch', { element: this.container, mode: 'Picker' });\n };\n ColorPicker.prototype.ctrlBtnClick = function (ele, e) {\n if (ele.classList.contains(APPLY)) {\n var cValue = this.rgbToHex(this.rgb);\n this.triggerChangeEvent(cValue, e);\n }\n if (!this.inline) {\n this.closePopup(e);\n this.splitBtn.element.focus();\n }\n else if (ele.classList.contains(CANCEL)) {\n var beforeCloseArgs = { element: this.container, event: e, cancel: false };\n this.trigger('beforeClose', beforeCloseArgs);\n }\n };\n ColorPicker.prototype.paletteKeyDown = function (e) {\n var target = e.target;\n if (!target.classList.contains(PALETTES)) {\n return;\n }\n var selectedEle;\n var idx;\n var tiles = [].slice.call(selectAll('.' + TILE, target));\n var prevSelectedEle = (tiles.filter(function (tile) { return tile.classList.contains('e-selected'); })).pop();\n switch (!e.altKey && e.keyCode) {\n case 39:\n e.preventDefault();\n selectedEle = prevSelectedEle ? tiles[this.tilePosition(tiles, prevSelectedEle, this.enableRtl ? -1 : 1)]\n : tiles[this.enableRtl ? tiles.length - 1 : 0];\n this.keySelectionChanges(selectedEle);\n break;\n case 37:\n e.preventDefault();\n selectedEle = prevSelectedEle ? tiles[this.tilePosition(tiles, prevSelectedEle, this.enableRtl ? 1 : -1)]\n : tiles[this.enableRtl ? 0 : tiles.length - 1];\n this.keySelectionChanges(selectedEle);\n break;\n case 38:\n e.preventDefault();\n idx = prevSelectedEle ? this.tilePosition(tiles, prevSelectedEle, -this.columns) : 0;\n selectedEle = tiles[idx] ? tiles[idx] : tiles[idx - this.columns];\n this.keySelectionChanges(selectedEle);\n break;\n case 40:\n e.preventDefault();\n idx = prevSelectedEle ? this.tilePosition(tiles, prevSelectedEle, this.columns) : tiles.length - 1;\n if (tiles[idx]) {\n selectedEle = tiles[idx];\n }\n else {\n idx %= tiles.length;\n idx += tiles[tiles.length - 1].parentElement.childElementCount;\n selectedEle = tiles[idx];\n }\n this.keySelectionChanges(selectedEle);\n break;\n case 13:\n e.preventDefault();\n if (prevSelectedEle) {\n var cValue = prevSelectedEle.getAttribute('aria-label');\n this.enterKeyHandler(cValue ? cValue : '', e);\n }\n }\n };\n ColorPicker.prototype.keySelectionChanges = function (newEle) {\n this.removeTileSelection();\n this.addTileSelection(newEle);\n if (newEle.classList.contains(NOCOLOR)) {\n this.noColorTile(true);\n }\n else {\n var cValue = newEle.getAttribute('aria-label');\n var pValue = this.rgbToHex(this.rgb);\n this.rgb = this.hexToRgb(cValue);\n this.hsv = this.rgbToHsv.apply(this, this.rgb);\n if (this.getWrapper().classList.contains(SHOWVALUE)) {\n this.updateInput(cValue);\n }\n this.triggerEvent(cValue, pValue, this.convertToRgbString(this.rgb), true);\n }\n };\n ColorPicker.prototype.tilePosition = function (items, element, cIdx) {\n items = Array.prototype.slice.call(items);\n var n = items.length;\n var emptyCount = this.columns - items[n - 1].parentElement.childElementCount;\n var idx = items.indexOf(element);\n idx += cIdx;\n if (idx < 0) {\n idx += n + emptyCount;\n }\n else {\n idx %= n + emptyCount;\n }\n return idx;\n };\n ColorPicker.prototype.inputHandler = function (e) {\n var target = e.target;\n if (!target.value.length) {\n return;\n }\n var hsv;\n var pValue;\n var label = select('.e-float-text', target.parentElement).textContent;\n switch (label) {\n case 'HEX': {\n var value = '';\n if ((target.value[0] === '#' && target.value.length !== 5) || (target.value[0] !== '#' && target.value.length !== 4)) {\n value = this.roundValue(target.value);\n }\n if (value.length === 9) {\n pValue = this.rgbToHex(this.rgb);\n this.rgb = this.hexToRgb(value + value.substr(-2));\n this.inputValueChange(this.rgbToHsv.apply(this, this.rgb), pValue, target.value, e);\n }\n else {\n return;\n }\n break;\n }\n case 'R':\n if (this.rgb[0] !== Number(target.value)) {\n pValue = this.rgbToHex(this.rgb);\n this.rgb[0] = Number(target.value);\n hsv = this.rgbToHsv.apply(this, this.rgb);\n this.inputValueChange(hsv, pValue, null, e);\n }\n break;\n case 'G':\n if (this.rgb[1] !== Number(target.value)) {\n pValue = this.rgbToHex(this.rgb);\n this.rgb[1] = Number(target.value);\n hsv = this.rgbToHsv.apply(this, this.rgb);\n this.inputValueChange(hsv, pValue, null, e);\n }\n break;\n case 'B':\n if (this.rgb[2] !== Number(target.value)) {\n pValue = this.rgbToHex(this.rgb);\n this.rgb[2] = Number(target.value);\n hsv = this.rgbToHsv.apply(this, this.rgb);\n this.inputValueChange(hsv, pValue, null, e);\n }\n break;\n case 'H':\n this.hueSlider.value = Number(target.value);\n break;\n case 'S':\n if (this.hsv[1] !== Number(target.value)) {\n this.hsv[1] = Number(target.value);\n this.updateHsv();\n this.convertToOtherFormat(false, e);\n }\n break;\n case 'V':\n if (this.hsv[2] !== Number(target.value)) {\n this.hsv[2] = Number(target.value);\n this.updateHsv();\n this.convertToOtherFormat(false, e);\n }\n break;\n case 'A':\n this.opacitySlider.value = Number(target.value);\n break;\n }\n };\n ColorPicker.prototype.inputValueChange = function (hsv, pValue, value, e) {\n if (hsv[0] !== this.hsv[0]) {\n this.hueSlider.setProperties({ 'value': hsv[0] }, true);\n this.hueSlider.refresh();\n this.setHsvContainerBg(hsv[0]);\n }\n this.hsv = hsv;\n var cValue = this.rgbToHex(this.rgb);\n this.setHandlerPosition();\n this.updateInput(value ? value : cValue);\n var rgba = this.convertToRgbString(this.rgb);\n this.updatePreview(rgba);\n this.triggerEvent(cValue, pValue, rgba, false, e);\n };\n ColorPicker.prototype.triggerEvent = function (cValue, pValue, rgba, isKey, e) {\n if (isKey === void 0) { isKey = false; }\n var hex = cValue.slice(0, 7);\n if (isNullOrUndefined(e)) {\n e = new MouseEvent('click', { bubbles: true, cancelable: false });\n }\n if (!this.showButtons && !isKey) {\n this.trigger('change', { currentValue: { hex: hex, rgba: rgba }, event: e,\n previousValue: { hex: this.value.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(this.value)) }, value: cValue });\n if (this.enableOpacity) {\n this.setProperties({ 'value': cValue }, true);\n }\n else {\n this.setProperties({ 'value': hex }, true);\n }\n this.element.value = hex ? hex : '#000000';\n }\n else {\n this.trigger('select', {\n currentValue: { hex: hex, rgba: rgba }, event: e,\n previousValue: { hex: pValue.slice(0, 7), rgba: this.convertToRgbString(this.hexToRgb(pValue)) }\n });\n }\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers.\n * Also it maintains the initial input element from the DOM.\n *\n * @method destroy\n * @returns {void}\n */\n ColorPicker.prototype.destroy = function () {\n var _this = this;\n var wrapper = this.getWrapper();\n _super.prototype.destroy.call(this);\n ['tabindex', 'spellcheck'].forEach(function (attr) { _this.element.removeAttribute(attr); });\n if (this.inline) {\n this.unWireEvents();\n this.destroyOtherComp();\n }\n else {\n if (this.isPopupOpen()) {\n this.unWireEvents();\n this.destroyOtherComp();\n }\n this.splitBtn.destroy();\n this.splitBtn = null;\n }\n this.tileRipple();\n this.tileRipple = null;\n this.ctrlBtnRipple();\n this.ctrlBtnRipple = null;\n if (this.element.nextElementSibling) {\n detach(this.element.nextElementSibling);\n }\n if (wrapper) {\n wrapper.parentElement.insertBefore(this.element, wrapper);\n detach(wrapper);\n }\n this.container = null;\n if (this.formElement) {\n EventHandler.remove(this.formElement, 'reset', this.formResetHandler);\n }\n };\n ColorPicker.prototype.destroyOtherComp = function () {\n if (this.isPicker()) {\n var popup = closest(this.hueSlider.element, '.e-color-picker');\n var numericElemColl = popup.querySelectorAll('.e-numerictextbox');\n for (var i = 0; i < numericElemColl.length; i++) {\n getInstance(numericElemColl[i], NumericTextBox).destroy();\n }\n this.hueSlider.destroy();\n if (this.enableOpacity) {\n this.opacitySlider.destroy();\n this.opacitySlider = null;\n }\n this.hueSlider = null;\n var tooltipInst = this.getTooltipInst();\n tooltipInst.close();\n tooltipInst.destroy();\n this.tooltipEle = null;\n }\n };\n ColorPicker.prototype.isPopupOpen = function () {\n return this.getPopupEle().classList.contains('e-popup-open');\n };\n ColorPicker.prototype.unWireEvents = function () {\n if (this.isPicker()) {\n var dragHandler = this.getDragHandler();\n EventHandler.remove(dragHandler, 'keydown', this.pickerKeyDown);\n var ctrlBtn = select('.' + CTRLBTN, this.container);\n if (ctrlBtn) {\n EventHandler.remove(ctrlBtn, 'keydown', this.ctrlBtnKeyDown);\n }\n EventHandler.remove(this.getHsvContainer(), 'mousedown touchstart', this.handlerDown);\n if (this.modeSwitcher || this.showButtons) {\n EventHandler.remove(select('.' + CTRLSWITCH, this.container), 'click', this.btnClickHandler);\n }\n EventHandler.remove(select('.' + PREVIOUS, this.container), 'click', this.previewHandler);\n }\n else {\n EventHandler.remove(this.container, 'click', this.paletteClickHandler);\n EventHandler.remove(this.container, 'keydown', this.paletteKeyDown);\n }\n };\n ColorPicker.prototype.roundValue = function (value) {\n if (!value) {\n return '';\n }\n if (value[0] !== '#') {\n value = '#' + value;\n }\n var len = value.length;\n if (len === 4) {\n value += 'f';\n len = 5;\n }\n if (len === 5) {\n var tempValue = '';\n for (var i = 1, len_1 = value.length; i < len_1; i++) {\n tempValue += (value.charAt(i) + value.charAt(i));\n }\n value = '#' + tempValue;\n len = 9;\n }\n if (len === 7) {\n value += 'ff';\n }\n return value;\n };\n ColorPicker.prototype.hexToRgb = function (hex) {\n if (!hex) {\n return [];\n }\n hex = hex.trim();\n if (hex.length !== 9) {\n hex = this.roundValue(hex);\n }\n var opacity = Number((parseInt(hex.slice(-2), 16) / 255).toFixed(2));\n hex = hex.slice(1, 7);\n var bigInt = parseInt(hex, 16);\n var h = [];\n h.push((bigInt >> 16) & 255);\n h.push((bigInt >> 8) & 255);\n h.push(bigInt & 255);\n h.push(opacity);\n return h;\n };\n ColorPicker.prototype.rgbToHsv = function (r, g, b, opacity) {\n if (this.rgb && !this.rgb.length) {\n return [];\n }\n r /= 255;\n g /= 255;\n b /= 255;\n var max = Math.max(r, g, b);\n var min = Math.min(r, g, b);\n var h;\n var v = max;\n var d = max - min;\n var s = max === 0 ? 0 : d / max;\n if (max === min) {\n h = 0;\n }\n else {\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n }\n h /= 6;\n }\n var hsv = [Math.round(h * 360), Math.round(s * 1000) / 10, Math.round(v * 1000) / 10];\n if (!isNullOrUndefined(opacity)) {\n hsv.push(opacity);\n }\n return hsv;\n };\n ColorPicker.prototype.hsvToRgb = function (h, s, v, opacity) {\n var r;\n var g;\n var b;\n s /= 100;\n v /= 100;\n if (s === 0) {\n r = g = b = v;\n return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255), opacity];\n }\n h /= 60;\n var i = Math.floor(h);\n var f = h - i;\n var p = v * (1 - s);\n var q = v * (1 - s * f);\n var t = v * (1 - s * (1 - f));\n switch (i) {\n case 0:\n r = v;\n g = t;\n b = p;\n break;\n case 1:\n r = q;\n g = v;\n b = p;\n break;\n case 2:\n r = p;\n g = v;\n b = t;\n break;\n case 3:\n r = p;\n g = q;\n b = v;\n break;\n case 4:\n r = t;\n g = p;\n b = v;\n break;\n default:\n r = v;\n g = p;\n b = q;\n }\n var rgb = [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];\n if (!isNullOrUndefined(opacity)) {\n rgb.push(opacity);\n }\n return rgb;\n };\n ColorPicker.prototype.rgbToHex = function (rgb) {\n return rgb.length ? ('#' + this.hex(rgb[0]) + this.hex(rgb[1]) + this.hex(rgb[2]) +\n (!isNullOrUndefined(rgb[3]) ? (rgb[3] !== 0 ? (Math.round(rgb[3] * 255) + 0x10000).toString(16).substr(-2) : '00') : '')) : '';\n };\n ColorPicker.prototype.hex = function (x) {\n return ('0' + x.toString(16)).slice(-2);\n };\n ColorPicker.prototype.changeModeSwitcherProp = function (prop) {\n var ctrlSwitchWrapper = select('.' + CTRLSWITCH, this.container);\n if (prop) {\n if (ctrlSwitchWrapper) {\n this.appendModeSwitchBtn();\n }\n else {\n this.createCtrlBtn();\n if (this.isPicker() && !this.disabled) {\n this.addCtrlSwitchEvent();\n }\n }\n }\n else {\n if (ctrlSwitchWrapper) {\n if (this.showButtons) {\n detach(select('.' + MODESWITCH, ctrlSwitchWrapper));\n }\n else {\n remove(ctrlSwitchWrapper);\n }\n }\n }\n };\n ColorPicker.prototype.changeShowBtnProps = function (prop) {\n var ctrlBtnWrapper = select('.' + CTRLSWITCH, this.container);\n if (prop) {\n if (ctrlBtnWrapper) {\n remove(ctrlBtnWrapper);\n }\n this.createCtrlBtn();\n if (this.isPicker() && !this.disabled) {\n this.addCtrlSwitchEvent();\n }\n }\n else {\n if (this.modeSwitcher) {\n detach(select('.' + CTRLBTN, ctrlBtnWrapper));\n }\n else {\n remove(ctrlBtnWrapper);\n }\n }\n };\n ColorPicker.prototype.changeValueProp = function (newProp) {\n if (this.isPicker()) {\n this.rgb = this.hexToRgb(newProp);\n this.hsv = this.rgbToHsv.apply(this, this.rgb);\n this.setHandlerPosition();\n detach(closest(this.hueSlider.element, '.e-slider-preview'));\n this.createSlider();\n this.setHsvContainerBg();\n this.updateInput(newProp);\n if (this.rgb.length === 4) {\n this.updateOpacityInput(this.rgb[3] * 100);\n }\n }\n else {\n this.removeTileSelection();\n var ele = this.container.querySelector('span[aria-label=\"' + this.roundValue(newProp) + '\"]');\n if (ele) {\n this.addTileSelection(ele);\n }\n }\n };\n ColorPicker.prototype.setInputEleProps = function () {\n remove(select('.' + INPUTWRAPPER, this.container));\n this.createInput();\n };\n ColorPicker.prototype.changeDisabledProp = function (newProp) {\n if (this.isPicker()) {\n this.hueSlider.enabled = !newProp;\n this.opacitySlider.enabled = !newProp;\n this.setInputEleProps();\n }\n if (newProp) {\n this.toggleDisabled(true);\n this.unWireEvents();\n }\n else {\n this.toggleDisabled(false);\n this.wireEvents();\n }\n };\n ColorPicker.prototype.changeCssClassProps = function (newProp, oldProp) {\n var wrapper = this.getWrapper();\n var popupWrapper = this.getPopupEle();\n if (oldProp) {\n removeClass([wrapper, popupWrapper], oldProp.split(' '));\n }\n if (newProp) {\n addClass([wrapper, popupWrapper], newProp.replace(/\\s+/g, ' ').trim().split(' '));\n }\n };\n ColorPicker.prototype.changeRtlProps = function (newProp) {\n if (newProp) {\n addClass([this.getWrapper()], 'e-rtl');\n }\n else {\n removeClass([this.getWrapper()], 'e-rtl');\n }\n };\n ColorPicker.prototype.changePaletteProps = function () {\n detach(this.container.children[0]);\n this.container.style.width = '';\n this.createPalette();\n };\n ColorPicker.prototype.changeOpacityProps = function (newProp) {\n var wrapper = this.getWrapper();\n if (newProp) {\n removeClass([this.container.parentElement], HIDEOPACITY);\n this.createOpacitySlider(select('.e-colorpicker-slider', this.container).appendChild(this.createElement('div', { className: 'e-opacity-slider' })));\n if (!wrapper.classList.contains(HIDEVALUE) && !wrapper.classList.contains(HIDERGBA)) {\n this.appendOpacityValue(select('.e-input-container', this.container));\n }\n }\n else {\n addClass([this.container.parentElement], HIDEOPACITY);\n this.opacitySlider.destroy();\n remove(this.opacitySlider.element);\n this.opacitySlider = null;\n if (!wrapper.classList.contains(HIDEVALUE) && !wrapper.classList.contains(HIDERGBA)) {\n remove(select('.' + OPACITY, this.container).parentElement);\n }\n }\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {ColorPickerModel} newProp - Specifies new properties\n * @param {ColorPickerModel} oldProp - Specifies old properties\n * @returns {void}\n * @private\n */\n ColorPicker.prototype.onPropertyChanged = function (newProp, oldProp) {\n var _this = this;\n if (!isNullOrUndefined(newProp.value)) {\n var value = this.roundValue(newProp.value);\n if (value.length === 9) {\n this.element.value = this.roundValue(value).slice(0, 7);\n var preview = this.splitBtn && select('.' + SPLITPREVIEW, this.splitBtn.element);\n if (preview) {\n preview.style.backgroundColor = this.convertToRgbString(this.hexToRgb(newProp.value));\n }\n }\n else if (this.noColor && this.mode === 'Palette' && this.value === '') {\n var preview = this.splitBtn && select('.' + SPLITPREVIEW, this.splitBtn.element);\n preview.style.backgroundColor = '';\n }\n else {\n this.value = oldProp.value;\n }\n }\n if (!this.inline && isNullOrUndefined(newProp.inline)) {\n var otherCompModel = ['disabled', 'enableRtl'];\n this.splitBtn.setProperties(getModel(newProp, otherCompModel));\n if (!this.isPopupOpen()) {\n this.changeCssClassProps(newProp.cssClass, oldProp.cssClass);\n this.changeRtlProps(newProp.enableRtl);\n return;\n }\n }\n var _loop_1 = function (prop) {\n switch (prop) {\n case 'inline':\n if (newProp.inline) {\n this_1.getWrapper().appendChild(this_1.container);\n this_1.splitBtn.destroy();\n detach(this_1.element.nextElementSibling);\n if (!this_1.container.children.length) {\n this_1.createWidget();\n }\n }\n else {\n this_1.destroyOtherComp();\n this_1.unWireEvents();\n this_1.container.innerHTML = '';\n this_1.createSplitBtn();\n }\n break;\n case 'cssClass': {\n this_1.changeCssClassProps(newProp.cssClass, oldProp.cssClass);\n var props = newProp.cssClass.split(' ').concat(oldProp.cssClass.split(' '));\n props = props.reduce(function (a, b) { if (a.indexOf(b) < 0) {\n a.push(b);\n } return a; }, []);\n var count_1 = 0;\n props.forEach(function (cls) {\n if (count_1 === 0 &&\n (cls === HIDEVALUE || cls === HIDEVALUESWITCH || cls === SHOWVALUE || cls === HIDEHEX || cls === HIDERGBA)) {\n var inputWrap = select('.' + INPUTWRAPPER, _this.container);\n if (inputWrap) {\n remove(select('.' + INPUTWRAPPER, _this.container));\n }\n _this.createInput();\n count_1++;\n }\n });\n break;\n }\n case 'enableRtl':\n if (this_1.isPicker()) {\n this_1.hueSlider.enableRtl = newProp.enableRtl;\n if (this_1.enableOpacity) {\n this_1.opacitySlider.enableRtl = newProp.enableRtl;\n }\n this_1.setInputEleProps();\n }\n this_1.changeRtlProps(newProp.enableRtl);\n break;\n case 'disabled':\n this_1.changeDisabledProp(newProp.disabled);\n break;\n case 'value':\n if (this_1.value !== oldProp.value) {\n this_1.changeValueProp(newProp.value);\n }\n break;\n case 'showButtons':\n this_1.changeShowBtnProps(newProp.showButtons);\n break;\n case 'mode':\n if (newProp.mode === 'Picker') {\n this_1.switchToPicker();\n }\n else {\n this_1.switchToPalette();\n }\n break;\n case 'modeSwitcher':\n this_1.changeModeSwitcherProp(newProp.modeSwitcher);\n break;\n case 'columns':\n case 'presetColors':\n if (!this_1.isPicker()) {\n this_1.changePaletteProps();\n }\n break;\n case 'noColor':\n if (newProp.noColor) {\n if (this_1.mode === 'Palette' && !this_1.modeSwitcher) {\n this_1.setNoColor();\n }\n }\n else {\n this_1.changePaletteProps();\n }\n break;\n case 'enableOpacity':\n this_1.changeOpacityProps(newProp.enableOpacity);\n break;\n }\n };\n var this_1 = this;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n _loop_1(prop);\n }\n };\n /**\n * Sets the focus to Colorpicker\n * its native method\n *\n * @public\n * @returns {void}\n */\n ColorPicker.prototype.focusIn = function () {\n this.element.parentElement.focus();\n };\n __decorate([\n Property('#008000ff')\n ], ColorPicker.prototype, \"value\", void 0);\n __decorate([\n Property('')\n ], ColorPicker.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], ColorPicker.prototype, \"disabled\", void 0);\n __decorate([\n Property('Picker')\n ], ColorPicker.prototype, \"mode\", void 0);\n __decorate([\n Property(true)\n ], ColorPicker.prototype, \"modeSwitcher\", void 0);\n __decorate([\n Property(null)\n ], ColorPicker.prototype, \"presetColors\", void 0);\n __decorate([\n Property(true)\n ], ColorPicker.prototype, \"showButtons\", void 0);\n __decorate([\n Property(10)\n ], ColorPicker.prototype, \"columns\", void 0);\n __decorate([\n Property(false)\n ], ColorPicker.prototype, \"inline\", void 0);\n __decorate([\n Property(false)\n ], ColorPicker.prototype, \"noColor\", void 0);\n __decorate([\n Property(false)\n ], ColorPicker.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(true)\n ], ColorPicker.prototype, \"enableOpacity\", void 0);\n __decorate([\n Property(false)\n ], ColorPicker.prototype, \"createPopupOnClick\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"select\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"beforeTileRender\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"beforeModeSwitch\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"onModeSwitch\", void 0);\n __decorate([\n Event()\n ], ColorPicker.prototype, \"created\", void 0);\n ColorPicker = __decorate([\n NotifyPropertyChanges\n ], ColorPicker);\n return ColorPicker;\n}(Component));\nexport { ColorPicker };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, Event, EventHandler, L10n, setValue, getValue, isNullOrUndefined, Browser } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, detach, Internationalization, getUniqueID, closest } from '@syncfusion/ej2-base';\nimport { addClass, removeClass } from '@syncfusion/ej2-base';\nimport { Input, containerAttributes, TEXTBOX_FOCUS } from '../input/input';\nvar HIDE_CLEAR = 'e-clear-icon-hide';\n/**\n * Represents the TextBox component that allows the user to enter the values based on it's type.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar TextBox = /** @class */ (function (_super) {\n __extends(TextBox, _super);\n /**\n *\n * @param {TextBoxModel} options - Specifies the TextBox model.\n * @param {string | HTMLInputElement | HTMLTextAreaElement} element - Specifies the element to render as component.\n * @private\n */\n function TextBox(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.previousValue = null;\n _this.isAngular = false;\n _this.isHiddenInput = false;\n _this.isForm = false;\n _this.inputPreviousValue = null;\n _this.isVue = false;\n _this.isReact = false;\n _this.textboxOptions = options;\n return _this;\n }\n /**\n * Calls internally if any of the property value is changed.\n *\n * @param {TextBoxModel} newProp - Returns the dynamic property value of the component.\n * @param {TextBoxModel} oldProp - Returns the previous property value of the component.\n * @returns {void}\n * @private\n */\n TextBox.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'floatLabelType':\n Input.removeFloating(this.textboxWrapper);\n Input.addFloating(this.respectiveElement, this.floatLabelType, this.placeholder);\n break;\n case 'enabled':\n Input.setEnabled(this.enabled, this.respectiveElement, this.floatLabelType, this.textboxWrapper.container);\n this.bindClearEvent();\n break;\n case 'width':\n Input.setWidth(newProp.width, this.textboxWrapper.container);\n break;\n case 'value':\n {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n if (!Input.isBlank(this.value)) {\n this.value = this.value.toString();\n }\n this.isProtectedOnChange = prevOnChange;\n Input.setValue(this.value, this.respectiveElement, this.floatLabelType, this.showClearButton);\n if (this.isHiddenInput) {\n this.element.value = this.respectiveElement.value;\n }\n this.inputPreviousValue = this.respectiveElement.value;\n /* istanbul ignore next */\n if ((this.isAngular || this.isVue) && this.preventChange === true) {\n this.previousValue = this.isAngular ? this.value : this.previousValue;\n this.preventChange = false;\n }\n else if (isNullOrUndefined(this.isAngular) || !this.isAngular\n || (this.isAngular && !this.preventChange) || (this.isAngular && isNullOrUndefined(this.preventChange))) {\n this.raiseChangeEvent();\n }\n }\n break;\n case 'htmlAttributes':\n {\n this.updateHTMLAttributesToElement();\n this.updateHTMLAttributesToWrapper();\n this.checkAttributes(true);\n this.multiline && !isNullOrUndefined(this.textarea) ? Input.validateInputType(this.textboxWrapper.container, this.textarea) : Input.validateInputType(this.textboxWrapper.container, this.element);\n }\n break;\n case 'readonly':\n Input.setReadonly(this.readonly, this.respectiveElement);\n break;\n case 'type':\n if (this.respectiveElement.tagName !== 'TEXTAREA') {\n this.respectiveElement.setAttribute('type', this.type);\n Input.validateInputType(this.textboxWrapper.container, this.element);\n this.raiseChangeEvent();\n }\n break;\n case 'showClearButton':\n Input.setClearButton(this.showClearButton, this.respectiveElement, this.textboxWrapper);\n this.bindClearEvent();\n break;\n case 'enableRtl':\n Input.setEnableRtl(this.enableRtl, [this.textboxWrapper.container]);\n break;\n case 'placeholder':\n Input.setPlaceholder(this.placeholder, this.respectiveElement);\n Input.calculateWidth(this.respectiveElement, this.textboxWrapper.container);\n break;\n case 'autocomplete':\n if (this.autocomplete !== 'on' && this.autocomplete !== '') {\n this.respectiveElement.autocomplete = this.autocomplete;\n }\n else {\n this.removeAttributes(['autocomplete']);\n }\n break;\n case 'cssClass':\n Input.updateCssClass(newProp.cssClass, oldProp.cssClass, this.textboxWrapper.container);\n break;\n case 'locale':\n this.globalize = new Internationalization(this.locale);\n this.l10n.setLocale(this.locale);\n this.setProperties({ placeholder: this.l10n.getConstant('placeholder') }, true);\n Input.setPlaceholder(this.placeholder, this.respectiveElement);\n break;\n }\n }\n };\n /**\n * Gets the component name\n *\n * @returns {string} Returns the component name.\n * @private\n */\n TextBox.prototype.getModuleName = function () {\n return 'textbox';\n };\n TextBox.prototype.preRender = function () {\n this.cloneElement = this.element.cloneNode(true);\n this.formElement = closest(this.element, 'form');\n if (!isNullOrUndefined(this.formElement)) {\n this.isForm = true;\n }\n /* istanbul ignore next */\n if (this.element.tagName === 'EJS-TEXTBOX') {\n var ejInstance = getValue('ej2_instances', this.element);\n var inputElement = this.multiline ?\n this.createElement('textarea') :\n this.createElement('input');\n var index = 0;\n for (index; index < this.element.attributes.length; index++) {\n var attributeName = this.element.attributes[index].nodeName;\n if (attributeName !== 'id' && attributeName !== 'class') {\n inputElement.setAttribute(attributeName, this.element.attributes[index].nodeValue);\n inputElement.innerHTML = this.element.innerHTML;\n if (attributeName === 'name') {\n this.element.removeAttribute('name');\n }\n }\n else if (attributeName === 'class') {\n inputElement.setAttribute(attributeName, this.element.className.split(' ').filter(function (item) { return item.indexOf('ng-') !== 0; }).join(' '));\n }\n }\n this.element.appendChild(inputElement);\n this.element = inputElement;\n setValue('ej2_instances', ejInstance, this.element);\n }\n this.updateHTMLAttributesToElement();\n this.checkAttributes(false);\n if ((isNullOrUndefined(this.textboxOptions) || (this.textboxOptions['value'] === undefined)) && this.element.value !== '') {\n this.setProperties({ value: this.element.value }, true);\n }\n if (this.element.tagName !== 'TEXTAREA') {\n this.element.setAttribute('type', this.type);\n }\n if (this.type === 'text' || (this.element.tagName === 'INPUT' && this.multiline && this.isReact)) {\n this.element.setAttribute('role', 'textbox');\n }\n this.globalize = new Internationalization(this.locale);\n var localeText = { placeholder: this.placeholder };\n this.l10n = new L10n('textbox', localeText, this.locale);\n if (this.l10n.getConstant('placeholder') !== '') {\n this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);\n }\n if (!this.element.hasAttribute('id')) {\n this.element.setAttribute('id', getUniqueID('textbox'));\n }\n if (!this.element.hasAttribute('name')) {\n this.element.setAttribute('name', this.element.getAttribute('id'));\n }\n if (this.element.tagName === 'INPUT' && this.multiline) {\n this.isHiddenInput = true;\n this.textarea = this.createElement('textarea');\n this.element.parentNode.insertBefore(this.textarea, this.element);\n this.element.setAttribute('type', 'hidden');\n this.textarea.setAttribute('name', this.element.getAttribute('name'));\n this.element.removeAttribute('name');\n this.textarea.setAttribute('role', this.element.getAttribute('role'));\n this.element.removeAttribute('role');\n this.textarea.setAttribute('id', getUniqueID('textarea'));\n var apiAttributes = ['placeholder', 'disabled', 'value', 'readonly', 'type', 'autocomplete'];\n for (var index = 0; index < this.element.attributes.length; index++) {\n var attributeName = this.element.attributes[index].nodeName;\n if (this.element.hasAttribute(attributeName) && containerAttributes.indexOf(attributeName) < 0 &&\n !(attributeName === 'id' || attributeName === 'type' || attributeName === 'e-mappinguid')) {\n // e-mappinguid attribute is handled for Grid component.\n this.textarea.setAttribute(attributeName, this.element.attributes[index].nodeValue);\n if (apiAttributes.indexOf(attributeName) < 0) {\n this.element.removeAttribute(attributeName);\n index--;\n }\n }\n }\n }\n };\n TextBox.prototype.checkAttributes = function (isDynamic) {\n var attrs = isDynamic ? isNullOrUndefined(this.htmlAttributes) ? [] : Object.keys(this.htmlAttributes) :\n ['placeholder', 'disabled', 'value', 'readonly', 'type', 'autocomplete'];\n for (var _i = 0, attrs_1 = attrs; _i < attrs_1.length; _i++) {\n var key = attrs_1[_i];\n if (!isNullOrUndefined(this.element.getAttribute(key))) {\n switch (key) {\n case 'disabled':\n if ((isNullOrUndefined(this.textboxOptions) || (this.textboxOptions['enabled'] === undefined)) || isDynamic) {\n var enabled = this.element.getAttribute(key) === 'disabled' || this.element.getAttribute(key) === '' ||\n this.element.getAttribute(key) === 'true' ? false : true;\n this.setProperties({ enabled: enabled }, !isDynamic);\n }\n break;\n case 'readonly':\n if ((isNullOrUndefined(this.textboxOptions) || (this.textboxOptions['readonly'] === undefined)) || isDynamic) {\n var readonly = this.element.getAttribute(key) === 'readonly' || this.element.getAttribute(key) === ''\n || this.element.getAttribute(key) === 'true' ? true : false;\n this.setProperties({ readonly: readonly }, !isDynamic);\n }\n break;\n case 'placeholder':\n if ((isNullOrUndefined(this.textboxOptions) || (this.textboxOptions['placeholder'] === undefined)) || isDynamic) {\n this.setProperties({ placeholder: this.element.placeholder }, !isDynamic);\n }\n break;\n case 'autocomplete':\n if ((isNullOrUndefined(this.textboxOptions) || (this.textboxOptions['autocomplete'] === undefined)) || isDynamic) {\n var autoCompleteTxt = this.element.autocomplete === 'off' ? 'off' : 'on';\n this.setProperties({ autocomplete: autoCompleteTxt }, !isDynamic);\n }\n break;\n case 'value':\n if (((isNullOrUndefined(this.textboxOptions) || (this.textboxOptions['value'] === undefined)) || isDynamic) && this.element.value !== '') {\n this.setProperties({ value: this.element.value }, !isDynamic);\n }\n break;\n case 'type':\n if ((isNullOrUndefined(this.textboxOptions) || (this.textboxOptions['type'] === undefined)) || isDynamic) {\n this.setProperties({ type: this.element.type }, !isDynamic);\n }\n break;\n }\n }\n }\n };\n /**\n * To Initialize the control rendering\n *\n * @returns {void}\n * @private\n */\n TextBox.prototype.render = function () {\n var updatedCssClassValue = this.cssClass;\n if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {\n updatedCssClassValue = Input.getInputValidClassList(this.cssClass);\n }\n this.respectiveElement = (this.isHiddenInput) ? this.textarea : this.element;\n this.textboxWrapper = Input.createInput({\n element: this.respectiveElement,\n floatLabelType: this.floatLabelType,\n properties: {\n enabled: this.enabled,\n enableRtl: this.enableRtl,\n cssClass: updatedCssClassValue,\n readonly: this.readonly,\n placeholder: this.placeholder,\n showClearButton: this.showClearButton\n }\n });\n this.updateHTMLAttributesToWrapper();\n if (this.isHiddenInput) {\n this.respectiveElement.parentNode.insertBefore(this.element, this.respectiveElement);\n }\n this.wireEvents();\n if (!isNullOrUndefined(this.value)) {\n Input.setValue(this.value, this.respectiveElement, this.floatLabelType, this.showClearButton);\n if (this.isHiddenInput) {\n this.element.value = this.respectiveElement.value;\n }\n }\n if (!isNullOrUndefined(this.value)) {\n this.initialValue = this.value;\n this.setInitialValue();\n }\n if (this.autocomplete !== 'on' && this.autocomplete !== '') {\n this.respectiveElement.autocomplete = this.autocomplete;\n }\n else if (!isNullOrUndefined(this.textboxOptions) && (this.textboxOptions['autocomplete'] !== undefined)) {\n this.removeAttributes(['autocomplete']);\n }\n this.previousValue = this.value;\n this.inputPreviousValue = this.value;\n this.respectiveElement.defaultValue = this.respectiveElement.value;\n Input.setWidth(this.width, this.textboxWrapper.container);\n if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {\n this.enabled = false;\n }\n this.renderComplete();\n };\n TextBox.prototype.updateHTMLAttributesToWrapper = function () {\n Input.updateHTMLAttributesToWrapper(this.htmlAttributes, this.textboxWrapper.container);\n };\n TextBox.prototype.updateHTMLAttributesToElement = function () {\n Input.updateHTMLAttributesToElement(this.htmlAttributes, this.respectiveElement ? this.respectiveElement : (this.multiline && !isNullOrUndefined(this.textarea) ? this.textarea : this.element));\n };\n TextBox.prototype.setInitialValue = function () {\n if (!this.isAngular) {\n this.respectiveElement.setAttribute('value', this.initialValue);\n }\n };\n TextBox.prototype.wireEvents = function () {\n EventHandler.add(this.respectiveElement, 'focus', this.focusHandler, this);\n EventHandler.add(this.respectiveElement, 'blur', this.focusOutHandler, this);\n EventHandler.add(this.respectiveElement, 'keydown', this.keydownHandler, this);\n EventHandler.add(this.respectiveElement, 'input', this.inputHandler, this);\n EventHandler.add(this.respectiveElement, 'change', this.changeHandler, this);\n if (this.isForm) {\n EventHandler.add(this.formElement, 'reset', this.resetForm, this);\n }\n this.bindClearEvent();\n if (!isNullOrUndefined(this.textboxWrapper.container.querySelector('.e-float-text')) && this.floatLabelType === 'Auto'\n && this.textboxWrapper.container.classList.contains('e-autofill') &&\n this.textboxWrapper.container.classList.contains('e-outline')) {\n EventHandler.add((this.textboxWrapper.container.querySelector('.e-float-text')), 'animationstart', this.animationHandler, this);\n }\n };\n TextBox.prototype.animationHandler = function () {\n this.textboxWrapper.container.classList.add('e-valid-input');\n var label = this.textboxWrapper.container.querySelector('.e-float-text');\n if (!isNullOrUndefined(label)) {\n label.classList.add('e-label-top');\n if (label.classList.contains('e-label-bottom')) {\n label.classList.remove('e-label-bottom');\n }\n }\n };\n TextBox.prototype.resetValue = function (value) {\n var prevOnChange = this.isProtectedOnChange;\n this.isProtectedOnChange = true;\n this.value = value;\n if (value == null && this.textboxWrapper.container.classList.contains('e-valid-input')) {\n this.textboxWrapper.container.classList.remove('e-valid-input');\n }\n this.isProtectedOnChange = prevOnChange;\n };\n TextBox.prototype.resetForm = function () {\n if (this.isAngular) {\n this.resetValue('');\n }\n else {\n this.resetValue(this.initialValue);\n }\n if (!isNullOrUndefined(this.textboxWrapper)) {\n var label = this.textboxWrapper.container.querySelector('.e-float-text');\n if (!isNullOrUndefined(label) && this.floatLabelType !== 'Always') {\n if ((isNullOrUndefined(this.initialValue) || this.initialValue === '')) {\n label.classList.add('e-label-bottom');\n label.classList.remove('e-label-top');\n }\n else if (this.initialValue !== '') {\n label.classList.add('e-label-top');\n label.classList.remove('e-label-bottom');\n }\n }\n }\n };\n TextBox.prototype.focusHandler = function (args) {\n var eventArgs = {\n container: this.textboxWrapper.container,\n event: args,\n value: this.value\n };\n this.trigger('focus', eventArgs);\n };\n TextBox.prototype.focusOutHandler = function (args) {\n if (!(this.previousValue === null && this.value === null && this.respectiveElement.value === '') &&\n (this.previousValue !== this.value)) {\n this.raiseChangeEvent(args, true);\n }\n var eventArgs = {\n container: this.textboxWrapper.container,\n event: args,\n value: this.value\n };\n this.trigger('blur', eventArgs);\n };\n TextBox.prototype.keydownHandler = function (args) {\n if ((args.keyCode === 13 || args.keyCode === 9) && !((this.previousValue === null || this.previousValue === \"\") && (this.value === null || this.value === \"\") && this.respectiveElement.value === \"\")) {\n this.setProperties({ value: this.respectiveElement.value }, true);\n }\n };\n TextBox.prototype.inputHandler = function (args) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-this-alias\n var textboxObj = this;\n var eventArgs = {\n event: args,\n value: this.respectiveElement.value,\n previousValue: this.inputPreviousValue,\n container: this.textboxWrapper.container\n };\n this.inputPreviousValue = this.respectiveElement.value;\n /* istanbul ignore next */\n if (this.isAngular) {\n textboxObj.localChange({ value: this.respectiveElement.value });\n this.preventChange = true;\n }\n if (this.isVue) {\n this.preventChange = true;\n }\n this.trigger('input', eventArgs);\n args.stopPropagation();\n };\n TextBox.prototype.changeHandler = function (args) {\n this.setProperties({ value: this.respectiveElement.value }, true);\n if (this.previousValue != this.value) {\n this.raiseChangeEvent(args, true);\n }\n args.stopPropagation();\n };\n TextBox.prototype.raiseChangeEvent = function (event, interaction) {\n var eventArgs = {\n event: event,\n value: this.value,\n previousValue: this.previousValue,\n container: this.textboxWrapper.container,\n isInteraction: interaction ? interaction : false,\n isInteracted: interaction ? interaction : false\n };\n this.preventChange = false;\n this.trigger('change', eventArgs);\n this.previousValue = this.value;\n //EJ2CORE-738:For this task we update the textarea value to the input when input tag with multiline is present\n if (this.element.tagName === 'INPUT' && this.multiline && Browser.info.name === 'mozilla') {\n this.element.value = this.respectiveElement.value;\n }\n };\n TextBox.prototype.bindClearEvent = function () {\n if (this.showClearButton) {\n if (this.enabled) {\n EventHandler.add(this.textboxWrapper.clearButton, 'mousedown touchstart', this.resetInputHandler, this);\n }\n else {\n EventHandler.remove(this.textboxWrapper.clearButton, 'mousedown touchstart', this.resetInputHandler);\n }\n }\n };\n TextBox.prototype.resetInputHandler = function (event) {\n event.preventDefault();\n if (!(this.textboxWrapper.clearButton.classList.contains(HIDE_CLEAR)) || this.textboxWrapper.container.classList.contains('e-static-clear')) {\n Input.setValue('', this.respectiveElement, this.floatLabelType, this.showClearButton);\n if (this.isHiddenInput) {\n this.element.value = this.respectiveElement.value;\n }\n this.setProperties({ value: this.respectiveElement.value }, true);\n var eventArgs = {\n event: event,\n value: this.respectiveElement.value,\n previousValue: this.inputPreviousValue,\n container: this.textboxWrapper.container\n };\n this.trigger('input', eventArgs);\n this.inputPreviousValue = this.respectiveElement.value;\n this.raiseChangeEvent(event, true);\n if (closest(this.element, 'form')) {\n var element = this.element;\n var keyupEvent = document.createEvent('KeyboardEvent');\n keyupEvent.initEvent('keyup', false, true);\n element.dispatchEvent(keyupEvent);\n }\n }\n };\n TextBox.prototype.unWireEvents = function () {\n EventHandler.remove(this.respectiveElement, 'focus', this.focusHandler);\n EventHandler.remove(this.respectiveElement, 'blur', this.focusOutHandler);\n EventHandler.remove(this.respectiveElement, 'keydown', this.keydownHandler);\n EventHandler.remove(this.respectiveElement, 'input', this.inputHandler);\n EventHandler.remove(this.respectiveElement, 'change', this.changeHandler);\n if (this.isForm) {\n EventHandler.remove(this.formElement, 'reset', this.resetForm);\n }\n if (!isNullOrUndefined(this.textboxWrapper.container.querySelector('.e-float-text')) && this.floatLabelType === 'Auto'\n && this.textboxWrapper.container.classList.contains('e-outline') &&\n this.textboxWrapper.container.classList.contains('e-autofill')) {\n EventHandler.remove((this.textboxWrapper.container.querySelector('.e-float-text')), 'animationstart', this.animationHandler);\n }\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers.\n * Also, it maintains the initial TextBox element from the DOM.\n *\n * @method destroy\n * @returns {void}\n */\n TextBox.prototype.destroy = function () {\n this.unWireEvents();\n if (this.showClearButton) {\n this.clearButton = document.getElementsByClassName('e-clear-icon')[0];\n }\n if (this.element.tagName === 'INPUT' && this.multiline) {\n detach(this.textboxWrapper.container.getElementsByTagName('textarea')[0]);\n this.respectiveElement = this.element;\n this.element.removeAttribute('type');\n }\n this.respectiveElement.value = this.respectiveElement.defaultValue;\n this.respectiveElement.classList.remove('e-input');\n this.removeAttributes(['aria-disabled', 'aria-readonly', 'aria-labelledby']);\n if (!isNullOrUndefined(this.textboxWrapper)) {\n this.textboxWrapper.container.insertAdjacentElement('afterend', this.respectiveElement);\n detach(this.textboxWrapper.container);\n }\n this.textboxWrapper = null;\n Input.destroy({\n element: this.respectiveElement,\n floatLabelType: this.floatLabelType,\n properties: this.properties\n }, this.clearButton);\n _super.prototype.destroy.call(this);\n };\n /**\n * Adding the icons to the TextBox component.\n *\n * @param { string } position - Specify the icon placement on the TextBox. Possible values are append and prepend.\n * @param { string | string[] } icons - Icon classes which are need to add to the span element which is going to created.\n * Span element acts as icon or button element for TextBox.\n * @returns {void}\n */\n TextBox.prototype.addIcon = function (position, icons) {\n Input.addIcon(position, icons, this.textboxWrapper.container, this.respectiveElement, this.createElement);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns */\n /**\n * Gets the properties to be maintained in the persisted state.\n *\n */\n TextBox.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns */\n /**\n * Adding the multiple attributes as key-value pair to the TextBox element.\n *\n * @param {string} attributes - Specifies the attributes to be add to TextBox element.\n * @returns {void}\n */\n TextBox.prototype.addAttributes = function (attributes) {\n for (var _i = 0, _a = Object.keys(attributes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (key === 'disabled') {\n this.setProperties({ enabled: false }, true);\n Input.setEnabled(this.enabled, this.respectiveElement, this.floatLabelType, this.textboxWrapper.container);\n }\n else if (key === 'readonly') {\n this.setProperties({ readonly: true }, true);\n Input.setReadonly(this.readonly, this.respectiveElement);\n }\n else if (key === 'class') {\n this.respectiveElement.classList.add(attributes[\"\" + key]);\n }\n else if (key === 'placeholder') {\n this.setProperties({ placeholder: attributes[\"\" + key] }, true);\n Input.setPlaceholder(this.placeholder, this.respectiveElement);\n }\n else if (key === 'rows' && this.respectiveElement.tagName === 'TEXTAREA') {\n this.respectiveElement.setAttribute(key, attributes[\"\" + key]);\n }\n else {\n this.respectiveElement.setAttribute(key, attributes[\"\" + key]);\n }\n }\n };\n /**\n * Removing the multiple attributes as key-value pair to the TextBox element.\n *\n * @param { string[] } attributes - Specifies the attributes name to be removed from TextBox element.\n * @returns {void}\n */\n TextBox.prototype.removeAttributes = function (attributes) {\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var key = attributes_1[_i];\n if (key === 'disabled') {\n this.setProperties({ enabled: true }, true);\n Input.setEnabled(this.enabled, this.respectiveElement, this.floatLabelType, this.textboxWrapper.container);\n }\n else if (key === 'readonly') {\n this.setProperties({ readonly: false }, true);\n Input.setReadonly(this.readonly, this.respectiveElement);\n }\n else if (key === 'placeholder') {\n this.setProperties({ placeholder: null }, true);\n Input.setPlaceholder(this.placeholder, this.respectiveElement);\n }\n else {\n this.respectiveElement.removeAttribute(key);\n }\n }\n };\n /**\n * Sets the focus to widget for interaction.\n *\n * @returns {void}\n */\n TextBox.prototype.focusIn = function () {\n if (document.activeElement !== this.respectiveElement && this.enabled) {\n this.respectiveElement.focus();\n if (this.textboxWrapper.container.classList.contains('e-input-group')\n || this.textboxWrapper.container.classList.contains('e-outline')\n || this.textboxWrapper.container.classList.contains('e-filled')) {\n addClass([this.textboxWrapper.container], [TEXTBOX_FOCUS]);\n }\n }\n };\n /**\n * Remove the focus from widget, if the widget is in focus state.\n *\n * @returns {void}\n */\n TextBox.prototype.focusOut = function () {\n if (document.activeElement === this.respectiveElement && this.enabled) {\n this.respectiveElement.blur();\n if (this.textboxWrapper.container.classList.contains('e-input-group')\n || this.textboxWrapper.container.classList.contains('e-outline')\n || this.textboxWrapper.container.classList.contains('e-filled')) {\n removeClass([this.textboxWrapper.container], [TEXTBOX_FOCUS]);\n }\n }\n };\n __decorate([\n Property('text')\n ], TextBox.prototype, \"type\", void 0);\n __decorate([\n Property(false)\n ], TextBox.prototype, \"readonly\", void 0);\n __decorate([\n Property(null)\n ], TextBox.prototype, \"value\", void 0);\n __decorate([\n Property('Never')\n ], TextBox.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property('')\n ], TextBox.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], TextBox.prototype, \"placeholder\", void 0);\n __decorate([\n Property('on')\n ], TextBox.prototype, \"autocomplete\", void 0);\n __decorate([\n Property({})\n ], TextBox.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(false)\n ], TextBox.prototype, \"multiline\", void 0);\n __decorate([\n Property(true)\n ], TextBox.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], TextBox.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(false)\n ], TextBox.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(null)\n ], TextBox.prototype, \"width\", void 0);\n __decorate([\n Event()\n ], TextBox.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], TextBox.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], TextBox.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], TextBox.prototype, \"blur\", void 0);\n __decorate([\n Event()\n ], TextBox.prototype, \"focus\", void 0);\n __decorate([\n Event()\n ], TextBox.prototype, \"input\", void 0);\n TextBox = __decorate([\n NotifyPropertyChanges\n ], TextBox);\n return TextBox;\n}(Component));\nexport { TextBox };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, formatUnit, EventHandler, Event, isNullOrUndefined, closest, Browser } from '@syncfusion/ej2-base';\nimport { Property, NotifyPropertyChanges, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport { setStyleAttribute as setStyle, addClass, removeClass, Touch } from '@syncfusion/ej2-base';\nvar CONTROL = 'e-control';\nvar ROOT = 'e-sidebar';\nvar DOCKER = 'e-dock';\nvar CLOSE = 'e-close';\nvar OPEN = 'e-open';\nvar TRASITION = 'e-transition';\nvar DEFAULTBACKDROP = 'e-sidebar-overlay';\nvar RTL = 'e-rtl';\nvar RIGHT = 'e-right';\nvar LEFT = 'e-left';\nvar OVER = 'e-over';\nvar PUSH = 'e-push';\nvar SLIDE = 'e-slide';\nvar VISIBILITY = 'e-visibility';\nvar DISPLAY = 'e-sidebar-display';\nvar MAINCONTENTANIMATION = 'e-content-animation';\nvar DISABLEANIMATION = 'e-disable-animation';\nvar CONTEXT = 'e-sidebar-context';\nvar SIDEBARABSOLUTE = 'e-sidebar-absolute';\n/**\n * Sidebar is an expandable or collapsible\n * component that typically act as a side container to place the primary or secondary content alongside of the main content.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar Sidebar = /** @class */ (function (_super) {\n __extends(Sidebar, _super);\n /* eslint-enable */\n function Sidebar(options, element) {\n return _super.call(this, options, element) || this;\n }\n Sidebar.prototype.preRender = function () {\n this.setWidth();\n };\n Sidebar.prototype.render = function () {\n this.initialize();\n this.wireEvents();\n this.renderComplete();\n };\n Sidebar.prototype.initialize = function () {\n this.setTarget();\n this.addClass();\n this.setZindex();\n if (this.enableDock) {\n this.setDock();\n }\n if (this.isOpen) {\n this.show();\n this.firstRender = true;\n }\n else {\n this.setMediaQuery();\n }\n this.checkType(true);\n this.setType(this.type);\n this.setCloseOnDocumentClick();\n this.setEnableRTL();\n if (Browser.isDevice) {\n this.windowWidth = window.innerWidth;\n }\n };\n Sidebar.prototype.setEnableRTL = function () {\n (this.enableRtl ? addClass : removeClass)([this.element], RTL);\n };\n Sidebar.prototype.setTarget = function () {\n this.targetEle = this.element.nextElementSibling;\n this.sidebarEleCopy = this.element.cloneNode(true);\n if (typeof (this.target) === 'string') {\n this.setProperties({ target: document.querySelector(this.target) }, true);\n }\n if (this.target) {\n this.target.insertBefore(this.element, this.target.children[0]);\n addClass([this.element], SIDEBARABSOLUTE);\n addClass([this.target], CONTEXT);\n this.targetEle = this.getTargetElement();\n }\n };\n Sidebar.prototype.getTargetElement = function () {\n var siblingElement = this.element.nextElementSibling;\n while (!isNOU(siblingElement)) {\n if (!siblingElement.classList.contains(ROOT)) {\n break;\n }\n siblingElement = siblingElement.nextElementSibling;\n }\n return siblingElement;\n };\n Sidebar.prototype.setCloseOnDocumentClick = function () {\n if (this.closeOnDocumentClick) {\n EventHandler.add(document, 'mousedown touchstart', this.documentclickHandler, this);\n }\n else {\n EventHandler.remove(document, 'mousedown touchstart', this.documentclickHandler);\n }\n };\n Sidebar.prototype.setWidth = function () {\n if (this.enableDock && this.position === 'Left') {\n setStyle(this.element, { 'width': this.setDimension(this.dockSize) });\n }\n else if (this.enableDock && this.position === 'Right') {\n setStyle(this.element, { 'width': this.setDimension(this.dockSize) });\n }\n else if (!this.enableDock) {\n setStyle(this.element, { 'width': this.setDimension(this.width) });\n }\n };\n Sidebar.prototype.setDimension = function (width) {\n if (typeof width === 'number') {\n width = formatUnit(width);\n }\n else if (typeof width === 'string') {\n width = (width.match(/px|%|em/)) ? width : formatUnit(width);\n }\n else {\n width = '100%';\n }\n return width;\n };\n Sidebar.prototype.setZindex = function () {\n setStyle(this.element, { 'z-index': '' + this.zIndex });\n };\n Sidebar.prototype.addClass = function () {\n if (this.element.tagName === 'EJS-SIDEBAR') {\n addClass([this.element], DISPLAY);\n }\n var classELement = document.querySelector('.e-main-content');\n if (!isNullOrUndefined(classELement || this.targetEle)) {\n addClass([classELement || this.targetEle], [MAINCONTENTANIMATION]);\n }\n this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : null;\n if (!this.enableDock && this.type !== 'Auto') {\n addClass([this.element], [VISIBILITY]);\n }\n removeClass([this.element], [OPEN, CLOSE, RIGHT, LEFT, SLIDE, PUSH, OVER]);\n this.element.classList.add(ROOT);\n addClass([this.element], (this.position === 'Right') ? RIGHT : LEFT);\n if (this.enableDock) {\n addClass([this.element], DOCKER);\n }\n if (!isNullOrUndefined(this.tabIndex)) {\n this.element.setAttribute('tabindex', this.tabIndex);\n }\n if (this.type === 'Auto' && !Browser.isDevice) {\n this.show();\n }\n else if (!this.isOpen) {\n addClass([this.element], [CLOSE, DISABLEANIMATION]);\n }\n };\n Sidebar.prototype.checkType = function (val) {\n if (!(this.type === 'Push' || this.type === 'Over' || this.type === 'Slide')) {\n this.type = 'Auto';\n }\n else {\n if (!this.element.classList.contains(CLOSE) && !val) {\n this.hide();\n }\n }\n };\n Sidebar.prototype.transitionEnd = function (e) {\n this.setDock();\n if (!isNullOrUndefined(e) && !this.firstRender) {\n this.triggerChange();\n }\n this.firstRender = false;\n EventHandler.remove(this.element, 'transitionend', this.transitionEnd);\n };\n Sidebar.prototype.destroyBackDrop = function () {\n var sibling = document.querySelector('.e-main-content') || this.targetEle;\n if (this.target && this.showBackdrop && sibling && !isNullOrUndefined(this.defaultBackdropDiv)) {\n removeClass([this.defaultBackdropDiv], DEFAULTBACKDROP);\n }\n else if (this.showBackdrop && this.modal) {\n this.modal.style.display = 'none';\n this.modal.outerHTML = '';\n this.modal = null;\n }\n };\n /* eslint-disable */\n /**\n * Hide the Sidebar component, if it is in an open state.\n *\n * @returns {void}\n *\n */\n Sidebar.prototype.hide = function (e) {\n var _this = this;\n var closeArguments = {\n model: this,\n element: this.element,\n cancel: false,\n isInteracted: !isNullOrUndefined(e),\n event: (e || null)\n };\n this.trigger('close', closeArguments, function (observedcloseArgs) {\n if (!observedcloseArgs.cancel) {\n if (_this.element.classList.contains(CLOSE)) {\n return;\n }\n if (_this.element.classList.contains(OPEN) && !_this.animate) {\n _this.triggerChange();\n }\n addClass([_this.element], CLOSE);\n removeClass([_this.element], OPEN);\n setStyle(_this.element, { 'width': formatUnit(_this.enableDock ? _this.dockSize : _this.width) });\n _this.setType(_this.type);\n var sibling = document.querySelector('.e-main-content') || _this.targetEle;\n if (!_this.enableDock && sibling) {\n sibling.style.transform = 'translateX(' + 0 + 'px)';\n sibling.style[_this.position === 'Left' ? 'marginLeft' : 'marginRight'] = '0px';\n }\n _this.destroyBackDrop();\n _this.setAnimation();\n if (_this.type === 'Slide') {\n document.body.classList.remove('e-sidebar-overflow');\n }\n _this.setProperties({ isOpen: false }, true);\n if (_this.enableDock) {\n setTimeout(function () { return _this.setTimeOut(); }, 50);\n }\n EventHandler.add(_this.element, 'transitionend', _this.transitionEnd, _this);\n }\n });\n };\n Sidebar.prototype.setTimeOut = function () {\n var sibling = document.querySelector('.e-main-content') || this.targetEle;\n var elementWidth = this.element.getBoundingClientRect().width;\n if (this.element.classList.contains(OPEN) && sibling && !(this.type === 'Over' && this.enableDock)) {\n if (this.position === 'Left') {\n sibling.style.marginLeft = this.setDimension(this.width === 'auto' ? elementWidth : this.width);\n }\n else {\n sibling.style.marginRight = this.setDimension(this.width === 'auto' ? elementWidth : this.width);\n }\n }\n else if (this.element.classList.contains(CLOSE) && sibling) {\n if (this.position === 'Left') {\n sibling.style.marginLeft = this.setDimension(this.dockSize === 'auto' ? elementWidth : this.dockSize);\n }\n else {\n sibling.style.marginRight = this.setDimension(this.dockSize === 'auto' ? elementWidth : this.dockSize);\n }\n }\n };\n /* eslint-disable */\n /**\n * Shows the Sidebar component, if it is in closed state.\n *\n * @returns {void}\n */\n Sidebar.prototype.show = function (e) {\n var _this = this;\n var openArguments = {\n model: this,\n element: this.element,\n cancel: false,\n isInteracted: !isNullOrUndefined(e),\n event: (e || null)\n };\n this.trigger('open', openArguments, function (observedopenArgs) {\n if (!observedopenArgs.cancel) {\n removeClass([_this.element], [VISIBILITY, DISABLEANIMATION]);\n if (_this.element.classList.contains(OPEN)) {\n return;\n }\n if (_this.element.classList.contains(CLOSE) && !_this.animate) {\n _this.triggerChange();\n }\n addClass([_this.element], [OPEN, TRASITION]);\n setStyle(_this.element, { 'transform': '' });\n removeClass([_this.element], CLOSE);\n setStyle(_this.element, { 'width': formatUnit(_this.width) });\n _this.setType(_this.type);\n _this.createBackDrop();\n _this.setAnimation();\n if (_this.type === 'Slide') {\n document.body.classList.add('e-sidebar-overflow');\n }\n _this.setProperties({ isOpen: true }, true);\n EventHandler.add(_this.element, 'transitionend', _this.transitionEnd, _this);\n }\n });\n };\n Sidebar.prototype.setAnimation = function () {\n if (this.animate) {\n removeClass([this.element], DISABLEANIMATION);\n }\n else {\n addClass([this.element], DISABLEANIMATION);\n }\n };\n Sidebar.prototype.triggerChange = function () {\n var changeArguments = { name: 'change', element: this.element };\n this.trigger('change', changeArguments);\n };\n Sidebar.prototype.setDock = function () {\n if (this.enableDock && this.position === 'Left' && !this.getState()) {\n setStyle(this.element, { 'transform': 'translateX(' + -100 + '%) translateX(' + this.setDimension(this.dockSize) + ')' });\n }\n else if (this.enableDock && this.position === 'Right' && !this.getState()) {\n setStyle(this.element, { 'transform': 'translateX(' + 100 + '%) translateX(' + '-' + this.setDimension(this.dockSize) + ')' });\n }\n if (this.element.classList.contains(CLOSE) && this.enableDock) {\n setStyle(this.element, { 'width': this.setDimension(this.dockSize) });\n }\n };\n Sidebar.prototype.createBackDrop = function () {\n if (this.target && this.showBackdrop && this.getState()) {\n var targetString = this.target;\n var sibling = document.querySelector('.e-main-content') || this.targetEle;\n this.defaultBackdropDiv = this.createElement('div');\n addClass([this.defaultBackdropDiv], DEFAULTBACKDROP);\n setStyle(this.defaultBackdropDiv, { height: targetString.style.height });\n sibling.appendChild(this.defaultBackdropDiv);\n }\n else if (this.showBackdrop && !this.modal && this.getState()) {\n this.modal = this.createElement('div');\n this.modal.className = DEFAULTBACKDROP;\n this.modal.style.display = 'block';\n document.body.appendChild(this.modal);\n }\n };\n Sidebar.prototype.getPersistData = function () {\n return this.addOnPersist(['type', 'position', 'isOpen']);\n };\n /**\n * Returns the current module name.\n *\n * @returns {string} - returns module name.\n * @private\n *\n */\n Sidebar.prototype.getModuleName = function () {\n return 'sidebar';\n };\n /**\n * Shows or hides the Sidebar based on the current state.\n *\n * @returns {void}\n */\n Sidebar.prototype.toggle = function () {\n if (this.element.classList.contains(OPEN)) {\n this.hide();\n }\n else {\n this.show();\n }\n };\n Sidebar.prototype.getState = function () {\n return this.element.classList.contains(OPEN) ? true : false;\n };\n Sidebar.prototype.setMediaQuery = function () {\n if (this.mediaQuery) {\n var media = false;\n if (typeof (this.mediaQuery) === 'string') {\n media = window.matchMedia(this.mediaQuery).matches;\n }\n else {\n media = (this.mediaQuery).matches;\n }\n if (media && this.windowWidth !== window.innerWidth) {\n this.show();\n }\n else if (this.getState() && this.windowWidth !== window.innerWidth) {\n this.hide();\n }\n }\n };\n Sidebar.prototype.resize = function () {\n if (this.type === 'Auto') {\n if (Browser.isDevice) {\n addClass([this.element], OVER);\n }\n else {\n addClass([this.element], PUSH);\n }\n }\n this.setMediaQuery();\n if (Browser.isDevice) {\n this.windowWidth = window.innerWidth;\n }\n };\n Sidebar.prototype.documentclickHandler = function (e) {\n if (closest(e.target, '.' + CONTROL + '' + '.' + ROOT)) {\n return;\n }\n this.hide(e);\n };\n Sidebar.prototype.enableGestureHandler = function (args) {\n if (!this.isOpen && this.position === 'Left' && args.swipeDirection === 'Right' &&\n (args.startX <= 20 && args.distanceX >= 50 && args.velocity >= 0.5)) {\n this.show();\n }\n else if (this.isOpen && this.position === 'Left' && args.swipeDirection === 'Left') {\n this.hide();\n }\n else if (this.isOpen && this.position === 'Right' && args.swipeDirection === 'Right') {\n this.hide();\n }\n else if (!this.isOpen && this.position === 'Right' && args.swipeDirection === 'Left'\n && (window.innerWidth - args.startX <= 20 && args.distanceX >= 50 && args.velocity >= 0.5)) {\n this.show();\n }\n };\n Sidebar.prototype.setEnableGestures = function () {\n if (this.enableGestures) {\n this.mainContentEle = new Touch(document.body, { swipe: this.enableGestureHandler.bind(this) });\n this.sidebarEle = new Touch(this.element, { swipe: this.enableGestureHandler.bind(this) });\n }\n else {\n if (this.mainContentEle && this.sidebarEle) {\n this.mainContentEle.destroy();\n this.sidebarEle.destroy();\n }\n }\n };\n Sidebar.prototype.wireEvents = function () {\n this.setEnableGestures();\n EventHandler.add(window, 'resize', this.resize, this);\n };\n Sidebar.prototype.unWireEvents = function () {\n EventHandler.remove(window, 'resize', this.resize);\n EventHandler.remove(document, 'mousedown touchstart', this.documentclickHandler);\n if (this.mainContentEle) {\n this.mainContentEle.destroy();\n }\n if (this.sidebarEle) {\n this.sidebarEle.destroy();\n }\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {SidebarModel} newProp - specifies newProp value.\n * @param {SidebarModel} oldProp - specifies oldProp value.\n * @returns {void}\n * @private\n *\n */\n Sidebar.prototype.onPropertyChanged = function (newProp, oldProp) {\n var sibling = document.querySelector('.e-main-content') || this.targetEle;\n var isRendered = this.isServerRendered;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'isOpen':\n if (this.isOpen) {\n this.show();\n }\n else {\n this.hide();\n }\n break;\n case 'width':\n this.setWidth();\n if (!this.getState()) {\n this.setDock();\n }\n break;\n case 'animate':\n this.setAnimation();\n break;\n case 'type':\n this.checkType(false);\n removeClass([this.element], [VISIBILITY]);\n this.addClass();\n addClass([this.element], this.type === 'Auto' ? (Browser.isDevice ? ['e-over'] :\n ['e-push']) : ['e-' + this.type.toLowerCase()]);\n break;\n case 'position':\n this.element.style.transform = '';\n this.setDock();\n if (sibling) {\n sibling.style[this.position === 'Left' ? 'marginRight' : 'marginLeft'] = '0px';\n }\n if (this.position === 'Right') {\n removeClass([this.element], LEFT);\n addClass([this.element], RIGHT);\n }\n else {\n removeClass([this.element], RIGHT);\n addClass([this.element], LEFT);\n }\n this.setType(this.type);\n break;\n case 'showBackdrop':\n if (this.showBackdrop) {\n this.createBackDrop();\n }\n else {\n if (this.modal) {\n this.modal.style.display = 'none';\n this.modal.outerHTML = '';\n this.modal = null;\n }\n }\n break;\n case 'target':\n if (typeof (this.target) === 'string') {\n this.setProperties({ target: document.querySelector(this.target) }, true);\n }\n if (isNullOrUndefined(this.target)) {\n removeClass([this.element], SIDEBARABSOLUTE);\n removeClass([oldProp.target], CONTEXT);\n setStyle(sibling, { 'margin-left': 0, 'margin-right': 0 });\n document.body.insertAdjacentElement('afterbegin', this.element);\n }\n this.isServerRendered = false;\n _super.prototype.refresh.call(this);\n this.isServerRendered = isRendered;\n break;\n case 'closeOnDocumentClick':\n this.setCloseOnDocumentClick();\n break;\n case 'enableDock':\n if (!this.getState()) {\n this.setDock();\n }\n break;\n case 'zIndex':\n this.setZindex();\n break;\n case 'mediaQuery':\n this.setMediaQuery();\n break;\n case 'enableGestures':\n this.setEnableGestures();\n break;\n case 'enableRtl':\n this.setEnableRTL();\n break;\n }\n }\n };\n Sidebar.prototype.setType = function (type) {\n var elementWidth = this.element.getBoundingClientRect().width;\n this.setZindex();\n var sibling = document.querySelector('.e-main-content') || this.targetEle;\n if (sibling) {\n sibling.style.transform = 'translateX(' + 0 + 'px)';\n if (!Browser.isDevice && this.type !== 'Auto' && !(this.type === 'Over' && this.enableDock)) {\n sibling.style[this.position === 'Left' ? 'marginLeft' : 'marginRight'] = '0px';\n }\n }\n var margin = this.position === 'Left' ? elementWidth + 'px' : elementWidth + 'px';\n var eleWidth = this.position === 'Left' ? elementWidth : -(elementWidth);\n removeClass([this.element], [PUSH, OVER, SLIDE]);\n switch (type) {\n case 'Push':\n addClass([this.element], [PUSH]);\n if (sibling && (this.enableDock || this.element.classList.contains(OPEN))) {\n sibling.style[this.position === 'Left' ? 'marginLeft' : 'marginRight'] = margin;\n }\n break;\n case 'Slide':\n addClass([this.element], [SLIDE]);\n if (sibling && (this.enableDock || this.element.classList.contains(OPEN))) {\n sibling.style.transform = 'translateX(' + eleWidth + 'px)';\n }\n break;\n case 'Over':\n addClass([this.element], [OVER]);\n if (this.enableDock && (this.element.classList.contains(CLOSE) || this.isOpen)) {\n if (sibling) {\n sibling.style[this.position === 'Left' ? 'marginLeft' : 'marginRight'] = this.setDimension(this.dockSize);\n }\n }\n break;\n case 'Auto':\n addClass([this.element], [TRASITION]);\n if (Browser.isDevice) {\n if (sibling && (this.enableDock) && !this.getState()) {\n sibling.style[this.position === 'Left' ? 'marginLeft' : 'marginRight'] = margin;\n addClass([this.element], PUSH);\n }\n else {\n addClass([this.element], OVER);\n }\n }\n else {\n addClass([this.element], PUSH);\n if (sibling && (this.enableDock || this.element.classList.contains(OPEN))) {\n sibling.style[this.position === 'Left' ? 'marginLeft' : 'marginRight'] = margin;\n }\n }\n this.createBackDrop();\n }\n };\n /**\n * Removes the control from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.\n *\n * @returns {void}\n *\n */\n Sidebar.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n if (this.target) {\n removeClass([this.target], CONTEXT);\n }\n this.destroyBackDrop();\n if (this.element) {\n removeClass([this.element], [OPEN, CLOSE, PUSH, SLIDE, OVER, LEFT, RIGHT, TRASITION, DISABLEANIMATION]);\n removeClass([this.element], SIDEBARABSOLUTE);\n this.element.style.width = '';\n this.element.style.zIndex = '';\n this.element.style.transform = '';\n if (!isNullOrUndefined(this.sidebarEleCopy.getAttribute('tabindex'))) {\n this.element.setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.element.removeAttribute('tabindex');\n }\n }\n this.windowWidth = null;\n var sibling = document.querySelector('.e-main-content') || this.targetEle;\n if (!isNullOrUndefined(sibling)) {\n sibling.style.margin = '';\n sibling.style.transform = '';\n }\n this.unWireEvents();\n };\n __decorate([\n Property('auto')\n ], Sidebar.prototype, \"dockSize\", void 0);\n __decorate([\n Property(null)\n ], Sidebar.prototype, \"mediaQuery\", void 0);\n __decorate([\n Property(false)\n ], Sidebar.prototype, \"enableDock\", void 0);\n __decorate([\n Property('en-US')\n ], Sidebar.prototype, \"locale\", void 0);\n __decorate([\n Property(false)\n ], Sidebar.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(true)\n ], Sidebar.prototype, \"enableGestures\", void 0);\n __decorate([\n Property(false)\n ], Sidebar.prototype, \"isOpen\", void 0);\n __decorate([\n Property(false)\n ], Sidebar.prototype, \"enableRtl\", void 0);\n __decorate([\n Property(true)\n ], Sidebar.prototype, \"animate\", void 0);\n __decorate([\n Property('auto')\n ], Sidebar.prototype, \"height\", void 0);\n __decorate([\n Property(false)\n ], Sidebar.prototype, \"closeOnDocumentClick\", void 0);\n __decorate([\n Property('Left')\n ], Sidebar.prototype, \"position\", void 0);\n __decorate([\n Property(null)\n ], Sidebar.prototype, \"target\", void 0);\n __decorate([\n Property(false)\n ], Sidebar.prototype, \"showBackdrop\", void 0);\n __decorate([\n Property('Auto')\n ], Sidebar.prototype, \"type\", void 0);\n __decorate([\n Property('auto')\n ], Sidebar.prototype, \"width\", void 0);\n __decorate([\n Property(1000)\n ], Sidebar.prototype, \"zIndex\", void 0);\n __decorate([\n Event()\n ], Sidebar.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Sidebar.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], Sidebar.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], Sidebar.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], Sidebar.prototype, \"destroyed\", void 0);\n Sidebar = __decorate([\n NotifyPropertyChanges\n ], Sidebar);\n return Sidebar;\n}(Component));\nexport { Sidebar };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, Property, Event } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, isNullOrUndefined } from '@syncfusion/ej2-base';\n// Constant variables\nvar CLS_APPBAR = 'e-appbar';\nvar CLS_HORIZONTAL_BOTTOM = 'e-horizontal-bottom';\nvar CLS_STICKY = 'e-sticky';\nvar CLS_PROMINENT = 'e-prominent';\nvar CLS_DENSE = 'e-dense';\nvar CLS_RTL = 'e-rtl';\nvar CLS_LIGHT = 'e-light';\nvar CLS_DARK = 'e-dark';\nvar CLS_PRIMARY = 'e-primary';\nvar CLS_INHERIT = 'e-inherit';\n/**\n * The AppBar displays the information and actions related to the current application screen. It is used to show branding, screen titles, navigation, and actions.\n * Support to inherit colors from AppBar provided to Button, DropDownButton, Menu and TextBox.\n * Set CssClass property with e-inherit CSS class to inherit the background and color from AppBar.\n */\nvar AppBar = /** @class */ (function (_super) {\n __extends(AppBar, _super);\n /**\n * Constructor for creating the AppBar widget\n *\n * @param {AppBarModel} options Accepts the AppBar model properties to initiate the rendering\n * @param {string | HTMLElement} element Accepts the DOM element reference\n */\n function AppBar(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Removes the control from the DOM and also removes all its related events.\n *\n * @returns {void}\n */\n AppBar.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n this.element.classList.remove(CLS_APPBAR);\n this.element.removeAttribute('style');\n this.element.removeAttribute('role');\n };\n AppBar.prototype.getModuleName = function () {\n return 'appbar';\n };\n AppBar.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n AppBar.prototype.preRender = function () {\n // pre render code\n };\n AppBar.prototype.render = function () {\n this.element.classList.add(CLS_APPBAR);\n if (this.element.tagName !== 'HEADER') {\n this.element.setAttribute('role', 'header');\n }\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n if (this.position === 'Bottom') {\n this.element.classList.add(CLS_HORIZONTAL_BOTTOM);\n }\n if (this.isSticky) {\n this.element.classList.add(CLS_STICKY);\n }\n if (this.enableRtl) {\n this.element.classList.add(CLS_RTL);\n }\n this.setHeightMode();\n this.setColorMode();\n if (!isNullOrUndefined(this.htmlAttributes)) {\n this.setHtmlAttributes(this.htmlAttributes, this.element);\n }\n };\n AppBar.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'mode':\n removeClass([this.element], [CLS_DENSE, CLS_PROMINENT]);\n this.setHeightMode();\n break;\n case 'position':\n if (this.position === 'Bottom') {\n addClass([this.element], CLS_HORIZONTAL_BOTTOM);\n }\n else {\n removeClass([this.element], CLS_HORIZONTAL_BOTTOM);\n }\n break;\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([this.element], oldProp.cssClass.split(' '));\n }\n if (newProp.cssClass) {\n addClass([this.element], newProp.cssClass.split(' '));\n }\n break;\n case 'isSticky':\n if (this.isSticky) {\n addClass([this.element], CLS_STICKY);\n }\n else {\n removeClass([this.element], CLS_STICKY);\n }\n break;\n case 'htmlAttributes':\n if (!isNullOrUndefined(this.htmlAttributes)) {\n if (!isNullOrUndefined(oldProp.htmlAttributes)) {\n var keys = Object.keys(oldProp.htmlAttributes);\n for (var _b = 0, keys_1 = keys; _b < keys_1.length; _b++) {\n var key = keys_1[_b];\n if (key === 'class') {\n removeClass([this.element], oldProp.htmlAttributes[\"\" + key]);\n }\n else {\n this.element.removeAttribute(key);\n }\n }\n }\n this.setHtmlAttributes(newProp.htmlAttributes, this.element);\n }\n break;\n case 'colorMode':\n removeClass([this.element], [CLS_DARK, CLS_PRIMARY, CLS_INHERIT, CLS_LIGHT]);\n this.setColorMode();\n break;\n case 'enableRtl':\n if (this.enableRtl) {\n addClass([this.element], CLS_RTL);\n }\n else {\n removeClass([this.element], CLS_RTL);\n }\n break;\n }\n }\n };\n AppBar.prototype.setHtmlAttributes = function (attribute, element) {\n var keys = Object.keys(attribute);\n for (var _i = 0, keys_2 = keys; _i < keys_2.length; _i++) {\n var key = keys_2[_i];\n if (key === 'class') {\n addClass([element], attribute[\"\" + key]);\n }\n else {\n element.setAttribute(key, attribute[\"\" + key]);\n }\n }\n };\n AppBar.prototype.setHeightMode = function () {\n if (this.mode === 'Prominent') {\n this.element.classList.add(CLS_PROMINENT);\n }\n else if (this.mode === 'Dense') {\n this.element.classList.add(CLS_DENSE);\n }\n };\n AppBar.prototype.setColorMode = function () {\n switch (this.colorMode) {\n case 'Light':\n this.element.classList.add(CLS_LIGHT);\n break;\n case 'Dark':\n this.element.classList.add(CLS_DARK);\n break;\n case 'Primary':\n this.element.classList.add(CLS_PRIMARY);\n break;\n case 'Inherit':\n this.element.classList.add(CLS_INHERIT);\n break;\n }\n };\n __decorate([\n Property('Regular')\n ], AppBar.prototype, \"mode\", void 0);\n __decorate([\n Property('Top')\n ], AppBar.prototype, \"position\", void 0);\n __decorate([\n Property()\n ], AppBar.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], AppBar.prototype, \"isSticky\", void 0);\n __decorate([\n Property()\n ], AppBar.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property('Light')\n ], AppBar.prototype, \"colorMode\", void 0);\n __decorate([\n Event()\n ], AppBar.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], AppBar.prototype, \"destroyed\", void 0);\n AppBar = __decorate([\n NotifyPropertyChanges\n ], AppBar);\n return AppBar;\n}(Component));\nexport { AppBar };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { Tab } from '@syncfusion/ej2-navigations';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * Represents the React Tab Component.\n * ```html\n * \n * ```\n */\nvar TabComponent = /** @class */ (function (_super) {\n __extends(TabComponent, _super);\n function TabComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = false;\n _this.directivekeys = { 'tabItems': 'tabItem' };\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = false;\n _this.portals = [];\n return _this;\n }\n TabComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement('div', this.getDefaultAttributes(), [].concat(this.props.children, this.portals));\n }\n };\n return TabComponent;\n}(Tab));\nexport { TabComponent };\napplyMixins(TabComponent, [ComponentBase, React.Component]);\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { Sidebar } from '@syncfusion/ej2-navigations';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * `SidebarComponent` represents the Essential JS 2 React Sidebar Component.\n * ```ts\n * \n * ```\n */\nvar SidebarComponent = /** @class */ (function (_super) {\n __extends(SidebarComponent, _super);\n function SidebarComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = true;\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = true;\n _this.portals = [];\n return _this;\n }\n SidebarComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement('div', this.getDefaultAttributes(), [].concat(this.props.children, this.portals));\n }\n };\n return SidebarComponent;\n}(Sidebar));\nexport { SidebarComponent };\napplyMixins(SidebarComponent, [ComponentBase, React.Component]);\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { AppBar } from '@syncfusion/ej2-navigations';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * `AppBarComponent` represents the Essential JS 2 React AppBar Component.\n * ```ts\n * \n * ```\n */\nvar AppBarComponent = /** @class */ (function (_super) {\n __extends(AppBarComponent, _super);\n function AppBarComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = true;\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = true;\n _this.portals = [];\n return _this;\n }\n AppBarComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement('header', this.getDefaultAttributes(), [].concat(this.props.children, this.portals));\n }\n };\n return AppBarComponent;\n}(AppBar));\nexport { AppBarComponent };\napplyMixins(AppBarComponent, [ComponentBase, React.Component]);\n","function _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : {\n \"default\": obj\n };\n}\nmodule.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","export default function _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}","import _extends from \"@babel/runtime/helpers/esm/extends\";\n// https://github.com/sindresorhus/is-plain-obj/blob/main/index.js\nexport function isPlainObject(item) {\n if (typeof item !== 'object' || item === null) {\n return false;\n }\n const prototype = Object.getPrototypeOf(item);\n return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in item) && !(Symbol.iterator in item);\n}\nfunction deepClone(source) {\n if (!isPlainObject(source)) {\n return source;\n }\n const output = {};\n Object.keys(source).forEach(key => {\n output[key] = deepClone(source[key]);\n });\n return output;\n}\nexport default function deepmerge(target, source, options = {\n clone: true\n}) {\n const output = options.clone ? _extends({}, target) : target;\n if (isPlainObject(target) && isPlainObject(source)) {\n Object.keys(source).forEach(key => {\n // Avoid prototype pollution\n if (key === '__proto__') {\n return;\n }\n if (isPlainObject(source[key]) && key in target && isPlainObject(target[key])) {\n // Since `output` is a clone of `target` and we have narrowed `target` in this block we can cast to the same type.\n output[key] = deepmerge(target[key], source[key], options);\n } else if (options.clone) {\n output[key] = isPlainObject(source[key]) ? deepClone(source[key]) : source[key];\n } else {\n output[key] = source[key];\n }\n });\n }\n return output;\n}","/**\n * WARNING: Don't import this directly.\n * Use `MuiError` from `@mui/internal-babel-macros/MuiError.macro` instead.\n * @param {number} code\n */\nexport default function formatMuiErrorMessage(code) {\n // Apply babel-plugin-transform-template-literals in loose mode\n // loose mode is safe if we're concatenating primitives\n // see https://babeljs.io/docs/en/babel-plugin-transform-template-literals#loose\n /* eslint-disable prefer-template */\n let url = 'https://mui.com/production-error/?code=' + code;\n for (let i = 1; i < arguments.length; i += 1) {\n // rest params over-transpile for this case\n // eslint-disable-next-line prefer-rest-params\n url += '&args[]=' + encodeURIComponent(arguments[i]);\n }\n return 'Minified MUI error #' + code + '; visit ' + url + ' for the full message.';\n /* eslint-enable prefer-template */\n}","/**\n * @license React\n * react-is.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use strict';var b=Symbol.for(\"react.element\"),c=Symbol.for(\"react.portal\"),d=Symbol.for(\"react.fragment\"),e=Symbol.for(\"react.strict_mode\"),f=Symbol.for(\"react.profiler\"),g=Symbol.for(\"react.provider\"),h=Symbol.for(\"react.context\"),k=Symbol.for(\"react.server_context\"),l=Symbol.for(\"react.forward_ref\"),m=Symbol.for(\"react.suspense\"),n=Symbol.for(\"react.suspense_list\"),p=Symbol.for(\"react.memo\"),q=Symbol.for(\"react.lazy\"),t=Symbol.for(\"react.offscreen\"),u;u=Symbol.for(\"react.module.reference\");\nfunction v(a){if(\"object\"===typeof a&&null!==a){var r=a.$$typeof;switch(r){case b:switch(a=a.type,a){case d:case f:case e:case m:case n:return a;default:switch(a=a&&a.$$typeof,a){case k:case h:case l:case q:case p:case g:return a;default:return r}}case c:return r}}}exports.ContextConsumer=h;exports.ContextProvider=g;exports.Element=b;exports.ForwardRef=l;exports.Fragment=d;exports.Lazy=q;exports.Memo=p;exports.Portal=c;exports.Profiler=f;exports.StrictMode=e;exports.Suspense=m;\nexports.SuspenseList=n;exports.isAsyncMode=function(){return!1};exports.isConcurrentMode=function(){return!1};exports.isContextConsumer=function(a){return v(a)===h};exports.isContextProvider=function(a){return v(a)===g};exports.isElement=function(a){return\"object\"===typeof a&&null!==a&&a.$$typeof===b};exports.isForwardRef=function(a){return v(a)===l};exports.isFragment=function(a){return v(a)===d};exports.isLazy=function(a){return v(a)===q};exports.isMemo=function(a){return v(a)===p};\nexports.isPortal=function(a){return v(a)===c};exports.isProfiler=function(a){return v(a)===f};exports.isStrictMode=function(a){return v(a)===e};exports.isSuspense=function(a){return v(a)===m};exports.isSuspenseList=function(a){return v(a)===n};\nexports.isValidElementType=function(a){return\"string\"===typeof a||\"function\"===typeof a||a===d||a===f||a===e||a===m||a===n||a===t||\"object\"===typeof a&&null!==a&&(a.$$typeof===q||a.$$typeof===p||a.$$typeof===g||a.$$typeof===h||a.$$typeof===l||a.$$typeof===u||void 0!==a.getModuleId)?!0:!1};exports.typeOf=v;\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n module.exports = require('./cjs/react-is.production.min.js');\n} else {\n module.exports = require('./cjs/react-is.development.js');\n}\n","import { ForwardRef, Memo } from 'react-is';\n\n// Simplified polyfill for IE11 support\n// https://github.com/JamesMGreene/Function.name/blob/58b314d4a983110c3682f1228f845d39ccca1817/Function.name.js#L3\nconst fnNameMatchRegex = /^\\s*function(?:\\s|\\s*\\/\\*.*\\*\\/\\s*)+([^(\\s/]*)\\s*/;\nexport function getFunctionName(fn) {\n const match = `${fn}`.match(fnNameMatchRegex);\n const name = match && match[1];\n return name || '';\n}\nfunction getFunctionComponentName(Component, fallback = '') {\n return Component.displayName || Component.name || getFunctionName(Component) || fallback;\n}\nfunction getWrappedName(outerType, innerType, wrapperName) {\n const functionName = getFunctionComponentName(innerType);\n return outerType.displayName || (functionName !== '' ? `${wrapperName}(${functionName})` : wrapperName);\n}\n\n/**\n * cherry-pick from\n * https://github.com/facebook/react/blob/769b1f270e1251d9dbdce0fcbd9e92e502d059b8/packages/shared/getComponentName.js\n * originally forked from recompose/getDisplayName with added IE11 support\n */\nexport default function getDisplayName(Component) {\n if (Component == null) {\n return undefined;\n }\n if (typeof Component === 'string') {\n return Component;\n }\n if (typeof Component === 'function') {\n return getFunctionComponentName(Component, 'Component');\n }\n\n // TypeScript can't have components as objects but they exist in the form of `memo` or `Suspense`\n if (typeof Component === 'object') {\n switch (Component.$$typeof) {\n case ForwardRef:\n return getWrappedName(Component, Component.render, 'ForwardRef');\n case Memo:\n return getWrappedName(Component, Component.type, 'memo');\n default:\n return undefined;\n }\n }\n return undefined;\n}","import _formatMuiErrorMessage from \"@mui/utils/formatMuiErrorMessage\";\n// It should to be noted that this function isn't equivalent to `text-transform: capitalize`.\n//\n// A strict capitalization should uppercase the first letter of each word in the sentence.\n// We only handle the first word.\nexport default function capitalize(string) {\n if (typeof string !== 'string') {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: \\`capitalize(string)\\` expects a string argument.` : _formatMuiErrorMessage(7));\n }\n return string.charAt(0).toUpperCase() + string.slice(1);\n}","/**\n * Safe chained function.\n *\n * Will only create a new function if needed,\n * otherwise will pass back existing functions or null.\n */\nexport default function createChainedFunction(...funcs) {\n return funcs.reduce((acc, func) => {\n if (func == null) {\n return acc;\n }\n return function chainedFunction(...args) {\n acc.apply(this, args);\n func.apply(this, args);\n };\n }, () => {});\n}","// Corresponds to 10 frames at 60 Hz.\n// A few bytes payload overhead when lodash/debounce is ~3 kB and debounce ~300 B.\nexport default function debounce(func, wait = 166) {\n let timeout;\n function debounced(...args) {\n const later = () => {\n // @ts-ignore\n func.apply(this, args);\n };\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n }\n debounced.clear = () => {\n clearTimeout(timeout);\n };\n return debounced;\n}","export default function deprecatedPropType(validator, reason) {\n if (process.env.NODE_ENV === 'production') {\n return () => null;\n }\n return (props, propName, componentName, location, propFullName) => {\n const componentNameSafe = componentName || '<>';\n const propFullNameSafe = propFullName || propName;\n if (typeof props[propName] !== 'undefined') {\n return new Error(`The ${location} \\`${propFullNameSafe}\\` of ` + `\\`${componentNameSafe}\\` is deprecated. ${reason}`);\n }\n return null;\n };\n}","import * as React from 'react';\nexport default function isMuiElement(element, muiNames) {\n var _muiName, _element$type;\n return /*#__PURE__*/React.isValidElement(element) && muiNames.indexOf( // For server components `muiName` is avaialble in element.type._payload.value.muiName\n // relevant info - https://github.com/facebook/react/blob/2807d781a08db8e9873687fccc25c0f12b4fb3d4/packages/react/src/ReactLazy.js#L45\n // eslint-disable-next-line no-underscore-dangle\n (_muiName = element.type.muiName) != null ? _muiName : (_element$type = element.type) == null || (_element$type = _element$type._payload) == null || (_element$type = _element$type.value) == null ? void 0 : _element$type.muiName) !== -1;\n}","export default function ownerDocument(node) {\n return node && node.ownerDocument || document;\n}","import ownerDocument from '../ownerDocument';\nexport default function ownerWindow(node) {\n const doc = ownerDocument(node);\n return doc.defaultView || window;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nexport default function requirePropFactory(componentNameInError, Component) {\n if (process.env.NODE_ENV === 'production') {\n return () => null;\n }\n\n // eslint-disable-next-line react/forbid-foreign-prop-types\n const prevPropTypes = Component ? _extends({}, Component.propTypes) : null;\n const requireProp = requiredProp => (props, propName, componentName, location, propFullName, ...args) => {\n const propFullNameSafe = propFullName || propName;\n const defaultTypeChecker = prevPropTypes == null ? void 0 : prevPropTypes[propFullNameSafe];\n if (defaultTypeChecker) {\n const typeCheckerResult = defaultTypeChecker(props, propName, componentName, location, propFullName, ...args);\n if (typeCheckerResult) {\n return typeCheckerResult;\n }\n }\n if (typeof props[propName] !== 'undefined' && !props[requiredProp]) {\n return new Error(`The prop \\`${propFullNameSafe}\\` of ` + `\\`${componentNameInError}\\` can only be used together with the \\`${requiredProp}\\` prop.`);\n }\n return null;\n };\n return requireProp;\n}","/**\n * TODO v5: consider making it private\n *\n * passes {value} to {ref}\n *\n * WARNING: Be sure to only call this inside a callback that is passed as a ref.\n * Otherwise, make sure to cleanup the previous {ref} if it changes. See\n * https://github.com/mui/material-ui/issues/13539\n *\n * Useful if you want to expose the ref of an inner component to the public API\n * while still using it inside the component.\n * @param ref A ref callback or ref object. If anything falsy, this is a no-op.\n */\nexport default function setRef(ref, value) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref) {\n ref.current = value;\n }\n}","'use client';\n\nimport * as React from 'react';\n\n/**\n * A version of `React.useLayoutEffect` that does not show a warning when server-side rendering.\n * This is useful for effects that are only needed for client-side rendering but not for SSR.\n *\n * Before you use this hook, make sure to read https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\n * and confirm it doesn't apply to your use-case.\n */\nconst useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\nexport default useEnhancedEffect;","'use client';\n\nimport * as React from 'react';\nlet globalId = 0;\nfunction useGlobalId(idOverride) {\n const [defaultId, setDefaultId] = React.useState(idOverride);\n const id = idOverride || defaultId;\n React.useEffect(() => {\n if (defaultId == null) {\n // Fallback to this default id when possible.\n // Use the incrementing value for client-side rendering only.\n // We can't use it server-side.\n // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem\n globalId += 1;\n setDefaultId(`mui-${globalId}`);\n }\n }, [defaultId]);\n return id;\n}\n\n// downstream bundlers may remove unnecessary concatenation, but won't remove toString call -- Workaround for https://github.com/webpack/webpack/issues/14814\nconst maybeReactUseId = React['useId'.toString()];\n/**\n *\n * @example
    \n * @param idOverride\n * @returns {string}\n */\nexport default function useId(idOverride) {\n if (maybeReactUseId !== undefined) {\n const reactId = maybeReactUseId();\n return idOverride != null ? idOverride : reactId;\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.\n return useGlobalId(idOverride);\n}","export default function unsupportedProp(props, propName, componentName, location, propFullName) {\n if (process.env.NODE_ENV === 'production') {\n return null;\n }\n const propFullNameSafe = propFullName || propName;\n if (typeof props[propName] !== 'undefined') {\n return new Error(`The prop \\`${propFullNameSafe}\\` is not supported. Please remove it.`);\n }\n return null;\n}","'use client';\n\n/* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */\nimport * as React from 'react';\nexport default function useControlled({\n controlled,\n default: defaultProp,\n name,\n state = 'value'\n}) {\n // isControlled is ignored in the hook dependency lists as it should never change.\n const {\n current: isControlled\n } = React.useRef(controlled !== undefined);\n const [valueState, setValue] = React.useState(defaultProp);\n const value = isControlled ? controlled : valueState;\n if (process.env.NODE_ENV !== 'production') {\n React.useEffect(() => {\n if (isControlled !== (controlled !== undefined)) {\n console.error([`MUI: A component is changing the ${isControlled ? '' : 'un'}controlled ${state} state of ${name} to be ${isControlled ? 'un' : ''}controlled.`, 'Elements should not switch from uncontrolled to controlled (or vice versa).', `Decide between using a controlled or uncontrolled ${name} ` + 'element for the lifetime of the component.', \"The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.\", 'More info: https://fb.me/react-controlled-components'].join('\\n'));\n }\n }, [state, name, controlled]);\n const {\n current: defaultValue\n } = React.useRef(defaultProp);\n React.useEffect(() => {\n if (!isControlled && defaultValue !== defaultProp) {\n console.error([`MUI: A component is changing the default ${state} state of an uncontrolled ${name} after being initialized. ` + `To suppress this warning opt to use a controlled ${name}.`].join('\\n'));\n }\n }, [JSON.stringify(defaultProp)]);\n }\n const setValueIfUncontrolled = React.useCallback(newValue => {\n if (!isControlled) {\n setValue(newValue);\n }\n }, []);\n return [value, setValueIfUncontrolled];\n}","'use client';\n\nimport * as React from 'react';\nimport useEnhancedEffect from '../useEnhancedEffect';\n\n/**\n * Inspired by https://github.com/facebook/react/issues/14099#issuecomment-440013892\n * See RFC in https://github.com/reactjs/rfcs/pull/220\n */\n\nfunction useEventCallback(fn) {\n const ref = React.useRef(fn);\n useEnhancedEffect(() => {\n ref.current = fn;\n });\n return React.useRef((...args) =>\n // @ts-expect-error hide `this`\n (0, ref.current)(...args)).current;\n}\nexport default useEventCallback;","'use client';\n\nimport * as React from 'react';\nimport setRef from '../setRef';\nexport default function useForkRef(...refs) {\n /**\n * This will create a new function if the refs passed to this hook change and are all defined.\n * This means react will call the old forkRef with `null` and the new forkRef\n * with the ref. Cleanup naturally emerges from this behavior.\n */\n return React.useMemo(() => {\n if (refs.every(ref => ref == null)) {\n return null;\n }\n return instance => {\n refs.forEach(ref => {\n setRef(ref, instance);\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, refs);\n}","'use client';\n\nimport useLazyRef from '../useLazyRef/useLazyRef';\nimport useOnMount from '../useOnMount/useOnMount';\nexport class Timeout {\n constructor() {\n this.currentId = null;\n this.clear = () => {\n if (this.currentId !== null) {\n clearTimeout(this.currentId);\n this.currentId = null;\n }\n };\n this.disposeEffect = () => {\n return this.clear;\n };\n }\n static create() {\n return new Timeout();\n }\n /**\n * Executes `fn` after `delay`, clearing any previously scheduled call.\n */\n start(delay, fn) {\n this.clear();\n this.currentId = setTimeout(() => {\n this.currentId = null;\n fn();\n }, delay);\n }\n}\nexport default function useTimeout() {\n const timeout = useLazyRef(Timeout.create).current;\n useOnMount(timeout.disposeEffect);\n return timeout;\n}","'use client';\n\n// based on https://github.com/WICG/focus-visible/blob/v4.1.5/src/focus-visible.js\nimport * as React from 'react';\nimport { Timeout } from '../useTimeout/useTimeout';\nlet hadKeyboardEvent = true;\nlet hadFocusVisibleRecently = false;\nconst hadFocusVisibleRecentlyTimeout = new Timeout();\nconst inputTypesWhitelist = {\n text: true,\n search: true,\n url: true,\n tel: true,\n email: true,\n password: true,\n number: true,\n date: true,\n month: true,\n week: true,\n time: true,\n datetime: true,\n 'datetime-local': true\n};\n\n/**\n * Computes whether the given element should automatically trigger the\n * `focus-visible` class being added, i.e. whether it should always match\n * `:focus-visible` when focused.\n * @param {Element} node\n * @returns {boolean}\n */\nfunction focusTriggersKeyboardModality(node) {\n const {\n type,\n tagName\n } = node;\n if (tagName === 'INPUT' && inputTypesWhitelist[type] && !node.readOnly) {\n return true;\n }\n if (tagName === 'TEXTAREA' && !node.readOnly) {\n return true;\n }\n if (node.isContentEditable) {\n return true;\n }\n return false;\n}\n\n/**\n * Keep track of our keyboard modality state with `hadKeyboardEvent`.\n * If the most recent user interaction was via the keyboard;\n * and the key press did not include a meta, alt/option, or control key;\n * then the modality is keyboard. Otherwise, the modality is not keyboard.\n * @param {KeyboardEvent} event\n */\nfunction handleKeyDown(event) {\n if (event.metaKey || event.altKey || event.ctrlKey) {\n return;\n }\n hadKeyboardEvent = true;\n}\n\n/**\n * If at any point a user clicks with a pointing device, ensure that we change\n * the modality away from keyboard.\n * This avoids the situation where a user presses a key on an already focused\n * element, and then clicks on a different element, focusing it with a\n * pointing device, while we still think we're in keyboard modality.\n */\nfunction handlePointerDown() {\n hadKeyboardEvent = false;\n}\nfunction handleVisibilityChange() {\n if (this.visibilityState === 'hidden') {\n // If the tab becomes active again, the browser will handle calling focus\n // on the element (Safari actually calls it twice).\n // If this tab change caused a blur on an element with focus-visible,\n // re-apply the class when the user switches back to the tab.\n if (hadFocusVisibleRecently) {\n hadKeyboardEvent = true;\n }\n }\n}\nfunction prepare(doc) {\n doc.addEventListener('keydown', handleKeyDown, true);\n doc.addEventListener('mousedown', handlePointerDown, true);\n doc.addEventListener('pointerdown', handlePointerDown, true);\n doc.addEventListener('touchstart', handlePointerDown, true);\n doc.addEventListener('visibilitychange', handleVisibilityChange, true);\n}\nexport function teardown(doc) {\n doc.removeEventListener('keydown', handleKeyDown, true);\n doc.removeEventListener('mousedown', handlePointerDown, true);\n doc.removeEventListener('pointerdown', handlePointerDown, true);\n doc.removeEventListener('touchstart', handlePointerDown, true);\n doc.removeEventListener('visibilitychange', handleVisibilityChange, true);\n}\nfunction isFocusVisible(event) {\n const {\n target\n } = event;\n try {\n return target.matches(':focus-visible');\n } catch (error) {\n // Browsers not implementing :focus-visible will throw a SyntaxError.\n // We use our own heuristic for those browsers.\n // Rethrow might be better if it's not the expected error but do we really\n // want to crash if focus-visible malfunctioned?\n }\n\n // No need for validFocusTarget check. The user does that by attaching it to\n // focusable events only.\n return hadKeyboardEvent || focusTriggersKeyboardModality(target);\n}\nexport default function useIsFocusVisible() {\n const ref = React.useCallback(node => {\n if (node != null) {\n prepare(node.ownerDocument);\n }\n }, []);\n const isFocusVisibleRef = React.useRef(false);\n\n /**\n * Should be called if a blur event is fired\n */\n function handleBlurVisible() {\n // checking against potential state variable does not suffice if we focus and blur synchronously.\n // React wouldn't have time to trigger a re-render so `focusVisible` would be stale.\n // Ideally we would adjust `isFocusVisible(event)` to look at `relatedTarget` for blur events.\n // This doesn't work in IE11 due to https://github.com/facebook/react/issues/3751\n // TODO: check again if React releases their internal changes to focus event handling (https://github.com/facebook/react/pull/19186).\n if (isFocusVisibleRef.current) {\n // To detect a tab/window switch, we look for a blur event followed\n // rapidly by a visibility change.\n // If we don't see a visibility change within 100ms, it's probably a\n // regular focus change.\n hadFocusVisibleRecently = true;\n hadFocusVisibleRecentlyTimeout.start(100, () => {\n hadFocusVisibleRecently = false;\n });\n isFocusVisibleRef.current = false;\n return true;\n }\n return false;\n }\n\n /**\n * Should be called if a blur event is fired\n */\n function handleFocusVisible(event) {\n if (isFocusVisible(event)) {\n isFocusVisibleRef.current = true;\n return true;\n }\n return false;\n }\n return {\n isFocusVisibleRef,\n onFocus: handleFocusVisible,\n onBlur: handleBlurVisible,\n ref\n };\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\n/**\n * Add keys, values of `defaultProps` that does not exist in `props`\n * @param {object} defaultProps\n * @param {object} props\n * @returns {object} resolved props\n */\nexport default function resolveProps(defaultProps, props) {\n const output = _extends({}, props);\n Object.keys(defaultProps).forEach(propName => {\n if (propName.toString().match(/^(components|slots)$/)) {\n output[propName] = _extends({}, defaultProps[propName], output[propName]);\n } else if (propName.toString().match(/^(componentsProps|slotProps)$/)) {\n const defaultSlotProps = defaultProps[propName] || {};\n const slotProps = props[propName];\n output[propName] = {};\n if (!slotProps || !Object.keys(slotProps)) {\n // Reduce the iteration if the slot props is empty\n output[propName] = defaultSlotProps;\n } else if (!defaultSlotProps || !Object.keys(defaultSlotProps)) {\n // Reduce the iteration if the default slot props is empty\n output[propName] = slotProps;\n } else {\n output[propName] = _extends({}, slotProps);\n Object.keys(defaultSlotProps).forEach(slotPropName => {\n output[propName][slotPropName] = resolveProps(defaultSlotProps[slotPropName], slotProps[slotPropName]);\n });\n }\n } else if (output[propName] === undefined) {\n output[propName] = defaultProps[propName];\n }\n });\n return output;\n}","export default function composeClasses(slots, getUtilityClass, classes = undefined) {\n const output = {};\n Object.keys(slots).forEach(\n // `Object.keys(slots)` can't be wider than `T` because we infer `T` from `slots`.\n // @ts-expect-error https://github.com/microsoft/TypeScript/pull/12253#issuecomment-263132208\n slot => {\n output[slot] = slots[slot].reduce((acc, key) => {\n if (key) {\n const utilityClass = getUtilityClass(key);\n if (utilityClass !== '') {\n acc.push(utilityClass);\n }\n if (classes && classes[key]) {\n acc.push(classes[key]);\n }\n }\n return acc;\n }, []).join(' ');\n });\n return output;\n}","const defaultGenerator = componentName => componentName;\nconst createClassNameGenerator = () => {\n let generate = defaultGenerator;\n return {\n configure(generator) {\n generate = generator;\n },\n generate(componentName) {\n return generate(componentName);\n },\n reset() {\n generate = defaultGenerator;\n }\n };\n};\nconst ClassNameGenerator = createClassNameGenerator();\nexport default ClassNameGenerator;","import ClassNameGenerator from '../ClassNameGenerator';\nexport const globalStateClasses = {\n active: 'active',\n checked: 'checked',\n completed: 'completed',\n disabled: 'disabled',\n error: 'error',\n expanded: 'expanded',\n focused: 'focused',\n focusVisible: 'focusVisible',\n open: 'open',\n readOnly: 'readOnly',\n required: 'required',\n selected: 'selected'\n};\nexport default function generateUtilityClass(componentName, slot, globalStatePrefix = 'Mui') {\n const globalStateClass = globalStateClasses[slot];\n return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator.generate(componentName)}-${slot}`;\n}\nexport function isGlobalState(slot) {\n return globalStateClasses[slot] !== undefined;\n}","import generateUtilityClass from '../generateUtilityClass';\nexport default function generateUtilityClasses(componentName, slots, globalStatePrefix = 'Mui') {\n const result = {};\n slots.forEach(slot => {\n result[slot] = generateUtilityClass(componentName, slot, globalStatePrefix);\n });\n return result;\n}","function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {\n return Math.max(min, Math.min(val, max));\n}\nexport default clamp;","export default function _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}","function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t {\n const breakpointsAsArray = Object.keys(values).map(key => ({\n key,\n val: values[key]\n })) || [];\n // Sort in ascending order\n breakpointsAsArray.sort((breakpoint1, breakpoint2) => breakpoint1.val - breakpoint2.val);\n return breakpointsAsArray.reduce((acc, obj) => {\n return _extends({}, acc, {\n [obj.key]: obj.val\n });\n }, {});\n};\n\n// Keep in mind that @media is inclusive by the CSS specification.\nexport default function createBreakpoints(breakpoints) {\n const {\n // The breakpoint **start** at this value.\n // For instance with the first breakpoint xs: [xs, sm).\n values = {\n xs: 0,\n // phone\n sm: 600,\n // tablet\n md: 900,\n // small laptop\n lg: 1200,\n // desktop\n xl: 1536 // large screen\n },\n unit = 'px',\n step = 5\n } = breakpoints,\n other = _objectWithoutPropertiesLoose(breakpoints, _excluded);\n const sortedValues = sortBreakpointsValues(values);\n const keys = Object.keys(sortedValues);\n function up(key) {\n const value = typeof values[key] === 'number' ? values[key] : key;\n return `@media (min-width:${value}${unit})`;\n }\n function down(key) {\n const value = typeof values[key] === 'number' ? values[key] : key;\n return `@media (max-width:${value - step / 100}${unit})`;\n }\n function between(start, end) {\n const endIndex = keys.indexOf(end);\n return `@media (min-width:${typeof values[start] === 'number' ? values[start] : start}${unit}) and ` + `(max-width:${(endIndex !== -1 && typeof values[keys[endIndex]] === 'number' ? values[keys[endIndex]] : end) - step / 100}${unit})`;\n }\n function only(key) {\n if (keys.indexOf(key) + 1 < keys.length) {\n return between(key, keys[keys.indexOf(key) + 1]);\n }\n return up(key);\n }\n function not(key) {\n // handle first and last key separately, for better readability\n const keyIndex = keys.indexOf(key);\n if (keyIndex === 0) {\n return up(keys[1]);\n }\n if (keyIndex === keys.length - 1) {\n return down(keys[keyIndex]);\n }\n return between(key, keys[keys.indexOf(key) + 1]).replace('@media', '@media not all and');\n }\n return _extends({\n keys,\n values: sortedValues,\n up,\n down,\n between,\n only,\n not,\n unit\n }, other);\n}","const shape = {\n borderRadius: 4\n};\nexport default shape;","import deepmerge from '@mui/utils/deepmerge';\nfunction merge(acc, item) {\n if (!item) {\n return acc;\n }\n return deepmerge(acc, item, {\n clone: false // No need to clone deep, it's way faster.\n });\n}\nexport default merge;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport PropTypes from 'prop-types';\nimport deepmerge from '@mui/utils/deepmerge';\nimport merge from './merge';\n\n// The breakpoint **start** at this value.\n// For instance with the first breakpoint xs: [xs, sm[.\nexport const values = {\n xs: 0,\n // phone\n sm: 600,\n // tablet\n md: 900,\n // small laptop\n lg: 1200,\n // desktop\n xl: 1536 // large screen\n};\nconst defaultBreakpoints = {\n // Sorted ASC by size. That's important.\n // It can't be configured as it's used statically for propTypes.\n keys: ['xs', 'sm', 'md', 'lg', 'xl'],\n up: key => `@media (min-width:${values[key]}px)`\n};\nexport function handleBreakpoints(props, propValue, styleFromPropValue) {\n const theme = props.theme || {};\n if (Array.isArray(propValue)) {\n const themeBreakpoints = theme.breakpoints || defaultBreakpoints;\n return propValue.reduce((acc, item, index) => {\n acc[themeBreakpoints.up(themeBreakpoints.keys[index])] = styleFromPropValue(propValue[index]);\n return acc;\n }, {});\n }\n if (typeof propValue === 'object') {\n const themeBreakpoints = theme.breakpoints || defaultBreakpoints;\n return Object.keys(propValue).reduce((acc, breakpoint) => {\n // key is breakpoint\n if (Object.keys(themeBreakpoints.values || values).indexOf(breakpoint) !== -1) {\n const mediaKey = themeBreakpoints.up(breakpoint);\n acc[mediaKey] = styleFromPropValue(propValue[breakpoint], breakpoint);\n } else {\n const cssKey = breakpoint;\n acc[cssKey] = propValue[cssKey];\n }\n return acc;\n }, {});\n }\n const output = styleFromPropValue(propValue);\n return output;\n}\nfunction breakpoints(styleFunction) {\n // false positive\n // eslint-disable-next-line react/function-component-definition\n const newStyleFunction = props => {\n const theme = props.theme || {};\n const base = styleFunction(props);\n const themeBreakpoints = theme.breakpoints || defaultBreakpoints;\n const extended = themeBreakpoints.keys.reduce((acc, key) => {\n if (props[key]) {\n acc = acc || {};\n acc[themeBreakpoints.up(key)] = styleFunction(_extends({\n theme\n }, props[key]));\n }\n return acc;\n }, null);\n return merge(base, extended);\n };\n newStyleFunction.propTypes = process.env.NODE_ENV !== 'production' ? _extends({}, styleFunction.propTypes, {\n xs: PropTypes.object,\n sm: PropTypes.object,\n md: PropTypes.object,\n lg: PropTypes.object,\n xl: PropTypes.object\n }) : {};\n newStyleFunction.filterProps = ['xs', 'sm', 'md', 'lg', 'xl', ...styleFunction.filterProps];\n return newStyleFunction;\n}\nexport function createEmptyBreakpointObject(breakpointsInput = {}) {\n var _breakpointsInput$key;\n const breakpointsInOrder = (_breakpointsInput$key = breakpointsInput.keys) == null ? void 0 : _breakpointsInput$key.reduce((acc, key) => {\n const breakpointStyleKey = breakpointsInput.up(key);\n acc[breakpointStyleKey] = {};\n return acc;\n }, {});\n return breakpointsInOrder || {};\n}\nexport function removeUnusedBreakpoints(breakpointKeys, style) {\n return breakpointKeys.reduce((acc, key) => {\n const breakpointOutput = acc[key];\n const isBreakpointUnused = !breakpointOutput || Object.keys(breakpointOutput).length === 0;\n if (isBreakpointUnused) {\n delete acc[key];\n }\n return acc;\n }, style);\n}\nexport function mergeBreakpointsInOrder(breakpointsInput, ...styles) {\n const emptyBreakpoints = createEmptyBreakpointObject(breakpointsInput);\n const mergedOutput = [emptyBreakpoints, ...styles].reduce((prev, next) => deepmerge(prev, next), {});\n return removeUnusedBreakpoints(Object.keys(emptyBreakpoints), mergedOutput);\n}\n\n// compute base for responsive values; e.g.,\n// [1,2,3] => {xs: true, sm: true, md: true}\n// {xs: 1, sm: 2, md: 3} => {xs: true, sm: true, md: true}\nexport function computeBreakpointsBase(breakpointValues, themeBreakpoints) {\n // fixed value\n if (typeof breakpointValues !== 'object') {\n return {};\n }\n const base = {};\n const breakpointsKeys = Object.keys(themeBreakpoints);\n if (Array.isArray(breakpointValues)) {\n breakpointsKeys.forEach((breakpoint, i) => {\n if (i < breakpointValues.length) {\n base[breakpoint] = true;\n }\n });\n } else {\n breakpointsKeys.forEach(breakpoint => {\n if (breakpointValues[breakpoint] != null) {\n base[breakpoint] = true;\n }\n });\n }\n return base;\n}\nexport function resolveBreakpointValues({\n values: breakpointValues,\n breakpoints: themeBreakpoints,\n base: customBase\n}) {\n const base = customBase || computeBreakpointsBase(breakpointValues, themeBreakpoints);\n const keys = Object.keys(base);\n if (keys.length === 0) {\n return breakpointValues;\n }\n let previous;\n return keys.reduce((acc, breakpoint, i) => {\n if (Array.isArray(breakpointValues)) {\n acc[breakpoint] = breakpointValues[i] != null ? breakpointValues[i] : breakpointValues[previous];\n previous = i;\n } else if (typeof breakpointValues === 'object') {\n acc[breakpoint] = breakpointValues[breakpoint] != null ? breakpointValues[breakpoint] : breakpointValues[previous];\n previous = breakpoint;\n } else {\n acc[breakpoint] = breakpointValues;\n }\n return acc;\n }, {});\n}\nexport default breakpoints;","import capitalize from '@mui/utils/capitalize';\nimport responsivePropType from './responsivePropType';\nimport { handleBreakpoints } from './breakpoints';\nexport function getPath(obj, path, checkVars = true) {\n if (!path || typeof path !== 'string') {\n return null;\n }\n\n // Check if CSS variables are used\n if (obj && obj.vars && checkVars) {\n const val = `vars.${path}`.split('.').reduce((acc, item) => acc && acc[item] ? acc[item] : null, obj);\n if (val != null) {\n return val;\n }\n }\n return path.split('.').reduce((acc, item) => {\n if (acc && acc[item] != null) {\n return acc[item];\n }\n return null;\n }, obj);\n}\nexport function getStyleValue(themeMapping, transform, propValueFinal, userValue = propValueFinal) {\n let value;\n if (typeof themeMapping === 'function') {\n value = themeMapping(propValueFinal);\n } else if (Array.isArray(themeMapping)) {\n value = themeMapping[propValueFinal] || userValue;\n } else {\n value = getPath(themeMapping, propValueFinal) || userValue;\n }\n if (transform) {\n value = transform(value, userValue, themeMapping);\n }\n return value;\n}\nfunction style(options) {\n const {\n prop,\n cssProperty = options.prop,\n themeKey,\n transform\n } = options;\n\n // false positive\n // eslint-disable-next-line react/function-component-definition\n const fn = props => {\n if (props[prop] == null) {\n return null;\n }\n const propValue = props[prop];\n const theme = props.theme;\n const themeMapping = getPath(theme, themeKey) || {};\n const styleFromPropValue = propValueFinal => {\n let value = getStyleValue(themeMapping, transform, propValueFinal);\n if (propValueFinal === value && typeof propValueFinal === 'string') {\n // Haven't found value\n value = getStyleValue(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);\n }\n if (cssProperty === false) {\n return value;\n }\n return {\n [cssProperty]: value\n };\n };\n return handleBreakpoints(props, propValue, styleFromPropValue);\n };\n fn.propTypes = process.env.NODE_ENV !== 'production' ? {\n [prop]: responsivePropType\n } : {};\n fn.filterProps = [prop];\n return fn;\n}\nexport default style;","export default function memoize(fn) {\n const cache = {};\n return arg => {\n if (cache[arg] === undefined) {\n cache[arg] = fn(arg);\n }\n return cache[arg];\n };\n}","import responsivePropType from './responsivePropType';\nimport { handleBreakpoints } from './breakpoints';\nimport { getPath } from './style';\nimport merge from './merge';\nimport memoize from './memoize';\nconst properties = {\n m: 'margin',\n p: 'padding'\n};\nconst directions = {\n t: 'Top',\n r: 'Right',\n b: 'Bottom',\n l: 'Left',\n x: ['Left', 'Right'],\n y: ['Top', 'Bottom']\n};\nconst aliases = {\n marginX: 'mx',\n marginY: 'my',\n paddingX: 'px',\n paddingY: 'py'\n};\n\n// memoize() impact:\n// From 300,000 ops/sec\n// To 350,000 ops/sec\nconst getCssProperties = memoize(prop => {\n // It's not a shorthand notation.\n if (prop.length > 2) {\n if (aliases[prop]) {\n prop = aliases[prop];\n } else {\n return [prop];\n }\n }\n const [a, b] = prop.split('');\n const property = properties[a];\n const direction = directions[b] || '';\n return Array.isArray(direction) ? direction.map(dir => property + dir) : [property + direction];\n});\nexport const marginKeys = ['m', 'mt', 'mr', 'mb', 'ml', 'mx', 'my', 'margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'marginX', 'marginY', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd'];\nexport const paddingKeys = ['p', 'pt', 'pr', 'pb', 'pl', 'px', 'py', 'padding', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'paddingX', 'paddingY', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd'];\nconst spacingKeys = [...marginKeys, ...paddingKeys];\nexport function createUnaryUnit(theme, themeKey, defaultValue, propName) {\n var _getPath;\n const themeSpacing = (_getPath = getPath(theme, themeKey, false)) != null ? _getPath : defaultValue;\n if (typeof themeSpacing === 'number') {\n return abs => {\n if (typeof abs === 'string') {\n return abs;\n }\n if (process.env.NODE_ENV !== 'production') {\n if (typeof abs !== 'number') {\n console.error(`MUI: Expected ${propName} argument to be a number or a string, got ${abs}.`);\n }\n }\n return themeSpacing * abs;\n };\n }\n if (Array.isArray(themeSpacing)) {\n return abs => {\n if (typeof abs === 'string') {\n return abs;\n }\n if (process.env.NODE_ENV !== 'production') {\n if (!Number.isInteger(abs)) {\n console.error([`MUI: The \\`theme.${themeKey}\\` array type cannot be combined with non integer values.` + `You should either use an integer value that can be used as index, or define the \\`theme.${themeKey}\\` as a number.`].join('\\n'));\n } else if (abs > themeSpacing.length - 1) {\n console.error([`MUI: The value provided (${abs}) overflows.`, `The supported values are: ${JSON.stringify(themeSpacing)}.`, `${abs} > ${themeSpacing.length - 1}, you need to add the missing values.`].join('\\n'));\n }\n }\n return themeSpacing[abs];\n };\n }\n if (typeof themeSpacing === 'function') {\n return themeSpacing;\n }\n if (process.env.NODE_ENV !== 'production') {\n console.error([`MUI: The \\`theme.${themeKey}\\` value (${themeSpacing}) is invalid.`, 'It should be a number, an array or a function.'].join('\\n'));\n }\n return () => undefined;\n}\nexport function createUnarySpacing(theme) {\n return createUnaryUnit(theme, 'spacing', 8, 'spacing');\n}\nexport function getValue(transformer, propValue) {\n if (typeof propValue === 'string' || propValue == null) {\n return propValue;\n }\n const abs = Math.abs(propValue);\n const transformed = transformer(abs);\n if (propValue >= 0) {\n return transformed;\n }\n if (typeof transformed === 'number') {\n return -transformed;\n }\n return `-${transformed}`;\n}\nexport function getStyleFromPropValue(cssProperties, transformer) {\n return propValue => cssProperties.reduce((acc, cssProperty) => {\n acc[cssProperty] = getValue(transformer, propValue);\n return acc;\n }, {});\n}\nfunction resolveCssProperty(props, keys, prop, transformer) {\n // Using a hash computation over an array iteration could be faster, but with only 28 items,\n // it's doesn't worth the bundle size.\n if (keys.indexOf(prop) === -1) {\n return null;\n }\n const cssProperties = getCssProperties(prop);\n const styleFromPropValue = getStyleFromPropValue(cssProperties, transformer);\n const propValue = props[prop];\n return handleBreakpoints(props, propValue, styleFromPropValue);\n}\nfunction style(props, keys) {\n const transformer = createUnarySpacing(props.theme);\n return Object.keys(props).map(prop => resolveCssProperty(props, keys, prop, transformer)).reduce(merge, {});\n}\nexport function margin(props) {\n return style(props, marginKeys);\n}\nmargin.propTypes = process.env.NODE_ENV !== 'production' ? marginKeys.reduce((obj, key) => {\n obj[key] = responsivePropType;\n return obj;\n}, {}) : {};\nmargin.filterProps = marginKeys;\nexport function padding(props) {\n return style(props, paddingKeys);\n}\npadding.propTypes = process.env.NODE_ENV !== 'production' ? paddingKeys.reduce((obj, key) => {\n obj[key] = responsivePropType;\n return obj;\n}, {}) : {};\npadding.filterProps = paddingKeys;\nfunction spacing(props) {\n return style(props, spacingKeys);\n}\nspacing.propTypes = process.env.NODE_ENV !== 'production' ? spacingKeys.reduce((obj, key) => {\n obj[key] = responsivePropType;\n return obj;\n}, {}) : {};\nspacing.filterProps = spacingKeys;\nexport default spacing;","import { createUnarySpacing } from '../spacing';\n\n// The different signatures imply different meaning for their arguments that can't be expressed structurally.\n// We express the difference with variable names.\n\nexport default function createSpacing(spacingInput = 8) {\n // Already transformed.\n if (spacingInput.mui) {\n return spacingInput;\n }\n\n // Material Design layouts are visually balanced. Most measurements align to an 8dp grid, which aligns both spacing and the overall layout.\n // Smaller components, such as icons, can align to a 4dp grid.\n // https://m2.material.io/design/layout/understanding-layout.html\n const transform = createUnarySpacing({\n spacing: spacingInput\n });\n const spacing = (...argsInput) => {\n if (process.env.NODE_ENV !== 'production') {\n if (!(argsInput.length <= 4)) {\n console.error(`MUI: Too many arguments provided, expected between 0 and 4, got ${argsInput.length}`);\n }\n }\n const args = argsInput.length === 0 ? [1] : argsInput;\n return args.map(argument => {\n const output = transform(argument);\n return typeof output === 'number' ? `${output}px` : output;\n }).join(' ');\n };\n spacing.mui = true;\n return spacing;\n}","import merge from './merge';\nfunction compose(...styles) {\n const handlers = styles.reduce((acc, style) => {\n style.filterProps.forEach(prop => {\n acc[prop] = style;\n });\n return acc;\n }, {});\n\n // false positive\n // eslint-disable-next-line react/function-component-definition\n const fn = props => {\n return Object.keys(props).reduce((acc, prop) => {\n if (handlers[prop]) {\n return merge(acc, handlers[prop](props));\n }\n return acc;\n }, {});\n };\n fn.propTypes = process.env.NODE_ENV !== 'production' ? styles.reduce((acc, style) => Object.assign(acc, style.propTypes), {}) : {};\n fn.filterProps = styles.reduce((acc, style) => acc.concat(style.filterProps), []);\n return fn;\n}\nexport default compose;","import responsivePropType from './responsivePropType';\nimport style from './style';\nimport compose from './compose';\nimport { createUnaryUnit, getValue } from './spacing';\nimport { handleBreakpoints } from './breakpoints';\nexport function borderTransform(value) {\n if (typeof value !== 'number') {\n return value;\n }\n return `${value}px solid`;\n}\nfunction createBorderStyle(prop, transform) {\n return style({\n prop,\n themeKey: 'borders',\n transform\n });\n}\nexport const border = createBorderStyle('border', borderTransform);\nexport const borderTop = createBorderStyle('borderTop', borderTransform);\nexport const borderRight = createBorderStyle('borderRight', borderTransform);\nexport const borderBottom = createBorderStyle('borderBottom', borderTransform);\nexport const borderLeft = createBorderStyle('borderLeft', borderTransform);\nexport const borderColor = createBorderStyle('borderColor');\nexport const borderTopColor = createBorderStyle('borderTopColor');\nexport const borderRightColor = createBorderStyle('borderRightColor');\nexport const borderBottomColor = createBorderStyle('borderBottomColor');\nexport const borderLeftColor = createBorderStyle('borderLeftColor');\nexport const outline = createBorderStyle('outline', borderTransform);\nexport const outlineColor = createBorderStyle('outlineColor');\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const borderRadius = props => {\n if (props.borderRadius !== undefined && props.borderRadius !== null) {\n const transformer = createUnaryUnit(props.theme, 'shape.borderRadius', 4, 'borderRadius');\n const styleFromPropValue = propValue => ({\n borderRadius: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.borderRadius, styleFromPropValue);\n }\n return null;\n};\nborderRadius.propTypes = process.env.NODE_ENV !== 'production' ? {\n borderRadius: responsivePropType\n} : {};\nborderRadius.filterProps = ['borderRadius'];\nconst borders = compose(border, borderTop, borderRight, borderBottom, borderLeft, borderColor, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor, borderRadius, outline, outlineColor);\nexport default borders;","import style from './style';\nimport compose from './compose';\nimport { createUnaryUnit, getValue } from './spacing';\nimport { handleBreakpoints } from './breakpoints';\nimport responsivePropType from './responsivePropType';\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const gap = props => {\n if (props.gap !== undefined && props.gap !== null) {\n const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'gap');\n const styleFromPropValue = propValue => ({\n gap: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.gap, styleFromPropValue);\n }\n return null;\n};\ngap.propTypes = process.env.NODE_ENV !== 'production' ? {\n gap: responsivePropType\n} : {};\ngap.filterProps = ['gap'];\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const columnGap = props => {\n if (props.columnGap !== undefined && props.columnGap !== null) {\n const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'columnGap');\n const styleFromPropValue = propValue => ({\n columnGap: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.columnGap, styleFromPropValue);\n }\n return null;\n};\ncolumnGap.propTypes = process.env.NODE_ENV !== 'production' ? {\n columnGap: responsivePropType\n} : {};\ncolumnGap.filterProps = ['columnGap'];\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const rowGap = props => {\n if (props.rowGap !== undefined && props.rowGap !== null) {\n const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'rowGap');\n const styleFromPropValue = propValue => ({\n rowGap: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.rowGap, styleFromPropValue);\n }\n return null;\n};\nrowGap.propTypes = process.env.NODE_ENV !== 'production' ? {\n rowGap: responsivePropType\n} : {};\nrowGap.filterProps = ['rowGap'];\nexport const gridColumn = style({\n prop: 'gridColumn'\n});\nexport const gridRow = style({\n prop: 'gridRow'\n});\nexport const gridAutoFlow = style({\n prop: 'gridAutoFlow'\n});\nexport const gridAutoColumns = style({\n prop: 'gridAutoColumns'\n});\nexport const gridAutoRows = style({\n prop: 'gridAutoRows'\n});\nexport const gridTemplateColumns = style({\n prop: 'gridTemplateColumns'\n});\nexport const gridTemplateRows = style({\n prop: 'gridTemplateRows'\n});\nexport const gridTemplateAreas = style({\n prop: 'gridTemplateAreas'\n});\nexport const gridArea = style({\n prop: 'gridArea'\n});\nconst grid = compose(gap, columnGap, rowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea);\nexport default grid;","import style from './style';\nimport compose from './compose';\nexport function paletteTransform(value, userValue) {\n if (userValue === 'grey') {\n return userValue;\n }\n return value;\n}\nexport const color = style({\n prop: 'color',\n themeKey: 'palette',\n transform: paletteTransform\n});\nexport const bgcolor = style({\n prop: 'bgcolor',\n cssProperty: 'backgroundColor',\n themeKey: 'palette',\n transform: paletteTransform\n});\nexport const backgroundColor = style({\n prop: 'backgroundColor',\n themeKey: 'palette',\n transform: paletteTransform\n});\nconst palette = compose(color, bgcolor, backgroundColor);\nexport default palette;","import style from './style';\nimport compose from './compose';\nimport { handleBreakpoints, values as breakpointsValues } from './breakpoints';\nexport function sizingTransform(value) {\n return value <= 1 && value !== 0 ? `${value * 100}%` : value;\n}\nexport const width = style({\n prop: 'width',\n transform: sizingTransform\n});\nexport const maxWidth = props => {\n if (props.maxWidth !== undefined && props.maxWidth !== null) {\n const styleFromPropValue = propValue => {\n var _props$theme, _props$theme2;\n const breakpoint = ((_props$theme = props.theme) == null || (_props$theme = _props$theme.breakpoints) == null || (_props$theme = _props$theme.values) == null ? void 0 : _props$theme[propValue]) || breakpointsValues[propValue];\n if (!breakpoint) {\n return {\n maxWidth: sizingTransform(propValue)\n };\n }\n if (((_props$theme2 = props.theme) == null || (_props$theme2 = _props$theme2.breakpoints) == null ? void 0 : _props$theme2.unit) !== 'px') {\n return {\n maxWidth: `${breakpoint}${props.theme.breakpoints.unit}`\n };\n }\n return {\n maxWidth: breakpoint\n };\n };\n return handleBreakpoints(props, props.maxWidth, styleFromPropValue);\n }\n return null;\n};\nmaxWidth.filterProps = ['maxWidth'];\nexport const minWidth = style({\n prop: 'minWidth',\n transform: sizingTransform\n});\nexport const height = style({\n prop: 'height',\n transform: sizingTransform\n});\nexport const maxHeight = style({\n prop: 'maxHeight',\n transform: sizingTransform\n});\nexport const minHeight = style({\n prop: 'minHeight',\n transform: sizingTransform\n});\nexport const sizeWidth = style({\n prop: 'size',\n cssProperty: 'width',\n transform: sizingTransform\n});\nexport const sizeHeight = style({\n prop: 'size',\n cssProperty: 'height',\n transform: sizingTransform\n});\nexport const boxSizing = style({\n prop: 'boxSizing'\n});\nconst sizing = compose(width, maxWidth, minWidth, height, maxHeight, minHeight, boxSizing);\nexport default sizing;","import { padding, margin } from '../spacing';\nimport { borderRadius, borderTransform } from '../borders';\nimport { gap, rowGap, columnGap } from '../cssGrid';\nimport { paletteTransform } from '../palette';\nimport { maxWidth, sizingTransform } from '../sizing';\nconst defaultSxConfig = {\n // borders\n border: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderTop: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderRight: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderBottom: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderLeft: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderColor: {\n themeKey: 'palette'\n },\n borderTopColor: {\n themeKey: 'palette'\n },\n borderRightColor: {\n themeKey: 'palette'\n },\n borderBottomColor: {\n themeKey: 'palette'\n },\n borderLeftColor: {\n themeKey: 'palette'\n },\n outline: {\n themeKey: 'borders',\n transform: borderTransform\n },\n outlineColor: {\n themeKey: 'palette'\n },\n borderRadius: {\n themeKey: 'shape.borderRadius',\n style: borderRadius\n },\n // palette\n color: {\n themeKey: 'palette',\n transform: paletteTransform\n },\n bgcolor: {\n themeKey: 'palette',\n cssProperty: 'backgroundColor',\n transform: paletteTransform\n },\n backgroundColor: {\n themeKey: 'palette',\n transform: paletteTransform\n },\n // spacing\n p: {\n style: padding\n },\n pt: {\n style: padding\n },\n pr: {\n style: padding\n },\n pb: {\n style: padding\n },\n pl: {\n style: padding\n },\n px: {\n style: padding\n },\n py: {\n style: padding\n },\n padding: {\n style: padding\n },\n paddingTop: {\n style: padding\n },\n paddingRight: {\n style: padding\n },\n paddingBottom: {\n style: padding\n },\n paddingLeft: {\n style: padding\n },\n paddingX: {\n style: padding\n },\n paddingY: {\n style: padding\n },\n paddingInline: {\n style: padding\n },\n paddingInlineStart: {\n style: padding\n },\n paddingInlineEnd: {\n style: padding\n },\n paddingBlock: {\n style: padding\n },\n paddingBlockStart: {\n style: padding\n },\n paddingBlockEnd: {\n style: padding\n },\n m: {\n style: margin\n },\n mt: {\n style: margin\n },\n mr: {\n style: margin\n },\n mb: {\n style: margin\n },\n ml: {\n style: margin\n },\n mx: {\n style: margin\n },\n my: {\n style: margin\n },\n margin: {\n style: margin\n },\n marginTop: {\n style: margin\n },\n marginRight: {\n style: margin\n },\n marginBottom: {\n style: margin\n },\n marginLeft: {\n style: margin\n },\n marginX: {\n style: margin\n },\n marginY: {\n style: margin\n },\n marginInline: {\n style: margin\n },\n marginInlineStart: {\n style: margin\n },\n marginInlineEnd: {\n style: margin\n },\n marginBlock: {\n style: margin\n },\n marginBlockStart: {\n style: margin\n },\n marginBlockEnd: {\n style: margin\n },\n // display\n displayPrint: {\n cssProperty: false,\n transform: value => ({\n '@media print': {\n display: value\n }\n })\n },\n display: {},\n overflow: {},\n textOverflow: {},\n visibility: {},\n whiteSpace: {},\n // flexbox\n flexBasis: {},\n flexDirection: {},\n flexWrap: {},\n justifyContent: {},\n alignItems: {},\n alignContent: {},\n order: {},\n flex: {},\n flexGrow: {},\n flexShrink: {},\n alignSelf: {},\n justifyItems: {},\n justifySelf: {},\n // grid\n gap: {\n style: gap\n },\n rowGap: {\n style: rowGap\n },\n columnGap: {\n style: columnGap\n },\n gridColumn: {},\n gridRow: {},\n gridAutoFlow: {},\n gridAutoColumns: {},\n gridAutoRows: {},\n gridTemplateColumns: {},\n gridTemplateRows: {},\n gridTemplateAreas: {},\n gridArea: {},\n // positions\n position: {},\n zIndex: {\n themeKey: 'zIndex'\n },\n top: {},\n right: {},\n bottom: {},\n left: {},\n // shadows\n boxShadow: {\n themeKey: 'shadows'\n },\n // sizing\n width: {\n transform: sizingTransform\n },\n maxWidth: {\n style: maxWidth\n },\n minWidth: {\n transform: sizingTransform\n },\n height: {\n transform: sizingTransform\n },\n maxHeight: {\n transform: sizingTransform\n },\n minHeight: {\n transform: sizingTransform\n },\n boxSizing: {},\n // typography\n fontFamily: {\n themeKey: 'typography'\n },\n fontSize: {\n themeKey: 'typography'\n },\n fontStyle: {\n themeKey: 'typography'\n },\n fontWeight: {\n themeKey: 'typography'\n },\n letterSpacing: {},\n textTransform: {},\n lineHeight: {},\n textAlign: {},\n typography: {\n cssProperty: false,\n themeKey: 'typography'\n }\n};\nexport default defaultSxConfig;","import capitalize from '@mui/utils/capitalize';\nimport merge from '../merge';\nimport { getPath, getStyleValue as getValue } from '../style';\nimport { handleBreakpoints, createEmptyBreakpointObject, removeUnusedBreakpoints } from '../breakpoints';\nimport defaultSxConfig from './defaultSxConfig';\nfunction objectsHaveSameKeys(...objects) {\n const allKeys = objects.reduce((keys, object) => keys.concat(Object.keys(object)), []);\n const union = new Set(allKeys);\n return objects.every(object => union.size === Object.keys(object).length);\n}\nfunction callIfFn(maybeFn, arg) {\n return typeof maybeFn === 'function' ? maybeFn(arg) : maybeFn;\n}\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function unstable_createStyleFunctionSx() {\n function getThemeValue(prop, val, theme, config) {\n const props = {\n [prop]: val,\n theme\n };\n const options = config[prop];\n if (!options) {\n return {\n [prop]: val\n };\n }\n const {\n cssProperty = prop,\n themeKey,\n transform,\n style\n } = options;\n if (val == null) {\n return null;\n }\n\n // TODO v6: remove, see https://github.com/mui/material-ui/pull/38123\n if (themeKey === 'typography' && val === 'inherit') {\n return {\n [prop]: val\n };\n }\n const themeMapping = getPath(theme, themeKey) || {};\n if (style) {\n return style(props);\n }\n const styleFromPropValue = propValueFinal => {\n let value = getValue(themeMapping, transform, propValueFinal);\n if (propValueFinal === value && typeof propValueFinal === 'string') {\n // Haven't found value\n value = getValue(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);\n }\n if (cssProperty === false) {\n return value;\n }\n return {\n [cssProperty]: value\n };\n };\n return handleBreakpoints(props, val, styleFromPropValue);\n }\n function styleFunctionSx(props) {\n var _theme$unstable_sxCon;\n const {\n sx,\n theme = {}\n } = props || {};\n if (!sx) {\n return null; // Emotion & styled-components will neglect null\n }\n const config = (_theme$unstable_sxCon = theme.unstable_sxConfig) != null ? _theme$unstable_sxCon : defaultSxConfig;\n\n /*\n * Receive `sxInput` as object or callback\n * and then recursively check keys & values to create media query object styles.\n * (the result will be used in `styled`)\n */\n function traverse(sxInput) {\n let sxObject = sxInput;\n if (typeof sxInput === 'function') {\n sxObject = sxInput(theme);\n } else if (typeof sxInput !== 'object') {\n // value\n return sxInput;\n }\n if (!sxObject) {\n return null;\n }\n const emptyBreakpoints = createEmptyBreakpointObject(theme.breakpoints);\n const breakpointsKeys = Object.keys(emptyBreakpoints);\n let css = emptyBreakpoints;\n Object.keys(sxObject).forEach(styleKey => {\n const value = callIfFn(sxObject[styleKey], theme);\n if (value !== null && value !== undefined) {\n if (typeof value === 'object') {\n if (config[styleKey]) {\n css = merge(css, getThemeValue(styleKey, value, theme, config));\n } else {\n const breakpointsValues = handleBreakpoints({\n theme\n }, value, x => ({\n [styleKey]: x\n }));\n if (objectsHaveSameKeys(breakpointsValues, value)) {\n css[styleKey] = styleFunctionSx({\n sx: value,\n theme\n });\n } else {\n css = merge(css, breakpointsValues);\n }\n }\n } else {\n css = merge(css, getThemeValue(styleKey, value, theme, config));\n }\n }\n });\n return removeUnusedBreakpoints(breakpointsKeys, css);\n }\n return Array.isArray(sx) ? sx.map(traverse) : traverse(sx);\n }\n return styleFunctionSx;\n}\nconst styleFunctionSx = unstable_createStyleFunctionSx();\nstyleFunctionSx.filterProps = ['sx'];\nexport default styleFunctionSx;","/**\n * A universal utility to style components with multiple color modes. Always use it from the theme object.\n * It works with:\n * - [Basic theme](https://mui.com/material-ui/customization/dark-mode/)\n * - [CSS theme variables](https://mui.com/material-ui/experimental-api/css-theme-variables/overview/)\n * - Zero-runtime engine\n *\n * Tips: Use an array over object spread and place `theme.applyStyles()` last.\n *\n * ✅ [{ background: '#e5e5e5' }, theme.applyStyles('dark', { background: '#1c1c1c' })]\n *\n * 🚫 { background: '#e5e5e5', ...theme.applyStyles('dark', { background: '#1c1c1c' })}\n *\n * @example\n * 1. using with `styled`:\n * ```jsx\n * const Component = styled('div')(({ theme }) => [\n * { background: '#e5e5e5' },\n * theme.applyStyles('dark', {\n * background: '#1c1c1c',\n * color: '#fff',\n * }),\n * ]);\n * ```\n *\n * @example\n * 2. using with `sx` prop:\n * ```jsx\n * [\n * { background: '#e5e5e5' },\n * theme.applyStyles('dark', {\n * background: '#1c1c1c',\n * color: '#fff',\n * }),\n * ]}\n * />\n * ```\n *\n * @example\n * 3. theming a component:\n * ```jsx\n * extendTheme({\n * components: {\n * MuiButton: {\n * styleOverrides: {\n * root: ({ theme }) => [\n * { background: '#e5e5e5' },\n * theme.applyStyles('dark', {\n * background: '#1c1c1c',\n * color: '#fff',\n * }),\n * ],\n * },\n * }\n * }\n * })\n *```\n */\nexport default function applyStyles(key, styles) {\n // @ts-expect-error this is 'any' type\n const theme = this;\n if (theme.vars && typeof theme.getColorSchemeSelector === 'function') {\n // If CssVarsProvider is used as a provider,\n // returns '* :where([data-mui-color-scheme=\"light|dark\"]) &'\n const selector = theme.getColorSchemeSelector(key).replace(/(\\[[^\\]]+\\])/, '*:where($1)');\n return {\n [selector]: styles\n };\n }\n if (theme.palette.mode === key) {\n return styles;\n }\n return {};\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"breakpoints\", \"palette\", \"spacing\", \"shape\"];\nimport deepmerge from '@mui/utils/deepmerge';\nimport createBreakpoints from './createBreakpoints';\nimport shape from './shape';\nimport createSpacing from './createSpacing';\nimport styleFunctionSx from '../styleFunctionSx/styleFunctionSx';\nimport defaultSxConfig from '../styleFunctionSx/defaultSxConfig';\nimport applyStyles from './applyStyles';\nfunction createTheme(options = {}, ...args) {\n const {\n breakpoints: breakpointsInput = {},\n palette: paletteInput = {},\n spacing: spacingInput,\n shape: shapeInput = {}\n } = options,\n other = _objectWithoutPropertiesLoose(options, _excluded);\n const breakpoints = createBreakpoints(breakpointsInput);\n const spacing = createSpacing(spacingInput);\n let muiTheme = deepmerge({\n breakpoints,\n direction: 'ltr',\n components: {},\n // Inject component definitions.\n palette: _extends({\n mode: 'light'\n }, paletteInput),\n spacing,\n shape: _extends({}, shape, shapeInput)\n }, other);\n muiTheme.applyStyles = applyStyles;\n muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);\n muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig, other == null ? void 0 : other.unstable_sxConfig);\n muiTheme.unstable_sx = function sx(props) {\n return styleFunctionSx({\n sx: props,\n theme: this\n });\n };\n return muiTheme;\n}\nexport default createTheme;","function memoize(fn) {\n var cache = Object.create(null);\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport { memoize as default };\n","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|disableRemotePlayback|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar isPropValid = /* #__PURE__ */memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport { isPropValid as default };\n","/*\n\nBased off glamor's StyleSheet, thanks Sunil ❤️\n\nhigh performance StyleSheet for css-in-js systems\n\n- uses multiple style tags behind the scenes for millions of rules\n- uses `insertRule` for appending in production for *much* faster performance\n\n// usage\n\nimport { StyleSheet } from '@emotion/sheet'\n\nlet styleSheet = new StyleSheet({ key: '', container: document.head })\n\nstyleSheet.insert('#box { border: 1px solid red; }')\n- appends a css rule into the stylesheet\n\nstyleSheet.flush()\n- empties the stylesheet of all its contents\n\n*/\n// $FlowFixMe\nfunction sheetForTag(tag) {\n if (tag.sheet) {\n // $FlowFixMe\n return tag.sheet;\n } // this weirdness brought to you by firefox\n\n /* istanbul ignore next */\n\n\n for (var i = 0; i < document.styleSheets.length; i++) {\n if (document.styleSheets[i].ownerNode === tag) {\n // $FlowFixMe\n return document.styleSheets[i];\n }\n }\n}\n\nfunction createStyleElement(options) {\n var tag = document.createElement('style');\n tag.setAttribute('data-emotion', options.key);\n\n if (options.nonce !== undefined) {\n tag.setAttribute('nonce', options.nonce);\n }\n\n tag.appendChild(document.createTextNode(''));\n tag.setAttribute('data-s', '');\n return tag;\n}\n\nvar StyleSheet = /*#__PURE__*/function () {\n // Using Node instead of HTMLElement since container may be a ShadowRoot\n function StyleSheet(options) {\n var _this = this;\n\n this._insertTag = function (tag) {\n var before;\n\n if (_this.tags.length === 0) {\n if (_this.insertionPoint) {\n before = _this.insertionPoint.nextSibling;\n } else if (_this.prepend) {\n before = _this.container.firstChild;\n } else {\n before = _this.before;\n }\n } else {\n before = _this.tags[_this.tags.length - 1].nextSibling;\n }\n\n _this.container.insertBefore(tag, before);\n\n _this.tags.push(tag);\n };\n\n this.isSpeedy = options.speedy === undefined ? process.env.NODE_ENV === 'production' : options.speedy;\n this.tags = [];\n this.ctr = 0;\n this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets\n\n this.key = options.key;\n this.container = options.container;\n this.prepend = options.prepend;\n this.insertionPoint = options.insertionPoint;\n this.before = null;\n }\n\n var _proto = StyleSheet.prototype;\n\n _proto.hydrate = function hydrate(nodes) {\n nodes.forEach(this._insertTag);\n };\n\n _proto.insert = function insert(rule) {\n // the max length is how many rules we have per style tag, it's 65000 in speedy mode\n // it's 1 in dev because we insert source maps that map a single rule to a location\n // and you can only have one source map per style tag\n if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {\n this._insertTag(createStyleElement(this));\n }\n\n var tag = this.tags[this.tags.length - 1];\n\n if (process.env.NODE_ENV !== 'production') {\n var isImportRule = rule.charCodeAt(0) === 64 && rule.charCodeAt(1) === 105;\n\n if (isImportRule && this._alreadyInsertedOrderInsensitiveRule) {\n // this would only cause problem in speedy mode\n // but we don't want enabling speedy to affect the observable behavior\n // so we report this error at all times\n console.error(\"You're attempting to insert the following rule:\\n\" + rule + '\\n\\n`@import` rules must be before all other types of rules in a stylesheet but other rules have already been inserted. Please ensure that `@import` rules are before all other rules.');\n }\n this._alreadyInsertedOrderInsensitiveRule = this._alreadyInsertedOrderInsensitiveRule || !isImportRule;\n }\n\n if (this.isSpeedy) {\n var sheet = sheetForTag(tag);\n\n try {\n // this is the ultrafast version, works across browsers\n // the big drawback is that the css won't be editable in devtools\n sheet.insertRule(rule, sheet.cssRules.length);\n } catch (e) {\n if (process.env.NODE_ENV !== 'production' && !/:(-moz-placeholder|-moz-focus-inner|-moz-focusring|-ms-input-placeholder|-moz-read-write|-moz-read-only|-ms-clear|-ms-expand|-ms-reveal){/.test(rule)) {\n console.error(\"There was a problem inserting the following rule: \\\"\" + rule + \"\\\"\", e);\n }\n }\n } else {\n tag.appendChild(document.createTextNode(rule));\n }\n\n this.ctr++;\n };\n\n _proto.flush = function flush() {\n // $FlowFixMe\n this.tags.forEach(function (tag) {\n return tag.parentNode && tag.parentNode.removeChild(tag);\n });\n this.tags = [];\n this.ctr = 0;\n\n if (process.env.NODE_ENV !== 'production') {\n this._alreadyInsertedOrderInsensitiveRule = false;\n }\n };\n\n return StyleSheet;\n}();\n\nexport { StyleSheet };\n","export var MS = '-ms-'\nexport var MOZ = '-moz-'\nexport var WEBKIT = '-webkit-'\n\nexport var COMMENT = 'comm'\nexport var RULESET = 'rule'\nexport var DECLARATION = 'decl'\n\nexport var PAGE = '@page'\nexport var MEDIA = '@media'\nexport var IMPORT = '@import'\nexport var CHARSET = '@charset'\nexport var VIEWPORT = '@viewport'\nexport var SUPPORTS = '@supports'\nexport var DOCUMENT = '@document'\nexport var NAMESPACE = '@namespace'\nexport var KEYFRAMES = '@keyframes'\nexport var FONT_FACE = '@font-face'\nexport var COUNTER_STYLE = '@counter-style'\nexport var FONT_FEATURE_VALUES = '@font-feature-values'\nexport var LAYER = '@layer'\n","/**\n * @param {number}\n * @return {number}\n */\nexport var abs = Math.abs\n\n/**\n * @param {number}\n * @return {string}\n */\nexport var from = String.fromCharCode\n\n/**\n * @param {object}\n * @return {object}\n */\nexport var assign = Object.assign\n\n/**\n * @param {string} value\n * @param {number} length\n * @return {number}\n */\nexport function hash (value, length) {\n\treturn charat(value, 0) ^ 45 ? (((((((length << 2) ^ charat(value, 0)) << 2) ^ charat(value, 1)) << 2) ^ charat(value, 2)) << 2) ^ charat(value, 3) : 0\n}\n\n/**\n * @param {string} value\n * @return {string}\n */\nexport function trim (value) {\n\treturn value.trim()\n}\n\n/**\n * @param {string} value\n * @param {RegExp} pattern\n * @return {string?}\n */\nexport function match (value, pattern) {\n\treturn (value = pattern.exec(value)) ? value[0] : value\n}\n\n/**\n * @param {string} value\n * @param {(string|RegExp)} pattern\n * @param {string} replacement\n * @return {string}\n */\nexport function replace (value, pattern, replacement) {\n\treturn value.replace(pattern, replacement)\n}\n\n/**\n * @param {string} value\n * @param {string} search\n * @return {number}\n */\nexport function indexof (value, search) {\n\treturn value.indexOf(search)\n}\n\n/**\n * @param {string} value\n * @param {number} index\n * @return {number}\n */\nexport function charat (value, index) {\n\treturn value.charCodeAt(index) | 0\n}\n\n/**\n * @param {string} value\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\nexport function substr (value, begin, end) {\n\treturn value.slice(begin, end)\n}\n\n/**\n * @param {string} value\n * @return {number}\n */\nexport function strlen (value) {\n\treturn value.length\n}\n\n/**\n * @param {any[]} value\n * @return {number}\n */\nexport function sizeof (value) {\n\treturn value.length\n}\n\n/**\n * @param {any} value\n * @param {any[]} array\n * @return {any}\n */\nexport function append (value, array) {\n\treturn array.push(value), value\n}\n\n/**\n * @param {string[]} array\n * @param {function} callback\n * @return {string}\n */\nexport function combine (array, callback) {\n\treturn array.map(callback).join('')\n}\n","import {from, trim, charat, strlen, substr, append, assign} from './Utility.js'\n\nexport var line = 1\nexport var column = 1\nexport var length = 0\nexport var position = 0\nexport var character = 0\nexport var characters = ''\n\n/**\n * @param {string} value\n * @param {object | null} root\n * @param {object | null} parent\n * @param {string} type\n * @param {string[] | string} props\n * @param {object[] | string} children\n * @param {number} length\n */\nexport function node (value, root, parent, type, props, children, length) {\n\treturn {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''}\n}\n\n/**\n * @param {object} root\n * @param {object} props\n * @return {object}\n */\nexport function copy (root, props) {\n\treturn assign(node('', null, null, '', null, null, 0), root, {length: -root.length}, props)\n}\n\n/**\n * @return {number}\n */\nexport function char () {\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function prev () {\n\tcharacter = position > 0 ? charat(characters, --position) : 0\n\n\tif (column--, character === 10)\n\t\tcolumn = 1, line--\n\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function next () {\n\tcharacter = position < length ? charat(characters, position++) : 0\n\n\tif (column++, character === 10)\n\t\tcolumn = 1, line++\n\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function peek () {\n\treturn charat(characters, position)\n}\n\n/**\n * @return {number}\n */\nexport function caret () {\n\treturn position\n}\n\n/**\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\nexport function slice (begin, end) {\n\treturn substr(characters, begin, end)\n}\n\n/**\n * @param {number} type\n * @return {number}\n */\nexport function token (type) {\n\tswitch (type) {\n\t\t// \\0 \\t \\n \\r \\s whitespace token\n\t\tcase 0: case 9: case 10: case 13: case 32:\n\t\t\treturn 5\n\t\t// ! + , / > @ ~ isolate token\n\t\tcase 33: case 43: case 44: case 47: case 62: case 64: case 126:\n\t\t// ; { } breakpoint token\n\t\tcase 59: case 123: case 125:\n\t\t\treturn 4\n\t\t// : accompanied token\n\t\tcase 58:\n\t\t\treturn 3\n\t\t// \" ' ( [ opening delimit token\n\t\tcase 34: case 39: case 40: case 91:\n\t\t\treturn 2\n\t\t// ) ] closing delimit token\n\t\tcase 41: case 93:\n\t\t\treturn 1\n\t}\n\n\treturn 0\n}\n\n/**\n * @param {string} value\n * @return {any[]}\n */\nexport function alloc (value) {\n\treturn line = column = 1, length = strlen(characters = value), position = 0, []\n}\n\n/**\n * @param {any} value\n * @return {any}\n */\nexport function dealloc (value) {\n\treturn characters = '', value\n}\n\n/**\n * @param {number} type\n * @return {string}\n */\nexport function delimit (type) {\n\treturn trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))\n}\n\n/**\n * @param {string} value\n * @return {string[]}\n */\nexport function tokenize (value) {\n\treturn dealloc(tokenizer(alloc(value)))\n}\n\n/**\n * @param {number} type\n * @return {string}\n */\nexport function whitespace (type) {\n\twhile (character = peek())\n\t\tif (character < 33)\n\t\t\tnext()\n\t\telse\n\t\t\tbreak\n\n\treturn token(type) > 2 || token(character) > 3 ? '' : ' '\n}\n\n/**\n * @param {string[]} children\n * @return {string[]}\n */\nexport function tokenizer (children) {\n\twhile (next())\n\t\tswitch (token(character)) {\n\t\t\tcase 0: append(identifier(position - 1), children)\n\t\t\t\tbreak\n\t\t\tcase 2: append(delimit(character), children)\n\t\t\t\tbreak\n\t\t\tdefault: append(from(character), children)\n\t\t}\n\n\treturn children\n}\n\n/**\n * @param {number} index\n * @param {number} count\n * @return {string}\n */\nexport function escaping (index, count) {\n\twhile (--count && next())\n\t\t// not 0-9 A-F a-f\n\t\tif (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))\n\t\t\tbreak\n\n\treturn slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))\n}\n\n/**\n * @param {number} type\n * @return {number}\n */\nexport function delimiter (type) {\n\twhile (next())\n\t\tswitch (character) {\n\t\t\t// ] ) \" '\n\t\t\tcase type:\n\t\t\t\treturn position\n\t\t\t// \" '\n\t\t\tcase 34: case 39:\n\t\t\t\tif (type !== 34 && type !== 39)\n\t\t\t\t\tdelimiter(character)\n\t\t\t\tbreak\n\t\t\t// (\n\t\t\tcase 40:\n\t\t\t\tif (type === 41)\n\t\t\t\t\tdelimiter(type)\n\t\t\t\tbreak\n\t\t\t// \\\n\t\t\tcase 92:\n\t\t\t\tnext()\n\t\t\t\tbreak\n\t\t}\n\n\treturn position\n}\n\n/**\n * @param {number} type\n * @param {number} index\n * @return {number}\n */\nexport function commenter (type, index) {\n\twhile (next())\n\t\t// //\n\t\tif (type + character === 47 + 10)\n\t\t\tbreak\n\t\t// /*\n\t\telse if (type + character === 42 + 42 && peek() === 47)\n\t\t\tbreak\n\n\treturn '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next())\n}\n\n/**\n * @param {number} index\n * @return {string}\n */\nexport function identifier (index) {\n\twhile (!token(peek()))\n\t\tnext()\n\n\treturn slice(index, position)\n}\n","import {COMMENT, RULESET, DECLARATION} from './Enum.js'\nimport {abs, charat, trim, from, sizeof, strlen, substr, append, replace, indexof} from './Utility.js'\nimport {node, char, prev, next, peek, caret, alloc, dealloc, delimit, whitespace, escaping, identifier, commenter} from './Tokenizer.js'\n\n/**\n * @param {string} value\n * @return {object[]}\n */\nexport function compile (value) {\n\treturn dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value))\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {string[]} rule\n * @param {string[]} rules\n * @param {string[]} rulesets\n * @param {number[]} pseudo\n * @param {number[]} points\n * @param {string[]} declarations\n * @return {object}\n */\nexport function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {\n\tvar index = 0\n\tvar offset = 0\n\tvar length = pseudo\n\tvar atrule = 0\n\tvar property = 0\n\tvar previous = 0\n\tvar variable = 1\n\tvar scanning = 1\n\tvar ampersand = 1\n\tvar character = 0\n\tvar type = ''\n\tvar props = rules\n\tvar children = rulesets\n\tvar reference = rule\n\tvar characters = type\n\n\twhile (scanning)\n\t\tswitch (previous = character, character = next()) {\n\t\t\t// (\n\t\t\tcase 40:\n\t\t\t\tif (previous != 108 && charat(characters, length - 1) == 58) {\n\t\t\t\t\tif (indexof(characters += replace(delimit(character), '&', '&\\f'), '&\\f') != -1)\n\t\t\t\t\t\tampersand = -1\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t// \" ' [\n\t\t\tcase 34: case 39: case 91:\n\t\t\t\tcharacters += delimit(character)\n\t\t\t\tbreak\n\t\t\t// \\t \\n \\r \\s\n\t\t\tcase 9: case 10: case 13: case 32:\n\t\t\t\tcharacters += whitespace(previous)\n\t\t\t\tbreak\n\t\t\t// \\\n\t\t\tcase 92:\n\t\t\t\tcharacters += escaping(caret() - 1, 7)\n\t\t\t\tcontinue\n\t\t\t// /\n\t\t\tcase 47:\n\t\t\t\tswitch (peek()) {\n\t\t\t\t\tcase 42: case 47:\n\t\t\t\t\t\tappend(comment(commenter(next(), caret()), root, parent), declarations)\n\t\t\t\t\t\tbreak\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tcharacters += '/'\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t// {\n\t\t\tcase 123 * variable:\n\t\t\t\tpoints[index++] = strlen(characters) * ampersand\n\t\t\t// } ; \\0\n\t\t\tcase 125 * variable: case 59: case 0:\n\t\t\t\tswitch (character) {\n\t\t\t\t\t// \\0 }\n\t\t\t\t\tcase 0: case 125: scanning = 0\n\t\t\t\t\t// ;\n\t\t\t\t\tcase 59 + offset: if (ampersand == -1) characters = replace(characters, /\\f/g, '')\n\t\t\t\t\t\tif (property > 0 && (strlen(characters) - length))\n\t\t\t\t\t\t\tappend(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// @ ;\n\t\t\t\t\tcase 59: characters += ';'\n\t\t\t\t\t// { rule/at-rule\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tappend(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets)\n\n\t\t\t\t\t\tif (character === 123)\n\t\t\t\t\t\t\tif (offset === 0)\n\t\t\t\t\t\t\t\tparse(characters, root, reference, reference, props, rulesets, length, points, children)\n\t\t\t\t\t\t\telse\n\t\t\t\t\t\t\t\tswitch (atrule === 99 && charat(characters, 3) === 110 ? 100 : atrule) {\n\t\t\t\t\t\t\t\t\t// d l m s\n\t\t\t\t\t\t\t\t\tcase 100: case 108: case 109: case 115:\n\t\t\t\t\t\t\t\t\t\tparse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children)\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\tparse(characters, reference, reference, reference, [''], children, 0, points, children)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tindex = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo\n\t\t\t\tbreak\n\t\t\t// :\n\t\t\tcase 58:\n\t\t\t\tlength = 1 + strlen(characters), property = previous\n\t\t\tdefault:\n\t\t\t\tif (variable < 1)\n\t\t\t\t\tif (character == 123)\n\t\t\t\t\t\t--variable\n\t\t\t\t\telse if (character == 125 && variable++ == 0 && prev() == 125)\n\t\t\t\t\t\tcontinue\n\n\t\t\t\tswitch (characters += from(character), character * variable) {\n\t\t\t\t\t// &\n\t\t\t\t\tcase 38:\n\t\t\t\t\t\tampersand = offset > 0 ? 1 : (characters += '\\f', -1)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// ,\n\t\t\t\t\tcase 44:\n\t\t\t\t\t\tpoints[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// @\n\t\t\t\t\tcase 64:\n\t\t\t\t\t\t// -\n\t\t\t\t\t\tif (peek() === 45)\n\t\t\t\t\t\t\tcharacters += delimit(next())\n\n\t\t\t\t\t\tatrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// -\n\t\t\t\t\tcase 45:\n\t\t\t\t\t\tif (previous === 45 && strlen(characters) == 2)\n\t\t\t\t\t\t\tvariable = 0\n\t\t\t\t}\n\t\t}\n\n\treturn rulesets\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} index\n * @param {number} offset\n * @param {string[]} rules\n * @param {number[]} points\n * @param {string} type\n * @param {string[]} props\n * @param {string[]} children\n * @param {number} length\n * @return {object}\n */\nexport function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) {\n\tvar post = offset - 1\n\tvar rule = offset === 0 ? rules : ['']\n\tvar size = sizeof(rule)\n\n\tfor (var i = 0, j = 0, k = 0; i < index; ++i)\n\t\tfor (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)\n\t\t\tif (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\\f/g, rule[x])))\n\t\t\t\tprops[k++] = z\n\n\treturn node(value, root, parent, offset === 0 ? RULESET : type, props, children, length)\n}\n\n/**\n * @param {number} value\n * @param {object} root\n * @param {object?} parent\n * @return {object}\n */\nexport function comment (value, root, parent) {\n\treturn node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0)\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} length\n * @return {object}\n */\nexport function declaration (value, root, parent, length) {\n\treturn node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length)\n}\n","import {IMPORT, LAYER, COMMENT, RULESET, DECLARATION, KEYFRAMES} from './Enum.js'\nimport {strlen, sizeof} from './Utility.js'\n\n/**\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\nexport function serialize (children, callback) {\n\tvar output = ''\n\tvar length = sizeof(children)\n\n\tfor (var i = 0; i < length; i++)\n\t\toutput += callback(children[i], i, children, callback) || ''\n\n\treturn output\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\nexport function stringify (element, index, children, callback) {\n\tswitch (element.type) {\n\t\tcase LAYER: if (element.children.length) break\n\t\tcase IMPORT: case DECLARATION: return element.return = element.return || element.value\n\t\tcase COMMENT: return ''\n\t\tcase KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'\n\t\tcase RULESET: element.value = element.props.join(',')\n\t}\n\n\treturn strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''\n}\n","import {MS, MOZ, WEBKIT, RULESET, KEYFRAMES, DECLARATION} from './Enum.js'\nimport {match, charat, substr, strlen, sizeof, replace, combine} from './Utility.js'\nimport {copy, tokenize} from './Tokenizer.js'\nimport {serialize} from './Serializer.js'\nimport {prefix} from './Prefixer.js'\n\n/**\n * @param {function[]} collection\n * @return {function}\n */\nexport function middleware (collection) {\n\tvar length = sizeof(collection)\n\n\treturn function (element, index, children, callback) {\n\t\tvar output = ''\n\n\t\tfor (var i = 0; i < length; i++)\n\t\t\toutput += collection[i](element, index, children, callback) || ''\n\n\t\treturn output\n\t}\n}\n\n/**\n * @param {function} callback\n * @return {function}\n */\nexport function rulesheet (callback) {\n\treturn function (element) {\n\t\tif (!element.root)\n\t\t\tif (element = element.return)\n\t\t\t\tcallback(element)\n\t}\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n */\nexport function prefixer (element, index, children, callback) {\n\tif (element.length > -1)\n\t\tif (!element.return)\n\t\t\tswitch (element.type) {\n\t\t\t\tcase DECLARATION: element.return = prefix(element.value, element.length, children)\n\t\t\t\t\treturn\n\t\t\t\tcase KEYFRAMES:\n\t\t\t\t\treturn serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback)\n\t\t\t\tcase RULESET:\n\t\t\t\t\tif (element.length)\n\t\t\t\t\t\treturn combine(element.props, function (value) {\n\t\t\t\t\t\t\tswitch (match(value, /(::plac\\w+|:read-\\w+)/)) {\n\t\t\t\t\t\t\t\t// :read-(only|write)\n\t\t\t\t\t\t\t\tcase ':read-only': case ':read-write':\n\t\t\t\t\t\t\t\t\treturn serialize([copy(element, {props: [replace(value, /:(read-\\w+)/, ':' + MOZ + '$1')]})], callback)\n\t\t\t\t\t\t\t\t// :placeholder\n\t\t\t\t\t\t\t\tcase '::placeholder':\n\t\t\t\t\t\t\t\t\treturn serialize([\n\t\t\t\t\t\t\t\t\t\tcopy(element, {props: [replace(value, /:(plac\\w+)/, ':' + WEBKIT + 'input-$1')]}),\n\t\t\t\t\t\t\t\t\t\tcopy(element, {props: [replace(value, /:(plac\\w+)/, ':' + MOZ + '$1')]}),\n\t\t\t\t\t\t\t\t\t\tcopy(element, {props: [replace(value, /:(plac\\w+)/, MS + 'input-$1')]})\n\t\t\t\t\t\t\t\t\t], callback)\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn ''\n\t\t\t\t\t\t})\n\t\t\t}\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n */\nexport function namespace (element) {\n\tswitch (element.type) {\n\t\tcase RULESET:\n\t\t\telement.props = element.props.map(function (value) {\n\t\t\t\treturn combine(tokenize(value), function (value, index, children) {\n\t\t\t\t\tswitch (charat(value, 0)) {\n\t\t\t\t\t\t// \\f\n\t\t\t\t\t\tcase 12:\n\t\t\t\t\t\t\treturn substr(value, 1, strlen(value))\n\t\t\t\t\t\t// \\0 ( + > ~\n\t\t\t\t\t\tcase 0: case 40: case 43: case 62: case 126:\n\t\t\t\t\t\t\treturn value\n\t\t\t\t\t\t// :\n\t\t\t\t\t\tcase 58:\n\t\t\t\t\t\t\tif (children[++index] === 'global')\n\t\t\t\t\t\t\t\tchildren[index] = '', children[++index] = '\\f' + substr(children[index], index = 1, -1)\n\t\t\t\t\t\t// \\s\n\t\t\t\t\t\tcase 32:\n\t\t\t\t\t\t\treturn index === 1 ? '' : value\n\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\tswitch (index) {\n\t\t\t\t\t\t\t\tcase 0: element = value\n\t\t\t\t\t\t\t\t\treturn sizeof(children) > 1 ? '' : value\n\t\t\t\t\t\t\t\tcase index = sizeof(children) - 1: case 2:\n\t\t\t\t\t\t\t\t\treturn index === 2 ? value + element + element : value + element\n\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\treturn value\n\t\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t})\n\t}\n}\n","import { StyleSheet } from '@emotion/sheet';\nimport { dealloc, alloc, next, token, from, peek, delimit, slice, position, RULESET, combine, match, serialize, copy, replace, WEBKIT, MOZ, MS, KEYFRAMES, DECLARATION, hash, charat, strlen, indexof, stringify, COMMENT, rulesheet, middleware, compile } from 'stylis';\nimport '@emotion/weak-memoize';\nimport '@emotion/memoize';\n\nvar identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) {\n var previous = 0;\n var character = 0;\n\n while (true) {\n previous = character;\n character = peek(); // &\\f\n\n if (previous === 38 && character === 12) {\n points[index] = 1;\n }\n\n if (token(character)) {\n break;\n }\n\n next();\n }\n\n return slice(begin, position);\n};\n\nvar toRules = function toRules(parsed, points) {\n // pretend we've started with a comma\n var index = -1;\n var character = 44;\n\n do {\n switch (token(character)) {\n case 0:\n // &\\f\n if (character === 38 && peek() === 12) {\n // this is not 100% correct, we don't account for literal sequences here - like for example quoted strings\n // stylis inserts \\f after & to know when & where it should replace this sequence with the context selector\n // and when it should just concatenate the outer and inner selectors\n // it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here\n points[index] = 1;\n }\n\n parsed[index] += identifierWithPointTracking(position - 1, points, index);\n break;\n\n case 2:\n parsed[index] += delimit(character);\n break;\n\n case 4:\n // comma\n if (character === 44) {\n // colon\n parsed[++index] = peek() === 58 ? '&\\f' : '';\n points[index] = parsed[index].length;\n break;\n }\n\n // fallthrough\n\n default:\n parsed[index] += from(character);\n }\n } while (character = next());\n\n return parsed;\n};\n\nvar getRules = function getRules(value, points) {\n return dealloc(toRules(alloc(value), points));\n}; // WeakSet would be more appropriate, but only WeakMap is supported in IE11\n\n\nvar fixedElements = /* #__PURE__ */new WeakMap();\nvar compat = function compat(element) {\n if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo\n // negative .length indicates that this rule has been already prefixed\n element.length < 1) {\n return;\n }\n\n var value = element.value,\n parent = element.parent;\n var isImplicitRule = element.column === parent.column && element.line === parent.line;\n\n while (parent.type !== 'rule') {\n parent = parent.parent;\n if (!parent) return;\n } // short-circuit for the simplest case\n\n\n if (element.props.length === 1 && value.charCodeAt(0) !== 58\n /* colon */\n && !fixedElements.get(parent)) {\n return;\n } // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level)\n // then the props has already been manipulated beforehand as they that array is shared between it and its \"rule parent\"\n\n\n if (isImplicitRule) {\n return;\n }\n\n fixedElements.set(element, true);\n var points = [];\n var rules = getRules(value, points);\n var parentRules = parent.props;\n\n for (var i = 0, k = 0; i < rules.length; i++) {\n for (var j = 0; j < parentRules.length; j++, k++) {\n element.props[k] = points[i] ? rules[i].replace(/&\\f/g, parentRules[j]) : parentRules[j] + \" \" + rules[i];\n }\n }\n};\nvar removeLabel = function removeLabel(element) {\n if (element.type === 'decl') {\n var value = element.value;\n\n if ( // charcode for l\n value.charCodeAt(0) === 108 && // charcode for b\n value.charCodeAt(2) === 98) {\n // this ignores label\n element[\"return\"] = '';\n element.value = '';\n }\n }\n};\nvar ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason';\n\nvar isIgnoringComment = function isIgnoringComment(element) {\n return element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1;\n};\n\nvar createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) {\n return function (element, index, children) {\n if (element.type !== 'rule' || cache.compat) return;\n var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g);\n\n if (unsafePseudoClasses) {\n var isNested = !!element.parent; // in nested rules comments become children of the \"auto-inserted\" rule and that's always the `element.parent`\n //\n // considering this input:\n // .a {\n // .b /* comm */ {}\n // color: hotpink;\n // }\n // we get output corresponding to this:\n // .a {\n // & {\n // /* comm */\n // color: hotpink;\n // }\n // .b {}\n // }\n\n var commentContainer = isNested ? element.parent.children : // global rule at the root level\n children;\n\n for (var i = commentContainer.length - 1; i >= 0; i--) {\n var node = commentContainer[i];\n\n if (node.line < element.line) {\n break;\n } // it is quite weird but comments are *usually* put at `column: element.column - 1`\n // so we seek *from the end* for the node that is earlier than the rule's `element` and check that\n // this will also match inputs like this:\n // .a {\n // /* comm */\n // .b {}\n // }\n //\n // but that is fine\n //\n // it would be the easiest to change the placement of the comment to be the first child of the rule:\n // .a {\n // .b { /* comm */ }\n // }\n // with such inputs we wouldn't have to search for the comment at all\n // TODO: consider changing this comment placement in the next major version\n\n\n if (node.column < element.column) {\n if (isIgnoringComment(node)) {\n return;\n }\n\n break;\n }\n }\n\n unsafePseudoClasses.forEach(function (unsafePseudoClass) {\n console.error(\"The pseudo class \\\"\" + unsafePseudoClass + \"\\\" is potentially unsafe when doing server-side rendering. Try changing it to \\\"\" + unsafePseudoClass.split('-child')[0] + \"-of-type\\\".\");\n });\n }\n };\n};\n\nvar isImportRule = function isImportRule(element) {\n return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64;\n};\n\nvar isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) {\n for (var i = index - 1; i >= 0; i--) {\n if (!isImportRule(children[i])) {\n return true;\n }\n }\n\n return false;\n}; // use this to remove incorrect elements from further processing\n// so they don't get handed to the `sheet` (or anything else)\n// as that could potentially lead to additional logs which in turn could be overhelming to the user\n\n\nvar nullifyElement = function nullifyElement(element) {\n element.type = '';\n element.value = '';\n element[\"return\"] = '';\n element.children = '';\n element.props = '';\n};\n\nvar incorrectImportAlarm = function incorrectImportAlarm(element, index, children) {\n if (!isImportRule(element)) {\n return;\n }\n\n if (element.parent) {\n console.error(\"`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles.\");\n nullifyElement(element);\n } else if (isPrependedWithRegularRules(index, children)) {\n console.error(\"`@import` rules can't be after other rules. Please put your `@import` rules before your other rules.\");\n nullifyElement(element);\n }\n};\n\n/* eslint-disable no-fallthrough */\n\nfunction prefix(value, length) {\n switch (hash(value, length)) {\n // color-adjust\n case 5103:\n return WEBKIT + 'print-' + value + value;\n // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)\n\n case 5737:\n case 4201:\n case 3177:\n case 3433:\n case 1641:\n case 4457:\n case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break\n\n case 5572:\n case 6356:\n case 5844:\n case 3191:\n case 6645:\n case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,\n\n case 6391:\n case 5879:\n case 5623:\n case 6135:\n case 4599:\n case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)\n\n case 4215:\n case 6389:\n case 5109:\n case 5365:\n case 5621:\n case 3829:\n return WEBKIT + value + value;\n // appearance, user-select, transform, hyphens, text-size-adjust\n\n case 5349:\n case 4246:\n case 4810:\n case 6968:\n case 2756:\n return WEBKIT + value + MOZ + value + MS + value + value;\n // flex, flex-direction\n\n case 6828:\n case 4268:\n return WEBKIT + value + MS + value + value;\n // order\n\n case 6165:\n return WEBKIT + value + MS + 'flex-' + value + value;\n // align-items\n\n case 5187:\n return WEBKIT + value + replace(value, /(\\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value;\n // align-self\n\n case 5443:\n return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/, '') + value;\n // align-content\n\n case 4675:\n return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/, '') + value;\n // flex-shrink\n\n case 5548:\n return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value;\n // flex-basis\n\n case 5292:\n return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value;\n // flex-grow\n\n case 6060:\n return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value;\n // transition\n\n case 4554:\n return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value;\n // cursor\n\n case 6187:\n return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value;\n // background, background-image\n\n case 5495:\n case 3959:\n return replace(value, /(image-set\\([^]*)/, WEBKIT + '$1' + '$`$1');\n // justify-content\n\n case 4968:\n return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value;\n // (margin|padding)-inline-(start|end)\n\n case 4095:\n case 3583:\n case 4068:\n case 2532:\n return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value;\n // (min|max)?(width|height|inline-size|block-size)\n\n case 8116:\n case 7059:\n case 5753:\n case 5535:\n case 5445:\n case 5701:\n case 4933:\n case 4677:\n case 5533:\n case 5789:\n case 5021:\n case 4765:\n // stretch, max-content, min-content, fill-available\n if (strlen(value) - 1 - length > 6) switch (charat(value, length + 1)) {\n // (m)ax-content, (m)in-content\n case 109:\n // -\n if (charat(value, length + 4) !== 45) break;\n // (f)ill-available, (f)it-content\n\n case 102:\n return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;\n // (s)tretch\n\n case 115:\n return ~indexof(value, 'stretch') ? prefix(replace(value, 'stretch', 'fill-available'), length) + value : value;\n }\n break;\n // position: sticky\n\n case 4949:\n // (s)ticky?\n if (charat(value, length + 1) !== 115) break;\n // display: (flex|inline-flex)\n\n case 6444:\n switch (charat(value, strlen(value) - 3 - (~indexof(value, '!important') && 10))) {\n // stic(k)y\n case 107:\n return replace(value, ':', ':' + WEBKIT) + value;\n // (inline-)?fl(e)x\n\n case 101:\n return replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value;\n }\n\n break;\n // writing-mode\n\n case 5936:\n switch (charat(value, length + 11)) {\n // vertical-l(r)\n case 114:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb') + value;\n // vertical-r(l)\n\n case 108:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb-rl') + value;\n // horizontal(-)tb\n\n case 45:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'lr') + value;\n }\n\n return WEBKIT + value + MS + value + value;\n }\n\n return value;\n}\n\nvar prefixer = function prefixer(element, index, children, callback) {\n if (element.length > -1) if (!element[\"return\"]) switch (element.type) {\n case DECLARATION:\n element[\"return\"] = prefix(element.value, element.length);\n break;\n\n case KEYFRAMES:\n return serialize([copy(element, {\n value: replace(element.value, '@', '@' + WEBKIT)\n })], callback);\n\n case RULESET:\n if (element.length) return combine(element.props, function (value) {\n switch (match(value, /(::plac\\w+|:read-\\w+)/)) {\n // :read-(only|write)\n case ':read-only':\n case ':read-write':\n return serialize([copy(element, {\n props: [replace(value, /:(read-\\w+)/, ':' + MOZ + '$1')]\n })], callback);\n // :placeholder\n\n case '::placeholder':\n return serialize([copy(element, {\n props: [replace(value, /:(plac\\w+)/, ':' + WEBKIT + 'input-$1')]\n }), copy(element, {\n props: [replace(value, /:(plac\\w+)/, ':' + MOZ + '$1')]\n }), copy(element, {\n props: [replace(value, /:(plac\\w+)/, MS + 'input-$1')]\n })], callback);\n }\n\n return '';\n });\n }\n};\n\nvar defaultStylisPlugins = [prefixer];\n\nvar createCache = function createCache(options) {\n var key = options.key;\n\n if (process.env.NODE_ENV !== 'production' && !key) {\n throw new Error(\"You have to configure `key` for your cache. Please make sure it's unique (and not equal to 'css') as it's used for linking styles to your cache.\\n\" + \"If multiple caches share the same key they might \\\"fight\\\" for each other's style elements.\");\n }\n\n if (key === 'css') {\n var ssrStyles = document.querySelectorAll(\"style[data-emotion]:not([data-s])\"); // get SSRed styles out of the way of React's hydration\n // document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be)\n // note this very very intentionally targets all style elements regardless of the key to ensure\n // that creating a cache works inside of render of a React component\n\n Array.prototype.forEach.call(ssrStyles, function (node) {\n // we want to only move elements which have a space in the data-emotion attribute value\n // because that indicates that it is an Emotion 11 server-side rendered style elements\n // while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector\n // Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes)\n // so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles\n // will not result in the Emotion 10 styles being destroyed\n var dataEmotionAttribute = node.getAttribute('data-emotion');\n\n if (dataEmotionAttribute.indexOf(' ') === -1) {\n return;\n }\n document.head.appendChild(node);\n node.setAttribute('data-s', '');\n });\n }\n\n var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;\n\n if (process.env.NODE_ENV !== 'production') {\n // $FlowFixMe\n if (/[^a-z-]/.test(key)) {\n throw new Error(\"Emotion key must only contain lower case alphabetical characters and - but \\\"\" + key + \"\\\" was passed\");\n }\n }\n\n var inserted = {};\n var container;\n var nodesToHydrate = [];\n\n {\n container = options.container || document.head;\n Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which\n // means that the style elements we're looking at are only Emotion 11 server-rendered style elements\n document.querySelectorAll(\"style[data-emotion^=\\\"\" + key + \" \\\"]\"), function (node) {\n var attrib = node.getAttribute(\"data-emotion\").split(' '); // $FlowFixMe\n\n for (var i = 1; i < attrib.length; i++) {\n inserted[attrib[i]] = true;\n }\n\n nodesToHydrate.push(node);\n });\n }\n\n var _insert;\n\n var omnipresentPlugins = [compat, removeLabel];\n\n if (process.env.NODE_ENV !== 'production') {\n omnipresentPlugins.push(createUnsafeSelectorsAlarm({\n get compat() {\n return cache.compat;\n }\n\n }), incorrectImportAlarm);\n }\n\n {\n var currentSheet;\n var finalizingPlugins = [stringify, process.env.NODE_ENV !== 'production' ? function (element) {\n if (!element.root) {\n if (element[\"return\"]) {\n currentSheet.insert(element[\"return\"]);\n } else if (element.value && element.type !== COMMENT) {\n // insert empty rule in non-production environments\n // so @emotion/jest can grab `key` from the (JS)DOM for caches without any rules inserted yet\n currentSheet.insert(element.value + \"{}\");\n }\n }\n } : rulesheet(function (rule) {\n currentSheet.insert(rule);\n })];\n var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));\n\n var stylis = function stylis(styles) {\n return serialize(compile(styles), serializer);\n };\n\n _insert = function insert(selector, serialized, sheet, shouldCache) {\n currentSheet = sheet;\n\n if (process.env.NODE_ENV !== 'production' && serialized.map !== undefined) {\n currentSheet = {\n insert: function insert(rule) {\n sheet.insert(rule + serialized.map);\n }\n };\n }\n\n stylis(selector ? selector + \"{\" + serialized.styles + \"}\" : serialized.styles);\n\n if (shouldCache) {\n cache.inserted[serialized.name] = true;\n }\n };\n }\n\n var cache = {\n key: key,\n sheet: new StyleSheet({\n key: key,\n container: container,\n nonce: options.nonce,\n speedy: options.speedy,\n prepend: options.prepend,\n insertionPoint: options.insertionPoint\n }),\n nonce: options.nonce,\n inserted: inserted,\n registered: {},\n insert: _insert\n };\n cache.sheet.hydrate(nodesToHydrate);\n return cache;\n};\n\nexport { createCache as default };\n","/** @license React v16.13.1\n * react-is.production.min.js\n *\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';var b=\"function\"===typeof Symbol&&Symbol.for,c=b?Symbol.for(\"react.element\"):60103,d=b?Symbol.for(\"react.portal\"):60106,e=b?Symbol.for(\"react.fragment\"):60107,f=b?Symbol.for(\"react.strict_mode\"):60108,g=b?Symbol.for(\"react.profiler\"):60114,h=b?Symbol.for(\"react.provider\"):60109,k=b?Symbol.for(\"react.context\"):60110,l=b?Symbol.for(\"react.async_mode\"):60111,m=b?Symbol.for(\"react.concurrent_mode\"):60111,n=b?Symbol.for(\"react.forward_ref\"):60112,p=b?Symbol.for(\"react.suspense\"):60113,q=b?\nSymbol.for(\"react.suspense_list\"):60120,r=b?Symbol.for(\"react.memo\"):60115,t=b?Symbol.for(\"react.lazy\"):60116,v=b?Symbol.for(\"react.block\"):60121,w=b?Symbol.for(\"react.fundamental\"):60117,x=b?Symbol.for(\"react.responder\"):60118,y=b?Symbol.for(\"react.scope\"):60119;\nfunction z(a){if(\"object\"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}exports.AsyncMode=l;exports.ConcurrentMode=m;exports.ContextConsumer=k;exports.ContextProvider=h;exports.Element=c;exports.ForwardRef=n;exports.Fragment=e;exports.Lazy=t;exports.Memo=r;exports.Portal=d;\nexports.Profiler=g;exports.StrictMode=f;exports.Suspense=p;exports.isAsyncMode=function(a){return A(a)||z(a)===l};exports.isConcurrentMode=A;exports.isContextConsumer=function(a){return z(a)===k};exports.isContextProvider=function(a){return z(a)===h};exports.isElement=function(a){return\"object\"===typeof a&&null!==a&&a.$$typeof===c};exports.isForwardRef=function(a){return z(a)===n};exports.isFragment=function(a){return z(a)===e};exports.isLazy=function(a){return z(a)===t};\nexports.isMemo=function(a){return z(a)===r};exports.isPortal=function(a){return z(a)===d};exports.isProfiler=function(a){return z(a)===g};exports.isStrictMode=function(a){return z(a)===f};exports.isSuspense=function(a){return z(a)===p};\nexports.isValidElementType=function(a){return\"string\"===typeof a||\"function\"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||\"object\"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};exports.typeOf=z;\n","'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n module.exports = require('./cjs/react-is.production.min.js');\n} else {\n module.exports = require('./cjs/react-is.development.js');\n}\n","'use strict';\n\nvar reactIs = require('react-is');\n\n/**\n * Copyright 2015, Yahoo! Inc.\n * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.\n */\nvar REACT_STATICS = {\n childContextTypes: true,\n contextType: true,\n contextTypes: true,\n defaultProps: true,\n displayName: true,\n getDefaultProps: true,\n getDerivedStateFromError: true,\n getDerivedStateFromProps: true,\n mixins: true,\n propTypes: true,\n type: true\n};\nvar KNOWN_STATICS = {\n name: true,\n length: true,\n prototype: true,\n caller: true,\n callee: true,\n arguments: true,\n arity: true\n};\nvar FORWARD_REF_STATICS = {\n '$$typeof': true,\n render: true,\n defaultProps: true,\n displayName: true,\n propTypes: true\n};\nvar MEMO_STATICS = {\n '$$typeof': true,\n compare: true,\n defaultProps: true,\n displayName: true,\n propTypes: true,\n type: true\n};\nvar TYPE_STATICS = {};\nTYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;\nTYPE_STATICS[reactIs.Memo] = MEMO_STATICS;\n\nfunction getStatics(component) {\n // React v16.11 and below\n if (reactIs.isMemo(component)) {\n return MEMO_STATICS;\n } // React v16.12 and above\n\n\n return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;\n}\n\nvar defineProperty = Object.defineProperty;\nvar getOwnPropertyNames = Object.getOwnPropertyNames;\nvar getOwnPropertySymbols = Object.getOwnPropertySymbols;\nvar getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;\nvar getPrototypeOf = Object.getPrototypeOf;\nvar objectPrototype = Object.prototype;\nfunction hoistNonReactStatics(targetComponent, sourceComponent, blacklist) {\n if (typeof sourceComponent !== 'string') {\n // don't hoist over string (html) components\n if (objectPrototype) {\n var inheritedComponent = getPrototypeOf(sourceComponent);\n\n if (inheritedComponent && inheritedComponent !== objectPrototype) {\n hoistNonReactStatics(targetComponent, inheritedComponent, blacklist);\n }\n }\n\n var keys = getOwnPropertyNames(sourceComponent);\n\n if (getOwnPropertySymbols) {\n keys = keys.concat(getOwnPropertySymbols(sourceComponent));\n }\n\n var targetStatics = getStatics(targetComponent);\n var sourceStatics = getStatics(sourceComponent);\n\n for (var i = 0; i < keys.length; ++i) {\n var key = keys[i];\n\n if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {\n var descriptor = getOwnPropertyDescriptor(sourceComponent, key);\n\n try {\n // Avoid failures from read-only properties\n defineProperty(targetComponent, key, descriptor);\n } catch (e) {}\n }\n }\n }\n\n return targetComponent;\n}\n\nmodule.exports = hoistNonReactStatics;\n","var isBrowser = \"object\" !== 'undefined';\nfunction getRegisteredStyles(registered, registeredStyles, classNames) {\n var rawClassName = '';\n classNames.split(' ').forEach(function (className) {\n if (registered[className] !== undefined) {\n registeredStyles.push(registered[className] + \";\");\n } else {\n rawClassName += className + \" \";\n }\n });\n return rawClassName;\n}\nvar registerStyles = function registerStyles(cache, serialized, isStringTag) {\n var className = cache.key + \"-\" + serialized.name;\n\n if ( // we only need to add the styles to the registered cache if the\n // class name could be used further down\n // the tree but if it's a string tag, we know it won't\n // so we don't have to add it to registered cache.\n // this improves memory usage since we can avoid storing the whole style string\n (isStringTag === false || // we need to always store it if we're in compat mode and\n // in node since emotion-server relies on whether a style is in\n // the registered cache to know whether a style is global or not\n // also, note that this check will be dead code eliminated in the browser\n isBrowser === false ) && cache.registered[className] === undefined) {\n cache.registered[className] = serialized.styles;\n }\n};\nvar insertStyles = function insertStyles(cache, serialized, isStringTag) {\n registerStyles(cache, serialized, isStringTag);\n var className = cache.key + \"-\" + serialized.name;\n\n if (cache.inserted[serialized.name] === undefined) {\n var current = serialized;\n\n do {\n cache.insert(serialized === current ? \".\" + className : '', current, cache.sheet, true);\n\n current = current.next;\n } while (current !== undefined);\n }\n};\n\nexport { getRegisteredStyles, insertStyles, registerStyles };\n","/* eslint-disable */\n// Inspired by https://github.com/garycourt/murmurhash-js\n// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86\nfunction murmur2(str) {\n // 'm' and 'r' are mixing constants generated offline.\n // They're not really 'magic', they just happen to work well.\n // const m = 0x5bd1e995;\n // const r = 24;\n // Initialize the hash\n var h = 0; // Mix 4 bytes at a time into the hash\n\n var k,\n i = 0,\n len = str.length;\n\n for (; len >= 4; ++i, len -= 4) {\n k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;\n k =\n /* Math.imul(k, m): */\n (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);\n k ^=\n /* k >>> r: */\n k >>> 24;\n h =\n /* Math.imul(k, m): */\n (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n } // Handle the last few bytes of the input array\n\n\n switch (len) {\n case 3:\n h ^= (str.charCodeAt(i + 2) & 0xff) << 16;\n\n case 2:\n h ^= (str.charCodeAt(i + 1) & 0xff) << 8;\n\n case 1:\n h ^= str.charCodeAt(i) & 0xff;\n h =\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n } // Do a few final mixes of the hash to ensure the last few\n // bytes are well-incorporated.\n\n\n h ^= h >>> 13;\n h =\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n return ((h ^ h >>> 15) >>> 0).toString(36);\n}\n\nexport { murmur2 as default };\n","var unitlessKeys = {\n animationIterationCount: 1,\n aspectRatio: 1,\n borderImageOutset: 1,\n borderImageSlice: 1,\n borderImageWidth: 1,\n boxFlex: 1,\n boxFlexGroup: 1,\n boxOrdinalGroup: 1,\n columnCount: 1,\n columns: 1,\n flex: 1,\n flexGrow: 1,\n flexPositive: 1,\n flexShrink: 1,\n flexNegative: 1,\n flexOrder: 1,\n gridRow: 1,\n gridRowEnd: 1,\n gridRowSpan: 1,\n gridRowStart: 1,\n gridColumn: 1,\n gridColumnEnd: 1,\n gridColumnSpan: 1,\n gridColumnStart: 1,\n msGridRow: 1,\n msGridRowSpan: 1,\n msGridColumn: 1,\n msGridColumnSpan: 1,\n fontWeight: 1,\n lineHeight: 1,\n opacity: 1,\n order: 1,\n orphans: 1,\n tabSize: 1,\n widows: 1,\n zIndex: 1,\n zoom: 1,\n WebkitLineClamp: 1,\n // SVG-related properties\n fillOpacity: 1,\n floodOpacity: 1,\n stopOpacity: 1,\n strokeDasharray: 1,\n strokeDashoffset: 1,\n strokeMiterlimit: 1,\n strokeOpacity: 1,\n strokeWidth: 1\n};\n\nexport { unitlessKeys as default };\n","import hashString from '@emotion/hash';\nimport unitless from '@emotion/unitless';\nimport memoize from '@emotion/memoize';\n\nvar ILLEGAL_ESCAPE_SEQUENCE_ERROR = \"You have illegal escape sequence in your template literal, most likely inside content's property value.\\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \\\"content: '\\\\00d7';\\\" should become \\\"content: '\\\\\\\\00d7';\\\".\\nYou can read more about this here:\\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences\";\nvar UNDEFINED_AS_OBJECT_KEY_ERROR = \"You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).\";\nvar hyphenateRegex = /[A-Z]|^ms/g;\nvar animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;\n\nvar isCustomProperty = function isCustomProperty(property) {\n return property.charCodeAt(1) === 45;\n};\n\nvar isProcessableValue = function isProcessableValue(value) {\n return value != null && typeof value !== 'boolean';\n};\n\nvar processStyleName = /* #__PURE__ */memoize(function (styleName) {\n return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();\n});\n\nvar processStyleValue = function processStyleValue(key, value) {\n switch (key) {\n case 'animation':\n case 'animationName':\n {\n if (typeof value === 'string') {\n return value.replace(animationRegex, function (match, p1, p2) {\n cursor = {\n name: p1,\n styles: p2,\n next: cursor\n };\n return p1;\n });\n }\n }\n }\n\n if (unitless[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {\n return value + 'px';\n }\n\n return value;\n};\n\nif (process.env.NODE_ENV !== 'production') {\n var contentValuePattern = /(var|attr|counters?|url|element|(((repeating-)?(linear|radial))|conic)-gradient)\\(|(no-)?(open|close)-quote/;\n var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset'];\n var oldProcessStyleValue = processStyleValue;\n var msPattern = /^-ms-/;\n var hyphenPattern = /-(.)/g;\n var hyphenatedCache = {};\n\n processStyleValue = function processStyleValue(key, value) {\n if (key === 'content') {\n if (typeof value !== 'string' || contentValues.indexOf(value) === -1 && !contentValuePattern.test(value) && (value.charAt(0) !== value.charAt(value.length - 1) || value.charAt(0) !== '\"' && value.charAt(0) !== \"'\")) {\n throw new Error(\"You seem to be using a value for 'content' without quotes, try replacing it with `content: '\\\"\" + value + \"\\\"'`\");\n }\n }\n\n var processed = oldProcessStyleValue(key, value);\n\n if (processed !== '' && !isCustomProperty(key) && key.indexOf('-') !== -1 && hyphenatedCache[key] === undefined) {\n hyphenatedCache[key] = true;\n console.error(\"Using kebab-case for css properties in objects is not supported. Did you mean \" + key.replace(msPattern, 'ms-').replace(hyphenPattern, function (str, _char) {\n return _char.toUpperCase();\n }) + \"?\");\n }\n\n return processed;\n };\n}\n\nvar noComponentSelectorMessage = 'Component selectors can only be used in conjunction with ' + '@emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware ' + 'compiler transform.';\n\nfunction handleInterpolation(mergedProps, registered, interpolation) {\n if (interpolation == null) {\n return '';\n }\n\n if (interpolation.__emotion_styles !== undefined) {\n if (process.env.NODE_ENV !== 'production' && interpolation.toString() === 'NO_COMPONENT_SELECTOR') {\n throw new Error(noComponentSelectorMessage);\n }\n\n return interpolation;\n }\n\n switch (typeof interpolation) {\n case 'boolean':\n {\n return '';\n }\n\n case 'object':\n {\n if (interpolation.anim === 1) {\n cursor = {\n name: interpolation.name,\n styles: interpolation.styles,\n next: cursor\n };\n return interpolation.name;\n }\n\n if (interpolation.styles !== undefined) {\n var next = interpolation.next;\n\n if (next !== undefined) {\n // not the most efficient thing ever but this is a pretty rare case\n // and there will be very few iterations of this generally\n while (next !== undefined) {\n cursor = {\n name: next.name,\n styles: next.styles,\n next: cursor\n };\n next = next.next;\n }\n }\n\n var styles = interpolation.styles + \";\";\n\n if (process.env.NODE_ENV !== 'production' && interpolation.map !== undefined) {\n styles += interpolation.map;\n }\n\n return styles;\n }\n\n return createStringFromObject(mergedProps, registered, interpolation);\n }\n\n case 'function':\n {\n if (mergedProps !== undefined) {\n var previousCursor = cursor;\n var result = interpolation(mergedProps);\n cursor = previousCursor;\n return handleInterpolation(mergedProps, registered, result);\n } else if (process.env.NODE_ENV !== 'production') {\n console.error('Functions that are interpolated in css calls will be stringified.\\n' + 'If you want to have a css call based on props, create a function that returns a css call like this\\n' + 'let dynamicStyle = (props) => css`color: ${props.color}`\\n' + 'It can be called directly with props or interpolated in a styled call like this\\n' + \"let SomeComponent = styled('div')`${dynamicStyle}`\");\n }\n\n break;\n }\n\n case 'string':\n if (process.env.NODE_ENV !== 'production') {\n var matched = [];\n var replaced = interpolation.replace(animationRegex, function (match, p1, p2) {\n var fakeVarName = \"animation\" + matched.length;\n matched.push(\"const \" + fakeVarName + \" = keyframes`\" + p2.replace(/^@keyframes animation-\\w+/, '') + \"`\");\n return \"${\" + fakeVarName + \"}\";\n });\n\n if (matched.length) {\n console.error('`keyframes` output got interpolated into plain string, please wrap it with `css`.\\n\\n' + 'Instead of doing this:\\n\\n' + [].concat(matched, [\"`\" + replaced + \"`\"]).join('\\n') + '\\n\\nYou should wrap it with `css` like this:\\n\\n' + (\"css`\" + replaced + \"`\"));\n }\n }\n\n break;\n } // finalize string values (regular strings and functions interpolated into css calls)\n\n\n if (registered == null) {\n return interpolation;\n }\n\n var cached = registered[interpolation];\n return cached !== undefined ? cached : interpolation;\n}\n\nfunction createStringFromObject(mergedProps, registered, obj) {\n var string = '';\n\n if (Array.isArray(obj)) {\n for (var i = 0; i < obj.length; i++) {\n string += handleInterpolation(mergedProps, registered, obj[i]) + \";\";\n }\n } else {\n for (var _key in obj) {\n var value = obj[_key];\n\n if (typeof value !== 'object') {\n if (registered != null && registered[value] !== undefined) {\n string += _key + \"{\" + registered[value] + \"}\";\n } else if (isProcessableValue(value)) {\n string += processStyleName(_key) + \":\" + processStyleValue(_key, value) + \";\";\n }\n } else {\n if (_key === 'NO_COMPONENT_SELECTOR' && process.env.NODE_ENV !== 'production') {\n throw new Error(noComponentSelectorMessage);\n }\n\n if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {\n for (var _i = 0; _i < value.length; _i++) {\n if (isProcessableValue(value[_i])) {\n string += processStyleName(_key) + \":\" + processStyleValue(_key, value[_i]) + \";\";\n }\n }\n } else {\n var interpolated = handleInterpolation(mergedProps, registered, value);\n\n switch (_key) {\n case 'animation':\n case 'animationName':\n {\n string += processStyleName(_key) + \":\" + interpolated + \";\";\n break;\n }\n\n default:\n {\n if (process.env.NODE_ENV !== 'production' && _key === 'undefined') {\n console.error(UNDEFINED_AS_OBJECT_KEY_ERROR);\n }\n\n string += _key + \"{\" + interpolated + \"}\";\n }\n }\n }\n }\n }\n }\n\n return string;\n}\n\nvar labelPattern = /label:\\s*([^\\s;\\n{]+)\\s*(;|$)/g;\nvar sourceMapPattern;\n\nif (process.env.NODE_ENV !== 'production') {\n sourceMapPattern = /\\/\\*#\\ssourceMappingURL=data:application\\/json;\\S+\\s+\\*\\//g;\n} // this is the cursor for keyframes\n// keyframes are stored on the SerializedStyles object as a linked list\n\n\nvar cursor;\nvar serializeStyles = function serializeStyles(args, registered, mergedProps) {\n if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {\n return args[0];\n }\n\n var stringMode = true;\n var styles = '';\n cursor = undefined;\n var strings = args[0];\n\n if (strings == null || strings.raw === undefined) {\n stringMode = false;\n styles += handleInterpolation(mergedProps, registered, strings);\n } else {\n if (process.env.NODE_ENV !== 'production' && strings[0] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles += strings[0];\n } // we start at 1 since we've already handled the first arg\n\n\n for (var i = 1; i < args.length; i++) {\n styles += handleInterpolation(mergedProps, registered, args[i]);\n\n if (stringMode) {\n if (process.env.NODE_ENV !== 'production' && strings[i] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles += strings[i];\n }\n }\n\n var sourceMap;\n\n if (process.env.NODE_ENV !== 'production') {\n styles = styles.replace(sourceMapPattern, function (match) {\n sourceMap = match;\n return '';\n });\n } // using a global regex with .exec is stateful so lastIndex has to be reset each time\n\n\n labelPattern.lastIndex = 0;\n var identifierName = '';\n var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5\n\n while ((match = labelPattern.exec(styles)) !== null) {\n identifierName += '-' + // $FlowFixMe we know it's not null\n match[1];\n }\n\n var name = hashString(styles) + identifierName;\n\n if (process.env.NODE_ENV !== 'production') {\n // $FlowFixMe SerializedStyles type doesn't have toString property (and we don't want to add it)\n return {\n name: name,\n styles: styles,\n map: sourceMap,\n next: cursor,\n toString: function toString() {\n return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\";\n }\n };\n }\n\n return {\n name: name,\n styles: styles,\n next: cursor\n };\n};\n\nexport { serializeStyles };\n","import * as React from 'react';\n\nvar syncFallback = function syncFallback(create) {\n return create();\n};\n\nvar useInsertionEffect = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : false;\nvar useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect || syncFallback;\nvar useInsertionEffectWithLayoutFallback = useInsertionEffect || React.useLayoutEffect;\n\nexport { useInsertionEffectAlwaysWithSyncFallback, useInsertionEffectWithLayoutFallback };\n","import * as React from 'react';\nimport { useContext, forwardRef } from 'react';\nimport createCache from '@emotion/cache';\nimport _extends from '@babel/runtime/helpers/esm/extends';\nimport weakMemoize from '@emotion/weak-memoize';\nimport hoistNonReactStatics from '../_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js';\nimport { getRegisteredStyles, registerStyles, insertStyles } from '@emotion/utils';\nimport { serializeStyles } from '@emotion/serialize';\nimport { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';\n\nvar isBrowser = \"object\" !== 'undefined';\nvar hasOwn = {}.hasOwnProperty;\n\nvar EmotionCacheContext = /* #__PURE__ */React.createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case\n// because this module is primarily intended for the browser and node\n// but it's also required in react native and similar environments sometimes\n// and we could have a special build just for that\n// but this is much easier and the native packages\n// might use a different theme context in the future anyway\ntypeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache({\n key: 'css'\n}) : null);\n\nif (process.env.NODE_ENV !== 'production') {\n EmotionCacheContext.displayName = 'EmotionCacheContext';\n}\n\nvar CacheProvider = EmotionCacheContext.Provider;\nvar __unsafe_useEmotionCache = function useEmotionCache() {\n return useContext(EmotionCacheContext);\n};\n\nvar withEmotionCache = function withEmotionCache(func) {\n // $FlowFixMe\n return /*#__PURE__*/forwardRef(function (props, ref) {\n // the cache will never be null in the browser\n var cache = useContext(EmotionCacheContext);\n return func(props, cache, ref);\n });\n};\n\nif (!isBrowser) {\n withEmotionCache = function withEmotionCache(func) {\n return function (props) {\n var cache = useContext(EmotionCacheContext);\n\n if (cache === null) {\n // yes, we're potentially creating this on every render\n // it doesn't actually matter though since it's only on the server\n // so there will only every be a single render\n // that could change in the future because of suspense and etc. but for now,\n // this works and i don't want to optimise for a future thing that we aren't sure about\n cache = createCache({\n key: 'css'\n });\n return /*#__PURE__*/React.createElement(EmotionCacheContext.Provider, {\n value: cache\n }, func(props, cache));\n } else {\n return func(props, cache);\n }\n };\n };\n}\n\nvar ThemeContext = /* #__PURE__ */React.createContext({});\n\nif (process.env.NODE_ENV !== 'production') {\n ThemeContext.displayName = 'EmotionThemeContext';\n}\n\nvar useTheme = function useTheme() {\n return React.useContext(ThemeContext);\n};\n\nvar getTheme = function getTheme(outerTheme, theme) {\n if (typeof theme === 'function') {\n var mergedTheme = theme(outerTheme);\n\n if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {\n throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');\n }\n\n return mergedTheme;\n }\n\n if (process.env.NODE_ENV !== 'production' && (theme == null || typeof theme !== 'object' || Array.isArray(theme))) {\n throw new Error('[ThemeProvider] Please make your theme prop a plain object');\n }\n\n return _extends({}, outerTheme, theme);\n};\n\nvar createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {\n return weakMemoize(function (theme) {\n return getTheme(outerTheme, theme);\n });\n});\nvar ThemeProvider = function ThemeProvider(props) {\n var theme = React.useContext(ThemeContext);\n\n if (props.theme !== theme) {\n theme = createCacheWithTheme(theme)(props.theme);\n }\n\n return /*#__PURE__*/React.createElement(ThemeContext.Provider, {\n value: theme\n }, props.children);\n};\nfunction withTheme(Component) {\n var componentName = Component.displayName || Component.name || 'Component';\n\n var render = function render(props, ref) {\n var theme = React.useContext(ThemeContext);\n return /*#__PURE__*/React.createElement(Component, _extends({\n theme: theme,\n ref: ref\n }, props));\n }; // $FlowFixMe\n\n\n var WithTheme = /*#__PURE__*/React.forwardRef(render);\n WithTheme.displayName = \"WithTheme(\" + componentName + \")\";\n return hoistNonReactStatics(WithTheme, Component);\n}\n\nvar getLastPart = function getLastPart(functionName) {\n // The match may be something like 'Object.createEmotionProps' or\n // 'Loader.prototype.render'\n var parts = functionName.split('.');\n return parts[parts.length - 1];\n};\n\nvar getFunctionNameFromStackTraceLine = function getFunctionNameFromStackTraceLine(line) {\n // V8\n var match = /^\\s+at\\s+([A-Za-z0-9$.]+)\\s/.exec(line);\n if (match) return getLastPart(match[1]); // Safari / Firefox\n\n match = /^([A-Za-z0-9$.]+)@/.exec(line);\n if (match) return getLastPart(match[1]);\n return undefined;\n};\n\nvar internalReactFunctionNames = /* #__PURE__ */new Set(['renderWithHooks', 'processChild', 'finishClassComponent', 'renderToString']); // These identifiers come from error stacks, so they have to be valid JS\n// identifiers, thus we only need to replace what is a valid character for JS,\n// but not for CSS.\n\nvar sanitizeIdentifier = function sanitizeIdentifier(identifier) {\n return identifier.replace(/\\$/g, '-');\n};\n\nvar getLabelFromStackTrace = function getLabelFromStackTrace(stackTrace) {\n if (!stackTrace) return undefined;\n var lines = stackTrace.split('\\n');\n\n for (var i = 0; i < lines.length; i++) {\n var functionName = getFunctionNameFromStackTraceLine(lines[i]); // The first line of V8 stack traces is just \"Error\"\n\n if (!functionName) continue; // If we reach one of these, we have gone too far and should quit\n\n if (internalReactFunctionNames.has(functionName)) break; // The component name is the first function in the stack that starts with an\n // uppercase letter\n\n if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName);\n }\n\n return undefined;\n};\n\nvar typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';\nvar labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';\nvar createEmotionProps = function createEmotionProps(type, props) {\n if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration\n props.css.indexOf(':') !== -1) {\n throw new Error(\"Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`\" + props.css + \"`\");\n }\n\n var newProps = {};\n\n for (var key in props) {\n if (hasOwn.call(props, key)) {\n newProps[key] = props[key];\n }\n }\n\n newProps[typePropName] = type; // For performance, only call getLabelFromStackTrace in development and when\n // the label hasn't already been computed\n\n if (process.env.NODE_ENV !== 'production' && !!props.css && (typeof props.css !== 'object' || typeof props.css.name !== 'string' || props.css.name.indexOf('-') === -1)) {\n var label = getLabelFromStackTrace(new Error().stack);\n if (label) newProps[labelPropName] = label;\n }\n\n return newProps;\n};\n\nvar Insertion = function Insertion(_ref) {\n var cache = _ref.cache,\n serialized = _ref.serialized,\n isStringTag = _ref.isStringTag;\n registerStyles(cache, serialized, isStringTag);\n useInsertionEffectAlwaysWithSyncFallback(function () {\n return insertStyles(cache, serialized, isStringTag);\n });\n\n return null;\n};\n\nvar Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {\n var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works\n // not passing the registered cache to serializeStyles because it would\n // make certain babel optimisations not possible\n\n if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {\n cssProp = cache.registered[cssProp];\n }\n\n var WrappedComponent = props[typePropName];\n var registeredStyles = [cssProp];\n var className = '';\n\n if (typeof props.className === 'string') {\n className = getRegisteredStyles(cache.registered, registeredStyles, props.className);\n } else if (props.className != null) {\n className = props.className + \" \";\n }\n\n var serialized = serializeStyles(registeredStyles, undefined, React.useContext(ThemeContext));\n\n if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {\n var labelFromStack = props[labelPropName];\n\n if (labelFromStack) {\n serialized = serializeStyles([serialized, 'label:' + labelFromStack + ';']);\n }\n }\n\n className += cache.key + \"-\" + serialized.name;\n var newProps = {};\n\n for (var key in props) {\n if (hasOwn.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {\n newProps[key] = props[key];\n }\n }\n\n newProps.ref = ref;\n newProps.className = className;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {\n cache: cache,\n serialized: serialized,\n isStringTag: typeof WrappedComponent === 'string'\n }), /*#__PURE__*/React.createElement(WrappedComponent, newProps));\n});\n\nif (process.env.NODE_ENV !== 'production') {\n Emotion.displayName = 'EmotionCssPropInternal';\n}\n\nvar Emotion$1 = Emotion;\n\nexport { CacheProvider as C, Emotion$1 as E, ThemeContext as T, __unsafe_useEmotionCache as _, ThemeProvider as a, withTheme as b, createEmotionProps as c, hasOwn as h, isBrowser as i, useTheme as u, withEmotionCache as w };\n","function _extends() {\n module.exports = _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 }, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;\n return _extends.apply(this, arguments);\n}\nmodule.exports = _extends, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","import { h as hasOwn, E as Emotion, c as createEmotionProps, w as withEmotionCache, T as ThemeContext, i as isBrowser$1 } from './emotion-element-43c6fea0.browser.esm.js';\nexport { C as CacheProvider, T as ThemeContext, a as ThemeProvider, _ as __unsafe_useEmotionCache, u as useTheme, w as withEmotionCache, b as withTheme } from './emotion-element-43c6fea0.browser.esm.js';\nimport * as React from 'react';\nimport { insertStyles, registerStyles, getRegisteredStyles } from '@emotion/utils';\nimport { useInsertionEffectWithLayoutFallback, useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';\nimport { serializeStyles } from '@emotion/serialize';\nimport '@emotion/cache';\nimport '@babel/runtime/helpers/extends';\nimport '@emotion/weak-memoize';\nimport '../_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js';\nimport 'hoist-non-react-statics';\n\nvar pkg = {\n\tname: \"@emotion/react\",\n\tversion: \"11.11.4\",\n\tmain: \"dist/emotion-react.cjs.js\",\n\tmodule: \"dist/emotion-react.esm.js\",\n\tbrowser: {\n\t\t\"./dist/emotion-react.esm.js\": \"./dist/emotion-react.browser.esm.js\"\n\t},\n\texports: {\n\t\t\".\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./dist/emotion-react.worker.esm.js\",\n\t\t\t\tbrowser: \"./dist/emotion-react.browser.esm.js\",\n\t\t\t\t\"default\": \"./dist/emotion-react.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./dist/emotion-react.cjs.mjs\",\n\t\t\t\"default\": \"./dist/emotion-react.cjs.js\"\n\t\t},\n\t\t\"./jsx-runtime\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./jsx-runtime/dist/emotion-react-jsx-runtime.worker.esm.js\",\n\t\t\t\tbrowser: \"./jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js\",\n\t\t\t\t\"default\": \"./jsx-runtime/dist/emotion-react-jsx-runtime.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.mjs\",\n\t\t\t\"default\": \"./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.js\"\n\t\t},\n\t\t\"./_isolated-hnrs\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.worker.esm.js\",\n\t\t\t\tbrowser: \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js\",\n\t\t\t\t\"default\": \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.mjs\",\n\t\t\t\"default\": \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.js\"\n\t\t},\n\t\t\"./jsx-dev-runtime\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.worker.esm.js\",\n\t\t\t\tbrowser: \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js\",\n\t\t\t\t\"default\": \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.mjs\",\n\t\t\t\"default\": \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.js\"\n\t\t},\n\t\t\"./package.json\": \"./package.json\",\n\t\t\"./types/css-prop\": \"./types/css-prop.d.ts\",\n\t\t\"./macro\": {\n\t\t\ttypes: {\n\t\t\t\t\"import\": \"./macro.d.mts\",\n\t\t\t\t\"default\": \"./macro.d.ts\"\n\t\t\t},\n\t\t\t\"default\": \"./macro.js\"\n\t\t}\n\t},\n\ttypes: \"types/index.d.ts\",\n\tfiles: [\n\t\t\"src\",\n\t\t\"dist\",\n\t\t\"jsx-runtime\",\n\t\t\"jsx-dev-runtime\",\n\t\t\"_isolated-hnrs\",\n\t\t\"types/*.d.ts\",\n\t\t\"macro.*\"\n\t],\n\tsideEffects: false,\n\tauthor: \"Emotion Contributors\",\n\tlicense: \"MIT\",\n\tscripts: {\n\t\t\"test:typescript\": \"dtslint types\"\n\t},\n\tdependencies: {\n\t\t\"@babel/runtime\": \"^7.18.3\",\n\t\t\"@emotion/babel-plugin\": \"^11.11.0\",\n\t\t\"@emotion/cache\": \"^11.11.0\",\n\t\t\"@emotion/serialize\": \"^1.1.3\",\n\t\t\"@emotion/use-insertion-effect-with-fallbacks\": \"^1.0.1\",\n\t\t\"@emotion/utils\": \"^1.2.1\",\n\t\t\"@emotion/weak-memoize\": \"^0.3.1\",\n\t\t\"hoist-non-react-statics\": \"^3.3.1\"\n\t},\n\tpeerDependencies: {\n\t\treact: \">=16.8.0\"\n\t},\n\tpeerDependenciesMeta: {\n\t\t\"@types/react\": {\n\t\t\toptional: true\n\t\t}\n\t},\n\tdevDependencies: {\n\t\t\"@definitelytyped/dtslint\": \"0.0.112\",\n\t\t\"@emotion/css\": \"11.11.2\",\n\t\t\"@emotion/css-prettifier\": \"1.1.3\",\n\t\t\"@emotion/server\": \"11.11.0\",\n\t\t\"@emotion/styled\": \"11.11.0\",\n\t\t\"html-tag-names\": \"^1.1.2\",\n\t\treact: \"16.14.0\",\n\t\t\"svg-tag-names\": \"^1.1.1\",\n\t\ttypescript: \"^4.5.5\"\n\t},\n\trepository: \"https://github.com/emotion-js/emotion/tree/main/packages/react\",\n\tpublishConfig: {\n\t\taccess: \"public\"\n\t},\n\t\"umd:main\": \"dist/emotion-react.umd.min.js\",\n\tpreconstruct: {\n\t\tentrypoints: [\n\t\t\t\"./index.js\",\n\t\t\t\"./jsx-runtime.js\",\n\t\t\t\"./jsx-dev-runtime.js\",\n\t\t\t\"./_isolated-hnrs.js\"\n\t\t],\n\t\tumdName: \"emotionReact\",\n\t\texports: {\n\t\t\tenvConditions: [\n\t\t\t\t\"browser\",\n\t\t\t\t\"worker\"\n\t\t\t],\n\t\t\textra: {\n\t\t\t\t\"./types/css-prop\": \"./types/css-prop.d.ts\",\n\t\t\t\t\"./macro\": {\n\t\t\t\t\ttypes: {\n\t\t\t\t\t\t\"import\": \"./macro.d.mts\",\n\t\t\t\t\t\t\"default\": \"./macro.d.ts\"\n\t\t\t\t\t},\n\t\t\t\t\t\"default\": \"./macro.js\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n};\n\nvar jsx = function jsx(type, props) {\n var args = arguments;\n\n if (props == null || !hasOwn.call(props, 'css')) {\n // $FlowFixMe\n return React.createElement.apply(undefined, args);\n }\n\n var argsLength = args.length;\n var createElementArgArray = new Array(argsLength);\n createElementArgArray[0] = Emotion;\n createElementArgArray[1] = createEmotionProps(type, props);\n\n for (var i = 2; i < argsLength; i++) {\n createElementArgArray[i] = args[i];\n } // $FlowFixMe\n\n\n return React.createElement.apply(null, createElementArgArray);\n};\n\nvar warnedAboutCssPropForGlobal = false; // maintain place over rerenders.\n// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild\n// initial client-side render from SSR, use place of hydrating tag\n\nvar Global = /* #__PURE__ */withEmotionCache(function (props, cache) {\n if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is\n // probably using the custom createElement which\n // means it will be turned into a className prop\n // $FlowFixMe I don't really want to add it to the type since it shouldn't be used\n props.className || props.css)) {\n console.error(\"It looks like you're using the css prop on Global, did you mean to use the styles prop instead?\");\n warnedAboutCssPropForGlobal = true;\n }\n\n var styles = props.styles;\n var serialized = serializeStyles([styles], undefined, React.useContext(ThemeContext));\n\n if (!isBrowser$1) {\n var _ref;\n\n var serializedNames = serialized.name;\n var serializedStyles = serialized.styles;\n var next = serialized.next;\n\n while (next !== undefined) {\n serializedNames += ' ' + next.name;\n serializedStyles += next.styles;\n next = next.next;\n }\n\n var shouldCache = cache.compat === true;\n var rules = cache.insert(\"\", {\n name: serializedNames,\n styles: serializedStyles\n }, cache.sheet, shouldCache);\n\n if (shouldCache) {\n return null;\n }\n\n return /*#__PURE__*/React.createElement(\"style\", (_ref = {}, _ref[\"data-emotion\"] = cache.key + \"-global \" + serializedNames, _ref.dangerouslySetInnerHTML = {\n __html: rules\n }, _ref.nonce = cache.sheet.nonce, _ref));\n } // yes, i know these hooks are used conditionally\n // but it is based on a constant that will never change at runtime\n // it's effectively like having two implementations and switching them out\n // so it's not actually breaking anything\n\n\n var sheetRef = React.useRef();\n useInsertionEffectWithLayoutFallback(function () {\n var key = cache.key + \"-global\"; // use case of https://github.com/emotion-js/emotion/issues/2675\n\n var sheet = new cache.sheet.constructor({\n key: key,\n nonce: cache.sheet.nonce,\n container: cache.sheet.container,\n speedy: cache.sheet.isSpeedy\n });\n var rehydrating = false; // $FlowFixMe\n\n var node = document.querySelector(\"style[data-emotion=\\\"\" + key + \" \" + serialized.name + \"\\\"]\");\n\n if (cache.sheet.tags.length) {\n sheet.before = cache.sheet.tags[0];\n }\n\n if (node !== null) {\n rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other s\n\n node.setAttribute('data-emotion', key);\n sheet.hydrate([node]);\n }\n\n sheetRef.current = [sheet, rehydrating];\n return function () {\n sheet.flush();\n };\n }, [cache]);\n useInsertionEffectWithLayoutFallback(function () {\n var sheetRefCurrent = sheetRef.current;\n var sheet = sheetRefCurrent[0],\n rehydrating = sheetRefCurrent[1];\n\n if (rehydrating) {\n sheetRefCurrent[1] = false;\n return;\n }\n\n if (serialized.next !== undefined) {\n // insert keyframes\n insertStyles(cache, serialized.next, true);\n }\n\n if (sheet.tags.length) {\n // if this doesn't exist then it will be null so the style element will be appended\n var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;\n sheet.before = element;\n sheet.flush();\n }\n\n cache.insert(\"\", serialized, sheet, false);\n }, [cache, serialized.name]);\n return null;\n});\n\nif (process.env.NODE_ENV !== 'production') {\n Global.displayName = 'EmotionGlobal';\n}\n\nfunction css() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n return serializeStyles(args);\n}\n\nvar keyframes = function keyframes() {\n var insertable = css.apply(void 0, arguments);\n var name = \"animation-\" + insertable.name; // $FlowFixMe\n\n return {\n name: name,\n styles: \"@keyframes \" + name + \"{\" + insertable.styles + \"}\",\n anim: 1,\n toString: function toString() {\n return \"_EMO_\" + this.name + \"_\" + this.styles + \"_EMO_\";\n }\n };\n};\n\nvar classnames = function classnames(args) {\n var len = args.length;\n var i = 0;\n var cls = '';\n\n for (; i < len; i++) {\n var arg = args[i];\n if (arg == null) continue;\n var toAdd = void 0;\n\n switch (typeof arg) {\n case 'boolean':\n break;\n\n case 'object':\n {\n if (Array.isArray(arg)) {\n toAdd = classnames(arg);\n } else {\n if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {\n console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from component.');\n }\n\n toAdd = '';\n\n for (var k in arg) {\n if (arg[k] && k) {\n toAdd && (toAdd += ' ');\n toAdd += k;\n }\n }\n }\n\n break;\n }\n\n default:\n {\n toAdd = arg;\n }\n }\n\n if (toAdd) {\n cls && (cls += ' ');\n cls += toAdd;\n }\n }\n\n return cls;\n};\n\nfunction merge(registered, css, className) {\n var registeredStyles = [];\n var rawClassName = getRegisteredStyles(registered, registeredStyles, className);\n\n if (registeredStyles.length < 2) {\n return className;\n }\n\n return rawClassName + css(registeredStyles);\n}\n\nvar Insertion = function Insertion(_ref) {\n var cache = _ref.cache,\n serializedArr = _ref.serializedArr;\n useInsertionEffectAlwaysWithSyncFallback(function () {\n\n for (var i = 0; i < serializedArr.length; i++) {\n insertStyles(cache, serializedArr[i], false);\n }\n });\n\n return null;\n};\n\nvar ClassNames = /* #__PURE__ */withEmotionCache(function (props, cache) {\n var hasRendered = false;\n var serializedArr = [];\n\n var css = function css() {\n if (hasRendered && process.env.NODE_ENV !== 'production') {\n throw new Error('css can only be used during render');\n }\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n var serialized = serializeStyles(args, cache.registered);\n serializedArr.push(serialized); // registration has to happen here as the result of this might get consumed by `cx`\n\n registerStyles(cache, serialized, false);\n return cache.key + \"-\" + serialized.name;\n };\n\n var cx = function cx() {\n if (hasRendered && process.env.NODE_ENV !== 'production') {\n throw new Error('cx can only be used during render');\n }\n\n for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {\n args[_key2] = arguments[_key2];\n }\n\n return merge(cache.registered, css, classnames(args));\n };\n\n var content = {\n css: css,\n cx: cx,\n theme: React.useContext(ThemeContext)\n };\n var ele = props.children(content);\n hasRendered = true;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {\n cache: cache,\n serializedArr: serializedArr\n }), ele);\n});\n\nif (process.env.NODE_ENV !== 'production') {\n ClassNames.displayName = 'EmotionClassNames';\n}\n\nif (process.env.NODE_ENV !== 'production') {\n var isBrowser = \"object\" !== 'undefined'; // #1727, #2905 for some reason Jest and Vitest evaluate modules twice if some consuming module gets mocked\n\n var isTestEnv = typeof jest !== 'undefined' || typeof vi !== 'undefined';\n\n if (isBrowser && !isTestEnv) {\n // globalThis has wide browser support - https://caniuse.com/?search=globalThis, Node.js 12 and later\n var globalContext = // $FlowIgnore\n typeof globalThis !== 'undefined' ? globalThis // eslint-disable-line no-undef\n : isBrowser ? window : global;\n var globalKey = \"__EMOTION_REACT_\" + pkg.version.split('.')[0] + \"__\";\n\n if (globalContext[globalKey]) {\n console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');\n }\n\n globalContext[globalKey] = true;\n }\n}\n\nexport { ClassNames, Global, jsx as createElement, css, jsx, keyframes };\n","import _extends from '@babel/runtime/helpers/esm/extends';\nimport * as React from 'react';\nimport isPropValid from '@emotion/is-prop-valid';\nimport { withEmotionCache, ThemeContext } from '@emotion/react';\nimport { getRegisteredStyles, registerStyles, insertStyles } from '@emotion/utils';\nimport { serializeStyles } from '@emotion/serialize';\nimport { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';\n\nvar testOmitPropsOnStringTag = isPropValid;\n\nvar testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {\n return key !== 'theme';\n};\n\nvar getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {\n return typeof tag === 'string' && // 96 is one less than the char code\n // for \"a\" so this is checking that\n // it's a lowercase character\n tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;\n};\nvar composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {\n var shouldForwardProp;\n\n if (options) {\n var optionsShouldForwardProp = options.shouldForwardProp;\n shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {\n return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);\n } : optionsShouldForwardProp;\n }\n\n if (typeof shouldForwardProp !== 'function' && isReal) {\n shouldForwardProp = tag.__emotion_forwardProp;\n }\n\n return shouldForwardProp;\n};\n\nvar ILLEGAL_ESCAPE_SEQUENCE_ERROR = \"You have illegal escape sequence in your template literal, most likely inside content's property value.\\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \\\"content: '\\\\00d7';\\\" should become \\\"content: '\\\\\\\\00d7';\\\".\\nYou can read more about this here:\\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences\";\n\nvar Insertion = function Insertion(_ref) {\n var cache = _ref.cache,\n serialized = _ref.serialized,\n isStringTag = _ref.isStringTag;\n registerStyles(cache, serialized, isStringTag);\n useInsertionEffectAlwaysWithSyncFallback(function () {\n return insertStyles(cache, serialized, isStringTag);\n });\n\n return null;\n};\n\nvar createStyled = function createStyled(tag, options) {\n if (process.env.NODE_ENV !== 'production') {\n if (tag === undefined) {\n throw new Error('You are trying to create a styled element with an undefined component.\\nYou may have forgotten to import it.');\n }\n }\n\n var isReal = tag.__emotion_real === tag;\n var baseTag = isReal && tag.__emotion_base || tag;\n var identifierName;\n var targetClassName;\n\n if (options !== undefined) {\n identifierName = options.label;\n targetClassName = options.target;\n }\n\n var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);\n var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);\n var shouldUseAs = !defaultShouldForwardProp('as');\n return function () {\n var args = arguments;\n var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];\n\n if (identifierName !== undefined) {\n styles.push(\"label:\" + identifierName + \";\");\n }\n\n if (args[0] == null || args[0].raw === undefined) {\n styles.push.apply(styles, args);\n } else {\n if (process.env.NODE_ENV !== 'production' && args[0][0] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles.push(args[0][0]);\n var len = args.length;\n var i = 1;\n\n for (; i < len; i++) {\n if (process.env.NODE_ENV !== 'production' && args[0][i] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles.push(args[i], args[0][i]);\n }\n } // $FlowFixMe: we need to cast StatelessFunctionalComponent to our PrivateStyledComponent class\n\n\n var Styled = withEmotionCache(function (props, cache, ref) {\n var FinalTag = shouldUseAs && props.as || baseTag;\n var className = '';\n var classInterpolations = [];\n var mergedProps = props;\n\n if (props.theme == null) {\n mergedProps = {};\n\n for (var key in props) {\n mergedProps[key] = props[key];\n }\n\n mergedProps.theme = React.useContext(ThemeContext);\n }\n\n if (typeof props.className === 'string') {\n className = getRegisteredStyles(cache.registered, classInterpolations, props.className);\n } else if (props.className != null) {\n className = props.className + \" \";\n }\n\n var serialized = serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);\n className += cache.key + \"-\" + serialized.name;\n\n if (targetClassName !== undefined) {\n className += \" \" + targetClassName;\n }\n\n var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;\n var newProps = {};\n\n for (var _key in props) {\n if (shouldUseAs && _key === 'as') continue;\n\n if ( // $FlowFixMe\n finalShouldForwardProp(_key)) {\n newProps[_key] = props[_key];\n }\n }\n\n newProps.className = className;\n newProps.ref = ref;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {\n cache: cache,\n serialized: serialized,\n isStringTag: typeof FinalTag === 'string'\n }), /*#__PURE__*/React.createElement(FinalTag, newProps));\n });\n Styled.displayName = identifierName !== undefined ? identifierName : \"Styled(\" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + \")\";\n Styled.defaultProps = tag.defaultProps;\n Styled.__emotion_real = Styled;\n Styled.__emotion_base = baseTag;\n Styled.__emotion_styles = styles;\n Styled.__emotion_forwardProp = shouldForwardProp;\n Object.defineProperty(Styled, 'toString', {\n value: function value() {\n if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {\n return 'NO_COMPONENT_SELECTOR';\n } // $FlowFixMe: coerce undefined to string\n\n\n return \".\" + targetClassName;\n }\n });\n\n Styled.withComponent = function (nextTag, nextOptions) {\n return createStyled(nextTag, _extends({}, options, nextOptions, {\n shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)\n })).apply(void 0, styles);\n };\n\n return Styled;\n };\n};\n\nexport { createStyled as default };\n","import createStyled from '../base/dist/emotion-styled-base.browser.esm.js';\nimport '@babel/runtime/helpers/extends';\nimport 'react';\nimport '@emotion/is-prop-valid';\nimport '@emotion/react';\nimport '@emotion/utils';\nimport '@emotion/serialize';\nimport '@emotion/use-insertion-effect-with-fallbacks';\n\nvar tags = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'big', 'blockquote', 'body', 'br', 'button', 'canvas', 'caption', 'cite', 'code', 'col', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'legend', 'li', 'link', 'main', 'map', 'mark', 'marquee', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'picture', 'pre', 'progress', 'q', 'rp', 'rt', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr', // SVG\n'circle', 'clipPath', 'defs', 'ellipse', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'mask', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'stop', 'svg', 'text', 'tspan'];\n\nvar newStyled = createStyled.bind();\ntags.forEach(function (tagName) {\n // $FlowFixMe: we can ignore this because its exposed type is defined by the CreateStyled type\n newStyled[tagName] = newStyled(tagName);\n});\n\nexport { newStyled as default };\n","'use client';\n\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { CacheProvider } from '@emotion/react';\nimport createCache from '@emotion/cache';\n\n// prepend: true moves MUI styles to the top of the so they're loaded first.\n// It allows developers to easily override MUI styles with other styling solutions, like CSS modules.\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nlet cache;\nif (typeof document === 'object') {\n cache = createCache({\n key: 'css',\n prepend: true\n });\n}\nexport default function StyledEngineProvider(props) {\n const {\n injectFirst,\n children\n } = props;\n return injectFirst && cache ? /*#__PURE__*/_jsx(CacheProvider, {\n value: cache,\n children: children\n }) : children;\n}\nprocess.env.NODE_ENV !== \"production\" ? StyledEngineProvider.propTypes = {\n /**\n * Your component tree.\n */\n children: PropTypes.node,\n /**\n * By default, the styles are injected last in the element of the page.\n * As a result, they gain more specificity than any other style sheet.\n * If you want to override MUI's styles, set this prop.\n */\n injectFirst: PropTypes.bool\n} : void 0;","'use client';\n\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { Global } from '@emotion/react';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction isEmpty(obj) {\n return obj === undefined || obj === null || Object.keys(obj).length === 0;\n}\nexport default function GlobalStyles(props) {\n const {\n styles,\n defaultTheme = {}\n } = props;\n const globalStyles = typeof styles === 'function' ? themeInput => styles(isEmpty(themeInput) ? defaultTheme : themeInput) : styles;\n return /*#__PURE__*/_jsx(Global, {\n styles: globalStyles\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GlobalStyles.propTypes = {\n defaultTheme: PropTypes.object,\n styles: PropTypes.oneOfType([PropTypes.array, PropTypes.string, PropTypes.object, PropTypes.func])\n} : void 0;","/**\n * @mui/styled-engine v5.15.14\n *\n * @license MIT\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n'use client';\n\n/* eslint-disable no-underscore-dangle */\nimport emStyled from '@emotion/styled';\nexport default function styled(tag, options) {\n const stylesFactory = emStyled(tag, options);\n if (process.env.NODE_ENV !== 'production') {\n return (...styles) => {\n const component = typeof tag === 'string' ? `\"${tag}\"` : 'component';\n if (styles.length === 0) {\n console.error([`MUI: Seems like you called \\`styled(${component})()\\` without a \\`style\\` argument.`, 'You must provide a `styles` argument: `styled(\"div\")(styleYouForgotToPass)`.'].join('\\n'));\n } else if (styles.some(style => style === undefined)) {\n console.error(`MUI: the styled(${component})(...args) API requires all its args to be defined.`);\n }\n return stylesFactory(...styles);\n };\n }\n return stylesFactory;\n}\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const internal_processStyles = (tag, processor) => {\n // Emotion attaches all the styles as `__emotion_styles`.\n // Ref: https://github.com/emotion-js/emotion/blob/16d971d0da229596d6bcc39d282ba9753c9ee7cf/packages/styled/src/base.js#L186\n if (Array.isArray(tag.__emotion_styles)) {\n tag.__emotion_styles = processor(tag.__emotion_styles);\n }\n};\nexport { ThemeContext, keyframes, css } from '@emotion/react';\nexport { default as StyledEngineProvider } from './StyledEngineProvider';\nexport { default as GlobalStyles } from './GlobalStyles';","'use client';\n\nimport * as React from 'react';\nimport { ThemeContext } from '@mui/styled-engine';\nfunction isObjectEmpty(obj) {\n return Object.keys(obj).length === 0;\n}\nfunction useTheme(defaultTheme = null) {\n const contextTheme = React.useContext(ThemeContext);\n return !contextTheme || isObjectEmpty(contextTheme) ? defaultTheme : contextTheme;\n}\nexport default useTheme;","'use client';\n\nimport createTheme from './createTheme';\nimport useThemeWithoutDefault from './useThemeWithoutDefault';\nexport const systemDefaultTheme = createTheme();\nfunction useTheme(defaultTheme = systemDefaultTheme) {\n return useThemeWithoutDefault(defaultTheme);\n}\nexport default useTheme;","'use client';\n\nimport getThemeProps from './getThemeProps';\nimport useTheme from '../useTheme';\nexport default function useThemeProps({\n props,\n name,\n defaultTheme,\n themeId\n}) {\n let theme = useTheme(defaultTheme);\n if (themeId) {\n theme = theme[themeId] || theme;\n }\n const mergedProps = getThemeProps({\n theme,\n name,\n props\n });\n return mergedProps;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"sx\"];\nimport { isPlainObject } from '@mui/utils/deepmerge';\nimport defaultSxConfig from './defaultSxConfig';\nconst splitProps = props => {\n var _props$theme$unstable, _props$theme;\n const result = {\n systemProps: {},\n otherProps: {}\n };\n const config = (_props$theme$unstable = props == null || (_props$theme = props.theme) == null ? void 0 : _props$theme.unstable_sxConfig) != null ? _props$theme$unstable : defaultSxConfig;\n Object.keys(props).forEach(prop => {\n if (config[prop]) {\n result.systemProps[prop] = props[prop];\n } else {\n result.otherProps[prop] = props[prop];\n }\n });\n return result;\n};\nexport default function extendSxProp(props) {\n const {\n sx: inSx\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const {\n systemProps,\n otherProps\n } = splitProps(other);\n let finalSx;\n if (Array.isArray(inSx)) {\n finalSx = [systemProps, ...inSx];\n } else if (typeof inSx === 'function') {\n finalSx = (...args) => {\n const result = inSx(...args);\n if (!isPlainObject(result)) {\n return systemProps;\n }\n return _extends({}, systemProps, result);\n };\n } else {\n finalSx = _extends({}, systemProps, inSx);\n }\n return _extends({}, otherProps, {\n sx: finalSx\n });\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nexport default function createMixins(breakpoints, mixins) {\n return _extends({\n toolbar: {\n minHeight: 56,\n [breakpoints.up('xs')]: {\n '@media (orientation: landscape)': {\n minHeight: 48\n }\n },\n [breakpoints.up('sm')]: {\n minHeight: 64\n }\n }\n }, mixins);\n}","\"use strict\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.alpha = alpha;\nexports.blend = blend;\nexports.colorChannel = void 0;\nexports.darken = darken;\nexports.decomposeColor = decomposeColor;\nexports.emphasize = emphasize;\nexports.getContrastRatio = getContrastRatio;\nexports.getLuminance = getLuminance;\nexports.hexToRgb = hexToRgb;\nexports.hslToRgb = hslToRgb;\nexports.lighten = lighten;\nexports.private_safeAlpha = private_safeAlpha;\nexports.private_safeColorChannel = void 0;\nexports.private_safeDarken = private_safeDarken;\nexports.private_safeEmphasize = private_safeEmphasize;\nexports.private_safeLighten = private_safeLighten;\nexports.recomposeColor = recomposeColor;\nexports.rgbToHex = rgbToHex;\nvar _formatMuiErrorMessage2 = _interopRequireDefault(require(\"@mui/utils/formatMuiErrorMessage\"));\nvar _clamp = _interopRequireDefault(require(\"@mui/utils/clamp\"));\n/* eslint-disable @typescript-eslint/naming-convention */\n\n/**\n * Returns a number whose value is limited to the given range.\n * @param {number} value The value to be clamped\n * @param {number} min The lower boundary of the output range\n * @param {number} max The upper boundary of the output range\n * @returns {number} A number in the range [min, max]\n */\nfunction clampWrapper(value, min = 0, max = 1) {\n if (process.env.NODE_ENV !== 'production') {\n if (value < min || value > max) {\n console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);\n }\n }\n return (0, _clamp.default)(value, min, max);\n}\n\n/**\n * Converts a color from CSS hex format to CSS rgb format.\n * @param {string} color - Hex color, i.e. #nnn or #nnnnnn\n * @returns {string} A CSS rgb color string\n */\nfunction hexToRgb(color) {\n color = color.slice(1);\n const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, 'g');\n let colors = color.match(re);\n if (colors && colors[0].length === 1) {\n colors = colors.map(n => n + n);\n }\n return colors ? `rgb${colors.length === 4 ? 'a' : ''}(${colors.map((n, index) => {\n return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1000) / 1000;\n }).join(', ')})` : '';\n}\nfunction intToHex(int) {\n const hex = int.toString(16);\n return hex.length === 1 ? `0${hex}` : hex;\n}\n\n/**\n * Returns an object with the type and values of a color.\n *\n * Note: Does not support rgb % values.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @returns {object} - A MUI color object: {type: string, values: number[]}\n */\nfunction decomposeColor(color) {\n // Idempotent\n if (color.type) {\n return color;\n }\n if (color.charAt(0) === '#') {\n return decomposeColor(hexToRgb(color));\n }\n const marker = color.indexOf('(');\n const type = color.substring(0, marker);\n if (['rgb', 'rgba', 'hsl', 'hsla', 'color'].indexOf(type) === -1) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: Unsupported \\`${color}\\` color.\nThe following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : (0, _formatMuiErrorMessage2.default)(9, color));\n }\n let values = color.substring(marker + 1, color.length - 1);\n let colorSpace;\n if (type === 'color') {\n values = values.split(' ');\n colorSpace = values.shift();\n if (values.length === 4 && values[3].charAt(0) === '/') {\n values[3] = values[3].slice(1);\n }\n if (['srgb', 'display-p3', 'a98-rgb', 'prophoto-rgb', 'rec-2020'].indexOf(colorSpace) === -1) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: unsupported \\`${colorSpace}\\` color space.\nThe following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : (0, _formatMuiErrorMessage2.default)(10, colorSpace));\n }\n } else {\n values = values.split(',');\n }\n values = values.map(value => parseFloat(value));\n return {\n type,\n values,\n colorSpace\n };\n}\n\n/**\n * Returns a channel created from the input color.\n *\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @returns {string} - The channel for the color, that can be used in rgba or hsla colors\n */\nconst colorChannel = color => {\n const decomposedColor = decomposeColor(color);\n return decomposedColor.values.slice(0, 3).map((val, idx) => decomposedColor.type.indexOf('hsl') !== -1 && idx !== 0 ? `${val}%` : val).join(' ');\n};\nexports.colorChannel = colorChannel;\nconst private_safeColorChannel = (color, warning) => {\n try {\n return colorChannel(color);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n};\n\n/**\n * Converts a color object with type and values to a string.\n * @param {object} color - Decomposed color\n * @param {string} color.type - One of: 'rgb', 'rgba', 'hsl', 'hsla', 'color'\n * @param {array} color.values - [n,n,n] or [n,n,n,n]\n * @returns {string} A CSS color string\n */\nexports.private_safeColorChannel = private_safeColorChannel;\nfunction recomposeColor(color) {\n const {\n type,\n colorSpace\n } = color;\n let {\n values\n } = color;\n if (type.indexOf('rgb') !== -1) {\n // Only convert the first 3 values to int (i.e. not alpha)\n values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);\n } else if (type.indexOf('hsl') !== -1) {\n values[1] = `${values[1]}%`;\n values[2] = `${values[2]}%`;\n }\n if (type.indexOf('color') !== -1) {\n values = `${colorSpace} ${values.join(' ')}`;\n } else {\n values = `${values.join(', ')}`;\n }\n return `${type}(${values})`;\n}\n\n/**\n * Converts a color from CSS rgb format to CSS hex format.\n * @param {string} color - RGB color, i.e. rgb(n, n, n)\n * @returns {string} A CSS rgb color string, i.e. #nnnnnn\n */\nfunction rgbToHex(color) {\n // Idempotent\n if (color.indexOf('#') === 0) {\n return color;\n }\n const {\n values\n } = decomposeColor(color);\n return `#${values.map((n, i) => intToHex(i === 3 ? Math.round(255 * n) : n)).join('')}`;\n}\n\n/**\n * Converts a color from hsl format to rgb format.\n * @param {string} color - HSL color values\n * @returns {string} rgb color values\n */\nfunction hslToRgb(color) {\n color = decomposeColor(color);\n const {\n values\n } = color;\n const h = values[0];\n const s = values[1] / 100;\n const l = values[2] / 100;\n const a = s * Math.min(l, 1 - l);\n const f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);\n let type = 'rgb';\n const rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)];\n if (color.type === 'hsla') {\n type += 'a';\n rgb.push(values[3]);\n }\n return recomposeColor({\n type,\n values: rgb\n });\n}\n/**\n * The relative brightness of any point in a color space,\n * normalized to 0 for darkest black and 1 for lightest white.\n *\n * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @returns {number} The relative brightness of the color in the range 0 - 1\n */\nfunction getLuminance(color) {\n color = decomposeColor(color);\n let rgb = color.type === 'hsl' || color.type === 'hsla' ? decomposeColor(hslToRgb(color)).values : color.values;\n rgb = rgb.map(val => {\n if (color.type !== 'color') {\n val /= 255; // normalized\n }\n return val <= 0.03928 ? val / 12.92 : ((val + 0.055) / 1.055) ** 2.4;\n });\n\n // Truncate at 3 digits\n return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));\n}\n\n/**\n * Calculates the contrast ratio between two colors.\n *\n * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n * @param {string} foreground - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()\n * @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()\n * @returns {number} A contrast ratio value in the range 0 - 21.\n */\nfunction getContrastRatio(foreground, background) {\n const lumA = getLuminance(foreground);\n const lumB = getLuminance(background);\n return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);\n}\n\n/**\n * Sets the absolute transparency of a color.\n * Any existing alpha values are overwritten.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} value - value to set the alpha channel to in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nfunction alpha(color, value) {\n color = decomposeColor(color);\n value = clampWrapper(value);\n if (color.type === 'rgb' || color.type === 'hsl') {\n color.type += 'a';\n }\n if (color.type === 'color') {\n color.values[3] = `/${value}`;\n } else {\n color.values[3] = value;\n }\n return recomposeColor(color);\n}\nfunction private_safeAlpha(color, value, warning) {\n try {\n return alpha(color, value);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}\n\n/**\n * Darkens a color.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} coefficient - multiplier in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nfunction darken(color, coefficient) {\n color = decomposeColor(color);\n coefficient = clampWrapper(coefficient);\n if (color.type.indexOf('hsl') !== -1) {\n color.values[2] *= 1 - coefficient;\n } else if (color.type.indexOf('rgb') !== -1 || color.type.indexOf('color') !== -1) {\n for (let i = 0; i < 3; i += 1) {\n color.values[i] *= 1 - coefficient;\n }\n }\n return recomposeColor(color);\n}\nfunction private_safeDarken(color, coefficient, warning) {\n try {\n return darken(color, coefficient);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}\n\n/**\n * Lightens a color.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} coefficient - multiplier in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nfunction lighten(color, coefficient) {\n color = decomposeColor(color);\n coefficient = clampWrapper(coefficient);\n if (color.type.indexOf('hsl') !== -1) {\n color.values[2] += (100 - color.values[2]) * coefficient;\n } else if (color.type.indexOf('rgb') !== -1) {\n for (let i = 0; i < 3; i += 1) {\n color.values[i] += (255 - color.values[i]) * coefficient;\n }\n } else if (color.type.indexOf('color') !== -1) {\n for (let i = 0; i < 3; i += 1) {\n color.values[i] += (1 - color.values[i]) * coefficient;\n }\n }\n return recomposeColor(color);\n}\nfunction private_safeLighten(color, coefficient, warning) {\n try {\n return lighten(color, coefficient);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}\n\n/**\n * Darken or lighten a color, depending on its luminance.\n * Light colors are darkened, dark colors are lightened.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} coefficient=0.15 - multiplier in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nfunction emphasize(color, coefficient = 0.15) {\n return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);\n}\nfunction private_safeEmphasize(color, coefficient, warning) {\n try {\n return emphasize(color, coefficient);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}\n\n/**\n * Blend a transparent overlay color with a background color, resulting in a single\n * RGB color.\n * @param {string} background - CSS color\n * @param {string} overlay - CSS color\n * @param {number} opacity - Opacity multiplier in the range 0 - 1\n * @param {number} [gamma=1.0] - Gamma correction factor. For gamma-correct blending, 2.2 is usual.\n */\nfunction blend(background, overlay, opacity, gamma = 1.0) {\n const blendChannel = (b, o) => Math.round((b ** (1 / gamma) * (1 - opacity) + o ** (1 / gamma) * opacity) ** gamma);\n const backgroundColor = decomposeColor(background);\n const overlayColor = decomposeColor(overlay);\n const rgb = [blendChannel(backgroundColor.values[0], overlayColor.values[0]), blendChannel(backgroundColor.values[1], overlayColor.values[1]), blendChannel(backgroundColor.values[2], overlayColor.values[2])];\n return recomposeColor({\n type: 'rgb',\n values: rgb\n });\n}","const common = {\n black: '#000',\n white: '#fff'\n};\nexport default common;","const grey = {\n 50: '#fafafa',\n 100: '#f5f5f5',\n 200: '#eeeeee',\n 300: '#e0e0e0',\n 400: '#bdbdbd',\n 500: '#9e9e9e',\n 600: '#757575',\n 700: '#616161',\n 800: '#424242',\n 900: '#212121',\n A100: '#f5f5f5',\n A200: '#eeeeee',\n A400: '#bdbdbd',\n A700: '#616161'\n};\nexport default grey;","const purple = {\n 50: '#f3e5f5',\n 100: '#e1bee7',\n 200: '#ce93d8',\n 300: '#ba68c8',\n 400: '#ab47bc',\n 500: '#9c27b0',\n 600: '#8e24aa',\n 700: '#7b1fa2',\n 800: '#6a1b9a',\n 900: '#4a148c',\n A100: '#ea80fc',\n A200: '#e040fb',\n A400: '#d500f9',\n A700: '#aa00ff'\n};\nexport default purple;","const red = {\n 50: '#ffebee',\n 100: '#ffcdd2',\n 200: '#ef9a9a',\n 300: '#e57373',\n 400: '#ef5350',\n 500: '#f44336',\n 600: '#e53935',\n 700: '#d32f2f',\n 800: '#c62828',\n 900: '#b71c1c',\n A100: '#ff8a80',\n A200: '#ff5252',\n A400: '#ff1744',\n A700: '#d50000'\n};\nexport default red;","const orange = {\n 50: '#fff3e0',\n 100: '#ffe0b2',\n 200: '#ffcc80',\n 300: '#ffb74d',\n 400: '#ffa726',\n 500: '#ff9800',\n 600: '#fb8c00',\n 700: '#f57c00',\n 800: '#ef6c00',\n 900: '#e65100',\n A100: '#ffd180',\n A200: '#ffab40',\n A400: '#ff9100',\n A700: '#ff6d00'\n};\nexport default orange;","const blue = {\n 50: '#e3f2fd',\n 100: '#bbdefb',\n 200: '#90caf9',\n 300: '#64b5f6',\n 400: '#42a5f5',\n 500: '#2196f3',\n 600: '#1e88e5',\n 700: '#1976d2',\n 800: '#1565c0',\n 900: '#0d47a1',\n A100: '#82b1ff',\n A200: '#448aff',\n A400: '#2979ff',\n A700: '#2962ff'\n};\nexport default blue;","const lightBlue = {\n 50: '#e1f5fe',\n 100: '#b3e5fc',\n 200: '#81d4fa',\n 300: '#4fc3f7',\n 400: '#29b6f6',\n 500: '#03a9f4',\n 600: '#039be5',\n 700: '#0288d1',\n 800: '#0277bd',\n 900: '#01579b',\n A100: '#80d8ff',\n A200: '#40c4ff',\n A400: '#00b0ff',\n A700: '#0091ea'\n};\nexport default lightBlue;","const green = {\n 50: '#e8f5e9',\n 100: '#c8e6c9',\n 200: '#a5d6a7',\n 300: '#81c784',\n 400: '#66bb6a',\n 500: '#4caf50',\n 600: '#43a047',\n 700: '#388e3c',\n 800: '#2e7d32',\n 900: '#1b5e20',\n A100: '#b9f6ca',\n A200: '#69f0ae',\n A400: '#00e676',\n A700: '#00c853'\n};\nexport default green;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _formatMuiErrorMessage from \"@mui/utils/formatMuiErrorMessage\";\nconst _excluded = [\"mode\", \"contrastThreshold\", \"tonalOffset\"];\nimport deepmerge from '@mui/utils/deepmerge';\nimport { darken, getContrastRatio, lighten } from '@mui/system/colorManipulator';\nimport common from '../colors/common';\nimport grey from '../colors/grey';\nimport purple from '../colors/purple';\nimport red from '../colors/red';\nimport orange from '../colors/orange';\nimport blue from '../colors/blue';\nimport lightBlue from '../colors/lightBlue';\nimport green from '../colors/green';\nexport const light = {\n // The colors used to style the text.\n text: {\n // The most important text.\n primary: 'rgba(0, 0, 0, 0.87)',\n // Secondary text.\n secondary: 'rgba(0, 0, 0, 0.6)',\n // Disabled text have even lower visual prominence.\n disabled: 'rgba(0, 0, 0, 0.38)'\n },\n // The color used to divide different elements.\n divider: 'rgba(0, 0, 0, 0.12)',\n // The background colors used to style the surfaces.\n // Consistency between these values is important.\n background: {\n paper: common.white,\n default: common.white\n },\n // The colors used to style the action elements.\n action: {\n // The color of an active action like an icon button.\n active: 'rgba(0, 0, 0, 0.54)',\n // The color of an hovered action.\n hover: 'rgba(0, 0, 0, 0.04)',\n hoverOpacity: 0.04,\n // The color of a selected action.\n selected: 'rgba(0, 0, 0, 0.08)',\n selectedOpacity: 0.08,\n // The color of a disabled action.\n disabled: 'rgba(0, 0, 0, 0.26)',\n // The background color of a disabled action.\n disabledBackground: 'rgba(0, 0, 0, 0.12)',\n disabledOpacity: 0.38,\n focus: 'rgba(0, 0, 0, 0.12)',\n focusOpacity: 0.12,\n activatedOpacity: 0.12\n }\n};\nexport const dark = {\n text: {\n primary: common.white,\n secondary: 'rgba(255, 255, 255, 0.7)',\n disabled: 'rgba(255, 255, 255, 0.5)',\n icon: 'rgba(255, 255, 255, 0.5)'\n },\n divider: 'rgba(255, 255, 255, 0.12)',\n background: {\n paper: '#121212',\n default: '#121212'\n },\n action: {\n active: common.white,\n hover: 'rgba(255, 255, 255, 0.08)',\n hoverOpacity: 0.08,\n selected: 'rgba(255, 255, 255, 0.16)',\n selectedOpacity: 0.16,\n disabled: 'rgba(255, 255, 255, 0.3)',\n disabledBackground: 'rgba(255, 255, 255, 0.12)',\n disabledOpacity: 0.38,\n focus: 'rgba(255, 255, 255, 0.12)',\n focusOpacity: 0.12,\n activatedOpacity: 0.24\n }\n};\nfunction addLightOrDark(intent, direction, shade, tonalOffset) {\n const tonalOffsetLight = tonalOffset.light || tonalOffset;\n const tonalOffsetDark = tonalOffset.dark || tonalOffset * 1.5;\n if (!intent[direction]) {\n if (intent.hasOwnProperty(shade)) {\n intent[direction] = intent[shade];\n } else if (direction === 'light') {\n intent.light = lighten(intent.main, tonalOffsetLight);\n } else if (direction === 'dark') {\n intent.dark = darken(intent.main, tonalOffsetDark);\n }\n }\n}\nfunction getDefaultPrimary(mode = 'light') {\n if (mode === 'dark') {\n return {\n main: blue[200],\n light: blue[50],\n dark: blue[400]\n };\n }\n return {\n main: blue[700],\n light: blue[400],\n dark: blue[800]\n };\n}\nfunction getDefaultSecondary(mode = 'light') {\n if (mode === 'dark') {\n return {\n main: purple[200],\n light: purple[50],\n dark: purple[400]\n };\n }\n return {\n main: purple[500],\n light: purple[300],\n dark: purple[700]\n };\n}\nfunction getDefaultError(mode = 'light') {\n if (mode === 'dark') {\n return {\n main: red[500],\n light: red[300],\n dark: red[700]\n };\n }\n return {\n main: red[700],\n light: red[400],\n dark: red[800]\n };\n}\nfunction getDefaultInfo(mode = 'light') {\n if (mode === 'dark') {\n return {\n main: lightBlue[400],\n light: lightBlue[300],\n dark: lightBlue[700]\n };\n }\n return {\n main: lightBlue[700],\n light: lightBlue[500],\n dark: lightBlue[900]\n };\n}\nfunction getDefaultSuccess(mode = 'light') {\n if (mode === 'dark') {\n return {\n main: green[400],\n light: green[300],\n dark: green[700]\n };\n }\n return {\n main: green[800],\n light: green[500],\n dark: green[900]\n };\n}\nfunction getDefaultWarning(mode = 'light') {\n if (mode === 'dark') {\n return {\n main: orange[400],\n light: orange[300],\n dark: orange[700]\n };\n }\n return {\n main: '#ed6c02',\n // closest to orange[800] that pass 3:1.\n light: orange[500],\n dark: orange[900]\n };\n}\nexport default function createPalette(palette) {\n const {\n mode = 'light',\n contrastThreshold = 3,\n tonalOffset = 0.2\n } = palette,\n other = _objectWithoutPropertiesLoose(palette, _excluded);\n const primary = palette.primary || getDefaultPrimary(mode);\n const secondary = palette.secondary || getDefaultSecondary(mode);\n const error = palette.error || getDefaultError(mode);\n const info = palette.info || getDefaultInfo(mode);\n const success = palette.success || getDefaultSuccess(mode);\n const warning = palette.warning || getDefaultWarning(mode);\n\n // Use the same logic as\n // Bootstrap: https://github.com/twbs/bootstrap/blob/1d6e3710dd447de1a200f29e8fa521f8a0908f70/scss/_functions.scss#L59\n // and material-components-web https://github.com/material-components/material-components-web/blob/ac46b8863c4dab9fc22c4c662dc6bd1b65dd652f/packages/mdc-theme/_functions.scss#L54\n function getContrastText(background) {\n const contrastText = getContrastRatio(background, dark.text.primary) >= contrastThreshold ? dark.text.primary : light.text.primary;\n if (process.env.NODE_ENV !== 'production') {\n const contrast = getContrastRatio(background, contrastText);\n if (contrast < 3) {\n console.error([`MUI: The contrast ratio of ${contrast}:1 for ${contrastText} on ${background}`, 'falls below the WCAG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\\n'));\n }\n }\n return contrastText;\n }\n const augmentColor = ({\n color,\n name,\n mainShade = 500,\n lightShade = 300,\n darkShade = 700\n }) => {\n color = _extends({}, color);\n if (!color.main && color[mainShade]) {\n color.main = color[mainShade];\n }\n if (!color.hasOwnProperty('main')) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: The color${name ? ` (${name})` : ''} provided to augmentColor(color) is invalid.\nThe color object needs to have a \\`main\\` property or a \\`${mainShade}\\` property.` : _formatMuiErrorMessage(11, name ? ` (${name})` : '', mainShade));\n }\n if (typeof color.main !== 'string') {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: The color${name ? ` (${name})` : ''} provided to augmentColor(color) is invalid.\n\\`color.main\\` should be a string, but \\`${JSON.stringify(color.main)}\\` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@mui/material/colors\";\n\nconst theme1 = createTheme({ palette: {\n primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n primary: { main: green[500] },\n} });` : _formatMuiErrorMessage(12, name ? ` (${name})` : '', JSON.stringify(color.main)));\n }\n addLightOrDark(color, 'light', lightShade, tonalOffset);\n addLightOrDark(color, 'dark', darkShade, tonalOffset);\n if (!color.contrastText) {\n color.contrastText = getContrastText(color.main);\n }\n return color;\n };\n const modes = {\n dark,\n light\n };\n if (process.env.NODE_ENV !== 'production') {\n if (!modes[mode]) {\n console.error(`MUI: The palette mode \\`${mode}\\` is not supported.`);\n }\n }\n const paletteOutput = deepmerge(_extends({\n // A collection of common colors.\n common: _extends({}, common),\n // prevent mutable object.\n // The palette mode, can be light or dark.\n mode,\n // The colors used to represent primary interface elements for a user.\n primary: augmentColor({\n color: primary,\n name: 'primary'\n }),\n // The colors used to represent secondary interface elements for a user.\n secondary: augmentColor({\n color: secondary,\n name: 'secondary',\n mainShade: 'A400',\n lightShade: 'A200',\n darkShade: 'A700'\n }),\n // The colors used to represent interface elements that the user should be made aware of.\n error: augmentColor({\n color: error,\n name: 'error'\n }),\n // The colors used to represent potentially dangerous actions or important messages.\n warning: augmentColor({\n color: warning,\n name: 'warning'\n }),\n // The colors used to present information to the user that is neutral and not necessarily important.\n info: augmentColor({\n color: info,\n name: 'info'\n }),\n // The colors used to indicate the successful completion of an action that user triggered.\n success: augmentColor({\n color: success,\n name: 'success'\n }),\n // The grey colors.\n grey,\n // Used by `getContrastText()` to maximize the contrast between\n // the background and the text.\n contrastThreshold,\n // Takes a background color and returns the text color that maximizes the contrast.\n getContrastText,\n // Generate a rich color object.\n augmentColor,\n // Used by the functions below to shift a color's luminance by approximately\n // two indexes within its tonal palette.\n // E.g., shift from Red 500 to Red 300 or Red 700.\n tonalOffset\n }, modes[mode]), other);\n return paletteOutput;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"fontFamily\", \"fontSize\", \"fontWeightLight\", \"fontWeightRegular\", \"fontWeightMedium\", \"fontWeightBold\", \"htmlFontSize\", \"allVariants\", \"pxToRem\"];\nimport deepmerge from '@mui/utils/deepmerge';\nfunction round(value) {\n return Math.round(value * 1e5) / 1e5;\n}\nconst caseAllCaps = {\n textTransform: 'uppercase'\n};\nconst defaultFontFamily = '\"Roboto\", \"Helvetica\", \"Arial\", sans-serif';\n\n/**\n * @see @link{https://m2.material.io/design/typography/the-type-system.html}\n * @see @link{https://m2.material.io/design/typography/understanding-typography.html}\n */\nexport default function createTypography(palette, typography) {\n const _ref = typeof typography === 'function' ? typography(palette) : typography,\n {\n fontFamily = defaultFontFamily,\n // The default font size of the Material Specification.\n fontSize = 14,\n // px\n fontWeightLight = 300,\n fontWeightRegular = 400,\n fontWeightMedium = 500,\n fontWeightBold = 700,\n // Tell MUI what's the font-size on the html element.\n // 16px is the default font-size used by browsers.\n htmlFontSize = 16,\n // Apply the CSS properties to all the variants.\n allVariants,\n pxToRem: pxToRem2\n } = _ref,\n other = _objectWithoutPropertiesLoose(_ref, _excluded);\n if (process.env.NODE_ENV !== 'production') {\n if (typeof fontSize !== 'number') {\n console.error('MUI: `fontSize` is required to be a number.');\n }\n if (typeof htmlFontSize !== 'number') {\n console.error('MUI: `htmlFontSize` is required to be a number.');\n }\n }\n const coef = fontSize / 14;\n const pxToRem = pxToRem2 || (size => `${size / htmlFontSize * coef}rem`);\n const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends({\n fontFamily,\n fontWeight,\n fontSize: pxToRem(size),\n // Unitless following https://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/\n lineHeight\n }, fontFamily === defaultFontFamily ? {\n letterSpacing: `${round(letterSpacing / size)}em`\n } : {}, casing, allVariants);\n const variants = {\n h1: buildVariant(fontWeightLight, 96, 1.167, -1.5),\n h2: buildVariant(fontWeightLight, 60, 1.2, -0.5),\n h3: buildVariant(fontWeightRegular, 48, 1.167, 0),\n h4: buildVariant(fontWeightRegular, 34, 1.235, 0.25),\n h5: buildVariant(fontWeightRegular, 24, 1.334, 0),\n h6: buildVariant(fontWeightMedium, 20, 1.6, 0.15),\n subtitle1: buildVariant(fontWeightRegular, 16, 1.75, 0.15),\n subtitle2: buildVariant(fontWeightMedium, 14, 1.57, 0.1),\n body1: buildVariant(fontWeightRegular, 16, 1.5, 0.15),\n body2: buildVariant(fontWeightRegular, 14, 1.43, 0.15),\n button: buildVariant(fontWeightMedium, 14, 1.75, 0.4, caseAllCaps),\n caption: buildVariant(fontWeightRegular, 12, 1.66, 0.4),\n overline: buildVariant(fontWeightRegular, 12, 2.66, 1, caseAllCaps),\n // TODO v6: Remove handling of 'inherit' variant from the theme as it is already handled in Material UI's Typography component. Also, remember to remove the associated types.\n inherit: {\n fontFamily: 'inherit',\n fontWeight: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'inherit',\n letterSpacing: 'inherit'\n }\n };\n return deepmerge(_extends({\n htmlFontSize,\n pxToRem,\n fontFamily,\n fontSize,\n fontWeightLight,\n fontWeightRegular,\n fontWeightMedium,\n fontWeightBold\n }, variants), other, {\n clone: false // No need to clone deep\n });\n}","const shadowKeyUmbraOpacity = 0.2;\nconst shadowKeyPenumbraOpacity = 0.14;\nconst shadowAmbientShadowOpacity = 0.12;\nfunction createShadow(...px) {\n return [`${px[0]}px ${px[1]}px ${px[2]}px ${px[3]}px rgba(0,0,0,${shadowKeyUmbraOpacity})`, `${px[4]}px ${px[5]}px ${px[6]}px ${px[7]}px rgba(0,0,0,${shadowKeyPenumbraOpacity})`, `${px[8]}px ${px[9]}px ${px[10]}px ${px[11]}px rgba(0,0,0,${shadowAmbientShadowOpacity})`].join(',');\n}\n\n// Values from https://github.com/material-components/material-components-web/blob/be8747f94574669cb5e7add1a7c54fa41a89cec7/packages/mdc-elevation/_variables.scss\nconst shadows = ['none', createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];\nexport default shadows;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"duration\", \"easing\", \"delay\"];\n// Follow https://material.google.com/motion/duration-easing.html#duration-easing-natural-easing-curves\n// to learn the context in which each easing should be used.\nexport const easing = {\n // This is the most common easing curve.\n easeInOut: 'cubic-bezier(0.4, 0, 0.2, 1)',\n // Objects enter the screen at full velocity from off-screen and\n // slowly decelerate to a resting point.\n easeOut: 'cubic-bezier(0.0, 0, 0.2, 1)',\n // Objects leave the screen at full velocity. They do not decelerate when off-screen.\n easeIn: 'cubic-bezier(0.4, 0, 1, 1)',\n // The sharp curve is used by objects that may return to the screen at any time.\n sharp: 'cubic-bezier(0.4, 0, 0.6, 1)'\n};\n\n// Follow https://m2.material.io/guidelines/motion/duration-easing.html#duration-easing-common-durations\n// to learn when use what timing\nexport const duration = {\n shortest: 150,\n shorter: 200,\n short: 250,\n // most basic recommended timing\n standard: 300,\n // this is to be used in complex animations\n complex: 375,\n // recommended when something is entering screen\n enteringScreen: 225,\n // recommended when something is leaving screen\n leavingScreen: 195\n};\nfunction formatMs(milliseconds) {\n return `${Math.round(milliseconds)}ms`;\n}\nfunction getAutoHeightDuration(height) {\n if (!height) {\n return 0;\n }\n const constant = height / 36;\n\n // https://www.wolframalpha.com/input/?i=(4+%2B+15+*+(x+%2F+36+)+**+0.25+%2B+(x+%2F+36)+%2F+5)+*+10\n return Math.round((4 + 15 * constant ** 0.25 + constant / 5) * 10);\n}\nexport default function createTransitions(inputTransitions) {\n const mergedEasing = _extends({}, easing, inputTransitions.easing);\n const mergedDuration = _extends({}, duration, inputTransitions.duration);\n const create = (props = ['all'], options = {}) => {\n const {\n duration: durationOption = mergedDuration.standard,\n easing: easingOption = mergedEasing.easeInOut,\n delay = 0\n } = options,\n other = _objectWithoutPropertiesLoose(options, _excluded);\n if (process.env.NODE_ENV !== 'production') {\n const isString = value => typeof value === 'string';\n // IE11 support, replace with Number.isNaN\n // eslint-disable-next-line no-restricted-globals\n const isNumber = value => !isNaN(parseFloat(value));\n if (!isString(props) && !Array.isArray(props)) {\n console.error('MUI: Argument \"props\" must be a string or Array.');\n }\n if (!isNumber(durationOption) && !isString(durationOption)) {\n console.error(`MUI: Argument \"duration\" must be a number or a string but found ${durationOption}.`);\n }\n if (!isString(easingOption)) {\n console.error('MUI: Argument \"easing\" must be a string.');\n }\n if (!isNumber(delay) && !isString(delay)) {\n console.error('MUI: Argument \"delay\" must be a number or a string.');\n }\n if (typeof options !== 'object') {\n console.error(['MUI: Secong argument of transition.create must be an object.', \"Arguments should be either `create('prop1', options)` or `create(['prop1', 'prop2'], options)`\"].join('\\n'));\n }\n if (Object.keys(other).length !== 0) {\n console.error(`MUI: Unrecognized argument(s) [${Object.keys(other).join(',')}].`);\n }\n }\n return (Array.isArray(props) ? props : [props]).map(animatedProp => `${animatedProp} ${typeof durationOption === 'string' ? durationOption : formatMs(durationOption)} ${easingOption} ${typeof delay === 'string' ? delay : formatMs(delay)}`).join(',');\n };\n return _extends({\n getAutoHeightDuration,\n create\n }, inputTransitions, {\n easing: mergedEasing,\n duration: mergedDuration\n });\n}","// We need to centralize the zIndex definitions as they work\n// like global values in the browser.\nconst zIndex = {\n mobileStepper: 1000,\n fab: 1050,\n speedDial: 1050,\n appBar: 1100,\n drawer: 1200,\n modal: 1300,\n snackbar: 1400,\n tooltip: 1500\n};\nexport default zIndex;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _formatMuiErrorMessage from \"@mui/utils/formatMuiErrorMessage\";\nconst _excluded = [\"breakpoints\", \"mixins\", \"spacing\", \"palette\", \"transitions\", \"typography\", \"shape\"];\nimport deepmerge from '@mui/utils/deepmerge';\nimport styleFunctionSx, { unstable_defaultSxConfig as defaultSxConfig } from '@mui/system/styleFunctionSx';\nimport systemCreateTheme from '@mui/system/createTheme';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nimport createMixins from './createMixins';\nimport createPalette from './createPalette';\nimport createTypography from './createTypography';\nimport shadows from './shadows';\nimport createTransitions from './createTransitions';\nimport zIndex from './zIndex';\nfunction createTheme(options = {}, ...args) {\n const {\n mixins: mixinsInput = {},\n palette: paletteInput = {},\n transitions: transitionsInput = {},\n typography: typographyInput = {}\n } = options,\n other = _objectWithoutPropertiesLoose(options, _excluded);\n if (options.vars) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: \\`vars\\` is a private field used for CSS variables support.\nPlease use another name.` : _formatMuiErrorMessage(18));\n }\n const palette = createPalette(paletteInput);\n const systemTheme = systemCreateTheme(options);\n let muiTheme = deepmerge(systemTheme, {\n mixins: createMixins(systemTheme.breakpoints, mixinsInput),\n palette,\n // Don't use [...shadows] until you've verified its transpiled code is not invoking the iterator protocol.\n shadows: shadows.slice(),\n typography: createTypography(palette, typographyInput),\n transitions: createTransitions(transitionsInput),\n zIndex: _extends({}, zIndex)\n });\n muiTheme = deepmerge(muiTheme, other);\n muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);\n if (process.env.NODE_ENV !== 'production') {\n // TODO v6: Refactor to use globalStateClassesMapping from @mui/utils once `readOnly` state class is used in Rating component.\n const stateClasses = ['active', 'checked', 'completed', 'disabled', 'error', 'expanded', 'focused', 'focusVisible', 'required', 'selected'];\n const traverse = (node, component) => {\n let key;\n\n // eslint-disable-next-line guard-for-in, no-restricted-syntax\n for (key in node) {\n const child = node[key];\n if (stateClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) {\n if (process.env.NODE_ENV !== 'production') {\n const stateClass = generateUtilityClass('', key);\n console.error([`MUI: The \\`${component}\\` component increases ` + `the CSS specificity of the \\`${key}\\` internal state.`, 'You can not override it like this: ', JSON.stringify(node, null, 2), '', `Instead, you need to use the '&.${stateClass}' syntax:`, JSON.stringify({\n root: {\n [`&.${stateClass}`]: child\n }\n }, null, 2), '', 'https://mui.com/r/state-classes-guide'].join('\\n'));\n }\n // Remove the style to prevent global conflicts.\n node[key] = {};\n }\n }\n };\n Object.keys(muiTheme.components).forEach(component => {\n const styleOverrides = muiTheme.components[component].styleOverrides;\n if (styleOverrides && component.indexOf('Mui') === 0) {\n traverse(styleOverrides, component);\n }\n });\n }\n muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig, other == null ? void 0 : other.unstable_sxConfig);\n muiTheme.unstable_sx = function sx(props) {\n return styleFunctionSx({\n sx: props,\n theme: this\n });\n };\n return muiTheme;\n}\nlet warnedOnce = false;\nexport function createMuiTheme(...args) {\n if (process.env.NODE_ENV !== 'production') {\n if (!warnedOnce) {\n warnedOnce = true;\n console.error(['MUI: the createMuiTheme function was renamed to createTheme.', '', \"You should use `import { createTheme } from '@mui/material/styles'`\"].join('\\n'));\n }\n }\n return createTheme(...args);\n}\nexport default createTheme;","'use client';\n\nimport createTheme from './createTheme';\nconst defaultTheme = createTheme();\nexport default defaultTheme;","export default '$$material';","'use client';\n\nimport systemUseThemeProps from '@mui/system/useThemeProps';\nimport defaultTheme from './defaultTheme';\nimport THEME_ID from './identifier';\nexport default function useThemeProps({\n props,\n name\n}) {\n return systemUseThemeProps({\n props,\n name,\n defaultTheme,\n themeId: THEME_ID\n });\n}","function _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}\nmodule.exports = _objectWithoutPropertiesLoose, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","\"use strict\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = createStyled;\nexports.shouldForwardProp = shouldForwardProp;\nexports.systemDefaultTheme = void 0;\nvar _extends2 = _interopRequireDefault(require(\"@babel/runtime/helpers/extends\"));\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(require(\"@babel/runtime/helpers/objectWithoutPropertiesLoose\"));\nvar _styledEngine = _interopRequireWildcard(require(\"@mui/styled-engine\"));\nvar _deepmerge = require(\"@mui/utils/deepmerge\");\nvar _capitalize = _interopRequireDefault(require(\"@mui/utils/capitalize\"));\nvar _getDisplayName = _interopRequireDefault(require(\"@mui/utils/getDisplayName\"));\nvar _createTheme = _interopRequireDefault(require(\"./createTheme\"));\nvar _styleFunctionSx = _interopRequireDefault(require(\"./styleFunctionSx\"));\nconst _excluded = [\"ownerState\"],\n _excluded2 = [\"variants\"],\n _excluded3 = [\"name\", \"slot\", \"skipVariantsResolver\", \"skipSx\", \"overridesResolver\"];\n/* eslint-disable no-underscore-dangle */\nfunction _getRequireWildcardCache(e) { if (\"function\" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }\nfunction _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if (\"default\" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }\nfunction isEmpty(obj) {\n return Object.keys(obj).length === 0;\n}\n\n// https://github.com/emotion-js/emotion/blob/26ded6109fcd8ca9875cc2ce4564fee678a3f3c5/packages/styled/src/utils.js#L40\nfunction isStringTag(tag) {\n return typeof tag === 'string' &&\n // 96 is one less than the char code\n // for \"a\" so this is checking that\n // it's a lowercase character\n tag.charCodeAt(0) > 96;\n}\n\n// Update /system/styled/#api in case if this changes\nfunction shouldForwardProp(prop) {\n return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';\n}\nconst systemDefaultTheme = exports.systemDefaultTheme = (0, _createTheme.default)();\nconst lowercaseFirstLetter = string => {\n if (!string) {\n return string;\n }\n return string.charAt(0).toLowerCase() + string.slice(1);\n};\nfunction resolveTheme({\n defaultTheme,\n theme,\n themeId\n}) {\n return isEmpty(theme) ? defaultTheme : theme[themeId] || theme;\n}\nfunction defaultOverridesResolver(slot) {\n if (!slot) {\n return null;\n }\n return (props, styles) => styles[slot];\n}\nfunction processStyleArg(callableStyle, _ref) {\n let {\n ownerState\n } = _ref,\n props = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);\n const resolvedStylesArg = typeof callableStyle === 'function' ? callableStyle((0, _extends2.default)({\n ownerState\n }, props)) : callableStyle;\n if (Array.isArray(resolvedStylesArg)) {\n return resolvedStylesArg.flatMap(resolvedStyle => processStyleArg(resolvedStyle, (0, _extends2.default)({\n ownerState\n }, props)));\n }\n if (!!resolvedStylesArg && typeof resolvedStylesArg === 'object' && Array.isArray(resolvedStylesArg.variants)) {\n const {\n variants = []\n } = resolvedStylesArg,\n otherStyles = (0, _objectWithoutPropertiesLoose2.default)(resolvedStylesArg, _excluded2);\n let result = otherStyles;\n variants.forEach(variant => {\n let isMatch = true;\n if (typeof variant.props === 'function') {\n isMatch = variant.props((0, _extends2.default)({\n ownerState\n }, props, ownerState));\n } else {\n Object.keys(variant.props).forEach(key => {\n if ((ownerState == null ? void 0 : ownerState[key]) !== variant.props[key] && props[key] !== variant.props[key]) {\n isMatch = false;\n }\n });\n }\n if (isMatch) {\n if (!Array.isArray(result)) {\n result = [result];\n }\n result.push(typeof variant.style === 'function' ? variant.style((0, _extends2.default)({\n ownerState\n }, props, ownerState)) : variant.style);\n }\n });\n return result;\n }\n return resolvedStylesArg;\n}\nfunction createStyled(input = {}) {\n const {\n themeId,\n defaultTheme = systemDefaultTheme,\n rootShouldForwardProp = shouldForwardProp,\n slotShouldForwardProp = shouldForwardProp\n } = input;\n const systemSx = props => {\n return (0, _styleFunctionSx.default)((0, _extends2.default)({}, props, {\n theme: resolveTheme((0, _extends2.default)({}, props, {\n defaultTheme,\n themeId\n }))\n }));\n };\n systemSx.__mui_systemSx = true;\n return (tag, inputOptions = {}) => {\n // Filter out the `sx` style function from the previous styled component to prevent unnecessary styles generated by the composite components.\n (0, _styledEngine.internal_processStyles)(tag, styles => styles.filter(style => !(style != null && style.__mui_systemSx)));\n const {\n name: componentName,\n slot: componentSlot,\n skipVariantsResolver: inputSkipVariantsResolver,\n skipSx: inputSkipSx,\n // TODO v6: remove `lowercaseFirstLetter()` in the next major release\n // For more details: https://github.com/mui/material-ui/pull/37908\n overridesResolver = defaultOverridesResolver(lowercaseFirstLetter(componentSlot))\n } = inputOptions,\n options = (0, _objectWithoutPropertiesLoose2.default)(inputOptions, _excluded3);\n\n // if skipVariantsResolver option is defined, take the value, otherwise, true for root and false for other slots.\n const skipVariantsResolver = inputSkipVariantsResolver !== undefined ? inputSkipVariantsResolver :\n // TODO v6: remove `Root` in the next major release\n // For more details: https://github.com/mui/material-ui/pull/37908\n componentSlot && componentSlot !== 'Root' && componentSlot !== 'root' || false;\n const skipSx = inputSkipSx || false;\n let label;\n if (process.env.NODE_ENV !== 'production') {\n if (componentName) {\n // TODO v6: remove `lowercaseFirstLetter()` in the next major release\n // For more details: https://github.com/mui/material-ui/pull/37908\n label = `${componentName}-${lowercaseFirstLetter(componentSlot || 'Root')}`;\n }\n }\n let shouldForwardPropOption = shouldForwardProp;\n\n // TODO v6: remove `Root` in the next major release\n // For more details: https://github.com/mui/material-ui/pull/37908\n if (componentSlot === 'Root' || componentSlot === 'root') {\n shouldForwardPropOption = rootShouldForwardProp;\n } else if (componentSlot) {\n // any other slot specified\n shouldForwardPropOption = slotShouldForwardProp;\n } else if (isStringTag(tag)) {\n // for string (html) tag, preserve the behavior in emotion & styled-components.\n shouldForwardPropOption = undefined;\n }\n const defaultStyledResolver = (0, _styledEngine.default)(tag, (0, _extends2.default)({\n shouldForwardProp: shouldForwardPropOption,\n label\n }, options));\n const transformStyleArg = stylesArg => {\n // On the server Emotion doesn't use React.forwardRef for creating components, so the created\n // component stays as a function. This condition makes sure that we do not interpolate functions\n // which are basically components used as a selectors.\n if (typeof stylesArg === 'function' && stylesArg.__emotion_real !== stylesArg || (0, _deepmerge.isPlainObject)(stylesArg)) {\n return props => processStyleArg(stylesArg, (0, _extends2.default)({}, props, {\n theme: resolveTheme({\n theme: props.theme,\n defaultTheme,\n themeId\n })\n }));\n }\n return stylesArg;\n };\n const muiStyledResolver = (styleArg, ...expressions) => {\n let transformedStyleArg = transformStyleArg(styleArg);\n const expressionsWithDefaultTheme = expressions ? expressions.map(transformStyleArg) : [];\n if (componentName && overridesResolver) {\n expressionsWithDefaultTheme.push(props => {\n const theme = resolveTheme((0, _extends2.default)({}, props, {\n defaultTheme,\n themeId\n }));\n if (!theme.components || !theme.components[componentName] || !theme.components[componentName].styleOverrides) {\n return null;\n }\n const styleOverrides = theme.components[componentName].styleOverrides;\n const resolvedStyleOverrides = {};\n // TODO: v7 remove iteration and use `resolveStyleArg(styleOverrides[slot])` directly\n Object.entries(styleOverrides).forEach(([slotKey, slotStyle]) => {\n resolvedStyleOverrides[slotKey] = processStyleArg(slotStyle, (0, _extends2.default)({}, props, {\n theme\n }));\n });\n return overridesResolver(props, resolvedStyleOverrides);\n });\n }\n if (componentName && !skipVariantsResolver) {\n expressionsWithDefaultTheme.push(props => {\n var _theme$components;\n const theme = resolveTheme((0, _extends2.default)({}, props, {\n defaultTheme,\n themeId\n }));\n const themeVariants = theme == null || (_theme$components = theme.components) == null || (_theme$components = _theme$components[componentName]) == null ? void 0 : _theme$components.variants;\n return processStyleArg({\n variants: themeVariants\n }, (0, _extends2.default)({}, props, {\n theme\n }));\n });\n }\n if (!skipSx) {\n expressionsWithDefaultTheme.push(systemSx);\n }\n const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;\n if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {\n const placeholders = new Array(numOfCustomFnsApplied).fill('');\n // If the type is array, than we need to add placeholders in the template for the overrides, variants and the sx styles.\n transformedStyleArg = [...styleArg, ...placeholders];\n transformedStyleArg.raw = [...styleArg.raw, ...placeholders];\n }\n const Component = defaultStyledResolver(transformedStyleArg, ...expressionsWithDefaultTheme);\n if (process.env.NODE_ENV !== 'production') {\n let displayName;\n if (componentName) {\n displayName = `${componentName}${(0, _capitalize.default)(componentSlot || '')}`;\n }\n if (displayName === undefined) {\n displayName = `Styled(${(0, _getDisplayName.default)(tag)})`;\n }\n Component.displayName = displayName;\n }\n if (tag.muiName) {\n Component.muiName = tag.muiName;\n }\n return Component;\n };\n if (defaultStyledResolver.withConfig) {\n muiStyledResolver.withConfig = defaultStyledResolver.withConfig;\n }\n return muiStyledResolver;\n };\n}","// copied from @mui/system/createStyled\nfunction slotShouldForwardProp(prop) {\n return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';\n}\nexport default slotShouldForwardProp;","import slotShouldForwardProp from './slotShouldForwardProp';\nconst rootShouldForwardProp = prop => slotShouldForwardProp(prop) && prop !== 'classes';\nexport default rootShouldForwardProp;","'use client';\n\nimport createStyled from '@mui/system/createStyled';\nimport defaultTheme from './defaultTheme';\nimport THEME_ID from './identifier';\nimport rootShouldForwardProp from './rootShouldForwardProp';\nexport { default as slotShouldForwardProp } from './slotShouldForwardProp';\nexport { default as rootShouldForwardProp } from './rootShouldForwardProp';\nconst styled = createStyled({\n themeId: THEME_ID,\n defaultTheme,\n rootShouldForwardProp\n});\nexport default styled;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getSvgIconUtilityClass(slot) {\n return generateUtilityClass('MuiSvgIcon', slot);\n}\nconst svgIconClasses = generateUtilityClasses('MuiSvgIcon', ['root', 'colorPrimary', 'colorSecondary', 'colorAction', 'colorError', 'colorDisabled', 'fontSizeInherit', 'fontSizeSmall', 'fontSizeMedium', 'fontSizeLarge']);\nexport default svgIconClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"children\", \"className\", \"color\", \"component\", \"fontSize\", \"htmlColor\", \"inheritViewBox\", \"titleAccess\", \"viewBox\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport capitalize from '../utils/capitalize';\nimport useThemeProps from '../styles/useThemeProps';\nimport styled from '../styles/styled';\nimport { getSvgIconUtilityClass } from './svgIconClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n color,\n fontSize,\n classes\n } = ownerState;\n const slots = {\n root: ['root', color !== 'inherit' && `color${capitalize(color)}`, `fontSize${capitalize(fontSize)}`]\n };\n return composeClasses(slots, getSvgIconUtilityClass, classes);\n};\nconst SvgIconRoot = styled('svg', {\n name: 'MuiSvgIcon',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.color !== 'inherit' && styles[`color${capitalize(ownerState.color)}`], styles[`fontSize${capitalize(ownerState.fontSize)}`]];\n }\n})(({\n theme,\n ownerState\n}) => {\n var _theme$transitions, _theme$transitions$cr, _theme$transitions2, _theme$typography, _theme$typography$pxT, _theme$typography2, _theme$typography2$px, _theme$typography3, _theme$typography3$px, _palette$ownerState$c, _palette, _palette2, _palette3;\n return {\n userSelect: 'none',\n width: '1em',\n height: '1em',\n display: 'inline-block',\n // the will define the property that has `currentColor`\n // for example heroicons uses fill=\"none\" and stroke=\"currentColor\"\n fill: ownerState.hasSvgAsChild ? undefined : 'currentColor',\n flexShrink: 0,\n transition: (_theme$transitions = theme.transitions) == null || (_theme$transitions$cr = _theme$transitions.create) == null ? void 0 : _theme$transitions$cr.call(_theme$transitions, 'fill', {\n duration: (_theme$transitions2 = theme.transitions) == null || (_theme$transitions2 = _theme$transitions2.duration) == null ? void 0 : _theme$transitions2.shorter\n }),\n fontSize: {\n inherit: 'inherit',\n small: ((_theme$typography = theme.typography) == null || (_theme$typography$pxT = _theme$typography.pxToRem) == null ? void 0 : _theme$typography$pxT.call(_theme$typography, 20)) || '1.25rem',\n medium: ((_theme$typography2 = theme.typography) == null || (_theme$typography2$px = _theme$typography2.pxToRem) == null ? void 0 : _theme$typography2$px.call(_theme$typography2, 24)) || '1.5rem',\n large: ((_theme$typography3 = theme.typography) == null || (_theme$typography3$px = _theme$typography3.pxToRem) == null ? void 0 : _theme$typography3$px.call(_theme$typography3, 35)) || '2.1875rem'\n }[ownerState.fontSize],\n // TODO v5 deprecate, v6 remove for sx\n color: (_palette$ownerState$c = (_palette = (theme.vars || theme).palette) == null || (_palette = _palette[ownerState.color]) == null ? void 0 : _palette.main) != null ? _palette$ownerState$c : {\n action: (_palette2 = (theme.vars || theme).palette) == null || (_palette2 = _palette2.action) == null ? void 0 : _palette2.active,\n disabled: (_palette3 = (theme.vars || theme).palette) == null || (_palette3 = _palette3.action) == null ? void 0 : _palette3.disabled,\n inherit: undefined\n }[ownerState.color]\n };\n});\nconst SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiSvgIcon'\n });\n const {\n children,\n className,\n color = 'inherit',\n component = 'svg',\n fontSize = 'medium',\n htmlColor,\n inheritViewBox = false,\n titleAccess,\n viewBox = '0 0 24 24'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const hasSvgAsChild = /*#__PURE__*/React.isValidElement(children) && children.type === 'svg';\n const ownerState = _extends({}, props, {\n color,\n component,\n fontSize,\n instanceFontSize: inProps.fontSize,\n inheritViewBox,\n viewBox,\n hasSvgAsChild\n });\n const more = {};\n if (!inheritViewBox) {\n more.viewBox = viewBox;\n }\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsxs(SvgIconRoot, _extends({\n as: component,\n className: clsx(classes.root, className),\n focusable: \"false\",\n color: htmlColor,\n \"aria-hidden\": titleAccess ? undefined : true,\n role: titleAccess ? 'img' : undefined,\n ref: ref\n }, more, other, hasSvgAsChild && children.props, {\n ownerState: ownerState,\n children: [hasSvgAsChild ? children.props.children : children, titleAccess ? /*#__PURE__*/_jsx(\"title\", {\n children: titleAccess\n }) : null]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? SvgIcon.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * Node passed into the SVG element.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The color of the component.\n * It supports both default and custom theme colors, which can be added as shown in the\n * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).\n * You can use the `htmlColor` prop to apply a color attribute to the SVG element.\n * @default 'inherit'\n */\n color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'action', 'disabled', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes.elementType,\n /**\n * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.\n * @default 'medium'\n */\n fontSize: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'large', 'medium', 'small']), PropTypes.string]),\n /**\n * Applies a color attribute to the SVG element.\n */\n htmlColor: PropTypes.string,\n /**\n * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`\n * prop will be ignored.\n * Useful when you want to reference a custom `component` and have `SvgIcon` pass that\n * `component`'s viewBox to the root node.\n * @default false\n */\n inheritViewBox: PropTypes.bool,\n /**\n * The shape-rendering attribute. The behavior of the different options is described on the\n * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering).\n * If you are having issues with blurry icons you should investigate this prop.\n */\n shapeRendering: PropTypes.string,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n /**\n * Provides a human-readable title for the element that contains it.\n * https://www.w3.org/TR/SVG-access/#Equivalent\n */\n titleAccess: PropTypes.string,\n /**\n * Allows you to redefine what the coordinates without units mean inside an SVG element.\n * For example, if the SVG element is 500 (width) by 200 (height),\n * and you pass viewBox=\"0 0 50 20\",\n * this means that the coordinates inside the SVG will go from the top left corner (0,0)\n * to bottom right (50,20) and each unit will be worth 10px.\n * @default '0 0 24 24'\n */\n viewBox: PropTypes.string\n} : void 0;\nSvgIcon.muiName = 'SvgIcon';\nexport default SvgIcon;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport SvgIcon from '../SvgIcon';\n\n/**\n * Private module reserved for @mui packages.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default function createSvgIcon(path, displayName) {\n function Component(props, ref) {\n return /*#__PURE__*/_jsx(SvgIcon, _extends({\n \"data-testid\": `${displayName}Icon`,\n ref: ref\n }, props, {\n children: path\n }));\n }\n if (process.env.NODE_ENV !== 'production') {\n // Need to set `displayName` on the inner component for React.memo.\n // React prior to 16.14 ignores `displayName` on the wrapper.\n Component.displayName = `${displayName}Icon`;\n }\n Component.muiName = SvgIcon.muiName;\n return /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(Component));\n}","'use client';\n\nimport { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/base/ClassNameGenerator';\nexport { default as capitalize } from './capitalize';\nexport { default as createChainedFunction } from './createChainedFunction';\nexport { default as createSvgIcon } from './createSvgIcon';\nexport { default as debounce } from './debounce';\nexport { default as deprecatedPropType } from './deprecatedPropType';\nexport { default as isMuiElement } from './isMuiElement';\nexport { default as ownerDocument } from './ownerDocument';\nexport { default as ownerWindow } from './ownerWindow';\nexport { default as requirePropFactory } from './requirePropFactory';\nexport { default as setRef } from './setRef';\nexport { default as unstable_useEnhancedEffect } from './useEnhancedEffect';\nexport { default as unstable_useId } from './useId';\nexport { default as unsupportedProp } from './unsupportedProp';\nexport { default as useControlled } from './useControlled';\nexport { default as useEventCallback } from './useEventCallback';\nexport { default as useForkRef } from './useForkRef';\nexport { default as useIsFocusVisible } from './useIsFocusVisible';\n// TODO: remove this export once ClassNameGenerator is stable\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const unstable_ClassNameGenerator = {\n configure: generator => {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(['MUI: `ClassNameGenerator` import from `@mui/material/utils` is outdated and might cause unexpected issues.', '', \"You should use `import { unstable_ClassNameGenerator } from '@mui/material/className'` instead\", '', 'The detail of the issue: https://github.com/mui/material-ui/issues/30011#issuecomment-1024993401', '', 'The updated documentation: https://mui.com/guides/classname-generator/'].join('\\n'));\n }\n ClassNameGenerator.configure(generator);\n }\n};","\"use strict\";\n'use client';\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nObject.defineProperty(exports, \"default\", {\n enumerable: true,\n get: function () {\n return _utils.createSvgIcon;\n }\n});\nvar _utils = require(\"@mui/material/utils\");","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M2 4v7h20V4zm8 16h12v-7H10zm-8 0h6v-7H2z\"\n}), 'ViewComfy');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n d: \"M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2m0 16H5V10h14zM9 14H7v-2h2zm4 0h-2v-2h2zm4 0h-2v-2h2zm-8 4H7v-2h2zm4 0h-2v-2h2zm4 0h-2v-2h2z\"\n}), 'CalendarMonth');","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * Represents the React Dialog Component\n * ```html\n * \n * ```\n */\nvar DialogComponent = /** @class */ (function (_super) {\n __extends(DialogComponent, _super);\n function DialogComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = false;\n _this.directivekeys = { 'buttons': 'dialogButton' };\n _this.statelessTemplateProps = [\"content\"];\n _this.templateProps = null;\n _this.immediateRender = false;\n _this.portals = [];\n return _this;\n }\n DialogComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement('div', this.getDefaultAttributes(), [].concat(this.props.children, this.portals));\n }\n };\n return DialogComponent;\n}(Dialog));\nexport { DialogComponent };\napplyMixins(DialogComponent, [ComponentBase, React.Component]);\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { Tooltip } from '@syncfusion/ej2-popups';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * Represents the React Tooltip component that displays a piece of information about the target element on mouse hover.\n * ```html\n * Show Tooltip\n * ```\n */\nvar TooltipComponent = /** @class */ (function (_super) {\n __extends(TooltipComponent, _super);\n function TooltipComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = false;\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = false;\n _this.portals = [];\n return _this;\n }\n TooltipComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement('div', this.getDefaultAttributes(), [].concat(this.props.children, this.portals));\n }\n };\n return TooltipComponent;\n}(Tooltip));\nexport { TooltipComponent };\napplyMixins(TooltipComponent, [ComponentBase, React.Component]);\n","/* UAParser.js v1.0.37\n Copyright © 2012-2021 Faisal Salman \n MIT License */\n(function(window,undefined){\"use strict\";var LIBVERSION=\"1.0.37\",EMPTY=\"\",UNKNOWN=\"?\",FUNC_TYPE=\"function\",UNDEF_TYPE=\"undefined\",OBJ_TYPE=\"object\",STR_TYPE=\"string\",MAJOR=\"major\",MODEL=\"model\",NAME=\"name\",TYPE=\"type\",VENDOR=\"vendor\",VERSION=\"version\",ARCHITECTURE=\"architecture\",CONSOLE=\"console\",MOBILE=\"mobile\",TABLET=\"tablet\",SMARTTV=\"smarttv\",WEARABLE=\"wearable\",EMBEDDED=\"embedded\",UA_MAX_LENGTH=500;var AMAZON=\"Amazon\",APPLE=\"Apple\",ASUS=\"ASUS\",BLACKBERRY=\"BlackBerry\",BROWSER=\"Browser\",CHROME=\"Chrome\",EDGE=\"Edge\",FIREFOX=\"Firefox\",GOOGLE=\"Google\",HUAWEI=\"Huawei\",LG=\"LG\",MICROSOFT=\"Microsoft\",MOTOROLA=\"Motorola\",OPERA=\"Opera\",SAMSUNG=\"Samsung\",SHARP=\"Sharp\",SONY=\"Sony\",XIAOMI=\"Xiaomi\",ZEBRA=\"Zebra\",FACEBOOK=\"Facebook\",CHROMIUM_OS=\"Chromium OS\",MAC_OS=\"Mac OS\";var extend=function(regexes,extensions){var mergedRegexes={};for(var i in regexes){if(extensions[i]&&extensions[i].length%2===0){mergedRegexes[i]=extensions[i].concat(regexes[i])}else{mergedRegexes[i]=regexes[i]}}return mergedRegexes},enumerize=function(arr){var enums={};for(var i=0;i0){if(q.length===2){if(typeof q[1]==FUNC_TYPE){this[q[0]]=q[1].call(this,match)}else{this[q[0]]=q[1]}}else if(q.length===3){if(typeof q[1]===FUNC_TYPE&&!(q[1].exec&&q[1].test)){this[q[0]]=match?q[1].call(this,match,q[2]):undefined}else{this[q[0]]=match?match.replace(q[1],q[2]):undefined}}else if(q.length===4){this[q[0]]=match?q[3].call(this,match.replace(q[1],q[2])):undefined}}else{this[q]=match?match:undefined}}}}i+=2}},strMapper=function(str,map){for(var i in map){if(typeof map[i]===OBJ_TYPE&&map[i].length>0){for(var j=0;j2){_device[MODEL]=\"iPad\";_device[TYPE]=TABLET}return _device};this.getEngine=function(){var _engine={};_engine[NAME]=undefined;_engine[VERSION]=undefined;rgxMapper.call(_engine,_ua,_rgxmap.engine);return _engine};this.getOS=function(){var _os={};_os[NAME]=undefined;_os[VERSION]=undefined;rgxMapper.call(_os,_ua,_rgxmap.os);if(_isSelfNav&&!_os[NAME]&&_uach&&_uach.platform!=\"Unknown\"){_os[NAME]=_uach.platform.replace(/chrome os/i,CHROMIUM_OS).replace(/macos/i,MAC_OS)}return _os};this.getResult=function(){return{ua:this.getUA(),browser:this.getBrowser(),engine:this.getEngine(),os:this.getOS(),device:this.getDevice(),cpu:this.getCPU()}};this.getUA=function(){return _ua};this.setUA=function(ua){_ua=typeof ua===STR_TYPE&&ua.length>UA_MAX_LENGTH?trim(ua,UA_MAX_LENGTH):ua;return this};this.setUA(_ua);return this};UAParser.VERSION=LIBVERSION;UAParser.BROWSER=enumerize([NAME,VERSION,MAJOR]);UAParser.CPU=enumerize([ARCHITECTURE]);UAParser.DEVICE=enumerize([MODEL,VENDOR,TYPE,CONSOLE,MOBILE,SMARTTV,TABLET,WEARABLE,EMBEDDED]);UAParser.ENGINE=UAParser.OS=enumerize([NAME,VERSION]);if(typeof exports!==UNDEF_TYPE){if(typeof module!==UNDEF_TYPE&&module.exports){exports=module.exports=UAParser}exports.UAParser=UAParser}else{if(typeof define===FUNC_TYPE&&define.amd){define(function(){return UAParser})}else if(typeof window!==UNDEF_TYPE){window.UAParser=UAParser}}var $=typeof window!==UNDEF_TYPE&&(window.jQuery||window.Zepto);if($&&!$.ua){var parser=new UAParser;$.ua=parser.getResult();$.ua.get=function(){return parser.getUA()};$.ua.set=function(ua){parser.setUA(ua);var result=parser.getResult();for(var prop in result){$.ua[prop]=result[prop]}}}})(typeof window===\"object\"?window:this);","'use strict';\n\nObject.defineProperty(exports, '__esModule', { value: true });\n\nfunction _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }\n\nvar React = require('react');\nvar React__default = _interopDefault(React);\n\nvar UAParser = require('ua-parser-js/dist/ua-parser.min');\n\nvar ClientUAInstance = new UAParser();\nvar browser = ClientUAInstance.getBrowser();\nvar cpu = ClientUAInstance.getCPU();\nvar device = ClientUAInstance.getDevice();\nvar engine = ClientUAInstance.getEngine();\nvar os = ClientUAInstance.getOS();\nvar ua = ClientUAInstance.getUA();\nvar setUa = function setUa(userAgentString) {\n return ClientUAInstance.setUA(userAgentString);\n};\nvar parseUserAgent = function parseUserAgent(userAgent) {\n if (!userAgent) {\n console.error('No userAgent string was provided');\n return;\n }\n\n var UserAgentInstance = new UAParser(userAgent);\n return {\n UA: UserAgentInstance,\n browser: UserAgentInstance.getBrowser(),\n cpu: UserAgentInstance.getCPU(),\n device: UserAgentInstance.getDevice(),\n engine: UserAgentInstance.getEngine(),\n os: UserAgentInstance.getOS(),\n ua: UserAgentInstance.getUA(),\n setUserAgent: function setUserAgent(userAgentString) {\n return UserAgentInstance.setUA(userAgentString);\n }\n };\n};\n\nvar UAHelper = /*#__PURE__*/Object.freeze({\n ClientUAInstance: ClientUAInstance,\n browser: browser,\n cpu: cpu,\n device: device,\n engine: engine,\n os: os,\n ua: ua,\n setUa: setUa,\n parseUserAgent: parseUserAgent\n});\n\nfunction ownKeys(object, enumerableOnly) {\n var keys = Object.keys(object);\n\n if (Object.getOwnPropertySymbols) {\n var symbols = Object.getOwnPropertySymbols(object);\n\n if (enumerableOnly) {\n symbols = symbols.filter(function (sym) {\n return Object.getOwnPropertyDescriptor(object, sym).enumerable;\n });\n }\n\n keys.push.apply(keys, symbols);\n }\n\n return keys;\n}\n\nfunction _objectSpread2(target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i] != null ? arguments[i] : {};\n\n if (i % 2) {\n ownKeys(Object(source), true).forEach(function (key) {\n _defineProperty(target, key, source[key]);\n });\n } else if (Object.getOwnPropertyDescriptors) {\n Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));\n } else {\n ownKeys(Object(source)).forEach(function (key) {\n Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));\n });\n }\n }\n\n return target;\n}\n\nfunction _typeof(obj) {\n \"@babel/helpers - typeof\";\n\n if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") {\n _typeof = function (obj) {\n return typeof obj;\n };\n } else {\n _typeof = function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n };\n }\n\n return _typeof(obj);\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\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, descriptor.key, descriptor);\n }\n}\n\nfunction _createClass(Constructor, protoProps, staticProps) {\n if (protoProps) _defineProperties(Constructor.prototype, protoProps);\n if (staticProps) _defineProperties(Constructor, staticProps);\n return Constructor;\n}\n\nfunction _defineProperty(obj, key, value) {\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\n return obj;\n}\n\nfunction _extends() {\n _extends = Object.assign || function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n };\n\n return _extends.apply(this, arguments);\n}\n\nfunction _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function\");\n }\n\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n writable: true,\n configurable: true\n }\n });\n if (superClass) _setPrototypeOf(subClass, superClass);\n}\n\nfunction _getPrototypeOf(o) {\n _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {\n return o.__proto__ || Object.getPrototypeOf(o);\n };\n return _getPrototypeOf(o);\n}\n\nfunction _setPrototypeOf(o, p) {\n _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {\n o.__proto__ = p;\n return o;\n };\n\n return _setPrototypeOf(o, p);\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\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\n return target;\n}\n\nfunction _objectWithoutProperties(source, excluded) {\n if (source == null) return {};\n\n var target = _objectWithoutPropertiesLoose(source, excluded);\n\n var key, i;\n\n if (Object.getOwnPropertySymbols) {\n var sourceSymbolKeys = Object.getOwnPropertySymbols(source);\n\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\n return target;\n}\n\nfunction _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return self;\n}\n\nfunction _possibleConstructorReturn(self, call) {\n if (call && (typeof call === \"object\" || typeof call === \"function\")) {\n return call;\n } else if (call !== void 0) {\n throw new TypeError(\"Derived constructors may only return object or undefined\");\n }\n\n return _assertThisInitialized(self);\n}\n\nfunction _slicedToArray(arr, i) {\n return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();\n}\n\nfunction _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}\n\nfunction _iterableToArrayLimit(arr, i) {\n var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"];\n\n if (_i == null) return;\n var _arr = [];\n var _n = true;\n var _d = false;\n\n var _s, _e;\n\n try {\n for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {\n _arr.push(_s.value);\n\n if (i && _arr.length === i) break;\n }\n } catch (err) {\n _d = true;\n _e = err;\n } finally {\n try {\n if (!_n && _i[\"return\"] != null) _i[\"return\"]();\n } finally {\n if (_d) throw _e;\n }\n }\n\n return _arr;\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 _arrayLikeToArray(arr, len) {\n if (len == null || len > arr.length) len = arr.length;\n\n for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];\n\n return arr2;\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\nvar DeviceTypes = {\n Mobile: 'mobile',\n Tablet: 'tablet',\n SmartTv: 'smarttv',\n Console: 'console',\n Wearable: 'wearable',\n Embedded: 'embedded',\n Browser: undefined\n};\nvar BrowserTypes = {\n Chrome: 'Chrome',\n Firefox: 'Firefox',\n Opera: 'Opera',\n Yandex: 'Yandex',\n Safari: 'Safari',\n InternetExplorer: 'Internet Explorer',\n Edge: 'Edge',\n Chromium: 'Chromium',\n Ie: 'IE',\n MobileSafari: 'Mobile Safari',\n EdgeChromium: 'Edge Chromium',\n MIUI: 'MIUI Browser',\n SamsungBrowser: 'Samsung Browser'\n};\nvar OsTypes = {\n IOS: 'iOS',\n Android: 'Android',\n WindowsPhone: 'Windows Phone',\n Windows: 'Windows',\n MAC_OS: 'Mac OS'\n};\nvar InitialDeviceTypes = {\n isMobile: false,\n isTablet: false,\n isBrowser: false,\n isSmartTV: false,\n isConsole: false,\n isWearable: false\n};\n\nvar checkDeviceType = function checkDeviceType(type) {\n switch (type) {\n case DeviceTypes.Mobile:\n return {\n isMobile: true\n };\n\n case DeviceTypes.Tablet:\n return {\n isTablet: true\n };\n\n case DeviceTypes.SmartTv:\n return {\n isSmartTV: true\n };\n\n case DeviceTypes.Console:\n return {\n isConsole: true\n };\n\n case DeviceTypes.Wearable:\n return {\n isWearable: true\n };\n\n case DeviceTypes.Browser:\n return {\n isBrowser: true\n };\n\n case DeviceTypes.Embedded:\n return {\n isEmbedded: true\n };\n\n default:\n return InitialDeviceTypes;\n }\n};\nvar setUserAgent = function setUserAgent(userAgent) {\n return setUa(userAgent);\n};\nvar setDefaults = function setDefaults(p) {\n var d = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'none';\n return p ? p : d;\n};\nvar getNavigatorInstance = function getNavigatorInstance() {\n if (typeof window !== 'undefined') {\n if (window.navigator || navigator) {\n return window.navigator || navigator;\n }\n }\n\n return false;\n};\nvar isIOS13Check = function isIOS13Check(type) {\n var nav = getNavigatorInstance();\n return nav && nav.platform && (nav.platform.indexOf(type) !== -1 || nav.platform === 'MacIntel' && nav.maxTouchPoints > 1 && !window.MSStream);\n};\n\nvar browserPayload = function browserPayload(isBrowser, browser, engine, os, ua) {\n return {\n isBrowser: isBrowser,\n browserMajorVersion: setDefaults(browser.major),\n browserFullVersion: setDefaults(browser.version),\n browserName: setDefaults(browser.name),\n engineName: setDefaults(engine.name),\n engineVersion: setDefaults(engine.version),\n osName: setDefaults(os.name),\n osVersion: setDefaults(os.version),\n userAgent: setDefaults(ua)\n };\n};\nvar mobilePayload = function mobilePayload(type, device, os, ua) {\n return _objectSpread2({}, type, {\n vendor: setDefaults(device.vendor),\n model: setDefaults(device.model),\n os: setDefaults(os.name),\n osVersion: setDefaults(os.version),\n ua: setDefaults(ua)\n });\n};\nvar smartTvPayload = function smartTvPayload(isSmartTV, engine, os, ua) {\n return {\n isSmartTV: isSmartTV,\n engineName: setDefaults(engine.name),\n engineVersion: setDefaults(engine.version),\n osName: setDefaults(os.name),\n osVersion: setDefaults(os.version),\n userAgent: setDefaults(ua)\n };\n};\nvar consolePayload = function consolePayload(isConsole, engine, os, ua) {\n return {\n isConsole: isConsole,\n engineName: setDefaults(engine.name),\n engineVersion: setDefaults(engine.version),\n osName: setDefaults(os.name),\n osVersion: setDefaults(os.version),\n userAgent: setDefaults(ua)\n };\n};\nvar wearablePayload = function wearablePayload(isWearable, engine, os, ua) {\n return {\n isWearable: isWearable,\n engineName: setDefaults(engine.name),\n engineVersion: setDefaults(engine.version),\n osName: setDefaults(os.name),\n osVersion: setDefaults(os.version),\n userAgent: setDefaults(ua)\n };\n};\nvar embeddedPayload = function embeddedPayload(isEmbedded, device, engine, os, ua) {\n return {\n isEmbedded: isEmbedded,\n vendor: setDefaults(device.vendor),\n model: setDefaults(device.model),\n engineName: setDefaults(engine.name),\n engineVersion: setDefaults(engine.version),\n osName: setDefaults(os.name),\n osVersion: setDefaults(os.version),\n userAgent: setDefaults(ua)\n };\n};\n\nfunction deviceDetect(userAgent) {\n var _ref = userAgent ? parseUserAgent(userAgent) : UAHelper,\n device = _ref.device,\n browser = _ref.browser,\n engine = _ref.engine,\n os = _ref.os,\n ua = _ref.ua;\n\n var type = checkDeviceType(device.type);\n var isBrowser = type.isBrowser,\n isMobile = type.isMobile,\n isTablet = type.isTablet,\n isSmartTV = type.isSmartTV,\n isConsole = type.isConsole,\n isWearable = type.isWearable,\n isEmbedded = type.isEmbedded;\n\n if (isBrowser) {\n return browserPayload(isBrowser, browser, engine, os, ua);\n }\n\n if (isSmartTV) {\n return smartTvPayload(isSmartTV, engine, os, ua);\n }\n\n if (isConsole) {\n return consolePayload(isConsole, engine, os, ua);\n }\n\n if (isMobile) {\n return mobilePayload(type, device, os, ua);\n }\n\n if (isTablet) {\n return mobilePayload(type, device, os, ua);\n }\n\n if (isWearable) {\n return wearablePayload(isWearable, engine, os, ua);\n }\n\n if (isEmbedded) {\n return embeddedPayload(isEmbedded, device, engine, os, ua);\n }\n}\n\nvar isMobileType = function isMobileType(_ref) {\n var type = _ref.type;\n return type === DeviceTypes.Mobile;\n};\nvar isTabletType = function isTabletType(_ref2) {\n var type = _ref2.type;\n return type === DeviceTypes.Tablet;\n};\nvar isMobileAndTabletType = function isMobileAndTabletType(_ref3) {\n var type = _ref3.type;\n return type === DeviceTypes.Mobile || type === DeviceTypes.Tablet;\n};\nvar isSmartTVType = function isSmartTVType(_ref4) {\n var type = _ref4.type;\n return type === DeviceTypes.SmartTv;\n};\nvar isBrowserType = function isBrowserType(_ref5) {\n var type = _ref5.type;\n return type === DeviceTypes.Browser;\n};\nvar isWearableType = function isWearableType(_ref6) {\n var type = _ref6.type;\n return type === DeviceTypes.Wearable;\n};\nvar isConsoleType = function isConsoleType(_ref7) {\n var type = _ref7.type;\n return type === DeviceTypes.Console;\n};\nvar isEmbeddedType = function isEmbeddedType(_ref8) {\n var type = _ref8.type;\n return type === DeviceTypes.Embedded;\n};\nvar getMobileVendor = function getMobileVendor(_ref9) {\n var vendor = _ref9.vendor;\n return setDefaults(vendor);\n};\nvar getMobileModel = function getMobileModel(_ref10) {\n var model = _ref10.model;\n return setDefaults(model);\n};\nvar getDeviceType = function getDeviceType(_ref11) {\n var type = _ref11.type;\n return setDefaults(type, 'browser');\n}; // os types\n\nvar isAndroidType = function isAndroidType(_ref12) {\n var name = _ref12.name;\n return name === OsTypes.Android;\n};\nvar isWindowsType = function isWindowsType(_ref13) {\n var name = _ref13.name;\n return name === OsTypes.Windows;\n};\nvar isMacOsType = function isMacOsType(_ref14) {\n var name = _ref14.name;\n return name === OsTypes.MAC_OS;\n};\nvar isWinPhoneType = function isWinPhoneType(_ref15) {\n var name = _ref15.name;\n return name === OsTypes.WindowsPhone;\n};\nvar isIOSType = function isIOSType(_ref16) {\n var name = _ref16.name;\n return name === OsTypes.IOS;\n};\nvar getOsVersion = function getOsVersion(_ref17) {\n var version = _ref17.version;\n return setDefaults(version);\n};\nvar getOsName = function getOsName(_ref18) {\n var name = _ref18.name;\n return setDefaults(name);\n}; // browser types\n\nvar isChromeType = function isChromeType(_ref19) {\n var name = _ref19.name;\n return name === BrowserTypes.Chrome;\n};\nvar isFirefoxType = function isFirefoxType(_ref20) {\n var name = _ref20.name;\n return name === BrowserTypes.Firefox;\n};\nvar isChromiumType = function isChromiumType(_ref21) {\n var name = _ref21.name;\n return name === BrowserTypes.Chromium;\n};\nvar isEdgeType = function isEdgeType(_ref22) {\n var name = _ref22.name;\n return name === BrowserTypes.Edge;\n};\nvar isYandexType = function isYandexType(_ref23) {\n var name = _ref23.name;\n return name === BrowserTypes.Yandex;\n};\nvar isSafariType = function isSafariType(_ref24) {\n var name = _ref24.name;\n return name === BrowserTypes.Safari || name === BrowserTypes.MobileSafari;\n};\nvar isMobileSafariType = function isMobileSafariType(_ref25) {\n var name = _ref25.name;\n return name === BrowserTypes.MobileSafari;\n};\nvar isOperaType = function isOperaType(_ref26) {\n var name = _ref26.name;\n return name === BrowserTypes.Opera;\n};\nvar isIEType = function isIEType(_ref27) {\n var name = _ref27.name;\n return name === BrowserTypes.InternetExplorer || name === BrowserTypes.Ie;\n};\nvar isMIUIType = function isMIUIType(_ref28) {\n var name = _ref28.name;\n return name === BrowserTypes.MIUI;\n};\nvar isSamsungBrowserType = function isSamsungBrowserType(_ref29) {\n var name = _ref29.name;\n return name === BrowserTypes.SamsungBrowser;\n};\nvar getBrowserFullVersion = function getBrowserFullVersion(_ref30) {\n var version = _ref30.version;\n return setDefaults(version);\n};\nvar getBrowserVersion = function getBrowserVersion(_ref31) {\n var major = _ref31.major;\n return setDefaults(major);\n};\nvar getBrowserName = function getBrowserName(_ref32) {\n var name = _ref32.name;\n return setDefaults(name);\n}; // engine types\n\nvar getEngineName = function getEngineName(_ref33) {\n var name = _ref33.name;\n return setDefaults(name);\n};\nvar getEngineVersion = function getEngineVersion(_ref34) {\n var version = _ref34.version;\n return setDefaults(version);\n};\nvar isElectronType = function isElectronType() {\n var nav = getNavigatorInstance();\n var ua = nav && nav.userAgent && nav.userAgent.toLowerCase();\n return typeof ua === 'string' ? /electron/.test(ua) : false;\n};\nvar isEdgeChromiumType = function isEdgeChromiumType(ua) {\n return typeof ua === 'string' && ua.indexOf('Edg/') !== -1;\n};\nvar getIOS13 = function getIOS13() {\n var nav = getNavigatorInstance();\n return nav && (/iPad|iPhone|iPod/.test(nav.platform) || nav.platform === 'MacIntel' && nav.maxTouchPoints > 1) && !window.MSStream;\n};\nvar getIPad13 = function getIPad13() {\n return isIOS13Check('iPad');\n};\nvar getIphone13 = function getIphone13() {\n return isIOS13Check('iPhone');\n};\nvar getIPod13 = function getIPod13() {\n return isIOS13Check('iPod');\n};\nvar getUseragent = function getUseragent(userAg) {\n return setDefaults(userAg);\n};\n\nfunction buildSelectorsObject(options) {\n var _ref = options ? options : UAHelper,\n device = _ref.device,\n browser = _ref.browser,\n os = _ref.os,\n engine = _ref.engine,\n ua = _ref.ua;\n\n return {\n isSmartTV: isSmartTVType(device),\n isConsole: isConsoleType(device),\n isWearable: isWearableType(device),\n isEmbedded: isEmbeddedType(device),\n isMobileSafari: isMobileSafariType(browser) || getIPad13(),\n isChromium: isChromiumType(browser),\n isMobile: isMobileAndTabletType(device) || getIPad13(),\n isMobileOnly: isMobileType(device),\n isTablet: isTabletType(device) || getIPad13(),\n isBrowser: isBrowserType(device),\n isDesktop: isBrowserType(device),\n isAndroid: isAndroidType(os),\n isWinPhone: isWinPhoneType(os),\n isIOS: isIOSType(os) || getIPad13(),\n isChrome: isChromeType(browser),\n isFirefox: isFirefoxType(browser),\n isSafari: isSafariType(browser),\n isOpera: isOperaType(browser),\n isIE: isIEType(browser),\n osVersion: getOsVersion(os),\n osName: getOsName(os),\n fullBrowserVersion: getBrowserFullVersion(browser),\n browserVersion: getBrowserVersion(browser),\n browserName: getBrowserName(browser),\n mobileVendor: getMobileVendor(device),\n mobileModel: getMobileModel(device),\n engineName: getEngineName(engine),\n engineVersion: getEngineVersion(engine),\n getUA: getUseragent(ua),\n isEdge: isEdgeType(browser) || isEdgeChromiumType(ua),\n isYandex: isYandexType(browser),\n deviceType: getDeviceType(device),\n isIOS13: getIOS13(),\n isIPad13: getIPad13(),\n isIPhone13: getIphone13(),\n isIPod13: getIPod13(),\n isElectron: isElectronType(),\n isEdgeChromium: isEdgeChromiumType(ua),\n isLegacyEdge: isEdgeType(browser) && !isEdgeChromiumType(ua),\n isWindows: isWindowsType(os),\n isMacOs: isMacOsType(os),\n isMIUI: isMIUIType(browser),\n isSamsungBrowser: isSamsungBrowserType(browser)\n };\n}\n\nvar isSmartTV = isSmartTVType(device);\nvar isConsole = isConsoleType(device);\nvar isWearable = isWearableType(device);\nvar isEmbedded = isEmbeddedType(device);\nvar isMobileSafari = isMobileSafariType(browser) || getIPad13();\nvar isChromium = isChromiumType(browser);\nvar isMobile = isMobileAndTabletType(device) || getIPad13();\nvar isMobileOnly = isMobileType(device);\nvar isTablet = isTabletType(device) || getIPad13();\nvar isBrowser = isBrowserType(device);\nvar isDesktop = isBrowserType(device);\nvar isAndroid = isAndroidType(os);\nvar isWinPhone = isWinPhoneType(os);\nvar isIOS = isIOSType(os) || getIPad13();\nvar isChrome = isChromeType(browser);\nvar isFirefox = isFirefoxType(browser);\nvar isSafari = isSafariType(browser);\nvar isOpera = isOperaType(browser);\nvar isIE = isIEType(browser);\nvar osVersion = getOsVersion(os);\nvar osName = getOsName(os);\nvar fullBrowserVersion = getBrowserFullVersion(browser);\nvar browserVersion = getBrowserVersion(browser);\nvar browserName = getBrowserName(browser);\nvar mobileVendor = getMobileVendor(device);\nvar mobileModel = getMobileModel(device);\nvar engineName = getEngineName(engine);\nvar engineVersion = getEngineVersion(engine);\nvar getUA = getUseragent(ua);\nvar isEdge = isEdgeType(browser) || isEdgeChromiumType(ua);\nvar isYandex = isYandexType(browser);\nvar deviceType = getDeviceType(device);\nvar isIOS13 = getIOS13();\nvar isIPad13 = getIPad13();\nvar isIPhone13 = getIphone13();\nvar isIPod13 = getIPod13();\nvar isElectron = isElectronType();\nvar isEdgeChromium = isEdgeChromiumType(ua);\nvar isLegacyEdge = isEdgeType(browser) && !isEdgeChromiumType(ua);\nvar isWindows = isWindowsType(os);\nvar isMacOs = isMacOsType(os);\nvar isMIUI = isMIUIType(browser);\nvar isSamsungBrowser = isSamsungBrowserType(browser);\nvar getSelectorsByUserAgent = function getSelectorsByUserAgent(userAgent) {\n if (!userAgent || typeof userAgent !== 'string') {\n console.error('No valid user agent string was provided');\n return;\n }\n\n var _UAHelper$parseUserAg = parseUserAgent(userAgent),\n device = _UAHelper$parseUserAg.device,\n browser = _UAHelper$parseUserAg.browser,\n os = _UAHelper$parseUserAg.os,\n engine = _UAHelper$parseUserAg.engine,\n ua = _UAHelper$parseUserAg.ua;\n\n return buildSelectorsObject({\n device: device,\n browser: browser,\n os: os,\n engine: engine,\n ua: ua\n });\n};\n\nvar AndroidView = function AndroidView(_ref) {\n var renderWithFragment = _ref.renderWithFragment,\n children = _ref.children,\n props = _objectWithoutProperties(_ref, [\"renderWithFragment\", \"children\"]);\n\n return isAndroid ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar BrowserView = function BrowserView(_ref2) {\n var renderWithFragment = _ref2.renderWithFragment,\n children = _ref2.children,\n props = _objectWithoutProperties(_ref2, [\"renderWithFragment\", \"children\"]);\n\n return isBrowser ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar IEView = function IEView(_ref3) {\n var renderWithFragment = _ref3.renderWithFragment,\n children = _ref3.children,\n props = _objectWithoutProperties(_ref3, [\"renderWithFragment\", \"children\"]);\n\n return isIE ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar IOSView = function IOSView(_ref4) {\n var renderWithFragment = _ref4.renderWithFragment,\n children = _ref4.children,\n props = _objectWithoutProperties(_ref4, [\"renderWithFragment\", \"children\"]);\n\n return isIOS ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar MobileView = function MobileView(_ref5) {\n var renderWithFragment = _ref5.renderWithFragment,\n children = _ref5.children,\n props = _objectWithoutProperties(_ref5, [\"renderWithFragment\", \"children\"]);\n\n return isMobile ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar TabletView = function TabletView(_ref6) {\n var renderWithFragment = _ref6.renderWithFragment,\n children = _ref6.children,\n props = _objectWithoutProperties(_ref6, [\"renderWithFragment\", \"children\"]);\n\n return isTablet ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar WinPhoneView = function WinPhoneView(_ref7) {\n var renderWithFragment = _ref7.renderWithFragment,\n children = _ref7.children,\n props = _objectWithoutProperties(_ref7, [\"renderWithFragment\", \"children\"]);\n\n return isWinPhone ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar MobileOnlyView = function MobileOnlyView(_ref8) {\n var renderWithFragment = _ref8.renderWithFragment,\n children = _ref8.children,\n viewClassName = _ref8.viewClassName,\n style = _ref8.style,\n props = _objectWithoutProperties(_ref8, [\"renderWithFragment\", \"children\", \"viewClassName\", \"style\"]);\n\n return isMobileOnly ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar SmartTVView = function SmartTVView(_ref9) {\n var renderWithFragment = _ref9.renderWithFragment,\n children = _ref9.children,\n props = _objectWithoutProperties(_ref9, [\"renderWithFragment\", \"children\"]);\n\n return isSmartTV ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar ConsoleView = function ConsoleView(_ref10) {\n var renderWithFragment = _ref10.renderWithFragment,\n children = _ref10.children,\n props = _objectWithoutProperties(_ref10, [\"renderWithFragment\", \"children\"]);\n\n return isConsole ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar WearableView = function WearableView(_ref11) {\n var renderWithFragment = _ref11.renderWithFragment,\n children = _ref11.children,\n props = _objectWithoutProperties(_ref11, [\"renderWithFragment\", \"children\"]);\n\n return isWearable ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\nvar CustomView = function CustomView(_ref12) {\n var renderWithFragment = _ref12.renderWithFragment,\n children = _ref12.children,\n viewClassName = _ref12.viewClassName,\n style = _ref12.style,\n condition = _ref12.condition,\n props = _objectWithoutProperties(_ref12, [\"renderWithFragment\", \"children\", \"viewClassName\", \"style\", \"condition\"]);\n\n return condition ? renderWithFragment ? React__default.createElement(React.Fragment, null, children) : React__default.createElement(\"div\", props, children) : null;\n};\n\nfunction withOrientationChange(WrappedComponent) {\n return /*#__PURE__*/function (_React$Component) {\n _inherits(_class, _React$Component);\n\n function _class(props) {\n var _this;\n\n _classCallCheck(this, _class);\n\n _this = _possibleConstructorReturn(this, _getPrototypeOf(_class).call(this, props));\n _this.isEventListenerAdded = false;\n _this.handleOrientationChange = _this.handleOrientationChange.bind(_assertThisInitialized(_this));\n _this.onOrientationChange = _this.onOrientationChange.bind(_assertThisInitialized(_this));\n _this.onPageLoad = _this.onPageLoad.bind(_assertThisInitialized(_this));\n _this.state = {\n isLandscape: false,\n isPortrait: false\n };\n return _this;\n }\n\n _createClass(_class, [{\n key: \"handleOrientationChange\",\n value: function handleOrientationChange() {\n if (!this.isEventListenerAdded) {\n this.isEventListenerAdded = true;\n }\n\n var orientation = window.innerWidth > window.innerHeight ? 90 : 0;\n this.setState({\n isPortrait: orientation === 0,\n isLandscape: orientation === 90\n });\n }\n }, {\n key: \"onOrientationChange\",\n value: function onOrientationChange() {\n this.handleOrientationChange();\n }\n }, {\n key: \"onPageLoad\",\n value: function onPageLoad() {\n this.handleOrientationChange();\n }\n }, {\n key: \"componentDidMount\",\n value: function componentDidMount() {\n if ((typeof window === \"undefined\" ? \"undefined\" : _typeof(window)) !== undefined && isMobile) {\n if (!this.isEventListenerAdded) {\n this.handleOrientationChange();\n window.addEventListener(\"load\", this.onPageLoad, false);\n } else {\n window.removeEventListener(\"load\", this.onPageLoad, false);\n }\n\n window.addEventListener(\"resize\", this.onOrientationChange, false);\n }\n }\n }, {\n key: \"componentWillUnmount\",\n value: function componentWillUnmount() {\n window.removeEventListener(\"resize\", this.onOrientationChange, false);\n }\n }, {\n key: \"render\",\n value: function render() {\n return React__default.createElement(WrappedComponent, _extends({}, this.props, {\n isLandscape: this.state.isLandscape,\n isPortrait: this.state.isPortrait\n }));\n }\n }]);\n\n return _class;\n }(React__default.Component);\n}\n\nfunction useMobileOrientation() {\n var _useState = React.useState(function () {\n var orientation = window.innerWidth > window.innerHeight ? 90 : 0;\n return {\n isPortrait: orientation === 0,\n isLandscape: orientation === 90,\n orientation: orientation === 0 ? 'portrait' : 'landscape'\n };\n }),\n _useState2 = _slicedToArray(_useState, 2),\n state = _useState2[0],\n setState = _useState2[1];\n\n var handleOrientationChange = React.useCallback(function () {\n var orientation = window.innerWidth > window.innerHeight ? 90 : 0;\n var next = {\n isPortrait: orientation === 0,\n isLandscape: orientation === 90,\n orientation: orientation === 0 ? 'portrait' : 'landscape'\n };\n state.orientation !== next.orientation && setState(next);\n }, [state.orientation]);\n React.useEffect(function () {\n if ((typeof window === \"undefined\" ? \"undefined\" : _typeof(window)) !== undefined && isMobile) {\n handleOrientationChange();\n window.addEventListener(\"load\", handleOrientationChange, false);\n window.addEventListener(\"resize\", handleOrientationChange, false);\n }\n\n return function () {\n window.removeEventListener(\"resize\", handleOrientationChange, false);\n window.removeEventListener(\"load\", handleOrientationChange, false);\n };\n }, [handleOrientationChange]);\n return state;\n}\n\nfunction useDeviceData(userAgent) {\n var hookUserAgent = userAgent ? userAgent : window.navigator.userAgent;\n return parseUserAgent(hookUserAgent);\n}\n\nfunction useDeviceSelectors(userAgent) {\n var hookUserAgent = userAgent ? userAgent : window.navigator.userAgent;\n var deviceData = useDeviceData(hookUserAgent);\n var selectors = buildSelectorsObject(deviceData);\n return [selectors, deviceData];\n}\n\nexports.AndroidView = AndroidView;\nexports.BrowserTypes = BrowserTypes;\nexports.BrowserView = BrowserView;\nexports.ConsoleView = ConsoleView;\nexports.CustomView = CustomView;\nexports.IEView = IEView;\nexports.IOSView = IOSView;\nexports.MobileOnlyView = MobileOnlyView;\nexports.MobileView = MobileView;\nexports.OsTypes = OsTypes;\nexports.SmartTVView = SmartTVView;\nexports.TabletView = TabletView;\nexports.WearableView = WearableView;\nexports.WinPhoneView = WinPhoneView;\nexports.browserName = browserName;\nexports.browserVersion = browserVersion;\nexports.deviceDetect = deviceDetect;\nexports.deviceType = deviceType;\nexports.engineName = engineName;\nexports.engineVersion = engineVersion;\nexports.fullBrowserVersion = fullBrowserVersion;\nexports.getSelectorsByUserAgent = getSelectorsByUserAgent;\nexports.getUA = getUA;\nexports.isAndroid = isAndroid;\nexports.isBrowser = isBrowser;\nexports.isChrome = isChrome;\nexports.isChromium = isChromium;\nexports.isConsole = isConsole;\nexports.isDesktop = isDesktop;\nexports.isEdge = isEdge;\nexports.isEdgeChromium = isEdgeChromium;\nexports.isElectron = isElectron;\nexports.isEmbedded = isEmbedded;\nexports.isFirefox = isFirefox;\nexports.isIE = isIE;\nexports.isIOS = isIOS;\nexports.isIOS13 = isIOS13;\nexports.isIPad13 = isIPad13;\nexports.isIPhone13 = isIPhone13;\nexports.isIPod13 = isIPod13;\nexports.isLegacyEdge = isLegacyEdge;\nexports.isMIUI = isMIUI;\nexports.isMacOs = isMacOs;\nexports.isMobile = isMobile;\nexports.isMobileOnly = isMobileOnly;\nexports.isMobileSafari = isMobileSafari;\nexports.isOpera = isOpera;\nexports.isSafari = isSafari;\nexports.isSamsungBrowser = isSamsungBrowser;\nexports.isSmartTV = isSmartTV;\nexports.isTablet = isTablet;\nexports.isWearable = isWearable;\nexports.isWinPhone = isWinPhone;\nexports.isWindows = isWindows;\nexports.isYandex = isYandex;\nexports.mobileModel = mobileModel;\nexports.mobileVendor = mobileVendor;\nexports.osName = osName;\nexports.osVersion = osVersion;\nexports.parseUserAgent = parseUserAgent;\nexports.setUserAgent = setUserAgent;\nexports.useDeviceData = useDeviceData;\nexports.useDeviceSelectors = useDeviceSelectors;\nexports.useMobileOrientation = useMobileOrientation;\nexports.withOrientationChange = withOrientationChange;\n","// Use throughout your app instead of plain `useDispatch` and `useSelector`\r\nimport { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'\r\nimport { AppDispatch, RootState } from '../redux/store'\r\n\r\n// Returns TypeScript-save hooks\r\nexport const useAppDispatch = () => useDispatch()\r\nexport const useAppSelector: TypedUseSelectorHook = useSelector\r\n","import { useState, useEffect, useCallback } from 'react'\r\n\r\nfunction useGracefulHover(onEnter: () => void, onLeave: () => void, enterDelay: number = 500, leaveDelay: number = 500) {\r\n const [enterTimer, setEnterTimer] = useState(null)\r\n const [leaveTimer, setLeaveTimer] = useState(null)\r\n\r\n const handleMouseEnter = useCallback(() => {\r\n // Bricht einen möglichen leaveTimer ab und setzt ihn zurück\r\n if (leaveTimer) {\r\n clearTimeout(leaveTimer)\r\n setLeaveTimer(null)\r\n }\r\n // Setzt einen neuen Timer nur wenn noch kein Timer aktiv ist\r\n if (!enterTimer) {\r\n const newEnterTimer = setTimeout(() => {\r\n onEnter()\r\n }, enterDelay)\r\n setEnterTimer(newEnterTimer)\r\n }\r\n }, [onEnter, enterDelay, enterTimer, leaveTimer])\r\n\r\n const handleMouseLeave = useCallback(() => {\r\n // Bricht einen möglichen enterTimer ab und setzt ihn zurück\r\n if (enterTimer) {\r\n clearTimeout(enterTimer)\r\n setEnterTimer(null)\r\n }\r\n // Setzt einen neuen Timer nur wenn noch kein Timer aktiv ist\r\n if (!leaveTimer) {\r\n const newLeaveTimer = setTimeout(() => {\r\n onLeave()\r\n }, leaveDelay)\r\n setLeaveTimer(newLeaveTimer)\r\n }\r\n }, [onLeave, leaveDelay, enterTimer, leaveTimer])\r\n\r\n useEffect(() => {\r\n // Bereinigungsfunktion, die sicherstellt, dass alle Timer bei der Demontage der Komponente gelöscht werden\r\n return () => {\r\n if (enterTimer !== null) clearTimeout(enterTimer)\r\n if (leaveTimer !== null) clearTimeout(leaveTimer)\r\n }\r\n }, [enterTimer, leaveTimer])\r\n\r\n return { handleMouseEnter, handleMouseLeave }\r\n}\r\n\r\nexport default useGracefulHover\r\n","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M10.27 12h3.46c.93 0 1.63-.83 1.48-1.75l-.3-1.79C14.67 7.04 13.44 6 12 6S9.33 7.04 9.09 8.47l-.3 1.79c-.15.91.55 1.74 1.48 1.74m-8.61-.89c-.13.26-.18.57-.1.88.16.69.76 1.03 1.53 1h1.95c.83 0 1.51-.58 1.51-1.29 0-.14-.03-.27-.07-.4-.01-.03-.01-.05.01-.08.09-.16.14-.34.14-.53 0-.31-.14-.6-.36-.82-.03-.03-.03-.06-.02-.1.07-.2.07-.43.01-.65-.16-.43-.55-.72-.99-.74-.03 0-.05-.01-.07-.03-.17-.21-.48-.35-.83-.35-.3 0-.57.1-.75.26-.03.03-.06.03-.09.02-.14-.06-.3-.09-.46-.09-.65 0-1.18.49-1.24 1.12 0 .02-.01.04-.03.06-.29.26-.46.65-.41 1.05.03.22.12.43.25.6.03.02.03.06.02.09m14.58 2.54c-1.17-.52-2.61-.9-4.24-.9-1.63 0-3.07.39-4.24.9C6.68 14.13 6 15.21 6 16.39V18h12v-1.61c0-1.18-.68-2.26-1.76-2.74m-15.02.93C.48 14.9 0 15.62 0 16.43V18h4.5v-1.61c0-.83.23-1.61.63-2.29-.37-.06-.74-.1-1.13-.1-.99 0-1.93.21-2.78.58m21.56 0c-.85-.37-1.79-.58-2.78-.58-.39 0-.76.04-1.13.1.4.68.63 1.46.63 2.29V18H24v-1.57c0-.81-.48-1.53-1.22-1.85M22 11v-.5c0-1.1-.9-2-2-2h-2c-.42 0-.65.48-.39.81l.7.63c-.19.31-.31.67-.31 1.06 0 1.1.9 2 2 2s2-.9 2-2\"\n}), 'Groups2');","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4m0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4\"\n}), 'Person');","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8zm4 18H6V4h7v5h5zM8 15.01l1.41 1.41L11 14.84V19h2v-4.16l1.59 1.59L16 15.01 12.01 11z\"\n}), 'UploadFile');","/**\n * MIT License\n * \n * Copyright (c) 2014-present, Lee Byron and other contributors.\n * \n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n * \n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n * \n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\nvar DELETE = 'delete';\n\n// Constants describing the size of trie nodes.\nvar SHIFT = 5; // Resulted in best performance after ______?\nvar SIZE = 1 << SHIFT;\nvar MASK = SIZE - 1;\n\n// A consistent shared value representing \"not set\" which equals nothing other\n// than itself, and nothing that could be provided externally.\nvar NOT_SET = {};\n\n// Boolean references, Rough equivalent of `bool &`.\nfunction MakeRef() {\n return { value: false };\n}\n\nfunction SetRef(ref) {\n if (ref) {\n ref.value = true;\n }\n}\n\n// A function which returns a value representing an \"owner\" for transient writes\n// to tries. The return value will only ever equal itself, and will not equal\n// the return of any subsequent call of this function.\nfunction OwnerID() {}\n\nfunction ensureSize(iter) {\n if (iter.size === undefined) {\n iter.size = iter.__iterate(returnTrue);\n }\n return iter.size;\n}\n\nfunction wrapIndex(iter, index) {\n // This implements \"is array index\" which the ECMAString spec defines as:\n //\n // A String property name P is an array index if and only if\n // ToString(ToUint32(P)) is equal to P and ToUint32(P) is not equal\n // to 2^32−1.\n //\n // http://www.ecma-international.org/ecma-262/6.0/#sec-array-exotic-objects\n if (typeof index !== 'number') {\n var uint32Index = index >>> 0; // N >>> 0 is shorthand for ToUint32\n if ('' + uint32Index !== index || uint32Index === 4294967295) {\n return NaN;\n }\n index = uint32Index;\n }\n return index < 0 ? ensureSize(iter) + index : index;\n}\n\nfunction returnTrue() {\n return true;\n}\n\nfunction wholeSlice(begin, end, size) {\n return (\n ((begin === 0 && !isNeg(begin)) ||\n (size !== undefined && begin <= -size)) &&\n (end === undefined || (size !== undefined && end >= size))\n );\n}\n\nfunction resolveBegin(begin, size) {\n return resolveIndex(begin, size, 0);\n}\n\nfunction resolveEnd(end, size) {\n return resolveIndex(end, size, size);\n}\n\nfunction resolveIndex(index, size, defaultIndex) {\n // Sanitize indices using this shorthand for ToInt32(argument)\n // http://www.ecma-international.org/ecma-262/6.0/#sec-toint32\n return index === undefined\n ? defaultIndex\n : isNeg(index)\n ? size === Infinity\n ? size\n : Math.max(0, size + index) | 0\n : size === undefined || size === index\n ? index\n : Math.min(size, index) | 0;\n}\n\nfunction isNeg(value) {\n // Account for -0 which is negative, but not less than 0.\n return value < 0 || (value === 0 && 1 / value === -Infinity);\n}\n\nvar IS_COLLECTION_SYMBOL = '@@__IMMUTABLE_ITERABLE__@@';\n\nfunction isCollection(maybeCollection) {\n return Boolean(maybeCollection && maybeCollection[IS_COLLECTION_SYMBOL]);\n}\n\nvar IS_KEYED_SYMBOL = '@@__IMMUTABLE_KEYED__@@';\n\nfunction isKeyed(maybeKeyed) {\n return Boolean(maybeKeyed && maybeKeyed[IS_KEYED_SYMBOL]);\n}\n\nvar IS_INDEXED_SYMBOL = '@@__IMMUTABLE_INDEXED__@@';\n\nfunction isIndexed(maybeIndexed) {\n return Boolean(maybeIndexed && maybeIndexed[IS_INDEXED_SYMBOL]);\n}\n\nfunction isAssociative(maybeAssociative) {\n return isKeyed(maybeAssociative) || isIndexed(maybeAssociative);\n}\n\nvar Collection = function Collection(value) {\n // eslint-disable-next-line no-constructor-return\n return isCollection(value) ? value : Seq(value);\n};\n\nvar KeyedCollection = /*@__PURE__*/(function (Collection) {\n function KeyedCollection(value) {\n // eslint-disable-next-line no-constructor-return\n return isKeyed(value) ? value : KeyedSeq(value);\n }\n\n if ( Collection ) KeyedCollection.__proto__ = Collection;\n KeyedCollection.prototype = Object.create( Collection && Collection.prototype );\n KeyedCollection.prototype.constructor = KeyedCollection;\n\n return KeyedCollection;\n}(Collection));\n\nvar IndexedCollection = /*@__PURE__*/(function (Collection) {\n function IndexedCollection(value) {\n // eslint-disable-next-line no-constructor-return\n return isIndexed(value) ? value : IndexedSeq(value);\n }\n\n if ( Collection ) IndexedCollection.__proto__ = Collection;\n IndexedCollection.prototype = Object.create( Collection && Collection.prototype );\n IndexedCollection.prototype.constructor = IndexedCollection;\n\n return IndexedCollection;\n}(Collection));\n\nvar SetCollection = /*@__PURE__*/(function (Collection) {\n function SetCollection(value) {\n // eslint-disable-next-line no-constructor-return\n return isCollection(value) && !isAssociative(value) ? value : SetSeq(value);\n }\n\n if ( Collection ) SetCollection.__proto__ = Collection;\n SetCollection.prototype = Object.create( Collection && Collection.prototype );\n SetCollection.prototype.constructor = SetCollection;\n\n return SetCollection;\n}(Collection));\n\nCollection.Keyed = KeyedCollection;\nCollection.Indexed = IndexedCollection;\nCollection.Set = SetCollection;\n\nvar IS_SEQ_SYMBOL = '@@__IMMUTABLE_SEQ__@@';\n\nfunction isSeq(maybeSeq) {\n return Boolean(maybeSeq && maybeSeq[IS_SEQ_SYMBOL]);\n}\n\nvar IS_RECORD_SYMBOL = '@@__IMMUTABLE_RECORD__@@';\n\nfunction isRecord(maybeRecord) {\n return Boolean(maybeRecord && maybeRecord[IS_RECORD_SYMBOL]);\n}\n\nfunction isImmutable(maybeImmutable) {\n return isCollection(maybeImmutable) || isRecord(maybeImmutable);\n}\n\nvar IS_ORDERED_SYMBOL = '@@__IMMUTABLE_ORDERED__@@';\n\nfunction isOrdered(maybeOrdered) {\n return Boolean(maybeOrdered && maybeOrdered[IS_ORDERED_SYMBOL]);\n}\n\nvar ITERATE_KEYS = 0;\nvar ITERATE_VALUES = 1;\nvar ITERATE_ENTRIES = 2;\n\nvar REAL_ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;\nvar FAUX_ITERATOR_SYMBOL = '@@iterator';\n\nvar ITERATOR_SYMBOL = REAL_ITERATOR_SYMBOL || FAUX_ITERATOR_SYMBOL;\n\nvar Iterator = function Iterator(next) {\n this.next = next;\n};\n\nIterator.prototype.toString = function toString () {\n return '[Iterator]';\n};\n\nIterator.KEYS = ITERATE_KEYS;\nIterator.VALUES = ITERATE_VALUES;\nIterator.ENTRIES = ITERATE_ENTRIES;\n\nIterator.prototype.inspect = Iterator.prototype.toSource = function () {\n return this.toString();\n};\nIterator.prototype[ITERATOR_SYMBOL] = function () {\n return this;\n};\n\nfunction iteratorValue(type, k, v, iteratorResult) {\n var value = type === 0 ? k : type === 1 ? v : [k, v];\n iteratorResult\n ? (iteratorResult.value = value)\n : (iteratorResult = {\n value: value,\n done: false,\n });\n return iteratorResult;\n}\n\nfunction iteratorDone() {\n return { value: undefined, done: true };\n}\n\nfunction hasIterator(maybeIterable) {\n if (Array.isArray(maybeIterable)) {\n // IE11 trick as it does not support `Symbol.iterator`\n return true;\n }\n\n return !!getIteratorFn(maybeIterable);\n}\n\nfunction isIterator(maybeIterator) {\n return maybeIterator && typeof maybeIterator.next === 'function';\n}\n\nfunction getIterator(iterable) {\n var iteratorFn = getIteratorFn(iterable);\n return iteratorFn && iteratorFn.call(iterable);\n}\n\nfunction getIteratorFn(iterable) {\n var iteratorFn =\n iterable &&\n ((REAL_ITERATOR_SYMBOL && iterable[REAL_ITERATOR_SYMBOL]) ||\n iterable[FAUX_ITERATOR_SYMBOL]);\n if (typeof iteratorFn === 'function') {\n return iteratorFn;\n }\n}\n\nfunction isEntriesIterable(maybeIterable) {\n var iteratorFn = getIteratorFn(maybeIterable);\n return iteratorFn && iteratorFn === maybeIterable.entries;\n}\n\nfunction isKeysIterable(maybeIterable) {\n var iteratorFn = getIteratorFn(maybeIterable);\n return iteratorFn && iteratorFn === maybeIterable.keys;\n}\n\nvar hasOwnProperty = Object.prototype.hasOwnProperty;\n\nfunction isArrayLike(value) {\n if (Array.isArray(value) || typeof value === 'string') {\n return true;\n }\n\n return (\n value &&\n typeof value === 'object' &&\n Number.isInteger(value.length) &&\n value.length >= 0 &&\n (value.length === 0\n ? // Only {length: 0} is considered Array-like.\n Object.keys(value).length === 1\n : // An object is only Array-like if it has a property where the last value\n // in the array-like may be found (which could be undefined).\n value.hasOwnProperty(value.length - 1))\n );\n}\n\nvar Seq = /*@__PURE__*/(function (Collection) {\n function Seq(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptySequence()\n : isImmutable(value)\n ? value.toSeq()\n : seqFromValue(value);\n }\n\n if ( Collection ) Seq.__proto__ = Collection;\n Seq.prototype = Object.create( Collection && Collection.prototype );\n Seq.prototype.constructor = Seq;\n\n Seq.prototype.toSeq = function toSeq () {\n return this;\n };\n\n Seq.prototype.toString = function toString () {\n return this.__toString('Seq {', '}');\n };\n\n Seq.prototype.cacheResult = function cacheResult () {\n if (!this._cache && this.__iterateUncached) {\n this._cache = this.entrySeq().toArray();\n this.size = this._cache.length;\n }\n return this;\n };\n\n // abstract __iterateUncached(fn, reverse)\n\n Seq.prototype.__iterate = function __iterate (fn, reverse) {\n var cache = this._cache;\n if (cache) {\n var size = cache.length;\n var i = 0;\n while (i !== size) {\n var entry = cache[reverse ? size - ++i : i++];\n if (fn(entry[1], entry[0], this) === false) {\n break;\n }\n }\n return i;\n }\n return this.__iterateUncached(fn, reverse);\n };\n\n // abstract __iteratorUncached(type, reverse)\n\n Seq.prototype.__iterator = function __iterator (type, reverse) {\n var cache = this._cache;\n if (cache) {\n var size = cache.length;\n var i = 0;\n return new Iterator(function () {\n if (i === size) {\n return iteratorDone();\n }\n var entry = cache[reverse ? size - ++i : i++];\n return iteratorValue(type, entry[0], entry[1]);\n });\n }\n return this.__iteratorUncached(type, reverse);\n };\n\n return Seq;\n}(Collection));\n\nvar KeyedSeq = /*@__PURE__*/(function (Seq) {\n function KeyedSeq(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptySequence().toKeyedSeq()\n : isCollection(value)\n ? isKeyed(value)\n ? value.toSeq()\n : value.fromEntrySeq()\n : isRecord(value)\n ? value.toSeq()\n : keyedSeqFromValue(value);\n }\n\n if ( Seq ) KeyedSeq.__proto__ = Seq;\n KeyedSeq.prototype = Object.create( Seq && Seq.prototype );\n KeyedSeq.prototype.constructor = KeyedSeq;\n\n KeyedSeq.prototype.toKeyedSeq = function toKeyedSeq () {\n return this;\n };\n\n return KeyedSeq;\n}(Seq));\n\nvar IndexedSeq = /*@__PURE__*/(function (Seq) {\n function IndexedSeq(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptySequence()\n : isCollection(value)\n ? isKeyed(value)\n ? value.entrySeq()\n : value.toIndexedSeq()\n : isRecord(value)\n ? value.toSeq().entrySeq()\n : indexedSeqFromValue(value);\n }\n\n if ( Seq ) IndexedSeq.__proto__ = Seq;\n IndexedSeq.prototype = Object.create( Seq && Seq.prototype );\n IndexedSeq.prototype.constructor = IndexedSeq;\n\n IndexedSeq.of = function of (/*...values*/) {\n return IndexedSeq(arguments);\n };\n\n IndexedSeq.prototype.toIndexedSeq = function toIndexedSeq () {\n return this;\n };\n\n IndexedSeq.prototype.toString = function toString () {\n return this.__toString('Seq [', ']');\n };\n\n return IndexedSeq;\n}(Seq));\n\nvar SetSeq = /*@__PURE__*/(function (Seq) {\n function SetSeq(value) {\n // eslint-disable-next-line no-constructor-return\n return (\n isCollection(value) && !isAssociative(value) ? value : IndexedSeq(value)\n ).toSetSeq();\n }\n\n if ( Seq ) SetSeq.__proto__ = Seq;\n SetSeq.prototype = Object.create( Seq && Seq.prototype );\n SetSeq.prototype.constructor = SetSeq;\n\n SetSeq.of = function of (/*...values*/) {\n return SetSeq(arguments);\n };\n\n SetSeq.prototype.toSetSeq = function toSetSeq () {\n return this;\n };\n\n return SetSeq;\n}(Seq));\n\nSeq.isSeq = isSeq;\nSeq.Keyed = KeyedSeq;\nSeq.Set = SetSeq;\nSeq.Indexed = IndexedSeq;\n\nSeq.prototype[IS_SEQ_SYMBOL] = true;\n\n// #pragma Root Sequences\n\nvar ArraySeq = /*@__PURE__*/(function (IndexedSeq) {\n function ArraySeq(array) {\n this._array = array;\n this.size = array.length;\n }\n\n if ( IndexedSeq ) ArraySeq.__proto__ = IndexedSeq;\n ArraySeq.prototype = Object.create( IndexedSeq && IndexedSeq.prototype );\n ArraySeq.prototype.constructor = ArraySeq;\n\n ArraySeq.prototype.get = function get (index, notSetValue) {\n return this.has(index) ? this._array[wrapIndex(this, index)] : notSetValue;\n };\n\n ArraySeq.prototype.__iterate = function __iterate (fn, reverse) {\n var array = this._array;\n var size = array.length;\n var i = 0;\n while (i !== size) {\n var ii = reverse ? size - ++i : i++;\n if (fn(array[ii], ii, this) === false) {\n break;\n }\n }\n return i;\n };\n\n ArraySeq.prototype.__iterator = function __iterator (type, reverse) {\n var array = this._array;\n var size = array.length;\n var i = 0;\n return new Iterator(function () {\n if (i === size) {\n return iteratorDone();\n }\n var ii = reverse ? size - ++i : i++;\n return iteratorValue(type, ii, array[ii]);\n });\n };\n\n return ArraySeq;\n}(IndexedSeq));\n\nvar ObjectSeq = /*@__PURE__*/(function (KeyedSeq) {\n function ObjectSeq(object) {\n var keys = Object.keys(object).concat(\n Object.getOwnPropertySymbols ? Object.getOwnPropertySymbols(object) : []\n );\n this._object = object;\n this._keys = keys;\n this.size = keys.length;\n }\n\n if ( KeyedSeq ) ObjectSeq.__proto__ = KeyedSeq;\n ObjectSeq.prototype = Object.create( KeyedSeq && KeyedSeq.prototype );\n ObjectSeq.prototype.constructor = ObjectSeq;\n\n ObjectSeq.prototype.get = function get (key, notSetValue) {\n if (notSetValue !== undefined && !this.has(key)) {\n return notSetValue;\n }\n return this._object[key];\n };\n\n ObjectSeq.prototype.has = function has (key) {\n return hasOwnProperty.call(this._object, key);\n };\n\n ObjectSeq.prototype.__iterate = function __iterate (fn, reverse) {\n var object = this._object;\n var keys = this._keys;\n var size = keys.length;\n var i = 0;\n while (i !== size) {\n var key = keys[reverse ? size - ++i : i++];\n if (fn(object[key], key, this) === false) {\n break;\n }\n }\n return i;\n };\n\n ObjectSeq.prototype.__iterator = function __iterator (type, reverse) {\n var object = this._object;\n var keys = this._keys;\n var size = keys.length;\n var i = 0;\n return new Iterator(function () {\n if (i === size) {\n return iteratorDone();\n }\n var key = keys[reverse ? size - ++i : i++];\n return iteratorValue(type, key, object[key]);\n });\n };\n\n return ObjectSeq;\n}(KeyedSeq));\nObjectSeq.prototype[IS_ORDERED_SYMBOL] = true;\n\nvar CollectionSeq = /*@__PURE__*/(function (IndexedSeq) {\n function CollectionSeq(collection) {\n this._collection = collection;\n this.size = collection.length || collection.size;\n }\n\n if ( IndexedSeq ) CollectionSeq.__proto__ = IndexedSeq;\n CollectionSeq.prototype = Object.create( IndexedSeq && IndexedSeq.prototype );\n CollectionSeq.prototype.constructor = CollectionSeq;\n\n CollectionSeq.prototype.__iterateUncached = function __iterateUncached (fn, reverse) {\n if (reverse) {\n return this.cacheResult().__iterate(fn, reverse);\n }\n var collection = this._collection;\n var iterator = getIterator(collection);\n var iterations = 0;\n if (isIterator(iterator)) {\n var step;\n while (!(step = iterator.next()).done) {\n if (fn(step.value, iterations++, this) === false) {\n break;\n }\n }\n }\n return iterations;\n };\n\n CollectionSeq.prototype.__iteratorUncached = function __iteratorUncached (type, reverse) {\n if (reverse) {\n return this.cacheResult().__iterator(type, reverse);\n }\n var collection = this._collection;\n var iterator = getIterator(collection);\n if (!isIterator(iterator)) {\n return new Iterator(iteratorDone);\n }\n var iterations = 0;\n return new Iterator(function () {\n var step = iterator.next();\n return step.done ? step : iteratorValue(type, iterations++, step.value);\n });\n };\n\n return CollectionSeq;\n}(IndexedSeq));\n\n// # pragma Helper functions\n\nvar EMPTY_SEQ;\n\nfunction emptySequence() {\n return EMPTY_SEQ || (EMPTY_SEQ = new ArraySeq([]));\n}\n\nfunction keyedSeqFromValue(value) {\n var seq = maybeIndexedSeqFromValue(value);\n if (seq) {\n return seq.fromEntrySeq();\n }\n if (typeof value === 'object') {\n return new ObjectSeq(value);\n }\n throw new TypeError(\n 'Expected Array or collection object of [k, v] entries, or keyed object: ' +\n value\n );\n}\n\nfunction indexedSeqFromValue(value) {\n var seq = maybeIndexedSeqFromValue(value);\n if (seq) {\n return seq;\n }\n throw new TypeError(\n 'Expected Array or collection object of values: ' + value\n );\n}\n\nfunction seqFromValue(value) {\n var seq = maybeIndexedSeqFromValue(value);\n if (seq) {\n return isEntriesIterable(value)\n ? seq.fromEntrySeq()\n : isKeysIterable(value)\n ? seq.toSetSeq()\n : seq;\n }\n if (typeof value === 'object') {\n return new ObjectSeq(value);\n }\n throw new TypeError(\n 'Expected Array or collection object of values, or keyed object: ' + value\n );\n}\n\nfunction maybeIndexedSeqFromValue(value) {\n return isArrayLike(value)\n ? new ArraySeq(value)\n : hasIterator(value)\n ? new CollectionSeq(value)\n : undefined;\n}\n\nvar IS_MAP_SYMBOL = '@@__IMMUTABLE_MAP__@@';\n\nfunction isMap(maybeMap) {\n return Boolean(maybeMap && maybeMap[IS_MAP_SYMBOL]);\n}\n\nfunction isOrderedMap(maybeOrderedMap) {\n return isMap(maybeOrderedMap) && isOrdered(maybeOrderedMap);\n}\n\nfunction isValueObject(maybeValue) {\n return Boolean(\n maybeValue &&\n typeof maybeValue.equals === 'function' &&\n typeof maybeValue.hashCode === 'function'\n );\n}\n\n/**\n * An extension of the \"same-value\" algorithm as [described for use by ES6 Map\n * and Set](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#Key_equality)\n *\n * NaN is considered the same as NaN, however -0 and 0 are considered the same\n * value, which is different from the algorithm described by\n * [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is).\n *\n * This is extended further to allow Objects to describe the values they\n * represent, by way of `valueOf` or `equals` (and `hashCode`).\n *\n * Note: because of this extension, the key equality of Immutable.Map and the\n * value equality of Immutable.Set will differ from ES6 Map and Set.\n *\n * ### Defining custom values\n *\n * The easiest way to describe the value an object represents is by implementing\n * `valueOf`. For example, `Date` represents a value by returning a unix\n * timestamp for `valueOf`:\n *\n * var date1 = new Date(1234567890000); // Fri Feb 13 2009 ...\n * var date2 = new Date(1234567890000);\n * date1.valueOf(); // 1234567890000\n * assert( date1 !== date2 );\n * assert( Immutable.is( date1, date2 ) );\n *\n * Note: overriding `valueOf` may have other implications if you use this object\n * where JavaScript expects a primitive, such as implicit string coercion.\n *\n * For more complex types, especially collections, implementing `valueOf` may\n * not be performant. An alternative is to implement `equals` and `hashCode`.\n *\n * `equals` takes another object, presumably of similar type, and returns true\n * if it is equal. Equality is symmetrical, so the same result should be\n * returned if this and the argument are flipped.\n *\n * assert( a.equals(b) === b.equals(a) );\n *\n * `hashCode` returns a 32bit integer number representing the object which will\n * be used to determine how to store the value object in a Map or Set. You must\n * provide both or neither methods, one must not exist without the other.\n *\n * Also, an important relationship between these methods must be upheld: if two\n * values are equal, they *must* return the same hashCode. If the values are not\n * equal, they might have the same hashCode; this is called a hash collision,\n * and while undesirable for performance reasons, it is acceptable.\n *\n * if (a.equals(b)) {\n * assert( a.hashCode() === b.hashCode() );\n * }\n *\n * All Immutable collections are Value Objects: they implement `equals()`\n * and `hashCode()`.\n */\nfunction is(valueA, valueB) {\n if (valueA === valueB || (valueA !== valueA && valueB !== valueB)) {\n return true;\n }\n if (!valueA || !valueB) {\n return false;\n }\n if (\n typeof valueA.valueOf === 'function' &&\n typeof valueB.valueOf === 'function'\n ) {\n valueA = valueA.valueOf();\n valueB = valueB.valueOf();\n if (valueA === valueB || (valueA !== valueA && valueB !== valueB)) {\n return true;\n }\n if (!valueA || !valueB) {\n return false;\n }\n }\n return !!(\n isValueObject(valueA) &&\n isValueObject(valueB) &&\n valueA.equals(valueB)\n );\n}\n\nvar imul =\n typeof Math.imul === 'function' && Math.imul(0xffffffff, 2) === -2\n ? Math.imul\n : function imul(a, b) {\n a |= 0; // int\n b |= 0; // int\n var c = a & 0xffff;\n var d = b & 0xffff;\n // Shift by 0 fixes the sign on the high part.\n return (c * d + ((((a >>> 16) * d + c * (b >>> 16)) << 16) >>> 0)) | 0; // int\n };\n\n// v8 has an optimization for storing 31-bit signed numbers.\n// Values which have either 00 or 11 as the high order bits qualify.\n// This function drops the highest order bit in a signed number, maintaining\n// the sign bit.\nfunction smi(i32) {\n return ((i32 >>> 1) & 0x40000000) | (i32 & 0xbfffffff);\n}\n\nvar defaultValueOf = Object.prototype.valueOf;\n\nfunction hash(o) {\n if (o == null) {\n return hashNullish(o);\n }\n\n if (typeof o.hashCode === 'function') {\n // Drop any high bits from accidentally long hash codes.\n return smi(o.hashCode(o));\n }\n\n var v = valueOf(o);\n\n if (v == null) {\n return hashNullish(v);\n }\n\n switch (typeof v) {\n case 'boolean':\n // The hash values for built-in constants are a 1 value for each 5-byte\n // shift region expect for the first, which encodes the value. This\n // reduces the odds of a hash collision for these common values.\n return v ? 0x42108421 : 0x42108420;\n case 'number':\n return hashNumber(v);\n case 'string':\n return v.length > STRING_HASH_CACHE_MIN_STRLEN\n ? cachedHashString(v)\n : hashString(v);\n case 'object':\n case 'function':\n return hashJSObj(v);\n case 'symbol':\n return hashSymbol(v);\n default:\n if (typeof v.toString === 'function') {\n return hashString(v.toString());\n }\n throw new Error('Value type ' + typeof v + ' cannot be hashed.');\n }\n}\n\nfunction hashNullish(nullish) {\n return nullish === null ? 0x42108422 : /* undefined */ 0x42108423;\n}\n\n// Compress arbitrarily large numbers into smi hashes.\nfunction hashNumber(n) {\n if (n !== n || n === Infinity) {\n return 0;\n }\n var hash = n | 0;\n if (hash !== n) {\n hash ^= n * 0xffffffff;\n }\n while (n > 0xffffffff) {\n n /= 0xffffffff;\n hash ^= n;\n }\n return smi(hash);\n}\n\nfunction cachedHashString(string) {\n var hashed = stringHashCache[string];\n if (hashed === undefined) {\n hashed = hashString(string);\n if (STRING_HASH_CACHE_SIZE === STRING_HASH_CACHE_MAX_SIZE) {\n STRING_HASH_CACHE_SIZE = 0;\n stringHashCache = {};\n }\n STRING_HASH_CACHE_SIZE++;\n stringHashCache[string] = hashed;\n }\n return hashed;\n}\n\n// http://jsperf.com/hashing-strings\nfunction hashString(string) {\n // This is the hash from JVM\n // The hash code for a string is computed as\n // s[0] * 31 ^ (n - 1) + s[1] * 31 ^ (n - 2) + ... + s[n - 1],\n // where s[i] is the ith character of the string and n is the length of\n // the string. We \"mod\" the result to make it between 0 (inclusive) and 2^31\n // (exclusive) by dropping high bits.\n var hashed = 0;\n for (var ii = 0; ii < string.length; ii++) {\n hashed = (31 * hashed + string.charCodeAt(ii)) | 0;\n }\n return smi(hashed);\n}\n\nfunction hashSymbol(sym) {\n var hashed = symbolMap[sym];\n if (hashed !== undefined) {\n return hashed;\n }\n\n hashed = nextHash();\n\n symbolMap[sym] = hashed;\n\n return hashed;\n}\n\nfunction hashJSObj(obj) {\n var hashed;\n if (usingWeakMap) {\n hashed = weakMap.get(obj);\n if (hashed !== undefined) {\n return hashed;\n }\n }\n\n hashed = obj[UID_HASH_KEY];\n if (hashed !== undefined) {\n return hashed;\n }\n\n if (!canDefineProperty) {\n hashed = obj.propertyIsEnumerable && obj.propertyIsEnumerable[UID_HASH_KEY];\n if (hashed !== undefined) {\n return hashed;\n }\n\n hashed = getIENodeHash(obj);\n if (hashed !== undefined) {\n return hashed;\n }\n }\n\n hashed = nextHash();\n\n if (usingWeakMap) {\n weakMap.set(obj, hashed);\n } else if (isExtensible !== undefined && isExtensible(obj) === false) {\n throw new Error('Non-extensible objects are not allowed as keys.');\n } else if (canDefineProperty) {\n Object.defineProperty(obj, UID_HASH_KEY, {\n enumerable: false,\n configurable: false,\n writable: false,\n value: hashed,\n });\n } else if (\n obj.propertyIsEnumerable !== undefined &&\n obj.propertyIsEnumerable === obj.constructor.prototype.propertyIsEnumerable\n ) {\n // Since we can't define a non-enumerable property on the object\n // we'll hijack one of the less-used non-enumerable properties to\n // save our hash on it. Since this is a function it will not show up in\n // `JSON.stringify` which is what we want.\n obj.propertyIsEnumerable = function () {\n return this.constructor.prototype.propertyIsEnumerable.apply(\n this,\n arguments\n );\n };\n obj.propertyIsEnumerable[UID_HASH_KEY] = hashed;\n } else if (obj.nodeType !== undefined) {\n // At this point we couldn't get the IE `uniqueID` to use as a hash\n // and we couldn't use a non-enumerable property to exploit the\n // dontEnum bug so we simply add the `UID_HASH_KEY` on the node\n // itself.\n obj[UID_HASH_KEY] = hashed;\n } else {\n throw new Error('Unable to set a non-enumerable property on object.');\n }\n\n return hashed;\n}\n\n// Get references to ES5 object methods.\nvar isExtensible = Object.isExtensible;\n\n// True if Object.defineProperty works as expected. IE8 fails this test.\nvar canDefineProperty = (function () {\n try {\n Object.defineProperty({}, '@', {});\n return true;\n } catch (e) {\n return false;\n }\n})();\n\n// IE has a `uniqueID` property on DOM nodes. We can construct the hash from it\n// and avoid memory leaks from the IE cloneNode bug.\nfunction getIENodeHash(node) {\n if (node && node.nodeType > 0) {\n switch (node.nodeType) {\n case 1: // Element\n return node.uniqueID;\n case 9: // Document\n return node.documentElement && node.documentElement.uniqueID;\n }\n }\n}\n\nfunction valueOf(obj) {\n return obj.valueOf !== defaultValueOf && typeof obj.valueOf === 'function'\n ? obj.valueOf(obj)\n : obj;\n}\n\nfunction nextHash() {\n var nextHash = ++_objHashUID;\n if (_objHashUID & 0x40000000) {\n _objHashUID = 0;\n }\n return nextHash;\n}\n\n// If possible, use a WeakMap.\nvar usingWeakMap = typeof WeakMap === 'function';\nvar weakMap;\nif (usingWeakMap) {\n weakMap = new WeakMap();\n}\n\nvar symbolMap = Object.create(null);\n\nvar _objHashUID = 0;\n\nvar UID_HASH_KEY = '__immutablehash__';\nif (typeof Symbol === 'function') {\n UID_HASH_KEY = Symbol(UID_HASH_KEY);\n}\n\nvar STRING_HASH_CACHE_MIN_STRLEN = 16;\nvar STRING_HASH_CACHE_MAX_SIZE = 255;\nvar STRING_HASH_CACHE_SIZE = 0;\nvar stringHashCache = {};\n\nvar ToKeyedSequence = /*@__PURE__*/(function (KeyedSeq) {\n function ToKeyedSequence(indexed, useKeys) {\n this._iter = indexed;\n this._useKeys = useKeys;\n this.size = indexed.size;\n }\n\n if ( KeyedSeq ) ToKeyedSequence.__proto__ = KeyedSeq;\n ToKeyedSequence.prototype = Object.create( KeyedSeq && KeyedSeq.prototype );\n ToKeyedSequence.prototype.constructor = ToKeyedSequence;\n\n ToKeyedSequence.prototype.get = function get (key, notSetValue) {\n return this._iter.get(key, notSetValue);\n };\n\n ToKeyedSequence.prototype.has = function has (key) {\n return this._iter.has(key);\n };\n\n ToKeyedSequence.prototype.valueSeq = function valueSeq () {\n return this._iter.valueSeq();\n };\n\n ToKeyedSequence.prototype.reverse = function reverse () {\n var this$1$1 = this;\n\n var reversedSequence = reverseFactory(this, true);\n if (!this._useKeys) {\n reversedSequence.valueSeq = function () { return this$1$1._iter.toSeq().reverse(); };\n }\n return reversedSequence;\n };\n\n ToKeyedSequence.prototype.map = function map (mapper, context) {\n var this$1$1 = this;\n\n var mappedSequence = mapFactory(this, mapper, context);\n if (!this._useKeys) {\n mappedSequence.valueSeq = function () { return this$1$1._iter.toSeq().map(mapper, context); };\n }\n return mappedSequence;\n };\n\n ToKeyedSequence.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n return this._iter.__iterate(function (v, k) { return fn(v, k, this$1$1); }, reverse);\n };\n\n ToKeyedSequence.prototype.__iterator = function __iterator (type, reverse) {\n return this._iter.__iterator(type, reverse);\n };\n\n return ToKeyedSequence;\n}(KeyedSeq));\nToKeyedSequence.prototype[IS_ORDERED_SYMBOL] = true;\n\nvar ToIndexedSequence = /*@__PURE__*/(function (IndexedSeq) {\n function ToIndexedSequence(iter) {\n this._iter = iter;\n this.size = iter.size;\n }\n\n if ( IndexedSeq ) ToIndexedSequence.__proto__ = IndexedSeq;\n ToIndexedSequence.prototype = Object.create( IndexedSeq && IndexedSeq.prototype );\n ToIndexedSequence.prototype.constructor = ToIndexedSequence;\n\n ToIndexedSequence.prototype.includes = function includes (value) {\n return this._iter.includes(value);\n };\n\n ToIndexedSequence.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n var i = 0;\n reverse && ensureSize(this);\n return this._iter.__iterate(\n function (v) { return fn(v, reverse ? this$1$1.size - ++i : i++, this$1$1); },\n reverse\n );\n };\n\n ToIndexedSequence.prototype.__iterator = function __iterator (type, reverse) {\n var this$1$1 = this;\n\n var iterator = this._iter.__iterator(ITERATE_VALUES, reverse);\n var i = 0;\n reverse && ensureSize(this);\n return new Iterator(function () {\n var step = iterator.next();\n return step.done\n ? step\n : iteratorValue(\n type,\n reverse ? this$1$1.size - ++i : i++,\n step.value,\n step\n );\n });\n };\n\n return ToIndexedSequence;\n}(IndexedSeq));\n\nvar ToSetSequence = /*@__PURE__*/(function (SetSeq) {\n function ToSetSequence(iter) {\n this._iter = iter;\n this.size = iter.size;\n }\n\n if ( SetSeq ) ToSetSequence.__proto__ = SetSeq;\n ToSetSequence.prototype = Object.create( SetSeq && SetSeq.prototype );\n ToSetSequence.prototype.constructor = ToSetSequence;\n\n ToSetSequence.prototype.has = function has (key) {\n return this._iter.includes(key);\n };\n\n ToSetSequence.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n return this._iter.__iterate(function (v) { return fn(v, v, this$1$1); }, reverse);\n };\n\n ToSetSequence.prototype.__iterator = function __iterator (type, reverse) {\n var iterator = this._iter.__iterator(ITERATE_VALUES, reverse);\n return new Iterator(function () {\n var step = iterator.next();\n return step.done\n ? step\n : iteratorValue(type, step.value, step.value, step);\n });\n };\n\n return ToSetSequence;\n}(SetSeq));\n\nvar FromEntriesSequence = /*@__PURE__*/(function (KeyedSeq) {\n function FromEntriesSequence(entries) {\n this._iter = entries;\n this.size = entries.size;\n }\n\n if ( KeyedSeq ) FromEntriesSequence.__proto__ = KeyedSeq;\n FromEntriesSequence.prototype = Object.create( KeyedSeq && KeyedSeq.prototype );\n FromEntriesSequence.prototype.constructor = FromEntriesSequence;\n\n FromEntriesSequence.prototype.entrySeq = function entrySeq () {\n return this._iter.toSeq();\n };\n\n FromEntriesSequence.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n return this._iter.__iterate(function (entry) {\n // Check if entry exists first so array access doesn't throw for holes\n // in the parent iteration.\n if (entry) {\n validateEntry(entry);\n var indexedCollection = isCollection(entry);\n return fn(\n indexedCollection ? entry.get(1) : entry[1],\n indexedCollection ? entry.get(0) : entry[0],\n this$1$1\n );\n }\n }, reverse);\n };\n\n FromEntriesSequence.prototype.__iterator = function __iterator (type, reverse) {\n var iterator = this._iter.__iterator(ITERATE_VALUES, reverse);\n return new Iterator(function () {\n while (true) {\n var step = iterator.next();\n if (step.done) {\n return step;\n }\n var entry = step.value;\n // Check if entry exists first so array access doesn't throw for holes\n // in the parent iteration.\n if (entry) {\n validateEntry(entry);\n var indexedCollection = isCollection(entry);\n return iteratorValue(\n type,\n indexedCollection ? entry.get(0) : entry[0],\n indexedCollection ? entry.get(1) : entry[1],\n step\n );\n }\n }\n });\n };\n\n return FromEntriesSequence;\n}(KeyedSeq));\n\nToIndexedSequence.prototype.cacheResult =\n ToKeyedSequence.prototype.cacheResult =\n ToSetSequence.prototype.cacheResult =\n FromEntriesSequence.prototype.cacheResult =\n cacheResultThrough;\n\nfunction flipFactory(collection) {\n var flipSequence = makeSequence(collection);\n flipSequence._iter = collection;\n flipSequence.size = collection.size;\n flipSequence.flip = function () { return collection; };\n flipSequence.reverse = function () {\n var reversedSequence = collection.reverse.apply(this); // super.reverse()\n reversedSequence.flip = function () { return collection.reverse(); };\n return reversedSequence;\n };\n flipSequence.has = function (key) { return collection.includes(key); };\n flipSequence.includes = function (key) { return collection.has(key); };\n flipSequence.cacheResult = cacheResultThrough;\n flipSequence.__iterateUncached = function (fn, reverse) {\n var this$1$1 = this;\n\n return collection.__iterate(function (v, k) { return fn(k, v, this$1$1) !== false; }, reverse);\n };\n flipSequence.__iteratorUncached = function (type, reverse) {\n if (type === ITERATE_ENTRIES) {\n var iterator = collection.__iterator(type, reverse);\n return new Iterator(function () {\n var step = iterator.next();\n if (!step.done) {\n var k = step.value[0];\n step.value[0] = step.value[1];\n step.value[1] = k;\n }\n return step;\n });\n }\n return collection.__iterator(\n type === ITERATE_VALUES ? ITERATE_KEYS : ITERATE_VALUES,\n reverse\n );\n };\n return flipSequence;\n}\n\nfunction mapFactory(collection, mapper, context) {\n var mappedSequence = makeSequence(collection);\n mappedSequence.size = collection.size;\n mappedSequence.has = function (key) { return collection.has(key); };\n mappedSequence.get = function (key, notSetValue) {\n var v = collection.get(key, NOT_SET);\n return v === NOT_SET\n ? notSetValue\n : mapper.call(context, v, key, collection);\n };\n mappedSequence.__iterateUncached = function (fn, reverse) {\n var this$1$1 = this;\n\n return collection.__iterate(\n function (v, k, c) { return fn(mapper.call(context, v, k, c), k, this$1$1) !== false; },\n reverse\n );\n };\n mappedSequence.__iteratorUncached = function (type, reverse) {\n var iterator = collection.__iterator(ITERATE_ENTRIES, reverse);\n return new Iterator(function () {\n var step = iterator.next();\n if (step.done) {\n return step;\n }\n var entry = step.value;\n var key = entry[0];\n return iteratorValue(\n type,\n key,\n mapper.call(context, entry[1], key, collection),\n step\n );\n });\n };\n return mappedSequence;\n}\n\nfunction reverseFactory(collection, useKeys) {\n var this$1$1 = this;\n\n var reversedSequence = makeSequence(collection);\n reversedSequence._iter = collection;\n reversedSequence.size = collection.size;\n reversedSequence.reverse = function () { return collection; };\n if (collection.flip) {\n reversedSequence.flip = function () {\n var flipSequence = flipFactory(collection);\n flipSequence.reverse = function () { return collection.flip(); };\n return flipSequence;\n };\n }\n reversedSequence.get = function (key, notSetValue) { return collection.get(useKeys ? key : -1 - key, notSetValue); };\n reversedSequence.has = function (key) { return collection.has(useKeys ? key : -1 - key); };\n reversedSequence.includes = function (value) { return collection.includes(value); };\n reversedSequence.cacheResult = cacheResultThrough;\n reversedSequence.__iterate = function (fn, reverse) {\n var this$1$1 = this;\n\n var i = 0;\n reverse && ensureSize(collection);\n return collection.__iterate(\n function (v, k) { return fn(v, useKeys ? k : reverse ? this$1$1.size - ++i : i++, this$1$1); },\n !reverse\n );\n };\n reversedSequence.__iterator = function (type, reverse) {\n var i = 0;\n reverse && ensureSize(collection);\n var iterator = collection.__iterator(ITERATE_ENTRIES, !reverse);\n return new Iterator(function () {\n var step = iterator.next();\n if (step.done) {\n return step;\n }\n var entry = step.value;\n return iteratorValue(\n type,\n useKeys ? entry[0] : reverse ? this$1$1.size - ++i : i++,\n entry[1],\n step\n );\n });\n };\n return reversedSequence;\n}\n\nfunction filterFactory(collection, predicate, context, useKeys) {\n var filterSequence = makeSequence(collection);\n if (useKeys) {\n filterSequence.has = function (key) {\n var v = collection.get(key, NOT_SET);\n return v !== NOT_SET && !!predicate.call(context, v, key, collection);\n };\n filterSequence.get = function (key, notSetValue) {\n var v = collection.get(key, NOT_SET);\n return v !== NOT_SET && predicate.call(context, v, key, collection)\n ? v\n : notSetValue;\n };\n }\n filterSequence.__iterateUncached = function (fn, reverse) {\n var this$1$1 = this;\n\n var iterations = 0;\n collection.__iterate(function (v, k, c) {\n if (predicate.call(context, v, k, c)) {\n iterations++;\n return fn(v, useKeys ? k : iterations - 1, this$1$1);\n }\n }, reverse);\n return iterations;\n };\n filterSequence.__iteratorUncached = function (type, reverse) {\n var iterator = collection.__iterator(ITERATE_ENTRIES, reverse);\n var iterations = 0;\n return new Iterator(function () {\n while (true) {\n var step = iterator.next();\n if (step.done) {\n return step;\n }\n var entry = step.value;\n var key = entry[0];\n var value = entry[1];\n if (predicate.call(context, value, key, collection)) {\n return iteratorValue(type, useKeys ? key : iterations++, value, step);\n }\n }\n });\n };\n return filterSequence;\n}\n\nfunction countByFactory(collection, grouper, context) {\n var groups = Map().asMutable();\n collection.__iterate(function (v, k) {\n groups.update(grouper.call(context, v, k, collection), 0, function (a) { return a + 1; });\n });\n return groups.asImmutable();\n}\n\nfunction groupByFactory(collection, grouper, context) {\n var isKeyedIter = isKeyed(collection);\n var groups = (isOrdered(collection) ? OrderedMap() : Map()).asMutable();\n collection.__iterate(function (v, k) {\n groups.update(\n grouper.call(context, v, k, collection),\n function (a) { return ((a = a || []), a.push(isKeyedIter ? [k, v] : v), a); }\n );\n });\n var coerce = collectionClass(collection);\n return groups.map(function (arr) { return reify(collection, coerce(arr)); }).asImmutable();\n}\n\nfunction partitionFactory(collection, predicate, context) {\n var isKeyedIter = isKeyed(collection);\n var groups = [[], []];\n collection.__iterate(function (v, k) {\n groups[predicate.call(context, v, k, collection) ? 1 : 0].push(\n isKeyedIter ? [k, v] : v\n );\n });\n var coerce = collectionClass(collection);\n return groups.map(function (arr) { return reify(collection, coerce(arr)); });\n}\n\nfunction sliceFactory(collection, begin, end, useKeys) {\n var originalSize = collection.size;\n\n if (wholeSlice(begin, end, originalSize)) {\n return collection;\n }\n\n var resolvedBegin = resolveBegin(begin, originalSize);\n var resolvedEnd = resolveEnd(end, originalSize);\n\n // begin or end will be NaN if they were provided as negative numbers and\n // this collection's size is unknown. In that case, cache first so there is\n // a known size and these do not resolve to NaN.\n if (resolvedBegin !== resolvedBegin || resolvedEnd !== resolvedEnd) {\n return sliceFactory(collection.toSeq().cacheResult(), begin, end, useKeys);\n }\n\n // Note: resolvedEnd is undefined when the original sequence's length is\n // unknown and this slice did not supply an end and should contain all\n // elements after resolvedBegin.\n // In that case, resolvedSize will be NaN and sliceSize will remain undefined.\n var resolvedSize = resolvedEnd - resolvedBegin;\n var sliceSize;\n if (resolvedSize === resolvedSize) {\n sliceSize = resolvedSize < 0 ? 0 : resolvedSize;\n }\n\n var sliceSeq = makeSequence(collection);\n\n // If collection.size is undefined, the size of the realized sliceSeq is\n // unknown at this point unless the number of items to slice is 0\n sliceSeq.size =\n sliceSize === 0 ? sliceSize : (collection.size && sliceSize) || undefined;\n\n if (!useKeys && isSeq(collection) && sliceSize >= 0) {\n sliceSeq.get = function (index, notSetValue) {\n index = wrapIndex(this, index);\n return index >= 0 && index < sliceSize\n ? collection.get(index + resolvedBegin, notSetValue)\n : notSetValue;\n };\n }\n\n sliceSeq.__iterateUncached = function (fn, reverse) {\n var this$1$1 = this;\n\n if (sliceSize === 0) {\n return 0;\n }\n if (reverse) {\n return this.cacheResult().__iterate(fn, reverse);\n }\n var skipped = 0;\n var isSkipping = true;\n var iterations = 0;\n collection.__iterate(function (v, k) {\n if (!(isSkipping && (isSkipping = skipped++ < resolvedBegin))) {\n iterations++;\n return (\n fn(v, useKeys ? k : iterations - 1, this$1$1) !== false &&\n iterations !== sliceSize\n );\n }\n });\n return iterations;\n };\n\n sliceSeq.__iteratorUncached = function (type, reverse) {\n if (sliceSize !== 0 && reverse) {\n return this.cacheResult().__iterator(type, reverse);\n }\n // Don't bother instantiating parent iterator if taking 0.\n if (sliceSize === 0) {\n return new Iterator(iteratorDone);\n }\n var iterator = collection.__iterator(type, reverse);\n var skipped = 0;\n var iterations = 0;\n return new Iterator(function () {\n while (skipped++ < resolvedBegin) {\n iterator.next();\n }\n if (++iterations > sliceSize) {\n return iteratorDone();\n }\n var step = iterator.next();\n if (useKeys || type === ITERATE_VALUES || step.done) {\n return step;\n }\n if (type === ITERATE_KEYS) {\n return iteratorValue(type, iterations - 1, undefined, step);\n }\n return iteratorValue(type, iterations - 1, step.value[1], step);\n });\n };\n\n return sliceSeq;\n}\n\nfunction takeWhileFactory(collection, predicate, context) {\n var takeSequence = makeSequence(collection);\n takeSequence.__iterateUncached = function (fn, reverse) {\n var this$1$1 = this;\n\n if (reverse) {\n return this.cacheResult().__iterate(fn, reverse);\n }\n var iterations = 0;\n collection.__iterate(\n function (v, k, c) { return predicate.call(context, v, k, c) && ++iterations && fn(v, k, this$1$1); }\n );\n return iterations;\n };\n takeSequence.__iteratorUncached = function (type, reverse) {\n var this$1$1 = this;\n\n if (reverse) {\n return this.cacheResult().__iterator(type, reverse);\n }\n var iterator = collection.__iterator(ITERATE_ENTRIES, reverse);\n var iterating = true;\n return new Iterator(function () {\n if (!iterating) {\n return iteratorDone();\n }\n var step = iterator.next();\n if (step.done) {\n return step;\n }\n var entry = step.value;\n var k = entry[0];\n var v = entry[1];\n if (!predicate.call(context, v, k, this$1$1)) {\n iterating = false;\n return iteratorDone();\n }\n return type === ITERATE_ENTRIES ? step : iteratorValue(type, k, v, step);\n });\n };\n return takeSequence;\n}\n\nfunction skipWhileFactory(collection, predicate, context, useKeys) {\n var skipSequence = makeSequence(collection);\n skipSequence.__iterateUncached = function (fn, reverse) {\n var this$1$1 = this;\n\n if (reverse) {\n return this.cacheResult().__iterate(fn, reverse);\n }\n var isSkipping = true;\n var iterations = 0;\n collection.__iterate(function (v, k, c) {\n if (!(isSkipping && (isSkipping = predicate.call(context, v, k, c)))) {\n iterations++;\n return fn(v, useKeys ? k : iterations - 1, this$1$1);\n }\n });\n return iterations;\n };\n skipSequence.__iteratorUncached = function (type, reverse) {\n var this$1$1 = this;\n\n if (reverse) {\n return this.cacheResult().__iterator(type, reverse);\n }\n var iterator = collection.__iterator(ITERATE_ENTRIES, reverse);\n var skipping = true;\n var iterations = 0;\n return new Iterator(function () {\n var step;\n var k;\n var v;\n do {\n step = iterator.next();\n if (step.done) {\n if (useKeys || type === ITERATE_VALUES) {\n return step;\n }\n if (type === ITERATE_KEYS) {\n return iteratorValue(type, iterations++, undefined, step);\n }\n return iteratorValue(type, iterations++, step.value[1], step);\n }\n var entry = step.value;\n k = entry[0];\n v = entry[1];\n skipping && (skipping = predicate.call(context, v, k, this$1$1));\n } while (skipping);\n return type === ITERATE_ENTRIES ? step : iteratorValue(type, k, v, step);\n });\n };\n return skipSequence;\n}\n\nfunction concatFactory(collection, values) {\n var isKeyedCollection = isKeyed(collection);\n var iters = [collection]\n .concat(values)\n .map(function (v) {\n if (!isCollection(v)) {\n v = isKeyedCollection\n ? keyedSeqFromValue(v)\n : indexedSeqFromValue(Array.isArray(v) ? v : [v]);\n } else if (isKeyedCollection) {\n v = KeyedCollection(v);\n }\n return v;\n })\n .filter(function (v) { return v.size !== 0; });\n\n if (iters.length === 0) {\n return collection;\n }\n\n if (iters.length === 1) {\n var singleton = iters[0];\n if (\n singleton === collection ||\n (isKeyedCollection && isKeyed(singleton)) ||\n (isIndexed(collection) && isIndexed(singleton))\n ) {\n return singleton;\n }\n }\n\n var concatSeq = new ArraySeq(iters);\n if (isKeyedCollection) {\n concatSeq = concatSeq.toKeyedSeq();\n } else if (!isIndexed(collection)) {\n concatSeq = concatSeq.toSetSeq();\n }\n concatSeq = concatSeq.flatten(true);\n concatSeq.size = iters.reduce(function (sum, seq) {\n if (sum !== undefined) {\n var size = seq.size;\n if (size !== undefined) {\n return sum + size;\n }\n }\n }, 0);\n return concatSeq;\n}\n\nfunction flattenFactory(collection, depth, useKeys) {\n var flatSequence = makeSequence(collection);\n flatSequence.__iterateUncached = function (fn, reverse) {\n if (reverse) {\n return this.cacheResult().__iterate(fn, reverse);\n }\n var iterations = 0;\n var stopped = false;\n function flatDeep(iter, currentDepth) {\n iter.__iterate(function (v, k) {\n if ((!depth || currentDepth < depth) && isCollection(v)) {\n flatDeep(v, currentDepth + 1);\n } else {\n iterations++;\n if (fn(v, useKeys ? k : iterations - 1, flatSequence) === false) {\n stopped = true;\n }\n }\n return !stopped;\n }, reverse);\n }\n flatDeep(collection, 0);\n return iterations;\n };\n flatSequence.__iteratorUncached = function (type, reverse) {\n if (reverse) {\n return this.cacheResult().__iterator(type, reverse);\n }\n var iterator = collection.__iterator(type, reverse);\n var stack = [];\n var iterations = 0;\n return new Iterator(function () {\n while (iterator) {\n var step = iterator.next();\n if (step.done !== false) {\n iterator = stack.pop();\n continue;\n }\n var v = step.value;\n if (type === ITERATE_ENTRIES) {\n v = v[1];\n }\n if ((!depth || stack.length < depth) && isCollection(v)) {\n stack.push(iterator);\n iterator = v.__iterator(type, reverse);\n } else {\n return useKeys ? step : iteratorValue(type, iterations++, v, step);\n }\n }\n return iteratorDone();\n });\n };\n return flatSequence;\n}\n\nfunction flatMapFactory(collection, mapper, context) {\n var coerce = collectionClass(collection);\n return collection\n .toSeq()\n .map(function (v, k) { return coerce(mapper.call(context, v, k, collection)); })\n .flatten(true);\n}\n\nfunction interposeFactory(collection, separator) {\n var interposedSequence = makeSequence(collection);\n interposedSequence.size = collection.size && collection.size * 2 - 1;\n interposedSequence.__iterateUncached = function (fn, reverse) {\n var this$1$1 = this;\n\n var iterations = 0;\n collection.__iterate(\n function (v) { return (!iterations || fn(separator, iterations++, this$1$1) !== false) &&\n fn(v, iterations++, this$1$1) !== false; },\n reverse\n );\n return iterations;\n };\n interposedSequence.__iteratorUncached = function (type, reverse) {\n var iterator = collection.__iterator(ITERATE_VALUES, reverse);\n var iterations = 0;\n var step;\n return new Iterator(function () {\n if (!step || iterations % 2) {\n step = iterator.next();\n if (step.done) {\n return step;\n }\n }\n return iterations % 2\n ? iteratorValue(type, iterations++, separator)\n : iteratorValue(type, iterations++, step.value, step);\n });\n };\n return interposedSequence;\n}\n\nfunction sortFactory(collection, comparator, mapper) {\n if (!comparator) {\n comparator = defaultComparator;\n }\n var isKeyedCollection = isKeyed(collection);\n var index = 0;\n var entries = collection\n .toSeq()\n .map(function (v, k) { return [k, v, index++, mapper ? mapper(v, k, collection) : v]; })\n .valueSeq()\n .toArray();\n entries\n .sort(function (a, b) { return comparator(a[3], b[3]) || a[2] - b[2]; })\n .forEach(\n isKeyedCollection\n ? function (v, i) {\n entries[i].length = 2;\n }\n : function (v, i) {\n entries[i] = v[1];\n }\n );\n return isKeyedCollection\n ? KeyedSeq(entries)\n : isIndexed(collection)\n ? IndexedSeq(entries)\n : SetSeq(entries);\n}\n\nfunction maxFactory(collection, comparator, mapper) {\n if (!comparator) {\n comparator = defaultComparator;\n }\n if (mapper) {\n var entry = collection\n .toSeq()\n .map(function (v, k) { return [v, mapper(v, k, collection)]; })\n .reduce(function (a, b) { return (maxCompare(comparator, a[1], b[1]) ? b : a); });\n return entry && entry[0];\n }\n return collection.reduce(function (a, b) { return (maxCompare(comparator, a, b) ? b : a); });\n}\n\nfunction maxCompare(comparator, a, b) {\n var comp = comparator(b, a);\n // b is considered the new max if the comparator declares them equal, but\n // they are not equal and b is in fact a nullish value.\n return (\n (comp === 0 && b !== a && (b === undefined || b === null || b !== b)) ||\n comp > 0\n );\n}\n\nfunction zipWithFactory(keyIter, zipper, iters, zipAll) {\n var zipSequence = makeSequence(keyIter);\n var sizes = new ArraySeq(iters).map(function (i) { return i.size; });\n zipSequence.size = zipAll ? sizes.max() : sizes.min();\n // Note: this a generic base implementation of __iterate in terms of\n // __iterator which may be more generically useful in the future.\n zipSequence.__iterate = function (fn, reverse) {\n /* generic:\n var iterator = this.__iterator(ITERATE_ENTRIES, reverse);\n var step;\n var iterations = 0;\n while (!(step = iterator.next()).done) {\n iterations++;\n if (fn(step.value[1], step.value[0], this) === false) {\n break;\n }\n }\n return iterations;\n */\n // indexed:\n var iterator = this.__iterator(ITERATE_VALUES, reverse);\n var step;\n var iterations = 0;\n while (!(step = iterator.next()).done) {\n if (fn(step.value, iterations++, this) === false) {\n break;\n }\n }\n return iterations;\n };\n zipSequence.__iteratorUncached = function (type, reverse) {\n var iterators = iters.map(\n function (i) { return ((i = Collection(i)), getIterator(reverse ? i.reverse() : i)); }\n );\n var iterations = 0;\n var isDone = false;\n return new Iterator(function () {\n var steps;\n if (!isDone) {\n steps = iterators.map(function (i) { return i.next(); });\n isDone = zipAll ? steps.every(function (s) { return s.done; }) : steps.some(function (s) { return s.done; });\n }\n if (isDone) {\n return iteratorDone();\n }\n return iteratorValue(\n type,\n iterations++,\n zipper.apply(\n null,\n steps.map(function (s) { return s.value; })\n )\n );\n });\n };\n return zipSequence;\n}\n\n// #pragma Helper Functions\n\nfunction reify(iter, seq) {\n return iter === seq ? iter : isSeq(iter) ? seq : iter.constructor(seq);\n}\n\nfunction validateEntry(entry) {\n if (entry !== Object(entry)) {\n throw new TypeError('Expected [K, V] tuple: ' + entry);\n }\n}\n\nfunction collectionClass(collection) {\n return isKeyed(collection)\n ? KeyedCollection\n : isIndexed(collection)\n ? IndexedCollection\n : SetCollection;\n}\n\nfunction makeSequence(collection) {\n return Object.create(\n (isKeyed(collection)\n ? KeyedSeq\n : isIndexed(collection)\n ? IndexedSeq\n : SetSeq\n ).prototype\n );\n}\n\nfunction cacheResultThrough() {\n if (this._iter.cacheResult) {\n this._iter.cacheResult();\n this.size = this._iter.size;\n return this;\n }\n return Seq.prototype.cacheResult.call(this);\n}\n\nfunction defaultComparator(a, b) {\n if (a === undefined && b === undefined) {\n return 0;\n }\n\n if (a === undefined) {\n return 1;\n }\n\n if (b === undefined) {\n return -1;\n }\n\n return a > b ? 1 : a < b ? -1 : 0;\n}\n\nfunction arrCopy(arr, offset) {\n offset = offset || 0;\n var len = Math.max(0, arr.length - offset);\n var newArr = new Array(len);\n for (var ii = 0; ii < len; ii++) {\n newArr[ii] = arr[ii + offset];\n }\n return newArr;\n}\n\nfunction invariant(condition, error) {\n if (!condition) { throw new Error(error); }\n}\n\nfunction assertNotInfinite(size) {\n invariant(\n size !== Infinity,\n 'Cannot perform this action with an infinite size.'\n );\n}\n\nfunction coerceKeyPath(keyPath) {\n if (isArrayLike(keyPath) && typeof keyPath !== 'string') {\n return keyPath;\n }\n if (isOrdered(keyPath)) {\n return keyPath.toArray();\n }\n throw new TypeError(\n 'Invalid keyPath: expected Ordered Collection or Array: ' + keyPath\n );\n}\n\nvar toString = Object.prototype.toString;\n\nfunction isPlainObject(value) {\n // The base prototype's toString deals with Argument objects and native namespaces like Math\n if (\n !value ||\n typeof value !== 'object' ||\n toString.call(value) !== '[object Object]'\n ) {\n return false;\n }\n\n var proto = Object.getPrototypeOf(value);\n if (proto === null) {\n return true;\n }\n\n // Iteratively going up the prototype chain is needed for cross-realm environments (differing contexts, iframes, etc)\n var parentProto = proto;\n var nextProto = Object.getPrototypeOf(proto);\n while (nextProto !== null) {\n parentProto = nextProto;\n nextProto = Object.getPrototypeOf(parentProto);\n }\n return parentProto === proto;\n}\n\n/**\n * Returns true if the value is a potentially-persistent data structure, either\n * provided by Immutable.js or a plain Array or Object.\n */\nfunction isDataStructure(value) {\n return (\n typeof value === 'object' &&\n (isImmutable(value) || Array.isArray(value) || isPlainObject(value))\n );\n}\n\nfunction quoteString(value) {\n try {\n return typeof value === 'string' ? JSON.stringify(value) : String(value);\n } catch (_ignoreError) {\n return JSON.stringify(value);\n }\n}\n\nfunction has(collection, key) {\n return isImmutable(collection)\n ? collection.has(key)\n : isDataStructure(collection) && hasOwnProperty.call(collection, key);\n}\n\nfunction get(collection, key, notSetValue) {\n return isImmutable(collection)\n ? collection.get(key, notSetValue)\n : !has(collection, key)\n ? notSetValue\n : typeof collection.get === 'function'\n ? collection.get(key)\n : collection[key];\n}\n\nfunction shallowCopy(from) {\n if (Array.isArray(from)) {\n return arrCopy(from);\n }\n var to = {};\n for (var key in from) {\n if (hasOwnProperty.call(from, key)) {\n to[key] = from[key];\n }\n }\n return to;\n}\n\nfunction remove(collection, key) {\n if (!isDataStructure(collection)) {\n throw new TypeError(\n 'Cannot update non-data-structure value: ' + collection\n );\n }\n if (isImmutable(collection)) {\n if (!collection.remove) {\n throw new TypeError(\n 'Cannot update immutable value without .remove() method: ' + collection\n );\n }\n return collection.remove(key);\n }\n if (!hasOwnProperty.call(collection, key)) {\n return collection;\n }\n var collectionCopy = shallowCopy(collection);\n if (Array.isArray(collectionCopy)) {\n collectionCopy.splice(key, 1);\n } else {\n delete collectionCopy[key];\n }\n return collectionCopy;\n}\n\nfunction set(collection, key, value) {\n if (!isDataStructure(collection)) {\n throw new TypeError(\n 'Cannot update non-data-structure value: ' + collection\n );\n }\n if (isImmutable(collection)) {\n if (!collection.set) {\n throw new TypeError(\n 'Cannot update immutable value without .set() method: ' + collection\n );\n }\n return collection.set(key, value);\n }\n if (hasOwnProperty.call(collection, key) && value === collection[key]) {\n return collection;\n }\n var collectionCopy = shallowCopy(collection);\n collectionCopy[key] = value;\n return collectionCopy;\n}\n\nfunction updateIn$1(collection, keyPath, notSetValue, updater) {\n if (!updater) {\n updater = notSetValue;\n notSetValue = undefined;\n }\n var updatedValue = updateInDeeply(\n isImmutable(collection),\n collection,\n coerceKeyPath(keyPath),\n 0,\n notSetValue,\n updater\n );\n return updatedValue === NOT_SET ? notSetValue : updatedValue;\n}\n\nfunction updateInDeeply(\n inImmutable,\n existing,\n keyPath,\n i,\n notSetValue,\n updater\n) {\n var wasNotSet = existing === NOT_SET;\n if (i === keyPath.length) {\n var existingValue = wasNotSet ? notSetValue : existing;\n var newValue = updater(existingValue);\n return newValue === existingValue ? existing : newValue;\n }\n if (!wasNotSet && !isDataStructure(existing)) {\n throw new TypeError(\n 'Cannot update within non-data-structure value in path [' +\n keyPath.slice(0, i).map(quoteString) +\n ']: ' +\n existing\n );\n }\n var key = keyPath[i];\n var nextExisting = wasNotSet ? NOT_SET : get(existing, key, NOT_SET);\n var nextUpdated = updateInDeeply(\n nextExisting === NOT_SET ? inImmutable : isImmutable(nextExisting),\n nextExisting,\n keyPath,\n i + 1,\n notSetValue,\n updater\n );\n return nextUpdated === nextExisting\n ? existing\n : nextUpdated === NOT_SET\n ? remove(existing, key)\n : set(\n wasNotSet ? (inImmutable ? emptyMap() : {}) : existing,\n key,\n nextUpdated\n );\n}\n\nfunction setIn$1(collection, keyPath, value) {\n return updateIn$1(collection, keyPath, NOT_SET, function () { return value; });\n}\n\nfunction setIn(keyPath, v) {\n return setIn$1(this, keyPath, v);\n}\n\nfunction removeIn(collection, keyPath) {\n return updateIn$1(collection, keyPath, function () { return NOT_SET; });\n}\n\nfunction deleteIn(keyPath) {\n return removeIn(this, keyPath);\n}\n\nfunction update$1(collection, key, notSetValue, updater) {\n return updateIn$1(collection, [key], notSetValue, updater);\n}\n\nfunction update(key, notSetValue, updater) {\n return arguments.length === 1\n ? key(this)\n : update$1(this, key, notSetValue, updater);\n}\n\nfunction updateIn(keyPath, notSetValue, updater) {\n return updateIn$1(this, keyPath, notSetValue, updater);\n}\n\nfunction merge$1() {\n var iters = [], len = arguments.length;\n while ( len-- ) iters[ len ] = arguments[ len ];\n\n return mergeIntoKeyedWith(this, iters);\n}\n\nfunction mergeWith$1(merger) {\n var iters = [], len = arguments.length - 1;\n while ( len-- > 0 ) iters[ len ] = arguments[ len + 1 ];\n\n if (typeof merger !== 'function') {\n throw new TypeError('Invalid merger function: ' + merger);\n }\n return mergeIntoKeyedWith(this, iters, merger);\n}\n\nfunction mergeIntoKeyedWith(collection, collections, merger) {\n var iters = [];\n for (var ii = 0; ii < collections.length; ii++) {\n var collection$1 = KeyedCollection(collections[ii]);\n if (collection$1.size !== 0) {\n iters.push(collection$1);\n }\n }\n if (iters.length === 0) {\n return collection;\n }\n if (\n collection.toSeq().size === 0 &&\n !collection.__ownerID &&\n iters.length === 1\n ) {\n return collection.constructor(iters[0]);\n }\n return collection.withMutations(function (collection) {\n var mergeIntoCollection = merger\n ? function (value, key) {\n update$1(collection, key, NOT_SET, function (oldVal) { return oldVal === NOT_SET ? value : merger(oldVal, value, key); }\n );\n }\n : function (value, key) {\n collection.set(key, value);\n };\n for (var ii = 0; ii < iters.length; ii++) {\n iters[ii].forEach(mergeIntoCollection);\n }\n });\n}\n\nfunction merge(collection) {\n var sources = [], len = arguments.length - 1;\n while ( len-- > 0 ) sources[ len ] = arguments[ len + 1 ];\n\n return mergeWithSources(collection, sources);\n}\n\nfunction mergeWith(merger, collection) {\n var sources = [], len = arguments.length - 2;\n while ( len-- > 0 ) sources[ len ] = arguments[ len + 2 ];\n\n return mergeWithSources(collection, sources, merger);\n}\n\nfunction mergeDeep$1(collection) {\n var sources = [], len = arguments.length - 1;\n while ( len-- > 0 ) sources[ len ] = arguments[ len + 1 ];\n\n return mergeDeepWithSources(collection, sources);\n}\n\nfunction mergeDeepWith$1(merger, collection) {\n var sources = [], len = arguments.length - 2;\n while ( len-- > 0 ) sources[ len ] = arguments[ len + 2 ];\n\n return mergeDeepWithSources(collection, sources, merger);\n}\n\nfunction mergeDeepWithSources(collection, sources, merger) {\n return mergeWithSources(collection, sources, deepMergerWith(merger));\n}\n\nfunction mergeWithSources(collection, sources, merger) {\n if (!isDataStructure(collection)) {\n throw new TypeError(\n 'Cannot merge into non-data-structure value: ' + collection\n );\n }\n if (isImmutable(collection)) {\n return typeof merger === 'function' && collection.mergeWith\n ? collection.mergeWith.apply(collection, [ merger ].concat( sources ))\n : collection.merge\n ? collection.merge.apply(collection, sources)\n : collection.concat.apply(collection, sources);\n }\n var isArray = Array.isArray(collection);\n var merged = collection;\n var Collection = isArray ? IndexedCollection : KeyedCollection;\n var mergeItem = isArray\n ? function (value) {\n // Copy on write\n if (merged === collection) {\n merged = shallowCopy(merged);\n }\n merged.push(value);\n }\n : function (value, key) {\n var hasVal = hasOwnProperty.call(merged, key);\n var nextVal =\n hasVal && merger ? merger(merged[key], value, key) : value;\n if (!hasVal || nextVal !== merged[key]) {\n // Copy on write\n if (merged === collection) {\n merged = shallowCopy(merged);\n }\n merged[key] = nextVal;\n }\n };\n for (var i = 0; i < sources.length; i++) {\n Collection(sources[i]).forEach(mergeItem);\n }\n return merged;\n}\n\nfunction deepMergerWith(merger) {\n function deepMerger(oldValue, newValue, key) {\n return isDataStructure(oldValue) &&\n isDataStructure(newValue) &&\n areMergeable(oldValue, newValue)\n ? mergeWithSources(oldValue, [newValue], deepMerger)\n : merger\n ? merger(oldValue, newValue, key)\n : newValue;\n }\n return deepMerger;\n}\n\n/**\n * It's unclear what the desired behavior is for merging two collections that\n * fall into separate categories between keyed, indexed, or set-like, so we only\n * consider them mergeable if they fall into the same category.\n */\nfunction areMergeable(oldDataStructure, newDataStructure) {\n var oldSeq = Seq(oldDataStructure);\n var newSeq = Seq(newDataStructure);\n // This logic assumes that a sequence can only fall into one of the three\n // categories mentioned above (since there's no `isSetLike()` method).\n return (\n isIndexed(oldSeq) === isIndexed(newSeq) &&\n isKeyed(oldSeq) === isKeyed(newSeq)\n );\n}\n\nfunction mergeDeep() {\n var iters = [], len = arguments.length;\n while ( len-- ) iters[ len ] = arguments[ len ];\n\n return mergeDeepWithSources(this, iters);\n}\n\nfunction mergeDeepWith(merger) {\n var iters = [], len = arguments.length - 1;\n while ( len-- > 0 ) iters[ len ] = arguments[ len + 1 ];\n\n return mergeDeepWithSources(this, iters, merger);\n}\n\nfunction mergeIn(keyPath) {\n var iters = [], len = arguments.length - 1;\n while ( len-- > 0 ) iters[ len ] = arguments[ len + 1 ];\n\n return updateIn$1(this, keyPath, emptyMap(), function (m) { return mergeWithSources(m, iters); });\n}\n\nfunction mergeDeepIn(keyPath) {\n var iters = [], len = arguments.length - 1;\n while ( len-- > 0 ) iters[ len ] = arguments[ len + 1 ];\n\n return updateIn$1(this, keyPath, emptyMap(), function (m) { return mergeDeepWithSources(m, iters); }\n );\n}\n\nfunction withMutations(fn) {\n var mutable = this.asMutable();\n fn(mutable);\n return mutable.wasAltered() ? mutable.__ensureOwner(this.__ownerID) : this;\n}\n\nfunction asMutable() {\n return this.__ownerID ? this : this.__ensureOwner(new OwnerID());\n}\n\nfunction asImmutable() {\n return this.__ensureOwner();\n}\n\nfunction wasAltered() {\n return this.__altered;\n}\n\nvar Map = /*@__PURE__*/(function (KeyedCollection) {\n function Map(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptyMap()\n : isMap(value) && !isOrdered(value)\n ? value\n : emptyMap().withMutations(function (map) {\n var iter = KeyedCollection(value);\n assertNotInfinite(iter.size);\n iter.forEach(function (v, k) { return map.set(k, v); });\n });\n }\n\n if ( KeyedCollection ) Map.__proto__ = KeyedCollection;\n Map.prototype = Object.create( KeyedCollection && KeyedCollection.prototype );\n Map.prototype.constructor = Map;\n\n Map.of = function of () {\n var keyValues = [], len = arguments.length;\n while ( len-- ) keyValues[ len ] = arguments[ len ];\n\n return emptyMap().withMutations(function (map) {\n for (var i = 0; i < keyValues.length; i += 2) {\n if (i + 1 >= keyValues.length) {\n throw new Error('Missing value for key: ' + keyValues[i]);\n }\n map.set(keyValues[i], keyValues[i + 1]);\n }\n });\n };\n\n Map.prototype.toString = function toString () {\n return this.__toString('Map {', '}');\n };\n\n // @pragma Access\n\n Map.prototype.get = function get (k, notSetValue) {\n return this._root\n ? this._root.get(0, undefined, k, notSetValue)\n : notSetValue;\n };\n\n // @pragma Modification\n\n Map.prototype.set = function set (k, v) {\n return updateMap(this, k, v);\n };\n\n Map.prototype.remove = function remove (k) {\n return updateMap(this, k, NOT_SET);\n };\n\n Map.prototype.deleteAll = function deleteAll (keys) {\n var collection = Collection(keys);\n\n if (collection.size === 0) {\n return this;\n }\n\n return this.withMutations(function (map) {\n collection.forEach(function (key) { return map.remove(key); });\n });\n };\n\n Map.prototype.clear = function clear () {\n if (this.size === 0) {\n return this;\n }\n if (this.__ownerID) {\n this.size = 0;\n this._root = null;\n this.__hash = undefined;\n this.__altered = true;\n return this;\n }\n return emptyMap();\n };\n\n // @pragma Composition\n\n Map.prototype.sort = function sort (comparator) {\n // Late binding\n return OrderedMap(sortFactory(this, comparator));\n };\n\n Map.prototype.sortBy = function sortBy (mapper, comparator) {\n // Late binding\n return OrderedMap(sortFactory(this, comparator, mapper));\n };\n\n Map.prototype.map = function map (mapper, context) {\n var this$1$1 = this;\n\n return this.withMutations(function (map) {\n map.forEach(function (value, key) {\n map.set(key, mapper.call(context, value, key, this$1$1));\n });\n });\n };\n\n // @pragma Mutability\n\n Map.prototype.__iterator = function __iterator (type, reverse) {\n return new MapIterator(this, type, reverse);\n };\n\n Map.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n var iterations = 0;\n this._root &&\n this._root.iterate(function (entry) {\n iterations++;\n return fn(entry[1], entry[0], this$1$1);\n }, reverse);\n return iterations;\n };\n\n Map.prototype.__ensureOwner = function __ensureOwner (ownerID) {\n if (ownerID === this.__ownerID) {\n return this;\n }\n if (!ownerID) {\n if (this.size === 0) {\n return emptyMap();\n }\n this.__ownerID = ownerID;\n this.__altered = false;\n return this;\n }\n return makeMap(this.size, this._root, ownerID, this.__hash);\n };\n\n return Map;\n}(KeyedCollection));\n\nMap.isMap = isMap;\n\nvar MapPrototype = Map.prototype;\nMapPrototype[IS_MAP_SYMBOL] = true;\nMapPrototype[DELETE] = MapPrototype.remove;\nMapPrototype.removeAll = MapPrototype.deleteAll;\nMapPrototype.setIn = setIn;\nMapPrototype.removeIn = MapPrototype.deleteIn = deleteIn;\nMapPrototype.update = update;\nMapPrototype.updateIn = updateIn;\nMapPrototype.merge = MapPrototype.concat = merge$1;\nMapPrototype.mergeWith = mergeWith$1;\nMapPrototype.mergeDeep = mergeDeep;\nMapPrototype.mergeDeepWith = mergeDeepWith;\nMapPrototype.mergeIn = mergeIn;\nMapPrototype.mergeDeepIn = mergeDeepIn;\nMapPrototype.withMutations = withMutations;\nMapPrototype.wasAltered = wasAltered;\nMapPrototype.asImmutable = asImmutable;\nMapPrototype['@@transducer/init'] = MapPrototype.asMutable = asMutable;\nMapPrototype['@@transducer/step'] = function (result, arr) {\n return result.set(arr[0], arr[1]);\n};\nMapPrototype['@@transducer/result'] = function (obj) {\n return obj.asImmutable();\n};\n\n// #pragma Trie Nodes\n\nvar ArrayMapNode = function ArrayMapNode(ownerID, entries) {\n this.ownerID = ownerID;\n this.entries = entries;\n};\n\nArrayMapNode.prototype.get = function get (shift, keyHash, key, notSetValue) {\n var entries = this.entries;\n for (var ii = 0, len = entries.length; ii < len; ii++) {\n if (is(key, entries[ii][0])) {\n return entries[ii][1];\n }\n }\n return notSetValue;\n};\n\nArrayMapNode.prototype.update = function update (ownerID, shift, keyHash, key, value, didChangeSize, didAlter) {\n var removed = value === NOT_SET;\n\n var entries = this.entries;\n var idx = 0;\n var len = entries.length;\n for (; idx < len; idx++) {\n if (is(key, entries[idx][0])) {\n break;\n }\n }\n var exists = idx < len;\n\n if (exists ? entries[idx][1] === value : removed) {\n return this;\n }\n\n SetRef(didAlter);\n (removed || !exists) && SetRef(didChangeSize);\n\n if (removed && entries.length === 1) {\n return; // undefined\n }\n\n if (!exists && !removed && entries.length >= MAX_ARRAY_MAP_SIZE) {\n return createNodes(ownerID, entries, key, value);\n }\n\n var isEditable = ownerID && ownerID === this.ownerID;\n var newEntries = isEditable ? entries : arrCopy(entries);\n\n if (exists) {\n if (removed) {\n idx === len - 1\n ? newEntries.pop()\n : (newEntries[idx] = newEntries.pop());\n } else {\n newEntries[idx] = [key, value];\n }\n } else {\n newEntries.push([key, value]);\n }\n\n if (isEditable) {\n this.entries = newEntries;\n return this;\n }\n\n return new ArrayMapNode(ownerID, newEntries);\n};\n\nvar BitmapIndexedNode = function BitmapIndexedNode(ownerID, bitmap, nodes) {\n this.ownerID = ownerID;\n this.bitmap = bitmap;\n this.nodes = nodes;\n};\n\nBitmapIndexedNode.prototype.get = function get (shift, keyHash, key, notSetValue) {\n if (keyHash === undefined) {\n keyHash = hash(key);\n }\n var bit = 1 << ((shift === 0 ? keyHash : keyHash >>> shift) & MASK);\n var bitmap = this.bitmap;\n return (bitmap & bit) === 0\n ? notSetValue\n : this.nodes[popCount(bitmap & (bit - 1))].get(\n shift + SHIFT,\n keyHash,\n key,\n notSetValue\n );\n};\n\nBitmapIndexedNode.prototype.update = function update (ownerID, shift, keyHash, key, value, didChangeSize, didAlter) {\n if (keyHash === undefined) {\n keyHash = hash(key);\n }\n var keyHashFrag = (shift === 0 ? keyHash : keyHash >>> shift) & MASK;\n var bit = 1 << keyHashFrag;\n var bitmap = this.bitmap;\n var exists = (bitmap & bit) !== 0;\n\n if (!exists && value === NOT_SET) {\n return this;\n }\n\n var idx = popCount(bitmap & (bit - 1));\n var nodes = this.nodes;\n var node = exists ? nodes[idx] : undefined;\n var newNode = updateNode(\n node,\n ownerID,\n shift + SHIFT,\n keyHash,\n key,\n value,\n didChangeSize,\n didAlter\n );\n\n if (newNode === node) {\n return this;\n }\n\n if (!exists && newNode && nodes.length >= MAX_BITMAP_INDEXED_SIZE) {\n return expandNodes(ownerID, nodes, bitmap, keyHashFrag, newNode);\n }\n\n if (\n exists &&\n !newNode &&\n nodes.length === 2 &&\n isLeafNode(nodes[idx ^ 1])\n ) {\n return nodes[idx ^ 1];\n }\n\n if (exists && newNode && nodes.length === 1 && isLeafNode(newNode)) {\n return newNode;\n }\n\n var isEditable = ownerID && ownerID === this.ownerID;\n var newBitmap = exists ? (newNode ? bitmap : bitmap ^ bit) : bitmap | bit;\n var newNodes = exists\n ? newNode\n ? setAt(nodes, idx, newNode, isEditable)\n : spliceOut(nodes, idx, isEditable)\n : spliceIn(nodes, idx, newNode, isEditable);\n\n if (isEditable) {\n this.bitmap = newBitmap;\n this.nodes = newNodes;\n return this;\n }\n\n return new BitmapIndexedNode(ownerID, newBitmap, newNodes);\n};\n\nvar HashArrayMapNode = function HashArrayMapNode(ownerID, count, nodes) {\n this.ownerID = ownerID;\n this.count = count;\n this.nodes = nodes;\n};\n\nHashArrayMapNode.prototype.get = function get (shift, keyHash, key, notSetValue) {\n if (keyHash === undefined) {\n keyHash = hash(key);\n }\n var idx = (shift === 0 ? keyHash : keyHash >>> shift) & MASK;\n var node = this.nodes[idx];\n return node\n ? node.get(shift + SHIFT, keyHash, key, notSetValue)\n : notSetValue;\n};\n\nHashArrayMapNode.prototype.update = function update (ownerID, shift, keyHash, key, value, didChangeSize, didAlter) {\n if (keyHash === undefined) {\n keyHash = hash(key);\n }\n var idx = (shift === 0 ? keyHash : keyHash >>> shift) & MASK;\n var removed = value === NOT_SET;\n var nodes = this.nodes;\n var node = nodes[idx];\n\n if (removed && !node) {\n return this;\n }\n\n var newNode = updateNode(\n node,\n ownerID,\n shift + SHIFT,\n keyHash,\n key,\n value,\n didChangeSize,\n didAlter\n );\n if (newNode === node) {\n return this;\n }\n\n var newCount = this.count;\n if (!node) {\n newCount++;\n } else if (!newNode) {\n newCount--;\n if (newCount < MIN_HASH_ARRAY_MAP_SIZE) {\n return packNodes(ownerID, nodes, newCount, idx);\n }\n }\n\n var isEditable = ownerID && ownerID === this.ownerID;\n var newNodes = setAt(nodes, idx, newNode, isEditable);\n\n if (isEditable) {\n this.count = newCount;\n this.nodes = newNodes;\n return this;\n }\n\n return new HashArrayMapNode(ownerID, newCount, newNodes);\n};\n\nvar HashCollisionNode = function HashCollisionNode(ownerID, keyHash, entries) {\n this.ownerID = ownerID;\n this.keyHash = keyHash;\n this.entries = entries;\n};\n\nHashCollisionNode.prototype.get = function get (shift, keyHash, key, notSetValue) {\n var entries = this.entries;\n for (var ii = 0, len = entries.length; ii < len; ii++) {\n if (is(key, entries[ii][0])) {\n return entries[ii][1];\n }\n }\n return notSetValue;\n};\n\nHashCollisionNode.prototype.update = function update (ownerID, shift, keyHash, key, value, didChangeSize, didAlter) {\n if (keyHash === undefined) {\n keyHash = hash(key);\n }\n\n var removed = value === NOT_SET;\n\n if (keyHash !== this.keyHash) {\n if (removed) {\n return this;\n }\n SetRef(didAlter);\n SetRef(didChangeSize);\n return mergeIntoNode(this, ownerID, shift, keyHash, [key, value]);\n }\n\n var entries = this.entries;\n var idx = 0;\n var len = entries.length;\n for (; idx < len; idx++) {\n if (is(key, entries[idx][0])) {\n break;\n }\n }\n var exists = idx < len;\n\n if (exists ? entries[idx][1] === value : removed) {\n return this;\n }\n\n SetRef(didAlter);\n (removed || !exists) && SetRef(didChangeSize);\n\n if (removed && len === 2) {\n return new ValueNode(ownerID, this.keyHash, entries[idx ^ 1]);\n }\n\n var isEditable = ownerID && ownerID === this.ownerID;\n var newEntries = isEditable ? entries : arrCopy(entries);\n\n if (exists) {\n if (removed) {\n idx === len - 1\n ? newEntries.pop()\n : (newEntries[idx] = newEntries.pop());\n } else {\n newEntries[idx] = [key, value];\n }\n } else {\n newEntries.push([key, value]);\n }\n\n if (isEditable) {\n this.entries = newEntries;\n return this;\n }\n\n return new HashCollisionNode(ownerID, this.keyHash, newEntries);\n};\n\nvar ValueNode = function ValueNode(ownerID, keyHash, entry) {\n this.ownerID = ownerID;\n this.keyHash = keyHash;\n this.entry = entry;\n};\n\nValueNode.prototype.get = function get (shift, keyHash, key, notSetValue) {\n return is(key, this.entry[0]) ? this.entry[1] : notSetValue;\n};\n\nValueNode.prototype.update = function update (ownerID, shift, keyHash, key, value, didChangeSize, didAlter) {\n var removed = value === NOT_SET;\n var keyMatch = is(key, this.entry[0]);\n if (keyMatch ? value === this.entry[1] : removed) {\n return this;\n }\n\n SetRef(didAlter);\n\n if (removed) {\n SetRef(didChangeSize);\n return; // undefined\n }\n\n if (keyMatch) {\n if (ownerID && ownerID === this.ownerID) {\n this.entry[1] = value;\n return this;\n }\n return new ValueNode(ownerID, this.keyHash, [key, value]);\n }\n\n SetRef(didChangeSize);\n return mergeIntoNode(this, ownerID, shift, hash(key), [key, value]);\n};\n\n// #pragma Iterators\n\nArrayMapNode.prototype.iterate = HashCollisionNode.prototype.iterate =\n function (fn, reverse) {\n var entries = this.entries;\n for (var ii = 0, maxIndex = entries.length - 1; ii <= maxIndex; ii++) {\n if (fn(entries[reverse ? maxIndex - ii : ii]) === false) {\n return false;\n }\n }\n };\n\nBitmapIndexedNode.prototype.iterate = HashArrayMapNode.prototype.iterate =\n function (fn, reverse) {\n var nodes = this.nodes;\n for (var ii = 0, maxIndex = nodes.length - 1; ii <= maxIndex; ii++) {\n var node = nodes[reverse ? maxIndex - ii : ii];\n if (node && node.iterate(fn, reverse) === false) {\n return false;\n }\n }\n };\n\n// eslint-disable-next-line no-unused-vars\nValueNode.prototype.iterate = function (fn, reverse) {\n return fn(this.entry);\n};\n\nvar MapIterator = /*@__PURE__*/(function (Iterator) {\n function MapIterator(map, type, reverse) {\n this._type = type;\n this._reverse = reverse;\n this._stack = map._root && mapIteratorFrame(map._root);\n }\n\n if ( Iterator ) MapIterator.__proto__ = Iterator;\n MapIterator.prototype = Object.create( Iterator && Iterator.prototype );\n MapIterator.prototype.constructor = MapIterator;\n\n MapIterator.prototype.next = function next () {\n var type = this._type;\n var stack = this._stack;\n while (stack) {\n var node = stack.node;\n var index = stack.index++;\n var maxIndex = (void 0);\n if (node.entry) {\n if (index === 0) {\n return mapIteratorValue(type, node.entry);\n }\n } else if (node.entries) {\n maxIndex = node.entries.length - 1;\n if (index <= maxIndex) {\n return mapIteratorValue(\n type,\n node.entries[this._reverse ? maxIndex - index : index]\n );\n }\n } else {\n maxIndex = node.nodes.length - 1;\n if (index <= maxIndex) {\n var subNode = node.nodes[this._reverse ? maxIndex - index : index];\n if (subNode) {\n if (subNode.entry) {\n return mapIteratorValue(type, subNode.entry);\n }\n stack = this._stack = mapIteratorFrame(subNode, stack);\n }\n continue;\n }\n }\n stack = this._stack = this._stack.__prev;\n }\n return iteratorDone();\n };\n\n return MapIterator;\n}(Iterator));\n\nfunction mapIteratorValue(type, entry) {\n return iteratorValue(type, entry[0], entry[1]);\n}\n\nfunction mapIteratorFrame(node, prev) {\n return {\n node: node,\n index: 0,\n __prev: prev,\n };\n}\n\nfunction makeMap(size, root, ownerID, hash) {\n var map = Object.create(MapPrototype);\n map.size = size;\n map._root = root;\n map.__ownerID = ownerID;\n map.__hash = hash;\n map.__altered = false;\n return map;\n}\n\nvar EMPTY_MAP;\nfunction emptyMap() {\n return EMPTY_MAP || (EMPTY_MAP = makeMap(0));\n}\n\nfunction updateMap(map, k, v) {\n var newRoot;\n var newSize;\n if (!map._root) {\n if (v === NOT_SET) {\n return map;\n }\n newSize = 1;\n newRoot = new ArrayMapNode(map.__ownerID, [[k, v]]);\n } else {\n var didChangeSize = MakeRef();\n var didAlter = MakeRef();\n newRoot = updateNode(\n map._root,\n map.__ownerID,\n 0,\n undefined,\n k,\n v,\n didChangeSize,\n didAlter\n );\n if (!didAlter.value) {\n return map;\n }\n newSize = map.size + (didChangeSize.value ? (v === NOT_SET ? -1 : 1) : 0);\n }\n if (map.__ownerID) {\n map.size = newSize;\n map._root = newRoot;\n map.__hash = undefined;\n map.__altered = true;\n return map;\n }\n return newRoot ? makeMap(newSize, newRoot) : emptyMap();\n}\n\nfunction updateNode(\n node,\n ownerID,\n shift,\n keyHash,\n key,\n value,\n didChangeSize,\n didAlter\n) {\n if (!node) {\n if (value === NOT_SET) {\n return node;\n }\n SetRef(didAlter);\n SetRef(didChangeSize);\n return new ValueNode(ownerID, keyHash, [key, value]);\n }\n return node.update(\n ownerID,\n shift,\n keyHash,\n key,\n value,\n didChangeSize,\n didAlter\n );\n}\n\nfunction isLeafNode(node) {\n return (\n node.constructor === ValueNode || node.constructor === HashCollisionNode\n );\n}\n\nfunction mergeIntoNode(node, ownerID, shift, keyHash, entry) {\n if (node.keyHash === keyHash) {\n return new HashCollisionNode(ownerID, keyHash, [node.entry, entry]);\n }\n\n var idx1 = (shift === 0 ? node.keyHash : node.keyHash >>> shift) & MASK;\n var idx2 = (shift === 0 ? keyHash : keyHash >>> shift) & MASK;\n\n var newNode;\n var nodes =\n idx1 === idx2\n ? [mergeIntoNode(node, ownerID, shift + SHIFT, keyHash, entry)]\n : ((newNode = new ValueNode(ownerID, keyHash, entry)),\n idx1 < idx2 ? [node, newNode] : [newNode, node]);\n\n return new BitmapIndexedNode(ownerID, (1 << idx1) | (1 << idx2), nodes);\n}\n\nfunction createNodes(ownerID, entries, key, value) {\n if (!ownerID) {\n ownerID = new OwnerID();\n }\n var node = new ValueNode(ownerID, hash(key), [key, value]);\n for (var ii = 0; ii < entries.length; ii++) {\n var entry = entries[ii];\n node = node.update(ownerID, 0, undefined, entry[0], entry[1]);\n }\n return node;\n}\n\nfunction packNodes(ownerID, nodes, count, excluding) {\n var bitmap = 0;\n var packedII = 0;\n var packedNodes = new Array(count);\n for (var ii = 0, bit = 1, len = nodes.length; ii < len; ii++, bit <<= 1) {\n var node = nodes[ii];\n if (node !== undefined && ii !== excluding) {\n bitmap |= bit;\n packedNodes[packedII++] = node;\n }\n }\n return new BitmapIndexedNode(ownerID, bitmap, packedNodes);\n}\n\nfunction expandNodes(ownerID, nodes, bitmap, including, node) {\n var count = 0;\n var expandedNodes = new Array(SIZE);\n for (var ii = 0; bitmap !== 0; ii++, bitmap >>>= 1) {\n expandedNodes[ii] = bitmap & 1 ? nodes[count++] : undefined;\n }\n expandedNodes[including] = node;\n return new HashArrayMapNode(ownerID, count + 1, expandedNodes);\n}\n\nfunction popCount(x) {\n x -= (x >> 1) & 0x55555555;\n x = (x & 0x33333333) + ((x >> 2) & 0x33333333);\n x = (x + (x >> 4)) & 0x0f0f0f0f;\n x += x >> 8;\n x += x >> 16;\n return x & 0x7f;\n}\n\nfunction setAt(array, idx, val, canEdit) {\n var newArray = canEdit ? array : arrCopy(array);\n newArray[idx] = val;\n return newArray;\n}\n\nfunction spliceIn(array, idx, val, canEdit) {\n var newLen = array.length + 1;\n if (canEdit && idx + 1 === newLen) {\n array[idx] = val;\n return array;\n }\n var newArray = new Array(newLen);\n var after = 0;\n for (var ii = 0; ii < newLen; ii++) {\n if (ii === idx) {\n newArray[ii] = val;\n after = -1;\n } else {\n newArray[ii] = array[ii + after];\n }\n }\n return newArray;\n}\n\nfunction spliceOut(array, idx, canEdit) {\n var newLen = array.length - 1;\n if (canEdit && idx === newLen) {\n array.pop();\n return array;\n }\n var newArray = new Array(newLen);\n var after = 0;\n for (var ii = 0; ii < newLen; ii++) {\n if (ii === idx) {\n after = 1;\n }\n newArray[ii] = array[ii + after];\n }\n return newArray;\n}\n\nvar MAX_ARRAY_MAP_SIZE = SIZE / 4;\nvar MAX_BITMAP_INDEXED_SIZE = SIZE / 2;\nvar MIN_HASH_ARRAY_MAP_SIZE = SIZE / 4;\n\nvar IS_LIST_SYMBOL = '@@__IMMUTABLE_LIST__@@';\n\nfunction isList(maybeList) {\n return Boolean(maybeList && maybeList[IS_LIST_SYMBOL]);\n}\n\nvar List = /*@__PURE__*/(function (IndexedCollection) {\n function List(value) {\n var empty = emptyList();\n if (value === undefined || value === null) {\n // eslint-disable-next-line no-constructor-return\n return empty;\n }\n if (isList(value)) {\n // eslint-disable-next-line no-constructor-return\n return value;\n }\n var iter = IndexedCollection(value);\n var size = iter.size;\n if (size === 0) {\n // eslint-disable-next-line no-constructor-return\n return empty;\n }\n assertNotInfinite(size);\n if (size > 0 && size < SIZE) {\n // eslint-disable-next-line no-constructor-return\n return makeList(0, size, SHIFT, null, new VNode(iter.toArray()));\n }\n // eslint-disable-next-line no-constructor-return\n return empty.withMutations(function (list) {\n list.setSize(size);\n iter.forEach(function (v, i) { return list.set(i, v); });\n });\n }\n\n if ( IndexedCollection ) List.__proto__ = IndexedCollection;\n List.prototype = Object.create( IndexedCollection && IndexedCollection.prototype );\n List.prototype.constructor = List;\n\n List.of = function of (/*...values*/) {\n return this(arguments);\n };\n\n List.prototype.toString = function toString () {\n return this.__toString('List [', ']');\n };\n\n // @pragma Access\n\n List.prototype.get = function get (index, notSetValue) {\n index = wrapIndex(this, index);\n if (index >= 0 && index < this.size) {\n index += this._origin;\n var node = listNodeFor(this, index);\n return node && node.array[index & MASK];\n }\n return notSetValue;\n };\n\n // @pragma Modification\n\n List.prototype.set = function set (index, value) {\n return updateList(this, index, value);\n };\n\n List.prototype.remove = function remove (index) {\n return !this.has(index)\n ? this\n : index === 0\n ? this.shift()\n : index === this.size - 1\n ? this.pop()\n : this.splice(index, 1);\n };\n\n List.prototype.insert = function insert (index, value) {\n return this.splice(index, 0, value);\n };\n\n List.prototype.clear = function clear () {\n if (this.size === 0) {\n return this;\n }\n if (this.__ownerID) {\n this.size = this._origin = this._capacity = 0;\n this._level = SHIFT;\n this._root = this._tail = this.__hash = undefined;\n this.__altered = true;\n return this;\n }\n return emptyList();\n };\n\n List.prototype.push = function push (/*...values*/) {\n var values = arguments;\n var oldSize = this.size;\n return this.withMutations(function (list) {\n setListBounds(list, 0, oldSize + values.length);\n for (var ii = 0; ii < values.length; ii++) {\n list.set(oldSize + ii, values[ii]);\n }\n });\n };\n\n List.prototype.pop = function pop () {\n return setListBounds(this, 0, -1);\n };\n\n List.prototype.unshift = function unshift (/*...values*/) {\n var values = arguments;\n return this.withMutations(function (list) {\n setListBounds(list, -values.length);\n for (var ii = 0; ii < values.length; ii++) {\n list.set(ii, values[ii]);\n }\n });\n };\n\n List.prototype.shift = function shift () {\n return setListBounds(this, 1);\n };\n\n // @pragma Composition\n\n List.prototype.concat = function concat (/*...collections*/) {\n var arguments$1 = arguments;\n\n var seqs = [];\n for (var i = 0; i < arguments.length; i++) {\n var argument = arguments$1[i];\n var seq = IndexedCollection(\n typeof argument !== 'string' && hasIterator(argument)\n ? argument\n : [argument]\n );\n if (seq.size !== 0) {\n seqs.push(seq);\n }\n }\n if (seqs.length === 0) {\n return this;\n }\n if (this.size === 0 && !this.__ownerID && seqs.length === 1) {\n return this.constructor(seqs[0]);\n }\n return this.withMutations(function (list) {\n seqs.forEach(function (seq) { return seq.forEach(function (value) { return list.push(value); }); });\n });\n };\n\n List.prototype.setSize = function setSize (size) {\n return setListBounds(this, 0, size);\n };\n\n List.prototype.map = function map (mapper, context) {\n var this$1$1 = this;\n\n return this.withMutations(function (list) {\n for (var i = 0; i < this$1$1.size; i++) {\n list.set(i, mapper.call(context, list.get(i), i, this$1$1));\n }\n });\n };\n\n // @pragma Iteration\n\n List.prototype.slice = function slice (begin, end) {\n var size = this.size;\n if (wholeSlice(begin, end, size)) {\n return this;\n }\n return setListBounds(\n this,\n resolveBegin(begin, size),\n resolveEnd(end, size)\n );\n };\n\n List.prototype.__iterator = function __iterator (type, reverse) {\n var index = reverse ? this.size : 0;\n var values = iterateList(this, reverse);\n return new Iterator(function () {\n var value = values();\n return value === DONE\n ? iteratorDone()\n : iteratorValue(type, reverse ? --index : index++, value);\n });\n };\n\n List.prototype.__iterate = function __iterate (fn, reverse) {\n var index = reverse ? this.size : 0;\n var values = iterateList(this, reverse);\n var value;\n while ((value = values()) !== DONE) {\n if (fn(value, reverse ? --index : index++, this) === false) {\n break;\n }\n }\n return index;\n };\n\n List.prototype.__ensureOwner = function __ensureOwner (ownerID) {\n if (ownerID === this.__ownerID) {\n return this;\n }\n if (!ownerID) {\n if (this.size === 0) {\n return emptyList();\n }\n this.__ownerID = ownerID;\n this.__altered = false;\n return this;\n }\n return makeList(\n this._origin,\n this._capacity,\n this._level,\n this._root,\n this._tail,\n ownerID,\n this.__hash\n );\n };\n\n return List;\n}(IndexedCollection));\n\nList.isList = isList;\n\nvar ListPrototype = List.prototype;\nListPrototype[IS_LIST_SYMBOL] = true;\nListPrototype[DELETE] = ListPrototype.remove;\nListPrototype.merge = ListPrototype.concat;\nListPrototype.setIn = setIn;\nListPrototype.deleteIn = ListPrototype.removeIn = deleteIn;\nListPrototype.update = update;\nListPrototype.updateIn = updateIn;\nListPrototype.mergeIn = mergeIn;\nListPrototype.mergeDeepIn = mergeDeepIn;\nListPrototype.withMutations = withMutations;\nListPrototype.wasAltered = wasAltered;\nListPrototype.asImmutable = asImmutable;\nListPrototype['@@transducer/init'] = ListPrototype.asMutable = asMutable;\nListPrototype['@@transducer/step'] = function (result, arr) {\n return result.push(arr);\n};\nListPrototype['@@transducer/result'] = function (obj) {\n return obj.asImmutable();\n};\n\nvar VNode = function VNode(array, ownerID) {\n this.array = array;\n this.ownerID = ownerID;\n};\n\n// TODO: seems like these methods are very similar\n\nVNode.prototype.removeBefore = function removeBefore (ownerID, level, index) {\n if (index === level ? 1 << level : this.array.length === 0) {\n return this;\n }\n var originIndex = (index >>> level) & MASK;\n if (originIndex >= this.array.length) {\n return new VNode([], ownerID);\n }\n var removingFirst = originIndex === 0;\n var newChild;\n if (level > 0) {\n var oldChild = this.array[originIndex];\n newChild =\n oldChild && oldChild.removeBefore(ownerID, level - SHIFT, index);\n if (newChild === oldChild && removingFirst) {\n return this;\n }\n }\n if (removingFirst && !newChild) {\n return this;\n }\n var editable = editableVNode(this, ownerID);\n if (!removingFirst) {\n for (var ii = 0; ii < originIndex; ii++) {\n editable.array[ii] = undefined;\n }\n }\n if (newChild) {\n editable.array[originIndex] = newChild;\n }\n return editable;\n};\n\nVNode.prototype.removeAfter = function removeAfter (ownerID, level, index) {\n if (index === (level ? 1 << level : 0) || this.array.length === 0) {\n return this;\n }\n var sizeIndex = ((index - 1) >>> level) & MASK;\n if (sizeIndex >= this.array.length) {\n return this;\n }\n\n var newChild;\n if (level > 0) {\n var oldChild = this.array[sizeIndex];\n newChild =\n oldChild && oldChild.removeAfter(ownerID, level - SHIFT, index);\n if (newChild === oldChild && sizeIndex === this.array.length - 1) {\n return this;\n }\n }\n\n var editable = editableVNode(this, ownerID);\n editable.array.splice(sizeIndex + 1);\n if (newChild) {\n editable.array[sizeIndex] = newChild;\n }\n return editable;\n};\n\nvar DONE = {};\n\nfunction iterateList(list, reverse) {\n var left = list._origin;\n var right = list._capacity;\n var tailPos = getTailOffset(right);\n var tail = list._tail;\n\n return iterateNodeOrLeaf(list._root, list._level, 0);\n\n function iterateNodeOrLeaf(node, level, offset) {\n return level === 0\n ? iterateLeaf(node, offset)\n : iterateNode(node, level, offset);\n }\n\n function iterateLeaf(node, offset) {\n var array = offset === tailPos ? tail && tail.array : node && node.array;\n var from = offset > left ? 0 : left - offset;\n var to = right - offset;\n if (to > SIZE) {\n to = SIZE;\n }\n return function () {\n if (from === to) {\n return DONE;\n }\n var idx = reverse ? --to : from++;\n return array && array[idx];\n };\n }\n\n function iterateNode(node, level, offset) {\n var values;\n var array = node && node.array;\n var from = offset > left ? 0 : (left - offset) >> level;\n var to = ((right - offset) >> level) + 1;\n if (to > SIZE) {\n to = SIZE;\n }\n return function () {\n while (true) {\n if (values) {\n var value = values();\n if (value !== DONE) {\n return value;\n }\n values = null;\n }\n if (from === to) {\n return DONE;\n }\n var idx = reverse ? --to : from++;\n values = iterateNodeOrLeaf(\n array && array[idx],\n level - SHIFT,\n offset + (idx << level)\n );\n }\n };\n }\n}\n\nfunction makeList(origin, capacity, level, root, tail, ownerID, hash) {\n var list = Object.create(ListPrototype);\n list.size = capacity - origin;\n list._origin = origin;\n list._capacity = capacity;\n list._level = level;\n list._root = root;\n list._tail = tail;\n list.__ownerID = ownerID;\n list.__hash = hash;\n list.__altered = false;\n return list;\n}\n\nvar EMPTY_LIST;\nfunction emptyList() {\n return EMPTY_LIST || (EMPTY_LIST = makeList(0, 0, SHIFT));\n}\n\nfunction updateList(list, index, value) {\n index = wrapIndex(list, index);\n\n if (index !== index) {\n return list;\n }\n\n if (index >= list.size || index < 0) {\n return list.withMutations(function (list) {\n index < 0\n ? setListBounds(list, index).set(0, value)\n : setListBounds(list, 0, index + 1).set(index, value);\n });\n }\n\n index += list._origin;\n\n var newTail = list._tail;\n var newRoot = list._root;\n var didAlter = MakeRef();\n if (index >= getTailOffset(list._capacity)) {\n newTail = updateVNode(newTail, list.__ownerID, 0, index, value, didAlter);\n } else {\n newRoot = updateVNode(\n newRoot,\n list.__ownerID,\n list._level,\n index,\n value,\n didAlter\n );\n }\n\n if (!didAlter.value) {\n return list;\n }\n\n if (list.__ownerID) {\n list._root = newRoot;\n list._tail = newTail;\n list.__hash = undefined;\n list.__altered = true;\n return list;\n }\n return makeList(list._origin, list._capacity, list._level, newRoot, newTail);\n}\n\nfunction updateVNode(node, ownerID, level, index, value, didAlter) {\n var idx = (index >>> level) & MASK;\n var nodeHas = node && idx < node.array.length;\n if (!nodeHas && value === undefined) {\n return node;\n }\n\n var newNode;\n\n if (level > 0) {\n var lowerNode = node && node.array[idx];\n var newLowerNode = updateVNode(\n lowerNode,\n ownerID,\n level - SHIFT,\n index,\n value,\n didAlter\n );\n if (newLowerNode === lowerNode) {\n return node;\n }\n newNode = editableVNode(node, ownerID);\n newNode.array[idx] = newLowerNode;\n return newNode;\n }\n\n if (nodeHas && node.array[idx] === value) {\n return node;\n }\n\n if (didAlter) {\n SetRef(didAlter);\n }\n\n newNode = editableVNode(node, ownerID);\n if (value === undefined && idx === newNode.array.length - 1) {\n newNode.array.pop();\n } else {\n newNode.array[idx] = value;\n }\n return newNode;\n}\n\nfunction editableVNode(node, ownerID) {\n if (ownerID && node && ownerID === node.ownerID) {\n return node;\n }\n return new VNode(node ? node.array.slice() : [], ownerID);\n}\n\nfunction listNodeFor(list, rawIndex) {\n if (rawIndex >= getTailOffset(list._capacity)) {\n return list._tail;\n }\n if (rawIndex < 1 << (list._level + SHIFT)) {\n var node = list._root;\n var level = list._level;\n while (node && level > 0) {\n node = node.array[(rawIndex >>> level) & MASK];\n level -= SHIFT;\n }\n return node;\n }\n}\n\nfunction setListBounds(list, begin, end) {\n // Sanitize begin & end using this shorthand for ToInt32(argument)\n // http://www.ecma-international.org/ecma-262/6.0/#sec-toint32\n if (begin !== undefined) {\n begin |= 0;\n }\n if (end !== undefined) {\n end |= 0;\n }\n var owner = list.__ownerID || new OwnerID();\n var oldOrigin = list._origin;\n var oldCapacity = list._capacity;\n var newOrigin = oldOrigin + begin;\n var newCapacity =\n end === undefined\n ? oldCapacity\n : end < 0\n ? oldCapacity + end\n : oldOrigin + end;\n if (newOrigin === oldOrigin && newCapacity === oldCapacity) {\n return list;\n }\n\n // If it's going to end after it starts, it's empty.\n if (newOrigin >= newCapacity) {\n return list.clear();\n }\n\n var newLevel = list._level;\n var newRoot = list._root;\n\n // New origin might need creating a higher root.\n var offsetShift = 0;\n while (newOrigin + offsetShift < 0) {\n newRoot = new VNode(\n newRoot && newRoot.array.length ? [undefined, newRoot] : [],\n owner\n );\n newLevel += SHIFT;\n offsetShift += 1 << newLevel;\n }\n if (offsetShift) {\n newOrigin += offsetShift;\n oldOrigin += offsetShift;\n newCapacity += offsetShift;\n oldCapacity += offsetShift;\n }\n\n var oldTailOffset = getTailOffset(oldCapacity);\n var newTailOffset = getTailOffset(newCapacity);\n\n // New size might need creating a higher root.\n while (newTailOffset >= 1 << (newLevel + SHIFT)) {\n newRoot = new VNode(\n newRoot && newRoot.array.length ? [newRoot] : [],\n owner\n );\n newLevel += SHIFT;\n }\n\n // Locate or create the new tail.\n var oldTail = list._tail;\n var newTail =\n newTailOffset < oldTailOffset\n ? listNodeFor(list, newCapacity - 1)\n : newTailOffset > oldTailOffset\n ? new VNode([], owner)\n : oldTail;\n\n // Merge Tail into tree.\n if (\n oldTail &&\n newTailOffset > oldTailOffset &&\n newOrigin < oldCapacity &&\n oldTail.array.length\n ) {\n newRoot = editableVNode(newRoot, owner);\n var node = newRoot;\n for (var level = newLevel; level > SHIFT; level -= SHIFT) {\n var idx = (oldTailOffset >>> level) & MASK;\n node = node.array[idx] = editableVNode(node.array[idx], owner);\n }\n node.array[(oldTailOffset >>> SHIFT) & MASK] = oldTail;\n }\n\n // If the size has been reduced, there's a chance the tail needs to be trimmed.\n if (newCapacity < oldCapacity) {\n newTail = newTail && newTail.removeAfter(owner, 0, newCapacity);\n }\n\n // If the new origin is within the tail, then we do not need a root.\n if (newOrigin >= newTailOffset) {\n newOrigin -= newTailOffset;\n newCapacity -= newTailOffset;\n newLevel = SHIFT;\n newRoot = null;\n newTail = newTail && newTail.removeBefore(owner, 0, newOrigin);\n\n // Otherwise, if the root has been trimmed, garbage collect.\n } else if (newOrigin > oldOrigin || newTailOffset < oldTailOffset) {\n offsetShift = 0;\n\n // Identify the new top root node of the subtree of the old root.\n while (newRoot) {\n var beginIndex = (newOrigin >>> newLevel) & MASK;\n if ((beginIndex !== newTailOffset >>> newLevel) & MASK) {\n break;\n }\n if (beginIndex) {\n offsetShift += (1 << newLevel) * beginIndex;\n }\n newLevel -= SHIFT;\n newRoot = newRoot.array[beginIndex];\n }\n\n // Trim the new sides of the new root.\n if (newRoot && newOrigin > oldOrigin) {\n newRoot = newRoot.removeBefore(owner, newLevel, newOrigin - offsetShift);\n }\n if (newRoot && newTailOffset < oldTailOffset) {\n newRoot = newRoot.removeAfter(\n owner,\n newLevel,\n newTailOffset - offsetShift\n );\n }\n if (offsetShift) {\n newOrigin -= offsetShift;\n newCapacity -= offsetShift;\n }\n }\n\n if (list.__ownerID) {\n list.size = newCapacity - newOrigin;\n list._origin = newOrigin;\n list._capacity = newCapacity;\n list._level = newLevel;\n list._root = newRoot;\n list._tail = newTail;\n list.__hash = undefined;\n list.__altered = true;\n return list;\n }\n return makeList(newOrigin, newCapacity, newLevel, newRoot, newTail);\n}\n\nfunction getTailOffset(size) {\n return size < SIZE ? 0 : ((size - 1) >>> SHIFT) << SHIFT;\n}\n\nvar OrderedMap = /*@__PURE__*/(function (Map) {\n function OrderedMap(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptyOrderedMap()\n : isOrderedMap(value)\n ? value\n : emptyOrderedMap().withMutations(function (map) {\n var iter = KeyedCollection(value);\n assertNotInfinite(iter.size);\n iter.forEach(function (v, k) { return map.set(k, v); });\n });\n }\n\n if ( Map ) OrderedMap.__proto__ = Map;\n OrderedMap.prototype = Object.create( Map && Map.prototype );\n OrderedMap.prototype.constructor = OrderedMap;\n\n OrderedMap.of = function of (/*...values*/) {\n return this(arguments);\n };\n\n OrderedMap.prototype.toString = function toString () {\n return this.__toString('OrderedMap {', '}');\n };\n\n // @pragma Access\n\n OrderedMap.prototype.get = function get (k, notSetValue) {\n var index = this._map.get(k);\n return index !== undefined ? this._list.get(index)[1] : notSetValue;\n };\n\n // @pragma Modification\n\n OrderedMap.prototype.clear = function clear () {\n if (this.size === 0) {\n return this;\n }\n if (this.__ownerID) {\n this.size = 0;\n this._map.clear();\n this._list.clear();\n this.__altered = true;\n return this;\n }\n return emptyOrderedMap();\n };\n\n OrderedMap.prototype.set = function set (k, v) {\n return updateOrderedMap(this, k, v);\n };\n\n OrderedMap.prototype.remove = function remove (k) {\n return updateOrderedMap(this, k, NOT_SET);\n };\n\n OrderedMap.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n return this._list.__iterate(\n function (entry) { return entry && fn(entry[1], entry[0], this$1$1); },\n reverse\n );\n };\n\n OrderedMap.prototype.__iterator = function __iterator (type, reverse) {\n return this._list.fromEntrySeq().__iterator(type, reverse);\n };\n\n OrderedMap.prototype.__ensureOwner = function __ensureOwner (ownerID) {\n if (ownerID === this.__ownerID) {\n return this;\n }\n var newMap = this._map.__ensureOwner(ownerID);\n var newList = this._list.__ensureOwner(ownerID);\n if (!ownerID) {\n if (this.size === 0) {\n return emptyOrderedMap();\n }\n this.__ownerID = ownerID;\n this.__altered = false;\n this._map = newMap;\n this._list = newList;\n return this;\n }\n return makeOrderedMap(newMap, newList, ownerID, this.__hash);\n };\n\n return OrderedMap;\n}(Map));\n\nOrderedMap.isOrderedMap = isOrderedMap;\n\nOrderedMap.prototype[IS_ORDERED_SYMBOL] = true;\nOrderedMap.prototype[DELETE] = OrderedMap.prototype.remove;\n\nfunction makeOrderedMap(map, list, ownerID, hash) {\n var omap = Object.create(OrderedMap.prototype);\n omap.size = map ? map.size : 0;\n omap._map = map;\n omap._list = list;\n omap.__ownerID = ownerID;\n omap.__hash = hash;\n omap.__altered = false;\n return omap;\n}\n\nvar EMPTY_ORDERED_MAP;\nfunction emptyOrderedMap() {\n return (\n EMPTY_ORDERED_MAP ||\n (EMPTY_ORDERED_MAP = makeOrderedMap(emptyMap(), emptyList()))\n );\n}\n\nfunction updateOrderedMap(omap, k, v) {\n var map = omap._map;\n var list = omap._list;\n var i = map.get(k);\n var has = i !== undefined;\n var newMap;\n var newList;\n if (v === NOT_SET) {\n // removed\n if (!has) {\n return omap;\n }\n if (list.size >= SIZE && list.size >= map.size * 2) {\n newList = list.filter(function (entry, idx) { return entry !== undefined && i !== idx; });\n newMap = newList\n .toKeyedSeq()\n .map(function (entry) { return entry[0]; })\n .flip()\n .toMap();\n if (omap.__ownerID) {\n newMap.__ownerID = newList.__ownerID = omap.__ownerID;\n }\n } else {\n newMap = map.remove(k);\n newList = i === list.size - 1 ? list.pop() : list.set(i, undefined);\n }\n } else if (has) {\n if (v === list.get(i)[1]) {\n return omap;\n }\n newMap = map;\n newList = list.set(i, [k, v]);\n } else {\n newMap = map.set(k, list.size);\n newList = list.set(list.size, [k, v]);\n }\n if (omap.__ownerID) {\n omap.size = newMap.size;\n omap._map = newMap;\n omap._list = newList;\n omap.__hash = undefined;\n omap.__altered = true;\n return omap;\n }\n return makeOrderedMap(newMap, newList);\n}\n\nvar IS_STACK_SYMBOL = '@@__IMMUTABLE_STACK__@@';\n\nfunction isStack(maybeStack) {\n return Boolean(maybeStack && maybeStack[IS_STACK_SYMBOL]);\n}\n\nvar Stack = /*@__PURE__*/(function (IndexedCollection) {\n function Stack(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptyStack()\n : isStack(value)\n ? value\n : emptyStack().pushAll(value);\n }\n\n if ( IndexedCollection ) Stack.__proto__ = IndexedCollection;\n Stack.prototype = Object.create( IndexedCollection && IndexedCollection.prototype );\n Stack.prototype.constructor = Stack;\n\n Stack.of = function of (/*...values*/) {\n return this(arguments);\n };\n\n Stack.prototype.toString = function toString () {\n return this.__toString('Stack [', ']');\n };\n\n // @pragma Access\n\n Stack.prototype.get = function get (index, notSetValue) {\n var head = this._head;\n index = wrapIndex(this, index);\n while (head && index--) {\n head = head.next;\n }\n return head ? head.value : notSetValue;\n };\n\n Stack.prototype.peek = function peek () {\n return this._head && this._head.value;\n };\n\n // @pragma Modification\n\n Stack.prototype.push = function push (/*...values*/) {\n var arguments$1 = arguments;\n\n if (arguments.length === 0) {\n return this;\n }\n var newSize = this.size + arguments.length;\n var head = this._head;\n for (var ii = arguments.length - 1; ii >= 0; ii--) {\n head = {\n value: arguments$1[ii],\n next: head,\n };\n }\n if (this.__ownerID) {\n this.size = newSize;\n this._head = head;\n this.__hash = undefined;\n this.__altered = true;\n return this;\n }\n return makeStack(newSize, head);\n };\n\n Stack.prototype.pushAll = function pushAll (iter) {\n iter = IndexedCollection(iter);\n if (iter.size === 0) {\n return this;\n }\n if (this.size === 0 && isStack(iter)) {\n return iter;\n }\n assertNotInfinite(iter.size);\n var newSize = this.size;\n var head = this._head;\n iter.__iterate(function (value) {\n newSize++;\n head = {\n value: value,\n next: head,\n };\n }, /* reverse */ true);\n if (this.__ownerID) {\n this.size = newSize;\n this._head = head;\n this.__hash = undefined;\n this.__altered = true;\n return this;\n }\n return makeStack(newSize, head);\n };\n\n Stack.prototype.pop = function pop () {\n return this.slice(1);\n };\n\n Stack.prototype.clear = function clear () {\n if (this.size === 0) {\n return this;\n }\n if (this.__ownerID) {\n this.size = 0;\n this._head = undefined;\n this.__hash = undefined;\n this.__altered = true;\n return this;\n }\n return emptyStack();\n };\n\n Stack.prototype.slice = function slice (begin, end) {\n if (wholeSlice(begin, end, this.size)) {\n return this;\n }\n var resolvedBegin = resolveBegin(begin, this.size);\n var resolvedEnd = resolveEnd(end, this.size);\n if (resolvedEnd !== this.size) {\n // super.slice(begin, end);\n return IndexedCollection.prototype.slice.call(this, begin, end);\n }\n var newSize = this.size - resolvedBegin;\n var head = this._head;\n while (resolvedBegin--) {\n head = head.next;\n }\n if (this.__ownerID) {\n this.size = newSize;\n this._head = head;\n this.__hash = undefined;\n this.__altered = true;\n return this;\n }\n return makeStack(newSize, head);\n };\n\n // @pragma Mutability\n\n Stack.prototype.__ensureOwner = function __ensureOwner (ownerID) {\n if (ownerID === this.__ownerID) {\n return this;\n }\n if (!ownerID) {\n if (this.size === 0) {\n return emptyStack();\n }\n this.__ownerID = ownerID;\n this.__altered = false;\n return this;\n }\n return makeStack(this.size, this._head, ownerID, this.__hash);\n };\n\n // @pragma Iteration\n\n Stack.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n if (reverse) {\n return new ArraySeq(this.toArray()).__iterate(\n function (v, k) { return fn(v, k, this$1$1); },\n reverse\n );\n }\n var iterations = 0;\n var node = this._head;\n while (node) {\n if (fn(node.value, iterations++, this) === false) {\n break;\n }\n node = node.next;\n }\n return iterations;\n };\n\n Stack.prototype.__iterator = function __iterator (type, reverse) {\n if (reverse) {\n return new ArraySeq(this.toArray()).__iterator(type, reverse);\n }\n var iterations = 0;\n var node = this._head;\n return new Iterator(function () {\n if (node) {\n var value = node.value;\n node = node.next;\n return iteratorValue(type, iterations++, value);\n }\n return iteratorDone();\n });\n };\n\n return Stack;\n}(IndexedCollection));\n\nStack.isStack = isStack;\n\nvar StackPrototype = Stack.prototype;\nStackPrototype[IS_STACK_SYMBOL] = true;\nStackPrototype.shift = StackPrototype.pop;\nStackPrototype.unshift = StackPrototype.push;\nStackPrototype.unshiftAll = StackPrototype.pushAll;\nStackPrototype.withMutations = withMutations;\nStackPrototype.wasAltered = wasAltered;\nStackPrototype.asImmutable = asImmutable;\nStackPrototype['@@transducer/init'] = StackPrototype.asMutable = asMutable;\nStackPrototype['@@transducer/step'] = function (result, arr) {\n return result.unshift(arr);\n};\nStackPrototype['@@transducer/result'] = function (obj) {\n return obj.asImmutable();\n};\n\nfunction makeStack(size, head, ownerID, hash) {\n var map = Object.create(StackPrototype);\n map.size = size;\n map._head = head;\n map.__ownerID = ownerID;\n map.__hash = hash;\n map.__altered = false;\n return map;\n}\n\nvar EMPTY_STACK;\nfunction emptyStack() {\n return EMPTY_STACK || (EMPTY_STACK = makeStack(0));\n}\n\nvar IS_SET_SYMBOL = '@@__IMMUTABLE_SET__@@';\n\nfunction isSet(maybeSet) {\n return Boolean(maybeSet && maybeSet[IS_SET_SYMBOL]);\n}\n\nfunction isOrderedSet(maybeOrderedSet) {\n return isSet(maybeOrderedSet) && isOrdered(maybeOrderedSet);\n}\n\nfunction deepEqual(a, b) {\n if (a === b) {\n return true;\n }\n\n if (\n !isCollection(b) ||\n (a.size !== undefined && b.size !== undefined && a.size !== b.size) ||\n (a.__hash !== undefined &&\n b.__hash !== undefined &&\n a.__hash !== b.__hash) ||\n isKeyed(a) !== isKeyed(b) ||\n isIndexed(a) !== isIndexed(b) ||\n isOrdered(a) !== isOrdered(b)\n ) {\n return false;\n }\n\n if (a.size === 0 && b.size === 0) {\n return true;\n }\n\n var notAssociative = !isAssociative(a);\n\n if (isOrdered(a)) {\n var entries = a.entries();\n return (\n b.every(function (v, k) {\n var entry = entries.next().value;\n return entry && is(entry[1], v) && (notAssociative || is(entry[0], k));\n }) && entries.next().done\n );\n }\n\n var flipped = false;\n\n if (a.size === undefined) {\n if (b.size === undefined) {\n if (typeof a.cacheResult === 'function') {\n a.cacheResult();\n }\n } else {\n flipped = true;\n var _ = a;\n a = b;\n b = _;\n }\n }\n\n var allEqual = true;\n var bSize = b.__iterate(function (v, k) {\n if (\n notAssociative\n ? !a.has(v)\n : flipped\n ? !is(v, a.get(k, NOT_SET))\n : !is(a.get(k, NOT_SET), v)\n ) {\n allEqual = false;\n return false;\n }\n });\n\n return allEqual && a.size === bSize;\n}\n\nfunction mixin(ctor, methods) {\n var keyCopier = function (key) {\n ctor.prototype[key] = methods[key];\n };\n Object.keys(methods).forEach(keyCopier);\n Object.getOwnPropertySymbols &&\n Object.getOwnPropertySymbols(methods).forEach(keyCopier);\n return ctor;\n}\n\nfunction toJS(value) {\n if (!value || typeof value !== 'object') {\n return value;\n }\n if (!isCollection(value)) {\n if (!isDataStructure(value)) {\n return value;\n }\n value = Seq(value);\n }\n if (isKeyed(value)) {\n var result$1 = {};\n value.__iterate(function (v, k) {\n result$1[k] = toJS(v);\n });\n return result$1;\n }\n var result = [];\n value.__iterate(function (v) {\n result.push(toJS(v));\n });\n return result;\n}\n\nvar Set = /*@__PURE__*/(function (SetCollection) {\n function Set(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptySet()\n : isSet(value) && !isOrdered(value)\n ? value\n : emptySet().withMutations(function (set) {\n var iter = SetCollection(value);\n assertNotInfinite(iter.size);\n iter.forEach(function (v) { return set.add(v); });\n });\n }\n\n if ( SetCollection ) Set.__proto__ = SetCollection;\n Set.prototype = Object.create( SetCollection && SetCollection.prototype );\n Set.prototype.constructor = Set;\n\n Set.of = function of (/*...values*/) {\n return this(arguments);\n };\n\n Set.fromKeys = function fromKeys (value) {\n return this(KeyedCollection(value).keySeq());\n };\n\n Set.intersect = function intersect (sets) {\n sets = Collection(sets).toArray();\n return sets.length\n ? SetPrototype.intersect.apply(Set(sets.pop()), sets)\n : emptySet();\n };\n\n Set.union = function union (sets) {\n sets = Collection(sets).toArray();\n return sets.length\n ? SetPrototype.union.apply(Set(sets.pop()), sets)\n : emptySet();\n };\n\n Set.prototype.toString = function toString () {\n return this.__toString('Set {', '}');\n };\n\n // @pragma Access\n\n Set.prototype.has = function has (value) {\n return this._map.has(value);\n };\n\n // @pragma Modification\n\n Set.prototype.add = function add (value) {\n return updateSet(this, this._map.set(value, value));\n };\n\n Set.prototype.remove = function remove (value) {\n return updateSet(this, this._map.remove(value));\n };\n\n Set.prototype.clear = function clear () {\n return updateSet(this, this._map.clear());\n };\n\n // @pragma Composition\n\n Set.prototype.map = function map (mapper, context) {\n var this$1$1 = this;\n\n // keep track if the set is altered by the map function\n var didChanges = false;\n\n var newMap = updateSet(\n this,\n this._map.mapEntries(function (ref) {\n var v = ref[1];\n\n var mapped = mapper.call(context, v, v, this$1$1);\n\n if (mapped !== v) {\n didChanges = true;\n }\n\n return [mapped, mapped];\n }, context)\n );\n\n return didChanges ? newMap : this;\n };\n\n Set.prototype.union = function union () {\n var iters = [], len = arguments.length;\n while ( len-- ) iters[ len ] = arguments[ len ];\n\n iters = iters.filter(function (x) { return x.size !== 0; });\n if (iters.length === 0) {\n return this;\n }\n if (this.size === 0 && !this.__ownerID && iters.length === 1) {\n return this.constructor(iters[0]);\n }\n return this.withMutations(function (set) {\n for (var ii = 0; ii < iters.length; ii++) {\n if (typeof iters[ii] === 'string') {\n set.add(iters[ii]);\n } else {\n SetCollection(iters[ii]).forEach(function (value) { return set.add(value); });\n }\n }\n });\n };\n\n Set.prototype.intersect = function intersect () {\n var iters = [], len = arguments.length;\n while ( len-- ) iters[ len ] = arguments[ len ];\n\n if (iters.length === 0) {\n return this;\n }\n iters = iters.map(function (iter) { return SetCollection(iter); });\n var toRemove = [];\n this.forEach(function (value) {\n if (!iters.every(function (iter) { return iter.includes(value); })) {\n toRemove.push(value);\n }\n });\n return this.withMutations(function (set) {\n toRemove.forEach(function (value) {\n set.remove(value);\n });\n });\n };\n\n Set.prototype.subtract = function subtract () {\n var iters = [], len = arguments.length;\n while ( len-- ) iters[ len ] = arguments[ len ];\n\n if (iters.length === 0) {\n return this;\n }\n iters = iters.map(function (iter) { return SetCollection(iter); });\n var toRemove = [];\n this.forEach(function (value) {\n if (iters.some(function (iter) { return iter.includes(value); })) {\n toRemove.push(value);\n }\n });\n return this.withMutations(function (set) {\n toRemove.forEach(function (value) {\n set.remove(value);\n });\n });\n };\n\n Set.prototype.sort = function sort (comparator) {\n // Late binding\n return OrderedSet(sortFactory(this, comparator));\n };\n\n Set.prototype.sortBy = function sortBy (mapper, comparator) {\n // Late binding\n return OrderedSet(sortFactory(this, comparator, mapper));\n };\n\n Set.prototype.wasAltered = function wasAltered () {\n return this._map.wasAltered();\n };\n\n Set.prototype.__iterate = function __iterate (fn, reverse) {\n var this$1$1 = this;\n\n return this._map.__iterate(function (k) { return fn(k, k, this$1$1); }, reverse);\n };\n\n Set.prototype.__iterator = function __iterator (type, reverse) {\n return this._map.__iterator(type, reverse);\n };\n\n Set.prototype.__ensureOwner = function __ensureOwner (ownerID) {\n if (ownerID === this.__ownerID) {\n return this;\n }\n var newMap = this._map.__ensureOwner(ownerID);\n if (!ownerID) {\n if (this.size === 0) {\n return this.__empty();\n }\n this.__ownerID = ownerID;\n this._map = newMap;\n return this;\n }\n return this.__make(newMap, ownerID);\n };\n\n return Set;\n}(SetCollection));\n\nSet.isSet = isSet;\n\nvar SetPrototype = Set.prototype;\nSetPrototype[IS_SET_SYMBOL] = true;\nSetPrototype[DELETE] = SetPrototype.remove;\nSetPrototype.merge = SetPrototype.concat = SetPrototype.union;\nSetPrototype.withMutations = withMutations;\nSetPrototype.asImmutable = asImmutable;\nSetPrototype['@@transducer/init'] = SetPrototype.asMutable = asMutable;\nSetPrototype['@@transducer/step'] = function (result, arr) {\n return result.add(arr);\n};\nSetPrototype['@@transducer/result'] = function (obj) {\n return obj.asImmutable();\n};\n\nSetPrototype.__empty = emptySet;\nSetPrototype.__make = makeSet;\n\nfunction updateSet(set, newMap) {\n if (set.__ownerID) {\n set.size = newMap.size;\n set._map = newMap;\n return set;\n }\n return newMap === set._map\n ? set\n : newMap.size === 0\n ? set.__empty()\n : set.__make(newMap);\n}\n\nfunction makeSet(map, ownerID) {\n var set = Object.create(SetPrototype);\n set.size = map ? map.size : 0;\n set._map = map;\n set.__ownerID = ownerID;\n return set;\n}\n\nvar EMPTY_SET;\nfunction emptySet() {\n return EMPTY_SET || (EMPTY_SET = makeSet(emptyMap()));\n}\n\n/**\n * Returns a lazy seq of nums from start (inclusive) to end\n * (exclusive), by step, where start defaults to 0, step to 1, and end to\n * infinity. When start is equal to end, returns empty list.\n */\nvar Range = /*@__PURE__*/(function (IndexedSeq) {\n function Range(start, end, step) {\n if (!(this instanceof Range)) {\n // eslint-disable-next-line no-constructor-return\n return new Range(start, end, step);\n }\n invariant(step !== 0, 'Cannot step a Range by 0');\n start = start || 0;\n if (end === undefined) {\n end = Infinity;\n }\n step = step === undefined ? 1 : Math.abs(step);\n if (end < start) {\n step = -step;\n }\n this._start = start;\n this._end = end;\n this._step = step;\n this.size = Math.max(0, Math.ceil((end - start) / step - 1) + 1);\n if (this.size === 0) {\n if (EMPTY_RANGE) {\n // eslint-disable-next-line no-constructor-return\n return EMPTY_RANGE;\n }\n EMPTY_RANGE = this;\n }\n }\n\n if ( IndexedSeq ) Range.__proto__ = IndexedSeq;\n Range.prototype = Object.create( IndexedSeq && IndexedSeq.prototype );\n Range.prototype.constructor = Range;\n\n Range.prototype.toString = function toString () {\n if (this.size === 0) {\n return 'Range []';\n }\n return (\n 'Range [ ' +\n this._start +\n '...' +\n this._end +\n (this._step !== 1 ? ' by ' + this._step : '') +\n ' ]'\n );\n };\n\n Range.prototype.get = function get (index, notSetValue) {\n return this.has(index)\n ? this._start + wrapIndex(this, index) * this._step\n : notSetValue;\n };\n\n Range.prototype.includes = function includes (searchValue) {\n var possibleIndex = (searchValue - this._start) / this._step;\n return (\n possibleIndex >= 0 &&\n possibleIndex < this.size &&\n possibleIndex === Math.floor(possibleIndex)\n );\n };\n\n Range.prototype.slice = function slice (begin, end) {\n if (wholeSlice(begin, end, this.size)) {\n return this;\n }\n begin = resolveBegin(begin, this.size);\n end = resolveEnd(end, this.size);\n if (end <= begin) {\n return new Range(0, 0);\n }\n return new Range(\n this.get(begin, this._end),\n this.get(end, this._end),\n this._step\n );\n };\n\n Range.prototype.indexOf = function indexOf (searchValue) {\n var offsetValue = searchValue - this._start;\n if (offsetValue % this._step === 0) {\n var index = offsetValue / this._step;\n if (index >= 0 && index < this.size) {\n return index;\n }\n }\n return -1;\n };\n\n Range.prototype.lastIndexOf = function lastIndexOf (searchValue) {\n return this.indexOf(searchValue);\n };\n\n Range.prototype.__iterate = function __iterate (fn, reverse) {\n var size = this.size;\n var step = this._step;\n var value = reverse ? this._start + (size - 1) * step : this._start;\n var i = 0;\n while (i !== size) {\n if (fn(value, reverse ? size - ++i : i++, this) === false) {\n break;\n }\n value += reverse ? -step : step;\n }\n return i;\n };\n\n Range.prototype.__iterator = function __iterator (type, reverse) {\n var size = this.size;\n var step = this._step;\n var value = reverse ? this._start + (size - 1) * step : this._start;\n var i = 0;\n return new Iterator(function () {\n if (i === size) {\n return iteratorDone();\n }\n var v = value;\n value += reverse ? -step : step;\n return iteratorValue(type, reverse ? size - ++i : i++, v);\n });\n };\n\n Range.prototype.equals = function equals (other) {\n return other instanceof Range\n ? this._start === other._start &&\n this._end === other._end &&\n this._step === other._step\n : deepEqual(this, other);\n };\n\n return Range;\n}(IndexedSeq));\n\nvar EMPTY_RANGE;\n\nfunction getIn$1(collection, searchKeyPath, notSetValue) {\n var keyPath = coerceKeyPath(searchKeyPath);\n var i = 0;\n while (i !== keyPath.length) {\n collection = get(collection, keyPath[i++], NOT_SET);\n if (collection === NOT_SET) {\n return notSetValue;\n }\n }\n return collection;\n}\n\nfunction getIn(searchKeyPath, notSetValue) {\n return getIn$1(this, searchKeyPath, notSetValue);\n}\n\nfunction hasIn$1(collection, keyPath) {\n return getIn$1(collection, keyPath, NOT_SET) !== NOT_SET;\n}\n\nfunction hasIn(searchKeyPath) {\n return hasIn$1(this, searchKeyPath);\n}\n\nfunction toObject() {\n assertNotInfinite(this.size);\n var object = {};\n this.__iterate(function (v, k) {\n object[k] = v;\n });\n return object;\n}\n\n// Note: all of these methods are deprecated.\nCollection.isIterable = isCollection;\nCollection.isKeyed = isKeyed;\nCollection.isIndexed = isIndexed;\nCollection.isAssociative = isAssociative;\nCollection.isOrdered = isOrdered;\n\nCollection.Iterator = Iterator;\n\nmixin(Collection, {\n // ### Conversion to other types\n\n toArray: function toArray() {\n assertNotInfinite(this.size);\n var array = new Array(this.size || 0);\n var useTuples = isKeyed(this);\n var i = 0;\n this.__iterate(function (v, k) {\n // Keyed collections produce an array of tuples.\n array[i++] = useTuples ? [k, v] : v;\n });\n return array;\n },\n\n toIndexedSeq: function toIndexedSeq() {\n return new ToIndexedSequence(this);\n },\n\n toJS: function toJS$1() {\n return toJS(this);\n },\n\n toKeyedSeq: function toKeyedSeq() {\n return new ToKeyedSequence(this, true);\n },\n\n toMap: function toMap() {\n // Use Late Binding here to solve the circular dependency.\n return Map(this.toKeyedSeq());\n },\n\n toObject: toObject,\n\n toOrderedMap: function toOrderedMap() {\n // Use Late Binding here to solve the circular dependency.\n return OrderedMap(this.toKeyedSeq());\n },\n\n toOrderedSet: function toOrderedSet() {\n // Use Late Binding here to solve the circular dependency.\n return OrderedSet(isKeyed(this) ? this.valueSeq() : this);\n },\n\n toSet: function toSet() {\n // Use Late Binding here to solve the circular dependency.\n return Set(isKeyed(this) ? this.valueSeq() : this);\n },\n\n toSetSeq: function toSetSeq() {\n return new ToSetSequence(this);\n },\n\n toSeq: function toSeq() {\n return isIndexed(this)\n ? this.toIndexedSeq()\n : isKeyed(this)\n ? this.toKeyedSeq()\n : this.toSetSeq();\n },\n\n toStack: function toStack() {\n // Use Late Binding here to solve the circular dependency.\n return Stack(isKeyed(this) ? this.valueSeq() : this);\n },\n\n toList: function toList() {\n // Use Late Binding here to solve the circular dependency.\n return List(isKeyed(this) ? this.valueSeq() : this);\n },\n\n // ### Common JavaScript methods and properties\n\n toString: function toString() {\n return '[Collection]';\n },\n\n __toString: function __toString(head, tail) {\n if (this.size === 0) {\n return head + tail;\n }\n return (\n head +\n ' ' +\n this.toSeq().map(this.__toStringMapper).join(', ') +\n ' ' +\n tail\n );\n },\n\n // ### ES6 Collection methods (ES6 Array and Map)\n\n concat: function concat() {\n var values = [], len = arguments.length;\n while ( len-- ) values[ len ] = arguments[ len ];\n\n return reify(this, concatFactory(this, values));\n },\n\n includes: function includes(searchValue) {\n return this.some(function (value) { return is(value, searchValue); });\n },\n\n entries: function entries() {\n return this.__iterator(ITERATE_ENTRIES);\n },\n\n every: function every(predicate, context) {\n assertNotInfinite(this.size);\n var returnValue = true;\n this.__iterate(function (v, k, c) {\n if (!predicate.call(context, v, k, c)) {\n returnValue = false;\n return false;\n }\n });\n return returnValue;\n },\n\n filter: function filter(predicate, context) {\n return reify(this, filterFactory(this, predicate, context, true));\n },\n\n partition: function partition(predicate, context) {\n return partitionFactory(this, predicate, context);\n },\n\n find: function find(predicate, context, notSetValue) {\n var entry = this.findEntry(predicate, context);\n return entry ? entry[1] : notSetValue;\n },\n\n forEach: function forEach(sideEffect, context) {\n assertNotInfinite(this.size);\n return this.__iterate(context ? sideEffect.bind(context) : sideEffect);\n },\n\n join: function join(separator) {\n assertNotInfinite(this.size);\n separator = separator !== undefined ? '' + separator : ',';\n var joined = '';\n var isFirst = true;\n this.__iterate(function (v) {\n isFirst ? (isFirst = false) : (joined += separator);\n joined += v !== null && v !== undefined ? v.toString() : '';\n });\n return joined;\n },\n\n keys: function keys() {\n return this.__iterator(ITERATE_KEYS);\n },\n\n map: function map(mapper, context) {\n return reify(this, mapFactory(this, mapper, context));\n },\n\n reduce: function reduce$1(reducer, initialReduction, context) {\n return reduce(\n this,\n reducer,\n initialReduction,\n context,\n arguments.length < 2,\n false\n );\n },\n\n reduceRight: function reduceRight(reducer, initialReduction, context) {\n return reduce(\n this,\n reducer,\n initialReduction,\n context,\n arguments.length < 2,\n true\n );\n },\n\n reverse: function reverse() {\n return reify(this, reverseFactory(this, true));\n },\n\n slice: function slice(begin, end) {\n return reify(this, sliceFactory(this, begin, end, true));\n },\n\n some: function some(predicate, context) {\n assertNotInfinite(this.size);\n var returnValue = false;\n this.__iterate(function (v, k, c) {\n if (predicate.call(context, v, k, c)) {\n returnValue = true;\n return false;\n }\n });\n return returnValue;\n },\n\n sort: function sort(comparator) {\n return reify(this, sortFactory(this, comparator));\n },\n\n values: function values() {\n return this.__iterator(ITERATE_VALUES);\n },\n\n // ### More sequential methods\n\n butLast: function butLast() {\n return this.slice(0, -1);\n },\n\n isEmpty: function isEmpty() {\n return this.size !== undefined ? this.size === 0 : !this.some(function () { return true; });\n },\n\n count: function count(predicate, context) {\n return ensureSize(\n predicate ? this.toSeq().filter(predicate, context) : this\n );\n },\n\n countBy: function countBy(grouper, context) {\n return countByFactory(this, grouper, context);\n },\n\n equals: function equals(other) {\n return deepEqual(this, other);\n },\n\n entrySeq: function entrySeq() {\n var collection = this;\n if (collection._cache) {\n // We cache as an entries array, so we can just return the cache!\n return new ArraySeq(collection._cache);\n }\n var entriesSequence = collection.toSeq().map(entryMapper).toIndexedSeq();\n entriesSequence.fromEntrySeq = function () { return collection.toSeq(); };\n return entriesSequence;\n },\n\n filterNot: function filterNot(predicate, context) {\n return this.filter(not(predicate), context);\n },\n\n findEntry: function findEntry(predicate, context, notSetValue) {\n var found = notSetValue;\n this.__iterate(function (v, k, c) {\n if (predicate.call(context, v, k, c)) {\n found = [k, v];\n return false;\n }\n });\n return found;\n },\n\n findKey: function findKey(predicate, context) {\n var entry = this.findEntry(predicate, context);\n return entry && entry[0];\n },\n\n findLast: function findLast(predicate, context, notSetValue) {\n return this.toKeyedSeq().reverse().find(predicate, context, notSetValue);\n },\n\n findLastEntry: function findLastEntry(predicate, context, notSetValue) {\n return this.toKeyedSeq()\n .reverse()\n .findEntry(predicate, context, notSetValue);\n },\n\n findLastKey: function findLastKey(predicate, context) {\n return this.toKeyedSeq().reverse().findKey(predicate, context);\n },\n\n first: function first(notSetValue) {\n return this.find(returnTrue, null, notSetValue);\n },\n\n flatMap: function flatMap(mapper, context) {\n return reify(this, flatMapFactory(this, mapper, context));\n },\n\n flatten: function flatten(depth) {\n return reify(this, flattenFactory(this, depth, true));\n },\n\n fromEntrySeq: function fromEntrySeq() {\n return new FromEntriesSequence(this);\n },\n\n get: function get(searchKey, notSetValue) {\n return this.find(function (_, key) { return is(key, searchKey); }, undefined, notSetValue);\n },\n\n getIn: getIn,\n\n groupBy: function groupBy(grouper, context) {\n return groupByFactory(this, grouper, context);\n },\n\n has: function has(searchKey) {\n return this.get(searchKey, NOT_SET) !== NOT_SET;\n },\n\n hasIn: hasIn,\n\n isSubset: function isSubset(iter) {\n iter = typeof iter.includes === 'function' ? iter : Collection(iter);\n return this.every(function (value) { return iter.includes(value); });\n },\n\n isSuperset: function isSuperset(iter) {\n iter = typeof iter.isSubset === 'function' ? iter : Collection(iter);\n return iter.isSubset(this);\n },\n\n keyOf: function keyOf(searchValue) {\n return this.findKey(function (value) { return is(value, searchValue); });\n },\n\n keySeq: function keySeq() {\n return this.toSeq().map(keyMapper).toIndexedSeq();\n },\n\n last: function last(notSetValue) {\n return this.toSeq().reverse().first(notSetValue);\n },\n\n lastKeyOf: function lastKeyOf(searchValue) {\n return this.toKeyedSeq().reverse().keyOf(searchValue);\n },\n\n max: function max(comparator) {\n return maxFactory(this, comparator);\n },\n\n maxBy: function maxBy(mapper, comparator) {\n return maxFactory(this, comparator, mapper);\n },\n\n min: function min(comparator) {\n return maxFactory(\n this,\n comparator ? neg(comparator) : defaultNegComparator\n );\n },\n\n minBy: function minBy(mapper, comparator) {\n return maxFactory(\n this,\n comparator ? neg(comparator) : defaultNegComparator,\n mapper\n );\n },\n\n rest: function rest() {\n return this.slice(1);\n },\n\n skip: function skip(amount) {\n return amount === 0 ? this : this.slice(Math.max(0, amount));\n },\n\n skipLast: function skipLast(amount) {\n return amount === 0 ? this : this.slice(0, -Math.max(0, amount));\n },\n\n skipWhile: function skipWhile(predicate, context) {\n return reify(this, skipWhileFactory(this, predicate, context, true));\n },\n\n skipUntil: function skipUntil(predicate, context) {\n return this.skipWhile(not(predicate), context);\n },\n\n sortBy: function sortBy(mapper, comparator) {\n return reify(this, sortFactory(this, comparator, mapper));\n },\n\n take: function take(amount) {\n return this.slice(0, Math.max(0, amount));\n },\n\n takeLast: function takeLast(amount) {\n return this.slice(-Math.max(0, amount));\n },\n\n takeWhile: function takeWhile(predicate, context) {\n return reify(this, takeWhileFactory(this, predicate, context));\n },\n\n takeUntil: function takeUntil(predicate, context) {\n return this.takeWhile(not(predicate), context);\n },\n\n update: function update(fn) {\n return fn(this);\n },\n\n valueSeq: function valueSeq() {\n return this.toIndexedSeq();\n },\n\n // ### Hashable Object\n\n hashCode: function hashCode() {\n return this.__hash || (this.__hash = hashCollection(this));\n },\n\n // ### Internal\n\n // abstract __iterate(fn, reverse)\n\n // abstract __iterator(type, reverse)\n});\n\nvar CollectionPrototype = Collection.prototype;\nCollectionPrototype[IS_COLLECTION_SYMBOL] = true;\nCollectionPrototype[ITERATOR_SYMBOL] = CollectionPrototype.values;\nCollectionPrototype.toJSON = CollectionPrototype.toArray;\nCollectionPrototype.__toStringMapper = quoteString;\nCollectionPrototype.inspect = CollectionPrototype.toSource = function () {\n return this.toString();\n};\nCollectionPrototype.chain = CollectionPrototype.flatMap;\nCollectionPrototype.contains = CollectionPrototype.includes;\n\nmixin(KeyedCollection, {\n // ### More sequential methods\n\n flip: function flip() {\n return reify(this, flipFactory(this));\n },\n\n mapEntries: function mapEntries(mapper, context) {\n var this$1$1 = this;\n\n var iterations = 0;\n return reify(\n this,\n this.toSeq()\n .map(function (v, k) { return mapper.call(context, [k, v], iterations++, this$1$1); })\n .fromEntrySeq()\n );\n },\n\n mapKeys: function mapKeys(mapper, context) {\n var this$1$1 = this;\n\n return reify(\n this,\n this.toSeq()\n .flip()\n .map(function (k, v) { return mapper.call(context, k, v, this$1$1); })\n .flip()\n );\n },\n});\n\nvar KeyedCollectionPrototype = KeyedCollection.prototype;\nKeyedCollectionPrototype[IS_KEYED_SYMBOL] = true;\nKeyedCollectionPrototype[ITERATOR_SYMBOL] = CollectionPrototype.entries;\nKeyedCollectionPrototype.toJSON = toObject;\nKeyedCollectionPrototype.__toStringMapper = function (v, k) { return quoteString(k) + ': ' + quoteString(v); };\n\nmixin(IndexedCollection, {\n // ### Conversion to other types\n\n toKeyedSeq: function toKeyedSeq() {\n return new ToKeyedSequence(this, false);\n },\n\n // ### ES6 Collection methods (ES6 Array and Map)\n\n filter: function filter(predicate, context) {\n return reify(this, filterFactory(this, predicate, context, false));\n },\n\n findIndex: function findIndex(predicate, context) {\n var entry = this.findEntry(predicate, context);\n return entry ? entry[0] : -1;\n },\n\n indexOf: function indexOf(searchValue) {\n var key = this.keyOf(searchValue);\n return key === undefined ? -1 : key;\n },\n\n lastIndexOf: function lastIndexOf(searchValue) {\n var key = this.lastKeyOf(searchValue);\n return key === undefined ? -1 : key;\n },\n\n reverse: function reverse() {\n return reify(this, reverseFactory(this, false));\n },\n\n slice: function slice(begin, end) {\n return reify(this, sliceFactory(this, begin, end, false));\n },\n\n splice: function splice(index, removeNum /*, ...values*/) {\n var numArgs = arguments.length;\n removeNum = Math.max(removeNum || 0, 0);\n if (numArgs === 0 || (numArgs === 2 && !removeNum)) {\n return this;\n }\n // If index is negative, it should resolve relative to the size of the\n // collection. However size may be expensive to compute if not cached, so\n // only call count() if the number is in fact negative.\n index = resolveBegin(index, index < 0 ? this.count() : this.size);\n var spliced = this.slice(0, index);\n return reify(\n this,\n numArgs === 1\n ? spliced\n : spliced.concat(arrCopy(arguments, 2), this.slice(index + removeNum))\n );\n },\n\n // ### More collection methods\n\n findLastIndex: function findLastIndex(predicate, context) {\n var entry = this.findLastEntry(predicate, context);\n return entry ? entry[0] : -1;\n },\n\n first: function first(notSetValue) {\n return this.get(0, notSetValue);\n },\n\n flatten: function flatten(depth) {\n return reify(this, flattenFactory(this, depth, false));\n },\n\n get: function get(index, notSetValue) {\n index = wrapIndex(this, index);\n return index < 0 ||\n this.size === Infinity ||\n (this.size !== undefined && index > this.size)\n ? notSetValue\n : this.find(function (_, key) { return key === index; }, undefined, notSetValue);\n },\n\n has: function has(index) {\n index = wrapIndex(this, index);\n return (\n index >= 0 &&\n (this.size !== undefined\n ? this.size === Infinity || index < this.size\n : this.indexOf(index) !== -1)\n );\n },\n\n interpose: function interpose(separator) {\n return reify(this, interposeFactory(this, separator));\n },\n\n interleave: function interleave(/*...collections*/) {\n var collections = [this].concat(arrCopy(arguments));\n var zipped = zipWithFactory(this.toSeq(), IndexedSeq.of, collections);\n var interleaved = zipped.flatten(true);\n if (zipped.size) {\n interleaved.size = zipped.size * collections.length;\n }\n return reify(this, interleaved);\n },\n\n keySeq: function keySeq() {\n return Range(0, this.size);\n },\n\n last: function last(notSetValue) {\n return this.get(-1, notSetValue);\n },\n\n skipWhile: function skipWhile(predicate, context) {\n return reify(this, skipWhileFactory(this, predicate, context, false));\n },\n\n zip: function zip(/*, ...collections */) {\n var collections = [this].concat(arrCopy(arguments));\n return reify(this, zipWithFactory(this, defaultZipper, collections));\n },\n\n zipAll: function zipAll(/*, ...collections */) {\n var collections = [this].concat(arrCopy(arguments));\n return reify(this, zipWithFactory(this, defaultZipper, collections, true));\n },\n\n zipWith: function zipWith(zipper /*, ...collections */) {\n var collections = arrCopy(arguments);\n collections[0] = this;\n return reify(this, zipWithFactory(this, zipper, collections));\n },\n});\n\nvar IndexedCollectionPrototype = IndexedCollection.prototype;\nIndexedCollectionPrototype[IS_INDEXED_SYMBOL] = true;\nIndexedCollectionPrototype[IS_ORDERED_SYMBOL] = true;\n\nmixin(SetCollection, {\n // ### ES6 Collection methods (ES6 Array and Map)\n\n get: function get(value, notSetValue) {\n return this.has(value) ? value : notSetValue;\n },\n\n includes: function includes(value) {\n return this.has(value);\n },\n\n // ### More sequential methods\n\n keySeq: function keySeq() {\n return this.valueSeq();\n },\n});\n\nvar SetCollectionPrototype = SetCollection.prototype;\nSetCollectionPrototype.has = CollectionPrototype.includes;\nSetCollectionPrototype.contains = SetCollectionPrototype.includes;\nSetCollectionPrototype.keys = SetCollectionPrototype.values;\n\n// Mixin subclasses\n\nmixin(KeyedSeq, KeyedCollectionPrototype);\nmixin(IndexedSeq, IndexedCollectionPrototype);\nmixin(SetSeq, SetCollectionPrototype);\n\n// #pragma Helper functions\n\nfunction reduce(collection, reducer, reduction, context, useFirst, reverse) {\n assertNotInfinite(collection.size);\n collection.__iterate(function (v, k, c) {\n if (useFirst) {\n useFirst = false;\n reduction = v;\n } else {\n reduction = reducer.call(context, reduction, v, k, c);\n }\n }, reverse);\n return reduction;\n}\n\nfunction keyMapper(v, k) {\n return k;\n}\n\nfunction entryMapper(v, k) {\n return [k, v];\n}\n\nfunction not(predicate) {\n return function () {\n return !predicate.apply(this, arguments);\n };\n}\n\nfunction neg(predicate) {\n return function () {\n return -predicate.apply(this, arguments);\n };\n}\n\nfunction defaultZipper() {\n return arrCopy(arguments);\n}\n\nfunction defaultNegComparator(a, b) {\n return a < b ? 1 : a > b ? -1 : 0;\n}\n\nfunction hashCollection(collection) {\n if (collection.size === Infinity) {\n return 0;\n }\n var ordered = isOrdered(collection);\n var keyed = isKeyed(collection);\n var h = ordered ? 1 : 0;\n var size = collection.__iterate(\n keyed\n ? ordered\n ? function (v, k) {\n h = (31 * h + hashMerge(hash(v), hash(k))) | 0;\n }\n : function (v, k) {\n h = (h + hashMerge(hash(v), hash(k))) | 0;\n }\n : ordered\n ? function (v) {\n h = (31 * h + hash(v)) | 0;\n }\n : function (v) {\n h = (h + hash(v)) | 0;\n }\n );\n return murmurHashOfSize(size, h);\n}\n\nfunction murmurHashOfSize(size, h) {\n h = imul(h, 0xcc9e2d51);\n h = imul((h << 15) | (h >>> -15), 0x1b873593);\n h = imul((h << 13) | (h >>> -13), 5);\n h = ((h + 0xe6546b64) | 0) ^ size;\n h = imul(h ^ (h >>> 16), 0x85ebca6b);\n h = imul(h ^ (h >>> 13), 0xc2b2ae35);\n h = smi(h ^ (h >>> 16));\n return h;\n}\n\nfunction hashMerge(a, b) {\n return (a ^ (b + 0x9e3779b9 + (a << 6) + (a >> 2))) | 0; // int\n}\n\nvar OrderedSet = /*@__PURE__*/(function (Set) {\n function OrderedSet(value) {\n // eslint-disable-next-line no-constructor-return\n return value === undefined || value === null\n ? emptyOrderedSet()\n : isOrderedSet(value)\n ? value\n : emptyOrderedSet().withMutations(function (set) {\n var iter = SetCollection(value);\n assertNotInfinite(iter.size);\n iter.forEach(function (v) { return set.add(v); });\n });\n }\n\n if ( Set ) OrderedSet.__proto__ = Set;\n OrderedSet.prototype = Object.create( Set && Set.prototype );\n OrderedSet.prototype.constructor = OrderedSet;\n\n OrderedSet.of = function of (/*...values*/) {\n return this(arguments);\n };\n\n OrderedSet.fromKeys = function fromKeys (value) {\n return this(KeyedCollection(value).keySeq());\n };\n\n OrderedSet.prototype.toString = function toString () {\n return this.__toString('OrderedSet {', '}');\n };\n\n return OrderedSet;\n}(Set));\n\nOrderedSet.isOrderedSet = isOrderedSet;\n\nvar OrderedSetPrototype = OrderedSet.prototype;\nOrderedSetPrototype[IS_ORDERED_SYMBOL] = true;\nOrderedSetPrototype.zip = IndexedCollectionPrototype.zip;\nOrderedSetPrototype.zipWith = IndexedCollectionPrototype.zipWith;\nOrderedSetPrototype.zipAll = IndexedCollectionPrototype.zipAll;\n\nOrderedSetPrototype.__empty = emptyOrderedSet;\nOrderedSetPrototype.__make = makeOrderedSet;\n\nfunction makeOrderedSet(map, ownerID) {\n var set = Object.create(OrderedSetPrototype);\n set.size = map ? map.size : 0;\n set._map = map;\n set.__ownerID = ownerID;\n return set;\n}\n\nvar EMPTY_ORDERED_SET;\nfunction emptyOrderedSet() {\n return (\n EMPTY_ORDERED_SET || (EMPTY_ORDERED_SET = makeOrderedSet(emptyOrderedMap()))\n );\n}\n\nvar PairSorting = {\n LeftThenRight: -1,\n RightThenLeft: +1,\n};\n\nfunction throwOnInvalidDefaultValues(defaultValues) {\n if (isRecord(defaultValues)) {\n throw new Error(\n 'Can not call `Record` with an immutable Record as default values. Use a plain javascript object instead.'\n );\n }\n\n if (isImmutable(defaultValues)) {\n throw new Error(\n 'Can not call `Record` with an immutable Collection as default values. Use a plain javascript object instead.'\n );\n }\n\n if (defaultValues === null || typeof defaultValues !== 'object') {\n throw new Error(\n 'Can not call `Record` with a non-object as default values. Use a plain javascript object instead.'\n );\n }\n}\n\nvar Record = function Record(defaultValues, name) {\n var hasInitialized;\n\n throwOnInvalidDefaultValues(defaultValues);\n\n var RecordType = function Record(values) {\n var this$1$1 = this;\n\n if (values instanceof RecordType) {\n return values;\n }\n if (!(this instanceof RecordType)) {\n return new RecordType(values);\n }\n if (!hasInitialized) {\n hasInitialized = true;\n var keys = Object.keys(defaultValues);\n var indices = (RecordTypePrototype._indices = {});\n // Deprecated: left to attempt not to break any external code which\n // relies on a ._name property existing on record instances.\n // Use Record.getDescriptiveName() instead\n RecordTypePrototype._name = name;\n RecordTypePrototype._keys = keys;\n RecordTypePrototype._defaultValues = defaultValues;\n for (var i = 0; i < keys.length; i++) {\n var propName = keys[i];\n indices[propName] = i;\n if (RecordTypePrototype[propName]) {\n /* eslint-disable no-console */\n typeof console === 'object' &&\n console.warn &&\n console.warn(\n 'Cannot define ' +\n recordName(this) +\n ' with property \"' +\n propName +\n '\" since that property name is part of the Record API.'\n );\n /* eslint-enable no-console */\n } else {\n setProp(RecordTypePrototype, propName);\n }\n }\n }\n this.__ownerID = undefined;\n this._values = List().withMutations(function (l) {\n l.setSize(this$1$1._keys.length);\n KeyedCollection(values).forEach(function (v, k) {\n l.set(this$1$1._indices[k], v === this$1$1._defaultValues[k] ? undefined : v);\n });\n });\n return this;\n };\n\n var RecordTypePrototype = (RecordType.prototype =\n Object.create(RecordPrototype));\n RecordTypePrototype.constructor = RecordType;\n\n if (name) {\n RecordType.displayName = name;\n }\n\n // eslint-disable-next-line no-constructor-return\n return RecordType;\n};\n\nRecord.prototype.toString = function toString () {\n var str = recordName(this) + ' { ';\n var keys = this._keys;\n var k;\n for (var i = 0, l = keys.length; i !== l; i++) {\n k = keys[i];\n str += (i ? ', ' : '') + k + ': ' + quoteString(this.get(k));\n }\n return str + ' }';\n};\n\nRecord.prototype.equals = function equals (other) {\n return (\n this === other ||\n (isRecord(other) && recordSeq(this).equals(recordSeq(other)))\n );\n};\n\nRecord.prototype.hashCode = function hashCode () {\n return recordSeq(this).hashCode();\n};\n\n// @pragma Access\n\nRecord.prototype.has = function has (k) {\n return this._indices.hasOwnProperty(k);\n};\n\nRecord.prototype.get = function get (k, notSetValue) {\n if (!this.has(k)) {\n return notSetValue;\n }\n var index = this._indices[k];\n var value = this._values.get(index);\n return value === undefined ? this._defaultValues[k] : value;\n};\n\n// @pragma Modification\n\nRecord.prototype.set = function set (k, v) {\n if (this.has(k)) {\n var newValues = this._values.set(\n this._indices[k],\n v === this._defaultValues[k] ? undefined : v\n );\n if (newValues !== this._values && !this.__ownerID) {\n return makeRecord(this, newValues);\n }\n }\n return this;\n};\n\nRecord.prototype.remove = function remove (k) {\n return this.set(k);\n};\n\nRecord.prototype.clear = function clear () {\n var newValues = this._values.clear().setSize(this._keys.length);\n\n return this.__ownerID ? this : makeRecord(this, newValues);\n};\n\nRecord.prototype.wasAltered = function wasAltered () {\n return this._values.wasAltered();\n};\n\nRecord.prototype.toSeq = function toSeq () {\n return recordSeq(this);\n};\n\nRecord.prototype.toJS = function toJS$1 () {\n return toJS(this);\n};\n\nRecord.prototype.entries = function entries () {\n return this.__iterator(ITERATE_ENTRIES);\n};\n\nRecord.prototype.__iterator = function __iterator (type, reverse) {\n return recordSeq(this).__iterator(type, reverse);\n};\n\nRecord.prototype.__iterate = function __iterate (fn, reverse) {\n return recordSeq(this).__iterate(fn, reverse);\n};\n\nRecord.prototype.__ensureOwner = function __ensureOwner (ownerID) {\n if (ownerID === this.__ownerID) {\n return this;\n }\n var newValues = this._values.__ensureOwner(ownerID);\n if (!ownerID) {\n this.__ownerID = ownerID;\n this._values = newValues;\n return this;\n }\n return makeRecord(this, newValues, ownerID);\n};\n\nRecord.isRecord = isRecord;\nRecord.getDescriptiveName = recordName;\nvar RecordPrototype = Record.prototype;\nRecordPrototype[IS_RECORD_SYMBOL] = true;\nRecordPrototype[DELETE] = RecordPrototype.remove;\nRecordPrototype.deleteIn = RecordPrototype.removeIn = deleteIn;\nRecordPrototype.getIn = getIn;\nRecordPrototype.hasIn = CollectionPrototype.hasIn;\nRecordPrototype.merge = merge$1;\nRecordPrototype.mergeWith = mergeWith$1;\nRecordPrototype.mergeIn = mergeIn;\nRecordPrototype.mergeDeep = mergeDeep;\nRecordPrototype.mergeDeepWith = mergeDeepWith;\nRecordPrototype.mergeDeepIn = mergeDeepIn;\nRecordPrototype.setIn = setIn;\nRecordPrototype.update = update;\nRecordPrototype.updateIn = updateIn;\nRecordPrototype.withMutations = withMutations;\nRecordPrototype.asMutable = asMutable;\nRecordPrototype.asImmutable = asImmutable;\nRecordPrototype[ITERATOR_SYMBOL] = RecordPrototype.entries;\nRecordPrototype.toJSON = RecordPrototype.toObject =\n CollectionPrototype.toObject;\nRecordPrototype.inspect = RecordPrototype.toSource = function () {\n return this.toString();\n};\n\nfunction makeRecord(likeRecord, values, ownerID) {\n var record = Object.create(Object.getPrototypeOf(likeRecord));\n record._values = values;\n record.__ownerID = ownerID;\n return record;\n}\n\nfunction recordName(record) {\n return record.constructor.displayName || record.constructor.name || 'Record';\n}\n\nfunction recordSeq(record) {\n return keyedSeqFromValue(record._keys.map(function (k) { return [k, record.get(k)]; }));\n}\n\nfunction setProp(prototype, name) {\n try {\n Object.defineProperty(prototype, name, {\n get: function () {\n return this.get(name);\n },\n set: function (value) {\n invariant(this.__ownerID, 'Cannot set on an immutable record.');\n this.set(name, value);\n },\n });\n } catch (error) {\n // Object.defineProperty failed. Probably IE8.\n }\n}\n\n/**\n * Returns a lazy Seq of `value` repeated `times` times. When `times` is\n * undefined, returns an infinite sequence of `value`.\n */\nvar Repeat = /*@__PURE__*/(function (IndexedSeq) {\n function Repeat(value, times) {\n if (!(this instanceof Repeat)) {\n // eslint-disable-next-line no-constructor-return\n return new Repeat(value, times);\n }\n this._value = value;\n this.size = times === undefined ? Infinity : Math.max(0, times);\n if (this.size === 0) {\n if (EMPTY_REPEAT) {\n // eslint-disable-next-line no-constructor-return\n return EMPTY_REPEAT;\n }\n EMPTY_REPEAT = this;\n }\n }\n\n if ( IndexedSeq ) Repeat.__proto__ = IndexedSeq;\n Repeat.prototype = Object.create( IndexedSeq && IndexedSeq.prototype );\n Repeat.prototype.constructor = Repeat;\n\n Repeat.prototype.toString = function toString () {\n if (this.size === 0) {\n return 'Repeat []';\n }\n return 'Repeat [ ' + this._value + ' ' + this.size + ' times ]';\n };\n\n Repeat.prototype.get = function get (index, notSetValue) {\n return this.has(index) ? this._value : notSetValue;\n };\n\n Repeat.prototype.includes = function includes (searchValue) {\n return is(this._value, searchValue);\n };\n\n Repeat.prototype.slice = function slice (begin, end) {\n var size = this.size;\n return wholeSlice(begin, end, size)\n ? this\n : new Repeat(\n this._value,\n resolveEnd(end, size) - resolveBegin(begin, size)\n );\n };\n\n Repeat.prototype.reverse = function reverse () {\n return this;\n };\n\n Repeat.prototype.indexOf = function indexOf (searchValue) {\n if (is(this._value, searchValue)) {\n return 0;\n }\n return -1;\n };\n\n Repeat.prototype.lastIndexOf = function lastIndexOf (searchValue) {\n if (is(this._value, searchValue)) {\n return this.size;\n }\n return -1;\n };\n\n Repeat.prototype.__iterate = function __iterate (fn, reverse) {\n var size = this.size;\n var i = 0;\n while (i !== size) {\n if (fn(this._value, reverse ? size - ++i : i++, this) === false) {\n break;\n }\n }\n return i;\n };\n\n Repeat.prototype.__iterator = function __iterator (type, reverse) {\n var this$1$1 = this;\n\n var size = this.size;\n var i = 0;\n return new Iterator(function () { return i === size\n ? iteratorDone()\n : iteratorValue(type, reverse ? size - ++i : i++, this$1$1._value); }\n );\n };\n\n Repeat.prototype.equals = function equals (other) {\n return other instanceof Repeat\n ? is(this._value, other._value)\n : deepEqual(this, other);\n };\n\n return Repeat;\n}(IndexedSeq));\n\nvar EMPTY_REPEAT;\n\nfunction fromJS(value, converter) {\n return fromJSWith(\n [],\n converter || defaultConverter,\n value,\n '',\n converter && converter.length > 2 ? [] : undefined,\n { '': value }\n );\n}\n\nfunction fromJSWith(stack, converter, value, key, keyPath, parentValue) {\n if (\n typeof value !== 'string' &&\n !isImmutable(value) &&\n (isArrayLike(value) || hasIterator(value) || isPlainObject(value))\n ) {\n if (~stack.indexOf(value)) {\n throw new TypeError('Cannot convert circular structure to Immutable');\n }\n stack.push(value);\n keyPath && key !== '' && keyPath.push(key);\n var converted = converter.call(\n parentValue,\n key,\n Seq(value).map(function (v, k) { return fromJSWith(stack, converter, v, k, keyPath, value); }\n ),\n keyPath && keyPath.slice()\n );\n stack.pop();\n keyPath && keyPath.pop();\n return converted;\n }\n return value;\n}\n\nfunction defaultConverter(k, v) {\n // Effectively the opposite of \"Collection.toSeq()\"\n return isIndexed(v) ? v.toList() : isKeyed(v) ? v.toMap() : v.toSet();\n}\n\nvar version = \"4.3.6\";\n\nvar Immutable = {\n version: version,\n\n Collection: Collection,\n // Note: Iterable is deprecated\n Iterable: Collection,\n\n Seq: Seq,\n Map: Map,\n OrderedMap: OrderedMap,\n List: List,\n Stack: Stack,\n Set: Set,\n OrderedSet: OrderedSet,\n PairSorting: PairSorting,\n\n Record: Record,\n Range: Range,\n Repeat: Repeat,\n\n is: is,\n fromJS: fromJS,\n hash: hash,\n\n isImmutable: isImmutable,\n isCollection: isCollection,\n isKeyed: isKeyed,\n isIndexed: isIndexed,\n isAssociative: isAssociative,\n isOrdered: isOrdered,\n isValueObject: isValueObject,\n isPlainObject: isPlainObject,\n isSeq: isSeq,\n isList: isList,\n isMap: isMap,\n isOrderedMap: isOrderedMap,\n isStack: isStack,\n isSet: isSet,\n isOrderedSet: isOrderedSet,\n isRecord: isRecord,\n\n get: get,\n getIn: getIn$1,\n has: has,\n hasIn: hasIn$1,\n merge: merge,\n mergeDeep: mergeDeep$1,\n mergeWith: mergeWith,\n mergeDeepWith: mergeDeepWith$1,\n remove: remove,\n removeIn: removeIn,\n set: set,\n setIn: setIn$1,\n update: update$1,\n updateIn: updateIn$1,\n};\n\n// Note: Iterable is deprecated\nvar Iterable = Collection;\n\nexport default Immutable;\nexport { Collection, Iterable, List, Map, OrderedMap, OrderedSet, PairSorting, Range, Record, Repeat, Seq, Set, Stack, fromJS, get, getIn$1 as getIn, has, hasIn$1 as hasIn, hash, is, isAssociative, isCollection, isImmutable, isIndexed, isKeyed, isList, isMap, isOrdered, isOrderedMap, isOrderedSet, isPlainObject, isRecord, isSeq, isSet, isStack, isValueObject, merge, mergeDeep$1 as mergeDeep, mergeDeepWith$1 as mergeDeepWith, mergeWith, remove, removeIn, set, setIn$1 as setIn, update$1 as update, updateIn$1 as updateIn, version };\n","import { OidcUserExtendedInfo } from '../types/OidcUserExtendedInfo.tsx'\r\nimport { useOidcUser } from '@axa-fr/react-oidc'\r\nimport { appRoles } from '../global/config.tsx'\r\nimport { useAppSelector } from './reduxHooks.tsx'\r\nimport { useMemo } from 'react'\r\nimport { List } from 'immutable'\r\n\r\nconst useUserRoles = () => {\r\n const profile = useAppSelector((state) => state.register.selectedRegistration)\r\n const { oidcUser } = useOidcUser()\r\n const { role } = oidcUser || {}\r\n\r\n const rolesArray = useMemo(() => {\r\n return List(role ? (Array.isArray(role) ? role : [role]) : [])\r\n }, [role])\r\n\r\n const hasDocentIdOrInternal = useMemo(() => {\r\n return (profile && profile.adrId > 0) || (rolesArray.some((r) => appRoles.Intern.includes(r)) ?? false)\r\n }, [profile, rolesArray])\r\n\r\n const isInternal = useMemo(() => {\r\n return rolesArray.some((r) => appRoles.Intern.includes(r)) ?? false\r\n }, [rolesArray])\r\n\r\n const isDocentWithoutDocentId = useMemo(() => {\r\n return !(profile !== undefined && profile.adrId > 0 && rolesArray.some((r) => appRoles.Dozent.includes(r)))\r\n }, [profile, rolesArray])\r\n\r\n return { hasDocentIdOrInternal, isInternal, isDocentWithoutDocentId }\r\n}\r\n\r\nexport default useUserRoles\r\n","import styles from './sidebar.module.scss'\r\nimport { NavLink } from 'react-router-dom'\r\nimport { SidebarComponent } from '@syncfusion/ej2-react-navigations'\r\nimport ViewComfyIcon from '@mui/icons-material/ViewComfy'\r\nimport CalendarMonthIcon from '@mui/icons-material/CalendarMonth'\r\nimport { TooltipComponent } from '@syncfusion/ej2-react-popups'\r\nimport { isMobile } from 'react-device-detect'\r\n\r\nimport { useAppDispatch, useAppSelector } from '../../hooks/reduxHooks.tsx'\r\n\r\nimport { triggerAction } from '../../redux/sideBarSlice.tsx'\r\nimport { useRef } from 'react'\r\n\r\nimport useGracefulHover from '../../hooks/useGracefulHover.tsx'\r\nimport { Groups2, Person, UploadFile } from '@mui/icons-material'\r\nimport useUserRoles from '../../hooks/useUserRoles.tsx'\r\n\r\ninterface SidebarProps {\r\n register: boolean\r\n}\r\n\r\nexport const SideBar = (props: SidebarProps) => {\r\n const sidebarRef = useRef(null)\r\n\r\n const reduxSideBar = useAppSelector((state) => state.sideBar.isToggled)\r\n const profile = useAppSelector(state => state.register.selectedRegistration)\r\n const dispatch = useAppDispatch()\r\n const { hasDocentIdOrInternal, isInternal } = useUserRoles()\r\n\r\n const triggerEnterAction = () => {\r\n //FixMe: Das aus- und einfahren der Sidebar ist nicht ganz nachvollziehbar, warum es passiert.\r\n // Muss optimiert werden. Bis dahin nur über das Hamburger Menü zu öffnen.\r\n dispatch(triggerAction(false))\r\n }\r\n\r\n const triggerLeaveAction = () => {\r\n dispatch(triggerAction(false))\r\n }\r\n\r\n const { handleMouseEnter, handleMouseLeave } = useGracefulHover(\r\n triggerEnterAction,\r\n triggerLeaveAction,\r\n 800, // Verzögerung für Enter\r\n 1000, // Verzögerung für Leave\r\n )\r\n\r\n const trueContent = (\r\n \r\n
    \r\n
    \r\n \r\n \r\n \r\n Register\r\n \r\n \r\n
    \r\n
    \r\n \r\n )\r\n\r\n const falseContent = (\r\n \r\n
    \r\n
    \r\n {/**/}\r\n {/* */}\r\n {/* */}\r\n {/* Dashboard*/}\r\n {/* */}\r\n {/**/}\r\n\r\n\r\n {isInternal && (\r\n \r\n \r\n \r\n Dozentenübersicht\r\n \r\n \r\n )}\r\n\r\n {/*Folgender Menüpunkt nur sichtbar, wenn der Dozent bereits eine Dozenten ID durch den Mitarbeiter erhalten hat*/}\r\n {hasDocentIdOrInternal && (\r\n <>{(profile && profile.adrId !== null) ? (\r\n \r\n \r\n \r\n Veranstaltungen\r\n \r\n ) :\r\n (
    \r\n \r\n Profil\r\n
    )}\r\n {/*Auf eigenes Profil navigieren, wenn Rolle = Docent - ToDo: muss nach Freigabe vom Profil geändert werden */}\r\n {isInternal && ((profile) ? (\r\n \r\n \r\n \r\n Profil\r\n \r\n ) : (\r\n
    \r\n \r\n Profil\r\n
    \r\n ))}\r\n {isInternal && \r\n \r\n \r\n Datei Austausch\r\n \r\n \r\n }\r\n \r\n )}\r\n\r\n {/* \r\n \r\n \r\n Ausschreibungen\r\n \r\n */}\r\n {/* \r\n \r\n \r\n Themenvorschlag\r\n \r\n \r\n \r\n \r\n \r\n Passwort ändern\r\n \r\n */}\r\n
    \r\n
    \r\n     \r\n )\r\n\r\n return (\r\n
    \r\n {props.register ? trueContent : falseContent}\r\n
    \r\n )\r\n}\r\n","import React from 'react';\n\nvar isCheckBoxInput = (element) => element.type === 'checkbox';\n\nvar isDateObject = (value) => value instanceof Date;\n\nvar isNullOrUndefined = (value) => value == null;\n\nconst isObjectType = (value) => typeof value === 'object';\nvar isObject = (value) => !isNullOrUndefined(value) &&\n !Array.isArray(value) &&\n isObjectType(value) &&\n !isDateObject(value);\n\nvar getEventValue = (event) => isObject(event) && event.target\n ? isCheckBoxInput(event.target)\n ? event.target.checked\n : event.target.value\n : event;\n\nvar getNodeParentName = (name) => name.substring(0, name.search(/\\.\\d+(\\.|$)/)) || name;\n\nvar isNameInFieldArray = (names, name) => names.has(getNodeParentName(name));\n\nvar isPlainObject = (tempObject) => {\n const prototypeCopy = tempObject.constructor && tempObject.constructor.prototype;\n return (isObject(prototypeCopy) && prototypeCopy.hasOwnProperty('isPrototypeOf'));\n};\n\nvar isWeb = typeof window !== 'undefined' &&\n typeof window.HTMLElement !== 'undefined' &&\n typeof document !== 'undefined';\n\nfunction cloneObject(data) {\n let copy;\n const isArray = Array.isArray(data);\n if (data instanceof Date) {\n copy = new Date(data);\n }\n else if (data instanceof Set) {\n copy = new Set(data);\n }\n else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) &&\n (isArray || isObject(data))) {\n copy = isArray ? [] : {};\n if (!isArray && !isPlainObject(data)) {\n copy = data;\n }\n else {\n for (const key in data) {\n if (data.hasOwnProperty(key)) {\n copy[key] = cloneObject(data[key]);\n }\n }\n }\n }\n else {\n return data;\n }\n return copy;\n}\n\nvar compact = (value) => Array.isArray(value) ? value.filter(Boolean) : [];\n\nvar isUndefined = (val) => val === undefined;\n\nvar get = (object, path, defaultValue) => {\n if (!path || !isObject(object)) {\n return defaultValue;\n }\n const result = compact(path.split(/[,[\\].]+?/)).reduce((result, key) => isNullOrUndefined(result) ? result : result[key], object);\n return isUndefined(result) || result === object\n ? isUndefined(object[path])\n ? defaultValue\n : object[path]\n : result;\n};\n\nvar isBoolean = (value) => typeof value === 'boolean';\n\nvar isKey = (value) => /^\\w*$/.test(value);\n\nvar stringToPath = (input) => compact(input.replace(/[\"|']|\\]/g, '').split(/\\.|\\[/));\n\nvar set = (object, path, value) => {\n let index = -1;\n const tempPath = isKey(path) ? [path] : stringToPath(path);\n const length = tempPath.length;\n const lastIndex = length - 1;\n while (++index < length) {\n const key = tempPath[index];\n let newValue = value;\n if (index !== lastIndex) {\n const objValue = object[key];\n newValue =\n isObject(objValue) || Array.isArray(objValue)\n ? objValue\n : !isNaN(+tempPath[index + 1])\n ? []\n : {};\n }\n if (key === '__proto__') {\n return;\n }\n object[key] = newValue;\n object = object[key];\n }\n return object;\n};\n\nconst EVENTS = {\n BLUR: 'blur',\n FOCUS_OUT: 'focusout',\n CHANGE: 'change',\n};\nconst VALIDATION_MODE = {\n onBlur: 'onBlur',\n onChange: 'onChange',\n onSubmit: 'onSubmit',\n onTouched: 'onTouched',\n all: 'all',\n};\nconst INPUT_VALIDATION_RULES = {\n max: 'max',\n min: 'min',\n maxLength: 'maxLength',\n minLength: 'minLength',\n pattern: 'pattern',\n required: 'required',\n validate: 'validate',\n};\n\nconst HookFormContext = React.createContext(null);\n/**\n * This custom hook allows you to access the form context. useFormContext is intended to be used in deeply nested structures, where it would become inconvenient to pass the context as a prop. To be used with {@link FormProvider}.\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/useformcontext) • [Demo](https://codesandbox.io/s/react-hook-form-v7-form-context-ytudi)\n *\n * @returns return all useForm methods\n *\n * @example\n * ```tsx\n * function App() {\n * const methods = useForm();\n * const onSubmit = data => console.log(data);\n *\n * return (\n * \n * \n * \n * \n * \n * \n * );\n * }\n *\n * function NestedInput() {\n * const { register } = useFormContext(); // retrieve all hook methods\n * return ;\n * }\n * ```\n */\nconst useFormContext = () => React.useContext(HookFormContext);\n/**\n * A provider component that propagates the `useForm` methods to all children components via [React Context](https://reactjs.org/docs/context.html) API. To be used with {@link useFormContext}.\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/useformcontext) • [Demo](https://codesandbox.io/s/react-hook-form-v7-form-context-ytudi)\n *\n * @param props - all useForm methods\n *\n * @example\n * ```tsx\n * function App() {\n * const methods = useForm();\n * const onSubmit = data => console.log(data);\n *\n * return (\n * \n *
    \n * \n * \n * \n *
    \n * );\n * }\n *\n * function NestedInput() {\n * const { register } = useFormContext(); // retrieve all hook methods\n * return ;\n * }\n * ```\n */\nconst FormProvider = (props) => {\n const { children, ...data } = props;\n return (React.createElement(HookFormContext.Provider, { value: data }, children));\n};\n\nvar getProxyFormState = (formState, control, localProxyFormState, isRoot = true) => {\n const result = {\n defaultValues: control._defaultValues,\n };\n for (const key in formState) {\n Object.defineProperty(result, key, {\n get: () => {\n const _key = key;\n if (control._proxyFormState[_key] !== VALIDATION_MODE.all) {\n control._proxyFormState[_key] = !isRoot || VALIDATION_MODE.all;\n }\n localProxyFormState && (localProxyFormState[_key] = true);\n return formState[_key];\n },\n });\n }\n return result;\n};\n\nvar isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;\n\nvar shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {\n updateFormState(formStateData);\n const { name, ...formState } = formStateData;\n return (isEmptyObject(formState) ||\n Object.keys(formState).length >= Object.keys(_proxyFormState).length ||\n Object.keys(formState).find((key) => _proxyFormState[key] ===\n (!isRoot || VALIDATION_MODE.all)));\n};\n\nvar convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);\n\nvar shouldSubscribeByName = (name, signalName, exact) => !name ||\n !signalName ||\n name === signalName ||\n convertToArrayPayload(name).some((currentName) => currentName &&\n (exact\n ? currentName === signalName\n : currentName.startsWith(signalName) ||\n signalName.startsWith(currentName)));\n\nfunction useSubscribe(props) {\n const _props = React.useRef(props);\n _props.current = props;\n React.useEffect(() => {\n const subscription = !props.disabled &&\n _props.current.subject &&\n _props.current.subject.subscribe({\n next: _props.current.next,\n });\n return () => {\n subscription && subscription.unsubscribe();\n };\n }, [props.disabled]);\n}\n\n/**\n * This custom hook allows you to subscribe to each form state, and isolate the re-render at the custom hook level. It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form application.\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/useformstate) • [Demo](https://codesandbox.io/s/useformstate-75xly)\n *\n * @param props - include options on specify fields to subscribe. {@link UseFormStateReturn}\n *\n * @example\n * ```tsx\n * function App() {\n * const { register, handleSubmit, control } = useForm({\n * defaultValues: {\n * firstName: \"firstName\"\n * }});\n * const { dirtyFields } = useFormState({\n * control\n * });\n * const onSubmit = (data) => console.log(data);\n *\n * return (\n *
    \n * \n * {dirtyFields.firstName &&

    Field is dirty.

    }\n * \n *
    \n * );\n * }\n * ```\n */\nfunction useFormState(props) {\n const methods = useFormContext();\n const { control = methods.control, disabled, name, exact } = props || {};\n const [formState, updateFormState] = React.useState(control._formState);\n const _mounted = React.useRef(true);\n const _localProxyFormState = React.useRef({\n isDirty: false,\n isLoading: false,\n dirtyFields: false,\n touchedFields: false,\n validatingFields: false,\n isValidating: false,\n isValid: false,\n errors: false,\n });\n const _name = React.useRef(name);\n _name.current = name;\n useSubscribe({\n disabled,\n next: (value) => _mounted.current &&\n shouldSubscribeByName(_name.current, value.name, exact) &&\n shouldRenderFormState(value, _localProxyFormState.current, control._updateFormState) &&\n updateFormState({\n ...control._formState,\n ...value,\n }),\n subject: control._subjects.state,\n });\n React.useEffect(() => {\n _mounted.current = true;\n _localProxyFormState.current.isValid && control._updateValid(true);\n return () => {\n _mounted.current = false;\n };\n }, [control]);\n return getProxyFormState(formState, control, _localProxyFormState.current, false);\n}\n\nvar isString = (value) => typeof value === 'string';\n\nvar generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => {\n if (isString(names)) {\n isGlobal && _names.watch.add(names);\n return get(formValues, names, defaultValue);\n }\n if (Array.isArray(names)) {\n return names.map((fieldName) => (isGlobal && _names.watch.add(fieldName), get(formValues, fieldName)));\n }\n isGlobal && (_names.watchAll = true);\n return formValues;\n};\n\n/**\n * Custom hook to subscribe to field change and isolate re-rendering at the component level.\n *\n * @remarks\n *\n * [API](https://react-hook-form.com/docs/usewatch) • [Demo](https://codesandbox.io/s/react-hook-form-v7-ts-usewatch-h9i5e)\n *\n * @example\n * ```tsx\n * const { control } = useForm();\n * const values = useWatch({\n * name: \"fieldName\"\n * control,\n * })\n * ```\n */\nfunction useWatch(props) {\n const methods = useFormContext();\n const { control = methods.control, name, defaultValue, disabled, exact, } = props || {};\n const _name = React.useRef(name);\n _name.current = name;\n useSubscribe({\n disabled,\n subject: control._subjects.values,\n next: (formState) => {\n if (shouldSubscribeByName(_name.current, formState.name, exact)) {\n updateValue(cloneObject(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, defaultValue)));\n }\n },\n });\n const [value, updateValue] = React.useState(control._getWatch(name, defaultValue));\n React.useEffect(() => control._removeUnmounted());\n return value;\n}\n\n/**\n * Custom hook to work with controlled component, this function provide you with both form and field level state. Re-render is isolated at the hook level.\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/usecontroller) • [Demo](https://codesandbox.io/s/usecontroller-0o8px)\n *\n * @param props - the path name to the form field value, and validation rules.\n *\n * @returns field properties, field and form state. {@link UseControllerReturn}\n *\n * @example\n * ```tsx\n * function Input(props) {\n * const { field, fieldState, formState } = useController(props);\n * return (\n *
    \n * \n *

    {fieldState.isTouched && \"Touched\"}

    \n *

    {formState.isSubmitted ? \"submitted\" : \"\"}

    \n *
    \n * );\n * }\n * ```\n */\nfunction useController(props) {\n const methods = useFormContext();\n const { name, disabled, control = methods.control, shouldUnregister } = props;\n const isArrayField = isNameInFieldArray(control._names.array, name);\n const value = useWatch({\n control,\n name,\n defaultValue: get(control._formValues, name, get(control._defaultValues, name, props.defaultValue)),\n exact: true,\n });\n const formState = useFormState({\n control,\n name,\n });\n const _registerProps = React.useRef(control.register(name, {\n ...props.rules,\n value,\n ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),\n }));\n React.useEffect(() => {\n const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;\n const updateMounted = (name, value) => {\n const field = get(control._fields, name);\n if (field) {\n field._f.mount = value;\n }\n };\n updateMounted(name, true);\n if (_shouldUnregisterField) {\n const value = cloneObject(get(control._options.defaultValues, name));\n set(control._defaultValues, name, value);\n if (isUndefined(get(control._formValues, name))) {\n set(control._formValues, name, value);\n }\n }\n return () => {\n (isArrayField\n ? _shouldUnregisterField && !control._state.action\n : _shouldUnregisterField)\n ? control.unregister(name)\n : updateMounted(name, false);\n };\n }, [name, control, isArrayField, shouldUnregister]);\n React.useEffect(() => {\n if (get(control._fields, name)) {\n control._updateDisabledField({\n disabled,\n fields: control._fields,\n name,\n value: get(control._fields, name)._f.value,\n });\n }\n }, [disabled, name, control]);\n return {\n field: {\n name,\n value,\n ...(isBoolean(disabled) || formState.disabled\n ? { disabled: formState.disabled || disabled }\n : {}),\n onChange: React.useCallback((event) => _registerProps.current.onChange({\n target: {\n value: getEventValue(event),\n name: name,\n },\n type: EVENTS.CHANGE,\n }), [name]),\n onBlur: React.useCallback(() => _registerProps.current.onBlur({\n target: {\n value: get(control._formValues, name),\n name: name,\n },\n type: EVENTS.BLUR,\n }), [name, control]),\n ref: (elm) => {\n const field = get(control._fields, name);\n if (field && elm) {\n field._f.ref = {\n focus: () => elm.focus(),\n select: () => elm.select(),\n setCustomValidity: (message) => elm.setCustomValidity(message),\n reportValidity: () => elm.reportValidity(),\n };\n }\n },\n },\n formState,\n fieldState: Object.defineProperties({}, {\n invalid: {\n enumerable: true,\n get: () => !!get(formState.errors, name),\n },\n isDirty: {\n enumerable: true,\n get: () => !!get(formState.dirtyFields, name),\n },\n isTouched: {\n enumerable: true,\n get: () => !!get(formState.touchedFields, name),\n },\n isValidating: {\n enumerable: true,\n get: () => !!get(formState.validatingFields, name),\n },\n error: {\n enumerable: true,\n get: () => get(formState.errors, name),\n },\n }),\n };\n}\n\n/**\n * Component based on `useController` hook to work with controlled component.\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/usecontroller/controller) • [Demo](https://codesandbox.io/s/react-hook-form-v6-controller-ts-jwyzw) • [Video](https://www.youtube.com/watch?v=N2UNk_UCVyA)\n *\n * @param props - the path name to the form field value, and validation rules.\n *\n * @returns provide field handler functions, field and form state.\n *\n * @example\n * ```tsx\n * function App() {\n * const { control } = useForm({\n * defaultValues: {\n * test: \"\"\n * }\n * });\n *\n * return (\n *
    \n * (\n * <>\n * \n *

    {formState.isSubmitted ? \"submitted\" : \"\"}

    \n *

    {fieldState.isTouched ? \"touched\" : \"\"}

    \n * \n * )}\n * />\n * \n * );\n * }\n * ```\n */\nconst Controller = (props) => props.render(useController(props));\n\nconst POST_REQUEST = 'post';\n/**\n * Form component to manage submission.\n *\n * @param props - to setup submission detail. {@link FormProps}\n *\n * @returns form component or headless render prop.\n *\n * @example\n * ```tsx\n * function App() {\n * const { control, formState: { errors } } = useForm();\n *\n * return (\n *
    \n * \n *

    {errors?.root?.server && 'Server error'}

    \n * \n *
    \n * );\n * }\n * ```\n */\nfunction Form(props) {\n const methods = useFormContext();\n const [mounted, setMounted] = React.useState(false);\n const { control = methods.control, onSubmit, children, action, method = POST_REQUEST, headers, encType, onError, render, onSuccess, validateStatus, ...rest } = props;\n const submit = async (event) => {\n let hasError = false;\n let type = '';\n await control.handleSubmit(async (data) => {\n const formData = new FormData();\n let formDataJson = '';\n try {\n formDataJson = JSON.stringify(data);\n }\n catch (_a) { }\n for (const name of control._names.mount) {\n formData.append(name, get(data, name));\n }\n if (onSubmit) {\n await onSubmit({\n data,\n event,\n method,\n formData,\n formDataJson,\n });\n }\n if (action) {\n try {\n const shouldStringifySubmissionData = [\n headers && headers['Content-Type'],\n encType,\n ].some((value) => value && value.includes('json'));\n const response = await fetch(action, {\n method,\n headers: {\n ...headers,\n ...(encType ? { 'Content-Type': encType } : {}),\n },\n body: shouldStringifySubmissionData ? formDataJson : formData,\n });\n if (response &&\n (validateStatus\n ? !validateStatus(response.status)\n : response.status < 200 || response.status >= 300)) {\n hasError = true;\n onError && onError({ response });\n type = String(response.status);\n }\n else {\n onSuccess && onSuccess({ response });\n }\n }\n catch (error) {\n hasError = true;\n onError && onError({ error });\n }\n }\n })(event);\n if (hasError && props.control) {\n props.control._subjects.state.next({\n isSubmitSuccessful: false,\n });\n props.control.setError('root.server', {\n type,\n });\n }\n };\n React.useEffect(() => {\n setMounted(true);\n }, []);\n return render ? (React.createElement(React.Fragment, null, render({\n submit,\n }))) : (React.createElement(\"form\", { noValidate: mounted, action: action, method: method, encType: encType, onSubmit: submit, ...rest }, children));\n}\n\nvar appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria\n ? {\n ...errors[name],\n types: {\n ...(errors[name] && errors[name].types ? errors[name].types : {}),\n [type]: message || true,\n },\n }\n : {};\n\nvar generateId = () => {\n const d = typeof performance === 'undefined' ? Date.now() : performance.now() * 1000;\n return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {\n const r = (Math.random() * 16 + d) % 16 | 0;\n return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16);\n });\n};\n\nvar getFocusFieldName = (name, index, options = {}) => options.shouldFocus || isUndefined(options.shouldFocus)\n ? options.focusName ||\n `${name}.${isUndefined(options.focusIndex) ? index : options.focusIndex}.`\n : '';\n\nvar getValidationModes = (mode) => ({\n isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,\n isOnBlur: mode === VALIDATION_MODE.onBlur,\n isOnChange: mode === VALIDATION_MODE.onChange,\n isOnAll: mode === VALIDATION_MODE.all,\n isOnTouch: mode === VALIDATION_MODE.onTouched,\n});\n\nvar isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&\n (_names.watchAll ||\n _names.watch.has(name) ||\n [..._names.watch].some((watchName) => name.startsWith(watchName) &&\n /^\\.\\w+/.test(name.slice(watchName.length))));\n\nconst iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {\n for (const key of fieldsNames || Object.keys(fields)) {\n const field = get(fields, key);\n if (field) {\n const { _f, ...currentField } = field;\n if (_f) {\n if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {\n break;\n }\n else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {\n break;\n }\n else {\n iterateFieldsByAction(currentField, action);\n }\n }\n else if (isObject(currentField)) {\n iterateFieldsByAction(currentField, action);\n }\n }\n }\n};\n\nvar updateFieldArrayRootError = (errors, error, name) => {\n const fieldArrayErrors = compact(get(errors, name));\n set(fieldArrayErrors, 'root', error[name]);\n set(errors, name, fieldArrayErrors);\n return errors;\n};\n\nvar isFileInput = (element) => element.type === 'file';\n\nvar isFunction = (value) => typeof value === 'function';\n\nvar isHTMLElement = (value) => {\n if (!isWeb) {\n return false;\n }\n const owner = value ? value.ownerDocument : 0;\n return (value instanceof\n (owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement));\n};\n\nvar isMessage = (value) => isString(value);\n\nvar isRadioInput = (element) => element.type === 'radio';\n\nvar isRegex = (value) => value instanceof RegExp;\n\nconst defaultResult = {\n value: false,\n isValid: false,\n};\nconst validResult = { value: true, isValid: true };\nvar getCheckboxValue = (options) => {\n if (Array.isArray(options)) {\n if (options.length > 1) {\n const values = options\n .filter((option) => option && option.checked && !option.disabled)\n .map((option) => option.value);\n return { value: values, isValid: !!values.length };\n }\n return options[0].checked && !options[0].disabled\n ? // @ts-expect-error expected to work in the browser\n options[0].attributes && !isUndefined(options[0].attributes.value)\n ? isUndefined(options[0].value) || options[0].value === ''\n ? validResult\n : { value: options[0].value, isValid: true }\n : validResult\n : defaultResult;\n }\n return defaultResult;\n};\n\nconst defaultReturn = {\n isValid: false,\n value: null,\n};\nvar getRadioValue = (options) => Array.isArray(options)\n ? options.reduce((previous, option) => option && option.checked && !option.disabled\n ? {\n isValid: true,\n value: option.value,\n }\n : previous, defaultReturn)\n : defaultReturn;\n\nfunction getValidateError(result, ref, type = 'validate') {\n if (isMessage(result) ||\n (Array.isArray(result) && result.every(isMessage)) ||\n (isBoolean(result) && !result)) {\n return {\n type,\n message: isMessage(result) ? result : '',\n ref,\n };\n }\n}\n\nvar getValueAndMessage = (validationData) => isObject(validationData) && !isRegex(validationData)\n ? validationData\n : {\n value: validationData,\n message: '',\n };\n\nvar validateField = async (field, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {\n const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, disabled, } = field._f;\n const inputValue = get(formValues, name);\n if (!mount || disabled) {\n return {};\n }\n const inputRef = refs ? refs[0] : ref;\n const setCustomValidity = (message) => {\n if (shouldUseNativeValidation && inputRef.reportValidity) {\n inputRef.setCustomValidity(isBoolean(message) ? '' : message || '');\n inputRef.reportValidity();\n }\n };\n const error = {};\n const isRadio = isRadioInput(ref);\n const isCheckBox = isCheckBoxInput(ref);\n const isRadioOrCheckbox = isRadio || isCheckBox;\n const isEmpty = ((valueAsNumber || isFileInput(ref)) &&\n isUndefined(ref.value) &&\n isUndefined(inputValue)) ||\n (isHTMLElement(ref) && ref.value === '') ||\n inputValue === '' ||\n (Array.isArray(inputValue) && !inputValue.length);\n const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);\n const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {\n const message = exceedMax ? maxLengthMessage : minLengthMessage;\n error[name] = {\n type: exceedMax ? maxType : minType,\n message,\n ref,\n ...appendErrorsCurry(exceedMax ? maxType : minType, message),\n };\n };\n if (isFieldArray\n ? !Array.isArray(inputValue) || !inputValue.length\n : required &&\n ((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) ||\n (isBoolean(inputValue) && !inputValue) ||\n (isCheckBox && !getCheckboxValue(refs).isValid) ||\n (isRadio && !getRadioValue(refs).isValid))) {\n const { value, message } = isMessage(required)\n ? { value: !!required, message: required }\n : getValueAndMessage(required);\n if (value) {\n error[name] = {\n type: INPUT_VALIDATION_RULES.required,\n message,\n ref: inputRef,\n ...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message),\n };\n if (!validateAllFieldCriteria) {\n setCustomValidity(message);\n return error;\n }\n }\n }\n if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {\n let exceedMax;\n let exceedMin;\n const maxOutput = getValueAndMessage(max);\n const minOutput = getValueAndMessage(min);\n if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {\n const valueNumber = ref.valueAsNumber ||\n (inputValue ? +inputValue : inputValue);\n if (!isNullOrUndefined(maxOutput.value)) {\n exceedMax = valueNumber > maxOutput.value;\n }\n if (!isNullOrUndefined(minOutput.value)) {\n exceedMin = valueNumber < minOutput.value;\n }\n }\n else {\n const valueDate = ref.valueAsDate || new Date(inputValue);\n const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time);\n const isTime = ref.type == 'time';\n const isWeek = ref.type == 'week';\n if (isString(maxOutput.value) && inputValue) {\n exceedMax = isTime\n ? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value)\n : isWeek\n ? inputValue > maxOutput.value\n : valueDate > new Date(maxOutput.value);\n }\n if (isString(minOutput.value) && inputValue) {\n exceedMin = isTime\n ? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value)\n : isWeek\n ? inputValue < minOutput.value\n : valueDate < new Date(minOutput.value);\n }\n }\n if (exceedMax || exceedMin) {\n getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);\n if (!validateAllFieldCriteria) {\n setCustomValidity(error[name].message);\n return error;\n }\n }\n }\n if ((maxLength || minLength) &&\n !isEmpty &&\n (isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) {\n const maxLengthOutput = getValueAndMessage(maxLength);\n const minLengthOutput = getValueAndMessage(minLength);\n const exceedMax = !isNullOrUndefined(maxLengthOutput.value) &&\n inputValue.length > +maxLengthOutput.value;\n const exceedMin = !isNullOrUndefined(minLengthOutput.value) &&\n inputValue.length < +minLengthOutput.value;\n if (exceedMax || exceedMin) {\n getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);\n if (!validateAllFieldCriteria) {\n setCustomValidity(error[name].message);\n return error;\n }\n }\n }\n if (pattern && !isEmpty && isString(inputValue)) {\n const { value: patternValue, message } = getValueAndMessage(pattern);\n if (isRegex(patternValue) && !inputValue.match(patternValue)) {\n error[name] = {\n type: INPUT_VALIDATION_RULES.pattern,\n message,\n ref,\n ...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message),\n };\n if (!validateAllFieldCriteria) {\n setCustomValidity(message);\n return error;\n }\n }\n }\n if (validate) {\n if (isFunction(validate)) {\n const result = await validate(inputValue, formValues);\n const validateError = getValidateError(result, inputRef);\n if (validateError) {\n error[name] = {\n ...validateError,\n ...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message),\n };\n if (!validateAllFieldCriteria) {\n setCustomValidity(validateError.message);\n return error;\n }\n }\n }\n else if (isObject(validate)) {\n let validationResult = {};\n for (const key in validate) {\n if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {\n break;\n }\n const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);\n if (validateError) {\n validationResult = {\n ...validateError,\n ...appendErrorsCurry(key, validateError.message),\n };\n setCustomValidity(validateError.message);\n if (validateAllFieldCriteria) {\n error[name] = validationResult;\n }\n }\n }\n if (!isEmptyObject(validationResult)) {\n error[name] = {\n ref: inputRef,\n ...validationResult,\n };\n if (!validateAllFieldCriteria) {\n return error;\n }\n }\n }\n }\n setCustomValidity(true);\n return error;\n};\n\nvar appendAt = (data, value) => [\n ...data,\n ...convertToArrayPayload(value),\n];\n\nvar fillEmptyArray = (value) => Array.isArray(value) ? value.map(() => undefined) : undefined;\n\nfunction insert(data, index, value) {\n return [\n ...data.slice(0, index),\n ...convertToArrayPayload(value),\n ...data.slice(index),\n ];\n}\n\nvar moveArrayAt = (data, from, to) => {\n if (!Array.isArray(data)) {\n return [];\n }\n if (isUndefined(data[to])) {\n data[to] = undefined;\n }\n data.splice(to, 0, data.splice(from, 1)[0]);\n return data;\n};\n\nvar prependAt = (data, value) => [\n ...convertToArrayPayload(value),\n ...convertToArrayPayload(data),\n];\n\nfunction removeAtIndexes(data, indexes) {\n let i = 0;\n const temp = [...data];\n for (const index of indexes) {\n temp.splice(index - i, 1);\n i++;\n }\n return compact(temp).length ? temp : [];\n}\nvar removeArrayAt = (data, index) => isUndefined(index)\n ? []\n : removeAtIndexes(data, convertToArrayPayload(index).sort((a, b) => a - b));\n\nvar swapArrayAt = (data, indexA, indexB) => {\n [data[indexA], data[indexB]] = [data[indexB], data[indexA]];\n};\n\nfunction baseGet(object, updatePath) {\n const length = updatePath.slice(0, -1).length;\n let index = 0;\n while (index < length) {\n object = isUndefined(object) ? index++ : object[updatePath[index++]];\n }\n return object;\n}\nfunction isEmptyArray(obj) {\n for (const key in obj) {\n if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {\n return false;\n }\n }\n return true;\n}\nfunction unset(object, path) {\n const paths = Array.isArray(path)\n ? path\n : isKey(path)\n ? [path]\n : stringToPath(path);\n const childObject = paths.length === 1 ? object : baseGet(object, paths);\n const index = paths.length - 1;\n const key = paths[index];\n if (childObject) {\n delete childObject[key];\n }\n if (index !== 0 &&\n ((isObject(childObject) && isEmptyObject(childObject)) ||\n (Array.isArray(childObject) && isEmptyArray(childObject)))) {\n unset(object, paths.slice(0, -1));\n }\n return object;\n}\n\nvar updateAt = (fieldValues, index, value) => {\n fieldValues[index] = value;\n return fieldValues;\n};\n\n/**\n * A custom hook that exposes convenient methods to perform operations with a list of dynamic inputs that need to be appended, updated, removed etc. • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn) • [Video](https://youtu.be/4MrbfGSFY2A)\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn)\n *\n * @param props - useFieldArray props\n *\n * @returns methods - functions to manipulate with the Field Arrays (dynamic inputs) {@link UseFieldArrayReturn}\n *\n * @example\n * ```tsx\n * function App() {\n * const { register, control, handleSubmit, reset, trigger, setError } = useForm({\n * defaultValues: {\n * test: []\n * }\n * });\n * const { fields, append } = useFieldArray({\n * control,\n * name: \"test\"\n * });\n *\n * return (\n *
    console.log(data))}>\n * {fields.map((item, index) => (\n * \n * ))}\n * \n * \n *
    \n * );\n * }\n * ```\n */\nfunction useFieldArray(props) {\n const methods = useFormContext();\n const { control = methods.control, name, keyName = 'id', shouldUnregister, } = props;\n const [fields, setFields] = React.useState(control._getFieldArray(name));\n const ids = React.useRef(control._getFieldArray(name).map(generateId));\n const _fieldIds = React.useRef(fields);\n const _name = React.useRef(name);\n const _actioned = React.useRef(false);\n _name.current = name;\n _fieldIds.current = fields;\n control._names.array.add(name);\n props.rules &&\n control.register(name, props.rules);\n useSubscribe({\n next: ({ values, name: fieldArrayName, }) => {\n if (fieldArrayName === _name.current || !fieldArrayName) {\n const fieldValues = get(values, _name.current);\n if (Array.isArray(fieldValues)) {\n setFields(fieldValues);\n ids.current = fieldValues.map(generateId);\n }\n }\n },\n subject: control._subjects.array,\n });\n const updateValues = React.useCallback((updatedFieldArrayValues) => {\n _actioned.current = true;\n control._updateFieldArray(name, updatedFieldArrayValues);\n }, [control, name]);\n const append = (value, options) => {\n const appendValue = convertToArrayPayload(cloneObject(value));\n const updatedFieldArrayValues = appendAt(control._getFieldArray(name), appendValue);\n control._names.focus = getFocusFieldName(name, updatedFieldArrayValues.length - 1, options);\n ids.current = appendAt(ids.current, appendValue.map(generateId));\n updateValues(updatedFieldArrayValues);\n setFields(updatedFieldArrayValues);\n control._updateFieldArray(name, updatedFieldArrayValues, appendAt, {\n argA: fillEmptyArray(value),\n });\n };\n const prepend = (value, options) => {\n const prependValue = convertToArrayPayload(cloneObject(value));\n const updatedFieldArrayValues = prependAt(control._getFieldArray(name), prependValue);\n control._names.focus = getFocusFieldName(name, 0, options);\n ids.current = prependAt(ids.current, prependValue.map(generateId));\n updateValues(updatedFieldArrayValues);\n setFields(updatedFieldArrayValues);\n control._updateFieldArray(name, updatedFieldArrayValues, prependAt, {\n argA: fillEmptyArray(value),\n });\n };\n const remove = (index) => {\n const updatedFieldArrayValues = removeArrayAt(control._getFieldArray(name), index);\n ids.current = removeArrayAt(ids.current, index);\n updateValues(updatedFieldArrayValues);\n setFields(updatedFieldArrayValues);\n control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, {\n argA: index,\n });\n };\n const insert$1 = (index, value, options) => {\n const insertValue = convertToArrayPayload(cloneObject(value));\n const updatedFieldArrayValues = insert(control._getFieldArray(name), index, insertValue);\n control._names.focus = getFocusFieldName(name, index, options);\n ids.current = insert(ids.current, index, insertValue.map(generateId));\n updateValues(updatedFieldArrayValues);\n setFields(updatedFieldArrayValues);\n control._updateFieldArray(name, updatedFieldArrayValues, insert, {\n argA: index,\n argB: fillEmptyArray(value),\n });\n };\n const swap = (indexA, indexB) => {\n const updatedFieldArrayValues = control._getFieldArray(name);\n swapArrayAt(updatedFieldArrayValues, indexA, indexB);\n swapArrayAt(ids.current, indexA, indexB);\n updateValues(updatedFieldArrayValues);\n setFields(updatedFieldArrayValues);\n control._updateFieldArray(name, updatedFieldArrayValues, swapArrayAt, {\n argA: indexA,\n argB: indexB,\n }, false);\n };\n const move = (from, to) => {\n const updatedFieldArrayValues = control._getFieldArray(name);\n moveArrayAt(updatedFieldArrayValues, from, to);\n moveArrayAt(ids.current, from, to);\n updateValues(updatedFieldArrayValues);\n setFields(updatedFieldArrayValues);\n control._updateFieldArray(name, updatedFieldArrayValues, moveArrayAt, {\n argA: from,\n argB: to,\n }, false);\n };\n const update = (index, value) => {\n const updateValue = cloneObject(value);\n const updatedFieldArrayValues = updateAt(control._getFieldArray(name), index, updateValue);\n ids.current = [...updatedFieldArrayValues].map((item, i) => !item || i === index ? generateId() : ids.current[i]);\n updateValues(updatedFieldArrayValues);\n setFields([...updatedFieldArrayValues]);\n control._updateFieldArray(name, updatedFieldArrayValues, updateAt, {\n argA: index,\n argB: updateValue,\n }, true, false);\n };\n const replace = (value) => {\n const updatedFieldArrayValues = convertToArrayPayload(cloneObject(value));\n ids.current = updatedFieldArrayValues.map(generateId);\n updateValues([...updatedFieldArrayValues]);\n setFields([...updatedFieldArrayValues]);\n control._updateFieldArray(name, [...updatedFieldArrayValues], (data) => data, {}, true, false);\n };\n React.useEffect(() => {\n control._state.action = false;\n isWatched(name, control._names) &&\n control._subjects.state.next({\n ...control._formState,\n });\n if (_actioned.current &&\n (!getValidationModes(control._options.mode).isOnSubmit ||\n control._formState.isSubmitted)) {\n if (control._options.resolver) {\n control._executeSchema([name]).then((result) => {\n const error = get(result.errors, name);\n const existingError = get(control._formState.errors, name);\n if (existingError\n ? (!error && existingError.type) ||\n (error &&\n (existingError.type !== error.type ||\n existingError.message !== error.message))\n : error && error.type) {\n error\n ? set(control._formState.errors, name, error)\n : unset(control._formState.errors, name);\n control._subjects.state.next({\n errors: control._formState.errors,\n });\n }\n });\n }\n else {\n const field = get(control._fields, name);\n if (field &&\n field._f &&\n !(getValidationModes(control._options.reValidateMode).isOnSubmit &&\n getValidationModes(control._options.mode).isOnSubmit)) {\n validateField(field, control._formValues, control._options.criteriaMode === VALIDATION_MODE.all, control._options.shouldUseNativeValidation, true).then((error) => !isEmptyObject(error) &&\n control._subjects.state.next({\n errors: updateFieldArrayRootError(control._formState.errors, error, name),\n }));\n }\n }\n }\n control._subjects.values.next({\n name,\n values: { ...control._formValues },\n });\n control._names.focus &&\n iterateFieldsByAction(control._fields, (ref, key) => {\n if (control._names.focus &&\n key.startsWith(control._names.focus) &&\n ref.focus) {\n ref.focus();\n return 1;\n }\n return;\n });\n control._names.focus = '';\n control._updateValid();\n _actioned.current = false;\n }, [fields, name, control]);\n React.useEffect(() => {\n !get(control._formValues, name) && control._updateFieldArray(name);\n return () => {\n (control._options.shouldUnregister || shouldUnregister) &&\n control.unregister(name);\n };\n }, [name, control, keyName, shouldUnregister]);\n return {\n swap: React.useCallback(swap, [updateValues, name, control]),\n move: React.useCallback(move, [updateValues, name, control]),\n prepend: React.useCallback(prepend, [updateValues, name, control]),\n append: React.useCallback(append, [updateValues, name, control]),\n remove: React.useCallback(remove, [updateValues, name, control]),\n insert: React.useCallback(insert$1, [updateValues, name, control]),\n update: React.useCallback(update, [updateValues, name, control]),\n replace: React.useCallback(replace, [updateValues, name, control]),\n fields: React.useMemo(() => fields.map((field, index) => ({\n ...field,\n [keyName]: ids.current[index] || generateId(),\n })), [fields, keyName]),\n };\n}\n\nvar createSubject = () => {\n let _observers = [];\n const next = (value) => {\n for (const observer of _observers) {\n observer.next && observer.next(value);\n }\n };\n const subscribe = (observer) => {\n _observers.push(observer);\n return {\n unsubscribe: () => {\n _observers = _observers.filter((o) => o !== observer);\n },\n };\n };\n const unsubscribe = () => {\n _observers = [];\n };\n return {\n get observers() {\n return _observers;\n },\n next,\n subscribe,\n unsubscribe,\n };\n};\n\nvar isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);\n\nfunction deepEqual(object1, object2) {\n if (isPrimitive(object1) || isPrimitive(object2)) {\n return object1 === object2;\n }\n if (isDateObject(object1) && isDateObject(object2)) {\n return object1.getTime() === object2.getTime();\n }\n const keys1 = Object.keys(object1);\n const keys2 = Object.keys(object2);\n if (keys1.length !== keys2.length) {\n return false;\n }\n for (const key of keys1) {\n const val1 = object1[key];\n if (!keys2.includes(key)) {\n return false;\n }\n if (key !== 'ref') {\n const val2 = object2[key];\n if ((isDateObject(val1) && isDateObject(val2)) ||\n (isObject(val1) && isObject(val2)) ||\n (Array.isArray(val1) && Array.isArray(val2))\n ? !deepEqual(val1, val2)\n : val1 !== val2) {\n return false;\n }\n }\n }\n return true;\n}\n\nvar isMultipleSelect = (element) => element.type === `select-multiple`;\n\nvar isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);\n\nvar live = (ref) => isHTMLElement(ref) && ref.isConnected;\n\nvar objectHasFunction = (data) => {\n for (const key in data) {\n if (isFunction(data[key])) {\n return true;\n }\n }\n return false;\n};\n\nfunction markFieldsDirty(data, fields = {}) {\n const isParentNodeArray = Array.isArray(data);\n if (isObject(data) || isParentNodeArray) {\n for (const key in data) {\n if (Array.isArray(data[key]) ||\n (isObject(data[key]) && !objectHasFunction(data[key]))) {\n fields[key] = Array.isArray(data[key]) ? [] : {};\n markFieldsDirty(data[key], fields[key]);\n }\n else if (!isNullOrUndefined(data[key])) {\n fields[key] = true;\n }\n }\n }\n return fields;\n}\nfunction getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues) {\n const isParentNodeArray = Array.isArray(data);\n if (isObject(data) || isParentNodeArray) {\n for (const key in data) {\n if (Array.isArray(data[key]) ||\n (isObject(data[key]) && !objectHasFunction(data[key]))) {\n if (isUndefined(formValues) ||\n isPrimitive(dirtyFieldsFromValues[key])) {\n dirtyFieldsFromValues[key] = Array.isArray(data[key])\n ? markFieldsDirty(data[key], [])\n : { ...markFieldsDirty(data[key]) };\n }\n else {\n getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);\n }\n }\n else {\n dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);\n }\n }\n }\n return dirtyFieldsFromValues;\n}\nvar getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));\n\nvar getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value)\n ? value\n : valueAsNumber\n ? value === ''\n ? NaN\n : value\n ? +value\n : value\n : valueAsDate && isString(value)\n ? new Date(value)\n : setValueAs\n ? setValueAs(value)\n : value;\n\nfunction getFieldValue(_f) {\n const ref = _f.ref;\n if (_f.refs ? _f.refs.every((ref) => ref.disabled) : ref.disabled) {\n return;\n }\n if (isFileInput(ref)) {\n return ref.files;\n }\n if (isRadioInput(ref)) {\n return getRadioValue(_f.refs).value;\n }\n if (isMultipleSelect(ref)) {\n return [...ref.selectedOptions].map(({ value }) => value);\n }\n if (isCheckBoxInput(ref)) {\n return getCheckboxValue(_f.refs).value;\n }\n return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);\n}\n\nvar getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {\n const fields = {};\n for (const name of fieldsNames) {\n const field = get(_fields, name);\n field && set(fields, name, field._f);\n }\n return {\n criteriaMode,\n names: [...fieldsNames],\n fields,\n shouldUseNativeValidation,\n };\n};\n\nvar getRuleValue = (rule) => isUndefined(rule)\n ? rule\n : isRegex(rule)\n ? rule.source\n : isObject(rule)\n ? isRegex(rule.value)\n ? rule.value.source\n : rule.value\n : rule;\n\nvar hasValidation = (options) => options.mount &&\n (options.required ||\n options.min ||\n options.max ||\n options.maxLength ||\n options.minLength ||\n options.pattern ||\n options.validate);\n\nfunction schemaErrorLookup(errors, _fields, name) {\n const error = get(errors, name);\n if (error || isKey(name)) {\n return {\n error,\n name,\n };\n }\n const names = name.split('.');\n while (names.length) {\n const fieldName = names.join('.');\n const field = get(_fields, fieldName);\n const foundError = get(errors, fieldName);\n if (field && !Array.isArray(field) && name !== fieldName) {\n return { name };\n }\n if (foundError && foundError.type) {\n return {\n name: fieldName,\n error: foundError,\n };\n }\n names.pop();\n }\n return {\n name,\n };\n}\n\nvar skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {\n if (mode.isOnAll) {\n return false;\n }\n else if (!isSubmitted && mode.isOnTouch) {\n return !(isTouched || isBlurEvent);\n }\n else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {\n return !isBlurEvent;\n }\n else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {\n return isBlurEvent;\n }\n return true;\n};\n\nvar unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);\n\nconst defaultOptions = {\n mode: VALIDATION_MODE.onSubmit,\n reValidateMode: VALIDATION_MODE.onChange,\n shouldFocusError: true,\n};\nfunction createFormControl(props = {}) {\n let _options = {\n ...defaultOptions,\n ...props,\n };\n let _formState = {\n submitCount: 0,\n isDirty: false,\n isLoading: isFunction(_options.defaultValues),\n isValidating: false,\n isSubmitted: false,\n isSubmitting: false,\n isSubmitSuccessful: false,\n isValid: false,\n touchedFields: {},\n dirtyFields: {},\n validatingFields: {},\n errors: _options.errors || {},\n disabled: _options.disabled || false,\n };\n let _fields = {};\n let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values)\n ? cloneObject(_options.defaultValues || _options.values) || {}\n : {};\n let _formValues = _options.shouldUnregister\n ? {}\n : cloneObject(_defaultValues);\n let _state = {\n action: false,\n mount: false,\n watch: false,\n };\n let _names = {\n mount: new Set(),\n unMount: new Set(),\n array: new Set(),\n watch: new Set(),\n };\n let delayErrorCallback;\n let timer = 0;\n const _proxyFormState = {\n isDirty: false,\n dirtyFields: false,\n validatingFields: false,\n touchedFields: false,\n isValidating: false,\n isValid: false,\n errors: false,\n };\n const _subjects = {\n values: createSubject(),\n array: createSubject(),\n state: createSubject(),\n };\n const validationModeBeforeSubmit = getValidationModes(_options.mode);\n const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);\n const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all;\n const debounce = (callback) => (wait) => {\n clearTimeout(timer);\n timer = setTimeout(callback, wait);\n };\n const _updateValid = async (shouldUpdateValid) => {\n if (_proxyFormState.isValid || shouldUpdateValid) {\n const isValid = _options.resolver\n ? isEmptyObject((await _executeSchema()).errors)\n : await executeBuiltInValidation(_fields, true);\n if (isValid !== _formState.isValid) {\n _subjects.state.next({\n isValid,\n });\n }\n }\n };\n const _updateIsValidating = (names, isValidating) => {\n if (_proxyFormState.isValidating || _proxyFormState.validatingFields) {\n (names || Array.from(_names.mount)).forEach((name) => {\n if (name) {\n isValidating\n ? set(_formState.validatingFields, name, isValidating)\n : unset(_formState.validatingFields, name);\n }\n });\n _subjects.state.next({\n validatingFields: _formState.validatingFields,\n isValidating: !isEmptyObject(_formState.validatingFields),\n });\n }\n };\n const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {\n if (args && method) {\n _state.action = true;\n if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {\n const fieldValues = method(get(_fields, name), args.argA, args.argB);\n shouldSetValues && set(_fields, name, fieldValues);\n }\n if (shouldUpdateFieldsAndState &&\n Array.isArray(get(_formState.errors, name))) {\n const errors = method(get(_formState.errors, name), args.argA, args.argB);\n shouldSetValues && set(_formState.errors, name, errors);\n unsetEmptyArray(_formState.errors, name);\n }\n if (_proxyFormState.touchedFields &&\n shouldUpdateFieldsAndState &&\n Array.isArray(get(_formState.touchedFields, name))) {\n const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB);\n shouldSetValues && set(_formState.touchedFields, name, touchedFields);\n }\n if (_proxyFormState.dirtyFields) {\n _formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);\n }\n _subjects.state.next({\n name,\n isDirty: _getDirty(name, values),\n dirtyFields: _formState.dirtyFields,\n errors: _formState.errors,\n isValid: _formState.isValid,\n });\n }\n else {\n set(_formValues, name, values);\n }\n };\n const updateErrors = (name, error) => {\n set(_formState.errors, name, error);\n _subjects.state.next({\n errors: _formState.errors,\n });\n };\n const _setErrors = (errors) => {\n _formState.errors = errors;\n _subjects.state.next({\n errors: _formState.errors,\n isValid: false,\n });\n };\n const updateValidAndValue = (name, shouldSkipSetValueAs, value, ref) => {\n const field = get(_fields, name);\n if (field) {\n const defaultValue = get(_formValues, name, isUndefined(value) ? get(_defaultValues, name) : value);\n isUndefined(defaultValue) ||\n (ref && ref.defaultChecked) ||\n shouldSkipSetValueAs\n ? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f))\n : setFieldValue(name, defaultValue);\n _state.mount && _updateValid();\n }\n };\n const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {\n let shouldUpdateField = false;\n let isPreviousDirty = false;\n const output = {\n name,\n };\n const disabledField = !!(get(_fields, name) && get(_fields, name)._f.disabled);\n if (!isBlurEvent || shouldDirty) {\n if (_proxyFormState.isDirty) {\n isPreviousDirty = _formState.isDirty;\n _formState.isDirty = output.isDirty = _getDirty();\n shouldUpdateField = isPreviousDirty !== output.isDirty;\n }\n const isCurrentFieldPristine = disabledField || deepEqual(get(_defaultValues, name), fieldValue);\n isPreviousDirty = !!(!disabledField && get(_formState.dirtyFields, name));\n isCurrentFieldPristine || disabledField\n ? unset(_formState.dirtyFields, name)\n : set(_formState.dirtyFields, name, true);\n output.dirtyFields = _formState.dirtyFields;\n shouldUpdateField =\n shouldUpdateField ||\n (_proxyFormState.dirtyFields &&\n isPreviousDirty !== !isCurrentFieldPristine);\n }\n if (isBlurEvent) {\n const isPreviousFieldTouched = get(_formState.touchedFields, name);\n if (!isPreviousFieldTouched) {\n set(_formState.touchedFields, name, isBlurEvent);\n output.touchedFields = _formState.touchedFields;\n shouldUpdateField =\n shouldUpdateField ||\n (_proxyFormState.touchedFields &&\n isPreviousFieldTouched !== isBlurEvent);\n }\n }\n shouldUpdateField && shouldRender && _subjects.state.next(output);\n return shouldUpdateField ? output : {};\n };\n const shouldRenderByError = (name, isValid, error, fieldState) => {\n const previousFieldError = get(_formState.errors, name);\n const shouldUpdateValid = _proxyFormState.isValid &&\n isBoolean(isValid) &&\n _formState.isValid !== isValid;\n if (props.delayError && error) {\n delayErrorCallback = debounce(() => updateErrors(name, error));\n delayErrorCallback(props.delayError);\n }\n else {\n clearTimeout(timer);\n delayErrorCallback = null;\n error\n ? set(_formState.errors, name, error)\n : unset(_formState.errors, name);\n }\n if ((error ? !deepEqual(previousFieldError, error) : previousFieldError) ||\n !isEmptyObject(fieldState) ||\n shouldUpdateValid) {\n const updatedFormState = {\n ...fieldState,\n ...(shouldUpdateValid && isBoolean(isValid) ? { isValid } : {}),\n errors: _formState.errors,\n name,\n };\n _formState = {\n ..._formState,\n ...updatedFormState,\n };\n _subjects.state.next(updatedFormState);\n }\n };\n const _executeSchema = async (name) => {\n _updateIsValidating(name, true);\n const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));\n _updateIsValidating(name);\n return result;\n };\n const executeSchemaAndUpdateState = async (names) => {\n const { errors } = await _executeSchema(names);\n if (names) {\n for (const name of names) {\n const error = get(errors, name);\n error\n ? set(_formState.errors, name, error)\n : unset(_formState.errors, name);\n }\n }\n else {\n _formState.errors = errors;\n }\n return errors;\n };\n const executeBuiltInValidation = async (fields, shouldOnlyCheckValid, context = {\n valid: true,\n }) => {\n for (const name in fields) {\n const field = fields[name];\n if (field) {\n const { _f, ...fieldValue } = field;\n if (_f) {\n const isFieldArrayRoot = _names.array.has(_f.name);\n _updateIsValidating([name], true);\n const fieldError = await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);\n _updateIsValidating([name]);\n if (fieldError[_f.name]) {\n context.valid = false;\n if (shouldOnlyCheckValid) {\n break;\n }\n }\n !shouldOnlyCheckValid &&\n (get(fieldError, _f.name)\n ? isFieldArrayRoot\n ? updateFieldArrayRootError(_formState.errors, fieldError, _f.name)\n : set(_formState.errors, _f.name, fieldError[_f.name])\n : unset(_formState.errors, _f.name));\n }\n fieldValue &&\n (await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context));\n }\n }\n return context.valid;\n };\n const _removeUnmounted = () => {\n for (const name of _names.unMount) {\n const field = get(_fields, name);\n field &&\n (field._f.refs\n ? field._f.refs.every((ref) => !live(ref))\n : !live(field._f.ref)) &&\n unregister(name);\n }\n _names.unMount = new Set();\n };\n const _getDirty = (name, data) => (name && data && set(_formValues, name, data),\n !deepEqual(getValues(), _defaultValues));\n const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {\n ...(_state.mount\n ? _formValues\n : isUndefined(defaultValue)\n ? _defaultValues\n : isString(names)\n ? { [names]: defaultValue }\n : defaultValue),\n }, isGlobal, defaultValue);\n const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get(_defaultValues, name, []) : []));\n const setFieldValue = (name, value, options = {}) => {\n const field = get(_fields, name);\n let fieldValue = value;\n if (field) {\n const fieldReference = field._f;\n if (fieldReference) {\n !fieldReference.disabled &&\n set(_formValues, name, getFieldValueAs(value, fieldReference));\n fieldValue =\n isHTMLElement(fieldReference.ref) && isNullOrUndefined(value)\n ? ''\n : value;\n if (isMultipleSelect(fieldReference.ref)) {\n [...fieldReference.ref.options].forEach((optionRef) => (optionRef.selected = fieldValue.includes(optionRef.value)));\n }\n else if (fieldReference.refs) {\n if (isCheckBoxInput(fieldReference.ref)) {\n fieldReference.refs.length > 1\n ? fieldReference.refs.forEach((checkboxRef) => (!checkboxRef.defaultChecked || !checkboxRef.disabled) &&\n (checkboxRef.checked = Array.isArray(fieldValue)\n ? !!fieldValue.find((data) => data === checkboxRef.value)\n : fieldValue === checkboxRef.value))\n : fieldReference.refs[0] &&\n (fieldReference.refs[0].checked = !!fieldValue);\n }\n else {\n fieldReference.refs.forEach((radioRef) => (radioRef.checked = radioRef.value === fieldValue));\n }\n }\n else if (isFileInput(fieldReference.ref)) {\n fieldReference.ref.value = '';\n }\n else {\n fieldReference.ref.value = fieldValue;\n if (!fieldReference.ref.type) {\n _subjects.values.next({\n name,\n values: { ..._formValues },\n });\n }\n }\n }\n }\n (options.shouldDirty || options.shouldTouch) &&\n updateTouchAndDirty(name, fieldValue, options.shouldTouch, options.shouldDirty, true);\n options.shouldValidate && trigger(name);\n };\n const setValues = (name, value, options) => {\n for (const fieldKey in value) {\n const fieldValue = value[fieldKey];\n const fieldName = `${name}.${fieldKey}`;\n const field = get(_fields, fieldName);\n (_names.array.has(name) ||\n !isPrimitive(fieldValue) ||\n (field && !field._f)) &&\n !isDateObject(fieldValue)\n ? setValues(fieldName, fieldValue, options)\n : setFieldValue(fieldName, fieldValue, options);\n }\n };\n const setValue = (name, value, options = {}) => {\n const field = get(_fields, name);\n const isFieldArray = _names.array.has(name);\n const cloneValue = cloneObject(value);\n set(_formValues, name, cloneValue);\n if (isFieldArray) {\n _subjects.array.next({\n name,\n values: { ..._formValues },\n });\n if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) &&\n options.shouldDirty) {\n _subjects.state.next({\n name,\n dirtyFields: getDirtyFields(_defaultValues, _formValues),\n isDirty: _getDirty(name, cloneValue),\n });\n }\n }\n else {\n field && !field._f && !isNullOrUndefined(cloneValue)\n ? setValues(name, cloneValue, options)\n : setFieldValue(name, cloneValue, options);\n }\n isWatched(name, _names) && _subjects.state.next({ ..._formState });\n _subjects.values.next({\n name: _state.mount ? name : undefined,\n values: { ..._formValues },\n });\n };\n const onChange = async (event) => {\n _state.mount = true;\n const target = event.target;\n let name = target.name;\n let isFieldValueUpdated = true;\n const field = get(_fields, name);\n const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event);\n const _updateIsFieldValueUpdated = (fieldValue) => {\n isFieldValueUpdated =\n Number.isNaN(fieldValue) ||\n fieldValue === get(_formValues, name, fieldValue);\n };\n if (field) {\n let error;\n let isValid;\n const fieldValue = getCurrentFieldValue();\n const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;\n const shouldSkipValidation = (!hasValidation(field._f) &&\n !_options.resolver &&\n !get(_formState.errors, name) &&\n !field._f.deps) ||\n skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit);\n const watched = isWatched(name, _names, isBlurEvent);\n set(_formValues, name, fieldValue);\n if (isBlurEvent) {\n field._f.onBlur && field._f.onBlur(event);\n delayErrorCallback && delayErrorCallback(0);\n }\n else if (field._f.onChange) {\n field._f.onChange(event);\n }\n const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent, false);\n const shouldRender = !isEmptyObject(fieldState) || watched;\n !isBlurEvent &&\n _subjects.values.next({\n name,\n type: event.type,\n values: { ..._formValues },\n });\n if (shouldSkipValidation) {\n _proxyFormState.isValid && _updateValid();\n return (shouldRender &&\n _subjects.state.next({ name, ...(watched ? {} : fieldState) }));\n }\n !isBlurEvent && watched && _subjects.state.next({ ..._formState });\n if (_options.resolver) {\n const { errors } = await _executeSchema([name]);\n _updateIsFieldValueUpdated(fieldValue);\n if (isFieldValueUpdated) {\n const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);\n const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);\n error = errorLookupResult.error;\n name = errorLookupResult.name;\n isValid = isEmptyObject(errors);\n }\n }\n else {\n _updateIsValidating([name], true);\n error = (await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];\n _updateIsValidating([name]);\n _updateIsFieldValueUpdated(fieldValue);\n if (isFieldValueUpdated) {\n if (error) {\n isValid = false;\n }\n else if (_proxyFormState.isValid) {\n isValid = await executeBuiltInValidation(_fields, true);\n }\n }\n }\n if (isFieldValueUpdated) {\n field._f.deps &&\n trigger(field._f.deps);\n shouldRenderByError(name, isValid, error, fieldState);\n }\n }\n };\n const _focusInput = (ref, key) => {\n if (get(_formState.errors, key) && ref.focus) {\n ref.focus();\n return 1;\n }\n return;\n };\n const trigger = async (name, options = {}) => {\n let isValid;\n let validationResult;\n const fieldNames = convertToArrayPayload(name);\n if (_options.resolver) {\n const errors = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames);\n isValid = isEmptyObject(errors);\n validationResult = name\n ? !fieldNames.some((name) => get(errors, name))\n : isValid;\n }\n else if (name) {\n validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {\n const field = get(_fields, fieldName);\n return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);\n }))).every(Boolean);\n !(!validationResult && !_formState.isValid) && _updateValid();\n }\n else {\n validationResult = isValid = await executeBuiltInValidation(_fields);\n }\n _subjects.state.next({\n ...(!isString(name) ||\n (_proxyFormState.isValid && isValid !== _formState.isValid)\n ? {}\n : { name }),\n ...(_options.resolver || !name ? { isValid } : {}),\n errors: _formState.errors,\n });\n options.shouldFocus &&\n !validationResult &&\n iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);\n return validationResult;\n };\n const getValues = (fieldNames) => {\n const values = {\n ...(_state.mount ? _formValues : _defaultValues),\n };\n return isUndefined(fieldNames)\n ? values\n : isString(fieldNames)\n ? get(values, fieldNames)\n : fieldNames.map((name) => get(values, name));\n };\n const getFieldState = (name, formState) => ({\n invalid: !!get((formState || _formState).errors, name),\n isDirty: !!get((formState || _formState).dirtyFields, name),\n isTouched: !!get((formState || _formState).touchedFields, name),\n isValidating: !!get((formState || _formState).validatingFields, name),\n error: get((formState || _formState).errors, name),\n });\n const clearErrors = (name) => {\n name &&\n convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));\n _subjects.state.next({\n errors: name ? _formState.errors : {},\n });\n };\n const setError = (name, error, options) => {\n const ref = (get(_fields, name, { _f: {} })._f || {}).ref;\n const currentError = get(_formState.errors, name) || {};\n // Don't override existing error messages elsewhere in the object tree.\n const { ref: currentRef, message, type, ...restOfErrorTree } = currentError;\n set(_formState.errors, name, {\n ...restOfErrorTree,\n ...error,\n ref,\n });\n _subjects.state.next({\n name,\n errors: _formState.errors,\n isValid: false,\n });\n options && options.shouldFocus && ref && ref.focus && ref.focus();\n };\n const watch = (name, defaultValue) => isFunction(name)\n ? _subjects.values.subscribe({\n next: (payload) => name(_getWatch(undefined, defaultValue), payload),\n })\n : _getWatch(name, defaultValue, true);\n const unregister = (name, options = {}) => {\n for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {\n _names.mount.delete(fieldName);\n _names.array.delete(fieldName);\n if (!options.keepValue) {\n unset(_fields, fieldName);\n unset(_formValues, fieldName);\n }\n !options.keepError && unset(_formState.errors, fieldName);\n !options.keepDirty && unset(_formState.dirtyFields, fieldName);\n !options.keepTouched && unset(_formState.touchedFields, fieldName);\n !options.keepIsValidating &&\n unset(_formState.validatingFields, fieldName);\n !_options.shouldUnregister &&\n !options.keepDefaultValue &&\n unset(_defaultValues, fieldName);\n }\n _subjects.values.next({\n values: { ..._formValues },\n });\n _subjects.state.next({\n ..._formState,\n ...(!options.keepDirty ? {} : { isDirty: _getDirty() }),\n });\n !options.keepIsValid && _updateValid();\n };\n const _updateDisabledField = ({ disabled, name, field, fields, value, }) => {\n if ((isBoolean(disabled) && _state.mount) || !!disabled) {\n const inputValue = disabled\n ? undefined\n : isUndefined(value)\n ? getFieldValue(field ? field._f : get(fields, name)._f)\n : value;\n set(_formValues, name, inputValue);\n updateTouchAndDirty(name, inputValue, false, false, true);\n }\n };\n const register = (name, options = {}) => {\n let field = get(_fields, name);\n const disabledIsDefined = isBoolean(options.disabled);\n set(_fields, name, {\n ...(field || {}),\n _f: {\n ...(field && field._f ? field._f : { ref: { name } }),\n name,\n mount: true,\n ...options,\n },\n });\n _names.mount.add(name);\n if (field) {\n _updateDisabledField({\n field,\n disabled: options.disabled,\n name,\n value: options.value,\n });\n }\n else {\n updateValidAndValue(name, true, options.value);\n }\n return {\n ...(disabledIsDefined ? { disabled: options.disabled } : {}),\n ...(_options.progressive\n ? {\n required: !!options.required,\n min: getRuleValue(options.min),\n max: getRuleValue(options.max),\n minLength: getRuleValue(options.minLength),\n maxLength: getRuleValue(options.maxLength),\n pattern: getRuleValue(options.pattern),\n }\n : {}),\n name,\n onChange,\n onBlur: onChange,\n ref: (ref) => {\n if (ref) {\n register(name, options);\n field = get(_fields, name);\n const fieldRef = isUndefined(ref.value)\n ? ref.querySelectorAll\n ? ref.querySelectorAll('input,select,textarea')[0] || ref\n : ref\n : ref;\n const radioOrCheckbox = isRadioOrCheckbox(fieldRef);\n const refs = field._f.refs || [];\n if (radioOrCheckbox\n ? refs.find((option) => option === fieldRef)\n : fieldRef === field._f.ref) {\n return;\n }\n set(_fields, name, {\n _f: {\n ...field._f,\n ...(radioOrCheckbox\n ? {\n refs: [\n ...refs.filter(live),\n fieldRef,\n ...(Array.isArray(get(_defaultValues, name)) ? [{}] : []),\n ],\n ref: { type: fieldRef.type, name },\n }\n : { ref: fieldRef }),\n },\n });\n updateValidAndValue(name, false, undefined, fieldRef);\n }\n else {\n field = get(_fields, name, {});\n if (field._f) {\n field._f.mount = false;\n }\n (_options.shouldUnregister || options.shouldUnregister) &&\n !(isNameInFieldArray(_names.array, name) && _state.action) &&\n _names.unMount.add(name);\n }\n },\n };\n };\n const _focusError = () => _options.shouldFocusError &&\n iterateFieldsByAction(_fields, _focusInput, _names.mount);\n const _disableForm = (disabled) => {\n if (isBoolean(disabled)) {\n _subjects.state.next({ disabled });\n iterateFieldsByAction(_fields, (ref, name) => {\n const currentField = get(_fields, name);\n if (currentField) {\n ref.disabled = currentField._f.disabled || disabled;\n if (Array.isArray(currentField._f.refs)) {\n currentField._f.refs.forEach((inputRef) => {\n inputRef.disabled = currentField._f.disabled || disabled;\n });\n }\n }\n }, 0, false);\n }\n };\n const handleSubmit = (onValid, onInvalid) => async (e) => {\n let onValidError = undefined;\n if (e) {\n e.preventDefault && e.preventDefault();\n e.persist && e.persist();\n }\n let fieldValues = cloneObject(_formValues);\n _subjects.state.next({\n isSubmitting: true,\n });\n if (_options.resolver) {\n const { errors, values } = await _executeSchema();\n _formState.errors = errors;\n fieldValues = values;\n }\n else {\n await executeBuiltInValidation(_fields);\n }\n unset(_formState.errors, 'root');\n if (isEmptyObject(_formState.errors)) {\n _subjects.state.next({\n errors: {},\n });\n try {\n await onValid(fieldValues, e);\n }\n catch (error) {\n onValidError = error;\n }\n }\n else {\n if (onInvalid) {\n await onInvalid({ ..._formState.errors }, e);\n }\n _focusError();\n setTimeout(_focusError);\n }\n _subjects.state.next({\n isSubmitted: true,\n isSubmitting: false,\n isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError,\n submitCount: _formState.submitCount + 1,\n errors: _formState.errors,\n });\n if (onValidError) {\n throw onValidError;\n }\n };\n const resetField = (name, options = {}) => {\n if (get(_fields, name)) {\n if (isUndefined(options.defaultValue)) {\n setValue(name, cloneObject(get(_defaultValues, name)));\n }\n else {\n setValue(name, options.defaultValue);\n set(_defaultValues, name, cloneObject(options.defaultValue));\n }\n if (!options.keepTouched) {\n unset(_formState.touchedFields, name);\n }\n if (!options.keepDirty) {\n unset(_formState.dirtyFields, name);\n _formState.isDirty = options.defaultValue\n ? _getDirty(name, cloneObject(get(_defaultValues, name)))\n : _getDirty();\n }\n if (!options.keepError) {\n unset(_formState.errors, name);\n _proxyFormState.isValid && _updateValid();\n }\n _subjects.state.next({ ..._formState });\n }\n };\n const _reset = (formValues, keepStateOptions = {}) => {\n const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;\n const cloneUpdatedValues = cloneObject(updatedValues);\n const isEmptyResetValues = isEmptyObject(formValues);\n const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues;\n if (!keepStateOptions.keepDefaultValues) {\n _defaultValues = updatedValues;\n }\n if (!keepStateOptions.keepValues) {\n if (keepStateOptions.keepDirtyValues) {\n for (const fieldName of _names.mount) {\n get(_formState.dirtyFields, fieldName)\n ? set(values, fieldName, get(_formValues, fieldName))\n : setValue(fieldName, get(values, fieldName));\n }\n }\n else {\n if (isWeb && isUndefined(formValues)) {\n for (const name of _names.mount) {\n const field = get(_fields, name);\n if (field && field._f) {\n const fieldReference = Array.isArray(field._f.refs)\n ? field._f.refs[0]\n : field._f.ref;\n if (isHTMLElement(fieldReference)) {\n const form = fieldReference.closest('form');\n if (form) {\n form.reset();\n break;\n }\n }\n }\n }\n }\n _fields = {};\n }\n _formValues = props.shouldUnregister\n ? keepStateOptions.keepDefaultValues\n ? cloneObject(_defaultValues)\n : {}\n : cloneObject(values);\n _subjects.array.next({\n values: { ...values },\n });\n _subjects.values.next({\n values: { ...values },\n });\n }\n _names = {\n mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),\n unMount: new Set(),\n array: new Set(),\n watch: new Set(),\n watchAll: false,\n focus: '',\n };\n _state.mount =\n !_proxyFormState.isValid ||\n !!keepStateOptions.keepIsValid ||\n !!keepStateOptions.keepDirtyValues;\n _state.watch = !!props.shouldUnregister;\n _subjects.state.next({\n submitCount: keepStateOptions.keepSubmitCount\n ? _formState.submitCount\n : 0,\n isDirty: isEmptyResetValues\n ? false\n : keepStateOptions.keepDirty\n ? _formState.isDirty\n : !!(keepStateOptions.keepDefaultValues &&\n !deepEqual(formValues, _defaultValues)),\n isSubmitted: keepStateOptions.keepIsSubmitted\n ? _formState.isSubmitted\n : false,\n dirtyFields: isEmptyResetValues\n ? []\n : keepStateOptions.keepDirtyValues\n ? keepStateOptions.keepDefaultValues && _formValues\n ? getDirtyFields(_defaultValues, _formValues)\n : _formState.dirtyFields\n : keepStateOptions.keepDefaultValues && formValues\n ? getDirtyFields(_defaultValues, formValues)\n : {},\n touchedFields: keepStateOptions.keepTouched\n ? _formState.touchedFields\n : {},\n errors: keepStateOptions.keepErrors ? _formState.errors : {},\n isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful\n ? _formState.isSubmitSuccessful\n : false,\n isSubmitting: false,\n });\n };\n const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)\n ? formValues(_formValues)\n : formValues, keepStateOptions);\n const setFocus = (name, options = {}) => {\n const field = get(_fields, name);\n const fieldReference = field && field._f;\n if (fieldReference) {\n const fieldRef = fieldReference.refs\n ? fieldReference.refs[0]\n : fieldReference.ref;\n if (fieldRef.focus) {\n fieldRef.focus();\n options.shouldSelect && fieldRef.select();\n }\n }\n };\n const _updateFormState = (updatedFormState) => {\n _formState = {\n ..._formState,\n ...updatedFormState,\n };\n };\n const _resetDefaultValues = () => isFunction(_options.defaultValues) &&\n _options.defaultValues().then((values) => {\n reset(values, _options.resetOptions);\n _subjects.state.next({\n isLoading: false,\n });\n });\n return {\n control: {\n register,\n unregister,\n getFieldState,\n handleSubmit,\n setError,\n _executeSchema,\n _getWatch,\n _getDirty,\n _updateValid,\n _removeUnmounted,\n _updateFieldArray,\n _updateDisabledField,\n _getFieldArray,\n _reset,\n _resetDefaultValues,\n _updateFormState,\n _disableForm,\n _subjects,\n _proxyFormState,\n _setErrors,\n get _fields() {\n return _fields;\n },\n get _formValues() {\n return _formValues;\n },\n get _state() {\n return _state;\n },\n set _state(value) {\n _state = value;\n },\n get _defaultValues() {\n return _defaultValues;\n },\n get _names() {\n return _names;\n },\n set _names(value) {\n _names = value;\n },\n get _formState() {\n return _formState;\n },\n set _formState(value) {\n _formState = value;\n },\n get _options() {\n return _options;\n },\n set _options(value) {\n _options = {\n ..._options,\n ...value,\n };\n },\n },\n trigger,\n register,\n handleSubmit,\n watch,\n setValue,\n getValues,\n reset,\n resetField,\n clearErrors,\n unregister,\n setError,\n setFocus,\n getFieldState,\n };\n}\n\n/**\n * Custom hook to manage the entire form.\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/useform) • [Demo](https://codesandbox.io/s/react-hook-form-get-started-ts-5ksmm) • [Video](https://www.youtube.com/watch?v=RkXv4AXXC_4)\n *\n * @param props - form configuration and validation parameters.\n *\n * @returns methods - individual functions to manage the form state. {@link UseFormReturn}\n *\n * @example\n * ```tsx\n * function App() {\n * const { register, handleSubmit, watch, formState: { errors } } = useForm();\n * const onSubmit = data => console.log(data);\n *\n * console.log(watch(\"example\"));\n *\n * return (\n *
    \n * \n * \n * {errors.exampleRequired && This field is required}\n * \n *
    \n * );\n * }\n * ```\n */\nfunction useForm(props = {}) {\n const _formControl = React.useRef();\n const _values = React.useRef();\n const [formState, updateFormState] = React.useState({\n isDirty: false,\n isValidating: false,\n isLoading: isFunction(props.defaultValues),\n isSubmitted: false,\n isSubmitting: false,\n isSubmitSuccessful: false,\n isValid: false,\n submitCount: 0,\n dirtyFields: {},\n touchedFields: {},\n validatingFields: {},\n errors: props.errors || {},\n disabled: props.disabled || false,\n defaultValues: isFunction(props.defaultValues)\n ? undefined\n : props.defaultValues,\n });\n if (!_formControl.current) {\n _formControl.current = {\n ...createFormControl(props),\n formState,\n };\n }\n const control = _formControl.current.control;\n control._options = props;\n useSubscribe({\n subject: control._subjects.state,\n next: (value) => {\n if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) {\n updateFormState({ ...control._formState });\n }\n },\n });\n React.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);\n React.useEffect(() => {\n if (control._proxyFormState.isDirty) {\n const isDirty = control._getDirty();\n if (isDirty !== formState.isDirty) {\n control._subjects.state.next({\n isDirty,\n });\n }\n }\n }, [control, formState.isDirty]);\n React.useEffect(() => {\n if (props.values && !deepEqual(props.values, _values.current)) {\n control._reset(props.values, control._options.resetOptions);\n _values.current = props.values;\n updateFormState((state) => ({ ...state }));\n }\n else {\n control._resetDefaultValues();\n }\n }, [props.values, control]);\n React.useEffect(() => {\n if (props.errors) {\n control._setErrors(props.errors);\n }\n }, [props.errors, control]);\n React.useEffect(() => {\n if (!control._state.mount) {\n control._updateValid();\n control._state.mount = true;\n }\n if (control._state.watch) {\n control._state.watch = false;\n control._subjects.state.next({ ...control._formState });\n }\n control._removeUnmounted();\n });\n React.useEffect(() => {\n props.shouldUnregister &&\n control._subjects.values.next({\n values: control._getWatch(),\n });\n }, [props.shouldUnregister, control]);\n _formControl.current.formState = getProxyFormState(formState, control);\n return _formControl.current;\n}\n\nexport { Controller, Form, FormProvider, appendErrors, get, set, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };\n//# sourceMappingURL=index.esm.mjs.map\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * `ButtonComponent` represents the react Button Component.\n * ```ts\n * \n * ```\n */\nvar ButtonComponent = /** @class */ (function (_super) {\n __extends(ButtonComponent, _super);\n function ButtonComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = false;\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = true;\n _this.portals = [];\n return _this;\n }\n ButtonComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement('button', this.getDefaultAttributes(), [].concat(this.props.children, this.portals));\n }\n };\n return ButtonComponent;\n}(Button));\nexport { ButtonComponent };\napplyMixins(ButtonComponent, [ComponentBase, React.Component]);\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { CheckBox } from '@syncfusion/ej2-buttons';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * Represents the react CheckBox Component.\n * ```ts\n * \n * ```\n */\nvar CheckBoxComponent = /** @class */ (function (_super) {\n __extends(CheckBoxComponent, _super);\n function CheckBoxComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = false;\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = true;\n _this.portals = [];\n return _this;\n }\n CheckBoxComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement(React.Fragment, null, [].concat(React.createElement(\"input\", this.getDefaultAttributes()), this.portals));\n }\n };\n return CheckBoxComponent;\n}(CheckBox));\nexport { CheckBoxComponent };\napplyMixins(CheckBoxComponent, [ComponentBase, React.Component]);\n","import { ButtonComponent } from '@syncfusion/ej2-react-buttons'\r\nimport { ReactNode } from 'react'\r\n\r\ntype CustomCardProps = {\r\n header?: string\r\n headerBadgeContent?: string\r\n headerBtnLabel?: string\r\n headerBtnAction?: (event?: React.MouseEvent) => void\r\n headerBtnIcon?: string\r\n headerBtnDisabled?: boolean\r\n children?: ReactNode\r\n noBottomMargin?: boolean\r\n style?: React.CSSProperties\r\n contentStyle?: React.CSSProperties\r\n}\r\n\r\nconst CustomCard: React.FC = ({ header, headerBtnLabel, headerBtnAction, headerBadgeContent, headerBtnIcon, headerBtnDisabled, children, noBottomMargin, style, contentStyle }) => {\r\n const defaultStyles = {\r\n overflow: 'auto',\r\n justifyContent: 'start',\r\n marginBottom: noBottomMargin ? '0' : undefined,\r\n }\r\n\r\n const mergedStyles = {\r\n ...defaultStyles,\r\n ...style,\r\n }\r\n\r\n return (\r\n
    \r\n {header && (\r\n
    \r\n
    \r\n
    \r\n {header}\r\n {headerBadgeContent && {headerBadgeContent}}\r\n
    \r\n
    \r\n {headerBtnLabel && (\r\n ) => {\r\n if (headerBtnAction) {\r\n headerBtnAction(e)\r\n }\r\n }}\r\n >\r\n {headerBtnLabel}\r\n \r\n )}\r\n
    \r\n )}\r\n\r\n
    \r\n {children}\r\n
    \r\n
    \r\n )\r\n}\r\n\r\nexport default CustomCard\r\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { TextBox } from '@syncfusion/ej2-inputs';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * Represents the React TextBox Component\n * ```html\n * \n * ```\n */\nvar TextBoxComponent = /** @class */ (function (_super) {\n __extends(TextBoxComponent, _super);\n function TextBoxComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = false;\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = true;\n _this.portals = [];\n return _this;\n }\n TextBoxComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement(React.Fragment, null, [].concat(React.createElement(\"input\", this.getDefaultAttributes()), this.portals));\n }\n };\n return TextBoxComponent;\n}(TextBox));\nexport { TextBoxComponent };\napplyMixins(TextBoxComponent, [ComponentBase, React.Component]);\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { Uploader } from '@syncfusion/ej2-inputs';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * Represents the React Uploader Component\n * ```html\n * \n * ```\n */\nvar UploaderComponent = /** @class */ (function (_super) {\n __extends(UploaderComponent, _super);\n function UploaderComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = false;\n _this.directivekeys = { 'files': 'uploadedFiles' };\n _this.statelessTemplateProps = null;\n _this.templateProps = null;\n _this.immediateRender = false;\n _this.portals = [];\n return _this;\n }\n UploaderComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement(React.Fragment, null, [].concat(React.createElement(\"input\", this.getDefaultAttributes()), this.portals));\n }\n };\n return UploaderComponent;\n}(Uploader));\nexport { UploaderComponent };\napplyMixins(UploaderComponent, [ComponentBase, React.Component]);\n","import CustomCard from '../../../components/CustomCard.tsx'\r\nimport { TextBoxComponent } from '@syncfusion/ej2-react-inputs'\r\nimport styles from '../../../styles/components/register.module.scss'\r\nimport { useFormContext } from 'react-hook-form'\r\n\r\nexport const CommunicationData = () => {\r\n const {\r\n register,\r\n formState: { errors },\r\n } = useFormContext()\r\n\r\n const requiredMsg = 'Dieses Feld ist ein Pflichtfeld'\r\n const emailErrorMsg = 'Ungültige E-Mail Adresse.'\r\n\r\n return (\r\n \r\n
    \r\n \r\n
    \r\n \r\n

    {(errors.contactEMail?.message as string) || null}

    \r\n
    \r\n
    \r\n
    \r\n \r\n
    \r\n     \r\n )\r\n}\r\n","/**\n * IncrementalSearch module file\n */\nvar queryString = '';\nvar prevString = '';\nvar tempQueryString = '';\nvar matches = [];\nvar activeClass = 'e-active';\nvar prevElementId = '';\n/**\n * Search and focus the list item based on key code matches with list text content\n *\n * @param { number } keyCode - Specifies the key code which pressed on keyboard events.\n * @param { HTMLElement[]} items - Specifies an array of HTMLElement, from which matches find has done.\n * @param { number } selectedIndex - Specifies the selected item in list item, so that search will happen\n * after selected item otherwise it will do from initial.\n * @param { boolean } ignoreCase - Specifies the case consideration when search has done.\n * @param {string} elementId - Specifies the list element ID.\n * @returns {Element} Returns list item based on key code matches with list text content.\n */\nexport function incrementalSearch(keyCode, items, selectedIndex, ignoreCase, elementId, queryStringUpdated, currentValue, isVirtual, refresh) {\n if (!queryStringUpdated || queryString === '') {\n if (tempQueryString != '') {\n queryString = tempQueryString + String.fromCharCode(keyCode);\n tempQueryString = '';\n }\n else {\n queryString += String.fromCharCode(keyCode);\n }\n }\n else if (queryString == prevString) {\n tempQueryString = String.fromCharCode(keyCode);\n }\n if (isVirtual) {\n setTimeout(function () {\n tempQueryString = '';\n }, 700);\n setTimeout(function () {\n queryString = '';\n }, 3000);\n }\n else {\n setTimeout(function () {\n queryString = '';\n }, 1000);\n }\n var index;\n queryString = ignoreCase ? queryString.toLowerCase() : queryString;\n if (prevElementId === elementId && prevString === queryString && !refresh) {\n for (var i = 0; i < matches.length; i++) {\n if (matches[i].classList.contains(activeClass)) {\n index = i;\n break;\n }\n if (currentValue && matches[i].textContent.toLowerCase() === currentValue.toLowerCase()) {\n index = i;\n break;\n }\n }\n index = index + 1;\n if (isVirtual) {\n return matches[index] && matches.length - 1 != index ? matches[index] : matches[matches.length];\n }\n return matches[index] ? matches[index] : matches[0];\n }\n else {\n var listItems = items;\n var strLength = queryString.length;\n var text = void 0;\n var item = void 0;\n selectedIndex = selectedIndex ? selectedIndex + 1 : 0;\n var i = selectedIndex;\n matches = [];\n do {\n if (i === listItems.length) {\n i = -1;\n }\n if (i === -1) {\n index = 0;\n }\n else {\n index = i;\n }\n item = listItems[index];\n text = ignoreCase ? item.innerText.toLowerCase() : item.innerText;\n if (text.substr(0, strLength) === queryString) {\n matches.push(listItems[index]);\n }\n i++;\n } while (i !== selectedIndex);\n prevString = queryString;\n prevElementId = elementId;\n if (isVirtual) {\n var indexUpdated = false;\n for (var i_1 = 0; i_1 < matches.length; i_1++) {\n if (currentValue && matches[i_1].textContent.toLowerCase() === currentValue.toLowerCase()) {\n index = i_1;\n indexUpdated = true;\n break;\n }\n }\n if (currentValue && indexUpdated) {\n index = index + 1;\n }\n return matches[index] ? matches[index] : matches[0];\n }\n return matches[0];\n }\n}\n/**\n * Search the list item based on given input value matches with search type.\n *\n * @param {string} inputVal - Specifies the given input value.\n * @param {HTMLElement[]} items - Specifies the list items.\n * @param {SearchType} searchType - Specifies the filter type.\n * @param {boolean} ignoreCase - Specifies the case sensitive option for search operation.\n * @returns {Element | number} Returns the search matched items.\n */\nexport function Search(inputVal, items, searchType, ignoreCase, dataSource, fields, type) {\n var listItems = items;\n ignoreCase = ignoreCase !== undefined && ignoreCase !== null ? ignoreCase : true;\n var itemData = { item: null, index: null };\n if (inputVal && inputVal.length) {\n var strLength = inputVal.length;\n var queryStr = ignoreCase ? inputVal.toLocaleLowerCase() : inputVal;\n queryStr = escapeCharRegExp(queryStr);\n var _loop_1 = function (i, itemsData) {\n var item = itemsData[i];\n var text = void 0;\n var filterValue;\n if (items && dataSource) {\n var checkField_1 = item;\n var fieldValue_1 = fields.text.split('.');\n dataSource.filter(function (data) {\n Array.prototype.slice.call(fieldValue_1).forEach(function (value) {\n /* eslint-disable security/detect-object-injection */\n if (type === 'object' && (!data.isHeader && checkField_1.textContent.toString().indexOf(data[value]) !== -1) && checkField_1.getAttribute('data-value') === data[fields.value].toString() || type === 'string' && checkField_1.textContent.toString().indexOf(data) !== -1) {\n filterValue = type === 'object' ? data[value] : data;\n }\n });\n });\n }\n text = dataSource && filterValue ? (ignoreCase ? filterValue.toString().toLocaleLowerCase() : filterValue).replace(/^\\s+|\\s+$/g, '') : (ignoreCase ? item.textContent.toLocaleLowerCase() : item.textContent).replace(/^\\s+|\\s+$/g, '');\n /* eslint-disable security/detect-non-literal-regexp */\n if ((searchType === 'Equal' && text === queryStr) || (searchType === 'StartsWith' && text.substr(0, strLength) === queryStr) || (searchType === 'EndsWith' && text.substr(text.length - queryStr.length) === queryStr) || (searchType === 'Contains' && new RegExp(queryStr, \"g\").test(text))) {\n itemData.item = item;\n itemData.index = i;\n return { value: { item: item, index: i } };\n }\n };\n for (var i = 0, itemsData = listItems; i < itemsData.length; i++) {\n var state_1 = _loop_1(i, itemsData);\n if (typeof state_1 === \"object\")\n return state_1.value;\n }\n return itemData;\n /* eslint-enable security/detect-non-literal-regexp */\n }\n return itemData;\n}\n/* eslint-enable security/detect-object-injection */\nexport function escapeCharRegExp(value) {\n return value.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&');\n}\nexport function resetIncrementalSearchValues(elementId) {\n if (prevElementId === elementId) {\n prevElementId = '';\n prevString = '';\n queryString = '';\n matches = [];\n }\n}\n","/**\n * Function helps to find which highlightSearch is to call based on your data.\n *\n * @param {HTMLElement} element - Specifies an li element.\n * @param {string} query - Specifies the string to be highlighted.\n * @param {boolean} ignoreCase - Specifies the ignoreCase option.\n * @param {HightLightType} type - Specifies the type of highlight.\n * @returns {void}\n */\nexport function highlightSearch(element, query, ignoreCase, type) {\n var isHtmlElement = /<[^>]*>/g.test(element.innerText);\n if (isHtmlElement) {\n element.innerText = element.innerText.replace(/[\\u00A0-\\u9999<>&]/g, function (match) { return \"&#\" + match.charCodeAt(0) + \";\"; });\n }\n if (query === '') {\n return;\n }\n else {\n var ignoreRegex = ignoreCase ? 'gim' : 'gm';\n // eslint-disable-next-line\n query = /^[a-zA-Z0-9- ]*$/.test(query) ? query : query.replace(/[\\-\\[\\]\\/\\{\\}\\(\\)\\*\\+\\?\\.\\\\\\^\\$\\|]/g, '\\\\$&');\n var replaceQuery = type === 'StartsWith' ? '^(' + query + ')' : type === 'EndsWith' ?\n '(' + query + ')$' : '(' + query + ')';\n // eslint-disable-next-line security/detect-non-literal-regexp\n findTextNode(element, new RegExp(replaceQuery, ignoreRegex));\n }\n}\n/* eslint-enable jsdoc/require-param, valid-jsdoc */\n/**\n *\n * @param {HTMLElement} element - Specifies the element.\n * @param {RegExp} pattern - Specifies the regex to match the searched text.\n * @returns {void}\n */\nfunction findTextNode(element, pattern) {\n for (var index = 0; element.childNodes && (index < element.childNodes.length); index++) {\n if (element.childNodes[index].nodeType === 3 && element.childNodes[index].textContent.trim() !== '') {\n var value = element.childNodes[index].nodeValue.trim().replace(pattern, '$1');\n element.childNodes[index].nodeValue = '';\n element.innerHTML = element.innerHTML.trim() + value;\n break;\n }\n else {\n findTextNode(element.childNodes[index], pattern);\n }\n }\n}\n/**\n * Function helps to remove highlighted element based on your data.\n *\n * @param {HTMLElement} content - Specifies an content element.\n * @returns {void}\n */\nexport function revertHighlightSearch(content) {\n var contentElement = content.querySelectorAll('.e-highlight');\n for (var i = contentElement.length - 1; i >= 0; i--) {\n var parent_1 = contentElement[i].parentNode;\n var text = document.createTextNode(contentElement[i].textContent);\n parent_1.replaceChild(text, contentElement[i]);\n }\n}\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, Property, ChildProperty, NotifyPropertyChanges, Animation, createElement, animationMode, initializeCSPTemplate } from '@syncfusion/ej2-base';\nimport { Browser, isNullOrUndefined as isNOU, getUniqueID, formatUnit, EventHandler } from '@syncfusion/ej2-base';\nimport { Collection, Complex, setStyleAttribute, Event, detach, L10n } from '@syncfusion/ej2-base';\nimport { attributes, extend, closest, compile as templateCompiler, classList, isUndefined } from '@syncfusion/ej2-base';\nimport { Touch, isBlazor, SanitizeHtmlHelper, removeClass } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { getZindexPartial } from '@syncfusion/ej2-popups';\nvar ROOT = 'e-toast';\nvar CONTAINER = 'e-toast-container';\nvar TITLE = 'e-toast-title';\nvar WIDTHFULL = 'e-toast-full-width';\nvar CONTENT = 'e-toast-content';\nvar MESSAGE = 'e-toast-message';\nvar ICON = 'e-toast-icon';\nvar PROGRESS = 'e-toast-progress';\nvar ACTIOBUTTONS = 'e-toast-actions';\nvar CLOSEBTN = 'e-toast-close-icon';\nvar RTL = 'e-rtl';\n// eslint-disable-next-line\nvar TOAST_REF_ELEMENT = 'e-toast-ref-element';\nvar TOAST_BLAZOR_HIDDEN = 'e-blazor-toast-hidden';\n/**\n * An object that is used to configure the Toast X Y positions.\n */\nvar ToastPosition = /** @class */ (function (_super) {\n __extends(ToastPosition, _super);\n function ToastPosition() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Left')\n ], ToastPosition.prototype, \"X\", void 0);\n __decorate([\n Property('Top')\n ], ToastPosition.prototype, \"Y\", void 0);\n return ToastPosition;\n}(ChildProperty));\nexport { ToastPosition };\n/**\n * An object that is used to configure the action button model properties and event.\n */\nvar ButtonModelProps = /** @class */ (function (_super) {\n __extends(ButtonModelProps, _super);\n function ButtonModelProps() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], ButtonModelProps.prototype, \"model\", void 0);\n __decorate([\n Property(null)\n ], ButtonModelProps.prototype, \"click\", void 0);\n return ButtonModelProps;\n}(ChildProperty));\nexport { ButtonModelProps };\n/**\n * An object that is used to configure the animation object of Toast.\n */\nvar ToastAnimations = /** @class */ (function (_super) {\n __extends(ToastAnimations, _super);\n function ToastAnimations() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('FadeIn')\n ], ToastAnimations.prototype, \"effect\", void 0);\n __decorate([\n Property(600)\n ], ToastAnimations.prototype, \"duration\", void 0);\n __decorate([\n Property('ease')\n ], ToastAnimations.prototype, \"easing\", void 0);\n return ToastAnimations;\n}(ChildProperty));\nexport { ToastAnimations };\n/**\n * An object that is used to configure the show/hide animation settings of Toast.\n */\nvar ToastAnimationSettings = /** @class */ (function (_super) {\n __extends(ToastAnimationSettings, _super);\n function ToastAnimationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Complex({ effect: 'FadeIn', duration: 600, easing: 'ease' }, ToastAnimations)\n ], ToastAnimationSettings.prototype, \"show\", void 0);\n __decorate([\n Complex({ effect: 'FadeOut', duration: 600, easing: 'ease' }, ToastAnimations)\n ], ToastAnimationSettings.prototype, \"hide\", void 0);\n return ToastAnimationSettings;\n}(ChildProperty));\nexport { ToastAnimationSettings };\n/**\n * The Toast is a notification pop-up that showing on desired position which can provide an information to the user.\n * ```html\n *
    \n * \n * ```\n */\nvar Toast = /** @class */ (function (_super) {\n __extends(Toast, _super);\n /**\n * Initializes a new instance of the Toast class.\n *\n * @param {ToastModel} options - Specifies Toast model properties as options.\n * @param {HTMLElement} element - Specifies the element that is rendered as a Toast.\n */\n function Toast(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.toastCollection = [];\n _this.needsID = true;\n return _this;\n }\n /**\n * Gets the Component module name.\n *\n * @returns {string} - returns the string\n * @private\n */\n Toast.prototype.getModuleName = function () {\n return 'toast';\n };\n /**\n * Gets the persisted state properties of the Component.\n *\n * @returns {string} - returns the string\n */\n Toast.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers, attributes and classes.\n *\n * @returns {void}\n */\n Toast.prototype.destroy = function () {\n this.hide('All');\n this.element.classList.remove(CONTAINER);\n setStyleAttribute(this.element, { 'position': '', 'z-index': '' });\n if (!isNOU(this.refElement) && !isNOU(this.refElement.parentElement)) {\n this.refElement.parentElement.insertBefore(this.element, this.refElement);\n detach(this.refElement);\n this.refElement = undefined;\n }\n if (!this.isBlazorServer()) {\n _super.prototype.destroy.call(this);\n }\n };\n /**\n * Initialize the event handler\n *\n * @returns {void}\n * @private\n */\n Toast.prototype.preRender = function () {\n //There is no event handler\n this.isDevice = Browser.isDevice;\n if (this.width === '300px') {\n this.width = (this.isDevice && screen.width < 768) ? '100%' : '300px';\n }\n if (isNOU(this.target)) {\n this.target = document.body;\n }\n if (this.enableRtl && !this.isBlazorServer()) {\n this.element.classList.add(RTL);\n }\n };\n /**\n * Initialize the component rendering\n *\n * @returns {void}\n * @private\n */\n Toast.prototype.render = function () {\n this.progressObj = [];\n this.intervalId = [];\n this.contentTemplate = null;\n this.toastTemplate = null;\n this.renderComplete();\n this.initRenderClass = this.element.className;\n };\n /**\n * To show Toast element on a document with the relative position.\n *\n * @param {ToastModel} toastObj - To show Toast element on screen.\n * @returns {void}\n\n */\n Toast.prototype.show = function (toastObj) {\n var collectionObj;\n if (!isNOU(toastObj)) {\n this.templateChanges(toastObj);\n collectionObj = JSON.parse(JSON.stringify(toastObj));\n extend(this, this, toastObj);\n }\n if (isNOU(this.toastContainer)) {\n this.toastContainer = this.getContainer();\n var target = typeof (this.target) === 'string' ? document.querySelector(this.target) :\n (typeof (this.target) === 'object' ? this.target : document.body);\n if (isNOU(target)) {\n return;\n }\n if (target.tagName === 'BODY') {\n this.toastContainer.style.position = 'fixed';\n }\n else {\n this.toastContainer.style.position = 'absolute';\n target.style.position = 'relative';\n }\n this.setPositioning(this.position);\n target.appendChild(this.toastContainer);\n }\n if (this.isBlazorServer() && this.element.classList.contains('e-control')) {\n this.isToastModel(toastObj);\n return;\n }\n this.toastEle = this.createElement('div', { className: ROOT, id: getUniqueID('toast') });\n this.setWidthHeight();\n this.setCSSClass(this.cssClass);\n // eslint-disable-next-line\n (isNOU(this.template) || this.template === '') ? this.personalizeToast() : this.templateRendering();\n this.setProgress();\n this.setCloseButton();\n this.setAria();\n this.appendToTarget(toastObj);\n if (this.isDevice && screen.width < 768) {\n new Touch(this.toastEle, { swipe: this.swipeHandler.bind(this) });\n }\n if (!isNOU(collectionObj)) {\n extend(collectionObj, { element: [this.toastEle] }, true);\n this.toastCollection.push(collectionObj);\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isReact) {\n this.renderReactTemplates();\n }\n };\n /**\n * @param {string} id - specifies the id\n * @param {ToastModel} toastObj - specifies the model\n * @returns {void}\n * @hidden\n\n * This method applicable for blazor alone.\n */\n Toast.prototype.showToast = function (id, toastObj) {\n this.toastEle = this.element.querySelector('#' + id);\n this.show(toastObj);\n };\n Toast.prototype.isToastModel = function (toastObj) {\n this.toastContainer = this.element;\n this.setPositioning(this.position);\n // eslint-disable-next-line\n var proxy = this;\n if (!isNOU(proxy.element.lastElementChild)) {\n this.setProgress();\n }\n this.setAria();\n this.appendToTarget(toastObj);\n };\n Toast.prototype.swipeHandler = function (e) {\n var toastEle = closest(e.originalEvent.target, '.' + ROOT + ':not(.' + CONTAINER + ')');\n var hideAnimation = this.animation.hide.effect;\n if (!isNOU(toastEle)) {\n if (e.swipeDirection === 'Right') {\n this.animation.hide.effect = 'SlideRightOut';\n this.hideToast('swipe', toastEle);\n }\n else if (e.swipeDirection === 'Left') {\n this.animation.hide.effect = 'SlideLeftOut';\n this.hideToast('swipe', toastEle);\n }\n this.animation.hide.effect = hideAnimation;\n }\n };\n Toast.prototype.templateChanges = function (toastObj) {\n if (!isUndefined(toastObj.content) && !isNOU(this.contentTemplate) && this.content !== toastObj.content) {\n this.clearContentTemplate();\n }\n if (!isUndefined(toastObj.template) && !isNOU(this.toastTemplate) && this.template !== toastObj.template) {\n this.clearToastTemplate();\n }\n };\n Toast.prototype.setCSSClass = function (cssClass) {\n if (cssClass) {\n var split = cssClass.indexOf(',') !== -1 ? ',' : ' ';\n classList(this.toastEle, cssClass.split(split), []);\n if (this.toastContainer) {\n classList(this.toastContainer, cssClass.split(split), []);\n }\n }\n };\n Toast.prototype.setWidthHeight = function () {\n if (this.width === '300px') {\n this.toastEle.style.width = formatUnit(this.width);\n }\n else if (this.width === '100%') {\n this.toastContainer.classList.add(WIDTHFULL);\n }\n else {\n this.toastEle.style.width = formatUnit(this.width);\n this.toastContainer.classList.remove(WIDTHFULL);\n }\n this.toastEle.style.height = formatUnit(this.height);\n };\n Toast.prototype.templateRendering = function () {\n this.fetchEle(this.toastEle, this.template, 'template');\n };\n /**\n * @param {string} value - specifies the string value.\n * @returns {string} - returns the string\n * @hidden\n */\n Toast.prototype.sanitizeHelper = function (value) {\n if (this.enableHtmlSanitizer) {\n var item = SanitizeHtmlHelper.beforeSanitize();\n var beforeEvent = {\n cancel: false,\n helper: null\n };\n extend(item, item, beforeEvent);\n this.trigger('beforeSanitizeHtml', item);\n if (item.cancel && !isNOU(item.helper)) {\n value = item.helper(value);\n }\n else if (!item.cancel) {\n value = SanitizeHtmlHelper.serializeValue(item, value);\n }\n }\n return value;\n };\n /**\n * To Hide Toast element on a document.\n * To Hide all toast element when passing 'All'.\n *\n * @param {HTMLElement} element - To Hide Toast element on screen.\n * @returns {void}\n */\n Toast.prototype.hide = function (element) {\n this.hideToast('', element);\n };\n Toast.prototype.hideToast = function (interactionType, element) {\n if (isNOU(this.toastContainer) || this.toastContainer.childElementCount === 0) {\n return;\n }\n if (typeof element === 'string' && element === 'All') {\n for (var i = 0; i < this.toastContainer.childElementCount; i++) {\n this.destroyToast(this.toastContainer.children[i], interactionType);\n }\n return;\n }\n if (isNOU(element)) {\n element = (this.newestOnTop ? this.toastContainer.lastElementChild : this.toastContainer.firstElementChild);\n }\n this.destroyToast(element, interactionType);\n };\n Toast.prototype.fetchEle = function (ele, value, prob) {\n value = typeof (value) === 'string' ? this.sanitizeHelper(value) : value;\n // eslint-disable-next-line\n var templateFn;\n var tempVar;\n var tmpArray;\n var templateProps;\n if (ele.classList.contains(TITLE)) {\n templateProps = this.element.id + 'title';\n }\n else if (ele.classList.contains(CONTENT)) {\n templateProps = this.element.id + 'content';\n }\n else {\n templateProps = this.element.id + 'template';\n }\n // eslint-disable-next-line\n prob === 'content' ? tempVar = this.contentTemplate : tempVar = this.toastTemplate;\n if (!isNOU(tempVar)) {\n ele.appendChild(tempVar.cloneNode(true));\n return ele;\n }\n try {\n if (typeof value !== 'function' && document.querySelectorAll(value).length > 0) {\n var elem = null;\n if (prob !== 'title') {\n elem = document.querySelector(value);\n ele.appendChild(elem);\n elem.style.display = '';\n }\n var clo = isNOU(elem) ? tempVar : elem.cloneNode(true);\n // eslint-disable-next-line\n prob === 'content' ? this.contentTemplate = clo : this.toastTemplate = clo;\n }\n else {\n templateFn = templateCompiler(value);\n }\n }\n catch (e) {\n templateFn = typeof value == 'object' ? templateCompiler(value) : templateCompiler(initializeCSPTemplate(function () { return value; }));\n // eslint-disable-next-line\n var templateValue = value;\n }\n if (!isNOU(templateFn)) {\n if (!this.isBlazorServer()) {\n tmpArray = templateFn({}, this, prob, null, true);\n }\n else {\n var isString = true;\n tmpArray = templateFn({}, this, prob, templateProps, isString);\n }\n }\n if (!isNOU(tmpArray) && tmpArray.length > 0 && !(isNOU(tmpArray[0].tagName) && tmpArray.length === 1)) {\n [].slice.call(tmpArray).forEach(function (el) {\n if (!isNOU(el.tagName)) {\n el.style.display = '';\n }\n ele.appendChild(el);\n });\n }\n else if (typeof value !== 'function' && ele.childElementCount === 0) {\n ele.innerHTML = value;\n }\n return ele;\n };\n Toast.prototype.clearProgress = function (intervalId) {\n if (!isNOU(this.intervalId[intervalId])) {\n clearInterval(this.intervalId[intervalId]);\n delete this.intervalId[intervalId];\n }\n if (!isNOU(this.progressObj[intervalId])) {\n clearInterval(this.progressObj[intervalId].intervalId);\n delete this.progressObj[intervalId];\n }\n };\n Toast.prototype.removeToastContainer = function (isClosed) {\n if (isClosed && this.toastContainer.classList.contains('e-toast-util')) {\n detach(this.toastContainer);\n }\n };\n Toast.prototype.clearContainerPos = function (isClosed) {\n var _this = this;\n if (this.isBlazorServer()) {\n this.toastContainer = null;\n return;\n }\n if (this.customPosition) {\n setStyleAttribute(this.toastContainer, { 'left': '', 'top': '' });\n this.removeToastContainer(isClosed);\n this.toastContainer = null;\n this.customPosition = false;\n }\n else {\n [ROOT + '-top-left',\n ROOT + '-top-right',\n ROOT + '-bottom-left',\n ROOT + '-bottom-right',\n ROOT + '-bottom-center',\n ROOT + '-top-center',\n ROOT + '-full-width'].forEach(function (pos) {\n if (!isNOU(_this.toastContainer) && _this.toastContainer.classList.contains(pos)) {\n _this.toastContainer.classList.remove(pos);\n }\n });\n this.removeToastContainer(isClosed);\n this.toastContainer = null;\n }\n if (!isNOU(this.contentTemplate)) {\n this.clearContentTemplate();\n }\n if (!isNOU(this.toastTemplate)) {\n this.clearToastTemplate();\n }\n };\n Toast.prototype.clearContentTemplate = function () {\n this.contentTemplate.style.display = 'none';\n document.body.appendChild(this.contentTemplate);\n this.contentTemplate = null;\n };\n Toast.prototype.clearToastTemplate = function () {\n this.toastTemplate.style.display = 'none';\n document.body.appendChild(this.toastTemplate);\n this.toastTemplate = null;\n };\n Toast.prototype.isBlazorServer = function () {\n return (isBlazor() && this.isServerRendered);\n };\n Toast.prototype.destroyToast = function (toastEle, interactionType) {\n var _this = this;\n var toastObj;\n for (var i = 0; i < this.toastCollection.length; i++) {\n if (this.toastCollection[i].element[0] === toastEle) {\n toastObj = this.toastCollection[i];\n this.toastCollection.splice(i, 1);\n }\n }\n var toastBeforeClose = {\n options: this,\n cancel: false,\n type: interactionType,\n element: toastEle,\n toastContainer: this.toastContainer\n };\n var hideAnimate = this.animation.hide;\n var animate = {\n duration: hideAnimate.duration, name: (hideAnimate.effect === 'None' && animationMode === 'Enable') ? 'FadeOut' : hideAnimate.effect, timingFunction: hideAnimate.easing\n };\n var intervalId = parseInt(toastEle.id.split('toast_')[1], 10);\n var toastClose = this.isBlazorServer() ? {\n options: toastObj,\n toastContainer: this.toastContainer\n } : {\n options: toastObj,\n toastContainer: this.toastContainer,\n toastObj: this\n };\n this.trigger('beforeClose', toastBeforeClose, function (toastBeforeCloseArgs) {\n if (!toastBeforeCloseArgs.cancel) {\n if (!isNOU(_this.progressObj[intervalId]) && !isNOU(toastEle.querySelector('.' + PROGRESS))) {\n _this.progressObj[intervalId].progressEle.style.width = '0%';\n }\n animate.end = function () {\n _this.clearProgress(intervalId);\n if (!_this.isBlazorServer() || isNOU(toastObj)) {\n detach(toastEle);\n }\n _this.trigger('close', toastClose);\n if (_this.toastContainer.childElementCount === 0) {\n _this.clearContainerPos(true);\n }\n hideAnimate = null;\n animate = null;\n };\n new Animation(animate).animate(toastEle);\n }\n });\n };\n Toast.prototype.personalizeToast = function () {\n this.setIcon();\n this.setTitle();\n this.setContent();\n this.actionButtons();\n };\n Toast.prototype.setAria = function () {\n attributes(this.toastEle, { 'role': 'alert' });\n };\n Toast.prototype.setPositioning = function (pos) {\n if (this.isBlazorServer()) {\n return;\n }\n if (!isNaN(parseFloat(pos.X)) || !isNaN(parseFloat(pos.Y))) {\n this.customPosition = true;\n setStyleAttribute(this.toastContainer, { 'left': formatUnit(pos.X), 'top': formatUnit(pos.Y) });\n }\n else {\n this.toastContainer.classList.add(ROOT + '-' + pos.Y.toString().toLowerCase() + '-' + pos.X.toString().toLowerCase());\n }\n };\n Toast.prototype.setCloseButton = function () {\n if (!this.showCloseButton) {\n return;\n }\n // eslint-disable-next-line\n var localeText = { close: 'Close' };\n this.l10n = new L10n('toast', localeText, this.locale);\n this.l10n.setLocale(this.locale);\n var closeIconTitle = this.l10n.getConstant('close');\n var closeBtn = this.createElement('div', { className: CLOSEBTN + ' e-icons ', attrs: { tabindex: '0', 'aria-label': closeIconTitle, 'role': 'button' } });\n this.toastEle.classList.add('e-toast-header-close-icon');\n this.toastEle.appendChild(closeBtn);\n };\n Toast.prototype.setProgress = function () {\n if (this.timeOut > 0) {\n var id = parseInt(this.toastEle.id.split('toast_')[1], 10);\n this.intervalId[id] = window.setTimeout(this.destroyToast.bind(this, this.toastEle), this.timeOut);\n this.progressObj[id] = { hideEta: null, intervalId: null, maxHideTime: null,\n element: null, timeOutId: null, progressEle: null };\n this.progressObj[id].maxHideTime = parseFloat(this.timeOut + '');\n this.progressObj[id].hideEta = new Date().getTime() + this.progressObj[id].maxHideTime;\n this.progressObj[id].element = this.toastEle;\n if (this.extendedTimeout > 0) {\n EventHandler.add(this.toastEle, 'mouseover', this.toastHoverAction.bind(this, id));\n EventHandler.add(this.toastEle, 'mouseleave', this.delayedToastProgress.bind(this, id));\n this.progressObj[id].timeOutId = this.intervalId[id];\n }\n if (this.showProgressBar) {\n this.progressBarEle = this.createElement('div', { className: PROGRESS });\n this.toastEle.insertBefore(this.progressBarEle, this.toastEle.children[0]);\n // eslint-disable-next-line max-len\n this.progressObj[id].intervalId = setInterval(this.updateProgressBar.bind(this, this.progressObj[id]), 10);\n this.progressObj[id].progressEle = this.progressBarEle;\n }\n }\n };\n Toast.prototype.toastHoverAction = function (id) {\n clearTimeout(this.progressObj[id].timeOutId);\n clearInterval(this.progressObj[id].intervalId);\n this.progressObj[id].hideEta = 0;\n var toastEle = this.progressObj[id].element;\n if (!isNOU(toastEle.querySelector('.' + PROGRESS))) {\n this.progressObj[id].progressEle.style.width = '0%';\n }\n };\n Toast.prototype.delayedToastProgress = function (id) {\n var progress = this.progressObj[id];\n var toastEle = progress.element;\n progress.timeOutId = window.setTimeout(this.destroyToast.bind(this, toastEle), this.extendedTimeout);\n progress.maxHideTime = parseFloat(this.extendedTimeout + '');\n progress.hideEta = new Date().getTime() + progress.maxHideTime;\n if (!isNOU(toastEle.querySelector('.' + PROGRESS))) {\n progress.intervalId = setInterval(this.updateProgressBar.bind(this, progress), 10);\n }\n };\n Toast.prototype.updateProgressBar = function (progressObj) {\n var percentage = ((progressObj.hideEta - (new Date().getTime())) / progressObj.maxHideTime) * 100;\n percentage = this.progressDirection === 'Ltr' ? 100 - percentage : percentage;\n progressObj.progressEle.style.width = percentage + '%';\n };\n Toast.prototype.setIcon = function () {\n if (isNOU(this.icon) || this.icon.length === 0) {\n return;\n }\n var iconEle = this.createElement('div', { className: ICON + ' e-icons ' + this.icon });\n this.toastEle.classList.add('e-toast-header-icon');\n this.toastEle.appendChild(iconEle);\n };\n Toast.prototype.setTitle = function () {\n if (isNOU(this.title)) {\n return;\n }\n var titleEle = this.createElement('div', { className: TITLE });\n titleEle = this.fetchEle(titleEle, this.title, 'title');\n var msgContainer = this.createElement('div', { className: MESSAGE });\n msgContainer.appendChild(titleEle);\n this.toastEle.appendChild(msgContainer);\n };\n Toast.prototype.setContent = function () {\n var contentEle = this.createElement('div', { className: CONTENT });\n var ele = this.element;\n if (isNOU(this.content) || this.content === '') {\n var isContent = this.element.innerHTML.replace(/\\s/g, '') !== '';\n if ((ele.children.length > 0 || isContent) && !(ele.firstElementChild && ele.firstElementChild.classList.contains(ROOT))) {\n this.innerEle = document.createDocumentFragment();\n var tempEle_1 = this.createElement('div');\n while (ele.childNodes.length !== 0) {\n this.innerEle.appendChild(this.element.childNodes[0]);\n }\n contentEle.appendChild(this.innerEle);\n [].slice.call(contentEle.children).forEach(function (ele) {\n tempEle_1.appendChild(ele.cloneNode(true));\n });\n this.content = tempEle_1;\n this.appendMessageContainer(contentEle);\n }\n }\n else {\n if (typeof (this.content) === 'object' && !isNOU(this.content.tagName)) {\n contentEle.appendChild(this.content);\n this.content = this.content.cloneNode(true);\n this.appendMessageContainer(contentEle);\n }\n else {\n contentEle = this.fetchEle(contentEle, this.content, 'content');\n this.appendMessageContainer(contentEle);\n }\n }\n };\n Toast.prototype.appendMessageContainer = function (element) {\n if (this.toastEle.querySelectorAll('.' + MESSAGE).length > 0) {\n this.toastEle.querySelector('.' + MESSAGE).appendChild(element);\n }\n else {\n var msgContainer = this.createElement('div', { className: MESSAGE });\n msgContainer.appendChild(element);\n this.toastEle.appendChild(msgContainer);\n }\n };\n Toast.prototype.actionButtons = function () {\n var _this = this;\n var actionBtnContainer = this.createElement('div', { className: ACTIOBUTTONS });\n [].slice.call(this.buttons).forEach(function (actionBtn) {\n if (isNOU(actionBtn.model)) {\n return;\n }\n var btnDom = _this.createElement('button');\n btnDom.setAttribute('type', 'button');\n if (isNOU(actionBtn.model.cssClass) || actionBtn.model.cssClass.length === 0) {\n actionBtn.model.cssClass = 'e-primary' + ' ' + _this.cssClass;\n }\n btnDom.classList.add('e-small');\n new Button(actionBtn.model, btnDom);\n if (!isNOU(actionBtn.click) && typeof (actionBtn.click) === 'function') {\n EventHandler.add(btnDom, 'click', actionBtn.click);\n }\n actionBtnContainer.appendChild(btnDom);\n });\n if (actionBtnContainer.childElementCount > 0) {\n this.appendMessageContainer(actionBtnContainer);\n }\n };\n Toast.prototype.appendToTarget = function (toastObj) {\n var _this = this;\n var toastBeforeOpen = this.isBlazorServer() ? {\n options: toastObj,\n element: this.toastEle,\n cancel: false\n } : {\n options: toastObj,\n toastObj: this,\n element: this.toastEle,\n cancel: false\n };\n this.trigger('beforeOpen', toastBeforeOpen, function (toastBeforeOpenArgs) {\n if (!toastBeforeOpenArgs.cancel) {\n if (!_this.isBlazorServer()) {\n _this.toastEle.style.display = 'none';\n }\n if (_this.newestOnTop && _this.toastContainer.childElementCount !== 0) {\n _this.toastContainer.insertBefore(_this.toastEle, _this.toastContainer.children[0]);\n }\n else if (!_this.isBlazorServer()) {\n _this.toastContainer.appendChild(_this.toastEle);\n }\n removeClass([_this.toastEle], TOAST_BLAZOR_HIDDEN);\n EventHandler.add(_this.toastEle, 'click', _this.clickHandler, _this);\n EventHandler.add(_this.toastEle, 'keydown', _this.keyDownHandler, _this);\n _this.toastContainer.style.zIndex = getZindexPartial(_this.toastContainer) + '';\n _this.displayToast(_this.toastEle, toastObj);\n }\n else if (_this.isBlazorServer()) {\n var intervalId = parseInt(_this.toastEle.id.split('toast_')[1], 10);\n _this.clearProgress(intervalId);\n detach(_this.toastEle);\n if (_this.toastContainer.childElementCount === 0) {\n _this.clearContainerPos();\n }\n }\n });\n };\n Toast.prototype.clickHandler = function (e) {\n var _this = this;\n if (!this.isBlazorServer()) {\n e.stopPropagation();\n }\n var target = e.target;\n var toastEle = closest(target, '.' + ROOT);\n var clickArgs = this.isBlazorServer() ? {\n element: toastEle, cancel: false, clickToClose: false, originalEvent: e\n } : {\n element: toastEle, cancel: false, clickToClose: false, originalEvent: e, toastObj: this\n };\n var isCloseIcon = target.classList.contains(CLOSEBTN);\n this.trigger('click', clickArgs, function (toastClickArgs) {\n if ((isCloseIcon && !toastClickArgs.cancel) || toastClickArgs.clickToClose) {\n _this.destroyToast(toastEle, 'click');\n }\n });\n };\n Toast.prototype.keyDownHandler = function (e) {\n if (e.target.classList.contains(CLOSEBTN) &&\n (e.keyCode === 13 || e.keyCode === 32)) {\n var target = e.target;\n var toastEle = closest(target, '.' + ROOT);\n this.destroyToast(toastEle, 'key');\n }\n };\n Toast.prototype.displayToast = function (toastEle, toastObj) {\n var _this = this;\n var showAnimate = this.animation.show;\n var animate = {\n duration: showAnimate.duration, name: (showAnimate.effect === \"None\" && animationMode === 'Enable') ? 'FadeIn' : showAnimate.effect, timingFunction: showAnimate.easing\n };\n var toastOpen = this.isBlazorServer() ? {\n options: toastObj,\n element: this.toastEle\n } : {\n options: toastObj,\n toastObj: this,\n element: this.toastEle\n };\n animate.begin = function () {\n toastEle.style.display = '';\n };\n animate.end = function () {\n _this.trigger('open', toastOpen);\n };\n new Animation(animate).animate(toastEle);\n };\n Toast.prototype.getContainer = function () {\n this.element.classList.add(CONTAINER);\n return this.element;\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {ToastModel} newProp - specifies the new property\n * @param {ToastModel} oldProp - specifies the old property\n * @returns {void}\n * @private\n */\n // eslint-disable-next-line\n Toast.prototype.onPropertyChanged = function (newProp, oldProp) {\n var container = this.element;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'enableRtl':\n // eslint-disable-next-line\n newProp.enableRtl ? container.classList.add(RTL) : container.classList.remove(RTL);\n break;\n }\n }\n };\n __decorate([\n Property('300px')\n ], Toast.prototype, \"width\", void 0);\n __decorate([\n Property('auto')\n ], Toast.prototype, \"height\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"title\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"content\", void 0);\n __decorate([\n Property(true)\n ], Toast.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"icon\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"template\", void 0);\n __decorate([\n Property(true)\n ], Toast.prototype, \"newestOnTop\", void 0);\n __decorate([\n Property(false)\n ], Toast.prototype, \"showCloseButton\", void 0);\n __decorate([\n Property(false)\n ], Toast.prototype, \"showProgressBar\", void 0);\n __decorate([\n Property(5000)\n ], Toast.prototype, \"timeOut\", void 0);\n __decorate([\n Property('Rtl')\n ], Toast.prototype, \"progressDirection\", void 0);\n __decorate([\n Property(1000)\n ], Toast.prototype, \"extendedTimeout\", void 0);\n __decorate([\n Complex({}, ToastAnimationSettings)\n ], Toast.prototype, \"animation\", void 0);\n __decorate([\n Complex({}, ToastPosition)\n ], Toast.prototype, \"position\", void 0);\n __decorate([\n Collection([{}], ButtonModelProps)\n ], Toast.prototype, \"buttons\", void 0);\n __decorate([\n Property(null)\n ], Toast.prototype, \"target\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"beforeSanitizeHtml\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"beforeClose\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], Toast.prototype, \"click\", void 0);\n Toast = __decorate([\n NotifyPropertyChanges\n ], Toast);\n return Toast;\n}(Component));\nexport { Toast };\n/**\n * Base for creating Toast through utility method.\n */\n// eslint-disable-next-line\nexport var ToastUtility;\n(function (ToastUtility) {\n /**\n * To display a simple toast using the 'ToastUtility' with 'ToastModal' or\n * as string with toast content, type, timeOut.\n * ```\n * Eg : ToastUtility.show('Toast Content Message', 'Information', 7000);\n *\n * ```\n */\n /* istanbul ignore next */\n /**\n *\n * @param { ToastModel | string } content - Specifies the toast modal or the content of the Toast.\n * @param {string} type - Specifies the type of toast.\n * @param { number } timeOut - Specifies the timeOut of the toast.\n * @returns {Toast} - returns the element\n */\n function show(content, type, timeOut) {\n var toastContainerElement;\n if (document.querySelector('.' + CONTAINER)) {\n toastContainerElement = document.querySelector('.' + CONTAINER);\n }\n else {\n toastContainerElement = createElement('div', { 'className': ROOT + ' ' + CONTAINER + ' e-toast-util' });\n document.body.appendChild(toastContainerElement);\n }\n var untilToastsModel;\n if (typeof (content) === 'string') {\n var cssClass = void 0;\n var icon = void 0;\n if (!isNOU(type)) {\n switch (type) {\n case 'Warning':\n cssClass = 'e-toast-warning';\n icon = 'e-toast-warning-icon';\n break;\n case 'Success':\n cssClass = 'e-toast-success';\n icon = 'e-toast-success-icon';\n break;\n case 'Error':\n cssClass = 'e-toast-danger';\n icon = 'e-toast-error-icon';\n break;\n case 'Information':\n cssClass = 'e-toast-info';\n icon = 'e-toast-info-icon';\n break;\n }\n }\n else {\n cssClass = '';\n icon = '';\n }\n untilToastsModel = {\n content: content,\n cssClass: cssClass,\n icon: icon,\n timeOut: !isNOU(timeOut) ? timeOut : 5000\n };\n }\n else {\n untilToastsModel = content;\n }\n var toastObj = new Toast(untilToastsModel);\n toastObj.appendTo(toastContainerElement);\n toastObj.show();\n return toastObj;\n }\n ToastUtility.show = show;\n})(ToastUtility || (ToastUtility = {}));\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, NotifyPropertyChanges, addClass, removeClass, L10n } from '@syncfusion/ej2-base';\nimport { Event, Property, detach, EventHandler, isNullOrUndefined as isNOU, compile, append } from '@syncfusion/ej2-base';\n/**\n * Specifies the type of severity to display the message with distinctive icons and colors.\n */\nexport var Severity;\n(function (Severity) {\n /**\n * The message is displayed with icons and colors to denote it as a normal message.\n */\n Severity[\"Normal\"] = \"Normal\";\n /**\n * The message is displayed with icons and colors to denote it as a success message.\n */\n Severity[\"Success\"] = \"Success\";\n /**\n * The message is displayed with icons and colors to denote it as information.\n */\n Severity[\"Info\"] = \"Info\";\n /**\n * The message is displayed with icons and colors to denote it as a warning message.\n */\n Severity[\"Warning\"] = \"Warning\";\n /**\n * The message is displayed with icons and colors to denote it as an error message.\n */\n Severity[\"Error\"] = \"Error\";\n})(Severity || (Severity = {}));\n/**\n * Specifies the predefined appearance variants for the component to display.\n */\nexport var Variant;\n(function (Variant) {\n /**\n * Denotes the severity is differentiated using text color and light background color.\n */\n Variant[\"Text\"] = \"Text\";\n /**\n * Denotes the severity is differentiated using text color and border without background.\n */\n Variant[\"Outlined\"] = \"Outlined\";\n /**\n * Denotes the severity is differentiated using text color and dark background color.\n */\n Variant[\"Filled\"] = \"Filled\";\n})(Variant || (Variant = {}));\nvar MSG_ICON = 'e-msg-icon';\nvar MSG_CLOSE_ICON = 'e-msg-close-icon';\nvar MSG_CONTENT = 'e-msg-content';\nvar MSG_CONTENT_CENTER = 'e-content-center';\nvar RTL = 'e-rtl';\nvar SUCCESS = 'e-success';\nvar WARNING = 'e-warning';\nvar INFO = 'e-info';\nvar ERROR = 'e-error';\nvar OUTLINED = 'e-outlined';\nvar FILLED = 'e-filled';\nvar HIDE = 'e-hidden';\n/**\n * The Message component displays messages with severity by differentiating icons and colors to denote the importance and context of the message to the end user.\n * ```html\n *
    \n * \n * ```\n *\n */\nvar Message = /** @class */ (function (_super) {\n __extends(Message, _super);\n /**\n * Constructor for creating the Message component widget.\n *\n * @param {MessageModel}options - Specifies the Message component interface.\n * @param {HTMLElement}element - Specifies the target element.\n */\n function Message(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.initialRender = true;\n return _this;\n }\n /**\n * Gets the Message component module name.\n *\n * @returns {string} - Returns the string.\n * @private\n */\n Message.prototype.getModuleName = function () {\n return 'message';\n };\n /**\n * Get the persisted state properties of the Message component.\n *\n * @returns {string} - Returns the string.\n */\n Message.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Method to initialize the variables for the Message component.\n *\n * @returns {void}\n * @private\n */\n Message.prototype.preRender = function () {\n var localeText = { close: 'Close' };\n this.l10n = new L10n('message', localeText, this.locale);\n };\n /**\n * Method to initialize the Message component rendering.\n *\n * @returns {void}\n * @private\n */\n Message.prototype.render = function () {\n this.innerContent = this.element.innerHTML;\n this.element.innerHTML = '';\n this.msgElement = this.createElement('div', { className: 'e-msg-content-wrap' });\n this.initialize();\n this.wireEvents();\n this.renderComplete();\n this.renderReactTemplates();\n this.initialRender = false;\n };\n Message.prototype.initialize = function () {\n this.element.setAttribute('role', 'alert');\n this.setCssClass();\n this.setIcon();\n this.setContent();\n this.setCloseIcon();\n this.setSeverity();\n this.setVariant();\n this.setVisible();\n if (this.enableRtl) {\n this.element.classList.add(RTL);\n }\n };\n Message.prototype.setIcon = function () {\n if (this.showIcon) {\n this.iconElement = this.createElement('span', { className: MSG_ICON });\n if (this.element.classList.contains(MSG_CONTENT_CENTER)) {\n this.msgElement.appendChild(this.iconElement);\n }\n else {\n this.element.appendChild(this.iconElement);\n }\n }\n };\n Message.prototype.setCloseIcon = function () {\n if (this.showCloseIcon) {\n this.closeIcon = this.createElement('button', { attrs: { type: 'button', class: MSG_CLOSE_ICON } });\n this.element.appendChild(this.closeIcon);\n this.setTitle();\n }\n };\n Message.prototype.setTitle = function () {\n this.l10n.setLocale(this.locale);\n var closeIconTitle = this.l10n.getConstant('close');\n this.closeIcon.setAttribute('title', closeIconTitle);\n this.closeIcon.setAttribute('aria-label', closeIconTitle);\n };\n Message.prototype.setContent = function () {\n this.txtElement = this.createElement('div', { className: MSG_CONTENT });\n if (this.element.classList.contains(MSG_CONTENT_CENTER)) {\n this.msgElement.appendChild(this.txtElement);\n this.element.appendChild(this.msgElement);\n }\n else {\n this.element.appendChild(this.txtElement);\n }\n this.setTemplate();\n };\n Message.prototype.setTemplate = function () {\n var templateFn;\n if (isNOU(this.content) || this.content === '') {\n this.txtElement.innerHTML = this.innerContent;\n }\n else if (!isNOU(this.content) && this.content !== '') {\n if ((typeof this.content === 'string') || (typeof this.content !== 'string')) {\n // eslint-disable-next-line\n if (this.isVue || typeof this.content !== 'string') {\n templateFn = compile(this.content);\n if (!isNOU(templateFn)) {\n var tempArr = templateFn({}, this, 'content', this.element.id + 'content', true);\n if (tempArr) {\n tempArr = Array.prototype.slice.call(tempArr);\n append(tempArr, this.txtElement);\n this.renderReactTemplates();\n }\n }\n }\n else {\n this.txtElement.innerHTML = this.content;\n }\n }\n }\n };\n Message.prototype.setSeverity = function () {\n var classList = [SUCCESS, WARNING, INFO, ERROR];\n removeClass([this.element], classList);\n if (this.severity === 'Success') {\n addClass([this.element], SUCCESS);\n }\n else if (this.severity === 'Warning') {\n addClass([this.element], WARNING);\n }\n else if (this.severity === 'Error') {\n addClass([this.element], ERROR);\n }\n else if (this.severity === 'Info') {\n addClass([this.element], INFO);\n }\n };\n Message.prototype.setVariant = function () {\n var classList = [FILLED, OUTLINED];\n removeClass([this.element], classList);\n if (this.variant === 'Outlined') {\n addClass([this.element], OUTLINED);\n }\n else if (this.variant === 'Filled') {\n addClass([this.element], FILLED);\n }\n };\n Message.prototype.setCssClass = function (oldCssClass) {\n if (oldCssClass) {\n removeClass([this.element], oldCssClass.split(' '));\n }\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n };\n Message.prototype.setVisible = function () {\n if (!this.visible) {\n addClass([this.element], HIDE);\n if (!this.initialRender) {\n this.trigger('closed', { event: event, isInteracted: false, element: this.element });\n }\n }\n else {\n removeClass([this.element], HIDE);\n }\n };\n Message.prototype.clickHandler = function (event) {\n this.closeMessage(event);\n };\n Message.prototype.keyboardHandler = function (event) {\n if (event.keyCode === 32 || event.keyCode === 13) {\n this.closeMessage(event);\n }\n };\n Message.prototype.closeMessage = function (event) {\n addClass([this.element], HIDE);\n this.setProperties({ visible: false }, true);\n var eventArgs = { event: event, isInteracted: true, element: this.element };\n this.trigger('closed', eventArgs);\n };\n Message.prototype.wireEvents = function () {\n if (this.showCloseIcon) {\n EventHandler.add(this.closeIcon, 'click', this.clickHandler, this);\n EventHandler.add(this.closeIcon, 'keydown', this.keyboardHandler, this);\n }\n };\n Message.prototype.unWireEvents = function () {\n if (this.showCloseIcon) {\n EventHandler.remove(this.closeIcon, 'click', this.clickHandler);\n EventHandler.remove(this.closeIcon, 'keydown', this.keyboardHandler);\n }\n };\n /**\n * Method to handle the dynamic changes of the Message component properties.\n *\n * @param {MessageModel} newProp - Specifies the new property.\n * @param {MessageModel} oldProp - Specifies the old property.\n * @returns {void}\n * @private\n */\n Message.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'cssClass':\n this.setCssClass(oldProp.cssClass);\n break;\n case 'content':\n this.txtElement.innerHTML = '';\n this.setTemplate();\n break;\n case 'enableRtl':\n if (!this.enableRtl) {\n this.element.classList.remove(RTL);\n }\n else {\n this.element.classList.add(RTL);\n }\n break;\n case 'locale':\n if (this.showCloseIcon) {\n this.setTitle();\n }\n break;\n case 'showIcon':\n if (!this.showIcon && this.element.getElementsByClassName(MSG_ICON).length > 0) {\n detach(this.iconElement);\n }\n if (this.showIcon) {\n this.iconElement = this.createElement('span', { className: MSG_ICON });\n this.element.insertBefore(this.iconElement, this.txtElement);\n }\n break;\n case 'showCloseIcon':\n if (!this.showCloseIcon && !isNOU(this.closeIcon)) {\n this.unWireEvents();\n detach(this.closeIcon);\n }\n else {\n this.setCloseIcon();\n this.wireEvents();\n }\n break;\n case 'severity':\n this.setSeverity();\n break;\n case 'variant':\n this.setVariant();\n break;\n case 'visible':\n this.setVisible();\n break;\n }\n }\n };\n /**\n * Method to destroy the Message component. It removes the component from the DOM and detaches all its bound events. It also removes the attributes and classes of the component.\n *\n * @returns {void}\n */\n Message.prototype.destroy = function () {\n var cssClass = isNOU(this.cssClass) ? [''] : this.cssClass.split(' ');\n var className = [SUCCESS, WARNING, INFO, ERROR, RTL, HIDE, OUTLINED, FILLED];\n var classList = (cssClass.length === 1 && cssClass[0] === '') ? className : className.concat(cssClass);\n removeClass([this.element], classList);\n this.element.removeAttribute('role');\n this.unWireEvents();\n if (!isNOU(this.iconElement)) {\n detach(this.iconElement);\n }\n detach(this.txtElement);\n if (!isNOU(this.closeIcon)) {\n detach(this.closeIcon);\n }\n _super.prototype.destroy.call(this);\n };\n __decorate([\n Property(null)\n ], Message.prototype, \"content\", void 0);\n __decorate([\n Property('')\n ], Message.prototype, \"cssClass\", void 0);\n __decorate([\n Property(true)\n ], Message.prototype, \"showIcon\", void 0);\n __decorate([\n Property(false)\n ], Message.prototype, \"showCloseIcon\", void 0);\n __decorate([\n Property('Normal')\n ], Message.prototype, \"severity\", void 0);\n __decorate([\n Property('Text')\n ], Message.prototype, \"variant\", void 0);\n __decorate([\n Property(true)\n ], Message.prototype, \"visible\", void 0);\n __decorate([\n Event()\n ], Message.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Message.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], Message.prototype, \"closed\", void 0);\n Message = __decorate([\n NotifyPropertyChanges\n ], Message);\n return Message;\n}(Component));\nexport { Message };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, getUniqueID, formatUnit, NotifyPropertyChanges, Property, attributes, removeClass, addClass } from '@syncfusion/ej2-base';\nvar cssClassName = {\n TEXTSHAPE: 'e-skeleton-text',\n CIRCLESHAPE: 'e-skeleton-circle',\n SQUARESHAPE: 'e-skeleton-square',\n RECTANGLESHAPE: 'e-skeleton-rectangle',\n WAVEEFFECT: 'e-shimmer-wave',\n PULSEEFFECT: 'e-shimmer-pulse',\n FADEEFFECT: 'e-shimmer-fade',\n VISIBLENONE: 'e-visible-none'\n};\n/**\n * Defines the shape of Skeleton.\n */\nexport var SkeletonType;\n(function (SkeletonType) {\n /**\n * Defines the skeleton shape as text.\n */\n SkeletonType[\"Text\"] = \"Text\";\n /**\n * Defines the skeleton shape as circle.\n */\n SkeletonType[\"Circle\"] = \"Circle\";\n /**\n * Defines the skeleton shape as square.\n */\n SkeletonType[\"Square\"] = \"Square\";\n /**\n * Defines the skeleton shape as rectangle.\n */\n SkeletonType[\"Rectangle\"] = \"Rectangle\";\n})(SkeletonType || (SkeletonType = {}));\n/**\n * Defines the animation effect of Skeleton.\n */\nexport var ShimmerEffect;\n(function (ShimmerEffect) {\n /**\n * Defines the animation as shimmer wave effect.\n */\n ShimmerEffect[\"Wave\"] = \"Wave\";\n /**\n * Defines the animation as fade effect.\n */\n ShimmerEffect[\"Fade\"] = \"Fade\";\n /**\n * Defines the animation as pulse effect.\n */\n ShimmerEffect[\"Pulse\"] = \"Pulse\";\n /**\n * Defines the animation as no effect.\n */\n ShimmerEffect[\"None\"] = \"None\";\n})(ShimmerEffect || (ShimmerEffect = {}));\n/**\n * The Shimmer is a placeholder that animates a shimmer effect to let users know that the page’s content is loading at the moment.\n * In other terms, it simulates the layout of page content while loading the actual content.\n * ```html\n *
    \n * ```\n * ```typescript\n * \n * ```\n */\nvar Skeleton = /** @class */ (function (_super) {\n __extends(Skeleton, _super);\n /**\n * Constructor for creating Skeleton component.\n *\n * @param {SkeletonModel} options - Defines the model of Skeleton class.\n * @param {HTMLElement} element - Defines the target HTML element.\n */\n function Skeleton(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Get component module name.\n *\n * @returns {string} - Module name\n * @private\n */\n Skeleton.prototype.getModuleName = function () {\n return 'skeleton';\n };\n Skeleton.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n Skeleton.prototype.preRender = function () {\n if (!this.element.id) {\n this.element.id = getUniqueID('e-' + this.getModuleName());\n }\n this.updateCssClass();\n attributes(this.element, { role: 'alert', 'aria-busy': 'true', 'aria-live': 'polite', 'aria-label': this.label });\n };\n /**\n * Method for initialize the component rendering.\n *\n * @returns {void}\n * @private\n */\n Skeleton.prototype.render = function () {\n this.initialize();\n };\n Skeleton.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'width':\n case 'height':\n this.updateDimension();\n break;\n case 'shape':\n this.updateShape();\n break;\n case 'shimmerEffect':\n this.updateEffect();\n break;\n case 'visible':\n this.updateVisibility();\n break;\n case 'label':\n this.element.setAttribute('aria-label', this.label);\n break;\n case 'cssClass':\n if (oldProp.cssClass) {\n removeClass([this.element], oldProp.cssClass.split(' '));\n }\n this.updateCssClass();\n break;\n }\n }\n };\n /**\n * Method to destroys the Skeleton component.\n *\n * @returns {void}\n */\n Skeleton.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n var attrs = ['role', 'aria-live', 'aria-busy', 'aria-label'];\n var cssClass = [];\n if (this.cssClass) {\n cssClass = cssClass.concat(this.cssClass.split(' '));\n }\n for (var i = 0; i < attrs.length; i++) {\n this.element.removeAttribute(attrs[parseInt(i.toString(), 10)]);\n }\n cssClass = cssClass.concat(this.element.classList.value.match(/(e-skeleton-[^\\s]+)/g) || []);\n cssClass = cssClass.concat(this.element.classList.value.match(/(e-shimmer-[^\\s]+)/g) || []);\n removeClass([this.element], cssClass);\n };\n Skeleton.prototype.initialize = function () {\n this.updateShape();\n this.updateEffect();\n this.updateVisibility();\n };\n Skeleton.prototype.updateShape = function () {\n var shapeCss = cssClassName[this.shape.toUpperCase() + 'SHAPE'];\n var removeCss = (this.element.classList.value.match(/(e-skeleton-[^\\s]+)/g) || []);\n this.updateDimension();\n if (removeCss) {\n removeClass([this.element], removeCss);\n }\n addClass([this.element], [shapeCss]);\n };\n Skeleton.prototype.updateDimension = function () {\n var width = (!this.width && (['Text', 'Rectangle'].indexOf(this.shape) > -1)) ? '100%' : formatUnit(this.width);\n var height = ['Circle', 'Square'].indexOf(this.shape) > -1 ? width : formatUnit(this.height);\n this.element.style.width = width;\n this.element.style.height = height;\n };\n Skeleton.prototype.updateEffect = function () {\n var removeCss = (this.element.classList.value.match(/(e-shimmer-[^\\s]+)/g) || []);\n if (removeCss) {\n removeClass([this.element], removeCss);\n }\n addClass([this.element], [cssClassName[this.shimmerEffect.toUpperCase() + 'EFFECT']]);\n };\n Skeleton.prototype.updateVisibility = function () {\n this.element.classList[this.visible ? 'remove' : 'add'](cssClassName.VISIBLENONE);\n };\n Skeleton.prototype.updateCssClass = function () {\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n };\n __decorate([\n Property('')\n ], Skeleton.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], Skeleton.prototype, \"height\", void 0);\n __decorate([\n Property(true)\n ], Skeleton.prototype, \"visible\", void 0);\n __decorate([\n Property('Text')\n ], Skeleton.prototype, \"shape\", void 0);\n __decorate([\n Property('Wave')\n ], Skeleton.prototype, \"shimmerEffect\", void 0);\n __decorate([\n Property('Loading...')\n ], Skeleton.prototype, \"label\", void 0);\n __decorate([\n Property('')\n ], Skeleton.prototype, \"cssClass\", void 0);\n Skeleton = __decorate([\n NotifyPropertyChanges\n ], Skeleton);\n return Skeleton;\n}(Component));\nexport { Skeleton };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Component, EventHandler, addClass, append, Property, Event, L10n, compile } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, extend, removeClass, prepend, isNullOrUndefined, detach, getValue } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, rippleEffect, ChildProperty, Complex } from '@syncfusion/ej2-base';\nimport { DataManager, Query, DataUtil } from '@syncfusion/ej2-data';\nimport { ListBase } from '@syncfusion/ej2-lists';\nimport { select, selectAll } from '@syncfusion/ej2-base';\nimport { Skeleton } from '@syncfusion/ej2-notifications';\nvar FieldSettings = /** @class */ (function (_super) {\n __extends(FieldSettings, _super);\n function FieldSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], FieldSettings.prototype, \"text\", void 0);\n __decorate([\n Property()\n ], FieldSettings.prototype, \"value\", void 0);\n __decorate([\n Property()\n ], FieldSettings.prototype, \"iconCss\", void 0);\n __decorate([\n Property()\n ], FieldSettings.prototype, \"groupBy\", void 0);\n __decorate([\n Property()\n ], FieldSettings.prototype, \"htmlAttributes\", void 0);\n return FieldSettings;\n}(ChildProperty));\nexport { FieldSettings };\nexport var dropDownBaseClasses = {\n root: 'e-dropdownbase',\n rtl: 'e-rtl',\n content: 'e-content',\n selected: 'e-active',\n hover: 'e-hover',\n noData: 'e-nodata',\n fixedHead: 'e-fixed-head',\n focus: 'e-item-focus',\n li: 'e-list-item',\n group: 'e-list-group-item',\n disabled: 'e-disabled',\n grouping: 'e-dd-group',\n virtualList: 'e-list-item e-virtual-list',\n};\nvar ITEMTEMPLATE_PROPERTY = 'ItemTemplate';\nvar DISPLAYTEMPLATE_PROPERTY = 'DisplayTemplate';\nvar SPINNERTEMPLATE_PROPERTY = 'SpinnerTemplate';\nvar VALUETEMPLATE_PROPERTY = 'ValueTemplate';\nvar GROUPTEMPLATE_PROPERTY = 'GroupTemplate';\nvar HEADERTEMPLATE_PROPERTY = 'HeaderTemplate';\nvar FOOTERTEMPLATE_PROPERTY = 'FooterTemplate';\nvar NORECORDSTEMPLATE_PROPERTY = 'NoRecordsTemplate';\nvar ACTIONFAILURETEMPLATE_PROPERTY = 'ActionFailureTemplate';\nvar HIDE_GROUPLIST = 'e-hide-group-header';\n/**\n * DropDownBase component will generate the list items based on given data and act as base class to drop-down related components\n */\nvar DropDownBase = /** @class */ (function (_super) {\n __extends(DropDownBase, _super);\n /**\n * * Constructor for DropDownBase class\n *\n * @param {DropDownBaseModel} options - Specifies the DropDownBase model.\n * @param {string | HTMLElement} element - Specifies the element to render as component.\n * @private\n */\n function DropDownBase(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.preventChange = false;\n _this.isAngular = false;\n _this.isPreventChange = false;\n _this.isDynamicDataChange = false;\n _this.addedNewItem = false;\n _this.isAddNewItemTemplate = false;\n _this.isRequesting = false;\n _this.isVirtualizationEnabled = false;\n _this.isCustomDataUpdated = false;\n _this.isAllowFiltering = false;\n _this.virtualizedItemsCount = 0;\n _this.isCheckBoxSelection = false;\n _this.totalItemCount = 0;\n _this.dataCount = 0;\n _this.remoteDataCount = -1;\n _this.isRemoteDataUpdated = false;\n _this.isIncrementalRequest = false;\n _this.itemCount = 30;\n _this.virtualListHeight = 0;\n _this.isVirtualScrolling = false;\n _this.isPreventScrollAction = false;\n _this.scrollPreStartIndex = 0;\n _this.isScrollActionTriggered = false;\n _this.previousStartIndex = 0;\n _this.isMouseScrollAction = false;\n _this.isKeyBoardAction = false;\n _this.isScrollChanged = false;\n _this.isUpwardScrolling = false;\n _this.startIndex = 0;\n _this.currentPageNumber = 0;\n _this.pageCount = 0;\n _this.isPreventKeyAction = false;\n _this.generatedDataObject = {};\n _this.skeletonCount = 32;\n _this.isVirtualTrackHeight = false;\n _this.virtualSelectAll = false;\n _this.incrementalQueryString = '';\n _this.incrementalEndIndex = 0;\n _this.incrementalStartIndex = 0;\n _this.incrementalPreQueryString = '';\n _this.isObjectCustomValue = false;\n _this.appendUncheckList = false;\n _this.getInitialData = false;\n _this.preventPopupOpen = true;\n _this.virtualSelectAllState = false;\n _this.CurrentEvent = null;\n _this.virtualListInfo = {\n currentPageNumber: null,\n direction: null,\n sentinelInfo: {},\n offsets: {},\n startIndex: 0,\n endIndex: 0,\n };\n _this.viewPortInfo = {\n currentPageNumber: null,\n direction: null,\n sentinelInfo: {},\n offsets: {},\n startIndex: 0,\n endIndex: 0,\n };\n _this.selectedValueInfo = {\n currentPageNumber: null,\n direction: null,\n sentinelInfo: {},\n offsets: {},\n startIndex: 0,\n endIndex: 0,\n };\n return _this;\n }\n DropDownBase.prototype.getPropObject = function (prop, newProp, oldProp) {\n var newProperty = new Object();\n var oldProperty = new Object();\n var propName = function (prop) {\n return prop;\n };\n newProperty[propName(prop)] = newProp[propName(prop)];\n oldProperty[propName(prop)] = oldProp[propName(prop)];\n var data = new Object();\n data.newProperty = newProperty;\n data.oldProperty = oldProperty;\n return data;\n };\n DropDownBase.prototype.getValueByText = function (text, ignoreCase, ignoreAccent) {\n var value = null;\n if (!isNullOrUndefined(this.listData)) {\n if (ignoreCase) {\n value = this.checkValueCase(text, true, ignoreAccent);\n }\n else {\n value = this.checkValueCase(text, false, ignoreAccent);\n }\n }\n return value;\n };\n DropDownBase.prototype.checkValueCase = function (text, ignoreCase, ignoreAccent, isTextByValue) {\n var _this = this;\n var value = null;\n if (isTextByValue) {\n value = text;\n }\n var dataSource = this.listData;\n var fields = this.fields;\n var type = this.typeOfData(dataSource).typeof;\n if (type === 'string' || type === 'number' || type === 'boolean') {\n for (var _i = 0, dataSource_1 = dataSource; _i < dataSource_1.length; _i++) {\n var item = dataSource_1[_i];\n if (!isNullOrUndefined(item)) {\n if (ignoreAccent) {\n value = this.checkingAccent(String(item), text, ignoreCase);\n }\n else {\n if (ignoreCase) {\n if (this.checkIgnoreCase(String(item), text)) {\n value = this.getItemValue(String(item), text, ignoreCase);\n }\n }\n else {\n if (this.checkNonIgnoreCase(String(item), text)) {\n value = this.getItemValue(String(item), text, ignoreCase, isTextByValue);\n }\n }\n }\n }\n }\n }\n else {\n if (ignoreCase) {\n dataSource.filter(function (item) {\n var itemValue = getValue(fields.value, item);\n if (!isNullOrUndefined(itemValue) && _this.checkIgnoreCase(getValue(fields.text, item).toString(), text)) {\n value = getValue(fields.value, item);\n }\n });\n }\n else {\n if (isTextByValue) {\n var compareValue_1 = null;\n compareValue_1 = value;\n dataSource.filter(function (item) {\n var itemValue = getValue(fields.value, item);\n if (!isNullOrUndefined(itemValue) && !isNullOrUndefined(value) && itemValue.toString() === compareValue_1.toString()) {\n value = getValue(fields.text, item);\n }\n });\n }\n else {\n dataSource.filter(function (item) {\n if (_this.checkNonIgnoreCase(getValue(fields.text, item), text)) {\n value = getValue(fields.value, item);\n }\n });\n }\n }\n }\n return value;\n };\n DropDownBase.prototype.checkingAccent = function (item, text, ignoreCase) {\n var dataItem = DataUtil.ignoreDiacritics(String(item));\n var textItem = DataUtil.ignoreDiacritics(text.toString());\n var value = null;\n if (ignoreCase) {\n if (this.checkIgnoreCase(dataItem, textItem)) {\n value = this.getItemValue(String(item), text, ignoreCase);\n }\n }\n else {\n if (this.checkNonIgnoreCase(String(item), text)) {\n value = this.getItemValue(String(item), text, ignoreCase);\n }\n }\n return value;\n };\n DropDownBase.prototype.checkIgnoreCase = function (item, text) {\n return String(item).toLowerCase() === text.toString().toLowerCase() ? true : false;\n };\n DropDownBase.prototype.checkNonIgnoreCase = function (item, text) {\n return String(item) === text.toString() ? true : false;\n };\n DropDownBase.prototype.getItemValue = function (dataItem, typedText, ignoreCase, isTextByValue) {\n var value = null;\n var dataSource = this.listData;\n var type = this.typeOfData(dataSource).typeof;\n if (isTextByValue) {\n value = dataItem.toString();\n }\n else {\n if (ignoreCase) {\n value = type === 'string' ? String(dataItem) : this.getFormattedValue(String(dataItem));\n }\n else {\n value = type === 'string' ? typedText : this.getFormattedValue(typedText);\n }\n }\n return value;\n };\n DropDownBase.prototype.templateCompiler = function (baseTemplate) {\n var checkTemplate = false;\n if (typeof baseTemplate !== 'function' && baseTemplate) {\n try {\n checkTemplate = (selectAll(baseTemplate, document).length) ? true : false;\n }\n catch (exception) {\n checkTemplate = false;\n }\n }\n return checkTemplate;\n };\n DropDownBase.prototype.l10nUpdate = function (actionFailure) {\n var ele = this.getModuleName() === 'listbox' ? this.ulElement : this.list;\n if (this.noRecordsTemplate !== 'No records found' || this.actionFailureTemplate !== 'Request failed') {\n var template = actionFailure ? this.actionFailureTemplate : this.noRecordsTemplate;\n var compiledString = void 0;\n var templateId = actionFailure ? this.actionFailureTemplateId : this.noRecordsTemplateId;\n ele.innerHTML = '';\n var tempaltecheck = this.templateCompiler(template);\n if (typeof template !== 'function' && tempaltecheck) {\n compiledString = compile(select(template, document).innerHTML.trim());\n }\n else {\n compiledString = compile(template);\n }\n var templateName = actionFailure ? 'actionFailureTemplate' : 'noRecordsTemplate';\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var noDataElement = void 0;\n if ((this.isReact) && typeof template === 'function') {\n noDataElement = compiledString({}, this, templateName, templateId, this.isStringTemplate, null);\n }\n else {\n noDataElement = compiledString({}, this, templateName, templateId, this.isStringTemplate, null, ele);\n }\n if (noDataElement && noDataElement.length > 0) {\n for (var i = 0; i < noDataElement.length; i++) {\n if (this.getModuleName() === 'listbox' && templateName === 'noRecordsTemplate') {\n if (noDataElement[i].nodeName === '#text') {\n var liElem = this.createElement('li');\n liElem.textContent = noDataElement[i].textContent;\n liElem.classList.add('e-list-nrt');\n liElem.setAttribute('role', 'option');\n ele.appendChild(liElem);\n }\n else {\n noDataElement[i].classList.add('e-list-nr-template');\n ele.appendChild(noDataElement[i]);\n }\n }\n else {\n if (noDataElement[i] instanceof HTMLElement || noDataElement[i] instanceof Text) {\n ele.appendChild(noDataElement[i]);\n }\n }\n }\n }\n this.renderReactTemplates();\n }\n else {\n var l10nLocale = { noRecordsTemplate: 'No records found', actionFailureTemplate: 'Request failed' };\n var componentLocale = new L10n(this.getLocaleName(), {}, this.locale);\n if (componentLocale.getConstant('actionFailureTemplate') !== '' || componentLocale.getConstant('noRecordsTemplate') !== '') {\n this.l10n = componentLocale;\n }\n else {\n this.l10n = new L10n(this.getModuleName() === 'listbox' ? 'listbox' :\n this.getModuleName() === 'mention' ? 'mention' : 'dropdowns', l10nLocale, this.locale);\n }\n var content = actionFailure ?\n this.l10n.getConstant('actionFailureTemplate') : this.l10n.getConstant('noRecordsTemplate');\n if (this.getModuleName() === 'listbox') {\n var liElem = this.createElement('li');\n liElem.textContent = content;\n ele.appendChild(liElem);\n liElem.classList.add('e-list-nrt');\n liElem.setAttribute('role', 'option');\n }\n else {\n if (!isNullOrUndefined(ele)) {\n ele.innerHTML = content;\n }\n }\n }\n };\n DropDownBase.prototype.checkAndResetCache = function () {\n if (this.isVirtualizationEnabled) {\n this.generatedDataObject = {};\n this.virtualItemStartIndex = this.virtualItemEndIndex = 0;\n this.viewPortInfo = {\n currentPageNumber: null,\n direction: null,\n sentinelInfo: {},\n offsets: {},\n startIndex: 0,\n endIndex: this.itemCount,\n };\n this.selectedValueInfo = null;\n }\n };\n DropDownBase.prototype.updateIncrementalInfo = function (startIndex, endIndex) {\n this.viewPortInfo.startIndex = startIndex;\n this.viewPortInfo.endIndex = endIndex;\n this.updateVirtualItemIndex();\n this.isIncrementalRequest = true;\n this.resetList(this.dataSource, this.fields, this.query);\n this.isIncrementalRequest = false;\n };\n DropDownBase.prototype.updateIncrementalView = function (startIndex, endIndex) {\n this.viewPortInfo.startIndex = startIndex;\n this.viewPortInfo.endIndex = endIndex;\n this.updateVirtualItemIndex();\n this.resetList(this.dataSource, this.fields, this.query);\n this.UpdateSkeleton();\n this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n this.ulElement = this.list.querySelector('ul');\n };\n DropDownBase.prototype.updateVirtualItemIndex = function () {\n this.virtualItemStartIndex = this.viewPortInfo.startIndex;\n this.virtualItemEndIndex = this.viewPortInfo.endIndex;\n this.virtualListInfo = this.viewPortInfo;\n };\n DropDownBase.prototype.getFilteringSkeletonCount = function () {\n var currentSkeletonCount = this.skeletonCount;\n this.getSkeletonCount(true);\n this.skeletonCount = this.dataCount > this.itemCount * 2 ? this.skeletonCount : 0;\n var skeletonUpdated = true;\n if ((this.getModuleName() === 'autocomplete' || this.getModuleName() === 'multiselect') && (this.totalItemCount < (this.itemCount * 2))) {\n this.skeletonCount = 0;\n skeletonUpdated = false;\n }\n if (!this.list.classList.contains(dropDownBaseClasses.noData)) {\n var isSkeletonCountChange = currentSkeletonCount !== this.skeletonCount;\n if (currentSkeletonCount !== this.skeletonCount && skeletonUpdated) {\n this.UpdateSkeleton(true, Math.abs(currentSkeletonCount - this.skeletonCount));\n }\n else {\n this.UpdateSkeleton();\n }\n this.liCollections = this.list.querySelectorAll('.e-list-item');\n if ((this.list.getElementsByClassName('e-virtual-ddl').length > 0)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl')[0].style = this.GetVirtualTrackHeight();\n }\n else if (!this.list.querySelector('.e-virtual-ddl') && this.skeletonCount > 0 && this.list.querySelector('.e-dropdownbase')) {\n var virualElement = this.createElement('div', {\n id: this.element.id + '_popup', className: 'e-virtual-ddl', styles: this.GetVirtualTrackHeight()\n });\n this.list.querySelector('.e-dropdownbase').appendChild(virualElement);\n }\n if (this.list.getElementsByClassName('e-virtual-ddl-content').length > 0) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = this.getTransformValues();\n }\n }\n };\n DropDownBase.prototype.getSkeletonCount = function (retainSkeleton) {\n this.virtualListHeight = this.listContainerHeight != null ? parseInt(this.listContainerHeight, 10) : this.virtualListHeight;\n var actualCount = this.virtualListHeight > 0 ? Math.floor(this.virtualListHeight / this.listItemHeight) : 0;\n this.skeletonCount = actualCount * 4 < this.itemCount ? this.itemCount : actualCount * 4;\n this.itemCount = retainSkeleton ? this.itemCount : this.skeletonCount;\n this.virtualItemCount = this.itemCount;\n this.skeletonCount = Math.floor(this.skeletonCount / 2);\n };\n DropDownBase.prototype.GetVirtualTrackHeight = function () {\n var height = this.totalItemCount === this.viewPortInfo.endIndex ? this.totalItemCount * this.listItemHeight - this.itemCount * this.listItemHeight : this.totalItemCount * this.listItemHeight;\n height = this.isVirtualTrackHeight ? 0 : height;\n var heightDimension = \"height: \" + (height - this.itemCount * this.listItemHeight) + \"px;\";\n if ((this.getModuleName() === 'autocomplete' || this.getModuleName() === 'multiselect') && this.skeletonCount === 0) {\n return \"height: 0px;\";\n }\n return heightDimension;\n };\n DropDownBase.prototype.getTransformValues = function () {\n var translateY = this.viewPortInfo.startIndex * this.listItemHeight;\n translateY = translateY - (this.skeletonCount * this.listItemHeight);\n translateY = this.viewPortInfo.startIndex === 0 && this.listData && this.listData.length === 0 ? 0 : translateY;\n var styleText = \"transform: translate(0px, \" + translateY + \"px);\";\n return styleText;\n };\n DropDownBase.prototype.UpdateSkeleton = function (isSkeletonCountChange, skeletonCount) {\n var isContainSkeleton = this.list.querySelector('.e-virtual-ddl-content');\n var isContainVirtualList = this.list.querySelector('.e-virtual-list');\n if (isContainSkeleton && (!isContainVirtualList || isSkeletonCountChange) && this.isVirtualizationEnabled) {\n var totalSkeletonCount = isSkeletonCountChange ? skeletonCount : this.skeletonCount;\n for (var i = 0; i < totalSkeletonCount; i++) {\n var liElement = this.createElement('li', { className: dropDownBaseClasses.virtualList, styles: 'overflow: inherit' });\n if (this.isVirtualizationEnabled && this.itemTemplate) {\n liElement.style.height = this.listItemHeight + 'px';\n }\n var skeleton = new Skeleton({\n shape: \"Text\",\n height: \"10px\",\n width: \"95%\",\n cssClass: \"e-skeleton-text\",\n });\n skeleton.appendTo(this.createElement('div'));\n liElement.appendChild(skeleton.element);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n isContainSkeleton.firstChild && isContainSkeleton.firstChild.insertBefore(liElement, isContainSkeleton.firstChild.children[0]);\n }\n }\n };\n DropDownBase.prototype.getLocaleName = function () {\n return 'drop-down-base';\n };\n DropDownBase.prototype.getTextByValue = function (value) {\n var text = this.checkValueCase(value, false, false, true);\n return text;\n };\n DropDownBase.prototype.getFormattedValue = function (value) {\n if (this.listData && this.listData.length) {\n var item = void 0;\n if (this.properties.allowCustomValue && this.properties.value && this.properties.value instanceof Array && this.properties.value.length > 0) {\n item = this.typeOfData(this.properties.value);\n }\n else {\n item = this.typeOfData(this.listData);\n }\n if (typeof getValue((this.fields.value ? this.fields.value : 'value'), item.item) === 'number'\n || item.typeof === 'number') {\n return parseFloat(value);\n }\n if (typeof getValue((this.fields.value ? this.fields.value : 'value'), item.item) === 'boolean'\n || item.typeof === 'boolean') {\n return ((value === 'true') || ('' + value === 'true'));\n }\n }\n return value;\n };\n /**\n * Sets RTL to dropdownbase wrapper\n *\n * @returns {void}\n */\n DropDownBase.prototype.setEnableRtl = function () {\n if (!isNullOrUndefined(this.enableRtlElements)) {\n if (this.list) {\n this.enableRtlElements.push(this.list);\n }\n if (this.enableRtl) {\n addClass(this.enableRtlElements, dropDownBaseClasses.rtl);\n }\n else {\n removeClass(this.enableRtlElements, dropDownBaseClasses.rtl);\n }\n }\n };\n /**\n * Initialize the Component.\n *\n * @returns {void}\n */\n DropDownBase.prototype.initialize = function (e) {\n this.bindEvent = true;\n this.preventPopupOpen = true;\n this.actionFailureTemplateId = \"\" + this.element.id + ACTIONFAILURETEMPLATE_PROPERTY;\n if (this.element.tagName === 'UL') {\n var jsonElement = ListBase.createJsonFromElement(this.element);\n this.setProperties({ fields: { text: 'text', value: 'text' } }, true);\n this.resetList(jsonElement, this.fields);\n }\n else if (this.element.tagName === 'SELECT') {\n var dataSource = this.dataSource instanceof Array ? (this.dataSource.length > 0 ? true : false)\n : !isNullOrUndefined(this.dataSource) ? true : false;\n if (!dataSource) {\n this.renderItemsBySelect();\n }\n else if (this.isDynamicDataChange) {\n this.setListData(this.dataSource, this.fields, this.query);\n }\n }\n else {\n this.setListData(this.dataSource, this.fields, this.query, e);\n }\n };\n /**\n * Get the properties to be maintained in persisted state.\n *\n * @returns {string} Returns the persisted data of the component.\n */\n DropDownBase.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Sets the enabled state to DropDownBase.\n *\n * @param {string} value - Specifies the attribute values to add on the input element.\n * @returns {void}\n */\n DropDownBase.prototype.updateDataAttribute = function (value) {\n var invalidAttr = ['class', 'style', 'id', 'type', 'aria-expanded', 'aria-autocomplete', 'aria-readonly'];\n var attr = {};\n for (var a = 0; a < this.element.attributes.length; a++) {\n if (invalidAttr.indexOf(this.element.attributes[a].name) === -1 &&\n !(this.getModuleName() === 'dropdownlist' && this.element.attributes[a].name === 'readonly')) {\n attr[this.element.attributes[a].name] = this.element.getAttribute(this.element.attributes[a].name);\n }\n }\n extend(attr, value, attr);\n this.setProperties({ htmlAttributes: attr }, true);\n };\n DropDownBase.prototype.renderItemsBySelect = function () {\n var element = this.element;\n var fields = { value: 'value', text: 'text' };\n var jsonElement = [];\n var group = element.querySelectorAll('select>optgroup');\n var option = element.querySelectorAll('select>option');\n this.getJSONfromOption(jsonElement, option, fields);\n if (group.length) {\n for (var i = 0; i < group.length; i++) {\n var item = group[i];\n var optionGroup = {};\n optionGroup[fields.text] = item.label;\n optionGroup.isHeader = true;\n var child = item.querySelectorAll('option');\n jsonElement.push(optionGroup);\n this.getJSONfromOption(jsonElement, child, fields);\n }\n element.querySelectorAll('select>option');\n }\n this.updateFields(fields.text, fields.value, this.fields.groupBy, this.fields.htmlAttributes, this.fields.iconCss);\n this.resetList(jsonElement, fields);\n };\n DropDownBase.prototype.updateFields = function (text, value, groupBy, htmlAttributes, iconCss) {\n var field = {\n 'fields': {\n text: text,\n value: value,\n groupBy: !isNullOrUndefined(groupBy) ? groupBy : this.fields && this.fields.groupBy,\n htmlAttributes: !isNullOrUndefined(htmlAttributes) ? htmlAttributes : this.fields && this.fields.htmlAttributes,\n iconCss: !isNullOrUndefined(iconCss) ? iconCss : this.fields && this.fields.iconCss\n }\n };\n this.setProperties(field, true);\n };\n DropDownBase.prototype.getJSONfromOption = function (items, options, fields) {\n for (var _i = 0, options_1 = options; _i < options_1.length; _i++) {\n var option = options_1[_i];\n var json = {};\n json[fields.text] = option.innerText;\n json[fields.value] = !isNullOrUndefined(option.getAttribute(fields.value)) ?\n option.getAttribute(fields.value) : option.innerText;\n items.push(json);\n }\n };\n /**\n * Execute before render the list items\n *\n * @private\n * @returns {void}\n */\n DropDownBase.prototype.preRender = function () {\n // there is no event handler\n this.scrollTimer = -1;\n this.enableRtlElements = [];\n this.isRequested = false;\n this.isDataFetched = false;\n this.itemTemplateId = \"\" + this.element.id + ITEMTEMPLATE_PROPERTY;\n this.displayTemplateId = \"\" + this.element.id + DISPLAYTEMPLATE_PROPERTY;\n this.spinnerTemplateId = \"\" + this.element.id + SPINNERTEMPLATE_PROPERTY;\n this.valueTemplateId = \"\" + this.element.id + VALUETEMPLATE_PROPERTY;\n this.groupTemplateId = \"\" + this.element.id + GROUPTEMPLATE_PROPERTY;\n this.headerTemplateId = \"\" + this.element.id + HEADERTEMPLATE_PROPERTY;\n this.footerTemplateId = \"\" + this.element.id + FOOTERTEMPLATE_PROPERTY;\n this.noRecordsTemplateId = \"\" + this.element.id + NORECORDSTEMPLATE_PROPERTY;\n };\n /**\n * Creates the list items of DropDownBase component.\n *\n * @param {Object[] | string[] | number[] | DataManager | boolean[]} dataSource - Specifies the data to generate the list.\n * @param {FieldSettingsModel} fields - Maps the columns of the data table and binds the data to the component.\n * @param {Query} query - Accepts the external Query that execute along with data processing.\n * @returns {void}\n */\n DropDownBase.prototype.setListData = function (dataSource, fields, query, event) {\n var _this = this;\n fields = fields ? fields : this.fields;\n var ulElement;\n this.isActive = true;\n var eventArgs = { cancel: false, data: dataSource, query: query };\n this.isPreventChange = this.isAngular && this.preventChange ? true : this.isPreventChange;\n if (!this.isRequesting) {\n this.trigger('actionBegin', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel) {\n _this.isRequesting = true;\n _this.showSpinner();\n if (dataSource instanceof DataManager) {\n _this.isRequested = true;\n var isWhereExist_1 = false;\n if (_this.isDataFetched) {\n _this.emptyDataRequest(fields);\n return;\n }\n eventArgs.data.executeQuery(_this.getQuery(eventArgs.query)).then(function (e) {\n _this.isPreventChange = _this.isAngular && _this.preventChange ? true : _this.isPreventChange;\n var isReOrder = true;\n if (!_this.virtualSelectAll) {\n var newQuery = _this.getQuery(eventArgs.query);\n for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {\n if (newQuery.queries[queryElements].fn === 'onWhere') {\n isWhereExist_1 = true;\n }\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (_this.isVirtualizationEnabled && (e.count != 0 && e.count < (_this.itemCount * 2))) {\n if (newQuery) {\n for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {\n if (newQuery.queries[queryElements].fn === 'onTake') {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n newQuery.queries[queryElements].e.nos = e.count;\n }\n if (_this.getModuleName() === 'multiselect' && (newQuery.queries[queryElements].e.condition == 'or' || newQuery.queries[queryElements].e.operator == 'equal')) {\n isReOrder = false;\n }\n }\n }\n }\n else {\n _this.isVirtualTrackHeight = false;\n if (newQuery) {\n for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {\n if (_this.getModuleName() === 'multiselect' && ((newQuery.queries[queryElements].e && newQuery.queries[queryElements].e.condition == 'or') || (newQuery.queries[queryElements].e && newQuery.queries[queryElements].e.operator == 'equal'))) {\n isReOrder = false;\n }\n }\n }\n }\n }\n if (isReOrder) {\n // eslint-disable @typescript-eslint/no-explicit-any\n _this.dataCount = _this.totalItemCount = e.count;\n }\n _this.trigger('actionComplete', e, function (e) {\n if (!e.cancel) {\n _this.isRequesting = false;\n var listItems = e.result;\n if (_this.isIncrementalRequest) {\n ulElement = _this.renderItems(listItems, fields);\n return;\n }\n if ((!_this.isVirtualizationEnabled && listItems.length === 0) || (_this.isVirtualizationEnabled && listItems.length === 0 && !isWhereExist_1)) {\n _this.isDataFetched = true;\n }\n if (!isWhereExist_1) {\n _this.remoteDataCount = e.count;\n }\n _this.dataCount = !_this.virtualSelectAll ? e.count : _this.dataCount;\n _this.totalItemCount = !_this.virtualSelectAll ? e.count : _this.totalItemCount;\n ulElement = _this.renderItems(listItems, fields);\n _this.appendUncheckList = false;\n _this.onActionComplete(ulElement, listItems, e);\n if (_this.groupTemplate) {\n _this.renderGroupTemplate(ulElement);\n }\n _this.isRequested = false;\n _this.bindChildItems(listItems, ulElement, fields, e);\n if (_this.getInitialData) {\n _this.setListData(dataSource, fields, query, event);\n _this.getInitialData = false;\n _this.preventPopupOpen = false;\n return;\n }\n if (_this.isVirtualizationEnabled && _this.setCurrentView) {\n _this.notify(\"setCurrentViewDataAsync\", {\n module: \"VirtualScroll\",\n });\n }\n if (_this.keyboardEvent != null) {\n _this.handleVirtualKeyboardActions(_this.keyboardEvent, _this.pageCount);\n }\n if (_this.isVirtualizationEnabled) {\n _this.getFilteringSkeletonCount();\n }\n if (_this.virtualSelectAll && _this.virtualSelectAllData) {\n _this.virtualSelectionAll(_this.virtualSelectAllState, _this.liCollections, _this.CurrentEvent);\n _this.virtualSelectAllState = false;\n _this.CurrentEvent = null;\n _this.virtualSelectAll = false;\n }\n }\n });\n }).catch(function (e) {\n _this.isRequested = false;\n _this.isRequesting = false;\n _this.onActionFailure(e);\n _this.hideSpinner();\n });\n }\n else {\n _this.isRequesting = false;\n var isReOrder = true;\n var listItems = void 0;\n if (_this.isVirtualizationEnabled && !_this.virtualGroupDataSource && _this.fields.groupBy) {\n var data = new DataManager(_this.dataSource).executeLocal(new Query().group(_this.fields.groupBy));\n _this.virtualGroupDataSource = data.records;\n }\n var dataManager = _this.isVirtualizationEnabled && _this.virtualGroupDataSource && !_this.isCustomDataUpdated ? new DataManager(_this.virtualGroupDataSource) : new DataManager(eventArgs.data);\n listItems = (_this.getQuery(eventArgs.query)).executeLocal(dataManager);\n if (!_this.virtualSelectAll) {\n var newQuery = _this.getQuery(eventArgs.query);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (_this.isVirtualizationEnabled && (listItems.count != 0 && listItems.count < (_this.itemCount * 2))) {\n if (newQuery) {\n for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {\n if (newQuery.queries[queryElements].fn === 'onTake') {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n newQuery.queries[queryElements].e.nos = listItems.count;\n listItems = (newQuery).executeLocal(dataManager);\n }\n if (_this.getModuleName() === 'multiselect' && (newQuery.queries[queryElements].e.condition == 'or' || newQuery.queries[queryElements].e.operator == 'equal')) {\n isReOrder = false;\n }\n }\n if (isReOrder) {\n listItems = (newQuery).executeLocal(dataManager);\n _this.isVirtualTrackHeight = (!(_this.dataSource instanceof DataManager) && !_this.isCustomDataUpdated) ? true : false;\n }\n }\n }\n else {\n _this.isVirtualTrackHeight = false;\n if (newQuery) {\n for (var queryElements = 0; queryElements < newQuery.queries.length; queryElements++) {\n if (_this.getModuleName() === 'multiselect' && ((newQuery.queries[queryElements].e && newQuery.queries[queryElements].e.condition == 'or') || (newQuery.queries[queryElements].e && newQuery.queries[queryElements].e.operator == 'equal'))) {\n isReOrder = false;\n }\n }\n }\n }\n }\n if (isReOrder && (!(_this.dataSource instanceof DataManager) && !_this.isCustomDataUpdated) && !_this.virtualSelectAll) {\n // eslint-disable @typescript-eslint/no-explicit-any\n _this.dataCount = _this.totalItemCount = _this.virtualSelectAll ? listItems.length : listItems.count;\n }\n listItems = _this.isVirtualizationEnabled ? listItems.result : listItems;\n // eslint-enable @typescript-eslint/no-explicit-any\n var localDataArgs = { cancel: false, result: listItems };\n _this.isPreventChange = _this.isAngular && _this.preventChange ? true : _this.isPreventChange;\n _this.trigger('actionComplete', localDataArgs, function (localDataArgs) {\n if (_this.isIncrementalRequest) {\n ulElement = _this.renderItems(localDataArgs.result, fields);\n return;\n }\n if (!localDataArgs.cancel) {\n ulElement = _this.renderItems(localDataArgs.result, fields);\n _this.onActionComplete(ulElement, localDataArgs.result, event);\n if (_this.groupTemplate) {\n _this.renderGroupTemplate(ulElement);\n }\n _this.bindChildItems(localDataArgs.result, ulElement, fields);\n if (_this.getInitialData) {\n _this.getInitialData = false;\n _this.preventPopupOpen = false;\n return;\n }\n setTimeout(function () {\n if (_this.getModuleName() === 'multiselect' && _this.itemTemplate != null && (ulElement.childElementCount > 0 && (ulElement.children[0].childElementCount > 0 || (_this.fields.groupBy && ulElement.children[1] && ulElement.children[1].childElementCount > 0)))) {\n _this.updateDataList();\n }\n });\n }\n });\n }\n }\n });\n }\n };\n DropDownBase.prototype.handleVirtualKeyboardActions = function (e, pageCount) {\n // Used this method in component side.\n };\n DropDownBase.prototype.updatePopupState = function () {\n // Used this method in component side.\n };\n DropDownBase.prototype.virtualSelectionAll = function (state, li, event) {\n // Used this method in component side.\n };\n DropDownBase.prototype.updateRemoteData = function () {\n this.setListData(this.dataSource, this.fields, this.query);\n };\n DropDownBase.prototype.bindChildItems = function (listItems, ulElement, fields, e) {\n var _this = this;\n if (listItems.length >= 100 && this.getModuleName() === 'autocomplete') {\n setTimeout(function () {\n var childNode = _this.remainingItems(_this.sortedData, fields);\n append(childNode, ulElement);\n _this.liCollections = _this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n _this.updateListValues();\n _this.raiseDataBound(listItems, e);\n }, 0);\n }\n else {\n this.raiseDataBound(listItems, e);\n }\n };\n DropDownBase.prototype.isObjectInArray = function (objectToFind, array) {\n return array.some(function (item) {\n return Object.keys(objectToFind).every(function (key) {\n return item.hasOwnProperty(key) && item[key] === objectToFind[key];\n });\n });\n };\n DropDownBase.prototype.updateListValues = function () {\n // Used this method in component side.\n };\n DropDownBase.prototype.findListElement = function (list, findNode, attribute, value) {\n var liElement = null;\n if (list) {\n var listArr = [].slice.call(list.querySelectorAll(findNode));\n for (var index = 0; index < listArr.length; index++) {\n if (listArr[index].getAttribute(attribute) === (value + '')) {\n liElement = listArr[index];\n break;\n }\n }\n }\n return liElement;\n };\n DropDownBase.prototype.raiseDataBound = function (listItems, e) {\n this.hideSpinner();\n var dataBoundEventArgs = {\n items: listItems,\n e: e\n };\n this.trigger('dataBound', dataBoundEventArgs);\n };\n DropDownBase.prototype.remainingItems = function (dataSource, fields) {\n var spliceData = new DataManager(dataSource).executeLocal(new Query().skip(100));\n if (this.itemTemplate) {\n var listElements = this.templateListItem(spliceData, fields);\n return [].slice.call(listElements.childNodes);\n }\n var type = this.typeOfData(spliceData).typeof;\n if (type === 'string' || type === 'number' || type === 'boolean') {\n return ListBase.createListItemFromArray(this.createElement, spliceData, true, this.listOption(spliceData, fields), this);\n }\n return ListBase.createListItemFromJson(this.createElement, spliceData, this.listOption(spliceData, fields), 1, true, this);\n };\n DropDownBase.prototype.emptyDataRequest = function (fields) {\n var listItems = [];\n this.onActionComplete(this.renderItems(listItems, fields), listItems);\n this.isRequested = false;\n this.isRequesting = false;\n this.hideSpinner();\n };\n DropDownBase.prototype.showSpinner = function () {\n // Used this method in component side.\n };\n DropDownBase.prototype.hideSpinner = function () {\n // Used this method in component side.\n };\n DropDownBase.prototype.onActionFailure = function (e) {\n this.liCollections = [];\n this.trigger('actionFailure', e);\n this.l10nUpdate(true);\n if (!isNullOrUndefined(this.list)) {\n addClass([this.list], dropDownBaseClasses.noData);\n }\n };\n /* eslint-disable @typescript-eslint/no-unused-vars */\n DropDownBase.prototype.onActionComplete = function (ulElement, list, e) {\n /* eslint-enable @typescript-eslint/no-unused-vars */\n this.listData = list;\n if (this.isVirtualizationEnabled && !this.isCustomDataUpdated && !this.virtualSelectAll) {\n this.notify(\"setGeneratedData\", {\n module: \"VirtualScroll\",\n });\n }\n if (this.getModuleName() !== 'listbox') {\n ulElement.setAttribute('tabindex', '0');\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isReact) {\n this.clearTemplate(['itemTemplate', 'groupTemplate', 'actionFailureTemplate', 'noRecordsTemplate']);\n }\n if (!this.isVirtualizationEnabled) {\n this.fixedHeaderElement = isNullOrUndefined(this.fixedHeaderElement) ? this.fixedHeaderElement : null;\n }\n if (this.getModuleName() === 'multiselect' && this.properties.allowCustomValue && this.fields.groupBy) {\n for (var i = 0; i < ulElement.childElementCount; i++) {\n if (ulElement.children[i].classList.contains('e-list-group-item')) {\n if (isNullOrUndefined(ulElement.children[i].innerHTML) || ulElement.children[i].innerHTML == \"\") {\n addClass([ulElement.children[i]], HIDE_GROUPLIST);\n }\n }\n if (ulElement.children[0].classList.contains('e-hide-group-header')) {\n setStyleAttribute(ulElement.children[1], { zIndex: 11 });\n }\n }\n }\n if (!isNullOrUndefined(this.list)) {\n if (!this.isVirtualizationEnabled) {\n this.list.innerHTML = '';\n this.list.appendChild(ulElement);\n this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n this.ulElement = this.list.querySelector('ul');\n this.postRender(this.list, list, this.bindEvent);\n }\n }\n };\n /* eslint-disable @typescript-eslint/no-unused-vars */\n DropDownBase.prototype.postRender = function (listElement, list, bindEvent) {\n /* eslint-enable @typescript-eslint/no-unused-vars */\n var focusItem = listElement.querySelector('.' + dropDownBaseClasses.li);\n var selectedItem = listElement.querySelector('.' + dropDownBaseClasses.selected);\n if (focusItem && !selectedItem) {\n focusItem.classList.add(dropDownBaseClasses.focus);\n }\n if (list.length <= 0) {\n this.l10nUpdate();\n addClass([listElement], dropDownBaseClasses.noData);\n }\n else {\n listElement.classList.remove(dropDownBaseClasses.noData);\n }\n };\n /**\n * Get the query to do the data operation before list item generation.\n *\n * @param {Query} query - Accepts the external Query that execute along with data processing.\n * @returns {Query} Returns the query to do the data query operation.\n */\n DropDownBase.prototype.getQuery = function (query) {\n return query ? query : this.query ? this.query : new Query();\n };\n DropDownBase.prototype.updateVirtualizationProperties = function (itemCount, filtering, isCheckbox) {\n this.isVirtualizationEnabled = true;\n this.virtualizedItemsCount = itemCount;\n this.isAllowFiltering = filtering;\n this.isCheckBoxSelection = isCheckbox;\n };\n /**\n * To render the template content for group header element.\n *\n * @param {HTMLElement} listEle - Specifies the group list elements.\n * @returns {void}\n */\n DropDownBase.prototype.renderGroupTemplate = function (listEle) {\n if (this.fields.groupBy !== null && this.dataSource || this.element.querySelector('.' + dropDownBaseClasses.group)) {\n var dataSource = this.dataSource;\n var option = { groupTemplateID: this.groupTemplateId, isStringTemplate: this.isStringTemplate };\n var headerItems = listEle.querySelectorAll('.' + dropDownBaseClasses.group);\n var groupcheck = this.templateCompiler(this.groupTemplate);\n if (typeof this.groupTemplate !== 'function' && groupcheck) {\n var groupValue = select(this.groupTemplate, document).innerHTML.trim();\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n var tempHeaders = ListBase.renderGroupTemplate(groupValue, dataSource, this.fields.properties, headerItems, option, this);\n //EJ2-55168- Group checkbox is not working with group template\n if (this.isGroupChecking) {\n for (var i = 0; i < tempHeaders.length; i++) {\n this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });\n }\n }\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n var tempHeaders = ListBase.renderGroupTemplate(this.groupTemplate, dataSource, this.fields.properties, headerItems, option, this);\n //EJ2-55168- Group checkbox is not working with group template\n if (this.isGroupChecking) {\n for (var i = 0; i < tempHeaders.length; i++) {\n this.notify('addItem', { module: 'CheckBoxSelection', item: tempHeaders[i] });\n }\n }\n }\n this.renderReactTemplates();\n }\n };\n /**\n * To create the ul li list items\n *\n * @param {object []} dataSource - Specifies the data to generate the list.\n * @param {FieldSettingsModel} fields - Maps the columns of the data table and binds the data to the component.\n * @returns {HTMLElement} Return the ul li list items.\n */\n DropDownBase.prototype.createListItems = function (dataSource, fields) {\n if (dataSource) {\n if (fields.groupBy || this.element.querySelector('optgroup')) {\n if (fields.groupBy) {\n if (this.sortOrder !== 'None') {\n dataSource = this.getSortedDataSource(dataSource);\n }\n dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);\n }\n addClass([this.list], dropDownBaseClasses.grouping);\n }\n else {\n dataSource = this.getSortedDataSource(dataSource);\n }\n var options = this.listOption(dataSource, fields);\n var spliceData = (dataSource.length > 100) ?\n new DataManager(dataSource).executeLocal(new Query().take(100))\n : dataSource;\n this.sortedData = dataSource;\n return ListBase.createList(this.createElement, (this.getModuleName() === 'autocomplete') ? spliceData : dataSource, options, true, this);\n }\n return null;\n };\n DropDownBase.prototype.listOption = function (dataSource, fields) {\n var iconCss = isNullOrUndefined(fields.iconCss) ? false : true;\n var fieldValues = !isNullOrUndefined(fields.properties) ?\n fields.properties : fields;\n var options = (fields.text !== null || fields.value !== null) ? {\n fields: fieldValues,\n showIcon: iconCss, ariaAttributes: { groupItemRole: 'presentation' }\n } : { fields: { value: 'text' } };\n return extend({}, options, fields, true);\n };\n DropDownBase.prototype.setFloatingHeader = function (e) {\n if (!isNullOrUndefined(this.list) && !this.list.classList.contains(dropDownBaseClasses.noData)) {\n if (isNullOrUndefined(this.fixedHeaderElement)) {\n this.fixedHeaderElement = this.createElement('div', { className: dropDownBaseClasses.fixedHead });\n if (!isNullOrUndefined(this.list) && !this.list.querySelector('li').classList.contains(dropDownBaseClasses.group)) {\n this.fixedHeaderElement.style.display = 'none';\n }\n if (!isNullOrUndefined(this.fixedHeaderElement) && !isNullOrUndefined(this.list)) {\n prepend([this.fixedHeaderElement], this.list);\n }\n this.setFixedHeader();\n }\n if (!isNullOrUndefined(this.fixedHeaderElement) && this.fixedHeaderElement.style.zIndex === '0') {\n this.setFixedHeader();\n }\n this.scrollStop(e);\n }\n };\n DropDownBase.prototype.scrollStop = function (e, isDownkey) {\n var target = !isNullOrUndefined(e) ? e.target : this.list;\n var liHeight = parseInt(getComputedStyle(this.getValidLi(), null).getPropertyValue('height'), 10);\n var topIndex = Math.round(target.scrollTop / liHeight);\n var liCollections = this.list.querySelectorAll('li' + ':not(.e-hide-listitem)');\n var virtualListCount = this.list.querySelectorAll('.e-virtual-list').length;\n var count = 0;\n var isCount = false;\n for (var i = topIndex; i > -1; i--) {\n var index = this.isVirtualizationEnabled ? i + virtualListCount : i;\n if (this.isVirtualizationEnabled) {\n if (isCount) {\n count++;\n }\n if (this.fixedHeaderElement && this.updateGroupHeader(index, liCollections, target)) {\n break;\n }\n if (isDownkey) {\n if ((!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.selected) && this.getModuleName() !== 'autocomplete') || (!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.focus) && this.getModuleName() === 'autocomplete')) {\n count++;\n isCount = true;\n }\n }\n }\n else {\n if (this.updateGroupHeader(index, liCollections, target)) {\n break;\n }\n }\n }\n };\n DropDownBase.prototype.getPageCount = function (returnExactCount) {\n var liHeight = this.list.classList.contains(dropDownBaseClasses.noData) ? null :\n getComputedStyle(this.getItems()[0], null).getPropertyValue('height');\n var pageCount = Math.round(this.list.getBoundingClientRect().height / parseInt(liHeight, 10));\n return returnExactCount ? pageCount : Math.round(pageCount);\n };\n DropDownBase.prototype.updateGroupHeader = function (index, liCollections, target) {\n if (!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.group)) {\n this.updateGroupFixedHeader(liCollections[index], target);\n return true;\n }\n else {\n this.fixedHeaderElement.style.display = 'none';\n this.fixedHeaderElement.style.top = 'none';\n return false;\n }\n };\n DropDownBase.prototype.updateGroupFixedHeader = function (element, target) {\n if (this.fixedHeaderElement) {\n if (!isNullOrUndefined(element.innerHTML)) {\n this.fixedHeaderElement.innerHTML = element.innerHTML;\n }\n this.fixedHeaderElement.style.position = 'fixed';\n this.fixedHeaderElement.style.top = (this.list.parentElement.offsetTop + this.list.offsetTop) - window.scrollY + 'px';\n this.fixedHeaderElement.style.display = 'block';\n }\n };\n DropDownBase.prototype.getValidLi = function () {\n if (this.isVirtualizationEnabled) {\n return this.liCollections[0].classList.contains('e-virtual-list') ? this.liCollections[this.skeletonCount] : this.liCollections[0];\n }\n return this.liCollections[0];\n };\n /**\n * To render the list items\n *\n * @param {object[]} listData - Specifies the list of array of data.\n * @param {FieldSettingsModel} fields - Maps the columns of the data table and binds the data to the component.\n * @returns {HTMLElement} Return the list items.\n */\n DropDownBase.prototype.renderItems = function (listData, fields, isCheckBoxUpdate) {\n var ulElement;\n if (this.itemTemplate && listData) {\n var dataSource = listData;\n if (dataSource && fields.groupBy) {\n if (this.sortOrder !== 'None') {\n dataSource = this.getSortedDataSource(dataSource);\n }\n dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);\n }\n else {\n dataSource = this.getSortedDataSource(dataSource);\n }\n this.sortedData = dataSource;\n var spliceData = (dataSource.length > 100) ?\n new DataManager(dataSource).executeLocal(new Query().take(100))\n : dataSource;\n ulElement = this.templateListItem((this.getModuleName() === 'autocomplete') ? spliceData : dataSource, fields);\n if (this.isVirtualizationEnabled) {\n var oldUlElement = this.list.querySelector('.e-list-parent');\n var virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');\n if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {\n virtualUlElement.replaceChild(ulElement, oldUlElement);\n var reOrderList = this.list.querySelectorAll('.e-reorder');\n if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {\n this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);\n }\n this.updateListElements(listData);\n }\n else if ((!virtualUlElement)) {\n this.list.innerHTML = '';\n this.createVirtualContent();\n this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);\n this.updateListElements(listData);\n }\n }\n }\n else {\n if (this.getModuleName() === 'multiselect' && this.virtualSelectAll) {\n this.virtualSelectAllData = listData;\n listData = listData.slice(this.virtualItemStartIndex, this.virtualItemEndIndex);\n }\n ulElement = this.createListItems(listData, fields);\n if (this.isIncrementalRequest) {\n this.incrementalLiCollections = ulElement.querySelectorAll('.' + dropDownBaseClasses.li);\n this.incrementalUlElement = ulElement;\n this.incrementalListData = listData;\n return ulElement;\n }\n if (this.isVirtualizationEnabled) {\n var oldUlElement = this.list.querySelector('.e-list-parent' + ':not(.e-reorder)');\n var virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');\n var isRemovedUlelement = false;\n if (!oldUlElement && this.list.querySelector('.e-list-parent' + '.e-reorder')) {\n oldUlElement = this.list.querySelector('.e-list-parent' + '.e-reorder');\n }\n if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && (this.getModuleName() === 'autocomplete' || this.getModuleName() === 'multiselect')) || isRemovedUlelement) {\n if (!this.appendUncheckList) {\n virtualUlElement.replaceChild(ulElement, oldUlElement);\n }\n else {\n virtualUlElement.appendChild(ulElement);\n }\n this.updateListElements(listData);\n }\n else if ((!virtualUlElement) || (!virtualUlElement.firstChild)) {\n this.list.innerHTML = '';\n this.createVirtualContent();\n this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);\n this.updateListElements(listData);\n }\n }\n }\n return ulElement;\n };\n DropDownBase.prototype.createVirtualContent = function () {\n if (!this.list.querySelector('.e-virtual-ddl-content')) {\n this.list.appendChild(this.createElement('div', {\n className: 'e-virtual-ddl-content',\n }));\n }\n };\n DropDownBase.prototype.updateListElements = function (listData) {\n this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n this.ulElement = this.list.querySelector('ul');\n this.listData = listData;\n this.postRender(this.list, listData, this.bindEvent);\n };\n DropDownBase.prototype.templateListItem = function (dataSource, fields) {\n var option = this.listOption(dataSource, fields);\n option.templateID = this.itemTemplateId;\n option.isStringTemplate = this.isStringTemplate;\n var itemcheck = this.templateCompiler(this.itemTemplate);\n if (typeof this.itemTemplate !== 'function' && itemcheck) {\n var itemValue = select(this.itemTemplate, document).innerHTML.trim();\n return ListBase.renderContentTemplate(this.createElement, itemValue, dataSource, fields.properties, option, this);\n }\n else {\n return ListBase.renderContentTemplate(this.createElement, this.itemTemplate, dataSource, fields.properties, option, this);\n }\n };\n DropDownBase.prototype.typeOfData = function (items) {\n var item = { typeof: null, item: null };\n for (var i = 0; (!isNullOrUndefined(items) && i < items.length); i++) {\n if (!isNullOrUndefined(items[i])) {\n var listDataType = typeof (items[i]) === 'string' ||\n typeof (items[i]) === 'number' || typeof (items[i]) === 'boolean';\n var isNullData = listDataType ? isNullOrUndefined(items[i]) :\n isNullOrUndefined(getValue((this.fields.value ? this.fields.value : 'value'), items[i]));\n if (!isNullData) {\n return item = { typeof: typeof items[i], item: items[i] };\n }\n }\n }\n return item;\n };\n DropDownBase.prototype.setFixedHeader = function () {\n if (!isNullOrUndefined(this.list)) {\n this.list.parentElement.style.display = 'block';\n }\n var borderWidth = 0;\n if (this.list && this.list.parentElement) {\n borderWidth = parseInt(document.defaultView.getComputedStyle(this.list.parentElement, null).getPropertyValue('border-width'), 10);\n /*Shorthand property not working in Firefox for getComputedStyle method.\n Refer bug report https://bugzilla.mozilla.org/show_bug.cgi?id=137688\n Refer alternate solution https://stackoverflow.com/a/41696234/9133493*/\n if (isNaN(borderWidth)) {\n var borderTopWidth = parseInt(document.defaultView.getComputedStyle(this.list.parentElement, null).getPropertyValue('border-top-width'), 10);\n var borderBottomWidth = parseInt(document.defaultView.getComputedStyle(this.list.parentElement, null).getPropertyValue('border-bottom-width'), 10);\n var borderLeftWidth = parseInt(document.defaultView.getComputedStyle(this.list.parentElement, null).getPropertyValue('border-left-width'), 10);\n var borderRightWidth = parseInt(document.defaultView.getComputedStyle(this.list.parentElement, null).getPropertyValue('border-right-width'), 10);\n borderWidth = (borderTopWidth + borderBottomWidth + borderLeftWidth + borderRightWidth);\n }\n }\n if (!isNullOrUndefined(this.liCollections)) {\n var liWidth = this.getValidLi().offsetWidth - borderWidth;\n this.fixedHeaderElement.style.width = liWidth.toString() + 'px';\n }\n setStyleAttribute(this.fixedHeaderElement, { zIndex: 10 });\n var firstLi = this.ulElement.querySelector('.' + dropDownBaseClasses.group + ':not(.e-hide-listitem)');\n this.fixedHeaderElement.innerHTML = firstLi.innerHTML;\n };\n DropDownBase.prototype.getSortedDataSource = function (dataSource) {\n if (dataSource && this.sortOrder !== 'None') {\n var textField = this.fields.text ? this.fields.text : 'text';\n if (this.typeOfData(dataSource).typeof === 'string' || this.typeOfData(dataSource).typeof === 'number'\n || this.typeOfData(dataSource).typeof === 'boolean') {\n textField = '';\n }\n dataSource = ListBase.getDataSource(dataSource, ListBase.addSorting(this.sortOrder, textField));\n }\n return dataSource;\n };\n /**\n * Return the index of item which matched with given value in data source\n *\n * @param {string | number | boolean} value - Specifies given value.\n * @returns {number} Returns the index of the item.\n */\n DropDownBase.prototype.getIndexByValue = function (value) {\n var index;\n var listItems = this.getItems();\n for (var i = 0; i < listItems.length; i++) {\n if (!isNullOrUndefined(value) && listItems[i].getAttribute('data-value') === value.toString()) {\n index = i;\n break;\n }\n }\n return index;\n };\n /**\n * Return the index of item which matched with given value in data source\n *\n * @param {string | number | boolean} value - Specifies given value.\n * @returns {number} Returns the index of the item.\n */\n DropDownBase.prototype.getIndexByValueFilter = function (value, ulElement) {\n var index;\n if (!ulElement) {\n return null;\n }\n var listItems = ulElement.querySelectorAll('li' + ':not(.e-list-group-item)');\n if (listItems) {\n for (var i = 0; i < listItems.length; i++) {\n if (!isNullOrUndefined(value) && listItems[i].getAttribute('data-value') === value.toString()) {\n index = i;\n break;\n }\n }\n }\n return index;\n };\n /**\n * To dispatch the event manually\n *\n * @param {HTMLElement} element - Specifies the element to dispatch the event.\n * @param {string} type - Specifies the name of the event.\n * @returns {void}\n */\n DropDownBase.prototype.dispatchEvent = function (element, type) {\n var evt = document.createEvent('HTMLEvents');\n evt.initEvent(type, false, true);\n if (element) {\n element.dispatchEvent(evt);\n }\n };\n /**\n * To set the current fields\n *\n * @returns {void}\n */\n DropDownBase.prototype.setFields = function () {\n if (this.fields.value && !this.fields.text) {\n this.updateFields(this.fields.value, this.fields.value);\n }\n else if (!this.fields.value && this.fields.text) {\n this.updateFields(this.fields.text, this.fields.text);\n }\n else if (!this.fields.value && !this.fields.text) {\n this.updateFields('text', 'text');\n }\n };\n /**\n * reset the items list.\n *\n * @param {Object[] | string[] | number[] | DataManager | boolean[]} dataSource - Specifies the data to generate the list.\n * @param {FieldSettingsModel} fields - Maps the columns of the data table and binds the data to the component.\n * @param {Query} query - Accepts the external Query that execute along with data processing.\n * @returns {void}\n */\n DropDownBase.prototype.resetList = function (dataSource, fields, query, e) {\n if (this.list) {\n if ((this.element.tagName === 'SELECT' && this.element.options.length > 0)\n || (this.element.tagName === 'UL' && this.element.childNodes.length > 0)) {\n var data = dataSource instanceof Array ? (dataSource.length > 0)\n : !isNullOrUndefined(dataSource);\n if (!data && this.selectData && this.selectData.length > 0) {\n dataSource = this.selectData;\n }\n }\n dataSource = this.getModuleName() === 'combobox' && this.selectData && dataSource instanceof Array && dataSource.length < this.selectData.length && this.addedNewItem ? this.selectData : dataSource;\n this.addedNewItem = false;\n this.setListData(dataSource, fields, query, e);\n }\n };\n DropDownBase.prototype.updateSelectElementData = function (isFiltering) {\n if ((isFiltering || this.isVirtualizationEnabled) && isNullOrUndefined(this.selectData) && this.listData && this.listData.length > 0) {\n this.selectData = this.listData;\n }\n };\n DropDownBase.prototype.updateSelection = function () {\n // This is for after added the item, need to update the selected index values.\n };\n DropDownBase.prototype.renderList = function () {\n // This is for render the list items.\n this.render();\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DropDownBase.prototype.updateDataSource = function (props, oldProps) {\n this.resetList(this.dataSource);\n this.totalItemCount = this.dataSource instanceof DataManager ? this.dataSource.dataSource.json.length : 0;\n };\n DropDownBase.prototype.setUpdateInitial = function (props, newProp, oldProp) {\n this.isDataFetched = false;\n var updateData = {};\n for (var j = 0; props.length > j; j++) {\n if (newProp[props[j]] && props[j] === 'fields') {\n this.setFields();\n updateData[props[j]] = newProp[props[j]];\n }\n else if (newProp[props[j]]) {\n updateData[props[j]] = newProp[props[j]];\n }\n }\n if (Object.keys(updateData).length > 0) {\n if (Object.keys(updateData).indexOf('dataSource') === -1) {\n updateData.dataSource = this.dataSource;\n }\n this.updateDataSource(updateData, oldProp);\n }\n };\n /**\n * When property value changes happened, then onPropertyChanged method will execute the respective changes in this component.\n *\n * @param {DropDownBaseModel} newProp - Returns the dynamic property value of the component.\n * @param {DropDownBaseModel} oldProp - Returns the previous property value of the component.\n * @private\n * @returns {void}\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DropDownBase.prototype.onPropertyChanged = function (newProp, oldProp) {\n if (this.getModuleName() === 'dropdownbase') {\n this.setUpdateInitial(['fields', 'query', 'dataSource'], newProp);\n }\n this.setUpdateInitial(['sortOrder', 'itemTemplate'], newProp);\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'query':\n case 'sortOrder':\n case 'dataSource':\n case 'itemTemplate':\n break;\n case 'enableRtl':\n this.setEnableRtl();\n break;\n case 'groupTemplate':\n this.renderGroupTemplate(this.list);\n if (this.ulElement && this.fixedHeaderElement) {\n var firstLi = this.ulElement.querySelector('.' + dropDownBaseClasses.group);\n this.fixedHeaderElement.innerHTML = firstLi.innerHTML;\n }\n break;\n case 'locale':\n if (this.list && (!isNullOrUndefined(this.liCollections) && this.liCollections.length === 0)) {\n this.l10nUpdate();\n }\n break;\n case 'zIndex':\n this.setProperties({ zIndex: newProp.zIndex }, true);\n this.setZIndex();\n break;\n }\n }\n };\n /**\n * Build and render the component\n *\n * @param {boolean} isEmptyData - Specifies the component to initialize with list data or not.\n * @private\n * @returns {void}\n */\n DropDownBase.prototype.render = function (e, isEmptyData) {\n if (this.getModuleName() === 'listbox') {\n this.list = this.createElement('div', { className: dropDownBaseClasses.content, attrs: { 'tabindex': '0' } });\n }\n else {\n this.list = this.createElement('div', { className: dropDownBaseClasses.content });\n }\n this.list.classList.add(dropDownBaseClasses.root);\n this.setFields();\n var rippleModel = { duration: 300, selector: '.' + dropDownBaseClasses.li };\n this.rippleFun = rippleEffect(this.list, rippleModel);\n var group = this.element.querySelector('select>optgroup');\n if ((this.fields.groupBy || !isNullOrUndefined(group)) && !this.isGroupChecking) {\n EventHandler.add(this.list, 'scroll', this.setFloatingHeader, this);\n EventHandler.add(document, 'scroll', this.updateGroupFixedHeader, this);\n }\n if (this.getModuleName() === 'dropdownbase') {\n if (this.element.getAttribute('tabindex')) {\n this.list.setAttribute('tabindex', this.element.getAttribute('tabindex'));\n }\n removeClass([this.element], dropDownBaseClasses.root);\n this.element.style.display = 'none';\n var wrapperElement = this.createElement('div');\n this.element.parentElement.insertBefore(wrapperElement, this.element);\n wrapperElement.appendChild(this.element);\n wrapperElement.appendChild(this.list);\n }\n this.setEnableRtl();\n if (!isEmptyData) {\n this.initialize(e);\n }\n };\n DropDownBase.prototype.removeScrollEvent = function () {\n if (this.list) {\n EventHandler.remove(this.list, 'scroll', this.setFloatingHeader);\n }\n };\n /**\n * Return the module name of this component.\n *\n * @private\n * @returns {string} Return the module name of this component.\n */\n DropDownBase.prototype.getModuleName = function () {\n return 'dropdownbase';\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets all the list items bound on this component.\n *\n * @returns {Element[]}\n */\n DropDownBase.prototype.getItems = function () {\n return this.ulElement.querySelectorAll('.' + dropDownBaseClasses.li);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Adds a new item to the popup list. By default, new item appends to the list as the last item,\n * but you can insert based on the index parameter.\n *\n * @param { Object[] } items - Specifies an array of JSON data or a JSON data.\n * @param { number } itemIndex - Specifies the index to place the newly added item in the popup list.\n * @returns {void}\n\n */\n DropDownBase.prototype.addItem = function (items, itemIndex) {\n if (!this.list || (this.list.textContent === this.noRecordsTemplate && this.getModuleName() !== 'listbox')) {\n this.renderList();\n }\n if (this.sortOrder !== 'None' && isNullOrUndefined(itemIndex)) {\n var newList = [].slice.call(this.listData);\n newList.push(items);\n newList = this.getSortedDataSource(newList);\n if (this.fields.groupBy) {\n newList = ListBase.groupDataSource(newList, this.fields.properties, this.sortOrder);\n itemIndex = newList.indexOf(items);\n }\n else {\n itemIndex = newList.indexOf(items);\n }\n }\n var itemsCount = this.getItems().length;\n var isListboxEmpty = itemsCount === 0;\n var selectedItemValue = this.list.querySelector('.' + dropDownBaseClasses.selected);\n items = (items instanceof Array ? items : [items]);\n var index;\n index = (isNullOrUndefined(itemIndex) || itemIndex < 0 || itemIndex > itemsCount - 1) ? itemsCount : itemIndex;\n var fields = this.fields;\n if (items && fields.groupBy) {\n items = ListBase.groupDataSource(items, fields.properties);\n }\n var liCollections = [];\n for (var i = 0; i < items.length; i++) {\n var item = items[i];\n var isHeader = item.isHeader;\n var li = this.createElement('li', { className: isHeader ? dropDownBaseClasses.group : dropDownBaseClasses.li, id: 'option-add-' + i });\n var itemText = item instanceof Object ? getValue(fields.text, item) : item;\n if (isHeader) {\n li.innerText = itemText;\n }\n if (this.itemTemplate && !isHeader) {\n var itemCheck = this.templateCompiler(this.itemTemplate);\n var compiledString = typeof this.itemTemplate !== 'function' &&\n itemCheck ? compile(select(this.itemTemplate, document).innerHTML.trim()) : compile(this.itemTemplate);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var addItemTemplate = compiledString(item, this, 'itemTemplate', this.itemTemplateId, this.isStringTemplate, null, li);\n if (addItemTemplate) {\n append(addItemTemplate, li);\n }\n }\n else if (!isHeader) {\n li.appendChild(document.createTextNode(itemText));\n }\n li.setAttribute('data-value', item instanceof Object ? getValue(fields.value, item) : item);\n li.setAttribute('role', 'option');\n this.notify('addItem', { module: 'CheckBoxSelection', item: li });\n liCollections.push(li);\n if (this.getModuleName() === 'listbox') {\n this.listData.splice(isListboxEmpty ? this.listData.length : index, 0, item);\n if (this.listData.length !== this.sortedData.length) {\n this.sortedData = this.listData;\n }\n }\n else {\n this.listData.push(item);\n }\n if (this.sortOrder === 'None' && isNullOrUndefined(itemIndex) && index === 0) {\n index = null;\n }\n if (this.getModuleName() === 'listbox') {\n this.updateActionCompleteData(li, item, isListboxEmpty ? null : index);\n isListboxEmpty = true;\n }\n else {\n this.updateActionCompleteData(li, item, index);\n }\n //Listbox event\n this.trigger('beforeItemRender', { element: li, item: item });\n }\n if (itemsCount === 0 && isNullOrUndefined(this.list.querySelector('ul'))) {\n if (!isNullOrUndefined(this.list)) {\n this.list.innerHTML = '';\n this.list.classList.remove(dropDownBaseClasses.noData);\n this.isAddNewItemTemplate = true;\n if (!isNullOrUndefined(this.ulElement)) {\n this.list.appendChild(this.ulElement);\n }\n }\n this.liCollections = liCollections;\n if (!isNullOrUndefined(liCollections) && !isNullOrUndefined(this.ulElement)) {\n append(liCollections, this.ulElement);\n }\n this.updateAddItemList(this.list, itemsCount);\n }\n else {\n if (this.getModuleName() === 'listbox' && itemsCount === 0) {\n this.ulElement.innerHTML = '';\n }\n var attr = [];\n for (var i = 0; i < items.length; i++) {\n var listGroupItem = this.ulElement.querySelectorAll('.e-list-group-item');\n for (var j = 0; j < listGroupItem.length; j++) {\n attr[j] = listGroupItem[j].innerText;\n }\n if (attr.indexOf(liCollections[i].innerText) > -1 && fields.groupBy) {\n for (var j = 0; j < listGroupItem.length; j++) {\n if (attr[j] === liCollections[i].innerText) {\n if (this.sortOrder === 'None') {\n this.ulElement.insertBefore(liCollections[i + 1], listGroupItem[j + 1]);\n }\n else {\n this.ulElement.insertBefore(liCollections[i + 1], this.ulElement.childNodes[itemIndex]);\n }\n i = i + 1;\n break;\n }\n }\n }\n else {\n if (this.liCollections[index] && this.liCollections[index].parentNode) {\n this.liCollections[index].parentNode.insertBefore(liCollections[i], this.liCollections[index]);\n }\n else {\n this.ulElement.appendChild(liCollections[i]);\n }\n }\n var tempLi = [].slice.call(this.liCollections);\n tempLi.splice(index, 0, liCollections[i]);\n this.liCollections = tempLi;\n index += 1;\n if (this.getModuleName() === 'multiselect') {\n this.updateDataList();\n }\n }\n }\n if (this.getModuleName() === 'listbox' && this.isReact) {\n this.renderReactTemplates();\n }\n if (selectedItemValue || itemIndex === 0) {\n this.updateSelection();\n }\n this.addedNewItem = true;\n };\n DropDownBase.prototype.validationAttribute = function (target, hidden) {\n var name = target.getAttribute('name') ? target.getAttribute('name') : target.getAttribute('id');\n hidden.setAttribute('name', name);\n target.removeAttribute('name');\n var attributes = ['required', 'aria-required', 'form'];\n for (var i = 0; i < attributes.length; i++) {\n if (!target.getAttribute(attributes[i])) {\n continue;\n }\n var attr = target.getAttribute(attributes[i]);\n hidden.setAttribute(attributes[i], attr);\n target.removeAttribute(attributes[i]);\n }\n };\n DropDownBase.prototype.setZIndex = function () {\n // this is for component wise\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DropDownBase.prototype.updateActionCompleteData = function (li, item, index) {\n // this is for ComboBox custom value\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DropDownBase.prototype.updateAddItemList = function (list, itemCount) {\n // this is for multiselect add item\n };\n DropDownBase.prototype.updateDataList = function () {\n // this is for multiselect update list items\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the data Object that matches the given value.\n *\n * @param { string | number } value - Specifies the value of the list item.\n * @returns {Object}\n */\n DropDownBase.prototype.getDataByValue = function (value) {\n if (!isNullOrUndefined(this.listData)) {\n var type = this.typeOfData(this.listData).typeof;\n if (type === 'string' || type === 'number' || type === 'boolean') {\n for (var _i = 0, _a = this.listData; _i < _a.length; _i++) {\n var item = _a[_i];\n if (!isNullOrUndefined(item) && item === value) {\n return item;\n }\n }\n }\n else {\n for (var _b = 0, _c = this.listData; _b < _c.length; _b++) {\n var item = _c[_b];\n if (!isNullOrUndefined(item) && getValue((this.fields.value ? this.fields.value : 'value'), item) === value) {\n return item;\n }\n }\n }\n }\n return null;\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Removes the component from the DOM and detaches all its related event handlers. It also removes the attributes and classes.\n *\n * @method destroy\n * @returns {void}\n */\n DropDownBase.prototype.destroy = function () {\n if (document) {\n EventHandler.remove(document, 'scroll', this.updateGroupFixedHeader);\n if (document.body.contains(this.list)) {\n EventHandler.remove(this.list, 'scroll', this.setFloatingHeader);\n if (!isNullOrUndefined(this.rippleFun)) {\n this.rippleFun();\n }\n detach(this.list);\n }\n }\n this.liCollections = null;\n this.ulElement = null;\n this.list = null;\n this.enableRtlElements = null;\n this.rippleFun = null;\n _super.prototype.destroy.call(this);\n };\n __decorate([\n Complex({ text: null, value: null, iconCss: null, groupBy: null }, FieldSettings)\n ], DropDownBase.prototype, \"fields\", void 0);\n __decorate([\n Property(null)\n ], DropDownBase.prototype, \"itemTemplate\", void 0);\n __decorate([\n Property(null)\n ], DropDownBase.prototype, \"groupTemplate\", void 0);\n __decorate([\n Property('No records found')\n ], DropDownBase.prototype, \"noRecordsTemplate\", void 0);\n __decorate([\n Property('Request failed')\n ], DropDownBase.prototype, \"actionFailureTemplate\", void 0);\n __decorate([\n Property('None')\n ], DropDownBase.prototype, \"sortOrder\", void 0);\n __decorate([\n Property([])\n ], DropDownBase.prototype, \"dataSource\", void 0);\n __decorate([\n Property(null)\n ], DropDownBase.prototype, \"query\", void 0);\n __decorate([\n Property('StartsWith')\n ], DropDownBase.prototype, \"filterType\", void 0);\n __decorate([\n Property(true)\n ], DropDownBase.prototype, \"ignoreCase\", void 0);\n __decorate([\n Property(1000)\n ], DropDownBase.prototype, \"zIndex\", void 0);\n __decorate([\n Property(false)\n ], DropDownBase.prototype, \"ignoreAccent\", void 0);\n __decorate([\n Property()\n ], DropDownBase.prototype, \"locale\", void 0);\n __decorate([\n Event()\n ], DropDownBase.prototype, \"actionBegin\", void 0);\n __decorate([\n Event()\n ], DropDownBase.prototype, \"actionComplete\", void 0);\n __decorate([\n Event()\n ], DropDownBase.prototype, \"actionFailure\", void 0);\n __decorate([\n Event()\n ], DropDownBase.prototype, \"select\", void 0);\n __decorate([\n Event()\n ], DropDownBase.prototype, \"dataBound\", void 0);\n __decorate([\n Event()\n ], DropDownBase.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], DropDownBase.prototype, \"destroyed\", void 0);\n DropDownBase = __decorate([\n NotifyPropertyChanges\n ], DropDownBase);\n return DropDownBase;\n}(Component));\nexport { DropDownBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// \nimport { EventHandler, Property, Event, compile, KeyboardEvents, append, select } from '@syncfusion/ej2-base';\nimport { attributes, isNullOrUndefined, getUniqueID, formatUnit, isUndefined, getValue } from '@syncfusion/ej2-base';\nimport { Animation, Browser, NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, closest, prepend, detach, classList } from '@syncfusion/ej2-base';\nimport { Popup, isCollide, createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { incrementalSearch, resetIncrementalSearchValues } from '../common/incremental-search';\nimport { DropDownBase, dropDownBaseClasses } from '../drop-down-base/drop-down-base';\nimport { DataManager, Query, Predicate } from '@syncfusion/ej2-data';\n[];\n// don't use space in classnames\nexport var dropDownListClasses = {\n root: 'e-dropdownlist',\n hover: dropDownBaseClasses.hover,\n selected: dropDownBaseClasses.selected,\n rtl: dropDownBaseClasses.rtl,\n li: dropDownBaseClasses.li,\n disable: dropDownBaseClasses.disabled,\n base: dropDownBaseClasses.root,\n focus: dropDownBaseClasses.focus,\n content: dropDownBaseClasses.content,\n input: 'e-input-group',\n inputFocus: 'e-input-focus',\n icon: 'e-input-group-icon e-ddl-icon',\n iconAnimation: 'e-icon-anim',\n value: 'e-input-value',\n device: 'e-ddl-device',\n backIcon: 'e-input-group-icon e-back-icon e-icons',\n filterBarClearIcon: 'e-input-group-icon e-clear-icon e-icons',\n filterInput: 'e-input-filter',\n filterParent: 'e-filter-parent',\n mobileFilter: 'e-ddl-device-filter',\n footer: 'e-ddl-footer',\n header: 'e-ddl-header',\n clearIcon: 'e-clear-icon',\n clearIconHide: 'e-clear-icon-hide',\n popupFullScreen: 'e-popup-full-page',\n disableIcon: 'e-ddl-disable-icon',\n hiddenElement: 'e-ddl-hidden',\n virtualList: 'e-list-item e-virtual-list',\n};\nvar inputObject = {\n container: null,\n buttons: []\n};\n/**\n * The DropDownList component contains a list of predefined values from which you can\n * choose a single value.\n * ```html\n * \n * ```\n * ```typescript\n * let dropDownListObj:DropDownList = new DropDownList();\n * dropDownListObj.appendTo(\"#list\");\n * ```\n */\nvar DropDownList = /** @class */ (function (_super) {\n __extends(DropDownList, _super);\n /**\n * * Constructor for creating the DropDownList component.\n *\n * @param {DropDownListModel} options - Specifies the DropDownList model.\n * @param {string | HTMLElement} element - Specifies the element to render as component.\n * @private\n */\n function DropDownList(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isListSearched = false;\n _this.preventChange = false;\n _this.isAngular = false;\n _this.isTouched = false;\n _this.IsScrollerAtEnd = function () {\n return this.list && this.list.scrollTop + this.list.clientHeight >= this.list.scrollHeight;\n };\n _this.removeAllChildren = function (element) {\n while (element.children[0]) {\n this.removeAllChildren(element.children[0]);\n element.removeChild(element.children[0]);\n }\n };\n return _this;\n }\n /**\n * Initialize the event handler.\n *\n * @private\n * @returns {void}\n */\n DropDownList.prototype.preRender = function () {\n this.valueTempElement = null;\n this.element.style.opacity = '0';\n this.initializeData();\n _super.prototype.preRender.call(this);\n this.activeIndex = this.index;\n this.queryString = '';\n };\n DropDownList.prototype.initializeData = function () {\n this.isPopupOpen = false;\n this.isDocumentClick = false;\n this.isInteracted = false;\n this.isFilterFocus = false;\n this.beforePopupOpen = false;\n this.initial = true;\n this.initialRemoteRender = false;\n this.isNotSearchList = false;\n this.isTyped = false;\n this.isSelected = false;\n this.preventFocus = false;\n this.preventAutoFill = false;\n this.isValidKey = false;\n this.typedString = '';\n this.isEscapeKey = false;\n this.isPreventBlur = false;\n this.isTabKey = false;\n this.actionCompleteData = { isUpdated: false };\n this.actionData = { isUpdated: false };\n this.prevSelectPoints = {};\n this.isSelectCustom = false;\n this.isDropDownClick = false;\n this.preventAltUp = false;\n this.isCustomFilter = false;\n this.isSecondClick = false;\n this.previousValue = null;\n this.keyConfigure = {\n tab: 'tab',\n enter: '13',\n escape: '27',\n end: '35',\n home: '36',\n down: '40',\n up: '38',\n pageUp: '33',\n pageDown: '34',\n open: 'alt+40',\n close: 'shift+tab',\n hide: 'alt+38',\n space: '32'\n };\n this.viewPortInfo = {\n currentPageNumber: null,\n direction: null,\n sentinelInfo: {},\n offsets: {},\n startIndex: 0,\n endIndex: this.itemCount,\n };\n };\n DropDownList.prototype.setZIndex = function () {\n if (this.popupObj) {\n this.popupObj.setProperties({ 'zIndex': this.zIndex });\n }\n };\n DropDownList.prototype.requiredModules = function () {\n var modules = [];\n if (this.enableVirtualization) {\n modules.push({ args: [this], member: 'VirtualScroll' });\n }\n return modules;\n };\n DropDownList.prototype.renderList = function (e, isEmptyData) {\n _super.prototype.render.call(this, e, isEmptyData);\n if (!(this.dataSource instanceof DataManager)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.totalItemCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;\n }\n if (this.enableVirtualization && this.isFiltering() && this.getModuleName() === 'combobox') {\n this.UpdateSkeleton();\n this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n this.ulElement = this.list.querySelector('ul');\n }\n this.unWireListEvents();\n this.wireListEvents();\n };\n DropDownList.prototype.floatLabelChange = function () {\n if (this.getModuleName() === 'dropdownlist' && this.floatLabelType === 'Auto') {\n var floatElement = this.inputWrapper.container.querySelector('.e-float-text');\n if (this.inputElement.value !== '' || this.isInteracted) {\n classList(floatElement, ['e-label-top'], ['e-label-bottom']);\n }\n else {\n classList(floatElement, ['e-label-bottom'], ['e-label-top']);\n }\n }\n };\n DropDownList.prototype.resetHandler = function (e) {\n e.preventDefault();\n this.clearAll(e);\n if (this.enableVirtualization) {\n this.list.scrollTop = 0;\n this.virtualListInfo = null;\n this.previousStartIndex = 0;\n this.previousEndIndex = 0;\n }\n };\n DropDownList.prototype.resetFocusElement = function () {\n this.removeHover();\n this.removeSelection();\n this.removeFocus();\n this.list.scrollTop = 0;\n if (this.getModuleName() !== 'autocomplete' && !isNullOrUndefined(this.ulElement)) {\n var li = this.ulElement.querySelector('.' + dropDownListClasses.li);\n if (this.enableVirtualization) {\n li = this.liCollections[this.skeletonCount];\n }\n if (li) {\n li.classList.add(dropDownListClasses.focus);\n }\n }\n };\n DropDownList.prototype.clearAll = function (e, properties) {\n this.previousItemData = (!isNullOrUndefined(this.itemData)) ? this.itemData : null;\n if (isNullOrUndefined(properties) || (!isNullOrUndefined(properties) &&\n (isNullOrUndefined(properties.dataSource) ||\n (!(properties.dataSource instanceof DataManager) && properties.dataSource.length === 0)))) {\n this.isActive = true;\n this.resetSelection(properties);\n }\n var dataItem = this.getItemData();\n if ((!this.allowObjectBinding && (this.previousValue === dataItem.value)) || (this.allowObjectBinding && this.previousValue && this.isObjectInArray(this.previousValue, [this.allowCustom ? this.value ? this.value : dataItem : dataItem.value ? this.getDataByValue(dataItem.value) : dataItem]))) {\n return;\n }\n this.onChangeEvent(e);\n this.checkAndResetCache();\n if (this.enableVirtualization) {\n this.updateInitialData();\n }\n };\n DropDownList.prototype.resetSelection = function (properties) {\n if (this.list) {\n if ((!isNullOrUndefined(properties) &&\n (isNullOrUndefined(properties.dataSource) ||\n (!(properties.dataSource instanceof DataManager) && properties.dataSource.length === 0)))) {\n this.selectedLI = null;\n this.actionCompleteData.isUpdated = false;\n this.actionCompleteData.ulElement = null;\n this.actionCompleteData.list = null;\n this.resetList(properties.dataSource);\n }\n else {\n if (this.allowFiltering && this.getModuleName() !== 'autocomplete'\n && !isNullOrUndefined(this.actionCompleteData.ulElement) && !isNullOrUndefined(this.actionCompleteData.list) &&\n this.actionCompleteData.list.length > 0) {\n this.onActionComplete(this.actionCompleteData.ulElement.cloneNode(true), this.actionCompleteData.list);\n }\n this.resetFocusElement();\n }\n }\n if (!isNullOrUndefined(this.hiddenElement)) {\n this.hiddenElement.innerHTML = '';\n }\n if (!isNullOrUndefined(this.inputElement)) {\n this.inputElement.value = '';\n }\n this.value = null;\n this.itemData = null;\n this.text = null;\n this.index = null;\n this.activeIndex = null;\n this.item = null;\n this.queryString = '';\n if (this.valueTempElement) {\n detach(this.valueTempElement);\n this.inputElement.style.display = 'block';\n this.valueTempElement = null;\n }\n this.setSelection(null, null);\n this.isSelectCustom = false;\n this.updateIconState();\n this.cloneElements();\n };\n DropDownList.prototype.setHTMLAttributes = function () {\n if (Object.keys(this.htmlAttributes).length) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var htmlAttr = _a[_i];\n if (htmlAttr === 'class') {\n var updatedClassValue = (this.htmlAttributes[\"\" + htmlAttr].replace(/\\s+/g, ' ')).trim();\n if (updatedClassValue !== '') {\n addClass([this.inputWrapper.container], updatedClassValue.split(' '));\n }\n }\n else if (htmlAttr === 'disabled' && this.htmlAttributes[\"\" + htmlAttr] === 'disabled') {\n this.enabled = false;\n this.setEnable();\n }\n else if (htmlAttr === 'readonly' && !isNullOrUndefined(this.htmlAttributes[\"\" + htmlAttr])) {\n this.readonly = true;\n this.dataBind();\n }\n else if (htmlAttr === 'style') {\n this.inputWrapper.container.setAttribute('style', this.htmlAttributes[\"\" + htmlAttr]);\n }\n else if (htmlAttr === 'aria-label') {\n if ((this.getModuleName() === 'autocomplete' || this.getModuleName() === 'combobox') && !this.readonly) {\n this.inputElement.setAttribute('aria-label', this.htmlAttributes[\"\" + htmlAttr]);\n }\n else if (this.getModuleName() === 'dropdownlist') {\n this.inputWrapper.container.setAttribute('aria-label', this.htmlAttributes[\"\" + htmlAttr]);\n }\n }\n else {\n var defaultAttr = ['title', 'id', 'placeholder',\n 'role', 'autocomplete', 'autocapitalize', 'spellcheck', 'minlength', 'maxlength'];\n var validateAttr = ['name', 'required'];\n if (this.getModuleName() === 'autocomplete' || this.getModuleName() === 'combobox') {\n defaultAttr.push('tabindex');\n }\n if (validateAttr.indexOf(htmlAttr) > -1 || htmlAttr.indexOf('data') === 0) {\n this.hiddenElement.setAttribute(htmlAttr, this.htmlAttributes[\"\" + htmlAttr]);\n }\n else if (defaultAttr.indexOf(htmlAttr) > -1) {\n if (htmlAttr === 'placeholder') {\n Input.setPlaceholder(this.htmlAttributes[\"\" + htmlAttr], this.inputElement);\n }\n else {\n this.inputElement.setAttribute(htmlAttr, this.htmlAttributes[\"\" + htmlAttr]);\n }\n }\n else {\n this.inputWrapper.container.setAttribute(htmlAttr, this.htmlAttributes[\"\" + htmlAttr]);\n }\n }\n }\n }\n if (this.getModuleName() === 'autocomplete' || this.getModuleName() === 'combobox') {\n this.inputWrapper.container.removeAttribute('tabindex');\n }\n };\n DropDownList.prototype.getAriaAttributes = function () {\n return {\n 'aria-disabled': 'false',\n 'role': 'combobox',\n 'aria-expanded': 'false',\n 'aria-live': 'polite',\n 'aria-labelledby': this.hiddenElement.id\n };\n };\n DropDownList.prototype.setEnableRtl = function () {\n Input.setEnableRtl(this.enableRtl, [this.inputElement.parentElement]);\n if (this.popupObj) {\n this.popupObj.enableRtl = this.enableRtl;\n this.popupObj.dataBind();\n }\n };\n DropDownList.prototype.setEnable = function () {\n Input.setEnabled(this.enabled, this.inputElement);\n if (this.enabled) {\n removeClass([this.inputWrapper.container], dropDownListClasses.disable);\n this.inputElement.setAttribute('aria-disabled', 'false');\n this.targetElement().setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.hidePopup();\n addClass([this.inputWrapper.container], dropDownListClasses.disable);\n this.inputElement.setAttribute('aria-disabled', 'true');\n this.targetElement().tabIndex = -1;\n }\n };\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @returns {string} Returns the persisted data of the component.\n */\n DropDownList.prototype.getPersistData = function () {\n return this.addOnPersist(['value']);\n };\n DropDownList.prototype.getLocaleName = function () {\n return 'drop-down-list';\n };\n DropDownList.prototype.preventTabIndex = function (element) {\n if (this.getModuleName() === 'dropdownlist') {\n element.tabIndex = -1;\n }\n };\n DropDownList.prototype.targetElement = function () {\n return !isNullOrUndefined(this.inputWrapper) ? this.inputWrapper.container : null;\n };\n DropDownList.prototype.getNgDirective = function () {\n return 'EJS-DROPDOWNLIST';\n };\n DropDownList.prototype.getElementByText = function (text) {\n return this.getElementByValue(this.getValueByText(text));\n };\n DropDownList.prototype.getElementByValue = function (value) {\n var item;\n var listItems = this.getItems();\n for (var _i = 0, listItems_1 = listItems; _i < listItems_1.length; _i++) {\n var liItem = listItems_1[_i];\n if (this.getFormattedValue(liItem.getAttribute('data-value')) === value) {\n item = liItem;\n break;\n }\n }\n return item;\n };\n DropDownList.prototype.initValue = function () {\n this.viewPortInfo.startIndex = this.virtualItemStartIndex = 0;\n this.viewPortInfo.endIndex = this.virtualItemEndIndex = this.itemCount;\n this.renderList();\n if (this.dataSource instanceof DataManager) {\n this.initialRemoteRender = true;\n }\n else {\n this.updateValues();\n }\n };\n DropDownList.prototype.updateValues = function () {\n this.selectedValueInfo = this.viewPortInfo;\n if (!isNullOrUndefined(this.value)) {\n var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue(((this.fields.value) ? this.fields.value : ''), this.value) : this.value;\n this.setSelection(this.getElementByValue(value), null);\n }\n else if (this.text && isNullOrUndefined(this.value)) {\n var element = this.getElementByText(this.text);\n if (isNullOrUndefined(element)) {\n this.setProperties({ text: null });\n return;\n }\n else {\n this.setSelection(element, null);\n }\n }\n else {\n this.setSelection(this.liCollections[this.activeIndex], null);\n }\n this.setHiddenValue();\n Input.setValue(this.text, this.inputElement, this.floatLabelType, this.showClearButton);\n };\n DropDownList.prototype.onBlurHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n var target = e.relatedTarget;\n var currentTarget = e.target;\n var isPreventBlur = this.isPreventBlur;\n this.isPreventBlur = false;\n //IE 11 - issue\n if (isPreventBlur && !this.isDocumentClick && this.isPopupOpen && (!isNullOrUndefined(currentTarget) ||\n !this.isFilterLayout() && isNullOrUndefined(target))) {\n if (this.getModuleName() === 'dropdownlist' && this.allowFiltering && this.isPopupOpen) {\n this.filterInput.focus();\n }\n else {\n this.targetElement().focus();\n }\n return;\n }\n if (this.isDocumentClick || (!isNullOrUndefined(this.popupObj)\n && document.body.contains(this.popupObj.element) &&\n this.popupObj.element.classList.contains(dropDownListClasses.mobileFilter))) {\n if (!this.beforePopupOpen) {\n this.isDocumentClick = false;\n }\n return;\n }\n if (((this.getModuleName() === 'dropdownlist' && !this.isFilterFocus && target !== this.inputElement)\n && (document.activeElement !== target || (document.activeElement === target &&\n currentTarget.classList.contains(dropDownListClasses.inputFocus)))) ||\n (isNullOrUndefined(target) && this.getModuleName() === 'dropdownlist' && this.allowFiltering &&\n currentTarget !== this.inputWrapper.container) || this.getModuleName() !== 'dropdownlist' &&\n !this.inputWrapper.container.contains(target) || this.isTabKey) {\n this.isDocumentClick = this.isPopupOpen ? true : false;\n this.focusOutAction(e);\n this.isTabKey = false;\n }\n if (this.isRequested && !this.isPopupOpen && !this.isPreventBlur) {\n this.isActive = false;\n this.beforePopupOpen = false;\n }\n };\n DropDownList.prototype.focusOutAction = function (e) {\n this.isInteracted = false;\n this.focusOut(e);\n this.onFocusOut(e);\n };\n DropDownList.prototype.onFocusOut = function (e) {\n if (!this.enabled) {\n return;\n }\n if (this.isSelected) {\n this.isSelectCustom = false;\n this.onChangeEvent(e);\n }\n this.floatLabelChange();\n this.dispatchEvent(this.hiddenElement, 'change');\n if (this.getModuleName() === 'dropdownlist' && this.element.tagName !== 'INPUT') {\n this.dispatchEvent(this.inputElement, 'blur');\n }\n if (this.inputWrapper.clearButton) {\n addClass([this.inputWrapper.clearButton], dropDownListClasses.clearIconHide);\n }\n this.trigger('blur');\n };\n DropDownList.prototype.onFocus = function (e) {\n if (!this.isInteracted) {\n this.isInteracted = true;\n var args = { isInteracted: e ? true : false, event: e };\n this.trigger('focus', args);\n }\n this.updateIconState();\n };\n DropDownList.prototype.resetValueHandler = function (e) {\n var formElement = closest(this.inputElement, 'form');\n if (formElement && e.target === formElement) {\n var val = (this.element.tagName === this.getNgDirective()) ? null : this.inputElement.getAttribute('value');\n this.text = val;\n }\n };\n DropDownList.prototype.wireEvent = function () {\n EventHandler.add(this.inputWrapper.container, 'mousedown', this.dropDownClick, this);\n EventHandler.add(this.inputWrapper.container, 'focus', this.focusIn, this);\n EventHandler.add(this.inputWrapper.container, 'keypress', this.onSearch, this);\n EventHandler.add(window, 'resize', this.windowResize, this);\n this.bindCommonEvent();\n };\n DropDownList.prototype.bindCommonEvent = function () {\n EventHandler.add(this.targetElement(), 'blur', this.onBlurHandler, this);\n var formElement = closest(this.inputElement, 'form');\n if (formElement) {\n EventHandler.add(formElement, 'reset', this.resetValueHandler, this);\n }\n if (!Browser.isDevice) {\n this.keyboardModule = new KeyboardEvents(this.targetElement(), {\n keyAction: this.keyActionHandler.bind(this), keyConfigs: this.keyConfigure, eventName: 'keydown'\n });\n }\n else {\n this.keyboardModule = new KeyboardEvents(this.targetElement(), {\n keyAction: this.mobileKeyActionHandler.bind(this), keyConfigs: this.keyConfigure, eventName: 'keydown'\n });\n }\n this.bindClearEvent();\n };\n DropDownList.prototype.windowResize = function () {\n if (this.isPopupOpen) {\n this.popupObj.refreshPosition(this.inputWrapper.container);\n }\n };\n DropDownList.prototype.bindClearEvent = function () {\n if (this.showClearButton) {\n EventHandler.add(this.inputWrapper.clearButton, 'mousedown', this.resetHandler, this);\n }\n };\n DropDownList.prototype.unBindCommonEvent = function () {\n if (!isNullOrUndefined(this.inputWrapper) && this.targetElement()) {\n EventHandler.remove(this.targetElement(), 'blur', this.onBlurHandler);\n }\n var formElement = this.inputElement && closest(this.inputElement, 'form');\n if (formElement) {\n EventHandler.remove(formElement, 'reset', this.resetValueHandler);\n }\n if (!Browser.isDevice) {\n this.keyboardModule.destroy();\n }\n if (this.showClearButton) {\n EventHandler.remove(this.inputWrapper.clearButton, 'mousedown', this.resetHandler);\n }\n };\n DropDownList.prototype.updateIconState = function () {\n if (this.showClearButton) {\n if (this.inputElement.value !== '' && !this.readonly) {\n removeClass([this.inputWrapper.clearButton], dropDownListClasses.clearIconHide);\n }\n else {\n addClass([this.inputWrapper.clearButton], dropDownListClasses.clearIconHide);\n }\n }\n };\n /**\n * Event binding for list\n *\n * @returns {void}\n */\n DropDownList.prototype.wireListEvents = function () {\n if (!isNullOrUndefined(this.list)) {\n EventHandler.add(this.list, 'click', this.onMouseClick, this);\n EventHandler.add(this.list, 'mouseover', this.onMouseOver, this);\n EventHandler.add(this.list, 'mouseout', this.onMouseLeave, this);\n }\n };\n DropDownList.prototype.onSearch = function (e) {\n if (e.charCode !== 32 && e.charCode !== 13) {\n if (this.list === undefined) {\n this.renderList();\n }\n this.searchKeyEvent = e;\n this.onServerIncrementalSearch(e);\n }\n };\n DropDownList.prototype.onServerIncrementalSearch = function (e) {\n if (!this.isRequested && !isNullOrUndefined(this.list) &&\n !isNullOrUndefined(this.list.querySelector('li')) && this.enabled && !this.readonly) {\n this.incrementalSearch(e);\n }\n };\n DropDownList.prototype.onMouseClick = function (e) {\n var target = e.target;\n this.keyboardEvent = null;\n var li = closest(target, '.' + dropDownBaseClasses.li);\n if (!this.isValidLI(li)) {\n return;\n }\n this.setSelection(li, e);\n if (Browser.isDevice && this.isFilterLayout()) {\n history.back();\n }\n else {\n var delay = 100;\n this.closePopup(delay, e);\n }\n };\n DropDownList.prototype.onMouseOver = function (e) {\n var currentLi = closest(e.target, '.' + dropDownBaseClasses.li);\n this.setHover(currentLi);\n };\n DropDownList.prototype.setHover = function (li) {\n if (this.enabled && this.isValidLI(li) && !li.classList.contains(dropDownBaseClasses.hover)) {\n this.removeHover();\n addClass([li], dropDownBaseClasses.hover);\n }\n };\n DropDownList.prototype.onMouseLeave = function () {\n this.removeHover();\n };\n DropDownList.prototype.removeHover = function () {\n if (this.list) {\n var hoveredItem = this.list.querySelectorAll('.' + dropDownBaseClasses.hover);\n if (hoveredItem && hoveredItem.length) {\n removeClass(hoveredItem, dropDownBaseClasses.hover);\n }\n }\n };\n DropDownList.prototype.isValidLI = function (li) {\n return (li && li.hasAttribute('role') && li.getAttribute('role') === 'option');\n };\n DropDownList.prototype.updateIncrementalItemIndex = function (startIndex, endIndex) {\n this.incrementalStartIndex = startIndex;\n this.incrementalEndIndex = endIndex;\n };\n DropDownList.prototype.incrementalSearch = function (e) {\n if (this.liCollections.length > 0) {\n if (this.enableVirtualization) {\n var updatingincrementalindex = false;\n var queryStringUpdated = false;\n var activeElement = this.ulElement.getElementsByClassName('e-active')[0];\n var currentValue = activeElement ? activeElement.textContent : null;\n if (this.incrementalQueryString == '') {\n this.incrementalQueryString = String.fromCharCode(e.charCode);\n this.incrementalPreQueryString = this.incrementalQueryString;\n }\n else if (String.fromCharCode(e.charCode).toLocaleLowerCase() == this.incrementalPreQueryString.toLocaleLowerCase()) {\n queryStringUpdated = true;\n }\n else {\n this.incrementalQueryString = String.fromCharCode(e.charCode);\n }\n if ((this.viewPortInfo.endIndex >= this.incrementalEndIndex && this.incrementalEndIndex <= this.totalItemCount) || this.incrementalEndIndex == 0) {\n updatingincrementalindex = true;\n this.incrementalStartIndex = this.incrementalEndIndex;\n if (this.incrementalEndIndex == 0) {\n this.incrementalEndIndex = 100 > this.totalItemCount ? this.totalItemCount : 100;\n }\n else {\n this.incrementalEndIndex = this.incrementalEndIndex + 100 > this.totalItemCount ? this.totalItemCount : this.incrementalEndIndex + 100;\n }\n this.updateIncrementalInfo(this.incrementalStartIndex, this.incrementalEndIndex);\n updatingincrementalindex = true;\n }\n if (this.viewPortInfo.startIndex !== 0 || updatingincrementalindex) {\n this.updateIncrementalView(0, this.itemCount);\n }\n var li = incrementalSearch(e.charCode, this.incrementalLiCollections, this.activeIndex, true, this.element.id, queryStringUpdated, currentValue, true);\n while (isNullOrUndefined(li) && this.incrementalEndIndex < this.totalItemCount) {\n this.updateIncrementalItemIndex(this.incrementalEndIndex, this.incrementalEndIndex + 100 > this.totalItemCount ? this.totalItemCount : this.incrementalEndIndex + 100);\n this.updateIncrementalInfo(this.incrementalStartIndex, this.incrementalEndIndex);\n updatingincrementalindex = true;\n if (this.viewPortInfo.startIndex !== 0 || updatingincrementalindex) {\n this.updateIncrementalView(0, this.itemCount);\n }\n li = incrementalSearch(e.charCode, this.incrementalLiCollections, 0, true, this.element.id, queryStringUpdated, currentValue, true, true);\n if (!isNullOrUndefined(li)) {\n break;\n }\n if (isNullOrUndefined(li) && this.incrementalEndIndex >= this.totalItemCount) {\n this.updateIncrementalItemIndex(0, 100 > this.totalItemCount ? this.totalItemCount : 100);\n break;\n }\n }\n if (isNullOrUndefined(li) && this.incrementalEndIndex >= this.totalItemCount) {\n this.updateIncrementalItemIndex(0, 100 > this.totalItemCount ? this.totalItemCount : 100);\n this.updateIncrementalInfo(this.incrementalStartIndex, this.incrementalEndIndex);\n updatingincrementalindex = true;\n if (this.viewPortInfo.startIndex !== 0 || updatingincrementalindex) {\n this.updateIncrementalView(0, this.itemCount);\n }\n li = incrementalSearch(e.charCode, this.incrementalLiCollections, 0, true, this.element.id, queryStringUpdated, currentValue, true, true);\n }\n var index = li && this.getIndexByValue(li.getAttribute('data-value'));\n if (!index) {\n for (var i = 0; i < this.incrementalLiCollections.length; i++) {\n if (!isNullOrUndefined(li) && !isNullOrUndefined(li.getAttribute('data-value')) && this.incrementalLiCollections[i].getAttribute('data-value') === li.getAttribute('data-value').toString()) {\n index = i;\n index = this.incrementalStartIndex + index;\n break;\n }\n }\n }\n else {\n index = index - this.skeletonCount;\n }\n if (index) {\n if ((!(this.viewPortInfo.startIndex >= index)) || (!(index >= this.viewPortInfo.endIndex))) {\n var startIndex = index - ((this.itemCount / 2) - 2) > 0 ? index - ((this.itemCount / 2) - 2) : 0;\n var endIndex = this.viewPortInfo.startIndex + this.itemCount > this.totalItemCount ? this.totalItemCount : this.viewPortInfo.startIndex + this.itemCount;\n this.updateIncrementalView(startIndex, endIndex);\n }\n }\n if (!isNullOrUndefined(li)) {\n var index_1 = this.getIndexByValue(li.getAttribute('data-value')) - this.skeletonCount;\n if (index_1 > this.itemCount / 2) {\n var startIndex = this.viewPortInfo.startIndex + ((this.itemCount / 2) - 2) < this.totalItemCount ? this.viewPortInfo.startIndex + ((this.itemCount / 2) - 2) : this.totalItemCount;\n var endIndex = this.viewPortInfo.startIndex + this.itemCount > this.totalItemCount ? this.totalItemCount : this.viewPortInfo.startIndex + this.itemCount;\n this.updateIncrementalView(startIndex, endIndex);\n }\n li = this.getElementByValue(li.getAttribute('data-value'));\n this.setSelection(li, e);\n this.setScrollPosition();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = this.getTransformValues();\n if (this.enableVirtualization && !this.fields.groupBy) {\n var selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.selectedLI.offsetTop + (this.virtualListInfo.startIndex * this.selectedLI.offsetHeight) : this.selectedLI.offsetTop;\n this.list.scrollTop = selectedLiOffsetTop - (this.list.querySelectorAll('.e-virtual-list').length * this.selectedLI.offsetHeight);\n }\n this.incrementalPreQueryString = this.incrementalQueryString;\n }\n else {\n this.updateIncrementalView(0, this.itemCount);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = this.getTransformValues();\n this.list.scrollTop = 0;\n }\n }\n else {\n var li = incrementalSearch(e.charCode, this.liCollections, this.activeIndex, true, this.element.id);\n if (!isNullOrUndefined(li)) {\n this.setSelection(li, e);\n this.setScrollPosition();\n }\n }\n }\n };\n /**\n * Hides the spinner loader.\n *\n * @returns {void}\n */\n DropDownList.prototype.hideSpinner = function () {\n if (!isNullOrUndefined(this.spinnerElement)) {\n hideSpinner(this.spinnerElement);\n removeClass([this.spinnerElement], dropDownListClasses.disableIcon);\n this.spinnerElement.innerHTML = '';\n this.spinnerElement = null;\n }\n };\n /**\n * Shows the spinner loader.\n *\n * @returns {void}\n */\n DropDownList.prototype.showSpinner = function () {\n if (isNullOrUndefined(this.spinnerElement)) {\n this.spinnerElement = Browser.isDevice && !isNullOrUndefined(this.filterInputObj) && this.filterInputObj.buttons[1] ||\n !isNullOrUndefined(this.filterInputObj) && this.filterInputObj.buttons[0] || this.inputWrapper.buttons[0];\n addClass([this.spinnerElement], dropDownListClasses.disableIcon);\n createSpinner({\n target: this.spinnerElement,\n width: Browser.isDevice ? '16px' : '14px'\n }, this.createElement);\n showSpinner(this.spinnerElement);\n }\n };\n DropDownList.prototype.keyActionHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n this.keyboardEvent = e;\n if (this.isPreventKeyAction && this.enableVirtualization) {\n e.preventDefault();\n }\n var preventAction = e.action === 'pageUp' || e.action === 'pageDown';\n var preventHomeEnd = this.getModuleName() !== 'dropdownlist' && (e.action === 'home' || e.action === 'end');\n this.isEscapeKey = e.action === 'escape';\n this.isTabKey = !this.isPopupOpen && e.action === 'tab';\n var isNavigation = (e.action === 'down' || e.action === 'up' || e.action === 'pageUp' || e.action === 'pageDown'\n || e.action === 'home' || e.action === 'end');\n if ((this.isEditTextBox() || preventAction || preventHomeEnd) && !this.isPopupOpen) {\n return;\n }\n if (!this.readonly) {\n var isTabAction = e.action === 'tab' || e.action === 'close';\n if (isNullOrUndefined(this.list) && !this.isRequested && !isTabAction && e.action !== 'escape') {\n this.searchKeyEvent = e;\n if (!this.enableVirtualization || (this.enableVirtualization && this.getModuleName() !== 'autocomplete' && e.type !== 'mousedown' && (e.keyCode === 40 || e.keyCode === 38))) {\n this.renderList(e);\n this.UpdateSkeleton();\n this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n this.ulElement = this.list.querySelector('ul');\n }\n }\n if (isNullOrUndefined(this.list) || (!isNullOrUndefined(this.liCollections) &&\n isNavigation && this.liCollections.length === 0) || this.isRequested) {\n return;\n }\n if ((isTabAction && this.getModuleName() !== 'autocomplete') && this.isPopupOpen\n || e.action === 'escape') {\n e.preventDefault();\n }\n this.isSelected = e.action === 'escape' ? false : this.isSelected;\n this.isTyped = (isNavigation || e.action === 'escape') ? false : this.isTyped;\n switch (e.action) {\n case 'down':\n case 'up':\n this.updateUpDownAction(e);\n break;\n case 'pageUp':\n this.pageUpSelection(this.activeIndex - this.getPageCount(), e);\n e.preventDefault();\n break;\n case 'pageDown':\n this.pageDownSelection(this.activeIndex + this.getPageCount(), e);\n e.preventDefault();\n break;\n case 'home':\n this.isMouseScrollAction = true;\n this.updateHomeEndAction(e);\n break;\n case 'end':\n this.isMouseScrollAction = true;\n this.updateHomeEndAction(e);\n break;\n case 'space':\n if (this.getModuleName() === 'dropdownlist') {\n if (!this.beforePopupOpen) {\n this.showPopup();\n e.preventDefault();\n }\n }\n break;\n case 'open':\n this.showPopup(e);\n break;\n case 'hide':\n this.preventAltUp = this.isPopupOpen;\n this.hidePopup(e);\n this.focusDropDown(e);\n break;\n case 'enter':\n this.selectCurrentItem(e);\n break;\n case 'tab':\n this.selectCurrentValueOnTab(e);\n break;\n case 'escape':\n case 'close':\n if (this.isPopupOpen) {\n this.hidePopup(e);\n this.focusDropDown(e);\n }\n break;\n }\n }\n };\n DropDownList.prototype.updateUpDownAction = function (e, isVirtualKeyAction) {\n if (this.allowFiltering && !this.enableVirtualization && this.getModuleName() !== 'autocomplete') {\n var value_1 = this.getItemData().value;\n if (isNullOrUndefined(value_1)) {\n value_1 = 'null';\n }\n var filterIndex = this.getIndexByValue(value_1);\n if (!isNullOrUndefined(filterIndex)) {\n this.activeIndex = filterIndex;\n }\n }\n var focusEle = this.list.querySelector('.' + dropDownListClasses.focus);\n if (this.isSelectFocusItem(focusEle) && !isVirtualKeyAction) {\n this.setSelection(focusEle, e);\n if (this.enableVirtualization) {\n var selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.selectedLI.offsetTop + (this.virtualListInfo.startIndex * this.selectedLI.offsetHeight) : this.selectedLI.offsetTop;\n if (this.fields.groupBy) {\n selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex == 0 ? this.selectedLI.offsetHeight - selectedLiOffsetTop : selectedLiOffsetTop - this.selectedLI.offsetHeight;\n }\n this.list.scrollTop = selectedLiOffsetTop - (this.list.querySelectorAll('.e-virtual-list').length * this.selectedLI.offsetHeight);\n }\n }\n else if (!isNullOrUndefined(this.liCollections)) {\n var virtualIndex = this.activeIndex;\n var index = e.action === 'down' ? this.activeIndex + 1 : this.activeIndex - 1;\n index = isVirtualKeyAction ? virtualIndex : index;\n var startIndex = 0;\n if (this.getModuleName() === 'autocomplete') {\n startIndex = e.action === 'down' && isNullOrUndefined(this.activeIndex) ? 0 : this.liCollections.length - 1;\n index = index < 0 ? this.liCollections.length - 1 : index === this.liCollections.length ? 0 : index;\n }\n var nextItem = void 0;\n if (this.getModuleName() !== 'autocomplete' || this.getModuleName() === 'autocomplete' && this.isPopupOpen) {\n if (!this.enableVirtualization) {\n nextItem = isNullOrUndefined(this.activeIndex) ? this.liCollections[startIndex]\n : this.liCollections[index];\n }\n else {\n if (!isVirtualKeyAction) {\n nextItem = isNullOrUndefined(this.activeIndex) ? this.liCollections[this.skeletonCount]\n : this.liCollections[index];\n nextItem = !isNullOrUndefined(nextItem) && !nextItem.classList.contains('e-virtual-list') ? nextItem : null;\n }\n else {\n if (this.getModuleName() === 'autocomplete') {\n var value = this.getFormattedValue(this.selectedLI.getAttribute('data-value'));\n nextItem = this.getElementByValue(value);\n }\n else {\n nextItem = this.getElementByValue(this.getItemData().value);\n }\n }\n }\n }\n if (!isNullOrUndefined(nextItem)) {\n var focusAtFirstElement = this.liCollections[this.skeletonCount] && this.liCollections[this.skeletonCount].classList.contains('e-item-focus');\n this.setSelection(nextItem, e);\n if (focusAtFirstElement && this.enableVirtualization && this.getModuleName() === 'autocomplete' && !isVirtualKeyAction) {\n var selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.selectedLI.offsetTop + (this.virtualListInfo.startIndex * this.selectedLI.offsetHeight) : this.selectedLI.offsetTop;\n selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex == 0 && this.fields.groupBy ? this.selectedLI.offsetHeight - selectedLiOffsetTop : selectedLiOffsetTop - this.selectedLI.offsetHeight;\n this.list.scrollTop = selectedLiOffsetTop - (this.list.querySelectorAll('.e-virtual-list').length * this.selectedLI.offsetHeight);\n }\n }\n else if (this.enableVirtualization && !this.isPopupOpen && this.getModuleName() !== 'autocomplete' && ((this.viewPortInfo.endIndex !== this.totalItemCount && e.action === 'down') || (this.viewPortInfo.startIndex !== 0 && e.action === 'up'))) {\n if (e.action === 'down') {\n this.viewPortInfo.startIndex = (this.viewPortInfo.startIndex + this.itemCount) < (this.totalItemCount - this.itemCount) ? this.viewPortInfo.startIndex + this.itemCount : this.totalItemCount - this.itemCount;\n this.viewPortInfo.endIndex = this.viewPortInfo.startIndex + this.itemCount;\n this.updateVirtualItemIndex();\n this.isCustomFilter = this.getModuleName() === 'combobox' ? true : this.isCustomFilter;\n this.resetList(this.dataSource, this.fields, this.query);\n this.isCustomFilter = this.getModuleName() === 'combobox' ? false : this.isCustomFilter;\n var value_2 = this.liCollections[0].getAttribute('data-value') !== \"null\" ? this.getFormattedValue(this.liCollections[0].getAttribute('data-value')) : null;\n var selectedData = this.getDataByValue(value_2);\n if (selectedData) {\n this.itemData = selectedData;\n }\n }\n else if (e.action === 'up') {\n this.viewPortInfo.startIndex = (this.viewPortInfo.startIndex - this.itemCount) > 0 ? this.viewPortInfo.startIndex - this.itemCount : 0;\n this.viewPortInfo.endIndex = this.viewPortInfo.startIndex + this.itemCount;\n this.updateVirtualItemIndex();\n this.isCustomFilter = this.getModuleName() === 'combobox' ? true : this.isCustomFilter;\n this.resetList(this.dataSource, this.fields, this.query);\n this.isCustomFilter = this.getModuleName() === 'combobox' ? false : this.isCustomFilter;\n var value_3 = this.liCollections[this.liCollections.length - 1].getAttribute('data-value') !== \"null\" ? this.getFormattedValue(this.liCollections[this.liCollections.length - 1].getAttribute('data-value')) : null;\n var selectedData = this.getDataByValue(value_3);\n if (selectedData) {\n this.itemData = selectedData;\n }\n }\n this.UpdateSkeleton();\n this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n this.ulElement = this.list.querySelector('ul');\n this.handleVirtualKeyboardActions(e, this.pageCount);\n }\n }\n if (this.allowFiltering && !this.enableVirtualization && this.getModuleName() !== 'autocomplete') {\n var value_4 = this.getItemData().value;\n var filterIndex = this.getIndexByValueFilter(value_4, this.actionCompleteData.ulElement);\n if (!isNullOrUndefined(filterIndex)) {\n this.activeIndex = filterIndex;\n }\n }\n if (this.allowFiltering && this.getModuleName() === 'dropdownlist' && this.filterInput) {\n if (!isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-item-focus')[0])) {\n attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-item-focus')[0].id });\n }\n else if (!isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-active')[0])) {\n attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-active')[0].id });\n }\n }\n e.preventDefault();\n };\n DropDownList.prototype.updateHomeEndAction = function (e, isVirtualKeyAction) {\n if (this.getModuleName() === 'dropdownlist') {\n var findLi = 0;\n if (e.action === 'home') {\n findLi = 0;\n if (this.enableVirtualization && this.isPopupOpen) {\n findLi = this.skeletonCount;\n }\n else if (this.enableVirtualization && !this.isPopupOpen && this.viewPortInfo.startIndex !== 0) {\n this.viewPortInfo.startIndex = 0;\n this.viewPortInfo.endIndex = this.itemCount;\n this.updateVirtualItemIndex();\n this.resetList(this.dataSource, this.fields, this.query);\n }\n }\n else {\n if (this.enableVirtualization && !this.isPopupOpen && this.viewPortInfo.endIndex !== this.totalItemCount) {\n this.viewPortInfo.startIndex = this.totalItemCount - this.itemCount;\n this.viewPortInfo.endIndex = this.totalItemCount;\n this.updateVirtualItemIndex();\n this.resetList(this.dataSource, this.fields, this.query);\n }\n findLi = this.getItems().length - 1;\n }\n e.preventDefault();\n if (this.activeIndex === findLi) {\n if (isVirtualKeyAction) {\n this.setSelection(this.liCollections[findLi], e);\n }\n return;\n }\n this.setSelection(this.liCollections[findLi], e);\n }\n };\n DropDownList.prototype.selectCurrentValueOnTab = function (e) {\n if (this.getModuleName() === 'autocomplete') {\n this.selectCurrentItem(e);\n }\n else {\n if (this.isPopupOpen) {\n this.hidePopup(e);\n this.focusDropDown(e);\n }\n }\n };\n DropDownList.prototype.mobileKeyActionHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n if ((this.isEditTextBox()) && !this.isPopupOpen) {\n return;\n }\n if (!this.readonly) {\n if (this.list === undefined && !this.isRequested) {\n this.searchKeyEvent = e;\n this.renderList();\n }\n if (isNullOrUndefined(this.list) || (!isNullOrUndefined(this.liCollections) &&\n this.liCollections.length === 0) || this.isRequested) {\n return;\n }\n if (e.action === 'enter') {\n this.selectCurrentItem(e);\n }\n }\n };\n DropDownList.prototype.handleVirtualKeyboardActions = function (e, pageCount) {\n switch (e.action) {\n case 'down':\n case 'up':\n if (this.itemData != null || this.getModuleName() === 'autocomplete') {\n this.updateUpDownAction(e, true);\n }\n break;\n case 'pageUp':\n this.activeIndex = this.getModuleName() === 'autocomplete' ? this.getIndexByValue(this.selectedLI.getAttribute('data-value')) + this.getPageCount() - 1 : this.getIndexByValue(this.previousValue);\n this.pageUpSelection(this.activeIndex - this.getPageCount(), e, true);\n e.preventDefault();\n break;\n case 'pageDown':\n this.activeIndex = this.getModuleName() === 'autocomplete' ? this.getIndexByValue(this.selectedLI.getAttribute('data-value')) - this.getPageCount() : this.getIndexByValue(this.previousValue);\n this.pageDownSelection(!isNullOrUndefined(this.activeIndex) ? (this.activeIndex + this.getPageCount()) : (2 * this.getPageCount()), e, true);\n e.preventDefault();\n break;\n case 'home':\n this.isMouseScrollAction = true;\n this.updateHomeEndAction(e, true);\n break;\n case 'end':\n this.isMouseScrollAction = true;\n this.updateHomeEndAction(e, true);\n break;\n }\n this.keyboardEvent = null;\n };\n DropDownList.prototype.selectCurrentItem = function (e) {\n if (this.isPopupOpen) {\n var li = this.list.querySelector('.' + dropDownListClasses.focus);\n if (li) {\n this.setSelection(li, e);\n this.isTyped = false;\n }\n if (this.isSelected) {\n this.isSelectCustom = false;\n this.onChangeEvent(e);\n }\n this.hidePopup(e);\n this.focusDropDown(e);\n }\n else {\n this.showPopup();\n }\n };\n DropDownList.prototype.isSelectFocusItem = function (element) {\n return !isNullOrUndefined(element);\n };\n DropDownList.prototype.pageUpSelection = function (steps, event, isVirtualKeyAction) {\n var previousItem = steps >= 0 ? this.liCollections[steps + 1] : this.liCollections[0];\n if ((this.enableVirtualization && this.activeIndex == null)) {\n previousItem = (this.liCollections.length >= steps && steps >= 0) ? this.liCollections[steps + this.skeletonCount + 1] : this.liCollections[0];\n }\n if (!isNullOrUndefined(previousItem) && previousItem.classList.contains('e-virtual-list')) {\n previousItem = this.liCollections[this.skeletonCount];\n }\n this.PageUpDownSelection(previousItem, event);\n if (this.allowFiltering && this.getModuleName() === 'dropdownlist') {\n if (!isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-item-focus')[0])) {\n attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-item-focus')[0].id });\n }\n else if (!isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-active')[0])) {\n attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-active')[0].id });\n }\n }\n };\n DropDownList.prototype.PageUpDownSelection = function (previousItem, event) {\n if (this.enableVirtualization) {\n if (!isNullOrUndefined(previousItem) && ((this.getModuleName() !== 'autocomplete' && !previousItem.classList.contains('e-active')) || (this.getModuleName() === 'autocomplete' && !previousItem.classList.contains('e-item-focus')))) {\n this.setSelection(previousItem, event);\n }\n }\n else {\n this.setSelection(previousItem, event);\n }\n };\n DropDownList.prototype.pageDownSelection = function (steps, event, isVirtualKeyAction) {\n var list = this.getItems();\n var previousItem = steps <= list.length ? this.liCollections[steps - 1] : this.liCollections[list.length - 1];\n if (this.enableVirtualization && this.skeletonCount > 0) {\n steps = this.getModuleName() === 'dropdownlist' && this.allowFiltering ? steps + 1 : steps;\n previousItem = steps < list.length ? this.liCollections[steps] : this.liCollections[list.length - 1];\n }\n if ((this.enableVirtualization && this.activeIndex == null)) {\n previousItem = steps <= list.length ? this.liCollections[steps + this.skeletonCount - 1] : this.liCollections[list.length - 1];\n }\n this.PageUpDownSelection(previousItem, event);\n if (this.allowFiltering && this.getModuleName() === 'dropdownlist') {\n if (!isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-item-focus')[0])) {\n attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-item-focus')[0].id });\n }\n else if (!isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-active')[0])) {\n attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-active')[0].id });\n }\n }\n };\n DropDownList.prototype.unWireEvent = function () {\n if (!isNullOrUndefined(this.inputWrapper)) {\n EventHandler.remove(this.inputWrapper.container, 'mousedown', this.dropDownClick);\n EventHandler.remove(this.inputWrapper.container, 'keypress', this.onSearch);\n EventHandler.remove(this.inputWrapper.container, 'focus', this.focusIn);\n EventHandler.remove(window, 'resize', this.windowResize);\n }\n this.unBindCommonEvent();\n };\n /**\n * Event un binding for list items.\n *\n * @returns {void}\n */\n DropDownList.prototype.unWireListEvents = function () {\n if (this.list) {\n EventHandler.remove(this.list, 'click', this.onMouseClick);\n EventHandler.remove(this.list, 'mouseover', this.onMouseOver);\n EventHandler.remove(this.list, 'mouseout', this.onMouseLeave);\n }\n };\n DropDownList.prototype.checkSelector = function (id) {\n return '[id=\"' + id.replace(/(:|\\.|\\[|\\]|,|=|@|\\\\|\\/|#)/g, '\\\\$1') + '\"]';\n };\n DropDownList.prototype.onDocumentClick = function (e) {\n var target = e.target;\n if (!(!isNullOrUndefined(this.popupObj) && closest(target, this.checkSelector(this.popupObj.element.id))) &&\n !isNullOrUndefined(this.inputWrapper) && !this.inputWrapper.container.contains(e.target)) {\n if (this.inputWrapper.container.classList.contains(dropDownListClasses.inputFocus) || this.isPopupOpen) {\n this.isDocumentClick = true;\n var isActive = this.isRequested;\n if (this.getModuleName() === 'combobox' && this.isTyped) {\n this.isInteracted = false;\n }\n this.hidePopup(e);\n this.isInteracted = false;\n if (!isActive) {\n this.onFocusOut(e);\n this.inputWrapper.container.classList.remove(dropDownListClasses.inputFocus);\n }\n }\n }\n else if (target !== this.inputElement && !(this.allowFiltering && target === this.filterInput)\n && !(this.getModuleName() === 'combobox' &&\n !this.allowFiltering && Browser.isDevice && target === this.inputWrapper.buttons[0])) {\n this.isPreventBlur = (Browser.isIE || Browser.info.name === 'edge') && (document.activeElement === this.targetElement() ||\n document.activeElement === this.filterInput);\n e.preventDefault();\n }\n };\n DropDownList.prototype.activeStateChange = function () {\n if (this.isDocumentClick) {\n this.hidePopup();\n this.onFocusOut();\n this.inputWrapper.container.classList.remove(dropDownListClasses.inputFocus);\n }\n };\n DropDownList.prototype.focusDropDown = function (e) {\n if (!this.initial && this.isFilterLayout()) {\n this.focusIn(e);\n }\n };\n DropDownList.prototype.dropDownClick = function (e) {\n if (e.which === 3 || e.button === 2) {\n return;\n }\n this.keyboardEvent = null;\n if (this.targetElement().classList.contains(dropDownListClasses.disable) || this.inputWrapper.clearButton === e.target) {\n return;\n }\n var target = e.target;\n if (target !== this.inputElement && !(this.allowFiltering && target === this.filterInput) && this.getModuleName() !== 'combobox') {\n e.preventDefault();\n }\n if (!this.readonly) {\n if (this.isPopupOpen) {\n this.hidePopup(e);\n if (this.isFilterLayout()) {\n this.focusDropDown(e);\n }\n }\n else {\n this.focusIn(e);\n this.floatLabelChange();\n this.queryString = this.inputElement.value.trim() === '' ? null : this.inputElement.value;\n this.isDropDownClick = true;\n this.showPopup(e);\n }\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var proxy_1 = this;\n // eslint-disable-next-line max-len\n var duration = (this.element.tagName === this.getNgDirective() && this.itemTemplate) ? 500 : 100;\n if (!this.isSecondClick) {\n setTimeout(function () {\n proxy_1.cloneElements();\n proxy_1.isSecondClick = true;\n }, duration);\n }\n }\n else {\n this.focusIn(e);\n }\n };\n DropDownList.prototype.cloneElements = function () {\n if (this.list) {\n var ulElement = this.list.querySelector('ul');\n if (ulElement) {\n ulElement = ulElement.cloneNode ? ulElement.cloneNode(true) : ulElement;\n this.actionCompleteData.ulElement = ulElement;\n }\n }\n };\n DropDownList.prototype.updateSelectedItem = function (li, e, preventSelect, isSelection) {\n var _this = this;\n this.removeSelection();\n li.classList.add(dropDownBaseClasses.selected);\n this.removeHover();\n var value = li.getAttribute('data-value') !== \"null\" ? this.getFormattedValue(li.getAttribute('data-value')) : null;\n var selectedData = this.getDataByValue(value);\n if (!this.initial && !preventSelect && !isNullOrUndefined(e)) {\n var items = this.detachChanges(selectedData);\n this.isSelected = true;\n var eventArgs = {\n e: e,\n item: li,\n itemData: items,\n isInteracted: e ? true : false,\n cancel: false\n };\n this.trigger('select', eventArgs, function (eventArgs) {\n if (eventArgs.cancel) {\n li.classList.remove(dropDownBaseClasses.selected);\n }\n else {\n _this.selectEventCallback(li, e, preventSelect, selectedData, value);\n if (isSelection) {\n _this.setSelectOptions(li, e);\n }\n }\n });\n }\n else {\n this.selectEventCallback(li, e, preventSelect, selectedData, value);\n if (isSelection) {\n this.setSelectOptions(li, e);\n }\n }\n };\n DropDownList.prototype.selectEventCallback = function (li, e, preventSelect, selectedData, value) {\n this.previousItemData = (!isNullOrUndefined(this.itemData)) ? this.itemData : null;\n if (this.itemData != selectedData) {\n this.previousValue = (!isNullOrUndefined(this.itemData)) ? typeof this.itemData == \"object\" && !this.allowObjectBinding ? this.checkFieldValue(this.itemData, this.fields.value.split('.')) : this.itemData : null;\n }\n this.item = li;\n this.itemData = selectedData;\n var focusedItem = this.list.querySelector('.' + dropDownBaseClasses.focus);\n if (focusedItem) {\n removeClass([focusedItem], dropDownBaseClasses.focus);\n }\n li.setAttribute('aria-selected', 'true');\n if (isNullOrUndefined(value)) {\n value = 'null';\n }\n if (this.allowFiltering && !this.enableVirtualization && this.getModuleName() !== 'autocomplete') {\n var filterIndex = this.getIndexByValueFilter(value, this.actionCompleteData.ulElement);\n if (!isNullOrUndefined(filterIndex)) {\n this.activeIndex = filterIndex;\n }\n else {\n this.activeIndex = this.getIndexByValue(value);\n }\n }\n else {\n if (this.enableVirtualization && this.activeIndex == null && this.dataSource instanceof DataManager) {\n this.UpdateSkeleton();\n this.liCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n this.ulElement = this.list.querySelector('ul');\n }\n this.activeIndex = this.getIndexByValue(value);\n }\n };\n DropDownList.prototype.activeItem = function (li) {\n if (this.isValidLI(li) && !li.classList.contains(dropDownBaseClasses.selected)) {\n this.removeSelection();\n li.classList.add(dropDownBaseClasses.selected);\n this.removeHover();\n li.setAttribute('aria-selected', 'true');\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DropDownList.prototype.setValue = function (e) {\n var dataItem = this.getItemData();\n if (dataItem.value === null) {\n Input.setValue(null, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n else {\n Input.setValue(dataItem.text, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n if (this.valueTemplate && this.itemData !== null) {\n this.setValueTemplate();\n }\n else if (!isNullOrUndefined(this.valueTempElement) && this.inputElement.previousSibling === this.valueTempElement) {\n detach(this.valueTempElement);\n this.inputElement.style.display = 'block';\n }\n if (!isNullOrUndefined(dataItem.value) && !this.enableVirtualization && this.allowFiltering) {\n this.activeIndex = this.getIndexByValueFilter(dataItem.value, this.actionCompleteData.ulElement);\n }\n var clearIcon = dropDownListClasses.clearIcon;\n var isFilterElement = this.isFiltering() && this.filterInput && (this.getModuleName() === 'combobox');\n var clearElement = isFilterElement && this.filterInput.parentElement.querySelector('.' + clearIcon);\n if (this.isFiltering() && clearElement) {\n clearElement.style.removeProperty('visibility');\n }\n if ((!this.allowObjectBinding && (this.previousValue === dataItem.value)) || (this.allowObjectBinding && (this.previousValue != null && this.isObjectInArray(this.previousValue, [this.allowCustom && this.isObjectCustomValue ? this.value ? this.value : dataItem : dataItem.value ? this.getDataByValue(dataItem.value) : dataItem])))) {\n this.isSelected = false;\n return true;\n }\n else {\n this.isSelected = !this.initial ? true : false;\n this.isSelectCustom = false;\n if (this.getModuleName() === 'dropdownlist') {\n this.updateIconState();\n }\n return false;\n }\n };\n DropDownList.prototype.setSelection = function (li, e) {\n if (this.isValidLI(li) && (!li.classList.contains(dropDownBaseClasses.selected) || (this.isPopupOpen && this.isSelected\n && li.classList.contains(dropDownBaseClasses.selected)))) {\n this.updateSelectedItem(li, e, false, true);\n }\n else {\n this.setSelectOptions(li, e);\n if (this.enableVirtualization && this.value) {\n var fields = (this.fields.value) ? this.fields.value : '';\n var currentValue = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n if (this.dataSource instanceof DataManager) {\n var getItem = new DataManager(this.virtualGroupDataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue)));\n if (getItem && getItem.length > 0) {\n this.itemData = getItem[0];\n var dataItem = this.getItemData();\n var value = this.allowObjectBinding ? this.getDataByValue(dataItem.value) : dataItem.value;\n if ((this.value === dataItem.value && this.text !== dataItem.text) || (this.value !== dataItem.value && this.text === dataItem.text)) {\n this.setProperties({ 'text': dataItem.text, 'value': value });\n }\n }\n }\n else {\n var getItem = new DataManager(this.dataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue)));\n if (getItem && getItem.length > 0) {\n this.itemData = getItem[0];\n var dataItem = this.getItemData();\n var value = this.allowObjectBinding ? this.getDataByValue(dataItem.value) : dataItem.value;\n if ((this.value === dataItem.value && this.text !== dataItem.text) || (this.value !== dataItem.value && this.text === dataItem.text)) {\n this.setProperties({ 'text': dataItem.text, 'value': value });\n }\n }\n }\n }\n }\n };\n DropDownList.prototype.setSelectOptions = function (li, e) {\n if (this.list) {\n this.removeHover();\n }\n this.previousSelectedLI = (!isNullOrUndefined(this.selectedLI)) ? this.selectedLI : null;\n this.selectedLI = li;\n if (this.setValue(e)) {\n return;\n }\n if ((!this.isPopupOpen && !isNullOrUndefined(li)) || (this.isPopupOpen && !isNullOrUndefined(e) &&\n (e.type !== 'keydown' || e.type === 'keydown' && e.action === 'enter'))) {\n this.isSelectCustom = false;\n this.onChangeEvent(e);\n }\n if (this.isPopupOpen && !isNullOrUndefined(this.selectedLI) && this.itemData !== null && (!e || e.type !== 'click')) {\n this.setScrollPosition(e);\n }\n if (Browser.info.name !== 'mozilla') {\n if (this.targetElement()) {\n attributes(this.targetElement(), { 'aria-describedby': this.inputElement.id !== '' ? this.inputElement.id : this.element.id });\n this.targetElement().removeAttribute('aria-live');\n }\n }\n if (this.isPopupOpen && !isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-item-focus')[0])) {\n attributes(this.targetElement(), { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-item-focus')[0].id });\n }\n else if (this.isPopupOpen && !isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-active')[0])) {\n attributes(this.targetElement(), { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-active')[0].id });\n }\n };\n DropDownList.prototype.dropdownCompiler = function (dropdownTemplate) {\n var checkTemplate = false;\n if (typeof dropdownTemplate !== 'function' && dropdownTemplate) {\n try {\n checkTemplate = (document.querySelectorAll(dropdownTemplate).length) ? true : false;\n }\n catch (exception) {\n checkTemplate = false;\n }\n }\n return checkTemplate;\n };\n DropDownList.prototype.setValueTemplate = function () {\n var compiledString;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isReact) {\n this.clearTemplate(['valueTemplate']);\n if (this.valueTempElement) {\n detach(this.valueTempElement);\n this.inputElement.style.display = 'block';\n this.valueTempElement = null;\n }\n }\n if (!this.valueTempElement) {\n this.valueTempElement = this.createElement('span', { className: dropDownListClasses.value });\n this.inputElement.parentElement.insertBefore(this.valueTempElement, this.inputElement);\n this.inputElement.style.display = 'none';\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (!this.isReact) {\n this.valueTempElement.innerHTML = '';\n }\n var valuecheck = this.dropdownCompiler(this.valueTemplate);\n if (typeof this.valueTemplate !== 'function' && valuecheck) {\n compiledString = compile(document.querySelector(this.valueTemplate).innerHTML.trim());\n }\n else {\n compiledString = compile(this.valueTemplate);\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var valueCompTemp = compiledString(this.itemData, this, 'valueTemplate', this.valueTemplateId, this.isStringTemplate, null, this.valueTempElement);\n if (valueCompTemp && valueCompTemp.length > 0) {\n append(valueCompTemp, this.valueTempElement);\n }\n this.renderReactTemplates();\n };\n DropDownList.prototype.removeSelection = function () {\n if (this.list) {\n var selectedItems = this.list.querySelectorAll('.' + dropDownBaseClasses.selected);\n if (selectedItems.length) {\n removeClass(selectedItems, dropDownBaseClasses.selected);\n selectedItems[0].removeAttribute('aria-selected');\n }\n }\n };\n DropDownList.prototype.getItemData = function () {\n var fields = this.fields;\n var dataItem = null;\n dataItem = this.itemData;\n var dataValue;\n var dataText;\n if (!isNullOrUndefined(dataItem)) {\n dataValue = getValue(fields.value, dataItem);\n dataText = getValue(fields.text, dataItem);\n }\n var value = (!isNullOrUndefined(dataItem) &&\n !isUndefined(dataValue) ? dataValue : dataItem);\n var text = (!isNullOrUndefined(dataItem) &&\n !isUndefined(dataValue) ? dataText : dataItem);\n return { value: value, text: text };\n };\n /**\n * To trigger the change event for list.\n *\n * @param {MouseEvent | KeyboardEvent | TouchEvent} eve - Specifies the event arguments.\n * @returns {void}\n */\n DropDownList.prototype.onChangeEvent = function (eve, isCustomValue) {\n var _this = this;\n var dataItem = this.getItemData();\n var index = this.isSelectCustom ? null : this.activeIndex;\n if (this.enableVirtualization) {\n var datas = this.dataSource instanceof DataManager ? this.virtualGroupDataSource : this.dataSource;\n if (dataItem.value && datas && datas.length > 0) {\n var foundIndex = datas.findIndex(function (data) {\n return !isNullOrUndefined(dataItem.value) && getValue(_this.fields.value, data) === dataItem.value;\n });\n if (foundIndex !== -1) {\n index = foundIndex;\n }\n }\n }\n var value = this.allowObjectBinding ? isCustomValue ? this.value : this.getDataByValue(dataItem.value) : dataItem.value;\n this.setProperties({ 'index': index, 'text': dataItem.text, 'value': value }, true);\n this.detachChangeEvent(eve);\n };\n DropDownList.prototype.detachChanges = function (value) {\n var items;\n if (typeof value === 'string' ||\n typeof value === 'boolean' ||\n typeof value === 'number') {\n items = Object.defineProperties({}, {\n value: {\n value: value,\n enumerable: true\n },\n text: {\n value: value,\n enumerable: true\n }\n });\n }\n else {\n items = value;\n }\n return items;\n };\n DropDownList.prototype.detachChangeEvent = function (eve) {\n this.isSelected = false;\n this.previousValue = this.value;\n this.activeIndex = this.enableVirtualization ? this.getIndexByValue(this.value) : this.index;\n this.typedString = !isNullOrUndefined(this.text) ? this.text : '';\n if (!this.initial) {\n var items = this.detachChanges(this.itemData);\n var preItems = void 0;\n if (typeof this.previousItemData === 'string' ||\n typeof this.previousItemData === 'boolean' ||\n typeof this.previousItemData === 'number') {\n preItems = Object.defineProperties({}, {\n value: {\n value: this.previousItemData,\n enumerable: true\n },\n text: {\n value: this.previousItemData,\n enumerable: true\n }\n });\n }\n else {\n preItems = this.previousItemData;\n }\n this.setHiddenValue();\n var eventArgs = {\n e: eve,\n item: this.item,\n itemData: items,\n previousItem: this.previousSelectedLI,\n previousItemData: preItems,\n isInteracted: eve ? true : false,\n value: this.value,\n element: this.element,\n event: eve\n };\n if (this.isAngular && this.preventChange) {\n this.preventChange = false;\n }\n else {\n this.trigger('change', eventArgs);\n }\n }\n if ((isNullOrUndefined(this.value) || this.value === '') && this.floatLabelType !== 'Always') {\n removeClass([this.inputWrapper.container], 'e-valid-input');\n }\n };\n DropDownList.prototype.setHiddenValue = function () {\n if (!isNullOrUndefined(this.value)) {\n var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n if (this.hiddenElement.querySelector('option')) {\n var selectedElement = this.hiddenElement.querySelector('option');\n selectedElement.textContent = this.text;\n selectedElement.setAttribute('value', value.toString());\n }\n else {\n if (!isNullOrUndefined(this.hiddenElement)) {\n this.hiddenElement.innerHTML = '';\n var selectedElement = this.hiddenElement.querySelector('option');\n selectedElement.setAttribute('value', value.toString());\n }\n }\n }\n else {\n this.hiddenElement.innerHTML = '';\n }\n };\n /**\n * Filter bar implementation\n *\n * @param {KeyboardEventArgs} e - Specifies the event arguments.\n * @returns {void}\n */\n DropDownList.prototype.onFilterUp = function (e) {\n if (!(e.ctrlKey && e.keyCode === 86) && (this.isValidKey || e.keyCode === 40 || e.keyCode === 38)) {\n this.isValidKey = false;\n this.firstItem = this.dataSource && this.dataSource.length > 0 ? this.dataSource[0] : null;\n switch (e.keyCode) {\n case 38: //up arrow\n case 40: //down arrow\n if (this.getModuleName() === 'autocomplete' && !this.isPopupOpen && !this.preventAltUp && !this.isRequested) {\n this.preventAutoFill = true;\n this.searchLists(e);\n }\n else {\n this.preventAutoFill = false;\n }\n this.preventAltUp = false;\n if (this.getModuleName() === 'autocomplete' && !isNullOrUndefined(this.ulElement) && !isNullOrUndefined(this.ulElement.getElementsByClassName('e-item-focus')[0])) {\n attributes(this.targetElement(), { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-item-focus')[0].id });\n }\n e.preventDefault();\n break;\n case 46: //delete\n case 8: //backspace\n this.typedString = this.filterInput.value;\n if (!this.isPopupOpen && this.typedString !== '' || this.isPopupOpen && this.queryString.length > 0) {\n this.preventAutoFill = true;\n this.searchLists(e);\n }\n else if (this.typedString === '' && this.queryString === '' && this.getModuleName() !== 'autocomplete') {\n this.preventAutoFill = true;\n this.searchLists(e);\n }\n else if (this.typedString === '') {\n if (this.list) {\n this.resetFocusElement();\n }\n this.activeIndex = null;\n if (this.getModuleName() !== 'dropdownlist') {\n this.preventAutoFill = true;\n this.searchLists(e);\n if (this.getModuleName() === 'autocomplete') {\n this.hidePopup();\n }\n }\n }\n e.preventDefault();\n break;\n default:\n if (this.isFiltering() && this.getModuleName() === 'combobox' && isNullOrUndefined(this.list)) {\n this.getInitialData = true;\n this.renderList();\n }\n this.typedString = this.filterInput.value;\n this.preventAutoFill = false;\n this.searchLists(e);\n if ((this.enableVirtualization && this.getModuleName() !== 'autocomplete') || (this.getModuleName() === 'autocomplete' && !(this.dataSource instanceof DataManager)) || (this.getModuleName() === 'autocomplete' && (this.dataSource instanceof DataManager) && this.totalItemCount != 0)) {\n this.getFilteringSkeletonCount();\n }\n break;\n }\n }\n else {\n this.isValidKey = false;\n }\n };\n DropDownList.prototype.onFilterDown = function (e) {\n switch (e.keyCode) {\n case 13: //enter\n break;\n case 40: //down arrow\n case 38: //up arrow\n this.queryString = this.filterInput.value;\n e.preventDefault();\n break;\n case 9: //tab\n if (this.isPopupOpen && this.getModuleName() !== 'autocomplete') {\n e.preventDefault();\n }\n break;\n default:\n this.prevSelectPoints = this.getSelectionPoints();\n this.queryString = this.filterInput.value;\n break;\n }\n };\n DropDownList.prototype.removeFillSelection = function () {\n if (this.isInteracted) {\n var selection = this.getSelectionPoints();\n this.inputElement.setSelectionRange(selection.end, selection.end);\n }\n };\n DropDownList.prototype.getQuery = function (query) {\n var filterQuery;\n if (!this.isCustomFilter && this.allowFiltering && this.filterInput) {\n filterQuery = query ? query.clone() : this.query ? this.query.clone() : new Query();\n var filterType = this.typedString === '' ? 'contains' : this.filterType;\n var dataType = this.typeOfData(this.dataSource).typeof;\n if (!(this.dataSource instanceof DataManager) && dataType === 'string' || dataType === 'number') {\n filterQuery.where('', filterType, this.typedString, this.ignoreCase, this.ignoreAccent);\n }\n else if (((this.getModuleName() !== 'combobox')) || (this.isFiltering() && this.getModuleName() === 'combobox' && this.typedString !== '')) {\n var fields = (this.fields.text) ? this.fields.text : '';\n filterQuery.where(fields, filterType, this.typedString, this.ignoreCase, this.ignoreAccent);\n }\n }\n else {\n filterQuery = (this.enableVirtualization && !isNullOrUndefined(this.customFilterQuery)) ? this.customFilterQuery.clone() : query ? query.clone() : this.query ? this.query.clone() : new Query();\n }\n if (this.enableVirtualization && this.viewPortInfo.endIndex != 0) {\n var takeValue = this.getTakeValue();\n var alreadySkipAdded = false;\n if (filterQuery) {\n for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {\n if (filterQuery.queries[queryElements].fn === 'onSkip') {\n alreadySkipAdded = true;\n break;\n }\n }\n }\n var queryTakeValue = 0;\n var querySkipValue = 0;\n if (filterQuery && filterQuery.queries.length > 0) {\n for (var queryElements_1 = 0; queryElements_1 < filterQuery.queries.length; queryElements_1++) {\n if (filterQuery.queries[queryElements_1].fn === 'onSkip') {\n querySkipValue = filterQuery.queries[queryElements_1].e.nos;\n }\n if (filterQuery.queries[queryElements_1].fn === 'onTake') {\n queryTakeValue = takeValue <= filterQuery.queries[queryElements_1].e.nos ? filterQuery.queries[queryElements_1].e.nos : takeValue;\n }\n }\n }\n if (queryTakeValue <= 0 && this.query && this.query.queries.length > 0) {\n for (var queryElements_2 = 0; queryElements_2 < this.query.queries.length; queryElements_2++) {\n if (this.query.queries[queryElements_2].fn === 'onTake') {\n queryTakeValue = takeValue <= this.query.queries[queryElements_2].e.nos ? this.query.queries[queryElements_2].e.nos : takeValue;\n }\n }\n }\n var skipExists = false;\n if (filterQuery && filterQuery.queries.length > 0) {\n for (var queryElements_3 = 0; queryElements_3 < filterQuery.queries.length; queryElements_3++) {\n if (filterQuery.queries[queryElements_3].fn === 'onSkip') {\n querySkipValue = filterQuery.queries[queryElements_3].e.nos;\n filterQuery.queries.splice(queryElements_3, 1);\n --queryElements_3;\n continue;\n }\n if (filterQuery.queries[queryElements_3].fn === 'onTake') {\n queryTakeValue = filterQuery.queries[queryElements_3].e.nos <= queryTakeValue ? queryTakeValue : filterQuery.queries[queryElements_3].e.nos;\n filterQuery.queries.splice(queryElements_3, 1);\n --queryElements_3;\n }\n }\n }\n if (!skipExists && (this.allowFiltering || !this.isPopupOpen || !alreadySkipAdded)) {\n if (querySkipValue > 0) {\n filterQuery.skip(querySkipValue);\n }\n else {\n filterQuery.skip(this.virtualItemStartIndex);\n }\n }\n if (this.isIncrementalRequest) {\n filterQuery.take(this.incrementalEndIndex);\n }\n else {\n if (queryTakeValue > 0) {\n filterQuery.take(queryTakeValue);\n }\n else {\n filterQuery.take(takeValue);\n }\n }\n filterQuery.requiresCount();\n }\n return filterQuery;\n };\n DropDownList.prototype.getSelectionPoints = function () {\n var input = this.inputElement;\n return { start: Math.abs(input.selectionStart), end: Math.abs(input.selectionEnd) };\n };\n DropDownList.prototype.searchLists = function (e) {\n var _this = this;\n this.isTyped = true;\n this.activeIndex = null;\n this.isListSearched = true;\n if (this.filterInput.parentElement.querySelector('.' + dropDownListClasses.clearIcon)) {\n var clearElement = this.filterInput.parentElement.querySelector('.' + dropDownListClasses.clearIcon);\n clearElement.style.visibility = this.filterInput.value === '' ? 'hidden' : 'visible';\n }\n this.isDataFetched = false;\n if (this.isFiltering()) {\n this.checkAndResetCache();\n var eventArgs_1 = {\n preventDefaultAction: false,\n text: this.filterInput.value,\n updateData: function (dataSource, query, fields) {\n if (eventArgs_1.cancel) {\n return;\n }\n _this.isCustomFilter = true;\n _this.customFilterQuery = query.clone();\n _this.filteringAction(dataSource, query, fields);\n },\n baseEventArgs: e,\n cancel: false\n };\n this.trigger('filtering', eventArgs_1, function (eventArgs) {\n if (!eventArgs.cancel && !_this.isCustomFilter && !eventArgs.preventDefaultAction) {\n _this.filteringAction(_this.dataSource, null, _this.fields);\n }\n });\n }\n };\n /**\n * To filter the data from given data source by using query\n *\n * @param {Object[] | DataManager } dataSource - Set the data source to filter.\n * @param {Query} query - Specify the query to filter the data.\n * @param {FieldSettingsModel} fields - Specify the fields to map the column in the data table.\n * @returns {void}\n\n */\n DropDownList.prototype.filter = function (dataSource, query, fields) {\n this.isCustomFilter = true;\n this.filteringAction(dataSource, query, fields);\n };\n DropDownList.prototype.filteringAction = function (dataSource, query, fields) {\n if (!isNullOrUndefined(this.filterInput)) {\n this.beforePopupOpen = ((!this.isPopupOpen && this.getModuleName() === 'combobox' && this.filterInput.value === '') || this.getInitialData) ?\n false : true;\n var isNoData = this.list.classList.contains(dropDownBaseClasses.noData);\n if (this.filterInput.value.trim() === '' && !this.itemTemplate) {\n this.actionCompleteData.isUpdated = false;\n this.isTyped = false;\n if (!isNullOrUndefined(this.actionCompleteData.ulElement) && !isNullOrUndefined(this.actionCompleteData.list)) {\n if (this.enableVirtualization) {\n if (this.isFiltering()) {\n this.isPreventScrollAction = true;\n this.list.scrollTop = 0;\n this.previousStartIndex = 0;\n this.virtualListInfo = null;\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.totalItemCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;\n this.resetList(dataSource, fields, query);\n if (isNoData && !this.list.classList.contains(dropDownBaseClasses.noData)) {\n if (!this.list.querySelector('.e-virtual-ddl-content')) {\n this.list.appendChild(this.createElement('div', {\n className: 'e-virtual-ddl-content',\n styles: this.getTransformValues()\n })).appendChild(this.list.querySelector('.e-list-parent'));\n }\n if (!this.list.querySelector('.e-virtual-ddl')) {\n var virualElement = this.createElement('div', {\n id: this.element.id + '_popup', className: 'e-virtual-ddl', styles: this.GetVirtualTrackHeight()\n });\n document.getElementsByClassName('e-popup')[0].querySelector('.e-dropdownbase').appendChild(virualElement);\n }\n }\n }\n this.onActionComplete(this.actionCompleteData.ulElement, this.actionCompleteData.list);\n }\n this.isTyped = true;\n if (!isNullOrUndefined(this.itemData) && this.getModuleName() === 'dropdownlist') {\n this.focusIndexItem();\n this.setScrollPosition();\n }\n this.isNotSearchList = true;\n }\n else {\n this.isNotSearchList = false;\n query = (this.filterInput.value.trim() === '') ? null : query;\n if (this.enableVirtualization && this.isFiltering() && this.isTyped) {\n this.isPreventScrollAction = true;\n this.list.scrollTop = 0;\n this.previousStartIndex = 0;\n this.virtualListInfo = null;\n }\n this.resetList(dataSource, fields, query);\n if (this.getModuleName() === 'dropdownlist' && this.list.classList.contains(dropDownBaseClasses.noData)) {\n this.popupContentElement.setAttribute('role', 'status');\n this.popupContentElement.setAttribute('id', 'no-record');\n attributes(this.filterInputObj.container, { 'aria-activedescendant': 'no-record' });\n }\n if (this.enableVirtualization && isNoData && !this.list.classList.contains(dropDownBaseClasses.noData)) {\n if (!this.list.querySelector('.e-virtual-ddl-content')) {\n this.list.appendChild(this.createElement('div', {\n className: 'e-virtual-ddl-content',\n styles: this.getTransformValues()\n })).appendChild(this.list.querySelector('.e-list-parent'));\n }\n if (!this.list.querySelector('.e-virtual-ddl')) {\n var virualElement = this.createElement('div', {\n id: this.element.id + '_popup', className: 'e-virtual-ddl', styles: this.GetVirtualTrackHeight()\n });\n document.getElementsByClassName('e-popup')[0].querySelector('.e-dropdownbase').appendChild(virualElement);\n }\n }\n }\n if (this.enableVirtualization) {\n this.getFilteringSkeletonCount();\n }\n this.renderReactTemplates();\n }\n };\n DropDownList.prototype.setSearchBox = function (popupElement) {\n if (this.isFiltering()) {\n var parentElement = popupElement.querySelector('.' + dropDownListClasses.filterParent) ?\n popupElement.querySelector('.' + dropDownListClasses.filterParent) : this.createElement('span', {\n className: dropDownListClasses.filterParent\n });\n this.filterInput = this.createElement('input', {\n attrs: { type: 'text' },\n className: dropDownListClasses.filterInput\n });\n this.element.parentNode.insertBefore(this.filterInput, this.element);\n var backIcon = false;\n if (Browser.isDevice) {\n backIcon = true;\n }\n this.filterInputObj = Input.createInput({\n element: this.filterInput,\n buttons: backIcon ?\n [dropDownListClasses.backIcon, dropDownListClasses.filterBarClearIcon] : [dropDownListClasses.filterBarClearIcon],\n properties: { placeholder: this.filterBarPlaceholder }\n }, this.createElement);\n if (!isNullOrUndefined(this.cssClass)) {\n if (this.cssClass.split(' ').indexOf('e-outline') !== -1) {\n addClass([this.filterInputObj.container], 'e-outline');\n }\n else if (this.cssClass.split(' ').indexOf('e-filled') !== -1) {\n addClass([this.filterInputObj.container], 'e-filled');\n }\n }\n append([this.filterInputObj.container], parentElement);\n prepend([parentElement], popupElement);\n attributes(this.filterInput, {\n 'aria-disabled': 'false',\n 'role': 'combobox',\n 'autocomplete': 'off',\n 'autocapitalize': 'off',\n 'spellcheck': 'false'\n });\n this.clearIconElement = this.filterInput.parentElement.querySelector('.' + dropDownListClasses.clearIcon);\n if (!Browser.isDevice && this.clearIconElement) {\n EventHandler.add(this.clearIconElement, 'click', this.clearText, this);\n this.clearIconElement.style.visibility = 'hidden';\n }\n if (!Browser.isDevice) {\n this.searchKeyModule = new KeyboardEvents(this.filterInput, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: this.keyConfigure,\n eventName: 'keydown'\n });\n }\n else {\n this.searchKeyModule = new KeyboardEvents(this.filterInput, {\n keyAction: this.mobileKeyActionHandler.bind(this),\n keyConfigs: this.keyConfigure,\n eventName: 'keydown'\n });\n }\n EventHandler.add(this.filterInput, 'input', this.onInput, this);\n EventHandler.add(this.filterInput, 'keyup', this.onFilterUp, this);\n EventHandler.add(this.filterInput, 'keydown', this.onFilterDown, this);\n EventHandler.add(this.filterInput, 'blur', this.onBlurHandler, this);\n EventHandler.add(this.filterInput, 'paste', this.pasteHandler, this);\n return this.filterInputObj;\n }\n else {\n return inputObject;\n }\n };\n DropDownList.prototype.onInput = function (e) {\n this.isValidKey = true;\n if (this.getModuleName() === 'combobox') {\n this.updateIconState();\n }\n // For filtering works in mobile firefox.\n if (Browser.isDevice && Browser.info.name === 'mozilla') {\n this.typedString = this.filterInput.value;\n this.preventAutoFill = true;\n this.searchLists(e);\n }\n };\n DropDownList.prototype.pasteHandler = function (e) {\n var _this = this;\n setTimeout(function () {\n _this.typedString = _this.filterInput.value;\n _this.searchLists(e);\n });\n };\n DropDownList.prototype.onActionFailure = function (e) {\n _super.prototype.onActionFailure.call(this, e);\n if (this.beforePopupOpen) {\n this.renderPopup();\n }\n };\n DropDownList.prototype.getTakeValue = function () {\n return this.allowFiltering && this.getModuleName() === 'dropdownlist' && Browser.isDevice ? Math.round(window.outerHeight / this.listItemHeight) : this.itemCount;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DropDownList.prototype.onActionComplete = function (ulElement, list, e, isUpdated) {\n var _this = this;\n if (this.dataSource instanceof DataManager && !isNullOrUndefined(e) && !this.virtualGroupDataSource) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.totalItemCount = e.count;\n }\n if (this.isNotSearchList && !this.enableVirtualization) {\n this.isNotSearchList = false;\n return;\n }\n if (this.getInitialData) {\n this.updateActionCompleteDataValues(ulElement, list);\n }\n if (!this.preventPopupOpen && this.getModuleName() === 'combobox') {\n this.beforePopupOpen = true;\n this.preventPopupOpen = true;\n }\n var tempItemCount = this.itemCount;\n if (this.isActive || !isNullOrUndefined(ulElement)) {\n var selectedItem = this.selectedLI ? this.selectedLI.cloneNode(true) : null;\n _super.prototype.onActionComplete.call(this, ulElement, list, e);\n this.skeletonCount = this.totalItemCount != 0 && this.totalItemCount < (this.itemCount * 2) ? 0 : this.skeletonCount;\n this.updateSelectElementData(this.allowFiltering);\n if (this.isRequested && !isNullOrUndefined(this.searchKeyEvent) && this.searchKeyEvent.type === 'keydown') {\n this.isRequested = false;\n this.keyActionHandler(this.searchKeyEvent);\n this.searchKeyEvent = null;\n }\n if (this.isRequested && !isNullOrUndefined(this.searchKeyEvent)) {\n this.incrementalSearch(this.searchKeyEvent);\n this.searchKeyEvent = null;\n }\n if (!this.enableVirtualization) {\n this.list.scrollTop = 0;\n }\n if (!isNullOrUndefined(ulElement)) {\n attributes(ulElement, { 'id': this.element.id + '_options', 'role': 'listbox', 'aria-hidden': 'false', 'aria-label': 'listbox' });\n }\n if (this.initialRemoteRender) {\n this.initial = true;\n this.activeIndex = this.index;\n this.initialRemoteRender = false;\n if (this.value && this.dataSource instanceof DataManager) {\n var checkField_1 = isNullOrUndefined(this.fields.value) ? this.fields.text : this.fields.value;\n var value_5 = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue(checkField_1, this.value) : this.value;\n var fieldValue_1 = this.fields.value.split('.');\n var checkVal = list.some(function (x) {\n return isNullOrUndefined(x[checkField_1]) && fieldValue_1.length > 1 ?\n _this.checkFieldValue(x, fieldValue_1) === value_5 : x[checkField_1] === value_5;\n });\n if (this.enableVirtualization && this.virtualGroupDataSource) {\n checkVal = this.virtualGroupDataSource.some(function (x) {\n return isNullOrUndefined(x[checkField_1]) && fieldValue_1.length > 1 ?\n _this.checkFieldValue(x, fieldValue_1) === value_5 : x[checkField_1] === value_5;\n });\n }\n if (!checkVal) {\n this.dataSource.executeQuery(this.getQuery(this.query).where(new Predicate(checkField_1, 'equal', value_5)))\n .then(function (e) {\n if (e.result.length > 0) {\n _this.addItem(e.result, list.length);\n _this.updateValues();\n }\n else {\n _this.updateValues();\n }\n });\n }\n else {\n this.updateValues();\n }\n }\n else {\n this.updateValues();\n }\n this.initial = false;\n }\n else if (this.getModuleName() === 'autocomplete' && this.value) {\n this.setInputValue();\n }\n if (this.getModuleName() !== 'autocomplete' && this.isFiltering() && !this.isTyped) {\n if (!this.actionCompleteData.isUpdated || ((!this.isCustomFilter\n && !this.isFilterFocus) || (isNullOrUndefined(this.itemData) && this.allowFiltering)\n && ((this.dataSource instanceof DataManager)\n || (!isNullOrUndefined(this.dataSource) && !isNullOrUndefined(this.dataSource.length) &&\n this.dataSource.length !== 0)))) {\n if (this.itemTemplate && this.element.tagName === 'EJS-COMBOBOX' && this.allowFiltering) {\n setTimeout(function () {\n _this.updateActionCompleteDataValues(ulElement, list);\n }, 0);\n }\n else {\n this.updateActionCompleteDataValues(ulElement, list);\n }\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if ((this.allowCustom || (this.allowFiltering && !this.isValueInList(list, this.value) && this.dataSource instanceof DataManager)) && !this.enableVirtualization) {\n this.addNewItem(list, selectedItem);\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n else if ((this.allowCustom || (this.allowFiltering && this.isValueInList(list, this.value))) && !this.enableVirtualization) {\n this.addNewItem(list, selectedItem);\n }\n if (!isNullOrUndefined(this.itemData) || (isNullOrUndefined(this.itemData) && this.enableVirtualization)) {\n this.getSkeletonCount();\n this.skeletonCount = this.totalItemCount != 0 && this.totalItemCount < (this.itemCount * 2) ? 0 : this.skeletonCount;\n this.UpdateSkeleton();\n this.focusIndexItem();\n }\n if (this.enableVirtualization) {\n this.updateActionCompleteDataValues(ulElement, list);\n }\n }\n else if (this.enableVirtualization && this.getModuleName() !== 'autocomplete' && !this.isFiltering()) {\n var value = this.getItemData().value;\n this.activeIndex = this.getIndexByValue(value);\n var element = this.findListElement(this.list, 'li', 'data-value', value);\n this.selectedLI = element;\n }\n else if (this.enableVirtualization && this.getModuleName() === 'autocomplete') {\n this.activeIndex = this.skeletonCount;\n }\n if (this.beforePopupOpen) {\n this.renderPopup(e);\n if (this.enableVirtualization) {\n if (!this.list.querySelector('.e-virtual-list')) {\n this.UpdateSkeleton();\n this.liCollections = this.list.querySelectorAll('.e-list-item');\n }\n }\n if (this.enableVirtualization && tempItemCount != this.itemCount) {\n this.resetList(this.dataSource, this.fields);\n }\n }\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n DropDownList.prototype.isValueInList = function (list, valueToFind) {\n if (Array.isArray(list)) {\n for (var i = 0; i < list.length; i++) {\n if (list[i] === valueToFind) {\n return true;\n }\n }\n }\n else if (typeof list === 'object' && list !== null) {\n for (var key in list) {\n if (Object.prototype.hasOwnProperty.call(list, key) && list[key] === valueToFind) {\n return true;\n }\n }\n }\n return false;\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n DropDownList.prototype.checkFieldValue = function (list, fieldValue) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var checkField = list;\n fieldValue.forEach(function (value) {\n checkField = checkField[value];\n });\n return checkField;\n };\n DropDownList.prototype.updateActionCompleteDataValues = function (ulElement, list) {\n this.actionCompleteData = { ulElement: ulElement.cloneNode(true), list: list, isUpdated: true };\n if (this.actionData.list !== this.actionCompleteData.list && this.actionCompleteData.ulElement && this.actionCompleteData.list) {\n this.actionData = this.actionCompleteData;\n }\n };\n DropDownList.prototype.addNewItem = function (listData, newElement) {\n var _this = this;\n if (!isNullOrUndefined(this.itemData) && !isNullOrUndefined(newElement)) {\n var value_6 = this.getItemData().value;\n var isExist = listData.some(function (data) {\n return (((typeof data === 'string' || typeof data === 'number') && data === value_6) ||\n (getValue(_this.fields.value, data) === value_6));\n });\n if (!isExist) {\n this.addItem(this.itemData);\n }\n }\n };\n DropDownList.prototype.updateActionCompleteData = function (li, item, index) {\n var _this = this;\n if (this.getModuleName() !== 'autocomplete' && this.actionCompleteData.ulElement) {\n if (this.itemTemplate && this.element.tagName === 'EJS-COMBOBOX' && this.allowFiltering) {\n setTimeout(function () {\n _this.actionCompleteDataUpdate(li, item, index);\n }, 0);\n }\n else {\n this.actionCompleteDataUpdate(li, item, index);\n }\n }\n };\n DropDownList.prototype.actionCompleteDataUpdate = function (li, item, index) {\n if (index !== null) {\n this.actionCompleteData.ulElement.\n insertBefore(li.cloneNode(true), this.actionCompleteData.ulElement.childNodes[index]);\n }\n else {\n this.actionCompleteData.ulElement.appendChild(li.cloneNode(true));\n }\n if (this.isFiltering() && this.actionCompleteData.list && this.actionCompleteData.list.indexOf(item) < 0) {\n this.actionCompleteData.list.push(item);\n }\n };\n DropDownList.prototype.focusIndexItem = function () {\n var value = this.getItemData().value;\n this.activeIndex = ((this.enableVirtualization && !isNullOrUndefined(value)) || !this.enableVirtualization) ? this.getIndexByValue(value) : this.activeIndex;\n var element = this.findListElement(this.list, 'li', 'data-value', value);\n this.selectedLI = element;\n this.activeItem(element);\n if (!(this.enableVirtualization && isNullOrUndefined(element))) {\n this.removeFocus();\n }\n };\n DropDownList.prototype.updateSelection = function () {\n var selectedItem = this.list.querySelector('.' + dropDownBaseClasses.selected);\n if (selectedItem) {\n this.setProperties({ 'index': this.getIndexByValue(selectedItem.getAttribute('data-value')) });\n this.activeIndex = this.index;\n }\n else {\n this.removeFocus();\n this.list.querySelector('.' + dropDownBaseClasses.li).classList.add(dropDownListClasses.focus);\n }\n };\n DropDownList.prototype.updateSelectionList = function () {\n var selectedItem = this.list && this.list.querySelector('.' + 'e-active');\n if (!selectedItem && !isNullOrUndefined(this.value)) {\n var value = this.allowObjectBinding ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n var findEle = this.findListElement(this.list, 'li', 'data-value', value);\n if (findEle) {\n findEle.classList.add('e-active');\n }\n }\n };\n DropDownList.prototype.removeFocus = function () {\n var highlightedItem = this.list.querySelectorAll('.' + dropDownListClasses.focus);\n if (highlightedItem && highlightedItem.length) {\n removeClass(highlightedItem, dropDownListClasses.focus);\n }\n };\n DropDownList.prototype.renderPopup = function (e) {\n var _this = this;\n if (this.popupObj && document.body.contains(this.popupObj.element)) {\n this.refreshPopup();\n return;\n }\n var args = { cancel: false };\n this.trigger('beforeOpen', args, function (args) {\n if (!args.cancel) {\n var popupEle = _this.createElement('div', {\n id: _this.element.id + '_popup', className: 'e-ddl e-popup ' + (_this.cssClass !== null ? _this.cssClass : '')\n });\n popupEle.setAttribute('aria-label', _this.element.id);\n popupEle.setAttribute('role', 'dialog');\n var searchBox = _this.setSearchBox(popupEle);\n _this.listContainerHeight = _this.allowFiltering && _this.getModuleName() === 'dropdownlist' && Browser.isDevice ? formatUnit(Math.round(window.outerHeight).toString() + 'px') : formatUnit(_this.popupHeight);\n if (_this.headerTemplate) {\n _this.setHeaderTemplate(popupEle);\n }\n append([_this.list], popupEle);\n if (_this.footerTemplate) {\n _this.setFooterTemplate(popupEle);\n }\n document.body.appendChild(popupEle);\n popupEle.style.top = '0px';\n if (_this.enableVirtualization && _this.itemTemplate) {\n var listitems = popupEle.querySelectorAll('li.e-list-item:not(.e-virtual-list)');\n _this.listItemHeight = listitems.length > 0 ? Math.ceil(listitems[0].getBoundingClientRect().height) : 0;\n }\n if (_this.enableVirtualization && !_this.list.classList.contains(dropDownBaseClasses.noData)) {\n _this.getSkeletonCount();\n _this.skeletonCount = _this.totalItemCount < (_this.itemCount * 2) ? 0 : _this.skeletonCount;\n if (!_this.list.querySelector('.e-virtual-ddl-content')) {\n _this.list.appendChild(_this.createElement('div', {\n className: 'e-virtual-ddl-content',\n styles: _this.getTransformValues()\n })).appendChild(_this.list.querySelector('.e-list-parent'));\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n _this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = _this.getTransformValues();\n }\n _this.UpdateSkeleton();\n _this.liCollections = _this.list.querySelectorAll('.' + dropDownBaseClasses.li);\n _this.virtualItemCount = _this.itemCount;\n if (!_this.list.querySelector('.e-virtual-ddl')) {\n var virualElement = _this.createElement('div', {\n id: _this.element.id + '_popup', className: 'e-virtual-ddl', styles: _this.GetVirtualTrackHeight()\n });\n popupEle.querySelector('.e-dropdownbase').appendChild(virualElement);\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n _this.list.getElementsByClassName('e-virtual-ddl')[0].style = _this.GetVirtualTrackHeight();\n }\n }\n popupEle.style.visibility = 'hidden';\n if (_this.popupHeight !== 'auto') {\n _this.searchBoxHeight = 0;\n if (!isNullOrUndefined(searchBox.container) && _this.getModuleName() !== 'combobox' && _this.getModuleName() !== 'autocomplete') {\n _this.searchBoxHeight = (searchBox.container.parentElement).getBoundingClientRect().height;\n _this.listContainerHeight = (parseInt(_this.listContainerHeight, 10) - (_this.searchBoxHeight)).toString() + 'px';\n }\n if (_this.headerTemplate) {\n _this.header = _this.header ? _this.header : popupEle.querySelector('.e-ddl-header');\n var height = Math.round(_this.header.getBoundingClientRect().height);\n _this.listContainerHeight = (parseInt(_this.listContainerHeight, 10) - (height + _this.searchBoxHeight)).toString() + 'px';\n }\n if (_this.footerTemplate) {\n _this.footer = _this.footer ? _this.footer : popupEle.querySelector('.e-ddl-footer');\n var height = Math.round(_this.footer.getBoundingClientRect().height);\n _this.listContainerHeight = (parseInt(_this.listContainerHeight, 10) - (height + _this.searchBoxHeight)).toString() + 'px';\n }\n _this.list.style.maxHeight = (parseInt(_this.listContainerHeight, 10) - 2).toString() + 'px'; // due to box-sizing property\n popupEle.style.maxHeight = formatUnit(_this.popupHeight);\n }\n else {\n popupEle.style.height = 'auto';\n }\n var offsetValue = 0;\n var left = void 0;\n _this.isPreventScrollAction = true;\n if (!isNullOrUndefined(_this.selectedLI) && (!isNullOrUndefined(_this.activeIndex) && _this.activeIndex >= 0)) {\n _this.setScrollPosition();\n }\n else if (_this.enableVirtualization) {\n _this.setScrollPosition();\n }\n else {\n _this.list.scrollTop = 0;\n }\n if (Browser.isDevice && (!_this.allowFiltering && (_this.getModuleName() === 'dropdownlist' ||\n (_this.isDropDownClick && _this.getModuleName() === 'combobox')))) {\n offsetValue = _this.getOffsetValue(popupEle);\n var firstItem = _this.isEmptyList() ? _this.list : _this.liCollections[0];\n if (!isNullOrUndefined(_this.inputElement)) {\n left = -(parseInt(getComputedStyle(firstItem).textIndent, 10) -\n parseInt(getComputedStyle(_this.inputElement).paddingLeft, 10) +\n parseInt(getComputedStyle(_this.inputElement.parentElement).borderLeftWidth, 10));\n }\n }\n _this.createPopup(popupEle, offsetValue, left);\n _this.popupContentElement = _this.popupObj.element.querySelector('.e-content');\n _this.getFocusElement();\n _this.checkCollision(popupEle);\n if (Browser.isDevice) {\n if ((parseInt(_this.popupWidth.toString(), 10) > window.outerWidth) && !(_this.getModuleName() === 'dropdownlist' && _this.allowFiltering)) {\n _this.popupObj.element.classList.add('e-wide-popup');\n }\n _this.popupObj.element.classList.add(dropDownListClasses.device);\n if (_this.getModuleName() === 'dropdownlist' || (_this.getModuleName() === 'combobox'\n && !_this.allowFiltering && _this.isDropDownClick)) {\n _this.popupObj.collision = { X: 'fit', Y: 'fit' };\n }\n if (_this.isFilterLayout()) {\n _this.popupObj.element.classList.add(dropDownListClasses.mobileFilter);\n _this.popupObj.position = { X: 0, Y: 0 };\n _this.popupObj.dataBind();\n attributes(_this.popupObj.element, { style: 'left:0px;right:0px;top:0px;bottom:0px;' });\n addClass([document.body, _this.popupObj.element], dropDownListClasses.popupFullScreen);\n _this.setSearchBoxPosition();\n _this.backIconElement = searchBox.container.querySelector('.e-back-icon');\n _this.clearIconElement = searchBox.container.querySelector('.' + dropDownListClasses.clearIcon);\n EventHandler.add(_this.backIconElement, 'click', _this.clickOnBackIcon, _this);\n EventHandler.add(_this.clearIconElement, 'click', _this.clearText, _this);\n }\n }\n popupEle.style.visibility = 'visible';\n addClass([popupEle], 'e-popup-close');\n var scrollParentElements = _this.popupObj.getScrollableParent(_this.inputWrapper.container);\n for (var _i = 0, scrollParentElements_1 = scrollParentElements; _i < scrollParentElements_1.length; _i++) {\n var element = scrollParentElements_1[_i];\n EventHandler.add(element, 'scroll', _this.scrollHandler, _this);\n }\n if (!isNullOrUndefined(_this.list)) {\n _this.unWireListEvents();\n _this.wireListEvents();\n }\n _this.selectedElementID = _this.selectedLI ? _this.selectedLI.id : null;\n if (_this.enableVirtualization) {\n _this.notify(\"bindScrollEvent\", {\n module: \"VirtualScroll\",\n component: _this.getModuleName(),\n enable: _this.enableVirtualization,\n });\n setTimeout(function () {\n if (_this.value || _this.list.querySelector('.e-active')) {\n _this.updateSelectionList();\n if (_this.selectedValueInfo && _this.viewPortInfo && _this.viewPortInfo.offsets.top) {\n _this.list.scrollTop = _this.viewPortInfo.offsets.top;\n }\n else {\n _this.scrollBottom(true, true);\n }\n }\n }, 5);\n }\n attributes(_this.targetElement(), { 'aria-expanded': 'true', 'aria-owns': _this.element.id + '_popup', 'aria-controls': _this.element.id });\n if (_this.getModuleName() !== 'dropdownlist' && _this.list.classList.contains('e-nodata')) {\n attributes(_this.targetElement(), { 'aria-activedescendant': 'no-record' });\n _this.popupContentElement.setAttribute('role', 'status');\n _this.popupContentElement.setAttribute('id', 'no-record');\n }\n _this.inputElement.setAttribute('aria-expanded', 'true');\n _this.inputElement.setAttribute('aria-controls', _this.element.id + '_popup');\n var inputParent = _this.isFiltering() ? _this.filterInput.parentElement : _this.inputWrapper.container;\n addClass([inputParent], [dropDownListClasses.inputFocus]);\n var animModel = { name: 'FadeIn', duration: 100 };\n _this.beforePopupOpen = true;\n var popupInstance = _this.popupObj;\n var eventArgs = { popup: popupInstance, event: e, cancel: false, animation: animModel };\n _this.trigger('open', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel) {\n if (!isNullOrUndefined(_this.inputWrapper)) {\n addClass([_this.inputWrapper.container], [dropDownListClasses.iconAnimation]);\n }\n _this.renderReactTemplates();\n if (!isNullOrUndefined(_this.popupObj)) {\n _this.popupObj.show(new Animation(eventArgs.animation), (_this.zIndex === 1000) ? _this.element : null);\n }\n }\n else {\n _this.beforePopupOpen = false;\n _this.destroyPopup();\n }\n });\n }\n else {\n _this.beforePopupOpen = false;\n }\n });\n };\n DropDownList.prototype.checkCollision = function (popupEle) {\n if (!Browser.isDevice || (Browser.isDevice && !(this.getModuleName() === 'dropdownlist' || this.isDropDownClick))) {\n var collision = isCollide(popupEle);\n if (collision.length > 0) {\n popupEle.style.marginTop = -parseInt(getComputedStyle(popupEle).marginTop, 10) + 'px';\n }\n this.popupObj.resolveCollision();\n }\n };\n DropDownList.prototype.getOffsetValue = function (popupEle) {\n var popupStyles = getComputedStyle(popupEle);\n var borderTop = parseInt(popupStyles.borderTopWidth, 10);\n var borderBottom = parseInt(popupStyles.borderBottomWidth, 10);\n return this.setPopupPosition(borderTop + borderBottom);\n };\n DropDownList.prototype.createPopup = function (element, offsetValue, left) {\n var _this = this;\n this.popupObj = new Popup(element, {\n width: this.setWidth(), targetType: 'relative',\n relateTo: this.inputWrapper.container,\n collision: this.enableRtl ? { X: 'fit', Y: 'flip' } : { X: 'flip', Y: 'flip' }, offsetY: offsetValue,\n enableRtl: this.enableRtl, offsetX: left,\n position: this.enableRtl ? { X: 'right', Y: 'bottom' } : { X: 'left', Y: 'bottom' },\n zIndex: this.zIndex,\n close: function () {\n if (!_this.isDocumentClick) {\n _this.focusDropDown();\n }\n // eslint-disable-next-line\n if (_this.isReact) {\n _this.clearTemplate(['headerTemplate', 'footerTemplate']);\n }\n _this.isNotSearchList = false;\n _this.isDocumentClick = false;\n _this.destroyPopup();\n if (_this.isFiltering() && _this.actionCompleteData.list && _this.actionCompleteData.list[0]) {\n _this.isActive = true;\n if (_this.enableVirtualization) {\n _this.onActionComplete(_this.ulElement, _this.listData, null, true);\n }\n else {\n _this.onActionComplete(_this.actionCompleteData.ulElement, _this.actionCompleteData.list, null, true);\n }\n }\n },\n open: function () {\n EventHandler.add(document, 'mousedown', _this.onDocumentClick, _this);\n _this.isPopupOpen = true;\n var actionList = _this.actionCompleteData && _this.actionCompleteData.ulElement &&\n _this.actionCompleteData.ulElement.querySelector('li');\n var ulElement = _this.list.querySelector('ul li');\n if (!isNullOrUndefined(_this.ulElement) && !isNullOrUndefined(_this.ulElement.getElementsByClassName('e-item-focus')[0])) {\n attributes(_this.targetElement(), { 'aria-activedescendant': _this.ulElement.getElementsByClassName('e-item-focus')[0].id });\n }\n else if (!isNullOrUndefined(_this.ulElement) && !isNullOrUndefined(_this.ulElement.getElementsByClassName('e-active')[0])) {\n attributes(_this.targetElement(), { 'aria-activedescendant': _this.ulElement.getElementsByClassName('e-active')[0].id });\n }\n if (_this.isFiltering() && _this.itemTemplate && (_this.element.tagName === _this.getNgDirective()) &&\n (actionList && ulElement && actionList.textContent !== ulElement.textContent) &&\n _this.element.tagName !== 'EJS-COMBOBOX') {\n _this.cloneElements();\n }\n if (_this.isFilterLayout()) {\n removeClass([_this.inputWrapper.container], [dropDownListClasses.inputFocus]);\n _this.isFilterFocus = true;\n _this.filterInput.focus();\n if (_this.inputWrapper.clearButton) {\n addClass([_this.inputWrapper.clearButton], dropDownListClasses.clearIconHide);\n }\n }\n _this.activeStateChange();\n },\n targetExitViewport: function () {\n if (!Browser.isDevice) {\n _this.hidePopup();\n }\n }\n });\n };\n DropDownList.prototype.isEmptyList = function () {\n return !isNullOrUndefined(this.liCollections) && this.liCollections.length === 0;\n };\n DropDownList.prototype.getFocusElement = function () {\n // combo-box used this method\n };\n DropDownList.prototype.isFilterLayout = function () {\n return this.getModuleName() === 'dropdownlist' && this.allowFiltering;\n };\n DropDownList.prototype.scrollHandler = function () {\n if (Browser.isDevice && ((this.getModuleName() === 'dropdownlist' &&\n !this.isFilterLayout()) || (this.getModuleName() === 'combobox' && !this.allowFiltering && this.isDropDownClick))) {\n if (this.element && !(this.isElementInViewport(this.element))) {\n this.hidePopup();\n }\n }\n };\n DropDownList.prototype.isElementInViewport = function (element) {\n var elementRect = element.getBoundingClientRect();\n return (elementRect.top >= 0 && elementRect.left >= 0 && elementRect.bottom <= window.innerHeight && elementRect.right <= window.innerWidth);\n };\n ;\n DropDownList.prototype.setSearchBoxPosition = function () {\n var searchBoxHeight = this.filterInput.parentElement.getBoundingClientRect().height;\n this.popupObj.element.style.maxHeight = '100%';\n this.popupObj.element.style.width = '100%';\n this.list.style.maxHeight = (window.innerHeight - searchBoxHeight) + 'px';\n this.list.style.height = (window.innerHeight - searchBoxHeight) + 'px';\n var clearElement = this.filterInput.parentElement.querySelector('.' + dropDownListClasses.clearIcon);\n detach(this.filterInput);\n clearElement.parentElement.insertBefore(this.filterInput, clearElement);\n };\n DropDownList.prototype.setPopupPosition = function (border) {\n var offsetValue;\n var popupOffset = border;\n var selectedLI = this.list.querySelector('.' + dropDownListClasses.focus) || this.selectedLI;\n var firstItem = this.isEmptyList() ? this.list : this.liCollections[0];\n var lastItem = this.isEmptyList() ? this.list : this.liCollections[this.getItems().length - 1];\n var liHeight = firstItem.getBoundingClientRect().height;\n this.listItemHeight = liHeight;\n var listHeight = this.list.offsetHeight / 2;\n var height = isNullOrUndefined(selectedLI) ? firstItem.offsetTop : selectedLI.offsetTop;\n var lastItemOffsetValue = lastItem.offsetTop;\n if (lastItemOffsetValue - listHeight < height && !isNullOrUndefined(this.liCollections) &&\n this.liCollections.length > 0 && !isNullOrUndefined(selectedLI)) {\n var count = this.list.offsetHeight / liHeight;\n var paddingBottom = parseInt(getComputedStyle(this.list).paddingBottom, 10);\n offsetValue = (count - (this.liCollections.length - this.activeIndex)) * liHeight - popupOffset + paddingBottom;\n this.list.scrollTop = selectedLI.offsetTop;\n }\n else if (height > listHeight && !this.enableVirtualization) {\n offsetValue = listHeight - liHeight / 2;\n this.list.scrollTop = height - listHeight + liHeight / 2;\n }\n else {\n offsetValue = height;\n }\n var inputHeight = this.inputWrapper.container.offsetHeight;\n offsetValue = offsetValue + liHeight + popupOffset - ((liHeight - inputHeight) / 2);\n return -offsetValue;\n };\n DropDownList.prototype.setWidth = function () {\n var width = formatUnit(this.popupWidth);\n if (width.indexOf('%') > -1) {\n var inputWidth = this.inputWrapper.container.offsetWidth * parseFloat(width) / 100;\n width = inputWidth.toString() + 'px';\n }\n if (Browser.isDevice && (width.indexOf('px') > -1) && (!this.allowFiltering && (this.getModuleName() === 'dropdownlist' ||\n (this.isDropDownClick && this.getModuleName() === 'combobox')))) {\n var firstItem = this.isEmptyList() ? this.list : this.liCollections[0];\n width = (parseInt(width, 10) + (parseInt(getComputedStyle(firstItem).textIndent, 10) -\n parseInt(getComputedStyle(this.inputElement).paddingLeft, 10) +\n parseInt(getComputedStyle(this.inputElement.parentElement).borderLeftWidth, 10)) * 2) + 'px';\n }\n return width;\n };\n DropDownList.prototype.scrollBottom = function (isInitial, isInitialSelection, keyAction) {\n var _this = this;\n if (isInitialSelection === void 0) { isInitialSelection = false; }\n if (keyAction === void 0) { keyAction = null; }\n if (isNullOrUndefined(this.selectedLI) && this.enableVirtualization) {\n this.selectedLI = this.list.querySelector('.' + dropDownBaseClasses.li);\n if (!isNullOrUndefined(this.selectedLI) && this.selectedLI.classList.contains('e-virtual-list')) {\n this.selectedLI = this.liCollections[this.skeletonCount];\n }\n }\n if (!isNullOrUndefined(this.selectedLI)) {\n this.isUpwardScrolling = false;\n var virtualListCount = this.list.querySelectorAll('.e-virtual-list').length;\n var lastElementValue = this.list.querySelector('li:last-of-type') ? this.list.querySelector('li:last-of-type').getAttribute('data-value') : null;\n var selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.selectedLI.offsetTop + (this.virtualListInfo.startIndex * this.selectedLI.offsetHeight) : this.selectedLI.offsetTop;\n var currentOffset = this.list.offsetHeight;\n var nextBottom = selectedLiOffsetTop - (virtualListCount * this.selectedLI.offsetHeight) + this.selectedLI.offsetHeight - this.list.scrollTop;\n var nextOffset = this.list.scrollTop + nextBottom - currentOffset;\n var isScrollerCHanged = false;\n var isScrollTopChanged = false;\n nextOffset = isInitial ? nextOffset + parseInt(getComputedStyle(this.list).paddingTop, 10) * 2 : nextOffset + parseInt(getComputedStyle(this.list).paddingTop, 10);\n var boxRange = selectedLiOffsetTop - (virtualListCount * this.selectedLI.offsetHeight) + this.selectedLI.offsetHeight - this.list.scrollTop;\n boxRange = this.fields.groupBy && !isNullOrUndefined(this.fixedHeaderElement) ?\n boxRange - this.fixedHeaderElement.offsetHeight : boxRange;\n if (this.activeIndex === 0 && !this.enableVirtualization) {\n this.list.scrollTop = 0;\n isScrollerCHanged = this.isKeyBoardAction;\n }\n else if (nextBottom > currentOffset || !(boxRange > 0 && this.list.offsetHeight > boxRange)) {\n var currentElementValue = this.selectedLI ? this.selectedLI.getAttribute('data-value') : null;\n var liCount = keyAction == \"pageDown\" ? this.getPageCount() - 2 : 1;\n if (!this.enableVirtualization || this.isKeyBoardAction || isInitialSelection) {\n if (this.isKeyBoardAction && this.enableVirtualization && lastElementValue && currentElementValue === lastElementValue && keyAction != \"end\" && !this.isVirtualScrolling) {\n this.isPreventKeyAction = true;\n if (this.enableVirtualization && this.itemTemplate) {\n this.list.scrollTop += nextOffset;\n }\n else {\n if (this.enableVirtualization) {\n liCount = keyAction == \"pageDown\" ? this.getPageCount() + 1 : liCount;\n }\n this.list.scrollTop += this.selectedLI.offsetHeight * liCount;\n }\n this.isPreventKeyAction = this.IsScrollerAtEnd() ? false : this.isPreventKeyAction;\n this.isKeyBoardAction = false;\n this.isPreventScrollAction = false;\n }\n else if (this.enableVirtualization && keyAction == \"end\") {\n this.isPreventKeyAction = false;\n this.isKeyBoardAction = false;\n this.isPreventScrollAction = false;\n this.list.scrollTop = this.list.scrollHeight;\n }\n else {\n if (keyAction == \"pageDown\" && this.enableVirtualization && !this.isVirtualScrolling) {\n this.isPreventKeyAction = false;\n this.isKeyBoardAction = false;\n this.isPreventScrollAction = false;\n }\n this.list.scrollTop = nextOffset;\n }\n }\n else {\n this.list.scrollTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.virtualListInfo.startIndex * this.listItemHeight : 0;\n }\n isScrollerCHanged = this.isKeyBoardAction;\n isScrollTopChanged = true;\n }\n this.isKeyBoardAction = isScrollerCHanged;\n if (this.enableVirtualization && this.fields.groupBy && this.fixedHeaderElement && (keyAction == \"down\")) {\n setTimeout(function () {\n _this.scrollStop(null, true);\n }, 100);\n }\n }\n };\n DropDownList.prototype.scrollTop = function (keyAction) {\n if (keyAction === void 0) { keyAction = null; }\n if (!isNullOrUndefined(this.selectedLI)) {\n var virtualListCount = this.list.querySelectorAll('.e-virtual-list').length;\n var selectedLiOffsetTop = (this.virtualListInfo && this.virtualListInfo.startIndex) ? this.selectedLI.offsetTop + (this.virtualListInfo.startIndex * this.selectedLI.offsetHeight) : this.selectedLI.offsetTop;\n var nextOffset = selectedLiOffsetTop - (virtualListCount * this.selectedLI.offsetHeight) - this.list.scrollTop;\n var firstElementValue = this.list.querySelector('li.e-list-item:not(.e-virtual-list)') ? this.list.querySelector('li.e-list-item:not(.e-virtual-list)').getAttribute('data-value') : null;\n nextOffset = this.fields.groupBy && !isNullOrUndefined(this.fixedHeaderElement) ?\n nextOffset - this.fixedHeaderElement.offsetHeight : nextOffset;\n var boxRange = (selectedLiOffsetTop - (virtualListCount * this.selectedLI.offsetHeight) + this.selectedLI.offsetHeight - this.list.scrollTop);\n var isPageUpKeyAction = this.enableVirtualization && this.getModuleName() === 'autocomplete' && nextOffset <= 0;\n if (this.activeIndex === 0 && !this.enableVirtualization) {\n this.list.scrollTop = 0;\n }\n else if (nextOffset < 0 || isPageUpKeyAction) {\n var currentElementValue = this.selectedLI ? this.selectedLI.getAttribute('data-value') : null;\n var liCount = keyAction == \"pageUp\" ? this.getPageCount() - 2 : 1;\n if (this.enableVirtualization) {\n liCount = keyAction == \"pageUp\" ? this.getPageCount() : liCount;\n }\n if (this.enableVirtualization && this.isKeyBoardAction && firstElementValue && currentElementValue === firstElementValue && keyAction != \"home\" && !this.isVirtualScrolling) {\n this.isUpwardScrolling = true;\n this.isPreventKeyAction = true;\n this.list.scrollTop -= this.selectedLI.offsetHeight * liCount;\n this.isPreventKeyAction = this.list.scrollTop != 0 ? this.isPreventKeyAction : false;\n this.isKeyBoardAction = false;\n this.isPreventScrollAction = false;\n }\n else if (this.enableVirtualization && keyAction == \"home\") {\n this.isPreventScrollAction = false;\n this.isPreventKeyAction = true;\n this.isKeyBoardAction = false;\n this.list.scrollTo(0, 0);\n }\n else {\n if (keyAction == \"pageUp\" && this.enableVirtualization && !this.isVirtualScrolling) {\n this.isPreventKeyAction = false;\n this.isKeyBoardAction = false;\n this.isPreventScrollAction = false;\n }\n this.list.scrollTop = this.list.scrollTop + nextOffset;\n }\n }\n else if (!(boxRange > 0 && this.list.offsetHeight > boxRange)) {\n this.list.scrollTop = this.selectedLI.offsetTop - (this.fields.groupBy && !isNullOrUndefined(this.fixedHeaderElement) ?\n this.fixedHeaderElement.offsetHeight : 0);\n }\n }\n };\n DropDownList.prototype.isEditTextBox = function () {\n return false;\n };\n DropDownList.prototype.isFiltering = function () {\n return this.allowFiltering;\n };\n DropDownList.prototype.isPopupButton = function () {\n return true;\n };\n DropDownList.prototype.setScrollPosition = function (e) {\n this.isPreventScrollAction = true;\n if (!isNullOrUndefined(e)) {\n switch (e.action) {\n case 'pageDown':\n case 'down':\n case 'end':\n this.isKeyBoardAction = true;\n this.scrollBottom(false, false, e.action);\n break;\n default:\n this.isKeyBoardAction = e.action == 'up' || e.action == 'pageUp' || e.action == 'open';\n this.scrollTop(e.action);\n break;\n }\n }\n else {\n this.scrollBottom(true);\n }\n this.isKeyBoardAction = false;\n };\n DropDownList.prototype.clearText = function () {\n this.filterInput.value = this.typedString = '';\n this.searchLists(null);\n if (this.enableVirtualization) {\n this.list.scrollTop = 0;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.totalItemCount = this.dataCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.list.getElementsByClassName('e-virtual-ddl')[0]) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl')[0].style = this.GetVirtualTrackHeight();\n }\n this.getSkeletonCount();\n this.UpdateSkeleton();\n this.liCollections = this.list.querySelectorAll('.e-list-item');\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.list.getElementsByClassName('e-virtual-ddl-content')[0]) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = this.getTransformValues();\n }\n }\n };\n DropDownList.prototype.setEleWidth = function (width) {\n if (!isNullOrUndefined(width)) {\n if (typeof width === 'number') {\n this.inputWrapper.container.style.width = formatUnit(width);\n }\n else if (typeof width === 'string') {\n this.inputWrapper.container.style.width = (width.match(/px|%|em/)) ? (width) : (formatUnit(width));\n }\n }\n };\n DropDownList.prototype.closePopup = function (delay, e) {\n var _this = this;\n var isFilterValue = !isNullOrUndefined(this.filterInput) && !isNullOrUndefined(this.filterInput.value) && this.filterInput.value !== '';\n var typedString = this.getModuleName() === 'combobox' ? this.typedString : null;\n this.isTyped = false;\n this.isVirtualTrackHeight = false;\n if (!(this.popupObj && document.body.contains(this.popupObj.element) && this.beforePopupOpen)) {\n return;\n }\n this.keyboardEvent = null;\n EventHandler.remove(document, 'mousedown', this.onDocumentClick);\n this.isActive = false;\n if (this.getModuleName() === 'dropdownlist') {\n Input.destroy({\n element: this.filterInput,\n floatLabelType: this.floatLabelType,\n properties: { placeholder: this.filterBarPlaceholder },\n buttons: this.clearIconElement,\n }, this.clearIconElement);\n }\n this.filterInputObj = null;\n this.isDropDownClick = false;\n this.preventAutoFill = false;\n var scrollableParentElements = this.popupObj.getScrollableParent(this.inputWrapper.container);\n for (var _i = 0, scrollableParentElements_1 = scrollableParentElements; _i < scrollableParentElements_1.length; _i++) {\n var element = scrollableParentElements_1[_i];\n EventHandler.remove(element, 'scroll', this.scrollHandler);\n }\n if (Browser.isDevice && this.isFilterLayout()) {\n removeClass([document.body, this.popupObj.element], dropDownListClasses.popupFullScreen);\n }\n if (this.isFilterLayout()) {\n if (!Browser.isDevice) {\n this.searchKeyModule.destroy();\n if (this.clearIconElement) {\n EventHandler.remove(this.clearIconElement, 'click', this.clearText);\n }\n }\n if (this.backIconElement) {\n EventHandler.remove(this.backIconElement, 'click', this.clickOnBackIcon);\n EventHandler.remove(this.clearIconElement, 'click', this.clearText);\n }\n if (!isNullOrUndefined(this.filterInput)) {\n EventHandler.remove(this.filterInput, 'input', this.onInput);\n EventHandler.remove(this.filterInput, 'keyup', this.onFilterUp);\n EventHandler.remove(this.filterInput, 'keydown', this.onFilterDown);\n EventHandler.remove(this.filterInput, 'blur', this.onBlurHandler);\n EventHandler.remove(this.filterInput, 'paste', this.pasteHandler);\n }\n if (this.allowFiltering && this.getModuleName() === 'dropdownlist') {\n this.filterInput.removeAttribute('aria-activedescendant');\n this.filterInput.removeAttribute('aria-disabled');\n this.filterInput.removeAttribute('role');\n this.filterInput.removeAttribute('autocomplete');\n this.filterInput.removeAttribute('autocapitalize');\n this.filterInput.removeAttribute('spellcheck');\n }\n this.filterInput = null;\n }\n attributes(this.targetElement(), { 'aria-expanded': 'false' });\n this.inputElement.setAttribute('aria-expanded', 'false');\n this.targetElement().removeAttribute('aria-owns');\n this.targetElement().removeAttribute('aria-activedescendant');\n this.inputWrapper.container.classList.remove(dropDownListClasses.iconAnimation);\n if (this.isFiltering()) {\n this.actionCompleteData.isUpdated = false;\n }\n if (this.enableVirtualization) {\n if ((this.value == null || this.isTyped)) {\n this.viewPortInfo.endIndex = this.viewPortInfo && this.viewPortInfo.endIndex > 0 ? this.viewPortInfo.endIndex : this.itemCount;\n if (this.getModuleName() === 'autocomplete' || (this.getModuleName() === 'dropdownlist' && !isNullOrUndefined(this.typedString) && this.typedString != \"\") || (this.getModuleName() === 'combobox' && this.allowFiltering && !isNullOrUndefined(this.typedString) && this.typedString != \"\")) {\n this.checkAndResetCache();\n }\n }\n else if (this.getModuleName() === 'autocomplete') {\n this.checkAndResetCache();\n }\n if ((this.getModuleName() === 'dropdownlist' || this.getModuleName() === 'combobox') && !(this.skeletonCount == 0)) {\n this.getSkeletonCount(true);\n }\n }\n this.beforePopupOpen = false;\n var animModel = {\n name: 'FadeOut',\n duration: 100,\n delay: delay ? delay : 0\n };\n var popupInstance = this.popupObj;\n var eventArgs = { popup: popupInstance, cancel: false, animation: animModel, event: e || null };\n this.trigger('close', eventArgs, function (eventArgs) {\n if (!isNullOrUndefined(_this.popupObj) &&\n !isNullOrUndefined(_this.popupObj.element.querySelector('.e-fixed-head'))) {\n var fixedHeader = _this.popupObj.element.querySelector('.e-fixed-head');\n fixedHeader.parentNode.removeChild(fixedHeader);\n _this.fixedHeaderElement = null;\n }\n if (!eventArgs.cancel) {\n if (_this.getModuleName() === 'autocomplete') {\n _this.rippleFun();\n }\n if (_this.isPopupOpen) {\n _this.popupObj.hide(new Animation(eventArgs.animation));\n }\n else {\n _this.destroyPopup();\n }\n }\n });\n if (Browser.isDevice && !eventArgs.cancel && this.popupObj.element.classList.contains('e-wide-popup')) {\n this.popupObj.element.classList.remove('e-wide-popup');\n }\n var dataSourceCount;\n if (this.dataSource instanceof DataManager) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n dataSourceCount = this.virtualGroupDataSource && this.virtualGroupDataSource.length ? this.virtualGroupDataSource.length : 0;\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n dataSourceCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;\n }\n if (this.enableVirtualization && this.isFiltering() && isFilterValue && this.totalItemCount !== dataSourceCount) {\n this.updateInitialData();\n this.checkAndResetCache();\n }\n };\n DropDownList.prototype.updateInitialData = function () {\n var currentData = this.selectData;\n var ulElement = this.renderItems(currentData, this.fields);\n this.list.scrollTop = 0;\n this.virtualListInfo = {\n currentPageNumber: null,\n direction: null,\n sentinelInfo: {},\n offsets: {},\n startIndex: 0,\n endIndex: this.itemCount,\n };\n if (this.getModuleName() === 'combobox') {\n this.typedString = \"\";\n }\n this.previousStartIndex = 0;\n this.previousEndIndex = 0;\n if (this.dataSource instanceof DataManager) {\n if (this.remoteDataCount >= 0) {\n this.totalItemCount = this.dataCount = this.remoteDataCount;\n }\n else {\n this.resetList(this.dataSource);\n }\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.totalItemCount = this.dataCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.list.getElementsByClassName('e-virtual-ddl')[0]) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl')[0].style = this.GetVirtualTrackHeight();\n }\n if (this.getModuleName() !== 'autocomplete' && this.totalItemCount != 0 && this.totalItemCount > (this.itemCount * 2)) {\n this.getSkeletonCount();\n }\n this.UpdateSkeleton();\n this.listData = currentData;\n this.updateActionCompleteDataValues(ulElement, currentData);\n this.liCollections = this.list.querySelectorAll('.e-list-item');\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.list.getElementsByClassName('e-virtual-ddl-content')[0]) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = this.getTransformValues();\n }\n };\n DropDownList.prototype.destroyPopup = function () {\n this.isPopupOpen = false;\n this.isFilterFocus = false;\n this.inputElement.removeAttribute('aria-controls');\n if (this.popupObj) {\n this.popupObj.destroy();\n detach(this.popupObj.element);\n }\n };\n DropDownList.prototype.clickOnBackIcon = function () {\n this.hidePopup();\n this.focusIn();\n };\n /**\n * To Initialize the control rendering\n *\n * @private\n * @returns {void}\n */\n DropDownList.prototype.render = function () {\n this.preselectedIndex = !isNullOrUndefined(this.index) ? this.index : null;\n if (this.element.tagName === 'INPUT') {\n this.inputElement = this.element;\n if (isNullOrUndefined(this.inputElement.getAttribute('role'))) {\n this.inputElement.setAttribute('role', 'combobox');\n }\n if (isNullOrUndefined(this.inputElement.getAttribute('type'))) {\n this.inputElement.setAttribute('type', 'text');\n }\n this.inputElement.setAttribute('aria-expanded', 'false');\n }\n else {\n this.inputElement = this.createElement('input', { attrs: { role: 'combobox', type: 'text' } });\n if (this.element.tagName !== this.getNgDirective()) {\n this.element.style.display = 'none';\n }\n this.element.parentElement.insertBefore(this.inputElement, this.element);\n this.preventTabIndex(this.inputElement);\n }\n var updatedCssClassValues = this.cssClass;\n if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {\n updatedCssClassValues = (this.cssClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {\n this.enabled = false;\n }\n this.inputWrapper = Input.createInput({\n element: this.inputElement,\n buttons: this.isPopupButton() ? [dropDownListClasses.icon] : null,\n floatLabelType: this.floatLabelType,\n properties: {\n readonly: this.getModuleName() === 'dropdownlist' ? true : this.readonly,\n placeholder: this.placeholder,\n cssClass: updatedCssClassValues,\n enabled: this.enabled,\n enableRtl: this.enableRtl,\n showClearButton: this.showClearButton\n }\n }, this.createElement);\n if (this.element.tagName === this.getNgDirective()) {\n this.element.appendChild(this.inputWrapper.container);\n }\n else {\n this.inputElement.parentElement.insertBefore(this.element, this.inputElement);\n }\n this.hiddenElement = this.createElement('select', {\n attrs: { 'aria-hidden': 'true', 'aria-label': this.getModuleName(), 'tabindex': '-1', 'class': dropDownListClasses.hiddenElement }\n });\n prepend([this.hiddenElement], this.inputWrapper.container);\n this.validationAttribute(this.element, this.hiddenElement);\n this.setReadOnly();\n this.setFields();\n this.inputWrapper.container.style.width = formatUnit(this.width);\n this.inputWrapper.container.classList.add('e-ddl');\n if (this.floatLabelType !== 'Never') {\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n }\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && this.inputWrapper.container.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-content')[0].classList.add('e-icon');\n }\n this.wireEvent();\n this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';\n this.element.removeAttribute('tabindex');\n var id = this.element.getAttribute('id') ? this.element.getAttribute('id') : getUniqueID('ej2_dropdownlist');\n this.element.id = id;\n this.hiddenElement.id = id + '_hidden';\n this.targetElement().setAttribute('tabindex', this.tabIndex);\n if ((this.getModuleName() === 'autocomplete' || this.getModuleName() === 'combobox') && !this.readonly) {\n this.inputElement.setAttribute('aria-label', this.getModuleName());\n }\n else if (this.getModuleName() === 'dropdownlist') {\n attributes(this.targetElement(), { 'aria-label': this.getModuleName() });\n this.inputElement.setAttribute('aria-label', this.getModuleName());\n this.inputElement.setAttribute('aria-expanded', 'false');\n }\n attributes(this.targetElement(), this.getAriaAttributes());\n this.updateDataAttribute(this.htmlAttributes);\n this.setHTMLAttributes();\n if (this.targetElement() === this.inputElement) {\n this.inputElement.removeAttribute('aria-labelledby');\n }\n if (this.value !== null || this.activeIndex !== null || this.text !== null) {\n if (this.enableVirtualization) {\n this.listItemHeight = this.getListHeight();\n this.getSkeletonCount();\n this.updateVirtualizationProperties(this.itemCount, this.allowFiltering);\n if (this.index !== null) {\n this.activeIndex = this.index + this.skeletonCount;\n }\n }\n this.initValue();\n this.selectedValueInfo = this.viewPortInfo;\n if (this.enableVirtualization) {\n this.activeIndex = this.activeIndex + this.skeletonCount;\n }\n }\n else if (this.element.tagName === 'SELECT' && this.element.options[0]) {\n var selectElement = this.element;\n this.value = this.allowObjectBinding ? this.getDataByValue(selectElement.options[selectElement.selectedIndex].value) : selectElement.options[selectElement.selectedIndex].value;\n this.text = isNullOrUndefined(this.value) ? null : selectElement.options[selectElement.selectedIndex].textContent;\n this.initValue();\n }\n this.setEnabled();\n this.preventTabIndex(this.element);\n if (!this.enabled) {\n this.targetElement().tabIndex = -1;\n }\n this.initial = false;\n this.element.style.opacity = '';\n this.inputElement.onselect = function (e) {\n e.stopImmediatePropagation();\n };\n this.inputElement.onchange = function (e) {\n e.stopImmediatePropagation();\n };\n if (this.element.hasAttribute('autofocus')) {\n this.focusIn();\n }\n if (!isNullOrUndefined(this.text)) {\n this.inputElement.setAttribute('value', this.text);\n }\n if (this.element.hasAttribute('data-val')) {\n this.element.setAttribute('data-val', 'false');\n }\n var floatLabelElement = this.inputWrapper.container.getElementsByClassName('e-float-text')[0];\n if (!isNullOrUndefined(this.element.id) && this.element.id !== '' && !isNullOrUndefined(floatLabelElement)) {\n floatLabelElement.id = 'label_' + this.element.id.replace(/ /g, '_');\n attributes(this.inputElement, { 'aria-labelledby': floatLabelElement.id });\n }\n this.renderComplete();\n this.listItemHeight = this.getListHeight();\n this.getSkeletonCount();\n if (this.enableVirtualization) {\n this.updateVirtualizationProperties(this.itemCount, this.allowFiltering);\n }\n this.viewPortInfo.startIndex = this.virtualItemStartIndex = 0;\n this.viewPortInfo.endIndex = this.virtualItemEndIndex = this.viewPortInfo.startIndex > 0 ? this.viewPortInfo.endIndex : this.itemCount;\n };\n DropDownList.prototype.getListHeight = function () {\n var listParent = this.createElement('div', {\n className: 'e-dropdownbase'\n });\n var item = this.createElement('li', {\n className: 'e-list-item'\n });\n var listParentHeight = formatUnit(this.popupHeight);\n listParent.style.height = (parseInt(listParentHeight, 10)).toString() + 'px';\n listParent.appendChild(item);\n document.body.appendChild(listParent);\n this.virtualListHeight = listParent.getBoundingClientRect().height;\n var listItemHeight = Math.ceil(item.getBoundingClientRect().height);\n listParent.remove();\n return listItemHeight;\n };\n DropDownList.prototype.setFooterTemplate = function (popupEle) {\n var compiledString;\n if (this.footer) {\n if (this.isReact && typeof this.footerTemplate === 'function') {\n this.clearTemplate(['footerTemplate']);\n }\n else {\n this.footer.innerHTML = '';\n }\n }\n else {\n this.footer = this.createElement('div');\n addClass([this.footer], dropDownListClasses.footer);\n }\n var footercheck = this.dropdownCompiler(this.footerTemplate);\n if (typeof this.footerTemplate !== 'function' && footercheck) {\n compiledString = compile(select(this.footerTemplate, document).innerHTML.trim());\n }\n else {\n compiledString = compile(this.footerTemplate);\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var footerCompTemp = compiledString({}, this, 'footerTemplate', this.footerTemplateId, this.isStringTemplate, null, this.footer);\n if (footerCompTemp && footerCompTemp.length > 0) {\n append(footerCompTemp, this.footer);\n }\n append([this.footer], popupEle);\n };\n DropDownList.prototype.setHeaderTemplate = function (popupEle) {\n var compiledString;\n if (this.header) {\n this.header.innerHTML = '';\n }\n else {\n this.header = this.createElement('div');\n addClass([this.header], dropDownListClasses.header);\n }\n var headercheck = this.dropdownCompiler(this.headerTemplate);\n if (typeof this.headerTemplate !== 'function' && headercheck) {\n compiledString = compile(select(this.headerTemplate, document).innerHTML.trim());\n }\n else {\n compiledString = compile(this.headerTemplate);\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var headerCompTemp = compiledString({}, this, 'headerTemplate', this.headerTemplateId, this.isStringTemplate, null, this.header);\n if (headerCompTemp && headerCompTemp.length) {\n append(headerCompTemp, this.header);\n }\n var contentEle = popupEle.querySelector('div.e-content');\n popupEle.insertBefore(this.header, contentEle);\n };\n /**\n * Sets the enabled state to DropDownBase.\n *\n * @returns {void}\n */\n DropDownList.prototype.setEnabled = function () {\n this.element.setAttribute('aria-disabled', (this.enabled) ? 'false' : 'true');\n };\n DropDownList.prototype.setOldText = function (text) {\n this.text = text;\n };\n DropDownList.prototype.setOldValue = function (value) {\n this.value = value;\n };\n DropDownList.prototype.refreshPopup = function () {\n if (!isNullOrUndefined(this.popupObj) && document.body.contains(this.popupObj.element) &&\n ((this.allowFiltering && !(Browser.isDevice && this.isFilterLayout())) || this.getModuleName() === 'autocomplete')) {\n removeClass([this.popupObj.element], 'e-popup-close');\n this.popupObj.refreshPosition(this.inputWrapper.container);\n this.popupObj.resolveCollision();\n }\n };\n DropDownList.prototype.checkData = function (newProp) {\n if (newProp.dataSource && !isNullOrUndefined(Object.keys(newProp.dataSource)) && this.itemTemplate && this.allowFiltering &&\n !(this.isListSearched && (newProp.dataSource instanceof DataManager))) {\n this.list = null;\n this.actionCompleteData = { ulElement: null, list: null, isUpdated: false };\n }\n this.isListSearched = false;\n var isChangeValue = Object.keys(newProp).indexOf('value') !== -1 && isNullOrUndefined(newProp.value);\n var isChangeText = Object.keys(newProp).indexOf('text') !== -1 && isNullOrUndefined(newProp.text);\n if (this.getModuleName() !== 'autocomplete' && this.allowFiltering && (isChangeValue || isChangeText)) {\n this.itemData = null;\n }\n if (this.allowFiltering && newProp.dataSource && !isNullOrUndefined(Object.keys(newProp.dataSource))) {\n this.actionCompleteData = { ulElement: null, list: null, isUpdated: false };\n this.actionData = this.actionCompleteData;\n }\n else if (this.allowFiltering && newProp.query && !isNullOrUndefined(Object.keys(newProp.query))) {\n this.actionCompleteData = this.getModuleName() === 'combobox' ?\n { ulElement: null, list: null, isUpdated: false } : this.actionCompleteData;\n this.actionData = this.actionCompleteData;\n }\n };\n DropDownList.prototype.updateDataSource = function (props, oldProps) {\n if (this.inputElement.value !== '' || (!isNullOrUndefined(props) && (isNullOrUndefined(props.dataSource)\n || (!(props.dataSource instanceof DataManager) && props.dataSource.length === 0)))) {\n this.clearAll(null, props);\n }\n if ((this.fields.groupBy && props.fields) && !this.isGroupChecking && this.list) {\n EventHandler.remove(this.list, 'scroll', this.setFloatingHeader);\n EventHandler.add(this.list, 'scroll', this.setFloatingHeader, this);\n }\n if (!(!isNullOrUndefined(props) && (isNullOrUndefined(props.dataSource)\n || (!(props.dataSource instanceof DataManager) && props.dataSource.length === 0))) || ((props.dataSource instanceof DataManager) || (!isNullOrUndefined(props) && Array.isArray(props.dataSource) && !isNullOrUndefined(oldProps) && Array.isArray(oldProps.dataSource) && props.dataSource.length !== oldProps.dataSource.length))) {\n this.typedString = '';\n this.resetList(this.dataSource);\n }\n if (!this.isCustomFilter && !this.isFilterFocus && document.activeElement !== this.filterInput) {\n this.checkCustomValue();\n }\n };\n DropDownList.prototype.checkCustomValue = function () {\n var currentValue = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n this.itemData = this.getDataByValue(currentValue);\n var dataItem = this.getItemData();\n var value = this.allowObjectBinding ? this.itemData : dataItem.value;\n this.setProperties({ 'text': dataItem.text, 'value': value });\n };\n DropDownList.prototype.updateInputFields = function () {\n if (this.getModuleName() === 'dropdownlist') {\n Input.setValue(this.text, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n };\n /**\n * Dynamically change the value of properties.\n *\n * @private\n * @param {DropDownListModel} newProp - Returns the dynamic property value of the component.\n * @param {DropDownListModel} oldProp - Returns the previous previous value of the component.\n * @returns {void}\n */\n DropDownList.prototype.onPropertyChanged = function (newProp, oldProp) {\n var _this = this;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (!isNullOrUndefined(newProp.dataSource) && !this.isTouched && (isNullOrUndefined(newProp.value) && isNullOrUndefined(newProp.index)) && !isNullOrUndefined(this.preselectedIndex) && !isNullOrUndefined(this.index)) {\n newProp.index = this.index;\n }\n if (!isNullOrUndefined(newProp.value) || !isNullOrUndefined(newProp.index)) {\n this.isTouched = true;\n }\n if (this.getModuleName() === 'dropdownlist') {\n this.checkData(newProp);\n this.setUpdateInitial(['fields', 'query', 'dataSource'], newProp);\n }\n var _loop_1 = function (prop) {\n switch (prop) {\n case 'query':\n case 'dataSource':\n this_1.getSkeletonCount();\n this_1.checkAndResetCache();\n break;\n case 'htmlAttributes':\n this_1.setHTMLAttributes();\n break;\n case 'width':\n this_1.setEleWidth(newProp.width);\n Input.calculateWidth(this_1.inputElement, this_1.inputWrapper.container);\n break;\n case 'placeholder':\n Input.setPlaceholder(newProp.placeholder, this_1.inputElement);\n break;\n case 'filterBarPlaceholder':\n if (this_1.filterInput) {\n Input.setPlaceholder(newProp.filterBarPlaceholder, this_1.filterInput);\n }\n break;\n case 'readonly':\n if (this_1.getModuleName() !== 'dropdownlist') {\n Input.setReadonly(newProp.readonly, this_1.inputElement);\n }\n this_1.setReadOnly();\n break;\n case 'cssClass':\n this_1.setCssClass(newProp.cssClass, oldProp.cssClass);\n Input.calculateWidth(this_1.inputElement, this_1.inputWrapper.container);\n break;\n case 'enableRtl':\n this_1.setEnableRtl();\n break;\n case 'enabled':\n this_1.setEnable();\n break;\n case 'text':\n if (newProp.text === null) {\n this_1.clearAll();\n break;\n }\n if (this_1.enableVirtualization) {\n this_1.updateValues();\n this_1.updateInputFields();\n this_1.notify(\"setCurrentViewDataAsync\", {\n module: \"VirtualScroll\",\n });\n break;\n }\n if (!this_1.list) {\n if (this_1.dataSource instanceof DataManager) {\n this_1.initialRemoteRender = true;\n }\n this_1.renderList();\n }\n if (!this_1.initialRemoteRender) {\n var li = this_1.getElementByText(newProp.text);\n if (!this_1.checkValidLi(li)) {\n if (this_1.liCollections && this_1.liCollections.length === 100 &&\n this_1.getModuleName() === 'autocomplete' && this_1.listData.length > 100) {\n this_1.setSelectionData(newProp.text, oldProp.text, 'text');\n }\n else if (newProp.text && this_1.dataSource instanceof DataManager) {\n var listLength_1 = this_1.getItems().length;\n var checkField = isNullOrUndefined(this_1.fields.text) ? this_1.fields.value : this_1.fields.text;\n this_1.typedString = '';\n this_1.dataSource.executeQuery(this_1.getQuery(this_1.query).where(new Predicate(checkField, 'equal', newProp.text)))\n .then(function (e) {\n if (e.result.length > 0) {\n _this.addItem(e.result, listLength_1);\n _this.updateValues();\n }\n else {\n _this.setOldText(oldProp.text);\n }\n });\n }\n else if (this_1.getModuleName() === 'autocomplete') {\n this_1.setInputValue(newProp, oldProp);\n }\n else {\n this_1.setOldText(oldProp.text);\n }\n }\n this_1.updateInputFields();\n }\n break;\n case 'value':\n if (newProp.value === null) {\n this_1.clearAll();\n break;\n }\n if (this_1.allowObjectBinding && !isNullOrUndefined(newProp.value) && !isNullOrUndefined(oldProp.value) && this_1.isObjectInArray(newProp.value, [oldProp.value])) {\n return { value: void 0 };\n }\n if (this_1.enableVirtualization) {\n this_1.updateValues();\n this_1.updateInputFields();\n this_1.notify(\"setCurrentViewDataAsync\", {\n module: \"VirtualScroll\",\n });\n this_1.preventChange = this_1.isAngular && this_1.preventChange ? !this_1.preventChange : this_1.preventChange;\n break;\n }\n this_1.notify('beforeValueChange', { newProp: newProp }); // gird component value type change\n if (!this_1.list) {\n if (this_1.dataSource instanceof DataManager) {\n this_1.initialRemoteRender = true;\n }\n this_1.renderList();\n }\n if (!this_1.initialRemoteRender) {\n var value = this_1.allowObjectBinding && !isNullOrUndefined(newProp.value) ? getValue((this_1.fields.value) ? this_1.fields.value : '', newProp.value) : newProp.value;\n var item = this_1.getElementByValue(value);\n if (!this_1.checkValidLi(item)) {\n if (this_1.liCollections && this_1.liCollections.length === 100 &&\n this_1.getModuleName() === 'autocomplete' && this_1.listData.length > 100) {\n this_1.setSelectionData(newProp.value, oldProp.value, 'value');\n }\n else if (newProp.value && this_1.dataSource instanceof DataManager) {\n var listLength_2 = this_1.getItems().length;\n var checkField = isNullOrUndefined(this_1.fields.value) ? this_1.fields.text : this_1.fields.value;\n this_1.typedString = '';\n var value_7 = this_1.allowObjectBinding && !isNullOrUndefined(newProp.value) ? getValue(checkField, newProp.value) : newProp.value;\n this_1.dataSource.executeQuery(this_1.getQuery(this_1.query).where(new Predicate(checkField, 'equal', value_7)))\n .then(function (e) {\n if (e.result.length > 0) {\n _this.addItem(e.result, listLength_2);\n _this.updateValues();\n }\n else {\n _this.setOldValue(oldProp.value);\n }\n });\n }\n else if (this_1.getModuleName() === 'autocomplete') {\n this_1.setInputValue(newProp, oldProp);\n }\n else {\n this_1.setOldValue(oldProp.value);\n }\n }\n this_1.updateInputFields();\n this_1.preventChange = this_1.isAngular && this_1.preventChange ? !this_1.preventChange : this_1.preventChange;\n }\n break;\n case 'index':\n if (newProp.index === null) {\n this_1.clearAll();\n break;\n }\n if (!this_1.list) {\n if (this_1.dataSource instanceof DataManager) {\n this_1.initialRemoteRender = true;\n }\n this_1.renderList();\n }\n if (!this_1.initialRemoteRender && this_1.liCollections) {\n var element = this_1.liCollections[newProp.index];\n if (!this_1.checkValidLi(element)) {\n if (this_1.liCollections && this_1.liCollections.length === 100 &&\n this_1.getModuleName() === 'autocomplete' && this_1.listData.length > 100) {\n this_1.setSelectionData(newProp.index, oldProp.index, 'index');\n }\n else {\n this_1.index = oldProp.index;\n }\n }\n this_1.updateInputFields();\n }\n break;\n case 'footerTemplate':\n if (this_1.popupObj) {\n this_1.setFooterTemplate(this_1.popupObj.element);\n }\n break;\n case 'headerTemplate':\n if (this_1.popupObj) {\n this_1.setHeaderTemplate(this_1.popupObj.element);\n }\n break;\n case 'valueTemplate':\n if (!isNullOrUndefined(this_1.itemData) && this_1.valueTemplate !== null) {\n this_1.setValueTemplate();\n }\n break;\n case 'allowFiltering':\n if (this_1.allowFiltering) {\n this_1.actionCompleteData = {\n ulElement: this_1.ulElement,\n list: this_1.listData, isUpdated: true\n };\n this_1.actionData = this_1.actionCompleteData;\n this_1.updateSelectElementData(this_1.allowFiltering);\n }\n break;\n case 'floatLabelType':\n Input.removeFloating(this_1.inputWrapper);\n Input.addFloating(this_1.inputElement, newProp.floatLabelType, this_1.placeholder, this_1.createElement);\n if (!isNullOrUndefined(this_1.inputWrapper.buttons[0]) && this_1.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0] && this_1.floatLabelType !== 'Never') {\n this_1.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n break;\n case 'showClearButton':\n if (!this_1.inputWrapper.clearButton) {\n Input.setClearButton(newProp.showClearButton, this_1.inputElement, this_1.inputWrapper, null, this_1.createElement);\n this_1.bindClearEvent();\n }\n break;\n default:\n {\n // eslint-disable-next-line max-len\n var ddlProps = this_1.getPropObject(prop, newProp, oldProp);\n _super.prototype.onPropertyChanged.call(this_1, ddlProps.newProperty, ddlProps.oldProperty);\n }\n break;\n }\n };\n var this_1 = this;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n var state_1 = _loop_1(prop);\n if (typeof state_1 === \"object\")\n return state_1.value;\n }\n };\n DropDownList.prototype.checkValidLi = function (element) {\n if (this.isValidLI(element)) {\n this.setSelection(element, null);\n return true;\n }\n return false;\n };\n DropDownList.prototype.setSelectionData = function (newProp, oldProp, prop) {\n var _this = this;\n var li;\n this.updateListValues = function () {\n if (prop === 'text') {\n li = _this.getElementByText(newProp);\n if (!_this.checkValidLi(li)) {\n _this.setOldText(oldProp);\n }\n }\n else if (prop === 'value') {\n var fields = (_this.fields.value) ? _this.fields.value : '';\n var value = _this.allowObjectBinding && !isNullOrUndefined(newProp) ? getValue(fields, newProp) : newProp;\n li = _this.getElementByValue(newProp);\n if (!_this.checkValidLi(li)) {\n _this.setOldValue(oldProp);\n }\n }\n else if (prop === 'index') {\n li = _this.liCollections[newProp];\n if (!_this.checkValidLi(li)) {\n _this.index = oldProp;\n }\n }\n };\n };\n DropDownList.prototype.updatePopupState = function () {\n if (this.beforePopupOpen) {\n this.beforePopupOpen = false;\n this.showPopup();\n }\n };\n DropDownList.prototype.setReadOnly = function () {\n if (this.readonly) {\n addClass([this.inputWrapper.container], ['e-readonly']);\n }\n else {\n removeClass([this.inputWrapper.container], ['e-readonly']);\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n DropDownList.prototype.setInputValue = function (newProp, oldProp) {\n };\n DropDownList.prototype.setCssClass = function (newClass, oldClass) {\n if (!isNullOrUndefined(oldClass)) {\n oldClass = (oldClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(newClass)) {\n newClass = (newClass.replace(/\\s+/g, ' ')).trim();\n }\n Input.setCssClass(newClass, [this.inputWrapper.container], oldClass);\n if (this.popupObj) {\n Input.setCssClass(newClass, [this.popupObj.element], oldClass);\n }\n };\n /**\n * Return the module name of this component.\n *\n * @private\n * @returns {string} Return the module name of this component.\n */\n DropDownList.prototype.getModuleName = function () {\n return 'dropdownlist';\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Opens the popup that displays the list of items.\n *\n * @returns {void}\n */\n DropDownList.prototype.showPopup = function (e) {\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n if (!this.enabled) {\n return;\n }\n this.firstItem = this.dataSource && this.dataSource.length > 0 ? this.dataSource[0] : null;\n if (this.isReact && this.getModuleName() === 'combobox' && this.itemTemplate && this.isCustomFilter && this.isAddNewItemTemplate) {\n this.renderList();\n this.isAddNewItemTemplate = false;\n }\n if (this.isFiltering() && this.dataSource instanceof DataManager && (this.actionData.list !== this.actionCompleteData.list) &&\n this.actionData.list && this.actionData.ulElement) {\n this.actionCompleteData = this.actionData;\n this.onActionComplete(this.actionCompleteData.ulElement, this.actionCompleteData.list, null, true);\n }\n if (this.beforePopupOpen) {\n this.refreshPopup();\n return;\n }\n this.beforePopupOpen = true;\n if (this.isFiltering() && !this.isActive && this.actionCompleteData.list && this.actionCompleteData.list[0]) {\n this.isActive = true;\n this.onActionComplete(this.actionCompleteData.ulElement, this.actionCompleteData.list, null, true);\n }\n else if (isNullOrUndefined(this.list) || !isUndefined(this.list) && (this.list.classList.contains(dropDownBaseClasses.noData) ||\n this.list.querySelectorAll('.' + dropDownBaseClasses.li).length <= 0)) {\n if (this.isReact && this.isFiltering() && this.itemTemplate != null) {\n this.isSecondClick = false;\n }\n this.renderList(e);\n }\n if (this.enableVirtualization && this.listData && this.listData.length) {\n if (!isNullOrUndefined(this.value) && (this.getModuleName() === 'dropdownlist' || this.getModuleName() === 'combobox')) {\n this.removeHover();\n }\n if (!this.beforePopupOpen) {\n this.notify(\"setCurrentViewDataAsync\", {\n module: \"VirtualScroll\",\n });\n }\n }\n if (this.beforePopupOpen) {\n this.invokeRenderPopup(e);\n }\n if (this.enableVirtualization && !this.allowFiltering && this.selectedValueInfo != null && this.selectedValueInfo.startIndex > 0 && this.value != null) {\n this.notify(\"dataProcessAsync\", {\n module: \"VirtualScroll\",\n isOpen: true,\n });\n }\n };\n DropDownList.prototype.invokeRenderPopup = function (e) {\n if (Browser.isDevice && this.isFilterLayout()) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var proxy_2 = this;\n window.onpopstate = function () {\n proxy_2.hidePopup();\n };\n history.pushState({}, '');\n }\n if (!isNullOrUndefined(this.list) && (!isNullOrUndefined(this.list.children[0]) ||\n this.list.classList.contains(dropDownBaseClasses.noData))) {\n this.renderPopup(e);\n }\n };\n DropDownList.prototype.renderHightSearch = function () {\n // update high light search\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Hides the popup if it is in an open state.\n *\n * @returns {void}\n */\n DropDownList.prototype.hidePopup = function (e) {\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n if (this.isEscapeKey && this.getModuleName() === 'dropdownlist') {\n if (!isNullOrUndefined(this.inputElement)) {\n Input.setValue(this.text, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n this.isEscapeKey = false;\n if (!isNullOrUndefined(this.index)) {\n var value = this.allowObjectBinding ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n var element = this.findListElement(this.ulElement, 'li', 'data-value', value);\n this.selectedLI = this.liCollections[this.index] || element;\n if (this.selectedLI) {\n this.updateSelectedItem(this.selectedLI, null, true);\n if (this.valueTemplate && this.itemData !== null) {\n this.setValueTemplate();\n }\n }\n }\n else {\n this.resetSelection();\n }\n }\n this.isVirtualTrackHeight = false;\n this.customFilterQuery = null;\n this.closePopup(0, e);\n var dataItem = this.getItemData();\n var isSelectVal = !isNullOrUndefined(this.selectedLI);\n if (isSelectVal && this.enableVirtualization && this.selectedLI.classList) {\n isSelectVal = this.selectedLI.classList.contains('e-active');\n }\n if (this.inputElement && this.inputElement.value.trim() === '' && !this.isInteracted && (this.isSelectCustom ||\n isSelectVal && this.inputElement.value !== dataItem.text)) {\n this.isSelectCustom = false;\n this.clearAll(e);\n }\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Sets the focus on the component for interaction.\n *\n * @returns {void}\n */\n DropDownList.prototype.focusIn = function (e) {\n if (!this.enabled) {\n return;\n }\n if (this.targetElement().classList.contains(dropDownListClasses.disable)) {\n return;\n }\n var isFocused = false;\n if (this.preventFocus && Browser.isDevice) {\n this.inputWrapper.container.tabIndex = 1;\n this.inputWrapper.container.focus();\n this.preventFocus = false;\n isFocused = true;\n }\n if (!isFocused) {\n this.targetElement().focus();\n }\n addClass([this.inputWrapper.container], [dropDownListClasses.inputFocus]);\n this.onFocus(e);\n if (this.floatLabelType !== 'Never') {\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n }\n };\n /**\n * Moves the focus from the component if the component is already focused.\n *\n * @returns {void}\n */\n DropDownList.prototype.focusOut = function (e) {\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n if (!this.enabled) {\n return;\n }\n if (!this.enableVirtualization && (this.getModuleName() === 'combobox' || this.getModuleName() === 'autocomplete')) {\n this.isTyped = true;\n }\n this.hidePopup(e);\n if (this.targetElement()) {\n this.targetElement().blur();\n }\n removeClass([this.inputWrapper.container], [dropDownListClasses.inputFocus]);\n if (this.floatLabelType !== 'Never') {\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n }\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.\n *\n * @method destroy\n * @returns {void}\n */\n DropDownList.prototype.destroy = function () {\n this.isActive = false;\n if (this.showClearButton) {\n this.clearButton = document.getElementsByClassName('e-clear-icon')[0];\n }\n resetIncrementalSearchValues(this.element.id);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isReact) {\n this.clearTemplate();\n }\n this.hidePopup();\n if (this.popupObj) {\n this.popupObj.hide();\n }\n this.unWireEvent();\n if (this.list) {\n this.unWireListEvents();\n }\n if (this.element && !this.element.classList.contains('e-' + this.getModuleName())) {\n return;\n }\n if (this.inputElement) {\n var attrArray = ['readonly', 'aria-disabled', 'placeholder', 'aria-labelledby',\n 'aria-expanded', 'autocomplete', 'aria-readonly', 'autocapitalize',\n 'spellcheck', 'aria-autocomplete', 'aria-live', 'aria-describedby', 'aria-label'];\n for (var i = 0; i < attrArray.length; i++) {\n this.inputElement.removeAttribute(attrArray[i]);\n }\n this.inputElement.setAttribute('tabindex', this.tabIndex);\n this.inputElement.classList.remove('e-input');\n Input.setValue('', this.inputElement, this.floatLabelType, this.showClearButton);\n }\n this.element.style.display = 'block';\n if (this.inputWrapper.container.parentElement.tagName === this.getNgDirective()) {\n detach(this.inputWrapper.container);\n }\n else {\n this.inputWrapper.container.parentElement.insertBefore(this.element, this.inputWrapper.container);\n detach(this.inputWrapper.container);\n }\n delete this.hiddenElement;\n this.filterInput = null;\n this.keyboardModule = null;\n if (!isNullOrUndefined(this.ulElement)) {\n this.removeAllChildren(this.ulElement);\n }\n this.ulElement = null;\n this.list = null;\n this.clearIconElement = null;\n this.popupObj = null;\n this.popupContentElement = null;\n this.rippleFun = null;\n this.selectedLI = null;\n this.liCollections = null;\n this.item = null;\n this.footer = null;\n this.header = null;\n this.previousSelectedLI = null;\n this.valueTempElement = null;\n this.actionData.ulElement = null;\n if (this.inputElement && !isNullOrUndefined(this.inputElement.onchange)) {\n this.inputElement.onchange = null;\n }\n if (this.inputElement && !isNullOrUndefined(this.inputElement.onselect)) {\n this.inputElement.onselect = null;\n }\n Input.destroy({\n element: this.inputElement,\n floatLabelType: this.floatLabelType,\n properties: this.properties,\n buttons: this.inputWrapper.container.querySelectorAll('.e-input-group-icon')[0],\n }, this.clearButton);\n this.clearButton = null;\n this.inputElement = null;\n this.inputWrapper = null;\n _super.prototype.destroy.call(this);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets all the list items bound on this component.\n *\n * @returns {Element[]}\n */\n DropDownList.prototype.getItems = function () {\n if (!this.list) {\n if (this.dataSource instanceof DataManager) {\n this.initialRemoteRender = true;\n }\n this.renderList();\n }\n return this.ulElement ? _super.prototype.getItems.call(this) : [];\n };\n /**\n * Gets the data Object that matches the given value.\n *\n * @param { string | number } value - Specifies the value of the list item.\n * @returns {Object}\n */\n DropDownList.prototype.getDataByValue = function (value) {\n return _super.prototype.getDataByValue.call(this, value);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Allows you to clear the selected values from the component.\n *\n * @returns {void}\n */\n DropDownList.prototype.clear = function () {\n this.value = null;\n };\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"cssClass\", void 0);\n __decorate([\n Property('100%')\n ], DropDownList.prototype, \"width\", void 0);\n __decorate([\n Property(true)\n ], DropDownList.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], DropDownList.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property('300px')\n ], DropDownList.prototype, \"popupHeight\", void 0);\n __decorate([\n Property('100%')\n ], DropDownList.prototype, \"popupWidth\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"placeholder\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"filterBarPlaceholder\", void 0);\n __decorate([\n Property({})\n ], DropDownList.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"query\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"valueTemplate\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"headerTemplate\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"footerTemplate\", void 0);\n __decorate([\n Property(false)\n ], DropDownList.prototype, \"allowFiltering\", void 0);\n __decorate([\n Property(false)\n ], DropDownList.prototype, \"readonly\", void 0);\n __decorate([\n Property(false)\n ], DropDownList.prototype, \"enableVirtualization\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"text\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"value\", void 0);\n __decorate([\n Property(false)\n ], DropDownList.prototype, \"allowObjectBinding\", void 0);\n __decorate([\n Property(null)\n ], DropDownList.prototype, \"index\", void 0);\n __decorate([\n Property('Never')\n ], DropDownList.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property(false)\n ], DropDownList.prototype, \"showClearButton\", void 0);\n __decorate([\n Event()\n ], DropDownList.prototype, \"filtering\", void 0);\n __decorate([\n Event()\n ], DropDownList.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], DropDownList.prototype, \"beforeOpen\", void 0);\n __decorate([\n Event()\n ], DropDownList.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], DropDownList.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], DropDownList.prototype, \"blur\", void 0);\n __decorate([\n Event()\n ], DropDownList.prototype, \"focus\", void 0);\n DropDownList = __decorate([\n NotifyPropertyChanges\n ], DropDownList);\n return DropDownList;\n}(DropDownBase));\nexport { DropDownList };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// \nimport { EventHandler, Property, Event, addClass, Browser, removeClass, detach } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, NotifyPropertyChanges, getValue, setValue } from '@syncfusion/ej2-base';\nimport { DropDownList, dropDownListClasses } from '../drop-down-list/drop-down-list';\nimport { Search } from '../common/incremental-search';\nimport { createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { DataManager, Predicate, Query } from '@syncfusion/ej2-data';\nvar SPINNER_CLASS = 'e-atc-spinner-icon';\ndropDownListClasses.root = 'e-combobox';\nvar inputObject = {\n container: null,\n buttons: []\n};\n/**\n * The ComboBox component allows the user to type a value or choose an option from the list of predefined options.\n * ```html\n * \n * ```\n * ```typescript\n * let games:ComboBox = new ComboBox();\n * games.appendTo(\"#list\");\n * ```\n */\nvar ComboBox = /** @class */ (function (_super) {\n __extends(ComboBox, _super);\n /**\n * *Constructor for creating the component\n *\n * @param {ComboBoxModel} options - Specifies the ComboBox model.\n * @param {string | HTMLElement} element - Specifies the element to render as component.\n * @private\n */\n function ComboBox(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Initialize the event handler\n *\n * @private\n * @returns {void}\n */\n ComboBox.prototype.preRender = function () {\n _super.prototype.preRender.call(this);\n };\n ComboBox.prototype.getLocaleName = function () {\n return 'combo-box';\n };\n ComboBox.prototype.wireEvent = function () {\n if (this.getModuleName() === 'combobox') {\n EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', this.preventBlur, this);\n EventHandler.add(this.inputWrapper.container, 'blur', this.onBlurHandler, this);\n }\n if (!isNullOrUndefined(this.inputWrapper.buttons[0])) {\n EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', this.dropDownClick, this);\n }\n EventHandler.add(this.inputElement, 'focus', this.targetFocus, this);\n if (!this.readonly) {\n EventHandler.add(this.inputElement, 'input', this.onInput, this);\n EventHandler.add(this.inputElement, 'keyup', this.onFilterUp, this);\n EventHandler.add(this.inputElement, 'keydown', this.onFilterDown, this);\n EventHandler.add(this.inputElement, 'paste', this.pasteHandler, this);\n EventHandler.add(window, 'resize', this.windowResize, this);\n }\n this.bindCommonEvent();\n };\n ComboBox.prototype.preventBlur = function (e) {\n if ((!this.allowFiltering && document.activeElement !== this.inputElement &&\n !document.activeElement.classList.contains(dropDownListClasses.input) && Browser.isDevice || !Browser.isDevice)) {\n e.preventDefault();\n }\n };\n ComboBox.prototype.onBlurHandler = function (e) {\n var inputValue = this.inputElement && this.inputElement.value === '' ?\n null : this.inputElement && this.inputElement.value;\n if (!isNullOrUndefined(this.listData) && !isNullOrUndefined(inputValue) && inputValue !== this.text) {\n this.customValue(e);\n }\n _super.prototype.onBlurHandler.call(this, e);\n };\n ComboBox.prototype.targetElement = function () {\n return this.inputElement;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ComboBox.prototype.setOldText = function (text) {\n Input.setValue(this.text, this.inputElement, this.floatLabelType, this.showClearButton);\n this.customValue();\n this.removeSelection();\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ComboBox.prototype.setOldValue = function (value) {\n if (this.allowCustom) {\n this.valueMuteChange(this.value);\n }\n else {\n this.valueMuteChange(null);\n }\n this.removeSelection();\n this.setHiddenValue();\n };\n ComboBox.prototype.valueMuteChange = function (value) {\n value = this.allowObjectBinding && !isNullOrUndefined(value) ? getValue((this.fields.value) ? this.fields.value : '', value) : value;\n var inputValue = isNullOrUndefined(value) ? null : value.toString();\n Input.setValue(inputValue, this.inputElement, this.floatLabelType, this.showClearButton);\n if (this.allowObjectBinding) {\n value = this.getDataByValue(value);\n }\n this.setProperties({ value: value, text: value, index: null }, true);\n this.activeIndex = this.index;\n var fields = this.fields;\n var dataItem = {};\n dataItem[fields.text] = isNullOrUndefined(value) ? null : value.toString();\n dataItem[fields.value] = isNullOrUndefined(value) ? null : value.toString();\n this.itemData = dataItem;\n this.item = null;\n if ((!this.allowObjectBinding && (this.previousValue !== this.value)) || (this.allowObjectBinding && this.previousValue && this.value && !this.isObjectInArray(this.previousValue, [this.value]))) {\n this.detachChangeEvent(null);\n }\n };\n ComboBox.prototype.updateValues = function () {\n if (!isNullOrUndefined(this.value)) {\n var currentValue = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n var li = this.getElementByValue(currentValue);\n var doesItemExist = !isNullOrUndefined(li) ? true : false;\n if (this.enableVirtualization && this.value) {\n var fields = (this.fields.value) ? this.fields.value : '';\n var currentValue_1 = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n if (this.dataSource instanceof DataManager) {\n var getItem = new DataManager(this.virtualGroupDataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue_1)));\n if (getItem && getItem.length > 0) {\n this.itemData = getItem[0];\n doesItemExist = true;\n var dataItem = this.getItemData();\n var value = this.allowObjectBinding ? this.getDataByValue(dataItem.value) : dataItem.value;\n if ((this.value === dataItem.value && this.text !== dataItem.text) || (this.value !== dataItem.value && this.text === dataItem.text)) {\n this.setProperties({ 'text': dataItem.text, 'value': value });\n }\n }\n }\n else {\n var getItem = new DataManager(this.dataSource).executeLocal(new Query().where(new Predicate(fields, 'equal', currentValue_1)));\n if (getItem && getItem.length > 0) {\n this.itemData = getItem[0];\n doesItemExist = true;\n var dataItem = this.getItemData();\n var value = this.allowObjectBinding ? this.getDataByValue(dataItem.value) : dataItem.value;\n if ((this.value === dataItem.value && this.text !== dataItem.text) || (this.value !== dataItem.value && this.text === dataItem.text)) {\n this.setProperties({ 'text': dataItem.text, 'value': value });\n }\n }\n }\n }\n if (li) {\n this.setSelection(li, null);\n }\n else if ((!this.enableVirtualization && this.allowCustom) || (this.allowCustom && this.enableVirtualization && !doesItemExist)) {\n this.valueMuteChange(this.value);\n }\n else if (!this.enableVirtualization || (this.enableVirtualization && !doesItemExist)) {\n this.valueMuteChange(null);\n }\n }\n else if (this.text && isNullOrUndefined(this.value)) {\n var li = this.getElementByText(this.text);\n if (li) {\n this.setSelection(li, null);\n }\n else {\n Input.setValue(this.text, this.inputElement, this.floatLabelType, this.showClearButton);\n this.customValue();\n }\n }\n else {\n this.setSelection(this.liCollections[this.activeIndex], null);\n }\n this.setHiddenValue();\n Input.setValue(this.text, this.inputElement, this.floatLabelType, this.showClearButton);\n };\n ComboBox.prototype.updateIconState = function () {\n if (this.showClearButton) {\n if (this.inputElement && this.inputElement.value !== '' && !this.readonly) {\n removeClass([this.inputWrapper.clearButton], dropDownListClasses.clearIconHide);\n }\n else {\n addClass([this.inputWrapper.clearButton], dropDownListClasses.clearIconHide);\n }\n }\n };\n ComboBox.prototype.getAriaAttributes = function () {\n var ariaAttributes = {\n 'role': 'combobox',\n 'aria-autocomplete': 'both',\n 'aria-labelledby': this.hiddenElement.id,\n 'aria-expanded': 'false',\n 'aria-readonly': this.readonly.toString(),\n 'autocomplete': 'off',\n 'autocapitalize': 'off',\n 'spellcheck': 'false'\n };\n return ariaAttributes;\n };\n ComboBox.prototype.searchLists = function (e) {\n this.isTyped = true;\n if (this.isFiltering()) {\n _super.prototype.searchLists.call(this, e);\n if (this.ulElement && this.filterInput.value.trim() === '') {\n this.setHoverList(this.ulElement.querySelector('.' + dropDownListClasses.li));\n }\n }\n else {\n if (this.ulElement && this.inputElement.value === '' && this.preventAutoFill) {\n this.setHoverList(this.ulElement.querySelector('.' + dropDownListClasses.li));\n }\n this.incrementalSearch(e);\n }\n };\n ComboBox.prototype.getNgDirective = function () {\n return 'EJS-COMBOBOX';\n };\n ComboBox.prototype.setSearchBox = function () {\n this.filterInput = this.inputElement;\n var searchBoxContainer = (this.isFiltering() || (this.isReact && this.getModuleName() === 'combobox')) ? this.inputWrapper : inputObject;\n return searchBoxContainer;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ComboBox.prototype.onActionComplete = function (ulElement, list, e, isUpdated) {\n var _this = this;\n _super.prototype.onActionComplete.call(this, ulElement, list, e);\n if (this.isSelectCustom) {\n this.removeSelection();\n }\n if (!this.preventAutoFill && this.getModuleName() === 'combobox' && this.isTyped && !this.enableVirtualization) {\n setTimeout(function () {\n _this.inlineSearch();\n });\n }\n };\n ComboBox.prototype.getFocusElement = function () {\n var dataItem = this.isSelectCustom ? { text: '' } : this.getItemData();\n var selected = !isNullOrUndefined(this.list) ? this.list.querySelector('.' + dropDownListClasses.selected) : this.list;\n var isSelected = dataItem.text && dataItem.text.toString() === this.inputElement.value && !isNullOrUndefined(selected);\n if (isSelected) {\n return selected;\n }\n if ((Browser.isDevice && !this.isDropDownClick || !Browser.isDevice) &&\n !isNullOrUndefined(this.liCollections) && this.liCollections.length > 0) {\n var inputValue = this.inputElement.value;\n var dataSource = this.sortedData;\n var type = this.typeOfData(dataSource).typeof;\n var activeItem = Search(inputValue, this.liCollections, this.filterType, true, dataSource, this.fields, type);\n if (this.enableVirtualization && inputValue !== '' && this.getModuleName() !== 'autocomplete' && this.isTyped && !this.allowFiltering) {\n var updatingincrementalindex = false;\n if ((this.viewPortInfo.endIndex >= this.incrementalEndIndex && this.incrementalEndIndex <= this.totalItemCount) || this.incrementalEndIndex == 0) {\n updatingincrementalindex = true;\n this.incrementalStartIndex = this.incrementalEndIndex;\n if (this.incrementalEndIndex == 0) {\n this.incrementalEndIndex = 100 > this.totalItemCount ? this.totalItemCount : 100;\n }\n else {\n this.incrementalEndIndex = this.incrementalEndIndex + 100 > this.totalItemCount ? this.totalItemCount : this.incrementalEndIndex + 100;\n }\n this.updateIncrementalInfo(this.incrementalStartIndex, this.incrementalEndIndex);\n updatingincrementalindex = true;\n }\n if (this.viewPortInfo.startIndex !== 0 || updatingincrementalindex) {\n this.updateIncrementalView(0, this.itemCount);\n }\n activeItem = Search(inputValue, this.incrementalLiCollections, this.filterType, true, dataSource, this.fields, type);\n while (isNullOrUndefined(activeItem.item) && this.incrementalEndIndex < this.totalItemCount) {\n this.incrementalStartIndex = this.incrementalEndIndex;\n this.incrementalEndIndex = this.incrementalEndIndex + 100 > this.totalItemCount ? this.totalItemCount : this.incrementalEndIndex + 100;\n this.updateIncrementalInfo(this.incrementalStartIndex, this.incrementalEndIndex);\n updatingincrementalindex = true;\n if (this.viewPortInfo.startIndex !== 0 || updatingincrementalindex) {\n this.updateIncrementalView(0, this.itemCount);\n }\n activeItem = Search(inputValue, this.incrementalLiCollections, this.filterType, true, dataSource, this.fields, type);\n if (!isNullOrUndefined(activeItem)) {\n activeItem.index = activeItem.index + this.incrementalStartIndex;\n break;\n }\n if (isNullOrUndefined(activeItem) && this.incrementalEndIndex >= this.totalItemCount) {\n this.incrementalStartIndex = 0;\n this.incrementalEndIndex = 100 > this.totalItemCount ? this.totalItemCount : 100;\n break;\n }\n }\n if (activeItem.index) {\n if ((!(this.viewPortInfo.startIndex >= activeItem.index)) || (!(activeItem.index >= this.viewPortInfo.endIndex))) {\n var startIndex = activeItem.index - ((this.itemCount / 2) - 2) > 0 ? activeItem.index - ((this.itemCount / 2) - 2) : 0;\n var endIndex = this.viewPortInfo.startIndex + this.itemCount > this.totalItemCount ? this.totalItemCount : this.viewPortInfo.startIndex + this.itemCount;\n if (startIndex != this.viewPortInfo.startIndex) {\n this.updateIncrementalView(startIndex, endIndex);\n }\n }\n }\n if (!isNullOrUndefined(activeItem.item)) {\n var index_1 = this.getIndexByValue(activeItem.item.getAttribute('data-value')) - this.skeletonCount;\n if (index_1 > this.itemCount / 2) {\n var startIndex = this.viewPortInfo.startIndex + ((this.itemCount / 2) - 2) < this.totalItemCount ? this.viewPortInfo.startIndex + ((this.itemCount / 2) - 2) : this.totalItemCount;\n var endIndex = this.viewPortInfo.startIndex + this.itemCount > this.totalItemCount ? this.totalItemCount : this.viewPortInfo.startIndex + this.itemCount;\n this.updateIncrementalView(startIndex, endIndex);\n }\n activeItem.item = this.getElementByValue(activeItem.item.getAttribute('data-value'));\n }\n else {\n this.updateIncrementalView(0, this.itemCount);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = this.getTransformValues();\n this.list.scrollTop = 0;\n }\n if (activeItem && activeItem.item) {\n activeItem.item = this.getElementByValue(activeItem.item.getAttribute('data-value'));\n }\n }\n var activeElement = activeItem.item;\n if (!isNullOrUndefined(activeElement)) {\n var count = this.getIndexByValue(activeElement.getAttribute('data-value')) - 1;\n var height = parseInt(getComputedStyle(this.liCollections[0], null).getPropertyValue('height'), 10);\n if (!isNaN(height) && this.getModuleName() !== 'autocomplete') {\n this.removeFocus();\n var fixedHead = this.fields.groupBy ? this.liCollections[0].offsetHeight : 0;\n if (!this.enableVirtualization) {\n this.list.scrollTop = count * height + fixedHead;\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.list.getElementsByClassName('e-virtual-ddl-content')[0].style = this.getTransformValues();\n if (this.enableVirtualization && !this.fields.groupBy) {\n var selectedLiOffsetTop = this.virtualListInfo && this.virtualListInfo.startIndex ? activeElement.offsetTop + (this.virtualListInfo.startIndex * activeElement.offsetHeight) : activeElement.offsetTop;\n this.list.scrollTop = selectedLiOffsetTop - (this.list.querySelectorAll('.e-virtual-list').length * activeElement.offsetHeight);\n }\n }\n addClass([activeElement], dropDownListClasses.focus);\n }\n }\n else {\n if (this.isSelectCustom && this.inputElement.value.trim() !== '') {\n this.removeFocus();\n if (!this.enableVirtualization) {\n this.list.scrollTop = 0;\n }\n }\n }\n return activeElement;\n }\n else {\n return null;\n }\n };\n ComboBox.prototype.setValue = function (e) {\n if ((e && e.type === 'keydown' && e.action === 'enter') || (e && e.type === 'click')) {\n this.removeFillSelection();\n }\n if (this.autofill && this.getModuleName() === 'combobox' && e && e.type === 'keydown' && e.action !== 'enter') {\n this.preventAutoFill = false;\n this.inlineSearch(e);\n return false;\n }\n else {\n return _super.prototype.setValue.call(this, e);\n }\n };\n ComboBox.prototype.checkCustomValue = function () {\n var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n this.itemData = this.getDataByValue(value);\n var dataItem = this.getItemData();\n var setValue = this.allowObjectBinding ? this.itemData : dataItem.value;\n if (!(this.allowCustom && isNullOrUndefined(dataItem.value) && isNullOrUndefined(dataItem.text))) {\n this.setProperties({ 'value': setValue }, !this.allowCustom);\n }\n };\n /**\n * Shows the spinner loader.\n *\n * @returns {void}\n\n */\n ComboBox.prototype.showSpinner = function () {\n if (isNullOrUndefined(this.spinnerElement)) {\n this.spinnerElement = (this.getModuleName() === 'autocomplete') ? (this.inputWrapper.buttons[0] ||\n this.inputWrapper.clearButton ||\n Input.appendSpan('e-input-group-icon ' + SPINNER_CLASS, this.inputWrapper.container, this.createElement)) :\n (this.inputWrapper.buttons[0] || this.inputWrapper.clearButton);\n addClass([this.spinnerElement], dropDownListClasses.disableIcon);\n createSpinner({\n target: this.spinnerElement,\n width: Browser.isDevice ? '16px' : '14px'\n }, this.createElement);\n showSpinner(this.spinnerElement);\n }\n };\n /**\n * Hides the spinner loader.\n *\n * @returns {void}\n\n */\n ComboBox.prototype.hideSpinner = function () {\n if (!isNullOrUndefined(this.spinnerElement)) {\n hideSpinner(this.spinnerElement);\n removeClass([this.spinnerElement], dropDownListClasses.disableIcon);\n if (this.spinnerElement.classList.contains(SPINNER_CLASS)) {\n detach(this.spinnerElement);\n }\n else {\n this.spinnerElement.innerHTML = '';\n }\n this.spinnerElement = null;\n }\n };\n ComboBox.prototype.setAutoFill = function (activeElement, isHover) {\n if (!isHover) {\n this.setHoverList(activeElement);\n }\n if (this.autofill && !this.preventAutoFill) {\n var currentValue = this.getTextByValue(activeElement.getAttribute('data-value')).toString();\n var currentFillValue = this.getFormattedValue(activeElement.getAttribute('data-value'));\n if (this.getModuleName() === 'combobox') {\n if (!this.isSelected && ((!this.allowObjectBinding && this.previousValue !== currentFillValue)) || (this.allowObjectBinding && this.previousValue && currentFillValue && !this.isObjectInArray(this.previousValue, [this.getDataByValue(currentFillValue)]))) {\n this.updateSelectedItem(activeElement, null);\n this.isSelected = true;\n this.previousValue = this.allowObjectBinding ? this.getDataByValue(this.getFormattedValue(activeElement.getAttribute('data-value'))) : this.getFormattedValue(activeElement.getAttribute('data-value'));\n }\n else {\n this.updateSelectedItem(activeElement, null, true);\n }\n }\n if (!this.isAndroidAutoFill(currentValue)) {\n this.setAutoFillSelection(currentValue, isHover);\n }\n }\n };\n ComboBox.prototype.isAndroidAutoFill = function (value) {\n if (Browser.isAndroid) {\n var currentPoints = this.getSelectionPoints();\n var prevEnd = this.prevSelectPoints.end;\n var curEnd = currentPoints.end;\n var prevStart = this.prevSelectPoints.start;\n var curStart = currentPoints.start;\n if (prevEnd !== 0 && ((prevEnd === value.length && prevStart === value.length) ||\n (prevStart > curStart && prevEnd > curEnd) || (prevEnd === curEnd && prevStart === curStart))) {\n return true;\n }\n else {\n return false;\n }\n }\n else {\n return false;\n }\n };\n ComboBox.prototype.clearAll = function (e, property) {\n if (isNullOrUndefined(property) || (!isNullOrUndefined(property) && isNullOrUndefined(property.dataSource))) {\n _super.prototype.clearAll.call(this, e);\n }\n if (this.isFiltering() && !isNullOrUndefined(e) && e.target === this.inputWrapper.clearButton) {\n this.searchLists(e);\n }\n };\n ComboBox.prototype.isSelectFocusItem = function (element) {\n return !isNullOrUndefined(element);\n };\n ComboBox.prototype.inlineSearch = function (e) {\n var isKeyNavigate = (e && (e.action === 'down' || e.action === 'up' ||\n e.action === 'home' || e.action === 'end' || e.action === 'pageUp' || e.action === 'pageDown'));\n var activeElement = isKeyNavigate ? this.liCollections[this.activeIndex] : this.getFocusElement();\n if (!isNullOrUndefined(activeElement)) {\n if (!isKeyNavigate) {\n var value = this.getFormattedValue(activeElement.getAttribute('data-value'));\n this.activeIndex = this.getIndexByValue(value);\n this.activeIndex = !isNullOrUndefined(this.activeIndex) ? this.activeIndex : null;\n }\n this.preventAutoFill = this.inputElement.value === '' ? false : this.preventAutoFill;\n this.setAutoFill(activeElement, isKeyNavigate);\n }\n else if (!isNullOrUndefined(this.inputElement) && this.inputElement.value === '') {\n this.activeIndex = null;\n if (!isNullOrUndefined(this.list)) {\n if (!this.enableVirtualization) {\n this.list.scrollTop = 0;\n }\n var focusItem = this.list.querySelector('.' + dropDownListClasses.li);\n this.setHoverList(focusItem);\n }\n }\n else {\n this.activeIndex = null;\n this.removeSelection();\n if (this.liCollections && this.liCollections.length > 0 && !this.isCustomFilter) {\n this.removeFocus();\n }\n }\n };\n ComboBox.prototype.incrementalSearch = function (e) {\n this.showPopup(e);\n if (!isNullOrUndefined(this.listData)) {\n this.inlineSearch(e);\n e.preventDefault();\n }\n };\n ComboBox.prototype.setAutoFillSelection = function (currentValue, isKeyNavigate) {\n if (isKeyNavigate === void 0) { isKeyNavigate = false; }\n var selection = this.getSelectionPoints();\n var value = this.inputElement.value.substr(0, selection.start);\n if (value && (value.toLowerCase() === currentValue.substr(0, selection.start).toLowerCase())) {\n var inputValue = value + currentValue.substr(value.length, currentValue.length);\n Input.setValue(inputValue, this.inputElement, this.floatLabelType, this.showClearButton);\n this.inputElement.setSelectionRange(selection.start, this.inputElement.value.length);\n }\n else if (isKeyNavigate) {\n Input.setValue(currentValue, this.inputElement, this.floatLabelType, this.showClearButton);\n this.inputElement.setSelectionRange(0, this.inputElement.value.length);\n }\n };\n ComboBox.prototype.getValueByText = function (text) {\n return _super.prototype.getValueByText.call(this, text, true, this.ignoreAccent);\n };\n ComboBox.prototype.unWireEvent = function () {\n if (this.getModuleName() === 'combobox') {\n EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown', this.preventBlur);\n EventHandler.remove(this.inputWrapper.container, 'blur', this.onBlurHandler);\n }\n if (!isNullOrUndefined(this.inputWrapper.buttons[0])) {\n EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown', this.dropDownClick);\n }\n if (this.inputElement) {\n EventHandler.remove(this.inputElement, 'focus', this.targetFocus);\n if (!this.readonly) {\n EventHandler.remove(this.inputElement, 'input', this.onInput);\n EventHandler.remove(this.inputElement, 'keyup', this.onFilterUp);\n EventHandler.remove(this.inputElement, 'keydown', this.onFilterDown);\n EventHandler.remove(this.inputElement, 'paste', this.pasteHandler);\n EventHandler.remove(window, 'resize', this.windowResize);\n }\n }\n this.unBindCommonEvent();\n };\n ComboBox.prototype.setSelection = function (li, e) {\n _super.prototype.setSelection.call(this, li, e);\n if (!isNullOrUndefined(li) && !this.autofill && !this.isDropDownClick) {\n this.removeFocus();\n }\n };\n ComboBox.prototype.selectCurrentItem = function (e) {\n var li;\n if (this.isPopupOpen) {\n if (this.isSelected) {\n li = this.list.querySelector('.' + dropDownListClasses.selected);\n }\n else {\n li = this.list.querySelector('.' + dropDownListClasses.focus);\n }\n if (li) {\n this.setSelection(li, e);\n this.isTyped = false;\n }\n if (this.isSelected) {\n this.isSelectCustom = false;\n this.onChangeEvent(e);\n }\n }\n if (e.action === 'enter' && this.inputElement.value.trim() === '') {\n this.clearAll(e);\n }\n else if (this.isTyped && !this.isSelected && isNullOrUndefined(li)) {\n this.customValue(e);\n }\n this.hidePopup(e);\n };\n ComboBox.prototype.setHoverList = function (li) {\n this.removeSelection();\n if (this.isValidLI(li) && !li.classList.contains(dropDownListClasses.selected)) {\n this.removeFocus();\n li.classList.add(dropDownListClasses.focus);\n }\n };\n ComboBox.prototype.targetFocus = function (e) {\n if (Browser.isDevice && !this.allowFiltering) {\n this.preventFocus = false;\n }\n this.onFocus(e);\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n };\n ComboBox.prototype.dropDownClick = function (e) {\n e.preventDefault();\n if (Browser.isDevice && !this.isFiltering()) {\n this.preventFocus = true;\n }\n _super.prototype.dropDownClick.call(this, e);\n };\n ComboBox.prototype.customValue = function (e) {\n var _this = this;\n var value = this.getValueByText(this.inputElement.value);\n if (!this.allowCustom && this.inputElement.value !== '') {\n var previousValue = this.previousValue;\n var currentValue = this.value;\n value = this.allowObjectBinding ? this.getDataByValue(value) : value;\n this.setProperties({ value: value });\n if (isNullOrUndefined(this.value)) {\n Input.setValue('', this.inputElement, this.floatLabelType, this.showClearButton);\n }\n var newValue = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n if (this.autofill && ((!this.allowObjectBinding && previousValue === this.value) || (this.allowObjectBinding && previousValue && this.isObjectInArray(previousValue, [this.value]))) && ((!this.allowObjectBinding && currentValue !== this.value) || (this.allowObjectBinding && currentValue && !this.isObjectInArray(currentValue, [this.value])))) {\n this.onChangeEvent(null);\n }\n }\n else if (this.inputElement.value.trim() !== '') {\n var previousValue_1 = this.value;\n if (isNullOrUndefined(value)) {\n var value_1 = this.inputElement.value === '' ? null : this.inputElement.value;\n // eslint-disable-next-line max-len\n var eventArgs = { text: value_1, item: {} };\n this.isObjectCustomValue = true;\n if (!this.initial) {\n this.trigger('customValueSpecifier', eventArgs, function (eventArgs) {\n _this.updateCustomValueCallback(value_1, eventArgs, previousValue_1, e);\n });\n }\n else {\n this.updateCustomValueCallback(value_1, eventArgs, previousValue_1);\n }\n }\n else {\n this.isSelectCustom = false;\n value = this.allowObjectBinding ? this.getDataByValue(value) : value;\n this.setProperties({ value: value });\n if ((!this.allowObjectBinding && previousValue_1 !== this.value) || (this.allowObjectBinding && previousValue_1 && this.value && !this.isObjectInArray(previousValue_1, [this.value]))) {\n this.onChangeEvent(e);\n }\n }\n }\n else if (this.allowCustom) {\n this.isSelectCustom = true;\n }\n };\n ComboBox.prototype.updateCustomValueCallback = function (value, eventArgs, previousValue, e) {\n var _this = this;\n var fields = this.fields;\n var item = eventArgs.item;\n var dataItem = {};\n if (item && getValue(fields.text, item) && getValue(fields.value, item)) {\n dataItem = item;\n }\n else {\n setValue(fields.text, value, dataItem);\n setValue(fields.value, value, dataItem);\n }\n this.itemData = dataItem;\n var emptyObject = {};\n if (this.allowObjectBinding) {\n var keys = this.listData && this.listData.length > 0 ? Object.keys(this.listData[0]) : Object.keys(this.itemData);\n if ((!(this.listData && this.listData.length > 0)) && (this.getModuleName() === 'autocomplete' || (this.getModuleName() === 'combobox' && this.allowFiltering))) {\n keys = this.firstItem ? Object.keys(this.firstItem) : Object.keys(this.itemData);\n }\n // Create an empty object with predefined keys\n keys.forEach(function (key) {\n emptyObject[key] = ((key === fields.value) || (key === fields.text)) ? getValue(fields.value, _this.itemData) : null;\n });\n }\n var changeData = {\n text: getValue(fields.text, this.itemData),\n value: this.allowObjectBinding ? emptyObject : getValue(fields.value, this.itemData),\n index: null\n };\n this.setProperties(changeData, true);\n this.setSelection(null, null);\n this.isSelectCustom = true;\n this.isObjectCustomValue = false;\n if ((!this.allowObjectBinding && (previousValue !== this.value)) || (this.allowObjectBinding && ((previousValue == null && this.value !== null) || (previousValue && !this.isObjectInArray(previousValue, [this.value]))))) {\n this.onChangeEvent(e, true);\n }\n };\n /**\n * Dynamically change the value of properties.\n *\n * @param {ComboBoxModel} newProp - Returns the dynamic property value of the component.\n * @param {ComboBoxModel} oldProp - Returns the previous property value of the component.\n * @private\n * @returns {void}\n */\n ComboBox.prototype.onPropertyChanged = function (newProp, oldProp) {\n if (this.getModuleName() === 'combobox') {\n this.checkData(newProp);\n this.setUpdateInitial(['fields', 'query', 'dataSource'], newProp, oldProp);\n }\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'readonly':\n Input.setReadonly(this.readonly, this.inputElement);\n if (this.readonly) {\n EventHandler.remove(this.inputElement, 'input', this.onInput);\n EventHandler.remove(this.inputElement, 'keyup', this.onFilterUp);\n EventHandler.remove(this.inputElement, 'keydown', this.onFilterDown);\n }\n else {\n EventHandler.add(this.inputElement, 'input', this.onInput, this);\n EventHandler.add(this.inputElement, 'keyup', this.onFilterUp, this);\n EventHandler.add(this.inputElement, 'keydown', this.onFilterDown, this);\n }\n this.setReadOnly();\n break;\n case 'allowFiltering':\n this.setSearchBox();\n if (this.isFiltering() && this.getModuleName() === 'combobox' && isNullOrUndefined(this.list)) {\n _super.prototype.renderList.call(this);\n }\n break;\n case 'allowCustom':\n break;\n default: {\n // eslint-disable-next-line max-len\n var comboProps = this.getPropObject(prop, newProp, oldProp);\n _super.prototype.onPropertyChanged.call(this, comboProps.newProperty, comboProps.oldProperty);\n if (this.isFiltering() && prop === 'dataSource' && isNullOrUndefined(this.list) && this.itemTemplate &&\n this.getModuleName() === 'combobox') {\n _super.prototype.renderList.call(this);\n }\n break;\n }\n }\n }\n };\n /**\n * To initialize the control rendering.\n *\n * @private\n * @returns {void}\n */\n ComboBox.prototype.render = function () {\n _super.prototype.render.call(this);\n this.setSearchBox();\n this.renderComplete();\n };\n /**\n * Return the module name of this component.\n *\n * @private\n * @returns {string} Return the module name of this component.\n */\n ComboBox.prototype.getModuleName = function () {\n return 'combobox';\n };\n /**\n * Adds a new item to the combobox popup list. By default, new item appends to the list as the last item,\n * but you can insert based on the index parameter.\n *\n * @param { Object[] } items - Specifies an array of JSON data or a JSON data.\n * @param { number } itemIndex - Specifies the index to place the newly added item in the popup list.\n * @returns {void}\n\n */\n ComboBox.prototype.addItem = function (items, itemIndex) {\n _super.prototype.addItem.call(this, items, itemIndex);\n };\n /**\n * To filter the data from given data source by using query\n *\n * @param {Object[] | DataManager } dataSource - Set the data source to filter.\n * @param {Query} query - Specify the query to filter the data.\n * @param {FieldSettingsModel} fields - Specify the fields to map the column in the data table.\n * @returns {void}\n\n */\n ComboBox.prototype.filter = function (dataSource, query, fields) {\n _super.prototype.filter.call(this, dataSource, query, fields);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Opens the popup that displays the list of items.\n *\n * @returns {void}\n\n */\n ComboBox.prototype.showPopup = function (e) {\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n _super.prototype.showPopup.call(this, e);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Hides the popup if it is in open state.\n *\n * @returns {void}\n\n */\n ComboBox.prototype.hidePopup = function (e) {\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n var inputValue = this.inputElement && this.inputElement.value === '' ? null\n : this.inputElement && this.inputElement.value;\n if (!isNullOrUndefined(this.listData)) {\n var isEscape = this.isEscapeKey;\n if (this.isEscapeKey) {\n Input.setValue(this.typedString, this.inputElement, this.floatLabelType, this.showClearButton);\n this.isEscapeKey = false;\n }\n if (this.autofill) {\n this.removeFillSelection();\n }\n var dataItem = this.isSelectCustom ? { text: '' } : this.getItemData();\n var selected = !isNullOrUndefined(this.list) ? this.list.querySelector('.' + dropDownListClasses.selected) : null;\n if (this.inputElement && dataItem.text === this.inputElement.value && !isNullOrUndefined(selected)) {\n if (this.isSelected) {\n this.onChangeEvent(e);\n this.isSelectCustom = false;\n }\n _super.prototype.hidePopup.call(this, e);\n return;\n }\n if (this.getModuleName() === 'combobox' && this.inputElement.value.trim() !== '') {\n var dataSource = this.sortedData;\n var type = this.typeOfData(dataSource).typeof;\n var searchItem = Search(this.inputElement.value, this.liCollections, 'Equal', true, dataSource, this.fields, type);\n this.selectedLI = searchItem.item;\n if (isNullOrUndefined(searchItem.index)) {\n searchItem.index = Search(this.inputElement.value, this.liCollections, 'StartsWith', true, dataSource, this.fields, type).index;\n }\n this.activeIndex = searchItem.index;\n if (!isNullOrUndefined(this.selectedLI)) {\n this.updateSelectedItem(this.selectedLI, null, true);\n }\n else if (isEscape) {\n this.isSelectCustom = true;\n this.removeSelection();\n }\n }\n if (!this.isEscapeKey && this.isTyped && !this.isInteracted) {\n this.customValue(e);\n }\n }\n var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n if (isNullOrUndefined(this.listData) && this.allowCustom && !isNullOrUndefined(inputValue) && inputValue !== value) {\n this.customValue();\n }\n _super.prototype.hidePopup.call(this, e);\n };\n /**\n * Sets the focus to the component for interaction.\n *\n * @returns {void}\n */\n ComboBox.prototype.focusIn = function () {\n if (!this.enabled) {\n return;\n }\n if (Browser.isDevice && !this.isFiltering()) {\n this.preventFocus = true;\n }\n _super.prototype.focusIn.call(this);\n };\n /**\n * Allows you to clear the selected values from the component.\n *\n * @returns {void}\n\n */\n ComboBox.prototype.clear = function () {\n this.value = null;\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Moves the focus from the component if the component is already focused.\n *\n * @returns {void}\n\n */\n ComboBox.prototype.focusOut = function (e) {\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n _super.prototype.focusOut.call(this, e);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets all the list items bound on this component.\n *\n * @returns {Element[]}\n\n */\n ComboBox.prototype.getItems = function () {\n return _super.prototype.getItems.call(this);\n };\n /**\n * Gets the data Object that matches the given value.\n *\n * @param { string | number } value - Specifies the value of the list item.\n * @returns {Object}\n\n */\n ComboBox.prototype.getDataByValue = function (value) {\n return _super.prototype.getDataByValue.call(this, value);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n ComboBox.prototype.renderHightSearch = function () {\n // update high light search\n };\n __decorate([\n Property(false)\n ], ComboBox.prototype, \"autofill\", void 0);\n __decorate([\n Property(true)\n ], ComboBox.prototype, \"allowCustom\", void 0);\n __decorate([\n Property({})\n ], ComboBox.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(false)\n ], ComboBox.prototype, \"allowFiltering\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"query\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"index\", void 0);\n __decorate([\n Property(true)\n ], ComboBox.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(false)\n ], ComboBox.prototype, \"enableRtl\", void 0);\n __decorate([\n Event()\n ], ComboBox.prototype, \"customValueSpecifier\", void 0);\n __decorate([\n Event()\n ], ComboBox.prototype, \"filtering\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"valueTemplate\", void 0);\n __decorate([\n Property('Never')\n ], ComboBox.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"filterBarPlaceholder\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"headerTemplate\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"footerTemplate\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"placeholder\", void 0);\n __decorate([\n Property('100%')\n ], ComboBox.prototype, \"width\", void 0);\n __decorate([\n Property('300px')\n ], ComboBox.prototype, \"popupHeight\", void 0);\n __decorate([\n Property('100%')\n ], ComboBox.prototype, \"popupWidth\", void 0);\n __decorate([\n Property(false)\n ], ComboBox.prototype, \"readonly\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"text\", void 0);\n __decorate([\n Property(null)\n ], ComboBox.prototype, \"value\", void 0);\n __decorate([\n Property(false)\n ], ComboBox.prototype, \"allowObjectBinding\", void 0);\n ComboBox = __decorate([\n NotifyPropertyChanges\n ], ComboBox);\n return ComboBox;\n}(DropDownList));\nexport { ComboBox };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// \nimport { Property, EventHandler, isNullOrUndefined, detach, getValue } from '@syncfusion/ej2-base';\nimport { Event, Complex } from '@syncfusion/ej2-base';\nimport { removeClass, NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { dropDownListClasses } from '../drop-down-list/drop-down-list';\nimport { ComboBox } from '../combo-box/combo-box';\nimport { highlightSearch, revertHighlightSearch } from '../common/highlight-search';\nimport { Search } from '../common/incremental-search';\nimport { FieldSettings } from '../drop-down-base/drop-down-base';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { DataManager, Predicate, Query } from '@syncfusion/ej2-data';\ndropDownListClasses.root = 'e-autocomplete';\ndropDownListClasses.icon = 'e-input-group-icon e-ddl-icon e-search-icon';\n/**\n * The AutoComplete component provides the matched suggestion list when type into the input,\n * from which the user can select one.\n * ```html\n * \n * ```\n * ```typescript\n * let atcObj:AutoComplete = new AutoComplete();\n * atcObj.appendTo(\"#list\");\n * ```\n */\nvar AutoComplete = /** @class */ (function (_super) {\n __extends(AutoComplete, _super);\n /**\n * * Constructor for creating the widget\n *\n * @param {AutoCompleteModel} options - Specifies the AutoComplete model.\n * @param {string | HTMLElement} element - Specifies the element to render as component.\n * @private\n */\n function AutoComplete(options, element) {\n var _this_1 = _super.call(this, options, element) || this;\n _this_1.isFiltered = false;\n _this_1.searchList = false;\n return _this_1;\n }\n /**\n * Initialize the event handler\n *\n * @private\n * @returns {void}\n */\n AutoComplete.prototype.preRender = function () {\n _super.prototype.preRender.call(this);\n };\n AutoComplete.prototype.getLocaleName = function () {\n return 'auto-complete';\n };\n AutoComplete.prototype.getNgDirective = function () {\n return 'EJS-AUTOCOMPLETE';\n };\n AutoComplete.prototype.getQuery = function (query) {\n var filterQuery = query ? query.clone() : this.query ? this.query.clone() : new Query();\n var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;\n var filterType = (this.queryString === '' && !isNullOrUndefined(value)) ? 'equal' : this.filterType;\n var queryString = (this.queryString === '' && !isNullOrUndefined(value)) ? value : this.queryString;\n if (this.isFiltered) {\n if ((this.enableVirtualization && !isNullOrUndefined(this.customFilterQuery))) {\n filterQuery = this.customFilterQuery.clone();\n }\n else if (!this.enableVirtualization) {\n return filterQuery;\n }\n }\n if (this.queryString !== null && this.queryString !== '') {\n var dataType = this.typeOfData(this.dataSource).typeof;\n if (!(this.dataSource instanceof DataManager) && dataType === 'string' || dataType === 'number') {\n filterQuery.where('', filterType, queryString, this.ignoreCase, this.ignoreAccent);\n }\n else {\n var mapping = !isNullOrUndefined(this.fields.value) ? this.fields.value : '';\n filterQuery.where(mapping, filterType, queryString, this.ignoreCase, this.ignoreAccent);\n }\n }\n if (!isNullOrUndefined(this.suggestionCount) && !this.enableVirtualization) {\n // Since defualt value of suggestioncount is 20, checked the condition\n if (this.suggestionCount !== 20) {\n for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {\n if (filterQuery.queries[queryElements].fn === 'onTake') {\n filterQuery.queries.splice(queryElements, 1);\n }\n }\n }\n filterQuery.take(this.suggestionCount);\n }\n if (this.enableVirtualization) {\n var queryTakeValue = 0;\n var querySkipValue = 0;\n var takeValue = this.getTakeValue();\n if (filterQuery && filterQuery.queries.length > 0) {\n for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {\n if (filterQuery.queries[queryElements].fn === 'onSkip') {\n querySkipValue = filterQuery.queries[queryElements].e.nos;\n }\n if (filterQuery.queries[queryElements].fn === 'onTake') {\n queryTakeValue = takeValue <= filterQuery.queries[queryElements].e.nos ? filterQuery.queries[queryElements].e.nos : takeValue;\n }\n }\n }\n if (queryTakeValue <= 0 && this.query && this.query.queries.length > 0) {\n for (var queryElements = 0; queryElements < this.query.queries.length; queryElements++) {\n if (this.query.queries[queryElements].fn === 'onTake') {\n queryTakeValue = takeValue <= this.query.queries[queryElements].e.nos ? this.query.queries[queryElements].e.nos : takeValue;\n }\n }\n }\n if (filterQuery && filterQuery.queries.length > 0) {\n for (var queryElements = 0; queryElements < filterQuery.queries.length; queryElements++) {\n if (filterQuery.queries[queryElements].fn === 'onSkip') {\n querySkipValue = filterQuery.queries[queryElements].e.nos;\n filterQuery.queries.splice(queryElements, 1);\n --queryElements;\n continue;\n }\n if (filterQuery.queries[queryElements].fn === 'onTake') {\n queryTakeValue = filterQuery.queries[queryElements].e.nos <= queryTakeValue ? queryTakeValue : filterQuery.queries[queryElements].e.nos;\n filterQuery.queries.splice(queryElements, 1);\n --queryElements;\n }\n }\n }\n if (querySkipValue > 0 && this.virtualItemStartIndex <= querySkipValue) {\n filterQuery.skip(querySkipValue);\n }\n else {\n filterQuery.skip(this.virtualItemStartIndex);\n }\n if (queryTakeValue > 0 && takeValue <= queryTakeValue) {\n filterQuery.take(queryTakeValue);\n }\n else {\n filterQuery.take(takeValue);\n }\n filterQuery.requiresCount();\n }\n return filterQuery;\n };\n AutoComplete.prototype.searchLists = function (e) {\n var _this_1 = this;\n this.isTyped = true;\n this.isDataFetched = this.isSelectCustom = false;\n this.firstItem = this.dataSource && this.dataSource.length > 0 ? this.dataSource[0] : null;\n this.checkAndResetCache();\n if (isNullOrUndefined(this.list)) {\n _super.prototype.renderList.call(this, e, true);\n }\n this.queryString = this.filterInput.value;\n if (e.type !== 'mousedown' && (e.keyCode === 40 || e.keyCode === 38)) {\n this.queryString = this.queryString === '' ? null : this.queryString;\n this.beforePopupOpen = true;\n this.resetList(this.dataSource, this.fields, null, e);\n return;\n }\n this.isSelected = false;\n this.activeIndex = null;\n var eventArgs = {\n preventDefaultAction: false,\n text: this.filterInput.value,\n updateData: function (dataSource, query, fields) {\n if (eventArgs.cancel) {\n return;\n }\n _this_1.isFiltered = true;\n _this_1.customFilterQuery = query;\n _this_1.filterAction(dataSource, query, fields);\n },\n cancel: false\n };\n this.trigger('filtering', eventArgs, function (eventArgs) {\n if (!eventArgs.cancel && !_this_1.isFiltered && !eventArgs.preventDefaultAction) {\n _this_1.searchList = true;\n _this_1.filterAction(_this_1.dataSource, null, _this_1.fields, e);\n }\n });\n };\n /**\n * To filter the data from given data source by using query\n *\n * @param {Object[] | DataManager } dataSource - Set the data source to filter.\n * @param {Query} query - Specify the query to filter the data.\n * @param {FieldSettingsModel} fields - Specify the fields to map the column in the data table.\n * @returns {void}\n\n */\n AutoComplete.prototype.filter = function (dataSource, query, fields) {\n this.isFiltered = true;\n this.filterAction(dataSource, query, fields);\n };\n AutoComplete.prototype.filterAction = function (dataSource, query, fields, e) {\n this.beforePopupOpen = true;\n var isNoDataElement = this.list.classList.contains('e-nodata');\n if (this.queryString !== '' && (this.queryString.length >= this.minLength)) {\n if (this.enableVirtualization && this.isFiltering() && this.isTyped) {\n this.isPreventScrollAction = true;\n this.list.scrollTop = 0;\n this.previousStartIndex = 0;\n this.virtualListInfo = null;\n }\n this.resetList(dataSource, fields, query, e);\n if (this.enableVirtualization && isNoDataElement && !this.list.classList.contains('e-nodata')) {\n if (!this.list.querySelector('.e-virtual-ddl-content')) {\n this.list.appendChild(this.createElement('div', {\n className: 'e-virtual-ddl-content',\n styles: this.getTransformValues()\n })).appendChild(this.list.querySelector('.e-list-parent'));\n }\n if (!this.list.querySelector('.e-virtual-ddl')) {\n var virualElement = this.createElement('div', {\n id: this.element.id + '_popup', className: 'e-virtual-ddl', styles: this.GetVirtualTrackHeight()\n });\n document.getElementsByClassName('e-popup')[0].querySelector('.e-dropdownbase').appendChild(virualElement);\n }\n }\n if ((this.getModuleName() === 'autocomplete' && !(this.dataSource instanceof DataManager)) || (this.getModuleName() === 'autocomplete' && (this.dataSource instanceof DataManager) && this.totalItemCount != 0)) {\n this.getFilteringSkeletonCount();\n }\n }\n else {\n this.hidePopup(e);\n this.beforePopupOpen = false;\n }\n this.renderReactTemplates();\n };\n AutoComplete.prototype.clearAll = function (e, property) {\n if (isNullOrUndefined(property) || (!isNullOrUndefined(property) && isNullOrUndefined(property.dataSource))) {\n _super.prototype.clearAll.call(this, e);\n this.checkAndResetCache();\n }\n if (this.beforePopupOpen) {\n this.hidePopup();\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n AutoComplete.prototype.onActionComplete = function (ulElement, list, e, isUpdated) {\n if (!this.enableVirtualization) {\n this.fixedHeaderElement = null;\n }\n if ((this.getModuleName() === 'autocomplete' && !(this.dataSource instanceof DataManager)) || (this.getModuleName() === 'autocomplete' && (this.dataSource instanceof DataManager) && this.totalItemCount != 0)) {\n this.getFilteringSkeletonCount();\n }\n _super.prototype.onActionComplete.call(this, ulElement, list, e);\n var item = this.list.querySelector('.' + dropDownListClasses.li);\n if (!isNullOrUndefined(item)) {\n removeClass([item], dropDownListClasses.focus);\n }\n this.postBackAction();\n };\n AutoComplete.prototype.postBackAction = function () {\n if (this.autofill && !isNullOrUndefined(this.liCollections[0]) && this.searchList) {\n var items = [this.liCollections[0]];\n var dataSource = this.listData;\n var type = this.typeOfData(dataSource).typeof;\n var searchItem = Search(this.inputElement.value, items, 'StartsWith', this.ignoreCase, dataSource, this.fields, type);\n this.searchList = false;\n if (!isNullOrUndefined(searchItem.item)) {\n _super.prototype.setAutoFill.call(this, this.liCollections[0], true);\n }\n }\n };\n AutoComplete.prototype.setSelection = function (li, e) {\n if (!this.isValidLI(li)) {\n this.selectedLI = li;\n return;\n }\n if (!isNullOrUndefined(e) && e.type === 'keydown' && e.action !== 'enter'\n && e.action !== 'tab' && this.isValidLI(li)) {\n var value = this.getFormattedValue(li.getAttribute('data-value'));\n this.activeIndex = this.getIndexByValue(value);\n this.setHoverList(li);\n this.selectedLI = li;\n this.setScrollPosition(e);\n if (this.autofill && this.isPopupOpen) {\n this.preventAutoFill = false;\n var isKeyNavigate = (e && e.action === 'down' || e.action === 'up' ||\n e.action === 'home' || e.action === 'end' || e.action === 'pageUp' || e.action === 'pageDown');\n _super.prototype.setAutoFill.call(this, li, isKeyNavigate);\n }\n }\n else {\n _super.prototype.setSelection.call(this, li, e);\n }\n };\n AutoComplete.prototype.listOption = function (dataSource, fieldsSettings) {\n var _this_1 = this;\n var fields = _super.prototype.listOption.call(this, dataSource, fieldsSettings);\n if (isNullOrUndefined(fields.itemCreated)) {\n fields.itemCreated = function (e) {\n if (_this_1.highlight) {\n if (_this_1.element.tagName === _this_1.getNgDirective() && _this_1.itemTemplate) {\n setTimeout(function () {\n highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);\n }, 0);\n }\n else {\n highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);\n }\n }\n };\n }\n else {\n var itemCreated_1 = fields.itemCreated;\n fields.itemCreated = function (e) {\n if (_this_1.highlight) {\n highlightSearch(e.item, _this_1.queryString, _this_1.ignoreCase, _this_1.filterType);\n }\n itemCreated_1.apply(_this_1, [e]);\n };\n }\n return fields;\n };\n AutoComplete.prototype.isFiltering = function () {\n return true;\n };\n AutoComplete.prototype.renderPopup = function (e) {\n if (!this.enableVirtualization) {\n this.list.scrollTop = 0;\n }\n _super.prototype.renderPopup.call(this, e);\n };\n AutoComplete.prototype.isEditTextBox = function () {\n return false;\n };\n AutoComplete.prototype.isPopupButton = function () {\n return this.showPopupButton;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n AutoComplete.prototype.isSelectFocusItem = function (element) {\n return false;\n };\n AutoComplete.prototype.setInputValue = function (newProp, oldProp) {\n var oldValue = oldProp && oldProp.text ? oldProp.text : oldProp ? oldProp.value : oldProp;\n var value = newProp && newProp.text ? newProp.text : newProp && newProp.value ? newProp.value : this.value;\n if (this.allowObjectBinding) {\n oldValue = !isNullOrUndefined(oldValue) ? getValue((this.fields.value) ? this.fields.value : '', oldValue) : oldValue;\n value = !isNullOrUndefined(value) ? getValue((this.fields.value) ? this.fields.value : '', value) : value;\n }\n if (value && this.typedString === '' && !this.allowCustom && !(this.dataSource instanceof DataManager)) {\n var checkFields_1_1 = this.typeOfData(this.dataSource).typeof === 'string' ? '' : this.fields.value;\n var listLength_1 = this.getItems().length;\n var query = new Query();\n var _this_2 = this;\n new DataManager(this.dataSource).executeQuery(query.where(new Predicate(checkFields_1_1, 'equal', value)))\n .then(function (e) {\n if (e.result.length > 0) {\n _this_2.value = checkFields_1_1 !== '' ? _this_2.allowObjectBinding ? e.result[0] : e.result[0][_this_2.fields.value].toString() : e.result[0].toString();\n _this_2.addItem(e.result, listLength_1);\n _this_2.updateValues();\n }\n else {\n newProp && newProp.text ? _this_2.setOldText(oldValue) : newProp && newProp.value ? _this_2.setOldValue(oldValue) : _this_2.updateValues();\n }\n });\n }\n else if (newProp) {\n newProp.text ? this.setOldText(oldValue) : this.setOldValue(oldValue);\n }\n };\n /**\n * Search the entered text and show it in the suggestion list if available.\n *\n * @returns {void}\n\n */\n AutoComplete.prototype.showPopup = function (e) {\n if (!this.enabled) {\n return;\n }\n if (this.beforePopupOpen) {\n this.refreshPopup();\n return;\n }\n this.beforePopupOpen = true;\n this.preventAutoFill = true;\n if (isNullOrUndefined(this.list)) {\n this.renderList(e);\n }\n else {\n this.resetList(this.dataSource, this.fields, null, e);\n }\n };\n /**\n * Hides the popup if it is in open state.\n *\n * @returns {void}\n */\n AutoComplete.prototype.hidePopup = function (e) {\n _super.prototype.hidePopup.call(this, e);\n this.activeIndex = null;\n this.virtualListInfo = this.viewPortInfo;\n this.previousStartIndex = this.viewPortInfo.startIndex;\n this.startIndex = this.viewPortInfo.startIndex;\n this.previousEndIndex = this.viewPortInfo.endIndex;\n };\n /**\n * Dynamically change the value of properties.\n *\n * @param {AutoCompleteModel} newProp - Returns the dynamic property value of the component.\n * @param {AutoCompleteModel} oldProp - Returns the previous property value of the component.\n * @private\n * @returns {void}\n */\n AutoComplete.prototype.onPropertyChanged = function (newProp, oldProp) {\n if (this.getModuleName() === 'autocomplete') {\n this.setUpdateInitial(['fields', 'query', 'dataSource'], newProp);\n }\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'showPopupButton':\n if (this.showPopupButton) {\n var button = Input.appendSpan(dropDownListClasses.icon, this.inputWrapper.container, this.createElement);\n this.inputWrapper.buttons[0] = button;\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n if (this.inputWrapper && this.inputWrapper.buttons && this.inputWrapper.buttons[0]) {\n EventHandler.add(this.inputWrapper.buttons[0], 'click', this.dropDownClick, this);\n }\n }\n else {\n detach(this.inputWrapper.buttons[0]);\n this.inputWrapper.buttons[0] = null;\n }\n break;\n default: {\n // eslint-disable-next-line max-len\n var atcProps = this.getPropObject(prop, newProp, oldProp);\n _super.prototype.onPropertyChanged.call(this, atcProps.newProperty, atcProps.oldProperty);\n break;\n }\n }\n }\n };\n AutoComplete.prototype.renderHightSearch = function () {\n if (this.highlight) {\n for (var i = 0; i < this.liCollections.length; i++) {\n var isHighlight = this.ulElement.querySelector('.e-active');\n if (!isHighlight) {\n revertHighlightSearch(this.liCollections[i]);\n highlightSearch(this.liCollections[i], this.queryString, this.ignoreCase, this.filterType);\n }\n isHighlight = null;\n }\n }\n };\n /**\n * Return the module name of this component.\n *\n * @private\n * @returns {string} Return the module name of this component.\n */\n AutoComplete.prototype.getModuleName = function () {\n return 'autocomplete';\n };\n /**\n * To initialize the control rendering\n *\n * @private\n * @returns {void}\n */\n AutoComplete.prototype.render = function () {\n _super.prototype.render.call(this);\n };\n __decorate([\n Complex({ value: null, iconCss: null, groupBy: null }, FieldSettings)\n ], AutoComplete.prototype, \"fields\", void 0);\n __decorate([\n Property(true)\n ], AutoComplete.prototype, \"ignoreCase\", void 0);\n __decorate([\n Property(false)\n ], AutoComplete.prototype, \"showPopupButton\", void 0);\n __decorate([\n Property(false)\n ], AutoComplete.prototype, \"highlight\", void 0);\n __decorate([\n Property(20)\n ], AutoComplete.prototype, \"suggestionCount\", void 0);\n __decorate([\n Property({})\n ], AutoComplete.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(null)\n ], AutoComplete.prototype, \"query\", void 0);\n __decorate([\n Property(1)\n ], AutoComplete.prototype, \"minLength\", void 0);\n __decorate([\n Property('Contains')\n ], AutoComplete.prototype, \"filterType\", void 0);\n __decorate([\n Event()\n ], AutoComplete.prototype, \"filtering\", void 0);\n __decorate([\n Property(null)\n ], AutoComplete.prototype, \"index\", void 0);\n __decorate([\n Property('Never')\n ], AutoComplete.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property(null)\n ], AutoComplete.prototype, \"valueTemplate\", void 0);\n __decorate([\n Property(null)\n ], AutoComplete.prototype, \"filterBarPlaceholder\", void 0);\n __decorate([\n Property(false)\n ], AutoComplete.prototype, \"allowFiltering\", void 0);\n __decorate([\n Property(null)\n ], AutoComplete.prototype, \"text\", void 0);\n AutoComplete = __decorate([\n NotifyPropertyChanges\n ], AutoComplete);\n return AutoComplete;\n}(ComboBox));\nexport { AutoComplete };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport * as React from 'react';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport { ComponentBase, applyMixins } from '@syncfusion/ej2-react-base';\n/**\n * The DropDownList component contains a list of predefined values, from which the user can choose a single value.\n * ```\n * \n * ```\n */\nvar DropDownListComponent = /** @class */ (function (_super) {\n __extends(DropDownListComponent, _super);\n function DropDownListComponent(props) {\n var _this = _super.call(this, props) || this;\n _this.initRenderCalled = false;\n _this.checkInjectedModules = true;\n _this.statelessTemplateProps = [\"headerTemplate\", \"valueTemplate\", \"itemTemplate\"];\n _this.templateProps = null;\n _this.immediateRender = false;\n _this.portals = [];\n return _this;\n }\n DropDownListComponent.prototype.render = function () {\n if (((this.element && !this.initRenderCalled) || this.refreshing) && !this.isReactForeceUpdate) {\n _super.prototype.render.call(this);\n this.initRenderCalled = true;\n }\n else {\n return React.createElement(React.Fragment, null, [].concat(React.createElement(\"input\", this.getDefaultAttributes()), this.portals));\n }\n };\n return DropDownListComponent;\n}(DropDownList));\nexport { DropDownListComponent };\napplyMixins(DropDownListComponent, [ComponentBase, React.Component]);\n","import { DropDownListComponent } from '@syncfusion/ej2-react-dropdowns'\r\nimport CustomCard from '../../../components/CustomCard.tsx'\r\nimport { TextBoxComponent } from '@syncfusion/ej2-react-inputs'\r\nimport styles from '../../../styles/components/register.module.scss'\r\n\r\nimport { useAppDispatch, useAppSelector } from '../../../hooks/reduxHooks.tsx'\r\n\r\nimport { useFormContext } from 'react-hook-form'\r\nimport { useOidcAccessToken } from '@axa-fr/react-oidc'\r\nimport { useEffect } from 'react'\r\nimport { fetchBesanFromApiData, fetchTitlesFromApiData } from '../../../redux/settingSlice.tsx'\r\nimport { protectedResources } from '../../../global/config.tsx'\r\nimport { Salutations } from '../../../types/settingTypes/Salutation.tsx'\r\nimport { NwTitle } from '../../../types/settingTypes/NwTitle.tsx'\r\n\r\nexport const GeneralData = () => {\r\n const salutationResponse: Salutations[] | null = useAppSelector((state) => state.setting.besanList)\r\n const titlesResponse: NwTitle[] | null = useAppSelector((state) => state.setting.titleList)\r\n\r\n const dispatch = useAppDispatch()\r\n const { accessToken } = useOidcAccessToken()\r\n const {\r\n register,\r\n formState: { errors },\r\n } = useFormContext()\r\n\r\n const requiredMsg = 'Dieses Feld ist ein Pflichtfeld'\r\n\r\n // Hole Titel, Anreden & File Types aus API\r\n useEffect(() => {\r\n const besanUrl = `${protectedResources.apiList.readSalutation}`\r\n const titlesUrl = `${protectedResources.apiList.readTitles}`\r\n\r\n if (accessToken) {\r\n dispatch(fetchBesanFromApiData({ url: besanUrl, token: accessToken }))\r\n dispatch(fetchTitlesFromApiData({ url: titlesUrl, token: accessToken }))\r\n }\r\n }, [accessToken])\r\n\r\n return (\r\n \r\n
    \r\n
    \r\n !x.company)\r\n .filter((x) => x.salutation !== ' ')\r\n .map((x) => x.salutation)\r\n : []\r\n }\r\n {...register('contactSalutation', { required: requiredMsg })}\r\n placeholder=\"Anrede\"\r\n />\r\n

    {(errors.contactSalutation?.message as string) || null}

    \r\n
    \r\n x.title).map((x) => x.title) : []} {...register('contactTitle')} floatLabelType=\"Always\" />\r\n
    \r\n
    \r\n
    \r\n \r\n

    {(errors.contactForename?.message as string) || null}

    \r\n
    \r\n\r\n
    \r\n \r\n

    {(errors.contactSurname?.message as string) || null}

    \r\n
    \r\n
    \r\n     \r\n )\r\n}\r\n","import CustomCard from '../../../components/CustomCard.tsx'\r\nimport { TextBoxComponent } from '@syncfusion/ej2-react-inputs'\r\nimport styles from '../../../styles/components/register.module.scss'\r\nimport { useFormContext } from 'react-hook-form'\r\n\r\nexport const AddressData = () => {\r\n const {\r\n register,\r\n formState: { errors },\r\n } = useFormContext()\r\n\r\n const requiredMsg = 'Dieses Feld ist ein Pflichtfeld'\r\n\r\n return (\r\n \r\n
    \r\n
    \r\n \r\n

    {(errors.adrStreet?.message as string) || null}

    \r\n
    \r\n
    \r\n
    \r\n
    \r\n
    \r\n \r\n

    {(errors.adrCountry?.message as string) || null}

    \r\n
    \r\n
    \r\n \r\n

    {(errors.adrPostCode?.message as string) || null}

    \r\n
    \r\n
    \r\n\r\n
    \r\n \r\n

    {(errors.adrTown?.message as string) || null}

    \r\n
    \r\n
    \r\n     \r\n )\r\n}\r\n","/**\n * @hidden\n\n */\nexport var created = 'create';\n/**\n * @hidden\n\n */\nexport var destroyed = 'destroy';\n/**\n * @hidden\n\n */\nexport var tableclass = 'tableclass';\n/**\n * @hidden\n\n */\nexport var load = 'load';\n/**\n * Specifies Rich Text Editor internal events\n */\n/**\n * @hidden\n\n */\nexport var initialLoad = 'initial-load';\n/**\n * @hidden\n\n */\nexport var contentChanged = 'content-changed';\n/**\n * @hidden\n\n */\nexport var initialEnd = 'initial-end';\n/**\n * @hidden\n\n */\nexport var iframeMouseDown = 'iframe-click';\n/**\n * @hidden\n\n */\nexport var destroy = 'destroy';\n/**\n * @hidden\n\n */\nexport var toolbarClick = 'toolbarClick';\n/**\n * @hidden\n\n */\nexport var toolbarRefresh = 'toolbar-refresh';\n/**\n * @hidden\n\n */\nexport var refreshBegin = 'refresh-begin';\n/**\n * @hidden\n\n */\nexport var toolbarUpdated = 'toolbar-updated';\n/**\n * @hidden\n\n */\nexport var bindOnEnd = 'bind-on-end';\n/**\n * @hidden\n\n */\nexport var renderColorPicker = 'render-color-picker';\n/**\n * @hidden\n\n */\nexport var htmlToolbarClick = 'html-toolbar-click';\n/**\n * @hidden\n\n */\nexport var markdownToolbarClick = 'markdown-toolbar-click';\n/**\n * @hidden\n\n */\nexport var destroyColorPicker = 'destroy-color-picker';\n/**\n * @hidden\n\n */\nexport var modelChanged = 'model-changed';\n/**\n * @hidden\n\n */\nexport var tableModulekeyUp = 'tableModulekeyUp';\n/**\n * @hidden\n\n */\nexport var keyUp = 'keyUp';\n/**\n * @hidden\n\n */\nexport var keyDown = 'keyDown';\n/**\n * @hidden\n\n */\nexport var mouseUp = 'mouseUp';\n/**\n * @hidden\n\n */\nexport var toolbarCreated = 'toolbarCreated';\n/**\n * @hidden\n\n */\nexport var toolbarRenderComplete = 'toolbarRenderComplete';\n/**\n * @hidden\n\n */\nexport var enableFullScreen = 'enableFullScreen';\n/**\n * @hidden\n\n */\nexport var disableFullScreen = 'disableFullScreen';\n/**\n * @hidden\n\n */\nexport var dropDownSelect = 'dropDownSelect';\n/**\n * @hidden\n\n */\nexport var beforeDropDownItemRender = 'beforeDropDownItemRender';\n/**\n * @hidden\n\n */\nexport var execCommandCallBack = 'execCommandCallBack';\n/**\n * @hidden\n\n */\nexport var imageToolbarAction = 'image-toolbar-action';\n/**\n * @hidden\n\n */\nexport var audioToolbarAction = 'audio-toolbar-action';\n/**\n * @hidden\n\n */\nexport var videoToolbarAction = 'video-toolbar-action';\n/**\n * @hidden\n\n */\nexport var linkToolbarAction = 'link-toolbar-action';\n/**\n * @hidden\n\n */\nexport var windowResize = 'resize';\n/**\n * @hidden\n\n */\nexport var resizeStart = 'resizeStart';\n/**\n * @hidden\n\n */\nexport var onResize = 'resizing';\n/**\n * @hidden\n\n */\nexport var resizeStop = 'resizeStop';\n/**\n * @hidden\n\n */\nexport var undo = 'undo';\n/**\n * @hidden\n\n */\nexport var redo = 'redo';\n/**\n * @hidden\n\n */\nexport var insertLink = 'insertLink';\n/**\n * @hidden\n\n */\nexport var unLink = 'unLink';\n/**\n * @hidden\n\n */\nexport var editLink = 'editLink';\n/**\n * @hidden\n\n */\nexport var openLink = 'openLink';\n/**\n * @hidden\n\n */\nexport var actionBegin = 'actionBegin';\n/**\n * @hidden\n\n */\nexport var actionComplete = 'actionComplete';\n/**\n * @hidden\n\n */\nexport var updatedToolbarStatus = 'updatedToolbarStatus';\n/**\n * @hidden\n\n */\nexport var actionSuccess = 'actionSuccess';\n/**\n * @hidden\n\n */\nexport var updateToolbarItem = 'updateToolbarItem';\n/**\n * @hidden\n\n */\nexport var insertImage = 'insertImage';\n/**\n * @hidden\n\n */\nexport var insertAudio = 'insertAudio';\n/**\n * @hidden\n\n */\nexport var insertVideo = 'insertVideo';\n/**\n * @hidden\n\n */\nexport var insertCompleted = 'insertCompleted';\n/**\n * @hidden\n\n */\nexport var imageLeft = 'justifyLeft';\n/**\n * @hidden\n\n */\nexport var imageRight = 'justifyRight';\n/**\n * @hidden\n\n */\nexport var imageCenter = 'justifyCenter';\n/**\n * @hidden\n\n */\nexport var imageBreak = 'break';\n/**\n * @hidden\n\n */\nexport var imageInline = 'inline';\n/**\n * @hidden\n\n */\nexport var imageLink = 'insertImgLink';\n/**\n * @hidden\n\n */\nexport var imageAlt = 'imgAltText';\n/**\n * @hidden\n\n */\nexport var imageDelete = 'delete';\n/**\n * @hidden\n\n */\nexport var audioDelete = 'delete';\n/**\n * @hidden\n\n */\nexport var videoDelete = 'delete';\n/**\n * @hidden\n\n */\nexport var imageCaption = 'caption';\n/**\n * @hidden\n\n */\nexport var imageSize = 'imageSize';\n/**\n * @hidden\n\n */\nexport var videoSize = 'videoSize';\n/**\n * @hidden\n\n */\nexport var sourceCode = 'sourceCode';\n/**\n * @hidden\n\n */\nexport var updateSource = 'updateSource';\n/**\n * @hidden\n\n */\nexport var toolbarOpen = 'toolbarOpen';\n/**\n * @hidden\n\n */\nexport var beforeDropDownOpen = 'beforeDropDownOpen';\n/**\n * @hidden\n\n */\nexport var selectionSave = 'selection-save';\n/**\n * @hidden\n\n */\nexport var selectionRestore = 'selection-restore';\n/**\n * @hidden\n\n */\nexport var expandPopupClick = 'expandPopupClick';\n/**\n * @hidden\n\n */\nexport var count = 'count';\n/**\n * @hidden\n\n */\nexport var contentFocus = 'contentFocus';\n/**\n * @hidden\n\n */\nexport var contentBlur = 'contentBlur';\n/**\n * @hidden\n\n */\nexport var mouseDown = 'mouseDown';\n/**\n * @hidden\n\n */\nexport var sourceCodeMouseDown = 'sourceCodeMouseDown';\n/**\n * @hidden\n\n */\nexport var editAreaClick = 'editAreaClick';\n/**\n * @hidden\n\n */\nexport var scroll = 'scroll';\n/**\n * @hidden\n\n */\nexport var contentscroll = 'contentscroll';\n/**\n * @hidden\n\n */\nexport var colorPickerChanged = 'colorPickerChanged';\n/**\n * @hidden\n\n */\nexport var tableColorPickerChanged = 'tableColorPickerChanged';\n/**\n * @hidden\n\n */\nexport var focusChange = 'focusChange';\n/**\n * @hidden\n\n */\nexport var selectAll = 'selectAll';\n/**\n * @hidden\n\n */\nexport var selectRange = 'selectRange';\n/**\n * @hidden\n\n */\nexport var getSelectedHtml = 'getSelectedHtml';\n/**\n * @hidden\n\n */\nexport var renderInlineToolbar = 'renderInlineToolbar';\n/**\n * @hidden\n\n */\nexport var paste = 'paste-content';\n/**\n * @hidden\n\n */\nexport var imgModule = 'imageModule';\n/**\n * @hidden\n\n */\nexport var rtlMode = 'rtl-mode';\n/**\n * @hidden\n\n */\nexport var createTable = 'createTable';\n/**\n * @hidden\n\n */\nexport var docClick = 'docClick';\n/**\n * @hidden\n\n */\nexport var tableToolbarAction = 'table-toolbar-action';\n/**\n * @hidden\n\n */\nexport var checkUndo = 'checkUndoStack';\n/**\n * @hidden\n\n */\nexport var readOnlyMode = 'readOnlyMode';\n/**\n * @hidden\n\n */\nexport var moduleDestroy = 'moduleDestroy';\n/**\n * @hidden\n\n */\nexport var pasteClean = 'pasteClean';\n/**\n * @hidden\n\n */\nexport var enterHandler = 'enterHandler';\n/**\n * @hidden\n\n */\nexport var beforeDialogOpen = 'beforeDialogOpen';\n/**\n * @hidden\n\n */\nexport var clearDialogObj = 'clearDialogObj';\n/**\n * @hidden\n\n */\nexport var dialogOpen = 'dialogOpen';\n/**\n * @hidden\n\n */\nexport var beforeDialogClose = 'beforeDialogClose';\n/**\n * @hidden\n\n */\nexport var dialogClose = 'dialogClose';\n/**\n * @hidden\n\n */\nexport var beforeQuickToolbarOpen = 'beforeQuickToolbarOpen';\n/**\n * @hidden\n\n */\nexport var quickToolbarOpen = 'quickToolbarOpen';\n/**\n * @hidden\n\n */\nexport var quickToolbarClose = 'quickToolbarClose';\n/**\n * @hidden\n\n */\nexport var popupHide = 'popupHide';\n/**\n * @hidden\n\n */\nexport var imageSelected = 'imageSelected';\n/**\n * @hidden\n\n */\nexport var imageUploading = 'imageUploading';\n/**\n * @hidden\n\n */\nexport var imageUploadSuccess = 'imageUploadSuccess';\n/**\n * @hidden\n\n */\nexport var imageUploadFailed = 'imageUploadFailed';\n/**\n * @hidden\n\n */\nexport var imageRemoving = 'imageRemoving';\n/**\n * @hidden\n\n */\nexport var fileSelected = 'fileSelected';\n/**\n * @hidden\n\n */\nexport var fileUploading = 'fileUploading';\n/**\n * @hidden\n\n */\nexport var fileUploadSuccess = 'fileUploadSuccess';\n/**\n * @hidden\n\n */\nexport var fileUploadFailed = 'fileUploadFailed';\n/**\n * @hidden\n\n */\nexport var fileRemoving = 'fileRemoving';\n/**\n * @hidden\n\n */\nexport var afterImageDelete = 'afterImageDelete';\n/**\n * @hidden\n\n */\nexport var afterMediaDelete = 'afterMediaDelete';\n/**\n * @hidden\n\n */\nexport var drop = 'drop';\n/**\n * @hidden\n\n */\nexport var xhtmlValidation = 'xhtmlValidation';\n/**\n * @hidden\n\n */\nexport var beforeImageUpload = 'beforeImageUpload';\n/**\n * @hidden\n\n */\nexport var beforeFileUpload = 'beforeFileUpload';\n/**\n * @hidden\n\n */\nexport var resizeInitialized = 'resizeInitialized';\n/**\n * @hidden\n\n */\nexport var renderFileManager = 'renderFileManager';\n/**\n * @hidden\n\n */\nexport var beforeImageDrop = 'beforeImageDrop';\n/**\n * @hidden\n\n */\nexport var dynamicModule = 'dynamicModule';\n/**\n * @hidden\n\n */\nexport var beforePasteCleanup = 'beforePasteCleanup';\n/**\n * @hidden\n\n */\nexport var afterPasteCleanup = 'afterPasteCleanup';\n/**\n * @hidden\n\n */\nexport var updateTbItemsStatus = 'updateTbItemsStatus';\n/**\n * @hidden\n\n */\nexport var showLinkDialog = 'showLinkDialog';\n/**\n * @hidden\n\n */\nexport var closeLinkDialog = 'closeLinkDialog';\n/**\n * @hidden\n\n */\nexport var showImageDialog = 'showImageDialog';\n/**\n * @hidden\n\n */\nexport var showAudioDialog = 'showAudioDialog';\n/**\n * @hidden\n\n */\nexport var showVideoDialog = 'showVideoDialog';\n/**\n * @hidden\n\n */\nexport var closeImageDialog = 'closeImageDialog';\n/**\n * @hidden\n\n */\nexport var closeAudioDialog = 'closeAudioDialog';\n/**\n * @hidden\n\n */\nexport var closeVideoDialog = 'closeVideoDialog';\n/**\n * @hidden\n\n */\nexport var showTableDialog = 'showTableDialog';\n/**\n * @hidden\n\n */\nexport var closeTableDialog = 'closeTableDialog';\n/**\n * @hidden\n\n */\nexport var bindCssClass = 'closeTableDialog';\n/**\n * @hidden\n\n */\nexport var formatPainterClick = 'formatPainterClick';\n/**\n * @hidden\n\n */\nexport var formatPainterDoubleClick = 'formatPainterDoubleClick';\n/**\n * @hidden\n\n */\nexport var emojiPicker = 'emojiPicker';\n/**\n * @hidden\n\n */\nexport var destroyTooltip = 'destroyTooltip';\n/**\n * @hidden\n\n */\nexport var hidePopup = 'hidePopup';\n/**\n * @hidden\n\n */\nexport var cleanupResizeElements = 'cleanupResizeElements';\n/**\n * @hidden\n\n */\nexport var afterKeyDown = 'afterKeyDown';\n/**\n * @hidden\n\n */\nexport var updateValueOnIdle = 'updateValueOnIdle';\n/**\n * @hidden\n\n */\nexport var documentClickClosedBy = 'documentClickClosedBy';\n/**\n * @hidden\n\n */\nexport var showColorPicker = 'showColorPicker';\n/**\n * @hidden\n\n */\nexport var closeTooltip = 'closeTooltip';\n/**\n * @hidden\n\n */\nexport var blockEmptyNodes = \"address:empty, article:empty, aside:empty, blockquote:empty,\\n details:empty, dd:empty, div:empty, dl:empty, dt:empty, fieldset:empty, footer:empty,form:empty, h1:empty,\\n h2:empty, h3:empty, h4:empty, h5:empty, h6:empty, header:empty, hgroup:empty, li:empty, main:empty, nav:empty,\\n noscript:empty, output:empty, p:empty, pre:empty, section:empty, td:empty, th:empty\";\n/**\n * @hidden\n\n */\nexport var inlineEmptyNodes = \"a:empty, abbr:empty, acronym:empty, b:empty, bdi:empty, bdo:empty, big:empty, button:empty,\\ncanvas:empty, cite:empty, code:empty, data:empty, datalist:empty, del:empty, dfn:empty, em:empty, font:empty, i:empty, iframe:empty,\\nins:empty, kbd:empty, label:empty, map:empty, mark:empty, meter:empty, noscript:empty, object:empty, output:empty, picture:empty, progress:empty,\\nq:empty, ruby:empty, s:empty, samp:empty, script:empty, select:empty, slot:empty, small:empty, span:empty, strong:empty, strike:empty, sub:empty, sup:empty, svg:empty,\\ntemplate:empty, textarea:empty, time:empty, u:empty, tt:empty, var:empty, wbr:empty\";\n/**\n * @hidden\n\n */\nexport var supportedUnits = ['px', 'em', 'rem', 'pt', 'cm', 'mm', 'in', 'pc', 'vw', 'vh', 'vmin', 'vmax'];\n/**\n * @hidden\n\n */\nexport var conversionFactors = {\n 'px': {\n 'px': 1,\n 'em': 0.0625,\n 'rem': 0.0625,\n 'pt': 0.75,\n 'cm': 0.0264583,\n 'mm': 0.0026458,\n 'in': 0.0104167,\n 'pc': 0.0625,\n 'vw': 0.00625,\n 'vh': 0.00625,\n 'vmin': 0.00625,\n 'vmax': 0.00625\n },\n 'em': {\n 'px': 16,\n 'em': 1,\n 'rem': 1,\n 'pt': 12,\n 'cm': 0.423333,\n 'mm': 0.0423333,\n 'in': 0.166667,\n 'pc': 0.0625,\n 'vw': 1,\n 'vh': 1,\n 'vmin': 1,\n 'vmax': 1\n },\n 'rem': {\n 'px': 16,\n 'em': 1,\n 'rem': 1,\n 'pt': 12,\n 'cm': 0.423333,\n 'mm': 0.0423333,\n 'in': 0.166667,\n 'pc': 0.0625,\n 'vw': 1,\n 'vh': 1,\n 'vmin': 1,\n 'vmax': 1\n },\n 'pt': {\n 'px': 1.33333,\n 'em': 0.0833333,\n 'rem': 0.0833333,\n 'pt': 1,\n 'cm': 0.0352778,\n 'mm': 0.0035278,\n 'in': 0.0138889,\n 'pc': 0.0416667,\n 'vw': 0.00416667,\n 'vh': 0.00416667,\n 'vmin': 0.00416667,\n 'vmax': 0.00416667\n },\n 'cm': {\n 'px': 37.7953,\n 'em': 2.3622,\n 'rem': 2.3622,\n 'pt': 28.3465,\n 'cm': 1,\n 'mm': 0.1,\n 'in': 0.393701,\n 'pc': 0.148148,\n 'vw': 0.0377953,\n 'vh': 0.0377953,\n 'vmin': 0.0377953,\n 'vmax': 0.0377953\n },\n 'mm': {\n 'px': 3.77953,\n 'em': 0.23622,\n 'rem': 0.23622,\n 'pt': 2.83465,\n 'cm': 10,\n 'mm': 1,\n 'in': 0.0393701,\n 'pc': 0.0148148,\n 'vw': 0.00377953,\n 'vh': 0.00377953,\n 'vmin': 0.00377953,\n 'vmax': 0.00377953\n },\n 'in': {\n 'px': 96,\n 'em': 6,\n 'rem': 6,\n 'pt': 72,\n 'cm': 2.54,\n 'mm': 25.4,\n 'in': 1,\n 'pc': 0.375,\n 'vw': 0.09375,\n 'vh': 0.09375,\n 'vmin': 0.09375,\n 'vmax': 0.09375\n },\n 'pc': {\n 'px': 16,\n 'em': 1,\n 'rem': 1,\n 'pt': 12,\n 'cm': 0.423333,\n 'mm': 0.0423333,\n 'in': 0.166667,\n 'pc': 1,\n 'vw': 0.0625,\n 'vh': 0.0625,\n 'vmin': 0.0625,\n 'vmax': 0.0625\n },\n 'vw': {\n 'px': 160,\n 'em': 10,\n 'rem': 10,\n 'pt': 120,\n 'cm': 4.23333,\n 'mm': 0.423333,\n 'in': 1.66667,\n 'pc': 0.625,\n 'vw': 1,\n 'vh': 1,\n 'vmin': 1,\n 'vmax': 1\n },\n 'vh': {\n 'px': 160,\n 'em': 10,\n 'rem': 10,\n 'pt': 120,\n 'cm': 4.23333,\n 'mm': 0.423333,\n 'in': 1.66667,\n 'pc': 0.625,\n 'vw': 1,\n 'vh': 1,\n 'vmin': 1,\n 'vmax': 1\n },\n 'vmin': {\n 'px': 160,\n 'em': 10,\n 'rem': 10,\n 'pt': 120,\n 'cm': 4.23333,\n 'mm': 0.423333,\n 'in': 1.66667,\n 'pc': 0.625,\n 'vw': 1,\n 'vh': 1,\n 'vmin': 1,\n 'vmax': 1\n },\n 'vmax': {\n 'px': 160,\n 'em': 10,\n 'rem': 10,\n 'pt': 120,\n 'cm': 4.23333,\n 'mm': 0.423333,\n 'in': 1.66667,\n 'pc': 0.625,\n 'vw': 1,\n 'vh': 1,\n 'vmin': 1,\n 'vmax': 1\n }\n};\n/**\n * @hidden\n\n */\nexport var onHandleFontsizeChange = 'onHandleFontsizeChange';\n","/**\n * Rich Text Editor classes defined here.\n */\n/**\n * @hidden\n\n */\nexport var CLS_RTE = 'e-richtexteditor';\n/**\n * @hidden\n\n */\nexport var CLS_RTL = 'e-rtl';\n/**\n * @hidden\n\n */\nexport var CLS_CONTENT = 'e-content';\n/**\n * @hidden\n\n */\nexport var CLS_DISABLED = 'e-disabled';\n/**\n * @hidden\n\n */\nexport var CLS_SCRIPT_SHEET = 'rte-iframe-script-sheet';\n/**\n * @hidden\n\n */\nexport var CLS_STYLE_SHEET = 'rte-iframe-style-sheet';\n/**\n * @hidden\n\n */\nexport var CLS_TOOLBAR = 'e-rte-toolbar';\n/**\n * @hidden\n\n */\nexport var CLS_TB_FIXED = 'e-rte-tb-fixed';\n/**\n * @hidden\n\n */\nexport var CLS_TB_FLOAT = 'e-rte-tb-float';\n/**\n * @hidden\n\n */\nexport var CLS_INLINE = 'e-rte-inline';\n/**\n * @hidden\n\n */\nexport var CLS_TB_INLINE = 'e-rte-tb-inline';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_EXPAND_TB = 'e-rte-tb-expand';\n/**\n * @hidden\n\n */\nexport var CLS_FULL_SCREEN = 'e-rte-full-screen';\n/**\n * @hidden\n\n */\nexport var CLS_QUICK_TB = 'e-rte-quick-toolbar';\n/**\n * @hidden\n\n */\nexport var CLS_TEXT_QUICK_TB = 'e-rte-text-quicktoolbar';\n/**\n * @hidden\n\n */\nexport var CLS_POP = 'e-rte-pop';\n/**\n * @hidden\n\n */\nexport var CLS_TB_STATIC = 'e-tb-static';\n/**\n * @hidden\n\n */\nexport var CLS_QUICK_POP = 'e-rte-quick-popup';\n/**\n * @hidden\n\n */\nexport var CLS_QUICK_DROPDOWN = 'e-quick-dropdown';\n/**\n * @hidden\n\n */\nexport var CLS_IMAGE_POP = 'e-rte-image-popup';\n/**\n * @hidden\n\n */\nexport var CLS_TEXT_POP = 'e-rte-text-popup';\n/**\n * @hidden\n\n */\nexport var CLS_INLINE_POP = 'e-rte-inline-popup';\n/**\n * @hidden\n\n */\nexport var CLS_INLINE_DROPDOWN = 'e-rte-inline-dropdown';\n/**\n * @hidden\n\n */\nexport var CLS_DROPDOWN_POPUP = 'e-rte-dropdown-popup';\n/**\n * @hidden\n\n */\nexport var CLS_DROPDOWN_ICONS = 'e-rte-dropdown-icons';\n/**\n * @hidden\n\n */\nexport var CLS_DROPDOWN_ITEMS = 'e-rte-dropdown-items';\n/**\n * @hidden\n\n */\nexport var CLS_DROPDOWN_BTN = 'e-rte-dropdown-btn';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_CONTENT = 'e-rte-content';\n/**\n * @hidden\n\n */\nexport var CLS_TB_ITEM = 'e-toolbar-item';\n/**\n * @hidden\n\n */\nexport var CLS_TB_EXTENDED = 'e-toolbar-extended';\n/**\n * @hidden\n\n */\nexport var CLS_TB_WRAP = 'e-toolbar-wrapper';\n/**\n * @hidden\n\n */\nexport var CLS_POPUP = 'e-popup';\n/**\n * @hidden\n\n */\nexport var CLS_SEPARATOR = 'e-separator';\n/**\n * @hidden\n\n */\nexport var CLS_MINIMIZE = 'e-minimize';\n/**\n * @hidden\n\n */\nexport var CLS_MAXIMIZE = 'e-maximize';\n/**\n * @hidden\n\n */\nexport var CLS_BACK = 'e-back';\n/**\n * @hidden\n\n */\nexport var CLS_SHOW = 'e-show';\n/**\n * @hidden\n\n */\nexport var CLS_HIDE = 'e-hide';\n/**\n * @hidden\n\n */\nexport var CLS_VISIBLE = 'e-visible';\n/**\n * @hidden\n\n */\nexport var CLS_FOCUS = 'e-focused';\n/**\n * @hidden\n\n */\nexport var CLS_RM_WHITE_SPACE = 'e-remove-white-space';\n/**\n * @hidden\n\n */\nexport var CLS_IMGRIGHT = 'e-imgright';\n/**\n * @hidden\n\n */\nexport var CLS_IMGLEFT = 'e-imgleft';\n/**\n * @hidden\n\n */\nexport var CLS_IMGCENTER = 'e-imgcenter';\n/**\n * @hidden\n\n */\nexport var CLS_IMGBREAK = 'e-imgbreak';\n/**\n * @hidden\n\n */\nexport var CLS_AUDIOBREAK = 'e-audio-break';\n/**\n * @hidden\n\n */\nexport var CLS_CLICKELEM = 'e-clickelem';\n/**\n * @hidden\n\n */\nexport var CLS_VID_CLICK_ELEM = 'e-video-clickelem';\n/**\n * @hidden\n\n */\nexport var CLS_AUDIOWRAP = 'e-audio-wrap';\n/**\n * @hidden\n\n */\nexport var CLS_VIDEOWRAP = 'e-video-wrap';\n/**\n * @hidden\n\n */\nexport var CLS_VIDEOBREAK = 'e-video-break';\n/**\n * @hidden\n\n */\nexport var CLS_CAPTION = 'e-img-caption';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_CAPTION = 'e-rte-img-caption';\n/**\n * @hidden\n\n */\nexport var CLS_CAPINLINE = 'e-caption-inline';\n/**\n * @hidden\n\n */\nexport var CLS_IMGINLINE = 'e-imginline';\n/**\n * @hidden\n\n */\nexport var CLS_AUDIOINLINE = 'e-audio-inline';\n/**\n * @hidden\n\n */\nexport var CLS_VIDEOINLINE = 'e-video-inline';\n/**\n * @hidden\n\n */\nexport var CLS_COUNT = 'e-rte-character-count';\n/**\n * @hidden\n\n */\nexport var CLS_WARNING = 'e-warning';\n/**\n * @hidden\n\n */\nexport var CLS_ERROR = 'e-error';\n/**\n * @hidden\n\n */\nexport var CLS_ICONS = 'e-icons';\n/**\n * @hidden\n\n */\nexport var CLS_ACTIVE = 'e-active';\n/**\n * @hidden\n\n */\nexport var CLS_EXPAND_OPEN = 'e-expand-open';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_ELEMENTS = 'e-rte-elements';\n/**\n * @hidden\n\n */\nexport var CLS_TB_BTN = 'e-tbar-btn';\n/**\n * @hidden\n\n */\nexport var CLS_HR_SEPARATOR = 'e-rte-horizontal-separator';\n/**\n * @hidden\n\n */\nexport var CLS_TB_IOS_FIX = 'e-tbar-ios-fixed';\n/**\n * @hidden\n\n */\nexport var CLS_LIST_PRIMARY_CONTENT = 'e-rte-list-primary-content';\n/**\n * @hidden\n\n */\nexport var CLS_NUMBERFORMATLIST_TB_BTN = 'e-rte-numberformatlist-dropdown';\n/**\n * @hidden\n\n */\nexport var CLS_BULLETFORMATLIST_TB_BTN = 'e-rte-bulletformatlist-dropdown';\n/**\n * @hidden\n\n */\nexport var CLS_FORMATS_TB_BTN = 'e-formats-tbar-btn';\n/**\n * @hidden\n\n */\nexport var CLS_FONT_NAME_TB_BTN = 'e-font-name-tbar-btn';\n/**\n * @hidden\n\n */\nexport var CLS_FONT_SIZE_TB_BTN = 'e-font-size-tbar-btn';\n/**\n * @hidden\n\n */\nexport var CLS_ALIGN_TB_BTN = 'e-alignment-tbar-btn';\n/**\n * @hidden\n\n */\nexport var CLS_FONT_COLOR_TARGET = 'e-rte-fontcolor-element';\n/**\n * @hidden\n\n */\nexport var CLS_BACKGROUND_COLOR_TARGET = 'e-rte-backgroundcolor-element';\n/**\n * @hidden\n\n */\nexport var CLS_COLOR_CONTENT = 'e-rte-color-content';\n/**\n * @hidden\n\n */\nexport var CLS_FONT_COLOR_DROPDOWN = 'e-rte-fontcolor-dropdown';\n/**\n * @hidden\n\n */\nexport var CLS_BACKGROUND_COLOR_DROPDOWN = 'e-rte-backgroundcolor-dropdown';\n/**\n * @hidden\n\n */\nexport var CLS_COLOR_PALETTE = 'e-rte-square-palette';\n/**\n * @hidden\n\n */\nexport var CLS_FONT_COLOR_PICKER = 'e-rte-fontcolor-colorpicker';\n/**\n * @hidden\n\n */\nexport var CLS_BACKGROUND_COLOR_PICKER = 'e-rte-backgroundcolor-colorpicker';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_READONLY = 'e-rte-readonly';\n/**\n * @hidden\n\n */\nexport var CLS_TABLE_SEL = 'e-cell-select';\n/**\n * @hidden\n\n */\nexport var CLS_TB_DASH_BOR = 'e-dashed-border';\n/**\n * @hidden\n\n */\nexport var CLS_TB_ALT_BOR = 'e-alternate-border';\n/**\n * @hidden\n\n */\nexport var CLS_TB_COL_RES = 'e-column-resize';\n/**\n * @hidden\n\n */\nexport var CLS_TB_ROW_RES = 'e-row-resize';\n/**\n * @hidden\n\n */\nexport var CLS_TB_BOX_RES = 'e-table-box';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_HIDDEN = 'e-rte-hidden';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_PASTE_KEEP_FORMAT = 'e-rte-keepformat';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_PASTE_REMOVE_FORMAT = 'e-rte-removeformat';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_PASTE_PLAIN_FORMAT = 'e-rte-plainformat';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_PASTE_OK = 'e-rte-pasteok';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_PASTE_CANCEL = 'e-rte-pastecancel';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_DIALOG_MIN_HEIGHT = 'e-rte-dialog-minheight';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_RES_HANDLE = 'e-resize-handle';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_RES_EAST = 'e-south-east';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_IMAGE = 'e-rte-image';\n/**\n * @hidden\n\n */\nexport var CLS_RESIZE = 'e-resize';\n/**\n * @hidden\n\n */\nexport var CLS_IMG_FOCUS = 'e-img-focus';\n/**\n * @hidden\n\n */\nexport var CLS_AUD_FOCUS = 'e-audio-focus';\n/**\n * @hidden\n\n */\nexport var CLS_VID_FOCUS = 'e-video-focus';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_DRAG_IMAGE = 'e-rte-drag-image';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_UPLOAD_POPUP = 'e-rte-upload-popup';\n/**\n * @hidden\n\n */\nexport var CLS_POPUP_OPEN = 'e-popup-open';\n/**\n * @hidden\n\n */\nexport var CLS_IMG_RESIZE = 'e-img-resize';\n/**\n * @hidden\n\n */\nexport var CLS_DROPAREA = 'e-droparea';\n/**\n * @hidden\n\n */\nexport var CLS_IMG_INNER = 'e-img-inner';\n/**\n * @hidden\n\n */\nexport var CLS_UPLOAD_FILES = 'e-upload-files';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_DIALOG_UPLOAD = 'e-rte-dialog-upload';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_RES_CNT = 'e-rte-resize';\n/**\n * @hidden\n\n */\nexport var CLS_CUSTOM_TILE = 'e-custom-tile';\n/**\n * @hidden\n\n */\nexport var CLS_NOCOLOR_ITEM = 'e-nocolor-item';\n/**\n * @hidden\n\n */\nexport var CLS_TABLE = 'e-rte-table';\n/**\n * @hidden\n\n */\nexport var CLS_TABLE_BORDER = 'e-rte-table-border';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_TABLE_RESIZE = 'e-rte-table-resize';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_FIXED_TB_EXPAND = 'e-rte-fixed-tb-expand';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_TB_ENABLED = 'e-rte-toolbar-enabled';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_RES_WEST = 'e-south-west';\n/**\n * @hidden\n\n */\nexport var CLS_RTE_SOURCE_CODE_TXTAREA = 'e-rte-srctextarea';\n","/**\n * Defines types of Render\n *\n * @hidden\n\n */\nexport var RenderType;\n(function (RenderType) {\n /* eslint-disable */\n /** Defines RenderType as Toolbar */\n RenderType[RenderType[\"Toolbar\"] = 0] = \"Toolbar\";\n /** Defines RenderType as Content */\n RenderType[RenderType[\"Content\"] = 1] = \"Content\";\n /** Defines RenderType as Popup */\n RenderType[RenderType[\"Popup\"] = 2] = \"Popup\";\n /** Defines RenderType as LinkToolbar */\n RenderType[RenderType[\"LinkToolbar\"] = 3] = \"LinkToolbar\";\n /** Defines RenderType as TextToolbar */\n RenderType[RenderType[\"TextToolbar\"] = 4] = \"TextToolbar\";\n /** Defines RenderType as ImageToolbar */\n RenderType[RenderType[\"ImageToolbar\"] = 5] = \"ImageToolbar\";\n /** Defines RenderType as AudioToolbar */\n RenderType[RenderType[\"AudioToolbar\"] = 6] = \"AudioToolbar\";\n /** Defines RenderType as AudioToolbar */\n RenderType[RenderType[\"VideoToolbar\"] = 7] = \"VideoToolbar\";\n /** Defines RenderType as InlineToolbar */\n RenderType[RenderType[\"InlineToolbar\"] = 8] = \"InlineToolbar\";\n /** Defines RenderType as TableToolbar */\n RenderType[RenderType[\"TableToolbar\"] = 9] = \"TableToolbar\";\n /* eslint-enable */\n})(RenderType || (RenderType = {}));\n/**\n * Defines types to be used as Toolbar.\n */\nexport var ToolbarType;\n(function (ToolbarType) {\n /* eslint-disable */\n /** Defines ToolbarType as Standard */\n ToolbarType[\"Expand\"] = \"Expand\";\n /** Defines ToolbarType as MultiRow */\n ToolbarType[\"MultiRow\"] = \"MultiRow\";\n /** Defines ToolbarType as Scrollable */\n ToolbarType[\"Scrollable\"] = \"Scrollable\";\n /* eslint-enable */\n})(ToolbarType || (ToolbarType = {}));\n/**\n * Defines the type of dialog, which open or close in the Rich Text Editor.\n */\nexport var DialogType;\n(function (DialogType) {\n /* eslint-disable */\n /** Defines ToolbarType as Standard */\n DialogType[\"InsertLink\"] = \"InsertLink\";\n /** Defines ToolbarType as MultiRow */\n DialogType[\"InsertImage\"] = \"InsertImage\";\n /** Defines DialogType as Audio*/\n DialogType[\"InsertAudio\"] = \"InsertAudio\";\n /** Defines DialogType as Video*/\n DialogType[\"InsertVideo\"] = \"InsertVideo\";\n /** Defines ToolbarType as Scrollable */\n DialogType[\"InsertTable\"] = \"InsertTable\";\n /* eslint-enable */\n})(DialogType || (DialogType = {}));\n/**\n * Defines types to be used as inserted image.\n */\nexport var ImageInputSource;\n(function (ImageInputSource) {\n /** Defines ImageInputSource as Uploaded */\n ImageInputSource[\"Uploaded\"] = \"Uploaded\";\n /** Defines ImageInputSource as Dropped */\n ImageInputSource[\"Dropped\"] = \"Dropped\";\n /** Defines ImageInputSource as Pasted */\n ImageInputSource[\"Pasted\"] = \"Pasted\";\n})(ImageInputSource || (ImageInputSource = {}));\n","/* eslint-disable */\n/**\n * Export items model\n */\nexport var templateItems = ['alignments', 'formats', 'fontname', 'fontsize', 'fontcolor', 'backgroundcolor', 'align', 'display', 'audiolayoutoption', 'videolayoutoption', 'videoalign', 'tablerows', 'tablecolumns', 'tablecell', 'tablecellhorizontalalign', 'tablecellverticalalign', 'styles', 'numberformatlist', 'bulletformatlist'];\nexport var tools = {\n 'alignments': {\n 'id': 'Alignments',\n 'icon': 'e-alignments',\n 'tooltip': 'Alignments',\n 'command': 'Alignments',\n 'subCommand': 'Alignments'\n },\n 'justifyleft': {\n 'id': 'JustifyLeft',\n 'icon': 'e-justify-left',\n 'tooltip': 'JustifyLeft',\n 'command': 'Alignments',\n 'subCommand': 'JustifyLeft'\n },\n 'justifycenter': {\n 'id': 'JustifyCenter',\n 'icon': 'e-justify-center',\n 'tooltip': 'JustifyCenter',\n 'command': 'Alignments',\n 'subCommand': 'JustifyCenter'\n },\n 'justifyright': {\n 'id': 'JustifyRight',\n 'icon': 'e-justify-right',\n 'tooltip': 'JustifyRight',\n 'command': 'Alignments',\n 'subCommand': 'JustifyRight'\n },\n 'justifyfull': {\n 'id': 'JustifyFull',\n 'icon': 'e-justify-full',\n 'tooltip': 'JustifyFull',\n 'command': 'Alignments',\n 'subCommand': 'JustifyFull'\n },\n 'fontname': {\n 'id': 'FontName',\n 'icon': 'e-font-name',\n 'tooltip': 'Font Name',\n 'command': 'Font',\n 'subCommand': 'FontName'\n },\n 'fontsize': {\n 'id': 'FontSize',\n 'icon': 'e-font-size',\n 'tooltip': 'Font Size',\n 'command': 'Font',\n 'subCommand': 'FontSize'\n },\n 'fontcolor': {\n 'id': 'FontColor',\n 'icon': 'e-rte-font-color',\n 'tooltip': 'Font Color',\n 'command': 'Font',\n 'subCommand': 'FontColor',\n 'value': '#ff0000ff'\n },\n 'backgroundcolor': {\n 'id': 'BackgroundColor',\n 'icon': 'e-background-color',\n 'tooltip': 'Background Color',\n 'command': 'Font',\n 'subCommand': 'BackgroundColor',\n 'value': '#ffff00ff'\n },\n 'bold': {\n 'id': 'Bold',\n 'icon': 'e-bold',\n 'tooltip': 'Bold',\n 'command': 'Style',\n 'subCommand': 'Bold'\n },\n 'italic': {\n 'id': 'Italic',\n 'icon': 'e-italic',\n 'tooltip': 'Italic',\n 'command': 'Style',\n 'subCommand': 'Italic'\n },\n 'underline': {\n 'id': 'Underline',\n 'icon': 'e-underline',\n 'tooltip': 'Underline',\n 'command': 'Style',\n 'subCommand': 'Underline'\n },\n 'strikethrough': {\n 'id': 'StrikeThrough',\n 'icon': 'e-strike-through',\n 'tooltip': 'StrikeThrough',\n 'command': 'Style',\n 'subCommand': 'StrikeThrough'\n },\n 'clearformat': {\n 'id': 'ClearFormat',\n 'icon': 'e-clear-format',\n 'tooltip': 'Clear Format',\n 'command': 'Clear',\n 'subCommand': 'ClearFormat'\n },\n 'clearall': {\n 'id': 'ClearAll',\n 'icon': 'e-clear-all',\n 'tooltip': 'Clear All',\n 'command': 'Clear',\n 'subCommand': 'ClearAll'\n },\n 'cut': {\n 'id': 'Cut',\n 'icon': 'e-cut',\n 'tooltip': 'Cut',\n 'command': 'ClipBoard',\n 'subCommand': 'Cut'\n },\n 'copy': {\n 'id': 'Copy',\n 'icon': 'e-copy',\n 'tooltip': 'Copy',\n 'command': 'ClipBoard',\n 'subCommand': 'Copy'\n },\n 'paste': {\n 'id': 'Paste',\n 'icon': 'e-paste',\n 'tooltip': 'Paste',\n 'command': 'ClipBoard',\n 'subCommand': 'Paste'\n },\n 'unorderedlist': {\n 'id': 'UnorderedList',\n 'icon': 'e-unorder-list',\n 'tooltip': 'Bulleted List',\n 'command': 'Lists',\n 'subCommand': 'UL'\n },\n 'orderedlist': {\n 'id': 'OrderedList',\n 'icon': 'e-order-list',\n 'tooltip': 'Numbered List',\n 'command': 'Lists',\n 'subCommand': 'OL'\n },\n 'numberformatlist': {\n 'id': 'NumberFormatList',\n 'icon': 'e-order-list',\n 'tooltip': 'Number Format List',\n 'command': 'NumberFormatList',\n 'subCommand': 'NumberFormatList'\n },\n 'bulletformatlist': {\n 'id': 'BulletFormatList',\n 'icon': 'e-unorder-list',\n 'tooltip': 'Bullet Format List',\n 'command': 'BulletFormatList',\n 'subCommand': 'BulletFormatList'\n },\n 'indent': {\n 'id': 'Indent',\n 'icon': 'e-indent',\n 'tooltip': 'Increase Indent',\n 'command': 'Indents',\n 'subCommand': 'Indent'\n },\n 'outdent': {\n 'id': 'Outdent',\n 'icon': 'e-outdent',\n 'tooltip': 'Decrease Indent',\n 'command': 'Indents',\n 'subCommand': 'Outdent'\n },\n 'undo': {\n 'id': 'Undo',\n 'icon': 'e-undo',\n 'tooltip': 'Undo',\n 'command': 'Actions',\n 'subCommand': 'Undo'\n },\n 'redo': {\n 'id': 'Redo',\n 'icon': 'e-redo',\n 'tooltip': 'Redo',\n 'command': 'Actions',\n 'subCommand': 'Redo'\n },\n 'superscript': {\n 'id': 'SuperScript',\n 'icon': 'e-super-script',\n 'tooltip': 'Superscript',\n 'command': 'Effects',\n 'subCommand': 'SuperScript'\n },\n 'subscript': {\n 'id': 'SubScript',\n 'icon': 'e-sub-script',\n 'tooltip': 'Subscript',\n 'command': 'Effects',\n 'subCommand': 'SubScript'\n },\n 'createlink': {\n 'id': 'CreateLink',\n 'icon': 'e-create-link',\n 'tooltip': 'Insert Hyperlink',\n 'command': 'Links',\n 'subCommand': 'CreateLink'\n },\n 'openlink': {\n 'id': 'OpenLink',\n 'icon': 'e-open-link',\n 'tooltip': 'Open Link',\n 'command': 'Links',\n 'subCommand': 'OpenLink'\n },\n 'editlink': {\n 'id': 'EditLink',\n 'icon': 'e-edit-link',\n 'tooltip': 'Edit Link',\n 'command': 'Links',\n 'subCommand': 'EditLink'\n },\n 'removelink': {\n 'id': 'RemoveLink',\n 'icon': 'e-remove-link',\n 'tooltip': 'Remove Link',\n 'command': 'Links',\n 'subCommand': 'RemoveLink'\n },\n 'image': {\n 'id': 'Image',\n 'icon': 'e-image',\n 'tooltip': 'Insert Image',\n 'command': 'Images',\n 'subCommand': 'Image'\n },\n 'audio': {\n 'id': 'Audio',\n 'icon': 'e-audio',\n 'tooltip': 'Insert Audio',\n 'command': 'Audios',\n 'subCommand': 'Audio'\n },\n 'video': {\n 'id': 'Video',\n 'icon': 'e-video',\n 'tooltip': 'Insert Video',\n 'command': 'Videos',\n 'subCommand': 'Video'\n },\n 'filemanager': {\n 'id': 'FileManager',\n 'icon': 'e-rte-file-manager',\n 'tooltip': 'File Manager',\n 'command': 'Files',\n 'subCommand': 'File'\n },\n 'createtable': {\n 'id': 'CreateTable',\n 'icon': 'e-create-table',\n 'tooltip': 'Create Table',\n 'command': 'Table',\n 'subCommand': 'CreateTable'\n },\n 'removetable': {\n 'id': 'removeTable',\n 'icon': 'e-remove-table',\n 'tooltip': 'Remove Table',\n 'command': 'removeTable',\n 'subCommand': 'removeTable'\n },\n 'replace': {\n 'id': 'Replace',\n 'icon': 'e-replace',\n 'tooltip': 'Replace',\n 'command': 'Images',\n 'subCommand': 'Replace'\n },\n 'audioreplace': {\n 'id': 'AudioReplace',\n 'icon': 'e-audio-replace',\n 'tooltip': 'Audio Replace',\n 'command': 'Audios',\n 'subCommand': 'AudioReplace'\n },\n 'audioremove': {\n 'id': 'AudioRemove',\n 'icon': 'e-audio-remove',\n 'tooltip': 'Audio Remove',\n 'command': 'Audios',\n 'subCommand': 'AudioRemove'\n },\n 'audiolayoutoption': {\n 'id': 'AudioLayoutOption',\n 'icon': 'e-audio-display',\n 'tooltip': 'Audio LayoutOption',\n 'command': 'Audios',\n 'subCommand': 'AudioLayoutOption'\n },\n 'videoreplace': {\n 'id': 'VideoReplace',\n 'icon': 'e-video-replace',\n 'tooltip': 'Video Replace',\n 'command': 'Videos',\n 'subCommand': 'VideoReplace'\n },\n 'videoalign': {\n 'id': 'VideoAlign',\n 'icon': 'e-video-align',\n 'tooltip': 'Video Align',\n 'command': 'Videos',\n 'subCommand': 'VideoAlign'\n },\n 'videoremove': {\n 'id': 'VideoRemove',\n 'icon': 'e-video-remove',\n 'tooltip': 'Video Remove',\n 'command': 'Videos',\n 'subCommand': 'VideoRemove'\n },\n 'videolayoutoption': {\n 'id': 'VideoLayoutOption',\n 'icon': 'e-video-display',\n 'tooltip': 'Video LayoutOption',\n 'command': 'Videos',\n 'subCommand': 'VideoLayoutOption'\n },\n 'videodimension': {\n 'id': 'VideoDimension',\n 'icon': 'e-video-dimension',\n 'tooltip': 'Video Dimension',\n 'command': 'Videos',\n 'subCommand': 'VideoDimension'\n },\n 'align': {\n 'id': 'Align',\n 'icon': 'e-align',\n 'tooltip': 'Align',\n 'command': 'Images',\n 'subCommand': 'Align'\n },\n 'caption': {\n 'id': 'Caption',\n 'icon': 'e-caption',\n 'tooltip': 'Image Caption',\n 'command': 'Images',\n 'subCommand': 'Caption'\n },\n 'remove': {\n 'id': 'Remove',\n 'icon': 'e-remove',\n 'tooltip': 'Remove',\n 'command': 'Images',\n 'subCommand': 'Remove'\n },\n 'openimagelink': {\n 'id': 'OpenImageLink',\n 'icon': 'e-open-link',\n 'tooltip': 'Open Link',\n 'command': 'Images',\n 'subCommand': 'OpenImageLink'\n },\n 'editimagelink': {\n 'id': 'EditImageLink',\n 'icon': 'e-edit-link',\n 'tooltip': 'Edit Link',\n 'command': 'Images',\n 'subCommand': 'EditImageLink'\n },\n 'removeimagelink': {\n 'id': 'RemoveImageLink',\n 'icon': 'e-remove-link',\n 'tooltip': 'Remove Link',\n 'command': 'Images',\n 'subCommand': 'RemoveImageLink'\n },\n 'insertlink': {\n 'id': 'InsertLink',\n 'icon': 'e-insert-link',\n 'tooltip': 'Insert Link',\n 'command': 'Images',\n 'subCommand': 'InsertLink'\n },\n 'display': {\n 'id': 'Display',\n 'icon': 'e-display',\n 'tooltip': 'Display',\n 'command': 'Images',\n 'subCommand': 'Display'\n },\n 'alttext': {\n 'id': 'AltText',\n 'icon': 'e-alt-text',\n 'tooltip': 'Alternative Text',\n 'command': 'Images',\n 'subCommand': 'AltText'\n },\n 'dimension': {\n 'id': 'Dimension',\n 'icon': 'e-img-dimension',\n 'tooltip': 'Change Size',\n 'command': 'Images',\n 'subCommand': 'Dimension'\n },\n 'fullscreen': {\n 'id': 'Maximize',\n 'icon': 'e-maximize',\n 'tooltip': 'Maximize',\n 'command': 'View',\n 'subCommand': 'Maximize'\n },\n 'maximize': {\n 'id': 'Maximize',\n 'icon': 'e-maximize',\n 'tooltip': 'Maximize',\n 'command': 'FullScreen',\n 'subCommand': 'Maximize'\n },\n 'minimize': {\n 'id': 'Minimize',\n 'icon': 'e-minimize',\n 'tooltip': 'Minimize',\n 'command': 'FullScreen',\n 'subCommand': 'Minimize'\n },\n 'lowercase': {\n 'id': 'LowerCase',\n 'icon': 'e-lower-case',\n 'tooltip': 'Lower Case',\n 'command': 'Casing',\n 'subCommand': 'LowerCase'\n },\n 'uppercase': {\n 'id': 'UpperCase',\n 'icon': 'e-upper-case',\n 'tooltip': 'Upper Case',\n 'command': 'Casing',\n 'subCommand': 'UpperCase'\n },\n 'print': {\n 'id': 'Print',\n 'icon': 'e-print',\n 'tooltip': 'Print',\n 'command': 'Print',\n 'subCommand': 'Print'\n },\n 'formats': {\n 'id': 'Formats',\n 'icon': 'e-formats',\n 'tooltip': 'Formats',\n 'command': 'Formats',\n 'subCommand': 'Formats'\n },\n 'sourcecode': {\n 'id': 'SourceCode',\n 'icon': 'e-source-code',\n 'tooltip': 'Code View (Ctrl+Shift+H)',\n 'command': 'SourceCode',\n 'subCommand': 'SourceCode'\n },\n 'preview': {\n 'id': 'Preview',\n 'icon': 'e-preview',\n 'tooltip': 'Preview (Ctrl+Shift+H)',\n 'command': 'Preview',\n 'subCommand': 'Preview'\n },\n 'viewside': {\n 'id': 'ViewSide',\n 'icon': 'e-view-side',\n 'tooltip': 'ViewSide',\n 'command': 'ViewSide',\n 'subCommand': 'ViewSide'\n },\n 'insertcode': {\n 'id': 'InsertCode',\n 'icon': 'e-insert-code',\n 'tooltip': 'Insert Code',\n 'command': 'Formats',\n 'subCommand': 'Pre'\n },\n 'tableheader': {\n 'id': 'TableHeader',\n 'icon': 'e-table-header',\n 'tooltip': 'Table Header',\n 'command': 'Table',\n 'subCommand': 'TableHeader'\n },\n 'tableremove': {\n 'id': 'TableRemove',\n 'icon': 'e-table-remove',\n 'tooltip': 'Table Remove',\n 'command': 'Table',\n 'subCommand': 'TableRemove'\n },\n 'tablerows': {\n 'id': 'TableRows',\n 'icon': 'e-table-rows',\n 'tooltip': 'Table Rows',\n 'command': 'Table',\n 'subCommand': 'TableRows'\n },\n 'tablecolumns': {\n 'id': 'TableColumns',\n 'icon': 'e-table-columns',\n 'tooltip': 'Table Columns',\n 'command': 'Table',\n 'subCommand': 'TableColumns'\n },\n 'tablecell': {\n 'id': 'TableCell',\n 'icon': 'e-table-cell',\n 'tooltip': 'Table Cell',\n 'command': 'Table',\n 'subCommand': 'TableCell'\n },\n 'tablecellbackground': {\n 'id': 'TableCellBackground',\n 'icon': 'e-table-cell-background',\n 'tooltip': 'Table Cell Background',\n 'command': 'Table',\n 'subCommand': 'TableCellBackground'\n },\n 'tablecellhorizontalalign': {\n 'id': 'TableCellHorizontalAlign',\n 'icon': 'e-table-cell-horizontalAlign',\n 'tooltip': 'Table Cell HorizontalAlign',\n 'command': 'Table',\n 'subCommand': 'TableCellHorizontalAlign'\n },\n 'tablecellverticalalign': {\n 'id': 'TableCellVerticalAlign',\n 'icon': 'e-table-cell-verticalAlign',\n 'tooltip': 'Table Cell VerticalAlign',\n 'command': 'Table',\n 'subCommand': 'TableCellVerticalAlign'\n },\n 'tableeditproperties': {\n 'id': 'TableEditProperties',\n 'icon': 'e-table-edit-properties',\n 'tooltip': 'Table Edit Properties',\n 'command': 'Table',\n 'subCommand': 'TableEditProperties'\n },\n 'styles': {\n 'id': 'Styles',\n 'icon': 'e-table-styles',\n 'tooltip': 'Styles',\n 'command': 'Table',\n 'subCommand': 'Styles'\n },\n 'formatpainter': {\n 'id': 'FormatPainter',\n 'icon': 'e-rte-format-painter',\n 'tooltip': 'Format Painter',\n 'command': 'FormatPainter',\n 'subCommand': 'FormatPainter'\n },\n 'emojipicker': {\n 'id': 'EmojiPicker',\n 'icon': 'e-emoji',\n 'tooltip': 'Emoji Icon',\n 'command': 'EmojiPicker',\n 'subCommand': 'EmojiPicker'\n }\n};\nvar alignmentLocale = [\n { locale: 'alignmentsDropDownLeft', value: 'JustifyLeft' },\n { locale: 'alignmentsDropDownCenter', value: 'JustifyCenter' },\n { locale: 'alignmentsDropDownRight', value: 'JustifyRight' },\n { locale: 'alignmentsDropDownJustify', value: 'JustifyFull' }\n];\nexport var alignmentItems = [\n { iconCss: 'e-icons e-justify-left', text: 'Align Left', command: 'Alignments', subCommand: 'JustifyLeft' },\n { iconCss: 'e-icons e-justify-center', text: 'Align Center', command: 'Alignments', subCommand: 'JustifyCenter' },\n { iconCss: 'e-icons e-justify-right', text: 'Align Right', command: 'Alignments', subCommand: 'JustifyRight' },\n { iconCss: 'e-icons e-justify-full', text: 'Align Justify', command: 'Alignments', subCommand: 'JustifyFull' }\n];\nexport var imageAlignItems = [\n { iconCss: 'e-icons e-justify-left', command: 'Images', subCommand: 'JustifyLeft' },\n { iconCss: 'e-icons e-justify-center', command: 'Images', subCommand: 'JustifyCenter' },\n { iconCss: 'e-icons e-justify-right', command: 'Images', subCommand: 'JustifyRight' },\n];\nexport var videoAlignItems = [\n { iconCss: 'e-icons e-justify-left', command: 'Videos', subCommand: 'JustifyLeft' },\n { iconCss: 'e-icons e-justify-center', command: 'Videos', subCommand: 'JustifyCenter' },\n { iconCss: 'e-icons e-justify-right', command: 'Videos', subCommand: 'JustifyRight' },\n];\nvar displayLocale = [\n { locale: 'imageDisplayDropDownInline', value: 'Inline' },\n { locale: 'imageDisplayDropDownBreak', value: 'Break' }\n];\nvar audioLayoutOptionLocale = [\n { locale: 'audioLayoutOptionDropDownInline', value: 'Inline' },\n { locale: 'audioLayoutOptionDropDownBreak', value: 'Break' }\n];\nvar videoLayoutOptionLocale = [\n { locale: 'videoLayoutOptionDropDownInline', value: 'Inline' },\n { locale: 'videoLayoutOptionDropDownBreak', value: 'Break' }\n];\nexport var imageDisplayItems = [\n { text: 'Inline', cssClass: 'e-inline', command: 'Images', subCommand: 'Inline' },\n { text: 'Break', cssClass: 'e-break', command: 'Images', subCommand: 'Break' },\n];\nexport var audioLayoutOptionItems = [\n { text: 'Inline', cssClass: 'e-audio-inline', command: 'Audios', subCommand: 'Inline' },\n { text: 'Break', cssClass: 'e-audio-break', command: 'Audios', subCommand: 'Break' },\n];\nexport var videoLayoutOptionItems = [\n { text: 'Inline', cssClass: 'e-video-inline', command: 'Videos', subCommand: 'Inline' },\n { text: 'Break', cssClass: 'e-video-break', command: 'Videos', subCommand: 'Break' },\n];\nexport var tableCellItems = [\n { iconCss: 'e-icons e-cell-merge', text: 'Merge cells', command: 'Table', subCommand: 'Merge' },\n { iconCss: 'e-icons e-cell-horizontal-split', text: 'Horizontal split', command: 'Table', subCommand: 'HorizontalSplit' },\n { iconCss: 'e-icons e-cell-vertical-split', text: 'Vertical split', command: 'Table', subCommand: 'VerticalSplit' },\n];\nvar tableRowLocale = [\n { locale: 'tableInsertRowDropDownBefore', value: 'InsertRowBefore' },\n { locale: 'tableInsertRowDropDownAfter', value: 'InsertRowAfter' },\n { locale: 'tableInsertRowDropDownDelete', value: 'DeleteRow' }\n];\nexport var tableRowsItems = [\n { iconCss: 'e-icons e-insert-row-before', text: 'Insert row before', command: 'Table', subCommand: 'InsertRowBefore' },\n { iconCss: 'e-icons e-insert-row-after', text: 'Insert row after', command: 'Table', subCommand: 'InsertRowAfter' },\n { iconCss: 'e-icons e-delete-row', text: 'Delete row', command: 'Table', subCommand: 'DeleteRow' },\n];\nvar tableColumnLocale = [\n { locale: 'tableInsertColumnDropDownLeft', value: 'InsertColumnLeft' },\n { locale: 'tableInsertColumnDropDownRight', value: 'InsertColumnRight' },\n { locale: 'tableInsertColumnDropDownDelete', value: 'DeleteColumn' }\n];\nexport var tableColumnsItems = [\n { iconCss: 'e-icons e-insert-column-left', text: 'Insert column left', command: 'Table', subCommand: 'InsertColumnLeft' },\n { iconCss: 'e-icons e-insert-column-right', text: 'Insert column right', command: 'Table', subCommand: 'InsertColumnRight' },\n { iconCss: 'e-icons e-delete-column', text: 'Delete column', command: 'Table', subCommand: 'DeleteColumn' },\n];\nvar tableVerticalLocale = [\n { locale: 'tableVerticalAlignDropDownTop', value: 'AlignTop' },\n { locale: 'tableVerticalAlignDropDownMiddle', value: 'AlignMiddle' },\n { locale: 'tableVerticalAlignDropDownBottom', value: 'AlignBottom' }\n];\nexport var TableCellVerticalAlignItems = [\n { iconCss: 'e-icons e-align-top', text: 'Align Top', command: 'Table', subCommand: 'AlignTop' },\n { iconCss: 'e-icons e-align-middle', text: 'Align Middle', command: 'Table', subCommand: 'AlignMiddle' },\n { iconCss: 'e-icons e-align-bottom', text: 'Align Bottom', command: 'Table', subCommand: 'AlignBottom' },\n];\nvar tableStyleLocale = [\n { locale: 'tableStylesDropDownDashedBorder', value: 'Dashed' },\n { locale: 'tableStylesDropDownAlternateRows', value: 'Alternate' }\n];\nexport var TableStyleItems = [\n { text: 'Dashed Borders', cssClass: 'e-dashed-borders', command: 'Table', subCommand: 'Dashed' },\n { text: 'Alternate Rows', cssClass: 'e-alternate-rows', command: 'Table', subCommand: 'Alternate' }\n];\nexport var predefinedItems = ['Bold', 'Italic', 'Underline', '|', 'Formats', 'Alignments',\n 'OrderedList', 'UnorderedList', '|', 'CreateLink', 'Image', '|', 'SourceCode', 'Undo', 'Redo'];\nexport var fontFamily = [\n { cssClass: 'e-segoe-ui', text: 'Segoe UI', command: 'Font', subCommand: 'FontName', value: 'Segoe UI' },\n { cssClass: 'e-arial', text: 'Arial', command: 'Font', subCommand: 'FontName', value: 'Arial,Helvetica,sans-serif' },\n { cssClass: 'e-georgia', text: 'Georgia', command: 'Font', subCommand: 'FontName', value: 'Georgia,serif' },\n { cssClass: 'e-impact', text: 'Impact', command: 'Font', subCommand: 'FontName', value: 'Impact,Charcoal,sans-serif' },\n { cssClass: 'e-tahoma', text: 'Tahoma', command: 'Font', subCommand: 'FontName', value: 'Tahoma,Geneva,sans-serif' },\n { cssClass: 'e-times-new-roman', text: 'Times New Roman', command: 'Font', subCommand: 'FontName', value: 'Times New Roman,Times,serif' },\n { cssClass: 'e-verdana', text: 'Verdana', command: 'Font', subCommand: 'FontName', value: 'Verdana,Geneva,sans-serif' }\n];\nexport var fontSize = [\n { text: '8 pt', value: '8pt' },\n { text: '10 pt', value: '10pt' },\n { text: '12 pt', value: '12pt' },\n { text: '14 pt', value: '14pt' },\n { text: '18 pt', value: '18pt' },\n { text: '24 pt', value: '24pt' },\n { text: '36 pt', value: '36pt' }\n];\nexport var formatItems = [\n { cssClass: 'e-paragraph', text: 'Paragraph', command: 'Formats', subCommand: 'P', value: 'P' },\n { cssClass: 'e-code', text: 'Code', command: 'Formats', subCommand: 'Pre', value: 'Pre' },\n { cssClass: 'e-quote', text: 'Quotation', command: 'Formats', subCommand: 'BlockQuote', value: 'BlockQuote' },\n { cssClass: 'e-h1', text: 'Heading 1', command: 'Formats', subCommand: 'H1', value: 'H1' },\n { cssClass: 'e-h2', text: 'Heading 2', command: 'Formats', subCommand: 'H2', value: 'H2' },\n { cssClass: 'e-h3', text: 'Heading 3', command: 'Formats', subCommand: 'H3', value: 'H3' },\n { cssClass: 'e-h4', text: 'Heading 4', command: 'Formats', subCommand: 'H4', value: 'H4' }\n];\nexport var fontColor = {\n 'Custom': [\n '', '#000000', '#e7e6e6', '#44546a', '#4472c4', '#ed7d31', '#a5a5a5', '#ffc000', '#70ad47', '#ff0000',\n '#f2f2f2', '#808080', '#cfcdcd', '#d5dce4', '#d9e2f3', '#fbe4d5', '#ededed', '#fff2cc', '#e2efd9', '#ffcccc',\n '#d9d9d9', '#595959', '#aeaaaa', '#acb9ca', '#b4c6e7', '#f7caac', '#dbdbdb', '#ffe599', '#c5e0b3', '#ff8080',\n '#bfbfbf', '#404040', '#747070', '#8496b0', '#8eaadb', '#f4b083', '#c9c9c9', '#ffd966', '#a8d08d', '#ff3333',\n '#a6a6a6', '#262626', '#3b3838', '#323e4f', '#2f5496', '#c45911', '#7b7b7b', '#bf8f00', '#538135', '#b30000',\n '#7f7f7f', '#0d0d0d', '#161616', '#212934', '#1f3763', '#823b0b', '#525252', '#7f5f00', '#375623', '#660000'\n ]\n};\nexport var backgroundColor = {\n 'Custom': [\n '', '#000000', '#ffff00', '#00ff00', '#00ffff', '#0000ff', '#ff0000', '#000080', '#800080', '#996633',\n '#f2f2f2', '#808080', '#ffffcc', '#b3ffb3', '#ccffff', '#ccccff', '#ffcccc', '#ccccff', '#ff80ff', '#f2e6d9',\n '#d9d9d9', '#595959', '#ffff80', '#80ff80', '#b3ffff', '#8080ff', '#ff8080', '#8080ff', '#ff00ff', '#dfbf9f',\n '#bfbfbf', '#404040', '#ffff33', '#33ff33', '#33ffff', '#3333ff', '#ff3333', '#0000b3', '#b300b3', '#c68c53',\n '#a6a6a6', '#262626', '#e6e600', '#00b300', '#009999', '#000099', '#b30000', '#000066', '#660066', '#86592d',\n '#7f7f7f', '#0d0d0d', '#999900', '#006600', '#006666', '#000066', '#660000', '#00004d', '#4d004d', '#734d26'\n ]\n};\nexport var numberFormatList = [\n { text: 'None', command: 'Lists', subCommand: 'NumberFormatList', value: 'none' },\n { text: 'Number', command: 'Lists', subCommand: 'NumberFormatList', value: 'decimal' },\n { text: 'Lower Greek', command: 'Lists', subCommand: 'NumberFormatList', value: 'lowerGreek' },\n { text: 'Lower Roman', command: 'Lists', subCommand: 'NumberFormatList', value: 'lowerRoman' },\n { text: 'Upper Alpha', command: 'Lists', subCommand: 'NumberFormatList', value: 'upperAlpha' },\n { text: 'Lower Alpha', command: 'Lists', subCommand: 'NumberFormatList', value: 'lowerAlpha' },\n { text: 'Upper Roman', command: 'Lists', subCommand: 'NumberFormatList', value: 'upperRoman' },\n];\nexport var bulletFormatList = [\n { text: 'None', command: 'Lists', subCommand: 'BulletFormatList', value: 'none' },\n { text: 'Disc', command: 'Lists', subCommand: 'BulletFormatList', value: 'disc' },\n { text: 'Circle', command: 'Lists', subCommand: 'BulletFormatList', value: 'circle' },\n { text: 'Square', command: 'Lists', subCommand: 'BulletFormatList', value: 'square' },\n];\nfunction getLocale(self, localeItems, item) {\n for (var i = 0; localeItems.length > i; i++) {\n if (localeItems[i].value === item.subCommand) {\n return self.localeObj.getConstant(localeItems[i].locale);\n }\n }\n return item.text;\n}\nexport function updateDropDownLocale(self) {\n alignmentItems.forEach(function (item, i) {\n alignmentItems[i].text = getLocale(self, alignmentLocale, alignmentItems[i]);\n });\n imageDisplayItems.forEach(function (item, i) {\n imageDisplayItems[i].text = getLocale(self, displayLocale, imageDisplayItems[i]);\n });\n audioLayoutOptionItems.forEach(function (item, i) {\n audioLayoutOptionItems[i].text = getLocale(self, audioLayoutOptionLocale, audioLayoutOptionItems[i]);\n });\n videoLayoutOptionItems.forEach(function (item, i) {\n videoLayoutOptionItems[i].text = getLocale(self, videoLayoutOptionLocale, videoLayoutOptionItems[i]);\n });\n tableRowsItems.forEach(function (item, i) {\n tableRowsItems[i].text = getLocale(self, tableRowLocale, tableRowsItems[i]);\n });\n tableColumnsItems.forEach(function (item, i) {\n tableColumnsItems[i].text = getLocale(self, tableColumnLocale, tableColumnsItems[i]);\n });\n TableCellVerticalAlignItems.forEach(function (item, i) {\n TableCellVerticalAlignItems[i].text = getLocale(self, tableVerticalLocale, TableCellVerticalAlignItems[i]);\n });\n TableStyleItems.forEach(function (item, i) {\n TableStyleItems[i].text = getLocale(self, tableStyleLocale, TableStyleItems[i]);\n });\n}\nexport var windowKeys = {\n 'Insert Link': 'Ctrl+K',\n 'Insert Image': 'Ctrl+Shift+I',\n 'Create Table': 'Ctrl+Shift+E',\n 'Undo': 'Ctrl+Z',\n 'Redo': 'Ctrl+Y',\n 'Copy': 'Ctrl+C',\n 'Cut': 'Ctrl+X',\n 'Paste': 'Ctrl+V',\n 'Bold': 'Ctrl+B',\n 'Italic': 'Ctrl+I',\n 'Underline': 'Ctrl+U',\n 'Strikethrough': 'Ctrl+Shift+S',\n 'Upper Case': 'Ctrl+Shift+U',\n 'Lower Case': 'Ctrl+Shift+L',\n 'Superscript': 'Ctrl+Shift+=',\n 'Subscript': 'Ctrl+=',\n 'Code View': 'Ctrl+Shift+H',\n 'Maximize': 'Ctrl+Shift+F',\n 'Minimize': 'Esc',\n 'Clear Format': 'Ctrl+Shift+R',\n 'Numbered List': 'Ctrl+Shift+O',\n 'Bulleted List': 'Ctrl+Alt+O',\n 'Number Format List': 'Ctrl+Shift+O',\n 'Bullet Format List': 'Ctrl+Alt+O',\n 'Insert Audio': 'Ctrl+Shift+A',\n 'Insert Video': 'Ctrl+Alt+V',\n 'Increase Indent': 'Ctrl+]',\n 'Decrease Indent': 'Ctrl+[',\n 'Decrease Fontsize': 'Ctrl+Shift+<',\n 'Increase Fontsize': 'Ctrl+Shift+>',\n 'Justify Center': 'Ctrl+E',\n 'Justify Full': 'Ctrl+J',\n 'Justify Left': 'Ctrl+L',\n 'Justify Right': 'Ctrl+R',\n 'Format Painter': 'Alt+Shift+C, Alt+Shift+V'\n};\nexport var defaultEmojiIcons = [{\n name: 'Smilies & People', code: '1F600', iconCss: 'e-emoji', icons: [{ code: '1F600', desc: 'Grinning face' },\n { code: '1F603', desc: 'Grinning face with big eyes' },\n { code: '1F604', desc: 'Grinning face with smiling eyes' },\n { code: '1F606', desc: 'Grinning squinting face' },\n { code: '1F605', desc: 'Grinning face with sweat' },\n { code: '1F602', desc: 'Face with tears of joy' },\n { code: '1F923', desc: 'Rolling on the floor laughing' },\n { code: '1F60A', desc: 'Smiling face with smiling eyes' },\n { code: '1F607', desc: 'Smiling face with halo' },\n { code: '1F642', desc: 'Slightly smiling face' },\n { code: '1F643', desc: 'Upside-down face' },\n { code: '1F60D', desc: 'Smiling face with heart-eyes' },\n { code: '1F618', desc: 'Face blowing a kiss' },\n { code: '1F61B', desc: 'Face with tongue' },\n { code: '1F61C', desc: 'Winking face with tongue' },\n { code: '1F604', desc: 'Grinning face with smiling eyes' },\n { code: '1F469', desc: 'Woman' },\n { code: '1F468', desc: 'Man' },\n { code: '1F467', desc: 'Girl' },\n { code: '1F466', desc: 'Boy' },\n { code: '1F476', desc: 'Baby' },\n { code: '1F475', desc: 'Old woman' },\n { code: '1F474', desc: 'Old man' },\n { code: '1F46E', desc: 'Police officer' },\n { code: '1F477', desc: 'Construction worker' },\n { code: '1F482', desc: 'Guard' },\n { code: '1F575', desc: 'Detective' },\n { code: '1F9D1', desc: 'Cook' }]\n }, {\n name: 'Animals & Nature', code: '1F435', iconCss: 'e-animals', icons: [{ code: '1F436', desc: 'Dog face' },\n { code: '1F431', desc: 'Cat face' },\n { code: '1F42D', desc: 'Mouse face' },\n { code: '1F439', desc: 'Hamster face' },\n { code: '1F430', desc: 'Rabbit face' },\n { code: '1F98A', desc: 'Fox face' },\n { code: '1F43B', desc: 'Bear face' },\n { code: '1F43C', desc: 'Panda face' },\n { code: '1F428', desc: 'Koala' },\n { code: '1F42F', desc: 'Tiger face' },\n { code: '1F981', desc: 'Lion face' },\n { code: '1F42E', desc: 'Cow face' },\n { code: '1F437', desc: 'Pig face' },\n { code: '1F43D', desc: 'Pig nose' },\n { code: '1F438', desc: 'Frog face' },\n { code: '1F435', desc: 'Monkey face' },\n { code: '1F649', desc: 'Hear-no-evil monkey' },\n { code: '1F64A', desc: 'Speak-no-evil monkey' },\n { code: '1F412', desc: 'Monkey' },\n { code: '1F414', desc: 'Chicken' },\n { code: '1F427', desc: 'Penguin' },\n { code: '1F426', desc: 'Bird' },\n { code: '1F424', desc: 'Baby chick' },\n { code: '1F986', desc: 'Duck' },\n { code: '1F985', desc: 'Eagle' }]\n }, {\n name: 'Food & Drink', code: '1F347', iconCss: 'e-food-and-drinks', icons: [{ code: '1F34E', desc: 'Red apple' },\n { code: '1F34C', desc: 'Banana' },\n { code: '1F347', desc: 'Grapes' },\n { code: '1F353', desc: 'Strawberry' },\n { code: '1F35E', desc: 'Bread' },\n { code: '1F950', desc: 'Croissant' },\n { code: '1F955', desc: 'Carrot' },\n { code: '1F354', desc: 'Hamburger' },\n { code: '1F355', desc: 'Pizza' },\n { code: '1F32D', desc: 'Hot dog' },\n { code: '1F35F', desc: 'French fries' },\n { code: '1F37F', desc: 'Popcorn' },\n { code: '1F366', desc: 'Soft ice cream' },\n { code: '1F367', desc: 'Shaved ice' },\n { code: '1F36A', desc: 'Cookie' },\n { code: '1F382', desc: 'Birthday cake' },\n { code: '1F370', desc: 'Shortcake' },\n { code: '1F36B', desc: 'Chocolate bar' },\n { code: '1F369', desc: 'Donut' },\n { code: '1F36E', desc: 'Custard' },\n { code: '1F36D', desc: 'Lollipop' },\n { code: '1F36C', desc: 'Candy' },\n { code: '1F377', desc: 'Wine glass' },\n { code: '1F37A', desc: 'Beer mug' },\n { code: '1F37E', desc: 'Bottle with popping cork' }]\n }, {\n name: 'Activities', code: '1F383', iconCss: 'e-activities', icons: [{ code: '26BD', desc: 'Soccer ball' },\n { code: '1F3C0', desc: 'Basketball' },\n { code: '1F3C8', desc: 'American football' },\n { code: '26BE', desc: 'Baseball' },\n { code: '1F3BE', desc: 'Tennis' },\n { code: '1F3D0', desc: 'Volleyball' },\n { code: '1F3C9', desc: 'Rugby football' },\n { code: '1F3B1', desc: 'Pool 8 ball' },\n { code: '1F3D3', desc: 'Ping pong' },\n { code: '1F3F8', desc: 'Badminton' },\n { code: '1F94A', desc: 'Boxing glove' },\n { code: '1F3CA', desc: 'Swimmer' },\n { code: '1F3CB', desc: 'Weightlifter' },\n { code: '1F6B4', desc: 'Bicyclist' },\n { code: '1F6F9', desc: 'Skateboard' },\n { code: '1F3AE', desc: 'Video game' },\n { code: '1F579', desc: 'Joystick' },\n { code: '1F3CF', desc: 'Cricket' },\n { code: '1F3C7', desc: 'Horse racing' },\n { code: '1F3AF', desc: 'Direct hit' },\n { code: '1F3D1', desc: 'Field hockey' },\n { code: '1F3B0', desc: 'Slot machine' },\n { code: '1F3B3', desc: 'Bowling' },\n { code: '1F3B2', desc: 'Game die' },\n { code: '265F', desc: 'Chess pawn' }]\n }, {\n name: 'Travel & Places', code: '1F30D', iconCss: 'e-travel-and-places', icons: [{ code: '2708', desc: 'Airplane' },\n { code: '1F697', desc: 'Automobile' },\n { code: '1F695', desc: 'Taxi' },\n { code: '1F6B2', desc: 'Bicycle' },\n { code: '1F68C', desc: 'Bus' },\n { code: '1F682', desc: 'Locomotive' },\n { code: '1F6F3', desc: 'Passenger ship' },\n { code: '1F680', desc: 'Rocket' },\n { code: '1F681', desc: 'Helicopter' },\n { code: '1F6A2', desc: 'Ship' },\n { code: '1F3DF', desc: 'Stadium' },\n { code: '1F54C', desc: 'Mosque' },\n { code: '26EA', desc: 'Church' },\n { code: '1F6D5', desc: 'Hindu Temple' },\n { code: '1F3D4', desc: 'Snow-capped mountain' },\n { code: '1F3EB', desc: 'School' },\n { code: '1F30B', desc: 'Volcano' },\n { code: '1F3D6', desc: 'Beach with umbrella' },\n { code: '1F3DD', desc: 'Desert island' },\n { code: '1F3DE', desc: 'National park' },\n { code: '1F3F0', desc: 'Castle' },\n { code: '1F5FC', desc: 'Tokyo tower' },\n { code: '1F5FD', desc: 'Statue of liberty' },\n { code: '26E9', desc: 'Shinto shrine' },\n { code: '1F3EF', desc: 'Japanese castle' },\n { code: '1F3A2', desc: 'Roller coaster' }]\n }, {\n name: 'Objects', code: '1F507', iconCss: 'e-objects', icons: [{ code: '1F4A1', desc: 'Light bulb' },\n { code: '1F526', desc: 'Flashlight' },\n { code: '1F4BB', desc: 'Laptop computer' },\n { code: '1F5A5', desc: 'Desktop computer' },\n { code: '1F5A8', desc: 'Printer' },\n { code: '1F4F7', desc: 'Camera' },\n { code: '1F4F8', desc: 'Camera with flash' },\n { code: '1F4FD', desc: 'Film projector' },\n { code: '1F3A5', desc: 'Movie camera' },\n { code: '1F4FA', desc: 'Television' },\n { code: '1F4FB', desc: 'Radio' },\n { code: '1F50B', desc: 'Battery' },\n { code: '231A', desc: 'Watch' },\n { code: '1F4F1', desc: 'Mobile phone' },\n { code: '260E', desc: 'Telephone' },\n { code: '1F4BE', desc: 'Floppy disk' },\n { code: '1F4BF', desc: 'Optical disk' },\n { code: '1F4C0', desc: 'Digital versatile disc' },\n { code: '1F4BD', desc: 'Computer disk' },\n { code: '1F3A7', desc: 'Headphone' },\n { code: '1F3A4', desc: 'Microphone' },\n { code: '1F3B6', desc: 'Multiple musical notes' },\n { code: '1F4DA', desc: 'Books' }]\n }, {\n name: 'Symbols', code: '1F3E7', iconCss: 'e-symbols', icons: [{ code: '274C', desc: 'Cross mark' },\n { code: '2714', desc: 'Check mark' },\n { code: '26A0', desc: 'Warning sign' },\n { code: '1F6AB', desc: 'Prohibited' },\n { code: '2139', desc: 'Information' },\n { code: '267B', desc: 'Recycling symbol' },\n { code: '1F6AD', desc: 'No smoking' },\n { code: '1F4F5', desc: 'No mobile phones' },\n { code: '1F6AF', desc: 'No littering' },\n { code: '1F6B3', desc: 'No bicycles' },\n { code: '1F6B7', desc: 'No pedestrians' },\n { code: '2795', desc: 'Plus' },\n { code: '2796', desc: 'Minus' },\n { code: '2797', desc: 'Divide' },\n { code: '2716', desc: 'Multiplication' },\n { code: '1F4B2', desc: 'Dollar banknote' },\n { code: '1F4AC', desc: 'Speech balloon' },\n { code: '2755', desc: 'White exclamation mark' },\n { code: '2754', desc: 'White question mark' },\n { code: '2764', desc: 'Red heart' }]\n }];\n","/* eslint-disable */\n/**\n * Export default locale\n */\nexport var defaultLocale = {\n 'alignments': 'Alignments',\n 'justifyLeft': 'Align Left',\n 'justifyCenter': 'Align Center',\n 'justifyRight': 'Align Right',\n 'justifyFull': 'Align Justify',\n 'fontName': 'Font Name',\n 'fontSize': 'Font Size',\n 'fontColor': 'Font Color',\n 'backgroundColor': 'Background Color',\n 'bold': 'Bold',\n 'italic': 'Italic',\n 'underline': 'Underline',\n 'strikethrough': 'Strikethrough',\n 'clearFormat': 'Clear Format',\n 'clearAll': 'Clear All',\n 'cut': 'Cut',\n 'copy': 'Copy',\n 'paste': 'Paste',\n 'unorderedList': 'Bulleted List',\n 'orderedList': 'Numbered List',\n 'indent': 'Increase Indent',\n 'outdent': 'Decrease Indent',\n 'undo': 'Undo',\n 'redo': 'Redo',\n 'superscript': 'Superscript',\n 'subscript': 'Subscript',\n 'createLink': 'Insert Link',\n 'openLink': 'Open Link',\n 'editLink': 'Edit Link',\n 'removeLink': 'Remove Link',\n 'image': 'Insert Image',\n 'audio': 'Insert Audio',\n 'video': 'Insert Video',\n 'replace': 'Replace',\n 'numberFormatList': 'Number Format List',\n 'bulletFormatList': 'Bullet Format List',\n 'audioReplace': 'Replace',\n 'videoReplace': 'Replace',\n 'videoAlign': 'Align',\n 'videoDimension': 'Dimension',\n 'audioRemove': 'Remove',\n 'videoRemove': 'Remove',\n 'audioLayoutOption': 'Layout option',\n 'videoLayoutOption': 'Layout option',\n 'align': 'Align',\n 'caption': 'Caption',\n 'remove': 'Remove',\n 'insertLink': 'Insert Link',\n 'display': 'Display',\n 'altText': 'Alternative text',\n 'dimension': 'Change Size',\n 'fullscreen': 'Maximize',\n 'maximize': 'Maximize',\n 'minimize': 'Minimize',\n 'lowerCase': 'Lower Case',\n 'upperCase': 'Upper Case',\n 'print': 'Print',\n 'formats': 'Formats',\n 'sourcecode': 'Code View',\n 'preview': 'Preview',\n 'viewside': 'ViewSide',\n 'insertCode': 'Insert Code',\n 'linkText': 'Display text',\n 'linkTooltipLabel': 'Title',\n 'linkWebUrl': 'Web address',\n 'linkTitle': 'Enter a title',\n 'linkurl': 'https://example.com',\n 'linkOpenInNewWindow': 'Open link in new window',\n 'linkHeader': 'Insert Link',\n 'dialogInsert': 'Insert',\n 'dialogCancel': 'Cancel',\n 'dialogUpdate': 'Update',\n 'imageHeader': 'Insert Image',\n 'audioHeader': 'Insert Audio',\n 'videoHeader': 'Insert Video',\n 'imageLinkHeader': 'You can also provide a link from the web',\n 'audioLinkHeader': 'You can also provide a link from the web',\n 'videoLinkHeader': 'Web URL',\n 'embedVideoLinkHeader': 'Media Embed URL',\n 'mdimageLink': 'Please provide a URL for your image',\n 'imageUploadMessage': 'Drop image here or browse to upload',\n 'audioUploadMessage': 'Drop an audio file or browse to upload',\n 'videoUploadMessage': 'Drop a video file or browse to upload',\n 'imageDeviceUploadMessage': 'Click here to upload',\n 'audioDeviceUploadMessage': 'Click here to upload',\n 'videoDeviceUploadMessage': 'Click here to upload',\n 'imageAlternateText': 'Alternate Text',\n 'alternateHeader': 'Alternative Text',\n 'browse': 'Browse',\n 'imageUrl': 'https://example.com/image.png',\n 'audioUrl': 'https://example.com/audio.mp3',\n 'videoUrl': 'https://example.com/video.mp4',\n 'webUrl': 'Web URL',\n 'embedUrl': 'Embed Code',\n 'imageCaption': 'Caption',\n 'imageSizeHeader': 'Image Size',\n 'videoSizeHeader': 'Video Size',\n 'imageHeight': 'Height',\n 'imageWidth': 'Width',\n 'videoHeight': 'Height',\n 'videoWidth': 'Width',\n 'textPlaceholder': 'Enter text',\n 'inserttablebtn': 'Insert Table',\n 'tabledialogHeader': 'Insert Table',\n 'tableWidth': 'Width',\n 'cellpadding': 'Cell Padding',\n 'cellspacing': 'Cell Spacing',\n 'columns': 'Number of columns',\n 'rows': 'Number of rows',\n 'tableRows': 'Row',\n 'tableColumns': 'Column',\n 'tableCellHorizontalAlign': 'Table Cell Horizontal Align',\n 'tableCellVerticalAlign': 'Vertical Align',\n 'createTable': 'Create Table',\n 'removeTable': 'Remove Table',\n 'tableHeader': 'Header Row',\n 'tableRemove': 'Delete Table',\n 'tableCellBackground': 'Table Cell Background',\n 'tableEditProperties': 'Table Edit Properties',\n 'styles': 'Styles',\n 'insertColumnLeft': 'Insert Column Left',\n 'insertColumnRight': 'Insert Column Right',\n 'deleteColumn': 'Delete Column',\n 'insertRowBefore': 'Insert Row Before',\n 'insertRowAfter': 'Insert Row After',\n 'deleteRow': 'Delete Row',\n 'tableEditHeader': 'Edit Table',\n 'TableHeadingText': 'Heading',\n 'TableColText': 'Col',\n 'imageInsertLinkHeader': 'Insert Link',\n 'editImageHeader': 'Edit Image',\n 'editAudioHeader': 'Edit Audio',\n 'editVideoHeader': 'Edit Video',\n \"alignmentsDropDownLeft\": 'Align Left',\n \"alignmentsDropDownCenter\": 'Align Center',\n \"alignmentsDropDownRight\": 'Align Right',\n \"alignmentsDropDownJustify\": 'Align Justify',\n \"imageDisplayDropDownInline\": 'Inline',\n \"imageDisplayDropDownBreak\": 'Break',\n \"audioLayoutOptionDropDownInline\": 'Inline',\n \"audioLayoutOptionDropDownBreak\": 'Break',\n \"videoLayoutOptionDropDownInline\": 'Inline',\n \"videoLayoutOptionDropDownBreak\": 'Break',\n \"tableInsertRowDropDownBefore\": 'Insert row before',\n \"tableInsertRowDropDownAfter\": 'Insert row after',\n \"tableInsertRowDropDownDelete\": 'Delete row',\n \"tableInsertColumnDropDownLeft\": 'Insert column left',\n \"tableInsertColumnDropDownRight\": 'Insert column right',\n \"tableInsertColumnDropDownDelete\": 'Delete column',\n \"tableVerticalAlignDropDownTop\": 'Align Top',\n \"tableVerticalAlignDropDownMiddle\": 'Align Middle',\n \"tableVerticalAlignDropDownBottom\": 'Align Bottom',\n \"tableStylesDropDownDashedBorder\": 'Dashed Borders',\n \"tableStylesDropDownAlternateRows\": 'Alternate Rows',\n 'pasteFormat': 'Paste Format',\n 'pasteFormatContent': 'Choose the formatting action',\n 'plainText': 'Plain Text',\n 'cleanFormat': 'Clean',\n 'keepFormat': 'Keep',\n 'pasteDialogOk': 'OK',\n 'pasteDialogCancel': 'Cancel',\n 'fileManager': 'File Manager',\n 'fileDialogHeader': 'File Browser',\n \"formatsDropDownParagraph\": 'Paragraph',\n 'formatsDropDownCode': 'Code',\n 'formatsDropDownQuotation': 'Quotation',\n 'formatsDropDownHeading1': 'Heading 1',\n 'formatsDropDownHeading2': 'Heading 2',\n 'formatsDropDownHeading3': 'Heading 3',\n 'formatsDropDownHeading4': 'Heading 4',\n 'fontNameSegoeUI': 'Segoe UI',\n 'fontNameArial': 'Arial',\n 'fontNameGeorgia': 'Georgia',\n 'fontNameImpact': 'Impact',\n 'fontNameTahoma': 'Tahoma',\n 'fontNameTimesNewRoman': 'Times New Roman',\n 'fontNameVerdana': 'Verdana',\n 'numberFormatListNumber': 'Number',\n 'numberFormatListLowerAlpha': 'Lower Alpha',\n 'numberFormatListUpperAlpha': 'Upper Alpha',\n 'numberFormatListLowerRoman': 'Lower Roman',\n 'numberFormatListUpperRoman': 'Upper Roman',\n 'numberFormatListLowerGreek': 'Lower Greek',\n 'bulletFormatListDisc': 'Disc',\n 'bulletFormatListCircle': 'Circle',\n 'bulletFormatListSquare': 'Square',\n 'numberFormatListNone': 'None',\n 'bulletFormatListNone': 'None',\n 'formatPainter': 'Format Painter',\n 'emojiPicker': 'Emoji Picker',\n 'embeddedCode': 'Embedded code',\n 'pasteEmbeddedCodeHere': 'Paste embedded code here',\n 'emojiPickerTypeToFind': 'Type to find',\n 'emojiPickerNoResultFound': 'No results found',\n 'emojiPickerTrySomethingElse': 'Try something else',\n 'linkAriaLabel': 'Open in new window',\n 'unsupportedImage': 'Unsupported file format',\n 'mergecells': 'Merge cells',\n 'verticalsplit': 'Vertical split',\n 'horizontalsplit': 'Horizontal split'\n};\nexport var toolsLocale = {\n 'alignments': 'alignments',\n 'justifyleft': 'justifyLeft',\n 'justifycenter': 'justifyCenter',\n 'justifyright': 'justifyRight',\n 'justifyfull': 'justifyFull',\n 'fontname': 'fontName',\n 'fontsize': 'fontSize',\n 'fontcolor': 'fontColor',\n 'backgroundcolor': 'backgroundColor',\n 'bold': 'bold',\n 'italic': 'italic',\n 'underline': 'underline',\n 'strikethrough': 'strikethrough',\n 'clearformat': 'clearFormat',\n 'clearall': 'clearAll',\n 'cut': 'cut',\n 'copy': 'copy',\n 'paste': 'paste',\n 'unorderedlist': 'unorderedList',\n 'orderedlist': 'orderedList',\n 'indent': 'indent',\n 'outdent': 'outdent',\n 'numberformatlist': 'numberFormatList',\n 'bulletformatlist': 'bulletFormatList',\n 'undo': 'undo',\n 'redo': 'redo',\n 'filemanager': 'fileManager',\n 'superscript': 'superscript',\n 'subscript': 'subscript',\n 'createlink': 'createLink',\n 'openlink': 'openLink',\n 'editlink': 'editLink',\n 'removelink': 'removeLink',\n 'openimagelink': 'openLink',\n 'editimagelink': 'editLink',\n 'removeimagelink': 'removeLink',\n 'image': 'image',\n 'audio': 'audio',\n 'video': 'video',\n 'replace': 'replace',\n 'audioreplace': 'audioReplace',\n 'videoreplace': 'videoReplace',\n 'videoalign': 'videoAlign',\n 'videodimension': 'videoDimension',\n 'audioremove': 'audioRemove',\n 'videoremove': 'videoRemove',\n 'audiolayoutoption': 'audioLayoutOption',\n 'videolayoutoption': 'videoLayoutOption',\n 'align': 'align',\n 'caption': 'caption',\n 'remove': 'remove',\n 'insertlink': 'insertLink',\n 'display': 'display',\n 'alttext': 'alternateHeader',\n 'dimension': 'dimension',\n 'fullscreen': 'fullscreen',\n 'maximize': 'maximize',\n 'minimize': 'minimize',\n 'lowercase': 'lowerCase',\n 'uppercase': 'upperCase',\n 'print': 'print',\n 'formats': 'formats',\n 'sourcecode': 'sourcecode',\n 'preview': 'preview',\n 'viewside': 'viewside',\n 'insertcode': 'insertCode',\n 'tablerows': 'tableRows',\n 'tablecolumns': 'tableColumns',\n 'tablecellhorizontalalign': 'tableCellHorizontalAlign',\n 'tablecellverticalalign': 'tableCellVerticalAlign',\n 'createtable': 'createTable',\n 'removetable': 'removeTable',\n 'tableheader': 'tableHeader',\n 'tableremove': 'tableRemove',\n 'tablecellbackground': 'tableCellBackground',\n 'tableeditproperties': 'tableEditProperties',\n 'styles': 'styles',\n 'insertcolumnleft': 'insertColumnLeft',\n 'insertcolumnright': 'insertColumnRight',\n 'deletecolumn': 'deleteColumn',\n 'aligntop': 'AlignTop',\n 'alignmiddle': 'AlignMiddle',\n 'alignbottom': 'AlignBottom',\n 'insertrowbefore': 'insertRowBefore',\n 'insertrowafter': 'insertRowAfter',\n 'deleterow': 'deleteRow',\n 'formatpainter': 'formatPainter',\n 'emojipicker': 'emojiPicker',\n 'embeddedCode': 'Embedded code',\n 'pasteEmbeddedCodeHere': 'Paste embedded code here',\n 'emojiPickerTypeToFind': 'Type to find',\n 'emojiPickerNoResultFound': 'No results found',\n 'emojiPickerTrySomethingElse': 'Try something else',\n 'imageLinkAriaLabel': 'Open in new window',\n};\nexport var fontNameLocale = [\n { locale: 'fontNameSegoeUI', value: 'Segoe UI' },\n { locale: 'fontNameArial', value: 'Arial,Helvetica,sans-serif' },\n { locale: 'fontNameGeorgia', value: 'Georgia,serif' },\n { locale: 'fontNameImpact', value: 'Impact,Charcoal,sans-serif' },\n { locale: 'fontNameTahoma', value: 'Tahoma,Geneva,sans-serif' },\n { locale: 'fontNameTimesNewRoman', value: 'Times New Roman,Times,serif' },\n { locale: 'fontNameVerdana', value: 'Verdana,Geneva,sans-serif' }\n];\nexport var formatsLocale = [\n { locale: 'formatsDropDownParagraph', value: 'P' },\n { locale: 'formatsDropDownCode', value: 'Pre' },\n { locale: 'formatsDropDownQuotation', value: 'BlockQuote' },\n { locale: 'formatsDropDownHeading1', value: 'H1' },\n { locale: 'formatsDropDownHeading2', value: 'H2' },\n { locale: 'formatsDropDownHeading3', value: 'H3' },\n { locale: 'formatsDropDownHeading4', value: 'H4' }\n];\nexport var numberFormatListLocale = [\n { locale: 'numberFormatListNone', value: 'none' },\n { locale: 'numberFormatListNumber', value: 'decimal' },\n { locale: 'numberFormatListLowerAlpha', value: 'lower-alpha' },\n { locale: 'numberFormatListUpperAlpha', value: 'upper-alpha' },\n { locale: 'numberFormatListLowerRoman', value: 'lower-roman' },\n { locale: 'numberFormatListUpperRoman', value: 'upper-roman' },\n { locale: 'numberFormatListLowerGreek', value: 'lower-greek' }\n];\nexport var bulletFormatListLocale = [\n { locale: 'bulletFormatListNone', value: 'none' },\n { locale: 'bulletFormatListDisc', value: 'disc' },\n { locale: 'bulletFormatListCircle', value: 'circle' },\n { locale: 'bulletFormatListSquare', value: 'square' },\n];\n","/**\n * Defines util methods used by Rich Text Editor.\n */\nimport { isNullOrUndefined as isNOU, addClass, removeClass, selectAll, createElement } from '@syncfusion/ej2-base';\nimport { Browser, detach, SanitizeHtmlHelper, extend } from '@syncfusion/ej2-base';\nimport * as classes from '../base/classes';\nimport * as CONSTANT from '../base/constant';\nimport * as model from '../models/items';\nimport { toolsLocale, fontNameLocale, formatsLocale, numberFormatListLocale, bulletFormatListLocale } from '../models/default-locale';\nvar undoRedoItems = ['Undo', 'Redo'];\nvar inlineNode = ['a', 'abbr', 'acronym', 'audio', 'b', 'bdi', 'bdo', 'big', 'br', 'button',\n 'canvas', 'cite', 'code', 'data', 'datalist', 'del', 'dfn', 'em', 'embed', 'font', 'i', 'iframe', 'img', 'input',\n 'ins', 'kbd', 'label', 'map', 'mark', 'meter', 'noscript', 'object', 'output', 'picture', 'progress',\n 'q', 'ruby', 's', 'samp', 'script', 'select', 'slot', 'small', 'span', 'strong', 'strike', 'sub', 'sup', 'svg',\n 'template', 'textarea', 'time', 'u', 'tt', 'var', 'video', 'wbr'];\n/**\n * @param {string} val - specifies the string value\n * @param {string} items - specifies the value\n * @returns {number} - returns the number value\n * @hidden\n */\nexport function getIndex(val, items) {\n var index = -1;\n items.some(function (item, i) {\n if (typeof item === 'string' && val === item.toLocaleLowerCase()) {\n index = i;\n return true;\n }\n return false;\n });\n return index;\n}\n/**\n * @param {Element} element - specifies the element\n * @param {string} className - specifies the string value\n * @returns {boolean} - returns the boolean value\n * @hidden\n */\nexport function hasClass(element, className) {\n var hasClass = false;\n if (element.classList.contains(className)) {\n hasClass = true;\n }\n return hasClass;\n}\n/**\n * @param {IDropDownItemModel} items - specifies the item model\n * @param {string} value - specifies the string value\n * @param {string} type - specifies the string value\n * @param {string} returnType - specifies the return type\n * @returns {string} - returns the string value\n * @hidden\n */\nexport function getDropDownValue(items, value, type, returnType) {\n var data;\n var result;\n for (var k = 0; k < items.length; k++) {\n if (type === 'value' && items[k].value.toLocaleLowerCase() === value.toLocaleLowerCase()) {\n data = items[k];\n break;\n }\n else if (type === 'text' && items[k].text.toLocaleLowerCase() === value.toLocaleLowerCase()) {\n data = items[k];\n break;\n }\n else if (type === 'subCommand' && items[k].subCommand.toLocaleLowerCase() === value.toLocaleLowerCase()) {\n data = items[k];\n break;\n }\n }\n if (!isNOU(data)) {\n switch (returnType) {\n case 'text':\n result = data.text;\n break;\n case 'value':\n result = data.value;\n break;\n case 'iconCss':\n result = data.iconCss;\n break;\n }\n }\n return result;\n}\n/**\n * @returns {boolean} - returns the boolean value\n * @hidden\n */\nexport function isIDevice() {\n var result = false;\n if (Browser.isDevice && Browser.isIos) {\n result = true;\n }\n return result;\n}\n/**\n * @param {string} value - specifies the value\n * @returns {string} - returns the string value\n * @hidden\n */\nexport function getFormattedFontSize(value) {\n if (isNOU(value)) {\n return '';\n }\n return value;\n}\n/**\n * @param {MouseEvent} e - specifies the mouse event\n * @param {HTMLElement} parentElement - specifies the parent element\n * @param {boolean} isIFrame - specifies the boolean value\n * @returns {number} - returns the number\n * @hidden\n */\nexport function pageYOffset(e, parentElement, isIFrame) {\n var y = 0;\n if (isIFrame) {\n y = window.pageYOffset + parentElement.getBoundingClientRect().top + e.clientY;\n }\n else {\n y = e.pageY;\n }\n return y;\n}\n/**\n * @param {string} item - specifies the string\n * @param {ServiceLocator} serviceLocator - specifies the service locator\n * @returns {string} - returns the string\n * @hidden\n */\nexport function getTooltipText(item, serviceLocator) {\n var i10n = serviceLocator.getService('rteLocale');\n var itemLocale = toolsLocale[\"\" + item];\n var tooltipText = i10n.getConstant(itemLocale);\n return tooltipText;\n}\n/**\n * @param {ISetToolbarStatusArgs} e - specifies the e element\n * @param {boolean} isPopToolbar - specifies the boolean value\n * @param {IRichTextEditor} self - specifies the parent element\n * @returns {void}\n * @hidden\n */\nexport function setToolbarStatus(e, isPopToolbar, self) {\n updateDropDownFontFormatLocale(self);\n var dropDown = e.dropDownModule;\n var data = e.args;\n var keys = Object.keys(e.args);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n for (var j = 0; j < e.tbItems.length; j++) {\n var item = e.tbItems[j].subCommand;\n var itemStr = item && item.toLocaleLowerCase();\n if (item && (itemStr === key) || (item === 'UL' && key === 'unorderedlist') || (item === 'OL' && key === 'orderedlist') ||\n (itemStr === 'pre' && key === 'insertcode') || (item === 'NumberFormatList' && key === 'numberFormatList' ||\n item === 'BulletFormatList' && key === 'bulletFormatList')) {\n if (typeof data[\"\" + key] === 'boolean') {\n if (data[\"\" + key] === true) {\n addClass([e.tbElements[j]], [classes.CLS_ACTIVE]);\n }\n else {\n removeClass([e.tbElements[j]], [classes.CLS_ACTIVE]);\n }\n }\n else if ((typeof data[\"\" + key] === 'string' || data[\"\" + key] === null) &&\n getIndex(key, e.parent.toolbarSettings.items) >= -1) {\n var value = ((data[\"\" + key]) ? data[\"\" + key] : '');\n var result = '';\n switch (key) {\n case 'formats': {\n if (isNOU(dropDown.formatDropDown) || isPopToolbar ||\n (!isNOU(dropDown.formatDropDown) && dropDown.formatDropDown.isDestroyed)) {\n break;\n }\n var formatItems = e.parent.format.types;\n var formatContent = isNOU(e.parent.format.default) ? formatItems[0].text :\n e.parent.format.default;\n result = value === 'empty' ? '' : getDropDownValue(formatItems, value, 'subCommand', 'text');\n dropDown.formatDropDown.content = ('' +\n ''\n + (isNOU(result) ? formatContent : result) +\n '');\n dropDown.formatDropDown.dataBind();\n break;\n }\n case 'alignments': {\n if (isNOU(dropDown.alignDropDown) ||\n (!isNOU(dropDown.alignDropDown) && dropDown.alignDropDown.isDestroyed)) {\n break;\n }\n var alignItems = model.alignmentItems;\n result = getDropDownValue(alignItems, value, 'subCommand', 'iconCss');\n dropDown.alignDropDown.iconCss = isNOU(result) ? 'e-icons e-justify-left' : result;\n dropDown.alignDropDown.dataBind();\n break;\n }\n case 'fontname': {\n if (isNOU(dropDown.fontNameDropDown) || isPopToolbar ||\n (!isNOU(dropDown.fontNameDropDown) && dropDown.fontNameDropDown.isDestroyed)) {\n break;\n }\n var fontNameItems = e.parent.fontFamily.items;\n result = value === 'empty' ? '' : getDropDownValue(fontNameItems, value, 'value', 'text');\n var fontNameContent = isNOU(e.parent.fontFamily.default) ? fontNameItems[0].text :\n e.parent.fontFamily.default;\n var name_1 = (isNOU(result) ? fontNameContent : result);\n dropDown.fontNameDropDown.content = ('' +\n ''\n + name_1 + '');\n dropDown.fontNameDropDown.dataBind();\n break;\n }\n case 'fontsize': {\n if (isNOU(dropDown.fontSizeDropDown) ||\n (!isNOU(dropDown.fontSizeDropDown) && dropDown.fontSizeDropDown.isDestroyed)) {\n break;\n }\n var fontSizeItems = e.parent.fontSize.items;\n var fontSizeContent = isNOU(e.parent.fontSize.default) ? fontSizeItems[1].text :\n e.parent.fontSize.default;\n result = value === 'empty' ? '' : getDropDownValue(fontSizeItems, (value === '' ? fontSizeContent.replace(/\\s/g, '') : value), 'value', 'text');\n dropDown.fontSizeDropDown.content = ('' +\n ''\n + getFormattedFontSize(result) + '');\n dropDown.fontSizeDropDown.dataBind();\n break;\n }\n case 'bulletFormatList':\n case 'numberFormatList': {\n if (value !== '') {\n addClass([e.tbElements[j]], [classes.CLS_ACTIVE]);\n }\n else {\n removeClass([e.tbElements[j]], [classes.CLS_ACTIVE]);\n }\n }\n }\n }\n }\n }\n }\n}\n/**\n * @param {string} items - specifies the string value\n * @returns {string[]} - returns the array value\n * @hidden\n */\nexport function getCollection(items) {\n if (typeof items === 'object') {\n return items;\n }\n else {\n return [items];\n }\n}\n/**\n * @param {string[]} items - specifies the array of string value\n * @param {IToolbarItemModel} toolbarItems - specifies the tool bar model\n * @returns {number} - returns the number\n * @hidden\n */\nexport function getTBarItemsIndex(items, toolbarItems) {\n var itemsIndex = [];\n for (var i = 0; i < items.length; i++) {\n for (var j = 0; j < toolbarItems.length; j++) {\n if (toolbarItems[j].type === 'Separator') {\n continue;\n }\n else {\n if ((items[i] === 'OrderedList' || items[i] === 'NumberFormatList') && toolbarItems[j].subCommand === 'OL') {\n itemsIndex.push(j);\n break;\n }\n else if ((items[i] === 'UnorderedList' || items[i] === 'BulletFormatList') && toolbarItems[j].subCommand === 'UL') {\n itemsIndex.push(j);\n break;\n }\n else if (items[i] === 'InsertCode' && toolbarItems[j].subCommand === 'Pre') {\n itemsIndex.push(j);\n break;\n }\n else if (items[i] === 'FileManager' && toolbarItems[j].subCommand === 'File') {\n itemsIndex.push(j);\n break;\n }\n else if (typeof (items[i]) === 'object' && items[i].command === 'Custom') {\n itemsIndex.push(i);\n break;\n }\n else if (items[i] === toolbarItems[j].subCommand) {\n itemsIndex.push(j);\n break;\n }\n }\n }\n }\n return itemsIndex;\n}\n/**\n * @param {BaseToolbar} baseToolbar - specifies the base\n * @param {boolean} undoRedoStatus - specifies the boolean value\n * @returns {void}\n * @hidden\n */\nexport function updateUndoRedoStatus(baseToolbar, undoRedoStatus) {\n var i = 0;\n var trgItems = getTBarItemsIndex(getCollection(undoRedoItems), baseToolbar.toolbarObj.items);\n var tbItems = selectAll('.' + classes.CLS_TB_ITEM, baseToolbar.toolbarObj.element);\n var keys = Object.keys(undoRedoStatus);\n for (var _i = 0, keys_2 = keys; _i < keys_2.length; _i++) {\n var key = keys_2[_i];\n var target = tbItems[trgItems[i]];\n if (target) {\n baseToolbar.toolbarObj.enableItems(target, undoRedoStatus[\"\" + key]);\n }\n i++;\n }\n}\n/**\n * To dispatch the event manually\n *\n * @param {Element} element - specifies the element.\n * @param {string} type - specifies the string type.\n * @returns {void}\n * @hidden\n\n */\nexport function dispatchEvent(element, type) {\n var evt = document.createEvent('HTMLEvents');\n evt.initEvent(type, false, true);\n element.dispatchEvent(evt);\n}\n/**\n * To parse the HTML\n *\n * @param {string} value - specifies the string value\n * @returns {DocumentFragment} - returns the document\n * @hidden\n */\nexport function parseHtml(value) {\n var tempNode = createElement('template');\n tempNode.innerHTML = value;\n if (tempNode.content instanceof DocumentFragment) {\n return tempNode.content;\n }\n else {\n return document.createRange().createContextualFragment(value);\n }\n}\n/**\n * @param {Document} docElement - specifies the document element\n * @param {Element} node - specifies the node\n * @returns {Node[]} - returns the node array\n * @hidden\n */\nexport function getTextNodesUnder(docElement, node) {\n var nodes = [];\n for (node = node.firstChild; node; node = node.nextSibling) {\n if (node.nodeType === 3) {\n nodes.push(node);\n }\n else {\n nodes = nodes.concat(getTextNodesUnder(docElement, node));\n }\n }\n return nodes;\n}\n/**\n * @param {IToolsItemConfigs} obj - specifies the configuration\n * @returns {void}\n * @hidden\n */\nexport function toObjectLowerCase(obj) {\n var convertedValue = {};\n var keys = Object.keys(obj);\n for (var i = 0; i < Object.keys(obj).length; i++) {\n convertedValue[keys[i].toLocaleLowerCase()] = obj[keys[i]];\n }\n return convertedValue;\n}\n/**\n * @param {string} value - specifies the string value\n * @param {IRichTextEditor} rteObj - specifies the rte object\n * @returns {string} - returns the string\n * @hidden\n */\nexport function getEditValue(value, rteObj) {\n var val;\n if (value !== null && value !== '') {\n val = rteObj.enableHtmlEncode ? updateTextNode(decode(value), rteObj) : updateTextNode(value, rteObj);\n rteObj.setProperties({ value: val }, true);\n }\n else {\n if (rteObj.enterKey === 'DIV') {\n val = rteObj.enableHtmlEncode ? '<div><br/></div>' : '

    ';\n }\n else if (rteObj.enterKey === 'BR') {\n val = rteObj.enableHtmlEncode ? '<br/>' : '
    ';\n }\n else {\n val = rteObj.enableHtmlEncode ? '<p><br/></p>' : '


    ';\n }\n }\n return val;\n}\n/**\n * @param {string} value - specifies the value\n * @param {IRichTextEditor} rteObj - specifies the rich text editor instance.\n * @returns {string} - returns the string\n * @hidden\n */\nexport function updateTextNode(value, rteObj) {\n var tempNode = document.createElement('div');\n var resultElm = document.createElement('div');\n var childNodes = tempNode.childNodes;\n tempNode.innerHTML = value;\n tempNode.setAttribute('class', 'tempDiv');\n if (childNodes.length > 0) {\n var isPreviousInlineElem = void 0;\n var previousParent = void 0;\n var insertElem = void 0;\n while (tempNode.firstChild) {\n var emptyBlockElem = tempNode.querySelectorAll(CONSTANT.blockEmptyNodes);\n for (var i = 0; i < emptyBlockElem.length; i++) {\n emptyBlockElem[i].innerHTML = '
    ';\n }\n // To handle the Empty block node with \\n\n var allPNodes = tempNode.querySelectorAll('p');\n for (var i = 0; i < allPNodes.length; i++) {\n if (allPNodes[i].textContent.trim().length === 0 && allPNodes[i].childNodes.length === 1\n && allPNodes[i].childNodes[0].nodeName === '#text' &&\n isNOU(allPNodes[i].childNodes[0].textContent.match(/\\u00a0/g))) {\n allPNodes[i].innerHTML = '
    ';\n }\n }\n var emptyInlineElem = tempNode.querySelectorAll(CONSTANT.inlineEmptyNodes);\n for (var i = 0; i < emptyInlineElem.length; i++) {\n emptyInlineElem[i].innerHTML = '​';\n }\n if (rteObj.enterKey !== 'BR' && ((tempNode.firstChild.nodeName === '#text' &&\n (tempNode.firstChild.textContent.indexOf('\\n') < 0 || tempNode.firstChild.textContent.trim() !== '')) ||\n inlineNode.indexOf(tempNode.firstChild.nodeName.toLocaleLowerCase()) >= 0)) {\n if (!isPreviousInlineElem) {\n if (rteObj.enterKey === 'DIV') {\n insertElem = createElement('div');\n }\n else {\n insertElem = createElement('p');\n }\n resultElm.appendChild(insertElem);\n insertElem.appendChild(tempNode.firstChild);\n }\n else {\n previousParent.appendChild(tempNode.firstChild);\n }\n previousParent = insertElem;\n isPreviousInlineElem = true;\n }\n else if (tempNode.firstChild.nodeName === '#text' && (tempNode.firstChild.textContent === '\\n' ||\n (tempNode.firstChild.textContent.indexOf('\\n') >= 0 && tempNode.firstChild.textContent.trim() === ''))) {\n detach(tempNode.firstChild);\n }\n else {\n resultElm.appendChild(tempNode.firstChild);\n isPreviousInlineElem = false;\n }\n }\n var imageElm = resultElm.querySelectorAll('img');\n for (var i = 0; i < imageElm.length; i++) {\n if (imageElm[i].classList.contains('e-rte-image-unsupported')) {\n continue; // Should not add the class if the image is Broken.\n }\n if (!imageElm[i].classList.contains(classes.CLS_RTE_IMAGE)) {\n imageElm[i].classList.add(classes.CLS_RTE_IMAGE);\n }\n if (!(imageElm[i].classList.contains(classes.CLS_IMGINLINE) ||\n imageElm[i].classList.contains(classes.CLS_IMGBREAK)) &&\n !(imageElm[i].classList.contains('e-imgleft') || imageElm[i].classList.contains('e-imgright') || imageElm[i].classList.contains('e-imgcenter'))) {\n imageElm[i].classList.add(classes.CLS_IMGINLINE);\n }\n }\n }\n return resultElm.innerHTML;\n}\n/**\n * @param {IRichTextEditor} rteObj - specifies the rte object\n * @returns {string} - returns the value based on enter configuration.\n * @hidden\n */\nexport function getDefaultValue(rteObj) {\n var currentVal;\n if (rteObj.enterKey === 'DIV') {\n currentVal = rteObj.enableHtmlEncode ? '<div><br/></div>' : '

    ';\n }\n else if (rteObj.enterKey === 'BR') {\n currentVal = rteObj.enableHtmlEncode ? '<br/>' : '
    ';\n }\n else {\n currentVal = rteObj.enableHtmlEncode ? '<p><br/></p>' : '


    ';\n }\n return currentVal;\n}\n/**\n * @param {string} value - specifies the value\n * @returns {boolean} - returns the boolean value\n * @hidden\n */\nexport function isEditableValueEmpty(value) {\n return (value === '


    ' || value === '<p><br></p>'\n || value === '

    ' || value === '<div><br></div>'\n || value === '
    ' || value === '<br>'\n || value === '') ? true : false;\n}\n/**\n * @param {string} value - specifies the string value\n * @returns {string} - returns the string\n * @hidden\n */\nexport function decode(value) {\n return value.replace(/&/g, '&').replace(/&lt;/g, '<')\n .replace(/</g, '<').replace(/&gt;/g, '>')\n .replace(/>/g, '>').replace(/ /g, ' ')\n .replace(/&nbsp;/g, ' ').replace(/"/g, '');\n}\n/**\n * @param {string} value - specifies the string value\n * @param {IRichTextEditor} parent - specifies the rte\n * @returns {string} - returns the string value\n * @hidden\n */\nexport function sanitizeHelper(value, parent) {\n if (parent.enableHtmlSanitizer) {\n var item = SanitizeHtmlHelper.beforeSanitize();\n if (item.selectors.tags[2] && item.selectors.tags[2].indexOf('iframe') > -1) {\n item.selectors.tags[2] = 'iframe:not(.e-rte-embed-url)';\n }\n var beforeEvent = {\n cancel: false,\n helper: null\n };\n extend(item, item, beforeEvent);\n parent.trigger('beforeSanitizeHtml', item);\n if (item.cancel && !isNOU(item.helper)) {\n value = item.helper(value);\n }\n else if (!item.cancel) {\n value = SanitizeHtmlHelper.serializeValue(item, value);\n }\n }\n return value;\n}\n/**\n * @param {string} dataUrl - specifies the string value\n * @returns {BaseToolbar} - returns the value\n * @hidden\n */\n//Converting the base64 url to blob\nexport function convertToBlob(dataUrl) {\n var arr = dataUrl.split(',');\n var mime = arr[0].match(/:(.*?);/)[1];\n var bstr = atob(arr[1]);\n var n = bstr.length;\n var u8arr = new Uint8Array(n);\n while (n--) {\n u8arr[n] = bstr.charCodeAt(n);\n }\n return new Blob([u8arr], { type: mime });\n}\n/**\n * @param {IRichTextEditor} self - specifies the rte\n * @param {string} localeItems - specifies the locale items\n * @param {IDropDownItemModel} item - specifies the dropdown item\n * @returns {string} - returns the value\n * @hidden\n */\nexport function getLocaleFontFormat(self, localeItems, item) {\n for (var i = 0; localeItems.length > i; i++) {\n if (localeItems[i].value === item.value || localeItems[i].value === item.subCommand) {\n return self.localeObj.getConstant(localeItems[i].locale);\n }\n }\n return item.text;\n}\n/**\n * @param {IRichTextEditor} self - specifies the rte\n * @returns {void}\n * @hidden\n */\nexport function updateDropDownFontFormatLocale(self) {\n model.fontFamily.forEach(function (item, i) {\n model.fontFamily[i].text = getLocaleFontFormat(self, fontNameLocale, model.fontFamily[i]);\n });\n model.formatItems.forEach(function (item, i) {\n model.formatItems[i].text = getLocaleFontFormat(self, formatsLocale, model.formatItems[i]);\n });\n model.numberFormatList.forEach(function (item, i) {\n model.numberFormatList[i].text = getLocaleFontFormat(self, numberFormatListLocale, model.numberFormatList[i]);\n });\n model.bulletFormatList.forEach(function (item, i) {\n model.bulletFormatList[i].text = getLocaleFontFormat(self, bulletFormatListLocale, model.bulletFormatList[i]);\n });\n}\n","/**\n * Is formatted or not.\n *\n * @hidden\n\n */\nvar IsFormatted = /** @class */ (function () {\n function IsFormatted() {\n }\n /**\n * getFormattedNode method\n *\n * @param {Node} node - specifies the node.\n * @param {string} format - specifies the string value.\n * @param {Node} endNode - specifies the end node\n * @returns {Node} - returns the node\n * @hidden\n\n */\n IsFormatted.prototype.getFormattedNode = function (node, format, endNode) {\n var parentNode = this.getFormatParent(node, format, endNode);\n if (parentNode !== null && parentNode !== endNode) {\n return parentNode;\n }\n return null;\n };\n IsFormatted.prototype.getFormatParent = function (node, format, endNode) {\n do {\n node = node.parentNode;\n } while (node && (node !== endNode) && !this.isFormattedNode(node, format));\n return node;\n };\n IsFormatted.prototype.isFormattedNode = function (node, format) {\n switch (format) {\n case 'bold':\n return IsFormatted.isBold(node);\n case 'italic':\n return IsFormatted.isItalic(node);\n case 'underline':\n return IsFormatted.isUnderline(node);\n case 'strikethrough':\n return IsFormatted.isStrikethrough(node);\n case 'superscript':\n return IsFormatted.isSuperscript(node);\n case 'subscript':\n return IsFormatted.isSubscript(node);\n case 'fontcolor':\n return this.isFontColor(node);\n case 'fontname':\n return this.isFontName(node);\n case 'fontsize':\n return this.isFontSize(node);\n case 'backgroundcolor':\n return this.isBackgroundColor(node);\n default:\n return false;\n }\n };\n /**\n * isBold method\n *\n * @param {Node} node - specifies the node value\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n IsFormatted.isBold = function (node) {\n var validTags = ['strong', 'b'];\n if (validTags.indexOf(node.nodeName.toLowerCase()) !== -1) {\n return true;\n }\n else if (this.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n node.style && node.style.fontWeight === 'bold') {\n return true;\n }\n else {\n return false;\n }\n };\n /**\n * isItalic method\n *\n * @param {Node} node - specifies the node value\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n IsFormatted.isItalic = function (node) {\n var validTags = ['em', 'i'];\n if (validTags.indexOf(node.nodeName.toLowerCase()) !== -1) {\n return true;\n }\n else if (this.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n node.style && node.style.fontStyle === 'italic') {\n return true;\n }\n else {\n return false;\n }\n };\n /**\n * isUnderline method\n *\n * @param {Node} node - specifies the node value\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n IsFormatted.isUnderline = function (node) {\n var validTags = ['u'];\n if (validTags.indexOf(node.nodeName.toLowerCase()) !== -1) {\n return true;\n /* eslint-disable */\n }\n else if (this.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n node.style && (node.style.textDecoration === 'underline' ||\n node.style.textDecorationLine === 'underline')) {\n /* eslint-enable */\n return true;\n }\n else {\n return false;\n }\n };\n /**\n * isStrikethrough method\n *\n * @param {Node} node - specifies the node value\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n IsFormatted.isStrikethrough = function (node) {\n var validTags = ['del', 'strike'];\n if (validTags.indexOf(node.nodeName.toLowerCase()) !== -1) {\n return true;\n /* eslint-disable */\n }\n else if (this.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n node.style && (node.style.textDecoration === 'line-through' ||\n node.style.textDecorationLine === 'line-through')) {\n /* eslint-enable */\n return true;\n }\n else {\n return false;\n }\n };\n /**\n * isSuperscript method\n *\n * @param {Node} node - specifies the node value\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n IsFormatted.isSuperscript = function (node) {\n var validTags = ['sup'];\n if (validTags.indexOf(node.nodeName.toLowerCase()) !== -1) {\n return true;\n }\n else {\n return false;\n }\n };\n /**\n * isSubscript method\n *\n * @param {Node} node - specifies the node value\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n IsFormatted.isSubscript = function (node) {\n var validTags = ['sub'];\n if (validTags.indexOf(node.nodeName.toLowerCase()) !== -1) {\n return true;\n }\n else {\n return false;\n }\n };\n IsFormatted.prototype.isFontColor = function (node) {\n var color = node.style && node.style.color;\n if (IsFormatted.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n color !== null && color !== '' && color !== undefined) {\n return true;\n }\n else {\n return false;\n }\n };\n IsFormatted.prototype.isBackgroundColor = function (node) {\n var backColor = node.style && node.style.backgroundColor;\n if (IsFormatted.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n backColor !== null && backColor !== '' && backColor !== undefined) {\n return true;\n }\n else {\n return false;\n }\n };\n IsFormatted.prototype.isFontSize = function (node) {\n var size = node.style && node.style.fontSize;\n if (IsFormatted.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n size !== null && size !== '' && size !== undefined) {\n return true;\n }\n else {\n return false;\n }\n };\n IsFormatted.prototype.isFontName = function (node) {\n var name = node.style && node.style.fontFamily;\n if (IsFormatted.inlineTags.indexOf(node.nodeName.toLowerCase()) !== -1 &&\n name !== null && name !== '' && name !== undefined) {\n return true;\n }\n else {\n return false;\n }\n };\n // Get Formatted Node\n IsFormatted.inlineTags = [\n 'a',\n 'abbr',\n 'acronym',\n 'b',\n 'bdo',\n 'big',\n 'cite',\n 'code',\n 'dfn',\n 'em',\n 'font',\n 'i',\n 'kbd',\n 'label',\n 'q',\n 'samp',\n 'small',\n 'span',\n 'strong',\n 'sub',\n 'sup',\n 'tt',\n 'u',\n 'var',\n 'del'\n ];\n return IsFormatted;\n}());\nexport { IsFormatted };\n","/**\n * Constant values for EditorManager\n */\n/**\n * Image plugin events\n *\n * @hidden\n */\nexport var IMAGE = 'INSERT-IMAGE';\nexport var AUDIO = 'INSERT-AUDIO';\nexport var VIDEO = 'INSERT-VIDEO';\nexport var TABLE = 'INSERT-TABLE';\nexport var LINK = 'INSERT-LINK';\nexport var INSERT_ROW = 'INSERT-ROW';\nexport var INSERT_COLUMN = 'INSERT-COLUMN';\nexport var DELETEROW = 'DELETE-ROW';\nexport var DELETECOLUMN = 'DELETE-COLUMN';\nexport var REMOVETABLE = 'REMOVE-TABLE';\nexport var TABLEHEADER = 'TABLE-HEADER';\nexport var TABLE_VERTICAL_ALIGN = 'TABLE_VERTICAL_ALIGN';\nexport var TABLE_MERGE = 'TABLE_MERGE';\nexport var TABLE_VERTICAL_SPLIT = 'TABLE_VERTICAL_SPLIT';\nexport var TABLE_HORIZONTAL_SPLIT = 'TABLE_HORIZONTAL_SPLIT';\nexport var TABLE_MOVE = 'TABLE_MOVE';\n/**\n * Alignments plugin events\n *\n * @hidden\n */\nexport var ALIGNMENT_TYPE = 'alignment-type';\n/**\n * Indents plugin events\n *\n * @hidden\n */\nexport var INDENT_TYPE = 'indent-type';\n/**\n * Constant tag names\n *\n * @hidden\n */\nexport var DEFAULT_TAG = 'p';\n/**\n * @hidden\n */\nexport var BLOCK_TAGS = ['address', 'article', 'aside', 'audio', 'blockquote',\n 'canvas', 'details', 'dd', 'div', 'dl', 'dt', 'fieldset', 'figcaption', 'figure', 'footer',\n 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'header', 'hgroup', 'hr', 'li', 'main', 'nav',\n 'noscript', 'ol', 'output', 'p', 'pre', 'section', 'table', 'tbody', 'td', 'tfoot', 'th',\n 'thead', 'tr', 'ul', 'video', 'body'];\n/**\n * @hidden\n */\nexport var IGNORE_BLOCK_TAGS = ['td', 'th'];\n/**\n * @hidden\n */\nexport var TABLE_BLOCK_TAGS = ['table', 'tbody', 'td', 'tfoot', 'th',\n 'thead', 'tr'];\n/**\n * Selection plugin events\n *\n * @hidden\n */\nexport var SELECTION_TYPE = 'selection-type';\n/**\n * Insert HTML plugin events\n *\n * @hidden\n */\nexport var INSERTHTML_TYPE = 'inserthtml-type';\n/**\n * Insert Text plugin events\n *\n * @hidden\n */\nexport var INSERT_TEXT_TYPE = 'insert-text-type';\n/**\n * Clear Format HTML plugin events\n *\n * @hidden\n */\nexport var CLEAR_TYPE = 'clear-type';\n/**\n * Self closing tags\n *\n * @hidden\n */\nexport var SELF_CLOSING_TAGS = ['area', 'base', 'br', 'embed', 'hr', 'img', 'input', 'param', 'source', 'track', 'wbr', 'iframe', 'td', 'table'];\n/**\n * Source\n *\n * @hidden\n */\nexport var PASTE_SOURCE = ['word', 'excel', 'onenote'];\n","import { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * `Selection` module is used to handle RTE Selections.\n */\nvar NodeSelection = /** @class */ (function () {\n function NodeSelection() {\n this.startNodeName = [];\n this.endNodeName = [];\n }\n NodeSelection.prototype.saveInstance = function (range, body) {\n this.range = range.cloneRange();\n this.rootNode = this.documentFromRange(range);\n this.body = body;\n this.startContainer = this.getNodeArray(range.startContainer, true);\n this.endContainer = this.getNodeArray(range.endContainer, false);\n this.startOffset = range.startOffset;\n this.endOffset = range.endOffset;\n this.html = this.body.innerHTML;\n return this;\n };\n NodeSelection.prototype.documentFromRange = function (range) {\n return (9 === range.startContainer.nodeType) ? range.startContainer : range.startContainer.ownerDocument;\n };\n NodeSelection.prototype.getRange = function (docElement) {\n var select = this.get(docElement);\n var range = select && select.rangeCount > 0 ? select.getRangeAt(select.rangeCount - 1) : docElement.createRange();\n return (range.startContainer !== docElement || range.endContainer !== docElement\n || range.startOffset || range.endOffset || (range.setStart(docElement.body, 0),\n range.collapse(!0)),\n range);\n };\n /**\n * get method\n *\n * @param {Document} docElement - specifies the get function\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.get = function (docElement) {\n return docElement.defaultView.getSelection();\n };\n /**\n * save method\n *\n * @param {Range} range - range value.\n * @param {Document} docElement - specifies the document.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.save = function (range, docElement) {\n range = (range) ? range.cloneRange() : this.getRange(docElement);\n return this.saveInstance(range, docElement.body);\n };\n /**\n * getIndex method\n *\n * @param {Node} node - specifies the node value.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getIndex = function (node) {\n var index;\n var num = 0;\n node = !node.previousSibling && node.tagName === 'BR' ? node : node.previousSibling;\n if (node) {\n for (var type = node.nodeType; node; null) {\n index = node.nodeType;\n num++;\n //eslint-disable-next-line\n type = index;\n node = node.previousSibling;\n }\n }\n return num;\n };\n NodeSelection.prototype.isChildNode = function (nodeCollection, parentNode) {\n for (var index = 0; index < parentNode.childNodes.length; index++) {\n if (nodeCollection.indexOf(parentNode.childNodes[index]) > -1) {\n return true;\n }\n }\n return false;\n };\n NodeSelection.prototype.getNode = function (startNode, endNode, nodeCollection) {\n if (endNode === startNode &&\n (startNode.nodeType === 3 || !startNode.firstChild || nodeCollection.indexOf(startNode.firstChild) !== -1\n || this.isChildNode(nodeCollection, startNode))) {\n return null;\n }\n if (startNode.nodeType === 3 && startNode.previousSibling === endNode && endNode.nodeName === 'IMG') {\n return null;\n }\n if (nodeCollection.indexOf(startNode.firstChild) === -1 && startNode.firstChild && !this.isChildNode(nodeCollection, startNode)) {\n return startNode.firstChild;\n }\n if (startNode.nextSibling) {\n return startNode.nextSibling;\n }\n if (!startNode.parentNode) {\n return null;\n }\n else {\n return startNode.parentNode;\n }\n };\n /**\n * getNodeCollection method\n *\n * @param {Range} range -specifies the range.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getNodeCollection = function (range) {\n var startNode = range.startContainer.childNodes[range.startOffset]\n || range.startContainer;\n var endNode = range.endContainer.childNodes[(range.endOffset > 0) ? (range.endOffset - 1) : range.endOffset]\n || range.endContainer;\n if ((startNode === endNode || (startNode.nodeName === 'BR' && startNode === range.endContainer.childNodes[range.endOffset])) &&\n startNode.childNodes.length === 0) {\n return [startNode];\n }\n if (range.startOffset === range.endOffset && range.startOffset !== 0 && range.startContainer.nodeName === 'PRE') {\n return [startNode.nodeName === 'BR' || startNode.nodeName === '#text' ? startNode : startNode.childNodes[0]];\n }\n var nodeCollection = [];\n do {\n if (nodeCollection.indexOf(startNode) === -1) {\n nodeCollection.push(startNode);\n }\n startNode = this.getNode(startNode, endNode, nodeCollection);\n } while (startNode);\n return nodeCollection;\n };\n /**\n * getParentNodeCollection method\n *\n * @param {Range} range - specifies the range value.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getParentNodeCollection = function (range) {\n return this.getParentNodes(this.getNodeCollection(range), range);\n };\n /**\n * getParentNodes method\n *\n * @param {Node[]} nodeCollection - specifies the collection of nodes.\n * @param {Range} range - specifies the range values.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getParentNodes = function (nodeCollection, range) {\n nodeCollection = nodeCollection.reverse();\n for (var index = 0; index < nodeCollection.length; index++) {\n if ((nodeCollection.indexOf(nodeCollection[index].parentNode) !== -1)\n || (nodeCollection[index].nodeType === 3 &&\n range.startContainer !== range.endContainer &&\n range.startContainer.parentNode !== range.endContainer.parentNode)) {\n nodeCollection.splice(index, 1);\n index--;\n }\n else if (nodeCollection[index].nodeType === 3) {\n nodeCollection[index] = nodeCollection[index].parentNode;\n }\n }\n return nodeCollection;\n };\n /**\n * getSelectionNodeCollection method\n *\n * @param {Range} range - specifies the range value.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getSelectionNodeCollection = function (range) {\n return this.getSelectionNodes(this.getNodeCollection(range));\n };\n /**\n * getSelectionNodeCollection along with BR node method\n *\n * @param {Range} range - specifies the range value.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getSelectionNodeCollectionBr = function (range) {\n return this.getSelectionNodesBr(this.getNodeCollection(range));\n };\n /**\n * getParentNodes method\n *\n * @param {Node[]} nodeCollection - specifies the collection of nodes.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getSelectionNodes = function (nodeCollection) {\n nodeCollection = nodeCollection.reverse();\n // eslint-disable-next-line\n var regEx = new RegExp(String.fromCharCode(8203), 'g');\n for (var index = 0; index < nodeCollection.length; index++) {\n if (nodeCollection[index].nodeType !== 3 || (nodeCollection[index].textContent.trim() === '' ||\n (nodeCollection[index].textContent.length === 1 && nodeCollection[index].textContent.match(regEx)))) {\n nodeCollection.splice(index, 1);\n index--;\n }\n }\n return nodeCollection.reverse();\n };\n /**\n * Get selection text nodes with br method.\n *\n * @param {Node[]} nodeCollection - specifies the collection of nodes.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getSelectionNodesBr = function (nodeCollection) {\n nodeCollection = nodeCollection.reverse();\n // eslint-disable-next-line\n var regEx = new RegExp(String.fromCharCode(8203), 'g');\n for (var index = 0; index < nodeCollection.length; index++) {\n if (nodeCollection[index].nodeName !== 'BR' &&\n (nodeCollection[index].nodeType !== 3 || (nodeCollection[index].textContent.trim() === '' ||\n (nodeCollection[index].textContent.length === 1 && nodeCollection[index].textContent.match(regEx))))) {\n nodeCollection.splice(index, 1);\n index--;\n }\n }\n return nodeCollection.reverse();\n };\n /**\n * getInsertNodeCollection method\n *\n * @param {Range} range - specifies the range value.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getInsertNodeCollection = function (range) {\n return this.getInsertNodes(this.getNodeCollection(range));\n };\n /**\n * getInsertNodes method\n *\n * @param {Node[]} nodeCollection - specifies the collection of nodes.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getInsertNodes = function (nodeCollection) {\n nodeCollection = nodeCollection.reverse();\n for (var index = 0; index < nodeCollection.length; index++) {\n if ((nodeCollection[index].childNodes.length !== 0 &&\n nodeCollection[index].nodeType !== 3) ||\n (nodeCollection[index].nodeType === 3 &&\n nodeCollection[index].textContent === '')) {\n nodeCollection.splice(index, 1);\n index--;\n }\n }\n return nodeCollection.reverse();\n };\n /**\n * getNodeArray method\n *\n * @param {Node} node - specifies the node content.\n * @param {boolean} isStart - specifies the boolean value.\n * @param {Document} root - specifies the root document.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getNodeArray = function (node, isStart, root) {\n var array = [];\n // eslint-disable-next-line\n ((isStart) ? (this.startNodeName = []) : (this.endNodeName = []));\n for (; node !== (root ? root : this.rootNode); null) {\n if (isNullOrUndefined(node)) {\n break;\n }\n // eslint-disable-next-line\n (isStart) ? this.startNodeName.push(node.nodeName.toLowerCase()) : this.endNodeName.push(node.nodeName.toLowerCase());\n array.push(this.getIndex(node));\n node = node.parentNode;\n }\n return array;\n };\n NodeSelection.prototype.setRangePoint = function (range, isvalid, num, size) {\n var node = this.rootNode;\n var index = num.length;\n var constant = size;\n for (; index--; null) {\n node = node && node.childNodes[num[index]];\n }\n if (node && constant >= 0 && node.nodeName !== 'html') {\n if (node.nodeType === 3 && node.nodeValue.replace(/\\u00a0/g, ' ') === ' ') {\n constant = node.textContent.length;\n }\n range[isvalid ? 'setStart' : 'setEnd'](node, constant);\n }\n return range;\n };\n /**\n * restore method\n *\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.restore = function () {\n var range = this.range.cloneRange();\n range = this.setRangePoint(range, true, this.startContainer, this.startOffset);\n range = this.setRangePoint(range, false, this.endContainer, this.endOffset);\n this.selectRange(this.rootNode, range);\n return range;\n };\n NodeSelection.prototype.selectRange = function (docElement, range) {\n this.setRange(docElement, range);\n this.save(range, docElement);\n };\n /**\n * setRange method\n *\n * @param {Document} docElement - specifies the document.\n * @param {Range} range - specifies the range.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.setRange = function (docElement, range) {\n var selection = this.get(docElement);\n selection.removeAllRanges();\n selection.addRange(range);\n };\n /**\n * setSelectionText method\n *\n * @param {Document} docElement - specifies the documrent\n * @param {Node} startNode - specifies the starting node.\n * @param {Node} endNode - specifies the the end node.\n * @param {number} startIndex - specifies the starting index.\n * @param {number} endIndex - specifies the end index.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.setSelectionText = function (docElement, startNode, endNode, startIndex, endIndex) {\n var range = docElement.createRange();\n range.setStart(startNode, startIndex);\n range.setEnd(endNode, endIndex);\n this.setRange(docElement, range);\n };\n /**\n * setSelectionContents method\n *\n * @param {Document} docElement - specifies the document.\n * @param {Node} element - specifies the node.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.setSelectionContents = function (docElement, element) {\n var range = docElement.createRange();\n range.selectNode(element);\n this.setRange(docElement, range);\n };\n /**\n * setSelectionNode method\n *\n * @param {Document} docElement - specifies the document.\n * @param {Node} element - specifies the node.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.setSelectionNode = function (docElement, element) {\n var range = docElement.createRange();\n range.selectNodeContents(element);\n this.setRange(docElement, range);\n };\n /**\n * getSelectedNodes method\n *\n * @param {Document} docElement - specifies the document.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.getSelectedNodes = function (docElement) {\n return this.getNodeCollection(this.getRange(docElement));\n };\n /**\n * Clear method\n *\n * @param {Document} docElement - specifies the document.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.Clear = function (docElement) {\n this.get(docElement).removeAllRanges();\n };\n /**\n * insertParentNode method\n *\n * @param {Document} docElement - specifies the document.\n * @param {Node} newNode - specicfies the new node.\n * @param {Range} range - specifies the range.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.insertParentNode = function (docElement, newNode, range) {\n range.surroundContents(newNode);\n this.selectRange(docElement, range);\n };\n /**\n * setCursorPoint method\n *\n * @param {Document} docElement - specifies the document.\n * @param {Element} element - specifies the element.\n * @param {number} point - specifies the point.\n * @returns {void}\n * @hidden\n\n */\n NodeSelection.prototype.setCursorPoint = function (docElement, element, point) {\n var range = docElement.createRange();\n var selection = docElement.defaultView.getSelection();\n range.setStart(element, point);\n range.collapse(true);\n selection.removeAllRanges();\n selection.addRange(range);\n };\n return NodeSelection;\n}());\nexport { NodeSelection };\n","/**\n * Defines common util methods used by Rich Text Editor.\n */\nimport { isNullOrUndefined, Browser, createElement, detach } from '@syncfusion/ej2-base';\nvar inlineNode = ['a', 'abbr', 'acronym', 'audio', 'b', 'bdi', 'bdo', 'big', 'br', 'button',\n 'canvas', 'cite', 'code', 'data', 'datalist', 'del', 'dfn', 'em', 'embed', 'font', 'i', 'iframe', 'img', 'input',\n 'ins', 'kbd', 'label', 'map', 'mark', 'meter', 'noscript', 'object', 'output', 'picture', 'progress',\n 'q', 'ruby', 's', 'samp', 'script', 'select', 'slot', 'small', 'span', 'strong', 'strike', 'sub', 'sup', 'svg',\n 'template', 'textarea', 'time', 'u', 'tt', 'var', 'video', 'wbr'];\n/**\n * @returns {void}\n * @hidden\n */\nexport function isIDevice() {\n var result = false;\n if (Browser.isDevice && Browser.isIos) {\n result = true;\n }\n return result;\n}\n/**\n * @param {Element} editableElement - specifies the editable element.\n * @param {string} selector - specifies the string values.\n * @returns {void}\n * @hidden\n */\nexport function setEditFrameFocus(editableElement, selector) {\n if (editableElement.nodeName === 'BODY' && !isNullOrUndefined(selector)) {\n var iframe = top.window.document.querySelector(selector);\n if (!isNullOrUndefined(iframe)) {\n iframe.contentWindow.focus();\n }\n }\n}\n/**\n * @param {string} value - specifies the string value\n * @param {string} enterAction - specifies the enter key action API\n * @returns {void}\n * @hidden\n */\nexport function updateTextNode(value, enterAction) {\n var tempNode = document.createElement('div');\n tempNode.innerHTML = value;\n tempNode.setAttribute('class', 'tempDiv');\n var resultElm = document.createElement('div');\n var childNodes = tempNode.childNodes;\n if (childNodes.length > 0) {\n var isPreviousInlineElem = void 0;\n var previousParent = void 0;\n var paraElm = void 0;\n while (tempNode.firstChild) {\n if ((tempNode.firstChild.nodeName === '#text' &&\n (tempNode.firstChild.textContent.indexOf('\\n') < 0 || tempNode.firstChild.textContent.trim() !== '')) ||\n inlineNode.indexOf(tempNode.firstChild.nodeName.toLocaleLowerCase()) >= 0) {\n if (!isPreviousInlineElem) {\n if (enterAction === 'BR') {\n resultElm.appendChild(tempNode.firstChild);\n previousParent = resultElm;\n }\n else {\n paraElm = createElement('p');\n resultElm.appendChild(paraElm);\n paraElm.appendChild(tempNode.firstChild);\n previousParent = paraElm;\n isPreviousInlineElem = true;\n }\n }\n else {\n previousParent.appendChild(tempNode.firstChild);\n previousParent = paraElm;\n isPreviousInlineElem = true;\n }\n }\n else if (tempNode.firstChild.nodeName === '#text' && (tempNode.firstChild.textContent === '\\n' ||\n (tempNode.firstChild.textContent.indexOf('\\n') >= 0 && tempNode.firstChild.textContent.trim() === ''))) {\n detach(tempNode.firstChild);\n }\n else {\n resultElm.appendChild(tempNode.firstChild);\n isPreviousInlineElem = false;\n }\n }\n var tableElm = resultElm.querySelectorAll('table');\n for (var i = 0; i < tableElm.length; i++) {\n if (tableElm[i].classList.length > 0 && !tableElm[i].classList.contains('e-rte-table')) {\n tableElm[i].classList.add('e-rte-paste-table');\n if (tableElm[i].classList.contains('e-rte-paste-word-table')) {\n tableElm[i].classList.remove('e-rte-paste-word-table');\n continue; // Skiping the removal of the border if the source is from word.\n }\n else if (tableElm[i].classList.contains('e-rte-paste-excel-table')) {\n tableElm[i].classList.remove('e-rte-paste-excel-table');\n if (tableElm[i].getAttribute('border') === '0') {\n tableElm[i].removeAttribute('border');\n }\n var tdElm = tableElm[i].querySelectorAll('td');\n for (var j = 0; j < tdElm.length; j++) {\n if (tdElm[j].style.borderLeft === 'none') {\n tdElm[j].style.removeProperty('border-left');\n }\n if (tdElm[j].style.borderRight === 'none') {\n tdElm[j].style.removeProperty('border-right');\n }\n if (tdElm[j].style.borderBottom === 'none') {\n tdElm[j].style.removeProperty('border-bottom');\n }\n if (tdElm[j].style.borderTop === 'none') {\n tdElm[j].style.removeProperty('border-top');\n }\n if (tdElm[j].style.border === 'none') {\n tdElm[j].style.removeProperty('border');\n }\n }\n }\n else if (tableElm[i].classList.contains('e-rte-paste-onenote-table')) {\n tableElm[i].classList.remove('e-rte-paste-onenote-table');\n continue;\n }\n else if (tableElm[i].classList.contains('e-rte-paste-html-table')) {\n tableElm[i].classList.remove('e-rte-paste-html-table');\n continue;\n }\n }\n }\n var imageElm = resultElm.querySelectorAll('img');\n for (var i = 0; i < imageElm.length; i++) {\n if (imageElm[i].classList.contains('e-rte-image-unsupported')) {\n continue; // Should not add the class if the image is Broken.\n }\n if (!imageElm[i].classList.contains('e-rte-image')) {\n imageElm[i].classList.add('e-rte-image');\n }\n if (!(imageElm[i].classList.contains('e-imginline') ||\n imageElm[i].classList.contains('e-imgbreak'))) {\n imageElm[i].classList.add('e-imginline');\n }\n }\n }\n return resultElm.innerHTML;\n}\n/**\n * @param {Node} startChildNodes - specifies the node\n * @returns {void}\n * @hidden\n */\nexport function getLastTextNode(startChildNodes) {\n var finalNode = startChildNodes;\n do {\n if (finalNode.childNodes.length > 0) {\n finalNode = finalNode.childNodes[0];\n }\n } while (finalNode.childNodes.length > 0);\n return finalNode;\n}\n/**\n * @returns {void}\n * @hidden\n */\nexport function getDefaultHtmlTbStatus() {\n return {\n bold: false,\n italic: false,\n subscript: false,\n superscript: false,\n strikethrough: false,\n orderedlist: false,\n unorderedlist: false,\n numberFormatList: false,\n bulletFormatList: false,\n underline: false,\n alignments: null,\n backgroundcolor: null,\n fontcolor: null,\n fontname: null,\n fontsize: null,\n formats: null,\n createlink: false,\n insertcode: false\n };\n}\n/**\n * @returns {void}\n * @hidden\n */\nexport function getDefaultMDTbStatus() {\n return {\n bold: false,\n italic: false,\n subscript: false,\n superscript: false,\n strikethrough: false,\n orderedlist: false,\n uppercase: false,\n lowercase: false,\n inlinecode: false,\n unorderedlist: false,\n formats: null\n };\n}\n/**\n * @param {Range} range - specifies the range\n * @returns {void}\n * @hidden\n */\nexport function nestedListCleanUp(range) {\n if (range.startContainer.parentElement.closest('ol,ul') !== null && range.endContainer.parentElement.closest('ol,ul') !== null) {\n range.extractContents();\n while ((range.startContainer.nodeName === \"#text\" ? range.startContainer.parentElement : range.startContainer).querySelectorAll('li :empty').length > 0 ||\n (range.startContainer.nodeName === \"#text\" ? range.startContainer.parentElement : range.startContainer).querySelectorAll('ol :empty').length > 0) {\n var emptyLI = (range.startContainer.nodeName === \"#text\" ? range.startContainer.parentElement : range.startContainer).querySelectorAll('li :empty');\n if (emptyLI.length > 0) {\n emptyLI.forEach(function (item) {\n item.remove();\n });\n }\n else {\n break;\n }\n }\n var liElem = (range.startContainer.nodeName === \"#text\" ? range.startContainer.parentElement : range.startContainer).querySelectorAll(\"li\");\n if (liElem.length > 0) {\n liElem.forEach(function (item) {\n if (!isNullOrUndefined(item.firstChild) && (item.firstChild.nodeName === \"OL\" || item.firstChild.nodeName === \"UL\")) {\n item.style.listStyleType = \"none\";\n }\n });\n }\n }\n}\n/**\n * Method to scroll the content to the cursor position\n *\n * @param {Document} document - specifies the document.\n * @param {HTMLElement | HTMLBodyElement} inputElement - specifies the input element.\n * @returns {void}\n */\nexport function scrollToCursor(document, inputElement) {\n var rootElement = inputElement.nodeName === 'BODY' ?\n inputElement.ownerDocument.defaultView.frameElement.closest('.e-richtexteditor') :\n inputElement.closest('.e-richtexteditor');\n var height = rootElement.style.height;\n if (document.getSelection().rangeCount === 0) {\n return;\n }\n var range = document.getSelection().getRangeAt(0);\n var finalFocusElement = range.startContainer.nodeName === '#text' ? range.startContainer.parentElement :\n range.startContainer;\n var rect = finalFocusElement.getBoundingClientRect();\n var cursorTop = rect.top;\n var cursorBottom = rect.bottom;\n var rootRect = rootElement.getBoundingClientRect();\n var hasMargin = rootElement.querySelectorAll('.e-count-enabled, .e-resize-enabled').length > 0;\n if (inputElement.nodeName === 'BODY') {\n if (height === 'auto') {\n if (window.innerHeight < cursorTop) {\n finalFocusElement.scrollIntoView(false);\n }\n }\n else {\n if (cursorTop > inputElement.getBoundingClientRect().height) {\n finalFocusElement.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n }\n }\n }\n else {\n if (height === 'auto') {\n if (window.innerHeight < cursorTop) {\n finalFocusElement.scrollIntoView({ block: 'end', inline: 'nearest' });\n }\n }\n else {\n if (cursorBottom > rootRect.bottom) {\n rootElement.querySelector('.e-rte-content').scrollTop += (cursorBottom - rootRect.bottom) + (hasMargin ? 20 : 0);\n }\n }\n }\n}\n","import { IsFormatted } from './isformatted';\nimport * as CONSTANT from './../base/constant';\nimport { NodeSelection } from './../../selection/index';\nimport { getDefaultHtmlTbStatus } from './../../common/util';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * Update Toolbar Status\n *\n * @hidden\n\n */\nexport var statusCollection = getDefaultHtmlTbStatus();\nvar ToolbarStatus = /** @class */ (function () {\n function ToolbarStatus() {\n }\n /**\n * get method\n *\n * @param {Document} docElement - specifies the document element\n * @param {Node} rootNode - specifies the content editable element\n * @param {string[]} formatNode - specifies the format node\n * @param {string[]} fontSize - specifies the font size\n * @param {string[]} fontName - specifies the font name.\n * @param {Node} documentNode - specifies the document node.\n * @returns {IToolbarStatus} - returns the toolbar status\n * @hidden\n\n */\n ToolbarStatus.get = function (docElement, rootNode, formatNode, fontSize, fontName, documentNode) {\n var formatCollection = JSON.parse(JSON.stringify(statusCollection));\n var nodeCollection = JSON.parse(JSON.stringify(statusCollection));\n var nodeSelection = new NodeSelection();\n var range = nodeSelection.getRange(docElement);\n var nodes = documentNode ? [documentNode] : range.collapsed ? nodeSelection.getNodeCollection(range) :\n nodeSelection.getSelectionNodeCollectionBr(range);\n var nodesLength = nodes.length;\n var isNodeChanged = false;\n for (var index = 0; index < nodes.length; index++) {\n while (nodes[index].nodeType === 3 && range.startContainer.nodeType === 3 && nodes[index].parentNode &&\n nodes[index].parentNode.lastElementChild && nodes[index].parentNode.lastElementChild.nodeName !== 'BR' &&\n (this.getImmediateBlockNode(nodes[index].parentNode)).textContent.replace(/\\u200B/g, '').length === 0 &&\n range.startContainer.textContent.replace(/\\u200B/g, '').length === 0 &&\n nodeSelection.get(docElement).toString().replace(/\\u200B/g, '').length === 0) {\n nodes[index] = nodes[index].parentNode.lastElementChild.firstChild;\n isNodeChanged = true;\n }\n if (isNodeChanged && nodes[index]) {\n nodeSelection.setCursorPoint(docElement, nodes[index], nodes[index].textContent.length);\n isNodeChanged = false;\n }\n if ((nodes[index].nodeName !== 'BR' && nodes[index].nodeType !== 3) ||\n (nodesLength > 1 && nodes[index].nodeType === 3 && nodes[index].textContent.trim() === '')) {\n nodes.splice(index, 1);\n index--;\n }\n }\n for (var index = 0; index < nodes.length; index++) {\n // eslint-disable-next-line max-len\n formatCollection = this.getFormatParent(docElement, formatCollection, nodes[index], rootNode, formatNode, fontSize, fontName);\n if ((index === 0 && formatCollection.bold) || !formatCollection.bold) {\n nodeCollection.bold = formatCollection.bold;\n }\n if ((index === 0 && formatCollection.insertcode) || !formatCollection.insertcode) {\n nodeCollection.insertcode = formatCollection.insertcode;\n }\n if ((index === 0 && formatCollection.italic) || !formatCollection.italic) {\n nodeCollection.italic = formatCollection.italic;\n }\n if ((index === 0 && formatCollection.underline) || !formatCollection.underline) {\n nodeCollection.underline = formatCollection.underline;\n }\n if ((index === 0 && formatCollection.strikethrough) || !formatCollection.strikethrough) {\n nodeCollection.strikethrough = formatCollection.strikethrough;\n }\n if ((index === 0 && formatCollection.superscript) || !formatCollection.superscript) {\n nodeCollection.superscript = formatCollection.superscript;\n }\n if ((index === 0 && formatCollection.subscript) || !formatCollection.subscript) {\n nodeCollection.subscript = formatCollection.subscript;\n }\n if ((index === 0 && formatCollection.fontcolor) || !formatCollection.fontcolor) {\n nodeCollection.fontcolor = formatCollection.fontcolor;\n }\n if (index === 0 && formatCollection.fontname) {\n nodeCollection.fontname = formatCollection.fontname;\n }\n else {\n nodeCollection.fontname = formatCollection.fontname === nodeCollection.fontname ? formatCollection.fontname : 'empty';\n }\n if (index === 0 && formatCollection.fontsize) {\n nodeCollection.fontsize = formatCollection.fontsize;\n }\n else {\n nodeCollection.fontsize = formatCollection.fontsize === nodeCollection.fontsize ? formatCollection.fontsize : 'empty';\n }\n if ((index === 0 && formatCollection.backgroundcolor) || !formatCollection.backgroundcolor) {\n nodeCollection.backgroundcolor = formatCollection.backgroundcolor;\n }\n if ((index === 0 && formatCollection.orderedlist) || !formatCollection.orderedlist) {\n nodeCollection.orderedlist = formatCollection.orderedlist;\n }\n if ((index === 0 && formatCollection.unorderedlist) || !formatCollection.unorderedlist) {\n nodeCollection.unorderedlist = formatCollection.unorderedlist;\n }\n if ((index === 0 && formatCollection.alignments) || !formatCollection.alignments) {\n nodeCollection.alignments = formatCollection.alignments;\n }\n if (index === 0 && formatCollection.formats) {\n nodeCollection.formats = formatCollection.formats;\n }\n else {\n nodeCollection.formats = formatCollection.formats === nodeCollection.formats ? formatCollection.formats : 'empty';\n }\n if ((index === 0 && formatCollection.createlink) || !formatCollection.createlink) {\n nodeCollection.createlink = formatCollection.createlink;\n }\n if ((index === 0 && formatCollection.numberFormatList) || !formatCollection.numberFormatList) {\n nodeCollection.numberFormatList = formatCollection.numberFormatList;\n }\n if ((index === 0 && formatCollection.bulletFormatList) || !formatCollection.bulletFormatList) {\n nodeCollection.bulletFormatList = formatCollection.bulletFormatList;\n }\n formatCollection = JSON.parse(JSON.stringify(statusCollection));\n }\n return nodeCollection;\n };\n ToolbarStatus.getImmediateBlockNode = function (node) {\n do {\n node = node.parentNode;\n } while (node && CONSTANT.BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) < 0);\n return node;\n };\n ToolbarStatus.getFormatParent = function (docElement, formatCollection, node, targetNode, formatNode, fontSize, fontName) {\n var isListUpdated = false;\n var isComplexListUpdated = false;\n if (targetNode.contains(node) ||\n (node.nodeType === 3 && targetNode.nodeType !== 3 && targetNode.contains(node.parentNode))) {\n do {\n formatCollection = this.isFormattedNode(docElement, formatCollection, node, isListUpdated, isComplexListUpdated, formatNode, fontSize, fontName);\n if (formatCollection.orderedlist || formatCollection.unorderedlist) {\n isListUpdated = true;\n }\n if (formatCollection.bulletFormatList || formatCollection.numberFormatList) {\n isComplexListUpdated = true;\n }\n node = node.parentNode;\n } while (node && (node !== targetNode));\n }\n return formatCollection;\n };\n ToolbarStatus.isFormattedNode = function (docElement, formatCollection, node, isListUpdated, isComplexListUpdated, formatNode, fontSize, fontName) {\n if (!formatCollection.bold) {\n formatCollection.bold = IsFormatted.isBold(node);\n }\n if (!formatCollection.italic) {\n formatCollection.italic = IsFormatted.isItalic(node);\n }\n if (!formatCollection.underline) {\n formatCollection.underline = IsFormatted.isUnderline(node);\n }\n if (!formatCollection.strikethrough) {\n formatCollection.strikethrough = IsFormatted.isStrikethrough(node);\n }\n if (!formatCollection.superscript) {\n formatCollection.superscript = IsFormatted.isSuperscript(node);\n }\n if (!formatCollection.subscript) {\n formatCollection.subscript = IsFormatted.isSubscript(node);\n }\n if (!formatCollection.fontcolor) {\n formatCollection.fontcolor = this.isFontColor(docElement, node);\n }\n if (!formatCollection.fontname) {\n formatCollection.fontname = this.isFontName(docElement, node, fontName);\n }\n if (!formatCollection.fontsize) {\n formatCollection.fontsize = this.isFontSize(docElement, node, fontSize);\n }\n if (!formatCollection.backgroundcolor) {\n formatCollection.backgroundcolor = this.isBackgroundColor(node);\n }\n if (!formatCollection.orderedlist && !isListUpdated) {\n formatCollection.orderedlist = this.isOrderedList(node);\n }\n if (!formatCollection.unorderedlist && !isListUpdated) {\n formatCollection.unorderedlist = this.isUnorderedList(node);\n }\n if (!formatCollection.alignments) {\n formatCollection.alignments = this.isAlignment(node);\n }\n if (!formatCollection.formats) {\n formatCollection.formats = this.isFormats(node, formatNode);\n if (formatCollection.formats === 'pre') {\n formatCollection.insertcode = true;\n }\n }\n if (!formatCollection.createlink) {\n formatCollection.createlink = this.isLink(node);\n }\n if (!formatCollection.numberFormatList && !isComplexListUpdated) {\n formatCollection.numberFormatList = this.isNumberFormatList(node);\n }\n if (!formatCollection.bulletFormatList && !isComplexListUpdated) {\n formatCollection.bulletFormatList = this.isBulletFormatList(node);\n }\n return formatCollection;\n };\n ToolbarStatus.isFontColor = function (docElement, node) {\n var color = node.style && node.style.color;\n if ((color === null || color === undefined || color === '') && node.nodeType !== 3) {\n color = this.getComputedStyle(docElement, node, 'color');\n }\n if (color !== null && color !== '' && color !== undefined) {\n return color;\n }\n else {\n return null;\n }\n };\n ToolbarStatus.isLink = function (node) {\n if (node.nodeName.toLocaleLowerCase() === 'a') {\n return true;\n }\n else {\n return false;\n }\n };\n ToolbarStatus.isBackgroundColor = function (node) {\n var backColor = node.style && node.style.backgroundColor;\n if (backColor !== null && backColor !== '' && backColor !== undefined) {\n return backColor;\n }\n else {\n return null;\n }\n };\n ToolbarStatus.isFontSize = function (docElement, node, fontSize) {\n var size = node.style && node.style.fontSize;\n if ((size === null || size === undefined || size === '') && node.nodeType !== 3 &&\n node.parentElement.classList.contains('e-content')) {\n size = this.getComputedStyle(docElement, node, 'font-size');\n }\n if ((size !== null && size !== '' && size !== undefined)\n && (fontSize === null || fontSize === undefined || (fontSize.indexOf(size) > -1))) {\n return size;\n }\n else {\n return null;\n }\n };\n ToolbarStatus.isFontName = function (docElement, node, fontName) {\n var name = node.style && node.style.fontFamily;\n if ((name === null || name === undefined || name === '') && node.nodeType !== 3) {\n name = this.getComputedStyle(docElement, node, 'font-family');\n }\n var index = null;\n if ((name !== null && name !== '' && name !== undefined)\n && (fontName === null || fontName === undefined || (fontName.filter(function (value, pos) {\n // eslint-disable-next-line\n var pattern = new RegExp(name, 'i');\n if ((value.replace(/\"/g, '').replace(/ /g, '').toLowerCase() === name.replace(/\"/g, '').replace(/ /g, '').toLowerCase()) ||\n (value.split(',')[0] && !isNullOrUndefined(value.split(',')[0].trim().match(pattern)) &&\n value.split(',')[0].trim() === value.split(',')[0].trim().match(pattern)[0])) {\n index = pos;\n }\n }) && (index !== null)))) {\n // eslint-disable-next-line\n return (index !== null) ? fontName[index] : name.replace(/\"/g, '');\n }\n else {\n return null;\n }\n };\n ToolbarStatus.isOrderedList = function (node) {\n if (node.nodeName.toLocaleLowerCase() === 'ol') {\n return true;\n }\n else {\n return false;\n }\n };\n ToolbarStatus.isUnorderedList = function (node) {\n if (node.nodeName.toLocaleLowerCase() === 'ul') {\n return true;\n }\n else {\n return false;\n }\n };\n ToolbarStatus.isAlignment = function (node) {\n var align = node.style && node.style.textAlign;\n if (align === 'left') {\n return 'justifyleft';\n }\n else if (align === 'center') {\n return 'justifycenter';\n }\n else if (align === 'right') {\n return 'justifyright';\n }\n else if (align === 'justify') {\n return 'justifyfull';\n }\n else {\n return null;\n }\n };\n ToolbarStatus.isFormats = function (node, formatNode) {\n if (((formatNode === undefined || formatNode === null)\n && CONSTANT.BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) > -1)\n || (formatNode !== null && formatNode !== undefined\n && formatNode.indexOf(node.nodeName.toLocaleLowerCase()) > -1)) {\n return node.nodeName.toLocaleLowerCase();\n }\n else {\n return null;\n }\n };\n ToolbarStatus.getComputedStyle = function (docElement, node, prop) {\n return docElement.defaultView.getComputedStyle(node, null).getPropertyValue(prop);\n };\n ToolbarStatus.isNumberFormatList = function (node) {\n var list = node.style && node.style.listStyleType;\n if (list === 'lower-alpha') {\n return 'Lower Alpha';\n }\n else if (list === 'number') {\n return 'Number';\n }\n else if (list === 'upper-alpha') {\n return 'Upper Alpha';\n }\n else if (list === 'lower-roman') {\n return 'Lower Roman';\n }\n else if (list === 'upper-roman') {\n return 'Upper Roman';\n }\n else if (list === 'lower-greek') {\n return 'Lower Greek';\n }\n else if (list === 'none') {\n return 'None';\n }\n else if (this.isOrderedList(node)) {\n return true;\n }\n else {\n return null;\n }\n };\n ToolbarStatus.isBulletFormatList = function (node) {\n var list = node.style && node.style.listStyleType;\n if (list === 'circle') {\n return 'Circle';\n }\n else if (list === 'square') {\n return 'Square';\n }\n else if (list === 'none') {\n return 'None';\n }\n else if (list === 'disc') {\n return 'Disc';\n }\n else if (this.isUnorderedList(node)) {\n return true;\n }\n else {\n return null;\n }\n };\n return ToolbarStatus;\n}());\nexport { ToolbarStatus };\n","import { addClass, Browser, removeClass, formatUnit, isNullOrUndefined, isNullOrUndefined as isNOU, EventHandler } from '@syncfusion/ej2-base';\nimport { getInstance, closest, selectAll } from '@syncfusion/ej2-base';\nimport { Toolbar } from '@syncfusion/ej2-navigations';\nimport { DropDownButton } from '@syncfusion/ej2-splitbuttons';\nimport { Popup, Tooltip } from '@syncfusion/ej2-popups';\nimport * as classes from '../base/classes';\nimport * as events from '../base/constant';\nimport { CLS_TOOLBAR, CLS_DROPDOWN_BTN, CLS_RTE_ELEMENTS, CLS_TB_BTN, CLS_INLINE_DROPDOWN, CLS_COLOR_CONTENT, CLS_FONT_COLOR_DROPDOWN, CLS_BACKGROUND_COLOR_DROPDOWN, CLS_COLOR_PALETTE, CLS_FONT_COLOR_PICKER, CLS_BACKGROUND_COLOR_PICKER, CLS_CUSTOM_TILE, CLS_NOCOLOR_ITEM, CLS_BULLETFORMATLIST_TB_BTN, CLS_NUMBERFORMATLIST_TB_BTN, CLS_LIST_PRIMARY_CONTENT } from '../base/classes';\nimport { ColorPicker } from '@syncfusion/ej2-inputs';\nimport { hasClass } from '../base/util';\nimport { ToolbarStatus } from '../../editor-manager/plugin/toolbar-status';\n/**\n * `Toolbar renderer` module is used to render toolbar in RichTextEditor.\n *\n * @hidden\n\n */\nvar ToolbarRenderer = /** @class */ (function () {\n /**\n * Constructor for toolbar renderer module\n *\n * @param {IRichTextEditor} parent - specifies the parent element.\n * @param {ServiceLocator} serviceLocator - specifies the serviceLocator\n */\n function ToolbarRenderer(parent, serviceLocator) {\n this.parent = parent;\n if (serviceLocator) {\n this.l10n = serviceLocator.getService('rteLocale');\n }\n this.wireEvent();\n }\n ToolbarRenderer.prototype.wireEvent = function () {\n this.parent.on(events.destroy, this.unWireEvent, this);\n this.parent.on(events.destroyTooltip, this.destroyTooltip, this);\n this.parent.on(events.closeTooltip, this.closeTooltip, this);\n };\n ToolbarRenderer.prototype.destroyTooltip = function () {\n var currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :\n this.parent.contentModule.getDocument();\n if (!isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap')) && !isNullOrUndefined(currentDocument.querySelector('[data-tooltip-id]'))) {\n var tooltipTargetEle = currentDocument.querySelector('[data-tooltip-id]');\n var event_1 = new MouseEvent('mouseleave', { bubbles: true, cancelable: true });\n tooltipTargetEle.dispatchEvent(event_1);\n }\n };\n ToolbarRenderer.prototype.unWireEvent = function () {\n this.parent.off(events.destroy, this.unWireEvent);\n this.parent.off(events.destroyTooltip, this.destroyTooltip);\n this.parent.off(events.closeTooltip, this.closeTooltip);\n };\n ToolbarRenderer.prototype.toolbarBeforeCreate = function (e) {\n if (this.mode === 'Extended') {\n e.enableCollision = false;\n }\n };\n ToolbarRenderer.prototype.toolbarCreated = function () {\n this.parent.notify(events.toolbarCreated, this);\n };\n ToolbarRenderer.prototype.toolbarClicked = function (args) {\n if (!this.parent.enabled) {\n return;\n }\n this.parent.trigger('toolbarClick', args);\n if (!this.parent.readonly || isNullOrUndefined(args.item)) {\n this.parent.notify(events.toolbarClick, args);\n }\n };\n ToolbarRenderer.prototype.dropDownSelected = function (args) {\n this.parent.notify(events.dropDownSelect, { element: args.element, item: args.item, originalEvent: args.event });\n this.destroyTooltip();\n };\n ToolbarRenderer.prototype.beforeDropDownItemRender = function (args) {\n if (this.parent.readonly || !this.parent.enabled) {\n return;\n }\n this.parent.notify(events.beforeDropDownItemRender, args);\n };\n ToolbarRenderer.prototype.tooltipBeforeRender = function (args) {\n if (!isNOU(args.target.getAttribute('title'))) {\n var tooltipTarget = args.target.getAttribute('title');\n var tooltipText = void 0;\n switch (tooltipTarget) {\n case 'Minimize':\n tooltipText = this.l10n.getConstant('minimize');\n args.target.setAttribute('title', tooltipText + ' (Esc)');\n break;\n case 'Maximize':\n tooltipText = this.l10n.getConstant('maximize');\n args.target.setAttribute('title', tooltipText + ' (Ctrl+Shift+F)');\n break;\n }\n }\n if (args.target.querySelector('.e-active')) {\n args.cancel = true;\n }\n };\n ToolbarRenderer.prototype.dropDownOpen = function (args) {\n if (args.element.parentElement.getAttribute('id').indexOf('TableCell') > -1 && !isNOU(args.element.parentElement.querySelector('.e-cell-merge')) &&\n (!isNOU(args.element.parentElement.querySelector('.e-cell-horizontal-split')) || !isNOU(args.element.parentElement.querySelector('.e-cell-vertical-split')))) {\n var listEle = args.element.querySelectorAll('li');\n var selectedEles_1 = this.parent.inputElement.querySelectorAll('.e-cell-select');\n if (selectedEles_1.length === 1) {\n addClass([listEle[0]], 'e-disabled');\n removeClass([listEle[1], listEle[2]], 'e-disabled');\n }\n else if (selectedEles_1.length > 1) {\n if (!Array.from(selectedEles_1).every(function (element) {\n return element.tagName.toLowerCase() === selectedEles_1[0].tagName.toLowerCase();\n })) {\n addClass([listEle[0]], 'e-disabled');\n }\n else {\n removeClass([listEle[0]], 'e-disabled');\n }\n addClass([listEle[1], listEle[2]], 'e-disabled');\n }\n }\n this.parent.notify(events.selectionSave, args);\n };\n ToolbarRenderer.prototype.dropDownClose = function (args) {\n this.parent.notify(events.selectionRestore, args);\n };\n /**\n * renderToolbar method\n *\n * @param {IToolbarOptions} args - specifies the arguments.\n * @returns {void}\n * @hidden\n\n */\n ToolbarRenderer.prototype.renderToolbar = function (args) {\n this.setPanel(args.target);\n this.renderPanel();\n this.mode = args.overflowMode;\n args.rteToolbarObj.toolbarObj = new Toolbar({\n items: args.items,\n width: '100%',\n overflowMode: args.overflowMode,\n beforeCreate: this.toolbarBeforeCreate.bind(this),\n created: this.toolbarCreated.bind(this),\n clicked: this.toolbarClicked.bind(this),\n enablePersistence: args.enablePersistence,\n enableRtl: args.enableRtl,\n cssClass: args.cssClass\n });\n args.rteToolbarObj.toolbarObj.isStringTemplate = true;\n args.rteToolbarObj.toolbarObj.createElement = this.parent.createElement;\n args.rteToolbarObj.toolbarObj.appendTo(args.target);\n if (this.parent.showTooltip) {\n this.tooltip = new Tooltip({\n target: '#' + this.parent.getID() + '_toolbar_wrapper [title]',\n showTipPointer: true,\n openDelay: 400,\n opensOn: 'Hover',\n beforeRender: this.tooltipBeforeRender.bind(this),\n beforeOpen: this.tooltipBeforeOpen.bind(this),\n cssClass: this.parent.getCssClass(),\n windowCollision: true,\n position: 'BottomCenter'\n });\n this.tooltip.appendTo(args.target.parentElement);\n }\n };\n /**\n * renderDropDownButton method\n *\n * @param {IDropDownModel} args - specifies the the arguments.\n * @returns {void}\n * @hidden\n\n */\n ToolbarRenderer.prototype.renderDropDownButton = function (args) {\n var _this = this;\n var css;\n args.element.classList.add(CLS_DROPDOWN_BTN);\n css = args.cssClass + ' ' + CLS_RTE_ELEMENTS + ' ' + CLS_TB_BTN;\n if (this.parent.inlineMode.enable && Browser.isDevice) {\n css = css + ' ' + CLS_INLINE_DROPDOWN;\n }\n // eslint-disable-next-line\n var proxy = this;\n var dropDown = new DropDownButton({\n items: args.items,\n iconCss: args.iconCss,\n cssClass: css,\n content: args.content,\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl,\n select: this.dropDownSelected.bind(this),\n beforeOpen: function (args) {\n if (proxy.parent.readonly || !proxy.parent.enabled) {\n args.cancel = true;\n return;\n }\n // eslint-disable-next-line\n // Table styles dropdown preselect\n if (proxy.parent.editorMode !== 'Markdown') {\n var startNode = proxy.parent.getRange().startContainer.parentElement;\n var tableEle = startNode.closest('table');\n var trow = startNode.closest('tr');\n if (!isNOU(tableEle) && tableEle.classList.contains('e-dashed-border')) {\n for (var index = 0; index < args.element.childNodes.length; index++) {\n if (args.element.childNodes[index].classList.contains('e-dashed-borders')) {\n addClass([args.element.childNodes[index]], 'e-active');\n }\n }\n }\n else if (!isNOU(tableEle) && !tableEle.classList.contains('e-dashed-border') && tableEle.classList.contains('e-alternate-rows') && window.getComputedStyle(trow).backgroundColor !== '') {\n for (var index = 0; index < args.element.childNodes.length; index++) {\n if (args.element.childNodes[index].classList.contains('e-alternate-rows')) {\n addClass([args.element.childNodes[index]], 'e-active');\n }\n }\n }\n //Alignments preselect\n var alignEle = proxy.parent.getRange().startContainer;\n while (alignEle !== proxy.parent.inputElement && !isNOU(alignEle.parentElement)) {\n if (alignEle.nodeName === '#text') {\n alignEle = alignEle.parentElement;\n }\n var alignStyle = window.getComputedStyle(alignEle).textAlign;\n if (args.items[0].command === 'Alignments') {\n if ((args.items[0].text === 'Align Left' && (alignStyle === 'left') || alignStyle === 'start')) {\n addClass([args.element.childNodes[0]], 'e-active');\n break;\n }\n else if (args.items[1].text === 'Align Center' && alignStyle === 'center') {\n addClass([args.element.childNodes[1]], 'e-active');\n break;\n }\n else if (args.items[2].text === 'Align Right' && alignStyle === 'right') {\n addClass([args.element.childNodes[2]], 'e-active');\n break;\n }\n else if (args.items[3].text === 'Align Justify' && alignStyle === 'justify') {\n addClass([args.element.childNodes[3]], 'e-active');\n break;\n }\n }\n alignEle = alignEle.parentElement;\n }\n //image preselect\n var closestNode = startNode.closest('img');\n var imageEle = closestNode ? closestNode : startNode.querySelector('img');\n if (args.items[0].command === 'Images') {\n if (!isNOU(imageEle)) {\n var index = void 0;\n if (imageEle.classList.contains('e-imgleft') || imageEle.classList.contains('e-imginline')) {\n index = 0;\n }\n else if (imageEle.classList.contains('e-imgcenter') || imageEle.classList.contains('e-imgbreak')) {\n index = 1;\n }\n else if (imageEle.classList.contains('e-imgright')) {\n index = 2;\n }\n if (!isNOU(args.element.childNodes[index])) {\n addClass([args.element.childNodes[index]], 'e-active');\n }\n }\n }\n //Formats preselect\n if (args.items[0].command === 'Formats' || args.items[0].command === 'Font') {\n var fontName_1 = [];\n var formats_1 = [];\n _this.parent.format.types.forEach(function (item) {\n formats_1.push(item.value.toLocaleLowerCase());\n });\n _this.parent.fontFamily.items.forEach(function (item) {\n fontName_1.push(item.value);\n });\n var toolbarStatus = ToolbarStatus.get(_this.parent.contentModule.getDocument(), _this.parent.contentModule.getEditPanel(), formats_1, null, fontName_1);\n for (var index = 0; index < args.element.childNodes.length; index++) {\n var divNode = _this.parent.createElement('div');\n divNode.innerHTML = dropDown.content.trim();\n if ((divNode.textContent.trim() !== ''\n && args.element.childNodes[index].textContent.trim() === divNode.textContent.trim()) ||\n ((args.items[0].command === 'Formats' && !isNOU(toolbarStatus.formats) && _this.parent.format.types[index].value.toLowerCase() === toolbarStatus.formats.toLowerCase() && args.element.childNodes[index].classList.contains(_this.parent.format.types[index].cssClass))\n || (args.items[0].subCommand === 'FontName' && args.items[0].command === 'Font' && !isNOU(toolbarStatus.fontname) && !isNOU(_this.parent.fontFamily.items[index]) && _this.parent.fontFamily.items[index].value.toLowerCase() === toolbarStatus.fontname.toLowerCase() && args.element.childNodes[index].classList.contains(_this.parent.fontFamily.items[index].cssClass)))) {\n if (!args.element.childNodes[index].classList.contains('e-active')) {\n addClass([args.element.childNodes[index]], 'e-active');\n }\n }\n else {\n removeClass([args.element.childNodes[index]], 'e-active');\n }\n }\n }\n }\n proxy.parent.notify(events.beforeDropDownOpen, args);\n },\n close: this.dropDownClose.bind(this),\n open: this.dropDownOpen.bind(this),\n beforeItemRender: this.beforeDropDownItemRender.bind(this)\n });\n dropDown.isStringTemplate = true;\n dropDown.createElement = proxy.parent.createElement;\n dropDown.appendTo(args.element);\n args.element.tabIndex = -1;\n var popupElement = document.getElementById(dropDown.element.id + '-popup');\n popupElement.setAttribute('aria-owns', this.parent.getID());\n return dropDown;\n };\n ToolbarRenderer.prototype.mouseOutHandler = function () {\n if (!isNOU(this.tooltipTargetEle)) {\n this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));\n }\n else {\n var currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :\n this.parent.contentModule.getDocument();\n this.tooltipTargetEle = currentDocument.querySelector('[data-title]');\n this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));\n }\n this.tooltipTargetEle.removeAttribute('data-title');\n EventHandler.remove(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler);\n };\n ToolbarRenderer.prototype.closeTooltip = function (args) {\n var currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :\n this.parent.contentModule.getDocument();\n this.tooltipTargetEle = closest(args.target, '[data-tooltip-id]');\n if (!isNOU(this.tooltipTargetEle) && this.parent.showTooltip && !isNOU(currentDocument.querySelector('.e-tooltip-wrap'))) {\n this.destroyTooltip();\n if (!this.tooltipTargetEle.closest('.e-rte-quick-popup')) {\n this.tooltipTargetEle.setAttribute('data-title', this.tooltipTargetEle.getAttribute('title'));\n this.tooltipTargetEle.removeAttribute('title');\n EventHandler.add(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler, this);\n }\n }\n };\n /**\n * renderListDropDown method\n *\n * @param {IDropDownModel} args - specifies the the arguments.\n * @returns {void}\n * @hidden\n\n */\n ToolbarRenderer.prototype.renderListDropDown = function (args) {\n var _this = this;\n // eslint-disable-next-line\n var proxy = this;\n var css = CLS_RTE_ELEMENTS + ' ' + CLS_TB_BTN + ((this.parent.inlineMode) ? (' ' + CLS_INLINE_DROPDOWN) : '');\n css += (' ' + ((args.itemName === 'NumberFormatList') ? CLS_NUMBERFORMATLIST_TB_BTN : CLS_BULLETFORMATLIST_TB_BTN));\n var content = proxy.parent.createElement('span', { className: CLS_LIST_PRIMARY_CONTENT });\n var inlineEle = proxy.parent.createElement('span', { className: args.cssClass });\n content.appendChild(inlineEle);\n var dropDown = new DropDownButton({\n items: args.items,\n cssClass: css,\n content: args.content,\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl,\n select: this.dropDownSelected.bind(this),\n beforeOpen: function (args) {\n if (proxy.parent.editorMode !== 'Markdown') {\n var startNode = proxy.parent.getRange().startContainer.parentElement;\n var listElem = startNode.closest('LI');\n var currentLiElem = !isNOU(listElem) ? listElem.parentElement : null;\n if (!isNOU(currentLiElem) && (currentLiElem.nodeName === 'OL' || currentLiElem.nodeName === 'UL')) {\n if (currentLiElem.nodeName === 'UL' && args.items[0].subCommand === 'NumberFormatList') {\n addClass([args.element.childNodes[0]], 'e-active');\n }\n else if (currentLiElem.nodeName === 'OL' && args.items[0].subCommand === 'BulletFormatList') {\n addClass([args.element.childNodes[0]], 'e-active');\n }\n else {\n var currentListStyle = currentLiElem.style.listStyleType.split('-').join('').toLocaleLowerCase();\n currentListStyle = currentListStyle === 'decimal' ? 'number' : currentListStyle;\n for (var index = 0; index < args.element.childNodes.length; index++) {\n if (currentListStyle === args.element.childNodes[index].innerHTML.split(' ').join('').toLocaleLowerCase()) {\n addClass([args.element.childNodes[index]], 'e-active');\n break;\n }\n else if (currentListStyle === '' && args.element.childNodes[index].innerHTML !== 'None') {\n addClass([args.element.childNodes[index]], 'e-active');\n break;\n }\n }\n }\n }\n else {\n addClass([args.element.childNodes[0]], 'e-active');\n }\n }\n _this.closeTooltip({ target: args.event.target });\n if (proxy.parent.readonly || !proxy.parent.enabled) {\n args.cancel = true;\n return;\n }\n proxy.parent.notify(events.selectionRestore, {});\n var element = (args.event) ? args.event.target : null;\n proxy.currentElement = dropDown.element;\n proxy.currentDropdown = dropDown;\n if (args.event && args.event.type === 'click' && (element.classList.contains(CLS_LIST_PRIMARY_CONTENT)\n || element.parentElement.classList.contains(CLS_LIST_PRIMARY_CONTENT))) {\n args.cancel = true;\n return;\n }\n proxy.parent.notify(events.beforeDropDownOpen, args);\n },\n close: this.dropDownClose.bind(this),\n open: this.dropDownOpen.bind(this),\n beforeItemRender: this.beforeDropDownItemRender.bind(this)\n });\n dropDown.isStringTemplate = true;\n dropDown.createElement = proxy.parent.createElement;\n dropDown.appendTo(args.element);\n args.element.tabIndex = -1;\n args.element.setAttribute('role', 'button');\n var popupElement = document.getElementById(dropDown.element.id + '-popup');\n popupElement.setAttribute('aria-owns', this.parent.getID());\n if (args.element.childElementCount === 1) {\n dropDown.element.insertBefore(content, dropDown.element.querySelector('.e-caret'));\n }\n args.element.tabIndex = -1;\n dropDown.element.removeAttribute('type');\n dropDown.element.onmousedown = function () {\n proxy.parent.notify(events.selectionSave, {});\n };\n dropDown.element.onkeydown = function () {\n proxy.parent.notify(events.selectionSave, {});\n };\n return dropDown;\n };\n ToolbarRenderer.prototype.paletteSelection = function (dropDownArgs, currentElement) {\n var ele = dropDownArgs.element.querySelector('.e-control.e-colorpicker');\n var colorbox = [].slice.call(selectAll('.e-tile', ele.parentElement));\n removeClass(colorbox, 'e-selected');\n var style = currentElement.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor;\n (colorbox.filter(function (colorbox) {\n if (colorbox.style.backgroundColor === style) {\n addClass([colorbox], 'e-selected');\n }\n }));\n };\n /**\n * renderColorPickerDropDown method\n *\n * @param {IColorPickerModel} args - specifies the arguments.\n * @param {string} item - specifies the item.\n * @param {ColorPicker} colorPicker - specifies the colorpicker.\n * @param {string} defaultColor -specifies the defaultColor.\n * @returns {void}\n * @hidden\n\n */\n ToolbarRenderer.prototype.renderColorPickerDropDown = function (args, item, colorPicker, defaultColor) {\n var _this = this;\n // eslint-disable-next-line\n var proxy = this;\n var css = CLS_RTE_ELEMENTS + ' ' + CLS_TB_BTN + ((this.parent.inlineMode) ? (' ' + CLS_INLINE_DROPDOWN) : '');\n css += (' ' + ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_DROPDOWN : CLS_FONT_COLOR_DROPDOWN));\n css += this.parent.getCssClass(true);\n var content = proxy.parent.createElement('span', { className: CLS_COLOR_CONTENT });\n var inlineEle = proxy.parent.createElement('span', { className: args.cssClass });\n var range;\n var initialBackgroundColor = (isNullOrUndefined(defaultColor)) ? proxy.parent.backgroundColor.default : defaultColor;\n inlineEle.style.borderBottomColor = (item === 'backgroundcolor') ?\n initialBackgroundColor : proxy.parent.fontColor.default;\n content.appendChild(inlineEle);\n var dropDown = new DropDownButton({\n target: colorPicker.element.parentElement, cssClass: css,\n enablePersistence: this.parent.enablePersistence, enableRtl: this.parent.enableRtl,\n beforeOpen: function (dropDownArgs) {\n if (proxy.parent.readonly || !proxy.parent.enabled) {\n dropDownArgs.cancel = true;\n return;\n }\n var element = (dropDownArgs.event) ? dropDownArgs.event.target : null;\n proxy.currentElement = dropDown.element;\n proxy.currentDropdown = dropDown;\n proxy.paletteSelection(dropDownArgs, proxy.currentElement);\n if (dropDownArgs.event && dropDownArgs.event.type === 'click' && (element.classList.contains(CLS_COLOR_CONTENT)\n || element.parentElement.classList.contains(CLS_COLOR_CONTENT))) {\n dropDownArgs.cancel = true;\n var colorpickerValue = element.classList.contains(CLS_RTE_ELEMENTS) ? element.style.borderBottomColor :\n element.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor;\n proxy.parent.notify(events.selectionRestore, {});\n range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());\n var parentNode = range.startContainer.parentNode;\n var closestElement = closest(range.startContainer.parentNode, 'table');\n if ((range.startContainer.nodeName === 'TD' || range.startContainer.nodeName === 'TH' ||\n (closest(range.startContainer.parentNode, 'td,th')) ||\n (proxy.parent.iframeSettings.enable && !hasClass(parentNode.ownerDocument.querySelector('body'), 'e-lib')))\n && range.collapsed && args.subCommand === 'BackgroundColor' && closest(closestElement, '.' + classes.CLS_RTE)) {\n proxy.parent.notify(events.tableColorPickerChanged, {\n item: { command: args.command, subCommand: args.subCommand,\n value: colorpickerValue }\n });\n }\n else {\n proxy.parent.notify(events.colorPickerChanged, { item: { command: args.command, subCommand: args.subCommand,\n value: colorpickerValue }\n });\n }\n return;\n }\n else {\n var ele = dropDownArgs.element.querySelector('.e-control.e-colorpicker');\n var inst = getInstance(ele, ColorPicker);\n inst.showButtons = (dropDownArgs.element.querySelector('.e-color-palette')) ? false : true;\n inst.dataBind();\n }\n dropDownArgs.element.onclick = function (args) {\n if (args.target.classList.contains('e-cancel')) {\n dropDown.toggle();\n }\n };\n },\n open: function (dropDownArgs) {\n _this.setColorPickerContentWidth(colorPicker);\n var focusEle;\n var ele = dropDownArgs.element.querySelector('.e-control.e-colorpicker');\n if (dropDownArgs.element.querySelector('.e-color-palette')) {\n focusEle = ele.parentElement.querySelector('.e-palette');\n }\n else {\n focusEle = ele.parentElement.querySelector('e-handler');\n }\n if (focusEle) {\n focusEle.focus();\n }\n _this.pickerRefresh(dropDownArgs);\n },\n beforeClose: function (dropDownArgs) {\n var element = (dropDownArgs.event) ? dropDownArgs.event.target : null;\n if (dropDownArgs.event && dropDownArgs.event.type === 'click' && (element.classList.contains(CLS_COLOR_CONTENT)\n || element.parentElement.classList.contains(CLS_COLOR_CONTENT))) {\n var colorpickerValue = element.classList.contains(CLS_RTE_ELEMENTS) ? element.style.borderBottomColor :\n element.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor;\n range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());\n if ((range.startContainer.nodeName === 'TD' || range.startContainer.nodeName === 'TH' ||\n closest(range.startContainer.parentNode, 'td,th')) && range.collapsed) {\n proxy.parent.notify(events.tableColorPickerChanged, { item: {\n command: args.command, subCommand: args.subCommand,\n value: colorpickerValue\n }\n });\n }\n else {\n proxy.parent.notify(events.colorPickerChanged, { item: { command: args.command, subCommand: args.subCommand,\n value: colorpickerValue }\n });\n }\n return;\n }\n },\n close: function (dropDownArgs) {\n proxy.parent.notify(events.selectionRestore, {});\n }\n });\n dropDown.isStringTemplate = true;\n dropDown.createElement = proxy.parent.createElement;\n args.element.setAttribute('role', 'button');\n dropDown.appendTo(args.element);\n var popupElement = document.getElementById(dropDown.element.id + '-popup');\n popupElement.setAttribute('aria-owns', this.parent.getID());\n dropDown.element.insertBefore(content, dropDown.element.querySelector('.e-caret'));\n args.element.tabIndex = -1;\n dropDown.element.removeAttribute('type');\n dropDown.element.onmousedown = function () {\n proxy.parent.notify(events.selectionSave, {});\n };\n dropDown.element.onkeydown = function () {\n proxy.parent.notify(events.selectionSave, {});\n };\n return dropDown;\n };\n ToolbarRenderer.prototype.pickerRefresh = function (dropDownArgs) {\n if (this.parent.backgroundColor.mode === 'Picker') {\n var popupElem = dropDownArgs.element.parentElement;\n popupElem.style.width = (popupElem.offsetWidth + 5).toString() + 'px';\n getInstance(popupElem, Popup).refreshPosition(popupElem);\n popupElem.style.width = (popupElem.offsetWidth - 5).toString() + 'px';\n }\n };\n ToolbarRenderer.prototype.setColorPickerContentWidth = function (colorPicker) {\n var colorPickerContent = colorPicker.element.nextSibling;\n if (colorPickerContent.style.width === '0px') {\n colorPickerContent.style.width = '';\n var borderWidth = parseInt(getComputedStyle(colorPickerContent).borderBottomWidth, 10);\n colorPickerContent.style.width = formatUnit(colorPickerContent.children[0].offsetWidth\n + borderWidth + borderWidth);\n }\n };\n /**\n * renderColorPicker method\n *\n * @param {IColorPickerModel} args - specifies the arguments\n * @param {string} item - specifies the string values\n * @returns {void}\n * @hidden\n\n */\n ToolbarRenderer.prototype.renderColorPicker = function (args, item) {\n var _this = this;\n // eslint-disable-next-line\n var proxy = this;\n var value;\n var colorPicker = new ColorPicker({\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl,\n inline: true,\n value: null,\n cssClass: ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass + ' ' + 'e-rte-picker-init',\n created: function () {\n var value = (item === 'backgroundcolor') ? proxy.parent.backgroundColor.default : proxy.parent.fontColor.default;\n colorPicker.cssClass = ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass;\n colorPicker.value = value;\n },\n mode: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.mode : proxy.parent.fontColor.mode),\n modeSwitcher: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.modeSwitcher : proxy.parent.fontColor.modeSwitcher),\n presetColors: (item === 'backgroundcolor') ? this.parent.backgroundColor.colorCode : this.parent.fontColor.colorCode,\n columns: (item === 'backgroundcolor') ? this.parent.backgroundColor.columns : this.parent.fontColor.columns,\n beforeTileRender: function (args) {\n args.element.classList.add(CLS_COLOR_PALETTE);\n args.element.classList.add(CLS_CUSTOM_TILE);\n if (!isNullOrUndefined(_this.parent.cssClass)) {\n var allClassName = _this.parent.getCssClass().split(' ');\n for (var i = 0; i < allClassName.length; i++) {\n if (allClassName[i].trim() !== '') {\n args.element.classList.add(allClassName[i]);\n }\n }\n }\n if (args.value === '') {\n args.element.classList.add(CLS_NOCOLOR_ITEM);\n }\n },\n change: function (colorPickerArgs) {\n var colorpickerValue = colorPickerArgs.currentValue.rgba;\n colorPickerArgs.item = {\n command: args.command,\n subCommand: args.subCommand,\n value: colorpickerValue\n };\n proxy.parent.notify(events.selectionRestore, {});\n proxy.currentElement.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor = colorpickerValue;\n var range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());\n var closestElement = closest(range.startContainer.parentNode, 'table');\n if ((range.startContainer.nodeName === 'TD' || range.startContainer.nodeName === 'TH' || range.startContainer.nodeName === 'BODY' ||\n closest(range.startContainer.parentNode, 'td,th')) && range.collapsed && args.subCommand === 'BackgroundColor' && closest(closestElement, '.' + classes.CLS_RTE)) {\n proxy.parent.notify(events.tableColorPickerChanged, colorPickerArgs);\n }\n else {\n proxy.parent.notify(events.colorPickerChanged, colorPickerArgs);\n }\n proxy.currentDropdown.toggle();\n },\n beforeModeSwitch: function (args) {\n value = colorPicker.value;\n if (value === '') {\n colorPicker.setProperties({ value: ((args.mode === 'Picker') ? '#008000ff' : '') }, true);\n }\n colorPicker.showButtons = args.mode === 'Palette' ? false : true;\n }\n });\n colorPicker.isStringTemplate = true;\n colorPicker.createElement = this.parent.createElement;\n colorPicker.appendTo(document.getElementById(args.target));\n return colorPicker;\n };\n ToolbarRenderer.prototype.tooltipBeforeOpen = function (args) {\n if (args.element) {\n args.element.setAttribute('data-rte-id', this.parent.getID());\n }\n };\n /**\n * The function is used to render Rich Text Editor toolbar\n *\n * @returns {void}\n * @hidden\n\n */\n ToolbarRenderer.prototype.renderPanel = function () {\n this.getPanel().classList.add(CLS_TOOLBAR);\n };\n /**\n * Get the toolbar element of RichTextEditor\n *\n * @returns {Element} - specifies the element.\n * @hidden\n\n */\n ToolbarRenderer.prototype.getPanel = function () {\n return this.toolbarPanel;\n };\n /**\n * Set the toolbar element of RichTextEditor\n *\n * @returns {void}\n * @param {Element} panel - specifies the element.\n * @hidden\n\n */\n ToolbarRenderer.prototype.setPanel = function (panel) {\n this.toolbarPanel = panel;\n };\n return ToolbarRenderer;\n}());\nexport { ToolbarRenderer };\n","import { RenderType } from '../base/enum';\nimport { CLS_HR_SEPARATOR } from '../base/classes';\nimport * as events from '../base/constant';\nimport { getTooltipText, toObjectLowerCase } from '../base/util';\nimport { tools, templateItems, windowKeys } from '../models/items';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\n/**\n * `Toolbar` module is used to handle Toolbar actions.\n */\nvar BaseToolbar = /** @class */ (function () {\n function BaseToolbar(parent, serviceLocator) {\n this.tools = {};\n this.parent = parent;\n this.locator = serviceLocator;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.addEventListener();\n if (this.parent.toolbarSettings && Object.keys(this.parent.toolbarSettings.itemConfigs).length > 0) {\n extend(this.tools, tools, toObjectLowerCase(this.parent.toolbarSettings.itemConfigs), true);\n }\n else {\n this.tools = tools;\n }\n }\n BaseToolbar.prototype.addEventListener = function () {\n this.parent.on(events.rtlMode, this.setRtl, this);\n this.parent.on(events.bindCssClass, this.setCssClass, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n BaseToolbar.prototype.removeEventListener = function () {\n this.parent.off(events.rtlMode, this.setRtl);\n this.parent.off(events.bindCssClass, this.setCssClass);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n BaseToolbar.prototype.setCssClass = function (e) {\n if (!isNullOrUndefined(this.toolbarObj)) {\n if (isNullOrUndefined(e.oldCssClass)) {\n this.toolbarObj.setProperties({ cssClass: (this.toolbarObj.cssClass + ' ' + e.cssClass).trim() });\n }\n else {\n this.toolbarObj.setProperties({ cssClass: (this.toolbarObj.cssClass.replace(e.oldCssClass, '').trim() + ' ' + e.cssClass).trim() });\n }\n }\n };\n BaseToolbar.prototype.setRtl = function (args) {\n if (!isNullOrUndefined(this.toolbarObj)) {\n this.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n };\n BaseToolbar.prototype.getClass = function (item) {\n var classes;\n switch (item) {\n case 'fontsize':\n classes = 'e-rte-inline-size-template';\n break;\n case 'fontcolor':\n case 'backgroundcolor':\n classes = 'e-rte-inline-color-template';\n break;\n default:\n classes = 'e-rte-inline-template';\n break;\n }\n return classes;\n };\n BaseToolbar.prototype.getTemplateObject = function (itemStr, container) {\n var tagName;\n switch (itemStr) {\n case 'fontcolor':\n case 'backgroundcolor':\n case 'numberformatlist':\n case 'bulletformatlist':\n tagName = 'span';\n break;\n default:\n tagName = 'button';\n break;\n }\n return {\n command: this.tools[itemStr.toLocaleLowerCase()].command,\n subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand,\n template: this.parent.createElement(tagName, {\n id: this.parent.getID() + '_' + container\n + '_' + this.tools[itemStr.toLocaleLowerCase()].id\n }).outerHTML,\n cssClass: this.parent.inlineMode.enable ? this.getClass(itemStr) : '',\n tooltipText: getTooltipText(itemStr, this.locator)\n };\n };\n /**\n * getObject method\n *\n * @param {string} item - specifies the string value\n * @param {string} container - specifies the value of string\n * @returns {IToolbarItemModel} - returns the model element\n * @hidden\n\n */\n BaseToolbar.prototype.getObject = function (item, container) {\n var itemStr = item.toLowerCase();\n if (templateItems.indexOf(itemStr) !== -1) {\n return this.getTemplateObject(itemStr, container);\n }\n else {\n switch (itemStr) {\n case '|':\n return { type: 'Separator' };\n case '-':\n return { type: 'Separator', cssClass: CLS_HR_SEPARATOR };\n default:\n return {\n id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,\n prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,\n tooltipText: getTooltipText(itemStr, this.locator),\n command: this.tools[itemStr.toLocaleLowerCase()].command,\n subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand\n };\n }\n }\n };\n /**\n * @param {string} tbItems - specifies the string value\n * @param {string} container - specifies the container value\n * @returns {ItemModel} - retunrs the model element\n * @hidden\n\n */\n BaseToolbar.prototype.getItems = function (tbItems, container) {\n var _this = this;\n if (this.parent.toolbarSettings.items.length < 1) {\n return [];\n }\n var items = [];\n var _loop_1 = function (item) {\n switch (typeof item) {\n case 'string':\n items.push(this_1.getObject(item, container));\n break;\n default:\n if (!isNullOrUndefined(item.click)) {\n var proxy_1 = item;\n var callback_1 = proxy_1.click;\n proxy_1.click = function () {\n if (proxy_1.undo && _this.parent.formatter.getUndoRedoStack().length === 0) {\n _this.parent.formatter.saveData();\n }\n callback_1.call(_this);\n if (_this.parent.formatter.getUndoRedoStack().length > 0) {\n var currentContentElem = _this.parent.createElement('div');\n var stackItem = _this.parent.formatter.getUndoRedoStack()[_this.parent.formatter.getUndoRedoStack().length - 1];\n var clonedItem = (stackItem.text).cloneNode(true);\n currentContentElem.appendChild(clonedItem);\n if (currentContentElem.innerHTML.trim() === _this.parent.inputElement.innerHTML.trim()) {\n return;\n }\n }\n if (proxy_1.undo) {\n _this.parent.formatter.saveData();\n }\n };\n }\n items.push(item);\n }\n };\n var this_1 = this;\n for (var _i = 0, tbItems_1 = tbItems; _i < tbItems_1.length; _i++) {\n var item = tbItems_1[_i];\n _loop_1(item);\n }\n if (this.parent.showTooltip) {\n for (var num = 0; num < items.length; num++) {\n var tooltipText = items[num].tooltipText;\n var shortCutKey = void 0;\n var isMacDev = window.navigator.platform.toLocaleLowerCase().includes('mac');\n if (windowKeys[\"\" + tooltipText]) {\n shortCutKey = isMacDev ? windowKeys[\"\" + tooltipText].replace('Ctrl+', '⌘').replace('Shift+', '⇧').replace('Alt+', '⌥') : windowKeys[\"\" + tooltipText];\n }\n else {\n shortCutKey = tooltipText;\n }\n if (shortCutKey) {\n if (!(items[num].command === \"Images\" && items[num].subCommand === \"InsertLink\")) {\n items[num].tooltipText = (tooltipText !== shortCutKey) ? (isMacDev) ? shortCutKey : tooltipText + ' (' + shortCutKey + ')' : tooltipText;\n }\n }\n }\n }\n return items;\n };\n BaseToolbar.prototype.getToolbarOptions = function (args) {\n return {\n target: args.target,\n rteToolbarObj: this,\n items: this.getItems(args.items, args.container),\n overflowMode: args.mode,\n enablePersistence: this.parent.enablePersistence,\n enableRtl: this.parent.enableRtl,\n cssClass: args.cssClass\n };\n };\n /**\n * render method\n *\n * @param {IToolbarRenderOptions} args - specifies the toolbar options\n * @returns {void}\n * @hidden\n\n */\n BaseToolbar.prototype.render = function (args) {\n this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);\n this.toolbarRenderer.renderToolbar(this.getToolbarOptions(args));\n };\n return BaseToolbar;\n}());\nexport { BaseToolbar };\n","import { addClass, isNullOrUndefined, removeClass, select, closest } from '@syncfusion/ej2-base';\nimport { RenderType } from '../base/enum';\nimport { getIndex } from '../base/util';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { getDropDownValue, getFormattedFontSize, getTooltipText } from '../base/util';\nimport * as model from '../models/items';\nimport { dispatchEvent } from '../base/util';\n/**\n * `Toolbar` module is used to handle Toolbar actions.\n */\nvar DropDownButtons = /** @class */ (function () {\n function DropDownButtons(parent, serviceLocator) {\n this.parent = parent;\n this.locator = serviceLocator;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.addEventListener();\n }\n DropDownButtons.prototype.initializeInstance = function () {\n this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);\n };\n DropDownButtons.prototype.beforeRender = function (args) {\n var item = args.item;\n if (item.cssClass) {\n addClass([args.element], item.cssClass);\n }\n if (item.command === 'Alignments' || item.subCommand === 'JustifyLeft'\n || item.subCommand === 'JustifyRight' || item.subCommand === 'JustifyCenter') {\n args.element.setAttribute('title', getTooltipText(item.subCommand.toLocaleLowerCase(), this.locator));\n }\n };\n DropDownButtons.prototype.dropdownContent = function (width, type, content) {\n return ('' +\n '' + content + '');\n };\n /**\n * renderDropDowns method\n *\n * @param {IDropDownRenderArgs} args - specifies the arguments\n * @returns {void}\n * @hidden\n\n */\n DropDownButtons.prototype.renderDropDowns = function (args) {\n var _this = this;\n this.initializeInstance();\n var type = args.containerType;\n var tbElement = args.container;\n model.templateItems.forEach(function (item) {\n var targetElement = undefined;\n if (getIndex(item, args.items) !== -1) {\n switch (item) {\n case 'numberformatlist': {\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_NumberFormatList', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var formatOLItem = _this.parent.numberFormatList.types.slice();\n formatOLItem.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Lists', enumerable: true }, subCommand: { value: 'NumberFormatList', enumerable: true }\n });\n });\n _this.numberFormatListDropDown = _this.toolbarRenderer.renderListDropDown({\n cssClass: 'e-order-list' + ' ' + classes.CLS_RTE_ELEMENTS + ' ' + classes.CLS_ICONS,\n itemName: 'NumberFormatList', items: formatOLItem, element: targetElement\n });\n break;\n }\n case 'bulletformatlist': {\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_BulletFormatList', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var formatULItem = _this.parent.bulletFormatList.types.slice();\n formatULItem.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Lists', enumerable: true }, subCommand: { value: 'BulletFormatList', enumerable: true }\n });\n });\n _this.bulletFormatListDropDown = _this.toolbarRenderer.renderListDropDown({\n cssClass: 'e-unorder-list' + ' ' + classes.CLS_RTE_ELEMENTS + ' ' + classes.CLS_ICONS,\n itemName: 'BulletFormatList', items: formatULItem, element: targetElement\n });\n break;\n }\n case 'formats': {\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_Formats', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var formatItem = _this.parent.format.types.slice();\n formatItem.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Formats', enumerable: true }, subCommand: { value: item.value, enumerable: true }\n });\n });\n var formatContent = isNullOrUndefined(_this.parent.format.default) ? formatItem[0].text :\n _this.parent.format.default;\n _this.formatDropDown = _this.toolbarRenderer.renderDropDownButton({\n iconCss: ((type === 'quick') ? 'e-formats e-icons' : ''),\n content: _this.dropdownContent(_this.parent.format.width, type, ((type === 'quick') ? '' : getDropDownValue(formatItem, formatContent, 'text', 'text'))),\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_FORMATS_TB_BTN,\n itemName: 'Formats', items: formatItem, element: targetElement\n });\n break;\n }\n case 'fontname': {\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_FontName', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var fontItem = _this.parent.fontFamily.items.slice();\n fontItem.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Font', enumerable: true }, subCommand: { value: 'FontName', enumerable: true }\n });\n });\n var fontNameContent = isNullOrUndefined(_this.parent.fontFamily.default) ? fontItem[0].text :\n _this.parent.fontFamily.default;\n _this.fontNameDropDown = _this.toolbarRenderer.renderDropDownButton({\n iconCss: ((type === 'quick') ? 'e-font-name e-icons' : ''),\n content: _this.dropdownContent(_this.parent.fontFamily.width, type, ((type === 'quick') ? '' : getDropDownValue(fontItem, fontNameContent, 'text', 'text'))),\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_FONT_NAME_TB_BTN,\n itemName: 'FontName', items: fontItem, element: targetElement\n });\n if (!isNullOrUndefined(_this.parent.fontFamily.default)) {\n _this.getEditNode().style.fontFamily = _this.parent.fontFamily.default;\n }\n break;\n }\n case 'fontsize': {\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_FontSize', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n var fontsize = !isNullOrUndefined(_this.fontSizeDropDown) && !isNullOrUndefined(_this.fontSizeDropDown.items) && _this.fontSizeDropDown.items.length > 0 ? _this.fontSizeDropDown.items : JSON.parse(JSON.stringify(_this.parent.fontSize.items.slice()));\n fontsize.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: 'Font', enumerable: true }, subCommand: { value: 'FontSize', enumerable: true }\n });\n });\n var fontSizeContent = isNullOrUndefined(_this.parent.fontSize.default) ? fontsize[1].text :\n _this.parent.fontSize.default;\n _this.fontSizeDropDown = _this.toolbarRenderer.renderDropDownButton({\n content: _this.dropdownContent(_this.parent.fontSize.width, type, getFormattedFontSize(getDropDownValue(fontsize, fontSizeContent.replace(/\\s/g, ''), 'value', 'text'))),\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_FONT_SIZE_TB_BTN,\n itemName: 'FontSize', items: fontsize, element: targetElement\n });\n if (!isNullOrUndefined(_this.parent.fontSize.default)) {\n _this.getEditNode().style.fontSize = _this.parent.fontSize.default;\n }\n break;\n }\n case 'alignments':\n targetElement = select('#' + _this.parent.getID() + '_' + type + '_Alignments', tbElement);\n if (isNullOrUndefined(targetElement) || targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n _this.alignDropDown = _this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-justify-left e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_ALIGN_TB_BTN,\n itemName: 'Alignments', items: model.alignmentItems, element: targetElement\n });\n break;\n case 'align':\n case 'videoalign':\n _this.renderAlignmentDropDown(type, tbElement, targetElement, item);\n break;\n case 'display':\n case 'audiolayoutoption':\n case 'videolayoutoption':\n _this.renderDisplayDropDown(type, tbElement, targetElement, item);\n break;\n case 'tablerows':\n _this.rowDropDown(type, tbElement, targetElement);\n break;\n case 'tablecolumns':\n _this.columnDropDown(type, tbElement, targetElement);\n break;\n case 'tablecell':\n _this.cellDropDown(type, tbElement, targetElement);\n break;\n case 'tablecellverticalalign':\n _this.verticalAlignDropDown(type, tbElement, targetElement);\n break;\n case 'styles':\n _this.tableStylesDropDown(type, tbElement, targetElement);\n break;\n }\n }\n });\n if (this.parent.inlineMode.enable) {\n this.setCssClass({ cssClass: this.parent.getCssClass() });\n }\n };\n DropDownButtons.prototype.getUpdateItems = function (items, value) {\n var dropDownItems = items.slice();\n dropDownItems.forEach(function (item) {\n Object.defineProperties(item, {\n command: { value: (value === 'Format' ? 'Formats' : 'Font'), enumerable: true },\n subCommand: { value: (value === 'Format' ? item.value : value), enumerable: true }\n });\n });\n return dropDownItems;\n };\n DropDownButtons.prototype.onPropertyChanged = function (model) {\n var newProp = model.newProp;\n var type;\n var content;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'fontFamily':\n if (this.fontNameDropDown) {\n for (var _b = 0, _c = Object.keys(newProp.fontFamily); _b < _c.length; _b++) {\n var fontFamily = _c[_b];\n switch (fontFamily) {\n case 'default':\n case 'width': {\n var fontItems = this.fontNameDropDown.items;\n type = !isNullOrUndefined(closest(this.fontNameDropDown.element, '.' + classes.CLS_QUICK_TB)) ?\n 'quick' : 'toolbar';\n var fontNameContent = isNullOrUndefined(this.parent.fontFamily.default) ? fontItems[0].text :\n this.parent.fontFamily.default;\n content = this.dropdownContent(this.parent.fontFamily.width, type, ((type === 'quick') ? '' : getDropDownValue(fontItems, fontNameContent, 'text', 'text')));\n this.fontNameDropDown.setProperties({ content: content });\n if (!isNullOrUndefined(this.parent.fontFamily.default)) {\n this.getEditNode().style.fontFamily = this.parent.fontFamily.default;\n }\n else {\n this.getEditNode().style.removeProperty('font-family');\n }\n break;\n }\n case 'items':\n this.fontNameDropDown.setProperties({\n items: this.getUpdateItems(newProp.fontFamily.items, 'FontName')\n });\n break;\n }\n }\n }\n break;\n case 'fontSize':\n if (this.fontSizeDropDown) {\n for (var _d = 0, _e = Object.keys(newProp.fontSize); _d < _e.length; _d++) {\n var fontSize = _e[_d];\n switch (fontSize) {\n case 'default':\n case 'width': {\n var fontsize = this.fontSizeDropDown.items;\n type = !isNullOrUndefined(closest(this.fontSizeDropDown.element, '.' + classes.CLS_QUICK_TB)) ? 'quick' : 'toolbar';\n var fontSizeContent = isNullOrUndefined(this.parent.fontSize.default) ? fontsize[1].text :\n this.parent.fontSize.default;\n content = this.dropdownContent(this.parent.fontSize.width, type, getFormattedFontSize(getDropDownValue(fontsize, fontSizeContent.replace(/\\s/g, ''), 'value', 'text')));\n this.fontSizeDropDown.setProperties({ content: content });\n if (!isNullOrUndefined(this.parent.fontSize.default)) {\n this.getEditNode().style.fontSize = this.parent.fontSize.default;\n }\n else {\n this.getEditNode().style.removeProperty('font-size');\n }\n break;\n }\n case 'items':\n this.fontSizeDropDown.setProperties({\n items: this.getUpdateItems(newProp.fontSize.items, 'FontSize')\n });\n break;\n }\n }\n }\n break;\n case 'format':\n if (this.formatDropDown) {\n for (var _f = 0, _g = Object.keys(newProp.format); _f < _g.length; _f++) {\n var format = _g[_f];\n switch (format) {\n case 'default':\n case 'width': {\n var formatItems = this.formatDropDown.items;\n type = !isNullOrUndefined(closest(this.formatDropDown.element, '.' + classes.CLS_QUICK_TB)) ? 'quick' : 'toolbar';\n var formatContent = isNullOrUndefined(this.parent.format.default) ? formatItems[0].text :\n this.parent.format.default;\n content = this.dropdownContent(this.parent.format.width, type, ((type === 'quick') ? '' : getDropDownValue(formatItems, formatContent, 'text', 'text')));\n this.formatDropDown.setProperties({ content: content });\n break;\n }\n case 'types':\n this.formatDropDown.setProperties({\n items: this.getUpdateItems(newProp.format.types, 'Format')\n });\n break;\n }\n }\n }\n break;\n }\n }\n };\n DropDownButtons.prototype.getEditNode = function () {\n return this.parent.contentModule.getEditPanel();\n };\n DropDownButtons.prototype.rowDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_TableRows', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.tableRowsDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-table-rows e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'TableRows',\n items: model.tableRowsItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.columnDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_TableColumns', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.tableColumnsDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-table-columns e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'TableColumns',\n items: model.tableColumnsItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.cellDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_TableCell', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.tableCellDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-table-cell e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'TableCell',\n items: model.tableCellItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.verticalAlignDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_TableCellVerticalAlign', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.tableCellVerticalAlignDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-table-cell-ver-align e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'TableCellVerticalAlign',\n items: model.TableCellVerticalAlignItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.renderDisplayDropDown = function (type, tbElement, targetElement, item) {\n targetElement = select('#' + this.parent.getID() + '_' + type + (item === 'display' ? '_Display' : item === 'videolayoutoption' ? '_VideoLayoutOption' : '_AudioLayoutOption'), tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.displayDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: item === 'display' ? 'e-display e-icons' : item === 'videolayoutoption' ? 'e-video-display e-icons' : 'e-audio-display e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ITEMS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: item === 'display' ? 'Display' : item === 'videolayoutoption' ? 'VideoLayoutOption' : 'AudioLayoutOption',\n items: item === 'display' ? model.imageDisplayItems : item === 'videolayoutoption' ? model.videoLayoutOptionItems : model.audioLayoutOptionItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.renderAlignmentDropDown = function (type, tbElement, targetElement, item) {\n targetElement = select('#' + this.parent.getID() + '_' + type + (item === 'align' ? '_Align' : '_VideoAlign'), tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.imageAlignDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-justify-left e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ICONS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: item === 'align' ? 'Align' : 'VideoAlign',\n items: item === 'align' ? model.imageAlignItems : model.videoAlignItems,\n element: targetElement\n });\n };\n DropDownButtons.prototype.tableStylesDropDown = function (type, tbElement, targetElement) {\n targetElement = select('#' + this.parent.getID() + '_' + type + '_Styles', tbElement);\n if (targetElement.classList.contains(classes.CLS_DROPDOWN_BTN)) {\n return;\n }\n this.imageAlignDropDown = this.toolbarRenderer.renderDropDownButton({\n iconCss: 'e-style e-icons',\n cssClass: classes.CLS_DROPDOWN_POPUP + ' ' + classes.CLS_DROPDOWN_ICONS + ' ' + classes.CLS_QUICK_DROPDOWN,\n itemName: 'Styles',\n items: this.parent.tableSettings.styles,\n element: targetElement\n });\n };\n DropDownButtons.prototype.removeDropDownClasses = function (target) {\n removeClass([target], [\n classes.CLS_DROPDOWN_BTN,\n classes.CLS_DROPDOWN_POPUP,\n classes.CLS_DROPDOWN_ICONS,\n classes.CLS_DROPDOWN_ITEMS\n ]);\n };\n /**\n * destroyDropDowns method\n *\n * @returns {void}\n * @hidden\n\n */\n DropDownButtons.prototype.destroyDropDowns = function () {\n if (this.formatDropDown) {\n this.removeDropDownClasses(this.formatDropDown.element);\n this.formatDropDown.destroy();\n }\n if (this.fontNameDropDown) {\n this.removeDropDownClasses(this.fontNameDropDown.element);\n this.fontNameDropDown.destroy();\n }\n if (this.fontSizeDropDown) {\n this.removeDropDownClasses(this.fontSizeDropDown.element);\n this.fontSizeDropDown.destroy();\n }\n if (this.alignDropDown) {\n this.removeDropDownClasses(this.alignDropDown.element);\n this.alignDropDown.destroy();\n }\n if (this.imageAlignDropDown) {\n this.removeDropDownClasses(this.imageAlignDropDown.element);\n this.imageAlignDropDown.destroy();\n }\n if (this.displayDropDown) {\n this.removeDropDownClasses(this.displayDropDown.element);\n this.displayDropDown.destroy();\n }\n if (this.tableRowsDropDown) {\n this.removeDropDownClasses(this.tableRowsDropDown.element);\n this.tableRowsDropDown.destroy();\n }\n if (this.tableColumnsDropDown) {\n this.removeDropDownClasses(this.tableColumnsDropDown.element);\n this.tableColumnsDropDown.destroy();\n }\n if (this.tableCellDropDown) {\n this.removeDropDownClasses(this.tableCellDropDown.element);\n this.tableCellDropDown.destroy();\n }\n if (this.tableCellVerticalAlignDropDown) {\n this.removeDropDownClasses(this.tableCellVerticalAlignDropDown.element);\n this.tableCellVerticalAlignDropDown.destroy();\n }\n if (this.numberFormatListDropDown) {\n this.removeDropDownClasses(this.numberFormatListDropDown.element);\n this.numberFormatListDropDown.destroy();\n }\n if (this.bulletFormatListDropDown) {\n this.removeDropDownClasses(this.bulletFormatListDropDown.element);\n this.bulletFormatListDropDown.destroy();\n }\n };\n DropDownButtons.prototype.setRtl = function (args) {\n if (this.formatDropDown) {\n this.formatDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.fontNameDropDown) {\n this.fontNameDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.fontSizeDropDown) {\n this.fontSizeDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.alignDropDown) {\n this.alignDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.imageAlignDropDown) {\n this.imageAlignDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.displayDropDown) {\n this.displayDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.numberFormatListDropDown) {\n this.numberFormatListDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.bulletFormatListDropDown) {\n this.bulletFormatListDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n };\n DropDownButtons.prototype.updateCss = function (dropDownObj, e) {\n if (dropDownObj && e.cssClass) {\n if (isNullOrUndefined(e.oldCssClass)) {\n dropDownObj.setProperties({ cssClass: (dropDownObj.cssClass + ' ' + e.cssClass).trim() });\n }\n else {\n dropDownObj.setProperties({ cssClass: (dropDownObj.cssClass.replace(e.oldCssClass, '').trim() + ' ' + e.cssClass).trim() });\n }\n }\n };\n DropDownButtons.prototype.setCssClass = function (e) {\n var dropDownObj = [\n this.formatDropDown, this.fontNameDropDown, this.fontSizeDropDown, this.alignDropDown, this.imageAlignDropDown,\n this.displayDropDown, this.numberFormatListDropDown, this.bulletFormatListDropDown, this.tableRowsDropDown,\n this.tableColumnsDropDown, this.tableCellDropDown, this.tableCellVerticalAlignDropDown\n ];\n for (var i = 0; i < dropDownObj.length; i++) {\n this.updateCss(dropDownObj[i], e);\n }\n };\n DropDownButtons.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.beforeDropDownItemRender, this.beforeRender, this);\n this.parent.on(events.iframeMouseDown, this.onIframeMouseDown, this);\n this.parent.on(events.rtlMode, this.setRtl, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n this.parent.on(events.bindCssClass, this.setCssClass, this);\n };\n DropDownButtons.prototype.onIframeMouseDown = function () {\n if (!isNullOrUndefined(this.parent.getToolbarElement()) && (this.parent.getToolbarElement().querySelectorAll('.e-rte-dropdown-btn[aria-expanded=\"true\"]').length > 0 || this.parent.getToolbarElement().querySelectorAll('.e-dropdown-btn.e-rte-inline-dropdown[aria-expanded=\"true\"]').length > 0)) {\n dispatchEvent(document, 'mousedown');\n }\n };\n DropDownButtons.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.iframeMouseDown, this.onIframeMouseDown);\n this.parent.off(events.rtlMode, this.setRtl);\n this.parent.off(events.beforeDropDownItemRender, this.beforeRender);\n this.parent.off(events.destroy, this.removeEventListener);\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n this.parent.off(events.bindCssClass, this.setCssClass);\n };\n return DropDownButtons;\n}());\nexport { DropDownButtons };\n","import { isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * ServiceLocator\n *\n * @hidden\n\n */\nvar ServiceLocator = /** @class */ (function () {\n function ServiceLocator() {\n this.services = {};\n }\n /* eslint-disable */\n /**\n * register method\n *\n * @param {string} name - specifies the name.\n * @param {T} type - specifies the type.\n * @returns {void}\n * @hidden\n\n */\n /* eslint-enable */\n ServiceLocator.prototype.register = function (name, type) {\n if (isNullOrUndefined(this.services[\"\" + name])) {\n this.services[\"\" + name] = type;\n }\n };\n /**\n * getService method\n *\n * @param {string} name - specifies the name.\n * @returns {void}\n * @hidden\n\n */\n ServiceLocator.prototype.getService = function (name) {\n if (isNullOrUndefined(this.services[\"\" + name])) {\n // eslint-disable-next-line\n throw \"The service \" + name + \" is not registered\";\n }\n return this.services[\"\" + name];\n };\n return ServiceLocator;\n}());\nexport { ServiceLocator };\n","import { isNullOrUndefined, getEnumValue } from '@syncfusion/ej2-base';\nimport { RenderType } from '../base/enum';\n/**\n * RendererFactory\n *\n * @hidden\n\n */\nvar RendererFactory = /** @class */ (function () {\n function RendererFactory() {\n this.rendererMap = {};\n }\n /**\n * addRenderer method\n *\n * @param {RenderType} name - specifies the render type\n * @param {IRenderer} type - specifies the renderer.\n * @returns {void}\n * @hidden\n\n */\n RendererFactory.prototype.addRenderer = function (name, type) {\n var rName = getEnumValue(RenderType, name);\n if (isNullOrUndefined(this.rendererMap[\"\" + rName])) {\n this.rendererMap[\"\" + rName] = type;\n }\n };\n /**\n * getRenderer method\n *\n * @param {RenderType} name - specifies the render type\n * @returns {void}\n * @hidden\n\n */\n RendererFactory.prototype.getRenderer = function (name) {\n var rName = getEnumValue(RenderType, name);\n if (isNullOrUndefined(this.rendererMap[\"\" + rName])) {\n // eslint-disable-next-line\n throw \"The renderer \" + rName + \" is not found\";\n }\n else {\n return this.rendererMap[\"\" + rName];\n }\n };\n return RendererFactory;\n}());\nexport { RendererFactory };\n","import { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport { ServiceLocator } from '../services/service-locator';\nimport { RendererFactory } from '../services/renderer-factory';\n/**\n * `ToolbarAction` module is used to toolbar click action\n */\nvar ToolbarAction = /** @class */ (function () {\n function ToolbarAction(parent) {\n this.parent = parent;\n this.addEventListener();\n this.serviceLocator = new ServiceLocator;\n this.serviceLocator.register('rendererFactory', new RendererFactory);\n }\n ToolbarAction.prototype.addEventListener = function () {\n this.parent.on(events.toolbarClick, this.toolbarClick, this);\n this.parent.on(events.dropDownSelect, this.dropDownSelect, this);\n this.parent.on(events.colorPickerChanged, this.renderSelection, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n ToolbarAction.prototype.toolbarClick = function (args) {\n if (isNOU(args.item)) {\n return;\n }\n if (!isNOU(args.item.controlParent)) {\n // eslint-disable-next-line\n var activeEle = args.item.controlParent\n .activeEle;\n if (activeEle) {\n activeEle.tabIndex = -1;\n }\n }\n if (args.item.command === 'NumberFormatList' || args.item.command === 'BulletFormatList') {\n if (args.originalEvent.target.classList.contains('e-order-list') || args.originalEvent.target.classList.contains('e-unorder-list')) {\n args.item.command = 'Lists';\n args.item.subCommand = args.item.subCommand === 'NumberFormatList' ? 'OL' : 'UL';\n }\n }\n if (args.item.command === 'Lists') {\n if (args.originalEvent.target.classList.contains('e-caret') &&\n (args.originalEvent.target.parentElement.classList.contains('e-rte-bulletformatlist-dropdown') || args.originalEvent.target.parentElement.classList.contains('e-rte-numberformatlist-dropdown'))) {\n return;\n }\n }\n this.parent.notify(events.htmlToolbarClick, args);\n this.parent.notify(events.markdownToolbarClick, args);\n };\n ToolbarAction.prototype.dropDownSelect = function (e) {\n this.parent.notify(events.selectionRestore, {});\n if (!(document.body.contains(document.body.querySelector('.e-rte-quick-toolbar'))\n && e.item && (e.item.command === 'Images' || e.item.command === 'Audios' || e.item.command === 'Videos' ||\n e.item.command === 'VideoLayoutOption' || e.item.command === 'Display' || e.item.command === 'Table'))) {\n var value = e.item.controlParent && this.parent.quickToolbarModule && this.parent.quickToolbarModule.tableQTBar\n && this.parent.quickToolbarModule.tableQTBar.element.contains(e.item.controlParent.element) ? 'Table' : null;\n if (e.item.command === 'Lists') {\n var listItem = { listStyle: e.item.value, listImage: e.item.listImage, type: e.item.subCommand };\n this.parent.formatter.process(this.parent, e, e.originalEvent, listItem);\n }\n else {\n this.parent.formatter.process(this.parent, e, e.originalEvent, value);\n }\n }\n this.parent.notify(events.selectionSave, {});\n };\n ToolbarAction.prototype.renderSelection = function (args) {\n this.parent.notify(events.selectionRestore, {});\n this.parent.formatter.process(this.parent, args, args.originalEvent, null);\n this.parent.notify(events.selectionSave, {});\n };\n ToolbarAction.prototype.removeEventListener = function () {\n this.parent.off(events.toolbarClick, this.toolbarClick);\n this.parent.off(events.dropDownSelect, this.dropDownSelect);\n this.parent.off(events.colorPickerChanged, this.renderSelection);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n return ToolbarAction;\n}());\nexport { ToolbarAction };\n","import { addClass, Browser, EventHandler, detach, removeClass, select, selectAll, KeyboardEvents } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU, closest, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, extend } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { RenderType, ToolbarType } from '../base/enum';\nimport { setToolbarStatus, updateUndoRedoStatus, getTBarItemsIndex, getCollection, toObjectLowerCase, isIDevice, getTooltipText } from '../base/util';\nimport { updateDropDownFontFormatLocale } from '../base/util';\nimport * as model from '../models/items';\nimport { ToolbarRenderer } from '../renderer/toolbar-renderer';\nimport { BaseToolbar } from './base-toolbar';\nimport { DropDownButtons } from './dropdown-buttons';\nimport { ToolbarAction } from './toolbar-action';\n/**\n * `Toolbar` module is used to handle Toolbar actions.\n */\nvar Toolbar = /** @class */ (function () {\n function Toolbar(parent, serviceLocator) {\n this.tools = {};\n this.parent = parent;\n this.isToolbar = false;\n this.locator = serviceLocator;\n this.isTransformChild = false;\n this.renderFactory = this.locator.getService('rendererFactory');\n model.updateDropDownLocale(this.parent);\n updateDropDownFontFormatLocale(this.parent);\n this.renderFactory.addRenderer(RenderType.Toolbar, new ToolbarRenderer(this.parent, this.locator));\n this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);\n this.baseToolbar = new BaseToolbar(this.parent, this.locator);\n this.addEventListener();\n if (this.parent.toolbarSettings && Object.keys(this.parent.toolbarSettings.itemConfigs).length > 0) {\n extend(this.tools, model.tools, toObjectLowerCase(this.parent.toolbarSettings.itemConfigs), true);\n }\n else {\n this.tools = model.tools;\n }\n }\n Toolbar.prototype.initializeInstance = function () {\n this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);\n this.editableElement = this.contentRenderer.getEditPanel();\n this.editPanel = this.contentRenderer.getPanel();\n };\n Toolbar.prototype.toolbarBindEvent = function () {\n if (!this.parent.inlineMode.enable) {\n this.keyBoardModule = new KeyboardEvents(this.getToolbarElement(), {\n keyAction: this.toolBarKeyDown.bind(this), keyConfigs: this.parent.formatter.keyConfig, eventName: 'keydown'\n });\n }\n };\n Toolbar.prototype.toolBarKeyDown = function (e) {\n switch (e.action) {\n case 'escape':\n this.parent.contentModule.getEditPanel().focus();\n break;\n case 'enter':\n if (e.target.classList.contains('e-hor-nav')) {\n this.adjustContentHeight(e.target, true);\n }\n if (!isNullOrUndefined(e.target) && (e.target.classList.contains(\"e-rte-fontcolor-dropdown\") || e.target.classList.contains(\"e-rte-backgroundcolor-dropdown\"))) {\n this.parent.notify(events.showColorPicker, { toolbarClick: e.target.classList.contains(\"e-rte-fontcolor-dropdown\") ? \"fontcolor\" : \"backgroundcolor\" });\n }\n }\n };\n Toolbar.prototype.createToolbarElement = function () {\n this.tbElement = this.parent.createElement('div', { id: this.parent.getID() + '_toolbar' });\n if (!Browser.isDevice && this.parent.inlineMode.enable && isIDevice()) {\n return;\n }\n else {\n if (!this.parent.inlineMode.enable) {\n this.tbWrapper = this.parent.createElement('div', {\n id: this.parent.getID() + '_toolbar_wrapper',\n innerHTML: this.tbElement.outerHTML,\n className: classes.CLS_TB_WRAP\n });\n this.tbElement = this.tbWrapper.firstElementChild;\n this.parent.element.insertBefore(this.tbWrapper, this.editPanel);\n }\n else {\n this.parent.element.insertBefore(this.tbElement, this.editPanel);\n }\n }\n };\n Toolbar.prototype.getToolbarMode = function () {\n var tbMode;\n switch (this.parent.toolbarSettings.type) {\n case ToolbarType.Expand:\n tbMode = 'Extended';\n break;\n case ToolbarType.Scrollable:\n tbMode = 'Scrollable';\n break;\n default:\n tbMode = 'MultiRow';\n }\n if (isIDevice() && this.parent.toolbarSettings.type === ToolbarType.Expand) {\n tbMode = ToolbarType.Scrollable;\n }\n return tbMode;\n };\n Toolbar.prototype.checkToolbarResponsive = function (ele) {\n if (!Browser.isDevice || isIDevice()) {\n return false;\n }\n var tBarMode;\n if (this.parent.toolbarSettings.type === ToolbarType.Expand) {\n tBarMode = ToolbarType.MultiRow;\n }\n else {\n tBarMode = this.parent.toolbarSettings.type;\n }\n this.baseToolbar.render({\n container: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),\n items: this.parent.toolbarSettings.items,\n mode: tBarMode,\n target: ele,\n cssClass: this.parent.getCssClass()\n });\n if (this.parent.toolbarSettings.type === ToolbarType.Expand) {\n addClass([ele], ['e-rte-tb-mobile']);\n if (this.parent.inlineMode.enable) {\n this.addFixedTBarClass();\n }\n else {\n addClass([ele], [classes.CLS_TB_STATIC]);\n }\n }\n this.wireEvents();\n this.dropDownModule.renderDropDowns({\n container: ele,\n containerType: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),\n items: this.parent.toolbarSettings.items\n });\n this.parent.notify(events.renderColorPicker, {\n container: this.tbElement,\n containerType: ((this.parent.inlineMode.enable) ? 'quick' : 'toolbar'),\n items: this.parent.toolbarSettings.items\n });\n return true;\n };\n Toolbar.prototype.checkIsTransformChild = function () {\n this.isTransformChild = false;\n var transformElements = selectAll('[style*=\"transform\"]', document);\n for (var i = 0; i < transformElements.length; i++) {\n // eslint-disable-next-line max-len\n if (!isNullOrUndefined(transformElements[i].contains) && transformElements[i].contains(this.parent.element)) {\n this.isTransformChild = true;\n break;\n }\n }\n };\n Toolbar.prototype.toggleFloatClass = function (e) {\n var floatOffset = this.parent.floatingToolbarOffset;\n if (this.parent.toolbarSettings.enableFloating) {\n addClass([this.tbElement.parentElement], [classes.CLS_TB_FLOAT]);\n setStyleAttribute(this.tbElement.parentElement, { top: (floatOffset) + 'px' });\n }\n else {\n removeClass([this.tbElement.parentElement], [classes.CLS_TB_FLOAT]);\n setStyleAttribute(this.tbElement.parentElement, { top: '' });\n }\n };\n Toolbar.prototype.renderToolbar = function () {\n this.initializeInstance();\n this.createToolbarElement();\n if (this.checkToolbarResponsive(this.tbElement)) {\n return;\n }\n if (this.parent.inlineMode.enable) {\n this.parent.notify(events.renderInlineToolbar, {});\n }\n else {\n this.baseToolbar.render({\n container: 'toolbar',\n items: this.parent.toolbarSettings.items,\n mode: this.getToolbarMode(),\n target: this.tbElement,\n cssClass: this.parent.getCssClass()\n });\n if (!this.parent.inlineMode.enable) {\n if (this.parent.toolbarSettings.enableFloating) {\n this.checkIsTransformChild();\n this.toggleFloatClass();\n }\n addClass([this.parent.element], [classes.CLS_RTE_TB_ENABLED]);\n if (this.parent.toolbarSettings.type === ToolbarType.Expand) {\n addClass([this.parent.element], [classes.CLS_RTE_EXPAND_TB]);\n }\n }\n }\n this.wireEvents();\n if (this.parent.inlineMode.enable && !isIDevice()) {\n this.addFixedTBarClass();\n }\n if (!this.parent.inlineMode.enable) {\n this.dropDownModule.renderDropDowns({\n container: this.tbElement,\n containerType: 'toolbar',\n items: this.parent.toolbarSettings.items\n });\n this.parent.notify(events.renderColorPicker, {\n container: this.tbElement,\n containerType: 'toolbar',\n items: this.parent.toolbarSettings.items\n });\n this.refreshToolbarOverflow();\n }\n var divEle = this.parent.element.querySelector('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA);\n var iframeEle = this.parent.element.querySelector('.e-source-content');\n if ((!this.parent.iframeSettings.enable && (!isNOU(divEle) && divEle.style.display === 'block')) ||\n (this.parent.iframeSettings.enable && (!isNOU(iframeEle) && iframeEle.style.display === 'block'))) {\n this.parent.notify(events.updateToolbarItem, {\n targetItem: 'SourceCode', updateItem: 'Preview',\n baseToolbar: this.parent.getBaseToolbarObject()\n });\n this.parent.disableToolbarItem(this.parent.toolbarSettings.items);\n }\n };\n /**\n * addFixedTBarClass method\n *\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.addFixedTBarClass = function () {\n addClass([this.tbElement], [classes.CLS_TB_FIXED]);\n };\n /**\n * removeFixedTBarClass method\n *\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.removeFixedTBarClass = function () {\n removeClass([this.tbElement], [classes.CLS_TB_FIXED]);\n };\n Toolbar.prototype.showFixedTBar = function () {\n addClass([this.tbElement], [classes.CLS_SHOW]);\n if (Browser.isIos) {\n addClass([this.tbElement], [classes.CLS_TB_IOS_FIX]);\n }\n };\n Toolbar.prototype.hideFixedTBar = function () {\n // eslint-disable-next-line\n (!this.isToolbar) ? removeClass([this.tbElement], [classes.CLS_SHOW, classes.CLS_TB_IOS_FIX]) : this.isToolbar = false;\n };\n /**\n * updateItem method\n *\n * @param {IUpdateItemsModel} args - specifies the arguments.\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.updateItem = function (args) {\n var item = this.tools[args.updateItem.toLocaleLowerCase()];\n if (this.parent.locale !== 'en-US') {\n item.tooltip = getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator);\n }\n var trgItem = this.tools[args.targetItem.toLocaleLowerCase()];\n var index = getTBarItemsIndex(getCollection(trgItem.subCommand), args.baseToolbar.toolbarObj.items)[0];\n if (!isNOU(index)) {\n var prefixId = this.parent.inlineMode.enable ? '_quick_' : '_toolbar_';\n args.baseToolbar.toolbarObj.items[index].id = this.parent.getID() + prefixId + item.id;\n args.baseToolbar.toolbarObj.items[index].prefixIcon = item.icon;\n args.baseToolbar.toolbarObj.items[index].tooltipText = item.tooltip;\n args.baseToolbar.toolbarObj.items[index].subCommand = item.subCommand;\n args.baseToolbar.toolbarObj.dataBind();\n args.baseToolbar.toolbarObj.refreshOverflow();\n }\n else {\n this.addTBarItem(args, 0);\n }\n };\n Toolbar.prototype.updateToolbarStatus = function (args) {\n if (!this.tbElement || (this.parent.inlineMode.enable && (isIDevice() || !Browser.isDevice))) {\n return;\n }\n var options = {\n args: args,\n dropDownModule: this.dropDownModule,\n parent: this.parent,\n tbElements: selectAll('.' + classes.CLS_TB_ITEM, this.tbElement),\n tbItems: this.baseToolbar.toolbarObj.items\n };\n setToolbarStatus(options, (this.parent.inlineMode.enable ? true : false), this.parent);\n };\n Toolbar.prototype.fullScreen = function (e) {\n this.parent.fullScreenModule.showFullScreen(e);\n };\n Toolbar.prototype.hideScreen = function (e) {\n this.parent.fullScreenModule.hideFullScreen(e);\n };\n /**\n * getBaseToolbar method\n *\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.getBaseToolbar = function () {\n return this.baseToolbar;\n };\n /**\n * addTBarItem method\n *\n * @param {IUpdateItemsModel} args - specifies the arguments.\n * @param {number} index - specifies the index value.\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.addTBarItem = function (args, index) {\n args.baseToolbar.toolbarObj.addItems([args.baseToolbar.getObject(args.updateItem, 'toolbar')], index);\n };\n /**\n * enableTBarItems method\n *\n * @param {BaseToolbar} baseToolbar - specifies the toolbar.\n * @param {string} items - specifies the string value.\n * @param {boolean} isEnable - specifies the boolean value.\n * @param {boolean} muteToolbarUpdate - specifies the toolbar.\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.enableTBarItems = function (baseToolbar, items, isEnable, muteToolbarUpdate) {\n var trgItems = getTBarItemsIndex(getCollection(items), baseToolbar.toolbarObj.items);\n this.tbItems = selectAll('.' + classes.CLS_TB_ITEM, baseToolbar.toolbarObj.element);\n for (var i = 0; i < trgItems.length; i++) {\n var item = this.tbItems[trgItems[i]];\n if (item) {\n baseToolbar.toolbarObj.enableItems(item, isEnable);\n }\n }\n if (!select('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element) && !muteToolbarUpdate) {\n updateUndoRedoStatus(baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());\n }\n };\n /**\n * removeTBarItems method\n *\n * @param {string} items - specifies the string value.\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.removeTBarItems = function (items) {\n if (isNullOrUndefined(this.baseToolbar.toolbarObj)) {\n this.baseToolbar = this.parent.getBaseToolbarObject();\n }\n var trgItems = getTBarItemsIndex(getCollection(items), this.baseToolbar.toolbarObj.items);\n this.tbItems = (this.parent.inlineMode.enable) ? selectAll('.' + classes.CLS_TB_ITEM, this.baseToolbar.toolbarObj.element)\n : selectAll('.' + classes.CLS_TB_ITEM, this.parent.element);\n for (var i = 0; i < trgItems.length; i++) {\n this.baseToolbar.toolbarObj.removeItems(this.tbItems[trgItems[i]]);\n }\n };\n /**\n * getExpandTBarPopHeight method\n *\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.getExpandTBarPopHeight = function () {\n var popHeight = 0;\n if (this.parent.toolbarSettings.type === ToolbarType.Expand && this.tbElement.classList.contains('e-extended-toolbar')) {\n var expandPopup = select('.e-toolbar-extended', this.tbElement);\n if (expandPopup && this.tbElement.classList.contains('e-expand-open')\n || expandPopup && expandPopup.classList.contains('e-popup-open')) {\n addClass([expandPopup], [classes.CLS_VISIBLE]);\n popHeight = popHeight + expandPopup.offsetHeight;\n removeClass([expandPopup], [classes.CLS_VISIBLE]);\n }\n else {\n removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n }\n }\n return popHeight;\n };\n /**\n * getToolbarHeight method\n *\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.getToolbarHeight = function () {\n return this.tbElement.offsetHeight;\n };\n /**\n * getToolbarElement method\n *\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.getToolbarElement = function () {\n return select('.' + classes.CLS_TOOLBAR, this.parent.element);\n };\n /**\n * refreshToolbarOverflow method\n *\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.refreshToolbarOverflow = function () {\n this.parent.element.classList.remove(classes.CLS_RTL);\n this.baseToolbar.toolbarObj.refreshOverflow();\n if (this.parent.enableRtl) {\n this.parent.element.classList.add(classes.CLS_RTL);\n }\n };\n Toolbar.prototype.isToolbarDestroyed = function () {\n return this.baseToolbar.toolbarObj && !this.baseToolbar.toolbarObj.isDestroyed;\n };\n Toolbar.prototype.destroyToolbar = function () {\n if (this.isToolbarDestroyed()) {\n this.parent.unWireScrollElementsEvents();\n this.unWireEvents();\n this.parent.notify(events.destroyColorPicker, {});\n this.dropDownModule.destroyDropDowns();\n this.baseToolbar.toolbarObj.destroy();\n this.removeEventListener();\n removeClass([this.parent.element], [classes.CLS_RTE_TB_ENABLED]);\n removeClass([this.parent.element], [classes.CLS_RTE_EXPAND_TB]);\n var tbWrapper = select('.' + classes.CLS_TB_WRAP, this.parent.element);\n var tbElement = select('.' + classes.CLS_TOOLBAR, this.parent.element);\n if (!isNullOrUndefined(tbWrapper)) {\n detach(tbWrapper);\n }\n else if (!isNullOrUndefined(tbElement)) {\n detach(tbElement);\n }\n }\n };\n /**\n * Destroys the ToolBar.\n *\n * @function destroy\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.destroy = function () {\n if (isNOU(this.parent)) {\n return;\n }\n if (this.isToolbarDestroyed()) {\n this.destroyToolbar();\n if (this.keyBoardModule) {\n this.keyBoardModule.destroy();\n }\n }\n };\n Toolbar.prototype.moduleDestroy = function () {\n this.parent = null;\n this.baseToolbar.parent = null;\n this.toolbarActionModule.parent = null;\n this.dropDownModule.parent = null;\n };\n Toolbar.prototype.mouseDownHandler = function () {\n if (Browser.isDevice && this.parent.inlineMode.enable && !isIDevice()) {\n this.showFixedTBar();\n }\n };\n Toolbar.prototype.focusChangeHandler = function () {\n if (Browser.isDevice && this.parent.inlineMode.enable && !isIDevice()) {\n this.isToolbar = false;\n this.hideFixedTBar();\n }\n };\n Toolbar.prototype.dropDownBeforeOpenHandler = function () {\n this.isToolbar = true;\n };\n // eslint-disable-next-line\n Toolbar.prototype.tbFocusHandler = function (e) {\n var activeElm = document.activeElement;\n var isToolbaractive = closest(activeElm, '.e-rte-toolbar');\n if (activeElm === this.parent.getToolbarElement() || isToolbaractive === this.parent.getToolbarElement()) {\n var toolbarItem = this.parent.getToolbarElement().querySelectorAll('.e-expended-nav');\n for (var i = 0; i < toolbarItem.length; i++) {\n if (isNOU(this.parent.getToolbarElement().querySelector('.e-insert-table-btn'))) {\n toolbarItem[i].setAttribute('tabindex', '0');\n }\n else {\n toolbarItem[i].setAttribute('tabindex', '1');\n }\n }\n }\n };\n Toolbar.prototype.toolbarClickHandler = function (e) {\n var trg = closest(e.originalEvent.target, '.e-hor-nav');\n this.adjustContentHeight(trg, false);\n };\n Toolbar.prototype.adjustContentHeight = function (trg, isKeyboard) {\n if (trg && this.parent.toolbarSettings.type === ToolbarType.Expand && !isNOU(trg)) {\n var hasActiveClass = trg.classList.contains('e-nav-active');\n var isExpand = isKeyboard ? (hasActiveClass ? false : true) : (hasActiveClass ? true : false);\n if (isExpand) {\n addClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n }\n else {\n removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n }\n this.parent.setContentHeight('Toolbar', isExpand);\n }\n else if (Browser.isDevice || this.parent.inlineMode.enable) {\n this.isToolbar = true;\n }\n if (isNOU(trg) && this.parent.toolbarSettings.type === ToolbarType.Expand && this.parent.toolbarModule.getExpandTBarPopHeight() === 0) {\n removeClass([this.tbElement], [classes.CLS_EXPAND_OPEN]);\n }\n };\n Toolbar.prototype.wireEvents = function () {\n if (this.parent.inlineMode.enable && isIDevice()) {\n return;\n }\n EventHandler.add(this.tbElement, 'focusin', this.tbFocusHandler, this);\n };\n Toolbar.prototype.unWireEvents = function () {\n EventHandler.remove(this.tbElement, 'focusin', this.tbFocusHandler);\n };\n Toolbar.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.dropDownModule = new DropDownButtons(this.parent, this.locator);\n this.toolbarActionModule = new ToolbarAction(this.parent);\n this.parent.on(events.initialEnd, this.renderToolbar, this);\n this.parent.on(events.bindOnEnd, this.toolbarBindEvent, this);\n this.parent.on(events.toolbarUpdated, this.updateToolbarStatus, this);\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n this.parent.on(events.refreshBegin, this.onRefresh, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.parent.on(events.enableFullScreen, this.fullScreen, this);\n this.parent.on(events.disableFullScreen, this.hideScreen, this);\n this.parent.on(events.updateToolbarItem, this.updateItem, this);\n this.parent.on(events.beforeDropDownOpen, this.dropDownBeforeOpenHandler, this);\n this.parent.on(events.expandPopupClick, this.parent.setContentHeight, this.parent);\n this.parent.on(events.focusChange, this.focusChangeHandler, this);\n this.parent.on(events.mouseDown, this.mouseDownHandler, this);\n this.parent.on(events.sourceCodeMouseDown, this.mouseDownHandler, this);\n this.parent.on(events.bindCssClass, this.setCssClass, this);\n this.parent.on(events.moduleDestroy, this.moduleDestroy, this);\n if (!this.parent.inlineMode.enable && !isIDevice()) {\n this.parent.on(events.toolbarClick, this.toolbarClickHandler, this);\n }\n };\n Toolbar.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.initialEnd, this.renderToolbar);\n this.parent.off(events.bindOnEnd, this.toolbarBindEvent);\n this.parent.off(events.toolbarUpdated, this.updateToolbarStatus);\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n this.parent.off(events.refreshBegin, this.onRefresh);\n this.parent.off(events.destroy, this.destroy);\n this.parent.off(events.enableFullScreen, this.parent.fullScreenModule.showFullScreen);\n this.parent.off(events.disableFullScreen, this.parent.fullScreenModule.hideFullScreen);\n this.parent.off(events.updateToolbarItem, this.updateItem);\n this.parent.off(events.beforeDropDownOpen, this.dropDownBeforeOpenHandler);\n this.parent.off(events.expandPopupClick, this.parent.setContentHeight);\n this.parent.off(events.focusChange, this.focusChangeHandler);\n this.parent.off(events.mouseDown, this.mouseDownHandler);\n this.parent.off(events.sourceCodeMouseDown, this.mouseDownHandler);\n this.parent.off(events.bindCssClass, this.setCssClass);\n this.parent.off(events.moduleDestroy, this.moduleDestroy);\n if (!this.parent.inlineMode.enable && !isIDevice()) {\n this.parent.off(events.toolbarClick, this.toolbarClickHandler);\n }\n };\n // eslint-disable-next-line @typescript-eslint/tslint/config\n Toolbar.prototype.setCssClass = function (e) {\n if (this.toolbarObj && e.cssClass) {\n if (isNullOrUndefined(e.oldCssClass)) {\n this.toolbarObj.setProperties({ cssClass: (this.toolbarObj.cssClass + ' ' + e.cssClass).trim() });\n }\n else {\n this.toolbarObj.setProperties({ cssClass: (this.toolbarObj.cssClass.replace(e.oldCssClass, '').trim() + ' ' + e.cssClass).trim() });\n }\n }\n };\n Toolbar.prototype.onRefresh = function () {\n if (!this.parent.inlineMode.enable) {\n this.refreshToolbarOverflow();\n }\n var isExpand = this.parent.element.querySelectorAll('.e-toolbar-extended.e-popup-open').length > 0 ? true : false;\n this.parent.setContentHeight('Refresh', isExpand);\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {RichTextEditorModel} e - specifies the string value\n * @returns {void}\n * @hidden\n\n */\n Toolbar.prototype.onPropertyChanged = function (e) {\n if (!isNullOrUndefined(e.newProp.inlineMode)) {\n for (var _i = 0, _a = Object.keys(e.newProp.inlineMode); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'enable':\n this.refreshToolbar();\n break;\n }\n }\n }\n if (!isNullOrUndefined(e.newProp.toolbarSettings)) {\n if (!isNullOrUndefined(e.newProp.toolbarSettings.enableFloating)) {\n this.toggleFloatClass();\n }\n }\n if (e.module !== this.getModuleName()) {\n return;\n }\n this.refreshToolbar();\n };\n Toolbar.prototype.refreshToolbar = function () {\n if (isNullOrUndefined(this.baseToolbar.toolbarObj)) {\n this.baseToolbar = this.parent.getBaseToolbarObject();\n }\n var tbWrapper = select('.' + classes.CLS_TB_WRAP, this.parent.element);\n var tbElement = select('.' + classes.CLS_TOOLBAR, this.parent.element);\n if (tbElement || tbWrapper) {\n this.destroyToolbar();\n }\n if (this.parent.toolbarSettings.enable) {\n this.addEventListener();\n this.renderToolbar();\n this.parent.wireScrollElementsEvents();\n if (!select('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element)) {\n updateUndoRedoStatus(this.baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());\n }\n this.parent.notify(events.dynamicModule, {});\n }\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {void}\n * @hidden\n */\n Toolbar.prototype.getModuleName = function () {\n return 'toolbar';\n };\n return Toolbar;\n}());\nexport { Toolbar };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, NotifyPropertyChanges, Event } from '@syncfusion/ej2-base';\nimport { Base } from '@syncfusion/ej2-base';\nvar keyCode = {\n 'backspace': 8,\n 'tab': 9,\n 'enter': 13,\n 'shift': 16,\n 'control': 17,\n 'alt': 18,\n 'pause': 19,\n 'capslock': 20,\n 'space': 32,\n 'escape': 27,\n 'pageup': 33,\n 'pagedown': 34,\n 'end': 35,\n 'home': 36,\n 'leftarrow': 37,\n 'uparrow': 38,\n 'rightarrow': 39,\n 'downarrow': 40,\n 'insert': 45,\n 'delete': 46,\n 'f1': 112,\n 'f2': 113,\n 'f3': 114,\n 'f4': 115,\n 'f5': 116,\n 'f6': 117,\n 'f7': 118,\n 'f8': 119,\n 'f9': 120,\n 'f10': 121,\n 'f11': 122,\n 'f12': 123,\n 'semicolon': 186,\n 'plus': 187,\n 'comma': 188,\n 'minus': 189,\n 'dot': 190,\n 'forwardslash': 191,\n 'graveaccent': 192,\n 'openbracket': 219,\n 'backslash': 220,\n 'closebracket': 221,\n 'singlequote': 222,\n ']': 221,\n '[': 219,\n '=': 187,\n '<': 188,\n '>': 190\n};\n/**\n * KeyboardEvents class enables you to bind key action desired key combinations for ex., Ctrl+A, Delete, Alt+Space etc.\n * ```html\n *
    ;\n * \n * ```\n *\n * @hidden\n\n */\nvar KeyboardEvents = /** @class */ (function (_super) {\n __extends(KeyboardEvents, _super);\n /**\n * Initializes the KeyboardEvents\n *\n * @param {HTMLElement} element - specifies the elements.\n * @param {KeyboardEventsModel} options - specify the options\n */\n function KeyboardEvents(element, options) {\n var _this = _super.call(this, options, element) || this;\n /**\n * To handle a key press event returns null\n *\n * @param {KeyboardEventArgs} e - specifies the event arguments.\n * @returns {void}\n */\n _this.keyPressHandler = function (e) {\n /* eslint-disable */\n var isAltKey = e.altKey;\n var isCtrlKey = e.ctrlKey;\n var isShiftKey = e.shiftKey;\n var isMetaKey = e.metaKey;\n /* eslint-enable */\n var curkeyCode = e.which;\n var keys = Object.keys(_this.keyConfigs);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n var configCollection = _this.keyConfigs[\"\" + key].split(',');\n for (var _a = 0, configCollection_1 = configCollection; _a < configCollection_1.length; _a++) {\n var rconfig = configCollection_1[_a];\n var rKeyObj = KeyboardEvents_1.getKeyConfigData(rconfig.trim());\n if (isAltKey === rKeyObj.altKey && (isCtrlKey === rKeyObj.ctrlKey || isMetaKey) &&\n isShiftKey === rKeyObj.shiftKey && curkeyCode === rKeyObj.keyCode) {\n e.action = key;\n }\n }\n }\n if (_this.keyAction) {\n _this.keyAction(e);\n }\n };\n _this.bind();\n return _this;\n }\n KeyboardEvents_1 = KeyboardEvents;\n /**\n * Unwire bound events and destroy the instance.\n *\n * @returns {void}\n */\n KeyboardEvents.prototype.destroy = function () {\n this.unwireEvents();\n _super.prototype.destroy.call(this);\n };\n /**\n * Function can be used to specify certain action if a property is changed\n *\n * @param {KeyboardEventsModel} newProp - specifies the keyboard event.\n * @param {KeyboardEventsModel} oldProp - specifies the old property.\n * @returns {void}\n * @private\n */\n // eslint-disable-next-line\n KeyboardEvents.prototype.onPropertyChanged = function (newProp, oldProp) {\n // No code are needed\n };\n KeyboardEvents.prototype.bind = function () {\n this.wireEvents();\n };\n /**\n * To get the module name, returns 'keyboard'.\n *\n * @returns {void}\n */\n KeyboardEvents.prototype.getModuleName = function () {\n return 'keyboard';\n };\n /**\n * Wiring event handlers to events\n *\n * @returns {void}\n */\n KeyboardEvents.prototype.wireEvents = function () {\n this.element.addEventListener(this.eventName, this.keyPressHandler);\n };\n /**\n * Unwiring event handlers to events\n *\n * @returns {void}\n */\n KeyboardEvents.prototype.unwireEvents = function () {\n this.element.removeEventListener(this.eventName, this.keyPressHandler);\n };\n /**\n * To get the key configuration data\n *\n * @param {string} config - configuration data\n * @returns {KeyData} - specifies the key data\n */\n KeyboardEvents.getKeyConfigData = function (config) {\n if (config in this.configCache) {\n return this.configCache[\"\" + config];\n }\n var keys = config.toLowerCase().split('+');\n var keyData = {\n altKey: (keys.indexOf('alt') !== -1 ? true : false),\n ctrlKey: (keys.indexOf('ctrl') !== -1 ? true : false),\n shiftKey: (keys.indexOf('shift') !== -1 ? true : false),\n keyCode: null\n };\n if (keys[keys.length - 1].length > 1 && !!Number(keys[keys.length - 1])) {\n keyData.keyCode = Number(keys[keys.length - 1]);\n }\n else {\n keyData.keyCode = KeyboardEvents_1.getKeyCode(keys[keys.length - 1]);\n }\n KeyboardEvents_1.configCache[\"\" + config] = keyData;\n return keyData;\n };\n // Return the keycode value as string\n KeyboardEvents.getKeyCode = function (keyVal) {\n return keyCode[\"\" + keyVal] || keyVal.toUpperCase().charCodeAt(0);\n };\n var KeyboardEvents_1;\n KeyboardEvents.configCache = {};\n __decorate([\n Property({})\n ], KeyboardEvents.prototype, \"keyConfigs\", void 0);\n __decorate([\n Property('keyup')\n ], KeyboardEvents.prototype, \"eventName\", void 0);\n __decorate([\n Event()\n ], KeyboardEvents.prototype, \"keyAction\", void 0);\n KeyboardEvents = KeyboardEvents_1 = __decorate([\n NotifyPropertyChanges\n ], KeyboardEvents);\n return KeyboardEvents;\n}(Base));\nexport { KeyboardEvents };\n","import { select, detach, extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { RenderType } from '../base/enum';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { getIndex, toObjectLowerCase } from '../base/util';\nimport { templateItems, tools } from '../models/items';\n/**\n * `Color Picker` module is used to handle ColorPicker actions.\n */\nvar ColorPickerInput = /** @class */ (function () {\n function ColorPickerInput(parent, serviceLocator) {\n this.tools = {};\n this.parent = parent;\n this.locator = serviceLocator;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.addEventListener();\n if (this.parent.toolbarSettings && Object.keys(this.parent.toolbarSettings.itemConfigs).length > 0) {\n extend(this.tools, tools, toObjectLowerCase(this.parent.toolbarSettings.itemConfigs), true);\n }\n else {\n this.tools = tools;\n }\n }\n ColorPickerInput.prototype.initializeInstance = function () {\n this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);\n };\n /**\n * renderColorPickerInput method\n *\n * @param {IColorPickerRenderArgs} args - specify the arguments.\n * @returns {void}\n * @hidden\n\n */\n ColorPickerInput.prototype.renderColorPickerInput = function (args) {\n var _this = this;\n this.initializeInstance();\n var suffixID = args.containerType;\n var tbElement = args.container;\n var targetID;\n var options;\n templateItems.forEach(function (item) {\n if (getIndex(item, args.items) !== -1) {\n switch (item) {\n case 'fontcolor': {\n targetID = _this.parent.getID() + '_' + suffixID + '_FontColor_Target';\n var fontNode = _this.parent.createElement('input');\n fontNode.id = targetID;\n fontNode.classList.add(classes.CLS_FONT_COLOR_TARGET);\n if (!isNullOrUndefined(_this.parent.cssClass)) {\n var allClassName = _this.parent.cssClass.split(' ');\n for (var i = 0; i < allClassName.length; i++) {\n if (allClassName[i].trim() !== '') {\n fontNode.classList.add(allClassName[i]);\n }\n }\n }\n document.body.appendChild(fontNode);\n options = {\n cssClass: _this.tools[item.toLocaleLowerCase()].icon\n + ' ' + classes.CLS_RTE_ELEMENTS + ' ' + classes.CLS_ICONS + _this.parent.getCssClass(true),\n value: _this.tools[item.toLocaleLowerCase()].value,\n command: _this.tools[item.toLocaleLowerCase()].command,\n subCommand: _this.tools[item.toLocaleLowerCase()].subCommand,\n element: select('#' + _this.parent.getID() + '_' + suffixID + '_FontColor', tbElement),\n target: (targetID)\n };\n _this.fontColorPicker = _this.toolbarRenderer.renderColorPicker(options, 'fontcolor');\n _this.fontColorDropDown = _this.toolbarRenderer.renderColorPickerDropDown(options, 'fontcolor', _this.fontColorPicker);\n break;\n }\n case 'backgroundcolor': {\n targetID = _this.parent.getID() + '_' + suffixID + '_BackgroundColor_Target';\n var backNode = _this.parent.createElement('input');\n backNode.id = targetID;\n backNode.classList.add(classes.CLS_BACKGROUND_COLOR_TARGET);\n if (!isNullOrUndefined(_this.parent.cssClass)) {\n var allClassName = _this.parent.cssClass.split(' ');\n for (var i = 0; i < allClassName.length; i++) {\n if (allClassName[i].trim() !== '') {\n backNode.classList.add(allClassName[i]);\n }\n }\n }\n document.body.appendChild(backNode);\n options = {\n cssClass: _this.tools[item.toLocaleLowerCase()].icon\n + ' ' + classes.CLS_RTE_ELEMENTS + ' ' + classes.CLS_ICONS + _this.parent.getCssClass(true),\n value: _this.tools[item.toLocaleLowerCase()].value,\n command: _this.tools[item.toLocaleLowerCase()].command,\n subCommand: _this.tools[item.toLocaleLowerCase()].subCommand,\n element: select('#' + _this.parent.getID() + '_' + suffixID + '_BackgroundColor', tbElement),\n target: (targetID)\n };\n _this.backgroundColorPicker = _this.toolbarRenderer.renderColorPicker(options, 'backgroundcolor');\n _this.backgroundColorDropDown = _this.toolbarRenderer.renderColorPickerDropDown(options, 'backgroundcolor', _this.backgroundColorPicker, _this.defaultColorPicker);\n break;\n }\n }\n }\n });\n if (this.parent.inlineMode.enable) {\n this.setCssClass({ cssClass: this.parent.getCssClass() });\n }\n };\n ColorPickerInput.prototype.destroy = function () {\n this.removeEventListener();\n this.destroyColorPicker();\n };\n /**\n * destroyColorPicker method\n *\n * @returns {void}\n * @hidden\n\n */\n ColorPickerInput.prototype.destroyColorPicker = function () {\n if (this.fontColorPicker && !this.fontColorPicker.isDestroyed) {\n this.fontColorPicker.destroy();\n }\n if (this.backgroundColorPicker && !this.backgroundColorPicker.isDestroyed) {\n this.backgroundColorPicker.destroy();\n }\n if (this.fontColorDropDown && !this.fontColorDropDown.isDestroyed) {\n var innerEle = this.fontColorDropDown.element.querySelector('.e-rte-color-content');\n if (innerEle) {\n detach(innerEle);\n }\n this.fontColorDropDown.destroy();\n }\n if (this.backgroundColorDropDown && !this.backgroundColorDropDown.isDestroyed) {\n var innerEle = this.backgroundColorDropDown.element.querySelector('.e-rte-color-content');\n if (innerEle) {\n this.defaultColorPicker = innerEle.children[0].style.borderBottomColor;\n detach(innerEle);\n }\n this.backgroundColorDropDown.destroy();\n }\n };\n ColorPickerInput.prototype.setRtl = function (args) {\n if (this.fontColorPicker) {\n this.fontColorPicker.setProperties({ enableRtl: args.enableRtl });\n this.fontColorDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.backgroundColorPicker) {\n this.backgroundColorPicker.setProperties({ enableRtl: args.enableRtl });\n this.backgroundColorDropDown.setProperties({ enableRtl: args.enableRtl });\n }\n };\n ColorPickerInput.prototype.setCssClass = function (e) {\n this.updateCss(this.fontColorPicker, this.fontColorDropDown, e);\n this.updateCss(this.backgroundColorPicker, this.backgroundColorDropDown, e);\n };\n ColorPickerInput.prototype.updateCss = function (colorPickerObj, dropDownObj, e) {\n if (colorPickerObj && e.cssClass) {\n if (isNullOrUndefined(e.oldCssClass)) {\n colorPickerObj.setProperties({ cssClass: (colorPickerObj.cssClass + ' ' + e.cssClass).trim() });\n dropDownObj.setProperties({ cssClass: (dropDownObj.cssClass + ' ' + e.cssClass).trim() });\n }\n else {\n colorPickerObj.setProperties({ cssClass: (colorPickerObj.cssClass.replace(e.oldCssClass, '').replace(' ', ' ').trim() + ' ' + e.cssClass).trim() });\n dropDownObj.setProperties({ cssClass: (dropDownObj.cssClass.replace(e.oldCssClass, '').replace(' ', ' ').trim() + ' ' + e.cssClass).trim() });\n }\n }\n };\n ColorPickerInput.prototype.addEventListener = function () {\n this.parent.on(events.toolbarRenderComplete, this.renderColorPickerInput, this);\n this.parent.on(events.rtlMode, this.setRtl, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.parent.on(events.destroyColorPicker, this.destroyColorPicker, this);\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n this.parent.on(events.bindCssClass, this.setCssClass, this);\n this.parent.on(events.showColorPicker, this.showColorPicker, this);\n };\n ColorPickerInput.prototype.showColorPicker = function (e) {\n if (!isNullOrUndefined(this.fontColorPicker) && (e.toolbarClick === \"fontcolor\")) {\n this.fontColorDropDown.toggle();\n }\n else if (!isNullOrUndefined(this.backgroundColorPicker) && (e.toolbarClick === \"backgroundcolor\")) {\n this.backgroundColorDropDown.toggle();\n }\n };\n ColorPickerInput.prototype.onPropertyChanged = function (model) {\n var newProp = model.newProp;\n var element;\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'fontColor':\n if (this.fontColorPicker) {\n for (var _b = 0, _c = Object.keys(newProp.fontColor); _b < _c.length; _b++) {\n var font = _c[_b];\n switch (font) {\n case 'default': {\n this.fontColorPicker.setProperties({ value: newProp.fontColor.default });\n element = this.fontColorDropDown.element;\n var fontBorder = element.querySelector('.' + this.tools['fontcolor'].icon);\n fontBorder.style.borderBottomColor = newProp.fontColor.default;\n break;\n }\n case 'mode':\n this.fontColorPicker.setProperties({ mode: newProp.fontColor.mode });\n break;\n case 'columns':\n this.fontColorPicker.setProperties({ columns: newProp.fontColor.columns });\n break;\n case 'colorCode':\n this.fontColorPicker.setProperties({ presetColors: newProp.fontColor.colorCode });\n break;\n case 'modeSwitcher':\n this.fontColorPicker.setProperties({ modeSwitcher: newProp.fontColor.modeSwitcher });\n break;\n }\n }\n }\n break;\n case 'backgroundColor':\n if (this.backgroundColorPicker) {\n for (var _d = 0, _e = Object.keys(newProp.backgroundColor); _d < _e.length; _d++) {\n var background = _e[_d];\n switch (background) {\n case 'default': {\n this.backgroundColorPicker.setProperties({ value: newProp.backgroundColor.default });\n element = this.backgroundColorDropDown.element;\n var backgroundBorder = element.querySelector('.' + this.tools['backgroundcolor'].icon);\n backgroundBorder.style.borderBottomColor = newProp.backgroundColor.default;\n break;\n }\n case 'mode':\n this.backgroundColorPicker.setProperties({ mode: newProp.backgroundColor.mode });\n break;\n case 'columns':\n this.backgroundColorPicker.setProperties({ columns: newProp.backgroundColor.columns });\n break;\n case 'colorCode':\n this.backgroundColorPicker.setProperties({ presetColors: newProp.backgroundColor.colorCode });\n break;\n case 'modeSwitcher':\n this.backgroundColorPicker.setProperties({ modeSwitcher: newProp.backgroundColor.modeSwitcher });\n break;\n }\n }\n }\n break;\n }\n }\n };\n ColorPickerInput.prototype.removeEventListener = function () {\n this.parent.off(events.toolbarRenderComplete, this.renderColorPickerInput);\n this.parent.off(events.destroy, this.destroy);\n this.parent.off(events.rtlMode, this.setRtl);\n this.parent.off(events.destroyColorPicker, this.destroyColorPicker);\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n this.parent.off(events.bindCssClass, this.setCssClass);\n this.parent.off(events.showColorPicker, this.showColorPicker);\n };\n return ColorPickerInput;\n}());\nexport { ColorPickerInput };\n","import { detach, getUniqueID, append, closest, selectAll, select, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, Browser, isNullOrUndefined, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { isCollide, Tooltip } from '@syncfusion/ej2-popups';\nimport * as events from '../base/constant';\nimport * as classes from '../base/classes';\nimport { RenderType } from '../base/enum';\nimport { setToolbarStatus, updateUndoRedoStatus, isIDevice } from '../base/util';\nimport { BaseToolbar } from './base-toolbar';\nimport { DropDownButtons } from './dropdown-buttons';\nimport { ColorPickerInput } from './color-picker';\n/**\n * `Quick toolbar` module is used to handle Quick toolbar actions.\n */\nvar BaseQuickToolbar = /** @class */ (function () {\n function BaseQuickToolbar(parent, locator) {\n this.parent = parent;\n this.locator = locator;\n this.isRendered = false;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);\n this.popupRenderer = this.renderFactory.getRenderer(RenderType.Popup);\n this.dropDownButtons = new DropDownButtons(this.parent, this.locator);\n this.colorPickerObj = new ColorPickerInput(this.parent, this.locator);\n }\n BaseQuickToolbar.prototype.appendPopupContent = function () {\n this.toolbarElement = this.parent.createElement('div', { className: classes.CLS_QUICK_TB });\n if (this.element.classList.contains(classes.CLS_TEXT_POP)) {\n this.toolbarElement.classList.add(classes.CLS_TEXT_QUICK_TB);\n }\n this.element.appendChild(this.toolbarElement);\n };\n /**\n * render method\n *\n * @param {IQuickToolbarOptions} args - specifies the arguments\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.render = function (args) {\n var className;\n if (args.popupType === 'Image') {\n className = classes.CLS_IMAGE_POP;\n }\n else if (args.popupType === 'Inline') {\n className = classes.CLS_INLINE_POP;\n }\n else if (args.popupType === 'Text') {\n className = classes.CLS_TEXT_POP;\n }\n else {\n className = '';\n }\n var popupId = getUniqueID(args.popupType + '_Quick_Popup');\n this.stringItems = args.toolbarItems;\n this.element = this.parent.createElement('div', { id: popupId, className: className + ' ' + classes.CLS_RTE_ELEMENTS });\n this.element.setAttribute('aria-owns', this.parent.getID());\n this.appendPopupContent();\n this.createToolbar(args.toolbarItems, args.mode, args.cssClass);\n this.popupRenderer.renderPopup(this);\n this.addEventListener();\n };\n BaseQuickToolbar.prototype.createToolbar = function (items, mode, cssClass) {\n this.quickTBarObj = new BaseToolbar(this.parent, this.locator);\n this.quickTBarObj.render({\n container: 'quick',\n target: this.toolbarElement,\n items: items,\n mode: mode,\n cssClass: cssClass\n });\n this.quickTBarObj.toolbarObj.refresh();\n };\n BaseQuickToolbar.prototype.setPosition = function (e) {\n var x;\n var y;\n var imgWrapper = closest(e.target, '.e-img-caption');\n var isAligned = (e.target.classList.contains('e-imginline') ||\n e.target.classList.contains('e-imgbreak')) ? false : true;\n var target = !isNOU(imgWrapper) ? imgWrapper : e.target;\n addClass([this.toolbarElement], [classes.CLS_RM_WHITE_SPACE]);\n var targetOffsetTop;\n if (!isNOU(closest(target, 'table'))) {\n targetOffsetTop = target.offsetTop;\n var parentTable = closest(target, 'table');\n while (!isNOU(parentTable)) {\n targetOffsetTop += parentTable.offsetTop;\n parentTable = closest(parentTable.parentElement, 'table');\n }\n }\n else {\n targetOffsetTop = (target.classList.contains(\"e-rte-audio\")) ? target.parentElement.offsetTop : target.offsetTop;\n }\n var parentOffsetTop = window.pageYOffset + e.parentData.top;\n if ((targetOffsetTop - e.editTop) > e.popHeight) {\n y = parentOffsetTop + e.tBarElementHeight + (targetOffsetTop - e.editTop) - e.popHeight - 5;\n }\n else if (((e.editTop + e.editHeight) - (targetOffsetTop + target.offsetHeight)) > e.popHeight) {\n y = parentOffsetTop + e.tBarElementHeight + (targetOffsetTop - e.editTop) + target.offsetHeight + 5;\n }\n else {\n y = e.y;\n }\n target = isAligned ? e.target : target;\n var targetOffsetLeft;\n if (!isNOU(closest(target, 'table'))) {\n targetOffsetLeft = target.offsetLeft;\n var parentTable = closest(target.parentElement, 'td');\n while (!isNOU(parentTable)) {\n targetOffsetLeft += parentTable.offsetLeft;\n parentTable = closest(parentTable.parentElement, 'table');\n }\n }\n else {\n targetOffsetLeft = (target.classList.contains(\"e-rte-audio\")) ? target.parentElement.offsetLeft : target.offsetLeft;\n }\n if (target.offsetWidth > e.popWidth) {\n x = (target.offsetWidth / 2) - (e.popWidth / 2) + e.parentData.left + targetOffsetLeft;\n }\n else {\n x = e.parentData.left + targetOffsetLeft;\n }\n this.popupObj.position.X = ((x + e.popWidth) > e.parentData.right) ? e.parentData.right - e.popWidth : x;\n this.popupObj.position.Y = (y >= 0) ? y : e.y + 5;\n this.popupObj.dataBind();\n removeClass([this.toolbarElement], [classes.CLS_RM_WHITE_SPACE]);\n };\n BaseQuickToolbar.prototype.checkCollision = function (e, viewPort, type) {\n var x;\n var y;\n var parentTop = e.parentData.top;\n var contentTop = e.windowY + parentTop + e.tBarElementHeight;\n var collision = [];\n if (viewPort === 'document') {\n collision = isCollide(e.popup);\n }\n else {\n collision = isCollide(e.popup, e.parentElement);\n }\n for (var i = 0; i < collision.length; i++) {\n switch (collision[i]) {\n case 'top':\n if (viewPort === 'document') {\n y = e.windowY;\n }\n else {\n y = (window.pageYOffset + parentTop) + e.tBarElementHeight;\n }\n break;\n case 'bottom': {\n var posY = void 0;\n if (viewPort === 'document') {\n if (type === 'inline' || type === 'text') {\n posY = (e.y - e.popHeight - 10);\n }\n else {\n if ((e.windowHeight - (parentTop + e.tBarElementHeight)) > e.popHeight) {\n if ((contentTop - e.windowHeight) > e.popHeight) {\n posY = (contentTop + (e.windowHeight - parentTop)) - e.popHeight;\n }\n else {\n posY = contentTop;\n }\n }\n else {\n posY = e.windowY + (parentTop + e.tBarElementHeight);\n }\n }\n }\n else {\n if (e.target.tagName !== 'IMG') {\n posY = (e.parentData.bottom + window.pageYOffset) - e.popHeight - 10;\n }\n else {\n posY = (e.parentData.bottom + window.pageYOffset) - e.popHeight - 5;\n }\n }\n y = posY;\n break;\n }\n case 'right':\n if (type === 'inline' || type === 'text') {\n x = window.pageXOffset + (e.windowWidth - (e.popWidth + e.bodyRightSpace + 10));\n }\n else {\n x = e.x - e.popWidth;\n }\n break;\n case 'left':\n if (type === 'inline' || type === 'text') {\n x = 0;\n }\n else {\n x = e.parentData.left;\n }\n break;\n }\n }\n this.popupObj.position.X = (x) ? x : this.popupObj.position.X;\n this.popupObj.position.Y = (y) ? y : this.popupObj.position.Y;\n this.popupObj.dataBind();\n };\n /**\n * showPopup method\n *\n * @param {number} x - specifies the x value\n * @param {number} y - specifies the y value\n * @param {Element} target - specifies the element\n * @param {string} type - specifies the type\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.showPopup = function (x, y, target, type) {\n var _this = this;\n var eventArgs = { popup: this.popupObj, cancel: false, targetElement: target,\n positionX: x, positionY: y };\n this.parent.trigger(events.beforeQuickToolbarOpen, eventArgs, function (beforeQuickToolbarArgs) {\n if (!beforeQuickToolbarArgs.cancel) {\n var editPanelTop = void 0;\n var editPanelHeight = void 0;\n var bodyStyle = window.getComputedStyle(document.body);\n var bodyRight = parseFloat(bodyStyle.marginRight.split('px')[0]) + parseFloat(bodyStyle.paddingRight.split('px')[0]);\n var windowHeight = window.innerHeight;\n var windowWidth = window.innerWidth;\n var parent_1 = _this.parent.element;\n var toolbarAvail = !isNullOrUndefined(_this.parent.getToolbar());\n var tbHeight = toolbarAvail && _this.parent.toolbarModule.getToolbarHeight();\n var expTBHeight = toolbarAvail && _this.parent.toolbarModule.getExpandTBarPopHeight();\n var tBarHeight = (toolbarAvail) ? (tbHeight + expTBHeight) : 0;\n addClass([_this.element], [classes.CLS_HIDE]);\n if (Browser.isDevice && !isIDevice()) {\n addClass([_this.parent.getToolbar()], [classes.CLS_HIDE]);\n }\n if (_this.parent.iframeSettings.enable) {\n var cntEle = _this.contentRenderer.getPanel().contentWindow;\n editPanelTop = cntEle.pageYOffset;\n editPanelHeight = cntEle.innerHeight;\n }\n else {\n var cntEle = closest(target, '.' + classes.CLS_RTE_CONTENT);\n editPanelTop = (cntEle) ? cntEle.scrollTop : 0;\n editPanelHeight = (cntEle) ? cntEle.offsetHeight : 0;\n }\n if ((!_this.parent.inlineMode.enable && !closest(target, 'table') && type !== 'text' && type !== 'link') || target.tagName === 'IMG') {\n _this.parent.disableToolbarItem(_this.parent.toolbarSettings.items);\n _this.parent.enableToolbarItem(['Undo', 'Redo']);\n }\n else {\n _this.parent.enableToolbarItem(_this.parent.toolbarSettings.items);\n }\n append([_this.element], document.body);\n if (_this.parent.showTooltip) {\n _this.tooltip = new Tooltip({\n target: '#' + _this.element.id + ' [title]',\n openDelay: 400,\n showTipPointer: true,\n beforeRender: _this.tooltipBeforeRender.bind(_this),\n windowCollision: true,\n position: 'BottomCenter',\n cssClass: _this.parent.getCssClass()\n });\n _this.tooltip.appendTo(_this.element);\n }\n _this.popupObj.position.X = beforeQuickToolbarArgs.positionX + 20;\n _this.popupObj.position.Y = beforeQuickToolbarArgs.positionY + 20;\n _this.popupObj.dataBind();\n _this.popupObj.element.classList.add('e-popup-open');\n _this.dropDownButtons.renderDropDowns({\n container: _this.toolbarElement,\n containerType: 'quick',\n items: _this.stringItems\n });\n _this.colorPickerObj.renderColorPickerInput({\n container: _this.toolbarElement,\n containerType: 'quick',\n items: _this.stringItems\n });\n var showPopupData = {\n x: x, y: y,\n target: target,\n editTop: editPanelTop,\n editHeight: editPanelHeight,\n popup: _this.popupObj.element,\n popHeight: _this.popupObj.element.offsetHeight,\n popWidth: _this.popupObj.element.offsetWidth,\n parentElement: parent_1,\n bodyRightSpace: bodyRight,\n windowY: window.pageYOffset,\n windowHeight: windowHeight,\n windowWidth: windowWidth,\n parentData: parent_1.getBoundingClientRect(),\n tBarElementHeight: tBarHeight\n };\n if ((closest(target, 'TABLE') || target.tagName === 'IMG' || target.tagName === 'AUDIO' || target.tagName === 'VIDEO' || target.tagName === 'IFRAME' || (target.classList &&\n (target.classList.contains(classes.CLS_AUDIOWRAP) || target.classList.contains(classes.CLS_CLICKELEM) ||\n target.classList.contains(classes.CLS_VID_CLICK_ELEM)))) && (x == beforeQuickToolbarArgs.positionX || y == beforeQuickToolbarArgs.positionY)) {\n _this.setPosition(showPopupData);\n }\n if (!_this.parent.inlineMode.enable) {\n _this.checkCollision(showPopupData, 'parent', '');\n }\n _this.checkCollision(showPopupData, 'document', ((_this.parent.inlineMode.enable) ? 'inline' : (type === 'text') ? 'text' : ''));\n _this.popupObj.element.classList.remove('e-popup-open');\n removeClass([_this.element], [classes.CLS_HIDE]);\n _this.popupObj.show({ name: 'ZoomIn', duration: (Browser.isIE ? 250 : 400) });\n if (_this.popupObj && _this.parent.cssClass) {\n removeClass([_this.popupObj.element], _this.parent.cssClass);\n addClass([_this.popupObj.element], _this.parent.cssClass);\n }\n setStyleAttribute(_this.element, {\n maxWidth: window.outerWidth + 'px'\n });\n addClass([_this.element], [classes.CLS_POP]);\n _this.isRendered = true;\n }\n });\n };\n BaseQuickToolbar.prototype.tooltipBeforeRender = function (args) {\n if (args.target.querySelector('.e-active')) {\n args.cancel = true;\n }\n };\n /**\n * hidePopup method\n *\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.hidePopup = function () {\n var viewSourcePanel = this.parent.sourceCodeModule.getViewPanel();\n if (Browser.isDevice && !isIDevice()) {\n removeClass([this.parent.getToolbar()], [classes.CLS_HIDE]);\n }\n if (!isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {\n if (!isNullOrUndefined(document.querySelector('#' + this.element.id + ' [data-tooltip-id]'))) {\n var tooltipTargetEle = document.querySelector('#' + this.element.id + ' [data-tooltip-id]');\n var dataContent = tooltipTargetEle.getAttribute('data-content');\n tooltipTargetEle.removeAttribute('data-content');\n tooltipTargetEle.setAttribute('title', dataContent);\n tooltipTargetEle.removeAttribute('data-tooltip-id');\n }\n this.tooltip.destroy();\n }\n else {\n if (!isNullOrUndefined(this.tooltip)) {\n this.tooltip.destroy();\n }\n }\n if (!isNullOrUndefined(this.parent.getToolbar()) && !this.parent.inlineMode.enable) {\n if (isNullOrUndefined(viewSourcePanel) || viewSourcePanel.style.display === 'none') {\n this.parent.enableToolbarItem(this.parent.toolbarSettings.items);\n }\n }\n this.removeEleFromDOM();\n this.isRendered = false;\n };\n /**\n * @param {string} item - specifies the string value\n * @param {number} index - specifies the index value\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.addQTBarItem = function (item, index) {\n this.quickTBarObj.toolbarObj.addItems(this.quickTBarObj.getItems(item, 'toolbar'), index);\n };\n /**\n * @param {number} index - specifies the index value\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.removeQTBarItem = function (index) {\n this.quickTBarObj.toolbarObj.removeItems(index);\n };\n BaseQuickToolbar.prototype.removeEleFromDOM = function () {\n var element = this.popupObj.element;\n if (this.isRendered) {\n this.dropDownButtons.destroyDropDowns();\n this.colorPickerObj.destroyColorPicker();\n removeClass([this.element], [classes.CLS_POP]);\n detach(element);\n var args = this.popupObj;\n this.parent.trigger(events.quickToolbarClose, args);\n }\n };\n BaseQuickToolbar.prototype.updateStatus = function (args) {\n var options = {\n args: args,\n dropDownModule: this.dropDownButtons,\n parent: this.parent,\n tbElements: selectAll('.' + classes.CLS_TB_ITEM, this.element),\n tbItems: this.quickTBarObj.toolbarObj.items\n };\n setToolbarStatus(options, true, this.parent);\n if (this.parent.quickToolbarSettings.text && this.parent.quickToolbarModule.textQTBar) {\n var options_1 = {\n args: args,\n dropDownModule: this.parent.quickToolbarModule.textQTBar.dropDownButtons,\n parent: this.parent,\n tbElements: selectAll('.' + classes.CLS_TB_ITEM, this.parent.quickToolbarModule.textQTBar.element),\n tbItems: this.parent.quickToolbarModule.textQTBar.quickTBarObj.toolbarObj.items\n };\n setToolbarStatus(options_1, true, this.parent);\n updateUndoRedoStatus(this.parent.quickToolbarModule.textQTBar.quickTBarObj, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());\n }\n if (!select('.' + classes.CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element)) {\n updateUndoRedoStatus(this.parent.getBaseToolbarObject(), this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());\n }\n };\n /**\n * Destroys the Quick toolbar.\n *\n * @function destroy\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.destroy = function () {\n if (this.popupObj && !this.popupObj.isDestroyed) {\n this.popupObj.destroy();\n this.removeEleFromDOM();\n }\n this.removeEventListener();\n };\n /**\n * addEventListener method\n *\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.destroy, this.destroy, this);\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n if (this.parent.inlineMode.enable || this.parent.quickToolbarSettings.text) {\n this.parent.on(events.toolbarUpdated, this.updateStatus, this);\n }\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {RichTextEditorModel} e - specifies the model element\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.onPropertyChanged = function (e) {\n if (!isNullOrUndefined(e.newProp.inlineMode)) {\n for (var _i = 0, _a = Object.keys(e.newProp.inlineMode); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'enable':\n if (e.newProp.inlineMode.enable) {\n this.parent.on(events.toolbarUpdated, this.updateStatus, this);\n }\n else {\n this.parent.off(events.toolbarUpdated, this.updateStatus);\n }\n break;\n }\n }\n }\n };\n /**\n * removeEventListener method\n *\n * @returns {void}\n * @hidden\n\n */\n BaseQuickToolbar.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.destroy, this.destroy);\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n if (this.parent.inlineMode.enable || this.parent.quickToolbarSettings.text) {\n this.parent.off(events.toolbarUpdated, this.updateStatus);\n }\n };\n return BaseQuickToolbar;\n}());\nexport { BaseQuickToolbar };\n","import { Popup } from '@syncfusion/ej2-popups';\nimport { CLS_QUICK_POP } from '../base/classes';\nimport * as events from '../base/constant';\n/**\n * `Popup renderer` module is used to render popup in RichTextEditor.\n *\n * @hidden\n\n */\nvar PopupRenderer = /** @class */ (function () {\n /**\n * Constructor for popup renderer module\n *\n * @param {IRichTextEditor} parent - specifies the parent.\n */\n function PopupRenderer(parent) {\n this.parent = parent;\n }\n PopupRenderer.prototype.quickToolbarOpen = function () {\n var args = this.popupObj;\n this.parent.trigger(events.quickToolbarOpen, args);\n };\n /**\n * renderPopup method\n *\n * @param {BaseQuickToolbar} args - specifies the arguments.\n * @returns {void}\n * @hidden\n\n */\n PopupRenderer.prototype.renderPopup = function (args) {\n this.setPanel(args.element);\n this.renderPanel();\n args.popupObj = new Popup(args.element, {\n targetType: 'relative',\n relateTo: this.parent.element,\n open: this.quickToolbarOpen.bind(this)\n });\n this.popupObj = args.popupObj;\n args.popupObj.hide();\n };\n /**\n * The function is used to add popup class in Quick Toolbar\n *\n * @returns {void}\n * @hidden\n\n */\n PopupRenderer.prototype.renderPanel = function () {\n this.getPanel().classList.add(CLS_QUICK_POP);\n };\n /**\n * Get the popup element of RichTextEditor\n *\n * @returns {Element} - specifies the element\n * @hidden\n\n */\n PopupRenderer.prototype.getPanel = function () {\n return this.popupPanel;\n };\n /**\n * Set the popup element of RichTextEditor\n *\n * @returns {void}\n * @param {Element} panel - specifies the element\n * @hidden\n\n */\n PopupRenderer.prototype.setPanel = function (panel) {\n this.popupPanel = panel;\n };\n return PopupRenderer;\n}());\nexport { PopupRenderer };\n","import { select, isNullOrUndefined, Browser, addClass, removeClass, EventHandler, closest, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport { RenderType } from '../base/enum';\nimport * as events from '../base/constant';\nimport { pageYOffset, hasClass, isIDevice } from '../base/util';\nimport { BaseQuickToolbar } from './base-quick-toolbar';\nimport { PopupRenderer } from '../renderer/popup-renderer';\nimport { CLS_INLINE_POP, CLS_INLINE, CLS_VID_CLICK_ELEM } from '../base/classes';\n/**\n * `Quick toolbar` module is used to handle Quick toolbar actions.\n */\nvar QuickToolbar = /** @class */ (function () {\n function QuickToolbar(parent, locator) {\n this.debounceTimeout = 1000;\n this.parent = parent;\n this.locator = locator;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.renderFactory.addRenderer(RenderType.Popup, new PopupRenderer(this.parent));\n this.addEventListener();\n }\n QuickToolbar.prototype.formatItems = function (items) {\n var formattedItems = [];\n items.forEach(function (item) {\n if (typeof item === 'string') {\n switch (item.toLocaleLowerCase()) {\n case 'open':\n formattedItems.push('openLink');\n break;\n case 'edit':\n formattedItems.push('editLink');\n break;\n case 'unlink':\n formattedItems.push('removeLink');\n break;\n default:\n formattedItems.push(item);\n break;\n }\n }\n else {\n formattedItems.push(item);\n }\n });\n return formattedItems;\n };\n QuickToolbar.prototype.getQTBarOptions = function (popType, mode, items, type) {\n return {\n popupType: popType,\n toolbarItems: items,\n mode: mode,\n renderType: type,\n cssClass: this.parent.getCssClass()\n };\n };\n /**\n * createQTBar method\n *\n * @param {string} popupType - specifies the string value\n * @param {string} mode - specifies the string value.\n * @param {string} items - specifies the string.\n * @param {RenderType} type - specifies the render type.\n * @returns {BaseQuickToolbar} - specifies the quick toolbar\n * @hidden\n\n */\n QuickToolbar.prototype.createQTBar = function (popupType, mode, items, type) {\n if (items.length < 1) {\n return null;\n }\n var qTBar = new BaseQuickToolbar(this.parent, this.locator);\n qTBar.render(this.getQTBarOptions(popupType, mode, this.formatItems(items), type));\n return qTBar;\n };\n QuickToolbar.prototype.initializeQuickToolbars = function () {\n this.parent.quickToolbarModule = this;\n this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);\n if (this.parent.inlineMode.enable && this.parent.inlineMode.onSelection && isIDevice()) {\n EventHandler.add(this.contentRenderer.getDocument(), 'selectionchange', this.selectionChangeHandler, this);\n }\n };\n // eslint-disable-next-line\n QuickToolbar.prototype.onMouseDown = function (e) {\n this.parent.isBlur = false;\n this.parent.isRTE = true;\n };\n QuickToolbar.prototype.keyUpQT = function (e) {\n if (e.which === 27) {\n this.hideQuickToolbars();\n }\n };\n QuickToolbar.prototype.renderQuickToolbars = function () {\n if (this.linkQTBar || this.imageQTBar || this.audioQTBar || this.videoQTBar || this.textQTBar || this.tableQTBar) {\n return;\n }\n this.linkQTBar = this.createQTBar('Link', 'Scrollable', this.parent.quickToolbarSettings.link, RenderType.LinkToolbar);\n this.renderFactory.addRenderer(RenderType.LinkToolbar, this.linkQTBar);\n if (!isNOU(this.parent.quickToolbarSettings.text) && !this.parent.inlineMode.enable) {\n this.textQTBar = this.createQTBar('Text', 'MultiRow', this.parent.quickToolbarSettings.text, RenderType.TextToolbar);\n this.renderFactory.addRenderer(RenderType.TextToolbar, this.textQTBar);\n }\n this.imageQTBar = this.createQTBar('Image', 'MultiRow', this.parent.quickToolbarSettings.image, RenderType.ImageToolbar);\n this.renderFactory.addRenderer(RenderType.ImageToolbar, this.imageQTBar);\n this.audioQTBar = this.createQTBar('Audio', 'MultiRow', this.parent.quickToolbarSettings.audio, RenderType.AudioToolbar);\n this.renderFactory.addRenderer(RenderType.AudioToolbar, this.audioQTBar);\n this.videoQTBar = this.createQTBar('Video', 'MultiRow', this.parent.quickToolbarSettings.video, RenderType.VideoToolbar);\n this.renderFactory.addRenderer(RenderType.VideoToolbar, this.videoQTBar);\n this.tableQTBar = this.createQTBar('Table', 'MultiRow', this.parent.quickToolbarSettings.table, RenderType.TableToolbar);\n this.renderFactory.addRenderer(RenderType.TableToolbar, this.tableQTBar);\n if (this.linkQTBar) {\n EventHandler.add(this.linkQTBar.element, 'mousedown', this.onMouseDown, this);\n EventHandler.add(this.linkQTBar.element, 'keyup', this.keyUpQT, this);\n }\n if (this.imageQTBar) {\n EventHandler.add(this.imageQTBar.element, 'mousedown', this.onMouseDown, this);\n EventHandler.add(this.imageQTBar.element, 'keyup', this.keyUpQT, this);\n }\n if (this.audioQTBar) {\n EventHandler.add(this.audioQTBar.element, 'mousedown', this.onMouseDown, this);\n EventHandler.add(this.audioQTBar.element, 'keyup', this.keyUpQT, this);\n }\n if (this.videoQTBar) {\n EventHandler.add(this.videoQTBar.element, 'mousedown', this.onMouseDown, this);\n EventHandler.add(this.videoQTBar.element, 'keyup', this.keyUpQT, this);\n }\n if (this.textQTBar) {\n EventHandler.add(this.textQTBar.element, 'mousedown', this.onMouseDown, this);\n EventHandler.add(this.textQTBar.element, 'keyup', this.keyUpQT, this);\n }\n if (this.tableQTBar) {\n EventHandler.add(this.tableQTBar.element, 'mousedown', this.onMouseDown, this);\n EventHandler.add(this.tableQTBar.element, 'keyup', this.keyUpQT, this);\n }\n };\n QuickToolbar.prototype.renderInlineQuickToolbar = function () {\n if (this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice())) {\n addClass([this.parent.element], [CLS_INLINE]);\n this.inlineQTBar = this.createQTBar('Inline', 'MultiRow', this.parent.toolbarSettings.items, RenderType.InlineToolbar);\n this.renderFactory.addRenderer(RenderType.InlineToolbar, this.inlineQTBar);\n EventHandler.add(this.inlineQTBar.element, 'mousedown', this.onMouseDown, this);\n EventHandler.add(this.inlineQTBar.element, 'keyup', this.keyUpQT, this);\n }\n };\n /**\n * Method for showing the inline quick toolbar\n *\n * @param {number} x -specifies the value of x.\n * @param {number} y - specifies the y valu.\n * @param {HTMLElement} target - specifies the target element.\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.showInlineQTBar = function (x, y, target) {\n if (isNOU(this.parent) || this.parent.readonly || target.tagName.toLowerCase() === 'img' || this.inlineQTBar.element.querySelector('.e-rte-color-content')) {\n return;\n }\n this.inlineQTBar.showPopup(x, y, target);\n };\n /**\n * Method for hidding the inline quick toolbar\n *\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.hideInlineQTBar = function () {\n if (this.inlineQTBar && !hasClass(this.inlineQTBar.element, 'e-popup-close')) {\n this.inlineQTBar.hidePopup();\n }\n };\n /**\n * Method for hidding the quick toolbar\n *\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.hideQuickToolbars = function () {\n if (this.linkQTBar && !hasClass(this.linkQTBar.element, 'e-popup-close') && document.body.contains(this.linkQTBar.element)) {\n this.linkQTBar.hidePopup();\n }\n if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close') && document.body.contains(this.textQTBar.element)) {\n this.textQTBar.hidePopup();\n }\n if (this.imageQTBar && !hasClass(this.imageQTBar.element, 'e-popup-close') && document.body.contains(this.imageQTBar.element)) {\n this.imageQTBar.hidePopup();\n }\n if (this.audioQTBar && !hasClass(this.audioQTBar.element, 'e-popup-close') && document.body.contains(this.audioQTBar.element)) {\n this.audioQTBar.hidePopup();\n }\n if (this.videoQTBar && !hasClass(this.videoQTBar.element, 'e-popup-close') && document.body.contains(this.videoQTBar.element)) {\n this.videoQTBar.hidePopup();\n }\n if (this.tableQTBar && !hasClass(this.tableQTBar.element, 'e-popup-close') && document.body.contains(this.tableQTBar.element)) {\n this.tableQTBar.hidePopup();\n }\n if (!isNOU(this.parent) && this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice())) {\n this.hideInlineQTBar();\n }\n };\n QuickToolbar.prototype.deBounce = function (x, y, target) {\n var _this = this;\n clearTimeout(this.deBouncer);\n this.deBouncer = window.setTimeout(function () {\n _this.showInlineQTBar(x, y, target);\n }, this.debounceTimeout);\n };\n QuickToolbar.prototype.mouseUpHandler = function (e) {\n if (this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice())) {\n var args = e.args.touches ?\n e.args.changedTouches[0] : e.args;\n var range = this.parent.getRange();\n var target = e.args.target;\n if (isNullOrUndefined(select('.' + CLS_INLINE_POP, document.body))) {\n if (isIDevice() && e.touchData && e.touchData.prevClientX !== e.touchData.clientX\n && e.touchData.prevClientY !== e.touchData.clientY) {\n return;\n }\n this.hideInlineQTBar();\n var parentLeft = this.parent.element.getBoundingClientRect().left;\n this.offsetX = this.parent.iframeSettings.enable ? window.pageXOffset + parentLeft + args.clientX : args.pageX;\n this.offsetY = pageYOffset(args, this.parent.element, this.parent.iframeSettings.enable);\n if (target.nodeName === 'TEXTAREA') {\n this.showInlineQTBar(this.offsetX, this.offsetY, target);\n }\n else {\n var closestAnchor = closest(target, 'a');\n target = closestAnchor ? closestAnchor : target;\n var startNode = this.parent.getRange().startContainer.parentElement;\n var endNode = this.parent.getRange().endContainer.parentElement;\n if ((isNOU(closest(startNode, 'A')) || isNOU(closest(endNode, 'A'))) && (!closest(target, 'td,th') || !range.collapsed) &&\n (target.tagName !== 'IMG' || this.parent.getRange().startOffset !== this.parent.getRange().endOffset)) {\n if (this.parent.inlineMode.onSelection && range.collapsed) {\n return;\n }\n this.target = target;\n this.showInlineQTBar(this.offsetX, this.offsetY, target);\n }\n }\n }\n }\n if (!isNOU(this.textQTBar) && !isNOU(this.parent.quickToolbarSettings.text) && !this.parent.inlineMode.enable) {\n if (!isNOU(e) && !isNOU(e.name) && e.name === 'sourceCodeMouseDown') {\n return;\n }\n var args = e.args.touches ?\n e.args.changedTouches[0] : e.args;\n var target = e.args.target;\n this.hideQuickToolbars();\n var parentLeft = this.parent.element.getBoundingClientRect().left;\n this.offsetX = this.parent.iframeSettings.enable ? this.parent.element.ownerDocument.documentElement.scrollLeft\n + parentLeft + args.clientX : args.pageX;\n this.offsetY = pageYOffset(args, this.parent.element, this.parent.iframeSettings.enable);\n var range = this.parent.getRange();\n if ((range.endContainer.parentElement.tagName === range.startContainer.parentElement.tagName && (range.startContainer.parentElement.tagName === 'A' && range.endContainer.parentElement.tagName === 'A')) ||\n (target.tagName === 'IMG') || (target.tagName === 'VIDEO' || this.isEmbedVidElem(target)) || (target.tagName === 'AUDIO') || (target.childNodes[0] && target.childNodes[0].nodeType === 1 && target.childNodes[0].classList.contains('e-rte-audio')) ||\n (this.parent.getRange().startOffset === this.parent.getRange().endOffset)) {\n return;\n }\n this.target = target;\n this.textQTBar.showPopup(this.offsetX, this.offsetY, target, 'text');\n }\n };\n QuickToolbar.prototype.isEmbedVidElem = function (target) {\n if ((target && target.nodeType !== 3 && target.nodeName !== 'BR' && (target.classList && target.classList.contains(CLS_VID_CLICK_ELEM))) ||\n (target && target.nodeName === 'IFRAME')) {\n return true;\n }\n else {\n return false;\n }\n };\n QuickToolbar.prototype.keyDownHandler = function (e) {\n var preventHide = e.args.altKey;\n if (this.parent.inlineMode.enable && e.args.metaKey && e.args.keyCode === 65) {\n this.showInlineQTBar(this.offsetX, this.offsetY, e.args.target);\n return;\n }\n if (!preventHide) {\n if ((this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice()))\n && !isNullOrUndefined(select('.' + CLS_INLINE_POP, document))) {\n this.hideInlineQTBar();\n }\n if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {\n this.textQTBar.hidePopup();\n }\n }\n };\n QuickToolbar.prototype.inlineQTBarMouseDownHandler = function () {\n if ((this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice()))\n && !isNullOrUndefined(select('.' + CLS_INLINE_POP, document))) {\n this.hideInlineQTBar();\n }\n if (!isNOU(this.parent.quickToolbarSettings.text)) {\n if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close') && document.body.contains(this.textQTBar.element)) {\n this.textQTBar.hidePopup();\n }\n }\n };\n QuickToolbar.prototype.keyUpHandler = function (e) {\n var args = e.args;\n if (this.parent.inlineMode.enable && !Browser.isDevice) {\n if (this.parent.inlineMode.onSelection) {\n if (this.parent.getSelection().length > 0) {\n if ((args.ctrlKey && args.keyCode === 65) || (args.shiftKey && (args.keyCode === 33 || args.keyCode === 34 ||\n args.keyCode === 35 || args.keyCode === 36 || args.keyCode === 37 || args.keyCode === 38 ||\n args.keyCode === 39 || args.keyCode === 40))) {\n this.showInlineQTBar(this.offsetX, this.offsetY, args.target);\n }\n }\n return;\n }\n this.deBounce(this.offsetX, this.offsetY, args.target);\n }\n if (this.parent.quickToolbarSettings.text && !Browser.isDevice) {\n if ((args.ctrlKey && args.keyCode === 65) || (args.shiftKey && (args.keyCode === 33 || args.keyCode === 34 ||\n args.keyCode === 35 || args.keyCode === 36 || args.keyCode === 37 || args.keyCode === 38 ||\n args.keyCode === 39 || args.keyCode === 40))) {\n this.textQTBar.showPopup(this.offsetX, this.offsetY, args.target, 'text');\n }\n }\n };\n QuickToolbar.prototype.selectionChangeHandler = function (e) {\n var _this = this;\n clearTimeout(this.deBouncer);\n this.deBouncer = window.setTimeout(function () {\n _this.onSelectionChange(e);\n }, this.debounceTimeout);\n };\n QuickToolbar.prototype.onSelectionChange = function (e) {\n if (!isNullOrUndefined(select('.' + CLS_INLINE_POP, document.body))) {\n return;\n }\n var selection = this.contentRenderer.getDocument().getSelection();\n if (!selection.isCollapsed) {\n this.mouseUpHandler({ args: e });\n }\n };\n /**\n * getInlineBaseToolbar method\n *\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.getInlineBaseToolbar = function () {\n return this.inlineQTBar && this.inlineQTBar.quickTBarObj;\n };\n /**\n * Destroys the ToolBar.\n *\n * @function destroy\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.destroy = function () {\n if (isNOU(this.parent)) {\n return;\n }\n if (this.linkQTBar) {\n EventHandler.remove(this.linkQTBar.element, 'mousedown', this.onMouseDown);\n EventHandler.remove(this.linkQTBar.element, 'keyup', this.keyUpQT);\n this.linkQTBar.destroy();\n }\n if (this.textQTBar) {\n EventHandler.remove(this.textQTBar.element, 'mousedown', this.onMouseDown);\n EventHandler.remove(this.textQTBar.element, 'keyup', this.keyUpQT);\n this.textQTBar.destroy();\n }\n if (this.imageQTBar) {\n EventHandler.remove(this.imageQTBar.element, 'mousedown', this.onMouseDown);\n EventHandler.remove(this.imageQTBar.element, 'keyup', this.keyUpQT);\n this.imageQTBar.destroy();\n }\n if (this.audioQTBar) {\n EventHandler.remove(this.audioQTBar.element, 'mousedown', this.onMouseDown);\n EventHandler.remove(this.audioQTBar.element, 'keyup', this.keyUpQT);\n this.audioQTBar.destroy();\n }\n if (this.videoQTBar) {\n EventHandler.remove(this.videoQTBar.element, 'mousedown', this.onMouseDown);\n EventHandler.remove(this.videoQTBar.element, 'keyup', this.keyUpQT);\n this.videoQTBar.destroy();\n }\n if (this.tableQTBar) {\n EventHandler.remove(this.tableQTBar.element, 'mousedown', this.onMouseDown);\n EventHandler.remove(this.tableQTBar.element, 'keyup', this.keyUpQT);\n this.tableQTBar.destroy();\n }\n if (this.inlineQTBar) {\n EventHandler.remove(this.inlineQTBar.element, 'mousedown', this.onMouseDown);\n EventHandler.remove(this.inlineQTBar.element, 'keyup', this.keyUpQT);\n if (isIDevice()) {\n EventHandler.remove(document, 'selectionchange', this.selectionChangeHandler);\n }\n this.inlineQTBar.destroy();\n }\n this.removeEventListener();\n };\n QuickToolbar.prototype.moduleDestroy = function () {\n this.parent = null;\n };\n QuickToolbar.prototype.wireInlineQTBarEvents = function () {\n this.parent.on(events.mouseUp, this.mouseUpHandler, this);\n this.parent.on(events.mouseDown, this.inlineQTBarMouseDownHandler, this);\n this.parent.on(events.keyDown, this.keyDownHandler, this);\n this.parent.on(events.keyUp, this.keyUpHandler, this);\n this.parent.on(events.sourceCodeMouseDown, this.mouseUpHandler, this);\n this.parent.on(events.renderInlineToolbar, this.renderInlineQuickToolbar, this);\n this.parent.on(events.moduleDestroy, this.moduleDestroy, this);\n };\n QuickToolbar.prototype.unWireInlineQTBarEvents = function () {\n this.parent.off(events.mouseUp, this.mouseUpHandler);\n this.parent.off(events.mouseDown, this.inlineQTBarMouseDownHandler);\n this.parent.off(events.keyDown, this.keyDownHandler);\n this.parent.off(events.keyUp, this.keyUpHandler);\n this.parent.off(events.sourceCodeMouseDown, this.mouseUpHandler);\n this.parent.off(events.renderInlineToolbar, this.renderInlineQuickToolbar);\n this.parent.off(events.moduleDestroy, this.moduleDestroy);\n };\n // eslint-disable-next-line\n QuickToolbar.prototype.toolbarUpdated = function (args) {\n if (this.linkQTBar && !hasClass(this.linkQTBar.element, 'e-popup-close')) {\n this.linkQTBar.hidePopup();\n }\n if (this.imageQTBar && !hasClass(this.imageQTBar.element, 'e-popup-close')) {\n this.imageQTBar.hidePopup();\n }\n if (this.audioQTBar && !hasClass(this.audioQTBar.element, 'e-popup-close')) {\n this.audioQTBar.hidePopup();\n }\n if (this.videoQTBar && !hasClass(this.videoQTBar.element, 'e-popup-close')) {\n this.videoQTBar.hidePopup();\n }\n if (this.tableQTBar && !hasClass(this.tableQTBar.element, 'e-popup-close')) {\n this.tableQTBar.hidePopup();\n }\n };\n /**\n * addEventListener\n *\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.initialEnd, this.initializeQuickToolbars, this);\n this.parent.on(events.mouseDown, this.renderQuickToolbars, this);\n this.parent.on(events.toolbarUpdated, this.toolbarUpdated, this);\n this.parent.on(events.drop, this.renderQuickToolbars, this);\n this.wireInlineQTBarEvents();\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n if (this.parent.quickToolbarSettings.actionOnScroll === 'hide') {\n this.parent.on(events.scroll, this.hideQuickToolbars, this);\n this.parent.on(events.contentscroll, this.hideQuickToolbars, this);\n }\n this.parent.on(events.focusChange, this.hideQuickToolbars, this);\n this.parent.on(events.iframeMouseDown, this.onIframeMouseDown, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.parent.on(events.keyDown, this.onKeyDown, this);\n this.parent.on(events.rtlMode, this.setRtl, this);\n this.parent.on(events.bindCssClass, this.setCssClass, this);\n this.parent.on(events.hidePopup, this.hideQuickToolbars, this);\n };\n QuickToolbar.prototype.onKeyDown = function (e) {\n var args = e.args;\n if (args.which === 8 || args.which === 46) {\n if (this.imageQTBar && !hasClass(this.imageQTBar.element, 'e-popup-close')) {\n this.imageQTBar.hidePopup();\n }\n if (this.audioQTBar && !hasClass(this.audioQTBar.element, 'e-popup-close')) {\n this.audioQTBar.hidePopup();\n }\n if (this.videoQTBar && !hasClass(this.videoQTBar.element, 'e-popup-close')) {\n this.videoQTBar.hidePopup();\n }\n if (this.tableQTBar && !hasClass(this.tableQTBar.element, 'e-popup-close')) {\n this.tableQTBar.hidePopup();\n }\n if (this.linkQTBar && !hasClass(this.linkQTBar.element, 'e-popup-close')) {\n this.linkQTBar.hidePopup();\n }\n if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {\n this.textQTBar.hidePopup();\n }\n }\n };\n QuickToolbar.prototype.onIframeMouseDown = function () {\n this.hideQuickToolbars();\n this.hideInlineQTBar();\n };\n QuickToolbar.prototype.updateCss = function (baseQTObj, e) {\n if (baseQTObj && e.cssClass) {\n if (isNullOrUndefined(e.oldCssClass && baseQTObj.quickTBarObj.toolbarObj.cssClass !== e.cssClass)) {\n baseQTObj.quickTBarObj.toolbarObj.setProperties({ cssClass: (baseQTObj.quickTBarObj.toolbarObj.cssClass + ' ' + e.cssClass).trim() });\n }\n else {\n baseQTObj.quickTBarObj.toolbarObj.setProperties({ cssClass: (baseQTObj.quickTBarObj.toolbarObj.cssClass.replace(e.oldCssClass, '').trim() + ' ' + e.cssClass).trim() });\n }\n }\n };\n QuickToolbar.prototype.setCssClass = function (e) {\n var baseQuickToolbarObj = [\n this.inlineQTBar, this.imageQTBar, this.linkQTBar, this.textQTBar, this.tableQTBar\n ];\n for (var i = 0; i < baseQuickToolbarObj.length; i++) {\n this.updateCss(baseQuickToolbarObj[i], e);\n }\n };\n QuickToolbar.prototype.setRtl = function (args) {\n if (this.inlineQTBar) {\n this.inlineQTBar.quickTBarObj.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.imageQTBar) {\n this.imageQTBar.quickTBarObj.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.audioQTBar) {\n this.audioQTBar.quickTBarObj.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.videoQTBar) {\n this.videoQTBar.quickTBarObj.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.linkQTBar) {\n this.linkQTBar.quickTBarObj.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n if (this.textQTBar) {\n this.textQTBar.quickTBarObj.toolbarObj.setProperties({ enableRtl: args.enableRtl });\n }\n };\n /**\n * removeEventListener\n *\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.removeEventListener = function () {\n if (this.deBouncer) {\n clearTimeout(this.deBouncer);\n }\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.initialEnd, this.initializeQuickToolbars);\n this.parent.off(events.mouseDown, this.renderQuickToolbars);\n this.parent.off(events.toolbarUpdated, this.toolbarUpdated);\n this.parent.off(events.drop, this.renderQuickToolbars);\n this.unWireInlineQTBarEvents();\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n if (this.parent.quickToolbarSettings.actionOnScroll === 'hide') {\n this.parent.off(events.scroll, this.hideQuickToolbars);\n this.parent.off(events.contentscroll, this.hideQuickToolbars);\n }\n this.parent.off(events.focusChange, this.hideQuickToolbars);\n this.parent.off(events.destroy, this.destroy);\n this.parent.off(events.iframeMouseDown, this.onIframeMouseDown);\n this.parent.off(events.keyDown, this.onKeyDown);\n this.parent.off(events.rtlMode, this.setRtl);\n this.parent.off(events.bindCssClass, this.setCssClass);\n this.parent.off(events.hidePopup, this.hideQuickToolbars);\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {RichTextEditorModel} e - specifies the element.\n * @returns {void}\n * @hidden\n\n */\n QuickToolbar.prototype.onPropertyChanged = function (e) {\n if (!isNullOrUndefined(e.newProp.quickToolbarSettings)) {\n for (var _i = 0, _a = Object.keys(e.newProp.quickToolbarSettings); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'actionOnScroll':\n if (e.newProp.quickToolbarSettings.actionOnScroll === 'none') {\n this.parent.off(events.scroll, this.hideQuickToolbars);\n this.parent.off(events.contentscroll, this.hideQuickToolbars);\n }\n else {\n this.parent.on(events.scroll, this.hideQuickToolbars, this);\n this.parent.on(events.contentscroll, this.hideQuickToolbars, this);\n }\n break;\n }\n }\n }\n if (e.module !== this.getModuleName()) {\n return;\n }\n if (this.inlineQTBar) {\n removeClass([this.parent.element], [CLS_INLINE]);\n this.unWireInlineQTBarEvents();\n this.hideInlineQTBar();\n }\n if (this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice())) {\n addClass([this.parent.element], [CLS_INLINE]);\n this.wireInlineQTBarEvents();\n }\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {void}\n * @hidden\n */\n QuickToolbar.prototype.getModuleName = function () {\n return 'quickToolbar';\n };\n /**\n *\n * @returns {BaseQuickToolbar[]} - specifies the quick toolbar instance.\n * @hidden\n * @private\n */\n QuickToolbar.prototype.getQuickToolbarInstance = function () {\n return [this.linkQTBar, this.imageQTBar, this.audioQTBar, this.videoQTBar, this.tableQTBar, this.textQTBar, this.inlineQTBar];\n };\n return QuickToolbar;\n}());\nexport { QuickToolbar };\n","import * as events from '../base/constant';\nimport { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\n/**\n * `ExecCommandCallBack` module is used to run the editor manager command\n */\nvar ExecCommandCallBack = /** @class */ (function () {\n function ExecCommandCallBack(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n ExecCommandCallBack.prototype.addEventListener = function () {\n this.parent.on(events.execCommandCallBack, this.commandCallBack, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n ExecCommandCallBack.prototype.commandCallBack = function (args) {\n var formatPainterCopy = !isNOU(args.requestType) && args.requestType === 'FormatPainter' && args.action === 'format-copy';\n if (!isNOU(args) && !isNOU(args.requestType) && args.requestType !== 'Undo' && args.requestType !== 'Redo' && !formatPainterCopy) {\n this.parent.formatter.saveData();\n }\n this.parent.notify(events.toolbarRefresh, { args: args });\n this.parent.notify(events.count, {});\n };\n ExecCommandCallBack.prototype.removeEventListener = function () {\n this.parent.off(events.execCommandCallBack, this.commandCallBack);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n return ExecCommandCallBack;\n}());\nexport { ExecCommandCallBack };\n","/**\n * Constant values for Common\n */\n/**\n * Keydown event trigger\n *\n * @hidden\n */\nexport var KEY_DOWN = 'keydown';\n/**\n * Undo and Redo action HTML plugin events\n *\n * @hidden\n */\nexport var ACTION = 'action';\n/**\n * Formats plugin events\n *\n * @hidden\n */\nexport var FORMAT_TYPE = 'format-type';\n/**\n * Keydown handler event trigger\n *\n * @hidden\n */\nexport var KEY_DOWN_HANDLER = 'keydown-handler';\n/**\n * List plugin events\n *\n * @hidden\n */\nexport var LIST_TYPE = 'list-type';\n/**\n * Keyup handler event trigger\n *\n * @hidden\n */\nexport var KEY_UP_HANDLER = 'keyup-handler';\n/**\n * Keyup event trigger\n *\n * @hidden\n */\nexport var KEY_UP = 'keyup';\n/**\n * Model changed plugin event trigger\n *\n * @hidden\n */\nexport var MODEL_CHANGED_PLUGIN = 'model_changed_plugin';\n/**\n * Model changed event trigger\n *\n * @hidden\n */\nexport var MODEL_CHANGED = 'model_changed';\n/**\n * PasteCleanup plugin for MSWord content\n *\n * @hidden\n */\nexport var MS_WORD_CLEANUP_PLUGIN = 'ms_word_cleanup_plugin';\n/**\n * PasteCleanup for MSWord content\n *\n * @hidden\n */\nexport var MS_WORD_CLEANUP = 'ms_word_cleanup';\n/**\n * ActionBegin event callback\n *\n * @hidden\n */\nexport var ON_BEGIN = 'onBegin';\n/**\n * Callback for spacelist action\n *\n * @hidden\n */\nexport var SPACE_ACTION = 'actionBegin';\n/**\n * Format painter event constant\n *\n * @hidden\n */\nexport var FORMAT_PAINTER_ACTIONS = 'format_painter_actions';\n/**\n * Emoji picker event constant\n *\n * @hidden\n */\nexport var EMOJI_PICKER_ACTIONS = 'emoji_picker_actions';\n/**\n * Mouse down event constant\n *\n * @hidden\n */\nexport var MOUSE_DOWN = 'mouseDown';\n","import { extend, isNullOrUndefined as isNOU, Browser, closest } from '@syncfusion/ej2-base';\nimport * as CONSTANT from '../base/constant';\nimport { updateUndoRedoStatus, isIDevice } from '../base/util';\nimport { KEY_DOWN, KEY_UP } from './../../common/constant';\n/**\n * Formatter\n *\n * @hidden\n\n */\nvar Formatter = /** @class */ (function () {\n function Formatter() {\n }\n /**\n * To execute the command\n *\n * @param {IRichTextEditor} self - specifies the self element.\n * @param {ActionBeginEventArgs} args - specifies the event arguments.\n * @param {MouseEvent|KeyboardEvent} event - specifies the keyboard event.\n * @param {IItemCollectionArgs} value - specifies the collection arguments\n * @returns {void}\n * @hidden\n\n */\n Formatter.prototype.process = function (self, args, event, value) {\n var _this = this;\n var selection = self.contentModule.getDocument().getSelection();\n var range = (selection.rangeCount > 0) ? selection.getRangeAt(selection.rangeCount - 1) : null;\n var saveSelection;\n var newRange;\n if (!isNOU(value) && !isNOU(value.selection)) {\n newRange = value.selection.range;\n }\n var isKeyboardVideoInsert = (!isNOU(value) && !isNOU(value.cssClass) &&\n value.cssClass !== 'e-video-inline');\n if (self.editorMode === 'HTML') {\n if (!isNOU(args) && !isKeyboardVideoInsert) {\n if (isNOU(args.name) || (!isNOU(args.name) && args.name !== 'showDialog')) {\n if (newRange) {\n saveSelection = this.editorManager.nodeSelection.save(newRange, self.contentModule.getDocument());\n }\n else {\n saveSelection = this.editorManager.nodeSelection.save(range, self.contentModule.getDocument());\n }\n }\n }\n }\n if (!isNOU(args)\n && args.item.command\n && args.item.command !== 'Table'\n && args.item.command !== 'Actions'\n && args.item.command !== 'Links'\n && args.item.command !== 'Images'\n && args.item.command !== 'Files'\n && args.item.command !== 'Audios'\n && args.item.command !== 'Videos'\n && args.item.command !== 'EmojiPicker'\n && range\n && !(self.contentModule.getEditPanel().contains(this.getAncestorNode(range.commonAncestorContainer))\n || self.contentModule.getEditPanel() === range.commonAncestorContainer\n || self.contentModule.getPanel() === range.commonAncestorContainer)) {\n return;\n }\n if (!isNOU(args) && self.maxLength !== -1 && !isNOU(args.item.command)) {\n var currentInsertContentLength = 0;\n if (args.item.command === 'Links') {\n currentInsertContentLength = value.text.length === 0 ? value.url.length : value.text.length;\n }\n if (args.item.command === 'Images' || args.item.command === 'Videos' || args.item.command === 'Table' || args.item.command === 'Files') {\n currentInsertContentLength = 1;\n }\n var currentLength = self.getText().trim().replace(/(\\r\\n|\\n|\\r|\\t)/gm, '').replace(/\\u200B/g, '').length;\n var selectionLength = self.getSelection().length;\n var totalLength = (currentLength - selectionLength) + currentInsertContentLength;\n if (!(self.maxLength === -1 || totalLength <= self.maxLength)) {\n return;\n }\n }\n if (isNOU(args)) {\n var action_1 = event.action;\n args = {};\n var items = {\n originalEvent: event, cancel: false,\n requestType: action_1 || (event.key + 'Key'),\n itemCollection: value\n };\n extend(args, args, items, true);\n if (action_1 !== 'tab' && action_1 !== 'enter' && action_1 !== 'space' && action_1 !== 'escape') {\n if (self.editorMode === 'Markdown' && action_1 === 'insert-table') {\n value = {\n 'headingText': self.localeObj.getConstant('TableHeadingText'),\n 'colText': self.localeObj.getConstant('TableColText')\n };\n }\n self.trigger(CONSTANT.actionBegin, args, function (actionBeginArgs) {\n if (actionBeginArgs.cancel) {\n if (action_1 === 'paste' || action_1 === 'cut' || action_1 === 'copy') {\n event.preventDefault();\n }\n }\n });\n }\n if (!args.cancel) {\n var isTableModule = isNOU(self.tableModule) ? true : self.tableModule ?\n self.tableModule.ensureInsideTableList : false;\n if ((event.which === 9 && isTableModule) || event.which !== 9) {\n if (event.which === 13 && self.editorMode === 'HTML') {\n value = {\n 'enterAction': self.enterKey\n };\n }\n this.editorManager.observer.notify((event.type === 'keydown' ? KEY_DOWN : KEY_UP), {\n event: event,\n callBack: this.onSuccess.bind(this, self),\n value: value,\n enterAction: self.enterKey\n });\n }\n }\n }\n else if (!isNOU(args) && args.item.command && args.item.subCommand && ((args.item.command !== args.item.subCommand\n && args.item.command !== 'Font')\n || ((args.item.subCommand === 'FontName' || args.item.subCommand === 'FontSize') && args.name === 'dropDownSelect')\n || ((args.item.subCommand === 'BackgroundColor' || args.item.subCommand === 'FontColor')\n && args.name === 'colorPickerChanged') || args.item.subCommand === 'FormatPainter' || args.item.subCommand === 'EmojiPicker')) {\n extend(args, args, { requestType: args.item.subCommand, cancel: false, itemCollection: value, selectType: args.name }, true);\n self.trigger(CONSTANT.actionBegin, args, function (actionBeginArgs) {\n if (!actionBeginArgs.cancel) {\n var formatPainterCopy = !isNOU(actionBeginArgs.requestType) && actionBeginArgs.requestType === 'FormatPainter' && actionBeginArgs.name === 'format-copy';\n var formatPainterPaste = !isNOU(actionBeginArgs.requestType) && actionBeginArgs.requestType === 'FormatPainter' && actionBeginArgs.name === 'format-paste';\n if ((_this.getUndoRedoStack().length === 0 && actionBeginArgs.item.command !== 'Links' && actionBeginArgs.item.command !== 'Images' && !formatPainterCopy)\n || formatPainterPaste) {\n _this.saveData();\n }\n self.isBlur = false;\n var quickToolbarAction = !isNOU(event) && !isNOU(event.target) && (!isNOU(closest(event.target, \".e-rte-elements.e-dropdown-popup.e-rte-dropdown-popup.e-quick-dropdown.e-popup-open\")) || !isNOU(closest(event.target, \".e-rte-elements.e-rte-quick-popup.e-popup-open\")));\n if (isNOU(saveSelection) || (!quickToolbarAction && (isNOU(closest(saveSelection.range.startContainer.parentElement, \".e-img-caption\")) ? true : !(closest(saveSelection.range.startContainer.parentElement, \".e-img-caption\").getAttribute(\"contenteditable\") == \"false\")))) {\n self.contentModule.getEditPanel().focus();\n }\n if (self.editorMode === 'HTML' && !isKeyboardVideoInsert) {\n if (isNOU(args.selectType) || (!isNOU(args.selectType) && args.selectType !== 'showDialog')) {\n saveSelection.restore();\n }\n }\n var command = actionBeginArgs.item.subCommand.toLocaleLowerCase();\n if (command === 'paste' || command === 'cut' || command === 'copy') {\n self.clipboardAction(command, event);\n }\n else {\n _this.editorManager.observer.notify(CONSTANT.checkUndo, { subCommand: actionBeginArgs.item.subCommand });\n _this.editorManager.execCommand(actionBeginArgs.item.command, actionBeginArgs.item.subCommand, event, _this.onSuccess.bind(_this, self), actionBeginArgs.item.value, actionBeginArgs.item.subCommand === 'Pre' && actionBeginArgs.selectType === 'dropDownSelect' ?\n { name: actionBeginArgs.selectType } : value, ('#' + self.getID() + ' iframe'), self.enterKey);\n }\n }\n });\n }\n if ((isNOU(event) || event && event.action !== 'copy')) {\n this.enableUndo(self);\n }\n };\n Formatter.prototype.getAncestorNode = function (node) {\n node = node.nodeType === 3 ? node.parentNode : node;\n return node;\n };\n /**\n * onKeyHandler method\n *\n * @param {IRichTextEditor} self - specifies the self element.\n * @param {KeyboardEvent} e - specifies the keyboard event.\n * @returns {void}\n * @hidden\n\n */\n Formatter.prototype.onKeyHandler = function (self, e) {\n var _this = this;\n this.editorManager.observer.notify(KEY_UP, {\n event: e, callBack: function () {\n self.notify(CONSTANT.contentChanged, {});\n _this.enableUndo(self);\n },\n enterAction: self.enterKey\n });\n };\n /**\n * onSuccess method\n *\n * @param {IRichTextEditor} self - specifies the self element.\n * @param {IMarkdownFormatterCallBack} events - specifies the event call back\n * @returns {void}\n * @hidden\n\n */\n Formatter.prototype.onSuccess = function (self, events) {\n self.notify(CONSTANT.contentChanged, {});\n if (events && (isNOU(events.event) || events.event.action !== 'copy')) {\n this.enableUndo(self);\n self.notify(CONSTANT.execCommandCallBack, events);\n }\n self.trigger(CONSTANT.actionComplete, events, function (callbackArgs) {\n self.setPlaceHolder();\n if ((callbackArgs.requestType === 'Images' || callbackArgs.requestType === 'Links' || callbackArgs.requestType === 'Audios' || callbackArgs.requestType === 'Videos') && self.editorMode === 'HTML') {\n var args = callbackArgs;\n if (callbackArgs.requestType === 'Links' && callbackArgs.event &&\n callbackArgs.event.type === 'keydown' &&\n callbackArgs.event.keyCode === 32) {\n return;\n }\n self.notify(CONSTANT.insertCompleted, {\n args: args.event, type: callbackArgs.requestType, isNotify: true,\n elements: args.elements\n });\n }\n if (callbackArgs.requestType === 'VideosPlayPause') {\n self.notify('editAreaClick', { args: event });\n }\n self.autoResize();\n });\n };\n /**\n * Save the data for undo and redo action.\n *\n * @param {KeyboardEvent} e - specifies the keyboard event.\n * @returns {void}\n * @hidden\n\n */\n Formatter.prototype.saveData = function (e) {\n this.editorManager.undoRedoManager.saveData(e);\n };\n /**\n * getUndoStatus method\n *\n * @returns {void}\n * @hidden\n\n */\n Formatter.prototype.getUndoStatus = function () {\n return this.editorManager.undoRedoManager.getUndoStatus();\n };\n /* eslint-disable */\n /**\n * getUndoRedoStack method\n *\n * @param {IHtmlUndoRedoData} - specifies the redo data.\n * @returns {void}\n * @hidden\n\n */\n /* eslint-enable */\n Formatter.prototype.getUndoRedoStack = function () {\n return this.editorManager.undoRedoManager.undoRedoStack;\n };\n /**\n * enableUndo method\n *\n * @param {IRichTextEditor} self - specifies the self element.\n * @returns {void}\n * @hidden\n\n */\n Formatter.prototype.enableUndo = function (self) {\n var status = this.getUndoStatus();\n if (self.inlineMode.enable && (!Browser.isDevice || isIDevice())) {\n updateUndoRedoStatus(self.quickToolbarModule.inlineQTBar.quickTBarObj, status);\n }\n else {\n if (self.toolbarModule) {\n updateUndoRedoStatus(self.toolbarModule.baseToolbar, status);\n }\n }\n };\n return Formatter;\n}());\nexport { Formatter };\n","/**\n * Default Markdown formats config for adapter\n */\nexport var markdownFormatTags = {\n 'h6': '###### ',\n 'h5': '##### ',\n 'h4': '#### ',\n 'h3': '### ',\n 'h2': '## ',\n 'h1': '# ',\n 'blockquote': '> ',\n 'pre': '```\\n',\n 'p': ''\n};\n/**\n * Default selection formats config for adapter\n */\nexport var markdownSelectionTags = {\n 'Bold': '**',\n 'Italic': '*',\n 'StrikeThrough': '~~',\n 'InlineCode': '`',\n 'SubScript': '',\n 'SuperScript': '',\n 'UpperCase': 'A-Z',\n 'LowerCase': 'a-z'\n};\n/**\n * Default Markdown lists config for adapter\n */\nexport var markdownListsTags = {\n 'OL': '1. ',\n 'UL': '- '\n};\n/**\n * Default html key config for adapter\n */\nexport var htmlKeyConfig = {\n 'toolbar-focus': 'alt+f10',\n 'escape': '27',\n 'insert-link': 'ctrl+k',\n 'insert-image': 'ctrl+shift+i',\n 'insert-audio': 'ctrl+shift+a',\n 'insert-video': 'ctrl+alt+v',\n 'insert-table': 'ctrl+shift+e',\n 'undo': 'ctrl+z',\n 'redo': 'ctrl+y',\n 'copy': 'ctrl+c',\n 'cut': 'ctrl+x',\n 'paste': 'ctrl+v',\n 'bold': 'ctrl+b',\n 'italic': 'ctrl+i',\n 'underline': 'ctrl+u',\n 'strikethrough': 'ctrl+shift+s',\n 'uppercase': 'ctrl+shift+u',\n 'lowercase': 'ctrl+shift+l',\n 'superscript': 'ctrl+shift+=',\n 'subscript': 'ctrl+=',\n 'indents': 'ctrl+]',\n 'outdents': 'ctrl+[',\n 'html-source': 'ctrl+shift+h',\n 'full-screen': 'ctrl+shift+f',\n 'decrease-fontsize': 'ctrl+shift+<',\n 'increase-fontsize': 'ctrl+shift+>',\n 'justify-center': 'ctrl+e',\n 'justify-full': 'ctrl+j',\n 'justify-left': 'ctrl+l',\n 'justify-right': 'ctrl+r',\n 'clear-format': 'ctrl+shift+r',\n 'ordered-list': 'ctrl+shift+o',\n 'unordered-list': 'ctrl+alt+o',\n 'space': '32',\n 'enter': '13',\n 'tab': 'tab',\n 'delete': '46',\n 'format-copy': 'alt+shift+c',\n 'format-paste': 'alt+shift+v'\n};\n/**\n * Default markdown key config for adapter\n */\nexport var markdownKeyConfig = {\n 'toolbar-focus': 'alt+f10',\n 'escape': '27',\n 'insert-link': 'ctrl+k',\n 'insert-image': 'ctrl+shift+i',\n 'insert-table': 'ctrl+shift+e',\n 'undo': 'ctrl+z',\n 'redo': 'ctrl+y',\n 'copy': 'ctrl+c',\n 'cut': 'ctrl+x',\n 'paste': 'ctrl+v',\n 'bold': 'ctrl+b',\n 'italic': 'ctrl+i',\n 'strikethrough': 'ctrl+shift+s',\n 'uppercase': 'ctrl+shift+u',\n 'lowercase': 'ctrl+shift+l',\n 'superscript': 'ctrl+shift+=',\n 'subscript': 'ctrl+=',\n 'full-screen': 'ctrl+shift+f',\n 'ordered-list': 'ctrl+shift+o',\n 'unordered-list': 'ctrl+alt+o'\n};\n/**\n * PasteCleanup Grouping of similar functionality tags\n */\nexport var pasteCleanupGroupingTags = {\n 'b': ['strong'],\n 'strong': ['b'],\n 'i': ['emp', 'cite'],\n 'emp': ['i', 'cite'],\n 'cite': ['i', 'emp']\n};\n/**\n * PasteCleanup Grouping of similar functionality tags\n */\nexport var listConversionFilters = {\n 'first': 'MsoListParagraphCxSpFirst',\n 'middle': 'MsoListParagraphCxSpMiddle',\n 'last': 'MsoListParagraphCxSpLast'\n};\n/**\n * Dom-Node Grouping of self closing tags\n *\n * @hidden\n */\nexport var selfClosingTags = [\n 'BR',\n 'IMG'\n];\n/**\n * Resize factor for image.\n * @hidden\n *\n */\nexport var imageResizeFactor = {\n topLeft: [-1, -1],\n topRight: [1, -1],\n botRight: [1, 1],\n botLeft: [-1, 1]\n};\n","import * as CONSTANT from './../base/constant';\nimport { append, detach, createElement, isNullOrUndefined as isNOU, closest } from '@syncfusion/ej2-base';\nimport { NodeSelection } from './../../selection/index';\nimport { selfClosingTags } from '../../common/config';\nimport { getLastTextNode } from '../../common/util';\nexport var markerClassName = {\n startSelection: 'e-editor-select-start',\n endSelection: 'e-editor-select-end'\n};\n/**\n * DOMNode internal plugin\n *\n * @hidden\n\n */\nvar DOMNode = /** @class */ (function () {\n /**\n * Constructor for creating the DOMNode plugin\n *\n * @param {Element} parent - specifies the parent element\n * @param {Document} currentDocument - specifies the current document.\n * @hidden\n\n */\n function DOMNode(parent, currentDocument) {\n this.parent = parent;\n this.nodeSelection = new NodeSelection();\n this.currentDocument = currentDocument;\n }\n /**\n * contents method\n *\n * @param {Element} element - specifies the element.\n * @returns {void}\n * @hidden\n\n */\n DOMNode.prototype.contents = function (element) {\n return (element && 'IFRAME' !== element.tagName ? Array.prototype.slice.call(element.childNodes || []) : []);\n };\n /**\n * isBlockNode method\n *\n * @param {Element} element - specifies the node element.\n * @returns {boolean} - sepcifies the boolean value\n * @hidden\n\n */\n DOMNode.prototype.isBlockNode = function (element) {\n return (!!element && (element.nodeType === Node.ELEMENT_NODE && CONSTANT.BLOCK_TAGS.indexOf(element.tagName.toLowerCase()) >= 0));\n };\n /**\n * isLink method\n *\n * @param {Element} element - specifies the element\n * @returns {boolean} - specifies the boolean value\n * @hidden\n\n */\n DOMNode.prototype.isLink = function (element) {\n return (!!element && (element.nodeType === Node.ELEMENT_NODE && 'a' === element.tagName.toLowerCase()));\n };\n /**\n * blockParentNode method\n *\n * @param {Element} element - specifies the element\n * @returns {Element} - returns the element value\n * @hidden\n\n */\n DOMNode.prototype.blockParentNode = function (element) {\n for (; element && element.parentNode !== this.parent && ((!element.parentNode ||\n !this.hasClass(element.parentNode, 'e-node-inner'))); null) {\n element = element.parentNode;\n if (this.isBlockNode(element)) {\n return element;\n }\n }\n return element;\n };\n /**\n * rawAttributes method\n *\n * @param {Element} element - specifies the element\n * @returns {string} - returns the string value\n * @hidden\n\n */\n DOMNode.prototype.rawAttributes = function (element) {\n var rawAttr = {};\n var attributes = element.attributes;\n if (attributes.length > 0) {\n for (var d = 0; d < attributes.length; d++) {\n var e = attributes[d];\n rawAttr[e.nodeName] = e.value;\n }\n }\n return rawAttr;\n };\n /**\n * attributes method\n *\n * @param {Element} element - sepcifies the element.\n * @returns {string} - returns the string value.\n * @hidden\n\n */\n DOMNode.prototype.attributes = function (element) {\n if (!element) {\n return '';\n }\n var attr = '';\n var rawAttr = this.rawAttributes(element);\n var orderRawAttr = Object.keys(rawAttr).sort();\n for (var e = 0; e < orderRawAttr.length; e++) {\n var attrKey = orderRawAttr[e];\n var attrValue = rawAttr[\"\" + attrKey];\n /* eslint-disable */\n if (attrValue.indexOf(\"'\") < 0 && attrValue.indexOf('\"') >= 0) {\n attr += ' ' + attrKey + \"='\" + attrValue + \"'\";\n }\n else if (attrValue.indexOf('\"') >= 0 && attrValue.indexOf(\"'\") >= 0) {\n /* eslint-enable */\n attrValue = attrValue.replace(/\"/g, '"');\n attr += ' ' + attrKey + '=\"' + attrValue + '\"';\n }\n else {\n attr += ' ' + attrKey + '=\"' + attrValue + '\"';\n }\n }\n return attr;\n };\n /**\n * clearAttributes method\n *\n * @param {Element} element - specifies the element\n * @returns {void}\n * @hidden\n\n */\n DOMNode.prototype.clearAttributes = function (element) {\n for (var attr = element.attributes, c = attr.length - 1; c >= 0; c--) {\n var key = attr[c];\n element.removeAttribute(key.nodeName);\n }\n };\n /**\n * openTagString method\n *\n * @param {Element} element - specifies the element.\n * @returns {string} - returns the string\n * @hidden\n\n */\n DOMNode.prototype.openTagString = function (element) {\n return '<' + element.tagName.toLowerCase() + this.attributes(element) + '>';\n };\n /**\n * closeTagString method\n *\n * @param {Element} element - specifies the element\n * @returns {string} - returns the string value\n * @hidden\n\n */\n DOMNode.prototype.closeTagString = function (element) {\n return '';\n };\n /**\n * createTagString method\n *\n * @param {string} tagName - specifies the tag name\n * @param {Element} relativeElement - specifies the relative element\n * @param {string} innerHTML - specifies the string value\n * @returns {string} - returns the string value.\n * @hidden\n\n */\n DOMNode.prototype.createTagString = function (tagName, relativeElement, innerHTML) {\n return '<' + tagName.toLowerCase() + this.attributes(relativeElement) + '>' + innerHTML + '';\n };\n /**\n * isList method\n *\n * @param {Element} element - specifes the element.\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n DOMNode.prototype.isList = function (element) {\n return !!element && ['UL', 'OL'].indexOf(element.tagName) >= 0;\n };\n /**\n * isElement method\n *\n * @param {Element} element - specifes the element.\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n DOMNode.prototype.isElement = function (element) {\n return element === this.parent;\n };\n /**\n * isEditable method\n *\n * @param {Element} element - specifes the element.\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n DOMNode.prototype.isEditable = function (element) {\n return ((!element.getAttribute || element.getAttribute('contenteditable') === 'true')\n && ['STYLE', 'SCRIPT'].indexOf(element.tagName) < 0);\n };\n /**\n * hasClass method\n *\n * @param {Element} element - specifes the element.\n * @param {string} className - specifies the class name value\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n DOMNode.prototype.hasClass = function (element, className) {\n return element && element.classList && element.classList.contains(className);\n };\n /**\n * replaceWith method\n *\n * @param {Element} element - specifes the element.\n * @param {string} value - specifies the string value\n * @returns {void}\n * @hidden\n\n */\n DOMNode.prototype.replaceWith = function (element, value) {\n var parentNode = element.parentNode;\n parentNode.insertBefore(this.parseHTMLFragment(value), element);\n detach(element);\n };\n /**\n * parseHTMLFragment method\n *\n * @param {string} value - specifies the string value\n * @returns {Element} - returns the element\n * @hidden\n\n */\n DOMNode.prototype.parseHTMLFragment = function (value) {\n /* eslint-disable */\n var temp = createElement('template');\n temp.innerHTML = value;\n if (temp.content instanceof DocumentFragment) {\n return temp.content;\n }\n else {\n return document.createRange().createContextualFragment(value);\n }\n /* eslint-enable */\n };\n /**\n * wrap method\n *\n * @param {Element} element - specifies the element\n * @param {Element} wrapper - specifies the element.\n * @returns {Element} - returns the element\n * @hidden\n\n */\n DOMNode.prototype.wrap = function (element, wrapper) {\n element.parentNode.insertBefore(wrapper, element);\n wrapper = element.previousSibling;\n wrapper.appendChild(element);\n return wrapper;\n };\n /**\n * insertAfter method\n *\n * @param {Element} newNode - specifies the new node element\n * @param {Element} referenceNode - specifies the referenece node\n * @returns {void}\n * @hidden\n\n */\n DOMNode.prototype.insertAfter = function (newNode, referenceNode) {\n referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);\n };\n /**\n * wrapInner method\n *\n * @param {Element} parent - specifies the parent element.\n * @param {Element} wrapper - specifies the wrapper element.\n * @returns {Element} - returns the element\n * @hidden\n\n */\n DOMNode.prototype.wrapInner = function (parent, wrapper) {\n parent.appendChild(wrapper);\n wrapper = parent.querySelector('.e-rte-wrap-inner');\n wrapper.classList.remove('e-rte-wrap-inner');\n if (wrapper.classList.length === 0) {\n wrapper.removeAttribute('class');\n }\n while (parent.firstChild !== wrapper) {\n wrapper.appendChild(parent.firstChild);\n }\n return wrapper;\n };\n /**\n * unWrap method\n *\n * @param {Element} element - specifies the element.\n * @returns {Element} - returns the element.\n * @hidden\n\n */\n DOMNode.prototype.unWrap = function (element) {\n var parent = element.parentNode;\n var unWrapNode = [];\n while (element.firstChild && (element.previousSibling !== this.parent.querySelector('.e-mention-chip') || element.textContent !== ' ')) {\n unWrapNode.push(element.firstChild);\n parent.insertBefore(element.firstChild, element);\n }\n unWrapNode = unWrapNode.length > 0 ? unWrapNode : [element.parentNode];\n parent.removeChild(element);\n return unWrapNode;\n };\n /**\n * getSelectedNode method\n *\n * @param {Element} element - specifies the element\n * @param {number} index - specifies the index value.\n * @returns {Element} - returns the element\n * @hidden\n\n */\n DOMNode.prototype.getSelectedNode = function (element, index) {\n if (element.nodeType === Node.ELEMENT_NODE && element.childNodes.length > 0 &&\n element.childNodes[index - 1] && element.childNodes[index - 1].nodeType === Node.ELEMENT_NODE &&\n (element.childNodes[index - 1].classList.contains(markerClassName.startSelection) ||\n element.childNodes[index - 1].classList.contains(markerClassName.endSelection))) {\n element = element.childNodes[index - 1];\n }\n else if (element.nodeType === Node.ELEMENT_NODE && element.childNodes.length > 0 && element.childNodes[index]) {\n element = element.childNodes[index];\n }\n if (element.nodeType === Node.TEXT_NODE) {\n element = element.parentNode;\n }\n return element;\n };\n /**\n * nodeFinds method\n *\n * @param {Element} element - specifies the element.\n * @param {Element[]} elements - specifies the array of elements\n * @returns {Element[]} - returnts the array elements\n * @hidden\n\n */\n DOMNode.prototype.nodeFinds = function (element, elements) {\n var existNodes = [];\n for (var i = 0; i < elements.length; i++) {\n if (element.contains(elements[i]) && element !== elements[i]) {\n existNodes.push(elements[i]);\n }\n }\n return existNodes;\n };\n /**\n * isEditorArea method\n *\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n DOMNode.prototype.isEditorArea = function () {\n var range = this.getRangePoint(0);\n var element;\n for (element = range.commonAncestorContainer; element && !this.isElement(element); null) {\n element = element.parentNode;\n }\n return !!this.isElement(element);\n };\n /**\n * getRangePoint method\n *\n * @param {number} point - specifies the number value.\n * @returns {Range} - returns the range.\n * @hidden\n\n */\n DOMNode.prototype.getRangePoint = function (point) {\n var selection = this.getSelection();\n var ranges = [];\n if (selection && selection.getRangeAt && selection.rangeCount) {\n ranges = [];\n for (var f = 0; f < selection.rangeCount; f++) {\n ranges.push(selection.getRangeAt(f));\n }\n }\n else {\n ranges = [this.currentDocument.createRange()];\n }\n return 'undefined' !== typeof point ? ranges[point] : ranges;\n };\n DOMNode.prototype.getSelection = function () {\n return this.nodeSelection.get(this.currentDocument);\n };\n /**\n * getPreviousNode method\n *\n * @param {Element} element - specifies the element\n * @returns {Element} - returns the element\n * @hidden\n\n */\n DOMNode.prototype.getPreviousNode = function (element) {\n element = element.previousElementSibling;\n for (; element && element.textContent === '\\n'; null) {\n element = element.previousElementSibling;\n }\n return element;\n };\n /**\n * encode method\n *\n * @param {string} value - specifies the string value\n * @returns {string} - specifies the string value\n * @hidden\n\n */\n DOMNode.prototype.encode = function (value) {\n var divNode = document.createElement('div');\n divNode.innerText = value;\n // eslint-disable-next-line\n return divNode.innerHTML.replace(//gi, '\\n');\n };\n /**\n * saveMarker method\n *\n * @param {NodeSelection} save - specifies the node selection,\n * @param {string} action - specifies the action value.\n * @returns {NodeSelection} - returns the value\n * @hidden\n\n */\n DOMNode.prototype.saveMarker = function (save, action) {\n var start = this.parent.querySelector('.' + markerClassName.startSelection);\n var end = this.parent.querySelector('.' + markerClassName.endSelection);\n var startTextNode;\n var endTextNode;\n if (this.hasClass(start, markerClassName.startSelection) && start.classList.length > 1) {\n var replace = this.createTagString(CONSTANT.DEFAULT_TAG, start, this.encode(start.textContent));\n this.replaceWith(start, replace);\n start = this.parent.querySelector('.' + markerClassName.startSelection);\n start.classList.remove(markerClassName.startSelection);\n startTextNode = start.childNodes[0];\n }\n else {\n startTextNode = this.unWrap(start)[0];\n }\n if (this.hasClass(end, markerClassName.endSelection) && end.classList.length > 1) {\n var replace = this.createTagString(CONSTANT.DEFAULT_TAG, end, this.encode(end.textContent));\n this.replaceWith(end, replace);\n end = this.parent.querySelector('.' + markerClassName.endSelection);\n end.classList.remove(markerClassName.endSelection);\n endTextNode = end.childNodes[0];\n }\n else {\n endTextNode = end ? this.unWrap(end)[0] : startTextNode;\n }\n save.startContainer = save.getNodeArray(startTextNode, true);\n save.endContainer = save.getNodeArray(endTextNode, false);\n return save;\n };\n DOMNode.prototype.marker = function (className, textContent) {\n return '' + textContent + '';\n };\n /**\n * setMarker method\n *\n * @param {NodeSelection} save - specifies the node selection.\n * @returns {void}\n * @hidden\n\n */\n DOMNode.prototype.setMarker = function (save) {\n var range = save.range;\n var startChildNodes = range.startContainer.childNodes;\n var isTableStart = startChildNodes.length > 1 && startChildNodes[0].nodeName === 'TABLE';\n var isImgOnlySelected = startChildNodes.length > 1 && startChildNodes[0].nodeName === 'IMAGE' &&\n range.endOffset === 1 && range.endContainer.nodeName === '#text' && range.endContainer.textContent.length === 0;\n var start = ((isTableStart ? getLastTextNode(startChildNodes[range.startOffset + 1]) :\n startChildNodes[(range.startOffset > 0) ? (range.startOffset - 1) : range.startOffset]) || range.startContainer);\n var end = (range.endContainer.childNodes[(range.endOffset > 0) ? (isImgOnlySelected ? range.endOffset : (range.endOffset - 1)) : range.endOffset]\n || range.endContainer);\n if ((start.nodeType === Node.ELEMENT_NODE && end.nodeType === Node.ELEMENT_NODE) && (start.contains(end) || end.contains(start))) {\n var existNode = start.contains(end) ? start : end;\n var isElement = existNode.nodeType !== Node.TEXT_NODE;\n if (isElement) {\n var nodes = [];\n var textNodes = [];\n for (var node = existNode; existNode.contains(node); null) {\n if (nodes.indexOf(node) < 0 && node.childNodes && node.childNodes.length) {\n nodes.push(node);\n node = node.childNodes[0];\n }\n else if (node.nextSibling) {\n node = node.nextSibling;\n }\n else if (node.parentNode) {\n node = node.parentNode;\n nodes.push(node);\n }\n if (textNodes.indexOf(node) < 0 && (node.nodeType === Node.TEXT_NODE ||\n (CONSTANT.IGNORE_BLOCK_TAGS.indexOf(node.parentNode.tagName.toLocaleLowerCase()) >= 0\n && (node.tagName === 'BR' || node.tagName === 'IMG')))) {\n textNodes.push(node);\n }\n }\n if (textNodes.length) {\n start = start.contains(end) ? textNodes[0] : start;\n end = textNodes[textNodes.length - 1];\n }\n }\n }\n if (start !== end) {\n if (start.nodeType !== Node.TEXT_NODE && ((start.tagName === 'BR' &&\n CONSTANT.IGNORE_BLOCK_TAGS.indexOf(start.parentNode.tagName.toLocaleLowerCase()) >= 0) ||\n start.tagName === 'IMG')) {\n this.replaceWith(start, this.marker(markerClassName.startSelection, this.encode(start.textContent)));\n var markerStart = range.startContainer.querySelector('.' + markerClassName.startSelection);\n markerStart.appendChild(start);\n }\n else {\n if (start.nodeType !== 3 && start.nodeName !== '#text' && start.nodeName !== 'BR') {\n var marker = this.marker(markerClassName.startSelection, '');\n append([this.parseHTMLFragment(marker)], start);\n }\n else {\n this.replaceWith(start, this.marker(markerClassName.startSelection, this.encode(start.textContent)));\n }\n }\n if (end.nodeType !== Node.TEXT_NODE && end.tagName === 'BR' &&\n CONSTANT.IGNORE_BLOCK_TAGS.indexOf(end.parentNode.tagName.toLocaleLowerCase()) >= 0) {\n this.replaceWith(end, this.marker(markerClassName.endSelection, this.encode(end.textContent)));\n var markerEnd = range.endContainer.querySelector('.' + markerClassName.endSelection);\n markerEnd.appendChild(end);\n }\n else {\n this.ensureSelfClosingTag(end, markerClassName.endSelection, range);\n }\n }\n else {\n this.ensureSelfClosingTag(start, markerClassName.startSelection, range);\n }\n };\n /**\n * ensureSelfClosingTag method\n *\n * @param {Element} start - specifies the element.\n * @param {string} className - specifes the class name string value\n * @param {Range} range - specifies the range value\n * @returns {void}\n * @hidden\n\n */\n DOMNode.prototype.ensureSelfClosingTag = function (start, className, range) {\n var isTable = false;\n if (start.nodeType === 3) {\n this.replaceWith(start, this.marker(className, this.encode(start.textContent)));\n }\n else if (start.tagName === 'BR') {\n this.replaceWith(start, this.marker(className, this.encode(start.textContent)));\n var markerStart = range.startContainer.querySelector('.' + className);\n if (markerStart) {\n markerStart.parentElement.appendChild(start);\n }\n }\n else {\n var tagName = !isNOU(start.parentElement) ? start.parentElement.tagName.toLocaleLowerCase() : '';\n if (start.tagName === 'IMG' && tagName !== 'p' && tagName !== 'div') {\n var parNode = document.createElement('p');\n start.parentElement.insertBefore(parNode, start);\n parNode.appendChild(start);\n start = parNode.children[0];\n }\n if (start.tagName === 'TABLE') {\n isTable = true;\n if (start.textContent === '') {\n var tdNode = start.querySelectorAll('td');\n start = tdNode[tdNode.length - 1];\n start = !isNOU(start.childNodes[0]) ? start.childNodes[0] : start;\n }\n else {\n var lastNode = start.lastChild;\n while (lastNode.nodeType !== 3 && lastNode.nodeName !== '#text' &&\n lastNode.nodeName !== 'BR') {\n lastNode = lastNode.lastChild;\n }\n start = lastNode;\n }\n }\n for (var i = 0; i < selfClosingTags.length; i++) {\n start = (start.tagName === selfClosingTags[i] && !isTable) ? start.parentNode : start;\n }\n if (start.nodeType === 3 && start.nodeName === '#text') {\n this.replaceWith(start, this.marker(className, this.encode(start.textContent)));\n }\n else if (start.nodeName === 'BR') {\n this.replaceWith(start, this.marker(markerClassName.endSelection, this.encode(start.textContent)));\n var markerEnd = range.endContainer.querySelector('.' + markerClassName.endSelection);\n markerEnd.appendChild(start);\n }\n else {\n var marker = this.marker(className, '');\n append([this.parseHTMLFragment(marker)], start);\n }\n }\n };\n /**\n * createTempNode method\n *\n * @param {Element} element - specifies the element.\n * @returns {Element} - returns the element\n * @hidden\n\n */\n DOMNode.prototype.createTempNode = function (element) {\n var textContent = element.textContent;\n if (element.tagName === 'BR') {\n var wrapper = '<' + CONSTANT.DEFAULT_TAG + '>';\n var node = element.parentNode;\n if (CONSTANT.IGNORE_BLOCK_TAGS.indexOf(node.tagName.toLocaleLowerCase()) >= 0) {\n element = this.wrap(element, this.parseHTMLFragment(wrapper));\n }\n }\n else if (((element.nodeType !== Node.TEXT_NODE &&\n (element.classList.contains(markerClassName.startSelection) ||\n element.classList.contains(markerClassName.endSelection))) ||\n textContent.replace(/\\n/g, '').replace(/(^ *)|( *$)/g, '').length > 0 ||\n textContent.length && textContent.indexOf('\\n') < 0)) {\n var wrapper = '<' + CONSTANT.DEFAULT_TAG + '>';\n var target = element;\n element = this.wrap(element, this.parseHTMLFragment(wrapper));\n var ignoreBr = target.nodeType === Node.ELEMENT_NODE && target.firstChild && target.firstChild.nodeName === 'BR'\n && (target.classList.contains(markerClassName.startSelection) ||\n target.classList.contains(markerClassName.endSelection));\n if (!ignoreBr && element.nextElementSibling && element.nextElementSibling.tagName === 'BR') {\n element.appendChild(element.nextElementSibling);\n }\n }\n return element;\n };\n /**\n * getImageTagInSelection method\n *\n * @returns {void}\n * @hidden\n\n */\n DOMNode.prototype.getImageTagInSelection = function () {\n var selection = this.getSelection();\n if (this.isEditorArea() && selection.rangeCount) {\n return selection.focusNode.querySelectorAll('img');\n }\n return null;\n };\n /**\n * Method to wrap the inline and text node with block node.\n *\n * @param {HTMLElement} node - specifies the element sent to wrap the node around it with block nodes.\n * @param {string} wrapperElement - specifies which block nodes to wrap around.\n * @returns {HTMLElement} - returns the wrapped element.\n * @hidden\n\n */\n DOMNode.prototype.gatherElementsAround = function (node, wrapperElement) {\n var newWrapElem = createElement(wrapperElement);\n // Insert the new div element before the current node.\n var currentNode = node.previousSibling;\n var currentNodeParent = node.parentElement;\n if (currentNodeParent.className === 'e-editor-select-start') {\n currentNodeParent.parentNode.insertBefore(newWrapElem, currentNodeParent);\n }\n else if (currentNodeParent) {\n currentNodeParent.insertBefore(newWrapElem, node);\n }\n var i = 0;\n while (currentNode !== null && currentNode.nodeName !== 'BR' &&\n !this.isBlockNode(currentNode)) {\n var prevSibling = currentNode.previousSibling;\n if (currentNode.nodeType === 3 || currentNode.nodeType === 1) {\n if (i === 0) {\n newWrapElem.appendChild(currentNode);\n }\n else {\n newWrapElem.insertBefore(currentNode, newWrapElem.firstChild);\n }\n }\n currentNode = prevSibling;\n i++;\n }\n // Add the current node to the new div\n newWrapElem.appendChild(node);\n // Gather text and inline elements after the currentNode\n currentNode = newWrapElem.nextSibling ? newWrapElem.nextSibling :\n newWrapElem.parentElement.nextSibling;\n while (currentNode !== null && currentNode.nodeName !== 'BR' &&\n !this.isBlockNode(currentNode)) {\n var nextSibling = currentNode.nextSibling ?\n currentNode.nextSibling : currentNode.parentElement.nextSibling;\n if (currentNode.nodeType === 3 || currentNode.nodeType === 1) {\n newWrapElem.appendChild(currentNode);\n }\n currentNode = nextSibling;\n }\n return newWrapElem;\n };\n /**\n * Method to convert all the inline nodes between the selection to block nodes.\n *\n * @param {Node[]} selectedNodes - specifies the nodes of the start and end selection.\n * @param {boolean} fromList - specifies if the method is called from list module.\n * @returns {Node[]} - returns the selected list of elements as block nodes.\n * @hidden\n\n */\n DOMNode.prototype.convertToBlockNodes = function (selectedNodes, fromList) {\n if (selectedNodes.length > 1) {\n var i = 0;\n var currentSelectedNode = selectedNodes[0];\n while (!isNOU(currentSelectedNode)) {\n if (currentSelectedNode.nodeName === 'BR') {\n var nextNode = currentSelectedNode.nextSibling;\n detach(currentSelectedNode);\n currentSelectedNode = nextNode;\n }\n if (!isNOU(currentSelectedNode)) {\n if (fromList) {\n selectedNodes[i] = currentSelectedNode.nodeName === 'LI' || this.isBlockNode(currentSelectedNode) ?\n currentSelectedNode :\n this.gatherElementsAround(currentSelectedNode, (fromList ? 'p' : 'div'));\n }\n else {\n selectedNodes[i] = !this.isBlockNode(selectedNodes[i]) ?\n this.gatherElementsAround(currentSelectedNode, (fromList ? 'p' : 'div')) :\n selectedNodes[i];\n }\n var currentProcessNode = selectedNodes[i].nodeName === 'LI' ? selectedNodes[i].parentElement : selectedNodes[i];\n var currentElementCheckNode = currentProcessNode.nodeName === '#text' ? currentProcessNode.parentElement : currentProcessNode;\n currentSelectedNode = !isNOU(currentElementCheckNode.querySelector('.e-editor-select-end')) ||\n !isNOU(closest(currentSelectedNode, '.e-editor-select-end')) ?\n null : currentProcessNode.nextSibling;\n if (currentSelectedNode === null && !isNOU(currentProcessNode.nextSibling) && currentProcessNode.nextSibling.nodeName === 'BR') {\n detach(currentProcessNode.nextSibling);\n }\n }\n i++;\n }\n }\n else {\n if (!this.isBlockNode(selectedNodes[0])) {\n selectedNodes[0] = this.gatherElementsAround(selectedNodes[0], (fromList ? 'p' : 'div'));\n if (!isNOU(selectedNodes[0].nextSibling) && (selectedNodes[0].nextSibling.nodeName === 'BR')) {\n detach(selectedNodes[0].nextSibling);\n }\n }\n }\n return selectedNodes;\n };\n /**\n * blockNodes method\n *\n * @param {boolean} action - Optional Boolean that specifies the action is whether performed.\n * @returns {Node[]} - returns the node array values\n * @hidden\n\n */\n DOMNode.prototype.blockNodes = function (action) {\n var collectionNodes = [];\n var selection = this.getSelection();\n if (this.isEditorArea() && selection.rangeCount) {\n var ranges = this.getRangePoint();\n for (var j = 0; j < ranges.length; j++) {\n var parentNode = void 0;\n var range = ranges[j];\n var startNode = this.getSelectedNode(range.startContainer, range.startOffset);\n var endNode = this.getSelectedNode(range.endContainer, range.endOffset);\n if (this.isBlockNode(startNode) && collectionNodes.indexOf(startNode) < 0) {\n collectionNodes.push(startNode);\n }\n parentNode = this.blockParentNode(startNode);\n var endParentNode = this.blockParentNode(endNode);\n if (parentNode && collectionNodes.indexOf(parentNode) < 0) {\n if (!isNOU(action) && action) {\n if (range.commonAncestorContainer.nodeName === 'TD' || parentNode.nodeName === 'TD' || endParentNode.nodeName === 'TD') {\n var processedNodes = this.getPreBlockNodeCollection(range);\n if (processedNodes.length > 1) {\n this.wrapWithBlockNode(processedNodes, collectionNodes);\n }\n else if (processedNodes.length > 0) {\n if (startNode !== endNode && startNode.nodeName !== 'BR') {\n collectionNodes.push(this.createTempNode(startNode));\n }\n else if (startNode === endNode && startNode.nodeName === 'SPAN' && (startNode.classList.contains(markerClassName.startSelection)\n || startNode.classList.contains(markerClassName.endSelection))) {\n collectionNodes.push(this.createTempNode(startNode));\n }\n }\n }\n else {\n collectionNodes.push(parentNode);\n }\n }\n else {\n if (CONSTANT.IGNORE_BLOCK_TAGS.indexOf(parentNode.tagName.toLocaleLowerCase()) >= 0 && (startNode.tagName === 'BR' ||\n startNode.nodeType === Node.TEXT_NODE ||\n startNode.classList.contains(markerClassName.startSelection) ||\n startNode.classList.contains(markerClassName.endSelection))) {\n var tempNode = startNode.previousSibling &&\n startNode.previousSibling.nodeType === Node.TEXT_NODE ?\n startNode.previousSibling : startNode;\n if (!startNode.nextSibling && !startNode.previousSibling && startNode.tagName === 'BR') {\n collectionNodes.push(tempNode);\n }\n else {\n collectionNodes.push(this.createTempNode(tempNode));\n }\n }\n else {\n collectionNodes.push(parentNode);\n }\n }\n }\n var nodes = [];\n for (var node = startNode; node !== endNode && node !== this.parent; null) {\n if (nodes.indexOf(node) < 0 && node.childNodes && node.childNodes.length) {\n nodes.push(node);\n node = node.childNodes[0];\n }\n else if (node && node.nodeType !== 8 && (node.tagName === 'BR' || (node.nodeType === Node.TEXT_NODE &&\n node.textContent.trim() !== '') || (node.nodeType !== Node.TEXT_NODE &&\n (node.classList.contains(markerClassName.startSelection) ||\n node.classList.contains(markerClassName.endSelection)))) &&\n CONSTANT.IGNORE_BLOCK_TAGS.indexOf(node.parentNode.tagName.toLocaleLowerCase()) >= 0) {\n node = this.createTempNode(node);\n }\n else if (node.nextSibling && node.nextSibling.nodeType !== 8 &&\n (node.nextSibling.tagName === 'BR' ||\n node.nextSibling.nodeType === Node.TEXT_NODE ||\n node.nextSibling.classList.contains(markerClassName.startSelection) ||\n node.nextSibling.classList.contains(markerClassName.endSelection)) &&\n CONSTANT.IGNORE_BLOCK_TAGS.indexOf(node.nextSibling.parentNode.tagName.toLocaleLowerCase()) >= 0) {\n node = this.createTempNode(node.nextSibling);\n }\n else if (node.nextSibling) {\n node = node.nextSibling;\n }\n else if (node.parentNode) {\n node = node.parentNode;\n nodes.push(node);\n }\n if (collectionNodes.indexOf(node) < 0 && node.nodeType === Node.ELEMENT_NODE &&\n CONSTANT.IGNORE_BLOCK_TAGS.indexOf(node.parentNode.tagName.toLocaleLowerCase()) >= 0 &&\n (node.classList.contains(markerClassName.startSelection) ||\n node.classList.contains(markerClassName.endSelection))) {\n collectionNodes.push(this.createTempNode(node));\n }\n if (this.isBlockNode(node) && this.ignoreTableTag(node) && nodes.indexOf(node) < 0 &&\n collectionNodes.indexOf(node) < 0 && (node !== endNode || range.endOffset > 0)) {\n collectionNodes.push(node);\n }\n if (node.nodeName === 'IMG' && node.parentElement.contentEditable === 'true') {\n collectionNodes.push(node);\n }\n }\n parentNode = this.blockParentNode(endNode);\n if (parentNode && this.ignoreTableTag(parentNode) && collectionNodes.indexOf(parentNode) < 0 &&\n (!isNOU(parentNode.previousElementSibling) && parentNode.previousElementSibling.tagName !== 'IMG')) {\n collectionNodes.push(parentNode);\n }\n }\n }\n for (var i = collectionNodes.length - 1; i > 0; i--) {\n var nodes = this.nodeFinds(collectionNodes[i], collectionNodes);\n if (nodes.length) {\n var listNodes = collectionNodes[i].querySelectorAll('ul, ol');\n if (collectionNodes[i].tagName === 'LI' && listNodes.length > 0) {\n continue;\n }\n else {\n collectionNodes.splice(i, 1);\n }\n }\n }\n return collectionNodes;\n };\n DOMNode.prototype.ignoreTableTag = function (element) {\n return !(CONSTANT.TABLE_BLOCK_TAGS.indexOf(element.tagName.toLocaleLowerCase()) >= 0);\n };\n DOMNode.prototype.getPreBlockNodeCollection = function (range) {\n var startNode = this.getSelectedNode(range.startContainer, range.startOffset);\n var endNode = this.getSelectedNode(range.endContainer, range.endOffset);\n var nodes = [];\n var rootNode = startNode.closest('td, th');\n if (isNOU(rootNode)) {\n return nodes;\n }\n var rootChildNode = Array.from(rootNode.childNodes);\n var isContinue = true;\n var processedStart = this.getClosestInlineParent(startNode, rootNode, true);\n var processedEnd = this.getClosestInlineParent(endNode, rootNode, false);\n for (var i = 0; i < rootChildNode.length; i++) {\n var child = rootChildNode[i];\n if (processedStart === processedEnd && child === processedStart) {\n nodes.push(child);\n isContinue = true;\n }\n else if (child === processedStart) {\n isContinue = false;\n }\n else if (child === processedEnd) {\n nodes.push(child); // Early Exit so Push the end node.\n isContinue = true;\n }\n if (isContinue) {\n continue;\n }\n else {\n nodes.push(child);\n }\n }\n return nodes;\n };\n DOMNode.prototype.getClosestInlineParent = function (node, rootNode, isStart) {\n // 1. If the node is a text node, return the node\n // 2. If the node is a block node return block node\n // 3. If the node is a inline node,\n // Traverse back untill the TD or TH node\n // Check if the the previous sibling , next sibling is a block node.\n // If yes return the inline node that is closest to the block node.\n if (node.nodeType === Node.TEXT_NODE) {\n return node;\n }\n if (this.isBlockNode(node)) {\n return node;\n }\n var currentNode = node;\n var rootFlag = false;\n while (currentNode) {\n var previousNode = currentNode;\n if (rootFlag) {\n if (this.isBlockNode(currentNode)) {\n return previousNode;\n }\n if (isStart && currentNode.previousSibling) {\n if (this.isBlockNode(currentNode.previousSibling) || currentNode.previousSibling.nodeName === 'BR') {\n return previousNode;\n }\n else {\n currentNode = currentNode.previousSibling;\n }\n }\n else if (!isStart && currentNode.nextSibling) {\n if (this.isBlockNode(currentNode.nextSibling) || currentNode.nextSibling.nodeName === 'BR') {\n return previousNode;\n }\n else {\n currentNode = currentNode.nextSibling;\n }\n }\n else {\n return currentNode;\n }\n }\n else {\n currentNode = currentNode.parentElement;\n if (currentNode === rootNode) {\n currentNode = previousNode;\n rootFlag = true;\n }\n }\n }\n return null;\n };\n DOMNode.prototype.wrapWithBlockNode = function (nodes, collectionNodes) {\n var wrapperElement = createElement('p');\n for (var i = 0; i < nodes.length; i++) {\n var child = nodes[i];\n if (child.nodeName === 'BR') {\n child.parentNode.insertBefore(wrapperElement, child);\n wrapperElement.appendChild(child);\n if (wrapperElement.childNodes.length > 0) {\n collectionNodes.push(wrapperElement);\n }\n wrapperElement = createElement('p');\n }\n else {\n if (!this.isBlockNode(child)) {\n if (child.nodeName === '#text' && child.textContent.trim() === '') {\n continue;\n }\n if (wrapperElement.childElementCount === 0) {\n child.parentNode.insertBefore(wrapperElement, child);\n wrapperElement.appendChild(child);\n }\n else {\n wrapperElement.appendChild(child);\n }\n }\n else {\n collectionNodes.push(child);\n }\n // Use case when the BR is next sibling but the BR is not the part of selection.\n if ((i === nodes.length - 1) && wrapperElement.nextElementSibling &&\n wrapperElement.querySelectorAll('br').length === 0 &&\n wrapperElement.nextElementSibling.nodeName === 'BR') {\n wrapperElement.appendChild(wrapperElement.nextElementSibling);\n }\n }\n }\n if (wrapperElement.childNodes.length > 0 && collectionNodes.indexOf(wrapperElement) < 0) {\n collectionNodes.push(wrapperElement);\n }\n };\n return DOMNode;\n}());\nexport { DOMNode };\n","import * as CONSTANT from './../base/constant';\nimport { createElement, detach, prepend, append, attributes, Browser } from '@syncfusion/ej2-base';\nimport { markerClassName } from './dom-node';\nimport * as EVENTS from './../../common/constant';\nimport { setStyleAttribute } from '@syncfusion/ej2-base';\nimport { isIDevice, setEditFrameFocus } from '../../common/util';\nimport { isNullOrUndefined, isNullOrUndefined as isNOU, closest } from '@syncfusion/ej2-base';\n/**\n * Lists internal component\n *\n * @hidden\n\n */\nvar Lists = /** @class */ (function () {\n /**\n * Constructor for creating the Lists plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function Lists(parent) {\n this.parent = parent;\n this.domNode = this.parent.domNode;\n this.addEventListener();\n }\n Lists.prototype.addEventListener = function () {\n this.parent.observer.on(EVENTS.LIST_TYPE, this.applyListsHandler, this);\n this.parent.observer.on(EVENTS.KEY_UP_HANDLER, this.onKeyUp, this);\n this.parent.observer.on(EVENTS.KEY_DOWN_HANDLER, this.keyDownHandler, this);\n this.parent.observer.on(EVENTS.SPACE_ACTION, this.spaceKeyAction, this);\n };\n Lists.prototype.testList = function (elem) {\n var olListRegex = [/^[\\d]+[.]+$/,\n /^(?=[MDCLXVI])M*(C[MD]|D?C{0,3})(X[CL]|L?X{0,3})(I[XV]|V?I{0,3})[.]$/gi,\n /^[a-zA-Z][.]+$/];\n var elementStart = !isNullOrUndefined(elem) ? elem.innerText.trim().split('.')[0] + '.' : null;\n if (!isNullOrUndefined(elementStart)) {\n for (var i = 0; i < olListRegex.length; i++) {\n if (olListRegex[i].test(elementStart)) {\n return true;\n }\n }\n }\n return false;\n };\n Lists.prototype.testCurrentList = function (range) {\n var olListStartRegex = [/^[1]+[.]+$/, /^[i]+[.]+$/, /^[a]+[.]+$/];\n if (!isNullOrUndefined(range.startContainer.textContent.slice(0, range.startOffset))) {\n var currentContent = range.startContainer.textContent.replace(/\\u200B/g, '').slice(0, range.startOffset).trim();\n for (var i = 0; i < olListStartRegex.length; i++) {\n if (olListStartRegex[i].test(currentContent) && currentContent.length === 2) {\n return true;\n }\n }\n }\n return false;\n };\n Lists.prototype.spaceList = function (e) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n this.saveSelection = this.parent.nodeSelection.save(range, this.parent.currentDocument);\n var startNode = this.parent.domNode.getSelectedNode(range.startContainer, range.startOffset);\n // eslint-disable-next-line\n var endNode = this.parent.domNode.getSelectedNode(range.endContainer, range.endOffset);\n var preElement = startNode.previousElementSibling;\n var nextElement = startNode.nextElementSibling;\n var preElemULStart = !isNullOrUndefined(preElement) ?\n preElement.innerText.trim().substring(0, 1) : null;\n var nextElemULStart = !isNullOrUndefined(nextElement) ?\n nextElement.innerText.trim().substring(0, 1) : null;\n var startElementOLTest = this.testCurrentList(range);\n var preElementOLTest = this.testList(preElement);\n var nextElementOLTest = this.testList(nextElement);\n if (!preElementOLTest && !nextElementOLTest && preElemULStart !== '*' && nextElemULStart !== '*') {\n var brElement = createElement('br');\n if (startElementOLTest) {\n range.startContainer.textContent = range.startContainer.textContent.slice(range.startOffset, range.startContainer.textContent.length);\n if (range.startContainer.nodeName === '#text' && range.startContainer.textContent.length === 0) {\n this.parent.domNode.insertAfter(brElement, range.startContainer);\n }\n this.applyListsHandler({ subCommand: 'OL', callBack: e.callBack });\n e.event.preventDefault();\n }\n else if (range.startContainer.textContent.replace(/\\u200B/g, '').slice(0, range.startOffset).trim() === '*' ||\n range.startContainer.textContent.replace(/\\u200B/g, '').slice(0, range.startOffset).trim() === '-') {\n range.startContainer.textContent = range.startContainer.textContent.slice(range.startOffset, range.startContainer.textContent.length);\n if (range.startContainer.nodeName === '#text' && range.startContainer.textContent.length === 0) {\n this.parent.domNode.insertAfter(brElement, range.startContainer);\n }\n this.applyListsHandler({ subCommand: 'UL', callBack: e.callBack });\n e.event.preventDefault();\n }\n }\n };\n Lists.prototype.enterList = function (e) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var startNode = range.startContainer.nodeName === 'LI' ? range.startContainer :\n range.startContainer.parentElement.closest('LI');\n var endNode = range.endContainer.nodeName === 'LI' ? range.endContainer :\n range.endContainer.parentElement.closest('LI');\n // Checks for Image, Audio , Video Element inside List Element\n var hasMediaElem = false;\n if (!isNOU(startNode)) {\n var videoElemList = startNode.querySelectorAll('.e-video-clickelem');\n var embedVideoElem = videoElemList.length > 0 && videoElemList[0].childNodes[0].nodeName === 'IFRAME';\n hasMediaElem = startNode.querySelectorAll('IMG').length > 0 || startNode.querySelectorAll('AUDIO').length > 0 || startNode.querySelectorAll('VIDEO').length > 0 || embedVideoElem;\n }\n if (!isNOU(startNode) && !isNOU(endNode) && startNode === endNode && startNode.tagName === 'LI' &&\n startNode.textContent.trim() === '' && !hasMediaElem) {\n if (startNode.innerHTML.indexOf(' ') >= 0) {\n return;\n }\n if (startNode.textContent.charCodeAt(0) === 65279) {\n startNode.textContent = '';\n }\n var startNodeParent = startNode.parentElement;\n var parentOfCurrentOLUL = startNodeParent.parentElement;\n if (isNOU(parentOfCurrentOLUL.closest('UL')) && isNOU(parentOfCurrentOLUL.closest('OL'))) {\n if (!isNOU(startNode.nextElementSibling)) {\n var nearBlockNode = this.parent.domNode.blockParentNode(startNode);\n this.parent.nodeCutter.GetSpliceNode(range, nearBlockNode);\n }\n var insertTag = void 0;\n if (e.enterAction === 'DIV') {\n insertTag = createElement('div');\n insertTag.innerHTML = '
    ';\n }\n else if (e.enterAction === 'P') {\n insertTag = createElement('p');\n insertTag.innerHTML = '
    ';\n }\n else {\n insertTag = createElement('br');\n }\n this.parent.domNode.insertAfter(insertTag, startNodeParent);\n e.event.preventDefault();\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, insertTag, 0);\n if (startNodeParent.textContent === '' && (startNodeParent.querySelectorAll('audio,video').length === 0)) {\n detach(startNodeParent);\n }\n else {\n detach(startNode);\n }\n }\n // To handle the nested enter key press in the list for the first LI element\n if (!isNOU(parentOfCurrentOLUL) && (!isNOU(parentOfCurrentOLUL.closest('UL')) || !isNOU(parentOfCurrentOLUL.closest('OL'))) &&\n parentOfCurrentOLUL.nodeName === 'LI' && parentOfCurrentOLUL.style.listStyleType === 'none' &&\n parentOfCurrentOLUL.textContent === '' && startNode.textContent === '' && startNode === startNodeParent.firstElementChild &&\n isNOU(startNode.nextSibling)) {\n detach(startNodeParent);\n parentOfCurrentOLUL.style.removeProperty('list-style-type');\n e.event.preventDefault();\n }\n }\n };\n Lists.prototype.backspaceList = function (e) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var startNode = this.parent.domNode.getSelectedNode(range.startContainer, range.startOffset);\n var endNode = this.parent.domNode.getSelectedNode(range.endContainer, range.endOffset);\n startNode = startNode.nodeName === 'BR' ? startNode.parentElement : startNode;\n endNode = endNode.nodeName === 'BR' ? endNode.parentElement : endNode;\n if (startNode === endNode && !isNullOrUndefined(closest(startNode, 'li')) &&\n ((startNode.textContent.trim() === '' && startNode.textContent.charCodeAt(0) === 65279) ||\n (startNode.textContent.length === 1 && startNode.textContent.charCodeAt(0) === 8203))) {\n startNode.textContent = '';\n }\n if (startNode === endNode && startNode.tagName === 'LI' && startNode.textContent.length === 0 &&\n isNOU(startNode.previousElementSibling)) {\n startNode.removeAttribute('style');\n }\n if (startNode === endNode && startNode.textContent === '') {\n if (startNode.parentElement.tagName === 'LI' && endNode.parentElement.tagName === 'LI') {\n detach(startNode);\n }\n else if (startNode.closest('ul') || startNode.closest('ol')) {\n var parentList = !isNOU(startNode.closest('ul')) ? startNode.closest('ul') : startNode.closest('ol');\n if (parentList.firstElementChild === startNode && !isNOU(parentList.children[1]) &&\n (parentList.children[1].tagName === 'OL' || parentList.children[1].tagName === 'UL')) {\n if (parentList.tagName === parentList.children[1].tagName) {\n while (parentList.children[1].lastChild) {\n this.parent.domNode.insertAfter(parentList.children[1].lastChild, parentList.children[1]);\n }\n detach(parentList.children[1]);\n }\n else {\n parentList.parentElement.insertBefore(parentList.children[1], parentList);\n }\n }\n }\n }\n else if (!isNOU(startNode.firstChild) && startNode.firstChild.nodeName === 'BR' &&\n (!isNullOrUndefined(startNode.childNodes[1]) && (startNode.childNodes[1].nodeName === 'UL' ||\n startNode.childNodes[1].nodeName === 'OL'))) {\n var parentList = !isNOU(startNode.closest('ul')) ? startNode.closest('ul') : startNode.closest('ol');\n if (parentList.tagName === startNode.childNodes[1].nodeName) {\n while (startNode.childNodes[1].lastChild) {\n this.parent.domNode.insertAfter(startNode.children[1].lastChild, startNode);\n }\n detach(startNode.childNodes[1]);\n }\n else {\n parentList.parentElement.insertBefore(startNode.children[1], parentList);\n }\n }\n this.removeList(range, e);\n this.firstListBackSpace(range, e);\n };\n Lists.prototype.removeList = function (range, e) {\n var startNode = this.parent.domNode.getSelectedNode(range.startContainer, range.startOffset);\n var endNode = (!isNOU(range.endContainer.parentElement.closest('li')) && range.endContainer.parentElement.closest('li').childElementCount > 1 && range.endContainer.nodeName === '#text') ? range.endContainer : this.parent.domNode.getSelectedNode(range.endContainer, range.endOffset);\n var parentList = (range.startContainer.nodeName === '#text') ? range.startContainer.parentElement.closest('li') : range.startContainer.closest('li');\n var fullContent = '';\n if (!isNOU(parentList) && !isNOU(parentList.childNodes)) {\n parentList.childNodes.forEach(function (e) {\n fullContent = fullContent + e.textContent;\n });\n }\n startNode = startNode.nodeName === 'BR' ? startNode.parentElement : startNode;\n endNode = endNode.nodeName === 'BR' ? endNode.parentElement : endNode;\n startNode = startNode.nodeName !== 'LI' && !isNOU(startNode.closest('LI')) ? startNode.closest('LI') : startNode;\n endNode = endNode.nodeName !== 'LI' && endNode.nodeName !== '#text' && !isNOU(endNode.closest('LI')) ? endNode.closest('LI') : endNode;\n if (((range.commonAncestorContainer.nodeName === 'OL' || range.commonAncestorContainer.nodeName === 'UL' || range.commonAncestorContainer.nodeName === 'LI') &&\n isNOU(endNode.nextElementSibling) && endNode.textContent.length === range.endOffset &&\n isNOU(startNode.previousElementSibling) && range.startOffset === 0) ||\n (Browser.userAgent.indexOf('Firefox') !== -1 && range.startContainer === range.endContainer && range.startContainer === this.parent.editableElement &&\n range.startOffset === 0 && range.endOffset === 1)) {\n if (Browser.userAgent.indexOf('Firefox') !== -1) {\n detach(range.commonAncestorContainer.childNodes[0]);\n }\n else if (range.commonAncestorContainer.nodeName === 'LI') {\n detach(range.commonAncestorContainer.parentElement);\n }\n else {\n detach(range.commonAncestorContainer);\n }\n e.event.preventDefault();\n }\n else if (!isNOU(parentList) && !range.collapsed && parentList.textContent === fullContent) {\n range.deleteContents();\n this.parent.editableElement.querySelectorAll('li').forEach(function (li) {\n if (!li.firstChild || li.textContent.trim() === '') {\n li.parentNode.removeChild(li);\n }\n });\n this.parent.editableElement.querySelectorAll('ol').forEach(function (ol) {\n if (!ol.firstChild || ol.textContent.trim() === '') {\n ol.parentNode.removeChild(ol);\n }\n });\n this.parent.editableElement.querySelectorAll('ul').forEach(function (ul) {\n if (!ul.firstChild || ul.textContent.trim() === '') {\n ul.parentNode.removeChild(ul);\n }\n });\n e.event.preventDefault();\n }\n };\n Lists.prototype.onKeyUp = function (e) {\n if (!isNOU(this.commonLIParent) && !isNOU(this.commonLIParent.querySelector('.removeList'))) {\n var currentLIElem = this.commonLIParent.querySelector('.removeList');\n while (!isNOU(currentLIElem.firstChild)) {\n this.parent.domNode.insertAfter(currentLIElem.firstChild, currentLIElem);\n }\n detach(currentLIElem);\n }\n if (e.event.keyCode === 13) {\n var listElements = this.parent.editableElement.querySelectorAll('UL, OL');\n for (var i = 0; i < listElements.length; i++) {\n if (!isNullOrUndefined(listElements[i]) && !isNullOrUndefined(listElements[i].parentElement) && !isNullOrUndefined(listElements[i].previousElementSibling) && (listElements[i].parentElement.nodeName === 'UL' || listElements[i].parentElement.nodeName === 'OL')) {\n listElements[i].previousElementSibling.appendChild(listElements[i]);\n }\n }\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Lists.prototype.firstListBackSpace = function (range, _e) {\n var startNode = this.parent.domNode.getSelectedNode(range.startContainer, range.startOffset);\n if (!isNOU(startNode.closest('OL'))) {\n this.commonLIParent = startNode.closest('OL');\n }\n else if (!isNOU(startNode.closest('UL'))) {\n this.commonLIParent = startNode.closest('UL');\n }\n if (startNode.nodeName === 'LI' && range.startOffset === 0 && range.endOffset === 0 &&\n isNOU(startNode.previousSibling) && !isNOU(this.commonLIParent) && isNOU(this.commonLIParent.previousSibling) &&\n (isNOU(this.commonLIParent.parentElement.closest('OL')) && isNOU(this.commonLIParent.parentElement.closest('UL')) &&\n isNOU(this.commonLIParent.parentElement.closest('LI')))) {\n var currentElem = createElement('P');\n currentElem.innerHTML = '​';\n startNode.classList.add('removeList');\n this.commonLIParent.parentElement.insertBefore(currentElem, this.commonLIParent);\n }\n };\n Lists.prototype.keyDownHandler = function (e) {\n if (e.event.which === 13) {\n this.enterList(e);\n }\n if (e.event.which === 32) {\n this.spaceList(e);\n }\n if (e.event.which === 8) {\n this.backspaceList(e);\n }\n if ((e.event.which === 46 && e.event.action === 'delete') || (e.event.which === 88 && e.event.action === 'cut')) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var commonAncestor = range.commonAncestorContainer;\n var startEle = range.startContainer;\n var endEle = range.endContainer;\n var startNode = startEle.nodeType === 3 ? startEle.parentElement : startEle;\n var endNode = endEle.nodeType === 3 ? endEle.parentElement : endEle;\n if ((commonAncestor.nodeName === 'UL' || commonAncestor.nodeName === 'OL') && startNode !== endNode\n && (!isNullOrUndefined(closest(startNode, 'ul')) || !isNullOrUndefined(closest(startNode, 'ol')))\n && (!isNullOrUndefined(closest(endNode, 'ul')) || !isNullOrUndefined(closest(endNode, 'ol')))\n && (commonAncestor.lastElementChild === closest(endNode, 'li')) && !range.collapsed) {\n detach(commonAncestor);\n }\n this.removeList(range, e);\n }\n if (e.event.which === 9) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n if (!(e.event.action && e.event.action === 'indent')) {\n this.saveSelection = this.parent.nodeSelection.save(range, this.parent.currentDocument);\n }\n var blockNodes = void 0;\n var startOffset = range.startOffset;\n var endOffset = range.endOffset;\n var startNode = this.parent.domNode.getSelectedNode(range.startContainer, range.startOffset);\n var endNode = this.parent.domNode.getSelectedNode(range.endContainer, range.endOffset);\n if ((startNode === endNode && (startNode.nodeName === 'BR' || startNode.nodeName === '#text') &&\n CONSTANT.IGNORE_BLOCK_TAGS.indexOf(startNode.parentNode.tagName.toLocaleLowerCase()) >= 0)) {\n return;\n }\n else {\n if (!(e.event.action && e.event.action === 'indent')) {\n this.domNode.setMarker(this.saveSelection);\n }\n blockNodes = this.domNode.blockNodes();\n }\n var nodes = [];\n var isNested = true;\n for (var i = 0; i < blockNodes.length; i++) {\n if (blockNodes[i].parentNode.tagName === 'LI') {\n nodes.push(blockNodes[i].parentNode);\n }\n else if (blockNodes[i].tagName === 'LI' && blockNodes[i].childNodes[0].tagName !== 'P' &&\n (blockNodes[i].childNodes[0].tagName !== 'OL' &&\n blockNodes[i].childNodes[0].tagName !== 'UL')) {\n nodes.push(blockNodes[i]);\n }\n }\n if (nodes.length > 1 || nodes.length && ((startOffset === 0 && endOffset === 0) || e.ignoreDefault)) {\n e.event.preventDefault();\n e.event.stopPropagation();\n this.currentAction = this.getAction(nodes[0]);\n if (e.event.shiftKey) {\n this.revertList(nodes, e);\n this.revertClean();\n }\n else {\n isNested = this.nestedList(nodes);\n }\n if (isNested) {\n this.cleanNode();\n this.parent.editableElement.focus();\n }\n if (!(e.event.action && e.event.action === 'indent')) {\n this.saveSelection = this.domNode.saveMarker(this.saveSelection);\n this.saveSelection.restore();\n if (e.callBack) {\n e.callBack({\n requestType: this.currentAction,\n editorMode: 'HTML',\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.domNode.blockNodes(),\n event: e.event\n });\n }\n }\n }\n else {\n if (!(e.event.action && e.event.action === 'indent')) {\n if (e.event && e.event.shiftKey && e.event.key === 'Tab') {\n e.event.action = 'tab';\n }\n this.saveSelection = this.domNode.saveMarker(this.saveSelection, e.event.action);\n this.saveSelection.restore();\n }\n }\n }\n else {\n switch (e.event.action) {\n case 'ordered-list':\n this.applyListsHandler({ subCommand: 'OL', callBack: e.callBack });\n e.event.preventDefault();\n break;\n case 'unordered-list':\n this.applyListsHandler({ subCommand: 'UL', callBack: e.callBack });\n e.event.preventDefault();\n break;\n }\n }\n };\n Lists.prototype.spaceKeyAction = function (e) {\n if (e.event.which === 32) {\n this.spaceList(e);\n }\n };\n Lists.prototype.getAction = function (element) {\n var parentNode = element.parentNode;\n return (parentNode.nodeName === 'OL' ? 'OL' : 'UL');\n };\n Lists.prototype.revertClean = function () {\n var collectionNodes = this.parent.editableElement.querySelectorAll('ul, ol');\n for (var i = 0; i < collectionNodes.length; i++) {\n var listNodes = collectionNodes[i].querySelectorAll('ul, ol');\n if (listNodes.length > 0) {\n for (var j = 0; j < listNodes.length; j++) {\n var prevSibling = listNodes[j].previousSibling;\n if (prevSibling && prevSibling.tagName === 'LI') {\n prevSibling.appendChild(listNodes[j]);\n }\n }\n }\n }\n };\n Lists.prototype.noPreviousElement = function (elements) {\n var firstNode;\n var firstNodeOL;\n var siblingListOL = elements.querySelectorAll('ol, ul');\n var siblingListLI = elements\n .querySelectorAll('li');\n var siblingListLIFirst = this.domNode.contents(siblingListLI[0])[0];\n if (siblingListLI.length > 0 && (siblingListLIFirst.nodeName === 'OL' || siblingListLIFirst.nodeName === 'UL')) {\n firstNode = siblingListLI[0];\n }\n else {\n firstNodeOL = siblingListOL[0];\n }\n if (firstNode) {\n for (var h = this.domNode.contents(elements)[0]; h && !this.domNode.isList(h); null) {\n var nextSibling = h.nextSibling;\n prepend([h], firstNode);\n setStyleAttribute(elements, { 'list-style-type': 'none' });\n setStyleAttribute(firstNode, { 'list-style-type': '' });\n h = nextSibling;\n }\n }\n else if (firstNodeOL) {\n var nestedElement = createElement('li');\n prepend([nestedElement], firstNodeOL);\n for (var h = this.domNode.contents(elements)[0]; h && !this.domNode.isList(h); null) {\n var nextSibling = h.nextSibling;\n nestedElement.appendChild(h);\n h = nextSibling;\n }\n prepend([firstNodeOL], elements.parentNode);\n detach(elements);\n var nestedElementLI = createElement('li', { styles: 'list-style-type: none;' });\n prepend([nestedElementLI], firstNodeOL.parentNode);\n append([firstNodeOL], nestedElementLI);\n }\n else {\n var nestedElementLI = createElement('li', { styles: 'list-style-type: none;' });\n prepend([nestedElementLI], elements.parentNode);\n var nestedElement = createElement(elements.parentNode.tagName);\n prepend([nestedElement], nestedElementLI);\n append([elements], nestedElement);\n }\n };\n Lists.prototype.nestedList = function (elements) {\n var isNested = false;\n for (var i = 0; i < elements.length; i++) {\n var prevSibling = this.domNode.getPreviousNode(elements[i]);\n if (prevSibling) {\n isNested = true;\n var firstNode = void 0;\n var firstNodeLI = void 0;\n var siblingListOL = elements[i].querySelectorAll('ol, ul');\n var siblingListLI = elements[i]\n .querySelectorAll('li');\n var siblingListLIFirst = this.domNode.contents(siblingListLI[0])[0];\n if (siblingListLI.length > 0 && (siblingListLIFirst.nodeName === 'OL' || siblingListLIFirst.nodeName === 'UL')) {\n firstNodeLI = siblingListLI[0];\n }\n else {\n firstNode = siblingListOL[0];\n }\n if (firstNode) {\n var nestedElement = createElement('li');\n prepend([nestedElement], firstNode);\n for (var h = this.domNode.contents(elements[i])[0]; h && !this.domNode.isList(h); null) {\n var nextSibling = h.nextSibling;\n nestedElement.appendChild(h);\n h = nextSibling;\n }\n append([firstNode], prevSibling);\n detach(elements[i]);\n }\n else if (firstNodeLI) {\n if (prevSibling.tagName === 'LI') {\n for (var h = this.domNode.contents(elements[i])[0]; h && !this.domNode.isList(h); null) {\n var nextSibling = h.nextSibling;\n prepend([h], firstNodeLI);\n setStyleAttribute(elements[i], { 'list-style-type': 'none' });\n setStyleAttribute(firstNodeLI, { 'list-style-type': '' });\n h = nextSibling;\n }\n append([firstNodeLI.parentNode], prevSibling);\n detach(elements[i]);\n }\n }\n else {\n if (prevSibling.tagName === 'LI') {\n var nestedElement = createElement(elements[i].parentNode.tagName);\n nestedElement.style.listStyleType =\n elements[i].parentNode.style.listStyleType;\n append([nestedElement], prevSibling);\n append([elements[i]], nestedElement);\n }\n else if (prevSibling.tagName === 'OL' || prevSibling.tagName === 'UL') {\n append([elements[i]], prevSibling);\n }\n }\n }\n else {\n var element = elements[i];\n isNested = true;\n this.noPreviousElement(element);\n }\n }\n return isNested;\n };\n Lists.prototype.applyListsHandler = function (e) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n if (Browser.userAgent.indexOf('Firefox') !== -1 && range.startContainer === range.endContainer && range.startContainer === this.parent.editableElement) {\n var startChildNodes = range.startContainer.childNodes;\n var startNode = ((startChildNodes[(range.startOffset > 0) ? (range.startOffset - 1) :\n range.startOffset]) || range.startContainer);\n var endNode = (range.endContainer.childNodes[(range.endOffset > 0) ? (range.endOffset - 1) :\n range.endOffset] || range.endContainer);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var lastSelectionNode = endNode.lastChild.nodeName === 'BR' ? (isNOU(endNode.lastChild.previousSibling) ? endNode\n : endNode.lastChild.previousSibling) : endNode.lastChild;\n while (!isNOU(lastSelectionNode) && lastSelectionNode.nodeName !== '#text' && lastSelectionNode.nodeName !== 'IMG' &&\n lastSelectionNode.nodeName !== 'BR' && lastSelectionNode.nodeName !== 'HR') {\n lastSelectionNode = lastSelectionNode.lastChild;\n }\n this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, startNode, lastSelectionNode, 0, lastSelectionNode.textContent.length);\n range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n }\n if (range.startContainer === range.endContainer && range.startContainer === this.parent.editableElement &&\n range.startOffset === range.endOffset && range.startOffset === 0 &&\n this.parent.editableElement.textContent.length === 0 && (this.parent.editableElement.childNodes[0].nodeName !== 'TABLE' &&\n this.parent.editableElement.childNodes[0].nodeName !== 'IMG')) {\n var focusNode = range.startContainer.childNodes[0];\n this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, focusNode, focusNode, 0, 0);\n range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n }\n this.saveSelection = this.parent.nodeSelection.save(range, this.parent.currentDocument);\n this.currentAction = e.subCommand;\n this.currentAction = e.subCommand = this.currentAction === 'NumberFormatList' ? 'OL' : this.currentAction === 'BulletFormatList' ? 'UL' : this.currentAction;\n this.domNode.setMarker(this.saveSelection);\n var listsNodes = this.domNode.blockNodes(true);\n if (e.enterAction === 'BR') {\n this.setSelectionBRConfig();\n this.parent.domNode.convertToBlockNodes(this.parent.domNode.blockNodes(), true);\n this.setSelectionBRConfig();\n listsNodes = this.parent.domNode.blockNodes();\n }\n for (var i = 0; i < listsNodes.length; i++) {\n if (listsNodes[i].tagName === 'TABLE' && !range.collapsed) {\n listsNodes.splice(i, 1);\n }\n if (listsNodes.length > 0 && listsNodes[i].tagName !== 'LI'\n && 'LI' === listsNodes[i].parentNode.tagName) {\n listsNodes[i] = listsNodes[i].parentNode;\n }\n }\n this.applyLists(listsNodes, this.currentAction, e.selector, e.item, e);\n if (e.callBack) {\n e.callBack({\n requestType: this.currentAction,\n event: e.event,\n editorMode: 'HTML',\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.domNode.blockNodes()\n });\n }\n };\n Lists.prototype.setSelectionBRConfig = function () {\n var startElem = this.parent.editableElement.querySelector('.' + markerClassName.startSelection);\n var endElem = this.parent.editableElement.querySelector('.' + markerClassName.endSelection);\n if (isNOU(endElem)) {\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, startElem, 0);\n }\n else {\n this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, startElem, endElem, 0, 0);\n }\n };\n Lists.prototype.applyLists = function (elements, type, selector, item, e) {\n var isReverse = true;\n if (this.isRevert(elements, type, item) && isNOU(item) || (!isNOU(item) && item.listStyle === 'none')) {\n this.revertList(elements, e);\n this.removeEmptyListElements();\n }\n else {\n this.checkLists(elements, type, item);\n var marginLeftAttribute = '';\n if (elements[0].style.marginLeft !== '') {\n marginLeftAttribute = ' style = \"margin-left: ' + elements[0].style.marginLeft + ';\"';\n }\n for (var i = 0; i < elements.length; i++) {\n if (!isNOU(item) && !isNOU(item.listStyle)) {\n if (item.listStyle === 'listImage') {\n setStyleAttribute(elements[i], { 'list-style-image': item.listImage });\n }\n else {\n setStyleAttribute(elements[i], { 'list-style-image': 'none' });\n setStyleAttribute(elements[i], { 'list-style-type': item.listStyle.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() });\n }\n }\n var elemAtt = void 0;\n elements[i].style.removeProperty('margin-left');\n elemAtt = elements[i].tagName === 'IMG' || elements[i].classList.contains('e-editor-select-start') ? '' : this.domNode.attributes(elements[i]);\n if (elements[i].getAttribute('contenteditable') === 'true'\n && elements[i].childNodes.length === 1 && elements[i].childNodes[0].nodeName === 'TABLE') {\n var listEle = document.createElement(type);\n listEle.innerHTML = '

    • ';\n elements[i].appendChild(listEle);\n }\n else if ('LI' !== elements[i].tagName && isNOU(item) &&\n elements[i].nodeName === 'BLOCKQUOTE') {\n isReverse = false;\n var openTag = '<' + type + marginLeftAttribute + '>';\n var closeTag = '';\n var newTag = 'li' + elemAtt;\n var replaceHTML = elements[i].innerHTML;\n var innerHTML = this.domNode.createTagString(newTag, null, replaceHTML);\n var collectionString = openTag + innerHTML + closeTag;\n elements[i].innerHTML = collectionString;\n }\n else if ('LI' !== elements[i].tagName && isNOU(item)) {\n isReverse = false;\n var openTag = '<' + type + marginLeftAttribute + '>';\n var closeTag = '';\n var newTag = 'li' + elemAtt;\n var replaceHTML = (elements[i].tagName.toLowerCase() === CONSTANT.DEFAULT_TAG ?\n elements[i].innerHTML : elements[i].outerHTML);\n var innerHTML = this.domNode.createTagString(newTag, null, replaceHTML);\n var collectionString = openTag + innerHTML + closeTag;\n this.domNode.replaceWith(elements[i], collectionString);\n }\n else if (!isNOU(item) && 'LI' !== elements[i].tagName) {\n // eslint-disable-next-line\n isReverse = false;\n var currentElemAtt = elements[i].tagName === 'IMG' ? '' : this.domNode.attributes(elements[i]);\n var openTag = '<' + type + currentElemAtt + '>';\n var closeTag = '';\n var newTag = 'li';\n var replaceHTML = (elements[i].tagName.toLowerCase() === CONSTANT.DEFAULT_TAG ?\n elements[i].innerHTML : elements[i].outerHTML);\n var innerHTML = this.domNode.createTagString(newTag, null, replaceHTML);\n var collectionString = openTag + innerHTML + closeTag;\n this.domNode.replaceWith(elements[i], collectionString);\n }\n }\n }\n this.cleanNode();\n if (e.enterAction === 'BR') {\n var spansToRemove = document.querySelectorAll('span#removeSpan');\n spansToRemove.forEach(function (span) {\n var fragment = document.createDocumentFragment();\n while (span.firstChild) {\n fragment.appendChild(span.firstChild);\n }\n span.parentNode.replaceChild(fragment, span);\n });\n }\n this.parent.editableElement.focus();\n if (isIDevice()) {\n setEditFrameFocus(this.parent.editableElement, selector);\n }\n this.saveSelection = this.domNode.saveMarker(this.saveSelection);\n this.saveSelection.restore();\n };\n Lists.prototype.removeEmptyListElements = function () {\n var listElem = this.parent.editableElement.querySelectorAll('ol, ul');\n for (var i = 0; i < listElem.length; i++) {\n if (listElem[i].textContent.trim() === '') {\n detach(listElem[i]);\n }\n }\n };\n Lists.prototype.isRevert = function (nodes, tagName, item) {\n var isRevert = true;\n for (var i = 0; i < nodes.length; i++) {\n if (nodes[i].tagName !== 'LI') {\n return false;\n }\n if (nodes[i].parentNode.tagName !== tagName ||\n isNOU(item) && nodes[i].parentNode.style.listStyleType !== '') {\n isRevert = false;\n }\n if (nodes[i].parentNode.tagName === tagName && nodes[i].parentNode.style.listStyleType !== '') {\n isRevert = true;\n }\n }\n return isRevert;\n };\n Lists.prototype.checkLists = function (nodes, tagName, item) {\n var nodesTemp = [];\n for (var i = 0; i < nodes.length; i++) {\n var node = nodes[i].parentNode;\n if (!isNOU(item) && 'LI' === nodes[i].tagName && !isNOU(item.listStyle)) {\n if (item.listStyle === 'listImage') {\n setStyleAttribute(node, { 'list-style-image': item.listImage });\n }\n else {\n setStyleAttribute(node, { 'list-style-image': 'none' });\n setStyleAttribute(node, { 'list-style-type': item.listStyle.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() });\n }\n }\n if ((nodes[i].tagName === 'LI' && node.tagName !== tagName && nodesTemp.indexOf(node) < 0) ||\n (nodes[i].tagName === 'LI' && node.tagName === tagName && nodesTemp.indexOf(node) < 0 && item !== null)) {\n nodesTemp.push(node);\n }\n if (isNOU(item) && (node.tagName === tagName ||\n ((node.tagName === 'UL' || node.tagName === 'OL') && node.hasAttribute('style')))) {\n if (node.hasAttribute('style')) {\n node.removeAttribute('style');\n }\n }\n }\n for (var j = nodesTemp.length - 1; j >= 0; j--) {\n var h = nodesTemp[j];\n var replace = '<' + tagName.toLowerCase() + ' '\n + this.domNode.attributes(h) + '>' + h.innerHTML + '';\n this.domNode.replaceWith(nodesTemp[j], replace);\n }\n };\n Lists.prototype.cleanNode = function () {\n var liParents = this.parent.editableElement.querySelectorAll('ol + ol, ul + ul');\n var listStyleType;\n var firstNodeOL;\n for (var c = 0; c < liParents.length; c++) {\n var node = liParents[c];\n var toFindtopOlUl = true;\n var containsListElements = node;\n while (containsListElements.parentElement) {\n if (containsListElements.parentElement && containsListElements.parentElement.tagName !== 'LI' && containsListElements.parentElement.tagName !== 'OL' && containsListElements.parentElement.tagName !== 'UL') {\n break;\n }\n containsListElements = containsListElements.parentElement;\n }\n if (toFindtopOlUl && (liParents[c].parentElement.parentElement.nodeName === 'OL' || liParents[c].parentElement.parentElement.nodeName === 'UL')) {\n toFindtopOlUl = false;\n var preElement = liParents[c].parentElement.parentElement;\n listStyleType = preElement.style.listStyleType;\n firstNodeOL = node.previousElementSibling;\n }\n if (this.domNode.isList(node.previousElementSibling) &&\n this.domNode.openTagString(node) === this.domNode.openTagString(node.previousElementSibling)) {\n var contentNodes = this.domNode.contents(node);\n for (var f = 0; f < contentNodes.length; f++) {\n node.previousElementSibling.appendChild(contentNodes[f]);\n }\n node.parentNode.removeChild(node);\n }\n else if (!isNOU(node.getAttribute('level'))) {\n if (node.tagName === node.previousElementSibling.tagName) {\n node.previousElementSibling.lastChild.append(node);\n }\n }\n else if (this.domNode.isList(node.previousElementSibling) && containsListElements.contains(node.previousElementSibling) && ((node.tagName === 'OL' || node.tagName === 'UL') && (node.previousElementSibling.nodeName === 'OL' || node.previousElementSibling.nodeName === 'UL'))) {\n var contentNodes = this.domNode.contents(node);\n for (var f = 0; f < contentNodes.length; f++) {\n node.previousElementSibling.appendChild(contentNodes[f]);\n }\n node.parentNode.removeChild(node);\n }\n }\n if (firstNodeOL) {\n firstNodeOL.style.listStyleType = listStyleType;\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var listOlUlElements = [];\n if (range.commonAncestorContainer.nodeName === 'UL' || range.commonAncestorContainer.nodeName === 'OL') {\n if (range.commonAncestorContainer instanceof Element) {\n listOlUlElements.push(range.commonAncestorContainer);\n }\n listOlUlElements = listOlUlElements.concat(Array.from(range.commonAncestorContainer.querySelectorAll('ol, ul')));\n }\n else {\n listOlUlElements = Array.from(range.commonAncestorContainer.querySelectorAll('ol, ul'));\n }\n for (var k = 0; k < listOlUlElements.length; k++) {\n var listStyle = void 0;\n var listElements = listOlUlElements[k];\n while (listElements) {\n if (listElements.nodeName === 'OL' || listElements.nodeName === 'OL') {\n if (listElements.style.listStyleType !== '' && listElements.style.listStyleType !== 'none' && listElements.nodeName !== 'LI') {\n listStyle = listElements.style.listStyleType;\n }\n else if (!isNOU(listStyle) && (listElements.style.listStyleType === '' || listElements.style.listStyleType === 'none') &&\n listElements.nodeName !== 'LI' && (listElements.nodeName === 'UL' || listElements.nodeName === 'OL')) {\n listElements.style.listStyleType = listStyle;\n }\n }\n listElements = listElements.querySelector('UL,OL');\n }\n }\n }\n };\n Lists.prototype.findUnSelected = function (temp, elements) {\n temp = temp.slice().reverse();\n if (temp.length > 0) {\n var rightIndent = [];\n var indentElements = [];\n var lastElement = elements[elements.length - 1];\n var lastElementChild = [];\n var childElements = [];\n lastElementChild = (lastElement.childNodes);\n for (var z = 0; z < lastElementChild.length; z++) {\n if (lastElementChild[z].tagName === 'OL' || lastElementChild[z].tagName === 'UL') {\n var childLI = lastElementChild[z]\n .querySelectorAll('li');\n if (childLI.length > 0) {\n for (var y = 0; y < childLI.length; y++) {\n childElements.push(childLI[y]);\n }\n }\n }\n }\n for (var i = 0; i < childElements.length; i++) {\n var count = 0;\n for (var j = 0; j < temp.length; j++) {\n if (!childElements[i].contains((temp[j]))) {\n count = count + 1;\n }\n }\n if (count === temp.length) {\n indentElements.push(childElements[i]);\n }\n }\n if (indentElements.length > 0) {\n for (var x = 0; x < indentElements.length; x++) {\n if (this.domNode.contents(indentElements[x])[0].nodeName !== 'OL' &&\n this.domNode.contents(indentElements[x])[0].nodeName !== 'UL') {\n rightIndent.push(indentElements[x]);\n }\n }\n }\n if (rightIndent.length > 0) {\n this.nestedList(rightIndent);\n }\n }\n };\n Lists.prototype.revertList = function (elements, e) {\n var temp = [];\n for (var i = elements.length - 1; i >= 0; i--) {\n for (var j = i - 1; j >= 0; j--) {\n if (elements[j].contains((elements[i])) || elements[j] === elements[i]) {\n temp.push(elements[i]);\n elements.splice(i, 1);\n break;\n }\n }\n }\n this.findUnSelected(temp, elements);\n var viewNode = [];\n for (var i = 0; i < elements.length; i++) {\n var element = elements[i];\n if ((isNullOrUndefined(e.item)) || ((element.nodeName === 'LI' && e.item.listStyle === 'none'))) {\n if (this.domNode.contents(element)[0].nodeType === 3 && this.domNode.contents(element)[0].textContent.trim().length === 0) {\n detach(this.domNode.contents(element)[0]);\n }\n var parentNode = elements[i].parentNode;\n var className = element.getAttribute('class');\n if (temp.length === 0) {\n var siblingList = elements[i].querySelectorAll('ul, ol');\n var firstNode = siblingList[0];\n if (firstNode) {\n var child = firstNode\n .querySelectorAll('li');\n if (child) {\n var nestedElement = createElement(firstNode.tagName);\n append([nestedElement], firstNode.parentNode);\n var nestedElementLI = createElement('li', { styles: 'list-style-type: none;' });\n append([nestedElementLI], nestedElement);\n append([firstNode], nestedElementLI);\n }\n }\n }\n if (element.parentNode.insertBefore(this.closeTag(parentNode.tagName), element),\n 'LI' === parentNode.parentNode.tagName || 'OL' === parentNode.parentNode.tagName ||\n 'UL' === parentNode.parentNode.tagName) {\n element.parentNode.insertBefore(this.closeTag('LI'), element);\n }\n else {\n var classAttr = '';\n if (className) {\n // eslint-disable-next-line\n classAttr += ' class=\"' + className + '\"';\n }\n if (CONSTANT.DEFAULT_TAG && 0 === element.querySelectorAll(CONSTANT.BLOCK_TAGS.join(', ')).length) {\n var wrapperclass = isNullOrUndefined(className) ? ' class=\"e-rte-wrap-inner\"' :\n ' class=\"' + className + ' e-rte-wrap-inner\"';\n var parentElement = parentNode;\n if (elements.length === parentElement.querySelectorAll('li').length) {\n if (!isNOU(parentElement.style.listStyleType)) {\n parentNode.style.removeProperty(\"list-style-type\");\n }\n if (!isNOU(parentElement.style.listStyleImage)) {\n parentNode.style.removeProperty(\"list-style-image\");\n }\n if (parentElement.style.length === 0) {\n parentNode.removeAttribute(\"style\");\n }\n }\n var wrapper = '<' + e.enterAction + wrapperclass + this.domNode.attributes(element) + '>';\n if (e.enterAction !== 'BR') {\n this.domNode.wrapInner(element, this.domNode.parseHTMLFragment(wrapper));\n }\n else {\n var wrapperSpan = '';\n var br = document.createElement('br');\n this.domNode.wrapInner(element, this.domNode.parseHTMLFragment(wrapperSpan));\n element.appendChild(br);\n }\n }\n else if (this.domNode.contents(element)[0].nodeType === 3) {\n var replace = this.domNode.createTagString(CONSTANT.DEFAULT_TAG, parentNode, this.parent.domNode.encode(this.domNode.contents(element)[0].textContent));\n this.domNode.replaceWith(this.domNode.contents(element)[0], replace);\n }\n else if (this.domNode.contents(element)[0].classList.contains(markerClassName.startSelection) ||\n this.domNode.contents(element)[0].classList.contains(markerClassName.endSelection)) {\n var replace = this.domNode.createTagString(CONSTANT.DEFAULT_TAG, parentNode, this.domNode.contents(element)[0].outerHTML);\n this.domNode.replaceWith(this.domNode.contents(element)[0], replace);\n }\n else {\n var childNode = element.firstChild;\n if (childNode) {\n var attributes_1 = element.parentElement.attributes;\n if (attributes_1.length > 0) {\n for (var d = 0; d < attributes_1.length; d++) {\n var e_1 = attributes_1[d];\n var existingValue = childNode.getAttribute(e_1.nodeName);\n var parentValue = (element.parentElement).getAttribute(e_1.nodeName);\n childNode.setAttribute(e_1.nodeName, existingValue ? parentValue + ' ' + existingValue : parentValue);\n }\n }\n }\n className = childNode.getAttribute('class');\n if (className && childNode.getAttribute('class')) {\n attributes(childNode, { 'class': className + ' ' + childNode.getAttribute('class') });\n }\n }\n append([this.openTag('LI')], element);\n prepend([this.closeTag('LI')], element);\n }\n this.domNode.insertAfter(this.openTag(parentNode.tagName), element);\n if (parentNode.parentNode.tagName === 'LI') {\n parentNode = parentNode.parentNode.parentNode;\n }\n if (viewNode.indexOf(parentNode) < 0) {\n viewNode.push(parentNode);\n }\n }\n }\n for (var i = 0; i < viewNode.length; i++) {\n var node = viewNode[i];\n var nodeInnerHtml = node.innerHTML;\n var closeTag = /<\\/span>/g;\n var openTag = /<\\/span>/g;\n nodeInnerHtml = nodeInnerHtml.replace(closeTag, '');\n nodeInnerHtml = nodeInnerHtml.replace(openTag, '<$1 ' + this.domNode.attributes(node) + '>');\n this.domNode.replaceWith(node, this.domNode.openTagString(node) + nodeInnerHtml.trim() + this.domNode.closeTagString(node));\n }\n var emptyUl = this.parent.editableElement.querySelectorAll('ul:empty, ol:empty');\n for (var i = 0; i < emptyUl.length; i++) {\n detach(emptyUl[i]);\n }\n var emptyLi = this.parent.editableElement.querySelectorAll('li:empty');\n for (var i = 0; i < emptyLi.length; i++) {\n detach(emptyLi[i]);\n }\n };\n Lists.prototype.openTag = function (type) {\n return this.domNode.parseHTMLFragment('');\n };\n Lists.prototype.closeTag = function (type) {\n return this.domNode.parseHTMLFragment('');\n };\n return Lists;\n}());\nexport { Lists };\n","/**\n * Node appending methods.\n *\n * @hidden\n */\nvar InsertMethods = /** @class */ (function () {\n function InsertMethods() {\n }\n /**\n * WrapBefore method\n *\n * @param {Text} textNode - specifies the text node\n * @param {HTMLElement} parentNode - specifies the parent node\n * @param {boolean} isAfter - specifies the boolean value\n * @returns {Text} - returns the text value\n * @hidden\n\n */\n InsertMethods.WrapBefore = function (textNode, parentNode, isAfter) {\n parentNode.innerText = textNode.textContent;\n //eslint-disable-next-line\n (!isAfter) ? this.AppendBefore(parentNode, textNode) : this.AppendBefore(parentNode, textNode, true);\n if (textNode.parentNode) {\n textNode.parentNode.removeChild(textNode);\n }\n return parentNode.childNodes[0];\n };\n /**\n * Wrap method\n *\n * @param {HTMLElement} childNode - specifies the child node\n * @param {HTMLElement} parentNode - specifies the parent node.\n * @returns {HTMLElement} - returns the element\n * @hidden\n\n */\n InsertMethods.Wrap = function (childNode, parentNode) {\n this.AppendBefore(parentNode, childNode);\n parentNode.appendChild(childNode);\n return childNode;\n };\n /**\n * unwrap method\n *\n * @param {Node} node - specifies the node element.\n * @returns {Node[]} - returns the array of value\n * @hidden\n\n */\n InsertMethods.unwrap = function (node) {\n var parent = node.parentNode;\n var child = [];\n for (; node.firstChild; null) {\n child.push(parent.insertBefore(node.firstChild, node));\n }\n parent.removeChild(node);\n return child;\n };\n /**\n * AppendBefore method\n *\n * @param {HTMLElement} textNode - specifies the element\n * @param {HTMLElement} parentNode - specifies the parent node\n * @param {boolean} isAfter - specifies the boolean value\n * @returns {void}\n * @hidden\n\n */\n InsertMethods.AppendBefore = function (textNode, parentNode, isAfter) {\n return (parentNode.parentNode) ? ((!isAfter) ? parentNode.parentNode.insertBefore(textNode, parentNode)\n : parentNode.parentNode.insertBefore(textNode, parentNode.nextSibling)) :\n parentNode;\n };\n return InsertMethods;\n}());\nexport { InsertMethods };\n","import { NodeSelection } from './../../selection/index';\nimport { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport { InsertMethods } from './insert-methods';\n/**\n * Split the Node based on selection\n *\n * @hidden\n\n */\nvar NodeCutter = /** @class */ (function () {\n function NodeCutter() {\n this.enterAction = 'P';\n this.position = -1;\n this.nodeSelection = new NodeSelection();\n }\n // Split Selection Node\n /**\n * GetSpliceNode method\n *\n * @param {Range} range - specifies the range\n * @param {HTMLElement} node - specifies the node element.\n * @returns {Node} - returns the node value\n * @hidden\n\n */\n NodeCutter.prototype.GetSpliceNode = function (range, node) {\n node = this.SplitNode(range, node, true);\n node = this.SplitNode(range, node, false);\n return node;\n };\n /**\n * @param {Range} range - specifies the range\n * @param {HTMLElement} node - specifies the node element.\n * @param {boolean} isCollapsed - specifies the boolean value\n * @returns {HTMLElement} - returns the element\n * @hidden\n\n */\n NodeCutter.prototype.SplitNode = function (range, node, isCollapsed) {\n if (node) {\n var clone = range.cloneRange();\n var parent_1 = node.parentNode;\n var index = this.nodeSelection.getIndex(node);\n clone.collapse(isCollapsed);\n // eslint-disable-next-line\n (isCollapsed) ? clone.setStartBefore(node) : clone.setEndAfter(node);\n var fragment = clone.extractContents();\n if (isCollapsed) {\n node = parent_1.childNodes[index];\n fragment = this.spliceEmptyNode(fragment, false);\n if (fragment && fragment.childNodes.length > 0) {\n var isEmpty = (fragment.childNodes.length === 1 && fragment.childNodes[0].nodeName !== 'IMG' && !(fragment.querySelectorAll('img').length > 0)\n && this.isRteElm(fragment) && fragment.textContent.trim() === '') ? true : false;\n if (!isEmpty) {\n if (node) {\n InsertMethods.AppendBefore(fragment, node);\n }\n else {\n parent_1.appendChild(fragment);\n var divNode = document.createElement('div');\n divNode.innerHTML = '';\n node = divNode.firstChild;\n parent_1.appendChild(node);\n }\n }\n }\n }\n else {\n node = parent_1.childNodes.length > 1 ? parent_1.childNodes[index] :\n parent_1.childNodes[0];\n fragment = this.spliceEmptyNode(fragment, true);\n if (fragment && fragment.childNodes.length > 0) {\n var isEmpty = (fragment.childNodes.length === 1 && fragment.childNodes[0].nodeName !== 'IMG'\n && this.isRteElm(fragment) && fragment.textContent.trim() === '') ? true : false;\n if (!isEmpty) {\n if (node) {\n InsertMethods.AppendBefore(fragment, node, true);\n }\n else {\n parent_1.appendChild(fragment);\n var divNode = document.createElement('div');\n divNode.innerHTML = '';\n parent_1.insertBefore(divNode.firstChild, parent_1.firstChild);\n node = parent_1.firstChild;\n }\n }\n }\n }\n return node;\n }\n else {\n return null;\n }\n };\n NodeCutter.prototype.isRteElm = function (fragment) {\n var result = true;\n if (fragment.childNodes.length === 1 && fragment.childNodes[0].nodeName !== 'IMG') {\n var firstChild = fragment.childNodes[0];\n for (var i = 0; !isNOU(firstChild.childNodes) && i < firstChild.childNodes.length; i++) {\n if (firstChild.childNodes[i].nodeName === 'IMG' || (firstChild.childNodes[i].nodeName === 'SPAN' &&\n (firstChild.childNodes[i].classList.contains('e-video-wrap') ||\n firstChild.childNodes[i].classList.contains('e-embed-video-wrap') ||\n firstChild.childNodes[i].classList.contains('e-audio-wrap')))) {\n result = false;\n }\n }\n }\n else {\n result = true;\n }\n return result;\n };\n NodeCutter.prototype.spliceEmptyNode = function (fragment, isStart) {\n var len;\n if (fragment.childNodes.length === 1 && fragment.childNodes[0].nodeName === '#text' &&\n fragment.childNodes[0].textContent === '' || fragment.textContent === '') {\n len = -1;\n }\n else {\n len = fragment.childNodes.length - 1;\n }\n if (len > -1 && !isStart) {\n this.spliceEmptyNode(fragment.childNodes[len], isStart);\n }\n else if (len > -1) {\n this.spliceEmptyNode(fragment.childNodes[0], isStart);\n }\n else if (fragment.nodeType !== 3 && fragment.nodeType !== 11 && fragment.nodeName !== 'IMG' && !(fragment.querySelectorAll('img').length > 0) && !(fragment.classList.contains('e-video-wrap')) && !(fragment.classList.contains('e-audio-wrap'))) {\n fragment.parentNode.removeChild(fragment);\n }\n return fragment;\n };\n // Cursor Position split\n NodeCutter.prototype.GetCursorStart = function (indexes, index, isStart) {\n indexes = (isStart) ? indexes : indexes.reverse();\n var position = indexes[0];\n for (var num = 0; num < indexes.length && ((isStart) ? (indexes[num] < index) : (indexes[num] >= index)); num++) {\n position = indexes[num];\n }\n return position;\n };\n /**\n * GetCursorRange method\n *\n * @param {Document} docElement - specifies the document\n * @param {Range} range - specifies the range\n * @param {Node} node - specifies the node.\n * @returns {Range} - returns the range value\n * @hidden\n\n */\n NodeCutter.prototype.GetCursorRange = function (docElement, range, node) {\n var cursorRange = docElement.createRange();\n var indexes = [];\n indexes.push(0);\n var str = this.TrimLineBreak(node.data);\n var index = str.indexOf(' ', 0);\n while (index !== -1) {\n if (indexes.indexOf(index) < 0) {\n indexes.push(index);\n }\n if (new RegExp('\\\\s').test(str[index - 1]) && (indexes.indexOf(index - 1) < 0)) {\n indexes.push(index - 1);\n }\n if (new RegExp('\\\\s').test(str[index + 1])) {\n indexes.push(index + 1);\n }\n index = str.indexOf(' ', (index + 1));\n }\n indexes.push(str.length);\n if ((indexes.indexOf(range.startOffset) >= 0)\n || ((indexes.indexOf(range.startOffset - 1) >= 0) && (range.startOffset !== 1\n || (range.startOffset === 1 && new RegExp('\\\\s').test(str[0])))\n || (((indexes[indexes.length - 1] - 1) === range.startOffset) && range.endOffset !== (str.length - 1) && !new RegExp('\\\\s').test(str[0])))) {\n cursorRange = range;\n this.position = 1;\n }\n else {\n var startOffset = this.GetCursorStart(indexes, range.startOffset, true);\n this.position = range.startOffset - startOffset;\n if (startOffset !== 0 && str[startOffset] && str[startOffset] === ' ') {\n startOffset = startOffset + 1;\n }\n cursorRange.setStart(range.startContainer, startOffset);\n cursorRange.setEnd(range.startContainer, this.GetCursorStart(indexes, range.startOffset, false));\n }\n return cursorRange;\n };\n /**\n * GetCursorNode method\n *\n * @param {Document} docElement - specifies the document\n * @param {Range} range - specifies the range\n * @param {Node} node - specifies the node.\n * @returns {Node} - returns the node value\n * @hidden\n\n */\n NodeCutter.prototype.GetCursorNode = function (docElement, range, node) {\n return this.GetSpliceNode(this.GetCursorRange(docElement, range, node), node);\n };\n /**\n * TrimLineBreak method\n *\n * @param {string} line - specifies the string value.\n * @returns {string} - returns the string\n * @hidden\n\n */\n NodeCutter.prototype.TrimLineBreak = function (line) {\n return line.replace(/(\\r\\n\\t|\\n|\\r\\t)/gm, ' ');\n };\n return NodeCutter;\n}());\nexport { NodeCutter };\n","import * as EVENTS from './../../common/constant';\nimport { isNullOrUndefined as isNOU, detach, createElement, closest } from '@syncfusion/ej2-base';\nimport { isIDevice, setEditFrameFocus } from '../../common/util';\nimport { markerClassName } from './dom-node';\nimport { NodeCutter } from './nodecutter';\n/**\n * Formats internal component\n *\n * @hidden\n\n */\nvar Formats = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the parent element.\n * @hidden\n\n */\n function Formats(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n Formats.prototype.addEventListener = function () {\n this.parent.observer.on(EVENTS.FORMAT_TYPE, this.applyFormats, this);\n this.parent.observer.on(EVENTS.KEY_UP_HANDLER, this.onKeyUp, this);\n this.parent.observer.on(EVENTS.KEY_DOWN_HANDLER, this.onKeyDown, this);\n };\n Formats.prototype.getParentNode = function (node) {\n for (; node.parentNode && node.parentNode !== this.parent.editableElement; null) {\n node = node.parentNode;\n }\n return node;\n };\n Formats.prototype.onKeyUp = function (e) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var endCon = range.endContainer;\n var lastChild = endCon.lastChild;\n if (e.event.which === 13 && range.startContainer === endCon && endCon.nodeType !== 3) {\n var pTag = createElement('p');\n pTag.innerHTML = '
    ';\n if (!isNOU(lastChild) && lastChild && lastChild.nodeName === 'BR' && (lastChild.previousSibling && lastChild.previousSibling.nodeName === 'TABLE')) {\n endCon.replaceChild(pTag, lastChild);\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, pTag, 0);\n }\n else {\n var brNode = this.parent.nodeSelection.getSelectionNodeCollectionBr(range)[0];\n if (!isNOU(brNode) && brNode.nodeName === 'BR' && (brNode.previousSibling && brNode.previousSibling.nodeName === 'TABLE')) {\n endCon.replaceChild(pTag, brNode);\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, pTag, 0);\n }\n }\n }\n if (e.enterAction !== 'BR' && !isNOU(range.startContainer) && !isNOU(range.startContainer.parentElement) && range.startContainer === range.endContainer && range.startContainer.nodeName === '#text' && range.startContainer.parentElement.classList.contains('e-content') && range.startContainer.parentElement.isContentEditable) {\n var pTag = createElement(e.enterAction);\n range.startContainer.parentElement.insertBefore(pTag, range.startContainer);\n pTag.appendChild(range.startContainer);\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, pTag, 1);\n }\n };\n Formats.prototype.getBlockParent = function (node, endNode) {\n var currentParent;\n while (node != endNode) {\n currentParent = node;\n node = node.parentElement;\n }\n return currentParent;\n };\n Formats.prototype.onKeyDown = function (e) {\n if (e.event.which === 13) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var startCon = (range.startContainer.textContent.length === 0 || range.startContainer.nodeName === 'PRE')\n ? range.startContainer : range.startContainer.parentElement;\n var endCon = (range.endContainer.textContent.length === 0 || range.endContainer.nodeName === 'PRE')\n ? range.endContainer : range.endContainer.parentElement;\n var preElem = closest(startCon, 'pre');\n var endPreElem = closest(endCon, 'pre');\n var blockquoteEle = closest(startCon, 'blockquote');\n var endBlockquoteEle = closest(endCon, 'blockquote');\n var liParent = !isNOU(preElem) && !isNOU(preElem.parentElement) && preElem.parentElement.tagName === 'LI';\n if (liParent) {\n return;\n }\n if (((isNOU(preElem) && !isNOU(endPreElem)) || (!isNOU(preElem) && isNOU(endPreElem)))) {\n e.event.preventDefault();\n this.deleteContent(range);\n this.removeCodeContent(range);\n range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, endCon, 0);\n }\n if (e.event.which === 13 && ((!isNOU(blockquoteEle) && !isNOU(endBlockquoteEle)) || (!isNOU(blockquoteEle) && isNOU(endBlockquoteEle)))) {\n var startParent = this.getBlockParent(range.startContainer, blockquoteEle);\n if ((startParent.textContent.charCodeAt(0) === 8203 &&\n startParent.textContent.length === 1) || startParent.textContent.length === 0) {\n if (isNOU(startParent.nextSibling) && ((startParent.previousSibling.textContent.charCodeAt(0) === 8203 &&\n startParent.previousSibling.textContent.length === 1) || startParent.previousSibling.textContent.length === 0)) {\n e.event.preventDefault();\n this.paraFocus(startParent.parentElement); //Revert from blockquotes while pressing enter key\n }\n }\n }\n if (e.event.which === 13 && !isNOU(preElem) && !isNOU(endPreElem)) {\n e.event.preventDefault();\n this.deleteContent(range);\n this.removeCodeContent(range);\n range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var lastEmpty = range.startContainer.childNodes[range.endOffset];\n var lastBeforeBr = range.startContainer.childNodes[range.endOffset - 1];\n var startParent = range.startContainer;\n if (!isNOU(lastEmpty) && !isNOU(lastBeforeBr) && isNOU(lastEmpty.nextSibling) &&\n lastEmpty.nodeName === 'BR' && lastBeforeBr.nodeName === 'BR') {\n this.paraFocus(range.startContainer, e.enterAction);\n }\n else if ((startParent.textContent.charCodeAt(0) === 8203 &&\n startParent.textContent.length === 1) || startParent.textContent.length === 0) {\n //Double enter with any parent tag for the node\n while (startParent.parentElement.nodeName !== 'PRE' &&\n (startParent.textContent.length === 1 || startParent.textContent.length === 0)) {\n startParent = startParent.parentElement;\n }\n if (!isNOU(startParent.previousSibling) && startParent.previousSibling.nodeName === 'BR' &&\n isNOU(startParent.nextSibling)) {\n this.paraFocus(startParent.parentElement);\n }\n else {\n this.isNotEndCursor(preElem, range);\n }\n }\n else {\n //Cursor at start and middle\n this.isNotEndCursor(preElem, range);\n }\n }\n }\n };\n Formats.prototype.removeCodeContent = function (range) {\n // eslint-disable-next-line\n var regEx = new RegExp(String.fromCharCode(65279), 'g');\n if (!isNOU(range.endContainer.textContent.match(regEx))) {\n var pointer = range.endContainer.textContent.charCodeAt(range.endOffset - 1) === 65279 ?\n range.endOffset - 2 : range.endOffset;\n range.endContainer.textContent = range.endContainer.textContent.replace(regEx, '');\n if (range.endContainer.textContent === '') {\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, range.endContainer.parentElement, 0);\n }\n else {\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, range.endContainer, pointer);\n }\n }\n };\n Formats.prototype.deleteContent = function (range) {\n if (range.startContainer !== range.endContainer || range.startOffset !== range.endOffset) {\n range.deleteContents();\n }\n };\n Formats.prototype.paraFocus = function (referNode, enterAction) {\n var insertTag;\n if (enterAction === 'DIV') {\n insertTag = createElement('div');\n insertTag.innerHTML = '
    ';\n }\n else if (enterAction === 'BR') {\n insertTag = createElement('br');\n }\n else {\n insertTag = createElement('p');\n insertTag.innerHTML = '
    ';\n }\n this.parent.domNode.insertAfter(insertTag, referNode);\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, insertTag, 0);\n detach(referNode.lastChild);\n };\n Formats.prototype.isNotEndCursor = function (preElem, range) {\n var nodeCutter = new NodeCutter();\n var isEnd = range.startOffset === preElem.lastChild.textContent.length &&\n preElem.lastChild.textContent === range.startContainer.textContent;\n //Cursor at start point\n if (preElem.textContent.indexOf(range.startContainer.textContent) === 0 &&\n ((range.startOffset === 0 && range.endOffset === 0) || range.startContainer.nodeName === 'PRE')) {\n this.insertMarker(preElem, range);\n var brTag = createElement('br');\n preElem.childNodes[range.endOffset].parentElement.insertBefore(brTag, preElem.childNodes[range.endOffset]);\n }\n else {\n //Cursor at middle\n var cloneNode = nodeCutter.SplitNode(range, preElem, true);\n this.insertMarker(preElem, range);\n var previousSib = preElem.previousElementSibling;\n if (previousSib.tagName === 'PRE') {\n previousSib.insertAdjacentHTML('beforeend', '
    ' + cloneNode.innerHTML);\n detach(preElem);\n }\n }\n //To place the cursor position\n this.setCursorPosition(isEnd, preElem);\n };\n Formats.prototype.setCursorPosition = function (isEnd, preElem) {\n var isEmpty = false;\n var markerElem = this.parent.editableElement.querySelector('.tempSpan');\n var mrkParentElem = markerElem.parentElement;\n // eslint-disable-next-line\n markerElem.parentNode.textContent === '' ? isEmpty = true :\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, markerElem, 0);\n if (isEnd) {\n if (isEmpty) {\n //Enter press when pre element is empty\n if (mrkParentElem === preElem) {\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, markerElem, 0);\n detach(markerElem);\n }\n else {\n this.focusSelectionParent(markerElem, mrkParentElem);\n }\n }\n else {\n var brElm = createElement('br');\n this.parent.domNode.insertAfter(brElm, markerElem);\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, markerElem, 0);\n detach(markerElem);\n }\n }\n else {\n // eslint-disable-next-line\n isEmpty ? this.focusSelectionParent(markerElem, mrkParentElem) : detach(markerElem);\n }\n };\n Formats.prototype.focusSelectionParent = function (markerElem, tempSpanPElem) {\n detach(markerElem);\n tempSpanPElem.innerHTML = '\\u200B';\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, tempSpanPElem, 0);\n };\n Formats.prototype.insertMarker = function (preElem, range) {\n var tempSpan = createElement('span', { className: 'tempSpan' });\n if (range.startContainer.nodeName === 'PRE') {\n preElem.childNodes[range.endOffset].parentElement.insertBefore(tempSpan, preElem.childNodes[range.endOffset]);\n }\n else {\n range.startContainer.parentElement.insertBefore(tempSpan, range.startContainer);\n }\n };\n Formats.prototype.applyFormats = function (e) {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var isSelectAll = false;\n if (this.parent.editableElement === range.endContainer &&\n !isNOU(this.parent.editableElement.children[range.endOffset - 1]) &&\n this.parent.editableElement.children[range.endOffset - 1].tagName === 'TABLE' && !range.collapsed) {\n isSelectAll = true;\n }\n var save = this.parent.nodeSelection.save(range, this.parent.currentDocument);\n this.parent.domNode.setMarker(save);\n var formatsNodes = this.parent.domNode.blockNodes(true);\n if (e.enterAction === 'BR') {\n this.setSelectionBRConfig();\n var allSelectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument);\n var selectedNodes = this.parent.nodeSelection.getSelectionNodes(allSelectedNode);\n var currentFormatNodes = [];\n if (selectedNodes.length === 0) {\n selectedNodes.push(formatsNodes[0]);\n }\n for (var i = 0; i < selectedNodes.length; i++) {\n var currentNode = selectedNodes[i];\n var previousCurrentNode = void 0;\n while (!this.parent.domNode.isBlockNode(currentNode) && currentNode !== this.parent.editableElement) {\n previousCurrentNode = currentNode;\n currentNode = currentNode.parentElement;\n }\n if (this.parent.domNode.isBlockNode(currentNode) && currentNode === this.parent.editableElement) {\n currentFormatNodes.push(previousCurrentNode);\n }\n }\n for (var i = 0; i < currentFormatNodes.length; i++) {\n if (!this.parent.domNode.isBlockNode(currentFormatNodes[i])) {\n var currentNode = currentFormatNodes[i];\n var previousNode = currentNode;\n while (currentNode === this.parent.editableElement) {\n previousNode = currentNode;\n currentNode = currentNode.parentElement;\n }\n var tempElem = void 0;\n if (this.parent.domNode.isBlockNode(previousNode.parentElement) &&\n previousNode.parentElement === this.parent.editableElement) {\n tempElem = createElement('div');\n previousNode.parentElement.insertBefore(tempElem, previousNode);\n tempElem.appendChild(previousNode);\n }\n else {\n tempElem = previousNode;\n }\n var preNode = tempElem.previousSibling;\n while (!isNOU(preNode) && preNode.nodeName !== 'BR' &&\n !this.parent.domNode.isBlockNode(preNode)) {\n tempElem.firstChild.parentElement.insertBefore(preNode, tempElem.firstChild);\n preNode = tempElem.previousSibling;\n }\n if (!isNOU(preNode) && preNode.nodeName === 'BR') {\n detach(preNode);\n }\n var postNode = tempElem.nextSibling;\n while (!isNOU(postNode) && postNode.nodeName !== 'BR' &&\n !this.parent.domNode.isBlockNode(postNode)) {\n tempElem.appendChild(postNode);\n postNode = tempElem.nextSibling;\n }\n if (!isNOU(postNode) && postNode.nodeName === 'BR') {\n detach(postNode);\n }\n }\n }\n this.setSelectionBRConfig();\n formatsNodes = this.parent.domNode.blockNodes();\n }\n for (var i = 0; i < formatsNodes.length; i++) {\n var parentNode = void 0;\n var replaceHTML = void 0;\n if (e.subCommand.toLowerCase() === 'blockquote') {\n parentNode = this.getParentNode(formatsNodes[i]);\n replaceHTML = this.parent.domNode.isList(parentNode) ||\n parentNode.tagName === 'TABLE' ? parentNode.outerHTML : parentNode.innerHTML;\n }\n else {\n parentNode = formatsNodes[i];\n replaceHTML = parentNode.innerHTML;\n }\n if ((e.subCommand.toLowerCase() === parentNode.tagName.toLowerCase() &&\n (e.subCommand.toLowerCase() !== 'pre' && e.subCommand.toLowerCase() !== 'blockquote' ||\n (!isNOU(e.exeValue) && e.exeValue.name === 'dropDownSelect'))) ||\n isNOU(parentNode.parentNode) ||\n (parentNode.tagName === 'TABLE' && e.subCommand.toLowerCase() === 'pre')) {\n continue;\n }\n this.cleanFormats(parentNode, e.subCommand);\n var replaceNode = (e.subCommand.toLowerCase() === 'pre' && parentNode.tagName.toLowerCase() === 'pre') ?\n 'p' : e.subCommand;\n var isToggleBlockquoteList = e.subCommand.toLowerCase() === parentNode.tagName.toLowerCase() &&\n e.subCommand.toLowerCase() === 'blockquote' && this.parent.domNode.isList(parentNode.firstElementChild);\n var isToggleBlockquote = e.subCommand.toLowerCase() === parentNode.tagName.toLowerCase()\n && e.subCommand.toLowerCase() === 'blockquote';\n var replaceTag = void 0;\n if (isToggleBlockquoteList) {\n replaceTag = replaceHTML.replace(/>\\s+<');\n }\n else if (isToggleBlockquote) {\n var tagWrap = (e.enterAction == 'BR' || e.enterAction == 'P') ? 'P' : e.enterAction;\n replaceTag = this.parent.domNode.createTagString(tagWrap, parentNode, replaceHTML.replace(/>\\s+<'));\n }\n else {\n replaceTag = this.parent.domNode.createTagString(replaceNode, parentNode, replaceHTML.replace(/>\\s+<'));\n }\n if (parentNode.tagName === 'LI') {\n parentNode.innerHTML = '';\n parentNode.insertAdjacentHTML('beforeend', replaceTag);\n }\n else {\n this.parent.domNode.replaceWith(parentNode, replaceTag);\n }\n }\n this.preFormatMerge();\n var startNode = this.parent.editableElement.querySelector('.' + markerClassName.startSelection);\n var endNode = this.parent.editableElement.querySelector('.' + markerClassName.endSelection);\n if (!isNOU(startNode) && !isNOU(endNode)) {\n startNode = startNode.lastChild;\n endNode = endNode.lastChild;\n }\n save = this.parent.domNode.saveMarker(save, null);\n if (isIDevice()) {\n setEditFrameFocus(this.parent.editableElement, e.selector);\n }\n if (isSelectAll) {\n this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, startNode, endNode, 0, endNode.textContent.length);\n }\n else {\n save.restore();\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.domNode.blockNodes()\n });\n }\n };\n Formats.prototype.setSelectionBRConfig = function () {\n var startElem = this.parent.editableElement.querySelector('.' + markerClassName.startSelection);\n var endElem = this.parent.editableElement.querySelector('.' + markerClassName.endSelection);\n if (isNOU(endElem)) {\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, startElem, 0);\n }\n else {\n this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, startElem, endElem, 0, 0);\n }\n };\n Formats.prototype.preFormatMerge = function () {\n var preNodes = this.parent.editableElement.querySelectorAll('PRE');\n if (!isNOU(preNodes)) {\n for (var i = 0; i < preNodes.length; i++) {\n var previousSib = preNodes[i].previousElementSibling;\n if (!isNOU(previousSib) && previousSib.tagName === 'PRE') {\n previousSib.insertAdjacentHTML('beforeend', '
    ' + preNodes[i].innerHTML);\n detach(preNodes[i]);\n }\n }\n }\n };\n Formats.prototype.cleanFormats = function (element, tagName) {\n var ignoreAttr = ['display', 'font-size', 'margin-top', 'margin-bottom', 'margin-left', 'margin-right', 'font-weight'];\n tagName = tagName.toLowerCase();\n for (var i = 0; i < ignoreAttr.length && (tagName !== 'p' && tagName !== 'blockquote' && tagName !== 'pre'); i++) {\n element.style.removeProperty(ignoreAttr[i]);\n }\n };\n return Formats;\n}());\nexport { Formats };\n","import { NodeSelection } from './../../selection/index';\nimport { NodeCutter } from './nodecutter';\nimport * as CONSTANT from './../base/constant';\nimport { detach, Browser, isNullOrUndefined as isNOU, createElement, closest } from '@syncfusion/ej2-base';\nimport { InsertMethods } from './insert-methods';\nimport { updateTextNode, nestedListCleanUp } from './../../common/util';\n/**\n * Insert a HTML Node or Text\n *\n * @hidden\n\n */\nvar InsertHtml = /** @class */ (function () {\n function InsertHtml() {\n }\n InsertHtml.Insert = function (docElement, insertNode, editNode, isExternal, enterAction) {\n var node;\n if (typeof insertNode === 'string') {\n var divNode = document.createElement('div');\n divNode.innerHTML = insertNode;\n node = isExternal ? divNode : divNode.firstChild;\n }\n else {\n if (isExternal && !(!isNOU(insertNode) && !isNOU(insertNode.classList) &&\n insertNode.classList.contains('pasteContent'))) {\n var divNode = document.createElement('div');\n divNode.appendChild(insertNode);\n node = divNode;\n }\n else {\n node = insertNode;\n }\n }\n var nodeSelection = new NodeSelection();\n var nodeCutter = new NodeCutter();\n var range = nodeSelection.getRange(docElement);\n if (range.startContainer === editNode && range.startContainer === range.endContainer && range.startOffset === 0 &&\n range.startOffset === range.endOffset && editNode.textContent.length === 0 &&\n (editNode.children[0].tagName === 'P' || editNode.children[0].tagName === 'DIV' || (editNode.children[0].tagName === 'BR'))) {\n nodeSelection.setSelectionText(docElement, range.startContainer.children[0], range.startContainer.children[0], 0, 0);\n range = nodeSelection.getRange(docElement);\n }\n if (range.startContainer === editNode && range.startContainer === range.endContainer && range.startOffset === 0 &&\n range.startOffset === range.endOffset && editNode.textContent.trim().length > 0) {\n var focusNode = this.findFirstTextNode(range.startContainer);\n if (!isNOU(focusNode)) {\n nodeSelection.setSelectionText(docElement, focusNode, focusNode, 0, 0);\n range = nodeSelection.getRange(docElement);\n }\n }\n if (range.startContainer.nodeName === 'BR' && range.startOffset === 0 && range.startOffset === range.endOffset &&\n range.startContainer === range.endContainer) {\n var currentIndex = Array.prototype.slice.call(range.startContainer.parentElement.childNodes).indexOf(range.startContainer);\n nodeSelection.setSelectionText(docElement, range.startContainer.parentElement, range.startContainer.parentElement, currentIndex, currentIndex);\n range = nodeSelection.getRange(docElement);\n }\n var isCursor = range.startOffset === range.endOffset && range.startOffset === 0 &&\n range.startContainer === range.endContainer;\n var isCollapsed = range.collapsed;\n var nodes = this.getNodeCollection(range, nodeSelection, node);\n var closestParentNode = (node.nodeName.toLowerCase() === 'table') ? (!isNOU(nodes[0]) ? this.closestEle(nodes[0].parentNode, editNode) : range.startContainer) : nodes[0];\n if (closestParentNode && closestParentNode.nodeName === 'LI' && node.nodeName.toLowerCase() === 'table') {\n this.insertTableInList(range, node, closestParentNode, nodes[0], nodeCutter);\n return;\n }\n if (isCursor && range.startContainer.textContent === '' && range.startContainer.nodeName !== 'BR' && enterAction !== 'BR' && node.nodeName !== '#text' && !isNOU(node.children[0]) && !isNOU(node.children[0].tagName) && node.children[0].tagName === 'IMG' && node.children.length === 1) {\n range.startContainer.innerHTML = '';\n }\n if (isExternal || (!isNOU(node) && !isNOU(node.classList) &&\n node.classList.contains('pasteContent'))) {\n this.pasteInsertHTML(nodes, node, range, nodeSelection, nodeCutter, docElement, isCollapsed, closestParentNode, editNode, enterAction);\n return;\n }\n if (editNode !== range.startContainer && ((!isCollapsed && !(closestParentNode.nodeType === Node.ELEMENT_NODE &&\n CONSTANT.TABLE_BLOCK_TAGS.indexOf(closestParentNode.tagName.toLocaleLowerCase()) !== -1))\n || (node.nodeName.toLowerCase() === 'table' && closestParentNode &&\n CONSTANT.TABLE_BLOCK_TAGS.indexOf(closestParentNode.tagName.toLocaleLowerCase()) === -1))) {\n var preNode = nodeCutter.GetSpliceNode(range, closestParentNode);\n var sibNode = preNode.previousSibling;\n var parentNode = preNode.parentNode;\n if (nodes.length === 1 || (node.nodeName.toLowerCase() === 'table' && preNode.childElementCount === 0)) {\n nodeSelection.setSelectionContents(docElement, preNode);\n range = nodeSelection.getRange(docElement);\n }\n else {\n var lasNode = nodeCutter.GetSpliceNode(range, nodes[nodes.length - 1].parentElement);\n lasNode = isNOU(lasNode) ? preNode : lasNode;\n nodeSelection.setSelectionText(docElement, preNode, lasNode, 0, (lasNode.nodeType === 3) ?\n lasNode.textContent.length : lasNode.childNodes.length);\n range = nodeSelection.getRange(docElement);\n }\n if (range.startContainer.parentElement.closest('ol,ul') !== null && range.endContainer.parentElement.closest('ol,ul') !== null) {\n nestedListCleanUp(range);\n }\n else {\n range.extractContents();\n }\n if (insertNode.tagName === 'TABLE') {\n this.removeEmptyElements(editNode);\n }\n for (var index = 0; index < nodes.length; index++) {\n if (nodes[index].nodeType !== 3 && nodes[index].parentNode != null) {\n if (nodes[index].nodeName === 'IMG') {\n continue;\n }\n nodes[index].parentNode.removeChild(nodes[index]);\n }\n }\n if (!isNOU(sibNode) && !isNOU(sibNode.parentNode)) {\n InsertMethods.AppendBefore(node, sibNode, true);\n }\n else {\n var previousNode = null;\n while (parentNode !== editNode && parentNode.firstChild &&\n (parentNode.textContent.trim() === '')) {\n var parentNode1 = parentNode.parentNode;\n previousNode = parentNode;\n parentNode = parentNode1;\n }\n if (previousNode !== null) {\n parentNode = previousNode;\n }\n if (parentNode.firstChild && (parentNode !== editNode ||\n (node.nodeName === 'TABLE' && isCursor && parentNode === range.startContainer &&\n parentNode === range.endContainer))) {\n if (parentNode.textContent.trim() === '' && parentNode !== editNode) {\n InsertMethods.AppendBefore(node, parentNode, false);\n detach(parentNode);\n }\n else {\n InsertMethods.AppendBefore(node, parentNode.firstChild, false);\n }\n }\n else if (isNOU(preNode.previousSibling) && insertNode.tagName === 'TABLE') {\n parentNode.prepend(node);\n }\n else {\n parentNode.appendChild(node);\n }\n }\n if (node.nodeName === 'IMG') {\n this.imageFocus(node, nodeSelection, docElement);\n }\n else if (node.nodeType !== 3) {\n nodeSelection.setSelectionText(docElement, node, node, 0, node.childNodes.length);\n }\n else {\n nodeSelection.setSelectionText(docElement, node, node, 0, node.textContent.length);\n }\n }\n else {\n range.deleteContents();\n if (isCursor && range.startContainer.textContent === '' && range.startContainer.nodeName !== 'BR') {\n range.startContainer.innerHTML = '';\n }\n if (Browser.isIE) {\n var frag = docElement.createDocumentFragment();\n frag.appendChild(node);\n range.insertNode(frag);\n }\n else if (range.startContainer.nodeType === 1 && range.startContainer.nodeName.toLowerCase() === 'hr'\n && range.endContainer.nodeName.toLowerCase() === 'hr') {\n var paraElem = range.startContainer.nextElementSibling;\n if (paraElem) {\n if (paraElem.querySelector('br')) {\n detach(paraElem.querySelector('br'));\n }\n paraElem.appendChild(node);\n }\n }\n else {\n if (range.startContainer.nodeName === 'BR') {\n range.startContainer.parentElement.insertBefore(node, range.startContainer);\n }\n else {\n range.insertNode(node);\n }\n }\n if (node.nodeType !== 3 && node.childNodes.length > 0) {\n nodeSelection.setSelectionText(docElement, node, node, 1, 1);\n }\n else if (node.nodeName === 'IMG') {\n this.imageFocus(node, nodeSelection, docElement);\n }\n else if (node.nodeType !== 3) {\n nodeSelection.setSelectionContents(docElement, node);\n }\n else {\n nodeSelection.setSelectionText(docElement, node, node, node.textContent.length, node.textContent.length);\n }\n }\n };\n InsertHtml.findFirstTextNode = function (node) {\n if (node.nodeType === Node.TEXT_NODE) {\n return node;\n }\n for (var i = 0; i < node.childNodes.length; i++) {\n var textNode = this.findFirstTextNode(node.childNodes[i]);\n if (!isNOU(textNode)) {\n return textNode;\n }\n }\n return null;\n };\n InsertHtml.pasteInsertHTML = function (nodes, node, range, nodeSelection, nodeCutter, docElement, isCollapsed, closestParentNode, editNode, enterAction) {\n var isCursor = range.startOffset === range.endOffset &&\n range.startContainer === range.endContainer;\n if (isCursor && range.startContainer === editNode && editNode.textContent === '') {\n var currentBlockNode = this.getImmediateBlockNode(nodes[nodes.length - 1], editNode);\n nodeSelection.setSelectionText(docElement, currentBlockNode, currentBlockNode, 0, 0);\n range = nodeSelection.getRange(docElement);\n }\n var lasNode;\n var sibNode;\n var isSingleNode;\n var preNode;\n if (editNode !== range.startContainer && ((!isCollapsed && !(closestParentNode.nodeType === Node.ELEMENT_NODE &&\n CONSTANT.TABLE_BLOCK_TAGS.indexOf(closestParentNode.tagName.toLocaleLowerCase()) !== -1))\n || (node.nodeName.toLowerCase() === 'table' && closestParentNode &&\n CONSTANT.TABLE_BLOCK_TAGS.indexOf(closestParentNode.tagName.toLocaleLowerCase()) === -1))) {\n preNode = nodeCutter.GetSpliceNode(range, closestParentNode);\n if (!isNOU(preNode)) {\n sibNode = isNOU(preNode.previousSibling) ? preNode.parentNode.previousSibling : preNode.previousSibling;\n if (nodes.length === 1) {\n nodeSelection.setSelectionContents(docElement, preNode);\n range = nodeSelection.getRange(docElement);\n isSingleNode = true;\n }\n else {\n lasNode = nodeCutter.GetSpliceNode(range, nodes[nodes.length - 1].parentElement);\n lasNode = isNOU(lasNode) ? preNode : lasNode;\n nodeSelection.setSelectionText(docElement, preNode, lasNode, 0, (lasNode.nodeType === 3) ?\n lasNode.textContent.length : lasNode.childNodes.length);\n range = nodeSelection.getRange(docElement);\n isSingleNode = false;\n }\n }\n }\n var containsBlockNode = false;\n this.removingComments(node);\n var allChildNodes = node.childNodes;\n for (var i = 0; i < allChildNodes.length; i++) {\n if (CONSTANT.BLOCK_TAGS.indexOf(allChildNodes[i].nodeName.toLocaleLowerCase()) >= 0) {\n containsBlockNode = true;\n break;\n }\n }\n var lastSelectionNode;\n var fragment = document.createDocumentFragment();\n if (!containsBlockNode) {\n if (!isCursor) {\n while (node.firstChild) {\n lastSelectionNode = node.firstChild;\n fragment.appendChild(node.firstChild);\n }\n if (isSingleNode) {\n preNode.parentNode.replaceChild(fragment, preNode);\n }\n else {\n var startContainerParent = range.startContainer.parentNode;\n // Get the index of the start container among its siblings\n var startIndex = Array.prototype.indexOf.call(startContainerParent.childNodes, range.startContainer);\n range.deleteContents();\n range.setStart(startContainerParent, startIndex);\n range.setEnd(startContainerParent, startIndex);\n if (!isNOU(lasNode) && lasNode !== editNode) {\n detach(lasNode);\n }\n // eslint-disable-next-line\n !isNOU(sibNode) ? (sibNode.parentNode === editNode ? sibNode.appendChild(fragment) : sibNode.parentNode.appendChild(fragment)) : range.insertNode(fragment);\n }\n }\n else {\n var tempSpan = createElement('span', { className: 'tempSpan' });\n var nearestAnchor = closest(range.startContainer.parentElement, 'a');\n if (range.startContainer.nodeType === 3 && nearestAnchor && closest(nearestAnchor, 'span')) {\n var immediateBlockNode = this.getImmediateBlockNode(range.startContainer, editNode);\n if (immediateBlockNode.querySelectorAll('br').length > 0) {\n detach(immediateBlockNode.querySelector('br'));\n }\n var rangeElement = closest(nearestAnchor, 'span');\n rangeElement.appendChild(tempSpan);\n }\n else {\n range.insertNode(tempSpan);\n }\n while (node.firstChild) {\n lastSelectionNode = node.firstChild;\n fragment.appendChild(node.firstChild);\n }\n tempSpan.parentNode.replaceChild(fragment, tempSpan);\n }\n }\n else {\n var parentElem = range.startContainer;\n while (!isNOU(parentElem) && parentElem.nodeName !== 'PRE' && parentElem !== editNode) {\n parentElem = parentElem.parentElement;\n }\n if (!isNOU(node) && !isNOU(parentElem) && parentElem.nodeName === 'PRE') {\n range.insertNode(node);\n lastSelectionNode = node.lastChild;\n }\n else {\n this.insertTempNode(range, node, nodes, nodeCutter, editNode);\n var isFirstTextNode = true;\n var isPreviousInlineElem = void 0;\n var paraElm = void 0;\n var previousParent = void 0;\n if (!this.contentsDeleted) {\n if (!isCollapsed && range.startContainer.parentElement.textContent.length === 0 && range.startContainer.nodeName === 'BR' && range.startContainer.parentElement.nodeName === 'P') {\n editNode.removeChild(range.startContainer.parentElement);\n }\n range.deleteContents();\n }\n while (node.firstChild) {\n if (node.firstChild.nodeName === '#text' && node.firstChild.textContent.trim() === '') {\n detach(node.firstChild);\n continue;\n }\n if (node.firstChild.nodeName === '#text' && isFirstTextNode ||\n (this.inlineNode.indexOf(node.firstChild.nodeName.toLocaleLowerCase()) >= 0 && isFirstTextNode)) {\n lastSelectionNode = node.firstChild;\n if (isNOU(node.previousElementSibling)) {\n var firstParaElm = enterAction === 'DIV' ? createElement('div') : createElement('p');\n node.parentElement.insertBefore(firstParaElm, node);\n }\n if (node.previousElementSibling.nodeName === 'BR') {\n node.parentElement.insertBefore(node.firstChild, node);\n }\n else {\n node.previousElementSibling.appendChild(node.firstChild);\n }\n }\n else {\n lastSelectionNode = node.firstChild;\n if (node.firstChild.nodeName === '#text' ||\n (this.inlineNode.indexOf(node.firstChild.nodeName.toLocaleLowerCase()) >= 0)) {\n if (!isPreviousInlineElem) {\n paraElm = enterAction === 'DIV' ? createElement('div') : createElement('p');\n paraElm.appendChild(node.firstChild);\n fragment.appendChild(paraElm);\n }\n else {\n previousParent.appendChild(node.firstChild);\n fragment.appendChild(previousParent);\n }\n previousParent = paraElm;\n isPreviousInlineElem = true;\n }\n else {\n fragment.appendChild(node.firstChild);\n isPreviousInlineElem = false;\n }\n isFirstTextNode = false;\n }\n }\n node.parentNode.replaceChild(fragment, node);\n }\n }\n if (lastSelectionNode.nodeName === 'TABLE') {\n var pTag = createElement('p');\n pTag.appendChild(createElement('br'));\n lastSelectionNode.parentElement.insertBefore(pTag, lastSelectionNode.nextSibling);\n lastSelectionNode = pTag;\n }\n if (lastSelectionNode.nodeName === '#text') {\n this.placeCursorEnd(lastSelectionNode, node, nodeSelection, docElement, editNode);\n }\n else {\n this.cursorPos(lastSelectionNode, node, nodeSelection, docElement, editNode, enterAction);\n }\n };\n InsertHtml.placeCursorEnd = function (lastSelectionNode, node, nodeSelection, docElement, editNode) {\n lastSelectionNode = lastSelectionNode.nodeName === 'BR' ? (isNOU(lastSelectionNode.previousSibling) ? lastSelectionNode.parentNode\n : lastSelectionNode.previousSibling) : lastSelectionNode;\n while (!isNOU(lastSelectionNode) && lastSelectionNode.nodeName !== '#text' && lastSelectionNode.nodeName !== 'IMG' &&\n lastSelectionNode.nodeName !== 'BR' && lastSelectionNode.nodeName !== 'HR') {\n if (!isNOU(lastSelectionNode.lastChild) && (lastSelectionNode.lastChild.nodeName === 'P' &&\n lastSelectionNode.lastChild.innerHTML === '')) {\n var lineBreak = createElement('br');\n lastSelectionNode.lastChild.appendChild(lineBreak);\n }\n lastSelectionNode = lastSelectionNode.lastChild;\n }\n lastSelectionNode = isNOU(lastSelectionNode) ? node : lastSelectionNode;\n if (lastSelectionNode.nodeName === 'IMG') {\n this.imageFocus(lastSelectionNode, nodeSelection, docElement);\n }\n else {\n nodeSelection.setSelectionText(docElement, lastSelectionNode, lastSelectionNode, lastSelectionNode.textContent.length, lastSelectionNode.textContent.length);\n }\n this.removeEmptyElements(editNode);\n };\n InsertHtml.getNodeCollection = function (range, nodeSelection, node) {\n var nodes = [];\n if (range.startOffset === range.endOffset && range.startContainer === range.endContainer &&\n range.startContainer.nodeName !== 'BR' && range.startContainer.childNodes.length > 0 &&\n (range.startContainer.nodeName === 'TD' || (range.startContainer.nodeType !== 3 &&\n node.classList && node.classList.contains('pasteContent')))) {\n nodes.push(range.startContainer.childNodes[range.endOffset]);\n }\n else {\n nodes = nodeSelection.getInsertNodeCollection(range);\n }\n return nodes;\n };\n InsertHtml.insertTempNode = function (range, node, nodes, nodeCutter, editNode) {\n if (range.startContainer === editNode && !isNOU(range.startContainer.childNodes[range.endOffset - 1]) &&\n range.startContainer.childNodes[range.endOffset - 1].nodeName === 'TABLE') {\n if (isNOU(range.startContainer.childNodes[range.endOffset - 1].nextSibling)) {\n range.startContainer.appendChild(node);\n }\n else {\n range.startContainer.insertBefore(node, range.startContainer.childNodes[range.endOffset - 1].nextSibling);\n }\n }\n else if (range.startContainer === editNode && !isNOU(range.startContainer.childNodes[range.endOffset]) &&\n range.startContainer.childNodes[range.endOffset].nodeName === 'TABLE') {\n range.startContainer.insertBefore(node, range.startContainer.childNodes[range.endOffset]);\n }\n else if (range.startContainer === range.endContainer && range.startContainer.nodeType !== 3\n && node.firstChild.nodeName === 'HR') {\n if (range.startContainer.classList.contains('e-content') || range.startContainer.nodeName === 'BODY') {\n range.startContainer.appendChild(node);\n }\n else {\n range.startContainer.parentNode.insertBefore(node, range.startContainer);\n }\n }\n else {\n var blockNode = this.getImmediateBlockNode(nodes[nodes.length - 1], editNode);\n if ((isNOU(blockNode) || isNOU(blockNode.parentElement)) && range.endContainer.nodeType !== 3) {\n blockNode = range.endContainer;\n range.setEnd(blockNode, range.endContainer.textContent.length);\n }\n if (blockNode.nodeName === 'BODY' && range.startContainer === range.endContainer && range.startContainer.nodeType === 1) {\n blockNode = range.startContainer;\n }\n if (blockNode.closest('LI') && blockNode.nodeName !== 'TD' && blockNode.nodeName !== 'TH' && blockNode.nodeName !== 'TR' && node && node.firstElementChild &&\n ((node).firstElementChild.tagName === 'OL' || node.firstElementChild.tagName === 'UL')) {\n var liNode = void 0;\n while (node.firstElementChild.lastElementChild && node.firstElementChild.lastElementChild.tagName === 'LI') {\n liNode = node.firstElementChild.lastElementChild;\n liNode.style.removeProperty('margin-left');\n liNode.style.removeProperty('margin-top');\n liNode.style.removeProperty('margin-bottom');\n node.firstElementChild.insertAdjacentElement('afterend', liNode);\n }\n }\n if (blockNode.nodeName === 'TD' || blockNode.nodeName === 'TH' || blockNode.nodeName === 'TR') {\n var tempSpan = createElement('span', { className: 'tempSpan' });\n range.insertNode(tempSpan);\n tempSpan.parentNode.replaceChild(node, tempSpan);\n }\n else {\n var nodeSelection = new NodeSelection();\n var currentNode = this.getNodeCollection(range, nodeSelection, node)[this.getNodeCollection(range, nodeSelection, node).length - 1];\n var splitedElm = void 0;\n if ((currentNode.nodeName === 'BR' || currentNode.nodeName === 'HR' ||\n (currentNode.nodeName === '#text' && !isNOU(currentNode.parentElement) && currentNode.parentElement.nodeName === 'LI')) &&\n (!isNOU(currentNode.parentElement) && currentNode.parentElement.textContent.trim().length === 0)) {\n splitedElm = currentNode;\n if (currentNode.parentElement.nodeName === 'LI' && !isNOU(currentNode.nextSibling) &&\n currentNode.nextSibling.nodeName === 'BR') {\n detach(currentNode.nextSibling);\n }\n }\n else if ((currentNode.nodeName === '#text' || currentNode.nodeName === 'BR') && !isNOU(currentNode.parentElement) &&\n (currentNode.parentElement.nodeName === 'LI' || currentNode.parentElement.closest('LI') || (blockNode === editNode && currentNode.parentElement === blockNode)) &&\n currentNode.parentElement.textContent.trim().length > 0) {\n splitedElm = currentNode;\n if (currentNode.parentElement.nodeName === 'LI' && !isNOU(currentNode.nextSibling) &&\n currentNode.nextSibling.nodeName === 'BR') {\n detach(currentNode.nextSibling);\n }\n if (!range.collapsed) {\n range.deleteContents();\n var value = range.startContainer;\n if (!isNOU(value) && value.nodeName === 'LI' && !isNOU(value.parentElement) && (value.parentElement.nodeName === 'OL' || value.parentElement.nodeName === 'UL') && value.textContent.trim() === '') {\n value.parentElement.querySelectorAll('li').forEach(function (item) {\n item.remove();\n });\n }\n }\n range.insertNode(node);\n this.contentsDeleted = true;\n return;\n }\n else {\n splitedElm = nodeCutter.GetSpliceNode(range, blockNode);\n }\n splitedElm.parentNode.replaceChild(node, splitedElm);\n }\n }\n };\n InsertHtml.cursorPos = function (lastSelectionNode, node, nodeSelection, docElement, editNode, enterAction) {\n lastSelectionNode.classList.add('lastNode');\n editNode.innerHTML = updateTextNode(editNode.innerHTML, enterAction);\n lastSelectionNode = editNode.querySelector('.lastNode');\n if (!isNOU(lastSelectionNode)) {\n this.placeCursorEnd(lastSelectionNode, node, nodeSelection, docElement, editNode);\n lastSelectionNode.classList.remove('lastNode');\n if (lastSelectionNode.classList.length === 0) {\n lastSelectionNode.removeAttribute('class');\n }\n }\n };\n InsertHtml.imageFocus = function (node, nodeSelection, docElement) {\n var focusNode = document.createTextNode(' ');\n if (node.parentNode && node.parentNode.nodeName === 'A') {\n var anchorTag = node.parentNode;\n var parentNode = anchorTag.parentNode;\n parentNode.insertBefore(focusNode, anchorTag.nextSibling);\n parentNode.insertBefore(node, focusNode);\n }\n else {\n node.parentNode.insertBefore(focusNode, node.nextSibling);\n }\n nodeSelection.setSelectionText(docElement, node.nextSibling, node.nextSibling, 0, 0);\n };\n // eslint-disable-next-line\n InsertHtml.getImmediateBlockNode = function (node, editNode) {\n do {\n node = node.parentNode;\n } while (node && CONSTANT.BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) < 0);\n return node;\n };\n InsertHtml.removingComments = function (elm) {\n var innerElement = elm.innerHTML;\n innerElement = innerElement.replace(//g, '');\n elm.innerHTML = innerElement;\n };\n InsertHtml.findDetachEmptyElem = function (element) {\n var removableElement;\n if (!isNOU(element.parentElement)) {\n var hasNbsp = element.parentElement.textContent.length > 0 && element.parentElement.textContent.match(/\\u00a0/g)\n && element.parentElement.textContent.match(/\\u00a0/g).length > 0;\n if (!hasNbsp && element.parentElement.textContent.trim() === '' && element.parentElement.contentEditable !== 'true' &&\n isNOU(element.parentElement.querySelector('img'))) {\n removableElement = this.findDetachEmptyElem(element.parentElement);\n }\n else {\n removableElement = element;\n }\n }\n else {\n removableElement = null;\n }\n return removableElement;\n };\n InsertHtml.removeEmptyElements = function (element) {\n var emptyElements = element.querySelectorAll(':empty');\n var nonSvgEmptyElements = Array.from(emptyElements).filter(function (element) {\n // Check if the element is an SVG element or an ancestor of an SVG element\n return !element.closest('svg') && !element.closest('canvas');\n });\n for (var i = 0; i < nonSvgEmptyElements.length; i++) {\n var lineWithDiv = true;\n if (nonSvgEmptyElements[i].tagName === 'DIV') {\n lineWithDiv = nonSvgEmptyElements[i].style.borderBottom === 'none' ||\n nonSvgEmptyElements[i].style.borderBottom === '' ? true : false;\n }\n if (CONSTANT.SELF_CLOSING_TAGS.indexOf(nonSvgEmptyElements[i].tagName.toLowerCase()) < 0 && lineWithDiv) {\n var detachableElement = this.findDetachEmptyElem(nonSvgEmptyElements[i]);\n if (!isNOU(detachableElement)) {\n detach(detachableElement);\n }\n }\n }\n };\n InsertHtml.closestEle = function (element, editNode) {\n var el = element;\n if (closest(el, 'li')) {\n return closest(el, 'li');\n }\n while (el && el.nodeType === 1) {\n if (el.parentNode === editNode ||\n (!isNOU(el.parentNode.tagName) &&\n CONSTANT.IGNORE_BLOCK_TAGS.indexOf(el.parentNode.tagName.toLocaleLowerCase()) !== -1)) {\n return el;\n }\n el = el.parentNode;\n }\n return null;\n };\n InsertHtml.insertTableInList = function (range, insertNode, parentNode, currentNode, nodeCutter) {\n if (range.collapsed) {\n var isStart = range.startOffset === 0;\n var isEnd = range.startContainer.textContent.trimEnd().length === range.startOffset;\n if (isStart || isEnd) {\n if (isStart) {\n InsertMethods.AppendBefore(insertNode, currentNode, false);\n }\n else {\n InsertMethods.AppendBefore(insertNode, currentNode, true);\n }\n }\n else {\n var preNode = nodeCutter.SplitNode(range, parentNode, true);\n var sibNode = preNode.previousSibling;\n sibNode.appendChild(insertNode);\n }\n }\n else {\n range.deleteContents();\n parentNode.appendChild(insertNode);\n }\n insertNode.classList.add('ignore-table');\n };\n /**\n * Insert method\n *\n * @hidden\n\n */\n InsertHtml.inlineNode = ['a', 'abbr', 'acronym', 'audio', 'b', 'bdi', 'bdo', 'big', 'br', 'button',\n 'canvas', 'cite', 'code', 'data', 'datalist', 'del', 'dfn', 'em', 'embed', 'font', 'i', 'iframe', 'img', 'input',\n 'ins', 'kbd', 'label', 'map', 'mark', 'meter', 'noscript', 'object', 'output', 'picture', 'progress',\n 'q', 'ruby', 's', 'samp', 'script', 'select', 'slot', 'small', 'span', 'strong', 'sub', 'sup', 'svg',\n 'template', 'textarea', 'time', 'u', 'tt', 'var', 'video', 'wbr'];\n InsertHtml.contentsDeleted = false;\n return InsertHtml;\n}());\nexport { InsertHtml };\n","import * as CONSTANT from './../base/constant';\nimport { NodeSelection } from '../../selection/selection';\nimport { NodeCutter } from './nodecutter';\nimport { InsertHtml } from './inserthtml';\nimport { createElement, isNullOrUndefined as isNOU, closest } from '@syncfusion/ej2-base';\n/**\n * Link internal component\n *\n * @hidden\n\n */\nvar LinkCommand = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the editor manager\n * @hidden\n\n */\n function LinkCommand(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n LinkCommand.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.LINK, this.linkCommand, this);\n };\n LinkCommand.prototype.linkCommand = function (e) {\n switch (e.value.toString().toLocaleLowerCase()) {\n case 'createlink':\n case 'editlink':\n this.createLink(e);\n break;\n case 'openlink':\n this.openLink(e);\n break;\n case 'removelink':\n this.removeLink(e);\n break;\n }\n };\n LinkCommand.prototype.createLink = function (e) {\n var closestAnchor = (!isNOU(e.item.selectParent) && e.item.selectParent.length > 0) &&\n closest(e.item.selectParent[0], 'a');\n closestAnchor = !isNOU(closestAnchor) ? closestAnchor :\n (!isNOU(e.item.selectParent) && e.item.selectParent.length > 0) ? (e.item.selectParent[0]) : null;\n if (!isNOU(closestAnchor) && closestAnchor.tagName === 'A') {\n var anchorEle = closestAnchor;\n var linkText = '';\n if (!isNOU(e.item.url)) {\n anchorEle.setAttribute('href', e.item.url);\n }\n if (!isNOU(e.item.title)) {\n anchorEle.setAttribute('title', e.item.title);\n }\n if (!isNOU(e.item.text) && e.item.text !== '') {\n linkText = anchorEle.innerText;\n anchorEle.firstChild.nodeName === '#text' ? anchorEle.innerText = e.item.text :\n anchorEle.firstChild.innerText = e.item.text;\n }\n if (!isNOU(e.item.target)) {\n anchorEle.setAttribute('target', e.item.target);\n anchorEle.setAttribute('aria-label', e.item.ariaLabel);\n }\n else {\n anchorEle.removeAttribute('target');\n anchorEle.removeAttribute('aria-label');\n }\n if (linkText === e.item.text) {\n e.item.selection.setSelectionText(this.parent.currentDocument, anchorEle, anchorEle, 1, 1);\n e.item.selection.restore();\n }\n else {\n var startIndex = e.item.action === 'Paste' ? anchorEle.childNodes[0].textContent.length : 0;\n var endIndex = anchorEle.firstChild.nodeName === '#text' ? anchorEle.childNodes[0].textContent.length : anchorEle.childNodes.length;\n e.item.selection.setSelectionText(this.parent.currentDocument, anchorEle.childNodes[0], anchorEle.childNodes[0], startIndex, endIndex);\n }\n }\n else {\n var domSelection = new NodeSelection();\n var range = domSelection.getRange(this.parent.currentDocument);\n if (range.endContainer.nodeName === '#text' && range.startContainer.textContent.length === (range.endOffset + 1) &&\n range.endContainer.textContent.charAt(range.endOffset) === ' ' && (!isNOU(range.endContainer.nextSibling) && range.endContainer.nextSibling.nodeName === 'A')) {\n domSelection.setSelectionText(this.parent.currentDocument, range.startContainer, range.endContainer, range.startOffset, range.endOffset + 1);\n range = domSelection.getRange(this.parent.currentDocument);\n }\n var text = isNOU(e.item.text) ? true : e.item.text.replace(/ /g, '').localeCompare(range.toString()\n .replace(/\\n/g, ' ').replace(/ /g, '')) < 0;\n if (e.event && e.event.type === 'keydown' && (e.event.keyCode === 32\n || e.event.keyCode === 13) || e.item.action === 'Paste' || range.collapsed || text) {\n var anchor = this.createAchorNode(e);\n anchor.innerText = e.item.text === '' ? e.item.url : e.item.text;\n var text_1 = anchor.innerText;\n // Replace spaces with non-breaking spaces\n var modifiedText = text_1.replace(/ +/g, function (match) {\n return '\\u00A0'.repeat(match.length);\n });\n anchor.innerText = modifiedText;\n e.item.selection.restore();\n InsertHtml.Insert(this.parent.currentDocument, anchor, this.parent.editableElement);\n if (e.event && e.event.type === 'keydown' && (e.event.keyCode === 32\n || e.event.keyCode === 13)) {\n var startContainer = e.item.selection.range.startContainer;\n startContainer.textContent = this.removeText(startContainer.textContent, e.item.text);\n }\n else {\n var startIndex = e.item.action === 'Paste' ? anchor.childNodes[0].textContent.length : 0;\n e.item.selection.setSelectionText(this.parent.currentDocument, anchor.childNodes[0], anchor.childNodes[0], startIndex, anchor.childNodes[0].textContent.length);\n }\n }\n else {\n this.createLinkNode(e);\n }\n }\n if (e.callBack) {\n e.callBack({\n requestType: 'Links',\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n LinkCommand.prototype.createLinkNode = function (e) {\n var domSelection = new NodeSelection();\n var nodeCutter = new NodeCutter();\n var range = domSelection.getRange(this.parent.currentDocument);\n var nodes = this.getSelectionNodes(domSelection.getNodeCollection(range));\n var save = domSelection.save(range, this.parent.currentDocument);\n var txtArray = [];\n var inlineNodes = [];\n var currentNode;\n var removeNodes = [];\n var anchorNodes = [];\n var finalinlineNodes = [];\n var cloneNode;\n for (var index = 0; index < nodes.length; index++) {\n nodes[index] = nodeCutter.GetSpliceNode(range, nodes[index]);\n txtArray[index] = nodes[index];\n }\n for (var i = 0; i < txtArray.length; i++) {\n var check = true;\n currentNode = txtArray[i];\n while (check === true) {\n if (currentNode.parentNode.nodeName === 'A') {\n var anchorEle = currentNode.parentNode;\n currentNode.parentNode.parentNode.insertBefore(anchorEle.firstChild, anchorEle);\n currentNode.parentNode.removeChild(anchorEle);\n }\n if (this.isBlockNode(currentNode.parentNode) || txtArray.length === 0 || i === 0 || i === txtArray.length - 1\n || range.startContainer.nodeType === 3) {\n inlineNodes[i] = currentNode;\n check = false;\n }\n else {\n currentNode = currentNode.parentNode;\n }\n }\n }\n for (var i = 0, j_1 = 0; i < inlineNodes.length; i++) {\n if (i === 0) {\n finalinlineNodes[j_1] = inlineNodes[i];\n }\n if (inlineNodes.length > 1 && i < inlineNodes.length - 1) {\n if ((inlineNodes[i].parentElement === inlineNodes[i + 1].parentElement) &&\n (inlineNodes[i] === inlineNodes[i + 1])) {\n continue;\n }\n else {\n finalinlineNodes[j_1 + 1] = inlineNodes[i + 1];\n j_1++;\n }\n }\n }\n var j = 0;\n anchorNodes[j] = this.createAchorNode(e);\n for (var i = 0; i < finalinlineNodes.length; i++) {\n if (i === 0) {\n cloneNode = finalinlineNodes[i].cloneNode(true);\n anchorNodes[i].appendChild(cloneNode);\n }\n if (i < finalinlineNodes.length - 1) {\n if (finalinlineNodes[i].parentNode === finalinlineNodes[i + 1].parentNode) {\n var cln = finalinlineNodes[i + 1].cloneNode(true);\n anchorNodes[j].appendChild(cln);\n }\n else {\n j = j + 1;\n anchorNodes[j] = this.createAchorNode(e);\n cloneNode = finalinlineNodes[i + 1].cloneNode(true);\n anchorNodes[j].appendChild(cloneNode);\n }\n }\n }\n this.parent.nodeSelection.setRange(document, save.range);\n for (var i = 0, j_2 = 0, k = 0; i <= finalinlineNodes.length; i++) {\n if (i === 0) {\n finalinlineNodes[i].parentNode.insertBefore(anchorNodes[j_2], finalinlineNodes[i].nextSibling);\n if (this.parent.domNode.blockNodes().length === 1 && anchorNodes.length === 1) {\n this.parent.nodeSelection.setSelectionNode(this.parent.currentDocument, anchorNodes[j_2]);\n }\n removeNodes[k] = finalinlineNodes[i];\n k++;\n }\n if (i < finalinlineNodes.length - 1) {\n if (finalinlineNodes[i].parentNode === finalinlineNodes[i + 1].parentNode) {\n removeNodes[k] = finalinlineNodes[i + 1];\n k++;\n }\n else {\n j_2 = j_2 + 1;\n finalinlineNodes[i + 1].parentNode.insertBefore(anchorNodes[j_2], finalinlineNodes[i + 1]);\n removeNodes[k] = finalinlineNodes[i + 1];\n k++;\n }\n }\n }\n for (var i = 0; i < removeNodes.length; i++) {\n if (removeNodes[i].parentNode) {\n removeNodes[i].parentNode.removeChild(removeNodes[i]);\n }\n }\n };\n LinkCommand.prototype.createAchorNode = function (e) {\n var anchorEle = createElement('a', {\n className: 'e-rte-anchor',\n attrs: {\n href: e.item.url,\n title: isNOU(e.item.title) || e.item.title === '' ? e.item.url : e.item.title\n }\n });\n if (!isNOU(e.item.target)) {\n anchorEle.setAttribute('target', e.item.target);\n }\n if (!isNOU(e.item.ariaLabel)) {\n anchorEle.setAttribute('aria-label', e.item.ariaLabel);\n }\n return anchorEle;\n };\n LinkCommand.prototype.getSelectionNodes = function (nodeCollection) {\n nodeCollection = nodeCollection.reverse();\n for (var index = 0; index < nodeCollection.length; index++) {\n if (nodeCollection[index].nodeType !== 3 || nodeCollection[index].textContent.trim() === '') {\n if (nodeCollection[index].nodeName !== 'IMG') {\n nodeCollection.splice(index, 1);\n index--;\n }\n }\n }\n return nodeCollection.reverse();\n };\n LinkCommand.prototype.isBlockNode = function (element) {\n return (!!element && (element.nodeType === Node.ELEMENT_NODE && CONSTANT.BLOCK_TAGS.indexOf(element.tagName.toLowerCase()) >= 0));\n };\n LinkCommand.prototype.removeText = function (text, val) {\n var arr = text.split(' ');\n for (var i = 0; i < arr.length; i++) {\n if (arr[i] === val) {\n arr.splice(i, 1);\n i--;\n }\n }\n return arr.join(' ') + ' ';\n };\n LinkCommand.prototype.openLink = function (e) {\n document.defaultView.open(e.item.url, e.item.target);\n this.callBack(e);\n };\n LinkCommand.prototype.removeLink = function (e) {\n var blockNodes = this.parent.domNode.blockNodes();\n if (blockNodes.length < 2) {\n this.parent.domNode.setMarker(e.item.selection);\n var closestAnchor = closest(e.item.selectParent[0], 'a');\n var selectParent = closestAnchor ? closestAnchor : e.item.selectParent[0];\n var parent_1 = selectParent.parentNode;\n var child = [];\n for (; selectParent.firstChild; null) {\n child.push(parent_1.insertBefore(selectParent.firstChild, selectParent));\n }\n parent_1.removeChild(selectParent);\n if (child && child.length === 1) {\n e.item.selection.startContainer = e.item.selection.getNodeArray(child[child.length - 1], true);\n e.item.selection.endContainer = e.item.selection.startContainer;\n }\n e.item.selection = this.parent.domNode.saveMarker(e.item.selection);\n }\n else {\n for (var i = 0; i < blockNodes.length; i++) {\n var linkNode = blockNodes[i].querySelectorAll('a');\n for (var j = 0; j < linkNode.length; j++) {\n if (this.parent.currentDocument.getSelection().containsNode(linkNode[j], true)) {\n linkNode[j].outerHTML = linkNode[j].innerHTML;\n }\n }\n }\n }\n e.item.selection.restore();\n this.callBack(e);\n };\n LinkCommand.prototype.callBack = function (e) {\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n return LinkCommand;\n}());\nexport { LinkCommand };\n","import * as CONSTANT from './../base/constant';\nimport { setStyleAttribute, closest } from '@syncfusion/ej2-base';\nimport * as EVENTS from './../../common/constant';\nimport { isIDevice, setEditFrameFocus } from '../../common/util';\n/**\n * Formats internal component\n *\n * @hidden\n\n */\nvar Alignments = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the parent element.\n * @returns {void}\n * @hidden\n\n */\n function Alignments(parent) {\n this.alignments = {\n 'JustifyLeft': 'left',\n 'JustifyCenter': 'center',\n 'JustifyRight': 'right',\n 'JustifyFull': 'justify'\n };\n this.parent = parent;\n this.addEventListener();\n }\n Alignments.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.ALIGNMENT_TYPE, this.applyAlignment, this);\n this.parent.observer.on(EVENTS.KEY_DOWN_HANDLER, this.onKeyDown, this);\n };\n Alignments.prototype.onKeyDown = function (e) {\n switch (e.event.action) {\n case 'justify-center':\n this.applyAlignment({ subCommand: 'JustifyCenter', callBack: e.callBack });\n e.event.preventDefault();\n break;\n case 'justify-full':\n this.applyAlignment({ subCommand: 'JustifyFull', callBack: e.callBack });\n e.event.preventDefault();\n break;\n case 'justify-left':\n this.applyAlignment({ subCommand: 'JustifyLeft', callBack: e.callBack });\n e.event.preventDefault();\n break;\n case 'justify-right':\n this.applyAlignment({ subCommand: 'JustifyRight', callBack: e.callBack });\n e.event.preventDefault();\n break;\n }\n };\n Alignments.prototype.getTableNode = function (range) {\n var startNode = range.startContainer.nodeType === Node.ELEMENT_NODE\n ? range.startContainer : range.startContainer.parentNode;\n var cellNode = closest(startNode, 'td,th');\n return [cellNode];\n };\n Alignments.prototype.applyAlignment = function (e) {\n var isTableAlign = e.value === 'Table' ? true : false;\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var save = this.parent.nodeSelection.save(range, this.parent.currentDocument);\n if (!isTableAlign) {\n this.parent.domNode.setMarker(save);\n var alignmentNodes = this.parent.domNode.blockNodes();\n if (e.enterAction === 'BR') {\n alignmentNodes = this.parent.domNode.convertToBlockNodes(alignmentNodes, false);\n }\n for (var i = 0; i < alignmentNodes.length; i++) {\n var parentNode = alignmentNodes[i];\n setStyleAttribute(parentNode, { 'text-align': this.alignments[e.subCommand] });\n }\n var imageTags = this.parent.domNode.getImageTagInSelection();\n for (var i = 0; i < imageTags.length; i++) {\n var elementNode = [];\n elementNode.push(imageTags[i]);\n this.parent.imgObj.imageCommand({\n item: {\n selectNode: elementNode\n },\n subCommand: e.subCommand,\n value: e.subCommand,\n callBack: e.callBack,\n selector: e.selector\n });\n }\n this.parent.editableElement.focus();\n save = this.parent.domNode.saveMarker(save);\n if (isIDevice()) {\n setEditFrameFocus(this.parent.editableElement, e.selector);\n }\n save.restore();\n }\n else {\n setStyleAttribute(this.getTableNode(range)[0], { 'text-align': this.alignments[e.subCommand] });\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: (isTableAlign ? this.getTableNode(range) : this.parent.domNode.blockNodes())\n });\n }\n };\n return Alignments;\n}());\nexport { Alignments };\n","import * as CONSTANT from './../base/constant';\nimport * as EVENTS from './../../common/constant';\nimport { isIDevice, setEditFrameFocus } from '../../common/util';\n/**\n * Indents internal component\n *\n * @hidden\n\n */\nvar Indents = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function Indents(parent) {\n this.indentValue = 20;\n this.parent = parent;\n this.addEventListener();\n }\n Indents.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.INDENT_TYPE, this.applyIndents, this);\n this.parent.observer.on(EVENTS.KEY_DOWN_HANDLER, this.onKeyDown, this);\n };\n Indents.prototype.onKeyDown = function (e) {\n switch (e.event.action) {\n case 'indents':\n this.applyIndents({ subCommand: 'Indent', callBack: e.callBack });\n e.event.preventDefault();\n break;\n case 'outdents':\n this.applyIndents({ subCommand: 'Outdent', callBack: e.callBack });\n e.event.preventDefault();\n break;\n }\n };\n Indents.prototype.applyIndents = function (e) {\n var editEle = this.parent.editableElement;\n var isRtl = editEle.classList.contains('e-rtl');\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var save = this.parent.nodeSelection.save(range, this.parent.currentDocument);\n this.parent.domNode.setMarker(save);\n var indentsNodes = this.parent.domNode.blockNodes();\n if (e.enterAction === 'BR') {\n indentsNodes = this.parent.domNode.convertToBlockNodes(indentsNodes, false);\n }\n var parentNodes = indentsNodes.slice();\n var listsNodes = [];\n for (var i = 0; i < parentNodes.length; i++) {\n if (parentNodes[i].tagName !== 'LI' && 'LI' === parentNodes[i].parentNode.tagName) {\n indentsNodes.splice(indentsNodes.indexOf(parentNodes[i]), 1);\n listsNodes.push(parentNodes[i].parentNode);\n }\n else if (parentNodes[i].tagName === 'LI') {\n indentsNodes.splice(indentsNodes.indexOf(parentNodes[i]), 1);\n listsNodes.push(parentNodes[i]);\n }\n }\n if (listsNodes.length > 0) {\n this.parent.observer.notify(EVENTS.KEY_DOWN_HANDLER, {\n event: {\n preventDefault: function () {\n return;\n },\n stopPropagation: function () {\n return;\n },\n shiftKey: (e.subCommand === 'Indent' ? false : true),\n which: 9,\n action: 'indent'\n },\n ignoreDefault: true\n });\n }\n for (var i = 0; i < indentsNodes.length; i++) {\n var parentNode = indentsNodes[i];\n var marginLeftOrRight = isRtl ? parentNode.style.marginRight : parentNode.style.marginLeft;\n var indentsValue = void 0;\n if (e.subCommand === 'Indent') {\n /* eslint-disable */\n indentsValue = marginLeftOrRight === '' ? this.indentValue + 'px' : parseInt(marginLeftOrRight, null) + this.indentValue + 'px';\n isRtl ? (parentNode.style.marginRight = indentsValue) : (parentNode.style.marginLeft = indentsValue);\n }\n else {\n indentsValue = (marginLeftOrRight === '' || marginLeftOrRight === '0px' || marginLeftOrRight === '0in') ? '' : parseInt(marginLeftOrRight, null) - this.indentValue + 'px';\n isRtl ? (parentNode.style.marginRight = indentsValue) : (parentNode.style.marginLeft = indentsValue);\n /* eslint-enable */\n }\n }\n editEle.focus();\n if (isIDevice()) {\n setEditFrameFocus(editEle, e.selector);\n }\n save = this.parent.domNode.saveMarker(save);\n save.restore();\n if (e.callBack) {\n e.callBack({\n requestType: e.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.domNode.blockNodes()\n });\n }\n };\n return Indents;\n}());\nexport { Indents };\n","/**\n * Rich Text Editor classes defined here.\n */\n/**\n * @hidden\n\n */\nexport var CLASS_IMAGE_RIGHT = 'e-imgright';\nexport var CLASS_IMAGE_LEFT = 'e-imgleft';\nexport var CLASS_IMAGE_CENTER = 'e-imgcenter';\nexport var CLASS_VIDEO_RIGHT = 'e-video-right';\nexport var CLASS_VIDEO_LEFT = 'e-video-left';\nexport var CLASS_VIDEO_CENTER = 'e-video-center';\nexport var CLASS_IMAGE_BREAK = 'e-imgbreak';\nexport var CLASS_AUDIO_BREAK = 'e-audio-break';\nexport var CLASS_VIDEO_BREAK = 'e-video-break';\nexport var CLASS_CAPTION = 'e-img-caption';\nexport var CLASS_RTE_CAPTION = 'e-rte-img-caption';\nexport var CLASS_CAPTION_INLINE = 'e-caption-inline';\nexport var CLASS_IMAGE_INLINE = 'e-imginline';\nexport var CLASS_AUDIO_INLINE = 'e-audio-inline';\nexport var CLASS_CLICK_ELEM = 'e-clickelem';\nexport var CLASS_VIDEO_CLICK_ELEM = 'e-video-clickelem';\nexport var CLASS_AUDIO = 'e-rte-audio';\nexport var CLASS_VIDEO = 'e-rte-video';\nexport var CLASS_AUDIO_WRAP = 'e-audio-wrap';\nexport var CLASS_VIDEO_WRAP = 'e-video-wrap';\nexport var CLASS_EMBED_VIDEO_WRAP = 'e-embed-video-wrap';\nexport var CLASS_AUDIO_FOCUS = 'e-audio-focus';\nexport var CLASS_VIDEO_FOCUS = 'e-video-focus';\nexport var CLASS_VIDEO_INLINE = 'e-video-inline';\n","import { createElement, isNullOrUndefined as isNOU, detach, closest, addClass, removeClass, select, Browser, formatUnit } from '@syncfusion/ej2-base';\nimport * as CONSTANT from './../base/constant';\nimport * as classes from './../base/classes';\nimport { InsertHtml } from './inserthtml';\n/**\n * Link internal component\n *\n * @hidden\n\n */\nvar ImageCommand = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function ImageCommand(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n ImageCommand.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.IMAGE, this.imageCommand, this);\n };\n /**\n * imageCommand method\n *\n * @param {IHtmlItem} e - specifies the element\n * @returns {void}\n * @hidden\n\n */\n ImageCommand.prototype.imageCommand = function (e) {\n switch (e.value.toString().toLowerCase()) {\n case 'image':\n case 'replace':\n this.createImage(e);\n break;\n case 'insertlink':\n this.insertImageLink(e);\n break;\n case 'openimagelink':\n this.openImageLink(e);\n break;\n case 'editimagelink':\n this.editImageLink(e);\n break;\n case 'removeimagelink':\n this.removeImageLink(e);\n break;\n case 'remove':\n this.removeImage(e);\n break;\n case 'alttext':\n this.insertAltTextImage(e);\n break;\n case 'dimension':\n this.imageDimension(e);\n break;\n case 'caption':\n this.imageCaption(e);\n break;\n case 'justifyleft':\n this.imageJustifyLeft(e);\n break;\n case 'justifycenter':\n this.imageJustifyCenter(e);\n break;\n case 'justifyright':\n this.imageJustifyRight(e);\n break;\n case 'inline':\n this.imageInline(e);\n break;\n case 'break':\n this.imageBreak(e);\n break;\n }\n };\n ImageCommand.prototype.createImage = function (e) {\n var isReplaced = false;\n e.item.url = isNOU(e.item.url) || e.item.url === 'undefined' ? e.item.src : e.item.url;\n if (!isNOU(e.item.selectParent) && e.item.selectParent[0].tagName === 'IMG') {\n var imgEle = e.item.selectParent[0];\n isReplaced = true;\n this.setStyle(imgEle, e, isReplaced);\n }\n else {\n var imgElement = createElement('img');\n this.setStyle(imgElement, e);\n if (!isNOU(e.item.selection)) {\n e.item.selection.restore();\n }\n if (!isNOU(e.selector) && e.selector === 'pasteCleanupModule') {\n e.callBack({ requestType: 'Images',\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: [imgElement]\n });\n }\n else {\n InsertHtml.Insert(this.parent.currentDocument, imgElement, this.parent.editableElement);\n }\n }\n if (e.callBack && (isNOU(e.selector) || !isNOU(e.selector) && e.selector !== 'pasteCleanupModule')) {\n var selectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)[0];\n var imgElm_1 = (e.value === 'Replace' || isReplaced) ? e.item.selectParent[0] :\n (Browser.isIE ? selectedNode.previousSibling : selectedNode.previousElementSibling);\n var imageInstance_1 = this;\n var onImageLoadEvent_1 = function () {\n e.callBack({\n requestType: (e.value === 'Replace') ? (e.item.subCommand = 'Replace', \"Replace\") : 'Images',\n editorMode: 'HTML',\n event: e.event,\n range: imageInstance_1.parent.nodeSelection.getRange(imageInstance_1.parent.currentDocument),\n elements: [imgElm_1]\n });\n imgElm_1.removeEventListener('load', onImageLoadEvent_1);\n };\n imgElm_1.addEventListener('load', onImageLoadEvent_1);\n }\n };\n ImageCommand.prototype.setStyle = function (imgElement, e, imgReplace) {\n if (!isNOU(e.item.url)) {\n imgElement.setAttribute('src', e.item.url);\n }\n var alignClassName;\n if (imgReplace) {\n var alignClass = {\n 'e-imgcenter': 'e-imgcenter',\n 'e-imgright': 'e-imgright',\n 'e-imgleft': 'e-imgleft'\n };\n var imgClassList = imgElement.classList;\n var classArray = [];\n for (var i = 0; i < imgClassList.length; i++) {\n // eslint-disable-next-line\n if (!isNOU(alignClass[imgClassList[i]])) {\n // eslint-disable-next-line\n alignClassName = alignClass[imgClassList[i]];\n }\n }\n }\n imgElement.setAttribute('class', 'e-rte-image' + (isNOU(e.item.cssClass) ? '' : ' ' + e.item.cssClass)\n + (isNOU(alignClassName) ? '' : ' ' + alignClassName));\n if (!isNOU(e.item.altText)) {\n imgElement.setAttribute('alt', e.item.altText);\n }\n if (!isNOU(e.item.width) && !isNOU(e.item.width.width)) {\n imgElement.setAttribute('width', this.calculateStyleValue(e.item.width.width));\n }\n if (!isNOU(e.item.height) && !isNOU(e.item.height.height)) {\n imgElement.setAttribute('height', this.calculateStyleValue(e.item.height.height));\n }\n if (!isNOU(e.item.width) && !isNOU(e.item.width.minWidth)) {\n imgElement.style.minWidth = this.calculateStyleValue(e.item.width.minWidth);\n }\n if (!isNOU(e.item.width) && !isNOU(e.item.width.maxWidth)) {\n imgElement.style.maxWidth = this.calculateStyleValue(e.item.width.maxWidth);\n }\n if (!isNOU(e.item.height) && !isNOU(e.item.height.minHeight)) {\n imgElement.style.minHeight = this.calculateStyleValue(e.item.height.minHeight);\n }\n if (!isNOU(e.item.height) && !isNOU(e.item.height.maxHeight)) {\n imgElement.style.maxHeight = this.calculateStyleValue(e.item.height.maxHeight);\n }\n };\n ImageCommand.prototype.calculateStyleValue = function (value) {\n var styleValue;\n if (typeof (value) === 'string') {\n if (value.indexOf('px') || value.indexOf('%') || value.indexOf('auto')) {\n styleValue = value;\n }\n else {\n styleValue = value + 'px';\n }\n }\n else {\n styleValue = value + 'px';\n }\n return styleValue;\n };\n ImageCommand.prototype.insertImageLink = function (e) {\n var anchor = createElement('a', {\n attrs: {\n href: e.item.url\n }\n });\n if (e.item.selectNode[0].parentElement.classList.contains('e-img-wrap')) {\n e.item.selection.restore();\n anchor.setAttribute('contenteditable', 'true');\n }\n anchor.appendChild(e.item.selectNode[0]);\n if (!isNOU(e.item.target)) {\n anchor.setAttribute('target', e.item.target);\n }\n if (!isNOU(e.item.ariaLabel)) {\n anchor.setAttribute('aria-label', e.item.ariaLabel);\n }\n InsertHtml.Insert(this.parent.currentDocument, anchor, this.parent.editableElement);\n this.callBack(e);\n };\n ImageCommand.prototype.openImageLink = function (e) {\n document.defaultView.open(e.item.url, e.item.target);\n this.callBack(e);\n };\n ImageCommand.prototype.removeImageLink = function (e) {\n var selectParent = e.item.selectParent[0];\n if (selectParent.classList.contains('e-img-caption')) {\n var capImgWrap = select('.e-img-wrap', selectParent);\n var textEle = select('.e-img-inner', selectParent);\n var newTextEle = textEle.cloneNode(true);\n detach(select('a', selectParent));\n detach(textEle);\n capImgWrap.appendChild(e.item.insertElement);\n capImgWrap.appendChild(newTextEle);\n }\n else {\n detach(selectParent);\n if (Browser.isIE && e.item.selection) {\n e.item.selection.restore();\n }\n InsertHtml.Insert(this.parent.currentDocument, e.item.insertElement, this.parent.editableElement);\n }\n this.callBack(e);\n };\n ImageCommand.prototype.editImageLink = function (e) {\n e.item.selectNode[0].parentElement.href = e.item.url;\n if (isNOU(e.item.target)) {\n e.item.selectNode[0].parentElement.removeAttribute('target');\n e.item.selectNode[0].parentElement.removeAttribute('aria-label');\n }\n else {\n e.item.selectNode[0].parentElement.target = e.item.target;\n e.item.selectNode[0].parentElement.ariaLabel = e.item.ariaLabel;\n }\n this.callBack(e);\n };\n ImageCommand.prototype.removeImage = function (e) {\n if (closest(e.item.selectNode[0], 'a')) {\n if (e.item.selectNode[0].parentElement.nodeName === 'A' && !isNOU(e.item.selectNode[0].parentElement.innerText)) {\n if (!isNOU(closest(e.item.selectNode[0], '.' + classes.CLASS_CAPTION))) {\n detach(closest(e.item.selectNode[0], '.' + classes.CLASS_CAPTION));\n }\n else {\n detach(e.item.selectNode[0]);\n }\n }\n else {\n detach(closest(e.item.selectNode[0], 'a'));\n }\n }\n else if (!isNOU(closest(e.item.selectNode[0], '.' + classes.CLASS_CAPTION))) {\n detach(closest(e.item.selectNode[0], '.' + classes.CLASS_CAPTION));\n }\n else {\n detach(e.item.selectNode[0]);\n }\n this.callBack(e);\n };\n ImageCommand.prototype.insertAltTextImage = function (e) {\n e.item.selectNode[0].setAttribute('alt', e.item.altText);\n this.callBack(e);\n };\n ImageCommand.prototype.imageDimension = function (e) {\n var selectNode = e.item.selectNode[0];\n selectNode.style.height = '';\n selectNode.style.width = '';\n if (e.item.width !== 'auto') {\n selectNode.style.width = formatUnit(e.item.width);\n }\n else {\n selectNode.removeAttribute('width');\n }\n if (e.item.height !== 'auto') {\n selectNode.style.height = formatUnit(e.item.height);\n }\n else {\n selectNode.removeAttribute('height');\n }\n this.callBack(e);\n };\n ImageCommand.prototype.imageCaption = function (e) {\n InsertHtml.Insert(this.parent.currentDocument, e.item.insertElement, this.parent.editableElement);\n this.callBack(e);\n };\n ImageCommand.prototype.imageJustifyLeft = function (e) {\n var selectNode = e.item.selectNode[0];\n if (!isNOU(selectNode)) {\n selectNode.removeAttribute('class');\n addClass([selectNode], 'e-rte-image');\n if (!isNOU(closest(selectNode, '.' + classes.CLASS_CAPTION))) {\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_RIGHT);\n addClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_LEFT);\n }\n if (selectNode.parentElement.nodeName === 'A') {\n removeClass([selectNode.parentElement], classes.CLASS_IMAGE_RIGHT);\n addClass([selectNode.parentElement], classes.CLASS_IMAGE_LEFT);\n addClass([selectNode], classes.CLASS_IMAGE_LEFT);\n }\n else {\n addClass([selectNode], classes.CLASS_IMAGE_LEFT);\n }\n this.callBack(e);\n }\n };\n ImageCommand.prototype.imageJustifyCenter = function (e) {\n var selectNode = e.item.selectNode[0];\n if (!isNOU(selectNode)) {\n selectNode.removeAttribute('class');\n addClass([selectNode], 'e-rte-image');\n if (!isNOU(closest(selectNode, '.' + classes.CLASS_CAPTION))) {\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_LEFT);\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_RIGHT);\n addClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_CENTER);\n }\n if (selectNode.parentElement.nodeName === 'A') {\n removeClass([selectNode.parentElement], classes.CLASS_IMAGE_LEFT);\n removeClass([selectNode.parentElement], classes.CLASS_IMAGE_RIGHT);\n addClass([selectNode.parentElement], classes.CLASS_IMAGE_CENTER);\n addClass([selectNode], classes.CLASS_IMAGE_CENTER);\n }\n else {\n addClass([selectNode], classes.CLASS_IMAGE_CENTER);\n }\n this.callBack(e);\n }\n };\n ImageCommand.prototype.imageJustifyRight = function (e) {\n var selectNode = e.item.selectNode[0];\n if (!isNOU(selectNode)) {\n selectNode.removeAttribute('class');\n addClass([selectNode], 'e-rte-image');\n if (!isNOU(closest(selectNode, '.' + classes.CLASS_CAPTION))) {\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_LEFT);\n addClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_RIGHT);\n }\n if (selectNode.parentElement.nodeName === 'A') {\n removeClass([selectNode.parentElement], classes.CLASS_IMAGE_LEFT);\n addClass([selectNode.parentElement], classes.CLASS_IMAGE_RIGHT);\n addClass([selectNode], classes.CLASS_IMAGE_RIGHT);\n }\n else {\n addClass([selectNode], classes.CLASS_IMAGE_RIGHT);\n }\n this.callBack(e);\n }\n };\n ImageCommand.prototype.imageInline = function (e) {\n var selectNode = e.item.selectNode[0];\n selectNode.removeAttribute('class');\n addClass([selectNode], 'e-rte-image');\n addClass([selectNode], classes.CLASS_IMAGE_INLINE);\n if (!isNOU(closest(selectNode, '.' + classes.CLASS_CAPTION))) {\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_BREAK);\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_CENTER);\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_LEFT);\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_RIGHT);\n addClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_CAPTION_INLINE);\n }\n this.callBack(e);\n };\n ImageCommand.prototype.imageBreak = function (e) {\n var selectNode = e.item.selectNode[0];\n selectNode.removeAttribute('class');\n addClass([selectNode], classes.CLASS_IMAGE_BREAK);\n addClass([selectNode], 'e-rte-image');\n if (!isNOU(closest(selectNode, '.' + classes.CLASS_CAPTION))) {\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_CAPTION_INLINE);\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_CENTER);\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_LEFT);\n removeClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_RIGHT);\n addClass([closest(selectNode, '.' + classes.CLASS_CAPTION)], classes.CLASS_IMAGE_BREAK);\n }\n this.callBack(e);\n };\n ImageCommand.prototype.callBack = function (e) {\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n return ImageCommand;\n}());\nexport { ImageCommand };\n","import { createElement, isNullOrUndefined as isNOU, detach, addClass, Browser } from '@syncfusion/ej2-base';\nimport * as CONSTANT from './../base/constant';\nimport * as classes from './../base/classes';\nimport { InsertHtml } from './inserthtml';\n/**\n * Audio internal component\n *\n * @hidden\n\n */\nvar AudioCommand = /** @class */ (function () {\n /**\n * Constructor for creating the Audio plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function AudioCommand(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n AudioCommand.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.AUDIO, this.audioCommand, this);\n };\n /**\n * audioCommand method\n *\n * @param {IHtmlItem} e - specifies the element\n * @returns {void}\n * @hidden\n\n */\n AudioCommand.prototype.audioCommand = function (e) {\n var selectNode;\n var value = e.value.toString().toLowerCase();\n if (value === 'inline' || value === 'break' || value === 'audioremove') {\n selectNode = e.item.selectNode[0];\n }\n switch (value) {\n case 'audio':\n case 'audioreplace':\n this.createAudio(e);\n break;\n case 'inline':\n selectNode.removeAttribute('class');\n selectNode.closest('.' + classes.CLASS_AUDIO_WRAP).style.display = 'inline-block';\n addClass([selectNode], [classes.CLASS_AUDIO, classes.CLASS_AUDIO_INLINE, classes.CLASS_AUDIO_FOCUS]);\n this.callBack(e);\n break;\n case 'break':\n selectNode.removeAttribute('class');\n selectNode.closest('.' + classes.CLASS_AUDIO_WRAP).style.display = 'block';\n addClass([selectNode], [classes.CLASS_AUDIO_BREAK, classes.CLASS_AUDIO, classes.CLASS_AUDIO_FOCUS]);\n this.callBack(e);\n break;\n case 'audioremove':\n detach(selectNode);\n this.callBack(e);\n break;\n }\n };\n AudioCommand.prototype.createAudio = function (e) {\n var _this = this;\n var isReplaced = false;\n var wrapElement;\n if (!isNOU(e.item.selectParent) && e.item.selectParent[0].classList &&\n (e.item.selectParent[0].classList.contains(classes.CLASS_CLICK_ELEM) ||\n e.item.selectParent[0].classList.contains(classes.CLASS_AUDIO_WRAP))) {\n var audioEle = e.item.selectParent[0].querySelector('source');\n this.setStyle(audioEle, e);\n isReplaced = true;\n }\n else {\n wrapElement = createElement('span', { className: classes.CLASS_AUDIO_WRAP, attrs: { contentEditable: 'false', title: ((!isNOU(e.item.title)) ? e.item.title : (!isNOU(e.item.fileName) ? e.item.fileName : '')) } });\n var audElement = createElement('audio', { className: classes.CLASS_AUDIO + ' ' + classes.CLASS_AUDIO_INLINE, attrs: { controls: '' } });\n var sourceElement = createElement('source');\n var clickElement = createElement('span', { className: classes.CLASS_CLICK_ELEM });\n this.setStyle(sourceElement, e);\n audElement.appendChild(sourceElement);\n clickElement.appendChild(audElement);\n wrapElement.appendChild(clickElement);\n if (!isNOU(e.item.selection)) {\n e.item.selection.restore();\n }\n InsertHtml.Insert(this.parent.currentDocument, wrapElement, this.parent.editableElement);\n if (wrapElement.nextElementSibling === null) {\n var insertElem = createElement('br');\n wrapElement.parentNode.insertBefore(insertElem, wrapElement.nextSibling);\n }\n }\n if (e.callBack && (isNOU(e.selector) || !isNOU(e.selector) && e.selector !== 'pasteCleanupModule')) {\n var selectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)[0];\n var audioElm_1 = (e.value === 'AudioReplace' || isReplaced) ? e.item.selectParent[0].querySelector('audio')\n : (Browser.isIE ? selectedNode : selectedNode.querySelector('audio'));\n audioElm_1.addEventListener('loadeddata', function () {\n if (e.value !== 'AudioReplace' || !isReplaced) {\n e.callBack({\n requestType: 'Audios',\n editorMode: 'HTML',\n event: e.event,\n range: _this.parent.nodeSelection.getRange(_this.parent.currentDocument),\n elements: [audioElm_1]\n });\n }\n });\n if (isReplaced) {\n audioElm_1.load();\n }\n }\n };\n AudioCommand.prototype.setStyle = function (sourceElement, e) {\n if (!isNOU(e.item.url)) {\n sourceElement.setAttribute('src', e.item.url);\n }\n var fileExtension = e.item.fileName ? e.item.fileName.split('.').pop().toLowerCase() :\n e.item.url ? e.item.url.split('.').pop().toLowerCase() : '';\n if (fileExtension === 'opus') {\n sourceElement.type = 'audio/ogg';\n }\n else if (fileExtension === 'm4a') {\n sourceElement.type = 'audio/mp4';\n }\n else {\n sourceElement.type = e.item.fileName && e.item.fileName.split('.').length > 0 ?\n 'audio/' + e.item.fileName.split('.')[e.item.fileName.split('.').length - 1] :\n e.item.url && e.item.url.split('.').length > 0 ? 'audio/' + e.item.url.split('.')[e.item.url.split('.').length - 1] : '';\n }\n };\n AudioCommand.prototype.callBack = function (e) {\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n return AudioCommand;\n}());\nexport { AudioCommand };\n","import { createElement, isNullOrUndefined as isNOU, detach, addClass, Browser, formatUnit } from '@syncfusion/ej2-base';\nimport * as CONSTANT from './../base/constant';\nimport * as classes from './../base/classes';\nimport { InsertHtml } from './inserthtml';\n/**\n * Video internal component\n *\n * @hidden\n\n */\nvar VideoCommand = /** @class */ (function () {\n /**\n * Constructor for creating the Video plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function VideoCommand(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n VideoCommand.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.VIDEO, this.videoCommand, this);\n };\n /**\n * videoCommand method\n *\n * @param {IHtmlItem} e - specifies the element\n * @returns {void}\n * @hidden\n\n */\n VideoCommand.prototype.videoCommand = function (e) {\n var selectNode;\n var videoWrapNode;\n var videoClickElem;\n var value = e.value.toString().toLowerCase();\n if (value !== 'video' && value !== 'videoreplace') {\n selectNode = e.item.selectNode[0];\n videoWrapNode = selectNode.closest('.' + classes.CLASS_EMBED_VIDEO_WRAP);\n videoClickElem = selectNode.closest('.' + classes.CLASS_VIDEO_CLICK_ELEM);\n }\n switch (value) {\n case 'video':\n case 'videoreplace':\n this.createVideo(e);\n break;\n case 'videodimension':\n this.videoDimension(e);\n break;\n case 'inline':\n selectNode.removeAttribute('class');\n if (videoWrapNode) {\n videoWrapNode.style.display = 'inline-block';\n }\n if (videoClickElem) {\n selectNode.parentElement.style.cssFloat = '';\n }\n addClass([selectNode], [classes.CLASS_VIDEO, classes.CLASS_VIDEO_INLINE, classes.CLASS_VIDEO_FOCUS]);\n this.callBack(e);\n break;\n case 'break':\n selectNode.removeAttribute('class');\n if (videoWrapNode) {\n videoWrapNode.style.display = 'block';\n }\n if (videoClickElem) {\n selectNode.parentElement.style.cssFloat = '';\n }\n addClass([selectNode], [classes.CLASS_VIDEO_BREAK, classes.CLASS_VIDEO, classes.CLASS_VIDEO_FOCUS]);\n this.callBack(e);\n break;\n case 'justifyleft':\n selectNode.removeAttribute('class');\n if (videoWrapNode) {\n videoWrapNode.style.display = 'block';\n }\n if (videoClickElem) {\n selectNode.parentElement.style.cssFloat = 'left';\n }\n addClass([selectNode], [classes.CLASS_VIDEO, classes.CLASS_VIDEO_LEFT]);\n this.callBack(e);\n break;\n case 'justifycenter':\n selectNode.removeAttribute('class');\n if (videoWrapNode) {\n videoWrapNode.style.display = 'block';\n }\n if (videoClickElem) {\n selectNode.parentElement.style.cssFloat = '';\n }\n addClass([selectNode], [classes.CLASS_VIDEO, classes.CLASS_VIDEO_CENTER]);\n this.callBack(e);\n break;\n case 'justifyright':\n selectNode.removeAttribute('class');\n if (videoWrapNode) {\n videoWrapNode.style.display = 'block';\n }\n if (videoClickElem) {\n selectNode.parentElement.style.cssFloat = 'right';\n }\n addClass([selectNode], [classes.CLASS_VIDEO, classes.CLASS_VIDEO_RIGHT]);\n this.callBack(e);\n break;\n case 'videoremove':\n detach(selectNode.parentElement);\n this.callBack(e);\n break;\n }\n };\n VideoCommand.prototype.createVideo = function (e) {\n var _this = this;\n var isReplaced = false;\n var wrapElement;\n var vidElement;\n var sourceElement;\n if (e.value === 'VideoReplace' && !isNOU(e.item.selectParent) && (e.item.selectParent[0].tagName === 'VIDEO')) {\n var videoEle = e.item.selectParent[0].querySelector('source');\n this.setStyle(videoEle, e, videoEle);\n isReplaced = true;\n }\n else if (e.value === 'VideoReplace' && !isNOU(e.item.selectParent) &&\n e.item.selectParent[0].classList &&\n e.item.selectParent[0].classList.contains(classes.CLASS_VIDEO_CLICK_ELEM)) {\n e.item.selectParent[0].innerHTML = e.item.fileName;\n this.setStyle(e.item.selectParent[0].firstElementChild, e, e.item.selectParent[0].firstElementChild);\n }\n else {\n if (!e.item.isEmbedUrl) {\n wrapElement = createElement('span', { className: classes.CLASS_VIDEO_WRAP, attrs: { contentEditable: 'false', title: ((!isNOU(e.item.title)) ? e.item.title : (!isNOU(e.item.fileName) ? e.item.fileName : '')) } });\n vidElement = createElement('video', { className: classes.CLASS_VIDEO + ' ' + classes.CLASS_VIDEO_INLINE, attrs: { controls: '' } });\n sourceElement = createElement('source');\n this.setStyle(sourceElement, e, vidElement);\n vidElement.appendChild(sourceElement);\n wrapElement.appendChild(vidElement);\n }\n else {\n wrapElement = createElement('span', { className: classes.CLASS_EMBED_VIDEO_WRAP, attrs: { contentEditable: 'false' } });\n var clickElement = createElement('span', { className: classes.CLASS_VIDEO_CLICK_ELEM });\n var temp = createElement('template');\n temp.innerHTML = e.item.fileName;\n clickElement.appendChild(temp.content);\n vidElement = sourceElement = clickElement.firstElementChild;\n this.setStyle(sourceElement, e, vidElement);\n wrapElement.appendChild(clickElement);\n }\n if (!isNOU(e.item.selection)) {\n e.item.selection.restore();\n }\n InsertHtml.Insert(this.parent.currentDocument, wrapElement, this.parent.editableElement);\n if (wrapElement.nextElementSibling === null) {\n var insertElem = createElement('br');\n wrapElement.parentNode.insertBefore(insertElem, wrapElement.nextSibling);\n }\n }\n if (e.callBack && (isNOU(e.selector) || !isNOU(e.selector) && e.selector !== 'pasteCleanupModule')) {\n var selectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)[0];\n var videoElm_1 = (e.value === 'VideoReplace' || isReplaced) ? !e.item.isEmbedUrl ? e.item.selectParent[0] : e.item.selectParent[0].querySelector('iframe')\n : (Browser.isIE ? selectedNode : !e.item.isEmbedUrl ? selectedNode.lastElementChild : selectedNode.querySelector('iframe'));\n videoElm_1.addEventListener(videoElm_1.tagName !== 'IFRAME' ? 'loadeddata' : 'load', function () {\n if (e.value !== 'VideoReplace' || !isReplaced) {\n if (e.item.isEmbedUrl && videoElm_1) {\n videoElm_1.classList.add('e-rte-embed-url');\n }\n e.callBack({\n requestType: 'Videos',\n editorMode: 'HTML',\n event: e.event,\n range: _this.parent.nodeSelection.getRange(_this.parent.currentDocument),\n elements: [videoElm_1]\n });\n }\n });\n if (isReplaced) {\n videoElm_1.load();\n }\n if (Browser.userAgent.indexOf('Firefox') !== -1) {\n vidElement.addEventListener('play', function () { _this.editAreaVideoClick(e); });\n vidElement.addEventListener('pause', function () { _this.editAreaVideoClick(e); });\n }\n }\n };\n VideoCommand.prototype.editAreaVideoClick = function (e) {\n e.callBack({\n requestType: 'VideosPlayPause',\n editorMode: 'HTML',\n event: e.event\n });\n };\n VideoCommand.prototype.setStyle = function (sourceElement, e, videoEle) {\n if (e.item.url !== '' && !isNOU(e.item.url)) {\n sourceElement.setAttribute('src', e.item.url);\n }\n if (!e.item.isEmbedUrl) {\n sourceElement.type = e.item.fileName && e.item.fileName.split('.').length > 0 ?\n 'video/' + e.item.fileName.split('.')[e.item.fileName.split('.').length - 1] :\n e.item.url && e.item.url.split('.').length > 0 ? 'video/' + e.item.url.split('.')[e.item.url.split('.').length - 1] : '';\n }\n if (!isNOU(e.item.width) && !isNOU(e.item.width.width)) {\n videoEle.setAttribute('width', formatUnit(e.item.width.width));\n }\n if (!isNOU(e.item.height) && !isNOU(e.item.height.height)) {\n videoEle.setAttribute('height', formatUnit(e.item.height.height));\n }\n if (!isNOU(e.item.width) && !isNOU(e.item.width.minWidth)) {\n videoEle.style.minWidth = formatUnit(e.item.width.minWidth);\n }\n if (!isNOU(e.item.width) && !isNOU(e.item.width.maxWidth)) {\n videoEle.style.maxWidth = formatUnit(e.item.width.maxWidth);\n }\n if (!isNOU(e.item.height) && !isNOU(e.item.height.minHeight)) {\n videoEle.style.minHeight = formatUnit(e.item.height.minHeight);\n }\n if (!isNOU(e.item.height) && !isNOU(e.item.height.maxHeight)) {\n videoEle.style.maxHeight = formatUnit(e.item.height.maxHeight);\n }\n };\n VideoCommand.prototype.videoDimension = function (e) {\n var selectNode = !(e.item.selectNode[0].classList.contains(classes.CLASS_VIDEO_CLICK_ELEM)) ? e.item.selectNode[0] :\n e.item.selectNode[0].querySelector('iframe');\n selectNode.style.height = '';\n selectNode.style.width = '';\n if (e.item.width !== 'auto') {\n selectNode.style.width = formatUnit(e.item.width);\n }\n else {\n selectNode.removeAttribute('width');\n }\n if (e.item.height !== 'auto') {\n selectNode.style.height = formatUnit(e.item.height);\n }\n else {\n selectNode.removeAttribute('height');\n }\n this.callBack(e);\n };\n VideoCommand.prototype.callBack = function (e) {\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n return VideoCommand;\n}());\nexport { VideoCommand };\n","import { createElement, closest, detach, Browser, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport * as CONSTANT from './../base/constant';\nimport { InsertHtml } from './inserthtml';\n/**\n * Link internal component\n *\n * @hidden\n\n */\nvar TableCommand = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function TableCommand(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n TableCommand.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.TABLE, this.createTable, this);\n this.parent.observer.on(CONSTANT.INSERT_ROW, this.insertRow, this);\n this.parent.observer.on(CONSTANT.INSERT_COLUMN, this.insertColumn, this);\n this.parent.observer.on(CONSTANT.DELETEROW, this.deleteRow, this);\n this.parent.observer.on(CONSTANT.DELETECOLUMN, this.deleteColumn, this);\n this.parent.observer.on(CONSTANT.REMOVETABLE, this.removeTable, this);\n this.parent.observer.on(CONSTANT.TABLEHEADER, this.tableHeader, this);\n this.parent.observer.on(CONSTANT.TABLE_VERTICAL_ALIGN, this.tableVerticalAlign, this);\n this.parent.observer.on(CONSTANT.TABLE_MERGE, this.cellMerge, this);\n this.parent.observer.on(CONSTANT.TABLE_HORIZONTAL_SPLIT, this.HorizontalSplit, this);\n this.parent.observer.on(CONSTANT.TABLE_VERTICAL_SPLIT, this.VerticalSplit, this);\n this.parent.observer.on(CONSTANT.TABLE_MOVE, this.tableMove, this);\n };\n TableCommand.prototype.createTable = function (e) {\n var table = createElement('table', { className: 'e-rte-table' });\n var tblBody = createElement('tbody');\n if (!isNOU(e.item.width.width)) {\n table.style.width = this.calculateStyleValue(e.item.width.width);\n }\n if (!isNOU(e.item.width.minWidth)) {\n table.style.minWidth = this.calculateStyleValue(e.item.width.minWidth);\n }\n if (!isNOU(e.item.width.maxWidth)) {\n table.style.maxWidth = this.calculateStyleValue(e.item.width.maxWidth);\n }\n var tdWid = parseInt(e.item.width.width, 10) > 100 ?\n 100 / e.item.columns : parseInt(e.item.width.width, 10) / e.item.columns;\n for (var i = 0; i < e.item.rows; i++) {\n var row = createElement('tr');\n for (var j = 0; j < e.item.columns; j++) {\n var cell = createElement('td');\n cell.appendChild(createElement('br'));\n cell.style.width = tdWid + '%';\n row.appendChild(cell);\n }\n tblBody.appendChild(row);\n }\n table.appendChild(tblBody);\n e.item.selection.restore();\n InsertHtml.Insert(this.parent.currentDocument, table, this.parent.editableElement);\n e.item.selection.setSelectionText(this.parent.currentDocument, table.querySelector('td'), table.querySelector('td'), 0, 0);\n if (table.nextElementSibling === null && !table.classList.contains('ignore-table')) {\n var insertElem = void 0;\n if (e.enterAction === 'DIV') {\n insertElem = createElement('div');\n insertElem.appendChild(createElement('br'));\n }\n else if (e.enterAction === 'BR') {\n insertElem = createElement('br');\n }\n else {\n insertElem = createElement('p');\n insertElem.appendChild(createElement('br'));\n }\n this.insertAfter(insertElem, table);\n }\n if (table.classList.contains('ignore-table')) {\n table.classList.remove('ignore-table');\n }\n table.querySelector('td').classList.add('e-cell-select');\n if (e.callBack) {\n e.callBack({\n requestType: 'Table',\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: [table]\n });\n }\n return table;\n };\n TableCommand.prototype.calculateStyleValue = function (value) {\n var styleValue;\n if (typeof (value) === 'string') {\n if (value.indexOf('px') >= 0 || value.indexOf('%') >= 0 || value.indexOf('auto') >= 0) {\n styleValue = value;\n }\n else {\n styleValue = value + 'px';\n }\n }\n else {\n styleValue = value + 'px';\n }\n return styleValue;\n };\n TableCommand.prototype.insertAfter = function (newNode, referenceNode) {\n referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);\n };\n TableCommand.prototype.getSelectedCellMinMaxIndex = function (e) {\n var selectedCells = this.curTable.querySelectorAll('.e-cell-select');\n var a = 0;\n var minI = e.length;\n var maxI = 0;\n var minJ = e[0].length;\n var maxJ = 0;\n //eslint-disable-next-line\n for (var i = 0; a < selectedCells.length; a++) {\n var selectedCellIndex = this.getCorrespondingIndex(selectedCells[a], e);\n var minMaxIndex = this.FindIndex(selectedCellIndex[0], selectedCellIndex[1], e);\n //eslint-disable-next-line\n minI = Math.min(selectedCellIndex[0], minI),\n maxI = Math.max(minMaxIndex[0], maxI),\n minJ = Math.min(selectedCellIndex[1], minJ),\n maxJ = Math.max(minMaxIndex[1], maxJ);\n }\n return {\n startRow: minI,\n endRow: maxI,\n startColumn: minJ,\n endColumn: maxJ\n };\n };\n TableCommand.prototype.insertRow = function (e) {\n var isBelow = e.item.subCommand === 'InsertRowBefore' ? false : true;\n var selectedCell = e.item.selection.range.startContainer;\n if (!(selectedCell.nodeName === 'TH' || selectedCell.nodeName === 'TD')) {\n selectedCell = closest(selectedCell.parentElement, 'td,th');\n }\n if (selectedCell.nodeName.toLowerCase() === 'th' && e.item.subCommand === 'InsertRowBefore') {\n return;\n }\n this.curTable = closest(this.parent.nodeSelection.range.startContainer.parentElement, 'table');\n if (this.curTable.querySelectorAll('.e-cell-select').length === 0) {\n var lastRow = this.curTable.rows[this.curTable.rows.length - 1];\n var cloneRow = lastRow.cloneNode(true);\n cloneRow.removeAttribute('rowspan');\n this.insertAfter(cloneRow, lastRow);\n }\n else {\n var allCells = this.getCorrespondingColumns();\n var minMaxIndex = this.getSelectedCellMinMaxIndex(allCells);\n var minVal = isBelow ? minMaxIndex.endRow : minMaxIndex.startRow;\n var newRow = createElement('tr');\n var isHeaderSelect = this.curTable.querySelectorAll('th.e-cell-select').length > 0;\n for (var i = 0; i < allCells[minVal].length; i++) {\n // eslint-disable-next-line max-len\n if (isBelow && minVal < allCells.length - 1 && allCells[minVal][i] === allCells[minVal + 1][i] ||\n !isBelow && 0 < minVal && allCells[minVal][i] === allCells[minVal - 1][i]) {\n if (0 === i || 0 < i && allCells[minVal][i] !== allCells[minVal][i - 1]) {\n allCells[minVal][i].setAttribute('rowspan', (parseInt(allCells[minVal][i].getAttribute('rowspan'), 10) + 1).toString());\n }\n }\n else {\n var tdElement = createElement('td');\n tdElement.appendChild(createElement('br'));\n newRow.appendChild(tdElement);\n tdElement.setAttribute('style', allCells[(isHeaderSelect && isBelow) ? allCells[(minVal + 1)] ? (minVal + 1) : minVal : minVal][i].getAttribute('style'));\n }\n }\n // eslint-disable-next-line\n var selectedRow = void 0;\n if (isHeaderSelect && isBelow) {\n selectedRow = this.curTable.querySelector('tbody').childNodes[0];\n }\n else {\n selectedRow = this.curTable.rows[minVal];\n }\n // eslint-disable-next-line\n (e.item.subCommand === 'InsertRowBefore') ? selectedRow.parentElement.insertBefore(newRow, selectedRow) :\n (isHeaderSelect ? selectedRow.parentElement.insertBefore(newRow, selectedRow) :\n this.insertAfter(newRow, selectedRow));\n }\n e.item.selection.setSelectionText(this.parent.currentDocument, e.item.selection.range.startContainer, e.item.selection.range.startContainer, 0, 0);\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.insertColumn = function (e) {\n var selectedCell = e.item.selection.range.startContainer;\n if (!(selectedCell.nodeName === 'TH' || selectedCell.nodeName === 'TD')) {\n selectedCell = closest(selectedCell.parentElement, 'td,th');\n }\n var curRow = closest(selectedCell, 'tr');\n var curCell;\n var allRows = closest((curRow), 'table').rows;\n var colIndex = Array.prototype.slice.call(curRow.querySelectorAll(':scope > td, :scope > th')).indexOf(selectedCell);\n var previousWidth = parseInt(e.item.width, 10) / (curRow.querySelectorAll(':scope > td, :scope > th').length);\n var currentWidth = parseInt(e.item.width, 10) / (curRow.querySelectorAll(':scope > td, :scope > th').length + 1);\n var currentTabElm = closest(curRow, 'table');\n var thTdElm = closest(curRow, 'table').querySelectorAll('th,td');\n for (var i = 0; i < thTdElm.length; i++) {\n thTdElm[i].dataset.oldWidth = (thTdElm[i].offsetWidth / currentTabElm.offsetWidth * 100) + '%';\n }\n for (var i = 0; i < allRows.length; i++) {\n curCell = allRows[i].querySelectorAll(':scope > td, :scope > th')[colIndex];\n var colTemplate = curCell.cloneNode(true);\n colTemplate.innerHTML = '';\n colTemplate.appendChild(createElement('br'));\n colTemplate.removeAttribute('class');\n colTemplate.removeAttribute('colspan');\n colTemplate.removeAttribute('rowspan');\n // eslint-disable-next-line\n (e.item.subCommand === 'InsertColumnLeft') ? curCell.parentElement.insertBefore(colTemplate, curCell) :\n this.insertAfter(colTemplate, curCell);\n colTemplate.style.width = currentWidth.toFixed(4) + '%';\n delete colTemplate.dataset.oldWidth;\n }\n for (var i = 0; i < thTdElm.length; i++) {\n thTdElm[i].style.width = (Number(thTdElm[i].dataset.oldWidth.split('%')[0]) * currentWidth / previousWidth).toFixed(4) + '%';\n delete thTdElm[i].dataset.oldWidth;\n }\n e.item.selection.setSelectionText(this.parent.currentDocument, selectedCell, selectedCell, 0, 0);\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.deleteColumn = function (e) {\n var selectedCell = e.item.selection.range.startContainer;\n if (selectedCell.nodeType === 3) {\n selectedCell = closest(selectedCell.parentElement, 'td,th');\n }\n var tBodyHeadEle = closest(selectedCell, selectedCell.tagName === 'TH' ? 'thead' : 'tbody');\n var rowIndex = tBodyHeadEle && Array.prototype.indexOf.call(tBodyHeadEle.childNodes, selectedCell.parentNode);\n this.curTable = closest(selectedCell, 'table');\n var curRow = closest(selectedCell, 'tr');\n if (curRow.querySelectorAll('th,td').length === 1) {\n e.item.selection.restore();\n detach(closest(selectedCell.parentElement, 'table'));\n }\n else {\n var deleteIndex = void 0;\n var allCells = this.getCorrespondingColumns();\n //eslint-disable-next-line\n var selectedMinMaxIndex = this.getSelectedCellMinMaxIndex(allCells);\n var minCol = selectedMinMaxIndex.startColumn;\n var maxCol = selectedMinMaxIndex.endColumn;\n for (var i = 0; i < allCells.length; i++) {\n var currentRow = allCells[i];\n for (var j = 0; j < currentRow.length; j++) {\n var currentCell = currentRow[j];\n //eslint-disable-next-line\n var currentCellIndex = this.getCorrespondingIndex(currentCell, allCells);\n var colSpanVal = parseInt(currentCell.getAttribute('colspan'), 10) || 1;\n if (currentCellIndex[1] + (colSpanVal - 1) >= minCol && currentCellIndex[1] <= maxCol) {\n if (colSpanVal > 1) {\n currentCell.setAttribute('colspan', (colSpanVal - 1).toString());\n }\n else {\n detach(currentCell);\n deleteIndex = j;\n if (Browser.isIE) {\n e.item.selection.setSelectionText(this.parent.currentDocument, this.curTable.querySelector('td'), this.curTable.querySelector('td'), 0, 0);\n this.curTable.querySelector('td, th').classList.add('e-cell-select');\n }\n }\n }\n }\n }\n if (deleteIndex > -1) {\n var rowHeadEle = tBodyHeadEle.children[rowIndex];\n var nextFocusCell = rowHeadEle &&\n rowHeadEle.children[(deleteIndex <= rowHeadEle.children.length - 1 ? deleteIndex : deleteIndex - 1)];\n if (nextFocusCell) {\n e.item.selection.setSelectionText(this.parent.currentDocument, nextFocusCell, nextFocusCell, 0, 0);\n nextFocusCell.classList.add('e-cell-select');\n }\n }\n }\n if (e.callBack) {\n var sContainer = this.parent.nodeSelection.getRange(this.parent.currentDocument).startContainer;\n if (sContainer.nodeName !== 'TD') {\n var startChildLength = this.parent.nodeSelection.getRange(this.parent.currentDocument).startOffset;\n var focusNode = sContainer.children[startChildLength];\n if (focusNode) {\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, focusNode, 0);\n }\n }\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.deleteRow = function (e) {\n var selectedCell = e.item.selection.range.startContainer;\n if (selectedCell.nodeType === 3) {\n selectedCell = closest(selectedCell.parentElement, 'td,th');\n }\n var colIndex = Array.prototype.indexOf.call(selectedCell.parentNode.childNodes, selectedCell);\n this.curTable = closest(selectedCell, 'table');\n var currentRow;\n var allCells = this.getCorrespondingColumns();\n var minMaxIndex = this.getSelectedCellMinMaxIndex(allCells);\n var maxI;\n var j;\n if (this.curTable.rows.length === 1) {\n e.item.selection.restore();\n detach(closest(selectedCell.parentElement, 'table'));\n }\n else {\n for (maxI = minMaxIndex.endRow; maxI >= minMaxIndex.startRow; maxI--) {\n currentRow = this.curTable.rows[maxI];\n for (j = 0; j < allCells[maxI].length; j++) {\n if (j === 0 || allCells[maxI][j] !== allCells[maxI][j - 1]) {\n if (1 < parseInt(allCells[maxI][j].getAttribute('rowspan'), 10)) {\n var rowSpanVal = parseInt(allCells[maxI][j].getAttribute('rowspan'), 10) - 1;\n /* eslint-disable */\n if (1 === rowSpanVal) {\n allCells[maxI][j].removeAttribute('rowspan');\n var cell = this.getMergedRow(this.getCorrespondingColumns())[j];\n if (cell) {\n var cloneNode = cell.cloneNode(true);\n cloneNode.innerHTML = '
    ';\n if (cell.parentElement) {\n cell.parentElement.insertBefore(cloneNode, cell);\n }\n }\n }\n else {\n allCells[maxI][j].setAttribute('rowspan', rowSpanVal.toString());\n }\n /* eslint-enable */\n }\n }\n // eslint-disable-next-line max-len\n if (maxI < allCells.length - 1 && allCells[maxI][j] === allCells[maxI + 1][j] && (0 === maxI ||\n allCells[maxI][j] !== allCells[maxI - 1][j])) {\n var element = allCells[maxI][j];\n var index = void 0;\n // eslint-disable-next-line max-len\n for (index = j; 0 < index && allCells[maxI][index] === allCells[maxI][index - 1]; index--) {\n if (index === 0) {\n this.curTable.rows[maxI + 1].prepend(element);\n }\n else {\n allCells[maxI + 1][index - 1].insertAdjacentElement('afterend', element);\n }\n }\n }\n }\n var deleteIndex = currentRow.rowIndex;\n this.curTable.deleteRow(deleteIndex);\n var focusTrEle = !isNOU(this.curTable.rows[deleteIndex]) ? this.curTable.querySelectorAll('tbody tr')[deleteIndex]\n : this.curTable.querySelectorAll('tbody tr')[deleteIndex - 1];\n var nextFocusCell = focusTrEle && focusTrEle.querySelectorAll('td')[colIndex];\n if (nextFocusCell) {\n e.item.selection.setSelectionText(this.parent.currentDocument, nextFocusCell, nextFocusCell, 0, 0);\n nextFocusCell.classList.add('e-cell-select');\n }\n else {\n e.item.selection.setSelectionText(this.parent.currentDocument, this.curTable.querySelector('td'), this.curTable.querySelector('td'), 0, 0);\n this.curTable.querySelector('td, th').classList.add('e-cell-select');\n }\n }\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.getMergedRow = function (cells) {\n var mergedRow;\n for (var i = 0; i < cells.length; i++) {\n if (cells[i].length !== this.curTable.rows[0].childNodes.length) {\n mergedRow = cells[i];\n }\n }\n return mergedRow;\n };\n TableCommand.prototype.removeTable = function (e) {\n var selectedCell = e.item.selection.range.startContainer;\n selectedCell = (selectedCell.nodeType === 3) ? selectedCell.parentNode : selectedCell;\n var selectedTable = closest(selectedCell.parentElement, 'table');\n if (selectedTable) {\n e.item.selection.restore();\n detach(selectedTable);\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.tableHeader = function (e) {\n var headerExit = false;\n var selectedCell = e.item.selection.range.startContainer;\n selectedCell = (selectedCell.nodeType === 3) ? selectedCell.parentNode : selectedCell;\n var table = closest(selectedCell.parentElement, 'table');\n [].slice.call(table.childNodes).forEach(function (el) {\n if (el.nodeName === 'THEAD') {\n headerExit = true;\n }\n });\n if (table && !headerExit) {\n var cellCount = table.querySelector('tr').childElementCount;\n var colSpanCount = 0;\n for (var i = 0; i < cellCount; i++) {\n colSpanCount = colSpanCount + (parseInt(table.querySelector('tr').children[i].getAttribute('colspan'), 10) || 1);\n }\n var header = table.createTHead();\n var row = header.insertRow(0);\n for (var j = 0; j < colSpanCount; j++) {\n var th = createElement('th');\n th.appendChild(createElement('br'));\n row.appendChild(th);\n }\n }\n else {\n table.deleteTHead();\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.tableVerticalAlign = function (e) {\n var value = '';\n switch (e.item.subCommand) {\n case 'AlignTop':\n value = 'top';\n break;\n case 'AlignMiddle':\n value = 'middle';\n break;\n case 'AlignBottom':\n value = 'bottom';\n break;\n }\n e.item.tableCell.style.verticalAlign = value;\n if (value && value !== '' && e.item.tableCell.getAttribute('valign')) {\n e.item.tableCell.removeAttribute('valign');\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.cellMerge = function (e) {\n if (isNOU(this.curTable)) {\n this.curTable = closest(this.parent.nodeSelection.range.startContainer.parentElement, 'table');\n }\n var selectedCells = this.curTable.querySelectorAll('.e-cell-select');\n if (selectedCells.length < 2) {\n return;\n }\n this.mergeCellContent();\n var minMaxIndexes = this.getSelectedMinMaxIndexes(this.getCorrespondingColumns());\n var firstCell = selectedCells[0];\n var rowSelectedCells = firstCell.parentElement.querySelectorAll('.e-cell-select');\n if (minMaxIndexes.startColumn < minMaxIndexes.endColumn) {\n firstCell.setAttribute('colspan', (minMaxIndexes.endColumn - minMaxIndexes.startColumn + 1).toString());\n }\n if (minMaxIndexes.startRow < minMaxIndexes.endRow) {\n firstCell.setAttribute('rowspan', (minMaxIndexes.endRow - minMaxIndexes.startRow + 1).toString());\n }\n var totalWidth = 0;\n var unit;\n for (var j = rowSelectedCells.length - 1; j >= 0; j--) {\n if (!isNOU(rowSelectedCells[j].style.width)\n && rowSelectedCells[j].style.width !== '') {\n if (!unit) {\n var match = rowSelectedCells[j].style.width.match(/^([\\d.]+)([a-z%]+)$/i);\n unit = match ? match[2] : '%';\n }\n totalWidth = totalWidth + parseFloat(rowSelectedCells[j].style.width);\n }\n else {\n totalWidth = totalWidth + ((rowSelectedCells[j].offsetWidth / this.curTable.offsetWidth) * 100);\n unit = '%';\n }\n }\n firstCell.style.width = totalWidth + unit;\n for (var i = 1; i <= selectedCells.length - 1; i++) {\n detach(selectedCells[i]);\n }\n for (var i = 0; i < this.curTable.rows.length; i++) {\n if (this.curTable.rows[i].innerHTML === '') {\n detach(this.curTable.rows[i]);\n }\n }\n this.updateRowSpanStyle(minMaxIndexes.startRow, minMaxIndexes.endRow, this.getCorrespondingColumns());\n this.updateColSpanStyle(minMaxIndexes.startColumn, minMaxIndexes.endColumn, this.getCorrespondingColumns());\n e.item.selection.setSelectionText(this.parent.currentDocument, e.item.selection.range.startContainer, e.item.selection.range.startContainer, 0, 0);\n if (this.parent.nodeSelection && firstCell) {\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, \n // eslint-disable-next-line\n firstCell, 0);\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.updateColSpanStyle = function (min, max, elements) {\n var colValue;\n var colIndex;\n var colMin;\n var index = 0;\n var attrValue;\n var count = 0;\n var eleArray = elements;\n //eslint-disable-next-line\n if (min < (max = Math.min(max, eleArray[0].length - 1))) {\n for (colIndex = min; colIndex <= max; colIndex++) {\n // eslint-disable-next-line\n if (!(min < colIndex && eleArray[0][colIndex] === eleArray[0][colIndex - 1]) && 1 < (index =\n Math.min(parseInt(eleArray[0][colIndex].getAttribute('colspan'), 10) || 1, max - min + 1)) &&\n eleArray[0][colIndex] === eleArray[0][colIndex + 1]) {\n for (count = index - 1, colValue = 1; colValue < eleArray.length; colValue++) {\n if (eleArray[colValue][colIndex] !== eleArray[colValue - 1][colIndex]) {\n /* eslint-disable */\n for (colMin = colIndex; colMin < colIndex + index; colMin++) {\n if (1 < (attrValue = parseInt(eleArray[colValue][colMin].getAttribute('colspan'), 10) || 1) &&\n eleArray[colValue][colMin] === eleArray[colValue][colMin + 1]) {\n colMin += count = Math.min(count, attrValue - 1);\n }\n else if (!(count = Math.max(0, count - 1))) {\n break;\n }\n /* eslint-enable */\n }\n }\n if (!count) {\n break;\n }\n }\n }\n }\n if (count) {\n this.updateCellAttribute(eleArray, count, 'colspan', 0, eleArray.length - 1, min, max);\n }\n }\n };\n TableCommand.prototype.updateRowSpanStyle = function (min, max, ele) {\n var rowValue;\n var colIndex;\n var rowMin;\n var index = 0;\n var attrValue;\n var count = 0;\n var eleArray = ele;\n // eslint-disable-next-line\n if (min < (max = Math.min(max, eleArray.length - 1))) {\n for (rowValue = min; rowValue <= max; rowValue++) {\n // eslint-disable-next-line\n if (!(min < rowValue && eleArray[rowValue][0] === eleArray[rowValue - 1][0])\n // eslint-disable-next-line no-cond-assign\n && eleArray[rowValue][0] && 1 < (index = Math.min(parseInt(eleArray[rowValue][0].getAttribute('rowspan'), 10) ||\n 1, max - min + 1)) && eleArray[rowValue][0] === eleArray[rowValue + 1][0]) {\n for (count = index - 1, colIndex = 1; colIndex < eleArray[0].length; colIndex++) {\n if (eleArray[rowValue][colIndex] !== eleArray[rowValue][colIndex - 1]) {\n for (rowMin = rowValue; rowMin < rowValue + index; rowMin++) {\n // eslint-disable-next-line\n if (1 < (attrValue = parseInt(eleArray[rowMin][colIndex].getAttribute('rowspan'), 10) || 1) && eleArray[rowMin][colIndex] === eleArray[rowMin + 1][colIndex]) {\n rowMin += count = Math.min(count, attrValue - 1);\n }\n // eslint-disable-next-line\n else if (!(count = Math.max(0, count - 1))) {\n break;\n }\n }\n if (!count) {\n break;\n }\n }\n }\n }\n }\n if (count) {\n this.updateCellAttribute(eleArray, count, 'rowspan', min, max, 0, eleArray[0].length - 1);\n }\n }\n };\n TableCommand.prototype.updateCellAttribute = function (elements, index, attr, min, max, firstIndex, length) {\n var rowIndex;\n var colIndex;\n var spanCount;\n for (rowIndex = min; rowIndex <= max; rowIndex++) {\n for (colIndex = firstIndex; colIndex <= length; colIndex++) {\n // eslint-disable-next-line\n min < rowIndex && elements[rowIndex][colIndex] === elements[rowIndex - 1][colIndex] ||\n firstIndex < colIndex && elements[rowIndex][colIndex] === elements[rowIndex][colIndex - 1] ||\n 1 < (spanCount = parseInt(elements[rowIndex][colIndex].getAttribute(attr), 10) || 1) &&\n // eslint-disable-next-line max-len\n (1 < spanCount - index ? elements[rowIndex][colIndex].setAttribute(attr, (spanCount - index).toString()) :\n elements[rowIndex][colIndex].removeAttribute(attr));\n }\n }\n };\n TableCommand.prototype.mergeCellContent = function () {\n var selectedCells = this.curTable.querySelectorAll('.e-cell-select');\n var innerHtml = selectedCells[0].innerHTML === '
    ' ? '' : selectedCells[0].innerHTML;\n for (var i = 1; i < selectedCells.length; i++) {\n if ('
    ' !== selectedCells[i].innerHTML) {\n innerHtml = innerHtml ? innerHtml + '
    ' + selectedCells[i].innerHTML : innerHtml + selectedCells[i].innerHTML;\n }\n }\n selectedCells[0].innerHTML = innerHtml;\n };\n TableCommand.prototype.getSelectedMinMaxIndexes = function (correspondingCells) {\n var selectedCells = this.curTable.querySelectorAll('.e-cell-select');\n if (0 < selectedCells.length) {\n var minRow = correspondingCells.length;\n var maxRow = 0;\n var minCol = correspondingCells[0].length;\n var maxCol = 0;\n for (var i = 0; i < selectedCells.length; i++) {\n var currentRowCol = this.getCorrespondingIndex(selectedCells[i], correspondingCells);\n var targetRowCol = this.FindIndex(currentRowCol[0], currentRowCol[1], correspondingCells);\n minRow = Math.min(currentRowCol[0], minRow);\n maxRow = Math.max(targetRowCol[0], maxRow);\n minCol = Math.min(currentRowCol[1], minCol);\n maxCol = Math.max(targetRowCol[1], maxCol);\n }\n return {\n startRow: minRow,\n endRow: maxRow,\n startColumn: minCol,\n endColumn: maxCol\n };\n }\n return null;\n };\n TableCommand.prototype.HorizontalSplit = function (e) {\n var selectedCell = e.item.selection.range.startContainer;\n this.curTable = closest(selectedCell.parentElement, 'table');\n if (this.curTable.querySelectorAll('.e-cell-select').length > 1) {\n return;\n }\n this.activeCell = this.curTable.querySelector('.e-cell-select');\n var newCell = this.activeCell.cloneNode(true);\n newCell.removeAttribute('class');\n newCell.innerHTML = '
    ';\n var activeCellIndex = this.getCorrespondingIndex(this.activeCell, this.getCorrespondingColumns());\n var correspondingCells = this.getCorrespondingColumns();\n var activeCellRowSpan = this.activeCell.getAttribute('rowspan') ? parseInt(this.activeCell.getAttribute('rowspan'), 10) : 1;\n if (activeCellRowSpan > 1) {\n var avgCount = Math.ceil(activeCellRowSpan / 2);\n // eslint-disable-next-line\n 1 < avgCount ? this.activeCell.setAttribute('rowspan', avgCount.toString()) :\n this.activeCell.removeAttribute('rowspan');\n // eslint-disable-next-line\n 1 < (activeCellRowSpan - avgCount) ? newCell.setAttribute('rowspan', (activeCellRowSpan - avgCount).toString()) : newCell.removeAttribute('rowspan');\n var avgRowIndex = void 0;\n var colIndex = void 0;\n for (avgRowIndex = activeCellIndex[0] + Math.ceil(activeCellRowSpan / 2),\n colIndex = 0 === activeCellIndex[1] ? activeCellIndex[1]\n : activeCellIndex[1] - 1; 0 <= colIndex && (correspondingCells[avgRowIndex][colIndex] ===\n // eslint-disable-next-line max-len\n correspondingCells[avgRowIndex][colIndex - 1] || 0 < avgRowIndex && correspondingCells[avgRowIndex][colIndex]\n === correspondingCells[avgRowIndex - 1][colIndex]);) {\n colIndex--;\n }\n if (colIndex === -1) {\n // eslint-disable-next-line\n this.curTable.rows[avgRowIndex].firstChild ? this.curTable.rows[avgRowIndex].prepend(newCell) : this.curTable.appendChild(newCell);\n }\n else {\n correspondingCells[avgRowIndex][colIndex].insertAdjacentElement('afterend', newCell);\n }\n }\n else {\n var newTrEle = createElement('tr');\n newTrEle.appendChild(newCell);\n var selectedRow = correspondingCells[activeCellIndex[0]];\n for (var j = 0; j <= selectedRow.length - 1; j++) {\n if (selectedRow[j] !== selectedRow[j - 1] && selectedRow[j] !== this.activeCell) {\n selectedRow[j].setAttribute('rowspan', ((parseInt(selectedRow[j].getAttribute('rowspan'), 10) ?\n parseInt(selectedRow[j].getAttribute('rowspan'), 10) : 1) + 1).toString());\n }\n }\n this.activeCell.parentNode.insertAdjacentElement('afterend', newTrEle);\n }\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.VerticalSplit = function (e) {\n var selectedCell = e.item.selection.range.startContainer;\n this.curTable = closest(selectedCell.parentElement, 'table');\n if (this.curTable.querySelectorAll('.e-cell-select').length > 1) {\n return;\n }\n this.activeCell = this.curTable.querySelector('.e-cell-select');\n var allRows = this.curTable.rows;\n var newCell = this.activeCell.cloneNode(true);\n newCell.removeAttribute('class');\n newCell.innerHTML = '
    ';\n var activeCellIndex = this.getCorrespondingIndex(this.activeCell, this.getCorrespondingColumns());\n var correspondingColumns = this.getCorrespondingColumns();\n var activeCellcolSpan = parseInt(this.activeCell.getAttribute('colspan'), 10) || 1;\n if (activeCellcolSpan > 1) {\n var colSpan = Math.ceil(activeCellcolSpan / 2);\n var getColSizes = this.getColSizes(this.curTable);\n var activeCellUpdatedWidth = this.getSplitColWidth(activeCellIndex[1], activeCellIndex[1] + colSpan - 1, getColSizes);\n var newCellWidth = this.getSplitColWidth(activeCellIndex[1] + colSpan, activeCellIndex[1] + activeCellcolSpan - 1, getColSizes);\n var activeCellWidth = this.convertPixelToPercentage(this.activeCell.offsetWidth, this.curTable.offsetWidth);\n newCellWidth = (activeCellWidth - activeCellUpdatedWidth) < newCellWidth ? (activeCellWidth - activeCellUpdatedWidth) : newCellWidth;\n 1 < colSpan ? this.activeCell.setAttribute('colspan', colSpan.toString()) : this.activeCell.removeAttribute('colspan');\n 1 < activeCellcolSpan - colSpan ? newCell.setAttribute('colspan', (activeCellcolSpan - colSpan).toString()) : newCell.removeAttribute('colspan');\n this.activeCell.style.width = activeCellUpdatedWidth + '%';\n newCell.style.width = newCellWidth + '%';\n }\n else {\n var avgWidth = parseFloat(this.activeCell.style.width) / 2;\n for (var i = 0; i <= allRows.length - 1; i++) {\n if (0 === i || correspondingColumns[i][activeCellIndex[1]] !== correspondingColumns[i - 1][activeCellIndex[1]]) {\n var currentCell = correspondingColumns[i][activeCellIndex[1]];\n if (currentCell !== this.activeCell) {\n currentCell.setAttribute('colspan', ((parseInt(currentCell.getAttribute('colspan'), 10) ?\n parseInt(currentCell.getAttribute('colspan'), 10) : 1) + 1).toString());\n }\n }\n }\n this.activeCell.style.width = avgWidth + '%';\n newCell.style.width = avgWidth + '%';\n }\n this.activeCell.parentNode.insertBefore(newCell, this.activeCell.nextSibling);\n if (e.callBack) {\n e.callBack({\n requestType: e.item.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n TableCommand.prototype.getSplitColWidth = function (startIndex, endInex, sizes) {\n var width = 0;\n for (var i = startIndex; i <= endInex; i++) {\n width += sizes[i];\n }\n return this.convertPixelToPercentage(width, this.curTable.offsetWidth);\n };\n TableCommand.prototype.getColSizes = function (curTable) {\n var cellColl = curTable.rows[0].cells;\n var cellCount = 0;\n for (var cell = 0; cell < cellColl.length; cell++) {\n cellCount = cellCount + cellColl[cell].colSpan;\n }\n var sizes = new Array(cellCount);\n var rowSpanCells = new Map();\n for (var i = 0; i < curTable.rows.length; i++) {\n var currentColIndex = 0;\n for (var k = 0; k < curTable.rows[i].cells.length; k++) {\n for (var l = 1; l < curTable.rows[i].cells[k].rowSpan; l++) {\n var key = \"\" + (i + l) + currentColIndex;\n rowSpanCells.set(key, curTable.rows[i].cells[k]);\n }\n var cellIndex = this.getCellIndex(rowSpanCells, i, k);\n if (cellIndex > currentColIndex) {\n currentColIndex = cellIndex;\n }\n var width = curTable.rows[i].cells[k].offsetWidth;\n if (!sizes[currentColIndex] || width < sizes[currentColIndex]) {\n sizes[currentColIndex] = width;\n }\n currentColIndex += 1 + curTable.rows[i].cells[k].colSpan - 1;\n }\n }\n return sizes;\n };\n TableCommand.prototype.getCellIndex = function (rowSpanCells, rowIndex, colIndex) {\n var cellKey = \"\" + rowIndex + colIndex;\n var spannedCell = rowSpanCells.get(cellKey);\n if (spannedCell) {\n return this.getCellIndex(rowSpanCells, rowIndex, colIndex + spannedCell.colSpan);\n }\n else {\n return colIndex;\n }\n };\n TableCommand.prototype.convertPixelToPercentage = function (value, offsetValue) {\n return (value / offsetValue) * 100;\n };\n TableCommand.prototype.getCorrespondingColumns = function () {\n var elementArray = [];\n // eslint-disable-next-line\n var _this = this;\n var colspan = 0;\n var allRows = _this.curTable.rows;\n for (var i = 0; i <= allRows.length - 1; i++) {\n var ele = allRows[i];\n var index = 0;\n for (var j = 0; j <= ele.children.length - 1; j++) {\n /* eslint-disable */\n var colEle = ele.children[j];\n for (var ele_1 = colEle, colspan_1 = parseInt(ele_1.getAttribute('colspan'), 10) || 1, rowSpan = parseInt(ele_1.getAttribute('rowspan'), 10) || 1, rowIndex = i; rowIndex < i + rowSpan; rowIndex++) {\n for (var colIndex = index; colIndex < index + colspan_1; colIndex++) {\n elementArray[rowIndex] || (elementArray[rowIndex] = []);\n elementArray[rowIndex][colIndex] ? index++ : elementArray[rowIndex][colIndex] = colEle;\n }\n }\n index += colspan;\n }\n /* eslint-enable */\n }\n return elementArray;\n };\n // eslint-disable-next-line\n TableCommand.prototype.FindIndex = function (rowIndex, columnIndex, cells) {\n var nextIndex;\n var nextCol;\n for (nextIndex = rowIndex + 1, nextCol = columnIndex + 1; nextIndex < cells.length;) {\n if (cells[nextIndex][columnIndex] !== cells[rowIndex][columnIndex]) {\n nextIndex--;\n break;\n }\n nextIndex++;\n }\n for (nextIndex === cells.length && nextIndex--; nextCol < cells[rowIndex].length;) {\n if (cells[rowIndex][nextCol] !== cells[rowIndex][columnIndex]) {\n nextCol--;\n break;\n }\n nextCol++;\n }\n return nextCol === cells[rowIndex].length && nextCol--,\n [\n nextIndex,\n nextCol\n ];\n };\n TableCommand.prototype.getCorrespondingIndex = function (cell, allCells) {\n //let value: RowCol = new RowCol();\n for (var i = 0; i < allCells.length; i++) {\n for (var j = 0; j < allCells[i].length; j++) {\n if (allCells[i][j] === cell) {\n return [i, j];\n }\n }\n }\n return [];\n };\n TableCommand.prototype.highlightCells = function (minRow, maxRow, minCol, maxCol, eleArray) {\n var j;\n var k;\n var startCell;\n var endCell;\n var minRowIndex = minRow;\n var maxRowIndex = maxRow;\n var minColIndex = minCol;\n var maxColIndex = maxCol;\n var minMaxValues = new MinMax();\n for (j = minRowIndex; j <= maxRowIndex; j++) {\n /* eslint-disable */\n if ((1 < (parseInt(eleArray[j][minColIndex].getAttribute('rowspan'), 10) || 1) ||\n 1 < (parseInt(eleArray[j][minColIndex].getAttribute('colspan'), 10) || 1)) &&\n (endCell = this.FindIndex((startCell = this.getCorrespondingIndex(eleArray[j][minColIndex], eleArray))[0], startCell[1], eleArray))) {\n minRowIndex = Math.min(startCell[0], minRowIndex);\n maxRowIndex = Math.max(endCell[0], maxRowIndex);\n minColIndex = Math.min(startCell[1], minColIndex);\n maxColIndex = Math.max(endCell[1], maxColIndex);\n }\n else if ((1 < (parseInt(eleArray[j][maxColIndex].getAttribute('rowspan'), 10) || 1) ||\n 1 < (parseInt(eleArray[j][maxColIndex].getAttribute('colspan'), 10) || 1)) &&\n (endCell = this.FindIndex((startCell = this.getCorrespondingIndex(eleArray[j][maxColIndex], eleArray))[0], startCell[1], eleArray))) {\n minRowIndex = Math.min(startCell[0], minRowIndex);\n maxRowIndex = Math.max(endCell[0], maxRowIndex);\n minColIndex = Math.min(startCell[1], minColIndex);\n maxColIndex = Math.max(endCell[1], maxColIndex);\n }\n for (k = minColIndex; k <= maxColIndex; k++) {\n if ((1 < (parseInt(eleArray[minRowIndex][k].getAttribute('rowspan'), 10) || 1) ||\n 1 < (parseInt(eleArray[minRowIndex][k].getAttribute('colspan'), 10) || 1)) &&\n (endCell = this.FindIndex((startCell = this.getCorrespondingIndex(eleArray[minRowIndex][k], eleArray))[0], startCell[1], eleArray))) {\n minRowIndex = Math.min(startCell[0], minRowIndex);\n maxRowIndex = Math.max(endCell[0], maxRowIndex);\n minColIndex = Math.min(startCell[1], minColIndex);\n maxColIndex = Math.max(endCell[1], maxColIndex);\n }\n else if ((1 < (parseInt(eleArray[maxRowIndex][k].getAttribute('rowspan'), 10) || 1) ||\n 1 < (parseInt(eleArray[maxRowIndex][k].getAttribute('colspan'), 10) || 1)) &&\n (endCell = this.FindIndex((startCell = this.getCorrespondingIndex(eleArray[maxRowIndex][k], eleArray))[0], startCell[1], eleArray))) {\n minRowIndex = Math.min(startCell[0], minRowIndex);\n maxRowIndex = Math.max(endCell[0], maxRowIndex);\n minColIndex = Math.min(startCell[1], minColIndex);\n maxColIndex = Math.max(endCell[1], maxColIndex);\n }\n }\n minMaxValues = minRowIndex === minRow && maxRowIndex === maxRow && minColIndex === minCol && maxColIndex === maxCol ? {\n startRow: minRow,\n endRow: maxRow,\n startColumn: minCol,\n endColumn: maxCol\n } : this.highlightCells(minRowIndex, maxRowIndex, minColIndex, maxColIndex, eleArray);\n }\n return minMaxValues;\n /* eslint-enable */\n };\n TableCommand.prototype.tableMove = function (e) {\n this.activeCell = e.selectNode[0];\n var target = e.event.target;\n var activeCellTag = this.activeCell.tagName;\n var targetCellTag = target.tagName;\n this.curTable = closest(target, 'table');\n if (this.curTable.querySelectorAll('.e-cell-select').length > 1) {\n this.parent.nodeSelection.Clear(this.parent.currentDocument);\n }\n if ((target.tagName !== 'TD' && target.tagName !== 'TH') && activeCellTag !== targetCellTag) {\n return;\n }\n var activeRowIndex = Array.prototype.slice.call((this.activeCell).parentElement.parentElement.children)\n .indexOf((this.activeCell).parentElement);\n var activeColumnIndex = Array.prototype.slice.call((this.activeCell).parentElement.children).indexOf(this.activeCell);\n var targetRowIndex = Array.prototype.slice.call(target.parentElement.parentElement.children)\n .indexOf(target.parentElement);\n var targetColumnIndex = Array.prototype.slice.call(target.parentElement.children).indexOf(target);\n var activeCellList = this.curTable.querySelectorAll('.e-cell-select');\n for (var i = activeCellList.length - 1; i >= 0; i--) {\n if (this.activeCell !== activeCellList[i]) {\n activeCellList[i].classList.remove('e-cell-select');\n }\n }\n if (activeRowIndex === targetRowIndex && activeColumnIndex === targetColumnIndex) {\n return;\n }\n var correspondingCells = this.getCorrespondingColumns();\n var activeIndexes = this.getCorrespondingIndex(this.activeCell, correspondingCells);\n var targetIndexes = this.getCorrespondingIndex(target, correspondingCells);\n var minMaxIndexes = this.highlightCells(Math.min(activeIndexes[0], targetIndexes[0]), Math.max(activeIndexes[0], \n /* eslint-disable */\n targetIndexes[0]), Math.min(activeIndexes[1], targetIndexes[1]), Math.max(activeIndexes[1], targetIndexes[1]), correspondingCells);\n for (var rowIndex = minMaxIndexes.startRow; rowIndex <= minMaxIndexes.endRow; rowIndex++) {\n for (var colIndex = minMaxIndexes.startColumn; colIndex <= minMaxIndexes.endColumn; colIndex++) {\n correspondingCells[rowIndex][colIndex].classList.add('e-cell-select');\n }\n }\n if (this.parent.nodeSelection.range) {\n this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, this.parent.nodeSelection.range.endContainer, this.parent.nodeSelection.range.endContainer, 0, 0);\n this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, this.parent.nodeSelection.range.endContainer, 0);\n }\n };\n ;\n return TableCommand;\n}());\nexport { TableCommand };\nvar MinMax = /** @class */ (function () {\n function MinMax() {\n }\n return MinMax;\n}());\n","/**\n * `Selection` module is used to handle RTE Selections.\n */\nimport { NodeSelection } from './../../selection/index';\nimport { NodeCutter } from './nodecutter';\nimport { InsertMethods } from './insert-methods';\nimport { IsFormatted } from './isformatted';\nimport { isIDevice, setEditFrameFocus } from '../../common/util';\nimport { isNullOrUndefined as isNOU, Browser, closest, detach } from '@syncfusion/ej2-base';\nimport { DOMNode } from './dom-node';\nvar SelectionCommands = /** @class */ (function () {\n function SelectionCommands() {\n }\n /**\n * applyFormat method\n *\n * @param {Document} docElement - specifies the document\n * @param {string} format - specifies the string value\n * @param {Node} endNode - specifies the end node\n * @param {string} enterAction - specifies the enter key action\n * @param {string} value - specifies the string value\n * @param {string} selector - specifies the string\n * @param {FormatPainterValue} painterValues specifies the element created and last child\n * @returns {void}\n * @hidden\n\n */\n SelectionCommands.applyFormat = function (docElement, format, endNode, enterAction, value, selector, painterValues) {\n this.enterAction = enterAction;\n var validFormats = ['bold', 'italic', 'underline', 'strikethrough', 'superscript',\n 'subscript', 'uppercase', 'lowercase', 'fontcolor', 'fontname', 'fontsize', 'backgroundcolor'];\n if (validFormats.indexOf(format) > -1 || value === 'formatPainter') {\n if (format === 'backgroundcolor' && value === '') {\n value = 'transparent';\n }\n var domSelection = new NodeSelection();\n var domNode = new DOMNode(endNode, docElement);\n var nodeCutter = new NodeCutter();\n var isFormatted = new IsFormatted();\n var range = domSelection.getRange(docElement);\n var currentAnchorNode = range.startContainer.parentElement;\n if (range.collapsed && !isNOU(currentAnchorNode) &&\n currentAnchorNode.tagName === 'A' &&\n (range.startOffset === currentAnchorNode.textContent.length || range.startOffset === 0)) {\n var emptyTextNode = document.createTextNode('');\n if (range.startOffset === 0) {\n currentAnchorNode.parentNode.insertBefore(emptyTextNode, currentAnchorNode);\n }\n else {\n if (!isNOU(currentAnchorNode.nextSibling)) {\n currentAnchorNode.parentElement.insertBefore(emptyTextNode, currentAnchorNode.nextSibling);\n }\n else {\n currentAnchorNode.parentNode.appendChild(emptyTextNode);\n }\n }\n // Set the range to the empty text node\n var newRange = docElement.createRange();\n range.setStart(emptyTextNode, 0);\n range.setEnd(emptyTextNode, 0);\n range.collapse(true);\n domSelection.setRange(docElement, newRange);\n }\n if (Browser.userAgent.indexOf('Firefox') !== -1 && range.startContainer === range.endContainer && !isNOU(endNode) && range.startContainer === endNode) {\n var startChildNodes = range.startContainer.childNodes;\n var startNode = ((startChildNodes[(range.startOffset > 0) ? (range.startOffset - 1) :\n range.startOffset]) || range.startContainer);\n var endNode_1 = (range.endContainer.childNodes[(range.endOffset > 0) ? (range.endOffset - 1) :\n range.endOffset] || range.endContainer);\n var lastSelectionNode = (endNode_1.lastChild.nodeName === 'BR' ? (isNOU(endNode_1.lastChild.previousSibling) ? endNode_1\n : endNode_1.lastChild.previousSibling) : endNode_1.firstChild);\n while (!isNOU(lastSelectionNode) && lastSelectionNode.nodeName !== '#text' && lastSelectionNode.nodeName !== 'IMG' &&\n lastSelectionNode.nodeName !== 'BR' && lastSelectionNode.nodeName !== 'HR') {\n lastSelectionNode = lastSelectionNode.lastChild;\n }\n ;\n domSelection.setSelectionText(docElement, startNode, lastSelectionNode, 0, 0);\n range = domSelection.getRange(docElement);\n }\n var save = domSelection.save(range, docElement);\n var nodes = range.collapsed ? domSelection.getSelectionNodeCollection(range) :\n domSelection.getSelectionNodeCollectionBr(range);\n var isCollapsed = false;\n var isFormat = false;\n var isCursor = false;\n var preventRestore = false;\n var isFontStyle = (['fontcolor', 'fontname', 'fontsize', 'backgroundcolor'].indexOf(format) > -1);\n if (range.collapsed) {\n var currentFormatNode = isFormatted.getFormattedNode(range.startContainer, format, endNode);\n var currentSelector = !isNOU(currentFormatNode) ?\n (currentFormatNode.getAttribute('style') === null ? currentFormatNode.nodeName :\n currentFormatNode.nodeName + '[style=\\'' + currentFormatNode.getAttribute('style') + '\\']') : null;\n if (nodes.length > 0) {\n isCollapsed = true;\n range = nodeCutter.GetCursorRange(docElement, range, nodes[0]);\n }\n else if (range.startContainer.nodeType === 3 && ((range.startContainer.parentElement.childElementCount > 0 &&\n range.startOffset > 0 && range.startContainer.parentElement.firstElementChild.tagName.toLowerCase() !== 'br') ||\n !isNOU(currentFormatNode) && currentFormatNode ===\n (range.startContainer.parentElement.closest(currentSelector)) &&\n ((range.startContainer.parentElement.closest(currentSelector)).textContent.replace(\n // eslint-disable-next-line\n new RegExp(String.fromCharCode(8203), 'g'), '').trim().length !== 0))) {\n isCollapsed = true;\n range = nodeCutter.GetCursorRange(docElement, range, range.startContainer);\n nodes.push(range.startContainer);\n }\n else {\n var cursorNode = this.insertCursorNode(docElement, domSelection, range, isFormatted, nodeCutter, format, value, endNode);\n domSelection.endContainer = domSelection.startContainer = domSelection.getNodeArray(cursorNode, true);\n var childNodes = cursorNode.nodeName === 'BR' && cursorNode.parentNode.childNodes;\n if (!isNOU(childNodes) && childNodes.length === 1 && childNodes[0].nodeName === 'BR' && nodes.length === 0) {\n domSelection.setSelectionText(docElement, range.startContainer, range.endContainer, 0, 0);\n preventRestore = true;\n }\n else {\n domSelection.endOffset = domSelection.startOffset = 1;\n }\n if (cursorNode.nodeName === 'BR' && cursorNode.parentNode.textContent.length === 0) {\n preventRestore = true;\n }\n }\n }\n isCursor = range.collapsed;\n var isSubSup = false;\n for (var index = 0; index < nodes.length; index++) {\n var formatNode = isFormatted.getFormattedNode(nodes[index], format, endNode);\n if (formatNode === null) {\n if (format === 'subscript') {\n formatNode = isFormatted.getFormattedNode(nodes[index], 'superscript', endNode);\n isSubSup = formatNode === null ? false : true;\n }\n else if (format === 'superscript') {\n formatNode = isFormatted.getFormattedNode(nodes[index], 'subscript', endNode);\n isSubSup = formatNode === null ? false : true;\n }\n }\n if (index === 0 && formatNode === null) {\n isFormat = true;\n }\n if (formatNode !== null && (!isFormat || isFontStyle)) {\n nodes[index] = this.removeFormat(nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, domSelection, endNode, domNode);\n }\n else {\n nodes[index] = this.insertFormat(docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, painterValues, domNode, endNode);\n }\n domSelection = this.applySelection(nodes, domSelection, nodeCutter, index, isCollapsed);\n }\n if (isIDevice()) {\n setEditFrameFocus(endNode, selector);\n }\n if (!preventRestore) {\n save.restore();\n }\n if (isSubSup) {\n this.applyFormat(docElement, format, endNode, enterAction);\n }\n }\n };\n SelectionCommands.insertCursorNode = function (docElement, domSelection, range, isFormatted, nodeCutter, format, value, endNode) {\n var cursorNodes = domSelection.getNodeCollection(range);\n var domNode = new DOMNode(endNode, docElement);\n var cursorFormat = (cursorNodes.length > 0) ?\n (cursorNodes.length > 1 && range.startContainer === range.endContainer) ?\n this.getCursorFormat(isFormatted, cursorNodes, format, endNode) :\n isFormatted.getFormattedNode(cursorNodes[0], format, endNode) : null;\n var cursorNode = null;\n if (cursorFormat) {\n cursorNode = cursorNodes[0];\n if (cursorFormat.firstChild.textContent.charCodeAt(0) === 8203 && cursorFormat.firstChild.nodeType === 3) {\n // eslint-disable-next-line\n var regEx = new RegExp(String.fromCharCode(8203), 'g');\n var emptySpaceNode = void 0;\n if (cursorFormat.firstChild === cursorNode) {\n cursorNode.textContent = (cursorFormat.parentElement && (domNode.isBlockNode(cursorFormat.parentElement) &&\n cursorFormat.parentElement.textContent.length <= 1 ? cursorFormat.parentElement.childElementCount > 1 :\n cursorFormat.childElementCount === 0) &&\n (cursorFormat.parentElement.textContent.length > 1 ||\n cursorFormat.parentElement.firstChild && cursorFormat.parentElement.firstChild.nodeType === 1) ?\n cursorNode.textContent : cursorNode.textContent.replace(regEx, ''));\n emptySpaceNode = cursorNode;\n }\n else {\n cursorFormat.firstChild.textContent = cursorFormat.firstChild.textContent.replace(regEx, '');\n emptySpaceNode = cursorFormat.firstChild;\n }\n var pointer = void 0;\n if (emptySpaceNode.textContent.length === 0) {\n if (!isNOU(emptySpaceNode.previousSibling)) {\n cursorNode = emptySpaceNode.previousSibling;\n pointer = emptySpaceNode.textContent.length - 1;\n domSelection.setCursorPoint(docElement, emptySpaceNode, pointer);\n }\n else if (!isNOU(emptySpaceNode.parentElement) && emptySpaceNode.parentElement.textContent.length === 0) {\n var brElem = document.createElement('BR');\n emptySpaceNode.parentElement.appendChild(brElem);\n detach(emptySpaceNode);\n cursorNode = brElem;\n domSelection.setCursorPoint(docElement, cursorNode.parentElement, 0);\n }\n }\n }\n if ((['fontcolor', 'fontname', 'fontsize', 'backgroundcolor'].indexOf(format) > -1)) {\n if (format === 'fontcolor') {\n cursorFormat.style.color = value;\n }\n else if (format === 'fontname') {\n cursorFormat.style.fontFamily = value;\n }\n else if (format === 'fontsize') {\n cursorFormat.style.fontSize = value;\n }\n else {\n cursorFormat.style.backgroundColor = value;\n }\n cursorNode = cursorFormat;\n }\n else {\n InsertMethods.unwrap(cursorFormat);\n }\n }\n else {\n if (cursorNodes.length > 1 && range.startOffset > 0 && (cursorNodes[0].firstElementChild &&\n cursorNodes[0].firstElementChild.tagName.toLowerCase() === 'br')) {\n cursorNodes[0].innerHTML = '';\n }\n if (cursorNodes.length === 1 && range.startOffset === 0 && (cursorNodes[0].nodeName === 'BR' || (isNOU(cursorNodes[0].nextSibling) ? false : cursorNodes[0].nextSibling.nodeName === 'BR'))) {\n detach(cursorNodes[0].nodeName === '#text' ? cursorNodes[0].nextSibling : cursorNodes[0]);\n }\n cursorNode = this.getInsertNode(docElement, range, format, value).firstChild;\n }\n return cursorNode;\n };\n SelectionCommands.getCursorFormat = function (isFormatted, cursorNodes, format, endNode) {\n var currentNode;\n for (var index = 0; index < cursorNodes.length; index++) {\n currentNode = cursorNodes[index].lastElementChild ?\n cursorNodes[index].lastElementChild : cursorNodes[index];\n }\n return isFormatted.getFormattedNode(currentNode, format, endNode);\n };\n SelectionCommands.removeFormat = function (nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, domSelection, endNode, domNode) {\n var splitNode = null;\n var startText = range.startContainer.nodeName === '#text' ?\n range.startContainer.textContent.substring(range.startOffset, range.startContainer.textContent.length) :\n range.startContainer.textContent;\n var nodeText = nodes[index].textContent;\n if (!(range.startContainer === range.endContainer && range.startOffset === 0\n && range.endOffset === range.startContainer.length)) {\n var nodeIndex = [];\n var cloneNode = nodes[index];\n var clonedElement = cloneNode;\n do {\n nodeIndex.push(domSelection.getIndex(cloneNode));\n cloneNode = cloneNode.parentNode;\n } while (cloneNode && (cloneNode !== formatNode));\n if (nodes[index].nodeName !== 'BR') {\n if (clonedElement.nodeName === '#text' && clonedElement.textContent.includes('\\u200B')) {\n clonedElement.remove();\n }\n cloneNode = splitNode = (isCursor && (formatNode.textContent.length - 1) === range.startOffset) ?\n nodeCutter.SplitNode(range, formatNode, true)\n : nodeCutter.GetSpliceNode(range, formatNode);\n }\n if (!isCursor) {\n while (cloneNode && cloneNode.childNodes.length > 0 && ((nodeIndex.length - 1) >= 0)\n && (cloneNode.childNodes.length > nodeIndex[nodeIndex.length - 1])) {\n cloneNode = cloneNode.childNodes[nodeIndex[nodeIndex.length - 1]];\n nodeIndex.pop();\n }\n if (nodes[index].nodeName !== 'BR') {\n if (cloneNode.nodeType === 3 && !(isCursor && cloneNode.nodeValue === '')) {\n nodes[index] = cloneNode;\n }\n else {\n var divNode = document.createElement('div');\n divNode.innerHTML = '​';\n if (cloneNode.nodeType !== 3) {\n cloneNode.insertBefore(divNode.firstChild, cloneNode.firstChild);\n nodes[index] = cloneNode.firstChild;\n }\n else {\n cloneNode.parentNode.insertBefore(divNode.firstChild, cloneNode);\n nodes[index] = cloneNode.previousSibling;\n cloneNode.parentNode.removeChild(cloneNode);\n }\n }\n }\n }\n else {\n var lastNode = splitNode;\n for (; lastNode.firstChild !== null && lastNode.firstChild.nodeType !== 3; null) {\n lastNode = lastNode.firstChild;\n }\n lastNode.innerHTML = '​';\n nodes[index] = lastNode.firstChild;\n }\n }\n else if (isFontStyle && !nodes[index].contains(formatNode) && nodes[index].nodeType === 3 &&\n nodes[index].textContent !== formatNode.textContent) {\n // If the selection is within the format node .\n var isFullNodeSelected = nodes[index].textContent === nodes[index].wholeText;\n var nodeTraverse = nodes[index];\n var styleElement = this.GetFormatNode(format, value);\n // while loop and traverse back until text content does not match with parent text content\n while (nodeTraverse && nodeTraverse.textContent === nodeTraverse.parentElement.textContent) {\n nodeTraverse = nodeTraverse.parentElement;\n }\n if (isFullNodeSelected && formatNode.textContent !== nodeTraverse.textContent) {\n var nodeArray = [];\n var priorityNode = this.getPriorityFormatNode(nodeTraverse, endNode);\n if (priorityNode && priorityNode.textContent === nodeTraverse.textContent) {\n nodeTraverse = priorityNode;\n }\n nodeArray.push(nodeTraverse);\n this.applyStyles(nodeArray, 0, styleElement);\n return nodes[index];\n }\n }\n var fontStyle;\n if (format === 'backgroundcolor') {\n fontStyle = formatNode.style.fontSize;\n }\n var bgStyle;\n if (format === 'fontsize') {\n var bg = closest(nodes[index].parentElement, 'span[style*=' + 'background-color' + ']');\n if (!isNOU(bg)) {\n bgStyle = bg.style.backgroundColor;\n }\n }\n var formatNodeStyles = formatNode.getAttribute('style');\n var formatNodeTagName = formatNode.tagName;\n var child;\n if (formatNodeTagName === 'A' && format === 'underline') {\n formatNode.style.textDecoration = 'none';\n child = [formatNode];\n }\n else if (IsFormatted.inlineTags.indexOf(formatNodeTagName.toLowerCase()) !== -1 && isFontStyle && formatNodeTagName.toLocaleLowerCase() !== 'span') {\n var fontNodeStyle = formatNode.style;\n if (fontNodeStyle.color && format === 'fontcolor') {\n if (formatNode.nodeName === 'A') {\n fontNodeStyle.color = value;\n }\n else {\n fontNodeStyle.color = '';\n }\n }\n else if (fontNodeStyle.backgroundColor && format === 'backgroundcolor') {\n fontNodeStyle.backgroundColor = '';\n }\n else if (fontNodeStyle.fontSize && format === 'fontsize') {\n fontNodeStyle.fontSize = '';\n }\n else if (fontNodeStyle.fontFamily && format === 'fontname') {\n fontNodeStyle.fontFamily = '';\n }\n if (formatNode.getAttribute(\"style\") === '') {\n formatNode.removeAttribute(\"style\");\n }\n child = [formatNode];\n }\n else {\n child = InsertMethods.unwrap(formatNode);\n var liElement = nodes[index].parentElement;\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() !== 'li') {\n liElement = closest(liElement, 'li');\n }\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&\n liElement.textContent.trim() === nodes[index].textContent.trim()) {\n if (format === 'bold') {\n liElement.style.fontWeight = 'normal';\n }\n else if (format === \"italic\") {\n liElement.style.fontStyle = 'normal';\n }\n }\n else if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'\n && liElement.textContent.trim() !== nodes[index].textContent.trim()) {\n SelectionCommands.conCatenateTextNode(liElement, format, '', 'normal');\n }\n }\n if (child[0] && !isFontStyle) {\n var nodeTraverse = child[index] ? child[index] : child[0];\n var textNode = nodeTraverse;\n for (; nodeTraverse && nodeTraverse.parentElement && nodeTraverse.parentElement !== endNode; \n // eslint-disable-next-line\n nodeTraverse = nodeTraverse) {\n var nodeTraverseCondition = void 0;\n if (formatNode.nodeName === 'SPAN') {\n nodeTraverseCondition = nodeTraverse.parentElement.tagName.toLocaleLowerCase()\n === formatNode.tagName.toLocaleLowerCase() && nodeTraverse.parentElement.getAttribute('style') === formatNodeStyles;\n }\n else {\n nodeTraverseCondition = nodeTraverse.parentElement.tagName.toLocaleLowerCase()\n === formatNode.tagName.toLocaleLowerCase();\n }\n if (nodeTraverse.parentElement && nodeTraverseCondition &&\n (nodeTraverse.parentElement.childElementCount > 1 || range.startOffset > 1)) {\n if (textNode.parentElement && textNode.parentElement.tagName.toLocaleLowerCase()\n === formatNode.tagName.toLocaleLowerCase()) {\n if ((range.startOffset === range.endOffset) && textNode.nodeType !== 1 &&\n !isNOU(textNode.textContent) && textNode.parentElement.childElementCount > 1) {\n range.setStart(textNode, 0);\n range.setEnd(textNode, textNode.textContent.length);\n nodeCutter.SplitNode(range, textNode.parentElement, false);\n }\n }\n if (nodeTraverse.parentElement.tagName.toLocaleLowerCase() === 'span') {\n if (formatNode.style.textDecoration === 'underline' &&\n nodeTraverse.parentElement.style.textDecoration !== 'underline') {\n nodeTraverse = nodeTraverse.parentElement;\n continue;\n }\n }\n InsertMethods.unwrap(nodeTraverse.parentElement);\n nodeTraverse = !isNOU(nodeTraverse.parentElement) && !domNode.isBlockNode(nodeTraverse.parentElement) ? textNode :\n nodeTraverse.parentElement;\n }\n else {\n nodeTraverse = nodeTraverse.parentElement;\n }\n }\n }\n if (child.length > 0 && isFontStyle) {\n for (var num = 0; num < child.length; num++) {\n if (child[num].nodeType !== 3 || (child[num].textContent &&\n child[num].textContent.trim().length > 0)) {\n child[num] = InsertMethods.Wrap(child[num], this.GetFormatNode(format, value, formatNodeTagName, formatNodeStyles));\n var liElement = nodes[index].parentElement;\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() !== 'li') {\n liElement = closest(liElement, 'li');\n }\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&\n liElement.textContent.trim() === nodes[index].textContent.trim()) {\n if (format === 'fontname') {\n liElement.style.fontFamily = value;\n }\n }\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'\n && liElement.textContent.trim() !== nodes[index].textContent.trim()) {\n SelectionCommands.conCatenateTextNode(liElement, format, liElement.textContent, format, value);\n }\n if (child[num].textContent === startText) {\n if (num === 0) {\n range.setStartBefore(child[num]);\n }\n else if (num === child.length - 1) {\n range.setEndAfter(child[num]);\n }\n }\n }\n }\n var currentNodeElem = nodes[index].parentElement;\n if (!isNOU(fontStyle) && fontStyle !== '') {\n currentNodeElem.style.fontSize = fontStyle;\n }\n if (!isNOU(bgStyle) && bgStyle !== '') {\n currentNodeElem.style.backgroundColor = bgStyle;\n }\n if ((format === 'backgroundcolor' && !isNOU(fontStyle) && fontStyle !== '') &&\n currentNodeElem.parentElement.innerHTML === currentNodeElem.outerHTML) {\n var curParentElem = currentNodeElem.parentElement;\n curParentElem.parentElement.insertBefore(currentNodeElem, curParentElem);\n detach(curParentElem);\n }\n if (format === 'fontsize' || format === 'fontcolor') {\n var liElement = nodes[index].parentElement;\n var parentElement = nodes[index].parentElement;\n while (!isNOU(parentElement) && parentElement.tagName.toLowerCase() !== 'li') {\n parentElement = parentElement.parentElement;\n liElement = parentElement;\n }\n var num = index;\n var liChildContent = '';\n /* eslint-disable security/detect-object-injection */\n while (num >= 0 && !isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' && liElement.contains(nodes[num]) &&\n liElement.textContent.replace('/\\u200B/g', '').trim().includes(nodes[num].textContent.trim())) {\n /* eslint-enable security/detect-object-injection */\n liChildContent = ' ' + nodes[num].textContent.trim() + liChildContent;\n num--;\n }\n var isNestedList = false;\n var nestedListCount = 0;\n var isNestedListItem = false;\n if (!isNOU(liElement) && liElement.childNodes) {\n for (var num_1 = 0; num_1 < liElement.childNodes.length; num_1++) {\n if (liElement.childNodes[num_1].nodeName === ('OL' || 'UL')) {\n nestedListCount++;\n isNestedList = true;\n }\n }\n }\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&\n liElement.textContent.split('\\u200B').join('').trim() === liChildContent.split('\\u200B').join('').trim()) {\n if (format === 'fontsize') {\n liElement.style.fontSize = value;\n }\n else {\n liElement.style.color = value;\n liElement.style.textDecoration = 'inherit';\n }\n }\n else if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' && isNestedList) {\n if (isNestedList && nestedListCount > 0) {\n for (var num_2 = 0; num_2 < liElement.childNodes.length; num_2++) {\n if (nodes[index].textContent === liElement.childNodes[num_2].textContent && nodes[index].textContent === nodeText && liElement.textContent.replace('/\\u200B/g', '').trim().includes(liChildContent.split('\\u200B').join('').trim())) {\n isNestedListItem = true;\n }\n }\n }\n if (isNestedListItem) {\n for (var num_3 = 0; num_3 < liElement.childNodes.length; num_3++) {\n if (liElement.childNodes[num_3].nodeName === ('OL' || 'UL')) {\n liElement.childNodes[num_3].style.fontSize = 'initial';\n }\n }\n if (format === 'fontsize') {\n liElement.style.fontSize = value;\n }\n else {\n liElement.style.color = value;\n liElement.style.textDecoration = 'inherit';\n }\n }\n }\n }\n }\n return nodes[index];\n };\n SelectionCommands.insertFormat = function (docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, painterValues, domNode, endNode) {\n if (!isCursor) {\n if ((formatNode === null && isFormat) || isFontStyle) {\n if (nodes[index].nodeName !== 'BR') {\n nodes[index] = nodeCutter.GetSpliceNode(range, nodes[index]);\n nodes[index].textContent = nodeCutter.TrimLineBreak(nodes[index].textContent);\n }\n if (format === 'uppercase' || format === 'lowercase') {\n nodes[index].textContent = (format === 'uppercase') ? nodes[index].textContent.toLocaleUpperCase()\n : nodes[index].textContent.toLocaleLowerCase();\n }\n else if (!(isFontStyle === true && value === '')) {\n var element = this.GetFormatNode(format, value);\n if (value === 'formatPainter' || isFontStyle) {\n var liElement = nodes[index].parentElement;\n var parentElement = nodes[index].parentElement;\n while (!isNOU(parentElement) && parentElement.tagName.toLowerCase() !== 'li') {\n parentElement = parentElement.parentElement;\n liElement = parentElement;\n }\n if (format === 'fontcolor' || format === 'fontname' || format === 'fontsize') {\n var parentElem = nodes[index].parentElement;\n if (!isNOU(parentElem) && parentElem.childNodes) {\n for (var i = 0; i < parentElem.childNodes.length; i++) {\n if (this.concatenateTextExcludingList(nodes, index) === nodes[index].textContent) {\n var liElement_1 = void 0;\n if (parentElem.tagName === 'LI') {\n liElement_1 = parentElem;\n }\n else if (parentElem.closest('li')) {\n liElement_1 = parentElem.closest('li');\n }\n if (!isNOU(liElement_1)) {\n switch (format) {\n case 'fontcolor':\n liElement_1.style.color = value;\n break;\n case 'fontname':\n liElement_1.style.fontFamily = value;\n break;\n case 'fontsize':\n liElement_1.style.fontSize = value;\n break;\n default:\n break;\n }\n }\n }\n // eslint-disable-next-line\n var childElement = parentElem.childNodes[i];\n if (childElement.tagName === 'OL' || childElement.tagName === 'UL') {\n switch (format) {\n case 'fontcolor':\n childElement.style.color = 'initial';\n break;\n case 'fontname':\n childElement.style.fontFamily = 'initial';\n break;\n case 'fontsize':\n childElement.style.fontSize = 'initial';\n break;\n default:\n break;\n }\n }\n }\n }\n }\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&\n liElement.textContent.trim() === nodes[index].textContent.trim()) {\n if (format === 'fontsize') {\n liElement.style.fontSize = value;\n }\n else if (format === 'fontcolor') {\n liElement.style.color = value;\n liElement.style.textDecoration = 'inherit';\n }\n else if (format === 'fontname') {\n liElement.style.fontFamily = value;\n }\n }\n if (value === 'formatPainter') {\n return this.insertFormatPainterElem(nodes, index, range, nodeCutter, painterValues, domNode);\n }\n var currentNode = nodes[index];\n var priorityNode = this.getPriorityFormatNode(currentNode, endNode);\n // 1. Checking is there any priority node present in the selection range. (Use case for nested styles);\n // 2 Or font style is applied. (Use case not a nested style)\n if (!isNOU(priorityNode) || isFontStyle) {\n var currentFormatNode = isNOU(priorityNode) ? currentNode : priorityNode;\n currentFormatNode = !isNOU(priorityNode) && priorityNode.style.fontSize !== '' ?\n currentFormatNode.firstChild : currentFormatNode;\n if (isNOU(priorityNode) || format === 'fontsize') {\n while (currentFormatNode) {\n var isSameTextContent = currentFormatNode.parentElement.textContent.trim()\n === nodes[index].textContent.trim();\n var parent_1 = currentFormatNode.parentElement;\n if (!domNode.isBlockNode(parent_1) && isSameTextContent &&\n !(parent_1.nodeName === 'SPAN' && parent_1.classList.contains('e-img-inner'))) {\n currentFormatNode = parent_1;\n }\n else {\n break;\n }\n }\n }\n var nodeList = [];\n // Since color is different for different themnes, we need to wrap the fontColor over the text node.\n if (format === 'fontcolor') {\n var closestAnchor = closest(nodes[index].parentElement, 'A');\n if (!isNOU(closestAnchor) && closestAnchor.firstChild.textContent.trim()\n === nodes[index].textContent.trim()) {\n currentFormatNode = nodes[index];\n }\n }\n if (nodes[index].textContent.trim() !== currentFormatNode.textContent.trim()) {\n currentFormatNode = nodes[index];\n }\n nodeList[0] = currentFormatNode;\n this.applyStyles(nodeList, 0, element);\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'\n && liElement.textContent.trim() !== nodes[index].textContent.trim()) {\n SelectionCommands.conCatenateTextNode(liElement, format, liElement.textContent, format, value);\n }\n }\n else {\n nodes[index] = this.applyStyles(nodes, index, element);\n }\n }\n else {\n nodes[index] = this.applyStyles(nodes, index, element);\n var liElement = nodes[index].parentElement;\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() !== 'li') {\n liElement = closest(liElement, 'li');\n }\n if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li' &&\n liElement.textContent.trim() === nodes[index].textContent.trim()) {\n if (format === 'bold') {\n liElement.style.fontWeight = 'bold';\n }\n else if (format === \"italic\") {\n liElement.style.fontStyle = 'italic';\n }\n }\n else if (!isNOU(liElement) && liElement.tagName.toLowerCase() === 'li'\n && liElement.textContent.trim() !== nodes[index].textContent.trim()) {\n SelectionCommands.conCatenateTextNode(liElement, format, liElement.textContent, format);\n }\n }\n }\n }\n else {\n nodes[index] = nodeCutter.GetSpliceNode(range, nodes[index]);\n }\n }\n else {\n if (format !== 'uppercase' && format !== 'lowercase') {\n var element = this.getInsertNode(docElement, range, format, value);\n nodes[index] = element.firstChild;\n nodeCutter.position = 1;\n }\n else {\n nodeCutter.position = range.startOffset;\n }\n }\n return nodes[index];\n };\n SelectionCommands.applyStyles = function (nodes, index, element) {\n if (!(nodes[index].nodeName === 'BR' && this.enterAction === 'BR')) {\n nodes[index] = (index === (nodes.length - 1)) || nodes[index].nodeName === 'BR' ?\n InsertMethods.Wrap(nodes[index], element)\n : InsertMethods.WrapBefore(nodes[index], element, true);\n nodes[index] = this.getChildNode(nodes[index], element);\n }\n return nodes[index];\n };\n SelectionCommands.getPriorityFormatNode = function (node, endNode) {\n var isFormatted = new IsFormatted();\n var fontSizeNode = isFormatted.getFormattedNode(node, 'fontsize', endNode);\n var fontColorNode;\n var backgroundColorNode;\n var fontNameNode;\n if (isNOU(fontSizeNode)) {\n backgroundColorNode = isFormatted.getFormattedNode(node, 'backgroundcolor', endNode);\n if (isNOU(backgroundColorNode)) {\n fontNameNode = isFormatted.getFormattedNode(node, 'fontname', endNode);\n if (isNOU(fontNameNode)) {\n fontColorNode = isFormatted.getFormattedNode(node, 'fontcolor', endNode);\n if (isNOU(fontColorNode)) {\n return null;\n }\n else {\n return fontColorNode;\n }\n }\n else {\n return fontNameNode;\n }\n }\n else {\n return backgroundColorNode;\n }\n }\n else {\n return fontSizeNode;\n }\n };\n SelectionCommands.getInsertNode = function (docElement, range, format, value) {\n var element = this.GetFormatNode(format, value);\n element.innerHTML = '​';\n if (Browser.isIE) {\n var frag = docElement.createDocumentFragment();\n frag.appendChild(element);\n range.insertNode(frag);\n }\n else {\n range.insertNode(element);\n }\n return element;\n };\n SelectionCommands.getChildNode = function (node, element) {\n if (node === undefined || node === null) {\n element.innerHTML = '​';\n node = element.firstChild;\n }\n return node;\n };\n SelectionCommands.applySelection = function (nodes, domSelection, nodeCutter, index, isCollapsed) {\n if (nodes.length === 1 && !isCollapsed) {\n domSelection.startContainer = domSelection.getNodeArray(nodes[index], true);\n domSelection.endContainer = domSelection.startContainer;\n domSelection.startOffset = 0;\n domSelection.endOffset = nodes[index].textContent.length;\n }\n else if (nodes.length === 1 && isCollapsed) {\n domSelection.startContainer = domSelection.getNodeArray(nodes[index], true);\n domSelection.endContainer = domSelection.startContainer;\n domSelection.startOffset = nodeCutter.position;\n domSelection.endOffset = nodeCutter.position;\n }\n else if (index === 0) {\n domSelection.startContainer = domSelection.getNodeArray(nodes[index], true);\n domSelection.startOffset = 0;\n }\n else if (index === nodes.length - 1) {\n domSelection.endContainer = domSelection.getNodeArray(nodes[index], false);\n domSelection.endOffset = nodes[index].textContent.length;\n }\n return domSelection;\n };\n SelectionCommands.GetFormatNode = function (format, value, tagName, styles) {\n var node;\n switch (format) {\n case 'bold':\n return document.createElement('strong');\n case 'italic':\n return document.createElement('em');\n case 'underline':\n node = document.createElement('span');\n this.updateStyles(node, tagName, styles);\n node.style.textDecoration = 'underline';\n return node;\n case 'strikethrough':\n node = document.createElement('span');\n this.updateStyles(node, tagName, styles);\n node.style.textDecoration = 'line-through';\n return node;\n case 'superscript':\n return document.createElement('sup');\n case 'subscript':\n return document.createElement('sub');\n case 'fontcolor':\n node = document.createElement('span');\n this.updateStyles(node, tagName, styles);\n node.style.color = value;\n node.style.textDecoration = 'inherit';\n return node;\n case 'fontname':\n node = document.createElement('span');\n this.updateStyles(node, tagName, styles);\n node.style.fontFamily = value;\n return node;\n case 'fontsize':\n node = document.createElement('span');\n this.updateStyles(node, tagName, styles);\n node.style.fontSize = value;\n return node;\n default:\n node = document.createElement('span');\n this.updateStyles(node, tagName, styles);\n node.style.backgroundColor = value;\n return node;\n }\n };\n SelectionCommands.updateStyles = function (ele, tag, styles) {\n if (styles !== null && tag === 'SPAN') {\n ele.setAttribute('style', styles);\n }\n };\n // Below function is used to insert the element created by the format painter plugin.\n SelectionCommands.insertFormatPainterElem = function (nodes, index, range, nodeCutter, painterValues, domNode) {\n var parent = !domNode.isBlockNode(nodes[index].parentElement) ?\n nodes[index].parentElement : nodes[index];\n if (!domNode.isBlockNode(parent)) {\n while (parent.textContent.trim() === parent.parentElement.textContent.trim() && !domNode.isBlockNode(parent.parentElement)) {\n parent = parent.parentElement;\n }\n }\n // The below code is used to remove the already present inline style from the text node.\n if (!isNOU(parent) && parent.nodeType === 1 && !(parent.classList.contains('e-rte-img-caption') || parent.classList.contains('e-img-inner'))) {\n this.formatPainterCleanup(index, nodes, parent, range, nodeCutter, domNode);\n }\n var elem = painterValues.element;\n // The below code is used to apply the inline format copied.\n if (!isNOU(elem)) {\n // Step 1: Cloning the element that is created by format painter.\n // Step 2: Finding the last child of the nested elememt using the paintervalues.lastchild nodename\n // Step 3: Assigning the nodes[index] text content to the last child element.\n // Step 4: Wrapping the cloned element with the nodes[index]\n var clonedElement = elem.cloneNode(true);\n var elemList = clonedElement.querySelectorAll(painterValues.lastChild.nodeName);\n var lastElement = void 0;\n if (elemList.length > 0) {\n lastElement = elemList[elemList.length - 1];\n }\n else {\n if (!isNOU(clonedElement) && clonedElement.nodeName === painterValues.lastChild.nodeName) {\n lastElement = clonedElement;\n }\n }\n lastElement.textContent = nodes[index].textContent;\n var lastChild = lastElement.childNodes[0];\n nodes[index] = InsertMethods.Wrap(nodes[index], clonedElement);\n nodes[index].textContent = '';\n nodes[index] = lastChild;\n }\n return nodes[index];\n };\n SelectionCommands.formatPainterCleanup = function (index, nodes, parent, range, nodeCutter, domNode) {\n var INVALID_TAGS = ['A', 'AUDIO', 'IMG', 'VIDEO', 'IFRAME'];\n if (index === 0 && parent.textContent.trim() !== nodes[index].textContent.trim()) {\n nodeCutter.SplitNode(range, parent, true);\n var childELemList = nodes[index].parentElement.childNodes;\n for (var i = 0; i < childELemList.length; i++) {\n if (childELemList[i].textContent.trim() === nodes[i].textContent.trim()) {\n parent.parentNode.insertBefore(childELemList[i], parent);\n break;\n }\n }\n var blockChildNodes = parent.parentElement.childNodes;\n for (var k = 0; k < blockChildNodes.length; k++) {\n if ((blockChildNodes[k].textContent.trim() === '' || blockChildNodes[k].textContent.length === 0) &&\n blockChildNodes[k].textContent.charCodeAt(0) !== 160) {\n // 160 is the char code for  \n detach(blockChildNodes[k]);\n }\n }\n }\n else if (parent.textContent.trim() !== nodes[index].textContent.trim()) {\n parent.parentElement.insertBefore(nodes[index], parent);\n }\n else {\n while (!isNOU(parent) && parent.nodeType !== 3 && !domNode.isBlockNode(parent)) {\n var temp = void 0;\n for (var i = 0; i < parent.childNodes.length; i++) {\n var currentChild = parent.childNodes[i];\n if (currentChild.textContent.trim().length !== 0 && currentChild.nodeType !== 3) {\n temp = parent.childNodes[i];\n }\n }\n if (INVALID_TAGS.indexOf(parent.tagName) === -1) {\n InsertMethods.unwrap(parent);\n }\n parent = temp;\n }\n }\n };\n SelectionCommands.concatenateTextExcludingList = function (nodes, index) {\n var result = '';\n var parentNode = nodes[index].parentElement;\n for (var i = 0; i < parentNode.childNodes.length; i++) {\n // eslint-disable-next-line\n var childNode = parentNode.childNodes[i];\n if ((childNode.nodeType === 3) || (childNode.nodeType === 1 && (childNode.tagName !== 'OL' && childNode.tagName !== 'UL'))) {\n result += childNode.textContent;\n }\n }\n return result;\n };\n SelectionCommands.conCatenateTextNode = function (liElement, format, value, formatStr, constVal) {\n var result = '';\n switch (format) {\n case 'bold':\n liElement.querySelectorAll('strong').forEach(function (e) {\n result = result + e.textContent;\n });\n if (result === value) {\n liElement.style.fontWeight = formatStr;\n }\n break;\n case 'italic':\n liElement.querySelectorAll('em').forEach(function (e) {\n result = result + e.textContent;\n });\n if (result === value) {\n liElement.style.fontStyle = formatStr;\n }\n break;\n case 'fontcolor':\n var colorStyle_1 = '';\n liElement.querySelectorAll('span').forEach(function (span) {\n colorStyle_1 = span.style.color;\n if (colorStyle_1 === constVal) {\n result = result + span.textContent;\n }\n });\n if (result === value) {\n liElement.style.color = colorStyle_1;\n liElement.style.textDecoration = 'inherit';\n }\n break;\n case 'fontsize':\n var fontSize_1 = '';\n liElement.querySelectorAll('span').forEach(function (span) {\n fontSize_1 = span.style.getPropertyValue('font-size');\n if (fontSize_1 === constVal) {\n result = result + span.textContent;\n }\n });\n if (result === value) {\n liElement.style.fontSize = fontSize_1;\n }\n break;\n case 'fontname':\n var fontFamily_1 = '';\n liElement.querySelectorAll('span').forEach(function (span) {\n fontFamily_1 = span.style.getPropertyValue('font-family');\n if (fontFamily_1 === constVal) {\n result = result + span.textContent;\n }\n });\n if (result === value) {\n liElement.style.fontFamily = fontFamily_1;\n }\n break;\n }\n };\n SelectionCommands.enterAction = 'P';\n return SelectionCommands;\n}());\nexport { SelectionCommands };\n","import * as CONSTANT from './../base/constant';\nimport { SelectionCommands } from './selection-commands';\nimport * as EVENTS from './../../common/constant';\n/**\n * Selection EXEC internal component\n *\n * @hidden\n\n */\nvar SelectionBasedExec = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function SelectionBasedExec(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n SelectionBasedExec.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.SELECTION_TYPE, this.applySelection, this);\n this.parent.observer.on(EVENTS.KEY_DOWN_HANDLER, this.keyDownHandler, this);\n };\n SelectionBasedExec.prototype.keyDownHandler = function (e) {\n var validFormats = ['bold', 'italic', 'underline', 'strikethrough', 'superscript',\n 'subscript', 'uppercase', 'lowercase'];\n if ((e.event.ctrlKey || e.event.metaKey) && validFormats.indexOf(e.event.action) > -1) {\n e.event.preventDefault();\n SelectionCommands.applyFormat(this.parent.currentDocument, e.event.action, this.parent.editableElement, e.enterAction);\n this.callBack(e, e.event.action);\n }\n };\n SelectionBasedExec.prototype.applySelection = function (e) {\n SelectionCommands.applyFormat(this.parent.currentDocument, e.subCommand.toLocaleLowerCase(), this.parent.editableElement, e.enterAction, e.value, e.selector);\n this.callBack(e, e.subCommand);\n };\n SelectionBasedExec.prototype.callBack = function (event, action) {\n if (event.callBack) {\n event.callBack({\n requestType: action,\n event: event.event,\n editorMode: 'HTML',\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n return SelectionBasedExec;\n}());\nexport { SelectionBasedExec };\n","import * as CONSTANT from './../base/constant';\nimport { InsertHtml } from './inserthtml';\n/**\n * Selection EXEC internal component\n *\n * @hidden\n\n */\nvar InsertHtmlExec = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - sepcifies the parent element\n * @hidden\n\n */\n function InsertHtmlExec(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n InsertHtmlExec.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.INSERTHTML_TYPE, this.applyHtml, this);\n };\n InsertHtmlExec.prototype.applyHtml = function (e) {\n InsertHtml.Insert(this.parent.currentDocument, e.value, this.parent.editableElement, true, e.enterAction);\n if (e.subCommand === 'pasteCleanup') {\n var pastedElements = this.parent.editableElement.querySelectorAll('.pasteContent_RTE');\n var allPastedElements = [].slice.call(pastedElements);\n var imgElements = this.parent.editableElement.querySelectorAll('.pasteContent_Img');\n var allImgElm = [].slice.call(imgElements);\n e.callBack({\n requestType: e.subCommand,\n editorMode: 'HTML',\n elements: allPastedElements,\n imgElem: allImgElm\n });\n }\n else {\n if (e.callBack) {\n e.callBack({\n requestType: e.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n }\n };\n return InsertHtmlExec;\n}());\nexport { InsertHtmlExec };\n","/**\n * `Clear Format` module is used to handle Clear Format.\n */\nimport { closest } from '@syncfusion/ej2-base';\nimport { NodeSelection } from './../../selection/index';\nimport { NodeCutter } from './nodecutter';\nimport { DOMNode } from './dom-node';\nimport { InsertMethods } from './insert-methods';\nimport { IsFormatted } from './isformatted';\nimport { isIDevice, setEditFrameFocus } from '../../common/util';\nvar ClearFormat = /** @class */ (function () {\n function ClearFormat() {\n }\n /**\n * clear method\n *\n * @param {Document} docElement - specifies the document element.\n * @param {Node} endNode - specifies the end node\n * @param {string} enterAction - specifies the enter key action\n * @param {string} selector - specifies the string value\n * @param {string} command - specifies the command value\n * @returns {void}\n * @hidden\n\n */\n ClearFormat.clear = function (docElement, endNode, enterAction, selector, command) {\n this.domNode = new DOMNode(endNode, docElement);\n this.defaultTag = enterAction === 'P' ? this.defaultTag : 'div';\n var nodeSelection = new NodeSelection();\n var nodeCutter = new NodeCutter();\n var range = nodeSelection.getRange(docElement);\n var nodes = range.collapsed ? nodeSelection.getSelectionNodeCollection(range) :\n nodeSelection.getSelectionNodeCollectionBr(range);\n var save = nodeSelection.save(range, docElement);\n var cursorRange = false;\n if (range.collapsed && command !== 'ClearFormat') {\n cursorRange = true;\n range = nodeCutter.GetCursorRange(docElement, range, nodes[0]);\n }\n var isCollapsed = range.collapsed;\n if (!isCollapsed) {\n var preNode = void 0;\n if (nodes.length > 0 && nodes[0].nodeName === 'BR' && closest(nodes[0], 'table')) {\n preNode = nodeCutter.GetSpliceNode(range, closest(nodes[0], 'table'));\n }\n else {\n preNode = nodeCutter.GetSpliceNode(range, nodes[nodes.length > 1 && nodes[0].nodeName === 'IMG' ? 1 : 0]);\n }\n if (nodes.length === 1) {\n nodeSelection.setSelectionContents(docElement, preNode);\n range = nodeSelection.getRange(docElement);\n }\n else if (nodes.length > 1) {\n var i = 1;\n var lastText = nodes[nodes.length - i];\n while (nodes.length <= i && nodes[nodes.length - i].nodeName === 'BR') {\n i++;\n lastText = nodes[nodes.length - i];\n }\n var lasNode = nodeCutter.GetSpliceNode(range, lastText);\n nodeSelection.setSelectionText(docElement, preNode, lasNode, 0, (lasNode.nodeType === 3) ?\n lasNode.textContent.length : lasNode.childNodes.length);\n range = nodeSelection.getRange(docElement);\n }\n var exactNodes = nodeSelection.getNodeCollection(range);\n var cloneSelectNodes = exactNodes.slice();\n this.clearInlines(nodeSelection.getSelectionNodes(cloneSelectNodes), cloneSelectNodes, nodeSelection.getRange(docElement), nodeCutter, endNode);\n this.reSelection(docElement, save, exactNodes);\n range = nodeSelection.getRange(docElement);\n exactNodes = nodeSelection.getNodeCollection(range);\n var cloneParentNodes = exactNodes.slice();\n this.clearBlocks(docElement, cloneParentNodes, endNode, nodeCutter, nodeSelection);\n if (isIDevice()) {\n setEditFrameFocus(endNode, selector);\n }\n this.reSelection(docElement, save, exactNodes);\n }\n if (cursorRange) {\n nodeSelection.setCursorPoint(docElement, range.endContainer, range.endOffset);\n }\n };\n ClearFormat.reSelection = function (docElement, save, exactNodes) {\n var selectionNodes = save.getInsertNodes(exactNodes);\n save.startContainer = save.getNodeArray(selectionNodes[0], true, docElement);\n save.startOffset = 0;\n save.endContainer = save.getNodeArray(selectionNodes[selectionNodes.length - 1], false, docElement);\n var endIndexNode = selectionNodes[selectionNodes.length - 1];\n save.endOffset = (endIndexNode.nodeType === 3) ? endIndexNode.textContent.length\n : endIndexNode.childNodes.length;\n save.restore();\n };\n ClearFormat.clearBlocks = function (docElement, nodes, endNode, nodeCutter, nodeSelection) {\n var parentNodes = [];\n for (var index = 0; index < nodes.length; index++) {\n if (this.BLOCK_TAGS.indexOf(nodes[index].nodeName.toLocaleLowerCase()) > -1\n && parentNodes.indexOf(nodes[index]) === -1) {\n parentNodes.push(nodes[index]);\n }\n else if ((this.BLOCK_TAGS.indexOf(nodes[index].parentNode.nodeName.toLocaleLowerCase()) > -1)\n && parentNodes.indexOf(nodes[index].parentNode) === -1\n && endNode !== nodes[index].parentNode) {\n parentNodes.push(nodes[index].parentNode);\n }\n }\n parentNodes = this.spliceParent(parentNodes, nodes)[0];\n parentNodes = this.removeParent(parentNodes);\n this.unWrap(docElement, parentNodes, nodeCutter, nodeSelection);\n };\n ClearFormat.spliceParent = function (parentNodes, nodes) {\n for (var index1 = 0; index1 < parentNodes.length; index1++) {\n var len = parentNodes[index1].childNodes.length;\n for (var index2 = 0; index2 < len; index2++) {\n if ((nodes.indexOf(parentNodes[index1].childNodes[index2]) > 0)\n && (parentNodes[index1].childNodes[index2].childNodes.length > 0)) {\n nodes = this.spliceParent([parentNodes[index1].childNodes[index2]], nodes)[1];\n }\n if ((nodes.indexOf(parentNodes[index1].childNodes[index2]) <= -1) &&\n (parentNodes[index1].childNodes[index2].textContent.trim() !== '')) {\n for (var index3 = 0; index3 < len; index3++) {\n if (nodes.indexOf(parentNodes[index1].childNodes[index3]) > -1) {\n nodes.splice(nodes.indexOf(parentNodes[index1].childNodes[index3]), 1);\n }\n }\n index2 = parentNodes[index1].childNodes.length;\n var parentIndex = parentNodes.indexOf(parentNodes[index1].parentNode);\n var nodeIndex = nodes.indexOf(parentNodes[index1].parentNode);\n if (parentIndex > -1) {\n parentNodes.splice(parentIndex, 1);\n }\n if (nodeIndex > -1) {\n nodes.splice(nodeIndex, 1);\n }\n var elementIndex = nodes.indexOf(parentNodes[index1]);\n if (elementIndex > -1) {\n nodes.splice(elementIndex, 1);\n }\n parentNodes.splice(index1, 1);\n index1--;\n }\n }\n }\n return [parentNodes, nodes];\n };\n ClearFormat.removeChild = function (parentNodes, parentNode) {\n var count = parentNode.childNodes.length;\n if (count > 0) {\n for (var index = 0; index < count; index++) {\n if (parentNodes.indexOf(parentNode.childNodes[index]) > -1) {\n parentNodes = this.removeChild(parentNodes, parentNode.childNodes[index]);\n parentNodes.splice(parentNodes.indexOf(parentNode.childNodes[index]), 1);\n }\n }\n }\n return parentNodes;\n };\n ClearFormat.removeParent = function (parentNodes) {\n for (var index = 0; index < parentNodes.length; index++) {\n if (parentNodes.indexOf(parentNodes[index].parentNode) > -1) {\n parentNodes = this.removeChild(parentNodes, parentNodes[index]);\n parentNodes.splice(index, 1);\n index--;\n }\n }\n return parentNodes;\n };\n ClearFormat.unWrap = function (docElement, parentNodes, nodeCutter, nodeSelection) {\n for (var index1 = 0; index1 < parentNodes.length; index1++) {\n if (this.NONVALID_TAGS.indexOf(parentNodes[index1].nodeName.toLowerCase()) > -1\n && parentNodes[index1].parentNode\n && this.NONVALID_PARENT_TAGS.indexOf(parentNodes[index1].parentNode.nodeName.toLowerCase()) > -1) {\n nodeSelection.setSelectionText(docElement, parentNodes[index1], parentNodes[index1], 0, parentNodes[index1].childNodes.length);\n InsertMethods.unwrap(nodeCutter.GetSpliceNode(nodeSelection.getRange(docElement), parentNodes[index1].parentNode));\n }\n if (parentNodes[index1].nodeName.toLocaleLowerCase() !== 'p') {\n if (this.NONVALID_PARENT_TAGS.indexOf(parentNodes[index1].nodeName.toLowerCase()) < 0\n && parentNodes[index1].parentNode.nodeName.toLocaleLowerCase() !== 'p'\n && !((parentNodes[index1].nodeName.toLocaleLowerCase() === 'blockquote'\n || parentNodes[index1].nodeName.toLocaleLowerCase() === 'li')\n && this.IGNORE_PARENT_TAGS.indexOf(parentNodes[index1].childNodes[0].nodeName.toLocaleLowerCase()) > -1)\n && !(parentNodes[index1].childNodes.length === 1\n && parentNodes[index1].childNodes[0].nodeName.toLocaleLowerCase() === 'p')) {\n InsertMethods.Wrap(parentNodes[index1], docElement.createElement(this.defaultTag));\n }\n var childNodes = InsertMethods.unwrap(parentNodes[index1]);\n if (childNodes.length === 1\n && childNodes[0].parentNode.nodeName.toLocaleLowerCase() === 'p') {\n InsertMethods.Wrap(parentNodes[index1], docElement.createElement(this.defaultTag));\n InsertMethods.unwrap(parentNodes[index1]);\n }\n for (var index2 = 0; index2 < childNodes.length; index2++) {\n if (this.NONVALID_TAGS.indexOf(childNodes[index2].nodeName.toLowerCase()) > -1) {\n this.unWrap(docElement, [childNodes[index2]], nodeCutter, nodeSelection);\n }\n else if (this.BLOCK_TAGS.indexOf(childNodes[index2].nodeName.toLocaleLowerCase()) > -1 &&\n childNodes[index2].nodeName.toLocaleLowerCase() !== 'p') {\n var blockNodes = this.removeParent([childNodes[index2]]);\n this.unWrap(docElement, blockNodes, nodeCutter, nodeSelection);\n }\n else if (this.BLOCK_TAGS.indexOf(childNodes[index2].nodeName.toLocaleLowerCase()) > -1 &&\n childNodes[index2].parentNode.nodeName.toLocaleLowerCase() ===\n childNodes[index2].nodeName.toLocaleLowerCase()) {\n InsertMethods.unwrap(childNodes[index2]);\n }\n else if (this.BLOCK_TAGS.indexOf(childNodes[index2].nodeName.toLocaleLowerCase()) > -1 &&\n childNodes[index2].nodeName.toLocaleLowerCase() === 'p') {\n InsertMethods.Wrap(childNodes[index2], docElement.createElement(this.defaultTag));\n InsertMethods.unwrap(childNodes[index2]);\n }\n }\n }\n else {\n InsertMethods.Wrap(parentNodes[index1], docElement.createElement(this.defaultTag));\n InsertMethods.unwrap(parentNodes[index1]);\n }\n }\n };\n ClearFormat.clearInlines = function (textNodes, nodes, range, nodeCutter, \n // eslint-disable-next-line\n endNode) {\n for (var index = 0; index < textNodes.length; index++) {\n var currentInlineNode = textNodes[index];\n var currentNode = void 0;\n while (!this.domNode.isBlockNode(currentInlineNode) &&\n (currentInlineNode.parentElement && !currentInlineNode.parentElement.classList.contains('e-img-inner'))) {\n currentNode = currentInlineNode;\n currentInlineNode = currentInlineNode.parentElement;\n }\n if (currentNode &&\n IsFormatted.inlineTags.indexOf(currentNode.nodeName.toLocaleLowerCase()) > -1) {\n nodeCutter.GetSpliceNode(range, currentNode);\n this.removeInlineParent(currentNode);\n }\n }\n };\n ClearFormat.removeInlineParent = function (textNodes) {\n var nodes = InsertMethods.unwrap(textNodes);\n for (var index = 0; index < nodes.length; index++) {\n if (nodes[index].parentNode.childNodes.length === 1 && !nodes[index].parentNode.classList.contains('e-img-inner')\n && IsFormatted.inlineTags.indexOf(nodes[index].parentNode.nodeName.toLocaleLowerCase()) > -1) {\n this.removeInlineParent(nodes[index].parentNode);\n }\n else if (IsFormatted.inlineTags.indexOf(nodes[index].nodeName.toLocaleLowerCase()) > -1) {\n this.removeInlineParent(nodes[index]);\n }\n }\n };\n ClearFormat.BLOCK_TAGS = ['address', 'article', 'aside', 'blockquote',\n 'details', 'dd', 'div', 'dl', 'dt', 'fieldset', 'figcaption', 'figure', 'footer',\n 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'header', 'hgroup', 'li', 'main', 'nav',\n 'noscript', 'ol', 'p', 'pre', 'section', 'ul'];\n ClearFormat.NONVALID_PARENT_TAGS = ['thead', 'tbody', 'ul', 'ol', 'table', 'tfoot', 'tr'];\n ClearFormat.IGNORE_PARENT_TAGS = ['ul', 'ol', 'table'];\n ClearFormat.NONVALID_TAGS = ['thead', 'tbody', 'figcaption', 'td', 'tr', 'th', 'tfoot', 'figcaption', 'li'];\n ClearFormat.defaultTag = 'p';\n return ClearFormat;\n}());\nexport { ClearFormat };\n","import * as CONSTANT from './../base/constant';\nimport { ClearFormat } from './clearformat';\nimport * as EVENTS from './../../common/constant';\n/**\n * Clear Format EXEC internal component\n *\n * @hidden\n\n */\nvar ClearFormatExec = /** @class */ (function () {\n /**\n * Constructor for creating the Formats plugin\n *\n * @param {EditorManager} parent - specifies the parent element.\n * @returns {void}\n * @hidden\n\n */\n function ClearFormatExec(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n ClearFormatExec.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.CLEAR_TYPE, this.applyClear, this);\n this.parent.observer.on(EVENTS.KEY_DOWN_HANDLER, this.onKeyDown, this);\n };\n ClearFormatExec.prototype.onKeyDown = function (e) {\n switch (e.event.action) {\n case 'clear-format':\n this.applyClear({ subCommand: 'ClearFormat', callBack: e.callBack, enterAction: e.enterAction });\n e.event.preventDefault();\n break;\n }\n };\n ClearFormatExec.prototype.applyClear = function (e) {\n if (e.subCommand === 'ClearFormat') {\n ClearFormat.clear(this.parent.currentDocument, this.parent.editableElement, e.enterAction, e.selector, e.subCommand);\n if (e.callBack) {\n e.callBack({\n requestType: e.subCommand,\n event: e.event,\n editorMode: 'HTML',\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n }\n };\n return ClearFormatExec;\n}());\nexport { ClearFormatExec };\n","import { debounce, isNullOrUndefined, detach } from '@syncfusion/ej2-base';\nimport { NodeSelection } from './../../selection/selection';\nimport * as EVENTS from './../../common/constant';\nimport { isIDevice, scrollToCursor, setEditFrameFocus } from '../../common/util';\n/**\n * `Undo` module is used to handle undo actions.\n */\nvar UndoRedoManager = /** @class */ (function () {\n function UndoRedoManager(parent, options) {\n this.undoRedoStack = [];\n this.parent = parent;\n this.undoRedoSteps = !isNullOrUndefined(options) ? options.undoRedoSteps : 30;\n this.undoRedoTimer = !isNullOrUndefined(options) ? options.undoRedoTimer : 300;\n this.addEventListener();\n }\n UndoRedoManager.prototype.addEventListener = function () {\n var debounceListener = debounce(this.keyUp, this.undoRedoTimer);\n this.parent.observer.on(EVENTS.KEY_UP_HANDLER, debounceListener, this);\n this.parent.observer.on(EVENTS.KEY_DOWN_HANDLER, this.keyDown, this);\n this.parent.observer.on(EVENTS.ACTION, this.onAction, this);\n this.parent.observer.on(EVENTS.MODEL_CHANGED_PLUGIN, this.onPropertyChanged, this);\n };\n UndoRedoManager.prototype.onPropertyChanged = function (props) {\n for (var _i = 0, _a = Object.keys(props.newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'undoRedoSteps':\n this.undoRedoSteps = props.newProp.undoRedoSteps;\n break;\n case 'undoRedoTimer':\n this.undoRedoTimer = props.newProp.undoRedoTimer;\n break;\n }\n }\n };\n UndoRedoManager.prototype.removeEventListener = function () {\n this.parent.observer.off(EVENTS.KEY_UP_HANDLER, this.keyUp);\n this.parent.observer.off(EVENTS.KEY_DOWN_HANDLER, this.keyDown);\n this.parent.observer.off(EVENTS.ACTION, this.onAction);\n };\n /**\n * onAction method\n *\n * @param {IHtmlSubCommands} e - specifies the sub command\n * @returns {void}\n * @hidden\n\n */\n UndoRedoManager.prototype.onAction = function (e) {\n if (e.subCommand === 'Undo') {\n this.undo(e);\n }\n else {\n this.redo(e);\n }\n };\n /**\n * Destroys the ToolBar.\n *\n * @function destroy\n * @returns {void}\n * @hidden\n\n */\n UndoRedoManager.prototype.destroy = function () {\n this.removeEventListener();\n };\n UndoRedoManager.prototype.keyDown = function (e) {\n var event = e.event;\n // eslint-disable-next-line\n var proxy = this;\n switch (event.action) {\n case 'undo':\n event.preventDefault();\n proxy.undo(e);\n break;\n case 'redo':\n event.preventDefault();\n proxy.redo(e);\n break;\n }\n };\n UndoRedoManager.prototype.keyUp = function (e) {\n if (e.event.keyCode !== 17 && !e.event.ctrlKey) {\n this.saveData(e);\n }\n };\n UndoRedoManager.prototype.getTextContentFromFragment = function (fragment) {\n var textContent = '';\n for (var i = 0; i < fragment.childNodes.length; i++) {\n var childNode = fragment.childNodes[i];\n if (childNode.nodeType === Node.TEXT_NODE) {\n textContent += childNode.textContent;\n }\n else if (childNode.nodeType === Node.ELEMENT_NODE) {\n textContent += this.getTextContentFromFragment(childNode);\n }\n }\n return textContent;\n };\n UndoRedoManager.prototype.isElementStructureEqual = function (previousFragment, currentFragment) {\n if (previousFragment.childNodes.length !== currentFragment.childNodes.length) {\n return false;\n }\n for (var i = 0; i < previousFragment.childNodes.length; i++) {\n var previousFragmentNode = previousFragment.childNodes[i];\n var currentFragmentNode = currentFragment.childNodes[i];\n if (!previousFragmentNode || !currentFragmentNode) {\n return false;\n }\n if (previousFragmentNode.nodeType !== currentFragmentNode.nodeType) {\n return false;\n }\n if (previousFragmentNode.outerHTML !== currentFragmentNode.outerHTML) {\n return false;\n }\n }\n return true;\n };\n /**\n * RTE collection stored html format.\n *\n * @function saveData\n * @param {KeyboardEvent} e - specifies the keyboard event\n * @returns {void}\n * @hidden\n\n */\n UndoRedoManager.prototype.saveData = function (e) {\n var range = new NodeSelection().getRange(this.parent.currentDocument);\n var currentContainer = this.parent.editableElement === range.startContainer.parentElement ?\n range.startContainer.parentElement : range.startContainer;\n for (var i = currentContainer.childNodes.length - 1; i >= 0; i--) {\n if (!isNullOrUndefined(currentContainer.childNodes[i]) && currentContainer.childNodes[i].nodeName === '#text' &&\n currentContainer.childNodes[i].textContent.length === 0 && currentContainer.childNodes[i].nodeName !== 'IMG' &&\n currentContainer.childNodes[i].nodeName !== 'BR' && currentContainer.childNodes[i].nodeName && 'HR') {\n detach(currentContainer.childNodes[i]);\n }\n }\n range = new NodeSelection().getRange(this.parent.currentDocument);\n var save = new NodeSelection().save(range, this.parent.currentDocument);\n var clonedElement = this.parent.editableElement.cloneNode(true);\n var fragment = document.createDocumentFragment();\n while (clonedElement.firstChild) {\n fragment.appendChild(clonedElement.firstChild);\n }\n var changEle = { text: fragment, range: save };\n if (this.undoRedoStack.length >= this.steps) {\n this.undoRedoStack = this.undoRedoStack.slice(0, this.steps + 1);\n }\n if (this.undoRedoStack.length > 1 && (this.undoRedoStack[this.undoRedoStack.length - 1].range.range.collapsed === range.collapsed)\n && (this.undoRedoStack[this.undoRedoStack.length - 1].range.startOffset === save.range.startOffset) &&\n (this.undoRedoStack[this.undoRedoStack.length - 1].range.endOffset === save.range.endOffset) &&\n (this.undoRedoStack[this.undoRedoStack.length - 1].range.range.startContainer === save.range.startContainer) &&\n (this.getTextContentFromFragment(this.undoRedoStack[this.undoRedoStack.length - 1].text).trim() ===\n this.getTextContentFromFragment(changEle.text).trim()) &&\n this.isElementStructureEqual(this.undoRedoStack[this.undoRedoStack.length - 1].text, changEle.text)) {\n return;\n }\n this.undoRedoStack.push(changEle);\n this.steps = this.undoRedoStack.length - 1;\n if (this.steps > this.undoRedoSteps) {\n this.undoRedoStack.shift();\n this.steps--;\n }\n if (e && e.callBack) {\n e.callBack();\n }\n };\n /**\n * Undo the editable text.\n *\n * @function undo\n * @param {IHtmlSubCommands} e - specifies the sub commands\n * @returns {void}\n * @hidden\n\n */\n UndoRedoManager.prototype.undo = function (e) {\n if (this.steps > 0) {\n var range = this.undoRedoStack[this.steps - 1].range;\n var removedContent = this.undoRedoStack[this.steps - 1].text;\n this.parent.editableElement.innerHTML = '';\n this.parent.editableElement.appendChild(removedContent.cloneNode(true));\n this.parent.editableElement.focus();\n scrollToCursor(this.parent.currentDocument, this.parent.editableElement);\n if (isIDevice()) {\n setEditFrameFocus(this.parent.editableElement, e.selector);\n }\n range.restore();\n this.steps--;\n if (e.callBack) {\n e.callBack({\n requestType: 'Undo',\n editorMode: 'HTML',\n range: range,\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument),\n event: e.event\n });\n }\n }\n };\n /**\n * Redo the editable text.\n *\n * @param {IHtmlSubCommands} e - specifies the sub commands\n * @function redo\n * @returns {void}\n * @hidden\n\n */\n UndoRedoManager.prototype.redo = function (e) {\n if (this.undoRedoStack[this.steps + 1] != null) {\n var range = this.undoRedoStack[this.steps + 1].range;\n var addedContent = this.undoRedoStack[this.steps + 1].text;\n this.parent.editableElement.innerHTML = '';\n this.parent.editableElement.appendChild(addedContent.cloneNode(true));\n this.parent.editableElement.focus();\n scrollToCursor(this.parent.currentDocument, this.parent.editableElement);\n if (isIDevice()) {\n setEditFrameFocus(this.parent.editableElement, e.selector);\n }\n range.restore();\n this.steps++;\n if (e.callBack) {\n e.callBack({\n requestType: 'Redo',\n editorMode: 'HTML',\n range: range,\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument),\n event: e.event\n });\n }\n }\n };\n /**\n * getUndoStatus method\n *\n * @returns {boolean} - returns the boolean value\n * @hidden\n\n */\n UndoRedoManager.prototype.getUndoStatus = function () {\n var status = { undo: false, redo: false };\n if (this.steps > 0) {\n status.undo = true;\n }\n if (this.undoRedoStack[this.steps + 1] != null) {\n status.redo = true;\n }\n return status;\n };\n return UndoRedoManager;\n}());\nexport { UndoRedoManager };\n","import * as EVENTS from '../../common/constant';\nimport { createElement, isNullOrUndefined as isNOU, detach, addClass, Browser } from '@syncfusion/ej2-base';\nimport { PASTE_SOURCE } from '../base/constant';\n/**\n * PasteCleanup for MsWord content\n *\n * @hidden\n\n */\nvar MsWordPaste = /** @class */ (function () {\n function MsWordPaste(parent) {\n this.olData = [\n 'decimal',\n 'lower-alpha',\n 'lower-roman',\n 'upper-alpha',\n 'upper-roman',\n 'lower-greek'\n ];\n this.ulData = [\n 'disc',\n 'square',\n 'circle',\n 'disc',\n 'square',\n 'circle'\n ];\n this.ignorableNodes = ['A', 'APPLET', 'B', 'BLOCKQUOTE', 'BR',\n 'BUTTON', 'CENTER', 'CODE', 'COL', 'COLGROUP', 'DD', 'DEL', 'DFN', 'DIR', 'DIV',\n 'DL', 'DT', 'EM', 'FIELDSET', 'FONT', 'FORM', 'FRAME', 'FRAMESET', 'H1', 'H2',\n 'H3', 'H4', 'H5', 'H6', 'HR', 'I', 'IMG', 'IFRAME', 'INPUT', 'INS', 'LABEL',\n 'LI', 'OL', 'OPTION', 'P', 'PARAM', 'PRE', 'Q', 'S', 'SELECT', 'SPAN', 'STRIKE',\n 'STRONG', 'SUB', 'SUP', 'TABLE', 'TBODY', 'TD', 'TEXTAREA', 'TFOOT', 'TH',\n 'THEAD', 'TITLE', 'TR', 'TT', 'U', 'UL'];\n this.blockNode = ['div', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',\n 'address', 'blockquote', 'button', 'center', 'dd', 'dir', 'dl', 'dt', 'fieldset',\n 'frameset', 'hr', 'iframe', 'isindex', 'li', 'map', 'menu', 'noframes', 'noscript',\n 'object', 'ol', 'pre', 'table', 'tbody', 'td', 'tfoot', 'th', 'thead', 'tr', 'ul',\n 'header', 'article', 'nav', 'footer', 'section', 'aside', 'main', 'figure', 'figcaption'];\n this.borderStyle = ['border-top', 'border-right', 'border-bottom', 'border-left'];\n this.upperRomanNumber = ['I', 'II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX',\n 'X', 'XI', 'XII', 'XIII', 'XIV', 'XV', 'XVI', 'XVII', 'XVIII', 'XIX', 'XX'];\n this.lowerRomanNumber = ['i', 'ii', 'iii', 'iv', 'v', 'vi', 'vii', 'viii', 'ix',\n 'x', 'xi', 'xii', 'xiii', 'xiv', 'xv', 'xvi', 'xvii', 'xviii', 'xix', 'xx'];\n this.lowerGreekNumber = ['α', 'β', 'γ', 'δ', 'ε', 'ζ', 'η', 'θ', 'ι', 'κ', 'λ',\n 'μ', 'ν', 'ξ', 'ο', 'π', 'ρ', 'σ', 'τ', 'υ', 'φ', 'χ', 'ψ', 'ω'];\n this.removableElements = ['o:p', 'style', 'w:sdt'];\n this.listContents = [];\n this.cropImageDimensions = [];\n this.parent = parent;\n this.addEventListener();\n }\n MsWordPaste.prototype.addEventListener = function () {\n this.parent.observer.on(EVENTS.MS_WORD_CLEANUP_PLUGIN, this.wordCleanup, this);\n };\n MsWordPaste.prototype.wordCleanup = function (e) {\n var wordPasteStyleConfig = !isNOU(e.allowedStylePropertiesArray) ? e.allowedStylePropertiesArray : [];\n var listNodes = [];\n var tempHTMLContent = e.args.clipboardData.getData('text/HTML');\n var rtfData = e.args.clipboardData.getData('text/rtf');\n var elm = createElement('p');\n elm.setAttribute('id', 'MSWord-Content');\n elm.innerHTML = tempHTMLContent;\n this.addDoubleBr(elm);\n var patern = /class='?Mso|style='[^ ]*\\bmso-/i;\n var patern2 = /class=\"?Mso|style=\"[^ ]*\\bmso-/i;\n var patern3 = /(class=\"?Mso|class='?Mso|class=\"?Xl|class='?Xl|class=Xl|style=\"[^\"]*\\bmso-|style='[^']*\\bmso-|w:WordDocument)/gi;\n var pattern4 = /style='mso-width-source:/i;\n var source = this.findSource(elm);\n if (patern.test(tempHTMLContent) || patern2.test(tempHTMLContent) || patern3.test(tempHTMLContent) ||\n pattern4.test(tempHTMLContent)) {\n tempHTMLContent = tempHTMLContent.replace(/]+>/i, '');\n this.addListClass(elm);\n listNodes = this.cleanUp(elm, listNodes);\n if (!isNOU(listNodes[0]) && listNodes[0].parentElement.tagName !== 'UL' &&\n listNodes[0].parentElement.tagName !== 'OL') {\n this.listConverter(listNodes);\n }\n this.imageConversion(elm, rtfData);\n this.cleanList(elm, 'UL');\n this.cleanList(elm, 'OL');\n this.styleCorrection(elm, wordPasteStyleConfig);\n this.removingComments(elm);\n this.removeUnwantedElements(elm);\n this.removeEmptyElements(elm);\n this.removeEmptyAnchorTag(elm);\n this.breakLineAddition(elm);\n this.processMargin(elm);\n this.removeClassName(elm);\n if (pattern4.test(tempHTMLContent)) {\n this.addTableBorderClass(elm);\n }\n e.callBack(elm.innerHTML, this.cropImageDimensions, source);\n }\n else {\n e.callBack(elm.innerHTML, null, source);\n }\n };\n MsWordPaste.prototype.addDoubleBr = function (elm) {\n var newline = elm.querySelector('.Apple-interchange-newline');\n if (!isNOU(newline) && Browser.userAgent.indexOf('Chrome') !== -1 && newline.parentElement.nodeName === 'P' && elm !== newline.parentElement) {\n for (var i = 0; i < elm.childNodes.length; i++) {\n // eslint-disable-next-line\n var node = elm.childNodes[i];\n if (node.nodeType === Node.COMMENT_NODE && node.nodeValue.includes('StartFragment')) {\n var newElement = document.createElement('p');\n newElement.innerHTML = '
    ';\n var cssText = newline.parentElement.style.cssText;\n var currentStyle = newElement.getAttribute('style') || '';\n var newStyle = currentStyle + cssText;\n newElement.setAttribute('style', newStyle);\n elm.insertBefore(newElement, node.nextSibling);\n detach(newline);\n break;\n }\n }\n }\n };\n MsWordPaste.prototype.cleanList = function (elm, listTag) {\n var replacableElem = elm.querySelectorAll(listTag + ' div');\n for (var j = replacableElem.length - 1; j >= 0; j--) {\n var parentElem = replacableElem[j].parentNode;\n while (replacableElem[j].firstChild) {\n parentElem.insertBefore(replacableElem[j].firstChild, replacableElem[j]);\n }\n var closestListElem = this.findClosestListElem(replacableElem[j]);\n if (closestListElem) {\n this.insertAfter(replacableElem[j], closestListElem);\n }\n }\n };\n MsWordPaste.prototype.insertAfter = function (newNode, referenceNode) {\n referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);\n };\n MsWordPaste.prototype.findClosestListElem = function (listElem) {\n var closestListElem;\n while (!isNOU(listElem)) {\n listElem = !isNOU(listElem.closest('ul')) && listElem.tagName !== 'UL' ?\n listElem.closest('ul') : (listElem.tagName !== 'OL' ? listElem.closest('ol') : null);\n closestListElem = !isNOU(listElem) ? listElem : closestListElem;\n }\n return closestListElem;\n };\n MsWordPaste.prototype.addListClass = function (elm) {\n var allNodes = elm.querySelectorAll('*');\n for (var index = 0; index < allNodes.length; index++) {\n if (!isNOU(allNodes[index].getAttribute('style')) && allNodes[index].getAttribute('style').replace(/ /g, '').replace('\\n', '').indexOf('mso-list:l') >= 0 &&\n allNodes[index].className.toLowerCase().indexOf('msolistparagraph') === -1 &&\n allNodes[index].tagName.charAt(0) !== 'H' && allNodes[index].tagName !== 'LI' &&\n allNodes[index].tagName !== 'OL' && allNodes[index].tagName !== 'UL') {\n allNodes[index].classList.add('msolistparagraph');\n }\n }\n };\n MsWordPaste.prototype.addTableBorderClass = function (elm) {\n var allTableElm = elm.querySelectorAll('table');\n var hasTableBorder = false;\n for (var i = 0; i < allTableElm.length; i++) {\n for (var j = 0; j < this.borderStyle.length; j++) {\n if (allTableElm[i].innerHTML.indexOf(this.borderStyle[j]) >= 0) {\n hasTableBorder = true;\n break;\n }\n }\n if (hasTableBorder) {\n allTableElm[i].classList.add('e-rte-table-border');\n hasTableBorder = false;\n }\n }\n };\n MsWordPaste.prototype.imageConversion = function (elm, rtfData) {\n this.checkVShape(elm);\n var imgElem = elm.querySelectorAll('img');\n for (var i = 0; i < imgElem.length; i++) {\n if (!isNOU(imgElem[i].getAttribute('v:shapes')) &&\n imgElem[i].getAttribute('v:shapes').indexOf('Picture') < 0 &&\n imgElem[i].getAttribute('v:shapes').indexOf('圖片') < 0 &&\n imgElem[i].getAttribute('v:shapes').indexOf('Grafik') < 0 &&\n imgElem[i].getAttribute('v:shapes').toLowerCase().indexOf('image') < 0 &&\n imgElem[i].getAttribute('v:shapes').indexOf('Graphic') < 0 &&\n imgElem[i].getAttribute('v:shapes').indexOf('_x0000_s') < 0 &&\n imgElem[i].getAttribute('v:shapes').indexOf('_x0000_i') < 0) {\n imgElem[i].classList.add('e-rte-image-unsupported');\n }\n imgElem[i].removeAttribute('v:shapes');\n }\n imgElem = elm.querySelectorAll('img');\n var imgSrc = [];\n var base64Src = [];\n var imgName = [];\n // eslint-disable-next-line\n var linkRegex = new RegExp(/([^\\S]|^)(((https?\\:\\/\\/)|(www\\.))(\\S+))/gi);\n if (imgElem.length > 0) {\n for (var i = 0; i < imgElem.length; i++) {\n imgSrc.push(imgElem[i].getAttribute('src'));\n imgName.push(imgElem[i].getAttribute('src').split('/')[imgElem[i].getAttribute('src').split('/').length - 1].split('.')[0]);\n }\n var hexValue = this.hexConversion(rtfData);\n for (var i = 0; i < hexValue.length; i++) {\n base64Src.push({\n base64Data: !isNOU(hexValue[i].hex) ? this.convertToBase64(hexValue[i]) : null,\n isCroppedImage: hexValue[i].isCroppedImage\n });\n if (hexValue[i].isCroppedImage) {\n this.cropImageDimensions.push({\n goalWidth: hexValue[i].goalWidth,\n goalHeight: hexValue[i].goalHeight,\n cropLength: hexValue[i].cropLength,\n cropTop: hexValue[i].cropTop,\n cropR: hexValue[i].cropR,\n cropB: hexValue[i].cropB\n });\n }\n }\n imgElem = elm.querySelectorAll('img:not(.e-rte-image-unsupported');\n for (var i = 0; i < imgElem.length; i++) {\n if (imgSrc[i].match(linkRegex)) {\n imgElem[i].setAttribute('src', imgSrc[i]);\n }\n else {\n if (!isNOU(base64Src[i]) && !isNOU(base64Src[i].base64Data)) {\n imgElem[i].setAttribute('src', base64Src[i].base64Data);\n }\n else {\n imgElem[i].removeAttribute('src');\n imgElem[i].classList.add('e-rte-image-unsupported');\n }\n if (!isNOU(base64Src[i]) && base64Src[i].isCroppedImage) {\n imgElem[i].classList.add('e-img-cropped');\n }\n }\n imgElem[i].setAttribute('id', 'msWordImg-' + imgName[i]);\n }\n imgElem = elm.querySelectorAll('.e-rte-image-unsupported');\n for (var i = 0; i < imgElem.length; i++) {\n imgElem[i].removeAttribute('src');\n }\n }\n };\n MsWordPaste.prototype.checkVShape = function (elm) {\n var allNodes = elm.querySelectorAll('*');\n for (var i = 0; i < allNodes.length; i++) {\n switch (allNodes[i].nodeName) {\n case 'V:SHAPETYPE':\n detach(allNodes[i]);\n break;\n case 'V:SHAPE':\n if (allNodes[i].firstElementChild.nodeName === 'V:IMAGEDATA') {\n var src = allNodes[i].firstElementChild.getAttribute('src');\n var imgElement = createElement('img');\n imgElement.setAttribute('src', src);\n allNodes[i].parentElement.insertBefore(imgElement, allNodes[i]);\n detach(allNodes[i]);\n }\n break;\n }\n }\n };\n MsWordPaste.prototype.convertToBase64 = function (hexValue) {\n var byteArr = this.conHexStringToBytes(hexValue.hex);\n var base64String = this.conBytesToBase64(byteArr);\n var base64 = hexValue.type ? 'data:' + hexValue.type + ';base64,' + base64String : null;\n return base64;\n };\n MsWordPaste.prototype.conBytesToBase64 = function (byteArr) {\n var base64Str = '';\n var base64Char = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';\n var byteArrLen = byteArr.length;\n for (var i = 0; i < byteArrLen; i += 3) {\n var array3 = byteArr.slice(i, i + 3);\n var array3length = array3.length;\n var array4 = [];\n if (array3length < 3) {\n for (var j = array3length; j < 3; j++) {\n array3[j] = 0;\n }\n }\n array4[0] = (array3[0] & 0xFC) >> 2;\n array4[1] = ((array3[0] & 0x03) << 4) | (array3[1] >> 4);\n array4[2] = ((array3[1] & 0x0F) << 2) | ((array3[2] & 0xC0) >> 6);\n array4[3] = array3[2] & 0x3F;\n for (var j = 0; j < 4; j++) {\n if (j <= array3length) {\n base64Str += base64Char.charAt(array4[j]);\n }\n else {\n base64Str += '=';\n }\n }\n }\n return base64Str;\n };\n MsWordPaste.prototype.conHexStringToBytes = function (hex) {\n var byteArr = [];\n var byteArrLen = hex.length / 2;\n for (var i = 0; i < byteArrLen; i++) {\n byteArr.push(parseInt(hex.substr(i * 2, 2), 16));\n }\n return byteArr;\n };\n MsWordPaste.prototype.hexConversion = function (rtfData) {\n // eslint-disable-next-line\n var picHead = /\\{\\\\pict[\\s\\S]+?\\\\bliptag\\-?\\d+(\\\\blipupi\\-?\\d+)?(\\{\\\\\\*\\\\blipuid\\s?[\\da-fA-F]+)?[\\s\\}]*?/;\n // eslint-disable-next-line security/detect-non-literal-regexp\n var pic = new RegExp('(?:(' + picHead.source + '))([\\\\da-fA-F\\\\s]+)\\\\}', 'g');\n var fullImg = rtfData.match(pic);\n var imgType;\n var result = [];\n if (!isNOU(fullImg)) {\n for (var i = 0; i < fullImg.length; i++) {\n if (fullImg[i].indexOf('fIsBullet') !== -1 && fullImg[i].indexOf('wzName') === -1) {\n continue;\n }\n var isCroppedImage = false;\n var goalWidth = 0;\n var goalHeight = 0;\n var cropLength = 0;\n var cropTop = 0;\n var cropR = 0;\n var cropB = 0;\n if (picHead.test(fullImg[i])) {\n if (fullImg[i].indexOf('\\\\pngblip') !== -1) {\n imgType = 'image/png';\n }\n else if (fullImg[i].indexOf('\\\\jpegblip') !== -1) {\n imgType = 'image/jpeg';\n }\n else if (fullImg[i].indexOf('\\\\emfblip') !== -1) {\n imgType = null;\n }\n else {\n continue;\n }\n isCroppedImage = ((this.extractCropValue('cropl', fullImg[i]) > 0 &&\n this.extractCropValue('cropt', fullImg[i]) > 0) ||\n this.extractCropValue('cropr', fullImg[i]) > 0 ||\n this.extractCropValue('cropb', fullImg[i])) ? true : false;\n if (isCroppedImage) {\n goalWidth = this.extractCropValue('wgoal', fullImg[i]);\n goalHeight = this.extractCropValue('hgoal', fullImg[i]);\n cropLength = this.extractCropValue('cropl', fullImg[i]);\n cropTop = this.extractCropValue('cropt', fullImg[i]);\n cropR = this.extractCropValue('cropr', fullImg[i]);\n cropB = this.extractCropValue('cropb', fullImg[i]);\n }\n result.push({\n hex: imgType ? fullImg[i].replace(picHead, '').replace(/[^\\da-fA-F]/g, '') : null,\n type: imgType,\n isCroppedImage: isCroppedImage,\n goalWidth: goalWidth,\n goalHeight: goalHeight,\n cropLength: cropLength,\n cropTop: cropTop,\n cropR: cropR,\n cropB: cropB\n });\n }\n }\n }\n return result;\n };\n MsWordPaste.prototype.extractCropValue = function (crop, rtfData) {\n // eslint-disable-next-line security/detect-non-literal-regexp\n var result = new RegExp('\\\\\\\\pic' + crop + '(\\\\-?\\\\d+)\\\\\\\\').exec(rtfData.replace(/\\r\\n\\\\/g, '\\\\').replace(/\\n/g, '\\\\'))[1];\n return parseInt(result, 10);\n };\n MsWordPaste.prototype.removeClassName = function (elm) {\n var elmWithClass = elm.querySelectorAll('*[class]:not(.e-img-cropped):not(.e-rte-image-unsupported)');\n for (var i = 0; i < elmWithClass.length; i++) {\n elmWithClass[i].removeAttribute('class');\n }\n };\n MsWordPaste.prototype.breakLineAddition = function (elm) {\n var allElements = elm.querySelectorAll('*');\n for (var i = 0; i < allElements.length; i++) {\n if (allElements[i].children.length === 0 && allElements[i].innerHTML === ' ' &&\n (allElements[i].innerHTML === ' ' && !allElements[i].closest('li')) &&\n !allElements[i].closest('td') && (allElements[i].nodeName !== 'SPAN' ||\n allElements[i].nodeName === 'SPAN' && (isNOU(allElements[i].previousElementSibling) &&\n isNOU(allElements[i].nextElementSibling)))) {\n var detachableElement = this.findDetachElem(allElements[i]);\n var brElement = createElement('br');\n var hasNbsp = detachableElement.textContent.length > 0 && detachableElement.textContent.match(/\\u00a0/g)\n && detachableElement.textContent.match(/\\u00a0/g).length > 0;\n if (!hasNbsp && !isNOU(detachableElement.parentElement)) {\n detachableElement.parentElement.insertBefore(brElement, detachableElement);\n detach(detachableElement);\n }\n }\n }\n };\n MsWordPaste.prototype.findDetachElem = function (element) {\n var removableElement;\n if (!isNOU(element.parentElement) &&\n element.parentElement.textContent.trim() === '' && element.parentElement.tagName !== 'TD' &&\n isNOU(element.parentElement.querySelector('img'))) {\n removableElement = this.findDetachElem(element.parentElement);\n }\n else {\n removableElement = element;\n }\n return removableElement;\n };\n MsWordPaste.prototype.removeUnwantedElements = function (elm) {\n var styleElm = elm.querySelector('style');\n if (!isNOU(styleElm)) {\n detach(styleElm);\n }\n var innerElement = elm.innerHTML;\n for (var i = 0; i < this.removableElements.length; i++) {\n // eslint-disable-next-line security/detect-non-literal-regexp\n var regExpStartElem = new RegExp('<' + this.removableElements[i] + '\\\\s*[^>]*>', 'g');\n // eslint-disable-next-line security/detect-non-literal-regexp\n var regExpEndElem = new RegExp('', 'g');\n innerElement = innerElement.replace(regExpStartElem, '');\n innerElement = innerElement.replace(regExpEndElem, '');\n }\n elm.innerHTML = innerElement;\n elm.querySelectorAll(':empty');\n };\n MsWordPaste.prototype.findDetachEmptyElem = function (element) {\n var removableElement;\n if (!isNOU(element.parentElement)) {\n var hasNbsp = element.parentElement.textContent.length > 0 && element.parentElement.textContent.match(/\\u00a0/g)\n && element.parentElement.textContent.match(/\\u00a0/g).length > 0;\n if (!hasNbsp && element.parentElement.textContent.trim() === '' &&\n element.parentElement.getAttribute('id') !== 'MSWord-Content' &&\n !(this.hasParentWithClass(element, 'MsoListParagraph')) &&\n isNOU(element.parentElement.querySelector('img'))) {\n removableElement = this.findDetachEmptyElem(element.parentElement);\n }\n else {\n removableElement = element;\n }\n }\n else {\n removableElement = null;\n }\n return removableElement;\n };\n MsWordPaste.prototype.hasParentWithClass = function (element, className) {\n var currentParentElem = element.parentElement;\n while (!isNOU(currentParentElem)) {\n if (currentParentElem.classList.contains(className)) {\n return true;\n }\n currentParentElem = currentParentElem.parentElement;\n }\n return false;\n };\n MsWordPaste.prototype.removeEmptyElements = function (element) {\n var emptyElements = element.querySelectorAll(':empty');\n for (var i = 0; i < emptyElements.length; i++) {\n if (!isNOU(emptyElements[i].closest('td')) &&\n !isNOU(emptyElements[i].closest('td').querySelector('.MsoNormal'))) {\n emptyElements[i].innerHTML = '-';\n }\n var lineWithDiv = true;\n if (emptyElements[i].tagName === 'DIV') {\n lineWithDiv = emptyElements[i].style.borderBottom === 'none' ||\n emptyElements[i].style.borderBottom === '' ? true : false;\n }\n if (emptyElements[i].tagName !== 'IMG' && emptyElements[i].tagName !== 'BR' &&\n emptyElements[i].tagName !== 'IFRAME' && emptyElements[i].tagName !== 'TD' &&\n emptyElements[i].tagName !== 'HR' && lineWithDiv) {\n var detachableElement = this.findDetachEmptyElem(emptyElements[i]);\n if (!isNOU(detachableElement)) {\n detach(detachableElement);\n }\n }\n }\n };\n MsWordPaste.prototype.styleCorrection = function (elm, wordPasteStyleConfig) {\n var styleElement = elm.querySelectorAll('style');\n var styles = [];\n if (styleElement.length > 0) {\n if (!isNOU(styleElement[0].innerHTML.match(/[\\S ]+\\s+{[\\s\\S]+?}/gi))) {\n styles = styleElement[0].innerHTML.match(/[\\S ]+\\s+{[\\s\\S]+?}/gi);\n }\n else if (styleElement.length > 1) {\n styles = styleElement[1].innerHTML.match(/[\\S ]+\\s+{[\\s\\S]+?}/gi);\n }\n var styleClassObject_1 = !isNOU(styles) ? this.findStyleObject(styles) : null;\n if (!isNOU(styleClassObject_1)) {\n var keys = Object.keys(styleClassObject_1);\n var values = keys.map(function (key) {\n return styleClassObject_1[\"\" + key];\n });\n values = this.removeUnwantedStyle(values, wordPasteStyleConfig);\n this.filterStyles(elm, wordPasteStyleConfig);\n var resultElem = void 0;\n var fromClass = false;\n for (var i = 0; i < keys.length; i++) {\n if (keys[i].split('.')[0] === '') {\n resultElem = elm.getElementsByClassName(keys[i].split('.')[1]);\n fromClass = true;\n }\n else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') >= 0) {\n continue;\n }\n else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') < 0) {\n resultElem = elm.getElementsByTagName(keys[i]);\n }\n else {\n resultElem = elm.querySelectorAll(keys[i]);\n }\n for (var j = 0; j < resultElem.length; j++) {\n if (resultElem[j].closest('li') && keys[i] === 'p') {\n continue;\n }\n var styleProperty = resultElem[j].getAttribute('style');\n if (!isNOU(styleProperty) && styleProperty.trim() !== '') {\n var valueSplit = values[i].split(';');\n if (!fromClass) {\n for (var k = 0; k < valueSplit.length; k++) {\n if (styleProperty.indexOf(valueSplit[k].split(':')[0]) >= 0) {\n valueSplit.splice(k, 1);\n k--;\n }\n }\n }\n var changedValue = styleProperty + valueSplit.join(';') + ';';\n resultElem[j].setAttribute('style', changedValue);\n }\n else {\n values[i] = values[i].replace(/text-indent:-(.*?)(?=;|$)/gm, '');\n resultElem[j].setAttribute('style', values[i]);\n }\n }\n fromClass = false;\n }\n var listClass = ['MsoListParagraphCxSpFirst', 'MsoListParagraphCxSpMiddle', 'MsoListParagraphCxSpLast'];\n for (var i = 0; i < listClass.length; i++) {\n if (keys.indexOf('li.' + listClass[i]) > -1) {\n var olULElems = elm.querySelectorAll('ol.' + listClass[i] + ', ul.' + listClass[i]);\n for (var j = 0; j < olULElems.length; j++) {\n var styleProperty = olULElems[j].getAttribute('style');\n if (!isNOU(styleProperty) && styleProperty.trim() !== '' && olULElems[j].style.marginLeft !== '') {\n var valueSplit = values[keys.indexOf('li.' + listClass[i])].split(';');\n for (var k = 0; k < valueSplit.length; k++) {\n if ('margin-left'.indexOf(valueSplit[k].split(':')[0]) >= 0) {\n if (!isNOU(valueSplit[k].split(':')[1]) &&\n valueSplit[k].split(':')[1].indexOf('in') >= 0 &&\n olULElems[j].style.marginLeft.indexOf('in') >= 0) {\n var classStyle = parseFloat(valueSplit[k].split(':')[1].split('in')[0]);\n var inlineStyle = parseFloat(olULElems[j].style.marginLeft.split('in')[0]);\n olULElems[j].style.marginLeft = (inlineStyle - classStyle) + 'in';\n }\n }\n }\n }\n }\n }\n }\n }\n }\n };\n MsWordPaste.prototype.filterStyles = function (elm, wordPasteStyleConfig) {\n var elmWithStyles = elm.querySelectorAll('*[style]');\n for (var i = 0; i < elmWithStyles.length; i++) {\n var elemStyleProperty = elmWithStyles[i].getAttribute('style').split(';');\n var styleValue = '';\n for (var j = 0; j < elemStyleProperty.length; j++) {\n if (wordPasteStyleConfig.indexOf(elemStyleProperty[j].split(':')[0].trim()) >= 0) {\n styleValue += elemStyleProperty[j] + ';';\n }\n }\n elmWithStyles[i].setAttribute('style', styleValue);\n }\n };\n MsWordPaste.prototype.removeUnwantedStyle = function (values, wordPasteStyleConfig) {\n for (var i = 0; i < values.length; i++) {\n var styleValues = values[i].split(';');\n values[i] = '';\n for (var j = 0; j < styleValues.length; j++) {\n if (wordPasteStyleConfig.indexOf(styleValues[j].split(':')[0]) >= 0) {\n values[i] += styleValues[j] + ';';\n }\n }\n }\n return values;\n };\n MsWordPaste.prototype.findStyleObject = function (styles) {\n var styleClassObject = {};\n for (var i = 0; i < styles.length; i++) {\n var tempStyle = styles[i];\n var classNameCollection = tempStyle.replace(/([\\S ]+\\s+){[\\s\\S]+?}/gi, '$1');\n var stylesCollection = tempStyle.replace(/[\\S ]+\\s+{([\\s\\S]+?)}/gi, '$1');\n classNameCollection = classNameCollection.replace(/^[\\s]|[\\s]$/gm, '');\n stylesCollection = stylesCollection.replace(/^[\\s]|[\\s]$/gm, '');\n classNameCollection = classNameCollection.replace(/\\n|\\r|\\n\\r/g, '');\n stylesCollection = stylesCollection.replace(/\\n|\\r|\\n\\r/g, '');\n for (var classNames = classNameCollection.split(', '), j = 0; j < classNames.length; j++) {\n styleClassObject[classNames[j]] = stylesCollection;\n }\n }\n return styleClassObject;\n };\n MsWordPaste.prototype.removingComments = function (elm) {\n var innerElement = elm.innerHTML;\n innerElement = innerElement.replace(//g, '');\n elm.innerHTML = innerElement;\n };\n MsWordPaste.prototype.cleanUp = function (node, listNodes) {\n var tempCleaner = [];\n var prevflagState;\n var allNodes = node.querySelectorAll('*');\n for (var index = 0; index < allNodes.length; index++) {\n if (this.ignorableNodes.indexOf(allNodes[index].nodeName) === -1 ||\n (allNodes[index].nodeType === 3 && allNodes[index].textContent.trim() === '')) {\n tempCleaner.push(allNodes[index]);\n continue;\n }\n else if (allNodes[index].className &&\n allNodes[index].className.toLowerCase().indexOf('msolistparagraph') !== -1 &&\n !isNOU(allNodes[index].getAttribute('style')) &&\n allNodes[index].getAttribute('style').indexOf('mso-list:') >= 0) {\n if (allNodes[index].className.indexOf('MsoListParagraphCxSpFirst') >= 0 && listNodes.length > 0 &&\n listNodes[listNodes.length - 1] !== null) {\n listNodes.push(null);\n }\n listNodes.push(allNodes[index]);\n }\n if (prevflagState && (this.blockNode.indexOf(allNodes[index].nodeName.toLowerCase()) !== -1) &&\n !(allNodes[index].className &&\n allNodes[index].className.toLowerCase().indexOf('msolistparagraph') !== -1 && !isNOU(allNodes[index].getAttribute('style')) &&\n allNodes[index].getAttribute('style').indexOf('mso-list:') >= 0)) {\n listNodes.push(null);\n }\n if (this.blockNode.indexOf(allNodes[index].nodeName.toLowerCase()) !== -1) {\n if (allNodes[index].className &&\n allNodes[index].className.toLowerCase().indexOf('msolistparagraph') !== -1 && !isNOU(allNodes[index].getAttribute('style')) &&\n allNodes[index].getAttribute('style').indexOf('mso-list:') >= 0) {\n prevflagState = true;\n }\n else {\n prevflagState = false;\n }\n }\n }\n if (listNodes.length && (listNodes[listNodes.length - 1] !== null)) {\n listNodes.push(null);\n }\n return listNodes;\n };\n MsWordPaste.prototype.listConverter = function (listNodes) {\n var level;\n var data = [];\n var listFormatOverride;\n var collection = [];\n var content = '';\n var stNode;\n var currentListStyle = '';\n for (var i = 0; i < listNodes.length; i++) {\n if (listNodes[i] === null) {\n data.push({ content: this.makeConversion(collection), node: listNodes[i - 1] });\n collection = [];\n continue;\n }\n if (listNodes[i].getAttribute('style') && listNodes[i].getAttribute('style').indexOf('mso-outline-level') !== -1) {\n listNodes[i].setAttribute('style', listNodes[i].getAttribute('style').replace('mso-outline-level', 'mso-outline'));\n }\n content = listNodes[i].getAttribute('style');\n if (content && content.indexOf('level') !== -1) {\n // eslint-disable-next-line\n level = parseInt(content.charAt(content.indexOf('level') + 5), null);\n }\n else {\n level = 1;\n }\n if (content && content.indexOf('mso-list:') !== -1) {\n var msoListValue = void 0;\n if (content.match(/mso-list:[^;]+;?/)) {\n var changedContent = content.replace('\\n', '').split(' ').join('');\n msoListValue = changedContent.match(/mso-list:[^;]+;?/)[0].split(':l');\n listFormatOverride = isNOU(msoListValue) ? null : parseInt(msoListValue[1].split('level')[0], 10);\n }\n else {\n listFormatOverride = null;\n }\n }\n this.listContents = [];\n this.getListContent(listNodes[i]);\n var type = void 0;\n var listStyleType = void 0;\n var startAttr = void 0;\n var styleMarginLeft = void 0;\n if (!isNOU(this.listContents[0])) {\n type = this.listContents[0].trim().length > 1 ? 'ol' : 'ul';\n listStyleType = this.getlistStyleType(this.listContents[0], type);\n if (type === 'ol' && (i === 0 || listNodes[i - 1] === null)) {\n var startString = this.listContents[0].split('.')[0];\n var listTypes = ['A', 'a', 'I', 'i', 'α', '1', '1-']; // Add '1-' for rare list type.\n if (listTypes.indexOf(startString) === -1) {\n if (listStyleType === 'decimal') {\n // Bug in getlistStyleType() list style stype is returned as decimal for nested list with start attribute\n if (!isNaN(parseInt(startString, 10))) {\n startAttr = parseInt(startString, 10);\n }\n }\n else if (listStyleType === 'upper-alpha') {\n startAttr = (startString.split('.')[0].charCodeAt(0) - 64);\n }\n else if (listStyleType === 'lower-alpha') {\n startAttr = (startString.split('.')[0].charCodeAt(0) - 96);\n }\n else if (listStyleType === 'upper-roman') {\n startAttr = this.upperRomanNumber.indexOf(this.listContents[0].split('.')[0]) + 1;\n }\n else if (listStyleType === 'lower-roman') {\n startAttr = this.lowerRomanNumber.indexOf(this.listContents[0].split('.')[0]) + 1;\n }\n else if (listStyleType === 'lower-greek') {\n startAttr = this.lowerGreekNumber.indexOf(this.listContents[0].split('.')[0]) + 1;\n }\n }\n }\n if (listNodes[i].style.marginLeft !== '') {\n styleMarginLeft = listNodes[i].style.marginLeft;\n }\n var tempNode = [];\n for (var j = 1; j < this.listContents.length; j++) {\n tempNode.push(this.listContents[j]);\n }\n var currentClassName = void 0;\n if (!isNOU(listNodes[i].className)) {\n currentClassName = listNodes[i].className;\n }\n if (!isNOU(listNodes[i].getAttribute('style'))) {\n listNodes[i].setAttribute('style', listNodes[i].getAttribute('style').replace('text-align:start;', ''));\n listNodes[i].style.textIndent = '';\n currentListStyle = listNodes[i].getAttribute('style');\n }\n collection.push({\n listType: type, content: tempNode, nestedLevel: level,\n listFormatOverride: listFormatOverride, class: currentClassName,\n listStyle: currentListStyle, listStyleTypeName: listStyleType, start: startAttr, styleMarginLeft: styleMarginLeft\n });\n }\n }\n stNode = listNodes.shift();\n while (stNode) {\n var elemColl = [];\n for (var temp1 = 0; temp1 < data.length; temp1++) {\n if (data[temp1].node === stNode) {\n for (var index = 0; index < data[temp1].content.childNodes.length; index++) {\n elemColl.push(data[temp1].content.childNodes[index]);\n }\n for (var index = 0; index < elemColl.length; index++) {\n stNode.parentElement.insertBefore(elemColl[index], stNode);\n }\n break;\n }\n }\n stNode.remove();\n stNode = listNodes.shift();\n if (!stNode) {\n stNode = listNodes.shift();\n }\n }\n };\n MsWordPaste.prototype.getlistStyleType = function (listContent, type) {\n var currentListClass;\n if (type === 'ol') {\n var charCode = listContent.split('.')[0].charCodeAt(0);\n switch (true) {\n case this.upperRomanNumber.indexOf(listContent.split('.')[0]) > -1:\n currentListClass = 'upper-roman';\n break;\n case this.lowerRomanNumber.indexOf(listContent.split('.')[0]) > -1:\n currentListClass = 'lower-roman';\n break;\n case this.lowerGreekNumber.indexOf(listContent.split('.')[0]) > -1:\n currentListClass = 'lower-greek';\n break;\n case (charCode > 64 && charCode < 91):\n currentListClass = 'upper-alpha';\n break;\n case (charCode > 96 && charCode < 123):\n currentListClass = 'lower-alpha';\n break;\n default:\n currentListClass = 'decimal';\n break;\n }\n }\n else {\n switch (listContent.split('.')[0]) {\n case 'o':\n currentListClass = 'circle';\n break;\n case '§':\n currentListClass = 'square';\n break;\n default:\n currentListClass = 'disc';\n break;\n }\n }\n return currentListClass;\n };\n MsWordPaste.prototype.makeConversion = function (collection) {\n var root = createElement('div');\n var temp;\n var pLevel = 1;\n var prevList;\n var listCount = 0;\n var elem;\n var lfo = collection[0].listFormatOverride;\n for (var index = 0; index < collection.length; index++) {\n var listClass = ['MsoListParagraphCxSpFirst', 'MsoListParagraphCxSpMiddle', 'MsoListParagraphCxSpLast'];\n var isNormalList = false;\n for (var i = 0; i < listClass.length; i++) {\n if (listClass[i].indexOf(collection[index].class) >= 0) {\n isNormalList = true;\n break;\n }\n }\n if (!isNOU(prevList) && index !== 0 &&\n collection[index - 1].listType !== collection[index].listType &&\n !isNormalList) {\n prevList = null;\n }\n var pElement = createElement('p', { className: 'MsoNoSpacing' });\n pElement.innerHTML = collection[index].content.join(' ');\n if ((collection[index].nestedLevel === 1) &&\n (listCount === 0 || lfo !== collection[index].listFormatOverride) &&\n collection[index].content) {\n root.appendChild(temp = createElement(collection[index].listType, { className: collection[index].class }));\n prevList = createElement('li');\n prevList.appendChild(pElement);\n temp.appendChild(prevList);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n if (collection[index].class !== 'msolistparagraph') {\n temp.style.marginLeft = collection[index].styleMarginLeft;\n }\n else {\n addClass([temp], 'marginLeftIgnore');\n }\n temp.style.listStyleType = collection[index].listStyleTypeName;\n }\n else if (collection[index].nestedLevel === pLevel &&\n lfo === collection[index].listFormatOverride) {\n if (!isNOU(prevList) && !isNOU(prevList.parentElement)\n && prevList.parentElement.tagName.toLowerCase() === collection[index].listType) {\n prevList.parentElement.appendChild(prevList = createElement('li'));\n prevList.appendChild(pElement);\n }\n else if (isNOU(prevList)) {\n temp = createElement(collection[index].listType);\n temp.style.listStyleType = collection[index].listStyleTypeName;\n prevList = createElement('li');\n prevList.appendChild(pElement);\n temp.appendChild(prevList);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n root.appendChild(temp);\n }\n else {\n temp = createElement(collection[index].listType);\n temp.style.listStyleType = collection[index].listStyleTypeName;\n prevList.parentElement.parentElement.appendChild(temp);\n prevList = createElement('li');\n prevList.appendChild(pElement);\n temp.appendChild(prevList);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n }\n }\n else if (collection[index].nestedLevel > pLevel) {\n if (!isNOU(prevList)) {\n for (var j = 0; j < collection[index].nestedLevel - pLevel; j++) {\n prevList.appendChild(temp = createElement(collection[index].listType));\n prevList = createElement('li');\n if (j !== collection[index].nestedLevel - pLevel - 1 &&\n collection[index].nestedLevel - pLevel > 1) {\n prevList.style.listStyleType = 'none';\n }\n temp.appendChild(prevList);\n }\n prevList.appendChild(pElement);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n temp.style.listStyleType = collection[index].listStyleTypeName;\n }\n else {\n if (collection[index].nestedLevel > pLevel && isNormalList) {\n var initialNode = createElement(collection[index].listType);\n prevList = createElement('li');\n initialNode.appendChild(prevList);\n initialNode.style.listStyleType = 'none';\n for (var j = 0; j < collection[index].nestedLevel - 1; j++) {\n prevList.appendChild(temp = createElement(collection[index].listType));\n prevList = createElement('li');\n temp.appendChild(prevList);\n temp.style.listStyleType = 'none';\n }\n prevList.appendChild(pElement);\n root.appendChild(initialNode);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n temp.style.listStyleType = collection[index].listStyleTypeName;\n }\n else {\n root.appendChild(temp = createElement(collection[index].listType));\n prevList = createElement('li');\n prevList.appendChild(pElement);\n temp.appendChild(prevList);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n if (collection[index].class !== 'msolistparagraph') {\n temp.style.marginLeft = collection[index].styleMarginLeft;\n }\n else {\n addClass([temp], 'marginLeftIgnore');\n }\n temp.style.listStyleType = collection[index].listStyleTypeName;\n }\n }\n }\n else if (collection[index].nestedLevel === 1) {\n if (root.lastChild.tagName.toLowerCase() === collection[index].listType) {\n temp = root.lastChild;\n }\n else {\n root.appendChild(temp = createElement(collection[index].listType));\n temp.style.listStyleType = collection[index].listStyleTypeName;\n }\n prevList = createElement('li');\n prevList.appendChild(pElement);\n temp.appendChild(prevList);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n }\n else {\n elem = prevList;\n while (elem.parentElement) {\n elem = elem.parentElement;\n if (elem.attributes.getNamedItem('level')) {\n // eslint-disable-next-line\n if (parseInt(elem.attributes.getNamedItem('level').textContent, null) === collection[index].nestedLevel &&\n lfo === collection[index].listFormatOverride) {\n prevList = createElement('li');\n prevList.appendChild(pElement);\n elem.appendChild(prevList);\n break;\n // eslint-disable-next-line\n }\n else if (parseInt(elem.attributes.getNamedItem('level').textContent, null) === collection[index].nestedLevel &&\n lfo !== collection[index].listFormatOverride) {\n temp = createElement(collection[index].listType);\n prevList = createElement('li');\n temp.appendChild(prevList);\n if (collection[index].nestedLevel > 1) {\n for (var k = 0; k < collection[index].nestedLevel - 1; k++) {\n prevList.appendChild(temp = createElement(collection[index].listType));\n prevList = createElement('li');\n temp.appendChild(prevList);\n temp.style.listStyleType = 'none';\n }\n }\n prevList.appendChild(pElement);\n elem.appendChild(temp);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n temp.style.listStyleType = collection[index].listStyleTypeName;\n break;\n }\n else if (collection[index].nestedLevel > parseInt(elem.attributes.getNamedItem('level').textContent, 10)) {\n elem.appendChild(temp = createElement(collection[index].listType));\n prevList = createElement('li');\n prevList.appendChild(pElement);\n temp.appendChild(prevList);\n temp.setAttribute('level', collection[index].nestedLevel.toString());\n temp.style.listStyleType = collection[index].listStyleTypeName;\n break;\n }\n }\n continue;\n }\n }\n prevList.setAttribute('class', collection[index].class);\n prevList.setAttribute('style', (!isNOU(collection[index].listStyle) ? collection[index].listStyle : ''));\n pLevel = collection[index].nestedLevel;\n lfo = collection[index].listFormatOverride;\n listCount++;\n if (!isNOU(collection[index].start && collection[index].start !== 1 && collection[index].listType === 'ol')) {\n temp.setAttribute('start', collection[index].start.toString());\n }\n }\n return root;\n };\n MsWordPaste.prototype.getListContent = function (elem) {\n var pushContent = '';\n var firstChild = elem.firstElementChild;\n if (firstChild.textContent.trim() === '' && !isNOU(firstChild.firstElementChild) &&\n firstChild.firstElementChild.nodeName === 'IMG') {\n pushContent = elem.innerHTML.trim();\n this.listContents.push('');\n this.listContents.push(pushContent);\n }\n else {\n //Add to support separate list which looks like same list and also to add all tags as it is inside list\n if (firstChild.childNodes.length > 0) {\n var listIgnoreTag = firstChild.querySelectorAll('[style*=\"mso-list\"]');\n for (var i = 0; i < listIgnoreTag.length; i++) {\n listIgnoreTag[i].setAttribute('style', listIgnoreTag[i].getAttribute('style').replace(/\\n/g, ''));\n }\n var listOrder = firstChild.querySelector('span[style=\"mso-list:Ignore\"]');\n if (!isNOU(listOrder)) {\n this.listContents.push(listOrder.textContent.trim());\n detach(listOrder);\n this.removingComments(elem);\n this.removeUnwantedElements(elem);\n }\n }\n }\n this.listContents.push(elem.innerHTML);\n };\n MsWordPaste.prototype.processMargin = function (element) {\n var liChildren = element.querySelectorAll('li');\n if (liChildren.length > 0) {\n for (var i = 0; i < liChildren.length; i++) {\n if (!isNOU((liChildren[i]).style.marginLeft) && !liChildren[i].parentElement.classList.contains('marginLeftIgnore')) {\n (liChildren[i]).style.marginLeft = '';\n }\n }\n }\n var tableChildren = element.querySelectorAll('table');\n if (tableChildren.length > 0) {\n for (var i = 0; i < tableChildren.length; i++) {\n if (!isNOU((tableChildren[i]).style.marginLeft) &&\n (tableChildren[i]).style.marginLeft.indexOf('-') >= 0) {\n (tableChildren[i]).style.marginLeft = '';\n }\n }\n }\n var ignoredNode = element.querySelectorAll('.marginLeftIgnore li');\n if (ignoredNode.length > 0) {\n for (var i = 0; i < ignoredNode.length; i++) {\n if (!isNOU((ignoredNode[i]).style.marginLeft) && (ignoredNode[i]).style.marginLeft !== '') {\n var marginLeft = (ignoredNode[i]).style.marginLeft;\n var marginLeftValue = parseFloat(marginLeft.split('in')[0]);\n var result = marginLeftValue - 0.5;\n (ignoredNode[i]).style.marginLeft = result.toString() + 'in';\n }\n }\n }\n };\n MsWordPaste.prototype.removeEmptyAnchorTag = function (element) {\n var removableElement = element.querySelectorAll('a:not([href])');\n for (var j = removableElement.length - 1; j >= 0; j--) {\n var parentElem = removableElement[j].parentNode;\n while (removableElement[j].firstChild) {\n parentElem.insertBefore(removableElement[j].firstChild, removableElement[j]);\n }\n parentElem.removeChild(removableElement[j]);\n }\n };\n MsWordPaste.prototype.findSource = function (element) {\n var metaNodes = element.querySelectorAll('meta');\n for (var i = 0; i < metaNodes.length; i++) {\n var metaNode = metaNodes[i];\n var content = metaNode.getAttribute('content');\n var name_1 = metaNode.getAttribute('name');\n if (name_1 && name_1.toLowerCase().indexOf('generator') >= 0 && content && content.toLowerCase().indexOf('microsoft') >= 0) {\n for (var j = 0; j < PASTE_SOURCE.length; j++) {\n if (content.toLowerCase().indexOf(PASTE_SOURCE[j]) >= 0) {\n return PASTE_SOURCE[j];\n }\n }\n }\n }\n return 'html';\n };\n return MsWordPaste;\n}());\nexport { MsWordPaste };\n","import * as CONSTANT from '../base/constant';\nimport { InsertHtml } from './inserthtml';\n/**\n * Insert a Text Node or Text\n *\n * @hidden\n\n */\nvar InsertTextExec = /** @class */ (function () {\n /**\n * Constructor for creating the InsertText plugin\n *\n * @param {EditorManager} parent - specifies the parent element\n * @hidden\n\n */\n function InsertTextExec(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n InsertTextExec.prototype.addEventListener = function () {\n this.parent.observer.on(CONSTANT.INSERT_TEXT_TYPE, this.insertText, this);\n };\n InsertTextExec.prototype.insertText = function (e) {\n var node = document.createTextNode(e.value);\n InsertHtml.Insert(this.parent.currentDocument, node, this.parent.editableElement);\n if (e.callBack) {\n e.callBack({\n requestType: e.subCommand,\n editorMode: 'HTML',\n event: e.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n return InsertTextExec;\n}());\nexport { InsertTextExec };\n","import * as EVENTS from './../../common/constant';\nimport { InsertHtml } from './inserthtml';\nvar EmojiPickerAction = /** @class */ (function () {\n function EmojiPickerAction(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n EmojiPickerAction.prototype.addEventListener = function () {\n this.parent.observer.on(EVENTS.EMOJI_PICKER_ACTIONS, this.emojiInsert, this);\n };\n EmojiPickerAction.prototype.emojiInsert = function (args) {\n var node = document.createTextNode(args.value);\n var selection = this.parent.currentDocument.getSelection();\n var range = selection.getRangeAt(0);\n var cursorPos = range.startOffset;\n for (var i = cursorPos - 1; i >= cursorPos - 15; i--) {\n var prevChar_1 = selection.focusNode.textContent.substring(i - 1, i);\n var isPrevSpace_1 = /:$/.test(prevChar_1);\n if (isPrevSpace_1) {\n this.beforeApplyFormat(true);\n break;\n }\n }\n var colon = /:$/.test(selection.focusNode.textContent.charAt(cursorPos - 1));\n var prevChar = selection.focusNode.textContent.charAt(cursorPos - 2);\n var isPrevSpace = /\\s/.test(prevChar);\n if (colon && (isPrevSpace || selection.focusOffset === 1)) {\n this.beforeApplyFormat(true);\n }\n InsertHtml.Insert(this.parent.currentDocument, node, this.parent.editableElement);\n if (args.callBack) {\n args.callBack({\n requestType: args.subCommand,\n editorMode: 'HTML',\n event: args.event,\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n EmojiPickerAction.prototype.beforeApplyFormat = function (isBlockFormat) {\n var range1 = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var node = this.parent.nodeSelection.getNodeCollection(range1)[0];\n var blockNewLine = !(node.parentElement.innerHTML.replace(/ |
    /g, '').trim() === ':' || node.textContent.trim().indexOf('/') === 0);\n var startNode = node;\n if (blockNewLine && isBlockFormat) {\n while (startNode !== this.parent.editableElement) {\n startNode = startNode.parentElement;\n }\n }\n var startPoint = range1.startOffset;\n while (this.parent.nodeSelection.getRange(document).toString().indexOf(':') === -1) {\n this.parent.nodeSelection.setSelectionText(document, node, node, startPoint, range1.endOffset);\n startPoint--;\n }\n var range2 = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var node2 = this.parent.nodeCutter.GetSpliceNode(range2, node);\n node2.parentNode.removeChild(node2);\n };\n return EmojiPickerAction;\n}());\nexport { EmojiPickerAction };\n","import { closest, createElement, detach, isNullOrUndefined as isNOU, removeClass } from '@syncfusion/ej2-base';\nimport * as EVENTS from '../../common/constant';\nimport { SelectionCommands } from '../plugin';\nvar FormatPainterActions = /** @class */ (function () {\n function FormatPainterActions(parent, options) {\n this.INVALID_TAGS = ['A', 'AUDIO', 'IMG', 'VIDEO', 'IFRAME'];\n this.parent = parent;\n this.settings = options;\n this.addEventListener();\n this.setDeniedFormats();\n }\n FormatPainterActions.prototype.addEventListener = function () {\n this.parent.observer.on(EVENTS.FORMAT_PAINTER_ACTIONS, this.actionHandler, this);\n this.parent.observer.on(EVENTS.MODEL_CHANGED_PLUGIN, this.onPropertyChanged, this);\n };\n FormatPainterActions.prototype.onPropertyChanged = function (prop) {\n if (prop && prop.module === 'formatPainter') {\n if (!isNOU(prop.newProp.formatPainterSettings.allowedFormats)) {\n this.settings.allowedFormats = prop.newProp.formatPainterSettings.allowedFormats;\n }\n if (!isNOU(prop.newProp.formatPainterSettings.deniedFormats)) {\n this.settings.deniedFormats = prop.newProp.formatPainterSettings.deniedFormats;\n this.setDeniedFormats();\n }\n }\n };\n FormatPainterActions.prototype.removeEventListener = function () {\n this.parent.observer.off(EVENTS.FORMAT_PAINTER_ACTIONS, this.actionHandler);\n this.parent.observer.off(EVENTS.MODEL_CHANGED_PLUGIN, this.onPropertyChanged);\n };\n /**\n * Destroys the format painter.\n *\n * @function destroy\n * @returns {void}\n * @hidden\n\n */\n FormatPainterActions.prototype.destroy = function () {\n this.removeEventListener();\n this.INVALID_TAGS = null;\n this.copyCollection = null;\n this.deniedFormatsCollection = null;\n this.newElem = null;\n this.newElemLastChild = null;\n this.settings = null;\n this.parent = null;\n };\n FormatPainterActions.prototype.actionHandler = function (args) {\n this.settings.allowedContext = ['Text', 'List', 'Table'];\n if (!isNOU(args) && !isNOU(args.item) && !isNOU(args.item.formatPainterAction)) {\n switch (args.item.formatPainterAction) {\n case 'format-copy':\n this.copyAction();\n break;\n case 'format-paste':\n this.pasteAction();\n break;\n case 'escape':\n this.escapeAction();\n break;\n }\n this.callBack(args);\n }\n };\n FormatPainterActions.prototype.callBack = function (event) {\n if (event.callBack) {\n event.callBack({\n requestType: 'FormatPainter',\n action: event.item.formatPainterAction,\n event: event.event,\n editorMode: 'HTML',\n range: this.parent.nodeSelection.getRange(this.parent.currentDocument),\n elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)\n });\n }\n };\n FormatPainterActions.prototype.generateElement = function () {\n var copyCollection = this.copyCollection.slice(); // To clone without reversing the collcection array\n copyCollection.reverse();\n var length = copyCollection.length;\n var elemCollection = createElement('div', { className: 'e-format-paste-wrapper' });\n var lastAppendChild;\n for (var i = 0; i < length; i++) {\n var _a = copyCollection[i], attrs = _a.attrs, className = _a.className, styles = _a.styles, tagName = _a.tagName;\n var elem = createElement(tagName);\n if (className !== '') {\n elem.className = className;\n }\n for (var i_1 = 0; i_1 < attrs.length; i_1++) {\n var property = attrs[i_1].name;\n var value = attrs[i_1].value;\n elem.setAttribute(property, value);\n }\n for (var i_2 = 0; i_2 < styles.length; i_2++) {\n var property = styles[i_2].property;\n var value = styles[i_2].value;\n var priority = styles[i_2].priority;\n elem.style.setProperty(property, value, priority);\n }\n if (elemCollection.childElementCount === 0) {\n elemCollection.append(elem);\n lastAppendChild = elem;\n }\n else {\n lastAppendChild.append(elem);\n lastAppendChild = elem;\n }\n }\n var elemChild = this.removeDeniedFormats(elemCollection);\n var currentElem = elemChild;\n while (currentElem) {\n if (currentElem.firstChild === null) {\n lastAppendChild = currentElem;\n currentElem = undefined;\n }\n else {\n currentElem = currentElem.firstChild;\n }\n }\n this.newElem = elemChild;\n this.newElemLastChild = lastAppendChild;\n };\n FormatPainterActions.prototype.pasteAction = function () {\n if (isNOU(this.copyCollection) || this.copyCollection.length === 0) {\n this.paintPlainTextFormat();\n return;\n }\n this.insertFormatNode(this.newElem, this.newElemLastChild);\n };\n FormatPainterActions.prototype.removeDeniedFormats = function (parentElement) {\n if (!isNOU(this.deniedFormatsCollection) && this.deniedFormatsCollection.length > 0) {\n var deniedPropArray = this.deniedFormatsCollection;\n var length_1 = deniedPropArray.length;\n for (var i = 0; i < length_1; i++) {\n var tag = deniedPropArray[i].tag;\n if (deniedPropArray[i].tag) {\n var elementsList = parentElement.querySelectorAll(tag);\n for (var j = 0; j < elementsList.length; j++) {\n if (deniedPropArray[i].classes.length > 0) {\n var classes = deniedPropArray[i].classes;\n var classLength = classes.length;\n for (var k = 0; k < classLength; k++) {\n if (elementsList[j].classList.contains(classes[k])) {\n removeClass([elementsList[j]], classes[k].trim());\n }\n }\n if (elementsList[j].classList.length === 0) {\n elementsList[j].removeAttribute('class');\n }\n }\n if (deniedPropArray[i].styles.length > 0) {\n var styles = deniedPropArray[i].styles;\n var styleLength = styles.length;\n for (var k = 0; k < styleLength; k++) {\n elementsList[j].style.removeProperty(styles[k].trim());\n }\n if (elementsList[j].style.length === 0) {\n elementsList[j].removeAttribute('style');\n }\n }\n if (deniedPropArray[i].attributes.length > 0) {\n var attributes = deniedPropArray[i].attributes;\n var attributeLength = attributes.length;\n for (var k = 0; k < attributeLength; k++) {\n elementsList[j].removeAttribute(attributes[k].trim());\n }\n }\n }\n }\n }\n }\n return parentElement.firstElementChild;\n };\n FormatPainterActions.prototype.copyAction = function () {\n var copyCollection = [];\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var domSelection = this.parent.nodeSelection;\n var nodes = range.collapsed ? domSelection.getSelectionNodeCollection(range) :\n domSelection.getSelectionNodeCollectionBr(range);\n if (nodes.length === 0 && domSelection.getSelectionNodeCollectionBr(range).length === 0) {\n return;\n }\n else {\n nodes = nodes.length === 0 ? domSelection.getSelectionNodeCollectionBr(range) : nodes;\n }\n var parentElem = nodes[0].parentElement;\n var currentContext = this.findCurrentContext(parentElem);\n var allowedRulesArray = this.settings.allowedFormats.indexOf(';') > -1 ? this.settings.allowedFormats.split(';') :\n [this.settings.allowedFormats];\n for (var i = 0; i < allowedRulesArray.length; i++) {\n allowedRulesArray[i] = allowedRulesArray[i].trim();\n }\n var _a = this.getRangeParentElem(currentContext, parentElem), rangeParentElem = _a[0], context = _a[1];\n if (currentContext === null) {\n currentContext = context;\n }\n if (!isNOU(currentContext) && this.settings.allowedContext.indexOf(currentContext) > -1) {\n if (range.startContainer.nodeName === '#text') {\n parentElem = range.startContainer.parentElement;\n }\n var lastElement = parentElem;\n do {\n if (allowedRulesArray.indexOf(parentElem.nodeName.toLowerCase()) > -1) {\n var allAttributes = parentElem.attributes;\n var attribute = [];\n for (var i = 0; i < allAttributes.length; i++) {\n if (allAttributes[i].name !== 'class' && allAttributes[i].name !== 'style') {\n attribute.push(allAttributes[i]);\n }\n }\n var classes = parentElem.className;\n var allStyles = parentElem.style;\n var styleProp = [];\n for (var i = 0; i < allStyles.length; i++) {\n var property = allStyles[i];\n var value = allStyles.getPropertyValue(property);\n var priority = allStyles.getPropertyPriority(property);\n styleProp.push({ property: property, value: value, priority: priority });\n }\n copyCollection.push({\n attrs: attribute, className: classes, styles: styleProp, tagName: parentElem.nodeName\n });\n }\n if (rangeParentElem === parentElem) {\n parentElem = undefined;\n }\n else if (!isNOU(parentElem.parentElement)) {\n parentElem = parentElem.parentElement;\n }\n if (lastElement === parentElem) {\n break;\n }\n } while (!isNOU(parentElem) || parentElem === this.parent.editableElement);\n this.copyCollection = copyCollection;\n }\n this.generateElement();\n };\n FormatPainterActions.prototype.getRangeParentElem = function (currentContext, rangeParent) {\n var startContainer = rangeParent;\n var rangeParentELem;\n if (startContainer.nodeType === 3) {\n startContainer = startContainer.parentElement;\n }\n switch (currentContext) {\n case 'Table':\n rangeParentELem = closest(startContainer, 'td');\n if (isNOU(rangeParentELem)) {\n rangeParentELem = closest(startContainer, 'th');\n }\n break;\n case 'List':\n rangeParentELem = closest(startContainer, 'li');\n break;\n case 'Text':\n rangeParentELem = closest(startContainer, 'p');\n break;\n }\n if (isNOU(rangeParentELem)) {\n var nearBlockParentName = this.getNearestBlockParentElement(rangeParent);\n if (!isNOU(nearBlockParentName) && nearBlockParentName !== 'UL' &&\n nearBlockParentName !== 'OL' && nearBlockParentName !== 'LI') {\n rangeParentELem = closest(startContainer, nearBlockParentName);\n currentContext = 'Text';\n }\n }\n if (currentContext === 'List') {\n rangeParentELem = rangeParentELem.parentElement;\n }\n return [rangeParentELem, currentContext];\n };\n FormatPainterActions.prototype.getNearestBlockParentElement = function (rangeParent) {\n var node = rangeParent;\n if (node.nodeType === 3) {\n node = node.parentNode;\n }\n // iterate untill the content editable div\n while (node && node !== this.parent.editableElement) {\n // If true return the block node name.\n if (!isNOU(node) && this.isBlockElement(node)) {\n return node.nodeName;\n }\n // if false re assign node to parent node\n node = node.parentNode;\n }\n return null;\n };\n FormatPainterActions.prototype.isBlockElement = function (node) {\n var blockTags = ['P', 'DIV', 'UL', 'OL', 'LI', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6',\n 'ADDRESS', 'ARTICLE', 'ASIDE', 'BLOCKQUOTE', 'FIGCAPTION', 'FIGURE', 'FOOTER', 'HEADER',\n 'HR', 'MAIN', 'NAV', 'SECTION', 'SUMMARY', 'PRE'];\n return blockTags.indexOf(node.nodeName) > -1;\n };\n FormatPainterActions.prototype.escapeAction = function () {\n this.copyCollection = [];\n };\n FormatPainterActions.prototype.paintPlainTextFormat = function () {\n var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);\n var domSelection = this.parent.nodeSelection;\n var nodes = range.collapsed ? domSelection.getSelectionNodeCollection(range) :\n domSelection.getSelectionNodeCollectionBr(range);\n var isInValid;\n if (nodes.length > 1) {\n for (var i = 0; i < nodes.length; i++) {\n isInValid = this.validateELementTag(nodes[i]);\n }\n }\n else {\n isInValid = this.validateELementTag(range.startContainer) && this.validateELementTag(range.endContainer);\n }\n if (!isInValid) {\n this.parent.execCommand('Clear', 'ClearFormat', null, null);\n }\n };\n FormatPainterActions.prototype.validateELementTag = function (node) {\n if (node.nodeType === 3) {\n node = node.parentElement;\n }\n return this.INVALID_TAGS.indexOf(node.tagName) > -1;\n };\n FormatPainterActions.prototype.findCurrentContext = function (parentElem) {\n var closestParagraph = closest(parentElem, 'p');\n var closestList = closest(parentElem, 'li');\n if (closestParagraph && !closestList) {\n return 'Text';\n }\n else if (closest(parentElem, 'li')) {\n if (!isNOU(closestParagraph) && !isNOU(closestList) && closestParagraph.textContent.trim() !== closestList.textContent.trim()) {\n return 'Text';\n }\n return 'List';\n }\n else if (closest(parentElem, 'td') || closest(parentElem, 'tr') || closest(parentElem, 'th')) {\n return 'Table';\n }\n return null;\n };\n FormatPainterActions.prototype.insertFormatNode = function (elem, lastChild) {\n var clonedElem = elem.cloneNode(true);\n if (!this.isBlockElement(elem)) {\n var newBlockElem = createElement('P');\n newBlockElem.appendChild(elem);\n clonedElem = newBlockElem.cloneNode(true);\n }\n var endNode = this.parent.editableElement;\n var docElement = this.parent.currentDocument;\n var childElem = clonedElem.firstChild;\n var inlineElement;\n while (childElem) {\n if (this.isBlockElement(childElem)) {\n childElem = childElem.firstChild;\n }\n else {\n inlineElement = childElem.parentNode.removeChild(childElem);\n break;\n }\n }\n var formatValues = {\n element: inlineElement,\n lastChild: lastChild\n };\n SelectionCommands.applyFormat(docElement, null, endNode, 'P', 'formatPainter', null, formatValues);\n var range = this.parent.nodeSelection.getRange(docElement);\n var isCollapsed = range.collapsed;\n var blockNodes = this.parent.domNode.blockNodes();\n var isListCopied = this.isListCopied();\n if (isListCopied) {\n for (var i = 0; i < blockNodes.length; i++) {\n if (closest(blockNodes[i], 'li')) {\n blockNodes[i] = closest(blockNodes[i], 'li');\n }\n }\n }\n var isFullNodeSelected = false;\n if (blockNodes.length === 1) {\n isFullNodeSelected = blockNodes[0].textContent.trim() === range.toString().trim();\n }\n if (this.isBlockElement(clonedElem) && isCollapsed || blockNodes.length > 1 || isFullNodeSelected) {\n this.insertBlockNode(clonedElem, range, docElement, blockNodes);\n }\n };\n FormatPainterActions.prototype.isListCopied = function () {\n var isListCopied = false;\n for (var i = 0; i < this.copyCollection.length; i++) {\n if (this.copyCollection[i].tagName === 'OL' || this.copyCollection[i].tagName === 'UL') {\n isListCopied = true;\n break;\n }\n }\n return isListCopied;\n };\n FormatPainterActions.prototype.insertBlockNode = function (element, range, docElement, nodes) {\n var domSelection = this.parent.nodeSelection;\n var saveSelection = domSelection.save(range, docElement);\n this.parent.domNode.setMarker(saveSelection);\n var listElement; // To clone to multiple list elements\n var cloneListParentNode;\n var sameListType = false;\n if (element.nodeName === 'UL' || element.nodeName === 'OL') {\n cloneListParentNode = element.cloneNode(true);\n listElement = cloneListParentNode.firstChild;\n }\n var cloneElementNode = isNOU(cloneListParentNode) ? element : element.firstChild;\n for (var index = 0; index < nodes.length; index++) {\n if (this.INVALID_TAGS.indexOf(nodes[index].nodeName) > -1 ||\n nodes[index].querySelectorAll('img,audio,video,iframe').length > 0) {\n continue;\n }\n var cloneParentNode = cloneElementNode.cloneNode(false);\n // Appending all the child elements\n while (nodes[index].firstChild) {\n if (nodes[index].textContent.trim().length !== 0) {\n cloneParentNode.appendChild(nodes[index].firstChild);\n }\n else {\n nodes[index].removeChild(nodes[index].firstChild);\n }\n }\n if (nodes[index].nodeName === 'TD' || nodes[index].nodeName === 'TH') {\n if (isNOU(cloneListParentNode)) {\n nodes[index].appendChild(cloneParentNode);\n continue;\n }\n else if (index === 0 && !isNOU(cloneListParentNode)) {\n nodes[index].appendChild(cloneListParentNode);\n cloneListParentNode.appendChild(cloneParentNode);\n continue;\n }\n else {\n nodes[index].appendChild(cloneParentNode);\n continue;\n }\n }\n if (!isNOU(cloneListParentNode)) {\n sameListType = this.isSameListType(element, nodes[index]);\n }\n if (cloneParentNode.nodeName === 'LI' && !sameListType) {\n this.insertNewList(range, nodes, index, cloneListParentNode, cloneParentNode);\n }\n else if (sameListType) {\n this.insertSameList(nodes, index, cloneListParentNode, cloneParentNode);\n }\n else {\n nodes[index].parentNode.replaceChild(cloneParentNode, nodes[index]);\n }\n /**Removing the inserted block node in list and appending to previous element sibling */\n if (cloneParentNode.nodeName !== 'LI' && (cloneParentNode.parentElement.nodeName === 'OL' ||\n cloneParentNode.parentElement.nodeName === 'UL')) {\n var parent_1 = cloneParentNode.parentElement;\n // Cutting single ul or ol to two ul or ol based on the range\n this.parent.nodeCutter.SplitNode(range, parent_1, true);\n if (!isNOU(parent_1.previousElementSibling)) {\n parent_1.previousElementSibling.after(cloneParentNode);\n // To remove the nested list items out of the block element\n if (cloneParentNode.childNodes.length > 1) {\n for (var j = 0; j < cloneParentNode.childNodes.length; j++) {\n var currentChild = cloneParentNode.childNodes[j];\n if (currentChild.nodeName === 'OL' || currentChild.nodeName === 'UL') {\n cloneParentNode.after(currentChild);\n }\n }\n }\n }\n else {\n parent_1.parentElement.prepend(cloneParentNode);\n }\n }\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n !isNOU(listElement) ? detach(listElement) : false;\n this.cleanEmptyLists();\n var save = this.parent.domNode.saveMarker(saveSelection, null);\n save.restore();\n };\n FormatPainterActions.prototype.insertNewList = function (range, nodes, index, cloneListParentNode, cloneParentNode) {\n // Appending the li nodes to the ol or ul node\n if (index === 0) {\n var nodeName = nodes[index].nodeName;\n nodes[index] = nodes[index].parentNode.replaceChild(cloneListParentNode, nodes[index]);\n var parent_2 = nodeName === 'LI' ? cloneListParentNode.parentElement\n : cloneListParentNode;\n // Splicing and then inserting the node to previous element sibling of the Listparent.parent\n this.parent.nodeCutter.SplitNode(range, parent_2, true);\n if (nodes[index].nodeName === 'LI' && !isNOU(parent_2)) {\n cloneListParentNode.append(cloneParentNode);\n if (!isNOU(parent_2.parentNode)) {\n parent_2.parentNode.insertBefore(cloneListParentNode, parent_2);\n }\n }\n else {\n if (!isNOU(parent_2)) {\n if (!isNOU(parent_2.previousElementSibling) && parent_2.previousElementSibling.nodeName === cloneListParentNode.nodeName) {\n var currentParent = parent_2.previousElementSibling;\n currentParent.append(cloneParentNode);\n while (currentParent.firstChild) {\n cloneListParentNode.append(currentParent.firstChild);\n }\n }\n else if (!isNOU(parent_2.nextElementSibling) && parent_2.nextElementSibling.nodeName === cloneListParentNode.nodeName) {\n var currentParent = parent_2.nextElementSibling;\n currentParent.prepend(cloneParentNode);\n while (currentParent.firstChild) {\n cloneListParentNode.append(currentParent.firstChild);\n }\n }\n else {\n cloneListParentNode.append(cloneParentNode);\n }\n }\n else {\n cloneListParentNode.append(cloneParentNode);\n }\n }\n }\n else {\n cloneListParentNode.append(cloneParentNode);\n }\n this.detachEmptyBlockNodes(nodes[index]);\n };\n FormatPainterActions.prototype.insertSameList = function (nodes, index, cloneListParentNode, cloneParentNode) {\n if (index === 0) {\n if (!isNOU(nodes[index].parentNode) && (nodes[index].parentNode.nodeName === 'UL' || nodes[index].parentNode.nodeName === 'OL')) {\n // append the nodes[index].parentNode.childNodes to the clonelistparentnode\n if (nodes.length === 1) {\n // When clicked with cursor in the single list item\n while (cloneParentNode.firstChild) {\n nodes[index].append(cloneParentNode.firstChild);\n }\n for (var i = 0; i < nodes[index].parentNode.childNodes.length; i++) {\n var currentChild = nodes[index].parentNode.childNodes[i];\n cloneListParentNode.append(currentChild.cloneNode(true));\n }\n }\n else {\n cloneListParentNode.append(cloneParentNode);\n }\n // replace the older ol and ul with new ol and ul of clonelistparentnode\n nodes[index].parentNode.parentNode.replaceChild(cloneListParentNode, nodes[index].parentNode);\n }\n }\n else {\n cloneListParentNode.append(cloneParentNode);\n }\n this.detachEmptyBlockNodes(nodes[index]);\n };\n FormatPainterActions.prototype.isSameListType = function (element, node) {\n var isSameListType = false;\n var nearestListNode = closest(node, 'ol, ul');\n if (!isNOU(nearestListNode) && nearestListNode.querySelectorAll('li').length > 0) {\n if (nearestListNode.nodeName === element.nodeName) {\n isSameListType = true;\n }\n else {\n isSameListType = false;\n }\n }\n return isSameListType;\n };\n FormatPainterActions.prototype.cleanEmptyLists = function () {\n var listElem = this.parent.editableElement.querySelectorAll('ol, ul');\n for (var i = 0; i < listElem.length; i++) {\n if (listElem[i].textContent.trim() === '') {\n detach(listElem[i]);\n }\n }\n };\n FormatPainterActions.prototype.setDeniedFormats = function () {\n var deniedFormatsCollection = [];\n if (isNOU(this.settings) || isNOU(this.settings.deniedFormats)) {\n return;\n }\n var deniedFormats = this.settings.deniedFormats.indexOf(';') > -1 ? this.settings.deniedFormats.split(';') :\n [this.settings.deniedFormats];\n var length = deniedFormats.length;\n for (var i = 0; i < length; i++) {\n var formatString = deniedFormats[i];\n if (formatString !== '') {\n formatString.trim();\n var collection = this.makeDeniedFormatsCollection(formatString);\n if (!isNOU(collection)) {\n deniedFormatsCollection.push(collection);\n }\n }\n }\n this.deniedFormatsCollection = deniedFormatsCollection;\n };\n FormatPainterActions.prototype.detachEmptyBlockNodes = function (node) {\n if (!isNOU(node) && node.textContent.trim() === '') {\n detach(node);\n }\n };\n FormatPainterActions.prototype.makeDeniedFormatsCollection = function (value) {\n var openParenIndex = value.indexOf('(');\n var closeParenIndex = value.indexOf(')');\n var openBracketIndex = value.indexOf('[');\n var closeBracketIndex = value.indexOf(']');\n var openBraceIndex = value.indexOf('{');\n var closeBraceIndex = value.indexOf('}');\n var classes = [];\n var attributes = '';\n var styles = '';\n var tagName = '';\n var classList = [];\n var attributesList = [];\n var stylesList = [];\n if (openParenIndex > -1 && closeParenIndex > -1) {\n classes = value.substring(openParenIndex + 1, closeParenIndex).split(' ');\n classList = classes[0].split(')')[0].split(',');\n }\n if (openBracketIndex > -1 && closeBracketIndex > -1) {\n attributes = value.substring(openBracketIndex + 1, closeBracketIndex);\n attributesList = attributes.split(',');\n }\n if (openBraceIndex > -1 && closeBraceIndex > -1) {\n styles = value.substring(openBraceIndex + 1, closeBraceIndex);\n stylesList = styles.split(',');\n }\n var openIndexArray = [openParenIndex, openBracketIndex, openBraceIndex];\n openIndexArray = openIndexArray.filter(function (index) { return index > -1; });\n var len = openIndexArray.length;\n var min;\n if (len === 1) {\n min = openIndexArray[0];\n }\n else if (len === 2) {\n min = Math.min(openIndexArray[0], openIndexArray[1]);\n }\n else if (len === 3) {\n min = Math.min(openIndexArray[0], openIndexArray[1], openIndexArray[2]);\n }\n tagName = value.substring(0, min);\n tagName = tagName.trim();\n return ({\n tag: tagName, styles: stylesList, classes: classList,\n attributes: attributesList\n });\n };\n return FormatPainterActions;\n}());\nexport { FormatPainterActions };\n","import { Observer } from '@syncfusion/ej2-base';\nimport * as CONSTANT from './constant';\nimport { Lists } from './../plugin/lists';\nimport { NodeSelection } from './../../selection/index';\nimport { DOMNode } from './../plugin/dom-node';\nimport { Formats } from './../plugin/formats';\nimport { LinkCommand } from './../plugin/link';\nimport { Alignments } from './../plugin/alignments';\nimport { Indents } from './../plugin/indents';\nimport { ImageCommand } from './../plugin/image';\nimport { AudioCommand } from './../plugin/audio';\nimport { VideoCommand } from './../plugin/video';\nimport { TableCommand } from './../plugin/table';\nimport { SelectionBasedExec } from './../plugin/selection-exec';\nimport { InsertHtmlExec } from './../plugin/inserthtml-exec';\nimport { ClearFormatExec } from './../plugin/clearformat-exec';\nimport { UndoRedoManager } from './../plugin/undo';\nimport { MsWordPaste } from '../plugin/ms-word-clean-up';\nimport * as EVENTS from './../../common/constant';\nimport { InsertTextExec } from '../plugin/insert-text';\nimport { NodeCutter } from '../plugin/nodecutter';\nimport { FormatPainterActions } from '../plugin/format-painter-actions';\nimport { EmojiPickerAction } from '../plugin/emoji-picker-action';\n/**\n * EditorManager internal component\n *\n * @hidden\n\n */\nvar EditorManager = /** @class */ (function () {\n /**\n * Constructor for creating the component\n *\n * @hidden\n\n * @param {ICommandModel} options - specifies the command Model\n */\n function EditorManager(options) {\n this.currentDocument = options.document;\n this.editableElement = options.editableElement;\n this.nodeSelection = new NodeSelection();\n this.nodeCutter = new NodeCutter();\n this.domNode = new DOMNode(this.editableElement, this.currentDocument);\n this.observer = new Observer(this);\n this.listObj = new Lists(this);\n this.formatObj = new Formats(this);\n this.alignmentObj = new Alignments(this);\n this.indentsObj = new Indents(this);\n this.linkObj = new LinkCommand(this);\n this.imgObj = new ImageCommand(this);\n this.audioObj = new AudioCommand(this);\n this.videoObj = new VideoCommand(this);\n this.selectionObj = new SelectionBasedExec(this);\n this.inserthtmlObj = new InsertHtmlExec(this);\n this.insertTextObj = new InsertTextExec(this);\n this.clearObj = new ClearFormatExec(this);\n this.tableObj = new TableCommand(this);\n this.undoRedoManager = new UndoRedoManager(this, options.options);\n this.msWordPaste = new MsWordPaste(this);\n this.formatPainterEditor = new FormatPainterActions(this, options.formatPainterSettings);\n this.emojiPickerObj = new EmojiPickerAction(this);\n this.wireEvents();\n }\n EditorManager.prototype.wireEvents = function () {\n this.observer.on(EVENTS.KEY_DOWN, this.editorKeyDown, this);\n this.observer.on(EVENTS.KEY_UP, this.editorKeyUp, this);\n this.observer.on(EVENTS.KEY_UP, this.editorKeyUp, this);\n this.observer.on(EVENTS.MODEL_CHANGED, this.onPropertyChanged, this);\n this.observer.on(EVENTS.MS_WORD_CLEANUP, this.onWordPaste, this);\n this.observer.on(EVENTS.ON_BEGIN, this.onBegin, this);\n this.observer.on(EVENTS.MOUSE_DOWN, this.editorMouseDown, this);\n };\n EditorManager.prototype.onWordPaste = function (e) {\n this.observer.notify(EVENTS.MS_WORD_CLEANUP_PLUGIN, e);\n };\n EditorManager.prototype.onPropertyChanged = function (props) {\n this.observer.notify(EVENTS.MODEL_CHANGED_PLUGIN, props);\n };\n EditorManager.prototype.editorKeyDown = function (e) {\n this.observer.notify(EVENTS.KEY_DOWN_HANDLER, e);\n };\n EditorManager.prototype.editorKeyUp = function (e) {\n this.observer.notify(EVENTS.KEY_UP_HANDLER, e);\n };\n EditorManager.prototype.onBegin = function (e) {\n this.observer.notify(EVENTS.SPACE_ACTION, e);\n };\n /* eslint-disable */\n /**\n * execCommand\n *\n * @param {ExecCommand} command - specifies the execution command\n * @param {T} value - specifes the value.\n * @param {Event} event - specifies the call back event\n * @param {Function} callBack - specifies the function\n * @param {string} text - specifies the string value\n * @param {T} exeValue - specifies the values to be executed\n * @param {string} selector - specifies the selector values\n * @returns {void}\n * @hidden\n\n */\n /* eslint-enable */\n EditorManager.prototype.execCommand = function (command, value, event, callBack, text, exeValue, selector, enterAction) {\n switch (command.toLowerCase()) {\n case 'lists':\n this.observer.notify(EVENTS.LIST_TYPE, { subCommand: value, event: event, callBack: callBack,\n selector: selector, item: exeValue, enterAction: enterAction });\n break;\n case 'formats':\n this.observer.notify(EVENTS.FORMAT_TYPE, { subCommand: value, event: event, callBack: callBack,\n selector: selector, exeValue: exeValue, enterAction: enterAction\n });\n break;\n case 'alignments':\n this.observer.notify(CONSTANT.ALIGNMENT_TYPE, {\n subCommand: value, event: event, callBack: callBack,\n selector: selector, value: exeValue, enterAction: enterAction\n });\n break;\n case 'indents':\n this.observer.notify(CONSTANT.INDENT_TYPE, {\n subCommand: value, event: event, callBack: callBack,\n selector: selector, enterAction: enterAction\n });\n break;\n case 'links':\n this.observer.notify(CONSTANT.LINK, { command: command, value: value, item: exeValue, event: event, callBack: callBack });\n break;\n case 'files':\n this.observer.notify(CONSTANT.IMAGE, {\n command: command, value: 'Image', item: exeValue, event: event, callBack: callBack, selector: selector\n });\n break;\n case 'images':\n this.observer.notify(CONSTANT.IMAGE, {\n command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector\n });\n break;\n case 'audios':\n this.observer.notify(CONSTANT.AUDIO, {\n command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector\n });\n break;\n case 'videos':\n this.observer.notify(CONSTANT.VIDEO, {\n command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector\n });\n break;\n case 'table':\n switch (value.toString().toLocaleLowerCase()) {\n case 'createtable':\n this.observer.notify(CONSTANT.TABLE, { item: exeValue, event: event, callBack: callBack, enterAction: enterAction });\n break;\n case 'insertrowbefore':\n case 'insertrowafter':\n this.observer.notify(CONSTANT.INSERT_ROW, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'insertcolumnleft':\n case 'insertcolumnright':\n this.observer.notify(CONSTANT.INSERT_COLUMN, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'deleterow':\n this.observer.notify(CONSTANT.DELETEROW, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'deletecolumn':\n this.observer.notify(CONSTANT.DELETECOLUMN, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'tableremove':\n this.observer.notify(CONSTANT.REMOVETABLE, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'tableheader':\n this.observer.notify(CONSTANT.TABLEHEADER, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'aligntop':\n case 'alignmiddle':\n case 'alignbottom':\n this.observer.notify(CONSTANT.TABLE_VERTICAL_ALIGN, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'merge':\n this.observer.notify(CONSTANT.TABLE_MERGE, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'horizontalsplit':\n this.observer.notify(CONSTANT.TABLE_HORIZONTAL_SPLIT, { item: exeValue, event: event, callBack: callBack });\n break;\n case 'verticalsplit':\n this.observer.notify(CONSTANT.TABLE_VERTICAL_SPLIT, { item: exeValue, event: event, callBack: callBack });\n break;\n }\n break;\n case 'font':\n case 'style':\n case 'effects':\n case 'casing':\n this.observer.notify(CONSTANT.SELECTION_TYPE, { subCommand: value, event: event, callBack: callBack, value: text, selector: selector, enterAction: enterAction });\n break;\n case 'inserthtml':\n this.observer.notify(CONSTANT.INSERTHTML_TYPE, { subCommand: value, callBack: callBack, value: text, enterAction: enterAction });\n break;\n case 'inserttext':\n this.observer.notify(CONSTANT.INSERT_TEXT_TYPE, { subCommand: value, callBack: callBack, value: text });\n break;\n case 'clear':\n this.observer.notify(CONSTANT.CLEAR_TYPE, { subCommand: value, event: event, callBack: callBack, selector: selector, enterAction: enterAction });\n break;\n case 'actions':\n this.observer.notify(EVENTS.ACTION, { subCommand: value, event: event, callBack: callBack, selector: selector });\n break;\n case 'formatpainter':\n this.observer.notify(EVENTS.FORMAT_PAINTER_ACTIONS, { item: exeValue, subCommand: value, event: event, callBack: callBack });\n break;\n case 'emojipicker':\n this.observer.notify(EVENTS.EMOJI_PICKER_ACTIONS, { item: exeValue, subCommand: value, value: text,\n event: event, callBack: callBack });\n }\n };\n EditorManager.prototype.editorMouseDown = function (e) {\n if (e.args.detail === 3) {\n this.tripleClickSelection(e.args);\n }\n };\n EditorManager.prototype.tripleClickSelection = function (e) {\n var range = this.nodeSelection.getRange(this.currentDocument);\n var selection = this.nodeSelection.get(this.currentDocument);\n if (selection.rangeCount > 0 && selection.toString() !== '') {\n var startBlockNode = this.getParentBlockNode(range.startContainer);\n var endBlockNode = this.getParentBlockNode(range.endContainer);\n if (startBlockNode && endBlockNode && startBlockNode === endBlockNode) {\n var newRange = this.currentDocument.createRange();\n var startTextNode = this.getFirstTextNode(startBlockNode);\n var endTextNode = this.getLastTextNode(endBlockNode);\n if (startTextNode && endTextNode) {\n newRange.setStart(startTextNode, 0);\n newRange.setEnd(endTextNode, endTextNode.textContent.length);\n this.nodeSelection.setRange(this.currentDocument, newRange);\n e.preventDefault();\n }\n }\n }\n };\n EditorManager.prototype.getParentBlockNode = function (node) {\n var treeWalker = this.currentDocument.createTreeWalker(this.editableElement, // root\n NodeFilter.SHOW_ELEMENT, // whatToShow\n {\n acceptNode: function (currentNode) {\n // Check if the node is a block element\n var displayStyle = window.getComputedStyle(currentNode).display;\n if (displayStyle.indexOf('inline') < 0) {\n return NodeFilter.FILTER_ACCEPT;\n }\n else {\n return NodeFilter.FILTER_SKIP;\n }\n }\n });\n treeWalker.currentNode = node;\n var blockParent = treeWalker.parentNode();\n return blockParent;\n };\n EditorManager.prototype.getLastTextNode = function (node) {\n var treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);\n var lastTextNode = null;\n var currentNode = treeWalker.nextNode();\n while (currentNode) {\n lastTextNode = currentNode;\n currentNode = treeWalker.nextNode();\n }\n return lastTextNode;\n };\n EditorManager.prototype.getFirstTextNode = function (node) {\n var treeWalker = this.currentDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT, null);\n var firstTextNode = treeWalker.nextNode();\n return firstTextNode;\n };\n return EditorManager;\n}());\nexport { EditorManager };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Formatter } from './formatter';\nimport { EditorManager } from './../../editor-manager/base/editor-manager';\nimport { extend } from '@syncfusion/ej2-base';\nimport { htmlKeyConfig } from './../../common/config';\n/**\n * HTML adapter\n *\n * @hidden\n\n */\nvar HTMLFormatter = /** @class */ (function (_super) {\n __extends(HTMLFormatter, _super);\n function HTMLFormatter(options) {\n var _this = _super.call(this) || this;\n _this.initialize();\n extend(_this, _this, options, true);\n if (_this.currentDocument && _this.element) {\n _this.updateFormatter(_this.element, _this.currentDocument, options.options, options.formatPainterSettings);\n }\n return _this;\n }\n HTMLFormatter.prototype.initialize = function () {\n this.keyConfig = htmlKeyConfig;\n };\n /**\n * Update the formatter of RichTextEditor\n *\n * @param {Element} editElement - specifies the edit element.\n * @param {Document} doc - specifies the doucment\n * @param {number} options - specifies the options\n * @param {FormatPainterSettingsModel} formatPainterSettings - specifies the format painter settings\n * @returns {void}\n * @hidden\n\n */\n HTMLFormatter.prototype.updateFormatter = function (editElement, doc, options, formatPainterSettings) {\n if (editElement && doc) {\n this.editorManager = new EditorManager({\n document: doc,\n editableElement: editElement,\n options: options,\n formatPainterSettings: formatPainterSettings\n });\n }\n };\n return HTMLFormatter;\n}(Formatter));\nexport { HTMLFormatter };\n","import * as events from '../base/constant';\nimport { ToolbarStatus } from '../../editor-manager/plugin/toolbar-status';\nimport { getDefaultHtmlTbStatus } from '../../common/util';\n/**\n * HtmlToolbarStatus module for refresh the toolbar status\n */\nvar HtmlToolbarStatus = /** @class */ (function () {\n function HtmlToolbarStatus(parent) {\n this.parent = parent;\n this.toolbarStatus = this.prevToolbarStatus = getDefaultHtmlTbStatus();\n this.addEventListener();\n }\n HtmlToolbarStatus.prototype.addEventListener = function () {\n this.parent.on(events.toolbarRefresh, this.onRefreshHandler, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n HtmlToolbarStatus.prototype.removeEventListener = function () {\n this.parent.off(events.toolbarRefresh, this.onRefreshHandler);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n HtmlToolbarStatus.prototype.onRefreshHandler = function (args) {\n if (this.parent.readonly) {\n return;\n }\n var fontsize = [];\n var fontName = [];\n var formats = [];\n this.parent.fontSize.items.forEach(function (item) {\n fontsize.push(item.value);\n });\n this.parent.fontFamily.items.forEach(function (item) {\n fontName.push(item.value);\n });\n this.parent.format.types.forEach(function (item) {\n formats.push(item.value.toLocaleLowerCase());\n });\n this.toolbarStatus = ToolbarStatus.get(this.parent.contentModule.getDocument(), this.parent.contentModule.getEditPanel(), formats, fontsize, fontName, args.documentNode);\n var tbStatusString = JSON.stringify(this.toolbarStatus);\n this.parent.notify(events.toolbarUpdated, this.toolbarStatus);\n if (JSON.stringify(this.prevToolbarStatus) !== tbStatusString) {\n this.parent.notify(events.updateTbItemsStatus, { html: JSON.parse(tbStatusString), markdown: null });\n this.prevToolbarStatus = JSON.parse(tbStatusString);\n }\n };\n return HtmlToolbarStatus;\n}());\nexport { HtmlToolbarStatus };\n","import { getEditValue } from '../base/util';\n/**\n * Content module is used to render Rich Text Editor content\n *\n * @hidden\n\n */\nvar ContentRender = /** @class */ (function () {\n /**\n * Constructor for content renderer module\n *\n * @param {IRichTextEditor} parent - specifies the parent element.\n * @param {ServiceLocator} serviceLocator - specifies the service.\n * @returns {void}\n */\n function ContentRender(parent, serviceLocator) {\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n }\n /**\n * The function is used to render Rich Text Editor content div\n *\n * @returns {void}\n * @hidden\n\n */\n ContentRender.prototype.renderPanel = function () {\n var rteObj = this.parent;\n var div = this.parent.createElement('div', { className: 'e-rte-content', id: this.parent.getID() + 'rte-view' });\n var rteContent = getEditValue(rteObj.value, rteObj);\n this.editableElement = this.parent.createElement('div', {\n className: 'e-content',\n id: this.parent.getID() + '_rte-edit-view',\n attrs: {\n 'contenteditable': 'true'\n },\n innerHTML: rteContent\n });\n div.appendChild(this.editableElement);\n this.setPanel(div);\n rteObj.element.appendChild(div);\n };\n /**\n * Get the content div element of RichTextEditor\n *\n * @returns {Element} - specifies the element.\n * @hidden\n\n */\n ContentRender.prototype.getPanel = function () {\n return this.contentPanel;\n };\n /**\n * Get the editable element of RichTextEditor\n *\n * @returns {Element} - specifies the return element.\n * @hidden\n\n */\n ContentRender.prototype.getEditPanel = function () {\n return this.editableElement;\n };\n /**\n * Returns the text content as string.\n *\n * @returns {string} - specifies the string element.\n */\n ContentRender.prototype.getText = function () {\n var textString = this.getEditPanel().innerText;\n return textString === '\\n' ? '' : textString;\n };\n /**\n * Set the content div element of RichTextEditor\n *\n * @param {Element} panel - specifies the panel element.\n * @returns {void}\n * @hidden\n\n */\n ContentRender.prototype.setPanel = function (panel) {\n this.contentPanel = panel;\n };\n /**\n * Get the document of RichTextEditor\n *\n * @returns {Document} - specifies the document.\n * @hidden\n\n */\n ContentRender.prototype.getDocument = function () {\n return this.getEditPanel().ownerDocument;\n };\n return ContentRender;\n}());\nexport { ContentRender };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { ContentRender } from '../renderer/content-renderer';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getEditValue } from '../base/util';\nvar IFRAMEHEADER = \"\\n \\n \\n \\n \\n \\n \";\n/**\n * Content module is used to render Rich Text Editor content\n *\n * @hidden\n\n */\nvar IframeContentRender = /** @class */ (function (_super) {\n __extends(IframeContentRender, _super);\n function IframeContentRender() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * The function is used to render Rich Text Editor iframe\n *\n * @hidden\n\n */\n IframeContentRender.prototype.renderPanel = function () {\n var rteObj = this.parent;\n var rteContent = getEditValue(rteObj.value, rteObj);\n var iFrameBodyContent = '' +\n rteContent + '';\n var iFrameContent = IFRAMEHEADER + iFrameBodyContent;\n var iframe = this.parent.createElement('iframe', {\n id: this.parent.getID() + '_rte-view',\n className: 'e-rte-content',\n styles: 'display:block;',\n attrs: { 'srcdoc': iFrameContent }\n });\n iframe.setAttribute(\"role\", \"none\");\n this.setPanel(iframe);\n rteObj.element.appendChild(iframe);\n iframe.contentDocument.body.id = this.parent.getID() + '_rte-edit-view';\n iframe.contentDocument.body.setAttribute('aria-owns', this.parent.getID());\n iframe.contentDocument.open();\n iFrameContent = this.setThemeColor(iFrameContent, { color: '#333' });\n iframe.contentDocument.write(iFrameContent);\n iframe.contentDocument.close();\n if (rteObj.enableRtl) {\n this.contentPanel.contentDocument.body.setAttribute('class', 'e-rtl');\n }\n };\n IframeContentRender.prototype.setThemeColor = function (content, styles) {\n var fontColor = getComputedStyle(this.parent.element, '.e-richtexteditor').getPropertyValue('color');\n return content.replace(styles.color, fontColor);\n };\n /**\n * Get the editable element of RichTextEditor\n *\n * @returns {Element} - specifies the element.\n * @hidden\n\n */\n IframeContentRender.prototype.getEditPanel = function () {\n var editNode;\n if (!isNullOrUndefined(this.contentPanel.contentDocument)) {\n editNode = this.contentPanel.contentDocument.body;\n }\n else {\n editNode = this.parent.inputElement;\n }\n return editNode;\n };\n /**\n * Get the document of RichTextEditor\n *\n * @returns {void}\n * @hidden\n\n */\n IframeContentRender.prototype.getDocument = function () {\n return this.getEditPanel().ownerDocument;\n };\n return IframeContentRender;\n}(ContentRender));\nexport { IframeContentRender };\n","import * as events from '../base/constant';\nimport { detach, isNullOrUndefined } from '@syncfusion/ej2-base';\n/**\n * XhtmlValidation module called when set enableXhtml as true\n */\nvar XhtmlValidation = /** @class */ (function () {\n function XhtmlValidation(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n XhtmlValidation.prototype.addEventListener = function () {\n this.parent.on(events.xhtmlValidation, this.enableXhtmlValidation, this);\n this.parent.on(events.destroy, this.removeEventListener, this);\n };\n XhtmlValidation.prototype.removeEventListener = function () {\n this.parent.off(events.xhtmlValidation, this.enableXhtmlValidation);\n this.parent.off(events.destroy, this.removeEventListener);\n };\n XhtmlValidation.prototype.enableXhtmlValidation = function () {\n if (this.parent.enableXhtml) {\n if (isNullOrUndefined(this.parent.inputElement)) {\n this.currentElement = this.parent.element;\n }\n else {\n this.currentElement = this.parent.inputElement;\n }\n this.clean(this.currentElement);\n this.ImageTags();\n this.removeTags();\n this.RemoveUnsupported();\n this.currentElement.innerHTML = this.selfEncloseValidation(this.currentElement.innerHTML, this.currentElement.innerText === '\\n' ?\n this.currentElement.innerText.length : this.currentElement.innerText.trim().length);\n this.parent.setProperties({ value: this.currentElement.innerHTML }, true);\n }\n };\n /**\n * @param {string} currentValue - specifies the string value.\n * @param {number} valueLength - specifies the length of the current value.\n * @returns {void}\n\n */\n XhtmlValidation.prototype.selfEncloseValidation = function (currentValue, valueLength) {\n if (valueLength === 0 && currentValue.indexOf('table') < 0 && currentValue.indexOf('img') < 0 &&\n currentValue.includes(' ')) {\n var arrayValue = currentValue.split(' ');\n arrayValue[arrayValue.length - 1] = '​' + arrayValue[arrayValue.length - 1];\n currentValue = arrayValue.join('');\n }\n currentValue = currentValue.replace(/
    /g, '
    ').replace(/
    /g, '
    ').replace(/ /g, ' ');\n var valueTemp;\n var valueDupe = [];\n var valueOriginal = [];\n var imgRegexp = [//gi, //gi, //gi, //gi, //gi,\n //gi, //gi, //gi, //gi, //gi,\n //gi, //gi];\n for (var j = 0; j < imgRegexp.length; j++) {\n valueTemp = imgRegexp[j].exec(currentValue);\n while ((valueTemp) !== null) {\n valueDupe.push(valueTemp[0].toString());\n valueTemp = imgRegexp[j].exec(currentValue);\n }\n valueOriginal = valueDupe.slice(0);\n for (var i = 0; i < valueDupe.length; i++) {\n if (valueDupe[i].indexOf('/') === -1 || valueDupe[i].lastIndexOf('/') !== valueDupe[i].length - 2) {\n valueDupe[i] = valueDupe[i].substr(0, valueDupe[i].length - 1) + ' /' +\n valueDupe[i].substr(valueDupe[i].length - 1, valueDupe[i].length);\n }\n }\n for (var g = 0; g <= valueDupe.length - 1; g++) {\n currentValue = currentValue.replace(valueOriginal[g], valueDupe[g]);\n }\n }\n return currentValue;\n };\n XhtmlValidation.prototype.clean = function (node) {\n for (var n = 0; n < node.childNodes.length; n++) {\n var child = node.childNodes[n];\n if (child.nodeType === 8 || child.nodeName === 'V:IMAGE') {\n node.removeChild(child);\n n--;\n }\n else if (child.nodeType === 1) {\n this.clean(child);\n }\n }\n return this.currentElement.innerHTML;\n };\n XhtmlValidation.prototype.ImageTags = function () {\n var imgNodes = this.currentElement.querySelectorAll('IMG');\n for (var i = imgNodes.length - 1; i >= 0; i--) {\n if (!imgNodes[i].hasAttribute('alt')) {\n var img = imgNodes[i];\n img.setAttribute('alt', '');\n }\n }\n };\n XhtmlValidation.prototype.removeTags = function () {\n var removeAttribute = [['br', 'ul'], ['br', 'ol'], ['table', 'span'], ['div', 'span'], ['p', 'span']];\n for (var i = 0; i < removeAttribute.length; i++) {\n this.RemoveElementNode(removeAttribute[i][0], removeAttribute[i][1]);\n }\n };\n XhtmlValidation.prototype.RemoveElementNode = function (rmvNode, parentNode) {\n var parentArray = this.currentElement.querySelectorAll(parentNode);\n for (var i = 0; i < parentArray.length; i++) {\n var rmvArray = parentArray[i].querySelectorAll(rmvNode);\n for (var j = rmvArray.length; j > 0; j--) {\n detach(rmvArray[j - 1]);\n }\n }\n };\n XhtmlValidation.prototype.RemoveUnsupported = function () {\n var underlineEle = this.currentElement.querySelectorAll('u');\n for (var i = underlineEle.length - 1; i >= 0; i--) {\n var spanEle = this.parent.createElement('span');\n spanEle.style.textDecoration = 'underline';\n spanEle.innerHTML = underlineEle[i].innerHTML;\n underlineEle[i].parentNode.insertBefore(spanEle, underlineEle[i]);\n detach(underlineEle[i]);\n }\n var strongEle = this.currentElement.querySelectorAll('strong');\n for (var i = strongEle.length - 1; i >= 0; i--) {\n var boldEle = this.parent.createElement('b');\n boldEle.innerHTML = strongEle[i].innerHTML;\n strongEle[i].parentNode.insertBefore(boldEle, strongEle[i]);\n detach(strongEle[i]);\n }\n var attrArray = ['language', 'role', 'target', 'contenteditable', 'cellspacing',\n 'cellpadding', 'border', 'valign', 'colspan'];\n for (var i = 0; i <= attrArray.length; i++) {\n this.RemoveAttributeByName(attrArray[i]);\n }\n };\n XhtmlValidation.prototype.RemoveAttributeByName = function (attrName) {\n if (this.currentElement.firstChild !== null) {\n if (this.currentElement.firstChild.nodeType !== 3) {\n for (var i = 0; i < this.currentElement.childNodes.length; i++) {\n var ele = this.currentElement.childNodes[i];\n if (ele.nodeType !== 3 && ele.nodeName !== 'TABLE' && ele.nodeName !== 'TBODY' && ele.nodeName !== 'THEAD' &&\n ele.nodeName !== 'TH' && ele.nodeName !== 'TR' && ele.nodeName !== 'TD') {\n if (ele.hasAttribute(attrName)) {\n ele.removeAttribute(attrName);\n }\n if (ele.hasChildNodes()) {\n for (var j = 0; j < ele.childNodes.length; j++) {\n var childEle = ele.childNodes[j];\n if (childEle.nodeType !== 3 && childEle.nodeName !== 'TABLE' && childEle.nodeName !== 'TBODY' &&\n childEle.nodeName !== 'THEAD' && childEle.nodeName !== 'TH' && childEle.nodeName !== 'TR' &&\n childEle.nodeName !== 'TD' && childEle.hasAttribute(attrName) &&\n !childEle.classList.contains('e-mention-chip')) {\n childEle.removeAttribute(attrName);\n }\n if (childEle.hasChildNodes()) {\n for (var k = 0; k < childEle.childNodes.length; k++) {\n if (childEle.childNodes[k].nodeType !== 3 && childEle.childNodes[k].nodeName !== 'TABLE' &&\n childEle.childNodes[k].nodeName !== 'TBODY' && childEle.childNodes[k].nodeName !== 'THEAD' &&\n childEle.childNodes[k].nodeName !== 'TH' && childEle.childNodes[k].nodeName !== 'TR'\n && childEle.childNodes[k].nodeName !== 'TD'\n && childEle.childNodes[k].hasAttribute(attrName)) {\n childEle.childNodes[k].removeAttribute(attrName);\n }\n }\n }\n }\n }\n }\n }\n }\n }\n };\n return XhtmlValidation;\n}());\nexport { XhtmlValidation };\n","import * as events from '../base/constant';\nimport { isNullOrUndefined, closest, attributes, removeClass, addClass, Browser, detach } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';\nimport { HTMLFormatter } from '../formatter/html-formatter';\nimport { RenderType } from '../base/enum';\nimport * as classes from '../base/classes';\nimport { HtmlToolbarStatus } from './html-toolbar-status';\nimport { IframeContentRender } from '../renderer/iframe-content-renderer';\nimport { ContentRender } from '../renderer/content-renderer';\nimport { ColorPickerInput } from './color-picker';\nimport { NodeSelection } from '../../selection/selection';\nimport { InsertHtml } from '../../editor-manager/plugin/inserthtml';\nimport { getTextNodesUnder, sanitizeHelper, getDefaultValue } from '../base/util';\nimport { isIDevice, scrollToCursor } from '../../common/util';\nimport { XhtmlValidation } from './xhtml-validation';\nimport { ON_BEGIN } from './../../common/constant';\nimport * as CONSTANT from '../base/constant';\n/**\n * `HtmlEditor` module is used to HTML editor\n */\nvar HtmlEditor = /** @class */ (function () {\n function HtmlEditor(parent, serviceLocator) {\n this.rangeCollection = [];\n this.isImageDelete = false;\n this.parent = parent;\n this.locator = serviceLocator;\n this.renderFactory = this.locator.getService('rendererFactory');\n this.xhtmlValidation = new XhtmlValidation(parent);\n this.addEventListener();\n }\n /**\n * Destroys the Markdown.\n *\n * @function destroy\n * @returns {void}\n * @hidden\n\n */\n HtmlEditor.prototype.destroy = function () {\n this.removeEventListener();\n };\n /**\n * @param {string} value - specifies the string value\n * @returns {void}\n * @hidden\n\n */\n HtmlEditor.prototype.sanitizeHelper = function (value) {\n value = sanitizeHelper(value, this.parent);\n return value;\n };\n HtmlEditor.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.nodeSelectionObj = new NodeSelection();\n this.colorPickerModule = new ColorPickerInput(this.parent, this.locator);\n this.parent.on(events.initialLoad, this.instantiateRenderer, this);\n this.parent.on(events.htmlToolbarClick, this.onToolbarClick, this);\n this.parent.on(events.keyDown, this.onKeyDown, this);\n this.parent.on(events.keyUp, this.onKeyUp, this);\n this.parent.on(events.renderColorPicker, this.renderColorPicker, this);\n this.parent.on(events.initialEnd, this.render, this);\n this.parent.on(events.modelChanged, this.onPropertyChanged, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.parent.on(events.selectAll, this.selectAll, this);\n this.parent.on(events.selectRange, this.selectRange, this);\n this.parent.on(events.getSelectedHtml, this.getSelectedHtml, this);\n this.parent.on(events.selectionSave, this.onSelectionSave, this);\n this.parent.on(events.selectionRestore, this.onSelectionRestore, this);\n this.parent.on(events.readOnlyMode, this.updateReadOnly, this);\n this.parent.on(events.paste, this.onPaste, this);\n this.parent.on(events.tableclass, this.isTableClassAdded, this);\n this.parent.on(events.onHandleFontsizeChange, this.onHandleFontsizeChange, this);\n };\n HtmlEditor.prototype.updateReadOnly = function () {\n if (this.parent.readonly) {\n attributes(this.parent.contentModule.getEditPanel(), { contenteditable: 'false' });\n addClass([this.parent.element], classes.CLS_RTE_READONLY);\n }\n else {\n attributes(this.parent.contentModule.getEditPanel(), { contenteditable: 'true' });\n removeClass([this.parent.element], classes.CLS_RTE_READONLY);\n }\n };\n HtmlEditor.prototype.onSelectionSave = function () {\n var currentDocument = this.contentRenderer.getDocument();\n var range = this.nodeSelectionObj.getRange(currentDocument);\n this.saveSelection = this.nodeSelectionObj.save(range, currentDocument);\n };\n HtmlEditor.prototype.onSelectionRestore = function (e) {\n this.parent.isBlur = false;\n if (isNullOrUndefined(e.items) || e.items) {\n this.saveSelection.restore();\n }\n };\n HtmlEditor.prototype.isTableClassAdded = function () {\n var tableElement = this.parent.inputElement.querySelectorAll('table');\n for (var i = 0; i < tableElement.length; i++) {\n if (!tableElement[i].classList.contains('e-rte-table') && !tableElement[i].classList.contains('e-rte-paste-table')) {\n tableElement[i].classList.add('e-rte-table');\n }\n }\n };\n HtmlEditor.prototype.onHandleFontsizeChange = function (e) {\n var keyboardArgs = e.args;\n var args = { name: 'dropDownSelect' };\n args.item = {\n command: 'Font',\n subCommand: 'FontSize'\n };\n var items = this.parent.fontSize.items;\n var activeElem;\n if (this.parent.toolbarModule && this.parent.toolbarModule.dropDownModule &&\n this.parent.toolbarModule.dropDownModule.fontSizeDropDown && !isNOU(this.parent.toolbarModule.dropDownModule.fontSizeDropDown.activeElem[0].textContent) && this.parent.toolbarModule.dropDownModule.fontSizeDropDown.activeElem[0].textContent !== '') {\n activeElem = this.parent.toolbarModule.dropDownModule.fontSizeDropDown.activeElem[0].textContent;\n }\n else {\n var fontSizeValue = void 0;\n var selection = this.parent.contentModule.getDocument().getSelection();\n if (selection && selection.focusNode && selection.focusNode.parentElement) {\n fontSizeValue = document.defaultView.getComputedStyle(selection.focusNode.parentElement, null).getPropertyValue('font-size');\n }\n else {\n fontSizeValue = this.parent.fontSize.width;\n }\n fontSizeValue = isNOU(fontSizeValue) ? this.parent.fontSize.width : fontSizeValue;\n var actualTxtFontValues = fontSizeValue.match(/^([\\d.]+)(\\D+)$/);\n var size_1 = parseInt(actualTxtFontValues[1], 10);\n var unit = actualTxtFontValues[2];\n var defaultFontValues = items[0].value.match(/^([\\d.]+)(\\D+)$/);\n if (defaultFontValues[2] === unit) {\n var index = items.findIndex(function (_a) {\n var value = _a.value;\n return parseInt(value, 10) >= size_1;\n });\n activeElem = items[index].text;\n }\n else {\n var convertedSize_1 = this.convertFontSize(size_1, unit, defaultFontValues[2]);\n var index = items.findIndex(function (_a) {\n var value = _a.value;\n return parseInt(value, 10) >= convertedSize_1;\n });\n activeElem = items[index].text;\n }\n }\n var fontIndex = items.findIndex(function (size) { return size.text === activeElem; });\n if (keyboardArgs.action === 'increase-fontsize' && fontIndex !== -1) {\n if (fontIndex >= items.length - 1) {\n var fontValues = items[fontIndex].value.match(/^([\\d.]+)(\\D+)$/);\n if (fontValues) {\n var size = parseInt(fontValues[1], 10);\n var unit = fontValues[2];\n var roundedSize = size % 10 === 0 ? Math.ceil((size + 1) / 10) * 10 : Math.ceil(size / 10) * 10;\n args.item.value = roundedSize.toLocaleString() + unit;\n args.item.text = roundedSize.toLocaleString() + ' ' + unit;\n }\n this.parent.fontSize.items.push(args.item);\n }\n else {\n args.item.value = items[fontIndex + 1].value;\n args.item.text = items[fontIndex + 1].text;\n }\n }\n else if (keyboardArgs.action === 'decrease-fontsize' && fontIndex !== -1 && fontIndex > 0) {\n args.item.value = items[fontIndex - 1].value;\n args.item.text = items[fontIndex - 1].text;\n }\n else {\n if (fontIndex >= 0 && fontIndex < items.length && items[fontIndex]) {\n args.item.value = items[fontIndex].value;\n args.item.text = items[fontIndex].text;\n }\n }\n this.parent.formatter.process(this.parent, args, keyboardArgs);\n };\n HtmlEditor.prototype.convertFontSize = function (value, originalUnit, targetUnit) {\n if (CONSTANT.supportedUnits.indexOf(originalUnit) !== -1 || CONSTANT.supportedUnits.indexOf(targetUnit) !== -1) {\n originalUnit = 'px';\n }\n var convertedValue = value * CONSTANT.conversionFactors[originalUnit][targetUnit];\n return convertedValue;\n };\n HtmlEditor.prototype.onKeyUp = function (e) {\n var args = e.args;\n var restrictKeys = [8, 9, 13, 16, 17, 18, 20, 27, 37, 38, 39, 40, 44, 45, 46, 91,\n 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123];\n var range = this.parent.getRange();\n // eslint-disable-next-line\n var regEx = new RegExp(String.fromCharCode(8203), 'g');\n var isEmptyNode = range.startContainer === range.endContainer && range.startOffset === range.endOffset &&\n range.startOffset === 1 && range.startContainer.textContent.length === 1 && range.startContainer.textContent.charCodeAt(0) == 8203 &&\n range.startContainer.textContent.replace(regEx, '').length === 0;\n var pointer;\n var isRootParent = false;\n if (restrictKeys.indexOf(args.keyCode) < 0 && !args.shiftKey && !args.ctrlKey && !args.altKey && !isEmptyNode) {\n pointer = range.startOffset;\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n range.startContainer.nodeName === '#text' ? range.startContainer.parentElement !== this.parent.inputElement ? range.startContainer.parentElement.classList.add('currentStartMark')\n : isRootParent = true : range.startContainer.classList.add('currentStartMark');\n if (range.startContainer.textContent.charCodeAt(0) === 8203) {\n var previousLength_1 = range.startContainer.textContent.length;\n var previousRange = range.startOffset;\n range.startContainer.textContent = range.startContainer.textContent.replace(regEx, '');\n pointer = previousRange === 0 ? previousRange : previousRange - (previousLength_1 - range.startContainer.textContent.length);\n this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), range.startContainer, pointer);\n }\n var previousLength = this.parent.inputElement.innerHTML.length;\n var currentLength = this.parent.inputElement.innerHTML.replace(regEx, '').length;\n var focusNode = range.startContainer;\n if (previousLength > currentLength && !isRootParent) {\n if (focusNode.textContent.trim().length !== 0 && focusNode.previousSibling) {\n var tempSpan = document.createElement('span');\n tempSpan.className = 'tempSpan';\n range.insertNode(tempSpan);\n }\n var currentChild = this.parent.inputElement.firstChild;\n while (!isNOU(currentChild)) {\n if (currentChild.nodeName === '#text') {\n currentChild = currentChild.nextElementSibling;\n continue;\n }\n if (currentChild.textContent.replace(regEx, '').trim().length > 0) {\n currentChild.innerHTML = currentChild.innerHTML.replace(regEx, '');\n }\n currentChild = currentChild.nextElementSibling;\n }\n var tempSpanToRemove = this.parent.inputElement.querySelector('.tempSpan');\n if (tempSpanToRemove && tempSpanToRemove.previousSibling && focusNode.textContent.trim().length !== 0) {\n focusNode = tempSpanToRemove.previousSibling;\n pointer = tempSpanToRemove.previousSibling.textContent.length;\n var parentElement = tempSpanToRemove.parentNode;\n parentElement.removeChild(tempSpanToRemove);\n tempSpanToRemove = null;\n }\n var currentChildNode = this.parent.inputElement.querySelector('.currentStartMark').childNodes;\n if (currentChildNode.length > 1) {\n for (var i = 0; i < currentChildNode.length; i++) {\n if (currentChildNode[i].nodeName === '#text' && currentChildNode[i].textContent.length === 0) {\n detach(currentChildNode[i]);\n i--;\n }\n if (!isNOU(currentChildNode[i]) && focusNode.textContent.replace(regEx, '') === currentChildNode[i].textContent) {\n pointer = focusNode.textContent.length > 1 ?\n (focusNode.textContent === currentChildNode[i].textContent ? pointer :\n pointer - (focusNode.textContent.length - focusNode.textContent.replace(regEx, '').length)) :\n focusNode.textContent.length;\n focusNode = currentChildNode[i];\n }\n }\n }\n else if (currentChildNode.length === 1) {\n if (focusNode.textContent.replace(regEx, '') === currentChildNode[0].textContent) {\n focusNode = currentChildNode[0];\n }\n }\n this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), focusNode, pointer);\n }\n var currentElem = this.parent.inputElement.querySelector('.currentStartMark');\n if (!isNOU(currentElem)) {\n currentElem.classList.remove('currentStartMark');\n if (currentElem.getAttribute('class').trim() === '') {\n currentElem.removeAttribute('class');\n }\n }\n if (!isNOU(range.startContainer.previousSibling) && !isNOU(range.startContainer.previousSibling.parentElement) &&\n range.startContainer.parentElement === range.startContainer.previousSibling.parentElement &&\n range.startContainer.previousSibling.textContent.charCodeAt(0) === 8203 &&\n range.startContainer.previousSibling.textContent.length <= 1) {\n range.startContainer.previousSibling.textContent = range.startContainer.previousSibling.textContent.replace(regEx, '');\n }\n if (range.endContainer.textContent.charCodeAt(range.endOffset) === 8203) {\n pointer = range.startOffset;\n range.endContainer.textContent = range.endContainer.textContent.replace(regEx, '');\n this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), range.startContainer, pointer);\n }\n }\n };\n HtmlEditor.prototype.onKeyDown = function (e) {\n var _this = this;\n var currentRange;\n var args = e.args;\n if (Browser.info.name === 'chrome') {\n currentRange = this.parent.getRange();\n this.backSpaceCleanup(e, currentRange);\n this.deleteCleanup(e, currentRange);\n }\n if (args.keyCode === 9 && this.parent.enableTabKey) {\n this.parent.formatter.saveData(e);\n if (!isNOU(args.target) && isNullOrUndefined(closest(args.target, '.e-rte-toolbar'))) {\n var range = this.nodeSelectionObj.getRange(this.contentRenderer.getDocument());\n var parentNode = this.nodeSelectionObj.getParentNodeCollection(range);\n if (!((parentNode[0].nodeName === 'LI' || closest(parentNode[0], 'li') ||\n closest(parentNode[0], 'table')))) {\n args.preventDefault();\n var selection = this.contentRenderer.getDocument().getSelection().getRangeAt(0);\n var alignmentNodes = this.parent.formatter.editorManager.domNode.blockNodes();\n if (this.parent.enterKey === 'BR') {\n if (selection.startOffset !== selection.endOffset && selection.startOffset === 0) {\n var save = this.nodeSelectionObj.save(range, this.contentRenderer.getDocument());\n this.parent.formatter.editorManager.domNode.setMarker(save);\n alignmentNodes = this.parent.formatter.editorManager.domNode.blockNodes();\n this.parent.formatter.editorManager.domNode.convertToBlockNodes(alignmentNodes, false);\n this.marginTabAdd(args.shiftKey, alignmentNodes);\n save = this.parent.formatter.editorManager.domNode.saveMarker(save);\n save.restore();\n }\n else {\n InsertHtml.Insert(this.contentRenderer.getDocument(), '    ');\n this.rangeCollection.push(this.nodeSelectionObj.getRange(this.contentRenderer.getDocument()));\n }\n }\n else {\n if (!args.shiftKey) {\n if (selection.startOffset !== selection.endOffset && selection.startOffset === 0) {\n this.marginTabAdd(args.shiftKey, alignmentNodes);\n }\n else {\n InsertHtml.Insert(this.contentRenderer.getDocument(), '    ');\n this.rangeCollection.push(this.nodeSelectionObj.getRange(this.contentRenderer.getDocument()));\n }\n }\n else if (this.rangeCollection.length > 0 &&\n this.rangeCollection[this.rangeCollection.length - 1].startContainer.textContent.length === 4) {\n var textCont = this.rangeCollection[this.rangeCollection.length - 1].startContainer;\n this.nodeSelectionObj.setSelectionText(this.contentRenderer.getDocument(), textCont, textCont, 0, textCont.textContent.length);\n InsertHtml.Insert(this.contentRenderer.getDocument(), document.createTextNode(''));\n this.rangeCollection.pop();\n }\n else {\n this.marginTabAdd(args.shiftKey, alignmentNodes);\n }\n }\n }\n }\n this.parent.formatter.saveData(e);\n }\n if (e.args.action === 'space' ||\n e.args.action === 'enter' ||\n e.args.keyCode === 13) {\n this.spaceLink(e.args);\n if (this.parent.editorMode === 'HTML' && !this.parent.readonly) {\n var currentLength = this.parent.getText().trim().replace(/(\\r\\n|\\n|\\r|\\t)/gm, '').replace(/\\u200B/g, '').length;\n var selectionLength = this.parent.getSelection().length;\n var totalLength = (currentLength - selectionLength) + 1;\n if (!(this.parent.maxLength === -1 || totalLength <= this.parent.maxLength) &&\n e.args.keyCode === 13) {\n e.args.preventDefault();\n return;\n }\n else {\n this.parent.notify(events.enterHandler, { args: e.args });\n scrollToCursor(this.parent.contentModule.getDocument(), this.parent.inputElement);\n }\n }\n }\n if (e.args.action === 'space') {\n var currentRange_1 = this.parent.getRange();\n var editorValue = currentRange_1.startContainer.textContent.slice(0, currentRange_1.startOffset);\n var orderedList_1 = this.isOrderedList(editorValue);\n var unOrderedList = this.isUnOrderedList(editorValue);\n if (orderedList_1 && !unOrderedList || unOrderedList && !orderedList_1) {\n var eventArgs_1 = {\n callBack: null,\n event: e.args,\n name: 'keydown-handler'\n };\n var actionBeginArgs = {\n cancel: false,\n item: { command: 'Lists', subCommand: orderedList_1 ? 'OL' : 'UL' },\n name: 'actionBegin',\n originalEvent: e.args,\n requestType: orderedList_1 ? 'OL' : 'UL'\n };\n this.parent.trigger(events.actionBegin, actionBeginArgs, function (actionBeginArgs) {\n if (!actionBeginArgs.cancel) {\n _this.parent.formatter.editorManager.observer.notify(ON_BEGIN, eventArgs_1);\n _this.parent.trigger(events.actionComplete, {\n editorMode: _this.parent.editorMode,\n elements: _this.parent.formatter.editorManager.domNode.blockNodes(),\n event: e.args,\n name: events.actionComplete,\n range: _this.parent.getRange(),\n requestType: orderedList_1 ? 'OL' : 'UL'\n });\n }\n });\n }\n }\n if (Browser.info.name === 'chrome' && (!isNullOrUndefined(this.rangeElement) && !isNullOrUndefined(this.oldRangeElement) ||\n !isNullOrUndefined(this.deleteRangeElement) && !isNullOrUndefined(this.deleteOldRangeElement)) &&\n currentRange.startContainer.parentElement.tagName !== 'TD' && currentRange.startContainer.parentElement.tagName !== 'TH') {\n this.rangeElement = null;\n this.oldRangeElement = null;\n this.deleteRangeElement = null;\n this.deleteOldRangeElement = null;\n if (!this.isImageDelete) {\n args.preventDefault();\n }\n args.preventDefault();\n }\n };\n HtmlEditor.prototype.isOrderedList = function (editorValue) {\n editorValue = editorValue.replace(/\\u200B/g, '');\n var olListStartRegex = [/^[1]+[.]+$/, /^[i]+[.]+$/, /^[a]+[.]+$/];\n if (!isNullOrUndefined(editorValue)) {\n for (var i = 0; i < olListStartRegex.length; i++) {\n if (olListStartRegex[i].test(editorValue)) {\n return true;\n }\n }\n }\n return false;\n };\n HtmlEditor.prototype.isUnOrderedList = function (editorValue) {\n editorValue = editorValue.replace(/\\u200B/g, '');\n var ulListStartRegex = [/^[*]$/, /^[-]$/];\n if (!isNullOrUndefined(editorValue)) {\n for (var i = 0; i < ulListStartRegex.length; i++) {\n if (ulListStartRegex[i].test(editorValue)) {\n return true;\n }\n }\n }\n return false;\n };\n HtmlEditor.prototype.backSpaceCleanup = function (e, currentRange) {\n var isLiElement = false;\n var isPreviousNotContentEditable = true;\n if (!isNOU(currentRange.startContainer.previousSibling) &&\n currentRange.startContainer.previousSibling.nodeName === 'SPAN') {\n isPreviousNotContentEditable = currentRange.startContainer.previousSibling.contentEditable === 'false' ? false : true;\n }\n var checkNode = currentRange.startContainer.nodeName === '#text' ? currentRange.startContainer.parentElement : currentRange.startContainer;\n var isSelectedPositionNotStart = closest(currentRange.startContainer.nodeName === '#text' ? currentRange.startContainer.parentElement : currentRange.startContainer, 'li') ?\n checkNode.nodeName !== 'li' && isNOU(checkNode.previousSibling) : true;\n if (e.args.code === 'Backspace' && e.args.keyCode === 8 && currentRange.startOffset === 0 &&\n currentRange.endOffset === 0 && this.parent.getSelection().length === 0 && currentRange.startContainer.textContent.length > 0 &&\n currentRange.startContainer.parentElement.tagName !== 'TD' && currentRange.startContainer.parentElement.tagName !== 'TH' &&\n isPreviousNotContentEditable && isSelectedPositionNotStart) {\n if ((!this.parent.formatter.editorManager.domNode.isBlockNode(checkNode) &&\n !isNOU(checkNode.previousSibling) && checkNode.previousSibling.nodeName === 'BR') ||\n (!isNOU(currentRange.startContainer.previousSibling) && currentRange.startContainer.previousSibling.nodeName === 'BR')) {\n return;\n }\n this.rangeElement = this.getRootBlockNode(currentRange.startContainer);\n if (this.rangeElement.tagName === 'OL' || this.rangeElement.tagName === 'UL') {\n var liElement = this.getRangeLiNode(currentRange.startContainer);\n if (liElement.previousElementSibling && liElement.previousElementSibling.childElementCount > 0) {\n this.oldRangeElement = liElement.previousElementSibling.lastElementChild.nodeName === 'BR' ?\n liElement.previousElementSibling : liElement.previousElementSibling.lastChild;\n if (!isNOU(liElement.lastElementChild) && liElement.lastElementChild.nodeName !== 'BR' &&\n isNOU(liElement.lastElementChild.previousSibling) && liElement.lastChild.nodeName !== \"#text\") {\n this.rangeElement = liElement.lastElementChild;\n isLiElement = true;\n }\n else {\n this.rangeElement = liElement;\n }\n }\n }\n else if (this.rangeElement === this.parent.inputElement || this.rangeElement.tagName === 'TABLE' ||\n (!isNOU(this.rangeElement.previousElementSibling) && this.rangeElement.previousElementSibling.tagName === 'TABLE')) {\n return;\n }\n else {\n this.oldRangeElement = this.rangeElement.previousElementSibling;\n }\n if (isNOU(this.oldRangeElement)) {\n return;\n }\n else {\n if (this.oldRangeElement.tagName === 'OL' || this.oldRangeElement.tagName === 'UL') {\n this.oldRangeElement = this.oldRangeElement.lastElementChild.lastElementChild\n ? this.oldRangeElement.lastElementChild.lastElementChild :\n this.oldRangeElement.lastElementChild;\n }\n var lastNode = this.oldRangeElement.lastChild ? this.oldRangeElement.lastChild : this.oldRangeElement;\n while (lastNode.nodeType !== 3 && lastNode.nodeName !== '#text' &&\n lastNode.nodeName !== 'BR' && !isNOU(lastNode.lastChild)) {\n lastNode = lastNode.lastChild;\n }\n if (lastNode.nodeName === 'IMG') {\n this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), lastNode.parentElement, lastNode.parentElement.childNodes.length);\n }\n else {\n this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), \n // eslint-disable-next-line\n lastNode, lastNode.textContent.length);\n }\n if (this.oldRangeElement.nodeName !== '#text' && this.oldRangeElement.querySelectorAll('BR').length === 1) {\n detach(this.oldRangeElement.querySelector('BR'));\n }\n if (!isNOU(this.rangeElement) && this.oldRangeElement !== this.rangeElement) {\n while (this.rangeElement.firstChild) {\n if (this.oldRangeElement.nodeName === '#text') {\n this.oldRangeElement.parentElement.appendChild(this.rangeElement.childNodes[0]);\n }\n else {\n this.oldRangeElement.appendChild(this.rangeElement.childNodes[0]);\n }\n }\n // eslint-disable-next-line\n !isLiElement ? detach(this.rangeElement) : detach(this.rangeElement.parentElement);\n this.oldRangeElement.normalize();\n }\n }\n }\n };\n HtmlEditor.prototype.deleteCleanup = function (e, currentRange) {\n var isLiElement = false;\n var liElement;\n var rootElement;\n if (e.args.code === 'Delete' && e.args.keyCode === 46 &&\n this.parent.contentModule.getText().trim().replace(/(\\r\\n|\\n|\\r|\\t)/gm, '').replace(/\\u200B/g, '').length !== 0 && this.parent.getSelection().length === 0 && currentRange.startContainer.parentElement.tagName !== 'TD' &&\n currentRange.startContainer.parentElement.tagName !== 'TH') {\n this.deleteRangeElement = rootElement = this.getRootBlockNode(currentRange.startContainer);\n if (this.deleteRangeElement.tagName === 'OL' || this.deleteRangeElement.tagName === 'UL') {\n liElement = this.getRangeLiNode(currentRange.startContainer);\n if (liElement.nextElementSibling && liElement.nextElementSibling.childElementCount > 0\n && !liElement.nextElementSibling.querySelector('BR')) {\n if (!isNullOrUndefined(liElement.lastElementChild)) {\n this.deleteRangeElement = liElement.lastElementChild;\n isLiElement = true;\n }\n else {\n this.deleteRangeElement = liElement;\n }\n }\n else {\n this.deleteRangeElement = this.getRangeElement(liElement);\n }\n }\n else if (this.deleteRangeElement.nodeType === 3 || (this.deleteRangeElement.tagName === 'TABLE' ||\n (!isNullOrUndefined(this.deleteRangeElement.nextElementSibling) && this.deleteRangeElement.nextElementSibling.tagName === 'TABLE'))) {\n return;\n }\n var isImgWithEmptyBlockNode = false;\n if (this.deleteRangeElement.querySelectorAll('img').length > 0 && this.deleteRangeElement.textContent.trim() === '') {\n isImgWithEmptyBlockNode = true;\n }\n if (this.getCaretIndex(currentRange, this.deleteRangeElement) === this.deleteRangeElement.textContent.length && !isImgWithEmptyBlockNode) {\n if (!isNullOrUndefined(liElement)) {\n if (isLiElement || !isNullOrUndefined(liElement.nextElementSibling)) {\n this.deleteOldRangeElement = this.getRangeElement(liElement.nextElementSibling);\n }\n else {\n this.deleteOldRangeElement = rootElement.nextElementSibling;\n }\n }\n else {\n this.deleteOldRangeElement = this.deleteRangeElement.nextElementSibling;\n }\n if (isNullOrUndefined(this.deleteOldRangeElement)) {\n return;\n }\n else {\n if (currentRange.startOffset === 0 && currentRange.endOffset === 1 &&\n this.deleteRangeElement.childNodes[0].nodeName === 'IMG') {\n this.parent.formatter.editorManager.nodeSelection.setSelectionText(this.parent.contentModule.getDocument(), this.deleteRangeElement, this.deleteRangeElement, 0, 1);\n this.isImageDelete = true;\n }\n else {\n this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.deleteRangeElement, this.deleteRangeElement.childNodes.length);\n this.isImageDelete = false;\n }\n var brNode = this.deleteRangeElement.querySelector('BR');\n if (brNode && brNode.classList.contains('e-rte-image-remove-focus')) {\n removeClass([brNode], ['e-rte-image-focus']);\n return;\n }\n else if (brNode) {\n detach(brNode);\n }\n if (!isNullOrUndefined(this.deleteRangeElement) && (this.deleteOldRangeElement.tagName !== 'OL' && this.deleteOldRangeElement.tagName !== 'UL')\n && this.deleteOldRangeElement !== this.deleteRangeElement) {\n while (this.deleteOldRangeElement.firstChild) {\n this.deleteRangeElement.appendChild(this.deleteOldRangeElement.childNodes[0]);\n }\n if (!isLiElement) {\n detach(this.deleteOldRangeElement);\n }\n else {\n detach(this.deleteOldRangeElement.parentElement);\n }\n this.deleteRangeElement.normalize();\n }\n else {\n this.deleteRangeElement = null;\n this.deleteOldRangeElement = null;\n }\n }\n }\n else {\n this.deleteRangeElement = null;\n }\n }\n };\n HtmlEditor.prototype.getCaretIndex = function (currentRange, element) {\n var position = 0;\n if (this.parent.contentModule.getDocument().getSelection().rangeCount !== 0) {\n var preCaretRange = currentRange.cloneRange();\n preCaretRange.selectNodeContents(element);\n preCaretRange.setEnd(currentRange.endContainer, currentRange.endOffset);\n position = preCaretRange.toString().length;\n }\n return position;\n };\n HtmlEditor.prototype.getRangeElement = function (element) {\n var rangeElement = element.lastElementChild ? element.lastElementChild.tagName === 'BR' ?\n element.lastElementChild.previousElementSibling ? element.lastElementChild.previousElementSibling\n : element : element.lastElementChild : element;\n return rangeElement;\n };\n HtmlEditor.prototype.getRootBlockNode = function (rangeBlockNode) {\n // eslint-disable-next-line\n for (; rangeBlockNode && this.parent && this.parent.inputElement !== rangeBlockNode; rangeBlockNode = rangeBlockNode) {\n if (rangeBlockNode.parentElement === this.parent.inputElement) {\n break;\n }\n else {\n rangeBlockNode = rangeBlockNode.parentElement;\n }\n }\n return rangeBlockNode;\n };\n HtmlEditor.prototype.getRangeLiNode = function (rangeLiNode) {\n var node = rangeLiNode.parentElement;\n while (node !== this.parent.inputElement) {\n if (node.nodeType === 1 && node.tagName === 'LI') {\n break;\n }\n node = node.parentElement;\n }\n return node;\n };\n HtmlEditor.prototype.onPaste = function (e) {\n // eslint-disable-next-line\n var regex = new RegExp(/([^\\S]|^)(((https?\\:\\/\\/)|(www\\.))(\\S+))/gi);\n if (e.text.match(regex)) {\n if (e.isWordPaste) {\n return;\n }\n e.args.preventDefault();\n var range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());\n // eslint-disable-next-line\n var saveSelection = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());\n // eslint-disable-next-line\n var httpRegex = new RegExp(/([^\\S]|^)(((https?\\:\\/\\/)))/gi);\n var wwwRegex = new RegExp(/([^\\S]|^)(((www\\.))(\\S+))/gi);\n var enterSplitText = e.text.split('\\n');\n var contentInnerElem = '';\n for (var i = 0; i < enterSplitText.length; i++) {\n if (enterSplitText[i].trim() === '') {\n contentInnerElem += getDefaultValue(this.parent);\n }\n else {\n var contentWithSpace = '';\n var spaceBetweenContent = true;\n var spaceSplit = enterSplitText[i].split(' ');\n for (var j = 0; j < spaceSplit.length; j++) {\n if (spaceSplit[j].trim() === '') {\n contentWithSpace += spaceBetweenContent ? ' ' : ' ';\n }\n else {\n spaceBetweenContent = false;\n contentWithSpace += spaceSplit[j] + ' ';\n }\n }\n if (i === 0) {\n contentInnerElem += '' + contentWithSpace.trim() + '';\n }\n else {\n contentInnerElem += '

    ' + contentWithSpace.trim() + '

    ';\n }\n }\n }\n var divElement = this.parent.createElement('div');\n divElement.setAttribute('class', 'pasteContent');\n divElement.style.display = 'inline';\n divElement.innerHTML = contentInnerElem.replace('¶', '&para');\n var paraElem = divElement.querySelectorAll('span, p');\n for (var i = 0; i < paraElem.length; i++) {\n var splitTextContent = paraElem[i].innerHTML.split(' ');\n var resultSplitContent = '';\n for (var j = 0; j < splitTextContent.length; j++) {\n if (splitTextContent[j].match(httpRegex) || splitTextContent[j].match(wwwRegex)) {\n resultSplitContent += '' + splitTextContent[j] + ' ';\n }\n else {\n resultSplitContent += splitTextContent[j] + ' ';\n }\n }\n paraElem[i].innerHTML = resultSplitContent.trim();\n }\n if (!isNullOrUndefined(this.parent.pasteCleanupModule)) {\n e.callBack(divElement.innerHTML);\n }\n else {\n this.parent.formatter.editorManager.execCommand('insertHTML', null, null, null, divElement);\n }\n }\n };\n HtmlEditor.prototype.spaceLink = function (e) {\n var range = this.nodeSelectionObj.getRange(this.contentRenderer.getDocument());\n var selectNodeEle = this.nodeSelectionObj.getParentNodeCollection(range);\n var text = range.startContainer.textContent.substr(0, range.endOffset);\n var splitText = text.split(' ');\n var urlText = splitText[splitText.length - 1];\n var urlTextRange = range.startOffset - (text.length - splitText[splitText.length - 1].length);\n urlText = urlText.slice(0, urlTextRange);\n // eslint-disable-next-line\n var regex = new RegExp(/([^\\S]|^)(((https?\\:\\/\\/)|(www\\.))(\\S+))/gi);\n if (selectNodeEle[0].nodeName !== 'A' && urlText.match(regex)) {\n var selection = this.nodeSelectionObj.save(range, this.parent.contentModule.getDocument());\n var url = urlText.indexOf('http') > -1 ? urlText : 'http://' + urlText;\n var selectParent = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);\n var value = {\n url: url,\n selection: selection, selectParent: selectParent,\n text: urlText,\n title: '',\n target: '_blank'\n };\n this.parent.formatter.process(this.parent, {\n item: {\n 'command': 'Links',\n 'subCommand': 'CreateLink'\n }\n }, e, value);\n }\n };\n HtmlEditor.prototype.onToolbarClick = function (args) {\n var _this = this;\n var save;\n var selectNodeEle;\n var selectParentEle;\n var item = args.item;\n var closestElement = closest(args.originalEvent.target, '.e-rte-quick-popup');\n var target = args.originalEvent.target;\n this.parent.notify(events.closeTooltip, { target: target });\n if (item.command !== 'FormatPainter') {\n if (closestElement && !closestElement.classList.contains('e-rte-inline-popup') && !closestElement.classList.contains('e-rte-text-popup')) {\n if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||\n item.subCommand === 'FontColor' || item.subCommand === 'BackgroundColor')) {\n if (isIDevice() && item.command === 'Images') {\n this.nodeSelectionObj.restore();\n }\n var range = this.nodeSelectionObj.getRange(this.parent.contentModule.getDocument());\n save = this.nodeSelectionObj.save(range, this.parent.contentModule.getDocument());\n selectNodeEle = this.nodeSelectionObj.getNodeCollection(range);\n selectParentEle = this.nodeSelectionObj.getParentNodeCollection(range);\n }\n if (item.command === 'Images') {\n this.parent.notify(events.imageToolbarAction, {\n member: 'image', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n }\n if (item.command === 'Audios') {\n this.parent.notify(events.audioToolbarAction, {\n member: 'audio', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n }\n if (item.command === 'Videos') {\n this.parent.notify(events.videoToolbarAction, {\n member: 'video', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n }\n if (item.command === 'Links') {\n this.parent.notify(events.linkToolbarAction, {\n member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n }\n if (item.command === 'Table') {\n this.parent.notify(events.tableToolbarAction, {\n member: 'table', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n }\n }\n else {\n var linkDialog = document.getElementById(this.parent.getID() + '_rtelink');\n var imageDialog = document.getElementById(this.parent.getID() + '_image');\n if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||\n item.subCommand === 'FontColor' || item.subCommand === 'BackgroundColor')) {\n var range = this.nodeSelectionObj.getRange(this.parent.contentModule.getDocument());\n if (isNullOrUndefined(linkDialog) && isNullOrUndefined(imageDialog)) {\n save = this.nodeSelectionObj.save(range, this.parent.contentModule.getDocument());\n }\n selectNodeEle = this.nodeSelectionObj.getNodeCollection(range);\n selectParentEle = this.nodeSelectionObj.getParentNodeCollection(range);\n }\n switch (item.subCommand) {\n case 'Maximize':\n this.parent.notify(events.enableFullScreen, { args: args });\n break;\n case 'Minimize':\n this.parent.notify(events.disableFullScreen, { args: args });\n break;\n case 'CreateLink':\n this.parent.notify(events.insertLink, {\n member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n break;\n case 'RemoveLink':\n this.parent.notify(events.unLink, {\n member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n break;\n case 'Print':\n this.parent.print();\n break;\n case 'Image':\n this.parent.notify(events.insertImage, {\n member: 'image', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n break;\n case 'Audio':\n this.parent.notify(events.insertAudio, {\n member: 'audio', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n break;\n case 'Video':\n this.parent.notify(events.insertVideo, {\n member: 'video', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n break;\n case 'CreateTable':\n this.parent.notify(events.createTable, {\n member: 'table', args: args, selection: save\n });\n break;\n case 'SourceCode':\n this.parent.notify(events.sourceCode, { member: 'viewSource', args: args });\n break;\n case 'Preview':\n this.parent.notify(events.updateSource, { member: 'updateSource', args: args });\n break;\n case 'FontColor':\n case 'BackgroundColor':\n break;\n case 'File':\n this.parent.notify(events.renderFileManager, {\n member: 'fileManager', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle\n });\n break;\n case 'EmojiPicker':\n this.parent.notify(events.emojiPicker, { member: 'emojiPicker', args: args });\n break;\n default:\n this.parent.formatter.process(this.parent, args, args.originalEvent, null);\n break;\n }\n }\n }\n else {\n if (args.originalEvent.detail === 1) {\n clearTimeout(this.clickTimeout);\n this.clickTimeout = setTimeout(function () {\n _this.parent.notify(events.formatPainterClick, {\n member: 'formatPainter', args: args\n });\n }, 200);\n }\n else {\n clearTimeout(this.clickTimeout);\n this.parent.notify(events.formatPainterDoubleClick, {\n member: 'formatPainter', args: args\n });\n }\n }\n };\n HtmlEditor.prototype.renderColorPicker = function (args) {\n this.colorPickerModule.renderColorPickerInput(args);\n };\n HtmlEditor.prototype.instantiateRenderer = function () {\n if (this.parent.iframeSettings.enable) {\n this.renderFactory.addRenderer(RenderType.Content, new IframeContentRender(this.parent, this.locator));\n }\n else {\n this.renderFactory.addRenderer(RenderType.Content, new ContentRender(this.parent, this.locator));\n }\n };\n HtmlEditor.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.initialEnd, this.render);\n this.parent.off(events.modelChanged, this.onPropertyChanged);\n this.parent.off(events.htmlToolbarClick, this.onToolbarClick);\n this.parent.off(events.renderColorPicker, this.renderColorPicker);\n this.parent.off(events.destroy, this.destroy);\n this.parent.off(events.keyDown, this.onKeyDown);\n this.parent.off(events.initialLoad, this.instantiateRenderer);\n this.parent.off(events.selectAll, this.selectAll);\n this.parent.off(events.selectRange, this.selectRange);\n this.parent.off(events.getSelectedHtml, this.getSelectedHtml);\n this.parent.off(events.selectionSave, this.onSelectionSave);\n this.parent.off(events.selectionRestore, this.onSelectionRestore);\n this.parent.off(events.readOnlyMode, this.updateReadOnly);\n this.parent.off(events.paste, this.onPaste);\n this.parent.off(events.tableclass, this.isTableClassAdded);\n };\n HtmlEditor.prototype.render = function () {\n this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);\n var editElement = this.contentRenderer.getEditPanel();\n var option = { undoRedoSteps: this.parent.undoRedoSteps, undoRedoTimer: this.parent.undoRedoTimer };\n if (isNullOrUndefined(this.parent.formatter)) {\n var formatterClass = new HTMLFormatter({\n currentDocument: this.contentRenderer.getDocument(),\n element: editElement,\n options: option,\n formatPainterSettings: this.parent.formatPainterSettings\n });\n this.parent.setProperties({ formatter: formatterClass }, true);\n }\n else {\n this.parent.formatter.updateFormatter(editElement, this.contentRenderer.getDocument(), option);\n }\n if (this.parent.enableXhtml) {\n this.parent.notify(events.xhtmlValidation, {});\n }\n if (this.parent.toolbarSettings.enable) {\n this.toolbarUpdate = new HtmlToolbarStatus(this.parent);\n }\n if (this.parent.inlineMode.enable) {\n if (!isNullOrUndefined(this.parent.fontFamily.default)) {\n editElement.style.fontFamily = this.parent.fontFamily.default;\n }\n if (!isNullOrUndefined(this.parent.fontSize.default)) {\n editElement.style.fontSize = this.parent.fontSize.default;\n }\n }\n this.parent.notify(events.bindOnEnd, {});\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {RichTextEditorModel} e - specifies the editor model\n * @returns {void}\n * @hidden\n\n */\n HtmlEditor.prototype.onPropertyChanged = function (e) {\n // On property code change here\n if (!isNOU(e) && !isNOU(e.newProp.toolbarSettings) && !isNOU(e.newProp.toolbarSettings.enable)) {\n this.toolbarUpdate = new HtmlToolbarStatus(this.parent);\n }\n if (!isNullOrUndefined(e.newProp.formatter)) {\n var editElement = this.contentRenderer.getEditPanel();\n var option = { undoRedoSteps: this.parent.undoRedoSteps,\n undoRedoTimer: this.parent.undoRedoTimer };\n this.parent.formatter.updateFormatter(editElement, this.contentRenderer.getDocument(), option);\n }\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} - returns the string value\n * @hidden\n */\n HtmlEditor.prototype.getModuleName = function () {\n return 'htmlEditor';\n };\n /**\n * For selecting all content in RTE\n *\n * @returns {void}\n * @private\n * @hidden\n */\n HtmlEditor.prototype.selectAll = function () {\n var nodes = getTextNodesUnder(this.parent.contentModule.getDocument(), this.parent.contentModule.getEditPanel());\n if (nodes.length > 0) {\n this.parent.formatter.editorManager.nodeSelection.setSelectionText(this.parent.contentModule.getDocument(), nodes[0], nodes[nodes.length - 1], 0, nodes[nodes.length - 1].textContent.length);\n }\n };\n /**\n * For selecting all content in RTE\n *\n * @param {NotifyArgs} e - specifies the notified arguments\n * @returns {void}\n * @private\n * @hidden\n */\n HtmlEditor.prototype.selectRange = function (e) {\n this.parent.formatter.editorManager.nodeSelection.setRange(this.parent.contentModule.getDocument(), e.range);\n };\n /**\n * For get a selected text in RTE\n *\n * @param {NotifyArgs} e - specifies the notified arguments\n * @returns {void}\n * @hidden\n */\n HtmlEditor.prototype.getSelectedHtml = function (e) {\n e.callBack(this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument()).toString());\n };\n HtmlEditor.prototype.marginTabAdd = function (val, alignmentNodes) {\n for (var index = 0; index < alignmentNodes.length; index++) {\n var element = alignmentNodes[index];\n if (element.closest('li')) {\n continue;\n }\n if (element.style.marginLeft) {\n var count = parseInt(element.style.marginLeft, 10);\n if (val) {\n count -= 20;\n }\n else {\n count += 20;\n }\n element.style.marginLeft = count.toString() + 'px';\n if (element.style.marginLeft === '0px') {\n element.removeAttribute('style');\n }\n }\n else if (!val) {\n element.style.marginLeft = '20px';\n }\n }\n };\n return HtmlEditor;\n}());\nexport { HtmlEditor };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Specifies the Ajax settings of the File Manager.\n */\nvar AjaxSettings = /** @class */ (function (_super) {\n __extends(AjaxSettings, _super);\n function AjaxSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], AjaxSettings.prototype, \"downloadUrl\", void 0);\n __decorate([\n Property(null)\n ], AjaxSettings.prototype, \"getImageUrl\", void 0);\n __decorate([\n Property(null)\n ], AjaxSettings.prototype, \"uploadUrl\", void 0);\n __decorate([\n Property(null)\n ], AjaxSettings.prototype, \"url\", void 0);\n return AjaxSettings;\n}(ChildProperty));\nexport { AjaxSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\nexport var defaultToolbarItems = ['NewFolder', 'Upload', 'Cut', 'Copy', 'Paste', 'Delete', 'Download', 'Rename',\n 'SortBy', 'Refresh', 'Selection', 'View', 'Details'];\n/**\n * Specifies the Toolbar settings of the FileManager.\n */\nvar ToolbarSettings = /** @class */ (function (_super) {\n __extends(ToolbarSettings, _super);\n function ToolbarSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(defaultToolbarItems)\n ], ToolbarSettings.prototype, \"items\", void 0);\n __decorate([\n Property(true)\n ], ToolbarSettings.prototype, \"visible\", void 0);\n return ToolbarSettings;\n}(ChildProperty));\nexport { ToolbarSettings };\nvar ToolbarItem = /** @class */ (function (_super) {\n __extends(ToolbarItem, _super);\n function ToolbarItem() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], ToolbarItem.prototype, \"id\", void 0);\n __decorate([\n Property('')\n ], ToolbarItem.prototype, \"text\", void 0);\n __decorate([\n Property('auto')\n ], ToolbarItem.prototype, \"width\", void 0);\n __decorate([\n Property('')\n ], ToolbarItem.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], ToolbarItem.prototype, \"showAlwaysInPopup\", void 0);\n __decorate([\n Property(false)\n ], ToolbarItem.prototype, \"disabled\", void 0);\n __decorate([\n Property('')\n ], ToolbarItem.prototype, \"prefixIcon\", void 0);\n __decorate([\n Property('')\n ], ToolbarItem.prototype, \"suffixIcon\", void 0);\n __decorate([\n Property(true)\n ], ToolbarItem.prototype, \"visible\", void 0);\n __decorate([\n Property('None')\n ], ToolbarItem.prototype, \"overflow\", void 0);\n __decorate([\n Property('')\n ], ToolbarItem.prototype, \"template\", void 0);\n __decorate([\n Property('Button')\n ], ToolbarItem.prototype, \"type\", void 0);\n __decorate([\n Property('Both')\n ], ToolbarItem.prototype, \"showTextOn\", void 0);\n __decorate([\n Property(null)\n ], ToolbarItem.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property('')\n ], ToolbarItem.prototype, \"tooltipText\", void 0);\n __decorate([\n Property('Left')\n ], ToolbarItem.prototype, \"align\", void 0);\n __decorate([\n Property(-1)\n ], ToolbarItem.prototype, \"tabIndex\", void 0);\n __decorate([\n Property()\n ], ToolbarItem.prototype, \"name\", void 0);\n return ToolbarItem;\n}(ChildProperty));\nexport { ToolbarItem };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Specifies the Search settings of the File Manager.\n */\nvar SearchSettings = /** @class */ (function (_super) {\n __extends(SearchSettings, _super);\n function SearchSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], SearchSettings.prototype, \"allowSearchOnTyping\", void 0);\n __decorate([\n Property('contains')\n ], SearchSettings.prototype, \"filterType\", void 0);\n __decorate([\n Property(true)\n ], SearchSettings.prototype, \"ignoreCase\", void 0);\n __decorate([\n Property(null)\n ], SearchSettings.prototype, \"placeholder\", void 0);\n return SearchSettings;\n}(ChildProperty));\nexport { SearchSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty, initializeCSPTemplate } from '@syncfusion/ej2-base';\n/**\n * Specifies the columns in the details view of the file manager.\n */\nexport var columnArray = [\n {\n field: 'name', headerText: 'Name', minWidth: 120,\n template: '${name}',\n customAttributes: { class: 'e-fe-grid-name' }\n },\n {\n field: '_fm_modified', headerText: 'DateModified', type: 'dateTime',\n format: 'MMMM dd, yyyy HH:mm', minWidth: 120, width: '190'\n },\n {\n field: 'size', headerText: 'Size', minWidth: 90, width: '110',\n template: initializeCSPTemplate(function (data) {\n return \"\" + data.size + \"\";\n }), format: 'n2'\n }\n];\n/**\n * Specifies the grid settings of the File Manager.\n */\nvar DetailsViewSettings = /** @class */ (function (_super) {\n __extends(DetailsViewSettings, _super);\n function DetailsViewSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], DetailsViewSettings.prototype, \"columnResizing\", void 0);\n __decorate([\n Property(columnArray)\n ], DetailsViewSettings.prototype, \"columns\", void 0);\n return DetailsViewSettings;\n}(ChildProperty));\nexport { DetailsViewSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\nexport var fileItems = ['Open', '|', 'Cut', 'Copy', '|', 'Delete', 'Download', 'Rename', '|', 'Details'];\nexport var folderItems = ['Open', '|', 'Cut', 'Copy', 'Paste', '|', 'Delete', 'Rename', 'Download', '|', 'Details'];\nexport var layoutItems = [\n 'SortBy', 'View', 'Refresh', '|', 'Paste', '|', 'NewFolder', 'Upload', '|', 'Details', '|', 'SelectAll'\n];\n/**\n * Specifies the ContextMenu settings of the File Manager.\n */\nvar ContextMenuSettings = /** @class */ (function (_super) {\n __extends(ContextMenuSettings, _super);\n function ContextMenuSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(fileItems)\n ], ContextMenuSettings.prototype, \"file\", void 0);\n __decorate([\n Property(folderItems)\n ], ContextMenuSettings.prototype, \"folder\", void 0);\n __decorate([\n Property(layoutItems)\n ], ContextMenuSettings.prototype, \"layout\", void 0);\n __decorate([\n Property(true)\n ], ContextMenuSettings.prototype, \"visible\", void 0);\n return ContextMenuSettings;\n}(ChildProperty));\nexport { ContextMenuSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Specifies the navigationpane settings of the File Manager.\n */\nvar NavigationPaneSettings = /** @class */ (function (_super) {\n __extends(NavigationPaneSettings, _super);\n function NavigationPaneSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('650px')\n ], NavigationPaneSettings.prototype, \"maxWidth\", void 0);\n __decorate([\n Property('240px')\n ], NavigationPaneSettings.prototype, \"minWidth\", void 0);\n __decorate([\n Property(true)\n ], NavigationPaneSettings.prototype, \"visible\", void 0);\n __decorate([\n Property('None')\n ], NavigationPaneSettings.prototype, \"sortOrder\", void 0);\n return NavigationPaneSettings;\n}(ChildProperty));\nexport { NavigationPaneSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Specifies the Ajax settings of the File Manager.\n */\nvar UploadSettings = /** @class */ (function (_super) {\n __extends(UploadSettings, _super);\n function UploadSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('')\n ], UploadSettings.prototype, \"allowedExtensions\", void 0);\n __decorate([\n Property(true)\n ], UploadSettings.prototype, \"autoUpload\", void 0);\n __decorate([\n Property(false)\n ], UploadSettings.prototype, \"autoClose\", void 0);\n __decorate([\n Property(false)\n ], UploadSettings.prototype, \"directoryUpload\", void 0);\n __decorate([\n Property(0)\n ], UploadSettings.prototype, \"minFileSize\", void 0);\n __decorate([\n Property(30000000)\n ], UploadSettings.prototype, \"maxFileSize\", void 0);\n return UploadSettings;\n}(ChildProperty));\nexport { UploadSettings };\n","import { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { Internationalization, setCulture } from '@syncfusion/ej2-base';\n/**\n * ValueFormatter class to globalize the value.\n *\n * @hidden\n */\nvar ValueFormatter = /** @class */ (function () {\n function ValueFormatter(cultureName) {\n this.intl = new Internationalization();\n if (!isNullOrUndefined(cultureName)) {\n this.intl.culture = cultureName;\n }\n }\n ValueFormatter.prototype.getFormatFunction = function (format) {\n if (format.type) {\n return this.intl.getDateFormat(format);\n }\n else {\n return this.intl.getNumberFormat(format);\n }\n };\n ValueFormatter.prototype.getParserFunction = function (format) {\n if (format.type) {\n return this.intl.getDateParser(format);\n }\n else {\n return this.intl.getNumberParser(format);\n }\n };\n ValueFormatter.prototype.fromView = function (value, format, type) {\n if ((type === 'date' || type === 'datetime' || type === 'number') && (!isNullOrUndefined(format))) {\n return format(value);\n }\n else {\n return value;\n }\n };\n ValueFormatter.prototype.toView = function (value, format) {\n var result = value;\n if (!isNullOrUndefined(format) && !isNullOrUndefined(value)) {\n result = format(value);\n }\n return result;\n };\n ValueFormatter.prototype.setCulture = function (cultureName) {\n if (!isNullOrUndefined(cultureName)) {\n setCulture(cultureName);\n }\n };\n return ValueFormatter;\n}());\nexport { ValueFormatter };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { merge, isNullOrUndefined, extend, Property } from '@syncfusion/ej2-base';\nimport { Query, DataUtil } from '@syncfusion/ej2-data';\nimport { ValueFormatter } from '../services/value-formatter';\nimport { getUid, templateCompiler, getForeignData, getObject } from '../base/util';\n/**\n * Represents Grid `Column` model class.\n */\nvar Column = /** @class */ (function () {\n function Column(options, parent) {\n var _this = this;\n /**\n * If `disableHtmlEncode` is set to true, it encodes the HTML of the header and content cells.\n *\n * @default true\n */\n this.disableHtmlEncode = true;\n /**\n * If `allowSorting` set to false, then it disables sorting option of a particular column.\n * By default all columns are sortable.\n *\n * @default true\n */\n this.allowSorting = true;\n /**\n * If `allowResizing` is set to false, it disables resize option of a particular column.\n * By default all the columns can be resized.\n *\n * @default true\n */\n this.allowResizing = true;\n /**\n * If `allowFiltering` set to false, then it disables filtering option and filter bar element of a particular column.\n * By default all columns are filterable.\n *\n * @default true\n */\n this.allowFiltering = true;\n /**\n * If `allowGrouping` set to false, then it disables grouping of a particular column.\n * By default all columns are groupable.\n *\n * @default true\n */\n this.allowGrouping = true;\n /**\n * If `allowReordering` set to false, then it disables reorder of a particular column.\n * By default all columns can be reorder.\n *\n * @default true\n */\n this.allowReordering = true;\n /**\n * If `showColumnMenu` set to false, then it disable the column menu of a particular column.\n * By default column menu will show for all columns\n *\n * @default true\n */\n this.showColumnMenu = true;\n /**\n * If `enableGroupByFormat` set to true, then it groups the particular column by formatted values.\n *\n * @default true\n */\n this.enableGroupByFormat = false;\n /**\n * If `allowEditing` set to false, then it disables editing of a particular column.\n * By default all columns are editable.\n *\n * @default true\n */\n this.allowEditing = true;\n /**\n * It is used to customize the default filter options for a specific columns.\n * * type - Specifies the filter type as menu or checkbox.\n * * ui - to render custom component for specific column it has following functions.\n * * ui.create – It is used for creating custom components.\n * * ui.read - It is used for read the value from the component.\n * * ui.write - It is used to apply component model as dynamically.\n * {% codeBlock src=\"grid/filter-menu-api/index.ts\" %}{% endcodeBlock %}\n *\n * > Check the [`Filter UI`](../../grid/filtering/filter-menu/#custom-component-in-filter-menu) for its customization.\n *\n * @default {}\n */\n this.filter = {};\n /**\n * If `showInColumnChooser` set to false, then hide the particular column in column chooser.\n * By default all columns are displayed in column Chooser.\n *\n * @default true\n */\n this.showInColumnChooser = true;\n /**\n * Defines the `IEditCell` object to customize default edit cell.\n *\n * @default {}\n */\n this.edit = {};\n /**\n * If `allowSearching` set to false, then it disables Searching of a particular column.\n * By default all columns allow Searching.\n *\n * @default true\n */\n this.allowSearching = true;\n /**\n * If `autoFit` set to true, then the particular column content width will be\n * adjusted based on its content in the initial rendering itself.\n * Setting this property as true is equivalent to calling `autoFitColumns` method in the `dataBound` event.\n *\n * @default false\n */\n this.autoFit = false;\n this.sortDirection = 'Descending';\n /**\n * @returns {Function} returns the edit template\n * @hidden */\n this.getEditTemplate = function () { return _this.editTemplateFn; };\n /**\n * @returns {Function} returns the filter template\n * @hidden */\n this.getFilterTemplate = function () { return _this.filterTemplateFn; };\n merge(this, options);\n this.parent = parent;\n if (this.type === 'none') {\n this.type = null;\n }\n else if (this.type) {\n this.type = typeof (this.type) === 'string' ? this.type.toLowerCase() : undefined;\n }\n if (this.editType) {\n this.editType = this.editType.toLowerCase();\n }\n if (isNullOrUndefined(this.uid)) {\n this.uid = getUid('grid-column');\n }\n var valueFormatter = new ValueFormatter();\n if (options.format && (options.format.skeleton || (options.format.format &&\n typeof options.format.format === 'string'))) {\n this.setFormatter(valueFormatter.getFormatFunction(extend({}, options.format)));\n this.setParser(valueFormatter.getParserFunction(options.format));\n }\n this.toJSON = function () {\n var col = {};\n var skip = ['filter', 'dataSource', 'headerText', 'template', 'headerTemplate', 'edit',\n 'editTemplate', 'filterTemplate', 'commandsTemplate', 'parent'];\n var keys = Object.keys(_this);\n for (var i = 0; i < keys.length; i++) {\n if (keys[parseInt(i.toString(), 10)] === 'columns') {\n col[keys[parseInt(i.toString(), 10)]] = [];\n for (var j = 0; j < _this[keys[parseInt(i.toString(), 10)]].length; j++) {\n col[keys[parseInt(i.toString(), 10)]].push(_this[keys[parseInt(i.toString(), 10)]][parseInt(j.toString(), 10)].toJSON());\n }\n }\n else if (skip.indexOf(keys[parseInt(i.toString(), 10)]) < 0) {\n col[keys[parseInt(i.toString(), 10)]] = _this[keys[parseInt(i.toString(), 10)]];\n }\n }\n return col;\n };\n if (!this.field) {\n this.allowFiltering = false;\n this.allowGrouping = false;\n this.allowSorting = false;\n if (this.columns) {\n this.allowResizing = this.columns.some(function (col) {\n return col.allowResizing;\n });\n }\n }\n if (this.commands && !this.textAlign) {\n this.textAlign = 'Right';\n }\n if (this.template || this.commandsTemplate) {\n this.templateFn = templateCompiler(this.template || this.commandsTemplate);\n }\n if (this.headerTemplate) {\n this.headerTemplateFn = templateCompiler(this.headerTemplate);\n }\n if (!isNullOrUndefined(this.filter) && this.filter.itemTemplate) {\n this.fltrTemplateFn = templateCompiler(this.filter.itemTemplate);\n }\n if (this.editTemplate) {\n this.editTemplateFn = templateCompiler(this.editTemplate);\n }\n if (this.filterTemplate) {\n this.filterTemplateFn = templateCompiler(this.filterTemplate);\n }\n if (this.isForeignColumn() &&\n (isNullOrUndefined(this.editType) || this.editType === 'dropdownedit' || this.editType === 'defaultedit')) {\n this.editType = 'dropdownedit';\n if (this.edit.params && this.edit.params.dataSource) {\n this.edit.params.ddEditedData = true;\n }\n this.edit.params = extend({\n dataSource: this.dataSource,\n query: new Query(), fields: { value: this.foreignKeyField || this.field, text: this.foreignKeyValue }\n }, this.edit.params);\n }\n if (this.sortComparer) {\n var a_1 = this.sortComparer;\n this.sortComparer = function (x, y, xObj, yObj) {\n if (typeof a_1 === 'string') {\n a_1 = getObject(a_1, window);\n }\n if (_this.sortDirection === 'Descending') {\n var z = x;\n x = y;\n y = z;\n var obj = xObj;\n xObj = yObj;\n yObj = obj;\n }\n return a_1(x, y, xObj, yObj);\n };\n }\n if (!this.sortComparer && this.isForeignColumn()) {\n this.sortComparer = function (x, y) {\n x = getObject(_this.foreignKeyValue, getForeignData(_this, {}, x)[0]);\n y = getObject(_this.foreignKeyValue, getForeignData(_this, {}, y)[0]);\n return _this.sortDirection === 'Descending' ? DataUtil.fnDescending(x, y) : DataUtil.fnAscending(x, y);\n };\n }\n }\n /**\n * @returns {string} returns the sort direction\n * @hidden */\n Column.prototype.getSortDirection = function () {\n return this.sortDirection;\n };\n /**\n * @param {string} direction - specifies the direction\n * @returns {void}\n * @hidden\n */\n Column.prototype.setSortDirection = function (direction) {\n this.sortDirection = direction;\n };\n /**\n * @returns {freezeTable} returns the FreezeTable\n * @hidden */\n Column.prototype.getFreezeTableName = function () {\n return this.freezeTable;\n };\n /**\n * @param {Column} column - specifies the column\n * @returns {void}\n * @hidden\n */\n Column.prototype.setProperties = function (column) {\n //Angular two way binding\n var keys = Object.keys(column);\n var _loop_1 = function (i) {\n if (keys[parseInt(i.toString(), 10)] === 'columns') {\n var cols_1 = column[keys[parseInt(i.toString(), 10)]];\n var _loop_2 = function (j) {\n this_1.columns.find(function (col) {\n return col.field === cols_1[parseInt(j.toString(), 10)]\n .field;\n }).setProperties(cols_1[parseInt(j.toString(), 10)]);\n };\n for (var j = 0; j < cols_1.length; j++) {\n _loop_2(j);\n }\n }\n else {\n this_1[keys[parseInt(i.toString(), 10)]] = column[keys[parseInt(i.toString(), 10)]];\n }\n //Refresh the react columnTemplates on state change\n if (this_1.parent && this_1.parent.isReact) {\n if (keys[parseInt(i.toString(), 10)] === 'template') {\n this_1.templateFn = templateCompiler(column[keys[parseInt(i.toString(), 10)]]);\n this_1.parent.refreshReactColumnTemplateByUid(this_1.uid, true);\n }\n else if (keys[parseInt(i.toString(), 10)] === 'headerTemplate') {\n this_1.headerTemplateFn = templateCompiler(column[keys[parseInt(i.toString(), 10)]]);\n this_1.parent.refreshReactHeaderTemplateByUid(this_1.uid);\n }\n else if (keys[parseInt(i.toString(), 10)] === 'editTemplate') {\n this_1.editTemplateFn = templateCompiler(column[keys[parseInt(i.toString(), 10)]]);\n }\n }\n };\n var this_1 = this;\n for (var i = 0; i < keys.length; i++) {\n _loop_1(i);\n }\n };\n /**\n * @returns {boolean} returns true for foreign column\n * @hidden\n * It defines the column is foreign key column or not.\n */\n Column.prototype.isForeignColumn = function () {\n return !!(this.dataSource && this.foreignKeyValue);\n };\n /**\n * @returns {Function} returns the function\n * @hidden\n */\n Column.prototype.getFormatter = function () {\n return this.formatFn;\n };\n /**\n * @param {Function} value - specifies the value\n * @returns {void}\n * @hidden\n */\n Column.prototype.setFormatter = function (value) {\n this.formatFn = value;\n };\n /**\n * @returns {Function} returns the function\n * @hidden */\n Column.prototype.getParser = function () {\n return this.parserFn;\n };\n /**\n * @param {Function} value - specifies the value\n * @returns {void}\n * @hidden\n */\n Column.prototype.setParser = function (value) {\n this.parserFn = value;\n };\n /**\n * @returns {Function} returns the function\n * @hidden */\n Column.prototype.getColumnTemplate = function () {\n return this.templateFn;\n };\n /**\n * @returns {Function} returns the function\n * @hidden */\n Column.prototype.getHeaderTemplate = function () {\n return this.headerTemplateFn;\n };\n /**\n * @returns {Function} returns the function\n * @hidden */\n Column.prototype.getFilterItemTemplate = function () {\n return this.fltrTemplateFn;\n };\n /**\n * @returns {string} returns the string\n * @hidden */\n Column.prototype.getDomSetter = function () {\n return this.disableHtmlEncode ? 'textContent' : 'innerHTML';\n };\n return Column;\n}());\nexport { Column };\n/**\n * Define options for custom command buttons.\n */\nvar CommandColumnModel = /** @class */ (function () {\n function CommandColumnModel() {\n }\n __decorate([\n Property()\n ], CommandColumnModel.prototype, \"title\", void 0);\n __decorate([\n Property()\n ], CommandColumnModel.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], CommandColumnModel.prototype, \"buttonOption\", void 0);\n return CommandColumnModel;\n}());\nexport { CommandColumnModel };\n/**\n * Defines Grid column\n */\nvar GridColumn = /** @class */ (function (_super) {\n __extends(GridColumn, _super);\n function GridColumn() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], GridColumn.prototype, \"columns\", void 0);\n return GridColumn;\n}(Column));\nexport { GridColumn };\n/**\n * Defines stacked grid column\n */\nvar StackedColumn = /** @class */ (function (_super) {\n __extends(StackedColumn, _super);\n function StackedColumn() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n return StackedColumn;\n}(GridColumn));\nexport { StackedColumn };\n","/** @hidden */\nexport var created = 'create';\n/** @hidden */\nexport var destroyed = 'destroy';\n/** @hidden */\nexport var load = 'load';\n/** @hidden */\nexport var rowDataBound = 'rowDataBound';\n/** @hidden */\nexport var queryCellInfo = 'queryCellInfo';\n/** @hidden */\nexport var headerCellInfo = 'headerCellInfo';\n/** @hidden */\nexport var actionBegin = 'actionBegin';\n/** @hidden */\nexport var actionComplete = 'actionComplete';\n/** @hidden */\nexport var actionFailure = 'actionFailure';\n/** @hidden */\nexport var dataBound = 'dataBound';\n/** @hidden */\nexport var rowSelecting = 'rowSelecting';\n/** @hidden */\nexport var rowSelected = 'rowSelected';\n/** @hidden */\nexport var rowDeselecting = 'rowDeselecting';\n/** @hidden */\nexport var rowDeselected = 'rowDeselected';\n/** @hidden */\nexport var cellSelecting = 'cellSelecting';\n/** @hidden */\nexport var cellSelected = 'cellSelected';\n/** @hidden */\nexport var cellDeselecting = 'cellDeselecting';\n/** @hidden */\nexport var cellDeselected = 'cellDeselected';\n/** @hidden */\nexport var columnSelecting = 'columnSelecting';\n/** @hidden */\nexport var columnSelected = 'columnSelected';\n/** @hidden */\nexport var columnDeselecting = 'columnDeselecting';\n/** @hidden */\nexport var columnDeselected = 'columnDeselected';\n/** @hidden */\nexport var columnDragStart = 'columnDragStart';\n/** @hidden */\nexport var columnDrag = 'columnDrag';\n/** @hidden */\nexport var columnDrop = 'columnDrop';\n/** @hidden */\nexport var rowDragStartHelper = 'rowDragStartHelper';\n/** @hidden */\nexport var rowDragStart = 'rowDragStart';\n/** @hidden */\nexport var rowDrag = 'rowDrag';\n/** @hidden */\nexport var rowDrop = 'rowDrop';\n/** @hidden */\nexport var beforePrint = 'beforePrint';\n/** @hidden */\nexport var printComplete = 'printComplete';\n/** @hidden */\nexport var detailDataBound = 'detailDataBound';\n/** @hidden */\nexport var toolbarClick = 'toolbarClick';\n/** @hidden */\nexport var batchAdd = 'batchAdd';\n/** @hidden */\nexport var batchCancel = 'batchCancel';\n/** @hidden */\nexport var batchDelete = 'batchDelete';\n/** @hidden */\nexport var beforeBatchAdd = 'beforeBatchAdd';\n/** @hidden */\nexport var beforeBatchDelete = 'beforeBatchDelete';\n/** @hidden */\nexport var beforeBatchSave = 'beforeBatchSave';\n/** @hidden */\nexport var beginEdit = 'beginEdit';\n/** @hidden */\nexport var cellEdit = 'cellEdit';\n/** @hidden */\nexport var cellSave = 'cellSave';\n/** @hidden */\nexport var cellSaved = 'cellSaved';\n/** @hidden */\nexport var endAdd = 'endAdd';\n/** @hidden */\nexport var endDelete = 'endDelete';\n/** @hidden */\nexport var endEdit = 'endEdit';\n/** @hidden */\nexport var recordDoubleClick = 'recordDoubleClick';\n/** @hidden */\nexport var recordClick = 'recordClick';\n/** @hidden */\nexport var beforeDataBound = 'beforeDataBound';\n/** @hidden */\nexport var beforeOpenColumnChooser = 'beforeOpenColumnChooser';\n/** @hidden */\nexport var beforeOpenAdaptiveDialog = 'beforeOpenAdaptiveDialog';\n/** @hidden */\nexport var resizeStart = 'resizeStart';\n/** @hidden */\nexport var onResize = 'resizing';\n/** @hidden */\nexport var resizeStop = 'resizeStop';\n/** @hidden */\nexport var checkBoxChange = 'checkBoxChange';\n/** @hidden */\nexport var beforeCopy = 'beforeCopy';\n/** @hidden */\nexport var beforePaste = 'beforePaste';\n/** @hidden */\nexport var beforeAutoFill = 'beforeAutoFill';\n/** @hidden */\nexport var filterChoiceRequest = 'filterchoicerequest';\n/** @hidden */\nexport var filterAfterOpen = 'filterAfterOpen';\n/** @hidden */\nexport var filterBeforeOpen = 'filterBeforeOpen';\n/** @hidden */\nexport var filterSearchBegin = 'filterSearchBegin';\n/** @hidden */\nexport var commandClick = 'commandClick';\n/** @hidden */\nexport var exportGroupCaption = 'exportGroupCaption';\n/** @hidden */\nexport var lazyLoadGroupExpand = 'lazyLoadGroupExpand';\n/** @hidden */\nexport var lazyLoadGroupCollapse = 'lazyLoadGroupCollapse';\n/**\n * Specifies grid internal events\n */\n/** @hidden */\nexport var initialLoad = 'initial-load';\n/** @hidden */\nexport var initialEnd = 'initial-end';\n/** @hidden */\nexport var dataReady = 'data-ready';\n/** @hidden */\nexport var contentReady = 'content-ready';\n/** @hidden */\nexport var uiUpdate = 'ui-update';\n/** @hidden */\nexport var onEmpty = 'on-empty';\n/** @hidden */\nexport var inBoundModelChanged = 'inbound-model-changed';\n/** @hidden */\nexport var modelChanged = 'model-changed';\n/** @hidden */\nexport var colGroupRefresh = 'colgroup-refresh';\n/** @hidden */\nexport var headerRefreshed = 'header-refreshed';\n/** @hidden */\nexport var pageBegin = 'paging-begin';\n/** @hidden */\nexport var pageComplete = 'paging-complete';\n/** @hidden */\nexport var sortBegin = 'sorting-begin';\n/** @hidden */\nexport var sortComplete = 'sorting-complete';\n/** @hidden */\nexport var filterBegin = 'filtering-begin';\n/** @hidden */\nexport var filterComplete = 'filtering-complete';\n/** @hidden */\nexport var searchBegin = 'searching-begin';\n/** @hidden */\nexport var searchComplete = 'searching-complete';\n/** @hidden */\nexport var reorderBegin = 'reorder-begin';\n/** @hidden */\nexport var reorderComplete = 'reorder-complete';\n/** @hidden */\nexport var rowDragAndDropBegin = 'rowdraganddrop-begin';\n/** @hidden */\nexport var rowDragAndDropComplete = 'rowdraganddrop-complete';\n/** @hidden */\nexport var groupBegin = 'grouping-begin';\n/** @hidden */\nexport var groupComplete = 'grouping-complete';\n/** @hidden */\nexport var ungroupBegin = 'ungrouping-begin';\n/** @hidden */\nexport var ungroupComplete = 'ungrouping-complete';\n/** @hidden */\nexport var groupAggregates = 'group-aggregates';\n/** @hidden */\nexport var refreshFooterRenderer = 'refresh-footer-rendered';\n/** @hidden */\nexport var refreshAggregateCell = 'refresh-aggregate-cell';\n/** @hidden */\nexport var refreshAggregates = 'refresh-aggregates';\n/** @hidden */\nexport var rowSelectionBegin = 'rowselecting';\n/** @hidden */\nexport var rowSelectionComplete = 'rowselected';\n/** @hidden */\nexport var columnSelectionBegin = 'columnselecting';\n/** @hidden */\nexport var columnSelectionComplete = 'columnselected';\n/** @hidden */\nexport var cellSelectionBegin = 'cellselecting';\n/** @hidden */\nexport var cellSelectionComplete = 'cellselected';\n/** @hidden */\nexport var destroyAutoFillElements = 'destroy-autofill-elements';\n/** @hidden */\nexport var beforeCellFocused = 'beforecellfocused';\n/** @hidden */\nexport var cellFocused = 'cellfocused';\n/** @hidden */\nexport var keyPressed = 'key-pressed';\n/** @hidden */\nexport var click = 'click';\n/** @hidden */\nexport var destroy = 'destroy';\n/** @hidden */\nexport var columnVisibilityChanged = 'column-visible-changed';\n/** @hidden */\nexport var scroll = 'scroll';\n/** @hidden */\nexport var columnWidthChanged = 'column-width-changed';\n/** @hidden */\nexport var columnPositionChanged = 'column-position-changed';\n/** @hidden */\nexport var rowDragAndDrop = 'row-drag-and-drop';\n/** @hidden */\nexport var rowsAdded = 'rows-added';\n/** @hidden */\nexport var rowsRemoved = 'rows-removed';\n/** @hidden */\nexport var columnDragStop = 'column-drag-stop';\n/** @hidden */\nexport var headerDrop = 'header-drop';\n/** @hidden */\nexport var dataSourceModified = 'datasource-modified';\n/** @hidden */\nexport var refreshComplete = 'refresh-complete';\n/** @hidden */\nexport var refreshVirtualBlock = 'refresh-virtual-block';\n/** @hidden */\nexport var dblclick = 'dblclick';\n/** @hidden */\nexport var toolbarRefresh = 'toolbar-refresh';\n/** @hidden */\nexport var bulkSave = 'bulk-save';\n/** @hidden */\nexport var autoCol = 'auto-col';\n/** @hidden */\nexport var tooltipDestroy = 'tooltip-destroy';\n/** @hidden */\nexport var updateData = 'update-data';\n/** @hidden */\nexport var editBegin = 'edit-begin';\n/** @hidden */\nexport var editComplete = 'edit-complete';\n/** @hidden */\nexport var addBegin = 'add-begin';\n/** @hidden */\nexport var addComplete = 'add-complete';\n/** @hidden */\nexport var saveComplete = 'save-complete';\n/** @hidden */\nexport var deleteBegin = 'delete-begin';\n/** @hidden */\nexport var deleteComplete = 'delete-complete';\n/** @hidden */\nexport var preventBatch = 'prevent-batch';\n/** @hidden */\nexport var dialogDestroy = 'dialog-destroy';\n/** @hidden */\nexport var crudAction = 'crud-Action';\n/** @hidden */\nexport var addDeleteAction = 'add-delete-Action';\n/** @hidden */\nexport var destroyForm = 'destroy-form';\n/** @hidden */\nexport var doubleTap = 'double-tap';\n/** @hidden */\nexport var beforeExcelExport = 'beforeExcelExport';\n/** @hidden */\nexport var excelExportComplete = 'excelExportComplete';\n/** @hidden */\nexport var excelQueryCellInfo = 'excelQueryCellInfo';\n/** @hidden */\nexport var excelHeaderQueryCellInfo = 'excelHeaderQueryCellInfo';\n/** @hidden */\nexport var exportDetailDataBound = 'exportDetailDataBound';\n/** @hidden */\nexport var exportDetailTemplate = 'exportDetailTemplate';\n/** @hidden */\nexport var beforePdfExport = 'beforePdfExport';\n/** @hidden */\nexport var pdfExportComplete = 'pdfExportComplete';\n/** @hidden */\nexport var pdfQueryCellInfo = 'pdfQueryCellInfo';\n/** @hidden */\nexport var pdfHeaderQueryCellInfo = 'pdfHeaderQueryCellInfo';\n/** @hidden */\nexport var accessPredicate = 'access-predicate';\n/** @hidden */\nexport var contextMenuClick = 'contextMenuClick';\n/** @hidden */\nexport var freezeRender = 'freezerender';\n/** @hidden */\nexport var freezeRefresh = 'freezerefresh';\n/** @hidden */\nexport var contextMenuOpen = 'contextMenuOpen';\n/** @hidden */\nexport var columnMenuClick = 'columnMenuClick';\n/** @hidden */\nexport var columnMenuOpen = 'columnMenuOpen';\n/** @hidden */\nexport var filterOpen = 'filterOpen';\n/** @hidden */\nexport var filterDialogCreated = 'filterDialogCreated';\n/** @hidden */\nexport var filterMenuClose = 'filter-menu-close';\n/** @hidden */\nexport var initForeignKeyColumn = 'initForeignKeyColumn';\n/** @hidden */\nexport var getForeignKeyData = 'getForeignKeyData';\n/** @hidden */\nexport var generateQuery = 'generateQuery';\n/** @hidden */\nexport var showEmptyGrid = 'showEmptyGrid';\n/** @hidden */\nexport var foreignKeyData = 'foreignKeyData';\n/** @hidden */\nexport var columnDataStateChange = 'columnDataStateChange';\n/** @hidden */\nexport var dataStateChange = 'dataStateChange';\n/** @hidden */\nexport var dataSourceChanged = 'dataSourceChanged';\n/** @hidden */\nexport var rtlUpdated = 'rtl-updated';\n/** @hidden */\nexport var beforeFragAppend = 'beforeFragAppend';\n/** @hidden */\nexport var frozenHeight = 'frozenHeight';\n/** @hidden */\nexport var textWrapRefresh = 'textWrapRefresh';\n/** @hidden */\nexport var recordAdded = 'recordAdded';\n/** @hidden */\nexport var cancelBegin = 'cancel-Begin';\n/** @hidden */\nexport var editNextValCell = 'editNextValCell';\n/** @hidden */\nexport var hierarchyPrint = 'hierarchyprint';\n/** @hidden */\nexport var expandChildGrid = 'expandchildgrid';\n/** @hidden */\nexport var printGridInit = 'printGrid-Init';\n/** @hidden */\nexport var exportRowDataBound = 'export-RowDataBound';\n/** @hidden */\nexport var exportDataBound = 'export-DataBound';\n/** @hidden */\nexport var rowPositionChanged = 'row-position-changed';\n/** @hidden */\nexport var columnChooserOpened = 'columnChooserOpened';\n/** @hidden */\nexport var batchForm = 'batchedit-form';\n/** @hidden */\nexport var beforeStartEdit = 'edit-form';\n/** @hidden */\nexport var beforeBatchCancel = 'before-batch-cancel';\n/** @hidden */\nexport var batchEditFormRendered = 'batcheditform-rendered';\n/** @hidden */\nexport var partialRefresh = 'partial-refresh';\n/** @hidden */\nexport var beforeCustomFilterOpen = 'beforeCustomFilterOpen';\n/** @hidden */\nexport var selectVirtualRow = 'select-virtual-Row';\n/** @hidden */\nexport var columnsPrepared = 'columns-prepared';\n/** @hidden */\nexport var cBoxFltrBegin = 'cbox-filter-begin';\n/** @hidden */\nexport var cBoxFltrComplete = 'cbox-filter-complete';\n/** @hidden */\nexport var fltrPrevent = 'filter-Prevent';\n/** @hidden */\nexport var beforeFltrcMenuOpen = 'before-filter-cmenu-open';\n/** @hidden */\nexport var valCustomPlacement = 'validation-custom-placement';\n/** @hidden */\nexport var filterCboxValue = 'filter-cbox-value';\n/** @hidden */\nexport var componentRendered = 'component-rendered';\n/** @hidden */\nexport var restoreFocus = 'restore-Focus';\n/** @hidden */\nexport var detailStateChange = 'detail-state-change';\n/** @hidden */\nexport var detailIndentCellInfo = 'detail-indentcell-info';\n/** @hidden */\nexport var virtaulKeyHandler = 'virtaul-key-handler';\n/** @hidden */\nexport var virtaulCellFocus = 'virtaul-cell-focus';\n/** @hidden */\nexport var virtualScrollEditActionBegin = 'virtual-scroll-edit-action-begin';\n/** @hidden */\nexport var virtualScrollEditSuccess = 'virtual-scroll-edit-success';\n/** @hidden */\nexport var virtualScrollEditCancel = 'virtual-scroll-edit-cancel';\n/** @hidden */\nexport var virtualScrollEdit = 'virtual-scroll-edit';\n/** @hidden */\nexport var refreshVirtualCache = 'refresh-virtual-cache';\n/** @hidden */\nexport var editReset = 'edit-reset';\n/** @hidden */\nexport var virtualScrollAddActionBegin = 'virtual-scroll-add-action-begin';\n/** @hidden */\nexport var getVirtualData = 'get-virtual-data';\n/** @hidden */\nexport var refreshInfiniteModeBlocks = 'refresh-infinite-mode-blocks';\n/** @hidden */\nexport var resetInfiniteBlocks = 'reset-infinite-blocks';\n/** @hidden */\nexport var infiniteScrollHandler = 'infinite-scroll-handler';\n/** @hidden */\nexport var infinitePageQuery = 'infinite-page-query';\n/** @hidden */\nexport var infiniteShowHide = 'infinite-show-hide';\n/** @hidden */\nexport var appendInfiniteContent = 'append-infinite-content';\n/** @hidden */\nexport var removeInfiniteRows = 'remove-infinite-rows';\n/** @hidden */\nexport var setInfiniteCache = 'set-infinite-cache';\n/** @hidden */\nexport var infiniteEditHandler = 'infinite-edit-handler';\n/** @hidden */\nexport var initialCollapse = 'initial-collapse';\n/** @hidden */\nexport var getAggregateQuery = 'get-aggregate-query';\n/** @hidden */\nexport var closeFilterDialog = 'close-filter-dialog';\n/** @hidden */\nexport var columnChooserCancelBtnClick = 'columnChooserCancelBtnClick';\n/** @hidden */\nexport var getFilterBarOperator = 'get-filterbar-operator';\n/** @hidden */\nexport var resetColumns = 'reset-columns';\n/** @hidden */\nexport var pdfAggregateQueryCellInfo = 'pdfAggregateQueryCellInfo';\n/** @hidden */\nexport var excelAggregateQueryCellInfo = 'excelAggregateQueryCellInfo';\n/** @hidden */\nexport var setGroupCache = 'group-cache';\n/** @hidden */\nexport var lazyLoadScrollHandler = 'lazy-load-scroll-handler';\n/** @hidden */\nexport var groupCollapse = 'group-collapse';\n/** @hidden */\nexport var beforeCheckboxRenderer = 'beforeCheckboxRenderer';\n/** @hidden */\nexport var refreshHandlers = 'refreshResizeHandlers';\n/** @hidden */\nexport var refreshFrozenColumns = 'refresh-frozen-columns';\n/** @hidden */\nexport var setReorderDestinationElement = 'set-reorder-destination-element';\n/** @hidden */\nexport var refreshVirtualFrozenHeight = 'refresh-virtual-frozen-height';\n/** @hidden */\nexport var setFreezeSelection = 'set-freeze-selection';\n/** @hidden */\nexport var setInfiniteFrozenHeight = 'set-infinite-frozen-height';\n/** @hidden */\nexport var setInfiniteColFrozenHeight = 'set-infinite-col-frozen-height';\n/** @hidden */\nexport var beforeRefreshOnDataChange = 'before-refresh-on-data-change';\n/** @hidden */\nexport var immutableBatchCancel = 'immutable-batch-cancel';\n/** @hidden */\nexport var refreshVirtualFrozenRows = 'refresh-virtual-frozenrows';\n/** @hidden */\nexport var checkScrollReset = 'check-scroll-reset';\n/** @hidden */\nexport var refreshFrozenHeight = 'refresh-frozen-height';\n/** @hidden */\nexport var setHeightToFrozenElement = 'set-height-to-frozen-element';\n/** @hidden */\nexport var preventFrozenScrollRefresh = 'prevent-frozen-scroll-refresh';\n/** @hidden */\nexport var nextCellIndex = 'next-cell-index';\n/** @hidden */\nexport var refreshInfiniteCurrentViewData = 'refresh-infinite-current-view-data';\n/** @hidden */\nexport var infiniteCrudCancel = 'infinite-crud-cancel';\n/** @hidden */\nexport var filterDialogClose = 'filter-dialog-close';\n/** @hidden */\nexport var refreshCustomFilterOkBtn = 'refresh-cutsom-filter-ok-button';\n/** @hidden */\nexport var refreshCustomFilterClearBtn = 'refresh-cutsom-filter-clear-button';\n/** @hidden */\nexport var renderResponsiveCmenu = 'render-responsive-cmenu';\n/** @hidden */\nexport var filterCmenuSelect = 'filter-cmenu-select';\n/** @hidden */\nexport var customFilterClose = 'custom-filter-close';\n/** @hidden */\nexport var setFullScreenDialog = 'set-fullscreen-dialog';\n/** @hidden */\nexport var refreshExpandandCollapse = 'refresh-Expand-and-Collapse';\n/** @hidden */\nexport var rowModeChange = 'row-mode-change';\n/** @hidden */\nexport var enterKeyHandler = 'enter-key-handler';\n/** @hidden */\nexport var refreshVirtualMaxPage = 'refresh-virtual-max-page';\n/** @hidden */\nexport var setVirtualPageQuery = 'set-virtual-page-query';\n/** @hidden */\nexport var selectRowOnContextOpen = 'select-row-on-context-open';\n/** @hidden */\nexport var pagerRefresh = 'pager-refresh';\n/** @hidden */\nexport var closeInline = 'closeinline';\n/** @hidden */\nexport var closeBatch = 'closebatch';\n/** @hidden */\nexport var closeEdit = 'close-edit';\n/** @hidden */\nexport var resetVirtualFocus = 'reset-virtual-focus';\n/** @hidden */\nexport var afterContentRender = 'after-content-renderer';\n/** @hidden */\nexport var refreshVirtualEditFormCells = 'refresh-virtual-editform-cells';\n/** @hidden */\nexport var scrollToEdit = 'scroll-to-edit';\n/** @hidden */\nexport var beforeCheckboxRendererQuery = 'before-checkbox-renderer-query';\n/** @hidden */\nexport var createVirtualValidationForm = 'create-virtual-validation-form';\n/** @hidden */\nexport var validateVirtualForm = 'validate-virtual-form';\n/** @hidden */\nexport var destroyChildGrid = 'destroy-child-grid';\n/** @hidden */\nexport var stickyScrollComplete = 'sticky-scroll-complete';\n/** @hidden */\nexport var captionActionComplete = 'infinite-group-collapse';\n/** @hidden */\nexport var refreshInfinitePersistSelection = 'refresh-infinite-persist-selection';\n/** @hidden */\nexport var refreshInfiniteEditrowindex = 'refresh-infinite-editrowindex';\n/** @hidden */\nexport var afterFilterColumnMenuClose = 'after-filter-column-menu-close';\n/** @hidden */\nexport var beforeCheckboxfilterRenderer = 'beforeCheckboxfilterRenderer';\n/** @hidden */\nexport var commandColumnDestroy = 'commandColumnDestroy';\n/** @hidden */\nexport var batchCnfrmDlgCancel = 'cancelcnfrmDlg';\n/** @hidden */\nexport var refreshVirtualLazyLoadCache = 'refresh-Virtual-LazyLoad-Cache';\n/** @hidden */\nexport var refreshFrozenPosition = 'refresh-Frozen-Position';\n/** @hidden */\nexport var refreshResizePosition = 'refresh-Resize-Position';\n/** @hidden */\nexport var refreshSplitFrozenColumn = 'refresh-Split-Frozen-Column';\n/** @hidden */\nexport var renderResponsiveChangeAction = 'render-Responsive-Change-Action';\n/** @hidden */\nexport var renderResponsiveColumnChooserDiv = 'render-Responsive-Column-Chooser-Div';\n/** @hidden */\nexport var showAddNewRowFocus = 'show-Add-New-Row-Focus';\n/** @hidden */\nexport var infiniteScrollComplete = 'infinitescroll-complete';\n","/**\n * Defines types of Cell\n *\n * @hidden\n */\nexport var CellType;\n(function (CellType) {\n /** Defines CellType as Data */\n CellType[CellType[\"Data\"] = 0] = \"Data\";\n /** Defines CellType as Header */\n CellType[CellType[\"Header\"] = 1] = \"Header\";\n /** Defines CellType as Summary */\n CellType[CellType[\"Summary\"] = 2] = \"Summary\";\n /** Defines CellType as GroupSummary */\n CellType[CellType[\"GroupSummary\"] = 3] = \"GroupSummary\";\n /** Defines CellType as CaptionSummary */\n CellType[CellType[\"CaptionSummary\"] = 4] = \"CaptionSummary\";\n /** Defines CellType as Filter */\n CellType[CellType[\"Filter\"] = 5] = \"Filter\";\n /** Defines CellType as Indent */\n CellType[CellType[\"Indent\"] = 6] = \"Indent\";\n /** Defines CellType as GroupCaption */\n CellType[CellType[\"GroupCaption\"] = 7] = \"GroupCaption\";\n /** Defines CellType as GroupCaptionEmpty */\n CellType[CellType[\"GroupCaptionEmpty\"] = 8] = \"GroupCaptionEmpty\";\n /** Defines CellType as Expand */\n CellType[CellType[\"Expand\"] = 9] = \"Expand\";\n /** Defines CellType as HeaderIndent */\n CellType[CellType[\"HeaderIndent\"] = 10] = \"HeaderIndent\";\n /** Defines CellType as StackedHeader */\n CellType[CellType[\"StackedHeader\"] = 11] = \"StackedHeader\";\n /** Defines CellType as DetailHeader */\n CellType[CellType[\"DetailHeader\"] = 12] = \"DetailHeader\";\n /** Defines CellType as DetailExpand */\n CellType[CellType[\"DetailExpand\"] = 13] = \"DetailExpand\";\n /** Defines CellType as CommandColumn */\n CellType[CellType[\"CommandColumn\"] = 14] = \"CommandColumn\";\n /** Defines CellType as DetailFooterIntent */\n CellType[CellType[\"DetailFooterIntent\"] = 15] = \"DetailFooterIntent\";\n /** Defines CellType as RowDrag */\n CellType[CellType[\"RowDragIcon\"] = 16] = \"RowDragIcon\";\n /** Defines CellType as RowDragHeader */\n CellType[CellType[\"RowDragHIcon\"] = 17] = \"RowDragHIcon\";\n})(CellType || (CellType = {}));\n/**\n * Defines types of Render\n *\n * @hidden\n */\nexport var RenderType;\n(function (RenderType) {\n /** Defines RenderType as Header */\n RenderType[RenderType[\"Header\"] = 0] = \"Header\";\n /** Defines RenderType as Content */\n RenderType[RenderType[\"Content\"] = 1] = \"Content\";\n /** Defines RenderType as Summary */\n RenderType[RenderType[\"Summary\"] = 2] = \"Summary\";\n})(RenderType || (RenderType = {}));\n/**\n * Defines Predefined toolbar items.\n *\n * @hidden\n */\nexport var ToolbarItem;\n(function (ToolbarItem) {\n ToolbarItem[ToolbarItem[\"Add\"] = 0] = \"Add\";\n ToolbarItem[ToolbarItem[\"Edit\"] = 1] = \"Edit\";\n ToolbarItem[ToolbarItem[\"Update\"] = 2] = \"Update\";\n ToolbarItem[ToolbarItem[\"Delete\"] = 3] = \"Delete\";\n ToolbarItem[ToolbarItem[\"Cancel\"] = 4] = \"Cancel\";\n ToolbarItem[ToolbarItem[\"Print\"] = 5] = \"Print\";\n ToolbarItem[ToolbarItem[\"Search\"] = 6] = \"Search\";\n ToolbarItem[ToolbarItem[\"ColumnChooser\"] = 7] = \"ColumnChooser\";\n ToolbarItem[ToolbarItem[\"PdfExport\"] = 8] = \"PdfExport\";\n ToolbarItem[ToolbarItem[\"ExcelExport\"] = 9] = \"ExcelExport\";\n ToolbarItem[ToolbarItem[\"CsvExport\"] = 10] = \"CsvExport\";\n ToolbarItem[ToolbarItem[\"WordExport\"] = 11] = \"WordExport\";\n})(ToolbarItem || (ToolbarItem = {}));\n/**\n * Defines types of responsive dialogs\n *\n * @hidden\n */\nexport var ResponsiveDialogAction;\n(function (ResponsiveDialogAction) {\n /** Defines dialog type as Edit */\n ResponsiveDialogAction[ResponsiveDialogAction[\"isEdit\"] = 0] = \"isEdit\";\n /** Defines dialog type as Add */\n ResponsiveDialogAction[ResponsiveDialogAction[\"isAdd\"] = 1] = \"isAdd\";\n /** Defines dialog type as Sort */\n ResponsiveDialogAction[ResponsiveDialogAction[\"isSort\"] = 2] = \"isSort\";\n /** Defines dialog type as Filter */\n ResponsiveDialogAction[ResponsiveDialogAction[\"isFilter\"] = 3] = \"isFilter\";\n /** Defines dialog type as ColMenu */\n ResponsiveDialogAction[ResponsiveDialogAction[\"isColMenu\"] = 4] = \"isColMenu\";\n /** Defines dialog type as ColumChooser */\n ResponsiveDialogAction[ResponsiveDialogAction[\"isColumnChooser\"] = 5] = \"isColumnChooser\";\n})(ResponsiveDialogAction || (ResponsiveDialogAction = {}));\n/**\n * Defines responsive toolbar actions\n *\n * @hidden\n */\nexport var ResponsiveToolbarAction;\n(function (ResponsiveToolbarAction) {\n /** Defines initial responsive toolbar buttons */\n ResponsiveToolbarAction[ResponsiveToolbarAction[\"isInitial\"] = 0] = \"isInitial\";\n /** Defines responsive toolbar search */\n ResponsiveToolbarAction[ResponsiveToolbarAction[\"isSearch\"] = 1] = \"isSearch\";\n})(ResponsiveToolbarAction || (ResponsiveToolbarAction = {}));\n","import { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { Query, DataManager, Predicate, Deferred, UrlAdaptor, RemoteSaveAdaptor } from '@syncfusion/ej2-data';\nimport { setFormatter, isGroupAdaptive, getColumnByForeignKeyValue, refreshFilteredColsUid } from '../base/util';\nimport * as events from '../base/constant';\nimport { ValueFormatter } from '../services/value-formatter';\nimport { CheckBoxFilterBase } from '../common/checkbox-filter-base';\n/**\n * Grid data module is used to generate query and data source.\n *\n * @hidden\n */\nvar Data = /** @class */ (function () {\n /**\n * Constructor for data module.\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {ServiceLocator} serviceLocator - specifies the service locator\n * @hidden\n */\n function Data(parent, serviceLocator) {\n this.dataState = { isPending: false, resolver: null, group: [] };\n this.foreignKeyDataState = { isPending: false, resolver: null };\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n this.initDataManager();\n if (this.parent.isDestroyed || this.getModuleName() === 'foreignKey') {\n return;\n }\n this.parent.on(events.rowsAdded, this.addRows, this);\n this.parent.on(events.rowPositionChanged, this.reorderRows, this);\n this.parent.on(events.rowsRemoved, this.removeRows, this);\n this.parent.on(events.dataSourceModified, this.initDataManager, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.parent.on(events.updateData, this.crudActions, this);\n this.parent.on(events.addDeleteAction, this.getData, this);\n this.parent.on(events.autoCol, this.refreshFilteredCols, this);\n this.parent.on(events.columnsPrepared, this.refreshFilteredCols, this);\n }\n Data.prototype.reorderRows = function (e) {\n this.dataManager.dataSource.json.splice(e.toIndex, 0, this.dataManager.dataSource.json.splice(e.fromIndex, 1)[0]);\n };\n Data.prototype.getModuleName = function () {\n return 'data';\n };\n /**\n * The function used to initialize dataManager and external query\n *\n * @returns {void}\n */\n Data.prototype.initDataManager = function () {\n var gObj = this.parent;\n this.dataManager = gObj.dataSource instanceof DataManager ? gObj.dataSource :\n (isNullOrUndefined(gObj.dataSource) ? new DataManager() : new DataManager(gObj.dataSource));\n if (gObj.isAngular && !(gObj.query instanceof Query)) {\n gObj.setProperties({ query: new Query() }, true);\n }\n else {\n this.isQueryInvokedFromData = true;\n if (!(gObj.query instanceof Query)) {\n gObj.query = new Query();\n }\n }\n };\n /**\n * The function is used to generate updated Query from Grid model.\n *\n * @param {boolean} skipPage - specifies the boolean to skip the page\n * @param {boolean} isAutoCompleteCall - specifies for auto complete call\n * @returns {Query} returns the Query\n * @hidden\n */\n Data.prototype.generateQuery = function (skipPage, isAutoCompleteCall) {\n var gObj = this.parent;\n var query = gObj.getQuery().clone();\n if (this.parent.columnQueryMode === 'ExcludeHidden') {\n query.select(this.parent.getColumns().filter(function (column) { return !(column.isPrimaryKey !== true && column.visible === false || column.field === undefined); }).map(function (column) { return column.field; }));\n }\n else if (this.parent.columnQueryMode === 'Schema') {\n var selectQueryFields = [];\n var columns = this.parent.columns;\n for (var i = 0; i < columns.length; i++) {\n selectQueryFields.push(columns[parseInt(i.toString(), 10)].field);\n }\n query.select(selectQueryFields);\n }\n this.filterQuery(query);\n this.searchQuery(query);\n this.aggregateQuery(query);\n this.sortQuery(query);\n if (isGroupAdaptive(this.parent)) {\n this.virtualGroupPageQuery(query);\n }\n else {\n this.pageQuery(query, skipPage);\n }\n if (isNullOrUndefined(isAutoCompleteCall) || !isAutoCompleteCall) {\n this.groupQuery(query);\n }\n return query;\n };\n /**\n * @param {Query} query - specifies the query\n * @returns {Query} - returns the query\n * @hidden\n */\n Data.prototype.aggregateQuery = function (query) {\n var rows = this.parent.aggregates;\n for (var i = 0; i < rows.length; i++) {\n var row = rows[parseInt(i.toString(), 10)];\n for (var j = 0; j < row.columns.length; j++) {\n var cols = row.columns[parseInt(j.toString(), 10)];\n var types = cols.type instanceof Array ? cols.type : [cols.type];\n for (var k = 0; k < types.length; k++) {\n query.aggregate(types[parseInt(k.toString(), 10)].toLowerCase(), cols.field);\n }\n }\n }\n return query;\n };\n Data.prototype.virtualGroupPageQuery = function (query) {\n var fName = 'fn';\n if (query.queries.length) {\n for (var i = 0; i < query.queries.length; i++) {\n if (query.queries[parseInt(i.toString(), 10)][\"\" + fName] === 'onPage') {\n query.queries.splice(i, 1);\n }\n }\n }\n return query;\n };\n Data.prototype.pageQuery = function (query, skipPage) {\n var gObj = this.parent;\n var fName = 'fn';\n var args = { query: query, skipPage: false };\n gObj.notify(events.setVirtualPageQuery, args);\n if (args.skipPage) {\n return query;\n }\n if ((gObj.allowPaging || gObj.enableVirtualization || gObj.enableInfiniteScrolling) && skipPage !== true) {\n gObj.pageSettings.currentPage = Math.max(1, gObj.pageSettings.currentPage);\n if (gObj.pageSettings.pageCount <= 0) {\n gObj.pageSettings.pageCount = 8;\n }\n if (gObj.pageSettings.pageSize <= 0) {\n gObj.pageSettings.pageSize = 12;\n }\n if (query.queries.length) {\n for (var i = 0; i < query.queries.length; i++) {\n if (query.queries[parseInt(i.toString(), 10)][\"\" + fName] === 'onPage') {\n query.queries.splice(i, 1);\n }\n }\n }\n if (!isNullOrUndefined(gObj.infiniteScrollModule) && gObj.enableInfiniteScrolling) {\n this.parent.notify(events.infinitePageQuery, query);\n }\n else {\n query.page(gObj.pageSettings.currentPage, gObj.allowPaging && gObj.pagerModule &&\n (gObj.pagerModule.pagerObj.isAllPage && !gObj.isManualRefresh) &&\n (!this.dataManager.dataSource.offline && !(this.dataManager.adaptor instanceof RemoteSaveAdaptor)) ?\n null : gObj.pageSettings.pageSize);\n }\n }\n return query;\n };\n Data.prototype.groupQuery = function (query) {\n var gObj = this.parent;\n if (gObj.allowGrouping && gObj.groupSettings.columns.length) {\n if (this.parent.groupSettings.enableLazyLoading) {\n query.lazyLoad.push({ key: 'isLazyLoad', value: this.parent.groupSettings.enableLazyLoading });\n }\n var columns = gObj.groupSettings.columns;\n for (var i = 0, len = columns.length; i < len; i++) {\n var column = this.getColumnByField(columns[parseInt(i.toString(), 10)]);\n if (!column) {\n this.parent.log('initial_action', { moduleName: 'group', columnName: columns[parseInt(i.toString(), 10)] });\n }\n var isGrpFmt = column.enableGroupByFormat;\n var format = column.format;\n if (isGrpFmt) {\n query.group(columns[parseInt(i.toString(), 10)], this.formatGroupColumn.bind(this), format);\n }\n else {\n query.group(columns[parseInt(i.toString(), 10)], null);\n }\n }\n }\n return query;\n };\n Data.prototype.sortQuery = function (query) {\n var gObj = this.parent;\n if ((gObj.allowSorting || gObj.allowGrouping) && gObj.sortSettings.columns.length) {\n var columns = gObj.sortSettings.columns;\n var sortGrp = [];\n for (var i = columns.length - 1; i > -1; i--) {\n var col = this.getColumnByField(columns[parseInt(i.toString(), 10)].field);\n if (col) {\n col.setSortDirection(columns[parseInt(i.toString(), 10)].direction);\n }\n else {\n this.parent.log('initial_action', { moduleName: 'sort', columnName: columns[parseInt(i.toString(), 10)].field });\n return query;\n }\n var fn = columns[parseInt(i.toString(), 10)].direction;\n if (col.sortComparer) {\n this.parent.log('grid_sort_comparer');\n fn = !this.isRemote() ? col.sortComparer.bind(col) : columns[parseInt(i.toString(), 10)].direction;\n }\n if (gObj.groupSettings.columns.indexOf(columns[parseInt(i.toString(), 10)].field) === -1) {\n if (col.isForeignColumn() || col.sortComparer) {\n query.sortByForeignKey(col.field, fn, undefined, columns[parseInt(i.toString(), 10)].direction.toLowerCase());\n }\n else {\n query.sortBy(col.field, fn);\n }\n }\n else {\n sortGrp.push({ direction: fn, field: col.field });\n }\n }\n for (var i = 0, len = sortGrp.length; i < len; i++) {\n if (typeof sortGrp[parseInt(i.toString(), 10)].direction === 'string') {\n query.sortBy(sortGrp[parseInt(i.toString(), 10)].field, sortGrp[parseInt(i.toString(), 10)].direction);\n }\n else {\n var col = this.getColumnByField(sortGrp[parseInt(i.toString(), 10)].field);\n query.sortByForeignKey(sortGrp[parseInt(i.toString(), 10)].field, sortGrp[parseInt(i.toString(), 10)].direction, undefined, col.getSortDirection().toLowerCase());\n }\n }\n }\n return query;\n };\n /**\n * @param {Query} query - specifies the query\n * @param {Column} fcolumn - specifies the forein key column model\n * @param {boolean} isForeignKey - Confirms whether the column is a foreign key or not\n * @returns {Query} - returns the query\n * @hidden\n */\n Data.prototype.searchQuery = function (query, fcolumn, isForeignKey) {\n var sSettings = this.parent.searchSettings;\n var fields = sSettings.fields.length ? sSettings.fields : this.getSearchColumnFieldNames();\n var predicateList = [];\n var needForeignKeySearch = false;\n if (this.parent.searchSettings.key.length) {\n needForeignKeySearch = this.parent.getForeignKeyColumns().some(function (col) { return fields.indexOf(col.field) > -1; });\n var adaptor = !isForeignKey ? this.dataManager.adaptor : fcolumn.dataSource.adaptor;\n if (needForeignKeySearch || (adaptor.getModuleName &&\n adaptor.getModuleName() === 'ODataV4Adaptor')) {\n fields = isForeignKey ? [fcolumn.foreignKeyValue] : fields;\n for (var i = 0; i < fields.length; i++) {\n var column = isForeignKey ? fcolumn : this.getColumnByField(fields[parseInt(i.toString(), 10)]);\n if (column.isForeignColumn() && !isForeignKey) {\n predicateList = this.fGeneratePredicate(column, predicateList);\n }\n else {\n predicateList.push(new Predicate(fields[parseInt(i.toString(), 10)], sSettings.operator, sSettings.key, sSettings.ignoreCase, sSettings.ignoreAccent));\n }\n }\n var predList = Predicate.or(predicateList);\n predList.key = sSettings.key;\n query.where(predList);\n }\n else {\n query.search(sSettings.key, fields, sSettings.operator, sSettings.ignoreCase, sSettings.ignoreAccent);\n }\n }\n return query;\n };\n Data.prototype.filterQuery = function (query, column, skipFoerign) {\n var gObj = this.parent;\n var predicateList = [];\n var actualFilter = [];\n var foreignColumn = this.parent.getForeignKeyColumns();\n var foreignColEmpty;\n if (gObj.allowFiltering && gObj.filterSettings.columns.length) {\n var columns = column ? column : gObj.filterSettings.columns;\n var colType = {};\n for (var _i = 0, _a = gObj.getColumns(); _i < _a.length; _i++) {\n var col = _a[_i];\n colType[col.field] = col.filter.type ? col.filter.type : gObj.filterSettings.type;\n }\n var foreignCols = [];\n var defaultFltrCols = [];\n for (var _b = 0, columns_1 = columns; _b < columns_1.length; _b++) {\n var col = columns_1[_b];\n var gridColumn = col.isForeignKey ? gObj.getColumnByUid(col.uid) : gObj.getColumnByField(col.field);\n if (isNullOrUndefined(col.type) && gridColumn && (gridColumn.type === 'date' || gridColumn.type === 'datetime' || gridColumn.type === 'dateonly')) {\n col.type = col.isForeignKey ? gObj.getColumnByUid(col.uid).type : gObj.getColumnByField(col.field).type;\n }\n if (col.isForeignKey) {\n foreignCols.push(col);\n }\n else {\n defaultFltrCols.push(col);\n }\n }\n if (defaultFltrCols.length) {\n for (var i = 0, len = defaultFltrCols.length; i < len; i++) {\n defaultFltrCols[parseInt(i.toString(), 10)].uid = defaultFltrCols[parseInt(i.toString(), 10)].uid ||\n this.parent.grabColumnByFieldFromAllCols(defaultFltrCols[parseInt(i.toString(), 10)]\n .field, defaultFltrCols[parseInt(i.toString(), 10)].isForeignKey).uid;\n }\n var excelPredicate = CheckBoxFilterBase.getPredicate(defaultFltrCols);\n for (var _c = 0, _d = Object.keys(excelPredicate); _c < _d.length; _c++) {\n var prop = _d[_c];\n predicateList.push(excelPredicate[\"\" + prop]);\n }\n }\n if (foreignCols.length) {\n for (var _e = 0, foreignCols_1 = foreignCols; _e < foreignCols_1.length; _e++) {\n var col = foreignCols_1[_e];\n col.uid = col.uid || this.parent.grabColumnByFieldFromAllCols(col.field, col.isForeignKey).uid;\n var column_1 = this.parent.grabColumnByUidFromAllCols(col.uid);\n if (!column_1) {\n this.parent.log('initial_action', { moduleName: 'filter', columnName: col.field });\n }\n if (column_1.isForeignColumn() && getColumnByForeignKeyValue(col.field, foreignColumn) && !skipFoerign) {\n actualFilter.push(col);\n if (!column_1.columnData.length) {\n foreignColEmpty = true;\n }\n predicateList = this.fGeneratePredicate(column_1, predicateList);\n }\n else {\n var excelPredicate = CheckBoxFilterBase.getPredicate(columns);\n for (var _f = 0, _g = Object.keys(excelPredicate); _f < _g.length; _f++) {\n var prop = _g[_f];\n predicateList.push(excelPredicate[\"\" + prop]);\n }\n }\n }\n }\n if (predicateList.length && !foreignColEmpty) {\n query.where(Predicate.and(predicateList));\n }\n else {\n this.parent.notify(events.showEmptyGrid, {});\n }\n }\n return query;\n };\n Data.prototype.fGeneratePredicate = function (col, predicateList) {\n var fPredicate = {};\n if (col) {\n this.parent.notify(events.generateQuery, { predicate: fPredicate, column: col });\n if (fPredicate.predicate.predicates.length) {\n predicateList.push(fPredicate.predicate);\n }\n }\n return predicateList;\n };\n /**\n * The function is used to get dataManager promise by executing given Query.\n *\n * @param {object} args - specifies the object\n * @param {string} args.requestType - Defines the request type\n * @param {string[]} args.foreignKeyData - Defines the foreignKeyData.string\n * @param {Object} args.data - Defines the data.\n * @param {number} args.index - Defines the index .\n * @param {Query} query - Defines the query which will execute along with data processing.\n * @returns {Promise} - returns the object\n * @hidden\n */\n Data.prototype.getData = function (args, query) {\n var _this = this;\n if (args === void 0) { args = { requestType: '' }; }\n var key = this.getKey(args.foreignKeyData &&\n Object.keys(args.foreignKeyData).length ?\n args.foreignKeyData : this.parent.getPrimaryKeyFieldNames());\n this.parent.log('datasource_syntax_mismatch', { dataState: this.parent });\n if (this.parent.dataSource && 'result' in this.parent.dataSource) {\n var def = this.eventPromise(args, query, key);\n return def.promise;\n }\n else {\n var crud = void 0;\n switch (args.requestType) {\n case 'delete':\n query = query ? query : this.generateQuery();\n // eslint-disable-next-line no-case-declarations\n var len = Object.keys(args.data).length;\n if (len === 1) {\n crud = this.dataManager.remove(key, args.data[0], query.fromTable, query);\n }\n else {\n var changes = {\n addedRecords: [],\n deletedRecords: [],\n changedRecords: []\n };\n changes.deletedRecords = args.data;\n crud = this.dataManager.saveChanges(changes, key, query.fromTable, query.requiresCount());\n }\n break;\n case 'save':\n query = query ? query : this.generateQuery();\n args.index = isNullOrUndefined(args.index) ? 0 : args.index;\n crud = this.dataManager.insert(args.data, query.fromTable, query, args.index);\n break;\n }\n var promise = 'promise';\n args[\"\" + promise] = crud;\n // eslint-disable-next-line no-prototype-builtins\n if (crud && !Array.isArray(crud) && !crud.hasOwnProperty('deletedRecords')) {\n return crud.then(function () {\n return _this.insert(query, args);\n });\n }\n else {\n return this.insert(query, args);\n }\n }\n };\n Data.prototype.insert = function (query, args) {\n if (args.requestType === 'save') {\n this.parent.notify(events.recordAdded, args);\n }\n return this.executeQuery(query);\n };\n Data.prototype.executeQuery = function (query) {\n var _this = this;\n if (this.dataManager.ready) {\n var deferred_1 = new Deferred();\n var ready = this.dataManager.ready;\n ready.then(function () {\n _this.dataManager.executeQuery(query).then(function (result) {\n deferred_1.resolve(result);\n });\n }).catch(function (e) {\n deferred_1.reject(e);\n });\n return deferred_1.promise;\n }\n else {\n return this.dataManager.executeQuery(query);\n }\n };\n Data.prototype.formatGroupColumn = function (value, field) {\n var serviceLocator = this.serviceLocator;\n var column = this.getColumnByField(field);\n var date = value;\n if (!column.type) {\n column.type = date.getDay ? (date.getHours() > 0 || date.getMinutes() > 0 ||\n date.getSeconds() > 0 || date.getMilliseconds() > 0 ? 'datetime' : 'date') : typeof (value);\n }\n if (isNullOrUndefined(column.getFormatter())) {\n setFormatter(serviceLocator, column);\n }\n var formatVal = ValueFormatter.prototype.toView(value, column.getFormatter());\n return formatVal;\n };\n Data.prototype.crudActions = function (args) {\n var query = this.generateQuery();\n var promise = null;\n var pr = 'promise';\n var key = this.getKey(args.foreignKeyData &&\n Object.keys(args.foreignKeyData).length ? args.foreignKeyData :\n this.parent.getPrimaryKeyFieldNames());\n if (this.parent.dataSource && 'result' in this.parent.dataSource) {\n this.eventPromise(args, query, key);\n }\n switch (args.requestType) {\n case 'save':\n promise = this.dataManager.update(key, args.data, query.fromTable, query, args.previousData);\n break;\n }\n args[\"\" + pr] = promise ? promise : args[\"\" + pr];\n this.parent.notify(events.crudAction, args);\n };\n /**\n * @param {object} changes - specifies the changes\n * @param {string} key - specifies the key\n * @param {object} original - specifies the original data\n * @param {Query} query - specifies the query\n * @returns {Promise} returns the object\n * @hidden\n */\n Data.prototype.saveChanges = function (changes, key, original, query) {\n if (query === void 0) { query = this.generateQuery(); }\n query.requiresCount();\n if ('result' in this.parent.dataSource) {\n var deff = new Deferred();\n var args = {\n requestType: 'batchsave', changes: changes, key: key, query: query,\n endEdit: deff.resolve\n };\n this.setState({ isPending: true, resolver: deff.resolve });\n this.parent.trigger(events.dataSourceChanged, args);\n return deff.promise;\n }\n else {\n var promise = this.dataManager.saveChanges(changes, key, query.fromTable, query, original);\n return promise;\n }\n };\n Data.prototype.getKey = function (keys) {\n if (keys && keys.length) {\n return keys[0];\n }\n return undefined;\n };\n /**\n * @returns {boolean} returns whether its remote data\n * @hidden\n */\n Data.prototype.isRemote = function () {\n return this.dataManager.dataSource.offline !== true && this.dataManager.dataSource.url !== undefined &&\n this.dataManager.dataSource.url !== '';\n };\n Data.prototype.addRows = function (e) {\n for (var i = e.records.length; i > 0; i--) {\n if (this.parent.dataSource instanceof DataManager && this.dataManager.dataSource.offline) {\n this.dataManager.dataSource.json.splice(e.toIndex, 0, e.records[i - 1]);\n }\n else if (((!this.parent.getDataModule().isRemote()) && (!isNullOrUndefined(this.parent.dataSource))) &&\n (!this.parent.dataSource.result)) {\n this.parent.dataSource['splice'](e.toIndex, 0, e.records[i - 1]);\n }\n }\n };\n Data.prototype.removeRows = function (e) {\n var json = this.dataManager.dataSource.json;\n if (this.parent.dataSource instanceof DataManager && this.dataManager.dataSource.offline) {\n this.dataManager.dataSource.json = json.filter(function (value) { return e.records.indexOf(value) === -1; });\n }\n else if (((!this.parent.getDataModule().isRemote()) && (!isNullOrUndefined(this.parent.dataSource))) &&\n (!this.parent.dataSource.result)) {\n this.parent.dataSource = json.filter(function (value) { return e.records.indexOf(value) === -1; });\n }\n };\n Data.prototype.getColumnByField = function (field) {\n var col;\n return (this.parent.columnModel).some(function (column) {\n col = column;\n return column.field === field;\n }) && col;\n };\n Data.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.rowsAdded, this.addRows);\n this.parent.off(events.rowsRemoved, this.removeRows);\n this.parent.off(events.dataSourceModified, this.initDataManager);\n this.parent.off(events.destroy, this.destroy);\n this.parent.off(events.updateData, this.crudActions);\n this.parent.off(events.addDeleteAction, this.getData);\n this.parent.off(events.autoCol, this.refreshFilteredCols);\n this.parent.off(events.columnsPrepared, this.refreshFilteredCols);\n };\n Data.prototype.getState = function () {\n return this.dataState;\n };\n Data.prototype.setState = function (state) {\n return this.dataState = state;\n };\n Data.prototype.getForeignKeyDataState = function () {\n return this.foreignKeyDataState;\n };\n Data.prototype.setForeignKeyDataState = function (state) {\n this.foreignKeyDataState = state;\n };\n Data.prototype.getStateEventArgument = function (query) {\n var adaptr = new UrlAdaptor();\n var dm = new DataManager({ url: '', adaptor: new UrlAdaptor });\n var state = adaptr.processQuery(dm, query);\n var data = JSON.parse(state.data);\n return extend(data, state.pvtData);\n };\n Data.prototype.eventPromise = function (args, query, key) {\n var _this = this;\n var dataArgs = args;\n var state = this.getStateEventArgument(query);\n var def = new Deferred();\n var deff = new Deferred();\n if ((args.requestType !== undefined || (this.parent.groupSettings.disablePageWiseAggregates && query.queries.some(function (query) { return query.fn === 'onGroup'; })))\n && this.dataState.isDataChanged !== false) {\n state.action = args;\n if (args.requestType === 'save' || args.requestType === 'delete') {\n var editArgs_1 = args;\n editArgs_1.key = key;\n var promise = 'promise';\n editArgs_1[\"\" + promise] = deff.promise;\n editArgs_1.state = state;\n this.setState({ isPending: true, resolver: deff.resolve });\n dataArgs.endEdit = deff.resolve;\n dataArgs.cancelEdit = deff.reject;\n this.parent.trigger(events.dataSourceChanged, editArgs_1);\n deff.promise.then(function () {\n _this.setState({ isPending: true, resolver: def.resolve, group: state.group, aggregates: state.aggregates });\n if (editArgs_1.requestType === 'save') {\n _this.parent.notify(events.recordAdded, editArgs_1);\n }\n _this.parent.trigger(events.dataStateChange, state);\n })\n .catch(function () { return void 0; });\n }\n else {\n this.setState({ isPending: true, resolver: def.resolve, group: state.group, aggregates: state.aggregates });\n this.parent.trigger(events.dataStateChange, state);\n }\n }\n else {\n this.setState({});\n def.resolve(this.parent.dataSource);\n }\n return def;\n };\n /**\n * Gets the columns where searching needs to be performed from the Grid.\n *\n * @returns {string[]} returns the searched column field names\n */\n Data.prototype.getSearchColumnFieldNames = function () {\n var colFieldNames = [];\n var columns = this.parent.getColumns();\n for (var _i = 0, columns_2 = columns; _i < columns_2.length; _i++) {\n var col = columns_2[_i];\n if (col.allowSearching && !isNullOrUndefined(col.field)) {\n colFieldNames.push(col.field);\n }\n }\n return colFieldNames;\n };\n Data.prototype.refreshFilteredCols = function () {\n if (this.parent.allowFiltering && this.parent.filterSettings.columns.length) {\n refreshFilteredColsUid(this.parent, this.parent.filterSettings.columns);\n }\n };\n return Data;\n}());\nexport { Data };\n","import { merge } from '@syncfusion/ej2-base';\n/**\n * Row\n *\n * @hidden\n */\nvar Row = /** @class */ (function () {\n function Row(options, parent) {\n merge(this, options);\n this.parent = parent;\n }\n Row.prototype.clone = function () {\n var row = new Row({});\n merge(row, this);\n row.cells = this.cells.map(function (cell) { return cell.clone(); });\n return row;\n };\n /**\n * Replaces the row data and grid refresh the particular row element only.\n *\n * @param {Object} data - To update new data for the particular row.\n * @returns {void}\n */\n Row.prototype.setRowValue = function (data) {\n if (!this.parent) {\n return;\n }\n var key = this.data[this.parent.getPrimaryKeyFieldNames()[0]];\n this.parent.setRowData(key, data);\n };\n /**\n * Replaces the given field value and refresh the particular cell element only.\n *\n * @param {string} field - Specifies the field name which you want to update.\n * @param {string | number | boolean | Date} value - To update new value for the particular cell.\n * @returns {void}\n */\n Row.prototype.setCellValue = function (field, value) {\n if (!this.parent) {\n return;\n }\n var isValDiff = !(this.data[\"\" + field].toString() === value.toString());\n if (isValDiff) {\n var pKeyField = this.parent.getPrimaryKeyFieldNames()[0];\n var key = this.data[\"\" + pKeyField];\n this.parent.setCellValue(key, field, value);\n this.makechanges(pKeyField, this.data);\n }\n else {\n return;\n }\n };\n Row.prototype.makechanges = function (key, data) {\n if (!this.parent) {\n return;\n }\n var gObj = this.parent;\n var dataManager = gObj.getDataModule().dataManager;\n dataManager.update(key, data);\n };\n return Row;\n}());\nexport { Row };\n","import { merge } from '@syncfusion/ej2-base';\n/**\n * Cell\n *\n * @hidden\n */\nvar Cell = /** @class */ (function () {\n function Cell(options) {\n this.isSpanned = false;\n this.isRowSpanned = false;\n merge(this, options);\n }\n Cell.prototype.clone = function () {\n var cell = new Cell({});\n merge(cell, this);\n return cell;\n };\n return Cell;\n}());\nexport { Cell };\n","import { isNullOrUndefined, attributes } from '@syncfusion/ej2-base';\nimport { iterateArrayOrObject } from '../base/util';\nimport { CellType } from '../base/enum';\n/**\n * `CellMergeRender` module.\n *\n * @hidden\n */\nvar CellMergeRender = /** @class */ (function () {\n function CellMergeRender(serviceLocator, parent) {\n this.serviceLocator = serviceLocator;\n this.parent = parent;\n }\n CellMergeRender.prototype.render = function (cellArgs, row, i, td) {\n var cellRendererFact = this.serviceLocator.getService('cellRendererFactory');\n var cellRenderer = cellRendererFact.getCellRenderer(row.cells[parseInt(i.toString(), 10)].cellType\n || CellType.Data);\n var colSpan = row.cells[parseInt(i.toString(), 10)].cellSpan ? row.cells[parseInt(i.toString(), 10)].cellSpan :\n (cellArgs.colSpan + i) <= row.cells.length ? cellArgs.colSpan : row.cells.length - i;\n var rowSpan = cellArgs.rowSpan;\n var visible = 0;\n var spannedCell;\n if (row.index > 0) {\n var rowsObject = this.parent.getRowsObject();\n var cells = this.parent.groupSettings.columns.length > 0 &&\n !rowsObject[row.index - 1].isDataRow ? rowsObject[row.index].cells : rowsObject[row.index - 1].cells;\n var targetCell_1 = row.cells[parseInt(i.toString(), 10)];\n var uid_1 = 'uid';\n spannedCell = cells.filter(function (cell) { return cell.column.uid === targetCell_1.column[\"\" + uid_1]; })[0];\n }\n var colSpanLen = spannedCell && spannedCell.colSpanRange > 1 && spannedCell.rowSpanRange > 1 ?\n spannedCell.colSpanRange : colSpan;\n for (var j = i + 1; j < i + colSpanLen && j < row.cells.length; j++) {\n if (row.cells[parseInt(j.toString(), 10)].visible === false) {\n visible++;\n }\n else {\n row.cells[parseInt(j.toString(), 10)].isSpanned = true;\n }\n }\n if (visible > 0) {\n for (var j = i + colSpan; j < i + colSpan + visible && j < row.cells.length; j++) {\n row.cells[parseInt(j.toString(), 10)].isSpanned = true;\n }\n if (i + colSpan + visible >= row.cells.length) {\n colSpan -= (i + colSpan + visible) - row.cells.length;\n }\n }\n if (row.cells[parseInt(i.toString(), 10)].cellSpan) {\n row.data[cellArgs.column.field] = row.cells[parseInt(i.toString(), 10)].spanText;\n td = cellRenderer.render(row.cells[parseInt(i.toString(), 10)], row.data, { 'index': !isNullOrUndefined(row.index) ? row.index.toString() : '' });\n }\n if (colSpan > 1) {\n attributes(td, { 'colSpan': colSpan.toString(), 'aria-colSpan': colSpan.toString() });\n }\n if (rowSpan > 1) {\n attributes(td, { 'rowspan': rowSpan.toString(), 'aria-rowspan': rowSpan.toString() });\n row.cells[parseInt(i.toString(), 10)].isRowSpanned = true;\n row.cells[parseInt(i.toString(), 10)].rowSpanRange = Number(rowSpan);\n if (colSpan > 1) {\n row.cells[parseInt(i.toString(), 10)].colSpanRange = Number(colSpan);\n }\n }\n if (row.index > 0 && (spannedCell.rowSpanRange > 1)) {\n row.cells[parseInt(i.toString(), 10)].isSpanned = true;\n row.cells[parseInt(i.toString(), 10)].rowSpanRange = Number(spannedCell.rowSpanRange - 1);\n row.cells[parseInt(i.toString(), 10)].colSpanRange = spannedCell.rowSpanRange > 0 ? spannedCell.colSpanRange : 1;\n }\n if (this.parent.enableColumnVirtualization && !row.cells[parseInt(i.toString(), 10)].cellSpan &&\n !this.containsKey(cellArgs.column.field, cellArgs.data[cellArgs.column.field])) {\n this.backupMergeCells(cellArgs.column.field, cellArgs.data[cellArgs.column.field], cellArgs.colSpan);\n }\n return td;\n };\n CellMergeRender.prototype.backupMergeCells = function (fName, data, span) {\n this.setMergeCells(this.generteKey(fName, data), span);\n };\n CellMergeRender.prototype.generteKey = function (fname, data) {\n return fname + '__' + data.toString();\n };\n CellMergeRender.prototype.splitKey = function (key) {\n return key.split('__');\n };\n CellMergeRender.prototype.containsKey = function (fname, data) {\n // eslint-disable-next-line no-prototype-builtins\n return this.getMergeCells().hasOwnProperty(this.generteKey(fname, data));\n };\n CellMergeRender.prototype.getMergeCells = function () {\n return this.parent.mergeCells;\n };\n CellMergeRender.prototype.setMergeCells = function (key, span) {\n this.parent.mergeCells[\"\" + key] = span;\n };\n CellMergeRender.prototype.updateVirtualCells = function (rows) {\n var mCells = this.getMergeCells();\n for (var _i = 0, _a = Object.keys(mCells); _i < _a.length; _i++) {\n var key = _a[_i];\n var value = mCells[\"\" + key];\n var merge = this.splitKey(key);\n var columnIndex = this.getIndexFromAllColumns(merge[0]);\n var vColumnIndices = this.parent.getColumnIndexesInView();\n var span = value - (vColumnIndices[0] - columnIndex);\n if (columnIndex < vColumnIndices[0] && span > 1) {\n for (var _b = 0, rows_1 = rows; _b < rows_1.length; _b++) {\n var row = rows_1[_b];\n if (row.data[merge[0]].toString() === merge[1].toString()) {\n row.cells[0].cellSpan = span;\n row.cells[0].spanText = merge[1];\n break;\n }\n }\n }\n }\n return rows;\n };\n CellMergeRender.prototype.getIndexFromAllColumns = function (field) {\n var index = iterateArrayOrObject(this.parent.getVisibleColumns(), function (item, index) {\n if (item.field === field) {\n return index;\n }\n return undefined;\n })[0];\n return index;\n };\n return CellMergeRender;\n}());\nexport { CellMergeRender };\n","/**\n * Specifies class names\n */\n/** @hidden */\nexport var rowCell = 'e-rowcell';\n/** @hidden */\nexport var gridHeader = 'e-gridheader';\n/** @hidden */\nexport var gridContent = 'e-gridcontent';\n/** @hidden */\nexport var gridFooter = 'e-gridfooter';\n/** @hidden */\nexport var headerContent = 'e-headercontent';\n/** @hidden */\nexport var movableContent = 'e-movablecontent';\n/** @hidden */\nexport var movableHeader = 'e-movableheader';\n/** @hidden */\nexport var frozenContent = 'e-frozencontent';\n/** @hidden */\nexport var frozenHeader = 'e-frozenheader';\n/** @hidden */\nexport var content = 'e-content';\n/** @hidden */\nexport var table = 'e-table';\n/** @hidden */\nexport var row = 'e-row';\n/** @hidden */\nexport var gridChkBox = 'e-gridchkbox';\n/** @hidden */\nexport var editedRow = 'e-editedrow';\n/** @hidden */\nexport var addedRow = 'e-addedrow';\n/**\n * Specifies repeated strings\n */\n/** @hidden */\nexport var changedRecords = 'changedRecords';\n/** @hidden */\nexport var addedRecords = 'addedRecords';\n/** @hidden */\nexport var deletedRecords = 'deletedRecords';\n/** @hidden */\nexport var leftRight = 'Left-Right';\n/** @hidden */\nexport var frozenRight = 'frozen-right';\n/** @hidden */\nexport var frozenLeft = 'frozen-left';\n/** @hidden */\nexport var dataColIndex = 'data-colindex';\n/** @hidden */\nexport var ariaColIndex = 'aria-colindex';\n/** @hidden */\nexport var dataRowIndex = 'data-rowindex';\n/** @hidden */\nexport var ariaRowIndex = 'aria-rowindex';\n/** @hidden */\nexport var tbody = 'tbody';\n/** @hidden */\nexport var colGroup = 'colgroup';\n/** @hidden */\nexport var open = 'open';\n/** @hidden */\nexport var change = 'change';\n/** @hidden */\nexport var focus = 'focus';\n/** @hidden */\nexport var create = 'created';\n/** @hidden */\nexport var beforeOpen = 'beforeOpen';\n/** @hidden */\nexport var downArrow = 'downArrow';\n/** @hidden */\nexport var upArrow = 'upArrow';\n/** @hidden */\nexport var pageUp = 'PageUp';\n/** @hidden */\nexport var pageDown = 'PageDown';\n/** @hidden */\nexport var enter = 'enter';\n/** @hidden */\nexport var shiftEnter = 'shiftEnter';\n/** @hidden */\nexport var tab = 'tab';\n/** @hidden */\nexport var shiftTab = 'shiftTab';\n/** @hidden */\nexport var initialFrozenColumnIndex = 'initialFrozenColumnIndex';\n","import { isNullOrUndefined, extend, addClass, removeClass } from '@syncfusion/ej2-base';\nimport { attributes as addAttributes } from '@syncfusion/ej2-base';\nimport { rowDataBound, queryCellInfo } from '../base/constant';\nimport { setStyleAndAttributes, getObject, extendObjWithFn, applyStickyLeftRightPosition, groupCaptionRowLeftRightPos, resetColspanGroupCaption, resetColandRowSpanStickyPosition } from '../base/util';\nimport { CellType } from '../base/enum';\nimport { CellMergeRender } from './cell-merge-renderer';\nimport * as literals from '../base/string-literals';\n/**\n * RowRenderer class which responsible for building row content.\n *\n * @hidden\n */\nvar RowRenderer = /** @class */ (function () {\n function RowRenderer(serviceLocator, cellType, parent) {\n this.isSpan = false;\n this.cellType = cellType;\n this.serviceLocator = serviceLocator;\n this.parent = parent;\n this.element = this.parent.createElement('tr', { attrs: { role: 'row' } });\n }\n /* eslint-disable */\n /**\n * Function to render the row content based on Column[] and data.\n *\n * @param {Row} row - specifies the row\n * @param {Column[]} columns - specifies the columns\n * @param {Object} attributes - specifies the attributes\n * @param {string} rowTemplate - specifies the rowTemplate\n * @param {Element} cloneNode - specifies the cloneNode\n * @returns {Element} returns the element\n */\n /* eslint-enable */\n RowRenderer.prototype.render = function (row, columns, attributes, rowTemplate, cloneNode) {\n return this.refreshRow(row, columns, attributes, rowTemplate, cloneNode);\n };\n /* eslint-disable */\n /**\n * Function to refresh the row content based on Column[] and data.\n *\n * @param {Row} row - specifies the row\n * @param {Column[]} columns - specifies the column\n * @param {boolean} isChanged - specifies isChanged\n * @param {Object} attributes - specifies the attributes\n * @param {string} rowTemplate - specifies the rowTemplate\n * @returns {void}\n */\n /* eslint-enable */\n RowRenderer.prototype.refresh = function (row, columns, isChanged, attributes, rowTemplate) {\n var _this = this;\n if (isChanged) {\n row.data = extendObjWithFn({}, row.changes);\n this.refreshMergeCells(row);\n }\n var node = this.parent.element.querySelector('[data-uid=' + row.uid + ']');\n var tr = this.refreshRow(row, columns, attributes, rowTemplate, null, isChanged);\n var cells = [].slice.call(tr.cells);\n var tempCells = [].slice.call(node.querySelectorAll('.e-templatecell'));\n if (this.parent.isReact && tempCells.length) {\n var _loop_1 = function (col) {\n if (col.template) {\n setTimeout(function () {\n _this.parent.refreshReactColumnTemplateByUid(col.uid, true);\n }, 0);\n return \"break\";\n }\n };\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var col = columns_1[_i];\n var state_1 = _loop_1(col);\n if (state_1 === \"break\")\n break;\n }\n }\n var attr = [].slice.call(tr.attributes);\n attr.map(function (item) {\n node.setAttribute(item['name'], item['value']);\n });\n node.innerHTML = '';\n for (var _a = 0, cells_1 = cells; _a < cells_1.length; _a++) {\n var cell = cells_1[_a];\n node.appendChild(cell);\n }\n };\n // tslint:disable-next-line:max-func-body-length\n RowRenderer.prototype.refreshRow = function (row, columns, attributes, rowTemplate, cloneNode, isEdit) {\n var tr = !isNullOrUndefined(cloneNode) ? cloneNode : this.element.cloneNode();\n var rowArgs = { data: row.data };\n var cellArgs = { data: row.data };\n var chekBoxEnable = this.parent.getColumns().filter(function (col) { return col.type === 'checkbox' && col.field; })[0];\n var value = false;\n var isFrozen = this.parent.isFrozenGrid();\n if (chekBoxEnable) {\n value = getObject(chekBoxEnable.field, rowArgs.data);\n }\n var selIndex = this.parent.getSelectedRowIndexes();\n if (row.isDataRow) {\n row.isSelected = selIndex.indexOf(row.index) > -1 || value;\n }\n if (row.isDataRow && this.parent.isCheckBoxSelection\n && this.parent.checkAllRows === 'Check' && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {\n row.isSelected = true;\n if (selIndex.indexOf(row.index) === -1) {\n selIndex.push(row.index);\n }\n }\n this.buildAttributeFromRow(tr, row);\n addAttributes(tr, extend({}, attributes, {}));\n setStyleAndAttributes(tr, row.attributes);\n var cellRendererFact = this.serviceLocator.getService('cellRendererFactory');\n var _loop_2 = function (i, len) {\n var cell = row.cells[parseInt(i.toString(), 10)];\n cell.isSelected = row.isSelected;\n cell.isColumnSelected = cell.column.isSelected;\n var cellRenderer = cellRendererFact.getCellRenderer(row.cells[parseInt(i.toString(), 10)].cellType\n || CellType.Data);\n var attrs = { 'index': !isNullOrUndefined(row.index) ? row.index.toString() : '' };\n if (row.isExpand && row.cells[parseInt(i.toString(), 10)].cellType === CellType.DetailExpand) {\n attrs['class'] = this_1.parent.isPrinting ? 'e-detailrowcollapse' : 'e-detailrowexpand';\n }\n var td = cellRenderer.render(row.cells[parseInt(i.toString(), 10)], row.data, attrs, row.isExpand, isEdit);\n if (row.cells[parseInt(i.toString(), 10)].cellType !== CellType.Filter) {\n if (row.cells[parseInt(i.toString(), 10)].cellType === CellType.Data\n || row.cells[parseInt(i.toString(), 10)].cellType === CellType.CommandColumn) {\n var isReactChild = this_1.parent.parentDetails && this_1.parent.parentDetails.parentInstObj &&\n this_1.parent.parentDetails.parentInstObj.isReact;\n if (((this_1.parent.isReact && this_1.parent.requireTemplateRef) || (isReactChild &&\n this_1.parent.parentDetails.parentInstObj.requireTemplateRef)) && cell.isTemplate) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var thisRef_1 = this_1;\n thisRef_1.parent.renderTemplates(function () {\n if (typeof (cell.column.template) !== 'string') {\n var ariaAttr = td.getAttribute('aria-label');\n td.setAttribute('aria-label', td.innerText + ariaAttr);\n }\n thisRef_1.parent.trigger(queryCellInfo, extend(cellArgs, {\n cell: td, column: cell.column, colSpan: 1,\n rowSpan: 1, foreignKeyData: row.cells[parseInt(i.toString(), 10)].foreignKeyData,\n requestType: thisRef_1.parent.requestTypeAction\n }));\n });\n }\n else {\n this_1.parent.trigger(queryCellInfo, extend(cellArgs, {\n cell: td, column: cell.column, colSpan: 1,\n rowSpan: 1, foreignKeyData: row.cells[parseInt(i.toString(), 10)].foreignKeyData,\n requestType: this_1.parent.requestTypeAction\n }));\n }\n var isRowSpanned = false;\n if (row.index > 0 && (this_1.isSpan || (this_1.parent.isSpan && isEdit))) {\n var rowsObject = this_1.parent.getRowsObject();\n var prevRowCells = this_1.parent.groupSettings.columns.length > 0 &&\n !rowsObject[row.index - 1].isDataRow ? rowsObject[row.index].cells : rowsObject[row.index - 1].cells;\n var uid_1 = 'uid';\n var prevRowCell = prevRowCells.filter(function (cell) {\n return cell.column.uid === row.cells[parseInt(i.toString(), 10)].column[\"\" + uid_1];\n })[0];\n isRowSpanned = prevRowCell.isRowSpanned ? prevRowCell.isRowSpanned : prevRowCell.rowSpanRange > 1;\n }\n if ((cellArgs.rowSpan > 1 || cellArgs.colSpan > 1)) {\n this_1.resetrowSpanvalue(this_1.parent.frozenRows > row.index ? this_1.parent.frozenRows :\n this_1.parent.currentViewData.length, cellArgs, row.index);\n if (cellArgs.column.visible === false) {\n cellArgs.colSpan = 1;\n }\n else {\n if (isFrozen) {\n var columns_2 = this_1.parent.getColumns();\n var right = this_1.parent.getFrozenRightColumnsCount();\n var left = this_1.parent.getFrozenLeftCount();\n var movableCount = columns_2.length - right;\n var cellIdx = cellArgs.column.index;\n if (left > cellIdx && left < (cellIdx + cellArgs.colSpan)) {\n var colSpan = (cellIdx + cellArgs.colSpan) - left;\n cellArgs.colSpan = cellArgs.colSpan - colSpan;\n }\n else if (movableCount <= cellIdx && columns_2.length < (cellIdx + cellArgs.colSpan)) {\n var colSpan = (cellIdx + cellArgs.colSpan) - columns_2.length;\n cellArgs.colSpan = cellArgs.colSpan - colSpan;\n }\n else if (cellArgs.column.freeze === 'Fixed') {\n var colSpan = 1;\n var index = cellIdx;\n for (var j = index + 1; j < index + cellArgs.colSpan; j++) {\n if (columns_2[parseInt(j.toString(), 10)].freeze === 'Fixed') {\n colSpan++;\n }\n else {\n break;\n }\n }\n cellArgs.colSpan = colSpan;\n }\n else if (movableCount > cellIdx && movableCount < (cellIdx + cellArgs.colSpan)) {\n var colSpan = (cellIdx + cellArgs.colSpan) - movableCount;\n cellArgs.colSpan = cellArgs.colSpan - colSpan;\n }\n }\n }\n }\n if (cellArgs.colSpan > 1 || row.cells[parseInt(i.toString(), 10)].cellSpan > 1 || cellArgs.rowSpan > 1\n || isRowSpanned) {\n this_1.parent.isSpan = true;\n this_1.isSpan = true;\n var cellMerge = new CellMergeRender(this_1.serviceLocator, this_1.parent);\n td = cellMerge.render(cellArgs, row, i, td);\n if (isFrozen) {\n resetColandRowSpanStickyPosition(this_1.parent, cellArgs.column, td, cellArgs.colSpan);\n }\n }\n }\n if (isFrozen && this_1.isSpan) {\n var rowsObject = this_1.parent.getRowsObject();\n var isRtl = this_1.parent.enableRtl;\n if (rowsObject[row.index - 1]) {\n var prevRowCells = rowsObject[row.index - 1].cells;\n var prevRowCell = prevRowCells[i - 1];\n var nextRowCell = prevRowCells[i + 1];\n var direction = prevRowCells[parseInt(i.toString(), 10)].column.freeze;\n if (prevRowCell && (prevRowCell.isRowSpanned || prevRowCell.rowSpanRange > 1) && prevRowCell.visible) {\n if (prevRowCell.column.freeze === 'Fixed' && direction === 'Fixed') {\n td.classList.add(isRtl ? 'e-removefreezerightborder' : 'e-removefreezeleftborder');\n }\n else if (!isRtl && i === 1 && direction === 'Left') {\n td.classList.add('e-addfreezefirstchildborder');\n }\n }\n if (nextRowCell && (nextRowCell.isRowSpanned || nextRowCell.rowSpanRange > 1) && nextRowCell.visible &&\n nextRowCell.column.freeze === 'Fixed' && direction === 'Fixed' && cellArgs.colSpan < 2) {\n td.classList.add(isRtl ? 'e-removefreezeleftborder' : 'e-removefreezerightborder');\n }\n }\n }\n if (cellArgs.rowSpan > 1 && this_1.parent.currentViewData.length - row.index === cellArgs.rowSpan) {\n td.classList.add('e-row-span-lastrowcell');\n }\n if (!row.cells[parseInt(i.toString(), 10)].isSpanned) {\n tr.appendChild(td);\n }\n }\n };\n var this_1 = this;\n for (var i = 0, len = row.cells.length; i < len; i++) {\n _loop_2(i, len);\n }\n var emptyColspan = 0;\n if (this.parent.groupSettings.columns.length && this.parent.getFrozenLeftColumnsCount()) {\n if (tr.classList.contains('e-groupcaptionrow')) {\n var freezeCells = [].slice.call(tr.querySelectorAll('.e-leftfreeze,.e-unfreeze,.e-rightfreeze,.e-fixedfreeze,.e-freezerightborder,.e-freezeleftborder'));\n if (freezeCells.length) {\n removeClass(freezeCells, ['e-leftfreeze', 'e-unfreeze', 'e-rightfreeze', 'e-fixedfreeze', 'e-freezerightborder', 'e-freezeleftborder']);\n }\n if (tr.querySelector('.e-summarycell')) {\n groupCaptionRowLeftRightPos(tr, this.parent);\n }\n else {\n for (var j = 0; j < tr.childNodes.length; j++) {\n var td = tr.childNodes[parseInt(j.toString(), 10)];\n td.classList.add('e-leftfreeze');\n applyStickyLeftRightPosition(td, j * 30, this.parent.enableRtl, 'Left');\n if (td.classList.contains('e-groupcaption')) {\n var oldColspan = parseInt(td.getAttribute('colspan'), 10);\n var colspan = resetColspanGroupCaption(this.parent, j);\n td.setAttribute('colspan', colspan.toString());\n emptyColspan = oldColspan - colspan;\n }\n }\n if (emptyColspan) {\n var td = this.parent.createElement('TD', {\n className: 'e-groupcaption',\n attrs: { colspan: emptyColspan.toString(), id: this.parent.element.id + 'captioncell', tabindex: '-1' }\n });\n tr.appendChild(td);\n }\n }\n }\n if (tr.querySelectorAll('.e-leftfreeze').length &&\n (tr.querySelectorAll('.e-indentcell').length || tr.querySelectorAll('.e-grouptopleftcell').length)) {\n var td = tr.querySelectorAll('.e-indentcell, .e-grouptopleftcell');\n for (var i = 0; i < td.length; i++) {\n td[parseInt(i.toString(), 10)].classList.add('e-leftfreeze');\n applyStickyLeftRightPosition(td[parseInt(i.toString(), 10)], i * 30, this.parent.enableRtl, 'Left');\n }\n }\n }\n var args = { row: tr, rowHeight: this.parent.rowHeight };\n if (row.isDataRow) {\n var eventArg_1 = extend(rowArgs, args);\n eventArg_1.isSelectable = true;\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n this.parent.parentDetails.parentInstObj.isReact;\n var cellTemplate = eventArg_1.row.querySelectorAll('.e-templatecell');\n if (((this.parent.isReact && this.parent.requireTemplateRef) || (isReactChild &&\n this.parent.parentDetails.parentInstObj.requireTemplateRef)) && cellTemplate.length) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var thisRef_2 = this;\n thisRef_2.parent.renderTemplates(function () {\n thisRef_2.parent.trigger(rowDataBound, eventArg_1);\n if (!eventArg_1.isSelectable) {\n row.isSelectable = eventArg_1.isSelectable;\n thisRef_2.disableRowSelection(thisRef_2, row, args, eventArg_1);\n }\n });\n }\n else {\n this.parent.trigger(rowDataBound, eventArg_1);\n }\n row.isSelectable = eventArg_1.isSelectable;\n var isDraggable = this.parent.isRowDragable();\n if (this.parent.allowPaging && this.parent.selectionSettings.persistSelection) {\n var primaryKey_1 = this.parent.getPrimaryKeyFieldNames()[0];\n var pKey_1 = row.data ? row.data[\"\" + primaryKey_1] : null;\n var SelectedRecords = eventArg_1.isSelectable ? this.parent.partialSelectedRecords :\n this.parent.disableSelectedRecords;\n if (!SelectedRecords.some(function (data) { return data[\"\" + primaryKey_1] === pKey_1; })) {\n SelectedRecords.push(row.data);\n }\n }\n if (!eventArg_1.isSelectable) {\n this.disableRowSelection(this, row, args, eventArg_1);\n }\n if (this.parent.childGrid || isDraggable || this.parent.detailTemplate) {\n var td = tr.querySelectorAll('.e-rowcell:not(.e-hide)')[0];\n if (td) {\n td.classList.add('e-detailrowvisible');\n }\n }\n }\n if (this.parent.enableVirtualization) {\n rowArgs.rowHeight = this.parent.rowHeight;\n }\n if (rowArgs.rowHeight) {\n tr.style.height = rowArgs.rowHeight + 'px';\n }\n else if (this.parent.rowHeight && (tr.querySelector('.e-headercell') || tr.querySelector('.e-groupcaption'))) {\n tr.style.height = this.parent.rowHeight + 'px';\n }\n if (row.cssClass) {\n tr.classList.add(row.cssClass);\n }\n if (row.lazyLoadCssClass) {\n tr.classList.add(row.lazyLoadCssClass);\n }\n if (this.parent.rowRenderingMode === 'Vertical' && this.parent.allowTextWrap && (this.parent.textWrapSettings.wrapMode === 'Header'\n || this.parent.textWrapSettings.wrapMode === 'Both')) {\n tr.classList.add('e-verticalwrap');\n }\n var vFTable = this.parent.enableColumnVirtualization;\n if (!vFTable && this.parent.aggregates.length && this.parent.element.scrollHeight > this.parent.height) {\n for (var i = 0; i < this.parent.aggregates.length; i++) {\n var property = 'properties';\n var column = 'columns';\n if (this.parent.aggregates[parseInt(i.toString(), 10)][\"\" + property][\"\" + column][0].footerTemplate) {\n var summarycell = [].slice.call(tr.getElementsByClassName('e-summarycell'));\n if (summarycell.length) {\n var lastSummaryCell = (summarycell[summarycell.length - 1]);\n addClass([lastSummaryCell], ['e-lastsummarycell']);\n var firstSummaryCell = (summarycell[0]);\n addClass([firstSummaryCell], ['e-firstsummarycell']);\n }\n }\n }\n }\n return tr;\n };\n RowRenderer.prototype.resetrowSpanvalue = function (rowCount, cellArgs, rowIndex) {\n if (rowCount > rowIndex && rowCount < rowIndex + cellArgs.rowSpan) {\n var rowSpan = (rowIndex + cellArgs.rowSpan) - rowCount;\n cellArgs.rowSpan = cellArgs.rowSpan - rowSpan;\n }\n };\n RowRenderer.prototype.disableRowSelection = function (thisRef, row, args, eventArg) {\n var selIndex = this.parent.getSelectedRowIndexes();\n this.parent.selectionModule.isPartialSelection = true;\n row.isSelected = false;\n var selRowIndex = selIndex.indexOf(row.index);\n if (selRowIndex > -1) {\n selIndex.splice(selRowIndex, 1);\n }\n var chkBox = args.row.querySelectorAll('.e-rowcell.e-gridchkbox');\n var isDrag = eventArg.row.querySelector('.e-rowdragdrop');\n var cellIdx = thisRef.parent.groupSettings.columns.length + (isDrag || thisRef.parent.isDetail() ? 1 : 0);\n for (var i = 0; i < chkBox.length; i++) {\n chkBox[parseInt(i.toString(), 10)].firstElementChild.classList.add('e-checkbox-disabled');\n chkBox[parseInt(i.toString(), 10)].querySelector('.e-frame').classList.remove('e-check');\n }\n if (row.cells.length) {\n for (var i = cellIdx; i < row.cells.length; i++) {\n var cell = eventArg.row.querySelector('.e-rowcell[data-colindex=\"' + row.cells[parseInt(i.toString(), 10)].index + '\"]');\n if (cell) {\n removeClass([cell], ['e-selectionbackground', 'e-active']);\n }\n }\n }\n if (isDrag) {\n removeClass([isDrag], ['e-selectionbackground', 'e-active']);\n }\n };\n RowRenderer.prototype.refreshMergeCells = function (row) {\n for (var _i = 0, _a = row.cells; _i < _a.length; _i++) {\n var cell = _a[_i];\n cell.isSpanned = false;\n }\n return row;\n };\n /* eslint-disable */\n /**\n * Function to check and add alternative row css class.\n *\n * @param {Element} tr - specifies the tr element\n * @param {Row} row - specifies the row\n * @returns {void}\n */\n /* eslint-enable */\n RowRenderer.prototype.buildAttributeFromRow = function (tr, row) {\n var attr = {};\n var prop = { 'rowindex': literals.dataRowIndex, 'dataUID': 'data-uid', 'ariaSelected': 'aria-selected' };\n var classes = [];\n if (row.isDataRow) {\n classes.push(literals.row);\n }\n if (row.isAltRow) {\n classes.push('e-altrow');\n }\n if (row.isCaptionRow) {\n classes.push('e-groupcaptionrow');\n }\n if (row.isAggregateRow && row.parentUid) {\n classes.push('e-groupfooterrow');\n }\n if (!isNullOrUndefined(row.index)) {\n attr[literals.ariaRowIndex] = row.index + 1;\n attr[prop.rowindex] = row.index;\n }\n if (row.rowSpan) {\n attr.rowSpan = row.rowSpan;\n }\n if (row.uid) {\n attr[prop.dataUID] = row.uid;\n }\n if (row.isSelected) {\n attr[prop.ariaSelected] = true;\n }\n if (row.visible === false) {\n classes.push('e-hide');\n }\n attr.class = classes;\n setStyleAndAttributes(tr, attr);\n };\n return RowRenderer;\n}());\nexport { RowRenderer };\n","import { isNullOrUndefined, getValue, setValue } from '@syncfusion/ej2-base';\nimport { Row } from '../models/row';\nimport { CellType } from '../base/enum';\nimport { Cell } from '../models/cell';\nimport { getUid } from '../base/util';\nimport { getForeignData } from '../../grid/base/util';\nimport * as events from '../base/constant';\n/**\n * RowModelGenerator is used to generate grid data rows.\n *\n * @hidden\n */\nvar RowModelGenerator = /** @class */ (function () {\n /**\n * Constructor for header renderer module\n *\n * @param {IGrid} parent - specifies the IGrid\n */\n function RowModelGenerator(parent) {\n this.parent = parent;\n }\n RowModelGenerator.prototype.generateRows = function (data, args) {\n var rows = [];\n var startIndex = this.parent.enableVirtualization && args ? args.startIndex : 0;\n startIndex = this.parent.enableInfiniteScrolling && args ? this.getInfiniteIndex(args) : startIndex;\n if (this.parent.enableImmutableMode && args && args.startIndex) {\n startIndex = args.startIndex;\n }\n for (var i = 0, len = Object.keys(data).length; i < len; i++, startIndex++) {\n rows[parseInt(i.toString(), 10)] = this.generateRow(data[parseInt(i.toString(), 10)], startIndex);\n }\n return rows;\n };\n RowModelGenerator.prototype.ensureColumns = function () {\n //TODO: generate dummy column for group, detail here;\n var cols = [];\n if (this.parent.detailTemplate || this.parent.childGrid) {\n var args = {};\n this.parent.notify(events.detailIndentCellInfo, args);\n cols.push(this.generateCell(args, null, CellType.DetailExpand));\n }\n if (this.parent.isRowDragable()) {\n cols.push(this.generateCell({}, null, CellType.RowDragIcon));\n }\n return cols;\n };\n RowModelGenerator.prototype.generateRow = function (data, index, cssClass, indent, pid, tIndex, parentUid) {\n var options = {};\n options.foreignKeyData = {};\n options.uid = getUid('grid-row');\n options.data = data;\n options.index = index;\n options.indent = indent;\n options.tIndex = tIndex;\n options.isDataRow = true;\n options.parentGid = pid;\n options.parentUid = parentUid;\n if (this.parent.isPrinting) {\n if (this.parent.hierarchyPrintMode === 'All') {\n options.isExpand = true;\n }\n else if (this.parent.hierarchyPrintMode === 'Expanded' && this.parent.expandedRows && this.parent.expandedRows[parseInt(index.toString(), 10)]) {\n options.isExpand = this.parent.expandedRows[parseInt(index.toString(), 10)].isExpand;\n }\n }\n options.cssClass = cssClass;\n options.isAltRow = this.parent.enableAltRow ? index % 2 !== 0 : false;\n options.isAltRow = this.parent.enableAltRow ? index % 2 !== 0 : false;\n options.isSelected = this.parent.getSelectedRowIndexes().indexOf(index) > -1;\n this.refreshForeignKeyRow(options);\n var cells = this.ensureColumns();\n var row = new Row(options, this.parent);\n row.cells = this.parent.getFrozenMode() === 'Right' ? this.generateCells(options).concat(cells)\n : cells.concat(this.generateCells(options));\n return row;\n };\n RowModelGenerator.prototype.refreshForeignKeyRow = function (options) {\n var foreignKeyColumns = this.parent.getForeignKeyColumns();\n for (var i = 0; i < foreignKeyColumns.length; i++) {\n setValue(foreignKeyColumns[parseInt(i.toString(), 10)].field, getForeignData(foreignKeyColumns[parseInt(i.toString(), 10)], options.data), options.foreignKeyData);\n }\n };\n RowModelGenerator.prototype.generateCells = function (options) {\n var dummies = this.parent.getColumns();\n var tmp = [];\n for (var i = 0; i < dummies.length; i++) {\n tmp.push(this.generateCell(dummies[parseInt(i.toString(), 10)], options.uid, isNullOrUndefined(dummies[parseInt(i.toString(), 10)].commands) ? undefined : CellType.CommandColumn, null, i, options.foreignKeyData));\n }\n return tmp;\n };\n /**\n *\n * @param {Column} column - Defines column details\n * @param {string} rowId - Defines row id\n * @param {CellType} cellType - Defines cell type\n * @param {number} colSpan - Defines colSpan\n * @param {number} oIndex - Defines index\n * @param {Object} foreignKeyData - Defines foreign key data\n * @returns {Cell} returns cell model\n * @hidden\n */\n RowModelGenerator.prototype.generateCell = function (column, rowId, cellType, colSpan, oIndex, foreignKeyData) {\n var opt = {\n 'visible': column.visible,\n 'isDataCell': !isNullOrUndefined(column.field || column.template),\n 'isTemplate': !isNullOrUndefined(column.template),\n 'rowID': rowId,\n 'column': column,\n 'cellType': !isNullOrUndefined(cellType) ? cellType : CellType.Data,\n 'colSpan': colSpan,\n 'commands': column.commands,\n 'isForeignKey': column.isForeignColumn && column.isForeignColumn(),\n 'foreignKeyData': column.isForeignColumn && column.isForeignColumn() && getValue(column.field, foreignKeyData)\n };\n if (opt.isDataCell || opt.column.type === 'checkbox' || opt.commands) {\n opt.index = oIndex;\n }\n return new Cell(opt);\n };\n RowModelGenerator.prototype.refreshRows = function (input) {\n for (var i = 0; i < input.length; i++) {\n this.refreshForeignKeyRow(input[parseInt(i.toString(), 10)]);\n input[parseInt(i.toString(), 10)].cells = this.generateCells(input[parseInt(i.toString(), 10)]);\n }\n return input;\n };\n RowModelGenerator.prototype.getInfiniteIndex = function (args) {\n return args.requestType === 'infiniteScroll' || args.requestType === 'delete' || args.action === 'add'\n ? (isNullOrUndefined(args.startIndex) ? args['index'] : args.startIndex) : 0;\n };\n return RowModelGenerator;\n}());\nexport { RowModelGenerator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Row } from '../models/row';\nimport { Column } from '../models/column';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { calculateAggregate, getUid } from '../base/util';\nimport { CellType } from '../base/enum';\nimport { Cell } from '../models/cell';\n/**\n * Summary row model generator\n *\n * @hidden\n */\nvar SummaryModelGenerator = /** @class */ (function () {\n /**\n * Constructor for Summary row model generator\n *\n * @param {IGrid} parent - specifies the IGrid\n */\n function SummaryModelGenerator(parent) {\n this.parent = parent;\n }\n SummaryModelGenerator.prototype.getData = function () {\n var _this = this;\n var rows = [];\n var row = this.parent.aggregates.slice();\n for (var i = 0; i < row.length; i++) {\n var columns = row[parseInt(i.toString(), 10)].columns.filter(function (column) {\n return !(column.footerTemplate || column.groupFooterTemplate || column.groupCaptionTemplate)\n || _this.columnSelector(column);\n });\n if (columns.length) {\n rows.push({ columns: columns });\n }\n }\n return rows;\n };\n SummaryModelGenerator.prototype.columnSelector = function (column) {\n return column.footerTemplate !== undefined;\n };\n SummaryModelGenerator.prototype.getColumns = function (start) {\n var columns = [];\n if (this.parent.detailTemplate || !isNullOrUndefined(this.parent.childGrid)) {\n columns.push(new Column({}));\n }\n if (this.parent.allowGrouping) {\n for (var i = 0; i < this.parent.groupSettings.columns.length; i++) {\n columns.push(new Column({}));\n }\n }\n if (this.parent.isRowDragable() && !start) {\n columns.push(new Column({}));\n }\n columns.push.apply(columns, this.parent.getColumns());\n return columns;\n };\n SummaryModelGenerator.prototype.generateRows = function (input, args, start, end, columns) {\n if (input.length === 0) {\n if (args === undefined || !(args.count || args.loadSummaryOnEmpty)) {\n return [];\n }\n }\n var data = this.buildSummaryData(input, args);\n var rows = [];\n var row = this.getData();\n for (var i = 0; i < row.length; i++) {\n rows.push(this.getGeneratedRow(row[parseInt(i.toString(), 10)], data[parseInt(i.toString(), 10)], args ? args.level : undefined, start, end, args ? args.parentUid : undefined, columns));\n }\n return rows;\n };\n SummaryModelGenerator.prototype.getGeneratedRow = function (summaryRow, data, raw, start, end, parentUid, columns) {\n var tmp = [];\n var indents = this.getIndentByLevel();\n var isDetailGridAlone = !isNullOrUndefined(this.parent.childGrid);\n var indentLength = this.parent.getIndentCount();\n if (this.parent.groupSettings.columns.length && this.parent.allowRowDragAndDrop) {\n indents.push('e-indentcelltop');\n }\n else if (this.parent.isRowDragable() && !start) {\n indents = ['e-indentcelltop'];\n }\n var values = columns ? columns : this.getColumns(start);\n for (var i = 0; i < values.length; i++) {\n tmp.push(this.getGeneratedCell(values[parseInt(i.toString(), 10)], summaryRow, i >= indentLength ? this.getCellType() :\n i === 0 && this.parent.childGrid ? CellType.DetailFooterIntent : CellType.Indent, indents[parseInt(i.toString(), 10)], isDetailGridAlone));\n }\n var row = new Row({ data: data, attributes: { class: 'e-summaryrow' } });\n row.cells = tmp;\n row.uid = getUid('grid-row');\n row.parentUid = parentUid;\n row.isAggregateRow = true;\n row.visible = tmp.some(function (cell) { return cell.isDataCell && cell.visible; });\n return row;\n };\n SummaryModelGenerator.prototype.getGeneratedCell = function (column, summaryRow, cellType, indent, isDetailGridAlone) {\n //Get the summary column by display\n var sColumn = summaryRow.columns.filter(function (scolumn) { return scolumn.columnName === column.field; })[0];\n var attrs = {\n 'style': { 'textAlign': column.textAlign },\n 'e-mappinguid': column.uid, index: column.index\n };\n if (indent) {\n attrs.class = indent;\n }\n if (isNullOrUndefined(indent) && isDetailGridAlone) {\n attrs.class = 'e-detailindentcelltop';\n }\n var opt = {\n 'visible': column.visible,\n 'isDataCell': !isNullOrUndefined(sColumn),\n 'isTemplate': sColumn && !isNullOrUndefined(sColumn.footerTemplate\n || sColumn.groupFooterTemplate || sColumn.groupCaptionTemplate),\n 'column': sColumn || {},\n 'attributes': attrs,\n 'cellType': cellType\n };\n opt.column.headerText = column.headerText;\n return new Cell(opt);\n };\n SummaryModelGenerator.prototype.buildSummaryData = function (data, args) {\n var dummy = [];\n var summaryRows = this.getData();\n var single = {};\n for (var i = 0; i < summaryRows.length; i++) {\n single = {};\n var column = summaryRows[parseInt(i.toString(), 10)].columns;\n for (var j = 0; j < column.length; j++) {\n single = this.setTemplate(column[parseInt(j.toString(), 10)], (args && args.aggregates) ? args : data, single);\n }\n dummy.push(single);\n }\n return dummy;\n };\n SummaryModelGenerator.prototype.getIndentByLevel = function () {\n return this.parent.groupSettings.columns.map(function () { return 'e-indentcelltop'; });\n };\n SummaryModelGenerator.prototype.setTemplate = function (column, data, single) {\n var types = column.type;\n var helper = {};\n var formatFn = column.getFormatter() || (function () { return function (a) { return a; }; })();\n var group = data;\n if (!(types instanceof Array)) {\n types = [column.type];\n }\n for (var i = 0; i < types.length; i++) {\n var key = column.field + ' - ' + types[parseInt(i.toString(), 10)].toLowerCase();\n var disp = column.columnName;\n var disablePageWiseAggregatesGroup = this.parent.groupSettings.disablePageWiseAggregates\n && this.parent.groupSettings.columns.length && group.items ? true : false;\n var val = (types[parseInt(i.toString(), 10)] !== 'Custom' || disablePageWiseAggregatesGroup) && group.aggregates\n && key in group.aggregates ? group.aggregates[\"\" + key] :\n calculateAggregate(types[parseInt(i.toString(), 10)], group.aggregates ? group : data, column, this.parent);\n single[\"\" + disp] = single[\"\" + disp] || {};\n single[\"\" + disp][\"\" + key] = val;\n single[\"\" + disp][types[parseInt(i.toString(), 10)]] = !isNullOrUndefined(val) ? formatFn(val) : ' ';\n if (group.field) {\n single[\"\" + disp].field = group.field;\n single[\"\" + disp].key = group.key;\n }\n }\n helper.format = column.getFormatter();\n column.setTemplate(helper);\n return single;\n };\n SummaryModelGenerator.prototype.getCellType = function () {\n return CellType.Summary;\n };\n return SummaryModelGenerator;\n}());\nexport { SummaryModelGenerator };\nvar GroupSummaryModelGenerator = /** @class */ (function (_super) {\n __extends(GroupSummaryModelGenerator, _super);\n function GroupSummaryModelGenerator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n GroupSummaryModelGenerator.prototype.columnSelector = function (column) {\n return column.groupFooterTemplate !== undefined;\n };\n GroupSummaryModelGenerator.prototype.getIndentByLevel = function (level) {\n if (level === void 0) { level = this.parent.groupSettings.columns.length; }\n if (this.parent.allowRowDragAndDrop && this.parent.groupSettings.columns.length) {\n level -= 1;\n }\n return this.parent.groupSettings.columns.map(function (v, indx) { return indx <= level - 1 ? '' : 'e-indentcelltop'; });\n };\n GroupSummaryModelGenerator.prototype.getCellType = function () {\n return CellType.GroupSummary;\n };\n return GroupSummaryModelGenerator;\n}(SummaryModelGenerator));\nexport { GroupSummaryModelGenerator };\nvar CaptionSummaryModelGenerator = /** @class */ (function (_super) {\n __extends(CaptionSummaryModelGenerator, _super);\n function CaptionSummaryModelGenerator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n CaptionSummaryModelGenerator.prototype.columnSelector = function (column) {\n return column.groupCaptionTemplate !== undefined;\n };\n CaptionSummaryModelGenerator.prototype.getData = function () {\n var initVal = { columns: [] };\n return [_super.prototype.getData.call(this).reduce(function (prev, cur) {\n prev.columns = prev.columns.concat(cur.columns);\n return prev;\n }, initVal)];\n };\n CaptionSummaryModelGenerator.prototype.isEmpty = function () {\n return (this.getData()[0].columns || []).length === 0;\n };\n CaptionSummaryModelGenerator.prototype.getCellType = function () {\n return CellType.CaptionSummary;\n };\n return CaptionSummaryModelGenerator;\n}(SummaryModelGenerator));\nexport { CaptionSummaryModelGenerator };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { Row } from '../models/row';\nimport { isNullOrUndefined, extend, setValue } from '@syncfusion/ej2-base';\nimport { CellType } from '../base/enum';\nimport { RowModelGenerator } from '../services/row-model-generator';\nimport { GroupSummaryModelGenerator, CaptionSummaryModelGenerator } from '../services/summary-model-generator';\nimport { getForeignData, getUid } from '../../grid/base/util';\n/**\n * GroupModelGenerator is used to generate group caption rows and data rows.\n *\n * @hidden\n */\nvar GroupModelGenerator = /** @class */ (function (_super) {\n __extends(GroupModelGenerator, _super);\n function GroupModelGenerator(parent) {\n var _this = _super.call(this, parent) || this;\n _this.rows = [];\n /** @hidden */\n _this.index = 0;\n _this.infiniteChildCount = 0;\n _this.renderInfiniteAgg = true;\n _this.parent = parent;\n _this.summaryModelGen = new GroupSummaryModelGenerator(parent);\n _this.captionModelGen = new CaptionSummaryModelGenerator(parent);\n return _this;\n }\n GroupModelGenerator.prototype.generateRows = function (data, args) {\n if (this.parent.groupSettings.columns.length === 0) {\n return _super.prototype.generateRows.call(this, data, args);\n }\n this.isInfiniteScroll = (args.requestType === 'infiniteScroll');\n this.rows = [];\n this.index = this.parent.enableVirtualization || this.isInfiniteScroll ? args.startIndex : 0;\n for (var i = 0, len = data.length; i < len; i++) {\n this.infiniteChildCount = 0;\n this.renderInfiniteAgg = true;\n this.getGroupedRecords(0, data[parseInt(i.toString(), 10)], data.level, i, undefined, this.rows.length);\n }\n this.index = 0;\n if (this.parent.isCollapseStateEnabled()) {\n this.ensureRowVisibility();\n }\n return this.rows;\n };\n GroupModelGenerator.prototype.getGroupedRecords = function (index, data, raw, parentid, childId, tIndex, parentUid) {\n var _a;\n var level = raw;\n if (isNullOrUndefined(data.items)) {\n if (isNullOrUndefined(data.GroupGuid)) {\n this.rows = this.rows.concat(this.generateDataRows(data, index, parentid, this.rows.length, parentUid));\n }\n else {\n for (var j = 0, len = data.length; j < len; j++) {\n this.getGroupedRecords(index, data[parseInt(j.toString(), 10)], data.level, parentid, index, this.rows.length, parentUid);\n }\n }\n }\n else {\n var preCaption = void 0;\n var captionRow = this.generateCaptionRow(data, index, parentid, childId, tIndex, parentUid);\n if (this.isInfiniteScroll) {\n preCaption = this.getPreCaption(index, captionRow.data.key);\n }\n if (!preCaption) {\n this.rows = this.rows.concat(captionRow);\n }\n else {\n captionRow.uid = preCaption.uid;\n }\n if (data.items && data.items.length) {\n this.getGroupedRecords(index + 1, data.items, data.items.level, parentid, index + 1, this.rows.length, captionRow.uid);\n }\n if (this.parent.aggregates.length && this.isRenderAggregate(captionRow)) {\n var rowCnt = this.rows.length;\n (_a = this.rows).push.apply(_a, this.summaryModelGen.generateRows(data, { level: level, parentUid: captionRow.uid }));\n for (var i = rowCnt - 1; i >= 0; i--) {\n if (this.rows[parseInt(i.toString(), 10)].isCaptionRow) {\n this.rows[parseInt(i.toString(), 10)].aggregatesCount = this.rows.length - rowCnt;\n }\n else if (!this.rows[parseInt(i.toString(), 10)].isCaptionRow && !this.rows[parseInt(i.toString(), 10)].isDataRow) {\n break;\n }\n }\n }\n if (preCaption) {\n this.setInfiniteRowVisibility(preCaption);\n }\n }\n };\n GroupModelGenerator.prototype.isRenderAggregate = function (data) {\n if (this.parent.enableInfiniteScrolling) {\n if (!this.renderInfiniteAgg) {\n return false;\n }\n this.getPreCaption(data.indent, data.data.key);\n this.renderInfiniteAgg = data.data.count === this.infiniteChildCount;\n return this.renderInfiniteAgg;\n }\n return !this.parent.enableInfiniteScrolling;\n };\n GroupModelGenerator.prototype.getPreCaption = function (indent, key) {\n var rowObj = this.parent.getRowsObject().concat(this.rows);\n var preCap;\n this.infiniteChildCount = 0;\n var i = rowObj.length;\n while (i--) {\n if (rowObj[parseInt(i.toString(), 10)].isCaptionRow && rowObj[parseInt(i.toString(), 10)].indent === indent) {\n var groupKey = rowObj[parseInt(i.toString(), 10)].data.key;\n if ((groupKey instanceof Date && groupKey.toString() === key.toString()) || groupKey === key) {\n preCap = rowObj[parseInt(i.toString(), 10)];\n }\n }\n if (rowObj[parseInt(i.toString(), 10)].indent === indent || rowObj[parseInt(i.toString(), 10)].indent < indent) {\n break;\n }\n if (rowObj[parseInt(i.toString(), 10)].indent === indent + 1) {\n this.infiniteChildCount++;\n }\n }\n return preCap;\n };\n GroupModelGenerator.prototype.getCaptionRowCells = function (field, indent, data) {\n var cells = [];\n var visibles = [];\n var column = this.parent.getColumnByField(field);\n var indexes = this.parent.getColumnIndexesInView();\n if (this.parent.enableColumnVirtualization) {\n column = this.parent.columns.filter(function (c) { return c.field === field; })[0];\n }\n var groupedLen = this.parent.groupSettings.columns.length;\n var gObj = this.parent;\n if (!this.parent.enableColumnVirtualization || indexes.indexOf(indent) !== -1) {\n for (var i = 0; i < indent; i++) {\n cells.push(this.generateIndentCell());\n }\n cells.push(this.generateCell({}, null, CellType.Expand));\n }\n indent = this.parent.enableColumnVirtualization ? 1 :\n (this.parent.getVisibleColumns().length + groupedLen + (gObj.detailTemplate || gObj.childGrid ? 1 : 0) -\n indent + (this.parent.getVisibleColumns().length ? -1 : 0));\n //Captionsummary cells will be added here.\n if (this.parent.aggregates.length && !this.captionModelGen.isEmpty()) {\n var captionCells = this.captionModelGen.generateRows(data)[0];\n extend(data, captionCells.data);\n var cIndex_1 = 0;\n captionCells.cells.some(function (cell, index) { cIndex_1 = index; return cell.visible && cell.isDataCell; });\n visibles = captionCells.cells.slice(cIndex_1).filter(function (cell) { return cell.visible; });\n if (captionCells.visible && visibles[0].column.field === this.parent.getVisibleColumns()[0].field) {\n visibles = visibles.slice(1);\n }\n if (this.parent.getVisibleColumns().length === 1) {\n visibles = [];\n }\n indent = indent - visibles.length;\n }\n var cols = (!this.parent.enableColumnVirtualization ? [column] : this.parent.getColumns());\n var wFlag = true;\n for (var j = 0; j < cols.length; j++) {\n var tmpFlag = wFlag && indexes.indexOf(indent) !== -1;\n if (tmpFlag) {\n wFlag = false;\n }\n var cellType = !this.parent.enableColumnVirtualization || tmpFlag ?\n CellType.GroupCaption : CellType.GroupCaptionEmpty;\n indent = this.parent.enableColumnVirtualization && cellType === CellType.GroupCaption ? indent + groupedLen : indent;\n if (gObj.isRowDragable()) {\n indent++;\n }\n cells.push(this.generateCell(column, null, cellType, indent));\n }\n cells.push.apply(cells, visibles);\n return cells;\n };\n /**\n * @param {GroupedData} data - specifies the data\n * @param {number} indent - specifies the indent\n * @param {number} parentID - specifies the parentID\n * @param {number} childID - specifies the childID\n * @param {number} tIndex - specifies the TIndex\n * @param {string} parentUid - specifies the ParentUid\n * @returns {Row} returns the Row object\n * @hidden\n */\n GroupModelGenerator.prototype.generateCaptionRow = function (data, indent, parentID, childID, tIndex, parentUid) {\n var options = {};\n var records = 'records';\n var col = this.parent.getColumnByField(data.field);\n options.data = extend({}, data);\n if (col) {\n options.data.field = data.field;\n }\n options.isDataRow = false;\n options.isExpand = !this.parent.groupSettings.enableLazyLoading && !this.parent.isCollapseStateEnabled();\n options.parentGid = parentID;\n options.childGid = childID;\n options.tIndex = tIndex;\n options.isCaptionRow = true;\n options.parentUid = parentUid;\n options.gSummary = !isNullOrUndefined(data.items[\"\" + records]) ? data.items[\"\" + records].length : data.items.length;\n options.uid = getUid('grid-row');\n var row = new Row(options);\n row.indent = indent;\n this.getForeignKeyData(row);\n row.cells = this.getCaptionRowCells(data.field, indent, row.data);\n return row;\n };\n GroupModelGenerator.prototype.getForeignKeyData = function (row) {\n var data = row.data;\n var col = this.parent.getColumnByField(data.field);\n if (col && col.isForeignColumn && col.isForeignColumn()) {\n var fkValue = (isNullOrUndefined(data.key) ? '' : col.valueAccessor(col.foreignKeyValue, getForeignData(col, {}, data.key)[0], col));\n setValue('foreignKey', fkValue, row.data);\n }\n };\n /**\n * @param {Object[]} data - specifies the data\n * @param {number} indent - specifies the indent\n * @param {number} childID - specifies the childID\n * @param {number} tIndex - specifies the tIndex\n * @param {string} parentUid - specifies the ParentUid\n * @returns {Row[]} returns the row object\n * @hidden\n */\n GroupModelGenerator.prototype.generateDataRows = function (data, indent, childID, tIndex, parentUid) {\n var rows = [];\n var indexes = this.parent.getColumnIndexesInView();\n for (var i = 0, len = data.length; i < len; i++, tIndex++) {\n rows[parseInt(i.toString(), 10)] = this.generateRow(data[parseInt(i.toString(), 10)], this.index, i ? undefined : 'e-firstchildrow', indent, childID, tIndex, parentUid);\n for (var j = 0; j < indent; j++) {\n if (this.parent.enableColumnVirtualization && indexes.indexOf(indent) === -1) {\n continue;\n }\n rows[parseInt(i.toString(), 10)].cells.unshift(this.generateIndentCell());\n }\n this.index++;\n }\n return rows;\n };\n GroupModelGenerator.prototype.generateIndentCell = function () {\n return this.generateCell({}, null, CellType.Indent);\n };\n GroupModelGenerator.prototype.refreshRows = function (input) {\n var indexes = this.parent.getColumnIndexesInView();\n for (var i = 0; i < input.length; i++) {\n if (input[parseInt(i.toString(), 10)].isDataRow) {\n input[parseInt(i.toString(), 10)].cells = this.generateCells(input[parseInt(i.toString(), 10)]);\n for (var j = 0; j < input[parseInt(i.toString(), 10)].indent; j++) {\n if (this.parent.enableColumnVirtualization\n && indexes.indexOf(input[parseInt(i.toString(), 10)].indent) === -1) {\n continue;\n }\n input[parseInt(i.toString(), 10)].cells.unshift(this.generateIndentCell());\n }\n }\n else {\n var cRow = this.generateCaptionRow(input[parseInt(i.toString(), 10)].data, input[parseInt(i.toString(), 10)].indent);\n input[parseInt(i.toString(), 10)].cells = cRow.cells;\n }\n }\n return input;\n };\n GroupModelGenerator.prototype.setInfiniteRowVisibility = function (caption) {\n if (!caption.isExpand || caption.visible === false) {\n for (var _i = 0, _a = this.rows; _i < _a.length; _i++) {\n var row = _a[_i];\n if (row.parentUid === caption.uid) {\n row.visible = false;\n if (row.isCaptionRow) {\n this.setInfiniteRowVisibility(row);\n }\n }\n }\n }\n };\n GroupModelGenerator.prototype.ensureRowVisibility = function () {\n for (var i = 0; i < this.rows.length; i++) {\n var row = this.rows[parseInt(i.toString(), 10)];\n if (!row.isCaptionRow) {\n continue;\n }\n for (var j = i + 1; j < this.rows.length; j++) {\n var childRow = this.rows[parseInt(j.toString(), 10)];\n if (row.uid === childRow.parentUid) {\n this.rows[parseInt(j.toString(), 10)].visible = row.isExpand;\n }\n }\n }\n };\n return GroupModelGenerator;\n}(RowModelGenerator));\nexport { GroupModelGenerator };\n","import { Droppable } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, remove, updateBlazorTemplate } from '@syncfusion/ej2-base';\nimport { getUpdateUsingRaf, appendChildren, setDisplayValue, clearReactVueTemplates, getScrollBarWidth, getScrollWidth, getTransformValues } from '../base/util';\nimport * as events from '../base/constant';\nimport { RowRenderer } from './row-renderer';\nimport { CellMergeRender } from './cell-merge-renderer';\nimport { RowModelGenerator } from '../services/row-model-generator';\nimport { GroupModelGenerator } from '../services/group-model-generator';\nimport { isGroupAdaptive, addFixedColumnBorder } from '../base/util';\nimport * as literals from '../base/string-literals';\n// eslint-disable-next-line valid-jsdoc\n/**\n * Content module is used to render grid content\n *\n * @hidden\n */\nvar ContentRender = /** @class */ (function () {\n /**\n * Constructor for content renderer module\n *\n * @param {IGrid} parent - specifies the Igrid\n * @param {ServiceLocator} serviceLocator - specifies the service locator\n */\n function ContentRender(parent, serviceLocator) {\n var _this = this;\n this.rows = [];\n this.freezeRows = [];\n this.movableRows = [];\n this.freezeRowElements = [];\n /** @hidden */\n this.currentInfo = {};\n /** @hidden */\n this.prevCurrentView = [];\n this.isLoaded = true;\n this.drop = function (e) {\n _this.parent.notify(events.columnDrop, { target: e.target, droppedElement: e.droppedElement });\n remove(e.droppedElement);\n };\n this.infiniteCache = {};\n /** @hidden */\n this.visibleRows = [];\n this.visibleFrozenRows = [];\n this.rightFreezeRows = [];\n this.isAddRows = false;\n this.isInfiniteFreeze = false;\n this.useGroupCache = false;\n /** @hidden */\n this.tempFreezeRows = [];\n this.rafCallback = function (args) {\n var arg = args;\n return function () {\n _this.ariaService.setBusy(_this.getPanel().querySelector('.' + literals.content), false);\n if (_this.parent.isDestroyed) {\n return;\n }\n var rows = _this.rows.slice(0);\n if (_this.parent.enableInfiniteScrolling) {\n if (_this.parent.groupSettings.enableLazyLoading) {\n for (var i = 0; i < _this.visibleRows.length; i++) {\n _this.setRowsInLazyGroup(_this.visibleRows[parseInt(i.toString(), 10)], i);\n }\n }\n rows = _this.parent.getRowsObject();\n var prevPage = arg.prevPage;\n if (_this.parent.infiniteScrollSettings.enableCache && prevPage) {\n var maxBlock = _this.parent.infiniteScrollSettings.maxBlocks;\n rows = [];\n var rowIdx = (parseInt(_this.rowElements[0].getAttribute('data-rowindex'), 10) + 1);\n var startIdx = Math.ceil(rowIdx / _this.parent.pageSettings.pageSize);\n for (var i = 0, count = startIdx; i < maxBlock; i++, count++) {\n if (_this.infiniteCache[parseInt(count.toString(), 10)]) {\n rows = rows.concat(_this.infiniteCache[parseInt(count.toString(), 10)]);\n }\n }\n }\n }\n _this.parent.notify(events.contentReady, { rows: rows, args: arg });\n if (_this.parent.editSettings.showAddNewRow && _this.parent.addNewRowFocus) {\n _this.parent.notify(events.showAddNewRowFocus, {});\n _this.parent.addNewRowFocus = false;\n }\n if (_this.parent.autoFit) {\n _this.parent.preventAdjustColumns();\n }\n if (!_this.parent.isInitialLoad) {\n _this.parent.focusModule.setFirstFocusableTabIndex();\n }\n if (_this.isLoaded) {\n _this.parent.isManualRefresh = false;\n if (_this.parent.enableInfiniteScrolling && _this.parent.groupSettings.enableLazyLoading && args.requestType === 'sorting') {\n _this.parent.infiniteScrollModule['groupCaptionAction'] = undefined;\n }\n var isReactChild = _this.parent.parentDetails && _this.parent.parentDetails.parentInstObj &&\n _this.parent.parentDetails.parentInstObj.isReact;\n if ((_this.parent.isReact || isReactChild) && _this.parent.element.querySelectorAll('.e-templatecell').length) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var thisRef_1 = _this;\n thisRef_1.parent.renderTemplates(function () {\n thisRef_1.parent.trigger(events.dataBound, {}, function () {\n if (thisRef_1.parent.allowTextWrap) {\n thisRef_1.parent.notify(events.freezeRender, { case: 'textwrap' });\n }\n });\n });\n }\n else {\n _this.parent.trigger(events.dataBound, {}, function () {\n if (_this.parent.allowTextWrap) {\n _this.parent.notify(events.freezeRender, { case: 'textwrap' });\n }\n });\n }\n if (_this.parent.allowTextWrap && _this.parent.height === 'auto') {\n if (_this.parent.getContentTable().scrollHeight > _this.parent.getContent().clientHeight) {\n _this.parent.scrollModule.setPadding();\n }\n else {\n _this.parent.scrollModule.removePadding();\n }\n }\n }\n if (arg) {\n var action = (arg.requestType || '').toLowerCase() + '-complete';\n _this.parent.notify(action, arg);\n if (args.requestType === 'batchsave') {\n args.cancel = false;\n _this.parent.trigger(events.actionComplete, args);\n }\n }\n if (_this.isLoaded) {\n _this.parent.hideSpinner();\n }\n };\n };\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n this.widthService = serviceLocator.getService('widthService');\n this.ariaService = this.serviceLocator.getService('ariaService');\n this.parent.enableDeepCompare = this.parent.getDataModule().isRemote();\n this.generator = this.getModelGenerator();\n if (this.parent.isDestroyed) {\n return;\n }\n if (!this.parent.enableColumnVirtualization && !this.parent.enableVirtualization\n && !this.parent.groupSettings.enableLazyLoading) {\n this.parent.on(events.columnVisibilityChanged, this.setVisible, this);\n }\n this.parent.on(events.colGroupRefresh, this.colGroupRefresh, this);\n this.parent.on(events.uiUpdate, this.enableAfterRender, this);\n this.parent.on(events.refreshInfiniteModeBlocks, this.refreshContentRows, this);\n this.parent.on(events.beforeCellFocused, this.beforeCellFocused, this);\n this.parent.on(events.destroy, this.droppableDestroy, this);\n }\n ContentRender.prototype.beforeCellFocused = function (e) {\n if (e.byKey && (e.keyArgs.action === 'upArrow' || e.keyArgs.action === 'downArrow')) {\n this.pressedKey = e.keyArgs.action;\n }\n else {\n this.pressedKey = undefined;\n }\n };\n /**\n * The function is used to render grid content div\n *\n * @returns {void}\n */\n ContentRender.prototype.renderPanel = function () {\n var gObj = this.parent;\n var div = this.parent.element.querySelector('.' + literals.gridContent);\n if (div) {\n this.ariaService.setOptions(this.parent.element.querySelector('.' + literals.content), { busy: false });\n this.setPanel(div);\n return;\n }\n div = this.parent.createElement('div', { className: literals.gridContent });\n var innerDiv = this.parent.createElement('div', {\n className: literals.content\n });\n this.ariaService.setOptions(innerDiv, { busy: false });\n if (this.parent.enableColumnVirtualization && this.parent.isFrozenGrid()) {\n this.renderHorizontalScrollbar(div);\n innerDiv.classList.add('e-virtual-content');\n }\n div.appendChild(innerDiv);\n this.setPanel(div);\n gObj.element.appendChild(div);\n };\n ContentRender.prototype.renderHorizontalScrollbar = function (element) {\n var parent = this.parent.createElement('div', { className: 'e-movablescrollbar' });\n var child = this.parent.createElement('div', { className: 'e-movablechild' });\n var scrollbarHeight = getScrollBarWidth().toString();\n this.setScrollbarHeight(child, scrollbarHeight);\n this.setScrollbarHeight(parent, scrollbarHeight);\n parent.appendChild(child);\n element.appendChild(parent);\n };\n ContentRender.prototype.setScrollbarHeight = function (ele, height) {\n ele.style.minHeight = height + 'px';\n ele.style.maxHeight = height + 'px';\n };\n /**\n * The function is used to render grid content table\n *\n * @returns {void}\n */\n ContentRender.prototype.renderTable = function () {\n var contentDiv = this.getPanel();\n var virtualTable = contentDiv.querySelector('.e-virtualtable');\n var virtualTrack = contentDiv.querySelector('.e-virtualtrack');\n if (this.parent.enableVirtualization && !isNullOrUndefined(virtualTable) && !isNullOrUndefined(virtualTrack)) {\n remove(virtualTable);\n remove(virtualTrack);\n }\n contentDiv.appendChild(this.createContentTable('_content_table'));\n this.setTable(contentDiv.querySelector('.' + literals.table));\n if (this.parent.selectionSettings.type === 'Multiple') {\n this.ariaService.setOptions(this.parent.element, {\n multiselectable: true\n });\n }\n this.initializeContentDrop();\n if (this.parent.frozenRows) {\n this.parent.getHeaderContent().classList.add('e-frozenhdr');\n }\n };\n /**\n * The function is used to create content table elements\n *\n * @param {string} id - specifies the id\n * @returns {Element} returns the element\n * @hidden\n */\n ContentRender.prototype.createContentTable = function (id) {\n var innerDiv = this.getPanel().firstElementChild;\n if (this.getTable()) {\n remove(this.getTable());\n }\n var table = innerDiv.querySelector('.' + literals.table) ? innerDiv.querySelector('.' + literals.table) :\n this.parent.createElement('table', {\n className: literals.table, attrs: {\n cellspacing: '0.25px', role: 'presentation',\n id: this.parent.element.id + id\n }\n });\n this.setColGroup(this.parent.getHeaderTable().querySelector(literals.colGroup).cloneNode(true));\n table.appendChild(this.getColGroup());\n table.appendChild(this.parent.createElement(literals.tbody, { attrs: { role: 'rowgroup' } }));\n innerDiv.appendChild(table);\n return innerDiv;\n };\n /**\n * Refresh the content of the Grid.\n *\n * @param {NotifyArgs} args - specifies the args\n * @returns {void}\n */\n // tslint:disable-next-line:max-func-body-length\n ContentRender.prototype.refreshContentRows = function (args) {\n var _this = this;\n if (args === void 0) { args = {}; }\n var gObj = this.parent;\n if (gObj.currentViewData.length === 0) {\n return;\n }\n if (gObj.editSettings && gObj.editModule && gObj.editSettings.mode === 'Batch' && gObj.editModule.formObj\n && gObj.editSettings.showConfirmDialog === false) {\n gObj.editModule.destroyForm();\n }\n var dataSource = this.currentMovableRows || gObj.currentViewData;\n var isReact = gObj.isReact && !isNullOrUndefined(gObj.rowTemplate);\n var frag = isReact ? gObj.createElement(literals.tbody, { attrs: { role: 'rowgroup' } }) : document.createDocumentFragment();\n if (!this.initialPageRecords) {\n this.initialPageRecords = extend([], dataSource);\n }\n var hdrfrag = isReact ? gObj.createElement(literals.tbody, { attrs: { role: 'rowgroup' } }) : document.createDocumentFragment();\n var refFrag;\n var refHdrfrag;\n if (gObj.isReact && gObj.rowTemplate) {\n refFrag = frag;\n refHdrfrag = hdrfrag;\n }\n var columns = gObj.getColumns();\n var tr;\n var hdrTbody;\n var trElement;\n var row = new RowRenderer(this.serviceLocator, null, this.parent);\n var isInfiniteScroll = this.parent.enableInfiniteScrolling\n && args.requestType === 'infiniteScroll';\n var isColumnVirtualInfiniteProcess = this.isInfiniteColumnvirtualization() && args.requestType !== 'virtualscroll';\n gObj.notify(events.destroyChildGrid, {});\n this.rowElements = [];\n this.rows = [];\n this.tempFreezeRows = [];\n var tbdy;\n var tableName;\n var isGroupFrozenHdr = this.parent.frozenRows && this.parent.groupSettings.columns.length ? true : false;\n if (isGroupAdaptive(gObj)) {\n if (['sorting', 'filtering', 'searching', 'grouping', 'ungrouping', 'reorder', 'save', 'delete']\n .some(function (value) { return args.requestType === value; })) {\n this.emptyVcRows();\n }\n }\n var modelData;\n modelData = this.checkCache(modelData, args);\n if (!this.isAddRows && !this.useGroupCache) {\n modelData = this.generator.generateRows(dataSource, args);\n }\n this.setGroupCache(modelData, args);\n this.parent.notify(events.setInfiniteCache, { isInfiniteScroll: isInfiniteScroll, modelData: modelData, args: args });\n var isFrozenLeft = false;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var registeredTemplates = this.parent.registeredTemplate;\n if (!(args.requestType === 'infiniteScroll' && !this.parent.infiniteScrollSettings.enableCache) && registeredTemplates\n && registeredTemplates.template && !args.isFrozen && !isFrozenLeft) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var templatetoclear = [];\n for (var i = 0; i < registeredTemplates.template.length; i++) {\n for (var j = 0; j < registeredTemplates.template[parseInt(i.toString(), 10)].rootNodes.length; j++) {\n if (isNullOrUndefined(registeredTemplates.template[parseInt(i.toString(), 10)]\n .rootNodes[parseInt(j.toString(), 10)].parentNode)) {\n templatetoclear.push(registeredTemplates.template[parseInt(i.toString(), 10)]);\n }\n }\n }\n this.parent.destroyTemplate(['template'], templatetoclear);\n }\n if ((this.parent.isReact || this.parent.isVue) && !(args.requestType === 'infiniteScroll' && !this.parent.infiniteScrollSettings.enableCache) && !args.isFrozen) {\n var templates = [\n this.parent.isVue ? 'template' : 'columnTemplate', 'rowTemplate', 'detailTemplate',\n 'captionTemplate', 'commandsTemplate', 'groupFooterTemplate', 'groupCaptionTemplate'\n ];\n if (args.requestType === 'infiniteScroll' && this.parent.infiniteScrollSettings.enableCache) {\n templates = [\n this.parent.isVue ? 'template' : 'columnTemplate', 'commandsTemplate'\n ];\n }\n clearReactVueTemplates(this.parent, templates);\n }\n if (this.parent.enableColumnVirtualization) {\n var cellMerge = new CellMergeRender(this.serviceLocator, this.parent);\n cellMerge.updateVirtualCells(modelData);\n }\n this.tbody = this.getTable().querySelector(literals.tbody);\n var startIndex = 0;\n var blockLoad = true;\n if (isGroupAdaptive(gObj) && gObj.vcRows.length) {\n var top_1 = 'top';\n var scrollTop = !isNullOrUndefined(args.virtualInfo.offsets) ? args.virtualInfo.offsets.top :\n (!isNullOrUndefined(args.scrollTop) ? args.scrollTop[\"\" + top_1] : 0);\n if (scrollTop !== 0) {\n var offsets_1 = gObj.vGroupOffsets;\n var bSize = gObj.pageSettings.pageSize / 2;\n var values = Object.keys(offsets_1).map(function (key) { return offsets_1[\"\" + key]; });\n for (var m = 0; m < values.length; m++) {\n if (scrollTop < values[parseInt(m.toString(), 10)]) {\n if (!isNullOrUndefined(args.virtualInfo) && args.virtualInfo.direction === 'up') {\n startIndex = m > 0 ? ((m - 1) * bSize) : (m * bSize);\n break;\n }\n else {\n startIndex = m * bSize;\n if (this.parent.contentModule.isEndBlock(m) || this.parent.contentModule.isEndBlock(m + 1)) {\n args.virtualInfo.blockIndexes = [m, m + 1];\n }\n break;\n }\n }\n }\n if (Math.round(scrollTop + this.contentPanel.firstElementChild.offsetHeight) >=\n this.contentPanel.firstElementChild.scrollHeight && !args.rowObject) {\n blockLoad = false;\n }\n }\n }\n var isVFFrozenOnly = gObj.frozenRows && this.parent.enableVirtualization\n && args.requestType === 'reorder';\n if ((gObj.frozenRows && args.requestType === 'virtualscroll' && args.virtualInfo.sentinelInfo.axis === 'X') || isVFFrozenOnly) {\n var bIndex = args.virtualInfo.blockIndexes;\n var page = args.virtualInfo.page;\n args.virtualInfo.blockIndexes = [1, 2];\n if (isVFFrozenOnly) {\n args.virtualInfo.page = 1;\n }\n var data = isVFFrozenOnly ? this.initialPageRecords : dataSource;\n var mhdrData = this.vgenerator\n .generateRows(data, args);\n mhdrData.splice(this.parent.frozenRows);\n for (var i = 0; i < this.parent.frozenRows; i++) {\n // mhdrData[parseInt(i.toString(), 10)].cells.splice(0, this.parent.getFrozenColumns());\n tr = row.render(mhdrData[parseInt(i.toString(), 10)], columns);\n addFixedColumnBorder(tr);\n hdrfrag.appendChild(tr);\n }\n args.virtualInfo.blockIndexes = bIndex;\n args.virtualInfo.page = page;\n if (isVFFrozenOnly && args.virtualInfo.page === 1) {\n modelData.splice(0, this.parent.frozenRows);\n }\n }\n this.virtualFrozenHdrRefresh(hdrfrag, modelData, row, args, dataSource, columns);\n if (this.parent.groupSettings.enableLazyLoading && !this.useGroupCache && this.parent.groupSettings.columns.length) {\n (this.parent.enableVirtualization ? this.parent.lazyLoadRender :\n this.parent.contentModule).refRowsObj[this.parent.pageSettings.currentPage] = [];\n }\n if (this.parent.enableInfiniteScrolling && this.parent.groupSettings.enableLazyLoading && args.requestType === 'delete') { // || (this.parent.infiniteScrollSettings && this.parent.infiniteScrollSettings.enableCache))\n this.visibleRows = [];\n }\n var _loop_1 = function (i, len) {\n this_1.rows.push(modelData[parseInt(i.toString(), 10)]);\n if (this_1.parent.groupSettings.enableLazyLoading && !this_1.useGroupCache && this_1.parent.groupSettings.columns.length) {\n (this_1.parent.enableVirtualization ? this_1.parent.lazyLoadRender :\n this_1.parent.contentModule).refRowsObj[this_1.parent.pageSettings.currentPage].push(modelData[parseInt(i.toString(), 10)]);\n this_1.setRowsInLazyGroup(modelData[parseInt(i.toString(), 10)], i);\n if (isNullOrUndefined(modelData[parseInt(i.toString(), 10)].indent)) {\n return \"continue\";\n }\n }\n this_1.setInfiniteVisibleRows(args, modelData[parseInt(i.toString(), 10)]);\n if (isGroupAdaptive(gObj) && args.virtualInfo && args.virtualInfo.blockIndexes\n && (this_1.rowElements.length >= (args.virtualInfo.blockIndexes.length * this_1.parent.contentModule.getBlockSize()))\n && blockLoad) {\n this_1.parent.currentViewData['records'] = this_1.rows.map(function (m) { return m.data; });\n return \"break\";\n }\n if (!gObj.rowTemplate) {\n tr = row.render(modelData[parseInt(i.toString(), 10)], columns);\n addFixedColumnBorder(tr);\n var isVFreorder = this_1.ensureFrozenHeaderRender(args);\n if (gObj.frozenRows && (i < gObj.frozenRows || isGroupFrozenHdr) && !isInfiniteScroll && args.requestType !== 'virtualscroll' && isVFreorder\n && this_1.ensureVirtualFrozenHeaderRender(args)) {\n hdrfrag.appendChild(tr);\n }\n else {\n frag.appendChild(tr);\n }\n var rowIdx = parseInt(tr.getAttribute('data-rowindex'), 10);\n if (rowIdx + 1 === gObj.frozenRows) {\n isGroupFrozenHdr = false;\n }\n if (modelData[parseInt(i.toString(), 10)].isExpand) {\n gObj.notify(events.expandChildGrid, tr.cells[gObj.groupSettings.columns.length]);\n }\n }\n else {\n var rowTemplateID = gObj.element.id + 'rowTemplate';\n var elements = void 0;\n if (gObj.isReact) {\n var isHeader = gObj.frozenRows && i < gObj.frozenRows;\n var copied = extend({ index: i }, dataSource[parseInt(i.toString(), 10)]);\n gObj.getRowTemplate()(copied, gObj, 'rowTemplate', rowTemplateID, null, null, isHeader ? hdrfrag : frag);\n if (gObj.requireTemplateRef) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var thisRef_2 = this_1;\n thisRef_2.parent.renderTemplates(function () {\n if (gObj.frozenRows && i < gObj.frozenRows) {\n tr = refHdrfrag.childNodes[parseInt(i.toString(), 10)];\n }\n else {\n trElement = refFrag.childNodes[parseInt(i.toString(), 10)];\n }\n var arg = { data: modelData[parseInt(i.toString(), 10)].data,\n row: trElement ? trElement : tr };\n thisRef_2.parent.trigger(events.rowDataBound, arg);\n if (modelData[parseInt(i.toString(), 10)].isDataRow || (thisRef_2.parent.enableVirtualization &&\n thisRef_2.parent.groupSettings.enableLazyLoading)) {\n thisRef_2.rowElements.push(arg.row);\n }\n thisRef_2.ariaService.setOptions(thisRef_2.parent.element, {\n colcount: gObj.getColumns().length.toString()\n });\n if (i === modelData.length - 1) {\n refFrag = null;\n refHdrfrag = null;\n }\n });\n return \"continue\";\n }\n }\n else {\n elements = gObj.getRowTemplate()(extend({ index: i }, dataSource[parseInt(i.toString(), 10)]), gObj, 'rowTemplate', rowTemplateID, undefined, undefined, undefined, this_1.parent['root']);\n }\n if (!gObj.isReact && elements[0].tagName === 'TBODY') {\n for (var j = 0; j < elements.length; j++) {\n var isTR = elements[parseInt(j.toString(), 10)].nodeName.toLowerCase() === 'tr';\n if (isTR || (elements[parseInt(j.toString(), 10)].querySelectorAll && elements[parseInt(j.toString(), 10)].querySelectorAll('tr').length)) {\n tr = isTR ? elements[parseInt(j.toString(), 10)] : elements[parseInt(j.toString(), 10)].querySelector('tr');\n }\n }\n if (gObj.frozenRows && i < gObj.frozenRows) {\n hdrfrag.appendChild(tr);\n }\n else {\n frag.appendChild(tr);\n }\n }\n else {\n if (gObj.frozenRows && i < gObj.frozenRows) {\n tr = !gObj.isReact ? appendChildren(hdrfrag, elements) : hdrfrag.lastElementChild;\n }\n else {\n // frag.appendChild(tr);\n if (!gObj.isReact) {\n tr = appendChildren(frag, elements);\n }\n trElement = gObj.isReact ? frag.lastElementChild : tr.lastElementChild;\n }\n }\n var arg = { data: modelData[parseInt(i.toString(), 10)].data, row: trElement ? trElement : tr };\n this_1.parent.trigger(events.rowDataBound, arg);\n }\n if (modelData[parseInt(i.toString(), 10)].isDataRow || (this_1.parent.enableVirtualization &&\n this_1.parent.groupSettings.enableLazyLoading)) {\n if (!isNullOrUndefined(gObj.rowTemplate) && (gObj.isAngular || gObj.isVue3 || gObj.isVue)) {\n this_1.rowElements.push(trElement ? trElement : tr);\n }\n else {\n this_1.rowElements.push(tr);\n }\n }\n this_1.ariaService.setOptions(this_1.parent.element, { colcount: gObj.getColumns().length.toString() });\n };\n var this_1 = this;\n for (var i = startIndex, len = modelData.length; i < len; i++) {\n var state_1 = _loop_1(i, len);\n if (state_1 === \"break\")\n break;\n }\n var isReactChild = gObj.parentDetails && gObj.parentDetails.parentInstObj && gObj.parentDetails.parentInstObj.isReact;\n if ((gObj.isReact || isReactChild) && !gObj.requireTemplateRef) {\n gObj.renderTemplates();\n }\n if (this.parent.enableInfiniteScrolling && this.parent.groupSettings.enableLazyLoading) {\n this.parent.contentModule.refRowsObj[this.parent.pageSettings.currentPage] =\n this.parent.contentModule['groupCache'][this.parent.pageSettings.currentPage];\n }\n if (this.parent.groupSettings.enableLazyLoading && !this.useGroupCache && this.parent.groupSettings.columns.length) {\n this.parent.notify(events.refreshExpandandCollapse, {\n rows: (this.parent.enableVirtualization ? this.parent.lazyLoadRender :\n this.parent.contentModule).refRowsObj[this.parent.pageSettings.currentPage]\n });\n }\n gObj.removeMaskRow();\n this.parent.notify('removeGanttShimmer', { requestType: 'hideShimmer' });\n if ((gObj.frozenRows && args.requestType !== 'virtualscroll' && !isInfiniteScroll && this.ensureVirtualFrozenHeaderRender(args))\n || (args.requestType === 'virtualscroll' && args.virtualInfo.sentinelInfo && args.virtualInfo.sentinelInfo.axis === 'X')) {\n hdrTbody = gObj.getHeaderTable().querySelector(literals.tbody);\n if (isReact) {\n var parentTable = hdrTbody.parentElement;\n remove(hdrTbody);\n parentTable.appendChild(hdrfrag);\n }\n else {\n hdrTbody.innerHTML = '';\n hdrTbody.appendChild(hdrfrag);\n }\n if (!gObj.isInitialLoad) {\n gObj.scrollModule.setHeight();\n }\n }\n // if (!gObj.enableVirtualization && hdrTbody && gObj.frozenRows && idx === 0 && cont.offsetHeight === Number(gObj.height)) {\n // cont.style.height = (cont.offsetHeight - hdrTbody.offsetHeight) + 'px';\n // }\n args.rows = this.rows.slice(0);\n getUpdateUsingRaf(function () {\n _this.parent.notify(events.beforeFragAppend, args);\n if (!_this.parent.enableVirtualization && (!_this.parent.enableColumnVirtualization || isColumnVirtualInfiniteProcess)\n && !isInfiniteScroll) {\n if (!gObj.isReact) {\n _this.tbody.innerHTML = '';\n }\n if (!isNullOrUndefined(_this.tbody.parentElement)) {\n remove(_this.tbody);\n }\n else {\n remove(gObj.getContentTable().querySelector(literals.tbody));\n }\n _this.tbody = _this.parent.createElement(literals.tbody, { attrs: { role: 'rowgroup' } });\n }\n if (gObj.rowTemplate) {\n updateBlazorTemplate(gObj.element.id + 'rowTemplate', 'RowTemplate', gObj);\n }\n if (!isNullOrUndefined(_this.parent.infiniteScrollModule) && ((_this.parent.enableInfiniteScrolling\n && !_this.isInfiniteColumnvirtualization()) || isColumnVirtualInfiniteProcess)) {\n _this.isAddRows = false;\n _this.parent.notify(events.removeInfiniteRows, { args: args });\n _this.parent.notify(events.appendInfiniteContent, {\n tbody: tbdy ? tbdy : _this.tbody, frag: frag, args: args, rows: _this.rows,\n rowElements: _this.rowElements, visibleRows: _this.visibleRows,\n tableName: tableName\n });\n if (_this.isInfiniteColumnvirtualization() && _this.parent.isFrozenGrid()) {\n var virtualTable = _this.parent.getContent().querySelector('.e-virtualtable');\n var transform = getTransformValues(virtualTable);\n _this.parent.contentModule.resetStickyLeftPos(transform.width);\n _this.widthService.refreshFrozenScrollbar();\n }\n }\n else {\n _this.useGroupCache = false;\n _this.appendContent(_this.tbody, frag, args);\n }\n if (_this.parent.editSettings.showAddNewRow && (_this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling)) {\n var newRow = _this.parent.element.querySelector('.e-addrow-removed');\n if (newRow) {\n remove(newRow);\n }\n }\n var startAdd = !_this.parent.element.querySelector('.' + literals.addedRow);\n if (_this.parent.editSettings.showAddNewRow && _this.parent.editSettings.mode === 'Normal') {\n if (startAdd) {\n if (_this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling) {\n _this.parent.isAddNewRow = true;\n }\n _this.parent.isEdit = false;\n _this.parent.addRecord();\n }\n if (startAdd || ((_this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling) &&\n ['sorting', 'filtering', 'searching', 'grouping', 'ungrouping', 'reorder']\n .some(function (value) { return args.requestType === value; }))) {\n _this.parent.notify(events.showAddNewRowFocus, {});\n }\n }\n if (_this.parent.getVisibleFrozenRightCount() && _this.parent.getContent() && getScrollWidth(_this.parent) > 0) {\n _this.parent.element.classList.add('e-right-shadow');\n }\n frag = null;\n }, this.rafCallback(extend({}, args)));\n };\n ContentRender.prototype.isInfiniteColumnvirtualization = function () {\n return this.parent.enableColumnVirtualization && this.parent.enableInfiniteScrolling;\n };\n ContentRender.prototype.enableCacheOnInfiniteColumnVirtual = function () {\n return this.isInfiniteColumnvirtualization() && this.parent.infiniteScrollSettings.enableCache;\n };\n ContentRender.prototype.emptyVcRows = function () {\n this.parent.vcRows = [];\n this.parent.vRows = [];\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ContentRender.prototype.appendContent = function (tbody, frag, args, tableName) {\n var isReact = this.parent.isReact && !isNullOrUndefined(this.parent.rowTemplate);\n if (isReact) {\n this.getTable().appendChild(frag);\n }\n else {\n tbody.appendChild(frag);\n this.getTable().appendChild(tbody);\n }\n if (this.parent.rowRenderingMode === 'Vertical' && this.parent.allowTextWrap && (this.parent.textWrapSettings.wrapMode === 'Header'\n || this.parent.textWrapSettings.wrapMode === 'Both')) {\n var cells = tbody.querySelectorAll('td');\n for (var i = 0; i < cells.length; i++) {\n var headerCellHeight = parseFloat(document.defaultView.getComputedStyle(cells[parseInt(i.toString(), 10)], '::before').getPropertyValue('height'));\n var cellHeight = cells[parseInt(i.toString(), 10)].offsetHeight;\n if (headerCellHeight > cellHeight) {\n cells[parseInt(i.toString(), 10)].style.height = headerCellHeight + 'px';\n cells[parseInt(i.toString(), 10)].style.boxSizing = 'content-box';\n }\n }\n }\n if (this.parent.getVisibleFrozenLeftCount() && this.parent.enableColumnVirtualization) {\n this.widthService.refreshFrozenScrollbar();\n }\n };\n ContentRender.prototype.setRowsInLazyGroup = function (row, index) {\n if (this.parent.groupSettings.enableLazyLoading && !this.useGroupCache && this.parent.groupSettings.columns.length) {\n (this.parent.enableVirtualization ? this.parent.lazyLoadRender :\n this.parent.contentModule).maintainRows(row, index);\n }\n };\n ContentRender.prototype.setGroupCache = function (data, args) {\n if (!this.useGroupCache && this.parent.groupSettings.enableLazyLoading) {\n this.parent.notify(events.setGroupCache, { args: args, data: data });\n }\n };\n ContentRender.prototype.ensureFrozenHeaderRender = function (args) {\n return !((this.parent.enableVirtualization\n && (args.requestType === 'reorder' || args.requestType === 'refresh')) || (this.parent.infiniteScrollSettings.enableCache\n && this.parent.frozenRows && this.parent.infiniteScrollModule.requestType === 'delete'\n && this.parent.pageSettings.currentPage !== 1));\n };\n ContentRender.prototype.ensureVirtualFrozenHeaderRender = function (args) {\n return !(this.parent.enableVirtualization && args.requestType === 'delete');\n };\n ContentRender.prototype.checkCache = function (modelData, args) {\n if (this.parent.infiniteScrollSettings.enableCache && args.requestType === 'infiniteScroll') {\n this.isAddRows = !isNullOrUndefined(this.infiniteCache[this.parent.pageSettings.currentPage]);\n if (this.isAddRows) {\n var data = this.infiniteCache[this.parent.pageSettings.currentPage];\n modelData = this.parent.pageSettings.currentPage === 1 ? data.slice(this.parent.frozenRows) : data;\n }\n return modelData;\n }\n if (this.parent.groupSettings.enableLazyLoading && this.parent.groupSettings.columns.length && (args.requestType === 'paging'\n || args.requestType === 'columnstate' || args.requestType === 'reorder' || args.requestType === 'virtualscroll')\n && (this.parent.enableVirtualization ? this.parent.lazyLoadRender :\n this.parent.contentModule).getGroupCache()[this.parent.pageSettings.currentPage]) {\n if (!this.parent.enableVirtualization) {\n this.useGroupCache = true;\n }\n return this.parent.enableVirtualization ? this.parent.getRowsObject() :\n this.parent.contentModule.initialGroupRows(args.requestType === 'reorder');\n }\n return null;\n };\n ContentRender.prototype.setInfiniteVisibleRows = function (args, data) {\n if (this.parent.enableInfiniteScrolling && !this.parent.infiniteScrollSettings.enableCache\n && !(this.isInfiniteColumnvirtualization() && args.requestType === 'virtualscroll')) {\n this.visibleRows.push(data);\n }\n };\n ContentRender.prototype.getCurrentBlockInfiniteRecords = function () {\n var data = [];\n if (this.parent.infiniteScrollSettings.enableCache) {\n if (!Object.keys(this.infiniteCache).length) {\n return [];\n }\n var rows = this.parent.getRows();\n var index = parseInt(rows[this.parent.frozenRows].getAttribute(literals.dataRowIndex), 10);\n var first = Math.ceil((index + 1) / this.parent.pageSettings.pageSize);\n index = parseInt(rows[rows.length - 1].getAttribute(literals.dataRowIndex), 10);\n var last = Math.ceil((index + (rows.length ? 1 : 0)) / this.parent.pageSettings.pageSize);\n for (var i = first; i <= last; i++) {\n data = !data.length ? this.infiniteCache[parseInt(i.toString(), 10)]\n : data.concat(this.infiniteCache[parseInt(i.toString(), 10)]);\n }\n if (this.parent.frozenRows && this.parent.pageSettings.currentPage > 1) {\n data = this.infiniteCache[1].slice(0, this.parent.frozenRows).concat(data);\n }\n }\n return data;\n };\n ContentRender.prototype.getReorderedRows = function (args) {\n return this.parent.contentModule.getReorderedFrozenRows(args);\n };\n ContentRender.prototype.virtualFrozenHdrRefresh = function (hdrfrag, modelData, row, args, dataSource, columns) {\n if (this.parent.frozenRows && this.parent.enableVirtualization\n && (args.requestType === 'reorder' || args.requestType === 'refresh')) {\n var tr = void 0;\n var fhdrData = this.getReorderedRows(args);\n for (var i = 0; i < fhdrData.length; i++) {\n tr = row.render(fhdrData[parseInt(i.toString(), 10)], columns);\n hdrfrag.appendChild(tr);\n }\n if (args.virtualInfo.page === 1) {\n modelData.splice(0, this.parent.frozenRows);\n }\n }\n };\n ContentRender.prototype.getInfiniteRows = function () {\n var rows = [];\n if (this.parent.enableInfiniteScrolling) {\n if (this.parent.infiniteScrollSettings.enableCache) {\n var keys = Object.keys(this.infiniteCache);\n for (var i = 0; i < keys.length; i++) {\n rows = rows.concat(this.infiniteCache[keys[parseInt(i.toString(), 10)]]);\n }\n }\n else {\n rows = this.visibleRows;\n }\n }\n return rows;\n };\n ContentRender.prototype.getInfiniteMovableRows = function () {\n var infiniteCacheRows = this.getCurrentBlockInfiniteRecords();\n var infiniteRows = this.parent.enableInfiniteScrolling ? infiniteCacheRows.length ? infiniteCacheRows\n : this.visibleRows : [];\n return infiniteRows;\n };\n /**\n * Get the content div element of grid\n *\n * @returns {Element} returns the element\n */\n ContentRender.prototype.getPanel = function () {\n return this.contentPanel;\n };\n /**\n * Set the content div element of grid\n *\n * @param {Element} panel - specifies the panel\n * @returns {void}\n */\n ContentRender.prototype.setPanel = function (panel) {\n this.contentPanel = panel;\n };\n /**\n * Get the content table element of grid\n *\n * @returns {Element} returns the element\n */\n ContentRender.prototype.getTable = function () {\n return this.contentTable;\n };\n /**\n * Set the content table element of grid\n *\n * @param {Element} table - specifies the table\n * @returns {void}\n */\n ContentRender.prototype.setTable = function (table) {\n this.contentTable = table;\n };\n /**\n * Get the Movable Row collection in the Freeze pane Grid.\n *\n * @returns {Row[] | HTMLCollectionOf} returns the row\n */\n ContentRender.prototype.getRows = function () {\n var infiniteRows = this.getInfiniteRows();\n return infiniteRows.length ? infiniteRows : this.rows;\n };\n /**\n * Get the content table data row elements\n *\n * @returns {Element} returns the element\n */\n ContentRender.prototype.getRowElements = function () {\n return this.rowElements;\n };\n /**\n * Get the content table data row elements\n *\n * @param {Element[]} elements - specifies the elements\n * @returns {void}\n */\n ContentRender.prototype.setRowElements = function (elements) {\n this.rowElements = elements;\n };\n /**\n * Get the header colgroup element\n *\n * @returns {Element} returns the element\n */\n ContentRender.prototype.getColGroup = function () {\n return this.colgroup;\n };\n /**\n * Set the header colgroup element\n *\n * @param {Element} colGroup - specifies the colgroup\n * @returns {Element} returns the element\n */\n ContentRender.prototype.setColGroup = function (colGroup) {\n if (!isNullOrUndefined(colGroup)) {\n colGroup.id = 'content-' + colGroup.id;\n }\n return this.colgroup = colGroup;\n };\n /**\n * Function to hide content table column based on visible property\n *\n * @param {Column[]} columns - specifies the column\n * @returns {void}\n */\n ContentRender.prototype.setVisible = function (columns) {\n var gObj = this.parent;\n var rows = this.getRows();\n var testRow;\n rows.some(function (r) { if (r.isDataRow) {\n testRow = r;\n } return r.isDataRow; });\n var needFullRefresh = true;\n if (!gObj.groupSettings.columns.length && testRow) {\n needFullRefresh = false;\n }\n var tr = gObj.getDataRows();\n var args = {};\n var infiniteData = this.infiniteRowVisibility();\n var contentrows = infiniteData ? infiniteData\n : this.rows.filter(function (row) { return !row.isDetailRow; });\n for (var c = 0, clen = columns.length; c < clen; c++) {\n var column = columns[parseInt(c.toString(), 10)];\n var idx = this.parent.getNormalizedColumnIndex(column.uid);\n var colIdx = this.parent.getColumnIndexByUid(column.uid);\n var displayVal = column.visible === true ? '' : 'none';\n if (idx !== -1 && testRow && idx < testRow.cells.length) {\n setStyleAttribute(this.getColGroup().childNodes[parseInt(idx.toString(), 10)], { 'display': displayVal });\n }\n if (!needFullRefresh) {\n this.setDisplayNone(tr, colIdx, displayVal, contentrows);\n }\n if (!this.parent.invokedFromMedia && column.hideAtMedia) {\n this.parent.updateMediaColumns(column);\n }\n this.parent.invokedFromMedia = false;\n }\n if (needFullRefresh) {\n this.refreshContentRows({ requestType: 'refresh' });\n }\n else {\n this.parent.notify(events.partialRefresh, { rows: contentrows, args: args });\n if (this.parent.editSettings.showAddNewRow && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {\n this.parent.notify(events.showAddNewRowFocus, {});\n }\n }\n };\n /**\n * @param {Object} tr - specifies the trr\n * @param {number} idx - specifies the idx\n * @param {string} displayVal - specifies the displayval\n * @param {Row} rows - specifies the rows\n * @returns {void}\n * @hidden\n */\n ContentRender.prototype.setDisplayNone = function (tr, idx, displayVal, rows) {\n setDisplayValue(tr, idx, displayVal, rows, this.parent, this.parent.isRowDragable());\n this.parent.notify(events.infiniteShowHide, { visible: displayVal, index: idx, isFreeze: this.isInfiniteFreeze });\n };\n ContentRender.prototype.infiniteRowVisibility = function (isFreeze) {\n var infiniteData;\n if (this.parent.enableInfiniteScrolling) {\n this.isInfiniteFreeze = isFreeze;\n if (this.parent.infiniteScrollSettings.enableCache) {\n infiniteData = isFreeze ? this.getCurrentBlockInfiniteRecords() : this.getCurrentBlockInfiniteRecords();\n }\n else {\n infiniteData = isFreeze ? this.visibleFrozenRows : this.visibleRows;\n }\n }\n return infiniteData;\n };\n ContentRender.prototype.colGroupRefresh = function () {\n if (this.getColGroup()) {\n var colGroup = this.getHeaderColGroup();\n this.getTable().replaceChild(colGroup, this.getColGroup());\n this.setColGroup(colGroup);\n }\n };\n ContentRender.prototype.getHeaderColGroup = function () {\n return this.parent.element.querySelector('.' + literals.gridHeader)\n .querySelector(literals.colGroup + ':not(.e-masked-colgroup)').cloneNode(true);\n };\n ContentRender.prototype.initializeContentDrop = function () {\n var gObj = this.parent;\n this.droppable = new Droppable(gObj.element, {\n accept: '.e-dragclone',\n drop: this.drop\n });\n };\n ContentRender.prototype.droppableDestroy = function () {\n if (this.droppable && !this.droppable.isDestroyed) {\n this.droppable.destroy();\n }\n };\n ContentRender.prototype.canSkip = function (column, row, index) {\n /**\n * Skip the toggle visiblity operation when one of the following success\n * 1. Grid has empty records\n * 2. column visible property is unchanged\n * 3. cell`s isVisible property is same as column`s visible property.\n */\n return isNullOrUndefined(row) || //(1)\n isNullOrUndefined(column.visible) || //(2)\n row.cells[parseInt(index.toString(), 10)].visible === column.visible; //(3)\n };\n ContentRender.prototype.getModelGenerator = function () {\n return this.generator = this.parent.allowGrouping ? new GroupModelGenerator(this.parent) : new RowModelGenerator(this.parent);\n };\n ContentRender.prototype.renderEmpty = function (tbody) {\n this.getTable().appendChild(tbody);\n if (this.parent.frozenRows) {\n this.parent.getHeaderContent().querySelector(literals.tbody).innerHTML = '';\n }\n };\n ContentRender.prototype.setSelection = function (uid, set, clearAll) {\n this.parent.notify(events.setFreezeSelection, { uid: uid, set: set, clearAll: clearAll });\n var row = this.getRows().filter(function (row) { return clearAll || uid === row.uid; });\n for (var j = 0; j < row.length; j++) {\n row[parseInt(j.toString(), 10)].isSelected = set;\n var cells = row[parseInt(j.toString(), 10)].cells;\n for (var k = 0; k < cells.length; k++) {\n cells[parseInt(k.toString(), 10)].isSelected = set;\n }\n }\n };\n ContentRender.prototype.getRowByIndex = function (index) {\n index = this.getInfiniteRowIndex(index);\n return !isNullOrUndefined(index) ? this.parent.getDataRows()[parseInt(index.toString(), 10)] : undefined;\n };\n ContentRender.prototype.getInfiniteRowIndex = function (index) {\n if (this.parent.infiniteScrollSettings.enableCache && !isNullOrUndefined(index)) {\n var fRows = this.parent.frozenRows;\n var idx = fRows > index ? 0 : fRows;\n var firstRowIndex = parseInt(this.parent.getRows()[parseInt(idx.toString(), 10)]\n .getAttribute(literals.dataRowIndex), 10);\n index = fRows > index ? index : (index - firstRowIndex) + fRows;\n }\n return index;\n };\n ContentRender.prototype.getVirtualRowIndex = function (index) {\n return index;\n };\n ContentRender.prototype.enableAfterRender = function (e) {\n if (e.module === 'group' && e.enable) {\n this.generator = this.getModelGenerator();\n }\n };\n ContentRender.prototype.setRowObjects = function (rows) {\n this.rows = rows;\n };\n /**\n * @param {NotifyArgs} args - specifies the args\n * @returns {void}\n * @hidden\n */\n ContentRender.prototype.immutableModeRendering = function (args) {\n var _this = this;\n if (args === void 0) { args = {}; }\n var gObj = this.parent;\n gObj.hideSpinner();\n var key = gObj.getPrimaryKeyFieldNames()[0];\n var oldKeys = {};\n var newKeys = {};\n var newRowObjs = [];\n var oldIndexes = {};\n var oldRowObjs = gObj.getRowsObject().slice();\n var batchChangeKeys = this.getBatchEditedRecords(key, oldRowObjs);\n var newIndexes = {};\n var hasBatch = Object.keys(batchChangeKeys).length !== 0;\n if (gObj.getContent().querySelector('.e-emptyrow') || args.requestType === 'reorder'\n || this.parent.groupSettings.columns.length) {\n this.refreshContentRows(args);\n }\n else {\n if (gObj.currentViewData.length === 0) {\n return;\n }\n var oldRowElements = {};\n var tbody = gObj.createElement(literals.tbody, { attrs: { role: 'rowgroup' } });\n var dataSource = gObj.currentViewData;\n var trs = [].slice.call(this.getTable().querySelector(literals.tbody).children);\n if (this.prevCurrentView.length) {\n var prevLen = this.prevCurrentView.length;\n var currentLen = dataSource.length;\n if (prevLen === currentLen) {\n for (var i = 0; i < currentLen; i++) {\n if (this.parent.editSettings.mode === 'Batch'\n && trs[parseInt(i.toString(), 10)].classList.contains('e-insertedrow')) {\n trs.splice(i, 1);\n --i;\n continue;\n }\n newKeys[dataSource[parseInt(i.toString(), 10)][\"\" + key]] = oldKeys[this.prevCurrentView[parseInt(i.toString(), 10)][\"\" + key]] = i;\n newIndexes[parseInt(i.toString(), 10)] = dataSource[parseInt(i.toString(), 10)][\"\" + key];\n oldRowElements[oldRowObjs[parseInt(i.toString(), 10)].uid] = trs[parseInt(i.toString(), 10)];\n oldIndexes[parseInt(i.toString(), 10)] = this.prevCurrentView[parseInt(i.toString(), 10)][\"\" + key];\n }\n }\n else {\n for (var i = 0; i < currentLen; i++) {\n newKeys[dataSource[parseInt(i.toString(), 10)][\"\" + key]] = i;\n newIndexes[parseInt(i.toString(), 10)] = dataSource[parseInt(i.toString(), 10)][\"\" + key];\n }\n for (var i = 0; i < prevLen; i++) {\n if (this.parent.editSettings.mode === 'Batch'\n && trs[parseInt(i.toString(), 10)].classList.contains('e-insertedrow')) {\n trs.splice(i, 1);\n --i;\n continue;\n }\n oldRowElements[oldRowObjs[parseInt(i.toString(), 10)].uid] = trs[parseInt(i.toString(), 10)];\n oldKeys[this.prevCurrentView[parseInt(i.toString(), 10)][\"\" + key]] = i;\n oldIndexes[parseInt(i.toString(), 10)] = this.prevCurrentView[parseInt(i.toString(), 10)][\"\" + key];\n }\n }\n }\n for (var i = 0; i < dataSource.length; i++) {\n var oldIndex = oldKeys[dataSource[parseInt(i.toString(), 10)][\"\" + key]];\n if (!isNullOrUndefined(oldIndex)) {\n var isEqual = false;\n if (this.parent.enableDeepCompare) {\n isEqual = this.objectEqualityChecker(this.prevCurrentView[parseInt(oldIndex.toString(), 10)], dataSource[parseInt(i.toString(), 10)]);\n }\n var tr = oldRowElements[oldRowObjs[parseInt(oldIndex.toString(), 10)]\n .uid];\n newRowObjs.push(oldRowObjs[parseInt(oldIndex.toString(), 10)]);\n if (this.rowElements[parseInt(oldIndex.toString(), 10)] && this.rowElements[parseInt(oldIndex.toString(), 10)].getAttribute('data-uid') === newRowObjs[parseInt(i.toString(), 10)].uid\n && ((hasBatch && isNullOrUndefined(batchChangeKeys[newIndexes[parseInt(i.toString(), 10)]]))\n || (!hasBatch && (isEqual\n || this.prevCurrentView[parseInt(oldIndex.toString(), 10)] === dataSource[parseInt(i.toString(), 10)])))) {\n if (oldIndex !== i) {\n this.refreshImmutableContent(i, tr, newRowObjs[parseInt(i.toString(), 10)]);\n }\n tbody.appendChild(tr);\n continue;\n }\n if ((hasBatch && !isNullOrUndefined(batchChangeKeys[newIndexes[parseInt(i.toString(), 10)]]))\n || (!this.parent.enableDeepCompare\n && dataSource[parseInt(i.toString(), 10)] !== this.prevCurrentView[parseInt(oldIndex.toString(), 10)])\n || (this.parent.enableDeepCompare && !isEqual)) {\n oldRowObjs[parseInt(oldIndex.toString(), 10)].setRowValue(dataSource[parseInt(i.toString(), 10)]);\n }\n tbody.appendChild(tr);\n this.refreshImmutableContent(i, tr, newRowObjs[parseInt(i.toString(), 10)]);\n }\n else {\n var row = new RowRenderer(this.serviceLocator, null, gObj);\n var args_1 = { startIndex: i };\n var modelData = this.generator.generateRows([dataSource[parseInt(i.toString(), 10)]], args_1);\n newRowObjs.push(modelData[0]);\n var tr = row.render(modelData[0], gObj.getColumns());\n tbody.appendChild(tr);\n this.refreshImmutableContent(i, tr, newRowObjs[parseInt(i.toString(), 10)]);\n }\n }\n this.rows = newRowObjs;\n this.rowElements = [].slice.call(tbody.children);\n remove(this.getTable().querySelector(literals.tbody));\n this.getTable().appendChild(tbody);\n this.parent.trigger(events.dataBound, {}, function () {\n if (_this.parent.allowTextWrap) {\n _this.parent.notify(events.freezeRender, { case: 'textwrap' });\n }\n });\n if (args) {\n var action = (args.requestType || '').toLowerCase() + '-complete';\n this.parent.notify(action, args);\n }\n }\n };\n ContentRender.prototype.objectEqualityChecker = function (old, next) {\n var keys = Object.keys(old);\n var isEqual = true;\n for (var i = 0; i < keys.length; i++) {\n if (old[keys[parseInt(i.toString(), 10)]] !== next[keys[parseInt(i.toString(), 10)]]) {\n var isDate = old[keys[parseInt(i.toString(), 10)]] instanceof Date\n && next[keys[parseInt(i.toString(), 10)]] instanceof Date;\n if (!isDate || (old[keys[parseInt(i.toString(), 10)]]\n .getTime() !== next[keys[parseInt(i.toString(), 10)]].getTime())) {\n isEqual = false;\n break;\n }\n }\n }\n return isEqual;\n };\n ContentRender.prototype.getBatchEditedRecords = function (primaryKey, rows) {\n var keys = {};\n var changes = this.parent.getBatchChanges();\n var changedRecords = [];\n var addedRecords = [];\n if (Object.keys(changes).length) {\n changedRecords = changes.changedRecords;\n addedRecords = changes.addedRecords;\n }\n var args = { cancel: false };\n this.parent.notify(events.immutableBatchCancel, { rows: rows, args: args });\n if (addedRecords.length) {\n if (this.parent.editSettings.newRowPosition === 'Bottom') {\n rows.splice(rows.length - 1, addedRecords.length);\n }\n else {\n if (!args.cancel) {\n rows.splice(0, addedRecords.length);\n }\n }\n }\n for (var i = 0; i < changedRecords.length; i++) {\n keys[changedRecords[parseInt(i.toString(), 10)][\"\" + primaryKey]] = i;\n }\n return keys;\n };\n ContentRender.prototype.refreshImmutableContent = function (index, tr, row) {\n row.isAltRow = this.parent.enableAltRow ? index % 2 !== 0 : false;\n if (row.isAltRow) {\n tr.classList.add('e-altrow');\n }\n else {\n tr.classList.remove('e-altrow');\n }\n row.index = index;\n row.edit = undefined;\n row.isDirty = false;\n tr.setAttribute(literals.dataRowIndex, index.toString());\n tr.setAttribute(literals.ariaRowIndex, (index + 1).toString());\n this.updateCellIndex(tr, index);\n };\n ContentRender.prototype.updateCellIndex = function (rowEle, index) {\n for (var i = 0; i < rowEle.cells.length; i++) {\n rowEle.cells[parseInt(i.toString(), 10)].setAttribute('index', index.toString());\n }\n };\n return ContentRender;\n}());\nexport { ContentRender };\n","import { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, closest as getClosest, remove } from '@syncfusion/ej2-base';\nimport { classList } from '@syncfusion/ej2-base';\nimport { CellType } from '../base/enum';\nimport { RowRenderer } from './row-renderer';\nimport { Cell } from '../models/cell';\nimport { Row } from '../models/row';\nimport * as events from '../base/constant';\nimport { Draggable, Droppable } from '@syncfusion/ej2-base';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { parentsUntil, wrap, measureColumnDepth, appendChildren, addFixedColumnBorder } from '../base/util';\nimport * as literals from '../base/string-literals';\n// eslint-disable-next-line valid-jsdoc\n/**\n * Content module is used to render grid content\n *\n * @hidden\n */\nvar HeaderRender = /** @class */ (function () {\n /**\n * Constructor for header renderer module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {ServiceLocator} serviceLocator - specifies the serviceLocator\n */\n function HeaderRender(parent, serviceLocator) {\n var _this = this;\n this.frzIdx = 0;\n this.notfrzIdx = 0;\n this.isFirstCol = false;\n this.isReplaceDragEle = true;\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n this.helper = function (e) {\n var gObj = _this.parent;\n var target = _this.draggable.currentStateTarget;\n var parentEle = parentsUntil(target, 'e-headercell');\n if (!(gObj.allowReordering || gObj.allowGrouping) || (!isNullOrUndefined(parentEle)\n && parentEle.getElementsByClassName('e-checkselectall').length > 0)) {\n return false;\n }\n var visualElement = _this.parent.createElement('div', { className: 'e-cloneproperties e-dragclone e-headerclone' });\n var element = target.classList.contains('e-headercell') ? target : parentEle;\n if (!element || (!gObj.allowReordering && element.classList.contains('e-stackedheadercell'))) {\n return false;\n }\n var height = element.offsetHeight;\n var headercelldiv = element.querySelector('.e-headercelldiv') || element.querySelector('.e-stackedheadercelldiv');\n var col;\n if (headercelldiv) {\n if (element.querySelector('.e-stackedheadercelldiv')) {\n col = gObj.getStackedHeaderColumnByHeaderText(headercelldiv.innerText.trim(), gObj.columns);\n }\n else {\n col = gObj.getColumnByUid(headercelldiv.getAttribute('e-mappinguid'));\n }\n _this.column = col;\n if (_this.column.lockColumn) {\n return false;\n }\n visualElement.setAttribute('e-mappinguid', _this.column.uid);\n }\n if (col && !isNullOrUndefined(col.headerTemplate)) {\n if (!isNullOrUndefined(col.headerTemplate)) {\n var colIndex = gObj.getColumnIndexByField(col.field);\n var result = col.getHeaderTemplate()(extend({ 'index': colIndex }, col), gObj, 'headerTemplate');\n var isReactCompiler = gObj.isReact && typeof (col.headerTemplate) !== 'string';\n var isReactChild = gObj.parentDetails && gObj.parentDetails.parentInstObj &&\n gObj.parentDetails.parentInstObj.isReact;\n if (isReactCompiler || isReactChild) {\n gObj.renderTemplates();\n }\n appendChildren(visualElement, result);\n }\n else {\n visualElement.innerHTML = col.headerTemplate;\n }\n if (!isNullOrUndefined(visualElement.firstChild) && visualElement.firstChild.nodeType === 1) {\n visualElement.firstChild.style.pointerEvents = 'none';\n }\n }\n else {\n visualElement.innerHTML = headercelldiv ?\n col.headerText : element.firstElementChild.innerHTML;\n }\n visualElement.style.width = element.offsetWidth + 'px';\n visualElement.style.height = element.offsetHeight + 'px';\n visualElement.style.lineHeight = (height - 6).toString() + 'px';\n gObj.element.appendChild(visualElement);\n return visualElement;\n };\n this.dragStart = function (e) {\n var gObj = _this.parent;\n gObj.element.querySelector('.e-gridpopup').style.display = 'none';\n gObj.notify(events.columnDragStart, { target: _this.draggable.currentStateTarget, column: _this.column, event: e.event });\n };\n this.drag = function (e) {\n var gObj = _this.parent;\n var target = e.target;\n if (target) {\n var closest = getClosest(target, '.e-grid');\n var cloneElement = _this.parent.element.querySelector('.e-cloneproperties');\n if (!closest || closest.getAttribute('id') !== gObj.element.getAttribute('id')) {\n classList(cloneElement, ['e-notallowedcur'], ['e-defaultcur']);\n if (gObj.allowReordering) {\n gObj.element.querySelector('.e-reorderuparrow').style.display = 'none';\n gObj.element.querySelector('.e-reorderdownarrow').style.display = 'none';\n }\n if (!gObj.groupSettings.allowReordering) {\n return;\n }\n }\n gObj.notify(events.columnDrag, { target: e.target, column: _this.column, event: e.event });\n }\n };\n this.dragStop = function (e) {\n var gObj = _this.parent;\n var cancel;\n gObj.element.querySelector('.e-gridpopup').style.display = 'none';\n if ((!parentsUntil(e.target, 'e-headercell') && !parentsUntil(e.target, 'e-groupdroparea')) ||\n (!gObj.allowReordering && parentsUntil(e.target, 'e-headercell')) ||\n (!e.helper.getAttribute('e-mappinguid') && parentsUntil(e.target, 'e-groupdroparea'))) {\n remove(e.helper);\n cancel = true;\n }\n gObj.notify(events.columnDragStop, { target: e.target, event: e.event, column: _this.column, cancel: cancel });\n };\n this.drop = function (e) {\n var gObj = _this.parent;\n var uid = e.droppedElement.getAttribute('e-mappinguid');\n var closest = getClosest(e.target, '.e-grid');\n remove(e.droppedElement);\n if (closest && closest.getAttribute('id') !== gObj.element.getAttribute('id') ||\n !(gObj.allowReordering || gObj.allowGrouping)) {\n return;\n }\n gObj.notify(events.headerDrop, { target: e.target, uid: uid, droppedElement: e.droppedElement });\n };\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n this.ariaService = this.serviceLocator.getService('ariaService');\n this.widthService = this.serviceLocator.getService('widthService');\n if (this.parent.isDestroyed) {\n return;\n }\n if (!this.parent.enableColumnVirtualization) {\n this.parent.on(events.columnVisibilityChanged, this.setVisible, this);\n }\n this.parent.on(events.columnPositionChanged, this.colPosRefresh, this);\n this.parent.on(events.initialEnd, this.renderCustomToolbar, this);\n if (this.parent.rowRenderingMode === 'Vertical') {\n this.parent.on(events.uiUpdate, this.updateCustomResponsiveToolbar, this);\n }\n }\n /**\n * The function is used to render grid header div\n *\n * @returns {void}\n */\n HeaderRender.prototype.renderPanel = function () {\n var div = this.parent.element.querySelector('.' + literals.gridHeader);\n var isRendered = (div != null);\n div = isRendered ? div : this.parent.createElement('div', { className: 'e-gridheader' });\n var innerDiv = isRendered ? div.querySelector('.' + literals.headerContent) :\n this.parent.createElement('div', { className: literals.headerContent });\n this.toggleStackClass(div);\n div.appendChild(innerDiv);\n this.setPanel(div);\n if (!isRendered) {\n this.parent.element.appendChild(div);\n }\n };\n /**\n * The function is used to render grid header div\n *\n * @returns {void}\n */\n HeaderRender.prototype.renderTable = function () {\n var headerDiv = this.getPanel();\n headerDiv.appendChild(this.createHeaderTable());\n this.setTable(headerDiv.querySelector('.' + literals.table));\n this.initializeHeaderDrag();\n this.initializeHeaderDrop();\n this.parent.notify(events.headerRefreshed, { rows: this.rows });\n };\n /**\n * Get the header content div element of grid\n *\n * @returns {Element} returns the element\n */\n HeaderRender.prototype.getPanel = function () {\n return this.headerPanel;\n };\n /**\n * Set the header content div element of grid\n *\n * @param {Element} panel - specifies the panel element\n * @returns {void}\n */\n HeaderRender.prototype.setPanel = function (panel) {\n this.headerPanel = panel;\n };\n /**\n * Get the header table element of grid\n *\n * @returns {Element} returns the element\n */\n HeaderRender.prototype.getTable = function () {\n return this.headerTable;\n };\n /**\n * Set the header table element of grid\n *\n * @param {Element} table - specifies the table element\n * @returns {void}\n */\n HeaderRender.prototype.setTable = function (table) {\n this.headerTable = table;\n };\n /**\n * Get the header colgroup element\n *\n * @returns {Element} returns the element\n */\n HeaderRender.prototype.getColGroup = function () {\n return this.colgroup;\n };\n /**\n * Set the header colgroup element\n *\n * @param {Element} colGroup - specifies the colgroup\n * @returns {Element} returns the element\n */\n HeaderRender.prototype.setColGroup = function (colGroup) {\n return this.colgroup = colGroup;\n };\n /**\n * Get the header row element collection.\n *\n * @returns {Element[]} returns the element\n */\n HeaderRender.prototype.getRows = function () {\n var table = this.getTable();\n return table.tHead.rows;\n };\n /**\n * The function is used to create header table elements\n *\n * @returns {Element} returns the element\n * @hidden\n */\n HeaderRender.prototype.createHeaderTable = function () {\n var table = this.createTable();\n var innerDiv = this.getPanel().querySelector('.' + literals.headerContent);\n innerDiv.appendChild(table);\n return innerDiv;\n };\n /**\n * The function is used to create header table elements\n *\n * @param {Element} tableEle - specifies the table Element\n * @param {freezeTable} tableName - specifies the table name\n * @returns {Element} returns the element\n * @hidden\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n HeaderRender.prototype.createHeader = function (tableEle, tableName) {\n if (tableEle === void 0) { tableEle = null; }\n var gObj = this.parent;\n if (this.getTable()) {\n remove(this.getTable());\n }\n var table = this.parent.createElement('table', { className: literals.table, attrs: { cellspacing: '0.25px', role: 'presentation' } });\n var findHeaderRow = this.createHeaderContent(tableName);\n var thead = findHeaderRow.thead;\n var tbody = this.parent.createElement(literals.tbody, { className: this.parent.frozenRows ||\n ((this.parent.enableVirtualization || this.parent.enableInfiniteScrolling) && this.parent.editSettings.showAddNewRow) ? '' :\n 'e-hide', attrs: { role: 'rowgroup' } });\n this.caption = this.parent.createElement('caption', { innerHTML: this.parent.element.id + '_header_table', className: 'e-hide' });\n var colGroup = this.parent.createElement(literals.colGroup);\n var rowBody = this.parent.createElement('tr', { attrs: { role: 'row' }, className: (this.parent.enableVirtualization ||\n this.parent.enableInfiniteScrolling) && this.parent.editSettings.showAddNewRow ? 'e-hide' : '' });\n var bodyCell;\n var rows = this.rows = findHeaderRow.rows;\n for (var i = 0, len = rows.length; i < len; i++) {\n for (var j = 0, len_1 = rows[parseInt(i.toString(), 10)].cells.length; j < len_1; j++) {\n bodyCell = this.parent.createElement('td');\n rowBody.appendChild(bodyCell);\n }\n }\n if (gObj.allowFiltering || gObj.allowSorting || gObj.allowGrouping) {\n table.classList.add('e-sortfilter');\n }\n this.updateColGroup(colGroup);\n tbody.appendChild(rowBody);\n table.appendChild(this.setColGroup(colGroup));\n table.appendChild(thead);\n table.appendChild(tbody);\n table.appendChild(this.caption);\n return table;\n };\n /**\n * @param {Element} tableEle - specifies the column\n * @returns {Element} returns the element\n * @hidden\n */\n HeaderRender.prototype.createTable = function (tableEle) {\n if (tableEle === void 0) { tableEle = null; }\n return this.createHeader(tableEle);\n };\n HeaderRender.prototype.createHeaderContent = function (tableName) {\n var gObj = this.parent;\n var columns = gObj.getColumns();\n var thead = this.parent.createElement('thead', { attrs: { 'role': 'rowgroup' } });\n var colHeader = this.parent.createElement('tr', { className: 'e-columnheader', attrs: { role: 'row' } });\n var rowRenderer = new RowRenderer(this.serviceLocator, CellType.Header, gObj);\n rowRenderer.element = colHeader;\n var rows = [];\n var headerRow;\n this.colDepth = measureColumnDepth(gObj.columns);\n for (var i = 0, len = this.colDepth; i < len; i++) {\n rows[parseInt(i.toString(), 10)] = this.generateRow(i);\n rows[parseInt(i.toString(), 10)].cells = [];\n }\n rows = this.ensureColumns(rows);\n rows = this.getHeaderCells(rows, tableName);\n if (gObj.isRowDragable() && this.parent.getFrozenMode() === 'Right') {\n for (var i = 0, len = rows.length; i < len; i++) {\n rows[parseInt(i.toString(), 10)].cells.push(this.generateCell({}, CellType.RowDragHIcon));\n }\n }\n for (var i = 0, len = this.colDepth; i < len; i++) {\n headerRow = rowRenderer.render(rows[parseInt(i.toString(), 10)], columns);\n if (this.parent.rowHeight && headerRow.querySelector('.e-headercell')) {\n headerRow.style.height = this.parent.rowHeight + 'px';\n }\n addFixedColumnBorder(headerRow);\n thead.appendChild(headerRow);\n }\n var findHeaderRow = {\n thead: thead,\n rows: rows\n };\n return findHeaderRow;\n };\n HeaderRender.prototype.updateColGroup = function (colGroup) {\n var cols = this.parent.getColumns();\n var col;\n var indexes = this.parent.getColumnIndexesInView();\n colGroup.id = this.parent.element.id + literals.colGroup;\n if (this.parent.allowGrouping) {\n for (var i = 0, len = this.parent.groupSettings.columns.length; i < len; i++) {\n if (this.parent.enableColumnVirtualization && indexes.indexOf(i) === -1) {\n continue;\n }\n col = this.parent.createElement('col', { className: 'e-group-intent' });\n colGroup.appendChild(col);\n }\n }\n if (this.parent.detailTemplate || this.parent.childGrid) {\n col = this.parent.createElement('col', { className: 'e-detail-intent' });\n colGroup.appendChild(col);\n }\n if (this.parent.isRowDragable() && this.parent.getFrozenMode() !== 'Right') {\n col = this.parent.createElement('col', { className: 'e-drag-intent' });\n colGroup.appendChild(col);\n }\n for (var i = 0, len = cols.length; i < len; i++) {\n col = this.parent.createElement('col');\n if (cols[parseInt(i.toString(), 10)].visible === false) {\n setStyleAttribute(col, { 'display': 'none' });\n }\n colGroup.appendChild(col);\n }\n if (this.parent.isRowDragable() && this.parent.getFrozenMode() === 'Right') {\n col = this.parent.createElement('col', { className: 'e-drag-intent' });\n colGroup.appendChild(col);\n }\n return colGroup;\n };\n HeaderRender.prototype.ensureColumns = function (rows) {\n //TODO: generate dummy column for group, detail, stacked row here; ensureColumns here\n var gObj = this.parent;\n var indexes = this.parent.getColumnIndexesInView();\n for (var i = 0, len = rows.length; i < len; i++) {\n if (gObj.allowGrouping) {\n for (var c = 0, len_2 = gObj.groupSettings.columns.length; c < len_2; c++) {\n if (this.parent.enableColumnVirtualization && indexes.indexOf(c) === -1) {\n continue;\n }\n rows[parseInt(i.toString(), 10)].cells.push(this.generateCell({}, CellType.HeaderIndent));\n }\n }\n if (gObj.detailTemplate || gObj.childGrid) {\n var args = {};\n this.parent.notify(events.detailIndentCellInfo, args);\n rows[parseInt(i.toString(), 10)].cells.push(this.generateCell(args, CellType.DetailHeader));\n }\n if (gObj.isRowDragable() && this.parent.getFrozenMode() !== 'Right') {\n rows[parseInt(i.toString(), 10)].cells.push(this.generateCell({}, CellType.RowDragHIcon));\n }\n }\n return rows;\n };\n HeaderRender.prototype.getHeaderCells = function (rows, tableName) {\n var thead = this.parent.getHeaderTable() && this.parent.getHeaderTable().querySelector('thead');\n var cols = this.parent.enableColumnVirtualization ?\n this.parent.getColumns(this.parent.enablePersistence) : this.parent.columns;\n this.frzIdx = 0;\n this.notfrzIdx = 0;\n if (this.parent.lockcolPositionCount) {\n for (var i = 0; i < cols.length; i++) {\n this.lockColsRendered = false;\n rows = this.appendCells(cols[parseInt(i.toString(), 10)], rows, 0, i === 0, false, i === (cols.length - 1), thead, tableName, false);\n }\n }\n for (var i = 0, len = cols.length; i < len; i++) {\n this.notfrzIdx = 0;\n this.lockColsRendered = true;\n rows = this.appendCells(cols[parseInt(i.toString(), 10)], rows, 0, i === 0, false, i === (len - 1), thead, tableName, false);\n }\n return rows;\n };\n HeaderRender.prototype.appendCells = function (cols, rows, index, isFirstObj, isFirstCol, isLastCol, isMovable, tableName, isStackLastCol) {\n var lastCol = isLastCol ? isStackLastCol ? 'e-laststackcell' : 'e-lastcell' : '';\n var isLockColumn = !this.parent.lockcolPositionCount\n || (cols.lockColumn && !this.lockColsRendered) || (!cols.lockColumn && this.lockColsRendered);\n if (!cols.columns) {\n if (isLockColumn) {\n rows[parseInt(index.toString(), 10)].cells.push(this.generateCell(cols, CellType.Header, this.colDepth - index, (isFirstObj ? '' : (isFirstCol ? 'e-firstcell' : '')) + lastCol, index, this.parent.getColumnIndexByUid(cols.uid)));\n }\n if (this.parent.lockcolPositionCount) {\n if ((this.frzIdx + this.notfrzIdx < this.parent.frozenColumns) &&\n ((cols.lockColumn && !this.lockColsRendered) || (!cols.lockColumn && this.lockColsRendered))) {\n this.frzIdx++;\n }\n else {\n this.notfrzIdx++;\n }\n }\n else {\n this.frzIdx++;\n }\n }\n else {\n this.isFirstCol = false;\n var colSpan = this.getCellCnt(cols, 0);\n if (colSpan) {\n var stackedLockColsCount = this.getStackedLockColsCount(cols, 0);\n var isStackedLockColumn = this.parent.lockcolPositionCount === 0\n || (!this.lockColsRendered && stackedLockColsCount !== 0)\n || (this.lockColsRendered && (colSpan - stackedLockColsCount) !== 0);\n if (isStackedLockColumn) {\n rows[parseInt(index.toString(), 10)].cells.push(new Cell({\n cellType: CellType.StackedHeader, column: cols,\n colSpan: this.getColSpan(colSpan, stackedLockColsCount),\n className: isFirstObj ? '' : (isFirstCol ? 'e-firstcell' : '')\n }));\n }\n }\n if (this.parent.lockcolPositionCount && !this.lockColsRendered) {\n for (var i = 0; i < cols.columns.length; i++) {\n rows = this.appendCells(cols.columns[parseInt(i.toString(), 10)], rows, index + 1, isFirstObj, i === 0, i === (cols.columns.length - 1) && isLastCol, isMovable, tableName, false);\n }\n }\n if (this.lockColsRendered) {\n for (var i = 0, len = cols.columns.length; i < len; i++) {\n isFirstObj = isFirstObj && i === 0;\n var isFirstCol_1 = this.isFirstCol = cols.columns[parseInt(i.toString(), 10)].visible\n && !isFirstObj;\n var isLaststackedCol = i === (len - 1) && isLastCol;\n rows = this.appendCells(cols.columns[parseInt(i.toString(), 10)], rows, index + 1, isFirstObj, isFirstCol_1 && !isLaststackedCol, isLaststackedCol, isMovable, tableName, true);\n }\n }\n }\n return rows;\n };\n HeaderRender.prototype.getStackedLockColsCount = function (col, lockColsCount) {\n if (col.columns) {\n for (var i = 0; i < col.columns.length; i++) {\n lockColsCount = this.getStackedLockColsCount(col.columns[parseInt(i.toString(), 10)], lockColsCount);\n }\n }\n else if (col.lockColumn) {\n lockColsCount++;\n }\n return lockColsCount;\n };\n HeaderRender.prototype.getColSpan = function (colSpan, stackedLockColsCount) {\n colSpan = !this.lockColsRendered ? stackedLockColsCount : colSpan - stackedLockColsCount;\n return colSpan;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n HeaderRender.prototype.generateRow = function (index) {\n return new Row({});\n };\n HeaderRender.prototype.generateCell = function (column, cellType, rowSpan, className, rowIndex, colIndex) {\n var opt = {\n 'visible': column.visible,\n 'isDataCell': false,\n 'isTemplate': !isNullOrUndefined(column.headerTemplate),\n 'rowID': '',\n 'column': column,\n 'cellType': cellType,\n 'rowSpan': rowSpan,\n 'className': className,\n 'index': rowIndex,\n 'colIndex': colIndex\n };\n if (!opt.rowSpan || opt.rowSpan < 2) {\n delete opt.rowSpan;\n }\n return new Cell(opt);\n };\n /**\n * Function to hide header table column based on visible property\n *\n * @param {Column[]} columns - specifies the column\n * @returns {void}\n */\n HeaderRender.prototype.setVisible = function (columns) {\n var gObj = this.parent;\n var displayVal;\n var idx;\n for (var c = 0, clen = columns.length; c < clen; c++) {\n var column = columns[parseInt(c.toString(), 10)];\n idx = gObj.getNormalizedColumnIndex(column.uid);\n displayVal = column.visible ? '' : 'none';\n setStyleAttribute(this.getColGroup().children[parseInt(idx.toString(), 10)], { 'display': displayVal });\n if (gObj.editSettings.showAddNewRow && gObj.element.querySelector('.e-addedrow')) {\n setStyleAttribute(gObj.element.querySelector('.e-addedrow').querySelector('colgroup').childNodes[parseInt(idx.toString(), 10)], { 'display': displayVal });\n }\n }\n this.refreshUI();\n if (this.parent.editSettings.showAddNewRow) {\n this.parent.isAddNewRow = true;\n }\n };\n HeaderRender.prototype.colPosRefresh = function () {\n this.refreshUI();\n };\n /**\n * Refresh the header of the Grid.\n *\n * @returns {void}\n */\n HeaderRender.prototype.refreshUI = function () {\n var headerDiv = this.getPanel();\n this.toggleStackClass(headerDiv);\n var table = this.freezeReorder ? this.headerPanel.querySelector('.' + literals.movableHeader).querySelector('.' + literals.table)\n : this.getTable();\n var tableName = undefined;\n if (table) {\n remove(table);\n if (this.parent.editSettings.showAddNewRow && !this.parent.isAddNewRow && table.querySelector('.e-addedrow') &&\n (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {\n (table.querySelector('.e-addedrow')).classList.add('e-addrow-removed');\n this.parent.isAddNewRow = true;\n }\n table.removeChild(table.firstChild);\n table.removeChild(table.childNodes[0]);\n var colGroup = this.parent.createElement(literals.colGroup);\n var findHeaderRow = this.createHeaderContent(tableName);\n this.rows = findHeaderRow.rows;\n table.insertBefore(findHeaderRow.thead, table.firstChild);\n this.updateColGroup(colGroup);\n table.insertBefore(this.setColGroup(colGroup), table.firstChild);\n this.appendContent(table);\n this.parent.notify(events.colGroupRefresh, {});\n this.widthService.setWidthToColumns();\n this.parent.updateDefaultCursor();\n this.initializeHeaderDrag();\n var rows = [].slice.call(headerDiv.querySelectorAll('tr.e-columnheader'));\n for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) {\n var row = rows_1[_i];\n var gCells = [].slice.call(row.getElementsByClassName('e-grouptopleftcell'));\n if (gCells.length) {\n gCells[gCells.length - 1].classList.add('e-lastgrouptopleftcell');\n }\n }\n this.parent.notify(events.headerRefreshed, { rows: this.rows });\n if (this.parent.enableColumnVirtualization && parentsUntil(table, literals.movableHeader)) {\n this.parent.notify(events.headerRefreshed, { rows: this.rows, args: { isFrozen: false, isXaxis: true } });\n }\n if (this.parent.allowTextWrap && this.parent.textWrapSettings.wrapMode === 'Header') {\n wrap(rows, true);\n }\n }\n var firstHeaderCell = this.parent.getHeaderContent().querySelector('.e-headercell:not(.e-hide)');\n if (!isNullOrUndefined(firstHeaderCell)) {\n firstHeaderCell.tabIndex = 0;\n }\n };\n HeaderRender.prototype.toggleStackClass = function (div) {\n var column = this.parent.columns;\n var stackedHdr = column.some(function (column) { return !isNullOrUndefined(column.columns); });\n if (stackedHdr) {\n div.classList.add('e-stackedheader');\n }\n else {\n div.classList.remove('e-stackedheader');\n }\n };\n HeaderRender.prototype.appendContent = function (table) {\n this.getPanel().querySelector('.' + literals.headerContent).appendChild(table);\n };\n HeaderRender.prototype.getCellCnt = function (col, cnt) {\n if (col.columns) {\n for (var i = 0, len = col.columns.length; i < len; i++) {\n cnt = this.getCellCnt(col.columns[parseInt(i.toString(), 10)], cnt);\n }\n }\n else {\n if (col.visible) {\n cnt++;\n }\n }\n return cnt;\n };\n HeaderRender.prototype.initializeHeaderDrag = function () {\n var gObj = this.parent;\n if (!(this.parent.allowReordering || (this.parent.allowGrouping && this.parent.groupSettings.showDropArea))) {\n return;\n }\n this.draggable = new Draggable(gObj.getHeaderContent(), {\n dragTarget: '.e-headercell',\n distance: 5,\n helper: this.helper,\n dragStart: this.dragStart,\n drag: this.drag,\n dragStop: this.dragStop,\n abort: '.e-rhandler',\n isReplaceDragEle: this.isReplaceDragEle\n });\n this.parent.on(events.destroy, this.droppableDestroy, this);\n };\n HeaderRender.prototype.initializeHeaderDrop = function () {\n var gObj = this.parent;\n this.droppable = new Droppable(gObj.getHeaderContent(), {\n accept: '.e-dragclone',\n drop: this.drop\n });\n this.parent.on(events.destroy, this.droppableDestroy, this);\n };\n HeaderRender.prototype.droppableDestroy = function () {\n if (this.droppable && !this.droppable.isDestroyed) {\n this.droppable.destroy();\n }\n if (this.draggable && !this.draggable.isDestroyed) {\n this.draggable.destroy();\n }\n };\n HeaderRender.prototype.renderCustomToolbar = function () {\n var _this = this;\n var gObj = this.parent;\n if (gObj.rowRenderingMode === 'Vertical' && !gObj.toolbar\n && (gObj.allowSorting || (gObj.allowFiltering && gObj.filterSettings.type !== 'FilterBar'))) {\n var div = gObj.createElement('div', { className: 'e-res-toolbar e-toolbar' });\n var toolbarItems = gObj.createElement('div', { className: 'e-toolbar-items' });\n var toolbarLeft = gObj.createElement('div', { className: 'e-toolbar-left' });\n var count = this.parent.allowFiltering && this.parent.allowSorting ? 2 : 1;\n for (var i = 0; i < count; i++) {\n var toolbarItem = gObj.createElement('div', { className: 'e-toolbar-item e-gridresponsiveicons e-icons e-tbtn-align' });\n var cls = count === 1 ? this.parent.allowSorting ? 'sort'\n : 'filter' : i === 1 ? 'sort' : 'filter';\n var button = gObj.createElement('button', { className: 'e-tbar-btn e-control e-btn e-lib e-icon-btn' });\n var span = gObj.createElement('span', { className: 'e-btn-icon e-res' + cls + '-icon e-icons' });\n button.appendChild(span);\n var btnObj = new Button({\n cssClass: this.parent.cssClass ? this.parent.cssClass : ''\n });\n btnObj.appendTo(button);\n button.onclick = function (e) {\n if (e.target.classList.contains('e-ressort-btn')\n || e.target.classList.contains('e-ressort-icon') ||\n e.target.querySelector('.e-ressort-icon')) {\n _this.parent.showResponsiveCustomSort();\n }\n else {\n _this.parent.showResponsiveCustomFilter();\n }\n };\n toolbarItem.appendChild(button);\n toolbarLeft.appendChild(toolbarItem);\n }\n toolbarItems.appendChild(toolbarLeft);\n div.appendChild(toolbarItems);\n gObj.element.insertBefore(div, this.parent.element.querySelector('.' + literals.gridHeader));\n }\n else {\n if (gObj.enableAdaptiveUI && !gObj.toolbar) {\n gObj.getContent().classList.add('e-responsive-header');\n }\n }\n };\n HeaderRender.prototype.updateCustomResponsiveToolbar = function (args) {\n var resToolbar = this.parent.element.querySelector('.e-responsive-toolbar');\n if (args.module === 'toolbar') {\n if (resToolbar) {\n remove(resToolbar);\n }\n else {\n this.renderCustomToolbar();\n }\n }\n };\n return HeaderRender;\n}());\nexport { HeaderRender };\n","import { remove, addClass } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { doesImplementInterface, setStyleAndAttributes, appendChildren, extendObjWithFn, addStickyColumnPosition } from '../base/util';\nimport { createCheckBox } from '@syncfusion/ej2-buttons';\nimport { foreignKeyData } from '../base/constant';\nimport { CellType } from '../base/enum';\nimport * as literals from '../base/string-literals';\n/**\n * CellRenderer class which responsible for building cell content.\n *\n * @hidden\n */\nvar CellRenderer = /** @class */ (function () {\n function CellRenderer(parent, locator) {\n this.localizer = locator.getService('localization');\n this.formatter = locator.getService('valueFormatter');\n this.parent = parent;\n this.element = this.parent.createElement('TD', { className: literals.rowCell, attrs: { role: 'gridcell', tabindex: '-1' } });\n this.rowChkBox = this.parent.createElement('input', { className: 'e-checkselect', attrs: { 'type': 'checkbox', 'aria-label': this.localizer.getConstant('SelectRow') } });\n }\n /**\n * Function to return the wrapper for the TD content\n *\n * @returns {string | Element} returns the string\n */\n CellRenderer.prototype.getGui = function () {\n return '';\n };\n /**\n * Function to format the cell value.\n *\n * @param {Column} column - specifies the column\n * @param {Object} value - specifies the value\n * @param {Object} data - specifies the data\n * @returns {string} returns the format\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n CellRenderer.prototype.format = function (column, value, data) {\n if (!isNullOrUndefined(column.format)) {\n if (column.type === 'number' && isNaN(parseInt(value, 10))) {\n value = null;\n }\n if (column.type === 'dateonly' && typeof value === 'string' && value) {\n var arr = value.split(/[^0-9.]/);\n value = new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, parseInt(arr[2], 10));\n }\n value = this.formatter.toView(value, column.getFormatter());\n }\n return isNullOrUndefined(value) ? '' : value.toString();\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n CellRenderer.prototype.evaluate = function (node, cell, data, attributes, fData, isEdit) {\n var _a;\n var result;\n if (cell.column.template) {\n var isReactCompiler = this.parent.isReact && typeof (cell.column.template) !== 'string' && cell.column.template.prototype && !(cell.column.template.prototype).CSPTemplate;\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n this.parent.parentDetails.parentInstObj.isReact;\n var literals_1 = ['index'];\n var dummyData = extendObjWithFn({}, data, (_a = {}, _a[foreignKeyData] = fData, _a.column = cell.column, _a));\n var templateID = this.parent.element.id + cell.column.uid;\n var str = 'isStringTemplate';\n if (isReactCompiler || isReactChild) {\n var copied = { 'index': attributes[literals_1[0]] };\n cell.column.getColumnTemplate()(extend(copied, dummyData), this.parent, 'columnTemplate', templateID, this.parent[\"\" + str], null, node);\n }\n else {\n result = cell.column.getColumnTemplate()(extend({ 'index': attributes[literals_1[0]] }, dummyData), this.parent, 'template', templateID, this.parent[\"\" + str], undefined, undefined, this.parent['root']);\n }\n if (!isReactCompiler && !isReactChild) {\n appendChildren(node, result);\n }\n this.parent.notify('template-result', { template: result });\n result = null;\n node.setAttribute('aria-label', node.innerText + this.localizer.getConstant('TemplateCell') +\n this.localizer.getConstant('ColumnHeader') + cell.column.headerText);\n return false;\n }\n return true;\n };\n /**\n * Function to invoke the custom formatter available in the column object.\n *\n * @param {Column} column - specifies the column\n * @param {Object} value - specifies the value\n * @param {Object} data - specifies the data\n * @returns {Object} returns the object\n */\n CellRenderer.prototype.invokeFormatter = function (column, value, data) {\n if (!isNullOrUndefined(column.formatter)) {\n if (doesImplementInterface(column.formatter, 'getValue')) {\n var formatter = column.formatter;\n value = new formatter().getValue(column, data);\n }\n else if (typeof column.formatter === 'function') {\n value = column.formatter(column, data);\n }\n else {\n value = column.formatter.getValue(column, data);\n }\n }\n return value;\n };\n /**\n * Function to render the cell content based on Column object.\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @param {Object} attributes - specifies the attributes\n * @param {boolean} isExpand - specifies the boolean for expand\n * @param {boolean} isEdit - specifies the boolean for edit\n * @returns {Element} returns the element\n */\n CellRenderer.prototype.render = function (cell, data, attributes, isExpand, isEdit) {\n return this.refreshCell(cell, data, attributes, isEdit);\n };\n /**\n * Function to refresh the cell content based on Column object.\n *\n * @param {Element} td - specifies the element\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @param {Object} attributes - specifies the attribute\n * @returns {void}\n */\n CellRenderer.prototype.refreshTD = function (td, cell, data, attributes) {\n var isEdit = this.parent.editSettings.mode === 'Batch' && td.classList.contains('e-editedbatchcell');\n if (this.parent.isReact) {\n var cellIndex = td.cellIndex;\n var parentRow = td.parentElement;\n remove(td);\n var newTD = this.refreshCell(cell, data, attributes, isEdit);\n this.cloneAttributes(newTD, td);\n if (parentRow.cells.length !== cellIndex - 1) {\n parentRow.insertBefore(newTD, parentRow.cells[parseInt(cellIndex.toString(), 10)]);\n }\n else {\n parentRow.appendChild(newTD);\n }\n }\n else {\n var node = this.refreshCell(cell, data, attributes, isEdit);\n td.innerHTML = '';\n var arialabelText = node.getAttribute('aria-label');\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n arialabelText ? td.setAttribute('aria-label', arialabelText) : null;\n var elements = [].slice.call(node.childNodes);\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var elem = elements_1[_i];\n td.appendChild(elem);\n }\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n CellRenderer.prototype.cloneAttributes = function (target, source) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var attrs = source.attributes;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var i = attrs.length;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var attr;\n while (i--) {\n attr = attrs[parseInt(i.toString(), 10)];\n target.setAttribute(attr.name, attr.value);\n }\n };\n CellRenderer.prototype.refreshCell = function (cell, data, attributes, isEdit) {\n var _a;\n var node = this.element.cloneNode();\n var column = cell.column;\n var fData;\n if (cell.isForeignKey) {\n fData = cell.foreignKeyData[0] || (_a = {}, _a[column.foreignKeyValue] = column.format ? null : '', _a);\n }\n //Prepare innerHtml\n var innerHtml = this.getGui();\n var value = cell.isForeignKey ? this.getValue(column.foreignKeyValue, fData, column) :\n this.getValue(column.field, data, column);\n if ((column.type === 'date' || column.type === 'datetime') && !isNullOrUndefined(value)) {\n value = new Date(value);\n }\n if (column.type === 'dateonly' && !isNullOrUndefined(value) && typeof value === 'string') {\n var arr = value.split(/[^0-9.]/);\n value = new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, parseInt(arr[2], 10));\n }\n value = this.format(column, value, data);\n innerHtml = value.toString();\n if (column.type === 'boolean' && !column.displayAsCheckBox) {\n var localeStr = (value !== 'true' && value !== 'false') ? null : value === 'true' ? 'True' : 'False';\n innerHtml = localeStr ? this.localizer.getConstant(localeStr) : innerHtml;\n }\n var fromFormatter = this.invokeFormatter(column, value, data);\n innerHtml = !isNullOrUndefined(column.formatter) ? isNullOrUndefined(fromFormatter) ? '' : fromFormatter.toString() : innerHtml;\n if (this.evaluate(node, cell, data, attributes, fData, isEdit) && column.type !== 'checkbox') {\n this.appendHtml(node, this.parent.sanitize(innerHtml), column.getDomSetter ? column.getDomSetter() : 'innerHTML');\n }\n else if (column.type === 'checkbox') {\n node.classList.add(literals.gridChkBox);\n if (this.parent.selectionSettings.persistSelection) {\n value = value === 'true';\n }\n else {\n value = false;\n }\n var checkWrap = createCheckBox(this.parent.createElement, false, { checked: value, label: ' ' });\n if (this.parent.cssClass) {\n addClass([checkWrap], [this.parent.cssClass]);\n }\n this.rowChkBox.id = 'checkbox-' + cell.rowID;\n checkWrap.insertBefore(this.rowChkBox.cloneNode(), checkWrap.firstChild);\n node.appendChild(checkWrap);\n }\n if (this.parent.checkAllRows === 'Check' && this.parent.enableVirtualization) {\n cell.isSelected = true;\n }\n this.setAttributes(node, cell, attributes);\n if (column.type === 'boolean' && column.displayAsCheckBox) {\n var checked = isNaN(parseInt(value.toString(), 10)) ? value === 'true' : parseInt(value.toString(), 10) > 0;\n var checkWrap = createCheckBox(this.parent.createElement, false, { checked: checked, label: ' ' });\n node.innerHTML = '';\n node.classList.add('e-gridchkbox-cell');\n checkWrap.classList.add('e-checkbox-disabled');\n if (this.parent.cssClass) {\n addClass([checkWrap], [this.parent.cssClass]);\n }\n node.appendChild(checkWrap);\n }\n if (node.classList.contains('e-summarycell') && !data.key) {\n var uid = node.getAttribute('e-mappinguid');\n column = this.parent.getColumnByUid(uid);\n node.setAttribute('aria-label', innerHtml + this.localizer.getConstant('ColumnHeader') + cell.column.headerText);\n }\n if (this.parent.isFrozenGrid() && (!data || (data && !data.key))) {\n addStickyColumnPosition(this.parent, column, node);\n }\n return node;\n };\n /**\n * Function to specifies how the result content to be placed in the cell.\n *\n * @param {Element} node - specifies the node\n * @param {string|Element} innerHtml - specifies the innerHTML\n * @param {string} property - specifies the element\n * @returns {Element} returns the element\n */\n CellRenderer.prototype.appendHtml = function (node, innerHtml, property) {\n if (property === void 0) { property = 'innerHTML'; }\n node[\"\" + property] = innerHtml;\n return node;\n };\n /**\n * @param {HTMLElement} node - specifies the node\n * @param {cell} cell - specifies the cell\n * @param {Object} attributes - specifies the attributes\n * @returns {void}\n * @hidden\n */\n CellRenderer.prototype.setAttributes = function (node, cell, attributes) {\n var column = cell.column;\n this.buildAttributeFromCell(node, cell, column.type === 'checkbox');\n setStyleAndAttributes(node, attributes);\n setStyleAndAttributes(node, cell.attributes);\n if (column.customAttributes) {\n setStyleAndAttributes(node, column.customAttributes);\n }\n if (this.parent.rowRenderingMode === 'Vertical') {\n setStyleAndAttributes(node, { 'data-cell': column.headerText });\n }\n if (column.textAlign) {\n node.style.textAlign = column.textAlign;\n }\n if (column.clipMode === 'Clip' || (!column.clipMode && this.parent.clipMode === 'Clip')) {\n node.classList.add('e-gridclip');\n }\n else if (column.clipMode === 'EllipsisWithTooltip' || (!column.clipMode && this.parent.clipMode === 'EllipsisWithTooltip')\n && !(this.parent.allowTextWrap && (this.parent.textWrapSettings.wrapMode === 'Content'\n || this.parent.textWrapSettings.wrapMode === 'Both'))) {\n if (column.type !== 'checkbox') {\n node.classList.add('e-ellipsistooltip');\n }\n }\n };\n CellRenderer.prototype.buildAttributeFromCell = function (node, cell, isCheckBoxType) {\n var attr = {};\n var prop = { 'colindex': literals.dataColIndex };\n var classes = [];\n if (cell.colSpan) {\n attr.colSpan = cell.colSpan;\n }\n if (cell.rowSpan) {\n attr.rowSpan = cell.rowSpan;\n }\n if (cell.isTemplate) {\n classes.push('e-templatecell');\n }\n if (cell.isSelected) {\n classes.push.apply(classes, ['e-selectionbackground', 'e-active']);\n if (isCheckBoxType) {\n node.querySelector('.e-frame').classList.add('e-check');\n }\n }\n if (cell.isColumnSelected) {\n classes.push.apply(classes, ['e-columnselection']);\n }\n if (cell.cellType === CellType.Header) {\n attr[prop.colindex] = cell.colIndex;\n attr[literals.ariaColIndex] = cell.colIndex + 1;\n }\n else if (!isNullOrUndefined(cell.index)) {\n attr[prop.colindex] = cell.index;\n attr[literals.ariaColIndex] = cell.index + 1;\n }\n if (!cell.visible) {\n classes.push('e-hide');\n }\n attr.class = classes;\n setStyleAndAttributes(node, attr);\n };\n CellRenderer.prototype.getValue = function (field, data, column) {\n return column.valueAccessor(field, data, column);\n };\n return CellRenderer;\n}());\nexport { CellRenderer };\n","/**\n * AriaService\n *\n * @hidden\n */\nvar AriaService = /** @class */ (function () {\n function AriaService() {\n }\n AriaService.prototype.setOptions = function (target, options) {\n var props = Object.keys(options);\n for (var i = 0; i < props.length; i++) {\n setStateAndProperties(target, config[props[parseInt(i.toString(), 10)]], options[props[parseInt(i.toString(), 10)]]);\n }\n };\n AriaService.prototype.setExpand = function (target, expand) {\n setStateAndProperties(target, config.expand, expand);\n };\n AriaService.prototype.setSort = function (target, direction) {\n setStateAndProperties(target, config.sort, direction, typeof direction === 'boolean');\n };\n AriaService.prototype.setBusy = function (target, isBusy) {\n setStateAndProperties(target, config.busy, isBusy);\n setStateAndProperties(target, config.invalid, null, true);\n };\n AriaService.prototype.setGrabbed = function (target, isGrabbed, remove) {\n setStateAndProperties(target, config.grabbed, isGrabbed, remove);\n };\n AriaService.prototype.setDropTarget = function (target, isTarget) {\n setStateAndProperties(target, config.dropeffect, 'copy', !isTarget);\n };\n return AriaService;\n}());\nexport { AriaService };\n/**\n * @param {HTMLElement} target - specifies the target\n * @param {string} attribute - specifies the attribute\n * @param {ValueType} value - specifies the value\n * @param {boolean} remove - specifies the boolean for remove\n * @returns {void}\n * @hidden\n */\nfunction setStateAndProperties(target, attribute, value, remove) {\n if (remove && target) {\n target.removeAttribute(attribute);\n return;\n }\n if (target) {\n target.setAttribute(attribute, value);\n }\n}\nvar config = {\n expand: 'aria-expanded',\n role: 'role',\n datarole: 'data-role',\n selected: 'aria-selected',\n multiselectable: 'aria-multiselectable',\n sort: 'aria-sort',\n busy: 'aria-busy',\n invalid: 'aria-invalid',\n grabbed: 'aria-grabbed',\n dropeffect: 'aria-dropeffect',\n haspopup: 'aria-haspopup',\n level: 'aria-level',\n colcount: 'aria-colcount',\n rowcount: 'aria-rowcount'\n};\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { isNullOrUndefined, extend, addClass } from '@syncfusion/ej2-base';\nimport { attributes } from '@syncfusion/ej2-base';\nimport { setStyleAndAttributes, appendChildren, addStickyColumnPosition } from '../base/util';\nimport { CellRenderer } from './cell-renderer';\nimport { AriaService } from '../services/aria-service';\nimport { createCheckBox } from '@syncfusion/ej2-buttons';\nimport { headerCellInfo } from '../base/constant';\n/**\n * HeaderCellRenderer class which responsible for building header cell content.\n *\n * @hidden\n */\nvar HeaderCellRenderer = /** @class */ (function (_super) {\n __extends(HeaderCellRenderer, _super);\n function HeaderCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent\n .createElement('TH', { className: 'e-headercell', attrs: { tabindex: '-1', role: 'columnheader' } });\n _this.ariaService = new AriaService();\n _this.hTxtEle = _this.parent.createElement('span', { className: 'e-headertext' });\n _this.sortEle = _this.parent.createElement('div', { className: 'e-sortfilterdiv e-icons', attrs: { 'aria-hidden': 'true' } });\n _this.gui = _this.parent.createElement('div');\n _this.chkAllBox = _this.parent.createElement('input', { className: 'e-checkselectall', attrs: { 'type': 'checkbox', 'aria-label': _this.localizer.getConstant('SelectAllCheckbox') } });\n return _this;\n }\n /**\n * Function to return the wrapper for the TH content.\n *\n * @returns {string | Element} returns the element\n */\n HeaderCellRenderer.prototype.getGui = function () {\n return this.gui.cloneNode();\n };\n /**\n * Function to render the cell content based on Column object.\n *\n * @param {Cell} cell - specifies the column\n * @param {Object} data - specifies the data\n * @param {object} attributes - specifies the aattributes\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n HeaderCellRenderer.prototype.render = function (cell, data, attributes) {\n var node = this.element.cloneNode();\n var fltrMenuEle = this.parent.createElement('div', { className: 'e-filtermenudiv e-icons e-icon-filter', attrs: { 'aria-hidden': 'true' } });\n return this.prepareHeader(cell, node, fltrMenuEle);\n };\n /**\n * Function to refresh the cell content based on Column object.\n *\n * @param {Cell} cell - specifies the cell\n * @param {Element} node - specifies the noe\n * @returns {Element} returns the element\n */\n HeaderCellRenderer.prototype.refresh = function (cell, node) {\n this.clean(node);\n var fltrMenuEle = this.parent.createElement('div', { className: 'e-filtermenudiv e-icons e-icon-filter', attrs: { 'aria-hidden': 'true' } });\n return this.prepareHeader(cell, node, fltrMenuEle);\n };\n HeaderCellRenderer.prototype.clean = function (node) {\n node.innerHTML = '';\n };\n /* tslint:disable-next-line:max-func-body-length */\n HeaderCellRenderer.prototype.prepareHeader = function (cell, node, fltrMenuEle) {\n var column = cell.column;\n var ariaAttr = {};\n var elementDesc = '';\n //Prepare innerHtml\n var innerDIV = this.getGui();\n var hValueAccer;\n attributes(innerDIV, {\n 'e-mappinguid': column.uid,\n 'class': 'e-headercelldiv'\n });\n if (!isNullOrUndefined(column.headerValueAccessor)) {\n hValueAccer = this.getValue(column.headerText, column);\n }\n if (this.parent.allowSorting && column.allowSorting && !isNullOrUndefined(column.field)) {\n node.classList.add('e-sort-icon');\n }\n if (column.type !== 'checkbox') {\n var value = column.headerText;\n if (!isNullOrUndefined(hValueAccer)) {\n value = hValueAccer;\n }\n var headerText = this.hTxtEle.cloneNode();\n headerText[column.getDomSetter()] = this.parent.sanitize(value);\n innerDIV.appendChild(headerText);\n }\n else {\n column.editType = 'booleanedit';\n var checkAllWrap = createCheckBox(this.parent.createElement, false, { checked: false, label: ' ' });\n this.chkAllBox.id = 'checkbox-' + column.uid;\n checkAllWrap.insertBefore(this.chkAllBox.cloneNode(), checkAllWrap.firstChild);\n if (this.parent.cssClass) {\n addClass([checkAllWrap], [this.parent.cssClass]);\n }\n innerDIV.appendChild(checkAllWrap);\n innerDIV.classList.add('e-headerchkcelldiv');\n }\n this.buildAttributeFromCell(node, cell);\n this.appendHtml(node, innerDIV);\n node.appendChild(this.sortEle.cloneNode());\n if ((this.parent.allowFiltering && this.parent.filterSettings.type !== 'FilterBar') &&\n (column.allowFiltering && !isNullOrUndefined(column.field)) &&\n !(this.parent.showColumnMenu && column.showColumnMenu)) {\n attributes(fltrMenuEle, {\n 'e-mappinguid': 'e-flmenu-' + column.uid\n });\n elementDesc = elementDesc.length ? elementDesc + '. ' + this.localizer.getConstant('FilterDescription') : this.localizer.getConstant('FilterDescription');\n node.classList.add('e-fltr-icon');\n var matchFlColumns = [];\n if (this.parent.filterSettings.columns.length && this.parent.filterSettings.columns.length !== matchFlColumns.length) {\n var foreignColumn = this.parent.getForeignKeyColumns();\n for (var index = 0; index < this.parent.columns.length; index++) {\n for (var count = 0; count < this.parent.filterSettings.columns.length; count++) {\n if (this.parent.filterSettings.columns[parseInt(count.toString(), 10)].field === column.field\n || (foreignColumn.length\n && column.foreignKeyValue === this.parent.filterSettings.columns[parseInt(count.toString(), 10)].field)) {\n fltrMenuEle.classList.add('e-filtered');\n matchFlColumns.push(column.field);\n break;\n }\n }\n }\n }\n node.appendChild(fltrMenuEle.cloneNode());\n }\n if (cell.className) {\n node.classList.add(cell.className);\n }\n if (column.customAttributes) {\n setStyleAndAttributes(node, column.customAttributes);\n }\n if (this.parent.allowSorting && column.allowSorting) {\n ariaAttr.sort = 'none';\n elementDesc = elementDesc.length ? elementDesc + '. ' + this.localizer.getConstant('SortDescription') : this.localizer.getConstant('SortDescription');\n }\n if ((this.parent.allowGrouping && column.allowGrouping) || this.parent.allowReordering && column.allowReordering) {\n ariaAttr.grabbed = false;\n elementDesc = elementDesc.length ? elementDesc + '. ' + this.localizer.getConstant('GroupDescription') : this.localizer.getConstant('GroupDescription');\n }\n if (this.parent.showColumnMenu && column.type !== 'checkbox' && !column.template) {\n elementDesc = elementDesc.length ? elementDesc + '. ' + this.localizer.getConstant('ColumnMenuDescription') : this.localizer.getConstant('ColumnMenuDescription');\n }\n node = this.extendPrepareHeader(column, node);\n var result;\n var gridObj = this.parent;\n var colIndex = gridObj.getColumnIndexByField(column.field);\n if (!isNullOrUndefined(column.headerTemplate)) {\n //need to pass the template id for blazor headertemplate\n var headerTempID = gridObj.element.id + column.uid + 'headerTemplate';\n var str = 'isStringTemplate';\n var col = column;\n var isReactCompiler = this.parent.isReact && typeof (column.headerTemplate) !== 'string';\n var isReactChild_1 = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n this.parent.parentDetails.parentInstObj.isReact;\n if (isReactCompiler || isReactChild_1) {\n var copied = { 'index': colIndex };\n node.firstElementChild.innerHTML = '';\n column.getHeaderTemplate()(extend(copied, col), gridObj, 'headerTemplate', headerTempID, this.parent[\"\" + str], null, node.firstElementChild);\n this.parent.renderTemplates();\n }\n else {\n result = column.getHeaderTemplate()(extend({ 'index': colIndex }, col), gridObj, 'headerTemplate', headerTempID, this.parent[\"\" + str], undefined, undefined, this.parent['root']);\n node.firstElementChild.innerHTML = '';\n appendChildren(node.firstElementChild, result);\n }\n }\n this.ariaService.setOptions(node, ariaAttr);\n if (!isNullOrUndefined(column.headerTextAlign) || !isNullOrUndefined(column.textAlign)) {\n var alignment = column.headerTextAlign || column.textAlign;\n innerDIV.style.textAlign = alignment;\n if (alignment === 'Right' || alignment === 'Left') {\n node.classList.add(alignment === 'Right' ? 'e-rightalign' : 'e-leftalign');\n }\n else if (alignment === 'Center') {\n node.classList.add('e-centeralign');\n }\n }\n if (column.clipMode === 'Clip' || (!column.clipMode && this.parent.clipMode === 'Clip')) {\n node.classList.add('e-gridclip');\n }\n else if ((column.clipMode === 'EllipsisWithTooltip' || (!column.clipMode && this.parent.clipMode === 'EllipsisWithTooltip'))\n && !(gridObj.allowTextWrap && (gridObj.textWrapSettings.wrapMode === 'Header'\n || gridObj.textWrapSettings.wrapMode === 'Both'))) {\n if (column.type !== 'checkbox') {\n node.classList.add('e-ellipsistooltip');\n }\n }\n if (elementDesc) {\n var titleElem = (this.parent.createElement('span', { id: 'headerTitle-' + column.uid, innerHTML: elementDesc, attrs: { style: 'display:none' } }));\n node.appendChild(titleElem);\n node.setAttribute('aria-describedby', titleElem.id);\n }\n node.setAttribute('aria-rowspan', (!isNullOrUndefined(cell.rowSpan) ? cell.rowSpan : 1).toString());\n node.setAttribute('aria-colspan', '1');\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n this.parent.parentDetails.parentInstObj.isReact;\n if (((this.parent.isReact && this.parent.requireTemplateRef)\n || (isReactChild && this.parent.parentDetails.parentInstObj.requireTemplateRef))\n && !isNullOrUndefined(column.headerTemplate)) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var thisRef_1 = this;\n thisRef_1.parent.renderTemplates(function () {\n thisRef_1.parent.trigger(headerCellInfo, { cell: cell, node: node });\n });\n }\n else {\n this.parent.trigger(headerCellInfo, { cell: cell, node: node });\n }\n if (this.parent.isFrozenGrid()) {\n addStickyColumnPosition(this.parent, column, node);\n }\n return node;\n };\n HeaderCellRenderer.prototype.getValue = function (field, column) {\n return column.headerValueAccessor(field, column);\n };\n HeaderCellRenderer.prototype.extendPrepareHeader = function (column, node) {\n if (this.parent.showColumnMenu && column.showColumnMenu && !isNullOrUndefined(column.field)) {\n var element = (this.parent.createElement('div', { className: 'e-icons e-columnmenu', attrs: { 'aria-hidden': 'true' } }));\n var matchFilteredColumns = [];\n if (this.parent.filterSettings.columns.length && this.parent.filterSettings.columns.length !== matchFilteredColumns.length) {\n for (var i = 0; i < this.parent.columns.length; i++) {\n for (var j = 0; j < this.parent.filterSettings.columns.length; j++) {\n if (this.parent.filterSettings.columns[parseInt(j.toString(), 10)].field === column.field) {\n element.classList.add('e-filtered');\n matchFilteredColumns.push(column.field);\n break;\n }\n }\n }\n }\n node.classList.add('e-fltr-icon');\n node.appendChild(element);\n }\n if (this.parent.allowResizing) {\n var handler = this.parent.createElement('div');\n handler.className = column.allowResizing ? 'e-rhandler e-rcursor' : 'e-rsuppress';\n node.appendChild(handler);\n }\n return node;\n };\n /**\n * Function to specifies how the result content to be placed in the cell.\n *\n * @param {Element} node - specifies the node\n * @param {string|Element} innerHtml - specifies the innerHtml\n * @returns {Element} returns the element\n */\n HeaderCellRenderer.prototype.appendHtml = function (node, innerHtml) {\n node.appendChild(innerHtml);\n return node;\n };\n return HeaderCellRenderer;\n}(CellRenderer));\nexport { HeaderCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { CellRenderer } from './cell-renderer';\nimport { headerCellInfo } from '../base/constant';\nimport { setStyleAndAttributes, appendChildren, frozenDirection, isChildColumn, applyStickyLeftRightPosition } from '../base/util';\n/**\n * StackedHeaderCellRenderer class which responsible for building stacked header cell content.\n *\n * @hidden\n */\nvar StackedHeaderCellRenderer = /** @class */ (function (_super) {\n __extends(StackedHeaderCellRenderer, _super);\n function StackedHeaderCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TH', {\n className: 'e-headercell e-stackedheadercell', attrs: {\n tabindex: '-1', role: 'columnheader'\n }\n });\n return _this;\n }\n /**\n * Function to render the cell content based on Column object.\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @param {object} attributes - specifies the attributes\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n StackedHeaderCellRenderer.prototype.render = function (cell, data, attributes) {\n var node = this.element.cloneNode();\n var div = this.parent.createElement('div', {\n className: 'e-stackedheadercelldiv',\n attrs: { 'e-mappinguid': cell.column.uid }\n });\n var column = cell.column;\n node.appendChild(div);\n if (!isNullOrUndefined(column.headerTemplate)) {\n appendChildren(div, column.getHeaderTemplate()(column, this.parent, 'headerTemplate'));\n }\n else {\n this.appendHtml(div, this.parent.sanitize(column.headerText), column.getDomSetter());\n }\n if (cell.column.toolTip) {\n node.setAttribute('title', cell.column.toolTip);\n }\n if (column.clipMode === 'Clip' || (!column.clipMode && this.parent.clipMode === 'Clip')) {\n node.classList.add('e-gridclip');\n }\n else if (column.clipMode === 'EllipsisWithTooltip' || (!column.clipMode && this.parent.clipMode === 'EllipsisWithTooltip')) {\n node.classList.add('e-ellipsistooltip');\n }\n if (!isNullOrUndefined(cell.column.textAlign)) {\n div.style.textAlign = cell.column.textAlign;\n }\n if (cell.column.customAttributes) {\n setStyleAndAttributes(node, cell.column.customAttributes);\n }\n node.setAttribute('colspan', cell.colSpan.toString());\n node.setAttribute('aria-colspan', cell.colSpan.toString());\n node.setAttribute('aria-rowspan', '1');\n if (this.parent.allowResizing) {\n var handler = this.parent.createElement('div');\n handler.className = cell.column.allowResizing ? 'e-rhandler e-rcursor' : 'e-rsuppress';\n node.appendChild(handler);\n }\n if (cell.className) {\n node.classList.add(cell.className);\n }\n this.parent.trigger(headerCellInfo, { cell: cell, node: node });\n if (frozenDirection(column) === 'Left') {\n node.classList.add('e-leftfreeze');\n if (column.border === 'Left') {\n node.classList.add('e-freezeleftborder');\n }\n if (column.index === 0) {\n applyStickyLeftRightPosition(node, (this.parent.getIndentCount() * 30), this.parent.enableRtl, 'Left');\n }\n else {\n var cols = this.parent.getColumns();\n var width = this.parent.getIndentCount() * 30;\n for (var i = 0; i < cols.length; i++) {\n if (column.index < cols[parseInt(i.toString(), 10)].index) {\n break;\n }\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n applyStickyLeftRightPosition(node, width, this.parent.enableRtl, 'Left');\n }\n }\n else if (frozenDirection(column) === 'Right') {\n node.classList.add('e-rightfreeze');\n var cols = this.parent.getColumns();\n var width = this.parent.getFrozenMode() === 'Right' && this.parent.isRowDragable() ? 30 : 0;\n for (var i = cols.length - 1; i >= 0; i--) {\n if (isChildColumn(column, cols[parseInt(i.toString(), 10)].uid) || column.index > cols[parseInt(i.toString(), 10)].index) {\n break;\n }\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n applyStickyLeftRightPosition(node, width, this.parent.enableRtl, 'Right');\n if (column.border === 'Right') {\n node.classList.add('e-freezerightborder');\n }\n }\n else if (frozenDirection(column) === 'Fixed') {\n node.classList.add('e-fixedfreeze');\n var cols = this.parent.getColumns();\n var width = 0;\n if (this.parent.getVisibleFrozenLeftCount()) {\n width = this.parent.getIndentCount() * 30;\n }\n else if (this.parent.getFrozenMode() === 'Right') {\n width = this.parent.groupSettings.columns.length * 30;\n }\n for (var i = 0; i < cols.length; i++) {\n if (column.index > cols[parseInt(i.toString(), 10)].index) {\n if ((cols[parseInt(i.toString(), 10)].freeze === 'Left' || cols[parseInt(i.toString(), 10)].isFrozen) ||\n cols[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n }\n }\n applyStickyLeftRightPosition(node, width - 1, this.parent.enableRtl, 'Left');\n width = this.parent.getFrozenMode() === 'Right' && this.parent.isRowDragable() ? 30 : 0;\n for (var i = cols.length - 1; i >= 0; i--) {\n if (column.index < cols[parseInt(i.toString(), 10)].index) {\n if (isChildColumn(column, cols[parseInt(i.toString(), 10)].uid) ||\n column.index > cols[parseInt(i.toString(), 10)].index) {\n break;\n }\n if (cols[parseInt(i.toString(), 10)].freeze === 'Right' || cols[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n }\n }\n applyStickyLeftRightPosition(node, width - 1, this.parent.enableRtl, 'Right');\n }\n else {\n node.classList.add('e-unfreeze');\n }\n return node;\n };\n return StackedHeaderCellRenderer;\n}(CellRenderer));\nexport { StackedHeaderCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { setStyleAndAttributes } from '../base/util';\nimport { CellRenderer } from './cell-renderer';\n/**\n * IndentCellRenderer class which responsible for building group indent cell.\n *\n * @hidden\n */\nvar IndentCellRenderer = /** @class */ (function (_super) {\n __extends(IndentCellRenderer, _super);\n function IndentCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TD', { className: 'e-indentcell' });\n return _this;\n }\n /**\n * Function to render the indent cell\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n IndentCellRenderer.prototype.render = function (cell, data) {\n var node = this.element.cloneNode();\n setStyleAndAttributes(node, cell.attributes);\n return node;\n };\n return IndentCellRenderer;\n}(CellRenderer));\nexport { IndentCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { CellRenderer } from './cell-renderer';\nimport { appendChildren, templateCompiler } from '../base/util';\nimport { CellType } from '../base/enum';\n/**\n * GroupCaptionCellRenderer class which responsible for building group caption cell.\n *\n * @hidden\n */\nvar GroupCaptionCellRenderer = /** @class */ (function (_super) {\n __extends(GroupCaptionCellRenderer, _super);\n function GroupCaptionCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.cellUid = 0;\n _this.element = _this.parent\n .createElement('TD', { className: 'e-groupcaption',\n attrs: { id: _this.parent.element.id + 'captioncell', tabindex: '-1' } });\n return _this;\n }\n /**\n * Function to render the cell content based on Column object.\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the GroupedData\n * @returns {Element} returns the element\n */\n GroupCaptionCellRenderer.prototype.render = function (cell, data) {\n this.element.id = this.parent.element.id + 'captioncell' + this.cellUid++;\n var node = this.element.cloneNode();\n var gObj = this.parent;\n var column = cell.column;\n var domSetter = column.getDomSetter ? column.getDomSetter() : 'innerHTML';\n var result;\n var fKeyValue;\n var gTemplateValue;\n data.headerText = cell.column.headerText;\n if (cell.isForeignKey) {\n fKeyValue = this.format(cell.column, cell.column.valueAccessor('foreignKey', data, cell.column));\n }\n var value = cell.isForeignKey ? fKeyValue : cell.column.enableGroupByFormat ? data.key :\n this.format(cell.column, cell.column.valueAccessor('key', data, cell.column));\n for (var j = 0; j < gObj.aggregates.length; j++) {\n var _loop_1 = function (i) {\n if (gObj.getVisibleColumns()[0].field === gObj.aggregates[parseInt(j.toString(), 10)].columns[parseInt(i.toString(), 10)]\n .field && gObj.aggregates[parseInt(j.toString(), 10)].columns[parseInt(i.toString(), 10)].groupCaptionTemplate) {\n var gCaptionTemp = gObj.aggregates[parseInt(j.toString(), 10)]\n .columns[parseInt(i.toString(), 10)].groupCaptionTemplate;\n if (typeof gCaptionTemp === 'string' && gCaptionTemp.includes('$')) {\n gTemplateValue = gObj.aggregates[parseInt(j.toString(), 10)].columns[parseInt(i.toString(), 10)]\n .groupCaptionTemplate.split('$')[0] + data[gObj.getVisibleColumns()[0].field][gObj\n .aggregates[parseInt(j.toString(), 10)].columns[parseInt(i.toString(), 10)].type] +\n gObj.aggregates[parseInt(j.toString(), 10)].columns[parseInt(i.toString(), 10)]\n .groupCaptionTemplate.split('}')[1];\n }\n else {\n var column_1 = (gObj.aggregates[parseInt(j.toString(), 10)]\n .columns[parseInt(i.toString(), 10)]);\n var tempObj = column_1.getTemplate(CellType.CaptionSummary);\n var tempID = '';\n if (!isNullOrUndefined(tempObj)) {\n var tempValue_1 = tempObj.fn(data[column_1.columnName], this_1.parent, tempObj.property, tempID);\n if (this_1.parent.isReact && typeof column_1.groupCaptionTemplate !== 'string') {\n this_1.parent.renderTemplates(function () {\n if (tempValue_1 && tempValue_1.length) {\n if (!isNullOrUndefined(gObj.groupSettings.captionTemplate)) {\n node.appendChild(tempValue_1[0]);\n }\n else {\n node.innerText += ' ' + tempValue_1[0].textContent;\n }\n }\n });\n }\n else {\n if (tempValue_1 && tempValue_1.length) {\n if (!isNullOrUndefined(gObj.groupSettings.captionTemplate)) {\n gTemplateValue = tempValue_1;\n }\n else {\n gTemplateValue = tempValue_1[0].textContent;\n }\n }\n }\n }\n }\n return \"break\";\n }\n };\n var this_1 = this;\n for (var i = 0; i < gObj.aggregates[parseInt(j.toString(), 10)].columns.length; i++) {\n var state_1 = _loop_1(i);\n if (state_1 === \"break\")\n break;\n }\n }\n if (!isNullOrUndefined(gObj.groupSettings.captionTemplate)) {\n var isReactCompiler = this.parent.isReact && typeof (gObj.groupSettings.captionTemplate) !== 'string';\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n this.parent.parentDetails.parentInstObj.isReact;\n if (isReactCompiler || isReactChild) {\n var tempID = gObj.element.id + 'captionTemplate';\n templateCompiler(gObj.groupSettings.captionTemplate)(data, this.parent, 'captionTemplate', tempID, null, null, node);\n this.parent.renderTemplates();\n }\n else if (this.parent.isVue) {\n result = templateCompiler(gObj.groupSettings.captionTemplate)(data, this.parent);\n }\n else {\n result = templateCompiler(gObj.groupSettings.captionTemplate)(data);\n }\n if (!isReactCompiler && !isReactChild) {\n appendChildren(node, result);\n if (gTemplateValue && gTemplateValue.length && gTemplateValue[0].textContent) {\n node.appendChild(gTemplateValue[0]);\n }\n }\n }\n else {\n if (gObj.groupSettings.enableLazyLoading) {\n node[\"\" + domSetter] = this.parent.sanitize(cell.column.headerText) + ': ' + this.parent.sanitize(value) +\n (gTemplateValue ? ' ' + gTemplateValue : '');\n }\n else {\n node[\"\" + domSetter] = this.parent.sanitize(cell.column.headerText) + ': ' + this.parent.sanitize(value) +\n ' - ' + data.count + ' ' + (data.count < 2 ? this.localizer.getConstant('Item') : this.localizer.getConstant('Items'))\n + (gTemplateValue ? ' ' + gTemplateValue : '');\n }\n }\n node.setAttribute('colspan', cell.colSpan.toString());\n node.setAttribute('aria-label', node.innerHTML + this.localizer.getConstant('GroupCaption'));\n node.setAttribute('title', node.textContent);\n return node;\n };\n return GroupCaptionCellRenderer;\n}(CellRenderer));\nexport { GroupCaptionCellRenderer };\n/**\n * GroupCaptionEmptyCellRenderer class which responsible for building group caption empty cell.\n *\n * @hidden\n */\nvar GroupCaptionEmptyCellRenderer = /** @class */ (function (_super) {\n __extends(GroupCaptionEmptyCellRenderer, _super);\n function GroupCaptionEmptyCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TD', { className: 'e-groupcaption' });\n return _this;\n }\n /**\n * Function to render the cell content based on Column object.\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the Object\n * @param {string} data.field - Defines the field\n * @param {string} data.key - Defines the key\n * @param {number} data.count - Defines the count\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n GroupCaptionEmptyCellRenderer.prototype.render = function (cell, data) {\n var node = this.element.cloneNode();\n node.innerHTML = ' ';\n node.setAttribute('colspan', cell.colSpan.toString());\n return node;\n };\n return GroupCaptionEmptyCellRenderer;\n}(CellRenderer));\nexport { GroupCaptionEmptyCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { IndentCellRenderer } from './indent-cell-renderer';\nimport { CellType } from '../base/enum';\n/**\n * ExpandCellRenderer class which responsible for building group expand cell.\n *\n * @hidden\n */\nvar ExpandCellRenderer = /** @class */ (function (_super) {\n __extends(ExpandCellRenderer, _super);\n function ExpandCellRenderer() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n /**\n * Function to render the expand cell\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @param {string} data.field - Defines the field\n * @param {string} data.key - Defines the key\n * @param {Object} attr - specifies the attribute\n * @param {boolean} isExpand - specifies isexpand\n * @returns {Element} returns the element\n */\n ExpandCellRenderer.prototype.render = function (cell, data, attr, isExpand) {\n var node = this.element.cloneNode();\n node.setAttribute('ej-mappingname', data.field);\n node.setAttribute('ej-mappingvalue', data.key);\n node.setAttribute('aria-expanded', isExpand ? 'true' : 'false');\n node.setAttribute('tabindex', '-1');\n if (this.parent.infiniteScrollSettings && this.parent.infiniteScrollSettings.enableCache &&\n !this.parent.groupSettings.enableLazyLoading) {\n cell.cellType = CellType.Indent;\n node.className = isExpand ? 'e-recordplusexpand e-disablepointer' : 'e-recordpluscollapse e-disablepointer';\n }\n else {\n node.className = isExpand ? 'e-recordplusexpand' : 'e-recordpluscollapse';\n node.appendChild(this.parent.createElement('a', {\n className: isExpand ? 'e-icons e-gdiagonaldown e-icon-gdownarrow' : 'e-icons e-gnextforward e-icon-grightarrow',\n attrs: { href: '#', 'title': isExpand ? this.localizer.getConstant('Expanded') : this.localizer.getConstant('Collapsed') }\n }));\n }\n return node;\n };\n return ExpandCellRenderer;\n}(IndentCellRenderer));\nexport { ExpandCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { CellRenderer } from './cell-renderer';\n/**\n * HeaderIndentCellRenderer class which responsible for building header indent cell.\n *\n * @hidden\n */\nvar HeaderIndentCellRenderer = /** @class */ (function (_super) {\n __extends(HeaderIndentCellRenderer, _super);\n function HeaderIndentCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TH', { className: 'e-grouptopleftcell' });\n return _this;\n }\n /**\n * Function to render the indent cell\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n HeaderIndentCellRenderer.prototype.render = function (cell, data) {\n var node = this.element.cloneNode();\n node.appendChild(this.parent.createElement('div', { className: 'e-headercelldiv e-emptycell', innerHTML: '' }));\n return node;\n };\n return HeaderIndentCellRenderer;\n}(CellRenderer));\nexport { HeaderIndentCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { CellRenderer } from './cell-renderer';\n/**\n * DetailHeaderIndentCellRenderer class which responsible for building detail header indent cell.\n *\n * @hidden\n */\nvar DetailHeaderIndentCellRenderer = /** @class */ (function (_super) {\n __extends(DetailHeaderIndentCellRenderer, _super);\n function DetailHeaderIndentCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TH', { className: 'e-detailheadercell' });\n return _this;\n }\n /**\n * Function to render the detail indent cell\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DetailHeaderIndentCellRenderer.prototype.render = function (cell, data) {\n var node = this.element.cloneNode();\n node.appendChild(this.parent.createElement('div', { className: 'e-emptycell' }));\n return node;\n };\n return DetailHeaderIndentCellRenderer;\n}(CellRenderer));\nexport { DetailHeaderIndentCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { CellRenderer } from './cell-renderer';\n/**\n * ExpandCellRenderer class which responsible for building group expand cell.\n *\n * @hidden\n */\nvar DetailExpandCellRenderer = /** @class */ (function (_super) {\n __extends(DetailExpandCellRenderer, _super);\n function DetailExpandCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TD', {\n className: 'e-detailrowcollapse',\n attrs: { 'aria-expanded': 'false', tabindex: '-1' }\n });\n return _this;\n }\n /**\n * Function to render the detail expand cell\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @param {Object} attributes - specifies the attributes\n * @returns {Element} returns the element\n */\n DetailExpandCellRenderer.prototype.render = function (cell, data, attributes) {\n var node = this.element.cloneNode();\n if (attributes && !isNullOrUndefined(attributes['class'])) {\n node.className = '';\n node.className = attributes['class'];\n node.appendChild(this.parent.createElement('a', { className: 'e-icons e-dtdiagonaldown e-icon-gdownarrow', attrs: {\n href: '#', 'title': this.localizer.getConstant('Expanded')\n } }));\n }\n else {\n node.appendChild(this.parent.createElement('a', { className: 'e-icons e-dtdiagonalright e-icon-grightarrow', attrs: {\n href: '#', 'title': this.localizer.getConstant('Collapsed')\n } }));\n }\n if (cell.isSelected) {\n node.classList.add('e-selectionbackground', 'e-active');\n }\n return node;\n };\n return DetailExpandCellRenderer;\n}(CellRenderer));\nexport { DetailExpandCellRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { CellRenderer } from './cell-renderer';\nimport { applyStickyLeftRightPosition } from '../base/util';\n/**\n * ExpandCellRenderer class which responsible for building group expand cell.\n *\n * @hidden\n */\nvar RowDragDropRenderer = /** @class */ (function (_super) {\n __extends(RowDragDropRenderer, _super);\n function RowDragDropRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TD', {\n className: 'e-rowdragdrop e-rowdragdropcell',\n attrs: { tabindex: '-1', role: 'gridcell' }\n });\n return _this;\n }\n /**\n * Function to render the detail expand cell\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n RowDragDropRenderer.prototype.render = function (cell, data) {\n var nodeElement = this.element.cloneNode();\n nodeElement.appendChild(this.parent.createElement('div', {\n className: 'e-icons e-rowcelldrag e-dtdiagonalright e-icon-rowdragicon',\n attrs: { 'aria-hidden': 'true' }\n }));\n if (cell.isSelected) {\n nodeElement.classList.add('e-selectionbackground');\n nodeElement.classList.add('e-active');\n }\n if (this.parent.getVisibleFrozenRightCount() || this.parent.getVisibleFrozenLeftCount()) {\n nodeElement.classList.add('e-leftfreeze');\n var width = this.parent.getFrozenMode() === 'Right' ? 0 : this.parent.groupSettings.columns.length * 30;\n applyStickyLeftRightPosition(nodeElement, width, this.parent.enableRtl, this.parent.getFrozenMode() === 'Right' ? 'Right' : 'Left');\n }\n return nodeElement;\n };\n return RowDragDropRenderer;\n}(CellRenderer));\nexport { RowDragDropRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { createElement } from '@syncfusion/ej2-base';\nimport { CellRenderer } from './cell-renderer';\nimport { applyStickyLeftRightPosition } from '../base/util';\n/**\n * DetailHeaderIndentCellRenderer class which responsible for building detail header indent cell.\n *\n * @hidden\n */\nvar RowDragDropHeaderRenderer = /** @class */ (function (_super) {\n __extends(RowDragDropHeaderRenderer, _super);\n function RowDragDropHeaderRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TH', { className: 'e-rowdragheader' });\n return _this;\n }\n /**\n * Function to render the detail indent cell\n *\n * @param {Cell} cell - specifies the cell\n * @param {Object} data - specifies the data\n * @returns {Element} returns the element\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n RowDragDropHeaderRenderer.prototype.render = function (cell, data) {\n var node = this.element.cloneNode();\n node.appendChild(createElement('div', { className: 'e-emptycell' }));\n if (this.parent.getVisibleFrozenRightCount() || this.parent.getVisibleFrozenLeftCount()) {\n node.classList.add('e-leftfreeze');\n var width = this.parent.getFrozenMode() === 'Right' ? 0 : this.parent.groupSettings.columns.length * 30;\n applyStickyLeftRightPosition(node, width, this.parent.enableRtl, this.parent.getFrozenMode() === 'Right' ? 'Right' : 'Left');\n }\n return node;\n };\n return RowDragDropHeaderRenderer;\n}(CellRenderer));\nexport { RowDragDropHeaderRenderer };\n","import { remove, resetBlazorTemplate, blazorTemplates, getValue } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { DataManager, Query, Deferred, Predicate, DataUtil } from '@syncfusion/ej2-data';\nimport { ValueFormatter } from '../services/value-formatter';\nimport { RenderType, CellType } from '../base/enum';\nimport { Data } from '../actions/data';\nimport { Column } from '../models/column';\nimport { Row } from '../models/row';\nimport { Cell } from '../models/cell';\nimport * as events from '../base/constant';\nimport { prepareColumns, setFormatter, isGroupAdaptive, getDatePredicate, getObject, clearReactVueTemplates } from '../base/util';\nimport { ContentRender } from '../renderer/content-renderer';\nimport { HeaderRender } from '../renderer/header-renderer';\nimport { CellRenderer } from '../renderer/cell-renderer';\nimport { HeaderCellRenderer } from '../renderer/header-cell-renderer';\nimport { StackedHeaderCellRenderer } from '../renderer/stacked-cell-renderer';\nimport { IndentCellRenderer } from '../renderer/indent-cell-renderer';\nimport { GroupCaptionCellRenderer, GroupCaptionEmptyCellRenderer } from '../renderer/caption-cell-renderer';\nimport { ExpandCellRenderer } from '../renderer/expand-cell-renderer';\nimport { HeaderIndentCellRenderer } from '../renderer/header-indent-renderer';\nimport { DetailHeaderIndentCellRenderer } from '../renderer/detail-header-indent-renderer';\nimport { DetailExpandCellRenderer } from '../renderer/detail-expand-cell-renderer';\nimport { RowDragDropRenderer } from './row-drag-drop-renderer';\nimport { RowDragDropHeaderRenderer } from '../renderer/row-drag-header-indent-render';\nimport * as literals from '../base/string-literals';\n/**\n * Content module is used to render grid content\n *\n * @hidden\n */\nvar Render = /** @class */ (function () {\n /**\n * Constructor for render module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {ServiceLocator} locator - specifies the serviceLocator\n */\n function Render(parent, locator) {\n this.emptyGrid = false;\n this.counter = 0;\n this.parent = parent;\n this.locator = locator;\n this.data = new Data(parent, locator);\n this.l10n = locator.getService('localization');\n this.ariaService = this.locator.getService('ariaService');\n this.renderer = this.locator.getService('rendererFactory');\n this.addEventListener();\n }\n /**\n * To initialize grid header, content and footer rendering\n *\n * @returns {void}\n */\n Render.prototype.render = function () {\n var gObj = this.parent;\n this.headerRenderer = this.renderer.getRenderer(RenderType.Header);\n this.contentRenderer = this.renderer.getRenderer(RenderType.Content);\n this.headerRenderer.renderPanel();\n this.contentRenderer.renderPanel();\n if (gObj.getColumns().length) {\n this.isLayoutRendered = true;\n this.headerRenderer.renderTable();\n this.contentRenderer.renderTable();\n this.emptyRow(false);\n }\n this.parent.scrollModule.setWidth();\n this.parent.scrollModule.setHeight();\n if (this.parent.height !== 'auto') {\n this.parent.scrollModule.setPadding();\n }\n this.refreshDataManager();\n };\n /**\n * Refresh the entire Grid.\n *\n * @param {NotifyArgs} e - specifies the NotifyArgs\n * @returns {void}\n */\n Render.prototype.refresh = function (e) {\n var _this = this;\n if (e === void 0) { e = { requestType: 'refresh' }; }\n var gObj = this.parent;\n gObj.notify(e.requestType + \"-begin\", e);\n gObj.trigger(events.actionBegin, e, function (args) {\n if (args === void 0) { args = { requestType: 'refresh' }; }\n if (args.cancel) {\n gObj.notify(events.cancelBegin, args);\n if (args.action === 'clearFilter' && _this.parent.filterSettings.type === 'Menu') {\n _this.parent.filterSettings.columns[_this.parent.filterModule.filterObjIndex] = _this.parent.filterModule.prevFilterObject;\n var iconClass = _this.parent.showColumnMenu && _this.parent.filterModule['column'].showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';\n var col = _this.parent.element.querySelector('[e-mappinguid=\"' + _this.parent.filterModule['column'].uid + '\"]').parentElement;\n var flIcon = col.querySelector(iconClass);\n if (!isNullOrUndefined(_this.parent.filterModule.prevFilterObject)) {\n flIcon.classList.add('e-filtered');\n }\n }\n if (args.action === 'clear-filter' && (_this.parent.filterSettings.type === 'CheckBox' || _this.parent.filterSettings.type === 'Excel')) {\n _this.parent.filterSettings.columns = _this.parent.filterModule.checkboxPrevFilterObject;\n }\n if (args.requestType === 'grouping') {\n // Remove the dropped column name from groupsettings.columns if args.cancel is true\n var index = gObj.groupSettings.columns.indexOf(args.columnName);\n if (index !== -1) {\n gObj.setProperties({ groupSettings: { Columns: gObj.groupSettings.columns.splice(index, 1) } }, true);\n gObj.setProperties({ sortSettings: { Columns: gObj.sortSettings.columns.splice(index, 1) } }, true);\n var column = gObj.getColumnByField(args.columnName);\n var headerCell = gObj.getColumnHeaderByField(column.field);\n column.visible = (!isNullOrUndefined(headerCell) && !headerCell.classList.contains('e-hide'));\n }\n }\n return;\n }\n if (gObj.allowSelection && (args.action === 'clearFilter' || args.action === 'clear-filter' ||\n (args.requestType === 'searching' && args.searchString === '') || args.action === 'add')) {\n gObj.selectionModule['rmtHdrChkbxClicked'] = false;\n }\n if (gObj.allowPaging && gObj.pageSettings.pageSizes && gObj.pagerModule.pagerObj.isAllPage &&\n (args.action === 'add' && args.requestType === 'save') && gObj.pagerModule.pagerObj.checkAll) {\n gObj.setProperties({ pageSettings: { pageSize: gObj.pageSettings.pageSize + 1 } }, true);\n }\n if (args.requestType === 'delete' && gObj.allowPaging) {\n var dataLength = args.data.length;\n var count = gObj.pageSettings.totalRecordsCount - dataLength;\n var currentViewData = gObj.getCurrentViewRecords().length;\n // eslint-disable-next-line max-len\n if ((!(currentViewData - dataLength) && count && ((gObj.pageSettings.currentPage - 1) * gObj.pageSettings.pageSize) === count) || (count && count <= dataLength)) {\n gObj.prevPageMoving = true;\n gObj.setProperties({\n pageSettings: {\n totalRecordsCount: count, currentPage: Math.ceil(count / gObj.pageSettings.pageSize)\n }\n }, true);\n gObj.pagerModule.pagerObj.totalRecordsCount = count;\n }\n }\n if (args.requestType === 'reorder' && _this.parent.dataSource && 'result' in _this.parent.dataSource) {\n _this.contentRenderer.refreshContentRows(args);\n }\n else if ((args.requestType === 'paging' || args.requestType === 'columnstate' || args.requestType === 'reorder')\n && _this.parent.groupSettings.enableLazyLoading && _this.parent.groupSettings.columns.length\n && (_this.parent.enableVirtualization ? _this.parent.lazyLoadRender :\n _this.parent.contentModule).getGroupCache()[_this.parent.pageSettings.currentPage]) {\n _this.contentRenderer.refreshContentRows(args);\n }\n else {\n _this.refreshDataManager(args);\n }\n });\n };\n /**\n * @returns {void}\n * @hidden\n */\n Render.prototype.resetTemplates = function () {\n var gObj = this.parent;\n var gridColumns = gObj.getColumns();\n if (gObj.detailTemplate) {\n var detailTemplateID = gObj.element.id + 'detailTemplate';\n blazorTemplates[\"\" + detailTemplateID] = [];\n resetBlazorTemplate(detailTemplateID, 'DetailTemplate');\n }\n if (gObj.groupSettings.captionTemplate) {\n resetBlazorTemplate(gObj.element.id + 'captionTemplate', 'CaptionTemplate');\n }\n if (gObj.rowTemplate) {\n resetBlazorTemplate(gObj.element.id + 'rowTemplate', 'RowTemplate');\n }\n if (gObj.toolbarTemplate) {\n resetBlazorTemplate(gObj.element.id + 'toolbarTemplate', 'ToolbarTemplate');\n }\n if (gObj.pageSettings.template) {\n resetBlazorTemplate(gObj.element.id + '_template', 'pageSettings');\n }\n for (var i = 0; i < gridColumns.length; i++) {\n if (gridColumns[parseInt(i.toString(), 10)].template) {\n blazorTemplates[gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid] = [];\n resetBlazorTemplate(gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid, 'Template');\n }\n if (gridColumns[parseInt(i.toString(), 10)].headerTemplate) {\n resetBlazorTemplate(gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid + 'headerTemplate', 'HeaderTemplate');\n }\n if (gridColumns[parseInt(i.toString(), 10)].filterTemplate) {\n resetBlazorTemplate(gObj.element.id + gridColumns[parseInt(i.toString(), 10)].uid + 'filterTemplate', 'FilterTemplate');\n }\n }\n var guid = 'guid';\n for (var k = 0; k < gObj.aggregates.length; k++) {\n for (var j = 0; j < gObj.aggregates[parseInt(k.toString(), 10)].columns.length; j++) {\n if (gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)].footerTemplate) {\n var tempID = gObj.element.id + gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)][\"\" + guid] + 'footerTemplate';\n resetBlazorTemplate(tempID, 'FooterTemplate');\n }\n if (gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)].groupFooterTemplate) {\n var tempID = gObj.element.id + gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)][\"\" + guid] + 'groupFooterTemplate';\n resetBlazorTemplate(tempID, 'GroupFooterTemplate');\n }\n if (gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)].groupCaptionTemplate) {\n var tempID = gObj.element.id + gObj.aggregates[parseInt(k.toString(), 10)].columns[parseInt(j.toString(), 10)][\"\" + guid] + 'groupCaptionTemplate';\n resetBlazorTemplate(tempID, 'GroupCaptionTemplate');\n }\n }\n }\n };\n Render.prototype.refreshComplete = function (e) {\n this.parent.trigger(events.actionComplete, e);\n };\n /**\n * The function is used to refresh the dataManager\n *\n * @param {NotifyArgs} args - specifies the args\n * @returns {void}\n */\n Render.prototype.refreshDataManager = function (args) {\n var _this = this;\n if (args === void 0) { args = {}; }\n var gObj = this.parent;\n var maskRow = (gObj.loadingIndicator.indicatorType === 'Shimmer' && args.requestType !== 'virtualscroll'\n && args.requestType !== 'infiniteScroll') || ((args.requestType === 'virtualscroll' || args.requestType === 'infiniteScroll')\n && gObj.enableVirtualMaskRow);\n if (args.requestType !== 'virtualscroll' && !args.isCaptionCollapse && !maskRow) {\n this.parent.showSpinner();\n }\n if (maskRow) {\n gObj.showMaskRow(args.requestType === 'virtualscroll' ? args.virtualInfo.sentinelInfo.axis\n : args.requestType === 'infiniteScroll' ? args.direction : undefined);\n }\n this.parent.notify(events.resetInfiniteBlocks, args);\n this.emptyGrid = false;\n var dataManager;\n var isFActon = this.isNeedForeignAction();\n this.ariaService.setBusy(this.parent.getContent().querySelector('.' + literals.content), true);\n if (isFActon) {\n var deffered = new Deferred();\n dataManager = this.getFData(deffered, args);\n }\n if (!dataManager) {\n if (gObj.allowPaging && !gObj.getDataModule().dataManager.dataSource.offline && gObj.pageSettings\n && gObj.pageSettings.pageSizes && gObj.pagerModule && gObj.pagerModule.pagerObj && gObj.pagerModule.pagerObj.isAllPage) {\n gObj.pagerModule.pagerObj.isAllPage = undefined;\n }\n dataManager = this.data.getData(args, this.data.generateQuery().requiresCount());\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n dataManager = dataManager.then(function (e) {\n var query = _this.data.generateQuery().requiresCount();\n if (_this.emptyGrid) {\n var def = new Deferred();\n def.resolve({ result: [], count: 0 });\n return def.promise;\n }\n return _this.data.getData(args, query);\n });\n }\n if (this.parent.getForeignKeyColumns().length && (!isFActon || this.parent.searchSettings.key.length)) {\n var deffered_1 = new Deferred();\n dataManager = dataManager.then(function (e) {\n _this.parent.notify(events.getForeignKeyData, { dataManager: dataManager, result: e, promise: deffered_1, action: args });\n return deffered_1.promise;\n });\n }\n if (this.parent.groupSettings.disablePageWiseAggregates && this.parent.groupSettings.columns.length) {\n dataManager = dataManager.then(function (e) { return _this.validateGroupRecords(e); });\n }\n dataManager.then(function (e) { return _this.dataManagerSuccess(e, args); })\n .catch(function (e) { return _this.dataManagerFailure(e, args); });\n };\n Render.prototype.getFData = function (deferred, args) {\n this.parent.notify(events.getForeignKeyData, { isComplex: true, promise: deferred, action: args });\n return deferred.promise;\n };\n Render.prototype.isNeedForeignAction = function () {\n var gObj = this.parent;\n return !!((gObj.allowFiltering && gObj.filterSettings.columns.length) ||\n (gObj.searchSettings.key.length)) && this.foreignKey(this.parent.getForeignKeyColumns());\n };\n Render.prototype.foreignKey = function (columns) {\n var _this = this;\n return columns.some(function (col) {\n var fbool = false;\n fbool = _this.parent.filterSettings.columns.some(function (value) {\n return col.uid === value.uid;\n });\n return !!(fbool || _this.parent.searchSettings.key.length);\n });\n };\n Render.prototype.sendBulkRequest = function (args) {\n var _this = this;\n args.requestType = 'batchsave';\n var gObj = this.parent;\n if (gObj.allowPaging && gObj.pageSettings.pageSizes && gObj.pagerModule.pagerObj.isAllPage && gObj.pagerModule.pagerObj.checkAll) {\n var dataLength = args['changes'].addedRecords.length;\n if (dataLength) {\n gObj.setProperties({ pageSettings: { pageSize: gObj.pageSettings.pageSize + dataLength } }, true);\n }\n }\n if (gObj.allowPaging && (args.changes.addedRecords.length ||\n args.changes.deletedRecords.length ||\n args.changes.changedRecords.length) && gObj.pageSettings\n && gObj.pageSettings.pageSizes && gObj.pagerModule && gObj.pagerModule.pagerObj\n && !gObj.getDataModule().dataManager.dataSource.offline && gObj.pagerModule.pagerObj.isAllPage) {\n gObj.pagerModule.pagerObj.isAllPage = undefined;\n }\n var promise = this.data.saveChanges(args.changes, this.parent.getPrimaryKeyFieldNames()[0], args.original);\n var query = this.data.generateQuery().requiresCount();\n if (this.data.dataManager.dataSource.offline) {\n this.refreshDataManager({ requestType: 'batchsave' });\n return;\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n promise.then(function (e) {\n _this.data.getData(args, query)\n .then(function (e) { return _this.dmSuccess(e, args); })\n .catch(function (e) { return _this.dmFailure(e, args); });\n })\n .catch(function (e) { return _this.dmFailure(e, args); });\n }\n };\n Render.prototype.dmSuccess = function (e, args) {\n this.dataManagerSuccess(e, args);\n };\n Render.prototype.dmFailure = function (e, args) {\n this.dataManagerFailure(e, args);\n };\n /**\n * Render empty row to Grid which is used at the time to represent to no records.\n *\n * @returns {void}\n * @hidden\n */\n Render.prototype.renderEmptyRow = function () {\n this.emptyRow(true);\n };\n Render.prototype.emptyRow = function (isTrigger) {\n var gObj = this.parent;\n var tbody = this.contentRenderer.getTable().querySelector(literals.tbody);\n if (!isNullOrUndefined(tbody)) {\n remove(tbody);\n }\n tbody = this.parent.createElement(literals.tbody, { attrs: { role: 'rowgroup' } });\n var spanCount = gObj.allowRowDragAndDrop && isNullOrUndefined(gObj.rowDropSettings.targetID) ? 1 : 0;\n if (gObj.detailTemplate || gObj.childGrid) {\n ++spanCount;\n }\n var className = gObj.editSettings.showAddNewRow && gObj.editSettings.newRowPosition === 'Bottom' ?\n 'e-emptyrow e-show-added-row' : 'e-emptyrow';\n var tr = this.parent.createElement('tr', { className: className, attrs: { role: 'row' } });\n var td;\n if (gObj.emptyRecordTemplate) {\n var emptyRecordTemplateID = gObj.element.id + 'emptyRecordTemplate';\n td = this.parent.createElement('td', { attrs: { colspan: (gObj.getVisibleColumns().length +\n spanCount + gObj.groupSettings.columns.length).toString() } });\n if (gObj.isVue) {\n td.appendChild(gObj.getEmptyRecordTemplate()(gObj.dataSource, gObj, 'emptyRecordTemplate', emptyRecordTemplateID, undefined, undefined, undefined, this.parent['root'])[1]);\n }\n else {\n td.appendChild(gObj.getEmptyRecordTemplate()(gObj.dataSource, gObj, 'emptyRecordTemplate', emptyRecordTemplateID, undefined, undefined, undefined, this.parent['root'])[0]);\n }\n if (gObj.isReact) {\n this.parent.renderTemplates();\n }\n }\n else {\n td = this.parent.createElement('td', {\n innerHTML: this.l10n.getConstant('EmptyRecord'),\n attrs: { colspan: (gObj.getVisibleColumns().length + spanCount + gObj.groupSettings.columns.length).toString() }\n });\n }\n if (gObj.isFrozenGrid()) {\n td.classList.add('e-leftfreeze');\n td.style.left = 0 + 'px';\n }\n if (gObj.frozenRows && gObj.element.querySelector('.e-frozenrow-border')) {\n this.parent.element.querySelector('.e-frozenrow-border').classList.add('e-frozenrow-empty');\n }\n tr.appendChild(td);\n tbody.appendChild(tr);\n this.contentRenderer.renderEmpty(tbody);\n if (isTrigger) {\n if (!this.parent.isInitialLoad) {\n this.parent.focusModule.setFirstFocusableTabIndex();\n }\n this.parent.trigger(events.dataBound, {});\n this.parent.notify(events.onEmpty, { rows: [new Row({ isDataRow: true, cells: [new Cell({ isDataCell: true, visible: true })] })] });\n if (gObj.editSettings.showAddNewRow) {\n gObj.addRecord();\n this.parent.notify(events.showAddNewRowFocus, {});\n }\n }\n };\n Render.prototype.dynamicColumnChange = function () {\n if (this.parent.getCurrentViewRecords().length) {\n this.updateColumnType(this.parent.getCurrentViewRecords()[0]);\n }\n };\n Render.prototype.updateColumnType = function (record) {\n var columns = this.parent.getColumns();\n var value;\n var cFormat = 'customFormat';\n var equalTo = 'equalTo';\n var data = record && record.items ? record.items[0] : record;\n var fmtr = this.locator.getService('valueFormatter');\n for (var i = 0, len = columns.length; i < len; i++) {\n value = getObject(columns[parseInt(i.toString(), 10)].field || '', data);\n if (!isNullOrUndefined(columns[parseInt(i.toString(), 10)][\"\" + cFormat])) {\n columns[parseInt(i.toString(), 10)].format = columns[parseInt(i.toString(), 10)][\"\" + cFormat];\n }\n if (!isNullOrUndefined(columns[parseInt(i.toString(), 10)].validationRules)\n && !isNullOrUndefined(columns[parseInt(i.toString(), 10)].validationRules[\"\" + equalTo])) {\n columns[parseInt(i.toString(), 10)].validationRules[\"\" + equalTo][0] = this.parent.element.id + columns[parseInt(i.toString(), 10)].validationRules[\"\" + equalTo][0];\n }\n if (columns[parseInt(i.toString(), 10)].isForeignColumn() && columns[parseInt(i.toString(), 10)].columnData) {\n value = getObject(columns[parseInt(i.toString(), 10)].foreignKeyValue || '', columns[parseInt(i.toString(), 10)].columnData[0]);\n }\n if (!isNullOrUndefined(value)) {\n this.isColTypeDef = true;\n if (!columns[parseInt(i.toString(), 10)].type) {\n columns[parseInt(i.toString(), 10)].type = value.getDay ? (value.getHours() > 0 || value.getMinutes() > 0 ||\n value.getSeconds() > 0 || value.getMilliseconds() > 0 ? 'datetime' : 'date') : typeof (value);\n }\n }\n else {\n columns[parseInt(i.toString(), 10)].type = columns[parseInt(i.toString(), 10)].type || null;\n }\n var valueFormatter = new ValueFormatter();\n if (columns[parseInt(i.toString(), 10)].format && (columns[parseInt(i.toString(), 10)].format.skeleton\n || (columns[parseInt(i.toString(), 10)].format.format &&\n typeof columns[parseInt(i.toString(), 10)].format.format === 'string'))) {\n columns[parseInt(i.toString(), 10)].setFormatter(valueFormatter.getFormatFunction(extend({}, columns[parseInt(i.toString(), 10)].format)));\n columns[parseInt(i.toString(), 10)].setParser(valueFormatter.getParserFunction(columns[parseInt(i.toString(), 10)].format));\n }\n if (typeof (columns[parseInt(i.toString(), 10)].format) === 'string') {\n setFormatter(this.locator, columns[parseInt(i.toString(), 10)]);\n }\n else if (!columns[parseInt(i.toString(), 10)].format && columns[parseInt(i.toString(), 10)].type === 'number') {\n columns[parseInt(i.toString(), 10)].setParser(fmtr.getParserFunction({ format: 'n2' }));\n }\n if (columns[parseInt(i.toString(), 10)].type === 'dateonly' && !columns[parseInt(i.toString(), 10)].format) {\n columns[parseInt(i.toString(), 10)].format = 'yMd';\n setFormatter(this.locator, columns[parseInt(i.toString(), 10)]);\n }\n }\n };\n /**\n * @param {ReturnType} e - specifies the return type\n * @param {NotifyArgs} args - specifies the Notifyargs\n * @returns {void}\n * @hidden\n */\n // tslint:disable-next-line:max-func-body-length\n Render.prototype.dataManagerSuccess = function (e, args) {\n var _this = this;\n var gObj = this.parent;\n this.contentRenderer = this.renderer.getRenderer(RenderType.Content);\n this.headerRenderer = this.renderer.getRenderer(RenderType.Header);\n e.actionArgs = args;\n var isInfiniteDelete = this.parent.enableInfiniteScrolling && !this.parent.infiniteScrollSettings.enableCache &&\n !gObj.groupSettings.enableLazyLoading && (args.requestType === 'delete' || (args.requestType === 'save' &&\n this.parent.infiniteScrollModule.requestType === 'add' && !(gObj.sortSettings.columns.length ||\n gObj.filterSettings.columns.length || this.parent.groupSettings.columns.length || gObj.searchSettings.key)));\n // tslint:disable-next-line:max-func-body-length\n gObj.trigger(events.beforeDataBound, e, function (dataArgs) {\n if (dataArgs.cancel) {\n return;\n }\n dataArgs.result = isNullOrUndefined(dataArgs.result) ? [] : dataArgs.result;\n var len = Object.keys(dataArgs.result).length;\n if (_this.parent.isDestroyed) {\n return;\n }\n if ((!gObj.getColumns().length && !len) && !(gObj.columns.length && gObj.columns[0] instanceof Column)) {\n gObj.hideSpinner();\n return;\n }\n if (_this.isInfiniteEnd(args) && !len) {\n _this.parent.notify(events.infiniteEditHandler, { e: args, result: e.result, count: e.count, agg: e.aggregates });\n return;\n }\n _this.parent.isEdit = false;\n _this.parent.notify(events.editReset, {});\n _this.parent.notify(events.tooltipDestroy, {});\n if (args && !((args.requestType === 'infiniteScroll' || args.requestType === 'delete' || args.action === 'add') &&\n gObj.enableInfiniteScrolling)) {\n _this.parent.notify(events.commandColumnDestroy, { type: 'refreshCommandColumn' });\n }\n _this.contentRenderer.prevCurrentView = _this.parent.currentViewData.slice();\n gObj.currentViewData = dataArgs.result;\n gObj.notify(events.refreshInfiniteCurrentViewData, { args: args, data: dataArgs.result });\n if (dataArgs.count && !gObj.allowPaging && (gObj.enableVirtualization || gObj.enableInfiniteScrolling)) {\n gObj.totalDataRecordsCount = dataArgs.count;\n }\n if (!len && dataArgs.count && gObj.allowPaging && args && args.requestType !== 'delete') {\n if (_this.parent.groupSettings.enableLazyLoading\n && (args.requestType === 'grouping' || args.requestType === 'ungrouping')) {\n _this.parent.notify(events.groupComplete, args);\n }\n gObj.prevPageMoving = true;\n gObj.pageSettings.totalRecordsCount = dataArgs.count;\n if (args.requestType !== 'paging') {\n gObj.pageSettings.currentPage = Math.ceil(dataArgs.count / gObj.pageSettings.pageSize);\n }\n gObj.dataBind();\n return;\n }\n if ((!gObj.getColumns().length && len || !_this.isLayoutRendered) && !isGroupAdaptive(gObj)) {\n gObj.removeMaskRow();\n _this.updatesOnInitialRender(dataArgs);\n }\n if (!_this.isColTypeDef && gObj.getCurrentViewRecords()) {\n if (_this.data.dataManager.dataSource.offline && gObj.dataSource && gObj.dataSource.length) {\n _this.updateColumnType(gObj.dataSource[0]);\n }\n else {\n _this.updateColumnType(gObj.getCurrentViewRecords()[0]);\n }\n }\n if (!_this.parent.isInitialLoad && _this.parent.groupSettings.disablePageWiseAggregates &&\n !_this.parent.groupSettings.columns.length) {\n dataArgs.result = _this.parent.dataSource instanceof Array ? _this.parent.dataSource : _this.parent.currentViewData;\n }\n if ((_this.parent.isReact || _this.parent.isVue) && !isNullOrUndefined(args) && args.requestType !== 'infiniteScroll' && !args.isFrozen) {\n clearReactVueTemplates(_this.parent, ['footerTemplate']);\n }\n if (_this.parent.isAngular && _this.parent.allowGrouping && _this.parent.groupSettings.captionTemplate\n && !(!isNullOrUndefined(args) && args.requestType === 'infiniteScroll')) {\n _this.parent.destroyTemplate(['groupSettings_captionTemplate']);\n }\n _this.parent.notify(events.dataReady, extend({ count: dataArgs.count, result: dataArgs.result, aggregates: dataArgs.aggregates, loadSummaryOnEmpty: false }, args));\n if ((gObj.groupSettings.columns.length || (args && args.requestType === 'ungrouping'))\n && (args && args.requestType !== 'filtering')) {\n _this.headerRenderer.refreshUI();\n }\n if (len) {\n if (isGroupAdaptive(gObj)) {\n var content = 'content';\n args.scrollTop = { top: _this.contentRenderer[\"\" + content].scrollTop };\n }\n if (!isInfiniteDelete) {\n if (_this.parent.enableImmutableMode) {\n _this.contentRenderer.immutableModeRendering(args);\n }\n else {\n _this.contentRenderer.refreshContentRows(args);\n }\n }\n else {\n _this.parent.notify(events.infiniteEditHandler, { e: args, result: e.result, count: e.count, agg: e.aggregates });\n }\n }\n else {\n if (args && args.isCaptionCollapse) {\n return;\n }\n if (!gObj.getColumns().length) {\n gObj.element.innerHTML = '';\n alert(_this.l10n.getConstant('EmptyDataSourceError')); //ToDO: change this alert as dialog\n return;\n }\n _this.contentRenderer.setRowElements([]);\n _this.contentRenderer.setRowObjects([]);\n _this.ariaService.setBusy(_this.parent.getContent().querySelector('.' + literals.content), false);\n gObj.removeMaskRow();\n _this.renderEmptyRow();\n if (gObj.enableColumnVirtualization && !len) {\n _this.parent.notify(events.contentReady, { rows: gObj.getRowsObject(), args: {} });\n }\n if (args) {\n var action = (args.requestType || '').toLowerCase() + '-complete';\n _this.parent.notify(action, args);\n if (args.requestType === 'batchsave') {\n args.cancel = false;\n args.rows = [];\n args.isFrozen = !args.isFrozen;\n _this.parent.trigger(events.actionComplete, args);\n }\n }\n if (_this.parent.autoFit) {\n _this.parent.preventAdjustColumns();\n }\n _this.parent.hideSpinner();\n }\n _this.parent.notify(events.toolbarRefresh, {});\n _this.setRowCount(_this.parent.getCurrentViewRecords().length);\n if ('query' in e) {\n _this.parent.getDataModule().isQueryInvokedFromData = false;\n }\n });\n };\n /**\n * @param {object} e - specifies the object\n * @param {Object[]} e.result - specifies the result\n * @param {NotifyArgs} args - specifies the args\n * @returns {void}\n * @hidden\n */\n Render.prototype.dataManagerFailure = function (e, args) {\n if (!isNullOrUndefined(this.parent.contentModule)) {\n this.ariaService.setOptions(this.parent.getContent().querySelector('.' + literals.content), { busy: false, invalid: true });\n this.setRowCount(1);\n }\n this.parent.trigger(events.actionFailure, { error: e });\n this.parent.hideSpinner();\n this.parent.removeMaskRow();\n if (args.requestType === 'save' || args.requestType === 'delete'\n || args.name === 'bulk-save') {\n return;\n }\n this.parent.currentViewData = [];\n this.renderEmptyRow();\n if (!this.parent.isInitialLoad) {\n this.parent.focusModule.setFirstFocusableTabIndex();\n }\n this.parent.log('actionfailure', { error: e });\n };\n Render.prototype.setRowCount = function (dataRowCount) {\n this.ariaService.setOptions(this.parent.element, {\n rowcount: dataRowCount ? dataRowCount.toString() : '1'\n });\n };\n Render.prototype.isInfiniteEnd = function (args) {\n return this.parent.enableInfiniteScrolling && !this.parent.infiniteScrollSettings.enableCache && args.requestType === 'delete';\n };\n Render.prototype.updatesOnInitialRender = function (e) {\n this.isLayoutRendered = true;\n var isEmptyCol = false;\n if (this.parent.columns.length < 1) {\n this.buildColumns(e.result[0]);\n isEmptyCol = true;\n }\n prepareColumns(this.parent.columns, null, this.parent);\n if (isEmptyCol) {\n this.parent.notify(events.refreshSplitFrozenColumn, {});\n }\n this.headerRenderer.renderTable();\n this.contentRenderer.renderTable();\n this.parent.isAutoGen = true;\n this.parent.notify(events.autoCol, {});\n };\n Render.prototype.iterateComplexColumns = function (obj, field, split) {\n var keys = Object.keys(obj);\n for (var i = 0; i < keys.length; i++) {\n var childKeys = typeof obj[keys[parseInt(i.toString(), 10)]] === 'object'\n && obj[keys[parseInt(i.toString(), 10)]] && !(obj[keys[parseInt(i.toString(), 10)]] instanceof Date) ?\n Object.keys(obj[keys[parseInt(i.toString(), 10)]]) : [];\n if (childKeys.length) {\n this.iterateComplexColumns(obj[keys[parseInt(i.toString(), 10)]], field + (keys[parseInt(i.toString(), 10)] + '.'), split);\n }\n else {\n split[this.counter] = field + keys[parseInt(i.toString(), 10)];\n this.counter++;\n }\n }\n };\n Render.prototype.buildColumns = function (record) {\n var cols = [];\n var complexCols = {};\n this.iterateComplexColumns(record, '', complexCols);\n var columns = Object.keys(complexCols).filter(function (e) { return complexCols[\"\" + e] !== 'BlazId'; }).\n map(function (field) { return complexCols[\"\" + field]; });\n for (var i = 0, len = columns.length; i < len; i++) {\n cols[parseInt(i.toString(), 10)] = { 'field': columns[parseInt(i.toString(), 10)] };\n if (this.parent.enableColumnVirtualization) {\n cols[parseInt(i.toString(), 10)].width = !isNullOrUndefined(cols[parseInt(i.toString(), 10)].width) ?\n cols[parseInt(i.toString(), 10)].width : 200;\n }\n }\n this.parent.setProperties({ 'columns': cols }, true);\n };\n Render.prototype.instantiateRenderer = function () {\n this.renderer.addRenderer(RenderType.Header, new HeaderRender(this.parent, this.locator));\n this.renderer.addRenderer(RenderType.Content, new ContentRender(this.parent, this.locator));\n var cellrender = this.locator.getService('cellRendererFactory');\n cellrender.addCellRenderer(CellType.Header, new HeaderCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.Data, new CellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.StackedHeader, new StackedHeaderCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.Indent, new IndentCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.GroupCaption, new GroupCaptionCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.GroupCaptionEmpty, new GroupCaptionEmptyCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.Expand, new ExpandCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.HeaderIndent, new HeaderIndentCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.StackedHeader, new StackedHeaderCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.DetailHeader, new DetailHeaderIndentCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.RowDragHIcon, new RowDragDropHeaderRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.DetailExpand, new DetailExpandCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.DetailFooterIntent, new IndentCellRenderer(this.parent, this.locator));\n cellrender.addCellRenderer(CellType.RowDragIcon, new RowDragDropRenderer(this.parent, this.locator));\n };\n Render.prototype.addEventListener = function () {\n var _this = this;\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.initialLoad, this.instantiateRenderer, this);\n this.parent.on('refreshdataSource', this.dataManagerSuccess, this);\n this.parent.on(events.modelChanged, this.refresh, this);\n this.parent.on(events.refreshComplete, this.refreshComplete, this);\n this.parent.on(events.bulkSave, this.sendBulkRequest, this);\n this.parent.on(events.showEmptyGrid, function () { _this.emptyGrid = true; }, this);\n this.parent.on(events.autoCol, this.dynamicColumnChange, this);\n };\n /**\n * @param {ReturnType} e - specifies the Return type\n * @returns {Promise} returns the object\n * @hidden\n */\n Render.prototype.validateGroupRecords = function (e) {\n var _this = this;\n var index = e.result.length - 1;\n if (index < 0) {\n return Promise.resolve(e);\n }\n var group0 = e.result[0];\n var groupN = e.result[parseInt(index.toString(), 10)];\n var predicate = [];\n var addWhere = function (input) {\n var groups = [group0, groupN];\n for (var i = 0; i < groups.length; i++) {\n predicate.push(new Predicate('field', '==', groups[parseInt(i.toString(), 10)].field).and(_this.getPredicate('key', 'equal', groups[parseInt(i.toString(), 10)].key)));\n }\n input.where(Predicate.or(predicate));\n };\n var query = new Query();\n addWhere(query);\n var curDm = new DataManager(e.result);\n var curFilter = curDm.executeLocal(query);\n var newQuery = this.data.generateQuery(true);\n var rPredicate = [];\n if (this.data.isRemote()) {\n var groups = [group0, groupN];\n for (var i = 0; i < groups.length; i++) {\n rPredicate.push(this.getPredicate(groups[parseInt(i.toString(), 10)].field, 'equal', groups[parseInt(i.toString(), 10)].key));\n }\n newQuery.where(Predicate.or(rPredicate));\n }\n else {\n addWhere(newQuery);\n }\n var deferred = new Deferred();\n this.data.getData({}, newQuery).then(function (r) {\n _this.updateGroupInfo(curFilter, r.result);\n deferred.resolve(e);\n }).catch(function (e) { return deferred.reject(e); });\n return deferred.promise;\n };\n /**\n * @param {string} key - Defines the key\n * @param {string} operator - Defines the operator\n * @param {string | number | Date} value - Defines the value\n * @returns {Predicate} - Returns the predicate\n * @hidden */\n Render.prototype.getPredicate = function (key, operator, value) {\n if (value instanceof Date) {\n return getDatePredicate({ field: key, operator: operator, value: value });\n }\n return new Predicate(key, operator, value);\n };\n /**\n * @param {Object[]} current - Defines the current object\n * @param {Object[]} untouched - Defines the object needs to merge\n * @returns {Object[]} - Returns the updated group information\n * @hidden */\n Render.prototype.updateGroupInfo = function (current, untouched) {\n var dm = new DataManager(untouched);\n var elements = current;\n for (var i = 0; i < elements.length; i++) {\n var updatedGroup = dm.executeLocal(new Query()\n .where(new Predicate('field', '==', elements[parseInt(i.toString(), 10)].field).and(this.getPredicate('key', 'equal', elements[parseInt(i.toString(), 10)].key))))[0];\n if (!isNullOrUndefined(updatedGroup)) {\n elements[parseInt(i.toString(), 10)].count = updatedGroup.count;\n var itemGroup = elements[parseInt(i.toString(), 10)].items;\n var updatedGroupItem = updatedGroup.items;\n if (itemGroup.GroupGuid) {\n elements[parseInt(i.toString(), 10)].items =\n this.updateGroupInfo(elements[parseInt(i.toString(), 10)].items, updatedGroup.items);\n }\n var rows = this.parent.aggregates;\n for (var j = 0; j < rows.length; j++) {\n var row = rows[parseInt(j.toString(), 10)];\n for (var k = 0; k < row.columns.length; k++) {\n var column = row.columns[parseInt(k.toString(), 10)];\n var types = column.type instanceof Array ? (column.type) : [(column.type)];\n for (var l = 0; l < types.length; l++) {\n var key = column.field + ' - ' + types[parseInt(l.toString(), 10)].toLowerCase();\n var data = itemGroup.level ? updatedGroupItem.records : updatedGroup.items;\n var context = this.parent;\n if (types[parseInt(l.toString(), 10)] === 'Custom') {\n var data_1 = itemGroup.level ? updatedGroupItem : updatedGroup;\n var temp = column\n .customAggregate;\n if (typeof temp === 'string') {\n temp = getValue(temp, window);\n }\n elements[parseInt(i.toString(), 10)].aggregates[\"\" + key] = temp ? temp.call(context, data_1, row.columns[parseInt(k.toString(), 10)]) : '';\n }\n else {\n elements[parseInt(i.toString(), 10)].aggregates[\"\" + key] = DataUtil.aggregates[types[parseInt(l.toString(), 10)].toLowerCase()](data, row.columns[parseInt(k.toString(), 10)].field);\n }\n }\n }\n }\n }\n }\n return current;\n };\n return Render;\n}());\nexport { Render };\n","import { isNullOrUndefined, getEnumValue } from '@syncfusion/ej2-base';\nimport { CellType } from '../base/enum';\n/**\n * CellRendererFactory\n *\n * @hidden\n */\nvar CellRendererFactory = /** @class */ (function () {\n function CellRendererFactory() {\n this.cellRenderMap = {};\n }\n CellRendererFactory.prototype.addCellRenderer = function (name, type) {\n name = typeof name === 'string' ? name : getEnumValue(CellType, name);\n if (isNullOrUndefined(this.cellRenderMap[\"\" + name])) {\n this.cellRenderMap[\"\" + name] = type;\n }\n };\n CellRendererFactory.prototype.getCellRenderer = function (name) {\n name = typeof name === 'string' ? name : getEnumValue(CellType, name);\n if (isNullOrUndefined(this.cellRenderMap[\"\" + name])) {\n // eslint-disable-next-line no-throw-literal\n throw \"The cellRenderer \" + name + \" is not found\";\n }\n else {\n return this.cellRenderMap[\"\" + name];\n }\n };\n return CellRendererFactory;\n}());\nexport { CellRendererFactory };\n","import { Dialog } from '@syncfusion/ej2-popups';\nimport { EventHandler, isNullOrUndefined, remove, Browser } from '@syncfusion/ej2-base';\nimport { parentsUntil, addBiggerDialog, addRemoveEventListener } from '../base/util';\nimport * as events from '../base/constant';\nimport { Button } from '@syncfusion/ej2-buttons';\nimport { ResponsiveDialogAction } from '../base/enum';\n/**\n *\n * The `ResponsiveDialogRenderer` module is used to render the responsive dialogs.\n */\nvar ResponsiveDialogRenderer = /** @class */ (function () {\n function ResponsiveDialogRenderer(parent, serviceLocator) {\n this.sortedCols = [];\n this.sortPredicate = [];\n /** @hidden */\n this.isCustomDialog = false;\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n this.addEventListener();\n }\n ResponsiveDialogRenderer.prototype.addEventListener = function () {\n this.evtHandlers = [{ event: events.filterDialogClose, handler: this.closeCustomDialog },\n { event: events.refreshCustomFilterOkBtn, handler: this.refreshCustomFilterOkBtn },\n { event: events.renderResponsiveCmenu, handler: this.renderResponsiveContextMenu },\n { event: events.filterCmenuSelect, handler: this.renderCustomFilterDiv },\n { event: events.customFilterClose, handler: this.customExFilterClose },\n { event: events.refreshCustomFilterClearBtn, handler: this.refreshCustomFilterClearBtn }];\n addRemoveEventListener(this.parent, this.evtHandlers, true, this);\n this.onActionCompleteFn = this.editComplate.bind(this);\n this.parent.addEventListener(events.actionComplete, this.onActionCompleteFn);\n };\n ResponsiveDialogRenderer.prototype.customExFilterClose = function () {\n this.isCustomDlgRender = false;\n };\n ResponsiveDialogRenderer.prototype.renderCustomFilterDiv = function () {\n var header = this.customResponsiveDlg.element.querySelector('.e-dlg-header-content');\n var title = header.querySelector('.e-dlg-custom-header');\n var closeBtn = header.querySelector('.e-dlg-closeicon-btn');\n this.isCustomDlgRender = true;\n this.parent.filterModule.filterModule.closeDialog();\n this.saveBtn.element.style.display = '';\n this.refreshCustomFilterOkBtn({ disabled: false });\n this.backBtn.element.style.display = 'none';\n closeBtn.style.display = '';\n title.innerHTML = this.parent.localeObj.getConstant('CustomFilter');\n var content = this.customResponsiveDlg.element.querySelector('.e-dlg-content');\n this.customExcelFilterParent = this.parent.createElement('div', { className: 'e-xl-customfilterdiv e-default-filter' });\n content.appendChild(this.customExcelFilterParent);\n };\n ResponsiveDialogRenderer.prototype.renderResponsiveContextMenu = function (args) {\n if (this.action === ResponsiveDialogAction.isFilter) {\n var content = this.customResponsiveDlg.element.querySelector('.e-dlg-content');\n var header = this.customResponsiveDlg.element.querySelector('.e-dlg-header-content');\n var closeBtn = header.querySelector('.e-dlg-closeicon-btn');\n var text = header.querySelector('.e-dlg-custom-header');\n if (args.isOpen) {\n content.firstChild.style.display = 'none';\n content.appendChild(args.target);\n closeBtn.style.display = 'none';\n this.saveBtn.element.style.display = 'none';\n this.filterClearBtn.element.style.display = 'none';\n text.innerHTML = args.header;\n var backBtn = this.parent.createElement('button');\n var span = this.parent.createElement('span', { className: 'e-btn-icon e-resfilterback e-icons' });\n backBtn.appendChild(span);\n this.backBtn = new Button({\n cssClass: this.parent.cssClass ? 'e-res-back-btn' + ' ' + this.parent.cssClass : 'e-res-back-btn'\n });\n this.backBtn.appendTo(backBtn);\n text.parentElement.insertBefore(backBtn, text);\n }\n else if (this.backBtn && !this.isCustomDlgRender) {\n content.firstChild.style.display = '';\n remove(this.backBtn.element);\n closeBtn.style.display = '';\n this.saveBtn.element.style.display = '';\n if (this.isFiltered) {\n this.filterClearBtn.element.style.display = '';\n }\n text.innerHTML = this.getHeaderTitle({ action: ResponsiveDialogAction.isFilter }, args.col);\n }\n }\n };\n ResponsiveDialogRenderer.prototype.refreshCustomFilterClearBtn = function (args) {\n if (this.filterClearBtn) {\n this.isFiltered = args.isFiltered;\n this.filterClearBtn.element.style.display = args.isFiltered ? '' : 'none';\n }\n };\n ResponsiveDialogRenderer.prototype.refreshCustomFilterOkBtn = function (args) {\n if (this.saveBtn) {\n this.saveBtn.disabled = args.disabled;\n }\n if (this.parent.columnChooserModule && this.parent.columnChooserModule.responsiveDialogRenderer.saveBtn) {\n this.parent.columnChooserModule.responsiveDialogRenderer.saveBtn.disabled = args.disabled;\n }\n };\n ResponsiveDialogRenderer.prototype.columnMenuResponsiveContent = function (str, locale, disabled) {\n var cDiv = this.parent.createElement('div', { className: 'e-responsivecoldiv e-responsive' + str.toLowerCase() + 'div' + (disabled ? ' e-disabled' : '') });\n var span = this.parent.createElement('span', { className: 'e-icons e-res' + str.toLowerCase() + '-icon e-btn-icon' });\n var icon = this.parent.createElement('span', { innerHTML: locale, className: 'e-rescolumn-menu e-res-header-text' });\n cDiv.appendChild(span);\n cDiv.appendChild(icon);\n this.customColumnDiv.appendChild(cDiv);\n };\n ResponsiveDialogRenderer.prototype.renderResponsiveContent = function (col, column) {\n var _this = this;\n var gObj = this.parent;\n var isColumnChooser = this.action === ResponsiveDialogAction.isColumnChooser;\n if (col || isColumnChooser) {\n this.filterParent = this.parent.createElement('div', { className: (isColumnChooser ? 'e-maincolumnchooserdiv ' : '') + 'e-mainfilterdiv e-default-filter',\n id: (isColumnChooser ? 'columchooser' : col.uid) + '-main-filter' });\n return this.filterParent;\n }\n else {\n this.customColumnDiv = gObj.createElement('div', { className: 'columndiv columnmenudiv', styles: 'width: 100%' });\n if (this.parent.showColumnMenu && this.parent.rowRenderingMode === 'Horizontal' && this.action === ResponsiveDialogAction.isColMenu) {\n this.columnMenuResponsiveContent('AutoFitAll', gObj.localeObj.getConstant('AutoFitAll'));\n this.columnMenuResponsiveContent('AutoFit', gObj.localeObj.getConstant('AutoFit'));\n if (column.allowGrouping && gObj.allowGrouping) {\n this.columnMenuResponsiveContent('Group', gObj.localeObj.getConstant('Group'), gObj.groupSettings.columns.indexOf(column.field) >= 0);\n this.columnMenuResponsiveContent('UnGroup', gObj.localeObj.getConstant('Ungroup'), gObj.groupSettings.columns.indexOf(column.field) < 0);\n }\n if (column.allowSorting && gObj.allowSorting) {\n var direction = 'None';\n var sortColumns = this.parent.sortSettings.columns;\n for (var i = 0; i < sortColumns.length; i++) {\n if (sortColumns[parseInt(i.toString(), 10)].field === column.field) {\n direction = sortColumns[parseInt(i.toString(), 10)].direction;\n break;\n }\n }\n this.columnMenuResponsiveContent('ascending', gObj.localeObj.getConstant('SortAscending'), direction === 'Ascending');\n this.columnMenuResponsiveContent('descending', gObj.localeObj.getConstant('SortDescending'), direction === 'Descending');\n }\n if (gObj.showColumnChooser) {\n this.columnMenuResponsiveContent('Column', gObj.localeObj.getConstant('Columnchooser'));\n }\n if (column.allowFiltering && gObj.allowFiltering) {\n this.columnMenuResponsiveContent('Filter', gObj.localeObj.getConstant('FilterMenu'));\n }\n }\n else {\n var cols = gObj.getColumns();\n var sortBtnParent = gObj.createElement('div', { className: 'e-ressortbutton-parent' });\n var filteredCols = [];\n var isSort = this.action === ResponsiveDialogAction.isSort;\n var isFilter = this.action === ResponsiveDialogAction.isFilter;\n if (isFilter) {\n for (var i = 0; i < gObj.filterSettings.columns.length; i++) {\n filteredCols.push(gObj.filterSettings.columns[parseInt(i.toString(), 10)].field);\n }\n }\n for (var i = 0; i < cols.length; i++) {\n if (!cols[parseInt(i.toString(), 10)].visible || (!cols[parseInt(i.toString(), 10)].allowSorting && isSort)\n || (!cols[parseInt(i.toString(), 10)].allowFiltering && isFilter)) {\n continue;\n }\n var cDiv = gObj.createElement('div', { className: 'e-responsivecoldiv' });\n cDiv.setAttribute('data-e-mappingname', cols[parseInt(i.toString(), 10)].field);\n cDiv.setAttribute('data-e-mappinguid', cols[parseInt(i.toString(), 10)].uid);\n var span = gObj.createElement('span', { innerHTML: cols[parseInt(i.toString(), 10)].headerText, className: 'e-res-header-text' });\n cDiv.appendChild(span);\n this.customColumnDiv.appendChild(cDiv);\n if (isSort) {\n var fields = this.getSortedFieldsAndDirections('field');\n var index = fields.indexOf(cols[parseInt(i.toString(), 10)].field);\n var button = gObj.createElement('button', { id: gObj.element.id + cols[parseInt(i.toString(), 10)].field + 'sortbutton' });\n var clone = sortBtnParent.cloneNode();\n clone.appendChild(button);\n cDiv.appendChild(clone);\n var btnObj = new Button({\n cssClass: this.parent.cssClass ? 'e-ressortbutton' + ' ' + this.parent.cssClass : 'e-ressortbutton'\n });\n btnObj.appendTo(button);\n var buttonInnerText = void 0;\n if ((!isNullOrUndefined(this.parent.sortSettings.columns[parseInt(index.toString(), 10)]))) {\n buttonInnerText = (this.parent.sortSettings.columns[parseInt(index.toString(), 10)].direction === 'Ascending') ?\n this.parent.localeObj.getConstant('AscendingText') : this.parent.localeObj.getConstant('DescendingText');\n }\n button.innerHTML = index > -1 ? buttonInnerText : this.parent.localeObj.getConstant('NoneText');\n button.onclick = function (e) {\n _this.sortButtonClickHandler(e.target);\n };\n }\n if (isFilter && filteredCols.indexOf(cols[parseInt(i.toString(), 10)].field) > -1) {\n var divIcon = gObj.createElement('div', { className: 'e-icons e-res-icon e-filtersetdiv' });\n var iconSpan = gObj.createElement('span', { className: 'e-icons e-res-icon e-filterset' });\n iconSpan.setAttribute('colType', cols[parseInt(i.toString(), 10)].type);\n divIcon.appendChild(iconSpan);\n cDiv.appendChild(divIcon);\n }\n }\n }\n EventHandler.add(this.customColumnDiv, Browser.isDevice ? 'touchend' : 'click', this.customFilterColumnClickHandler, this);\n return this.customColumnDiv;\n }\n };\n ResponsiveDialogRenderer.prototype.getSortedFieldsAndDirections = function (name) {\n var fields = [];\n for (var i = 0; i < this.parent.sortSettings.columns.length; i++) {\n fields.push(this.parent.sortSettings.columns[parseInt(i.toString(), 10)][\"\" + name]);\n }\n return fields;\n };\n ResponsiveDialogRenderer.prototype.sortButtonClickHandler = function (target) {\n if (target) {\n var columndiv = parentsUntil(target, 'e-responsivecoldiv');\n var field = columndiv.getAttribute('data-e-mappingname');\n if (!this.parent.allowMultiSorting) {\n this.sortPredicate = [];\n this.sortedCols = [];\n this.isSortApplied = false;\n this.resetSortButtons(target);\n }\n var txt = target.textContent;\n var directionTxt = txt === this.parent.localeObj.getConstant('NoneText') ? this.parent.localeObj.getConstant('AscendingText')\n : txt === this.parent.localeObj.getConstant('AscendingText') ? this.parent.localeObj.getConstant('DescendingText')\n : this.parent.localeObj.getConstant('NoneText');\n var direction = directionTxt === this.parent.localeObj.getConstant('AscendingText') ? 'Ascending'\n : directionTxt === this.parent.localeObj.getConstant('DescendingText') ? 'Descending' : 'None';\n target.innerHTML = directionTxt;\n this.setSortedCols(field, direction);\n }\n };\n ResponsiveDialogRenderer.prototype.resetSortButtons = function (target) {\n var buttons = [].slice.call(this.customColumnDiv.getElementsByClassName('e-ressortbutton'));\n for (var i = 0; i < buttons.length; i++) {\n if (buttons[parseInt(i.toString(), 10)] !== target) {\n buttons[parseInt(i.toString(), 10)].innerHTML = 'None';\n }\n }\n };\n ResponsiveDialogRenderer.prototype.setSortedCols = function (field, direction) {\n var fields = this.getCurrentSortedFields();\n var index = fields.indexOf(field);\n if (this.parent.allowMultiSorting && index > -1) {\n this.sortedCols.splice(index, 1);\n this.sortPredicate.splice(index, 1);\n }\n this.isSortApplied = true;\n if (direction !== 'None') {\n this.sortedCols.push(field);\n this.sortPredicate.push({ field: field, direction: direction });\n }\n };\n ResponsiveDialogRenderer.prototype.getCurrentSortedFields = function () {\n var fields = [];\n for (var i = 0; i < this.sortedCols.length; i++) {\n fields.push(this.sortedCols[parseInt(i.toString(), 10)]);\n }\n return fields;\n };\n ResponsiveDialogRenderer.prototype.customFilterColumnClickHandler = function (e) {\n var gObj = this.parent;\n var target = e.target;\n if (parentsUntil(target, 'columnmenudiv') && this.action === ResponsiveDialogAction.isColMenu && !parentsUntil(target, 'e-disabled')) {\n var column = this.menuCol ? this.menuCol : this.filteredCol;\n if (parentsUntil(target, 'e-responsiveautofitalldiv')) {\n gObj.autoFitColumns([]);\n this.closeCustomFilter();\n }\n else if (parentsUntil(target, 'e-responsiveautofitdiv')) {\n gObj.autoFitColumns(column.field);\n this.closeCustomFilter();\n }\n else if (parentsUntil(target, 'e-responsivegroupdiv')) {\n gObj.groupColumn(column.field);\n this.closeCustomFilter();\n }\n else if (parentsUntil(target, 'e-responsiveungroupdiv')) {\n gObj.ungroupColumn(column.field);\n this.closeCustomFilter();\n }\n else if (parentsUntil(target, 'e-responsiveascendingdiv')) {\n gObj.sortColumn(column.field, 'Ascending');\n this.closeCustomFilter();\n }\n else if (parentsUntil(target, 'e-responsivedescendingdiv')) {\n gObj.sortColumn(column.field, 'Descending');\n this.closeCustomFilter();\n }\n else if (parentsUntil(target, 'e-responsivecolumndiv')) {\n gObj.notify(events.renderResponsiveChangeAction, { action: 5 });\n gObj.showResponsiveCustomColumnChooser();\n }\n else if (parentsUntil(target, 'e-responsivefilterdiv')) {\n gObj.notify(events.renderResponsiveChangeAction, { action: 3 });\n this.isRowResponsive = true;\n this.isCustomDialog = false;\n if (gObj.filterModule) {\n gObj.filterModule.responsiveDialogRenderer.showResponsiveDialog(column);\n }\n }\n e.preventDefault();\n }\n if (this.action !== ResponsiveDialogAction.isFilter) {\n return;\n }\n if (gObj.filterSettings.type !== 'FilterBar') {\n if (target.classList.contains('e-responsivecoldiv') || target.parentElement.classList.contains('e-responsivecoldiv')) {\n var field = target.getAttribute('data-e-mappingname');\n if (!field) {\n field = target.parentElement.getAttribute('data-e-mappingname');\n }\n if (field) {\n var col = gObj.getColumnByField(field);\n this.isRowResponsive = true;\n this.showResponsiveDialog(col);\n }\n }\n else if (target.classList.contains('e-filterset') || target.parentElement.classList.contains('e-filtersetdiv')) {\n var colDiv = parentsUntil(target, 'e-responsivecoldiv');\n if (colDiv) {\n var field = colDiv.getAttribute('data-e-mappingname');\n var col = gObj.getColumnByField(field);\n if (col.filter.type === 'Menu' || (!col.filter.type && gObj.filterSettings.type === 'Menu')) {\n this.isDialogClose = true;\n }\n this.parent.filterModule.filterModule.clearCustomFilter(col);\n this.removeCustomDlgFilterEle(target);\n }\n }\n }\n };\n /**\n * Function to show the responsive dialog\n *\n * @param {Column} col - specifies the filter column\n * @param {Column} column - specifies the menu column\n * @returns {void}\n */\n ResponsiveDialogRenderer.prototype.showResponsiveDialog = function (col, column) {\n if ((this.isCustomDialog && this.action === ResponsiveDialogAction.isFilter && !this.isRowResponsive) ||\n (column && this.action === ResponsiveDialogAction.isColMenu)) {\n this.menuCol = column;\n this.renderCustomFilterDialog(null, column);\n }\n else {\n this.filteredCol = col;\n this.renderResponsiveDialog(col);\n if (this.parent.enableAdaptiveUI && col) {\n this.parent.filterModule.setFilterModel(col);\n this.parent.filterModule.filterModule.openDialog(this.parent.filterModule.createOptions(col, undefined));\n }\n if (this.action === ResponsiveDialogAction.isColumnChooser) {\n this.parent.notify(events.renderResponsiveColumnChooserDiv, { action: 'open' });\n }\n if (this.action === ResponsiveDialogAction.isSort) {\n var args = {\n cancel: false, dialogObj: this.customResponsiveDlg, requestType: 'beforeOpenAptiveSortDialog'\n };\n this.parent.trigger(events.beforeOpenAdaptiveDialog, args);\n if (args.cancel) {\n return;\n }\n }\n this.customResponsiveDlg.show(true);\n this.customResponsiveDlg.element.style.maxHeight = '100%';\n this.setTopToChildDialog(this.customResponsiveDlg.element);\n }\n };\n ResponsiveDialogRenderer.prototype.setTopToChildDialog = function (dialogEle) {\n var child = dialogEle.querySelector('.e-dialog');\n if (child) {\n var top_1 = dialogEle.querySelector('.e-dlg-header-content').getBoundingClientRect().height;\n child.style.top = top_1 + 'px';\n }\n };\n ResponsiveDialogRenderer.prototype.renderCustomFilterDialog = function (col, column) {\n var gObj = this.parent;\n var isColMenu = this.action === ResponsiveDialogAction.isColMenu;\n if (this.action === ResponsiveDialogAction.isFilter && gObj.filterSettings.type === 'FilterBar') {\n return;\n }\n var colMenu = isColMenu ? 'e-customcolumnmenudiv ' : '';\n var outerDiv = this.parent.createElement('div', {\n id: gObj.element.id + (isColMenu ? 'customcolumnmenu' : 'customfilter'),\n className: this.parent.cssClass ? colMenu +\n 'e-customfilterdiv e-responsive-dialog ' + this.parent.cssClass : colMenu + 'e-customfilterdiv e-responsive-dialog'\n });\n this.parent.element.appendChild(outerDiv);\n this.customFilterDlg = this.getDialogOptions(col, true, null, column);\n var args = {\n cancel: false, dialogObj: this.customFilterDlg, requestType: 'beforeOpenAptiveFilterDialog'\n };\n this.parent.trigger(events.beforeOpenAdaptiveDialog, args);\n if (args.cancel) {\n return;\n }\n this.customFilterDlg.appendTo(outerDiv);\n this.customFilterDlg.show(true);\n this.customFilterDlg.element.style.maxHeight = '100%';\n };\n ResponsiveDialogRenderer.prototype.getDialogOptions = function (col, isCustomFilter, id, column) {\n var options = new Dialog({\n isModal: true,\n showCloseIcon: true,\n closeOnEscape: false,\n locale: this.parent.locale,\n target: this.parent.adaptiveDlgTarget ? this.parent.adaptiveDlgTarget : document.body,\n visible: false,\n enableRtl: this.parent.enableRtl,\n content: this.renderResponsiveContent(col, column),\n open: this.dialogOpen.bind(this),\n created: this.dialogCreated.bind(this),\n close: this.beforeDialogClose.bind(this),\n width: '100%',\n height: '100%',\n animationSettings: { effect: 'None' },\n cssClass: this.parent.cssClass ? this.parent.cssClass : ''\n });\n var isStringTemplate = 'isStringTemplate';\n options[\"\" + isStringTemplate] = true;\n if (isCustomFilter) {\n options.header = this.renderResponsiveHeader(col, undefined, true);\n var colMenu = this.action === ResponsiveDialogAction.isColMenu ? 'e-customcolumnmenu ' : '';\n options.cssClass = colMenu + 'e-customfilter';\n }\n else {\n options.header = this.renderResponsiveHeader(col);\n options.cssClass = this.parent.rowRenderingMode === 'Vertical' && this.action === ResponsiveDialogAction.isFilter\n ? 'e-res' + id + ' e-row-responsive-filter' : 'e-res' + id;\n }\n return options;\n };\n ResponsiveDialogRenderer.prototype.renderResponsiveDialog = function (col) {\n var gObj = this.parent;\n if (this.action === ResponsiveDialogAction.isFilter && gObj.filterSettings.type === 'FilterBar') {\n return;\n }\n var id = this.action === ResponsiveDialogAction.isFilter ? 'filter' : 'sort';\n id = this.action === ResponsiveDialogAction.isColumnChooser ? 'columnchooser' : id;\n var outerDiv = this.parent.createElement('div', {\n id: gObj.element.id + 'responsive' + id,\n className: this.parent.cssClass ?\n 'e-res' + id + 'div e-responsive-dialog ' + this.parent.cssClass : 'e-res' + id + 'div e-responsive-dialog'\n });\n this.parent.element.appendChild(outerDiv);\n this.customResponsiveDlg = this.getDialogOptions(col, false, id);\n this.customResponsiveDlg.appendTo(outerDiv);\n };\n ResponsiveDialogRenderer.prototype.dialogCreated = function () {\n addBiggerDialog(this.parent);\n };\n ResponsiveDialogRenderer.prototype.dialogOpen = function () {\n if (this.action === ResponsiveDialogAction.isSort && this.parent.allowMultiSorting) {\n for (var i = 0; i < this.parent.sortSettings.columns.length; i++) {\n this.sortedCols.push(this.parent.sortSettings.columns[parseInt(i.toString(), 10)].field);\n var sortField = this.parent.sortSettings.columns[parseInt(i.toString(), 10)].field;\n var sortDirection = this.parent.sortSettings.columns[parseInt(i.toString(), 10)].direction;\n this.sortPredicate.push({ field: sortField, direction: sortDirection });\n }\n }\n };\n ResponsiveDialogRenderer.prototype.beforeDialogClose = function (args) {\n this.isDialogClose = args.element && !args.element.querySelector('.e-xl-customfilterdiv')\n && args.element.classList.contains('e-resfilterdiv');\n if (this.action === ResponsiveDialogAction.isFilter) {\n if (args.element.classList.contains('e-resfilterdiv')) {\n this.parent.filterModule.filterModule.closeResponsiveDialog(this.isCustomDlgRender);\n }\n else if (args.element.classList.contains('e-customfilterdiv')) {\n this.closeCustomFilter();\n }\n if (this.parent.rowRenderingMode === 'Horizontal' && this.parent.showColumnMenu) {\n this.parent.notify(events.renderResponsiveChangeAction, { action: 4 });\n var custom = document.querySelector('.e-resfilter');\n if (custom) {\n remove(custom);\n }\n }\n }\n else if (this.action === ResponsiveDialogAction.isSort) {\n this.closeCustomDialog();\n }\n else if (this.action === ResponsiveDialogAction.isColMenu) {\n this.closeCustomFilter();\n var custom = document.querySelector('.e-rescolummenu');\n if (custom) {\n remove(custom);\n }\n }\n else if (this.action === ResponsiveDialogAction.isColumnChooser) {\n this.parent.notify(events.renderResponsiveColumnChooserDiv, { action: 'clear' });\n var custom = document.querySelector('.e-rescolumnchooser');\n if (custom) {\n remove(custom);\n }\n if (this.parent.rowRenderingMode === 'Horizontal' && this.parent.showColumnMenu) {\n this.parent.notify(events.renderResponsiveChangeAction, { action: 4 });\n }\n this.isCustomDialog = false;\n this.isDialogClose = false;\n }\n this.parent.off(events.enterKeyHandler, this.keyHandler);\n };\n ResponsiveDialogRenderer.prototype.sortColumn = function () {\n if (!this.isSortApplied) {\n this.closeCustomDialog();\n return;\n }\n if (this.sortPredicate.length) {\n this.parent.setProperties({ sortSettings: { columns: [] } }, true);\n }\n for (var i = 0; i < this.sortPredicate.length; i++) {\n this.parent.sortColumn(this.sortPredicate[parseInt(i.toString(), 10)].field, this.sortPredicate[parseInt(i.toString(), 10)].direction, this.parent.allowMultiSorting);\n }\n if (!this.sortPredicate.length) {\n this.parent.clearSorting();\n }\n this.closeCustomDialog();\n };\n ResponsiveDialogRenderer.prototype.getHeaderTitle = function (args, col) {\n var gObj = this.parent;\n var title;\n if (this.action === ResponsiveDialogAction.isEdit) {\n title = gObj.localeObj.getConstant('EditFormTitle') + args.primaryKeyValue[0];\n }\n else if (this.action === ResponsiveDialogAction.isAdd) {\n title = gObj.localeObj.getConstant('AddFormTitle');\n }\n else if (this.action === ResponsiveDialogAction.isFilter) {\n title = col ? col.headerText || col.field : gObj.localeObj.getConstant('FilterButton');\n }\n else if (this.action === ResponsiveDialogAction.isSort) {\n title = gObj.localeObj.getConstant('Sort');\n }\n else if (this.action === ResponsiveDialogAction.isColMenu) {\n title = gObj.localeObj.getConstant('ColumnMenu');\n }\n else if (this.action === ResponsiveDialogAction.isColumnChooser) {\n title = gObj.localeObj.getConstant('ChooseColumns');\n }\n return title;\n };\n ResponsiveDialogRenderer.prototype.getDialogName = function (action) {\n var name;\n if (action === ResponsiveDialogAction.isAdd || action === ResponsiveDialogAction.isEdit) {\n name = 'dialogEdit_wrapper_title';\n }\n else if (action === ResponsiveDialogAction.isFilter) {\n name = 'responsive_filter_dialog_wrapper';\n }\n else if (action === ResponsiveDialogAction.isColumnChooser) {\n name = 'responsive_column_chooser_dialog_wrapper';\n }\n return name;\n };\n ResponsiveDialogRenderer.prototype.getButtonText = function (action) {\n var text;\n if (action === ResponsiveDialogAction.isAdd || action === ResponsiveDialogAction.isEdit) {\n text = 'Save';\n }\n else if (action === ResponsiveDialogAction.isFilter || this.action === ResponsiveDialogAction.isSort ||\n action === ResponsiveDialogAction.isColumnChooser || this.action === ResponsiveDialogAction.isColumnChooser) {\n text = 'OKButton';\n }\n return text;\n };\n /**\n * Function to render the responsive header\n *\n * @param {Column} col - specifies the column\n * @param {ResponsiveDialogArgs} args - specifies the responsive dialog arguments\n * @param {boolean} isCustomFilter - specifies whether it is custom filter or not\n * @returns {HTMLElement | string} returns the html element or string\n */\n ResponsiveDialogRenderer.prototype.renderResponsiveHeader = function (col, args, isCustomFilter) {\n var _this = this;\n var gObj = this.parent;\n gObj.on(events.enterKeyHandler, this.keyHandler, this);\n var id = gObj.element.id + this.getDialogName(this.action);\n var header = gObj.createElement('div', { className: 'e-res-custom-element' });\n var titleDiv = gObj.createElement('div', { className: 'e-dlg-custom-header', id: id });\n titleDiv.innerHTML = this.getHeaderTitle(args, col);\n header.appendChild(titleDiv);\n var saveBtn = gObj.createElement('button');\n if (!isCustomFilter) {\n this.saveBtn = new Button({\n cssClass: this.parent.cssClass ?\n 'e-primary e-flat e-res-apply-btn' + ' ' + this.parent.cssClass : 'e-primary e-flat e-res-apply-btn'\n });\n saveBtn.innerHTML = gObj.localeObj.getConstant(this.getButtonText(this.action));\n this.saveBtn.appendTo(saveBtn);\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n saveBtn.onclick = function (e) {\n _this.dialogHdrBtnClickHandler();\n };\n }\n var isSort = this.action === ResponsiveDialogAction.isSort;\n var isFilter = this.action === ResponsiveDialogAction.isFilter;\n if (isFilter || isSort) {\n var id_1 = isSort ? 'sort' : 'filter';\n var clearBtn = gObj.createElement('button');\n this.filterClearBtn = new Button({\n cssClass: this.parent.cssClass ? 'e-primary e-flat e-res-' + id_1 + '-clear-btn' + ' ' + this.parent.cssClass\n : 'e-primary e-flat e-res-' + id_1 + '-clear-btn'\n });\n if (isFilter) {\n var span = gObj.createElement('span', { className: 'e-btn-icon e-icon-filter-clear e-icons' });\n clearBtn.appendChild(span);\n }\n else {\n clearBtn.innerHTML = gObj.localeObj.getConstant('Clear');\n }\n header.appendChild(clearBtn);\n this.filterClearBtn.appendTo(clearBtn);\n clearBtn.onclick = function (e) {\n if ((parentsUntil(e.target, 'e-customfilter'))) {\n _this.parent.filterModule.clearFiltering();\n _this.removeCustomDlgFilterEle();\n }\n else {\n if (isFilter) {\n _this.filterClear();\n }\n else {\n _this.resetSortButtons();\n _this.sortedCols = [];\n _this.sortPredicate = [];\n _this.isSortApplied = true;\n }\n }\n };\n header.appendChild(clearBtn);\n }\n if (!isCustomFilter) {\n header.appendChild(saveBtn);\n }\n return header;\n };\n ResponsiveDialogRenderer.prototype.filterClear = function () {\n this.parent.filterModule.filterModule.clearCustomFilter(this.filteredCol);\n this.parent.filterModule.filterModule.closeResponsiveDialog();\n };\n ResponsiveDialogRenderer.prototype.removeCustomFilterElement = function () {\n var elem = document.getElementById(this.parent.element.id + 'customcolumnmenu');\n if (elem) {\n remove(elem);\n var custom = document.querySelector('.e-customfilter');\n if (custom) {\n remove(custom);\n }\n }\n var custommenu = document.querySelector('.e-rescolumnchooser');\n if (custommenu) {\n remove(custommenu);\n }\n };\n ResponsiveDialogRenderer.prototype.dialogHdrBtnClickHandler = function () {\n if (this.action === ResponsiveDialogAction.isEdit || this.action === ResponsiveDialogAction.isAdd) {\n this.parent.endEdit();\n }\n else if (this.action === ResponsiveDialogAction.isFilter) {\n this.parent.filterModule.filterModule.applyCustomFilter({ col: this.filteredCol, isCustomFilter: this.isCustomDlgRender });\n this.removeCustomFilterElement();\n }\n else if (this.action === ResponsiveDialogAction.isSort) {\n this.sortColumn();\n this.removeCustomFilterElement();\n }\n else if (this.action === ResponsiveDialogAction.isColumnChooser) {\n this.parent.notify(events.renderResponsiveColumnChooserDiv, { action: 'confirm' });\n this.removeCustomFilterElement();\n this.isCustomDialog = false;\n this.isDialogClose = false;\n }\n };\n ResponsiveDialogRenderer.prototype.closeCustomDialog = function () {\n if (this.isCustomDlgRender) {\n var mainfilterdiv = this.customResponsiveDlg.element.querySelector('.e-mainfilterdiv');\n remove(mainfilterdiv);\n return;\n }\n this.isRowResponsive = false;\n this.isCustomDlgRender = false;\n this.destroyCustomFilterDialog();\n };\n ResponsiveDialogRenderer.prototype.destroyCustomFilterDialog = function () {\n if (!this.customResponsiveDlg) {\n return;\n }\n var elem = document.getElementById(this.customResponsiveDlg.element.id);\n if (this.customResponsiveDlg && !this.customResponsiveDlg.isDestroyed && elem) {\n this.customResponsiveDlg.destroy();\n remove(elem);\n }\n this.closeCustomFilter();\n if (this.action === ResponsiveDialogAction.isSort) {\n this.sortPredicate = [];\n this.sortedCols = [];\n this.isSortApplied = false;\n }\n };\n ResponsiveDialogRenderer.prototype.closeCustomFilter = function () {\n if (!this.isDialogClose && this.customFilterDlg) {\n var customEle = document.getElementById(this.customFilterDlg.element.id);\n if (this.customFilterDlg && !this.customFilterDlg.isDestroyed && customEle) {\n this.customFilterDlg.destroy();\n remove(customEle);\n }\n }\n this.isCustomDialog = false;\n this.isDialogClose = false;\n };\n ResponsiveDialogRenderer.prototype.removeCustomDlgFilterEle = function (target) {\n if (target) {\n if (target.parentElement.classList.contains('e-filtersetdiv')) {\n remove(target.parentElement);\n }\n else {\n remove(target);\n }\n }\n else {\n var child = this.customColumnDiv.children;\n for (var i = 0; i < child.length; i++) {\n target = child[parseInt(i.toString(), 10)].querySelector('.e-filtersetdiv');\n if (target) {\n remove(target);\n i--;\n }\n }\n }\n };\n ResponsiveDialogRenderer.prototype.keyHandler = function (e) {\n if (e.keyCode === 13 && ((this.action === ResponsiveDialogAction.isFilter\n && e.target.classList.contains('e-searchinput'))\n || (this.action === ResponsiveDialogAction.isEdit || this.action === ResponsiveDialogAction.isAdd))) {\n this.dialogHdrBtnClickHandler();\n }\n };\n ResponsiveDialogRenderer.prototype.editComplate = function (args) {\n if (args.requestType === 'save' || args.requestType === 'cancel') {\n this.parent.off(events.enterKeyHandler, this.keyHandler);\n }\n };\n ResponsiveDialogRenderer.prototype.removeEventListener = function () {\n if (this.customColumnDiv) {\n EventHandler.remove(this.customColumnDiv, Browser.isDevice ? 'touchend' : 'click', this.customFilterColumnClickHandler);\n }\n addRemoveEventListener(this.parent, this.evtHandlers, true, this);\n this.parent.removeEventListener(events.actionComplete, this.onActionCompleteFn);\n };\n return ResponsiveDialogRenderer;\n}());\nexport { ResponsiveDialogRenderer };\n","import { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { ResponsiveDialogRenderer } from '../renderer/responsive-dialog-renderer';\n/**\n * ServiceLocator\n *\n * @hidden\n */\nvar ServiceLocator = /** @class */ (function () {\n function ServiceLocator() {\n this.services = {};\n }\n ServiceLocator.prototype.register = function (name, type) {\n if (isNullOrUndefined(this.services[\"\" + name])) {\n this.services[\"\" + name] = type;\n }\n };\n ServiceLocator.prototype.getService = function (name) {\n if (isNullOrUndefined(this.services[\"\" + name])) {\n // eslint-disable-next-line no-throw-literal\n throw \"The service \" + name + \" is not registered\";\n }\n return this.services[\"\" + name];\n };\n ServiceLocator.prototype.registerAdaptiveService = function (type, isAdaptiveUI, action) {\n if (isAdaptiveUI) {\n type.responsiveDialogRenderer = new ResponsiveDialogRenderer(type.parent, type.serviceLocator);\n type.responsiveDialogRenderer.action = action;\n }\n else {\n if (type.responsiveDialogRenderer) {\n type.responsiveDialogRenderer.removeEventListener();\n type.responsiveDialogRenderer = undefined;\n }\n }\n };\n return ServiceLocator;\n}());\nexport { ServiceLocator };\n","import { isNullOrUndefined, getEnumValue } from '@syncfusion/ej2-base';\nimport { RenderType } from '../base/enum';\n/**\n * RendererFactory\n *\n * @hidden\n */\nvar RendererFactory = /** @class */ (function () {\n function RendererFactory() {\n this.rendererMap = {};\n }\n RendererFactory.prototype.addRenderer = function (name, type) {\n var rName = getEnumValue(RenderType, name);\n if (isNullOrUndefined(this.rendererMap[\"\" + rName])) {\n this.rendererMap[\"\" + rName] = type;\n }\n };\n RendererFactory.prototype.getRenderer = function (name) {\n var rName = getEnumValue(RenderType, name);\n if (isNullOrUndefined(this.rendererMap[\"\" + rName])) {\n // eslint-disable-next-line no-throw-literal\n throw \"The renderer \" + rName + \" is not found\";\n }\n else {\n return this.rendererMap[\"\" + rName];\n }\n };\n return RendererFactory;\n}());\nexport { RendererFactory };\n","import { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { formatUnit } from '@syncfusion/ej2-base';\nimport { columnWidthChanged, preventFrozenScrollRefresh } from '../base/constant';\nimport { Column } from '../models/column';\nimport { parentsUntil, ispercentageWidth, getScrollBarWidth } from '../base/util';\nimport * as literals from '../base/string-literals';\n/**\n * ColumnWidthService\n *\n * @hidden\n */\nvar ColumnWidthService = /** @class */ (function () {\n function ColumnWidthService(parent) {\n this.parent = parent;\n }\n ColumnWidthService.prototype.setWidthToColumns = function () {\n var i = 0;\n var indexes = this.parent.getColumnIndexesInView();\n var wFlag = true;\n var totalColumnsWidth = 0;\n if (this.parent.allowGrouping) {\n for (var len = this.parent.groupSettings.columns.length; i < len; i++) {\n if (this.parent.enableColumnVirtualization && indexes.indexOf(i) === -1) {\n wFlag = false;\n continue;\n }\n this.setColumnWidth(new Column({ width: '30px' }), i);\n }\n }\n if (this.parent.detailTemplate || this.parent.childGrid) {\n this.setColumnWidth(new Column({ width: '30px' }), i);\n i++;\n }\n if (this.parent.isRowDragable() && this.parent.getFrozenMode() !== 'Right') {\n this.setColumnWidth(new Column({ width: '30px' }), i);\n i++;\n }\n var columns = this.parent.getColumns();\n for (var j = 0; j < columns.length; j++) {\n this.setColumnWidth(columns[parseInt(j.toString(), 10)], wFlag && this.parent.enableColumnVirtualization ? undefined : j + i);\n }\n if (this.parent.isRowDragable() && this.parent.getFrozenMode() === 'Right') {\n this.setColumnWidth(new Column({ width: '30px' }), this.parent.groupSettings.columns.length + columns.length);\n }\n totalColumnsWidth = this.getTableWidth(this.parent.getColumns());\n if (this.parent.width !== 'auto' && this.parent.width.toString().indexOf('%') === -1) {\n this.setMinwidthBycalculation(totalColumnsWidth);\n }\n };\n ColumnWidthService.prototype.setMinwidthBycalculation = function (tWidth) {\n var difference = 0;\n var collection = this.parent.getColumns().filter(function (a) {\n return isNullOrUndefined(a.width) || a.width === 'auto';\n });\n if (collection.length) {\n if (!isNullOrUndefined(this.parent.width) && this.parent.width !== 'auto' &&\n typeof (this.parent.width) === 'string' && this.parent.width.indexOf('%') === -1) {\n difference = (typeof this.parent.width === 'string' ? parseInt(this.parent.width, 10) : this.parent.width) - tWidth;\n }\n else {\n difference = this.parent.element.getBoundingClientRect().width - tWidth;\n }\n var tmWidth = 0;\n for (var _i = 0, collection_1 = collection; _i < collection_1.length; _i++) {\n var cols = collection_1[_i];\n tmWidth += !isNullOrUndefined(cols.minWidth) ?\n ((typeof cols.minWidth === 'string' ? parseInt(cols.minWidth, 10) : cols.minWidth)) : 0;\n }\n for (var i = 0; i < collection.length; i++) {\n if (tWidth === 0 && this.parent.allowResizing && this.isWidthUndefined() && (i !== collection.length - 1)) {\n this.setUndefinedColumnWidth(collection);\n }\n var index = this.parent.getColumnIndexByField(collection[parseInt(i.toString(), 10)].field) + this.parent.getIndentCount();\n if (tWidth !== 0 && difference < tmWidth) {\n this.setWidth(collection[parseInt(i.toString(), 10)].minWidth, index);\n }\n else if (tWidth !== 0 && difference > tmWidth) {\n this.setWidth('', index, true);\n }\n }\n }\n };\n ColumnWidthService.prototype.setUndefinedColumnWidth = function (collection) {\n for (var k = 0; k < collection.length; k++) {\n if (k !== collection.length - 1) {\n collection[parseInt(k.toString(), 10)].width = 200;\n this.setWidth(200, this.parent.getColumnIndexByField(collection[parseInt(k.toString(), 10)].field));\n }\n }\n };\n ColumnWidthService.prototype.setColumnWidth = function (column, index, module) {\n if (this.parent.getColumns().length < 1) {\n return;\n }\n var columnIndex = isNullOrUndefined(index) ? this.parent.getNormalizedColumnIndex(column.uid) : index;\n var cWidth = this.getWidth(column);\n var tgridWidth = this.getTableWidth(this.parent.getColumns());\n if (cWidth !== null) {\n this.setWidth(cWidth, columnIndex);\n if (this.parent.width !== 'auto' && this.parent.width.toString().indexOf('%') === -1) {\n this.setMinwidthBycalculation(tgridWidth);\n }\n if ((this.parent.allowResizing && module === 'resize') || (this.parent.getFrozenColumns() && this.parent.allowResizing)) {\n this.setWidthToTable();\n }\n this.parent.notify(columnWidthChanged, { index: columnIndex, width: cWidth, column: column, module: module });\n }\n };\n ColumnWidthService.prototype.setWidth = function (width, index, clear) {\n if (this.parent.groupSettings.columns.length > index && ispercentageWidth(this.parent)) {\n var elementWidth = this.parent.element.offsetWidth;\n width = (30 / elementWidth * 100).toFixed(1) + '%';\n }\n var header = this.parent.getHeaderTable();\n var content = this.parent.getContentTable();\n var fWidth = formatUnit(width);\n var headerCol = header.querySelector(literals.colGroup)\n .children[parseInt(index.toString(), 10)];\n if (headerCol && !clear) {\n headerCol.style.width = fWidth;\n }\n else if (headerCol && clear) {\n headerCol.style.width = '';\n }\n var contentCol = content.querySelector(literals.colGroup).children[parseInt(index.toString(), 10)];\n if (contentCol && !clear) {\n contentCol.style.width = fWidth;\n }\n else if (contentCol && clear) {\n contentCol.style.width = '';\n }\n if (!this.parent.enableColumnVirtualization && this.parent.isEdit) {\n var edit = this.parent.element.querySelectorAll('.e-table.e-inline-edit');\n var editTableCol = [];\n for (var i = 0; i < edit.length; i++) {\n if (parentsUntil(edit[parseInt(i.toString(), 10)], 'e-grid').id === this.parent.element.id) {\n for (var j = 0; j < edit[parseInt(i.toString(), 10)].querySelector('colgroup').children.length; j++) {\n editTableCol.push(edit[parseInt(i.toString(), 10)].querySelector('colgroup').children[parseInt(j.toString(), 10)]);\n }\n }\n }\n if (edit.length && editTableCol.length && editTableCol[parseInt(index.toString(), 10)]) {\n editTableCol[parseInt(index.toString(), 10)].style.width = fWidth;\n }\n }\n if (this.parent.isFrozenGrid() && this.parent.enableColumnVirtualization) {\n this.refreshFrozenScrollbar();\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n ColumnWidthService.prototype.refreshFrozenScrollbar = function () {\n var args = { cancel: false };\n this.parent.notify(preventFrozenScrollRefresh, args);\n if (args.cancel) {\n return;\n }\n var scrollWidth = getScrollBarWidth();\n var movableScrollbar = this.parent.element.querySelector('.e-movablescrollbar');\n var movableWidth = this.parent.getContent().firstElementChild.getBoundingClientRect().width;\n if (this.parent.enableColumnVirtualization) {\n var placeHolder = this.parent.getContent().querySelector('.e-virtualtrack');\n if (placeHolder) {\n movableWidth = placeHolder.scrollWidth;\n }\n }\n if (this.parent.height !== 'auto') {\n movableWidth = movableWidth + scrollWidth;\n }\n movableScrollbar.firstElementChild.style.width = movableWidth + 'px';\n };\n ColumnWidthService.prototype.getSiblingsHeight = function (element) {\n var previous = this.getHeightFromDirection(element, 'previous');\n var next = this.getHeightFromDirection(element, 'next');\n return previous + next;\n };\n ColumnWidthService.prototype.getHeightFromDirection = function (element, direction) {\n var sibling = element[direction + 'ElementSibling'];\n var result = 0;\n var classList = [literals.gridHeader, literals.gridFooter, 'e-groupdroparea', 'e-gridpager', 'e-toolbar', 'e-temp-toolbar'];\n while (sibling) {\n if (classList.some(function (value) { return sibling.classList.contains(value); })) {\n result += sibling.offsetHeight;\n }\n sibling = sibling[direction + 'ElementSibling'];\n }\n return result;\n };\n ColumnWidthService.prototype.isWidthUndefined = function () {\n var isWidUndefCount = this.parent.getColumns().filter(function (col) {\n return isNullOrUndefined(col.width) && isNullOrUndefined(col.minWidth);\n }).length;\n return (this.parent.getColumns().length === isWidUndefCount);\n };\n ColumnWidthService.prototype.getWidth = function (column) {\n if (isNullOrUndefined(column.width) && this.parent.allowResizing\n && isNullOrUndefined(column.minWidth) && !this.isWidthUndefined()) {\n column.width = 200;\n }\n if (!column.width) {\n return null;\n }\n var width = parseInt(column.width.toString(), 10);\n if (column.minWidth && width < parseInt(column.minWidth.toString(), 10)) {\n return column.minWidth;\n }\n else if ((column.maxWidth && width > parseInt(column.maxWidth.toString(), 10))) {\n return column.maxWidth;\n }\n else {\n return column.width;\n }\n };\n ColumnWidthService.prototype.getTableWidth = function (columns) {\n var tWidth = 0;\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var column = columns_1[_i];\n var cWidth = this.getWidth(column);\n if (column.width === 'auto') {\n cWidth = 0;\n }\n if (column.visible !== false && cWidth !== null) {\n tWidth += parseInt(cWidth.toString(), 10);\n }\n }\n return tWidth;\n };\n ColumnWidthService.prototype.setWidthToTable = function () {\n var tWidth = formatUnit(this.getTableWidth(this.parent.getColumns()));\n if (this.parent.detailTemplate || this.parent.childGrid) {\n this.setColumnWidth(new Column({ width: '30px' }));\n }\n tWidth = this.isAutoResize() ? '100%' : tWidth;\n this.parent.getHeaderTable().style.width = tWidth;\n this.parent.getContentTable().style.width = tWidth;\n var edit = this.parent.element.querySelector('.e-table.e-inline-edit');\n if (edit) {\n edit.style.width = tWidth;\n }\n };\n ColumnWidthService.prototype.isAutoResize = function () {\n return this.parent.allowResizing && this.parent.resizeSettings.mode === 'Auto';\n };\n return ColumnWidthService;\n}());\nexport { ColumnWidthService };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { EventHandler, getValue, closest, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, extend, Browser } from '@syncfusion/ej2-base';\nimport { CellType } from '../base/enum';\nimport * as event from '../base/constant';\nimport { Row } from '../models/row';\nimport { RowModelGenerator } from './row-model-generator';\nimport { parentsUntil, addRemoveEventListener, findCellIndex } from '../base/util';\nimport * as literals from '../base/string-literals';\n/**\n * FocusStrategy class\n *\n * @hidden\n */\nvar FocusStrategy = /** @class */ (function () {\n function FocusStrategy(parent) {\n this.currentInfo = {};\n this.oneTime = true;\n this.swap = {};\n /** @hidden */\n this.isInfiniteScroll = false;\n this.forget = false;\n this.skipFocus = true;\n this.focusByClick = false;\n this.firstHeaderCellClick = false;\n this.prevIndexes = {};\n this.refMatrix = this.refreshMatrix(true);\n this.actions = ['downArrow', 'upArrow'];\n this.isVirtualScroll = false;\n this.groupedFrozenRow = 0;\n this.parent = parent;\n this.rowModelGen = new RowModelGenerator(this.parent);\n this.addEventListener();\n }\n FocusStrategy.prototype.focusCheck = function (e) {\n var target = e.target;\n this.focusByClick = true;\n this.firstHeaderCellClick = true;\n this.skipFocus = target.classList.contains('e-grid');\n };\n FocusStrategy.prototype.onFocus = function (e) {\n if (this.parent.isDestroyed || Browser.isDevice || this.parent.enableVirtualization\n || this.parent.element.querySelector('.e-masked-table') || (!this.parent.isInitialLoad && e\n && e.target === this.parent.element && this.parent.element.querySelector('.e-spin-show'))) {\n return;\n }\n this.setActive(!this.parent.enableHeaderFocus && this.parent.frozenRows === 0);\n if (!this.parent.enableHeaderFocus && !this.parent.getCurrentViewRecords().length && ((this.parent.editSettings.mode !== 'Batch')\n || (this.parent.editSettings.mode === 'Batch' && this.parent.editModule && !this.parent.editModule.getBatchChanges()[literals.addedRecords].length))) {\n this.getContent().matrix.\n generate(this.rowModelGen.generateRows({ rows: [new Row({ isDataRow: true })] }), this.getContent().selector, false);\n }\n var current = this.getContent().matrix.get(0, -1, [0, 1], null, this.getContent().validator());\n this.getContent().matrix.select(current[0], current[1]);\n if (this.skipFocus && !(e && e.target === this.parent.element)) {\n this.focus(e);\n this.skipFocus = false;\n }\n };\n FocusStrategy.prototype.passiveFocus = function (e) {\n if (this.parent.isDestroyed) {\n return;\n }\n var firstHeaderCell = this.parent.getHeaderContent().querySelector('.e-headercell:not(.e-hide)');\n if (e.target === firstHeaderCell && e.relatedTarget && !parentsUntil(e.relatedTarget, 'e-grid')\n && !this.firstHeaderCellClick) {\n var firstHeaderCellIndex = [0, 0];\n if (this.active.matrix.matrix[firstHeaderCellIndex[0]][firstHeaderCellIndex[1]] === 0) {\n firstHeaderCellIndex = findCellIndex(this.active.matrix.matrix, firstHeaderCellIndex, true);\n }\n this.active.matrix.current = firstHeaderCellIndex;\n this.currentInfo.element = e.target;\n this.currentInfo.elementToFocus = e.target;\n addClass([this.currentInfo.element], ['e-focused', 'e-focus']);\n }\n this.firstHeaderCellClick = false;\n if (e.target && e.target.classList.contains('e-detailcell')) {\n this.currentInfo.skipAction = false;\n addClass([this.currentInfo.element], ['e-focused', 'e-focus']);\n }\n };\n FocusStrategy.prototype.onBlur = function (e) {\n if (this.parent.allowPaging && this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer')) {\n this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer').removeAttribute('aria-hidden');\n }\n // The below boolean condition for gantt team focus fix.\n var isGantt = parentsUntil(e.target, 'e-gantt') && e.target.classList.contains('e-rowcell')\n && (!isNullOrUndefined(e.target.nextElementSibling)\n && e.target.nextElementSibling.classList.contains('e-rowcell')) ? true : false;\n if ((this.parent.isEdit || e && (!e.relatedTarget || closest(e.relatedTarget, '.e-grid'))\n && !(this.parent.element.classList.contains('e-childgrid') && !this.parent.element.matches(':focus-within')))\n && !(!isGantt && isNullOrUndefined(e.relatedTarget) && parseInt(e.target.getAttribute('data-colindex'), 10) === 0\n && parseInt(e.target.getAttribute('index'), 10) === 0) && !(!isGantt && isNullOrUndefined(e.relatedTarget)\n && !closest(document.activeElement, '.e-grid') && !isNullOrUndefined(e['sourceCapabilities']))) {\n return;\n }\n this.removeFocus();\n this.skipFocus = true;\n this.currentInfo.skipAction = false;\n this.setLastContentCellTabIndex();\n this.setFirstFocusableTabIndex();\n this.firstHeaderCellClick = false;\n };\n /**\n * @returns {void}\n * @hidden */\n FocusStrategy.prototype.setFirstFocusableTabIndex = function () {\n var gObj = this.parent;\n gObj.element.tabIndex = -1;\n if (gObj.allowGrouping && gObj.groupSettings.showDropArea) {\n var groupModule = gObj.groupModule;\n var focusableGroupedItems = groupModule.getFocusableGroupedItems();\n if (focusableGroupedItems.length > 0) {\n groupModule.element.tabIndex = -1;\n focusableGroupedItems[0].tabIndex = 0;\n }\n else {\n groupModule.element.tabIndex = 0;\n }\n return;\n }\n if (gObj.toolbar || gObj.toolbarTemplate) {\n var toolbarElement = gObj.toolbarModule.element;\n var focusableToolbarItems = this.parent.toolbarModule.getFocusableToolbarItems();\n if (focusableToolbarItems.length > 0 && focusableToolbarItems[0].querySelector('.e-toolbar-item-focus,.e-btn,.e-input')) {\n toolbarElement.tabIndex = -1;\n focusableToolbarItems[0].querySelector('.e-toolbar-item-focus,.e-btn,.e-input').tabIndex = 0;\n }\n else {\n toolbarElement.tabIndex = 0;\n }\n return;\n }\n if (gObj.getColumns().length) {\n var firstHeaderCell = gObj.getHeaderContent().querySelector('.e-headercell:not(.e-hide)');\n firstHeaderCell.tabIndex = 0;\n this.setActive(false);\n if (!isNullOrUndefined(this.active) && (isNullOrUndefined(this.active.target) || !this.active.target.classList.contains('e-columnmenu'))) {\n var firstHeaderCellIndex = [0, 0];\n if (this.active.matrix.matrix[firstHeaderCellIndex[0]][firstHeaderCellIndex[1]] === 0) {\n firstHeaderCellIndex = findCellIndex(this.active.matrix.matrix, firstHeaderCellIndex, true);\n }\n this.active.matrix.current = firstHeaderCellIndex;\n }\n return;\n }\n };\n FocusStrategy.prototype.setLastContentCellTabIndex = function () {\n var contentTable = this.parent.getContentTable();\n if (contentTable.rows[contentTable.rows.length - 1]) {\n var lastCell = contentTable.rows[contentTable.rows.length - 1].lastElementChild;\n lastCell.tabIndex = 0;\n }\n };\n FocusStrategy.prototype.onClick = function (e, force) {\n if (parentsUntil(e.target, 'e-filterbarcell') && (parentsUntil(e.target, 'e-multiselect') ||\n e.target.classList.contains('e-input-group-icon'))) {\n return;\n }\n var isContent = !isNullOrUndefined(closest(e.target, '.' + literals.gridContent));\n var isHeader = !isNullOrUndefined(closest(e.target, '.' + literals.gridHeader));\n isContent = isContent && isHeader ? !isContent : isContent;\n if (!isContent && isNullOrUndefined(closest(e.target, '.' + literals.gridHeader)) ||\n e.target.classList.contains(literals.content) ||\n !isNullOrUndefined(closest(e.target, '.e-unboundcell'))) {\n return;\n }\n this.setActive(isContent);\n if (!isContent && isNullOrUndefined(closest(e.target, '.' + literals.gridHeader))) {\n this.clearOutline();\n return;\n }\n var beforeArgs = { cancel: false, byKey: false, byClick: !isNullOrUndefined(e.target), clickArgs: e };\n this.parent.notify(event.beforeCellFocused, beforeArgs);\n if (beforeArgs.cancel || (closest(e.target, '.e-inline-edit') && (!this.parent.editSettings.showAddNewRow &&\n (this.parent.editSettings.showAddNewRow && !this.parent.element.querySelector('.e-editedrow'))))) {\n return;\n }\n this.setActive(isContent);\n if (this.getContent()) {\n var returnVal = this.getContent().onClick(e, force);\n if (returnVal === false) {\n return;\n }\n this.focus();\n if (this.currentInfo.element.classList.contains('e-rowcell') && e.type && e.type === 'click') {\n addClass([this.currentInfo.element], ['e-focused', 'e-focus']);\n }\n }\n };\n FocusStrategy.prototype.handleFilterNavigation = function (e, inputSelector, buttonSelector) {\n if (e.target === document.querySelector(inputSelector) && e.key === 'Tab' && e.shiftKey) {\n e.preventDefault();\n document.querySelector(buttonSelector).focus();\n }\n else if (e.target === document.querySelector(buttonSelector) && e.key === 'Tab' && !e.shiftKey &&\n document.activeElement === document.querySelector(buttonSelector)) {\n e.preventDefault();\n document.querySelector(inputSelector).focus();\n }\n };\n FocusStrategy.prototype.onKeyPress = function (e) {\n if (this.parent.allowPaging) {\n var pagerElement = this.parent.pagerModule.pagerObj.element;\n var focusablePagerElements = this.parent.pagerModule.pagerObj.getFocusablePagerElements(pagerElement, []);\n if (this.parent.childGrid && !parentsUntil(e.target, 'e-gridpager') && this.allowToPaging(e) && focusablePagerElements.length) {\n focusablePagerElements[0].tabIndex = 0;\n }\n if (this.parent.pagerModule.pagerObj.checkPagerHasFocus()) {\n if (e.action === 'shiftTab' && focusablePagerElements.length && focusablePagerElements[0] === e.target) {\n this.setActive(true);\n var lastHeaderCellIndex = [this.active.matrix.matrix.length - 1,\n this.active.matrix.matrix[this.active.matrix.matrix.length - 1].length - 1];\n if (this.active.matrix.matrix[lastHeaderCellIndex[0]][lastHeaderCellIndex[1]] === 0) {\n lastHeaderCellIndex = findCellIndex(this.active.matrix.matrix, lastHeaderCellIndex, false);\n }\n this.active.matrix.current = this.parent.editSettings.mode === 'Batch' ?\n this.isValidBatchEditCell(lastHeaderCellIndex) ? lastHeaderCellIndex :\n this.findBatchEditCell(lastHeaderCellIndex, false) : lastHeaderCellIndex;\n e.preventDefault();\n this.focus(e);\n return;\n }\n if (!(e.action === 'tab' && this.parent.element.classList.contains('e-childgrid')\n && ((!this.parent.pageSettings.pageSizes && focusablePagerElements.length\n && focusablePagerElements[focusablePagerElements.length - 1] === e.target)\n || (this.parent.pagerModule.pagerObj.getDropDownPage() === e.target)))) {\n this.parent.pagerModule.pagerObj.changePagerFocus(e);\n return;\n }\n else {\n var parentCell = parentsUntil(this.parent.element, 'e-detailcell');\n removeClass([this.parent.element], ['e-focus']);\n removeClass([parentCell], ['e-focused']);\n parentCell.tabIndex = -1;\n }\n }\n if (this.parent.pagerModule.pagerObj.element.tabIndex === 0 && (e.keyCode === 38 || (e.shiftKey && e.keyCode === 9))) {\n e.preventDefault();\n this.focus(e);\n return;\n }\n else if (this.parent.pagerModule.pagerObj.element.tabIndex === 0 && e.keyCode === 9) {\n e.preventDefault();\n this.parent.pagerModule.pagerObj.setPagerFocus();\n return;\n }\n if (this.parent.pagerModule.pagerObj.checkFirstPagerFocus()) {\n var lastRow = this.getContent().matrix.rows;\n var lastColumn = this.getContent().matrix.columns;\n this.getContent().matrix.current = [lastRow, lastColumn];\n }\n }\n if (this.parent.filterSettings.type === 'Excel') {\n this.handleFilterNavigation(e, '.e-excelfilter .e-menu-item:not(.e-disabled)', '.e-excelfilter .e-footer-content button:nth-child(2)');\n }\n if (this.parent.filterSettings.type === 'CheckBox') {\n this.handleFilterNavigation(e, '.e-searchinput.e-input', '.e-checkboxfilter .e-footer-content button:nth-child(2)');\n }\n if (this.parent.filterSettings.type === 'Menu') {\n this.handleFilterNavigation(e, '.e-flmenu .e-input-group.e-popup-flmenu', '.e-flmenu .e-footer-content button:nth-child(2)');\n }\n if (this.skipOn(e)) {\n return;\n }\n if (e.target && parentsUntil(e.target, 'e-gridcontent')) {\n var rows = [].slice.call(this.parent.getContentTable().rows);\n var lastCell = rows[rows.length - 1].lastElementChild;\n if (e.target === lastCell) {\n this.setActive(true);\n this.setLastContentCellActive();\n }\n }\n if (e.action === 'shiftTab' && e.target && (e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')\n || parentsUntil(e.target, 'e-groupdroparea'))) {\n if (e.target === this.parent.element) {\n if (this.parent.element.classList.contains('e-childgrid')) {\n this.focusOutFromChildGrid(e);\n }\n return;\n }\n if (parentsUntil(e.target, 'e-groupdroparea')) {\n if (this.parent.element.classList.contains('e-childgrid')) {\n e.preventDefault();\n this.parent.element.focus();\n }\n return;\n }\n if (parentsUntil(e.target, 'e-toolbar')) {\n if (this.parent.allowGrouping && this.parent.groupSettings.showDropArea) {\n var groupModule = this.parent.groupModule;\n var focusableGroupedItems = groupModule.getFocusableGroupedItems();\n e.preventDefault();\n if (focusableGroupedItems.length > 0) {\n focusableGroupedItems[focusableGroupedItems.length - 1].focus();\n }\n else {\n groupModule.element.focus();\n }\n }\n else if (this.parent.element.classList.contains('e-childgrid')) {\n e.preventDefault();\n this.parent.element.focus();\n }\n return;\n }\n }\n var focusFirstHeaderCell = false;\n if (e.action === 'tab' && e.target && (e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')\n || parentsUntil(e.target, 'e-groupdroparea'))) {\n if (this.parent.allowGrouping && this.parent.groupSettings.showDropArea\n && (e.target === this.parent.element || e.target.classList.contains('e-groupdroparea'))) {\n var groupModule = this.parent.groupModule;\n var focusableGroupedItems = groupModule.getFocusableGroupedItems();\n if (focusableGroupedItems.length > 0) {\n e.preventDefault();\n focusableGroupedItems[0].focus();\n return;\n }\n if (!e.target.classList.contains('e-groupdroparea')) {\n e.preventDefault();\n groupModule.element.focus();\n return;\n }\n }\n if ((this.parent.toolbar || this.parent.toolbarTemplate) && (e.target === this.parent.element\n || parentsUntil(e.target, 'e-groupdroparea')\n || e.target.classList.contains('e-toolbar'))) {\n var toolbarElement = this.parent.toolbarModule.element;\n var focusableToolbarItems = this.parent.toolbarModule.getFocusableToolbarItems();\n if (focusableToolbarItems.length > 0) {\n e.preventDefault();\n focusableToolbarItems[0].querySelector('.e-toolbar-item-focus,.e-btn,.e-input').focus();\n return;\n }\n if (!e.target.classList.contains('e-toolbar')) {\n e.preventDefault();\n toolbarElement.focus();\n return;\n }\n }\n if (e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')\n || parentsUntil(e.target, 'e-groupdroparea')) {\n focusFirstHeaderCell = true;\n }\n }\n if (focusFirstHeaderCell) {\n if (this.parent.allowGrouping && this.parent.groupSettings.columns.length === this.parent.columns.length) {\n this.setActive(true);\n }\n else {\n this.setActive(false);\n }\n this.active.matrix.current = [0, -1];\n }\n this.activeKey = e.action;\n var beforeArgs = { cancel: false, byKey: true, byClick: false, keyArgs: e };\n this.parent.notify(event.beforeCellFocused, beforeArgs);\n if (beforeArgs.cancel) {\n return;\n }\n var bValue = this.getContent().matrix.current;\n var prevBatchValue = this.active && this.active.matrix.current ?\n [this.active.matrix.current[0], this.active.matrix.current[1]] : undefined;\n this.currentInfo.outline = true;\n var swapInfo = this.getContent().jump(e.action, bValue);\n this.swap = swapInfo;\n if (swapInfo.swap && !(this.parent.editSettings.mode === 'Batch'\n && (e.action === 'tab' || e.action === 'shiftTab'))) {\n this.setActive(!swapInfo.toHeader);\n this.getContent().matrix.current = this.getContent().getNextCurrent(bValue, swapInfo, this.active, e.action);\n this.prevIndexes = {};\n }\n this.setActiveByKey(e.action, this.getContent());\n var returnVal = this.content.lastIdxCell ? false : this.getContent().onKeyPress(e);\n if (e.target && parentsUntil(e.target, 'e-gridheader')) {\n if (e.action === 'tab' && bValue.toString() === this.active.matrix.current.toString()) {\n var nextHeaderCellIndex = findCellIndex(this.active.matrix.matrix, this.active.matrix.current, true);\n var lastHeaderCellIndex = [this.active.matrix.matrix.length - 1,\n this.active.matrix.matrix[this.active.matrix.matrix.length - 1].length - 1];\n if (this.active.matrix.matrix[lastHeaderCellIndex[0]][lastHeaderCellIndex[1]] === 0) {\n lastHeaderCellIndex = findCellIndex(this.active.matrix.matrix, lastHeaderCellIndex, false);\n }\n if (this.active.matrix.current.toString() === lastHeaderCellIndex.toString() && this.content.matrix.matrix.length) {\n returnVal = true;\n this.setActive(true);\n var firstContentCellIndex = [0, 0];\n if (this.parent.allowPaging && this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer')) {\n this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer').setAttribute('aria-hidden', 'true');\n }\n if (this.active.matrix.matrix[firstContentCellIndex[0]][firstContentCellIndex[1]] === 0) {\n firstContentCellIndex = findCellIndex(this.active.matrix.matrix, [0, 0], true);\n }\n this.active.matrix.current = this.parent.editSettings.mode === 'Batch' ?\n this.isValidBatchEditCell(firstContentCellIndex) ? firstContentCellIndex :\n this.findBatchEditCell(firstContentCellIndex, true) : firstContentCellIndex;\n }\n else if (this.active.matrix.current.toString() !== nextHeaderCellIndex.toString()) {\n this.active.matrix.current = nextHeaderCellIndex;\n }\n }\n if (e.action === 'shiftTab' && bValue.toString() === this.active.matrix.current.toString()) {\n var previousCellIndex = findCellIndex(this.active.matrix.matrix, this.active.matrix.current, false);\n if (previousCellIndex.toString() === this.active.matrix.current.toString()) {\n this.focusOutFromHeader(e);\n return;\n }\n if (this.active.matrix.current.toString() !== previousCellIndex.toString() && !returnVal) {\n returnVal = true;\n this.active.matrix.current = previousCellIndex;\n }\n }\n }\n if (e.target && parentsUntil(e.target, 'e-gridcontent')) {\n if (this.parent.allowPaging && this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer')) {\n this.parent.pagerModule.pagerObj.element.querySelector('.e-pagercontainer').removeAttribute('aria-hidden');\n }\n if (this.parent.editSettings.mode === 'Batch' && (e.action === 'tab' || e.action === 'shiftTab')) {\n this.active.matrix.current = this.findBatchEditCell(prevBatchValue, e.action === 'tab' ? true : false);\n if (e.action === 'tab' && prevBatchValue.toString() === this.active.matrix.current.toString()) {\n this.parent.editModule.editModule.addBatchRow = true;\n }\n }\n if (e.action === 'shiftTab' && bValue.toString() === this.active.matrix.current.toString()) {\n if (this.parent.allowGrouping && this.parent.groupSettings.columns.length === this.parent.columns.length) {\n this.focusOutFromHeader(e);\n return;\n }\n var firstContentCellIndex = [0, 0];\n if (this.active.matrix.matrix[firstContentCellIndex[0]][firstContentCellIndex[1]] === 0) {\n firstContentCellIndex = findCellIndex(this.active.matrix.matrix, [0, 0], true);\n }\n if (!returnVal && (firstContentCellIndex.toString() === this.active.matrix.current.toString()\n || (this.parent.editSettings.mode === 'Batch'\n && prevBatchValue.toString() === this.active.matrix.current.toString()))) {\n returnVal = true;\n this.setActive(false);\n this.setLastContentCellActive();\n }\n }\n }\n if (returnVal === false) {\n this.clearIndicator();\n if (e.action === 'shiftTab' && bValue.toString() === [0, 0].toString()) {\n this.parent.element.tabIndex = -1;\n }\n if (this.parent.allowPaging && !this.parent.pagerModule.pagerObj.checkPagerHasFocus() && this.allowToPaging(e)\n && bValue.toString() !== [0, 0].toString()) {\n e.preventDefault();\n if (e.keyCode === 40) {\n this.parent.pagerModule.pagerObj.setPagerContainerFocus();\n return;\n }\n else if (e.keyCode === 9) {\n this.parent.pagerModule.pagerObj.setPagerFocus();\n return;\n }\n }\n if (this.parent.element.classList.contains('e-childgrid')) {\n this.focusOutFromChildGrid(e);\n }\n return;\n }\n e.preventDefault();\n this.focus(e);\n };\n FocusStrategy.prototype.isValidBatchEditCell = function (cellIndex) {\n var cell = this.active.getTable().rows[cellIndex[0]].cells[cellIndex[1]];\n var tr = closest(cell, 'tr');\n var cellColIndex = parseInt(cell.getAttribute('data-colindex'), 10);\n var cellCol = this.parent.getColumns()[parseInt(cellColIndex.toString(), 10)];\n if (this.active.matrix.matrix[cellIndex[0]][cellIndex[1]] === 1\n && (!tr.classList.contains('e-row') || (tr.classList.contains('e-insertedrow') || !cellCol.isPrimaryKey) && cellCol.allowEditing)) {\n return true;\n }\n return false;\n };\n FocusStrategy.prototype.findBatchEditCell = function (currentCellIndex, next, limitRow) {\n var cellIndex = currentCellIndex;\n var tempCellIndex = currentCellIndex;\n var cellIndexObtain = false;\n while (!cellIndexObtain) {\n var prevTempCellIndex = tempCellIndex;\n tempCellIndex = findCellIndex(this.active.matrix.matrix, tempCellIndex, next);\n if ((prevTempCellIndex.toString() === tempCellIndex.toString())\n || (limitRow && prevTempCellIndex[0] !== tempCellIndex[0])) {\n cellIndexObtain = true;\n continue;\n }\n if (this.isValidBatchEditCell(tempCellIndex)) {\n cellIndex = tempCellIndex;\n cellIndexObtain = true;\n }\n }\n return cellIndex;\n };\n FocusStrategy.prototype.setLastContentCellActive = function () {\n var lastContentCellIndex = [this.active.matrix.matrix.length - 1,\n this.active.matrix.matrix[this.active.matrix.matrix.length - 1].length - 1];\n if (this.active.matrix.matrix[lastContentCellIndex[0]][lastContentCellIndex[1]] === 0) {\n lastContentCellIndex = findCellIndex(this.active.matrix.matrix, lastContentCellIndex, false);\n }\n this.active.matrix.current = lastContentCellIndex;\n };\n FocusStrategy.prototype.focusOutFromChildGrid = function (e) {\n var parentTable = parentsUntil(this.parent.element, 'e-table');\n var parentGrid = parentsUntil(parentTable, 'e-grid').ej2_instances[0];\n var parentCell = parentsUntil(this.parent.element, 'e-detailcell');\n var uid = parentsUntil(this.parent.element, 'e-detailrow').getAttribute('data-uid');\n var parentRows = [].slice.call(parentGrid.getContentTable().rows);\n var parentRowIndex = parentRows.map(function (m) { return m.getAttribute('data-uid'); }).indexOf(uid);\n if (e.action === 'tab' && parentRowIndex >= parentRows.length - 1) {\n return;\n }\n removeClass([this.parent.element], ['e-focus']);\n removeClass([parentCell], ['e-focused']);\n parentCell.tabIndex = -1;\n e.preventDefault();\n var nextFocusCell;\n parentGrid.focusModule.removeFocus();\n if (e.action === 'shiftTab') {\n var previousRow = parentRows[parentRowIndex - 1];\n var rowCells = previousRow.cells;\n for (var i = rowCells.length - 1; i >= 0; i--) {\n nextFocusCell = rowCells[parseInt(i.toString(), 10)];\n if (!nextFocusCell.classList.contains('e-hide')) {\n parentGrid.focusModule.active.matrix.current = [parentRowIndex - 1, i];\n break;\n }\n }\n }\n else {\n nextFocusCell = parentRows[parentRowIndex + 1].cells[0];\n parentGrid.focusModule.active.matrix.current = [parentRowIndex + 1, 0];\n }\n parentGrid.focusModule.currentInfo.element = nextFocusCell;\n parentGrid.focusModule.currentInfo.elementToFocus = nextFocusCell;\n addClass([nextFocusCell], ['e-focused', 'e-focus']);\n nextFocusCell.tabIndex = 0;\n nextFocusCell.focus();\n };\n FocusStrategy.prototype.focusOutFromHeader = function (e) {\n this.removeFocus();\n if (this.parent.toolbar || this.parent.toolbarTemplate) {\n var toolbarElement = this.parent.toolbarModule.element;\n var focusableToolbarItems = this.parent.toolbarModule.getFocusableToolbarItems();\n e.preventDefault();\n if (focusableToolbarItems.length > 0) {\n focusableToolbarItems[focusableToolbarItems.length - 1].querySelector('.e-toolbar-item-focus,.e-btn,.e-input').focus();\n }\n else {\n toolbarElement.focus();\n }\n return;\n }\n if (this.parent.allowGrouping && this.parent.groupSettings.showDropArea) {\n var groupModule = this.parent.groupModule;\n var focusableGroupedItems = groupModule.getFocusableGroupedItems();\n e.preventDefault();\n if (focusableGroupedItems.length > 0) {\n focusableGroupedItems[focusableGroupedItems.length - 1].focus();\n }\n else {\n groupModule.element.focus();\n }\n return;\n }\n if (this.parent.element.classList.contains('e-childgrid')) {\n e.preventDefault();\n this.parent.element.focus();\n }\n };\n FocusStrategy.prototype.allowToPaging = function (e) {\n if (this.parent.editSettings.mode === 'Batch' && this.parent.editSettings.allowAdding && e.keyCode !== 40) {\n return false;\n }\n return true;\n };\n FocusStrategy.prototype.skipOn = function (e) {\n var target = e.target;\n if (!target) {\n return false;\n }\n if (this.currentInfo.skipAction) {\n this.clearIndicator();\n return true;\n }\n if (['pageUp', 'pageDown', 'altDownArrow'].indexOf(e.action) > -1) {\n this.clearIndicator();\n return true;\n }\n if (this.parent.allowGrouping) {\n var focusableGroupedItems = this.parent.groupModule.getFocusableGroupedItems();\n if (parentsUntil(e.target, 'e-groupheadercell')\n && !((e.target === focusableGroupedItems[0] && e.action === 'shiftTab')\n || (e.target === focusableGroupedItems[focusableGroupedItems.length - 1] && e.action === 'tab'))) {\n return true;\n }\n }\n if (this.parent.toolbar || this.parent.toolbarTemplate) {\n var toolbarElement = this.parent.toolbarModule.element;\n var focusableToolbarItems = toolbarElement\n .querySelectorAll('.e-toolbar-item:not(.e-overlay):not(.e-hidden)');\n if (parentsUntil(e.target, 'e-toolbar-item')\n && !(focusableToolbarItems.length > 0 && ((parentsUntil(e.target, 'e-toolbar-item') === focusableToolbarItems[0] && e.action === 'shiftTab')\n || (parentsUntil(e.target, 'e-toolbar-item') === focusableToolbarItems[focusableToolbarItems.length - 1] && e.action === 'tab')))) {\n return true;\n }\n }\n var th = closest(target, 'th') && !closest(target, 'th').tabIndex;\n if (e.target.classList.contains('e-filterbaroperator') && (e.keyCode === 13 || e.keyCode === 27)) {\n var inputTarget = closest(e.target, '.e-filterbarcell');\n inputTarget.querySelector('input').focus();\n }\n var addNewRow = this.parent.editSettings.showAddNewRow && closest(document.activeElement, '.e-addedrow') !== null;\n if ((th && closest(document.activeElement, '.e-filterbarcell') !== null) || addNewRow) {\n this.removeFocus();\n }\n var filterCell = closest(document.activeElement, '.e-filterbarcell') !== null;\n if (this.parent.enableHeaderFocus && filterCell) {\n var matrix = this.active.matrix;\n var current = matrix.current;\n filterCell = matrix.matrix[current[0]].lastIndexOf(1) !== current[1];\n }\n if (this.parent.isEdit && (e.action === 'tab' || e.action === 'shiftTab') && this.parent.editSettings.mode === 'Normal'\n && !this.parent.editSettings.showAddNewRow && !isNullOrUndefined(parentsUntil(target, 'e-addedrow'))) {\n var inputElements = this.parent.editModule.formObj.element\n .querySelectorAll('input.e-field:not(.e-disabled),button:not(.e-hide)');\n var inputTarget = target.classList.contains('e-ddl') ? target.querySelector('input') : target;\n var firstEditCell = e.action === 'tab' && inputTarget === inputElements[inputElements.length - 1];\n var lastEditCell = e.action === 'shiftTab' && inputTarget === inputElements[0];\n if (firstEditCell || lastEditCell) {\n e.preventDefault();\n var focusElement = inputElements[firstEditCell ? 0 : inputElements.length - 1];\n focusElement = focusElement.parentElement.classList.contains('e-ddl') ? focusElement.parentElement : focusElement;\n focusElement.focus();\n }\n }\n return (e.action === 'delete'\n || (this.parent.editSettings.mode !== 'Batch' && ((this.parent.isEdit && (!this.parent.editSettings.showAddNewRow ||\n (this.parent.editSettings.showAddNewRow && ((!isNullOrUndefined(this.parent.element.querySelector('.e-editedrow')) ||\n (!isNullOrUndefined(parentsUntil(target, 'e-addedrow')) && !isNullOrUndefined(closest(e.target, 'input')) && !isNullOrUndefined(document.querySelector('.e-popup-open'))) ||\n (!isNullOrUndefined(parentsUntil(target, 'e-addedrow')) && (target && !target.querySelector('.e-cancel-icon')) &&\n !isNullOrUndefined(parentsUntil(target, 'e-unboundcell')))))))) || ['insert', 'f2'].indexOf(e.action) > -1))\n || ((filterCell && this.parent.enableHeaderFocus) || ((filterCell || addNewRow) && e.action !== 'tab' && e.action !== 'shiftTab') ||\n closest(document.activeElement, '#' + this.parent.element.id + '_searchbar') !== null\n && ['enter', 'leftArrow', 'rightArrow',\n 'shiftLeft', 'shiftRight', 'ctrlPlusA'].indexOf(e.action) > -1)\n || (closest(target, '.' + literals.gridContent) === null && closest(target, '.' + literals.gridHeader) === null\n && !(e.target === this.parent.element || parentsUntil(e.target, 'e-toolbar')\n || parentsUntil(e.target, 'e-groupdroparea')))\n || (e.action === 'space' && (!target.classList.contains(literals.gridChkBox) && closest(target, '.' + literals.gridChkBox) === null\n && closest(target, '.e-headerchkcelldiv') === null))) || closest(target, '.e-filter-popup') !== null;\n };\n FocusStrategy.prototype.focusVirtualElement = function (e) {\n var _this = this;\n if (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling) {\n var data = { virtualData: {}, isAdd: false, isCancel: false };\n this.parent.notify(event.getVirtualData, data);\n var isKeyFocus = this.actions.some(function (value) { return value === _this.activeKey; });\n var isSelected = this.parent.contentModule ?\n this.parent.contentModule.selectedRowIndex > -1 : false;\n if (data.isAdd || Object.keys(data.virtualData).length || isKeyFocus || data.isCancel || isSelected) {\n this.parent.notify(event.resetVirtualFocus, { isCancel: false });\n data.isCancel = false;\n this.parent.contentModule.selectedRowIndex = -1;\n if (isKeyFocus) {\n this.activeKey = this.empty;\n this.parent.notify('virtaul-key-handler', e);\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.currentInfo.elementToFocus.focus({ preventScroll: true });\n }\n else {\n if (this.isVirtualScroll || this.isInfiniteScroll) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.currentInfo.elementToFocus.focus({ preventScroll: true });\n }\n else {\n this.currentInfo.elementToFocus.focus();\n }\n }\n }\n this.isVirtualScroll = this.isInfiniteScroll = false;\n };\n FocusStrategy.prototype.getFocusedElement = function () {\n return this.currentInfo.elementToFocus;\n };\n FocusStrategy.prototype.getContent = function () {\n return this.active || this.content;\n };\n FocusStrategy.prototype.setActive = function (content) {\n this.active = content ? this.content : this.header;\n };\n FocusStrategy.prototype.setFocusedElement = function (element, e) {\n var _this = this;\n this.currentInfo.elementToFocus = element;\n setTimeout(function () {\n if (!isNullOrUndefined(_this.currentInfo.elementToFocus)) {\n if (_this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling) {\n _this.focusVirtualElement(e);\n }\n else if (isNullOrUndefined(_this.parent.element.querySelector('.e-flmenu')) ||\n parentsUntil(document.activeElement, 'e-flmenu-valuediv') !== _this.parent.element.querySelector('.e-flmenu-valuediv')) {\n _this.currentInfo.elementToFocus.focus();\n }\n }\n }, 0);\n };\n FocusStrategy.prototype.focus = function (e) {\n this.parent.notify(event.virtaulCellFocus, e);\n this.removeFocus();\n this.addFocus(this.getContent().getFocusInfo(), e);\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n FocusStrategy.prototype.removeFocus = function (e) {\n if (!this.currentInfo.element) {\n return;\n }\n if (this.parent.isReact && !this.parent.isEdit && this.currentInfo.element.classList.contains('e-rowcell')\n && !this.currentInfo.element.parentElement && !(this.parent.allowGrouping && this.parent.groupSettings.columns.length) &&\n this.parent.getRowByIndex(this.prevIndexes.rowIndex)) {\n var cellElem = this.parent.getCellFromIndex(this.prevIndexes.rowIndex, this.prevIndexes\n .cellIndex);\n this.currentInfo.element = cellElem ? cellElem : this.currentInfo.element;\n }\n removeClass([this.currentInfo.element, this.currentInfo.elementToFocus], ['e-focused', 'e-focus']);\n this.currentInfo.element.tabIndex = -1;\n };\n /**\n * @returns {void}\n * @hidden */\n FocusStrategy.prototype.addOutline = function () {\n var info = this.getContent().getFocusInfo();\n if (info.element) {\n addClass([info.element], ['e-focused']);\n addClass([info.elementToFocus], ['e-focus']);\n }\n };\n /**\n * @returns {void}\n * @hidden */\n FocusStrategy.prototype.focusHeader = function () {\n this.setActive(false);\n this.resetFocus();\n };\n /**\n * @returns {void}\n * @hidden */\n FocusStrategy.prototype.focusContent = function () {\n this.setActive(true);\n this.resetFocus();\n };\n FocusStrategy.prototype.resetFocus = function () {\n var current = this.getContent().matrix.get(0, -1, [0, 1], null, this.getContent().validator());\n this.getContent().matrix.select(current[0], current[1]);\n this.focus();\n };\n FocusStrategy.prototype.addFocus = function (info, e) {\n this.currentInfo = info;\n this.currentInfo.outline = info.outline && (!isNullOrUndefined(e) || this.isVirtualScroll);\n if (this.isInfiniteScroll) {\n this.currentInfo.outline = true;\n }\n if (!info.element) {\n return;\n }\n var isFocused = info.elementToFocus.classList.contains('e-focus');\n if (isFocused) {\n return;\n }\n if (this.currentInfo.outline) {\n addClass([info.element], ['e-focused']);\n }\n addClass([info.elementToFocus], ['e-focus']);\n info.element.tabIndex = 0;\n if (!isFocused) {\n this.setFocusedElement(info.elementToFocus, e);\n }\n this.parent.notify(event.cellFocused, {\n element: info.elementToFocus,\n parent: info.element,\n indexes: this.getContent().matrix.current,\n byKey: !isNullOrUndefined(e),\n byClick: isNullOrUndefined(e),\n keyArgs: e,\n isJump: this.swap.swap,\n container: this.getContent().getInfo(e),\n outline: !isNullOrUndefined(e),\n swapInfo: this.swap\n });\n var _a = this.getContent().matrix.current, rowIndex = _a[0], cellIndex = _a[1];\n this.prevIndexes = { rowIndex: rowIndex, cellIndex: cellIndex };\n this.focusedColumnUid = this.parent.getColumnByIndex(cellIndex).uid;\n this.focusByClick = false;\n };\n FocusStrategy.prototype.refreshMatrix = function (content) {\n var _this = this;\n return function (e) {\n if (content && !_this.content) {\n _this.content = new ContentFocus(_this.parent);\n }\n if (!content && !_this.header) {\n _this.header = new HeaderFocus(_this.parent);\n }\n var cFocus = content ? _this.content : _this.header;\n var frozenRow = _this.parent.frozenRows;\n var batchLen = 0;\n if (frozenRow && _this.parent.editSettings.mode === 'Batch') {\n batchLen = _this.parent.getHeaderContent().querySelectorAll('.e-insertedrow').length +\n _this.parent.getHeaderContent().querySelectorAll('.e-hiddenrow').length;\n }\n if (_this.parent.groupSettings.columns.length && frozenRow && content) {\n frozenRow = 0;\n for (var i = 0; i < e.rows.length; i++) {\n frozenRow++;\n if (e.rows[parseInt(i.toString(), 10)].index + 1 === _this.parent.frozenRows) {\n break;\n }\n }\n _this.groupedFrozenRow = frozenRow;\n }\n var rows = content ? e.rows.slice(frozenRow + batchLen) : e.rows;\n var updateRow = content ? e.rows.slice(0, frozenRow + batchLen) : e.rows;\n if (_this.parent.isCollapseStateEnabled() && content) {\n rows = rows.filter(function (x) { return x.visible !== false; });\n }\n var isRowTemplate = !isNullOrUndefined(_this.parent.rowTemplate);\n if (frozenRow && ((_this.parent.editSettings.mode === 'Batch' && content && (e.name === 'batchDelete' || e.name === 'batchAdd' ||\n e.name === 'batchCancel' || (e.args && (e.args.requestType === 'batchsave')))) ||\n (e.args && (e.args.requestType === 'delete' || e.args.requestType === 'save')))) {\n var matrixcs = _this.header.matrix.matrix;\n var hdrLen = _this.parent.headerModule.rows.length;\n matrixcs.splice(hdrLen, matrixcs.length - hdrLen);\n }\n var matrix = cFocus.matrix.generate(updateRow, cFocus.selector, isRowTemplate);\n cFocus.matrix.generate(rows, cFocus.selector, isRowTemplate);\n var isScroll = _this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling;\n if ((_this.parent.editSettings.showAddNewRow && content && _this.header && _this.header.matrix) &&\n (!isScroll || (isScroll && _this.parent.isAddNewRow))) {\n var tempMatrix = _this.header.matrix.matrix;\n var lastRowHeaderIdx = _this.parent.allowFiltering && _this.parent.filterSettings.type === 'FilterBar' ? 2 : 1;\n cFocus.matrix.rows = _this.parent.frozenRows && _this.parent.editSettings.newRowPosition === 'Top' ?\n cFocus.matrix.rows : ++cFocus.matrix.rows;\n if (_this.parent.editSettings.newRowPosition === 'Top') {\n (_this.parent.frozenRows || isScroll ?\n matrix : cFocus.matrix.matrix).unshift(_this.refreshAddNewRowMatrix(tempMatrix[tempMatrix.length -\n lastRowHeaderIdx]));\n }\n else {\n cFocus.matrix.matrix.push(_this.refreshAddNewRowMatrix(tempMatrix[tempMatrix.length - lastRowHeaderIdx]));\n }\n _this.parent.isAddNewRow = false;\n }\n if (!(_this.parent.isFrozenGrid() && (e.args && (e.args.requestType === 'sorting'\n || e.args.requestType === 'batchsave' || e.args.requestType === 'paging'))) ||\n (frozenRow && _this.parent.editSettings.mode === 'Batch' && content && (e.name === 'batchDelete' || e.name === 'batchAdd' ||\n e.name === 'batchCancel' || e.args.requestType === 'batchsave'\n || e.name === 'batchAdd' || e.name === 'batchCancel'))) {\n cFocus.generateRows(updateRow, {\n matrix: matrix, handlerInstance: _this.header\n });\n }\n if (!Browser.isDevice && e && e.args) {\n if (!_this.focusByClick && e.args.requestType === 'paging' && !_this.parent.pagerModule.pagerObj.checkPagerHasFocus()) {\n _this.skipFocus = false;\n _this.parent.element.focus();\n }\n if (e.args.requestType === 'grouping') {\n _this.skipFocus = true;\n }\n }\n if (e && e.args && e.args.requestType === 'virtualscroll') {\n if (_this.currentInfo.uid) {\n var index_1;\n var bool = e.rows.some(function (row, i) {\n index_1 = i;\n return row.uid === _this.currentInfo.uid;\n });\n if (bool) {\n _this.content.matrix.current[0] = index_1;\n _this.content.matrix.current[1] = _this.parent.getColumnIndexByUid(_this.focusedColumnUid) || 0;\n var focusElement = _this.getContent().getFocusInfo().elementToFocus;\n if (focusElement) {\n var cellPosition = focusElement.getBoundingClientRect();\n var gridPosition = _this.parent.element.getBoundingClientRect();\n if (cellPosition.top >= 0 && cellPosition.left >= 0 &&\n cellPosition.right <= Math.min(gridPosition.right, window.innerWidth ||\n document.documentElement.clientWidth) &&\n cellPosition.bottom <= Math.min(gridPosition.bottom, window.innerHeight ||\n document.documentElement.clientHeight)) {\n _this.isVirtualScroll = true;\n _this.focus();\n }\n }\n }\n }\n else if (e.args.focusElement && e.args.focusElement.classList.contains('e-filtertext')) {\n var focusElement = _this.parent.element.querySelector('#' + e.args.focusElement.id);\n if (focusElement) {\n focusElement.focus();\n }\n }\n }\n if (e && e.args && e.args.requestType === 'infiniteScroll') {\n _this.isInfiniteScroll = true;\n }\n };\n };\n FocusStrategy.prototype.refreshAddNewRowMatrix = function (matrix) {\n var cols = this.parent.getColumns();\n var indent = this.parent.getIndentCount();\n for (var i = indent; i < matrix.length - 1; i++) {\n if (cols[i - indent] && cols[i - indent].visible && cols[i - indent].allowEditing) {\n matrix[parseInt(i.toString(), 10)] = 1;\n }\n else {\n matrix[parseInt(i.toString(), 10)] = 0;\n }\n }\n return matrix;\n };\n FocusStrategy.prototype.addEventListener = function () {\n var _this = this;\n if (this.parent.isDestroyed) {\n return;\n }\n EventHandler.add(this.parent.element, 'mousedown', this.focusCheck, this);\n EventHandler.add(this.parent.element, 'touchstart', this.focusCheck, this);\n EventHandler.add(this.parent.element, 'focus', this.onFocus, this);\n this.parent.element.addEventListener('focus', this.passiveHandler = function (e) { return _this.passiveFocus(e); }, true);\n EventHandler.add(this.parent.element, 'focusout', this.onBlur, this);\n this.evtHandlers = [{ event: event.keyPressed, handler: this.onKeyPress },\n { event: event.click, handler: this.onClick },\n { event: event.contentReady, handler: this.refMatrix },\n { event: event.partialRefresh, handler: this.refMatrix },\n { event: event.refreshExpandandCollapse, handler: this.refMatrix },\n { event: event.showAddNewRowFocus, handler: this.showAddNewRowFocus },\n { event: event.headerRefreshed, handler: this.refreshMatrix() },\n { event: event.closeEdit, handler: this.restoreFocus },\n { event: event.restoreFocus, handler: this.restoreFocus },\n { event: 'start-edit', handler: this.clearIndicator },\n { event: 'start-add', handler: this.clearIndicator },\n { event: 'sorting-complete', handler: this.restoreFocus },\n { event: 'filtering-complete', handler: this.filterfocus },\n { event: 'custom-filter-close', handler: this.filterfocus },\n { event: 'grouping-complete', handler: this.restoreFocusWithAction },\n { event: 'ungrouping-complete', handler: this.restoreFocusWithAction },\n { event: event.batchAdd, handler: this.refMatrix },\n { event: event.batchCancel, handler: this.refMatrix },\n { event: event.batchDelete, handler: this.refMatrix },\n { event: event.detailDataBound, handler: this.refMatrix },\n { event: event.onEmpty, handler: this.refMatrix },\n { event: event.cellFocused, handler: this.internalCellFocus }];\n addRemoveEventListener(this.parent, this.evtHandlers, true, this);\n };\n FocusStrategy.prototype.showAddNewRowFocus = function () {\n if (this.parent.editSettings.showAddNewRow) {\n var startIdx = this.parent.editSettings.newRowPosition === 'Top' ? 0 : this.content.matrix.matrix.length - 1;\n var startCellIdx = this.parent.getIndentCount();\n if (this.parent.editSettings.newRowPosition === 'Top' && (this.parent.frozenRows ||\n this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {\n var headrIdx = this.header.matrix.matrix.length - (this.groupedFrozenRow ?\n this.groupedFrozenRow : this.parent.frozenRows);\n startCellIdx = this.findNextCellFocus(this.header.matrix.matrix[headrIdx - 1], startCellIdx);\n this.header.matrix.current = [headrIdx - 1, startCellIdx];\n this.active = this.header;\n }\n else {\n startCellIdx = this.findNextCellFocus(this.content.matrix.matrix[parseInt(startIdx.toString(), 10)], startCellIdx);\n this.content.matrix.current = [startIdx, startCellIdx];\n this.active = this.content;\n }\n var addedrow = this.parent.element.querySelector('.e-addedrow');\n if (addedrow && addedrow.querySelectorAll('tr') &&\n addedrow.querySelector('tr').cells[parseInt(startCellIdx.toString(), 10)].querySelector('input')) {\n addedrow.querySelector('tr').cells[parseInt(startCellIdx.toString(), 10)].querySelector('input').select();\n }\n }\n };\n FocusStrategy.prototype.findNextCellFocus = function (matrix, cellIndex) {\n for (var i = cellIndex; i < matrix.length; i++) {\n if (matrix[parseInt(i.toString(), 10)] === 1) {\n return i;\n }\n }\n return cellIndex;\n };\n FocusStrategy.prototype.filterfocus = function () {\n if (this.parent.filterSettings.type !== 'FilterBar') {\n this.restoreFocus();\n }\n };\n FocusStrategy.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n EventHandler.remove(this.parent.element, 'mousedown', this.focusCheck);\n EventHandler.remove(this.parent.element, 'touchstart', this.focusCheck);\n EventHandler.remove(this.parent.element, 'focus', this.onFocus);\n EventHandler.remove(this.parent.element, 'focusout', this.onBlur);\n this.parent.element.removeEventListener('focus', this.passiveHandler, true);\n addRemoveEventListener(this.parent, this.evtHandlers, false);\n };\n FocusStrategy.prototype.destroy = function () {\n this.removeEventListener();\n };\n FocusStrategy.prototype.restoreFocus = function () {\n var groupModule = this.parent.groupModule;\n if (this.parent.allowGrouping && groupModule && (groupModule.groupSortFocus || groupModule.groupTextFocus)) {\n groupModule.groupSortFocus = false;\n groupModule.groupTextFocus = false;\n return;\n }\n this.firstHeaderCellClick = true;\n this.addFocus(this.getContent().getFocusInfo());\n };\n FocusStrategy.prototype.restoreFocusWithAction = function (e) {\n if (!this.parent.enableInfiniteScrolling) {\n var matrix = this.getContent().matrix;\n var current = matrix.current;\n switch (e.requestType) {\n case 'grouping':\n case 'ungrouping':\n current[1] = current.length &&\n !this.parent.groupSettings.showGroupedColumn && !isNullOrUndefined(matrix.matrix[current[0]]) ?\n matrix.matrix[current[0]].indexOf(1) : e.requestType === 'grouping' ? current[1] + 1 : current[1] - 1;\n break;\n }\n this.getContent().matrix.current = current;\n var groupModule = this.parent.groupModule;\n if (this.parent.allowGrouping && groupModule && groupModule.groupCancelFocus) {\n var focusableGroupedItems = groupModule.getFocusableGroupedItems();\n if (focusableGroupedItems.length) {\n if (focusableGroupedItems[0].parentElement.getAttribute('ej-mappingname') === e.columnName) {\n focusableGroupedItems[3].focus();\n }\n else {\n focusableGroupedItems[0].focus();\n }\n }\n else {\n groupModule.element.focus();\n }\n groupModule.groupCancelFocus = false;\n return;\n }\n this.addFocus(this.getContent().getFocusInfo());\n }\n };\n FocusStrategy.prototype.clearOutline = function () {\n this.getContent().matrix.current = this.getContent().matrix.get(0, -1, [0, 1], 'downArrow', this.getContent().validator());\n this.clearIndicator();\n };\n FocusStrategy.prototype.clearIndicator = function () {\n if (!this.currentInfo.element || !this.currentInfo.elementToFocus) {\n return;\n }\n removeClass([this.currentInfo.element, this.currentInfo.elementToFocus], ['e-focus', 'e-focused']);\n };\n FocusStrategy.prototype.getPrevIndexes = function () {\n var forget = this.forget;\n this.forget = false;\n return forget || !Object.keys(this.prevIndexes).length ? { rowIndex: null, cellIndex: null } : this.prevIndexes;\n };\n FocusStrategy.prototype.forgetPrevious = function () {\n this.forget = true;\n };\n FocusStrategy.prototype.setActiveByKey = function (action, active) {\n if (this.parent.frozenRows === 0) {\n return;\n }\n // eslint-disable-next-line prefer-const\n var info;\n var actions = {\n 'home': function () { return ({ toHeader: !info.isContent, toFrozen: true }); },\n 'end': function () { return ({ toHeader: !info.isContent, toFrozen: false }); },\n 'ctrlHome': function () { return ({ toHeader: true, toFrozen: false }); },\n 'ctrlEnd': function () { return ({ toHeader: false, toFrozen: false }); }\n };\n if (!(action in actions)) {\n return;\n }\n info = active.getInfo();\n var swap = actions[\"\" + action]();\n this.setActive(!swap.toHeader);\n this.getContent().matrix.current = active.matrix.current;\n };\n FocusStrategy.prototype.internalCellFocus = function (e) {\n if (!(e.byKey && e.container.isContent && e.keyArgs.action === 'enter'\n && (e.parent.classList.contains('e-detailcell') ||\n e.parent.classList.contains('e-unboundcell')))) {\n return;\n }\n this.clearIndicator();\n var focusEle = this.getContent().getFocusable(this.getFocusedElement());\n this.setFocusedElement(focusEle);\n this.currentInfo.skipAction = true;\n };\n return FocusStrategy;\n}());\nexport { FocusStrategy };\n/**\n * Create matrix from row collection which act as mental model for cell navigation\n *\n * @hidden\n */\nvar Matrix = /** @class */ (function () {\n function Matrix() {\n this.matrix = [];\n this.current = [];\n }\n Matrix.prototype.set = function (rowIndex, columnIndex, allow) {\n rowIndex = Math.max(0, Math.min(rowIndex, this.rows));\n columnIndex = Math.max(0, Math.min(columnIndex, this.columns));\n this.matrix[parseInt(rowIndex.toString(), 10)] = this.matrix[parseInt(rowIndex.toString(), 10)] || [];\n this.matrix[parseInt(rowIndex.toString(), 10)][parseInt(columnIndex.toString(), 10)] = allow ? 1 : 0;\n };\n Matrix.prototype.get = function (rowIndex, columnIndex, navigator, action, validator) {\n var tmp = columnIndex;\n if (rowIndex + navigator[0] < 0) {\n return [rowIndex, columnIndex];\n }\n rowIndex = Math.max(0, Math.min(rowIndex + navigator[0], this.rows));\n var emptyTable = true;\n if (isNullOrUndefined(this.matrix[parseInt(rowIndex.toString(), 10)])) {\n return null;\n }\n columnIndex = Math.max(0, Math.min(columnIndex + navigator[1], this.matrix[parseInt(rowIndex.toString(), 10)].length - 1));\n if (tmp + navigator[1] > this.matrix[parseInt(rowIndex.toString(), 10)].length - 1\n && validator(rowIndex, columnIndex, action)) {\n return [rowIndex, tmp];\n }\n var first = this.first(this.matrix[parseInt(rowIndex.toString(), 10)], columnIndex, navigator, true, action);\n columnIndex = first === null ? tmp : first;\n var val = getValue(rowIndex + \".\" + columnIndex, this.matrix);\n if (rowIndex === this.rows && (action === 'downArrow' || action === 'enter')) {\n navigator[0] = -1;\n }\n if (first === null) {\n for (var i = 0; i < this.rows; i++) {\n if (this.matrix[parseInt(i.toString(), 10)].some(function (v) { return v === 1; })) {\n emptyTable = false;\n break;\n }\n }\n if (emptyTable) {\n rowIndex = this.current.length ? this.current[0] : 0;\n return [rowIndex, columnIndex];\n }\n }\n return this.inValid(val) || !validator(rowIndex, columnIndex, action) ?\n this.get(rowIndex, tmp, navigator, action, validator) : [rowIndex, columnIndex];\n };\n Matrix.prototype.first = function (vector, index, navigator, moveTo, action) {\n if (((index < 0 || index === vector.length) && this.inValid(vector[parseInt(index.toString(), 10)])\n && (action !== 'upArrow' && action !== 'downArrow')) || !vector.some(function (v) { return v === 1; })) {\n return null;\n }\n return !this.inValid(vector[parseInt(index.toString(), 10)]) ? index :\n this.first(vector, (['upArrow', 'downArrow', 'shiftUp', 'shiftDown'].indexOf(action) !== -1) ? moveTo ? 0 : ++index : index + navigator[1], navigator, false, action);\n };\n Matrix.prototype.select = function (rowIndex, columnIndex) {\n rowIndex = Math.max(0, Math.min(rowIndex, this.rows));\n columnIndex = Math.max(0, Math.min(columnIndex, this.matrix[parseInt(rowIndex.toString(), 10)].length - 1));\n this.current = [rowIndex, columnIndex];\n };\n Matrix.prototype.generate = function (rows, selector, isRowTemplate) {\n this.rows = rows.length - 1;\n this.matrix = [];\n for (var i = 0; i < rows.length; i++) {\n var cells = rows[parseInt(i.toString(), 10)].cells.filter(function (c) { return c.isSpanned !== true; });\n this.columns = Math.max(cells.length - 1, this.columns | 0);\n var incrementNumber = 0;\n for (var j = 0; j < cells.length; j++) {\n if (cells[parseInt(j.toString(), 10)].column && cells[parseInt(j.toString(), 10)].column.columns) {\n incrementNumber = this.columnsCount(cells[parseInt(j.toString(), 10)].column.columns, incrementNumber);\n }\n else {\n incrementNumber++;\n }\n this.set(i, j, rows[parseInt(i.toString(), 10)].visible === false ?\n false : selector(rows[parseInt(i.toString(), 10)], cells[parseInt(j.toString(), 10)], isRowTemplate));\n }\n this.columns = Math.max(incrementNumber - 1, this.columns | 0);\n }\n return this.matrix;\n };\n Matrix.prototype.columnsCount = function (rowColumns, currentColumnCount) {\n var columns = rowColumns;\n var incrementNumber = currentColumnCount;\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].columns) {\n incrementNumber = this.columnsCount(columns[parseInt(i.toString(), 10)].columns, incrementNumber);\n }\n else {\n incrementNumber++;\n }\n }\n return incrementNumber;\n };\n Matrix.prototype.inValid = function (value) {\n return value === 0 || value === undefined;\n };\n return Matrix;\n}());\nexport { Matrix };\n/**\n * @hidden\n */\nvar ContentFocus = /** @class */ (function () {\n function ContentFocus(parent) {\n var _this = this;\n this.matrix = new Matrix();\n this.lastIdxCell = false;\n this.parent = parent;\n this.keyActions = {\n 'rightArrow': [0, 1],\n 'tab': [0, 1],\n 'leftArrow': [0, -1],\n 'shiftTab': [0, -1],\n 'upArrow': [-1, 0],\n 'downArrow': [1, 0],\n 'shiftUp': [-1, 0],\n 'shiftDown': [1, 0],\n 'shiftRight': [0, 1],\n 'shiftLeft': [0, -1],\n 'enter': [1, 0],\n 'shiftEnter': [-1, 0]\n };\n this.indexesByKey = function (action) {\n var opt = {\n 'home': [_this.matrix.current[0], -1, 0, 1],\n 'end': [_this.matrix.current[0], _this.matrix.columns + 1, 0, -1],\n 'ctrlHome': [0, -1, 0, 1],\n 'ctrlEnd': [_this.matrix.rows, _this.matrix.columns + 1, 0, -1]\n };\n return opt[\"\" + action] || null;\n };\n }\n ContentFocus.prototype.getTable = function () {\n return (this.parent.getContentTable());\n };\n ContentFocus.prototype.onKeyPress = function (e) {\n var isMacLike = /(Mac)/i.test(navigator.platform);\n if (isMacLike && e.metaKey) {\n if (e.action === 'home') {\n e.action = 'ctrlHome';\n }\n else if (e.action === 'end') {\n e.action = 'ctrlEnd';\n }\n else if (['downArrow', 'upArrow', 'leftArrow', 'rightArrow'].indexOf(e.action) !== -1) {\n return;\n }\n }\n var navigators = this.keyActions[e.action];\n var current = this.getCurrentFromAction(e.action, navigators, e.action in this.keyActions, e);\n if (!current) {\n return;\n }\n if (((['tab', 'shiftTab'].indexOf(e.action) > -1 && this.matrix.current || []).toString() === current.toString())\n || (this.parent.allowPaging && !this.parent.pagerModule.pagerObj.checkPagerHasFocus()\n && this.matrix.current[0] === this.matrix.rows && ((this.parent.editSettings.mode === 'Batch'\n && this.parent.editSettings.allowAdding && e.keyCode === 40) || (e.keyCode === 40)))) {\n if (current.toString() === [this.matrix.rows, this.matrix.columns].toString() ||\n current.toString() === [0, 0].toString() || (this.matrix.current[0] === this.matrix.rows &&\n this.matrix.current.toString() === current.toString()) || (this.parent.allowGrouping &&\n this.parent.infiniteScrollSettings.enableCache && current.toString() === [0, 1].toString())) {\n return false;\n }\n else {\n current = this.editNextRow(current[0], current[1], e.action);\n }\n }\n this.matrix.select(current[0], current[1]);\n };\n ContentFocus.prototype.editNextRow = function (rowIndex, cellIndex, action) {\n var gObj = this.parent;\n var editNextRow = gObj.editSettings.allowNextRowEdit && (gObj.isEdit || gObj.isLastCellPrimaryKey);\n var visibleIndex = gObj.getColumnIndexByField(gObj.getVisibleColumns()[0].field);\n var row = this.getTable().rows[parseInt(rowIndex.toString(), 10)];\n var cell = gObj.editSettings.showAddNewRow && row.classList.contains('e-addedrow') ?\n (row.querySelectorAll('td:not(.e-editcell)'))[parseInt(cellIndex.toString(), 10)]\n : row.cells[parseInt(cellIndex.toString(), 10)];\n if (action === 'tab' && editNextRow) {\n rowIndex++;\n var index = (this.getTable().rows[parseInt(rowIndex.toString(), 10)].getElementsByClassName('e-indentcell').length +\n this.getTable().rows[parseInt(rowIndex.toString(), 10)].getElementsByClassName('e-detailrowcollapse').length);\n cellIndex = visibleIndex + index;\n }\n if (action === 'shiftTab' && editNextRow) {\n rowIndex--;\n cellIndex = gObj.getColumnIndexByField(gObj.getVisibleColumns()[gObj.getVisibleColumns().length - 1].field);\n }\n return !cell.classList.contains(literals.rowCell) && !cell.classList.contains('e-headercell') &&\n !cell.classList.contains('e-groupcaption') && !cell.classList.contains('e-filterbarcell') ?\n this.editNextRow(rowIndex, cellIndex, action) : [rowIndex, cellIndex];\n };\n ContentFocus.prototype.getCurrentFromAction = function (action, navigator, isPresent, e) {\n if (navigator === void 0) { navigator = [0, 0]; }\n if (!isPresent && !this.indexesByKey(action) || (this.matrix.current.length === 0)) {\n return null;\n }\n if (!this.shouldFocusChange(e)) {\n return this.matrix.current;\n }\n // eslint-disable-next-line\n var _a = this.indexesByKey(action) || this.matrix.current.concat(navigator), rowIndex = _a[0], cellIndex = _a[1], rN = _a[2], cN = _a[3];\n if (this.parent.allowGrouping && this.parent.groupSettings.columns.length && this.parent.aggregates.length && action === 'enter') {\n for (var i = rowIndex; i < this.matrix.matrix.length; i++) {\n var row = this.getTable().rows[i + 1];\n if (row && row.cells[parseInt(cellIndex.toString(), 10)] && row.cells[parseInt(cellIndex.toString(), 10)].classList.contains('e-rowcell')) {\n return [i + 1, cellIndex];\n }\n if (i === this.matrix.matrix.length - 1) {\n return [rowIndex, cellIndex];\n }\n }\n }\n if (action === 'ctrlEnd' || action === 'end') {\n var lastContentCellIndex = [this.matrix.matrix.length - 1,\n this.matrix.matrix[this.matrix.matrix.length - 1].length - 1];\n if (action === 'end') {\n lastContentCellIndex = [rowIndex, this.matrix.matrix[parseInt(rowIndex.toString(), 10)].length - 1];\n }\n if (this.matrix.matrix[lastContentCellIndex[0]][lastContentCellIndex[1]] === 0) {\n lastContentCellIndex = findCellIndex(this.matrix.matrix, lastContentCellIndex, false);\n }\n rowIndex = lastContentCellIndex[0];\n cellIndex = lastContentCellIndex[1] + 1;\n }\n var current = this.matrix.get(rowIndex, cellIndex, [rN, cN], action, this.validator());\n return current;\n };\n ContentFocus.prototype.onClick = function (e, force) {\n var target = e.target;\n this.target = target;\n target = (target.classList.contains(literals.rowCell) ? target : closest(target, 'td'));\n target = target ? target : closest(e.target, 'td.e-detailrowcollapse')\n || closest(e.target, 'td.e-detailrowexpand');\n target = closest(e.target, 'td.e-detailcell') ?\n isNullOrUndefined(closest(closest(e.target, '.e-grid'), 'td.e-detailcell')) ? null : target : target;\n target = target && closest(target, 'table').classList.contains(literals.table) ? target : null;\n if (!target) {\n return false;\n }\n var rowIdx = target.parentElement.rowIndex;\n if (this.parent.editSettings.showAddNewRow && parentsUntil(target, 'e-addedrow')) {\n rowIdx = parentsUntil(target, 'e-addedrow').rowIndex;\n }\n var _a = [rowIdx, target.cellIndex], rowIndex = _a[0], cellIndex = _a[1];\n var _b = this.matrix.current, oRowIndex = _b[0], oCellIndex = _b[1];\n var val = getValue(rowIndex + \".\" + cellIndex, this.matrix.matrix);\n if (this.matrix.inValid(val) || (!force && oRowIndex === rowIndex && oCellIndex === cellIndex) ||\n (!parentsUntil(e.target, literals.rowCell) && !parentsUntil(e.target, 'e-groupcaption')\n && !parentsUntil(e.target, 'e-recordpluscollapse') && !parentsUntil(e.target, 'e-recordplusexpand')\n && !parentsUntil(e.target, 'e-detailrowcollapse') && !parentsUntil(e.target, 'e-detailrowexpand')\n && !parentsUntil(e.target, 'e-templatecell'))) {\n return false;\n }\n this.matrix.select(rowIndex, cellIndex);\n };\n ContentFocus.prototype.getFocusInfo = function () {\n var info = {};\n var _a = this.matrix.current, _b = _a[0], rowIndex = _b === void 0 ? 0 : _b, _c = _a[1], cellIndex = _c === void 0 ? 0 : _c;\n this.matrix.current = [rowIndex, cellIndex];\n var row = this.getTable().rows[parseInt(rowIndex.toString(), 10)];\n info.element = !isNullOrUndefined(row) ? this.parent.editSettings.showAddNewRow && row.classList.contains('e-addedrow') ?\n (row.querySelectorAll('td:not(.e-editcell)'))[parseInt(cellIndex.toString(), 10)]\n : row.cells[parseInt(cellIndex.toString(), 10)] : null;\n if (!info.element) {\n return info;\n }\n info.elementToFocus = (!info.element.classList.contains('e-unboundcell') || (this.parent.editSettings.showAddNewRow &&\n info.element.classList.contains('e-unboundcell') && parentsUntil(info.element, 'e-addedrow'))) &&\n !info.element.classList.contains('e-detailcell') ? this.getFocusable(info.element) : info.element;\n info.elementToFocus = info.element.classList.contains('e-detailcell') && info.element.querySelector('.e-childgrid')\n ? info.element.querySelector('.e-childgrid') : info.elementToFocus;\n if (this.parent.editSettings.mode === 'Batch' && this.parent.isEdit && info.elementToFocus.tagName.toLowerCase() === 'input'\n && info.elementToFocus.classList.contains('e-dropdownlist')) {\n info.elementToFocus = info.elementToFocus.parentElement;\n }\n info.outline = true;\n info.uid = info.element.parentElement.getAttribute('data-uid');\n return info;\n };\n ContentFocus.prototype.getFocusable = function (element) {\n var query = 'button, [href], input:not([type=\"hidden\"]), select, textarea, [tabindex]:not([tabindex=\"-1\"])';\n var isTemplate = !isNullOrUndefined(closest(element, '.e-templatecell'));\n if (this.parent.isEdit) {\n var commandCellQuery = this.parent.editSettings.showAddNewRow && parentsUntil(element, 'e-addedrow') ?\n ', button:not(.e-hide)' : '';\n query = 'input:not([type=\"hidden\"]), select:not([aria-hidden=\"true\"]), textarea' + commandCellQuery;\n }\n var child = [].slice.call(element.querySelectorAll(query));\n /* Select the first focusable child element\n * if no child found then select the cell itself.\n * if Grid is in editable state, check for editable control inside child.\n */\n return child.length ? isTemplate && child.length > 1 ? this.target ? this.target : element : child[0] : element;\n };\n ContentFocus.prototype.selector = function (row, cell, isRowTemplate) {\n var types = [CellType.Expand, CellType.GroupCaption, CellType.CaptionSummary, CellType.GroupSummary];\n return ((row.isDataRow && cell.visible && (cell.isDataCell || cell.isTemplate))\n || (row.isDataRow && cell.cellType === CellType.DetailExpand && isNullOrUndefined(cell.visible))\n || (!row.isDataRow && types.indexOf(cell.cellType) > -1\n && !((cell.cellType === CellType.GroupSummary || cell.cellType === CellType.CaptionSummary)\n && !(cell.isDataCell && cell.visible)))\n || (cell.column && cell.visible && cell.column.type === 'checkbox')\n || (cell.cellType === CellType.CommandColumn)\n || (row.isDataRow && isRowTemplate))\n && !(row.edit === 'delete' && row.isDirty);\n };\n ContentFocus.prototype.nextRowFocusValidate = function (index) {\n var lastIndex = index;\n for (var i = index, len = this.matrix.rows; i <= len; i++) {\n if (this.matrix.matrix[parseInt(index.toString(), 10)].indexOf(1) === -1) {\n index = index + 1;\n }\n else {\n return index;\n }\n }\n this.lastIdxCell = true;\n return lastIndex;\n };\n ContentFocus.prototype.previousRowFocusValidate = function (index) {\n var firstIndex = index;\n for (var i = index, len = 0; i >= len; i--) {\n if (this.matrix.matrix[parseInt(index.toString(), 10)].indexOf(1) === -1) {\n index = index - 1;\n if (index < 0) {\n this.lastIdxCell = true;\n return firstIndex;\n }\n }\n else {\n return index;\n }\n }\n return firstIndex;\n };\n ContentFocus.prototype.jump = function (action, current) {\n this.lastIdxCell = false;\n var enterFrozen = this.parent.frozenRows !== 0 && action === 'shiftEnter';\n var headerSwap = (action === 'upArrow' || enterFrozen) && current[0] === 0;\n if (this.matrix.matrix[current[0]]) {\n if (action === 'tab' && this.matrix.matrix.length &&\n current[1] === this.matrix.matrix[current[0]].lastIndexOf(1) && this.matrix.matrix.length - 1 !== current[0]) {\n this.matrix.current[0] = this.nextRowFocusValidate(this.matrix.current[0] + 1);\n this.matrix.current[1] = -1;\n }\n }\n if (action === 'shiftTab' &&\n current[0] !== 0 && this.matrix.matrix[current[0]].indexOf(1) === current[1]) {\n this.matrix.current[0] = this.previousRowFocusValidate(this.matrix.current[0] - 1);\n this.matrix.current[1] = this.matrix.matrix[current[0]].length;\n }\n var isHeaderFocus = false;\n var row = parentsUntil(document.activeElement, 'e-addedrow') && this.parent.editSettings.showAddNewRow ?\n parentsUntil(document.activeElement, 'e-addedrow') : document.activeElement.parentElement;\n if ((this.parent.enableVirtualization || this.parent.infiniteScrollSettings.enableCache)\n && !isNullOrUndefined(row) && row.classList.contains(literals.row)) {\n var rowIndex = parseInt(row.getAttribute(literals.dataRowIndex), 10);\n isHeaderFocus = rowIndex > 0;\n }\n var info = {\n swap: !isHeaderFocus ? ((action === 'upArrow' || enterFrozen) && current[0] === 0) : false,\n toHeader: headerSwap\n };\n return info;\n };\n ContentFocus.prototype.getNextCurrent = function (previous, swap, active, action) {\n if (previous === void 0) { previous = []; }\n var current = [];\n if (action === 'rightArrow' || action === 'tab') {\n current[0] = previous[0];\n current[1] = -1;\n }\n if (action === 'downArrow' || action === 'enter') {\n current[0] = -1;\n current[1] = previous[1];\n }\n return current;\n };\n ContentFocus.prototype.generateRows = function (rows, optionals) {\n var _a;\n var matrix = optionals.matrix, handlerInstance = optionals.handlerInstance;\n var len = handlerInstance.matrix.matrix.length;\n var defaultLen = this.parent.allowFiltering && this.parent.filterSettings.type === 'FilterBar' ? len + 1 : len;\n handlerInstance.matrix.matrix = handlerInstance.matrix.matrix.slice(0, defaultLen); //Header matrix update.\n handlerInstance.matrix.rows = defaultLen;\n (_a = handlerInstance.matrix.matrix).push.apply(_a, matrix);\n handlerInstance.matrix.rows += matrix.length;\n };\n ContentFocus.prototype.getInfo = function (e) {\n var info = this.getFocusInfo();\n var _a = this.matrix.current, rIndex = _a[0], cIndex = _a[1];\n var isData = info.element.classList.contains(literals.rowCell);\n var isSelectable = isData || (e && e.action !== 'enter' && (info.element.classList.contains('e-detailrowcollapse')\n || info.element.classList.contains('e-detailrowexpand')));\n // eslint-disable-next-line\n var _b = [Math.min(parseInt(info.element.parentElement.getAttribute(literals.dataRowIndex), 10), rIndex),\n Math.min(parseInt(info.element.getAttribute(literals.dataColIndex), 10), cIndex)], rowIndex = _b[0], cellIndex = _b[1];\n if (this.parent.allowGrouping && this.parent.groupSettings.enableLazyLoading && isData) {\n rowIndex = this.parent.getDataRows().indexOf(info.element.parentElement);\n }\n if (this.parent.enableVirtualization && this.parent.groupSettings.columns.length) {\n rowIndex = rIndex;\n cellIndex = cIndex;\n }\n if (this.parent.editSettings.showAddNewRow && this.parent.editSettings.newRowPosition === 'Top' &&\n !this.parent.enableVirtualization && !this.parent.enableInfiniteScrolling && e && e.action === 'downArrow') {\n rowIndex++;\n }\n return { isContent: true, isDataCell: isData, indexes: [rowIndex, cellIndex], isSelectable: isSelectable };\n };\n ContentFocus.prototype.validator = function () {\n var table = this.getTable();\n return function (rowIndex, cellIndex, action) {\n if (!isNullOrUndefined(table.rows[parseInt(rowIndex.toString(), 10)])) {\n var cell = void 0;\n cellIndex = table.querySelector('.e-emptyrow') ? 0 : cellIndex;\n if (table.rows[parseInt(rowIndex.toString(), 10)].cells[0].classList.contains('e-editcell')) {\n cell = table.rows[parseInt(rowIndex.toString(), 10)].cells[0].querySelectorAll('td')[parseInt(cellIndex.toString(), 10)];\n }\n else {\n cell = table.rows[parseInt(rowIndex.toString(), 10)].cells[parseInt(cellIndex.toString(), 10)];\n }\n var isCellWidth = cell.getBoundingClientRect().width !== 0;\n if (action === 'enter' || action === 'shiftEnter') {\n return isCellWidth && cell.classList.contains(literals.rowCell);\n }\n if ((action === 'shiftUp' || action === 'shiftDown') && cell.classList.contains(literals.rowCell)) {\n return isCellWidth;\n }\n else if (action !== 'shiftUp' && action !== 'shiftDown') {\n return isCellWidth;\n }\n }\n return false;\n };\n };\n ContentFocus.prototype.shouldFocusChange = function (e) {\n var _a = this.matrix.current, _b = _a[0], rIndex = _b === void 0 ? -1 : _b, _c = _a[1], cIndex = _c === void 0 ? -1 : _c;\n if (rIndex < 0 || cIndex < 0) {\n return true;\n }\n var cell = getValue(rIndex + \".cells.\" + cIndex, this.getTable().rows);\n if (!cell) {\n return true;\n }\n return e.action === 'enter' || e.action === 'shiftEnter' ?\n cell.classList.contains(literals.rowCell) && !cell.classList.contains('e-unboundcell')\n || cell.classList.contains('e-editedbatchcell') && !cell.classList.contains('e-detailcell') : true;\n };\n ContentFocus.prototype.getGridSeletion = function () {\n return this.parent.allowSelection && this.parent.selectionSettings.allowColumnSelection;\n };\n return ContentFocus;\n}());\nexport { ContentFocus };\n/**\n * @hidden\n */\nvar HeaderFocus = /** @class */ (function (_super) {\n __extends(HeaderFocus, _super);\n function HeaderFocus(parent) {\n return _super.call(this, parent) || this;\n }\n HeaderFocus.prototype.getTable = function () {\n return (this.parent.getHeaderTable());\n };\n HeaderFocus.prototype.onClick = function (e) {\n var target = e.target;\n this.target = target;\n target = (target.classList.contains('e-headercell') ? target : closest(target, 'th'));\n if (!target && (this.parent.frozenRows !== 0 || ((this.parent.enableVirtualization || this.parent.enableInfiniteScrolling) &&\n this.parent.editSettings.showAddNewRow))) {\n target = (e.target.classList.contains(literals.rowCell) ? e.target :\n closest(e.target, 'td'));\n }\n if (e.target.classList.contains('e-columnheader') ||\n e.target.querySelector('.e-stackedheadercell')) {\n return false;\n }\n if (!target) {\n return;\n }\n var rowIdx = target.parentElement.rowIndex;\n if (this.parent.editSettings.showAddNewRow && parentsUntil(target, 'e-addedrow')) {\n rowIdx = parentsUntil(target, 'e-addedrow').rowIndex;\n }\n var _a = [rowIdx, target.cellIndex], rowIndex = _a[0], cellIndex = _a[1];\n var val = getValue(rowIndex + \".\" + cellIndex, this.matrix.matrix);\n if (this.matrix.inValid(val)) {\n return false;\n }\n this.matrix.select(rowIdx, target.cellIndex);\n };\n HeaderFocus.prototype.getFocusInfo = function () {\n var info = {};\n var _a = this.matrix.current, _b = _a[0], rowIndex = _b === void 0 ? 0 : _b, _c = _a[1], cellIndex = _c === void 0 ? 0 : _c;\n var row = this.getTable().rows[parseInt(rowIndex.toString(), 10)];\n info.element = !isNullOrUndefined(row) ? this.parent.editSettings.showAddNewRow && row.classList.contains('e-addedrow') ?\n (row.querySelectorAll('td:not(.e-editcell)'))[parseInt(cellIndex.toString(), 10)]\n : row.cells[parseInt(cellIndex.toString(), 10)] : null;\n if (!isNullOrUndefined(info.element)) {\n info.elementToFocus = this.getFocusable(info.element);\n info.outline = !info.element.classList.contains('e-filterbarcell');\n }\n return info;\n };\n HeaderFocus.prototype.selector = function (row, cell) {\n return (cell.visible && (cell.column.field !== undefined || cell.isTemplate || !isNullOrUndefined(cell.column.template)\n || !isNullOrUndefined(cell.column.commands))) || cell.column.type === 'checkbox' || cell.cellType === CellType.StackedHeader;\n };\n HeaderFocus.prototype.jump = function (action, current) {\n var enterFrozen = this.parent.frozenRows !== 0 && action === 'enter';\n var isLastCell;\n var lastRow;\n if (this.parent.enableHeaderFocus && action === 'tab') {\n lastRow = this.matrix.matrix.length - 1 === current[0];\n isLastCell = current[1] === this.matrix.matrix[current[0]].lastIndexOf(1);\n if (isLastCell) {\n if (!lastRow) {\n this.matrix.current[0] = this.matrix.current[0] + 1;\n }\n else {\n this.matrix.current[0] = 0;\n }\n this.matrix.current[1] = -1;\n }\n }\n return {\n swap: ((action === 'downArrow' || enterFrozen) && current[0] === this.matrix.matrix.length - 1) ||\n (action === 'tab' && lastRow && isLastCell)\n };\n };\n HeaderFocus.prototype.getNextCurrent = function (previous, swap, active, action) {\n if (previous === void 0) { previous = []; }\n var current1 = [];\n if (action === 'rightArrow' || (action === 'shiftRight' && this.getGridSeletion()) || action === 'tab') {\n current1[0] = previous[0];\n current1[1] = -1;\n }\n if (action === 'upArrow' || action === 'shiftEnter') {\n current1[0] = this.matrix.matrix.length;\n current1[1] = previous[1];\n }\n return current1;\n };\n HeaderFocus.prototype.generateRows = function (rows) {\n var length = this.matrix.matrix.length;\n if (this.parent.allowFiltering && this.parent.filterSettings.type === 'FilterBar') {\n this.matrix.rows = ++this.matrix.rows;\n var cells = rows[0].cells;\n var incrementNumber = 0;\n for (var i = 0; i < cells.length; i++) {\n if (cells[parseInt(i.toString(), 10)].column && cells[parseInt(i.toString(), 10)].column.columns) {\n incrementNumber = this.checkFilterColumn(cells[parseInt(i.toString(), 10)].column.columns, length, incrementNumber);\n }\n else {\n this.matrix.set(length, incrementNumber, cells[parseInt(i.toString(), 10)].visible && cells[parseInt(i.toString(), 10)].column.allowFiltering !== false);\n incrementNumber++;\n }\n }\n }\n };\n HeaderFocus.prototype.checkFilterColumn = function (rowColumns, rowIndex, columnIndex) {\n var columns = rowColumns;\n var incrementNumber = columnIndex;\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].columns) {\n incrementNumber = this.checkFilterColumn(columns[parseInt(i.toString(), 10)].columns, rowIndex, incrementNumber);\n }\n else {\n this.matrix.set(rowIndex, incrementNumber, columns[parseInt(i.toString(), 10)].visible && columns[parseInt(i.toString(), 10)].allowFiltering !== false);\n incrementNumber++;\n }\n }\n return incrementNumber;\n };\n HeaderFocus.prototype.getInfo = function (e) {\n return extend(_super.prototype.getInfo.call(this, e), { isContent: false, isHeader: true });\n };\n HeaderFocus.prototype.validator = function () {\n return function () { return true; };\n };\n HeaderFocus.prototype.shouldFocusChange = function (e) {\n var _a = this.matrix.current, rowIndex = _a[0], columnIndex = _a[1];\n if (rowIndex < 0 || columnIndex < 0) {\n return true;\n }\n var cell = getValue(rowIndex + \".cells.\" + columnIndex, this.getTable().rows);\n if (!cell) {\n return true;\n }\n return e.action === 'enter' || e.action === 'altDownArrow' ? !cell.classList.contains('e-headercell') : true;\n };\n HeaderFocus.prototype.getHeaderType = function () {\n return 'HeaderFocus';\n };\n return HeaderFocus;\n}(ContentFocus));\nexport { HeaderFocus };\n/** @hidden */\nvar SearchBox = /** @class */ (function () {\n function SearchBox(searchBox, serviceLocator) {\n this.searchBox = searchBox;\n this.serviceLocator = serviceLocator;\n this.l10n = this.serviceLocator.getService('localization');\n }\n SearchBox.prototype.searchFocus = function (args) {\n args.target.parentElement.classList.add('e-input-focus');\n if (args.target.classList.contains('e-input') && args.target.classList.contains('e-search') && args.target.value) {\n var sIcon = args.target.parentElement.querySelector('.e-sicon');\n sIcon.classList.add('e-clear-icon');\n sIcon.setAttribute('title', this.l10n.getConstant('Clear'));\n (sIcon).style.cursor = 'pointer';\n }\n };\n SearchBox.prototype.searchBlur = function (args) {\n var relatedTarget = args.relatedTarget ? args.relatedTarget : null;\n if (relatedTarget && relatedTarget.classList.contains('e-sicon')) {\n if (relatedTarget.classList.contains('e-clear-icon')) {\n args.target.parentElement.classList.remove('e-input-focus');\n }\n }\n else {\n args.target.parentElement.classList.remove('e-input-focus');\n }\n if (args.target.classList.contains('e-search') && ((relatedTarget && !(relatedTarget.classList.contains('e-sicon e-clear-icon'))\n && !(relatedTarget.classList.contains('e-sicon'))) || isNullOrUndefined(relatedTarget))) {\n var sIcon = args.target.parentElement.querySelector('.e-sicon');\n sIcon.classList.remove('e-clear-icon');\n sIcon.removeAttribute('title');\n sIcon.style.cursor = 'default';\n }\n };\n SearchBox.prototype.wireEvent = function () {\n if (this.searchBox) {\n EventHandler.add(this.searchBox, 'focus', this.searchFocus, this);\n EventHandler.add(this.searchBox, 'blur', this.searchBlur, this);\n }\n };\n SearchBox.prototype.unWireEvent = function () {\n if (this.searchBox) {\n EventHandler.remove(this.searchBox, 'focus', this.searchFocus);\n EventHandler.remove(this.searchBox, 'blur', this.searchBlur);\n }\n };\n return SearchBox;\n}());\nexport { SearchBox };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Configures the paging behavior of the Grid.\n */\nvar PageSettings = /** @class */ (function (_super) {\n __extends(PageSettings, _super);\n function PageSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(12)\n ], PageSettings.prototype, \"pageSize\", void 0);\n __decorate([\n Property(8)\n ], PageSettings.prototype, \"pageCount\", void 0);\n __decorate([\n Property(1)\n ], PageSettings.prototype, \"currentPage\", void 0);\n __decorate([\n Property()\n ], PageSettings.prototype, \"totalRecordsCount\", void 0);\n __decorate([\n Property(false)\n ], PageSettings.prototype, \"enableQueryString\", void 0);\n __decorate([\n Property(false)\n ], PageSettings.prototype, \"pageSizes\", void 0);\n __decorate([\n Property(null)\n ], PageSettings.prototype, \"template\", void 0);\n return PageSettings;\n}(ChildProperty));\nexport { PageSettings };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { Property, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Configures the column chooser behavior of the Grid.\n */\nvar ColumnChooserSettings = /** @class */ (function (_super) {\n __extends(ColumnChooserSettings, _super);\n function ColumnChooserSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('startsWith')\n ], ColumnChooserSettings.prototype, \"operator\", void 0);\n __decorate([\n Property(false)\n ], ColumnChooserSettings.prototype, \"ignoreAccent\", void 0);\n return ColumnChooserSettings;\n}(ChildProperty));\nexport { ColumnChooserSettings };\n","import { Browser, EventHandler, createElement } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, isUndefined, addClass, removeClass } from '@syncfusion/ej2-base';\nimport { remove, closest, select } from '@syncfusion/ej2-base';\nimport { Query, DataManager } from '@syncfusion/ej2-data';\nimport { setCssInGridPopUp, getPosition, isGroupAdaptive, addRemoveActiveClasses, removeAddCboxClasses, getCellFromRow } from '../base/util';\nimport { getCellsByTableName, parentsUntil, getScrollBarWidth } from '../base/util';\nimport * as events from '../base/constant';\nimport { RenderType } from '../base/enum';\nimport { iterateExtend, setChecked, isComplexField, getObject } from '../base/util';\nimport { addRemoveEventListener } from '../base/util';\nimport * as literals from '../base/string-literals';\n/**\n * The `Selection` module is used to handle cell and row selection.\n */\nvar Selection = /** @class */ (function () {\n /**\n * Constructor for the Grid selection module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {SelectionSettings} selectionSettings - specifies the selectionsettings\n * @param {ServiceLocator} locator - specifies the ServiceLocator\n * @hidden\n */\n function Selection(parent, selectionSettings, locator) {\n //Internal letiables\n /**\n * @hidden\n */\n this.selectedRowIndexes = [];\n /**\n * @hidden\n */\n this.selectedRowCellIndexes = [];\n /**\n * @hidden\n */\n this.selectedRecords = [];\n /**\n * @hidden\n */\n this.preventFocus = false;\n /**\n * @hidden\n */\n this.selectedColumnsIndexes = [];\n this.checkBoxState = false;\n this.isMultiShiftRequest = false;\n this.isMultiCtrlRequest = false;\n this.isMultiCtrlRequestCell = false;\n this.enableSelectMultiTouch = false;\n this.clearRowCheck = false;\n this.selectRowCheck = false;\n this.selectedRowState = {};\n this.unSelectedRowState = {};\n this.totalRecordsCount = 0;\n this.chkAllCollec = [];\n this.isCheckedOnAdd = false;\n this.persistSelectedData = [];\n this.deSelectedData = [];\n this.isHdrSelectAllClicked = false;\n this.needColumnSelection = false;\n this.isCancelDeSelect = false;\n this.isPreventCellSelect = false;\n this.disableUI = false;\n this.isPersisted = false;\n this.cmdKeyPressed = false;\n this.cellselected = false;\n this.isMultiSelection = false;\n this.isAddRowsToSelection = false;\n this.initialRowSelection = false;\n this.isPrevRowSelection = false;\n this.isKeyAction = false;\n this.isRowDragSelected = false;\n this.isPartialSelection = false;\n this.rmtHdrChkbxClicked = false;\n this.isCheckboxReset = false;\n /**\n * @hidden\n */\n this.autoFillRLselection = true;\n this.bottom = '0 0 2px 0';\n this.top = '2px 0 0 0';\n /* eslint-disable */\n this.right_bottom = '0 2px 2px 0';\n this.bottom_left = '0 0 2px 2px';\n this.top_right = '2px 2px 0 0';\n this.top_left = '2px 0 0 2px';\n this.top_bottom = '2px 0 2px 0';\n this.top_right_bottom = '2px 2px 2px 0';\n this.top_bottom_left = '2px 0 2px 2px';\n this.top_right_left = '2px 2px 0 2px';\n this.right_bottom_left = '0 2px 2px 2px';\n this.all_border = '2px';\n this.parent = parent;\n this.selectionSettings = selectionSettings;\n this.factory = locator.getService('rendererFactory');\n this.focus = locator.getService('focus');\n this.addEventListener();\n this.wireEvents();\n }\n Selection.prototype.initializeSelection = function () {\n this.parent.log('selection_key_missing');\n this.render();\n };\n /**\n * The function used to trigger onActionBegin\n *\n * @param {Object} args - specifies the args\n * @param {string} type - specifies the type\n * @returns {void}\n * @hidden\n */\n Selection.prototype.onActionBegin = function (args, type) {\n this.parent.trigger(type, this.fDataUpdate(args));\n };\n Selection.prototype.fDataUpdate = function (args) {\n if (!this.isMultiSelection && (!isNullOrUndefined(args.cellIndex) || !isNullOrUndefined(args.rowIndex))) {\n var rowObj = this.getRowObj(isNullOrUndefined(args.rowIndex) ? isNullOrUndefined(args.cellIndex) ?\n this.currentIndex : args.cellIndex.rowIndex : args.rowIndex);\n args.foreignKeyData = rowObj.foreignKeyData;\n }\n return args;\n };\n /**\n * The function used to trigger onActionComplete\n *\n * @param {Object} args - specifies the args\n * @param {string} type - specifies the type\n * @returns {void}\n * @hidden\n */\n Selection.prototype.onActionComplete = function (args, type) {\n this.parent.trigger(type, this.fDataUpdate(args));\n this.isMultiSelection = false;\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n Selection.prototype.getModuleName = function () {\n return 'selection';\n };\n /**\n * To destroy the selection\n *\n * @returns {void}\n * @hidden\n */\n Selection.prototype.destroy = function () {\n var gridElement = this.parent.element;\n if (!gridElement || (!gridElement.querySelector('.' + literals.gridHeader) && !gridElement.querySelector('.' + literals.gridContent))) {\n return;\n }\n this.hidePopUp();\n this.clearSelection();\n this.destroyAutoFillElements();\n this.removeEventListener();\n this.unWireEvents();\n EventHandler.remove(this.parent.getContent(), 'mousedown', this.mouseDownHandler);\n EventHandler.remove(this.parent.getHeaderContent(), 'mousedown', this.mouseDownHandler);\n };\n Selection.prototype.isEditing = function () {\n return (this.parent.editSettings.mode === 'Normal' || (this.parent.editSettings.mode === 'Batch' && this.parent.editModule &&\n this.parent.editModule.formObj && !this.parent.editModule.formObj.validate())) &&\n (this.parent.isEdit && !this.parent.editSettings.showAddNewRow) && !this.parent.isPersistSelection;\n };\n Selection.prototype.getCurrentBatchRecordChanges = function () {\n var gObj = this.parent;\n if (gObj.editSettings.mode === 'Batch' && gObj.editModule) {\n var currentRecords = iterateExtend(this.parent.getCurrentViewRecords());\n currentRecords = gObj.editSettings.newRowPosition === 'Bottom' ?\n currentRecords.concat(this.parent.editModule.getBatchChanges()[literals.addedRecords]) :\n this.parent.editModule.getBatchChanges()[literals.addedRecords].concat(currentRecords);\n var deletedRecords = this.parent.editModule.getBatchChanges()[literals.deletedRecords];\n var primaryKey = this.parent.getPrimaryKeyFieldNames()[0];\n for (var i = 0; i < (deletedRecords.length); i++) {\n for (var j = 0; j < currentRecords.length; j++) {\n if (deletedRecords[parseInt(i.toString(), 10)][\"\" + primaryKey] === currentRecords[parseInt(j.toString(), 10)][\"\" + primaryKey]) {\n currentRecords.splice(j, 1);\n break;\n }\n }\n }\n return currentRecords;\n }\n else if (this.parent.enableVirtualization && this.parent.groupSettings.columns.length && !this.parent.isPersistSelection) {\n var selectedGroupedData = gObj.getCurrentViewRecords().filter(function (col) { return col['key'] === undefined; });\n return selectedGroupedData;\n }\n else {\n return gObj.getCurrentViewRecords();\n }\n };\n /**\n * Selects a row by the given index.\n *\n * @param {number} index - Defines the row index.\n * @param {boolean} isToggle - If set to true, then it toggles the selection.\n * @returns {void}\n */\n Selection.prototype.selectRow = function (index, isToggle) {\n if (this.selectedRowIndexes.length && this.selectionSettings.enableSimpleMultiRowSelection) {\n this.addRowsToSelection([index]);\n return;\n }\n var gObj = this.parent;\n var selectedRow = gObj.getRowByIndex(index);\n var rowObj = selectedRow && gObj.getRowObjectFromUID(selectedRow.getAttribute('data-uid'));\n if (this.isPartialSelection && rowObj && rowObj.isDataRow && !rowObj.isSelectable) {\n return;\n }\n var selectData;\n var isRemoved = false;\n if (gObj.enableVirtualization && index > -1) {\n var e = { selectedIndex: index, isAvailable: true };\n this.parent.notify(events.selectVirtualRow, e);\n if (selectedRow && (gObj.getRowObjectFromUID(selectedRow.getAttribute('data-uid')))) {\n selectData = gObj.getRowObjectFromUID(selectedRow.getAttribute('data-uid')).data;\n }\n else {\n if (e.isAvailable && !gObj.selectionSettings.persistSelection) {\n var prevSelectedData = this.parent.getSelectedRecords();\n if (prevSelectedData.length > 0) {\n this.clearRowSelection();\n }\n }\n return;\n }\n }\n else {\n selectData = this.getRowObj(index).data;\n }\n if (!this.isRowType() || !selectedRow || this.isEditing()) {\n // if (this.isEditing()) {\n // gObj.selectedRowIndex = index;\n // }\n return;\n }\n var isRowSelected = selectedRow.hasAttribute('aria-selected');\n this.activeTarget();\n isToggle = !isToggle ? isToggle :\n !this.selectedRowIndexes.length ? false :\n (this.selectedRowIndexes.length ? (this.isKeyAction && this.parent.isCheckBoxSelection ?\n false : index === this.selectedRowIndexes[this.selectedRowIndexes.length - 1]) : false);\n this.isKeyAction = false;\n var args;\n var can = 'cancel';\n if (!isToggle) {\n args = {\n data: selectData, rowIndex: index, isCtrlPressed: this.isMultiCtrlRequest,\n isShiftPressed: this.isMultiShiftRequest, row: selectedRow,\n previousRow: gObj.getRowByIndex(this.prevRowIndex),\n previousRowIndex: this.prevRowIndex, target: this.actualTarget, cancel: false, isInteracted: this.isInteracted,\n isHeaderCheckboxClicked: this.isHeaderCheckboxClicked\n };\n this.parent.trigger(events.rowSelecting, this.fDataUpdate(args), this.rowSelectingCallBack(args, isToggle, index, selectData, isRemoved, isRowSelected, can));\n }\n else {\n this.rowDeselect(events.rowDeselecting, [rowObj.index], [rowObj.data], [selectedRow], [rowObj.foreignKeyData], this.actualTarget);\n if (this.isCancelDeSelect) {\n return;\n }\n this.rowDeselect(events.rowDeselected, [rowObj.index], [rowObj.data], [selectedRow], [rowObj.foreignKeyData], this.actualTarget, undefined, undefined, undefined);\n this.rowSelectingCallBack(args, isToggle, index, selectData, isRemoved, isRowSelected, can)(args);\n }\n };\n Selection.prototype.rowSelectingCallBack = function (args, isToggle, index, selectData, isRemoved, isRowSelected, can) {\n var _this = this;\n return function (args) {\n if (!isNullOrUndefined(args) && args[\"\" + can] === true) {\n _this.disableInteracted();\n return;\n }\n _this.index = index;\n _this.toggle = isToggle;\n _this.data = selectData;\n _this.removed = isRemoved;\n if (isRowSelected && _this.selectionSettings.persistSelection && !(_this.selectionSettings.checkboxMode === 'ResetOnRowClick')) {\n _this.clearSelectedRow(index);\n _this.selectRowCallBack();\n }\n else if (!isRowSelected && _this.selectionSettings.persistSelection &&\n _this.selectionSettings.checkboxMode !== 'ResetOnRowClick') {\n _this.selectRowCallBack();\n }\n if (_this.selectionSettings.checkboxMode === 'ResetOnRowClick') {\n _this.isCheckboxReset = true;\n _this.clearSelection();\n }\n if (!_this.selectionSettings.persistSelection || _this.selectionSettings.checkboxMode === 'ResetOnRowClick' ||\n (!_this.parent.isCheckBoxSelection && _this.selectionSettings.persistSelection)) {\n _this.selectRowCheck = true;\n _this.clearRow();\n }\n };\n };\n Selection.prototype.selectRowCallBack = function () {\n var gObj = this.parent;\n var args;\n var index = this.index;\n var isToggle = this.toggle;\n var selectData = this.data;\n var isRemoved = this.removed;\n var selectedRow = gObj.getRowByIndex(index);\n if (!isToggle && !isRemoved) {\n if (this.selectedRowIndexes.indexOf(index) <= -1) {\n this.updateRowSelection(selectedRow, index);\n }\n this.selectRowIndex(index);\n }\n if (!isToggle) {\n args = {\n data: selectData, rowIndex: index,\n row: selectedRow, previousRow: gObj.getRowByIndex(this.prevRowIndex),\n previousRowIndex: this.prevRowIndex, target: this.actualTarget, isInteracted: this.isInteracted,\n isHeaderCheckBoxClicked: this.isHeaderCheckboxClicked, rowIndexes: index\n };\n this.onActionComplete(args, events.rowSelected);\n }\n this.isInteracted = false;\n this.updateRowProps(index);\n };\n /**\n * Selects a range of rows from start and end row indexes.\n *\n * @param {number} startIndex - Specifies the start row index.\n * @param {number} endIndex - Specifies the end row index.\n * @returns {void}\n */\n Selection.prototype.selectRowsByRange = function (startIndex, endIndex) {\n this.selectRows(this.getCollectionFromIndexes(startIndex, endIndex));\n this.selectRowIndex(endIndex);\n };\n Selection.prototype.selectedDataUpdate = function (selectedData, foreignKeyData, selectedRows, rowIndexes, selectableRowIndex) {\n for (var i = 0, len = rowIndexes.length; i < len; i++) {\n var currentRow = this.parent.getDataRows()[rowIndexes[parseInt(i.toString(), 10)]];\n if (this.parent.enableVirtualization) {\n currentRow = this.parent.getRowByIndex(rowIndexes[parseInt(i.toString(), 10)]);\n }\n var rowObj = this.getRowObj(currentRow);\n if (rowObj && rowObj.isDataRow && rowObj.isSelectable) {\n selectedData.push(rowObj.data);\n selectedRows.push(currentRow);\n foreignKeyData.push(rowObj.foreignKeyData);\n }\n else {\n if (this.isPartialSelection && selectableRowIndex) {\n selectableRowIndex.splice(selectableRowIndex.indexOf(rowIndexes[parseInt(i.toString(), 10)]), 1);\n }\n }\n }\n };\n /**\n * Selects a collection of rows by index.\n *\n * @param {number[]} rowIndexes - Specifies an array of row indexes.\n * @returns {void}\n */\n Selection.prototype.selectRows = function (rowIndexes) {\n var _this = this;\n var gObj = this.parent;\n var selectableRowIndex = rowIndexes.slice();\n var rowIndex = !this.isSingleSel() ? rowIndexes[0] : rowIndexes[rowIndexes.length - 1];\n this.isMultiSelection = true;\n var selectedRows = [];\n var foreignKeyData = [];\n var can = 'cancel';\n var selectedData = [];\n if (!this.isRowType() || this.isEditing()) {\n return;\n }\n this.selectedDataUpdate(selectedData, foreignKeyData, selectedRows, rowIndexes, selectableRowIndex);\n this.activeTarget();\n var args = {\n cancel: false,\n rowIndexes: selectableRowIndex, row: selectedRows, rowIndex: rowIndex, target: this.actualTarget,\n prevRow: gObj.getRows()[this.prevRowIndex], previousRowIndex: this.prevRowIndex,\n isInteracted: this.isInteracted, isCtrlPressed: this.isMultiCtrlRequest, isShiftPressed: this.isMultiShiftRequest,\n data: selectedData, isHeaderCheckboxClicked: this.isHeaderCheckboxClicked, foreignKeyData: foreignKeyData\n };\n this.parent.trigger(events.rowSelecting, this.fDataUpdate(args), function (args) {\n if (!isNullOrUndefined(args) && args[\"\" + can] === true) {\n _this.disableInteracted();\n return;\n }\n if (!(gObj.allowRowDragAndDrop && _this.isDragged && _this.selectionSettings.persistSelection)) {\n _this.clearRow();\n }\n _this.selectRowIndex(selectableRowIndex.slice(-1)[0]);\n var selectRowFn = function (index, preventFocus) {\n _this.updateRowSelection(gObj.getRowByIndex(index), index, preventFocus);\n _this.updateRowProps(rowIndex);\n };\n if (!_this.isSingleSel()) {\n for (var _i = 0, selectableRowIndex_1 = selectableRowIndex; _i < selectableRowIndex_1.length; _i++) {\n var rowIdx = selectableRowIndex_1[_i];\n selectRowFn(rowIdx, gObj.enableVirtualization ? true : false);\n }\n }\n else {\n selectRowFn(rowIndex);\n }\n args = {\n rowIndexes: selectableRowIndex, row: selectedRows, rowIndex: rowIndex, target: _this.actualTarget,\n prevRow: gObj.getRows()[_this.prevRowIndex], previousRowIndex: _this.prevRowIndex,\n data: _this.getSelectedRecords(), isInteracted: _this.isInteracted,\n isHeaderCheckboxClicked: _this.isHeaderCheckboxClicked, foreignKeyData: foreignKeyData\n };\n if (_this.isRowSelected) {\n _this.onActionComplete(args, events.rowSelected);\n }\n _this.isInteracted = false;\n });\n };\n /**\n * Select rows with existing row selection by passing row indexes.\n *\n * @param {number} rowIndexes - Specifies the row indexes.\n * @returns {void}\n * @hidden\n */\n Selection.prototype.addRowsToSelection = function (rowIndexes) {\n var gObj = this.parent;\n var can = 'cancel';\n var target = this.target;\n this.isMultiSelection = true;\n var selectedRows = [];\n var foreignKeyData = [];\n var selectedData = [];\n var indexes = gObj.getSelectedRowIndexes().concat(rowIndexes);\n var selectedRow = !this.isSingleSel() ? gObj.getRowByIndex(rowIndexes[0]) :\n gObj.getRowByIndex(rowIndexes[rowIndexes.length - 1]);\n if ((!this.isRowType() || this.isEditing()) && !this.selectionSettings.checkboxOnly) {\n return;\n }\n var args;\n var checkboxColumn = this.parent.getColumns().filter(function (col) { return col.type === 'checkbox'; });\n if (this.isMultiCtrlRequest && !checkboxColumn.length) {\n this.selectedDataUpdate(selectedData, foreignKeyData, selectedRows, indexes);\n }\n for (var _i = 0, rowIndexes_1 = rowIndexes; _i < rowIndexes_1.length; _i++) {\n var rowIndex = rowIndexes_1[_i];\n var rowObj = this.getRowObj(rowIndex);\n var isUnSelected = this.selectedRowIndexes.indexOf(rowIndex) > -1;\n if (this.isPartialSelection && rowObj && rowObj.isDataRow && !rowObj.isSelectable) {\n continue;\n }\n this.selectRowIndex(rowIndex);\n if (isUnSelected && ((checkboxColumn.length ? true : this.selectionSettings.enableToggle) || this.isMultiCtrlRequest)) {\n this.isAddRowsToSelection = true;\n this.rowDeselect(events.rowDeselecting, [rowIndex], [rowObj.data], [selectedRow], [rowObj.foreignKeyData], target);\n if (this.isCancelDeSelect) {\n return;\n }\n this.selectedRowIndexes.splice(this.selectedRowIndexes.indexOf(rowIndex), 1);\n this.selectedRecords.splice(this.selectedRecords.indexOf(selectedRow), 1);\n this.selectRowIndex(this.selectedRowIndexes.length ? this.selectedRowIndexes[this.selectedRowIndexes.length - 1] : -1);\n selectedRow.removeAttribute('aria-selected');\n this.addRemoveClassesForRow(selectedRow, false, null, 'e-selectionbackground', 'e-active');\n this.rowDeselect(events.rowDeselected, [rowIndex], [rowObj.data], [selectedRow], [rowObj.foreignKeyData], target, undefined, undefined, undefined);\n this.isInteracted = false;\n this.isMultiSelection = false;\n this.isAddRowsToSelection = false;\n this.isHdrSelectAllClicked = false;\n }\n else {\n this.activeTarget();\n args = {\n cancel: false,\n data: selectedData.length ? selectedData : rowObj.data, rowIndex: rowIndex, row: selectedRows.length ? selectedRows :\n selectedRow, target: this.actualTarget, prevRow: gObj.getRows()[this.prevRowIndex],\n previousRowIndex: this.prevRowIndex, isCtrlPressed: this.isMultiCtrlRequest, isShiftPressed: this.isMultiShiftRequest,\n foreignKeyData: foreignKeyData.length ? foreignKeyData : rowObj.foreignKeyData, isInteracted: this.isInteracted,\n isHeaderCheckboxClicked: this.isHeaderCheckboxClicked, rowIndexes: indexes\n };\n this.parent.trigger(events.rowSelecting, this.fDataUpdate(args));\n if (!isNullOrUndefined(args) && args[\"\" + can] === true) {\n this.disableInteracted();\n return;\n }\n if (this.isSingleSel()) {\n this.clearRow();\n }\n this.updateRowSelection(selectedRow, rowIndex);\n }\n if (!isUnSelected) {\n args = {\n data: selectedData.length ? selectedData : rowObj.data, rowIndex: rowIndex, row: selectedRows.length ? selectedRows :\n selectedRow, target: this.actualTarget, prevRow: gObj.getRows()[this.prevRowIndex],\n previousRowIndex: this.prevRowIndex, foreignKeyData: foreignKeyData.length ? foreignKeyData : rowObj.foreignKeyData,\n isInteracted: this.isInteracted, isHeaderCheckboxClicked: this.isHeaderCheckboxClicked, rowIndexes: indexes\n };\n this.onActionComplete(args, events.rowSelected);\n }\n this.isInteracted = false;\n this.updateRowProps(rowIndex);\n if (this.isSingleSel()) {\n break;\n }\n }\n };\n Selection.prototype.getCollectionFromIndexes = function (startIndex, endIndex) {\n var indexes = [];\n // eslint-disable-next-line prefer-const\n var _a = (startIndex <= endIndex) ?\n { i: startIndex, max: endIndex } : { i: endIndex, max: startIndex }, i = _a.i, max = _a.max;\n for (; i <= max; i++) {\n indexes.push(i);\n }\n if (startIndex > endIndex) {\n indexes.reverse();\n }\n return indexes;\n };\n Selection.prototype.clearRow = function () {\n this.clearRowCheck = true;\n this.clearRowSelection();\n };\n Selection.prototype.clearRowCallBack = function () {\n if (this.isCancelDeSelect && this.parent.checkAllRows !== 'Check') {\n return;\n }\n this.selectedRowIndexes = [];\n this.selectedRecords = [];\n this.selectRowIndex(-1);\n if (this.isSingleSel() && this.parent.isPersistSelection) {\n this.selectedRowState = {};\n }\n };\n Selection.prototype.clearSelectedRow = function (index) {\n if (this.toggle) {\n var selectedEle = this.parent.getRowByIndex(index);\n if (!this.disableUI) {\n selectedEle.removeAttribute('aria-selected');\n this.addRemoveClassesForRow(selectedEle, false, true, 'e-selectionbackground', 'e-active');\n }\n this.removed = true;\n this.updatePersistCollection(selectedEle, false);\n this.updateCheckBoxes(selectedEle);\n this.selectedRowIndexes.splice(this.selectedRowIndexes.indexOf(index), 1);\n this.selectedRecords.splice(this.selectedRecords.indexOf(this.parent.getRowByIndex(index)), 1);\n }\n };\n Selection.prototype.updateRowProps = function (startIndex) {\n this.prevRowIndex = startIndex;\n this.isRowSelected = this.selectedRowIndexes.length && true;\n };\n Selection.prototype.getPkValue = function (pkField, data) {\n return pkField ? isComplexField(pkField) ? getObject(pkField, data) : data[\"\" + pkField] : data[\"\" + pkField];\n };\n Selection.prototype.updatePersistCollection = function (selectedRow, chkState) {\n var _this = this;\n if ((this.parent.isPersistSelection || this.parent.selectionSettings.persistSelection &&\n this.parent.getPrimaryKeyFieldNames().length > 0) && !isNullOrUndefined(selectedRow)) {\n if (!this.parent.isPersistSelection) {\n this.ensureCheckboxFieldSelection();\n }\n var rowObj = this.getRowObj(selectedRow);\n var pKey_1 = rowObj.data ? this.getPkValue(this.primaryKey, rowObj.data) : null;\n if (pKey_1 === null) {\n return;\n }\n rowObj.isSelected = chkState;\n if ((chkState && !this.isPartialSelection) || (this.isPartialSelection && rowObj.isSelectable && rowObj.isSelected)) {\n this.selectedRowState[\"\" + pKey_1] = chkState;\n delete (this.unSelectedRowState[\"\" + pKey_1]);\n if (!this.persistSelectedData.some(function (data) { return _this.getPkValue(_this.primaryKey, data) === pKey_1; })) {\n this.persistSelectedData.push(rowObj.data);\n }\n }\n else {\n this.updatePersistDelete(pKey_1);\n }\n }\n };\n Selection.prototype.updatePersistDelete = function (pKey, isPartialSelection) {\n var _this = this;\n delete (this.selectedRowState[\"\" + pKey]);\n if (this.rmtHdrChkbxClicked) {\n this.unSelectedRowState[\"\" + pKey] = true;\n }\n var index;\n var isPresent = this.persistSelectedData.some(function (data, i) {\n index = i;\n return _this.getPkValue(_this.primaryKey, data) === pKey;\n });\n if (isPresent) {\n this.persistSelectedData.splice(index, 1);\n if (isPartialSelection) {\n this.parent.partialSelectedRecords.splice(index, 1);\n }\n }\n };\n Selection.prototype.updateCheckBoxes = function (row, chkState, rowIndex) {\n if (!isNullOrUndefined(row)) {\n var chkBox = row.querySelector('.e-checkselect');\n if (!isNullOrUndefined(chkBox)) {\n removeAddCboxClasses(chkBox.nextElementSibling, chkState);\n setChecked(chkBox, chkState);\n if (isNullOrUndefined(this.checkedTarget) || (!isNullOrUndefined(this.checkedTarget)\n && !this.checkedTarget.classList.contains('e-checkselectall'))) {\n this.setCheckAllState(rowIndex);\n }\n }\n }\n };\n Selection.prototype.updateRowSelection = function (selectedRow, startIndex, preventFocus) {\n if (!selectedRow) {\n return;\n }\n if (this.selectedRowIndexes.indexOf(startIndex) === -1) {\n this.selectedRowIndexes.push(startIndex);\n this.selectedRecords.push(selectedRow);\n }\n selectedRow.setAttribute('aria-selected', 'true');\n this.updatePersistCollection(selectedRow, true);\n this.updateCheckBoxes(selectedRow, true);\n this.addRemoveClassesForRow(selectedRow, true, null, 'e-selectionbackground', 'e-active');\n if (!this.preventFocus) {\n var target = this.focus.getPrevIndexes().cellIndex ?\n selectedRow.cells[this.focus.getPrevIndexes().cellIndex] :\n selectedRow.querySelector('.e-selectionbackground:not(.e-hide):not(.e-detailrowcollapse):not(.e-detailrowexpand)');\n if (this.parent.contextMenuModule && this.mouseButton === 2) {\n target = this.parent.contextMenuModule.cell;\n }\n if (!target || preventFocus) {\n return;\n }\n this.focus.onClick({ target: target }, true);\n }\n };\n /**\n * Deselects the currently selected rows and cells.\n *\n * @returns {void}\n */\n Selection.prototype.clearSelection = function () {\n this.checkSelectAllClicked = true;\n if (this.selectionSettings.persistSelection && this.persistSelectedData.length) {\n this.deSelectedData = iterateExtend(this.persistSelectedData);\n }\n if (!this.parent.isPersistSelection || (this.parent.isPersistSelection && !this.parent.isEdit) ||\n (!isNullOrUndefined(this.checkedTarget) && this.checkedTarget.classList.contains('e-checkselectall'))) {\n var span = this.parent.element.querySelector('.e-gridpopup').querySelector('span');\n if (span.classList.contains('e-rowselect')) {\n span.classList.remove('e-spanclicked');\n }\n if (this.parent.isPersistSelection) {\n this.persistSelectedData = [];\n this.selectedRowState = {};\n }\n this.clearRowSelection();\n this.clearCellSelection();\n this.clearColumnSelection();\n this.prevRowIndex = undefined;\n this.prevCIdxs = undefined;\n this.prevECIdxs = undefined;\n this.enableSelectMultiTouch = false;\n this.isInteracted = false;\n this.checkSelectAllClicked = false;\n this.isHdrSelectAllClicked = false;\n }\n };\n /**\n * Deselects the currently selected rows.\n *\n * @returns {void}\n */\n Selection.prototype.clearRowSelection = function () {\n var _this = this;\n if (this.isRowSelected) {\n var rows_1 = this.parent.getDataRows();\n var data_1 = [];\n var row_1 = [];\n var rowIndex_1 = [];\n var foreignKeyData_1 = [];\n var target_1 = this.target;\n for (var i = 0, len = this.selectedRowIndexes.length; i < len; i++) {\n var currentRow = this.parent.editSettings.mode === 'Batch' ?\n this.parent.getRows()[this.selectedRowIndexes[parseInt(i.toString(), 10)]]\n : this.parent.getDataRows()[this.selectedRowIndexes[parseInt(i.toString(), 10)]];\n var rowObj = this.getRowObj(currentRow);\n if (rowObj) {\n data_1.push(rowObj.data);\n row_1.push(currentRow);\n rowIndex_1.push(this.selectedRowIndexes[parseInt(i.toString(), 10)]);\n foreignKeyData_1.push(rowObj.foreignKeyData);\n }\n }\n if (this.selectionSettings.persistSelection && this.selectionSettings.checkboxMode !== 'ResetOnRowClick') {\n this.isRowClicked = this.checkSelectAllClicked ? true : false;\n }\n this.rowDeselect(events.rowDeselecting, rowIndex_1, data_1, row_1, foreignKeyData_1, target_1, null, function () {\n if (_this.isCancelDeSelect && (_this.isRowClicked || _this.checkSelectAllClicked || (_this.isInteracted &&\n !_this.parent.isPersistSelection))) {\n if (_this.parent.isPersistSelection) {\n if (_this.getCheckAllStatus(_this.parent.element.querySelector('.e-checkselectall')) === 'Intermediate') {\n for (var i = 0; i < _this.selectedRecords.length; i++) {\n _this.updatePersistCollection(_this.selectedRecords[parseInt(i.toString(), 10)], true);\n }\n }\n else {\n _this.parent.checkAllRows = 'Check';\n _this.updatePersistSelectedData(true);\n }\n }\n if (_this.clearRowCheck) {\n _this.clearRowCallBack();\n _this.clearRowCheck = false;\n if (_this.selectRowCheck) {\n _this.selectRowCallBack();\n _this.selectRowCheck = false;\n }\n }\n return;\n }\n var element = [].slice.call(rows_1.filter(function (record) { return record.hasAttribute('aria-selected'); }));\n for (var j = 0; j < element.length; j++) {\n if (!_this.disableUI) {\n element[parseInt(j.toString(), 10)].removeAttribute('aria-selected');\n _this.addRemoveClassesForRow(element[parseInt(j.toString(), 10)], false, true, 'e-selectionbackground', 'e-active');\n }\n // tslint:disable-next-line:align\n if (!_this.isPrevRowSelection) {\n _this.updatePersistCollection(element[parseInt(j.toString(), 10)], false);\n }\n _this.updateCheckBoxes(element[parseInt(j.toString(), 10)]);\n }\n _this.selectedRowIndexes = [];\n _this.selectedRecords = [];\n _this.isRowSelected = false;\n _this.selectRowIndex(-1);\n _this.isPrevRowSelection = false;\n _this.rowDeselect(events.rowDeselected, rowIndex_1, data_1, row_1, foreignKeyData_1, target_1, null, undefined, null);\n if (_this.clearRowCheck) {\n _this.clearRowCallBack();\n _this.clearRowCheck = false;\n if (_this.selectRowCheck) {\n _this.selectRowCallBack();\n _this.selectRowCheck = false;\n }\n }\n }, null);\n }\n else {\n if (this.clearRowCheck) {\n this.clearRowCallBack();\n this.clearRowCheck = false;\n if (this.selectRowCheck) {\n this.selectRowCallBack();\n this.selectRowCheck = false;\n }\n }\n }\n };\n Selection.prototype.rowDeselect = function (type, rowIndex, data, row, \n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n foreignKeyData, target, mRow, rowDeselectCallBack, frozenRightRow) {\n var _this = this;\n if ((this.selectionSettings.persistSelection && (this.isRowClicked || this.deSelectedData.length || this.checkSelectAllClicked || (this.focus['activeKey'] &&\n this.focus.currentInfo.element.classList.contains('e-gridchkbox') && this.focus['activeKey'] === 'space'))) ||\n !this.selectionSettings.persistSelection) {\n var cancl_1 = 'cancel';\n var isSingleDeSel = rowIndex.length === 1 && this.deSelectedData.length === 1;\n var rowDeselectObj = {\n rowIndex: rowIndex[0], data: this.selectionSettings.persistSelection && (this.parent.checkAllRows === 'Uncheck' &&\n !isSingleDeSel) && this.selectionSettings.checkboxMode !== 'ResetOnRowClick' ? this.deSelectedData : data,\n foreignKeyData: foreignKeyData, cancel: false, isInteracted: this.isInteracted,\n isHeaderCheckboxClicked: this.isHeaderCheckboxClicked\n };\n if (type === 'rowDeselected') {\n delete rowDeselectObj.cancel;\n }\n var rowInString = 'row';\n var target_2 = 'target';\n var rowidx = 'rowIndex';\n var rowidxex = 'rowIndexes';\n var dataTxt = 'data';\n var foreignKey = 'foreignKeyData';\n rowDeselectObj[\"\" + rowInString] = row;\n rowDeselectObj[\"\" + target_2] = this.actualTarget;\n var isHeaderCheckBxClick = this.actualTarget && !isNullOrUndefined(closest(this.actualTarget, 'thead'));\n if (isHeaderCheckBxClick || rowIndex.length > 1) {\n rowDeselectObj[\"\" + rowidx] = rowIndex[0];\n rowDeselectObj[\"\" + rowidxex] = rowIndex;\n }\n else if (rowIndex.length === 1) {\n rowDeselectObj[\"\" + dataTxt] = rowDeselectObj[\"\" + dataTxt][0];\n rowDeselectObj[\"\" + rowInString] = rowDeselectObj[\"\" + rowInString][0];\n rowDeselectObj[\"\" + foreignKey] = rowDeselectObj[\"\" + foreignKey][0];\n if (this.isAddRowsToSelection) {\n rowDeselectObj[\"\" + rowidxex] = rowIndex;\n }\n }\n this.parent.trigger(type, rowDeselectObj, function (args) {\n _this.isCancelDeSelect = args[\"\" + cancl_1];\n if (!_this.isCancelDeSelect || (!_this.isRowClicked && !_this.isInteracted && _this.deSelectedData.length < 0 && !_this.checkSelectAllClicked)) {\n _this.updatePersistCollection(row[0], false);\n _this.updateCheckBoxes(row[0], undefined, rowIndex[0]);\n }\n if (rowDeselectCallBack !== undefined) {\n rowDeselectCallBack();\n }\n });\n }\n else if (this.selectionSettings.persistSelection && !this.isInteracted) {\n if (rowDeselectCallBack !== undefined) {\n rowDeselectCallBack();\n }\n }\n };\n Selection.prototype.getRowObj = function (row) {\n if (row === void 0) { row = this.currentIndex; }\n if (isNullOrUndefined(row)) {\n return {};\n }\n if (typeof row === 'number') {\n row = this.parent.getRowByIndex(row);\n }\n if (row) {\n return this.parent.getRowObjectFromUID(row.getAttribute('data-uid')) || {};\n }\n return {};\n };\n /**\n * Selects a cell by the given index.\n *\n * @param {IIndex} cellIndex - Defines the row and column indexes.\n * @param {boolean} isToggle - If set to true, then it toggles the selection.\n * @returns {void}\n */\n Selection.prototype.selectCell = function (cellIndex, isToggle) {\n if (!this.isCellType()) {\n return;\n }\n var gObj = this.parent;\n var args;\n var selectedCell = gObj.getCellFromIndex(cellIndex.rowIndex, this.getColIndex(cellIndex.rowIndex, cellIndex.cellIndex));\n this.currentIndex = cellIndex.rowIndex;\n var selectedData = this.getCurrentBatchRecordChanges()[this.currentIndex];\n if (!this.isCellType() || !selectedCell || this.isEditing()) {\n return;\n }\n var isCellSelected = selectedCell.classList.contains('e-cellselectionbackground');\n isToggle = !isToggle ? isToggle : (!isUndefined(this.prevCIdxs) &&\n cellIndex.rowIndex === this.prevCIdxs.rowIndex && cellIndex.cellIndex === this.prevCIdxs.cellIndex &&\n isCellSelected);\n if (!isToggle) {\n args = {\n data: selectedData, cellIndex: cellIndex,\n isCtrlPressed: this.isMultiCtrlRequest, isShiftPressed: this.isMultiShiftRequest,\n previousRowCell: this.prevECIdxs ?\n this.getCellIndex(this.prevECIdxs.rowIndex, this.prevECIdxs.cellIndex) : undefined,\n cancel: false\n };\n var currentCell = 'currentCell';\n args[\"\" + currentCell] = selectedCell;\n var previousRowCellIndex = 'previousRowCellIndex';\n args[\"\" + previousRowCellIndex] = this.prevECIdxs;\n this.parent.trigger(events.cellSelecting, this.fDataUpdate(args), this.successCallBack(args, isToggle, cellIndex, selectedCell, selectedData));\n this.cellselected = true;\n }\n else {\n this.successCallBack(args, isToggle, cellIndex, selectedCell, selectedData)(args);\n }\n };\n Selection.prototype.successCallBack = function (cellSelectingArgs, isToggle, cellIndex, selectedCell, selectedData) {\n var _this = this;\n return function (cellSelectingArgs) {\n var cncl = 'cancel';\n var currentCell = 'currentCell';\n if (!isNullOrUndefined(cellSelectingArgs) && cellSelectingArgs[\"\" + cncl] === true) {\n return;\n }\n if (!isToggle) {\n cellSelectingArgs[\"\" + currentCell] = cellSelectingArgs[\"\" + currentCell] ? cellSelectingArgs[\"\" + currentCell] : selectedCell;\n }\n _this.clearCell();\n if (!isToggle) {\n _this.updateCellSelection(selectedCell, cellIndex.rowIndex, cellIndex.cellIndex);\n }\n if (!isToggle) {\n var args = {\n data: selectedData, cellIndex: cellIndex, currentCell: selectedCell,\n selectedRowCellIndex: _this.selectedRowCellIndexes,\n previousRowCell: _this.prevECIdxs ?\n _this.getCellIndex(_this.prevECIdxs.rowIndex, _this.prevECIdxs.cellIndex) : undefined\n };\n var previousRowCellIndex = 'previousRowCellIndex';\n args[\"\" + previousRowCellIndex] = _this.prevECIdxs;\n _this.updateCellProps(cellIndex, cellIndex);\n _this.onActionComplete(args, events.cellSelected);\n }\n };\n };\n Selection.prototype.getCellIndex = function (rIdx, cIdx) {\n return this.parent.getCellFromIndex(rIdx, cIdx);\n };\n /**\n * Selects a range of cells from start and end indexes.\n *\n * @param {IIndex} startIndex - Specifies the row and column's start index.\n * @param {IIndex} endIndex - Specifies the row and column's end index.\n * @returns {void}\n */\n Selection.prototype.selectCellsByRange = function (startIndex, endIndex) {\n var _this = this;\n if (!this.isCellType()) {\n return;\n }\n var gObj = this.parent;\n var selectedCell = this.parent.isSpan ? getCellFromRow(this.parent, startIndex.rowIndex, startIndex.cellIndex) :\n gObj.getCellFromIndex(startIndex.rowIndex, startIndex.cellIndex);\n var min;\n var max;\n var stIndex = startIndex;\n var edIndex = endIndex = endIndex ? endIndex : startIndex;\n var cellIndexes;\n this.currentIndex = startIndex.rowIndex;\n var cncl = 'cancel';\n var selectedData = this.getCurrentBatchRecordChanges()[this.currentIndex];\n if (this.isSingleSel() || !this.isCellType() || this.isEditing()) {\n return;\n }\n var args = {\n data: selectedData, cellIndex: startIndex, currentCell: selectedCell,\n isCtrlPressed: this.isMultiCtrlRequest, isShiftPressed: this.isMultiShiftRequest,\n previousRowCell: this.prevECIdxs ? this.getCellIndex(this.prevECIdxs.rowIndex, this.prevECIdxs.cellIndex) : undefined\n };\n var previousRowCellIndex = 'previousRowCellIndex';\n args[\"\" + previousRowCellIndex] = this.prevECIdxs;\n this.parent.trigger(events.cellSelecting, this.fDataUpdate(args), function (cellSelectingArgs) {\n if (!isNullOrUndefined(cellSelectingArgs) && cellSelectingArgs[\"\" + cncl] === true) {\n return;\n }\n _this.clearCell();\n if (startIndex.rowIndex > endIndex.rowIndex) {\n var temp = startIndex;\n startIndex = endIndex;\n endIndex = temp;\n }\n for (var i = startIndex.rowIndex; i <= endIndex.rowIndex; i++) {\n if (_this.selectionSettings.cellSelectionMode.indexOf('Box') < 0) {\n min = i === startIndex.rowIndex ? (startIndex.cellIndex) : 0;\n max = i === endIndex.rowIndex ? (endIndex.cellIndex) : _this.getLastColIndex(i);\n }\n else {\n min = startIndex.cellIndex;\n max = endIndex.cellIndex;\n }\n cellIndexes = [];\n for (var j = min < max ? min : max, len = min > max ? min : max; j <= len; j++) {\n selectedCell = _this.parent.isSpan ? getCellFromRow(gObj, i, j) : gObj.getCellFromIndex(i, j);\n if (!selectedCell) {\n continue;\n }\n cellIndexes.push(j);\n _this.updateCellSelection(selectedCell);\n _this.addAttribute(selectedCell);\n }\n _this.selectedRowCellIndexes.push({ rowIndex: i, cellIndexes: cellIndexes });\n }\n var cellSelectedArgs = {\n data: selectedData, cellIndex: edIndex, currentCell: gObj.getCellFromIndex(edIndex.rowIndex, edIndex.cellIndex),\n selectedRowCellIndex: _this.selectedRowCellIndexes,\n previousRowCell: _this.prevECIdxs ? _this.getCellIndex(_this.prevECIdxs.rowIndex, _this.prevECIdxs.cellIndex) : undefined\n };\n var previousRowCellIndex = 'previousRowCellIndex';\n cellSelectedArgs[\"\" + previousRowCellIndex] = _this.prevECIdxs;\n if (!_this.isDragged) {\n _this.onActionComplete(cellSelectedArgs, events.cellSelected);\n _this.cellselected = true;\n }\n _this.updateCellProps(stIndex, edIndex);\n });\n };\n /**\n * Selects a collection of cells by row and column indexes.\n *\n * @param {ISelectedCell[]} rowCellIndexes - Specifies the row and column indexes.\n * @returns {void}\n */\n Selection.prototype.selectCells = function (rowCellIndexes) {\n if (!this.isCellType()) {\n return;\n }\n var gObj = this.parent;\n var selectedCell = gObj.getCellFromIndex(rowCellIndexes[0].rowIndex, rowCellIndexes[0].cellIndexes[0]);\n this.currentIndex = rowCellIndexes[0].rowIndex;\n var selectedData = this.getCurrentBatchRecordChanges()[this.currentIndex];\n if (this.isSingleSel() || !this.isCellType() || this.isEditing()) {\n return;\n }\n var cellSelectArgs = {\n data: selectedData, cellIndex: rowCellIndexes[0].cellIndexes[0],\n currentCell: selectedCell, isCtrlPressed: this.isMultiCtrlRequest,\n isShiftPressed: this.isMultiShiftRequest,\n previousRowCell: this.prevECIdxs ? this.getCellIndex(this.prevECIdxs.rowIndex, this.prevECIdxs.cellIndex) : undefined\n };\n var previousRowCellIndex = 'previousRowCellIndex';\n cellSelectArgs[\"\" + previousRowCellIndex] = this.prevECIdxs;\n this.onActionBegin(cellSelectArgs, events.cellSelecting);\n for (var i = 0, len = rowCellIndexes.length; i < len; i++) {\n for (var j = 0, cellLen = rowCellIndexes[parseInt(i.toString(), 10)].cellIndexes.length; j < cellLen; j++) {\n selectedCell = gObj.getCellFromIndex(rowCellIndexes[parseInt(i.toString(), 10)].rowIndex, rowCellIndexes[parseInt(i.toString(), 10)].cellIndexes[parseInt(j.toString(), 10)]);\n if (!selectedCell) {\n continue;\n }\n this.updateCellSelection(selectedCell);\n this.addAttribute(selectedCell);\n this.addRowCellIndex({ rowIndex: rowCellIndexes[parseInt(i.toString(), 10)].rowIndex,\n cellIndex: rowCellIndexes[parseInt(i.toString(), 10)].cellIndexes[parseInt(j.toString(), 10)] });\n }\n }\n this.updateCellProps({ rowIndex: rowCellIndexes[0].rowIndex, cellIndex: rowCellIndexes[0].cellIndexes[0] }, { rowIndex: rowCellIndexes[0].rowIndex, cellIndex: rowCellIndexes[0].cellIndexes[0] });\n var cellSelectedArgs = {\n data: selectedData, cellIndex: rowCellIndexes[0].cellIndexes[0],\n currentCell: selectedCell, selectedRowCellIndex: this.selectedRowCellIndexes,\n previousRowCell: this.prevECIdxs ? this.getCellIndex(this.prevECIdxs.rowIndex, this.prevECIdxs.cellIndex) : undefined\n };\n var prvRowCellIndex = 'previousRowCellIndex';\n cellSelectedArgs[\"\" + prvRowCellIndex] = this.prevECIdxs;\n this.onActionComplete(cellSelectedArgs, events.cellSelected);\n };\n /**\n * Select cells with existing cell selection by passing row and column index.\n *\n * @param {IIndex} cellIndexes - Defines the collection of row and column index.\n * @returns {void}\n * @hidden\n */\n Selection.prototype.addCellsToSelection = function (cellIndexes) {\n if (!this.isCellType()) {\n return;\n }\n var gObj = this.parent;\n var selectedCell;\n var index;\n this.currentIndex = cellIndexes[0].rowIndex;\n var cncl = 'cancel';\n var selectedData = this.getCurrentBatchRecordChanges()[this.currentIndex];\n if (this.isSingleSel() || !this.isCellType() || this.isEditing()) {\n return;\n }\n this.hideAutoFill();\n var rowObj;\n rowObj = gObj.getRowsObject()[cellIndexes[0].rowIndex];\n if (gObj.groupSettings.columns.length > 0) {\n rowObj = gObj.getRowObjectFromUID(this.target.parentElement.getAttribute('data-uid'));\n }\n var foreignKeyData = [];\n for (var _i = 0, cellIndexes_1 = cellIndexes; _i < cellIndexes_1.length; _i++) {\n var cellIndex = cellIndexes_1[_i];\n for (var i = 0, len = this.selectedRowCellIndexes.length; i < len; i++) {\n if (this.selectedRowCellIndexes[parseInt(i.toString(), 10)].rowIndex === cellIndex.rowIndex) {\n index = i;\n break;\n }\n }\n selectedCell = gObj.getCellFromIndex(cellIndex.rowIndex, this.getColIndex(cellIndex.rowIndex, cellIndex.cellIndex));\n var idx = cellIndex.cellIndex;\n if (gObj.groupSettings.columns.length > 0) {\n foreignKeyData.push(rowObj.cells[idx + gObj.groupSettings.columns.length].foreignKeyData);\n }\n else {\n foreignKeyData.push(rowObj.cells[parseInt(idx.toString(), 10)].foreignKeyData);\n }\n var args = {\n cancel: false, data: selectedData, cellIndex: cellIndexes[0],\n isShiftPressed: this.isMultiShiftRequest,\n currentCell: selectedCell, isCtrlPressed: this.isMultiCtrlRequest,\n previousRowCell: this.prevECIdxs ?\n gObj.getCellFromIndex(this.prevECIdxs.rowIndex, this.prevECIdxs.cellIndex) : undefined\n };\n var prvRowCellIndex = 'previousRowCellIndex';\n args[\"\" + prvRowCellIndex] = this.prevECIdxs;\n var isUnSelected = index > -1;\n if (isUnSelected) {\n var selectedCellIdx = this.selectedRowCellIndexes[parseInt(index.toString(), 10)].cellIndexes;\n if (selectedCellIdx.indexOf(cellIndex.cellIndex) > -1 || (this.selectionSettings.mode === 'Both' &&\n selectedCell.classList.contains('e-gridchkbox') && !selectedCell.getAttribute('aria-selected'))) {\n this.cellDeselect(events.cellDeselecting, [{ rowIndex: cellIndex.rowIndex, cellIndexes: [cellIndex.cellIndex] }], selectedData, [selectedCell], foreignKeyData);\n selectedCellIdx.splice(selectedCellIdx.indexOf(cellIndex.cellIndex), 1);\n if (selectedCellIdx.length === 0) {\n this.selectedRowCellIndexes.splice(index, 1);\n }\n selectedCell.classList.remove('e-cellselectionbackground');\n selectedCell.removeAttribute('aria-selected');\n this.cellDeselect(events.cellDeselected, [{ rowIndex: cellIndex.rowIndex, cellIndexes: [cellIndex.cellIndex] }], selectedData, [selectedCell], foreignKeyData);\n }\n else {\n isUnSelected = false;\n this.onActionBegin(args, events.cellSelecting);\n this.addRowCellIndex({ rowIndex: cellIndex.rowIndex, cellIndex: cellIndex.cellIndex });\n this.updateCellSelection(selectedCell);\n this.addAttribute(selectedCell);\n }\n }\n else {\n this.onActionBegin(args, events.cellSelecting);\n if (!isNullOrUndefined(args) && args[\"\" + cncl] === true) {\n return;\n }\n this.updateCellSelection(selectedCell, cellIndex.rowIndex, cellIndex.cellIndex);\n }\n if (!isUnSelected) {\n var cellSelectedArgs = {\n data: selectedData, cellIndex: cellIndexes[0], currentCell: selectedCell,\n previousRowCell: this.prevECIdxs ? this.getCellIndex(this.prevECIdxs.rowIndex, this.prevECIdxs.cellIndex) :\n undefined, selectedRowCellIndex: this.selectedRowCellIndexes\n };\n cellSelectedArgs[\"\" + prvRowCellIndex] = this.prevECIdxs;\n this.onActionComplete(cellSelectedArgs, events.cellSelected);\n this.cellselected = true;\n }\n this.updateCellProps(cellIndex, cellIndex);\n }\n };\n Selection.prototype.getColIndex = function (rowIndex, index) {\n var col = this.parent.getColumnByIndex(index);\n var cells = getCellsByTableName(this.parent, col, rowIndex);\n if (cells) {\n for (var m = 0; m < cells.length; m++) {\n var colIndex = parseInt(cells[parseInt(m.toString(), 10)].getAttribute(literals.dataColIndex), 10);\n if (colIndex === index) {\n return m;\n }\n }\n }\n return -1;\n };\n Selection.prototype.getLastColIndex = function (rowIndex) {\n var cells = this.parent.getDataRows()[parseInt(rowIndex.toString(), 10)].querySelectorAll('td.e-rowcell');\n return parseInt(cells[cells.length - 1].getAttribute(literals.dataColIndex), 10);\n };\n Selection.prototype.clearCell = function () {\n this.clearCellSelection();\n };\n Selection.prototype.cellDeselect = function (type, cellIndexes, data, cells, foreignKeyData) {\n var cancl = 'cancel';\n if (cells && cells.length > 0) {\n for (var _i = 0, cells_1 = cells; _i < cells_1.length; _i++) {\n var cell = cells_1[_i];\n if (cell && cell.classList.contains(literals.gridChkBox)) {\n this.updateCheckBoxes(closest(cell, 'tr'));\n }\n }\n }\n var args = {\n cells: cells, data: data, cellIndexes: cellIndexes, foreignKeyData: foreignKeyData, cancel: false\n };\n this.parent.trigger(type, args);\n this.isPreventCellSelect = args[\"\" + cancl];\n };\n Selection.prototype.updateCellSelection = function (selectedCell, rowIndex, cellIndex) {\n if (!isNullOrUndefined(rowIndex)) {\n this.addRowCellIndex({ rowIndex: rowIndex, cellIndex: cellIndex });\n }\n selectedCell.classList.add('e-cellselectionbackground');\n if (selectedCell.classList.contains(literals.gridChkBox)) {\n this.updateCheckBoxes(closest(selectedCell, 'tr'), true);\n }\n this.addAttribute(selectedCell);\n };\n Selection.prototype.addAttribute = function (cell) {\n this.target = cell;\n if (!isNullOrUndefined(cell)) {\n cell.setAttribute('aria-selected', 'true');\n if (!this.preventFocus) {\n this.focus.onClick({ target: cell }, true);\n }\n }\n };\n Selection.prototype.updateCellProps = function (startIndex, endIndex) {\n this.prevCIdxs = startIndex;\n this.prevECIdxs = endIndex;\n this.isCellSelected = this.selectedRowCellIndexes.length && true;\n };\n Selection.prototype.addRowCellIndex = function (rowCellIndex) {\n var isRowAvail;\n var index;\n for (var i = 0, len = this.selectedRowCellIndexes.length; i < len; i++) {\n if (this.selectedRowCellIndexes[parseInt(i.toString(), 10)].rowIndex === rowCellIndex.rowIndex) {\n isRowAvail = true;\n index = i;\n break;\n }\n }\n if (isRowAvail) {\n if (this.selectedRowCellIndexes[parseInt(index.toString(), 10)].cellIndexes.indexOf(rowCellIndex.cellIndex) < 0) {\n this.selectedRowCellIndexes[parseInt(index.toString(), 10)].cellIndexes.push(rowCellIndex.cellIndex);\n }\n }\n else {\n this.selectedRowCellIndexes.push({ rowIndex: rowCellIndex.rowIndex, cellIndexes: [rowCellIndex.cellIndex] });\n }\n };\n /**\n * Deselects the currently selected cells.\n *\n * @returns {void}\n */\n Selection.prototype.clearCellSelection = function () {\n if (this.isCellSelected) {\n var gObj = this.parent;\n var selectedCells = this.getSelectedCellsElement();\n var rowCell = this.selectedRowCellIndexes;\n var data = [];\n var cells = [];\n var foreignKeyData = [];\n var currentViewData = this.getCurrentBatchRecordChanges();\n this.hideAutoFill();\n for (var i = 0, len = rowCell.length; i < len; i++) {\n data.push(currentViewData[rowCell[parseInt(i.toString(), 10)].rowIndex]);\n var rowObj = this.getRowObj(rowCell[parseInt(i.toString(), 10)].rowIndex);\n for (var j = 0, cLen = rowCell[parseInt(i.toString(), 10)].cellIndexes.length; j < cLen; j++) {\n if (rowObj.cells) {\n foreignKeyData.push(rowObj.cells[rowCell[parseInt(i.toString(), 10)]\n .cellIndexes[parseInt(j.toString(), 10)]].foreignKeyData);\n }\n cells.push(gObj.getCellFromIndex(rowCell[parseInt(i.toString(), 10)].rowIndex, rowCell[parseInt(i.toString(), 10)].cellIndexes[parseInt(j.toString(), 10)]));\n }\n }\n this.cellDeselect(events.cellDeselecting, rowCell, data, cells, foreignKeyData);\n if (this.isPreventCellSelect === true) {\n return;\n }\n for (var i = 0, len = selectedCells.length; i < len; i++) {\n selectedCells[parseInt(i.toString(), 10)].classList.remove('e-cellselectionbackground');\n selectedCells[parseInt(i.toString(), 10)].removeAttribute('aria-selected');\n }\n if (this.bdrElement) {\n this.showHideBorders('none');\n }\n this.selectedRowCellIndexes = [];\n this.isCellSelected = false;\n if (!this.isDragged && this.cellselected) {\n this.cellDeselect(events.cellDeselected, rowCell, data, cells, foreignKeyData);\n }\n }\n };\n Selection.prototype.getSelectedCellsElement = function () {\n var gObj = this.parent;\n var rows = gObj.getDataRows();\n var cells = [];\n for (var i = 0, len = rows.length; i < len; i++) {\n cells = cells.concat([].slice.call(rows[parseInt(i.toString(), 10)].getElementsByClassName('e-cellselectionbackground')));\n }\n return cells;\n };\n Selection.prototype.mouseMoveHandler = function (e) {\n e.preventDefault();\n this.stopTimer();\n var gBRect = this.parent.element.getBoundingClientRect();\n var x1 = this.x;\n var y1 = this.y;\n var position = getPosition(e);\n var x2 = position.x - gBRect.left;\n var y2 = position.y - gBRect.top;\n var tmp;\n var target = closest(e.target, 'tr');\n this.isDragged = true;\n if (!this.isCellDrag) {\n if (!target) {\n target = closest(document.elementFromPoint(this.parent.element.offsetLeft + 2, e.clientY), 'tr');\n }\n if (x1 > x2) {\n tmp = x2;\n x2 = x1;\n x1 = tmp;\n }\n if (y1 > y2) {\n tmp = y2;\n y2 = y1;\n y1 = tmp;\n }\n this.element.style.left = x1 + 'px';\n this.element.style.top = y1 + 'px';\n this.element.style.width = x2 - x1 + 'px';\n this.element.style.height = y2 - y1 + 'px';\n }\n if (target && !e.ctrlKey && !e.shiftKey) {\n var rowIndex = parseInt(target.getAttribute(literals.dataRowIndex), 10);\n if (!this.isCellDrag) {\n this.hideAutoFill();\n this.selectRowsByRange(this.startDIndex, rowIndex);\n this.isRowDragSelected = true;\n }\n else {\n var td = parentsUntil(e.target, literals.rowCell);\n if (td) {\n this.startAFCell = this.startCell;\n this.endAFCell = parentsUntil(e.target, literals.rowCell);\n if (rowIndex > -1) {\n this.selectLikeExcel(e, rowIndex, parseInt(td.getAttribute(literals.dataColIndex), 10));\n }\n }\n }\n }\n if (!e.ctrlKey && !e.shiftKey && !this.parent.enableVirtualization && !this.parent.enableInfiniteScrolling &&\n !this.parent.enableColumnVirtualization && !this.parent.groupSettings.columns.length && this.isCellDrag) {\n this.updateScrollPosition(e, position, this.parent.getContent());\n }\n };\n Selection.prototype.updateScrollPosition = function (mouseEvent, position, scrollElement) {\n var _this = this;\n var clientRect = scrollElement.getBoundingClientRect();\n if (clientRect.left >= position.x - 20 -\n (this.parent.enableRtl && this.parent.height !== 'auto' ? getScrollBarWidth() : 0)) {\n this.timer1 = window.setInterval(function () { _this.setScrollPosition(scrollElement.firstElementChild, _this.parent.enableRtl ? 'right' : 'left', mouseEvent); }, 200);\n }\n else if (clientRect.left + scrollElement.clientWidth - 20 -\n (!this.parent.enableRtl && this.parent.height !== 'auto' ? getScrollBarWidth() : 0) < position.x) {\n this.timer1 = window.setInterval(function () { _this.setScrollPosition(scrollElement.firstElementChild, _this.parent.enableRtl ? 'left' : 'right', mouseEvent); }, 200);\n }\n if (clientRect.top >= position.y - (this.parent.getRowHeight() * 0.5)) {\n this.timer2 = window.setInterval(function () { _this.setScrollPosition(scrollElement.firstElementChild, 'up', mouseEvent); }, 200);\n }\n else if (clientRect.top + scrollElement.clientHeight - (this.parent.getRowHeight() * 0.5) -\n (scrollElement.firstElementChild.scrollWidth > scrollElement.firstElementChild.offsetWidth ?\n getScrollBarWidth() : 0) <= position.y) {\n this.timer2 = window.setInterval(function () { _this.setScrollPosition(scrollElement.firstElementChild, 'down', mouseEvent); }, 200);\n }\n };\n Selection.prototype.stopTimer = function () {\n if (this.timer1) {\n window.clearInterval(this.timer1);\n this.timer1 = null;\n }\n if (this.timer2) {\n window.clearInterval(this.timer2);\n this.timer2 = null;\n }\n this.preventFocus = false;\n };\n Selection.prototype.setScrollPosition = function (scrollElement, direction, mouseEvent) {\n var rowIndex = -1;\n var columnIndex = -1;\n if (this.endAFCell || this.prevECIdxs) {\n rowIndex = this.endAFCell ? parseInt(this.endAFCell.getAttribute('index'), 10) : this.prevECIdxs.rowIndex;\n columnIndex = this.endAFCell ? parseInt(this.endAFCell.getAttribute('data-colindex'), 10) : this.prevECIdxs.cellIndex;\n }\n switch (direction) {\n case 'up':\n if (mouseEvent && closest(mouseEvent.target, '.e-headercontent')) {\n return;\n }\n if (this.isAutoFillSel && this.startAFCell && this.selectedRowCellIndexes.length &&\n ((this.selectedRowCellIndexes.length === 1 && this.startAFCell !== this.startCell) ||\n (this.selectedRowCellIndexes.length > 1 && this.startAFCell.getBoundingClientRect().top > 0))) {\n rowIndex = parseInt(this.startAFCell.getAttribute('index'), 10);\n }\n rowIndex -= 1;\n if (this.parent.frozenRows) {\n rowIndex += this.parent.frozenRows + 1;\n }\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n rowIndex < 1 ? scrollElement.scrollTop = 0 : scrollElement.scrollTop -= this.parent.getRowByIndex(rowIndex)\n .offsetHeight;\n break;\n case 'down':\n if (this.isAutoFillSel && this.startAFCell && this.startAFCell !== this.startCell) {\n rowIndex = parseInt(this.startAFCell.getAttribute('index'), 10);\n }\n if (rowIndex < this.parent.getRows().length - 1) {\n rowIndex += 1;\n if (this.isAutoFillSel && this.startAFCell && this.startAFCell !== this.startCell) {\n this.startAFCell = this.parent.getCellFromIndex(rowIndex, this.selectedRowCellIndexes[0].cellIndexes[0]);\n }\n scrollElement.scrollTop += this.parent.getRowByIndex(rowIndex).offsetHeight;\n }\n else {\n scrollElement.scrollTop = scrollElement.scrollHeight;\n }\n break;\n case 'left':\n if (columnIndex > 0 && rowIndex > -1) {\n if (this.isAutoFillSel && this.startAFCell && this.selectedRowCellIndexes.length &&\n ((this.selectedRowCellIndexes[0].cellIndexes.length > 0 && this.startAFCell !== this.startCell) ||\n (this.selectedRowCellIndexes[0].cellIndexes.length > 1 &&\n ((!this.parent.enableRtl && this.startAFCell.getBoundingClientRect().left > 0) || (this.parent.enableRtl &&\n this.startAFCell.getBoundingClientRect().left < this.parent.element.offsetWidth))))) {\n columnIndex = parseInt(this.startAFCell.getAttribute('data-colindex'), 10);\n }\n var nextElement_1 = this.findNextCell(scrollElement, direction, columnIndex, rowIndex);\n columnIndex = nextElement_1 ? parseInt(nextElement_1.getAttribute('data-colindex'), 10) : -1;\n if (this.parent.enableRtl && nextElement_1) {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n columnIndex < 1 ? scrollElement.scrollLeft = scrollElement.scrollWidth :\n scrollElement.scrollLeft += nextElement_1.offsetWidth;\n }\n else if (nextElement_1) {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n columnIndex < 1 ? scrollElement.scrollLeft = 0 : scrollElement.scrollLeft -= nextElement_1.offsetWidth;\n }\n }\n break;\n case 'right':\n if (this.isAutoFillSel && this.startAFCell && this.startAFCell !== this.startCell) {\n columnIndex = parseInt(this.startAFCell.getAttribute('data-colindex'), 10);\n }\n // eslint-disable-next-line no-case-declarations\n var currentElement = this.parent.getCellFromIndex(rowIndex, columnIndex);\n // eslint-disable-next-line no-case-declarations\n var nextElement = this.findNextCell(scrollElement, direction, columnIndex, rowIndex);\n if (nextElement && this.isAutoFillSel && this.startAFCell && this.startAFCell !== this.startCell) {\n this.startAFCell = this.parent.getCellFromIndex(this.selectedRowCellIndexes[0].rowIndex, parseInt(nextElement.getAttribute('data-colindex'), 10));\n }\n columnIndex = nextElement ? parseInt(nextElement.getAttribute('data-colindex'), 10) : -1;\n if (this.parent.enableRtl && nextElement) {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n columnIndex < this.parent.columns.length - 1 ? scrollElement.scrollLeft -= currentElement.offsetWidth :\n scrollElement.scrollLeft = -scrollElement.scrollWidth;\n }\n else if (nextElement) {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n columnIndex < this.parent.columns.length - 1 ? scrollElement.scrollLeft += currentElement.offsetWidth :\n scrollElement.scrollLeft = scrollElement.scrollWidth;\n }\n if (this.isAutoFillSel && (columnIndex === this.parent.columns.length - 1 || columnIndex === -1) &&\n this.startAFCell && this.endAFCell) {\n this.positionAFBorders();\n scrollElement.scrollLeft = this.parent.enableRtl ? -scrollElement.scrollWidth : scrollElement.scrollWidth;\n }\n break;\n }\n if (rowIndex > -1 && rowIndex < this.parent.getRows().length && columnIndex > -1) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var mouseEvent_1 = { target: this.parent.getCellFromIndex(rowIndex, columnIndex) };\n if (this.isAutoFillSel && mouseEvent_1.target.classList.contains('e-cellselectionbackground') &&\n ((direction === 'down' && parseInt(mouseEvent_1.target.getAttribute('index'), 10) === this.parent.getRows().length - 1) ||\n (direction === 'right' && parseInt(mouseEvent_1.target.getAttribute('data-colindex'), 10) === this.parent.columns.length - 1))) {\n return;\n }\n this.endAFCell = mouseEvent_1.target;\n this.preventFocus = true;\n this.selectLikeExcel(mouseEvent_1, rowIndex, columnIndex);\n }\n };\n Selection.prototype.findNextCell = function (scrollElement, direction, columnIndex, rowIndex) {\n var nextElement = this.parent.getCellFromIndex(rowIndex, direction === 'left' ? columnIndex - 1 : columnIndex + 1);\n if (nextElement && nextElement.classList.contains('e-hide')) {\n var siblingEles = nextElement.closest('tr').querySelectorAll('.e-rowcell:not(.e-hide)');\n var nextEleInd = Array.from(siblingEles).indexOf(nextElement.nextElementSibling);\n if (nextEleInd > 0 && nextEleInd < siblingEles.length - 1) {\n nextElement = siblingEles[nextEleInd + (direction === 'left' ? -1 : 1)];\n return nextElement;\n }\n else {\n scrollElement.scrollLeft = 0;\n return null;\n }\n }\n return nextElement;\n };\n Selection.prototype.selectLikeExcel = function (e, rowIndex, cellIndex) {\n if (!this.isAutoFillSel) {\n this.clearCellSelection();\n this.selectCellsByRange({ rowIndex: this.startDIndex, cellIndex: this.startDCellIndex }, { rowIndex: rowIndex, cellIndex: cellIndex });\n this.drawBorders();\n }\n else { //Autofill\n this.showAFBorders();\n this.selectLikeAutoFill(e);\n }\n };\n Selection.prototype.setFrozenBorders = function (parentEle, border, bdrStr) {\n var width = border.style.borderWidth.toString().split(' ');\n var strCell = ['', 'e-leftfreeze', 'e-unfreeze', 'e-leftfreeze', 'e-unfreeze', 'e-rightfreeze', 'e-rightfreeze'];\n var cells = [].slice.call(parentEle.querySelectorAll('.e-cellselectionbackground' + '.' + strCell[\"\" + bdrStr])).\n filter(function (ele) { return ele.style.display === ''; });\n var fixedCells = [].slice.call(parentEle.querySelectorAll('.e-cellselectionbackground.e-fixedfreeze')).\n filter(function (ele) { return ele.style.display === ''; });\n var isRtl = this.parent.enableRtl;\n if (cells.length) {\n var firstRowIdx = cells[0].getAttribute('index');\n var firstColIdx = cells[0].getAttribute('data-colindex');\n var lastRowIdx = cells[cells.length - 1].getAttribute('index');\n var lastColIdx = cells[cells.length - 1].getAttribute('data-colindex');\n for (var i = 0; i < cells.length; i++) {\n if (cells[parseInt(i.toString(), 10)].getAttribute('index') === firstRowIdx && (width.length === 1 || (width.length === 3\n && parseInt(width[0], 10) === 2) || (width.length === 4 && parseInt(width[0], 10) === 2))) {\n cells[parseInt(i.toString(), 10)].classList.add('e-xlsel-top-border');\n }\n if (cells[parseInt(i.toString(), 10)].getAttribute('data-colindex') === firstColIdx && (width.length === 1 ||\n (width.length === 3 && parseInt(width[1], 10) === 2) || (width.length === 4 && (((!isRtl &&\n parseInt(width[3], 10) === 2)) || (isRtl && parseInt(width[1], 10) === 2))))) {\n cells[parseInt(i.toString(), 10)].classList.add(isRtl ? 'e-xlsel-right-border' : 'e-xlsel-left-border');\n }\n if (cells[parseInt(i.toString(), 10)].getAttribute('index') === lastRowIdx && (width.length === 1 ||\n (width.length === 3 && parseInt(width[2], 10) === 2) || (width.length === 4 && parseInt(width[2], 10) === 2))) {\n cells[parseInt(i.toString(), 10)].classList.add('e-xlsel-bottom-border');\n }\n if (cells[parseInt(i.toString(), 10)].getAttribute('data-colindex') === lastColIdx && (width.length === 1 ||\n (width.length === 3 && parseInt(width[1], 10) === 2) || (width.length === 4 && ((!isRtl &&\n parseInt(width[1], 10) === 2)) || (isRtl && parseInt(width[3], 10) === 2)))) {\n cells[parseInt(i.toString(), 10)].classList.add(isRtl ? 'e-xlsel-left-border' : 'e-xlsel-right-border');\n }\n }\n }\n if (fixedCells.length) {\n var firstRowIdx = fixedCells[0].getAttribute('index');\n var firstColIdx = fixedCells[0].getAttribute('data-colindex');\n var lastRowIdx = fixedCells[fixedCells.length - 1].getAttribute('index');\n var lastColIdx = fixedCells[fixedCells.length - 1].getAttribute('data-colindex');\n for (var i = 0; i < fixedCells.length; i++) {\n var idx = fixedCells[parseInt(i.toString(), 10)].getAttribute('index');\n var colIdx = fixedCells[parseInt(i.toString(), 10)].getAttribute('data-colindex');\n if (idx === firstRowIdx &&\n ((!this.parent.getHeaderContent().querySelector('.e-cellselectionbackground.e-fixedfreeze')\n && parentsUntil(parentEle, 'e-content')) || !parentsUntil(parentEle, 'e-content'))) {\n fixedCells[parseInt(i.toString(), 10)].classList.add('e-xlsel-top-border');\n }\n if (idx === lastRowIdx &&\n ((!this.parent.getContent().querySelector('.e-cellselectionbackground.e-fixedfreeze')\n && parentsUntil(parentEle, 'e-headercontent')) || !parentsUntil(parentEle, 'e-headercontent'))) {\n fixedCells[parseInt(i.toString(), 10)].classList.add('e-xlsel-bottom-border');\n }\n var preCell = fixedCells[parseInt(i.toString(), 10)].parentElement.children[parseInt(colIdx, 10) - 1];\n if (colIdx === firstColIdx && (!preCell || (preCell && !preCell.classList.contains('e-cellselectionbackground')))) {\n fixedCells[parseInt(i.toString(), 10)].classList.add(isRtl ? 'e-xlsel-right-border' : 'e-xlsel-left-border');\n }\n var nextCell = fixedCells[parseInt(i.toString(), 10)].parentElement.children[parseInt(colIdx, 10) + 1];\n if (colIdx === lastColIdx && (!nextCell || (nextCell && !nextCell.classList.contains('e-cellselectionbackground')))) {\n fixedCells[parseInt(i.toString(), 10)].classList.add(isRtl ? 'e-xlsel-left-border' : 'e-xlsel-right-border');\n }\n }\n }\n };\n Selection.prototype.refreshFrozenBorders = function () {\n if (this.bdrElement) {\n this.setFrozenBorders(this.parent.getContentTable(), this.bdrElement, '1');\n if (this.parent.isFrozenGrid() && this.parent.getFrozenMode() === literals.leftRight) {\n this.setFrozenBorders(this.parent.getContentTable(), this.frcBdrElement, '5');\n }\n if (this.parent.frozenRows) {\n this.setFrozenBorders(this.parent.getHeaderTable(), this.fhBdrElement, '3');\n if (this.parent.isFrozenGrid() && this.parent.getFrozenMode() === literals.leftRight) {\n this.setFrozenBorders(this.parent.getHeaderTable(), this.frhBdrElement, '6');\n }\n }\n }\n };\n Selection.prototype.drawBorders = function () {\n if (this.selectionSettings.cellSelectionMode === 'BoxWithBorder' && this.selectedRowCellIndexes.length && !this.parent.isEdit) {\n this.parent.element.classList.add('e-enabledboxbdr');\n if (!this.bdrElement) {\n this.createBorders();\n }\n this.positionBorders();\n if (this.parent.isFrozenGrid()) {\n this.showHideBorders('none', true);\n this.refreshFrozenBorders();\n }\n }\n else {\n this.showHideBorders('none');\n }\n };\n Selection.prototype.isLastCell = function (cell) {\n var cells = [].slice.call(cell.parentElement.querySelectorAll('.e-rowcell:not(.e-hide)'));\n return cells[cells.length - 1] === cell;\n };\n Selection.prototype.isLastRow = function (cell) {\n var rows = [].slice.call(closest(cell, literals.tbody).querySelectorAll('.e-row:not(.e-hiddenrow)'));\n return cell.parentElement === rows[rows.length - 1];\n };\n Selection.prototype.isFirstRow = function (cell) {\n var rows = [].slice.call(closest(cell, literals.tbody).querySelectorAll('.e-row:not(.e-hiddenrow)'));\n return cell.parentElement === rows[0];\n };\n Selection.prototype.isFirstCell = function (cell) {\n var cells = [].slice.call(cell.parentElement.querySelectorAll('.e-rowcell:not(.e-hide)'));\n return cells[0] === cell;\n };\n Selection.prototype.setBorders = function (parentEle, border, bdrStr) {\n var cells = [].slice.call(parentEle.getElementsByClassName('e-cellselectionbackground')).\n filter(function (ele) { return ele.style.display === ''; });\n if (cells.length && this.parent.isFrozenGrid()) {\n var strCell = ['', 'e-leftfreeze', 'e-unfreeze', 'e-leftfreeze', 'e-unfreeze', 'e-rightfreeze', 'e-rightfreeze'];\n cells = [].slice.call(parentEle.querySelectorAll('.e-cellselectionbackground' + '.' + strCell[\"\" + bdrStr] + ':not(.e-hide)')).\n filter(function (ele) { return ele.style.display === ''; });\n }\n if (cells.length) {\n var isFrozen = this.parent.isFrozenGrid();\n var start = cells[0];\n var end = cells[cells.length - 1];\n var stOff = start.getBoundingClientRect();\n var endOff = end.getBoundingClientRect();\n var parentOff = start.offsetParent.getBoundingClientRect();\n if (start.offsetParent.classList.contains('e-content') || start.offsetParent.classList.contains('e-headercontent')) {\n parentOff = start.offsetParent.querySelector('table').getBoundingClientRect();\n }\n var rowHeight = !isFrozen && this.isLastRow(end) && (bdrStr === '1' || bdrStr === '2' || bdrStr === '5') ? 2 : 0;\n var topOffSet = 0;\n var leftOffset = isFrozen && (bdrStr === '2' || bdrStr === '4') && this.isFirstCell(start) ? 1 : 0;\n var rightOffset = ((this.parent.getFrozenMode() === 'Right' && (bdrStr === '1' || bdrStr === '3'))\n || (this.parent.getFrozenMode() === literals.leftRight && (bdrStr === '5' || bdrStr === '6')))\n && this.isFirstCell(start) ? 1 : 0;\n if (this.parent.enableRtl) {\n border.style.right = parentOff.right - stOff.right - leftOffset + 'px';\n border.style.width = stOff.right - endOff.left + leftOffset + 1 + 'px';\n }\n else {\n border.style.left = stOff.left - parentOff.left - leftOffset - rightOffset + 'px';\n border.style.width = endOff.right - stOff.left + leftOffset - rightOffset + 1 + 'px';\n }\n border.style.top = stOff.top - parentOff.top - topOffSet + 'px';\n border.style.height = endOff.top - stOff.top > 0 ?\n (endOff.top - parentOff.top + endOff.height + (isFrozen ? 0 : 1)) - (stOff.top - parentOff.top) - rowHeight + topOffSet + 'px' :\n endOff.height + topOffSet - rowHeight + (isFrozen ? 0 : 1) + 'px';\n this.selectDirection += bdrStr;\n }\n else {\n border.style.display = 'none';\n }\n };\n Selection.prototype.positionBorders = function () {\n this.updateStartEndCells();\n if (!this.startCell || !this.bdrElement || !this.selectedRowCellIndexes.length) {\n return;\n }\n this.selectDirection = '';\n this.showHideBorders('');\n this.setBorders(this.parent.getContentTable(), this.bdrElement, '1');\n if (this.parent.isFrozenGrid()) {\n this.setBorders(this.parent.getContentTable(), this.mcBdrElement, '2');\n if (this.parent.getFrozenMode() === literals.leftRight) {\n this.setBorders(this.parent.getContentTable(), this.frcBdrElement, '5');\n }\n }\n if (this.parent.frozenRows) {\n this.setBorders(this.parent.getHeaderTable(), this.fhBdrElement, '3');\n if (this.parent.isFrozenGrid()) {\n this.setBorders(this.parent.getHeaderTable(), this.mhBdrElement, '4');\n if (this.parent.getFrozenMode() === literals.leftRight) {\n this.setBorders(this.parent.getHeaderTable(), this.frhBdrElement, '6');\n }\n }\n }\n this.applyBorders(this.selectDirection);\n };\n /* eslint-enable */\n Selection.prototype.applyBothFrozenBorders = function (str) {\n var rtl = this.parent.enableRtl;\n switch (str.length) {\n case 6:\n {\n this.bdrElement.style.borderWidth = rtl ? this.right_bottom : this.bottom_left;\n this.mcBdrElement.style.borderWidth = this.bottom;\n this.fhBdrElement.style.borderWidth = rtl ? this.top_right : this.top_left;\n this.mhBdrElement.style.borderWidth = this.top;\n this.frcBdrElement.style.borderWidth = rtl ? this.bottom_left : this.right_bottom;\n this.frhBdrElement.style.borderWidth = rtl ? this.top_left : this.top_right;\n }\n break;\n case 4:\n {\n if (str.includes('1') && str.includes('2') && str.includes('3') && str.includes('4')) {\n this.fhBdrElement.style.borderWidth = rtl ? this.top_right : this.top_left;\n this.mhBdrElement.style.borderWidth = rtl ? this.top_left : this.top_right;\n this.bdrElement.style.borderWidth = rtl ? this.right_bottom : this.bottom_left;\n this.mcBdrElement.style.borderWidth = rtl ? this.bottom_left : this.right_bottom;\n }\n if (str.includes('2') && str.includes('4') && str.includes('5') && str.includes('6')) {\n this.mcBdrElement.style.borderWidth = rtl ? this.right_bottom : this.bottom_left;\n this.mhBdrElement.style.borderWidth = rtl ? this.top_right : this.top_left;\n this.frcBdrElement.style.borderWidth = rtl ? this.bottom_left : this.right_bottom;\n this.frhBdrElement.style.borderWidth = rtl ? this.top_left : this.top_right;\n }\n }\n break;\n case 3:\n {\n this.bdrElement.style.borderWidth = rtl ? this.top_right_bottom : this.top_bottom_left;\n this.mcBdrElement.style.borderWidth = this.top_bottom;\n this.frcBdrElement.style.borderWidth = rtl ? this.top_bottom_left : this.top_right_bottom;\n if (this.parent.frozenRows) {\n this.fhBdrElement.style.borderWidth = rtl ? this.top_right_bottom : this.top_bottom_left;\n this.mhBdrElement.style.borderWidth = this.top_bottom;\n this.frcBdrElement.style.borderWidth = rtl ? this.top_bottom_left : this.top_right_bottom;\n }\n }\n break;\n case 2:\n {\n if (str.includes('1')) {\n this.mcBdrElement.style.borderWidth = rtl ? this.top_bottom_left : this.top_right_bottom;\n if (this.parent.frozenRows) {\n this.fhBdrElement.style.borderWidth = this.top_right_left;\n }\n }\n if (str.includes('2')) {\n this.bdrElement.style.borderWidth = rtl ? this.top_right_bottom : this.top_bottom_left;\n this.frcBdrElement.style.borderWidth = rtl ? this.top_bottom_left : this.top_right_bottom;\n if (this.parent.frozenRows) {\n this.mhBdrElement.style.borderWidth = this.top_right_left;\n }\n }\n if (str.includes('3')) {\n this.mhBdrElement.style.borderWidth = rtl ? this.top_bottom_left : this.top_right_bottom;\n this.bdrElement.style.borderWidth = this.right_bottom_left;\n }\n if (str.includes('4')) {\n this.fhBdrElement.style.borderWidth = rtl ? this.top_right_bottom : this.top_bottom_left;\n this.frhBdrElement.style.borderWidth = rtl ? this.top_bottom_left : this.top_right_bottom;\n this.mcBdrElement.style.borderWidth = this.right_bottom_left;\n }\n if (str.includes('5')) {\n this.mcBdrElement.style.borderWidth = rtl ? this.top_right_bottom : this.top_bottom_left;\n if (this.parent.frozenRows) {\n this.frhBdrElement.style.borderWidth = this.top_right_left;\n }\n }\n if (str.includes('6')) {\n this.mhBdrElement.style.borderWidth = rtl ? this.top_right_bottom : this.top_bottom_left;\n this.frcBdrElement.style.borderWidth = this.right_bottom_left;\n }\n }\n break;\n default:\n this.bdrElement.style.borderWidth = this.all_border;\n this.mcBdrElement.style.borderWidth = this.all_border;\n this.frcBdrElement.style.borderWidth = this.all_border;\n if (this.parent.frozenRows) {\n this.fhBdrElement.style.borderWidth = this.all_border;\n this.mhBdrElement.style.borderWidth = this.all_border;\n this.frhBdrElement.style.borderWidth = this.all_border;\n }\n break;\n }\n };\n Selection.prototype.applyBorders = function (str) {\n var rtl = this.parent.enableRtl;\n if (this.parent.getFrozenMode() === literals.leftRight) {\n this.applyBothFrozenBorders(str);\n }\n else {\n switch (str.length) {\n case 4:\n {\n if (this.parent.getFrozenMode() === 'Right') {\n this.bdrElement.style.borderWidth = rtl ? this.bottom_left : this.right_bottom;\n this.mcBdrElement.style.borderWidth = rtl ? this.right_bottom : this.bottom_left;\n this.fhBdrElement.style.borderWidth = rtl ? this.top_left : this.top_right;\n this.mhBdrElement.style.borderWidth = rtl ? this.top_right : this.top_left;\n }\n else {\n this.bdrElement.style.borderWidth = rtl ? this.right_bottom : this.bottom_left;\n this.mcBdrElement.style.borderWidth = rtl ? this.bottom_left : this.right_bottom;\n this.fhBdrElement.style.borderWidth = rtl ? this.top_right : this.top_left;\n this.mhBdrElement.style.borderWidth = rtl ? this.top_left : this.top_right;\n }\n }\n break;\n case 2:\n {\n if (this.parent.getFrozenMode() === 'Right') {\n this.bdrElement.style.borderWidth = str.includes('2') ? rtl ? this.top_bottom_left\n : this.top_right_bottom : this.right_bottom_left;\n this.mcBdrElement.style.borderWidth = str.includes('1') ? rtl ? this.top_right_bottom\n : this.top_bottom_left : this.right_bottom_left;\n if (this.parent.frozenRows) {\n this.fhBdrElement.style.borderWidth = str.includes('1') ? this.top_right_left\n : rtl ? this.top_bottom_left : this.top_right_bottom;\n this.mhBdrElement.style.borderWidth = str.includes('2') ? this.top_right_left\n : rtl ? this.top_right_bottom : this.top_bottom_left;\n }\n }\n else {\n this.bdrElement.style.borderWidth = str.includes('2') ? rtl ? this.top_right_bottom\n : this.top_bottom_left : this.right_bottom_left;\n if (this.parent.isFrozenGrid()) {\n this.mcBdrElement.style.borderWidth = str.includes('1') ? rtl ? this.top_bottom_left\n : this.top_right_bottom : this.right_bottom_left;\n }\n if (this.parent.frozenRows) {\n this.fhBdrElement.style.borderWidth = str.includes('1') ? this.top_right_left\n : rtl ? this.top_right_bottom : this.top_bottom_left;\n if (this.parent.isFrozenGrid()) {\n this.mhBdrElement.style.borderWidth = str.includes('2') ? this.top_right_left\n : rtl ? this.top_bottom_left : this.top_right_bottom;\n }\n }\n }\n }\n break;\n default:\n this.bdrElement.style.borderWidth = this.all_border;\n if (this.parent.isFrozenGrid()) {\n this.mcBdrElement.style.borderWidth = this.all_border;\n }\n if (this.parent.frozenRows) {\n this.fhBdrElement.style.borderWidth = this.all_border;\n if (this.parent.isFrozenGrid()) {\n this.mhBdrElement.style.borderWidth = this.all_border;\n }\n }\n break;\n }\n }\n };\n Selection.prototype.createBorders = function () {\n if (!this.bdrElement) {\n this.bdrElement = this.parent.getContentTable().parentElement.appendChild(createElement('div', {\n className: 'e-xlsel', id: this.parent.element.id + '_bdr',\n styles: 'width: 2px; border-width: 0;'\n }));\n if (this.parent.isFrozenGrid()) {\n this.mcBdrElement = this.parent.getContentTable().parentElement.appendChild(createElement('div', {\n className: 'e-xlsel', id: this.parent.element.id + '_mcbdr',\n styles: 'height: 2px; border-width: 0;'\n }));\n if (this.parent.getFrozenMode() === literals.leftRight) {\n this.frcBdrElement = this.parent.getContentTable().parentElement.appendChild(createElement('div', {\n className: 'e-xlsel', id: this.parent.element.id + '_frcbdr',\n styles: 'height: 2px; border-width: 0;'\n }));\n }\n }\n if (this.parent.frozenRows) {\n this.fhBdrElement = this.parent.getHeaderTable().parentElement.appendChild(createElement('div', { className: 'e-xlsel', id: this.parent.element.id + '_fhbdr', styles: 'height: 2px;' }));\n }\n if (this.parent.frozenRows && this.parent.isFrozenGrid()) {\n this.mhBdrElement = this.parent.getHeaderTable().parentElement.appendChild(createElement('div', { className: 'e-xlsel', id: this.parent.element.id + '_mhbdr', styles: 'height: 2px;' }));\n if (this.parent.getFrozenMode() === literals.leftRight) {\n this.frhBdrElement = this.parent.getHeaderTable().parentElement.appendChild(createElement('div', { className: 'e-xlsel', id: this.parent.element.id + '_frhbdr', styles: 'height: 2px;' }));\n }\n }\n }\n };\n Selection.prototype.showHideBorders = function (display, freeze) {\n if (this.bdrElement) {\n this.bdrElement.style.display = display;\n if (this.parent.isFrozenGrid()) {\n var parentEle = this.parent.getContentTable();\n removeClass(parentEle.querySelectorAll('.e-xlsel-top-border'), 'e-xlsel-top-border');\n removeClass(parentEle.querySelectorAll('.e-xlsel-left-border'), 'e-xlsel-left-border');\n removeClass(parentEle.querySelectorAll('.e-xlsel-right-border'), 'e-xlsel-right-border');\n removeClass(parentEle.querySelectorAll('.e-xlsel-bottom-border'), 'e-xlsel-bottom-border');\n if (!freeze) {\n this.mcBdrElement.style.display = display;\n }\n if (this.parent.getFrozenMode() === literals.leftRight) {\n this.frcBdrElement.style.display = display;\n }\n }\n if (this.parent.frozenRows) {\n var parentEle = this.parent.getHeaderTable();\n removeClass(parentEle.querySelectorAll('.e-xlsel-top-border'), 'e-xlsel-top-border');\n removeClass(parentEle.querySelectorAll('.e-xlsel-left-border'), 'e-xlsel-left-border');\n removeClass(parentEle.querySelectorAll('.e-xlsel-right-border'), 'e-xlsel-right-border');\n removeClass(parentEle.querySelectorAll('.e-xlsel-bottom-border'), 'e-xlsel-bottom-border');\n this.fhBdrElement.style.display = display;\n }\n if (this.parent.frozenRows && this.parent.isFrozenGrid()) {\n if (!freeze) {\n this.mhBdrElement.style.display = display;\n }\n if (this.parent.getFrozenMode() === literals.leftRight) {\n this.frhBdrElement.style.display = display;\n }\n }\n }\n };\n Selection.prototype.drawAFBorders = function () {\n if (!this.bdrAFBottom) {\n this.createAFBorders();\n }\n this.positionAFBorders();\n };\n Selection.prototype.positionAFBorders = function () {\n if (!this.startCell || !this.bdrAFLeft) {\n return;\n }\n var stOff = this.startAFCell.getBoundingClientRect();\n var endOff = this.endAFCell.getBoundingClientRect();\n var top = endOff.top - stOff.top > 0 ? 1 : 0;\n var firstCellTop = endOff.top - stOff.top >= 0 && (parentsUntil(this.startAFCell, literals.movableContent) ||\n parentsUntil(this.startAFCell, 'e-frozencontent')) && this.isFirstRow(this.startAFCell) ? 1.5 : 0;\n var firstCellLeft = (parentsUntil(this.startAFCell, literals.movableContent) ||\n parentsUntil(this.startAFCell, literals.movableHeader)) && this.isFirstCell(this.startAFCell) ? 1 : 0;\n var rowHeight = this.isLastRow(this.endAFCell) && (parentsUntil(this.endAFCell, literals.movableContent) ||\n parentsUntil(this.endAFCell, 'e-frozencontent')) ? 2 : 0;\n var parentOff = this.startAFCell.offsetParent.getBoundingClientRect();\n var parentRect = this.parent.element.getBoundingClientRect();\n var sTop = this.startAFCell.offsetParent.parentElement.scrollTop;\n var sLeft = this.startAFCell.offsetParent.parentElement.scrollLeft;\n var scrollTop = sTop - this.startAFCell.offsetTop;\n var scrollLeft = sLeft - this.startAFCell.offsetLeft;\n var totalHeight = this.parent.element.clientHeight - getScrollBarWidth();\n if (this.parent.allowPaging) {\n totalHeight -= this.parent.element.querySelector('.e-pager').offsetHeight;\n }\n if (this.parent.aggregates.length) {\n totalHeight -= this.parent.getFooterContent().offsetHeight;\n }\n var totalWidth = this.parent.element.clientWidth - (this.parent.height !== 'auto' ? getScrollBarWidth() : 0);\n scrollTop = scrollTop > 0 ? Math.floor(scrollTop) - 1 : 0;\n scrollLeft = scrollLeft > 0 ? scrollLeft : 0;\n var left = stOff.left - parentRect.left;\n if (!this.parent.enableRtl) {\n this.bdrAFLeft.style.left = left - firstCellLeft + scrollLeft - 1 + 'px';\n this.bdrAFRight.style.left = endOff.left - parentRect.left - 2 + endOff.width + 'px';\n this.bdrAFRight.style.width = totalWidth <= parseInt(this.bdrAFRight.style.left, 10) ? '0px' : '2px';\n this.bdrAFTop.style.left = left + scrollLeft - 0.5 + 'px';\n this.bdrAFTop.style.width = parseInt(this.bdrAFRight.style.left, 10) - parseInt(this.bdrAFLeft.style.left, 10)\n - firstCellLeft + 1 + 'px';\n if (totalWidth <= (parseInt(this.bdrAFTop.style.width, 10) + parseInt(this.bdrAFTop.style.left, 10))) {\n var leftRemove = (parseInt(this.bdrAFTop.style.width, 10) + parseInt(this.bdrAFTop.style.left, 10)) - totalWidth;\n this.bdrAFTop.style.width = parseInt(this.bdrAFTop.style.width, 10) - leftRemove + 'px';\n }\n }\n else {\n var scrolloffSet = (parentsUntil(this.startAFCell, literals.movableContent) ||\n parentsUntil(this.startAFCell, literals.movableHeader)) ? stOff.right -\n this.startAFCell.offsetParent.parentElement.getBoundingClientRect().width -\n parentRect.left : 0;\n this.bdrAFLeft.style.right = parentRect.right - endOff.right - 2 + endOff.width + 'px';\n this.bdrAFLeft.style.width = totalWidth <= parseInt(this.bdrAFLeft.style.right, 10) ? '0px' : '2px';\n var borderAFRightValue = parentRect.right - stOff.right - firstCellLeft + scrolloffSet - 1;\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n borderAFRightValue > 0 ? this.bdrAFRight.style.right = borderAFRightValue + 'px' : this.bdrAFRight.style.right = '0px';\n this.bdrAFTop.style.left = endOff.left - parentRect.left - 0.5 + 'px';\n this.bdrAFTop.style.width = parseInt(this.bdrAFLeft.style.right, 10) - parseInt(this.bdrAFRight.style.right, 10)\n - firstCellLeft + 1 + 'px';\n if (parseInt(this.bdrAFTop.style.left, 10) < 0) {\n this.bdrAFTop.style.width = parseInt(this.bdrAFTop.style.width, 10) + parseInt(this.bdrAFTop.style.left, 10) + 'px';\n if (this.parent.height !== 'auto' && getScrollBarWidth()) {\n this.bdrAFTop.style.left = getScrollBarWidth() + 'px';\n this.bdrAFTop.style.width = (parseInt(this.bdrAFTop.style.width, 10) - getScrollBarWidth()) + 'px';\n }\n else {\n this.bdrAFTop.style.left = '0px';\n }\n }\n }\n this.bdrAFLeft.style.top = stOff.top - parentRect.top - firstCellTop + scrollTop + 'px';\n this.bdrAFLeft.style.height = endOff.top - stOff.top > 0 ?\n (endOff.top - parentOff.top + endOff.height + 1) - (stOff.top - parentOff.top) + firstCellTop - rowHeight - scrollTop + 'px' :\n endOff.height + firstCellTop - rowHeight - scrollTop + 'px';\n this.bdrAFRight.style.top = this.bdrAFLeft.style.top;\n this.bdrAFRight.style.height = parseInt(this.bdrAFLeft.style.height, 10) + 'px';\n this.bdrAFTop.style.top = this.bdrAFRight.style.top;\n this.bdrAFBottom.style.left = this.bdrAFTop.style.left;\n this.bdrAFBottom.style.top = parseFloat(this.bdrAFLeft.style.top) + parseFloat(this.bdrAFLeft.style.height) - top - 1 + 'px';\n this.bdrAFBottom.style.width = totalHeight <= parseFloat(this.bdrAFBottom.style.top) ? '0px' : this.bdrAFTop.style.width;\n if (totalHeight <= (parseInt(this.bdrAFLeft.style.height, 10) + parseInt(this.bdrAFLeft.style.top, 10))) {\n var topRemove = parseInt(this.bdrAFLeft.style.height, 10) + parseInt(this.bdrAFLeft.style.top, 10) - totalHeight;\n this.bdrAFLeft.style.height = parseInt(this.bdrAFLeft.style.height, 10) - topRemove + 'px';\n this.bdrAFRight.style.height = parseInt(this.bdrAFLeft.style.height, 10) + 'px';\n }\n };\n Selection.prototype.createAFBorders = function () {\n if (!this.bdrAFLeft) {\n this.bdrAFLeft = this.parent.element.appendChild(createElement('div', { className: 'e-xlselaf', id: this.parent.element.id + '_bdrafleft', styles: 'width: 2px;' }));\n this.bdrAFRight = this.parent.element.appendChild(createElement('div', { className: 'e-xlselaf', id: this.parent.element.id + '_bdrafright', styles: 'width: 2px;' }));\n this.bdrAFBottom = this.parent.element.appendChild(createElement('div', { className: 'e-xlselaf', id: this.parent.element.id + '_bdrafbottom', styles: 'height: 2px;' }));\n this.bdrAFTop = this.parent.element.appendChild(createElement('div', { className: 'e-xlselaf', id: this.parent.element.id + '_bdraftop', styles: 'height: 2px;' }));\n }\n };\n Selection.prototype.destroyAutoFillElements = function () {\n if (this.bdrAFLeft) {\n this.bdrAFLeft.remove();\n this.bdrAFRight.remove();\n this.bdrAFBottom.remove();\n this.bdrAFTop.remove();\n this.bdrAFLeft = this.bdrAFRight = this.bdrAFBottom = this.bdrAFTop = null;\n }\n if (this.autofill) {\n this.autofill.remove();\n this.autofill = null;\n }\n };\n Selection.prototype.showAFBorders = function () {\n if (this.bdrAFLeft) {\n this.bdrAFLeft.style.display = '';\n this.bdrAFRight.style.display = '';\n this.bdrAFBottom.style.display = '';\n this.bdrAFTop.style.display = '';\n }\n };\n Selection.prototype.hideAFBorders = function () {\n if (this.bdrAFLeft) {\n this.bdrAFLeft.style.display = 'none';\n this.bdrAFRight.style.display = 'none';\n this.bdrAFBottom.style.display = 'none';\n this.bdrAFTop.style.display = 'none';\n }\n };\n Selection.prototype.updateValue = function (rIdx, cIdx, cell) {\n var args = this.createBeforeAutoFill(rIdx, cIdx, cell);\n if (!args.cancel) {\n var col = this.parent.getColumnByIndex(cIdx);\n if (this.parent.editModule && cell) {\n if (col.type === 'number') {\n this.parent.editModule.updateCell(rIdx, col.field, parseFloat(args.value));\n }\n else {\n this.parent.editModule.updateCell(rIdx, col.field, args.value);\n }\n }\n }\n };\n Selection.prototype.createBeforeAutoFill = function (rowIndex, colIndex, cell) {\n var col = this.parent.getColumnByIndex(colIndex);\n var args = {\n column: col,\n value: cell.innerText\n };\n this.parent.trigger(events.beforeAutoFill, args);\n return args;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Selection.prototype.getAutoFillCells = function (rowIndex, startCellIdx) {\n var cls = '.e-cellselectionbackground';\n var cells = [].slice.call(this.parent.getDataRows()[parseInt(rowIndex.toString(), 10)].querySelectorAll(cls));\n return cells;\n };\n Selection.prototype.selectLikeAutoFill = function (e, isApply) {\n var startrowIdx = parseInt(parentsUntil(this.startAFCell, literals.row).getAttribute(literals.dataRowIndex), 10);\n var startCellIdx = parseInt(this.startAFCell.getAttribute(literals.dataColIndex), 10);\n var endrowIdx = parseInt(parentsUntil(this.endAFCell, literals.row).getAttribute(literals.dataRowIndex), 10);\n var endCellIdx = parseInt(this.endAFCell.getAttribute(literals.dataColIndex), 10);\n var rowLen = this.selectedRowCellIndexes.length - 1;\n var colLen = this.selectedRowCellIndexes[0].cellIndexes.length - 1;\n switch (true) { //direction\n case !isApply && this.endAFCell.classList.contains('e-cellselectionbackground') &&\n !!parentsUntil(e.target, literals.rowCell):\n this.startAFCell = this.parent.getCellFromIndex(startrowIdx, startCellIdx);\n this.endAFCell = this.parent.getCellFromIndex(startrowIdx + rowLen, startCellIdx + colLen);\n this.drawAFBorders();\n break;\n case this.autoFillRLselection && startCellIdx + colLen < endCellIdx && //right\n endCellIdx - startCellIdx - colLen + 1 > endrowIdx - startrowIdx - rowLen // right bottom\n && endCellIdx - startCellIdx - colLen + 1 > startrowIdx - endrowIdx: //right top\n this.endAFCell = this.parent.getCellFromIndex(startrowIdx + rowLen, endCellIdx);\n endrowIdx = parseInt(parentsUntil(this.endAFCell, literals.row).getAttribute(literals.dataRowIndex), 10);\n endCellIdx = parseInt(this.endAFCell.getAttribute(literals.dataColIndex), 10);\n if (!isApply) {\n this.drawAFBorders();\n }\n else {\n var cellIdx = parseInt(this.endCell.getAttribute(literals.dataColIndex), 10);\n for (var i = startrowIdx; i <= endrowIdx; i++) {\n var cells = this.getAutoFillCells(i, startCellIdx);\n var c = 0;\n for (var j = cellIdx + 1; j <= endCellIdx; j++) {\n if (c > colLen) {\n c = 0;\n }\n this.updateValue(i, j, cells[parseInt(c.toString(), 10)]);\n c++;\n }\n }\n this.selectCellsByRange({ rowIndex: startrowIdx, cellIndex: this.startCellIndex }, { rowIndex: endrowIdx, cellIndex: endCellIdx });\n }\n break;\n case this.autoFillRLselection && startCellIdx > endCellIdx && // left\n startCellIdx - endCellIdx + 1 > endrowIdx - startrowIdx - rowLen && //left top\n startCellIdx - endCellIdx + 1 > startrowIdx - endrowIdx: // left bottom\n this.startAFCell = this.parent.getCellFromIndex(startrowIdx, endCellIdx);\n this.endAFCell = this.endCell;\n if (!isApply) {\n this.drawAFBorders();\n }\n else {\n for (var i = startrowIdx; i <= startrowIdx + rowLen; i++) {\n var cells = this.getAutoFillCells(i, startCellIdx);\n cells.reverse();\n var c = 0;\n for (var j = this.startCellIndex - 1; j >= endCellIdx; j--) {\n if (c > colLen) {\n c = 0;\n }\n this.updateValue(i, j, cells[parseInt(c.toString(), 10)]);\n c++;\n }\n }\n this.selectCellsByRange({ rowIndex: startrowIdx, cellIndex: endCellIdx }, { rowIndex: startrowIdx + rowLen, cellIndex: this.startCellIndex + colLen });\n }\n break;\n case startrowIdx > endrowIdx: //up\n this.startAFCell = this.parent.getCellFromIndex(endrowIdx, startCellIdx);\n this.endAFCell = this.endCell;\n if (!isApply) {\n this.drawAFBorders();\n }\n else {\n var trIdx = parseInt(this.endCell.parentElement.getAttribute(literals.dataRowIndex), 10);\n var r = trIdx;\n for (var i = startrowIdx - 1; i >= endrowIdx; i--) {\n if (r === this.startIndex - 1) {\n r = trIdx;\n }\n var cells = this.getAutoFillCells(r, startCellIdx);\n var c = 0;\n r--;\n for (var j = this.startCellIndex; j <= this.startCellIndex + colLen; j++) {\n this.updateValue(i, j, cells[parseInt(c.toString(), 10)]);\n c++;\n }\n }\n this.selectCellsByRange({ rowIndex: endrowIdx, cellIndex: startCellIdx + colLen }, { rowIndex: startrowIdx + rowLen, cellIndex: startCellIdx });\n }\n break;\n default: //down\n this.endAFCell = this.parent.getCellFromIndex(endrowIdx, startCellIdx + colLen);\n if (!isApply) {\n this.drawAFBorders();\n }\n else {\n var trIdx = parseInt(this.endCell.parentElement.getAttribute(literals.dataRowIndex), 10);\n var r = this.startIndex;\n for (var i = trIdx + 1; i <= endrowIdx; i++) {\n if (r === trIdx + 1) {\n r = this.startIndex;\n }\n var cells = this.getAutoFillCells(r, startCellIdx);\n r++;\n var c = 0;\n for (var m = this.startCellIndex; m <= this.startCellIndex + colLen; m++) {\n this.updateValue(i, m, cells[parseInt(c.toString(), 10)]);\n c++;\n }\n }\n this.selectCellsByRange({ rowIndex: trIdx - rowLen, cellIndex: startCellIdx }, { rowIndex: endrowIdx, cellIndex: startCellIdx + colLen });\n }\n break;\n }\n };\n Selection.prototype.mouseUpHandler = function (e) {\n this.stopTimer();\n document.body.classList.remove('e-disableuserselect');\n if (this.element && !isNullOrUndefined(this.element.parentElement)) {\n remove(this.element);\n }\n if (this.isDragged && this.selectedRowCellIndexes.length === 1 && this.selectedRowCellIndexes[0].cellIndexes.length === 1) {\n this.mUPTarget = parentsUntil(e.target, literals.rowCell);\n }\n else {\n this.mUPTarget = null;\n }\n var closeRowCell = closest(e.target, '.e-rowcell');\n if (this.isDragged && !this.isAutoFillSel && this.selectionSettings.mode === 'Cell' &&\n closeRowCell && closeRowCell.classList.contains(literals.rowCell)) {\n var rowIndex = parseInt(closeRowCell.parentElement.getAttribute(literals.dataRowIndex), 10);\n var cellIndex = parseInt(closeRowCell.getAttribute(literals.dataColIndex), 10);\n this.isDragged = false;\n this.clearCellSelection();\n this.selectCellsByRange({ rowIndex: this.startDIndex, cellIndex: this.startDCellIndex }, { rowIndex: rowIndex, cellIndex: cellIndex });\n }\n this.isDragged = false;\n this.updateAutoFillPosition();\n if (this.isAutoFillSel) {\n this.preventFocus = true;\n var lastCell = parentsUntil(e.target, literals.rowCell);\n this.endAFCell = lastCell ? lastCell : this.endCell === this.endAFCell ? this.startAFCell : this.endAFCell;\n this.startAFCell = this.startCell;\n if (!isNullOrUndefined(this.endAFCell) && !isNullOrUndefined(this.startAFCell)) {\n this.updateStartCellsIndex();\n this.selectLikeAutoFill(e, true);\n this.updateAutoFillPosition();\n this.hideAFBorders();\n this.positionBorders();\n if (this.parent.isFrozenGrid()) {\n this.showHideBorders('none', true);\n this.refreshFrozenBorders();\n }\n if (this.parent.aggregates.length > 0) {\n this.parent.notify(events.refreshFooterRenderer, {});\n }\n }\n this.isAutoFillSel = false;\n this.preventFocus = false;\n }\n EventHandler.remove(this.parent.getContent(), 'mousemove', this.mouseMoveHandler);\n if (this.parent.frozenRows) {\n EventHandler.remove(this.parent.getHeaderContent(), 'mousemove', this.mouseMoveHandler);\n }\n EventHandler.remove(document, 'mouseup', this.mouseUpHandler);\n };\n Selection.prototype.hideAutoFill = function () {\n if (this.autofill) {\n this.autofill.style.display = 'none';\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Selection.prototype.updateAutoFillPosition = function () {\n if (this.parent.enableAutoFill && !this.parent.isEdit &&\n this.selectionSettings.cellSelectionMode.indexOf('Box') > -1 && !this.isRowType() && !this.isSingleSel()\n && this.selectedRowCellIndexes.length) {\n var index = parseInt(this.target.getAttribute(literals.dataColIndex), 10);\n var rindex = parseInt(this.target.getAttribute('index'), 10);\n var rowIndex = this.selectedRowCellIndexes[this.selectedRowCellIndexes.length - 1].rowIndex;\n var cells = this.getAutoFillCells(rowIndex, index).filter(function (ele) { return ele.style.display === ''; });\n var col = this.parent.getColumnByIndex(index);\n var isFrozenCol = col.getFreezeTableName() === 'movable';\n var isFrozenRow = rindex < this.parent.frozenRows;\n var isFrozenRight = this.parent.getFrozenMode() === literals.leftRight\n && col.getFreezeTableName() === literals.frozenRight;\n if (!select('#' + this.parent.element.id + '_autofill', parentsUntil(this.target, literals.table))) {\n if (select('#' + this.parent.element.id + '_autofill', this.parent.element)) {\n select('#' + this.parent.element.id + '_autofill', this.parent.element).remove();\n }\n this.autofill = createElement('div', { className: 'e-autofill', id: this.parent.element.id + '_autofill' });\n this.autofill.style.display = 'none';\n if (this.target.classList.contains('e-leftfreeze') || this.target.classList.contains('e-rightfreeze') ||\n this.target.classList.contains('e-fixedfreeze')) {\n this.autofill.classList.add('e-freeze-autofill');\n }\n if (!isFrozenRow) {\n if (!isFrozenCol) {\n this.parent.getContentTable().parentElement.appendChild(this.autofill);\n }\n else {\n this.parent.getContentTable().parentElement.appendChild(this.autofill);\n }\n }\n else {\n if (!isFrozenCol) {\n this.parent.getHeaderTable().parentElement.appendChild(this.autofill);\n }\n else {\n this.parent.getHeaderTable().parentElement.appendChild(this.autofill);\n }\n }\n if (isFrozenRight) {\n if (isFrozenRow) {\n this.parent.getHeaderTable().parentElement.appendChild(this.autofill);\n }\n else {\n this.parent.getContentTable().parentElement.appendChild(this.autofill);\n }\n }\n }\n var cell = cells[cells.length - 1];\n if (cell && cell.offsetParent) {\n var clientRect = cell.getBoundingClientRect();\n var parentOff = cell.offsetParent.getBoundingClientRect();\n if (cell.offsetParent.classList.contains('e-content') || cell.offsetParent.classList.contains('e-headercontent')) {\n parentOff = cell.offsetParent.querySelector('table').getBoundingClientRect();\n }\n var colWidth = this.isLastCell(cell) ? 4 : 0;\n var rowHeight = this.isLastRow(cell) ? 3 : 0;\n if (!this.parent.enableRtl) {\n this.autofill.style.left = clientRect.left - parentOff.left + clientRect.width - 4 - colWidth + 'px';\n }\n else {\n this.autofill.style.right = parentOff.right - clientRect.right + clientRect.width - 4 - colWidth + 'px';\n }\n this.autofill.style.top = clientRect.top - parentOff.top + clientRect.height - 5 - rowHeight + 'px';\n }\n this.autofill.style.display = '';\n }\n else {\n this.hideAutoFill();\n }\n };\n Selection.prototype.mouseDownHandler = function (e) {\n this.mouseButton = e.button;\n var target = e.target;\n var gObj = this.parent;\n var isDrag;\n var gridElement = parentsUntil(target, 'e-grid');\n if (gridElement && gridElement.id !== gObj.element.id || parentsUntil(target, literals.headerContent) && !this.parent.frozenRows ||\n parentsUntil(target, 'e-editedbatchcell') || parentsUntil(target, literals.editedRow)) {\n return;\n }\n if (e.shiftKey || e.ctrlKey) {\n e.preventDefault();\n }\n if (parentsUntil(target, literals.rowCell) && !e.shiftKey && !e.ctrlKey) {\n if (gObj.selectionSettings.cellSelectionMode.indexOf('Box') > -1 && !this.isRowType() && !this.isSingleSel()) {\n this.isCellDrag = true;\n isDrag = true;\n }\n else if (gObj.allowRowDragAndDrop && !gObj.isEdit && !this.parent.selectionSettings.checkboxOnly) {\n this.isRowDragSelected = false;\n if (!this.isRowType() || this.isSingleSel() || closest(target, 'td').classList.contains('e-selectionbackground')) {\n this.isDragged = false;\n return;\n }\n isDrag = true;\n this.element = this.parent.createElement('div', { className: 'e-griddragarea' });\n gObj.getContent().appendChild(this.element);\n }\n if (isDrag) {\n this.enableDrag(e, true);\n }\n }\n this.updateStartEndCells();\n if (target.classList.contains('e-autofill') || target.classList.contains('e-xlsel')) {\n this.isCellDrag = true;\n this.isAutoFillSel = true;\n this.enableDrag(e);\n }\n };\n Selection.prototype.updateStartEndCells = function () {\n var cells = [].slice.call(this.parent.element.getElementsByClassName('e-cellselectionbackground'));\n this.startCell = cells[0];\n this.endCell = cells[cells.length - 1];\n if (this.startCell) {\n this.startIndex = parseInt(this.startCell.parentElement.getAttribute(literals.dataRowIndex), 10);\n this.startCellIndex = parseInt(parentsUntil(this.startCell, literals.rowCell).getAttribute(literals.dataColIndex), 10);\n }\n };\n Selection.prototype.updateStartCellsIndex = function () {\n if (this.startCell) {\n this.startIndex = parseInt(this.startCell.parentElement.getAttribute(literals.dataRowIndex), 10);\n this.startCellIndex = parseInt(parentsUntil(this.startCell, literals.rowCell).getAttribute(literals.dataColIndex), 10);\n }\n };\n Selection.prototype.enableDrag = function (e, isUpdate) {\n var gObj = this.parent;\n if (isUpdate) {\n var tr = closest(e.target, 'tr');\n this.startDIndex = parseInt(tr.getAttribute(literals.dataRowIndex), 10);\n this.startDCellIndex = parseInt(parentsUntil(e.target, literals.rowCell).getAttribute(literals.dataColIndex), 10);\n }\n document.body.classList.add('e-disableuserselect');\n var gBRect = gObj.element.getBoundingClientRect();\n var postion = getPosition(e);\n this.x = postion.x - gBRect.left;\n this.y = postion.y - gBRect.top;\n EventHandler.add(gObj.getContent(), 'mousemove', this.mouseMoveHandler, this);\n if (this.parent.frozenRows) {\n EventHandler.add(gObj.getHeaderContent(), 'mousemove', this.mouseMoveHandler, this);\n }\n EventHandler.add(document, 'mouseup', this.mouseUpHandler, this);\n };\n Selection.prototype.clearSelAfterRefresh = function (e) {\n var isInfiniteScroll = this.parent.enableInfiniteScrolling && e.requestType === 'infiniteScroll';\n if (e.requestType !== 'virtualscroll' && !this.parent.isPersistSelection && !isInfiniteScroll) {\n this.clearSelection();\n }\n if ((e.requestType === 'virtualscroll' || isInfiniteScroll) && this.parent.isPersistSelection && this.isPartialSelection\n && this.isHdrSelectAllClicked) {\n var rowObj = this.parent.getRowsObject().filter(function (e) { return e.isSelectable; });\n var indexes = [];\n this.selectedRowState = {};\n this.persistSelectedData = [];\n for (var i = 0; i < rowObj.length; i++) {\n indexes.push(rowObj[parseInt(i.toString(), 10)].index);\n var pkValue = this.getPkValue(this.primaryKey, rowObj[parseInt(i.toString(), 10)].data);\n this.selectedRowState[\"\" + pkValue] = true;\n this.persistSelectedData.push(rowObj[parseInt(i.toString(), 10)].data);\n }\n this.selectedRowIndexes = indexes;\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Selection.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.evtHandlers = [{ event: events.uiUpdate, handler: this.enableAfterRender },\n { event: events.initialEnd, handler: this.initializeSelection },\n { event: events.rowSelectionComplete, handler: this.onActionComplete },\n { event: events.cellSelectionComplete, handler: this.onActionComplete },\n { event: events.inBoundModelChanged, handler: this.onPropertyChanged },\n { event: events.cellFocused, handler: this.onCellFocused },\n { event: events.beforeFragAppend, handler: this.clearSelAfterRefresh },\n { event: events.columnPositionChanged, handler: this.columnPositionChanged },\n { event: events.contentReady, handler: this.initialEnd },\n { event: events.rowsRemoved, handler: this.rowsRemoved },\n { event: events.headerRefreshed, handler: this.refreshHeader },\n { event: events.destroyAutoFillElements, handler: this.destroyAutoFillElements },\n { event: events.destroy, handler: this.destroy }];\n addRemoveEventListener(this.parent, this.evtHandlers, true, this);\n this.actionBeginFunction = this.actionBegin.bind(this);\n this.actionCompleteFunction = this.actionComplete.bind(this);\n this.parent.addEventListener(events.actionBegin, this.actionBeginFunction);\n this.parent.addEventListener(events.actionComplete, this.actionCompleteFunction);\n this.addEventListener_checkbox();\n };\n /**\n * @returns {void}\n * @hidden\n */\n Selection.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n EventHandler.remove(document, 'mouseup', this.mouseUpHandler);\n EventHandler.remove(this.parent.getContent(), 'mousedown', this.mouseDownHandler);\n EventHandler.remove(this.parent.getHeaderContent(), 'mousedown', this.mouseDownHandler);\n addRemoveEventListener(this.parent, this.evtHandlers, false);\n this.parent.removeEventListener(events.actionBegin, this.actionBeginFunction);\n this.parent.removeEventListener(events.actionComplete, this.actionCompleteFunction);\n this.removeEventListener_checkbox();\n this.parent.off(events.destroyAutoFillElements, this.destroyAutoFillElements);\n };\n Selection.prototype.wireEvents = function () {\n this.isMacOS = navigator.userAgent.indexOf('Mac OS') !== -1;\n if (this.isMacOS) {\n EventHandler.add(this.parent.element, 'keydown', this.keyDownHandler, this);\n EventHandler.add(this.parent.element, 'keyup', this.keyUpHandler, this);\n }\n else {\n if (!this.parent.allowKeyboard) {\n EventHandler.add(this.parent.element, 'keydown', this.keyDownHandler, this);\n }\n }\n };\n Selection.prototype.unWireEvents = function () {\n if (this.isMacOS) {\n EventHandler.remove(this.parent.element, 'keydown', this.keyDownHandler);\n EventHandler.remove(this.parent.element, 'keyup', this.keyUpHandler);\n }\n else {\n if (!this.parent.allowKeyboard) {\n EventHandler.remove(this.parent.element, 'keydown', this.keyDownHandler);\n }\n }\n };\n Selection.prototype.columnPositionChanged = function () {\n if (!this.parent.isPersistSelection) {\n this.clearSelection();\n }\n };\n Selection.prototype.refreshHeader = function () {\n this.setCheckAllState();\n };\n Selection.prototype.rowsRemoved = function (e) {\n for (var i = 0; i < e.records.length; i++) {\n var pkValue = this.getPkValue(this.primaryKey, e.records[parseInt(i.toString(), 10)]);\n delete (this.selectedRowState[\"\" + pkValue]);\n --this.totalRecordsCount;\n }\n this.setCheckAllState();\n };\n Selection.prototype.beforeFragAppend = function (e) {\n if (e.requestType !== 'virtualscroll' && !this.parent.isPersistSelection) {\n this.clearSelection();\n }\n };\n Selection.prototype.getCheckAllBox = function () {\n return this.parent.getHeaderContent().querySelector('.e-checkselectall');\n };\n Selection.prototype.enableAfterRender = function (e) {\n if (e.module === this.getModuleName() && e.enable) {\n this.render();\n this.initPerisistSelection();\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Selection.prototype.render = function (e) {\n EventHandler.add(this.parent.getContent(), 'mousedown', this.mouseDownHandler, this);\n EventHandler.add(this.parent.getHeaderContent(), 'mousedown', this.mouseDownHandler, this);\n };\n Selection.prototype.onPropertyChanged = function (e) {\n if (e.module !== this.getModuleName()) {\n return;\n }\n var gObj = this.parent;\n if (!isNullOrUndefined(e.properties.type)) {\n if (this.selectionSettings.type === 'Single') {\n gObj.element.removeAttribute('aria-multiselectable');\n if (this.selectedRowCellIndexes.length > 1) {\n this.clearCellSelection();\n this.prevCIdxs = undefined;\n }\n if (this.selectedRowIndexes.length > 1) {\n this.clearRowSelection();\n this.prevRowIndex = undefined;\n }\n if (this.selectedColumnsIndexes.length > 1) {\n this.clearColumnSelection();\n this.prevColIndex = undefined;\n }\n this.enableSelectMultiTouch = false;\n this.hidePopUp();\n }\n else if (this.selectionSettings.type === 'Multiple') {\n gObj.element.setAttribute('aria-multiselectable', 'true');\n }\n }\n if (!isNullOrUndefined(e.properties.mode) ||\n !isNullOrUndefined(e.properties.cellSelectionMode)) {\n this.clearSelection();\n this.prevRowIndex = undefined;\n this.prevCIdxs = undefined;\n this.prevColIndex = undefined;\n }\n this.isPersisted = true;\n this.checkBoxSelectionChanged();\n this.isPersisted = false;\n if (!this.parent.isCheckBoxSelection) {\n this.initPerisistSelection();\n }\n var checkboxColumn = this.parent.getColumns().filter(function (col) { return col.type === 'checkbox'; });\n if (checkboxColumn.length) {\n gObj.isCheckBoxSelection = !(this.selectionSettings.checkboxMode === 'ResetOnRowClick');\n }\n this.drawBorders();\n };\n Selection.prototype.hidePopUp = function () {\n if (this.parent.element.querySelector('.e-gridpopup').getElementsByClassName('e-rowselect').length) {\n this.parent.element.querySelector('.e-gridpopup').style.display = 'none';\n }\n };\n Selection.prototype.initialEnd = function () {\n if (!this.selectedRowIndexes.length) {\n this.parent.off(events.contentReady, this.initialEnd);\n this.selectRow(this.parent.selectedRowIndex);\n }\n };\n Selection.prototype.checkBoxSelectionChanged = function () {\n var gobj = this.parent;\n gobj.off(events.contentReady, this.checkBoxSelectionChanged);\n var checkboxColumn = gobj.getColumns().filter(function (col) { return col.type === 'checkbox'; });\n if (checkboxColumn.length > 0) {\n gobj.isCheckBoxSelection = true;\n this.chkField = checkboxColumn[0].field;\n this.totalRecordsCount = this.parent.pageSettings.totalRecordsCount;\n if (isNullOrUndefined(this.totalRecordsCount)) {\n this.totalRecordsCount = this.getCurrentBatchRecordChanges().length;\n }\n if (this.isSingleSel()) {\n gobj.selectionSettings.type = 'Multiple';\n gobj.dataBind();\n }\n else {\n this.initPerisistSelection();\n }\n }\n if (!gobj.isCheckBoxSelection && !this.isPersisted) {\n this.chkField = null;\n this.initPerisistSelection();\n }\n };\n Selection.prototype.initPerisistSelection = function () {\n var gobj = this.parent;\n if (this.parent.selectionSettings.persistSelection && this.parent.getPrimaryKeyFieldNames().length > 0) {\n gobj.isPersistSelection = true;\n this.ensureCheckboxFieldSelection();\n }\n else if (this.parent.getPrimaryKeyFieldNames().length > 0) {\n gobj.isPersistSelection = false;\n this.ensureCheckboxFieldSelection();\n }\n else {\n gobj.isPersistSelection = false;\n this.selectedRowState = {};\n }\n };\n Selection.prototype.ensureCheckboxFieldSelection = function () {\n var gobj = this.parent;\n this.primaryKey = this.parent.getPrimaryKeyFieldNames()[0];\n if (!gobj.enableVirtualization && this.chkField\n && ((gobj.isPersistSelection && Object.keys(this.selectedRowState).length === 0) ||\n !gobj.isPersistSelection)) {\n var data = this.parent.getDataModule();\n var query = new Query().where(this.chkField, 'equal', true);\n if (!query.params) {\n query.params = this.parent.query.params;\n }\n var dataManager = data.getData({}, query);\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var proxy_1 = this;\n this.parent.showSpinner();\n dataManager.then(function (e) {\n proxy_1.dataSuccess(e.result);\n proxy_1.refreshPersistSelection();\n proxy_1.parent.hideSpinner();\n });\n }\n };\n Selection.prototype.dataSuccess = function (res) {\n var data = (this.parent.getDataModule().isRemote() && !isNullOrUndefined(res['result'])) ? res['result'] : res;\n for (var i = 0; i < data.length; i++) {\n var pkValue = this.getPkValue(this.primaryKey, data[parseInt(i.toString(), 10)]);\n if (isNullOrUndefined(this.selectedRowState[\"\" + pkValue]) && data[parseInt(i.toString(), 10)][this.chkField]) {\n this.selectedRowState[\"\" + pkValue] = data[parseInt(i.toString(), 10)][this.chkField];\n }\n }\n this.persistSelectedData = data;\n };\n Selection.prototype.setRowSelection = function (state) {\n if (!(this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result))) {\n if (state) {\n if (this.isPartialSelection && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {\n var rowObj = this.parent.getRowsObject().filter(function (e) { return e.isSelectable; });\n for (var _i = 0, rowObj_1 = rowObj; _i < rowObj_1.length; _i++) {\n var row = rowObj_1[_i];\n this.selectedRowState[this.getPkValue(this.primaryKey, row.data)] = true;\n }\n }\n else {\n var selectedData = this.isPartialSelection ? this.parent.partialSelectedRecords : this.getData();\n if (this.parent.groupSettings.columns.length) {\n for (var _a = 0, _b = this.isPartialSelection ? selectedData : selectedData.records; _a < _b.length; _a++) {\n var data = _b[_a];\n this.selectedRowState[this.getPkValue(this.primaryKey, data)] = true;\n }\n }\n else {\n for (var _c = 0, selectedData_1 = selectedData; _c < selectedData_1.length; _c++) {\n var data = selectedData_1[_c];\n this.selectedRowState[this.getPkValue(this.primaryKey, data)] = true;\n }\n }\n }\n }\n else {\n this.selectedRowState = {};\n }\n // (this.getData()).forEach(function (data) {\n // this.selectedRowState[data[this.primaryKey]] = true;\n // })\n }\n else {\n if (state) {\n var selectedStateKeys = Object.keys(this.selectedRowState);\n var unSelectedRowStateKeys = Object.keys(this.unSelectedRowState);\n if (!this.isCheckboxReset) {\n var rowData = (this.parent.groupSettings.columns.length && this.parent.isPersistSelection) ?\n this.parent.currentViewData['records'] : this.parent.currentViewData;\n for (var _d = 0, rowData_1 = rowData; _d < rowData_1.length; _d++) {\n var data = rowData_1[_d];\n if (!isNullOrUndefined(data[this.primaryKey])) {\n var key = data[this.primaryKey].toString();\n if (selectedStateKeys.indexOf(key) === -1 && unSelectedRowStateKeys.indexOf(key) === -1) {\n this.selectedRowState[data[this.primaryKey]] = true;\n }\n }\n }\n }\n }\n else {\n this.selectedRowState = {};\n this.unSelectedRowState = {};\n this.rmtHdrChkbxClicked = false;\n }\n }\n };\n Selection.prototype.getData = function () {\n return this.parent.getDataModule().dataManager.executeLocal(this.parent.getDataModule().generateQuery(true));\n };\n Selection.prototype.getAvailableSelectedData = function () {\n var filteredSearchedSelectedData = new DataManager(this.persistSelectedData).executeLocal(this.parent.getDataModule().generateQuery(true));\n if (this.parent.groupSettings.columns.length && filteredSearchedSelectedData &&\n filteredSearchedSelectedData.records) {\n filteredSearchedSelectedData = filteredSearchedSelectedData.records.slice();\n }\n return filteredSearchedSelectedData;\n };\n Selection.prototype.refreshPersistSelection = function () {\n var rows = this.parent.getRows();\n this.totalRecordsCount = this.parent.getCurrentViewRecords().length;\n if (this.parent.allowPaging) {\n this.totalRecordsCount = this.parent.pageSettings.totalRecordsCount;\n }\n if (!isNullOrUndefined(rows) && rows.length > 0 && (this.parent.isPersistSelection || this.chkField)) {\n var indexes = [];\n for (var j = 0; j < rows.length; j++) {\n var rowObj = this.getRowObj(rows[parseInt(j.toString(), 10)]);\n var pKey = rowObj ? rowObj.data ? this.getPkValue(this.primaryKey, rowObj.data) : null : null;\n if (pKey === null) {\n return;\n }\n if (this.isPartialSelection && !rowObj.isSelectable) {\n continue;\n }\n var checkState = void 0;\n var chkBox = rows[parseInt(j.toString(), 10)].querySelector('.e-checkselect');\n if (this.selectedRowState[\"\" + pKey] || (this.parent.checkAllRows === 'Check' && this.selectedRowState[\"\" + pKey] &&\n this.totalRecordsCount === Object.keys(this.selectedRowState).length && this.chkAllCollec.indexOf(pKey) < 0)\n || (this.parent.checkAllRows === 'Uncheck' && this.chkAllCollec.indexOf(pKey) > 0 && !this.parent.selectedRowIndex)\n || (this.parent.checkAllRows === 'Intermediate' && !isNullOrUndefined(this.chkField) && rowObj.data[this.chkField])) {\n indexes.push(parseInt(rows[parseInt(j.toString(), 10)].getAttribute(literals.dataRowIndex), 10));\n checkState = true;\n }\n else {\n checkState = false;\n if (this.checkedTarget !== chkBox && this.parent.isCheckBoxSelection && chkBox) {\n removeAddCboxClasses(chkBox.nextElementSibling, checkState);\n }\n }\n this.updatePersistCollection(rows[parseInt(j.toString(), 10)], checkState);\n }\n if (this.isSingleSel() && indexes.length > 0) {\n this.selectRow(indexes[0], true);\n }\n else {\n this.selectRows(indexes);\n }\n }\n if ((this.parent.isCheckBoxSelection || this.parent.selectionSettings.checkboxMode === 'ResetOnRowClick') && this.getCurrentBatchRecordChanges().length > 0) {\n this.setCheckAllState();\n }\n };\n Selection.prototype.actionBegin = function (e) {\n if (e.requestType === 'save' && this.parent.isPersistSelection) {\n var editChkBox = this.parent.element.querySelector('.e-edit-checkselect');\n if (!isNullOrUndefined(editChkBox)) {\n var row = closest(editChkBox, '.' + literals.editedRow);\n if (row) {\n if (this.parent.editSettings.mode === 'Dialog') {\n row = this.parent.element.querySelector('.e-dlgeditrow');\n }\n var rowObj = this.getRowObj(row);\n if (!rowObj) {\n return;\n }\n this.selectedRowState[this.getPkValue(this.primaryKey, rowObj.data)] = rowObj.isSelected = editChkBox.checked;\n }\n else {\n this.isCheckedOnAdd = editChkBox.checked;\n }\n }\n }\n if (this.parent.isPersistSelection && this.isPartialSelection) {\n if (e.requestType === 'paging' && (this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result))) {\n this.selectedRowIndexes = [];\n }\n if (e.requestType === 'filtering' || e.requestType === 'searching') {\n this.parent.partialSelectedRecords = [];\n this.parent.disableSelectedRecords = [];\n }\n }\n };\n Selection.prototype.actionComplete = function (e) {\n if (e.requestType === 'save' && this.parent.isPersistSelection) {\n if (e.action === 'add') {\n if (this.isCheckedOnAdd) {\n var rowObj = this.parent.getRowObjectFromUID(this.parent.getRows()[e.selectedRow].getAttribute('data-uid'));\n this.selectedRowState[this.getPkValue(this.primaryKey, rowObj.data)] = rowObj.isSelected = this.isCheckedOnAdd;\n }\n this.isHdrSelectAllClicked = false;\n this.setCheckAllState();\n }\n this.refreshPersistSelection();\n }\n if (e.requestType === 'delete' && this.parent.isPersistSelection) {\n var records = e.data;\n var data = records.slice();\n for (var i = 0; i < data.length; i++) {\n var pkValue = this.getPkValue(this.primaryKey, data[parseInt(i.toString(), 10)]);\n if (!isNullOrUndefined(pkValue)) {\n this.updatePersistDelete(pkValue, this.isPartialSelection);\n }\n }\n this.isHdrSelectAllClicked = false;\n this.setCheckAllState();\n this.totalRecordsCount = this.parent.pageSettings.totalRecordsCount;\n }\n if (e.requestType === 'paging') {\n if (this.parent.isPersistSelection && this.isPartialSelection && this.isHdrSelectAllClicked) {\n var rows = this.parent.getRowsObject();\n var indexes = [];\n for (var i = 0; i < rows.length; i++) {\n if (rows[parseInt(i.toString(), 10)].isSelectable) {\n indexes.push(rows[parseInt(i.toString(), 10)].index);\n }\n }\n if (indexes.length) {\n this.selectRows(indexes);\n }\n }\n this.prevRowIndex = undefined;\n this.prevCIdxs = undefined;\n this.prevECIdxs = undefined;\n }\n };\n Selection.prototype.onDataBound = function () {\n if (!this.parent.enableVirtualization && this.parent.isPersistSelection) {\n if (this.selectedRecords.length) {\n this.isPrevRowSelection = true;\n }\n }\n if ((this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result)) && this.rmtHdrChkbxClicked) {\n if (this.parent.checkAllRows === 'Intermediate') {\n this.setRowSelection(true);\n }\n else if (this.parent.checkAllRows === 'Uncheck') {\n this.setRowSelection(false);\n }\n }\n if (this.parent.enableVirtualization) {\n this.setCheckAllState();\n }\n if (this.parent.isPersistSelection) {\n this.refreshPersistSelection();\n }\n this.initialRowSelection = this.isRowType() && this.parent.element.querySelectorAll('.e-selectionbackground') &&\n this.parent.getSelectedRows().length ? true : false;\n if (this.parent.isCheckBoxSelection && !this.initialRowSelection) {\n var totalRecords = this.parent.getRowsObject();\n var indexes = [];\n for (var i = 0; i < totalRecords.length; i++) {\n if (totalRecords[parseInt(i.toString(), 10)].isSelected) {\n indexes.push(i);\n }\n }\n if (indexes.length) {\n this.selectRows(indexes);\n }\n this.initialRowSelection = true;\n }\n };\n Selection.prototype.updatePersistSelectedData = function (checkState) {\n if (this.parent.isPersistSelection) {\n var rows = this.parent.getRows();\n for (var i = 0; i < rows.length; i++) {\n this.updatePersistCollection(rows[parseInt(i.toString(), 10)], checkState);\n }\n if (this.parent.checkAllRows === 'Uncheck') {\n this.setRowSelection(false);\n this.persistSelectedData = (this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result))\n ? this.persistSelectedData : [];\n }\n else if (this.parent.checkAllRows === 'Check') {\n this.setRowSelection(true);\n this.persistSelectedData = !(this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result))\n && !this.isPartialSelection ?\n this.parent.groupSettings.columns.length ? this.getData().records.slice() :\n this.getData().slice() : this.persistSelectedData;\n }\n }\n };\n Selection.prototype.checkSelectAllAction = function (checkState) {\n var cRenderer = this.getRenderer();\n var editForm = this.parent.element.querySelector('.e-gridform');\n this.checkedTarget = this.getCheckAllBox();\n if (checkState && this.getCurrentBatchRecordChanges().length) {\n this.parent.checkAllRows = 'Check';\n this.updatePersistSelectedData(checkState);\n this.selectRowsByRange(cRenderer.getVirtualRowIndex(0), cRenderer.getVirtualRowIndex(this.getCurrentBatchRecordChanges().length - 1));\n }\n else {\n this.parent.checkAllRows = 'Uncheck';\n this.updatePersistSelectedData(checkState);\n this.clearSelection();\n }\n this.chkAllCollec = [];\n if (!isNullOrUndefined(editForm)) {\n var editChkBox = editForm.querySelector('.e-edit-checkselect');\n if (!isNullOrUndefined(editChkBox)) {\n removeAddCboxClasses(editChkBox.nextElementSibling, checkState);\n }\n }\n };\n Selection.prototype.checkSelectAll = function (checkBox) {\n var _this = this;\n var stateStr = this.getCheckAllStatus(checkBox);\n var state = stateStr === 'Check';\n this.isHeaderCheckboxClicked = true;\n if ((this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result)) && ((stateStr === 'Uncheck' || this.isCheckboxReset) ||\n (stateStr === 'Intermediate' && this.parent.isPersistSelection))) {\n this.rmtHdrChkbxClicked = true;\n }\n else {\n this.rmtHdrChkbxClicked = false;\n }\n if (this.rmtHdrChkbxClicked && this.isCheckboxReset) {\n this.unSelectedRowState = {};\n }\n this.isCheckboxReset = false;\n if (stateStr === 'Intermediate') {\n if (!this.chkField && !this.parent.isPersistSelection) {\n state = this.getCurrentBatchRecordChanges().some(function (data) {\n return _this.getPkValue(_this.primaryKey, data) in _this.selectedRowState;\n });\n }\n if ((this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result)) && this.parent.isPersistSelection) {\n for (var i = 0; i < this.getCurrentBatchRecordChanges().length; i++) {\n if (!isNullOrUndefined(this.getPkValue(this.primaryKey, this.getCurrentBatchRecordChanges()[\"\" + i]))) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (Object.keys(this.selectedRowState).includes((this.getPkValue(this.primaryKey, this.getCurrentBatchRecordChanges()[\"\" + i])).toString())) {\n state = true;\n }\n else {\n state = false;\n break;\n }\n }\n }\n }\n }\n if (this.parent.isPersistSelection && this.parent.allowPaging) {\n this.totalRecordsCount = this.parent.pageSettings.totalRecordsCount;\n }\n this.checkSelectAllAction(!state);\n this.target = null;\n if (this.getCurrentBatchRecordChanges().length > 0) {\n this.setCheckAllState();\n this.updateSelectedRowIndexes();\n }\n this.triggerChkChangeEvent(checkBox, !state);\n };\n Selection.prototype.getCheckAllStatus = function (ele) {\n var classes = ele ? ele.nextElementSibling.classList :\n this.getCheckAllBox().nextElementSibling.classList;\n var status;\n if (classes.contains('e-check')) {\n status = 'Check';\n }\n else if (classes.contains('e-uncheck')) {\n status = 'Uncheck';\n }\n else if (classes.contains('e-stop')) {\n status = 'Intermediate';\n }\n else {\n status = 'None';\n }\n return status;\n };\n Selection.prototype.checkSelect = function (checkBox) {\n var target = closest(this.checkedTarget, '.' + literals.rowCell);\n var gObj = this.parent;\n this.isMultiCtrlRequest = true;\n var rIndex = 0;\n this.isHeaderCheckboxClicked = false;\n if (isGroupAdaptive(gObj)) {\n var uid = target.parentElement.getAttribute('data-uid');\n if (this.parent.enableVirtualization && this.parent.groupSettings.columns.length) {\n rIndex = parseInt(target.parentElement.getAttribute(literals.dataRowIndex), 10);\n }\n else {\n rIndex = gObj.getRows().map(function (m) { return m.getAttribute('data-uid'); }).indexOf(uid);\n }\n }\n else {\n rIndex = parseInt(target.parentElement.getAttribute(literals.dataRowIndex), 10);\n }\n if (this.parent.isPersistSelection && this.parent.element.getElementsByClassName(literals.addedRow).length > 0 &&\n this.parent.editSettings.newRowPosition === 'Top' && !this.parent.editSettings.showAddNewRow) {\n ++rIndex;\n }\n this.rowCellSelectionHandler(rIndex, parseInt(target.getAttribute(literals.dataColIndex), 10));\n this.moveIntoUncheckCollection(closest(target, '.' + literals.row));\n this.setCheckAllState();\n this.isMultiCtrlRequest = false;\n this.triggerChkChangeEvent(checkBox, checkBox.nextElementSibling.classList.contains('e-check'));\n };\n Selection.prototype.moveIntoUncheckCollection = function (row) {\n if (this.parent.checkAllRows === 'Check' || this.parent.checkAllRows === 'Uncheck') {\n var rowObj = this.getRowObj(row);\n var pKey = rowObj && rowObj.data ? this.getPkValue(this.primaryKey, rowObj.data) : null;\n if (!pKey) {\n return;\n }\n if (this.chkAllCollec.indexOf(pKey) < 0) {\n this.chkAllCollec.push(pKey);\n }\n else {\n this.chkAllCollec.splice(this.chkAllCollec.indexOf(pKey), 1);\n }\n }\n };\n Selection.prototype.triggerChkChangeEvent = function (checkBox, checkState) {\n this.parent.trigger(events.checkBoxChange, {\n checked: checkState, selectedRowIndexes: this.parent.getSelectedRowIndexes(),\n target: checkBox\n });\n if (!this.parent.isEdit) {\n this.checkedTarget = null;\n }\n };\n Selection.prototype.updateSelectedRowIndexes = function () {\n if (this.parent.isCheckBoxSelection && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling) &&\n this.isPartialSelection && !(this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result))\n && this.parent.selectionSettings.persistSelection) {\n if (this.parent.checkAllRows !== 'Uncheck') {\n var rowObj = this.parent.getRowsObject().filter(function (e) { return e.isSelectable; });\n for (var _i = 0, rowObj_2 = rowObj; _i < rowObj_2.length; _i++) {\n var row = rowObj_2[_i];\n this.selectedRowIndexes.push(row.index);\n }\n }\n }\n if (this.parent.isCheckBoxSelection && this.parent.enableVirtualization && !this.isPartialSelection &&\n (this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result))\n && !this.parent.isPersistSelection && this.parent.checkAllRows === 'Check') {\n var rowObj = this.parent.getRowsObject().filter(function (e) { return e.isSelectable; });\n if (rowObj.length !== this.selectedRowIndexes.length) {\n for (var _a = 0, rowObj_3 = rowObj; _a < rowObj_3.length; _a++) {\n var row = rowObj_3[_a];\n if (this.selectedRowIndexes.indexOf(row.index) <= -1) {\n this.selectedRowIndexes.push(row.index);\n }\n }\n }\n }\n };\n Selection.prototype.updateSelectedRowIndex = function (index) {\n if (this.parent.isCheckBoxSelection && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)\n && !(this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result))\n && !this.isPartialSelection) {\n if (this.parent.checkAllRows === 'Check') {\n this.selectedRowIndexes = [];\n var dataLength = this.parent.groupSettings.columns.length ? this.getData()['records'].length :\n this.getData().length;\n for (var data = 0; data < dataLength; data++) {\n this.selectedRowIndexes.push(data);\n }\n }\n else if (this.parent.checkAllRows === 'Uncheck') {\n this.selectedRowIndexes = [];\n }\n else {\n var row = this.parent.getRowByIndex(index);\n if (index && row && row.getAttribute('aria-selected') === 'false') {\n var selectedVal = this.selectedRowIndexes.indexOf(index);\n this.selectedRowIndexes.splice(selectedVal, 1);\n }\n }\n }\n };\n Selection.prototype.isAllSelected = function (count) {\n if (this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result)) {\n return this.getAvailableSelectedData().length === (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling\n ? this.parent.totalDataRecordsCount : this.totalRecordsCount);\n }\n else {\n if (this.isPartialSelection) {\n if (this.parent.allowPaging && this.parent.pageSettings.pageSize < this.parent.pageSettings.totalRecordsCount) {\n var data = this.parent.partialSelectedRecords;\n for (var i = 0; i < data.length; i++) {\n var pKey = this.getPkValue(this.primaryKey, data[parseInt(i.toString(), 10)]);\n if (!this.selectedRowState[\"\" + pKey]) {\n return false;\n }\n }\n return true;\n }\n else {\n return this.isSelectAllRowCount(count);\n }\n }\n else {\n var data = (this.parent.groupSettings.columns.length) ? this.getData()['records'] : this.getData();\n for (var i = 0; i < data.length; i++) {\n var pKey = this.getPkValue(this.primaryKey, data[parseInt(i.toString(), 10)]);\n if (!this.selectedRowState[\"\" + pKey]) {\n return false;\n }\n }\n return true;\n }\n }\n };\n Selection.prototype.someDataSelected = function () {\n if ((this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result))\n && (this.parent.searchSettings.key.length || this.parent.filterSettings.columns.length)) {\n var filteredSearchedSelectedData = this.getAvailableSelectedData();\n for (var i = 0; i < filteredSearchedSelectedData.length; i++) {\n var pKey = this.getPkValue(this.primaryKey, filteredSearchedSelectedData[parseInt(i.toString(), 10)]);\n if (this.selectedRowState[\"\" + pKey]) {\n return false;\n }\n }\n }\n var data = this.isPartialSelection ? this.parent.partialSelectedRecords\n : (this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result)) ? [] : this.getData();\n for (var i = 0; i < data.length; i++) {\n var pKey = this.getPkValue(this.primaryKey, data[parseInt(i.toString(), 10)]);\n if (this.selectedRowState[\"\" + pKey]) {\n return false;\n }\n }\n return true;\n };\n Selection.prototype.setCheckAllState = function (index, isInteraction) {\n if (this.parent.isCheckBoxSelection || this.parent.selectionSettings.checkboxMode === 'ResetOnRowClick') {\n var checkToSelectAll = false;\n var isFiltered = false;\n var checkedLen = Object.keys(this.selectedRowState).length;\n if (!this.parent.isPersistSelection) {\n checkedLen = this.selectedRowIndexes.length;\n this.totalRecordsCount = this.getCurrentBatchRecordChanges().length;\n }\n if (this.parent.isPersistSelection && !((this.parent.getDataModule().isRemote() ||\n (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result)) &&\n this.isPartialSelection)\n && (this.parent.searchSettings.key.length || this.parent.filterSettings.columns.length)) {\n isFiltered = true;\n checkToSelectAll = this.isAllSelected(checkedLen);\n }\n var input = this.getCheckAllBox();\n if (input) {\n var spanEle = input.nextElementSibling;\n removeClass([spanEle], ['e-check', 'e-stop', 'e-uncheck']);\n setChecked(input, false);\n input.indeterminate = false;\n var getRecord = this.parent.getDataModule().isRemote() ? [] :\n (this.parent.groupSettings.columns.length) ? this.getData()['records'] : this.getData();\n if ((checkToSelectAll && isFiltered && (this.parent.getDataModule().isRemote() ||\n (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result) ||\n getRecord.length)) || (!isFiltered && ((checkedLen === this.totalRecordsCount && this.totalRecordsCount\n && !this.isPartialSelection && (!(this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result))\n || this.parent.allowPaging)) ||\n (!this.parent.enableVirtualization && !this.parent.enableInfiniteScrolling\n && this.isPartialSelection && (this.isSelectAllRowCount(checkedLen) || this.isHdrSelectAllClicked))\n || ((this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)\n && !this.parent.allowPaging && ((!(this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result)) &&\n getRecord.length && checkedLen === getRecord.length) || ((this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result)) &&\n !this.isPartialSelection && ((checkedLen === this.parent.totalDataRecordsCount) || ((this.\n isSelectAllRowCount(checkedLen) || checkedLen === this.totalRecordsCount) && !this.parent.isPersistSelection))) ||\n (this.isPartialSelection && (this.isHdrSelectAllClicked || this.isSelectAllRowCount(checkedLen)))))\n || (checkedLen === this.totalRecordsCount && this.totalRecordsCount && !this.isPartialSelection &&\n !this.parent.allowPaging && !this.parent.enableVirtualization && !this.parent.enableInfiniteScrolling)))) {\n addClass([spanEle], ['e-check']);\n setChecked(input, true);\n if (isInteraction) {\n this.getRenderer().setSelection(null, true, true);\n }\n this.parent.checkAllRows = 'Check';\n }\n else if (((!this.selectedRowIndexes.length && (!this.parent.enableVirtualization ||\n (!this.persistSelectedData.length && !isFiltered) || (isFiltered && this.someDataSelected())) ||\n checkedLen === 0 && this.getCurrentBatchRecordChanges().length === 0) && !this.parent.allowPaging) ||\n (this.parent.allowPaging && (checkedLen === 0 || (checkedLen && isFiltered && this.someDataSelected())))) {\n addClass([spanEle], ['e-uncheck']);\n if (isInteraction) {\n this.getRenderer().setSelection(null, false, true);\n }\n this.parent.checkAllRows = 'Uncheck';\n }\n else {\n addClass([spanEle], ['e-stop']);\n this.parent.checkAllRows = 'Intermediate';\n input.indeterminate = true;\n }\n if (checkedLen === 0 && this.getCurrentBatchRecordChanges().length === 0) {\n addClass([spanEle.parentElement], ['e-checkbox-disabled']);\n }\n else {\n removeClass([spanEle.parentElement], ['e-checkbox-disabled']);\n }\n if (this.isPartialSelection) {\n var rowCount = this.parent.getRowsObject().filter(function (e) { return e.isSelectable; }).length;\n if (rowCount === 0 && spanEle.parentElement.querySelector('.e-frame').classList.contains('e-uncheck')) {\n addClass([spanEle.parentElement], ['e-checkbox-disabled']);\n }\n else {\n removeClass([spanEle.parentElement], ['e-checkbox-disabled']);\n }\n }\n if ((this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)\n && !this.parent.allowPaging && !(this.parent.getDataModule().isRemote()\n || (!isNullOrUndefined(this.parent.dataSource) && this.parent.dataSource.result))) {\n this.updateSelectedRowIndex(index);\n }\n }\n }\n };\n Selection.prototype.isSelectAllRowCount = function (count) {\n var rowCount = 0;\n var rowObj = this.parent.getRowsObject();\n if (this.parent.selectionSettings.persistSelection && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {\n var dataLen = (this.parent.getDataModule().isRemote() || (!isNullOrUndefined(this.parent.dataSource)\n && this.parent.dataSource.result)) ?\n this.parent.totalDataRecordsCount : this.getData() && this.getData().length;\n if (dataLen === rowObj.length) {\n rowCount = rowObj.filter(function (e) { return e.isSelectable; }).length;\n return rowCount && count === rowCount;\n }\n else {\n return false;\n }\n }\n else {\n if (this.parent.allowPaging && this.parent.selectionSettings.persistSelection) {\n rowCount = this.parent.partialSelectedRecords.length + this.parent.disableSelectedRecords.length;\n if (rowCount === this.totalRecordsCount) {\n return this.parent.partialSelectedRecords.length && count === this.parent.partialSelectedRecords.length;\n }\n else {\n return false;\n }\n }\n else {\n rowCount = rowObj.filter(function (e) { return e.isSelectable; }).length;\n return rowCount && count === rowCount;\n }\n }\n };\n Selection.prototype.keyDownHandler = function (e) {\n // Below are keyCode for command key in MAC OS. Safari/Chrome(91-Left command, 93-Right Command), Opera(17), FireFox(224)\n if ((((Browser.info.name === 'chrome') || (Browser.info.name === 'safari')) && (e.keyCode === 91 || e.keyCode === 93)) ||\n (Browser.info.name === 'opera' && e.keyCode === 17) || (Browser.info.name === 'mozilla' && e.keyCode === 224)) {\n this.cmdKeyPressed = true;\n }\n var targetHeadCell = parentsUntil(e.target, 'e-headercell');\n var targetRowCell = parentsUntil(e.target, literals.rowCell);\n var isCheckBox = targetHeadCell ? targetHeadCell.children[0].classList.contains('e-headerchkcelldiv') :\n targetRowCell ? targetRowCell.classList.contains('e-gridchkbox') : false;\n if (isCheckBox && !this.parent.allowKeyboard && e.keyCode === 32) {\n e.preventDefault();\n }\n };\n Selection.prototype.keyUpHandler = function (e) {\n if ((((Browser.info.name === 'chrome') || (Browser.info.name === 'safari')) && (e.keyCode === 91 || e.keyCode === 93)) ||\n (Browser.info.name === 'opera' && e.keyCode === 17) || (Browser.info.name === 'mozilla' && e.keyCode === 224)) {\n this.cmdKeyPressed = false;\n }\n };\n Selection.prototype.clickHandler = function (e) {\n var target = e.target;\n this.actualTarget = target;\n if (!this.isAutoFillSel && !e.ctrlKey && !e.shiftKey) {\n this.startAFCell = this.endAFCell = null;\n }\n if (this.selectionSettings.persistSelection) {\n this.deSelectedData = iterateExtend(this.persistSelectedData);\n }\n if (parentsUntil(target, literals.row) || parentsUntil(target, 'e-headerchkcelldiv') ||\n (this.selectionSettings.allowColumnSelection && target.classList.contains('e-headercell'))) {\n this.isInteracted = true;\n }\n this.cmdKeyPressed = e.metaKey;\n this.isMultiCtrlRequest = e.ctrlKey || this.enableSelectMultiTouch ||\n (this.isMacOS && this.cmdKeyPressed);\n if (!this.parent.allowKeyboard) {\n this.isMultiShiftRequest = false;\n this.isMultiCtrlRequest = false;\n }\n else {\n this.isMultiShiftRequest = e.shiftKey;\n }\n this.isMultiCtrlRequestCell = this.isMultiCtrlRequest;\n this.popUpClickHandler(e);\n var chkSelect = false;\n this.preventFocus = true;\n var checkBox;\n var checkWrap = parentsUntil(target, 'e-checkbox-wrapper');\n this.checkSelectAllClicked = checkWrap && checkWrap.getElementsByClassName('e-checkselectall') ||\n (this.selectionSettings.persistSelection && parentsUntil(target, literals.row)) ? true : false;\n if (this.selectionSettings.persistSelection && this.isPartialSelection && parentsUntil(target, 'e-headerchkcelldiv')\n && !target.querySelector('.e-checkbox-disabled')) {\n this.isHdrSelectAllClicked = true;\n }\n if (checkWrap && checkWrap.querySelectorAll('.e-checkselect,.e-checkselectall').length > 0) {\n checkBox = checkWrap.querySelector('input[type=\"checkbox\"]');\n chkSelect = true;\n }\n this.drawBorders();\n this.updateAutoFillPosition();\n target = parentsUntil(target, literals.rowCell);\n if (this.parent.isReact && (target && !target.parentElement && target.classList.contains('e-rowcell'))) {\n target = this.parent.getCellFromIndex(parseInt(target.getAttribute('index'), 10), parseInt(target.getAttribute('data-colindex'), 10));\n }\n if (this.isRowDragSelected && isNullOrUndefined(target) && this.parent.allowRowDragAndDrop &&\n this.selectionSettings.persistSelection && this.checkSelectAllClicked) {\n this.isRowDragSelected = false;\n }\n if (((target && target.parentElement.classList.contains(literals.row) && !this.parent.selectionSettings.checkboxOnly) || chkSelect)\n && !this.isRowDragSelected) {\n if (this.parent.isCheckBoxSelection) {\n this.isMultiCtrlRequest = true;\n }\n this.target = target;\n if (!isNullOrUndefined(checkBox)) {\n this.checkedTarget = checkBox;\n if (checkBox.classList.contains('e-checkselectall')) {\n this.checkSelectAll(checkBox);\n }\n else {\n this.checkSelect(checkBox);\n }\n }\n else {\n var rIndex = 0;\n rIndex = parseInt(target.parentElement.getAttribute(literals.dataRowIndex), 10);\n if (this.parent.isPersistSelection && !this.parent.editSettings.showAddNewRow\n && this.parent.element.getElementsByClassName(literals.addedRow).length > 0) {\n ++rIndex;\n }\n if (!this.mUPTarget || !this.mUPTarget.isEqualNode(target)) {\n this.rowCellSelectionHandler(rIndex, parseInt(target.getAttribute(literals.dataColIndex), 10));\n }\n if (this.parent.isCheckBoxSelection) {\n this.moveIntoUncheckCollection(closest(target, '.' + literals.row));\n this.setCheckAllState();\n }\n }\n if (!this.parent.isCheckBoxSelection && Browser.isDevice && !this.isSingleSel()) {\n this.showPopup(e);\n }\n }\n else if (e.target.classList.contains('e-headercell') &&\n !e.target.classList.contains('e-stackedheadercell')) {\n var uid = e.target.querySelector('.e-headercelldiv').getAttribute('e-mappinguid');\n this.headerSelectionHandler(this.parent.getColumnIndexByUid(uid));\n }\n this.isMultiCtrlRequest = false;\n this.isMultiCtrlRequestCell = this.isMultiCtrlRequest;\n this.isMultiShiftRequest = false;\n if (isNullOrUndefined(closest(e.target, '.e-unboundcell'))) {\n this.preventFocus = false;\n }\n };\n Selection.prototype.popUpClickHandler = function (e) {\n var target = e.target;\n if (closest(target, '.e-headercell') || e.target.classList.contains(literals.rowCell) ||\n closest(target, '.e-gridpopup')) {\n if (target.classList.contains('e-rowselect')) {\n if (!target.classList.contains('e-spanclicked')) {\n target.classList.add('e-spanclicked');\n this.enableSelectMultiTouch = true;\n }\n else {\n target.classList.remove('e-spanclicked');\n this.enableSelectMultiTouch = false;\n this.parent.element.querySelector('.e-gridpopup').style.display = 'none';\n }\n }\n }\n else {\n this.parent.element.querySelector('.e-gridpopup').style.display = 'none';\n }\n };\n Selection.prototype.showPopup = function (e) {\n if (!this.selectionSettings.enableSimpleMultiRowSelection) {\n setCssInGridPopUp(this.parent.element.querySelector('.e-gridpopup'), e, 'e-rowselect e-icons e-icon-rowselect' +\n (!this.isSingleSel() && (this.selectedRecords.length > 1\n || this.selectedRowCellIndexes.length > 1) ? ' e-spanclicked' : ''));\n }\n };\n Selection.prototype.rowCellSelectionHandler = function (rowIndex, cellIndex) {\n if ((!this.isMultiCtrlRequest && !this.isMultiShiftRequest) || this.isSingleSel()) {\n if (!this.isDragged) {\n this.selectRow(rowIndex, this.selectionSettings.enableToggle);\n }\n this.selectCell({ rowIndex: rowIndex, cellIndex: cellIndex }, this.selectionSettings.enableToggle);\n if (this.selectedRowCellIndexes.length) {\n this.updateAutoFillPosition();\n }\n this.drawBorders();\n }\n else if (this.isMultiShiftRequest) {\n if (this.parent.isCheckBoxSelection || (!this.parent.isCheckBoxSelection &&\n !closest(this.target, '.' + literals.rowCell).classList.contains(literals.gridChkBox))) {\n this.selectRowsByRange(isUndefined(this.prevRowIndex) ? rowIndex : this.prevRowIndex, rowIndex);\n }\n else {\n this.addRowsToSelection([rowIndex]);\n }\n this.selectCellsByRange(isUndefined(this.prevCIdxs) ? { rowIndex: rowIndex, cellIndex: cellIndex } : this.prevCIdxs, { rowIndex: rowIndex, cellIndex: cellIndex });\n this.updateAutoFillPosition();\n this.drawBorders();\n }\n else {\n this.addRowsToSelection([rowIndex]);\n if (this.selectionSettings.mode === 'Both') {\n var checkboxColumn = this.parent.getColumns().find(function (col) { return col.type === 'checkbox'; });\n var checkboxColumnIndexCheck = checkboxColumn && checkboxColumn.index !== cellIndex;\n if (checkboxColumnIndexCheck && !this.isMultiCtrlRequestCell) {\n this.selectCell({ rowIndex: rowIndex, cellIndex: cellIndex }, this.selectionSettings.enableToggle);\n }\n else if (!checkboxColumn || checkboxColumnIndexCheck) {\n this.addCellsToSelection([{ rowIndex: rowIndex, cellIndex: cellIndex }]);\n }\n }\n else {\n this.addCellsToSelection([{ rowIndex: rowIndex, cellIndex: cellIndex }]);\n }\n this.showHideBorders('none');\n }\n this.isDragged = false;\n };\n Selection.prototype.onCellFocused = function (e) {\n if (this.parent.frozenRows && e.container.isHeader && e.byKey) {\n if (e.keyArgs.action === 'upArrow') {\n if (this.parent.allowFiltering) {\n e.isJump = e.element.tagName === 'INPUT' ? true : false;\n }\n else {\n e.isJump = e.element.tagName === 'TH' ? true : false;\n }\n }\n else {\n if (e.keyArgs.action === 'downArrow') {\n var rIdx = Number(e.element.parentElement.getAttribute(literals.dataRowIndex));\n e.isJump = rIdx === 0 ? true : false;\n }\n else {\n if (e.keyArgs.action === 'ctrlHome') {\n e.isJump = true;\n }\n }\n }\n }\n var clear = ((e.container.isHeader && e.isJump) ||\n (e.container.isContent && !e.container.isSelectable)) && !(e.byKey && e.keyArgs.action === 'space')\n && !(e.element.classList.contains('e-detailrowexpand') || e.element.classList.contains('e-detailrowcollapse'));\n var headerAction = (e.container.isHeader && e.element.tagName !== 'TD' && !closest(e.element, '.' + literals.rowCell))\n && !(e.byKey && e.keyArgs.action === 'space');\n if (!e.byKey || clear) {\n if (clear && !this.parent.isCheckBoxSelection) {\n this.clearSelection();\n }\n return;\n }\n var _a = e.container.isContent ? e.container.indexes : e.indexes, rowIndex = _a[0], cellIndex = _a[1];\n var prev = this.focus.getPrevIndexes();\n if (e.element.parentElement.querySelector('.e-rowcelldrag') || e.element.parentElement.querySelector('.e-dtdiagonalright')\n || e.element.parentElement.querySelector('.e-dtdiagonaldown')) {\n prev.cellIndex = prev.cellIndex - 1;\n }\n if (this.parent.frozenRows) {\n if (e.container.isHeader && (e.element.tagName === 'TD' || closest(e.element, '.' + literals.rowCell))) {\n var hdrLength = this.parent.getHeaderTable().querySelector('thead').childElementCount;\n if (this.parent.editSettings.showAddNewRow && this.parent.editSettings.newRowPosition === 'Top' &&\n e.keyArgs.action === 'upArrow') {\n hdrLength++;\n }\n rowIndex -= hdrLength;\n prev.rowIndex = !isNullOrUndefined(prev.rowIndex) ? prev.rowIndex - hdrLength : null;\n }\n else {\n rowIndex += this.parent.frozenRows;\n prev.rowIndex = prev.rowIndex === 0 || !isNullOrUndefined(prev.rowIndex) ? prev.rowIndex + this.parent.frozenRows : null;\n }\n }\n if (this.parent.enableInfiniteScrolling && this.parent.infiniteScrollSettings.enableCache) {\n rowIndex = parseInt(e.element.parentElement.getAttribute('data-rowindex'), 10);\n }\n if ((headerAction || (['ctrlPlusA', 'escape'].indexOf(e.keyArgs.action) === -1 &&\n e.keyArgs.action !== 'space' && rowIndex === prev.rowIndex && cellIndex === prev.cellIndex)) &&\n !this.selectionSettings.allowColumnSelection) {\n return;\n }\n if (this.parent.editSettings.showAddNewRow && this.parent.editSettings.newRowPosition === 'Top' &&\n (!this.parent.enableVirtualization && !this.parent.enableInfiniteScrolling) && e.keyArgs.action === 'downArrow') {\n rowIndex--;\n }\n this.preventFocus = true;\n var columnIndex = this.getKeyColIndex(e);\n if (this.needColumnSelection) {\n cellIndex = columnIndex;\n }\n if (this.parent.element.classList.contains('e-gridcell-read') && (e.keyArgs.action === 'tab' || e.keyArgs.action === 'shiftTab'\n || e.keyArgs.action === 'rightArrow' || e.keyArgs.action === 'leftArrow')) {\n var targetLabel = this.target.getAttribute('aria-label');\n targetLabel = this.target.innerHTML + ' column header ' + this.parent.getColumnByIndex(cellIndex).field;\n this.target.setAttribute('aria-label', targetLabel);\n }\n switch (e.keyArgs.action) {\n case 'downArrow':\n case 'upArrow':\n case 'enter':\n case 'shiftEnter':\n this.target = e.element;\n this.isKeyAction = true;\n this.applyDownUpKey(rowIndex, cellIndex);\n break;\n case 'rightArrow':\n case 'leftArrow':\n this.applyRightLeftKey(rowIndex, cellIndex);\n break;\n case 'shiftDown':\n case 'shiftUp':\n this.shiftDownKey(rowIndex, cellIndex);\n break;\n case 'shiftLeft':\n case 'shiftRight':\n this.applyShiftLeftRightKey(rowIndex, cellIndex);\n break;\n case 'home':\n case 'end':\n cellIndex = e.keyArgs.action === 'end' ? this.getLastColIndex(rowIndex) : 0;\n this.applyHomeEndKey(rowIndex, cellIndex);\n break;\n case 'ctrlHome':\n case 'ctrlEnd':\n this.applyCtrlHomeEndKey(rowIndex, cellIndex);\n break;\n case 'escape':\n this.clearSelection();\n if (this.parent.clipboardModule) {\n window.navigator['clipboard'].writeText('');\n }\n break;\n case 'ctrlPlusA':\n this.ctrlPlusA();\n break;\n case 'space':\n this.applySpaceSelection(e.element);\n break;\n case 'tab':\n if (this.parent.editSettings.allowNextRowEdit) {\n this.selectRow(rowIndex);\n }\n break;\n }\n this.needColumnSelection = false;\n this.preventFocus = false;\n this.positionBorders();\n if (this.parent.isFrozenGrid()) {\n this.showHideBorders('none', true);\n this.refreshFrozenBorders();\n }\n this.updateAutoFillPosition();\n };\n Selection.prototype.getKeyColIndex = function (e) {\n var uid;\n var index = null;\n var stackedHeader = e.element.querySelector('.e-stackedheadercelldiv');\n if (this.selectionSettings.allowColumnSelection && parentsUntil(e.element, 'e-columnheader')) {\n this.needColumnSelection = e.container.isHeader ? true : false;\n if (stackedHeader) {\n if (e.keyArgs.action === 'rightArrow' || e.keyArgs.action === 'leftArrow') {\n return index;\n }\n uid = stackedHeader.getAttribute('e-mappinguid');\n var innerColumn = this.getstackedColumns(this.parent.getColumnByUid(uid).columns);\n var lastIndex = this.parent.getColumnIndexByUid(innerColumn[innerColumn.length - 1].uid);\n var firstIndex = this.parent.getColumnIndexByUid(innerColumn[0].uid);\n index = this.prevColIndex >= lastIndex ? firstIndex : lastIndex;\n }\n else {\n index = this.parent.getColumnIndexByUid(e.element\n .querySelector('.e-headercelldiv').getAttribute('e-mappinguid'));\n }\n }\n return index;\n };\n /**\n * Apply ctrl + A key selection\n *\n * @returns {void}\n * @hidden\n */\n Selection.prototype.ctrlPlusA = function () {\n if (this.isRowType() && !this.isSingleSel()) {\n this.selectRowsByRange(0, this.getCurrentBatchRecordChanges().length - 1);\n }\n if (this.isCellType() && !this.isSingleSel()) {\n this.selectCellsByRange({ rowIndex: 0, cellIndex: 0 }, { rowIndex: this.parent.getRows().length - 1, cellIndex: this.parent.getColumns().length - 1 });\n }\n };\n Selection.prototype.applySpaceSelection = function (target) {\n if (target.classList.contains('e-checkselectall')) {\n this.checkedTarget = target;\n this.checkSelectAll(this.checkedTarget);\n }\n else {\n if (target.classList.contains('e-checkselect')) {\n this.checkedTarget = target;\n this.checkSelect(this.checkedTarget);\n }\n }\n };\n Selection.prototype.applyDownUpKey = function (rowIndex, cellIndex) {\n var gObj = this.parent;\n if (this.parent.isCheckBoxSelection && this.parent.checkAllRows === 'Check' && !this.selectionSettings.persistSelection &&\n !this.selectionSettings.checkboxOnly) {\n this.checkSelectAllAction(false);\n this.checkedTarget = null;\n }\n if (this.isRowType() && !this.selectionSettings.checkboxOnly) {\n if (this.parent.frozenRows) {\n this.selectRow(rowIndex, true);\n this.applyUpDown(gObj.selectedRowIndex);\n }\n else {\n this.selectRow(rowIndex, true);\n this.applyUpDown(gObj.selectedRowIndex);\n }\n }\n if (this.isCellType()) {\n this.selectCell({ rowIndex: rowIndex, cellIndex: cellIndex }, true);\n }\n if (this.selectionSettings.allowColumnSelection && this.needColumnSelection) {\n this.selectColumn(cellIndex);\n }\n };\n Selection.prototype.applyUpDown = function (rowIndex) {\n if (rowIndex < 0) {\n return;\n }\n if (!this.target) {\n this.target = this.parent.getRows()[0].children[this.parent.groupSettings.columns.length || 0];\n }\n var cIndex = parseInt(this.target.getAttribute(literals.dataColIndex), 10);\n var row = this.contentRenderer.getRowByIndex(rowIndex);\n if (row) {\n this.target = row.getElementsByClassName(literals.rowCell)[parseInt(cIndex.toString(), 10)];\n }\n this.addAttribute(this.target);\n if (this.parent.element.classList.contains('e-gridcell-read')) {\n var targetLabel = this.target.getAttribute('aria-label');\n targetLabel = this.target.innerHTML;\n this.target.setAttribute('aria-label', targetLabel);\n }\n };\n Selection.prototype.applyRightLeftKey = function (rowIndex, cellIndex) {\n if (this.selectionSettings.allowColumnSelection && this.needColumnSelection) {\n this.selectColumn(cellIndex);\n }\n else if (this.isCellType()) {\n this.selectCell({ rowIndex: rowIndex, cellIndex: cellIndex }, true);\n this.addAttribute(this.target);\n }\n };\n Selection.prototype.applyHomeEndKey = function (rowIndex, cellIndex) {\n if (this.isCellType()) {\n this.selectCell({ rowIndex: rowIndex, cellIndex: cellIndex }, true);\n }\n else {\n this.addAttribute(this.parent.getCellFromIndex(rowIndex, cellIndex));\n }\n };\n /**\n * Apply shift+down key selection\n *\n * @param {number} rowIndex - specfies the rowIndex\n * @param {number} cellIndex - specifies the CellIndex\n * @returns {void}\n * @hidden\n */\n Selection.prototype.shiftDownKey = function (rowIndex, cellIndex) {\n this.isMultiShiftRequest = true;\n if (this.isRowType() && !this.isSingleSel()) {\n if (!isUndefined(this.prevRowIndex)) {\n this.selectRowsByRange(this.prevRowIndex, rowIndex);\n this.applyUpDown(rowIndex);\n }\n else if (this.isPartialSelection) {\n this.selectRow(rowIndex, true);\n }\n else {\n this.selectRow(0, true);\n }\n }\n if (this.isCellType() && !this.isSingleSel()) {\n this.selectCellsByRange(this.prevCIdxs || { rowIndex: 0, cellIndex: 0 }, { rowIndex: rowIndex, cellIndex: cellIndex });\n }\n this.isMultiShiftRequest = false;\n };\n Selection.prototype.applyShiftLeftRightKey = function (rowIndex, cellIndex) {\n this.isMultiShiftRequest = true;\n if (this.selectionSettings.allowColumnSelection && this.needColumnSelection) {\n this.selectColumnsByRange(this.prevColIndex, cellIndex);\n }\n else {\n this.selectCellsByRange(this.prevCIdxs, { rowIndex: rowIndex, cellIndex: cellIndex });\n }\n this.isMultiShiftRequest = false;\n };\n Selection.prototype.getstackedColumns = function (column) {\n var innerColumnIndexes = [];\n for (var i = 0, len = column.length; i < len; i++) {\n if (column[parseInt(i.toString(), 10)].columns) {\n this.getstackedColumns(column[parseInt(i.toString(), 10)].columns);\n }\n else {\n innerColumnIndexes.push(column[parseInt(i.toString(), 10)]);\n }\n }\n return innerColumnIndexes;\n };\n Selection.prototype.applyCtrlHomeEndKey = function (rowIndex, cellIndex) {\n if (this.isRowType()) {\n this.selectRow(rowIndex, true);\n this.addAttribute(this.parent.getCellFromIndex(rowIndex, cellIndex));\n }\n if (this.isCellType()) {\n this.selectCell({ rowIndex: rowIndex, cellIndex: cellIndex }, true);\n }\n };\n Selection.prototype.addRemoveClassesForRow = function (row, isAdd, clearAll) {\n var args = [];\n for (var _i = 3; _i < arguments.length; _i++) {\n args[_i - 3] = arguments[_i];\n }\n if (row) {\n var cells = [].slice.call(row.getElementsByClassName(literals.rowCell));\n var detailIndentCell = row.querySelector('.e-detailrowcollapse') || row.querySelector('.e-detailrowexpand');\n var dragdropIndentCell = row.querySelector('.e-rowdragdrop');\n if (detailIndentCell) {\n cells.push(detailIndentCell);\n }\n if (dragdropIndentCell) {\n cells.push(dragdropIndentCell);\n }\n addRemoveActiveClasses.apply(void 0, [cells, isAdd].concat(args));\n }\n this.getRenderer().setSelection(row ? row.getAttribute('data-uid') : null, isAdd, clearAll);\n };\n Selection.prototype.isRowType = function () {\n return this.selectionSettings.mode === 'Row' || this.selectionSettings.mode === 'Both';\n };\n Selection.prototype.isCellType = function () {\n return this.selectionSettings.mode === 'Cell' || this.selectionSettings.mode === 'Both';\n };\n Selection.prototype.isSingleSel = function () {\n return this.selectionSettings.type === 'Single';\n };\n Selection.prototype.getRenderer = function () {\n if (isNullOrUndefined(this.contentRenderer)) {\n this.contentRenderer = this.factory.getRenderer(RenderType.Content);\n }\n return this.contentRenderer;\n };\n /**\n * Gets the collection of selected records.\n *\n * @returns {Object[]} returns the Object\n */\n Selection.prototype.getSelectedRecords = function () {\n var selectedData = [];\n if (!this.selectionSettings.persistSelection && this.selectedRecords.length) {\n selectedData = this.parent.getRowsObject().filter(function (row) { return row.isSelected; })\n .map(function (m) { return m.data; });\n }\n else {\n selectedData = this.persistSelectedData;\n }\n return selectedData;\n };\n /**\n * Select the column by passing start column index\n *\n * @param {number} index - specifies the index\n * @returns {void}\n */\n Selection.prototype.selectColumn = function (index) {\n var gObj = this.parent;\n if (isNullOrUndefined(gObj.getColumns()[parseInt(index.toString(), 10)])) {\n return;\n }\n var column = gObj.getColumnByIndex(index);\n var selectedCol = gObj.getColumnHeaderByUid(column.uid);\n var isColSelected = selectedCol.classList.contains('e-columnselection');\n if ((!gObj.selectionSettings.allowColumnSelection)) {\n return;\n }\n var isMultiColumns = this.selectedColumnsIndexes.length > 1 &&\n this.selectedColumnsIndexes.indexOf(index) > -1;\n this.clearColDependency();\n if (!isColSelected || !this.selectionSettings.enableToggle || isMultiColumns) {\n var args = {\n columnIndex: index, headerCell: selectedCol,\n column: column,\n cancel: false, target: this.actualTarget,\n isInteracted: this.isInteracted, previousColumnIndex: this.prevColIndex,\n isCtrlPressed: this.isMultiCtrlRequest, isShiftPressed: this.isMultiShiftRequest\n };\n this.onActionBegin(args, events.columnSelecting);\n if (args.cancel) {\n this.disableInteracted();\n return;\n }\n if (!(gObj.selectionSettings.enableToggle && index === this.prevColIndex && isColSelected) || isMultiColumns) {\n this.updateColSelection(selectedCol, index);\n }\n var selectedArgs = {\n columnIndex: index, headerCell: selectedCol,\n column: column,\n target: this.actualTarget,\n isInteracted: this.isInteracted, previousColumnIndex: this.prevColIndex\n };\n this.onActionComplete(selectedArgs, events.columnSelected);\n }\n this.updateColProps(index);\n };\n /**\n * Select the columns by passing start and end column index\n *\n * @param {number} startIndex - specifies the start index\n * @param {number} endIndex - specifies the end index\n * @returns {void}\n */\n Selection.prototype.selectColumnsByRange = function (startIndex, endIndex) {\n var gObj = this.parent;\n if (isNullOrUndefined(gObj.getColumns()[parseInt(startIndex.toString(), 10)])) {\n return;\n }\n var indexes = [];\n if (gObj.selectionSettings.type === 'Single' || isNullOrUndefined(endIndex)) {\n indexes[0] = startIndex;\n }\n else {\n var min = startIndex < endIndex;\n for (var i = startIndex; min ? i <= endIndex : i >= endIndex; min ? i++ : i--) {\n indexes.push(i);\n }\n }\n this.selectColumns(indexes);\n };\n /**\n * Select the columns by passing column indexes\n *\n * @param {number[]} columnIndexes - specifies the columnIndexes\n * @returns {void}\n */\n Selection.prototype.selectColumns = function (columnIndexes) {\n var gObj = this.parent;\n var selectedCol = this.getselectedCols();\n if (gObj.selectionSettings.type === 'Single') {\n columnIndexes = [columnIndexes[0]];\n }\n if (!gObj.selectionSettings.allowColumnSelection) {\n return;\n }\n this.clearColDependency();\n var selectingArgs = {\n columnIndex: columnIndexes[0], headerCell: selectedCol,\n columnIndexes: columnIndexes,\n column: gObj.getColumnByIndex(columnIndexes[0]),\n cancel: false, target: this.actualTarget,\n isInteracted: this.isInteracted, previousColumnIndex: this.prevColIndex,\n isCtrlPressed: this.isMultiCtrlRequest, isShiftPressed: this.isMultiShiftRequest\n };\n this.onActionBegin(selectingArgs, events.columnSelecting);\n if (selectingArgs.cancel) {\n this.disableInteracted();\n return;\n }\n for (var i = 0, len = columnIndexes.length; i < len; i++) {\n this.updateColSelection(gObj.getColumnHeaderByUid(gObj.getColumnByIndex(columnIndexes[parseInt(i.toString(), 10)]).uid), columnIndexes[parseInt(i.toString(), 10)]);\n }\n selectedCol = this.getselectedCols();\n var selectedArgs = {\n columnIndex: columnIndexes[0], headerCell: selectedCol,\n columnIndexes: columnIndexes,\n column: gObj.getColumnByIndex(columnIndexes[0]),\n target: this.actualTarget,\n isInteracted: this.isInteracted, previousColumnIndex: this.prevColIndex\n };\n this.onActionComplete(selectedArgs, events.columnSelected);\n this.updateColProps(columnIndexes[0]);\n };\n /**\n * Select the column with existing column by passing column index\n *\n * @param {number} startIndex - specifies the start index\n * @returns {void}\n */\n Selection.prototype.selectColumnWithExisting = function (startIndex) {\n var gObj = this.parent;\n if (isNullOrUndefined(gObj.getColumns()[parseInt(startIndex.toString(), 10)])) {\n return;\n }\n var newCol = gObj.getColumnHeaderByUid(gObj.getColumnByIndex(startIndex).uid);\n var selectedCol = this.getselectedCols();\n if (gObj.selectionSettings.type === 'Single') {\n this.clearColDependency();\n }\n if (!gObj.selectionSettings.allowColumnSelection) {\n return;\n }\n if (this.selectedColumnsIndexes.indexOf(startIndex) > -1) {\n this.clearColumnSelection(startIndex);\n }\n else {\n var selectingArgs = {\n columnIndex: startIndex, headerCell: selectedCol,\n columnIndexes: this.selectedColumnsIndexes,\n column: gObj.getColumnByIndex(startIndex),\n cancel: false, target: this.actualTarget,\n isInteracted: this.isInteracted, previousColumnIndex: this.prevColIndex,\n isCtrlPressed: this.isMultiCtrlRequest, isShiftPressed: this.isMultiShiftRequest\n };\n this.onActionBegin(selectingArgs, events.columnSelecting);\n if (selectingArgs.cancel) {\n this.disableInteracted();\n return;\n }\n this.updateColSelection(newCol, startIndex);\n selectedCol = this.getselectedCols();\n var selectedArgs = {\n columnIndex: startIndex, headerCell: selectedCol,\n column: gObj.getColumnByIndex(startIndex),\n columnIndexes: this.selectedColumnsIndexes,\n target: this.actualTarget,\n isInteracted: this.isInteracted, previousColumnIndex: this.prevColIndex\n };\n this.onActionComplete(selectedArgs, events.columnSelected);\n }\n this.updateColProps(startIndex);\n };\n /**\n * Clear the column selection\n *\n * @param {number} clearIndex - specifies the clearIndex\n * @returns {void}\n */\n Selection.prototype.clearColumnSelection = function (clearIndex) {\n if (this.isColumnSelected) {\n var gObj = this.parent;\n if (!isNullOrUndefined(clearIndex) && this.selectedColumnsIndexes.indexOf(clearIndex) === -1) {\n return;\n }\n var index = !isNullOrUndefined(clearIndex) ? clearIndex :\n this.selectedColumnsIndexes[this.selectedColumnsIndexes.length - 1];\n var column = gObj.getColumnByIndex(index);\n var selectedCol = gObj.getColumnHeaderByUid(column.uid);\n var deselectedArgs = {\n columnIndex: index, headerCell: selectedCol,\n columnIndexes: this.selectedColumnsIndexes,\n column: column,\n cancel: false, target: this.actualTarget,\n isInteracted: this.isInteracted\n };\n var isCanceled = this.columnDeselect(deselectedArgs, events.columnDeselecting);\n if (isCanceled) {\n this.disableInteracted();\n return;\n }\n var selectedHeader = !isNullOrUndefined(clearIndex) ? [selectedCol] :\n [].slice.call(gObj.getHeaderContent().getElementsByClassName('e-columnselection'));\n var selectedCells = this.getSelectedColumnCells(clearIndex);\n for (var i = 0, len = selectedHeader.length; i < len; i++) {\n addRemoveActiveClasses([selectedHeader[parseInt(i.toString(), 10)]], false, 'e-columnselection');\n }\n for (var i = 0, len = selectedCells.length; i < len; i++) {\n addRemoveActiveClasses([selectedCells[parseInt(i.toString(), 10)]], false, 'e-columnselection');\n }\n if (!isNullOrUndefined(clearIndex)) {\n this.selectedColumnsIndexes.splice(this.selectedColumnsIndexes.indexOf(clearIndex), 1);\n this.parent.getColumns()[parseInt(clearIndex.toString(), 10)].isSelected = false;\n }\n else {\n this.columnDeselect(deselectedArgs, events.columnDeselected);\n this.selectedColumnsIndexes = [];\n this.isColumnSelected = false;\n this.parent.getColumns().filter(function (col) { return col.isSelected = false; });\n }\n }\n };\n Selection.prototype.getselectedCols = function () {\n var gObj = this.parent;\n var selectedCol;\n if (this.selectedColumnsIndexes.length > 1) {\n selectedCol = [];\n for (var i = 0; i < this.selectedColumnsIndexes.length; i++) {\n (selectedCol).push(gObj.getColumnHeaderByUid(gObj.getColumnByIndex(this.selectedColumnsIndexes[parseInt(i.toString(), 10)]).uid));\n }\n }\n else {\n selectedCol = gObj.getColumnHeaderByUid(gObj.getColumnByIndex(this.selectedColumnsIndexes[0]).uid);\n }\n return selectedCol;\n };\n Selection.prototype.getSelectedColumnCells = function (clearIndex) {\n var gObj = this.parent;\n var isRowTemplate = !isNullOrUndefined(this.parent.rowTemplate);\n var rows = isRowTemplate ? gObj.getRows() : gObj.getDataRows();\n var seletedcells = [];\n var selectionString = !isNullOrUndefined(clearIndex) ? '[data-colindex=\"' + clearIndex + '\"]' : '.e-columnselection';\n for (var i = 0, len = rows.length; i < len; i++) {\n seletedcells = seletedcells.concat([].slice.call(rows[parseInt(i.toString(), 10)].querySelectorAll(selectionString)));\n }\n return seletedcells;\n };\n Selection.prototype.columnDeselect = function (args, event) {\n if (event === 'columnDeselected') {\n delete args.cancel;\n }\n this.onActionComplete(args, event);\n return args.cancel;\n };\n Selection.prototype.updateColProps = function (startIndex) {\n this.prevColIndex = startIndex;\n this.isColumnSelected = this.selectedColumnsIndexes.length && true;\n };\n Selection.prototype.clearColDependency = function () {\n this.clearColumnSelection();\n this.selectedColumnsIndexes = [];\n };\n Selection.prototype.updateColSelection = function (selectedCol, startIndex) {\n if (isNullOrUndefined(this.parent.getColumns()[parseInt(startIndex.toString(), 10)])) {\n return;\n }\n var isRowTemplate = !isNullOrUndefined(this.parent.rowTemplate);\n var rows = isRowTemplate ? this.parent.getRows() : this.parent.getDataRows();\n this.selectedColumnsIndexes.push(startIndex);\n this.parent.getColumns()[parseInt(startIndex.toString(), 10)].isSelected = true;\n startIndex = startIndex + this.parent.getIndentCount();\n addRemoveActiveClasses([selectedCol], true, 'e-columnselection');\n for (var j = 0, len = rows.length; j < len; j++) {\n if (rows[parseInt(j.toString(), 10)].classList.contains(literals.row)) {\n if ((rows[parseInt(j.toString(), 10)].classList.contains(literals.editedRow)\n || rows[parseInt(j.toString(), 10)].classList.contains(literals.addedRow))\n && this.parent.editSettings.mode === 'Normal'\n && !isNullOrUndefined(rows[parseInt(j.toString(), 10)].querySelector('tr').childNodes[parseInt(startIndex.toString(), 10)])) {\n addRemoveActiveClasses([rows[parseInt(j.toString(), 10)].querySelector('tr').childNodes[parseInt(startIndex.toString(), 10)]], true, 'e-columnselection');\n }\n else {\n if (this.parent.isSpan && this.parent.isFrozenGrid()) {\n var cells = rows[parseInt(j.toString(), 10)].querySelectorAll('.e-rowcell');\n for (var i = 0; i < cells.length; i++) {\n if (cells[parseInt(i.toString(), 10)].getAttribute('aria-colindex') === selectedCol.getAttribute('aria-colindex')) {\n addRemoveActiveClasses([cells[parseInt(i.toString(), 10)]], true, 'e-columnselection');\n }\n }\n }\n else if (!isNullOrUndefined(rows[parseInt(j.toString(), 10)].childNodes[parseInt(startIndex.toString(), 10)])) {\n addRemoveActiveClasses([rows[parseInt(j.toString(), 10)].childNodes[parseInt(startIndex.toString(), 10)]], true, 'e-columnselection');\n }\n }\n }\n }\n };\n Selection.prototype.headerSelectionHandler = function (colIndex) {\n if ((!this.isMultiCtrlRequest && !this.isMultiShiftRequest) || this.isSingleSel()) {\n this.selectColumn(colIndex);\n }\n else if (this.isMultiShiftRequest) {\n this.selectColumnsByRange(isUndefined(this.prevColIndex) ? colIndex : this.prevColIndex, colIndex);\n }\n else {\n this.selectColumnWithExisting(colIndex);\n }\n };\n // eslint-disable-next-line camelcase\n Selection.prototype.addEventListener_checkbox = function () {\n var _this = this;\n this.parent.on(events.dataReady, this.dataReady, this);\n this.onDataBoundFunction = this.onDataBound.bind(this);\n this.parent.addEventListener(events.dataBound, this.onDataBoundFunction);\n this.parent.on(events.refreshInfinitePersistSelection, this.onDataBoundFunction);\n this.parent.on(events.contentReady, this.checkBoxSelectionChanged, this);\n this.parent.on(events.beforeRefreshOnDataChange, this.initPerisistSelection, this);\n this.parent.on(events.onEmpty, this.setCheckAllForEmptyGrid, this);\n this.actionCompleteFunc = this.actionCompleteHandler.bind(this);\n this.parent.addEventListener(events.actionComplete, this.actionCompleteFunc);\n this.parent.on(events.click, this.clickHandler, this);\n this.resizeEndFn = function () {\n _this.updateAutoFillPosition();\n _this.drawBorders();\n };\n this.resizeEndFn.bind(this);\n this.parent.addEventListener(events.resizeStop, this.resizeEndFn);\n };\n // eslint-disable-next-line camelcase\n Selection.prototype.removeEventListener_checkbox = function () {\n this.parent.off(events.dataReady, this.dataReady);\n this.parent.removeEventListener(events.dataBound, this.onDataBoundFunction);\n this.parent.removeEventListener(events.actionComplete, this.actionCompleteFunc);\n this.parent.off(events.refreshInfinitePersistSelection, this.onDataBoundFunction);\n this.parent.off(events.onEmpty, this.setCheckAllForEmptyGrid);\n this.parent.off(events.click, this.clickHandler);\n this.parent.off(events.beforeRefreshOnDataChange, this.initPerisistSelection);\n };\n Selection.prototype.setCheckAllForEmptyGrid = function () {\n var checkAllBox = this.getCheckAllBox();\n if (checkAllBox) {\n this.parent.isCheckBoxSelection = true;\n var spanEle = checkAllBox.nextElementSibling;\n removeClass([spanEle], ['e-check', 'e-stop', 'e-uncheck']);\n addClass([spanEle.parentElement], ['e-checkbox-disabled']);\n }\n };\n Selection.prototype.dataReady = function (e) {\n this.isHeaderCheckboxClicked = false;\n var isInfinitecroll = this.parent.enableInfiniteScrolling && e.requestType === 'infiniteScroll';\n if (e.requestType !== 'virtualscroll' && !this.parent.isPersistSelection && !isInfinitecroll) {\n this.disableUI = !this.parent.enableImmutableMode && !(e.requestType === 'save' && e['action'] === 'add');\n this.clearSelection();\n this.setCheckAllState();\n this.disableUI = false;\n }\n };\n Selection.prototype.actionCompleteHandler = function (e) {\n if (e.requestType === 'save' && this.parent.isPersistSelection) {\n this.refreshPersistSelection();\n }\n };\n Selection.prototype.selectRowIndex = function (index) {\n this.parent.isSelectedRowIndexUpdating = true;\n if ((isNullOrUndefined(this.parent.selectedRowIndex) || this.parent.selectedRowIndex === -1) || !this.parent.enablePersistence) {\n this.parent.selectedRowIndex = index;\n }\n else {\n this.parent.selectedRowIndex = -1;\n }\n };\n Selection.prototype.disableInteracted = function () {\n this.isInteracted = false;\n };\n Selection.prototype.activeTarget = function () {\n this.actualTarget = this.isInteracted ? this.actualTarget : null;\n };\n return Selection;\n}());\nexport { Selection };\n","import { extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport { isActionPrevent } from '../base/util';\n/**\n * The `Search` module is used to handle search action.\n */\nvar Search = /** @class */ (function () {\n /**\n * Constructor for Grid search module.\n *\n * @param {IGrid} parent - specifies the IGrid\n * @hidden\n */\n function Search(parent) {\n this.parent = parent;\n this.addEventListener();\n }\n /**\n * Checks if the input string contains non-numeric characters.\n *\n * @param input The string to be checked for non-numeric characters.\n * @returns `true` if the input string contains non-numeric characters, `false` otherwise.\n */\n Search.prototype.hasNonNumericCharacters = function (searchString) {\n var decimalFound = false;\n for (var _i = 0, searchString_1 = searchString; _i < searchString_1.length; _i++) {\n var char = searchString_1[_i];\n if ((char < '0' || char > '9') && char !== '.') {\n return true;\n }\n if (char === '.') {\n if (decimalFound) {\n // If decimal is found more than once, it's not valid\n return true;\n }\n decimalFound = true;\n }\n }\n return false;\n };\n /**\n * Searches Grid records by given key.\n *\n * > You can customize the default search action by using [`searchSettings`](./searchsettings/).\n *\n * @param {string} searchString - Defines the key.\n * @returns {void}\n */\n Search.prototype.search = function (searchString) {\n var gObj = this.parent;\n searchString = isNullOrUndefined(searchString) ? '' : searchString;\n if (isActionPrevent(gObj)) {\n gObj.notify(events.preventBatch, { instance: this, handler: this.search, arg1: searchString });\n return;\n }\n if (searchString !== gObj.searchSettings.key) {\n // Check searchString is number and parseFloat to remove trailing zeros\n gObj.searchSettings.key = (searchString !== \"\" && !this.hasNonNumericCharacters(searchString)) ? parseFloat(searchString).toString() : searchString.toString();\n gObj.dataBind();\n }\n else if (this.refreshSearch) {\n gObj.refresh();\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Search.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.inBoundModelChanged, this.onPropertyChanged, this);\n this.parent.on(events.searchComplete, this.onSearchComplete, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.actionCompleteFunc = this.onActionComplete.bind(this);\n this.parent.addEventListener(events.actionComplete, this.actionCompleteFunc);\n this.parent.on(events.cancelBegin, this.cancelBeginEvent, this);\n };\n /**\n * @returns {void}\n * @hidden\n */\n Search.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.inBoundModelChanged, this.onPropertyChanged);\n this.parent.off(events.searchComplete, this.onSearchComplete);\n this.parent.off(events.destroy, this.destroy);\n this.parent.removeEventListener(events.actionComplete, this.actionCompleteFunc);\n this.parent.off(events.cancelBegin, this.cancelBeginEvent);\n };\n /**\n * To destroy the print\n *\n * @returns {void}\n * @hidden\n */\n Search.prototype.destroy = function () {\n this.removeEventListener();\n };\n /**\n * @param {NotifyArgs} e - specfies the NotifyArgs\n * @returns {void}\n * @hidden\n */\n Search.prototype.onPropertyChanged = function (e) {\n if (e.module !== this.getModuleName()) {\n return;\n }\n if (!isNullOrUndefined(e.properties.key)) {\n this.parent.notify(events.modelChanged, {\n requestType: 'searching', type: events.actionBegin, searchString: this.parent.searchSettings.key\n });\n }\n else {\n this.parent.notify(events.modelChanged, {\n requestType: 'searching', type: events.actionBegin\n });\n }\n };\n /**\n * The function used to trigger onActionComplete\n *\n * @param {NotifyArgs} e - specifies the NotifyArgs\n * @returns {void}\n * @hidden\n */\n Search.prototype.onSearchComplete = function (e) {\n this.parent.trigger(events.actionComplete, extend(e, {\n searchString: this.parent.searchSettings.key, requestType: 'searching', type: events.actionComplete\n }));\n };\n /**\n * The function used to store the requestType\n *\n * @param {NotifyArgs} e - specifies the NotifyArgs\n * @returns {void}\n * @hidden\n */\n Search.prototype.onActionComplete = function (e) {\n this.refreshSearch = e.requestType !== 'searching';\n };\n Search.prototype.cancelBeginEvent = function (e) {\n if (e.requestType === 'searching') {\n this.parent.setProperties({ searchSettings: { key: '' } }, true);\n }\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n Search.prototype.getModuleName = function () {\n return 'search';\n };\n return Search;\n}());\nexport { Search };\n","import { isNullOrUndefined, remove } from '@syncfusion/ej2-base';\nimport { iterateArrayOrObject, isGroupAdaptive, isActionPrevent, addRemoveEventListener } from '../base/util';\nimport * as events from '../base/constant';\n/**\n * The `ShowHide` module is used to control column visibility.\n */\nvar ShowHide = /** @class */ (function () {\n /**\n * Constructor for the show hide module.\n *\n * @param {IGrid} parent - specifies the IGrid\n * @hidden\n */\n function ShowHide(parent) {\n this.colName = [];\n this.isShowHide = false;\n this.parent = parent;\n this.addEventListener();\n }\n ShowHide.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.evtHandlers = [{ event: events.batchCancel, handler: this.batchChanges },\n { event: events.batchCnfrmDlgCancel, handler: this.resetColumnState }\n ];\n addRemoveEventListener(this.parent, this.evtHandlers, true, this);\n };\n /**\n * @returns {void}\n * @hidden\n */\n ShowHide.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n addRemoveEventListener(this.parent, this.evtHandlers, false);\n };\n ShowHide.prototype.batchChanges = function () {\n if (this.isShowHide) {\n this.isShowHide = false;\n this.setVisible(this.colName, this.changedCol);\n this.changedCol = this.colName = [];\n }\n };\n /**\n * Shows a column by column name.\n *\n * @param {string|string[]} columnName - Defines a single or collection of column names to show.\n * @param {string} showBy - Defines the column key either as field name or header text.\n * @returns {void}\n */\n ShowHide.prototype.show = function (columnName, showBy) {\n var keys = this.getToggleFields(columnName);\n var columns = this.getColumns(keys, showBy);\n this.parent.notify(events.tooltipDestroy, { module: 'edit' });\n for (var i = 0; i < columns.length; i++) {\n columns[parseInt(i.toString(), 10)].visible = true;\n }\n this.setVisible(columns);\n };\n /**\n * Hides a column by column name.\n *\n * @param {string|string[]} columnName - Defines a single or collection of column names to hide.\n * @param {string} hideBy - Defines the column key either as field name or header text.\n * @returns {void}\n */\n ShowHide.prototype.hide = function (columnName, hideBy) {\n var keys = this.getToggleFields(columnName);\n var columns = this.getColumns(keys, hideBy);\n this.parent.notify(events.tooltipDestroy, { module: 'edit' });\n for (var i = 0; i < columns.length; i++) {\n columns[parseInt(i.toString(), 10)].visible = false;\n }\n this.setVisible(columns);\n };\n ShowHide.prototype.getToggleFields = function (key) {\n var finalized = [];\n if (typeof key === 'string') {\n finalized = [key];\n }\n else {\n finalized = key;\n }\n return finalized;\n };\n ShowHide.prototype.getColumns = function (keys, getKeyBy) {\n var _this = this;\n var columns = iterateArrayOrObject(keys, function (key) {\n return iterateArrayOrObject(_this.parent.columnModel, function (item) {\n if (item[\"\" + getKeyBy] === key) {\n return item;\n }\n return undefined;\n })[0];\n });\n return columns;\n };\n ShowHide.prototype.batchActionPrevent = function (columns, changedStateColumns) {\n if (changedStateColumns === void 0) { changedStateColumns = []; }\n if (isActionPrevent(this.parent)) {\n this.colName = columns;\n this.changedCol = changedStateColumns;\n this.parent.closeEdit();\n return false;\n }\n return true;\n };\n ShowHide.prototype.resetColumnState = function () {\n if (this.isShowHide) {\n for (var i = 0; i < this.colName.length; i++) {\n this.colName[parseInt(i.toString(), 10)].visible = !this.colName[parseInt(i.toString(), 10)].visible;\n }\n }\n };\n /**\n * Shows or hides columns by given column collection.\n *\n * @private\n * @param {Column[]} columns - Specifies the columns.\n * @param {Column[]} changedStateColumns - specifies the changedStateColumns\n * @returns {void}\n */\n ShowHide.prototype.setVisible = function (columns, changedStateColumns) {\n var _this = this;\n if (changedStateColumns === void 0) { changedStateColumns = []; }\n this.isShowHide = true;\n if (!this.batchActionPrevent(columns, changedStateColumns)) {\n return;\n }\n changedStateColumns = (changedStateColumns.length > 0) ? changedStateColumns : columns;\n var args = {\n requestType: 'columnstate',\n cancel: false,\n columns: changedStateColumns\n };\n var cancel = 'cancel';\n if (this.parent.enableInfiniteScrolling && this.parent.allowGrouping\n && this.parent.groupModule.groupSettings.columns.length > 0) {\n this.parent.contentModule.visibleRows = [];\n }\n this.parent.trigger(events.actionBegin, args, function (showHideArgs) {\n var currentViewCols = _this.parent.getColumns();\n columns = isNullOrUndefined(columns) ? currentViewCols : columns;\n if (showHideArgs[\"\" + cancel]) {\n _this.parent.notify(events.resetColumns, { showHideArgs: showHideArgs });\n if (columns.length > 0) {\n columns[0].visible = true;\n }\n return;\n }\n if (isGroupAdaptive(_this.parent)) {\n _this.parent.contentModule.emptyVcRows();\n }\n var addedRow = _this.parent.element.querySelector('.e-addedrow');\n if (_this.parent.editSettings.showAddNewRow && addedRow) {\n remove(addedRow);\n if (_this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling) {\n _this.parent.isAddNewRow = true;\n }\n _this.parent.addNewRowFocus = true;\n _this.parent.isEdit = false;\n }\n if (_this.parent.allowSelection && _this.parent.getSelectedRecords().length &&\n !_this.parent.selectionSettings.persistSelection) {\n _this.parent.clearSelection();\n }\n if (_this.parent.enableColumnVirtualization) {\n var colsInCurrentView = columns.filter(function (col1) { return (currentViewCols.some(function (col2) { return col1.field === col2.field; })); });\n if (colsInCurrentView.length) {\n _this.parent.notify(events.columnVisibilityChanged, columns);\n }\n }\n else {\n if (_this.parent.isFrozenGrid() && columns.length) {\n _this.parent.notify(events.refreshFrozenPosition, { isModeChg: true });\n }\n _this.parent.notify(events.columnVisibilityChanged, columns);\n }\n var params = {\n requestType: 'columnstate',\n columns: changedStateColumns\n };\n _this.parent.trigger(events.actionComplete, params);\n var startAdd = !_this.parent.element.querySelector('.e-addedrow');\n if (_this.parent.editSettings.showAddNewRow && startAdd) {\n _this.parent.isEdit = false;\n _this.parent.addRecord();\n if (!(_this.parent.enableVirtualization || _this.parent.enableInfiniteScrolling)) {\n _this.parent.notify(events.showAddNewRowFocus, {});\n }\n }\n if (_this.parent.columnQueryMode !== 'All') {\n _this.parent.refresh();\n }\n });\n if (this.parent.autoFit && !this.parent.groupSettings.columns.length) {\n this.parent.preventAdjustColumns();\n }\n };\n return ShowHide;\n}());\nexport { ShowHide };\n","import { Browser, EventHandler } from '@syncfusion/ej2-base';\nimport { addClass, removeClass } from '@syncfusion/ej2-base';\nimport { formatUnit, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { getScrollBarWidth, getUpdateUsingRaf } from '../base/util';\nimport { scroll, contentReady, uiUpdate, onEmpty, headerRefreshed, textWrapRefresh, virtualScrollEdit, infiniteScrollHandler, closeFilterDialog } from '../base/constant';\nimport { lazyLoadScrollHandler, checkScrollReset } from '../base/constant';\nimport { ColumnWidthService } from '../services/width-controller';\nimport * as literals from '../base/string-literals';\nimport * as events from '../base/constant';\n/**\n * The `Scroll` module is used to handle scrolling behaviour.\n */\nvar Scroll = /** @class */ (function () {\n /**\n * Constructor for the Grid scrolling.\n *\n * @param {IGrid} parent - specifies the IGrid\n * @hidden\n */\n function Scroll(parent) {\n //To maintain scroll state on grid actions.\n this.previousValues = { top: 0, left: 0 };\n this.oneTimeReady = true;\n this.parent = parent;\n this.widthService = new ColumnWidthService(parent);\n this.addEventListener();\n }\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n Scroll.prototype.getModuleName = function () {\n return 'scroll';\n };\n /**\n * @param {boolean} uiupdate - specifies the uiupdate\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.setWidth = function (uiupdate) {\n this.parent.element.style.width = formatUnit(this.parent.width);\n if (uiupdate) {\n this.widthService.setWidthToColumns();\n }\n if (this.parent.toolbarModule && this.parent.toolbarModule.toolbar &&\n this.parent.toolbarModule.toolbar.element) {\n var tlbrElement = this.parent.toolbarModule.toolbar.element;\n var tlbrLeftElement = tlbrElement.querySelector('.e-toolbar-left');\n var tlbrCenterElement = tlbrElement.querySelector('.e-toolbar-center');\n var tlbrRightElement = tlbrElement.querySelector('.e-toolbar-right');\n var tlbrItems = tlbrElement.querySelector('.e-toolbar-items');\n var tlbrLeftWidth = tlbrLeftElement ? tlbrLeftElement.clientWidth : 0;\n var tlbrCenterWidth = tlbrCenterElement ? tlbrCenterElement.clientWidth : 0;\n var tlbrRightWidth = tlbrRightElement ? tlbrRightElement.clientWidth : 0;\n var tlbrItemsWidth = tlbrItems ? tlbrItems.clientWidth : 0;\n var tlbrWidth = tlbrElement ? tlbrElement.clientWidth : 0;\n if (!this.parent.enableAdaptiveUI || tlbrLeftWidth > tlbrWidth || tlbrCenterWidth > tlbrWidth || tlbrRightWidth > tlbrWidth ||\n tlbrItemsWidth > tlbrWidth) {\n this.parent.toolbarModule.toolbar.refreshOverflow();\n }\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.setHeight = function () {\n var mHdrHeight = 0;\n var content = this.parent.getContent().querySelector('.' + literals.content);\n var height = this.parent.height;\n if (this.parent.enableColumnVirtualization && this.parent.isFrozenGrid() && this.parent.height !== 'auto'\n && this.parent.height.toString().indexOf('%') < 0) {\n height = parseInt(height, 10) - Scroll.getScrollBarWidth();\n }\n if (!this.parent.enableVirtualization && this.parent.frozenRows && this.parent.height !== 'auto') {\n var tbody = this.parent.getHeaderContent()\n .querySelector(literals.tbody + ':not(.e-masked-tbody)');\n mHdrHeight = tbody ? tbody.offsetHeight : 0;\n if (tbody && mHdrHeight) {\n var add = tbody.getElementsByClassName(literals.addedRow).length;\n var height_1 = add * this.parent.getRowHeight();\n mHdrHeight -= height_1;\n }\n else if (!this.parent.isInitialLoad && this.parent.loadingIndicator.indicatorType === 'Shimmer'\n && this.parent.getHeaderContent().querySelector('.e-masked-table')) {\n height = parseInt(height, 10) - (this.parent.frozenRows * this.parent.getRowHeight());\n }\n content.style.height = formatUnit(height - mHdrHeight);\n }\n else {\n content.style.height = formatUnit(height);\n }\n this.ensureOverflow(content);\n if (this.parent.isFrozenGrid()) {\n this.refresh();\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.setPadding = function () {\n var content = this.parent.getHeaderContent();\n var scrollWidth = Scroll.getScrollBarWidth() - this.getThreshold();\n var cssProps = this.getCssProperties();\n content.querySelector('.' + literals.headerContent).style[cssProps.border] = scrollWidth > 0 ? '1px' : '0px';\n content.style[cssProps.padding] = scrollWidth > 0 ? scrollWidth + 'px' : '0px';\n };\n /**\n * @param {boolean} rtl - specifies the rtl\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.removePadding = function (rtl) {\n var cssProps = this.getCssProperties(rtl);\n var hDiv = this.parent.getHeaderContent().querySelector('.' + literals.headerContent);\n hDiv.style[cssProps.border] = '';\n hDiv.parentElement.style[cssProps.padding] = '';\n var footerDiv = this.parent.getFooterContent();\n if (footerDiv && footerDiv.classList.contains('e-footerpadding')) {\n footerDiv.classList.remove('e-footerpadding');\n }\n };\n /**\n * Refresh makes the Grid adoptable with the height of parent container.\n *\n * > The [`height`](./#height) must be set to 100%.\n *\n * @returns {void}\n */\n Scroll.prototype.refresh = function () {\n if (this.parent.height !== '100%') {\n return;\n }\n var content = this.parent.getContent();\n this.parent.element.style.height = '100%';\n var height = this.widthService.getSiblingsHeight(content);\n content.style.height = 'calc(100% - ' + height + 'px)'; //Set the height to the '.' + literals.gridContent;\n };\n Scroll.prototype.getThreshold = function () {\n /* Some browsers places the scroller outside the content,\n * hence the padding should be adjusted.*/\n var appName = Browser.info.name;\n if (appName === 'mozilla') {\n return 0.5;\n }\n return 1;\n };\n /**\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(onEmpty, this.wireEvents, this);\n this.parent.on(contentReady, this.wireEvents, this);\n this.parent.on(uiUpdate, this.onPropertyChanged, this);\n this.parent.on(textWrapRefresh, this.wireEvents, this);\n this.parent.on(headerRefreshed, this.setScrollLeft, this);\n };\n /**\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(onEmpty, this.wireEvents);\n this.parent.off(contentReady, this.wireEvents);\n this.parent.off(uiUpdate, this.onPropertyChanged);\n this.parent.off(textWrapRefresh, this.wireEvents);\n this.parent.off(headerRefreshed, this.setScrollLeft);\n this.unwireEvents();\n };\n Scroll.prototype.unwireEvents = function () {\n if (this.parent.frozenRows && this.header) {\n EventHandler.remove(this.header, 'touchstart pointerdown', this.setPageXY);\n EventHandler.remove(this.header, 'touchmove pointermove', this.onTouchScroll);\n }\n var mScrollBar = this.parent.getContent() ? this.parent.getContent().querySelector('.e-movablescrollbar') : null;\n if (this.parent.isFrozenGrid() && this.parent.enableColumnVirtualization) {\n if (mScrollBar) {\n EventHandler.remove(mScrollBar, 'scroll', this.onCustomScrollbarScroll);\n }\n if (this.content) {\n EventHandler.remove(this.content, 'scroll', this.onCustomScrollbarScroll);\n EventHandler.remove(this.content, 'touchstart pointerdown', this.setPageXY);\n if (!(/macintosh|ipad/.test(Browser.userAgent.toLowerCase()) && Browser.isDevice)) {\n EventHandler.remove(this.content, 'touchmove pointermove', this.onTouchScroll);\n }\n }\n if (this.header) {\n EventHandler.remove(this.header, 'scroll', this.onCustomScrollbarScroll);\n EventHandler.remove(this.header, 'touchstart pointerdown', this.setPageXY);\n EventHandler.remove(this.header, 'touchmove pointermove', this.onTouchScroll);\n }\n }\n if (this.content) {\n EventHandler.remove(this.content, 'scroll', this.contentScrollHandler);\n }\n if (this.header) {\n EventHandler.remove(this.header, 'scroll', this.headerScrollHandler);\n }\n this.contentScrollHandler = null;\n this.headerScrollHandler = null;\n if (this.parent.aggregates.length && this.parent.getFooterContent()) {\n EventHandler.remove(this.parent.getFooterContent().firstChild, 'scroll', this.onContentScroll);\n }\n };\n Scroll.prototype.setScrollLeft = function () {\n this.parent.getHeaderContent().querySelector('.' + literals.headerContent).scrollLeft = this.previousValues.left;\n };\n Scroll.prototype.onContentScroll = function (scrollTarget) {\n var _this = this;\n var element = scrollTarget;\n var isHeader = element.classList.contains(literals.headerContent);\n return function (e) {\n if (_this.content.querySelector(literals.tbody) === null || _this.parent.isPreventScrollEvent) {\n return;\n }\n var target = e.target;\n if (_this.parent.frozenRows) {\n if (_this.content.scrollTop > 0 && _this.parent.frozenRows) {\n addClass([_this.parent.element], 'e-top-shadow');\n }\n else {\n removeClass([_this.parent.element], 'e-top-shadow');\n }\n }\n if (_this.parent.element.querySelectorAll('.e-leftfreeze,.e-fixedfreeze,.e-rightfreeze').length) {\n var errorFreeze = _this.parent.getContent().querySelectorAll('.e-freezeerror:not([style*=\"display: none\"])');\n var errorFixed = _this.parent.getContent().querySelectorAll('.e-fixederror:not([style*=\"display: none\"])');\n if (target.scrollLeft !== 0 && _this.parent.getVisibleFrozenLeftCount()) {\n addClass([_this.parent.element], 'e-left-shadow');\n }\n else {\n removeClass([_this.parent.element], 'e-left-shadow');\n }\n var widthVal = Math.round((_this.parent.enableRtl ? target.scrollWidth + target.scrollLeft : target.scrollWidth -\n target.scrollLeft) + (_this.parent.height === 'auto' ? 0 : 1));\n if (widthVal === target.offsetWidth && _this.parent.getVisibleFrozenRightCount()) {\n removeClass([_this.parent.element], 'e-right-shadow');\n }\n else {\n addClass([_this.parent.element], 'e-right-shadow');\n }\n var rows = [].slice.call(_this.parent.getContent().querySelectorAll('.e-row:not(.e-hiddenrow)'));\n if (((rows.length === 1 && errorFreeze.length) ||\n (_this.parent.element.querySelector('.e-freeze-autofill:not([style*=\"display: none\"])')) ||\n errorFixed.length) && target.scrollLeft !== _this.previousValues.left) {\n target.scrollLeft = _this.previousValues.left;\n return;\n }\n if (rows.length !== 1 && (errorFreeze.length || errorFixed.length) && target.scrollTop !== _this.previousValues.top) {\n target.scrollTop = _this.previousValues.top;\n return;\n }\n }\n var left = target.scrollLeft;\n if (!isNullOrUndefined(_this.parent.infiniteScrollModule) && _this.parent.enableInfiniteScrolling && (!_this.parent.isEdit\n || (_this.parent.editSettings.showAddNewRow && !_this.parent.element.querySelector('.e-editedrow')))) {\n _this.parent.notify(infiniteScrollHandler, { target: e.target, isLeft: _this.previousValues.left !== left });\n }\n if (_this.parent.groupSettings.columns.length && _this.parent.groupSettings.enableLazyLoading) {\n var isDown = _this.previousValues.top < _this.parent.getContent().firstElementChild.scrollTop;\n _this.parent.notify(lazyLoadScrollHandler, { scrollDown: isDown });\n }\n _this.parent.notify(virtualScrollEdit, {});\n var isFooter = target.classList.contains('e-summarycontent');\n if (_this.previousValues.left === left) {\n _this.previousValues.top = !isHeader ? _this.previousValues.top : target.scrollTop;\n return;\n }\n _this.parent.notify(closeFilterDialog, e);\n element.scrollLeft = left;\n if (isFooter) {\n _this.header.scrollLeft = left;\n }\n _this.previousValues.left = left;\n _this.parent.notify(scroll, { left: left });\n };\n };\n Scroll.prototype.onCustomScrollbarScroll = function (cont, hdr) {\n var _this = this;\n var content = cont;\n var header = hdr;\n return function (e) {\n if (_this.content.querySelector(literals.tbody) === null) {\n return;\n }\n var target = e.target;\n var left = target.scrollLeft;\n if (_this.previousValues.left === left) {\n return;\n }\n content.scrollLeft = left;\n header.scrollLeft = left;\n _this.previousValues.left = left;\n _this.parent.notify(scroll, { left: left });\n if (_this.parent.isDestroyed) {\n return;\n }\n };\n };\n Scroll.prototype.onTouchScroll = function (scrollTarget) {\n var _this = this;\n var element = scrollTarget;\n return function (e) {\n if (e.pointerType === 'mouse') {\n return;\n }\n var isFrozen = _this.parent.isFrozenGrid();\n var pageXY = _this.getPointXY(e);\n var left = element.scrollLeft + (_this.pageXY.x - pageXY.x);\n var mHdr = _this.parent.getHeaderContent().querySelector('.' + literals.headerContent);\n var mCont = _this.parent.getContent().querySelector('.' + literals.content);\n if (_this.previousValues.left === left || (left < 0 || (mHdr.scrollWidth - mHdr.clientWidth) < left)) {\n return;\n }\n e.preventDefault();\n mHdr.scrollLeft = left;\n mCont.scrollLeft = left;\n if (isFrozen && _this.parent.enableColumnVirtualization) {\n var scrollBar = _this.parent.getContent().querySelector('.e-movablescrollbar');\n scrollBar.scrollLeft = left;\n }\n _this.pageXY.x = pageXY.x;\n _this.previousValues.left = left;\n };\n };\n Scroll.prototype.setPageXY = function () {\n var _this = this;\n return function (e) {\n if (e.pointerType === 'mouse') {\n return;\n }\n _this.pageXY = _this.getPointXY(e);\n };\n };\n Scroll.prototype.getPointXY = function (e) {\n var pageXY = { x: 0, y: 0 };\n if (e.touches && e.touches.length) {\n pageXY.x = e.touches[0].pageX;\n pageXY.y = e.touches[0].pageY;\n }\n else {\n pageXY.x = e.pageX;\n pageXY.y = e.pageY;\n }\n return pageXY;\n };\n Scroll.prototype.getScrollbleParent = function (node) {\n if (node === null) {\n return null;\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var parent = isNullOrUndefined(node.tagName) ? node.scrollingElement : node;\n var overflowY = document.defaultView.getComputedStyle(parent, null).overflowY;\n if (parent.scrollHeight > parent.clientHeight && overflowY !== 'hidden'\n && overflowY !== 'visible' || node.tagName === 'HTML' || node.tagName === 'BODY') {\n return node;\n }\n else {\n return this.getScrollbleParent(node.parentNode);\n }\n };\n /**\n * @param {boolean} isAdd - specifies whether adding/removing the event\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.addStickyListener = function (isAdd) {\n this.parentElement = this.getScrollbleParent(this.parent.element.parentElement);\n if (isAdd && this.parentElement) {\n this.eventElement = this.parentElement.tagName === 'HTML' || this.parentElement.tagName === 'BODY' ? document :\n this.parentElement;\n EventHandler.add(this.eventElement, 'scroll', this.makeStickyHeader, this);\n }\n else if (this.eventElement) {\n EventHandler.remove(this.eventElement, 'scroll', this.makeStickyHeader);\n this.eventElement = null;\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.resizeFrozenRowBorder = function () {\n var div;\n if (!this.parent.element.querySelector('.e-frozenrow-border')) {\n div = this.parent.createElement('div', { className: 'e-frozenrow-border' });\n this.parent.element.insertBefore(div, this.parent.element.querySelector('.e-gridcontent'));\n }\n else {\n div = this.parent.element.querySelector('.e-frozenrow-border');\n }\n var scrollWidth = this.parent.height !== 'auto' ? Scroll.getScrollBarWidth() : 0;\n div.style.width = (this.parent.element.offsetWidth - scrollWidth) - 0.5 + 'px';\n };\n Scroll.prototype.wireEvents = function () {\n var _this = this;\n if (this.oneTimeReady) {\n var frzCols = this.parent.isFrozenGrid();\n this.content = this.parent.getContent().querySelector('.' + literals.content);\n this.header = this.parent.getHeaderContent().querySelector('.' + literals.headerContent);\n var mScrollBar = this.parent.getContent().querySelector('.e-movablescrollbar');\n if (this.parent.frozenRows && this.header && this.content) {\n EventHandler.add(this.header, 'touchstart pointerdown', this.setPageXY(), this);\n EventHandler.add(this.header, 'touchmove pointermove', this.onTouchScroll(this.content), this);\n }\n if (frzCols && mScrollBar && this.parent.enableColumnVirtualization) {\n EventHandler.add(mScrollBar, 'scroll', this.onCustomScrollbarScroll(this.content, this.header), this);\n EventHandler.add(this.content, 'scroll', this.onCustomScrollbarScroll(mScrollBar, this.header), this);\n EventHandler.add(this.header, 'scroll', this.onCustomScrollbarScroll(mScrollBar, this.content), this);\n EventHandler.add(this.header, 'touchstart pointerdown', this.setPageXY(), this);\n EventHandler.add(this.header, 'touchmove pointermove', this.onTouchScroll(this.content), this);\n EventHandler.add(this.content, 'touchstart pointerdown', this.setPageXY(), this);\n if (!(/macintosh|ipad/.test(Browser.userAgent.toLowerCase()) && Browser.isDevice)) {\n EventHandler.add(this.content, 'touchmove pointermove', this.onTouchScroll(this.header), this);\n }\n }\n this.contentScrollHandler = this.onContentScroll(this.header);\n this.headerScrollHandler = this.onContentScroll(this.content);\n EventHandler.add(this.content, 'scroll', this.contentScrollHandler, this);\n EventHandler.add(this.header, 'scroll', this.headerScrollHandler, this);\n if (this.parent.aggregates.length) {\n EventHandler.add(this.parent.getFooterContent().firstChild, 'scroll', this.onContentScroll(this.content), this);\n }\n if (this.parent.enableStickyHeader) {\n this.addStickyListener(true);\n }\n this.refresh();\n this.oneTimeReady = false;\n }\n var table = this.parent.getContentTable();\n var sLeft;\n var sHeight;\n var clientHeight;\n getUpdateUsingRaf(function () {\n sLeft = _this.header.scrollLeft;\n sHeight = table.scrollHeight;\n clientHeight = _this.parent.getContent().clientHeight;\n }, function () {\n var args = { cancel: false };\n _this.parent.notify(checkScrollReset, args);\n if (sHeight < clientHeight && _this.parent.height !== 'auto') {\n _this.setLastRowCell();\n }\n if (_this.parent.frozenRows) {\n _this.resizeFrozenRowBorder();\n }\n if (!_this.parent.enableVirtualization && !_this.parent.enableInfiniteScrolling) {\n if (!args.cancel) {\n _this.header.scrollLeft = _this.previousValues.left;\n _this.content.scrollLeft = _this.previousValues.left;\n _this.content.scrollTop = _this.previousValues.top;\n }\n }\n if (!_this.parent.enableColumnVirtualization) {\n _this.content.scrollLeft = sLeft;\n if (_this.parent.isFrozenGrid()) {\n _this.previousValues.left = sLeft;\n }\n }\n });\n this.parent.isPreventScrollEvent = false;\n };\n /**\n * @returns {void} returns void\n * @hidden\n */\n Scroll.prototype.setLastRowCell = function () {\n var table = this.parent.getContentTable();\n if (table.querySelector('tr:nth-last-child(2)')) {\n removeClass(table.querySelector('tr:nth-last-child(2)').querySelectorAll('td'), 'e-lastrowcell');\n if (this.parent.isSpan) {\n removeClass(table.querySelectorAll('.e-row-span-lastrowcell'), 'e-lastrowcell');\n }\n if (this.parent.editSettings.showAddNewRow && this.parent.editSettings.newRowPosition === 'Bottom') {\n addClass(table.querySelector('tr:nth-last-child(2)').querySelectorAll('td'), 'e-lastrowcell');\n }\n }\n addClass(table.querySelectorAll('tr:last-child td'), 'e-lastrowcell');\n if (this.parent.isSpan) {\n addClass(table.querySelectorAll('.e-row-span-lastrowcell'), 'e-lastrowcell');\n }\n };\n /**\n * @param {boolean} rtl - specifies the rtl\n * @returns {ScrollCss} returns the ScrollCss\n * @hidden\n */\n Scroll.prototype.getCssProperties = function (rtl) {\n var css = {};\n var enableRtl = isNullOrUndefined(rtl) ? this.parent.enableRtl : rtl;\n css.border = enableRtl ? 'borderLeftWidth' : 'borderRightWidth';\n css.padding = enableRtl ? 'paddingLeft' : 'paddingRight';\n return css;\n };\n Scroll.prototype.ensureOverflow = function (content) {\n content.style.overflowY = this.parent.height === 'auto' ? 'auto' : 'scroll';\n };\n Scroll.prototype.onPropertyChanged = function (e) {\n if (e.module !== this.getModuleName()) {\n return;\n }\n this.setPadding();\n this.oneTimeReady = true;\n if (this.parent.height === 'auto') {\n this.removePadding();\n }\n this.wireEvents();\n this.setHeight();\n var width = 'width';\n this.setWidth(!isNullOrUndefined(e.properties[\"\" + width]));\n };\n Scroll.prototype.makeStickyHeader = function () {\n if (this.parent.enableStickyHeader && this.parent.element && this.parent.getContent()) {\n var contentRect = this.parent.getContent().getClientRects()[0];\n if (contentRect) {\n var headerEle = this.parent.getHeaderContent();\n var toolbarEle = this.parent.element.querySelector('.e-toolbar');\n var groupHeaderEle = this.parent.element.querySelector('.e-groupdroparea');\n var height = headerEle.offsetHeight + (toolbarEle ? toolbarEle.offsetHeight : 0) +\n (groupHeaderEle ? groupHeaderEle.offsetHeight : 0);\n var parentTop = this.parentElement.getClientRects()[0].top;\n var top_1 = contentRect.top - (parentTop < 0 ? 0 : parentTop);\n var left = contentRect.left;\n var colMenuEle = document.body.querySelector('#' + this.parent.element.id + '_columnmenu');\n if (top_1 < height && contentRect.bottom > 0) {\n headerEle.classList.add('e-sticky');\n var elemTop = 0;\n if (groupHeaderEle && this.parent.groupSettings.showDropArea) {\n this.setSticky(groupHeaderEle, elemTop, contentRect.width, left, true);\n elemTop += groupHeaderEle.getClientRects()[0].height;\n }\n if (toolbarEle) {\n this.setSticky(toolbarEle, elemTop, contentRect.width, left, true);\n elemTop += toolbarEle.getClientRects()[0].height;\n }\n this.setSticky(headerEle, elemTop, contentRect.width, left, true);\n if (!isNullOrUndefined(colMenuEle)) {\n colMenuEle.style.position = 'fixed';\n colMenuEle.style.top = height + 'px';\n }\n }\n else {\n if (headerEle.classList.contains('e-sticky')) {\n this.setSticky(headerEle, null, null, null, false);\n if (toolbarEle) {\n this.setSticky(toolbarEle, null, null, null, false);\n }\n if (groupHeaderEle) {\n this.setSticky(groupHeaderEle, null, null, null, false);\n }\n var ccDlg = this.parent.element.querySelector('.e-ccdlg');\n if (ccDlg) {\n ccDlg.classList.remove('e-sticky');\n }\n if (!isNullOrUndefined(colMenuEle)) {\n colMenuEle.style.position = 'absolute';\n var topStyle = contentRect.top - parentTop;\n colMenuEle.style.top = topStyle + 'px';\n }\n }\n }\n this.parent.notify(events.stickyScrollComplete, {});\n }\n }\n };\n Scroll.prototype.setSticky = function (ele, top, width, left, isAdd) {\n if (isAdd) {\n ele.style.width = width + 'px';\n ele.classList.add('e-sticky');\n }\n else {\n ele.classList.remove('e-sticky');\n }\n ele.style.top = top != null ? top + 'px' : '';\n ele.style.left = left !== null ? parseInt(ele.style.left, 10) !== left ? left + 'px' : ele.style.left : '';\n };\n /**\n * @returns {void}\n * @hidden\n */\n Scroll.prototype.destroy = function () {\n var gridElement = this.parent.element;\n if (!gridElement || (!gridElement.querySelector('.' + literals.gridHeader) && !gridElement.querySelector('.' + literals.gridContent))) {\n return;\n }\n this.removeEventListener();\n //Remove Dom event\n var cont = this.parent.getContent().querySelector('.' + literals.content);\n EventHandler.remove(cont, 'scroll', this.onContentScroll);\n if (this.parent.enableStickyHeader) {\n this.addStickyListener(false);\n }\n //Remove padding\n this.removePadding();\n removeClass([this.parent.getHeaderContent().querySelector('.' + literals.headerContent)], literals.headerContent);\n removeClass([cont], literals.content);\n //Remove height\n cont.style.height = '';\n //Remove width\n this.parent.element.style.width = '';\n };\n /**\n * Function to get the scrollbar width of the browser.\n *\n * @returns {number} return the width\n * @hidden\n */\n Scroll.getScrollBarWidth = function () {\n return getScrollBarWidth();\n };\n return Scroll;\n}());\nexport { Scroll };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { compile } from '@syncfusion/ej2-base';\nimport { getEnumValue } from '@syncfusion/ej2-base';\nimport { CellType } from '../base/enum';\nimport { Property, Collection, ChildProperty } from '@syncfusion/ej2-base';\n/**\n * Configures the Grid's aggregate column.\n */\nvar AggregateColumn = /** @class */ (function (_super) {\n __extends(AggregateColumn, _super);\n function AggregateColumn() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.templateFn = {};\n return _this;\n }\n /**\n * @param {Function} value - specifies the value\n * @returns {void}\n * @hidden\n */\n AggregateColumn.prototype.setFormatter = function (value) {\n this.formatFn = value;\n };\n /**\n * @returns {Function} returns the Function\n * @hidden\n */\n AggregateColumn.prototype.getFormatter = function () {\n return this.formatFn;\n };\n /**\n * @param {Object} helper - specifies the helper\n * @returns {void}\n * @hidden\n */\n AggregateColumn.prototype.setTemplate = function (helper) {\n if (helper === void 0) { helper = {}; }\n if (this.footerTemplate !== undefined) {\n this.templateFn[getEnumValue(CellType, CellType.Summary)] = { fn: compile(this.footerTemplate, helper),\n property: 'footerTemplate' };\n }\n if (this.groupFooterTemplate !== undefined) {\n this.templateFn[getEnumValue(CellType, CellType.GroupSummary)] = { fn: compile(this.groupFooterTemplate, helper),\n property: 'groupFooterTemplate' };\n }\n if (this.groupCaptionTemplate !== undefined) {\n this.templateFn[getEnumValue(CellType, CellType.CaptionSummary)] = { fn: compile(this.groupCaptionTemplate, helper),\n property: 'groupCaptionTemplate' };\n }\n };\n /**\n * @param {CellType} type - specifies the cell type\n * @returns {Object} returns the object\n * @hidden\n */\n AggregateColumn.prototype.getTemplate = function (type) {\n return this.templateFn[getEnumValue(CellType, type)];\n };\n /**\n * @param {Object} prop - returns the Object\n * @returns {void}\n * @hidden\n */\n AggregateColumn.prototype.setPropertiesSilent = function (prop) {\n this.setProperties(prop, true);\n };\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"field\", void 0);\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"columnName\", void 0);\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"format\", void 0);\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"footerTemplate\", void 0);\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"groupFooterTemplate\", void 0);\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"groupCaptionTemplate\", void 0);\n __decorate([\n Property()\n ], AggregateColumn.prototype, \"customAggregate\", void 0);\n return AggregateColumn;\n}(ChildProperty));\nexport { AggregateColumn };\n/**\n * Configures the aggregate rows.\n */\nvar AggregateRow = /** @class */ (function (_super) {\n __extends(AggregateRow, _super);\n function AggregateRow() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Collection([], AggregateColumn)\n ], AggregateRow.prototype, \"columns\", void 0);\n return AggregateRow;\n}(ChildProperty));\nexport { AggregateRow };\n","import { Browser, remove, EventHandler, isUndefined, closest, classList } from '@syncfusion/ej2-base';\nimport { parentsUntil, isGroupAdaptive } from '../base/util';\nimport * as events from '../base/constant';\nimport * as literals from '../base/string-literals';\n/**\n * The `Clipboard` module is used to handle clipboard copy action.\n */\nvar Clipboard = /** @class */ (function () {\n /**\n * Constructor for the Grid clipboard module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {ServiceLocator} serviceLocator - specifies the serviceLocator\n * @hidden\n */\n function Clipboard(parent, serviceLocator) {\n this.copyContent = '';\n this.isSelect = false;\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n this.addEventListener();\n }\n /**\n * @returns {void}\n * @hidden\n */\n Clipboard.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.contentReady, this.initialEnd, this);\n this.parent.on(events.keyPressed, this.keyDownHandler, this);\n this.parent.on(events.click, this.clickHandler, this);\n this.parent.on(events.onEmpty, this.initialEnd, this);\n EventHandler.add(this.parent.element, 'keydown', this.pasteHandler, this);\n };\n /**\n * @returns {void}\n * @hidden\n */\n Clipboard.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.keyPressed, this.keyDownHandler);\n this.parent.off(events.contentReady, this.initialEnd);\n this.parent.off(events.click, this.clickHandler);\n this.parent.off(events.onEmpty, this.initialEnd);\n EventHandler.remove(this.parent.element, 'keydown', this.pasteHandler);\n };\n Clipboard.prototype.clickHandler = function (e) {\n var target = e.target;\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n target = parentsUntil(target, 'e-rowcell');\n };\n Clipboard.prototype.pasteHandler = function (e) {\n var _this = this;\n var grid = this.parent;\n var isMacLike = /(Mac)/i.test(navigator.platform);\n var selectedRowCellIndexes = this.parent.getSelectedRowCellIndexes();\n if (e.keyCode === 67 && isMacLike && e.metaKey && !grid.isEdit) {\n this.copy();\n }\n if (selectedRowCellIndexes.length && e.keyCode === 86 && ((!isMacLike && e.ctrlKey) || (isMacLike && e.metaKey)) && !grid.isEdit) {\n var target = closest(document.activeElement, '.' + literals.rowCell);\n if (!this.clipBoardTextArea || !target || !grid.editSettings.allowEditing || grid.editSettings.mode !== 'Batch' ||\n grid.selectionSettings.mode !== 'Cell' || grid.selectionSettings.cellSelectionMode === 'Flow') {\n return;\n }\n this.activeElement = document.activeElement;\n var x_1 = window.scrollX;\n var y_1 = window.scrollY;\n this.clipBoardTextArea.focus();\n setTimeout(function () {\n _this.activeElement.focus();\n window.scrollTo(x_1, y_1);\n _this.paste(_this.clipBoardTextArea.value, selectedRowCellIndexes[0].rowIndex, selectedRowCellIndexes[0].cellIndexes[0]);\n }, isMacLike ? 100 : 10);\n }\n };\n /**\n * Paste data from clipboard to selected cells.\n *\n * @param {boolean} data - Specifies the date for paste.\n * @param {boolean} rowIndex - Specifies the row index.\n * @param {boolean} colIndex - Specifies the column index.\n * @returns {void}\n */\n Clipboard.prototype.paste = function (data, rowIndex, colIndex) {\n var grid = this.parent;\n var cIdx = colIndex;\n var rIdx = rowIndex;\n var col;\n var value;\n var isAvail;\n var rows = data.split('\\n');\n var cols;\n for (var r = 0; r < rows.length; r++) {\n cols = rows[parseInt(r.toString(), 10)].split('\\t');\n cIdx = colIndex;\n if ((r === rows.length - 1 && rows[parseInt(r.toString(), 10)] === '') || isUndefined(grid.getRowByIndex(rIdx))) {\n cIdx++;\n break;\n }\n for (var c = 0; c < cols.length; c++) {\n isAvail = grid.getCellFromIndex(rIdx, cIdx);\n if (!isAvail) {\n cIdx++;\n break;\n }\n col = grid.getColumnByIndex(cIdx);\n value = col.getParser() ? col.getParser()(cols[parseInt(c.toString(), 10)]) : cols[parseInt(c.toString(), 10)];\n if (col.allowEditing && !col.isPrimaryKey && !col.template) {\n var args = {\n column: col,\n data: value,\n rowIndex: rIdx\n };\n this.parent.trigger(events.beforePaste, args);\n rIdx = args.rowIndex;\n if (!args.cancel) {\n if (grid.editModule) {\n if (col.type === 'number') {\n this.parent.editModule.updateCell(rIdx, col.field, parseFloat(args.data));\n }\n else {\n grid.editModule.updateCell(rIdx, col.field, args.data);\n }\n }\n }\n }\n cIdx++;\n }\n rIdx++;\n }\n grid.selectionModule.selectCellsByRange({ rowIndex: rowIndex, cellIndex: colIndex }, { rowIndex: rIdx - 1, cellIndex: cIdx - 1 });\n var cell = this.parent.getCellFromIndex(rIdx - 1, cIdx - 1);\n if (cell) {\n classList(cell, ['e-focus', 'e-focused'], []);\n }\n this.clipBoardTextArea.value = '';\n };\n Clipboard.prototype.initialEnd = function () {\n this.l10n = this.serviceLocator.getService('localization');\n this.parent.off(events.contentReady, this.initialEnd);\n this.clipBoardTextArea = this.parent.createElement('textarea', {\n className: 'e-clipboard',\n styles: 'opacity: 0',\n attrs: { tabindex: '-1', 'aria-label': this.l10n.getConstant('ClipBoard') }\n });\n this.parent.element.appendChild(this.clipBoardTextArea);\n };\n Clipboard.prototype.keyDownHandler = function (e) {\n if (e.action === 'ctrlPlusC') {\n this.copy();\n }\n else if (e.action === 'ctrlShiftPlusH') {\n this.copy(true);\n }\n };\n Clipboard.prototype.setCopyData = function (withHeader) {\n if (window.getSelection().toString() === '') {\n this.clipBoardTextArea.value = this.copyContent = '';\n var rows = this.parent.getDataRows();\n if (this.parent.selectionSettings.mode !== 'Cell') {\n var selectedIndexes = this.parent.getSelectedRowIndexes().sort(function (a, b) { return a - b; });\n if (withHeader) {\n var headerTextArray = [];\n for (var i = 0; i < this.parent.getVisibleColumns().length; i++) {\n headerTextArray[parseInt(i.toString(), 10)] = this.parent\n .getVisibleColumns()[parseInt(i.toString(), 10)].headerText;\n }\n this.getCopyData(headerTextArray, false, '\\t', withHeader);\n this.copyContent += '\\n';\n }\n for (var i = 0; i < selectedIndexes.length; i++) {\n if (i > 0) {\n this.copyContent += '\\n';\n }\n var leftCols = [];\n var idx = selectedIndexes[parseInt(i.toString(), 10)];\n if (!isGroupAdaptive(this.parent) && (this.parent.enableVirtualization ||\n (this.parent.enableInfiniteScrolling && this.parent.infiniteScrollSettings.enableCache) ||\n (this.parent.groupSettings.columns.length && this.parent.groupSettings.enableLazyLoading))) {\n idx = rows.map(function (m) { return m.getAttribute('data-rowindex'); }).indexOf(selectedIndexes[parseInt(i.toString(), 10)].toString());\n }\n leftCols.push.apply(leftCols, [].slice.call(rows[parseInt(idx.toString(), 10)].querySelectorAll('.e-rowcell:not(.e-hide)')));\n this.getCopyData(leftCols, false, '\\t', withHeader);\n }\n }\n else {\n var obj = this.checkBoxSelection();\n if (obj.status) {\n if (withHeader) {\n var headers = [];\n for (var i = 0; i < obj.colIndexes.length; i++) {\n var colHeader = this.parent\n .getColumnHeaderByIndex(obj.colIndexes[parseInt(i.toString(), 10)]);\n if (!colHeader.classList.contains('e-hide')) {\n headers.push(colHeader);\n }\n }\n this.getCopyData(headers, false, '\\t', withHeader);\n this.copyContent += '\\n';\n }\n for (var i = 0; i < obj.rowIndexes.length; i++) {\n if (i > 0) {\n this.copyContent += '\\n';\n }\n var cells = [].slice.call(rows[obj.rowIndexes[parseInt(i.toString(), 10)]].\n querySelectorAll('.e-cellselectionbackground:not(.e-hide)'));\n this.getCopyData(cells, false, '\\t', withHeader);\n }\n }\n else {\n this.getCopyData([].slice.call(this.parent.element.getElementsByClassName('e-cellselectionbackground')), true, '\\n', withHeader);\n }\n }\n var args = {\n data: this.copyContent,\n cancel: false\n };\n this.parent.trigger(events.beforeCopy, args);\n if (args.cancel) {\n return;\n }\n this.clipBoardTextArea.value = this.copyContent = args.data;\n if (!Browser.userAgent.match(/ipad|ipod|iphone/i)) {\n this.clipBoardTextArea.select();\n }\n else {\n this.clipBoardTextArea.setSelectionRange(0, this.clipBoardTextArea.value.length);\n }\n this.isSelect = true;\n }\n };\n Clipboard.prototype.getCopyData = function (cells, isCell, splitKey, withHeader) {\n var isElement = typeof cells[0] !== 'string';\n for (var j = 0; j < cells.length; j++) {\n if (withHeader && isCell) {\n var colIdx = parseInt(cells[parseInt(j.toString(), 10)].getAttribute(literals.dataColIndex), 10);\n this.copyContent += this.parent.getColumns()[parseInt(colIdx.toString(), 10)].headerText + '\\n';\n }\n if (isElement) {\n if (!cells[parseInt(j.toString(), 10)].classList.contains('e-hide')) {\n this.copyContent += cells[parseInt(j.toString(), 10)].innerText;\n }\n }\n else {\n this.copyContent += cells[parseInt(j.toString(), 10)];\n }\n if (j < cells.length - 1) {\n this.copyContent += splitKey;\n }\n }\n };\n /**\n * Copy selected rows or cells data into clipboard.\n *\n * @returns {void}\n * @param {boolean} withHeader - Specifies whether the column header data need to be copied or not.\n */\n Clipboard.prototype.copy = function (withHeader) {\n if (document.queryCommandSupported('copy') && this.clipBoardTextArea) {\n this.setCopyData(withHeader);\n document.execCommand('copy');\n this.clipBoardTextArea.blur();\n }\n if (this.isSelect) {\n window.getSelection().removeAllRanges();\n this.isSelect = false;\n }\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n Clipboard.prototype.getModuleName = function () {\n return 'clipboard';\n };\n /**\n * To destroy the clipboard\n *\n * @returns {void}\n * @hidden\n */\n Clipboard.prototype.destroy = function () {\n this.removeEventListener();\n if (this.clipBoardTextArea) {\n remove(this.clipBoardTextArea);\n this.clipBoardTextArea = null;\n }\n };\n Clipboard.prototype.checkBoxSelection = function () {\n var gridObj = this.parent;\n var obj = { status: false };\n if (gridObj.selectionSettings.mode === 'Cell') {\n var rowCellIndxes = gridObj.getSelectedRowCellIndexes();\n var str = void 0;\n var rowIndexes = [];\n var i = void 0;\n for (i = 0; i < rowCellIndxes.length; i++) {\n if (rowCellIndxes[parseInt(i.toString(), 10)].cellIndexes.length) {\n rowIndexes.push(rowCellIndxes[parseInt(i.toString(), 10)].rowIndex);\n }\n if (rowCellIndxes[parseInt(i.toString(), 10)].cellIndexes.length) {\n if (!str) {\n str = JSON.stringify(rowCellIndxes[parseInt(i.toString(), 10)].cellIndexes.sort());\n }\n if (str !== JSON.stringify(rowCellIndxes[parseInt(i.toString(), 10)].cellIndexes.sort())) {\n break;\n }\n }\n }\n rowIndexes.sort(function (a, b) { return a - b; });\n if (i === rowCellIndxes.length) {\n obj = { status: true, rowIndexes: rowIndexes, colIndexes: rowCellIndxes[0].cellIndexes };\n }\n }\n return obj;\n };\n return Clipboard;\n}());\nexport { Clipboard };\n","/**\n *\n * `Logger` class\n */\nimport { isNullOrUndefined, L10n, isUndefined } from '@syncfusion/ej2-base';\nimport { DataUtil, DataManager } from '@syncfusion/ej2-data';\nvar BASE_DOC_URL = 'https://ej2.syncfusion.com/documentation/grid';\nvar DOC_URL = 'https://ej2.syncfusion.com/documentation/';\nvar WARNING = '[EJ2Grid.Warning]';\nvar ERROR = '[EJ2Grid.Error]';\nvar INFO = '[EJ2Grid.Info]';\nvar Logger = /** @class */ (function () {\n function Logger(parent) {\n this.parent = parent;\n this.parent.on('initial-end', this.patchadaptor, this);\n }\n Logger.prototype.getModuleName = function () {\n return 'logger';\n };\n Logger.prototype.log = function (types, args) {\n if (!(types instanceof Array)) {\n types = [types];\n }\n var type = types;\n for (var i = 0; i < type.length; i++) {\n var item = detailLists[type[parseInt(i.toString(), 10)]];\n var cOp = item.check(args, this.parent);\n if (cOp.success) {\n // eslint-disable-next-line no-console\n console[item.logType](item.generateMessage(args, this.parent, cOp.options));\n }\n }\n };\n Logger.prototype.patchadaptor = function () {\n var adaptor = this.parent.getDataModule().dataManager.adaptor;\n var original = adaptor.beforeSend;\n if (original) {\n adaptor.beforeSend = function (dm, request, settings) {\n original.call(adaptor, dm, request, settings);\n };\n }\n };\n Logger.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off('initial-end', this.patchadaptor);\n };\n return Logger;\n}());\nexport { Logger };\nexport var detailLists = {\n // eslint-disable-next-line camelcase\n module_missing: {\n type: 'module_missing',\n logType: 'warn',\n check: function (args, parent) {\n var injected = parent.getInjectedModules().map(function (m) { return m.prototype.getModuleName(); });\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var modules = parent.requiredModules().map(function (m) { return m.member; })\n .filter(function (name) { return injected.indexOf(name) === -1; });\n return { success: modules.filter(function (m) { return m !== 'resize'; }).length > 0, options: modules };\n },\n generateMessage: function (args, parent, modules) {\n modules = modules.filter(function (m) { return m !== 'resize'; })\n .reduce(function (prev, cur) { return prev + (\"* \" + cur + \"\\n\"); }, '');\n return WARNING + ': MODULES MISSING\\n' + 'The following modules are not injected:.\\n' +\n (\"\" + modules) +\n (\"Refer to \" + BASE_DOC_URL + \"/module.html for documentation on importing feature modules.\");\n }\n },\n // eslint-disable-next-line camelcase\n promise_enabled: {\n type: 'promise_enabled',\n logType: 'error',\n check: function () {\n return { success: typeof Promise === 'undefined' };\n },\n generateMessage: function () {\n return ERROR + ': PROMISE UNDEFINED\\n' +\n 'Promise object is not present in the global environment,' +\n 'please use polyfil to support Promise object in your environment.\\n' +\n (\"Refer to \" + DOC_URL + \"/base/browser.html?#required-polyfills for more information.\");\n }\n },\n // eslint-disable-next-line camelcase\n primary_column_missing: {\n type: 'primary_column_missing',\n logType: 'warn',\n check: function (args, parent) {\n return { success: parent.enableColumnVirtualization\n ? parent.getPrimaryKeyFieldNames().length === 0\n : parent.getColumns().filter(function (column) { return column.isPrimaryKey; }).length === 0 };\n },\n generateMessage: function () {\n return WARNING + ': PRIMARY KEY MISSING\\n' + 'Editing is enabled but primary key column is not specified.\\n' +\n (\"Refer to \" + BASE_DOC_URL + \"/api-column.html?#isprimarykey for documentation on providing primary key columns.\");\n }\n },\n // eslint-disable-next-line camelcase\n selection_key_missing: {\n type: 'selection_key_missing',\n logType: 'warn',\n check: function (args, parent) {\n return { success: parent.selectionSettings.persistSelection &&\n parent.getColumns().filter(function (column) { return column.isPrimaryKey; }).length === 0 };\n },\n generateMessage: function () {\n return WARNING + ': PRIMARY KEY MISSING\\n' +\n 'selectionSettings.persistSelection property is enabled. It requires one primary key column to persist selection.\\n' +\n (\"Refer to \" + BASE_DOC_URL + \"/api-column.html?#isprimarykey for documentation on providing primary key columns.\");\n }\n },\n actionfailure: {\n type: 'actionfailure',\n logType: 'error',\n check: function () {\n return { success: true };\n },\n generateMessage: function (args, parent) {\n var message = '';\n var formatError = formatErrorHandler(args, parent);\n var ajaxError = ajaxErrorHandler(args, parent);\n if (ajaxError !== '') {\n message = ajaxError;\n }\n else if (formatError !== '') {\n message = formatError;\n }\n else {\n message = args.error;\n }\n return WARNING + ': ' + message;\n }\n },\n // eslint-disable-next-line camelcase\n locale_missing: {\n type: 'locale_missing',\n logType: 'warn',\n check: function (args, parent) {\n var lObj = DataUtil.getObject(\"locale.\" + parent.locale + \".grid\", L10n);\n return { success: parent.locale !== 'en-US' && isNullOrUndefined(lObj) };\n },\n generateMessage: function (args, parent) {\n return WARNING + ': LOCALE CONFIG MISSING\\n' + (\"Locale configuration for '\" + parent.locale + \"' is not provided.\\n\") +\n (\"Refer to \" + BASE_DOC_URL + \"/globalization-and-localization.html?#localization \\n for documentation on setting locale configuration.\");\n }\n },\n limitation: {\n type: 'limitation',\n logType: 'warn',\n check: function (args, parent) {\n var name = args;\n var opt;\n switch (name) {\n case 'freeze':\n opt = {\n success: !isUndefined(parent.detailTemplate) || !isUndefined(parent.childGrid),\n options: { name: 'freeze' }\n };\n break;\n case 'virtualization':\n opt = {\n success: !isUndefined(parent.detailTemplate) || !isUndefined(parent.childGrid),\n options: { name: 'virtualization' }\n };\n break;\n default:\n opt = { success: false };\n break;\n }\n return opt;\n },\n generateMessage: function (args, parent, options) {\n var name = options.name;\n var opt;\n switch (name) {\n case 'freeze':\n opt = 'Frozen rows and columns do not support the following features:\\n' +\n '* Details Template\\n' +\n '* Hierarchy Grid\\n';\n break;\n case 'virtualization':\n opt = 'Virtualization does not support the following features.\\n' +\n '* Details Template.\\n' +\n '* Hierarchy Grid.\\n';\n break;\n default:\n opt = '';\n break;\n }\n return WARNING + (\": \" + name.toUpperCase() + \" LIMITATIONS\\n\") + opt;\n }\n },\n // eslint-disable-next-line camelcase\n check_datasource_columns: {\n type: 'check_datasource_columns',\n logType: 'warn',\n check: function (args, parent) {\n return { success: !(parent.columns.length ||\n (parent.dataSource instanceof DataManager) || parent.dataSource.length) };\n },\n generateMessage: function () {\n return WARNING + ': GRID CONFIG MISSING\\n' + 'dataSource and columns are not provided in the grid. ' +\n 'At least one of either must be provided for grid configuration.\\n' +\n (\"Refer to \" + BASE_DOC_URL + \"/columns.html for documentation on configuring the grid data and columns.\");\n }\n },\n // eslint-disable-next-line camelcase\n virtual_height: {\n type: 'virtual_height',\n logType: 'error',\n check: function (args, parent) {\n return { success: isNullOrUndefined(parent.height) || parent.height === 'auto' };\n },\n generateMessage: function () {\n return ERROR + ': GRID HEIGHT MISSING \\n' + 'height property is required to use virtualization.\\n' +\n (\"Refer to \" + BASE_DOC_URL + \"/virtual.html for documentation on configuring the virtual grid.\");\n }\n },\n // eslint-disable-next-line camelcase\n grid_remote_edit: {\n type: 'grid_remote_edit',\n logType: 'error',\n check: function (args) {\n return { success: Array.isArray(args) || Array.isArray(args.result) };\n },\n generateMessage: function () {\n return ERROR + ': RETRUN VALUE MISSING \\n' +\n 'Remote service returns invalid data. \\n' +\n (\"Refer to \" + BASE_DOC_URL + \"/edit.html for documentation on configuring editing with remote data.\");\n }\n },\n // eslint-disable-next-line camelcase\n grid_sort_comparer: {\n type: 'grid_sort_comparer',\n logType: 'warn',\n check: function (args, parent) {\n return { success: parent.getDataModule().isRemote() };\n },\n generateMessage: function () {\n return WARNING + ': SORT COMPARER NOT WORKING \\n' + 'Sort comparer will not work with remote data.' +\n (\"Refer to \" + BASE_DOC_URL + \"/sorting/#custom-sort-comparer for documentation on using the sort comparer.\");\n }\n },\n // eslint-disable-next-line camelcase\n resize_min_max: {\n type: 'resize_min_max',\n logType: 'info',\n check: function (args) {\n return { success: (args.column.minWidth && args.column.minWidth >= args.width) ||\n (args.column.maxWidth && args.column.maxWidth <= args.width) };\n },\n generateMessage: function () {\n return INFO + ': RESIZING COLUMN REACHED MIN OR MAX \\n' + 'The column resizing width is at its min or max.';\n }\n },\n // eslint-disable-next-line camelcase\n action_disabled_column: {\n type: 'action_disabled_column',\n logType: 'info',\n check: function (args) {\n var success = true;\n var fn;\n switch (args.moduleName) {\n case 'reorder':\n if (isNullOrUndefined(args.destColumn)) {\n fn = \"reordering action is disabled for the \" + args.column.headerText + \" column\";\n }\n else {\n fn = \"reordering action is disabled for the \" + (args.column.allowReordering ?\n args.destColumn.headerText : args.column.headerText) + \" column\";\n }\n break;\n case 'group':\n fn = \"grouping action is disabled for the \" + args.columnName + \" column.\";\n break;\n case 'filter':\n fn = \"filtering action is disabled for the \" + args.columnName + \" column.\";\n break;\n case 'sort':\n fn = \"sorting action is disabled for the \" + args.columnName + \" column.\";\n break;\n }\n return { success: success, options: { fn: fn } };\n },\n generateMessage: function (args, parent, options) {\n return INFO + (\": ACTION DISABLED \\n \" + options.fn);\n }\n },\n // eslint-disable-next-line camelcase\n exporting_begin: {\n type: 'exporting_begin',\n logType: 'info',\n check: function (args) {\n return { success: true, options: { args: args } };\n },\n generateMessage: function (args, parent, options) {\n return INFO + (\": EXPORTNIG INPROGRESS \\n Grid \" + options.args + \"ing is in progress\");\n }\n },\n // eslint-disable-next-line camelcase\n exporting_complete: {\n type: 'exporting_complete',\n logType: 'info',\n check: function (args) {\n return { success: true, options: { args: args } };\n },\n generateMessage: function (args, parent, options) {\n return INFO + (\": EXPORTNIG COMPLETED \\n Grid \" + options.args + \"ing is complete\");\n }\n },\n // eslint-disable-next-line camelcase\n foreign_key_failure: {\n type: 'foreign_key_failure',\n logType: 'error',\n check: function () {\n return { success: true };\n },\n generateMessage: function () {\n return ERROR + ': FOREIGNKEY CONFIG \\n Grid foreign key column needs a valid data source/service.' +\n (\"Refer to \" + BASE_DOC_URL + \"/columns/#foreign-key-column for documentation on configuring foreign key columns.\");\n }\n },\n // eslint-disable-next-line camelcase\n initial_action: {\n type: 'initial_action',\n logType: 'error',\n check: function (args) {\n var success = true;\n var fn;\n switch (args.moduleName) {\n case 'group':\n fn = \"The \" + args.columnName + \" column is not available in the grid's column model.\" +\n 'Please provide a valid field name to group the column';\n break;\n case 'filter':\n fn = \"The \" + args.columnName + \" column is not available in the grid's column model.\" +\n 'Please provide a valid field name to filter the column.';\n break;\n case 'sort':\n fn = \"The \" + args.columnName + \" column is not available in the grid's column model.\" +\n 'Please provide a valid field name to sort the column.';\n break;\n }\n return { success: success, options: { fn: fn } };\n },\n generateMessage: function (args, parent, options) {\n return ERROR + (\": INITIAL ACTION FAILURE \\n \" + options.fn);\n }\n },\n // eslint-disable-next-line camelcase\n frozen_rows_columns: {\n type: 'frozen_rows_columns',\n logType: 'error',\n check: function (args, parent) {\n return { success: parent.getColumns().length <= parent.frozenColumns\n || (parent.currentViewData.length && parent.frozenRows >= parent.currentViewData.length) };\n },\n generateMessage: function (args, parent) {\n return ERROR + (\": OUT OF RANGE ERROR-\\n \" + (parent.getColumns().length <= parent.frozenColumns ? 'FROZEN COLUMNS,' : '')) +\n ((parent.frozenRows >= parent.currentViewData.length ? 'FROZEN ROWS' : '') + \" invalid\");\n }\n },\n // eslint-disable-next-line camelcase\n column_type_missing: {\n type: 'column_type_missing',\n logType: 'error',\n check: function (args) {\n return { success: isNullOrUndefined(args.column.type), options: args.column.headerText };\n },\n generateMessage: function (args, parent, options) {\n return ERROR + (\": COLUMN TYPE MISSING-\\n \" + options + \" column type was invalid or not defined.\") +\n (\"Please go through below help link: \" + DOC_URL + \"/grid/columns/#column-type\");\n }\n },\n // eslint-disable-next-line camelcase\n datasource_syntax_mismatch: {\n type: 'datasource_syntax_mismatch',\n logType: 'warn',\n check: function (args) {\n return { success: args.dataState.dataSource && !(args.dataState.dataSource instanceof DataManager ||\n 'result' in args.dataState.dataSource || args.dataState.dataSource instanceof Array) &&\n !(isNullOrUndefined(args.dataState.dataStateChange)) };\n },\n generateMessage: function () {\n return WARNING + ': DATASOURCE SYNTAX WARNING\\n' +\n 'DataSource should be in the form of {result: Object[], count: number}' +\n 'when dataStateChangeEvent used';\n }\n }\n};\nvar formatErrorHandler = function (args) {\n var error = args.error;\n if (error.indexOf && error.indexOf('Format options') !== 0) {\n return '';\n }\n return 'INVALID FORMAT\\n' +\n 'For more information, refer to the following documentation links:\\n' +\n (\"Number format: \" + DOC_URL + \"/common/internationalization#supported-format-string\\n\") +\n (\"Date format: \" + DOC_URL + \"/common/internationalization#manipulating-datetime\\n\") +\n (\"Message: \" + error);\n};\nvar ajaxErrorHandler = function (args) {\n var error = DataUtil.getObject('error.error', args);\n if (isNullOrUndefined(error)) {\n return '';\n }\n var jsonResult = '';\n try {\n jsonResult = JSON.parse(error.responseText);\n }\n catch (_a) {\n jsonResult = '';\n }\n return 'XMLHTTPREQUEST FAILED\\n' +\n (\"Url: \" + error.responseURL + \"\\n\") +\n (\"Status: \" + error.status + \" - \" + error.statusText + \"\\n\") +\n (\"\" + (jsonResult !== '' ? 'Message: ' + jsonResult : ''));\n};\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\nimport { isNullOrUndefined, setValue, getValue, defaultCurrencyCode } from '@syncfusion/ej2-base';\nimport { Component, ChildProperty, Browser, closest, extend } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, append, remove, classList, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { Property, Collection, Complex, Event, NotifyPropertyChanges, L10n } from '@syncfusion/ej2-base';\nimport { EventHandler, KeyboardEvents } from '@syncfusion/ej2-base';\nimport { DataManager, DataUtil, UrlAdaptor } from '@syncfusion/ej2-data';\nimport { createSpinner, hideSpinner, showSpinner, Tooltip } from '@syncfusion/ej2-popups';\nimport { iterateArrayOrObject, prepareColumns, parentsUntil, wrap, templateCompiler, isGroupAdaptive, refreshForeignData, getScrollBarWidth } from './util';\nimport { getRowHeight, setColumnIndex, Global, ispercentageWidth, getNumberFormat, getTransformValues } from './util';\nimport { setRowElements, resetRowIndex, compareChanges, getCellByColAndRowIndex, performComplexDataOperation } from './util';\nimport * as events from '../base/constant';\nimport { Render } from '../renderer/render';\nimport { Column } from '../models/column';\nimport { RenderType } from './enum';\nimport { RowRenderer } from '../renderer/row-renderer';\nimport { CellRenderer } from '../renderer/cell-renderer';\nimport { CellRendererFactory } from '../services/cell-render-factory';\nimport { ServiceLocator } from '../services/service-locator';\nimport { ValueFormatter } from '../services/value-formatter';\nimport { RendererFactory } from '../services/renderer-factory';\nimport { ColumnWidthService } from '../services/width-controller';\nimport { AriaService } from '../services/aria-service';\nimport { FocusStrategy } from '../services/focus-strategy';\nimport { PageSettings } from '../models/page-settings';\nimport { ColumnChooserSettings } from '../models/column-chooser-settings';\nimport { Selection } from '../actions/selection';\nimport { Search } from '../actions/search';\nimport { ShowHide } from '../actions/show-hide';\nimport { Scroll } from '../actions/scroll';\nimport { Print } from '../actions/print';\nimport { AggregateRow } from '../models/aggregate';\nimport { Clipboard } from '../actions/clipboard';\nimport { Logger } from '../actions/logger';\nimport { RowModelGenerator } from '../services/row-model-generator';\nimport { SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport * as literals from '../base/string-literals';\nimport { HeaderCellRenderer } from '../renderer/header-cell-renderer';\n/**\n * Represents the field name and direction of sort column.\n */\nvar SortDescriptor = /** @class */ (function (_super) {\n __extends(SortDescriptor, _super);\n function SortDescriptor() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], SortDescriptor.prototype, \"field\", void 0);\n __decorate([\n Property()\n ], SortDescriptor.prototype, \"direction\", void 0);\n __decorate([\n Property(false)\n ], SortDescriptor.prototype, \"isFromGroup\", void 0);\n return SortDescriptor;\n}(ChildProperty));\nexport { SortDescriptor };\n/**\n * Configures the sorting behavior of Grid.\n */\nvar SortSettings = /** @class */ (function (_super) {\n __extends(SortSettings, _super);\n function SortSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Collection([], SortDescriptor)\n ], SortSettings.prototype, \"columns\", void 0);\n __decorate([\n Property(true)\n ], SortSettings.prototype, \"allowUnsort\", void 0);\n return SortSettings;\n}(ChildProperty));\nexport { SortSettings };\n/**\n * Represents the predicate for the filter column.\n */\nvar Predicate = /** @class */ (function (_super) {\n __extends(Predicate, _super);\n function Predicate() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], Predicate.prototype, \"field\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"operator\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"value\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"matchCase\", void 0);\n __decorate([\n Property(false)\n ], Predicate.prototype, \"ignoreAccent\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"predicate\", void 0);\n __decorate([\n Property({})\n ], Predicate.prototype, \"actualFilterValue\", void 0);\n __decorate([\n Property({})\n ], Predicate.prototype, \"actualOperator\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"type\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"ejpredicate\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"uid\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"isForeignKey\", void 0);\n __decorate([\n Property()\n ], Predicate.prototype, \"condition\", void 0);\n return Predicate;\n}(ChildProperty));\nexport { Predicate };\n/**\n * Configures the infinite scroll behavior of Grid.\n */\nvar InfiniteScrollSettings = /** @class */ (function (_super) {\n __extends(InfiniteScrollSettings, _super);\n function InfiniteScrollSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], InfiniteScrollSettings.prototype, \"enableCache\", void 0);\n __decorate([\n Property(3)\n ], InfiniteScrollSettings.prototype, \"maxBlocks\", void 0);\n __decorate([\n Property(3)\n ], InfiniteScrollSettings.prototype, \"initialBlocks\", void 0);\n return InfiniteScrollSettings;\n}(ChildProperty));\nexport { InfiniteScrollSettings };\n/**\n * Configures the filtering behavior of the Grid.\n */\nvar FilterSettings = /** @class */ (function (_super) {\n __extends(FilterSettings, _super);\n function FilterSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Collection([], Predicate)\n ], FilterSettings.prototype, \"columns\", void 0);\n __decorate([\n Property('FilterBar')\n ], FilterSettings.prototype, \"type\", void 0);\n __decorate([\n Property('OnEnter')\n ], FilterSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(true)\n ], FilterSettings.prototype, \"showFilterBarStatus\", void 0);\n __decorate([\n Property(1500)\n ], FilterSettings.prototype, \"immediateModeDelay\", void 0);\n __decorate([\n Property()\n ], FilterSettings.prototype, \"operators\", void 0);\n __decorate([\n Property(false)\n ], FilterSettings.prototype, \"ignoreAccent\", void 0);\n __decorate([\n Property(false)\n ], FilterSettings.prototype, \"enableInfiniteScrolling\", void 0);\n __decorate([\n Property(50)\n ], FilterSettings.prototype, \"itemsCount\", void 0);\n __decorate([\n Property('Shimmer')\n ], FilterSettings.prototype, \"loadingIndicator\", void 0);\n __decorate([\n Property(false)\n ], FilterSettings.prototype, \"enableCaseSensitivity\", void 0);\n __decorate([\n Property(false)\n ], FilterSettings.prototype, \"showFilterBarOperator\", void 0);\n return FilterSettings;\n}(ChildProperty));\nexport { FilterSettings };\n/**\n * Configures the selection behavior of the Grid.\n */\nvar SelectionSettings = /** @class */ (function (_super) {\n __extends(SelectionSettings, _super);\n function SelectionSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Row')\n ], SelectionSettings.prototype, \"mode\", void 0);\n __decorate([\n Property('Flow')\n ], SelectionSettings.prototype, \"cellSelectionMode\", void 0);\n __decorate([\n Property('Single')\n ], SelectionSettings.prototype, \"type\", void 0);\n __decorate([\n Property(false)\n ], SelectionSettings.prototype, \"checkboxOnly\", void 0);\n __decorate([\n Property(false)\n ], SelectionSettings.prototype, \"persistSelection\", void 0);\n __decorate([\n Property('Default')\n ], SelectionSettings.prototype, \"checkboxMode\", void 0);\n __decorate([\n Property(false)\n ], SelectionSettings.prototype, \"enableSimpleMultiRowSelection\", void 0);\n __decorate([\n Property(true)\n ], SelectionSettings.prototype, \"enableToggle\", void 0);\n __decorate([\n Property(false)\n ], SelectionSettings.prototype, \"allowColumnSelection\", void 0);\n return SelectionSettings;\n}(ChildProperty));\nexport { SelectionSettings };\n/**\n * Configures the search behavior of the Grid.\n */\nvar SearchSettings = /** @class */ (function (_super) {\n __extends(SearchSettings, _super);\n function SearchSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property([])\n ], SearchSettings.prototype, \"fields\", void 0);\n __decorate([\n Property('')\n ], SearchSettings.prototype, \"key\", void 0);\n __decorate([\n Property('contains')\n ], SearchSettings.prototype, \"operator\", void 0);\n __decorate([\n Property(true)\n ], SearchSettings.prototype, \"ignoreCase\", void 0);\n __decorate([\n Property(false)\n ], SearchSettings.prototype, \"ignoreAccent\", void 0);\n return SearchSettings;\n}(ChildProperty));\nexport { SearchSettings };\n/**\n * Configures the row drop settings of the Grid.\n */\nvar RowDropSettings = /** @class */ (function (_super) {\n __extends(RowDropSettings, _super);\n function RowDropSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property()\n ], RowDropSettings.prototype, \"targetID\", void 0);\n return RowDropSettings;\n}(ChildProperty));\nexport { RowDropSettings };\n/**\n * Configures the text wrap settings of the Grid.\n */\nvar TextWrapSettings = /** @class */ (function (_super) {\n __extends(TextWrapSettings, _super);\n function TextWrapSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Both')\n ], TextWrapSettings.prototype, \"wrapMode\", void 0);\n return TextWrapSettings;\n}(ChildProperty));\nexport { TextWrapSettings };\n/**\n * Configures the resize behavior of the Grid.\n */\nvar ResizeSettings = /** @class */ (function (_super) {\n __extends(ResizeSettings, _super);\n function ResizeSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Normal')\n ], ResizeSettings.prototype, \"mode\", void 0);\n return ResizeSettings;\n}(ChildProperty));\nexport { ResizeSettings };\n/**\n * Configures the group behavior of the Grid.\n */\nvar GroupSettings = /** @class */ (function (_super) {\n __extends(GroupSettings, _super);\n function GroupSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(true)\n ], GroupSettings.prototype, \"showDropArea\", void 0);\n __decorate([\n Property(false)\n ], GroupSettings.prototype, \"allowReordering\", void 0);\n __decorate([\n Property(false)\n ], GroupSettings.prototype, \"showToggleButton\", void 0);\n __decorate([\n Property(false)\n ], GroupSettings.prototype, \"showGroupedColumn\", void 0);\n __decorate([\n Property(true)\n ], GroupSettings.prototype, \"showUngroupButton\", void 0);\n __decorate([\n Property(false)\n ], GroupSettings.prototype, \"disablePageWiseAggregates\", void 0);\n __decorate([\n Property([])\n ], GroupSettings.prototype, \"columns\", void 0);\n __decorate([\n Property()\n ], GroupSettings.prototype, \"captionTemplate\", void 0);\n __decorate([\n Property(false)\n ], GroupSettings.prototype, \"enableLazyLoading\", void 0);\n return GroupSettings;\n}(ChildProperty));\nexport { GroupSettings };\n/**\n * Configures the edit behavior of the Grid.\n */\nvar EditSettings = /** @class */ (function (_super) {\n __extends(EditSettings, _super);\n function EditSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], EditSettings.prototype, \"allowAdding\", void 0);\n __decorate([\n Property(false)\n ], EditSettings.prototype, \"allowEditing\", void 0);\n __decorate([\n Property(false)\n ], EditSettings.prototype, \"allowDeleting\", void 0);\n __decorate([\n Property('Normal')\n ], EditSettings.prototype, \"mode\", void 0);\n __decorate([\n Property(true)\n ], EditSettings.prototype, \"allowEditOnDblClick\", void 0);\n __decorate([\n Property(true)\n ], EditSettings.prototype, \"showConfirmDialog\", void 0);\n __decorate([\n Property(false)\n ], EditSettings.prototype, \"showDeleteConfirmDialog\", void 0);\n __decorate([\n Property()\n ], EditSettings.prototype, \"template\", void 0);\n __decorate([\n Property()\n ], EditSettings.prototype, \"headerTemplate\", void 0);\n __decorate([\n Property()\n ], EditSettings.prototype, \"footerTemplate\", void 0);\n __decorate([\n Property('Top')\n ], EditSettings.prototype, \"newRowPosition\", void 0);\n __decorate([\n Property({})\n ], EditSettings.prototype, \"dialog\", void 0);\n __decorate([\n Property(false)\n ], EditSettings.prototype, \"allowNextRowEdit\", void 0);\n __decorate([\n Property(false)\n ], EditSettings.prototype, \"showAddNewRow\", void 0);\n return EditSettings;\n}(ChildProperty));\nexport { EditSettings };\n/**\n * Configures the Loading Indicator of the Grid.\n */\nvar LoadingIndicator = /** @class */ (function (_super) {\n __extends(LoadingIndicator, _super);\n function LoadingIndicator() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('Spinner')\n ], LoadingIndicator.prototype, \"indicatorType\", void 0);\n return LoadingIndicator;\n}(ChildProperty));\nexport { LoadingIndicator };\n/**\n * Represents the Grid component.\n * ```html\n *
    \n * \n * ```\n */\nvar Grid = /** @class */ (function (_super) {\n __extends(Grid, _super);\n /**\n * Constructor for creating the component\n *\n * @param {GridModel} options - specifies the options\n * @param {string | HTMLElement} element - specifies the element\n * @hidden\n */\n function Grid(options, element) {\n var _this_1 = _super.call(this, options, element) || this;\n _this_1.isPreventScrollEvent = false;\n _this_1.inViewIndexes = [];\n _this_1.keyA = false;\n _this_1.frozenRightCount = 0;\n _this_1.freezeColumnRefresh = true;\n _this_1.rightcount = 0;\n _this_1.frozenLeftCount = 0;\n _this_1.leftcount = 0;\n _this_1.tablesCount = 1;\n _this_1.movableCount = 0;\n _this_1.movablecount = 0;\n _this_1.fixedcount = 0;\n _this_1.fixedCount = 0;\n _this_1.visibleFrozenLeft = 0;\n _this_1.visibleFrozenFixed = 0;\n _this_1.isPreparedFrozenColumns = false;\n _this_1.visibleFrozenRight = 0;\n _this_1.visibleMovable = 0;\n _this_1.frozenLeftColumns = [];\n _this_1.frozenRightColumns = [];\n _this_1.movableColumns = [];\n _this_1.fixedColumns = [];\n _this_1.stackedLeft = [];\n _this_1.stackedRight = [];\n _this_1.stackedFixed = [];\n _this_1.stackedMovable = [];\n _this_1.stackedarrayLeft = [];\n _this_1.stackedarrayRight = [];\n _this_1.stackedarrayFixed = [];\n _this_1.stackedarrayMovable = [];\n _this_1.media = {};\n _this_1.autoFitColumnsResize = false;\n /** @hidden */\n _this_1.tableIndex = 0;\n _this_1.componentRefresh = Component.prototype.refresh;\n _this_1.isChangeDataSourceCall = false;\n _this_1.mergedColumns = false;\n /** @hidden */\n _this_1.isVirtualAdaptive = false;\n /** @hidden */\n /**\n * * If `requireTemplateRef` is set to false in the load event, then the template element can't be accessed in grid queryCellInfo, and rowDataBound events.\n * * By default, React's grid queryCellInfo and rowDataBound events allow access to the template element.\n * * Avoid accessing the template elements in the grid queryCellInfo and rowDataBound events to improve rendering performance by setting this value as false.\n *\n * @default true\n */\n _this_1.requireTemplateRef = true;\n /** @hidden */\n _this_1.vRows = [];\n /** @hidden */\n _this_1.vcRows = [];\n /** @hidden */\n _this_1.vGroupOffsets = {};\n /** @hidden */\n _this_1.rowUid = 0;\n /** @hidden */\n _this_1.translateX = 0;\n /** @hidden */\n _this_1.isManualRefresh = false;\n /** @hidden */\n _this_1.isAutoFitColumns = false;\n /** @hidden */\n _this_1.enableDeepCompare = false;\n /** @hidden */\n _this_1.totalDataRecordsCount = 0;\n /** @hidden */\n _this_1.disableSelectedRecords = [];\n /** @hidden */\n _this_1.partialSelectedRecords = [];\n /** @hidden */\n _this_1.isSpan = false;\n /** @hidden */\n _this_1.islazyloadRequest = false;\n /** @hidden */\n _this_1.isAddNewRow = false;\n /** @hidden */\n _this_1.addNewRowFocus = true;\n /** @hidden */\n _this_1.lockcolPositionCount = 0;\n /** @hidden */\n _this_1.prevPageMoving = false;\n /** @hidden */\n _this_1.pageTemplateChange = false;\n /** @hidden */\n _this_1.isAutoGen = false;\n /** @hidden */\n _this_1.isAutoGenerateColumns = false;\n _this_1.mediaBindInstance = {};\n /** @hidden */\n _this_1.commandDelIndex = undefined;\n /** @hidden */\n _this_1.asyncTimeOut = 50;\n /** @hidden */\n _this_1.isExportGrid = false;\n _this_1.enableLogger = false;\n _this_1.needsID = true;\n Grid_1.Inject(Selection);\n setValue('mergePersistData', _this_1.mergePersistGridData, _this_1);\n return _this_1;\n }\n Grid_1 = Grid;\n /**\n * Get the properties to be maintained in the persisted state.\n *\n * @returns {string} returns the persist data\n */\n Grid.prototype.getPersistData = function () {\n var keyEntity = ['pageSettings', 'sortSettings',\n 'filterSettings', 'groupSettings', 'columns', 'searchSettings', 'selectedRowIndex', 'scrollPosition'];\n var ignoreOnPersist = {\n pageSettings: ['template', 'pageSizes', 'enableQueryString', 'totalRecordsCount', 'pageCount'],\n filterSettings: ['type', 'mode', 'showFilterBarStatus', 'immediateModeDelay', 'ignoreAccent'],\n groupSettings: ['showDropArea', 'showToggleButton', 'showGroupedColumn', 'showUngroupButton',\n 'disablePageWiseAggregates', 'hideCaptionCount'],\n searchSettings: ['fields', 'operator', 'ignoreCase'],\n sortSettings: [], columns: [], selectedRowIndex: [], scrollPosition: []\n };\n for (var i = 0; i < keyEntity.length; i++) {\n var currentObject = this[keyEntity[parseInt(i.toString(), 10)]];\n for (var _i = 0, _a = ignoreOnPersist[keyEntity[parseInt(i.toString(), 10)]]; _i < _a.length; _i++) {\n var val = _a[_i];\n delete currentObject[\"\" + val];\n }\n }\n var temp = this.pageSettings.template;\n var settings = Object.assign({ template: undefined }, this.pageSettings);\n this.setProperties({ pageSettings: settings }, true);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.isAngular) {\n delete this.groupSettings['properties']['captionTemplate'];\n }\n this.pageTemplateChange = !isNullOrUndefined(this.pagerTemplate);\n var persistData = this.addOnPersist(keyEntity);\n settings.template = temp;\n this.setProperties({ pageSettings: settings }, true);\n return persistData;\n };\n /**\n * To provide the array of modules needed for component rendering\n *\n * @returns {ModuleDeclaration[]} Returns the module Declaration\n * @hidden\n */\n Grid.prototype.requiredModules = function () {\n this.setFrozenCount();\n this.enableInfiniteAggrgate();\n var modules = [];\n if (this.isDestroyed) {\n return modules;\n }\n if (this.allowFiltering) {\n modules.push({\n member: 'filter',\n args: [this, this.filterSettings, this.serviceLocator],\n name: 'Filter'\n });\n }\n if (this.allowExcelExport) {\n modules.push({\n member: 'ExcelExport',\n args: [this, this.serviceLocator],\n name: 'ExcelExport'\n });\n }\n if (this.allowPdfExport) {\n modules.push({\n member: 'PdfExport',\n args: [this],\n name: 'PdfExport'\n });\n }\n if (this.allowSorting) {\n modules.push({\n member: 'sort',\n args: [this, this.sortSettings, this.sortedColumns, this.serviceLocator],\n name: 'Sort'\n });\n }\n if (this.allowPaging) {\n modules.push({\n member: 'pager',\n args: [this, this.pageSettings],\n name: 'Page'\n });\n }\n if (this.allowSelection) {\n modules.push({\n member: 'selection',\n args: [this, this.selectionSettings, this.serviceLocator],\n name: 'Selection'\n });\n }\n if (this.resizeCheck()) {\n modules.push({\n member: 'resize',\n args: [this],\n name: 'Resize'\n });\n }\n if (this.allowReordering) {\n modules.push({\n member: 'reorder',\n args: [this],\n name: 'Reorder'\n });\n }\n if (this.allowRowDragAndDrop) {\n modules.push({\n member: 'rowDragAndDrop',\n args: [this],\n name: 'RowDD'\n });\n }\n if (this.allowGrouping) {\n modules.push({\n member: 'group',\n args: [this, this.groupSettings, this.sortedColumns, this.serviceLocator],\n name: 'Group'\n });\n }\n if (this.aggregates.length) {\n modules.push({ member: 'aggregate', args: [this, this.serviceLocator], name: 'Aggregate' });\n }\n if (this.isDetail()) {\n modules.push({\n member: 'detailRow',\n args: [this, this.serviceLocator],\n name: 'DetailRow'\n });\n }\n if (this.toolbar || this.toolbarTemplate) {\n modules.push({\n member: 'toolbar',\n args: [this, this.serviceLocator],\n name: 'Toolbar'\n });\n }\n if (this.enableVirtualization || this.enableColumnVirtualization) {\n modules.push({\n member: 'virtualscroll',\n args: [this, this.serviceLocator],\n name: 'VirtualScroll'\n });\n }\n if (this.getFrozenColumns() || this.frozenRows || this.frozenRightCount || this.frozenLeftCount) {\n modules.push({ member: 'freeze', args: [this, this.serviceLocator], name: 'Freeze' });\n }\n if (this.isCommandColumn(this.columns)) {\n modules.push({\n member: 'commandColumn',\n args: [this, this.serviceLocator],\n name: 'CommandColumn'\n });\n }\n if (this.editSettings.allowAdding || this.editSettings.allowDeleting || this.editSettings.allowEditing) {\n modules.push({\n member: 'edit',\n args: [this, this.serviceLocator],\n name: 'Edit'\n });\n }\n this.extendRequiredModules(modules);\n return modules;\n };\n Grid.prototype.extendRequiredModules = function (modules) {\n if (this.enableInfiniteScrolling) {\n modules.push({\n member: 'infiniteScroll',\n args: [this, this.serviceLocator],\n name: 'InfiniteScroll'\n });\n }\n if (this.groupSettings.enableLazyLoading) {\n modules.push({\n member: 'lazyLoadGroup',\n args: [this, this.serviceLocator],\n name: 'LazyLoadGroup'\n });\n }\n if (this.contextMenuItems) {\n modules.push({\n member: 'contextMenu',\n args: [this, this.serviceLocator],\n name: 'ContextMenu'\n });\n }\n if (this.showColumnMenu) {\n modules.push({\n member: 'columnMenu',\n args: [this, this.serviceLocator],\n name: 'ColumnMenu'\n });\n }\n if (this.showColumnChooser) {\n modules.push({\n member: 'columnChooser',\n args: [this, this.serviceLocator],\n name: 'ColumnChooser'\n });\n }\n if (this.isForeignKeyEnabled(this.columns)) {\n modules.push({ member: 'foreignKey', args: [this, this.serviceLocator], name: 'ForeignKey' });\n }\n if (this.enableLogger) {\n modules.push({ member: 'logger', args: [this], name: 'Logger' });\n }\n };\n Grid.prototype.resizeCheck = function () {\n var autoFitColumns = this.getColumns().filter(function (c) { return c.autoFit === true; }).length ? true : false;\n if (!isNullOrUndefined(this.columnModel) && this.columnModel.length && !(this.columnModel[0] instanceof Column)) {\n this.columnModel = [];\n }\n var columnMenu = this.showColumnMenu && (!this.columnMenuItems || this.columnMenuItems\n .filter(function (c) { return c === 'AutoFit' || c === 'AutoFitAll'; }).length) ? true : false;\n var contextMenu = this.contextMenuItems && this.contextMenuItems\n .filter(function (c) { return c === 'AutoFit' || c === 'AutoFitAll'; }).length ? true : false;\n return this.allowResizing || this.autoFitColumnsResize || autoFitColumns || columnMenu || contextMenu;\n };\n /**\n * For internal use only - Initialize the event handler;\n *\n * @returns {void}\n * @private\n */\n Grid.prototype.preRender = function () {\n this.serviceLocator = new ServiceLocator;\n this.initProperties();\n this.initializeServices();\n };\n Grid.prototype.initProperties = function () {\n this.isInitial = true;\n this.sortedColumns = [];\n this.inViewIndexes = [];\n this.mediaCol = [];\n this.isInitialLoad = false;\n this.allowServerDataBinding = false;\n this.ignoreCollectionWatch = true;\n this.mergeCells = {};\n this.isEdit = false;\n this.checkAllRows = 'None';\n this.isCheckBoxSelection = false;\n this.isPersistSelection = false;\n this.componentRefresh = Component.prototype.refresh;\n this.freezeColumnRefresh = true;\n this.filterOperators = {\n contains: 'contains', endsWith: 'endswith', equal: 'equal', greaterThan: 'greaterthan', greaterThanOrEqual: 'greaterthanorequal',\n lessThan: 'lessthan', lessThanOrEqual: 'lessthanorequal', notEqual: 'notequal', startsWith: 'startswith', wildCard: 'wildcard',\n isNull: 'isnull', notNull: 'notnull', like: 'like'\n };\n this.defaultLocale = {\n EmptyRecord: 'No records to display',\n True: 'true',\n False: 'false',\n InvalidFilterMessage: 'Invalid Filter Data',\n GroupDropArea: 'Drag a column header here to group its column',\n UnGroup: 'Click here to ungroup',\n UnGroupButton: 'Click here to ungroup',\n GroupDisable: 'Grouping is disabled for this column',\n FilterbarTitle: '\\'s filter bar cell',\n EmptyDataSourceError: 'DataSource must not be empty at initial load since columns are generated from dataSource in AutoGenerate Column Grid',\n // Toolbar Items\n Add: 'Add',\n Edit: 'Edit',\n Cancel: 'Cancel',\n Update: 'Update',\n Delete: 'Delete',\n Print: 'Print',\n Pdfexport: 'PDF Export',\n Excelexport: 'Excel Export',\n Wordexport: 'Word Export',\n Csvexport: 'CSV Export',\n Search: 'Search',\n Columnchooser: 'Columns',\n Save: 'Save',\n Item: 'item',\n Items: 'items',\n EditOperationAlert: 'No records selected for edit operation',\n DeleteOperationAlert: 'No records selected for delete operation',\n SaveButton: 'Save',\n OKButton: 'OK',\n CancelButton: 'Cancel',\n EditFormTitle: 'Details of ',\n AddFormTitle: 'Add New Record',\n BatchSaveConfirm: 'Are you sure you want to save changes?',\n BatchSaveLostChanges: 'Unsaved changes will be lost. Are you sure you want to continue?',\n ConfirmDelete: 'Are you sure you want to Delete Record?',\n CancelEdit: 'Are you sure you want to Cancel the changes?',\n ChooseColumns: 'Choose Column',\n ColumnMenu: 'Column Menu',\n SearchColumns: 'search columns',\n Matchs: 'No matches found',\n FilterButton: 'Filter',\n ClearButton: 'Clear',\n StartsWith: 'Starts With',\n NotStartsWith: 'Does Not Start With',\n Like: 'Like',\n EndsWith: 'Ends With',\n NotEndsWith: 'Does Not End With',\n Contains: 'Contains',\n NotContains: 'Does Not Contain',\n IsNull: 'Null',\n NotNull: 'Not Null',\n IsEmpty: 'Empty',\n IsNotEmpty: 'Not Empty',\n Equal: 'Equal',\n NotEqual: 'Not Equal',\n LessThan: 'Less Than',\n LessThanOrEqual: 'Less Than Or Equal',\n GreaterThan: 'Greater Than',\n GreaterThanOrEqual: 'Greater Than Or Equal',\n ChooseDate: 'Choose a Date',\n EnterValue: 'Enter the value',\n Copy: 'Copy',\n Group: 'Group by this column',\n Ungroup: 'Ungroup by this column',\n GroupButton: 'Group button',\n UnGroupAria: 'ungroup button',\n GroupSeperator: 'Separator for the grouped columns',\n UnGroupIcon: 'ungroup the grouped column ',\n GroupedSortIcon: 'sort the grouped column ',\n GroupedDrag: 'Drag the grouped column',\n GroupCaption: ' is groupcaption cell',\n CheckBoxLabel: 'checkbox',\n SelectAllCheckbox: 'Select all checkbox',\n SelectRow: 'Select row',\n autoFitAll: 'Autofit all columns',\n autoFit: 'Autofit this column',\n AutoFitAll: 'Autofit all columns',\n AutoFit: 'Autofit this column',\n Export: 'Export',\n FirstPage: 'First Page',\n LastPage: 'Last Page',\n PreviousPage: 'Previous Page',\n NextPage: 'Next Page',\n SortAscending: 'Sort Ascending',\n SortDescending: 'Sort Descending',\n EditRecord: 'Edit Record',\n DeleteRecord: 'Delete Record',\n FilterMenu: 'Filter',\n SelectAll: 'Select All',\n AddCurrentSelection: 'Add current selection to filter',\n Blanks: 'Blanks',\n FilterTrue: 'True',\n FilterFalse: 'False',\n NoResult: 'No matches found',\n ClearFilter: 'Clear Filter',\n Clear: 'Clear',\n NumberFilter: 'Number Filters',\n TextFilter: 'Text Filters',\n DateFilter: 'Date Filters',\n DateTimeFilter: 'DateTime Filters',\n MatchCase: 'Match Case',\n Between: 'Between',\n CustomFilter: 'Custom Filter',\n CustomFilterPlaceHolder: 'Enter the value',\n CustomFilterDatePlaceHolder: 'Choose a date',\n AND: 'AND',\n OR: 'OR',\n ShowRowsWhere: 'Show rows where:',\n ToolbarMenuDialogARIA: 'Toolbar menu dialog',\n FilterMenuDialogARIA: 'Filter menu',\n ExcelFilterDialogARIA: 'Excel filter',\n CheckBoxFilterDialogARIA: 'Checkbox filter',\n DialogEditARIA: 'Edit dialog',\n ColumnMenuDialogARIA: 'Column menu dialog',\n CustomFilterDialogARIA: 'Customer filter dialog',\n SortAtoZ: 'Sort A to Z',\n SortZtoA: 'Sort Z to A',\n SortByOldest: 'Sort by Oldest',\n SortByNewest: 'Sort by Newest',\n SortSmallestToLargest: 'Sort Smallest to Largest',\n SortLargestToSmallest: 'Sort Largest to Smallest',\n Sort: 'Sort',\n FilterDescription: 'Press Alt Down to open filter Menu',\n SortDescription: 'Press Enter to sort',\n ColumnMenuDescription: 'Press Alt Down to open Column Menu',\n GroupDescription: 'Press Ctrl space to group',\n ColumnHeader: ' column header ',\n TemplateCell: ' is template cell',\n CommandColumnAria: 'is Command column column header ',\n DialogEdit: 'Dialog edit',\n ClipBoard: 'clipboard',\n AscendingText: 'Ascending',\n DescendingText: 'Descending',\n NoneText: 'None',\n Expanded: 'Expanded',\n Collapsed: 'Collapsed'\n };\n this.keyConfigs = {\n downArrow: 'downarrow',\n upArrow: 'uparrow',\n rightArrow: 'rightarrow',\n leftArrow: 'leftarrow',\n shiftDown: 'shift+downarrow',\n shiftUp: 'shift+uparrow',\n shiftRight: 'shift+rightarrow',\n shiftLeft: 'shift+leftarrow',\n home: 'home',\n end: 'end',\n escape: 'escape',\n ctrlHome: 'ctrl+home',\n ctrlEnd: 'ctrl+end',\n pageUp: 'pageup',\n pageDown: 'pagedown',\n ctrlAltPageUp: 'ctrl+alt+pageup',\n ctrlAltPageDown: 'ctrl+alt+pagedown',\n altPageUp: 'alt+pageup',\n altPageDown: 'alt+pagedown',\n altDownArrow: 'alt+downarrow',\n altUpArrow: 'alt+uparrow',\n ctrlDownArrow: 'ctrl+downarrow',\n ctrlUpArrow: 'ctrl+uparrow',\n ctrlPlusA: 'ctrl+A',\n ctrlPlusP: 'ctrl+P',\n insert: 'insert',\n delete: 'delete',\n f2: 'f2',\n enter: 'enter',\n ctrlEnter: 'ctrl+enter',\n shiftEnter: 'shift+enter',\n tab: 'tab',\n shiftTab: 'shift+tab',\n space: 'space',\n ctrlPlusC: 'ctrl+C',\n ctrlShiftPlusH: 'ctrl+shift+H',\n ctrlSpace: 'ctrl+space',\n ctrlLeftArrow: 'ctrl+leftarrow',\n ctrlRightArrow: 'ctrl+rightarrow'\n };\n };\n /**\n * For internal use only - To Initialize the component rendering.\n *\n * @returns {void}\n * @private\n */\n Grid.prototype.render = function () {\n this.log(['module_missing', 'promise_enabled', 'locale_missing', 'check_datasource_columns']);\n this.ariaService.setOptions(this.element, { role: 'grid' });\n createSpinner({ target: this.element, cssClass: this.cssClass ? this.cssClass : null }, this.createElement);\n this.renderModule = new Render(this, this.serviceLocator);\n this.searchModule = new Search(this);\n this.scrollModule = new Scroll(this);\n this.notify(events.initialLoad, {});\n if ((this.getDataModule().dataManager.dataSource.offline === true || this.getDataModule().dataManager.dataSource.url === undefined)\n && !(!isNullOrUndefined(this.dataSource) && this.dataSource.result)) {\n this.isVirtualAdaptive = true;\n }\n if (this.isReact) {\n var args = { requireTemplateRef: this.requireTemplateRef };\n this.trigger(events.load, args);\n if (!args.requireTemplateRef) {\n this.requireTemplateRef = args.requireTemplateRef;\n }\n }\n else {\n this.trigger(events.load);\n }\n prepareColumns(this.columns, this.enableColumnVirtualization, this);\n if (this.enableColumnVirtualization && this.isChangeDataSourceCall && this.columnModel) {\n this.columnModel = [];\n this.updateColumnModel(this.columns);\n }\n this.isPreparedFrozenColumns = true;\n if (this.enablePersistence) {\n this.notify(events.columnsPrepared, {});\n }\n this.getMediaColumns();\n setColumnIndex(this.columns);\n if (this.isFrozenGrid() && !this.mergedColumns) {\n this.setInitialFrozenColumnIndex(this.columns);\n }\n this.checkLockColumns(this.columns);\n this.getColumns();\n this.processModel();\n this.gridRender();\n this.wireEvents();\n this.addListener();\n this.updateDefaultCursor();\n this.updateStackedFilter();\n if (this.loadingIndicator.indicatorType === 'Spinner') {\n this.showSpinner();\n }\n this.notify(events.initialEnd, {});\n if (this.loadingIndicator.indicatorType === 'Shimmer') {\n this.refreshMaskRow();\n }\n if (this.refreshing) {\n this.trigger('created');\n }\n };\n Grid.prototype.setInitialFrozenColumnIndex = function (columns) {\n for (var i = 0; i < columns.length; i++) {\n var column = columns[parseInt(i.toString(), 10)];\n column[\"\" + literals.initialFrozenColumnIndex] = column.index;\n if (column.columns) {\n this.setInitialFrozenColumnIndex(column.columns);\n }\n }\n };\n /**\n * By default, grid shows the spinner for all its actions. You can use this method to show spinner at your needed time.\n *\n * @returns {void}\n */\n Grid.prototype.showSpinner = function () {\n if (!this.isExportGrid) {\n showSpinner(this.element);\n }\n };\n /**\n * By default, grid shows the spinner for all its actions. You can use this method to show spinner at your needed time.\n *\n * @returns {void}\n */\n Grid.prototype.hideSpinner = function () {\n if (!this.isExportGrid) {\n hideSpinner(this.element);\n }\n };\n Grid.prototype.showMaskRow = function (axisDirection, dialogElement) {\n if (isNullOrUndefined(this.headerModule) || isNullOrUndefined(this.contentModule)) {\n return;\n }\n var gridHeader = this.getHeaderContent().firstChild;\n var gridContent = this.getContent().firstChild;\n var gridFooter = this.getFooterContent();\n if (dialogElement) {\n var dialogHolder = dialogElement.querySelector('.e-checkboxlist');\n var maskRowCount = Math.floor(dialogHolder.getBoundingClientRect().height / this.getRowHeight());\n var maskTemplate = '
    '\n + '
    '\n + this.getShimmerTemplate() + this.getShimmerTemplate() + '
    ';\n dialogHolder.innerHTML = '';\n for (var i = 0; i < maskRowCount; i++) {\n dialogHolder.innerHTML += maskTemplate;\n var maskSpan = [].slice.call(dialogHolder\n .querySelectorAll('.e-mask:not(.e-mask-checkbox-filter-intent):not(.e-mask-checkbox-filter-span-intent)'));\n maskSpan[0].classList.add('e-mask-checkbox-filter-intent');\n maskSpan[1].classList.add('e-mask-checkbox-filter-span-intent');\n }\n return;\n }\n if ((!this.enableRtl && !this.getHeaderContent().style.paddingRight)\n || (this.enableRtl && !this.getHeaderContent().style.paddingLeft)) {\n gridContent.style.overflowY = 'hidden';\n }\n if (!this.isInitialLoad && !this.getColumns().length) {\n var contentHeight = gridContent.getBoundingClientRect().height;\n var maskTableHeight = contentHeight === 0 ? this.allowPaging ? this.pageSettings.pageSize * this.getRowHeight()\n : window.innerHeight : contentHeight;\n var contentRowCount = Math.ceil(maskTableHeight / this.getRowHeight());\n if (this.rowRenderingMode !== 'Vertical') {\n this.headerMaskTable = this.createEmptyMaskTable(gridHeader, 1);\n }\n this.contentMaskTable = this.createEmptyMaskTable(gridContent, contentRowCount);\n return;\n }\n this.maskRowContentScroll = (this.enableVirtualization || this.enableColumnVirtualization) && axisDirection ? true : false;\n if (!this.contentMaskTable) {\n var content = gridContent;\n if (this.enableVirtualization || this.enableColumnVirtualization) {\n content = content.querySelector('.e-virtualtable');\n }\n if (!isNullOrUndefined(content.querySelector('tbody'))) {\n this.contentMaskTable = this.createMaskTable(content, this.getContentMaskColumns(), axisDirection);\n }\n }\n if (!this.headerMaskTable && (this.isFrozenGrid() || (this.enableColumnVirtualization && axisDirection === 'X'))) {\n var content = gridHeader;\n if (this.enableColumnVirtualization && axisDirection === 'X') {\n content = content.querySelector('.e-virtualtable');\n }\n this.headerMaskTable = this.createMaskTable(content, this.getContentMaskColumns(), axisDirection);\n }\n if (gridFooter && gridFooter.querySelector('.e-summaryrow')) {\n var gridFooterContent = gridFooter.firstChild;\n if (!this.footerContentMaskTable) {\n var footerContent = gridFooterContent;\n this.footerContentMaskTable = this.createMaskTable(footerContent);\n }\n }\n if (!(this.enableVirtualization && axisDirection)) {\n EventHandler.add(gridContent, 'scroll', this.translateMaskRow, this);\n }\n };\n Grid.prototype.getContentMaskColumns = function () {\n return this.getColumns();\n };\n Grid.prototype.createEmptyMaskTable = function (maskElement, rowCount) {\n var table = this.createElement('table', { className: 'e-table e-masked-table' });\n var tbody = this.createElement('tbody', { className: 'e-masked-tbody' });\n var row = this.createElement('tr', { className: 'e-masked-row e-row', attrs: {\n style: 'height: ' + this.getRowHeight() + 'px;'\n } });\n var cell = this.createElement('td', { className: 'e-masked-cell e-rowcell' });\n cell.innerHTML = this.getShimmerTemplate();\n row.appendChild(cell);\n for (var i = 0; i < rowCount; i++) {\n tbody.appendChild(row.cloneNode(true));\n }\n table.appendChild(tbody);\n maskElement.appendChild(table);\n return table;\n };\n Grid.prototype.createMaskTable = function (element, columns, axisDirection) {\n var parentElement = element;\n var header = closest(parentElement, '.e-gridheader') ? true : false;\n var content = closest(parentElement, '.e-gridcontent') ? true : false;\n var footer = closest(parentElement, '.e-gridfooter') ? true : false;\n var gridContent = this.getContent().firstChild;\n var gridContentScrollHeight = gridContent.scrollHeight;\n var table = parentElement.querySelector('table');\n var maskTable = table.cloneNode();\n maskTable.removeAttribute('role');\n maskTable.removeAttribute('id');\n maskTable.style.position = 'absolute';\n maskTable.style.zIndex = '5';\n maskTable.style.width = table.getBoundingClientRect().width + 'px';\n if (header && !(this.enableColumnVirtualization && axisDirection === 'X')) {\n maskTable.style.transform = 'translate(0px,'\n + table.querySelector('thead').getBoundingClientRect().height + 'px)';\n }\n maskTable.setAttribute('class', 'e-table e-masked-table');\n var maskColgroup = table.querySelector('colgroup').cloneNode(true);\n maskColgroup.removeAttribute('id');\n maskColgroup.setAttribute('class', 'e-masked-colgroup');\n maskTable.appendChild(maskColgroup);\n if (header && this.enableColumnVirtualization && axisDirection === 'X') {\n var row = this.createMaskRow(maskColgroup, columns);\n if (this.isFrozenGrid()) {\n var frzTd = [].slice.call(row.querySelectorAll('.e-rowcell'));\n for (var i = 0; i < frzTd.length; i++) {\n if (i < this.frozenLeftCount) {\n if (this.frozenLeftCount - 1 === i) {\n frzTd[parseInt(i.toString(), 10)].classList.add('e-freezeleftborder');\n }\n frzTd[parseInt(i.toString(), 10)].classList.add('e-leftfreeze');\n frzTd[parseInt(i.toString(), 10)].setAttribute('data-colindex', i.toString());\n frzTd[parseInt(i.toString(), 10)].style.left = (columns[parseInt(i.toString(), 10)].valueX -\n this.translateX) + 'px';\n }\n else if ((frzTd.length - this.frozenRightCount) <= i && columns[parseInt(i.toString(), 10)]) {\n if ((frzTd.length - this.frozenRightCount) === i) {\n frzTd[parseInt(i.toString(), 10)].classList.add('e-freezerightborder');\n }\n frzTd[parseInt(i.toString(), 10)].classList.add('e-rightfreeze');\n frzTd[parseInt(i.toString(), 10)].setAttribute('data-colindex', i.toString());\n frzTd[parseInt(i.toString(), 10)].style.right = (this.translateX +\n columns[parseInt(i.toString(), 10)].valueX) + 'px';\n }\n }\n }\n var thead = table.querySelector('thead');\n var rows = [].slice.call(thead.querySelectorAll('tr'));\n var maskTHead = thead.cloneNode();\n maskTHead.removeAttribute('role');\n maskTHead.setAttribute('class', 'e-masked-thead');\n var rowCount = rows.length;\n for (var i = 0; i < rowCount; i++) {\n maskTHead.appendChild(row.cloneNode(true));\n maskTHead.childNodes[parseInt(i.toString(), 10)].style\n .height = rows[parseInt(i.toString(), 10)].getBoundingClientRect().height + 'px';\n }\n maskTable.appendChild(maskTHead);\n }\n var maskTBody = table.querySelector('tbody').cloneNode();\n maskTBody.removeAttribute('role');\n maskTBody.setAttribute('class', 'e-masked-tbody');\n var tbody = table.querySelector('tbody');\n if (content || header) {\n var rowCountElement = gridContent;\n var rowCount = Math.ceil(rowCountElement.getBoundingClientRect().height / this.getRowHeight());\n if (tbody.querySelector('.e-emptyrow') || !tbody.childNodes.length || (content && this.childGrid)) {\n var row = this.createMaskRow(maskColgroup, columns);\n var altRow = row.cloneNode(true);\n altRow.classList.add('e-altrow');\n for (var i = 0; i < rowCount; i++) {\n var altNumber = 1;\n maskTBody.appendChild((i + altNumber) % 2 === 0 ? altRow.cloneNode(true) : row.cloneNode(true));\n }\n }\n else {\n var rowsQuery = 'tr:not([style*=\"display:none\"]):not([style*=\"display: none\"])';\n var rows = [].slice.call(tbody.querySelectorAll(rowsQuery));\n var addEditRow = tbody.querySelector('.e-addedrow, .e-editedrow');\n var addEditRowIndex = void 0;\n if (addEditRow) {\n addEditRowIndex = rows.indexOf(addEditRow);\n if (this.isFrozenGrid() && this.enableColumnVirtualization) {\n var frzTd = [].slice.call(rows[addEditRowIndex + 1].querySelectorAll('.e-rowcell'));\n for (var i = 0; i < frzTd.length; i++) {\n if (i < this.frozenLeftCount) {\n frzTd[parseInt(i.toString(), 10)].classList.add('e-leftfreeze');\n frzTd[parseInt(i.toString(), 10)].setAttribute('data-colindex', i.toString());\n frzTd[parseInt(i.toString(), 10)].style.left = (columns[parseInt(i.toString(), 10)].valueX - this.translateX) + 'px';\n }\n else if ((frzTd.length - this.frozenRightCount) <= i && columns[parseInt(i.toString(), 10)]) {\n frzTd[parseInt(i.toString(), 10)].classList.add('e-rightfreeze');\n frzTd[parseInt(i.toString(), 10)].setAttribute('data-colindex', i.toString());\n frzTd[parseInt(i.toString(), 10)].style.right = (this.translateX +\n columns[parseInt(i.toString(), 10)].valueX) + 'px';\n }\n }\n }\n if (addEditRow.classList.contains('e-addedrow')) {\n rows.splice(addEditRowIndex, 2);\n }\n else {\n rows.splice(addEditRowIndex, 1);\n }\n }\n rowCount = (this.enableVirtualization || this.enableColumnVirtualization) && axisDirection ? rows.length\n : rowCount <= rows.length ? rowCount : rows.length;\n for (var i = 0; i < rowCount; i++) {\n maskTBody.appendChild(this.applyMaskRow(rows[parseInt(i.toString(), 10)].cloneNode(true), rows[parseInt(i.toString(), 10)].getBoundingClientRect().height));\n }\n if (addEditRow && addEditRow.classList.contains('e-editedrow') && addEditRowIndex < rowCount) {\n var addEditMaskRow = maskTBody.childNodes[parseInt(addEditRowIndex.toString(), 10)];\n addEditMaskRow.style.height = this.getRowHeight() + 'px';\n addEditMaskRow.classList.add('e-row');\n if (addEditRow.classList.contains('e-altrow')) {\n addEditMaskRow.classList.add('e-altrow');\n }\n }\n }\n }\n maskTable.appendChild(maskTBody);\n if (footer) {\n var tfoot = table.querySelector('tfoot');\n var maskTFoot = tfoot.cloneNode();\n maskTFoot.setAttribute('class', 'e-masked-tfoot');\n var rows = [].slice.call(tfoot.querySelectorAll('tr'));\n for (var i = 0; i < rows.length; i++) {\n maskTFoot.appendChild(this.applyMaskRow(rows[parseInt(i.toString(), 10)].cloneNode(true), rows[parseInt(i.toString(), 10)].getBoundingClientRect().height));\n }\n maskTable.appendChild(maskTFoot);\n }\n if (header && this.isFrozenGrid() && !this.enableColumnVirtualization) {\n this.getHeaderContent().querySelector('.' + literals.headerContent).style.position = 'relative';\n }\n parentElement.insertBefore(maskTable, parentElement.firstChild);\n if (content && !(this.enableVirtualization && axisDirection)) {\n var minScrollTop = gridContentScrollHeight - maskTable.getBoundingClientRect().height;\n minScrollTop = minScrollTop < 0 ? 0 : minScrollTop;\n var scrollTop = gridContent.scrollTop <= minScrollTop ? gridContent.scrollTop : minScrollTop;\n if (this.enableVirtualization) {\n scrollTop -= getTransformValues(closest(parentElement, '.e-virtualtable')).height;\n }\n maskTable.style.transform = 'translate(0px,' + scrollTop + 'px)';\n }\n return maskTable;\n };\n Grid.prototype.applyMaskRow = function (row, rowHeight) {\n var maskRow = row;\n maskRow.removeAttribute('role');\n maskRow.removeAttribute('aria-rowindex');\n maskRow.removeAttribute('data-rowindex');\n maskRow.removeAttribute('data-uid');\n maskRow.classList.add('e-masked-row');\n maskRow.style.height = rowHeight + 'px';\n var maskCells = [].slice.call(maskRow.childNodes);\n for (var i = 0; i < maskCells.length; i++) {\n var maskCell = maskCells[parseInt(i.toString(), 10)];\n var displayAsCheckBoxCell = maskCell.firstChild && maskCell.firstChild.classList\n && maskCell.firstChild.classList.contains('e-checkbox-wrapper');\n maskCell.removeAttribute('role');\n maskCell.removeAttribute('tabindex');\n maskCell.removeAttribute('aria-label');\n if (this.enableColumnVirtualization && maskCell.classList.contains('e-fixedfreeze')) {\n removeClass([maskCell], ['e-fixedfreeze', 'e-freezeleftborder', 'e-freezerightborder']);\n addClass([maskCell], ['e-unfreeze']);\n }\n if (!(this.enableColumnVirtualization && (maskCell.classList.contains('e-leftfreeze') ||\n maskCell.classList.contains('e-rightfreeze')))) {\n maskCell.removeAttribute('data-colindex');\n }\n maskCell.removeAttribute('aria-colindex');\n maskCell.removeAttribute('index');\n maskCell.removeAttribute('ej-mappingname');\n maskCell.removeAttribute('ej-mappingvalue');\n maskCell.removeAttribute('e-mappinguid');\n maskCell.removeAttribute('aria-expanded');\n maskCell.classList.add('e-masked-cell');\n maskCell.innerHTML = this.getShimmerTemplate();\n if (maskCell.classList.contains('e-recordplusexpand') || maskCell.classList.contains('e-recordpluscollapse')) {\n maskCell.firstChild.classList.add('e-mask-group-intent');\n }\n else if (maskCell.classList.contains('e-gridchkbox') || displayAsCheckBoxCell) {\n maskCell.firstChild.classList.add('e-mask-checkbox-intent');\n }\n else if (maskCell.classList.contains('e-rowdragdrop')) {\n maskCell.firstChild.classList.add('e-mask-drag-intent');\n }\n else if (maskCell.classList.contains('e-indentcell')) {\n maskCell.innerHTML = '';\n }\n }\n return maskRow;\n };\n Grid.prototype.createMaskRow = function (refColgroup, refColumns) {\n var colgroup = refColgroup;\n var columns = refColumns;\n var row = this.createElement('tr', { className: 'e-masked-row e-row' });\n if (this.rowRenderingMode !== 'Vertical') {\n row.style.height = this.getRowHeight() + 'px';\n }\n var td = this.createElement('td', { className: 'e-masked-cell e-rowcell' });\n for (var i = 0, colIndex = 0; i < colgroup.childNodes.length; i++) {\n var col = colgroup.childNodes[parseInt(i.toString(), 10)];\n var localTD = td.cloneNode();\n localTD.innerHTML = this.getShimmerTemplate();\n if (!(col.classList.contains('e-group-intent') || col.classList.contains('e-detail-intent')\n || col.classList.contains('e-drag-intent'))) {\n if (this.rowRenderingMode === 'Vertical' && columns[parseInt(colIndex.toString(), 10)]) {\n localTD.setAttribute('data-cell', columns[parseInt(colIndex.toString(), 10)].headerText ?\n columns[parseInt(colIndex.toString(), 10)].headerText : columns[parseInt(colIndex.toString(), 10)].field);\n }\n if (col.style.display === 'none') {\n localTD.classList.add('e-hide');\n }\n else {\n localTD.style.textAlign = columns[parseInt(colIndex.toString(), 10)]\n && columns[parseInt(colIndex.toString(), 10)].textAlign ?\n columns[parseInt(colIndex.toString(), 10)].textAlign.toLowerCase()\n : this.enableRtl ? 'right' : 'left';\n if (columns[parseInt(colIndex.toString(), 10)] && (columns[parseInt(colIndex.toString(), 10)].type === 'checkbox'\n || columns[parseInt(colIndex.toString(), 10)].displayAsCheckBox)) {\n localTD.firstChild.classList.add('e-mask-checkbox-intent');\n }\n }\n colIndex++;\n }\n else {\n if (col.classList.contains('e-group-intent')) {\n localTD.firstChild.classList.add('e-mask-group-intent');\n }\n else if (col.classList.contains('e-detail-intent')) {\n localTD.firstChild.classList.add('e-mask-detail-intent');\n }\n else if (col.classList.contains('e-drag-intent')) {\n localTD.firstChild.classList.add('e-mask-drag-intent');\n }\n }\n row.appendChild(localTD);\n }\n return row;\n };\n Grid.prototype.getShimmerTemplate = function () {\n if (this.maskRowContentScroll) {\n return '';\n }\n return '';\n };\n Grid.prototype.addShimmerEffect = function () {\n this.maskRowContentScroll = false;\n var maskSpan = [].slice.call(this.element.querySelectorAll('.e-mask:not(.e-shimmer-wave)'));\n for (var i = 0; i < maskSpan.length; i++) {\n if (maskSpan[parseInt(i.toString(), 10)]) {\n maskSpan[parseInt(i.toString(), 10)].classList.add('e-shimmer-wave');\n }\n }\n };\n Grid.prototype.translateMaskRow = function (e) {\n var target = e.target;\n var maskTables = target.querySelectorAll('.e-masked-table');\n for (var i = 0; i < maskTables.length; i++) {\n var maskTable = maskTables[parseInt(i.toString(), 10)];\n if (maskTable) {\n var minScrollTop = target.scrollHeight - maskTable.getBoundingClientRect().height;\n minScrollTop = minScrollTop < 0 ? 0 : minScrollTop;\n var scrollTop = target.scrollTop <= minScrollTop ? target.scrollTop : minScrollTop;\n if (this.enableVirtualization) {\n scrollTop -= getTransformValues(closest(maskTable, '.e-virtualtable')).height;\n }\n maskTable.style.transform = 'translate(0px,' + scrollTop + 'px)';\n }\n }\n };\n Grid.prototype.removeMaskRow = function () {\n if (!isNullOrUndefined(this.contentModule)) {\n var gridContent = this.getContent().firstChild;\n EventHandler.remove(gridContent, 'scroll', this.translateMaskRow);\n }\n if (this.headerMaskTable && this.isFrozenGrid() && !this.enableColumnVirtualization) {\n this.getHeaderContent().querySelector('.' + literals.headerContent).style.position = '';\n }\n var maskTables = [this.headerMaskTable,\n this.contentMaskTable, this.footerContentMaskTable];\n for (var i = 0; i < maskTables.length; i++) {\n var maskTable = maskTables[parseInt(i.toString(), 10)];\n if (maskTable) {\n remove(maskTable);\n }\n }\n this.headerMaskTable = null;\n this.contentMaskTable = null;\n this.footerContentMaskTable = null;\n };\n Grid.prototype.refreshMaskRow = function () {\n var gridContent = this.getContent().firstChild;\n if (!this.isInitialLoad && !this.getColumns().length) {\n return;\n }\n if (this.contentMaskTable && gridContent.querySelector('.e-masked-table')) {\n var content = gridContent;\n if (this.enableVirtualization) {\n content = content.querySelector('.e-virtualtable');\n }\n this.refreshMaskRowColgroupWidth(content);\n }\n };\n Grid.prototype.refreshMaskRowColgroupWidth = function (content) {\n var table = content.querySelector('table:not(.e-masked-table)');\n var colgroup = table.querySelector(literals.colGroup).cloneNode(true);\n var maskTable = content.querySelector('.e-masked-table');\n colgroup.removeAttribute('id');\n colgroup.setAttribute('class', 'e-masked-colgroup');\n for (var i = 0; i < colgroup.childNodes.length; i++) {\n colgroup.childNodes[parseInt(i.toString(), 10)].removeAttribute('class');\n }\n remove(maskTable.querySelector('.e-masked-colgroup'));\n maskTable.insertBefore(colgroup, maskTable.firstChild);\n maskTable.style.width = table.getBoundingClientRect().width + 'px';\n };\n Grid.prototype.updateStackedFilter = function () {\n if (this.allowFiltering && this.filterSettings.type === 'FilterBar' &&\n this.getHeaderContent().getElementsByClassName('e-stackedheadercell').length) {\n this.getHeaderContent().classList.add('e-stackedfilter');\n }\n else {\n this.getHeaderContent().classList.remove('e-stackedfilter');\n }\n };\n Grid.prototype.getMediaColumns = function () {\n if (!this.enableColumnVirtualization) {\n var gcol = this.getColumns();\n this.getShowHideService = this.serviceLocator.getService('showHideService');\n if (!isNullOrUndefined(gcol)) {\n for (var index = 0; index < gcol.length; index++) {\n if (!isNullOrUndefined(gcol[parseInt(index.toString(), 10)].hideAtMedia)\n && (isNullOrUndefined(gcol[parseInt(index.toString(), 10)].visible)\n || gcol[parseInt(index.toString(), 10)].visible)) {\n this.pushMediaColumn(gcol[parseInt(index.toString(), 10)], index);\n }\n }\n }\n }\n this.updateFrozenColumnsWidth();\n };\n Grid.prototype.pushMediaColumn = function (col, index) {\n this.mediaCol.push(col);\n this.media[col.uid] = window.matchMedia(col.hideAtMedia);\n this.mediaQueryUpdate(index, this.media[col.uid]);\n this.mediaBindInstance[parseInt(index.toString(), 10)] = this.mediaQueryUpdate.bind(this, index);\n this.media[col.uid].addListener(this.mediaBindInstance[parseInt(index.toString(), 10)]);\n };\n /**\n * @param {Column} col - specifies the column\n * @returns {void}\n * @hidden\n */\n Grid.prototype.updateMediaColumns = function (col) {\n if (!this.enableColumnVirtualization) {\n var index = this.getColumnIndexByUid(col.uid);\n for (var i = 0; i < this.mediaCol.length; i++) {\n if (col.uid === this.mediaCol[parseInt(i.toString(), 10)].uid) {\n this.mediaCol.splice(i, 1);\n return;\n }\n }\n this.pushMediaColumn(col, index);\n }\n };\n /**\n * @param {number} columnIndex - specifies the column index\n * @param {MediaQueryList} e - specifies the MediaQueryList\n * @returns {void}\n * @hidden\n */\n Grid.prototype.mediaQueryUpdate = function (columnIndex, e) {\n var col = this.getColumns()[parseInt(columnIndex.toString(), 10)];\n if (this.mediaCol.some(function (mediaColumn) { return mediaColumn.uid === col.uid; })) {\n col.visible = e.matches;\n if (this.isInitialLoad) {\n this.invokedFromMedia = true;\n if (col.visible) {\n this.showHider.show(col.headerText, 'headerText');\n }\n else {\n this.showHider.hide(col.headerText, 'headerText');\n }\n }\n }\n };\n Grid.prototype.refreshMediaCol = function () {\n this.isInitialLoad = true;\n var footerContent = this.element.querySelector('.' + literals.gridFooter);\n if (this.aggregates.length && this.element.scrollHeight > parseInt(this.height.toString(), 10) && footerContent) {\n addClass([footerContent], ['e-footerpadding']);\n }\n var checkboxColumn = this.getColumns().filter(function (col) { return col.type === 'checkbox'; });\n if (checkboxColumn.length === 0 || checkboxColumn.length && this.selectionSettings.checkboxMode === 'ResetOnRowClick') {\n this.isCheckBoxSelection = false;\n }\n if (this.rowRenderingMode === 'Vertical') {\n if (this.enableHover) {\n this.setProperties({ enableAdaptiveUI: true, enableHover: false }, true);\n removeClass([this.element], 'e-gridhover');\n }\n }\n if (this.enableAdaptiveUI && this.scrollModule) {\n this.scrollModule.refresh();\n }\n if (this.isFrozenGrid() && this.isAutoGenerateColumns) {\n this.widthService.setWidthToColumns();\n this.isAutoGenerateColumns = false;\n }\n };\n Grid.prototype.removeMediaListener = function () {\n for (var i = 0; i < this.mediaCol.length; i++) {\n this.media[this.mediaCol[parseInt(i.toString(), 10)].uid]\n .removeListener(this.mediaBindInstance[this.mediaCol[parseInt(i.toString(), 10)].index]);\n }\n };\n /**\n * For internal use only - Initialize the event handler\n *\n * @returns {void}\n * @private\n */\n Grid.prototype.eventInitializer = function () {\n //eventInitializer\n };\n /**\n * Destroys the component (detaches/removes all event handlers, attributes, classes, and empties the component element).\n *\n * @function destroy\n * @returns {void}\n */\n Grid.prototype.destroy = function () {\n var gridElement = this.element;\n if (!gridElement) {\n return;\n }\n var hasGridChild = gridElement.querySelector('.' + literals.gridHeader) &&\n gridElement.querySelector('.' + literals.gridContent) ? true : false;\n if (hasGridChild) {\n this.unwireEvents();\n }\n this.removeListener();\n this.removeMediaListener();\n this.notify(events.destroy, {});\n this.destroyDependentModules();\n if (this.isReact) {\n this.destroyTemplate(['template']);\n }\n if (this.isVue) {\n this.destroyTemplate();\n }\n if (hasGridChild) {\n _super.prototype.destroy.call(this);\n }\n this.toolTipObj.destroy();\n if (this.isReact && !Browser.isIE) {\n this.element.innerHTML = '';\n }\n var modules = ['renderModule', 'headerModule', 'contentModule', 'valueFormatterService',\n 'serviceLocator', 'ariaService', 'keyboardModule', 'widthService', 'searchModule', 'showHider',\n 'scrollModule', 'printModule', 'clipboardModule', 'focusModule'];\n for (var i = 0; i < modules.length; i++) {\n if (this[modules[parseInt(i.toString(), 10)]]) {\n this[modules[parseInt(i.toString(), 10)]] = null;\n }\n }\n this.element.innerHTML = '';\n classList(this.element, [], ['e-rtl', 'e-gridhover', 'e-responsive', 'e-default', 'e-device', 'e-grid-min-height']);\n };\n Grid.prototype.destroyDependentModules = function () {\n var gridElement = this.element;\n if (!gridElement || (!gridElement.querySelector('.' + literals.gridHeader) && !gridElement.querySelector('.' + literals.gridContent))) {\n return;\n }\n this.scrollModule.destroy();\n this.keyboardModule.destroy();\n this.focusModule.destroy();\n this.clipboardModule.destroy();\n this.printModule.destroy();\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n Grid.prototype.getModuleName = function () {\n return 'grid';\n };\n Grid.prototype.enableBoxSelection = function () {\n if (this.enableAutoFill) {\n this.selectionSettings.cellSelectionMode = 'BoxWithBorder';\n this.element.classList.add('e-afenabled');\n }\n else {\n this.element.classList.remove('e-afenabled');\n this.notify(events.destroyAutoFillElements, {});\n }\n };\n Grid.prototype.setCSSClass = function (oldCSSClass) {\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n if (oldCSSClass) {\n removeClass([this.element], oldCSSClass.split(' '));\n }\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {GridModel} newProp - Defines new properties\n * @param {GridModel} oldProp - Defines old properties\n * @returns {void}\n * @hidden\n */\n Grid.prototype.onPropertyChanged = function (newProp, oldProp) {\n var requireRefresh = false;\n var requireGridRefresh = false;\n var freezeRefresh = false;\n var checkCursor;\n var args = { requestType: 'refresh' };\n var childGridParent = null;\n var parentInstance = null;\n if (this.isDestroyed) {\n return;\n }\n this.log('module_missing');\n if (this.isEllipsisTooltip()) {\n this.toolTipObj.close();\n }\n var properties = Object.keys(newProp);\n if (properties.indexOf('columns') > -1) {\n if (this.enableColumnVirtualization) {\n this.columnModel = [];\n }\n this.updateColumnObject();\n requireGridRefresh = true;\n }\n for (var _i = 0, properties_1 = properties; _i < properties_1.length; _i++) {\n var prop = properties_1[_i];\n switch (prop) {\n case 'allowPaging':\n this.notify(events.uiUpdate, { module: 'pager', enable: this.allowPaging });\n requireRefresh = true;\n if (this.height === '100%') {\n this.scrollModule.refresh();\n }\n break;\n case 'pageSettings':\n if (this.pageTemplateChange) {\n this.pageTemplateChange = false;\n this.notify(events.inBoundModelChanged, { module: 'pager', properties: newProp.pageSettings });\n break;\n }\n if (this.pagerModule && this.pagerModule.isCancel) {\n this.pagerModule.isCancel = false;\n return;\n }\n this.notify(events.inBoundModelChanged, { module: 'pager', properties: newProp.pageSettings });\n if (isNullOrUndefined(newProp.pageSettings.currentPage) && isNullOrUndefined(newProp.pageSettings.pageSize)\n && isNullOrUndefined(newProp.pageSettings.totalRecordsCount)\n || !isNullOrUndefined(oldProp.pageSettings) &&\n ((newProp.pageSettings.currentPage !== oldProp.pageSettings.currentPage)\n && !this.enableColumnVirtualization && !this.enableVirtualization\n && this.pageSettings.totalRecordsCount <= this.pageSettings.pageSize)) {\n requireRefresh = true;\n }\n if (this.pagerModule && this.pagerModule.isCancel) {\n this.pagerModule.isCancel = false;\n }\n break;\n case 'allowSorting':\n this.notify(events.uiUpdate, { module: 'sort', enable: this.allowSorting });\n requireRefresh = true;\n checkCursor = true;\n break;\n case 'allowFiltering':\n this.updateStackedFilter();\n this.notify(events.uiUpdate, { module: 'filter', enable: this.allowFiltering });\n requireRefresh = true;\n if (this.filterSettings.type !== 'FilterBar' || (this.editSettings.showAddNewRow && this.filterSettings.type === 'FilterBar')) {\n this.refreshHeader();\n }\n else {\n if (this.height === '100%') {\n this.scrollModule.refresh();\n }\n }\n break;\n case 'height':\n case 'width':\n this.notify(events.uiUpdate, { module: 'scroll', properties: { width: newProp.width, height: newProp.height } });\n if (this.allowPaging) {\n this.pagerModule.refresh();\n }\n break;\n case 'allowReordering':\n this.headerModule.refreshUI();\n checkCursor = true;\n break;\n case 'allowRowDragAndDrop':\n this.notify(events.uiUpdate, { module: 'rowDragAndDrop', enable: this.allowRowDragAndDrop });\n this.renderModule.refresh();\n this.headerModule.refreshUI();\n break;\n case 'allowSelection':\n this.notify(events.uiUpdate, { module: 'selection', enable: this.allowSelection });\n break;\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n case 'enableAutoFill':\n if (this.selectionModule) {\n this.enableBoxSelection();\n this.selectionModule.updateAutoFillPosition();\n }\n break;\n case 'rowTemplate':\n this.rowTemplateFn = templateCompiler(this.rowTemplate);\n requireRefresh = true;\n break;\n case 'emptyRecordTemplate':\n this.emptyRecordTemplateFn = templateCompiler(this.emptyRecordTemplate);\n requireRefresh = true;\n break;\n case 'detailTemplate':\n this.detailTemplateFn = templateCompiler(this.detailTemplate);\n requireRefresh = true;\n break;\n case 'allowGrouping':\n this.notify(events.uiUpdate, { module: 'group', enable: this.allowGrouping });\n this.headerModule.refreshUI();\n requireRefresh = true;\n checkCursor = true;\n if (this.height === '100%') {\n this.scrollModule.refresh();\n }\n break;\n case 'enableInfiniteScrolling':\n case 'childGrid':\n requireRefresh = true;\n childGridParent = this.parentDetails ? document.querySelector(\"#\" + this.parentDetails.parentID) : null;\n parentInstance = childGridParent ? childGridParent.ej2_instances[0] : null;\n if (this.childGrid && parentInstance && isNullOrUndefined(parentInstance.childGrid.childGrid)) {\n var childGridObject = Object.assign({}, parentInstance.childGrid, { childGrid: newProp.childGrid });\n parentInstance.setProperties({ childGrid: childGridObject }, true);\n while (!isNullOrUndefined(parentInstance.parentDetails)) {\n var currentParent = document.querySelector(\"#\" + parentInstance.parentDetails.parentID);\n var currentParentInstance = currentParent ? currentParent.ej2_instances[0] : null;\n if (currentParentInstance) {\n var currentChildObject = Object.assign({}, currentParentInstance.childGrid);\n currentChildObject.childGrid = parentInstance.childGrid;\n currentParentInstance.setProperties({ childGrid: currentChildObject }, true);\n }\n parentInstance = currentParentInstance;\n }\n }\n this.headerModule.refreshUI();\n break;\n case 'toolbar':\n this.notify(events.uiUpdate, { module: 'toolbar' });\n if (this.height === '100%') {\n this.scrollModule.refresh();\n }\n break;\n case 'groupSettings':\n this.notify(events.inBoundModelChanged, {\n module: 'group', properties: newProp.groupSettings,\n oldProperties: oldProp.groupSettings\n });\n break;\n case 'aggregates':\n if (!this.aggregates.length && this.allowGrouping && this.groupSettings.columns.length) {\n requireRefresh = true;\n }\n this.notify(events.uiUpdate, { module: 'aggregate', properties: newProp });\n if (this.height === '100%') {\n this.scrollModule.refresh();\n }\n break;\n case 'frozenColumns':\n case 'frozenRows':\n case 'enableVirtualization':\n case 'enableColumnVirtualization':\n case 'currencyCode':\n case 'locale':\n if (this.isFrozenGrid()) {\n this.log('frozen_rows_columns');\n }\n freezeRefresh = true;\n requireGridRefresh = true;\n this.addNewRowFocus = true;\n break;\n case 'query':\n if (!this.getDataModule().isQueryInvokedFromData) {\n requireRefresh = true;\n }\n this.getDataModule().isQueryInvokedFromData = false;\n break;\n case 'autoFit':\n if (this.autoFit) {\n this.preventAdjustColumns();\n }\n else {\n this.restoreAdjustColumns();\n }\n break;\n default:\n this.extendedPropertyChange(prop, newProp, requireGridRefresh);\n }\n }\n if (checkCursor) {\n this.updateDefaultCursor();\n }\n if (requireGridRefresh) {\n if (freezeRefresh || this.getFrozenColumns() || this.frozenRows\n || (this.frozenLeftColumns.length || this.frozenRightColumns.length)) {\n this.freezeRefresh();\n }\n else {\n this.refresh();\n }\n }\n else if (requireRefresh) {\n this.notify(events.modelChanged, args);\n requireRefresh = false;\n this.maintainSelection(newProp.selectedRowIndex);\n }\n };\n Grid.prototype.extendedPropertyChange = function (prop, newProp, requireGridRefresh) {\n switch (prop) {\n case 'enableRtl':\n this.updateRTL();\n if (this.allowPaging) {\n this.element.querySelector('.e-gridpager').ej2_instances[0].enableRtl = newProp.enableRtl;\n this.element.querySelector('.e-gridpager').ej2_instances[0].dataBind();\n }\n if (this.height !== 'auto') {\n this.scrollModule.removePadding(!newProp.enableRtl);\n this.scrollModule.setPadding();\n }\n if (this.toolbar && this.toolbarModule) {\n this.toolbarModule.getToolbar().ej2_instances[0].enableRtl = newProp.enableRtl;\n this.toolbarModule.getToolbar().ej2_instances[0].dataBind();\n }\n if (this.contextMenuItems && this.contextMenuModule) {\n this.contextMenuModule.getContextMenu().ej2_instances[0].enableRtl = newProp.enableRtl;\n this.contextMenuModule.getContextMenu().ej2_instances[0].dataBind();\n }\n if (this.showColumnMenu && this.columnMenuModule && !this.enableAdaptiveUI) {\n this.columnMenuModule.getColumnMenu().ej2_instances[0].enableRtl = newProp.enableRtl;\n this.columnMenuModule.getColumnMenu().ej2_instances[0].dataBind();\n }\n if (this.filterSettings.type === 'FilterBar' && this.filterSettings.showFilterBarOperator) {\n this.refreshHeader();\n }\n this.notify(events.rtlUpdated, {});\n break;\n case 'enableAltRow':\n this.renderModule.refresh();\n break;\n case 'allowResizing':\n this.headerModule.refreshUI();\n this.updateResizeLines();\n break;\n case 'rowHeight':\n if (this.rowHeight) {\n addClass([this.element], 'e-grid-min-height');\n }\n else {\n removeClass([this.element], 'e-grid-min-height');\n }\n this.renderModule.refresh();\n this.headerModule.refreshUI();\n break;\n case 'gridLines':\n this.updateGridLines();\n break;\n case 'showColumnMenu':\n this.headerModule.refreshUI();\n this.notify(events.uiUpdate, { module: 'columnMenu', enable: true });\n break;\n case 'columnMenuItems':\n this.notify(events.uiUpdate, { module: 'columnMenu', enable: this.columnMenuItems });\n break;\n case 'contextMenuItems':\n this.notify(events.uiUpdate, { module: 'contextMenu', enable: this.contextMenuItems });\n break;\n case 'showColumnChooser':\n this.notify(events.uiUpdate, { module: 'columnChooser', enable: this.showColumnChooser });\n break;\n case 'filterSettings':\n this.updateStackedFilter();\n this.notify(events.inBoundModelChanged, { module: 'filter', properties: newProp.filterSettings });\n break;\n case 'searchSettings':\n this.notify(events.inBoundModelChanged, { module: 'search', properties: newProp.searchSettings });\n break;\n case 'sortSettings':\n this.notify(events.inBoundModelChanged, { module: 'sort' });\n break;\n case 'selectionSettings':\n this.notify(events.inBoundModelChanged, { module: 'selection', properties: newProp.selectionSettings });\n break;\n case 'editSettings':\n this.notify(events.inBoundModelChanged, { module: 'edit', properties: newProp.editSettings });\n break;\n case 'allowTextWrap':\n case 'textWrapSettings':\n if (this.allowTextWrap) {\n this.applyTextWrap();\n }\n else {\n this.removeTextWrap();\n }\n this.notify(events.freezeRender, { case: 'textwrap', isModeChg: (prop === 'textWrapSettings') });\n break;\n case 'dataSource':\n // eslint-disable-next-line no-case-declarations\n var pending_1 = this.getDataModule().getState();\n if (this.allowSelection && this.isPersistSelection && !(pending_1 && pending_1.isPending)) {\n this.clearSelection();\n }\n if (!isNullOrUndefined(this.dataSource) && this.dataSource.result) {\n this.isVirtualAdaptive = false;\n }\n if (Object.getPrototypeOf(newProp).deepWatch) {\n var pKeyField = this.getPrimaryKeyFieldNames()[0];\n for (var i = 0, props = Object.keys(newProp.dataSource); i < props.length; i++) {\n this.setRowData(getValue(pKeyField, this.dataSource[props[parseInt(i.toString(), 10)]]), this.dataSource[props[parseInt(i.toString(), 10)]]);\n }\n }\n else if (pending_1.isPending) {\n var gResult = !isNullOrUndefined(this.dataSource) ? this.dataSource.result : [];\n var names = (pending_1.group || []);\n if (names.length && !this.groupSettings.enableLazyLoading && !(gResult.length && gResult[0].field)) {\n for (var i = 0; i < names.length; i++) {\n gResult = DataUtil.group(gResult, names[parseInt(i.toString(), 10)], pending_1.aggregates || []);\n }\n }\n this.dataSource = {\n result: gResult, count: this.dataSource.count,\n aggregates: this.dataSource.aggregates\n };\n this.getDataModule().setState({});\n pending_1.resolver(this.dataSource);\n }\n else {\n if ((!isNullOrUndefined(this.dataSource) && this.dataSource.result\n && this.dataSource.count && this.groupSettings.columns.length)) {\n var gResult = this.dataSource.result;\n var names = this.groupSettings.columns;\n if (names.length && !(gResult.length && gResult[0].field)) {\n for (var i = 0; i < names.length; i++) {\n gResult = DataUtil.group(gResult, names[parseInt(i.toString(), 10)]);\n }\n }\n this.dataSource = {\n result: gResult, count: this.dataSource.count\n };\n }\n this.getDataModule().setState({ isDataChanged: false });\n this.notify(events.dataSourceModified, {});\n if (!requireGridRefresh) {\n this.renderModule.refresh();\n if (this.isCheckBoxSelection) {\n this.notify(events.beforeRefreshOnDataChange, {});\n }\n }\n }\n this.scrollRefresh();\n break;\n case 'enableHover':\n // eslint-disable-next-line no-case-declarations\n var action = newProp.enableHover ? addClass : removeClass;\n action([this.element], 'e-gridhover');\n break;\n case 'selectedRowIndex':\n if (!this.isSelectedRowIndexUpdating) {\n this.selectRow(newProp.selectedRowIndex);\n }\n this.isSelectedRowIndexUpdating = false;\n break;\n case 'resizeSettings':\n this.widthService.setWidthToTable();\n break;\n case 'enableAdaptiveUI':\n this.notify(events.setFullScreenDialog, {});\n break;\n case 'rowRenderingMode':\n this.enableVerticalRendering();\n this.notify(events.rowModeChange, {});\n this.refresh();\n break;\n case 'enableStickyHeader':\n this.scrollModule.addStickyListener(newProp.enableStickyHeader);\n break;\n }\n };\n Grid.prototype.maintainSelection = function (index) {\n var _this_1 = this;\n if (index !== -1) {\n var fn_1 = function () {\n _this_1.selectRow(index);\n _this_1.off(events.contentReady, fn_1);\n };\n this.on(events.contentReady, fn_1, this);\n }\n };\n /**\n * @param {Object} prop - Defines the property\n * @param {boolean} muteOnChange - Defines the mute on change\n * @returns {void}\n * @private\n */\n Grid.prototype.setProperties = function (prop, muteOnChange) {\n _super.prototype.setProperties.call(this, prop, muteOnChange);\n var filterSettings = 'filterSettings';\n if (prop[\"\" + filterSettings] && this.filterModule && muteOnChange) {\n this.filterModule.refreshFilter();\n }\n };\n /**\n * @hidden\n * @returns {number} - Returns the tables count\n */\n Grid.prototype.getTablesCount = function () {\n return this.tablesCount;\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.updateDefaultCursor = function () {\n var headerCells = [].slice.call(this.getHeaderContent().querySelectorAll('.e-headercell:not(.e-stackedheadercell)'));\n var stdHdrCell = [].slice.call(this.getHeaderContent().getElementsByClassName('e-stackedheadercell'));\n var cols = this.getColumns();\n for (var i = 0; i < headerCells.length; i++) {\n var cell = headerCells[parseInt(i.toString(), 10)];\n if (this.allowGrouping || this.allowReordering || this.allowSorting) {\n if (!cols[parseInt(i.toString(), 10)].allowReordering || !cols[parseInt(i.toString(), 10)].allowSorting\n || !cols[parseInt(i.toString(), 10)].allowGrouping) {\n cell.classList.add('e-defaultcursor');\n }\n else {\n cell.classList.add('e-mousepointer');\n }\n }\n }\n for (var count = 0; count < stdHdrCell.length; count++) {\n if (this.allowReordering) {\n stdHdrCell[parseInt(count.toString(), 10)].classList.add('e-mousepointer');\n }\n }\n };\n Grid.prototype.updateColumnModel = function (columns, isRecursion) {\n for (var i = 0, len = columns.length; i < len; i++) {\n if (columns[parseInt(i.toString(), 10)].columns) {\n this.updateColumnModel(columns[parseInt(i.toString(), 10)].columns, true);\n }\n else {\n this.columnModel.push(columns[parseInt(i.toString(), 10)]);\n }\n }\n if (isNullOrUndefined(isRecursion) || !isRecursion) {\n this.updateLockableColumns();\n }\n };\n Grid.prototype.getFrozenLeftCount = function () {\n return this.getFrozenColumns() || this.getFrozenLeftColumnsCount();\n };\n Grid.prototype.isFrozenGrid = function () {\n return this.getFrozenColumns() !== 0 || this.frozenLeftColumns.length !== 0 || this.frozenRightColumns.length !== 0 ||\n this.fixedColumns.length !== 0;\n };\n Grid.prototype.getFrozenMode = function () {\n return this.frozenName;\n };\n Grid.prototype.updateLockableColumns = function () {\n var cols = this.columnModel;\n var frozenCount = 0;\n var movableCount = 0;\n var frozenColumns = this.getFrozenColumns();\n for (var i = 0; i < cols.length; i++) {\n if (cols[parseInt(i.toString(), 10)].lockColumn) {\n if (i < frozenColumns) {\n cols.splice(frozenCount, 0, cols.splice(i, 1)[0]);\n frozenCount++;\n }\n else {\n cols.splice(frozenColumns + movableCount, 0, cols.splice(i, 1)[0]);\n movableCount++;\n }\n }\n }\n };\n Grid.prototype.checkLockColumns = function (cols) {\n for (var i = 0; i < cols.length; i++) {\n if (cols[parseInt(i.toString(), 10)].columns) {\n this.checkLockColumns(cols[parseInt(i.toString(), 10)].columns);\n }\n else if (cols[parseInt(i.toString(), 10)].lockColumn) {\n this.lockcolPositionCount++;\n }\n }\n };\n /**\n * @param {string} position - specifies position\n * @returns {number} returns the width\n * @hidden\n */\n Grid.prototype.leftrightColumnWidth = function (position) {\n var cols = position === 'left' ? this.getFrozenLeftColumns() : position === 'right' ? this.getFrozenRightColumns() : [];\n var width = 0;\n cols.filter(function (col) {\n if (col.visible) {\n width += parseInt(col.width.toString(), 10);\n }\n });\n return width;\n };\n /**\n * Gets the columns from the Grid.\n *\n * @param {boolean} isRefresh - Defines the boolean whether to refresh\n * @returns {Column[]} - returns the column\n */\n Grid.prototype.getColumns = function (isRefresh) {\n var _this_1 = this;\n var inview = this.inViewIndexes.map(function (v) { return v - _this_1.groupSettings.columns.length; }).filter(function (v) { return v > -1; });\n var vLen = inview.length;\n if (!this.enableColumnVirtualization || isNullOrUndefined(this.columnModel) || this.columnModel.length === 0 || isRefresh) {\n this.columnModel = [];\n this.updateColumnModel(this.columns);\n }\n var columns = vLen === 0 ? this.columnModel :\n this.columnModel.slice(inview[0], inview[vLen - 1] + 1);\n var left = [];\n var right = [];\n var movable = [];\n var isLeftRightFrozen = this.enableColumnVirtualization && this.isPreparedFrozenColumns && vLen === 0;\n if (isLeftRightFrozen) {\n this.frozenRightColumns = [];\n this.frozenLeftColumns = [];\n }\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].freeze === 'Left' || columns[parseInt(i.toString(), 10)].isFrozen) {\n left.push(columns[parseInt(i.toString(), 10)]);\n if (isLeftRightFrozen) {\n this.frozenLeftColumns.push(columns[parseInt(i.toString(), 10)]);\n }\n }\n else if (columns[parseInt(i.toString(), 10)].freeze === 'Right') {\n right.push(columns[parseInt(i.toString(), 10)]);\n if (isLeftRightFrozen) {\n this.frozenRightColumns.push(columns[parseInt(i.toString(), 10)]);\n }\n }\n else {\n movable.push(columns[parseInt(i.toString(), 10)]);\n }\n }\n if (this.enableColumnVirtualization && this.isFrozenGrid()) {\n if (this.frozenLeftColumns.length) {\n left = this.frozenLeftColumns;\n }\n if (this.frozenRightColumns.length) {\n right = this.frozenRightColumns;\n }\n }\n return left.concat(movable).concat(right);\n };\n /**\n * @private\n * @param {string} stackedHeader - Defines the stacked header\n * @param {Column[]} col - Defines the column\n * @returns {Column} Returns the Column\n */\n Grid.prototype.getStackedHeaderColumnByHeaderText = function (stackedHeader, col) {\n for (var i = 0; i < col.length; i++) {\n var individualColumn = col[parseInt(i.toString(), 10)];\n if (individualColumn.field === stackedHeader || individualColumn.headerText === stackedHeader) {\n this.stackedColumn = individualColumn;\n break;\n }\n else if (individualColumn.columns) {\n this.getStackedHeaderColumnByHeaderText(stackedHeader, individualColumn.columns);\n }\n }\n return this.stackedColumn;\n };\n /**\n * @private\n * @returns {number[]} Returns the column indexes\n */\n Grid.prototype.getColumnIndexesInView = function () {\n return this.inViewIndexes;\n };\n /**\n * @private\n * @returns {Query} - returns the query\n */\n Grid.prototype.getQuery = function () {\n return this.query;\n };\n /**\n * @private\n * @returns {object} - returns the locale constants\n */\n Grid.prototype.getLocaleConstants = function () {\n return this.defaultLocale;\n };\n /**\n * @param {number[]} indexes - specifies the indexes\n * @returns {void}\n * @private\n */\n Grid.prototype.setColumnIndexesInView = function (indexes) {\n this.inViewIndexes = indexes;\n };\n /**\n * Gets the visible columns from the Grid.\n *\n * @returns {Column[]} returns the column\n */\n Grid.prototype.getVisibleColumns = function () {\n return this.getCurrentVisibleColumns();\n };\n /**\n * Gets the header div of the Grid.\n *\n * @returns {Element} - Returns the element\n */\n Grid.prototype.getHeaderContent = function () {\n return this.headerModule.getPanel();\n };\n /**\n * Sets the header div of the Grid to replace the old header.\n *\n * @param {Element} element - Specifies the Grid header.\n *\n * @returns {void}\n */\n Grid.prototype.setGridHeaderContent = function (element) {\n this.headerModule.setPanel(element);\n };\n /**\n * Gets the content table of the Grid.\n *\n * @returns {Element} - Returns the element\n */\n Grid.prototype.getContentTable = function () {\n return this.contentModule.getTable();\n };\n /**\n * Sets the content table of the Grid to replace the old content table.\n *\n * @param {Element} element - Specifies the Grid content table.\n *\n * @returns {void}\n */\n Grid.prototype.setGridContentTable = function (element) {\n this.contentModule.setTable(element);\n };\n /**\n * Gets the content div of the Grid.\n *\n * @returns {Element} Returns the element\n */\n Grid.prototype.getContent = function () {\n return this.contentModule.getPanel();\n };\n /**\n * Sets the content div of the Grid to replace the old Grid content.\n *\n * @param {Element} element - Specifies the Grid content.\n *\n * @returns {void}\n */\n Grid.prototype.setGridContent = function (element) {\n this.contentModule.setPanel(element);\n };\n /**\n * Gets the header table element of the Grid.\n *\n * @returns {Element} returns the element\n */\n Grid.prototype.getHeaderTable = function () {\n return this.headerModule.getTable();\n };\n /**\n * Sets the header table of the Grid to replace the old one.\n *\n * @param {Element} element - Specifies the Grid header table.\n *\n * @returns {void}\n */\n Grid.prototype.setGridHeaderTable = function (element) {\n this.headerModule.setTable(element);\n };\n /**\n * Gets the footer div of the Grid.\n *\n * @returns {Element} returns the element\n */\n Grid.prototype.getFooterContent = function () {\n this.footerElement = this.element.getElementsByClassName(literals.gridFooter)[0];\n return this.footerElement;\n };\n /**\n * Gets the footer table element of the Grid.\n *\n * @returns {Element} returns the element\n */\n Grid.prototype.getFooterContentTable = function () {\n this.footerElement = this.element.getElementsByClassName(literals.gridFooter)[0];\n return this.footerElement.firstChild.firstChild;\n };\n /**\n * Gets the pager of the Grid.\n *\n * @returns {Element} returns the element\n */\n Grid.prototype.getPager = function () {\n return this.gridPager; //get element from pager\n };\n /**\n * Sets the pager of the Grid to replace the old pager.\n *\n * @param {Element} element - Specifies the Grid pager.\n *\n * @returns {void}\n */\n Grid.prototype.setGridPager = function (element) {\n this.gridPager = element;\n };\n /**\n * Gets a row by index.\n *\n * @param {number} index - Specifies the row index.\n *\n * @returns {Element} returns the element\n */\n Grid.prototype.getRowByIndex = function (index) {\n if (this.enableVirtualization && this.groupSettings.enableLazyLoading) {\n return this.lazyLoadRender.getRowByIndex(index);\n }\n else {\n return this.contentModule.getRowByIndex(index);\n }\n };\n /**\n * Gets a movable tables row by index.\n *\n * @param {number} index - Specifies the row index.\n *\n * @returns {Element} returns the element\n\n */\n Grid.prototype.getMovableRowByIndex = function (index) {\n return this.contentModule.getRowByIndex(index);\n };\n /**\n * Gets a frozen tables row by index.\n *\n * @param {number} index - Specifies the row index.\n * @returns {Element} returns the element\n\n */\n Grid.prototype.getFrozenRowByIndex = function (index) {\n return this.contentModule.getRowByIndex(index);\n };\n /**\n * Gets all the data rows of the Grid.\n *\n * @returns {Element[]} returns the element\n */\n Grid.prototype.getRows = function () {\n return this.contentModule.getRowElements();\n };\n /**\n * Gets a frozen right tables row element by index.\n *\n * @param {number} index - Specifies the row index.\n * @returns {Element} returns the element\n\n */\n Grid.prototype.getFrozenRightRowByIndex = function (index) {\n return this.contentModule.getRowByIndex(index);\n };\n /**\n * Get a row information based on cell\n *\n * @param {Element | EventTarget} target - specifies the element\n *\n * @returns {RowInfo} returns the row info\n */\n Grid.prototype.getRowInfo = function (target) {\n var ele = target;\n var args = { target: target };\n if (!isNullOrUndefined(target) && isNullOrUndefined(parentsUntil(ele, 'e-detailrowcollapse')\n && isNullOrUndefined(parentsUntil(ele, 'e-recordplusexpand')))) {\n var cell = closest(ele, '.' + literals.rowCell);\n if (!cell) {\n var row_1 = closest(ele, '.' + literals.row);\n if (!isNullOrUndefined(row_1) && !row_1.classList.contains('e-addedrow')) {\n var rowObj = this.getRowObjectFromUID(row_1.getAttribute('data-uid'));\n var rowIndex = parseInt(row_1.getAttribute(literals.dataRowIndex), 10);\n args = { row: row_1, rowData: rowObj.data, rowIndex: rowIndex };\n }\n return args;\n }\n var cellIndex = parseInt(cell.getAttribute(literals.dataColIndex), 10);\n var row_2 = closest(cell, '.' + literals.row);\n if (!isNullOrUndefined(cell) && !isNaN(cellIndex) && !isNullOrUndefined(row_2)) {\n var rowIndex = parseInt(row_2.getAttribute(literals.dataRowIndex), 10);\n var rows = this.contentModule.getRows();\n var index = cellIndex + this.getIndentCount();\n var rowsObject = rows.filter(function (r) { return r.uid === row_2.getAttribute('data-uid'); });\n var rowData = {};\n var column = void 0;\n if (Object.keys(rowsObject).length) {\n rowData = rowsObject[0].data;\n column = rowsObject[0].cells[parseInt(index.toString(), 10)].column;\n }\n args = { cell: cell, cellIndex: cellIndex, row: row_2, rowIndex: rowIndex, rowData: rowData, column: column, target: target };\n }\n }\n return args;\n };\n /**\n * Gets the Grid's movable content rows from frozen grid.\n *\n * @returns {Element[]} returns the element\n\n */\n Grid.prototype.getMovableRows = function () {\n return this.contentModule.getRowElements();\n };\n /**\n * Gets the Grid's frozen right content rows from frozen grid.\n *\n * @returns {Element[]} returns the element\n\n */\n Grid.prototype.getFrozenRightRows = function () {\n return this.contentModule.getRowElements();\n };\n /**\n * Gets all the Grid's data rows.\n *\n * @returns {Element[]} returns the element\n */\n Grid.prototype.getDataRows = function () {\n return this.getAllDataRows();\n };\n /**\n * @param {boolean} includeAdd - specifies includeAdd\n * @returns {Element[]} returns the element\n * @hidden\n */\n Grid.prototype.getAllDataRows = function (includeAdd) {\n if (isNullOrUndefined(this.getContentTable().querySelector(literals.tbody))) {\n return [];\n }\n var tbody = this.getContentTable().querySelector(literals.tbody);\n var rows = [].slice.call(tbody.children);\n if (this.editSettings.showAddNewRow) {\n if (rows[0].classList.contains('e-addedrow')) {\n rows.shift();\n }\n else if (rows[rows.length - 1].classList.contains('e-addedrow')) {\n rows.pop();\n }\n }\n if (this.frozenRows) {\n var hdrTbody = this.getHeaderTable().querySelector(literals.tbody);\n var freezeRows = [].slice.call(hdrTbody.children);\n rows = this.addMovableRows(freezeRows, rows);\n if (this.editSettings.showAddNewRow && freezeRows[0].classList.contains('e-addedrow')) {\n freezeRows.shift();\n }\n }\n var dataRows = this.generateDataRows(rows, includeAdd);\n return dataRows;\n };\n /**\n * @param {HTMLElement[]} fRows - Defines the frozen Rows\n * @param {HTMLElement[]} mrows - Defines the movable Rows\n * @returns {HTMLElement[]} Returns the element\n * @hidden\n */\n Grid.prototype.addMovableRows = function (fRows, mrows) {\n for (var i = 0, len = mrows.length; i < len; i++) {\n fRows.push(mrows[parseInt(i.toString(), 10)]);\n }\n return fRows;\n };\n Grid.prototype.generateDataRows = function (rows, includAdd) {\n var dRows = [];\n for (var i = 0, len = rows.length; i < len; i++) {\n if (rows[parseInt(i.toString(), 10)].classList.contains(literals.row)\n && (!rows[parseInt(i.toString(), 10)].classList.contains('e-hiddenrow') || includAdd)) {\n if (this.isCollapseStateEnabled()) {\n dRows[parseInt(rows[parseInt(i.toString(), 10)].getAttribute('data-rowindex'), 10)] = rows[parseInt(i.toString(), 10)];\n }\n else {\n dRows.push(rows[parseInt(i.toString(), 10)]);\n }\n }\n }\n return dRows;\n };\n /**\n * Gets all the Grid's movable table data rows.\n *\n * @returns {Element[]} Returns the element\n\n */\n Grid.prototype.getMovableDataRows = function () {\n return this.getAllMovableDataRows();\n };\n /**\n * @param {boolean} includeAdd Defines the include add in boolean\n * @returns {Element[]} Returns the element\n\n * @hidden\n */\n Grid.prototype.getAllMovableDataRows = function (includeAdd) {\n return this.getAllDataRows(includeAdd);\n };\n /**\n * Gets all the Grid's frozen table data rows.\n *\n * @returns {Element[]} returns the element\n\n */\n Grid.prototype.getFrozenDataRows = function () {\n return this.getAllFrozenDataRows();\n };\n /**\n * @param {boolean} includeAdd Defines the include add in boolean\n * @returns {Element[]} Returns the element\n\n * @hidden\n */\n Grid.prototype.getAllFrozenDataRows = function (includeAdd) {\n return this.getAllDataRows(includeAdd);\n };\n /**\n * Gets all the Grid's frozen right table data rows.\n *\n * @returns {Element[]} Returns the Element\n\n */\n Grid.prototype.getFrozenRightDataRows = function () {\n return this.getAllFrozenRightDataRows();\n };\n /**\n * @param {boolean} includeAdd Defines the include add in boolean\n * @returns {Element[]} Returns the element\n\n * @hidden\n */\n Grid.prototype.getAllFrozenRightDataRows = function (includeAdd) {\n return this.getAllDataRows(includeAdd);\n };\n /**\n * Updates particular cell value based on the given primary key value.\n * > Primary key column must be specified using `columns.isPrimaryKey` property.\n *\n * @param {string| number} key - Specifies the PrimaryKey value of dataSource.\n * @param {string } field - Specifies the field name which you want to update.\n * @param {string | number | boolean | Date} value - To update new value for the particular cell.\n *\n * @returns {void}\n */\n Grid.prototype.setCellValue = function (key, field, value) {\n var cells = 'cells';\n var rowData = 'data';\n var rowIdx = 'index';\n var rowuID = 'uid';\n var pkName = this.getPrimaryKeyFieldNames()[0];\n var cell = new CellRenderer(this, this.serviceLocator);\n var fieldIdx = this.getColumnIndexByField(field);\n var col = this.getColumnByField(field);\n var rowObjects = this.contentModule.getRows();\n var selectedRow = rowObjects.filter(function (r) {\n return getValue(pkName, r.data) === key;\n })[0];\n var tr = selectedRow ? this.element.querySelector('[data-uid=' + selectedRow[\"\" + rowuID] + ']') : null;\n if (!isNullOrUndefined(tr)) {\n if (typeof value === 'string') {\n value = this.sanitize(value);\n }\n setValue(field, value, selectedRow[\"\" + rowData]);\n var td = this.enableVirtualization ? tr.children[parseInt(fieldIdx.toString(), 10)]\n : this.getCellFromIndex(selectedRow[\"\" + rowIdx], fieldIdx);\n if (!isNullOrUndefined(td)) {\n var Idx = 0;\n if (this.groupSettings.columns.length) {\n fieldIdx = fieldIdx + this.groupSettings.columns.length;\n }\n if (this.childGrid || this.detailTemplate) {\n fieldIdx++;\n }\n if (this.isRowDragable()) {\n fieldIdx++;\n }\n var sRow = selectedRow[\"\" + cells][fieldIdx - Idx];\n cell.refreshTD(td, sRow, selectedRow[\"\" + rowData], { index: selectedRow[\"\" + rowIdx] });\n if (this.isReact) {\n td = this.enableVirtualization ? tr.children[parseInt(fieldIdx.toString(), 10)]\n : this.getCellFromIndex(selectedRow[\"\" + rowIdx], fieldIdx);\n }\n if (this.aggregates.length > 0) {\n this.notify(events.refreshFooterRenderer, {});\n if (this.groupSettings.columns.length > 0) {\n this.notify(events.groupAggregates, {});\n }\n }\n /* tslint:disable:no-string-literal */\n if (!isNullOrUndefined(selectedRow) && !isNullOrUndefined(selectedRow['changes'])) {\n selectedRow['changes'][\"\" + field] = value;\n }\n /* tslint:disable:no-string-literal */\n this.trigger(events.queryCellInfo, {\n cell: td, column: col, data: selectedRow[\"\" + rowData]\n });\n if (this.isReact && td.getAttribute('tabindex') === '0' && td.classList.contains('e-focused')) {\n td.focus();\n }\n }\n }\n else {\n return;\n }\n };\n /**\n * @param {string} columnUid - Defines column uid\n * @param {boolean} renderTemplates - Defines renderTemplates need to invoke\n * @returns {void}\n * @hidden\n */\n Grid.prototype.refreshReactColumnTemplateByUid = function (columnUid, renderTemplates) {\n var _this_1 = this;\n if (this.isReact) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.clearTemplate(['columnTemplate'], undefined, function () {\n var isChildGrid = _this_1.childGrid && _this_1.element.querySelectorAll('.e-childgrid').length ? true : false;\n var rows = isChildGrid ? _this_1.getContentTable().querySelectorAll('.e-row') :\n _this_1.getDataRows();\n _this_1.refreshReactTemplateTD(rows, isChildGrid);\n if (renderTemplates) {\n _this_1.renderTemplates();\n }\n });\n }\n };\n /**\n * @param {Element[] | NodeListOf} rows - Defines the rows\n * @param {boolean} isChildGrid - Defines whether it is a Hierarchy Grid.\n * @param {boolean} isFrozen - Defines whether it is a Frozen Grid\n * @returns {void}\n * @hidden\n */\n Grid.prototype.refreshReactTemplateTD = function (rows, isChildGrid, isFrozen) {\n var cells = 'cells';\n var rowIdx = 'index';\n var indent = this.getIndentCount();\n var childIndent = 0;\n var isChildRow = false;\n for (var j = 0; j < rows.length; j++) {\n var rowsObj = this.getRowObjectFromUID(rows[parseInt(j.toString(), 10)].getAttribute('data-uid'));\n if (isChildGrid && !rowsObj && parentsUntil(rows[parseInt(j.toString(), 10)], 'e-childgrid')) {\n var gridObj = parentsUntil(rows[parseInt(j.toString(), 10)], 'e-childgrid').ej2_instances[0];\n rowsObj = gridObj.getRowObjectFromUID(rows[parseInt(j.toString(), 10)].getAttribute('data-uid'));\n childIndent = gridObj.getIndentCount();\n isChildRow = true;\n }\n if (rowsObj && rowsObj.isDataRow && !isNullOrUndefined(rowsObj.index) &&\n !rows[parseInt(j.toString(), 10)].classList.contains('e-editedrow')) {\n for (var i = 0; i < rowsObj[\"\" + cells].length; i++) {\n var cell = rowsObj[\"\" + cells][parseInt(i.toString(), 10)];\n if (cell.isTemplate) {\n var cellRenderer = new CellRenderer(this, this.serviceLocator);\n var td = isChildGrid ? rows[parseInt(j.toString(), 10)]\n .children[cell.index + (isChildRow ? childIndent : indent)] : this.getCellFromIndex(j, isFrozen ? cell.index : i - indent);\n cellRenderer.refreshTD(td, cell, rowsObj.data, { index: rowsObj[\"\" + rowIdx] });\n }\n }\n }\n isChildRow = false;\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Grid.prototype.refreshGroupCaptionFooterTemplate = function () {\n var isChildGrid = this.childGrid && this.element.querySelectorAll('.e-childgrid').length ? true : false;\n var rows = this.getContentTable().querySelectorAll('.e-groupcaptionrow, .e-groupfooterrow');\n for (var i = 0; i < rows.length; i++) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var gridObj = this;\n var rowsObj = this.getRowObjectFromUID(rows[parseInt(i.toString(), 10)].getAttribute('data-uid'));\n if (isChildGrid && !rowsObj && parentsUntil(rows[parseInt(i.toString(), 10)], 'e-childgrid')) {\n gridObj = parentsUntil(rows[parseInt(i.toString(), 10)], 'e-childgrid').ej2_instances[0];\n rowsObj = gridObj.getRowObjectFromUID(rows[parseInt(i.toString(), 10)].getAttribute('data-uid'));\n }\n if (rowsObj) {\n var cells = rowsObj.cells.filter(function (cell) { return cell.isDataCell; });\n var args = { cells: cells, data: rowsObj.data, dataUid: rowsObj.uid };\n gridObj.notify(events.refreshAggregateCell, args);\n }\n }\n };\n /**\n * @param {string} columnUid - Defines column uid\n * @returns {void}\n * @hidden\n */\n Grid.prototype.refreshReactHeaderTemplateByUid = function (columnUid) {\n if (this.isReact) {\n var cells = 'cells';\n var rowsObj = this.headerModule.rows;\n var cellIndex = this.getNormalizedColumnIndex(columnUid);\n var _loop_1 = function (j) {\n var cell = rowsObj[parseInt(j.toString(), 10)][\"\" + cells][parseInt(cellIndex.toString(), 10)];\n if (cell && cell.column.uid === columnUid) {\n var headerCellRenderer = new HeaderCellRenderer(this_1, this_1.serviceLocator);\n var td = parentsUntil(this_1.element.querySelectorAll('[e-mappinguid=' + columnUid + ']')[0], 'e-templatecell');\n headerCellRenderer.refresh(cell, td);\n var cols = this_1.sortSettings.columns;\n var columnIndex = cols.findIndex(function (col) {\n return col.field === cell\n .column.field;\n });\n if (columnIndex !== -1) {\n var header = this_1.getColumnHeaderByField(cell.column.field);\n this_1.ariaService.setSort(header, (cols[parseInt(columnIndex.toString(), 10)].direction).toLowerCase());\n if (cols.length > 1) {\n header.querySelector('.e-headercelldiv').insertBefore(this_1.createElement('span', { className: 'e-sortnumber', innerHTML: (columnIndex + 1).toString() }), header.querySelector('.e-headertext'));\n }\n var filterElement = header.querySelector('.e-sortfilterdiv');\n if (cols[parseInt(columnIndex.toString(), 10)].direction === 'Ascending') {\n classList(filterElement, ['e-ascending', 'e-icon-ascending'], []);\n }\n else {\n classList(filterElement, ['e-descending', 'e-icon-descending'], []);\n }\n }\n }\n };\n var this_1 = this;\n for (var j = 0; j < rowsObj.length; j++) {\n _loop_1(j);\n }\n }\n };\n /**\n * Updates and refresh the particular row values based on the given primary key value.\n * > Primary key column must be specified using `columns.isPrimaryKey` property.\n *\n * @param {string| number} key - Specifies the PrimaryKey value of dataSource.\n * @param {Object} rowData - To update new data for the particular row.\n *\n * @returns {void}\n */\n Grid.prototype.setRowData = function (key, rowData) {\n var rowuID = 'uid';\n var rowObjects = this.contentModule.getRows();\n var pkName = this.getPrimaryKeyFieldNames()[0];\n if (this.groupSettings.columns.length > 0 && this.aggregates.length > 0) {\n rowObjects = rowObjects.filter(function (row) { return row.isDataRow; });\n }\n var selectedRow = rowObjects.filter(function (r) {\n return getValue(pkName, r.data) === key;\n })[0];\n var selectRowEle = selectedRow ? [].slice.call(this.element.querySelectorAll('[data-uid=' + selectedRow[\"\" + rowuID] + ']')) : undefined;\n if (!isNullOrUndefined(selectedRow) && selectRowEle.length) {\n selectedRow.changes = rowData;\n if (this.frozenRows) {\n var fRowTr = this.getRowsObject()[selectedRow.index];\n this.setFrozenRowData(fRowTr, rowData);\n }\n else {\n this.setFrozenRowData(selectedRow, rowData);\n }\n if (this.aggregates.length > 0) {\n this.notify(events.refreshFooterRenderer, {});\n if (this.groupSettings.columns.length > 0) {\n this.notify(events.groupAggregates, {});\n }\n }\n }\n else {\n return;\n }\n };\n Grid.prototype.setFrozenRowData = function (fTr, rowData) {\n var rowRenderer = new RowRenderer(this.serviceLocator, null, this);\n fTr.changes = rowData;\n refreshForeignData(fTr, this.getForeignKeyColumns(), fTr.changes);\n rowRenderer.refresh(fTr, this.getColumns(), true);\n };\n /**\n * Gets a cell by row and column index.\n *\n * @param {number} rowIndex - Specifies the row index.\n * @param {number} columnIndex - Specifies the column index.\n *\n * @returns {Element} Returns the Element\n */\n Grid.prototype.getCellFromIndex = function (rowIndex, columnIndex) {\n var col = this.getColumnByIndex(columnIndex);\n return getCellByColAndRowIndex(this, col, rowIndex, columnIndex);\n };\n /**\n * Gets a movable table cell by row and column index.\n *\n * @param {number} rowIndex - Specifies the row index.\n * @param {number} columnIndex - Specifies the column index.\n *\n * @returns {Element} Returns the Element\n\n */\n Grid.prototype.getMovableCellFromIndex = function (rowIndex, columnIndex) {\n return this.getCellFromIndex(rowIndex, columnIndex);\n };\n /**\n * Gets a frozen right table cell by row and column index.\n *\n * @param {number} rowIndex - Specifies the row index.\n * @param {number} columnIndex - Specifies the column index.\n * @returns {Element} Returns the Element\n\n */\n Grid.prototype.getFrozenRightCellFromIndex = function (rowIndex, columnIndex) {\n return this.getCellFromIndex(rowIndex, columnIndex);\n };\n /**\n * Gets a column header by column index.\n *\n * @param {number} index - Specifies the column index.\n *\n * @returns {Element} Returns the Element\n */\n Grid.prototype.getColumnHeaderByIndex = function (index) {\n return this.getHeaderTable().getElementsByClassName('e-headercell')[parseInt(index.toString(), 10)];\n };\n /**\n * Gets a movable column header by column index.\n *\n * @param {number} index - Specifies the column index.\n * @returns {Element} Returns the Element\n\n */\n Grid.prototype.getMovableColumnHeaderByIndex = function (index) {\n return this.getColumnHeaderByIndex(index);\n };\n /**\n * Gets a frozen right column header by column index.\n *\n * @param {number} index - Specifies the column index.\n * @returns {Element} Returns the Element\n\n */\n Grid.prototype.getFrozenRightColumnHeaderByIndex = function (index) {\n return this.getColumnHeaderByIndex(index);\n };\n /**\n * Gets a frozen left column header by column index.\n *\n * @param {number} index - Specifies the column index.\n * @returns {Element} Returns the Element\n\n */\n Grid.prototype.getFrozenLeftColumnHeaderByIndex = function (index) {\n return this.getColumnHeaderByIndex(index);\n };\n /**\n * @param {string} uid - Defines the uid\n * @returns {Row} Returns the row object\n * @hidden\n */\n Grid.prototype.getRowObjectFromUID = function (uid) {\n var rows = this.contentModule.getRows();\n var row = this.rowObject(rows, uid);\n if (isNullOrUndefined(row) && this.enableVirtualization && this.groupSettings.columns.length > 0) {\n row = this.rowObject(this.vRows, uid);\n return row;\n }\n return row;\n };\n Grid.prototype.rowObject = function (rows, uid) {\n if (rows) {\n for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) {\n var row = rows_1[_i];\n if (row.uid === uid) {\n return row;\n }\n }\n }\n return null;\n };\n /**\n * @hidden\n * @returns {Row[]} Returns the Row object\n */\n Grid.prototype.getRowsObject = function () {\n return this.contentModule.getRows();\n };\n /**\n * @hidden\n * @returns {Row[]} Returns the Row object\n\n */\n Grid.prototype.getMovableRowsObject = function () {\n return this.contentModule.getRows();\n };\n /**\n * @hidden\n * @returns {Row[]} Returns the Row object\n\n */\n Grid.prototype.getFrozenRightRowsObject = function () {\n return this.contentModule.getRows();\n };\n /**\n * Gets a column header by column name.\n *\n * @param {string} field - Specifies the column name.\n *\n * @returns {Element} - Returns the element\n */\n Grid.prototype.getColumnHeaderByField = function (field) {\n var column = this.getColumnByField(field);\n return column ? this.getColumnHeaderByUid(column.uid) : undefined;\n };\n /**\n * Gets a column header by UID.\n *\n * @param {string} uid - Specifies the column uid.\n *\n * @returns {Element} - Returns the element\n */\n Grid.prototype.getColumnHeaderByUid = function (uid) {\n var element = this.getHeaderContent().querySelector('[e-mappinguid=' + uid + ']');\n return element ? element.parentElement : undefined;\n };\n /**\n * @hidden\n * @param {number} index - Defines the index\n * @returns {Column} Returns the column\n */\n Grid.prototype.getColumnByIndex = function (index) {\n var column;\n this.getColumns().some(function (col, i) {\n column = col;\n return i === index;\n });\n return column;\n };\n /**\n * Gets a Column by column name.\n *\n * @param {string} field - Specifies the column name.\n *\n * @returns {Column} Returns the column\n */\n Grid.prototype.getColumnByField = function (field) {\n return iterateArrayOrObject(this.getColumns(), function (item) {\n if (item.field === field) {\n return item;\n }\n return undefined;\n })[0];\n };\n /**\n * Gets a column index by column name.\n *\n * @param {string} field - Specifies the column name.\n *\n * @returns {number} Returns the index by field\n */\n Grid.prototype.getColumnIndexByField = function (field) {\n var cols = this.getColumns();\n for (var i = 0; i < cols.length; i++) {\n if (cols[parseInt(i.toString(), 10)].field === field) {\n return i;\n }\n }\n return -1;\n };\n /**\n * Gets a column by UID.\n *\n * @param {string} uid - Specifies the column UID.\n *\n * @returns {Column} Returns the column\n */\n Grid.prototype.getColumnByUid = function (uid) {\n return iterateArrayOrObject(this.getColumns().concat(this.getStackedColumns(this.columns)), function (item) {\n if (item.uid === uid) {\n return item;\n }\n return undefined;\n })[0];\n };\n /**\n * @param {Column[]} columns - Defines the columns\n * @param {Column[]} stackedColumn - Defines the stacked columns\n * @returns {Column[]} Returns the columns\n * @hidden\n */\n Grid.prototype.getStackedColumns = function (columns, stackedColumn) {\n if (stackedColumn === void 0) { stackedColumn = []; }\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var column = columns_1[_i];\n if (column.columns) {\n stackedColumn.push(column);\n this.getStackedColumns(column.columns, stackedColumn);\n }\n }\n return stackedColumn;\n };\n /**\n * Gets a column index by UID.\n *\n * @param {string} uid - Specifies the column UID.\n *\n * @returns {number} Returns the column by index\n */\n Grid.prototype.getColumnIndexByUid = function (uid) {\n var index = iterateArrayOrObject(this.getColumns(), function (item, index) {\n if (item.uid === uid) {\n return index;\n }\n return undefined;\n })[0];\n return !isNullOrUndefined(index) ? index : -1;\n };\n /**\n * Gets UID by column name.\n *\n * @param {string} field - Specifies the column name.\n *\n * @returns {string} Returns the column by field\n */\n Grid.prototype.getUidByColumnField = function (field) {\n return iterateArrayOrObject(this.getColumns(), function (item) {\n if (item.field === field) {\n return item.uid;\n }\n return undefined;\n })[0];\n };\n /**\n * Gets column index by column uid value.\n *\n * @private\n * @param {string} uid - Specifies the column uid.\n * @returns {number} Returns the column by field\n */\n Grid.prototype.getNormalizedColumnIndex = function (uid) {\n var index = this.getColumnIndexByUid(uid);\n return index + this.getIndentCount();\n };\n /**\n * Gets indent cell count.\n *\n * @private\n * @returns {number} Returns the indent count\n */\n Grid.prototype.getIndentCount = function () {\n var index = 0;\n if (this.allowGrouping) {\n index += this.groupSettings.columns.length;\n }\n if (this.isDetail()) {\n index++;\n }\n if (this.isRowDragable() && isNullOrUndefined(this.rowDropSettings.targetID)) {\n index++;\n }\n /**\n * TODO: index normalization based on the stacked header, grouping and detailTemplate\n * and frozen should be handled here\n */\n return index;\n };\n /**\n * Gets the collection of column fields.\n *\n * @returns {string[]} Returns the Field names\n */\n Grid.prototype.getColumnFieldNames = function () {\n var columnNames = [];\n var column;\n for (var i = 0, len = this.getColumns().length; i < len; i++) {\n column = this.getColumns()[parseInt(i.toString(), 10)];\n if (column.visible) {\n columnNames.push(column.field);\n }\n }\n return columnNames;\n };\n /**\n * Gets a compiled row template.\n *\n * @returns {Function} Returns the row TEmplate\n * @private\n */\n Grid.prototype.getRowTemplate = function () {\n return this.rowTemplateFn;\n };\n /**\n * Gets a compiled empty Record template.\n *\n * @returns {Function} Returns the empty Record template\n * @private\n */\n Grid.prototype.getEmptyRecordTemplate = function () {\n return this.emptyRecordTemplateFn;\n };\n /**\n * Gets a compiled detail row template.\n *\n * @private\n * @returns {Function} Returns the Detail template\n */\n Grid.prototype.getDetailTemplate = function () {\n return this.detailTemplateFn;\n };\n /**\n * Gets a compiled detail row template.\n *\n * @private\n * @returns {Function}Returns the Edit template\n */\n Grid.prototype.getEditTemplate = function () {\n return this.editTemplateFn;\n };\n /**\n * Gets a compiled dialog edit header template.\n *\n * @private\n * @returns {Function} returns template function\n */\n Grid.prototype.getEditHeaderTemplate = function () {\n return this.editHeaderTemplateFn;\n };\n /**\n * Gets a compiled dialog edit footer template.\n *\n * @private\n * @returns {Function} Returns the Footer template\n */\n Grid.prototype.getEditFooterTemplate = function () {\n return this.editFooterTemplateFn;\n };\n /**\n * Get the names of the primary key columns of the Grid.\n *\n * @returns {string[]} Returns the field names\n */\n Grid.prototype.getPrimaryKeyFieldNames = function () {\n var keys = [];\n for (var k = 0; k < this.columnModel.length; k++) {\n if (this.columnModel[parseInt(k.toString(), 10)].isPrimaryKey) {\n keys.push(this.columnModel[parseInt(k.toString(), 10)].field);\n }\n }\n return keys;\n };\n /**\n * Refreshes the Grid header and content.\n *\n * @returns {void}\n */\n Grid.prototype.refresh = function () {\n if (!this.isDestroyed) {\n this.isManualRefresh = true;\n this.headerModule.refreshUI();\n this.updateStackedFilter();\n this.renderModule.refresh();\n }\n };\n /**\n * Refreshes the Grid header.\n *\n * @returns {void}\n */\n Grid.prototype.refreshHeader = function () {\n this.headerModule.refreshUI();\n };\n /**\n * Gets the collection of selected rows.\n *\n * @returns {Element[]} Returns the element\n */\n Grid.prototype.getSelectedRows = function () {\n return this.selectionModule ? this.selectionModule.selectedRecords : [];\n };\n /**\n * Gets the collection of selected row indexes.\n *\n * @returns {number[]} Returns the Selected row indexes\n */\n Grid.prototype.getSelectedRowIndexes = function () {\n return this.selectionModule ? this.selectionModule.selectedRowIndexes : [];\n };\n /**\n * Gets the collection of selected row and cell indexes.\n *\n * @returns {number[]} Returns the Selected row cell indexes\n */\n Grid.prototype.getSelectedRowCellIndexes = function () {\n return this.selectionModule ? this.selectionModule.selectedRowCellIndexes : [];\n };\n /**\n * Gets the collection of selected records.\n *\n * @returns {Object[]} Returns the selected records\n * @isGenericType true\n */\n Grid.prototype.getSelectedRecords = function () {\n return this.selectionModule ? this.selectionModule.getSelectedRecords() : [];\n };\n /**\n * Gets the collection of selected columns uid.\n *\n * @returns {string[]} Returns the selected column uid\n * @isGenericType true\n */\n Grid.prototype.getSelectedColumnsUid = function () {\n var _this_1 = this;\n var uid = [];\n if (this.selectionModule) {\n this.selectionModule.selectedColumnsIndexes.filter(function (i) { return uid.push(_this_1.getColumns()[parseInt(i.toString(), 10)].uid); });\n }\n return uid;\n };\n /**\n * Gets the data module.\n *\n * @returns {Data} Returns the data\n */\n Grid.prototype.getDataModule = function () {\n return this.renderModule.data;\n };\n /**\n * Shows a column by its column name.\n *\n * @param {string|string[]} keys - Defines a single or collection of column names.\n * @param {string} showBy - Defines the column key either as field name or header text.\n *\n * @returns {void}\n */\n Grid.prototype.showColumns = function (keys, showBy) {\n showBy = showBy ? showBy : 'headerText';\n this.showHider.show(keys, showBy);\n };\n /**\n * Hides a column by column name.\n *\n * @param {string|string[]} keys - Defines a single or collection of column names.\n * @param {string} hideBy - Defines the column key either as field name or header text.\n *\n * @returns {void}\n */\n Grid.prototype.hideColumns = function (keys, hideBy) {\n hideBy = hideBy ? hideBy : 'headerText';\n this.showHider.hide(keys, hideBy);\n };\n /**\n * @hidden\n * @returns {number} Returns the Frozen column\n */\n Grid.prototype.getFrozenColumns = function () {\n return this.frozenColumns + this.getFrozenCount(this.columns, 0, 0);\n };\n /**\n * @hidden\n * @returns {number} Returns the Frozen Right column count\n */\n Grid.prototype.getFrozenRightColumnsCount = function () {\n return this.frozenRightCount || this.rightcount;\n };\n /**\n * @hidden\n * @returns {number} Returns the Frozen Left column\n */\n Grid.prototype.getFrozenLeftColumnsCount = function () {\n return this.frozenLeftCount || this.leftcount;\n };\n /**\n * @hidden\n * @returns {number} Returns the movable column count\n */\n Grid.prototype.getMovableColumnsCount = function () {\n return this.movableCount || this.movablecount;\n };\n Grid.prototype.updateFrozenColumnsWidth = function () {\n if (this.isFrozenGrid() && !this.enableColumnVirtualization) {\n var gcol = this.getColumns();\n var isAutoWidth = true;\n var autoCol_1 = 0;\n var difference_1 = 0;\n var autoWidth_1 = 0;\n var _loop_2 = function (i) {\n var col = gcol[parseInt(i.toString(), 10)];\n if (isNullOrUndefined(col.width) && (col.freeze === 'Left' || col.freeze === 'Right' || col.freeze === 'Fixed' || col.isFrozen)) {\n col.width = Math.max(200, col.minWidth ? parseFloat(col.minWidth.toString()) : 0);\n }\n if (col.width === 'auto') {\n var tWidth_1 = 0;\n if (isAutoWidth) {\n gcol.filter(function (cols) {\n if (cols.visible) {\n if (cols.width === 'auto') {\n autoCol_1++;\n }\n if (cols.width !== 'auto') {\n var width = !isNullOrUndefined(cols.width) ? parseFloat(cols.width.toString()) :\n Math.max(200, cols.minWidth ? parseFloat(cols.minWidth.toString()) : 0);\n tWidth_1 += width;\n }\n }\n });\n var gWidth = this_2.isPercentageWidthGrid() || this_2.width === 'auto' ? this_2.element.getBoundingClientRect().width :\n parseFloat(this_2.width.toString());\n difference_1 = this_2.height === 'auto' ? gWidth - tWidth_1 : ((gWidth - tWidth_1) - getScrollBarWidth());\n if (difference_1 < 0) {\n difference_1 = 0;\n }\n autoWidth_1 = parseFloat((difference_1 / autoCol_1).toString());\n gcol.filter(function (col) {\n if (col.visible) {\n if (col.minWidth && parseFloat(col.minWidth.toString()) > autoWidth_1) {\n difference_1 = difference_1 - parseFloat(col.minWidth.toString());\n autoCol_1--;\n }\n }\n });\n isAutoWidth = false;\n }\n if (col.minWidth && parseFloat(col.minWidth.toString()) > autoWidth_1) {\n col.width = parseFloat(col.minWidth.toString());\n }\n else {\n col.width = difference_1 / autoCol_1;\n }\n }\n };\n var this_2 = this;\n for (var i = 0; i < gcol.length; i++) {\n _loop_2(i);\n }\n }\n };\n Grid.prototype.refreshSplitFrozenColumn = function () {\n this.splitFrozenCount(this.columns);\n this.updateFrozenColumnsWidth();\n this.isAutoGenerateColumns = true;\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.setFrozenCount = function () {\n this.frozenLeftCount = this.frozenRightCount = this.movableCount = 0;\n this.visibleFrozenLeft = this.visibleFrozenRight = this.visibleMovable = 0;\n this.frozenLeftColumns = [];\n this.frozenRightColumns = [];\n this.movableColumns = [];\n this.fixedColumns = [];\n this.splitFrozenCount(this.columns);\n this.leftcount = this.frozenLeftCount;\n this.rightcount = this.frozenRightCount;\n this.movablecount = this.movableCount;\n // if (this.frozenColumns && (this.frozenLeftCount || this.frozenRightCount)) {\n // this.setProperties({ frozenColumns: 0 }, true);\n // }\n if (this.frozenLeftCount && !this.frozenRightCount) {\n this.frozenName = 'Left';\n }\n else if (this.frozenRightCount && !this.frozenLeftCount) {\n this.frozenName = 'Right';\n }\n else if (this.frozenLeftCount && this.frozenRightCount) {\n this.frozenName = 'Left-Right';\n }\n else if (this.frozenColumns || this.frozenRows) {\n this.frozenName = 'Left';\n }\n else {\n this.frozenName = undefined;\n }\n };\n /**\n * @hidden\n * @returns {number} Returns the visible Frozen left count\n */\n Grid.prototype.getVisibleFrozenLeftCount = function () {\n return this.visibleFrozenLeft;\n };\n /**\n * @hidden\n * @returns {number} Returns the visible Frozen Right count\n */\n Grid.prototype.getVisibleFrozenRightCount = function () {\n return this.visibleFrozenRight;\n };\n /**\n * @hidden\n * @returns {number} Returns the visible movable count\n */\n Grid.prototype.getVisibleMovableCount = function () {\n return this.visibleMovable;\n };\n /**\n * @hidden\n * @returns {Column[]} Returns the column\n */\n Grid.prototype.getFrozenRightColumns = function () {\n return this.frozenRightColumns;\n };\n /**\n * @hidden\n * @returns {Column[]} Returns the column\n */\n Grid.prototype.getFrozenLeftColumns = function () {\n return this.frozenLeftColumns;\n };\n /**\n * @hidden\n * @returns {Column[]} Returns the column\n */\n Grid.prototype.getMovableColumns = function () {\n return this.movableColumns;\n };\n Grid.prototype.splitStackedColumns = function (columns) {\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].columns) {\n this.splitStackedColumns(columns[parseInt(i.toString(), 10)].columns);\n }\n else {\n if (columns[parseInt(i.toString(), 10)].freeze === 'Left' || columns[parseInt(i.toString(), 10)].isFrozen) {\n if (columns[parseInt(i.toString(), 10)].visible !== false) {\n this.visibleFrozenLeft++;\n }\n this.leftcount++;\n }\n else if (columns[parseInt(i.toString(), 10)].freeze === 'Right') {\n if (columns[parseInt(i.toString(), 10)].visible !== false) {\n this.visibleFrozenRight++;\n }\n this.rightcount++;\n }\n else if (columns[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n if (columns[parseInt(i.toString(), 10)].visible !== false) {\n this.visibleFrozenFixed++;\n }\n this.fixedcount++;\n }\n else {\n if (columns[parseInt(i.toString(), 10)].visible !== false) {\n this.visibleMovable++;\n }\n this.movablecount++;\n }\n }\n }\n };\n Grid.prototype.pushStackedColumns = function (columns, index, arr, col, stackedcol) {\n arr[parseInt(index.toString(), 10)] = col.headerText;\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].columns) {\n index = index + 1;\n this.pushStackedColumns(columns[parseInt(i.toString(), 10)].columns, index, arr, columns[parseInt(i.toString(), 10)], stackedcol);\n index = index - 1;\n }\n else {\n var stockCol = [];\n stockCol = arr.slice().slice(0, index + 1);\n if (columns[parseInt(i.toString(), 10)].freeze === 'Left' || columns[parseInt(i.toString(), 10)].isFrozen) {\n this.stackedLeft.push(stockCol);\n this.stackedarrayLeft.push(columns[parseInt(i.toString(), 10)]);\n }\n else if (columns[parseInt(i.toString(), 10)].freeze === 'Right') {\n this.stackedRight.push(stockCol);\n this.stackedarrayRight.push(columns[parseInt(i.toString(), 10)]);\n }\n else if (columns[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n this.stackedFixed.push(stockCol);\n this.stackedarrayFixed.push(columns[parseInt(i.toString(), 10)]);\n }\n else {\n this.stackedMovable.push(stockCol);\n this.stackedarrayMovable.push(columns[parseInt(i.toString(), 10)]);\n }\n }\n }\n };\n Grid.prototype.pushallcol = function (text, text1, col, columns, isTrue) {\n if (col.headerText === text1) {\n if (isTrue) {\n col.columns.push(columns);\n }\n else {\n col.columns.push({ headerText: text, columns: [] });\n }\n }\n else {\n if (col.columns && col.columns.length) {\n for (var i = 0; i < col.columns.length; i++) {\n this.pushallcol(text, text1, col.columns[parseInt(i.toString(), 10)], columns, isTrue);\n }\n }\n }\n };\n Grid.prototype.resetStackedColumns = function (headercol, gridcolumns, freeze) {\n var col = {};\n var tempHead = [];\n for (var i = 1; i <= headercol.length; i++) {\n var firstcol = headercol[i - 1];\n for (var j = 0; j < firstcol.length; j++) {\n if (!col.columns && i === 1) {\n col = { headerText: firstcol[parseInt(j.toString(), 10)], columns: [] };\n tempHead.push(firstcol[parseInt(j.toString(), 10)]);\n }\n else {\n if (tempHead.indexOf(firstcol[parseInt(j.toString(), 10)]) === -1) {\n this.pushallcol(firstcol[parseInt(j.toString(), 10)], firstcol[j - 1], col);\n tempHead.push(firstcol[parseInt(j.toString(), 10)]);\n }\n }\n if (j === firstcol.length - 1) {\n this.pushallcol(null, firstcol[parseInt(j.toString(), 10)], col, gridcolumns[i - 1], true);\n var count = 0;\n while (count !== headercol.length - 1 && i !== headercol.length) {\n if (firstcol.toString() === headercol[parseInt(i.toString(), 10)].toString()) {\n i++;\n this.pushallcol(null, firstcol[parseInt(j.toString(), 10)], col, gridcolumns[i - 1], true);\n }\n count++;\n }\n }\n }\n }\n if (freeze === 'Left') {\n this.frozenLeftColumns.push(col);\n }\n else if (freeze === 'Right') {\n this.frozenRightColumns.push(col);\n }\n else {\n this.movableColumns.push(col);\n }\n };\n Grid.prototype.splitFrozenCount = function (columns) {\n if (this.frozenColumns || (this.changedProperties && this.changedProperties.frozenColumns === 0)) {\n var cols = !this.enableColumnVirtualization || (this.enableColumnVirtualization && this.isPreparedFrozenColumns) ?\n this.enableColumnVirtualization && this.columnModel && this.columnModel.length ? this.columnModel :\n this.getColumns() : this.columns;\n if (!this.changedProperties || (this.changedProperties && !this.changedProperties.frozenColumns)) {\n for (var i = 0; i < cols.length; i++) {\n if (this.frozenColumns > i) {\n cols[parseInt(i.toString(), 10)].freeze = 'Left';\n }\n else if (cols[parseInt(i.toString(), 10)].freeze === 'Right' || cols[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n cols[parseInt(i.toString(), 10)].freeze = cols[parseInt(i.toString(), 10)].freeze;\n }\n else {\n cols[parseInt(i.toString(), 10)].freeze = undefined;\n }\n }\n }\n }\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].columns) {\n this.leftcount = 0;\n this.rightcount = 0;\n this.movablecount = 0;\n this.fixedcount = 0;\n var arr = [];\n this.splitStackedColumns(columns[parseInt(i.toString(), 10)].columns);\n if (this.leftcount && !this.rightcount && !this.movablecount && !this.fixedcount) {\n this.frozenLeftCount += this.leftcount;\n this.frozenLeftColumns.push(columns[parseInt(i.toString(), 10)]);\n }\n else if (this.rightcount && !this.leftcount && !this.movablecount && !this.fixedcount) {\n this.frozenRightCount += this.rightcount;\n this.frozenRightColumns.push(columns[parseInt(i.toString(), 10)]);\n }\n else if (this.movablecount && !this.leftcount && !this.rightcount && !this.fixedcount) {\n this.movableCount += this.movablecount;\n this.movableColumns.push(columns[parseInt(i.toString(), 10)]);\n }\n else if (this.fixedcount && !this.leftcount && !this.rightcount && !this.movablecount) {\n this.fixedCount += this.fixedcount;\n this.fixedColumns.push(columns[parseInt(i.toString(), 10)]);\n this.movableCount += this.movablecount;\n this.movableColumns.push(columns[parseInt(i.toString(), 10)]);\n }\n else {\n this.frozenLeftCount += this.leftcount;\n this.frozenRightCount += this.rightcount;\n this.movableCount += this.movablecount;\n this.fixedCount += this.fixedcount;\n this.leftcount = 0;\n this.rightcount = 0;\n this.movablecount = 0;\n this.fixedcount = 0;\n this.stackedLeft = [];\n this.stackedRight = [];\n this.stackedFixed = [];\n this.stackedMovable = [];\n this.stackedarrayLeft = [];\n this.stackedarrayRight = [];\n this.stackedarrayFixed = [];\n this.stackedarrayMovable = [];\n this.pushStackedColumns(columns[parseInt(i.toString(), 10)].columns, 0, arr, columns[parseInt(i.toString(), 10)], { headerText: columns[parseInt(i.toString(), 10)].headerText, columns: [] });\n if (this.stackedarrayLeft.length) {\n this.resetStackedColumns(this.stackedLeft, this.stackedarrayLeft, 'Left');\n }\n if (this.stackedarrayRight.length) {\n this.resetStackedColumns(this.stackedRight, this.stackedarrayRight, 'Right');\n }\n if (this.stackedarrayFixed.length) {\n this.resetStackedColumns(this.stackedFixed, this.stackedarrayFixed, 'Fixed');\n }\n if (this.stackedarrayMovable.length) {\n this.resetStackedColumns(this.stackedMovable, this.stackedarrayMovable, 'Movable');\n }\n this.stackedLeft = [];\n this.stackedRight = [];\n this.stackedMovable = [];\n this.stackedFixed = [];\n this.stackedarrayLeft = [];\n this.stackedarrayRight = [];\n this.stackedarrayMovable = [];\n this.stackedarrayFixed = [];\n }\n }\n else {\n if (columns[parseInt(i.toString(), 10)].freeze === 'Right') {\n if (columns[parseInt(i.toString(), 10)].visible !== false) {\n this.visibleFrozenRight++;\n }\n this.frozenRightColumns.push(columns[parseInt(i.toString(), 10)]);\n this.frozenRightCount++;\n }\n else if (columns[parseInt(i.toString(), 10)].freeze === 'Left' || columns[parseInt(i.toString(), 10)].isFrozen) {\n if (columns[parseInt(i.toString(), 10)].visible !== false) {\n this.visibleFrozenLeft++;\n }\n this.frozenLeftColumns.push(columns[parseInt(i.toString(), 10)]);\n this.frozenLeftCount++;\n }\n else if (columns[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n this.fixedColumns.push(columns[parseInt(i.toString(), 10)]);\n this.fixedCount++;\n this.movableColumns.push(columns[parseInt(i.toString(), 10)]);\n this.movableCount++;\n }\n else {\n if (columns[parseInt(i.toString(), 10)].visible !== false) {\n this.visibleMovable++;\n }\n this.movableColumns.push(columns[parseInt(i.toString(), 10)]);\n this.movableCount++;\n }\n }\n }\n if (this.frozenLeftColumns.length) {\n var cols = this.frozenLeftColumns[this.frozenLeftColumns.length - 1];\n this.removeBorder(this.frozenLeftColumns);\n this.frozenLeftBorderColumns(cols instanceof Column ? this.lastVisibleLeftCol(this.frozenLeftColumns) : cols);\n }\n if (this.frozenRightColumns.length) {\n var cols = this.frozenRightColumns[0];\n this.removeBorder(this.frozenRightColumns);\n this.frozenRightBorderColumns(cols instanceof Column ? this.firstVisibleRightCol(this.frozenRightColumns) : cols);\n }\n if ((this.frozenLeftColumns.length || this.frozenRightColumns.length) && this.freezeColumnRefresh) {\n var cols = (this.frozenLeftColumns.concat(this.movableColumns)).concat(this.frozenRightColumns);\n this.setProperties({ columns: cols }, true);\n this.freezeColumnRefresh = false;\n }\n };\n Grid.prototype.removeBorder = function (columns) {\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].columns && columns[parseInt(i.toString(), 10)].columns.length) {\n if (columns[parseInt(i.toString(), 10)].border === 'Right' ||\n columns[parseInt(i.toString(), 10)].border === 'Left') {\n columns[parseInt(i.toString(), 10)].border = undefined;\n }\n this.removeBorder(columns[parseInt(i.toString(), 10)].columns);\n }\n else {\n if (columns[parseInt(i.toString(), 10)].border === 'Right' ||\n columns[parseInt(i.toString(), 10)].border === 'Left') {\n columns[parseInt(i.toString(), 10)].border = undefined;\n }\n }\n }\n };\n Grid.prototype.isVisibleColumns = function (column, arr) {\n if (column.columns && column.columns.length) {\n for (var i = 0; i < column.columns.length; i++) {\n this.isVisibleColumns(column.columns[parseInt(i.toString(), 10)], arr);\n if (column.columns[parseInt(i.toString(), 10)].visible &&\n isNullOrUndefined(column.columns[parseInt(i.toString(), 10)].columns) &&\n (!isNullOrUndefined(column.columns[parseInt(i.toString(), 10)].freeze) ||\n column.columns[parseInt(i.toString(), 10)].isFrozen)) {\n arr.push('true');\n }\n }\n }\n else {\n if (column.visible && (!isNullOrUndefined(column.freeze) || column.isFrozen)) {\n arr.push('true');\n }\n }\n };\n Grid.prototype.lastVisibleLeftCol = function (columns) {\n var column;\n for (var i = columns.length - 1; i >= 0; i--) {\n var arr = [];\n this.isVisibleColumns(columns[parseInt(i.toString(), 10)], arr);\n if (columns[parseInt(i.toString(), 10)].visible && arr.indexOf('true') !== -1) {\n column = columns[parseInt(i.toString(), 10)];\n break;\n }\n }\n return column;\n };\n Grid.prototype.firstVisibleRightCol = function (columns) {\n var column;\n for (var i = 0; i < columns.length; i++) {\n var arr = [];\n this.isVisibleColumns(columns[parseInt(i.toString(), 10)], arr);\n if (columns[parseInt(i.toString(), 10)].visible && arr.indexOf('true') !== -1) {\n column = columns[parseInt(i.toString(), 10)];\n break;\n }\n }\n return column;\n };\n Grid.prototype.frozenLeftBorderColumns = function (columns) {\n if (isNullOrUndefined(columns)) {\n return;\n }\n if (columns.columns && columns.columns.length) {\n columns.border = 'Left';\n var cols = columns.columns[columns.columns.length - 1];\n this.frozenLeftBorderColumns(cols instanceof Column && cols.columns ? this.lastVisibleLeftCol(columns.columns) : cols);\n }\n else {\n columns.border = 'Left';\n }\n };\n Grid.prototype.frozenRightBorderColumns = function (columns) {\n if (isNullOrUndefined(columns)) {\n return;\n }\n if (columns.columns && columns.columns.length) {\n columns.border = 'Right';\n var cols = columns.columns[0];\n this.frozenRightBorderColumns(cols instanceof Column && cols.columns ? this.firstVisibleRightCol(columns.columns) : cols);\n }\n else {\n columns.border = 'Right';\n }\n };\n /**\n * @hidden\n * @returns {number} Returns the visible frozen columns count\n */\n Grid.prototype.getVisibleFrozenColumns = function () {\n return this.getVisibleFrozenColumnsCount() + this.getVisibleFrozenCount(this.columns, 0);\n };\n /**\n * Get the current Filter operator and field.\n *\n * @returns {FilterUI} Returns the filter UI\n */\n Grid.prototype.getFilterUIInfo = function () {\n return this.filterModule ? this.filterModule.getFilterUIInfo() : {};\n };\n Grid.prototype.getVisibleFrozenColumnsCount = function () {\n var visibleFrozenColumns = 0;\n var columns = this.columnModel;\n for (var i = 0; i < this.frozenColumns; i++) {\n if (columns[parseInt(i.toString(), 10)].visible) {\n visibleFrozenColumns++;\n }\n }\n if ((this.frozenLeftCount || this.leftcount) || (this.frozenRightCount || this.rightcount)) {\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].visible && (columns[parseInt(i.toString(), 10)].freeze === 'Left'\n || columns[parseInt(i.toString(), 10)].freeze === 'Right')) {\n visibleFrozenColumns++;\n }\n }\n }\n return visibleFrozenColumns;\n };\n Grid.prototype.getVisibleFrozenCount = function (cols, cnt) {\n if ((!this.frozenLeftCount && !this.leftcount) && (!this.frozenRightCount || !this.rightcount)) {\n for (var i = 0, len = cols.length; i < len; i++) {\n if (cols[parseInt(i.toString(), 10)].columns) {\n cnt = this.getVisibleFrozenCount(cols[parseInt(i.toString(), 10)].columns, cnt);\n }\n else {\n if (cols[parseInt(i.toString(), 10)].isFrozen && cols[parseInt(i.toString(), 10)].visible) {\n cnt++;\n }\n }\n }\n }\n return cnt;\n };\n Grid.prototype.getFrozenCount = function (cols, cnt, index) {\n for (var i = 0, len = cols.length; i < len; i++) {\n if (cols[parseInt(i.toString(), 10)].columns) {\n cnt = this.getFrozenCount(cols[parseInt(i.toString(), 10)].columns, cnt, index);\n }\n else {\n if (cols[parseInt(i.toString(), 10)].isFrozen && index > this.frozenColumns - 1) {\n cnt++;\n }\n index++;\n }\n }\n return cnt;\n };\n /**\n * Navigates to the specified target page.\n *\n * @param {number} pageNo - Defines the page number to navigate.\n *\n * @returns {void}\n */\n Grid.prototype.goToPage = function (pageNo) {\n if (this.pagerModule) {\n this.pagerModule.goToPage(pageNo);\n }\n };\n /**\n * Defines the text of external message.\n *\n * @param {string} message - Defines the message to update.\n *\n * @returns {void}\n */\n Grid.prototype.updateExternalMessage = function (message) {\n if (this.pagerModule && !this.pagerTemplate) {\n this.pagerModule.updateExternalMessage(message);\n }\n };\n /**\n * Sorts a column with the given options.\n *\n * @param {string} columnName - Defines the column name to be sorted.\n * @param {SortDirection} direction - Defines the direction of sorting field.\n * @param {boolean} isMultiSort - Specifies whether the previous sorted columns are to be maintained.\n *\n * @returns {void}\n */\n Grid.prototype.sortColumn = function (columnName, direction, isMultiSort) {\n if (this.sortModule) {\n this.sortModule.sortColumn(columnName, direction, isMultiSort);\n }\n };\n /**\n * Remove the existing columns along with the grid actions like sorting, filtering, searching, grouping, aggregate, etc., and grid will refresh with new columns based on the updated new data source.\n * > * If no columns are specified while changing the data source, then the columns are auto generated in the Grid based on the list of columns in the updated data source.\n *\n * @param {Object | DataManager | DataResult} dataSource - Assign the new datasource.\n * @param {Column[] | string[] | ColumnModel[]} columns - Defines columns.\n * @returns {void}\n *\n *\n * ```typescript\n * \n *
    \n * \n * ```\n *\n */\n Grid.prototype.changeDataSource = function (dataSource, columns) {\n this.isChangeDataSourceCall = true;\n this.setProperties({ sortSettings: { columns: [] } }, true);\n this.setProperties({ filterSettings: { columns: [] } }, true);\n this.setProperties({ searchSettings: { key: '' } }, true);\n if (this.allowGrouping) {\n this.setProperties({ groupSettings: { columns: [] } }, true);\n }\n if (columns && columns.length) {\n this.setProperties({ columns: columns }, true);\n }\n if (dataSource) {\n if (isNullOrUndefined(columns)) {\n this.setProperties({ columns: [] }, true);\n }\n this.setProperties({ dataSource: dataSource }, true);\n }\n this.freezeRefresh();\n this.isChangeDataSourceCall = false;\n };\n /**\n * Clears all the sorted columns of the Grid.\n *\n * @returns {void}\n */\n Grid.prototype.clearSorting = function () {\n if (this.sortModule) {\n this.sortModule.clearSorting();\n }\n };\n /**\n * Remove sorted column by field name.\n *\n * @param {string} field - Defines the column field name to remove sort.\n * @returns {void}\n * @hidden\n */\n Grid.prototype.removeSortColumn = function (field) {\n if (this.sortModule) {\n this.sortModule.removeSortColumn(field);\n }\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.clearGridActions = function () {\n this.setProperties({ sortSettings: { columns: [] } }, true);\n this.setProperties({ filterSettings: { columns: [] } }, true);\n this.setProperties({ searchSettings: { key: '' } }, true);\n if (this.allowGrouping) {\n this.setProperties({ groupSettings: { columns: [] } }, false);\n }\n else {\n this.freezeRefresh();\n }\n };\n /**\n * Filters grid row by column name with the given options.\n *\n * @param {string} fieldName - Defines the field name of the column.\n * @param {string} filterOperator - Defines the operator to filter records.\n * @param {string | number | Date | boolean} filterValue - Defines the value used to filter records.\n * @param {string} predicate - Defines the relationship between one filter query and another by using AND or OR predicate.\n * @param {boolean} matchCase - If match case is set to true, the grid filters the records with exact match. if false, it filters case\n * insensitive records (uppercase and lowercase letters treated the same).\n * @param {boolean} ignoreAccent - If ignoreAccent set to true,\n * then filter ignores the diacritic characters or accents while filtering.\n * @param {string} actualFilterValue - Defines the actual filter value for the filter column.\n * @param {string} actualOperator - Defines the actual filter operator for the filter column.\n *\n * @returns {void}\n */\n Grid.prototype.filterByColumn = function (fieldName, filterOperator, filterValue, predicate, matchCase, ignoreAccent, actualFilterValue, actualOperator) {\n if (this.filterModule) {\n this.filterModule.filterByColumn(fieldName, filterOperator, filterValue, predicate, matchCase, ignoreAccent, actualFilterValue, actualOperator);\n }\n };\n /**\n * Clears all the filtered rows of the Grid.\n *\n * @param {string[]} fields - Defines the Fields\n * @returns {void}\n */\n Grid.prototype.clearFiltering = function (fields) {\n if (this.filterModule) {\n this.filterModule.clearFiltering(fields);\n }\n };\n /**\n * Removes filtered column by field name.\n *\n * @param {string} field - Defines column field name to remove filter.\n * @param {boolean} isClearFilterBar - Specifies whether the filter bar value needs to be cleared.\n * @returns {void}\n * @hidden\n */\n Grid.prototype.removeFilteredColsByField = function (field, isClearFilterBar) {\n if (this.filterModule) {\n this.filterModule.removeFilteredColsByField(field, isClearFilterBar);\n }\n };\n /**\n * Selects a row by given index.\n *\n * @param {number} index - Defines the row index.\n * @param {boolean} isToggle - If set to true, then it toggles the selection.\n *\n * @returns {void}\n */\n Grid.prototype.selectRow = function (index, isToggle) {\n if (this.selectionModule) {\n this.selectionModule.selectRow(index, isToggle);\n }\n };\n /**\n * Selects a collection of rows by indexes.\n *\n * @param {number[]} rowIndexes - Specifies the row indexes.\n *\n * @returns {void}\n */\n Grid.prototype.selectRows = function (rowIndexes) {\n if (this.selectionModule) {\n this.selectionModule.selectRows(rowIndexes);\n }\n };\n /**\n * Deselects the current selected rows and cells.\n *\n * @returns {void}\n */\n Grid.prototype.clearSelection = function () {\n if (this.selectionModule) {\n this.selectionModule.clearSelection();\n }\n };\n /**\n * Selects a cell by the given index.\n *\n * @param {IIndex} cellIndex - Defines the row and column indexes.\n * @param {boolean} isToggle - If set to true, then it toggles the selection.\n *\n * @returns {void}\n */\n Grid.prototype.selectCell = function (cellIndex, isToggle) {\n if (this.selectionModule) {\n this.selectionModule.selectCell(cellIndex, isToggle);\n }\n };\n /**\n * Selects a range of cells from start and end indexes.\n *\n * @param {IIndex} startIndex - Specifies the row and column's start index.\n * @param {IIndex} endIndex - Specifies the row and column's end index.\n *\n * @returns {void}\n */\n Grid.prototype.selectCellsByRange = function (startIndex, endIndex) {\n this.selectionModule.selectCellsByRange(startIndex, endIndex);\n };\n /**\n * Searches Grid records using the given key.\n * You can customize the default search option by using the\n * [`searchSettings`](./#searchsettings/).\n *\n * @param {string} searchString - Defines the key.\n *\n * @returns {void}\n */\n Grid.prototype.search = function (searchString) {\n if (this.searchModule) {\n this.searchModule.search(searchString);\n }\n };\n /**\n * By default, prints all the pages of the Grid and hides the pager.\n * > You can customize print options using the\n * [`printMode`](./#printmode).\n *\n * @returns {void}\n */\n Grid.prototype.print = function () {\n if (this.printModule) {\n this.printModule.print();\n }\n };\n /**\n * Delete a record with Given options. If fieldname and data is not given then grid will delete the selected record.\n * > `editSettings.allowDeleting` should be true.\n *\n * @param {string} fieldname - Defines the primary key field, 'Name of the column'.\n * @param {Object} data - Defines the JSON data of the record to be deleted.\n * @returns {void}\n */\n Grid.prototype.deleteRecord = function (fieldname, data) {\n if (this.editModule) {\n this.editModule.deleteRecord(fieldname, data);\n }\n };\n /**\n * Starts edit the selected row. At least one row must be selected before invoking this method.\n * `editSettings.allowEditing` should be true.\n * {% codeBlock src='grid/startEdit/index.md' %}{% endcodeBlock %}\n *\n * @returns {void}\n */\n Grid.prototype.startEdit = function () {\n if (this.editModule) {\n this.editModule.startEdit();\n }\n };\n /**\n * If Grid is in editable state, you can save a record by invoking endEdit.\n *\n * @returns {void}\n */\n Grid.prototype.endEdit = function () {\n if (this.editModule) {\n this.editModule.endEdit();\n }\n };\n /**\n * Cancels edited state.\n *\n * @returns {void}\n */\n Grid.prototype.closeEdit = function () {\n if (this.editModule) {\n this.editModule.closeEdit();\n }\n };\n /**\n * Adds a new record to the Grid. Without passing parameters, it adds empty rows.\n * > `editSettings.allowEditing` should be true.\n *\n * @param {Object} data - Defines the new add record data.\n * @param {number} index - Defines the row index to be added\n * @returns {void}\n */\n Grid.prototype.addRecord = function (data, index) {\n if (this.editModule) {\n this.editModule.addRecord(data, index);\n }\n };\n /**\n * Delete any visible row by TR element.\n *\n * @param {HTMLTableRowElement} tr - Defines the table row element.\n * @returns {void}\n */\n Grid.prototype.deleteRow = function (tr) {\n if (this.editModule) {\n this.editModule.deleteRow(tr);\n }\n };\n /**\n * Changes a particular cell into edited state based on the row index and field name provided in the `batch` mode.\n *\n * @param {number} index - Defines row index to edit a particular cell.\n * @param {string} field - Defines the field name of the column to perform batch edit.\n *\n * @returns {void}\n */\n Grid.prototype.editCell = function (index, field) {\n if (this.editModule) {\n this.editModule.editCell(index, field);\n }\n };\n /**\n * Saves the cell that is currently edited. It does not save the value to the DataSource.\n *\n * @returns {void}\n * {% codeBlock src='grid/saveCell/index.md' %}{% endcodeBlock %}\n */\n Grid.prototype.saveCell = function () {\n if (this.editModule) {\n this.editModule.saveCell();\n }\n };\n /**\n * To update the specified cell by given value without changing into edited state.\n *\n * @param {number} rowIndex Defines the row index.\n * @param {string} field Defines the column field.\n * @param {string | number | boolean | Date} value - Defines the value to be changed.\n *\n * @returns {void}\n */\n Grid.prototype.updateCell = function (rowIndex, field, value) {\n if (this.editModule) {\n this.editModule.updateCell(rowIndex, field, value);\n }\n };\n /**\n * To update the specified row by given values without changing into edited state.\n *\n * {% codeBlock src='grid/updateRow/index.md' %}{% endcodeBlock %}\n *\n * @param {number} index Defines the row index.\n * @param {Object} data Defines the data object to be updated.\n *\n * @returns {void}\n */\n Grid.prototype.updateRow = function (index, data) {\n if (this.editModule) {\n this.editModule.updateRow(index, data);\n }\n };\n /**\n * Gets the added, edited,and deleted data before bulk save to the DataSource in batch mode.\n *\n * @returns {Object} Returns the batch changes\n */\n Grid.prototype.getBatchChanges = function () {\n if (this.editModule) {\n return this.editModule.getBatchChanges();\n }\n return {};\n };\n /**\n * Enables or disables ToolBar items.\n *\n * @param {string[]} items - Defines the collection of itemID of ToolBar items.\n * @param {boolean} isEnable - Defines the items to be enabled or disabled.\n *\n * @returns {void}\n */\n Grid.prototype.enableToolbarItems = function (items, isEnable) {\n if (this.toolbarModule) {\n this.toolbarModule.enableItems(items, isEnable);\n }\n };\n /**\n * Copy the selected rows or cells data into clipboard.\n *\n * @param {boolean} withHeader - Specifies whether the column header text needs to be copied along with rows or cells.\n * @returns {void}\n */\n Grid.prototype.copy = function (withHeader) {\n if (this.clipboardModule) {\n this.clipboardModule.copy(withHeader);\n }\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.recalcIndentWidth = function () {\n var _this_1 = this;\n if (!this.getHeaderTable().querySelector('.e-emptycell')) {\n return;\n }\n if ((!this.groupSettings.columns.length && !this.isDetail() && !this.isRowDragable()) ||\n this.getHeaderTable().querySelector('.e-emptycell').getAttribute('indentRefreshed') ||\n !this.getContentTable()) {\n return;\n }\n var indentWidth = this.getHeaderTable().querySelector('.e-emptycell').parentElement.offsetWidth;\n var headerCol = [].slice.call(this.getHeaderTable().querySelector(literals.colGroup).childNodes);\n var contentCol = [].slice.call(this.getContentTable().querySelector(literals.colGroup).childNodes);\n var perPixel = indentWidth / 30;\n var i = this.getFrozenMode() === 'Right' ? this.groupSettings.columns.length + this.getColumns().length : 0;\n var parentOffset = this.element.offsetWidth;\n var applyWidth = function (index, width) {\n if (ispercentageWidth(_this_1)) {\n var newWidth = (width / parentOffset * 100).toFixed(1) + '%';\n headerCol[parseInt(index.toString(), 10)].style.width = newWidth;\n contentCol[parseInt(index.toString(), 10)].style.width = newWidth;\n }\n else {\n headerCol[parseInt(index.toString(), 10)].style.width = width + 'px';\n contentCol[parseInt(index.toString(), 10)].style.width = width + 'px';\n }\n _this_1.notify(events.columnWidthChanged, { index: index, width: width });\n };\n if (perPixel >= 1) {\n indentWidth = (30 / perPixel);\n }\n if (indentWidth < 1) {\n indentWidth = 1;\n }\n if (this.enableColumnVirtualization || this.isAutoGen || (this.columns.length === this.groupSettings.columns.length)) {\n indentWidth = 30;\n }\n while (i < this.groupSettings.columns.length) {\n applyWidth(i, indentWidth);\n i++;\n }\n if (this.isDetail()) {\n applyWidth(i, indentWidth);\n i++;\n }\n if (this.isRowDragable()) {\n applyWidth(i, indentWidth);\n }\n this.isAutoGen = false;\n this.getHeaderTable().querySelector('.e-emptycell').setAttribute('indentRefreshed', 'true');\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.resetIndentWidth = function () {\n if (this.isDestroyed) {\n return;\n }\n if (ispercentageWidth(this)) {\n this.getHeaderTable().querySelector('.e-emptycell').removeAttribute('indentRefreshed');\n this.widthService.setWidthToColumns();\n this.recalcIndentWidth();\n if (this.autoFit) {\n this.preventAdjustColumns();\n }\n }\n if ((this.width === 'auto' || typeof (this.width) === 'string' && this.width.indexOf('%') !== -1)\n && this.getColumns().filter(function (col) { return (!col.width || col.width === 'auto') && col.minWidth; }).length > 0) {\n var tgridWidth = this.widthService.getTableWidth(this.getColumns());\n this.widthService.setMinwidthBycalculation(tgridWidth);\n }\n if (this.isFrozenGrid() && this.enableColumnVirtualization && this.widthService) {\n this.widthService.refreshFrozenScrollbar();\n }\n if (this.allowTextWrap && this.textWrapSettings.wrapMode !== 'Content') {\n this.notify(events.refreshHandlers, {});\n }\n if (this.frozenRows && this.scrollModule) {\n this.scrollModule.resizeFrozenRowBorder();\n }\n };\n /**\n * @hidden\n * @returns {boolean} Returns isRowDragable\n */\n Grid.prototype.isRowDragable = function () {\n return this.allowRowDragAndDrop && !this.rowDropSettings.targetID;\n };\n /**\n * Changes the Grid column positions by field names.\n *\n * @param {string} fromFName - Defines the origin field name.\n * @param {string} toFName - Defines the destination field name.\n *\n * @returns {void}\n */\n Grid.prototype.reorderColumns = function (fromFName, toFName) {\n if (this.reorderModule) {\n this.reorderModule.reorderColumns(fromFName, toFName);\n }\n };\n /**\n * Changes the Grid column positions by field index. If you invoke reorderColumnByIndex multiple times,\n * then you won't get the same results every time.\n *\n * @param {number} fromIndex - Defines the origin field index.\n * @param {number} toIndex - Defines the destination field index.\n *\n * @returns {void}\n */\n Grid.prototype.reorderColumnByIndex = function (fromIndex, toIndex) {\n if (this.reorderModule) {\n this.reorderModule.reorderColumnByIndex(fromIndex, toIndex);\n }\n };\n /**\n * Changes the Grid column positions by field index. If you invoke reorderColumnByTargetIndex multiple times,\n * then you will get the same results every time.\n *\n * @param {string} fieldName - Defines the field name.\n * @param {number} toIndex - Defines the destination field index.\n *\n * @returns {void}\n */\n Grid.prototype.reorderColumnByTargetIndex = function (fieldName, toIndex) {\n if (this.reorderModule) {\n this.reorderModule.reorderColumnByTargetIndex(fieldName, toIndex);\n }\n };\n /**\n * Changes the Grid Row position with given indexes.\n *\n * @param {number} fromIndexes - Defines the origin Indexes.\n * @param {number} toIndex - Defines the destination Index.\n *\n * @returns {void}\n */\n Grid.prototype.reorderRows = function (fromIndexes, toIndex) {\n if (this.rowDragAndDropModule) {\n this.rowDragAndDropModule.reorderRows(fromIndexes, toIndex);\n }\n };\n /**\n * @param {ReturnType} e - Defines the Return type\n * @returns {void}\n * @hidden\n */\n Grid.prototype.refreshDataSource = function (e) {\n this.notify('refreshdataSource', e);\n };\n /**\n * @param {boolean} enable -Defines the enable\n * @returns {void}\n * @hidden\n */\n Grid.prototype.disableRowDD = function (enable) {\n var headerTable = this.getHeaderTable();\n var contentTable = this.getContentTable();\n var headerRows = headerTable.querySelectorAll('th.e-rowdragheader, th.e-mastercell');\n var rows = this.getRows();\n var disValue = enable ? 'none' : '';\n setStyleAttribute(headerTable.querySelector(literals.colGroup).childNodes[0], { 'display': disValue });\n setStyleAttribute(contentTable.querySelector(literals.colGroup).childNodes[0], { 'display': disValue });\n for (var i = 0; i < this.getRows().length; i++) {\n var ele = rows[parseInt(i.toString(), 10)].firstElementChild;\n if (enable) {\n addClass([ele], 'e-hide');\n }\n else {\n removeClass([ele], ['e-hide']);\n }\n }\n for (var j = 0; j < headerTable.querySelectorAll('th.e-rowdragheader, th.e-mastercell').length; j++) {\n var ele = headerRows[parseInt(j.toString(), 10)];\n if (enable) {\n addClass([ele], 'e-hide');\n }\n else {\n removeClass([ele], ['e-hide']);\n }\n }\n };\n /**\n * Changes the column width to automatically fit its content to ensure that the width shows the content without wrapping/hiding.\n * > * This method ignores the hidden columns.\n * > * Uses the `autoFitColumns` method in the `dataBound` event to resize at initial rendering.\n * > * By specifying the start row index and end row index, providing the range within which the maximum width for that column should be considered when applying `autoFitColumns`.\n * > * The width of header rows is always calculated. If the width of a header row exceeds the specified range, its width will be allocated to the specific content rows.\n *\n * @param {string |string[]} fieldNames - Defines the column names.\n * @param {number} startRowIndex - Specifies the start index of the content row.\n * @param {number} endRowIndex - Specifies the end index of content row.\n * @returns {void}\n *\n *\n * ```typescript\n *
    \n * \n * ```\n *\n */\n Grid.prototype.autoFitColumns = function (fieldNames, startRowIndex, endRowIndex) {\n var injectedModules = this.getInjectedModules();\n var resize = injectedModules.find(function (item) {\n if (typeof item === 'function' && !isNullOrUndefined(item.prototype)) {\n return item.prototype.getModuleName() === 'resize';\n }\n else {\n return item.name === 'Resize';\n }\n });\n if (!this.resizeModule && resize) {\n this.autoFitColumnsResize = true;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.injectModules();\n }\n if (this.resizeModule) {\n this.resizeModule.autoFitColumns(fieldNames, startRowIndex, endRowIndex);\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Grid.prototype.preventAdjustColumns = function () {\n if ((this.enableAdaptiveUI && this.rowRenderingMode === 'Vertical')\n || (this.allowResizing && this.resizeSettings.mode === 'Auto')) {\n return;\n }\n var columns = this.getColumns();\n var headerTable = this.getHeaderTable();\n var tableWidth = 0;\n for (var i = 0; i < columns.length; i++) {\n if (columns[parseInt(i.toString(), 10)].visible) {\n if (this.groupSettings.columns.length\n && this.groupSettings.columns.indexOf(columns[parseInt(i.toString(), 10)].field) > -1) {\n var headerCol = [].slice.call(headerTable.querySelector('colgroup')\n .querySelectorAll(':not(.e-group-intent):not(.e-detail-intent):not(.e-drag-intent)'));\n if (headerCol[parseInt(i.toString(), 10)].style.display === 'none') {\n continue;\n }\n }\n if (columns[parseInt(i.toString(), 10)].width) {\n tableWidth += parseFloat(columns[parseInt(i.toString(), 10)].width.toString());\n }\n else {\n tableWidth = 0;\n break;\n }\n }\n }\n if (tableWidth) {\n var percentageWidth = this.isPercentageWidthGrid();\n var unit = this.widthUnit(percentageWidth);\n var contentTable = this.getContentTable();\n if (this.groupSettings.columns.length || this.isDetail() || this.isRowDragable()) {\n var indentWidth = this.defaultIndentWidth(percentageWidth);\n var indentWidthUnitFormat = indentWidth.toString() + unit;\n var headerIndentCol = [].slice.call(headerTable.querySelector('colgroup')\n .querySelectorAll('.e-group-intent, .e-detail-intent, .e-drag-intent'));\n var contentIndentCol = [].slice.call(contentTable.querySelector('colgroup')\n .querySelectorAll('.e-group-intent, .e-detail-intent, .e-drag-intent'));\n for (var i = 0; i < headerIndentCol.length; i++) {\n headerIndentCol[parseInt(i.toString(), 10)].style.setProperty('width', indentWidthUnitFormat);\n contentIndentCol[parseInt(i.toString(), 10)].style.setProperty('width', indentWidthUnitFormat);\n tableWidth += indentWidth;\n }\n }\n if ((percentageWidth && tableWidth < 100)\n || (!percentageWidth && tableWidth < contentTable.parentElement.clientWidth)) {\n if (!isNullOrUndefined(contentTable.querySelector('.e-emptyrow'))) {\n addClass([headerTable], ['e-tableborder']);\n removeClass([contentTable], ['e-tableborder']);\n }\n else {\n addClass([headerTable, contentTable], ['e-tableborder']);\n }\n }\n var tableWidthUnitFormat = tableWidth.toString() + unit;\n headerTable.style.setProperty('width', tableWidthUnitFormat);\n contentTable.style.setProperty('width', tableWidthUnitFormat);\n }\n else {\n this.restoreAdjustColumns();\n }\n };\n Grid.prototype.restoreAdjustColumns = function () {\n if ((this.enableAdaptiveUI && this.rowRenderingMode === 'Vertical')\n || (this.allowResizing && this.resizeSettings.mode === 'Auto')) {\n return;\n }\n var headerTable = this.getHeaderTable();\n var contentTable = this.getContentTable();\n removeClass([headerTable, contentTable], ['e-tableborder']);\n headerTable.style.removeProperty('width');\n contentTable.style.removeProperty('width');\n if (this.groupSettings.columns.length || this.isDetail() || this.isRowDragable()) {\n var percentageWidth = this.isPercentageWidthGrid();\n var indentWidthUnitFormat_1 = this.defaultIndentWidth(percentageWidth).toString() + this.widthUnit(percentageWidth);\n var headerIndentCol = [].slice.call(headerTable.querySelector('colgroup')\n .querySelectorAll('.e-group-intent, .e-detail-intent, .e-drag-intent'));\n headerIndentCol.forEach(function (element) {\n element.style.setProperty('width', indentWidthUnitFormat_1);\n });\n headerTable.querySelector('.e-emptycell').removeAttribute('indentRefreshed');\n this.recalcIndentWidth();\n }\n };\n Grid.prototype.widthUnit = function (percentageWidth) {\n return percentageWidth ? '%' : 'px';\n };\n Grid.prototype.defaultIndentWidth = function (percentageWidth) {\n return percentageWidth ? parseFloat((30 / this.element.offsetWidth * 100).toFixed(1)) : 30;\n };\n Grid.prototype.isPercentageWidthGrid = function () {\n return this.getColumns()[0].width.toString().indexOf('%') > -1;\n };\n /**\n * @param {number} x - Defines the number\n * @param {number} y - Defines the number\n * @param {Element} target - Defines the Element\n * @returns {void}\n * @hidden\n */\n Grid.prototype.createColumnchooser = function (x, y, target) {\n if (this.columnChooserModule) {\n this.columnChooserModule.renderColumnChooser(x, y, target);\n }\n };\n Grid.prototype.initializeServices = function () {\n this.serviceLocator.register('widthService', this.widthService = new ColumnWidthService(this));\n this.serviceLocator.register('cellRendererFactory', new CellRendererFactory);\n this.serviceLocator.register('rendererFactory', new RendererFactory);\n this.serviceLocator.register('localization', this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale));\n this.serviceLocator.register('valueFormatter', this.valueFormatterService = new ValueFormatter(this.locale));\n this.serviceLocator.register('showHideService', this.showHider = new ShowHide(this));\n this.serviceLocator.register('ariaService', this.ariaService = new AriaService());\n this.serviceLocator.register('focus', this.focusModule = new FocusStrategy(this));\n };\n Grid.prototype.processModel = function () {\n var gCols = this.groupSettings.columns;\n var sCols = this.sortSettings.columns;\n var flag;\n var j;\n if (this.allowGrouping) {\n var _loop_3 = function (i, len) {\n j = 0;\n for (var sLen = sCols.length; j < sLen; j++) {\n if (sCols[parseInt(j.toString(), 10)].field === gCols[parseInt(i.toString(), 10)]) {\n flag = true;\n break;\n }\n }\n if (!flag) {\n sCols.push({ field: gCols[parseInt(i.toString(), 10)], direction: 'Ascending', isFromGroup: true });\n }\n else {\n if (this_3.allowSorting) {\n this_3.sortedColumns.push(sCols[parseInt(j.toString(), 10)].field);\n }\n else {\n sCols[parseInt(j.toString(), 10)].direction = 'Ascending';\n }\n }\n if (!this_3.groupSettings.showGroupedColumn) {\n var column = this_3.enableColumnVirtualization ?\n this_3.columns.filter(function (c) { return c.field === gCols[parseInt(i.toString(), 10)]; })[0]\n : this_3.getColumnByField(gCols[parseInt(i.toString(), 10)]);\n if (column) {\n column.visible = false;\n }\n else {\n this_3.log('initial_action', { moduleName: 'group', columnName: gCols[parseInt(i.toString(), 10)] });\n }\n }\n };\n var this_3 = this;\n for (var i = 0, len = gCols.length; i < len; i++) {\n _loop_3(i, len);\n }\n }\n if (!gCols.length) {\n for (var i = 0; i < sCols.length; i++) {\n this.sortedColumns.push(sCols[parseInt(i.toString(), 10)].field);\n }\n }\n this.rowTemplateFn = templateCompiler(this.rowTemplate);\n this.emptyRecordTemplateFn = templateCompiler(this.emptyRecordTemplate);\n this.detailTemplateFn = templateCompiler(this.detailTemplate);\n this.editTemplateFn = templateCompiler(this.editSettings.template);\n this.editHeaderTemplateFn = templateCompiler(this.editSettings.headerTemplate);\n this.editFooterTemplateFn = templateCompiler(this.editSettings.footerTemplate);\n if (!isNullOrUndefined(this.parentDetails)) {\n var value = isNullOrUndefined(this.parentDetails.parentKeyFieldValue) ? 'undefined' :\n this.parentDetails.parentKeyFieldValue;\n this.query.where(this.queryString, 'equal', value, true);\n }\n this.initForeignColumn();\n };\n Grid.prototype.initForeignColumn = function () {\n if (this.isForeignKeyEnabled(this.getColumns())) {\n this.notify(events.initForeignKeyColumn, this.getForeignKeyColumns());\n }\n };\n Grid.prototype.enableVerticalRendering = function () {\n if (this.rowRenderingMode === 'Vertical') {\n this.element.classList.add('e-row-responsive');\n }\n else {\n this.element.classList.remove('e-row-responsive');\n }\n };\n Grid.prototype.gridRender = function () {\n var _a;\n this.updateRTL();\n if (this.rowRenderingMode === 'Vertical') {\n this.element.classList.add('e-row-responsive');\n }\n if (this.enableHover) {\n this.element.classList.add('e-gridhover');\n }\n if (Browser.isDevice) {\n this.element.classList.add('e-device');\n }\n if (this.rowHeight) {\n this.element.classList.add('e-grid-min-height');\n }\n if (this.cssClass) {\n if (this.cssClass.indexOf(' ') !== -1) {\n (_a = this.element.classList).add.apply(_a, this.cssClass.split(' '));\n }\n else {\n this.element.classList.add(this.cssClass);\n }\n }\n // If the below if statement is removed, then drag and drop between grids will not work in firefox browser.\n if (this.allowRowDragAndDrop && this.rowDropSettings.targetID && Browser.info.name === 'mozilla') {\n this.element.classList.add('e-disableuserselect');\n }\n if (this.editSettings.showAddNewRow && (this.enableVirtualization || this.enableInfiniteScrolling)) {\n this.editSettings.newRowPosition = 'Top';\n }\n classList(this.element, ['e-responsive', 'e-default'], []);\n var rendererFactory = this.serviceLocator.getService('rendererFactory');\n this.headerModule = rendererFactory.getRenderer(RenderType.Header);\n this.contentModule = rendererFactory.getRenderer(RenderType.Content);\n this.printModule = new Print(this, this.scrollModule);\n this.clipboardModule = new Clipboard(this, this.serviceLocator);\n this.renderModule.render();\n this.eventInitializer();\n this.createGridPopUpElement();\n this.widthService.setWidthToColumns();\n this.updateGridLines();\n this.applyTextWrap();\n this.createTooltip(); //for clip mode ellipsis\n this.enableBoxSelection();\n };\n Grid.prototype.dataReady = function () {\n this.scrollModule.setWidth();\n this.scrollModule.setHeight();\n if (this.height !== 'auto') {\n this.scrollModule.setPadding();\n }\n };\n Grid.prototype.updateRTL = function () {\n if (this.enableRtl) {\n this.element.classList.add('e-rtl');\n }\n else {\n this.element.classList.remove('e-rtl');\n }\n };\n Grid.prototype.createGridPopUpElement = function () {\n var popup = this.createElement('div', { className: 'e-gridpopup', styles: 'display:none;' });\n var content = this.createElement('div', { className: literals.content, attrs: { tabIndex: '-1' } });\n append([content, this.createElement('div', { className: 'e-uptail e-tail' })], popup);\n content.appendChild(this.createElement('span'));\n append([content, this.createElement('div', { className: 'e-downtail e-tail' })], popup);\n this.element.appendChild(popup);\n };\n Grid.prototype.updateGridLines = function () {\n classList(this.element, [], ['e-verticallines', 'e-horizontallines', 'e-hidelines', 'e-bothlines']);\n switch (this.gridLines) {\n case 'Horizontal':\n this.element.classList.add('e-horizontallines');\n break;\n case 'Vertical':\n this.element.classList.add('e-verticallines');\n break;\n case 'None':\n this.element.classList.add('e-hidelines');\n break;\n case 'Both':\n this.element.classList.add('e-bothlines');\n break;\n }\n this.updateResizeLines();\n };\n Grid.prototype.updateResizeLines = function () {\n if (this.allowResizing &&\n !(this.gridLines === 'Vertical' || this.gridLines === 'Both')) {\n this.element.classList.add('e-resize-lines');\n }\n else {\n this.element.classList.remove('e-resize-lines');\n }\n };\n /**\n * The function is used to apply text wrap\n *\n * @returns {void}\n * @hidden\n */\n Grid.prototype.applyTextWrap = function () {\n if (this.allowTextWrap) {\n var headerRows = [].slice.call(this.element.getElementsByClassName('e-columnheader'));\n switch (this.textWrapSettings.wrapMode) {\n case 'Header':\n wrap(this.element, false);\n wrap(this.getContent(), false);\n wrap(headerRows, true);\n break;\n case 'Content':\n wrap(this.getContent(), true);\n wrap(this.element, false);\n wrap(headerRows, false);\n break;\n default:\n wrap(this.element, true);\n wrap(this.getContent(), false);\n wrap(headerRows, false);\n }\n if (this.textWrapSettings.wrapMode !== 'Content') {\n this.notify(events.refreshHandlers, {});\n }\n }\n };\n /**\n * The function is used to remove text wrap\n *\n * @returns {void}\n * @hidden\n */\n Grid.prototype.removeTextWrap = function () {\n wrap(this.element, false);\n var headerRows = [].slice.call(this.element.getElementsByClassName('e-columnheader'));\n wrap(headerRows, false);\n wrap(this.getContent(), false);\n if (this.textWrapSettings.wrapMode !== 'Content') {\n this.notify(events.refreshHandlers, {});\n }\n };\n /**\n * The function is used to add Tooltip to the grid cell that has ellipsiswithtooltip clip mode.\n *\n * @returns {void}\n * @hidden\n */\n Grid.prototype.createTooltip = function () {\n this.toolTipObj = new Tooltip({\n opensOn: 'custom',\n content: '',\n cssClass: this.cssClass ? this.cssClass : null\n }, this.element);\n };\n /** @hidden\n * @returns {void}\n */\n Grid.prototype.freezeRefresh = function () {\n if (this.enableVirtualization || this.enableInfiniteScrolling) {\n this.pageSettings.currentPage = 1;\n }\n this.componentRefresh();\n };\n Grid.prototype.getTooltipStatus = function (element) {\n var headerTable = this.getHeaderTable();\n var headerDivTag = this.enableAdaptiveUI && this.rowRenderingMode === 'Vertical' ? 'e-gridcontent' : 'e-gridheader';\n var htable = this.createTable(headerTable, headerDivTag, 'header');\n var ctable = this.createTable(headerTable, headerDivTag, 'content');\n var table = element.classList.contains('e-headercell') ? htable : ctable;\n var ele = element.classList.contains('e-headercell') ? 'th' : 'tr';\n table.querySelector(ele).className = element.className;\n table.querySelector(ele).innerHTML = element.innerHTML;\n var width = table.querySelector(ele).getBoundingClientRect().width;\n document.body.removeChild(htable);\n document.body.removeChild(ctable);\n if ((width > element.getBoundingClientRect().width && !element.classList.contains('e-editedbatchcell')) ||\n (this.enableAdaptiveUI && this.rowRenderingMode === 'Vertical' &&\n width > (element.getBoundingClientRect().width * 0.55) - (this.height !== 'auto' ? 16 : 0))) {\n // 0.55 - defines the width of adaptive content cell, 16 - defines the scrollbar width\n return true;\n }\n return false;\n };\n Grid.prototype.mouseMoveHandler = function (e) {\n if (this.isEllipsisTooltip()) {\n var element = parentsUntil(e.target, 'e-ellipsistooltip');\n if (this.prevElement !== element || e.type === 'mouseout') {\n this.toolTipObj.close();\n }\n var tagName = e.target.tagName;\n var elemNames = ['A', 'BUTTON', 'INPUT'];\n if (element && e.type !== 'mouseout' && !(Browser.isDevice && elemNames.indexOf(tagName) !== -1)) {\n if (this.getTooltipStatus(element)) {\n var col = this.getColumns()[parseInt(element.getAttribute(literals.dataColIndex), 10)];\n var domSetter = col.disableHtmlEncode ? 'innerText' : 'innerHTML';\n var contentDiv = this.createElement('div');\n if (element.getElementsByClassName('e-headertext').length) {\n var innerElement = element.getElementsByClassName('e-headertext')[0];\n contentDiv[\"\" + domSetter] = this.sanitize(innerElement.innerText);\n this.toolTipObj.content = contentDiv;\n }\n else {\n contentDiv[\"\" + domSetter] = this.sanitize(element.innerText);\n this.toolTipObj.content = contentDiv;\n }\n this.prevElement = element;\n if (this.enableHtmlSanitizer) {\n this.toolTipObj.enableHtmlSanitizer = true;\n }\n if (col.disableHtmlEncode) {\n this.toolTipObj.enableHtmlParse = false;\n }\n this.toolTipObj['open'](element);\n }\n }\n }\n };\n Grid.prototype.isEllipsisTooltip = function () {\n var cols = this.getColumns();\n if (this.clipMode === 'EllipsisWithTooltip') {\n return true;\n }\n for (var i = 0; i < cols.length; i++) {\n if (cols[parseInt(i.toString(), 10)].clipMode === 'EllipsisWithTooltip') {\n return true;\n }\n }\n return false;\n };\n Grid.prototype.scrollHandler = function () {\n if (this.isEllipsisTooltip()) {\n this.toolTipObj.close();\n }\n };\n /**\n * To create table for ellipsiswithtooltip\n *\n * @param {Element} table - Defines the table\n * @param {string} tag - Defines the tag\n * @param {string} type - Defines the type\n * @returns {HTMLDivElement} Returns the HTML div ELement\n * @hidden\n */\n Grid.prototype.createTable = function (table, tag, type) {\n var myTableDiv = this.createElement('div');\n myTableDiv.className = this.element.className;\n myTableDiv.style.cssText = 'display: inline-block;visibility:hidden;position:absolute';\n var mySubDiv = this.createElement('div');\n mySubDiv.className = tag;\n var myTable = this.createElement('table');\n myTable.className = table.className;\n myTable.style.cssText = 'table-layout: auto;width: auto';\n var ele = (type === 'header') ? 'th' : 'td';\n var myTr = this.createElement('tr', { attrs: { role: 'row' } });\n var mytd = this.createElement(ele);\n myTr.appendChild(mytd);\n myTable.appendChild(myTr);\n mySubDiv.appendChild(myTable);\n myTableDiv.appendChild(mySubDiv);\n document.body.appendChild(myTableDiv);\n return myTableDiv;\n };\n Grid.prototype.onKeyPressed = function (e) {\n if (e.action === 'tab' || e.action === 'shiftTab') {\n this.toolTipObj.close();\n }\n };\n /**\n * Binding events to the element while component creation.\n *\n * @hidden\n * @returns {void}\n */\n Grid.prototype.wireEvents = function () {\n EventHandler.add(this.element, 'click', this.mouseClickHandler, this);\n EventHandler.add(this.element, 'touchend', this.mouseClickHandler, this);\n EventHandler.add(this.element, 'focusout', this.focusOutHandler, this);\n EventHandler.add(this.element, 'dblclick', this.dblClickHandler, this);\n EventHandler.add(this.element, 'keydown', this.keyPressHandler, this);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n EventHandler.add(window, 'resize', this.resetIndentWidth, this);\n if (this.allowKeyboard) {\n this.element.tabIndex = this.element.tabIndex === -1 ? 0 : this.element.tabIndex;\n }\n this.keyboardModule = new KeyboardEvents(this.element, {\n keyAction: this.keyActionHandler.bind(this),\n keyConfigs: this.keyConfigs,\n eventName: 'keydown'\n });\n EventHandler.add(this.getContent().firstElementChild, 'scroll', this.scrollHandler, this);\n EventHandler.add(this.element, 'mouseover', this.mouseMoveHandler, this);\n EventHandler.add(this.element, 'mouseout', this.mouseMoveHandler, this);\n EventHandler.add(this.getContent(), 'touchstart', this.tapEvent, this);\n EventHandler.add(document.body, 'keydown', this.keyDownHandler, this);\n };\n /**\n * Unbinding events from the element while component destroy.\n *\n * @hidden\n * @returns {void}\n */\n Grid.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, 'click', this.mouseClickHandler);\n EventHandler.remove(this.element, 'touchend', this.mouseClickHandler);\n EventHandler.remove(this.element, 'focusout', this.focusOutHandler);\n EventHandler.remove(this.element, 'dblclick', this.dblClickHandler);\n EventHandler.remove(this.getContent().firstElementChild, 'scroll', this.scrollHandler);\n EventHandler.remove(this.element, 'mouseover', this.mouseMoveHandler);\n EventHandler.remove(this.element, 'mouseout', this.mouseMoveHandler);\n EventHandler.remove(this.element, 'keydown', this.keyPressHandler);\n EventHandler.remove(this.getContent(), 'touchstart', this.tapEvent);\n EventHandler.remove(document.body, 'keydown', this.keyDownHandler);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n EventHandler.remove(window, 'resize', this.resetIndentWidth);\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.addListener = function () {\n if (this.isDestroyed) {\n return;\n }\n this.on(events.dataReady, this.dataReady, this);\n this.on(events.contentReady, this.recalcIndentWidth, this);\n this.on(events.headerRefreshed, this.recalcIndentWidth, this);\n this.on(events.refreshFrozenPosition, this.refreshFrozenPosition, this);\n this.on(events.refreshSplitFrozenColumn, this.refreshSplitFrozenColumn, this);\n this.dataBoundFunction = this.refreshMediaCol.bind(this);\n this.addEventListener(events.dataBound, this.dataBoundFunction);\n this.on(events.keyPressed, this.onKeyPressed, this);\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.removeListener = function () {\n if (this.isDestroyed) {\n return;\n }\n this.off(events.dataReady, this.dataReady);\n this.off(events.contentReady, this.recalcIndentWidth);\n this.off(events.headerRefreshed, this.recalcIndentWidth);\n this.on(events.refreshFrozenPosition, this.refreshFrozenPosition, this);\n this.on(events.refreshSplitFrozenColumn, this.refreshSplitFrozenColumn, this);\n this.removeEventListener(events.dataBound, this.dataBoundFunction);\n this.off(events.keyPressed, this.onKeyPressed);\n };\n /**\n * Get current visible data of grid.\n *\n * @returns {Object[]} Returns the current view records\n *\n * @isGenericType true\n */\n Grid.prototype.getCurrentViewRecords = function () {\n if (isGroupAdaptive(this)) {\n return isNullOrUndefined(this.currentViewData.records) ?\n this.currentViewData : this.currentViewData.records;\n }\n if (this.groupSettings.enableLazyLoading) {\n return this.currentViewData;\n }\n return (this.allowGrouping && this.groupSettings.columns.length && this.currentViewData.length\n && this.currentViewData.records) ? this.currentViewData.records\n : this.currentViewData;\n };\n Grid.prototype.mouseClickHandler = function (e) {\n if (this.isChildGrid(e) || (parentsUntil(e.target, 'e-gridpopup') && e.touches) ||\n this.element.getElementsByClassName('e-cloneproperties').length || this.checkEdit(e)) {\n return;\n }\n if (((!this.allowRowDragAndDrop && (parentsUntil(e.target, literals.gridContent) ||\n e.target.tagName === 'TD')) || (parentsUntil(e.target, 'e-headercell') &&\n parentsUntil(e.target, 'e-headercell').querySelector('.e-checkselectall')) ||\n (!(this.allowGrouping || this.allowReordering) && parentsUntil(e.target, 'e-gridheader'))) &&\n e.touches) {\n return;\n }\n if (parentsUntil(e.target, 'e-gridheader') && this.allowRowDragAndDrop &&\n !(parentsUntil(e.target, 'e-filterbarcell')) && (e.target &&\n ['A', 'BUTTON', 'INPUT'].indexOf(e.target.tagName) === -1)) {\n e.preventDefault();\n }\n var args = this.getRowInfo(e.target);\n var cancel = 'cancel';\n args[\"\" + cancel] = false;\n var isDataRow = false;\n var tr = closest(e.target, 'tr');\n if (tr && tr.getAttribute('data-uid')) {\n var rowObj = this.getRowObjectFromUID(tr.getAttribute('data-uid'));\n isDataRow = rowObj ? rowObj.isDataRow : false;\n }\n if (isDataRow) {\n this.trigger(events.recordClick, args);\n }\n this.notify(events.click, e);\n };\n Grid.prototype.checkEdit = function (e) {\n var tr = parentsUntil(e.target, literals.row);\n var isEdit = this.editSettings.mode !== 'Batch' &&\n this.isEdit && tr && (tr.classList.contains(literals.editedRow) || (tr.classList.contains(literals.addedRow)) &&\n !this.editSettings.showAddNewRow);\n return !parentsUntil(e.target, 'e-unboundcelldiv') && (isEdit || (parentsUntil(e.target, literals.rowCell) &&\n parentsUntil(e.target, literals.rowCell).classList.contains('e-editedbatchcell')));\n };\n Grid.prototype.dblClickHandler = function (e) {\n var grid = parentsUntil(e.target, 'e-grid');\n if (isNullOrUndefined(grid) || grid.id !== this.element.id || closest(e.target, '.e-unboundcelldiv')) {\n return;\n }\n var dataRow = false;\n var tr = closest(e.target, 'tr');\n if (tr && tr.getAttribute('data-uid')) {\n var rowObj = this.getRowObjectFromUID(tr.getAttribute('data-uid'));\n dataRow = rowObj ? rowObj.isDataRow : false;\n }\n var args = this.getRowInfo(e.target);\n args.target = e.target;\n if (dataRow) {\n this.trigger(events.recordDoubleClick, args);\n }\n this.notify(events.dblclick, e);\n };\n Grid.prototype.focusOutHandler = function (e) {\n if (this.isChildGrid(e)) {\n return;\n }\n if (!parentsUntil(e.target, 'e-grid')) {\n this.element.querySelector('.e-gridpopup').style.display = 'None';\n }\n var filterClear = this.element.querySelector('.e-cancel:not(.e-hide)');\n if (filterClear && !filterClear.parentElement.classList.contains('e-tbar-btn')) {\n filterClear.classList.add('e-hide');\n }\n var relatedTarget = e.relatedTarget;\n var ariaOwns = relatedTarget ? relatedTarget.getAttribute('aria-owns') : null;\n if ((!relatedTarget || (!parentsUntil(relatedTarget, 'e-grid') &&\n (!isNullOrUndefined(ariaOwns) &&\n (ariaOwns)) !== e.target.getAttribute('aria-owns')))\n && !this.keyPress && this.isEdit && !Browser.isDevice) {\n if (this.editSettings.mode === 'Batch' && !(((parentsUntil(relatedTarget, 'e-ddl') || parentsUntil(relatedTarget, 'e-ddt')) &&\n (parentsUntil(relatedTarget, 'e-multi-select-list-wrapper') || parentsUntil(relatedTarget, 'e-input-filter'))) &&\n parentsUntil(relatedTarget, 'e-input-group')) && (parentsUntil(relatedTarget, 'e-uploader') || !(relatedTarget &&\n isNullOrUndefined(parentsUntil(relatedTarget, 'e-input-group'))))) {\n this.editModule.saveCell();\n this.notify(events.editNextValCell, {});\n }\n if (this.editSettings.mode === 'Normal') {\n this.editModule.editFormValidate();\n }\n }\n if (this.editSettings.showAddNewRow) {\n this.editModule.isShowAddedRowValidate = false;\n }\n this.keyPress = false;\n };\n Grid.prototype.isChildGrid = function (e) {\n var gridElement = parentsUntil(e.target, 'e-grid');\n if ((gridElement && gridElement.id !== this.element.id) || (parentsUntil(e.target, 'e-unboundcelldiv') &&\n isNullOrUndefined(gridElement))) {\n return true;\n }\n return false;\n };\n /**\n * @param {Object} persistedData - Defines the persisted data\n * @returns {void}\n * @hidden\n */\n Grid.prototype.mergePersistGridData = function (persistedData) {\n var data = this.getLocalData();\n if (!(isNullOrUndefined(data) || (data === '')) || !isNullOrUndefined(persistedData)) {\n var dataObj = !isNullOrUndefined(persistedData) ? persistedData : JSON.parse(data);\n if (this.enableVirtualization && dataObj.pageSettings) {\n dataObj.pageSettings.currentPage = 1;\n }\n var keys = Object.keys(dataObj);\n this.isProtectedOnChange = true;\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n if ((typeof this[\"\" + key] === 'object') && !isNullOrUndefined(this[\"\" + key])) {\n if (Array.isArray(this[\"\" + key]) && key === 'columns') {\n this.setFrozenCount();\n setColumnIndex(this[\"\" + key]);\n this.mergeColumns(dataObj[\"\" + key], this[\"\" + key]);\n this.mergedColumns = true;\n this[\"\" + key] = dataObj[\"\" + key];\n }\n else {\n extend(this[\"\" + key], dataObj[\"\" + key]);\n }\n }\n else {\n this[\"\" + key] = dataObj[\"\" + key];\n }\n }\n this.isProtectedOnChange = false;\n }\n };\n Grid.prototype.mergeColumns = function (storedColumn, columns) {\n var storedColumns = storedColumn;\n var isFrozenGrid = this.isFrozenGrid();\n var _loop_4 = function (i) {\n var localCol = columns.filter(function (tCol) { return isFrozenGrid ?\n tCol.index === storedColumns[parseInt(i.toString(), 10)][\"\" + literals.initialFrozenColumnIndex] :\n tCol.index === storedColumns[parseInt(i.toString(), 10)].index; })[0];\n if (!isNullOrUndefined(localCol)) {\n if (isFrozenGrid) {\n localCol = extend({}, localCol, {}, true);\n localCol.freeze = storedColumns[parseInt(i.toString(), 10)].freeze;\n }\n if (localCol.columns && localCol.columns.length) {\n this_4.mergeColumns(storedColumns[parseInt(i.toString(), 10)].columns, localCol.columns);\n storedColumns[parseInt(i.toString(), 10)] = extend(localCol, storedColumns[parseInt(i.toString(), 10)], {}, true);\n }\n else {\n storedColumns[parseInt(i.toString(), 10)] = extend(localCol, storedColumns[parseInt(i.toString(), 10)], {}, true);\n }\n }\n };\n var this_4 = this;\n for (var i = 0; i < storedColumns.length; i++) {\n _loop_4(i);\n }\n };\n /**\n * @hidden\n * @returns {boolean} Returns the isDetail\n */\n Grid.prototype.isDetail = function () {\n return !isNullOrUndefined(this.detailTemplate) || !isNullOrUndefined(this.childGrid);\n };\n Grid.prototype.isCommandColumn = function (columns) {\n var _this_1 = this;\n return columns.some(function (col) {\n if (col.columns) {\n return _this_1.isCommandColumn(col.columns);\n }\n return !!(col.commands || col.commandsTemplate);\n });\n };\n Grid.prototype.isForeignKeyEnabled = function (columns) {\n var _this_1 = this;\n return columns.some(function (col) {\n if (col.columns) {\n return _this_1.isForeignKeyEnabled(col.columns);\n }\n return !!(col.dataSource && col.foreignKeyValue);\n });\n };\n Grid.prototype.keyPressHandler = function (e) {\n var presskey = extend(e, { cancel: false });\n this.trigger('keyPressed', presskey);\n if (presskey.cancel === true) {\n e.stopImmediatePropagation();\n }\n };\n Grid.prototype.keyDownHandler = function (e) {\n if (e.altKey) {\n if (e.keyCode === 74) { //alt j\n if (this.keyA) { //alt A J\n this.notify(events.groupCollapse, { target: e.target, collapse: false });\n this.keyA = false;\n }\n else {\n if (this.focusModule && this.focusModule.currentInfo && this.focusModule.currentInfo.element) {\n removeClass([this.focusModule.currentInfo.element, this.focusModule.currentInfo.elementToFocus], ['e-focused', 'e-focus']);\n this.focusModule.currentInfo.element.tabIndex = -1;\n }\n if (!this.element.classList.contains('e-childgrid')) {\n this.element.focus();\n }\n }\n }\n if (e.keyCode === 87) { //alt w\n var focusModule = this.focusModule;\n if (focusModule) {\n if (!this.currentViewData.length) {\n return;\n }\n focusModule.focusContent();\n focusModule.addOutline();\n }\n }\n if (e.keyCode === 65) { //alt A\n this.keyA = true;\n }\n if (e.keyCode === 72 && this.keyA) { //alt A H\n this.notify(events.groupCollapse, { target: e.target, collapse: true });\n this.keyA = false;\n }\n }\n if (e.keyCode === 13) {\n this.notify(events.enterKeyHandler, e);\n }\n };\n Grid.prototype.keyActionHandler = function (e) {\n if (this.isChildGrid(e) ||\n ((this.isEdit && (!this.editSettings.showAddNewRow || (this.editSettings.showAddNewRow &&\n this.element.querySelector(literals.editedRow)))) && e.action !== 'escape' && e.action !== 'enter'\n && e.action !== 'shiftEnter' && e.action !== 'tab' && e.action !== 'shiftTab')) {\n return;\n }\n else {\n this.keyPress = true;\n }\n if (this.allowKeyboard) {\n if (e.action === 'ctrlPlusP') {\n e.preventDefault();\n this.print();\n }\n this.notify(events.keyPressed, e);\n }\n };\n /**\n * @param {Function[]} modules - Defines the modules\n * @returns {void}\n * @hidden\n */\n Grid.prototype.setInjectedModules = function (modules) {\n this.injectedModules = modules;\n };\n Grid.prototype.updateColumnObject = function () {\n prepareColumns(this.columns, this.enableColumnVirtualization, this);\n setColumnIndex(this.columns);\n this.initForeignColumn();\n this.notify(events.autoCol, {});\n };\n Grid.prototype.refreshFrozenPosition = function (obj) {\n if (obj && obj.isModeChg) {\n this.refreshColumns();\n this.notify(events.refreshResizePosition, {});\n }\n else {\n this.refreshColumns();\n }\n };\n /**\n * Gets the foreign columns from Grid.\n *\n * @returns {Column[]} Returns Foreign key column\n */\n Grid.prototype.getForeignKeyColumns = function () {\n return this.getColumns().filter(function (col) {\n return col.isForeignColumn();\n });\n };\n /**\n * @hidden\n * @returns {number} Returns row height\n */\n Grid.prototype.getRowHeight = function () {\n return this.rowHeight ? this.rowHeight : getRowHeight(this.element);\n };\n /**\n * Refreshes the Grid column changes.\n *\n * @returns {void}\n */\n Grid.prototype.refreshColumns = function () {\n this.freezeColumnRefresh = true;\n this.setFrozenCount();\n this.updateFrozenColumnsWidth();\n if (this.isFrozenGrid()) {\n this.isPreventScrollEvent = true;\n }\n this.updateColumnObject();\n this.checkLockColumns(this.getColumns());\n this.refresh();\n if (this.isFrozenGrid() && this.enableColumnVirtualization) {\n var left = this.getContent().querySelector('.e-movablescrollbar').scrollLeft;\n this.getHeaderContent().querySelector('.' + literals.headerContent).scrollLeft = left;\n this.getContent().querySelector('.' + literals.content).scrollLeft = left;\n }\n };\n /**\n * Export Grid data to Excel file(.xlsx).\n *\n * @param {ExcelExportProperties} excelExportProperties - Defines the export properties of the Grid.\n * @param {boolean} isMultipleExport - Define to enable multiple export.\n * @param {Workbook} workbook - Defines the Workbook if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns {Promise} Returns the excelexport\n */\n Grid.prototype.excelExport = function (excelExportProperties, isMultipleExport, \n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n workbook, isBlob) {\n if (this.exportGrids && this.exportGrids.length) {\n var gridIds = this.exportGrids.slice();\n return this.exportMultipleExcelGrids(gridIds, excelExportProperties, isMultipleExport, workbook, isBlob);\n }\n else {\n return this.excelExportModule ?\n this.excelExportModule.Map(this, excelExportProperties, isMultipleExport, workbook, false, isBlob) : null;\n }\n };\n /**\n * Export Grid data to CSV file.\n *\n * @param {ExcelExportProperties} excelExportProperties - Defines the export properties of the Grid.\n * @param {boolean} isMultipleExport - Define to enable multiple export.\n * @param {Workbook} workbook - Defines the Workbook if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n * @returns {Promise} Returns csv export\n */\n Grid.prototype.csvExport = function (excelExportProperties, \n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n isMultipleExport, workbook, isBlob) {\n return this.excelExportModule ?\n this.excelExportModule.Map(this, excelExportProperties, isMultipleExport, workbook, true, isBlob) : null;\n };\n /**\n * Export Grid data to PDF document.\n *\n * @param {pdfExportProperties} pdfExportProperties - Defines the export properties of the Grid.\n * @param {isMultipleExport} isMultipleExport - Define to enable multiple export.\n * @param {pdfDoc} pdfDoc - Defined the Pdf Document if multiple export is enabled.\n * @param {boolean} isBlob - If 'isBlob' set to true, then it will be returned as blob data.\n *\n * @returns {Promise} Returns pdfexport\n */\n Grid.prototype.pdfExport = function (pdfExportProperties, isMultipleExport, pdfDoc, isBlob) {\n if (this.exportGrids && this.exportGrids.length) {\n var gridIds = this.exportGrids.slice();\n return this.exportMultiplePdfGrids(gridIds, pdfExportProperties, isMultipleExport, pdfDoc, isBlob);\n }\n else {\n return this.pdfExportModule ? this.pdfExportModule.Map(this, pdfExportProperties, isMultipleExport, pdfDoc, isBlob) : null;\n }\n };\n Grid.prototype.exportMultiplePdfGrids = function (gridIds, pdfExportProperties, isMultipleExport, \n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n pdfDoc, isBlob) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var _this = this;\n if (gridIds.length !== 0) {\n var currentGridId = gridIds.shift();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var currentGridInstance = document.getElementById(currentGridId).ej2_instances[0];\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var exportPromise = currentGridInstance.pdfExportModule ?\n currentGridInstance.pdfExportModule.Map(currentGridInstance, pdfExportProperties, isMultipleExport, pdfDoc, isBlob)\n : Promise.resolve();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return exportPromise.then(function (exportedGridResults) {\n isMultipleExport = gridIds.length === 1 ? false : true;\n return _this.exportMultiplePdfGrids(gridIds, pdfExportProperties, isMultipleExport, exportedGridResults, isBlob);\n });\n }\n return null;\n };\n Grid.prototype.exportMultipleExcelGrids = function (gridIds, excelExportProperties, isMultipleExport, \n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n workbook, isBlob) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var _this = this;\n if (gridIds.length !== 0) {\n var currentGridId = gridIds.shift();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var currentGridInstance = document.getElementById(currentGridId).ej2_instances[0];\n var exportPromise = currentGridInstance.excelExportModule ?\n currentGridInstance.excelExportModule.Map(currentGridInstance, excelExportProperties, isMultipleExport, workbook, false, isBlob) : null;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return exportPromise.then(function (exportedGridResults) {\n isMultipleExport = gridIds.length === 1 ? false : true;\n return _this.exportMultipleExcelGrids(gridIds, excelExportProperties, isMultipleExport, exportedGridResults, isBlob);\n });\n }\n return null;\n };\n /**\n * Groups a column by column name.\n *\n * @param {string} columnName - Defines the column name to group.\n *\n * @returns {void}\n */\n Grid.prototype.groupColumn = function (columnName) {\n if (this.groupModule) {\n this.groupModule.groupColumn(columnName);\n }\n };\n /**\n * Expands all the grouped rows of the Grid.\n *\n * @returns {void}\n */\n Grid.prototype.groupExpandAll = function () {\n if (this.groupModule) {\n this.groupModule.expandAll();\n }\n };\n /**\n * Collapses all the grouped rows of the Grid.\n *\n * @returns {void}\n */\n Grid.prototype.groupCollapseAll = function () {\n if (this.groupModule) {\n this.groupModule.collapseAll();\n }\n };\n /**\n * Expands or collapses grouped rows by target element.\n *\n * @param {Element} target - Defines the target element of the grouped row.\n * @returns {void}\n */\n // public expandCollapseRows(target: Element): void {\n // if (this.groupModule) {\n // this.groupModule.expandCollapseRows(target);\n // }\n // }\n /**\n * Clears all the grouped columns of the Grid.\n *\n * @returns {void}\n */\n Grid.prototype.clearGrouping = function () {\n if (this.groupModule) {\n this.groupModule.clearGrouping();\n }\n };\n /**\n * Ungroups a column by column name.\n *\n * {% codeBlock src='grid/ungroupColumn/index.md' %}{% endcodeBlock %}\n *\n * @param {string} columnName - Defines the column name to ungroup.\n *\n * @returns {void}\n */\n Grid.prototype.ungroupColumn = function (columnName) {\n if (this.groupModule) {\n this.groupModule.ungroupColumn(columnName);\n }\n };\n /**\n * Column chooser can be displayed on screen by given position(X and Y axis).\n *\n * @param {number} x - Defines the X axis.\n * @param {number} y - Defines the Y axis.\n *\n * @returns {void}\n */\n Grid.prototype.openColumnChooser = function (x, y) {\n if (this.columnChooserModule) {\n this.columnChooserModule.openColumnChooser(x, y);\n }\n };\n Grid.prototype.scrollRefresh = function () {\n var _this_1 = this;\n var refresh = function () {\n _this_1.scrollModule.refresh();\n _this_1.off(events.contentReady, refresh);\n };\n this.on(events.contentReady, refresh, this);\n };\n /**\n * Collapses a detail row with the given target.\n *\n * @param {Element} target - Defines the expanded element to collapse.\n * @returns {void}\n */\n // public detailCollapse(target: number | Element): void {\n // if (this.detailRowModule) {\n // this.detailRowModule.collapse(target);\n // }\n // }\n /**\n * Collapses all the detail rows of the Grid.\n *\n * @returns {void}\n */\n Grid.prototype.detailCollapseAll = function () {\n if (this.detailRowModule) {\n this.detailRowModule.collapseAll();\n }\n };\n /**\n * Expands a detail row with the given target.\n *\n * @param {Element} target - Defines the collapsed element to expand.\n * @returns {void}\n */\n // public detailExpand(target: number | Element): void {\n // if (this.detailRowModule) {\n // this.detailRowModule.expand(target);\n // }\n // }\n /**\n * Expands all the detail rows of the Grid.\n *\n * @returns {void}\n */\n Grid.prototype.detailExpandAll = function () {\n if (this.detailRowModule) {\n this.detailRowModule.expandAll();\n }\n };\n /**\n * Deselects the currently selected cells.\n *\n * @returns {void}\n */\n Grid.prototype.clearCellSelection = function () {\n if (this.selectionModule) {\n this.selectionModule.clearCellSelection();\n }\n };\n /**\n * Deselects the currently selected rows.\n *\n * @returns {void}\n */\n Grid.prototype.clearRowSelection = function () {\n if (this.selectionModule) {\n this.selectionModule.clearRowSelection();\n }\n };\n /**\n * Selects a collection of cells by row and column indexes.\n *\n * @param {ISelectedCell[]} rowCellIndexes - Specifies the row and column indexes.\n *\n * @returns {void}\n */\n Grid.prototype.selectCells = function (rowCellIndexes) {\n if (this.selectionModule) {\n this.selectionModule.selectCells(rowCellIndexes);\n }\n };\n /**\n * Selects a range of rows from start and end row indexes.\n *\n * @param {number} startIndex - Specifies the start row index.\n * @param {number} endIndex - Specifies the end row index.\n *\n * @returns {void}\n */\n Grid.prototype.selectRowsByRange = function (startIndex, endIndex) {\n if (this.selectionModule) {\n this.selectionModule.selectRowsByRange(startIndex, endIndex);\n }\n };\n /**\n * @hidden\n * @returns {boolean} Returns whether context menu is open or not\n */\n Grid.prototype.isContextMenuOpen = function () {\n return this.contextMenuModule && this.contextMenuModule.isOpen;\n };\n /**\n * @param {Function} module - Defines the module\n * @returns {boolean} return the injected modules\n * @hidden\n */\n Grid.prototype.ensureModuleInjected = function (module) {\n return this.getInjectedModules().indexOf(module) >= 0;\n };\n /**\n * Destroys the given template reference.\n *\n * @param {string[]} propertyNames - Defines the collection of template name.\n * @param {any} index - specifies the index\n *\n * @returns {void}\n */\n // eslint-disable-next-line\n Grid.prototype.destroyTemplate = function (propertyNames, index) {\n this.clearTemplate(propertyNames, index);\n };\n /**\n * @param {string | string[]} type - Defines the type\n * @param {Object} args - Defines the arguments\n * @returns {void}\n * @hidden\n * @private\n */\n Grid.prototype.log = function (type, args) {\n var injectedModules = this.getInjectedModules();\n var logger = injectedModules.find(function (item) { return item.name === 'Logger'; });\n if (!logger) {\n Grid_1.Inject(Logger);\n this.enableLogger = true;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.injectModules();\n }\n // eslint-disable-next-line\n this.loggerModule ? this.loggerModule.log(type, args) : (function () { return 0; })();\n };\n /**\n * @param {Element} element - Defines the element\n * @returns {void}\n * @hidden\n */\n Grid.prototype.applyBiggerTheme = function (element) {\n if (this.element.classList.contains('e-bigger')) {\n element.classList.add('e-bigger');\n }\n };\n /**\n * @hidden\n * @returns {Object} Returns the previous row data\n */\n Grid.prototype.getPreviousRowData = function () {\n var previousRowData = this.getRowsObject()[this.getRows().length - 1].data;\n return previousRowData;\n };\n /**\n * Hides the scrollbar placeholder of Grid content when grid content is not overflown.\n *\n * @returns {void}\n */\n Grid.prototype.hideScroll = function () {\n var content = this.getContent().querySelector('.' + literals.content);\n if (content.scrollHeight <= content.clientHeight) {\n this.scrollModule.removePadding();\n content.style.overflowY = 'auto';\n }\n };\n /**\n * Get row index by primary key or row data.\n *\n * @param {string | Object} value - Defines the primary key value.\n *\n * @returns {number} Returns the index\n */\n Grid.prototype.getRowIndexByPrimaryKey = function (value) {\n var pkName = this.getPrimaryKeyFieldNames()[0];\n value = typeof value === 'object' ? value[\"\" + pkName] : value;\n var rows = this.getRowsObject();\n for (var i = 0; i < rows.length; i++) {\n if (rows[parseInt(i.toString(), 10)].isDetailRow || rows[parseInt(i.toString(), 10)].isCaptionRow) {\n continue;\n }\n var pKvalue = rows[parseInt(i.toString(), 10)].data[\"\" + pkName];\n if (pkName.split('.').length > 1) {\n pKvalue = performComplexDataOperation(pkName, rows[parseInt(i.toString(), 10)].data);\n }\n if (pKvalue === value) {\n return rows[parseInt(i.toString(), 10)].index;\n }\n }\n return -1;\n };\n /**\n * @param {string} field - Defines the field name\n * @param {boolean} isForeignKey - Defines the foreign key\n * @returns {Column} returns the column\n * @hidden\n */\n // Need to have all columns while filtering with ColumnVirtualization.\n Grid.prototype.grabColumnByFieldFromAllCols = function (field, isForeignKey) {\n var column;\n this.columnModel = [];\n this.updateColumnModel(this.columns);\n var gCols = this.columnModel;\n for (var i = 0; i < gCols.length; i++) {\n if ((!isForeignKey && field === gCols[parseInt(i.toString(), 10)].field) ||\n (isForeignKey && gCols[parseInt(i.toString(), 10)].isForeignColumn() &&\n field === gCols[parseInt(i.toString(), 10)].foreignKeyValue)) {\n column = gCols[parseInt(i.toString(), 10)];\n break;\n }\n }\n return column;\n };\n /**\n * @param {string} uid - Defines the uid\n * @returns {Column} returns the column\n * @hidden\n */\n // Need to have all columns while filtering with ColumnVirtualization.\n Grid.prototype.grabColumnByUidFromAllCols = function (uid) {\n var column;\n this.columnModel = [];\n this.updateColumnModel(this.columns);\n var gCols = this.columnModel;\n for (var i = 0; i < gCols.length; i++) {\n if (uid === gCols[parseInt(i.toString(), 10)].uid) {\n column = gCols[parseInt(i.toString(), 10)];\n }\n }\n return column;\n };\n /**\n * Get all filtered records from the Grid and it returns array of objects for the local dataSource, returns a promise object if the Grid has remote data.\n *\n * @returns {Object[] | Promise} Returns the filtered records\n */\n Grid.prototype.getFilteredRecords = function () {\n if ((this.allowFiltering && this.filterSettings.columns.length) || this.searchSettings.key.length) {\n var query = this.renderModule.data.generateQuery(true);\n if (this.dataSource && this.renderModule.data.isRemote() && this.dataSource instanceof DataManager) {\n return this.renderModule.data.getData(this.dataSource, query);\n }\n else {\n if (this.dataSource instanceof DataManager) {\n return this.dataSource.executeLocal(query);\n }\n else {\n return new DataManager(this.dataSource, query).executeLocal(query);\n }\n }\n }\n return [];\n };\n Grid.prototype.getUserAgent = function () {\n var userAgent = Browser.userAgent.toLowerCase();\n return /iphone|ipod|ipad|macintosh/.test(userAgent);\n };\n /**\n * @param {TouchEventArgs} e - Defines the TouchEventArgs\n * @returns {void}\n * @hidden\n */\n // Need to have all columns while filtering with ColumnVirtualization.\n // eslint-disable-next-line\n Grid.prototype.tapEvent = function (e) {\n if (this.getUserAgent()) {\n if (!Global.timer) {\n Global.timer = setTimeout(function () {\n Global.timer = null;\n }, 300);\n }\n else {\n clearTimeout(Global.timer);\n Global.timer = null;\n this.dblClickHandler(e);\n this.notify(events.doubleTap, e);\n }\n }\n };\n /**\n * @param {string} prefix - specifies the prefix\n * @returns {string} returns the row uid\n * @hidden\n */\n Grid.prototype.getRowUid = function (prefix) {\n return \"\" + prefix + this.rowUid++;\n };\n /**\n * @param {string} uid - specifies the uid\n * @returns {Element} returns the element\n * @hidden\n */\n Grid.prototype.getRowElementByUID = function (uid) {\n var rowEle;\n var rows = [];\n var cntRows = [].slice.call(this.getContent().querySelector(literals.tbody).children);\n if (this.frozenRows) {\n rows = [].slice.call(this.getHeaderContent().querySelector(literals.tbody).children);\n rows = rows.concat(cntRows);\n }\n else {\n rows = cntRows;\n }\n for (var _i = 0, rows_2 = rows; _i < rows_2.length; _i++) {\n var row = rows_2[_i];\n if (row.getAttribute('data-uid') === uid) {\n rowEle = row;\n break;\n }\n }\n return rowEle;\n };\n /**\n * Gets the hidden columns from the Grid.\n *\n * @returns {Column[]} Returns the Column\n */\n Grid.prototype.getHiddenColumns = function () {\n var cols = [];\n for (var _i = 0, _a = this.columnModel; _i < _a.length; _i++) {\n var col = _a[_i];\n if (col.visible === false) {\n cols.push(col);\n }\n }\n return cols;\n };\n /**\n * Calculates the page size by parent element height\n *\n * @param {number | string } containerHeight - specifies the container height\n * @returns {number} returns the page size\n */\n Grid.prototype.calculatePageSizeByParentHeight = function (containerHeight) {\n if (this.allowPaging) {\n if ((this.allowTextWrap && this.textWrapSettings.wrapMode === 'Header') || (!this.allowTextWrap)) {\n var pagesize = 0;\n if (containerHeight.indexOf('%') !== -1) {\n containerHeight = parseInt(containerHeight, 10) / 100 * this.element.clientHeight;\n }\n var nonContentHeight = this.getNoncontentHeight() + this.getRowHeight();\n if (containerHeight > nonContentHeight) {\n var contentHeight = 0;\n contentHeight = containerHeight - this.getNoncontentHeight();\n pagesize = (contentHeight / this.getRowHeight());\n }\n if (pagesize > 0) {\n return Math.floor(pagesize);\n }\n }\n }\n return 0;\n };\n Grid.prototype.getNoncontentHeight = function () {\n var height = 0;\n if (!isNullOrUndefined(this.getHeaderContent().clientHeight)) {\n height += this.getHeaderContent().clientHeight;\n }\n if (this.toolbar && !isNullOrUndefined(this.element.querySelector('.e-toolbar').clientHeight)) {\n height += this.element.querySelector('.e-toolbar').clientHeight;\n }\n if (this.allowPaging && !isNullOrUndefined(this.element.querySelector('.e-gridpager').clientHeight)) {\n height += this.element.querySelector('.e-gridpager').clientHeight;\n }\n if (this.showColumnChooser && !isNullOrUndefined(this.element.querySelector('.e-columnheader').clientHeight)) {\n height += this.element.querySelector('.e-columnheader').clientHeight;\n }\n if (this.allowGrouping && this.groupSettings.showDropArea && !isNullOrUndefined(this.element.querySelector('.e-groupdroparea').clientHeight)) {\n height += this.element.querySelector('.e-groupdroparea').clientHeight;\n }\n if (this.aggregates.length > 0 && !isNullOrUndefined(this.element.querySelector('.e-summaryrow').clientHeight)) {\n for (var i = 0; i < this.element.getElementsByClassName('e-summaryrow').length; i++) {\n height += this.element.getElementsByClassName('e-summaryrow')[parseInt(i.toString(), 10)].clientHeight;\n }\n }\n return height;\n };\n /**\n *To perform aggregate operation on a column.\n *\n * @param {AggregateColumnModel} summaryCol - Pass Aggregate Column details.\n * @param {Object} summaryData - Pass JSON Array for which its field values to be calculated.\n *\n * @returns {number} returns the summary values\n */\n Grid.prototype.getSummaryValues = function (summaryCol, summaryData) {\n return DataUtil.aggregates[summaryCol.type.toLowerCase()](summaryData, summaryCol.field);\n };\n /**\n * Sends a Post request to export Grid to Excel file in server side.\n *\n * @param {string} url - Pass Url for server side excel export action.\n *\n * @returns {void}\n */\n Grid.prototype.serverExcelExport = function (url) {\n this.isExcel = true;\n this.exportGrid(url);\n };\n /**\n * Sends a Post request to export Grid to Pdf file in server side.\n *\n * @param {string} url - Pass Url for server side pdf export action.\n *\n * @returns {void}\n */\n Grid.prototype.serverPdfExport = function (url) {\n this.isExcel = false;\n this.exportGrid(url);\n };\n /**\n * Sends a Post request to export Grid to CSV file in server side.\n *\n * @param {string} url - Pass Url for server side pdf export action.\n *\n * @returns {void}\n */\n Grid.prototype.serverCsvExport = function (url) {\n this.isExcel = true;\n this.exportGrid(url);\n };\n /**\n * @param {string} url - Defines exporting url\n * @returns {void}\n * @hidden\n */\n Grid.prototype.exportGrid = function (url) {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n var grid = this;\n var query = grid.getDataModule().generateQuery(true);\n var state = new UrlAdaptor().processQuery(new DataManager({ url: '' }), query);\n var queries = JSON.parse(state.data);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var gridModel = JSON.parse(this.addOnPersist(['allowGrouping', 'allowPaging', 'pageSettings', 'sortSettings', 'allowPdfExport', 'allowExcelExport', 'aggregates',\n 'filterSettings', 'groupSettings', 'columns', 'locale', 'searchSettings']));\n var include = ['field', 'headerText', 'type', 'format', 'visible', 'foreignKeyValue', 'foreignKeyField',\n 'template', 'index', 'width', 'textAlign', 'headerTextAlign', 'columns'];\n gridModel.filterSettings.columns = queries.where;\n gridModel.searchSettings.fields = queries.search && queries.search[0]['fields'] || [];\n gridModel.sortSettings.columns = queries.sorted;\n gridModel.columns = this.setHeaderText(gridModel.columns, include);\n var form = this.createElement('form', { id: 'ExportForm', styles: 'display:none;' });\n var gridInput = this.createElement('input', { id: 'gridInput', attrs: { name: 'gridModel' } });\n gridInput.value = JSON.stringify(gridModel);\n form.method = 'POST';\n form.action = url;\n form.appendChild(gridInput);\n document.body.appendChild(form);\n form.submit();\n form.remove();\n };\n /**\n * @param {Column[]} columns - Defines array of columns\n * @param {string[]} include - Defines array of sting\n * @returns {Column[]} returns array of columns\n * @hidden\n */\n Grid.prototype.setHeaderText = function (columns, include) {\n for (var i = 0; i < columns.length; i++) {\n var column = this.getColumnByUid(columns[parseInt(i.toString(), 10)].uid);\n columns[parseInt(i.toString(), 10)].headerText = column.headerText;\n if (!isNullOrUndefined(column.template)) {\n columns[parseInt(i.toString(), 10)].template = 'true';\n }\n if (columns[parseInt(i.toString(), 10)].format) {\n columns[parseInt(i.toString(), 10)].format = getNumberFormat(this.getFormat(columns[parseInt(i.toString(), 10)].format), columns[parseInt(i.toString(), 10)].type, this.isExcel, defaultCurrencyCode);\n }\n if (columns[parseInt(i.toString(), 10)].columns) {\n this.setHeaderText(columns[parseInt(i.toString(), 10)].columns, include);\n }\n var keys = Object.keys(columns[parseInt(i.toString(), 10)]);\n for (var j = 0; j < keys.length; j++) {\n if (include.indexOf(keys[parseInt(j.toString(), 10)]) < 0) {\n delete columns[parseInt(i.toString(), 10)][keys[parseInt(j.toString(), 10)]];\n }\n }\n }\n return columns;\n };\n Grid.prototype.getFormat = function (format) {\n return typeof (format) === 'object' ? !isNullOrUndefined(format.format) ?\n format.format : format.skeleton : format;\n };\n /**\n * @hidden\n * @returns {boolean} returns the isCollapseStateEnabled\n */\n Grid.prototype.isCollapseStateEnabled = function () {\n var isExpanded = 'isExpanded';\n return this[\"\" + isExpanded] === false;\n };\n /**\n * @param {number} key - Defines the primary key value.\n * @param {Object} rowData - Defines the rowData\n * @returns {void}\n */\n Grid.prototype.updateRowValue = function (key, rowData) {\n var args = {\n requestType: 'save', data: rowData\n };\n this.showSpinner();\n this.notify(events.updateData, args);\n this.refresh();\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.setForeignKeyData = function () {\n this.dataBind();\n var colpending = this.getDataModule().getForeignKeyDataState();\n if (colpending.isPending) {\n this.getDataModule().setForeignKeyDataState({});\n colpending.resolver();\n }\n else {\n this.getDataModule().setForeignKeyDataState({ isDataChanged: false });\n if (this.contentModule || this.headerModule) {\n this.renderModule.render();\n }\n }\n };\n /**\n * @param {string} field - specifies the field\n * @returns {void}\n * @hidden\n */\n Grid.prototype.resetFilterDlgPosition = function (field) {\n var header = this.getColumnHeaderByField(field);\n if (header) {\n var target = header.querySelector('.e-filtermenudiv');\n var filterDlg = this.element.querySelector('.e-filter-popup');\n if (target && filterDlg) {\n var gClient = this.element.getBoundingClientRect();\n var fClient = target.getBoundingClientRect();\n if (filterDlg) {\n if ((filterDlg.offsetWidth + fClient.right) > gClient.right) {\n filterDlg.style.left = ((fClient.right - filterDlg.offsetWidth) - gClient.left).toString() + 'px';\n }\n else {\n filterDlg.style.left = (fClient.right - gClient.left).toString() + 'px';\n }\n }\n }\n }\n };\n /**\n * @param {any} callBack - specifies the callBack method\n * @returns {void}\n * @hidden\n */\n // eslint-disable-next-line\n Grid.prototype.renderTemplates = function (callBack) {\n var isReactChild = this.parentDetails && this.parentDetails.parentInstObj && this.parentDetails.parentInstObj.isReact;\n if (isReactChild && this['portals']) {\n this.parentDetails.parentInstObj['portals'] = this.parentDetails.parentInstObj['portals']\n .concat(this['portals']);\n this.parentDetails.parentInstObj.renderTemplates(callBack);\n this['portals'] = undefined;\n }\n else {\n var portals = 'portals';\n this.notify('reactTemplateRender', this[\"\" + portals]);\n this.renderReactTemplates(callBack);\n }\n };\n /**\n * Apply the changes to the Grid without refreshing the rows.\n *\n * @param {BatchChanges} changes - Defines changes to be updated.\n * @returns {void}\n */\n Grid.prototype.batchUpdate = function (changes) {\n this.processRowChanges(changes);\n };\n /**\n * Apply the changes to the Grid in one batch after 50ms without refreshing the rows.\n *\n * @param {BatchChanges} changes - Defines changes to be updated.\n * @returns {void}\n */\n Grid.prototype.batchAsyncUpdate = function (changes) {\n this.processBulkRowChanges(changes);\n };\n Grid.prototype.processBulkRowChanges = function (changes) {\n var _this_1 = this;\n if (!this.dataToBeUpdated) {\n this.dataToBeUpdated = Object.assign({ addedRecords: [], changedRecords: [], deletedRecords: [] }, changes);\n setTimeout(function () {\n _this_1.processRowChanges(_this_1.dataToBeUpdated);\n _this_1.dataToBeUpdated = null;\n }, this.asyncTimeOut);\n }\n else {\n var loopstring = [literals.addedRecords, literals.changedRecords, literals.deletedRecords];\n var keyField = this.getPrimaryKeyFieldNames()[0];\n for (var i = 0; i < loopstring.length; i++) {\n if (changes[loopstring[parseInt(i.toString(), 10)]]) {\n compareChanges(this, changes, loopstring[parseInt(i.toString(), 10)], keyField);\n }\n }\n }\n };\n Grid.prototype.processRowChanges = function (changes) {\n var _this_1 = this;\n var keyField = this.getPrimaryKeyFieldNames()[0];\n changes = Object.assign({ addedRecords: [], changedRecords: [], deletedRecords: [] }, changes);\n var promise = this.getDataModule().saveChanges(changes, keyField, {}, this.getDataModule().generateQuery().requiresCount());\n if (this.getDataModule().isRemote()) {\n promise.then(function () {\n _this_1.setNewData();\n });\n }\n else {\n this.setNewData();\n }\n };\n Grid.prototype.setNewData = function () {\n var _this_1 = this;\n var oldValues = JSON.parse(JSON.stringify(this.getCurrentViewRecords()));\n var getData = this.getDataModule().getData({}, this.getDataModule().generateQuery().requiresCount());\n getData.then(function (e) {\n _this_1.bulkRefresh(e.result, oldValues, e.count);\n });\n };\n Grid.prototype.deleteRowElement = function (row) {\n var tr = this.getRowElementByUID(row.uid);\n remove(tr);\n };\n Grid.prototype.bulkRefresh = function (result, oldValues, count) {\n var _this_1 = this;\n var rowObj = this.getRowsObject();\n var keyField = this.getPrimaryKeyFieldNames()[0];\n var _loop_5 = function (i) {\n if (!result.filter(function (e) { return e[\"\" + keyField] === rowObj[parseInt(i.toString(), 10)].data[\"\" + keyField]; }).length) {\n this_5.deleteRowElement(rowObj[parseInt(i.toString(), 10)]);\n rowObj.splice(i, 1);\n i--;\n }\n out_i_1 = i;\n };\n var this_5 = this, out_i_1;\n for (var i = 0; i < rowObj.length; i++) {\n _loop_5(i);\n i = out_i_1;\n }\n var _loop_6 = function (i) {\n var isRowExist;\n oldValues.filter(function (e) {\n if (e[\"\" + keyField] === result[parseInt(i.toString(), 10)][\"\" + keyField]) {\n if (e !== result[parseInt(i.toString(), 10)]) {\n _this_1.setRowData(result[parseInt(i.toString(), 10)][\"\" + keyField], result[parseInt(i.toString(), 10)]);\n }\n isRowExist = true;\n }\n });\n if (!isRowExist) {\n this_6.renderRowElement(result[parseInt(i.toString(), 10)], i);\n }\n };\n var this_6 = this;\n for (var i = 0; i < result.length; i++) {\n _loop_6(i);\n }\n this.currentViewData = result;\n var rows = [].slice.call(this.getContentTable().getElementsByClassName(literals.row));\n resetRowIndex(this, this.getRowsObject(), rows);\n setRowElements(this);\n if (this.allowPaging) {\n this.notify(events.inBoundModelChanged, { module: 'pager', properties: { totalRecordsCount: count } });\n }\n };\n Grid.prototype.renderRowElement = function (data, index) {\n var row = new RowRenderer(this.serviceLocator, null, this);\n var model = new RowModelGenerator(this);\n var modelData = model.generateRows([data]);\n var tr = row.render(modelData[0], this.getColumns());\n this.addRowObject(modelData[0], index);\n var tbody = this.getContentTable().querySelector(literals.tbody);\n if (tbody.querySelector('.e-emptyrow')) {\n var emptyRow = tbody.querySelector('.e-emptyrow');\n emptyRow.parentNode.removeChild(emptyRow);\n if (this.frozenRows && this.element.querySelector('.e-frozenrow-empty')) {\n this.element.querySelector('.e-frozenrow-empty').classList.remove('e-frozenrow-empty');\n }\n }\n if (this.frozenRows && index < this.frozenRows) {\n tbody = this.getHeaderContent().querySelector(literals.tbody);\n }\n else {\n tbody = this.getContent().querySelector(literals.tbody);\n }\n tbody = this.getContent().querySelector(literals.tbody);\n tbody.appendChild(tr);\n };\n Grid.prototype.addRowObject = function (row, index) {\n this.getRowsObject().splice(index, 1, row);\n };\n /**\n * @hidden\n * @returns {void}\n */\n Grid.prototype.updateVisibleExpandCollapseRows = function () {\n var rows = this.getRowsObject();\n for (var i = 0, len = rows.length; i < len; i++) {\n if ((rows[parseInt(i.toString(), 10)].isDataRow || rows[parseInt(i.toString(), 10)].isAggregateRow)\n && this.getRowElementByUID(rows[parseInt(i.toString(), 10)].uid).style.display === 'none') {\n rows[parseInt(i.toString(), 10)].visible = false;\n }\n else {\n rows[parseInt(i.toString(), 10)].visible = true;\n }\n }\n };\n /**\n * Method to sanitize any suspected untrusted strings and scripts before rendering them.\n *\n * @param {string} value - Specifies the html value to sanitize\n * @returns {string} Returns the sanitized html string\n * @hidden\n */\n Grid.prototype.sanitize = function (value) {\n if (this.enableHtmlSanitizer) {\n return SanitizeHtmlHelper.sanitize(value);\n }\n return value;\n };\n /**\n * @param {string | number} height - specifies the height\n * @returns {number | string} - specifies the height number\n * @hidden\n */\n Grid.prototype.getHeight = function (height) {\n if (!Number.isInteger(height) && height.indexOf('%') !== -1) {\n height = parseInt(height, 10) / 100 * this.element.clientHeight;\n }\n else if (!Number.isInteger(height) && this.height !== 'auto') {\n height = parseInt(height, 10);\n }\n else {\n height = this.height;\n }\n return height;\n };\n /**\n * @hidden\n * @returns {Element} - returns frozen right content\n\n */\n Grid.prototype.getFrozenRightContent = function () {\n return this.contentModule.getPanel();\n };\n /**\n * @hidden\n * @returns {Element} - returns frozen right header\n\n */\n Grid.prototype.getFrozenRightHeader = function () {\n return this.headerModule.getPanel();\n };\n /**\n * @hidden\n * @returns {Element} - returns movable header tbody\n\n */\n Grid.prototype.getMovableHeaderTbody = function () {\n return this.getHeaderContent().querySelector(literals.tbody);\n };\n /**\n * @hidden\n * @returns {Element} - returns movable content tbody\n\n */\n Grid.prototype.getMovableContentTbody = function () {\n return this.getContent().querySelector(literals.tbody);\n };\n /**\n * @hidden\n * @returns {Element} - returns frozen header tbody\n\n */\n Grid.prototype.getFrozenHeaderTbody = function () {\n return this.getHeaderContent().querySelector(literals.tbody);\n };\n /**\n * @hidden\n * @returns {Element} - returns frozen left content tbody\n\n */\n Grid.prototype.getFrozenLeftContentTbody = function () {\n return this.getContent().querySelector(literals.tbody);\n };\n /**\n * @hidden\n * @returns {Element} - returns frozen right header tbody\n\n */\n Grid.prototype.getFrozenRightHeaderTbody = function () {\n return this.getHeaderContent().querySelector(literals.tbody);\n };\n /**\n * @returns {Element} returns frozen right content tbody\n\n * @hidden\n */\n Grid.prototype.getFrozenRightContentTbody = function () {\n return this.getContent().querySelector(literals.tbody);\n };\n /**\n * @param {boolean} isCustom - Defines custom filter dialog open\n * @returns {void}\n * @hidden\n */\n Grid.prototype.showResponsiveCustomFilter = function (isCustom) {\n if (this.filterModule) {\n this.filterModule.showCustomFilter(isCustom || this.rowRenderingMode === 'Vertical');\n }\n };\n /**\n * @param {boolean} isCustom - Defines custom sort dialog open\n * @returns {void}\n * @hidden\n */\n Grid.prototype.showResponsiveCustomSort = function (isCustom) {\n if (this.sortModule) {\n this.sortModule.showCustomSort(isCustom || this.rowRenderingMode === 'Vertical');\n }\n };\n /**\n * @param {boolean} isCustom - Defines custom column chooser dialog open\n * @returns {void}\n * @hidden\n */\n Grid.prototype.showResponsiveCustomColumnChooser = function (isCustom) {\n if (this.columnChooserModule) {\n this.columnChooserModule.showCustomColumnChooser(isCustom || this.rowRenderingMode === 'Vertical');\n }\n };\n /**\n * To manually show the vertical row mode filter dialog\n *\n * @returns {void}\n */\n Grid.prototype.showAdaptiveFilterDialog = function () {\n if (this.enableAdaptiveUI) {\n this.showResponsiveCustomFilter(true);\n }\n };\n /**\n * To manually show the vertical row sort filter dialog\n *\n * @returns {void}\n */\n Grid.prototype.showAdaptiveSortDialog = function () {\n if (this.enableAdaptiveUI) {\n this.showResponsiveCustomSort(true);\n }\n };\n /**\n * @param {boolean} isColVirtualization - Defines column virtualization\n * @returns {Column[]} returns array of column models\n * @hidden\n */\n Grid.prototype.getCurrentVisibleColumns = function (isColVirtualization) {\n var cols = [];\n var gridCols = isColVirtualization ? this.getColumns() : this.columnModel;\n for (var _i = 0, gridCols_1 = gridCols; _i < gridCols_1.length; _i++) {\n var col = gridCols_1[_i];\n if (col.visible) {\n cols.push(col);\n }\n }\n return cols;\n };\n Grid.prototype.enableInfiniteAggrgate = function () {\n if (this.enableInfiniteScrolling && this.groupSettings.columns.length && !this.groupSettings.disablePageWiseAggregates\n && !this.groupSettings.enableLazyLoading) {\n this.setProperties({ groupSettings: { disablePageWiseAggregates: true } }, true);\n }\n };\n var Grid_1;\n __decorate([\n Property([])\n ], Grid.prototype, \"currentViewData\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"parentDetails\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"showHider\", void 0);\n __decorate([\n Property([])\n ], Grid.prototype, \"columns\", void 0);\n __decorate([\n Property(true)\n ], Grid.prototype, \"enableAltRow\", void 0);\n __decorate([\n Property(true)\n ], Grid.prototype, \"enableHover\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableAutoFill\", void 0);\n __decorate([\n Property(true)\n ], Grid.prototype, \"allowKeyboard\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableStickyHeader\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableHtmlSanitizer\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowTextWrap\", void 0);\n __decorate([\n Complex({}, TextWrapSettings)\n ], Grid.prototype, \"textWrapSettings\", void 0);\n __decorate([\n Complex({}, ResizeSettings)\n ], Grid.prototype, \"resizeSettings\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowPaging\", void 0);\n __decorate([\n Complex({}, PageSettings)\n ], Grid.prototype, \"pageSettings\", void 0);\n __decorate([\n Complex({}, LoadingIndicator)\n ], Grid.prototype, \"loadingIndicator\", void 0);\n __decorate([\n Property(true)\n ], Grid.prototype, \"enableVirtualMaskRow\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableVirtualization\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableColumnVirtualization\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableInfiniteScrolling\", void 0);\n __decorate([\n Complex({}, SearchSettings)\n ], Grid.prototype, \"searchSettings\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowSorting\", void 0);\n __decorate([\n Property('Ellipsis')\n ], Grid.prototype, \"clipMode\", void 0);\n __decorate([\n Property(true)\n ], Grid.prototype, \"allowMultiSorting\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowExcelExport\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowPdfExport\", void 0);\n __decorate([\n Complex({}, SortSettings)\n ], Grid.prototype, \"sortSettings\", void 0);\n __decorate([\n Complex({}, InfiniteScrollSettings)\n ], Grid.prototype, \"infiniteScrollSettings\", void 0);\n __decorate([\n Property(true)\n ], Grid.prototype, \"allowSelection\", void 0);\n __decorate([\n Property(-1)\n ], Grid.prototype, \"selectedRowIndex\", void 0);\n __decorate([\n Complex({}, SelectionSettings)\n ], Grid.prototype, \"selectionSettings\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowFiltering\", void 0);\n __decorate([\n Property('Horizontal')\n ], Grid.prototype, \"rowRenderingMode\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableAdaptiveUI\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowReordering\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowResizing\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowRowDragAndDrop\", void 0);\n __decorate([\n Complex({}, RowDropSettings)\n ], Grid.prototype, \"rowDropSettings\", void 0);\n __decorate([\n Complex({}, FilterSettings)\n ], Grid.prototype, \"filterSettings\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"allowGrouping\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableImmutableMode\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"showColumnMenu\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"autoFit\", void 0);\n __decorate([\n Complex({}, GroupSettings)\n ], Grid.prototype, \"groupSettings\", void 0);\n __decorate([\n Complex({}, EditSettings)\n ], Grid.prototype, \"editSettings\", void 0);\n __decorate([\n Collection([], AggregateRow)\n ], Grid.prototype, \"aggregates\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"showColumnChooser\", void 0);\n __decorate([\n Complex({}, ColumnChooserSettings)\n ], Grid.prototype, \"columnChooserSettings\", void 0);\n __decorate([\n Property(false)\n ], Grid.prototype, \"enableHeaderFocus\", void 0);\n __decorate([\n Property('auto')\n ], Grid.prototype, \"height\", void 0);\n __decorate([\n Property('auto')\n ], Grid.prototype, \"width\", void 0);\n __decorate([\n Property('Default')\n ], Grid.prototype, \"gridLines\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"rowTemplate\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"emptyRecordTemplate\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"detailTemplate\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"childGrid\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"queryString\", void 0);\n __decorate([\n Property('AllPages')\n ], Grid.prototype, \"printMode\", void 0);\n __decorate([\n Property('Expanded')\n ], Grid.prototype, \"hierarchyPrintMode\", void 0);\n __decorate([\n Property([])\n ], Grid.prototype, \"dataSource\", void 0);\n __decorate([\n Property(null)\n ], Grid.prototype, \"rowHeight\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"query\", void 0);\n __decorate([\n Property('USD')\n ], Grid.prototype, \"currencyCode\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"exportGrids\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"toolbar\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"contextMenuItems\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"columnMenuItems\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"toolbarTemplate\", void 0);\n __decorate([\n Property()\n ], Grid.prototype, \"pagerTemplate\", void 0);\n __decorate([\n Property(0)\n ], Grid.prototype, \"frozenRows\", void 0);\n __decorate([\n Property(0)\n ], Grid.prototype, \"frozenColumns\", void 0);\n __decorate([\n Property('')\n ], Grid.prototype, \"cssClass\", void 0);\n __decorate([\n Property('All')\n ], Grid.prototype, \"columnQueryMode\", void 0);\n __decorate([\n Property({})\n ], Grid.prototype, \"currentAction\", void 0);\n __decorate([\n Property('')\n ], Grid.prototype, \"ej2StatePersistenceVersion\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"load\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowDataBound\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"queryCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"headerCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"actionBegin\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"actionComplete\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"actionFailure\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"dataBound\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"recordDoubleClick\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"recordClick\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowSelecting\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowSelected\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowDeselecting\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowDeselected\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"cellSelecting\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"cellSelected\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"cellDeselecting\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"cellDeselected\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnSelecting\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnSelected\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnDeselecting\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnDeselected\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnDragStart\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnDrag\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnDrop\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"printComplete\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforePrint\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"pdfQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"pdfHeaderQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"pdfAggregateQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"excelAggregateQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"exportDetailDataBound\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"exportDetailTemplate\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"excelQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"excelHeaderQueryCellInfo\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeExcelExport\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"excelExportComplete\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforePdfExport\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"pdfExportComplete\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowDragStartHelper\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"detailDataBound\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowDragStart\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowDrag\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"rowDrop\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"toolbarClick\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeOpenColumnChooser\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeOpenAdaptiveDialog\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"batchAdd\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"batchDelete\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"batchCancel\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeBatchAdd\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeBatchDelete\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeBatchSave\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beginEdit\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"commandClick\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"cellEdit\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"cellSave\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"cellSaved\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"resizeStart\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"resizing\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"resizeStop\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"keyPressed\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeDataBound\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"contextMenuOpen\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"contextMenuClick\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnMenuOpen\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnMenuClick\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"checkBoxChange\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeCopy\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforePaste\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"beforeAutoFill\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"columnDataStateChange\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"dataStateChange\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"dataSourceChanged\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"exportGroupCaption\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"lazyLoadGroupExpand\", void 0);\n __decorate([\n Event()\n ], Grid.prototype, \"lazyLoadGroupCollapse\", void 0);\n Grid = Grid_1 = __decorate([\n NotifyPropertyChanges\n ], Grid);\n return Grid;\n}(Component));\nexport { Grid };\n","import { print as printWindow, createElement, detach, classList, selectAll, extend } from '@syncfusion/ej2-base';\nimport { getPrintGridModel } from '../base/util';\nimport { Grid } from '../base/grid';\nimport * as events from '../base/constant';\nimport { Deferred } from '@syncfusion/ej2-data';\nimport * as literals from '../base/string-literals';\n/**\n * @returns {string[]} returns the cloned property\n * @hidden\n */\nexport function getCloneProperties() {\n return ['aggregates', 'allowGrouping', 'allowFiltering', 'allowMultiSorting', 'allowReordering', 'allowSorting',\n 'allowTextWrap', 'childGrid', 'columns', 'currentViewData', 'dataSource', 'detailTemplate', 'enableAltRow',\n 'enableColumnVirtualization', 'filterSettings', 'gridLines',\n 'groupSettings', 'height', 'locale', 'pageSettings', 'printMode', 'query', 'queryString', 'enableRtl',\n 'rowHeight', 'rowTemplate', 'sortSettings', 'textWrapSettings', 'allowPaging', 'hierarchyPrintMode', 'searchSettings',\n 'queryCellInfo', 'beforeDataBound'];\n}\n/**\n *\n * The `Print` module is used to handle print action.\n */\nvar Print = /** @class */ (function () {\n /**\n * Constructor for the Grid print module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {Scroll} scrollModule - specifies the scroll module\n * @hidden\n */\n function Print(parent, scrollModule) {\n this.isAsyncPrint = false;\n this.defered = new Deferred();\n this.parent = parent;\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.contentReady, this.isContentReady(), this);\n this.actionBeginFunction = this.actionBegin.bind(this);\n this.parent.addEventListener(events.actionBegin, this.actionBeginFunction);\n this.parent.on(events.onEmpty, this.onEmpty.bind(this));\n this.parent.on(events.hierarchyPrint, this.hierarchyPrint, this);\n this.scrollModule = scrollModule;\n }\n Print.prototype.isContentReady = function () {\n var _this = this;\n if (this.isPrintGrid() && (this.parent.hierarchyPrintMode === 'None' || !this.parent.childGrid)) {\n return this.contentReady;\n }\n return function () {\n _this.defered.promise.then(function () {\n _this.contentReady();\n });\n if (_this.isPrintGrid()) {\n _this.hierarchyPrint();\n }\n };\n };\n Print.prototype.hierarchyPrint = function () {\n this.removeColGroup(this.parent);\n var printGridObj = window.printGridObj;\n if (printGridObj && !printGridObj.element.querySelector('[aria-busy=true')) {\n printGridObj.printModule.defered.resolve();\n }\n };\n /**\n * By default, prints all the Grid pages and hides the pager.\n * > You can customize print options using the\n * [`printMode`](./printmode/).\n *\n * @returns {void}\n */\n Print.prototype.print = function () {\n this.renderPrintGrid();\n };\n Print.prototype.onEmpty = function () {\n if (this.isPrintGrid()) {\n this.contentReady();\n }\n };\n Print.prototype.actionBegin = function () {\n if (this.isPrintGrid()) {\n this.isAsyncPrint = true;\n }\n };\n Print.prototype.renderPrintGrid = function () {\n var gObj = this.parent;\n var element = createElement('div', {\n id: this.parent.element.id + '_print', className: gObj.element.className + ' e-print-grid'\n });\n element.classList.remove('e-gridhover');\n document.body.appendChild(element);\n var printGrid = new Grid(getPrintGridModel(gObj, gObj.hierarchyPrintMode));\n for (var i = 0; i < printGrid.columns.length; i++) {\n printGrid.columns[parseInt(i.toString(), 10)] = extend({}, printGrid.columns[parseInt(i.toString(), 10)]);\n if (gObj.isFrozenGrid() && !gObj.getFrozenColumns()) {\n printGrid.columns[parseInt(i.toString(), 10)].freeze = undefined;\n }\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.parent.isAngular) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n printGrid.viewContainerRef = this.parent.viewContainerRef;\n }\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n printGrid.load = function () { };\n printGrid.query = gObj.getQuery().clone();\n window.printGridObj = printGrid;\n printGrid.isPrinting = true;\n var modules = printGrid.getInjectedModules();\n var injectedModues = gObj.getInjectedModules();\n if (!modules || modules.length !== injectedModues.length) {\n printGrid.setInjectedModules(injectedModues);\n }\n gObj.notify(events.printGridInit, { element: element, printgrid: printGrid });\n this.parent.log('exporting_begin', this.getModuleName());\n printGrid.registeredTemplate = this.parent.registeredTemplate;\n printGrid.isVue = this.parent.isVue;\n printGrid.appendTo(element);\n if (!gObj.isVue3) {\n printGrid.trigger = gObj.trigger;\n }\n };\n Print.prototype.contentReady = function () {\n if (this.isPrintGrid()) {\n var gObj = this.parent;\n if (this.isAsyncPrint) {\n this.printGrid();\n return;\n }\n var args = {\n requestType: 'print',\n element: gObj.element,\n selectedRows: gObj.getContentTable().querySelectorAll('tr[aria-selected=\"true\"]'),\n cancel: false,\n hierarchyPrintMode: gObj.hierarchyPrintMode\n };\n if (!this.isAsyncPrint) {\n gObj.trigger(events.beforePrint, args);\n }\n if (args.cancel) {\n detach(gObj.element);\n return;\n }\n if (!this.isAsyncPrint) {\n this.printGrid();\n }\n }\n };\n Print.prototype.printGrid = function () {\n var gObj = this.parent;\n // Height adjustment on print grid\n if (gObj.height !== 'auto') { // if scroller enabled\n var cssProps = this.scrollModule.getCssProperties();\n var contentDiv = gObj.element.querySelector('.' + literals.content);\n var headerDiv = gObj.element.querySelector('.' + literals.gridHeader);\n contentDiv.style.height = 'auto';\n contentDiv.style.overflowY = 'auto';\n headerDiv.style[cssProps.padding] = '';\n headerDiv.firstElementChild.style[cssProps.border] = '';\n }\n // Grid alignment adjustment on grouping\n if (gObj.allowGrouping) {\n if (!gObj.groupSettings.columns.length) {\n gObj.element.querySelector('.e-groupdroparea').style.display = 'none';\n }\n else {\n this.removeColGroup(gObj);\n }\n }\n // hide horizontal scroll\n for (var _i = 0, _a = [].slice.call(gObj.element.getElementsByClassName(literals.content)); _i < _a.length; _i++) {\n var element = _a[_i];\n element.style.overflowX = 'hidden';\n }\n // Hide the waiting popup\n var waitingPop = [].slice.call(gObj.element.getElementsByClassName('e-spin-show'));\n for (var _b = 0, _c = [].slice.call(waitingPop); _b < _c.length; _b++) {\n var element = _c[_b];\n classList(element, ['e-spin-hide'], ['e-spin-show']);\n }\n this.printGridElement(gObj);\n gObj.isPrinting = false;\n delete window.printGridObj;\n var args = {\n element: gObj.element\n };\n gObj.trigger(events.printComplete, args);\n gObj.destroy();\n this.parent.log('exporting_complete', this.getModuleName());\n };\n Print.prototype.printGridElement = function (gObj) {\n classList(gObj.element, ['e-print-grid-layout'], ['e-print-grid']);\n if (gObj.isPrinting) {\n detach(gObj.element);\n }\n this.printWind = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');\n this.printWind.moveTo(0, 0);\n this.printWind.resizeTo(screen.availWidth, screen.availHeight);\n this.printWind = printWindow(gObj.element, this.printWind);\n };\n Print.prototype.removeColGroup = function (gObj) {\n var depth = gObj.groupSettings.columns.length;\n var element = gObj.element;\n var id = '#' + gObj.element.id;\n if (!depth) {\n return;\n }\n var groupCaption = selectAll('.e-groupcaption', element);\n var colSpan = groupCaption[depth - 1].getAttribute('colspan');\n for (var i = 0; i < groupCaption.length; i++) {\n groupCaption[parseInt(i.toString(), 10)].setAttribute('colspan', colSpan);\n }\n var colGroups = selectAll(\"colgroup\" + id + \"colgroup\", element);\n var contentColGroups = selectAll('.e-content colgroup', element);\n var footerColGroups = selectAll('.e-summarycontent colgroup', element);\n this.hideColGroup(colGroups, depth);\n this.hideColGroup(contentColGroups, depth);\n this.hideColGroup(footerColGroups, depth);\n };\n Print.prototype.hideColGroup = function (colGroups, depth) {\n for (var i = 0; i < colGroups.length; i++) {\n for (var j = 0; j < depth; j++) {\n colGroups[parseInt(i.toString(), 10)].children[parseInt(j.toString(), 10)].style.display = 'none';\n }\n }\n };\n /**\n * To destroy the print\n *\n * @returns {boolean} returns the isPrintGrid or not\n * @hidden\n */\n Print.prototype.isPrintGrid = function () {\n return this.parent.element.id.indexOf('_print') > 0 && this.parent.isPrinting;\n };\n /**\n * To destroy the print\n *\n * @returns {void}\n * @hidden\n */\n Print.prototype.destroy = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.contentReady, this.contentReady.bind(this));\n this.parent.removeEventListener(events.actionBegin, this.actionBeginFunction);\n this.parent.off(events.onEmpty, this.onEmpty.bind(this));\n this.parent.off(events.hierarchyPrint, this.hierarchyPrint);\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n Print.prototype.getModuleName = function () {\n return 'print';\n };\n Print.printGridProp = getCloneProperties().concat([events.beforePrint, events.printComplete, events.load]);\n return Print;\n}());\nexport { Print };\n","import { ChildProperty, compile as baseTemplateComplier, setValue, Internationalization, isUndefined } from '@syncfusion/ej2-base';\nimport { extend as baseExtend, isNullOrUndefined, getValue, classList } from '@syncfusion/ej2-base';\nimport { setStyleAttribute, addClass, attributes, remove, createElement, removeClass } from '@syncfusion/ej2-base';\nimport { isObject, select, selectAll } from '@syncfusion/ej2-base';\nimport { DataUtil, Query, DataManager, Predicate, UrlAdaptor, Deferred } from '@syncfusion/ej2-data';\nimport { Column } from '../models/column';\nimport { calculateRelativeBasedPosition } from '@syncfusion/ej2-popups';\nimport { Print } from '../actions/print';\nimport { CheckBoxFilterBase } from '../common/checkbox-filter-base';\nimport * as literals from '../base/string-literals';\n//https://typescript.codeplex.com/discussions/401501\n/**\n * Function to check whether target object implement specific interface\n *\n * @param {Object} target - specifies the target\n * @param {string} checkFor - specifies the checkfors\n * @returns {boolean} returns the boolean\n * @hidden\n */\nexport function doesImplementInterface(target, checkFor) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return target.prototype && checkFor in target.prototype;\n}\n/**\n * Function to get value from provided data\n *\n * @param {string} field - specifies the field\n * @param {Object} data - specifies the data\n * @param {ColumnModel} column - specifies the column\n * @returns {Object} returns the object\n * @hidden\n */\n// eslint-disable-next-line\nexport function valueAccessor(field, data, column) {\n return (isNullOrUndefined(field) || field === '') ? '' : DataUtil.getObject(field, data);\n}\n/**\n * Defines the method used to apply custom header cell values from external function and display this on each header cell rendered.\n *\n * @param {string} field - specifies the field\n * @param {ColumnModel} column - specifies the column\n * @returns {object} headerValueAccessor\n * @hidden\n */\nexport function headerValueAccessor(field, column) {\n return (isNullOrUndefined(field) || field === '') ? '' : DataUtil.getObject(field, column);\n}\n/**\n * The function used to update Dom using requestAnimationFrame.\n *\n * @param {Function} updateFunction - Function that contains the actual action\n * @param {object} callBack - defines the callback\n * @returns {void}\n * @hidden\n */\n// eslint-disable-next-line\nexport function getUpdateUsingRaf(updateFunction, callBack) {\n requestAnimationFrame(function () {\n try {\n callBack(null, updateFunction());\n }\n catch (e) {\n callBack(e);\n }\n });\n}\n/**\n * @hidden\n * @param {PdfExportProperties | ExcelExportProperties} exportProperties - Defines the export properties\n * @returns {boolean} Returns isExportColumns\n */\nexport function isExportColumns(exportProperties) {\n return !isNullOrUndefined(exportProperties) &&\n !isNullOrUndefined(exportProperties.columns) && exportProperties.columns.length > 0;\n}\n/**\n * @param {PdfExportProperties | ExcelExportProperties} exportProperties - Defines the export properties\n * @param {IGrid} gObj - Defines the grid object\n * @returns {void}\n * @hidden\n */\nexport function updateColumnTypeForExportColumns(exportProperties, gObj) {\n var exportColumns = exportProperties.columns;\n var gridColumns = gObj.columns;\n for (var i = 0; i < exportColumns.length; i++) {\n if (gridColumns.length - 1 >= i) {\n if (gridColumns[parseInt(i.toString(), 10)].columns) {\n for (var j = 0; j < gridColumns[parseInt(i.toString(), 10)].columns.length; j++) {\n exportColumns[parseInt(i.toString(), 10)].columns[parseInt(j.toString(), 10)]\n .type = gridColumns[parseInt(i.toString(), 10)].columns[parseInt(j.toString(), 10)].type;\n }\n }\n else {\n exportColumns[parseInt(i.toString(), 10)].type = gridColumns[parseInt(i.toString(), 10)].type;\n }\n }\n }\n}\n/**\n * @hidden\n * @param {IGrid} grid - Defines the grid\n * @returns {void}\n */\nexport function updatecloneRow(grid) {\n var nRows = [];\n var actualRows = grid.vRows;\n for (var i = 0; i < actualRows.length; i++) {\n if (actualRows[parseInt(i.toString(), 10)].isDataRow) {\n nRows.push(actualRows[parseInt(i.toString(), 10)]);\n }\n else if (!actualRows[parseInt(i.toString(), 10)].isDataRow) {\n nRows.push(actualRows[parseInt(i.toString(), 10)]);\n if (!actualRows[parseInt(i.toString(), 10)].isExpand && actualRows[parseInt(i.toString(), 10)].isCaptionRow) {\n i += getCollapsedRowsCount(actualRows[parseInt(i.toString(), 10)], grid);\n }\n }\n }\n grid.vcRows = nRows;\n}\nvar count = 0;\n/**\n * @hidden\n * @param {Row} val - Defines the value\n * @param {IGrid} grid - Defines the grid\n * @returns {number} Returns the collapsed row count\n */\nexport function getCollapsedRowsCount(val, grid) {\n count = 0;\n var gSummary = 'gSummary';\n var total = 'count';\n var gLen = grid.groupSettings.columns.length;\n var records = 'records';\n var items = 'items';\n var value = val[\"\" + gSummary];\n var dataRowCnt = 0;\n var agrCnt = 'aggregatesCount';\n if (value === val.data[\"\" + total]) {\n if (grid.groupSettings.columns.length && !isNullOrUndefined(val[\"\" + agrCnt]) && val[\"\" + agrCnt]) {\n if (grid.groupSettings.columns.length !== 1) {\n count += (val.indent !== 0 && (value) < 2) ? (val[\"\" + gSummary] * ((gLen - val.indent) + (gLen - val.indent) * val[\"\" + agrCnt])) :\n (val[\"\" + gSummary] * ((gLen - val.indent) + (gLen - val.indent - 1) * val[\"\" + agrCnt])) + val[\"\" + agrCnt];\n }\n else if (grid.groupSettings.columns.length === 1) {\n count += (val[\"\" + gSummary] * (gLen - val.indent)) + val[\"\" + agrCnt];\n }\n }\n else if (grid.groupSettings.columns.length) {\n if (grid.groupSettings.columns.length !== 1) {\n count += val[\"\" + gSummary] * (grid.groupSettings.columns.length - val.indent);\n }\n else {\n count += val[\"\" + gSummary];\n }\n }\n return count;\n }\n else {\n for (var i = 0, len = val.data[\"\" + items].length; i < len; i++) {\n var gLevel = val.data[\"\" + items][parseInt(i.toString(), 10)];\n count += gLevel[\"\" + items].length + ((gLen !== grid.columns.length) &&\n !isNullOrUndefined(gLevel[\"\" + items][\"\" + records]) ? gLevel[\"\" + items][\"\" + records].length : 0);\n dataRowCnt += (!isNullOrUndefined(gLevel[\"\" + items][\"\" + records]) && !isNullOrUndefined(val[\"\" + agrCnt])) ? gLevel[\"\" + items][\"\" + records].length :\n gLevel[\"\" + items].length;\n if (gLevel[\"\" + items].GroupGuid && gLevel[\"\" + items].childLevels !== 0) {\n recursive(gLevel);\n }\n }\n count += val.data[\"\" + items].length;\n if (!isNullOrUndefined(val[\"\" + agrCnt])) {\n if (val[\"\" + agrCnt] && count && dataRowCnt !== 0) {\n count += ((count - dataRowCnt) * val[\"\" + agrCnt]) + val[\"\" + agrCnt];\n }\n }\n }\n return count;\n}\n/**\n * @param {Object[]} row - Defines the row\n * @returns {void}\n * @hidden\n */\nexport function recursive(row) {\n var items = 'items';\n var rCount = 'count';\n for (var j = 0, length_1 = row[\"\" + items].length; j < length_1; j++) {\n var nLevel = row[\"\" + items][parseInt(j.toString(), 10)];\n count += nLevel[\"\" + rCount];\n if (nLevel[\"\" + items].childLevels !== 0) {\n recursive(nLevel);\n }\n }\n}\n/**\n * @param {Object[]} collection - Defines the array\n * @param {Object} predicate - Defines the predicate\n * @returns {Object} Returns the object\n * @hidden\n */\nexport function iterateArrayOrObject(collection, predicate) {\n var result = [];\n for (var i = 0, len = collection.length; i < len; i++) {\n var pred = predicate(collection[parseInt(i.toString(), 10)], i);\n if (!isNullOrUndefined(pred)) {\n result.push(pred);\n }\n }\n return result;\n}\n/**\n * @param {Object[]} array - Defines the array\n * @returns {Object} Returns the object\n * @hidden\n */\nexport function iterateExtend(array) {\n var obj = [];\n for (var i = 0; i < array.length; i++) {\n obj.push(baseExtend({}, getActualProperties(array[parseInt(i.toString(), 10)]), {}, true));\n }\n return obj;\n}\n/**\n * @param {string | Function} template - Defines the template\n * @returns {Function} Returns the function\n * @hidden\n */\nexport function templateCompiler(template) {\n if (template) {\n try {\n var validSelector = template[0] !== '<';\n if (typeof template === 'function') {\n return baseTemplateComplier(template);\n }\n else if (validSelector && document.querySelectorAll(template).length) {\n return baseTemplateComplier(document.querySelector(template).innerHTML.trim());\n }\n else {\n return baseTemplateComplier(template);\n }\n }\n catch (e) {\n return baseTemplateComplier(template);\n }\n }\n return undefined;\n}\n/**\n * @param {Element} node - Defines the column\n * @param {Object} customAttributes - Defines the index\n * @returns {void}\n * @hidden\n */\nexport function setStyleAndAttributes(node, customAttributes) {\n var copyAttr = {};\n var literals = ['style', 'class'];\n //Dont touch the original object - make a copy\n baseExtend(copyAttr, customAttributes, {});\n if ('style' in copyAttr) {\n setStyleAttribute(node, copyAttr[literals[0]]);\n delete copyAttr[literals[0]];\n }\n if ('class' in copyAttr) {\n addClass([node], copyAttr[literals[1]]);\n delete copyAttr[literals[1]];\n }\n attributes(node, copyAttr);\n}\n/**\n * @param {Object} copied - Defines the column\n * @param {Object} first - Defines the inndex\n * @param {Object} second - Defines the second object\n * @param {string[]} exclude - Defines the exclude\n * @returns {Object} Returns the object\n * @hidden\n */\nexport function extend(copied, first, second, exclude) {\n var moved = baseExtend(copied, first, second);\n var values = Object.keys(moved);\n for (var i = 0; i < values.length; i++) {\n if (exclude && exclude.indexOf(values[parseInt(i.toString(), 10)]) !== -1) {\n delete moved[values[parseInt(i.toString(), 10)]];\n }\n }\n return moved;\n}\n/**\n * @param {Column[]} columnModel - Defines the column\n * @param {number} ind - Defines the inndex\n * @returns {number} - Returns the columnindex\n * @hidden\n */\nexport function setColumnIndex(columnModel, ind) {\n if (ind === void 0) { ind = 0; }\n for (var i = 0, len = columnModel.length; i < len; i++) {\n if (columnModel[parseInt(i.toString(), 10)].columns) {\n columnModel[parseInt(i.toString(), 10)].index = isNullOrUndefined(columnModel[parseInt(i.toString(), 10)].index) ? ind\n : columnModel[parseInt(i.toString(), 10)].index;\n ind++;\n ind = setColumnIndex(columnModel[parseInt(i.toString(), 10)].columns, ind);\n }\n else {\n columnModel[parseInt(i.toString(), 10)].index = isNullOrUndefined(columnModel[parseInt(i.toString(), 10)].index) ? ind\n : columnModel[parseInt(i.toString(), 10)].index;\n ind++;\n }\n }\n return ind;\n}\n/**\n * @param {Column[] | string[] | ColumnModel[]} columns - Defines the column\n * @param {boolean} autoWidth - Defines the autowidth\n * @param {IGrid} gObj - Defines the class name\n * @returns {Column} - Returns the columns\n * @hidden\n */\nexport function prepareColumns(columns, autoWidth, gObj) {\n for (var c = 0, len = columns.length; c < len; c++) {\n var column = void 0;\n if (typeof columns[parseInt(c.toString(), 10)] === 'string') {\n column = new Column({ field: columns[parseInt(c.toString(), 10)] }, gObj);\n }\n else if (!(columns[parseInt(c.toString(), 10)] instanceof Column) || columns[parseInt(c.toString(), 10)].columns) {\n if (!columns[parseInt(c.toString(), 10)].columns) {\n column = new Column(columns[parseInt(c.toString(), 10)], gObj);\n }\n else {\n columns[parseInt(c.toString(), 10)].columns = prepareColumns(columns[parseInt(c.toString(), 10)].columns, null, gObj);\n column = new Column(columns[parseInt(c.toString(), 10)], gObj);\n }\n }\n else {\n column = columns[parseInt(c.toString(), 10)];\n }\n if (column.type && column.type.toLowerCase() === 'checkbox') {\n column.allowReordering = false;\n }\n column.headerText = isNullOrUndefined(column.headerText) ? column.foreignKeyValue || column.field || '' : column.headerText;\n column.foreignKeyField = column.foreignKeyField || column.field;\n column.valueAccessor = (typeof column.valueAccessor === 'string' ? getValue(column.valueAccessor, window)\n : column.valueAccessor) || valueAccessor;\n column.width = autoWidth && isNullOrUndefined(column.width) ? 200 : column.width;\n if (isNullOrUndefined(column.visible)) {\n column.visible = true;\n }\n columns[parseInt(c.toString(), 10)] = column;\n }\n return columns;\n}\n/**\n * @param {HTMLElement} popUp - Defines the popup element\n * @param {MouseEvent | TouchEvent} e - Defines the moouse event\n * @param {string} className - Defines the class name\n * @returns {void}\n * @hidden\n */\nexport function setCssInGridPopUp(popUp, e, className) {\n var popUpSpan = popUp.querySelector('span');\n var position = popUp.parentElement.getBoundingClientRect();\n var targetPosition = e.target.getBoundingClientRect();\n popUpSpan.className = className;\n popUp.style.display = '';\n var isBottomTail = (isNullOrUndefined(e.clientY) ? e.changedTouches[0].clientY :\n e.clientY) > popUp.offsetHeight + 10;\n popUp.style.top = targetPosition.top - position.top +\n (isBottomTail ? -(popUp.offsetHeight + 10) : popUp.offsetHeight + 10) + 'px'; //10px for tail element\n popUp.style.left = getPopupLeftPosition(popUp, e, targetPosition, position.left) + 'px';\n if (isBottomTail) {\n popUp.querySelector('.e-downtail').style.display = '';\n popUp.querySelector('.e-uptail').style.display = 'none';\n }\n else {\n popUp.querySelector('.e-downtail').style.display = 'none';\n popUp.querySelector('.e-uptail').style.display = '';\n }\n}\n/**\n * @param {HTMLElement} popup - Defines the popup element\n * @param {MouseEvent | TouchEvent} e - Defines the mouse event\n * @param {Object} targetPosition - Defines the target position\n * @param {number} targetPosition.top - Defines the top position\n * @param {number} targetPosition.left - Defines the left position\n * @param {number} targetPosition.right - Defines the right position\n * @param {number} left - Defines the left position\n * @returns {number} Returns the popup left position\n * @hidden\n */\nfunction getPopupLeftPosition(popup, e, targetPosition, left) {\n var width = popup.offsetWidth / 2;\n var x = getPosition(e).x;\n if (x - targetPosition.left < width) {\n return targetPosition.left - left;\n }\n else if (targetPosition.right - x < width) {\n return targetPosition.right - left - width * 2;\n }\n else {\n return x - left - width;\n }\n}\n/**\n * @param {Object} obj - Defines the object\n * @returns {Object} Returns the Properties\n * @hidden\n */\nexport function getActualProperties(obj) {\n if (obj instanceof ChildProperty) {\n return getValue('properties', obj);\n }\n else {\n return obj;\n }\n}\n/**\n * @param {Element} elem - Defines the element\n * @param {string} selector - Defines the string selector\n * @param {boolean} isID - Defines the isID\n * @returns {Element} Returns the element\n * @hidden\n */\nexport function parentsUntil(elem, selector, isID) {\n var parent = elem;\n while (parent) {\n if (isID ? parent.id === selector : parent.classList.contains(selector)) {\n break;\n }\n parent = parent.parentElement;\n }\n return parent;\n}\n/**\n * @param {Element} element - Defines the element\n * @param {Element} elements - Defines the element\n * @returns {number} Returns the element index\n * @hidden\n */\nexport function getElementIndex(element, elements) {\n var index = -1;\n for (var i = 0, len = elements.length; i < len; i++) {\n if (elements[parseInt(i.toString(), 10)].isEqualNode(element)) {\n index = i;\n break;\n }\n }\n return index;\n}\n/**\n * @param {Object} value - Defines the value\n * @param {Object} collection - defines the collection\n * @returns {number} Returns the array\n * @hidden\n */\nexport function inArray(value, collection) {\n for (var i = 0, len = collection.length; i < len; i++) {\n if (collection[parseInt(i.toString(), 10)] === value) {\n return i;\n }\n }\n return -1;\n}\n/**\n * @param {Object} collection - Defines the collection\n * @returns {Object} Returns the object\n * @hidden\n */\nexport function getActualPropFromColl(collection) {\n var coll = [];\n for (var i = 0, len = collection.length; i < len; i++) {\n // eslint-disable-next-line no-prototype-builtins\n if (collection[parseInt(i.toString(), 10)].hasOwnProperty('properties')) {\n coll.push(collection[parseInt(i.toString(), 10)].properties);\n }\n else {\n coll.push(collection[parseInt(i.toString(), 10)]);\n }\n }\n return coll;\n}\n/**\n * @param {Element} target - Defines the target element\n * @param {string} selector - Defines the selector\n * @returns {void}\n * @hidden\n */\nexport function removeElement(target, selector) {\n var elements = [].slice.call(target.querySelectorAll(selector));\n for (var i = 0; i < elements.length; i++) {\n remove(elements[parseInt(i.toString(), 10)]);\n }\n}\n/**\n * @param {MouseEvent | TouchEvent} e Defines the mouse event\n * @returns {IPosition} Returns the position\n * @hidden\n */\nexport function getPosition(e) {\n var position = {};\n position.x = (isNullOrUndefined(e.clientX) ? e.changedTouches[0].clientX :\n e.clientX);\n position.y = (isNullOrUndefined(e.clientY) ? e.changedTouches[0].clientY :\n e.clientY);\n return position;\n}\nvar uid = 0;\n/**\n * @param {string} prefix - Defines the prefix string\n * @returns {string} Returns the uid\n * @hidden\n */\nexport function getUid(prefix) {\n return prefix + uid++;\n}\n/**\n * @param {Element | DocumentFragment} elem - Defines the element\n * @param {Element[] | NodeList} children - Defines the Element\n * @returns {Element} Returns the element\n * @hidden\n */\nexport function appendChildren(elem, children) {\n for (var i = 0, len = children.length; i < len; i++) {\n if (len === children.length) {\n elem.appendChild(children[parseInt(i.toString(), 10)]);\n }\n else {\n elem.appendChild(children[0]);\n }\n }\n return elem;\n}\n/**\n * @param {Element} elem - Defines the element\n * @param {string} selector - Defines the selector\n * @param {boolean} isID - Defines isID\n * @returns {Element} Return the element\n * @hidden\n */\nexport function parents(elem, selector, isID) {\n var parent = elem;\n var parents = [];\n while (parent) {\n if (isID ? parent.id === selector : parent.classList.contains(selector)) {\n parents.push(parent);\n }\n parent = parent.parentElement;\n }\n return parents;\n}\n/**\n * @param {AggregateType | string} type - Defines the type\n * @param {Object} data - Defines the data\n * @param {AggregateColumnModel} column - Defines the column\n * @param {Object} context - Defines the context\n * @returns {Object} Returns the calculated aggragate\n * @hidden\n */\nexport function calculateAggregate(type, data, column, context) {\n if (type === 'Custom') {\n var temp = column.customAggregate;\n if (typeof temp === 'string') {\n temp = getValue(temp, window);\n }\n return temp ? temp.call(context, data, column) : '';\n }\n return (column.field in data || data instanceof Array) ? DataUtil.aggregates[type.toLowerCase()](data, column.field) : null;\n}\n/** @hidden */\nvar scrollWidth = null;\n/** @hidden\n * @returns {number} - Returns the scrollbarwidth\n */\nexport function getScrollBarWidth() {\n if (scrollWidth !== null) {\n return scrollWidth;\n }\n var divNode = document.createElement('div');\n var value = 0;\n divNode.style.cssText = 'width:100px;height: 100px;overflow: scroll;position: absolute;top: -9999px;';\n document.body.appendChild(divNode);\n value = (divNode.offsetWidth - divNode.clientWidth) | 0;\n document.body.removeChild(divNode);\n return scrollWidth = value;\n}\n/** @hidden */\nvar rowHeight;\n/**\n * @param {HTMLElement} element - Defines the element\n * @returns {number} Returns the roww height\n * @hidden\n */\nexport function getRowHeight(element) {\n if (rowHeight !== undefined) {\n return rowHeight;\n }\n var table = createElement('table', { className: literals.table, styles: 'visibility: hidden', attrs: { role: 'grid' } });\n table.innerHTML = 'A';\n element.appendChild(table);\n var rect = table.querySelector('td').getBoundingClientRect();\n element.removeChild(table);\n rowHeight = Math.ceil(rect.height);\n return rowHeight;\n}\n/** @hidden */\nvar actualRowHeight;\n/**\n * @param {HTMLElement} element - Defines the HTMl element\n * @returns {number} Returns the row height\n * @hidden\n */\nexport function getActualRowHeight(element) {\n if (actualRowHeight !== undefined) {\n return rowHeight;\n }\n var table = createElement('table', { className: literals.table, styles: 'visibility: hidden', attrs: { role: 'grid' } });\n table.innerHTML = 'A';\n element.appendChild(table);\n var rect = table.querySelector('tr').getBoundingClientRect();\n element.removeChild(table);\n return rect.height;\n}\n/**\n * @param {string} field - Defines the field\n * @returns {boolean} - Returns is complex field\n * @hidden\n */\nexport function isComplexField(field) {\n return field.split('.').length > 1;\n}\n/**\n * @param {string} field - Defines the field\n * @returns {string} - Returns the get complex field ID\n * @hidden\n */\nexport function getComplexFieldID(field) {\n if (field === void 0) { field = ''; }\n return field.replace(/\\./g, '___');\n}\n/**\n * @param {string} field - Defines the field\n * @returns {string} - Returns the parsed column field id\n * @hidden\n */\nexport function getParsedFieldID(field) {\n if (field === void 0) { field = ''; }\n return field.replace(/[^a-zA-Z0-9_.]/g, '\\\\$&');\n}\n/**\n * @param {string} field - Defines the field\n * @returns {string} - Returns the set complex field ID\n * @hidden\n */\nexport function setComplexFieldID(field) {\n if (field === void 0) { field = ''; }\n return field.replace(/___/g, '.');\n}\n/**\n * @param {Column} col - Defines the column\n * @param {string} type - Defines the type\n * @param {Element} elem - Defines th element\n * @returns {boolean} Returns is Editable\n * @hidden\n */\nexport function isEditable(col, type, elem) {\n var row = parentsUntil(elem, literals.row);\n var isOldRow = !row ? true : row && !row.classList.contains('e-insertedrow');\n if (type === 'beginEdit' && isOldRow) {\n if (col.isIdentity || col.isPrimaryKey || !col.allowEditing) {\n return false;\n }\n return true;\n }\n else if (type === 'add' && col.isIdentity) {\n return false;\n }\n else {\n if (isOldRow && !col.allowEditing && !col.isIdentity && !col.isPrimaryKey) {\n return false;\n }\n return true;\n }\n}\n/**\n * @param {IGrid} inst - Defines the IGrid\n * @returns {boolean} Returns is action prevent in boolean\n * @hidden\n */\nexport function isActionPrevent(inst) {\n var dlg = select('#' + inst.element.id + 'EditConfirm', inst.element);\n return inst.editSettings.mode === 'Batch' &&\n (selectAll('.e-updatedtd', inst.element).length || selectAll('.e-gridform.e-formvalidator', inst.element).length)\n && inst.editSettings.showConfirmDialog && (dlg ? dlg.classList.contains('e-popup-close') : true);\n}\n/**\n * @param {any} elem - Defines the element\n * @param {boolean} action - Defines the boolean for action\n * @returns {void}\n * @hidden\n */\n// eslint-disable-next-line\nexport function wrap(elem, action) {\n var clName = 'e-wrap';\n elem = elem instanceof Array ? elem : [elem];\n for (var i = 0; i < elem.length; i++) {\n if (action) {\n elem[parseInt(i.toString(), 10)].classList.add(clName);\n }\n else {\n elem[parseInt(i.toString(), 10)].classList.remove(clName);\n }\n }\n}\n/**\n * @param {ServiceLocator} serviceLocator - Defines the service locator\n * @param {Column} column - Defines the column\n * @returns {void}\n * @hidden\n */\nexport function setFormatter(serviceLocator, column) {\n var fmtr = serviceLocator.getService('valueFormatter');\n var format = 'format';\n var args;\n if (column.type === 'date' || column.type === 'datetime' || column.type === 'dateonly') {\n args = { type: column.type === 'dateonly' ? 'date' : column.type, skeleton: column.format };\n if ((typeof (column.format) === 'string') && column.format !== 'yMd') {\n args[\"\" + format] = column.format;\n }\n }\n switch (column.type) {\n case 'date':\n column.setFormatter(fmtr.getFormatFunction(args));\n column.setParser(fmtr.getParserFunction(args));\n break;\n case 'dateonly':\n column.setFormatter(fmtr.getFormatFunction(args));\n column.setParser(fmtr.getParserFunction(args));\n break;\n case 'datetime':\n column.setFormatter(fmtr.getFormatFunction(args));\n column.setParser(fmtr.getParserFunction(args));\n break;\n case 'number':\n column.setFormatter(fmtr.getFormatFunction({ format: column.format }));\n column.setParser(fmtr.getParserFunction({ format: column.format }));\n break;\n }\n}\n/**\n * @param {Element} cells - Defines the cell element\n * @param {boolean} add - Defines the add\n * @param {string} args - Defines the args\n * @returns {void}\n * @hidden\n */\nexport function addRemoveActiveClasses(cells, add) {\n var args = [];\n for (var _i = 2; _i < arguments.length; _i++) {\n args[_i - 2] = arguments[_i];\n }\n for (var i = 0, len = cells.length; i < len; i++) {\n if (add) {\n classList(cells[parseInt(i.toString(), 10)], args.slice(), []);\n cells[parseInt(i.toString(), 10)].setAttribute('aria-selected', 'true');\n }\n else {\n classList(cells[parseInt(i.toString(), 10)], [], args.slice());\n cells[parseInt(i.toString(), 10)].removeAttribute('aria-selected');\n }\n }\n}\n/**\n * @param {string} result - Defines th string\n * @returns {string} Returns the distinct staing values\n * @hidden\n */\nexport function distinctStringValues(result) {\n var temp = {};\n var res = [];\n for (var i = 0; i < result.length; i++) {\n if (!(result[parseInt(i.toString(), 10)] in temp)) {\n res.push(result[parseInt(i.toString(), 10)].toString());\n temp[result[parseInt(i.toString(), 10)]] = 1;\n }\n }\n return res;\n}\n/**\n * @param {Element} target - Defines the target\n * @param {Dialog} dialogObj - Defines the dialog\n * @returns {void}\n * @hidden\n */\nexport function getFilterMenuPostion(target, dialogObj) {\n var elementVisible = dialogObj.element.style.display;\n dialogObj.element.style.display = 'block';\n var dlgWidth = dialogObj.width;\n var newpos = calculateRelativeBasedPosition(target, dialogObj.element);\n dialogObj.element.style.display = elementVisible;\n dialogObj.element.style.top = (newpos.top + target.getBoundingClientRect().height) - 5 + 'px';\n var leftPos = ((newpos.left - dlgWidth) + target.clientWidth);\n if (leftPos < 1) {\n dialogObj.element.style.left = (dlgWidth + leftPos) - 16 + 'px'; // right calculation\n }\n else {\n dialogObj.element.style.left = leftPos + -4 + 'px';\n }\n}\n/**\n * @param {Object} args - Defines the args\n * @param {Popup} args.popup - Defines the args for popup\n * @param {Dialog} dialogObj - Defines the dialog obj\n * @returns {void}\n * @hidden\n */\nexport function getZIndexCalcualtion(args, dialogObj) {\n args.popup.element.style.zIndex = (dialogObj.zIndex + 1).toString();\n}\n/**\n * @param {Element} elem - Defines the element\n * @returns {void}\n * @hidden\n */\nexport function toogleCheckbox(elem) {\n var span = elem.querySelector('.e-frame');\n var input = span.previousSibling;\n if (span.classList.contains('e-check')) {\n input.checked = false;\n classList(span, ['e-uncheck'], ['e-check']);\n }\n else {\n input.checked = true;\n classList(span, ['e-check'], ['e-uncheck']);\n }\n}\n/**\n * @param {HTMLInputElement} elem - Defines the element\n * @param {boolean} checked - Defines is checked\n * @returns {void}\n * @hidden\n */\nexport function setChecked(elem, checked) {\n elem.checked = checked;\n}\n/**\n * @param {string} uid - Defines the string\n * @param {Element} elem - Defines the Element\n * @param {string} className - Defines the classname\n * @returns {Element} Returns the box wrap\n * @hidden\n */\nexport function createCboxWithWrap(uid, elem, className) {\n var div = createElement('div', { className: className });\n div.appendChild(elem);\n div.setAttribute('uid', uid);\n return div;\n}\n/**\n * @param {Element} elem - Defines the element\n * @param {boolean} checked - Defines is checked\n * @returns {void}\n * @hidden\n */\nexport function removeAddCboxClasses(elem, checked) {\n removeClass([elem], ['e-check', 'e-stop', 'e-uncheck']);\n if (checked) {\n elem.classList.add('e-check');\n }\n else {\n elem.classList.add('e-uncheck');\n }\n}\n/**\n * Refresh the Row model's foreign data.\n *\n * @param {IRow} row - Grid Row model object.\n * @param {Column[]} columns - Foreign columns array.\n * @param {Object} data - Updated Row data.\n * @returns {void}\n * @hidden\n */\nexport function refreshForeignData(row, columns, data) {\n for (var i = 0; i < columns.length; i++) {\n setValue(columns[parseInt(i.toString(), 10)].field, getForeignData(columns[parseInt(i.toString(), 10)], data), row.foreignKeyData);\n }\n var cells = row.cells;\n for (var i = 0; i < cells.length; i++) {\n if (cells[parseInt(i.toString(), 10)].isForeignKey) {\n setValue('foreignKeyData', getValue(cells[parseInt(i.toString(), 10)].column.field, row.foreignKeyData), cells[parseInt(i.toString(), 10)]);\n }\n }\n}\n/**\n * Get the foreign data for the corresponding cell value.\n *\n * @param {Column} column - Foreign Key column\n * @param {Object} data - Row data.\n * @param {string | number} lValue - cell value.\n * @param {Object} foreignKeyData - foreign data source.\n * @returns {Object} Returns the object\n * @hidden\n */\nexport function getForeignData(column, data, lValue, foreignKeyData) {\n var fField = column.foreignKeyField;\n var key = (!isNullOrUndefined(lValue) ? lValue : valueAccessor(column.field, data, column));\n key = isNullOrUndefined(key) ? '' : key;\n var query = new Query();\n var fdata = foreignKeyData || ((column.dataSource instanceof DataManager) && column.dataSource.dataSource.json.length ?\n column.dataSource.dataSource.json : column.columnData);\n if (key.getDay) {\n query.where(getDatePredicate({ field: fField, operator: 'equal', value: key, matchCase: false }));\n }\n else {\n query.where(fField, '==', key, false);\n }\n return new DataManager(fdata).executeLocal(query);\n}\n/**\n * To use to get the column's object by the foreign key value.\n *\n * @param {string} foreignKeyValue - Defines ForeignKeyValue.\n * @param {Column[]} columns - Array of column object.\n * @returns {Column} Returns the element\n * @hidden\n */\nexport function getColumnByForeignKeyValue(foreignKeyValue, columns) {\n var column;\n return columns.some(function (col) {\n column = col;\n return col.foreignKeyValue === foreignKeyValue;\n }) && column;\n}\n/**\n * @param {number} value - Defines the date or month value\n * @returns {string} Returns string\n * @hidden\n */\nexport function padZero(value) {\n if (value < 10) {\n return '0' + value;\n }\n return String(value);\n}\n/**\n * @param {PredicateModel} filterObject - Defines the filterObject\n * @param {string} type - Defines the type\n * @param {boolean} isExecuteLocal - Defines whether the data actions performed in client and used for dateonly type field\n * @returns {Predicate} Returns the Predicate\n * @hidden\n */\nexport function getDatePredicate(filterObject, type, isExecuteLocal) {\n var datePredicate;\n var prevDate;\n var nextDate;\n var prevObj = baseExtend({}, getActualProperties(filterObject));\n var nextObj = baseExtend({}, getActualProperties(filterObject));\n if (isNullOrUndefined(filterObject.value) || filterObject.value === '') {\n datePredicate = new Predicate(prevObj.field, prevObj.operator, prevObj.value, false);\n return datePredicate;\n }\n var value = new Date(filterObject.value);\n if (type === 'dateonly' && !isExecuteLocal) {\n if (typeof (prevObj.value) === 'string') {\n prevObj.value = new Date(prevObj.value);\n }\n var dateOnlyString = prevObj.value.getFullYear() + '-' + padZero(prevObj.value.getMonth() + 1) + '-' + padZero(prevObj.value.getDate());\n var predicates = new Predicate(prevObj.field, prevObj.operator, dateOnlyString, false);\n datePredicate = predicates;\n }\n else {\n if (filterObject.operator === 'equal' || filterObject.operator === 'notequal') {\n if (type === 'datetime') {\n prevDate = new Date(value.setSeconds(value.getSeconds() - 1));\n nextDate = new Date(value.setSeconds(value.getSeconds() + 2));\n filterObject.value = new Date(value.setSeconds(nextDate.getSeconds() - 1));\n }\n else {\n prevDate = new Date(value.setHours(0) - 1);\n nextDate = new Date(value.setHours(24));\n }\n prevObj.value = prevDate;\n nextObj.value = nextDate;\n if (filterObject.operator === 'equal') {\n prevObj.operator = 'greaterthan';\n nextObj.operator = 'lessthan';\n }\n else if (filterObject.operator === 'notequal') {\n prevObj.operator = 'lessthanorequal';\n nextObj.operator = 'greaterthanorequal';\n }\n var predicateSt = new Predicate(prevObj.field, prevObj.operator, prevObj.value, false);\n var predicateEnd = new Predicate(nextObj.field, nextObj.operator, nextObj.value, false);\n datePredicate = filterObject.operator === 'equal' ? predicateSt.and(predicateEnd) : predicateSt.or(predicateEnd);\n }\n else {\n if (type === 'date' && (filterObject.operator === 'lessthanorequal' || filterObject.operator === 'greaterthan')) {\n prevObj.value = new Date(value.setHours(24) - 1);\n }\n if (typeof (prevObj.value) === 'string') {\n prevObj.value = new Date(prevObj.value);\n }\n var predicates = new Predicate(prevObj.field, prevObj.operator, prevObj.value, false);\n datePredicate = predicates;\n }\n }\n if (filterObject.setProperties) {\n filterObject.setProperties({ ejpredicate: datePredicate }, true);\n }\n else {\n filterObject.ejpredicate = datePredicate;\n }\n return datePredicate;\n}\n/**\n * @param {IGrid} grid - Defines the IGrid\n * @returns {boolean} Returns true if group adaptive is true\n * @hidden\n */\nexport function isGroupAdaptive(grid) {\n return grid.enableVirtualization && grid.groupSettings.columns.length > 0 && grid.isVirtualAdaptive &&\n !grid.groupSettings.enableLazyLoading;\n}\n/**\n * @param {string} field - Defines the Field\n * @param {Object} object - Defines the objec\n * @returns {any} Returns the object\n * @hidden\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function getObject(field, object) {\n if (field === void 0) { field = ''; }\n if (field) {\n var value = object;\n var splits = field.split('.');\n for (var i = 0; i < splits.length && !isNullOrUndefined(value); i++) {\n value = value[splits[parseInt(i.toString(), 10)]];\n if (isUndefined(value)) {\n var newCase = splits[parseInt(i.toString(), 10)].charAt(0).toUpperCase()\n + splits[parseInt(i.toString(), 10)].slice(1);\n value = object[\"\" + newCase] || object[(\"\" + newCase).charAt(0).toLowerCase() + (\"\" + newCase).slice(1)];\n }\n }\n return value;\n }\n}\n/**\n * @param {string | Object} format - defines the format\n * @param {string} colType - Defines the coltype\n * @returns {string} Returns the custom Data format\n * @hidden\n */\nexport function getCustomDateFormat(format, colType) {\n var intl = new Internationalization();\n var formatvalue;\n var formatter = 'format';\n var type = 'type';\n if (colType === 'date') {\n formatvalue = typeof (format) === 'object' ?\n intl.getDatePattern({ type: format[\"\" + type] ? format[\"\" + type] : 'date', format: format[\"\" + formatter] }, false) :\n intl.getDatePattern({ type: 'dateTime', skeleton: format }, false);\n }\n else {\n formatvalue = typeof (format) === 'object' ?\n intl.getDatePattern({ type: format[\"\" + type] ? format[\"\" + type] : 'dateTime', format: format[\"\" + formatter] }, false) :\n intl.getDatePattern({ type: 'dateTime', skeleton: format }, false);\n }\n return formatvalue;\n}\n/**\n * @param {IGrid} gObj - Defines the IGrid\n * @param {HierarchyGridPrintMode} hierarchyPrintMode - Defines the hierarchyPrintMode\n * @returns {Object} Returns the object\n * @hidden\n */\nexport function getExpandedState(gObj, hierarchyPrintMode) {\n var rows = gObj.getRowsObject();\n var obj = {};\n for (var _i = 0, rows_1 = rows; _i < rows_1.length; _i++) {\n var row = rows_1[_i];\n if (row.isExpand && !row.isDetailRow) {\n var index = gObj.allowPaging && gObj.printMode === 'AllPages' ? row.index +\n (gObj.pageSettings.currentPage * gObj.pageSettings.pageSize) - gObj.pageSettings.pageSize : row.index;\n if (!isNullOrUndefined(index)) {\n obj[parseInt(index.toString(), 10)] = {};\n obj[parseInt(index.toString(), 10)].isExpand = true;\n if (gObj.childGrid) {\n obj[parseInt(index.toString(), 10)].gridModel = getPrintGridModel(row.childGrid, hierarchyPrintMode);\n obj[parseInt(index.toString(), 10)].gridModel.query = gObj.childGrid.query;\n }\n }\n }\n }\n return obj;\n}\n/**\n * @param {IGrid} gObj - Defines the grid objct\n * @param {HierarchyGridPrintMode} hierarchyPrintMode - Defines the hierarchyPrintMode\n * @returns {IGrid} Returns the IGrid\n * @hidden\n */\nexport function getPrintGridModel(gObj, hierarchyPrintMode) {\n if (hierarchyPrintMode === void 0) { hierarchyPrintMode = 'Expanded'; }\n var printGridModel = {};\n if (!gObj) {\n return printGridModel;\n }\n for (var _i = 0, _a = Print.printGridProp; _i < _a.length; _i++) {\n var key = _a[_i];\n if (key === 'columns') {\n printGridModel[\"\" + key] = getActualPropFromColl(gObj.getColumns());\n }\n else if (key === 'allowPaging') {\n printGridModel[\"\" + key] = gObj.printMode === 'CurrentPage';\n }\n else {\n printGridModel[\"\" + key] = getActualProperties(gObj[\"\" + key]);\n }\n }\n printGridModel['enableHover'] = false;\n if ((gObj.childGrid || gObj.detailTemplate) && hierarchyPrintMode !== 'None') {\n printGridModel.expandedRows = getExpandedState(gObj, hierarchyPrintMode);\n }\n return printGridModel;\n}\n/**\n * @param {Object} copied - Defines the copied object\n * @param {Object} first - Defines the first object\n * @param {Object} second - Defines the second object\n * @param {boolean} deep - Defines the deep\n * @returns {Object} Returns the extended object\n * @hidden\n */\nexport function extendObjWithFn(copied, first, second, deep) {\n var res = copied || {};\n var len = arguments.length;\n if (deep) {\n len = len - 1;\n }\n for (var i = 1; i < len; i++) {\n // eslint-disable-next-line prefer-rest-params\n if (!arguments[parseInt(i.toString(), 10)]) {\n continue;\n }\n // eslint-disable-next-line prefer-rest-params\n var obj1 = arguments[parseInt(i.toString(), 10)];\n var keys = Object.keys(Object.getPrototypeOf(obj1)).length ?\n Object.keys(obj1).concat(getPrototypesOfObj(obj1)) : Object.keys(obj1);\n for (var i_1 = 0; i_1 < keys.length; i_1++) {\n var source = res[keys[parseInt(i_1.toString(), 10)]];\n var cpy = obj1[keys[parseInt(i_1.toString(), 10)]];\n var cln = void 0;\n if (deep && (isObject(cpy) || Array.isArray(cpy))) {\n if (isObject(cpy)) {\n cln = source ? source : {};\n res[keys[parseInt(i_1.toString(), 10)]] = baseExtend({}, cln, cpy, deep);\n }\n else {\n cln = source ? source : [];\n res[keys[parseInt(i_1.toString(), 10)]] = baseExtend([], cln, cpy, deep);\n }\n }\n else {\n res[keys[parseInt(i_1.toString(), 10)]] = cpy;\n }\n }\n }\n return res;\n}\n/**\n * @param {Object} obj - Defines the obj\n * @returns {string[]} Returns the string\n * @hidden\n */\nfunction getPrototypesOfObj(obj) {\n var keys = [];\n while (Object.getPrototypeOf(obj) && Object.keys(Object.getPrototypeOf(obj)).length) {\n keys = keys.concat(Object.keys(Object.getPrototypeOf(obj)));\n obj = Object.getPrototypeOf(obj);\n }\n return keys;\n}\n/**\n * @param {Column[]} column - Defines the Column\n * @returns {number} Returns the column Depth\n * @hidden\n */\nexport function measureColumnDepth(column) {\n var max = 0;\n for (var i = 0; i < column.length; i++) {\n var depth = checkDepth(column[parseInt(i.toString(), 10)], 0);\n if (max < depth) {\n max = depth;\n }\n }\n return max + 1;\n}\n/**\n * @param {Column} col - Defines the Column\n * @param {number} index - Defines the index\n * @returns {number} Returns the depth\n * @hidden\n */\nexport function checkDepth(col, index) {\n var max = index;\n var indices = [];\n if (col.columns) {\n index++;\n for (var i = 0; i < col.columns.length; i++) {\n indices[parseInt(i.toString(), 10)] = checkDepth(col.columns[parseInt(i.toString(), 10)], index);\n }\n for (var j = 0; j < indices.length; j++) {\n if (max < indices[parseInt(j.toString(), 10)]) {\n max = indices[parseInt(j.toString(), 10)];\n }\n }\n index = max;\n }\n return index;\n}\n/**\n * @param {IGrid} gObj - Defines the IGrid\n * @param {PredicateModel[]} filteredCols - Defines the PredicateModel\n * @returns {void}\n * @hidden\n */\nexport function refreshFilteredColsUid(gObj, filteredCols) {\n for (var i = 0; i < filteredCols.length; i++) {\n filteredCols[parseInt(i.toString(), 10)].uid = filteredCols[parseInt(i.toString(), 10)].isForeignKey ?\n getColumnByForeignKeyValue(filteredCols[parseInt(i.toString(), 10)].field, gObj.getForeignKeyColumns()).uid\n : gObj.enableColumnVirtualization ? getColumnModelByFieldName(gObj, filteredCols[parseInt(i.toString(), 10)].field).uid\n : gObj.getColumnByField(filteredCols[parseInt(i.toString(), 10)].field).uid;\n }\n}\n/** @hidden */\n// eslint-disable-next-line @typescript-eslint/no-namespace\nexport var Global;\n(function (Global) {\n // eslint-disable-next-line prefer-const\n Global.timer = null;\n})(Global || (Global = {}));\n/**\n * @param {Element} element - Defines the element\n * @returns {Object} Returns the transform values\n * @hidden\n */\nexport function getTransformValues(element) {\n var style = document.defaultView.getComputedStyle(element, null);\n var transformV = style.getPropertyValue('transform');\n var replacedTv = transformV.replace(/,/g, '');\n var translateX = parseFloat((replacedTv).split(' ')[4]);\n var translateY = parseFloat((replacedTv).split(' ')[5]);\n return { width: translateX, height: translateY };\n}\n/**\n * @param {Element} rootElement - Defines the root Element\n * @param {Element} element - Defines the element\n * @returns {void}\n * @hidden\n */\nexport function applyBiggerTheme(rootElement, element) {\n if (rootElement.classList.contains('e-bigger')) {\n element.classList.add('e-bigger');\n }\n}\n/**\n * @param {IGrid} gObj - Defines grid object\n * @returns {number} - Returns scroll width\n * @hidden\n */\nexport function getScrollWidth(gObj) {\n var scrollElem = gObj.getContent().firstElementChild;\n return scrollElem.scrollWidth > scrollElem.offsetWidth ? getScrollBarWidth() : 0;\n}\n/**\n * @param {IGrid} gObj - Defines grid object\n * @param {number} idx - Defines the index\n * @returns {number} Returns colSpan index\n * @hidden\n */\nexport function resetColspanGroupCaption(gObj, idx) {\n var colspan = 0;\n var cols = gObj.getColumns();\n var width = idx * 30;\n if (gObj.isRowDragable()) {\n colspan++;\n width += 30;\n }\n colspan += (gObj.groupSettings.columns.length - idx);\n width += (30 * (gObj.groupSettings.columns.length - idx));\n var gridWidth = (gObj.width === 'auto' ? gObj.element.offsetWidth : parseInt(gObj.width.toString(), 10)) -\n getScrollWidth(gObj);\n for (var i = 0; i < cols.length; i++) {\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseInt(cols[parseInt(i.toString(), 10)].width.toString(), 10);\n colspan++;\n }\n if (width > gridWidth) {\n colspan--;\n break;\n }\n }\n return colspan;\n}\n/**\n * @param {HTMLElement} tr - Defines the tr Element\n * @param {IGrid} gObj - Defines grid object\n * @returns {void}\n * @hidden\n */\nexport function groupCaptionRowLeftRightPos(tr, gObj) {\n var width = 0;\n for (var j = 0; j < tr.childNodes.length; j++) {\n var td = tr.childNodes[parseInt(j.toString(), 10)];\n td.classList.add('e-leftfreeze');\n applyStickyLeftRightPosition(td, width, gObj.enableRtl, 'Left');\n if (td.classList.contains('e-indentcell') || td.classList.contains('e-recordplusexpand') ||\n td.classList.contains('e-recordpluscollapse')) {\n width += 30;\n }\n if (td.classList.contains('e-groupcaption')) {\n var colspan = parseInt(td.getAttribute('colspan'), 10);\n if (gObj.isRowDragable()) {\n colspan--;\n width += 30;\n }\n colspan = colspan - (gObj.groupSettings.columns.length - j);\n width = width + (30 * (gObj.groupSettings.columns.length - j));\n var cols = gObj.getColumns();\n for (var i = 0; i < cols.length; i++) {\n if ((parseInt(td.getAttribute('colspan'), 10) > 1) &&\n (parseInt(cols[parseInt(i.toString(), 10)].width.toString(), 10)\n + width) > (parseInt(gObj.width.toString(), 10) - getScrollWidth(gObj))) {\n var newColspan = resetColspanGroupCaption(gObj, j);\n td.setAttribute('colspan', newColspan.toString());\n break;\n }\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseInt(cols[parseInt(i.toString(), 10)].width.toString(), 10);\n colspan--;\n }\n if (colspan === 0) {\n break;\n }\n }\n }\n if (td.classList.contains('e-summarycell')) {\n var uid_1 = td.getAttribute('e-mappinguid');\n var column = gObj.getColumnByUid(uid_1);\n width += parseInt(column.width.toString(), 10);\n }\n }\n}\n/**\n * @param {Element} row - Defines row element\n * @param {IGrid} gridObj - Defines grid object\n * @returns {boolean} Returns isRowEnteredInGrid\n * @hidden\n */\nexport function ensureLastRow(row, gridObj) {\n var content = gridObj.getContent().firstElementChild;\n return row && (row.getBoundingClientRect().top - content.getBoundingClientRect().top +\n gridObj.getRowHeight()) > content.offsetHeight;\n}\n/**\n * @param {Element} row - Defines row element\n * @param {number} rowTop - Defines row top number\n * @returns {boolean} Returns first row is true\n * @hidden\n */\nexport function ensureFirstRow(row, rowTop) {\n return row && row.getBoundingClientRect().top < rowTop;\n}\n/**\n * @param {number} index - Defines index\n * @param {IGrid} gObj - Defines grid object\n * @returns {boolean} Returns isRowEnteredInGrid\n * @hidden\n */\nexport function isRowEnteredInGrid(index, gObj) {\n var rowHeight = gObj.getRowHeight();\n var startIndex = gObj.getContent().firstElementChild.scrollTop / rowHeight;\n var endIndex = startIndex + (gObj.getContent().firstElementChild.offsetHeight / rowHeight);\n return index < endIndex && index > startIndex;\n}\n/**\n * @param {IGrid} gObj - Defines the grid object\n * @param {Object} data - Defines the query\n * @returns {number} Returns the edited data index\n * @hidden\n */\nexport function getEditedDataIndex(gObj, data) {\n var keyField = gObj.getPrimaryKeyFieldNames()[0];\n var dataIndex;\n gObj.getCurrentViewRecords().filter(function (e, index) {\n if (keyField.includes('.')) {\n var currentValue = getObject(keyField, e);\n var originalValue = getObject(keyField, data);\n if (currentValue === originalValue) {\n dataIndex = index;\n }\n }\n else {\n if (e[\"\" + keyField] === data[\"\" + keyField]) {\n dataIndex = index;\n }\n }\n });\n return dataIndex;\n}\n/**\n * @param {Object} args - Defines the argument\n * @param {Query} query - Defines the query\n * @returns {FilterStateObj} Returns the filter state object\n * @hidden\n */\nexport function eventPromise(args, query) {\n var state = getStateEventArgument(query);\n var def = new Deferred();\n state.dataSource = def.resolve;\n state.action = args;\n return { state: state, deffered: def };\n}\n/**\n * @param {Query} query - Defines the query\n * @returns {Object} Returns the state event argument\n * @hidden\n */\nexport function getStateEventArgument(query) {\n var adaptr = new UrlAdaptor();\n var dm = new DataManager({ url: '', adaptor: new UrlAdaptor });\n var state = adaptr.processQuery(dm, query);\n var data = JSON.parse(state.data);\n return data;\n}\n/**\n * @param {IGrid} gObj - Defines the Igrid\n * @returns {boolean} Returns the ispercentageWidth\n * @hidden\n */\nexport function ispercentageWidth(gObj) {\n var columns = gObj.getVisibleColumns();\n var percentageCol = 0;\n var undefinedWidthCol = 0;\n for (var i = 0; i < columns.length; i++) {\n if (isUndefined(columns[parseInt(i.toString(), 10)].width)) {\n undefinedWidthCol++;\n }\n else if (columns[parseInt(i.toString(), 10)].width.toString().indexOf('%') !== -1) {\n percentageCol++;\n }\n }\n return (gObj.width === 'auto' || typeof (gObj.width) === 'string' && gObj.width.indexOf('%') !== -1) &&\n !gObj.groupSettings.showGroupedColumn && gObj.groupSettings.columns.length\n && percentageCol && !undefinedWidthCol;\n}\n/**\n * @param {IGrid} gObj - Defines the IGrid\n * @param {Row[]} rows - Defines the row\n * @param {HTMLTableRowElement[]} rowElms - Row elements\n * @param {number} index - Row index\n * @param {number} startRowIndex - Start Row Index\n * @returns {void}\n * @hidden\n */\nexport function resetRowIndex(gObj, rows, rowElms, index, startRowIndex) {\n var startIndex = index ? index : 0;\n for (var i = startRowIndex ? startRowIndex : 0; i < rows.length; i++) {\n if (rows[parseInt(i.toString(), 10)] && rows[parseInt(i.toString(), 10)].isDataRow) {\n rows[parseInt(i.toString(), 10)].index = startIndex;\n rows[parseInt(i.toString(), 10)].isAltRow = gObj.enableAltRow ? startIndex % 2 !== 0 : false;\n rowElms[parseInt(i.toString(), 10)].setAttribute(literals.dataRowIndex, startIndex.toString());\n rowElms[parseInt(i.toString(), 10)].setAttribute(literals.ariaRowIndex, (startIndex + 1).toString());\n if (rows[parseInt(i.toString(), 10)].isAltRow) {\n rowElms[parseInt(i.toString(), 10)].classList.add('e-altrow');\n }\n else {\n rowElms[parseInt(i.toString(), 10)].classList.remove('e-altrow');\n }\n for (var j = 0; j < rowElms[parseInt(i.toString(), 10)].cells.length; j++) {\n rowElms[parseInt(i.toString(), 10)].cells[parseInt(j.toString(), 10)].setAttribute('index', startIndex.toString());\n }\n startIndex++;\n }\n }\n if (!rows.length) {\n gObj.renderModule.emptyRow(true);\n }\n}\n/**\n * @param {IGrid} gObj - Defines the IGrid\n * @returns {void}\n * @hidden\n */\nexport function resetCachedRowIndex(gObj) {\n var rowObjects = gObj.enableInfiniteScrolling && gObj.infiniteScrollSettings.enableCache ?\n gObj.getRowsObject() : gObj.vRows;\n var rowElements = gObj.getRows();\n for (var i = 0, startIndex = 0, k = 0; i < rowObjects.length; i++) {\n var rowObject = rowObjects[parseInt(i.toString(), 10)];\n if (rowObject.isDataRow) {\n rowObject.index = startIndex;\n rowObject.isAltRow = gObj.enableAltRow ? startIndex % 2 !== 0 : false;\n var rowElement = gObj.getRowElementByUID(rowObject.uid);\n if (!isNullOrUndefined(rowElement)) {\n rowElements[parseInt(k.toString(), 10)] = rowElement;\n rowElement.setAttribute(literals.dataRowIndex, startIndex.toString());\n rowElement.setAttribute(literals.ariaRowIndex, (startIndex + 1).toString());\n if (rowObject.isAltRow) {\n rowElement.classList.add('e-altrow');\n }\n else {\n rowElement.classList.remove('e-altrow');\n }\n for (var j = 0; j < rowElement.cells.length; j++) {\n rowElement.cells[parseInt(j.toString(), 10)].setAttribute('index', startIndex.toString());\n }\n k++;\n }\n startIndex++;\n }\n }\n if (gObj.enableInfiniteScrolling && gObj.infiniteScrollSettings.enableCache) {\n gObj.infiniteScrollModule.resetInfiniteCache(rowObjects);\n }\n}\n/**\n * @param {IGrid} gObj - Defines the IGrid\n * @param {RowDropEventArgs} args - Defines the row drop event argument\n * @param {HTMLTableRowElement[]} tr - Row elements\n * @param {Row} dropRObj - dropped row object\n * @returns {void}\n * @hidden\n */\nexport function groupReorderRowObject(gObj, args, tr, dropRObj) {\n var rowObjects = gObj.enableVirtualization ? gObj.vRows : gObj.getRowsObject();\n var orderChangeRowObjects = [];\n var dropRowObject = dropRObj ? dropRObj :\n gObj.getRowObjectFromUID(args.target.closest('tr').getAttribute('data-uid'));\n var rowObjectDropIndex;\n for (var i = 0; i < args.rows.length; i++) {\n var orderChangeRowObject = gObj.getRowObjectFromUID(args.rows[parseInt(i.toString(), 10)].getAttribute('data-uid'));\n if (dropRowObject === orderChangeRowObject) {\n rowObjectDropIndex = rowObjects.indexOf(dropRowObject);\n }\n orderChangeRowObjects.push(rowObjects.splice(rowObjects.indexOf(orderChangeRowObject), 1)[0]);\n }\n if (isNullOrUndefined(rowObjectDropIndex)) {\n rowObjectDropIndex = rowObjects.indexOf(dropRowObject);\n if (args.fromIndex > args.dropIndex) {\n rowObjects.splice.apply(rowObjects, [rowObjectDropIndex, 0].concat(orderChangeRowObjects));\n }\n else {\n rowObjects.splice.apply(rowObjects, [rowObjectDropIndex + 1, 0].concat(orderChangeRowObjects));\n }\n }\n else {\n rowObjects.splice.apply(rowObjects, [rowObjectDropIndex, 0].concat(orderChangeRowObjects));\n }\n if (!gObj.enableVirtualization && !gObj.infiniteScrollSettings.enableCache) {\n var record = {};\n var currentViewData = gObj.getCurrentViewRecords();\n for (var i = 0, len = tr.length; i < len; i++) {\n var index = parseInt(tr[parseInt(i.toString(), 10)].getAttribute(literals.dataRowIndex), 10);\n record[parseInt(i.toString(), 10)] = currentViewData[parseInt(index.toString(), 10)];\n }\n var rows = gObj.getRows();\n for (var i = 0, len = tr.length; i < len; i++) {\n rows[parseInt(i.toString(), 10)] = tr[parseInt(i.toString(), 10)];\n currentViewData[parseInt(i.toString(), 10)] = record[parseInt(i.toString(), 10)];\n }\n }\n if (gObj.enableInfiniteScrolling && gObj.infiniteScrollSettings.enableCache) {\n gObj.infiniteScrollModule.resetInfiniteCache(rowObjects);\n }\n}\n/**\n * @param {IGrid} gObj - Defines the grid object\n * @param {Object} changes - Defines the changes\n * @param {string} type - Defines the type\n * @param {string} keyField - Defines the keyfield\n * @returns {void}\n * @hidden\n */\nexport function compareChanges(gObj, changes, type, keyField) {\n var newArray = gObj.dataToBeUpdated[\"\" + type].concat(changes[\"\" + type]).reduce(function (r, o) {\n r[o[\"\" + keyField]] = r[o[\"\" + keyField]] === undefined ? o : Object.assign(r[o[\"\" + keyField]], o);\n return r;\n }, {});\n gObj.dataToBeUpdated[\"\" + type] = Object.keys(newArray).map(function (k) { return newArray[\"\" + k]; });\n}\n/**\n * @param {IGrid} gObj - Defines the grid object\n * @returns {void}\n * @hidden\n */\nexport function setRowElements(gObj) {\n (gObj).contentModule.rowElements =\n [].slice.call(gObj.element.querySelectorAll('.e-row:not(.e-addedrow):not(.e-cloneproperties .e-row)'));\n}\n/**\n * @param {Element} row - Defines the row\n * @param {number} start - Defines the start index\n * @param {number} end - Defines the end index\n * @returns {void}\n * @hidden\n */\nexport function sliceElements(row, start, end) {\n var cells = row.children;\n var len = cells.length;\n var k = 0;\n for (var i = 0; i < len; i++, k++) {\n if (i >= start && i < end) {\n continue;\n }\n row.removeChild(row.children[parseInt(k.toString(), 10)]);\n k--;\n }\n}\n/**\n * @param {Column} column - Defines the column\n * @param {string} uid - Defines the uid\n * @returns {boolean} Returns is child column\n * @hidden\n */\nexport function isChildColumn(column, uid) {\n var uids = [];\n uids.push(column.uid);\n pushuid(column, uids);\n if (uids.indexOf(uid) > -1) {\n return true;\n }\n else {\n return false;\n }\n}\n/**\n * @param {Column} column - Defines the column\n * @param {string[]} uids - Defines the uid\n * @returns {void}\n * @hidden\n */\nexport function pushuid(column, uids) {\n for (var i = 0; i < column.columns.length; i++) {\n if (column.columns[parseInt(i.toString(), 10)].uid) {\n uids.push(column.columns[parseInt(i.toString(), 10)].uid);\n }\n if (column.columns[parseInt(i.toString(), 10)].columns &&\n column.columns[parseInt(i.toString(), 10)].columns.length) {\n pushuid(column.columns[parseInt(i.toString(), 10)], uids);\n }\n }\n}\n/**\n * @param {Column} column - Defines the column\n * @returns {string} Returns the direction\n * @hidden\n */\nexport function frozenDirection(column) {\n if (column.columns[0].freeze || column.columns[0].isFrozen) {\n if (column.columns[0].freeze === 'Left' || column.columns[0].isFrozen) {\n return 'Left';\n }\n else if (column.columns[0].freeze === 'Right') {\n return 'Right';\n }\n else if (column.columns[0].freeze === 'Fixed') {\n return 'Fixed';\n }\n else {\n return 'None';\n }\n }\n else {\n if (column.columns[0].columns && column.columns[0].columns.length) {\n return frozenDirection(column.columns[0]);\n }\n else {\n return 'None';\n }\n }\n}\n/**\n * @param {Element} row - Defines the row\n * @returns {void}\n * @hidden\n */\nexport function addFixedColumnBorder(row) {\n if (row.querySelector('.e-fixedfreeze')) {\n var cells = [].slice.call(row.querySelectorAll('.e-filterbarcell:not(.e-hide),.e-summarycell:not(.e-hide),.e-headercell:not(.e-hide),.e-rowcell:not(.e-hide)'));\n for (var j = 0; j < cells.length; j++) {\n if (cells[parseInt(j.toString(), 10)].classList.contains('e-fixedfreeze') && (!(cells[j - 1]) ||\n (cells[j - 1] && !cells[j - 1].classList.contains('e-fixedfreeze')))) {\n cells[parseInt(j.toString(), 10)].classList.add('e-freezeleftborder');\n }\n if (cells[parseInt(j.toString(), 10)].classList.contains('e-fixedfreeze') && (!(cells[j + 1]) ||\n (cells[j + 1] && !cells[j + 1].classList.contains('e-fixedfreeze')))) {\n cells[parseInt(j.toString(), 10)].classList.add('e-freezerightborder');\n }\n }\n }\n}\n/**\n * @param {HTMLElement} node - Defines the row\n * @param {number} width - Defines the width\n * @param {boolean} isRtl - Boolean property\n * @param {string} position - Defines the position\n * @returns {void}\n * @hidden\n */\nexport function applyStickyLeftRightPosition(node, width, isRtl, position) {\n if (position === 'Left') {\n if (isRtl) {\n node.style.right = width + 'px';\n }\n else {\n node.style.left = width + 'px';\n }\n }\n if (position === 'Right') {\n if (isRtl) {\n node.style.left = width + 'px';\n }\n else {\n node.style.right = width + 'px';\n }\n }\n}\n/**\n * @param {IGrid} gObj - Defines the grid\n * @param {Column} column - Defines the column\n * @param {Element} node - Defines the Element\n * @param {number} colSpan - Defines the colSpan value\n * @returns {void}\n * @hidden\n */\nexport function resetColandRowSpanStickyPosition(gObj, column, node, colSpan) {\n var columns = gObj.getColumns();\n var index = column.index;\n if (column.freeze === 'Left' && column.border !== 'Left') {\n var idx = index + (colSpan - 1);\n while (columns[parseInt(idx.toString(), 10)].visible === false) {\n idx++;\n }\n if (columns[parseInt(idx.toString(), 10)].border === 'Left') {\n node.classList.add('e-freezeleftborder');\n }\n }\n else if (column.freeze === 'Right' || column.freeze === 'Fixed') {\n var width = 0;\n for (var j = index + 1; j < index + colSpan; j++) {\n if (j === columns.length) {\n break;\n }\n if (columns[parseInt(j.toString(), 10)].visible) {\n width += parseInt(columns[parseInt(j.toString(), 10)].width.toString(), 10);\n }\n else {\n colSpan++;\n }\n }\n if (gObj.enableRtl) {\n node.style.left = parseInt(node.style.left, 10) - width + 'px';\n }\n else {\n node.style.right = parseInt(node.style.right, 10) - width + 'px';\n }\n }\n}\n/**\n * @param {IGrid} gObj - Defines the grid\n * @param {number} rowIndex - Defines the row index\n * @param {number} colIndex - Defines the colum index\n * @returns {void}\n * @hidden\n */\nexport function getCellFromRow(gObj, rowIndex, colIndex) {\n var row = (gObj.getRowByIndex(rowIndex));\n for (var i = 0; i < row.cells.length; i++) {\n if (row.cells[parseInt(i.toString(), 10)].getAttribute('data-colindex') === colIndex.toString()) {\n return row.cells[parseInt(i.toString(), 10)];\n }\n }\n return null;\n}\n/**\n * @param {IGrid} gObj - Defines the grid\n * @param {Column} column - Defines the column\n * @param {Element} node - Defines the Element\n * @returns {void}\n * @hidden\n */\nexport function addStickyColumnPosition(gObj, column, node) {\n if (column.freeze === 'Left' || column.isFrozen) {\n node.classList.add('e-leftfreeze');\n if (column.border === 'Left') {\n node.classList.add('e-freezeleftborder');\n }\n if (column.index === 0) {\n applyStickyLeftRightPosition(node, (gObj.getIndentCount() * 30), gObj.enableRtl, 'Left');\n if (gObj.enableColumnVirtualization) {\n column.valueX = (gObj.getIndentCount() * 30);\n }\n }\n else {\n var cols = gObj.getColumns();\n var width = gObj.getIndentCount() * 30;\n for (var i = 0; i < cols.length; i++) {\n if (column.uid === cols[parseInt(i.toString(), 10)].uid) {\n break;\n }\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n applyStickyLeftRightPosition(node, width, gObj.enableRtl, 'Left');\n if (gObj.enableColumnVirtualization) {\n column.valueX = width;\n }\n }\n }\n else if (column.freeze === 'Right') {\n node.classList.add('e-rightfreeze');\n var cols = gObj.getColumns();\n if (column.border === 'Right') {\n node.classList.add('e-freezerightborder');\n }\n if (column.index === cols[cols.length - 1].index) {\n var width = gObj.getFrozenMode() === 'Right' && gObj.isRowDragable() ? 30 : 0;\n applyStickyLeftRightPosition(node, width, gObj.enableRtl, 'Right');\n if (gObj.enableColumnVirtualization) {\n column.valueX = width;\n }\n }\n else {\n var width = gObj.getFrozenMode() === 'Right' && gObj.isRowDragable() ? 30 : 0;\n for (var i = cols.length - 1; i >= 0; i--) {\n if (column.uid === cols[parseInt(i.toString(), 10)].uid) {\n break;\n }\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n applyStickyLeftRightPosition(node, width, gObj.enableRtl, 'Right');\n if (gObj.enableColumnVirtualization) {\n column.valueX = width;\n }\n }\n }\n else if (column.freeze === 'Fixed') {\n node.classList.add('e-fixedfreeze');\n var cols = gObj.getColumns();\n var width = 0;\n if (gObj.getVisibleFrozenLeftCount()) {\n width = gObj.getIndentCount() * 30;\n }\n else if (gObj.getFrozenMode() === 'Right') {\n width = gObj.groupSettings.columns.length * 30;\n }\n for (var i = 0; i < cols.length; i++) {\n if (column.uid === cols[parseInt(i.toString(), 10)].uid) {\n break;\n }\n if ((cols[parseInt(i.toString(), 10)].freeze === 'Left' || cols[parseInt(i.toString(), 10)].isFrozen) ||\n cols[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n }\n applyStickyLeftRightPosition(node, (width - 1), gObj.enableRtl, 'Left');\n width = gObj.getFrozenMode() === 'Right' && gObj.isRowDragable() ? 30 : 0;\n for (var i = cols.length - 1; i >= 0; i--) {\n if (column.uid === cols[parseInt(i.toString(), 10)].uid) {\n break;\n }\n if (cols[parseInt(i.toString(), 10)].freeze === 'Right' || cols[parseInt(i.toString(), 10)].freeze === 'Fixed') {\n if (cols[parseInt(i.toString(), 10)].visible) {\n width += parseFloat(cols[parseInt(i.toString(), 10)].width.toString());\n }\n }\n }\n applyStickyLeftRightPosition(node, (width - 1), gObj.enableRtl, 'Right');\n }\n else {\n node.classList.add('e-unfreeze');\n }\n}\n/**\n * @param {IGrid} gObj - Defines the grid Object\n * @param {Column} col - Defines the column\n * @param {number} rowIndex - Defines the rowindex\n * @returns {Element} Returns the element\n * @hidden\n */\nexport function getCellsByTableName(gObj, col, rowIndex) {\n return [].slice.call(gObj.getDataRows()[parseInt(rowIndex.toString(), 10)].getElementsByClassName(literals.rowCell));\n}\n/**\n * @param {IGrid} gObj - Defines the column\n * @param {Column} col - Defines the index\n * @param {number} rowIndex - Defines the rules\n * @param {number} index - Defines the movable column rules\n * @returns {Element} Returns the Element\n * @hidden\n */\nexport function getCellByColAndRowIndex(gObj, col, rowIndex, index) {\n return getCellsByTableName(gObj, col, rowIndex)[parseInt(index.toString(), 10)];\n}\n/**\n * @param {Column} col - Defines the column\n * @param {number} index - Defines the index\n * @param {Object} rules - Defines the rules\n * @param {Object} mRules - Defines the movable column rules\n * @param {Object} frRules - Defines the Frozen rules\n * @param {number} len - Defines the length\n * @param {boolean} isCustom - Defines custom form validation\n * @returns {void}\n * @hidden\n */\nexport function setValidationRuels(col, index, rules, mRules, frRules, len, isCustom) {\n if (isCustom) {\n rules[getComplexFieldID(col.field)] = col.validationRules;\n }\n else {\n if (col.getFreezeTableName() === literals.frozenLeft\n || (!index && col.getFreezeTableName() === literals.frozenRight) || len === 1) {\n rules[getComplexFieldID(col.field)] = col.validationRules;\n }\n else if (col.getFreezeTableName() === 'movable' || !col.getFreezeTableName()) {\n mRules[getComplexFieldID(col.field)] = col.validationRules;\n }\n else if (col.getFreezeTableName() === literals.frozenRight) {\n frRules[getComplexFieldID(col.field)] = col.validationRules;\n }\n }\n}\n/**\n * @param {string} numberFormat - Format\n * @param {string} type - Value type\n * @param {boolean} isExcel - Boolean property\n * @param {string} currencyCode - Specifies the currency code to be used for formatting.\n * @returns {string} returns formated value\n * @hidden\n */\nexport function getNumberFormat(numberFormat, type, isExcel, currencyCode) {\n var format;\n var intl = new Internationalization();\n if (type === 'number') {\n try {\n format = intl.getNumberPattern({ format: numberFormat, currency: currencyCode, useGrouping: true }, true);\n }\n catch (error) {\n format = numberFormat;\n }\n }\n else if (type === 'date' || type === 'time' || type === 'datetime') {\n try {\n format = intl.getDatePattern({ skeleton: numberFormat, type: type }, isExcel);\n if (isNullOrUndefined(format)) {\n // eslint-disable-next-line\n throw 'error';\n }\n }\n catch (error) {\n try {\n format = intl.getDatePattern({ format: numberFormat, type: type }, isExcel);\n }\n catch (error) {\n format = numberFormat;\n }\n }\n }\n else {\n format = numberFormat;\n }\n if (type !== 'number') {\n var patternRegex = /G|H|c|'| a|yy|y|EEEE|E/g;\n var mtch_1 = { 'G': '', 'H': 'h', 'c': 'd', '\\'': '\"', ' a': ' AM/PM', 'yy': 'yy', 'y': 'yyyy', 'EEEE': 'dddd', 'E': 'ddd' };\n format = format.replace(patternRegex, function (pattern) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return mtch_1[\"\" + pattern];\n });\n }\n return format;\n}\n/**\n * @param {IGrid} gObj - Grid instance\n * @returns {void}\n * @hidden\n */\nexport function addBiggerDialog(gObj) {\n if (gObj.enableAdaptiveUI) {\n var dialogs = document.getElementsByClassName('e-responsive-dialog');\n for (var i = 0; i < dialogs.length; i++) {\n dialogs[parseInt(i.toString(), 10)].classList.add('e-bigger');\n }\n }\n}\n/**\n * @param {string} value - specifies the trr\n * @param {Object} mapObject - specifies the idx\n * @returns {Object | string} returns object or string\n * @hidden\n */\nexport function performComplexDataOperation(value, mapObject) {\n var returnObj;\n var length = value.split('.').length;\n var splits = value.split('.');\n var duplicateMap = mapObject;\n for (var i = 0; i < length; i++) {\n returnObj = duplicateMap[splits[parseInt(i.toString(), 10)]];\n duplicateMap = returnObj;\n }\n return returnObj;\n}\n/**\n * @param {Object} tr - specifies the trr\n * @param {number} idx - specifies the idx\n * @param {string} displayVal - specifies the displayval\n * @param {Row} rows - specifies the rows\n * @param {IGrid} parent - Grid instance\n * @param {boolean} isContent - check for content renderer\n * @returns {void}\n * @hidden\n */\nexport function setDisplayValue(tr, idx, displayVal, rows, parent, isContent) {\n var trs = Object.keys(tr);\n var actualIndex = idx;\n for (var i = 0; i < trs.length; i++) {\n var td = tr[trs[parseInt(i.toString(), 10)]].querySelectorAll('td.e-rowcell')[parseInt(idx.toString(), 10)];\n if (parent && !parent.isFrozenGrid() && !parent.isRowDragable()) {\n td = (!isNullOrUndefined(td) && (parseInt(td.getAttribute('data-colindex'), 10) === idx ||\n (parentsUntil(td, 'e-addedrow') && td.parentElement.childNodes[parseInt(idx.toString(), 10)] === td)))\n ? td : tr[parseInt(i.toString(), 10)].querySelector(\"td[data-colindex=\\\"\" + idx + \"\\\"]\");\n if (isNullOrUndefined(td)) {\n continue;\n }\n else {\n idx = (parent.getContentTable().querySelector('.e-detailrowcollapse, .e-detailrowexpand')) ?\n (td.cellIndex - 1) : td.cellIndex;\n }\n }\n if (tr[trs[parseInt(i.toString(), 10)]].querySelectorAll('td.e-rowcell').length && td) {\n setStyleAttribute(tr[trs[parseInt(i.toString(), 10)]].querySelectorAll('td.e-rowcell')[parseInt(idx.toString(), 10)], { 'display': displayVal });\n if (tr[trs[parseInt(i.toString(), 10)]].querySelectorAll('td.e-rowcell')[parseInt(idx.toString(), 10)].classList.contains('e-hide')) {\n removeClass([tr[trs[parseInt(i.toString(), 10)]].querySelectorAll('td.e-rowcell')[parseInt(idx.toString(), 10)]], ['e-hide']);\n }\n if ((isContent && parent.isRowDragable()) || (parent && parent.isDetail())) {\n var index = idx + 1;\n rows[trs[parseInt(i.toString(), 10)]].cells[parseInt(index.toString(), 10)].visible = displayVal === '' ? true : false;\n }\n else {\n if (!isNullOrUndefined(rows[trs[parseInt(i.toString(), 10)]])) {\n rows[trs[parseInt(i.toString(), 10)]].cells[parseInt(idx.toString(), 10)].visible = displayVal === '' ? true : false;\n if (rows[trs[parseInt(i.toString(), 10)]].cells[parseInt(idx.toString(), 10)].visible === false) {\n tr[trs[parseInt(i.toString(), 10)]].querySelectorAll('td.e-rowcell')[parseInt(idx.toString(), 10)].classList.add('e-hide');\n }\n }\n }\n idx = actualIndex;\n }\n }\n}\n// eslint-disable-next-line\n/** @hidden */\nexport function addRemoveEventListener(parent, evt, isOn, module) {\n for (var _i = 0, evt_1 = evt; _i < evt_1.length; _i++) {\n var inst = evt_1[_i];\n if (isOn) {\n parent.on(inst.event, inst.handler, module);\n }\n else {\n parent.off(inst.event, inst.handler);\n }\n }\n}\n// eslint-disable-next-line\n/** @hidden */\nexport function createEditElement(parent, column, classNames, attr) {\n var complexFieldName = getComplexFieldID(column.field);\n attr = Object.assign(attr, {\n id: parent.element.id + complexFieldName,\n name: complexFieldName, 'e-mappinguid': column.uid\n });\n return parent.createElement('input', {\n className: classNames, attrs: attr\n });\n}\n/**\n * @param {IGrid} gObj - Grid instance\n * @param {string} uid - Defines column's uid\n * @returns {Column} returns column model\n * @hidden\n */\nexport function getColumnModelByUid(gObj, uid) {\n var column;\n for (var _i = 0, _a = (gObj.columnModel); _i < _a.length; _i++) {\n var col = _a[_i];\n if (col.uid === uid) {\n column = col;\n break;\n }\n }\n return column;\n}\n/**\n * @param {IGrid} gObj - Grid instance\n * @param {string} field - Defines column's uid\n * @returns {Column} returns column model\n * @hidden\n */\nexport function getColumnModelByFieldName(gObj, field) {\n var column;\n if (!gObj.columnModel) {\n gObj.getColumns();\n }\n for (var _i = 0, _a = (gObj.columnModel); _i < _a.length; _i++) {\n var col = _a[_i];\n if (col.field === field) {\n column = col;\n break;\n }\n }\n return column;\n}\n/**\n * @param {string} id - Defines component id\n * @param {string[]} evts - Defines events\n * @param {object} handlers - Defines event handlers\n * @param {any} instance - Defines class instance\n * @returns {void}\n * @hidden\n */\n// eslint-disable-next-line\nexport function registerEventHandlers(id, evts, handlers, instance) {\n instance.eventHandlers[\"\" + id] = {};\n for (var i = 0; i < evts.length; i++) {\n instance.eventHandlers[\"\" + id][evts[parseInt(i.toString(), 10)]] = handlers[evts[parseInt(i.toString(), 10)]];\n }\n}\n/**\n * @param {any} component - Defines component instance\n * @param {string[]} evts - Defines events\n * @param {any} instance - Defines class instance\n * @returns {void}\n * @hidden\n */\n// eslint-disable-next-line\nexport function removeEventHandlers(component, evts, instance) {\n for (var i = 0; i < evts.length; i++) {\n if (component.isDestroyed) {\n break;\n }\n component.removeEventListener(evts[parseInt(i.toString(), 10)], instance.eventHandlers[component.element.id][evts[parseInt(i.toString(), 10)]]);\n }\n}\n/**\n * @param {IGrid | IXLFilter} parent - Defines parent instance\n * @param {string[]} templates - Defines the templates name which are needs to clear\n * @returns {void}\n * @hidden\n */\nexport function clearReactVueTemplates(parent, templates) {\n parent.destroyTemplate(templates);\n if (parent.isReact) {\n parent.renderTemplates();\n }\n}\n/**\n *\n * @param { Element } row - Defines row element\n * @returns { number } row index\n */\nexport function getRowIndexFromElement(row) {\n return parseInt(row.getAttribute(literals.dataRowIndex), 10);\n}\n/**\n *\n * @param { string[] } fields - Defines grouped fields\n * @param { values } values - Defines caption keys\n * @param { any } instance - Defines dynamic class instance\n * @returns { Predicate } returns filter predicate\n */\n// eslint-disable-next-line\nexport function generateExpandPredicates(fields, values, instance) {\n var filterCols = [];\n for (var i = 0; i < fields.length; i++) {\n var column = instance.parent.getColumnByField(fields[parseInt(i.toString(), 10)]);\n var value = values[parseInt(i.toString(), 10)] === 'null' ? null : values[parseInt(i.toString(), 10)];\n var pred = {\n field: fields[parseInt(i.toString(), 10)], predicate: 'or', uid: column.uid, operator: 'equal', type: column.type,\n matchCase: instance.allowCaseSensitive, ignoreAccent: instance.parent.filterSettings.ignoreAccent\n };\n if (value === '' || isNullOrUndefined(value)) {\n filterCols = filterCols.concat(CheckBoxFilterBase.generateNullValuePredicates(pred));\n }\n else {\n filterCols.push(extend({}, { value: value }, pred));\n }\n }\n return CheckBoxFilterBase.getPredicate(filterCols);\n}\n/**\n *\n * @param { Predicate } pred - Defines filter predicate\n * @returns { Predicate[] } Returns formed predicate\n */\nexport function getPredicates(pred) {\n var predicateList = [];\n for (var _i = 0, _a = Object.keys(pred); _i < _a.length; _i++) {\n var prop = _a[_i];\n predicateList.push(pred[\"\" + prop]);\n }\n return predicateList;\n}\n/**\n *\n * @param { number } index - Defines group caption indent\n * @param { Row[] } rowsObject - Defines rows object\n * @returns { { fields: string[], keys: string[] } } Returns grouped keys and values\n */\nexport function getGroupKeysAndFields(index, rowsObject) {\n var fields = [];\n var keys = [];\n for (var i = index; i >= 0; i--) {\n if (rowsObject[parseInt(i.toString(), 10)].isCaptionRow\n && fields.indexOf(rowsObject[parseInt(i.toString(), 10)].data.field) === -1\n && (rowsObject[parseInt(i.toString(), 10)].indent < rowsObject[parseInt(index.toString(), 10)].indent || i === index)) {\n fields.push(rowsObject[parseInt(i.toString(), 10)].data.field);\n keys.push(rowsObject[parseInt(i.toString(), 10)].data.key);\n if (rowsObject[parseInt(i.toString(), 10)].indent === 0) {\n break;\n }\n }\n }\n return { fields: fields, keys: keys };\n}\n// eslint-disable-next-line\n/**\n *\n * @param { number[][] } checkActiveMatrix - Defines matrix to check\n * @param { number[] } checkCellIndex - Defines index to check\n * @param { boolean } next - Defines select next or previous index\n * @returns { number[] } - Returns next active current index\n */\nexport function findCellIndex(checkActiveMatrix, checkCellIndex, next) {\n var activeMatrix = checkActiveMatrix;\n var cellIndex = checkCellIndex;\n var currentCellIndexPass = false;\n if (next) {\n for (var i = cellIndex[0]; i < activeMatrix.length; i++) {\n var rowCell = activeMatrix[parseInt(i.toString(), 10)];\n for (var j = 0; j < rowCell.length; j++) {\n if (currentCellIndexPass && activeMatrix[parseInt(i.toString(), 10)][parseInt(j.toString(), 10)] === 1) {\n cellIndex = [i, j];\n return cellIndex;\n }\n if (!currentCellIndexPass && cellIndex.toString() === [i, j].toString()) {\n currentCellIndexPass = true;\n }\n }\n }\n }\n else {\n for (var i = cellIndex[0]; i >= 0; i--) {\n var rowCell = activeMatrix[parseInt(i.toString(), 10)];\n for (var j = rowCell.length - 1; j >= 0; j--) {\n if (currentCellIndexPass && activeMatrix[parseInt(i.toString(), 10)][parseInt(j.toString(), 10)] === 1) {\n cellIndex = [i, j];\n return cellIndex;\n }\n if (!currentCellIndexPass && cellIndex.toString() === [i, j].toString()) {\n currentCellIndexPass = true;\n }\n }\n }\n }\n return cellIndex;\n}\n/**\n *\n * @param { string } string - Defines string need to capitalized first letter\n * @returns { string } - Returns capitalized first letter string\n */\nexport function capitalizeFirstLetter(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n","/* tslint:disable-next-line:max-line-length */\nimport { EventHandler, isNullOrUndefined, extend, classList, addClass, removeClass, Browser, getValue, setValue, createElement } from '@syncfusion/ej2-base';\nimport { parentsUntil, getUid, appendChildren, getDatePredicate, getObject, extendObjWithFn, eventPromise, setChecked, clearReactVueTemplates, padZero, Global } from '../base/util';\nimport { remove, debounce, Internationalization, SanitizeHtmlHelper } from '@syncfusion/ej2-base';\nimport { DataUtil, Query, DataManager, Predicate } from '@syncfusion/ej2-data';\nimport { createCheckBox } from '@syncfusion/ej2-buttons';\nimport * as events from '../base/constant';\nimport { ValueFormatter } from '../services/value-formatter';\nimport { getForeignData } from '../base/util';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { createSpinner, hideSpinner, showSpinner } from '@syncfusion/ej2-popups';\nimport { getFilterMenuPostion, toogleCheckbox, createCboxWithWrap, removeAddCboxClasses, getColumnByForeignKeyValue } from '../base/util';\n/**\n * @hidden\n * `CheckBoxFilterBase` module is used to handle filtering action.\n */\nvar CheckBoxFilterBase = /** @class */ (function () {\n /**\n * Constructor for checkbox filtering module\n *\n * @param {IXLFilter} parent - specifies the IXLFilter\n * @hidden\n */\n function CheckBoxFilterBase(parent) {\n this.isExecuteLocal = false;\n this.existingPredicate = {};\n this.foreignKeyQuery = new Query();\n /** @hidden */\n this.filterState = true;\n this.values = {};\n this.renderEmpty = false;\n this.isCheckboxFilterTemplate = false;\n this.infiniteRenderMod = false;\n // for infinite scroll ui\n this.infiniteInitialLoad = false;\n this.infiniteSearchValChange = false;\n this.infinitePermenantLocalData = [];\n this.infiniteQueryExecutionPending = false;\n this.infiniteSkipCnt = 0;\n this.infiniteScrollAppendDiff = 0;\n this.prevInfiniteScrollDirection = '';\n this.infiniteLoadedElem = [];\n this.infiniteDataCount = 0;\n this.infiniteLocalSelectAll = true;\n this.localInfiniteSelectAllClicked = false;\n this.localInfiniteSelectionInteracted = false;\n this.infiniteManualSelectMaintainPred = [];\n this.parent = parent;\n this.id = this.parent.element.id;\n this.valueFormatter = new ValueFormatter(this.parent.locale);\n this.cBoxTrue = createCheckBox(this.parent.createElement, false, { checked: true, label: ' ' });\n this.cBoxFalse = createCheckBox(this.parent.createElement, false, { checked: false, label: ' ' });\n this.cBoxTrue.insertBefore(this.parent.createElement('input', {\n className: 'e-chk-hidden', attrs: { type: 'checkbox' }\n }), this.cBoxTrue.firstChild);\n this.cBoxFalse.insertBefore(this.parent.createElement('input', {\n className: 'e-chk-hidden', attrs: { 'type': 'checkbox' }\n }), this.cBoxFalse.firstChild);\n this.cBoxFalse.querySelector('.e-frame').classList.add('e-uncheck');\n if (this.parent.enableRtl) {\n addClass([this.cBoxTrue, this.cBoxFalse], ['e-rtl']);\n }\n if (this.parent.cssClass) {\n if (this.parent.cssClass.indexOf(' ') !== -1) {\n addClass([this.cBoxTrue, this.cBoxFalse], this.parent.cssClass.split(' '));\n }\n else {\n addClass([this.cBoxTrue, this.cBoxFalse], [this.parent.cssClass]);\n }\n }\n }\n /**\n * @returns {void}\n * @hidden\n */\n CheckBoxFilterBase.prototype.destroy = function () {\n this.closeDialog();\n };\n CheckBoxFilterBase.prototype.wireEvents = function () {\n EventHandler.add(this.dlg, 'click', this.clickHandler, this);\n EventHandler.add(this.dlg, 'keyup', this.keyupHandler, this);\n this.searchHandler = debounce(this.searchBoxKeyUp, 200);\n var elem = this.dialogObj.element.querySelector('.e-searchinput');\n if (elem) {\n EventHandler.add(elem, 'keyup', this.searchHandler, this);\n EventHandler.add(elem, 'input', this.searchHandler, this);\n }\n };\n CheckBoxFilterBase.prototype.unWireEvents = function () {\n EventHandler.remove(this.dlg, 'click', this.clickHandler);\n EventHandler.remove(this.dlg, 'keyup', this.keyupHandler);\n var elem = this.dialogObj.element.querySelector('.e-searchinput');\n if (elem) {\n EventHandler.remove(elem, 'keyup', this.searchHandler);\n EventHandler.remove(elem, 'input', this.searchHandler);\n }\n };\n CheckBoxFilterBase.prototype.foreignKeyFilter = function (args, fColl, mPredicate) {\n var _this = this;\n var fPredicate = {};\n var filterCollection = [];\n var query = this.foreignKeyQuery.clone();\n this.options.column.dataSource.\n executeQuery(query.where(mPredicate)).then(function (e) {\n _this.options.column.columnData = e.result;\n _this.parent.notify(events.generateQuery, { predicate: fPredicate, column: _this.options.column });\n args.ejpredicate = fPredicate.predicate.predicates;\n var fpred = fPredicate.predicate.predicates;\n for (var i = 0; i < fpred.length; i++) {\n filterCollection.push({\n field: fpred[parseInt(i.toString(), 10)].field,\n predicate: 'or',\n matchCase: fpred[parseInt(i.toString(), 10)].ignoreCase,\n ignoreAccent: fpred[parseInt(i.toString(), 10)].ignoreAccent,\n operator: fpred[parseInt(i.toString(), 10)].operator,\n value: fpred[parseInt(i.toString(), 10)].value,\n type: _this.options.type\n });\n }\n args.filterCollection = filterCollection.length ? filterCollection :\n fColl.filter(function (col) { return col.field = _this.options.field; });\n _this.options.handler(args);\n });\n };\n CheckBoxFilterBase.prototype.foreignFilter = function (args, value) {\n var operator = this.options.isRemote ?\n (this.options.column.type === 'string' ? 'contains' : 'equal') : (this.options.column.type ? 'contains' : 'equal');\n var initalPredicate = new Predicate(this.options.column.foreignKeyValue, operator, value, true, this.options.ignoreAccent);\n this.foreignKeyFilter(args, [args.filterCollection], initalPredicate);\n };\n CheckBoxFilterBase.prototype.searchBoxClick = function (e) {\n var target = e.target;\n if (target.classList.contains('e-searchclear')) {\n this.sInput.value = target.classList.contains('e-chkcancel-icon') ? '' : this.sInput.value;\n if (this.isCheckboxFilterTemplate) {\n this.parent.notify('refreshCheckbox', { event: e });\n }\n else {\n this.refreshCheckboxes();\n }\n this.updateSearchIcon();\n this.sInput.focus();\n }\n };\n CheckBoxFilterBase.prototype.searchBoxKeyUp = function (e) {\n if (isNullOrUndefined(e) || (e.key !== 'ArrowUp' && e.key !== 'ArrowDown' && e.key !== 'Tab' && !(e.key === 'Tab' && e.shiftKey))) {\n if (!isNullOrUndefined(this.parent.loadingIndicator) && this.parent.loadingIndicator.indicatorType === 'Shimmer') {\n this.parent.showMaskRow(undefined, this.dialogObj.element);\n }\n if (this.isCheckboxFilterTemplate) {\n this.parent.notify('refreshCheckbox', { event: e });\n }\n else {\n this.refreshCheckboxes();\n }\n this.updateSearchIcon();\n }\n };\n CheckBoxFilterBase.prototype.updateSearchIcon = function () {\n if (this.sInput.value.length) {\n classList(this.sIcon, ['e-chkcancel-icon'], ['e-search-icon']);\n if (!isNullOrUndefined(document.body.querySelector('.e-chkcancel-icon'))) {\n document.body.querySelector('.e-chkcancel-icon').setAttribute('title', this.localeObj.getConstant('Clear'));\n }\n }\n else {\n classList(this.sIcon, ['e-search-icon'], ['e-chkcancel-icon']);\n if (!isNullOrUndefined(document.body.querySelector('.e-searchclear.e-search-icon'))) {\n document.body.querySelector('.e-searchclear.e-search-icon').setAttribute('title', this.localeObj.getConstant('Search'));\n }\n }\n };\n /**\n * Gets the localized label by locale keyword.\n *\n * @param {string} key - Defines localization key\n * @returns {string} - returns localization label\n */\n CheckBoxFilterBase.prototype.getLocalizedLabel = function (key) {\n return this.localeObj.getConstant(key);\n };\n CheckBoxFilterBase.prototype.updateDataSource = function () {\n var dataSource = this.options.dataSource;\n var str = 'object';\n if (!(dataSource instanceof DataManager)) {\n for (var i = 0; i < dataSource.length; i++) {\n // eslint-disable-next-line valid-typeof\n if (typeof dataSource !== str) {\n var obj = {};\n obj[this.options.field] = dataSource[parseInt(i.toString(), 10)];\n dataSource[parseInt(i.toString(), 10)] = obj;\n }\n }\n }\n };\n CheckBoxFilterBase.prototype.updateModel = function (options) {\n this.options = options;\n this.existingPredicate = options.actualPredicate || {};\n this.options.dataSource = options.dataSource;\n this.options.dataManager = options.dataManager ? options.dataManager : options.dataSource;\n this.updateDataSource();\n this.options.type = options.type;\n this.options.format = options.format || '';\n this.options.ignoreAccent = options.ignoreAccent || false;\n this.options.filteredColumns = options.filteredColumns || this.parent.filterSettings.columns;\n this.options.query = options.query || new Query();\n this.options.allowCaseSensitive = options.allowCaseSensitive || false;\n this.options.uid = options.column.uid;\n this.options.disableHtmlEncode = options.column.disableHtmlEncode || false;\n this.values = {};\n this.localeObj = options.localeObj;\n this.isFiltered = options.filteredColumns.length;\n this.infiniteRenderMod = this.parent.filterSettings && this.parent.filterSettings.enableInfiniteScrolling ? true : false;\n this.infiniteUnloadParentExistPred = this.infiniteRenderMod && this.existingPredicate[this.options.column.field] ? this.existingPredicate[this.options.column.field].slice() : [];\n };\n CheckBoxFilterBase.prototype.getAndSetChkElem = function (options) {\n this.dlg = this.parent.createElement('div', {\n id: this.id + this.options.type + '_excelDlg',\n attrs: { uid: this.options.column.uid },\n className: 'e-checkboxfilter e-filter-popup'\n });\n this.sBox = this.parent.createElement('div', { className: 'e-searchcontainer' });\n if (!options.hideSearchbox) {\n this.sInput = this.parent.createElement('input', {\n id: this.id + '_SearchBox',\n className: 'e-searchinput'\n });\n this.sIcon = this.parent.createElement('span', {\n className: 'e-searchclear e-search-icon e-icons e-input-group-icon', attrs: {\n type: 'text', title: this.getLocalizedLabel('Search')\n }\n });\n this.searchBox = this.parent.createElement('span', { className: 'e-searchbox e-fields' });\n this.searchBox.appendChild(this.sInput);\n this.sBox.appendChild(this.searchBox);\n var inputargs = {\n element: this.sInput, floatLabelType: 'Never', properties: {\n placeholder: this.getLocalizedLabel('Search'),\n cssClass: this.parent.cssClass\n }\n };\n Input.createInput(inputargs, this.parent.createElement);\n this.searchBox.querySelector('.e-input-group').appendChild(this.sIcon);\n }\n this.spinner = this.parent.createElement('div', { className: 'e-spinner' }); //for spinner\n this.cBox = this.parent.createElement('div', {\n id: this.id + this.options.type + '_CheckBoxList',\n className: 'e-checkboxlist e-fields'\n });\n this.spinner.appendChild(this.cBox);\n this.sBox.appendChild(this.spinner);\n return this.sBox;\n };\n CheckBoxFilterBase.prototype.showDialog = function (options) {\n var args = {\n requestType: events.filterBeforeOpen,\n columnName: this.options.field, columnType: this.options.type, cancel: false\n };\n var filterModel = 'filterModel';\n args[\"\" + filterModel] = this;\n this.parent.notify(events.cBoxFltrBegin, args);\n if (args.cancel) {\n options.cancel = args.cancel;\n return;\n }\n this.dialogObj = new Dialog({\n visible: false, content: this.sBox,\n close: this.closeDialog.bind(this),\n enableRtl: this.parent.enableRtl,\n width: (!isNullOrUndefined(parentsUntil(options.target, 'e-bigger')))\n || this.parent.element.classList.contains('e-device') ? 260 : 255,\n target: this.parent.element, animationSettings: { effect: 'None' },\n buttons: [{\n click: this.btnClick.bind(this),\n buttonModel: {\n content: this.getLocalizedLabel(this.isExcel ? 'OKButton' : 'FilterButton'),\n cssClass: this.parent.cssClass ? 'e-primary' + ' ' + this.parent.cssClass : 'e-primary',\n isPrimary: true\n }\n },\n {\n click: this.btnClick.bind(this),\n buttonModel: { cssClass: this.parent.cssClass ? 'e-flat' + ' ' + this.parent.cssClass : 'e-flat',\n content: this.getLocalizedLabel(this.isExcel ? 'CancelButton' : 'ClearButton') }\n }],\n created: this.dialogCreated.bind(this),\n open: this.dialogOpen.bind(this),\n cssClass: this.parent.cssClass ? this.parent.cssClass : ''\n });\n var isStringTemplate = 'isStringTemplate';\n this.dialogObj[\"\" + isStringTemplate] = true;\n this.renderResponsiveFilter(options);\n var dialogLabel = this.parent.filterSettings && this.parent.filterSettings.type === 'CheckBox' ?\n this.getLocalizedLabel('CheckBoxFilterDialogARIA') : this.getLocalizedLabel('ExcelFilterDialogARIA');\n this.dlg.setAttribute('aria-label', dialogLabel);\n if (options.isResponsiveFilter) {\n var responsiveCnt = document.querySelector('.e-responsive-dialog > .e-dlg-content > .e-mainfilterdiv');\n responsiveCnt.appendChild(this.dlg);\n }\n else {\n this.parent.element.appendChild(this.dlg);\n }\n this.dialogObj.appendTo(this.dlg);\n this.dialogObj.element.style.maxHeight = options.isResponsiveFilter ? 'none' : this.options.height + 'px';\n this.dialogObj.show();\n var content = this.dialogObj.element.querySelector('.e-dlg-content');\n content.appendChild(this.sBox);\n this.wireEvents();\n if (!isNullOrUndefined(this.parent.loadingIndicator) && this.parent.loadingIndicator.indicatorType === 'Shimmer'\n && !this.infiniteRenderMod) {\n this.parent.showMaskRow(undefined, this.dialogObj.element);\n }\n else if (this.infiniteRenderMod && this.parent.filterSettings && this.parent.filterSettings.loadingIndicator === 'Shimmer') {\n this.showMask();\n }\n else {\n if (this.infiniteRenderMod) {\n this.cBox.style.marginTop = this.getListHeight(this.cBox) + 'px';\n }\n createSpinner({ target: this.spinner, cssClass: this.parent.cssClass ? this.parent.cssClass : null }, this.parent.createElement);\n showSpinner(this.spinner);\n }\n this.getAllData();\n };\n CheckBoxFilterBase.prototype.renderResponsiveFilter = function (options) {\n if (options.isResponsiveFilter) {\n this.dialogObj.buttons = [{}];\n this.dialogObj.position = { X: '', Y: '' };\n this.dialogObj.target = document.querySelector('.e-resfilter > .e-dlg-content > .e-mainfilterdiv');\n this.dialogObj.width = '100%';\n }\n };\n CheckBoxFilterBase.prototype.dialogCreated = function (e) {\n if (this.options.isResponsiveFilter) {\n this.dialogObj.element.style.left = '0px';\n }\n else {\n if (!Browser.isDevice) {\n getFilterMenuPostion(this.options.target, this.dialogObj);\n }\n else {\n this.dialogObj.position = { X: 'center', Y: 'center' };\n }\n }\n if (this.options.column.showColumnMenu) {\n this.parent.notify(events.filterDialogCreated, e);\n }\n };\n CheckBoxFilterBase.prototype.openDialog = function (options) {\n this.updateModel(options);\n this.getAndSetChkElem(options);\n this.showDialog(options);\n };\n CheckBoxFilterBase.prototype.closeDialog = function () {\n if (this.infiniteRenderMod && this.infinitePermenantLocalData.length && !this.options.isRemote) {\n this.options.dataSource.dataSource.json = this.infinitePermenantLocalData;\n }\n if (this.dialogObj && !this.dialogObj.isDestroyed) {\n this.isBlanks = false;\n var filterTemplateCol = this.options.columns.filter(function (col) { return col.getFilterItemTemplate(); });\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var registeredTemplate = this.parent.registeredTemplate;\n if (filterTemplateCol.length && !isNullOrUndefined(registeredTemplate) && registeredTemplate.filterItemTemplate) {\n this.parent.destroyTemplate(['filterItemTemplate']);\n }\n if ((this.parent.isReact || this.parent.isVue) && this.parent.destroyTemplate !== undefined) {\n clearReactVueTemplates(this.parent, ['filterItemTemplate']);\n }\n this.parent.notify(events.filterMenuClose, { field: this.options.field });\n this.unWireEvents();\n if (this.parent.isReact && this.options.column.filter && typeof (this.options.column.filter.itemTemplate) !== 'string'\n && (this.options.column.filter.type === 'CheckBox' || this.options.column.filter.type === 'Excel')) {\n this.dialogObj.element.querySelector('.e-dlg-content').innerHTML = '';\n }\n this.dialogObj.destroy();\n if (this.dlg && this.dlg.parentElement) {\n remove(this.dlg);\n }\n this.dlg = null;\n this.parent.notify(events.filterDialogClose, {});\n }\n };\n /**\n * @param {Column} col - Defines column details\n * @returns {void}\n * @hidden\n */\n CheckBoxFilterBase.prototype.clearFilter = function (col) {\n // eslint-disable-next-line max-len\n var args = { instance: this, handler: this.clearFilter, cancel: false };\n this.parent.notify(events.fltrPrevent, args);\n if (args.cancel) {\n return;\n }\n this.options.handler({ action: 'clear-filter', field: col ? col.field : this.options.field });\n };\n CheckBoxFilterBase.prototype.btnClick = function (e) {\n if (this.filterState) {\n if ((e.target.tagName.toLowerCase() === 'input' && e.target.classList.contains('e-searchinput')) ||\n e.keyCode === 13) {\n if (!this.isCheckboxFilterTemplate) {\n this.fltrBtnHandler();\n }\n }\n else {\n var text = e.target.firstChild.textContent.toLowerCase();\n if (this.getLocalizedLabel(this.isExcel ? 'OKButton' : 'FilterButton').toLowerCase() === text) {\n if (!this.isCheckboxFilterTemplate) {\n this.fltrBtnHandler();\n }\n }\n else if (this.getLocalizedLabel('ClearButton').toLowerCase() === text) {\n this.clearFilter();\n }\n }\n this.closeDialog();\n }\n else if (e.target && e.target.firstChild &&\n e.target.firstChild.textContent.toLowerCase() === this.getLocalizedLabel('CancelButton').toLowerCase()) {\n this.closeDialog();\n }\n else if (!(e.target.tagName.toLowerCase() === 'input')) {\n this.clearFilter();\n this.closeDialog();\n }\n if (this.options.column.showColumnMenu) {\n this.parent.notify(events.afterFilterColumnMenuClose, {});\n }\n if (!isNullOrUndefined(this.parent.focusModule)) {\n this.parent.focusModule.filterfocus();\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n CheckBoxFilterBase.prototype.fltrBtnHandler = function () {\n var _this = this;\n if (this.infiniteRenderMod) {\n this.cBox.innerHTML = '';\n appendChildren(this.cBox, this.infiniteLoadedElem.slice());\n }\n var checked = [].slice.call(this.cBox.querySelectorAll('.e-check:not(.e-selectall):not(.e-add-current)'));\n var check = checked;\n var optr = 'equal';\n var ddlValue = this.dialogObj.element.querySelector('.e-dropdownlist');\n if (ddlValue) {\n this.options.operator = optr = ddlValue.ej2_instances[0].value;\n }\n this.isMenuNotEqual = this.options.operator === 'notequal';\n var searchInput;\n if (!this.options.hideSearchbox) {\n searchInput = this.searchBox.querySelector('.e-searchinput');\n }\n var caseSen = this.options.allowCaseSensitive;\n var defaults = {\n field: this.options.field, predicate: this.isMenuNotEqual ? 'and' : 'or', uid: this.options.uid,\n operator: optr, type: this.options.type, matchCase: caseSen, ignoreAccent: this.options.ignoreAccent\n };\n var isNotEqual = this.itemsCnt !== checked.length && this.itemsCnt - checked.length < checked.length;\n if (isNotEqual && searchInput && searchInput.value === '') {\n optr = this.isMenuNotEqual ? 'equal' : 'notequal';\n checked = [].slice.call(this.cBox.querySelectorAll('.e-uncheck:not(.e-selectall)'));\n defaults.predicate = this.isMenuNotEqual ? 'or' : 'and';\n defaults.operator = optr;\n }\n var value;\n var val;\n var length;\n var fObj;\n var coll = [];\n if ((checked.length !== this.itemsCnt || (searchInput && searchInput.value && searchInput.value !== ''))\n || this.infiniteRenderMod) {\n if (!this.infiniteRenderMod) {\n for (var i = 0; i < checked.length; i++) {\n value = this.values[parentsUntil(checked[parseInt(i.toString(), 10)], 'e-ftrchk').getAttribute('uid')];\n fObj = extend({}, { value: value }, defaults);\n if (value && !value.toString().length) {\n fObj.operator = isNotEqual ? 'notequal' : 'equal';\n }\n if (value === '' || isNullOrUndefined(value)) {\n coll = coll.concat(CheckBoxFilterBase.generateNullValuePredicates(defaults));\n }\n else {\n coll.push(fObj);\n }\n this.notifyFilterPrevEvent(fObj);\n }\n }\n else if (this.infiniteRenderMod) {\n this.infiniteFltrBtnHandler(coll);\n }\n if ((this.options.type === 'date' || this.options.type === 'datetime') && check.length) {\n length = check.length - 1;\n val = this.values[parentsUntil(check[parseInt(length.toString(), 10)], 'e-ftrchk').getAttribute('uid')];\n if (isNullOrUndefined(val) && isNotEqual) {\n coll.push({\n field: defaults.field, matchCase: defaults.matchCase, operator: 'equal',\n predicate: 'and', value: null\n });\n }\n }\n var addCurrSelection = this.infiniteRenderMod ? this.sBox.querySelector('.e-add-current') :\n this.cBox.querySelector('.e-add-current');\n if (addCurrSelection && addCurrSelection.classList.contains('e-check')) {\n var existingPredicate_1 = this.existingPredicate[this.options.field];\n if (existingPredicate_1) {\n var _loop_1 = function (j) {\n if (!coll.some(function (data) {\n return data\n .value === existingPredicate_1[parseInt(j.toString(), 10)].value;\n })) {\n coll.push(existingPredicate_1[parseInt(j.toString(), 10)]);\n }\n };\n for (var j = 0; j < existingPredicate_1.length; j++) {\n _loop_1(j);\n }\n }\n else {\n return;\n }\n }\n if (!this.infiniteRenderMod) {\n this.initiateFilter(coll);\n }\n else if (coll.length) {\n this.initiateFilter(coll);\n }\n else if (this.sBox.querySelector('.e-selectall').classList.contains('e-check') && !coll.length) {\n var isClearFilter = this.options.filteredColumns.some(function (value) {\n return _this.options.field === value.field;\n });\n if (isClearFilter) {\n this.clearFilter();\n }\n }\n }\n else {\n var isClearFilter = this.options.filteredColumns.some(function (value) {\n return _this.options.field === value.field;\n });\n if (isClearFilter) {\n this.clearFilter();\n }\n }\n };\n CheckBoxFilterBase.prototype.infiniteFltrBtnHandler = function (coll) {\n var value;\n if (this.infiniteManualSelectMaintainPred.length) {\n for (var i = 0; i < this.infiniteManualSelectMaintainPred.length; i++) {\n var pred = this.infiniteManualSelectMaintainPred[i];\n value = pred.value + '';\n if (value === '' || isNullOrUndefined(value)) {\n var dummyDefaults = { predicate: pred.predicate, field: pred.field, type: pred.type, uid: pred.uid, operator: pred.operator,\n matchCase: pred.matchCase, ignoreAccent: pred.ignoreAccent };\n coll.push.apply(coll, CheckBoxFilterBase.generateNullValuePredicates(dummyDefaults));\n }\n else {\n coll.push(this.infiniteManualSelectMaintainPred[i]);\n }\n this.notifyFilterPrevEvent(this.infiniteManualSelectMaintainPred[i]);\n }\n }\n if (!this.localInfiniteSelectAllClicked && this.sInput.value === '' && !(!this.options.parentCurrentViewDataCount && coll.length)) {\n for (var i = 0; i < this.infiniteUnloadParentExistPred.length; i++) {\n coll.unshift(this.infiniteUnloadParentExistPred[i]);\n this.notifyFilterPrevEvent(this.existingPredicate[this.options.field][i]);\n }\n }\n if (this.sInput.value !== '' && (!this.localInfiniteSelectAllClicked || this.infiniteLocalSelectAll)) {\n this.infiniteSearchPred['predicate'] = 'or';\n coll.unshift(this.infiniteSearchPred);\n this.notifyFilterPrevEvent(this.infiniteSearchPred);\n }\n };\n CheckBoxFilterBase.prototype.notifyFilterPrevEvent = function (predicate) {\n var args = {\n instance: this, handler: this.fltrBtnHandler, arg1: predicate.field, arg2: predicate.predicate, arg3: predicate.operator,\n arg4: predicate.matchCase, arg5: predicate.ignoreAccent, arg6: predicate.value, cancel: false\n };\n this.parent.notify(events.fltrPrevent, args);\n if (args.cancel) {\n return;\n }\n };\n // eslint-disable-next-line\n /** @hidden */\n CheckBoxFilterBase.generateNullValuePredicates = function (defaults) {\n var coll = [];\n if (defaults.type === 'string') {\n coll.push({\n field: defaults.field, ignoreAccent: defaults.ignoreAccent, matchCase: defaults.matchCase,\n operator: defaults.operator, predicate: defaults.predicate, value: ''\n });\n }\n coll.push({\n field: defaults.field,\n matchCase: defaults.matchCase, operator: defaults.operator, predicate: defaults.predicate, value: null\n });\n coll.push({\n field: defaults.field, matchCase: defaults.matchCase, operator: defaults.operator,\n predicate: defaults.predicate, value: undefined\n });\n return coll;\n };\n // eslint-disable-next-line\n /** @hidden */\n CheckBoxFilterBase.prototype.initiateFilter = function (fColl) {\n var firstVal = fColl[0];\n var predicate;\n if (!isNullOrUndefined(firstVal)) {\n predicate = firstVal.ejpredicate ? firstVal.ejpredicate :\n new Predicate(firstVal.field, firstVal.operator, firstVal.value, !firstVal.matchCase, firstVal.ignoreAccent);\n for (var j = 1; j < fColl.length; j++) {\n predicate = fColl[parseInt(j.toString(), 10)].ejpredicate !== undefined ?\n predicate[fColl[parseInt(j.toString(), 10)].predicate](fColl[parseInt(j.toString(), 10)].ejpredicate) :\n predicate[fColl[parseInt(j.toString(), 10)].predicate](fColl[parseInt(j.toString(), 10)].field, fColl[parseInt(j.toString(), 10)].operator, fColl[parseInt(j.toString(), 10)].value, !fColl[parseInt(j.toString(), 10)].matchCase, fColl[parseInt(j.toString(), 10)].ignoreAccent);\n }\n var args = {\n action: 'filtering', filterCollection: fColl, field: this.options.field,\n ejpredicate: Predicate.or(predicate)\n };\n this.options.handler(args);\n }\n };\n CheckBoxFilterBase.prototype.isForeignColumn = function (col) {\n return col.isForeignColumn ? col.isForeignColumn() : false;\n };\n CheckBoxFilterBase.prototype.refreshCheckboxes = function () {\n var _this = this;\n var val = this.sInput.value;\n var column = this.options.column;\n var query = this.isForeignColumn(column) ? this.foreignKeyQuery.clone() : this.options.query.clone();\n var foreignQuery = this.options.query.clone();\n var pred = query.queries.filter(function (e) { return e && e.fn === 'onWhere'; })[0];\n query.queries = [];\n foreignQuery.queries = [];\n var parsed = (this.options.type !== 'string' && parseFloat(val)) ? parseFloat(val) : val;\n var operator = this.options.isRemote ?\n (this.options.type === 'string' ? 'contains' : 'equal') : (this.options.type ? 'contains' : 'equal');\n var matchCase = true;\n var ignoreAccent = this.options.ignoreAccent;\n var field = this.isForeignColumn(column) ? column.foreignKeyValue : column.field;\n parsed = (parsed === '' || parsed === undefined) ? undefined : parsed;\n var coll = [];\n var defaults = {\n field: field, predicate: 'or', uid: this.options.uid,\n operator: 'equal', type: this.options.type, matchCase: matchCase, ignoreAccent: ignoreAccent\n };\n var predicte;\n var moduleName = this.options.dataManager.adaptor.getModuleName;\n if (this.options.type === 'boolean') {\n if (parsed !== undefined &&\n this.getLocalizedLabel('FilterTrue').toLowerCase().indexOf(parsed.toLowerCase()) !== -1) {\n parsed = 'true';\n }\n else if (parsed !== undefined &&\n this.getLocalizedLabel('FilterFalse').toLowerCase().indexOf(parsed.toLowerCase()) !== -1) {\n parsed = 'false';\n }\n if (parsed !== undefined &&\n this.getLocalizedLabel('FilterTrue').toLowerCase().indexOf(parsed.toLowerCase()) !== -1 && moduleName) {\n // eslint-disable-next-line no-constant-condition\n parsed = (moduleName() === 'ODataAdaptor' || 'ODataV4Adaptor') ? true : 'true';\n }\n else if (parsed !== undefined &&\n this.getLocalizedLabel('FilterFalse').toLowerCase().indexOf(parsed.toLowerCase()) !== -1 && moduleName) {\n // eslint-disable-next-line no-constant-condition\n parsed = (moduleName() === 'ODataAdaptor' || 'ODataV4Adaptor') ? false : 'false';\n }\n operator = 'equal';\n }\n if ((this.options.type === 'date' || this.options.type === 'datetime' || this.options.type === 'dateonly') && this.options.format) {\n var intl = new Internationalization();\n var format = typeof (this.options.format) === 'string' ? this.options.format :\n this.options.format.format;\n if (format) {\n parsed = intl.parseDate(val, { format: format }) || new Date(val);\n }\n else {\n parsed = new Date(val);\n }\n if (this.options.type === 'dateonly') {\n parsed = parsed.getFullYear() + '-' + padZero(parsed.getMonth() + 1) + '-' + padZero(parsed.getDate());\n }\n }\n this.infiniteSearchValChange = true;\n this.infiniteLoadedElem = [];\n this.infiniteLocalSelectAll = true;\n this.localInfiniteSelectAllClicked = false;\n this.localInfiniteSelectionInteracted = false;\n this.infiniteSkipCnt = 0;\n this.infiniteDataCount = 0;\n this.infiniteManualSelectMaintainPred = [];\n if (this.sInput.value === '') {\n this.infiniteUnloadParentExistPred = this.infiniteRenderMod && this.existingPredicate[this.options.column.field] ? this.existingPredicate[this.options.column.field].slice() : [];\n }\n else {\n this.infiniteUnloadParentExistPred = [];\n }\n this.addDistinct(query);\n var args = {\n requestType: events.filterSearchBegin,\n filterModel: this, columnName: field, column: column,\n operator: operator, matchCase: matchCase, ignoreAccent: ignoreAccent, filterChoiceCount: null,\n query: query, value: parsed\n };\n if (this.infiniteRenderMod && this.parent.filterSettings.itemsCount) {\n args.filterChoiceCount = this.parent.filterSettings.itemsCount;\n }\n this.parent.trigger(events.actionBegin, args, function (filterargs) {\n // eslint-disable-next-line no-self-assign\n filterargs.operator = filterargs.operator;\n predicte = new Predicate(field, filterargs.operator, args.value, filterargs.matchCase, filterargs.ignoreAccent);\n if (_this.options.type === 'date' || _this.options.type === 'datetime' || _this.options.type === 'dateonly') {\n operator = 'equal';\n var filterObj = {\n field: field, operator: operator, value: parsed, matchCase: matchCase,\n ignoreAccent: ignoreAccent\n };\n if (!isNullOrUndefined(parsed)) {\n predicte = getDatePredicate(filterObj, _this.options.type);\n }\n }\n if (val && typeof val === 'string' && _this.isBlanks &&\n _this.getLocalizedLabel('Blanks').toLowerCase().indexOf(val.toLowerCase()) >= 0) {\n coll = coll.concat(CheckBoxFilterBase.generateNullValuePredicates(defaults));\n var emptyValPredicte = CheckBoxFilterBase.generatePredicate(coll);\n emptyValPredicte.predicates.push(predicte);\n predicte = emptyValPredicte;\n query.where(emptyValPredicte);\n }\n else if (val.length) {\n predicte = !isNullOrUndefined(pred) ? predicte.and(pred.e) : predicte;\n query.where(predicte);\n }\n else if (!isNullOrUndefined(pred)) {\n predicte = pred.e;\n query.where(pred.e);\n }\n _this.infiniteSearchPred = predicte;\n filterargs.filterChoiceCount = !isNullOrUndefined(filterargs.filterChoiceCount) ? filterargs.filterChoiceCount : 1000;\n if (_this.infiniteRenderMod && _this.parent.filterSettings.itemsCount !== filterargs.filterChoiceCount) {\n _this.parent.filterSettings.itemsCount = args.filterChoiceCount;\n }\n var fPredicate = {};\n showSpinner(_this.spinner);\n _this.renderEmpty = false;\n if (_this.isForeignColumn(column) && val.length) {\n var colData = ('result' in column.dataSource) ? new DataManager(column.dataSource.result) :\n column.dataSource;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n colData.executeQuery(query).then(function (e) {\n var columnData = _this.options.column.columnData;\n _this.options.column.columnData = e.result;\n _this.parent.notify(events.generateQuery, { predicate: fPredicate, column: column });\n if (fPredicate.predicate.predicates.length) {\n foreignQuery.where(fPredicate.predicate);\n }\n else {\n _this.renderEmpty = true;\n }\n _this.options.column.columnData = columnData;\n if (_this.infiniteRenderMod) {\n _this.infiniteInitialLoad = isNullOrUndefined(_this.fullData) ? true : false;\n _this.makeInfiniteScrollRequest(foreignQuery);\n foreignQuery.requiresCount();\n }\n else {\n foreignQuery.take(filterargs.filterChoiceCount);\n }\n _this.search(filterargs, foreignQuery);\n });\n }\n else {\n if (_this.infiniteRenderMod && _this.parent.filterSettings.itemsCount) {\n _this.infiniteInitialLoad = isNullOrUndefined(_this.fullData) ? true : false;\n _this.makeInfiniteScrollRequest(query);\n query.requiresCount();\n }\n else {\n query.take(filterargs.filterChoiceCount);\n }\n _this.search(filterargs, query);\n }\n });\n };\n CheckBoxFilterBase.prototype.search = function (args, query) {\n if (this.parent.dataSource && 'result' in this.parent.dataSource) {\n this.filterEvent(args, query);\n }\n else {\n this.processSearch(query);\n }\n };\n CheckBoxFilterBase.prototype.getPredicateFromCols = function (columns, isExecuteLocal) {\n var predicates = CheckBoxFilterBase.getPredicate(columns, isExecuteLocal);\n var predicateList = [];\n var fPredicate = {};\n var isGrid = this.parent.getForeignKeyColumns !== undefined;\n var foreignColumn = isGrid ? this.parent.getForeignKeyColumns() : [];\n for (var _i = 0, _a = Object.keys(predicates); _i < _a.length; _i++) {\n var prop = _a[_i];\n var col = void 0;\n if (isGrid && !this.parent.getColumnByField(prop)) {\n col = getColumnByForeignKeyValue(prop, foreignColumn);\n }\n if (col) {\n this.parent.notify(events.generateQuery, { predicate: fPredicate, column: col });\n if (fPredicate.predicate.predicates.length) {\n predicateList.push(Predicate.or(fPredicate.predicate.predicates));\n }\n }\n else {\n predicateList.push(predicates[\"\" + prop]);\n }\n }\n return predicateList.length && Predicate.and(predicateList);\n };\n CheckBoxFilterBase.prototype.getQuery = function () {\n return this.parent.getQuery ? this.parent.getQuery().clone() : new Query();\n };\n CheckBoxFilterBase.prototype.getAllData = function () {\n var _this = this;\n this.customQuery = false;\n var query = this.getQuery();\n query.requiresCount(); //consider take query\n this.addDistinct(query);\n var args = {\n requestType: events.filterChoiceRequest, query: query, filterChoiceCount: null\n };\n var filterModel = 'filterModel';\n args[\"\" + filterModel] = this;\n if (this.infiniteRenderMod && this.parent.filterSettings.itemsCount) {\n args.filterChoiceCount = this.parent.filterSettings.itemsCount;\n }\n this.parent.trigger(events.actionBegin, args, function (args) {\n args.filterChoiceCount = !isNullOrUndefined(args.filterChoiceCount) ? args.filterChoiceCount : 1000;\n if (_this.infiniteRenderMod && _this.parent.filterSettings.itemsCount !== args.filterChoiceCount) {\n _this.parent.filterSettings.itemsCount = args.filterChoiceCount;\n }\n if (!_this.infiniteRenderMod) {\n query.take(args.filterChoiceCount);\n }\n if (!args.query.distincts.length || _this.infiniteRenderMod) {\n _this.customQuery = true;\n _this.queryGenerate(query);\n }\n if (_this.infiniteRenderMod) {\n _this.infiniteInitialLoad = isNullOrUndefined(_this.fullData) ? true : false;\n _this.makeInfiniteScrollRequest(query);\n }\n if (_this.parent.dataSource && 'result' in _this.parent.dataSource) {\n _this.filterEvent(args, query);\n }\n else {\n _this.processDataOperation(query, true);\n }\n });\n };\n CheckBoxFilterBase.prototype.addDistinct = function (query) {\n var _this = this;\n var _a;\n var filteredColumn = DataUtil.distinct(this.options.filteredColumns, 'field');\n if (filteredColumn.indexOf(this.options.column.field) <= -1) {\n filteredColumn = filteredColumn.concat(this.options.column.field);\n }\n if (!this.infiniteRenderMod) {\n query.distinct(filteredColumn);\n }\n if (this.infiniteRenderMod && !this.options.isRemote && this.sInput.value === '') {\n this.options.dataSource = this.options.dataSource instanceof DataManager ?\n this.options.dataSource : new DataManager(this.options.dataSource);\n this.infinitePermenantLocalData = this.options.dataSource.dataSource.json.slice();\n this.options.dataSource.dataSource.json = DataUtil.distinct((_a = this.options.parentFilteredLocalRecords).concat.apply(_a, this.infinitePermenantLocalData), this.options.column.field, true);\n if (this.isForeignColumn(this.options.column)) {\n this.options.column.dataSource = this.options.column.dataSource instanceof DataManager ?\n this.options.column.dataSource : new DataManager(this.options.column.dataSource);\n this.options.dataSource.dataSource.json = this.options.dataSource.dataSource.json.map(function (item, i) {\n return Object.assign({}, item, _this.options.column.dataSource.dataSource.json[i]);\n });\n }\n }\n else if (this.infiniteRenderMod && this.options.isRemote) {\n query.select(this.options.column.field);\n query.sortBy(this.options.column.field, 'ascending');\n var moduleName = this.options.dataManager.adaptor.getModuleName;\n if (moduleName && moduleName() && (moduleName() === 'ODataV4Adaptor' || moduleName() === 'WebApiAdaptor'\n || moduleName() === 'CustomDataAdaptor' || moduleName() === 'GraphQLAdaptor' || moduleName() === 'ODataAdaptor')) {\n query.distinct(filteredColumn);\n }\n }\n return query;\n };\n CheckBoxFilterBase.prototype.filterEvent = function (args, query) {\n var _this = this;\n var defObj = eventPromise(args, query);\n this.parent.trigger(events.dataStateChange, defObj.state);\n var def = defObj.deffered;\n def.promise.then(function (e) {\n _this.dataSuccess(e);\n });\n };\n CheckBoxFilterBase.prototype.infiniteScrollMouseKeyDownHandler = function () {\n EventHandler.remove(this.cBox, 'scroll', this.infiniteScrollHandler);\n };\n CheckBoxFilterBase.prototype.infiniteScrollMouseKeyUpHandler = function (e) {\n var _this = this;\n EventHandler.add(this.cBox, 'scroll', this.infiniteScrollHandler, this);\n var target = this.cBox;\n if (target.children.length > 1 && (target.scrollTop >= target.scrollHeight - target.offsetHeight || target.scrollTop <= 0)) {\n this.infiniteScrollHandler();\n }\n Global.timer = setTimeout(function () { _this.clickHandler(e); Global.timer = null; }, 0);\n };\n CheckBoxFilterBase.prototype.getListHeight = function (element) {\n var listDiv = createElement('div', { className: 'e-ftrchk', styles: 'visibility: hidden' });\n listDiv.innerHTML = '
    A
    ';\n element.appendChild(listDiv);\n var rect = listDiv.getBoundingClientRect();\n element.removeChild(listDiv);\n var listHeight = Math.round(rect.height);\n return listHeight;\n };\n CheckBoxFilterBase.prototype.getShimmerTemplate = function () {\n return '';\n };\n CheckBoxFilterBase.prototype.showMask = function () {\n var maskRowCount = 5;\n var maskItemHeight;\n var maskList = this.parent.createElement('div', { id: this.id + this.options.type + '_CheckBoxMaskList',\n className: 'e-checkboxlist e-fields e-infinite-list e-masklist', styles: 'z-index: 10;' });\n var wrapperElem = this.cBox;\n this.removeMask();\n if (wrapperElem) {\n var computedStyle = getComputedStyle(wrapperElem);\n var height = wrapperElem.children.length ? parseInt(computedStyle.height, 10) :\n Math.floor(parseInt(computedStyle.height.split('px')[0], 10)) - 5;\n var backgroundColor = this.isExcel && !wrapperElem.children.length && !this.dlg.classList.contains('e-excelfilter') ?\n '' : getComputedStyle(this.dlg.querySelector('.e-dlg-content')).backgroundColor;\n maskList.style.cssText = 'width: ' + computedStyle.width + '; min-height: ' + computedStyle.minHeight + '; height: ' +\n height + 'px; margin: ' + computedStyle.margin + '; border-style: ' + computedStyle.borderStyle + '; border-width: '\n + computedStyle.borderWidth + '; border-color: ' + computedStyle.borderColor + '; position: absolute; background-color: ' +\n backgroundColor + ';';\n var liHeight = this.getListHeight(wrapperElem);\n maskRowCount = Math.floor(height / liHeight);\n maskRowCount = wrapperElem.children.length > maskRowCount ? wrapperElem.children.length : maskRowCount;\n maskItemHeight = liHeight + 'px';\n }\n var maskTemplate = '
    '\n + '
    '\n + this.getShimmerTemplate() + this.getShimmerTemplate() + '
    ';\n maskList.innerHTML = '';\n if (!wrapperElem.children.length) {\n this.spinner.insertAdjacentHTML('beforebegin', maskTemplate);\n var maskSpan = [].slice.call(this.spinner.parentElement\n .querySelectorAll('.e-mask:not(.e-mask-checkbox-filter-intent):not(.e-mask-checkbox-filter-span-intent)'));\n maskSpan[0].classList.add('e-mask-checkbox-filter-intent');\n maskSpan[1].classList.add('e-mask-checkbox-filter-span-intent');\n }\n this.spinner.insertBefore(maskList, this.cBox);\n for (var i = 0; maskRowCount && i < maskRowCount; i++) {\n maskList.innerHTML += maskTemplate;\n var maskSpan = [].slice.call(maskList\n .querySelectorAll('.e-mask:not(.e-mask-checkbox-filter-intent):not(.e-mask-checkbox-filter-span-intent)'));\n maskSpan[0].classList.add('e-mask-checkbox-filter-intent');\n maskSpan[1].classList.add('e-mask-checkbox-filter-span-intent');\n }\n if (this.cBox) {\n maskList.scrollTop = this.cBox.scrollTop;\n }\n };\n CheckBoxFilterBase.prototype.removeMask = function () {\n var maskLists = this.dialogObj.element.querySelectorAll('.e-mask-ftrchk');\n if (maskLists.length) {\n for (var i = 0; i < maskLists.length; i++) {\n remove(maskLists[i]);\n }\n }\n var maskParent = this.dialogObj.element.querySelector('.e-checkboxlist.e-masklist');\n if (maskParent) {\n remove(this.dialogObj.element.querySelector('.e-checkboxlist.e-masklist'));\n }\n };\n CheckBoxFilterBase.prototype.infiniteScrollHandler = function () {\n var target = this.cBox;\n if (target.scrollTop >= target.scrollHeight - target.offsetHeight && !this.infiniteQueryExecutionPending\n && this.infiniteLoadedElem.length <= (this.infiniteSkipCnt + this.parent.filterSettings.itemsCount)\n && this.cBox.children.length === this.parent.filterSettings.itemsCount * 3\n && (!this.infiniteDataCount || this.infiniteDataCount > (this.infiniteSkipCnt + this.parent.filterSettings.itemsCount))) {\n this.makeInfiniteScrollRequest();\n this.prevInfiniteScrollDirection = 'down';\n }\n else if (target.scrollTop >= target.scrollHeight - target.offsetHeight && !this.infiniteQueryExecutionPending\n && this.infiniteLoadedElem.length > (this.infiniteSkipCnt + this.parent.filterSettings.itemsCount)\n && this.cBox.children.length === this.parent.filterSettings.itemsCount * 3) {\n this.infiniteRemoveElements(([].slice.call(this.cBox.children)).splice(0, this.parent.filterSettings.itemsCount));\n this.infiniteSkipCnt += this.prevInfiniteScrollDirection === 'down' ? this.parent.filterSettings.itemsCount :\n (this.parent.filterSettings.itemsCount * 3);\n appendChildren(this.cBox, this.infiniteLoadedElem.slice(this.infiniteSkipCnt, this.parent.filterSettings.itemsCount +\n this.infiniteSkipCnt));\n this.prevInfiniteScrollDirection = 'down';\n }\n else if (target.scrollTop === 0 && !this.infiniteInitialLoad && !this.infiniteSearchValChange && this.infiniteSkipCnt\n && this.infiniteLoadedElem.length && this.infiniteLoadedElem.length > this.parent.filterSettings.itemsCount * 3\n && this.cBox.children.length === this.parent.filterSettings.itemsCount * 3) {\n this.infiniteRemoveElements(([].slice.call(this.cBox.children)).splice((this.parent.filterSettings\n .itemsCount * 2), this.parent.filterSettings.itemsCount));\n this.infiniteSkipCnt -= this.prevInfiniteScrollDirection === 'up' ? this.parent.filterSettings.itemsCount :\n (this.parent.filterSettings.itemsCount * 3);\n this.infiniteAppendElements([].slice.call(this.infiniteLoadedElem.slice(this.infiniteSkipCnt, this.infiniteSkipCnt +\n this.parent.filterSettings.itemsCount)));\n this.cBox.scrollTop = this.infiniteScrollAppendDiff;\n this.prevInfiniteScrollDirection = 'up';\n }\n else if (target.scrollTop === 0 && !this.infiniteInitialLoad && !this.infiniteSearchValChange && this.infiniteSkipCnt\n && this.infiniteLoadedElem.length && this.cBox.children.length < this.parent.filterSettings.itemsCount * 3) {\n this.infiniteRemoveElements(([].slice.call(this.cBox.children)).splice((this.parent.filterSettings\n .itemsCount * 2), this.infiniteDataCount % this.parent.filterSettings.itemsCount));\n this.infiniteSkipCnt = (Math.floor(this.infiniteDataCount / this.parent.filterSettings.itemsCount) - 3) *\n this.parent.filterSettings.itemsCount;\n this.infiniteAppendElements([].slice.call(this.infiniteLoadedElem.slice(this.infiniteSkipCnt, this.infiniteSkipCnt +\n this.parent.filterSettings.itemsCount)));\n this.cBox.scrollTop = this.infiniteScrollAppendDiff;\n this.prevInfiniteScrollDirection = 'up';\n }\n };\n CheckBoxFilterBase.prototype.infiniteRemoveElements = function (removeElem) {\n for (var i = 0; i < removeElem.length; i++) {\n remove(removeElem[i]);\n }\n };\n CheckBoxFilterBase.prototype.infiniteAppendElements = function (appendElem) {\n for (var i = 0; i < appendElem.length; i++) {\n this.cBox.insertBefore(appendElem[i], this.cBox.children[i]);\n }\n };\n CheckBoxFilterBase.prototype.makeInfiniteScrollRequest = function (query) {\n var _this = this;\n if (!this.infiniteInitialLoad && this.parent.filterSettings && this.parent.filterSettings.loadingIndicator === 'Shimmer') {\n setTimeout(function () {\n if (_this.infiniteQueryExecutionPending) {\n _this.showMask();\n }\n }, 500);\n }\n else if (!this.infiniteInitialLoad) {\n createSpinner({ target: this.spinner, cssClass: this.parent.cssClass ? this.parent.cssClass : null }, this.parent\n .createElement);\n showSpinner(this.spinner);\n }\n var fName = 'fn';\n if (this.infiniteQuery && this.infiniteQuery.queries && this.infiniteQuery.queries.length) {\n for (var i = 0; i < this.infiniteQuery.queries.length; i++) {\n if (this.infiniteQuery.queries[i][\"\" + fName] === 'onTake'\n || this.infiniteQuery.queries[i][\"\" + fName] === 'onSkip') {\n this.infiniteQuery.queries.splice(i, 1);\n i--;\n }\n }\n }\n var existQuery = query ? true : false;\n query = query ? query : this.infiniteQuery;\n if (this.infiniteInitialLoad || this.infiniteSearchValChange) {\n this.infiniteSkipCnt = 0;\n }\n else {\n this.infiniteSkipCnt += this.parent.filterSettings.itemsCount;\n }\n query.skip(this.infiniteSkipCnt);\n if (this.infiniteInitialLoad || this.infiniteSearchValChange) {\n query.take(this.parent.filterSettings.itemsCount * 3);\n this.infiniteSkipCnt += this.parent.filterSettings.itemsCount * 2;\n }\n else {\n query.take(this.parent.filterSettings.itemsCount);\n }\n if (!existQuery) {\n this.processDataOperation(query);\n this.infiniteQueryExecutionPending = true;\n }\n };\n CheckBoxFilterBase.prototype.processDataOperation = function (query, isInitial) {\n var _this = this;\n this.options.dataSource = this.options.dataSource instanceof DataManager ?\n this.options.dataSource : new DataManager(this.options.dataSource);\n var allPromise = [];\n var runArray = [];\n if (this.isForeignColumn(this.options.column) && isInitial) {\n var colData = ('result' in this.options.column.dataSource) ?\n new DataManager(this.options.column.dataSource.result) :\n this.options.column.dataSource;\n this.foreignKeyQuery.params = query.params;\n allPromise.push(colData.executeQuery(this.foreignKeyQuery));\n runArray.push(function (data) { return _this.foreignKeyData = data; });\n }\n if (this.infiniteRenderMod) {\n this.infiniteQuery = query.clone();\n if (this.infiniteInitialLoad) {\n this.cBox.classList.add('e-checkbox-infinitescroll');\n EventHandler.add(this.cBox, 'scroll', this.infiniteScrollHandler, this);\n EventHandler.add(this.cBox, 'mouseup', this.infiniteScrollMouseKeyUpHandler, this);\n EventHandler.add(this.cBox, 'mousedown', this.infiniteScrollMouseKeyDownHandler, this);\n }\n else if (this.infiniteSearchValChange) {\n this.cBox.innerHTML = '';\n }\n }\n if (this.infiniteRenderMod && this.infiniteInitialLoad && !this.options.isRemote) {\n var field = this.isForeignColumn(this.options.column) ? this.options.foreignKeyValue :\n this.options.column.field;\n this.options.dataSource.executeQuery(new Query().sortBy(field, DataUtil.fnAscending)).then(function (e) {\n _this.options.dataSource.dataSource.json = e.result;\n _this.executeQueryOperations(query, allPromise, runArray);\n });\n }\n else {\n this.executeQueryOperations(query, allPromise, runArray);\n }\n };\n CheckBoxFilterBase.prototype.executeQueryOperations = function (query, allPromise, runArray) {\n var _this = this;\n allPromise.push(this.options.dataSource.executeQuery(query));\n runArray.push(this.dataSuccess.bind(this));\n var i = 0;\n Promise.all(allPromise).then(function (e) {\n _this.infiniteQueryExecutionPending = _this.infiniteRenderMod ? false : _this.infiniteQueryExecutionPending;\n for (var j = 0; j < e.length; j++) {\n _this.infiniteDataCount = _this.infiniteRenderMod && !_this.infiniteDataCount ? e[j].count : _this.infiniteDataCount;\n runArray[i++](e[parseInt(j.toString(), 10)].result);\n }\n }).catch(function () {\n if (_this.infiniteRenderMod && _this.parent.filterSettings && _this.parent.filterSettings.loadingIndicator === 'Shimmer') {\n _this.parent.showMaskRow(undefined, _this.dialogObj.element);\n }\n });\n };\n CheckBoxFilterBase.prototype.dataSuccess = function (e) {\n if (!this.infiniteInitialLoad && this.infiniteDataCount && ((this.infiniteSkipCnt >= this.infiniteDataCount\n && !this.infiniteSearchValChange) || (e.length === 0))) {\n return;\n }\n this.fullData = e;\n var args1 = { dataSource: this.fullData, executeQuery: true, field: this.options.field };\n this.parent.notify(events.beforeCheckboxRenderer, args1);\n if (args1.executeQuery) {\n var query = new Query();\n if (!this.customQuery) {\n this.isExecuteLocal = true;\n this.queryGenerate(query);\n this.isExecuteLocal = false;\n }\n // query.select(this.options.field);\n var result = new DataManager(args1.dataSource).executeLocal(query);\n var col = this.options.column;\n this.filteredData = CheckBoxFilterBase.getDistinct(result, this.options.field, col, this.foreignKeyData, this).records || [];\n }\n var data = args1.executeQuery ? this.filteredData : args1.dataSource;\n this.processDataSource(null, true, data, args1);\n if (this.sInput && ((this.infiniteRenderMod && this.infiniteInitialLoad) || !this.infiniteRenderMod)) {\n this.sInput.focus();\n }\n if (this.infiniteInitialLoad || this.infiniteSearchValChange) {\n this.infiniteInitialLoad = false;\n this.infiniteSearchValChange = false;\n }\n var args = {\n requestType: events.filterAfterOpen,\n columnName: this.options.field, columnType: this.options.type\n };\n var filterModel = 'filterModel';\n args[\"\" + filterModel] = this;\n this.parent.notify(events.cBoxFltrComplete, args);\n if (this.isCheckboxFilterTemplate) {\n hideSpinner(this.spinner);\n }\n };\n CheckBoxFilterBase.prototype.queryGenerate = function (query) {\n if (this.parent.searchSettings && this.parent.searchSettings.key.length) {\n var moduleName = this.options.dataManager.adaptor.getModuleName;\n if (!isNullOrUndefined(this.parent.getDataModule) && moduleName && moduleName() === 'ODataV4Adaptor') {\n this.parent.getDataModule().searchQuery(query);\n }\n else {\n var searchSettings = this.parent.searchSettings;\n var fields = searchSettings.fields.length ? searchSettings.fields\n : this.options.columns.map(function (f) { return f.field; });\n query.search(searchSettings.key, fields, searchSettings.operator, searchSettings.ignoreCase, searchSettings.ignoreAccent);\n }\n }\n if ((this.options.filteredColumns.length)) {\n var cols = [];\n for (var i = 0; i < this.options.filteredColumns.length; i++) {\n var filterColumn = this.options.filteredColumns[parseInt(i.toString(), 10)];\n if (this.options.uid) {\n filterColumn.uid = filterColumn.uid || this.parent.getColumnByField(filterColumn.field).uid;\n if (filterColumn.uid !== this.options.uid) {\n cols.push(this.options.filteredColumns[parseInt(i.toString(), 10)]);\n }\n }\n else {\n if (filterColumn.field !== this.options.field) {\n cols.push(this.options.filteredColumns[parseInt(i.toString(), 10)]);\n }\n }\n }\n var predicate = this.getPredicateFromCols(cols, this.isExecuteLocal);\n if (predicate) {\n query.where(predicate);\n }\n }\n };\n CheckBoxFilterBase.prototype.processDataSource = function (query, isInitial, dataSource, args) {\n showSpinner(this.spinner);\n // query = query ? query : this.options.query.clone();\n // query.requiresCount();\n // let result: Object = new DataManager(dataSource as JSON[]).executeLocal(query);\n // let res: { result: Object[] } = result as { result: Object[] };\n this.isExecuteLocal = true;\n this.updateResult();\n this.isExecuteLocal = false;\n var args1 = { dataSource: this.fullData, isCheckboxFilterTemplate: false, column: this.options.column,\n element: this.cBox, type: this.options.type, format: this.options.type, btnObj: this.options.isResponsiveFilter ? null :\n this.dialogObj.btnObj[0], searchBox: this.searchBox };\n this.parent.notify(events.beforeCheckboxfilterRenderer, args1);\n this.isCheckboxFilterTemplate = args1.isCheckboxFilterTemplate;\n if (!this.isCheckboxFilterTemplate) {\n this.createFilterItems(dataSource, isInitial, args);\n }\n else if (this.infiniteRenderMod && this.parent.filterSettings && this.parent.filterSettings.loadingIndicator === 'Shimmer') {\n this.removeMask();\n }\n };\n CheckBoxFilterBase.prototype.processSearch = function (query) {\n this.processDataOperation(query);\n };\n CheckBoxFilterBase.prototype.updateResult = function () {\n this.result = {};\n var predicate = this.infiniteRenderMod && this.existingPredicate[this.options.field] ?\n this.getPredicateFromCols(this.existingPredicate[this.options.field], this.isExecuteLocal) :\n this.getPredicateFromCols(this.options.filteredColumns, this.isExecuteLocal);\n var query = new Query();\n if (predicate) {\n query.where(predicate);\n }\n this.parent.notify(events.beforeCheckboxRendererQuery, { query: query });\n var result = new DataManager(this.fullData).executeLocal(query);\n for (var _i = 0, result_1 = result; _i < result_1.length; _i++) {\n var res = result_1[_i];\n this.result[getObject(this.options.field, res)] = true;\n }\n };\n CheckBoxFilterBase.prototype.clickHandler = function (e) {\n var _a;\n if (!isNullOrUndefined(Global.timer)) {\n clearTimeout(Global.timer);\n }\n var target = e.target;\n if (!isNullOrUndefined(this.parent.loadingIndicator) && this.parent.loadingIndicator.indicatorType === 'Shimmer'\n && parentsUntil(target, 'e-mask-ftrchk')) {\n return;\n }\n var elem = parentsUntil(target, 'e-checkbox-wrapper');\n if (parentsUntil(target, 'e-searchbox')) {\n this.searchBoxClick(e);\n }\n if (elem && !this.isCheckboxFilterTemplate) {\n var selectAll = elem.querySelector('.e-selectall');\n if (selectAll) {\n this.updateAllCBoxes(!selectAll.classList.contains('e-check'));\n }\n else {\n toogleCheckbox(elem.parentElement);\n if (this.infiniteRenderMod && !elem.parentElement.querySelector('.e-add-current')) {\n this.localInfiniteSelectionInteracted = true;\n var caseSen = this.options.allowCaseSensitive;\n var span = elem.parentElement.querySelector('.e-frame');\n var input = span.previousSibling;\n var optr = input.checked ? 'equal' : 'notequal';\n var pred = input.checked ? 'or' : 'and';\n var defaults = { field: this.options.field, predicate: pred, uid: this.options.uid,\n operator: optr, type: this.options.type, matchCase: caseSen, ignoreAccent: this.options.ignoreAccent\n };\n var value = this.values[parentsUntil(input, 'e-ftrchk').getAttribute('uid')];\n this.updateInfiniteManualSelectPred(defaults, value);\n if (this.infiniteRenderMod && !this.options.isRemote && this.options.parentTotalDataCount\n && this.infiniteUnloadParentExistPred.length) {\n var predicate = this.getPredicateFromCols((_a = this.options.filteredColumns).concat.apply(_a, this.infiniteManualSelectMaintainPred), true);\n var query = new Query();\n if (predicate) {\n query.where(predicate);\n }\n var result = new DataManager(this.infinitePermenantLocalData).executeLocal(query);\n if (this.options.parentTotalDataCount !== result.length) {\n this.options.parentTotalDataCount = result.length;\n }\n if (!this.options.parentTotalDataCount && this.infiniteUnloadParentExistPred.length) {\n this.infiniteUnloadParentExistPred = [];\n }\n }\n if (this.infiniteUnloadParentExistPred.length && (this.options.parentTotalDataCount === this.infiniteDataCount\n || !this.options.parentTotalDataCount)) {\n this.infiniteUnloadParentExistPred = [];\n }\n }\n }\n this.updateIndeterminatenBtn();\n elem.querySelector('.e-chk-hidden').focus();\n }\n this.setFocus(parentsUntil(elem, 'e-ftrchk'));\n };\n CheckBoxFilterBase.prototype.updateInfiniteManualSelectPred = function (defaults, value) {\n for (var i = 0; i < this.infiniteManualSelectMaintainPred.length; i++) {\n var predmdl = this.infiniteManualSelectMaintainPred[i];\n if (predmdl.value + '' === value + '' && (predmdl.operator === 'equal' || predmdl.operator === 'notequal')) {\n this.infiniteManualSelectMaintainPred.splice(i, 1);\n break;\n }\n }\n if ((defaults.predicate === 'or' && (!this.localInfiniteSelectAllClicked || !this.infiniteLocalSelectAll))\n || (defaults.predicate === 'and' && (!this.localInfiniteSelectAllClicked || this.infiniteLocalSelectAll))) {\n this.infiniteManualSelectMaintainPred.push(extend({}, { value: value }, defaults));\n if (defaults.predicate === 'or') {\n this.options.parentTotalDataCount++;\n }\n else {\n this.options.parentTotalDataCount--;\n }\n }\n };\n /**\n * Method to set the next target element on keyboard navigation using arrow keys.\n *\n * @param {KeyboardEventArgs} e - Defines the Keyboard event argument\n * @param {HTMLElement[]} focusableElements - Defines the Focusable elements\n * @returns {void}\n */\n CheckBoxFilterBase.prototype.focusNextOrPrev = function (e, focusableElements) {\n var nextIndex = (e.key === 'ArrowUp') ? focusableElements.indexOf(document.activeElement) - 1\n : focusableElements.indexOf(document.activeElement) + 1;\n var nextElement = focusableElements[((nextIndex + focusableElements.length) % focusableElements.length)];\n // Set focus on the next / previous element\n if (nextElement) {\n nextElement.focus();\n var target = nextElement.classList.contains('e-chk-hidden') ? parentsUntil(nextElement, 'e-ftrchk') : nextElement;\n this.setFocus(target);\n }\n };\n CheckBoxFilterBase.prototype.keyupHandler = function (e) {\n if ((e.key === 'Tab' && e.shiftKey) || e.key === 'Tab' || ((e.key === 'ArrowUp' || e.key === 'ArrowDown') && !e.altKey)) {\n this.setFocus(parentsUntil(e.target, 'e-ftrchk'));\n }\n if ((e.key === 'ArrowUp' || e.key === 'ArrowDown') && !e.altKey && this.parent.filterSettings.type === 'CheckBox') {\n e.preventDefault();\n var focusableElements = Array.from(this.dlg.querySelectorAll('input, button, [tabindex]:not([tabindex=\"-1\"])'));\n this.focusNextOrPrev(e, focusableElements);\n }\n };\n CheckBoxFilterBase.prototype.setFocus = function (elem) {\n var prevElem = this.dlg.querySelector('.e-chkfocus');\n if (prevElem) {\n prevElem.classList.remove('e-chkfocus');\n }\n if (elem && elem !== prevElem) {\n elem.classList.add('e-chkfocus');\n }\n };\n CheckBoxFilterBase.prototype.updateAllCBoxes = function (checked) {\n if (this.infiniteRenderMod) {\n this.localInfiniteSelectAllClicked = true;\n this.infiniteLocalSelectAll = checked;\n this.infiniteUnloadParentExistPred = [];\n this.infiniteManualSelectMaintainPred = [];\n }\n var cBoxes = this.infiniteRenderMod ?\n this.infiniteLoadedElem.map(function (arr) {\n return arr.querySelector('.e-frame');\n }) : [].slice.call(this.cBox.querySelectorAll('.e-frame:not(.e-add-current)'));\n for (var _i = 0, cBoxes_1 = cBoxes; _i < cBoxes_1.length; _i++) {\n var cBox = cBoxes_1[_i];\n removeAddCboxClasses(cBox, checked);\n setChecked(cBox.previousSibling, checked);\n }\n };\n CheckBoxFilterBase.prototype.dialogOpen = function () {\n if (this.parent.element.classList.contains('e-device')) {\n this.dialogObj.element.querySelector('.e-input-group').classList.remove('e-input-focus');\n if (!this.options.isResponsiveFilter) {\n this.dialogObj.element.querySelector('.e-btn').focus();\n }\n }\n };\n CheckBoxFilterBase.prototype.createCheckbox = function (value, checked, data) {\n var elem = checked ? this.cBoxTrue.cloneNode(true) :\n this.cBoxFalse.cloneNode(true);\n setChecked(elem.querySelector('input'), checked);\n var label = elem.querySelector('.e-label');\n var dummyData = extendObjWithFn({}, data, { column: this.options.column, parent: this.parent });\n var innerText = this.options.disableHtmlEncode ? 'textContent' : 'innerHTML';\n label[\"\" + innerText] = !isNullOrUndefined(value) && value.toString().length ?\n this.parent.enableHtmlSanitizer ? SanitizeHtmlHelper.sanitize(value) : value : this.getLocalizedLabel('Blanks');\n var checkboxUid = getUid('cbox');\n label.setAttribute('id', checkboxUid + 'cboxLabel');\n elem.querySelector('input').setAttribute('aria-labelledby', label.id);\n if (label.innerHTML === this.getLocalizedLabel('Blanks')) {\n this.isBlanks = true;\n }\n if (typeof value === 'boolean') {\n label.innerHTML = value === true ? this.getLocalizedLabel('FilterTrue') : this.getLocalizedLabel('FilterFalse');\n }\n addClass([label], ['e-checkboxfiltertext']);\n if (this.options.template && data[this.options.column.field] !== this.getLocalizedLabel('SelectAll')\n && data[this.options.column.field] !== this.getLocalizedLabel('AddCurrentSelection')) {\n label.innerHTML = '';\n var isReactCompiler = this.parent.isReact && this.options.column.filter\n && typeof (this.options.column.filter.itemTemplate) !== 'string';\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.parent.parentDetails.parentInstObj.isReact;\n if (isReactCompiler || isReactChild) {\n this.options.template(dummyData, this.parent, 'filterItemTemplate', null, null, null, label);\n this.parent.renderTemplates();\n }\n else {\n appendChildren(label, this.options.template(dummyData, this.parent, 'filterItemTemplate'));\n }\n }\n return elem;\n };\n CheckBoxFilterBase.prototype.updateIndeterminatenBtn = function () {\n var cnt = this.infiniteRenderMod ? this.infiniteLoadedElem.length : this.cBox.children.length - 1;\n var className = [];\n var disabled = false;\n var elem = this.infiniteRenderMod ? this.sBox.querySelector('.e-selectall') : this.cBox.querySelector('.e-selectall');\n var selected = this.infiniteRenderMod ? this.infiniteLoadedElem.filter(function (arr) { return arr.querySelector('.e-check'); }).length :\n this.cBox.querySelectorAll('.e-check:not(.e-selectall):not(.e-add-current)').length;\n if (this.cBox.querySelector('.e-add-current')) {\n cnt -= 1;\n }\n var btn;\n if (!this.options.isResponsiveFilter) {\n btn = this.dialogObj.btnObj[0];\n btn.disabled = false;\n }\n var input = elem.previousSibling;\n setChecked(input, false);\n input.indeterminate = false;\n if (this.infiniteRenderMod && this.sInput.value === '' && !this.options.parentCurrentViewDataCount && !this.localInfiniteSelectionInteracted\n && (!this.localInfiniteSelectAllClicked || (!this.infiniteLocalSelectAll && !selected)) && (cnt !== selected || cnt === selected)) {\n selected = 0;\n }\n else if (this.infiniteRenderMod && this.infiniteLoadedElem.length < this.infiniteDataCount\n && this.infiniteUnloadParentExistPred.length && (!selected || cnt === selected) && this.infiniteLocalSelectAll) {\n if (!selected) {\n selected += this.infiniteUnloadParentExistPred.length;\n }\n else {\n cnt += this.infiniteUnloadParentExistPred.length;\n }\n }\n if (cnt === selected) {\n if (this.infiniteRenderMod) {\n this.infiniteLocalSelectAll = true;\n this.localInfiniteSelectAllClicked = true;\n this.infiniteManualSelectMaintainPred = [];\n }\n className = ['e-check'];\n setChecked(input, true);\n }\n else if (selected) {\n className = ['e-stop'];\n input.indeterminate = true;\n }\n else {\n if (this.infiniteRenderMod) {\n this.infiniteLocalSelectAll = false;\n this.localInfiniteSelectAllClicked = true;\n this.infiniteManualSelectMaintainPred = [];\n }\n className = ['e-uncheck'];\n disabled = true;\n if (btn) {\n btn.disabled = true;\n }\n }\n if (btn) {\n this.filterState = !btn.disabled;\n btn.dataBind();\n }\n removeClass([elem], ['e-check', 'e-stop', 'e-uncheck']);\n addClass([elem], className);\n this.parent.notify(events.refreshCustomFilterOkBtn, { disabled: disabled });\n };\n CheckBoxFilterBase.prototype.createFilterItems = function (data, isInitial, args1) {\n var _a, _b, _c;\n var cBoxes = this.parent.createElement('div');\n var btn;\n var disabled = false;\n if (!this.options.isResponsiveFilter) {\n btn = this.dialogObj.btnObj[0];\n }\n var nullCounter = -1;\n var key = 'ejValue';\n if (!args1.executeQuery) {\n key = args1.field;\n }\n for (var i = 0; i < data.length; i++) {\n var val = getValue(key, data[parseInt(i.toString(), 10)]);\n if (val === '' || isNullOrUndefined(val)) {\n nullCounter = nullCounter + 1;\n }\n }\n if (!this.infiniteRenderMod) {\n this.itemsCnt = nullCounter !== -1 ? data.length - nullCounter : data.length;\n }\n if (this.infiniteRenderMod && this.parent.filterSettings && this.parent.filterSettings.loadingIndicator === 'Shimmer') {\n this.removeMask();\n }\n if (data.length && !this.renderEmpty) {\n var selectAllValue = this.getLocalizedLabel('SelectAll');\n var innerDiv = this.cBox.querySelector('.e-checkfltrnmdiv');\n if (innerDiv) {\n innerDiv.classList.remove('e-checkfltrnmdiv');\n }\n var checkBox = this.createCheckbox(selectAllValue, false, (_a = {}, _a[this.options.field] = selectAllValue, _a));\n if (this.parent.cssClass) {\n if (this.parent.cssClass.indexOf(' ') !== -1) {\n addClass([checkBox], this.parent.cssClass.split(' '));\n }\n else {\n addClass([checkBox], [this.parent.cssClass]);\n }\n }\n if (this.infiniteInitialLoad || !this.infiniteRenderMod) {\n var selectAll = createCboxWithWrap(getUid('cbox'), checkBox, 'e-ftrchk');\n selectAll.querySelector('.e-frame').classList.add('e-selectall');\n if (this.infiniteRenderMod) {\n this.sBox.insertBefore(selectAll, this.spinner);\n }\n else {\n cBoxes.appendChild(selectAll);\n }\n }\n else if (this.sBox.querySelector('.e-ftrchk .e-selectall')) {\n this.sBox.querySelector('.e-ftrchk .e-selectall').previousSibling.disabled = false;\n this.sBox.querySelector('.e-ftrchk .e-selectall').parentElement.classList.remove('e-checkbox-disabled');\n }\n var predicate = new Predicate('field', 'equal', this.options.field);\n if (this.options.foreignKeyValue) {\n predicate = predicate.or('field', 'equal', this.options.foreignKeyValue);\n }\n var isColFiltered = new DataManager(this.options.filteredColumns).executeLocal(new Query().where(predicate)).length;\n if (this.sInput.value) {\n var predicateCheckBox = this.createCheckbox(this.getLocalizedLabel('AddCurrentSelection'), false, (_b = {},\n _b[this.options.field] = this.getLocalizedLabel('AddCurrentSelection'),\n _b));\n if (this.parent.cssClass) {\n if (this.parent.cssClass.indexOf(' ') !== -1) {\n addClass([predicateCheckBox], this.parent.cssClass.split(' '));\n }\n else {\n addClass([predicateCheckBox], [this.parent.cssClass]);\n }\n }\n if ((this.infiniteRenderMod && (!isNullOrUndefined(this.sBox.children[2])\n && this.sBox.children[2].innerText !== 'Add current selection to filter')) || !this.infiniteRenderMod) {\n var predicateElement = createCboxWithWrap(getUid('cbox'), predicateCheckBox, 'e-ftrchk');\n predicateElement.querySelector('.e-frame').classList.add('e-add-current');\n if (this.infiniteRenderMod) {\n this.sBox.insertBefore(predicateElement, this.spinner);\n var checkBoxListElem = this.spinner.querySelector('.e-checkboxlist');\n var reduceHeight = Math.ceil(predicateElement.getBoundingClientRect().height);\n checkBoxListElem.style.height = (parseInt(getComputedStyle(checkBoxListElem).height.split('px')[0], 10) - reduceHeight)\n + 'px';\n checkBoxListElem.style.minHeight = checkBoxListElem.style.height;\n }\n else {\n cBoxes.appendChild(predicateElement);\n }\n }\n else if (this.sBox.querySelector('.e-ftrchk .e-add-current')) {\n this.sBox.querySelector('.e-ftrchk .e-add-current').previousSibling.disabled = false;\n this.sBox.querySelector('.e-ftrchk .e-add-current').parentElement.classList.remove('e-checkbox-disabled');\n }\n }\n else if (this.infiniteRenderMod && !isNullOrUndefined(this.sBox.children[2])\n && this.sBox.children[2].innerText === 'Add current selection to filter') {\n var checkBoxListElem = this.spinner.querySelector('.e-checkboxlist');\n var increaseHeight = Math.ceil(this.sBox.children[2].getBoundingClientRect().height);\n checkBoxListElem.style.height = (parseInt(getComputedStyle(checkBoxListElem).height.split('px')[0], 10) + increaseHeight)\n + 'px';\n checkBoxListElem.style.minHeight = checkBoxListElem.style.height;\n remove(this.sBox.children[2]);\n }\n var isRndere = void 0;\n for (var i = 0; i < data.length; i++) {\n var uid = getUid('cbox');\n this.values[\"\" + uid] = getValue(key, data[parseInt(i.toString(), 10)]);\n var value = getValue(this.options.field, data[parseInt(i.toString(), 10)]);\n if (this.options.formatFn) {\n value = this.valueFormatter.toView(value, this.options.formatFn);\n }\n var args_1 = { value: value, column: this.options.column, data: data[parseInt(i.toString(), 10)] };\n this.parent.notify(events.filterCboxValue, args_1);\n value = args_1.value;\n if ((value === '' || isNullOrUndefined(value))) {\n if (isRndere) {\n continue;\n }\n isRndere = true;\n }\n if (this.infiniteRenderMod) {\n this.updateInfiniteUnLoadedCheckboxExistPred(value, this.infiniteUnloadParentExistPred);\n }\n var checkbox = this.localInfiniteSelectAllClicked ?\n this.createCheckbox(value, this.infiniteLocalSelectAll, getValue('dataObj', data[i])) :\n this.createCheckbox(value, this.getCheckedState(isColFiltered, this.values[\"\" + uid]), getValue('dataObj', data[i]));\n cBoxes.appendChild(createCboxWithWrap(uid, checkbox, 'e-ftrchk'));\n if (this.infiniteRenderMod) {\n cBoxes.lastChild.style.height = this.getListHeight(this.cBox) + 'px';\n }\n }\n var scrollTop = this.cBox.scrollTop;\n if (!this.infiniteRenderMod || this.infiniteSearchValChange) {\n this.cBox.innerHTML = '';\n }\n else if (this.infiniteRenderMod && this.cBox.children.length) {\n this.infiniteRemoveElements(([].slice.call(this.cBox.children)).splice(0, this.parent.filterSettings.itemsCount));\n }\n if (this.infiniteRenderMod) {\n (_c = this.infiniteLoadedElem).push.apply(_c, [].slice.call(cBoxes.children));\n this.itemsCnt = nullCounter !== -1 ? this.infiniteLoadedElem.length - nullCounter : this.infiniteLoadedElem.length;\n }\n if (this.infiniteUnloadParentExistPred.length && (this.infiniteLoadedElem.length >= this.infiniteDataCount\n || !this.options.parentCurrentViewDataCount || (this.options.parentTotalDataCount === this.infiniteDataCount\n && this.options.parentCurrentViewDataCount))) {\n this.infiniteUnloadParentExistPred = [];\n }\n appendChildren(this.cBox, [].slice.call(cBoxes.children));\n if (this.infiniteRenderMod && !this.infiniteScrollAppendDiff) {\n this.infiniteScrollAppendDiff = Math.round(scrollTop - this.cBox.scrollTop);\n }\n this.updateIndeterminatenBtn();\n if (!this.infiniteRenderMod) {\n if (btn) {\n btn.disabled = false;\n }\n disabled = false;\n }\n else {\n if (btn.disabled) {\n disabled = true;\n }\n else {\n disabled = false;\n }\n }\n }\n else {\n cBoxes.appendChild(this.parent.createElement('span', { innerHTML: this.getLocalizedLabel('NoResult') }));\n this.cBox.innerHTML = '';\n if (this.infiniteRenderMod) {\n var selectAll = this.sBox.querySelector('.e-ftrchk .e-selectall');\n if (selectAll) {\n var selectAllParent = selectAll.parentElement.parentElement;\n if (selectAll.classList.contains('e-check')) {\n toogleCheckbox(selectAllParent);\n }\n else if (selectAll.classList.contains('e-stop')) {\n toogleCheckbox(selectAllParent);\n selectAll.classList.remove('e-stop');\n toogleCheckbox(selectAllParent);\n }\n selectAll.previousSibling.disabled = true;\n selectAll.parentElement.classList.add('e-checkbox-disabled');\n }\n var addCurrSelection = this.sBox.querySelector('.e-ftrchk .e-add-current');\n if (addCurrSelection) {\n var addCurrSelectionParent = addCurrSelection.parentElement.parentElement;\n if (addCurrSelection.classList.contains('e-check')) {\n toogleCheckbox(addCurrSelectionParent);\n }\n addCurrSelection.previousSibling.disabled = true;\n addCurrSelection.parentElement.classList.add('e-checkbox-disabled');\n }\n }\n this.cBox.appendChild(this.parent.createElement('div', { className: 'e-checkfltrnmdiv' }));\n appendChildren(this.cBox.children[0], [].slice.call(cBoxes.children));\n if (btn) {\n btn.disabled = true;\n }\n disabled = true;\n this.filterState = !disabled;\n }\n if (btn && data.length) {\n this.filterState = !btn.disabled;\n btn.dataBind();\n }\n var args = { requestType: events.filterChoiceRequest, dataSource: this.renderEmpty ? [] : data };\n var filterModel = 'filterModel';\n args[\"\" + filterModel] = this;\n this.parent.notify(events.cBoxFltrComplete, args);\n this.parent.notify(events.refreshCustomFilterOkBtn, { disabled: disabled });\n if (this.infiniteRenderMod && this.infiniteInitialLoad) {\n this.cBox.style.marginTop = '0px';\n }\n hideSpinner(this.spinner);\n };\n CheckBoxFilterBase.prototype.updateInfiniteUnLoadedCheckboxExistPred = function (value, updatePredArr) {\n for (var j = 0; j < updatePredArr.length; j++) {\n var pred = updatePredArr[j];\n if (value === pred.value && (pred.operator === 'equal' || pred.operator === 'notequal')) {\n this.infiniteManualSelectMaintainPred.push(updatePredArr[j]);\n updatePredArr.splice(j, 1);\n j--;\n }\n }\n };\n CheckBoxFilterBase.prototype.getCheckedState = function (isColFiltered, value) {\n if (!this.isFiltered || !isColFiltered) {\n return true;\n }\n else {\n var checkState = this.sInput.value ? true : this.result[\"\" + value];\n if (this.infiniteRenderMod) {\n return checkState;\n }\n else {\n return this.options.operator === 'notequal' ? !checkState : checkState;\n }\n }\n };\n CheckBoxFilterBase.getDistinct = function (json, field, column, foreignKeyData, checkboxFilter) {\n var len = json.length;\n var result = [];\n var value;\n var ejValue = 'ejValue';\n var lookup = {};\n var isForeignKey = column && column.isForeignColumn ? column.isForeignColumn() : false;\n while (len--) {\n value = json[parseInt(len.toString(), 10)];\n if (column && column.type === 'dateonly' && typeof value[\"\" + field] === 'string' && value[\"\" + field]) {\n var arr = value[\"\" + field].split(/[^0-9.]/);\n value[\"\" + field] = new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, parseInt(arr[2], 10));\n }\n value = getObject(field, value); //local remote diff, check with mdu\n var currentFilterValue = (typeof value === 'string') && !(isNullOrUndefined(checkboxFilter)) &&\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n !(isNullOrUndefined(checkboxFilter.parent)) && !(isNullOrUndefined(checkboxFilter.parent.filterSettings)) &&\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n !(isNullOrUndefined(checkboxFilter.parent.filterSettings.enableCaseSensitivity)) ? value.toLowerCase() : value;\n if (!(currentFilterValue in lookup)) {\n var obj = {};\n obj[\"\" + ejValue] = value;\n lookup[\"\" + currentFilterValue] = true;\n if (isForeignKey) {\n var foreignDataObj = getForeignData(column, {}, value, foreignKeyData)[0];\n setValue(events.foreignKeyData, foreignDataObj, json[parseInt(len.toString(), 10)]);\n value = getValue(column.foreignKeyValue, foreignDataObj);\n }\n setValue(field, isNullOrUndefined(value) ? null : value, obj);\n setValue('dataObj', json[parseInt(len.toString(), 10)], obj);\n result.push(obj);\n }\n }\n return DataUtil.group(DataUtil.sort(result, field, DataUtil.fnAscending), 'ejValue');\n };\n CheckBoxFilterBase.getPredicate = function (columns, isExecuteLocal) {\n var cols = DataUtil.distinct(columns, 'field', true) || [];\n var collection = [];\n var pred = {};\n for (var i = 0; i < cols.length; i++) {\n collection = new DataManager(columns).executeLocal(new Query().where('field', 'equal', cols[parseInt(i.toString(), 10)].field));\n if (collection.length !== 0) {\n pred[cols[parseInt(i.toString(), 10)].field] = CheckBoxFilterBase.generatePredicate(collection, isExecuteLocal);\n }\n }\n return pred;\n };\n CheckBoxFilterBase.generatePredicate = function (cols, isExecuteLocal) {\n var len = cols ? cols.length : 0;\n var predicate;\n var operate = 'or';\n var first = CheckBoxFilterBase.updateDateFilter(cols[0]);\n first.ignoreAccent = !isNullOrUndefined(first.ignoreAccent) ? first.ignoreAccent : false;\n if (first.type === 'date' || first.type === 'datetime' || first.type === 'dateonly') {\n predicate = getDatePredicate(first, first.type, isExecuteLocal);\n }\n else {\n predicate = first.ejpredicate ? first.ejpredicate :\n new Predicate(first.field, first.operator, first.value, !CheckBoxFilterBase.getCaseValue(first), first.ignoreAccent);\n }\n for (var p = 1; p < len; p++) {\n cols[parseInt(p.toString(), 10)] = CheckBoxFilterBase.updateDateFilter(cols[parseInt(p.toString(), 10)]);\n if (len > 2 && p > 1 && ((cols[p].predicate === 'or' && cols[p - 1].predicate === 'or')\n || (cols[p].predicate === 'and' && cols[p - 1].predicate === 'and'))) {\n if (cols[p].type === 'date' || cols[p].type === 'datetime' || cols[p].type === 'dateonly') {\n predicate.predicates.push(getDatePredicate(cols[parseInt(p.toString(), 10)], cols[p].type, isExecuteLocal));\n }\n else {\n predicate.predicates.push(new Predicate(cols[p].field, cols[parseInt(p.toString(), 10)].operator, cols[parseInt(p.toString(), 10)].value, !CheckBoxFilterBase.getCaseValue(cols[parseInt(p.toString(), 10)]), cols[parseInt(p.toString(), 10)].ignoreAccent));\n }\n }\n else {\n if (cols[p].type === 'date' || cols[p].type === 'datetime' || cols[p].type === 'dateonly') {\n if (cols[parseInt(p.toString(), 10)].predicate === 'and' && cols[parseInt(p.toString(), 10)].operator === 'equal') {\n predicate = predicate[\"\" + operate](getDatePredicate(cols[parseInt(p.toString(), 10)], cols[parseInt(p.toString(), 10)].type, isExecuteLocal), cols[parseInt(p.toString(), 10)].type, cols[parseInt(p.toString(), 10)].ignoreAccent);\n }\n else {\n predicate = predicate[(cols[parseInt(p.toString(), 10)].predicate)](getDatePredicate(cols[parseInt(p.toString(), 10)], cols[parseInt(p.toString(), 10)].type, isExecuteLocal), cols[parseInt(p.toString(), 10)].type, cols[parseInt(p.toString(), 10)].ignoreAccent);\n }\n }\n else {\n predicate = cols[parseInt(p.toString(), 10)].ejpredicate ?\n predicate[cols[parseInt(p.toString(), 10)]\n .predicate](cols[parseInt(p.toString(), 10)].ejpredicate) :\n predicate[(cols[parseInt(p.toString(), 10)].predicate)](cols[parseInt(p.toString(), 10)].field, cols[parseInt(p.toString(), 10)].operator, cols[parseInt(p.toString(), 10)].value, !CheckBoxFilterBase.getCaseValue(cols[parseInt(p.toString(), 10)]), cols[parseInt(p.toString(), 10)].ignoreAccent);\n }\n }\n }\n return predicate || null;\n };\n CheckBoxFilterBase.getCaseValue = function (filter) {\n if (isNullOrUndefined(filter.matchCase)) {\n if (filter.type === 'string' || isNullOrUndefined(filter.type) && typeof (filter.value) === 'string') {\n return false;\n }\n else {\n return true;\n }\n }\n else {\n return filter.matchCase;\n }\n };\n CheckBoxFilterBase.updateDateFilter = function (filter) {\n if ((filter.type === 'date' || filter.type === 'datetime' || filter.type === 'dateonly' || filter.value instanceof Date)) {\n filter.type = filter.type || 'date';\n }\n return filter;\n };\n return CheckBoxFilterBase;\n}());\nexport { CheckBoxFilterBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/* eslint-disable @typescript-eslint/no-unused-expressions */\nimport { Component, EventHandler, Internationalization } from '@syncfusion/ej2-base';\nimport { KeyboardEvents, L10n } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { cldrData, getDefaultDateObject, rippleEffect } from '@syncfusion/ej2-base';\nimport { removeClass, detach, closest, addClass, attributes } from '@syncfusion/ej2-base';\nimport { getValue, getUniqueID, extend, Browser } from '@syncfusion/ej2-base';\nimport { Property, Event, isNullOrUndefined, throwError } from '@syncfusion/ej2-base';\n//class constant defination.\nvar OTHERMONTH = 'e-other-month';\nvar OTHERDECADE = 'e-other-year';\nvar ROOT = 'e-calendar';\nvar DEVICE = 'e-device';\nvar HEADER = 'e-header';\nvar RTL = 'e-rtl';\nvar CONTENT = 'e-content';\nvar CONTENTTABLE = 'e-calendar-content-table';\nvar YEAR = 'e-year';\nvar MONTH = 'e-month';\nvar DECADE = 'e-decade';\nvar ICON = 'e-icons';\nvar PREVICON = 'e-prev';\nvar NEXTICON = 'e-next';\nvar PREVSPAN = 'e-date-icon-prev';\nvar NEXTSPAN = 'e-date-icon-next ';\nvar ICONCONTAINER = 'e-icon-container';\nvar DISABLED = 'e-disabled';\nvar OVERLAY = 'e-overlay';\nvar WEEKEND = 'e-weekend';\nvar WEEKNUMBER = 'e-week-number';\nvar SELECTED = 'e-selected';\nvar FOCUSEDDATE = 'e-focused-date';\nvar FOCUSEDCELL = 'e-focused-cell';\nvar OTHERMONTHROW = 'e-month-hide';\nvar TODAY = 'e-today';\nvar TITLE = 'e-title';\nvar LINK = 'e-day';\nvar CELL = 'e-cell';\nvar WEEKHEADER = 'e-week-header';\nvar ZOOMIN = 'e-zoomin';\nvar FOOTER = 'e-footer-container';\nvar BTN = 'e-btn';\nvar FLAT = 'e-flat';\nvar CSS = 'e-css';\nvar PRIMARY = 'e-primary';\nvar DAYHEADERLONG = 'e-calendar-day-header-lg';\nvar dayMilliSeconds = 86400000;\nvar minutesMilliSeconds = 60000;\n/**\n *\n * @private\n */\nvar CalendarBase = /** @class */ (function (_super) {\n __extends(CalendarBase, _super);\n /**\n * Initialized new instance of Calendar Class.\n * Constructor for creating the widget\n *\n * @param {CalendarBaseModel} options - Specifies the CalendarBase model.\n * @param {string | HTMLElement} element - Specifies the element to render as component.\n * @private\n */\n function CalendarBase(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.effect = '';\n _this.isPopupClicked = false;\n _this.isDateSelected = true;\n _this.isTodayClicked = false;\n _this.preventChange = false;\n _this.isAngular = false;\n _this.previousDates = false;\n return _this;\n }\n /**\n * To Initialize the control rendering.\n *\n * @returns {void}\n * @private\n */\n CalendarBase.prototype.render = function () {\n this.rangeValidation(this.min, this.max);\n this.calendarEleCopy = this.element.cloneNode(true);\n if (this.calendarMode === 'Islamic') {\n if (+(this.min.setSeconds(0)) === +new Date(1900, 0, 1, 0, 0, 0)) {\n this.min = new Date(1944, 2, 18);\n }\n if (+this.max === +new Date(2099, 11, 31)) {\n this.max = new Date(2069, 10, 16);\n }\n }\n this.globalize = new Internationalization(this.locale);\n if (isNullOrUndefined(this.firstDayOfWeek) || this.firstDayOfWeek > 6 || this.firstDayOfWeek < 0) {\n this.setProperties({ firstDayOfWeek: this.globalize.getFirstDayOfWeek() }, true);\n }\n this.todayDisabled = false;\n this.todayDate = new Date(new Date().setHours(0, 0, 0, 0));\n if (this.getModuleName() === 'calendar') {\n this.element.classList.add(ROOT);\n if (this.enableRtl) {\n this.element.classList.add(RTL);\n }\n if (Browser.isDevice) {\n this.element.classList.add(DEVICE);\n }\n attributes(this.element, {\n 'data-role': 'calendar'\n });\n this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';\n this.element.setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.calendarElement = this.createElement('div');\n this.calendarElement.classList.add(ROOT);\n if (this.enableRtl) {\n this.calendarElement.classList.add(RTL);\n }\n if (Browser.isDevice) {\n this.calendarElement.classList.add(DEVICE);\n }\n attributes(this.calendarElement, {\n 'data-role': 'calendar'\n });\n }\n if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {\n this.enabled = false;\n }\n this.createHeader();\n this.createContent();\n this.wireEvents();\n };\n CalendarBase.prototype.rangeValidation = function (min, max) {\n if (isNullOrUndefined(min)) {\n this.setProperties({ min: new Date(1900, 0, 1) }, true);\n }\n if (isNullOrUndefined(max)) {\n this.setProperties({ max: new Date(2099, 11, 31) }, true);\n }\n };\n CalendarBase.prototype.getDefaultKeyConfig = function () {\n this.defaultKeyConfigs = {\n controlUp: 'ctrl+38',\n controlDown: 'ctrl+40',\n moveDown: 'downarrow',\n moveUp: 'uparrow',\n moveLeft: 'leftarrow',\n moveRight: 'rightarrow',\n select: 'enter',\n home: 'home',\n end: 'end',\n pageUp: 'pageup',\n pageDown: 'pagedown',\n shiftPageUp: 'shift+pageup',\n shiftPageDown: 'shift+pagedown',\n controlHome: 'ctrl+home',\n controlEnd: 'ctrl+end',\n altUpArrow: 'alt+uparrow',\n spacebar: 'space',\n altRightArrow: 'alt+rightarrow',\n altLeftArrow: 'alt+leftarrow'\n };\n return this.defaultKeyConfigs;\n };\n CalendarBase.prototype.validateDate = function (value) {\n this.setProperties({ min: this.checkDateValue(new Date(this.checkValue(this.min))) }, true);\n this.setProperties({ max: this.checkDateValue(new Date(this.checkValue(this.max))) }, true);\n this.currentDate = this.currentDate ? this.currentDate : new Date(new Date().setHours(0, 0, 0, 0));\n if (!isNullOrUndefined(value) && this.min <= this.max && value >= this.min && value <= this.max) {\n this.currentDate = new Date(this.checkValue(value));\n }\n };\n CalendarBase.prototype.setOverlayIndex = function (popupWrapper, popupElement, modal, isDevice) {\n if (isDevice && !isNullOrUndefined(popupElement) && !isNullOrUndefined(modal) && !isNullOrUndefined(popupWrapper)) {\n var index = parseInt(popupElement.style.zIndex, 10) ? parseInt(popupElement.style.zIndex, 10) : 1000;\n modal.style.zIndex = (index - 1).toString();\n popupWrapper.style.zIndex = index.toString();\n }\n };\n CalendarBase.prototype.minMaxUpdate = function (value) {\n if (!(+this.min <= +this.max)) {\n this.setProperties({ min: this.min }, true);\n addClass([this.element], OVERLAY);\n }\n else {\n removeClass([this.element], OVERLAY);\n }\n this.min = isNullOrUndefined(this.min) || !(+this.min) ? this.min = new Date(1900, 0, 1) : this.min;\n this.max = isNullOrUndefined(this.max) || !(+this.max) ? this.max = new Date(2099, 11, 31) : this.max;\n if (+this.min <= +this.max && value && +value <= +this.max && +value >= +this.min) {\n this.currentDate = new Date(this.checkValue(value));\n }\n else {\n if (+this.min <= +this.max && !value && +this.currentDate > +this.max) {\n this.currentDate = new Date(this.checkValue(this.max));\n }\n else {\n if (+this.currentDate < +this.min) {\n this.currentDate = new Date(this.checkValue(this.min));\n }\n }\n }\n };\n CalendarBase.prototype.createHeader = function () {\n var ariaPrevAttrs = {\n 'aria-disabled': 'false',\n 'aria-label': 'previous month'\n };\n var ariaNextAttrs = {\n 'aria-disabled': 'false',\n 'aria-label': 'next month'\n };\n var ariaTitleAttrs = {\n 'aria-atomic': 'true', 'aria-live': 'assertive', 'aria-label': 'title'\n };\n var tabIndexAttr = { 'tabindex': '0' };\n this.headerElement = this.createElement('div', { className: HEADER });\n var iconContainer = this.createElement('div', { className: ICONCONTAINER });\n this.previousIcon = this.createElement('button', { className: '' + PREVICON, attrs: { type: 'button' } });\n rippleEffect(this.previousIcon, {\n duration: 400,\n selector: '.e-prev',\n isCenterRipple: true\n });\n attributes(this.previousIcon, ariaPrevAttrs);\n attributes(this.previousIcon, tabIndexAttr);\n this.nextIcon = this.createElement('button', { className: '' + NEXTICON, attrs: { type: 'button' } });\n rippleEffect(this.nextIcon, {\n selector: '.e-next',\n duration: 400,\n isCenterRipple: true\n });\n if (this.getModuleName() === 'daterangepicker') {\n attributes(this.previousIcon, { tabIndex: '-1' });\n attributes(this.nextIcon, { tabIndex: '-1' });\n }\n attributes(this.nextIcon, ariaNextAttrs);\n attributes(this.nextIcon, tabIndexAttr);\n this.headerTitleElement = this.createElement('div', { className: '' + LINK + ' ' + TITLE });\n attributes(this.headerTitleElement, ariaTitleAttrs);\n attributes(this.headerTitleElement, tabIndexAttr);\n this.headerElement.appendChild(this.headerTitleElement);\n this.previousIcon.appendChild(this.createElement('span', { className: '' + PREVSPAN + ' ' + ICON }));\n this.nextIcon.appendChild(this.createElement('span', { className: '' + NEXTSPAN + ' ' + ICON }));\n iconContainer.appendChild(this.previousIcon);\n iconContainer.appendChild(this.nextIcon);\n this.headerElement.appendChild(iconContainer);\n if (this.getModuleName() === 'calendar') {\n this.element.appendChild(this.headerElement);\n }\n else {\n this.calendarElement.appendChild(this.headerElement);\n }\n this.adjustLongHeaderSize();\n };\n CalendarBase.prototype.createContent = function () {\n this.contentElement = this.createElement('div', { className: CONTENT });\n this.table = this.createElement('table', { attrs: { 'class': CONTENTTABLE, 'tabIndex': '0', 'role': 'grid', 'aria-activedescendant': '', 'aria-labelledby': this.element.id } });\n if (this.getModuleName() === 'calendar') {\n this.element.appendChild(this.contentElement);\n }\n else {\n this.calendarElement.appendChild(this.contentElement);\n }\n this.contentElement.appendChild(this.table);\n this.createContentHeader();\n this.createContentBody();\n if (this.showTodayButton) {\n this.createContentFooter();\n }\n if (this.getModuleName() != 'daterangepicker') {\n EventHandler.add(this.table, 'focus', this.addContentFocus, this);\n EventHandler.add(this.table, 'blur', this.removeContentFocus, this);\n }\n };\n CalendarBase.prototype.addContentFocus = function (args) {\n var focusedDate = this.tableBodyElement.querySelector('tr td.e-focused-date');\n var selectedDate = this.tableBodyElement.querySelector('tr td.e-selected');\n if (!isNullOrUndefined(selectedDate)) {\n selectedDate.classList.add(FOCUSEDCELL);\n }\n else if (!isNullOrUndefined(focusedDate)) {\n focusedDate.classList.add(FOCUSEDCELL);\n }\n };\n CalendarBase.prototype.removeContentFocus = function (args) {\n var focusedDate = !isNullOrUndefined(this.tableBodyElement) ? this.tableBodyElement.querySelector('tr td.e-focused-date') : null;\n var selectedDate = !isNullOrUndefined(this.tableBodyElement) ? this.tableBodyElement.querySelector('tr td.e-selected') : null;\n if (!isNullOrUndefined(selectedDate)) {\n selectedDate.classList.remove(FOCUSEDCELL);\n }\n else if (!isNullOrUndefined(focusedDate)) {\n focusedDate.classList.remove(FOCUSEDCELL);\n }\n };\n CalendarBase.prototype.getCultureValues = function () {\n var culShortNames = [];\n var cldrObj;\n var dayFormat = 'days.stand-alone.' + this.dayHeaderFormat.toLowerCase();\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrObj = (getValue(dayFormat, getDefaultDateObject()));\n }\n else {\n cldrObj = (this.getCultureObjects(cldrData, '' + this.locale));\n }\n if (!isNullOrUndefined(cldrObj)) {\n for (var _i = 0, _a = Object.keys(cldrObj); _i < _a.length; _i++) {\n var obj = _a[_i];\n culShortNames.push(getValue(obj, cldrObj));\n }\n }\n return culShortNames;\n };\n CalendarBase.prototype.toCapitalize = function (text) {\n return !isNullOrUndefined(text) && text.length ? text[0].toUpperCase() + text.slice(1) : text;\n };\n CalendarBase.prototype.createContentHeader = function () {\n if (this.getModuleName() === 'calendar') {\n if (!isNullOrUndefined(this.element.querySelectorAll('.e-content .e-week-header')[0])) {\n detach(this.element.querySelectorAll('.e-content .e-week-header')[0]);\n }\n }\n else {\n if (!isNullOrUndefined(this.calendarElement.querySelectorAll('.e-content .e-week-header')[0])) {\n detach(this.calendarElement.querySelectorAll('.e-content .e-week-header')[0]);\n }\n }\n var daysCount = 6;\n var html = '';\n if (this.firstDayOfWeek > 6 || this.firstDayOfWeek < 0) {\n this.setProperties({ firstDayOfWeek: 0 }, true);\n }\n this.tableHeadElement = this.createElement('thead', { className: WEEKHEADER });\n if (this.weekNumber) {\n html += '';\n if (this.getModuleName() === 'calendar') {\n addClass([this.element], '' + WEEKNUMBER);\n }\n else {\n addClass([this.calendarElement], '' + WEEKNUMBER);\n }\n }\n // eslint-disable-next-line max-len\n var shortNames = this.getCultureValues().length > 0 && this.getCultureValues() ? this.shiftArray(((this.getCultureValues().length > 0 && this.getCultureValues())), this.firstDayOfWeek) : null;\n if (!isNullOrUndefined(shortNames)) {\n for (var days = 0; days <= daysCount; days++) {\n html += '' + this.toCapitalize(shortNames[days]) + '';\n }\n }\n html = '' + html + '';\n this.tableHeadElement.innerHTML = html;\n this.table.appendChild(this.tableHeadElement);\n };\n CalendarBase.prototype.createContentBody = function () {\n if (this.getModuleName() === 'calendar') {\n if (!isNullOrUndefined(this.element.querySelectorAll('.e-content tbody')[0])) {\n detach(this.element.querySelectorAll('.e-content tbody')[0]);\n }\n }\n else {\n if (!isNullOrUndefined(this.calendarElement.querySelectorAll('.e-content tbody')[0])) {\n detach(this.calendarElement.querySelectorAll('.e-content tbody')[0]);\n }\n }\n switch (this.start) {\n case 'Year':\n this.renderYears();\n break;\n case 'Decade':\n this.renderDecades();\n break;\n default:\n this.renderMonths();\n }\n };\n CalendarBase.prototype.updateFooter = function () {\n this.todayElement.textContent = this.l10.getConstant('today');\n this.todayElement.setAttribute('aria-label', this.l10.getConstant('today'));\n this.todayElement.setAttribute('tabindex', '0');\n };\n CalendarBase.prototype.createContentFooter = function () {\n if (this.showTodayButton) {\n var minimum = new Date(+this.min);\n var maximum = new Date(+this.max);\n var l10nLocale = { today: 'Today' };\n this.globalize = new Internationalization(this.locale);\n this.l10 = new L10n(this.getModuleName(), l10nLocale, this.locale);\n this.todayElement = this.createElement('button', { attrs: { role: 'button' } });\n rippleEffect(this.todayElement);\n this.updateFooter();\n addClass([this.todayElement], [BTN, TODAY, FLAT, PRIMARY, CSS]);\n if ((!(+new Date(minimum.setHours(0, 0, 0, 0)) <= +this.todayDate &&\n +this.todayDate <= +new Date(maximum.setHours(0, 0, 0, 0)))) || (this.todayDisabled)) {\n addClass([this.todayElement], DISABLED);\n }\n this.footer = this.createElement('div', { className: FOOTER });\n this.footer.appendChild(this.todayElement);\n if (this.getModuleName() === 'calendar') {\n this.element.appendChild(this.footer);\n }\n if (this.getModuleName() === 'datepicker') {\n this.calendarElement.appendChild(this.footer);\n }\n if (this.getModuleName() === 'datetimepicker') {\n this.calendarElement.appendChild(this.footer);\n }\n if (!this.todayElement.classList.contains(DISABLED)) {\n EventHandler.add(this.todayElement, 'click', this.todayButtonClick, this);\n }\n }\n };\n CalendarBase.prototype.wireEvents = function (id, ref, keyConfig, moduleName) {\n EventHandler.add(this.headerTitleElement, 'click', this.navigateTitle, this);\n this.defaultKeyConfigs = extend(this.defaultKeyConfigs, this.keyConfigs);\n if (this.getModuleName() === 'calendar') {\n this.keyboardModule = new KeyboardEvents(this.element, {\n eventName: 'keydown',\n keyAction: this.keyActionHandle.bind(this),\n keyConfigs: this.defaultKeyConfigs\n });\n }\n else {\n this.keyboardModule = new KeyboardEvents(this.calendarElement, {\n eventName: 'keydown',\n keyAction: this.keyActionHandle.bind(this),\n keyConfigs: this.defaultKeyConfigs\n });\n }\n };\n CalendarBase.prototype.dateWireEvents = function (id, ref, keyConfig, moduleName) {\n this.defaultKeyConfigs = this.getDefaultKeyConfig();\n this.defaultKeyConfigs = extend(this.defaultKeyConfigs, keyConfig);\n this.serverModuleName = moduleName;\n };\n CalendarBase.prototype.todayButtonClick = function (e, value, isCustomDate) {\n if (this.showTodayButton) {\n if (this.currentView() === this.depth) {\n this.effect = '';\n }\n else {\n this.effect = 'e-zoomin';\n }\n if (this.getViewNumber(this.start) >= this.getViewNumber(this.depth)) {\n this.navigateTo(this.depth, new Date(this.checkValue(value)), isCustomDate);\n }\n else {\n this.navigateTo('Month', new Date(this.checkValue(value)), isCustomDate);\n }\n }\n };\n CalendarBase.prototype.resetCalendar = function () {\n this.calendarElement && detach(this.calendarElement);\n this.tableBodyElement && detach(this.tableBodyElement);\n this.table && detach(this.table);\n this.tableHeadElement && detach(this.tableHeadElement);\n this.nextIcon && detach(this.nextIcon);\n this.previousIcon && detach(this.previousIcon);\n this.footer && detach(this.footer);\n this.todayElement = null;\n this.renderDayCellArgs = null;\n this.calendarElement = this.tableBodyElement = this.footer = this.tableHeadElement =\n this.nextIcon = this.previousIcon = this.table = null;\n };\n CalendarBase.prototype.keyActionHandle = function (e, value, multiSelection) {\n if (this.calendarElement === null && e.action === 'escape') {\n return;\n }\n var focusedDate = this.tableBodyElement.querySelector('tr td.e-focused-date');\n var selectedDate;\n if (multiSelection) {\n if (!isNullOrUndefined(focusedDate) && +value === parseInt(focusedDate.getAttribute('id').split('_')[0], 10)) {\n selectedDate = focusedDate;\n }\n else {\n selectedDate = this.tableBodyElement.querySelector('tr td.e-selected');\n }\n }\n else {\n selectedDate = this.tableBodyElement.querySelector('tr td.e-selected');\n }\n var view = this.getViewNumber(this.currentView());\n var depthValue = this.getViewNumber(this.depth);\n var levelRestrict = (view === depthValue && this.getViewNumber(this.start) >= depthValue);\n this.effect = '';\n switch (e.action) {\n case 'moveLeft':\n if (this.getModuleName() != 'daterangepicker' && !isNullOrUndefined(e.target) && e.target.classList.length > 0 && e.target.classList.contains(CONTENTTABLE)) {\n this.keyboardNavigate(-1, view, e, this.max, this.min);\n e.preventDefault();\n }\n break;\n case 'moveRight':\n if (this.getModuleName() != 'daterangepicker' && !isNullOrUndefined(e.target) && e.target.classList.length > 0 && e.target.classList.contains(CONTENTTABLE)) {\n this.keyboardNavigate(1, view, e, this.max, this.min);\n e.preventDefault();\n }\n break;\n case 'moveUp':\n if (this.getModuleName() != 'daterangepicker' && !isNullOrUndefined(e.target) && e.target.classList.length > 0 && e.target.classList.contains(CONTENTTABLE)) {\n if (view === 0) {\n this.keyboardNavigate(-7, view, e, this.max, this.min); // move the current date to the previous seven days.\n }\n else {\n this.keyboardNavigate(-4, view, e, this.max, this.min); // move the current year to the previous four days.\n }\n e.preventDefault();\n }\n break;\n case 'moveDown':\n if (this.getModuleName() != 'daterangepicker' && !isNullOrUndefined(e.target) && e.target.classList.length > 0 && e.target.classList.contains(CONTENTTABLE)) {\n if (view === 0) {\n this.keyboardNavigate(7, view, e, this.max, this.min);\n }\n else {\n this.keyboardNavigate(4, view, e, this.max, this.min);\n }\n e.preventDefault();\n }\n break;\n case 'select':\n if (e.target === this.headerTitleElement) {\n this.navigateTitle(e);\n }\n else if (e.target === this.previousIcon) {\n this.navigatePrevious(e);\n }\n else if (e.target === this.nextIcon) {\n this.navigateNext(e);\n }\n else if (e.target === this.todayElement) {\n this.todayButtonClick(e, value);\n if (this.getModuleName() === 'datepicker' || this.getModuleName() === 'datetimepicker') {\n this.element.focus();\n }\n }\n else {\n var element = !isNullOrUndefined(focusedDate) ? focusedDate : selectedDate;\n if (!isNullOrUndefined(element) && !element.classList.contains(DISABLED)) {\n if (levelRestrict) {\n // eslint-disable-next-line radix\n var d = new Date(parseInt('' + (element).id, 0));\n this.selectDate(e, d, (element));\n }\n else {\n this.contentClick(null, --view, (element), value);\n }\n if (this.getModuleName() === 'datepicker' || this.getModuleName() === 'datetimepicker') {\n this.element.focus();\n }\n }\n }\n break;\n case 'controlUp':\n this.title();\n e.preventDefault();\n break;\n case 'controlDown':\n if (!isNullOrUndefined(focusedDate) && !levelRestrict || !isNullOrUndefined(selectedDate) && !levelRestrict) {\n this.contentClick(null, --view, (focusedDate || selectedDate), value);\n }\n e.preventDefault();\n break;\n case 'home':\n this.currentDate = this.firstDay(this.currentDate);\n detach(this.tableBodyElement);\n if (view === 0) {\n this.renderMonths(e);\n }\n else if (view === 1) {\n this.renderYears(e);\n }\n else {\n this.renderDecades(e);\n }\n e.preventDefault();\n break;\n case 'end':\n this.currentDate = this.lastDay(this.currentDate, view);\n detach(this.tableBodyElement);\n if (view === 0) {\n this.renderMonths(e);\n }\n else if (view === 1) {\n this.renderYears(e);\n }\n else {\n this.renderDecades(e);\n }\n e.preventDefault();\n break;\n case 'pageUp':\n this.addMonths(this.currentDate, -1);\n this.navigateTo('Month', this.currentDate);\n e.preventDefault();\n break;\n case 'pageDown':\n this.addMonths(this.currentDate, 1);\n this.navigateTo('Month', this.currentDate);\n e.preventDefault();\n break;\n case 'shiftPageUp':\n this.addYears(this.currentDate, -1);\n this.navigateTo('Month', this.currentDate);\n e.preventDefault();\n break;\n case 'shiftPageDown':\n this.addYears(this.currentDate, 1);\n this.navigateTo('Month', this.currentDate);\n e.preventDefault();\n break;\n case 'controlHome':\n this.navigateTo('Month', new Date(this.currentDate.getFullYear(), 0, 1));\n e.preventDefault();\n break;\n case 'controlEnd':\n this.navigateTo('Month', new Date(this.currentDate.getFullYear(), 11, 31));\n e.preventDefault();\n break;\n case 'tab':\n if ((this.getModuleName() === 'datepicker' || this.getModuleName() === 'datetimepicker') && e.target === this.todayElement) {\n e.preventDefault();\n if (this.isAngular) {\n this.inputElement.focus();\n }\n else {\n this.element.focus();\n }\n this.hide();\n }\n break;\n case 'shiftTab':\n if ((this.getModuleName() === 'datepicker' || this.getModuleName() === 'datetimepicker') && e.target === this.headerTitleElement) {\n e.preventDefault();\n this.element.focus();\n this.hide();\n }\n break;\n case 'escape':\n if ((this.getModuleName() === 'datepicker' || this.getModuleName() === 'datetimepicker') && (e.target === this.headerTitleElement || e.target === this.previousIcon || e.target === this.nextIcon || e.target === this.todayElement)) {\n this.hide();\n }\n break;\n }\n };\n CalendarBase.prototype.keyboardNavigate = function (number, currentView, e, max, min) {\n var date = new Date(this.checkValue(this.currentDate));\n switch (currentView) {\n case 2:\n this.addYears(this.currentDate, number);\n if (this.isMonthYearRange(this.currentDate)) {\n detach(this.tableBodyElement);\n this.renderDecades(e);\n }\n else {\n this.currentDate = date;\n }\n break;\n case 1:\n this.addMonths(this.currentDate, number);\n if (this.calendarMode === 'Gregorian') {\n if (this.isMonthYearRange(this.currentDate)) {\n detach(this.tableBodyElement);\n this.renderYears(e);\n }\n else {\n this.currentDate = date;\n }\n }\n else {\n if (this.isMonthYearRange(this.currentDate)) {\n detach(this.tableBodyElement);\n this.renderYears(e);\n }\n else {\n this.currentDate = date;\n }\n }\n break;\n case 0:\n this.addDay(this.currentDate, number, e, max, min);\n if (this.isMinMaxRange(this.currentDate)) {\n detach(this.tableBodyElement);\n this.renderMonths(e);\n }\n else {\n this.currentDate = date;\n }\n break;\n }\n };\n /**\n * Initialize the event handler\n *\n * @param {Date} value - Specifies value of date.\n * @returns {void}\n * @private\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n CalendarBase.prototype.preRender = function (value) {\n var _this = this;\n this.navigatePreviousHandler = this.navigatePrevious.bind(this);\n this.navigateNextHandler = this.navigateNext.bind(this);\n this.defaultKeyConfigs = this.getDefaultKeyConfig();\n this.navigateHandler = function (e) {\n _this.triggerNavigate(e);\n };\n };\n CalendarBase.prototype.minMaxDate = function (localDate) {\n var currentDate = new Date(new Date(+localDate).setHours(0, 0, 0, 0));\n var minDate = new Date(new Date(+this.min).setHours(0, 0, 0, 0));\n var maxDate = new Date(new Date(+this.max).setHours(0, 0, 0, 0));\n if (+currentDate === +minDate || +currentDate === +maxDate) {\n if (+localDate < +this.min) {\n localDate = new Date(+this.min);\n }\n if (+localDate > +this.max) {\n localDate = new Date(+this.max);\n }\n }\n return localDate;\n };\n CalendarBase.prototype.renderMonths = function (e, value, isCustomDate) {\n var numCells = this.weekNumber ? 8 : 7;\n var tdEles;\n if (this.calendarMode === 'Gregorian') {\n tdEles = this.renderDays(this.currentDate, value, null, null, isCustomDate, e);\n }\n else {\n tdEles = this.islamicModule.islamicRenderDays(this.currentDate, value);\n }\n this.createContentHeader();\n if (this.calendarMode === 'Gregorian') {\n this.renderTemplate(tdEles, numCells, MONTH, e, value);\n }\n else {\n this.islamicModule.islamicRenderTemplate(tdEles, numCells, MONTH, e, value);\n }\n };\n CalendarBase.prototype.renderDays = function (currentDate, value, multiSelection, values, isTodayDate, e) {\n var tdEles = [];\n var cellsCount = 42;\n var todayDate = isTodayDate ? new Date(+currentDate) : this.getDate(new Date(), this.timezone);\n var localDate = new Date(this.checkValue(currentDate));\n var minMaxDate;\n var currentMonth = localDate.getMonth();\n this.titleUpdate(currentDate, 'days');\n var d = localDate;\n localDate = new Date(d.getFullYear(), d.getMonth(), 0, d.getHours(), d.getMinutes(), d.getSeconds(), d.getMilliseconds());\n while (localDate.getDay() !== this.firstDayOfWeek) {\n this.setStartDate(localDate, -1 * dayMilliSeconds);\n }\n for (var day = 0; day < cellsCount; ++day) {\n var weekEle = this.createElement('td', { className: CELL });\n var weekAnchor = this.createElement('span');\n if (day % 7 === 0 && this.weekNumber) {\n // 6 days are added to get Last day of the week and 3 days are added to get middle day of the week.\n var numberOfDays = this.weekRule === 'FirstDay' ? 6 : (this.weekRule === 'FirstFourDayWeek' ? 3 : 0);\n var finalDate = new Date(localDate.getFullYear(), localDate.getMonth(), (localDate.getDate() + numberOfDays));\n weekAnchor.textContent = '' + this.getWeek(finalDate);\n weekEle.appendChild(weekAnchor);\n addClass([weekEle], '' + WEEKNUMBER);\n tdEles.push(weekEle);\n }\n minMaxDate = new Date(+localDate);\n localDate = this.minMaxDate(localDate);\n var dateFormatOptions = { type: 'dateTime', skeleton: 'full' };\n var date = this.globalize.parseDate(this.globalize.formatDate(localDate, dateFormatOptions), dateFormatOptions);\n var tdEle = this.dayCell(localDate);\n var title = this.globalize.formatDate(localDate, { type: 'date', skeleton: 'full' });\n var dayLink = this.createElement('span');\n dayLink.textContent = this.globalize.formatDate(localDate, { format: 'd', type: 'date', skeleton: 'yMd' });\n var disabled = (this.min > localDate) || (this.max < localDate);\n if (disabled) {\n addClass([tdEle], DISABLED);\n addClass([tdEle], OVERLAY);\n }\n else {\n dayLink.setAttribute('title', '' + title);\n }\n if (currentMonth !== localDate.getMonth()) {\n addClass([tdEle], OTHERMONTH);\n dayLink.setAttribute('aria-disabled', 'true');\n }\n if (localDate.getDay() === 0 || localDate.getDay() === 6) {\n addClass([tdEle], WEEKEND);\n }\n tdEle.appendChild(dayLink);\n this.renderDayCellArgs = {\n date: localDate,\n isDisabled: false,\n element: tdEle,\n isOutOfRange: disabled\n };\n var argument = this.renderDayCellArgs;\n this.renderDayCellEvent(argument);\n if (argument.isDisabled) {\n var selectDate = new Date(this.checkValue(value));\n var argsDate = new Date(this.checkValue(argument.date));\n if (multiSelection) {\n if (!isNullOrUndefined(values) && values.length > 0) {\n for (var index = 0; index < values.length; index++) {\n var localDateString = +new Date(this.globalize.formatDate(argument.date, { type: 'date', skeleton: 'yMd' }));\n var tempDateString = +new Date(this.globalize.formatDate(values[index], { type: 'date', skeleton: 'yMd' }));\n if (localDateString === tempDateString) {\n values.splice(index, 1);\n index = -1;\n }\n }\n }\n }\n else if (selectDate && +selectDate === +argsDate) {\n this.setProperties({ value: null }, true);\n }\n }\n if (this.renderDayCellArgs.isDisabled && !tdEle.classList.contains(SELECTED)) {\n addClass([tdEle], DISABLED);\n addClass([tdEle], OVERLAY);\n dayLink.setAttribute('aria-disabled', 'true');\n if (+this.renderDayCellArgs.date === +this.todayDate) {\n this.todayDisabled = true;\n }\n }\n var otherMnthBool = tdEle.classList.contains(OTHERMONTH);\n var disabledCls = tdEle.classList.contains(DISABLED);\n if (!disabledCls) {\n EventHandler.add(tdEle, 'click', this.clickHandler, this);\n }\n // to set the value as null while setting the disabled date onProperty change.\n // if (args.isDisabled && +this.value === +args.date) {\n // this.setProperties({ value: null }, true);\n // }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var currentTarget = void 0;\n if (!isNullOrUndefined(e) && e.type === 'click') {\n currentTarget = e.currentTarget;\n }\n if (multiSelection && !isNullOrUndefined(values) && !disabledCls) {\n for (var tempValue = 0; tempValue < values.length; tempValue++) {\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var formatOptions = { format: null, type: 'date', skeleton: 'short', calendar: type };\n var localDateString = this.globalize.formatDate(localDate, formatOptions);\n var tempDateString = this.globalize.formatDate(values[tempValue], formatOptions);\n if ((localDateString === tempDateString && this.getDateVal(localDate, values[tempValue]))\n || (this.getDateVal(localDate, value))) {\n addClass([tdEle], SELECTED);\n }\n if (!isNullOrUndefined(currentTarget) && currentTarget.innerText === tdEle.innerText &&\n this.previousDates && tdEle.classList.contains(SELECTED) && currentTarget.classList.contains(SELECTED)) {\n removeClass([tdEle], SELECTED);\n this.previousDates = false;\n var copyValues = this.copyValues(values);\n for (var i = 0; i < copyValues.length; i++) {\n var type_1 = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var formatOptions_1 = { format: null, type: 'date', skeleton: 'short', calendar: type_1 };\n var localDateString_1 = this.globalize.formatDate(date, formatOptions_1);\n var tempDateString_1 = this.globalize.formatDate(copyValues[i], formatOptions_1);\n if (localDateString_1 === tempDateString_1) {\n var index = copyValues.indexOf(copyValues[i]);\n copyValues.splice(index, 1);\n values.splice(index, 1);\n }\n }\n this.setProperties({ values: copyValues }, true);\n }\n else {\n this.updateFocus(otherMnthBool, disabledCls, localDate, tdEle, currentDate);\n }\n }\n if (values.length <= 0) {\n this.updateFocus(otherMnthBool, disabledCls, localDate, tdEle, currentDate);\n }\n }\n else if (!disabledCls && this.getDateVal(localDate, value)) {\n addClass([tdEle], SELECTED);\n }\n this.updateFocus(otherMnthBool, disabledCls, localDate, tdEle, currentDate);\n if (!isNullOrUndefined(date) && date.getFullYear() === todayDate.getFullYear() && date.getMonth() === todayDate.getMonth()\n && date.getDate() === todayDate.getDate()) {\n addClass([tdEle], TODAY);\n }\n tdEles.push(this.renderDayCellArgs.element);\n localDate = new Date(+minMaxDate);\n this.addDay(localDate, 1, null, this.max, this.min);\n }\n return tdEles;\n };\n CalendarBase.prototype.updateFocus = function (otherMonth, disabled, localDate, tableElement, currentDate) {\n if (currentDate.getDate() === localDate.getDate() && !otherMonth && !disabled) {\n addClass([tableElement], FOCUSEDDATE);\n }\n else {\n // eslint-disable-next-line radix\n if (currentDate >= this.max && parseInt(tableElement.id, 0) === +this.max && !otherMonth && !disabled) {\n addClass([tableElement], FOCUSEDDATE);\n }\n // eslint-disable-next-line radix\n if (currentDate <= this.min && parseInt(tableElement.id, 0) === +this.min && !otherMonth && !disabled) {\n addClass([tableElement], FOCUSEDDATE);\n }\n }\n };\n CalendarBase.prototype.renderYears = function (e, value) {\n this.removeTableHeadElement();\n var numCells = 4;\n var tdEles = [];\n var valueUtil = isNullOrUndefined(value);\n var curDate = new Date(this.checkValue(this.currentDate));\n var mon = curDate.getMonth();\n var yr = curDate.getFullYear();\n var localDate = curDate;\n var curYrs = localDate.getFullYear();\n var minYr = new Date(this.checkValue(this.min)).getFullYear();\n var minMonth = new Date(this.checkValue(this.min)).getMonth();\n var maxYr = new Date(this.checkValue(this.max)).getFullYear();\n var maxMonth = new Date(this.checkValue(this.max)).getMonth();\n localDate.setMonth(0);\n this.titleUpdate(this.currentDate, 'months');\n localDate.setDate(1);\n for (var month = 0; month < 12; ++month) {\n var tdEle = this.dayCell(localDate);\n var dayLink = this.createElement('span');\n var localMonth = (value && (value).getMonth() === localDate.getMonth());\n var select = (value && (value).getFullYear() === yr && localMonth);\n var title = this.globalize.formatDate(localDate, { type: 'date', format: 'MMM y' });\n dayLink.textContent = this.toCapitalize(this.globalize.formatDate(localDate, {\n format: null, type: 'dateTime', skeleton: 'MMM'\n }));\n if ((this.min && (curYrs < minYr || (month < minMonth && curYrs === minYr))) || (this.max && (curYrs > maxYr || (month > maxMonth && curYrs >= maxYr)))) {\n addClass([tdEle], DISABLED);\n }\n else if (!valueUtil && select) {\n addClass([tdEle], SELECTED);\n }\n else {\n if (localDate.getMonth() === mon && this.currentDate.getMonth() === mon) {\n addClass([tdEle], FOCUSEDDATE);\n }\n }\n localDate.setDate(1);\n localDate.setMonth(localDate.getMonth() + 1);\n if (!tdEle.classList.contains(DISABLED)) {\n EventHandler.add(tdEle, 'click', this.clickHandler, this);\n dayLink.setAttribute('title', '' + title);\n }\n tdEle.appendChild(dayLink);\n tdEles.push(tdEle);\n }\n this.renderTemplate(tdEles, numCells, YEAR, e, value);\n };\n CalendarBase.prototype.renderDecades = function (e, value) {\n this.removeTableHeadElement();\n var numCells = 4;\n var yearCell = 12;\n var tdEles = [];\n var localDate = new Date(this.checkValue(this.currentDate));\n localDate.setMonth(0);\n localDate.setDate(1);\n var localYr = localDate.getFullYear();\n var startYr = new Date(localDate.setFullYear((localYr - localYr % 10)));\n var endYr = new Date(localDate.setFullYear((localYr - localYr % 10 + (10 - 1))));\n var startFullYr = startYr.getFullYear();\n var endFullYr = endYr.getFullYear();\n var startHdrYr = this.globalize.formatDate(startYr, {\n format: null, type: 'dateTime', skeleton: 'y'\n });\n var endHdrYr = this.globalize.formatDate(endYr, { format: null, type: 'dateTime', skeleton: 'y' });\n this.headerTitleElement.textContent = startHdrYr + ' - ' + (endHdrYr);\n var start = new Date(localYr - (localYr % 10) - 1, 0, 1);\n var startYear = start.getFullYear();\n for (var rowIterator = 0; rowIterator < yearCell; ++rowIterator) {\n var year = startYear + rowIterator;\n localDate.setFullYear(year);\n var tdEle = this.dayCell(localDate);\n var dayLink = this.createElement('span');\n dayLink.textContent = this.globalize.formatDate(localDate, {\n format: null, type: 'dateTime', skeleton: 'y'\n });\n if ((year < startFullYr) || (year > endFullYr)) {\n addClass([tdEle], OTHERDECADE);\n dayLink.setAttribute('aria-disabled', 'true');\n if (!isNullOrUndefined(value) && localDate.getFullYear() === (value).getFullYear()) {\n addClass([tdEle], SELECTED);\n }\n if (year < new Date(this.checkValue(this.min)).getFullYear() ||\n year > new Date(this.checkValue(this.max)).getFullYear()) {\n addClass([tdEle], DISABLED);\n }\n }\n else if (year < new Date(this.checkValue(this.min)).getFullYear() ||\n year > new Date(this.checkValue(this.max)).getFullYear()) {\n addClass([tdEle], DISABLED);\n }\n else if (!isNullOrUndefined(value) && localDate.getFullYear() === (value).getFullYear()) {\n addClass([tdEle], SELECTED);\n }\n else {\n if (localDate.getFullYear() === this.currentDate.getFullYear() && !tdEle.classList.contains(DISABLED)) {\n addClass([tdEle], FOCUSEDDATE);\n }\n }\n if (!tdEle.classList.contains(DISABLED)) {\n EventHandler.add(tdEle, 'click', this.clickHandler, this);\n dayLink.setAttribute('title', '' + dayLink.textContent);\n }\n tdEle.appendChild(dayLink);\n tdEles.push(tdEle);\n }\n this.renderTemplate(tdEles, numCells, 'e-decade', e, value);\n };\n CalendarBase.prototype.dayCell = function (localDate) {\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var dateFormatOptions = { skeleton: 'full', type: 'dateTime', calendar: type };\n var date = this.globalize.parseDate(this.globalize.formatDate(localDate, dateFormatOptions), dateFormatOptions);\n var value;\n if (!isNullOrUndefined(date)) {\n value = date.valueOf();\n }\n var attrs = {\n className: CELL, attrs: { 'id': '' + getUniqueID('' + value), 'aria-selected': 'false' }\n };\n return this.createElement('td', attrs);\n };\n CalendarBase.prototype.firstDay = function (date) {\n var collection = this.currentView() !== 'Decade' ? this.tableBodyElement.querySelectorAll('td' + ':not(.' + OTHERMONTH + '') :\n this.tableBodyElement.querySelectorAll('td' + ':not(.' + OTHERDECADE + '');\n if (collection.length) {\n for (var i = 0; i < collection.length; i++) {\n if (!collection[i].classList.contains(DISABLED)) {\n // eslint-disable-next-line radix\n date = new Date(parseInt(collection[i].id, 0));\n break;\n }\n }\n }\n return date;\n };\n CalendarBase.prototype.lastDay = function (date, view) {\n var lastDate = new Date(date.getFullYear(), date.getMonth() + 1, 0);\n if (view !== 2) {\n var timeOffset = Math.abs(lastDate.getTimezoneOffset() - this.firstDay(date).getTimezoneOffset());\n if (timeOffset) {\n lastDate.setHours(this.firstDay(date).getHours() + (timeOffset / 60));\n }\n return this.findLastDay(lastDate);\n }\n else {\n return this.findLastDay(this.firstDay(lastDate));\n }\n };\n CalendarBase.prototype.checkDateValue = function (value) {\n return (!isNullOrUndefined(value) && value instanceof Date && !isNaN(+value)) ? value : null;\n };\n CalendarBase.prototype.findLastDay = function (date) {\n var collection = this.currentView() === 'Decade' ? this.tableBodyElement.querySelectorAll('td' + ':not(.' + OTHERDECADE + '') :\n this.tableBodyElement.querySelectorAll('td' + ':not(.' + OTHERMONTH + '');\n if (collection.length) {\n for (var i = collection.length - 1; i >= 0; i--) {\n if (!collection[i].classList.contains(DISABLED)) {\n // eslint-disable-next-line radix\n date = new Date(parseInt(collection[i].id, 0));\n break;\n }\n }\n }\n return date;\n };\n CalendarBase.prototype.removeTableHeadElement = function () {\n if (this.getModuleName() === 'calendar') {\n if (!isNullOrUndefined(this.element.querySelectorAll('.e-content table thead')[0])) {\n detach(this.tableHeadElement);\n }\n }\n else {\n if (!isNullOrUndefined(this.calendarElement.querySelectorAll('.e-content table thead')[0])) {\n detach(this.tableHeadElement);\n }\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n CalendarBase.prototype.renderTemplate = function (elements, count, classNm, e, value) {\n var view = this.getViewNumber(this.currentView());\n var trEle;\n this.tableBodyElement = this.createElement('tbody');\n this.table.appendChild(this.tableBodyElement);\n removeClass([this.contentElement, this.headerElement], [MONTH, DECADE, YEAR]);\n addClass([this.contentElement, this.headerElement], [classNm]);\n var weekNumCell = 41;\n var numberCell = 35;\n var otherMonthCell = 6;\n var row = count;\n var rowIterator = 0;\n for (var dayCell = 0; dayCell < elements.length / count; ++dayCell) {\n trEle = this.createElement('tr');\n for (rowIterator = 0 + rowIterator; rowIterator < row; rowIterator++) {\n if (!elements[rowIterator].classList.contains('e-week-number') && !isNullOrUndefined(elements[rowIterator].children[0])) {\n addClass([elements[rowIterator].children[0]], [LINK]);\n rippleEffect(elements[rowIterator].children[0], {\n duration: 600,\n isCenterRipple: true\n });\n }\n trEle.appendChild(elements[rowIterator]);\n if (this.weekNumber && rowIterator === otherMonthCell + 1 && elements[otherMonthCell + 1].classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n if (!this.weekNumber && rowIterator === otherMonthCell && elements[otherMonthCell].\n classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n if (this.weekNumber) {\n if (rowIterator === weekNumCell && elements[weekNumCell].classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n }\n else {\n if (rowIterator === numberCell && elements[numberCell].classList.contains(OTHERMONTH)) {\n addClass([trEle], OTHERMONTHROW);\n }\n }\n }\n row = row + count;\n rowIterator = rowIterator + 0;\n this.tableBodyElement.appendChild(trEle);\n }\n this.table.querySelector('tbody').className = this.effect;\n if (this.calendarMode === 'Gregorian') {\n this.iconHandler();\n }\n else {\n this.islamicModule.islamicIconHandler();\n }\n if (view !== this.getViewNumber(this.currentView()) || (view === 0 && view !== this.getViewNumber(this.currentView()))) {\n this.navigateHandler(e);\n }\n this.setAriaActiveDescendant();\n };\n CalendarBase.prototype.clickHandler = function (e, value) {\n this.clickEventEmitter(e);\n var eve = e.currentTarget;\n var view = this.getViewNumber(this.currentView());\n if (eve.classList.contains(OTHERMONTH)) {\n this.contentClick(e, 0, null, value);\n }\n else if (view === this.getViewNumber(this.depth) && this.getViewNumber(this.start) >= this.getViewNumber(this.depth)) {\n this.contentClick(e, 1, null, value);\n }\n else if (2 === view) {\n this.contentClick(e, 1, null, value);\n }\n else if (!eve.classList.contains(OTHERMONTH) && view === 0) {\n this.selectDate(e, this.getIdValue(e, null), null);\n }\n else {\n this.contentClick(e, 0, eve, value);\n }\n if (this.getModuleName() === 'calendar') {\n this.table.focus();\n }\n };\n // Content click event handler required for extended components\n CalendarBase.prototype.clickEventEmitter = function (e) {\n e.preventDefault();\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n CalendarBase.prototype.contentClick = function (e, view, element, value) {\n var currentView = this.getViewNumber(this.currentView());\n var d = this.getIdValue(e, element);\n switch (view) {\n case 0:\n if (currentView === this.getViewNumber(this.depth) && this.getViewNumber(this.start) >= this.getViewNumber(this.depth)) {\n detach(this.tableBodyElement);\n this.currentDate = d;\n this.effect = ZOOMIN;\n this.renderMonths(e);\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n this.currentDate.setMonth(d.getMonth());\n if (d.getMonth() > 0 && this.currentDate.getMonth() !== d.getMonth()) {\n this.currentDate.setDate(0);\n }\n this.currentDate.setFullYear(d.getFullYear());\n }\n else {\n this.currentDate = d;\n }\n this.effect = ZOOMIN;\n detach(this.tableBodyElement);\n this.renderMonths(e);\n }\n break;\n case 1:\n if (currentView === this.getViewNumber(this.depth) && this.getViewNumber(this.start) >= this.getViewNumber(this.depth)) {\n this.selectDate(e, d, null);\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n this.currentDate.setFullYear(d.getFullYear());\n }\n else {\n this.islamicPreviousHeader = this.headerElement.textContent;\n var islamicDate = this.islamicModule.getIslamicDate(d);\n this.currentDate = this.islamicModule.toGregorian(islamicDate.year, islamicDate.month, 1);\n }\n this.effect = ZOOMIN;\n detach(this.tableBodyElement);\n this.renderYears(e);\n }\n }\n };\n CalendarBase.prototype.switchView = function (view, e, multiSelection, isCustomDate) {\n switch (view) {\n case 0:\n detach(this.tableBodyElement);\n this.renderMonths(e, null, isCustomDate);\n break;\n case 1:\n detach(this.tableBodyElement);\n this.renderYears(e);\n break;\n case 2:\n detach(this.tableBodyElement);\n this.renderDecades(e);\n }\n };\n /**\n * To get component name\n *\n * @returns {string} Returns the component name.\n * @private\n */\n CalendarBase.prototype.getModuleName = function () {\n return 'calendar';\n };\n /**\n *\n * @returns {void}\n\n */\n CalendarBase.prototype.requiredModules = function () {\n var modules = [];\n if (this.calendarMode === 'Islamic') {\n modules.push({ args: [this], member: 'islamic', name: 'Islamic' });\n }\n return modules;\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the properties to be maintained upon browser refresh.\n *\n * @returns {string}\n */\n CalendarBase.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Called internally if any of the property value changed.\n *\n * @param {CalendarBaseModel} newProp - Returns the dynamic property value of the component.\n * @param {CalendarBaseModel} oldProp - Returns the previous property value of the component.\n * @param {boolean} multiSelection - - Specifies whether multiple date selection is enabled or not.\n * @param {Date[]} values - Specifies the dates.\n * @returns {void}\n * @private\n */\n CalendarBase.prototype.onPropertyChanged = function (newProp, oldProp, multiSelection, values) {\n this.effect = '';\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'enableRtl':\n if (newProp.enableRtl) {\n if (this.getModuleName() === 'calendar') {\n this.element.classList.add('e-rtl');\n }\n else {\n this.calendarElement.classList.add('e-rtl');\n }\n }\n else {\n if (this.getModuleName() === 'calendar') {\n this.element.classList.remove('e-rtl');\n }\n else {\n this.calendarElement.classList.remove('e-rtl');\n }\n }\n break;\n case 'dayHeaderFormat':\n this.getCultureValues();\n if (this.getModuleName() !== 'datepicker') {\n this.createContentHeader();\n }\n else if (this.calendarElement) {\n this.createContentHeader();\n }\n this.adjustLongHeaderSize();\n break;\n case 'min':\n case 'max':\n this.rangeValidation(this.min, this.max);\n if (prop === 'min') {\n this.setProperties({ min: this.checkDateValue(new Date(this.checkValue(newProp.min))) }, true);\n }\n else {\n this.setProperties({ max: this.checkDateValue(new Date(this.checkValue(newProp.max))) }, true);\n }\n this.setProperties({ start: this.currentView() }, true);\n if (this.tableBodyElement) {\n detach(this.tableBodyElement);\n }\n this.minMaxUpdate();\n if (multiSelection) {\n this.validateValues(multiSelection, values);\n }\n if (this.getModuleName() !== 'datepicker') {\n this.createContentBody();\n }\n else if (this.calendarElement) {\n this.createContentBody();\n }\n if ((this.todayDate < this.min || this.max < this.todayDate) && (this.footer) && (this.todayElement)) {\n detach(this.todayElement);\n detach(this.footer);\n this.todayElement = this.footer = null;\n this.createContentFooter();\n }\n else {\n if ((this.footer) && (this.todayElement) && this.todayElement.classList.contains('e-disabled')) {\n removeClass([this.todayElement], DISABLED);\n detach(this.todayElement);\n detach(this.footer);\n this.todayElement = this.footer = null;\n this.createContentFooter();\n }\n }\n break;\n case 'start':\n case 'depth':\n case 'weekNumber':\n case 'firstDayOfWeek':\n case 'weekRule':\n this.checkView();\n if (this.getModuleName() !== 'datepicker') {\n this.createContentHeader();\n this.createContentBody();\n }\n else if (this.calendarElement) {\n this.createContentHeader();\n this.createContentBody();\n }\n break;\n case 'locale':\n this.globalize = new Internationalization(this.locale);\n if (this.getModuleName() !== 'datepicker') {\n this.createContentHeader();\n this.createContentBody();\n }\n else if (this.calendarElement) {\n this.createContentHeader();\n this.createContentBody();\n }\n if (this.getModuleName() === 'calendar') {\n var l10nLocale = { today: 'Today' };\n this.l10 = new L10n(this.getModuleName(), l10nLocale, this.locale);\n }\n this.l10.setLocale(this.locale);\n if (this.showTodayButton) {\n this.updateFooter();\n }\n break;\n case 'showTodayButton':\n if (newProp.showTodayButton) {\n this.createContentFooter();\n }\n else {\n if (!isNullOrUndefined(this.todayElement) && !isNullOrUndefined(this.footer)) {\n detach(this.todayElement);\n detach(this.footer);\n this.todayElement = this.footer = undefined;\n }\n }\n this.setProperties({ showTodayButton: newProp.showTodayButton }, true);\n break;\n }\n }\n };\n /**\n * values property updated with considered disabled dates of the calendar.\n *\n * @param {boolean} multiSelection - Specifies whether multiple date selection is enabled.\n * @param {Date[]} values - Specifies the dates to validate.\n * @returns {void}\n */\n CalendarBase.prototype.validateValues = function (multiSelection, values) {\n if (multiSelection && !isNullOrUndefined(values) && values.length > 0) {\n var copyValues = this.copyValues(values);\n for (var skipIndex = 0; skipIndex < copyValues.length; skipIndex++) {\n var tempValue = copyValues[skipIndex];\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var tempValueString = void 0;\n if (this.calendarMode === 'Gregorian') {\n tempValueString = this.globalize.formatDate(tempValue, { type: 'date', skeleton: 'yMd' });\n }\n else {\n tempValueString = this.globalize.formatDate(tempValue, { type: 'dateTime', skeleton: 'full', calendar: 'islamic' });\n }\n var minFormatOption = { type: 'date', skeleton: 'yMd', calendar: type };\n var minStringValue = this.globalize.formatDate(this.min, minFormatOption);\n var minString = minStringValue;\n var maxFormatOption = { type: 'date', skeleton: 'yMd', calendar: type };\n var maxStringValue = this.globalize.formatDate(this.max, maxFormatOption);\n var maxString = maxStringValue;\n if (+new Date(tempValueString) < +new Date(minString) ||\n +new Date(tempValueString) > +new Date(maxString)) {\n copyValues.splice(skipIndex, 1);\n skipIndex = -1;\n }\n }\n this.setProperties({ values: copyValues }, true);\n }\n };\n CalendarBase.prototype.setValueUpdate = function () {\n if (!isNullOrUndefined(this.tableBodyElement)) {\n detach(this.tableBodyElement);\n this.setProperties({ start: this.currentView() }, true);\n this.createContentBody();\n }\n };\n CalendarBase.prototype.copyValues = function (values) {\n var copyValues = [];\n if (!isNullOrUndefined(values) && values.length > 0) {\n for (var index = 0; index < values.length; index++) {\n copyValues.push(new Date(+values[index]));\n }\n }\n return copyValues;\n };\n CalendarBase.prototype.titleUpdate = function (date, view) {\n var globalize = new Internationalization(this.locale);\n var dayFormatOptions;\n var monthFormatOptions;\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n if (this.calendarMode === 'Gregorian') {\n dayFormatOptions = globalize.formatDate(date, { type: 'dateTime', skeleton: 'yMMMM', calendar: type });\n monthFormatOptions = globalize.formatDate(date, {\n format: null, type: 'dateTime', skeleton: 'y', calendar: type\n });\n }\n else {\n dayFormatOptions = globalize.formatDate(date, { type: 'dateTime', format: 'MMMM y', calendar: type });\n monthFormatOptions = globalize.formatDate(date, { type: 'dateTime', format: 'y', calendar: type });\n }\n switch (view) {\n case 'days':\n this.headerTitleElement.textContent = this.toCapitalize(dayFormatOptions);\n break;\n case 'months':\n this.headerTitleElement.textContent = monthFormatOptions;\n }\n };\n CalendarBase.prototype.setActiveDescendant = function () {\n var id;\n var focusedEle = this.tableBodyElement.querySelector('tr td.e-focused-date');\n var selectedEle = this.tableBodyElement.querySelector('tr td.e-selected');\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var title;\n var view = this.currentView();\n if (view === 'Month') {\n title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: 'full', calendar: type });\n }\n else if (view === 'Year') {\n if (type !== 'islamic') {\n title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: 'yMMMM', calendar: type });\n }\n else {\n title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: 'GyMMM', calendar: type });\n }\n }\n else {\n title = this.globalize.formatDate(this.currentDate, {\n format: null, type: 'date', skeleton: 'y', calendar: type\n });\n }\n if (selectedEle || focusedEle) {\n if (!isNullOrUndefined(selectedEle)) {\n selectedEle.setAttribute('aria-selected', 'true');\n }\n (focusedEle || selectedEle).setAttribute('aria-label', title);\n id = (focusedEle || selectedEle).getAttribute('id');\n }\n return id;\n };\n CalendarBase.prototype.iconHandler = function () {\n new Date(this.checkValue(this.currentDate)).setDate(1);\n switch (this.currentView()) {\n case 'Month':\n this.previousIconHandler(this.compareMonth(new Date(this.checkValue(this.currentDate)), this.min) < 1);\n this.nextIconHandler(this.compareMonth(new Date(this.checkValue(this.currentDate)), this.max) > -1);\n break;\n case 'Year':\n this.previousIconHandler(this.compareYear(new Date(this.checkValue(this.currentDate)), this.min) < 1);\n this.nextIconHandler(this.compareYear(new Date(this.checkValue(this.currentDate)), this.max) > -1);\n break;\n case 'Decade':\n this.previousIconHandler(this.compareDecade(new Date(this.checkValue(this.currentDate)), this.min) < 1);\n this.nextIconHandler(this.compareDecade(new Date(this.checkValue(this.currentDate)), this.max) > -1);\n }\n };\n /**\n * Destroys the widget.\n *\n * @returns {void}\n */\n CalendarBase.prototype.destroy = function () {\n if (this.getModuleName() === 'calendar' && this.element) {\n removeClass([this.element], [ROOT]);\n }\n else {\n if (this.calendarElement && this.element) {\n removeClass([this.element], [ROOT]);\n }\n }\n if (this.getModuleName() === 'calendar' && this.element) {\n if (!isNullOrUndefined(this.headerTitleElement)) {\n EventHandler.remove(this.headerTitleElement, 'click', this.navigateTitle);\n }\n if (this.todayElement) {\n EventHandler.remove(this.todayElement, 'click', this.todayButtonClick);\n }\n this.previousIconHandler(true);\n this.nextIconHandler(true);\n this.keyboardModule.destroy();\n this.element.removeAttribute('data-role');\n if (!isNullOrUndefined(this.calendarEleCopy.getAttribute('tabindex'))) {\n this.element.setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.element.removeAttribute('tabindex');\n }\n }\n if (this.element) {\n this.element.innerHTML = '';\n }\n this.todayElement = null;\n this.tableBodyElement = null;\n this.todayButtonEvent = null;\n this.renderDayCellArgs = null;\n this.headerElement = null;\n this.nextIcon = null;\n this.table = null;\n this.tableHeadElement = null;\n this.previousIcon = null;\n this.headerTitleElement = null;\n this.footer = null;\n this.contentElement = null;\n _super.prototype.destroy.call(this);\n };\n CalendarBase.prototype.title = function (e) {\n var currentView = this.getViewNumber(this.currentView());\n this.effect = ZOOMIN;\n this.switchView(++currentView, e);\n };\n CalendarBase.prototype.getViewNumber = function (stringVal) {\n if (stringVal === 'Month') {\n return 0;\n }\n else if (stringVal === 'Year') {\n return 1;\n }\n else {\n return 2;\n }\n };\n CalendarBase.prototype.navigateTitle = function (e) {\n e.preventDefault();\n this.title(e);\n if (this.getModuleName() === 'calendar') {\n this.table.focus();\n }\n };\n CalendarBase.prototype.previous = function () {\n this.effect = '';\n var currentView = this.getViewNumber(this.currentView());\n switch (this.currentView()) {\n case 'Month':\n this.addMonths(this.currentDate, -1);\n this.switchView(currentView);\n break;\n case 'Year':\n this.addYears(this.currentDate, -1);\n this.switchView(currentView);\n break;\n case 'Decade':\n this.addYears(this.currentDate, -10);\n this.switchView(currentView);\n break;\n }\n };\n CalendarBase.prototype.navigatePrevious = function (e) {\n !Browser.isDevice && e.preventDefault();\n if (this.calendarMode === 'Gregorian') {\n this.previous();\n }\n else {\n this.islamicModule.islamicPrevious();\n }\n this.triggerNavigate(e);\n if (this.getModuleName() === 'calendar') {\n this.table.focus();\n }\n };\n CalendarBase.prototype.next = function () {\n this.effect = '';\n var currentView = this.getViewNumber(this.currentView());\n switch (this.currentView()) {\n case 'Month':\n this.addMonths(this.currentDate, 1);\n this.switchView(currentView);\n break;\n case 'Year':\n this.addYears(this.currentDate, 1);\n this.switchView(currentView);\n break;\n case 'Decade':\n this.addYears(this.currentDate, 10);\n this.switchView(currentView);\n break;\n }\n };\n CalendarBase.prototype.navigateNext = function (eve) {\n !Browser.isDevice && eve.preventDefault();\n if (this.calendarMode === 'Gregorian') {\n this.next();\n }\n else {\n this.islamicModule.islamicNext();\n }\n this.triggerNavigate(eve);\n if (this.getModuleName() === 'calendar') {\n this.table.focus();\n }\n };\n /**\n * This method is used to navigate to the month/year/decade view of the Calendar.\n *\n * @param {string} view - Specifies the view of the Calendar.\n * @param {Date} date - Specifies the focused date in a view.\n * @param {boolean} isCustomDate - Specifies whether the calendar is rendered with custom today date or not.\n * @returns {void}\n */\n CalendarBase.prototype.navigateTo = function (view, date, isCustomDate) {\n if (+date >= +this.min && +date <= +this.max) {\n this.currentDate = date;\n }\n if (+date <= +this.min) {\n this.currentDate = new Date(this.checkValue(this.min));\n }\n if (+date >= +this.max) {\n this.currentDate = new Date(this.checkValue(this.max));\n }\n if ((this.getViewNumber(this.depth) >= this.getViewNumber(view))) {\n if ((this.getViewNumber(this.depth) <= this.getViewNumber(this.start))\n || this.getViewNumber(this.depth) === this.getViewNumber(view)) {\n view = this.depth;\n }\n }\n this.switchView(this.getViewNumber(view), null, null, isCustomDate);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the current view of the Calendar.\n *\n * @returns {string}\n */\n CalendarBase.prototype.currentView = function () {\n if (!isNullOrUndefined(this.contentElement) && this.contentElement.classList.contains(YEAR)) {\n return 'Year';\n }\n else if (!isNullOrUndefined(this.contentElement) && this.contentElement.classList.contains(DECADE)) {\n return 'Decade';\n }\n else {\n return 'Month';\n }\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n CalendarBase.prototype.getDateVal = function (date, value) {\n return (!isNullOrUndefined(value) && date.getDate() === (value).getDate()\n && date.getMonth() === (value).getMonth() && date.getFullYear() === (value).getFullYear());\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n CalendarBase.prototype.getCultureObjects = function (ld, c) {\n var gregorianFormat = '.dates.calendars.gregorian.days.format.' + this.dayHeaderFormat.toLowerCase();\n var islamicFormat = '.dates.calendars.islamic.days.format.' + this.dayHeaderFormat.toLowerCase();\n var mainVal = 'main.';\n if (this.calendarMode === 'Gregorian') {\n return getValue(mainVal + '' + this.locale + gregorianFormat, ld);\n }\n else {\n return getValue('main.' + '' + this.locale + islamicFormat, ld);\n }\n };\n CalendarBase.prototype.getWeek = function (d) {\n var currentDate = new Date(this.checkValue(d)).valueOf();\n var date = new Date(d.getFullYear(), 0, 1).valueOf();\n return Math.ceil((((currentDate - date) + dayMilliSeconds) / dayMilliSeconds) / 7);\n };\n CalendarBase.prototype.setStartDate = function (date, time) {\n var tzOffset = date.getTimezoneOffset();\n var d = new Date(date.getTime() + time);\n var tzOffsetDiff = d.getTimezoneOffset() - tzOffset;\n date.setTime(d.getTime() + tzOffsetDiff * minutesMilliSeconds);\n };\n CalendarBase.prototype.addMonths = function (date, i) {\n if (this.calendarMode === 'Gregorian') {\n var day = date.getDate();\n date.setDate(1);\n date.setMonth(date.getMonth() + i);\n date.setDate(Math.min(day, this.getMaxDays(date)));\n }\n else {\n var islamicDate = this.islamicModule.getIslamicDate(date);\n this.currentDate = this.islamicModule.toGregorian(islamicDate.year, (islamicDate.month) + i, 1);\n }\n };\n CalendarBase.prototype.addYears = function (date, i) {\n if (this.calendarMode === 'Gregorian') {\n var day = date.getDate();\n date.setDate(1);\n date.setFullYear(date.getFullYear() + i);\n date.setDate(Math.min(day, this.getMaxDays(date)));\n }\n else {\n var islamicDate = this.islamicModule.getIslamicDate(date);\n this.currentDate = this.islamicModule.toGregorian(islamicDate.year + i, (islamicDate.month), 1);\n }\n };\n CalendarBase.prototype.getIdValue = function (e, element) {\n var eve;\n if (e) {\n eve = e.currentTarget;\n }\n else {\n eve = element;\n }\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var dateFormatOptions = { type: 'dateTime', skeleton: 'full', calendar: type };\n // eslint-disable-next-line radix\n var dateString = this.globalize.formatDate(new Date(parseInt('' + eve.getAttribute('id'), 0)), dateFormatOptions);\n var date = this.globalize.parseDate(dateString, dateFormatOptions);\n var value = date.valueOf() - date.valueOf() % 1000;\n return new Date(value);\n //return this.globalize.parseDate(dateString, dateFormatOptions);\n };\n CalendarBase.prototype.adjustLongHeaderSize = function () {\n removeClass([this.element], DAYHEADERLONG);\n if (this.dayHeaderFormat === 'Wide') {\n addClass([this.getModuleName() === 'calendar' ? this.element : this.calendarElement], DAYHEADERLONG);\n }\n };\n CalendarBase.prototype.selectDate = function (e, date, node, multiSelection, values) {\n var element = node || e.currentTarget;\n this.isDateSelected = false;\n if (this.currentView() === 'Decade') {\n this.setDateDecade(this.currentDate, date.getFullYear());\n }\n else if (this.currentView() === 'Year') {\n this.setDateYear(this.currentDate, date);\n }\n else {\n if (multiSelection && !this.checkPresentDate(date, values)) {\n var copyValues = this.copyValues(values);\n if (!isNullOrUndefined(values) && copyValues.length > 0) {\n copyValues.push(new Date(this.checkValue(date)));\n this.setProperties({ values: copyValues }, true);\n this.setProperties({ value: values[values.length - 1] }, true);\n }\n else {\n this.setProperties({ values: [new Date(this.checkValue(date))] }, true);\n }\n }\n else {\n this.setProperties({ value: new Date(this.checkValue(date)) }, true);\n }\n this.currentDate = new Date(this.checkValue(date));\n }\n var tableBodyElement = closest(element, '.' + ROOT);\n if (isNullOrUndefined(tableBodyElement)) {\n tableBodyElement = this.tableBodyElement;\n }\n if (!multiSelection && !isNullOrUndefined(tableBodyElement.querySelector('.' + SELECTED))) {\n removeClass([tableBodyElement.querySelector('.' + SELECTED)], SELECTED);\n }\n if (!multiSelection && !isNullOrUndefined(tableBodyElement.querySelector('.' + FOCUSEDDATE))) {\n removeClass([tableBodyElement.querySelector('.' + FOCUSEDDATE)], FOCUSEDDATE);\n }\n if (!multiSelection && !isNullOrUndefined(tableBodyElement.querySelector('.' + FOCUSEDCELL))) {\n removeClass([tableBodyElement.querySelector('.' + FOCUSEDCELL)], FOCUSEDCELL);\n }\n if (multiSelection) {\n var copyValues = this.copyValues(values);\n var collection = Array.prototype.slice.call(this.tableBodyElement.querySelectorAll('td'));\n for (var index = 0; index < collection.length; index++) {\n var tempElement = tableBodyElement.querySelectorAll('td' + '.' + FOCUSEDDATE)[0];\n var selectedElement = tableBodyElement.querySelectorAll('td' + '.' + SELECTED)[0];\n if (collection[index] === tempElement) {\n removeClass([collection[index]], FOCUSEDDATE);\n }\n if (collection[index] === selectedElement &&\n !this.checkPresentDate(new Date(parseInt(selectedElement.getAttribute('id').split('_')[0], 10)), values)) {\n removeClass([collection[index]], SELECTED);\n }\n }\n if (element.classList.contains(SELECTED)) {\n removeClass([element], SELECTED);\n for (var i = 0; i < copyValues.length; i++) {\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var formatOptions = { format: null, type: 'date', skeleton: 'short', calendar: type };\n var localDateString = this.globalize.formatDate(date, formatOptions);\n var tempDateString = this.globalize.formatDate(copyValues[i], formatOptions);\n if (localDateString === tempDateString) {\n var index = copyValues.indexOf(copyValues[i]);\n copyValues.splice(index, 1);\n addClass([element], FOCUSEDDATE);\n }\n }\n this.setProperties({ values: copyValues }, true);\n }\n else {\n addClass([element], SELECTED);\n }\n }\n else {\n addClass([element], SELECTED);\n }\n this.isDateSelected = true;\n };\n CalendarBase.prototype.checkPresentDate = function (dates, values) {\n var previousValue = false;\n if (!isNullOrUndefined(values)) {\n for (var checkPrevious = 0; checkPrevious < values.length; checkPrevious++) {\n var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';\n var localDateString = this.globalize.formatDate(dates, {\n format: null, type: 'date', skeleton: 'short', calendar: type\n });\n var tempDateString = this.globalize.formatDate(values[checkPrevious], {\n format: null, type: 'date', skeleton: 'short', calendar: type\n });\n if (localDateString === tempDateString) {\n previousValue = true;\n }\n }\n }\n return previousValue;\n };\n CalendarBase.prototype.setAriaActiveDescendant = function () {\n attributes(this.table, {\n 'aria-activedescendant': '' + this.setActiveDescendant()\n });\n };\n CalendarBase.prototype.previousIconHandler = function (disabled) {\n if (disabled) {\n if (!isNullOrUndefined(this.previousIcon)) {\n EventHandler.remove(this.previousIcon, 'click', this.navigatePreviousHandler);\n addClass([this.previousIcon], '' + DISABLED);\n addClass([this.previousIcon], '' + OVERLAY);\n this.previousIcon.setAttribute('aria-disabled', 'true');\n }\n }\n else {\n EventHandler.add(this.previousIcon, 'click', this.navigatePreviousHandler);\n removeClass([this.previousIcon], '' + DISABLED);\n removeClass([this.previousIcon], '' + OVERLAY);\n this.previousIcon.setAttribute('aria-disabled', 'false');\n }\n };\n CalendarBase.prototype.renderDayCellEvent = function (args) {\n extend(this.renderDayCellArgs, { name: 'renderDayCell' });\n this.trigger('renderDayCell', args);\n };\n CalendarBase.prototype.navigatedEvent = function (eve) {\n extend(this.navigatedArgs, { name: 'navigated', event: eve });\n this.trigger('navigated', this.navigatedArgs);\n };\n CalendarBase.prototype.triggerNavigate = function (event) {\n this.navigatedArgs = { view: this.currentView(), date: this.currentDate };\n this.navigatedEvent(event);\n };\n CalendarBase.prototype.nextIconHandler = function (disabled) {\n if (disabled) {\n if (!isNullOrUndefined(this.previousIcon)) {\n EventHandler.remove(this.nextIcon, 'click', this.navigateNextHandler);\n addClass([this.nextIcon], DISABLED);\n addClass([this.nextIcon], OVERLAY);\n this.nextIcon.setAttribute('aria-disabled', 'true');\n }\n }\n else {\n EventHandler.add(this.nextIcon, 'click', this.navigateNextHandler);\n removeClass([this.nextIcon], DISABLED);\n removeClass([this.nextIcon], OVERLAY);\n this.nextIcon.setAttribute('aria-disabled', 'false');\n }\n };\n CalendarBase.prototype.compare = function (startDate, endDate, modifier) {\n var start = endDate.getFullYear();\n var end;\n var result;\n end = start;\n result = 0;\n if (modifier) {\n start = start - start % modifier;\n end = start - start % modifier + modifier - 1;\n }\n if (startDate.getFullYear() > end) {\n result = 1;\n }\n else if (startDate.getFullYear() < start) {\n result = -1;\n }\n return result;\n };\n CalendarBase.prototype.isMinMaxRange = function (date) {\n return +date >= +this.min && +date <= +this.max;\n };\n CalendarBase.prototype.isMonthYearRange = function (date) {\n if (this.calendarMode === 'Gregorian') {\n return date.getMonth() >= this.min.getMonth()\n && date.getFullYear() >= this.min.getFullYear()\n && date.getMonth() <= this.max.getMonth()\n && date.getFullYear() <= this.max.getFullYear();\n }\n else {\n var islamicDate = this.islamicModule.getIslamicDate(date);\n return islamicDate.month >= (this.islamicModule.getIslamicDate(new Date(1944, 1, 18))).month\n && islamicDate.year >= (this.islamicModule.getIslamicDate(new Date(1944, 1, 18))).year\n && islamicDate.month <= (this.islamicModule.getIslamicDate(new Date(2069, 1, 16))).month\n && islamicDate.year <= (this.islamicModule.getIslamicDate(new Date(2069, 1, 16))).year;\n }\n };\n CalendarBase.prototype.compareYear = function (start, end) {\n return this.compare(start, end, 0);\n };\n CalendarBase.prototype.compareDecade = function (start, end) {\n return this.compare(start, end, 10);\n };\n CalendarBase.prototype.shiftArray = function (array, i) {\n return array.slice(i).concat(array.slice(0, i));\n };\n CalendarBase.prototype.addDay = function (date, i, e, max, min) {\n var column = i;\n var value = new Date(+date);\n if (!isNullOrUndefined(this.tableBodyElement) && !isNullOrUndefined(e)) {\n while (this.findNextTD(new Date(+date), column, max, min)) {\n column += i;\n }\n var rangeValue = new Date(value.setDate(value.getDate() + column));\n column = (+rangeValue > +max || +rangeValue < +min) ? column === i ? i - i : i : column;\n }\n date.setDate(date.getDate() + column);\n };\n CalendarBase.prototype.findNextTD = function (date, column, max, min) {\n var value = new Date(date.setDate(date.getDate() + column));\n var collection = [];\n var isDisabled = false;\n if ((!isNullOrUndefined(value) && value.getMonth()) === (!isNullOrUndefined(this.currentDate) && this.currentDate.getMonth())) {\n var tdEles = void 0;\n if (this.calendarMode === 'Gregorian') {\n tdEles = this.renderDays(value);\n }\n else {\n tdEles = this.islamicModule.islamicRenderDays(this.currentDate, value);\n }\n collection = tdEles.filter(function (element) {\n return element.classList.contains(DISABLED);\n });\n }\n else {\n collection = this.tableBodyElement.querySelectorAll('td.' + DISABLED);\n }\n if (+value <= (+(max)) && +value >= (+(min))) {\n if (collection.length) {\n for (var i = 0; i < collection.length; i++) {\n // eslint-disable-next-line radix\n isDisabled = (+value === +new Date(parseInt(collection[i].id, 0))) ? true : false;\n if (isDisabled) {\n break;\n }\n }\n }\n }\n return isDisabled;\n };\n CalendarBase.prototype.getMaxDays = function (d) {\n var date;\n var tmpDate = new Date(this.checkValue(d));\n date = 28;\n var month = tmpDate.getMonth();\n while (tmpDate.getMonth() === month) {\n ++date;\n tmpDate.setDate(date);\n }\n return date - 1;\n };\n CalendarBase.prototype.setDateDecade = function (date, year) {\n date.setFullYear(year);\n this.setProperties({ value: new Date(this.checkValue(date)) }, true);\n };\n CalendarBase.prototype.setDateYear = function (date, value) {\n date.setFullYear(value.getFullYear(), value.getMonth(), date.getDate());\n if (value.getMonth() !== date.getMonth()) {\n date.setDate(0);\n this.currentDate = new Date(this.checkValue(value));\n }\n this.setProperties({ value: new Date(this.checkValue(date)) }, true);\n };\n CalendarBase.prototype.compareMonth = function (start, end) {\n var result;\n if (start.getFullYear() > end.getFullYear()) {\n result = 1;\n }\n else if (start.getFullYear() < end.getFullYear()) {\n result = -1;\n }\n else {\n result = start.getMonth() === end.getMonth() ? 0 : start.getMonth() > end.getMonth() ? 1 : -1;\n }\n return result;\n };\n CalendarBase.prototype.checkValue = function (inValue) {\n if (inValue instanceof Date) {\n return (inValue.toUTCString());\n }\n else {\n return ('' + inValue);\n }\n };\n CalendarBase.prototype.checkView = function () {\n if (this.start !== 'Decade' && this.start !== 'Year') {\n this.setProperties({ start: 'Month' }, true);\n }\n if (this.depth !== 'Decade' && this.depth !== 'Year') {\n this.setProperties({ depth: 'Month' }, true);\n }\n if (this.getViewNumber(this.depth) > this.getViewNumber(this.start)) {\n this.setProperties({ depth: 'Month' }, true);\n }\n };\n CalendarBase.prototype.getDate = function (date, timezone) {\n if (timezone) {\n date = new Date(date.toLocaleString('en-US', { timeZone: timezone }));\n }\n return date;\n };\n __decorate([\n Property(new Date(1900, 0, 1))\n ], CalendarBase.prototype, \"min\", void 0);\n __decorate([\n Property(true)\n ], CalendarBase.prototype, \"enabled\", void 0);\n __decorate([\n Property(null)\n ], CalendarBase.prototype, \"cssClass\", void 0);\n __decorate([\n Property(new Date(2099, 11, 31))\n ], CalendarBase.prototype, \"max\", void 0);\n __decorate([\n Property(null)\n ], CalendarBase.prototype, \"firstDayOfWeek\", void 0);\n __decorate([\n Property('Gregorian')\n ], CalendarBase.prototype, \"calendarMode\", void 0);\n __decorate([\n Property('Month')\n ], CalendarBase.prototype, \"start\", void 0);\n __decorate([\n Property('Month')\n ], CalendarBase.prototype, \"depth\", void 0);\n __decorate([\n Property(false)\n ], CalendarBase.prototype, \"weekNumber\", void 0);\n __decorate([\n Property('FirstDay')\n ], CalendarBase.prototype, \"weekRule\", void 0);\n __decorate([\n Property(true)\n ], CalendarBase.prototype, \"showTodayButton\", void 0);\n __decorate([\n Property('Short')\n ], CalendarBase.prototype, \"dayHeaderFormat\", void 0);\n __decorate([\n Property(false)\n ], CalendarBase.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(null)\n ], CalendarBase.prototype, \"keyConfigs\", void 0);\n __decorate([\n Property(null)\n ], CalendarBase.prototype, \"serverTimezoneOffset\", void 0);\n __decorate([\n Event()\n ], CalendarBase.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], CalendarBase.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], CalendarBase.prototype, \"navigated\", void 0);\n __decorate([\n Event()\n ], CalendarBase.prototype, \"renderDayCell\", void 0);\n CalendarBase = __decorate([\n NotifyPropertyChanges\n ], CalendarBase);\n return CalendarBase;\n}(Component));\nexport { CalendarBase };\n/**\n * Represents the Calendar component that allows the user to select a date.\n * ```html\n *
    \n * ```\n * ```typescript\n * \n * ```\n */\nvar Calendar = /** @class */ (function (_super) {\n __extends(Calendar, _super);\n /**\n * Initialized new instance of Calendar Class.\n * Constructor for creating the widget\n *\n * @param {CalendarModel} options - Specifies the Calendar model.\n * @param {string | HTMLElement} element - Specifies the element to render as component.\n * @private\n */\n function Calendar(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * To Initialize the control rendering.\n *\n * @returns {void}\n * @private\n */\n Calendar.prototype.render = function () {\n if (this.calendarMode === 'Islamic' && this.islamicModule === undefined) {\n throwError('Requires the injectable Islamic modules to render Calendar in Islamic mode');\n }\n if (this.isMultiSelection && typeof this.values === 'object' && !isNullOrUndefined(this.values) && this.values.length > 0) {\n var tempValues = [];\n var copyValues = [];\n for (var limit = 0; limit < this.values.length; limit++) {\n if (tempValues.indexOf(+this.values[limit]) === -1) {\n tempValues.push(+this.values[limit]);\n copyValues.push(this.values[limit]);\n }\n }\n this.setProperties({ values: copyValues }, true);\n for (var index = 0; index < this.values.length; index++) {\n if (!this.checkDateValue(this.values[index])) {\n if (typeof (this.values[index]) === 'string' && this.checkDateValue(new Date(this.checkValue(this.values[index])))) {\n var copyDate = new Date(this.checkValue(this.values[index]));\n this.values.splice(index, 1);\n this.values.splice(index, 0, copyDate);\n }\n else {\n this.values.splice(index, 1);\n }\n }\n }\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n this.previousValues = this.values.length;\n }\n this.validateDate();\n this.minMaxUpdate();\n if (this.getModuleName() === 'calendar') {\n this.setEnable(this.enabled);\n this.setClass(this.cssClass);\n }\n _super.prototype.render.call(this);\n if (this.getModuleName() === 'calendar') {\n var form = closest(this.element, 'form');\n if (form) {\n EventHandler.add(form, 'reset', this.formResetHandler.bind(this));\n }\n this.setTimeZone(this.serverTimezoneOffset);\n }\n this.renderComplete();\n };\n Calendar.prototype.setEnable = function (enable) {\n if (!enable) {\n addClass([this.element], DISABLED);\n }\n else {\n removeClass([this.element], DISABLED);\n }\n };\n Calendar.prototype.setClass = function (newCssClass, oldCssClass) {\n if (!isNullOrUndefined(oldCssClass)) {\n oldCssClass = (oldCssClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(newCssClass)) {\n newCssClass = (newCssClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(oldCssClass) && oldCssClass !== '') {\n removeClass([this.element], oldCssClass.split(' '));\n }\n if (!isNullOrUndefined(newCssClass)) {\n addClass([this.element], newCssClass.split(' '));\n }\n };\n Calendar.prototype.isDayLightSaving = function () {\n var secondOffset = new Date(this.value.getFullYear(), 6, 1).getTimezoneOffset();\n var firstOffset = new Date(this.value.getFullYear(), 0, 1).getTimezoneOffset();\n return (this.value.getTimezoneOffset() < Math.max(firstOffset, secondOffset));\n };\n Calendar.prototype.setTimeZone = function (offsetValue) {\n if (!isNullOrUndefined(this.serverTimezoneOffset) && this.value) {\n var serverTimezoneDiff = offsetValue;\n var clientTimeZoneDiff = new Date().getTimezoneOffset() / 60;\n var timeZoneDiff = serverTimezoneDiff + clientTimeZoneDiff;\n timeZoneDiff = this.isDayLightSaving() ? timeZoneDiff-- : timeZoneDiff;\n this.value = new Date(this.value.getTime() + (timeZoneDiff * 60 * 60 * 1000));\n }\n };\n Calendar.prototype.formResetHandler = function () {\n this.setProperties({ value: null }, true);\n };\n Calendar.prototype.validateDate = function () {\n if (typeof this.value === 'string') {\n this.setProperties({ value: this.checkDateValue(new Date(this.checkValue(this.value))) }, true); // persist the value property.\n }\n _super.prototype.validateDate.call(this, this.value);\n if (!isNullOrUndefined(this.value) && this.min <= this.max && this.value >= this.min && this.value <= this.max) {\n this.currentDate = new Date(this.checkValue(this.value));\n }\n if (isNaN(+this.value)) {\n this.setProperties({ value: null }, true);\n }\n };\n Calendar.prototype.minMaxUpdate = function () {\n if (this.getModuleName() === 'calendar') {\n if (!isNullOrUndefined(this.value) && this.value <= this.min && this.min <= this.max) {\n this.setProperties({ value: this.min }, true);\n this.changedArgs = { value: this.value };\n }\n else {\n if (!isNullOrUndefined(this.value) && this.value >= this.max && this.min <= this.max) {\n this.setProperties({ value: this.max }, true);\n this.changedArgs = { value: this.value };\n }\n }\n }\n if (this.getModuleName() !== 'calendar' && !isNullOrUndefined(this.value)) {\n if (!isNullOrUndefined(this.value) && this.value < this.min && this.min <= this.max) {\n _super.prototype.minMaxUpdate.call(this, this.min);\n }\n else {\n if (!isNullOrUndefined(this.value) && this.value > this.max && this.min <= this.max) {\n _super.prototype.minMaxUpdate.call(this, this.max);\n }\n }\n }\n else {\n _super.prototype.minMaxUpdate.call(this, this.value);\n }\n };\n Calendar.prototype.generateTodayVal = function (value) {\n var tempValue = new Date();\n if (!isNullOrUndefined(this.timezone)) {\n tempValue = _super.prototype.getDate.call(this, tempValue, this.timezone);\n }\n if (value && isNullOrUndefined(this.timezone)) {\n tempValue.setHours(value.getHours());\n tempValue.setMinutes(value.getMinutes());\n tempValue.setSeconds(value.getSeconds());\n tempValue.setMilliseconds(value.getMilliseconds());\n }\n else {\n tempValue = new Date(tempValue.getFullYear(), tempValue.getMonth(), tempValue.getDate(), 0, 0, 0, 0);\n }\n return tempValue;\n };\n Calendar.prototype.todayButtonClick = function (e) {\n if (this.showTodayButton) {\n var tempValue = this.generateTodayVal(this.value);\n this.setProperties({ value: tempValue }, true);\n this.isTodayClicked = true;\n this.todayButtonEvent = e;\n if (this.isMultiSelection) {\n var copyValues = this.copyValues(this.values);\n if (!_super.prototype.checkPresentDate.call(this, tempValue, this.values)) {\n copyValues.push(tempValue);\n this.setProperties({ values: copyValues });\n }\n }\n _super.prototype.todayButtonClick.call(this, e, new Date(+this.value));\n }\n };\n Calendar.prototype.keyActionHandle = function (e) {\n _super.prototype.keyActionHandle.call(this, e, this.value, this.isMultiSelection);\n };\n /**\n * Initialize the event handler\n *\n * @returns {void}\n * @private\n */\n Calendar.prototype.preRender = function () {\n var _this = this;\n this.changeHandler = function (e) {\n _this.triggerChange(e);\n };\n this.checkView();\n _super.prototype.preRender.call(this, this.value);\n };\n /**\n * @returns {void}\n\n */\n Calendar.prototype.createContent = function () {\n this.previousDate = this.value;\n this.previousDateTime = this.value;\n _super.prototype.createContent.call(this);\n };\n Calendar.prototype.minMaxDate = function (localDate) {\n return _super.prototype.minMaxDate.call(this, localDate);\n };\n Calendar.prototype.renderMonths = function (e, value, isCustomDate) {\n _super.prototype.renderMonths.call(this, e, this.value, isCustomDate);\n };\n Calendar.prototype.renderDays = function (currentDate, value, isMultiSelect, values, isCustomDate, e) {\n var tempDays = _super.prototype.renderDays.call(this, currentDate, this.value, this.isMultiSelection, this.values, isCustomDate, e);\n if (this.isMultiSelection) {\n _super.prototype.validateValues.call(this, this.isMultiSelection, this.values);\n }\n return tempDays;\n };\n Calendar.prototype.renderYears = function (e) {\n if (this.calendarMode === 'Gregorian') {\n _super.prototype.renderYears.call(this, e, this.value);\n }\n else {\n this.islamicModule.islamicRenderYears(e, this.value);\n }\n };\n Calendar.prototype.renderDecades = function (e) {\n if (this.calendarMode === 'Gregorian') {\n _super.prototype.renderDecades.call(this, e, this.value);\n }\n else {\n this.islamicModule.islamicRenderDecade(e, this.value);\n }\n };\n Calendar.prototype.renderTemplate = function (elements, count, classNm, e) {\n if (this.calendarMode === 'Gregorian') {\n _super.prototype.renderTemplate.call(this, elements, count, classNm, e, this.value);\n }\n else {\n this.islamicModule.islamicRenderTemplate(elements, count, classNm, e, this.value);\n }\n this.changedArgs = { value: this.value, values: this.values };\n e && e.type === 'click' && e.currentTarget.classList.contains(OTHERMONTH) ? this.changeHandler(e) : this.changeHandler();\n };\n Calendar.prototype.clickHandler = function (e) {\n var eve = e.currentTarget;\n this.isPopupClicked = true;\n if (eve.classList.contains(OTHERMONTH)) {\n if (this.isMultiSelection) {\n var copyValues = this.copyValues(this.values);\n if (copyValues.toString().indexOf(this.getIdValue(e, null).toString()) === -1) {\n copyValues.push(this.getIdValue(e, null));\n this.setProperties({ values: copyValues }, true);\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n else {\n this.previousDates = true;\n }\n }\n else {\n this.setProperties({ value: this.getIdValue(e, null) }, true);\n }\n }\n var storeView = this.currentView();\n _super.prototype.clickHandler.call(this, e, this.value);\n if (this.isMultiSelection && this.currentDate !== this.value &&\n !isNullOrUndefined(this.tableBodyElement.querySelectorAll('.' + FOCUSEDDATE)[0]) && storeView === 'Year') {\n this.tableBodyElement.querySelectorAll('.' + FOCUSEDDATE)[0].classList.remove(FOCUSEDDATE);\n }\n };\n Calendar.prototype.switchView = function (view, e, isMultiSelection, isCustomDate) {\n _super.prototype.switchView.call(this, view, e, this.isMultiSelection, isCustomDate);\n };\n /**\n * To get component name\n *\n * @returns {string} Return the component name.\n * @private\n */\n Calendar.prototype.getModuleName = function () {\n _super.prototype.getModuleName.call(this);\n return 'calendar';\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the properties to be maintained upon browser refresh.\n *\n * @returns {string}\n */\n Calendar.prototype.getPersistData = function () {\n _super.prototype.getPersistData.call(this);\n var keyEntity = ['value', 'values'];\n return this.addOnPersist(keyEntity);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Called internally if any of the property value changed.\n *\n * @param {CalendarModel} newProp - Returns the dynamic property value of the component.\n * @param {CalendarModel} oldProp - Returns the previous property value of the component.\n * @returns {void}\n * @private\n */\n Calendar.prototype.onPropertyChanged = function (newProp, oldProp) {\n this.effect = '';\n this.rangeValidation(this.min, this.max);\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'value':\n if (this.isDateSelected) {\n if (typeof newProp.value === 'string') {\n this.setProperties({ value: new Date(this.checkValue(newProp.value)) }, true);\n }\n else {\n newProp.value = new Date(this.checkValue(newProp.value));\n }\n if (isNaN(+this.value)) {\n this.setProperties({ value: oldProp.value }, true);\n }\n this.update();\n }\n break;\n case 'values':\n if (this.isDateSelected) {\n if (typeof newProp.values === 'string' || typeof newProp.values === 'number') {\n this.setProperties({ values: null }, true);\n }\n else {\n var copyValues = this.copyValues(this.values);\n for (var index = 0; index < copyValues.length; index++) {\n var tempDate = copyValues[index];\n if (this.checkDateValue(tempDate) && !_super.prototype.checkPresentDate.call(this, tempDate, copyValues)) {\n copyValues.push(tempDate);\n }\n }\n this.setProperties({ values: copyValues }, true);\n if (this.values.length > 0) {\n this.setProperties({ value: newProp.values[newProp.values.length - 1] }, true);\n }\n }\n this.validateValues(this.isMultiSelection, this.values);\n this.update();\n }\n break;\n case 'isMultiSelection':\n if (this.isDateSelected) {\n this.setProperties({ isMultiSelection: newProp.isMultiSelection }, true);\n this.update();\n }\n break;\n case 'enabled':\n this.setEnable(this.enabled);\n break;\n case 'cssClass':\n if (this.getModuleName() === 'calendar') {\n this.setClass(newProp.cssClass, oldProp.cssClass);\n }\n break;\n default:\n _super.prototype.onPropertyChanged.call(this, newProp, oldProp, this.isMultiSelection, this.values);\n }\n }\n this.preventChange = this.isAngular && this.preventChange ? !this.preventChange : this.preventChange;\n };\n /**\n * Destroys the widget.\n *\n * @returns {void}\n */\n Calendar.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n if (this.getModuleName() === 'calendar') {\n this.changedArgs = null;\n var form = closest(this.element, 'form');\n if (form) {\n EventHandler.remove(form, 'reset', this.formResetHandler.bind(this));\n }\n }\n };\n /**\n * This method is used to navigate to the month/year/decade view of the Calendar.\n *\n * @param {string} view - Specifies the view of the Calendar.\n * @param {Date} date - Specifies the focused date in a view.\n * @param {boolean} isCustomDate - Specifies whether the calendar is rendered with custom today date or not.\n * @returns {void}\n\n */\n Calendar.prototype.navigateTo = function (view, date, isCustomDate) {\n this.minMaxUpdate();\n _super.prototype.navigateTo.call(this, view, date, isCustomDate);\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the current view of the Calendar.\n *\n * @returns {string}\n\n */\n Calendar.prototype.currentView = function () {\n return _super.prototype.currentView.call(this);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * This method is used to add the single or multiple dates to the values property of the Calendar.\n *\n * @param {Date | Date[]} dates - Specifies the date or dates to be added to the values property of the Calendar.\n * @returns {void}\n\n */\n Calendar.prototype.addDate = function (dates) {\n if (typeof dates !== 'string' && typeof dates !== 'number') {\n var copyValues = this.copyValues(this.values);\n if (typeof dates === 'object' && (dates).length > 0) {\n var tempDates = dates;\n for (var i = 0; i < tempDates.length; i++) {\n if (this.checkDateValue(tempDates[i]) && !_super.prototype.checkPresentDate.call(this, tempDates[i], copyValues)) {\n if (!isNullOrUndefined(copyValues) && copyValues.length > 0) {\n copyValues.push(tempDates[i]);\n }\n else {\n copyValues = [new Date(+tempDates[i])];\n }\n }\n }\n }\n else {\n if (this.checkDateValue(dates) && !_super.prototype.checkPresentDate.call(this, dates, copyValues)) {\n if (!isNullOrUndefined(copyValues) && copyValues.length > 0) {\n copyValues.push((dates));\n }\n else {\n copyValues = [new Date(+dates)];\n }\n }\n }\n this.setProperties({ values: copyValues }, true);\n if (this.isMultiSelection) {\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n this.validateValues(this.isMultiSelection, copyValues);\n this.update();\n this.changedArgs = { value: this.value, values: this.values };\n this.changeHandler();\n }\n };\n /**\n * This method is used to remove the single or multiple dates from the values property of the Calendar.\n *\n * @param {Date | Date[]} dates - Specifies the date or dates which need to be removed from the values property of the Calendar.\n * @returns {void}\n\n */\n Calendar.prototype.removeDate = function (dates) {\n if (typeof dates !== 'string' && typeof dates !== 'number' && !isNullOrUndefined(this.values) && this.values.length > 0) {\n var copyValues = this.copyValues(this.values);\n if (typeof dates === 'object' && ((dates).length > 0)) {\n var tempDates = dates;\n for (var index = 0; index < tempDates.length; index++) {\n for (var i = 0; i < copyValues.length; i++) {\n if (+copyValues[i] === +tempDates[index]) {\n copyValues.splice(i, 1);\n }\n }\n }\n }\n else {\n for (var i = 0; i < copyValues.length; i++) {\n if (+copyValues[i] === +dates) {\n copyValues.splice(i, 1);\n }\n }\n }\n this.setProperties({ values: copyValues }, false);\n this.update();\n if (this.isMultiSelection) {\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n this.changedArgs = { value: this.value, values: this.values };\n this.changeHandler();\n }\n };\n /**\n * To set custom today date in calendar\n *\n * @param {Date} date - Specifies date value to be set.\n * @private\n * @returns {void}\n */\n Calendar.prototype.setTodayDate = function (date) {\n var todayDate = new Date(+date);\n this.setProperties({ value: todayDate }, true);\n _super.prototype.todayButtonClick.call(this, null, todayDate, true);\n };\n Calendar.prototype.update = function () {\n this.validateDate();\n this.minMaxUpdate();\n _super.prototype.setValueUpdate.call(this);\n };\n Calendar.prototype.selectDate = function (e, date, element) {\n _super.prototype.selectDate.call(this, e, date, element, this.isMultiSelection, this.values);\n if (this.isMultiSelection && !isNullOrUndefined(this.values) && this.values.length > 0) {\n this.setProperties({ value: this.values[this.values.length - 1] }, true);\n }\n this.changedArgs = { value: this.value, values: this.values };\n this.changeHandler(e);\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Calendar.prototype.changeEvent = function (e) {\n if ((this.value && this.value.valueOf()) !== (this.previousDate && +this.previousDate.valueOf())\n || this.isMultiSelection) {\n if (this.isAngular && this.preventChange) {\n this.preventChange = false;\n }\n else {\n this.trigger('change', this.changedArgs);\n }\n this.previousDate = new Date(+this.value);\n }\n };\n Calendar.prototype.triggerChange = function (e) {\n if (!isNullOrUndefined(this.todayButtonEvent) && this.isTodayClicked) {\n e = this.todayButtonEvent;\n this.isTodayClicked = false;\n }\n this.changedArgs.event = e || null;\n this.changedArgs.isInteracted = !isNullOrUndefined(e);\n if (!isNullOrUndefined(this.value)) {\n this.setProperties({ value: this.value }, true);\n }\n // eslint-disable-next-line use-isnan\n if (!this.isMultiSelection && +this.value !== Number.NaN && (!isNullOrUndefined(this.value) &&\n !isNullOrUndefined(this.previousDate) || this.previousDate === null\n && !isNaN(+this.value))) {\n this.changeEvent(e);\n }\n else if (!isNullOrUndefined(this.values) && this.previousValues !== this.values.length) {\n this.changeEvent(e);\n this.previousValues = this.values.length;\n }\n };\n __decorate([\n Property(null)\n ], Calendar.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], Calendar.prototype, \"values\", void 0);\n __decorate([\n Property(false)\n ], Calendar.prototype, \"isMultiSelection\", void 0);\n __decorate([\n Event()\n ], Calendar.prototype, \"change\", void 0);\n Calendar = __decorate([\n NotifyPropertyChanges\n ], Calendar);\n return Calendar;\n}(CalendarBase));\nexport { Calendar };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n/// \nimport { EventHandler, Property, Internationalization, NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { KeyboardEvents, Animation, Event, extend, L10n, Browser, formatUnit } from '@syncfusion/ej2-base';\nimport { detach, addClass, removeClass, closest, attributes, Touch } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, setValue, getUniqueID } from '@syncfusion/ej2-base';\nimport { Popup } from '@syncfusion/ej2-popups';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { Calendar } from '../calendar/calendar';\n//class constant defination\nvar DATEWRAPPER = 'e-date-wrapper';\nvar ROOT = 'e-datepicker';\nvar LIBRARY = 'e-lib';\nvar CONTROL = 'e-control';\nvar POPUPWRAPPER = 'e-popup-wrapper';\nvar INPUTWRAPPER = 'e-input-group-icon';\nvar POPUP = 'e-popup';\nvar INPUTCONTAINER = 'e-input-group';\nvar INPUTFOCUS = 'e-input-focus';\nvar INPUTROOT = 'e-input';\nvar ERROR = 'e-error';\nvar ACTIVE = 'e-active';\nvar OVERFLOW = 'e-date-overflow';\nvar DATEICON = 'e-date-icon';\nvar CLEARICON = 'e-clear-icon';\nvar ICONS = 'e-icons';\nvar OPENDURATION = 300;\nvar OFFSETVALUE = 4;\nvar SELECTED = 'e-selected';\nvar FOCUSEDDATE = 'e-focused-date';\nvar NONEDIT = 'e-non-edit';\nvar containerAttr = ['title', 'class', 'style'];\n/**\n * Represents the DatePicker component that allows user to select\n * or enter a date value.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar DatePicker = /** @class */ (function (_super) {\n __extends(DatePicker, _super);\n /**\n * Constructor for creating the widget.\n *\n * @param {DatePickerModel} options - Specifies the DatePicker model.\n * @param {string | HTMLInputElement} element - Specifies the element to render as component.\n * @private\n */\n function DatePicker(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isDateIconClicked = false;\n _this.isAltKeyPressed = false;\n _this.isInteracted = true;\n _this.invalidValueString = null;\n _this.checkPreviousValue = null;\n _this.maskedDateValue = '';\n _this.isAngular = false;\n _this.preventChange = false;\n _this.isIconClicked = false;\n _this.isDynamicValueChanged = false;\n _this.moduleName = _this.getModuleName();\n _this.isFocused = false;\n _this.isBlur = false;\n _this.isKeyAction = false;\n _this.datepickerOptions = options;\n return _this;\n }\n /**\n * To Initialize the control rendering.\n *\n * @returns {void}\n * @private\n */\n DatePicker.prototype.render = function () {\n this.initialize();\n this.bindEvents();\n if (this.floatLabelType !== 'Never') {\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n }\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {\n this.enabled = false;\n }\n this.renderComplete();\n this.setTimeZone(this.serverTimezoneOffset);\n };\n DatePicker.prototype.setTimeZone = function (offsetValue) {\n if (!isNullOrUndefined(this.serverTimezoneOffset) && this.value) {\n var clientTimeZoneDiff = new Date().getTimezoneOffset() / 60;\n var serverTimezoneDiff = offsetValue;\n var timeZoneDiff = serverTimezoneDiff + clientTimeZoneDiff;\n timeZoneDiff = this.isDayLightSaving() ? timeZoneDiff-- : timeZoneDiff;\n this.value = new Date((this.value).getTime() + (timeZoneDiff * 60 * 60 * 1000));\n this.updateInput();\n }\n };\n DatePicker.prototype.isDayLightSaving = function () {\n var firstOffset = new Date(this.value.getFullYear(), 0, 1).getTimezoneOffset();\n var secondOffset = new Date(this.value.getFullYear(), 6, 1).getTimezoneOffset();\n return (this.value.getTimezoneOffset() < Math.max(firstOffset, secondOffset));\n };\n DatePicker.prototype.setAllowEdit = function () {\n if (this.allowEdit) {\n if (!this.readonly) {\n this.inputElement.removeAttribute('readonly');\n }\n }\n else {\n attributes(this.inputElement, { 'readonly': '' });\n }\n this.updateIconState();\n };\n DatePicker.prototype.updateIconState = function () {\n if (!this.allowEdit && this.inputWrapper && !this.readonly) {\n if (this.inputElement.value === '') {\n removeClass([this.inputWrapper.container], [NONEDIT]);\n }\n else {\n addClass([this.inputWrapper.container], [NONEDIT]);\n }\n }\n else if (this.inputWrapper) {\n removeClass([this.inputWrapper.container], [NONEDIT]);\n }\n };\n DatePicker.prototype.initialize = function () {\n this.checkInvalidValue(this.value);\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n this.createInput();\n this.updateHtmlAttributeToWrapper();\n this.setAllowEdit();\n if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType === 'Always' || !this.floatLabelType || !this.placeholder)) {\n this.updateInput(true);\n this.updateInputValue(this.maskedDateValue);\n }\n else if (!this.enableMask) {\n this.updateInput(true);\n }\n this.previousElementValue = this.inputElement.value;\n this.previousDate = !isNullOrUndefined(this.value) ? new Date(+this.value) : null;\n this.inputElement.setAttribute('value', this.inputElement.value);\n this.inputValueCopy = this.value;\n };\n DatePicker.prototype.createInput = function () {\n var ariaAttrs = {\n 'aria-atomic': 'true', 'aria-expanded': 'false',\n 'role': 'combobox', 'autocomplete': 'off', 'autocorrect': 'off',\n 'autocapitalize': 'off', 'spellcheck': 'false', 'aria-invalid': 'false', 'aria-label': this.getModuleName()\n };\n if (this.getModuleName() === 'datepicker') {\n var l10nLocale = { placeholder: this.placeholder };\n this.globalize = new Internationalization(this.locale);\n this.l10n = new L10n('datepicker', l10nLocale, this.locale);\n this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);\n }\n if (this.fullScreenMode && Browser.isDevice) {\n this.cssClass += ' ' + \"e-popup-expand\";\n }\n var updatedCssClassValues = this.cssClass;\n if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {\n updatedCssClassValues = (this.cssClass.replace(/\\s+/g, ' ')).trim();\n }\n var isBindClearAction = this.enableMask ? false : true;\n this.inputWrapper = Input.createInput({\n element: this.inputElement,\n floatLabelType: this.floatLabelType,\n bindClearAction: isBindClearAction,\n properties: {\n readonly: this.readonly,\n placeholder: this.placeholder,\n cssClass: updatedCssClassValues,\n enabled: this.enabled,\n enableRtl: this.enableRtl,\n showClearButton: this.showClearButton\n },\n buttons: [INPUTWRAPPER + ' ' + DATEICON + ' ' + ICONS]\n }, this.createElement);\n this.setWidth(this.width);\n if (this.inputElement.name !== '') {\n this.inputElement.setAttribute('name', '' + this.inputElement.getAttribute('name'));\n }\n else {\n this.inputElement.setAttribute('name', '' + this.element.id);\n }\n attributes(this.inputElement, ariaAttrs);\n if (!this.enabled) {\n this.inputElement.setAttribute('aria-disabled', 'true');\n this.inputElement.tabIndex = -1;\n }\n else {\n this.inputElement.setAttribute('aria-disabled', 'false');\n this.inputElement.setAttribute('tabindex', this.tabIndex);\n }\n Input.addAttributes({ 'aria-label': 'select', 'role': 'button' }, this.inputWrapper.buttons[0]);\n addClass([this.inputWrapper.container], DATEWRAPPER);\n };\n DatePicker.prototype.updateInput = function (isDynamic, isBlur) {\n if (isDynamic === void 0) { isDynamic = false; }\n if (isBlur === void 0) { isBlur = false; }\n var formatOptions;\n if (this.value && !this.isCalendar()) {\n this.disabledDates(isDynamic, isBlur);\n }\n if (isNaN(+new Date(this.checkValue(this.value)))) {\n this.setProperties({ value: null }, true);\n }\n if (this.strictMode) {\n //calls the Calendar processDate protected method to update the date value according to the strictMode true behaviour.\n _super.prototype.validateDate.call(this);\n this.minMaxUpdates();\n _super.prototype.minMaxUpdate.call(this);\n }\n if (!isNullOrUndefined(this.value)) {\n var dateValue = this.value;\n var dateString = void 0;\n var tempFormat = !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat;\n if (this.getModuleName() === 'datetimepicker') {\n if (this.calendarMode === 'Gregorian') {\n dateString = this.globalize.formatDate(this.value, {\n format: tempFormat, type: 'dateTime', skeleton: 'yMd'\n });\n }\n else {\n dateString = this.globalize.formatDate(this.value, {\n format: tempFormat, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic'\n });\n }\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n dateString = this.globalize.formatDate(this.value, formatOptions);\n }\n if ((+dateValue <= +this.max) && (+dateValue >= +this.min)) {\n this.updateInputValue(dateString);\n }\n else {\n var value = (+dateValue >= +this.max || !+this.value) || (!+this.value || +dateValue <= +this.min);\n if (!this.strictMode && value) {\n this.updateInputValue(dateString);\n }\n }\n }\n if (isNullOrUndefined(this.value) && this.strictMode) {\n if (!this.enableMask) {\n this.updateInputValue('');\n }\n else {\n this.updateInputValue(this.maskedDateValue);\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n }\n if (!this.strictMode && isNullOrUndefined(this.value) && this.invalidValueString) {\n this.updateInputValue(this.invalidValueString);\n }\n this.changedArgs = { value: this.value };\n this.errorClass();\n this.updateIconState();\n };\n DatePicker.prototype.minMaxUpdates = function () {\n if (!isNullOrUndefined(this.value) && this.value < this.min && this.min <= this.max && this.strictMode) {\n this.setProperties({ value: this.min }, true);\n this.changedArgs = { value: this.value };\n }\n else {\n if (!isNullOrUndefined(this.value) && this.value > this.max && this.min <= this.max && this.strictMode) {\n this.setProperties({ value: this.max }, true);\n this.changedArgs = { value: this.value };\n }\n }\n };\n DatePicker.prototype.checkStringValue = function (val) {\n var returnDate = null;\n var formatOptions = null;\n var formatDateTime = null;\n if (this.getModuleName() === 'datetimepicker') {\n var culture = new Internationalization(this.locale);\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd' };\n formatDateTime = { format: culture.getDatePattern({ skeleton: 'yMd' }), type: 'dateTime' };\n }\n else {\n formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n formatDateTime = { format: culture.getDatePattern({ skeleton: 'yMd' }), type: 'dateTime', calendar: 'islamic' };\n }\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n }\n returnDate = this.checkDateValue(this.globalize.parseDate(val, formatOptions));\n if (isNullOrUndefined(returnDate) && (this.getModuleName() === 'datetimepicker')) {\n returnDate = this.checkDateValue(this.globalize.parseDate(val, formatDateTime));\n }\n return returnDate;\n };\n DatePicker.prototype.checkInvalidValue = function (value) {\n if (!(value instanceof Date) && !isNullOrUndefined(value)) {\n var valueDate = null;\n var valueString = value;\n if (typeof value === 'number') {\n valueString = value.toString();\n }\n var formatOptions = null;\n var formatDateTime = null;\n if (this.getModuleName() === 'datetimepicker') {\n var culture = new Internationalization(this.locale);\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd' };\n formatDateTime = { format: culture.getDatePattern({ skeleton: 'yMd' }), type: 'dateTime' };\n }\n else {\n formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n formatDateTime = { format: culture.getDatePattern({ skeleton: 'yMd' }), type: 'dateTime', calendar: 'islamic' };\n }\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n }\n var invalid = false;\n if (typeof valueString !== 'string') {\n valueString = null;\n invalid = true;\n }\n else {\n if (typeof valueString === 'string') {\n valueString = valueString.trim();\n }\n valueDate = this.checkStringValue(valueString);\n if (!valueDate) {\n var extISOString = null;\n var basicISOString = null;\n // eslint-disable-next-line\n extISOString = /^\\s*((?:[+-]\\d{6}|\\d{4})-(?:\\d\\d-\\d\\d|W\\d\\d-\\d|W\\d\\d|\\d\\d\\d|\\d\\d))(?:(T| )(\\d\\d(?::\\d\\d(?::\\d\\d(?:[.,]\\d+)?)?)?)([\\+\\-]\\d\\d(?::?\\d\\d)?|\\s*Z)?)?/;\n // eslint-disable-next-line\n basicISOString = /^\\s*((?:[+-]\\d{6}|\\d{4})(?:\\d\\d\\d\\d|W\\d\\d\\d|W\\d\\d|\\d\\d\\d|\\d\\d))(?:(T| )(\\d\\d(?:\\d\\d(?:\\d\\d(?:[.,]\\d+)?)?)?)([\\+\\-]\\d\\d(?::?\\d\\d)?|\\s*Z)?)?/;\n if ((!extISOString.test(valueString) && !basicISOString.test(valueString))\n || (/^[a-zA-Z0-9- ]*$/).test(valueString) || isNaN(+new Date(this.checkValue(valueString)))) {\n invalid = true;\n }\n else {\n valueDate = new Date(valueString);\n }\n }\n }\n if (invalid) {\n if (!this.strictMode) {\n this.invalidValueString = valueString;\n }\n this.setProperties({ value: null }, true);\n }\n else {\n this.setProperties({ value: valueDate }, true);\n }\n }\n };\n DatePicker.prototype.bindInputEvent = function () {\n if (!isNullOrUndefined(this.formatString) || this.enableMask) {\n if (this.enableMask || this.formatString.indexOf('y') === -1) {\n EventHandler.add(this.inputElement, 'input', this.inputHandler, this);\n }\n else {\n EventHandler.remove(this.inputElement, 'input', this.inputHandler);\n }\n }\n };\n DatePicker.prototype.bindEvents = function () {\n EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', this.dateIconHandler, this);\n EventHandler.add(this.inputElement, 'mouseup', this.mouseUpHandler, this);\n EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);\n EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);\n EventHandler.add(this.inputElement, 'keyup', this.keyupHandler, this);\n if (this.enableMask) {\n EventHandler.add(this.inputElement, 'keydown', this.keydownHandler, this);\n }\n this.bindInputEvent();\n // To prevent the twice triggering.\n EventHandler.add(this.inputElement, 'change', this.inputChangeHandler, this);\n if (this.showClearButton && this.inputWrapper.clearButton) {\n EventHandler.add(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler, this);\n }\n if (this.formElement) {\n EventHandler.add(this.formElement, 'reset', this.resetFormHandler, this);\n }\n this.defaultKeyConfigs = extend(this.defaultKeyConfigs, this.keyConfigs);\n this.keyboardModules = new KeyboardEvents(this.inputElement, {\n eventName: 'keydown',\n keyAction: this.inputKeyActionHandle.bind(this),\n keyConfigs: this.defaultKeyConfigs\n });\n };\n DatePicker.prototype.keydownHandler = function (e) {\n switch (e.code) {\n case 'ArrowLeft':\n case 'ArrowRight':\n case 'ArrowUp':\n case 'ArrowDown':\n case 'Home':\n case 'End':\n case 'Delete':\n if (this.enableMask && !this.popupObj && !this.readonly) {\n if (e.code !== 'Delete') {\n e.preventDefault();\n }\n this.notify('keyDownHandler', {\n module: 'MaskedDateTime',\n e: e\n });\n }\n break;\n default:\n break;\n }\n };\n DatePicker.prototype.unBindEvents = function () {\n if (!isNullOrUndefined(this.inputWrapper)) {\n EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown', this.dateIconHandler);\n }\n EventHandler.remove(this.inputElement, 'mouseup', this.mouseUpHandler);\n EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);\n EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);\n EventHandler.remove(this.inputElement, 'change', this.inputChangeHandler);\n EventHandler.remove(this.inputElement, 'keyup', this.keyupHandler);\n if (this.enableMask) {\n EventHandler.remove(this.inputElement, 'keydown', this.keydownHandler);\n }\n if (this.showClearButton && this.inputWrapper.clearButton) {\n EventHandler.remove(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler);\n }\n if (this.formElement) {\n EventHandler.remove(this.formElement, 'reset', this.resetFormHandler);\n }\n };\n DatePicker.prototype.resetFormHandler = function () {\n if (!this.enabled) {\n return;\n }\n if (!this.inputElement.disabled) {\n var value = this.inputElement.getAttribute('value');\n if (this.element.tagName === 'EJS-DATEPICKER' || this.element.tagName === 'EJS-DATETIMEPICKER') {\n value = '';\n this.inputValueCopy = null;\n this.inputElement.setAttribute('value', '');\n }\n this.setProperties({ value: this.inputValueCopy }, true);\n this.restoreValue();\n if (this.inputElement) {\n this.updateInputValue(value);\n this.errorClass();\n }\n }\n };\n DatePicker.prototype.restoreValue = function () {\n this.currentDate = this.value ? this.value : new Date();\n this.previousDate = this.value;\n this.previousElementValue = (isNullOrUndefined(this.inputValueCopy)) ? '' :\n this.globalize.formatDate(this.inputValueCopy, {\n format: this.formatString, type: 'dateTime', skeleton: 'yMd'\n });\n };\n DatePicker.prototype.inputChangeHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n e.stopPropagation();\n };\n DatePicker.prototype.bindClearEvent = function () {\n if (this.showClearButton && this.inputWrapper.clearButton) {\n EventHandler.add(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler, this);\n }\n };\n DatePicker.prototype.resetHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n e.preventDefault();\n this.clear(e);\n };\n DatePicker.prototype.mouseUpHandler = function (e) {\n if (this.enableMask) {\n e.preventDefault();\n this.notify('setMaskSelection', {\n module: 'MaskedDateTime'\n });\n }\n };\n DatePicker.prototype.clear = function (event) {\n this.setProperties({ value: null }, true);\n if (!this.enableMask) {\n this.updateInputValue('');\n }\n var clearedArgs = {\n event: event\n };\n this.trigger('cleared', clearedArgs);\n this.invalidValueString = '';\n this.updateInput();\n this.popupUpdate();\n this.changeEvent(event);\n if (this.enableMask) {\n this.notify('clearHandler', {\n module: 'MaskedDateTime'\n });\n }\n if (closest(this.element, 'form')) {\n var element = this.element;\n var keyupEvent = document.createEvent('KeyboardEvent');\n keyupEvent.initEvent('keyup', false, true);\n element.dispatchEvent(keyupEvent);\n }\n };\n DatePicker.prototype.preventEventBubbling = function (e) {\n e.preventDefault();\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.interopAdaptor.invokeMethodAsync('OnDateIconClick');\n };\n DatePicker.prototype.updateInputValue = function (value) {\n Input.setValue(value, this.inputElement, this.floatLabelType, this.showClearButton);\n };\n DatePicker.prototype.dateIconHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n this.isIconClicked = true;\n if (Browser.isDevice) {\n this.inputElement.setAttribute('readonly', '');\n this.inputElement.blur();\n }\n e.preventDefault();\n if (!this.readonly) {\n if (this.isCalendar()) {\n this.hide(e);\n }\n else {\n this.isDateIconClicked = true;\n this.show(null, e);\n if (this.getModuleName() === 'datetimepicker') {\n this.inputElement.focus();\n }\n this.inputElement.focus();\n addClass([this.inputWrapper.container], [INPUTFOCUS]);\n addClass(this.inputWrapper.buttons, ACTIVE);\n }\n }\n this.isIconClicked = false;\n };\n DatePicker.prototype.updateHtmlAttributeToWrapper = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (!isNullOrUndefined(this.htmlAttributes[\"\" + key])) {\n if (containerAttr.indexOf(key) > -1) {\n if (key === 'class') {\n var updatedClassValues = (this.htmlAttributes[\"\" + key].replace(/\\s+/g, ' ')).trim();\n if (updatedClassValues !== '') {\n addClass([this.inputWrapper.container], updatedClassValues.split(' '));\n }\n }\n else if (key === 'style') {\n var setStyle = this.inputWrapper.container.getAttribute(key);\n if (!isNullOrUndefined(setStyle)) {\n if (setStyle.charAt(setStyle.length - 1) === ';') {\n setStyle = setStyle + this.htmlAttributes[\"\" + key];\n }\n else {\n setStyle = setStyle + ';' + this.htmlAttributes[\"\" + key];\n }\n }\n else {\n setStyle = this.htmlAttributes[\"\" + key];\n }\n this.inputWrapper.container.setAttribute(key, setStyle);\n }\n else {\n this.inputWrapper.container.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n }\n }\n }\n };\n DatePicker.prototype.updateHtmlAttributeToElement = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (containerAttr.indexOf(key) < 0) {\n this.inputElement.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n }\n };\n DatePicker.prototype.updateCssClass = function (newCssClass, oldCssClass) {\n if (!isNullOrUndefined(oldCssClass)) {\n oldCssClass = (oldCssClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(newCssClass)) {\n newCssClass = (newCssClass.replace(/\\s+/g, ' ')).trim();\n }\n Input.setCssClass(newCssClass, [this.inputWrapper.container], oldCssClass);\n if (this.popupWrapper) {\n Input.setCssClass(newCssClass, [this.popupWrapper], oldCssClass);\n }\n };\n DatePicker.prototype.calendarKeyActionHandle = function (e) {\n switch (e.action) {\n case 'escape':\n if (this.isCalendar()) {\n this.hide(e);\n }\n else {\n this.inputWrapper.container.children[this.index].blur();\n }\n break;\n case 'enter':\n if (!this.isCalendar()) {\n this.show(null, e);\n }\n else {\n if (+this.value !== +this.currentDate && !this.isCalendar()) {\n this.inputWrapper.container.children[this.index].focus();\n }\n }\n if (this.getModuleName() === 'datetimepicker') {\n this.inputElement.focus();\n }\n break;\n }\n };\n DatePicker.prototype.inputFocusHandler = function () {\n this.isFocused = true;\n if (!this.enabled) {\n return;\n }\n if (this.enableMask && !this.inputElement.value && this.placeholder) {\n if (this.maskedDateValue && !this.value && (this.floatLabelType === 'Auto' || this.floatLabelType === 'Never' || this.placeholder)) {\n this.updateInputValue(this.maskedDateValue);\n this.inputElement.selectionStart = 0;\n this.inputElement.selectionEnd = this.inputElement.value.length;\n }\n }\n var focusArguments = {\n model: this\n };\n this.isDateIconClicked = false;\n this.trigger('focus', focusArguments);\n this.updateIconState();\n if (this.openOnFocus && !this.isIconClicked) {\n this.show();\n }\n };\n DatePicker.prototype.inputHandler = function () {\n this.isPopupClicked = false;\n if (this.enableMask) {\n this.notify('inputHandler', {\n module: 'MaskedDateTime'\n });\n }\n };\n DatePicker.prototype.inputBlurHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n this.strictModeUpdate();\n if (this.inputElement.value === '' && isNullOrUndefined(this.value)) {\n this.invalidValueString = null;\n this.updateInputValue('');\n }\n this.isBlur = true;\n this.updateInput(false, true);\n this.isBlur = false;\n this.popupUpdate();\n this.changeTrigger(e);\n if (this.enableMask && this.maskedDateValue && this.placeholder && this.floatLabelType !== 'Always') {\n if (this.inputElement.value === this.maskedDateValue && !this.value && (this.floatLabelType === 'Auto' || this.floatLabelType === 'Never' || this.placeholder)) {\n this.updateInputValue('');\n }\n }\n this.errorClass();\n if (this.isCalendar() && document.activeElement === this.inputElement) {\n this.hide(e);\n }\n if (this.getModuleName() === 'datepicker') {\n var blurArguments = {\n model: this\n };\n this.trigger('blur', blurArguments);\n }\n if (this.isCalendar()) {\n this.defaultKeyConfigs = extend(this.defaultKeyConfigs, this.keyConfigs);\n this.calendarKeyboardModules = new KeyboardEvents(this.calendarElement.children[1].firstElementChild, {\n eventName: 'keydown',\n keyAction: this.calendarKeyActionHandle.bind(this),\n keyConfigs: this.defaultKeyConfigs\n });\n }\n this.isPopupClicked = false;\n };\n DatePicker.prototype.documentHandler = function (e) {\n if ((!isNullOrUndefined(this.popupObj) && !isNullOrUndefined(this.inputWrapper) && (this.inputWrapper.container.contains(e.target) && e.type !== 'mousedown' ||\n (this.popupObj.element && this.popupObj.element.contains(e.target)))) && e.type !== 'touchstart') {\n e.preventDefault();\n }\n var target = e.target;\n if (!(closest(target, '.e-datepicker.e-popup-wrapper')) && !isNullOrUndefined(this.inputWrapper)\n && !(closest(target, '.' + INPUTCONTAINER) === this.inputWrapper.container)\n && (!target.classList.contains('e-day'))\n && (!target.classList.contains('e-dlg-overlay'))) {\n this.hide(e);\n this.focusOut();\n }\n else if (closest(target, '.e-datepicker.e-popup-wrapper')) {\n // Fix for close the popup when select the previously selected value.\n if (target.classList.contains('e-day')\n && !isNullOrUndefined(e.target.parentElement)\n && e.target.parentElement.classList.contains('e-selected')\n && closest(target, '.e-content')\n && closest(target, '.e-content').classList.contains('e-' + this.depth.toLowerCase())) {\n this.hide(e);\n }\n else if (closest(target, '.e-footer-container')\n && target.classList.contains('e-today')\n && target.classList.contains('e-btn')\n && (+new Date(+this.value) === +_super.prototype.generateTodayVal.call(this, this.value))) {\n this.hide(e);\n }\n }\n };\n DatePicker.prototype.inputKeyActionHandle = function (e) {\n var clickedView = this.currentView();\n switch (e.action) {\n case 'altUpArrow':\n this.isAltKeyPressed = false;\n this.hide(e);\n this.inputElement.focus();\n break;\n case 'altDownArrow':\n this.isAltKeyPressed = true;\n this.strictModeUpdate();\n this.updateInput();\n this.changeTrigger(e);\n if (this.getModuleName() === 'datepicker') {\n this.show(null, e);\n }\n break;\n case 'escape':\n this.hide(e);\n break;\n case 'enter':\n this.strictModeUpdate();\n this.updateInput();\n this.popupUpdate();\n this.changeTrigger(e);\n this.errorClass();\n if (!this.isCalendar() && document.activeElement === this.inputElement) {\n this.hide(e);\n }\n if (this.isCalendar()) {\n e.preventDefault();\n e.stopPropagation();\n }\n break;\n case 'tab':\n case 'shiftTab':\n {\n var start = this.inputElement.selectionStart;\n var end = this.inputElement.selectionEnd;\n if (this.enableMask && !this.popupObj && !this.readonly) {\n var length_1 = this.inputElement.value.length;\n if ((start === 0 && end === length_1) || (end !== length_1 && e.action === 'tab') || (start !== 0 && e.action === 'shiftTab')) {\n e.preventDefault();\n }\n this.notify('keyDownHandler', {\n module: 'MaskedDateTime',\n e: e\n });\n start = this.inputElement.selectionStart;\n end = this.inputElement.selectionEnd;\n }\n this.strictModeUpdate();\n this.updateInput();\n this.popupUpdate();\n this.changeTrigger(e);\n this.errorClass();\n if (this.enableMask) {\n this.inputElement.selectionStart = start;\n this.inputElement.selectionEnd = end;\n }\n if (e.action === 'tab' && e.target === this.inputElement && this.isCalendar() && document.activeElement === this.inputElement) {\n e.preventDefault();\n this.headerTitleElement.focus();\n }\n if (e.action === 'shiftTab' && e.target === this.inputElement && this.isCalendar() && document.activeElement === this.inputElement) {\n this.hide(e);\n }\n break;\n }\n default:\n this.defaultAction(e);\n // Fix for close the popup when select the previously selected value.\n if (e.action === 'select' && clickedView === this.depth) {\n this.hide(e);\n }\n }\n };\n DatePicker.prototype.defaultAction = function (e) {\n this.previousDate = ((!isNullOrUndefined(this.value) && new Date(+this.value)) || null);\n if (this.isCalendar()) {\n _super.prototype.keyActionHandle.call(this, e);\n if (this.isCalendar()) {\n attributes(this.inputElement, {\n 'aria-activedescendant': '' + this.setActiveDescendant()\n });\n }\n }\n };\n DatePicker.prototype.popupUpdate = function () {\n if ((isNullOrUndefined(this.value)) && (!isNullOrUndefined(this.previousDate)) ||\n (((this.getModuleName() !== 'datetimepicker') && (+this.value !== +this.previousDate)) || ((this.getModuleName() === 'datetimepicker') && (+this.value !== +this.previousDateTime)))) {\n if (this.popupObj) {\n if (this.popupObj.element.querySelectorAll('.' + SELECTED).length > 0) {\n removeClass(this.popupObj.element.querySelectorAll('.' + SELECTED), [SELECTED]);\n }\n }\n if (!isNullOrUndefined(this.value)) {\n if ((+this.value >= +this.min) && (+this.value <= +this.max)) {\n var targetdate = new Date(this.checkValue(this.value));\n _super.prototype.navigateTo.call(this, 'Month', targetdate);\n }\n }\n }\n };\n DatePicker.prototype.strictModeUpdate = function () {\n var format;\n var pattern = /^y/;\n var charPattern = /[^a-zA-Z]/;\n var formatOptions;\n if (this.getModuleName() === 'datetimepicker') {\n format = !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat;\n }\n else if (!pattern.test(this.formatString) || charPattern.test(this.formatString)) {\n format = isNullOrUndefined(this.formatString) ? this.formatString : this.formatString.replace('dd', 'd');\n }\n if (!isNullOrUndefined(format)) {\n var len = format.split('M').length - 1;\n if (len < 3) {\n format = format.replace('MM', 'M');\n }\n }\n else {\n format = this.formatString;\n }\n var dateOptions;\n if (this.getModuleName() === 'datetimepicker') {\n if (this.calendarMode === 'Gregorian') {\n dateOptions = {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,\n type: 'dateTime', skeleton: 'yMd'\n };\n }\n else {\n dateOptions = {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,\n type: 'dateTime', skeleton: 'yMd', calendar: 'islamic'\n };\n }\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: format, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n formatOptions = { format: format, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n dateOptions = formatOptions;\n }\n var date;\n if (typeof this.inputElement.value === 'string') {\n this.inputElement.value = this.inputElement.value.trim();\n }\n if ((this.getModuleName() === 'datetimepicker')) {\n if (this.checkDateValue(this.globalize.parseDate(this.inputElement.value, dateOptions))) {\n var modifiedValue = this.inputElement.value.replace(/(am|pm|Am|aM|pM|Pm)/g, function (match) { return match.toLocaleUpperCase(); });\n date = this.globalize.parseDate(modifiedValue, dateOptions);\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: format, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n formatOptions = { format: format, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n date = this.globalize.parseDate(this.inputElement.value, formatOptions);\n }\n }\n else {\n date = this.globalize.parseDate(this.inputElement.value, dateOptions);\n date = (!isNullOrUndefined(date) && isNaN(+date)) ? null : date;\n if (!isNullOrUndefined(this.formatString) && this.inputElement.value !== '' && this.strictMode) {\n if ((this.isPopupClicked || (!this.isPopupClicked && this.inputElement.value === this.previousElementValue))\n && this.formatString.indexOf('y') === -1) {\n date.setFullYear(this.value.getFullYear());\n }\n }\n }\n // EJ2-35061 - To prevent change event from triggering twice when using strictmode and format property\n if ((this.getModuleName() === 'datepicker') && (this.value && !isNaN(+this.value)) && date) {\n date.setHours(this.value.getHours(), this.value.getMinutes(), this.value.getSeconds(), this.value.getMilliseconds());\n }\n if (this.strictMode && date) {\n this.updateInputValue(this.globalize.formatDate(date, dateOptions));\n if (this.inputElement.value !== this.previousElementValue) {\n this.setProperties({ value: date }, true);\n }\n }\n else if (!this.strictMode) {\n if (this.inputElement.value !== this.previousElementValue) {\n this.setProperties({ value: date }, true);\n }\n }\n if (this.strictMode && !date && this.inputElement.value === (this.enableMask ? this.maskedDateValue : '')) {\n this.setProperties({ value: null }, true);\n }\n if (isNaN(+this.value)) {\n this.setProperties({ value: null }, true);\n }\n if (isNullOrUndefined(this.value)) {\n this.currentDate = new Date(new Date().setHours(0, 0, 0, 0));\n }\n };\n DatePicker.prototype.createCalendar = function () {\n var _this = this;\n this.popupWrapper = this.createElement('div', { className: '' + ROOT + ' ' + POPUPWRAPPER, id: this.inputElement.id + '_options' });\n this.popupWrapper.setAttribute('aria-label', this.element.id);\n this.popupWrapper.setAttribute('role', 'dialog');\n if (!isNullOrUndefined(this.cssClass)) {\n this.popupWrapper.className += ' ' + this.cssClass;\n }\n if (Browser.isDevice) {\n this.modelHeader();\n this.modal = this.createElement('div');\n this.modal.className = '' + ROOT + ' e-date-modal';\n document.body.className += ' ' + OVERFLOW;\n this.modal.style.display = 'block';\n document.body.appendChild(this.modal);\n }\n //this.calendarElement represent the Calendar object from the Calendar class.\n this.calendarElement.querySelector('table tbody').className = '';\n this.popupObj = new Popup(this.popupWrapper, {\n content: this.calendarElement,\n relateTo: Browser.isDevice ? document.body : this.inputWrapper.container,\n position: Browser.isDevice ? { X: 'center', Y: 'center' } : (this.enableRtl ? { X: 'right', Y: 'bottom' } : { X: 'left', Y: 'bottom' }),\n offsetY: OFFSETVALUE,\n targetType: 'container',\n enableRtl: this.enableRtl,\n zIndex: this.zIndex,\n collision: Browser.isDevice ? { X: 'fit', Y: 'fit' } : (this.enableRtl ? { X: 'fit', Y: 'flip' } : { X: 'flip', Y: 'flip' }),\n open: function () {\n if (Browser.isDevice && _this.fullScreenMode) {\n _this.iconRight = parseInt(window.getComputedStyle(_this.calendarElement.querySelector('.e-header.e-month .e-prev')).marginRight, 10) > 16 ? true : false;\n _this.touchModule = new Touch(_this.calendarElement.querySelector(\".e-content.e-month\"), {\n swipe: _this.CalendarSwipeHandler.bind(_this)\n });\n EventHandler.add(_this.calendarElement.querySelector(\".e-content.e-month\"), \"touchstart\", _this.TouchStartHandler, _this);\n }\n if (_this.getModuleName() !== 'datetimepicker') {\n if (document.activeElement !== _this.inputElement) {\n _this.defaultKeyConfigs = extend(_this.defaultKeyConfigs, _this.keyConfigs);\n _this.calendarElement.children[1].firstElementChild.focus();\n _this.calendarKeyboardModules = new KeyboardEvents(_this.calendarElement.children[1].firstElementChild, {\n eventName: 'keydown',\n keyAction: _this.calendarKeyActionHandle.bind(_this),\n keyConfigs: _this.defaultKeyConfigs\n });\n _this.calendarKeyboardModules = new KeyboardEvents(_this.inputWrapper.container.children[_this.index], {\n eventName: 'keydown',\n keyAction: _this.calendarKeyActionHandle.bind(_this),\n keyConfigs: _this.defaultKeyConfigs\n });\n }\n }\n }, close: function () {\n if (_this.isDateIconClicked) {\n _this.inputWrapper.container.children[_this.index].focus();\n }\n if (_this.value) {\n _this.disabledDates();\n }\n if (_this.popupObj) {\n _this.popupObj.destroy();\n }\n _this.resetCalendar();\n detach(_this.popupWrapper);\n _this.popupObj = _this.popupWrapper = null;\n _this.preventArgs = null;\n _this.calendarKeyboardModules = null;\n _this.setAriaAttributes();\n }, targetExitViewport: function () {\n if (!Browser.isDevice) {\n _this.hide();\n }\n }\n });\n this.popupObj.element.className += ' ' + this.cssClass;\n this.setAriaAttributes();\n };\n DatePicker.prototype.CalendarSwipeHandler = function (e) {\n var direction = 0;\n if (this.iconRight) {\n switch (e.swipeDirection) {\n case \"Left\":\n direction = 1;\n break;\n case \"Right\":\n direction = -1;\n break;\n default:\n break;\n }\n }\n else {\n switch (e.swipeDirection) {\n case \"Up\":\n direction = 1;\n break;\n case \"Down\":\n direction = -1;\n break;\n default:\n break;\n }\n }\n if (this.touchStart) {\n if (direction === 1) {\n this.navigateNext(e);\n }\n else if (direction === -1) {\n this.navigatePrevious(e);\n }\n this.touchStart = false;\n }\n };\n DatePicker.prototype.TouchStartHandler = function (e) {\n this.touchStart = true;\n };\n DatePicker.prototype.setAriaDisabled = function () {\n if (!this.enabled) {\n this.inputElement.setAttribute('aria-disabled', 'true');\n this.inputElement.tabIndex = -1;\n }\n else {\n this.inputElement.setAttribute('aria-disabled', 'false');\n this.inputElement.setAttribute('tabindex', this.tabIndex);\n }\n };\n DatePicker.prototype.modelHeader = function () {\n var dateOptions;\n var modelHeader = this.createElement('div', { className: 'e-model-header' });\n var yearHeading = this.createElement('h1', { className: 'e-model-year' });\n var h2 = this.createElement('div');\n var daySpan = this.createElement('span', { className: 'e-model-day' });\n var monthSpan = this.createElement('span', { className: 'e-model-month' });\n if (this.calendarMode === 'Gregorian') {\n dateOptions = { format: 'y', skeleton: 'dateTime' };\n }\n else {\n dateOptions = { format: 'y', skeleton: 'dateTime', calendar: 'islamic' };\n }\n yearHeading.textContent = '' + this.globalize.formatDate(this.value || new Date(), dateOptions);\n if (this.calendarMode === 'Gregorian') {\n dateOptions = { format: 'E', skeleton: 'dateTime' };\n }\n else {\n dateOptions = { format: 'E', skeleton: 'dateTime', calendar: 'islamic' };\n }\n daySpan.textContent = '' + this.globalize.formatDate(this.value || new Date(), dateOptions) + ', ';\n if (this.calendarMode === 'Gregorian') {\n dateOptions = { format: 'MMM d', skeleton: 'dateTime' };\n }\n else {\n dateOptions = { format: 'MMM d', skeleton: 'dateTime', calendar: 'islamic' };\n }\n monthSpan.textContent = '' + this.globalize.formatDate(this.value || new Date(), dateOptions);\n if (this.fullScreenMode) {\n var modelCloseIcon = this.createElement(\"span\", { className: \"e-popup-close\" });\n EventHandler.add(modelCloseIcon, 'mousedown touchstart', this.modelCloseHandler, this);\n var modelTodayButton = this.calendarElement.querySelector(\"button.e-today\");\n h2.classList.add(\"e-day-wrapper\");\n modelTodayButton.classList.add(\"e-outline\");\n modelHeader.appendChild(modelCloseIcon);\n modelHeader.appendChild(modelTodayButton);\n }\n if (!this.fullScreenMode)\n modelHeader.appendChild(yearHeading);\n h2.appendChild(daySpan);\n h2.appendChild(monthSpan);\n modelHeader.appendChild(h2);\n this.calendarElement.insertBefore(modelHeader, this.calendarElement.firstElementChild);\n };\n DatePicker.prototype.modelCloseHandler = function (e) {\n this.hide();\n };\n DatePicker.prototype.changeTrigger = function (event) {\n if (this.inputElement.value !== this.previousElementValue) {\n if (((this.previousDate && this.previousDate.valueOf()) !== (this.value && this.value.valueOf()))) {\n if (this.isDynamicValueChanged && this.isCalendar()) {\n this.popupUpdate();\n }\n this.changedArgs.value = this.value;\n this.changedArgs.event = event || null;\n this.changedArgs.element = this.element;\n this.changedArgs.isInteracted = !isNullOrUndefined(event);\n if (this.isAngular && this.preventChange) {\n this.preventChange = false;\n }\n else {\n this.trigger('change', this.changedArgs);\n }\n this.previousElementValue = this.inputElement.value;\n this.previousDate = !isNaN(+new Date(this.checkValue(this.value))) ? new Date(this.checkValue(this.value)) : null;\n this.isInteracted = true;\n }\n }\n this.isKeyAction = false;\n };\n DatePicker.prototype.navigatedEvent = function () {\n this.trigger('navigated', this.navigatedArgs);\n };\n DatePicker.prototype.keyupHandler = function (e) {\n this.isKeyAction = (this.inputElement.value !== this.previousElementValue) ? true : false;\n };\n DatePicker.prototype.changeEvent = function (event) {\n if (!this.isIconClicked && !(this.isBlur || this.isKeyAction)) {\n this.selectCalendar(event);\n }\n if (((this.previousDate && this.previousDate.valueOf()) !== (this.value && this.value.valueOf()))) {\n this.changedArgs.event = event ? event : null;\n this.changedArgs.element = this.element;\n this.changedArgs.isInteracted = this.isInteracted;\n if (!this.isDynamicValueChanged) {\n this.trigger('change', this.changedArgs);\n }\n this.previousDate = this.value && new Date(+this.value);\n if (!this.isDynamicValueChanged) {\n this.hide(event);\n }\n this.previousElementValue = this.inputElement.value;\n this.errorClass();\n }\n else if (event) {\n this.hide(event);\n }\n this.isKeyAction = false;\n };\n DatePicker.prototype.requiredModules = function () {\n var modules = [];\n if (this.calendarMode === 'Islamic') {\n modules.push({ args: [this], member: 'islamic', name: 'Islamic' });\n }\n if (this.enableMask) {\n modules.push({ args: [this], member: 'MaskedDateTime' });\n }\n return modules;\n };\n DatePicker.prototype.selectCalendar = function (e) {\n var date;\n var tempFormat;\n var formatOptions;\n if (this.getModuleName() === 'datetimepicker') {\n tempFormat = !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat;\n }\n else {\n tempFormat = this.formatString;\n }\n if (this.value) {\n if (this.getModuleName() === 'datetimepicker') {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: tempFormat, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n formatOptions = { format: tempFormat, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n date = this.globalize.formatDate(this.changedArgs.value, formatOptions);\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n date = this.globalize.formatDate(this.changedArgs.value, formatOptions);\n }\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n }\n if (!isNullOrUndefined(date)) {\n this.updateInputValue(date);\n if (this.enableMask) {\n this.notify('setMaskSelection', {\n module: 'MaskedDateTime'\n });\n }\n }\n };\n DatePicker.prototype.isCalendar = function () {\n if (this.popupWrapper && this.popupWrapper.classList.contains('' + POPUPWRAPPER)) {\n return true;\n }\n return false;\n };\n DatePicker.prototype.setWidth = function (width) {\n if (typeof width === 'number') {\n this.inputWrapper.container.style.width = formatUnit(this.width);\n }\n else if (typeof width === 'string') {\n this.inputWrapper.container.style.width = (width.match(/px|%|em/)) ? (this.width) : (formatUnit(this.width));\n }\n else {\n this.inputWrapper.container.style.width = '100%';\n }\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Shows the Calendar.\n *\n * @returns {void}\n\n */\n DatePicker.prototype.show = function (type, e) {\n var _this = this;\n if ((this.enabled && this.readonly) || !this.enabled || this.popupObj) {\n return;\n }\n else {\n var prevent_1 = true;\n var outOfRange = void 0;\n if (!isNullOrUndefined(this.value) && !(+this.value >= +new Date(this.checkValue(this.min))\n && +this.value <= +new Date(this.checkValue(this.max)))) {\n outOfRange = new Date(this.checkValue(this.value));\n this.setProperties({ 'value': null }, true);\n }\n else {\n outOfRange = this.value || null;\n }\n if (!this.isCalendar()) {\n _super.prototype.render.call(this);\n this.setProperties({ 'value': outOfRange || null }, true);\n this.previousDate = outOfRange;\n this.createCalendar();\n }\n if (Browser.isDevice) {\n this.mobilePopupWrapper = this.createElement('div', { className: 'e-datepick-mob-popup-wrap' });\n document.body.appendChild(this.mobilePopupWrapper);\n }\n this.preventArgs = {\n preventDefault: function () {\n prevent_1 = false;\n },\n popup: this.popupObj,\n event: e || null,\n cancel: false,\n appendTo: Browser.isDevice ? this.mobilePopupWrapper : document.body\n };\n var eventArgs = this.preventArgs;\n this.trigger('open', eventArgs, function (eventArgs) {\n _this.preventArgs = eventArgs;\n if (prevent_1 && !_this.preventArgs.cancel) {\n addClass(_this.inputWrapper.buttons, ACTIVE);\n _this.preventArgs.appendTo.appendChild(_this.popupWrapper);\n _this.popupObj.refreshPosition(_this.inputElement);\n var openAnimation = {\n name: 'FadeIn',\n duration: Browser.isDevice ? 0 : OPENDURATION\n };\n if (_this.zIndex === 1000) {\n _this.popupObj.show(new Animation(openAnimation), _this.element);\n }\n else {\n _this.popupObj.show(new Animation(openAnimation), null);\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n _super.prototype.setOverlayIndex.call(_this, _this.mobilePopupWrapper, _this.popupObj.element, _this.modal, Browser.isDevice);\n _this.setAriaAttributes();\n }\n else {\n _this.popupObj.destroy();\n _this.popupWrapper = _this.popupObj = null;\n }\n if (!isNullOrUndefined(_this.inputElement) && _this.inputElement.value === '') {\n if (!isNullOrUndefined(_this.tableBodyElement) && _this.tableBodyElement.querySelectorAll('td.e-selected').length > 0) {\n addClass([_this.tableBodyElement.querySelector('td.e-selected')], FOCUSEDDATE);\n removeClass(_this.tableBodyElement.querySelectorAll('td.e-selected'), SELECTED);\n }\n }\n EventHandler.add(document, 'mousedown touchstart', _this.documentHandler, _this);\n });\n if (Browser.isDevice) {\n var dlgOverlay = this.createElement('div', { className: 'e-dlg-overlay' });\n dlgOverlay.style.zIndex = (this.zIndex - 1).toString();\n this.mobilePopupWrapper.appendChild(dlgOverlay);\n }\n }\n };\n /**\n * Hide the Calendar.\n *\n * @returns {void}\n\n */\n DatePicker.prototype.hide = function (event) {\n var _this = this;\n if (!isNullOrUndefined(this.popupWrapper)) {\n var prevent_2 = true;\n this.preventArgs = {\n preventDefault: function () {\n prevent_2 = false;\n },\n popup: this.popupObj,\n event: event || null,\n cancel: false\n };\n removeClass(this.inputWrapper.buttons, ACTIVE);\n removeClass([document.body], OVERFLOW);\n var eventArgs = this.preventArgs;\n if (this.isCalendar()) {\n this.trigger('close', eventArgs, function (eventArgs) {\n _this.closeEventCallback(prevent_2, eventArgs);\n });\n }\n else {\n this.closeEventCallback(prevent_2, eventArgs);\n }\n }\n else {\n if (Browser.isDevice && this.allowEdit && !this.readonly) {\n this.inputElement.removeAttribute('readonly');\n }\n this.setAllowEdit();\n }\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n DatePicker.prototype.closeEventCallback = function (prevent, eventArgs) {\n this.preventArgs = eventArgs;\n if (this.isCalendar() && (prevent && !this.preventArgs.cancel)) {\n this.popupObj.hide();\n this.isAltKeyPressed = false;\n this.keyboardModule.destroy();\n removeClass(this.inputWrapper.buttons, ACTIVE);\n }\n this.setAriaAttributes();\n if (Browser.isDevice && this.modal) {\n this.modal.style.display = 'none';\n this.modal.outerHTML = '';\n this.modal = null;\n }\n if (Browser.isDevice) {\n if (!isNullOrUndefined(this.mobilePopupWrapper) && (prevent && (isNullOrUndefined(this.preventArgs) || !this.preventArgs.cancel))) {\n this.mobilePopupWrapper.remove();\n this.mobilePopupWrapper = null;\n }\n }\n EventHandler.remove(document, 'mousedown touchstart', this.documentHandler);\n if (Browser.isDevice && this.allowEdit && !this.readonly) {\n this.inputElement.removeAttribute('readonly');\n }\n this.setAllowEdit();\n };\n /* eslint-disable jsdoc/require-param */\n /**\n * Sets the focus to widget for interaction.\n *\n * @returns {void}\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DatePicker.prototype.focusIn = function (triggerEvent) {\n if (document.activeElement !== this.inputElement && this.enabled) {\n this.inputElement.focus();\n addClass([this.inputWrapper.container], [INPUTFOCUS]);\n }\n };\n /* eslint-enable jsdoc/require-param */\n /**\n * Remove the focus from widget, if the widget is in focus state.\n *\n * @returns {void}\n */\n DatePicker.prototype.focusOut = function () {\n if (document.activeElement === this.inputElement) {\n removeClass([this.inputWrapper.container], [INPUTFOCUS]);\n this.inputElement.blur();\n }\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the current view of the DatePicker.\n *\n * @returns {string}\n\n */\n DatePicker.prototype.currentView = function () {\n var currentView;\n if (this.calendarElement) {\n // calls the Calendar currentView public method\n currentView = _super.prototype.currentView.call(this);\n }\n return currentView;\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Navigates to specified month or year or decade view of the DatePicker.\n *\n * @param {string} view - Specifies the view of the calendar.\n * @param {Date} date - Specifies the focused date in a view.\n * @returns {void}\n\n */\n DatePicker.prototype.navigateTo = function (view, date) {\n if (this.calendarElement) {\n // calls the Calendar navigateTo public method\n _super.prototype.navigateTo.call(this, view, date);\n }\n };\n /**\n * To destroy the widget.\n *\n * @returns {void}\n */\n DatePicker.prototype.destroy = function () {\n this.unBindEvents();\n if (this.showClearButton) {\n this.clearButton = document.getElementsByClassName('e-clear-icon')[0];\n }\n _super.prototype.destroy.call(this);\n Input.destroy({\n element: this.inputElement,\n floatLabelType: this.floatLabelType,\n properties: this.properties\n }, this.clearButton);\n if (!isNullOrUndefined(this.keyboardModules)) {\n this.keyboardModules.destroy();\n }\n if (this.popupObj && this.popupObj.element.classList.contains(POPUP)) {\n _super.prototype.destroy.call(this);\n }\n var ariaAttrs = {\n 'aria-atomic': 'true', 'aria-disabled': 'true',\n 'aria-expanded': 'false', 'role': 'combobox', 'autocomplete': 'off',\n 'autocorrect': 'off', 'autocapitalize': 'off', 'spellcheck': 'false', 'aria-label': this.getModuleName()\n };\n if (this.inputElement) {\n Input.removeAttributes(ariaAttrs, this.inputElement);\n if (!isNullOrUndefined(this.inputElementCopy.getAttribute('tabindex'))) {\n this.inputElement.setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.inputElement.removeAttribute('tabindex');\n }\n EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);\n EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);\n this.ensureInputAttribute();\n }\n if (this.isCalendar()) {\n if (this.popupWrapper) {\n detach(this.popupWrapper);\n }\n this.popupObj = this.popupWrapper = null;\n this.keyboardModule.destroy();\n }\n if (this.ngTag === null) {\n if (this.inputElement) {\n if (!isNullOrUndefined(this.inputWrapper)) {\n this.inputWrapper.container.insertAdjacentElement('afterend', this.inputElement);\n }\n removeClass([this.inputElement], [INPUTROOT]);\n }\n removeClass([this.element], [ROOT]);\n if (!isNullOrUndefined(this.inputWrapper)) {\n detach(this.inputWrapper.container);\n }\n }\n if (this.formElement) {\n EventHandler.remove(this.formElement, 'reset', this.resetFormHandler);\n }\n this.inputWrapper = null;\n this.keyboardModules = null;\n };\n DatePicker.prototype.ensureInputAttribute = function () {\n var prop = [];\n for (var i = 0; i < this.inputElement.attributes.length; i++) {\n prop[i] = this.inputElement.attributes[i].name;\n }\n for (var i = 0; i < prop.length; i++) {\n if (isNullOrUndefined(this.inputElementCopy.getAttribute(prop[i]))) {\n if (prop[i].toLowerCase() === 'value') {\n this.inputElement.value = '';\n }\n this.inputElement.removeAttribute(prop[i]);\n }\n else {\n if (prop[i].toLowerCase() === 'value') {\n this.inputElement.value = this.inputElementCopy.getAttribute(prop[i]);\n }\n this.inputElement.setAttribute(prop[i], this.inputElementCopy.getAttribute(prop[i]));\n }\n }\n };\n /**\n * Initialize the event handler\n *\n * @returns {void}\n * @private\n */\n DatePicker.prototype.preRender = function () {\n this.inputElementCopy = this.element.cloneNode(true);\n removeClass([this.inputElementCopy], [ROOT, CONTROL, LIBRARY]);\n this.inputElement = this.element;\n this.formElement = closest(this.inputElement, 'form');\n this.index = this.showClearButton ? 2 : 1;\n this.ngTag = null;\n if (this.element.tagName === 'EJS-DATEPICKER' || this.element.tagName === 'EJS-DATETIMEPICKER') {\n this.ngTag = this.element.tagName;\n this.inputElement = this.createElement('input');\n this.element.appendChild(this.inputElement);\n }\n if (this.element.getAttribute('id')) {\n if (this.ngTag !== null) {\n this.inputElement.id = this.element.getAttribute('id') + '_input';\n }\n }\n else {\n if (this.getModuleName() === 'datetimepicker') {\n this.element.id = getUniqueID('ej2-datetimepicker');\n if (this.ngTag !== null) {\n attributes(this.inputElement, { 'id': this.element.id + '_input' });\n }\n }\n else {\n this.element.id = getUniqueID('ej2-datepicker');\n if (this.ngTag !== null) {\n attributes(this.inputElement, { 'id': this.element.id + '_input' });\n }\n }\n }\n if (this.ngTag !== null) {\n this.validationAttribute(this.element, this.inputElement);\n }\n this.updateHtmlAttributeToElement();\n this.defaultKeyConfigs = this.getDefaultKeyConfig();\n this.checkHtmlAttributes(false);\n this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';\n this.element.removeAttribute('tabindex');\n _super.prototype.preRender.call(this);\n };\n DatePicker.prototype.getDefaultKeyConfig = function () {\n this.defaultKeyConfigs = {\n altUpArrow: 'alt+uparrow',\n altDownArrow: 'alt+downarrow',\n escape: 'escape',\n enter: 'enter',\n controlUp: 'ctrl+38',\n controlDown: 'ctrl+40',\n moveDown: 'downarrow',\n moveUp: 'uparrow',\n moveLeft: 'leftarrow',\n moveRight: 'rightarrow',\n select: 'enter',\n home: 'home',\n end: 'end',\n pageUp: 'pageup',\n pageDown: 'pagedown',\n shiftPageUp: 'shift+pageup',\n shiftPageDown: 'shift+pagedown',\n controlHome: 'ctrl+home',\n controlEnd: 'ctrl+end',\n shiftTab: 'shift+tab',\n tab: 'tab'\n };\n return this.defaultKeyConfigs;\n };\n DatePicker.prototype.validationAttribute = function (target, inputElement) {\n var nameAttribute = target.getAttribute('name') ? target.getAttribute('name') : target.getAttribute('id');\n inputElement.setAttribute('name', nameAttribute);\n target.removeAttribute('name');\n var attribute = ['required', 'aria-required', 'form'];\n for (var i = 0; i < attribute.length; i++) {\n if (isNullOrUndefined(target.getAttribute(attribute[i]))) {\n continue;\n }\n var attr = target.getAttribute(attribute[i]);\n inputElement.setAttribute(attribute[i], attr);\n target.removeAttribute(attribute[i]);\n }\n };\n DatePicker.prototype.checkFormat = function () {\n var culture = new Internationalization(this.locale);\n if (this.format) {\n if (typeof this.format === 'string') {\n this.formatString = this.format;\n }\n else if (this.format.skeleton !== '' && !isNullOrUndefined(this.format.skeleton)) {\n var skeletonString = this.format.skeleton;\n if (this.getModuleName() === 'datetimepicker') {\n this.formatString = culture.getDatePattern({ skeleton: skeletonString, type: 'dateTime' });\n }\n else {\n this.formatString = culture.getDatePattern({ skeleton: skeletonString, type: 'date' });\n }\n }\n else {\n if (this.getModuleName() === 'datetimepicker') {\n this.formatString = this.dateTimeFormat;\n }\n else {\n this.formatString = null;\n }\n }\n }\n else {\n this.formatString = null;\n }\n };\n DatePicker.prototype.checkHtmlAttributes = function (dynamic) {\n this.globalize = new Internationalization(this.locale);\n this.checkFormat();\n this.checkView();\n var attributes = dynamic ? isNullOrUndefined(this.htmlAttributes) ? [] : Object.keys(this.htmlAttributes) :\n ['value', 'min', 'max', 'disabled', 'readonly', 'style', 'name', 'placeholder', 'type'];\n var options;\n if (this.getModuleName() === 'datetimepicker') {\n if (this.calendarMode === 'Gregorian') {\n options = {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,\n type: 'dateTime', skeleton: 'yMd'\n };\n }\n else {\n options = {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,\n type: 'dateTime', skeleton: 'yMd', calendar: 'islamic'\n };\n }\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n options = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n options = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n }\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var prop = attributes_1[_i];\n if (!isNullOrUndefined(this.inputElement.getAttribute(prop))) {\n switch (prop) {\n case 'disabled':\n if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['enabled'] === undefined)) || dynamic)) {\n var enabled = this.inputElement.getAttribute(prop) === 'disabled' ||\n this.inputElement.getAttribute(prop) === '' ||\n this.inputElement.getAttribute(prop) === 'true' ? false : true;\n this.setProperties({ enabled: enabled }, !dynamic);\n }\n break;\n case 'readonly':\n if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['readonly'] === undefined)) || dynamic)) {\n var readonly = this.inputElement.getAttribute(prop) === 'readonly' ||\n this.inputElement.getAttribute(prop) === '' || this.inputElement.getAttribute(prop) === 'true' ? true : false;\n this.setProperties({ readonly: readonly }, !dynamic);\n }\n break;\n case 'placeholder':\n if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['placeholder'] === undefined)) || dynamic)) {\n this.setProperties({ placeholder: this.inputElement.getAttribute(prop) }, !dynamic);\n }\n break;\n case 'style':\n this.inputElement.setAttribute('style', '' + this.inputElement.getAttribute(prop));\n break;\n case 'name':\n this.inputElement.setAttribute('name', '' + this.inputElement.getAttribute(prop));\n break;\n case 'value':\n if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['value'] === undefined)) || dynamic)) {\n var value = this.inputElement.getAttribute(prop);\n this.setProperties(setValue(prop, this.globalize.parseDate(value, options), {}), !dynamic);\n }\n break;\n case 'min':\n if ((+this.min === +new Date(1900, 0, 1)) || dynamic) {\n var min = this.inputElement.getAttribute(prop);\n this.setProperties(setValue(prop, this.globalize.parseDate(min), {}), !dynamic);\n }\n break;\n case 'max':\n if ((+this.max === +new Date(2099, 11, 31)) || dynamic) {\n var max = this.inputElement.getAttribute(prop);\n this.setProperties(setValue(prop, this.globalize.parseDate(max), {}), !dynamic);\n }\n break;\n case 'type':\n if (this.inputElement.getAttribute(prop) !== 'text') {\n this.inputElement.setAttribute('type', 'text');\n }\n break;\n }\n }\n }\n };\n /**\n * To get component name.\n *\n * @returns {string} Returns the component name.\n * @private\n */\n DatePicker.prototype.getModuleName = function () {\n return 'datepicker';\n };\n DatePicker.prototype.disabledDates = function (isDynamic, isBlur) {\n if (isDynamic === void 0) { isDynamic = false; }\n if (isBlur === void 0) { isBlur = false; }\n var formatOptions;\n var globalize;\n var valueCopy = this.checkDateValue(this.value) ? new Date(+this.value) : new Date(this.checkValue(this.value));\n var previousValCopy = this.previousDate;\n //calls the Calendar render method to check the disabled dates through renderDayCell event and update the input value accordingly.\n this.minMaxUpdates();\n if (!isDynamic || (isDynamic && !isNullOrUndefined(this.renderDayCell))) {\n _super.prototype.render.call(this);\n }\n this.previousDate = previousValCopy;\n var date = valueCopy && +(valueCopy);\n var dateIdString = '*[id^=\"/id\"]'.replace('/id', '' + date);\n if (!this.strictMode) {\n if (typeof this.value === 'string' || ((typeof this.value === 'object') && (+this.value) !== (+valueCopy))) {\n this.setProperties({ value: valueCopy }, true);\n }\n }\n if (!isNullOrUndefined(this.calendarElement) && !isNullOrUndefined(this.calendarElement.querySelectorAll(dateIdString)[0])) {\n if (this.calendarElement.querySelectorAll(dateIdString)[0].classList.contains('e-disabled')) {\n if (!this.strictMode) {\n this.currentDate = new Date(new Date().setHours(0, 0, 0, 0));\n }\n }\n }\n var inputVal;\n if (this.getModuleName() === 'datetimepicker') {\n if (this.calendarMode === 'Gregorian') {\n globalize = this.globalize.formatDate(valueCopy, {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,\n type: 'dateTime', skeleton: 'yMd'\n });\n }\n else {\n globalize = this.globalize.formatDate(valueCopy, {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,\n type: 'dateTime', skeleton: 'yMd', calendar: 'islamic'\n });\n }\n inputVal = globalize;\n }\n else {\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n inputVal = this.globalize.formatDate(valueCopy, formatOptions);\n }\n if (!this.popupObj) {\n this.updateInputValue(inputVal);\n if (this.enableMask) {\n this.updateInputValue(this.maskedDateValue);\n this.notify('createMask', {\n module: 'MaskedDateTime', isBlur: isBlur\n });\n }\n }\n };\n DatePicker.prototype.setAriaAttributes = function () {\n if (this.isCalendar()) {\n Input.addAttributes({ 'aria-expanded': 'true' }, this.inputElement);\n attributes(this.inputElement, { 'aria-owns': this.inputElement.id + '_options' });\n attributes(this.inputElement, { 'aria-controls': this.inputElement.id });\n if (this.value) {\n attributes(this.inputElement, { 'aria-activedescendant': '' + this.setActiveDescendant() });\n }\n }\n else {\n Input.addAttributes({ 'aria-expanded': 'false' }, this.inputElement);\n this.inputElement.removeAttribute('aria-owns');\n this.inputElement.removeAttribute('aria-controls');\n this.inputElement.removeAttribute('aria-activedescendant');\n }\n };\n DatePicker.prototype.errorClass = function () {\n var dateIdString = '*[id^=\"/id\"]'.replace('/id', '' + (+this.value));\n var isDisabledDate = this.calendarElement &&\n this.calendarElement.querySelectorAll(dateIdString)[0] &&\n this.calendarElement.querySelectorAll(dateIdString)[0].classList.contains('e-disabled');\n if ((!isNullOrUndefined(this.value) && !isNullOrUndefined(this.min) &&\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n !isNullOrUndefined(this.max) && !(new Date(this.value).setMilliseconds(0) >= new Date(this.min).setMilliseconds(0)\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n && new Date(this.value).setMilliseconds(0) <= new Date(this.max).setMilliseconds(0)))\n || (!this.strictMode && this.inputElement.value !== '' && this.inputElement.value !== this.maskedDateValue && isNullOrUndefined(this.value) || isDisabledDate)) {\n addClass([this.inputWrapper.container], ERROR);\n attributes(this.inputElement, { 'aria-invalid': 'true' });\n }\n else if (!isNullOrUndefined(this.inputWrapper)) {\n removeClass([this.inputWrapper.container], ERROR);\n attributes(this.inputElement, { 'aria-invalid': 'false' });\n }\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {DatePickerModel} newProp - Returns the dynamic property value of the component.\n * @param {DatePickerModel} oldProp - Returns the previous property value of the component.\n * @returns {void}\n * @private\n */\n DatePicker.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'value':\n this.isDynamicValueChanged = true;\n this.isInteracted = false;\n this.invalidValueString = null;\n this.checkInvalidValue(newProp.value);\n newProp.value = this.value;\n this.previousElementValue = this.inputElement.value;\n if (isNullOrUndefined(this.value)) {\n if (this.enableMask) {\n this.updateInputValue(this.maskedDateValue);\n }\n else {\n this.updateInputValue('');\n }\n this.currentDate = new Date(new Date().setHours(0, 0, 0, 0));\n }\n this.updateInput(true);\n if (+this.previousDate !== +this.value) {\n this.changeTrigger(null);\n }\n this.isInteracted = true;\n this.preventChange = this.isAngular && this.preventChange ? !this.preventChange : this.preventChange;\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n break;\n case 'format':\n this.checkFormat();\n this.bindInputEvent();\n this.updateInput();\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n if (!this.value) {\n this.updateInputValue(this.maskedDateValue);\n }\n }\n break;\n case 'allowEdit':\n this.setAllowEdit();\n break;\n case 'placeholder':\n Input.setPlaceholder(this.placeholder, this.inputElement);\n break;\n case 'readonly':\n Input.setReadonly(this.readonly, this.inputElement);\n break;\n case 'enabled':\n Input.setEnabled(this.enabled, this.inputElement);\n this.setAriaDisabled();\n break;\n case 'htmlAttributes':\n this.updateHtmlAttributeToElement();\n this.updateHtmlAttributeToWrapper();\n this.checkHtmlAttributes(true);\n break;\n case 'locale':\n this.globalize = new Internationalization(this.locale);\n this.l10n.setLocale(this.locale);\n if (this.datepickerOptions && this.datepickerOptions.placeholder == null) {\n this.setProperties({ placeholder: this.l10n.getConstant('placeholder') }, true);\n Input.setPlaceholder(this.placeholder, this.inputElement);\n }\n this.updateInput();\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n break;\n case 'enableRtl':\n Input.setEnableRtl(this.enableRtl, [this.inputWrapper.container]);\n break;\n case 'start':\n case 'depth':\n this.checkView();\n if (this.calendarElement) {\n _super.prototype.onPropertyChanged.call(this, newProp, oldProp);\n }\n break;\n case 'zIndex':\n this.setProperties({ zIndex: newProp.zIndex }, true);\n break;\n case 'cssClass':\n this.updateCssClass(newProp.cssClass, oldProp.cssClass);\n break;\n case 'showClearButton':\n Input.setClearButton(this.showClearButton, this.inputElement, this.inputWrapper);\n this.bindClearEvent();\n this.index = this.showClearButton ? 2 : 1;\n break;\n case 'strictMode':\n this.invalidValueString = null;\n this.updateInput();\n break;\n case 'width':\n this.setWidth(newProp.width);\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n break;\n case 'floatLabelType':\n this.floatLabelType = newProp.floatLabelType;\n Input.removeFloating(this.inputWrapper);\n Input.addFloating(this.inputElement, this.floatLabelType, this.placeholder);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n break;\n case 'enableMask':\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n this.updateInputValue(this.maskedDateValue);\n this.bindInputEvent();\n }\n else {\n if (this.inputElement.value === this.maskedDateValue) {\n this.updateInputValue('');\n }\n }\n break;\n default:\n if (this.calendarElement && this.isCalendar()) {\n _super.prototype.onPropertyChanged.call(this, newProp, oldProp);\n }\n break;\n }\n if (!this.isDynamicValueChanged) {\n this.hide(null);\n }\n this.isDynamicValueChanged = false;\n }\n };\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], DatePicker.prototype, \"strictMode\", void 0);\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"format\", void 0);\n __decorate([\n Property(true)\n ], DatePicker.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], DatePicker.prototype, \"fullScreenMode\", void 0);\n __decorate([\n Property({})\n ], DatePicker.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"values\", void 0);\n __decorate([\n Property(false)\n ], DatePicker.prototype, \"isMultiSelection\", void 0);\n __decorate([\n Property(true)\n ], DatePicker.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(true)\n ], DatePicker.prototype, \"allowEdit\", void 0);\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"keyConfigs\", void 0);\n __decorate([\n Property(false)\n ], DatePicker.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(1000)\n ], DatePicker.prototype, \"zIndex\", void 0);\n __decorate([\n Property(false)\n ], DatePicker.prototype, \"readonly\", void 0);\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"placeholder\", void 0);\n __decorate([\n Property('Never')\n ], DatePicker.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property(null)\n ], DatePicker.prototype, \"serverTimezoneOffset\", void 0);\n __decorate([\n Property(false)\n ], DatePicker.prototype, \"openOnFocus\", void 0);\n __decorate([\n Property(false)\n ], DatePicker.prototype, \"enableMask\", void 0);\n __decorate([\n Property({ day: 'day', month: 'month', year: 'year', hour: 'hour', minute: 'minute', second: 'second', dayOfTheWeek: 'day of the week' })\n ], DatePicker.prototype, \"maskPlaceholder\", void 0);\n __decorate([\n Event()\n ], DatePicker.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], DatePicker.prototype, \"cleared\", void 0);\n __decorate([\n Event()\n ], DatePicker.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], DatePicker.prototype, \"blur\", void 0);\n __decorate([\n Event()\n ], DatePicker.prototype, \"focus\", void 0);\n __decorate([\n Event()\n ], DatePicker.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], DatePicker.prototype, \"destroyed\", void 0);\n DatePicker = __decorate([\n NotifyPropertyChanges\n ], DatePicker);\n return DatePicker;\n}(Calendar));\nexport { DatePicker };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { EventHandler, Property, Internationalization, NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { KeyboardEvents, Animation, Browser } from '@syncfusion/ej2-base';\nimport { cldrData, L10n, Component, getDefaultDateObject, rippleEffect, Event } from '@syncfusion/ej2-base';\nimport { remove, addClass, detach, removeClass, closest, append, attributes, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, getValue, extend, getUniqueID, ChildProperty } from '@syncfusion/ej2-base';\nimport { Popup } from '@syncfusion/ej2-popups';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { ListBase } from '@syncfusion/ej2-lists';\nvar WRAPPERCLASS = 'e-time-wrapper';\nvar POPUP = 'e-popup';\nvar ERROR = 'e-error';\nvar POPUPDIMENSION = '240px';\nvar DAY = new Date().getDate();\nvar MONTH = new Date().getMonth();\nvar YEAR = new Date().getFullYear();\nvar ROOT = 'e-timepicker';\nvar LIBRARY = 'e-lib';\nvar CONTROL = 'e-control';\nvar CONTENT = 'e-content';\nvar SELECTED = 'e-active';\nvar HOVER = 'e-hover';\nvar NAVIGATION = 'e-navigation';\nvar DISABLED = 'e-disabled';\nvar ICONANIMATION = 'e-icon-anim';\nvar TIMEICON = 'e-time-icon';\nvar CLEARICON = 'e-clear-icon';\nvar FOCUS = 'e-input-focus';\nvar LISTCLASS = 'e-list-item';\nvar HALFPOSITION = 2;\nvar ANIMATIONDURATION = 50;\nvar OVERFLOW = 'e-time-overflow';\nvar OFFSETVAL = 4;\nvar EDITABLE = 'e-non-edit';\nvar wrapperAttributes = ['title', 'class', 'style'];\n// eslint-disable-next-line @typescript-eslint/no-namespace\nexport var TimePickerBase;\n(function (TimePickerBase) {\n // eslint-disable-next-line max-len, jsdoc/require-jsdoc\n function createListItems(createdEl, min, max, globalize, timeFormat, step) {\n var formatOptions;\n if (this.calendarMode === 'Gregorian') {\n formatOptions = { format: timeFormat, type: 'time' };\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n formatOptions = { format: timeFormat, type: 'time', calendar: 'islamic' };\n }\n var start;\n var interval = step * 60000;\n var listItems = [];\n var timeCollections = [];\n start = +(min.setMilliseconds(0));\n var end = +(max.setMilliseconds(0));\n while (end >= start) {\n timeCollections.push(start);\n listItems.push(globalize.formatDate(new Date(start), { format: timeFormat, type: 'time' }));\n start += interval;\n }\n var listTag = ListBase.createList(createdEl, listItems, null, true);\n return { collection: timeCollections, list: listTag };\n }\n TimePickerBase.createListItems = createListItems;\n})(TimePickerBase || (TimePickerBase = {}));\nvar TimeMaskPlaceholder = /** @class */ (function (_super) {\n __extends(TimeMaskPlaceholder, _super);\n function TimeMaskPlaceholder() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property('day')\n ], TimeMaskPlaceholder.prototype, \"day\", void 0);\n __decorate([\n Property('month')\n ], TimeMaskPlaceholder.prototype, \"month\", void 0);\n __decorate([\n Property('year')\n ], TimeMaskPlaceholder.prototype, \"year\", void 0);\n __decorate([\n Property('day of the week')\n ], TimeMaskPlaceholder.prototype, \"dayOfTheWeek\", void 0);\n __decorate([\n Property('hour')\n ], TimeMaskPlaceholder.prototype, \"hour\", void 0);\n __decorate([\n Property('minute')\n ], TimeMaskPlaceholder.prototype, \"minute\", void 0);\n __decorate([\n Property('second')\n ], TimeMaskPlaceholder.prototype, \"second\", void 0);\n return TimeMaskPlaceholder;\n}(ChildProperty));\nexport { TimeMaskPlaceholder };\n/**\n * TimePicker is an intuitive interface component which provides an options to select a time value\n * from popup list or to set a desired time value.\n * ```\n * \n * \n * ```\n */\nvar TimePicker = /** @class */ (function (_super) {\n __extends(TimePicker, _super);\n /**\n * Constructor for creating the widget\n *\n * @param {TimePickerModel} options - Specifies the TimePicker model.\n * @param {string | HTMLInputElement} element - Specifies the element to render as component.\n * @private\n */\n function TimePicker(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.liCollections = [];\n _this.timeCollections = [];\n _this.disableItemCollection = [];\n _this.invalidValueString = null;\n _this.isAngular = false;\n _this.preventChange = false;\n _this.maskedDateValue = '';\n _this.moduleName = _this.getModuleName();\n _this.timeOptions = options;\n return _this;\n }\n /**\n * Initialize the event handler\n *\n * @returns {void}\n * @private\n */\n TimePicker.prototype.preRender = function () {\n this.keyConfigure = {\n enter: 'enter',\n escape: 'escape',\n end: 'end',\n tab: 'tab',\n home: 'home',\n down: 'downarrow',\n up: 'uparrow',\n left: 'leftarrow',\n right: 'rightarrow',\n open: 'alt+downarrow',\n close: 'alt+uparrow'\n };\n this.cloneElement = this.element.cloneNode(true);\n removeClass([this.cloneElement], [ROOT, CONTROL, LIBRARY]);\n this.inputElement = this.element;\n this.angularTag = null;\n this.formElement = closest(this.element, 'form');\n if (this.element.tagName === 'EJS-TIMEPICKER') {\n this.angularTag = this.element.tagName;\n this.inputElement = this.createElement('input');\n this.element.appendChild(this.inputElement);\n }\n this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';\n this.element.removeAttribute('tabindex');\n this.openPopupEventArgs = {\n appendTo: document.body\n };\n };\n // element creation\n TimePicker.prototype.render = function () {\n this.initialize();\n this.createInputElement();\n this.updateHtmlAttributeToWrapper();\n this.setTimeAllowEdit();\n this.setEnable();\n this.validateInterval();\n this.bindEvents();\n this.validateDisable();\n this.setTimeZone();\n this.setValue(this.getFormattedValue(this.value));\n if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType === 'Always' || !this.floatLabelType || !this.placeholder)) {\n this.updateInputValue(this.maskedDateValue);\n this.checkErrorState(this.maskedDateValue);\n }\n this.anchor = this.inputElement;\n this.inputElement.setAttribute('value', this.inputElement.value);\n this.inputEleValue = this.getDateObject(this.inputElement.value);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {\n this.enabled = false;\n }\n this.renderComplete();\n };\n TimePicker.prototype.setTimeZone = function () {\n if (!isNullOrUndefined(this.serverTimezoneOffset) && this.value) {\n var clientTimeZoneDiff = new Date().getTimezoneOffset() / 60;\n var serverTimezoneDiff = this.serverTimezoneOffset;\n var timeZoneDiff = serverTimezoneDiff + clientTimeZoneDiff;\n timeZoneDiff = this.isDayLightSaving() ? timeZoneDiff-- : timeZoneDiff;\n this.value = new Date((this.value).getTime() + (timeZoneDiff * 60 * 60 * 1000));\n }\n };\n TimePicker.prototype.isDayLightSaving = function () {\n var firstOffset = new Date(this.value.getFullYear(), 0, 1).getTimezoneOffset();\n var secondOffset = new Date(this.value.getFullYear(), 6, 1).getTimezoneOffset();\n return (this.value.getTimezoneOffset() < Math.max(firstOffset, secondOffset));\n };\n TimePicker.prototype.setTimeAllowEdit = function () {\n if (this.allowEdit) {\n if (!this.readonly) {\n this.inputElement.removeAttribute('readonly');\n }\n }\n else {\n attributes(this.inputElement, { 'readonly': '' });\n }\n this.clearIconState();\n };\n TimePicker.prototype.clearIconState = function () {\n if (!this.allowEdit && this.inputWrapper && !this.readonly) {\n if (this.inputElement.value === '') {\n removeClass([this.inputWrapper.container], [EDITABLE]);\n }\n else {\n addClass([this.inputWrapper.container], [EDITABLE]);\n }\n }\n else if (this.inputWrapper) {\n removeClass([this.inputWrapper.container], [EDITABLE]);\n }\n };\n TimePicker.prototype.validateDisable = function () {\n this.setMinMax(this.initMin, this.initMax);\n if (!isNullOrUndefined(this.value)) {\n this.popupCreation();\n this.popupObj.destroy();\n this.popupWrapper = this.popupObj = null;\n }\n if ((!isNaN(+this.value) && this.value !== null)) {\n if (!this.valueIsDisable(this.value)) {\n //disable value given in value property so reset the date based on current date\n if (this.strictMode) {\n this.resetState();\n }\n this.initValue = null;\n this.initMax = this.getDateObject(this.initMax);\n this.initMin = this.getDateObject(this.initMin);\n this.timeCollections = this.liCollections = [];\n this.setMinMax(this.initMin, this.initMax);\n }\n }\n };\n TimePicker.prototype.validationAttribute = function (target, input) {\n var name = target.getAttribute('name') ? target.getAttribute('name') : target.getAttribute('id');\n input.setAttribute('name', name);\n target.removeAttribute('name');\n var attributes = ['required', 'aria-required', 'form'];\n for (var i = 0; i < attributes.length; i++) {\n if (isNullOrUndefined(target.getAttribute(attributes[i]))) {\n continue;\n }\n var attr = target.getAttribute(attributes[i]);\n input.setAttribute(attributes[i], attr);\n target.removeAttribute(attributes[i]);\n }\n };\n TimePicker.prototype.initialize = function () {\n this.globalize = new Internationalization(this.locale);\n this.defaultCulture = new Internationalization('en');\n this.checkTimeFormat();\n this.checkInvalidValue(this.value);\n // persist the value property.\n this.setProperties({ value: this.checkDateValue(new Date(this.checkInValue(this.value))) }, true);\n this.setProperties({ min: this.checkDateValue(new Date(this.checkInValue(this.min))) }, true);\n this.setProperties({ max: this.checkDateValue(new Date(this.checkInValue(this.max))) }, true);\n this.setProperties({ scrollTo: this.checkDateValue(new Date(this.checkInValue(this.scrollTo))) }, true);\n if (this.angularTag !== null) {\n this.validationAttribute(this.element, this.inputElement);\n }\n this.updateHtmlAttributeToElement();\n this.checkAttributes(false); //check the input element attributes\n var localeText = { placeholder: this.placeholder };\n this.l10n = new L10n('timepicker', localeText, this.locale);\n this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);\n this.initValue = this.checkDateValue(this.value);\n this.initMin = this.checkDateValue(this.min);\n this.initMax = this.checkDateValue(this.max);\n this.isNavigate = this.isPreventBlur = this.isTextSelected = false;\n this.activeIndex = this.valueWithMinutes = this.prevDate = null;\n if (!isNullOrUndefined(this.element.getAttribute('id'))) {\n if (this.angularTag !== null) {\n this.inputElement.id = this.element.getAttribute('id') + '_input';\n }\n }\n else {\n //for angular case\n this.element.id = getUniqueID('ej2_timepicker');\n if (this.angularTag !== null) {\n attributes(this.inputElement, { 'id': this.element.id + '_input' });\n }\n }\n if (isNullOrUndefined(this.inputElement.getAttribute('name'))) {\n attributes(this.inputElement, { 'name': this.element.id });\n }\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n };\n TimePicker.prototype.checkTimeFormat = function () {\n if (this.format) {\n if (typeof this.format === 'string') {\n this.formatString = this.format;\n }\n else if (!isNullOrUndefined(this.format.skeleton) && this.format.skeleton !== '') {\n var skeletonString = this.format.skeleton;\n this.formatString = this.globalize.getDatePattern({ type: 'time', skeleton: skeletonString });\n }\n else {\n this.formatString = this.globalize.getDatePattern({ type: 'time', skeleton: 'short' });\n }\n }\n else {\n this.formatString = null;\n }\n };\n TimePicker.prototype.checkDateValue = function (value) {\n return (!isNullOrUndefined(value) && value instanceof Date && !isNaN(+value)) ? value : null;\n };\n TimePicker.prototype.createInputElement = function () {\n if (this.fullScreenMode && Browser.isDevice) {\n this.cssClass += ' ' + \"e-popup-expand\";\n }\n var updatedCssClassesValue = this.cssClass;\n var isBindClearAction = this.enableMask ? false : true;\n if (!isNullOrUndefined(this.cssClass) && this.cssClass !== '') {\n updatedCssClassesValue = (this.cssClass.replace(/\\s+/g, ' ')).trim();\n }\n this.inputWrapper = Input.createInput({\n element: this.inputElement,\n bindClearAction: isBindClearAction,\n floatLabelType: this.floatLabelType,\n properties: {\n readonly: this.readonly,\n placeholder: this.placeholder,\n cssClass: updatedCssClassesValue,\n enabled: this.enabled,\n enableRtl: this.enableRtl,\n showClearButton: this.showClearButton\n },\n buttons: [' e-input-group-icon e-time-icon e-icons']\n }, this.createElement);\n this.inputWrapper.container.style.width = this.setWidth(this.width);\n attributes(this.inputElement, {\n 'aria-autocomplete': 'list', 'tabindex': '0',\n 'aria-expanded': 'false', 'role': 'combobox', 'autocomplete': 'off',\n 'autocorrect': 'off', 'autocapitalize': 'off', 'spellcheck': 'false',\n 'aria-disabled': 'false', 'aria-invalid': 'false'\n });\n if (!this.isNullOrEmpty(this.inputStyle)) {\n Input.addAttributes({ 'style': this.inputStyle }, this.inputElement);\n }\n addClass([this.inputWrapper.container], WRAPPERCLASS);\n };\n TimePicker.prototype.getCldrDateTimeFormat = function () {\n var culture = new Internationalization(this.locale);\n var cldrTime;\n var dateFormat = culture.getDatePattern({ skeleton: 'yMd' });\n if (this.isNullOrEmpty(this.formatString)) {\n cldrTime = dateFormat + ' ' + this.cldrFormat('time');\n }\n else {\n cldrTime = this.formatString;\n }\n return cldrTime;\n };\n TimePicker.prototype.checkInvalidValue = function (value) {\n var isInvalid = false;\n if (typeof value !== 'object' && !isNullOrUndefined(value)) {\n var valueString = value;\n if (typeof valueString === 'string') {\n valueString = valueString.trim();\n }\n var valueExpression = null;\n var valueExp = null;\n if (typeof value === 'number') {\n valueString = value.toString();\n }\n else if (typeof value === 'string') {\n if (!(/^[a-zA-Z0-9- ]*$/).test(value)) {\n valueExpression = this.setCurrentDate(this.getDateObject(value));\n if (isNullOrUndefined(valueExpression)) {\n valueExpression = this.checkDateValue(this.globalize.parseDate(valueString, {\n format: this.getCldrDateTimeFormat(), type: 'datetime'\n }));\n if (isNullOrUndefined(valueExpression)) {\n valueExpression = this.checkDateValue(this.globalize.parseDate(valueString, {\n format: this.formatString, type: 'dateTime', skeleton: 'yMd'\n }));\n }\n }\n }\n }\n valueExp = this.globalize.parseDate(valueString, {\n format: this.getCldrDateTimeFormat(), type: 'datetime'\n });\n valueExpression = (!isNullOrUndefined(valueExp) && valueExp instanceof Date && !isNaN(+valueExp)) ? valueExp : null;\n if (isNullOrUndefined(valueExpression) && valueString.replace(/\\s/g, '').length) {\n var extISOString = null;\n var basicISOString = null;\n // eslint-disable-next-line\n extISOString = /^\\s*((?:[+-]\\d{6}|\\d{4})-(?:\\d\\d-\\d\\d|W\\d\\d-\\d|W\\d\\d|\\d\\d\\d|\\d\\d))(?:(T| )(\\d\\d(?::\\d\\d(?::\\d\\d(?:[.,]\\d+)?)?)?)([\\+\\-]\\d\\d(?::?\\d\\d)?|\\s*Z)?)?/;\n // eslint-disable-next-line\n basicISOString = /^\\s*((?:[+-]\\d{6}|\\d{4})(?:\\d\\d\\d\\d|W\\d\\d\\d|W\\d\\d|\\d\\d\\d|\\d\\d))(?:(T| )(\\d\\d(?:\\d\\d(?:\\d\\d(?:[.,]\\d+)?)?)?)([\\+\\-]\\d\\d(?::?\\d\\d)?|\\s*Z)?)?/;\n if ((!extISOString.test(valueString) && !basicISOString.test(valueString))\n || ((/^[a-zA-Z0-9- ]*$/).test(value)) || isNaN(+new Date('' + valueString))) {\n isInvalid = true;\n }\n else {\n valueExpression = new Date('' + valueString);\n }\n }\n if (isInvalid) {\n if (!this.strictMode) {\n this.invalidValueString = valueString;\n }\n this.setProperties({ value: null }, true);\n this.initValue = null;\n }\n else {\n this.setProperties({ value: valueExpression }, true);\n this.initValue = this.value;\n }\n }\n };\n TimePicker.prototype.requiredModules = function () {\n var modules = [];\n if (this.enableMask) {\n modules.push({ args: [this], member: 'MaskedDateTime' });\n }\n return modules;\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n TimePicker.prototype.cldrFormat = function (type) {\n var cldrDateTimeString;\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrDateTimeString = (getValue('timeFormats.short', getDefaultDateObject()));\n }\n else {\n cldrDateTimeString = (this.getCultureTimeObject(cldrData, '' + this.locale));\n }\n return cldrDateTimeString;\n };\n // destroy function\n TimePicker.prototype.destroy = function () {\n this.hide();\n if (this.showClearButton) {\n this.clearButton = document.getElementsByClassName('e-clear-icon')[0];\n }\n this.unBindEvents();\n var ariaAttribute = {\n 'aria-autocomplete': 'list', 'tabindex': '0',\n 'aria-expanded': 'false', 'role': 'combobox', 'autocomplete': 'off',\n 'autocorrect': 'off', 'autocapitalize': 'off', 'spellcheck': 'false',\n 'aria-disabled': 'true', 'aria-invalid': 'false'\n };\n if (this.inputElement) {\n Input.removeAttributes(ariaAttribute, this.inputElement);\n if (this.angularTag === null) {\n this.inputWrapper.container.parentElement.appendChild(this.inputElement);\n }\n if (!isNullOrUndefined(this.cloneElement.getAttribute('tabindex'))) {\n this.inputElement.setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.inputElement.removeAttribute('tabindex');\n }\n this.ensureInputAttribute();\n this.enableElement([this.inputElement]);\n this.inputElement.classList.remove('e-input');\n if (isNullOrUndefined(this.cloneElement.getAttribute('disabled'))) {\n Input.setEnabled(true, this.inputElement, this.floatLabelType);\n }\n }\n if (this.inputWrapper.container) {\n detach(this.inputWrapper.container);\n }\n this.inputWrapper = this.popupWrapper = this.cloneElement = undefined;\n this.liCollections = this.timeCollections = this.disableItemCollection = [];\n if (!isNullOrUndefined(this.rippleFn)) {\n this.rippleFn();\n }\n Input.destroy({\n element: this.inputElement,\n floatLabelType: this.floatLabelType,\n properties: this.properties\n }, this.clearButton);\n _super.prototype.destroy.call(this);\n if (this.formElement) {\n EventHandler.remove(this.formElement, 'reset', this.formResetHandler);\n }\n this.rippleFn = null;\n this.openPopupEventArgs = null;\n this.selectedElement = null;\n this.listTag = null;\n this.liCollections = null;\n };\n TimePicker.prototype.ensureInputAttribute = function () {\n var propertyList = [];\n for (var i = 0; i < this.inputElement.attributes.length; i++) {\n propertyList[i] = this.inputElement.attributes[i].name;\n }\n for (var i = 0; i < propertyList.length; i++) {\n if (!isNullOrUndefined(this.cloneElement.getAttribute(propertyList[i]))) {\n this.inputElement.setAttribute(propertyList[i], this.cloneElement.getAttribute(propertyList[i]));\n if (propertyList[i].toLowerCase() === 'value') {\n this.inputElement.value = this.cloneElement.getAttribute(propertyList[i]);\n }\n }\n else {\n this.inputElement.removeAttribute(propertyList[i]);\n if (propertyList[i].toLowerCase() === 'value') {\n this.inputElement.value = '';\n }\n }\n }\n };\n //popup creation\n TimePicker.prototype.popupCreation = function () {\n this.popupWrapper = this.createElement('div', {\n className: ROOT + ' ' + POPUP,\n attrs: { 'id': this.element.id + '_popup', 'style': 'visibility:hidden' }\n });\n this.popupWrapper.setAttribute('aria-label', this.element.id);\n this.popupWrapper.setAttribute('role', 'dialog');\n if (!isNullOrUndefined(this.cssClass)) {\n this.popupWrapper.className += ' ' + this.cssClass;\n }\n if (!isNullOrUndefined(this.step) && this.step > 0) {\n this.generateList();\n append([this.listWrapper], this.popupWrapper);\n }\n this.addSelection();\n this.renderPopup();\n detach(this.popupWrapper);\n };\n TimePicker.prototype.getPopupHeight = function () {\n var height = parseInt(POPUPDIMENSION, 10);\n var popupHeight = this.popupWrapper.getBoundingClientRect().height;\n return popupHeight > height ? height : popupHeight;\n };\n TimePicker.prototype.generateList = function () {\n this.createListItems();\n this.wireListEvents();\n var rippleModel = { duration: 300, selector: '.' + LISTCLASS };\n this.rippleFn = rippleEffect(this.listWrapper, rippleModel);\n this.liCollections = this.listWrapper.querySelectorAll('.' + LISTCLASS);\n };\n TimePicker.prototype.renderPopup = function () {\n var _this = this;\n this.containerStyle = this.inputWrapper.container.getBoundingClientRect();\n this.popupObj = new Popup(this.popupWrapper, {\n width: this.setPopupWidth(this.width),\n zIndex: this.zIndex,\n targetType: 'relative',\n position: Browser.isDevice ? { X: 'center', Y: 'center' } : { X: 'left', Y: 'bottom' },\n collision: Browser.isDevice ? { X: 'fit', Y: 'fit' } : { X: 'flip', Y: 'flip' },\n enableRtl: this.enableRtl,\n relateTo: Browser.isDevice ? document.body : this.inputWrapper.container,\n offsetY: OFFSETVAL,\n open: function () {\n _this.popupWrapper.style.visibility = 'visible';\n addClass([_this.inputWrapper.buttons[0]], SELECTED);\n }, close: function () {\n removeClass([_this.inputWrapper.buttons[0]], SELECTED);\n _this.unWireListEvents();\n _this.inputElement.removeAttribute('aria-activedescendant');\n remove(_this.popupObj.element);\n _this.popupObj.destroy();\n _this.popupWrapper.innerHTML = '';\n _this.listWrapper = _this.popupWrapper = _this.listTag = undefined;\n }, targetExitViewport: function () {\n if (!Browser.isDevice) {\n _this.hide();\n }\n }\n });\n if (!Browser.isDevice) {\n this.popupObj.collision = { X: 'none', Y: 'flip' };\n }\n if (Browser.isDevice && this.fullScreenMode) {\n this.popupObj.element.style.maxHeight = \"100%\";\n this.popupObj.element.style.width = \"100%\";\n }\n else {\n this.popupObj.element.style.maxHeight = POPUPDIMENSION;\n }\n if (Browser.isDevice && this.fullScreenMode) {\n var modelHeader = this.createElement('div', { className: 'e-model-header' });\n var modelTitleSpan = this.createElement(\"span\", { className: \"e-model-title\" });\n modelTitleSpan.textContent = \"Select time\";\n var modelCloseIcon = this.createElement(\"span\", { className: \"e-popup-close\" });\n EventHandler.add(modelCloseIcon, 'mousedown touchstart', this.timePopupCloseHandler, this);\n modelHeader.appendChild(modelCloseIcon);\n modelHeader.appendChild(modelTitleSpan);\n this.popupWrapper.insertBefore(modelHeader, this.popupWrapper.firstElementChild);\n }\n };\n TimePicker.prototype.timePopupCloseHandler = function (e) {\n this.hide();\n };\n //util function\n TimePicker.prototype.getFormattedValue = function (value) {\n if (isNullOrUndefined(this.checkDateValue(value))) {\n return null;\n }\n else {\n return this.globalize.formatDate(value, { skeleton: 'medium', type: 'time' });\n }\n };\n TimePicker.prototype.getDateObject = function (text) {\n if (!this.isNullOrEmpty(text)) {\n var dateValue = this.createDateObj(text);\n var value = !this.isNullOrEmpty(this.initValue);\n if (this.checkDateValue(dateValue)) {\n var date = value ? this.initValue.getDate() : DAY;\n var month = value ? this.initValue.getMonth() : MONTH;\n var year = value ? this.initValue.getFullYear() : YEAR;\n return new Date(year, month, date, dateValue.getHours(), dateValue.getMinutes(), dateValue.getSeconds());\n }\n }\n return null;\n };\n TimePicker.prototype.updateHtmlAttributeToWrapper = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (wrapperAttributes.indexOf(key) > -1) {\n if (key === 'class') {\n var updatedClassesValue = (this.htmlAttributes[\"\" + key].replace(/\\s+/g, ' ')).trim();\n if (updatedClassesValue !== '') {\n addClass([this.inputWrapper.container], updatedClassesValue.split(' '));\n }\n }\n else if (key === 'style') {\n var timeStyle = this.inputWrapper.container.getAttribute(key);\n timeStyle = !isNullOrUndefined(timeStyle) ? (timeStyle + this.htmlAttributes[\"\" + key]) :\n this.htmlAttributes[\"\" + key];\n this.inputWrapper.container.setAttribute(key, timeStyle);\n }\n else {\n this.inputWrapper.container.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n }\n }\n };\n TimePicker.prototype.updateHtmlAttributeToElement = function () {\n if (!isNullOrUndefined(this.htmlAttributes)) {\n for (var _i = 0, _a = Object.keys(this.htmlAttributes); _i < _a.length; _i++) {\n var key = _a[_i];\n if (wrapperAttributes.indexOf(key) < 0) {\n this.inputElement.setAttribute(key, this.htmlAttributes[\"\" + key]);\n }\n }\n }\n };\n TimePicker.prototype.updateCssClass = function (cssClassNew, cssClassOld) {\n if (!isNullOrUndefined(cssClassOld)) {\n cssClassOld = (cssClassOld.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(cssClassNew)) {\n cssClassNew = (cssClassNew.replace(/\\s+/g, ' ')).trim();\n }\n Input.setCssClass(cssClassNew, [this.inputWrapper.container], cssClassOld);\n if (this.popupWrapper) {\n Input.setCssClass(cssClassNew, [this.popupWrapper], cssClassOld);\n }\n };\n TimePicker.prototype.removeErrorClass = function () {\n removeClass([this.inputWrapper.container], ERROR);\n attributes(this.inputElement, { 'aria-invalid': 'false' });\n };\n TimePicker.prototype.checkErrorState = function (val) {\n var value = this.getDateObject(val);\n if ((this.validateState(value) && !this.invalidValueString) ||\n (this.enableMask && this.inputElement.value === this.maskedDateValue)) {\n this.removeErrorClass();\n }\n else {\n addClass([this.inputWrapper.container], ERROR);\n attributes(this.inputElement, { 'aria-invalid': 'true' });\n }\n };\n TimePicker.prototype.validateInterval = function () {\n if (!isNullOrUndefined(this.step) && this.step > 0) {\n this.enableElement([this.inputWrapper.buttons[0]]);\n }\n else {\n this.disableTimeIcon();\n }\n };\n TimePicker.prototype.disableTimeIcon = function () {\n this.disableElement([this.inputWrapper.buttons[0]]);\n this.hide();\n };\n TimePicker.prototype.disableElement = function (element) {\n addClass(element, DISABLED);\n };\n TimePicker.prototype.enableElement = function (element) {\n removeClass(element, DISABLED);\n };\n TimePicker.prototype.selectInputText = function () {\n this.inputElement.setSelectionRange(0, (this.inputElement).value.length);\n };\n TimePicker.prototype.setCursorToEnd = function () {\n this.inputElement.setSelectionRange((this.inputElement).value.length, (this.inputElement).value.length);\n };\n TimePicker.prototype.getMeridianText = function () {\n var meridian;\n if (this.locale === 'en' || this.locale === 'en-US') {\n meridian = getValue('dayPeriods.format.wide', getDefaultDateObject());\n }\n else {\n var gregorianFormat = '.dates.calendars.gregorian.dayPeriods.format.abbreviated';\n var mainVal = 'main.';\n meridian = getValue(mainVal + '' + this.locale + gregorianFormat, cldrData);\n }\n return meridian;\n };\n TimePicker.prototype.getCursorSelection = function () {\n var input = (this.inputElement);\n var start = 0;\n var end = 0;\n if (!isNaN(input.selectionStart)) {\n start = input.selectionStart;\n end = input.selectionEnd;\n }\n return { start: Math.abs(start), end: Math.abs(end) };\n };\n TimePicker.prototype.getActiveElement = function () {\n if (!isNullOrUndefined(this.popupWrapper)) {\n return this.popupWrapper.querySelectorAll('.' + SELECTED);\n }\n else {\n return null;\n }\n };\n TimePicker.prototype.isNullOrEmpty = function (value) {\n if (isNullOrUndefined(value) || (typeof value === 'string' && value.trim() === '')) {\n return true;\n }\n else {\n return false;\n }\n };\n TimePicker.prototype.setWidth = function (width) {\n if (typeof width === 'number') {\n width = formatUnit(width);\n }\n else if (typeof width === 'string') {\n width = (width.match(/px|%|em/)) ? width : formatUnit(width);\n }\n else {\n width = '100%';\n }\n return width;\n };\n TimePicker.prototype.setPopupWidth = function (width) {\n width = this.setWidth(width);\n if (width.indexOf('%') > -1) {\n var inputWidth = this.containerStyle.width * parseFloat(width) / 100;\n width = inputWidth.toString() + 'px';\n }\n return width;\n };\n TimePicker.prototype.setScrollPosition = function () {\n var element = this.selectedElement;\n if (!isNullOrUndefined(element)) {\n this.findScrollTop(element);\n }\n else if (this.popupWrapper && this.checkDateValue(this.scrollTo)) {\n this.setScrollTo();\n }\n };\n TimePicker.prototype.findScrollTop = function (element) {\n var listHeight = this.getPopupHeight();\n var nextEle = element.nextElementSibling;\n var height = nextEle ? nextEle.offsetTop : element.offsetTop;\n var liHeight = element.getBoundingClientRect().height;\n if ((height + element.offsetTop) > listHeight) {\n this.popupWrapper.scrollTop = nextEle ? (height - (listHeight / HALFPOSITION + liHeight / HALFPOSITION)) : height;\n }\n else {\n this.popupWrapper.scrollTop = 0;\n }\n };\n TimePicker.prototype.setScrollTo = function () {\n var element;\n if (!isNullOrUndefined(this.popupWrapper)) {\n var items = this.popupWrapper.querySelectorAll('.' + LISTCLASS);\n if (items.length) {\n var initialTime = this.timeCollections[0];\n var scrollTime = this.getDateObject(this.checkDateValue(this.scrollTo)).getTime();\n element = items[Math.round((scrollTime - initialTime) / (this.step * 60000))];\n }\n }\n else {\n this.popupWrapper.scrollTop = 0;\n }\n if (!isNullOrUndefined(element)) {\n this.findScrollTop(element);\n }\n else {\n this.popupWrapper.scrollTop = 0;\n }\n };\n TimePicker.prototype.getText = function () {\n return (isNullOrUndefined(this.checkDateValue(this.value))) ? '' : this.getValue(this.value);\n };\n TimePicker.prototype.getValue = function (value) {\n return (isNullOrUndefined(this.checkDateValue(value))) ? null : this.globalize.formatDate(value, {\n format: this.cldrTimeFormat(), type: 'time'\n });\n };\n TimePicker.prototype.cldrDateFormat = function () {\n var cldrDate;\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrDate = (getValue('dateFormats.short', getDefaultDateObject()));\n }\n else {\n cldrDate = (this.getCultureDateObject(cldrData, '' + this.locale));\n }\n return cldrDate;\n };\n TimePicker.prototype.cldrTimeFormat = function () {\n var cldrTime;\n if (this.isNullOrEmpty(this.formatString)) {\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrTime = (getValue('timeFormats.short', getDefaultDateObject()));\n }\n else {\n cldrTime = (this.getCultureTimeObject(cldrData, '' + this.locale));\n }\n }\n else {\n cldrTime = this.formatString;\n }\n return cldrTime;\n };\n TimePicker.prototype.dateToNumeric = function () {\n var cldrTime;\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrTime = (getValue('timeFormats.medium', getDefaultDateObject()));\n }\n else {\n cldrTime = (getValue('main.' + '' + this.locale + '.dates.calendars.gregorian.timeFormats.medium', cldrData));\n }\n return cldrTime;\n };\n TimePicker.prototype.getExactDateTime = function (value) {\n if (isNullOrUndefined(this.checkDateValue(value))) {\n return null;\n }\n else {\n return this.globalize.formatDate(value, { format: this.dateToNumeric(), type: 'time' });\n }\n };\n TimePicker.prototype.setValue = function (value) {\n var time = this.checkValue(value);\n if (!this.strictMode && !this.validateState(time)) {\n if (this.checkDateValue(this.valueWithMinutes) === null) {\n this.initValue = this.valueWithMinutes = null;\n }\n this.validateMinMax(this.value, this.min, this.max);\n }\n else {\n if (this.isNullOrEmpty(time)) {\n this.initValue = null;\n this.validateMinMax(this.value, this.min, this.max);\n }\n else {\n this.initValue = this.compareFormatChange(time);\n }\n }\n this.updateInput(true, this.initValue);\n };\n TimePicker.prototype.compareFormatChange = function (value) {\n if (isNullOrUndefined(value)) {\n return null;\n }\n return (value !== this.getText()) ? this.getDateObject(value) : this.getDateObject(this.value);\n };\n TimePicker.prototype.updatePlaceHolder = function () {\n Input.setPlaceholder(this.l10n.getConstant('placeholder'), this.inputElement);\n };\n //event related functions\n TimePicker.prototype.updateInputValue = function (value) {\n Input.setValue(value, this.inputElement, this.floatLabelType, this.showClearButton);\n };\n TimePicker.prototype.preventEventBubbling = function (e) {\n e.preventDefault();\n this.interopAdaptor.invokeMethodAsync('OnTimeIconClick');\n };\n TimePicker.prototype.popupHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n if (Browser.isDevice) {\n this.inputElement.setAttribute('readonly', '');\n }\n e.preventDefault();\n if (this.isPopupOpen()) {\n this.closePopup(0, e);\n }\n else {\n this.inputElement.focus();\n this.show(e);\n }\n };\n TimePicker.prototype.mouseDownHandler = function () {\n if (!this.enabled) {\n return;\n }\n if (!this.readonly) {\n this.inputElement.setSelectionRange(0, 0);\n EventHandler.add(this.inputElement, 'mouseup', this.mouseUpHandler, this);\n }\n };\n TimePicker.prototype.mouseUpHandler = function (event) {\n if (!this.readonly) {\n event.preventDefault();\n if (this.enableMask) {\n event.preventDefault();\n this.notify('setMaskSelection', {\n module: 'MaskedDateTime'\n });\n return;\n }\n else {\n EventHandler.remove(this.inputElement, 'mouseup', this.mouseUpHandler);\n var curPos = this.getCursorSelection();\n if (!(curPos.start === 0 && curPos.end === this.inputElement.value.length)) {\n if (this.inputElement.value.length > 0) {\n this.cursorDetails = this.focusSelection();\n }\n this.inputElement.setSelectionRange(this.cursorDetails.start, this.cursorDetails.end);\n }\n }\n }\n };\n TimePicker.prototype.focusSelection = function () {\n var regex = new RegExp('^[a-zA-Z0-9]+$');\n var split = this.inputElement.value.split('');\n split.push(' ');\n var curPos = this.getCursorSelection();\n var start = 0;\n var end = 0;\n var isSeparator = false;\n if (!this.isTextSelected) {\n for (var i = 0; i < split.length; i++) {\n if (!regex.test(split[i])) {\n end = i;\n isSeparator = true;\n }\n if (isSeparator) {\n if (curPos.start >= start && curPos.end <= end) {\n // eslint-disable-next-line no-self-assign\n end = end;\n this.isTextSelected = true;\n break;\n }\n else {\n start = i + 1;\n isSeparator = false;\n }\n }\n }\n }\n else {\n start = curPos.start;\n end = curPos.end;\n this.isTextSelected = false;\n }\n return { start: start, end: end };\n };\n TimePicker.prototype.inputHandler = function (event) {\n if (!this.readonly && this.enabled) {\n if (!((event.action == 'right' || event.action == 'left' || event.action == 'tab') || ((event.action == 'home' || event.action == 'end' || event.action == 'up' || event.action == 'down') && !this.isPopupOpen() && !this.enableMask))) {\n event.preventDefault();\n }\n switch (event.action) {\n case 'home':\n case 'end':\n case 'up':\n case 'down':\n if (!this.isPopupOpen()) {\n this.popupCreation();\n this.popupObj.destroy();\n this.popupObj = this.popupWrapper = null;\n }\n if (this.enableMask && !this.readonly && !this.isPopupOpen()) {\n event.preventDefault();\n this.notify('keyDownHandler', {\n module: 'MaskedDateTime',\n e: event\n });\n }\n if (this.isPopupOpen()) {\n this.keyHandler(event);\n }\n break;\n case 'enter':\n if (this.isNavigate) {\n this.selectedElement = this.liCollections[this.activeIndex];\n this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);\n this.updateValue(this.valueWithMinutes, event);\n }\n else {\n this.updateValue(this.inputElement.value, event);\n }\n this.hide();\n this.isNavigate = false;\n if (this.isPopupOpen()) {\n event.stopPropagation();\n }\n break;\n case 'open':\n this.show(event);\n break;\n case 'escape':\n this.updateInputValue(this.objToString(this.value));\n if (this.enableMask) {\n if (!this.value) {\n this.updateInputValue(this.maskedDateValue);\n }\n this.createMask();\n }\n this.previousState(this.value);\n this.hide();\n break;\n case 'close':\n this.hide();\n break;\n case 'right':\n case 'left':\n case 'tab':\n case 'shiftTab':\n if (!this.isPopupOpen() && this.enableMask && !this.readonly) {\n if ((this.inputElement.selectionStart === 0 && this.inputElement.selectionEnd === this.inputElement.value.length) ||\n (this.inputElement.selectionEnd !== this.inputElement.value.length && event.action === 'tab') ||\n (this.inputElement.selectionStart !== 0 && event.action === 'shiftTab') || (event.action === 'left' || event.action === 'right')) {\n event.preventDefault();\n }\n this.notify('keyDownHandler', { module: 'MaskedDateTime',\n e: event\n });\n }\n break;\n default:\n this.isNavigate = false;\n break;\n }\n }\n };\n TimePicker.prototype.onMouseClick = function (event) {\n var target = event.target;\n var li = this.selectedElement = closest(target, '.' + LISTCLASS);\n this.setSelection(li, event);\n if (li && li.classList.contains(LISTCLASS)) {\n this.hide();\n }\n };\n TimePicker.prototype.closePopup = function (delay, e) {\n var _this = this;\n if (this.isPopupOpen() && this.popupWrapper) {\n var args = {\n popup: this.popupObj,\n event: e || null,\n cancel: false,\n name: 'open'\n };\n removeClass([document.body], OVERFLOW);\n this.trigger('close', args, function (args) {\n if (!args.cancel) {\n var animModel = {\n name: 'FadeOut',\n duration: ANIMATIONDURATION,\n delay: delay ? delay : 0\n };\n _this.popupObj.hide(new Animation(animModel));\n removeClass([_this.inputWrapper.container], [ICONANIMATION]);\n attributes(_this.inputElement, { 'aria-expanded': 'false' });\n _this.inputElement.removeAttribute('aria-owns');\n _this.inputElement.removeAttribute('aria-controls');\n _this.inputElement.removeAttribute('aria-activedescendant');\n EventHandler.remove(document, 'mousedown touchstart', _this.documentClickHandler);\n }\n if (Browser.isDevice && _this.modal) {\n _this.modal.style.display = 'none';\n _this.modal.outerHTML = '';\n _this.modal = null;\n }\n if (Browser.isDevice) {\n if (!isNullOrUndefined(_this.mobileTimePopupWrap)) {\n _this.mobileTimePopupWrap.remove();\n _this.mobileTimePopupWrap = null;\n }\n }\n if (Browser.isDevice && _this.allowEdit && !_this.readonly) {\n _this.inputElement.removeAttribute('readonly');\n }\n });\n }\n else {\n if (Browser.isDevice && this.allowEdit && !this.readonly) {\n this.inputElement.removeAttribute('readonly');\n }\n }\n };\n TimePicker.prototype.disposeServerPopup = function () {\n if (this.popupWrapper) {\n this.popupWrapper.style.visibility = 'hidden';\n this.popupWrapper.style.top = '-9999px';\n this.popupWrapper.style.left = '-9999px';\n this.popupWrapper.style.width = '0px';\n this.popupWrapper.style.height = '0px';\n }\n };\n TimePicker.prototype.checkValueChange = function (event, isNavigation) {\n if (!this.strictMode && !this.validateState(this.valueWithMinutes)) {\n if (this.checkDateValue(this.valueWithMinutes) === null) {\n this.initValue = this.valueWithMinutes = null;\n }\n this.setProperties({ value: this.compareFormatChange(this.inputElement.value) }, true);\n this.initValue = this.valueWithMinutes = this.compareFormatChange(this.inputElement.value);\n this.prevValue = this.inputElement.value;\n if (+this.prevDate !== +this.value) {\n this.changeEvent(event);\n }\n }\n else {\n if (!isNavigation) {\n if ((this.prevValue !== this.inputElement.value) || isNullOrUndefined(this.checkDateValue(this.value))) {\n this.valueProcess(event, this.compareFormatChange(this.inputElement.value));\n }\n }\n else {\n var value = this.getDateObject(new Date(this.timeCollections[this.activeIndex]));\n if (+this.prevDate !== +value) {\n this.valueProcess(event, value);\n }\n }\n }\n };\n TimePicker.prototype.onMouseOver = function (event) {\n var currentLi = closest(event.target, '.' + LISTCLASS);\n this.setHover(currentLi, HOVER);\n };\n TimePicker.prototype.setHover = function (li, className) {\n if (this.enabled && this.isValidLI(li) && !li.classList.contains(className)) {\n this.removeHover(className);\n addClass([li], className);\n if (className === NAVIGATION) {\n li.setAttribute('aria-selected', 'true');\n }\n }\n };\n TimePicker.prototype.setSelection = function (li, event) {\n if (this.isValidLI(li)) {\n this.checkValue(li.getAttribute('data-value'));\n if (this.enableMask) {\n this.createMask();\n }\n this.selectedElement = li;\n this.activeIndex = Array.prototype.slice.call(this.liCollections).indexOf(li);\n this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);\n addClass([this.selectedElement], SELECTED);\n this.selectedElement.setAttribute('aria-selected', 'true');\n this.checkValueChange(event, true);\n }\n };\n TimePicker.prototype.onMouseLeave = function () {\n this.removeHover(HOVER);\n };\n TimePicker.prototype.scrollHandler = function () {\n if (this.getModuleName() === 'timepicker' && Browser.isDevice) {\n return;\n }\n else {\n this.hide();\n }\n };\n TimePicker.prototype.setMinMax = function (minVal, maxVal) {\n if (isNullOrUndefined(this.checkDateValue(minVal))) {\n this.initMin = this.getDateObject('12:00:00 AM');\n }\n if (isNullOrUndefined(this.checkDateValue(maxVal))) {\n this.initMax = this.getDateObject('11:59:59 PM');\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n TimePicker.prototype.validateMinMax = function (dateVal, minVal, maxVal) {\n var value = dateVal instanceof Date ? dateVal : this.getDateObject(dateVal);\n if (!isNullOrUndefined(this.checkDateValue(value))) {\n dateVal = this.strictOperation(this.initMin, this.initMax, dateVal, value);\n }\n else if (+(this.createDateObj(this.getFormattedValue(this.initMin))) >\n +(this.createDateObj(this.getFormattedValue(this.initMax)))) {\n this.disableTimeIcon();\n }\n if (this.strictMode) {\n dateVal = this.valueIsDisable(dateVal) ? dateVal : null;\n }\n this.checkErrorState(dateVal);\n return dateVal;\n };\n TimePicker.prototype.valueIsDisable = function (value) {\n if (this.disableItemCollection.length > 0) {\n if (this.disableItemCollection.length === this.timeCollections.length) {\n return false;\n }\n var time = value instanceof Date ? this.objToString(value) : value;\n for (var index = 0; index < this.disableItemCollection.length; index++) {\n if (time === this.disableItemCollection[index]) {\n return false;\n }\n }\n }\n return true;\n };\n TimePicker.prototype.validateState = function (val) {\n if (!this.strictMode) {\n if (this.valueIsDisable(val)) {\n var value = typeof val === 'string' ? this.setCurrentDate(this.getDateObject(val)) :\n this.setCurrentDate(this.getDateObject(val));\n var maxValue = this.setCurrentDate(this.getDateObject(this.initMax));\n var minValue = this.setCurrentDate(this.getDateObject(this.initMin));\n if (!isNullOrUndefined(this.checkDateValue(value))) {\n if ((+(value) > +(maxValue)) || (+(value) < +(minValue))) {\n return false;\n }\n }\n else {\n if ((+(maxValue) < +(minValue)) || this.inputElement.value !== '') {\n return false;\n }\n }\n }\n else {\n return false;\n }\n }\n return true;\n };\n TimePicker.prototype.strictOperation = function (minimum, maximum, dateVal, val) {\n var maxValue = this.createDateObj(this.getFormattedValue(maximum));\n var minValue = this.createDateObj(this.getFormattedValue(minimum));\n var value = this.createDateObj(this.getFormattedValue(val));\n if (this.strictMode) {\n if (+minValue > +maxValue) {\n this.disableTimeIcon();\n this.initValue = this.getDateObject(maxValue);\n this.updateInputValue(this.getValue(this.initValue));\n if (this.enableMask) {\n this.createMask();\n }\n return this.inputElement.value;\n }\n else if (+minValue >= +value) {\n return this.getDateObject(minValue);\n }\n else if (+value >= +maxValue || +minValue === +maxValue) {\n return this.getDateObject(maxValue);\n }\n }\n else {\n if (+minValue > +maxValue) {\n this.disableTimeIcon();\n if (!isNaN(+this.createDateObj(dateVal))) {\n return dateVal;\n }\n }\n }\n return dateVal;\n };\n TimePicker.prototype.bindEvents = function () {\n EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', this.popupHandler, this);\n EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);\n EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);\n EventHandler.add(this.inputElement, 'change', this.inputChangeHandler, this);\n EventHandler.add(this.inputElement, 'input', this.inputEventHandler, this);\n if (this.enableMask) {\n EventHandler.add(this.inputElement, 'keydown', this.keydownHandler, this);\n }\n if (this.showClearButton && this.inputWrapper.clearButton) {\n EventHandler.add(this.inputWrapper.clearButton, 'mousedown', this.clearHandler, this);\n }\n if (this.formElement) {\n EventHandler.add(this.formElement, 'reset', this.formResetHandler, this);\n }\n if (!Browser.isDevice) {\n this.keyConfigure = extend(this.keyConfigure, this.keyConfigs);\n this.inputEvent = new KeyboardEvents(this.inputWrapper.container, {\n keyAction: this.inputHandler.bind(this),\n keyConfigs: this.keyConfigure,\n eventName: 'keydown'\n });\n if (this.showClearButton && this.inputElement) {\n EventHandler.add(this.inputElement, 'mousedown', this.mouseDownHandler, this);\n }\n }\n };\n TimePicker.prototype.keydownHandler = function (e) {\n switch (e.code) {\n case 'Delete':\n if (this.enableMask && !this.popupObj && !this.readonly) {\n this.notify('keyDownHandler', {\n module: 'MaskedDateTime',\n e: e\n });\n }\n break;\n default:\n break;\n }\n };\n TimePicker.prototype.formResetHandler = function () {\n if (!this.enabled) {\n return;\n }\n if (!this.inputElement.disabled) {\n var timeValue = this.inputElement.getAttribute('value');\n var val = this.checkDateValue(this.inputEleValue);\n if (this.element.tagName === 'EJS-TIMEPICKER') {\n val = null;\n timeValue = '';\n this.inputElement.setAttribute('value', '');\n }\n this.setProperties({ value: val }, true);\n this.prevDate = this.value;\n this.valueWithMinutes = this.value;\n this.initValue = this.value;\n if (this.inputElement) {\n this.updateInputValue(timeValue);\n if (this.enableMask) {\n if (!timeValue) {\n this.updateInputValue(this.maskedDateValue);\n }\n this.createMask();\n }\n this.checkErrorState(timeValue);\n this.prevValue = this.inputElement.value;\n }\n }\n };\n TimePicker.prototype.inputChangeHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n e.stopPropagation();\n };\n TimePicker.prototype.inputEventHandler = function () {\n if (this.enableMask) {\n this.notify('inputHandler', {\n module: 'MaskedDateTime'\n });\n }\n };\n TimePicker.prototype.unBindEvents = function () {\n if (this.inputWrapper) {\n EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown touchstart', this.popupHandler);\n }\n EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);\n EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);\n EventHandler.remove(this.inputElement, 'change', this.inputChangeHandler);\n EventHandler.remove(this.inputElement, 'input', this.inputEventHandler);\n if (this.inputEvent) {\n this.inputEvent.destroy();\n }\n EventHandler.remove(this.inputElement, 'mousedown touchstart', this.mouseDownHandler);\n if (this.showClearButton && !isNullOrUndefined(this.inputWrapper) && !isNullOrUndefined(this.inputWrapper.clearButton)) {\n EventHandler.remove(this.inputWrapper.clearButton, 'mousedown touchstart', this.clearHandler);\n }\n if (this.formElement) {\n EventHandler.remove(this.formElement, 'reset', this.formResetHandler);\n }\n };\n TimePicker.prototype.bindClearEvent = function () {\n if (this.showClearButton && this.inputWrapper.clearButton) {\n EventHandler.add(this.inputWrapper.clearButton, 'mousedown', this.clearHandler, this);\n }\n };\n TimePicker.prototype.raiseClearedEvent = function (e) {\n var clearedArgs = {\n event: e\n };\n this.trigger('cleared', clearedArgs);\n };\n TimePicker.prototype.clearHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n e.preventDefault();\n if (!isNullOrUndefined(this.value)) {\n this.clear(e);\n }\n else {\n this.resetState();\n this.raiseClearedEvent(e);\n }\n if (this.popupWrapper) {\n this.popupWrapper.scrollTop = 0;\n }\n if (this.enableMask) {\n this.notify('clearHandler', {\n module: 'MaskedDateTime'\n });\n }\n if (closest(this.element, 'form')) {\n var element = this.element;\n var keyupEvent = document.createEvent('KeyboardEvent');\n keyupEvent.initEvent('keyup', false, true);\n element.dispatchEvent(keyupEvent);\n }\n };\n TimePicker.prototype.clear = function (event) {\n this.setProperties({ value: null }, true);\n this.initValue = null;\n this.resetState();\n this.raiseClearedEvent(event);\n this.changeEvent(event);\n };\n TimePicker.prototype.setZIndex = function () {\n if (this.popupObj) {\n this.popupObj.zIndex = this.zIndex;\n this.popupObj.dataBind();\n }\n };\n TimePicker.prototype.checkAttributes = function (isDynamic) {\n var attributes = isDynamic ? isNullOrUndefined(this.htmlAttributes) ? [] : Object.keys(this.htmlAttributes) :\n ['step', 'disabled', 'readonly', 'style', 'name', 'value', 'min', 'max', 'placeholder'];\n var value;\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var prop = attributes_1[_i];\n if (!isNullOrUndefined(this.inputElement.getAttribute(prop))) {\n switch (prop) {\n case 'disabled':\n if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['enabled'] === undefined)) || isDynamic) {\n var enabled = this.inputElement.getAttribute(prop) === 'disabled' ||\n this.inputElement.getAttribute(prop) === '' || this.inputElement.getAttribute(prop) === 'true' ? false : true;\n this.setProperties({ enabled: enabled }, !isDynamic);\n }\n break;\n case 'style':\n this.inputStyle = this.inputElement.getAttribute(prop);\n break;\n case 'readonly':\n if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['readonly'] === undefined)) || isDynamic) {\n var readonly = this.inputElement.getAttribute(prop) === 'readonly' ||\n this.inputElement.getAttribute(prop) === '' || this.inputElement.getAttribute(prop) === 'true' ? true : false;\n this.setProperties({ readonly: readonly }, !isDynamic);\n }\n break;\n case 'name':\n this.inputElement.setAttribute('name', this.inputElement.getAttribute(prop));\n break;\n case 'step':\n this.step = parseInt(this.inputElement.getAttribute(prop), 10);\n break;\n case 'placeholder':\n if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['placeholder'] === undefined)) || isDynamic) {\n this.setProperties({ placeholder: this.inputElement.getAttribute(prop) }, !isDynamic);\n }\n break;\n case 'min':\n if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['min'] === undefined)) || isDynamic) {\n value = new Date(this.inputElement.getAttribute(prop));\n if (!isNullOrUndefined(this.checkDateValue(value))) {\n this.setProperties({ min: value }, !isDynamic);\n }\n }\n break;\n case 'max':\n if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['max'] === undefined)) || isDynamic) {\n value = new Date(this.inputElement.getAttribute(prop));\n if (!isNullOrUndefined(this.checkDateValue(value))) {\n this.setProperties({ max: value }, !isDynamic);\n }\n }\n break;\n case 'value':\n if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['value'] === undefined)) || isDynamic) {\n value = new Date(this.inputElement.getAttribute(prop));\n if (!isNullOrUndefined(this.checkDateValue(value))) {\n this.initValue = value;\n this.updateInput(false, this.initValue);\n this.setProperties({ value: value }, !isDynamic);\n }\n }\n break;\n }\n }\n }\n };\n TimePicker.prototype.setCurrentDate = function (value) {\n if (isNullOrUndefined(this.checkDateValue(value))) {\n return null;\n }\n return new Date(YEAR, MONTH, DAY, value.getHours(), value.getMinutes(), value.getSeconds());\n };\n TimePicker.prototype.getTextFormat = function () {\n var time = 0;\n if (this.cldrTimeFormat().split(' ')[0] === 'a' || this.cldrTimeFormat().indexOf('a') === 0) {\n time = 1;\n }\n else if (this.cldrTimeFormat().indexOf('a') < 0) {\n var strArray = this.cldrTimeFormat().split(' ');\n for (var i = 0; i < strArray.length; i++) {\n if (strArray[i].toLowerCase().indexOf('h') >= 0) {\n time = i;\n break;\n }\n }\n }\n return time;\n };\n TimePicker.prototype.updateValue = function (value, event) {\n var val;\n if (this.isNullOrEmpty(value)) {\n this.resetState();\n }\n else {\n val = this.checkValue(value);\n if (this.strictMode) {\n // this case set previous value to the text box when set invalid date\n var inputVal = (val === null && value.trim().length > 0) ?\n this.previousState(this.prevDate) : this.inputElement.value;\n this.updateInputValue(inputVal);\n if (this.enableMask) {\n if (!inputVal) {\n this.updateInputValue(this.maskedDateValue);\n }\n if (isNullOrUndefined(val) && value !== this.maskedDateValue) {\n this.createMask();\n }\n if (isNullOrUndefined(val) && value === this.maskedDateValue) {\n this.updateInputValue(this.maskedDateValue);\n }\n }\n }\n }\n this.checkValueChange(event, typeof value === 'string' ? false : true);\n };\n TimePicker.prototype.previousState = function (date) {\n var value = this.getDateObject(date);\n for (var i = 0; i < this.timeCollections.length; i++) {\n if (+value === this.timeCollections[i]) {\n this.activeIndex = i;\n this.selectedElement = this.liCollections[i];\n this.valueWithMinutes = new Date(this.timeCollections[i]);\n break;\n }\n }\n return this.getValue(date);\n };\n TimePicker.prototype.resetState = function () {\n this.removeSelection();\n Input.setValue('', this.inputElement, this.floatLabelType, false);\n this.valueWithMinutes = this.activeIndex = null;\n if (!this.strictMode) {\n this.checkErrorState(null);\n }\n };\n TimePicker.prototype.objToString = function (val) {\n if (isNullOrUndefined(this.checkDateValue(val))) {\n return null;\n }\n else {\n return this.globalize.formatDate(val, { format: this.cldrTimeFormat(), type: 'time' });\n }\n };\n TimePicker.prototype.checkValue = function (value) {\n if (!this.isNullOrEmpty(value)) {\n var date = value instanceof Date ? value : this.getDateObject(value);\n return this.validateValue(date, value);\n }\n this.resetState();\n return this.valueWithMinutes = null;\n };\n TimePicker.prototype.validateValue = function (date, value) {\n var time;\n var val = this.validateMinMax(value, this.min, this.max);\n var newval = this.getDateObject(val);\n if (this.getFormattedValue(newval) !== this.getFormattedValue(this.value)) {\n this.valueWithMinutes = isNullOrUndefined(newval) ? null : newval;\n time = this.objToString(this.valueWithMinutes);\n }\n else {\n if (this.strictMode) {\n //for strict mode case, when value not present within a range. Reset the nearest range value.\n date = newval;\n }\n this.valueWithMinutes = this.checkDateValue(date);\n time = this.objToString(this.valueWithMinutes);\n }\n if (!this.strictMode && isNullOrUndefined(time)) {\n var value_1 = val.trim().length > 0 ? val : '';\n this.updateInputValue(value_1);\n if (this.enableMask) {\n if (!value_1) {\n this.updateInputValue(this.maskedDateValue);\n }\n }\n }\n else {\n this.updateInputValue(time);\n if (this.enableMask) {\n if (time === '') {\n this.updateInputValue(this.maskedDateValue);\n }\n if (isNullOrUndefined(time) && value !== this.maskedDateValue) {\n this.createMask();\n }\n if (isNullOrUndefined(time) && value === this.maskedDateValue) {\n this.updateInputValue(this.maskedDateValue);\n }\n }\n }\n return time;\n };\n TimePicker.prototype.createMask = function () {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n };\n TimePicker.prototype.findNextElement = function (event) {\n var textVal = (this.inputElement).value;\n var value = isNullOrUndefined(this.valueWithMinutes) ? this.createDateObj(textVal) :\n this.getDateObject(this.valueWithMinutes);\n var timeVal = null;\n var count = this.liCollections.length;\n var collections = this.timeCollections;\n if (!isNullOrUndefined(this.checkDateValue(value)) || !isNullOrUndefined(this.activeIndex)) {\n if (event.action === 'home') {\n var index = this.validLiElement(0);\n timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));\n this.activeIndex = index;\n }\n else if (event.action === 'end') {\n var index = this.validLiElement(collections.length - 1, true);\n timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));\n this.activeIndex = index;\n }\n else {\n if (event.action === 'down') {\n for (var i = 0; i < count; i++) {\n if (+value < this.timeCollections[i]) {\n var index = this.validLiElement(i);\n timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));\n this.activeIndex = index;\n break;\n }\n else if (i === count - 1) {\n var index = this.validLiElement(0);\n timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));\n this.activeIndex = index;\n break;\n }\n }\n }\n else {\n for (var i = count - 1; i >= 0; i--) {\n if (+value > this.timeCollections[i]) {\n var index = this.validLiElement(i, true);\n timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));\n this.activeIndex = index;\n break;\n }\n else if (i === 0) {\n var index = this.validLiElement(count - 1);\n timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));\n this.activeIndex = index;\n break;\n }\n }\n }\n }\n this.selectedElement = this.liCollections[this.activeIndex];\n this.elementValue(isNullOrUndefined(timeVal) ? null : new Date(timeVal));\n }\n else {\n this.selectNextItem(event);\n }\n };\n TimePicker.prototype.selectNextItem = function (event) {\n var index = this.validLiElement(0, event.action === 'down' ? false : true);\n this.activeIndex = index;\n this.selectedElement = this.liCollections[index];\n this.elementValue(new Date(this.timeCollections[index]));\n };\n TimePicker.prototype.elementValue = function (value) {\n if (!isNullOrUndefined(this.checkDateValue(value))) {\n this.checkValue(value);\n }\n };\n TimePicker.prototype.validLiElement = function (index, backward) {\n var elementIndex = null;\n var items = isNullOrUndefined(this.popupWrapper) ? this.liCollections :\n this.popupWrapper.querySelectorAll('.' + LISTCLASS);\n var isCheck = true;\n if (items.length) {\n if (backward) {\n for (var i = index; i >= 0; i--) {\n if (!items[i].classList.contains(DISABLED)) {\n elementIndex = i;\n break;\n }\n else if (i === 0) {\n if (isCheck) {\n index = i = items.length;\n isCheck = false;\n }\n }\n }\n }\n else {\n for (var i = index; i <= items.length - 1; i++) {\n if (!items[i].classList.contains(DISABLED)) {\n elementIndex = i;\n break;\n }\n else if (i === items.length - 1) {\n if (isCheck) {\n index = i = -1;\n isCheck = false;\n }\n }\n }\n }\n }\n return elementIndex;\n };\n TimePicker.prototype.keyHandler = function (event) {\n if (isNullOrUndefined(this.step) || this.step <= 0 || !isNullOrUndefined(this.inputWrapper)\n && this.inputWrapper.buttons[0].classList.contains(DISABLED)) {\n return;\n }\n var count = this.timeCollections.length;\n if (isNullOrUndefined(this.getActiveElement()) || this.getActiveElement().length === 0) {\n if (this.liCollections.length > 0) {\n if (isNullOrUndefined(this.value) && isNullOrUndefined(this.activeIndex)) {\n var index = this.validLiElement(0, event.action === 'down' ? false : true);\n this.activeIndex = index;\n this.selectedElement = this.liCollections[index];\n this.elementValue(new Date(this.timeCollections[index]));\n }\n else {\n this.findNextElement(event);\n }\n }\n else {\n this.findNextElement(event);\n }\n }\n else {\n var nextItem = void 0;\n if ((event.keyCode >= 37) && (event.keyCode <= 40)) {\n var index = (event.keyCode === 40 || event.keyCode === 39) ? ++this.activeIndex : --this.activeIndex;\n this.activeIndex = index = this.activeIndex === (count) ? 0 : this.activeIndex;\n this.activeIndex = index = this.activeIndex < 0 ? (count - 1) : this.activeIndex;\n this.activeIndex = index = this.validLiElement(this.activeIndex, (event.keyCode === 40 || event.keyCode === 39) ?\n false : true);\n nextItem = isNullOrUndefined(this.timeCollections[index]) ?\n this.timeCollections[0] : this.timeCollections[index];\n }\n else if (event.action === 'home') {\n var index = this.validLiElement(0);\n this.activeIndex = index;\n nextItem = this.timeCollections[index];\n }\n else if (event.action === 'end') {\n var index = this.validLiElement(count - 1, true);\n this.activeIndex = index;\n nextItem = this.timeCollections[index];\n }\n this.selectedElement = this.liCollections[this.activeIndex];\n this.elementValue(new Date(nextItem));\n }\n this.isNavigate = true;\n this.setHover(this.selectedElement, NAVIGATION);\n this.setActiveDescendant();\n if (this.enableMask) {\n this.selectInputText();\n }\n if (this.isPopupOpen() && this.selectedElement !== null && (!event || event.type !== 'click')) {\n this.setScrollPosition();\n }\n };\n TimePicker.prototype.getCultureTimeObject = function (ld, c) {\n return getValue('main.' + c + '.dates.calendars.gregorian.timeFormats.short', ld);\n };\n TimePicker.prototype.getCultureDateObject = function (ld, c) {\n return getValue('main.' + c + '.dates.calendars.gregorian.dateFormats.short', ld);\n };\n TimePicker.prototype.wireListEvents = function () {\n EventHandler.add(this.listWrapper, 'click', this.onMouseClick, this);\n if (!Browser.isDevice) {\n EventHandler.add(this.listWrapper, 'mouseover', this.onMouseOver, this);\n EventHandler.add(this.listWrapper, 'mouseout', this.onMouseLeave, this);\n }\n };\n TimePicker.prototype.unWireListEvents = function () {\n if (this.listWrapper) {\n EventHandler.remove(this.listWrapper, 'click', this.onMouseClick);\n if (!Browser.isDevice) {\n EventHandler.remove(this.listWrapper, 'mouseover', this.onMouseOver);\n EventHandler.remove(this.listWrapper, 'mouseout', this.onMouseLeave);\n }\n }\n };\n TimePicker.prototype.valueProcess = function (event, value) {\n var result = (isNullOrUndefined(this.checkDateValue(value))) ? null : value;\n if (+this.prevDate !== +result) {\n this.initValue = result;\n this.changeEvent(event);\n }\n };\n TimePicker.prototype.changeEvent = function (e) {\n this.addSelection();\n this.updateInput(true, this.initValue);\n var eventArgs = {\n event: (e || null),\n value: this.value,\n text: (this.inputElement).value,\n isInteracted: !isNullOrUndefined(e),\n element: this.element\n };\n eventArgs.value = this.valueWithMinutes || this.getDateObject(this.inputElement.value);\n this.prevDate = this.valueWithMinutes || this.getDateObject(this.inputElement.value);\n if (this.isAngular && this.preventChange) {\n this.preventChange = false;\n }\n else {\n this.trigger('change', eventArgs);\n }\n this.invalidValueString = null;\n this.checkErrorState(this.value);\n };\n TimePicker.prototype.updateInput = function (isUpdate, date) {\n if (isUpdate) {\n this.prevValue = this.getValue(this.prevDate);\n }\n this.prevDate = this.valueWithMinutes = date;\n if ((typeof date !== 'number') || (this.value && +new Date(+this.value).setMilliseconds(0)) !== +date) {\n this.setProperties({ value: date }, true);\n if (this.enableMask && this.value) {\n this.createMask();\n }\n }\n if (!this.strictMode && isNullOrUndefined(this.value) && this.invalidValueString) {\n this.checkErrorState(this.invalidValueString);\n this.updateInputValue(this.invalidValueString);\n }\n this.clearIconState();\n };\n TimePicker.prototype.setActiveDescendant = function () {\n if (!isNullOrUndefined(this.selectedElement) && this.value) {\n attributes(this.inputElement, { 'aria-activedescendant': this.selectedElement.getAttribute('id') });\n }\n else {\n this.inputElement.removeAttribute('aria-activedescendant');\n }\n };\n TimePicker.prototype.removeSelection = function () {\n this.removeHover(HOVER);\n if (!isNullOrUndefined(this.popupWrapper)) {\n var items = this.popupWrapper.querySelectorAll('.' + SELECTED);\n if (items.length) {\n removeClass(items, SELECTED);\n items[0].removeAttribute('aria-selected');\n }\n }\n };\n TimePicker.prototype.removeHover = function (className) {\n var hoveredItem = this.getHoverItem(className);\n if (hoveredItem && hoveredItem.length) {\n removeClass(hoveredItem, className);\n if (className === NAVIGATION) {\n hoveredItem[0].removeAttribute('aria-selected');\n }\n }\n };\n TimePicker.prototype.getHoverItem = function (className) {\n var hoveredItem;\n if (!isNullOrUndefined(this.popupWrapper)) {\n hoveredItem = this.popupWrapper.querySelectorAll('.' + className);\n }\n return hoveredItem;\n };\n TimePicker.prototype.setActiveClass = function () {\n if (!isNullOrUndefined(this.popupWrapper)) {\n var items = this.popupWrapper.querySelectorAll('.' + LISTCLASS);\n if (items.length) {\n for (var i = 0; i < items.length; i++) {\n if ((this.timeCollections[i] === +this.getDateObject(this.valueWithMinutes))) {\n items[i].setAttribute('aria-selected', 'true');\n this.selectedElement = items[i];\n this.activeIndex = i;\n break;\n }\n }\n }\n }\n };\n TimePicker.prototype.addSelection = function () {\n this.selectedElement = null;\n this.removeSelection();\n this.setActiveClass();\n if (!isNullOrUndefined(this.selectedElement)) {\n addClass([this.selectedElement], SELECTED);\n this.selectedElement.setAttribute('aria-selected', 'true');\n }\n };\n TimePicker.prototype.isValidLI = function (li) {\n return (li && li.classList.contains(LISTCLASS) && !li.classList.contains(DISABLED));\n };\n TimePicker.prototype.createDateObj = function (val) {\n var formatStr = null;\n var today = this.globalize.formatDate(new Date(), { format: formatStr, skeleton: 'short', type: 'date' });\n var value = null;\n if (typeof val === 'string') {\n if (val.toUpperCase().indexOf('AM') > -1 || val.toUpperCase().indexOf('PM') > -1) {\n today = this.defaultCulture.formatDate(new Date(), { format: formatStr, skeleton: 'short', type: 'date' });\n value = isNaN(+new Date(today + ' ' + val)) ? null : new Date(new Date(today + ' ' + val).setMilliseconds(0));\n if (isNullOrUndefined(value)) {\n value = this.timeParse(today, val);\n }\n }\n else {\n value = this.timeParse(today, val);\n }\n }\n else if (val instanceof Date) {\n value = val;\n }\n return value;\n };\n TimePicker.prototype.timeParse = function (today, val) {\n var value;\n value = this.globalize.parseDate(today + ' ' + val, {\n format: this.cldrDateFormat() + ' ' + this.cldrTimeFormat(), type: 'datetime'\n });\n value = isNullOrUndefined(value) ? this.globalize.parseDate(today + ' ' + val, {\n format: this.cldrDateFormat() + ' ' + this.dateToNumeric(), type: 'datetime'\n }) : value;\n value = isNullOrUndefined(value) ? value : new Date(value.setMilliseconds(0));\n return value;\n };\n TimePicker.prototype.createListItems = function () {\n var _this = this;\n this.listWrapper = this.createElement('div', { className: CONTENT, attrs: { 'tabindex': '-1' } });\n var start;\n var interval = this.step * 60000;\n var listItems = [];\n this.timeCollections = [];\n this.disableItemCollection = [];\n start = +(this.getDateObject(this.initMin).setMilliseconds(0));\n var end = +(this.getDateObject(this.initMax).setMilliseconds(0));\n while (end >= start) {\n this.timeCollections.push(start);\n listItems.push(this.globalize.formatDate(new Date(start), { format: this.cldrTimeFormat(), type: 'time' }));\n start += interval;\n }\n var listBaseOptions = {\n itemCreated: function (args) {\n var eventArgs = {\n element: args.item,\n text: args.text, value: _this.getDateObject(args.text), isDisabled: false\n };\n _this.trigger('itemRender', eventArgs, function (eventArgs) {\n if (eventArgs.isDisabled) {\n eventArgs.element.classList.add(DISABLED);\n }\n if (eventArgs.element.classList.contains(DISABLED)) {\n _this.disableItemCollection.push(eventArgs.element.getAttribute('data-value'));\n }\n });\n }\n };\n this.listTag = ListBase.createList(this.createElement, listItems, listBaseOptions, true);\n attributes(this.listTag, { 'role': 'listbox', 'aria-hidden': 'false', 'id': this.element.id + '_options', 'tabindex': '0' });\n append([this.listTag], this.listWrapper);\n };\n TimePicker.prototype.documentClickHandler = function (event) {\n var target = event.target;\n if ((!isNullOrUndefined(this.popupObj) && !isNullOrUndefined(this.inputWrapper) && (this.inputWrapper.container.contains(target) && event.type !== 'mousedown' ||\n (this.popupObj.element && this.popupObj.element.contains(target)))) && event.type !== 'touchstart') {\n event.preventDefault();\n }\n if (!(closest(target, '[id=\"' + this.popupObj.element.id + '\"]')) && target !== this.inputElement\n && target !== (this.inputWrapper && this.inputWrapper.buttons[0]) &&\n target !== (this.inputWrapper && this.inputWrapper.clearButton) &&\n target !== (this.inputWrapper && this.inputWrapper.container)\n && (!target.classList.contains('e-dlg-overlay'))) {\n if (this.isPopupOpen()) {\n this.hide();\n this.focusOut();\n }\n }\n else if (target !== this.inputElement) {\n if (!Browser.isDevice) {\n this.isPreventBlur = (Browser.isIE || Browser.info.name === 'edge') && (document.activeElement === this.inputElement)\n && (target === this.popupWrapper);\n }\n }\n };\n TimePicker.prototype.setEnableRtl = function () {\n Input.setEnableRtl(this.enableRtl, [this.inputWrapper.container]);\n if (this.popupObj) {\n this.popupObj.enableRtl = this.enableRtl;\n this.popupObj.dataBind();\n }\n };\n TimePicker.prototype.setEnable = function () {\n Input.setEnabled(this.enabled, this.inputElement, this.floatLabelType);\n if (this.enabled) {\n removeClass([this.inputWrapper.container], DISABLED);\n attributes(this.inputElement, { 'aria-disabled': 'false' });\n this.inputElement.setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.hide();\n addClass([this.inputWrapper.container], DISABLED);\n attributes(this.inputElement, { 'aria-disabled': 'true' });\n this.inputElement.tabIndex = -1;\n }\n };\n TimePicker.prototype.getProperty = function (date, val) {\n if (val === 'min') {\n this.initMin = this.checkDateValue(new Date(this.checkInValue(date.min)));\n this.setProperties({ min: this.initMin }, true);\n }\n else {\n this.initMax = this.checkDateValue(new Date(this.checkInValue(date.max)));\n this.setProperties({ max: this.initMax }, true);\n }\n if (this.inputElement.value === '') {\n this.validateMinMax(this.value, this.min, this.max);\n }\n else {\n this.checkValue(this.inputElement.value);\n }\n this.checkValueChange(null, false);\n };\n TimePicker.prototype.inputBlurHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n // IE popup closing issue when click over the scrollbar\n if (this.isPreventBlur && this.isPopupOpen()) {\n this.inputElement.focus();\n return;\n }\n this.closePopup(0, e);\n if (this.enableMask && this.maskedDateValue && this.placeholder && this.floatLabelType !== 'Always') {\n if (this.inputElement.value === this.maskedDateValue && !this.value && (this.floatLabelType === 'Auto' || this.floatLabelType === 'Never' || this.placeholder)) {\n this.updateInputValue('');\n }\n }\n removeClass([this.inputWrapper.container], [FOCUS]);\n if (this.getText() !== this.inputElement.value) {\n this.updateValue((this.inputElement).value, e);\n }\n else if (this.inputElement.value.trim().length === 0) {\n this.resetState();\n }\n this.cursorDetails = null;\n this.isNavigate = false;\n if (this.inputElement.value === '') {\n this.invalidValueString = null;\n }\n var blurArguments = {\n model: this\n };\n this.trigger('blur', blurArguments);\n };\n /**\n * Focuses out the TimePicker textbox element.\n *\n * @returns {void}\n */\n TimePicker.prototype.focusOut = function () {\n if (document.activeElement === this.inputElement) {\n this.inputElement.blur();\n removeClass([this.inputWrapper.container], [FOCUS]);\n var blurArguments = {\n model: this\n };\n this.trigger('blur', blurArguments);\n }\n };\n TimePicker.prototype.isPopupOpen = function () {\n if (this.popupWrapper && this.popupWrapper.classList.contains('' + ROOT)) {\n return true;\n }\n return false;\n };\n TimePicker.prototype.inputFocusHandler = function () {\n if (!this.enabled) {\n return;\n }\n var focusArguments = {\n model: this\n };\n if (!this.readonly && !Browser.isDevice && !this.enableMask) {\n this.selectInputText();\n }\n if (this.enableMask && !this.inputElement.value && this.placeholder) {\n if (this.maskedDateValue && !this.value && (this.floatLabelType === 'Auto' || this.floatLabelType === 'Never' || this.placeholder)) {\n this.updateInputValue(this.maskedDateValue);\n this.inputElement.selectionStart = 0;\n this.inputElement.selectionEnd = this.inputElement.value.length;\n }\n }\n this.trigger('focus', focusArguments);\n this.clearIconState();\n if (this.openOnFocus) {\n this.show();\n }\n };\n /**\n * Focused the TimePicker textbox element.\n *\n * @returns {void}\n */\n TimePicker.prototype.focusIn = function () {\n if (document.activeElement !== this.inputElement && this.enabled) {\n this.inputElement.focus();\n }\n };\n /**\n * Hides the TimePicker popup.\n *\n * @returns {void}\n\n */\n TimePicker.prototype.hide = function () {\n this.closePopup(100, null);\n this.clearIconState();\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-param */\n /**\n * Opens the popup to show the list items.\n *\n * @returns {void}\n\n */\n TimePicker.prototype.show = function (event) {\n var _this = this;\n if ((this.enabled && this.readonly) || !this.enabled || this.popupWrapper) {\n return;\n }\n else {\n this.popupCreation();\n if (Browser.isDevice && this.listWrapper) {\n this.modal = this.createElement('div');\n this.modal.className = '' + ROOT + ' e-time-modal';\n document.body.className += ' ' + OVERFLOW;\n document.body.appendChild(this.modal);\n }\n if (Browser.isDevice) {\n this.mobileTimePopupWrap = this.createElement('div', { className: 'e-timepicker-mob-popup-wrap' });\n document.body.appendChild(this.mobileTimePopupWrap);\n }\n this.openPopupEventArgs = {\n popup: this.popupObj || null,\n cancel: false,\n event: event || null,\n name: 'open',\n appendTo: Browser.isDevice ? this.mobileTimePopupWrap : document.body\n };\n var eventArgs = this.openPopupEventArgs;\n this.trigger('open', eventArgs, function (eventArgs) {\n _this.openPopupEventArgs = eventArgs;\n if (!_this.openPopupEventArgs.cancel && !_this.inputWrapper.buttons[0].classList.contains(DISABLED)) {\n _this.openPopupEventArgs.appendTo.appendChild(_this.popupWrapper);\n _this.popupAlignment(_this.openPopupEventArgs);\n _this.setScrollPosition();\n if (!Browser.isDevice) {\n _this.inputElement.focus();\n }\n var openAnimation = {\n name: 'FadeIn',\n duration: ANIMATIONDURATION\n };\n _this.popupObj.refreshPosition(_this.anchor);\n if (_this.zIndex === 1000) {\n _this.popupObj.show(new Animation(openAnimation), _this.element);\n }\n else {\n _this.popupObj.show(new Animation(openAnimation), null);\n }\n _this.setActiveDescendant();\n attributes(_this.inputElement, { 'aria-expanded': 'true' });\n attributes(_this.inputElement, { 'aria-owns': _this.inputElement.id + '_options' });\n attributes(_this.inputElement, { 'aria-controls': _this.inputElement.id });\n addClass([_this.inputWrapper.container], FOCUS);\n EventHandler.add(document, 'mousedown touchstart', _this.documentClickHandler, _this);\n _this.setOverlayIndex(_this.mobileTimePopupWrap, _this.popupObj.element, _this.modal, Browser.isDevice);\n }\n else {\n _this.popupObj.destroy();\n _this.popupWrapper = _this.listTag = undefined;\n _this.liCollections = _this.timeCollections = _this.disableItemCollection = [];\n _this.popupObj = null;\n }\n });\n if (Browser.isDevice) {\n var dlgOverlay = this.createElement('div', { className: 'e-dlg-overlay' });\n dlgOverlay.style.zIndex = (this.zIndex - 1).toString();\n this.mobileTimePopupWrap.appendChild(dlgOverlay);\n }\n }\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-param */\n TimePicker.prototype.setOverlayIndex = function (popupWrapper, timePopupElement, modal, isDevice) {\n if (isDevice && !isNullOrUndefined(timePopupElement) && !isNullOrUndefined(modal) && !isNullOrUndefined(popupWrapper)) {\n var index = parseInt(timePopupElement.style.zIndex, 10) ? parseInt(timePopupElement.style.zIndex, 10) : 1000;\n modal.style.zIndex = (index - 1).toString();\n popupWrapper.style.zIndex = index.toString();\n }\n };\n TimePicker.prototype.formatValues = function (type) {\n var value;\n if (typeof type === 'number') {\n value = formatUnit(type);\n }\n else if (typeof type === 'string') {\n value = (type.match(/px|%|em/)) ? type : isNaN(parseInt(type, 10)) ? type : formatUnit(type);\n }\n return value;\n };\n TimePicker.prototype.popupAlignment = function (args) {\n args.popup.position.X = this.formatValues(args.popup.position.X);\n args.popup.position.Y = this.formatValues(args.popup.position.Y);\n if (!isNaN(parseFloat(args.popup.position.X)) || !isNaN(parseFloat(args.popup.position.Y))) {\n this.popupObj.relateTo = this.anchor = document.body;\n this.popupObj.targetType = 'container';\n }\n if (!isNaN(parseFloat(args.popup.position.X))) {\n this.popupObj.offsetX = parseFloat(args.popup.position.X);\n }\n if (!isNaN(parseFloat(args.popup.position.Y))) {\n this.popupObj.offsetY = parseFloat(args.popup.position.Y);\n }\n if (!Browser.isDevice) {\n switch (args.popup.position.X) {\n case 'left':\n break;\n case 'right':\n args.popup.offsetX = this.containerStyle.width;\n break;\n case 'center':\n args.popup.offsetX = -(this.containerStyle.width / 2);\n break;\n }\n switch (args.popup.position.Y) {\n case 'top':\n break;\n case 'bottom':\n break;\n case 'center':\n args.popup.offsetY = -(this.containerStyle.height / 2);\n break;\n }\n if (args.popup.position.X === 'center' && args.popup.position.Y === 'center') {\n this.popupObj.relateTo = this.inputWrapper.container;\n this.anchor = this.inputElement;\n this.popupObj.targetType = 'relative';\n }\n }\n else {\n if (args.popup.position.X === 'center' && args.popup.position.Y === 'center') {\n this.popupObj.relateTo = this.anchor = document.body;\n this.popupObj.offsetY = 0;\n this.popupObj.targetType = 'container';\n this.popupObj.collision = { X: 'fit', Y: 'fit' };\n }\n }\n };\n /* eslint-disable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * Gets the properties to be maintained upon browser refresh.\n *\n * @returns {string}\n */\n TimePicker.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /* eslint-enable valid-jsdoc, jsdoc/require-returns-description */\n /**\n * To get component name\n *\n * @returns {string} Returns the component name.\n * @private\n */\n TimePicker.prototype.getModuleName = function () {\n return 'timepicker';\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {TimePickerModel} newProp - Returns the dynamic property value of the component.\n * @param {TimePickerModel} oldProp - Returns the previous property value of the component.\n * @returns {void}\n * @private\n */\n TimePicker.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'placeholder':\n Input.setPlaceholder(newProp.placeholder, this.inputElement);\n break;\n case 'readonly':\n Input.setReadonly(this.readonly, this.inputElement, this.floatLabelType);\n if (this.readonly) {\n this.hide();\n }\n this.setTimeAllowEdit();\n break;\n case 'enabled':\n this.setProperties({ enabled: newProp.enabled }, true);\n this.setEnable();\n break;\n case 'allowEdit':\n this.setTimeAllowEdit();\n break;\n case 'enableRtl':\n this.setProperties({ enableRtl: newProp.enableRtl }, true);\n this.setEnableRtl();\n break;\n case 'cssClass':\n this.updateCssClass(newProp.cssClass, oldProp.cssClass);\n break;\n case 'zIndex':\n this.setProperties({ zIndex: newProp.zIndex }, true);\n this.setZIndex();\n break;\n case 'htmlAttributes':\n this.updateHtmlAttributeToElement();\n this.updateHtmlAttributeToWrapper();\n this.checkAttributes(true);\n break;\n case 'min':\n case 'max':\n this.getProperty(newProp, prop);\n break;\n case 'showClearButton':\n Input.setClearButton(this.showClearButton, this.inputElement, this.inputWrapper);\n this.bindClearEvent();\n break;\n case 'locale':\n this.setProperties({ locale: newProp.locale }, true);\n this.globalize = new Internationalization(this.locale);\n this.l10n.setLocale(this.locale);\n if (this.timeOptions && this.timeOptions.placeholder == null) {\n this.updatePlaceHolder();\n }\n this.setValue(this.value);\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n break;\n case 'width':\n setStyleAttribute(this.inputWrapper.container, { 'width': this.setWidth(newProp.width) });\n this.containerStyle = this.inputWrapper.container.getBoundingClientRect();\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n break;\n case 'format':\n this.setProperties({ format: newProp.format }, true);\n this.checkTimeFormat();\n this.setValue(this.value);\n if (this.enableMask) {\n this.createMask();\n if (!this.value) {\n this.updateInputValue(this.maskedDateValue);\n }\n }\n break;\n case 'value':\n this.invalidValueString = null;\n this.checkInvalidValue(newProp.value);\n newProp.value = this.value;\n if (!this.invalidValueString) {\n if (typeof newProp.value === 'string') {\n this.setProperties({ value: this.checkDateValue(new Date(newProp.value)) }, true);\n newProp.value = this.value;\n }\n else {\n if ((newProp.value && +new Date(+newProp.value).setMilliseconds(0)) !== +this.value) {\n newProp.value = this.checkDateValue(new Date('' + newProp.value));\n }\n }\n this.initValue = newProp.value;\n newProp.value = this.compareFormatChange(this.checkValue(newProp.value));\n }\n else {\n this.updateInputValue(this.invalidValueString);\n this.checkErrorState(this.invalidValueString);\n }\n if (this.enableMask && isNullOrUndefined(newProp.value)) {\n this.updateInputValue(this.maskedDateValue);\n this.checkErrorState(this.maskedDateValue);\n }\n this.checkValueChange(null, false);\n if (this.isPopupOpen()) {\n this.setScrollPosition();\n }\n if (this.isAngular && this.preventChange) {\n this.preventChange = false;\n }\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n break;\n case 'floatLabelType':\n this.floatLabelType = newProp.floatLabelType;\n Input.removeFloating(this.inputWrapper);\n Input.addFloating(this.inputElement, this.floatLabelType, this.placeholder);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-icon');\n }\n break;\n case 'strictMode':\n this.invalidValueString = null;\n if (newProp.strictMode) {\n this.checkErrorState(null);\n }\n this.setProperties({ strictMode: newProp.strictMode }, true);\n this.checkValue((this.inputElement).value);\n this.checkValueChange(null, false);\n break;\n case 'scrollTo':\n if (this.checkDateValue(new Date(this.checkInValue(newProp.scrollTo)))) {\n if (this.popupWrapper) {\n this.setScrollTo();\n }\n this.setProperties({ scrollTo: this.checkDateValue(new Date(this.checkInValue(newProp.scrollTo))) }, true);\n }\n else {\n this.setProperties({ scrollTo: null }, true);\n }\n break;\n case 'enableMask':\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n this.updateInputValue(this.maskedDateValue);\n }\n else {\n if (this.inputElement.value === this.maskedDateValue) {\n this.updateInputValue('');\n }\n }\n break;\n }\n }\n };\n TimePicker.prototype.checkInValue = function (inValue) {\n if (inValue instanceof Date) {\n return (inValue.toUTCString());\n }\n else {\n return ('' + inValue);\n }\n };\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"cssClass\", void 0);\n __decorate([\n Property(false)\n ], TimePicker.prototype, \"strictMode\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"keyConfigs\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"format\", void 0);\n __decorate([\n Property(true)\n ], TimePicker.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], TimePicker.prototype, \"fullScreenMode\", void 0);\n __decorate([\n Property(false)\n ], TimePicker.prototype, \"readonly\", void 0);\n __decorate([\n Property({})\n ], TimePicker.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property('Never')\n ], TimePicker.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"placeholder\", void 0);\n __decorate([\n Property(1000)\n ], TimePicker.prototype, \"zIndex\", void 0);\n __decorate([\n Property(false)\n ], TimePicker.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(true)\n ], TimePicker.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(30)\n ], TimePicker.prototype, \"step\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"scrollTo\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"min\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"max\", void 0);\n __decorate([\n Property(true)\n ], TimePicker.prototype, \"allowEdit\", void 0);\n __decorate([\n Property(false)\n ], TimePicker.prototype, \"openOnFocus\", void 0);\n __decorate([\n Property(false)\n ], TimePicker.prototype, \"enableMask\", void 0);\n __decorate([\n Property({ day: 'day', month: 'month', year: 'year', hour: 'hour', minute: 'minute', second: 'second', dayOfTheWeek: 'day of the week' })\n ], TimePicker.prototype, \"maskPlaceholder\", void 0);\n __decorate([\n Property(null)\n ], TimePicker.prototype, \"serverTimezoneOffset\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"itemRender\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"cleared\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"blur\", void 0);\n __decorate([\n Event()\n ], TimePicker.prototype, \"focus\", void 0);\n TimePicker = __decorate([\n NotifyPropertyChanges\n ], TimePicker);\n return TimePicker;\n}(Component));\nexport { TimePicker };\n/* eslint-enable @typescript-eslint/no-explicit-any */\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nvar __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\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;\n return c > 3 && r && Object.defineProperty(target, key, r), r;\n};\n// eslint-disable-next-line @typescript-eslint/triple-slash-reference\n///\nimport { EventHandler, Internationalization, Property, NotifyPropertyChanges, Browser } from '@syncfusion/ej2-base';\nimport { Animation, Event, cldrData, getDefaultDateObject, detach } from '@syncfusion/ej2-base';\nimport { createElement, remove, addClass, L10n, removeClass, closest, append, attributes } from '@syncfusion/ej2-base';\nimport { KeyboardEvents, isNullOrUndefined, formatUnit, getValue, rippleEffect } from '@syncfusion/ej2-base';\nimport { extend } from '@syncfusion/ej2-base';\nimport { Popup } from '@syncfusion/ej2-popups';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { DatePicker } from '../datepicker/datepicker';\nimport { TimePickerBase } from '../timepicker/timepicker';\n//class constant defination\nvar DATEWRAPPER = 'e-date-wrapper';\nvar DATEPICKERROOT = 'e-datepicker';\nvar DATETIMEWRAPPER = 'e-datetime-wrapper';\nvar DAY = new Date().getDate();\nvar MONTH = new Date().getMonth();\nvar YEAR = new Date().getFullYear();\nvar HOUR = new Date().getHours();\nvar MINUTE = new Date().getMinutes();\nvar SECOND = new Date().getSeconds();\nvar MILLISECOND = new Date().getMilliseconds();\nvar ROOT = 'e-datetimepicker';\nvar DATETIMEPOPUPWRAPPER = 'e-datetimepopup-wrapper';\nvar INPUTWRAPPER = 'e-input-group-icon';\nvar POPUP = 'e-popup';\nvar TIMEICON = 'e-time-icon';\nvar INPUTFOCUS = 'e-input-focus';\nvar POPUPDIMENSION = '250px';\nvar ICONANIMATION = 'e-icon-anim';\nvar DISABLED = 'e-disabled';\nvar ERROR = 'e-error';\nvar CONTENT = 'e-content';\nvar NAVIGATION = 'e-navigation';\nvar ACTIVE = 'e-active';\nvar HOVER = 'e-hover';\nvar ICONS = 'e-icons';\nvar HALFPOSITION = 2;\nvar LISTCLASS = 'e-list-item';\nvar ANIMATIONDURATION = 100;\nvar OVERFLOW = 'e-time-overflow';\n/**\n * Represents the DateTimePicker component that allows user to select\n * or enter a date time value.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar DateTimePicker = /** @class */ (function (_super) {\n __extends(DateTimePicker, _super);\n /**\n * Constructor for creating the widget\n *\n * @param {DateTimePickerModel} options - Specifies the DateTimePicker model.\n * @param {string | HTMLInputElement} element - Specifies the element to render as component.\n * @private\n */\n function DateTimePicker(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.valueWithMinutes = null;\n _this.scrollInvoked = false;\n _this.moduleName = _this.getModuleName();\n _this.formatRegex = /dddd|ddd|dd|d|MMMM|MMM|MM|M|yyyy|yyy|yy|y|'[^']*'|'[^']*'/g;\n _this.dateFormatString = '';\n _this.dateTimeOptions = options;\n return _this;\n }\n DateTimePicker.prototype.focusHandler = function () {\n if (!this.enabled) {\n return;\n }\n addClass([this.inputWrapper.container], INPUTFOCUS);\n };\n /**\n * Sets the focus to widget for interaction.\n *\n * @returns {void}\n */\n DateTimePicker.prototype.focusIn = function () {\n _super.prototype.focusIn.call(this);\n };\n /**\n * Remove the focus from widget, if the widget is in focus state.\n *\n * @returns {void}\n */\n DateTimePicker.prototype.focusOut = function () {\n if (document.activeElement === this.inputElement) {\n this.inputElement.blur();\n removeClass([this.inputWrapper.container], [INPUTFOCUS]);\n }\n };\n DateTimePicker.prototype.blurHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n // IE popup closing issue when click over the scrollbar\n if (this.isTimePopupOpen() && this.isPreventBlur) {\n this.inputElement.focus();\n return;\n }\n removeClass([this.inputWrapper.container], INPUTFOCUS);\n var blurArguments = {\n model: this\n };\n if (this.isTimePopupOpen()) {\n this.hide(e);\n }\n this.trigger('blur', blurArguments);\n };\n /**\n * To destroy the widget.\n *\n * @returns {void}\n */\n DateTimePicker.prototype.destroy = function () {\n if (this.showClearButton) {\n this.clearButton = document.getElementsByClassName('e-clear-icon')[0];\n }\n if (this.popupObject && this.popupObject.element.classList.contains(POPUP)) {\n this.popupObject.destroy();\n detach(this.dateTimeWrapper);\n this.dateTimeWrapper = undefined;\n this.liCollections = this.timeCollections = [];\n if (!isNullOrUndefined(this.rippleFn)) {\n this.rippleFn();\n }\n }\n var ariaAttribute = {\n 'aria-live': 'assertive', 'aria-atomic': 'true', 'aria-invalid': 'false',\n 'autocorrect': 'off', 'autocapitalize': 'off', 'spellcheck': 'false',\n 'aria-expanded': 'false', 'role': 'combobox', 'autocomplete': 'off'\n };\n if (this.inputElement) {\n Input.removeAttributes(ariaAttribute, this.inputElement);\n }\n if (this.isCalendar()) {\n if (this.popupWrapper) {\n detach(this.popupWrapper);\n }\n this.popupObject = this.popupWrapper = null;\n this.keyboardHandler.destroy();\n }\n this.unBindInputEvents();\n this.liCollections = null;\n this.rippleFn = null;\n this.selectedElement = null;\n this.listTag = null;\n this.timeIcon = null;\n this.popupObject = null;\n this.preventArgs = null;\n this.keyboardModule = null;\n Input.destroy({\n element: this.inputElement,\n floatLabelType: this.floatLabelType,\n properties: this.properties\n }, this.clearButton);\n _super.prototype.destroy.call(this);\n };\n /**\n * To Initialize the control rendering.\n *\n * @returns {void}\n * @private\n */\n DateTimePicker.prototype.render = function () {\n this.timekeyConfigure = {\n enter: 'enter',\n escape: 'escape',\n end: 'end',\n tab: 'tab',\n home: 'home',\n down: 'downarrow',\n up: 'uparrow',\n left: 'leftarrow',\n right: 'rightarrow',\n open: 'alt+downarrow',\n close: 'alt+uparrow'\n };\n this.valueWithMinutes = null;\n this.previousDateTime = null;\n this.isPreventBlur = false;\n this.cloneElement = this.element.cloneNode(true);\n this.dateTimeFormat = this.cldrDateTimeFormat();\n this.initValue = this.value;\n if (typeof (this.min) === 'string') {\n this.min = this.checkDateValue(new Date(this.min));\n }\n if (typeof (this.max) === 'string') {\n this.max = this.checkDateValue(new Date(this.max));\n }\n if (!isNullOrUndefined(closest(this.element, 'fieldset')) && closest(this.element, 'fieldset').disabled) {\n this.enabled = false;\n }\n _super.prototype.updateHtmlAttributeToElement.call(this);\n this.checkAttributes(false);\n var localeText = { placeholder: this.placeholder };\n this.l10n = new L10n('datetimepicker', localeText, this.locale);\n this.setProperties({ placeholder: this.placeholder || this.l10n.getConstant('placeholder') }, true);\n _super.prototype.render.call(this);\n this.createInputElement();\n _super.prototype.updateHtmlAttributeToWrapper.call(this);\n this.bindInputEvents();\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n this.setValue(true);\n if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType === 'Always' || !this.floatLabelType || !this.placeholder)) {\n Input.setValue(this.maskedDateValue, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n this.setProperties({ scrollTo: this.checkDateValue(new Date(this.checkValue(this.scrollTo))) }, true);\n this.previousDateTime = this.value && new Date(+this.value);\n if (this.element.tagName === 'EJS-DATETIMEPICKER') {\n this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';\n this.element.removeAttribute('tabindex');\n if (!this.enabled) {\n this.inputElement.tabIndex = -1;\n }\n }\n if (this.floatLabelType !== 'Never') {\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n }\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-date-time-icon');\n }\n this.renderComplete();\n };\n DateTimePicker.prototype.setValue = function (isDynamic) {\n if (isDynamic === void 0) { isDynamic = false; }\n this.initValue = this.validateMinMaxRange(this.value);\n if (!this.strictMode && this.isDateObject(this.initValue)) {\n var value = this.validateMinMaxRange(this.initValue);\n Input.setValue(this.getFormattedValue(value), this.inputElement, this.floatLabelType, this.showClearButton);\n this.setProperties({ value: value }, true);\n }\n else {\n if (isNullOrUndefined(this.value)) {\n this.initValue = null;\n this.setProperties({ value: null }, true);\n }\n }\n this.valueWithMinutes = this.value;\n _super.prototype.updateInput.call(this, isDynamic);\n };\n DateTimePicker.prototype.validateMinMaxRange = function (value) {\n var result = value;\n if (this.isDateObject(value)) {\n result = this.validateValue(value);\n }\n else {\n if (+this.min > +this.max) {\n this.disablePopupButton(true);\n }\n }\n this.checkValidState(result);\n return result;\n };\n DateTimePicker.prototype.checkValidState = function (value) {\n this.isValidState = true;\n if (!this.strictMode) {\n if ((+(value) > +(this.max)) || (+(value) < +(this.min))) {\n this.isValidState = false;\n }\n }\n this.checkErrorState();\n };\n DateTimePicker.prototype.checkErrorState = function () {\n if (this.isValidState) {\n removeClass([this.inputWrapper.container], ERROR);\n }\n else {\n addClass([this.inputWrapper.container], ERROR);\n }\n attributes(this.inputElement, { 'aria-invalid': this.isValidState ? 'false' : 'true' });\n };\n DateTimePicker.prototype.validateValue = function (value) {\n var dateVal = value;\n if (this.strictMode) {\n if (+this.min > +this.max) {\n this.disablePopupButton(true);\n dateVal = this.max;\n }\n else if (+value < +this.min) {\n dateVal = this.min;\n }\n else if (+value > +this.max) {\n dateVal = this.max;\n }\n }\n else {\n if (+this.min > +this.max) {\n this.disablePopupButton(true);\n dateVal = value;\n }\n }\n return dateVal;\n };\n DateTimePicker.prototype.disablePopupButton = function (isDisable) {\n if (isDisable) {\n addClass([this.inputWrapper.buttons[0], this.timeIcon], DISABLED);\n this.hide();\n }\n else {\n removeClass([this.inputWrapper.buttons[0], this.timeIcon], DISABLED);\n }\n };\n DateTimePicker.prototype.getFormattedValue = function (value) {\n var dateOptions;\n if (!isNullOrUndefined(value)) {\n if (this.calendarMode === 'Gregorian') {\n dateOptions = { format: this.cldrDateTimeFormat(), type: 'dateTime', skeleton: 'yMd' };\n }\n else {\n dateOptions = { format: this.cldrDateTimeFormat(), type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };\n }\n return this.globalize.formatDate(value, dateOptions);\n }\n else {\n return null;\n }\n };\n DateTimePicker.prototype.isDateObject = function (value) {\n return (!isNullOrUndefined(value) && !isNaN(+value)) ? true : false;\n };\n DateTimePicker.prototype.createInputElement = function () {\n removeClass([this.inputElement], DATEPICKERROOT);\n removeClass([this.inputWrapper.container], DATEWRAPPER);\n addClass([this.inputWrapper.container], DATETIMEWRAPPER);\n addClass([this.inputElement], ROOT);\n this.renderTimeIcon();\n };\n DateTimePicker.prototype.renderTimeIcon = function () {\n this.timeIcon = Input.appendSpan(INPUTWRAPPER + ' ' + TIMEICON + ' ' + ICONS, this.inputWrapper.container);\n };\n DateTimePicker.prototype.bindInputEvents = function () {\n EventHandler.add(this.timeIcon, 'mousedown', this.timeHandler, this);\n EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', this.dateHandler, this);\n EventHandler.add(this.inputElement, 'blur', this.blurHandler, this);\n EventHandler.add(this.inputElement, 'focus', this.focusHandler, this);\n this.defaultKeyConfigs = extend(this.defaultKeyConfigs, this.keyConfigs);\n this.keyboardHandler = new KeyboardEvents(this.inputElement, {\n eventName: 'keydown',\n keyAction: this.inputKeyAction.bind(this),\n keyConfigs: this.defaultKeyConfigs\n });\n };\n DateTimePicker.prototype.unBindInputEvents = function () {\n EventHandler.remove(this.timeIcon, 'mousedown touchstart', this.timeHandler);\n EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown touchstart', this.dateHandler);\n if (this.inputElement) {\n EventHandler.remove(this.inputElement, 'blur', this.blurHandler);\n EventHandler.remove(this.inputElement, 'focus', this.focusHandler);\n }\n if (this.keyboardHandler) {\n this.keyboardHandler.destroy();\n }\n };\n DateTimePicker.prototype.cldrTimeFormat = function () {\n var cldrTime;\n if (this.isNullOrEmpty(this.timeFormat)) {\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrTime = (getValue('timeFormats.short', getDefaultDateObject()));\n }\n else {\n cldrTime = (this.getCultureTimeObject(cldrData, '' + this.locale));\n }\n }\n else {\n cldrTime = this.timeFormat;\n }\n return cldrTime;\n };\n DateTimePicker.prototype.cldrDateTimeFormat = function () {\n var cldrTime;\n var culture = new Internationalization(this.locale);\n var dateFormat = culture.getDatePattern({ skeleton: 'yMd' });\n if (this.isNullOrEmpty(this.formatString)) {\n cldrTime = dateFormat + ' ' + this.getCldrFormat('time');\n }\n else {\n cldrTime = this.formatString;\n }\n return cldrTime;\n };\n DateTimePicker.prototype.getCldrFormat = function (type) {\n var cldrDateTime;\n if (this.locale === 'en' || this.locale === 'en-US') {\n cldrDateTime = (getValue('timeFormats.short', getDefaultDateObject()));\n }\n else {\n cldrDateTime = (this.getCultureTimeObject(cldrData, '' + this.locale));\n }\n return cldrDateTime;\n };\n DateTimePicker.prototype.isNullOrEmpty = function (value) {\n if (isNullOrUndefined(value) || (typeof value === 'string' && value.trim() === '')) {\n return true;\n }\n else {\n return false;\n }\n };\n DateTimePicker.prototype.getCultureTimeObject = function (ld, c) {\n if (this.calendarMode === 'Gregorian') {\n return getValue('main.' + '' + this.locale + '.dates.calendars.gregorian.timeFormats.short', ld);\n }\n else {\n return getValue('main.' + '' + this.locale + '.dates.calendars.islamic.timeFormats.short', ld);\n }\n };\n DateTimePicker.prototype.timeHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n this.isIconClicked = true;\n if (Browser.isDevice) {\n this.inputElement.setAttribute('readonly', '');\n }\n if (e.currentTarget === this.timeIcon) {\n e.preventDefault();\n }\n if (this.enabled && !this.readonly) {\n if (this.isDatePopupOpen()) {\n _super.prototype.hide.call(this, e);\n }\n if (this.isTimePopupOpen()) {\n this.closePopup(e);\n }\n else {\n this.inputElement.focus();\n this.popupCreation('time', e);\n addClass([this.inputWrapper.container], [INPUTFOCUS]);\n }\n }\n this.isIconClicked = false;\n };\n DateTimePicker.prototype.dateHandler = function (e) {\n if (!this.enabled) {\n return;\n }\n if (e.currentTarget === this.inputWrapper.buttons[0]) {\n e.preventDefault();\n }\n if (this.enabled && !this.readonly) {\n if (this.isTimePopupOpen()) {\n this.closePopup(e);\n }\n if (!isNullOrUndefined(this.popupWrapper)) {\n this.popupCreation('date', e);\n }\n }\n };\n DateTimePicker.prototype.show = function (type, e) {\n if ((this.enabled && this.readonly) || !this.enabled) {\n return;\n }\n else {\n if (type === 'time' && !this.dateTimeWrapper) {\n if (this.isDatePopupOpen()) {\n this.hide(e);\n }\n this.popupCreation('time', e);\n }\n else if (!this.popupObj) {\n if (this.isTimePopupOpen()) {\n this.hide(e);\n }\n _super.prototype.show.call(this);\n this.popupCreation('date', e);\n }\n }\n };\n DateTimePicker.prototype.toggle = function (e) {\n if (this.isDatePopupOpen()) {\n _super.prototype.hide.call(this, e);\n this.show('time', null);\n }\n else if (this.isTimePopupOpen()) {\n this.hide(e);\n _super.prototype.show.call(this, null, e);\n this.popupCreation('date', null);\n }\n else {\n this.show(null, e);\n }\n };\n DateTimePicker.prototype.listCreation = function () {\n var dateObject;\n if (this.calendarMode === 'Gregorian') {\n this.cldrDateTimeFormat().replace(this.formatRegex, this.TimePopupFormat());\n if (this.dateFormatString === '') {\n this.dateFormatString = this.cldrDateTimeFormat();\n }\n dateObject = this.globalize.parseDate(this.inputElement.value, {\n format: this.dateFormatString, type: 'datetime'\n });\n }\n else {\n dateObject = this.globalize.parseDate(this.inputElement.value, {\n format: this.cldrDateTimeFormat(), type: 'datetime', calendar: 'islamic'\n });\n }\n var value = isNullOrUndefined(this.value) ? this.inputElement.value !== '' ?\n dateObject : new Date() : this.value;\n this.valueWithMinutes = value;\n this.listWrapper = createElement('div', { className: CONTENT, attrs: { 'tabindex': '0' } });\n var min = this.startTime(value);\n var max = this.endTime(value);\n var listDetails = TimePickerBase.createListItems(this.createElement, min, max, this.globalize, this.cldrTimeFormat(), this.step);\n this.timeCollections = listDetails.collection;\n this.listTag = listDetails.list;\n attributes(this.listTag, { 'role': 'listbox', 'aria-hidden': 'false', 'id': this.element.id + '_options' });\n append([listDetails.list], this.listWrapper);\n this.wireTimeListEvents();\n var rippleModel = { duration: 300, selector: '.' + LISTCLASS };\n this.rippleFn = rippleEffect(this.listWrapper, rippleModel);\n this.liCollections = this.listWrapper.querySelectorAll('.' + LISTCLASS);\n };\n DateTimePicker.prototype.popupCreation = function (type, e) {\n if (Browser.isDevice) {\n this.element.setAttribute('readonly', 'readonly');\n }\n if (type === 'date') {\n if (!this.readonly && this.popupWrapper) {\n addClass([this.popupWrapper], DATETIMEPOPUPWRAPPER);\n attributes(this.popupWrapper, { 'id': this.element.id + '_options' });\n }\n }\n else {\n if (!this.readonly) {\n this.dateTimeWrapper = createElement('div', {\n className: ROOT + ' ' + POPUP,\n attrs: { 'id': this.element.id + '_timepopup', 'style': 'visibility:hidden ; display:block' }\n });\n if (!isNullOrUndefined(this.cssClass)) {\n this.dateTimeWrapper.className += ' ' + this.cssClass;\n }\n if (!isNullOrUndefined(this.step) && this.step > 0) {\n this.listCreation();\n append([this.listWrapper], this.dateTimeWrapper);\n }\n document.body.appendChild(this.dateTimeWrapper);\n this.addTimeSelection();\n this.renderPopup();\n this.setTimeScrollPosition();\n this.openPopup(e);\n if (!Browser.isDevice || (Browser.isDevice && !this.fullScreenMode)) {\n this.popupObject.refreshPosition(this.inputElement);\n }\n if (Browser.isDevice && this.fullScreenMode) {\n this.dateTimeWrapper.style.left = '0px';\n }\n if (Browser.isDevice) {\n var dlgOverlay = this.createElement('div', { className: 'e-dlg-overlay' });\n dlgOverlay.style.zIndex = (this.zIndex - 1).toString();\n this.timeModal.appendChild(dlgOverlay);\n }\n }\n }\n };\n DateTimePicker.prototype.openPopup = function (e) {\n var _this = this;\n this.preventArgs = {\n cancel: false,\n popup: this.popupObject,\n event: e || null\n };\n var eventArgs = this.preventArgs;\n this.trigger('open', eventArgs, function (eventArgs) {\n _this.preventArgs = eventArgs;\n if (!_this.preventArgs.cancel && !_this.readonly) {\n var openAnimation = {\n name: 'FadeIn',\n duration: ANIMATIONDURATION,\n };\n if (_this.zIndex === 1000) {\n _this.popupObject.show(new Animation(openAnimation), _this.element);\n }\n else {\n _this.popupObject.show(new Animation(openAnimation), null);\n }\n addClass([_this.inputWrapper.container], [ICONANIMATION]);\n attributes(_this.inputElement, { 'aria-expanded': 'true' });\n attributes(_this.inputElement, { 'aria-owns': _this.inputElement.id + '_options' });\n attributes(_this.inputElement, { 'aria-controls': _this.inputElement.id });\n EventHandler.add(document, 'mousedown touchstart', _this.documentClickHandler, _this);\n }\n });\n };\n DateTimePicker.prototype.documentClickHandler = function (event) {\n var target = event.target;\n if ((!isNullOrUndefined(this.popupObject) && (this.inputWrapper.container.contains(target) && event.type !== 'mousedown' ||\n (this.popupObject.element && this.popupObject.element.contains(target)))) && event.type !== 'touchstart') {\n event.preventDefault();\n }\n if (!(closest(target, '[id=\"' + (this.popupObject && this.popupObject.element.id + '\"]'))) && target !== this.inputElement\n && target !== this.timeIcon && !isNullOrUndefined(this.inputWrapper) && target !== this.inputWrapper.container && !target.classList.contains('e-dlg-overlay')) {\n if (this.isTimePopupOpen()) {\n this.hide(event);\n this.focusOut();\n }\n }\n else if (target !== this.inputElement) {\n if (!Browser.isDevice) {\n this.isPreventBlur = ((document.activeElement === this.inputElement) && (Browser.isIE || Browser.info.name === 'edge')\n && target === this.popupObject.element);\n }\n }\n };\n DateTimePicker.prototype.isTimePopupOpen = function () {\n return (this.dateTimeWrapper && this.dateTimeWrapper.classList.contains('' + ROOT)) ? true : false;\n };\n DateTimePicker.prototype.isDatePopupOpen = function () {\n return (this.popupWrapper && this.popupWrapper.classList.contains('' + DATETIMEPOPUPWRAPPER)) ? true : false;\n };\n DateTimePicker.prototype.renderPopup = function () {\n var _this = this;\n this.containerStyle = this.inputWrapper.container.getBoundingClientRect();\n if (Browser.isDevice) {\n this.timeModal = createElement('div');\n this.timeModal.className = '' + ROOT + ' e-time-modal';\n document.body.className += ' ' + OVERFLOW;\n this.timeModal.style.display = 'block';\n document.body.appendChild(this.timeModal);\n }\n var offset = 4;\n this.popupObject = new Popup(this.dateTimeWrapper, {\n width: this.setPopupWidth(),\n zIndex: this.zIndex,\n targetType: 'container',\n collision: Browser.isDevice ? { X: 'fit', Y: 'fit' } : { X: 'flip', Y: 'flip' },\n relateTo: Browser.isDevice ? document.body : this.inputWrapper.container,\n position: Browser.isDevice ? { X: 'center', Y: 'center' } : { X: 'left', Y: 'bottom' },\n enableRtl: this.enableRtl,\n offsetY: offset,\n open: function () {\n _this.dateTimeWrapper.style.visibility = 'visible';\n addClass([_this.timeIcon], ACTIVE);\n if (!Browser.isDevice) {\n _this.timekeyConfigure = extend(_this.timekeyConfigure, _this.keyConfigs);\n _this.inputEvent = new KeyboardEvents(_this.inputWrapper.container, {\n keyAction: _this.timeKeyActionHandle.bind(_this),\n keyConfigs: _this.timekeyConfigure,\n eventName: 'keydown'\n });\n }\n }, close: function () {\n removeClass([_this.timeIcon], ACTIVE);\n _this.unWireTimeListEvents();\n _this.inputElement.removeAttribute('aria-activedescendant');\n remove(_this.popupObject.element);\n _this.popupObject.destroy();\n _this.dateTimeWrapper.innerHTML = '';\n _this.listWrapper = _this.dateTimeWrapper = undefined;\n if (_this.inputEvent) {\n _this.inputEvent.destroy();\n }\n }, targetExitViewport: function () {\n if (!Browser.isDevice) {\n _this.hide();\n }\n }\n });\n if (Browser.isDevice && this.fullScreenMode) {\n this.popupObject.element.style.display = \"flex\";\n this.popupObject.element.style.maxHeight = \"100%\";\n this.popupObject.element.style.width = \"100%\";\n }\n else {\n this.popupObject.element.style.maxHeight = POPUPDIMENSION;\n }\n if (Browser.isDevice && this.fullScreenMode) {\n var modelWrapper = createElement('div', { className: 'e-datetime-mob-popup-wrap' });\n var modelHeader = this.createElement('div', { className: 'e-model-header' });\n var modelTitleSpan = this.createElement(\"span\", { className: \"e-model-title\" });\n modelTitleSpan.textContent = \"Select time\";\n var modelCloseIcon = this.createElement(\"span\", { className: \"e-popup-close\" });\n EventHandler.add(modelCloseIcon, 'mousedown touchstart', this.dateTimeCloseHandler, this);\n var timeContent = this.dateTimeWrapper.querySelector(\".e-content\");\n modelHeader.appendChild(modelCloseIcon);\n modelHeader.appendChild(modelTitleSpan);\n modelWrapper.appendChild(modelHeader);\n modelWrapper.appendChild(timeContent);\n this.dateTimeWrapper.insertBefore(modelWrapper, this.dateTimeWrapper.firstElementChild);\n }\n };\n DateTimePicker.prototype.dateTimeCloseHandler = function (e) {\n this.hide();\n };\n DateTimePicker.prototype.setDimension = function (width) {\n if (typeof width === 'number') {\n width = formatUnit(width);\n }\n else if (typeof width === 'string') {\n // eslint-disable-next-line no-self-assign\n width = width;\n }\n else {\n width = '100%';\n }\n return width;\n };\n DateTimePicker.prototype.setPopupWidth = function () {\n var width = this.setDimension(this.width);\n if (width.indexOf('%') > -1) {\n var inputWidth = this.containerStyle.width * parseFloat(width) / 100;\n width = inputWidth.toString() + 'px';\n }\n return width;\n };\n DateTimePicker.prototype.wireTimeListEvents = function () {\n EventHandler.add(this.listWrapper, 'click', this.onMouseClick, this);\n if (!Browser.isDevice) {\n EventHandler.add(this.listWrapper, 'mouseover', this.onMouseOver, this);\n EventHandler.add(this.listWrapper, 'mouseout', this.onMouseLeave, this);\n }\n };\n DateTimePicker.prototype.unWireTimeListEvents = function () {\n if (this.listWrapper) {\n EventHandler.remove(this.listWrapper, 'click', this.onMouseClick);\n EventHandler.remove(document, 'mousedown touchstart', this.documentClickHandler);\n if (!Browser.isDevice) {\n EventHandler.add(this.listWrapper, 'mouseover', this.onMouseOver, this);\n EventHandler.add(this.listWrapper, 'mouseout', this.onMouseLeave, this);\n }\n }\n };\n DateTimePicker.prototype.onMouseOver = function (event) {\n var currentLi = closest(event.target, '.' + LISTCLASS);\n this.setTimeHover(currentLi, HOVER);\n };\n DateTimePicker.prototype.onMouseLeave = function () {\n this.removeTimeHover(HOVER);\n };\n DateTimePicker.prototype.setTimeHover = function (li, className) {\n if (this.enabled && this.isValidLI(li) && !li.classList.contains(className)) {\n this.removeTimeHover(className);\n addClass([li], className);\n }\n };\n DateTimePicker.prototype.getPopupHeight = function () {\n var height = parseInt(POPUPDIMENSION, 10);\n var popupHeight = this.dateTimeWrapper.getBoundingClientRect().height;\n if (Browser.isDevice && this.fullScreenMode) {\n return popupHeight;\n }\n else {\n return popupHeight > height ? height : popupHeight;\n }\n };\n DateTimePicker.prototype.changeEvent = function (e) {\n _super.prototype.changeEvent.call(this, e);\n if ((this.value && this.value.valueOf()) !== (this.previousDateTime && +this.previousDateTime.valueOf())) {\n this.valueWithMinutes = this.value;\n this.setInputValue('date');\n this.previousDateTime = this.value && new Date(+this.value);\n }\n };\n DateTimePicker.prototype.updateValue = function (e) {\n this.setInputValue('time');\n if (+this.previousDateTime !== +this.value) {\n this.changedArgs = {\n value: this.value, event: e || null,\n isInteracted: !isNullOrUndefined(e),\n element: this.element\n };\n this.addTimeSelection();\n this.trigger('change', this.changedArgs);\n this.previousDateTime = this.previousDate = this.value;\n }\n };\n DateTimePicker.prototype.setTimeScrollPosition = function () {\n var popupElement = this.selectedElement;\n if (!isNullOrUndefined(popupElement)) {\n this.findScrollTop(popupElement);\n }\n else if (this.dateTimeWrapper && this.checkDateValue(this.scrollTo)) {\n this.setScrollTo();\n }\n };\n DateTimePicker.prototype.findScrollTop = function (element) {\n var listHeight = this.getPopupHeight();\n var nextElement = element.nextElementSibling;\n var height = nextElement ? nextElement.offsetTop : element.offsetTop;\n var lineHeight = element.getBoundingClientRect().height;\n if ((height + element.offsetTop) > listHeight) {\n if (Browser.isDevice && this.fullScreenMode) {\n var listContent = this.dateTimeWrapper.querySelector('.e-content');\n listContent.scrollTop = nextElement ? (height - (listHeight / HALFPOSITION + lineHeight / HALFPOSITION)) : height;\n }\n else {\n this.dateTimeWrapper.scrollTop = nextElement ? (height - (listHeight / HALFPOSITION + lineHeight / HALFPOSITION)) : height;\n }\n }\n else {\n this.dateTimeWrapper.scrollTop = 0;\n }\n };\n DateTimePicker.prototype.setScrollTo = function () {\n var element;\n var items = this.dateTimeWrapper.querySelectorAll('.' + LISTCLASS);\n if (items.length >= 0) {\n this.scrollInvoked = true;\n var initialTime = this.timeCollections[0];\n var scrollTime = this.getDateObject(this.checkDateValue(this.scrollTo)).getTime();\n element = items[Math.round((scrollTime - initialTime) / (this.step * 60000))];\n }\n else {\n this.dateTimeWrapper.scrollTop = 0;\n }\n if (!isNullOrUndefined(element)) {\n this.findScrollTop(element);\n }\n else {\n this.dateTimeWrapper.scrollTop = 0;\n }\n };\n DateTimePicker.prototype.setInputValue = function (type) {\n if (type === 'date') {\n this.inputElement.value = this.previousElementValue = this.getFormattedValue(this.getFullDateTime());\n this.setProperties({ value: this.getFullDateTime() }, true);\n }\n else {\n var tempVal = this.getFormattedValue(new Date(this.timeCollections[this.activeIndex]));\n Input.setValue(tempVal, this.inputElement, this.floatLabelType, this.showClearButton);\n this.previousElementValue = this.inputElement.value;\n this.setProperties({ value: new Date(this.timeCollections[this.activeIndex]) }, true);\n if (this.enableMask) {\n this.createMask();\n }\n }\n this.updateIconState();\n };\n DateTimePicker.prototype.getFullDateTime = function () {\n var value = null;\n if (this.isDateObject(this.valueWithMinutes)) {\n value = this.combineDateTime(this.valueWithMinutes);\n }\n else {\n value = this.previousDate;\n }\n return this.validateMinMaxRange(value);\n };\n DateTimePicker.prototype.createMask = function () {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n };\n DateTimePicker.prototype.combineDateTime = function (value) {\n if (this.isDateObject(value)) {\n var day = this.previousDate.getDate();\n var month = this.previousDate.getMonth();\n var year = this.previousDate.getFullYear();\n var hour = value.getHours();\n var minutes = value.getMinutes();\n var seconds = value.getSeconds();\n return new Date(year, month, day, hour, minutes, seconds);\n }\n else {\n return this.previousDate;\n }\n };\n DateTimePicker.prototype.onMouseClick = function (event) {\n var target = event.target;\n var li = this.selectedElement = closest(target, '.' + LISTCLASS);\n if (li && li.classList.contains(LISTCLASS)) {\n this.timeValue = li.getAttribute('data-value');\n this.hide(event);\n }\n this.setSelection(li, event);\n };\n DateTimePicker.prototype.setSelection = function (li, event) {\n if (this.isValidLI(li) && !li.classList.contains(ACTIVE)) {\n this.selectedElement = li;\n var index = Array.prototype.slice.call(this.liCollections).indexOf(li);\n this.activeIndex = index;\n this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);\n addClass([this.selectedElement], ACTIVE);\n this.selectedElement.setAttribute('aria-selected', 'true');\n this.updateValue(event);\n }\n };\n DateTimePicker.prototype.setTimeActiveClass = function () {\n var collections = isNullOrUndefined(this.dateTimeWrapper) ? this.listWrapper : this.dateTimeWrapper;\n if (!isNullOrUndefined(collections)) {\n var items = collections.querySelectorAll('.' + LISTCLASS);\n if (items.length) {\n for (var i = 0; i < items.length; i++) {\n if (this.timeCollections[i] === +(this.valueWithMinutes)) {\n items[i].setAttribute('aria-selected', 'true');\n this.selectedElement = items[i];\n this.activeIndex = i;\n this.setTimeActiveDescendant();\n break;\n }\n }\n }\n }\n };\n DateTimePicker.prototype.setTimeActiveDescendant = function () {\n if (!isNullOrUndefined(this.selectedElement) && this.value) {\n attributes(this.inputElement, { 'aria-activedescendant': this.selectedElement.getAttribute('id') });\n }\n else {\n this.inputElement.removeAttribute('aria-activedescendant');\n }\n };\n DateTimePicker.prototype.addTimeSelection = function () {\n this.selectedElement = null;\n this.removeTimeSelection();\n this.setTimeActiveClass();\n if (!isNullOrUndefined(this.selectedElement)) {\n addClass([this.selectedElement], ACTIVE);\n this.selectedElement.setAttribute('aria-selected', 'true');\n }\n };\n DateTimePicker.prototype.removeTimeSelection = function () {\n this.removeTimeHover(HOVER);\n if (!isNullOrUndefined(this.dateTimeWrapper)) {\n var items = this.dateTimeWrapper.querySelectorAll('.' + ACTIVE);\n if (items.length) {\n removeClass(items, ACTIVE);\n items[0].removeAttribute('aria-selected');\n }\n }\n };\n DateTimePicker.prototype.removeTimeHover = function (className) {\n var hoveredItem = this.getTimeHoverItem(className);\n if (hoveredItem && hoveredItem.length) {\n removeClass(hoveredItem, className);\n }\n };\n DateTimePicker.prototype.getTimeHoverItem = function (className) {\n var collections = isNullOrUndefined(this.dateTimeWrapper) ? this.listWrapper : this.dateTimeWrapper;\n var hoveredItem;\n if (!isNullOrUndefined(collections)) {\n hoveredItem = collections.querySelectorAll('.' + className);\n }\n return hoveredItem;\n };\n DateTimePicker.prototype.isValidLI = function (li) {\n return (li && li.classList.contains(LISTCLASS) && !li.classList.contains(DISABLED));\n };\n DateTimePicker.prototype.calculateStartEnd = function (value, range, method) {\n var day = value.getDate();\n var month = value.getMonth();\n var year = value.getFullYear();\n var hours = value.getHours();\n var minutes = value.getMinutes();\n var seconds = value.getSeconds();\n var milliseconds = value.getMilliseconds();\n if (range) {\n if (method === 'starttime') {\n return new Date(year, month, day, 0, 0, 0);\n }\n else {\n return new Date(year, month, day, 23, 59, 59);\n }\n }\n else {\n return new Date(year, month, day, hours, minutes, seconds, milliseconds);\n }\n };\n DateTimePicker.prototype.startTime = function (date) {\n var tempStartValue;\n var start;\n var tempMin = this.min;\n var value = date === null ? new Date() : date;\n if ((+value.getDate() === +tempMin.getDate() && +value.getMonth() === +tempMin.getMonth() &&\n +value.getFullYear() === +tempMin.getFullYear()) || ((+new Date(value.getFullYear(), value.getMonth(), value.getDate())) <=\n +new Date(tempMin.getFullYear(), tempMin.getMonth(), tempMin.getDate()))) {\n start = false;\n tempStartValue = this.min;\n }\n else if (+value < +this.max && +value > +this.min) {\n start = true;\n tempStartValue = value;\n }\n else if (+value >= +this.max) {\n start = true;\n tempStartValue = this.max;\n }\n return this.calculateStartEnd(tempStartValue, start, 'starttime');\n };\n DateTimePicker.prototype.TimePopupFormat = function () {\n var format = '';\n var formatCount = 0;\n var proxy = this;\n function formatValueSpecifier(formattext) {\n switch (formattext) {\n case 'd':\n case 'dd':\n case 'ddd':\n case 'dddd':\n case 'M':\n case 'MM':\n case 'MMM':\n case 'MMMM':\n case 'y':\n case 'yy':\n case 'yyy':\n case 'yyyy':\n if (format == '') {\n format = format + formattext;\n }\n else {\n format = format + \"/\" + formattext;\n }\n formatCount = formatCount + 1;\n break;\n }\n if (formatCount > 2) {\n proxy.dateFormatString = format;\n }\n return format;\n }\n return formatValueSpecifier;\n };\n DateTimePicker.prototype.endTime = function (date) {\n var tempEndValue;\n var end;\n var tempMax = this.max;\n var value = date === null ? new Date() : date;\n if ((+value.getDate() === +tempMax.getDate() && +value.getMonth() === +tempMax.getMonth() &&\n +value.getFullYear() === +tempMax.getFullYear()) || (+new Date(value.getUTCFullYear(), value.getMonth(), value.getDate()) >=\n +new Date(tempMax.getFullYear(), tempMax.getMonth(), tempMax.getDate()))) {\n end = false;\n tempEndValue = this.max;\n }\n else if (+value < +this.max && +value > +this.min) {\n end = true;\n tempEndValue = value;\n }\n else if (+value <= +this.min) {\n end = true;\n tempEndValue = this.min;\n }\n return this.calculateStartEnd(tempEndValue, end, 'endtime');\n };\n DateTimePicker.prototype.hide = function (e) {\n var _this = this;\n if (this.popupObj || this.dateTimeWrapper) {\n this.preventArgs = {\n cancel: false,\n popup: this.popupObj || this.popupObject,\n event: e || null\n };\n var eventArgs = this.preventArgs;\n if (isNullOrUndefined(this.popupObj)) {\n this.trigger('close', eventArgs, function (eventArgs) {\n _this.dateTimeCloseEventCallback(e, eventArgs);\n });\n }\n else {\n this.dateTimeCloseEventCallback(e, eventArgs);\n }\n }\n else {\n if (Browser.isDevice && this.allowEdit && !this.readonly) {\n this.inputElement.removeAttribute('readonly');\n }\n this.setAllowEdit();\n }\n };\n DateTimePicker.prototype.dateTimeCloseEventCallback = function (e, eventArgs) {\n this.preventArgs = eventArgs;\n if (!this.preventArgs.cancel) {\n if (this.isDatePopupOpen()) {\n _super.prototype.hide.call(this, e);\n }\n else if (this.isTimePopupOpen()) {\n this.closePopup(e);\n removeClass([document.body], OVERFLOW);\n if (Browser.isDevice && this.timeModal) {\n this.timeModal.style.display = 'none';\n this.timeModal.outerHTML = '';\n this.timeModal = null;\n }\n this.setTimeActiveDescendant();\n }\n }\n if (Browser.isDevice && this.allowEdit && !this.readonly) {\n this.inputElement.removeAttribute('readonly');\n }\n this.setAllowEdit();\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n DateTimePicker.prototype.closePopup = function (e) {\n if (this.isTimePopupOpen() && this.popupObject) {\n var animModel = {\n name: 'FadeOut',\n duration: ANIMATIONDURATION,\n delay: 0\n };\n this.popupObject.hide(new Animation(animModel));\n this.inputWrapper.container.classList.remove(ICONANIMATION);\n attributes(this.inputElement, { 'aria-expanded': 'false' });\n this.inputElement.removeAttribute('aria-owns');\n this.inputElement.removeAttribute('aria-controls');\n EventHandler.remove(document, 'mousedown touchstart', this.documentClickHandler);\n }\n };\n DateTimePicker.prototype.preRender = function () {\n this.checkFormat();\n this.dateTimeFormat = this.cldrDateTimeFormat();\n _super.prototype.preRender.call(this);\n removeClass([this.inputElementCopy], [ROOT]);\n };\n DateTimePicker.prototype.getProperty = function (date, val) {\n if (val === 'min') {\n this.setProperties({ min: this.validateValue(date.min) }, true);\n }\n else {\n this.setProperties({ max: this.validateValue(date.max) }, true);\n }\n };\n DateTimePicker.prototype.checkAttributes = function (isDynamic) {\n var attributes = isDynamic ? isNullOrUndefined(this.htmlAttributes) ? [] : Object.keys(this.htmlAttributes) :\n ['style', 'name', 'step', 'disabled', 'readonly', 'value', 'min', 'max', 'placeholder', 'type'];\n var value;\n for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) {\n var prop = attributes_1[_i];\n if (!isNullOrUndefined(this.inputElement.getAttribute(prop))) {\n switch (prop) {\n case 'name':\n this.inputElement.setAttribute('name', this.inputElement.getAttribute(prop));\n break;\n case 'step':\n this.step = parseInt(this.inputElement.getAttribute(prop), 10);\n break;\n case 'readonly':\n if ((isNullOrUndefined(this.dateTimeOptions) || (this.dateTimeOptions['readonly'] === undefined)) || isDynamic) {\n var readonly = this.inputElement.getAttribute(prop) === 'disabled' ||\n this.inputElement.getAttribute(prop) === '' ||\n this.inputElement.getAttribute(prop) === 'true' ? true : false;\n this.setProperties({ readonly: readonly }, !isDynamic);\n }\n break;\n case 'placeholder':\n if ((isNullOrUndefined(this.dateTimeOptions) || (this.dateTimeOptions['placeholder'] === undefined)) || isDynamic) {\n this.setProperties({ placeholder: this.inputElement.getAttribute(prop) }, !isDynamic);\n }\n break;\n case 'min':\n if ((isNullOrUndefined(this.dateTimeOptions) || (this.dateTimeOptions['min'] === undefined)) || isDynamic) {\n value = new Date(this.inputElement.getAttribute(prop));\n if (!this.isNullOrEmpty(value) && !isNaN(+value)) {\n this.setProperties({ min: value }, !isDynamic);\n }\n }\n break;\n case 'disabled':\n if ((isNullOrUndefined(this.dateTimeOptions) || (this.dateTimeOptions['enabled'] === undefined)) || isDynamic) {\n var enabled = this.inputElement.getAttribute(prop) === 'disabled' ||\n this.inputElement.getAttribute(prop) === 'true' ||\n this.inputElement.getAttribute(prop) === '' ? false : true;\n this.setProperties({ enabled: enabled }, !isDynamic);\n }\n break;\n case 'value':\n if ((isNullOrUndefined(this.dateTimeOptions) || (this.dateTimeOptions['value'] === undefined)) || isDynamic) {\n value = new Date(this.inputElement.getAttribute(prop));\n if (!this.isNullOrEmpty(value) && !isNaN(+value)) {\n this.setProperties({ value: value }, !isDynamic);\n }\n }\n break;\n case 'max':\n if ((isNullOrUndefined(this.dateTimeOptions) || (this.dateTimeOptions['max'] === undefined)) || isDynamic) {\n value = new Date(this.inputElement.getAttribute(prop));\n if (!this.isNullOrEmpty(value) && !isNaN(+value)) {\n this.setProperties({ max: value }, !isDynamic);\n }\n }\n break;\n }\n }\n }\n };\n DateTimePicker.prototype.requiredModules = function () {\n var modules = [];\n if (this.calendarMode === 'Islamic') {\n modules.push({ args: [this], member: 'islamic', name: 'Islamic' });\n }\n if (this.enableMask) {\n modules.push(this.maskedDateModule());\n }\n return modules;\n };\n DateTimePicker.prototype.maskedDateModule = function () {\n var modules = { args: [this], member: 'MaskedDateTime' };\n return modules;\n };\n DateTimePicker.prototype.getTimeActiveElement = function () {\n if (!isNullOrUndefined(this.dateTimeWrapper)) {\n return this.dateTimeWrapper.querySelectorAll('.' + ACTIVE);\n }\n else {\n return null;\n }\n };\n DateTimePicker.prototype.createDateObj = function (val) {\n return val instanceof Date ? val : null;\n };\n DateTimePicker.prototype.getDateObject = function (text) {\n if (!this.isNullOrEmpty(text)) {\n var dateValue = this.createDateObj(text);\n var value = this.valueWithMinutes;\n var status_1 = !isNullOrUndefined(value);\n if (this.checkDateValue(dateValue)) {\n var date = status_1 ? value.getDate() : DAY;\n var month = status_1 ? value.getMonth() : MONTH;\n var year = status_1 ? value.getFullYear() : YEAR;\n var hour = status_1 ? value.getHours() : HOUR;\n var minute = status_1 ? value.getMinutes() : MINUTE;\n var second = status_1 ? value.getSeconds() : SECOND;\n var millisecond = status_1 ? value.getMilliseconds() : MILLISECOND;\n if (!this.scrollInvoked) {\n return new Date(year, month, date, hour, minute, second, millisecond);\n }\n else {\n this.scrollInvoked = false;\n return new Date(year, month, date, dateValue.getHours(), dateValue.getMinutes(), dateValue.getSeconds(), dateValue.getMilliseconds());\n }\n }\n }\n return null;\n };\n DateTimePicker.prototype.findNextTimeElement = function (event) {\n var textVal = (this.inputElement).value;\n var value = isNullOrUndefined(this.valueWithMinutes) ? this.createDateObj(textVal) :\n this.getDateObject(this.valueWithMinutes);\n var dateTimeVal = null;\n var listCount = this.liCollections.length;\n if (!isNullOrUndefined(this.activeIndex) || !isNullOrUndefined(this.checkDateValue(value))) {\n if (event.action === 'home') {\n dateTimeVal = +(this.createDateObj(new Date(this.timeCollections[0])));\n this.activeIndex = 0;\n }\n else if (event.action === 'end') {\n dateTimeVal = +(this.createDateObj(new Date(this.timeCollections[this.timeCollections.length - 1])));\n this.activeIndex = this.timeCollections.length - 1;\n }\n else {\n if (event.action === 'down') {\n for (var i = 0; i < listCount; i++) {\n if (+value < this.timeCollections[i]) {\n dateTimeVal = +(this.createDateObj(new Date(this.timeCollections[i])));\n this.activeIndex = i;\n break;\n }\n }\n }\n else {\n for (var i = listCount - 1; i >= 0; i--) {\n if (+value > this.timeCollections[i]) {\n dateTimeVal = +(this.createDateObj(new Date(this.timeCollections[i])));\n this.activeIndex = i;\n break;\n }\n }\n }\n }\n this.selectedElement = this.liCollections[this.activeIndex];\n this.timeElementValue(isNullOrUndefined(dateTimeVal) ? null : new Date(dateTimeVal));\n }\n };\n DateTimePicker.prototype.setTimeValue = function (date, value) {\n var dateString;\n var time;\n var val = this.validateMinMaxRange(value);\n var newval = this.createDateObj(val);\n if (this.getFormattedValue(newval) !== (!isNullOrUndefined(this.value) ? this.getFormattedValue(this.value) : null)) {\n this.valueWithMinutes = isNullOrUndefined(newval) ? null : newval;\n time = new Date(+this.valueWithMinutes);\n }\n else {\n if (this.strictMode) {\n //for strict mode case, when value not present within a range. Reset the nearest range value.\n date = newval;\n }\n this.valueWithMinutes = this.checkDateValue(date);\n time = new Date(+this.valueWithMinutes);\n }\n if (this.calendarMode === 'Gregorian') {\n dateString = this.globalize.formatDate(time, {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.cldrDateTimeFormat(),\n type: 'dateTime', skeleton: 'yMd'\n });\n }\n else {\n dateString = this.globalize.formatDate(time, {\n format: !isNullOrUndefined(this.formatString) ? this.formatString : this.cldrDateTimeFormat(),\n type: 'dateTime', skeleton: 'yMd', calendar: 'islamic'\n });\n }\n if (!this.strictMode && isNullOrUndefined(time)) {\n Input.setValue(dateString, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n else {\n Input.setValue(dateString, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n return time;\n };\n DateTimePicker.prototype.timeElementValue = function (value) {\n if (!isNullOrUndefined(this.checkDateValue(value)) && !this.isNullOrEmpty(value)) {\n var date = value instanceof Date ? value : this.getDateObject(value);\n return this.setTimeValue(date, value);\n }\n return null;\n };\n DateTimePicker.prototype.timeKeyHandler = function (event) {\n if (isNullOrUndefined(this.step) || this.step <= 0) {\n return;\n }\n var listCount = this.timeCollections.length;\n if (isNullOrUndefined(this.getTimeActiveElement()) || this.getTimeActiveElement().length === 0) {\n if (this.liCollections.length > 0) {\n if (isNullOrUndefined(this.value) && isNullOrUndefined(this.activeIndex)) {\n this.activeIndex = 0;\n this.selectedElement = this.liCollections[0];\n this.timeElementValue(new Date(this.timeCollections[0]));\n }\n else {\n this.findNextTimeElement(event);\n }\n }\n }\n else {\n var nextItemValue = void 0;\n if ((event.keyCode >= 37) && (event.keyCode <= 40)) {\n var index = (event.keyCode === 40 || event.keyCode === 39) ? ++this.activeIndex : --this.activeIndex;\n this.activeIndex = index = this.activeIndex === (listCount) ? 0 : this.activeIndex;\n this.activeIndex = index = this.activeIndex < 0 ? (listCount - 1) : this.activeIndex;\n nextItemValue = isNullOrUndefined(this.timeCollections[index]) ?\n this.timeCollections[0] : this.timeCollections[index];\n }\n else if (event.action === 'home') {\n this.activeIndex = 0;\n nextItemValue = this.timeCollections[0];\n }\n else if (event.action === 'end') {\n this.activeIndex = listCount - 1;\n nextItemValue = this.timeCollections[listCount - 1];\n }\n this.selectedElement = this.liCollections[this.activeIndex];\n this.timeElementValue(new Date(nextItemValue));\n }\n this.isNavigate = true;\n this.setTimeHover(this.selectedElement, NAVIGATION);\n this.setTimeActiveDescendant();\n if (this.isTimePopupOpen() && this.selectedElement !== null && (!event || event.type !== 'click')) {\n this.setTimeScrollPosition();\n }\n };\n DateTimePicker.prototype.timeKeyActionHandle = function (event) {\n if (this.enabled) {\n if (event.action !== 'right' && event.action !== 'left' && event.action !== 'tab') {\n event.preventDefault();\n }\n switch (event.action) {\n case 'up':\n case 'down':\n case 'home':\n case 'end':\n this.timeKeyHandler(event);\n break;\n case 'enter':\n if (this.isNavigate) {\n this.selectedElement = this.liCollections[this.activeIndex];\n this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);\n this.setInputValue('time');\n if (+this.previousDateTime !== +this.value) {\n this.changedArgs.value = this.value;\n this.addTimeSelection();\n this.previousDateTime = this.value;\n }\n }\n else {\n this.updateValue(event);\n }\n this.hide(event);\n addClass([this.inputWrapper.container], INPUTFOCUS);\n this.isNavigate = false;\n event.stopPropagation();\n break;\n case 'escape':\n this.hide(event);\n break;\n default:\n this.isNavigate = false;\n break;\n }\n }\n };\n DateTimePicker.prototype.inputKeyAction = function (event) {\n switch (event.action) {\n case 'altDownArrow':\n this.strictModeUpdate();\n this.updateInput();\n this.toggle(event);\n break;\n }\n };\n /**\n * Called internally if any of the property value changed.\n *\n * @param {DateTimePickerModel} newProp - Returns the dynamic property value of the component.\n * @param {DateTimePickerModel} oldProp - Returns the previous property value of the component.\n * @returns {void}\n\n */\n DateTimePicker.prototype.onPropertyChanged = function (newProp, oldProp) {\n for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'value':\n this.isDynamicValueChanged = true;\n this.invalidValueString = null;\n this.checkInvalidValue(newProp.value);\n newProp.value = this.value;\n newProp.value = this.validateValue(newProp.value);\n if (this.enableMask) {\n Input.setValue(this.maskedDateValue, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n else {\n Input.setValue(this.getFormattedValue(newProp.value), this.inputElement, this.floatLabelType, this.showClearButton);\n }\n this.valueWithMinutes = newProp.value;\n this.setProperties({ value: newProp.value }, true);\n if (this.popupObj) {\n this.popupUpdate();\n }\n this.previousDateTime = new Date(this.inputElement.value);\n this.updateInput();\n this.changeTrigger(null);\n this.preventChange = this.isAngular && this.preventChange ? !this.preventChange : this.preventChange;\n if (this.enableMask && this.value) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n }\n break;\n case 'min':\n case 'max':\n this.getProperty(newProp, prop);\n this.updateInput();\n break;\n case 'enableRtl':\n Input.setEnableRtl(this.enableRtl, [this.inputWrapper.container]);\n break;\n case 'cssClass':\n if (!isNullOrUndefined(oldProp.cssClass)) {\n oldProp.cssClass = (oldProp.cssClass.replace(/\\s+/g, ' ')).trim();\n }\n if (!isNullOrUndefined(newProp.cssClass)) {\n newProp.cssClass = (newProp.cssClass.replace(/\\s+/g, ' ')).trim();\n }\n Input.setCssClass(newProp.cssClass, [this.inputWrapper.container], oldProp.cssClass);\n if (this.dateTimeWrapper) {\n Input.setCssClass(newProp.cssClass, [this.dateTimeWrapper], oldProp.cssClass);\n }\n break;\n case 'locale':\n this.globalize = new Internationalization(this.locale);\n this.l10n.setLocale(this.locale);\n if (this.dateTimeOptions && this.dateTimeOptions.placeholder == null) {\n this.setProperties({ placeholder: this.l10n.getConstant('placeholder') }, true);\n Input.setPlaceholder(this.l10n.getConstant('placeholder'), this.inputElement);\n }\n this.dateTimeFormat = this.cldrDateTimeFormat();\n _super.prototype.updateInput.call(this);\n break;\n case 'htmlAttributes':\n this.updateHtmlAttributeToElement();\n this.updateHtmlAttributeToWrapper();\n this.checkAttributes(true);\n break;\n case 'format':\n this.setProperties({ format: newProp.format }, true);\n this.checkFormat();\n this.dateTimeFormat = this.formatString;\n this.setValue();\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n if (!this.value) {\n Input.setValue(this.maskedDateValue, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n }\n break;\n case 'placeholder':\n Input.setPlaceholder(newProp.placeholder, this.inputElement);\n break;\n case 'enabled':\n Input.setEnabled(this.enabled, this.inputElement);\n if (this.enabled) {\n this.inputElement.setAttribute('tabindex', this.tabIndex);\n }\n else {\n this.inputElement.tabIndex = -1;\n }\n break;\n case 'strictMode':\n this.invalidValueString = null;\n this.updateInput();\n break;\n case 'width':\n this.setWidth(newProp.width);\n Input.calculateWidth(this.inputElement, this.inputWrapper.container);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-date-time-icon');\n }\n break;\n case 'readonly':\n Input.setReadonly(this.readonly, this.inputElement);\n break;\n case 'floatLabelType':\n this.floatLabelType = newProp.floatLabelType;\n Input.removeFloating(this.inputWrapper);\n Input.addFloating(this.inputElement, this.floatLabelType, this.placeholder);\n if (!isNullOrUndefined(this.inputWrapper.buttons[0]) && !isNullOrUndefined(this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0]) && this.floatLabelType !== 'Never') {\n this.inputWrapper.container.getElementsByClassName('e-float-text-overflow')[0].classList.add('e-date-time-icon');\n }\n break;\n case 'scrollTo':\n if (this.checkDateValue(new Date(this.checkValue(newProp.scrollTo)))) {\n if (this.dateTimeWrapper) {\n this.setScrollTo();\n }\n this.setProperties({ scrollTo: this.checkDateValue(new Date(this.checkValue(newProp.scrollTo))) }, true);\n }\n else {\n this.setProperties({ scrollTo: null }, true);\n }\n break;\n case 'enableMask':\n if (this.enableMask) {\n this.notify('createMask', {\n module: 'MaskedDateTime'\n });\n Input.setValue(this.maskedDateValue, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n else {\n if (this.inputElement.value === this.maskedDateValue) {\n this.maskedDateValue = '';\n Input.setValue(this.maskedDateValue, this.inputElement, this.floatLabelType, this.showClearButton);\n }\n }\n break;\n default:\n _super.prototype.onPropertyChanged.call(this, newProp, oldProp);\n break;\n }\n if (!this.isDynamicValueChanged) {\n this.hide(null);\n }\n this.isDynamicValueChanged = false;\n }\n };\n /**\n * To get component name.\n *\n * @returns {string} Returns the component name.\n * @private\n */\n DateTimePicker.prototype.getModuleName = function () {\n return 'datetimepicker';\n };\n DateTimePicker.prototype.restoreValue = function () {\n this.previousDateTime = this.previousDate;\n this.currentDate = this.value ? this.value : new Date();\n this.valueWithMinutes = this.value;\n this.previousDate = this.value;\n this.previousElementValue = this.previousElementValue = (isNullOrUndefined(this.inputValueCopy)) ? '' :\n this.getFormattedValue(this.inputValueCopy);\n };\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"timeFormat\", void 0);\n __decorate([\n Property(30)\n ], DateTimePicker.prototype, \"step\", void 0);\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"scrollTo\", void 0);\n __decorate([\n Property(1000)\n ], DateTimePicker.prototype, \"zIndex\", void 0);\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"keyConfigs\", void 0);\n __decorate([\n Property({})\n ], DateTimePicker.prototype, \"htmlAttributes\", void 0);\n __decorate([\n Property(false)\n ], DateTimePicker.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(true)\n ], DateTimePicker.prototype, \"allowEdit\", void 0);\n __decorate([\n Property(false)\n ], DateTimePicker.prototype, \"isMultiSelection\", void 0);\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"values\", void 0);\n __decorate([\n Property(true)\n ], DateTimePicker.prototype, \"showClearButton\", void 0);\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"placeholder\", void 0);\n __decorate([\n Property(false)\n ], DateTimePicker.prototype, \"strictMode\", void 0);\n __decorate([\n Property(false)\n ], DateTimePicker.prototype, \"fullScreenMode\", void 0);\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"serverTimezoneOffset\", void 0);\n __decorate([\n Property(new Date(1900, 0, 1))\n ], DateTimePicker.prototype, \"min\", void 0);\n __decorate([\n Property(new Date(2099, 11, 31))\n ], DateTimePicker.prototype, \"max\", void 0);\n __decorate([\n Property(null)\n ], DateTimePicker.prototype, \"firstDayOfWeek\", void 0);\n __decorate([\n Property('Gregorian')\n ], DateTimePicker.prototype, \"calendarMode\", void 0);\n __decorate([\n Property('Month')\n ], DateTimePicker.prototype, \"start\", void 0);\n __decorate([\n Property('Month')\n ], DateTimePicker.prototype, \"depth\", void 0);\n __decorate([\n Property(false)\n ], DateTimePicker.prototype, \"weekNumber\", void 0);\n __decorate([\n Property(true)\n ], DateTimePicker.prototype, \"showTodayButton\", void 0);\n __decorate([\n Property('Short')\n ], DateTimePicker.prototype, \"dayHeaderFormat\", void 0);\n __decorate([\n Property(false)\n ], DateTimePicker.prototype, \"openOnFocus\", void 0);\n __decorate([\n Property(false)\n ], DateTimePicker.prototype, \"enableMask\", void 0);\n __decorate([\n Property({ day: 'day', month: 'month', year: 'year', hour: 'hour', minute: 'minute', second: 'second', dayOfTheWeek: 'day of the week' })\n ], DateTimePicker.prototype, \"maskPlaceholder\", void 0);\n __decorate([\n Event()\n ], DateTimePicker.prototype, \"open\", void 0);\n __decorate([\n Event()\n ], DateTimePicker.prototype, \"close\", void 0);\n __decorate([\n Event()\n ], DateTimePicker.prototype, \"cleared\", void 0);\n __decorate([\n Event()\n ], DateTimePicker.prototype, \"blur\", void 0);\n __decorate([\n Event()\n ], DateTimePicker.prototype, \"focus\", void 0);\n __decorate([\n Event()\n ], DateTimePicker.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], DateTimePicker.prototype, \"destroyed\", void 0);\n DateTimePicker = __decorate([\n NotifyPropertyChanges\n ], DateTimePicker);\n return DateTimePicker;\n}(DatePicker));\nexport { DateTimePicker };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { EventHandler, remove, Browser } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { Query, DataManager, Predicate } from '@syncfusion/ej2-data';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { DropDownList, AutoComplete } from '@syncfusion/ej2-dropdowns';\nimport { NumericTextBox } from '@syncfusion/ej2-inputs';\nimport { RadioButton, CheckBox } from '@syncfusion/ej2-buttons';\nimport { distinctStringValues, isComplexField, getComplexFieldID, getCustomDateFormat, applyBiggerTheme, performComplexDataOperation, registerEventHandlers, removeEventHandlers, clearReactVueTemplates } from '../base/util';\nimport { DatePicker, DateTimePicker } from '@syncfusion/ej2-calendars';\nimport { parentsUntil, appendChildren, extend, eventPromise } from '../base/util';\nimport * as events from '../base/constant';\nimport { ContextMenu } from '@syncfusion/ej2-navigations';\nimport { CheckBoxFilterBase } from '../common/checkbox-filter-base';\nimport * as literals from '../base/string-literals';\n/**\n * @hidden\n * `ExcelFilter` module is used to handle filtering action.\n */\nvar ExcelFilterBase = /** @class */ (function (_super) {\n __extends(ExcelFilterBase, _super);\n /**\n * Constructor for excel filtering module\n *\n * @param {IXLFilter} parent - parent details\n * @param {Object} customFltrOperators - operator details\n * @hidden\n */\n function ExcelFilterBase(parent, customFltrOperators) {\n var _this = _super.call(this, parent) || this;\n _this.childRefs = [];\n _this.eventHandlers = {};\n _this.isDevice = false;\n _this.focusedMenuItem = null;\n _this.customFilterOperators = customFltrOperators;\n _this.isExcel = true;\n return _this;\n }\n ExcelFilterBase.prototype.getCMenuDS = function (type, operator) {\n var options = {\n number: ['Equal', 'NotEqual', '', 'LessThan', 'LessThanOrEqual', 'GreaterThan',\n 'GreaterThanOrEqual', 'Between', '', 'CustomFilter'],\n string: ['Equal', 'NotEqual', '', 'StartsWith', 'EndsWith', '', 'Contains', 'NotContains', '', 'CustomFilter']\n };\n options.date = options.number;\n options.datetime = options.number;\n options.dateonly = options.number;\n var model = [];\n for (var i = 0; i < options[\"\" + type].length; i++) {\n if (options[\"\" + type][parseInt(i.toString(), 10)].length) {\n if (operator) {\n model.push({\n text: this.getLocalizedLabel(options[\"\" + type][parseInt(i.toString(), 10)]) + '...',\n iconCss: 'e-icons e-icon-check ' + (operator === options[\"\" + type][parseInt(i.toString(), 10)].toLowerCase() ? '' : 'e-emptyicon')\n });\n }\n else {\n model.push({\n text: this.getLocalizedLabel(options[\"\" + type][parseInt(i.toString(), 10)]) + '...'\n });\n }\n }\n else {\n model.push({ separator: true });\n }\n }\n return model;\n };\n /**\n * To destroy the filter bar.\n *\n * @returns {void}\n * @hidden\n */\n ExcelFilterBase.prototype.destroy = function () {\n if (this.dlg) {\n this.unwireExEvents();\n _super.prototype.closeDialog.call(this);\n }\n if (!this.isDevice && this.menuObj) {\n var li = this.menuObj.element.querySelector('li.e-focused');\n if (!(li && parentsUntil(li, 'e-excel-menu'))) {\n this.destroyCMenu();\n }\n }\n if (this.dlgObj && !this.dlgObj.isDestroyed) {\n this.removeDialog();\n }\n };\n ExcelFilterBase.prototype.createMenu = function (type, isFiltered, isCheckIcon, eleOptions) {\n var options = { string: 'TextFilter', date: 'DateFilter', dateonly: 'DateFilter', datetime: 'DateTimeFilter', number: 'NumberFilter' };\n this.menu = this.parent.createElement('div', { className: 'e-contextmenu-wrapper' });\n if (this.parent.enableRtl) {\n this.menu.classList.add('e-rtl');\n }\n else {\n this.menu.classList.remove('e-rtl');\n }\n if (this.parent.cssClass) {\n this.menu.classList.add(this.parent.cssClass);\n }\n var ul = this.parent.createElement('ul');\n var icon = isFiltered ? 'e-excl-filter-icon e-filtered' : 'e-excl-filter-icon';\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (this.parent.allowSorting && this.parent.getModuleName() === 'grid'\n && !this.options.isResponsiveFilter) {\n var hdrele = this.parent.getColumnHeaderByUid(eleOptions.uid).getAttribute('aria-sort');\n var colIsSort = this.parent.getColumnByField(eleOptions.field).allowSorting;\n var isAsc = (!colIsSort || hdrele === 'ascending') ? 'e-disabled e-excel-ascending' : 'e-excel-ascending';\n var isDesc = (!colIsSort || hdrele === 'descending') ? 'e-disabled e-excel-descending' : 'e-excel-descending';\n var ascName = (type === 'string') ? this.getLocalizedLabel('SortAtoZ') : (type === 'datetime' || type === 'date') ?\n this.getLocalizedLabel('SortByOldest') : this.getLocalizedLabel('SortSmallestToLargest');\n var descName = (type === 'string') ? this.getLocalizedLabel('SortZtoA') : (type === 'datetime' || type === 'date') ?\n this.getLocalizedLabel('SortByNewest') : this.getLocalizedLabel('SortLargestToSmallest');\n ul.appendChild(this.createMenuElem(ascName, isAsc, 'e-sortascending'));\n ul.appendChild(this.createMenuElem(descName, isDesc, 'e-sortdescending'));\n var separator = this.parent.createElement('li', { className: 'e-separator e-menu-item e-excel-separator' });\n ul.appendChild(separator);\n }\n if (!this.options.isResponsiveFilter) {\n ul.appendChild(this.createMenuElem(this.getLocalizedLabel('ClearFilter'), isFiltered ? '' : 'e-disabled', icon));\n }\n if (type !== 'boolean') {\n ul.appendChild(this.createMenuElem(this.getLocalizedLabel(options[\"\" + type]), 'e-submenu', isCheckIcon && this.ensureTextFilter() ? 'e-icon-check' : icon + ' e-emptyicon', true));\n }\n this.menu.appendChild(ul);\n this.parent.notify(events.beforeFltrcMenuOpen, { element: this.menu });\n this.parent.notify(events.refreshCustomFilterClearBtn, { isFiltered: isFiltered });\n };\n ExcelFilterBase.prototype.createMenuElem = function (val, className, iconName, isSubMenu) {\n var li = this.parent.createElement('li', { className: className + ' e-menu-item' });\n li.innerHTML = val;\n li.tabIndex = li.classList.contains('e-disabled') ? -1 : 0;\n li.insertBefore(this.parent.createElement('span', { className: 'e-menu-icon e-icons ' + iconName, attrs: { 'aria-hidden': 'true' } }), li.firstChild);\n if (isSubMenu) {\n li.appendChild(this.parent.createElement('span', { className: 'e-icons e-caret' }));\n }\n return li;\n };\n ExcelFilterBase.prototype.wireExEvents = function () {\n if (!Browser.isDevice) {\n EventHandler.add(this.dlg, 'mouseover', this.hoverHandler, this);\n }\n EventHandler.add(this.dlg, 'click', this.clickExHandler, this);\n EventHandler.add(this.dlg, 'keyup', this.keyUp, this);\n EventHandler.add(this.dlg, 'keydown', this.keyDown, this);\n };\n ExcelFilterBase.prototype.unwireExEvents = function () {\n if (!Browser.isDevice) {\n EventHandler.remove(this.dlg, 'mouseover', this.hoverHandler);\n }\n EventHandler.remove(this.dlg, 'click', this.clickExHandler);\n EventHandler.remove(this.dlg, 'keyup', this.keyUp);\n EventHandler.remove(this.dlg, 'keydown', this.keyDown);\n };\n ExcelFilterBase.prototype.clickExHandler = function (e) {\n var options = { string: 'TextFilter', date: 'DateFilter', datetime: 'DateTimeFilter', number: 'NumberFilter' };\n var menuItem = parentsUntil(e.target, 'e-menu-item');\n if (menuItem) {\n if (this.getLocalizedLabel('ClearFilter') === menuItem.innerText.trim()) {\n this.clearFilter();\n this.closeDialog();\n }\n else if ((this.options.isResponsiveFilter || Browser.isDevice)\n && this.getLocalizedLabel(options[this.options.type]) === menuItem.innerText.trim()) {\n this.hoverHandler(e);\n }\n }\n };\n ExcelFilterBase.prototype.focusNextOrPrevElement = function (e, focusableElements, focusClassName) {\n var nextIndex = (e.key === 'ArrowUp' || (e.key === 'Tab' && e.shiftKey)) ? focusableElements.indexOf(document.activeElement) - 1\n : focusableElements.indexOf(document.activeElement) + 1;\n var nextElement = focusableElements[((nextIndex + focusableElements.length) % focusableElements.length)];\n // Set focus on the next / previous element\n if (nextElement) {\n nextElement.focus();\n var focusClass = nextElement.classList.contains('e-chk-hidden') ? 'e-chkfocus' : focusClassName;\n var target = nextElement.classList.contains('e-chk-hidden') ? parentsUntil(nextElement, 'e-ftrchk') : parentsUntil(nextElement, 'e-menu-item');\n this.excelSetFocus(target, focusClass);\n }\n };\n ExcelFilterBase.prototype.keyUp = function (e) {\n if ((e.key === 'Tab' && e.shiftKey) || e.key === 'Tab') {\n var focusClass = e.target.classList.contains('e-chk-hidden') ? 'e-chkfocus' : 'e-menufocus';\n var target = e.target.classList.contains('e-menu-item')\n ? parentsUntil(e.target, 'e-menu-item') : parentsUntil(e.target, 'e-ftrchk');\n this.excelSetFocus(target, focusClass);\n }\n else if ((e.key === 'ArrowUp' || e.key === 'ArrowDown') && !e.altKey) {\n e.preventDefault();\n var focusableElements = Array.from(this.dlg.querySelectorAll('input, button, [tabindex]:not([tabindex=\"-1\"]), .e-menu-item:not(.e-disabled):not(.e-separator)'));\n this.focusNextOrPrevElement(e, focusableElements, 'e-menufocus');\n }\n else if ((e.key === 'Enter' || e.code === 'ArrowRight') && e.target.classList.contains('e-menu-item')) {\n e.preventDefault();\n e.target.click();\n if (e.target.classList.contains('e-submenu')) {\n this.hoverHandler(e);\n this.menuObj.element.querySelector('.e-menu-item').focus();\n this.excelSetFocus(parentsUntil(this.menuObj.element.querySelector('.e-menu-item'), 'e-menu-item'), 'e-focused');\n this.focusedMenuItem = this.menuObj.element.querySelector('.e-menu-item');\n }\n }\n };\n ExcelFilterBase.prototype.keyDown = function (e) {\n //prevented up and down arrow key press default functionality to prevent the browser scroll when performing keyboard navigation in excel filter element.\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n }\n };\n ExcelFilterBase.prototype.excelSetFocus = function (elem, className) {\n var prevElem = this.cmenu.querySelector('.' + className);\n if (prevElem) {\n prevElem.classList.remove(className);\n }\n if (elem) {\n elem.classList.add(className);\n }\n };\n ExcelFilterBase.prototype.destroyCMenu = function () {\n this.isCMenuOpen = false;\n if (this.menuObj && !this.menuObj.isDestroyed) {\n this.menuObj.destroy();\n EventHandler.remove(this.menuObj.element, 'keydown', this.contextKeyDownHandler);\n remove(this.cmenu);\n this.parent.notify(events.renderResponsiveCmenu, { target: null, header: '', isOpen: false, col: this.options.column });\n }\n };\n ExcelFilterBase.prototype.hoverHandler = function (e) {\n if (this.options.isResponsiveFilter && e.type === 'mouseover') {\n return;\n }\n var target = e.target.querySelector('.e-contextmenu');\n var li = parentsUntil(e.target, 'e-menu-item');\n var focused = this.menu.querySelector('.e-focused');\n var isSubMenu;\n if (focused) {\n focused.classList.remove('e-focused');\n }\n if (li) {\n li.classList.add('e-focused');\n isSubMenu = li.classList.contains('e-submenu');\n }\n if (target) {\n return;\n }\n if (!isSubMenu) {\n var submenu = this.menu.querySelector('.e-submenu');\n if (!isNullOrUndefined(submenu)) {\n submenu.classList.remove('e-selected');\n }\n this.destroyCMenu();\n }\n var selectedMenu = this.ensureTextFilter();\n if (!this.isCMenuOpen && isSubMenu) {\n li.classList.add('e-selected');\n this.isCMenuOpen = true;\n var menuOptions = {\n items: this.getCMenuDS(this.options.type, selectedMenu ? selectedMenu.replace(/\\s/g, '') : undefined),\n select: this.selectHandler.bind(this),\n onClose: this.destroyCMenu.bind(this),\n enableRtl: this.parent.enableRtl,\n animationSettings: { effect: 'None' },\n beforeClose: this.preventClose.bind(this),\n cssClass: this.options.isResponsiveFilter && this.parent.cssClass ?\n 'e-res-contextmenu-wrapper' + ' ' + this.parent.cssClass : this.options.isResponsiveFilter ?\n 'e-res-contextmenu-wrapper' : this.parent.cssClass ? this.parent.cssClass : ''\n };\n this.parent.element.appendChild(this.cmenu);\n this.menuObj = new ContextMenu(menuOptions, this.cmenu);\n EventHandler.add(this.menuObj.element, 'keydown', this.contextKeyDownHandler, this);\n var client = this.menu.querySelector('.e-submenu').getBoundingClientRect();\n var pos = { top: 0, left: 0 };\n if (this.options.isResponsiveFilter) {\n var options = { string: 'TextFilter', date: 'DateFilter', datetime: 'DateTimeFilter', number: 'NumberFilter' };\n var content = document.querySelector('.e-responsive-dialog > .e-dlg-header-content');\n var height = content.offsetHeight + 4;\n this.menuObj.element.style.height = 'calc(100% - ' + height + 'px)';\n this.menuObj['open'](height, 0, document.body);\n var header = this.getLocalizedLabel(options[this.options.type]);\n this.parent.notify(events.renderResponsiveCmenu, {\n target: this.menuObj.element.parentElement, header: header, isOpen: true\n });\n }\n else {\n if (Browser.isDevice) {\n this.isDevice = true;\n var contextRect = this.getContextBounds();\n pos.top = (window.innerHeight - contextRect.height) / 2;\n pos.left = (window.innerWidth - contextRect.width) / 2;\n this.closeDialog();\n this.isDevice = false;\n }\n else {\n pos.top = Browser.isIE ? window.pageYOffset + client.top : window.scrollY + client.top;\n pos.left = this.getCMenuYPosition(this.dlg);\n }\n this.menuObj['open'](pos.top, pos.left, e.target);\n }\n applyBiggerTheme(this.parent.element, this.menuObj.element.parentElement);\n }\n };\n ExcelFilterBase.prototype.contextKeyDownHandler = function (e) {\n if ((e.key === 'Tab' && e.shiftKey) || e.key === 'Tab') {\n e.preventDefault();\n var focusableElements = Array.from(this.menuObj.element.querySelectorAll('[tabindex]:not([tabindex=\"-1\"]), .e-menu-item:not(.e-disabled):not(.e-separator)'));\n // Focus the next / previous context menu item\n this.focusNextOrPrevElement(e, focusableElements, 'e-focused');\n }\n else if (e.key === 'ArrowLeft' || e.key === 'Escape') {\n e.preventDefault();\n this.menuObj.close();\n this.focusedMenuItem = null;\n document.querySelector('.e-submenu.e-menu-item').classList.remove('e-selected');\n document.querySelector('.e-submenu.e-menu-item').focus();\n }\n };\n ExcelFilterBase.prototype.ensureTextFilter = function () {\n var selectedMenu;\n var predicates = this.existingPredicate[this.options.field];\n if (predicates && predicates.length === 2) {\n if (predicates[0].operator === 'greaterthanorequal' && predicates[1].operator === 'lessthanorequal') {\n selectedMenu = 'between';\n }\n else {\n selectedMenu = 'customfilter';\n }\n }\n else {\n if (predicates && predicates.length === 1) {\n this.optrData = this.customFilterOperators[this.options.type + 'Operator'];\n selectedMenu = predicates[0].operator;\n }\n }\n return selectedMenu;\n };\n ExcelFilterBase.prototype.preventClose = function (args) {\n if (this.options && this.options.isResponsiveFilter && args.event) {\n var target = args.event.target;\n var isFilterBack = target.classList.contains('e-resfilterback')\n || target.classList.contains('e-res-back-btn') || target.classList.contains('e-menu-item');\n args.cancel = !isFilterBack;\n }\n else {\n if (args.event instanceof MouseEvent && args.event.target.classList.contains('e-submenu')) {\n args.cancel = true;\n }\n }\n };\n ExcelFilterBase.prototype.getContextBounds = function () {\n this.menuObj.element.style.display = 'block';\n return this.menuObj.element.getBoundingClientRect();\n };\n ExcelFilterBase.prototype.getCMenuYPosition = function (target) {\n var contextWidth = this.getContextBounds().width;\n var targetPosition = target.getBoundingClientRect();\n var leftPos = targetPosition.right + contextWidth - this.parent.element.clientWidth;\n var targetBorder = target.offsetWidth - target.clientWidth;\n targetBorder = targetBorder ? targetBorder + 1 : 0;\n return (leftPos < 1) ? (targetPosition.right + 1 - targetBorder) : (targetPosition.left - contextWidth - 1 + targetBorder);\n };\n ExcelFilterBase.prototype.openDialog = function (options) {\n var _this = this;\n this.updateModel(options);\n this.getAndSetChkElem(options);\n this.showDialog(options);\n if (options.cancel) {\n return;\n }\n this.dialogObj.dataBind();\n var filterLength = (this.existingPredicate[options.field] && this.existingPredicate[options.field].length) ||\n this.options.filteredColumns.filter(function (col) {\n return _this.options.field === col.field;\n }).length;\n this.createMenu(options.type, filterLength > 0, (filterLength === 1 || filterLength === 2), options);\n this.dlg.insertBefore(this.menu, this.dlg.firstChild);\n this.dlg.classList.add('e-excelfilter');\n if (this.parent.enableRtl) {\n this.dlg.classList.add('e-rtl');\n }\n this.dlg.classList.remove('e-checkboxfilter');\n this.cmenu = this.parent.createElement('ul', { className: 'e-excel-menu' });\n var menuItems = this.dlg.querySelectorAll('.e-menu-item');\n menuItems.forEach(function (menuItem) {\n if (menuItem.scrollWidth > menuItem.clientWidth) {\n menuItem.setAttribute('title', menuItem.textContent);\n }\n });\n if (options.column.showColumnMenu) {\n this.parent.notify(events.filterDialogCreated, {});\n }\n this.wireExEvents();\n };\n ExcelFilterBase.prototype.closeDialog = function () {\n this.destroy();\n };\n ExcelFilterBase.prototype.selectHandler = function (e) {\n if (e.item) {\n this.parent.notify(events.filterCmenuSelect, {});\n this.menuItem = e.item;\n this.closeDialog();\n this.renderDialogue(e);\n }\n };\n /**\n * @hidden\n * @param {MenuEventArgs} e - event args\n * @returns {void}\n */\n ExcelFilterBase.prototype.renderDialogue = function (e) {\n var _this = this;\n var target = e ? e.element : undefined;\n var column = this.options.field;\n var isComplex = !isNullOrUndefined(column) && isComplexField(column);\n var complexFieldName = !isNullOrUndefined(column) && getComplexFieldID(column);\n var mainDiv = this.parent.createElement('div', {\n className: 'e-xlfl-maindiv',\n id: isComplex ? complexFieldName + '-xlflmenu' : column + '-xlflmenu'\n });\n this.dlgDiv = this.parent.createElement('div', {\n className: 'e-xlflmenu',\n id: isComplex ? complexFieldName + '-xlfldlg' : column + '-xlfldlg'\n });\n if (this.options.isResponsiveFilter) {\n var responsiveCnt = document.querySelector('.e-resfilter > .e-dlg-content > .e-xl-customfilterdiv');\n responsiveCnt.appendChild(this.dlgDiv);\n }\n else {\n this.parent.element.appendChild(this.dlgDiv);\n }\n this.dlgObj = new Dialog({\n header: this.getLocalizedLabel('CustomFilter'),\n isModal: true,\n overlayClick: this.removeDialog.bind(this),\n showCloseIcon: true,\n locale: this.parent.locale,\n closeOnEscape: true,\n target: document.body,\n // target: this.parent.element,\n visible: false,\n enableRtl: this.parent.enableRtl,\n open: function () {\n var rows = [].slice.call(_this.dlgObj.element.querySelectorAll('table.e-xlfl-table tr.e-xlfl-fields'));\n for (var i = 0; i < rows.length; i++) {\n var valInput = rows[i].children[1].querySelector('.e-control');\n var dropDownList = rows[i]\n .querySelector('.e-dropdownlist.e-control')['ej2_instances'][0];\n if (dropDownList.value === 'isempty' || dropDownList.value === 'isnotempty' ||\n dropDownList.value === 'isnull' || dropDownList.value === 'isnotnull') {\n valInput['ej2_instances'][0]['enabled'] = false;\n }\n else if (valInput && !isNullOrUndefined(valInput.getAttribute('disabled'))) {\n valInput['ej2_instances'][0]['enabled'] = true;\n }\n }\n var row = _this.dlgObj.element.querySelector('table.e-xlfl-table>tr');\n if (_this.options.column.filterTemplate) {\n var templateField_1 = isComplexField(_this.options.column.field) ?\n getComplexFieldID(_this.options.column.field) : _this.options.column.field;\n var isReactCompiler = _this.parent.isReact && typeof (_this.options.column.filterTemplate) !== 'string';\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var isReactChild = _this.parent.parentDetails && _this.parent.parentDetails.parentInstObj &&\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n _this.parent.parentDetails.parentInstObj.isReact;\n if (isReactCompiler || isReactChild) {\n _this.parent.renderTemplates(function () {\n row.querySelector('#' + templateField_1 + '-xlfl-frstvalue').focus();\n });\n }\n else {\n row.querySelector('#' + templateField_1 + '-xlfl-frstvalue').focus();\n }\n }\n else {\n //(row.cells[1].querySelector('input:not([type=hidden])') as HTMLElement).focus();\n }\n },\n close: this.removeDialog.bind(this),\n created: this.createdDialog.bind(this, target, column),\n buttons: [{\n click: this.filterBtnClick.bind(this, column),\n buttonModel: {\n content: this.getLocalizedLabel('OKButton'), isPrimary: true,\n cssClass: this.parent.cssClass ? 'e-xlfl-okbtn' + ' ' + this.parent.cssClass : 'e-xlfl-okbtn'\n }\n },\n {\n click: this.removeDialog.bind(this),\n buttonModel: { content: this.getLocalizedLabel('CancelButton'),\n cssClass: this.parent.cssClass ? 'e-xlfl-cancelbtn' + ' ' + this.parent.cssClass : 'e-xlfl-cancelbtn' }\n }],\n content: mainDiv,\n width: 430,\n animationSettings: { effect: 'None' },\n cssClass: this.parent.cssClass ? this.parent.cssClass : ''\n });\n var isStringTemplate = 'isStringTemplate';\n this.dlgObj[\"\" + isStringTemplate] = true;\n this.renderResponsiveDialog();\n this.dlgDiv.setAttribute('aria-label', this.getLocalizedLabel('CustomFilterDialogARIA'));\n this.childRefs.unshift(this.dlgObj);\n this.dlgObj.appendTo(this.dlgDiv);\n };\n ExcelFilterBase.prototype.renderResponsiveDialog = function () {\n if (this.options.isResponsiveFilter) {\n var rowResponsiveDlg = document.querySelector('.e-row-responsive-filter');\n if (rowResponsiveDlg) {\n rowResponsiveDlg.classList.remove('e-row-responsive-filter');\n }\n this.dlgObj.buttons = [{}];\n this.dlgObj.header = undefined;\n this.dlgObj.position = { X: '', Y: '' };\n this.dlgObj.target = document.querySelector('.e-resfilter > .e-dlg-content > .e-xl-customfilterdiv');\n this.dlgObj.width = '100%';\n this.dlgObj.isModal = false;\n this.dlgObj.showCloseIcon = false;\n }\n };\n /**\n * @hidden\n * @returns {void}\n */\n ExcelFilterBase.prototype.removeDialog = function () {\n this.parent.notify(events.customFilterClose, {});\n if ((this.parent.isReact || this.parent.isVue) && this.parent.destroyTemplate !== undefined) {\n clearReactVueTemplates(this.parent, ['filterTemplate']);\n }\n this.removeObjects(this.childRefs);\n remove(this.dlgDiv);\n this.parent.notify(events.filterDialogClose, {});\n };\n ExcelFilterBase.prototype.createdDialog = function (target, column) {\n this.renderCustomFilter(target, column);\n this.dlgObj.element.style.left = '0px';\n if (!this.options.isResponsiveFilter) {\n this.dlgObj.element.style.top = '0px';\n }\n else {\n var content = document.querySelector('.e-responsive-dialog > .e-dlg-header-content');\n var height = content.offsetHeight + 4;\n this.dlgObj.element.style.top = height + 'px';\n }\n if (!this.options.isResponsiveFilter && Browser.isDevice && window.innerWidth < 440) {\n this.dlgObj.element.style.width = '90%';\n }\n this.parent.notify(events.beforeCustomFilterOpen, { column: column, dialog: this.dialogObj });\n this.dlgObj.show();\n applyBiggerTheme(this.parent.element, this.dlgObj.element.parentElement);\n };\n ExcelFilterBase.prototype.renderCustomFilter = function (target, column) {\n var dlgConetntEle = this.dlgObj.element.querySelector('.e-xlfl-maindiv');\n var dlgFields = this.parent.createElement('div', { innerHTML: this.getLocalizedLabel('ShowRowsWhere'), className: 'e-xlfl-dlgfields' });\n dlgConetntEle.appendChild(dlgFields);\n //column name\n var fieldSet = this.parent.createElement('div', { innerHTML: this.options.displayName, className: 'e-xlfl-fieldset' });\n dlgConetntEle.appendChild(fieldSet);\n this.renderFilterUI(column, dlgConetntEle);\n };\n /**\n * @hidden\n * @param {string} col - Defines column details\n * @returns {void}\n */\n ExcelFilterBase.prototype.filterBtnClick = function (col) {\n var isComplex = !isNullOrUndefined(col) && isComplexField(col);\n var complexFieldName = !isNullOrUndefined(col) && getComplexFieldID(col);\n var colValue = isComplex ? complexFieldName : col;\n var fValue = this.dlgDiv.querySelector('#' + colValue + '-xlfl-frstvalue').ej2_instances[0];\n var fOperator = this.dlgDiv.querySelector('#' + colValue + '-xlfl-frstoptr').ej2_instances[0];\n var sValue = this.dlgDiv.querySelector('#' + colValue + '-xlfl-secndvalue').ej2_instances[0];\n var sOperator = this.dlgDiv.querySelector('#' + colValue + '-xlfl-secndoptr').ej2_instances[0];\n var checkBoxValue;\n if (this.options.type === 'string') {\n var checkBox = this.dlgDiv.querySelector('#' + colValue + '-xlflmtcase').ej2_instances[0];\n checkBoxValue = checkBox.checked;\n }\n var andRadio = this.dlgDiv.querySelector('#' + colValue + 'e-xlfl-frstpredicate').ej2_instances[0];\n var predicate = (andRadio.checked ? 'and' : 'or');\n if (sValue.value === null) {\n predicate = 'or';\n }\n this.filterByColumn(this.options.field, fOperator.value, fValue.value, predicate, checkBoxValue, this.options.ignoreAccent, sOperator.value, sValue.value);\n this.removeDialog();\n };\n /**\n * @hidden\n * Filters grid row by column name with given options.\n *\n * @param {string} fieldName - Defines the field name of the filter column.\n * @param {string} firstOperator - Defines the first operator by how to filter records.\n * @param {string | number | Date | boolean} firstValue - Defines the first value which is used to filter records.\n * @param {string} predicate - Defines the relationship between one filter query with another by using AND or OR predicate.\n * @param {boolean} matchCase - If ignore case set to true, then filter records with exact match or else\n * filter records with case insensitive(uppercase and lowercase letters treated as same).\n * @param {boolean} ignoreAccent - If ignoreAccent set to true, then ignores the diacritic characters or accents when filtering.\n * @param {string} secondOperator - Defines the second operator by how to filter records.\n * @param {string | number | Date | boolean} secondValue - Defines the first value which is used to filter records.\n * @returns {void}\n */\n ExcelFilterBase.prototype.filterByColumn = function (fieldName, firstOperator, firstValue, predicate, matchCase, ignoreAccent, secondOperator, secondValue) {\n var col = this.parent.getColumnByField ? this.parent.getColumnByField(fieldName) : this.options.column;\n var field = this.isForeignColumn(col) ? col.foreignKeyValue : fieldName;\n var fColl = [];\n var mPredicate;\n var arg = {\n instance: this, handler: this.filterByColumn, arg1: fieldName, arg2: firstOperator, arg3: firstValue, arg4: predicate,\n arg5: matchCase, arg6: ignoreAccent, arg7: secondOperator, arg8: secondValue, cancel: false\n };\n this.parent.notify(events.fltrPrevent, arg);\n if (arg.cancel) {\n return;\n }\n fColl.push({\n field: field,\n predicate: predicate,\n matchCase: matchCase,\n ignoreAccent: ignoreAccent,\n operator: firstOperator,\n value: arg.arg3,\n type: this.options.type\n });\n mPredicate = new Predicate(field, firstOperator.toLowerCase(), arg.arg3, !matchCase, ignoreAccent);\n if (!isNullOrUndefined(secondValue) && !isNullOrUndefined(secondOperator)) {\n fColl.push({\n field: field,\n predicate: predicate,\n matchCase: matchCase,\n ignoreAccent: ignoreAccent,\n operator: secondOperator,\n value: arg.arg8,\n type: this.options.type\n });\n mPredicate = mPredicate[\"\" + predicate](field, secondOperator.toLowerCase(), secondValue, !matchCase, ignoreAccent);\n }\n var args = {\n action: 'filtering', filterCollection: fColl, field: this.options.field,\n ejpredicate: mPredicate, actualPredicate: fColl\n };\n if (this.isForeignColumn(col)) {\n this.foreignKeyFilter(args, fColl, mPredicate);\n }\n else {\n this.options.handler(args);\n }\n };\n // eslint-disable-next-line max-len\n ExcelFilterBase.prototype.renderOperatorUI = function (column, table, elementID, predicates, isFirst) {\n var fieldElement = this.parent.createElement('tr', { className: 'e-xlfl-fields', attrs: { role: 'row' } });\n table.appendChild(fieldElement);\n var xlfloptr = this.parent.createElement('td', { className: 'e-xlfl-optr' });\n fieldElement.appendChild(xlfloptr);\n var optrDiv = this.parent.createElement('div', { className: 'e-xlfl-optrdiv' });\n var isComplex = !isNullOrUndefined(column) && isComplexField(column);\n var complexFieldName = !isNullOrUndefined(column) && getComplexFieldID(column);\n var optrInput = this.parent\n .createElement('input', { id: isComplex ? complexFieldName + elementID : column + elementID });\n optrDiv.appendChild(optrInput);\n xlfloptr.appendChild(optrDiv);\n var optr = this.options.type + 'Operator';\n var dropDatasource = this.customFilterOperators[\"\" + optr];\n this.optrData = dropDatasource;\n var selectedValue = this.dropSelectedVal(this.options.column, predicates, isFirst);\n //Trailing three dots are sliced.\n var menuText = '';\n if (this.menuItem) {\n menuText = this.menuItem.text.slice(0, -3);\n if (menuText !== this.getLocalizedLabel('CustomFilter')) {\n selectedValue = isFirst ? menuText : undefined;\n }\n if (menuText === this.getLocalizedLabel('Between')) {\n selectedValue = this.getLocalizedLabel(isFirst ? 'GreaterThanOrEqual' : 'LessThanOrEqual');\n }\n }\n var col = this.options.column;\n var dropOptr = new DropDownList(extend({\n dataSource: dropDatasource,\n fields: { text: 'text', value: 'value' },\n text: selectedValue,\n enableRtl: this.parent.enableRtl,\n cssClass: this.parent.cssClass ? this.parent.cssClass : null\n }, col.filter.params));\n this.childRefs.unshift(dropOptr);\n var evt = { 'open': this.dropDownOpen.bind(this), 'change': this.dropDownValueChange.bind(this) };\n registerEventHandlers(optrInput.id, [literals.open, literals.change], evt, this);\n dropOptr.addEventListener(literals['open'], this.eventHandlers[optrInput.id][literals.open]);\n dropOptr.addEventListener(literals.change, this.eventHandlers[optrInput.id][literals.change]);\n dropOptr.appendTo(optrInput);\n var operator = this.getSelectedValue(selectedValue);\n return { fieldElement: fieldElement, operator: operator };\n };\n ExcelFilterBase.prototype.removeHandlersFromComponent = function (component) {\n if (component.element.classList.contains('e-dropdownlist')) {\n removeEventHandlers(component, [literals.open, literals.change], this);\n }\n else if (component.element.classList.contains('e-autocomplete')) {\n removeEventHandlers(component, [events.actionComplete, literals.focus], this);\n }\n };\n ExcelFilterBase.prototype.dropDownOpen = function (args) {\n args.popup.element.style.zIndex = (this.dialogObj.zIndex + 1).toString();\n };\n ExcelFilterBase.prototype.dropDownValueChange = function (args) {\n if (args.element.id.includes('-xlfl-frstoptr')) {\n this.firstOperator = args.value.toString();\n }\n else {\n this.secondOperator = args.value.toString();\n }\n var valInput = args.element.closest('.e-xlfl-fields').children[1].querySelector('.e-control');\n var dropDownList = args.element['ej2_instances'][0];\n if (dropDownList.value === 'isempty' || dropDownList.value === 'isnotempty' ||\n dropDownList.value === 'isnull' || dropDownList.value === 'isnotnull') {\n valInput['ej2_instances'][0]['enabled'] = false;\n }\n else if (!isNullOrUndefined(valInput.getAttribute('disabled'))) {\n valInput['ej2_instances'][0]['enabled'] = true;\n }\n };\n /**\n * @hidden\n * @returns {FilterUI} returns filter UI\n */\n ExcelFilterBase.prototype.getFilterUIInfo = function () {\n return { firstOperator: this.firstOperator, secondOperator: this.secondOperator, field: this.options.field };\n };\n ExcelFilterBase.prototype.getSelectedValue = function (text) {\n var selectedField = new DataManager(this.optrData).executeLocal(new Query().where('text', 'equal', text));\n return !isNullOrUndefined(selectedField[0]) ? selectedField[0].value : '';\n };\n ExcelFilterBase.prototype.dropSelectedVal = function (col, predicates, isFirst) {\n var operator;\n if (predicates && predicates.length > 0) {\n operator = predicates.length === 2 ?\n (isFirst ? predicates[0].operator : predicates[1].operator) :\n (isFirst ? predicates[0].operator : undefined);\n }\n else if (isFirst && col.type === 'string' && !col.filter.operator) {\n operator = 'startswith';\n }\n else {\n operator = isFirst ? col.filter.operator || 'equal' : undefined;\n }\n return this.getSelectedText(operator);\n };\n ExcelFilterBase.prototype.getSelectedText = function (operator) {\n var selectedField = new DataManager(this.optrData).executeLocal(new Query().where('value', 'equal', operator));\n return !isNullOrUndefined(selectedField[0]) ? selectedField[0].text : '';\n };\n ExcelFilterBase.prototype.renderFilterUI = function (column, dlgConetntEle) {\n var predicates = this.existingPredicate[\"\" + column];\n var table = this.parent.createElement('table', { className: 'e-xlfl-table', attrs: { role: 'grid' } });\n dlgConetntEle.appendChild(table);\n var colGroup = this.parent.createElement(literals.colGroup);\n colGroup.innerHTML = '';\n table.appendChild(colGroup);\n //Renders first dropdown\n var optr = this.renderOperatorUI(column, table, '-xlfl-frstoptr', predicates, true);\n this.firstOperator = optr.operator;\n //Renders first value\n this.renderFlValueUI(column, optr, '-xlfl-frstvalue', predicates, true);\n var predicate = this.parent.createElement('tr', { className: 'e-xlfl-predicate', attrs: { role: 'row' } });\n table.appendChild(predicate);\n //Renders first radion button\n this.renderRadioButton(column, predicate, predicates);\n //Renders second dropdown\n optr = this.renderOperatorUI(column, table, '-xlfl-secndoptr', predicates, false);\n this.secondOperator = optr.operator;\n //Renders second text box\n this.renderFlValueUI(column, optr, '-xlfl-secndvalue', predicates, false);\n };\n ExcelFilterBase.prototype.renderRadioButton = function (column, tr, predicates) {\n var td = this.parent.createElement('td', { className: 'e-xlfl-radio', attrs: { 'colSpan': '2' } });\n tr.appendChild(td);\n var radioDiv = this.parent\n .createElement('div', { className: 'e-xlfl-radiodiv', attrs: { 'style': 'display: inline-block' } });\n var isComplex = !isNullOrUndefined(column) && isComplexField(column);\n var complexFieldName = !isNullOrUndefined(column) && getComplexFieldID(column);\n var frstpredicate = this.parent.createElement('input', { id: isComplex ? complexFieldName + 'e-xlfl-frstpredicate' : column + 'e-xlfl-frstpredicate', attrs: { 'type': 'radio' } });\n var secndpredicate = this.parent.createElement('input', { id: isComplex ? complexFieldName + 'e-xlfl-secndpredicate' : column + 'e-xlfl-secndpredicate', attrs: { 'type': 'radio' } });\n //appends into div\n radioDiv.appendChild(frstpredicate);\n radioDiv.appendChild(secndpredicate);\n td.appendChild(radioDiv);\n if (this.options.type === 'string') {\n this.renderMatchCase(column, tr, td, '-xlflmtcase', predicates);\n }\n // Initialize AND RadioButton component.\n var andRadio = new RadioButton({\n label: this.getLocalizedLabel('AND'),\n name: 'default', checked: true,\n enableRtl: this.parent.enableRtl,\n cssClass: this.parent.cssClass ? this.parent.cssClass : ''\n });\n this.childRefs.unshift(andRadio);\n // Initialize OR RadioButton component.\n var orRadio = new RadioButton({\n label: this.getLocalizedLabel('OR'),\n name: 'default',\n enableRtl: this.parent.enableRtl,\n cssClass: this.parent.cssClass ? this.parent.cssClass : ''\n });\n this.childRefs.unshift(orRadio);\n var flValue = predicates && predicates.length === 2 ? predicates[1].predicate : 'and';\n if (flValue === 'and') {\n andRadio.checked = true;\n orRadio.checked = false;\n }\n else {\n orRadio.checked = true;\n andRadio.checked = false;\n }\n // Render initialized RadioButton.\n andRadio.appendTo(frstpredicate);\n orRadio.appendTo(secndpredicate);\n andRadio.element.nextElementSibling.classList.add('e-xlfl-radio-and');\n orRadio.element.nextElementSibling.classList.add('e-xlfl-radio-or');\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ExcelFilterBase.prototype.removeObjects = function (elements) {\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var obj = elements_1[_i];\n if (obj && !obj.isDestroyed) {\n this.removeHandlersFromComponent(obj);\n obj.destroy();\n }\n }\n };\n // eslint-disable-next-line max-len\n ExcelFilterBase.prototype.renderFlValueUI = function (column, optr, elementId, predicates, isFirst) {\n var value = this.parent.createElement('td', { className: 'e-xlfl-value' });\n optr.fieldElement.appendChild(value);\n var isComplex = !isNullOrUndefined(column) && isComplexField(column);\n var complexFieldName = !isNullOrUndefined(column) && getComplexFieldID(column);\n var valueDiv = this.parent.createElement('div', { className: 'e-xlfl-valuediv' });\n var isFilteredCol = this.options.filteredColumns.some(function (col) { return column === col.field; });\n var fltrPredicates = this.options.filteredColumns.filter(function (col) { return col.field === column; });\n if (this.options.column.filterTemplate) {\n var data = {};\n var columnObj = this.options.column;\n if (isFilteredCol && elementId) {\n data = this.getExcelFilterData(elementId, data, columnObj, predicates, fltrPredicates);\n }\n var isReactCompiler = this.parent.isReact && typeof (this.options.column.filterTemplate) !== 'string';\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.parent.parentDetails.parentInstObj.isReact;\n var tempID = this.parent.element.id + columnObj.uid + 'filterTemplate';\n if (isReactCompiler || isReactChild) {\n this.options.column.getFilterTemplate()(data, this.parent, 'filterTemplate', tempID, null, null, valueDiv);\n }\n else {\n var element = this.options.column.getFilterTemplate()(data, this.parent, 'filterTemplate', tempID);\n appendChildren(valueDiv, element);\n }\n if (isReactCompiler || isReactChild) {\n this.parent.renderTemplates(function () {\n valueDiv.querySelector('input').id = isComplex ? complexFieldName + elementId : column + elementId;\n value.appendChild(valueDiv);\n });\n }\n else {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (this.parent.isAngular ? valueDiv.children[0] : valueDiv.querySelector('input')).id = isComplex ?\n complexFieldName + elementId : column + elementId;\n value.appendChild(valueDiv);\n }\n }\n else {\n var valueInput = this.parent\n .createElement('input', { id: isComplex ? complexFieldName + elementId : column + elementId });\n valueDiv.appendChild(valueInput);\n value.appendChild(valueDiv);\n var flValue = void 0;\n var predicate = void 0;\n if (predicates && predicates.length > 0) {\n predicate = predicates.length === 2 ?\n (isFirst ? predicates[0] : predicates[1]) :\n (isFirst ? predicates[0] : undefined);\n flValue = (predicate && predicate.operator === optr.operator) ? predicate.value : undefined;\n if (isNullOrUndefined(flValue)) {\n flValue = undefined;\n }\n }\n var types = {\n 'string': this.renderAutoComplete.bind(this),\n 'number': this.renderNumericTextBox.bind(this),\n 'date': this.renderDate.bind(this),\n 'dateonly': this.renderDate.bind(this),\n 'datetime': this.renderDateTime.bind(this)\n };\n types[this.options.type](this.options, column, valueInput, flValue, this.parent.enableRtl);\n }\n };\n ExcelFilterBase.prototype.getExcelFilterData = function (elementId, data, columnObj, predicates, fltrPredicates) {\n var predIndex = elementId === '-xlfl-frstvalue' ? 0 : 1;\n if (elementId === '-xlfl-frstvalue' || fltrPredicates.length > 1) {\n data = { column: predicates instanceof Array ? predicates[parseInt(predIndex.toString(), 10)] : predicates };\n var indx = this.options.column.columnData && fltrPredicates.length > 1 ?\n (this.options.column.columnData.length === 1 ? 0 : 1) : predIndex;\n data[this.options.field] = columnObj.foreignKeyValue ?\n this.options.column.columnData[parseInt(indx.toString(), 10)][columnObj.foreignKeyValue] :\n fltrPredicates[parseInt(indx.toString(), 10)].value;\n if (this.options.foreignKeyValue) {\n data[this.options.foreignKeyValue] = this.options.column\n .columnData[parseInt(indx.toString(), 10)][columnObj.foreignKeyValue];\n }\n }\n return data;\n };\n // eslint-disable-next-line max-len\n ExcelFilterBase.prototype.renderMatchCase = function (column, tr, matchCase, elementId, predicates) {\n var matchCaseDiv = this.parent.createElement('div', { className: 'e-xlfl-matchcasediv', attrs: { 'style': 'display: inline-block' } });\n var isComplex = !isNullOrUndefined(column) && isComplexField(column);\n var complexFieldName = !isNullOrUndefined(column) && getComplexFieldID(column);\n var matchCaseInput = this.parent.createElement('input', { id: isComplex ? complexFieldName + elementId : column + elementId, attrs: { 'type': 'checkbox' } });\n matchCaseDiv.appendChild(matchCaseInput);\n matchCase.appendChild(matchCaseDiv);\n var flValue = predicates && predicates.length > 0 ?\n (predicates && predicates.length === 2 ? predicates[1].matchCase : predicates[0].matchCase) :\n false;\n // Initialize Match Case check box.\n var checkbox = new CheckBox({\n label: this.getLocalizedLabel('MatchCase'),\n enableRtl: this.parent.enableRtl, checked: flValue,\n cssClass: this.parent.cssClass ? this.parent.cssClass : ''\n });\n this.childRefs.unshift(checkbox);\n // Render initialized CheckBox.\n checkbox.appendTo(matchCaseInput);\n };\n // eslint-disable-next-line max-len\n ExcelFilterBase.prototype.renderDate = function (options, column, inputValue, fValue, isRtl) {\n var format = getCustomDateFormat(options.format, options.type) || options.format;\n var datePicker = new DatePicker(extend({\n format: format,\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n placeholder: this.getLocalizedLabel('CustomFilterDatePlaceHolder'),\n width: '100%',\n enableRtl: isRtl,\n value: new Date(fValue),\n locale: this.parent.locale\n }, options.column.filter.params));\n this.childRefs.unshift(datePicker);\n datePicker.appendTo(inputValue);\n };\n // eslint-disable-next-line max-len\n ExcelFilterBase.prototype.renderDateTime = function (options, column, inputValue, fValue, isRtl) {\n var format = getCustomDateFormat(options.format, options.type);\n var dateTimePicker = new DateTimePicker(extend({\n format: format,\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n placeholder: this.getLocalizedLabel('CustomFilterDatePlaceHolder'),\n width: '100%',\n enableRtl: isRtl,\n value: new Date(fValue),\n locale: this.parent.locale\n }, options.column.filter.params));\n this.childRefs.unshift(dateTimePicker);\n dateTimePicker.appendTo(inputValue);\n };\n ExcelFilterBase.prototype.completeAction = function (e) {\n e.result = distinctStringValues(e.result);\n };\n // eslint-disable-next-line max-len\n ExcelFilterBase.prototype.renderNumericTextBox = function (options, column, inputValue, fValue, isRtl) {\n var numericTextBox = new NumericTextBox(extend({\n format: options.format,\n placeholder: this.getLocalizedLabel('CustomFilterPlaceHolder'),\n enableRtl: isRtl,\n value: fValue,\n locale: this.parent.locale,\n cssClass: this.parent.cssClass ? this.parent.cssClass : null\n }, options.column.filter.params));\n this.childRefs.unshift(numericTextBox);\n numericTextBox.appendTo(inputValue);\n };\n // eslint-disable-next-line max-len\n ExcelFilterBase.prototype.renderAutoComplete = function (options, column, inputValue, fValue, isRtl) {\n var colObj = this.options.column;\n var isForeignColumn = this.isForeignColumn(colObj);\n var dataSource = isForeignColumn ? colObj.dataSource : options.dataSource;\n var fields = { value: isForeignColumn ? colObj.foreignKeyValue : column };\n var actObj = new AutoComplete(extend({\n dataSource: dataSource instanceof DataManager ? dataSource : new DataManager(dataSource),\n fields: fields,\n query: this.getQuery(),\n sortOrder: 'Ascending',\n locale: this.parent.locale,\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n autofill: true,\n placeholder: this.getLocalizedLabel('CustomFilterPlaceHolder'),\n enableRtl: isRtl,\n text: fValue\n }, colObj.filter.params));\n if (dataSource && 'result' in dataSource) {\n var defObj = eventPromise({ requestType: 'stringfilterrequest' }, this.getQuery());\n this.parent.trigger(events.dataStateChange, defObj.state);\n var def = defObj.deffered;\n def.promise.then(function (e) {\n actObj.dataSource = new DataManager(e);\n });\n }\n this.childRefs.unshift(actObj);\n var evt = { 'actionComplete': this.acActionComplete(actObj, column), 'focus': this.acFocus(actObj, column, options, inputValue) };\n registerEventHandlers(inputValue.id, [events.actionComplete, literals.focus], evt, this);\n actObj.addEventListener(literals.focus, this.eventHandlers[inputValue.id][literals.focus]);\n actObj.addEventListener(events.actionComplete, this.eventHandlers[inputValue.id][events.actionComplete]);\n actObj.appendTo(inputValue);\n };\n ExcelFilterBase.prototype.acActionComplete = function (actObj, column) {\n return function (e) {\n var isComplex = !isNullOrUndefined(column) && isComplexField(column);\n e.result = e.result.filter(function (obj, index, arr) {\n return arr.map(function (mapObject) {\n return isComplex ? performComplexDataOperation(actObj.fields.value, mapObject)\n : mapObject[actObj.fields.value];\n }).indexOf(isComplex ? performComplexDataOperation(actObj.fields.value, obj) :\n obj[actObj.fields.value]) === index;\n });\n };\n };\n ExcelFilterBase.prototype.acFocus = function (actObj, column, options, inputValue) {\n var _this = this;\n return function () {\n var isComplex = !isNullOrUndefined(column) && isComplexField(column);\n var complexFieldName = !isNullOrUndefined(column) && getComplexFieldID(column);\n var columnvalue = isComplex ? complexFieldName : column;\n actObj.filterType = _this.dlgDiv.querySelector('#' + columnvalue +\n (inputValue.id === (columnvalue + '-xlfl-frstvalue') ?\n '-xlfl-frstoptr' :\n '-xlfl-secndoptr')).ej2_instances[0].value;\n actObj.ignoreCase = options.type === 'string' ?\n !_this.dlgDiv.querySelector('#' + columnvalue + '-xlflmtcase').ej2_instances[0].checked :\n true;\n actObj.filterType = !isNullOrUndefined(actObj.filterType) ? actObj.filterType :\n 'equal';\n };\n };\n return ExcelFilterBase;\n}(CheckBoxFilterBase));\nexport { ExcelFilterBase };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { isNullOrUndefined, getValue, closest } from '@syncfusion/ej2-base';\nimport { attributes } from '@syncfusion/ej2-base';\nimport { CellRenderer } from './cell-renderer';\nimport { Input } from '@syncfusion/ej2-inputs';\nimport { appendChildren, addStickyColumnPosition } from '../base/util';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport * as events from '../base/constant';\n/**\n * FilterCellRenderer class which responsible for building filter cell.\n *\n * @hidden\n */\nvar FilterCellRenderer = /** @class */ (function (_super) {\n __extends(FilterCellRenderer, _super);\n function FilterCellRenderer() {\n var _this = _super !== null && _super.apply(this, arguments) || this;\n _this.element = _this.parent.createElement('TH', { className: 'e-filterbarcell', attrs: { role: 'columnheader' } });\n return _this;\n }\n /**\n * Function to return the wrapper for the TH content.\n *\n * @returns {string} returns the gui\n */\n FilterCellRenderer.prototype.getGui = function () {\n return this.parent.createElement('div');\n };\n /**\n * Function to render the cell content based on Column object.\n *\n * @param {Cell} cell\n * @param {Object} data\n */\n /* tslint:disable-next-line:max-func-body-length */\n FilterCellRenderer.prototype.render = function (cell, data) {\n var tr = this.parent.element.querySelector('.e-filterbar');\n var node = this.element.cloneNode();\n var innerDIV = this.getGui();\n var input;\n var column = cell.column;\n tr.appendChild(node);\n node.setAttribute('e-mappinguid', column.uid);\n if (column.filterTemplate) {\n var fltrData = {};\n if (data) {\n fltrData[column.field] = data[column.field];\n }\n var col = 'column';\n fltrData[\"\" + col] = column;\n if (column.visible) {\n var isReactCompiler = this.parent.isReact && typeof (column.filterTemplate) !== 'string';\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n this.parent.parentDetails.parentInstObj.isReact;\n var tempID = this.parent.element.id + column.uid + 'filterTemplate';\n if (isReactCompiler || isReactChild) {\n column.getFilterTemplate()(fltrData, this.parent, 'filterTemplate', tempID, null, null, node);\n this.parent.renderTemplates();\n }\n else {\n var element = column.getFilterTemplate()(fltrData, this.parent, 'filterTemplate', tempID);\n appendChildren(node, element);\n }\n }\n else {\n node.classList.add('e-hide');\n }\n }\n else {\n if (column.type !== 'checkbox') {\n if ((isNullOrUndefined(column.allowFiltering) || column.allowFiltering) && !isNullOrUndefined(column.filterBarTemplate)) {\n node.classList.add('e-fltrtemp');\n attributes(innerDIV, {\n 'class': 'e-fltrtempdiv'\n });\n if (isNullOrUndefined(column.filterBarTemplate.create)) {\n input = this.parent.createElement('input', {\n id: column.field + '_filterBarcell', className: 'e-filterUi_input e-filtertext e-fltrTemp',\n attrs: { type: 'search', title: column.headerText }\n });\n innerDIV.appendChild(input);\n }\n else {\n var args = { column: column, node: Element };\n var temp = column.filterBarTemplate.create;\n if (typeof temp === 'string') {\n temp = getValue(temp, window);\n }\n input = temp(args);\n if (typeof input === 'string') {\n var div = this.parent.createElement('div');\n div.innerHTML = input;\n input = div.firstChild;\n }\n attributes(innerDIV, {\n class: 'e-filterUi_input e-filtertext e-fltrTemp',\n title: column.headerText,\n id: column.field + '_filterBarcell'\n });\n innerDIV.appendChild(input);\n }\n }\n else {\n attributes(innerDIV, {\n 'class': 'e-filterdiv e-fltrinputdiv'\n });\n input = this.parent.createElement('input', {\n id: column.field + '_filterBarcell', className: 'e-filtertext',\n attrs: {\n type: 'search', title: column.headerText + cell.attributes.title,\n value: data[cell.column.field] ? data[cell.column.field] : ''\n }\n });\n innerDIV.appendChild(input);\n var args = {\n element: input, floatLabelType: 'Never',\n properties: {\n enableRtl: this.parent.enableRtl, showClearButton: true, cssClass: this.parent.cssClass\n }\n };\n Input.createInput(args, this.parent.createElement);\n }\n //TODO: apply intial filtering\n if (column.allowFiltering === false || column.field === '' || isNullOrUndefined(column.field)) {\n input.setAttribute('disabled', 'true');\n input.classList.add('e-disable');\n }\n var clearIconElem = innerDIV.querySelector('.e-clear-icon');\n if (clearIconElem) {\n clearIconElem.setAttribute('title', this.parent.localeObj.getConstant('ClearButton'));\n }\n if (!column.visible) {\n node.classList.add('e-hide');\n }\n this.appendHtml(node, innerDIV);\n // render's the dropdownlist component if showFilterBarOperator sets to true\n if (this.parent.filterSettings.showFilterBarOperator && this.parent.filterSettings.type === 'FilterBar' &&\n !this.parent.isPrinting && isNullOrUndefined(column.filterTemplate) && isNullOrUndefined(column.filterBarTemplate)) {\n this.operatorIconRender(innerDIV, column, cell);\n }\n if ((isNullOrUndefined(column.allowFiltering) || column.allowFiltering) && !isNullOrUndefined(column.filterBarTemplate)) {\n var templateWrite = column.filterBarTemplate.write;\n var args = { element: input, column: column };\n if (typeof templateWrite === 'string') {\n templateWrite = getValue(templateWrite, window);\n }\n templateWrite.call(this, args);\n }\n }\n }\n if (this.parent.isFrozenGrid()) {\n addStickyColumnPosition(this.parent, column, node);\n }\n return node;\n };\n /**\n * Function to specifies how the result content to be placed in the cell.\n *\n * @param {Element} node - specifies the node\n * @param {string|Element} innerHtml - specifies the innerHTML\n * @returns {Element} retruns the element\n */\n FilterCellRenderer.prototype.appendHtml = function (node, innerHtml) {\n node.appendChild(innerHtml);\n return node;\n };\n FilterCellRenderer.prototype.operatorIconRender = function (innerDIV, column, cell) {\n var gObj = this.parent;\n var operators;\n var fbicon = this.parent.createElement('input', {\n className: ' e-filterbaroperator e-icons e-icon-filter',\n id: cell.column.uid\n });\n innerDIV.querySelector('span').appendChild(fbicon);\n if (column.filter && column.filter.operator) {\n operators = column.filter.operator;\n }\n else if (gObj.filterSettings.columns.length) {\n for (var i = 0, a = gObj.filterSettings.columns; i < a.length; i++) {\n var col = a[parseInt(i.toString(), 10)];\n if (col.field === column.field) {\n operators = col.operator;\n break;\n }\n else {\n operators = 'equal';\n }\n }\n }\n else {\n operators = 'equal';\n }\n if (!isNullOrUndefined(gObj.filterModule.operators[column.field])) {\n operators = gObj.filterModule.operators[column.field];\n }\n this.dropOptr = new DropDownList({\n fields: { text: 'text', value: 'value' },\n popupHeight: 'auto',\n value: operators,\n width: '0px',\n enabled: column.allowFiltering,\n popupWidth: 'auto',\n enableRtl: this.parent.enableRtl,\n change: this.internalEvent.bind(this),\n beforeOpen: function () {\n var operator = gObj.filterModule.customOperators;\n this.dataSource = operator[gObj.getColumnByUid(this.element.id).type + 'Operator'];\n for (var i = 0; i < this.dataSource.length; i++) {\n if (column.filter && column.filter.operator && isNullOrUndefined(gObj.filterModule.operators[column.field]) &&\n this.dataSource[parseInt(i.toString(), 10)].value === column.filter.operator) {\n this.value = column.filter.operator;\n }\n }\n },\n cssClass: this.parent.cssClass ? 'e-popup-flbar' + ' ' + this.parent.cssClass : 'e-popup-flbar'\n });\n this.dropOptr.appendTo(fbicon);\n var spanElmt = closest(this.dropOptr.element, 'span');\n spanElmt.classList.add('e-filterbardropdown');\n spanElmt.removeAttribute('tabindex');\n };\n FilterCellRenderer.prototype.internalEvent = function (e) {\n var gObj = this.parent;\n var col = gObj.getColumnByUid(e.element.getAttribute('id'));\n e.column = col;\n gObj.filterModule.operators[col.field] = e.value;\n gObj.notify(events.getFilterBarOperator, e);\n };\n return FilterCellRenderer;\n}(CellRenderer));\nexport { FilterCellRenderer };\n","import { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport { isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { Query, DataManager } from '@syncfusion/ej2-data';\nimport * as events from '../base/constant';\nimport * as literals from '../base/string-literals';\n/**\n * `filter operators` render boolean column.\n *\n * @hidden\n */\nvar FlMenuOptrUI = /** @class */ (function () {\n function FlMenuOptrUI(parent, customFltrOperators, serviceLocator, filterSettings) {\n this.ddOpen = this.dropDownOpen.bind(this);\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n this.filterSettings = filterSettings;\n this.customFilterOperators = customFltrOperators;\n if (this.parent) {\n this.parent.on(events.filterMenuClose, this.destroyDropDownList, this);\n this.parent.on(events.destroy, this.destroyDropDownList, this);\n }\n }\n /**\n * @param {Element} dlgConetntEle - specifies the content element\n * @param {Element} target - specifies the target\n * @param {Column} column - specifies the column\n * @param {Dialog} dlgObj - specifies the dialog\n * @param {Object[]} operator - specifies the operator list\n * @returns {void}\n * @hidden\n */\n // eslint-disable-next-line max-len\n FlMenuOptrUI.prototype.renderOperatorUI = function (dlgConetntEle, target, column, dlgObj, operator) {\n this.dialogObj = dlgObj;\n var optr = column.type + 'Operator';\n this.optrData = this.customOptr = !isNullOrUndefined(operator) ? operator :\n (!isNullOrUndefined(this.parent.filterSettings.operators) && !isNullOrUndefined(this.parent.filterSettings.operators[\"\" + optr])) ?\n this.parent.filterSettings.operators[\"\" + optr] : this.customFilterOperators[\"\" + optr];\n var dropDatasource = this.customOptr;\n var selectedValue = this.dropSelectedVal(column, optr);\n var optrDiv = this.parent.createElement('div', { className: 'e-flm_optrdiv' });\n dlgConetntEle.appendChild(optrDiv);\n var optrInput = this.parent.createElement('input', { id: column.uid + '-floptr' });\n optrDiv.appendChild(optrInput);\n this.dropOptr = new DropDownList({\n dataSource: dropDatasource,\n fields: { text: 'text', value: 'value' },\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n enableRtl: this.parent.enableRtl,\n text: selectedValue,\n // eslint-disable-next-line @typescript-eslint/tslint/config\n change: function () {\n var valInput = document.querySelector('.e-flmenu-valuediv').querySelector('input');\n if (this.value === 'isempty' || this.value === 'isnotempty' ||\n this.value === 'isnull' || this.value === 'isnotnull') {\n valInput['ej2_instances'][0]['enabled'] = false;\n }\n else if (!isNullOrUndefined(valInput.getAttribute('disabled'))) {\n valInput['ej2_instances'][0]['enabled'] = true;\n }\n }\n });\n this.dropOptr.addEventListener(literals['open'], this.ddOpen);\n this.dropOptr.appendTo('#' + column.uid + '-floptr');\n };\n FlMenuOptrUI.prototype.renderResponsiveDropDownList = function (args) {\n args.popup.element.style.width = '100%';\n };\n FlMenuOptrUI.prototype.dropDownOpen = function (args) {\n args.popup.element.style.zIndex = (this.dialogObj.zIndex + 1).toString();\n if (this.parent.enableAdaptiveUI) {\n this.renderResponsiveDropDownList(args);\n }\n };\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n FlMenuOptrUI.prototype.dropSelectedVal = function (col, optr) {\n var selValue = '';\n var columns = this.parent.filterSettings.columns;\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var column = columns_1[_i];\n if (col.field === column.field || (col.isForeignColumn() && col.foreignKeyValue === column.field)) {\n var selectedField = new DataManager(this.optrData).executeLocal(new Query().where('value', 'equal', column.operator));\n selValue = !isNullOrUndefined(selectedField[0]) ? selectedField[0].text : '';\n }\n }\n if (selValue === '') { // rewuired or not\n if (col.filter.operator) {\n var optrLen = Object.keys(this.optrData).length;\n for (var i = 0; i < optrLen; i++) {\n if (this.optrData[parseInt(i.toString(), 10)].value === col.filter.operator) {\n selValue = this.optrData[parseInt(i.toString(), 10)].text;\n }\n }\n }\n else {\n selValue = this.optrData[0].text;\n }\n }\n return selValue;\n };\n /**\n * @returns {string} returns the operator\n * @hidden\n */\n FlMenuOptrUI.prototype.getFlOperator = function () {\n return this.dropOptr.value;\n };\n FlMenuOptrUI.prototype.destroyDropDownList = function () {\n if (this.dropOptr.isDestroyed) {\n return;\n }\n this.dropOptr.removeEventListener(literals['open'], this.ddOpen);\n this.dropOptr.destroy();\n this.parent.off(events.filterMenuClose, this.destroyDropDownList);\n this.parent.off(events.destroy, this.destroyDropDownList);\n };\n return FlMenuOptrUI;\n}());\nexport { FlMenuOptrUI };\n","import { AutoComplete } from '@syncfusion/ej2-dropdowns';\nimport { DataManager, Query, Predicate } from '@syncfusion/ej2-data';\nimport { Browser, isNullOrUndefined, extend, getValue } from '@syncfusion/ej2-base';\nimport { getZIndexCalcualtion, eventPromise } from '../base/util';\nimport * as events from '../base/constant';\nimport * as literals from '../base/string-literals';\nimport { CheckBoxFilterBase } from '../common/checkbox-filter-base';\n/**\n * `string filterui` render string column.\n *\n * @hidden\n */\nvar StringFilterUI = /** @class */ (function () {\n function StringFilterUI(parent, serviceLocator, filterSettings) {\n this.parent = parent;\n this.serLocator = serviceLocator;\n this.filterSettings = filterSettings;\n if (this.parent) {\n this.parent.on(events.filterMenuClose, this.destroy, this);\n this.parent.on(events.destroy, this.destroy, this);\n }\n }\n StringFilterUI.prototype.create = function (args) {\n this.instance = this.parent.createElement('input', { className: 'e-flmenu-input', id: 'strui-' + args.column.uid });\n args.target.appendChild(this.instance);\n this.dialogObj = args.dialogObj;\n this.processDataOperation(args);\n };\n StringFilterUI.prototype.processDataOperation = function (args) {\n var _this = this;\n if (args.column.isForeignColumn()) {\n this.parent.getDataModule().dataManager.executeQuery(this.parent.getDataModule().generateQuery(true))\n .then(function (result) { _this.getAutoCompleteOptions(args, result); });\n return;\n }\n this.getAutoCompleteOptions(args);\n };\n StringFilterUI.prototype.getAutoCompleteOptions = function (args, result) {\n var isForeignColumn = args.column.isForeignColumn();\n var foreignColumnQuery;\n if (isForeignColumn) {\n var filteredData = CheckBoxFilterBase.getDistinct(result.result, args.column.field)\n .records || [];\n var filterQuery = void 0;\n for (var i = 0; i < filteredData.length; i++) {\n if (filterQuery) {\n filterQuery = filterQuery.or(args.column.field, 'contains', filteredData[parseInt(i.toString(), 10)][args.column.field], this.parent\n .filterSettings.enableCaseSensitivity, this.parent.filterSettings.ignoreAccent);\n }\n else {\n filterQuery = new Predicate(args.column.field, 'contains', filteredData[parseInt(i.toString(), 10)][args.column.field], this.parent\n .filterSettings.enableCaseSensitivity, this.parent.filterSettings.ignoreAccent);\n }\n }\n foreignColumnQuery = new Query().where(filterQuery);\n foreignColumnQuery.params = this.parent.query.params;\n }\n var dataSource = isForeignColumn ? args.column.dataSource : this.parent.dataSource;\n var fields = { value: isForeignColumn ? args.column.foreignKeyValue : args.column.field };\n var autoComplete = new AutoComplete(extend({\n dataSource: dataSource instanceof DataManager ? dataSource : new DataManager(dataSource),\n fields: fields,\n locale: this.parent.locale,\n enableRtl: this.parent.enableRtl,\n query: isForeignColumn ? foreignColumnQuery : this.parent.getDataModule().generateQuery(true, true),\n sortOrder: 'Ascending',\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n autofill: true,\n placeholder: args.localizeText.getConstant('EnterValue'),\n actionBegin: function () {\n if (this.query.queries.length && this.query.queries[0].fn === 'onWhere' && this.query.queries[0].e\n && this.query.queries[0].e.predicates) {\n for (var i = 0; i < this.query.queries[0].e.predicates.length; i++) {\n if (this.properties.fields.value === this.query.queries[0].e.predicates[\"\" + i].field) {\n this.query.queries[0].e.predicates.splice(i, 1);\n i = i - 1;\n }\n }\n if (!this.query.queries[0].e.predicates.length) {\n this.query.queries.splice(0, 1);\n }\n }\n }\n }, args.column.filter.params));\n this.acFocus = this.focus(autoComplete, args);\n this.acComplete = this.actionComplete(autoComplete);\n this.acOpen = this.openPopup.bind(this);\n autoComplete.addEventListener(literals.focus, this.acFocus);\n autoComplete.addEventListener(literals['open'], this.acOpen);\n autoComplete.addEventListener(events.actionComplete, this.acComplete);\n if (dataSource && 'result' in dataSource) {\n var query = this.parent.getQuery ? this.parent.getQuery().clone() : new Query();\n var defObj = eventPromise({ requestType: 'stringfilterrequest' }, query);\n this.parent.trigger(events.dataStateChange, defObj.state);\n var def = defObj.deffered;\n def.promise.then(function (e) {\n autoComplete.dataSource = new DataManager(e);\n });\n }\n this.actObj = autoComplete;\n this.actObj.appendTo(this.instance);\n if (isForeignColumn) {\n this.parent.filterModule.filterModule.afterRenderFilterUI();\n }\n };\n StringFilterUI.prototype.write = function (args) {\n if (args.filteredValue !== '' && !isNullOrUndefined(args.filteredValue)) {\n var struiObj = document.querySelector('#strui-' + args.column.uid).ej2_instances[0];\n struiObj.value = args.filteredValue;\n }\n };\n StringFilterUI.prototype.read = function (element, column, filterOptr, filterObj) {\n var actuiObj = document.querySelector('#strui-' + column.uid).ej2_instances[0];\n if (Browser.isDevice) {\n actuiObj.hidePopup();\n actuiObj.focusOut();\n }\n var filterValue = actuiObj.value;\n if (isNullOrUndefined(filterValue) || filterValue === '') {\n filterValue = null;\n }\n filterObj.filterByColumn(column.field, filterOptr, filterValue, 'and', this.parent.filterSettings.enableCaseSensitivity);\n };\n StringFilterUI.prototype.openPopup = function (args) {\n getZIndexCalcualtion(args, this.dialogObj);\n };\n StringFilterUI.prototype.focus = function (actObj, args) {\n return function () {\n actObj.filterType = args.getOptrInstance.getFlOperator();\n };\n };\n StringFilterUI.prototype.actionComplete = function (actObj) {\n return function (e) {\n e.result = e.result.filter(function (obj, index, arr) {\n return arr.map(function (mapObj) {\n return (getValue(actObj.fields.value, mapObj));\n }).indexOf(getValue((actObj.fields.value), obj)) === index;\n });\n };\n };\n StringFilterUI.prototype.destroy = function () {\n if (!this.actObj || this.actObj.isDestroyed) {\n return;\n }\n this.actObj.removeEventListener(literals.focus, this.acFocus);\n this.actObj.removeEventListener(literals['open'], this.acOpen);\n this.actObj.removeEventListener(events.actionComplete, this.acComplete);\n this.actObj.destroy();\n this.parent.off(events.filterMenuClose, this.destroy);\n this.parent.off(events.destroy, this.destroy);\n };\n return StringFilterUI;\n}());\nexport { StringFilterUI };\n","import { NumericTextBox } from '@syncfusion/ej2-inputs';\nimport { extend, isUndefined } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\n/**\n * `numberfilterui` render number column.\n *\n * @hidden\n */\nvar NumberFilterUI = /** @class */ (function () {\n function NumberFilterUI(parent, serviceLocator, filterSettings) {\n this.filterSettings = filterSettings;\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n if (this.parent) {\n this.parent.on(events.filterMenuClose, this.destroy, this);\n this.parent.on(events.destroy, this.destroy, this);\n }\n }\n NumberFilterUI.prototype.keyEventHandler = function (args) {\n if (args.keyCode === 13 || args.keyCode === 9) {\n var evt = document.createEvent('HTMLEvents');\n evt.initEvent('change', false, true);\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n this.dispatchEvent(evt);\n }\n };\n NumberFilterUI.prototype.create = function (args) {\n this.instance = this.parent.createElement('input', { className: 'e-flmenu-input', id: 'numberui-' + args.column.uid });\n args.target.appendChild(this.instance);\n this.numericTxtObj = new NumericTextBox(extend({\n format: typeof (args.column.format) === 'string' || isUndefined(args.column.format) ? args.column.format :\n args.column.format.format,\n locale: this.parent.locale,\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n placeholder: args.localizeText.getConstant('EnterValue'),\n enableRtl: this.parent.enableRtl\n }, args.column.filter.params));\n this.numericTxtObj.appendTo(this.instance);\n };\n NumberFilterUI.prototype.write = function (args) {\n var numberuiObj = document.querySelector('#numberui-' + args.column.uid).ej2_instances[0];\n numberuiObj.element.addEventListener('keydown', this.keyEventHandler);\n numberuiObj.value = args.filteredValue;\n };\n NumberFilterUI.prototype.read = function (element, column, filterOptr, filterObj) {\n var numberuiObj = document.querySelector('#numberui-' + column.uid).ej2_instances[0];\n var filterValue = numberuiObj.value;\n filterObj.filterByColumn(column.field, filterOptr, filterValue, 'and', true);\n };\n NumberFilterUI.prototype.destroy = function () {\n if (!this.numericTxtObj || this.numericTxtObj.isDestroyed) {\n return;\n }\n this.numericTxtObj.destroy();\n this.parent.off(events.filterMenuClose, this.destroy);\n this.parent.off(events.destroy, this.destroy);\n };\n return NumberFilterUI;\n}());\nexport { NumberFilterUI };\n","import { getZIndexCalcualtion } from '../base/util';\nimport { Query, DataManager, DataUtil } from '@syncfusion/ej2-data';\nimport { DropDownList } from '@syncfusion/ej2-dropdowns';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport * as events from '../base/constant';\nimport * as literals from '../base/string-literals';\n/**\n * `boolfilterui` render boolean column.\n *\n * @hidden\n */\nvar BooleanFilterUI = /** @class */ (function () {\n function BooleanFilterUI(parent, serviceLocator, filterSettings) {\n this.parent = parent;\n this.serviceLocator = serviceLocator;\n this.filterSettings = filterSettings;\n if (this.parent) {\n this.parent.on(events.filterMenuClose, this.destroy, this);\n this.parent.on(events.destroy, this.destroy, this);\n }\n }\n BooleanFilterUI.prototype.create = function (args) {\n var isForeignColumn = args.column.isForeignColumn();\n var dataSource = isForeignColumn ? args.column.dataSource : this.parent.dataSource;\n var fields = isForeignColumn ? args.column.foreignKeyValue : args.column.field;\n this.elem = this.parent.createElement('input', { className: 'e-flmenu-input', id: 'bool-ui-' + args.column.uid });\n args.target.appendChild(this.elem);\n this.dialogObj = args.dialogObj;\n this.dropInstance = new DropDownList(extend({\n dataSource: dataSource instanceof DataManager ?\n dataSource : new DataManager(dataSource),\n query: new Query().select(fields),\n fields: { text: fields, value: fields },\n placeholder: args.localizeText.getConstant('SelectValue'),\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n locale: this.parent.locale,\n enableRtl: this.parent.enableRtl\n }, args.column.filter.params));\n this.ddOpen = this.openPopup.bind(this);\n this.ddComplete = this.actionComplete(fields);\n this.dropInstance.addEventListener(literals['open'], this.ddOpen);\n this.dropInstance.addEventListener(events.actionComplete, this.ddComplete);\n this.dropInstance.appendTo(this.elem);\n };\n BooleanFilterUI.prototype.write = function (args) {\n var drpuiObj = document.querySelector('#bool-ui-' + args.column.uid).ej2_instances[0];\n if (!isNullOrUndefined(args.filteredValue)) {\n drpuiObj.value = args.filteredValue;\n }\n };\n BooleanFilterUI.prototype.read = function (element, column, filterOptr, filterObj) {\n var drpuiObj = document.querySelector('#bool-ui-' + column.uid).ej2_instances[0];\n var filterValue = (drpuiObj.value);\n filterObj.filterByColumn(column.field, filterOptr, filterValue, 'and', false);\n };\n BooleanFilterUI.prototype.openPopup = function (args) {\n getZIndexCalcualtion(args, this.dialogObj);\n };\n BooleanFilterUI.prototype.actionComplete = function (fields) {\n return function (e) {\n e.result = DataUtil.distinct(e.result, fields, true);\n };\n };\n BooleanFilterUI.prototype.destroy = function () {\n if (!this.dropInstance || this.dropInstance.isDestroyed) {\n return;\n }\n this.dropInstance.removeEventListener(literals['open'], this.ddOpen);\n this.dropInstance.removeEventListener(events.actionComplete, this.ddComplete);\n this.dropInstance.destroy();\n this.parent.off(events.filterMenuClose, this.destroy);\n this.parent.off(events.destroy, this.destroy);\n };\n return BooleanFilterUI;\n}());\nexport { BooleanFilterUI };\n","import { DatePicker, DateTimePicker } from '@syncfusion/ej2-calendars';\nimport { isNullOrUndefined, extend } from '@syncfusion/ej2-base';\nimport { getCustomDateFormat } from '../base/util';\nimport * as events from '../base/constant';\nimport * as literals from '../base/string-literals';\n/**\n * `datefilterui` render date column.\n *\n * @hidden\n */\nvar DateFilterUI = /** @class */ (function () {\n function DateFilterUI(parent, serviceLocator, filterSettings) {\n this.dpOpen = this.openPopup.bind(this);\n this.parent = parent;\n this.locator = serviceLocator;\n this.fltrSettings = filterSettings;\n if (this.parent) {\n this.parent.on(events.filterMenuClose, this.destroy, this);\n this.parent.on(events.destroy, this.destroy, this);\n }\n }\n DateFilterUI.prototype.create = function (args) {\n var format = getCustomDateFormat(args.column.format, args.column.type);\n this.dialogObj = args.dialogObj;\n this.inputElem = this.parent.createElement('input', { className: 'e-flmenu-input', id: 'dateui-' + args.column.uid });\n args.target.appendChild(this.inputElem);\n if (args.column.type === 'date' || args.column.type === 'dateonly') {\n this.datePickerObj = new DatePicker(extend({\n format: format,\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n placeholder: args.localizeText.getConstant('ChooseDate'),\n width: '100%',\n locale: this.parent.locale,\n enableRtl: this.parent.enableRtl\n }, args.column.filter.params));\n }\n else if (args.column.type === 'datetime') {\n this.datePickerObj = new DateTimePicker(extend({\n format: format,\n cssClass: this.parent.cssClass ? 'e-popup-flmenu' + ' ' + this.parent.cssClass : 'e-popup-flmenu',\n placeholder: args.localizeText.getConstant('ChooseDate'),\n width: '100%',\n locale: this.parent.locale,\n enableRtl: this.parent.enableRtl\n }, args.column.filter.params));\n }\n this.datePickerObj.addEventListener(literals['open'], this.dpOpen);\n this.datePickerObj.appendTo(this.inputElem);\n };\n DateFilterUI.prototype.write = function (args) {\n var dateuiObj = document.querySelector('#dateui-' + args.column.uid).ej2_instances[0];\n dateuiObj.value = !isNullOrUndefined(args.filteredValue) ? new Date(args.filteredValue) : null;\n };\n DateFilterUI.prototype.read = function (element, column, filterOptr, filterObj) {\n var dateuiObj = document.querySelector('#dateui-' + column.uid).ej2_instances[0];\n var filterValue = dateuiObj.value;\n filterValue = isNullOrUndefined(filterValue) ? null : filterValue;\n filterObj.filterByColumn(column.field, filterOptr, filterValue, 'and', true);\n };\n DateFilterUI.prototype.openPopup = function (args) {\n args.popup.element.style.zIndex = (this.dialogObj.zIndex + 1).toString();\n };\n DateFilterUI.prototype.destroy = function () {\n this.parent.off(events.filterMenuClose, this.destroy);\n this.parent.off(events.destroy, this.destroy);\n if (isNullOrUndefined(this.datePickerObj) || this.datePickerObj.isDestroyed) {\n return;\n }\n this.datePickerObj.removeEventListener(literals['open'], this.dpOpen);\n this.datePickerObj.destroy();\n };\n return DateFilterUI;\n}());\nexport { DateFilterUI };\n","import { isNullOrUndefined, getValue, remove } from '@syncfusion/ej2-base';\nimport { Browser } from '@syncfusion/ej2-base';\nimport { Dialog } from '@syncfusion/ej2-popups';\nimport { FlMenuOptrUI } from './filter-menu-operator';\nimport { StringFilterUI } from './string-filter-ui';\nimport { NumberFilterUI } from './number-filter-ui';\nimport { BooleanFilterUI } from './boolean-filter-ui';\nimport { DateFilterUI } from './date-filter-ui';\nimport { getFilterMenuPostion, parentsUntil, appendChildren, clearReactVueTemplates } from '../base/util';\nimport * as events from '../base/constant';\nimport { CheckBoxFilterBase } from '../common/checkbox-filter-base';\n/**\n * `filter menu` render boolean column.\n *\n * @hidden\n */\nvar FilterMenuRenderer = /** @class */ (function () {\n function FilterMenuRenderer(parent, filterSettings, serviceLocator, customFltrOperators, fltrObj) {\n this.isDialogOpen = false;\n this.maxHeight = '350px';\n this.isMenuCheck = false;\n this.colTypes = {\n 'string': StringFilterUI, 'number': NumberFilterUI, 'date': DateFilterUI, 'dateonly': DateFilterUI, 'boolean': BooleanFilterUI, 'datetime': DateFilterUI\n };\n this.parent = parent;\n this.filterSettings = filterSettings;\n this.serviceLocator = serviceLocator;\n this.customFilterOperators = customFltrOperators;\n this.filterObj = fltrObj;\n this.flMuiObj = new FlMenuOptrUI(this.parent, this.customFilterOperators, this.serviceLocator);\n this.l10n = this.serviceLocator.getService('localization');\n this.menuFilterBase = new CheckBoxFilterBase(parent);\n }\n FilterMenuRenderer.prototype.clearCustomFilter = function (col) {\n this.clearBtnClick(col);\n };\n FilterMenuRenderer.prototype.applyCustomFilter = function (args) {\n this.filterBtnClick(args.col);\n };\n FilterMenuRenderer.prototype.openDialog = function (args) {\n this.options = args;\n this.col = this.parent.getColumnByField(args.field);\n if (isNullOrUndefined(this.col.filter) || (isNullOrUndefined(this.col.filter.type) || this.col.filter.type === 'Menu')) { ///\n this.renderDlgContent(args.target, this.col);\n }\n };\n FilterMenuRenderer.prototype.closeDialog = function (target) {\n if (!this.dlgObj) {\n return;\n }\n if (this.parent.isReact || this.parent.isVue) {\n clearReactVueTemplates(this.parent, ['filterTemplate']);\n }\n var elem = document.getElementById(this.dlgObj.element.id);\n if (this.dlgObj && !this.dlgObj.isDestroyed && elem) {\n var argument = { cancel: false, column: this.col, target: target, element: elem };\n this.parent.notify(events.filterMenuClose, argument);\n if (argument.cancel) {\n return;\n }\n this.isDialogOpen = false;\n if (this.isMenuCheck) {\n this.menuFilterBase.unWireEvents();\n this.parent.off(events.cBoxFltrComplete, this.actionComplete);\n this.isMenuCheck = false;\n }\n this.dlgObj.destroy();\n remove(elem);\n }\n this.parent.notify(events.filterDialogClose, {});\n };\n FilterMenuRenderer.prototype.renderDlgContent = function (target, column) {\n var args = {\n requestType: events.filterBeforeOpen,\n columnName: column.field, columnType: column.type\n };\n var filterModel = 'filterModel';\n args[\"\" + filterModel] = this;\n this.parent.trigger(events.actionBegin, args);\n var mainDiv = this.parent.createElement('div', { className: 'e-flmenu-maindiv', id: column.uid + '-flmenu' });\n this.dlgDiv = this.parent.createElement('div', { className: 'e-flmenu', id: column.uid + '-flmdlg' });\n this.dlgDiv.setAttribute('aria-label', this.l10n.getConstant('FilterMenuDialogARIA'));\n if (this.parent.enableAdaptiveUI) {\n var responsiveCnt = document.querySelector('.e-resfilter > .e-dlg-content > .e-mainfilterdiv');\n responsiveCnt.appendChild(this.dlgDiv);\n }\n else {\n this.parent.element.appendChild(this.dlgDiv);\n }\n this.dlgObj = new Dialog({\n showCloseIcon: false,\n closeOnEscape: false,\n locale: this.parent.locale,\n visible: false,\n enableRtl: this.parent.enableRtl,\n created: this.dialogCreated.bind(this, target, column),\n position: this.parent.element.classList.contains('e-device') ? { X: 'center', Y: 'center' } : { X: '', Y: '' },\n target: this.parent.element.classList.contains('e-device') ? document.body : this.parent.element,\n buttons: [{\n click: this.filterBtnClick.bind(this, column),\n buttonModel: {\n content: this.l10n.getConstant('FilterButton'), isPrimary: true,\n cssClass: this.parent.cssClass ? 'e-flmenu-okbtn' + ' ' + this.parent.cssClass : 'e-flmenu-okbtn'\n }\n },\n {\n click: this.clearBtnClick.bind(this, column),\n buttonModel: { content: this.l10n.getConstant('ClearButton'),\n cssClass: this.parent.cssClass ? 'e-flmenu-cancelbtn' + ' ' + this.parent.cssClass : 'e-flmenu-cancelbtn' }\n }],\n content: mainDiv,\n width: (!isNullOrUndefined(parentsUntil(target, 'e-bigger'))) || this.parent.element.classList.contains('e-device') ? 260 : 250,\n animationSettings: { effect: 'None' },\n cssClass: this.parent.cssClass ? 'e-filter-popup' + ' ' + this.parent.cssClass : 'e-filter-popup'\n });\n var isStringTemplate = 'isStringTemplate';\n this.dlgObj[\"\" + isStringTemplate] = true;\n this.renderResponsiveDialog();\n this.dlgObj.appendTo(this.dlgDiv);\n };\n FilterMenuRenderer.prototype.renderResponsiveDialog = function () {\n var gObj = this.parent;\n if (gObj.enableAdaptiveUI) {\n this.dlgObj.position = { X: '', Y: '' };\n this.dlgObj.target = document.querySelector('.e-resfilter > .e-dlg-content > .e-mainfilterdiv');\n this.dlgObj.width = '100%';\n this.dlgObj.isModal = false;\n this.dlgObj.buttons = [{}];\n }\n };\n FilterMenuRenderer.prototype.dialogCreated = function (target, column) {\n if (!Browser.isDevice && target) {\n getFilterMenuPostion(target, this.dlgObj);\n }\n this.currentDialogCreatedColumn = column;\n this.renderFilterUI(target, column);\n if (!(column.isForeignColumn() && !(!isNullOrUndefined(column.filter) && !isNullOrUndefined(column.filter.ui)\n && !isNullOrUndefined(column.filter.ui.create)))) {\n this.afterRenderFilterUI();\n }\n if (!isNullOrUndefined(column.filterTemplate)) {\n this.dlgDiv.querySelector('.e-flmenu-valuediv').firstElementChild.focus();\n this.dlgDiv.querySelector('.e-flmenu-valuediv').firstElementChild.classList.add('e-input-focus');\n }\n else if (!isNullOrUndefined(this.dlgDiv.querySelector('.e-flmenu-input'))) {\n this.dlgDiv.querySelector('.e-flmenu-input').focus();\n this.dlgDiv.querySelector('.e-flmenu-input').parentElement.classList.add('e-input-focus');\n }\n };\n /**\n * Function to notify filterDialogCreated and trigger actionComplete\n *\n * @returns {void}\n * @hidden\n */\n FilterMenuRenderer.prototype.afterRenderFilterUI = function () {\n var column = this.currentDialogCreatedColumn;\n if (column.showColumnMenu) {\n this.parent.notify(events.filterDialogCreated, {});\n }\n if (this.parent.enableAdaptiveUI) {\n this.dlgObj.element.style.left = '0px';\n this.dlgObj.element.style.maxHeight = 'none';\n }\n else {\n this.dlgObj.element.style.maxHeight = this.maxHeight;\n }\n this.dlgObj.show();\n var optrInput = this.dlgObj.element.querySelector('.e-flm_optrdiv').querySelector('input');\n var valInput = this.dlgObj.element.querySelector('.e-flmenu-valuediv').querySelector('input');\n if (optrInput.value === 'Empty' || optrInput.value === 'Not Empty' ||\n optrInput.value === 'Null' || optrInput.value === 'Not Null') {\n valInput['ej2_instances'][0]['enabled'] = false;\n }\n else if (!isNullOrUndefined(valInput && valInput.getAttribute('disabled'))) {\n valInput['ej2_instances'][0]['enabled'] = true;\n }\n if (!column.filterTemplate) {\n this.writeMethod(column, this.dlgObj.element.querySelector('#' + column.uid + '-flmenu'));\n }\n var args = {\n requestType: events.filterAfterOpen,\n columnName: column.field, columnType: column.type\n };\n var filterModel = 'filterModel';\n args[\"\" + filterModel] = this;\n this.isDialogOpen = true;\n if (!this.isMenuCheck) {\n this.parent.trigger(events.actionComplete, args);\n }\n };\n FilterMenuRenderer.prototype.renderFilterUI = function (target, col) {\n var dlgConetntEle = this.dlgObj.element.querySelector('.e-flmenu-maindiv');\n this.parent.log('column_type_missing', { column: col });\n this.renderOperatorUI(dlgConetntEle, target, col);\n this.renderFlValueUI(dlgConetntEle, target, col);\n };\n FilterMenuRenderer.prototype.renderOperatorUI = function (dlgConetntEle, target, column) {\n this.flMuiObj.renderOperatorUI(dlgConetntEle, target, column, this.dlgObj, this.filterObj.menuOperator);\n };\n FilterMenuRenderer.prototype.renderFlValueUI = function (dlgConetntEle, target, column) {\n var valueDiv = this.parent.createElement('div', { className: 'e-flmenu-valuediv' });\n var fObj = this.filterObj;\n dlgConetntEle.appendChild(valueDiv);\n var instanceofFilterUI = new this.colTypes[column.type](this.parent, this.serviceLocator, this.parent.filterSettings);\n if (column.filterTemplate) {\n var fltrData = {};\n var valueInString = 'value';\n fltrData[column.field] = fltrData[\"\" + valueInString] = fObj.values[column.field];\n if (column.foreignKeyValue) {\n fltrData[column.foreignKeyValue] = fObj.values[column.field];\n fltrData[column.field] = undefined;\n }\n var col = 'column';\n fltrData[\"\" + col] = column;\n var isReactCompiler = this.parent.isReact && typeof (column.filterTemplate) !== 'string';\n var isReactChild = this.parent.parentDetails && this.parent.parentDetails.parentInstObj &&\n this.parent.parentDetails.parentInstObj.isReact;\n var tempID = this.parent.element.id + column.uid + 'filterTemplate';\n if (isReactCompiler || isReactChild) {\n column.getFilterTemplate()(fltrData, this.parent, 'filterTemplate', tempID, null, null, valueDiv);\n this.parent.renderTemplates();\n }\n else {\n var compElement = column.getFilterTemplate()(fltrData, this.parent, 'filterTemplate', tempID);\n appendChildren(valueDiv, compElement);\n }\n if (this.isMenuCheck) {\n this.menuFilterBase.cBox = this.dlgObj.element.querySelector('.e-checkboxlist.e-fields');\n this.menuFilterBase.wireEvents();\n this.parent.on(events.cBoxFltrComplete, this.actionComplete, this);\n this.menuFilterBase.getAllData();\n }\n }\n else {\n if (!isNullOrUndefined(column.filter) && !isNullOrUndefined(column.filter.ui)\n && !isNullOrUndefined(column.filter.ui.create)) {\n var temp = column.filter.ui.create;\n if (typeof temp === 'string') {\n temp = getValue(temp, window);\n }\n temp({\n column: column, target: valueDiv,\n getOptrInstance: this.flMuiObj, dialogObj: this.dlgObj\n });\n }\n else {\n instanceofFilterUI.create({\n column: column, target: valueDiv,\n getOptrInstance: this.flMuiObj, localizeText: this.l10n, dialogObj: this.dlgObj\n });\n }\n }\n };\n FilterMenuRenderer.prototype.writeMethod = function (col, dlgContentEle) {\n var flValue;\n var target = dlgContentEle.querySelector('.e-flmenu-valinput');\n var instanceofFilterUI = new this.colTypes[col.type](this.parent, this.serviceLocator, this.parent.filterSettings);\n var columns = this.filterSettings.columns;\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var column = columns_1[_i];\n if (col.uid === column.uid) {\n flValue = column.value;\n }\n }\n if (!isNullOrUndefined(col.filter) && !isNullOrUndefined(col.filter.ui)\n && !isNullOrUndefined(col.filter.ui.write)) {\n var temp = col.filter.ui.write;\n if (typeof temp === 'string') {\n temp = getValue(temp, window);\n }\n temp({ column: col, target: target, parent: this.parent, filteredValue: flValue });\n }\n else {\n instanceofFilterUI.write({ column: col, target: target, parent: this.parent, filteredValue: flValue });\n }\n };\n FilterMenuRenderer.prototype.filterBtnClick = function (col) {\n var flValue;\n var targ = this.dlgObj.element.querySelector('.e-flmenu-valuediv input');\n var flOptrValue = this.flMuiObj.getFlOperator();\n var instanceofFilterUI = new this.colTypes[col.type](this.parent, this.serviceLocator, this.parent.filterSettings);\n if (col.filterTemplate) {\n var element = this.dlgDiv.querySelector('.e-flmenu-valuediv');\n var fltrValue = void 0;\n if (element.children[0].value) {\n fltrValue = element.children[0].value;\n }\n else {\n if (!isNullOrUndefined(element.children[0].ej2_instances)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n fltrValue = (this.parent.isAngular ? element.children[0] :\n element.querySelector('input')).ej2_instances[0].value;\n }\n else {\n var eControl = element.querySelector('.e-control');\n if (!isNullOrUndefined(eControl)) {\n fltrValue = col.type === 'boolean' ? eControl.checked :\n !isNullOrUndefined(eControl.ej2_instances) ?\n eControl.ej2_instances[0].value :\n eControl.value;\n }\n }\n }\n this.filterObj.filterByColumn(col.field, flOptrValue, fltrValue);\n }\n else {\n if (!isNullOrUndefined(col.filter) &&\n !isNullOrUndefined(col.filter.ui) && !isNullOrUndefined(col.filter.ui.read)) {\n var temp = col.filter.ui.read;\n if (typeof temp === 'string') {\n temp = getValue(temp, window);\n }\n // eslint-disable-next-line\n flValue = temp({ element: targ, column: col, operator: flOptrValue, fltrObj: this.filterObj });\n }\n else {\n instanceofFilterUI.read(targ, col, flOptrValue, this.filterObj);\n }\n }\n this.closeDialog();\n if (this.parent.showColumnMenu) {\n this.parent.notify(events.afterFilterColumnMenuClose, {});\n }\n };\n FilterMenuRenderer.prototype.closeResponsiveDialog = function () {\n this.closeDialog();\n };\n FilterMenuRenderer.prototype.clearBtnClick = function (column) {\n this.filterObj.removeFilteredColsByField(column.field);\n this.closeDialog();\n };\n FilterMenuRenderer.prototype.destroy = function () {\n this.closeDialog();\n };\n /**\n * @returns {FilterUI} returns the filterUI\n * @hidden\n */\n FilterMenuRenderer.prototype.getFilterUIInfo = function () {\n return { field: this.col.field, operator: this.flMuiObj.getFlOperator() };\n };\n FilterMenuRenderer.prototype.renderCheckBoxMenu = function () {\n this.isMenuCheck = true;\n this.menuFilterBase.updateModel(this.options);\n this.menuFilterBase.getAndSetChkElem(this.options);\n this.dlgObj.buttons = [{\n click: this.menuFilterBase.btnClick.bind(this.menuFilterBase),\n buttonModel: {\n content: this.menuFilterBase.getLocalizedLabel('FilterButton'),\n cssClass: 'e-primary', isPrimary: true\n }\n },\n {\n click: this.menuFilterBase.btnClick.bind(this.menuFilterBase),\n buttonModel: { cssClass: 'e-flat', content: this.menuFilterBase.getLocalizedLabel('ClearButton') }\n }];\n this.menuFilterBase.dialogObj = this.dlgObj;\n this.menuFilterBase.dlg = this.dlgObj.element;\n this.menuFilterBase.dlg.classList.add('e-menucheckbox');\n this.menuFilterBase.dlg.classList.remove('e-checkboxfilter');\n this.maxHeight = '800px';\n return this.menuFilterBase.sBox.innerHTML;\n };\n FilterMenuRenderer.prototype.actionComplete = function (args) {\n if (this.isMenuCheck) {\n this.parent.trigger(events.actionComplete, args);\n }\n };\n return FilterMenuRenderer;\n}());\nexport { FilterMenuRenderer };\n","import * as events from '../base/constant';\nimport { isActionPrevent } from '../base/util';\nimport { CheckBoxFilterBase } from '../common/checkbox-filter-base';\n/**\n * @hidden\n * `CheckBoxFilter` module is used to handle filtering action.\n */\nvar CheckBoxFilter = /** @class */ (function () {\n /**\n * Constructor for checkbox filtering module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {FilterSettings} filterSettings - specifies the filtersettings\n * @param {ServiceLocator} serviceLocator - specifies the ServiceLocator\n * @hidden\n */\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n function CheckBoxFilter(parent, filterSettings, serviceLocator) {\n this.parent = parent;\n this.isresetFocus = true;\n this.checkBoxBase = new CheckBoxFilterBase(parent);\n this.addEventListener();\n }\n /**\n * To destroy the check box filter.\n *\n * @returns {void}\n * @hidden\n */\n CheckBoxFilter.prototype.destroy = function () {\n this.removeEventListener();\n this.checkBoxBase.closeDialog();\n };\n CheckBoxFilter.prototype.openDialog = function (options) {\n this.checkBoxBase.openDialog(options);\n this.parent.log('column_type_missing', { column: options.column });\n };\n CheckBoxFilter.prototype.closeDialog = function () {\n this.destroy();\n if (this.isresetFocus) {\n this.parent.notify(events.restoreFocus, {});\n }\n };\n CheckBoxFilter.prototype.closeResponsiveDialog = function () {\n this.checkBoxBase.closeDialog();\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} - returns the module name\n * @private\n */\n CheckBoxFilter.prototype.getModuleName = function () {\n return 'checkboxFilter';\n };\n CheckBoxFilter.prototype.actionBegin = function (args) {\n this.parent.trigger(events.actionBegin, args);\n };\n CheckBoxFilter.prototype.actionComplete = function (args) {\n this.parent.trigger(events.actionComplete, args);\n };\n CheckBoxFilter.prototype.actionPrevent = function (args) {\n if (isActionPrevent(this.parent)) {\n this.parent.notify(events.preventBatch, args);\n args.cancel = true;\n }\n };\n CheckBoxFilter.prototype.clearCustomFilter = function (col) {\n this.checkBoxBase.clearFilter(col);\n };\n CheckBoxFilter.prototype.applyCustomFilter = function () {\n this.checkBoxBase.fltrBtnHandler();\n this.checkBoxBase.closeDialog();\n };\n CheckBoxFilter.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.cBoxFltrBegin, this.actionBegin, this);\n this.parent.on(events.cBoxFltrComplete, this.actionComplete, this);\n this.parent.on(events.fltrPrevent, this.actionPrevent, this);\n };\n CheckBoxFilter.prototype.removeEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.cBoxFltrBegin, this.actionBegin);\n this.parent.off(events.cBoxFltrComplete, this.actionComplete);\n this.parent.off(events.fltrPrevent, this.actionPrevent);\n };\n return CheckBoxFilter;\n}());\nexport { CheckBoxFilter };\n","var __extends = (this && this.__extends) || (function () {\n var extendStatics = function (d, b) {\n extendStatics = Object.setPrototypeOf ||\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\n return extendStatics(d, b);\n };\n return function (d, b) {\n extendStatics(d, b);\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n };\n})();\nimport { ExcelFilterBase } from '../common/excel-filter-base';\nimport { CheckBoxFilter } from './checkbox-filter';\nimport * as events from '../base/constant';\n/**\n * @hidden\n * `ExcelFilter` module is used to handle filtering action.\n */\nvar ExcelFilter = /** @class */ (function (_super) {\n __extends(ExcelFilter, _super);\n /**\n * Constructor for excelbox filtering module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {FilterSettings} filterSettings - specifies the Filtersettings\n * @param {ServiceLocator} serviceLocator - specifies the serviceLocator\n * @param {object} customFltrOperators - specifies the customFltrOperators\n * @hidden\n */\n function ExcelFilter(parent, filterSettings, serviceLocator, customFltrOperators) {\n var _this = _super.call(this, parent, filterSettings, serviceLocator) || this;\n _this.parent = parent;\n _this.isresetFocus = true;\n _this.excelFilterBase = new ExcelFilterBase(parent, customFltrOperators);\n return _this;\n }\n /**\n * To destroy the excel filter.\n *\n * @returns {void}\n * @hidden\n */\n ExcelFilter.prototype.destroy = function () {\n this.excelFilterBase.closeDialog();\n };\n ExcelFilter.prototype.openDialog = function (options) {\n this.excelFilterBase.openDialog(options);\n };\n ExcelFilter.prototype.closeDialog = function () {\n this.excelFilterBase.closeDialog();\n if (this.isresetFocus) {\n this.parent.notify(events.restoreFocus, {});\n }\n };\n ExcelFilter.prototype.clearCustomFilter = function (col) {\n this.excelFilterBase.clearFilter(col);\n };\n ExcelFilter.prototype.closeResponsiveDialog = function (isCustomFilter) {\n if (isCustomFilter) {\n this.excelFilterBase.removeDialog();\n }\n else {\n this.closeDialog();\n }\n };\n ExcelFilter.prototype.applyCustomFilter = function (args) {\n if (!args.isCustomFilter) {\n this.excelFilterBase.fltrBtnHandler();\n this.excelFilterBase.closeDialog();\n }\n else {\n this.excelFilterBase.filterBtnClick(args.col.field);\n }\n };\n ExcelFilter.prototype.filterByColumn = function (fieldName, firstOperator, firstValue, predicate, matchCase, ignoreAccent, secondOperator, secondValue) {\n this.excelFilterBase.filterByColumn(fieldName, firstOperator, firstValue, predicate, matchCase, ignoreAccent, secondOperator, secondValue);\n };\n /**\n * @returns {FilterUI} returns the filterUI\n * @hidden\n */\n ExcelFilter.prototype.getFilterUIInfo = function () {\n return this.excelFilterBase.getFilterUIInfo();\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n ExcelFilter.prototype.getModuleName = function () {\n return 'excelFilter';\n };\n return ExcelFilter;\n}(CheckBoxFilter));\nexport { ExcelFilter };\n","import { EventHandler, isNullOrUndefined, extend, closest, getValue } from '@syncfusion/ej2-base';\nimport { getActualPropFromColl, isActionPrevent, getColumnByForeignKeyValue } from '../base/util';\nimport { remove, matches } from '@syncfusion/ej2-base';\nimport { DataUtil, Query, DataManager } from '@syncfusion/ej2-data';\nimport * as events from '../base/constant';\nimport { CellType, ResponsiveDialogAction } from '../base/enum';\nimport { RowRenderer } from '../renderer/row-renderer';\nimport { Cell } from '../models/cell';\nimport { Row } from '../models/row';\nimport { FilterCellRenderer } from '../renderer/filter-cell-renderer';\nimport { parentsUntil, addFixedColumnBorder, applyStickyLeftRightPosition } from '../base/util';\nimport { FilterMenuRenderer } from '../renderer/filter-menu-renderer';\nimport { CheckBoxFilter } from '../actions/checkbox-filter';\nimport { ExcelFilter } from '../actions/excel-filter';\nimport * as literals from '../base/string-literals';\nimport { Input } from '@syncfusion/ej2-inputs';\n/**\n *\n * The `Filter` module is used to handle filtering action.\n */\nvar Filter = /** @class */ (function () {\n /**\n * Constructor for Grid filtering module\n *\n * @param {IGrid} parent - specifies the IGrid\n * @param {FilterSettings} filterSettings - specifies the filterSettings\n * @param {ServiceLocator} serviceLocator - specifes the serviceLocator\n * @hidden\n */\n function Filter(parent, filterSettings, serviceLocator) {\n this.predicate = 'and';\n this.contentRefresh = true;\n this.filterByMethod = true;\n this.refresh = true;\n this.values = {};\n this.operators = {};\n this.cellText = {};\n this.nextFlMenuOpen = '';\n this.type = { 'Menu': FilterMenuRenderer, 'CheckBox': CheckBoxFilter, 'Excel': ExcelFilter };\n /** @hidden */\n this.filterOperators = {\n contains: 'contains', endsWith: 'endswith', equal: 'equal', greaterThan: 'greaterthan', greaterThanOrEqual: 'greaterthanorequal',\n lessThan: 'lessthan', lessThanOrEqual: 'lessthanorequal', notEqual: 'notequal', startsWith: 'startswith', wildCard: 'wildcard',\n isNull: 'isnull', notNull: 'notnull', like: 'like'\n };\n this.fltrDlgDetails = { field: '', isOpen: false };\n /** @hidden */\n this.skipNumberInput = ['=', ' ', '!'];\n this.skipStringInput = ['>', '<', '='];\n this.actualPredicate = {};\n this.parent = parent;\n this.filterSettings = filterSettings;\n this.serviceLocator = serviceLocator;\n this.addEventListener();\n this.setFullScreenDialog();\n }\n /**\n * To render filter bar when filtering enabled.\n *\n * @param {NotifyArgs} e - specifies the NotifyArgs\n * @returns {void}\n * @hidden\n */\n Filter.prototype.render = function (e) {\n if (DataUtil.getObject('args.isFrozen', e)) {\n return;\n }\n var gObj = this.parent;\n this.l10n = this.serviceLocator.getService('localization');\n this.getLocalizedCustomOperators();\n if (this.parent.filterSettings.type === 'FilterBar') {\n if (gObj.columns.length) {\n var fltrElem = this.parent.element.querySelector('.e-filterbar');\n if (fltrElem) {\n remove(fltrElem);\n }\n var rowRenderer = new RowRenderer(this.serviceLocator, CellType.Filter, gObj);\n var cellrender = this.serviceLocator.getService('cellRendererFactory');\n cellrender.addCellRenderer(CellType.Filter, new FilterCellRenderer(this.parent, this.serviceLocator));\n this.valueFormatter = this.serviceLocator.getService('valueFormatter');\n rowRenderer.element = this.parent.createElement('tr', { className: 'e-filterbar', attrs: { role: 'row' } });\n var row = this.generateRow();\n row.data = this.values;\n this.parent.getHeaderContent().querySelector('thead:not(.e-masked-thead)').appendChild(rowRenderer.element);\n var rowdrag = this.parent.element.querySelector('.e-rowdragheader');\n this.element = rowRenderer.render(row, gObj.getColumns(), null, null, rowRenderer.element);\n if (this.element.querySelectorAll('.e-leftfreeze').length &&\n (this.element.querySelectorAll('.e-indentcell').length || this.element.querySelectorAll('.e-grouptopleftcell').length)) {\n var td = this.element.querySelectorAll('.e-indentcell, .e-grouptopleftcell');\n for (var i = 0; i < td.length; i++) {\n td[parseInt(i.toString(), 10)].classList.add('e-leftfreeze');\n applyStickyLeftRightPosition(td[parseInt(i.toString(), 10)], i * 30, this.parent.enableRtl, 'Left');\n }\n }\n addFixedColumnBorder(this.element);\n var detail = this.element.querySelector('.e-detailheadercell');\n if (detail) {\n detail.className = 'e-filterbarcell e-mastercell';\n }\n if (rowdrag) {\n if (rowdrag.classList.contains('e-leftfreeze')) {\n rowdrag.className = 'e-dragheadercell e-mastercell e-leftfreeze';\n }\n else {\n rowdrag.className = 'e-filterbarcell e-mastercell';\n }\n }\n var gCells = [].slice.call(this.element.getElementsByClassName('e-grouptopleftcell'));\n if (gCells.length) {\n gCells[gCells.length - 1].classList.add('e-lastgrouptopleftcell');\n }\n this.wireEvents();\n this.parent.notify(events.freezeRender, { case: 'filter' });\n }\n }\n };\n /**\n * To show the responsive custom filter dialog\n *\n * @param {boolean} enable - specifes dialog open\n * @returns {void}\n * @hidden\n */\n Filter.prototype.showCustomFilter = function (enable) {\n this.responsiveDialogRenderer.isCustomDialog = enable;\n this.responsiveDialogRenderer.showResponsiveDialog(this.column);\n };\n Filter.prototype.renderResponsiveChangeAction = function (args) {\n this.responsiveDialogRenderer.action = args.action;\n };\n /**\n * To create the filter module.\n *\n * @param {Column} col - specifies the filtering column name\n * @returns {void}\n * @hidden\n */\n Filter.prototype.setFilterModel = function (col) {\n var type = col.filter.type || this.parent.filterSettings.type;\n this.filterModule = new this.type[\"\" + type](this.parent, this.parent.filterSettings, this.serviceLocator, this.customOperators, this);\n };\n /**\n * To destroy the filter bar.\n *\n * @returns {void}\n * @hidden\n */\n Filter.prototype.destroy = function () {\n var gridElement = this.parent.element;\n if (!gridElement || (!gridElement.querySelector('.' + literals.gridHeader) && !gridElement.querySelector('.' + literals.gridContent))) {\n return;\n }\n if (this.filterModule) {\n this.filterModule.destroy();\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (!this.parent.refreshing && (this.parent.isDestroyed || !this.parent.allowFiltering)) {\n this.filterSettings.columns = [];\n }\n this.updateFilterMsg();\n this.removeEventListener();\n this.unWireEvents();\n if (this.filterSettings.type === 'FilterBar' && this.filterSettings.showFilterBarOperator) {\n var dropdownlist = [].slice.call(this.element.getElementsByClassName('e-filterbaroperator'));\n for (var i = 0; i < dropdownlist.length; i++) {\n if (dropdownlist[parseInt(i.toString(), 10)].ej2_instances[0]) {\n dropdownlist[parseInt(i.toString(), 10)].ej2_instances[0].destroy();\n }\n }\n }\n if (this.element) {\n if (this.element.parentElement) {\n remove(this.element);\n }\n var filterBarElement = this.parent.getHeaderContent().querySelector('.e-filterbar');\n if (filterBarElement) {\n remove(filterBarElement);\n }\n }\n };\n Filter.prototype.setFullScreenDialog = function () {\n if (this.serviceLocator) {\n this.serviceLocator.registerAdaptiveService(this, this.parent.enableAdaptiveUI, ResponsiveDialogAction.isFilter);\n }\n };\n Filter.prototype.generateRow = function () {\n var options = {};\n var row = new Row(options);\n row.cells = this.generateCells();\n return row;\n };\n Filter.prototype.generateCells = function () {\n //TODO: generate dummy column for group, detail, stacked row here for filtering;\n var cells = [];\n if (this.parent.allowGrouping) {\n for (var c = 0, len = this.parent.groupSettings.columns.length; c < len; c++) {\n cells.push(this.generateCell({}, CellType.HeaderIndent));\n }\n }\n if (this.parent.detailTemplate || this.parent.childGrid) {\n cells.push(this.generateCell({}, CellType.DetailHeader));\n }\n if (this.parent.isRowDragable() && this.parent.getFrozenMode() !== 'Right') {\n cells.push(this.generateCell({}, CellType.RowDragHIcon));\n }\n for (var _i = 0, _a = this.parent.getColumns(); _i < _a.length; _i++) {\n var dummy = _a[_i];\n cells.push(this.generateCell(dummy));\n }\n if (this.parent.isRowDragable() && this.parent.getFrozenMode() === 'Right') {\n cells.push(this.generateCell({}, CellType.RowDragHIcon));\n }\n return cells;\n };\n Filter.prototype.generateCell = function (column, cellType) {\n var opt = {\n 'visible': column.visible,\n 'isDataCell': false,\n 'rowId': '',\n 'column': column,\n 'cellType': cellType ? cellType : CellType.Filter,\n 'attributes': { title: this.l10n.getConstant('FilterbarTitle') }\n };\n return new Cell(opt);\n };\n /**\n * To update filterSettings when applying filter.\n *\n * @returns {void}\n * @hidden\n */\n Filter.prototype.updateModel = function () {\n var col = this.column.isForeignColumn() ? this.parent.getColumnByUid(this.column.uid) :\n this.parent.getColumnByField(this.fieldName);\n this.filterObjIndex = this.getFilteredColsIndexByField(col);\n this.prevFilterObject = this.filterSettings.columns[this.filterObjIndex];\n var arrayVal = Array.isArray(this.value) ? this.value : [this.value];\n var moduleName = this.parent.dataSource.adaptor && this.parent.dataSource.adaptor.getModuleName ? this.parent.dataSource.adaptor.getModuleName() : undefined;\n for (var i = 0, len = arrayVal.length; i < len; i++) {\n var field = col.isForeignColumn() ? col.foreignKeyValue : this.fieldName;\n var isMenuNotEqual = this.operator === 'notequal';\n this.currentFilterObject = {\n field: field, uid: col.uid, isForeignKey: col.isForeignColumn(), operator: this.operator,\n value: arrayVal[parseInt(i.toString(), 10)], predicate: this.predicate,\n matchCase: this.matchCase, ignoreAccent: this.ignoreAccent, actualFilterValue: {}, actualOperator: {}\n };\n var index = this.getFilteredColsIndexByField(col);\n if (index > -1 && !Array.isArray(this.value)) {\n this.filterSettings.columns[parseInt(index.toString(), 10)] = this.currentFilterObject;\n }\n else {\n this.filterSettings.columns.push(this.currentFilterObject);\n }\n if (!this.column.isForeignColumn() && isNullOrUndefined(this.value) && (this.operator === 'equal' ||\n this.operator === 'notequal') && (moduleName !== 'ODataAdaptor' && moduleName !== 'ODataV4Adaptor')) {\n for (var i_1 = 0; i_1 < this.filterSettings.columns.length; i_1++) {\n if (this.filterSettings.columns[\"\" + i_1].field === field &&\n (this.filterSettings.columns[\"\" + i_1].operator === 'equal' || this.filterSettings.columns[\"\" + i_1].operator === 'notequal')\n && isNullOrUndefined(this.filterSettings.columns[\"\" + i_1].value)) {\n this.filterSettings.columns.splice(i_1, 1);\n i_1 = i_1 - 1;\n }\n }\n if (col.type === 'string') {\n this.filterSettings.columns.push({\n field: field, ignoreAccent: this.ignoreAccent, matchCase: this.matchCase,\n operator: this.operator, predicate: isMenuNotEqual ? 'and' : 'or', value: ''\n });\n }\n this.filterSettings.columns.push({\n field: field, ignoreAccent: this.ignoreAccent, matchCase: this.matchCase,\n operator: this.operator, predicate: isMenuNotEqual ? 'and' : 'or', value: undefined\n });\n this.filterSettings.columns.push({\n field: field, ignoreAccent: this.ignoreAccent, matchCase: this.matchCase,\n operator: this.operator, predicate: isMenuNotEqual ? 'and' : 'or', value: null\n });\n }\n }\n // eslint-disable-next-line no-self-assign\n this.filterSettings.columns = this.filterSettings.columns;\n this.parent.dataBind();\n };\n Filter.prototype.getFilteredColsIndexByField = function (col) {\n var cols = this.filterSettings.columns;\n for (var i = 0, len = cols.length; i < len; i++) {\n if (cols[parseInt(i.toString(), 10)].uid === col.uid || (col.isForeignColumn()\n && this.parent.getColumnByUid(col.uid).field === col.foreignKeyValue)) {\n return i;\n }\n }\n return -1;\n };\n /**\n * To trigger action complete event.\n *\n * @param {NotifyArgs} e - specifies the NotifyArgs\n * @returns {void}\n * @hidden\n */\n Filter.prototype.onActionComplete = function (e) {\n var args = !this.isRemove ? {\n currentFilterObject: this.currentFilterObject,\n /* tslint:disable:no-string-literal */\n currentFilteringColumn: !isNullOrUndefined(this.column) ? this.column.field : undefined,\n /* tslint:enable:no-string-literal */\n columns: this.filterSettings.columns, requestType: 'filtering', type: events.actionComplete\n } : {\n requestType: 'filtering', type: events.actionComplete\n };\n this.parent.trigger(events.actionComplete, extend(e, args));\n this.isRemove = false;\n };\n Filter.prototype.wireEvents = function () {\n EventHandler.add(this.parent.getHeaderContent(), 'keyup', this.keyUpHandlerImmediate, this);\n };\n Filter.prototype.unWireEvents = function () {\n EventHandler.remove(this.parent.getHeaderContent(), 'keyup', this.keyUpHandlerImmediate);\n };\n Filter.prototype.enableAfterRender = function (e) {\n if (e.module === this.getModuleName() && e.enable) {\n this.parent.getHeaderTable().classList.add('e-sortfilter');\n this.render();\n }\n };\n Filter.prototype.refreshFilterValue = function () {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n if (!isNullOrUndefined(this.parent.modelObserver.boundedEvents)) {\n this.parent.removeEventListener(events.beforeDataBound, this.refreshFilterValueFn);\n }\n if (this.filterSettings.type === 'FilterBar' && this.filterSettings.columns.length &&\n !this.parent.getCurrentViewRecords().length) {\n this.initialEnd();\n }\n };\n Filter.prototype.initialEnd = function () {\n this.parent.off(events.contentReady, this.initialEnd);\n if (this.parent.getColumns().length && this.filterSettings.columns.length) {\n var gObj = this.parent;\n this.contentRefresh = false;\n this.initialLoad = true;\n for (var _i = 0, _a = gObj.filterSettings.columns; _i < _a.length; _i++) {\n var col = _a[_i];\n this.filterByColumn(col.field, col.operator, col.value, col.predicate, col.matchCase, col.ignoreAccent, col.actualFilterValue, col.actualOperator, col.isForeignKey);\n }\n this.initialLoad = false;\n this.updateFilterMsg();\n this.contentRefresh = true;\n }\n };\n /**\n * @returns {void}\n * @hidden\n */\n Filter.prototype.addEventListener = function () {\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.on(events.setFullScreenDialog, this.setFullScreenDialog, this);\n this.parent.on(events.uiUpdate, this.enableAfterRender, this);\n this.parent.on(events.filterComplete, this.onActionComplete, this);\n this.parent.on(events.inBoundModelChanged, this.onPropertyChanged, this);\n this.parent.on(events.keyPressed, this.keyUpHandler, this);\n this.parent.on(events.columnPositionChanged, this.columnPositionChanged, this);\n this.parent.on(events.headerRefreshed, this.render, this);\n this.parent.on(events.contentReady, this.initialEnd, this);\n this.parent.on(events.filterMenuClose, this.filterMenuClose, this);\n this.parent.on(events.renderResponsiveChangeAction, this.renderResponsiveChangeAction, this);\n this.docClickHandler = this.clickHandler.bind(this);\n EventHandler.add(document, 'click', this.docClickHandler, this);\n EventHandler.add(this.parent.element, 'mousedown', this.refreshClearIcon, this);\n this.parent.on(events.filterOpen, this.columnMenuFilter, this);\n this.parent.on(events.click, this.filterIconClickHandler, this);\n this.parent.on('persist-data-changed', this.initialEnd, this);\n this.parent.on(events.closeFilterDialog, this.clickHandler, this);\n this.parent.on(events.destroy, this.destroy, this);\n this.refreshFilterValueFn = this.refreshFilterValue.bind(this);\n this.parent.addEventListener(events.beforeDataBound, this.refreshFilterValueFn);\n };\n /**\n * @returns {void}\n * @hidden\n */\n Filter.prototype.removeEventListener = function () {\n EventHandler.remove(document, 'click', this.docClickHandler);\n EventHandler.remove(this.parent.element, 'mousedown', this.refreshClearIcon);\n if (this.parent.isDestroyed) {\n return;\n }\n this.parent.off(events.setFullScreenDialog, this.setFullScreenDialog);\n this.parent.off(events.uiUpdate, this.enableAfterRender);\n this.parent.off(events.filterComplete, this.onActionComplete);\n this.parent.off(events.inBoundModelChanged, this.onPropertyChanged);\n this.parent.off(events.keyPressed, this.keyUpHandler);\n this.parent.off(events.columnPositionChanged, this.columnPositionChanged);\n this.parent.off(events.headerRefreshed, this.render);\n this.parent.off(events.filterOpen, this.columnMenuFilter);\n this.parent.off(events.filterMenuClose, this.filterMenuClose);\n this.parent.off(events.renderResponsiveChangeAction, this.renderResponsiveChangeAction);\n this.parent.off(events.click, this.filterIconClickHandler);\n this.parent.off(events.closeFilterDialog, this.clickHandler);\n this.parent.off(events.destroy, this.destroy);\n };\n Filter.prototype.refreshClearIcon = function (e) {\n if (this.parent.allowFiltering && this.parent.filterSettings.type === 'FilterBar' &&\n e.target.closest('th') && e.target.closest('th').classList.contains('e-filterbarcell') &&\n e.target.classList.contains('e-clear-icon')) {\n var targetText = e.target.previousElementSibling;\n Input.setValue(null, targetText, 'Never', true);\n if (this.filterSettings.mode === 'Immediate') {\n this.removeFilteredColsByField(targetText.id.slice(0, -14)); //Length of _filterBarcell = 14\n }\n }\n };\n Filter.prototype.filterMenuClose = function () {\n this.fltrDlgDetails.isOpen = false;\n };\n /**\n * Filters the Grid row by fieldName, filterOperator, and filterValue.\n *\n * @param {string} fieldName - Defines the field name of the filter column.\n * @param {string} filterOperator - Defines the operator to filter records.\n * @param {string | number | Date | boolean} filterValue - Defines the value which is used to filter records.\n * @param {string} predicate - Defines the relationship of one filter query with another by using AND or OR predicate.\n * @param {boolean} matchCase - If match case is set to true, then the filter records\n * the exact match or
    filters records that are case insensitive (uppercase and lowercase letters treated the same).\n * @param {boolean} ignoreAccent - If ignoreAccent set to true, then filter ignores the diacritic characters or accents while filtering.\n * @param {string} actualFilterValue - Defines the actual filter value for the filter column.\n * @param {string} actualOperator - Defines the actual filter operator for the filter column.\n * @param {boolean} isForeignColumn - Defines whether it is a foreign key column.\n * @returns {void}\n */\n Filter.prototype.filterByColumn = function (fieldName, filterOperator, filterValue, predicate, matchCase, ignoreAccent, actualFilterValue, actualOperator, isForeignColumn) {\n var _this = this;\n var gObj = this.parent;\n var filterCell;\n this.column = gObj.grabColumnByFieldFromAllCols(fieldName, isForeignColumn);\n if (this.filterSettings.type === 'FilterBar' && this.filterSettings.showFilterBarOperator\n && isNullOrUndefined(this.column.filterBarTemplate) && isNullOrUndefined(this.column.filterTemplate)) {\n filterOperator = this.getOperatorName(fieldName);\n }\n if (filterOperator === 'like' && filterValue && filterValue.indexOf('%') === -1) {\n filterValue = '%' + filterValue + '%';\n }\n if (!this.column) {\n return;\n }\n if (this.filterSettings.type === 'FilterBar') {\n filterCell = gObj.getHeaderContent().querySelector('[id=\\'' + this.column.field + '_filterBarcell\\']');\n }\n if (!isNullOrUndefined(this.column.allowFiltering) && !this.column.allowFiltering) {\n this.parent.log('action_disabled_column', { moduleName: this.getModuleName(), columnName: this.column.headerText });\n return;\n }\n if (isActionPrevent(gObj)) {\n gObj.notify(events.preventBatch, {\n instance: this, handler: this.filterByColumn, arg1: fieldName, arg2: filterOperator, arg3: filterValue, arg4: predicate,\n arg5: matchCase, arg6: ignoreAccent, arg7: actualFilterValue, arg8: actualOperator\n });\n return;\n }\n this.predicate = predicate ? predicate : Array.isArray(filterValue) ? 'or' : 'and';\n this.value = filterValue;\n this.matchCase = matchCase || false;\n this.ignoreAccent = this.ignoreAccent = !isNullOrUndefined(ignoreAccent) ? ignoreAccent : this.parent.filterSettings.ignoreAccent;\n this.fieldName = fieldName;\n this.operator = filterOperator;\n filterValue = !isNullOrUndefined(filterValue) ? filterValue.toString() : filterValue;\n if (filterValue === '') {\n filterValue = null;\n }\n if (this.column.type === 'number' || this.column.type === 'date') {\n this.matchCase = true;\n }\n if (filterCell && this.filterSettings.type === 'FilterBar') {\n if ((filterValue && filterValue.length < 1) || (!this.filterByMethod &&\n this.checkForSkipInput(this.column, filterValue))) {\n this.filterStatusMsg = (filterValue && filterValue.length < 1) ? '' : this.l10n.getConstant('InvalidFilterMessage');\n this.updateFilterMsg();\n return;\n }\n if (filterCell.value !== filterValue) {\n filterCell.value = filterValue;\n }\n }\n if (!isNullOrUndefined(this.column.format)) {\n this.applyColumnFormat(filterValue);\n if (this.initialLoad && this.filterSettings.type === 'FilterBar') {\n filterCell.value = this.values[this.column.field];\n }\n }\n else {\n this.values[this.column.field] = filterValue; //this line should be above updateModel\n }\n var predObj = {\n field: this.fieldName,\n predicate: predicate,\n matchCase: matchCase,\n ignoreAccent: ignoreAccent,\n operator: this.operator,\n value: this.value,\n type: this.column.type\n };\n var filterColumn = this.parent.filterSettings.columns.filter(function (fColumn) {\n return (fColumn.field === _this.fieldName);\n });\n if (filterColumn.length > 1 && !isNullOrUndefined(this.actualPredicate[this.fieldName])) {\n this.actualPredicate[this.fieldName].push(predObj);\n }\n else {\n this.actualPredicate[this.fieldName] = [predObj];\n }\n if (this.checkAlreadyColFiltered(this.column.field)) {\n return;\n }\n this.updateModel();\n };\n Filter.prototype.applyColumnFormat = function (filterValue) {\n var _this = this;\n var getFlvalue = (this.column.type === 'date' || this.column.type === 'datetime' || this.column.type === 'dateonly') ?\n new Date(filterValue) : parseFloat(filterValue);\n if ((this.column.type === 'date' || this.column.type === 'datetime' || this.column.type === 'dateonly') && filterValue &&\n Array.isArray(this.value) && filterValue.split(',').length > 1) {\n this.values[this.column.field] = ((filterValue).split(',')).map(function (val) {\n if (val === '') {\n val = null;\n }\n return _this.setFormatForFlColumn(new Date(val), _this.column);\n });\n }\n else {\n this.values[this.column.field] = this.setFormatForFlColumn(getFlvalue, this.column);\n }\n };\n // To skip the second time request to server while applying initial filtering - EJ2-44361\n Filter.prototype.skipUid = function (col) {\n var flag = true;\n var colLen = Object.keys((col));\n for (var i = 0; i < colLen.length; i++) {\n var key = Object.keys(col[colLen[parseInt(i.toString(), 10)]]);\n if (key.length === 1 && key[0] === 'uid') {\n flag = false;\n }\n }\n return flag;\n };\n Filter.prototype.onPropertyChanged = function (e) {\n if (e.module !== this.getModuleName()) {\n return;\n }\n for (var _i = 0, _a = Object.keys(e.properties); _i < _a.length; _i++) {\n var prop = _a[_i];\n switch (prop) {\n case 'columns':\n // eslint-disable-next-line no-case-declarations\n var col = 'columns';\n // eslint-disable-next-line no-case-declarations\n var args = {\n currentFilterObject: this.currentFilterObject, currentFilteringColumn: this.column ?\n this.column.field : undefined, action: 'filter', columns: this.filterSettings.columns,\n requestType: 'filtering', type: events.actionBegin, cancel: false\n };\n if (this.contentRefresh && this.skipUid(e.properties[\"\" + col])) {\n this.parent.notify(events.modelChanged, args);\n if (args.cancel) {\n if ((this.filterSettings.type === 'CheckBox' || this.filterSettings.type === 'Excel')) {\n this.filterSettings.columns = (this.actualData.length <= 1) ? this.checkboxPrevFilterObject :\n this.checkboxFilterObject;\n this.actualPredicate[this.column.field] = this.filterSettings.columns;\n var col_1 = this.parent.getColumnByField(this.column.field);\n var iconClass = this.parent.showColumnMenu && col_1.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';\n var filterIconElement = this.parent.getColumnHeaderByField(this.column.field)\n .querySelector(iconClass);\n if (this.checkboxPrevFilterObject.length === 0) {\n filterIconElement.classList.remove('e-filtered');\n }\n else {\n filterIconElement.classList.add('e-filtered');\n }\n }\n else {\n if (isNullOrUndefined(this.prevFilterObject)) {\n this.filterSettings.columns.splice(this.filterSettings.columns.length - 1, 1);\n }\n else {\n this.filterSettings.columns[this.filterObjIndex] = this.prevFilterObject;\n }\n }\n return;\n }\n this.updateFilterIcon();\n this.refreshFilterSettings();\n this.updateFilterMsg();\n this.updateFilter();\n }\n break;\n case 'showFilterBarStatus':\n if (e.properties[\"\" + prop]) {\n this.updateFilterMsg();\n }\n else if (this.parent.allowPaging) {\n this.parent.updateExternalMessage('');\n }\n break;\n case 'showFilterBarOperator':\n case 'type':\n this.parent.refreshHeader();\n this.refreshFilterSettings();\n if (this.parent.height === '100%') {\n this.parent.scrollModule.refresh();\n }\n break;\n }\n }\n };\n Filter.prototype.refreshFilterSettings = function () {\n if (this.filterSettings.type === 'FilterBar') {\n for (var i = 0; i < this.filterSettings.columns.length; i++) {\n this.column = this.parent.grabColumnByUidFromAllCols(this.filterSettings.columns[parseInt(i.toString(), 10)].uid);\n var filterValue = this.filterSettings.columns[parseInt(i.toString(), 10)].value;\n filterValue = !isNullOrUndefined(filterValue) && filterValue.toString();\n if (!isNullOrUndefined(this.column.format)) {\n this.applyColumnFormat(filterValue);\n }\n else {\n var key = this.filterSettings.columns[parseInt(i.toString(), 10)].field;\n this.values[\"\" + key] = this.filterSettings.columns[parseInt(i.toString(), 10)].value;\n }\n var filterElement = this.getFilterBarElement(this.column.field);\n if (filterElement) {\n if (this.cellText[this.filterSettings.columns[parseInt(i.toString(), 10)].field] !== ''\n && !isNullOrUndefined(this.cellText[this.filterSettings.columns[parseInt(i.toString(), 10)].field])) {\n filterElement.value = this.cellText[this.column.field];\n }\n else {\n filterElement.value = this.filterSettings.columns[parseInt(i.toString(), 10)].value;\n }\n }\n }\n if (this.filterSettings.columns.length === 0) {\n var col = this.parent.getColumns();\n for (var i = 0; i < col.length; i++) {\n var filterElement = this.getFilterBarElement(col[parseInt(i.toString(), 10)].field);\n if (filterElement && filterElement.value !== '') {\n filterElement.value = '';\n delete this.values[col[parseInt(i.toString(), 10)].field];\n }\n }\n }\n }\n };\n Filter.prototype.updateFilterIcon = function () {\n if (this.filterSettings.columns.length === 0 && this.parent.element.querySelector('.e-filtered')) {\n var fltrIconElement = [].slice.call(this.parent.element.getElementsByClassName('e-filtered'));\n for (var i = 0, len = fltrIconElement.length; i < len; i++) {\n fltrIconElement[parseInt(i.toString(), 10)].classList.remove('e-filtered');\n }\n }\n };\n Filter.prototype.getFilterBarElement = function (col) {\n var selector = '[id=\\'' + col + '_filterBarcell\\']';\n var filterElement;\n if (selector && !isNullOrUndefined(this.element)) {\n filterElement = this.element.querySelector(selector);\n }\n return filterElement;\n };\n /**\n * @private\n * @returns {void}\n */\n Filter.prototype.refreshFilter = function () {\n this.refreshFilterSettings();\n this.updateFilterMsg();\n };\n /**\n * Clears all the filtered rows of the Grid.\n *\n * @param {string[]} fields - returns the fields\n * @returns {void}\n */\n Filter.prototype.clearFiltering = function (fields) {\n var _this = this;\n var cols = getActualPropFromColl(this.filterSettings.columns);\n if (!isNullOrUndefined(fields)) {\n this.refresh = false;\n fields.forEach(function (field) { _this.removeFilteredColsByField(field, false); });\n this.parent.setProperties({ filterSettings: { columns: this.filterSettings.columns } }, true);\n this.parent.renderModule.refresh();\n this.refresh = true;\n return;\n }\n if (isActionPrevent(this.parent)) {\n this.parent.notify(events.preventBatch, { instance: this, handler: this.clearFiltering });\n return;\n }\n for (var i = 0; i < cols.length; i++) {\n cols[parseInt(i.toString(), 10)].uid = cols[parseInt(i.toString(), 10)].uid\n || this.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field).uid;\n }\n var colUid = cols.map(function (f) { return f.uid; });\n var filteredcols = colUid.filter(function (item, pos) { return colUid.indexOf(item) === pos; });\n this.refresh = false;\n for (var i = 0, len = filteredcols.length; i < len; i++) {\n this.removeFilteredColsByField(this.parent.getColumnByUid(filteredcols[parseInt(i.toString(), 10)]).field, false);\n }\n this.refresh = true;\n if (filteredcols.length) {\n this.parent.renderModule.refresh();\n }\n if (this.parent.filterSettings.columns.length === 0 && this.parent.element.querySelector('.e-filtered')) {\n var fltrElement = [].slice.call(this.parent.element.getElementsByClassName('e-filtered'));\n for (var i = 0, len = fltrElement.length; i < len; i++) {\n fltrElement[0].classList.remove('e-filtered');\n }\n }\n this.isRemove = true;\n this.filterStatusMsg = '';\n this.updateFilterMsg();\n };\n Filter.prototype.checkAlreadyColFiltered = function (field) {\n var columns = this.filterSettings.columns;\n for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {\n var col = columns_1[_i];\n if (col.field === field && col.value === this.value &&\n col.operator === this.operator && col.predicate === this.predicate) {\n return true;\n }\n }\n return false;\n };\n Filter.prototype.columnMenuFilter = function (args) {\n this.column = args.col;\n var ele = closest(args.target, '#' + args.id);\n if (args.isClose && !ele) {\n this.filterModule.closeDialog();\n }\n else if (ele) {\n this.filterDialogOpen(this.column, args.target);\n }\n };\n Filter.prototype.filterDialogOpen = function (col, target, left, top) {\n if (this.filterModule) {\n this.filterModule.isresetFocus = false;\n this.filterModule.closeDialog();\n }\n this.setFilterModel(col);\n this.filterModule.openDialog(this.createOptions(col, target, left, top));\n };\n /**\n * Create filter dialog options\n *\n * @param {Column} col - Filtering column detail.\n * @param {Element} target - Filter dialog target.\n * @param {number} left - Filter dialog left position.\n * @param {number} top - Filter dialog top position.\n * @returns {Object} returns the created dialog options\n * @hidden\n */\n Filter.prototype.createOptions = function (col, target, left, top) {\n var gObj = this.parent;\n var dataSource = col.filter.dataSource || gObj.dataSource && 'result' in gObj.dataSource ? gObj.dataSource :\n gObj.getDataModule().dataManager;\n var type = col.filter.type || this.parent.filterSettings.type;\n var options = {\n type: col.type, field: col.field, displayName: col.headerText,\n dataSource: dataSource, format: col.format, height: 800, columns: gObj.getColumns(),\n filteredColumns: gObj.filterSettings.columns, target: target, dataManager: gObj.getDataModule().dataManager,\n formatFn: col.getFormatter(), ignoreAccent: gObj.filterSettings.ignoreAccent,\n parserFn: col.getParser(), query: gObj.query, template: col.getFilterItemTemplate(),\n hideSearchbox: isNullOrUndefined(col.filter.hideSearchbox) ? false : col.filter.hideSearchbox,\n handler: this.filterHandler.bind(this), localizedStrings: gObj.getLocaleConstants(),\n position: { X: left, Y: top }, column: col, foreignKeyValue: col.foreignKeyValue,\n actualPredicate: this.actualPredicate, localeObj: gObj.localeObj,\n isRemote: gObj.getDataModule().isRemote(), allowCaseSensitive: this.filterSettings.enableCaseSensitivity,\n isResponsiveFilter: this.parent.enableAdaptiveUI,\n operator: this.actualPredicate[col.field] && type === 'Menu' ? this.actualPredicate[col.field][0].operator : 'equal',\n parentTotalDataCount: gObj.getDataModule().isRemote() && gObj.allowPaging ? gObj.pagerModule.pagerObj.totalRecordsCount :\n gObj.getDataModule().isRemote() ? gObj.totalDataRecordsCount : gObj.getFilteredRecords().length,\n parentCurrentViewDataCount: gObj.currentViewData.length,\n parentFilteredLocalRecords: !gObj.getDataModule().isRemote() ? gObj.getFilteredRecords() : []\n };\n return options;\n };\n /**\n * Removes filtered column by field name.\n *\n * @param {string} field - Defines column field name to remove filter.\n * @param {boolean} isClearFilterBar - Specifies whether the filter bar value needs to be cleared.\n * @returns {void}\n * @hidden\n */\n Filter.prototype.removeFilteredColsByField = function (field, isClearFilterBar) {\n var fCell;\n var cols = this.filterSettings.columns;\n if (isActionPrevent(this.parent)) {\n var args = { instance: this, handler: this.removeFilteredColsByField, arg1: field, arg2: isClearFilterBar };\n this.parent.notify(events.preventBatch, args);\n return;\n }\n var colUid = cols.map(function (f) { return f.uid; });\n var filteredColsUid = colUid.filter(function (item, pos) { return colUid.indexOf(item) === pos; });\n if (!isNullOrUndefined(this.column)) {\n var col = this.column.isForeignColumn() ? this.parent.getColumnByUid(this.column.uid) :\n this.parent.getColumnByField(field);\n this.filterObjIndex = this.getFilteredColsIndexByField(col);\n this.prevFilterObject = this.filterSettings.columns[this.filterObjIndex];\n }\n var _loop_1 = function (i, len) {\n cols[parseInt(i.toString(), 10)].uid = cols[parseInt(i.toString(), 10)].uid\n || this_1.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field).uid;\n var len_1 = cols.length;\n var column = this_1.parent.grabColumnByUidFromAllCols(filteredColsUid[parseInt(i.toString(), 10)]);\n if (column.field === field || (column.field === column.foreignKeyValue && column.isForeignColumn())) {\n var currentPred = this_1.filterSettings.columns.filter(function (e) {\n return e.uid === column.uid;\n })[0];\n if (this_1.filterSettings.type === 'FilterBar' && !isClearFilterBar) {\n var selector = '[id=\\'' + column.field + '_filterBarcell\\']';\n fCell = this_1.parent.getHeaderContent().querySelector(selector);\n if (fCell) {\n fCell.value = '';\n delete this_1.values[\"\" + field];\n }\n }\n while (len_1--) {\n if (cols[parseInt(len_1.toString(), 10)].uid === column.uid) {\n cols.splice(len_1, 1);\n }\n }\n var fltrElement = this_1.parent.getColumnHeaderByField(column.field);\n if (this_1.filterSettings.type !== 'FilterBar' || this_1.parent.showColumnMenu) {\n var iconClass = this_1.parent.showColumnMenu && column.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';\n fltrElement.querySelector(iconClass).classList.remove('e-filtered');\n }\n this_1.isRemove = true;\n if (this_1.actualPredicate[\"\" + field]) {\n delete this_1.actualPredicate[\"\" + field];\n }\n if (this_1.values[\"\" + field]) {\n delete this_1.values[\"\" + field];\n }\n if (this_1.refresh) {\n this_1.parent.notify(events.modelChanged, {\n requestType: 'filtering', type: events.actionBegin, currentFilterObject: currentPred,\n currentFilterColumn: column, action: 'clearFilter'\n });\n }\n return \"break\";\n }\n };\n var this_1 = this;\n for (var i = 0, len = filteredColsUid.length; i < len; i++) {\n var state_1 = _loop_1(i, len);\n if (state_1 === \"break\")\n break;\n }\n this.updateFilterMsg();\n };\n /**\n * For internal use only - Get the module name.\n *\n * @returns {string} returns the module name\n * @private\n */\n Filter.prototype.getModuleName = function () {\n return 'filter';\n };\n Filter.prototype.keyUpHandlerImmediate = function (e) {\n if (e.keyCode !== 13) {\n this.keyUpHandler(e);\n }\n };\n Filter.prototype.keyUpHandler = function (e) {\n var gObj = this.parent;\n var target = e.target;\n if (target && matches(target, '.e-filterbar input')) {\n var closeHeaderEle = closest(target, 'th.e-filterbarcell');\n this.column = gObj.getColumnByUid(closeHeaderEle.getAttribute('e-mappinguid'));\n if (!this.column) {\n return;\n }\n if (e.action === 'altDownArrow' && this.parent.filterSettings.showFilterBarOperator) {\n var dropDownListInput = closest(target, 'span').querySelector('.e-filterbaroperator');\n dropDownListInput.ej2_instances[0].showPopup();\n dropDownListInput.focus();\n }\n if ((this.filterSettings.mode === 'Immediate' || (e.keyCode === 13 &&\n !e.target.classList.contains('e-filterbaroperator')))\n && e.keyCode !== 9 && !this.column.filterTemplate) {\n this.value = target.value.trim();\n this.processFilter(e);\n }\n }\n if (e.action === 'altDownArrow' && this.filterSettings.type !== 'FilterBar' && !parentsUntil(e.target, 'e-toolbar')\n && isNullOrUndefined(this.parent.element.querySelector('.e-filter-popup'))) {\n var element = gObj.focusModule.currentInfo.element;\n if (element && element.classList.contains('e-headercell')) {\n var column = gObj.getColumnByUid(element.firstElementChild.getAttribute('e-mappinguid'));\n this.openMenuByField(column.field);\n this.parent.focusModule.clearIndicator();\n }\n }\n if (e.action === 'escape' && this.filterSettings.type === 'Menu' && this.filterModule) {\n this.filterModule.closeDialog();\n gObj.notify(events.restoreFocus, {});\n }\n };\n Filter.prototype.updateCrossIcon = function (element) {\n if (element.value.length) {\n element.nextElementSibling.classList.remove('e-hide');\n }\n };\n Filter.prototype.updateFilterMsg = function () {\n if (this.filterSettings.type === 'FilterBar') {\n var gObj = this.parent;\n var getFormatFlValue = void 0;\n var columns = this.filterSettings.columns;\n var column = void 0;\n if (!this.filterSettings.showFilterBarStatus) {\n return;\n }\n if (columns.length > 0 && this.filterStatusMsg !== this.l10n.getConstant('InvalidFilterMessage')) {\n this.filterStatusMsg = '';\n for (var index = 0; index < columns.length; index++) {\n column = gObj.grabColumnByUidFromAllCols(columns[parseInt(index.toString(), 10)].uid)\n || gObj.grabColumnByFieldFromAllCols(columns[parseInt(index.toString(), 10)]\n .field, columns[parseInt(index.toString(), 10)].isForeignKey);\n if (index) {\n this.filterStatusMsg += ' && ';\n }\n if (!isNullOrUndefined(column.format)) {\n var flValue = (column.type === 'date' || column.type === 'datetime' || column.type === 'dateonly') ?\n this.valueFormatter.fromView(this.values[column.field], column.getParser(), (column.type === 'dateonly' ? 'date' : column.type)) :\n this.values[column.field];\n if (!(column.type === 'date' || column.type === 'datetime' || column.type === 'dateonly')) {\n var formater = this.serviceLocator.getService('valueFormatter');\n getFormatFlValue = formater.toView(flValue, column.getParser()).toString();\n }\n else {\n getFormatFlValue = this.setFormatForFlColumn(flValue, column);\n }\n this.filterStatusMsg += column.headerText + ': ' + getFormatFlValue;\n }\n else {\n this.filterStatusMsg += column.headerText + ': ' + this.values[column.field];\n }\n }\n }\n if (gObj.allowPaging) {\n gObj.updateExternalMessage(this.filterStatusMsg);\n }\n //TODO: virtual paging\n this.filterStatusMsg = '';\n }\n };\n Filter.prototype.setFormatForFlColumn = function (value, column) {\n var formater = this.serviceLocator.getService('valueFormatter');\n return formater.toView(value, column.getFormatter()).toString();\n };\n Filter.prototype.checkForSkipInput = function (column, value) {\n var isSkip;\n if (column.type === 'number') {\n if (DataUtil.operatorSymbols[\"\" + value] || this.skipNumberInput.indexOf(value) > -1) {\n isSkip = true;\n }\n }\n else if (column.type === 'string') {\n for (var _i = 0, value_1 = value; _i < value_1.length; _i++) {\n var val = value_1[_i];\n if (this.skipStringInput.indexOf(val) > -1) {\n isSkip = true;\n }\n }\n }\n return isSkip;\n };\n Filter.prototype.processFilter = function (e) {\n this.stopTimer();\n this.startTimer(e);\n };\n Filter.prototype.startTimer = function (e) {\n var _this = this;\n this.timer = window.setInterval(function () { _this.onTimerTick(); }, e.keyCode === 13 ? 0 : this.filterSettings.immediateModeDelay);\n };\n Filter.prototype.stopTimer = function () {\n window.clearInterval(this.timer);\n };\n Filter.prototype.onTimerTick = function () {\n var selector = '[id=\\'' + this.column.field + '_filterBarcell\\']';\n var filterElement = this.element.querySelector(selector);\n if (!filterElement) {\n filterElement = this.parent.getHeaderContent().querySelector(selector);\n }\n var filterValue;\n this.cellText[this.column.field] = filterElement.value;\n this.stopTimer();\n if (!isNullOrUndefined(this.column.filterBarTemplate)) {\n var templateRead = this.column.filterBarTemplate.read;\n if (typeof templateRead === 'string') {\n templateRead = getValue(templateRead, window);\n }\n if (!isNullOrUndefined(templateRead)) {\n this.value = templateRead.call(this, filterElement);\n }\n }\n else {\n filterValue = JSON.parse(JSON.stringify(filterElement.value));\n }\n if (isNullOrUndefined(this.value) || this.value === '') {\n this.removeFilteredColsByField(this.column.field);\n return;\n }\n this.validateFilterValue(this.value);\n this.filterByMethod = false;\n this.filterByColumn(this.column.field, this.operator, this.value, this.predicate, this.filterSettings.enableCaseSensitivity, this.ignoreAccent, this.column.isForeignColumn());\n this.filterByMethod = true;\n filterElement.value = filterValue;\n this.updateFilterMsg();\n };\n Filter.prototype.validateFilterValue = function (value) {\n var skipInput;\n var index;\n this.matchCase = this.filterSettings.enableCaseSensitivity;\n switch (this.column.type) {\n case 'number':\n if (this.column.filter.operator) {\n this.operator = this.column.filter.operator;\n }\n else {\n this.operator = this.filterOperators.equal;\n }\n skipInput = ['>', '<', '=', '!'];\n for (var i = 0; i < value.length; i++) {\n if (skipInput.indexOf(value[parseInt(i.toString(), 10)]) > -1) {\n index = i;\n break;\n }\n }\n this.getOperator(value.substring(index));\n if (index !== 0) {\n this.value = value.substring(0, index);\n }\n if (this.value !== '' && value.length >= 1) {\n this.value = this.valueFormatter.fromView(this.value, this.column.getParser(), this.column.type);\n }\n if (isNaN(this.value)) {\n this.filterStatusMsg = this.l10n.getConstant('InvalidFilterMessage');\n }\n break;\n case 'date':\n case 'datetime':\n this.operator = this.filterOperators.equal;\n if (this.value !== '' && !(this.value instanceof Date)) {\n this.getOperator(value);\n this.value = this.valueFormatter.fromView(this.value, this.column.getParser(), this.column.type);\n if (isNullOrUndefined(this.value)) {\n this.filterStatusMsg = this.l10n.getConstant('InvalidFilterMessage');\n }\n }\n break;\n case 'string':\n this.matchCase = false;\n if (this.column.filter.operator) {\n this.operator = this.column.filter.operator;\n }\n else {\n if (value.indexOf('*') !== -1 || value.indexOf('?') !== -1 || value.indexOf('%3f') !== -1) {\n this.operator = this.filterOperators.wildCard;\n }\n else if (value.indexOf('%') !== -1) {\n this.operator = this.filterOperators.like;\n }\n else {\n this.operator = this.filterOperators.startsWith;\n }\n }\n break;\n case 'boolean':\n if (value.toLowerCase() === 'true' || value === '1') {\n this.value = true;\n }\n else if (value.toLowerCase() === 'false' || value === '0') {\n this.value = false;\n }\n else if (value.length) {\n this.filterStatusMsg = this.l10n.getConstant('InvalidFilterMessage');\n }\n this.operator = this.filterOperators.equal;\n break;\n default:\n if (this.column.filter.operator) {\n this.operator = this.column.filter.operator;\n }\n else {\n this.operator = this.filterOperators.equal;\n }\n }\n };\n Filter.prototype.getOperator = function (value) {\n var singleOp = value.charAt(0);\n var multipleOp = value.slice(0, 2);\n var operators = extend({ '=': this.filterOperators.equal, '!': this.filterOperators.notEqual }, DataUtil.operatorSymbols);\n // eslint-disable-next-line no-prototype-builtins\n if (operators.hasOwnProperty(singleOp) || operators.hasOwnProperty(multipleOp)) {\n this.operator = operators[\"\" + singleOp];\n this.value = value.substring(1);\n if (!this.operator) {\n this.operator = operators[\"\" + multipleOp];\n this.value = value.substring(2);\n }\n }\n if (this.operator === this.filterOperators.lessThan || this.operator === this.filterOperators.greaterThan) {\n if (this.value.charAt(0) === '=') {\n this.operator = this.operator + 'orequal';\n this.value = this.value.substring(1);\n }\n }\n };\n Filter.prototype.columnPositionChanged = function () {\n if (this.parent.filterSettings.type !== 'FilterBar') {\n return;\n }\n };\n Filter.prototype.getLocalizedCustomOperators = function () {\n var numOptr = [\n { value: 'equal', text: this.l10n.getConstant('Equal') },\n { value: 'greaterthan', text: this.l10n.getConstant('GreaterThan') },\n { value: 'greaterthanorequal', text: this.l10n.getConstant('GreaterThanOrEqual') },\n { value: 'lessthan', text: this.l10n.getConstant('LessThan') },\n { value: 'lessthanorequal', text: this.l10n.getConstant('LessThanOrEqual') },\n { value: 'notequal', text: this.l10n.getConstant('NotEqual') },\n { value: 'isnull', text: this.l10n.getConstant('IsNull') },\n { value: 'isnotnull', text: this.l10n.getConstant('NotNull') }\n ];\n this.customOperators = {\n stringOperator: [\n { value: 'startswith', text: this.l10n.getConstant('StartsWith') },\n { value: 'endswith', text: this.l10n.getConstant('EndsWith') },\n { value: 'contains', text: this.l10n.getConstant('Contains') },\n { value: 'equal', text: this.l10n.getConstant('Equal') },\n { value: 'isempty', text: this.l10n.getConstant('IsEmpty') },\n { value: 'doesnotstartwith', text: this.l10n.getConstant('NotStartsWith') },\n { value: 'doesnotendwith', text: this.l10n.getConstant('NotEndsWith') },\n { value: 'doesnotcontain', text: this.l10n.getConstant('NotContains') },\n { value: 'notequal', text: this.l10n.getConstant('NotEqual') },\n { value: 'isnotempty', text: this.l10n.getConstant('IsNotEmpty') },\n { value: 'like', text: this.l10n.getConstant('Like') }\n ],\n numberOperator: numOptr,\n dateOperator: numOptr,\n datetimeOperator: numOptr,\n dateonlyOperator: numOptr,\n booleanOperator: [\n { value: 'equal', text: this.l10n.getConstant('Equal') },\n { value: 'notequal', text: this.l10n.getConstant('NotEqual') }\n ]\n };\n };\n /**\n * @param {string} field - specifies the field name\n * @returns {void}\n * @hidden\n */\n Filter.prototype.openMenuByField = function (field) {\n var gObj = this.parent;\n if (gObj.enableAdaptiveUI) {\n this.showCustomFilter(false);\n return;\n }\n var column = gObj.getColumnByField(field);\n var header = gObj.getColumnHeaderByField(field);\n var target = header.querySelector('.e-filtermenudiv');\n if (!target) {\n return;\n }\n var gClient = gObj.element.getBoundingClientRect();\n var fClient = target.getBoundingClientRect();\n this.filterDialogOpen(column, target, fClient.right - gClient.left, fClient.bottom - gClient.top);\n };\n Filter.prototype.filterIconClickHandler = function (e) {\n var target = e.target;\n if (target.classList.contains('e-filtermenudiv') && (this.parent.filterSettings.type === 'Menu' ||\n this.parent.filterSettings.type === 'CheckBox' || this.parent.filterSettings.type === 'Excel')) {\n var gObj = this.parent;\n var col = gObj.getColumnByUid(parentsUntil(target, 'e-headercell').firstElementChild.getAttribute('e-mappinguid'));\n this.column = col;\n if (this.fltrDlgDetails.field === col.field && this.fltrDlgDetails.isOpen) {\n return;\n }\n if (this.filterModule) {\n this.filterModule.closeDialog();\n }\n this.fltrDlgDetails = { field: col.field, isOpen: true };\n this.openMenuByField(col.field);\n }\n };\n Filter.prototype.clickHandler = function (e) {\n if (this.filterSettings.type === 'FilterBar' && this.filterSettings.showFilterBarOperator) {\n if (parentsUntil(e.target, 'e-filterbarcell') &&\n e.target.classList.contains('e-input-group-icon')) {\n var filterOperatorElement = closest(e.target, 'div').\n querySelector('.e-filterbaroperator');\n if (filterOperatorElement) {\n filterOperatorElement.focus();\n }\n else {\n e.target.focus();\n }\n }\n if (e.target.classList.contains('e-list-item')) {\n var inputId = document.querySelector('.e-popup-open').getAttribute('id').replace('_popup', '');\n if (inputId.indexOf('grid-column') !== -1) {\n closest(document.getElementById(inputId), 'div').querySelector('.e-filtertext').focus();\n }\n }\n }\n if (this.filterSettings.mode === 'Immediate' || this.parent.filterSettings.type === 'Menu' ||\n this.parent.filterSettings.type === 'CheckBox' || this.parent.filterSettings.type === 'Excel') {\n var target = e.target;\n var datepickerEle = target.classList.contains('e-day'); // due to datepicker popup cause\n var dialog = parentsUntil(this.parent.element, 'e-dialog');\n var hasDialog = false;\n var popupEle = parentsUntil(target, 'e-popup');\n var hasDialogClosed = this.parent.element.classList.contains('e-device') ? document.querySelector('.e-filter-popup')\n : this.parent.element.querySelector('.e-filter-popup');\n if (dialog && popupEle) {\n hasDialog = dialog.id === popupEle.id;\n }\n if ((this.filterModule && hasDialogClosed && (parentsUntil(target, 'e-excel-ascending') ||\n parentsUntil(target, 'e-excel-descending')))) {\n this.filterModule.closeDialog(target);\n }\n if (parentsUntil(target, 'e-filter-popup') || target.classList.contains('e-filtermenudiv')) {\n return;\n }\n else if (this.filterModule && !parentsUntil(target, 'e-date-overflow') && (!parentsUntil(target, 'e-popup-wrapper')\n && (!closest(target, '.e-filter-item.e-menu-item'))) && !datepickerEle\n && !(parentsUntil(target, 'e-search-wrapper') && !hasDialogClosed)) {\n if ((hasDialog && (!parentsUntil(target, 'e-filter-popup'))\n && (!parentsUntil(target, 'e-popup-flmenu'))) || (!popupEle && hasDialogClosed)) {\n this.filterModule.isresetFocus = parentsUntil(target, 'e-grid') &&\n parentsUntil(target, 'e-grid').id === this.parent.element.id && !(parentsUntil(target, 'e-search-wrapper')\n && hasDialogClosed);\n this.filterModule.closeDialog(target);\n }\n }\n }\n };\n Filter.prototype.filterHandler = function (args) {\n this.actualPredicate[args.field] = args.actualPredicate;\n this.actualData = Object.keys(this.actualPredicate);\n var dataManager = new DataManager(this.filterSettings.columns);\n var query = new Query().where('field', this.filterOperators.equal, args.field);\n this.checkboxFilterObject = dataManager.dataSource.json;\n this.checkboxPrevFilterObject = dataManager.executeLocal(query);\n for (var i = 0; i < this.checkboxPrevFilterObject.length; i++) {\n var index = -1;\n for (var j = 0; j < this.filterSettings.columns.length; j++) {\n if (this.checkboxPrevFilterObject[parseInt(i.toString(), 10)].field ===\n this.filterSettings.columns[parseInt(j.toString(), 10)].field) {\n index = j;\n break;\n }\n }\n if (index !== -1) {\n this.filterSettings.columns.splice(index, 1);\n }\n }\n if (this.values[args.field]) {\n delete this.values[args.field];\n }\n var col = this.parent.getColumnByField(args.field);\n var iconClass = this.parent.showColumnMenu && col.showColumnMenu ? '.e-columnmenu' : '.e-icon-filter';\n var filterIconElement = this.parent.getColumnHeaderByField(args.field).querySelector(iconClass);\n if (args.action === 'filtering') {\n this.filterSettings.columns = this.filterSettings.columns.concat(args.filterCollection);\n if (this.filterSettings.columns.length && filterIconElement) {\n filterIconElement.classList.add('e-filtered');\n }\n }\n else {\n if (filterIconElement) {\n filterIconElement.classList.remove('e-filtered');\n }\n args.requestType = 'filtering';\n this.parent.renderModule.refresh(args); //hot-fix onpropertychanged not working for object { array }\n }\n this.parent.dataBind();\n };\n Filter.prototype.updateFilter = function () {\n var cols = this.filterSettings.columns;\n this.actualPredicate = {};\n for (var i = 0; i < cols.length; i++) {\n this.column = this.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field) ||\n getColumnByForeignKeyValue(cols[parseInt(i.toString(), 10)].field, this.parent.getForeignKeyColumns());\n var fieldName = cols[parseInt(i.toString(), 10)].field;\n if (!this.parent.getColumnByField(cols[parseInt(i.toString(), 10)].field)) {\n fieldName = getColumnByForeignKeyValue(cols[parseInt(i.toString(), 10)].field, this.parent.getForeignKeyColumns()).field;\n }\n this.refreshFilterIcon(fieldName, cols[parseInt(i.toString(), 10)].operator, cols[parseInt(i.toString(), 10)].value, cols[parseInt(i.toString(), 10)].type, cols[parseInt(i.toString(), 10)].predicate, cols[parseInt(i.toString(), 10)].matchCase, cols[parseInt(i.toString(), 10)].ignoreAccent, cols[parseInt(i.toString(), 10)].uid);\n }\n };\n Filter.prototype.refreshFilterIcon = function (fieldName, operator, value, type, predicate, matchCase, ignoreAccent, uid) {\n var obj = {\n field: fieldName,\n predicate: predicate,\n matchCase: matchCase,\n ignoreAccent: ignoreAccent,\n operator: operator,\n value: value,\n type: type\n };\n if (this.actualPredicate[\"\" + fieldName]) {\n this.actualPredicate[\"\" + fieldName].push(obj);\n }\n else {\n this.actualPredicate[\"\" + fieldName] = [obj];\n }\n var field = uid ? this.parent.grabColumnByUidFromAllCols(uid).field : fieldName;\n this.addFilteredClass(field);\n };\n Filter.prototype.addFilteredClass = function (fieldName) {\n var filterIconElement;\n var col = this.parent.getColumnByField(fieldName);\n if (this.parent.showColumnMenu && col.showColumnMenu) {\n filterIconElement = this.parent.getColumnHeaderByField(fieldName).querySelector('.e-columnmenu');\n }\n else if (col) {\n filterIconElement = this.parent.getColumnHeaderByField(fieldName).querySelector('.e-icon-filter');\n }\n if (filterIconElement) {\n filterIconElement.classList.add('e-filtered');\n }\n };\n /**\n * @hidden\n * @returns {FilterUI} returns the FilterUI\n */\n Filter.prototype.getFilterUIInfo = function () {\n return this.filterModule ? this.filterModule.getFilterUIInfo() : {};\n };\n /**\n * @param {string} field - specifies the field name\n * @returns {string} returns the operator name\n * @hidden\n */\n Filter.prototype.getOperatorName = function (field) {\n return document.getElementById(this.parent.getColumnByField(field).uid).ej2_instances[0].value;\n };\n /**\n * Renders checkbox items in Menu filter dialog.\n *\n * @returns {void}\n */\n Filter.prototype.renderCheckboxOnFilterMenu = function () {\n return this.filterModule.renderCheckBoxMenu();\n };\n return Filter;\n}());\nexport { Filter };\n","import { EventHandler, extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { remove, select, removeClass } from '@syncfusion/ej2-base';\nimport { Toolbar as tool } from '@syncfusion/ej2-navigations';\nimport * as events from '../base/constant';\nimport { templateCompiler, appendChildren, parentsUntil, addRemoveEventListener, applyBiggerTheme } from '../base/util';\nimport { ResponsiveToolbarAction } from '../base/enum';\nimport { ContextMenu as Menu } from '@syncfusion/ej2-navigations';\nimport { calculatePosition } from '@syncfusion/ej2-popups';\nimport { SearchBox } from '../services/focus-strategy';\n/**\n *\n * The `Toolbar` module is used to handle ToolBar actions.\n */\nvar Toolbar = /** @class */ (function () {\n function Toolbar(parent, serviceLocator) {\n this.predefinedItems = {};\n this.isSearched = false;\n this.items = ['Add', 'Edit', 'Update', 'Delete', 'Cancel', 'Print', 'Search',\n 'ColumnChooser', 'PdfExport', 'ExcelExport', 'CsvExport', 'WordExport'];\n this.isRightToolbarMenu = false;\n this.parent = parent;\n this.gridID = parent.element.id;\n this.serviceLocator = serviceLocator;\n this.addEventListener();\n }\n Toolbar.prototype.render = function () {\n this.l10n = this.serviceLocator.getService('localization');\n var preItems = ['Add', 'Edit', 'Update', 'Delete', 'Cancel', 'Print',\n 'PdfExport', 'ExcelExport', 'WordExport', 'CsvExport'];\n var isAdaptive = this.parent.enableAdaptiveUI;\n var excludingItems = ['Edit', 'Delete', 'Update', 'Cancel'];\n for (var _i = 0, preItems_1 = preItems; _i < preItems_1.length; _i++) {\n var item = preItems_1[_i];\n var itemStr = item.toLowerCase();\n var localeName = itemStr[0].toUpperCase() + itemStr.slice(1);\n this.predefinedItems[\"\" + item] = {\n id: this.gridID + '_' + itemStr, prefixIcon: 'e-' + itemStr,\n text: this.l10n.getConstant(localeName), tooltipText: this.l10n.getConstant(localeName)\n };\n if (isAdaptive) {\n this.predefinedItems[\"\" + item].text = '';\n this.predefinedItems[\"\" + item].visible = excludingItems.indexOf(item) === -1;\n }\n }\n this.predefinedItems.Search = {\n id: this.gridID + '_search',\n tooltipText: this.l10n.getConstant('Search'), align: 'Right', cssClass: 'e-search-wrapper',\n type: 'Input'\n };\n this.isRightToolbarMenu = false;\n if (this.parent.enableAdaptiveUI && this.isResponsiveToolbarMenuItems(true) && ((this.parent.rowRenderingMode === 'Horizontal') ||\n (this.parent.rowRenderingMode === 'Vertical' && !this.parent.allowFiltering && !this.parent.allowSorting))) {\n this.isRightToolbarMenu = true;\n }\n if (isAdaptive && this.isResponsiveToolbarMenuItems(false)) {\n this.predefinedItems.responsiveToolbarItems = {\n id: this.gridID + '_' + 'responsivetoolbaritems', cssClass: 'e-responsive-toolbar-items e-menu-toolbar', suffixIcon: 'e-' + 'responsivetoolbaritems-btn',\n align: this.isRightToolbarMenu ? 'Left' : 'Right'\n };\n }\n else {\n this.predefinedItems.ColumnChooser = {\n id: this.gridID + '_' + 'columnchooser', cssClass: 'e-cc e-ccdiv e-cc-toolbar', suffixIcon: 'e-' + 'columnchooser-btn',\n text: isAdaptive ? '' : this.l10n.getConstant('Columnchooser'),\n tooltipText: this.l10n.getConstant('Columnchooser'), align: 'Right'\n };\n }\n if (this.parent.rowRenderingMode === 'Vertical') {\n if (this.parent.allowFiltering && this.parent.filterSettings.type !== 'FilterBar') {\n this.predefinedItems.responsiveFilter = {\n id: this.gridID + '_' + 'responsivefilter', cssClass: 'e-gridresponsiveicons e-icons',\n suffixIcon: 'e-' + 'resfilter-icon', tooltipText: this.l10n.getConstant('FilterButton')\n };\n }\n if (this.parent.allowSorting) {\n this.predefinedItems.responsiveSort = {\n id: this.gridID + '_' + 'responsivesort', cssClass: 'e-gridresponsiveicons e-icons',\n suffixIcon: 'e-' + 'ressort-icon', tooltipText: this.l10n.getConstant('Sort')\n };\n }\n }\n if (this.parent.enableAdaptiveUI && this.parent.toolbar && this.parent.toolbar.indexOf('Search') > -1) {\n this.predefinedItems.responsiveBack = {\n id: this.gridID + '_' + 'responsiveback', cssClass: 'e-gridresponsiveicons e-icons',\n suffixIcon: 'e-' + 'resback-icon', visible: false\n };\n }\n this.createToolbar();\n if (this.parent.enableAdaptiveUI) {\n if (isNullOrUndefined(this.responsiveToolbarMenu)) {\n this.renderResponsiveToolbarpopup();\n }\n if (this.toolbar.element) {\n this.toolbar.refreshOverflow();\n }\n }\n };\n Toolbar.prototype.isResponsiveToolbarMenuItems = function (isRight) {\n var items = isRight ? ['Add', 'Edit', 'Delete', 'Search'] : ['Print', 'ColumnChooser', 'PdfExport', 'ExcelExport', 'CsvExport'];\n var toolbarItems = this.parent.toolbar || [];\n for (var i = 0; i < items.length; i++) {\n if (toolbarItems.indexOf(items[parseInt(i.toString(), 10)]) >= 0) {\n return isRight ? false : true;\n }\n }\n return isRight ? true : false;\n };\n /**\n * Gets the toolbar of the Grid.\n *\n * @returns {Element} returns the element\n * @hidden\n */\n Toolbar.prototype.getToolbar = function () {\n return this.toolbar.element;\n };\n /**\n * Destroys the ToolBar.\n *\n * @function destroy\n * @returns {void}\n */\n Toolbar.prototype.destroy = function () {\n if (this.toolbar && !this.toolbar.isDestroyed) {\n if (this.responsiveToolbarMenu) {\n this.responsiveToolbarMenu.destroy();\n }\n if (!this.toolbar.element) {\n this.parent.destroyTemplate(['toolbarTemplate']);\n if (this.parent.isReact) {\n this.parent.renderTemplates();\n }\n }\n else {\n this.toolbar.off('render-react-toolbar-template', this.addReactToolbarPortals);\n this.toolbar.destroy();\n }\n this.unWireEvent();\n this.removeEventListener();\n if (this.element.parentNode) {\n remove(this.element);\n }\n }\n };\n Toolbar.prototype.bindSearchEvents = function () {\n this.searchElement = select('#' + this.gridID + '_searchbar', this.element);\n this.wireEvent();\n this.refreshToolbarItems();\n if (this.parent.searchSettings) {\n this.updateSearchBox();\n }\n };\n Toolbar.prototype.toolbarCreated = function (isNormal) {\n if (this.element.querySelector('.e-search-wrapper')) {\n if (!this.parent.enableAdaptiveUI || isNormal) {\n var classList = this.parent.cssClass ? 'e-input-group e-search ' + this.parent.cssClass\n : 'e-input-group e-search';\n this.element.querySelector('.e-search-wrapper').innerHTML = '
    \\\n \\\n \\\n \\\n
    ';\n }\n else {\n this.element.querySelector('.e-search-wrapper').innerHTML = '\\\n \\\n
    ';\n }\n }\n if (this.element.querySelector('.e-responsive-toolbar-items')) {\n this.element.querySelector('.e-responsive-toolbar-items').innerHTML = '