{"version":3,"file":"ej2.min.js","sources":["../node_modules/@syncfusion/ej2-base/dist/src/es5/util.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/dom.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/notify-property-change.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/animation.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/internationalization.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/template.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/template-engine.js","../node_modules/@syncfusion/ej2-buttons/dist/src/es5/common/common.js","../node_modules/@syncfusion/ej2-popups/dist/src/es5/common/position.js","../node_modules/@syncfusion/ej2-popups/dist/src/es5/common/collision.js","../node_modules/@syncfusion/ej2-popups/dist/src/es5/popup/popup.js","../node_modules/@syncfusion/ej2-popups/dist/src/es5/spinner/spinner.js","../node_modules/@syncfusion/ej2-inputs/dist/src/es5/maskedtextbox/base/mask-base.js","../node_modules/@syncfusion/ej2-lists/dist/src/es5/common/list-base.js","../node_modules/@syncfusion/ej2-file-utils/dist/src/es5/encoding.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/collections/utils.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/model/theme.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/utils/helper.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/model/acc-base.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/utils/helper.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/common/incremental-search.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/common/highlight-search.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/multi-select/float-label.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/base/util.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/aria-service.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/utils/helper.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/utils/helper.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/base/util.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/recurrence-editor/date-generator.js","../node_modules/@syncfusion/ej2-splitbuttons/dist/src/es5/common/common.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/ajax.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/event-handler.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/observer.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/base.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/browser.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/intl/intl-base.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/canvas-renderer.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/module-loader.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/child-property.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/intl/parser-base.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/intl/number-formatter.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/intl/date-formatter.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/component.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/intl/date-parser.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/intl/number-parser.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/draggable.js","../node_modules/@syncfusion/ej2-inputs/dist/src/es5/input/input.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/droppable.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/keyboard.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/l10n.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/svg-renderer.js","../node_modules/@syncfusion/ej2-base/dist/src/es5/touch.js","../node_modules/@syncfusion/ej2-buttons/dist/src/es5/button/button.js","../node_modules/@syncfusion/ej2-buttons/dist/src/es5/check-box/check-box.js","../node_modules/@syncfusion/ej2-buttons/dist/src/es5/radio-button/radio-button.js","../node_modules/@syncfusion/ej2-popups/dist/src/es5/dialog/dialog.js","../node_modules/@syncfusion/ej2-popups/dist/src/es5/tooltip/tooltip.js","../node_modules/@syncfusion/ej2-inputs/dist/src/es5/numerictextbox/numerictextbox.js","../node_modules/@syncfusion/ej2-inputs/dist/src/es5/form-validator/form-validator.js","../node_modules/@syncfusion/ej2-inputs/dist/src/es5/maskedtextbox/maskedtextbox/maskedtextbox.js","../node_modules/@syncfusion/ej2-inputs/dist/src/es5/slider/slider.js","../node_modules/@syncfusion/ej2-inputs/dist/src/es5/uploader/uploader.js","../node_modules/@syncfusion/ej2-data/dist/src/es5/query.js","../node_modules/@syncfusion/ej2-data/dist/src/es5/util.js","../node_modules/@syncfusion/ej2-data/dist/src/es5/adaptors.js","../node_modules/@syncfusion/ej2-data/dist/src/es5/manager.js","../node_modules/@syncfusion/ej2-lists/dist/src/es5/list-view/list-view.js","../node_modules/@syncfusion/ej2-calendars/dist/src/es5/timepicker/timepicker.js","../node_modules/@syncfusion/ej2-calendars/dist/src/es5/calendar/calendar.js","../node_modules/@syncfusion/ej2-calendars/dist/src/es5/datepicker/datepicker.js","../node_modules/@syncfusion/ej2-calendars/dist/src/es5/daterangepicker/daterangepicker.js","../node_modules/@syncfusion/ej2-calendars/dist/src/es5/datetimepicker/datetimepicker.js","../node_modules/@syncfusion/ej2-file-utils/dist/src/es5/save.js","../node_modules/@syncfusion/ej2-file-utils/dist/src/es5/stream-writer.js","../node_modules/@syncfusion/ej2-compression/dist/src/es5/compression-writer.js","../node_modules/@syncfusion/ej2-compression/dist/src/es5/zip-archive.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/collections/dictionary.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-string.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-name.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/pdf-operators.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/pdf-dictionary-properties.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-dictionary.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-number.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-array.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-stream.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/enum.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-reference.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/actions/action.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/actions/uri-action.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/pdf-color.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/enum.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/drawing/pdf-drawing.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/brushes/pdf-brush.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/brushes/pdf-solid-brush.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/pdf-string-format.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/string-layouter.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/string-tokenizer.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/pdf-font.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/enum.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/pdf-writer.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/pdf-main-object-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/cross-table.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/pdf-document-base.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/pdf-catalog.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/enum.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/pdf-cross-table.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-page-size.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/pdf-margins.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/images/image-decoder.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-page-settings.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/input-output/pdf-stream-writer.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/pdf-pen.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/pdf-transformation-matrix.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/constants.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/collections/object-object-pair/dictionary.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/pdf-transparency.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/automatic-field-info-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/figures/base/graphics-element.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/automatic-field.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/automatic-field-info.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/pdf-graphics.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-page-layer.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/general/pdf-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-page-layer-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/figures/pdf-template.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/images/byte-array.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/primitives/pdf-boolean.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/figures/enum.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/unit-convertor.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/images/pdf-image.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/images/pdf-bitmap.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/pdf-resources.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-page-base.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/annotations/annotation-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-page.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/page-added-event-arguments.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-section-page-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/pdf-document-template.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-section-templates.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-section.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-section-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-document-page-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/general/pdf-cache-collection.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/pdf-document.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/pdf-font-metrics.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/pdf-standard-font-metrics-factory.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/fonts/pdf-standard-font.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/annotations/annotation.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/annotations/link-annotation.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/annotations/action-link-annotation.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/annotations/document-link-annotation.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/figures/base/element-layouter.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/general/enum.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/figures/layout-element.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/figures/base/text-layouter.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/graphics/figures/text-element.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/annotations/uri-annotation.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/annotations/pdf-text-web-link.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/pdf-numbers-convertor.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/pdf-template-value-pair.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/multiple-value-field.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/pdf-page-number-field.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/composite-field.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/single-value-field.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/document/automatic-fields/page-count-field.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/general/pdf-destination.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/structured-elements/tables/light-tables/enum.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/pages/pdf-page-template-element.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/structured-elements/grid/styles/pdf-borders.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/structured-elements/grid/styles/style.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/structured-elements/grid/pdf-grid-cell.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/structured-elements/grid/pdf-grid-column.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/structured-elements/grid/pdf-grid-row.js","../node_modules/@syncfusion/ej2-pdf-export/dist/src/es5/implementation/structured-elements/grid/pdf-grid.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/model/base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/utils/double-range.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/double-axis.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/model/constants.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/model/chart-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/axis.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/cartesian-panel.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/utils/get-data.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/chart-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/model/data.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/marker-explode.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/marker.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/legend/legend.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/technical-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/utils/export.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/chart.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/axis-helper.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/date-time-axis.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/category-axis.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/logarithmic-axis.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/date-time-category-axis.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/strip-line.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/line-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/line-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/column-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/column-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/multi-colored-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/area-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/bar-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/polar-radar-panel.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/polar-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/radar-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/stacking-bar-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/candle-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/stacking-column-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/step-line-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/step-area-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/stacking-area-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/scatter-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/range-column-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/waterfall-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/hilo-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/hilo-open-close-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/range-area-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/bubble-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/spline-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/spline-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/spline-area-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/indicator-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/sma-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/ema-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/tma-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/ad-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/atr-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/momentum-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/rsi-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/stochastic-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/bollinger-bands.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/technical-indicators/macd-indicator.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/trend-lines/trend-line.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/user-interaction/crosshair.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/user-interaction/tooltip.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/user-interaction/tooltip.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/user-interaction/zooming-toolkit.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/user-interaction/zooming.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/user-interaction/selection.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/user-interaction/selection.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/data-label.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/error-bar.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/legend/legend.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/common/annotation/annotation.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/annotation/annotation.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/box-and-whisker-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/multi-colored-area-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/series/multi-colored-line-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/chart/axis/multi-level-labels.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/accumulation-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/pie-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/pie-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/accumulation.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/triangular-base.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/funnel-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/pyramid-series.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/legend.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/renderer/dataLabel.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/user-interaction/tooltip.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/user-interaction/selection.js","../node_modules/@syncfusion/ej2-charts/dist/src/es5/accumulation-chart/annotation/annotation.js","../charts.ts","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/model/theme.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/model/base.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/axes/axis.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/annotations/annotations.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/model/constants.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/user-interaction/tooltip.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/axes/axis-renderer.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/axes/pointer-renderer.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/axes/axis-panel.js","../node_modules/@syncfusion/ej2-circulargauge/dist/src/es5/circular-gauge/circular-gauge.js","../circulargauge.ts","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/drop-down-base/drop-down-base.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/drop-down-list/drop-down-list.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/combo-box/combo-box.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/auto-complete/auto-complete.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/multi-select/multi-select.js","../node_modules/@syncfusion/ej2-dropdowns/dist/src/es5/multi-select/checkbox-selection.js","../dropdowns.ts","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/base/enum.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/cell-style.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/cell.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/column.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/row.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/worksheets.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/worksheet.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/value-formatter.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/csv-helper.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/blob-helper.js","../node_modules/@syncfusion/ej2-excel-export/dist/src/es5/workbook.js","../node_modules/@syncfusion/ej2-navigations/dist/src/es5/common/h-scroll.js","../node_modules/@syncfusion/ej2-navigations/dist/src/es5/toolbar/toolbar.js","../node_modules/@syncfusion/ej2-navigations/dist/src/es5/accordion/accordion.js","../node_modules/@syncfusion/ej2-navigations/dist/src/es5/context-menu/context-menu.js","../node_modules/@syncfusion/ej2-navigations/dist/src/es5/tab/tab.js","../node_modules/@syncfusion/ej2-navigations/dist/src/es5/treeview/treeview.js","../node_modules/@syncfusion/ej2-navigations/dist/src/es5/sidebar/sidebar.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/value-formatter.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/models/column.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/base/constant.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/checkbox-filter.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/data.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/models/row.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/models/cell.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/cell-merge-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/row-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/row-model-generator.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/summary-model-generator.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/group-model-generator.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/content-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/header-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/header-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/stacked-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/indent-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/caption-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/expand-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/header-indent-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/detail-header-indent-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/detail-expand-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/render.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/cell-render-factory.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/service-locator.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/renderer-factory.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/width-controller.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/focus-strategy.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/models/page-settings.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/selection.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/search.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/show-hide.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/scroll.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/print.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/models/aggregate.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/clipboard.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/base/grid.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/sort.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/pager/numeric-container.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/pager/pager-message.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/pager/pager.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/pager/pager-dropdown.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/pager/external-message.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/page.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/filter-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/filter-menu-operator.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/string-filter-ui.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/number-filter-ui.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/boolean-filter-ui.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/date-filter-ui.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/filter-menu-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/excel-filter.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/filter.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/resize.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/reorder.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/row-reorder.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/group.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/detail-row.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/toolbar.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/footer-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/summary-cell-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/aggregate.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/intersection-observer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/virtual-row-model-generator.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/virtual-content-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/virtual-scroll.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/inline-edit-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/batch-edit-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/dialog-edit-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/edit-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/boolean-edit-cell.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/dropdown-edit-cell.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/numeric-edit-cell.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/default-edit-cell.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/normal-edit.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/inline-edit.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/batch-edit.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/dialog-edit.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/datepicker-edit-cell.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/edit.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/column-chooser.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/export-helper.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/excel-export.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/pdf-export.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/command-column-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/command-column.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/context-menu.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/services/freeze-row-model-generator.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/renderer/freeze-renderer.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/freeze.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/column-menu.js","../node_modules/@syncfusion/ej2-grids/dist/src/es5/grid/actions/foreign-key.js","../grids.ts","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/model/base.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/axes/axis.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/axes/axis-panel.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/axes/animation.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/axes/axis-renderer.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/annotations/annotations.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/user-interaction/tooltip.js","../node_modules/@syncfusion/ej2-lineargauge/dist/src/es5/linear-gauge/linear-gauge.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/model/theme.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/model/base.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/model/constants.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/bing-map.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/color-mapping.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/layer-panel.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/user-interaction/annotation.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/utils/export.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/maps.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/bubble.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/marker.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/data-label.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/navigation-selected-line.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/layers/legend.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/user-interaction/highlight.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/user-interaction/selection.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/user-interaction/tooltip.js","../node_modules/@syncfusion/ej2-maps/dist/src/es5/maps/user-interaction/zoom.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/base/constant.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/header-renderer.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/actions/scroll.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/actions/touch.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/actions/keyboard.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/actions/data.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/timezone/timezone.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/event-renderer/event-base.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/actions/crud.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/popups/form-validator.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/popups/quick-popups.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/popups/event-tooltip.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/recurrence-editor/recurrence-editor.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/popups/event-window.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/renderer.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/models/work-hours.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/models/fields.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/models/event-settings.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/base/schedule.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/view-base.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/actions/work-cells.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/event-renderer/vertical-view.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/vertical-view.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/day.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/week.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/work-week.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/event-renderer/month.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/month.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/event-renderer/agenda-base.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/agenda.js","../node_modules/@syncfusion/ej2-schedule/dist/src/es5/schedule/renderer/month-agenda.js","../schedule.ts","../node_modules/@syncfusion/ej2-splitbuttons/dist/src/es5/drop-down-button/drop-down-button.js","../node_modules/@syncfusion/ej2-splitbuttons/dist/src/es5/split-button/split-button.js"],"sourcesContent":["var instances = 'ej2_instances';\nvar uid = 0;\n/**\n * Create Instance from constructor function with desired parameters.\n * @param {Function} classFunction - Class function to which need to create instance\n * @param {any[]} params - Parameters need to passed while creating instance\n * @return {any}\n * @private\n */\nexport function createInstance(classFunction, params) {\n var arrayParam = params;\n arrayParam.unshift(undefined);\n return new (Function.prototype.bind.apply(classFunction, arrayParam));\n}\n/**\n * To run a callback function immediately after the browser has completed other operations.\n * @param {Function} handler - callback function to be triggered.\n * @return {Function}\n * @private\n */\nexport function setImmediate(handler) {\n var unbind;\n var num = new Uint16Array(5);\n var intCrypto = window.msCrypto || window.crypto;\n intCrypto.getRandomValues(num);\n var secret = 'ej2' + combineArray(num);\n var messageHandler = function (event) {\n if (event.source === window && typeof event.data === 'string' && event.data.length <= 32 && event.data === secret) {\n handler();\n unbind();\n }\n };\n window.addEventListener('message', messageHandler, false);\n window.postMessage(secret, '*');\n return unbind = function () {\n window.removeEventListener('message', messageHandler);\n };\n}\n/**\n * To get nameSpace value from the desired object.\n * @param {string} nameSpace - String value to the get the inner object\n * @param {any} obj - Object to get the inner object value.\n * @return {any}\n * @private\n */\nexport function getValue(nameSpace, obj) {\n /* tslint:disable no-any */\n var value = obj;\n var splits = nameSpace.split('.');\n for (var i = 0; i < splits.length && !isUndefined(value); i++) {\n value = value[splits[i]];\n }\n return value;\n}\n/**\n * To set value for the nameSpace in desired object.\n * @param {string} nameSpace - String value to the get the inner object\n * @param {any} value - Value that you need to set.\n * @param {any} obj - Object to get the inner object value.\n * @return {void}\n * @private\n */\nexport function setValue(nameSpace, value, obj) {\n var keys = nameSpace.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 ? {} : value;\n }\n else if (isNullOrUndefined(fromObj[key])) {\n fromObj[key] = {};\n }\n fromObj = fromObj[key];\n }\n return start;\n}\n/**\n * Delete an item from Object\n * @param {any} obj - Object in which we need to delete an item.\n * @param {string} params - String value to the get the inner object\n * @return {void}\n * @private\n */\nexport function deleteObject(obj, key) {\n delete obj[key];\n}\n/**\n * Check weather the given argument is only object.\n * @param {any} obj - Object which is need to check.\n * @return {boolean}\n * @private\n */\nexport function isObject(obj) {\n var objCon = {};\n return (!isNullOrUndefined(obj) && obj.constructor === objCon.constructor);\n}\n/**\n * To get enum value by giving the string.\n * @param {any} enumObject - Enum object.\n * @param {string} enumValue - Enum value to be searched\n * @return {any}\n * @private\n */\nexport function getEnumValue(enumObject, enumValue) {\n return enumObject[enumValue];\n}\n/**\n * Merge the source object into destination object.\n * @param {any} source - source object which is going to merge with destination object\n * @param {any} destination - object need to be merged\n * @return {void}\n * @private\n */\nexport function merge(source, destination) {\n if (!isNullOrUndefined(destination)) {\n var temrObj = source;\n var tempProp = destination;\n var keys = Object.keys(destination);\n for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {\n var key = keys_1[_i];\n temrObj[key] = tempProp[key];\n }\n }\n}\n/**\n * Extend the two object with newer one.\n * @param {any} copied - Resultant object after merged\n * @param {Object} first - First object need to merge\n * @param {Object} second - Second object need to merge\n * @return {Object}\n * @private\n */\nexport function extend(copied, first, second, deep) {\n var result = copied || {};\n var length = arguments.length;\n if (deep) {\n length = length - 1;\n }\n var _loop_1 = function (i) {\n if (!arguments_1[i]) {\n return \"continue\";\n }\n var obj1 = arguments_1[i];\n Object.keys(obj1).forEach(function (key) {\n var src = result[key];\n var copy = obj1[key];\n var clone;\n if (deep && isObject(copy)) {\n clone = isObject(src) ? src : {};\n result[key] = extend({}, clone, copy, true);\n }\n else {\n result[key] = copy;\n }\n });\n };\n var arguments_1 = arguments;\n for (var i = 1; i < length; i++) {\n _loop_1(i);\n }\n return result;\n}\n/**\n * To check whether the object is null or undefined.\n * @param {Object} value - To check the object is null or undefined\n * @return {boolean}\n * @private\n */\nexport function isNullOrUndefined(value) {\n return value === undefined || value === null;\n}\n/**\n * To check whether the object is undefined.\n * @param {Object} value - To check the object is undefined\n * @return {boolean}\n * @private\n */\nexport function isUndefined(value) {\n return ('undefined' === typeof value);\n}\n/**\n * To return the generated unique name\n * @param {string} definedName - To concatenate the unique id to provided name\n * @return {string}\n * @private\n */\nexport function getUniqueID(definedName) {\n return definedName + '_' + uid++;\n}\n/**\n * It limits the rate at which a function can fire. The function will fire only once every provided second instead of as quickly.\n * @param {Function} eventFunction - Specifies the function to run when the event occurs\n * @param {number} delay - A number that specifies the milliseconds for function delay call option\n * @return {Function}\n * @private\n */\nexport function debounce(eventFunction, delay) {\n var out;\n // tslint:disable-next-line\n return function () {\n var _this = this;\n var args = arguments;\n var later = function () {\n out = null;\n return eventFunction.apply(_this, args);\n };\n clearTimeout(out);\n out = setTimeout(later, delay);\n };\n}\n// Added since lint ignored after added '//tslint:disable-next-line' \n/* tslint:disable:no-any */\n/**\n * To convert the object to string for query url\n * @param {Object} data\n * @returns string\n * @private\n */\nexport function queryParams(data) {\n var array = [];\n var keys = Object.keys(data);\n for (var _i = 0, keys_2 = keys; _i < keys_2.length; _i++) {\n var key = keys_2[_i];\n array.push(encodeURIComponent(key) + '=' + encodeURIComponent('' + data[key]));\n }\n return array.join('&');\n}\n/**\n * To check whether the given array contains object.\n * @param {T[]} value- Specifies the T type array to be checked.\n * @private\n */\nexport function isObjectArray(value) {\n var parser = Object.prototype.toString;\n if (parser.call(value) === '[object Array]') {\n if (parser.call(value[0]) === '[object Object]') {\n return true;\n }\n }\n return false;\n}\n/**\n * To check whether the child element is descendant to parent element or parent and child are same element.\n * @param{Element} - Specifies the child element to compare with parent.\n * @param{Element} - Specifies the parent element.\n * @return boolean\n * @private\n */\nexport function compareElementParent(child, parent) {\n var node = child;\n if (node === parent) {\n return true;\n }\n else if (node === document || !node) {\n return false;\n }\n else {\n return compareElementParent(node.parentNode, parent);\n }\n}\n/**\n * To throw custom error message.\n * @param{string} - Specifies the error message to be thrown.\n * @private\n */\nexport function throwError(message) {\n try {\n throw new Error(message);\n }\n catch (e) {\n throw e.message + '\\n' + e.stack;\n }\n}\n/**\n * This function is used to print given element\n * @param{Element} element - Specifies the print content element.\n * @param{Window} printWindow - Specifies the print window.\n * @private\n */\nexport function print(element, printWindow) {\n var div = document.createElement('div');\n var links = [].slice.call(document.getElementsByTagName('head')[0].querySelectorAll('link, style'));\n var reference = '';\n if (isNullOrUndefined(printWindow)) {\n printWindow = window.open('', 'print', 'height=452,width=1024,tabbar=no');\n }\n div.appendChild(element.cloneNode(true));\n for (var i = 0, len = links.length; i < len; i++) {\n reference += links[i].outerHTML;\n }\n printWindow.document.write('
' + reference + '' + div.innerHTML +\n '' + '');\n printWindow.document.close();\n printWindow.focus();\n // tslint: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 * @param {number|string} value\n * @return {string} result\n * @private\n */\nexport function formatUnit(value) {\n var result = value + '';\n if (result === 'auto' || result.indexOf('%') !== -1 || result.indexOf('px') !== -1) {\n return result;\n }\n return result + 'px';\n}\n/**\n * Function to fetch the Instances of a HTML element for the given component.\n * @param {string | HTMLElement} element\n * @param {any} component\n * @return {Object} inst\n * @private\n */\n// tslint:disable-next-line\nexport function getInstance(element, component) {\n // tslint:disable-next-line:no-any\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 * @param {string | HTMLElement} element\n * @param {Object} instance\n * @return {void}\n * @private\n */\nexport function addInstance(element, instance) {\n // tslint:disable-next-line:no-any\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 * @return {string}\n * @private\n */\nexport function uniqueID() {\n // tslint:disable-next-line:no-any\n var num = new Uint16Array(5);\n var intCrypto = window.msCrypto || window.crypto;\n return intCrypto.getRandomValues(num);\n}\nfunction combineArray(num) {\n var ret = '';\n for (var i = 0; i < 5; i++) {\n ret += (i ? ',' : '') + num[i];\n }\n return ret;\n}\n","/**\n * Functions related to dom operations.\n */\nimport { EventHandler } from './event-handler';\nimport { isNullOrUndefined } from './util';\n/**\n * Function to create Html element.\n * @param tagName - Name of the tag, id and class names.\n * @param properties - Object to set properties in the element.\n * @param properties.id - To set the id to the created element.\n * @param properties.className - To add classes to the element.\n * @param properties.innerHTML - To set the innerHTML to element.\n * @param properties.styles - To set the some custom styles to element.\n * @param properties.attrs - To set the attributes to element.\n * @private\n */\nexport function createElement(tagName, properties) {\n var element = 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 * @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 * @private\n */\nexport function addClass(elements, classes) {\n var classList = getClassList(classes);\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 (!ele.classList.contains(className)) {\n ele.classList.add(className);\n }\n }\n }\n return elements;\n}\n/**\n * The function used to add the classes to array of elements\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 * @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 if (ele.className !== '') {\n for (var _b = 0, classList_2 = classList; _b < classList_2.length; _b++) {\n var className = classList_2[_b];\n ele.classList.remove(className);\n }\n }\n }\n return elements;\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 * @param {Element|Node} element - An element the need to check visibility\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 * @param {Element[]|NodeList} fromElements - An array of elements that need to prepend.\n * @param {Element} toElement - An element that is going to prepend.\n * @private\n */\nexport function prepend(fromElements, toElement) {\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 return fromElements;\n}\n/**\n * The function used to insert an array of elements into last of the element.\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 * @private\n */\nexport function append(fromElements, toElement) {\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.appendChild(docFrag);\n return fromElements;\n}\n/**\n * The function used to remove the element from the\n * @param {Element|Node|HTMLElement} element - An element that is going to detach from the Dom\n * @private\n */\nexport function detach(element) {\n var parentNode = element.parentNode;\n return parentNode.removeChild(element);\n}\n/**\n * The function used to remove the element from Dom also clear the bounded events\n * @param {Element|Node|HTMLElement} element - An element remove from the Dom\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 * @param {Element|Node} element - An element that need to set attributes.\n * @param {{[key:string]:string}} attributes - JSON Object that is going to as attributes.\n * @private\n */\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 ele.setAttribute(key, attributes[key]);\n }\n return ele;\n}\n/**\n * The function selects the element from giving context.\n * @param {string} selector - Selector string need fetch element from the\n * @param {Document|Element=document} context - It is an optional type, That specifies a Dom context.\n * @private\n */\nexport function select(selector, context) {\n if (context === void 0) { context = document; }\n return context.querySelector(selector);\n}\n/**\n * The function selects an array of element from the given context.\n * @param {string} selector - Selector string need fetch element from the\n * @param {Document|Element=document} context - It is an optional type, That specifies a Dom context.\n * @private\n */\nexport function selectAll(selector, context) {\n if (context === void 0) { context = document; }\n var nodeList = context.querySelectorAll(selector);\n return nodeList;\n}\n/**\n * Returns single closest parent element based on class selector.\n * @param {Element} element - An element that need to find the closest element.\n * @param {string} selector - A classSelector of closest 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 * @param {Element|Node} element - An element that need to get siblings.\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 * @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 * @private\n */\nexport function getAttributeOrDefault(element, property, value) {\n var attrVal = element.getAttribute(property);\n if (isNullOrUndefined(attrVal)) {\n element.setAttribute(property, value.toString());\n attrVal = value;\n }\n return attrVal;\n}\n/**\n * Set the style attributes to Html element.\n * @param {HTMLElement} element - Element which we want to set attributes\n * @param {any} attrs - Set the given attributes to element\n * @return {void}\n * @private\n */\nexport function setStyleAttribute(element, attrs) {\n if (attrs !== undefined) {\n Object.keys(attrs).forEach(function (key) {\n // tslint:disable-next-line:no-any\n element.style[key] = attrs[key];\n });\n }\n}\n/**\n * Method for add and remove classes to a dom element.\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 * @return {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 * @param {Element} element - Element to compare with the selector.\n * @param {string} selector - String selector which element will satisfy.\n * @return {void}\n * @private\n */\nexport function matches(element, selector) {\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","import { createInstance, isUndefined, merge, extend, getValue } from './util';\n/**\n * Returns the Class Object\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 */\nfunction getObject(instance, curKey, defaultValue, type) {\n if (!instance.properties.hasOwnProperty(curKey)) {\n instance.properties[curKey] = createInstance(type, [instance, curKey, defaultValue]);\n }\n return instance.properties[curKey];\n}\n/**\n * Returns object array\n * @param {ClassObject} instance\n * @param {string} curKey\n * @param {Object[]} defaultValue\n * @param type\n * @param {boolean} isSetter\n * @returns {Object[]}\n */\nfunction getObjectArray(instance, curKey, defaultValue, type, isSetter, isFactory) {\n var result = [];\n var len = defaultValue.length;\n for (var i = 0; i < len; i++) {\n var curType = type;\n if (isFactory) {\n curType = type(defaultValue[i]);\n }\n if (isSetter) {\n var inst = createInstance(curType, [instance, curKey, {}, true]);\n inst.setProperties(defaultValue[i], true);\n result.push(inst);\n }\n else {\n result.push(createInstance(curType, [instance, curKey, defaultValue[i], true]));\n }\n }\n return result;\n}\n/**\n * Returns the properties of the object\n * @param {Object} defaultValue\n * @param {string} curKey\n */\nfunction propertyGetter(defaultValue, curKey) {\n return function () {\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 * @param {Object} defaultValue\n * @param {string} curKey\n */\nfunction propertySetter(defaultValue, curKey) {\n return function (newValue) {\n if (this.properties[curKey] !== newValue) {\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 */\nfunction complexGetter(defaultValue, curKey, type) {\n return function () {\n return getObject(this, curKey, defaultValue, type);\n };\n}\n/**\n * Sets complex objects\n */\nfunction complexSetter(defaultValue, curKey, type) {\n return function (newValue) {\n getObject(this, curKey, defaultValue, type).setProperties(newValue);\n };\n}\nfunction complexFactoryGetter(defaultValue, curKey, type) {\n return function () {\n var curType = type({});\n return getObject(this, curKey, defaultValue, curType);\n };\n}\nfunction complexFactorySetter(defaultValue, curKey, type) {\n return function (newValue) {\n var curType = type(newValue);\n getObject(this, curKey, defaultValue, curType).setProperties(newValue);\n };\n}\nfunction complexArrayGetter(defaultValue, curKey, type) {\n return function () {\n if (!this.properties.hasOwnProperty(curKey)) {\n var defCollection = getObjectArray(this, curKey, defaultValue, type, false);\n this.properties[curKey] = defCollection;\n }\n return this.properties[curKey];\n };\n}\nfunction complexArraySetter(defaultValue, curKey, type) {\n return function (newValue) {\n var oldValueCollection = getObjectArray(this, curKey, defaultValue, type, false);\n var newValCollection = getObjectArray(this, curKey, newValue, type, true);\n this.saveChanges(curKey, newValCollection, oldValueCollection);\n this.properties[curKey] = newValCollection;\n };\n}\nfunction complexArrayFactorySetter(defaultValue, curKey, type) {\n return function (newValue) {\n var oldValueCollection = getObjectArray(this, curKey, defaultValue, type, false, true);\n var newValCollection = getObjectArray(this, curKey, newValue, type, true, true);\n this.saveChanges(curKey, newValCollection, oldValueCollection);\n this.properties[curKey] = newValCollection;\n };\n}\nfunction complexArrayFactoryGetter(defaultValue, curKey, type) {\n return function () {\n var curType = type({});\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 * Method used to create property. General syntax below.\n * @param {T} defaultValue? - Specifies the default value of property.\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 * @param {T} defaultValue - Specifies the default value of property.\n * @param {Function} type - Specifies the class type of complex object.\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 * @param {Function} defaultType - Specifies the default value of property.\n * @param {Function} type - Specifies the class factory type of complex object.\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 * @param {T[]} defaultValue - Specifies the default value of property.\n * @param {Function} type - Specifies the class type of complex object.\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 * @param {T[]} defaultType - Specifies the default type of property.\n * @param {Function} type - Specifies the class type of complex object.\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 * @param {Function} defaultValue? - Specifies the default value of property.\n * @param {boolean} isComplex? - Specifies the whether it is complex object.\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 * ```\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 */\nexport function NotifyPropertyChanges(classConstructor) {\n /** Need to code */\n}\n/**\n * Method used to create the builderObject for the target component.\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 /* tslint:disable no-any */\n target.propList[propertyType + 's'].push({\n propertyName: key,\n defaultValue: defaultValue,\n type: type\n });\n target.propList[propertyType + 'Names'].push(key);\n /* tslint:enable no-any */\n}\n/**\n * Returns an object containing the builder properties\n * @param {Function} component\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 * @param {any} component -specifies the target component for which builder to be created.\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 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 * @param {Object} context\n * @param {string} prefix\n * @private\n */\nfunction getParentContext(context, prefix) {\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 = 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 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 * @param {string | HTMLElement} element - Element which needs to be animated.\n * @param {AnimationModel} options - Overriding default animation settings.\n * @return {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 * @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 * @param {AnimationModel} model\n * @returns {void}\n */\n Animation.delayAnimation = function (model) {\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 * Triggers animation\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 startTime = 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 * @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 */\n Animation.prototype.onPropertyChanged = function (newProp, oldProp) {\n // no code needed\n };\n /**\n * Returns module name as animation\n * @private\n */\n Animation.prototype.getModuleName = function () {\n return 'animation';\n };\n /**\n * @private\n */\n Animation.prototype.destroy = function () {\n //Override base destroy;\n };\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 var Animation_1;\n}(Base));\nexport { Animation };\n/**\n * Ripple provides material theme's wave effect when an element is clicked\n * ```html\n * \n * \n * ```\n * @private\n * @param HTMLElement element - Target element\n * @param RippleOptions rippleOptions - Ripple options .\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 }\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}\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 * @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;\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 * @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 * @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 * @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 * @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","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 } 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 * @private\n */\nexport var cldrData = {};\n/**\n * Specifies the default culture value to be considered.\n * @private\n */\nexport var defaultCulture = 'en-US';\n/**\n * Specifies default currency code to be considered\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 * @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 * @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 return NumberFormat.numberFormatter(this.getCulture(), options || {}, cldrData);\n };\n /**\n * Returns the parser function for given options.\n * @param {DateFormatOptions} options - Specifies the format options in which the parser function will return.\n * @returns {Function}\n * @private\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 * @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 return NumberParser.numberParser(this.getCulture(), options || { format: 'N' }, cldrData);\n };\n /**\n * Returns the formatted string based on format options.\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 * @param {Number} 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 * @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 * @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 * @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 * @param {NumberFormatOptions} option - Specifies the parse options for resultant number pattern.\n * @returns {string}\n * @private\n */\n Internationalization.prototype.getNumberPattern = function (option) {\n return IntlBase.getActualNumberFormat(this.getCulture(), option, cldrData);\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 * @param {string} cultureName - Specifies the culture name to be set as default culture.\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 * @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 * @param {Object[]} obj 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 * @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 * @param {string} locale - Specifies the locale for which numericObject to be returned.\n * @ignore\n * @private\n */\nexport function getNumericObject(locale, type) {\n /* tslint:disable no-any */\n var numObject = IntlBase.getDependables(cldrData, locale, true)[mapper[0]];\n var dateObject = IntlBase.getDependables(cldrData, locale)[mapper[1]];\n var numSystem = getValue('defaultNumberingSystem', numObject);\n var symbPattern = 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 default date CLDR object.\n * @ignore\n * @private\n */\nexport function getDefaultDateObject() {\n return IntlBase.getDependables(cldrData, '', false)[mapper[1]];\n}\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 exp = new RegExp('\\\\${([^}]*)}', 'g');\n// let cachedTemplate: Object = {};\n/**\n * The function to set regular expression for template expression string.\n * @param {RegExp} value - Value expression.\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 * @param {string} template - The template string which is going to convert.\n * @param {Object} helper? - Helper functions as an object.\n * @private\n */\nexport function compile(template, helper) {\n var argName = 'data';\n var evalExpResult = evalExp(template, argName, helper);\n var fnCode = \"var str=\\\"\" + evalExpResult + \"\\\"; return str;\";\n // tslint:disable-next-line:no-function-constructor-with-string-args\n var fn = new Function(argName, fnCode);\n return fn.bind(helper);\n}\n// function used to evaluate the function expression\nfunction evalExp(str, nameSpace, helper) {\n /**\n * Variable containing Local Keys\n */\n var localKeys = [];\n return str.replace(LINES, '').replace(DBL_QUOTED_STR, '\\'$1\\'').replace(exp, function (match, cnt, offset, matchStr) {\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);\n })) + '{ \\n str = str + \"';\n }\n else if (IF_STMT.test(cnt)) {\n //handling if condition\n cnt = '\"; ' + cnt.replace(matches[1], rlStr.replace(WORD, function (strs) {\n strs = strs.trim();\n return addNameSpace(strs, !(QUOTES.test(strs)) && (localKeys.indexOf(strs) === -1), nameSpace, localKeys);\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 cnt = '\"; ' + cnt.replace(matches[1], function (mtc) {\n localKeys.push(rlStr_1[0]);\n localKeys.push(rlStr_1[0] + 'Index');\n return 'var i=0; i < ' + addNameSpace(rlStr_1[1], true, nameSpace, localKeys) + '.length; i++';\n }) + '{ \\n ' + rlStr_1[0] + '= ' + addNameSpace(rlStr_1[1], true, nameSpace, localKeys)\n + '[i]; \\n var ' + rlStr_1[0] + 'Index=i; \\n str = str + \"';\n }\n else {\n //helper function handling\n var fnStr = cnt.split('(');\n var fNameSpace = (helper && helper.hasOwnProperty(fnStr[0]) ? 'this.' : 'global');\n fNameSpace = (/\\./.test(fnStr[0]) ? '' : fNameSpace);\n cnt = '\" + ' + (fNameSpace === 'global' ? '' : fNameSpace) +\n cnt.replace(rlStr, addNameSpace(matches[1].replace(',', nameSpace + '.'), (fNameSpace === 'global' ? false : true), nameSpace, localKeys)) +\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 }\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 {\n // evaluate normal expression\n cnt = '\"+' + addNameSpace(cnt, (localKeys.indexOf(cnt) === -1), nameSpace, localKeys) + '+\"';\n }\n return cnt;\n });\n}\nfunction addNameSpace(str, addNS, nameSpace, ignoreList) {\n return ((addNS && !(NOT_NUMBER.test(str)) && ignoreList.indexOf(str.split('.')[0]) === -1) ? 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 * Template Engine Bridge\n */\nimport { compile as render } from './template';\nimport { createElement } from './dom';\nvar HAS_ROW = /^[\\n\\r.]+\\
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}\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 var topData = '';\n var 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}\nexport function flip(element, target, offsetX, offsetY, positionX, positionY, viewPortElement, axis, 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 var eEdge = {\n TL: null,\n TR: null,\n BL: null,\n BR: null\n };\n var elementRect = element.getBoundingClientRect();\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);\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);\n}\nfunction setPopup(element, pos) {\n var left = 0;\n var 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');\n left = data.left;\n top = data.top;\n }\n element.style.top = (pos.position.top + pos.offsetY - (top)) + 'px';\n element.style.left = (pos.position.left + pos.offsetX - (left)) + 'px';\n}\nfunction updateElementData(target, edge, pos, fixedParent) {\n pos.position = calculatePosition(target, pos.posX, pos.posY, fixedParent);\n edge.TL = calculatePosition(target, 'left', 'top', fixedParent);\n edge.TR = calculatePosition(target, 'right', 'top', fixedParent);\n edge.BR = calculatePosition(target, 'left', 'bottom', fixedParent);\n edge.BL = calculatePosition(target, 'right', 'bottom', fixedParent);\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}\nfunction leftCollideCheck(left, right) {\n var leftSide = false;\n var 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}\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);\n setPosition(edge, pos, elementRect);\n if (deepCheck) {\n leftFlip(target, edge, tEdge, pos, elementRect, false);\n }\n }\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()) {\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);\n setPosition(edge, pos, elementRect);\n if (deepCheck) {\n topFlip(target, edge, tEdge, pos, elementRect, false);\n }\n }\n}\nfunction topCollideCheck(top, bottom) {\n var topSide = false;\n var 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}\nfunction getTargetContainerWidth() {\n return targetContainer.getBoundingClientRect().width;\n}\nfunction getTargetContainerHeight() {\n return targetContainer.getBoundingClientRect().height;\n}\nfunction getTargetContainerLeft() {\n return targetContainer.getBoundingClientRect().left;\n}\nfunction getTargetContainerTop() {\n return targetContainer.getBoundingClientRect().top;\n}\nfunction ContainerTop() {\n if (targetContainer) {\n return getTargetContainerTop();\n }\n return 0;\n}\nfunction ContainerLeft() {\n if (targetContainer) {\n return getTargetContainerLeft();\n }\n return 0;\n}\nfunction ContainerRight() {\n if (targetContainer) {\n return (getBodyScrollLeft() + getTargetContainerLeft() + getTargetContainerWidth());\n }\n return (getBodyScrollLeft() + getViewPortWidth());\n}\nfunction ContainerBottom() {\n if (targetContainer) {\n return (getBodyScrollTop() + getTargetContainerTop() + getTargetContainerHeight());\n }\n return (getBodyScrollTop() + getViewPortHeight());\n}\nfunction getBodyScrollTop() {\n // if(targetContainer)\n // return targetContainer.scrollTop;\n return parentDocument.documentElement.scrollTop || parentDocument.body.scrollTop;\n}\nfunction getBodyScrollLeft() {\n // if(targetContainer)\n // return targetContainer.scrollLeft;\n return parentDocument.documentElement.scrollLeft || parentDocument.body.scrollLeft;\n}\nfunction getViewPortHeight() {\n return window.innerHeight;\n}\nfunction getViewPortWidth() {\n return window.innerWidth;\n}\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 } 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 var _this = _super.call(this, options, element) || this;\n _this.fixedParent = false;\n return _this;\n }\n /**\n * Called internally if any of the property value changed.\n * @private\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 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 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 * @private\n */\n Popup.prototype.getModuleName = function () {\n return 'popup';\n };\n /**\n * gets the persisted state properties of the Component.\n */\n Popup.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * To destroy the control.\n */\n Popup.prototype.destroy = function () {\n this.element.classList.remove(CLASSNAMES.ROOT, CLASSNAMES.RTL);\n this.unwireEvents();\n _super.prototype.destroy.call(this);\n };\n /**\n * To Initialize the control rendering\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.setEnableRtl();\n this.setContent();\n this.wireEvents();\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 === '' ? 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 (!(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 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 = relateToElement.getBoundingClientRect();\n if (!rect.height || !rect.width) {\n return false;\n }\n if (scrollElement.getBoundingClientRect) {\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 * @private\n */\n Popup.prototype.preRender = function () {\n //There is no event handler\n };\n Popup.prototype.setEnableRtl = function () {\n this.reposition();\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 this.element.appendChild(this.content);\n }\n }\n };\n Popup.prototype.orientationOnChange = function () {\n var _this = this;\n setTimeout(function () {\n _this.refreshPosition();\n }, 200);\n };\n /**\n * Based on the `relative` element and `offset` values, `Popup` element position will refreshed.\n */\n Popup.prototype.refreshPosition = function (target) {\n if (!isNullOrUndefined(target)) {\n this.checkFixedParent(target);\n }\n this.reposition();\n this.checkCollision();\n };\n Popup.prototype.reposition = function () {\n var pos;\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 (relateToElement) {\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);\n this.element.style.display = display;\n }\n else {\n pos = { left: 0, top: 0 };\n }\n this.element.style.left = pos.left + 'px';\n this.element.style.top = pos.top + 'px';\n };\n Popup.prototype.getAnchorPosition = function (anchorEle, ele, position, offsetX, offsetY) {\n var eleRect = ele.getBoundingClientRect();\n var anchorRect = anchorEle.getBoundingClientRect();\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 anchorPos = calculateRelativeBasedPosition(anchor, ele);\n }\n switch (position.X) {\n default:\n case 'left':\n break;\n case 'center':\n 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 (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 (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 (this.targetType === 'container') {\n anchorPos.top += (anchorRect.height - eleRect.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 var data = fit(this.element, this.viewPortElement, param);\n this.element.style.left = data.left + 'px';\n this.element.style.top = data.top + 'px';\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 === 'fit') {\n this.callFit({ X: true, Y: false });\n }\n else if (vert === 'fit') {\n this.callFit({ X: false, Y: true });\n }\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 }\n };\n /**\n * Shows the popup element from screen.\n * @param { AnimationModel | Function } collisionOrAnimationOptions? - To pass animation options or collision function.\n * @param { Function } collision? - To pass the collision function.\n */\n Popup.prototype.show = function (animationOptions) {\n var _this = this;\n if (this.zIndex === 1000) {\n this.zIndex = getZindexPartial(this.element);\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 * @param { AnimationModel } animationOptions? - To give the animation options.\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 };\n /**\n * Gets scrollable parent elements for the given element.\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' && this.element.offsetParent && this.element.offsetParent.tagName === 'BODY') {\n this.element.style.position = 'fixed';\n this.fixedParent = true;\n }\n parent = parent.parentElement;\n if (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 * @param { HTMLElement } element - Specify the element to get the scrollable parents of it.\n * @private\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 * @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 //Body direct children element traversal\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 finalValue = parentZindex.concat(childrenZindex);\n return Math.max.apply(Math, finalValue) + 1;\n}\n","import { isNullOrUndefined, classList } from '@syncfusion/ej2-base';\nvar globalTimeOut = {};\nvar spinTemplate = null;\nvar spinCSSClass = null;\nvar DEFT_MAT_WIDTH = 30;\nvar DEFT_FAB_WIDTH = 30;\nvar DEFT_BOOT_WIDTH = 30;\nvar CLS_SHOWSPIN = 'e-spin-show';\nvar CLS_HIDESPIN = 'e-spin-hide';\nvar CLS_MATERIALSPIN = 'e-spin-material';\nvar CLS_FABRICSPIN = 'e-spin-fabric';\nvar CLS_BOOTSPIN = 'e-spin-bootstrap';\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';\n/**\n * Create a spinner for the specified target element.\n * ```\n * E.g : createSpinner({ target: targetElement, width: '34px', label: 'Loading..' });\n * ```\n * @param args\n * @private\n */\nexport function createSpinner(args) {\n var radius;\n var container = create_spinner_container(args.target);\n if (!isNullOrUndefined(args.cssClass)) {\n container.wrap.classList.add(args.cssClass);\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);\n if (!isNullOrUndefined(args.label)) {\n createLabel(container.inner_wrap, args.label);\n }\n }\n container.wrap.classList.add(CLS_HIDESPIN);\n}\nfunction createLabel(container, label) {\n var labelEle = document.createElement('div');\n labelEle.classList.add(CLS_SPINLABEL);\n labelEle.textContent = label;\n container.appendChild(labelEle);\n return labelEle;\n}\nfunction createMaterialSpinner(container, radius) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'Material', radius: radius };\n create_material_element(container, uniqueID);\n mat_calculate_attributes(radius, container);\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 var spinnerInfo = { uniqueID: uniqueID, container: container, globalInfo: globalObject, timeOutVar: timeOutVar };\n animateMaterial(spinnerInfo);\n}\nfunction createFabricSpinner(container, radius) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'Fabric', radius: radius };\n create_fabric_element(container, uniqueID, CLS_FABRICSPIN);\n fb_calculate_attributes(radius, container, CLS_FABRICSPIN);\n}\nfunction createHighContrastSpinner(container, radius) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'HighContrast', radius: radius };\n create_fabric_element(container, uniqueID, CLS_HIGHCONTRASTSPIN);\n fb_calculate_attributes(radius, container, CLS_HIGHCONTRASTSPIN);\n}\nfunction getTheme(container) {\n var theme = window.getComputedStyle(container, ':after').getPropertyValue('content');\n return theme.replace(/['\"]+/g, '');\n}\nfunction setTheme(theme, container, radius) {\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);\n break;\n case 'Fabric':\n createFabricSpinner(innerContainer, radius);\n break;\n case 'Bootstrap':\n createBootstrapSpinner(innerContainer, radius);\n break;\n case 'HighContrast':\n createHighContrastSpinner(innerContainer, radius);\n break;\n }\n}\nfunction createBootstrapSpinner(innerContainer, radius) {\n var uniqueID = random_generator();\n globalTimeOut[uniqueID] = { timeOut: 0, type: 'Bootstrap', radius: radius };\n create_bootstrap_element(innerContainer, uniqueID);\n boot_calculate_attributes(innerContainer, radius);\n}\nfunction create_bootstrap_element(innerContainer, uniqueID) {\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}\nfunction boot_calculate_attributes(innerContainer, radius) {\n var svg = innerContainer.querySelector('svg.e-spin-bootstrap');\n svg.style.width = svg.style.height = radius + 'px';\n var x = 0;\n var y = 0;\n var rad = 24;\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}\nfunction generateSeries(begin, stop) {\n var series = [];\n var start = begin;\n var end = stop;\n var increment = false;\n var count = 1;\n formSeries(start);\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}\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 function rotation(circle, start, end, series, id) {\n var count = 0;\n boot_animate(start);\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 globalTimeOut[id].timeOut = setTimeout(boot_animate.bind(null, series[count]), 18);\n }\n }\n }\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}\nfunction calculateRadius(width, theme) {\n var defaultSize = theme === 'Material' ? DEFT_MAT_WIDTH : theme === 'Fabric' ? DEFT_FAB_WIDTH : DEFT_BOOT_WIDTH;\n width = width ? parseFloat(width + '') : defaultSize;\n return theme === 'Bootstrap' ? width : width / 2;\n}\nfunction globalVariables(id, radius, count, previousId) {\n return {\n radius: radius,\n count: count,\n previousId: previousId\n };\n}\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}\nfunction create_fabric_element(innerContainer, uniqueID, themeClass) {\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 innerContainer.insertBefore(svgFabric, innerContainer.firstChild);\n svgFabric.appendChild(fabricCirclePath);\n svgFabric.appendChild(fabricCircleArc);\n}\nfunction create_material_element(innerContainer, uniqueID) {\n var svgMaterial = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n svgMaterial.setAttribute('class', CLS_MATERIALSPIN);\n svgMaterial.setAttribute('id', uniqueID);\n var matCirclePath = document.createElementNS('http://www.w3.org/2000/svg', 'path');\n matCirclePath.setAttribute('class', CLS_SPINCIRCLE);\n innerContainer.insertBefore(svgMaterial, innerContainer.firstChild);\n svgMaterial.appendChild(matCirclePath);\n}\nfunction create_spinner_container(target) {\n var spinnerContainer = document.createElement('div');\n spinnerContainer.classList.add(CLS_SPINWRAP);\n var spinnerInnerContainer = document.createElement('div');\n spinnerInnerContainer.classList.add(CLS_SPININWRAP);\n target.appendChild(spinnerContainer);\n spinnerContainer.appendChild(spinnerInnerContainer);\n return { wrap: spinnerContainer, inner_wrap: spinnerInnerContainer };\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}\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 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 globalTimeOut[spinnerInfo.uniqueID].timeOut = setTimeout(mat_animation.bind(null, spinnerInfo), 1);\n }\n else {\n animateMaterial(spinnerInfo);\n }\n }\n function updatePath(value, container) {\n if ((!isNullOrUndefined(container.querySelector('svg.e-spin-material')))\n && (!isNullOrUndefined(container.querySelector('svg.e-spin-material').querySelector('path.e-path-circle')))) {\n var svg = container.querySelector('svg.e-spin-material');\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}\nfunction mat_calculate_attributes(radius, container) {\n var diameter = radius * 2;\n var svg = container.querySelector('svg.e-spin-material');\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('stroke-width', strokeSize + '');\n path.setAttribute('d', drawArc(diameter, strokeSize));\n path.setAttribute('stroke-dasharray', ((diameter - strokeSize) * Math.PI * 0.75) + '');\n path.setAttribute('stroke-dashoffset', getDashOffset(diameter, strokeSize, 1, 75) + '');\n}\nfunction getSize(value) {\n var parsed = parseFloat(value);\n return parsed;\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}\nfunction getStrokeSize(diameter) {\n return 10 / 100 * diameter;\n}\nfunction getDashOffset(diameter, strokeSize, value, max) {\n return (diameter - strokeSize) * Math.PI * ((3 * (max) / 100) - (value / 100));\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}\nfunction fb_calculate_attributes(radius, innerConainer, trgClass) {\n var centerX = radius;\n var centerY = radius;\n var diameter = radius * 2;\n var startArc = 315;\n var 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}\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}\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}\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 * @param container - Specify the target of the Spinner.\n * @private\n */\nexport function showSpinner(container) {\n showHideSpinner(container, false);\n}\nfunction showHideSpinner(container, isHide) {\n var spinnerWrap = container.classList.contains(CLS_SPINWRAP) ? container :\n container.querySelector('.' + CLS_SPINWRAP);\n var inner = spinnerWrap.querySelector('.' + CLS_SPININWRAP);\n var spinCheck;\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 isHide ? clearTimeout(globalTimeOut[id].timeOut) : startMatAnimate(inner, id, globalTimeOut[id].radius);\n break;\n case 'Bootstrap':\n isHide ? clearTimeout(globalTimeOut[id].timeOut) : animateBootstrap(inner);\n break;\n }\n }\n isHide ? classList(spinnerWrap, [CLS_HIDESPIN], [CLS_SHOWSPIN]) : classList(spinnerWrap, [CLS_SHOWSPIN], [CLS_HIDESPIN]);\n}\n/**\n * Function to hide the Spinner.\n * @param container - Specify the target of the Spinner.\n * @private\n */\nexport function hideSpinner(container) {\n showHideSpinner(container, true);\n}\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 * @param args\n * @private\n */\nexport function setSpinner(args) {\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);\n }\n}\nfunction ensureTemplate(template, container, theme, cssClass) {\n if (isNullOrUndefined(template) && !container.classList.contains(CLS_SPINTEMPLATE)) {\n replaceTheme(container, theme, cssClass);\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 }\n}\nfunction replaceTheme(container, theme, cssClass) {\n if (!isNullOrUndefined(cssClass)) {\n container.classList.add(cssClass);\n }\n var svgElement = container.querySelector('svg');\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);\n}\n","/**\n * MaskedTextBox base module\n */\nimport { EventHandler, isNullOrUndefined, merge, attributes, addClass, removeClass, Browser } from '@syncfusion/ej2-base';\nimport { Input } from '../../input/input';\nvar ERROR = 'e-error';\nvar INPUTGROUP = 'e-input-group';\nvar FLOATINPUT = 'e-float-input';\nvar UTILMASK = 'e-utility-mask';\nvar TOPLABEL = 'e-label-top';\nvar BOTTOMLABEL = 'e-label-bottom';\n/**\n * @hidden\n * Built-in masking elements collection.\n */\nexport var regularExpressions = {\n '0': '[0-9]',\n '9': '[0-9 ]',\n '#': '[0-9 +-]',\n 'L': '[A-Za-z]',\n '?': '[A-Za-z ]',\n '&': '[^\\x7f ]+',\n 'C': '[^\\x7f]+',\n 'A': '[A-Za-z0-9]',\n 'a': '[A-Za-z0-9 ]',\n};\n/**\n * @hidden\n * Generate required masking elements to the MaskedTextBox from user mask input.\n */\nexport function createMask() {\n attributes(this.element, { 'role': 'textbox', 'autocomplete': 'off', 'autocorrect': 'off', 'autocapitalize': 'off',\n 'spellcheck': 'false', 'aria-live': 'assertive', 'aria-valuenow': '' });\n if (this.mask) {\n var splitMask = this.mask.split(']');\n for (var i = 0; i < splitMask.length; i++) {\n if (splitMask[i][splitMask[i].length - 1] === '\\\\') {\n splitMask[i] = splitMask[i] + ']';\n var splitInnerMask = splitMask[i].split('[');\n for (var j = 0; j < splitInnerMask.length; j++) {\n if (splitInnerMask[j][splitInnerMask[j].length - 1] === '\\\\') {\n splitInnerMask[j] = splitInnerMask[j] + '[';\n }\n pushIntoRegExpCollec.call(this, splitInnerMask[j]);\n }\n }\n else {\n var splitInnerMask = splitMask[i].split('[');\n if (splitInnerMask.length > 1) {\n var chkSpace = false;\n for (var j = 0; j < splitInnerMask.length; j++) {\n if (splitInnerMask[j] === '\\\\') {\n this.customRegExpCollec.push('[');\n this.hiddenMask += splitInnerMask[j] + '[';\n }\n else if (splitInnerMask[j] === '') {\n chkSpace = true;\n }\n else if ((splitInnerMask[j] !== '' && chkSpace) || j === splitInnerMask.length - 1) {\n this.customRegExpCollec.push('[' + splitInnerMask[j] + ']');\n this.hiddenMask += this.promptChar;\n chkSpace = false;\n }\n else {\n pushIntoRegExpCollec.call(this, splitInnerMask[j]);\n }\n }\n }\n else {\n pushIntoRegExpCollec.call(this, splitInnerMask[0]);\n }\n }\n }\n this.escapeMaskValue = this.hiddenMask;\n this.promptMask = this.hiddenMask.replace(/[09?LCAa#&]/g, this.promptChar);\n if (!isNullOrUndefined(this.customCharacters)) {\n for (var i = 0; i < this.promptMask.length; i++) {\n if (!isNullOrUndefined(this.customCharacters[this.promptMask[i]])) {\n this.promptMask = this.promptMask.replace(new RegExp(this.promptMask[i], 'g'), this.promptChar);\n }\n }\n }\n var escapeNumber = 0;\n if (this.hiddenMask.match(new RegExp(/\\\\/))) {\n for (var i = 0; i < this.hiddenMask.length; i++) {\n var j = 0;\n if (i >= 2) {\n j = i;\n }\n escapeNumber = this.hiddenMask.length - this.promptMask.length;\n j = j - escapeNumber;\n if ((i > 0 && this.hiddenMask[i - 1] !== '\\\\') && (this.hiddenMask[i] === '>' ||\n this.hiddenMask[i] === '<' || this.hiddenMask[i] === '|')) {\n this.promptMask = this.promptMask.substring(0, j) +\n this.promptMask.substring((i + 1) - escapeNumber, this.promptMask.length);\n this.escapeMaskValue = this.escapeMaskValue.substring(0, j) +\n this.escapeMaskValue.substring((i + 1) - escapeNumber, this.escapeMaskValue.length);\n }\n if (this.hiddenMask[i] === '\\\\') {\n this.promptMask = this.promptMask.substring(0, j) + this.hiddenMask[i + 1] +\n this.promptMask.substring((i + 2) - escapeNumber, this.promptMask.length);\n this.escapeMaskValue = this.escapeMaskValue.substring(0, j) + this.escapeMaskValue[i + 1] +\n this.escapeMaskValue.substring((i + 2) - escapeNumber, this.escapeMaskValue.length);\n }\n }\n }\n else {\n this.promptMask = this.promptMask.replace(/[>|<]/g, '');\n this.escapeMaskValue = this.hiddenMask.replace(/[>|<]/g, '');\n }\n attributes(this.element, { 'aria-invalid': 'false' });\n }\n}\n/**\n * @hidden\n * Apply mask ability with masking elements to the MaskedTextBox.\n */\nexport function applyMask() {\n setElementValue.call(this, this.promptMask);\n setMaskValue.call(this, this.value);\n}\n/**\n * @hidden\n * To wire required events to the MaskedTextBox.\n */\nexport function wireEvents() {\n EventHandler.add(this.element, 'keydown', maskInputKeyDownHandler, this);\n EventHandler.add(this.element, 'keypress', maskInputKeyPressHandler, this);\n EventHandler.add(this.element, 'keyup', maskInputKeyUpHandler, this);\n EventHandler.add(this.element, 'focus', maskInputFocusHandler, this);\n EventHandler.add(this.element, 'blur', maskInputBlurHandler, this);\n EventHandler.add(this.element, 'paste', maskInputPasteHandler, this);\n EventHandler.add(this.element, 'cut', maskInputCutHandler, this);\n EventHandler.add(this.element, 'drop', maskInputDropHandler, this);\n}\n/**\n * @hidden\n * To unwire events attached to the MaskedTextBox.\n */\nexport function unwireEvents() {\n EventHandler.remove(this.element, 'keydown', maskInputKeyDownHandler);\n EventHandler.remove(this.element, 'keypress', maskInputKeyPressHandler);\n EventHandler.remove(this.element, 'keyup', maskInputKeyUpHandler);\n EventHandler.remove(this.element, 'focus', maskInputFocusHandler);\n EventHandler.remove(this.element, 'blur', maskInputBlurHandler);\n EventHandler.remove(this.element, 'paste', maskInputPasteHandler);\n EventHandler.remove(this.element, 'cut', maskInputCutHandler);\n}\n/**\n * @hidden\n * To get masked value from the MaskedTextBox.\n */\nexport function unstrippedValue(element) {\n return element.value;\n}\n/**\n * @hidden\n * To extract raw value from the MaskedTextBox.\n */\nexport function strippedValue(element) {\n var value = '';\n var k = 0;\n var checkMask = false;\n if (!isNullOrUndefined(element) && !isNullOrUndefined(this) && element.value !== this.promptMask) {\n for (var i = 0; i < this.customRegExpCollec.length; i++) {\n if (checkMask) {\n checkMask = false;\n }\n if (this.customRegExpCollec[k] === '>' || this.customRegExpCollec[k] === '<' ||\n this.customRegExpCollec[k] === '|' || this.customRegExpCollec[k] === '\\\\') {\n --i;\n checkMask = true;\n }\n if (!checkMask) {\n if ((element.value[i] !== this.promptChar) && (!isNullOrUndefined(this.customRegExpCollec[k]) &&\n ((!isNullOrUndefined(this.regExpCollec[this.customRegExpCollec[k]])) ||\n (this.customRegExpCollec[k].length > 2 && this.customRegExpCollec[k][0] === '[' &&\n this.customRegExpCollec[k][this.customRegExpCollec[k].length - 1] === ']') ||\n (!isNullOrUndefined(this.customCharacters) &&\n (!isNullOrUndefined(this.customCharacters[this.customRegExpCollec[k]]))))) && (element.value !== '')) {\n value += element.value[i];\n }\n }\n ++k;\n }\n }\n return value;\n}\nfunction pushIntoRegExpCollec(value) {\n for (var k = 0; k < value.length; k++) {\n this.hiddenMask += value[k];\n if (value[k] !== '\\\\') {\n this.customRegExpCollec.push(value[k]);\n }\n }\n}\nexport function maskInputFocusHandler(event) {\n var _this = this;\n if (this.promptMask.length > 0) {\n this.focusEventArgs = { selectionStart: 0, selectionEnd: this.promptMask.length };\n }\n else {\n this.focusEventArgs = { selectionStart: 0, selectionEnd: this.element.value.length };\n }\n var eventArgs = {};\n merge(eventArgs, this.focusEventArgs);\n this.trigger('focus', eventArgs);\n this.focusEventArgs = eventArgs;\n if (this.mask) {\n this.isFocus = true;\n if (this.placeholder && this.element.value === '') {\n setElementValue.call(this, this.promptMask);\n this.element.setSelectionRange(this.focusEventArgs.selectionStart, this.focusEventArgs.selectionEnd);\n setTimeout(function () {\n _this.element.setSelectionRange(_this.focusEventArgs.selectionStart, _this.focusEventArgs.selectionEnd);\n }, 1);\n }\n else {\n this.element.setSelectionRange(this.focusEventArgs.selectionStart, this.focusEventArgs.selectionEnd);\n }\n }\n}\nexport function maskInputBlurHandler(event) {\n if (this.mask) {\n this.isFocus = false;\n if (this.placeholder && this.element.value === this.promptMask && this.floatLabelType !== 'Always') {\n setElementValue.call(this, '');\n var labelElement = this.element.parentNode.querySelector('.e-float-text');\n if (this.floatLabelType === 'Auto' && !isNullOrUndefined(labelElement) && labelElement.classList.contains(TOPLABEL)) {\n removeClass([labelElement], TOPLABEL);\n }\n }\n }\n}\nfunction maskInputPasteHandler(event) {\n var _this = this;\n if (this.mask) {\n var sIndex_1 = this.element.selectionStart;\n var eIndex_1 = this.element.selectionEnd;\n var oldValue_1 = this.element.value;\n setElementValue.call(this, '');\n setTimeout(function () {\n var value = _this.element.value;\n if (_this.redoCollec.length > 0 && _this.redoCollec[0].value === _this.element.value) {\n value = strippedValue.call(_this, _this.element);\n }\n setElementValue.call(_this, oldValue_1);\n _this.element.selectionStart = sIndex_1;\n _this.element.selectionEnd = eIndex_1;\n var i = 0;\n _this.maskKeyPress = true;\n do {\n validateValue.call(_this, value[i], false, null);\n ++i;\n } while (i < value.length);\n _this.maskKeyPress = false;\n }, 1);\n }\n}\nfunction maskInputCutHandler(event) {\n var _this = this;\n if (this.mask) {\n var sIndex_2 = this.element.selectionStart;\n var eIndex = this.element.selectionEnd;\n this.undoCollec.push({ value: this.element.value, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd });\n var value_1 = this.element.value.substring(0, sIndex_2) + this.promptMask.substring(sIndex_2, eIndex) +\n this.element.value.substring(eIndex);\n setTimeout(function () {\n setElementValue.call(_this, value_1);\n _this.element.selectionStart = _this.element.selectionEnd = sIndex_2;\n }, 0);\n }\n}\nexport function maskInputDropHandler(event) {\n event.preventDefault();\n}\nfunction maskInputKeyDownHandler(event) {\n var _this = this;\n if (this.mask) {\n if (event.keyCode !== 229) {\n if (event.ctrlKey && (event.keyCode === 89 || event.keyCode === 90)) {\n event.preventDefault();\n }\n removeMaskInputValues.call(this, event);\n }\n else {\n setTimeout(function () {\n removeMaskInputValues.call(_this, event);\n }, 0);\n }\n var startValue = this.element.value;\n if (event.ctrlKey && (event.keyCode === 89 || event.keyCode === 90)) {\n var collec = void 0;\n if (event.keyCode === 90 && this.undoCollec.length > 0 && startValue !== this.undoCollec[this.undoCollec.length - 1].value) {\n collec = this.undoCollec[this.undoCollec.length - 1];\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart,\n endIndex: this.element.selectionEnd\n });\n setElementValue.call(this, collec.value);\n this.element.selectionStart = collec.startIndex;\n this.element.selectionEnd = collec.endIndex;\n this.undoCollec.splice(this.undoCollec.length - 1, 1);\n }\n else if (event.keyCode === 89 && this.redoCollec.length > 0 && startValue !== this.redoCollec[0].value) {\n collec = this.redoCollec[0];\n this.undoCollec.push({\n value: this.element.value, startIndex: this.element.selectionStart,\n endIndex: this.element.selectionEnd\n });\n setElementValue.call(this, collec.value);\n this.element.selectionStart = collec.startIndex;\n this.element.selectionEnd = collec.endIndex;\n this.redoCollec.splice(0, 1);\n }\n }\n }\n}\nexport function mobileRemoveFunction() {\n var collec;\n var sIndex = this.element.selectionStart;\n var eIndex = this.element.selectionEnd;\n if (this.redoCollec.length > 0) {\n collec = this.redoCollec[0];\n setElementValue.call(this, collec.value);\n if ((collec.startIndex - sIndex) === 1) {\n this.element.selectionStart = collec.startIndex;\n this.element.selectionEnd = collec.endIndex;\n }\n else {\n this.element.selectionStart = sIndex + 1;\n this.element.selectionEnd = eIndex + 1;\n }\n }\n else {\n setElementValue.call(this, this.promptMask);\n this.element.selectionStart = this.element.selectionEnd = sIndex;\n }\n}\nfunction removeMaskInputValues(event) {\n var isRemove = false;\n var oldEventVal;\n var isDeleted = false;\n if (this.element.value.length < this.promptMask.length) {\n isRemove = true;\n mobileRemoveFunction.call(this);\n oldEventVal = this.element.value;\n }\n var initStartIndex = this.element.selectionStart;\n var initEndIndex = this.element.selectionEnd;\n var startIndex = this.element.selectionStart;\n var endIndex = this.element.selectionEnd;\n var maskValue = this.hiddenMask.replace(/[>|\\\\<]/g, '');\n var curMask = maskValue[startIndex - 1];\n var parentElement = this.element.parentNode;\n if (isRemove || event.keyCode === 8 || event.keyCode === 46) {\n this.undoCollec.push({ value: this.element.value, startIndex: this.element.selectionStart, endIndex: endIndex });\n var multipleDel = false;\n if (startIndex > 0 || ((event.keyCode === 8 || event.keyCode === 46) && startIndex < this.element.value.length\n && ((this.element.selectionEnd - startIndex) !== this.element.value.length))) {\n var index = startIndex;\n if (startIndex !== endIndex) {\n startIndex = endIndex;\n if (event.keyCode === 46) {\n multipleDel = true;\n }\n }\n else if (event.keyCode === 46) {\n ++index;\n }\n else {\n --index;\n }\n for (var k = startIndex; (event.keyCode === 8 || isRemove || multipleDel) ? k > index : k < index; (event.keyCode === 8 || isRemove || multipleDel) ? k-- : k++) {\n for (var i = startIndex; (event.keyCode === 8 || isRemove || multipleDel) ? i > 0 : i < this.element.value.length; (event.keyCode === 8 || isRemove || multipleDel) ? i-- : i++) {\n var sIndex = void 0;\n if (((event.keyCode === 8 || multipleDel) && ((initStartIndex !== initEndIndex && initStartIndex !== startIndex) ||\n (initStartIndex === initEndIndex))) || isRemove) {\n curMask = maskValue[i - 1];\n sIndex = startIndex - 1;\n }\n else {\n curMask = maskValue[i];\n sIndex = startIndex;\n ++startIndex;\n }\n var oldValue = this.element.value[sIndex];\n if ((isNullOrUndefined(this.regExpCollec[curMask]) && (!isNullOrUndefined(this.customCharacters)\n && isNullOrUndefined(this.customCharacters[curMask]))\n && ((this.hiddenMask[sIndex] !== this.promptChar && this.customRegExpCollec[sIndex][0] !== '['\n && this.customRegExpCollec[sIndex][this.customRegExpCollec[sIndex].length - 1] !== ']')))\n || (this.promptMask[sIndex] !== this.promptChar && isNullOrUndefined(this.customCharacters))) {\n this.element.selectionStart = this.element.selectionEnd = sIndex;\n event.preventDefault();\n if (event.keyCode === 46 && !multipleDel) {\n ++this.element.selectionStart;\n }\n }\n else {\n var value = this.element.value;\n var prompt_1 = this.promptChar;\n var elementValue = value.substring(0, sIndex) + prompt_1 + value.substring(startIndex, value.length);\n setElementValue.call(this, elementValue);\n event.preventDefault();\n this.element.selectionStart = this.element.selectionEnd = sIndex;\n isDeleted = true;\n }\n startIndex = this.element.selectionStart;\n if ((!isDeleted && event.keyCode === 8) || multipleDel || (!isDeleted && !(event.keyCode === 46))) {\n sIndex = startIndex - 1;\n }\n else {\n sIndex = startIndex;\n isDeleted = false;\n }\n oldValue = this.element.value[sIndex];\n if (((initStartIndex !== initEndIndex) && (this.element.selectionStart === initStartIndex))\n || (this.promptMask[sIndex] === this.promptChar) || ((oldValue !== this.promptMask[sIndex]) &&\n (this.promptMask[sIndex] !== this.promptChar) && !isNullOrUndefined(this.customCharacters))) {\n break;\n }\n }\n }\n }\n if (this.element.selectionStart === 0 && (this.element.selectionEnd === this.element.value.length)) {\n setElementValue.call(this, this.promptMask);\n event.preventDefault();\n this.element.selectionStart = this.element.selectionEnd = startIndex;\n }\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart,\n endIndex: this.element.selectionEnd\n });\n triggerMaskChangeEvent.call(this, event, oldEventVal);\n }\n}\nfunction maskInputKeyPressHandler(event) {\n if (this.mask) {\n var oldValue = this.element.value;\n if ((!event.ctrlKey) || (event.ctrlKey && event.code !== 'KeyA' && event.code !== 'KeyY'\n && event.code !== 'KeyZ' && event.code !== 'KeyX' && event.code !== 'KeyC' && event.code !== 'KeyV')) {\n this.maskKeyPress = true;\n var key = event.key;\n if (key === 'Spacebar') {\n key = String.fromCharCode(event.keyCode);\n }\n if (!key) {\n this.isIosInvalid = true;\n validateValue.call(this, String.fromCharCode(event.keyCode), event.ctrlKey, event);\n event.preventDefault();\n this.isIosInvalid = false;\n }\n else if (key && key.length === 1) {\n validateValue.call(this, key, event.ctrlKey, event);\n event.preventDefault();\n }\n }\n triggerMaskChangeEvent.call(this, event, oldValue);\n }\n}\nfunction triggerMaskChangeEvent(event, oldValue) {\n if (!isNullOrUndefined(this.changeEventArgs)) {\n var eventArgs = {};\n this.changeEventArgs = { value: this.element.value, maskedValue: this.element.value, isInteraction: false };\n if (this.mask) {\n this.changeEventArgs.value = strippedValue.call(this, this.element);\n }\n if (!isNullOrUndefined(event)) {\n this.changeEventArgs.isInteraction = true;\n this.changeEventArgs.event = event;\n }\n merge(eventArgs, this.changeEventArgs);\n this.trigger('change', eventArgs);\n }\n attributes(this.element, { 'aria-valuenow': this.element.value });\n}\nfunction maskInputKeyUpHandler(event) {\n if (this.mask) {\n var collec = void 0;\n if (!this.maskKeyPress && event.keyCode === 229) {\n var oldEventVal = void 0;\n if (this.element.value.length === 1) {\n this.element.value = this.element.value + this.promptMask;\n this.element.setSelectionRange(1, 1);\n }\n if (this.element.value.length > this.promptMask.length) {\n var startIndex = this.element.selectionStart;\n var addedValues = this.element.value.length - this.promptMask.length;\n var val_1 = this.element.value.substring(startIndex - addedValues, startIndex);\n if (this.undoCollec.length > 0) {\n collec = this.undoCollec[this.undoCollec.length - 1];\n var startIndex_1 = this.element.selectionStart;\n oldEventVal = collec.value;\n var oldVal = collec.value.substring(startIndex_1 - addedValues, startIndex_1);\n collec = this.redoCollec[0];\n val_1 = val_1.trim();\n var isSpace = Browser.isAndroid && val_1 === '';\n if (!isSpace && oldVal !== val_1 && collec.value.substring(startIndex_1 - addedValues, startIndex_1) !== val_1) {\n validateValue.call(this, val_1, event.ctrlKey, event);\n }\n else if (isSpace) {\n preventUnsupportedValues.call(this, event, startIndex_1 - 1, this.element.selectionEnd - 1, val_1, event.ctrlKey, false);\n }\n }\n else {\n oldEventVal = this.promptMask;\n validateValue.call(this, val_1, event.ctrlKey, event);\n }\n this.maskKeyPress = false;\n triggerMaskChangeEvent.call(this, event, oldEventVal);\n }\n }\n else {\n removeMaskError.call(this);\n }\n var val = strippedValue.call(this, this.element);\n if (!((this.element.selectionStart === 0) && (this.promptMask === this.element.value) && val === '')\n || (val === '' && this.value !== val)) {\n this.prevValue = val;\n this.value = val;\n }\n }\n else {\n triggerMaskChangeEvent.call(this, event);\n this.value = this.element.value;\n }\n}\nfunction mobileSwipeCheck(key) {\n if (key.length > 1 && ((this.promptMask.length + key.length) < this.element.value.length)) {\n var elementValue = this.redoCollec[0].value.substring(0, this.redoCollec[0].startIndex) + key +\n this.redoCollec[0].value.substring(this.redoCollec[0].startIndex, this.redoCollec[0].value.length);\n setElementValue.call(this, elementValue);\n this.element.selectionStart = this.element.selectionEnd = this.redoCollec[0].startIndex + key.length;\n }\n this.element.selectionStart = this.element.selectionStart - key.length;\n this.element.selectionEnd = this.element.selectionEnd - key.length;\n}\nfunction validateValue(key, isCtrlKey, event) {\n if (!this.maskKeyPress) {\n mobileSwipeCheck.call(this, key);\n }\n var startIndex = this.element.selectionStart;\n var initStartIndex = startIndex;\n var endIndex = this.element.selectionEnd;\n var curMask;\n var allowText = false;\n var value = this.element.value;\n var eventOldVal;\n var prevSupport = false;\n var isEqualVal = false;\n for (var k = 0; k < key.length; k++) {\n var keyValue = key[k];\n startIndex = this.element.selectionStart;\n endIndex = this.element.selectionEnd;\n if (!this.maskKeyPress && initStartIndex === startIndex) {\n startIndex = startIndex + k;\n }\n if ((!this.maskKeyPress || startIndex < this.promptMask.length)) {\n for (var i = startIndex; i < this.promptMask.length; i++) {\n var maskValue = this.escapeMaskValue;\n curMask = maskValue[startIndex];\n if (this.hiddenMask[startIndex] === '\\\\' && this.hiddenMask[startIndex + 1] === key) {\n isEqualVal = true;\n }\n if ((isNullOrUndefined(this.regExpCollec[curMask]) && (isNullOrUndefined(this.customCharacters)\n || (!isNullOrUndefined(this.customCharacters) && isNullOrUndefined(this.customCharacters[curMask])))\n && ((this.hiddenMask[startIndex] !== this.promptChar && this.customRegExpCollec[startIndex][0] !== '['\n && this.customRegExpCollec[startIndex][this.customRegExpCollec[startIndex].length - 1] !== ']')))\n || ((this.promptMask[startIndex] !== this.promptChar) && isNullOrUndefined(this.customCharacters))\n || (this.promptChar === curMask && this.escapeMaskValue === this.mask)) {\n this.element.selectionStart = this.element.selectionEnd = startIndex + 1;\n startIndex = this.element.selectionStart;\n curMask = this.hiddenMask[startIndex];\n }\n }\n if (!isNullOrUndefined(this.customCharacters) && !isNullOrUndefined(this.customCharacters[curMask])) {\n var customValStr = this.customCharacters[curMask];\n var customValArr = customValStr.split(',');\n for (var i = 0; i < customValArr.length; i++) {\n if (keyValue.match(new RegExp('[' + customValArr[i] + ']'))) {\n allowText = true;\n break;\n }\n }\n }\n else if (!isNullOrUndefined(this.regExpCollec[curMask]) && keyValue.match(new RegExp(this.regExpCollec[curMask]))\n && this.promptMask[startIndex] === this.promptChar) {\n allowText = true;\n }\n else if (this.promptMask[startIndex] === this.promptChar && this.customRegExpCollec[startIndex][0] === '['\n && this.customRegExpCollec[startIndex][this.customRegExpCollec[startIndex].length - 1] === ']'\n && keyValue.match(new RegExp(this.customRegExpCollec[startIndex]))) {\n allowText = true;\n }\n if ((!this.maskKeyPress || startIndex < this.hiddenMask.length) && allowText) {\n if (k === 0) {\n if (this.maskKeyPress) {\n this.undoCollec.push({ value: value, startIndex: startIndex, endIndex: startIndex });\n }\n else {\n var sIndex = this.element.selectionStart;\n var eIndex = this.element.selectionEnd;\n if (this.redoCollec.length > 0) {\n eventOldVal = this.redoCollec[0].value;\n setElementValue.call(this, eventOldVal);\n this.undoCollec.push(this.redoCollec[0]);\n }\n else {\n this.undoCollec.push({ value: this.promptMask, startIndex: startIndex, endIndex: startIndex });\n eventOldVal = this.promptMask;\n setElementValue.call(this, eventOldVal);\n }\n this.element.selectionStart = sIndex;\n this.element.selectionEnd = eIndex;\n }\n }\n startIndex = this.element.selectionStart;\n applySupportedValues.call(this, event, startIndex, keyValue, eventOldVal, isEqualVal);\n prevSupport = true;\n if (k === key.length - 1) {\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd\n });\n }\n allowText = false;\n }\n else {\n startIndex = this.element.selectionStart;\n preventUnsupportedValues.call(this, event, startIndex, initStartIndex, key, isCtrlKey, prevSupport);\n }\n if (k === key.length - 1 && !allowText) {\n if (!Browser.isAndroid || (Browser.isAndroid && startIndex < this.promptMask.length)) {\n this.redoCollec.unshift({\n value: this.element.value, startIndex: this.element.selectionStart, endIndex: this.element.selectionEnd\n });\n }\n }\n }\n else {\n if (key.length === 1 && !isCtrlKey && !isNullOrUndefined(event)) {\n addMaskErrorClass.call(this);\n }\n }\n }\n}\nfunction applySupportedValues(event, startIndex, keyValue, eventOldVal, isEqualVal) {\n if (this.hiddenMask.length > this.promptMask.length) {\n keyValue = changeToLowerUpperCase.call(this, keyValue, this.element.value);\n }\n if (!isEqualVal) {\n var value = this.element.value;\n var elementValue = value.substring(0, startIndex) + keyValue + value.substring(startIndex + 1, value.length);\n setElementValue.call(this, elementValue);\n this.element.selectionStart = this.element.selectionEnd = startIndex + 1;\n }\n triggerMaskChangeEvent.call(this, event, eventOldVal);\n}\nfunction preventUnsupportedValues(event, sIdx, idx, key, ctrl, chkSupport) {\n if (!this.maskKeyPress) {\n var eventOldVal = void 0;\n var value = this.element.value;\n if (sIdx >= this.promptMask.length) {\n setElementValue.call(this, value.substring(0, sIdx));\n }\n else {\n if (idx === sIdx) {\n setElementValue.call(this, value.substring(0, sIdx) + value.substring(sIdx + 1, value.length));\n }\n else {\n if (this.promptMask.length === this.element.value.length) {\n setElementValue.call(this, value.substring(0, sIdx) + value.substring(sIdx, value.length));\n }\n else {\n setElementValue.call(this, value.substring(0, idx) + value.substring(idx + 1, value.length));\n }\n }\n this.element.selectionStart = this.element.selectionEnd = (chkSupport ||\n this.element.value[idx] !== this.promptChar) ? sIdx : idx;\n }\n eventOldVal = this.element.value;\n triggerMaskChangeEvent.call(this, event, eventOldVal);\n addMaskErrorClass.call(this);\n }\n if (key.length === 1 && !ctrl && !isNullOrUndefined(event)) {\n addMaskErrorClass.call(this);\n }\n}\nfunction addMaskErrorClass() {\n var _this = this;\n var parentElement = this.element.parentNode;\n var timer = 200;\n if (parentElement.classList.contains(INPUTGROUP) || parentElement.classList.contains(FLOATINPUT)) {\n addClass([parentElement], ERROR);\n }\n else {\n addClass([this.element], ERROR);\n }\n if (this.isIosInvalid === true) {\n timer = 400;\n }\n attributes(this.element, { 'aria-invalid': 'true' });\n setTimeout(function () {\n if (!_this.maskKeyPress) {\n removeMaskError.call(_this);\n }\n }, timer);\n}\nfunction removeMaskError() {\n var parentElement = this.element.parentNode;\n removeClass([parentElement], ERROR);\n removeClass([this.element], ERROR);\n attributes(this.element, { 'aria-invalid': 'false' });\n}\n/**\n * @hidden\n * Validates user input using masking elements '<' , '>' and '|'.\n */\nfunction changeToLowerUpperCase(key, value) {\n var promptMask;\n var i;\n var j = 0;\n var curVal = value;\n var caseCount = 0;\n for (i = 0; i < this.hiddenMask.length; i++) {\n if (this.hiddenMask[i] === '\\\\') {\n promptMask = curVal.substring(0, i) + '\\\\' + curVal.substring(i, curVal.length);\n }\n if (this.hiddenMask[i] === '>' || this.hiddenMask[i] === '<' || this.hiddenMask[i] === '|') {\n if (this.hiddenMask[i] !== curVal[i]) {\n promptMask = curVal.substring(0, i) + this.hiddenMask[i] + curVal.substring(i, curVal.length);\n }\n ++caseCount;\n }\n if (promptMask) {\n if (((promptMask[i] === this.promptChar) && (i > this.element.selectionStart)) ||\n (this.element.value.indexOf(this.promptChar) < 0 && (this.element.selectionStart + caseCount) === i)) {\n caseCount = 0;\n break;\n }\n curVal = promptMask;\n }\n }\n while (i >= 0 && promptMask) {\n if (i === 0 || promptMask[i - 1] !== '\\\\') {\n var val = this.element.value;\n if (promptMask[i] === '>') {\n key = key.toUpperCase();\n break;\n }\n else if (promptMask[i] === '<') {\n key = key.toLowerCase();\n break;\n }\n else if (promptMask[i] === '|') {\n break;\n }\n }\n --i;\n }\n return key;\n}\n/**\n * @hidden\n * To set updated values in the MaskedTextBox.\n */\nexport function setMaskValue(val) {\n if (this.mask && val !== undefined && (val === '' || this.prevValue !== val)) {\n this.maskKeyPress = true;\n setElementValue.call(this, this.promptMask);\n if (val !== '') {\n this.element.selectionStart = 0;\n this.element.selectionEnd = 0;\n }\n if (val !== null) {\n for (var i = 0; i < val.length; i++) {\n validateValue.call(this, val[i], false, null);\n }\n }\n this.value = strippedValue.call(this, this.element);\n this.maskKeyPress = false;\n var labelElement = this.element.parentNode.querySelector('.e-float-text');\n if (this.element.value === this.promptMask && this.floatLabelType === 'Auto' &&\n !isNullOrUndefined(labelElement) && labelElement.classList.contains(TOPLABEL) && !this.isFocus) {\n removeClass([labelElement], TOPLABEL);\n addClass([labelElement], BOTTOMLABEL);\n setElementValue.call(this, '');\n }\n }\n}\n/**\n * @hidden\n * To set updated values in the input element.\n */\nexport function setElementValue(val, element) {\n if (!this.isFocus && this.floatLabelType === 'Auto' && isNullOrUndefined(this.value)) {\n val = '';\n }\n Input.setValue(val, (element ? element : this.element), this.floatLabelType);\n}\n/**\n * @hidden\n * Provide mask support to input textbox through utility method.\n */\nexport function maskInput(args) {\n var inputEle = getMaskInput(args);\n applyMask.call(inputEle);\n var val = strippedValue.call(this, this.element);\n this.prevValue = val;\n this.value = val;\n if (args.mask) {\n unwireEvents.call(inputEle);\n wireEvents.call(inputEle);\n }\n}\nfunction getMaskInput(args) {\n addClass([args.element], UTILMASK);\n var inputEle = {\n element: args.element,\n mask: args.mask,\n promptMask: '',\n hiddenMask: '',\n escapeMaskValue: '',\n promptChar: args.promptChar ? (args.promptChar.length > 1) ? args.promptChar = args.promptChar[0]\n : args.promptChar : '_',\n value: args.value ? args.value : null,\n regExpCollec: regularExpressions,\n customRegExpCollec: [],\n customCharacters: args.customCharacters,\n undoCollec: [],\n redoCollec: [],\n maskKeyPress: false,\n prevValue: ''\n };\n createMask.call(inputEle);\n return inputEle;\n}\n/**\n * @hidden\n * Gets raw value of the textbox which has been masked through utility method.\n */\nexport function getVal(args) {\n return strippedValue.call(getUtilMaskEle(args), args.element);\n}\n/**\n * @hidden\n * Gets masked value of the textbox which has been masked through utility method.\n */\nexport function getMaskedVal(args) {\n return unstrippedValue.call(getUtilMaskEle(args), args.element);\n}\nfunction getUtilMaskEle(args) {\n var value = '';\n var inputEle;\n if (!isNullOrUndefined(args) && args.element.classList.contains(UTILMASK)) {\n inputEle = getMaskInput(args);\n }\n return inputEle;\n}\n/**\n * @hidden\n * Arguments to perform undo and redo functionalities.\n */\nvar MaskUndo = /** @class */ (function () {\n function MaskUndo() {\n }\n return MaskUndo;\n}());\nexport { MaskUndo };\nvar maskUndo = new MaskUndo();\n","import { extend, merge, isNullOrUndefined, getValue } from '@syncfusion/ej2-base';\nimport { createElement, 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};\n/**\n * Base List Generator\n */\nexport var ListBase;\n(function (ListBase) {\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 };\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 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 expandIconClass: 'e-icon-collapsible',\n moduleName: 'list',\n expandIconPosition: 'Right'\n };\n /**\n * Function helps to created and return the UL Li element based on your data.\n * @param {{[key:string]:Object}[]|string[]} dataSource - Specifies an array of JSON or String data.\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n */\n function createList(dataSource, options, isSingleLevel) {\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(dataSource, isSingleLevel, options);\n }\n else {\n return createListFromJson(dataSource, options, ariaAttributes.level, isSingleLevel);\n }\n }\n ListBase.createList = createList;\n /**\n * Function helps to created an element list based on string array input .\n * @param {string[]} dataSource - Specifies an array of string data\n */\n function createListFromArray(dataSource, isSingleLevel, options) {\n var subChild = createListItemFromArray(dataSource, isSingleLevel, options);\n return generateUL(subChild, null, options);\n }\n ListBase.createListFromArray = createListFromArray;\n /**\n * Function helps to created an element list based on string array input .\n * @param {string[]} dataSource - Specifies an array of string data\n */\n function createListItemFromArray(dataSource, isSingleLevel, options) {\n var subChild = [];\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var id = genUID(); // 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(dataSource[i], null, null, [], null, id, i, options);\n }\n else {\n li = generateLI(dataSource[i], null, null, options);\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 * @param {{[key:string]:Object}[]} dataSource - Specifies an array of JSON data.\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n */\n // tslint:disable-next-line:max-func-body-length\n function createListItemFromJson(dataSource, options, level, isSingleLevel) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n cssClass = getModuleClass(curOpt.moduleName);\n var fields = extend({}, ListBase.defaultMappedFields, curOpt.fields);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n var id;\n if (level) {\n ariaAttributes.level = level;\n }\n var child = [];\n var li;\n if (Object.keys(dataSource).length && !typeofData(dataSource).item.hasOwnProperty(fields.id)) {\n id = genUID(); // 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 if (Object.keys(dataSource).length && fieldData.hasOwnProperty(fields.id)\n && !isNullOrUndefined(fieldData[fields.id])) {\n id = fieldData.id;\n }\n var innerEle = [];\n if (curOpt.showCheckBox) {\n innerEle.push(createElement('input', { className: cssClass.check, attrs: { type: 'checkbox' } }));\n }\n if (isSingleLevel === true) {\n if (curOpt.showIcon && fieldData.hasOwnProperty(fields.iconCss)) {\n if (!isNullOrUndefined(fieldData[fields.iconCss])) {\n innerEle.push(createElement('span', { className: cssClass.icon + ' ' + fieldData[fields.iconCss] }));\n }\n }\n li = generateSingleLevelLI(curItem, fields, curOpt.itemClass, innerEle, (curItem.hasOwnProperty('isHeader') &&\n curItem.isHeader) ? true : false, id, i, options);\n }\n else {\n li = generateLI(curItem, fields, curOpt.itemClass, options);\n li.classList.add(cssClass.level + '-' + ariaAttributes.level);\n li.setAttribute('aria-level', ariaAttributes.level.toString());\n if (fieldData.hasOwnProperty(fields.tooltip)) {\n li.setAttribute('title', fieldData[fields.tooltip]);\n }\n if (fieldData.hasOwnProperty(fields.htmlAttributes) && fieldData[fields.htmlAttributes]) {\n setAttribute(li, fieldData[fields.htmlAttributes]);\n }\n if (fieldData.hasOwnProperty(fields.enabled) && fieldData[fields.enabled] === false) {\n li.classList.add(cssClass.disabled);\n }\n if (fieldData.hasOwnProperty(fields.isVisible) && fieldData[fields.isVisible] === false) {\n li.style.display = 'none';\n }\n if (fieldData.hasOwnProperty(fields.imageUrl) && !isNullOrUndefined(fieldData[fields.imageUrl])) {\n var attr = { src: fieldData[fields.imageUrl] };\n if (fieldData.hasOwnProperty(fields.imageUrl)) {\n merge(attr, fieldData[fields.imageAttributes]);\n }\n prepend([createElement('img', { className: cssClass.image, attrs: attr })], li.firstElementChild);\n }\n if (curOpt.showIcon && fieldData.hasOwnProperty(fields.iconCss) && !curOpt.template) {\n if (!isNullOrUndefined(fieldData[fields.iconCss])) {\n prepend([createElement('div', { className: cssClass.icon + ' ' + fieldData[fields.iconCss] })], li.firstElementChild);\n }\n }\n if (innerEle.length) {\n prepend(innerEle, li.firstElementChild);\n }\n processSubChild(curItem, fields, dataSource, curOpt, li, ariaAttributes.level);\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 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 * @param {{[key:string]:Object}[]} dataSource - Specifies an array of JSON data.\n * @param {ListBaseOptions} options? - Specifies the list options that need to provide.\n */\n function createListFromJson(dataSource, options, level, isSingleLevel) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var li = createListItemFromJson(dataSource, options, level, isSingleLevel);\n return generateUL(li, curOpt.listClass, options);\n }\n ListBase.createListFromJson = createListFromJson;\n /**\n * Return the next or previous visible element.\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 * @param {Element} item - An element to find next or previous after this element.\n * @param {Element[]|NodeList} 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 * @param {{[key:string]: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='None'} sortOrder- Specifies final result sort order.\n */\n function groupDataSource(dataSource, fields, sortOrder) {\n if (sortOrder === void 0) { sortOrder = 'None'; }\n var cusQuery = new Query().group(fields.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[fields.text] = ds[j].key;\n grpItem[hdr] = true;\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 * @param {SortOrder} sortOrder - Specifies that sort order.\n * @param {string} sortBy - Specifies sortBy fields.\n * @param {Query=new 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 * @param {{[key:string]:Object}[]} dataSource - Specifies local JSON data source.\n * @param {Query} query - Specifies query that need to process.\n */\n function getDataSource(dataSource, query) {\n // tslint: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 * @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 json[fields.id] = genUID();\n var attributes_1 = getAllAttributes(li);\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 * @param {string} template - that need to convert and generate li element.\n * @param {{[key:string]:Object}[]} dataSource - Specifies local JSON data source.\n * @param {ListBaseOptions} options? - Specifies listbase option for fields.\n */\n function renderContentTemplate(template, dataSource, fields, options) {\n cssClass = getModuleClass(defaultListBaseOptions.moduleName);\n var ulElement = createElement('ul', { className: cssClass.ul, attrs: { role: 'presentation' } });\n var curOpt = extend({}, defaultListBaseOptions, options);\n var compiledString = compile(template);\n var liCollection = [];\n var id = genUID(); // generate id for drop-down-list option.\n for (var i = 0; i < dataSource.length; i++) {\n var fieldData = getFieldValues(dataSource[i], fields);\n var curItem = dataSource[i];\n var isHeader = curItem.isHeader;\n var value = (typeof curItem === 'string' || typeof curItem === 'number') ? curItem : fieldData[fields.value];\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: fields\n };\n curOpt.itemCreating(curData);\n }\n if (curOpt.itemCreating && typeof curOpt.itemCreating === 'function') {\n fieldData = getFieldValues(dataSource[i], fields);\n value = fieldData[fields.value];\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 li.innerText = fieldData[fields.text];\n }\n else {\n append(compiledString(curItem), li);\n li.setAttribute('data-value', 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: fields\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 * @param {string} template - that need to convert and generate li element.\n * @param {{[key:string]:Object}[]} dataSource - Specifies local JSON data source.\n * @param {FieldsMapping} fields - Specifies fields for mapping the dataSource.\n * @param {Element[]} headerItems? - Specifies listbase header items.\n */\n function renderGroupTemplate(groupTemplate, groupDataSource, fields, headerItems) {\n var compiledString = compile(groupTemplate);\n var category = fields.groupBy;\n var headerData = {};\n for (var _i = 0, headerItems_1 = headerItems; _i < headerItems_1.length; _i++) {\n var header = headerItems_1[_i];\n headerData[category] = header.textContent;\n header.innerHTML = '';\n append(compiledString(headerData), header);\n }\n return headerItems;\n }\n ListBase.renderGroupTemplate = renderGroupTemplate;\n function genUID() {\n return Math.floor((1 + Math.random()) * 0x10000)\n .toString(16)\n .substring(1);\n }\n function processSubChild(curItem, fields, ds, options, element, level) {\n var fieldData = getFieldValues(curItem, fields);\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(subDS, options, ++level);\n element.appendChild(subLi);\n }\n }\n // Create expand and collapse node\n if (!!options.expandCollapse && hasChildren && !options.template) {\n if (element.firstElementChild.classList.contains(cssClass.textContent)) {\n element.firstElementChild.classList.add(cssClass.iconWrapper);\n }\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(item, 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 var fieldData = getFieldValues(item, fields);\n if (typeof item !== 'string' && typeof item !== 'number') {\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 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 if (!isNullOrUndefined(value)) {\n li.setAttribute('data-value', value);\n }\n li.setAttribute('role', 'option');\n if (dataSource && fieldData.hasOwnProperty(fields.htmlAttributes) && fieldData[fields.htmlAttributes]) {\n setAttribute(li, fieldData[fields.htmlAttributes]);\n }\n if (innerElements.length) {\n append(innerElements, li);\n }\n if (dataSource && fieldData.hasOwnProperty(fields.url) && fieldData[fields.url]) {\n li.appendChild(anchorTag(dataSource, fields, text));\n }\n else {\n li.appendChild(document.createTextNode(text));\n }\n }\n return li;\n }\n function getModuleClass(moduleName) {\n var moduleClass;\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 };\n }\n function anchorTag(dataSource, fields, text) {\n var fieldData = getFieldValues(dataSource, fields);\n var attr = { href: fieldData[fields.url] };\n if (fieldData.hasOwnProperty(fields.urlAttributes) && fieldData[fields.urlAttributes]) {\n merge(attr, fieldData[fields.urlAttributes]);\n }\n var anchorTag = createElement('a', { className: cssClass.text + ' ' + cssClass.url, innerHTML: text });\n setAttribute(anchorTag, attr);\n return anchorTag;\n }\n /* tslint:disable:align */\n function generateLI(item, fields, className, options) {\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 var fieldData;\n if (typeof item !== 'string') {\n fieldData = getFieldValues(item, fields);\n dataSource = item;\n text = fieldData[fields.text] || '';\n uID = fieldData[fields.id];\n grpLI = (item.hasOwnProperty('isHeader') && item.isHeader)\n ? true : false;\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 !isNullOrUndefined(uID) ? li.setAttribute('data-uid', uID) : li.setAttribute('data-uid', genUID());\n if (grpLI && options && options.groupTemplate) {\n var compiledString = compile(options.groupTemplate);\n append(compiledString(item), li);\n }\n else if (!grpLI && options && options.template) {\n var compiledString = compile(options.template);\n append(compiledString(item), li);\n }\n else {\n var innerDiv = createElement('div', { className: cssClass.textContent,\n attrs: (ariaAttributes.wrapperRole !== '' ? { role: ariaAttributes.wrapperRole } : {}) });\n if (dataSource && fieldData.hasOwnProperty(fields.url) && fieldData[fields.url]) {\n innerDiv.appendChild(anchorTag(dataSource, fields, text));\n }\n else {\n innerDiv.appendChild(createElement('span', { className: cssClass.text, innerHTML: text,\n attrs: (ariaAttributes.itemText !== '' ? { role: ariaAttributes.itemText } : {}) }));\n }\n li.appendChild(innerDiv);\n }\n return li;\n }\n /**\n * Returns UL element based on the given LI element.\n * @param {HTMLElement[]} liElement - Specifies array of LI element.\n * @param {string} className? - Specifies class name that need to be added in UL element.\n * @param {ListBaseOptions} options? - Specifies ListBase options.\n */\n function generateUL(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 * @param {liElement} liElement - Specifies LI element.\n * @param {string} className? - Specifies class name that need to be added in created DIV element.\n * @param {ListBaseOptions} options? - Specifies ListBase options.\n */\n function generateIcon(liElement, className, options) {\n var curOpt = extend({}, defaultListBaseOptions, options);\n var ariaAttributes = extend({}, defaultAriaAttributes, curOpt.ariaAttributes);\n cssClass = getModuleClass(curOpt.moduleName);\n var expandElement = curOpt.expandIconPosition === 'Left' ? prepend : append;\n expandElement([createElement('div', { className: 'e-icons ' + curOpt.expandIconClass + ' ' +\n (isNullOrUndefined(className) ? '' : className) })], 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 * @param {{[key:string]:Object}|string[]|string} dataSource - Specifies an JSON or String data.\n * @param {FieldsMapping} fields - Fields that are mapped from the dataSource.\n */\nexport function getFieldValues(dataItem, fields) {\n var fieldData = {};\n var value;\n if (isNullOrUndefined(dataItem)) {\n return dataItem;\n }\n else if (typeof (dataItem) === 'string' || typeof (dataItem) === 'number') {\n return dataItem;\n }\n else if (isNullOrUndefined(dataItem.isHeader)) {\n for (var _i = 0, _a = Object.keys(fields); _i < _a.length; _i++) {\n var field = _a[_i];\n if (!isNullOrUndefined(fields[field]) &&\n typeof (fields[field]) === 'string') {\n var property = fields[field].split('.');\n var dataField = property.length > 1 ? property[0] : fields[field];\n if (!isNullOrUndefined(dataItem[dataField])) {\n value = getValue(fields[field], dataItem);\n if (!isNullOrUndefined(value)) {\n fieldData[fields[field]] = value;\n }\n }\n }\n }\n }\n else if (!isNullOrUndefined(dataItem.isHeader) && dataItem.isHeader) {\n fieldData = dataItem;\n }\n return fieldData;\n}\n","/**\n * Encoding class: Contains the details about encoding type, whether to write a Unicode byte order mark (BOM).\n * ```typescript\n * let encoding : Encoding = new Encoding();\n * encoding.type = 'Utf8';\n * encoding.getBytes('Encoding', 0, 5);\n * ```\n */\nvar Encoding = /** @class */ (function () {\n /**\n * Initializes a new instance of the Encoding class. A parameter specifies whether to write a Unicode byte order mark\n * @param {boolean} includeBom?-true to specify that a Unicode byte order mark is written; otherwise, false.\n */\n function Encoding(includeBom) {\n this.emitBOM = true;\n this.encodingType = 'Ansi';\n this.initBOM(includeBom);\n }\n Object.defineProperty(Encoding.prototype, \"includeBom\", {\n /**\n * Gets a value indicating whether to write a Unicode byte order mark\n * @returns boolean- true to specify that a Unicode byte order mark is written; otherwise, false\n */\n get: function () {\n return this.emitBOM;\n },\n enumerable: true,\n configurable: true\n });\n Object.defineProperty(Encoding.prototype, \"type\", {\n /**\n * Gets the encoding type.\n * @returns EncodingType\n */\n get: function () {\n return this.encodingType;\n },\n /**\n * Sets the encoding type.\n * @param {EncodingType} value\n */\n set: function (value) {\n this.encodingType = value;\n },\n enumerable: true,\n configurable: true\n });\n /**\n * Initialize the includeBom to emit BOM or Not\n * @param {boolean} includeBom\n */\n Encoding.prototype.initBOM = function (includeBom) {\n if (includeBom === undefined || includeBom === null) {\n this.emitBOM = true;\n }\n else {\n this.emitBOM = includeBom;\n }\n };\n /**\n * Calculates the number of bytes produced by encoding the characters in the specified string\n * @param {string} chars - The string containing the set of characters to encode\n * @returns {number} - The number of bytes produced by encoding the specified characters\n */\n Encoding.prototype.getByteCount = function (chars) {\n var byteCount = 0;\n validateNullOrUndefined(chars, 'string');\n if (chars === '') {\n var byte = this.utf8Len(chars.charCodeAt(0));\n return byte;\n }\n if (this.type === null || this.type === undefined) {\n this.type = 'Ansi';\n }\n return this.getByteCountInternal(chars, 0, chars.length);\n };\n /**\n * Return the Byte of character\n * @param {number} codePoint\n * @returns {number}\n */\n Encoding.prototype.utf8Len = function (codePoint) {\n var bytes = codePoint <= 0x7F ? 1 :\n codePoint <= 0x7FF ? 2 :\n codePoint <= 0xFFFF ? 3 :\n codePoint <= 0x1FFFFF ? 4 : 0;\n return bytes;\n };\n /**\n * for 4 byte character return surrogate pair true, otherwise false\n * @param {number} codeUnit\n * @returns {boolean}\n */\n Encoding.prototype.isHighSurrogate = function (codeUnit) {\n return codeUnit >= 0xD800 && codeUnit <= 0xDBFF;\n };\n /**\n * for 4byte character generate the surrogate pair\n * @param {number} highCodeUnit\n * @param {number} lowCodeUnit\n */\n Encoding.prototype.toCodepoint = function (highCodeUnit, lowCodeUnit) {\n highCodeUnit = (0x3FF & highCodeUnit) << 10;\n var u = highCodeUnit | (0x3FF & lowCodeUnit);\n return u + 0x10000;\n };\n /**\n * private method to get the byte count for specific charindex and count\n * @param {string} chars\n * @param {number} charIndex\n * @param {number} charCount\n */\n Encoding.prototype.getByteCountInternal = function (chars, charIndex, charCount) {\n var byteCount = 0;\n if (this.encodingType === 'Utf8' || this.encodingType === 'Unicode') {\n var isUtf8 = this.encodingType === 'Utf8';\n for (var i = 0; i < charCount; i++) {\n var charCode = chars.charCodeAt(isUtf8 ? charIndex : charIndex++);\n if (this.isHighSurrogate(charCode)) {\n if (isUtf8) {\n var high = charCode;\n var low = chars.charCodeAt(++charIndex);\n byteCount += this.utf8Len(this.toCodepoint(high, low));\n }\n else {\n byteCount += 4;\n ++i;\n }\n }\n else {\n if (isUtf8) {\n byteCount += this.utf8Len(charCode);\n }\n else {\n byteCount += 2;\n }\n }\n if (isUtf8) {\n charIndex++;\n }\n }\n return byteCount;\n }\n else {\n byteCount = charCount;\n return byteCount;\n }\n };\n /**\n * Encodes a set of characters from the specified string into the ArrayBuffer.\n * @param {string} s- The string containing the set of characters to encode\n * @param {number} charIndex-The index of the first character to encode.\n * @param {number} charCount- The number of characters to encode.\n * @returns {ArrayBuffer} - The ArrayBuffer that contains the resulting sequence of bytes.\n */\n Encoding.prototype.getBytes = function (s, charIndex, charCount) {\n validateNullOrUndefined(s, 'string');\n validateNullOrUndefined(charIndex, 'charIndex');\n validateNullOrUndefined(charCount, 'charCount');\n if (charIndex < 0 || charCount < 0) {\n throw new RangeError('Argument Out Of Range Exception: charIndex or charCount is less than zero');\n }\n if (s.length - charIndex < charCount) {\n throw new RangeError('Argument Out Of Range Exception: charIndex and charCount do not denote a valid range in string');\n }\n var bytes;\n if (s === '') {\n bytes = new ArrayBuffer(0);\n return bytes;\n }\n if (this.type === null || this.type === undefined) {\n this.type = 'Ansi';\n }\n var byteCount = this.getByteCountInternal(s, charIndex, charCount);\n switch (this.type) {\n case 'Utf8':\n bytes = this.getBytesOfUtf8Encoding(byteCount, s, charIndex, charCount);\n return bytes;\n case 'Unicode':\n bytes = this.getBytesOfUnicodeEncoding(byteCount, s, charIndex, charCount);\n return bytes;\n default:\n bytes = this.getBytesOfAnsiEncoding(byteCount, s, charIndex, charCount);\n return bytes;\n }\n };\n /**\n * Decodes a sequence of bytes from the specified ArrayBuffer into the string.\n * @param {ArrayBuffer} bytes- The ArrayBuffer containing the sequence of bytes to decode.\n * @param {number} index- The index of the first byte to decode.\n * @param {number} count- The number of bytes to decode.\n * @returns {string} - The string that contains the resulting set of characters.\n */\n Encoding.prototype.getString = function (bytes, index, count) {\n validateNullOrUndefined(bytes, 'bytes');\n validateNullOrUndefined(index, 'index');\n validateNullOrUndefined(count, 'count');\n if (index < 0 || count < 0) {\n throw new RangeError('Argument Out Of Range Exception: index or count is less than zero');\n }\n if (bytes.byteLength - index < count) {\n throw new RangeError('Argument Out Of Range Exception: index and count do not denote a valid range in bytes');\n }\n if (bytes.byteLength === 0 || count === 0) {\n return '';\n }\n if (this.type === null || this.type === undefined) {\n this.type = 'Ansi';\n }\n var out = '';\n var byteCal = new Uint8Array(bytes);\n switch (this.type) {\n case 'Utf8':\n var s = this.getStringOfUtf8Encoding(byteCal, index, count);\n return s;\n case 'Unicode':\n var byteUnicode = new Uint16Array(bytes);\n out = this.getStringofUnicodeEncoding(byteUnicode, index, count);\n return out;\n default:\n var j = index;\n for (var i = 0; i < count; i++) {\n var c = byteCal[j];\n out += String.fromCharCode(c); // 1 byte(ASCII) character \n j++;\n }\n return out;\n }\n };\n Encoding.prototype.getBytesOfAnsiEncoding = function (byteCount, s, charIndex, charCount) {\n var bytes = new ArrayBuffer(byteCount);\n var bufview = new Uint8Array(bytes);\n var k = 0;\n for (var i = 0; i < charCount; i++) {\n var charcode = s.charCodeAt(charIndex++);\n if (charcode < 0x800) {\n bufview[k] = charcode;\n }\n else {\n bufview[k] = 63; //replacement character '?'\n }\n k++;\n }\n return bytes;\n };\n Encoding.prototype.getBytesOfUtf8Encoding = function (byteCount, s, charIndex, charCount) {\n var bytes = new ArrayBuffer(byteCount);\n var uint = new Uint8Array(bytes);\n var index = charIndex;\n var j = 0;\n for (var i = 0; i < charCount; i++) {\n var charcode = s.charCodeAt(index);\n if (charcode <= 0x7F) {\n uint[j] = charcode;\n }\n else if (charcode < 0x800) {\n uint[j] = 0xc0 | (charcode >> 6);\n uint[++j] = 0x80 | (charcode & 0x3f);\n }\n else if ((charcode < 0xd800 || charcode >= 0xe000)) {\n uint[j] = 0xe0 | (charcode >> 12);\n uint[++j] = 0x80 | ((charcode >> 6) & 0x3f);\n uint[++j] = 0x80 | (charcode & 0x3f);\n }\n else {\n uint[j] = 0xef;\n uint[++j] = 0xbf;\n uint[++j] = 0xbd; // U+FFFE \"replacement character\"\n }\n ++j;\n ++index;\n }\n return bytes;\n };\n Encoding.prototype.getBytesOfUnicodeEncoding = function (byteCount, s, charIndex, charCount) {\n var bytes = new ArrayBuffer(byteCount);\n var uint16 = new Uint16Array(bytes);\n for (var i = 0; i < charCount; i++) {\n var charcode = s.charCodeAt(i);\n uint16[i] = charcode;\n }\n return bytes;\n };\n Encoding.prototype.getStringOfUtf8Encoding = function (byteCal, index, count) {\n var j = 0;\n var i = index;\n var s = '';\n for (j; j < count; j++) {\n var c = byteCal[i++];\n while (i > byteCal.length) {\n return s;\n }\n if (c > 127) {\n if (c > 191 && c < 224 && i < count) {\n c = (c & 31) << 6 | byteCal[i] & 63;\n }\n else if (c > 223 && c < 240 && i < byteCal.byteLength) {\n c = (c & 15) << 12 | (byteCal[i] & 63) << 6 | byteCal[++i] & 63;\n }\n else if (c > 239 && c < 248 && i < byteCal.byteLength) {\n c = (c & 7) << 18 | (byteCal[i] & 63) << 12 | (byteCal[++i] & 63) << 6 | byteCal[++i] & 63;\n }\n ++i;\n }\n s += String.fromCharCode(c); // 1 byte(ASCII) character \n }\n return s;\n };\n Encoding.prototype.getStringofUnicodeEncoding = function (byteUni, index, count) {\n if (count > byteUni.length) {\n throw new RangeError('ArgumentOutOfRange_Count');\n }\n var byte16 = new Uint16Array(count);\n var out = '';\n for (var i = 0; i < count && i < byteUni.length; i++) {\n byte16[i] = byteUni[index++];\n }\n out = String.fromCharCode.apply(null, byte16);\n return out;\n };\n /**\n * To clear the encoding instance\n * @return {void}\n */\n Encoding.prototype.destroy = function () {\n this.emitBOM = undefined;\n this.encodingType = undefined;\n };\n return Encoding;\n}());\nexport { Encoding };\n/**\n * To check the object is null or undefined and throw error if it is null or undefined\n * @param {Object} value - object to check is null or undefined\n * @return {boolean}\n * @throws {ArgumentException} - if the value is null or undefined\n * @private\n */\nexport function validateNullOrUndefined(value, message) {\n if (value === null || value === undefined) {\n throw new Error('ArgumentException: ' + message + ' cannot be null or undefined');\n }\n}\n","/**\n * @private\n * @hidden\n */\nexport function defaultToString(item) {\n // if (item === null) {\n // return 'COLLECTION_NULL';\n // } else if (typeof item === 'undefined') {\n // return 'COLLECTION_UNDEFINED';\n // } else if (Object.prototype.toString.call(item) === '[object String]') {\n if (Object.prototype.toString.call(item) === '[object String]') {\n return '$s' + item;\n }\n else {\n return '$o' + item.toString();\n }\n}\n","/**\n * Specifies Chart Themes\n */\nexport var Theme;\n(function (Theme) {\n /** @private */\n Theme.axisLabelFont = {\n size: '12px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.axisTitleFont = {\n size: '14px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.chartTitleFont = {\n size: '15px',\n fontWeight: '500',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.crosshairLabelFont = {\n size: '13px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.tooltipLabelFont = {\n size: '13px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.legendLabelFont = {\n size: '13px',\n fontWeight: 'Normal',\n color: null,\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n /** @private */\n Theme.stripLineLabelFont = {\n size: '12px',\n fontWeight: 'Regular',\n color: '#353535',\n fontStyle: 'Normal',\n fontFamily: 'Segoe UI'\n };\n})(Theme || (Theme = {}));\n/** @private */\nexport function getSeriesColor(theme) {\n var palette;\n switch (theme) {\n case 'Fabric':\n palette = ['#4472c4', '#ed7d31', '#ffc000', '#70ad47', '#5b9bd5',\n '#c1c1c1', '#6f6fe2', '#e269ae', '#9e480e', '#997300'];\n break;\n case 'Bootstrap':\n palette = ['#a16ee5', '#f7ce69', '#55a5c2', '#7ddf1e', '#ff6ea6',\n '#7953ac', '#b99b4f', '#407c92', '#5ea716', '#b91c52'];\n break;\n case 'Highcontrast':\n palette = ['#79ECE4', '#E98272', '#DFE6B6', '#C6E773', '#BA98FF',\n '#FA83C3', '#00C27A', '#43ACEF', '#D681EF', '#D8BC6E'];\n break;\n default:\n palette = ['#00bdae', '#404041', '#357cd2', '#e56590', '#f8b883',\n '#70ad47', '#dd8abd', '#7f84e8', '#7bb4eb', '#ea7a57'];\n break;\n }\n return palette;\n}\n/** @private */\nexport function getThemeColor(theme) {\n var style;\n switch (theme) {\n case 'Highcontrast':\n style = {\n axisLabel: '#ffffff',\n axisTitle: '#ffffff',\n axisLine: '#ffffff',\n majorGridLine: '#BFBFBF',\n minorGridLine: '#969696',\n majorTickLine: '#BFBFBF',\n minorTickLine: '#969696',\n chartTitle: '#ffffff',\n legendLabel: '#ffffff',\n background: '#000000',\n areaBorder: '#ffffff',\n errorBar: '#ffffff',\n crosshairLine: '#ffffff',\n crosshairFill: '#ffffff',\n crosshairLabel: '#000000',\n tooltipFill: '#ffffff',\n tooltipBoldLabel: '#000000',\n tooltipLightLabel: '#000000',\n tooltipHeaderLine: '#969696',\n markerShadow: '#BFBFBF',\n selectionRectFill: 'rgba(255, 217, 57, 0.3)',\n selectionRectStroke: '#ffffff',\n selectionCircleStroke: '#FFD939'\n };\n break;\n default:\n style = {\n axisLabel: '#686868',\n axisTitle: '#424242',\n axisLine: '#b5b5b5',\n majorGridLine: '#dbdbdb',\n minorGridLine: '#eaeaea',\n majorTickLine: '#b5b5b5',\n minorTickLine: '#d6d6d6',\n chartTitle: '#424242',\n legendLabel: '#353535',\n background: '#FFFFFF',\n areaBorder: 'Gray',\n errorBar: '#000000',\n crosshairLine: '#4f4f4f',\n crosshairFill: '#4f4f4f',\n crosshairLabel: '#e5e5e5',\n tooltipFill: 'rgba(0, 8, 22, 0.75)',\n tooltipBoldLabel: '#ffffff',\n tooltipLightLabel: '#dbdbdb',\n tooltipHeaderLine: '#ffffff',\n markerShadow: null,\n selectionRectFill: 'rgba(41, 171, 226, 0.1)',\n selectionRectStroke: '#29abe2',\n selectionCircleStroke: '#29abe2'\n };\n break;\n }\n return style;\n}\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 { SvgRenderer, Animation, compile as templateComplier } from '@syncfusion/ej2-base';\nimport { merge, extend, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { createElement, remove } from '@syncfusion/ej2-base';\nimport { Index } from '../../common/model/base';\n/**\n * Methods for calculating the text size.\n */\n/**\n * Function to measure the height and width of the text.\n * @param {string} text\n * @param {FontModel} font\n * @param {string} id\n * @returns no\n * @private\n */\nexport function measureText(text, font) {\n var htmlObject = document.getElementById('chartmeasuretext');\n if (htmlObject === null) {\n htmlObject = createElement('text', { id: 'chartmeasuretext' });\n document.body.appendChild(htmlObject);\n }\n htmlObject.innerHTML = text;\n htmlObject.style.position = 'absolute';\n htmlObject.style.fontSize = font.size;\n htmlObject.style.fontWeight = font.fontWeight;\n htmlObject.style.fontStyle = font.fontStyle;\n htmlObject.style.fontFamily = font.fontFamily;\n htmlObject.style.visibility = 'hidden';\n htmlObject.style.top = '-100';\n htmlObject.style.left = '0';\n htmlObject.style.whiteSpace = 'nowrap';\n // For bootstrap line height issue\n htmlObject.style.lineHeight = 'normal';\n return new Size(htmlObject.clientWidth, htmlObject.clientHeight);\n}\n/**\n * Function to sort the dataSource, by default it sort the data in ascending order.\n * @param {Object} data\n * @param {string} fields\n * @param {boolean} isDescending\n * @returns Object\n */\nexport function sort(data, fields, isDescending) {\n var sortData = extend([], data, null);\n sortData.sort(function (a, b) {\n var first = 0;\n var second = 0;\n for (var i = 0; i < fields.length; i++) {\n first += a[fields[i]];\n second += b[fields[i]];\n }\n if ((!isDescending && first < second) || (isDescending && first > second)) {\n return -1;\n }\n else if (first === second) {\n return 0;\n }\n return 1;\n });\n return sortData;\n}\n/** @private */\nexport function rotateTextSize(font, text, angle, chart) {\n var renderer = new SvgRenderer(chart.element.id);\n var box;\n var options;\n var htmlObject;\n options = {\n 'font-size': font.size,\n 'font-style': font.fontStyle,\n 'font-family': font.fontFamily,\n 'font-weight': font.fontWeight,\n 'transform': 'rotate(' + angle + ', 0, 0)',\n 'text-anchor': 'middle'\n };\n htmlObject = renderer.createText(options, text);\n if (!chart.delayRedraw) {\n chart.element.appendChild(chart.svgObject);\n }\n chart.svgObject.appendChild(htmlObject);\n box = htmlObject.getBoundingClientRect();\n remove(htmlObject);\n if (!chart.delayRedraw) {\n remove(chart.svgObject);\n }\n return new Size((box.right - box.left), (box.bottom - box.top));\n}\n/** @private */\nexport function removeElement(id) {\n var element = getElement(id);\n if (element) {\n remove(element);\n }\n}\n/** @private */\nexport function logBase(value, base) {\n return Math.log(value) / Math.log(base);\n}\n/** @private */\nexport function showTooltip(text, x, y, areaWidth, id, element, isTouch) {\n //let id1: string = 'EJ2_legend_tooltip';\n var tooltip = document.getElementById(id);\n var width = measureText(text, {\n fontFamily: 'Segoe UI', size: '12px',\n fontStyle: 'Normal', fontWeight: 'Regular'\n }).width + 5;\n x = (x + width > areaWidth) ? x - width : x;\n if (!tooltip) {\n tooltip = createElement('div', {\n innerHTML: text,\n id: id,\n styles: 'top:' + (y + 15).toString() + 'px;left:' + (x + 15).toString() +\n 'px;background-color: rgb(255, 255, 255) !important; color:black !important; ' +\n 'position:absolute;border:1px solid rgb(112, 112, 112); padding-left : 3px; padding-right : 2px;' +\n 'padding-bottom : 2px; padding-top : 2px; font-size:12px; font-family: \"Segoe UI\"'\n });\n element.appendChild(tooltip);\n }\n else {\n tooltip.innerHTML = text;\n tooltip.style.top = (y + 15).toString() + 'px';\n tooltip.style.left = (x + 15).toString() + 'px';\n }\n if (isTouch) {\n setTimeout(function () { removeElement(id); }, 1500);\n }\n}\n/** @private */\nexport function inside(value, range) {\n return (value < range.max) && (value > range.min);\n}\n/** @private */\nexport function withIn(value, range) {\n return (value <= range.max) && (value >= range.min);\n}\n/** @private */\nexport function withInRange(previousPoint, currentPoint, nextPoint, series) {\n var mX2 = series.logWithIn(currentPoint.xValue, series.xAxis);\n var mX1 = previousPoint ? series.logWithIn(previousPoint.xValue, series.xAxis) : mX2;\n var mX3 = nextPoint ? series.logWithIn(nextPoint.xValue, series.xAxis) : mX2;\n var xStart = Math.floor(series.xAxis.visibleRange.min);\n var xEnd = Math.ceil(series.xAxis.visibleRange.max);\n return ((mX1 >= xStart && mX1 <= xEnd) || (mX2 >= xStart && mX2 <= xEnd) ||\n (mX3 >= xStart && mX3 <= xEnd) || (xStart >= mX1 && xStart <= mX3));\n}\n/** @private */\nexport function sum(values) {\n var sum = 0;\n for (var _i = 0, values_1 = values; _i < values_1.length; _i++) {\n var value = values_1[_i];\n sum += value;\n }\n return sum;\n}\n/** @private */\nexport function subArraySum(values, first, last, index, series) {\n var sum = 0;\n if (index !== null) {\n for (var i = (first + 1); i < last; i++) {\n if (index.indexOf(i) === -1) {\n sum += values[i][series.yName];\n }\n }\n }\n else {\n for (var i = (first + 1); i < last; i++) {\n if (!isNullOrUndefined(values[i][series.yName])) {\n sum += values[i][series.yName];\n }\n }\n }\n return sum;\n}\n/** @private */\nexport function subtractThickness(rect, thickness) {\n rect.x += thickness.left;\n rect.y += thickness.top;\n rect.width -= thickness.left + thickness.right;\n rect.height -= thickness.top + thickness.bottom;\n return rect;\n}\n/** @private */\nexport function subtractRect(rect, thickness) {\n rect.x += thickness.x;\n rect.y += thickness.y;\n rect.width -= thickness.x + thickness.width;\n rect.height -= thickness.y + thickness.height;\n return rect;\n}\n/** @private */\nexport function degreeToLocation(degree, radius, center) {\n var radian = (degree * Math.PI) / 180;\n return new ChartLocation(Math.cos(radian) * radius + center.x, Math.sin(radian) * radius + center.y);\n}\nfunction getAccumulationLegend(locX, locY, r, height, width, mode) {\n var cartesianlarge = degreeToLocation(270, r, new ChartLocation(locX, locY));\n var cartesiansmall = degreeToLocation(270, r, new ChartLocation(locX + (width / 10), locY));\n return 'M' + ' ' + locX + ' ' + locY + ' ' + 'L' + ' ' + (locX + r) + ' ' + (locY) + ' ' + 'A' + ' ' + (r) + ' ' + (r) +\n ' ' + 0 + ' ' + 1 + ' ' + 1 + ' ' + cartesianlarge.x + ' ' + cartesianlarge.y + ' ' + 'Z' + ' ' + 'M' + ' ' + (locX +\n (width / 10)) + ' ' + (locY - (height / 10)) + ' ' + 'L' + (locX + (r)) + ' ' + (locY - height / 10) + ' ' + 'A' + ' '\n + (r) + ' ' + (r) + ' ' + 0 + ' ' + 0 + ' ' + 0 + ' ' + cartesiansmall.x + ' ' + cartesiansmall.y + ' ' + 'Z';\n}\n/** @private */\nexport function getAngle(center, point) {\n var angle = Math.atan2((point.y - center.y), (point.x - center.x));\n angle = angle < 0 ? (6.283 + angle) : angle;\n return angle * (180 / Math.PI);\n}\n/** @private */\nexport function subArray(values, index) {\n var subArray = [];\n for (var i = 0; i <= index - 1; i++) {\n subArray.push(values[i]);\n }\n return subArray;\n}\n/** @private */\nexport function valueToCoefficient(value, axis) {\n var range = axis.visibleRange;\n var result = (value - range.min) / (range.delta);\n return axis.isInversed ? (1 - result) : result;\n}\n/** @private */\nexport function TransformToVisible(x, y, xAxis, yAxis, isInverted, series) {\n x = (xAxis.valueType === 'Logarithmic' ? logBase(x > 1 ? x : 1, xAxis.logBase) : x);\n y = (yAxis.valueType === 'Logarithmic' ?\n logBase(y > 1 ? y : 1, yAxis.logBase) : y);\n x += xAxis.valueType === 'Category' && xAxis.labelPlacement === 'BetweenTicks' && series.type !== 'Radar' ? 0.5 : 0;\n var radius = series.chart.radius * valueToCoefficient(y, yAxis);\n var point = CoefficientToVector(valueToPolarCoefficient(x, xAxis), series.chart.primaryXAxis.startAngle);\n return {\n x: (series.clipRect.width / 2 + series.clipRect.x) + radius * point.x,\n y: (series.clipRect.height / 2 + series.clipRect.y) + radius * point.y\n };\n}\n/**\n * method to find series, point index by element id\n * @private\n */\nexport function indexFinder(id, isPoint) {\n if (isPoint === void 0) { isPoint = false; }\n var ids = ['NaN', 'NaN'];\n if (id.indexOf('_Point_') > -1) {\n ids = id.split('_Series_')[1].split('_Point_');\n }\n else if (id.indexOf('_shape_') > -1 && (!isPoint || (isPoint && id.indexOf('_legend_') === -1))) {\n ids = id.split('_shape_');\n ids[0] = '0';\n }\n else if (id.indexOf('_text_') > -1 && (!isPoint || (isPoint && id.indexOf('_legend_') === -1))) {\n ids = id.split('_text_');\n ids[0] = '0';\n }\n return new Index(parseInt(ids[0], 10), parseInt(ids[1], 10));\n}\n/** @private */\nexport function CoefficientToVector(coefficient, startAngle) {\n startAngle = startAngle < 0 ? startAngle + 360 : startAngle;\n var angle = Math.PI * (1.5 - 2 * coefficient);\n angle = angle + (startAngle * Math.PI) / 180;\n return { x: Math.cos(angle), y: Math.sin(angle) };\n}\n/** @private */\nexport function valueToPolarCoefficient(value, axis) {\n var range = axis.visibleRange;\n var delta;\n var length;\n if (axis.valueType !== 'Category') {\n delta = (range.max - (axis.valueType === 'DateTime' ? axis.dateTimeInterval : range.interval)) - range.min;\n length = axis.visibleLabels.length - 1;\n delta = delta === 0 ? 1 : delta;\n }\n else {\n delta = range.delta;\n length = axis.visibleLabels.length;\n }\n return axis.isInversed ? ((value - range.min) / delta) * (1 - 1 / (length)) :\n 1 - ((value - range.min) / delta) * (1 - 1 / (length));\n}\n/** @private */\nvar Mean = /** @class */ (function () {\n function Mean(verticalStandardMean, verticalSquareRoot, horizontalStandardMean, horizontalSquareRoot, verticalMean, horizontalMean) {\n this.verticalStandardMean = verticalStandardMean;\n this.horizontalStandardMean = horizontalStandardMean;\n this.verticalSquareRoot = verticalSquareRoot;\n this.horizontalSquareRoot = horizontalSquareRoot;\n this.verticalMean = verticalMean;\n this.horizontalMean = horizontalMean;\n }\n return Mean;\n}());\nexport { Mean };\n/** @private */\nvar PolarArc = /** @class */ (function () {\n function PolarArc(startAngle, endAngle, innerRadius, radius, currentXPosition) {\n this.startAngle = startAngle;\n this.endAngle = endAngle;\n this.innerRadius = innerRadius;\n this.radius = radius;\n this.currentXPosition = currentXPosition;\n }\n return PolarArc;\n}());\nexport { PolarArc };\n/** @private */\nexport function createTooltip(id, text, top, left, fontSize) {\n var tooltip = getElement(id);\n var style = 'top:' + top.toString() + 'px;' +\n 'left:' + left.toString() + 'px;' +\n 'color:black !important' +\n 'background:#FFFFFF !important' + ';' +\n 'position:absolute;border:1px solid #707070;font-size:' + fontSize + ';border-radius:2px;';\n if (!tooltip) {\n tooltip = createElement('div', {\n id: id, innerHTML: ' ' + text + ' ', styles: style\n });\n document.body.appendChild(tooltip);\n }\n else {\n tooltip.setAttribute('innerHTML', ' ' + text + ' ');\n tooltip.setAttribute('styles', style);\n }\n}\n/** @private */\nexport function createZoomingLabels(chart, axis, parent, index, isVertical, rect) {\n var margin = 5;\n var opposedPosition = axis.opposedPosition;\n var anchor = isVertical ? 'start' : 'auto';\n var size;\n var chartRect = chart.availableSize.width;\n var x;\n var y;\n var rx = 3;\n var arrowLocation;\n var direction;\n for (var i = 0; i < 2; i++) {\n size = measureText(i ? axis.endLabel : axis.startLabel, axis.labelStyle);\n if (isVertical) {\n arrowLocation = i ? new ChartLocation(rect.x, rect.y + rx) :\n new ChartLocation(axis.rect.x, (rect.y + rect.height - rx));\n x = (rect.x + (opposedPosition ? (rect.width + margin) : -(size.width + margin + margin)));\n y = (rect.y + (i ? 0 : rect.height - size.height - margin));\n x += (x < 0 || ((chartRect) < (x + size.width + margin))) ? (opposedPosition ? -(size.width / 2) : size.width / 2) : 0;\n direction = findDirection(rx, rx, new Rect(x, y, size.width + margin, size.height + margin), arrowLocation, margin, false, false, !opposedPosition, arrowLocation.x, arrowLocation.y + (i ? -rx : rx));\n }\n else {\n arrowLocation = i ? new ChartLocation((rect.x + rect.width - rx), (rect.y + rect.height)) :\n new ChartLocation(rect.x + rx, (rect.y + rect.height));\n x = (rect.x + (i ? (rect.width - size.width - margin) : 0));\n y = (opposedPosition ? (rect.y - size.height - 10) : (rect.y + rect.height + margin));\n direction = findDirection(rx, rx, new Rect(x, y, size.width + margin, size.height + margin), arrowLocation, margin, opposedPosition, !opposedPosition, false, arrowLocation.x + (i ? rx : -rx), arrowLocation.y);\n }\n x = x + (margin / 2);\n y = y + (3 * (size.height / 4)) + (margin / 2);\n parent.appendChild(chart.renderer.drawPath(new PathOption(chart.element.id + '_Zoom_' + index + '_AxisLabel_Shape_' + i, chart.themeStyle.crosshairFill, 2, chart.themeStyle.crosshairFill, 1, null, direction)));\n textElement(new TextOption(chart.element.id + '_Zoom_' + index + '_AxisLabel_' + i, x, y, anchor, i ? axis.endLabel : axis.startLabel), { color: chart.themeStyle.crosshairLabel, fontFamily: 'Segoe UI', fontWeight: 'Regular', size: '11px' }, chart.themeStyle.crosshairLabel, parent);\n }\n return parent;\n}\n//Within bounds\n/** @private */\nexport function withInBounds(x, y, bounds, width, height) {\n if (width === void 0) { width = 0; }\n if (height === void 0) { height = 0; }\n return (x >= bounds.x - width && x <= bounds.x + bounds.width + width && y >= bounds.y - height\n && y <= bounds.y + bounds.height + height);\n}\n/** @private */\nexport function getValueXByPoint(value, size, axis) {\n var actualValue = !axis.isInversed ? value / size : (1 - (value / size));\n return actualValue * (axis.visibleRange.delta) + axis.visibleRange.min;\n}\n/** @private */\nexport function getValueYByPoint(value, size, axis) {\n var actualValue = axis.isInversed ? value / size : (1 - (value / size));\n return actualValue * (axis.visibleRange.delta) + axis.visibleRange.min;\n}\n/** @private */\nexport function findClipRect(series) {\n var rect = series.clipRect;\n if (series.chart.requireInvertedAxis) {\n rect.x = series.yAxis.rect.x;\n rect.y = series.xAxis.rect.y;\n rect.width = series.yAxis.rect.width;\n rect.height = series.xAxis.rect.height;\n }\n else {\n rect.x = series.xAxis.rect.x;\n rect.y = series.yAxis.rect.y;\n rect.width = series.xAxis.rect.width;\n rect.height = series.yAxis.rect.height;\n }\n}\n/** @private */\nexport function firstToLowerCase(str) {\n return str.substr(0, 1).toLowerCase() + str.substr(1);\n}\n/** @private */\nexport function getMinPointsDelta(axis, seriesCollection) {\n var minDelta = Number.MAX_VALUE;\n var xValues;\n var minVal;\n seriesCollection.forEach(function (series, index) {\n xValues = [];\n if (series.visible &&\n (axis.name === series.xAxisName || (axis.name === 'primaryXAxis' && series.xAxisName === null)\n || (axis.name === series.chart.primaryXAxis.name && !series.xAxisName))) {\n xValues = series.points.map(function (point, index) {\n return point.xValue;\n });\n xValues.sort(function (first, second) { return first - second; });\n if (xValues.length === 1) {\n minVal = xValues[0] - ((series.xMin && series.xAxis.valueType !== 'DateTime') ?\n series.xMin : axis.visibleRange.min);\n if (minVal !== 0) {\n minDelta = Math.min(minDelta, minVal);\n }\n }\n else {\n xValues.forEach(function (value, index, xValues) {\n if (index > 0 && value) {\n minVal = value - xValues[index - 1];\n if (minVal !== 0) {\n minDelta = Math.min(minDelta, minVal);\n }\n }\n });\n }\n }\n });\n if (minDelta === Number.MAX_VALUE) {\n minDelta = 1;\n }\n return minDelta;\n}\n/** @private */\nexport function getAnimationFunction(effect) {\n var functionName;\n switch (effect) {\n case 'Linear':\n functionName = linear;\n break;\n }\n return functionName;\n}\n/**\n * Animation Effect Calculation Started Here\n * @param currentTime\n * @param startValue\n * @param endValue\n * @param duration\n * @private\n */\nexport function linear(currentTime, startValue, endValue, duration) {\n return -endValue * Math.cos(currentTime / duration * (Math.PI / 2)) + endValue + startValue;\n}\n/**\n * Animation Effect Calculation End\n * @private\n */\nexport function markerAnimate(element, delay, duration, series, pointIndex, point, isLabel) {\n var centerX = point.x;\n var centerY = point.y;\n var height = 0;\n element.style.visibility = 'hidden';\n new Animation({}).animate(element, {\n duration: duration,\n delay: delay,\n progress: function (args) {\n if (args.timeStamp > args.delay) {\n args.element.style.visibility = 'visible';\n height = ((args.timeStamp - args.delay) / args.duration);\n element.setAttribute('transform', 'translate(' + centerX\n + ' ' + centerY + ') scale(' + height + ') translate(' + (-centerX) + ' ' + (-centerY) + ')');\n }\n },\n end: function (model) {\n element.style.visibility = '';\n element.removeAttribute('transform');\n if ((series.type === 'Scatter' || series.type === 'Bubble') && !isLabel && (pointIndex === series.points.length - 1)) {\n series.chart.trigger('animationComplete', { series: series });\n }\n }\n });\n}\n/**\n * Animation for template\n * @private\n */\nexport function templateAnimate(element, delay, duration, name, isRemove) {\n new Animation({}).animate(element, {\n duration: duration,\n delay: delay,\n name: name,\n progress: function (args) {\n args.element.style.visibility = 'visible';\n },\n end: function (args) {\n if (isRemove) {\n remove(args.element);\n }\n else {\n args.element.style.visibility = 'visible';\n }\n },\n });\n}\n/** @private */\nexport function drawSymbol(location, shape, size, url, options, label) {\n var functionName = 'Path';\n var renderer = new SvgRenderer('');\n var temp = calculateShapes(location, size, shape, options, url);\n var htmlObject = renderer['draw' + temp.functionName](temp.renderOption);\n htmlObject.setAttribute('aria-label', label);\n return htmlObject;\n}\n/** @private */\nexport function calculateShapes(location, size, shape, options, url) {\n var path;\n var functionName = 'Path';\n var width = size.width;\n var height = size.height;\n var locX = location.x;\n var locY = location.y;\n var x = location.x + (-width / 2);\n var y = location.y + (-height / 2);\n switch (shape) {\n case 'Circle':\n case 'Bubble':\n functionName = 'Ellipse';\n merge(options, { 'rx': width / 2, 'ry': height / 2, 'cx': locX, 'cy': locY });\n break;\n case 'Cross':\n path = 'M' + ' ' + x + ' ' + locY + ' ' + 'L' + ' ' + (locX + (width / 2)) + ' ' + locY + ' ' +\n 'M' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + locX + ' ' +\n (locY + (-height / 2));\n merge(options, { 'd': path });\n break;\n case 'HorizontalLine':\n path = 'M' + ' ' + x + ' ' + locY + ' ' + 'L' + ' ' + (locX + (width / 2)) + ' ' + locY;\n merge(options, { 'd': path });\n break;\n case 'VerticalLine':\n path = 'M' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + locX + ' ' + (locY + (-height / 2));\n merge(options, { 'd': path });\n break;\n case 'Diamond':\n path = 'M' + ' ' + x + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + locY + ' z';\n merge(options, { 'd': path });\n break;\n case 'Rectangle':\n case 'Hilo':\n case 'HiloOpenClose':\n case 'Candle':\n case 'Waterfall':\n case 'BoxAndWhisker':\n case 'StepArea':\n path = 'M' + ' ' + x + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (-height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'Pyramid':\n case 'Triangle':\n path = 'M' + ' ' + x + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'Funnel':\n case 'InvertedTriangle':\n path = 'M' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + (locX - (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'Pentagon':\n var eq = 72;\n var xValue = void 0;\n var yValue = void 0;\n for (var i = 0; i <= 5; i++) {\n xValue = (width / 2) * Math.cos((Math.PI / 180) * (i * eq));\n yValue = (height / 2) * Math.sin((Math.PI / 180) * (i * eq));\n if (i === 0) {\n path = 'M' + ' ' + (locX + xValue) + ' ' + (locY + yValue) + ' ';\n }\n else {\n path = path.concat('L' + ' ' + (locX + xValue) + ' ' + (locY + yValue) + ' ');\n }\n }\n path = path.concat('Z');\n merge(options, { 'd': path });\n break;\n case 'Image':\n functionName = 'Image';\n merge(options, { 'href': url, 'height': height, 'width': width, x: x, y: y });\n break;\n }\n options = calculateLegendShapes(location, new Size(width, height), shape, options).renderOption;\n return { renderOption: options, functionName: functionName };\n}\n/** @private */\nexport function getRectLocation(startLocation, endLocation, outerRect) {\n var x;\n var y;\n x = (endLocation.x < outerRect.x) ? outerRect.x :\n (endLocation.x > (outerRect.x + outerRect.width)) ? outerRect.x + outerRect.width : endLocation.x;\n y = (endLocation.y < outerRect.y) ? outerRect.y :\n (endLocation.y > (outerRect.y + outerRect.height)) ? outerRect.y + outerRect.height : endLocation.y;\n return new Rect((x > startLocation.x ? startLocation.x : x), (y > startLocation.y ? startLocation.y : y), Math.abs(x - startLocation.x), Math.abs(y - startLocation.y));\n}\n/** @private */\nexport function minMax(value, min, max) {\n return value > max ? max : (value < min ? min : value);\n}\n/** @private */\nexport function getElement(id) {\n return document.getElementById(id);\n}\n/** @private */\nexport function getTemplateFunction(template) {\n var templateFn = null;\n var e;\n try {\n if (document.querySelectorAll(template).length) {\n templateFn = templateComplier(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (e) {\n templateFn = templateComplier(template);\n }\n return templateFn;\n}\n/** @private */\nexport function createTemplate(childElement, pointIndex, content, chart, point, series) {\n var templateFn;\n var templateElement;\n templateFn = getTemplateFunction(content);\n try {\n if (templateFn && templateFn({ chart: chart, series: series, point: point }).length) {\n templateElement = templateFn({ chart: chart, series: series, point: point });\n while (templateElement.length > 0) {\n childElement.appendChild(templateElement[0]);\n }\n }\n }\n catch (e) {\n return childElement;\n }\n return childElement;\n}\n/** @private */\nexport function getFontStyle(font) {\n var style = '';\n style = 'font-size:' + font.size +\n '; font-style:' + font.fontStyle + '; font-weight:' + font.fontWeight +\n '; font-family:' + font.fontFamily + ';opacity:' + font.opacity +\n '; color:' + font.color + ';';\n return style;\n}\n/** @private */\nexport function measureElementRect(element) {\n var bounds;\n document.body.appendChild(element);\n bounds = element.getBoundingClientRect();\n removeElement(element.id);\n return bounds;\n}\n/** @private */\nexport function findlElement(elements, id) {\n var element;\n for (var i = 0, length_1 = elements.length; i < length_1; i++) {\n if (elements[i].id.indexOf(id) > -1) {\n element = elements[i];\n continue;\n }\n }\n return element;\n}\n/** @private */\nexport function getPoint(x, y, xAxis, yAxis, isInverted, series) {\n x = ((xAxis.valueType === 'Logarithmic') ? logBase(((x > 1) ? x : 1), xAxis.logBase) : x);\n y = ((yAxis.valueType === 'Logarithmic') ? logBase(((y > 1) ? y : 1), yAxis.logBase) : y);\n x = valueToCoefficient(x, xAxis);\n y = valueToCoefficient(y, yAxis);\n var xLength = (isInverted ? xAxis.rect.height : xAxis.rect.width);\n var yLength = (isInverted ? yAxis.rect.width : yAxis.rect.height);\n var locationX = isInverted ? y * (yLength) : x * (xLength);\n var locationY = isInverted ? (1 - x) * (xLength) : (1 - y) * (yLength);\n return new ChartLocation(locationX, locationY);\n}\n/** @private */\nexport function appendElement(child, parent) {\n if (child && child.hasChildNodes() && parent) {\n parent.appendChild(child);\n }\n else {\n return null;\n }\n}\n/** @private */\nexport function getDraggedRectLocation(x1, y1, x2, y2, outerRect) {\n var width = Math.abs(x1 - x2);\n var height = Math.abs(y1 - y2);\n var x = Math.max(checkBounds(Math.min(x1, x2), width, outerRect.x, outerRect.width), outerRect.x);\n var y = Math.max(checkBounds(Math.min(y1, y2), height, outerRect.y, outerRect.height), outerRect.y);\n return new Rect(x, y, Math.min(width, outerRect.width), Math.min(height, outerRect.height));\n}\n/** @private */\nexport function checkBounds(start, size, min, max) {\n if (start < min) {\n start = min;\n }\n else if ((start + size) > (max + min)) {\n start = (max + min) - size;\n }\n return start;\n}\n/** @private */\nexport function getLabelText(currentPoint, series, chart) {\n var labelFormat = series.yAxis.labelFormat;\n var text = [];\n var customLabelFormat = labelFormat.match('{value}') !== null;\n switch (series.seriesType) {\n case 'XY':\n text.push(currentPoint.text || currentPoint.yValue.toString());\n break;\n case 'HighLow':\n text.push(currentPoint.text || Math.max(currentPoint.high, currentPoint.low).toString());\n text.push(currentPoint.text || Math.min(currentPoint.high, currentPoint.low).toString());\n break;\n case 'HighLowOpenClose':\n text.push(currentPoint.text || Math.max(currentPoint.high, currentPoint.low).toString());\n text.push(currentPoint.text || Math.min(currentPoint.high, currentPoint.low).toString());\n text.push(currentPoint.text || Math.max(currentPoint.open, currentPoint.close).toString());\n text.push(currentPoint.text || Math.min(currentPoint.open, currentPoint.close).toString());\n break;\n case 'BoxPlot':\n text.push(currentPoint.text || currentPoint.median.toString());\n text.push(currentPoint.text || currentPoint.maximum.toString());\n text.push(currentPoint.text || currentPoint.minimum.toString());\n text.push(currentPoint.text || currentPoint.upperQuartile.toString());\n text.push(currentPoint.text || currentPoint.lowerQuartile.toString());\n for (var _i = 0, _a = currentPoint.outliers; _i < _a.length; _i++) {\n var liers = _a[_i];\n text.push(currentPoint.text || liers.toString());\n }\n break;\n }\n if (labelFormat && !currentPoint.text) {\n for (var i = 0; i < text.length; i++) {\n text[i] = customLabelFormat ? labelFormat.replace('{value}', series.yAxis.format(parseFloat(text[i]))) :\n series.yAxis.format(parseFloat(text[i]));\n }\n }\n return text;\n}\n/** @private */\nexport function stopTimer(timer) {\n window.clearInterval(timer);\n}\n/** @private */\nexport function isCollide(rect, collections, clipRect) {\n var isCollide;\n var currentRect = new Rect(rect.x + clipRect.x, rect.y + clipRect.y, rect.width, rect.height);\n isCollide = collections.some(function (rect) {\n return (currentRect.x < rect.x + rect.width && currentRect.x + currentRect.width > rect.x &&\n currentRect.y < rect.y + rect.height && currentRect.height + currentRect.y > rect.y);\n });\n return isCollide;\n}\n/** @private */\nexport function isOverlap(currentRect, rect) {\n return (currentRect.x < rect.x + rect.width && currentRect.x + currentRect.width > rect.x &&\n currentRect.y < rect.y + rect.height && currentRect.height + currentRect.y > rect.y);\n}\n/** @private */\nexport function containsRect(currentRect, rect) {\n return (currentRect.x <= rect.x && currentRect.x + currentRect.width >= rect.x + rect.width &&\n currentRect.y <= rect.y && currentRect.height + currentRect.y >= rect.y + rect.height);\n}\n/** @private */\nexport function calculateRect(location, textSize, margin) {\n return new Rect((location.x - (textSize.width / 2) - margin.left), (location.y - (textSize.height / 2) - margin.top), textSize.width + margin.left + margin.right, textSize.height + margin.top + margin.bottom);\n}\n/** @private */\nexport function convertToHexCode(value) {\n return '#' + componentToHex(value.r) + componentToHex(value.g) + componentToHex(value.b);\n}\n/** @private */\nexport function componentToHex(value) {\n var hex = value.toString(16);\n return hex.length === 1 ? '0' + hex : hex;\n}\n/** @private */\nexport function convertHexToColor(hex) {\n var result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result ? new ColorValue(parseInt(result[1], 16), parseInt(result[2], 16), parseInt(result[3], 16)) :\n new ColorValue(255, 255, 255);\n}\n/** @private */\nexport function colorNameToHex(color) {\n var element;\n color = color === 'transparent' ? 'white' : color;\n element = document.getElementById('chartmeasuretext');\n element.style.color = color;\n color = window.getComputedStyle(element).color;\n var exp = /^(rgb|hsl)(a?)[(]\\s*([\\d.]+\\s*%?)\\s*,\\s*([\\d.]+\\s*%?)\\s*,\\s*([\\d.]+\\s*%?)\\s*(?:,\\s*([\\d.]+)\\s*)?[)]$/;\n var isRGBValue = exp.exec(color);\n return convertToHexCode(new ColorValue(parseInt(isRGBValue[3], 10), parseInt(isRGBValue[4], 10), parseInt(isRGBValue[5], 10)));\n}\n/** @private */\nexport function getSaturationColor(color, factor) {\n color = colorNameToHex(color);\n color = color.replace(/[^0-9a-f]/gi, '');\n if (color.length < 6) {\n color = color[0] + color[0] + color[1] + color[1] + color[2] + color[2];\n }\n factor = factor || 0;\n // convert to decimal and change luminosity\n var rgb = '#';\n var colorCode;\n for (var i = 0; i < 3; i++) {\n colorCode = parseInt(color.substr(i * 2, 2), 16);\n colorCode = Math.round(Math.min(Math.max(0, colorCode + (colorCode * factor)), 255));\n rgb += ('00' + colorCode.toString(16)).substr(colorCode.toString(16).length);\n }\n return rgb;\n}\n/** @private */\nexport function getMedian(values) {\n var half = Math.floor(values.length / 2);\n return values.length % 2 ? values[half] : ((values[half - 1] + values[half]) / 2.0);\n}\n/** @private */\n// tslint:disable-next-line:max-func-body-length\nexport function calculateLegendShapes(location, size, shape, options) {\n var padding = 10;\n var path = '';\n var height = size.height;\n var width = size.width;\n var locX = location.x;\n var locY = location.y;\n switch (shape) {\n case 'MultiColoredLine':\n case 'Line':\n path = 'M' + ' ' + (locX + (-width / 2)) + ' ' + (locY) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY);\n merge(options, { 'd': path });\n break;\n case 'StepLine':\n options.fill = 'transparent';\n path = 'M' + ' ' + (locX + (-width / 2) - (padding / 4)) + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + (locX +\n (-width / 2) + (width / 10)) + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + (locX + (-width / 2) + (width / 10))\n + ' ' + (locY) + ' ' + 'L' + ' ' + (locX + (-width / 10)) + ' ' + (locY) + ' ' + 'L' + ' ' + (locX + (-width / 10))\n + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + (locX + (width / 5)) + ' ' + (locY + (height / 2)) + ' ' + 'L' +\n ' ' + (locX + (width / 5)) + ' ' + (locY + (-height / 2)) + ' ' + 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY +\n (-height / 2)) + 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' + 'L' + '' + (locX + (width / 2)\n + (padding / 4)) + ' ' + (locY + (height / 2));\n merge(options, { 'd': path });\n break;\n case 'RightArrow':\n var space = 2;\n path = 'M' + ' ' + (locX + (-width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY) + ' ' + 'L' + ' ' +\n (locX + (-width / 2)) + ' ' + (locY + (height / 2)) + ' L' + ' ' + (locX + (-width / 2)) + ' ' +\n (locY + (height / 2) - space) + ' ' + 'L' + ' ' + (locX + (width / 2) - (2 * space)) + ' ' + (locY) +\n ' L' + (locX + (-width / 2)) + ' ' + (locY - (height / 2) + space) + ' Z';\n merge(options, { 'd': path });\n break;\n case 'LeftArrow':\n options.fill = options.stroke;\n options.stroke = 'transparent';\n space = 2;\n path = 'M' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + (-width / 2)) + ' ' + (locY) + ' ' + 'L' + ' ' +\n (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' +\n (locX + (width / 2)) + ' ' + (locY + (height / 2) - space) + ' L' + ' ' + (locX + (-width / 2) + (2 * space))\n + ' ' + (locY) + ' L' + (locX + (width / 2)) + ' ' + (locY - (height / 2) + space) + ' Z';\n merge(options, { 'd': path });\n break;\n case 'Column':\n case 'StackingColumn':\n case 'StackingColumn100':\n case 'RangeColumn':\n path = 'M' + ' ' + (locX - 3 * (width / 5)) + ' ' + (locY - (height / 5)) + ' ' + 'L' + ' ' +\n (locX + 3 * (-width / 10)) + ' ' + (locY - (height / 5)) + ' ' + 'L' + ' ' +\n (locX + 3 * (-width / 10)) + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + (locX - 3 *\n (width / 5)) + ' ' + (locY + (height / 2)) + ' ' + 'Z' + ' ' + 'M' + ' ' +\n (locX + (-width / 10) - (width / 20)) + ' ' + (locY - (height / 4) - (padding / 2))\n + ' ' + 'L' + ' ' + (locX + (width / 10) + (width / 20)) + ' ' + (locY - (height / 4) -\n (padding / 2)) + ' ' + 'L' + ' ' + (locX + (width / 10) + (width / 20)) + ' ' + (locY\n + (height / 2)) + ' ' + 'L' + ' ' + (locX + (-width / 10) - (width / 20)) + ' ' + (locY +\n (height / 2)) + ' ' + 'Z' + ' ' + 'M' + ' ' + (locX + 3 * (width / 10)) + ' ' + (locY) + ' ' +\n 'L' + ' ' + (locX + 3 * (width / 5)) + ' ' + (locY) + ' ' + 'L' + ' '\n + (locX + 3 * (width / 5)) + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' '\n + (locX + 3 * (width / 10)) + ' ' + (locY + (height / 2)) + ' ' + 'Z';\n merge(options, { 'd': path });\n break;\n case 'Bar':\n case 'StackingBar':\n case 'StackingBar100':\n path = 'M' + ' ' + (locX + (-width / 2) + (-padding / 4)) + ' ' + (locY - 3 * (height / 5)) + ' '\n + 'L' + ' ' + (locX + 3 * (width / 10)) + ' ' + (locY - 3 * (height / 5)) + ' ' + 'L' + ' ' +\n (locX + 3 * (width / 10)) + ' ' + (locY - 3 * (height / 10)) + ' ' + 'L' + ' ' +\n (locX - (width / 2) + (-padding / 4)) + ' ' + (locY - 3 * (height / 10)) + ' ' + 'Z' + ' '\n + 'M' + ' ' + (locX + (-width / 2) + (-padding / 4)) + ' ' + (locY - (height / 5)\n + (padding / 20)) + ' ' + 'L' + ' ' + (locX + (width / 2) + (padding / 4)) + ' ' + (locY\n - (height / 5) + (padding / 20)) + ' ' + 'L' + ' ' + (locX + (width / 2) + (padding / 4))\n + ' ' + (locY + (height / 10) + (padding / 20)) + ' ' + 'L' + ' ' + (locX - (width / 2)\n + (-padding / 4)) + ' ' + (locY + (height / 10) + (padding / 20)) + ' ' + 'Z' + ' ' + 'M'\n + ' ' + (locX - (width / 2) + (-padding / 4)) + ' ' + (locY + (height / 5)\n + (padding / 10)) + ' ' + 'L' + ' ' + (locX + (-width / 4)) + ' ' + (locY + (height / 5)\n + (padding / 10)) + ' ' + 'L' + ' ' + (locX + (-width / 4)) + ' ' + (locY + (height / 2)\n + (padding / 10)) + ' ' + 'L' + ' ' + (locX - (width / 2) + (-padding / 4))\n + ' ' + (locY + (height / 2) + (padding / 10)) + ' ' + 'Z';\n merge(options, { 'd': path });\n break;\n case 'Spline':\n options.fill = 'transparent';\n path = 'M' + ' ' + (locX - (width / 2)) + ' ' + (locY + (height / 5)) + ' ' + 'Q' + ' '\n + locX + ' ' + (locY - height) + ' ' + locX + ' ' + (locY + (height / 5))\n + ' ' + 'M' + ' ' + locX + ' ' + (locY + (height / 5)) + ' ' + 'Q' + ' ' + (locX\n + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' + (locX + (width / 2)) + ' '\n + (locY - (height / 2));\n merge(options, { 'd': path });\n break;\n case 'Area':\n case 'MultiColoredArea':\n case 'RangeArea':\n case 'StackingArea':\n case 'StackingArea100':\n path = 'M' + ' ' + (locX - (width / 2) - (padding / 4)) + ' ' + (locY + (height / 2))\n + ' ' + 'L' + ' ' + (locX + (-width / 4) + (-padding / 8)) + ' ' + (locY - (height / 2))\n + ' ' + 'L' + ' ' + (locX) + ' ' + (locY + (height / 4)) + ' ' + 'L' + ' ' + (locX\n + (width / 4) + (padding / 8)) + ' ' + (locY + (-height / 2) + (height / 4)) + ' '\n + 'L' + ' ' + (locX + (height / 2) + (padding / 4)) + ' ' + (locY + (height / 2)) + ' ' + 'Z';\n merge(options, { 'd': path });\n break;\n case 'SplineArea':\n path = 'M' + ' ' + (locX - (width / 2)) + ' ' + (locY + (height / 5)) + ' ' + 'Q' + ' ' + locX\n + ' ' + (locY - height) + ' ' + locX + ' ' + (locY + (height / 5)) + ' ' + 'Z' + ' ' + 'M'\n + ' ' + locX + ' ' + (locY + (height / 5)) + ' ' + 'Q' + ' ' + (locX + (width / 2)) + ' '\n + (locY + (height / 2)) + ' ' + (locX + (width / 2)) + ' '\n + (locY - (height / 2)) + ' ' + ' Z';\n merge(options, { 'd': path });\n break;\n case 'Pie':\n case 'Doughnut':\n options.stroke = 'transparent';\n var r = Math.min(height, width) / 2;\n path = getAccumulationLegend(locX, locY, r, height, width, shape);\n merge(options, { 'd': path });\n break;\n }\n return { renderOption: options };\n}\n/** @private */\nexport function textTrim(maxWidth, text, font) {\n var label = text;\n var size = measureText(text, font).width;\n if (size > maxWidth) {\n var textLength = text.length;\n for (var i = textLength - 1; i >= 0; --i) {\n label = text.substring(0, i) + '...';\n size = measureText(label, font).width;\n if (size <= maxWidth) {\n return label;\n }\n }\n }\n return label;\n}\n/** @private */\nexport function stringToNumber(value, containerSize) {\n if (value !== null && value !== undefined) {\n return value.indexOf('%') !== -1 ? (containerSize / 100) * parseInt(value, 10) : parseInt(value, 10);\n }\n return null;\n}\n/** @private */\nexport function findDirection(rX, rY, rect, arrowLocation, arrowPadding, top, bottom, left, tipX, tipY, tipRadius) {\n var direction = '';\n var startX = rect.x;\n var startY = rect.y;\n var width = rect.x + rect.width;\n var height = rect.y + rect.height;\n tipRadius = tipRadius ? tipRadius : 0;\n if (top) {\n direction = direction.concat('M' + ' ' + (startX) + ' ' + (startY + rY) + ' Q ' + startX + ' '\n + startY + ' ' + (startX + rX) + ' ' + startY + ' ' +\n ' L' + ' ' + (width - rX) + ' ' + (startY) + ' Q ' + width + ' '\n + startY + ' ' + (width) + ' ' + (startY + rY));\n direction = direction.concat(' L' + ' ' + (width) + ' ' + (height - rY) + ' Q ' + width + ' '\n + (height) + ' ' + (width - rX) + ' ' + (height));\n if (arrowPadding !== 0) {\n direction = direction.concat(' L' + ' ' + (arrowLocation.x + arrowPadding / 2) + ' ' + (height));\n direction = direction.concat(' L' + ' ' + (tipX + tipRadius) + ' ' + (height + arrowPadding - tipRadius));\n direction += ' Q' + ' ' + (tipX) + ' ' + (height + arrowPadding) + ' ' + (tipX - tipRadius) +\n ' ' + (height + arrowPadding - tipRadius);\n }\n if ((arrowLocation.x - arrowPadding / 2) > startX) {\n direction = direction.concat(' L' + ' ' + (arrowLocation.x - arrowPadding / 2) + ' ' + height +\n ' L' + ' ' + (startX + rX) + ' ' + height + ' Q ' + startX + ' '\n + height + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else {\n if (arrowPadding === 0) {\n direction = direction.concat(' L' + ' ' + (startX + rX) + ' ' + height + ' Q ' + startX + ' '\n + height + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else {\n direction = direction.concat(' L' + ' ' + (startX) + ' ' + (height + rY) + ' z');\n }\n }\n }\n else if (bottom) {\n direction = direction.concat('M' + ' ' + (startX) + ' ' + (startY + rY) + ' Q ' + startX + ' '\n + (startY) + ' ' + (startX + rX) + ' ' + (startY) + ' L' + ' ' + (arrowLocation.x - arrowPadding / 2) + ' ' + (startY));\n direction = direction.concat(' L' + ' ' + (tipX - tipRadius) + ' ' + (arrowLocation.y + tipRadius));\n direction += ' Q' + ' ' + (tipX) + ' ' + (arrowLocation.y) + ' ' + (tipX + tipRadius) + ' ' + (arrowLocation.y + tipRadius);\n direction = direction.concat(' L' + ' ' + (arrowLocation.x + arrowPadding / 2) + ' ' + (startY) + ' L' + ' '\n + (width - rX) + ' ' + (startY) + ' Q ' + (width) + ' ' + (startY) + ' ' + (width) + ' ' + (startY + rY));\n direction = direction.concat(' L' + ' ' + (width) + ' ' + (height - rY) + ' Q ' + (width) + ' '\n + (height) + ' ' + (width - rX) + ' ' + (height) +\n ' L' + ' ' + (startX + rX) + ' ' + (height) + ' Q ' + (startX) + ' '\n + (height) + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else if (left) {\n direction = direction.concat('M' + ' ' + (startX) + ' ' + (startY + rY) + ' Q ' + startX + ' '\n + (startY) + ' ' + (startX + rX) + ' ' + (startY));\n direction = direction.concat(' L' + ' ' + (width - rX) + ' ' + (startY) + ' Q ' + (width) + ' '\n + (startY) + ' ' + (width) + ' ' + (startY + rY) + ' L' + ' ' + (width) + ' ' + (arrowLocation.y - arrowPadding / 2));\n direction = direction.concat(' L' + ' ' + (width + arrowPadding - tipRadius) + ' ' + (tipY - tipRadius));\n direction += ' Q ' + (width + arrowPadding) + ' ' + (tipY) + ' ' + (width + arrowPadding - tipRadius) + ' ' + (tipY + tipRadius);\n direction = direction.concat(' L' + ' ' + (width) + ' ' + (arrowLocation.y + arrowPadding / 2) +\n ' L' + ' ' + (width) + ' ' + (height - rY) + ' Q ' + width + ' ' + (height) + ' ' + (width - rX) + ' ' + (height));\n direction = direction.concat(' L' + ' ' + (startX + rX) + ' ' + (height) + ' Q ' + startX + ' '\n + (height) + ' ' + (startX) + ' ' + (height - rY) + ' z');\n }\n else {\n direction = direction.concat('M' + ' ' + (startX + rX) + ' ' + (startY) + ' Q ' + (startX) + ' '\n + (startY) + ' ' + (startX) + ' ' + (startY + rY) + ' L' + ' ' + (startX) + ' ' + (arrowLocation.y - arrowPadding / 2));\n direction = direction.concat(' L' + ' ' + (startX - arrowPadding + tipRadius) + ' ' + (tipY - tipRadius));\n direction += ' Q ' + (startX - arrowPadding) + ' ' + (tipY) + ' ' + (startX - arrowPadding + tipRadius) + ' ' + (tipY + tipRadius);\n direction = direction.concat(' L' + ' ' + (startX) + ' ' + (arrowLocation.y + arrowPadding / 2) +\n ' L' + ' ' + (startX) + ' ' + (height - rY) + ' Q ' + startX + ' '\n + (height) + ' ' + (startX + rX) + ' ' + (height));\n direction = direction.concat(' L' + ' ' + (width - rX) + ' ' + (height) + ' Q ' + width + ' '\n + (height) + ' ' + (width) + ' ' + (height - rY) +\n ' L' + ' ' + (width) + ' ' + (startY + rY) + ' Q ' + width + ' '\n + (startY) + ' ' + (width - rX) + ' ' + (startY) + ' z');\n }\n return direction;\n}\n/** @private */\nexport function textElement(options, font, color, parent, isMinus) {\n if (isMinus === void 0) { isMinus = false; }\n var renderOptions = {};\n var htmlObject;\n var tspanElement;\n var renderer = new SvgRenderer('');\n var text;\n var height;\n renderOptions = {\n 'id': options.id,\n 'x': options.x,\n 'y': options.y,\n 'fill': color,\n 'font-size': font.size,\n 'font-style': font.fontStyle,\n 'font-family': font.fontFamily,\n 'font-weight': font.fontWeight,\n 'text-anchor': options.anchor,\n 'transform': options.transform,\n 'opacity': font.opacity,\n 'dominant-baseline': options.baseLine\n };\n text = typeof options.text === 'string' ? options.text : isMinus ? options.text[options.text.length - 1] : options.text[0];\n htmlObject = renderer.createText(renderOptions, text);\n if (typeof options.text !== 'string' && options.text.length > 1) {\n for (var i = 1, len = options.text.length; i < len; i++) {\n height = (measureText(options.text[i], font).height);\n tspanElement = renderer.createTSpan({\n 'x': options.x, 'id': options.id,\n 'y': (options.y) + ((isMinus) ? -(i * height) : (i * height))\n }, isMinus ? options.text[options.text.length - (i + 1)] : options.text[i]);\n htmlObject.appendChild(tspanElement);\n }\n }\n parent.appendChild(htmlObject);\n return htmlObject;\n}\n/**\n * Method to calculate the width and height of the chart\n */\nexport function calculateSize(chart) {\n var containerWidth = chart.element.clientWidth;\n var containerHeight = chart.element.clientHeight;\n chart.availableSize = new Size(stringToNumber(chart.width, containerWidth) || containerWidth || 600, stringToNumber(chart.height, containerHeight) || containerHeight || 450);\n}\nexport function createSvg(chart) {\n chart.renderer = new SvgRenderer(chart.element.id);\n calculateSize(chart);\n chart.svgObject = chart.renderer.createSvg({\n id: chart.element.id + '_svg',\n width: chart.availableSize.width,\n height: chart.availableSize.height\n });\n}\n/**\n * To calculate chart title and height\n * @param title\n * @param style\n * @param width\n */\nexport function getTitle(title, style, width) {\n var titleCollection = [];\n switch (style.textOverflow) {\n case 'Wrap':\n titleCollection = textWrap(title, width, style);\n break;\n case 'Trim':\n titleCollection.push(textTrim(width, title, style));\n break;\n default:\n titleCollection.push(title);\n break;\n }\n return titleCollection;\n}\n/**\n * Method to calculate x position of title\n */\nexport function titlePositionX(chartSize, leftPadding, rightPadding, titleStyle) {\n var positionX;\n if (titleStyle.textAlignment === 'Near') {\n positionX = leftPadding;\n }\n else if (titleStyle.textAlignment === 'Center') {\n positionX = chartSize.width / 2;\n }\n else {\n positionX = chartSize.width - rightPadding;\n }\n return positionX;\n}\n/**\n * Method to find new text and element size based on textOverflow\n */\nexport function textWrap(currentLabel, maximumWidth, font) {\n var textCollection = currentLabel.split(' ');\n var label = '';\n var labelCollection = [];\n var text;\n for (var i = 0, len = textCollection.length; i < len; i++) {\n text = textCollection[i];\n if (measureText(label.concat(text), font).width < maximumWidth) {\n label = label.concat((label === '' ? '' : ' ') + text);\n }\n else {\n if (label !== '') {\n labelCollection.push(textTrim(maximumWidth, label, font));\n label = text;\n }\n else {\n labelCollection.push(textTrim(maximumWidth, text, font));\n text = '';\n }\n }\n if (label && i === len - 1) {\n labelCollection.push(textTrim(maximumWidth, label, font));\n }\n }\n return labelCollection;\n}\n/** @private */\nvar CustomizeOption = /** @class */ (function () {\n function CustomizeOption(id) {\n this.id = id;\n }\n return CustomizeOption;\n}());\nexport { CustomizeOption };\n/** @private */\nvar StackValues = /** @class */ (function () {\n function StackValues(startValue, endValue) {\n this.startValues = startValue;\n this.endValues = endValue;\n }\n return StackValues;\n}());\nexport { StackValues };\n/** @private */\nvar TextOption = /** @class */ (function (_super) {\n __extends(TextOption, _super);\n function TextOption(id, x, y, anchor, text, transform, baseLine) {\n if (transform === void 0) { transform = ''; }\n var _this = _super.call(this, id) || this;\n _this.transform = '';\n _this.baseLine = 'auto';\n _this.x = x;\n _this.y = y;\n _this.anchor = anchor;\n _this.text = text;\n _this.transform = transform;\n _this.baseLine = baseLine;\n return _this;\n }\n return TextOption;\n}(CustomizeOption));\nexport { TextOption };\n/** @private */\nvar PathOption = /** @class */ (function (_super) {\n __extends(PathOption, _super);\n function PathOption(id, fill, width, color, opacity, dashArray, d) {\n var _this = _super.call(this, id) || this;\n _this.opacity = opacity;\n _this.fill = fill;\n _this.stroke = color;\n _this['stroke-width'] = width;\n _this['stroke-dasharray'] = dashArray;\n _this.d = d;\n return _this;\n }\n return PathOption;\n}(CustomizeOption));\nexport { PathOption };\n/** @private */\nvar RectOption = /** @class */ (function (_super) {\n __extends(RectOption, _super);\n function RectOption(id, fill, border, opacity, rect, rx, ry, transform, dashArray) {\n var _this = _super.call(this, id, fill, border.width, border.color, opacity, dashArray) || this;\n _this.y = rect.y;\n _this.x = rect.x;\n _this.height = rect.height;\n _this.width = rect.width;\n _this.rx = rx ? rx : 0;\n _this.ry = ry ? ry : 0;\n _this.transform = transform ? transform : '';\n return _this;\n }\n return RectOption;\n}(PathOption));\nexport { RectOption };\n/** @private */\nvar CircleOption = /** @class */ (function (_super) {\n __extends(CircleOption, _super);\n function CircleOption(id, fill, border, opacity, cx, cy, r) {\n var _this = _super.call(this, id, fill, border.width, border.color, opacity) || this;\n _this.cy = cy;\n _this.cx = cx;\n _this.r = r;\n return _this;\n }\n return CircleOption;\n}(PathOption));\nexport { CircleOption };\n/** @private */\nvar PolygonOption = /** @class */ (function () {\n function PolygonOption(id, points, fill) {\n this.id = id;\n this.points = points;\n this.fill = fill;\n }\n return PolygonOption;\n}());\nexport { PolygonOption };\n/** @private */\nvar Size = /** @class */ (function () {\n function Size(width, height) {\n this.width = width;\n this.height = height;\n }\n return Size;\n}());\nexport { Size };\n/** @private */\nvar Rect = /** @class */ (function () {\n function Rect(x, y, width, height) {\n this.x = x;\n this.y = y;\n this.width = width;\n this.height = height;\n }\n return Rect;\n}());\nexport { Rect };\n/** @private */\nvar ChartLocation = /** @class */ (function () {\n function ChartLocation(x, y) {\n this.x = x;\n this.y = y;\n }\n return ChartLocation;\n}());\nexport { ChartLocation };\n/** @private */\nvar Thickness = /** @class */ (function () {\n function Thickness(left, right, top, bottom) {\n this.left = left;\n this.right = right;\n this.top = top;\n this.bottom = bottom;\n }\n return Thickness;\n}());\nexport { Thickness };\n/** @private */\nvar ColorValue = /** @class */ (function () {\n function ColorValue(r, g, b) {\n this.r = r;\n this.g = g;\n this.b = b;\n }\n return ColorValue;\n}());\nexport { ColorValue };\n/** @private */\nvar PointData = /** @class */ (function () {\n function PointData(point, series, index) {\n if (index === void 0) { index = 0; }\n this.point = point;\n this.series = series;\n this.lierIndex = index;\n }\n return PointData;\n}());\nexport { PointData };\n/** @private */\nvar AccPointData = /** @class */ (function () {\n function AccPointData(point, series, index) {\n if (index === void 0) { index = 0; }\n this.point = point;\n this.series = series;\n }\n return AccPointData;\n}());\nexport { AccPointData };\n/** @private */\nvar ControlPoints = /** @class */ (function () {\n function ControlPoints(controlPoint1, controlPoint2) {\n this.controlPoint1 = controlPoint1;\n this.controlPoint2 = controlPoint2;\n }\n return ControlPoints;\n}());\nexport { ControlPoints };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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/**\n * AccumulationChart base file\n */\nimport { Property, ChildProperty, Complex, createElement } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, getValue } from '@syncfusion/ej2-base';\nimport { Border, Font, Animation, EmptyPointSettings, Connector } from '../../common/model/base';\nimport { Rect, stringToNumber, PathOption } from '../../common/utils/helper';\nimport { seriesRender, pointRender } from '../../common/model/constants';\nimport { getSeriesColor } from '../../common/model/theme';\nimport { getElement, firstToLowerCase } from '../../common/utils/helper';\n/**\n * Annotation for accumulation series\n */\nvar AccumulationAnnotationSettings = /** @class */ (function (_super) {\n __extends(AccumulationAnnotationSettings, _super);\n function AccumulationAnnotationSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(null)\n ], AccumulationAnnotationSettings.prototype, \"content\", void 0);\n __decorate([\n Property('0')\n ], AccumulationAnnotationSettings.prototype, \"x\", void 0);\n __decorate([\n Property('0')\n ], AccumulationAnnotationSettings.prototype, \"y\", void 0);\n __decorate([\n Property('Pixel')\n ], AccumulationAnnotationSettings.prototype, \"coordinateUnits\", void 0);\n __decorate([\n Property('Chart')\n ], AccumulationAnnotationSettings.prototype, \"region\", void 0);\n __decorate([\n Property('Middle')\n ], AccumulationAnnotationSettings.prototype, \"verticalAlignment\", void 0);\n __decorate([\n Property('Center')\n ], AccumulationAnnotationSettings.prototype, \"horizontalAlignment\", void 0);\n __decorate([\n Property(null)\n ], AccumulationAnnotationSettings.prototype, \"description\", void 0);\n return AccumulationAnnotationSettings;\n}(ChildProperty));\nexport { AccumulationAnnotationSettings };\n/**\n * Configures the dataLabel in accumulation chart.\n */\nvar AccumulationDataLabelSettings = /** @class */ (function (_super) {\n __extends(AccumulationDataLabelSettings, _super);\n function AccumulationDataLabelSettings() {\n return _super !== null && _super.apply(this, arguments) || this;\n }\n __decorate([\n Property(false)\n ], AccumulationDataLabelSettings.prototype, \"visible\", void 0);\n __decorate([\n Property(null)\n ], AccumulationDataLabelSettings.prototype, \"name\", void 0);\n __decorate([\n Property('transparent')\n ], AccumulationDataLabelSettings.prototype, \"fill\", void 0);\n __decorate([\n Property('Inside')\n ], AccumulationDataLabelSettings.prototype, \"position\", void 0);\n __decorate([\n Property(5)\n ], AccumulationDataLabelSettings.prototype, \"rx\", void 0);\n __decorate([\n Property(5)\n ], AccumulationDataLabelSettings.prototype, \"ry\", void 0);\n __decorate([\n Complex({ width: null, color: null }, Border)\n ], AccumulationDataLabelSettings.prototype, \"border\", void 0);\n __decorate([\n Complex({ size: '11px', color: null }, Font)\n ], AccumulationDataLabelSettings.prototype, \"font\", void 0);\n __decorate([\n Complex({}, Connector)\n ], AccumulationDataLabelSettings.prototype, \"connectorStyle\", void 0);\n __decorate([\n Property(null)\n ], AccumulationDataLabelSettings.prototype, \"template\", void 0);\n return AccumulationDataLabelSettings;\n}(ChildProperty));\nexport { AccumulationDataLabelSettings };\n/**\n * Points model for the series.\n */\nvar AccPoints = /** @class */ (function () {\n function AccPoints() {\n this.visible = true;\n this.symbolLocation = null;\n /** @private */\n this.region = null;\n /** @private */\n this.labelRegion = null;\n /** @private */\n this.labelVisible = true;\n this.regions = null;\n }\n return AccPoints;\n}());\nexport { AccPoints };\n/**\n * Configures the series in accumulation chart.\n */\nvar AccumulationSeries = /** @class */ (function (_super) {\n __extends(AccumulationSeries, _super);\n function AccumulationSeries() {\n /**\n * Specifies the dataSource for the series. It can be an array of JSON objects or an instance of DataManager.\n * ```html\n * \n * ```\n * ```typescript\n * let dataManager: DataManager = new DataManager({\n * url: 'http://mvc.syncfusion.com/Services/Northwnd.svc/Tasks/'\n * });\n * let query: Query = new Query().take(50).where('Estimate', 'greaterThan', 0, false);\n * let pie: AccumulationChart = new AccumulationChart({\n * ...\n * series: [{\n * dataSource: dataManager,\n * xName: 'Id',\n * yName: 'Estimate',\n * query: query\n * }],\n * ...\n * });\n * pie.appendTo('#Pie');\n * ```\n * @default ''\n */\n var _this = _super !== null && _super.apply(this, arguments) || this;\n /** @private */\n _this.points = [];\n /** @private */\n _this.sumOfPoints = 0;\n /** @private */\n _this.isRectSeries = true;\n /** @private */\n _this.clipRect = new Rect(0, 0, 0, 0);\n return _this;\n }\n /** @private To refresh the Datamanager for series */\n AccumulationSeries.prototype.refreshDataManager = function (accumulation) {\n var _this = this;\n if (isNullOrUndefined(this.query)) {\n this.dataManagerSuccess({ result: this.dataSource, count: this.dataSource.length }, accumulation);\n return;\n }\n var dataManager = this.dataModule.getData(this.dataModule.generateQuery().requiresCount());\n dataManager.then(function (e) { return _this.dataManagerSuccess(e, accumulation); });\n };\n /**\n * To get points on dataManager is success\n * @private\n */\n AccumulationSeries.prototype.dataManagerSuccess = function (e, accumulation) {\n var argsData = {\n name: seriesRender, series: this, data: e.result,\n };\n accumulation.trigger(seriesRender, argsData);\n this.resultData = e.result;\n this.getPoints(e.result, accumulation);\n if (++accumulation.seriesCounts === accumulation.visibleSeries.length) {\n accumulation.refreshChart();\n }\n };\n /** @private To find points from result data */\n AccumulationSeries.prototype.getPoints = function (result, accumulation) {\n var length = Object.keys(result).length;\n this.sumOfPoints = 0;\n if (length === 0) {\n return null;\n }\n this.findSumOfPoints(result);\n this.points = [];\n this.sumOfClub = 0;\n var point;\n var colors = this.palettes.length ? this.palettes : getSeriesColor(accumulation.theme);\n var clubValue = stringToNumber(this.groupTo, this.sumOfPoints);\n for (var i = 0; i < length; i++) {\n point = this.setPoints(result, i, colors);\n var currentY = point.y;\n if (!this.isClub(point, clubValue)) {\n if (isNullOrUndefined(point.y)) {\n point.visible = false;\n }\n this.pushPoints(point, colors);\n }\n }\n this.lastGroupTo = this.groupTo;\n if (this.sumOfClub > 0) {\n var clubPoint = new AccPoints();\n clubPoint.x = 'Others';\n clubPoint.y = this.sumOfClub;\n clubPoint.text = clubPoint.originalText = clubPoint.x + ': ' + this.sumOfClub;\n this.pushPoints(clubPoint, colors);\n }\n };\n /**\n * Method to set point index and color\n */\n AccumulationSeries.prototype.pushPoints = function (point, colors) {\n point.index = this.points.length;\n point.color = point.color || colors[point.index % colors.length];\n this.points.push(point);\n };\n /**\n * Method to find club point\n */\n AccumulationSeries.prototype.isClub = function (point, clubValue) {\n if (Math.abs(point.y) <= clubValue && !isNullOrUndefined(clubValue)) {\n this.sumOfClub += Math.abs(point.y);\n return true;\n }\n return false;\n };\n /**\n * Method to find sum of points in the series\n */\n AccumulationSeries.prototype.findSumOfPoints = function (result) {\n var length = Object.keys(result).length;\n for (var i = 0; i < length; i++) {\n if (!isNullOrUndefined(result[i][this.yName])) {\n this.sumOfPoints += Math.abs(result[i][this.yName]);\n }\n }\n };\n /**\n * Method to set points x, y and text from data source\n */\n AccumulationSeries.prototype.setPoints = function (data, i, colors) {\n var point = new AccPoints();\n point.x = getValue(this.xName, data[i]);\n point.y = getValue(this.yName, data[i]);\n point.color = getValue(this.pointColorMapping, data[i]);\n point.text = point.originalText = getValue(this.dataLabel.name || '', data[i]);\n this.setAccEmptyPoint(point, i, data, colors);\n return point;\n };\n /**\n * Method render the series elements for accumulation chart\n * @private\n */\n AccumulationSeries.prototype.renderSeries = function (accumulation) {\n var seriesGroup = accumulation.renderer.createGroup({ id: accumulation.element.id + '_Series_' + this.index });\n this.renderPoints(accumulation, seriesGroup);\n var datalabelGroup;\n if (accumulation.accumulationDataLabelModule && this.dataLabel.visible) {\n datalabelGroup = accumulation.renderer.createGroup({ id: accumulation.element.id + '_datalabel_Series_' + this.index });\n datalabelGroup.style.visibility =\n (this.animation.enable && accumulation.animateSeries && this.type === 'Pie') ? 'hidden' : 'visible';\n this.renderDataLabel(accumulation, datalabelGroup);\n }\n if (this.type === 'Pie') {\n this.findMaxBounds(this.labelBound, this.accumulationBound);\n accumulation.pieSeriesModule.animateSeries(accumulation, this.animation, this, seriesGroup);\n }\n if (accumulation.accumulationLegendModule) {\n this.labelBound.x -= accumulation.explodeDistance;\n this.labelBound.y -= accumulation.explodeDistance;\n this.labelBound.height += (accumulation.explodeDistance - this.labelBound.y);\n this.labelBound.width += (accumulation.explodeDistance - this.labelBound.x);\n }\n };\n /**\n * Method render the points elements for accumulation chart series.\n */\n AccumulationSeries.prototype.renderPoints = function (accumulation, seriesGroup) {\n var pointId = accumulation.element.id + '_Series_' + this.index + '_Point_';\n var option;\n for (var _i = 0, _a = this.points; _i < _a.length; _i++) {\n var point = _a[_i];\n var argsData = {\n cancel: false, name: pointRender, series: this, point: point, fill: point.color,\n border: this.isEmpty(point) ? { width: this.emptyPointSettings.border.width, color: this.emptyPointSettings.border.color } :\n { width: this.border.width, color: this.border.color }\n };\n accumulation.trigger(pointRender, argsData);\n point.color = argsData.fill;\n if (point.visible) {\n option = new PathOption(pointId + point.index, point.color, argsData.border.width || 1, argsData.border.color || point.color, 1, '', '');\n accumulation[(firstToLowerCase(this.type) + 'SeriesModule')].\n renderPoint(point, this, accumulation, option);\n seriesGroup.appendChild(accumulation.renderer.drawPath(option));\n }\n }\n accumulation.getSeriesElement().appendChild(seriesGroup);\n };\n /**\n * Method render the datalabel elements for accumulation chart.\n */\n AccumulationSeries.prototype.renderDataLabel = function (accumulation, datalabelGroup) {\n accumulation.accumulationDataLabelModule.findAreaRect();\n var element = createElement('div', {\n id: accumulation.element.id + '_Series_0' + '_DataLabelCollections'\n });\n for (var _i = 0, _a = this.points; _i < _a.length; _i++) {\n var point = _a[_i];\n if (point.visible) {\n accumulation.accumulationDataLabelModule.renderDataLabel(point, this.dataLabel, datalabelGroup, this.points, this.index, element);\n }\n }\n if (this.dataLabel.template !== null && element.childElementCount) {\n getElement(accumulation.element.id + '_Secondary_Element').appendChild(element);\n }\n accumulation.getSeriesElement().appendChild(datalabelGroup);\n };\n /**\n * To find maximum bounds for smart legend placing\n * @private\n */\n AccumulationSeries.prototype.findMaxBounds = function (totalbound, bound) {\n totalbound.x = bound.x < totalbound.x ? bound.x : totalbound.x;\n totalbound.y = bound.y < totalbound.y ? bound.y : totalbound.y;\n totalbound.height = (bound.y + bound.height) > totalbound.height ? (bound.y + bound.height) : totalbound.height;\n totalbound.width = (bound.x + bound.width) > totalbound.width ? (bound.x + bound.width) : totalbound.width;\n };\n /**\n * To set empty point value for null points\n * @private\n */\n AccumulationSeries.prototype.setAccEmptyPoint = function (point, i, data, colors) {\n if (!isNullOrUndefined(point.y)) {\n return null;\n }\n point.color = this.emptyPointSettings.fill || point.color;\n switch (this.emptyPointSettings.mode) {\n case 'Zero':\n point.y = 0;\n point.visible = true;\n break;\n case 'Average':\n var previous = data[i - 1] ? (data[i - 1][this.yName] || 0) : 0;\n var next = data[i + 1] ? (data[i + 1][this.yName] || 0) : 0;\n point.y = (Math.abs(previous) + Math.abs(next)) / 2;\n this.sumOfPoints += point.y;\n point.visible = true;\n break;\n case 'Drop':\n point.visible = false;\n break;\n }\n };\n /**\n * To find point is empty\n */\n AccumulationSeries.prototype.isEmpty = function (point) {\n return point.color === this.emptyPointSettings.fill;\n };\n __decorate([\n Property('')\n ], AccumulationSeries.prototype, \"dataSource\", void 0);\n __decorate([\n Property()\n ], AccumulationSeries.prototype, \"query\", void 0);\n __decorate([\n Property('')\n ], AccumulationSeries.prototype, \"xName\", void 0);\n __decorate([\n Property('')\n ], AccumulationSeries.prototype, \"name\", void 0);\n __decorate([\n Property('')\n ], AccumulationSeries.prototype, \"yName\", void 0);\n __decorate([\n Property(true)\n ], AccumulationSeries.prototype, \"visible\", void 0);\n __decorate([\n Complex({ color: null, width: 0 }, Border)\n ], AccumulationSeries.prototype, \"border\", void 0);\n __decorate([\n Complex(null, Animation)\n ], AccumulationSeries.prototype, \"animation\", void 0);\n __decorate([\n Property('SeriesType')\n ], AccumulationSeries.prototype, \"legendShape\", void 0);\n __decorate([\n Property('')\n ], AccumulationSeries.prototype, \"pointColorMapping\", void 0);\n __decorate([\n Property(null)\n ], AccumulationSeries.prototype, \"selectionStyle\", void 0);\n __decorate([\n Property(null)\n ], AccumulationSeries.prototype, \"groupTo\", void 0);\n __decorate([\n Complex({}, AccumulationDataLabelSettings)\n ], AccumulationSeries.prototype, \"dataLabel\", void 0);\n __decorate([\n Property([])\n ], AccumulationSeries.prototype, \"palettes\", void 0);\n __decorate([\n Property(0)\n ], AccumulationSeries.prototype, \"startAngle\", void 0);\n __decorate([\n Property(360)\n ], AccumulationSeries.prototype, \"endAngle\", void 0);\n __decorate([\n Property('80%')\n ], AccumulationSeries.prototype, \"radius\", void 0);\n __decorate([\n Property('0')\n ], AccumulationSeries.prototype, \"innerRadius\", void 0);\n __decorate([\n Property('Pie')\n ], AccumulationSeries.prototype, \"type\", void 0);\n __decorate([\n Property(true)\n ], AccumulationSeries.prototype, \"enableTooltip\", void 0);\n __decorate([\n Property(false)\n ], AccumulationSeries.prototype, \"explode\", void 0);\n __decorate([\n Property('30%')\n ], AccumulationSeries.prototype, \"explodeOffset\", void 0);\n __decorate([\n Property(false)\n ], AccumulationSeries.prototype, \"explodeAll\", void 0);\n __decorate([\n Property(null)\n ], AccumulationSeries.prototype, \"explodeIndex\", void 0);\n __decorate([\n Complex({ mode: 'Drop' }, EmptyPointSettings)\n ], AccumulationSeries.prototype, \"emptyPointSettings\", void 0);\n __decorate([\n Property(0)\n ], AccumulationSeries.prototype, \"gapRatio\", void 0);\n __decorate([\n Property('80%')\n ], AccumulationSeries.prototype, \"width\", void 0);\n __decorate([\n Property('80%')\n ], AccumulationSeries.prototype, \"height\", void 0);\n __decorate([\n Property('20%')\n ], AccumulationSeries.prototype, \"neckWidth\", void 0);\n __decorate([\n Property('20%')\n ], AccumulationSeries.prototype, \"neckHeight\", void 0);\n __decorate([\n Property('Linear')\n ], AccumulationSeries.prototype, \"pyramidMode\", void 0);\n __decorate([\n Property(1)\n ], AccumulationSeries.prototype, \"opacity\", void 0);\n return AccumulationSeries;\n}(ChildProperty));\nexport { AccumulationSeries };\n/**\n * method to get series from index\n * @private\n */\nexport function getSeriesFromIndex(index, visibleSeries) {\n for (var _i = 0, visibleSeries_1 = visibleSeries; _i < visibleSeries_1.length; _i++) {\n var series = visibleSeries_1[_i];\n if (index === series.index) {\n return series;\n }\n }\n return visibleSeries[0];\n}\n/**\n * method to get point from index\n * @private\n */\nexport function pointByIndex(index, points) {\n for (var _i = 0, points_1 = points; _i < points_1.length; _i++) {\n var point = points_1[_i];\n if (point.index === index) {\n return point;\n }\n }\n return null;\n}\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 * Specifies Circular-Gauge Helper methods\n */\nimport { SvgRenderer, compile as templateComplier } from '@syncfusion/ej2-base';\nimport { merge } from '@syncfusion/ej2-base';\nimport { createElement, remove, setStyleAttribute } from '@syncfusion/ej2-base';\n/**\n * Function to measure the height and width of the text.\n * @param {string} text\n * @param {FontModel} font\n * @param {string} id\n * @returns Size\n * @private\n */\nexport function measureText(text, font) {\n var htmlObject = document.getElementById('gauge-measuretext');\n if (htmlObject === null) {\n htmlObject = createElement('text', { id: 'gauge-measuretext' });\n document.body.appendChild(htmlObject);\n }\n var style = 'position: absolute; visibility: hidden;' +\n ';left: 0; top: -100; white-space: nowrap;' + getFontStyle(font);\n htmlObject.innerHTML = text;\n htmlObject.setAttribute('style', style);\n return new Size(htmlObject.clientWidth, htmlObject.clientHeight);\n}\n/**\n * Function to find number from string\n * * @returns number\n * @private\n */\nexport function toPixel(value, maxDimension) {\n if (value !== null && value !== undefined) {\n return value.indexOf('%') !== -1 ? (maxDimension / 100) * parseInt(value, 10) : parseInt(value, 10);\n }\n return null;\n}\n/**\n * Function to get the style from FontModel.\n * @returns string\n * @private\n */\nexport function getFontStyle(font) {\n var style = '';\n style = 'font-size:' + font.size +\n '; font-style:' + font.fontStyle + '; font-weight:' + font.fontWeight +\n '; font-family:' + font.fontFamily + ';opacity:' + font.opacity +\n '; color:' + font.color + ';';\n return style;\n}\n/**\n * Function to set style to the element.\n * @private\n */\nexport function setStyles(element, fill, border) {\n setStyleAttribute(element, {\n 'stroke': border.color, 'stroke-width': border.width,\n 'fill': fill\n });\n}\n/**\n * Function to measure the element rect.\n * @returns ClientRect\n * @private\n */\nexport function measureElementRect(element) {\n var bounds;\n document.body.appendChild(element);\n bounds = element.getBoundingClientRect();\n removeElement(element.id);\n return bounds;\n}\n/**\n * Function to convert the number from string.\n * @returns number\n * @private\n */\nexport function stringToNumber(value, containerSize) {\n if (value !== null && value !== undefined) {\n return value.indexOf('%') !== -1 ? (containerSize / 100) * parseInt(value, 10) : parseInt(value, 10);\n }\n return null;\n}\n/**\n * Function to create the text element.\n * @returns Element\n * @private\n */\nexport function textElement(options, font, color, parent, styles) {\n var renderOptions = {};\n var htmlObject;\n var renderer = new SvgRenderer('');\n var style = styles + ' font-size:' + font.size + '; font-style:' + font.fontStyle +\n ' ; font-weight:' + font.fontWeight + '; font-family:' + font.fontFamily + ';';\n renderOptions = {\n 'id': options.id,\n 'x': options.x,\n 'y': options.y,\n 'fill': color,\n 'text-anchor': options.anchor,\n 'transform': options.transform,\n 'opacity': font.opacity,\n 'dominant-baseline': options.baseLine,\n 'style': style\n };\n htmlObject = renderer.createText(renderOptions, options.text);\n parent.appendChild(htmlObject);\n return htmlObject;\n}\n/**\n * Function to append the path to the element.\n * @returns Element\n * @private\n */\nexport function appendPath(options, element, gauge, functionName) {\n functionName = functionName ? functionName : 'Path';\n var htmlObject = gauge.renderer['draw' + functionName](options);\n htmlObject.setAttribute('transform', options.transform);\n htmlObject.setAttribute('style', options.style);\n element.appendChild(htmlObject);\n return htmlObject;\n}\n/**\n * Function to calculate the sum of array values.\n * @returns number\n * @private\n */\nexport function calculateSum(from, to, values) {\n var sum = 0;\n var length = values.length;\n for (; from < length; from++) {\n sum += values[from];\n }\n return sum;\n}\n/**\n * Function to calculate the value for linear animation effect\n * @param currentTime\n * @param startValue\n * @param endValue\n * @param duration\n * @private\n */\nexport function linear(currentTime, startValue, endValue, duration) {\n return -endValue * Math.cos(currentTime / duration * (Math.PI / 2)) + endValue + startValue;\n}\n/**\n * Function to get the angle from value for circular gauge.\n * @returns number\n * @private\n */\nexport function getAngleFromValue(value, maximumValue, minimumValue, startAngle, endAngle, isClockWise) {\n var angle;\n endAngle -= isCompleteAngle(startAngle, endAngle) ? 0.0001 : 0;\n startAngle -= 90;\n endAngle -= 90;\n if (isClockWise) {\n angle = ((value - minimumValue) * (getDegree(startAngle, endAngle) / (maximumValue - minimumValue))) + startAngle;\n }\n else {\n angle = endAngle - ((value - minimumValue) * (getDegree(startAngle, endAngle) / (maximumValue - minimumValue)));\n angle = angle < 0 ? 360 + angle : angle;\n }\n angle = Math.round(angle) >= 360 ? (angle - 360) : Math.round(angle) < 0 ? (360 + angle) : angle;\n return angle;\n}\n/**\n * Function to get the degree for circular gauge.\n * @returns number\n * @private\n */\nexport function getDegree(startAngle, endAngle) {\n var degree = endAngle - startAngle;\n return degree < 0 ? (degree + 360) : degree;\n}\n/**\n * Function to get the value from angle for circular gauge.\n * @returns number\n * @private\n */\nexport function getValueFromAngle(angle, maximumValue, minimumValue, startAngle, endAngle, isClockWise) {\n endAngle -= isCompleteAngle(startAngle, endAngle) ? 0.0001 : 0;\n angle = angle < startAngle ? (angle + 360) : angle;\n if (isClockWise) {\n return (((angle - startAngle) / getDegree(startAngle, endAngle)) * (maximumValue - minimumValue)) + minimumValue;\n }\n else {\n return maximumValue - ((((angle - startAngle) / getDegree(startAngle, endAngle)) * (maximumValue - minimumValue)) + minimumValue);\n }\n}\n/**\n * Function to check whether it's a complete circle for circular gauge.\n * @returns boolean\n * @private\n */\nexport function isCompleteAngle(startAngle, endAngle) {\n var totalAngle = endAngle - startAngle;\n totalAngle = totalAngle <= 0 ? (totalAngle + 360) : totalAngle;\n return Math.floor(totalAngle / 360) !== 0;\n}\n/**\n * Function to get angle from location for circular gauge.\n * @returns number\n * @private\n */\nexport function getAngleFromLocation(center, point) {\n var angle = Math.atan2((point.y - center.y), (point.x - center.x));\n angle = Math.round((angle < 0 ? (6.283 + angle) : angle) * (180 / Math.PI)) - 270;\n angle += angle < 0 ? 360 : 0;\n return angle;\n}\n/**\n * Function to get the location from angle for circular gauge.\n * @returns GaugeLocation\n * @private\n */\nexport function getLocationFromAngle(degree, radius, center) {\n var radian = (degree * Math.PI) / 180;\n return new GaugeLocation(Math.cos(radian) * radius + center.x, Math.sin(radian) * radius + center.y);\n}\n/**\n * Function to get the path direction of the circular gauge.\n * @returns string\n * @private\n */\nexport function getPathArc(center, start, end, radius, startWidth, endWidth) {\n end -= isCompleteAngle(start, end) ? 0.0001 : 0;\n var degree = getDegree(start, end);\n var startRadius = radius - startWidth;\n var endRadius = radius - endWidth;\n var arcRadius = radius - ((startWidth + endWidth) / 2);\n if (startWidth !== undefined && endWidth !== undefined) {\n return getRangePath(getLocationFromAngle(start, radius, center), getLocationFromAngle(end, radius, center), getLocationFromAngle(start, startRadius, center), getLocationFromAngle(end, endRadius, center), radius, arcRadius, arcRadius, (degree < 180) ? 0 : 1);\n }\n else {\n return getCirclePath(getLocationFromAngle(start, radius, center), getLocationFromAngle(end, radius, center), radius, (degree < 180) ? 0 : 1);\n }\n}\n/**\n * Function to get the range path direction of the circular gauge.\n * @returns string\n * @private\n */\nexport function getRangePath(start, end, innerStart, innerEnd, radius, startRadius, endRadius, clockWise) {\n return 'M ' + start.x + ' ' + start.y +\n ' A ' + radius + ' ' + radius + ' 0 ' +\n clockWise + ' 1 ' + end.x + ' ' + end.y +\n ' L ' + innerEnd.x + ' ' + innerEnd.y +\n ' A ' + endRadius + ' ' + startRadius + ' 0 ' +\n clockWise + ' 0 ' + innerStart.x + ' ' + innerStart.y + ' Z';\n}\n/**\n * Function to calculate the complete path arc of the circular gauge.\n * @returns string\n * @private\n */\nexport function getCompleteArc(center, start, end, radius, innerRadius) {\n end -= isCompleteAngle(start, end) ? 0.0001 : 0;\n var degree = getDegree(start, end);\n return getCompletePath(center, getLocationFromAngle(start, radius, center), getLocationFromAngle(end, radius, center), radius, getLocationFromAngle(start, innerRadius, center), getLocationFromAngle(end, innerRadius, center), innerRadius, (degree < 180) ? 0 : 1);\n}\n/**\n * Function to get the circular path direction of the circular gauge.\n * @returns string\n * @private\n */\nexport function getCirclePath(start, end, radius, clockWise) {\n return 'M ' + start.x + ' ' + start.y + ' A ' + radius + ' ' +\n radius + ' 0 ' + clockWise + ' 1 ' + end.x + ' ' + end.y;\n}\n/**\n * Function to get the complete path direction of the circular gauge.\n * @returns string\n * @private\n */\nexport function getCompletePath(center, start, end, radius, innerStart, innerEnd, innerRadius, clockWise) {\n return 'M ' + start.x + ' ' + start.y + ' A ' + radius + ' ' + radius + ' 0 ' + clockWise +\n ' 1 ' + end.x + ' ' + end.y + ' L ' + innerEnd.x + ' ' + innerEnd.y + ' A ' + innerRadius +\n ' ' + innerRadius + ' 0 ' + clockWise + ',0 ' + innerStart.x + ' ' + innerStart.y + ' Z';\n}\n/**\n * Function to get element from id.\n * @returns Element\n * @private\n */\nexport function getElement(id) {\n return document.getElementById(id);\n}\n/**\n * Function to compile the template function for circular gauge.\n * @returns Function\n * @private\n */\nexport function getTemplateFunction(template) {\n var templateFn = null;\n var e;\n try {\n if (document.querySelectorAll(template).length) {\n templateFn = templateComplier(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (e) {\n templateFn = templateComplier(template);\n }\n return templateFn;\n}\n/**\n * Function to remove the element from id.\n * @private\n */\nexport function removeElement(id) {\n var element = getElement(id);\n if (element) {\n remove(element);\n }\n}\n/**\n * Function to get current point for circular gauge using element id.\n * @returns IVisiblePointer\n * @private\n */\nexport function getPointer(targetId, gauge) {\n var tempString;\n tempString = targetId.split(gauge.element.id + '_Axis_')[1];\n return {\n axisIndex: +tempString[0],\n pointerIndex: +tempString[tempString.length - 1]\n };\n}\n/**\n * Function to convert the label using formar for cirular gauge.\n * @returns string\n * @private\n */\nexport function getLabelFormat(format) {\n var customLabelFormat = format && format.match('{value}') !== null;\n var skeleton = customLabelFormat ? '' : format;\n return skeleton;\n}\n/**\n * Function to calculate the marker shape for circular gauge.\n * @returns PathOption\n * @private\n */\nexport function calculateShapes(location, shape, size, url, options) {\n var path;\n var width = size.width;\n var height = size.height;\n var locX = location.x;\n var locY = location.y;\n var x = location.x + (-width / 2);\n var y = location.y + (-height / 2);\n switch (shape) {\n case 'Circle':\n merge(options, { 'rx': width / 2, 'ry': height / 2, 'cx': locX, 'cy': locY });\n break;\n case 'Diamond':\n path = 'M' + ' ' + x + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + locY + ' Z';\n merge(options, { 'd': path });\n break;\n case 'Rectangle':\n path = 'M' + ' ' + x + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (-height / 2)) + ' Z';\n merge(options, { 'd': path });\n break;\n case 'Triangle':\n path = 'M' + ' ' + locX + ' ' + locY + ' ' +\n 'L' + ' ' + (locX - height) + ' ' + (locY - (width / 2)) +\n 'L' + ' ' + (locX - height) + ' ' + (locY + (width / 2)) + ' Z';\n merge(options, { 'd': path });\n break;\n case 'InvertedTriangle':\n path = 'M' + ' ' + locX + ' ' + locY + ' ' +\n 'L' + ' ' + (locX + height) + ' ' + (locY - (width / 2)) +\n 'L' + ' ' + (locX + height) + ' ' + (locY + (width / 2)) + ' Z';\n merge(options, { 'd': path });\n break;\n case 'Image':\n merge(options, { 'href': url, 'height': height, 'width': width, x: x, y: y });\n break;\n }\n return options;\n}\n/**\n * Function to get range color from value for circular gauge.\n * @returns string\n * @private\n */\nexport function getRangeColor(value, ranges, color) {\n var min = 0;\n var max = 0;\n var currentRange = ranges.filter(function (range) {\n min = Math.min(range.start, range.end);\n max = Math.max(range.start, range.end);\n return (value >= min && max >= value);\n });\n return currentRange.length ? currentRange[0].rangeColor : color;\n}\n/** @private */\nvar CustomizeOption = /** @class */ (function () {\n function CustomizeOption(id) {\n this.id = id;\n }\n return CustomizeOption;\n}());\nexport { CustomizeOption };\n/** @private */\nvar PathOption = /** @class */ (function (_super) {\n __extends(PathOption, _super);\n function PathOption(id, fill, width, color, opacity, dashArray, d, transform, style) {\n if (transform === void 0) { transform = ''; }\n if (style === void 0) { style = ''; }\n var _this = _super.call(this, id) || this;\n _this.opacity = opacity;\n _this.fill = fill;\n _this.stroke = color;\n _this['stroke-width'] = width;\n _this['stroke-dasharray'] = dashArray;\n _this.d = d;\n _this.transform = transform;\n _this.style = style;\n return _this;\n }\n return PathOption;\n}(CustomizeOption));\nexport { PathOption };\n/** @private */\nvar RectOption = /** @class */ (function (_super) {\n __extends(RectOption, _super);\n function RectOption(id, fill, border, opacity, rect) {\n var _this = _super.call(this, id) || this;\n _this.y = rect.y;\n _this.x = rect.x;\n _this.height = rect.height;\n _this.width = rect.width;\n _this.opacity = opacity;\n _this.fill = fill;\n _this.stroke = border.color;\n _this['stroke-width'] = border.width;\n return _this;\n }\n return RectOption;\n}(CustomizeOption));\nexport { RectOption };\n/**\n * Internal class size\n */\nvar Size = /** @class */ (function () {\n function Size(width, height) {\n this.width = width;\n this.height = height;\n }\n return Size;\n}());\nexport { Size };\n/** @private */\nvar GaugeLocation = /** @class */ (function () {\n function GaugeLocation(x, y) {\n this.x = x;\n this.y = y;\n }\n return GaugeLocation;\n}());\nexport { GaugeLocation };\n/** @private */\nvar Rect = /** @class */ (function () {\n function Rect(x, y, width, height) {\n this.x = x;\n this.y = y;\n this.width = width;\n this.height = height;\n }\n return Rect;\n}());\nexport { Rect };\n/** @private */\nvar TextOption = /** @class */ (function (_super) {\n __extends(TextOption, _super);\n function TextOption(id, x, y, anchor, text, transform, baseLine) {\n if (transform === void 0) { transform = ''; }\n var _this = _super.call(this, id) || this;\n _this.transform = '';\n _this.baseLine = 'auto';\n _this.x = x;\n _this.y = y;\n _this.anchor = anchor;\n _this.text = text;\n _this.transform = transform;\n _this.baseLine = baseLine;\n return _this;\n }\n return TextOption;\n}(CustomizeOption));\nexport { TextOption };\n/** @private */\nvar VisibleLabels = /** @class */ (function () {\n function VisibleLabels(text, value, size) {\n this.text = text;\n this.value = value;\n this.size = size;\n }\n return VisibleLabels;\n}());\nexport { VisibleLabels };\n","/**\n * IncrementalSearch module file\n */\nvar queryString = '';\nvar prevString = '';\nvar matches = [];\nvar activeClass = 'e-active';\n/**\n * Search and focus the list item based on key code matches with list text content\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 */\nexport function incrementalSearch(keyCode, items, selectedIndex, ignoreCase) {\n queryString += String.fromCharCode(keyCode);\n setTimeout(function () { queryString = ''; }, 1000);\n var index;\n queryString = ignoreCase ? queryString.toLowerCase() : queryString;\n if (prevString === queryString) {\n for (var i = 0; i < matches.length; i++) {\n if (matches[i].classList.contains(activeClass)) {\n index = i;\n break;\n }\n }\n index = index + 1;\n return matches[index];\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 i === -1 ? index = 0 : index = i;\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 return matches[0];\n }\n}\nexport function Search(inputVal, items, searchType, ignoreCase) {\n var listItems = items;\n ignoreCase = ignoreCase !== undefined && ignoreCase !== null ? ignoreCase : true;\n var itemData = { item: null, index: null };\n if (inputVal.length) {\n var strLength = inputVal.length;\n var queryStr = ignoreCase ? inputVal.toLocaleLowerCase() : inputVal;\n for (var i = 0, itemsData = listItems; i < itemsData.length; i++) {\n var item = itemsData[i];\n var text = (ignoreCase ? item.textContent.toLocaleLowerCase() : item.textContent).replace(/^\\s+|\\s+$/g, '');\n if ((searchType === 'Equal' && text === queryStr) || (searchType === 'StartsWith' && text.substr(0, strLength) === queryStr)) {\n itemData.item = item;\n itemData.index = i;\n return { item: item, index: i };\n }\n }\n return itemData;\n }\n return itemData;\n}\n","/**\n * Function helps to find which highlightSearch is to call based on your data.\n * @param {HTMLElement} content - Specifies an content 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 */\nexport function highlightSearch(content, query, ignoreCase, type) {\n revert(content);\n if (query === '') {\n return;\n }\n else {\n var ignoreRegex = ignoreCase ? 'gim' : 'gm';\n query = /^[a-zA-Z0-9- ]*$/.test(query) ? query : query.replace(/[\\-\\[\\]\\/\\{\\}\\(\\)\\*\\+\\?\\.\\\\\\^\\$\\|]/g, '\\\\$&');\n var replaceQuery = type === 'StartsWith' ? '^(' + query + ')' : type === 'EndsWith' ? '(' + query + ')$' : '(' + query + ')';\n var pattern = new RegExp(replaceQuery, ignoreRegex);\n var li = content.querySelectorAll('ul li');\n for (var i = 0; i < li.length; i++) {\n var element = li[i];\n element.innerHTML = element.innerHTML.replace(pattern, '$1');\n }\n }\n}\n/**\n * Function helps to remove highlighted element based on your data.\n * @param {HTMLElement} id - Specifies an id of list data.\n */\nfunction revert(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","/**\n * FloatLable Moduel\n * Specifies whether to display the floating label above the input element.\n */\nimport { removeClass, addClass, detach } from '@syncfusion/ej2-base';\nimport { attributes, isNullOrUndefined, createElement } from '@syncfusion/ej2-base';\nvar FLOATLINE = 'e-float-line';\nvar FLOATTEXT = 'e-float-text';\nvar LABELTOP = 'e-label-top';\nvar LABELBOTTOM = 'e-label-bottom';\n/**\n * Function to create Float Label element.\n * @param overAllWrapper - overall wrapper of multiselect.\n * @param element - the given html element.\n * @param inputElement - specify the input wrapper.\n * @param value - Value of the MultiSelect.\n * @param floatLabelType - Specify the FloatLabel Type.\n * @param placeholder - Specify the PlaceHolder text.\n */\nexport function createFloatLabel(overAllWrapper, searchWrapper, element, inputElement, value, floatLabelType, placeholder) {\n var floatLinelement;\n var floatLabelElement;\n floatLinelement = createElement('span', { className: FLOATLINE });\n floatLabelElement = createElement('label', { className: FLOATTEXT });\n if (!isNullOrUndefined(element.id) && element.id !== '') {\n floatLabelElement.id = 'label_' + element.id.replace(/ /g, '_');\n attributes(element, { 'aria-labelledby': floatLabelElement.id });\n }\n if (!isNullOrUndefined(inputElement.placeholder) && inputElement.placeholder !== '') {\n floatLabelElement.innerHTML = inputElement.placeholder;\n inputElement.removeAttribute('placeholder');\n }\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n floatLabelElement.innerHTML = placeholder;\n }\n searchWrapper.appendChild(floatLinelement);\n searchWrapper.appendChild(floatLabelElement);\n overAllWrapper.classList.add('e-float-input');\n updateFloatLabelState(value, floatLabelElement);\n if (floatLabelType === 'Always') {\n if (floatLabelElement.classList.contains(LABELBOTTOM)) {\n removeClass([floatLabelElement], LABELBOTTOM);\n }\n addClass([floatLabelElement], LABELTOP);\n }\n}\n/**\n * Function to update status of the Float Label element.\n * @param value - Value of the MultiSelect.\n * @param label - float label element.\n */\nexport function updateFloatLabelState(value, label) {\n if (value && value.length > 0) {\n addClass([label], LABELTOP);\n removeClass([label], LABELBOTTOM);\n }\n else {\n removeClass([label], LABELTOP);\n addClass([label], LABELBOTTOM);\n }\n}\n/**\n * Function to remove Float Label element.\n * @param overAllWrapper - overall wrapper of multiselect.\n * @param componentWrapper - wrapper element of multiselect.\n * @param searchWrapper - search wrapper of multiselect.\n * @param inputElement - specify the input wrapper.\n * @param value - Value of the MultiSelect.\n * @param floatLabelType - Specify the FloatLabel Type.\n * @param placeholder - Specify the PlaceHolder text.\n */\nexport function removeFloating(overAllWrapper, componentWrapper, searchWrapper, inputElement, value, floatLabelType, placeholder) {\n var placeholderElement = componentWrapper.querySelector('.' + FLOATTEXT);\n var floatLine = componentWrapper.querySelector('.' + FLOATLINE);\n var placeholderText;\n if (!isNullOrUndefined(placeholderElement)) {\n placeholderText = placeholderElement.innerText;\n detach(searchWrapper.querySelector('.' + FLOATTEXT));\n setPlaceHolder(value, inputElement, placeholderText);\n if (!isNullOrUndefined(floatLine)) {\n detach(searchWrapper.querySelector('.' + FLOATLINE));\n }\n }\n else {\n placeholderText = (placeholder !== null) ? placeholder : '';\n setPlaceHolder(value, inputElement, placeholderText);\n }\n overAllWrapper.classList.remove('e-float-input');\n}\n/**\n * Function to set the placeholder to the element.\n * @param value - Value of the MultiSelect.\n * @param inputElement - specify the input wrapper.\n * @param placeholder - Specify the PlaceHolder text.\n */\nexport function setPlaceHolder(value, inputElement, placeholder) {\n if (value && value.length) {\n inputElement.placeholder = '';\n }\n else {\n inputElement.placeholder = placeholder;\n }\n}\n/**\n * Function for focusing the Float Element.\n * @param overAllWrapper - overall wrapper of multiselect.\n * @param componentWrapper - wrapper element of multiselect.\n */\nexport function floatLabelFocus(overAllWrapper, componentWrapper) {\n overAllWrapper.classList.add('e-input-focus');\n var label = componentWrapper.querySelector('.' + FLOATTEXT);\n if (!isNullOrUndefined(label)) {\n addClass([label], LABELTOP);\n if (label.classList.contains(LABELBOTTOM)) {\n removeClass([label], LABELBOTTOM);\n }\n }\n}\n/**\n * Function to focus the Float Label element.\n * @param overAllWrapper - overall wrapper of multiselect.\n * @param componentWrapper - wrapper element of multiselect.\n * @param value - Value of the MultiSelect.\n * @param floatLabelType - Specify the FloatLabel Type.\n * @param placeholder - Specify the PlaceHolder text.\n */\nexport function floatLabelBlur(overAllWrapper, componentWrapper, value, floatLabelType, placeholder) {\n overAllWrapper.classList.remove('e-input-focus');\n var label = componentWrapper.querySelector('.' + FLOATTEXT);\n if (value && value.length <= 0 && floatLabelType === 'Auto' && !isNullOrUndefined(label)) {\n if (label.classList.contains(LABELTOP)) {\n removeClass([label], LABELTOP);\n }\n addClass([label], LABELBOTTOM);\n }\n}\n","import { ChildProperty, compile as baseTemplateComplier, setValue } 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 { DataUtil, Query, DataManager, Predicate } from '@syncfusion/ej2-data';\nimport { Column } from '../models/column';\nimport { calculateRelativeBasedPosition, calculatePosition } from '@syncfusion/ej2-popups';\n//https://typescript.codeplex.com/discussions/401501\n/**\n * Function to check whether target object implement specific interface\n * @param {Object} target\n * @param {string} checkFor\n * @returns no\n * @hidden\n */\nexport function doesImplementInterface(target, checkFor) {\n /* tslint:disable:no-any */\n return target.prototype && checkFor in target.prototype;\n}\n/**\n * Function to get value from provided data\n * @param {string} field\n * @param {Object} data\n * @param {IColumn} column\n * @hidden\n */\nexport function valueAccessor(field, data, column) {\n field = isNullOrUndefined(field) ? '' : field;\n return getValue(field, data);\n}\n/**\n * The function used to update Dom using requestAnimationFrame.\n * @param {Function} fn - Function that contains the actual action\n * @return {Promise}\n * @hidden\n */\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 */\nexport function iterateArrayOrObject(collection, predicate) {\n var result = [];\n for (var i = 0, len = collection.length; i < len; i++) {\n var pred = predicate(collection[i], i);\n if (!isNullOrUndefined(pred)) {\n result.push(pred);\n }\n }\n return result;\n}\n/** @hidden */\nexport function templateCompiler(template) {\n if (template) {\n var e = void 0;\n try {\n if (document.querySelectorAll(template).length) {\n return baseTemplateComplier(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (e) {\n return baseTemplateComplier(template);\n }\n }\n return undefined;\n}\n/** @hidden */\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/** @hidden */\nexport function extend(copied, first, second, exclude) {\n var moved = baseExtend(copied, first, second);\n Object.keys(moved).forEach(function (value, index) {\n if (exclude.indexOf(value) !== -1) {\n delete moved[value];\n }\n });\n return moved;\n}\n/** @hidden */\nexport function prepareColumns(columns, autoWidth) {\n for (var c = 0, len = columns.length; c < len; c++) {\n var column = void 0;\n if (typeof columns[c] === 'string') {\n column = new Column({ field: columns[c] });\n }\n else if (!(columns[c] instanceof Column)) {\n if (!columns[c].columns) {\n column = new Column(columns[c]);\n }\n else {\n column = new Column(columns[c]);\n columns[c].columns = prepareColumns(columns[c].columns);\n }\n }\n else {\n column = columns[c];\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[c] = column;\n }\n return columns;\n}\n/** @hidden */\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 var isBottomTail;\n popUpSpan.className = className;\n popUp.style.display = '';\n 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/** @hidden */\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/** @hidden */\nexport function getActualProperties(obj) {\n if (obj instanceof ChildProperty) {\n return getValue('properties', obj);\n }\n else {\n return obj;\n }\n}\n/** @hidden */\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/** @hidden */\nexport function getElementIndex(element, elements) {\n var index = -1;\n for (var i = 0, len = elements.length; i < len; i++) {\n if (elements[i].isEqualNode(element)) {\n index = i;\n break;\n }\n }\n return index;\n}\n/** @hidden */\nexport function inArray(value, collection) {\n for (var i = 0, len = collection.length; i < len; i++) {\n if (collection[i] === value) {\n return i;\n }\n }\n return -1;\n}\n/** @hidden */\nexport function getActualPropFromColl(collection) {\n var coll = [];\n for (var i = 0, len = collection.length; i < len; i++) {\n if (collection[i].hasOwnProperty('properties')) {\n coll.push(collection[i].properties);\n }\n else {\n coll.push(collection[i]);\n }\n }\n return coll;\n}\n/** @hidden */\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[i]);\n }\n}\n/** @hidden */\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/** @hidden */\nexport function getUid(prefix) {\n return prefix + uid++;\n}\n/** @hidden */\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[i]);\n }\n else {\n elem.appendChild(children[0]);\n }\n }\n return elem;\n}\n/** @hidden */\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/** @hidden */\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 DataUtil.aggregates[type.toLowerCase()](data, column.field);\n}\n/** @hidden */\nvar scrollWidth = null;\n/** @hidden */\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/** @hidden */\nexport function getRowHeight(element) {\n if (rowHeight !== undefined) {\n return rowHeight;\n }\n var table = createElement('table', { className: 'e-table', styles: 'visibility: hidden' });\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 */\nexport function isEditable(col, type, elem) {\n var row = parentsUntil(elem, 'e-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 && col.isPrimaryKey) {\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/** @hidden */\nexport function isActionPrevent(inst) {\n var dlg = inst.element.querySelector('#' + inst.element.id + 'EditConfirm');\n return inst.editSettings.mode === 'Batch' &&\n (inst.element.querySelectorAll('.e-updatedtd').length) && inst.editSettings.showConfirmDialog &&\n (dlg ? dlg.classList.contains('e-popup-close') : true);\n}\n/** @hidden */\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 action ? elem[i].classList.add(clName) : elem[i].classList.remove(clName);\n }\n}\nexport function changeButtonType(target) {\n var elements = [].slice.call(target.querySelectorAll('button'));\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var button = elements_1[_i];\n attributes(button, { type: 'button' });\n }\n}\n/** @hidden */\nexport function setFormatter(serviceLocator, column) {\n var fmtr = serviceLocator.getService('valueFormatter');\n switch (column.type) {\n case 'date':\n column.setFormatter(fmtr.getFormatFunction({ type: 'date', skeleton: column.format }));\n column.setParser(fmtr.getParserFunction({ type: 'date', skeleton: column.format }));\n break;\n case 'datetime':\n column.setFormatter(fmtr.getFormatFunction({ type: 'dateTime', skeleton: column.format }));\n column.setParser(fmtr.getParserFunction({ type: 'dateTime', skeleton: column.format }));\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/** @hidden */\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[i], args.slice(), []);\n cells[i].setAttribute('aria-selected', 'true');\n }\n else {\n classList(cells[i], [], args.slice());\n cells[i].removeAttribute('aria-selected');\n }\n }\n}\n/** @hidden */\nexport function distinctStringValues(result) {\n var temp = {};\n var res = [];\n for (var i = 0; i < result.length; i++) {\n if (!(result[i] in temp)) {\n res.push(result[i].toString());\n temp[result[i]] = 1;\n }\n }\n return res;\n}\n/** @hidden */\nexport function getFilterMenuPostion(target, dialogObj, grid) {\n var elementVisible = dialogObj.element.style.display;\n dialogObj.element.style.display = 'block';\n var dlgWidth = dialogObj.width;\n var newpos;\n if (!grid.enableRtl) {\n 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 else {\n newpos = calculatePosition(target, 'left', 'bottom');\n dialogObj.element.style.top = (newpos.top + target.getBoundingClientRect().height) - 35 + 'px';\n dialogObj.element.style.display = elementVisible;\n var leftPos = ((newpos.left - dlgWidth) + target.clientWidth);\n if (leftPos < 1) {\n dialogObj.element.style.left = (dlgWidth + leftPos) + -16 + 'px';\n }\n else {\n dialogObj.element.style.left = leftPos - 16 + 'px';\n }\n }\n}\n/** @hidden */\nexport function getZIndexCalcualtion(args, dialogObj) {\n args.popup.element.style.zIndex = (dialogObj.zIndex + 1).toString();\n}\n/** @hidden */\nexport function toogleCheckbox(elem) {\n var span = elem.querySelector('.e-frame');\n span.classList.contains('e-check') ? classList(span, ['e-uncheck'], ['e-check']) :\n classList(span, ['e-check'], ['e-uncheck']);\n}\n/** @hidden */\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/** @hidden */\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 * @param row - Grid Row model object.\n * @param columns - Foreign columns array.\n * @param data - Updated Row data.\n * @hidden\n */\nexport function refreshForeignData(row, columns, data) {\n columns.forEach(function (col) {\n setValue(col.field, getForeignData(col, data), row.foreignKeyData);\n });\n row.cells.forEach(function (cell) {\n if (cell.isForeignKey) {\n setValue('foreignKeyData', getValue(cell.column.field, row.foreignKeyData), cell);\n }\n });\n}\n/**\n * Get the foreign data for the corresponding cell value.\n * @param column - Foreign Key column\n * @param data - Row data.\n * @param lValue - cell value.\n * @param foreignData - foreign data source.\n * @hidden\n */\nexport function getForeignData(column, data, lValue, foreignKeyData) {\n var fField = column.foreignKeyField;\n var key = (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.offline ?\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 * @param foreignKeyValue - Defines ForeignKeyValue.\n * @param columns - Array of column object.\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 * @hidden\n * @param filterObject - Defines predicate model object\n */\nexport function getDatePredicate(filterObject) {\n var datePredicate;\n var prevDate;\n var nextDate;\n var prevObj = baseExtend({}, getActualProperties(filterObject));\n var nextObj = baseExtend({}, getActualProperties(filterObject));\n var value = new Date(filterObject.value);\n if (filterObject.operator === 'equal' || filterObject.operator === 'notequal') {\n prevDate = new Date(value.setHours(0) - 1);\n nextDate = new Date(value.setHours(24));\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 (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 if (filterObject.setProperties) {\n filterObject.setProperties({ ejpredicate: datePredicate }, true);\n }\n else {\n filterObject.ejpredicate = datePredicate;\n }\n return datePredicate;\n}\n/**\n * @hidden\n */\nexport function renderMovable(ele, frzCols) {\n var mEle = ele.cloneNode(true);\n for (var i = 0; i < frzCols; i++) {\n mEle.removeChild(mEle.children[0]);\n }\n for (var i = frzCols, len = ele.childElementCount; i < len; i++) {\n ele.removeChild(ele.children[ele.childElementCount - 1]);\n }\n return mEle;\n}\n","/**\n * AriaService\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 props.forEach(function (name) { return setStateAndProperties(target, config[name], options[name]); });\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 * @hidden\n */\nfunction setStateAndProperties(target, attribute, value, remove) {\n if (remove) {\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 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};\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 { SvgRenderer, compile as templateComplier, remove, merge, createElement } from '@syncfusion/ej2-base';\n/**\n * Specifies Linear-Gauge Helper methods\n */\n/** @private */\nexport function stringToNumber(value, containerSize) {\n if (value !== null && value !== undefined) {\n return value.indexOf('%') !== -1 ? (containerSize / 100) * parseInt(value, 10) : parseInt(value, 10);\n }\n return null;\n}\n/**\n * Function to measure the height and width of the text.\n * @param {string} text\n * @param {FontModel} font\n * @param {string} id\n * @returns no\n * @private\n */\nexport function measureText(text, font) {\n var htmlObject = document.getElementById('gauge-measuretext');\n var size;\n if (htmlObject === null) {\n htmlObject = createElement('text', { id: 'gauge-measuretext' });\n document.body.appendChild(htmlObject);\n }\n htmlObject.innerHTML = text;\n htmlObject.style.position = 'absolute';\n htmlObject.style.fontSize = font.size;\n htmlObject.style.fontWeight = font.fontWeight;\n htmlObject.style.fontStyle = font.fontStyle;\n htmlObject.style.fontFamily = font.fontFamily;\n htmlObject.style.visibility = 'hidden';\n htmlObject.style.top = '-100';\n htmlObject.style.left = '0';\n htmlObject.style.whiteSpace = 'nowrap';\n size = new Size(htmlObject.clientWidth, htmlObject.clientHeight);\n //remove(htmlObject);\n return size;\n}\n/** @private */\nexport function withInRange(value, start, end, max, min, type) {\n var withIn;\n if (type === 'pointer') {\n withIn = (((value <= max) && (value >= min)));\n }\n else {\n withIn = (start != null && (start <= max) && (start >= min)) && (end != null && (end <= max) && (end >= min));\n }\n return withIn;\n}\nexport function convertPixelToValue(parentElement, pointerElement, orientation, axis, type, location) {\n var elementRect = parentElement.getBoundingClientRect();\n var pointerRect = pointerElement.getBoundingClientRect();\n var height = (pointerElement.id.indexOf('MarkerPointer') > -1) ? (pointerRect.height / 2) :\n (!axis.isInversed) ? 0 : pointerRect.height;\n var width = (pointerElement.id.indexOf('MarkerPointer') > -1) ? (pointerRect.width / 2) :\n (!axis.isInversed) ? pointerRect.width : 0;\n var size = new Size(axis.lineBounds.width, axis.lineBounds.height);\n var y = (type === 'drag') ? (location.y - axis.lineBounds.y) :\n ((pointerRect.top + height) - elementRect.top - axis.lineBounds.y);\n var x = (type === 'drag') ? (location.x - axis.lineBounds.x) :\n ((pointerRect.left + width) - elementRect.left - axis.lineBounds.x);\n var newSize = (orientation === 'Vertical') ? size.height : size.width;\n var divideVal = (orientation === 'Vertical') ? y : x;\n var value = (orientation === 'Vertical') ? (axis.isInversed) ? (divideVal / newSize) :\n (1 - (divideVal / newSize)) : (axis.isInversed) ? (1 - (divideVal / newSize)) : (divideVal / newSize);\n value = value * (axis.visibleRange.delta) + axis.visibleRange.min;\n return value;\n}\nexport function getPathToRect(path, size, parentElement) {\n var tempDiv = document.getElementById('gauge_path');\n if (tempDiv === null) {\n tempDiv = createElement('text', { id: 'gauge_path' });\n tempDiv.style.position = 'absolute';\n tempDiv.style.top = '0px';\n tempDiv.style.left = '0px';\n parentElement.appendChild(tempDiv);\n }\n var render = new SvgRenderer('id');\n var svg = render.createSvg({ id: 'box_path', width: size.width, height: size.height });\n svg.appendChild(path);\n tempDiv.appendChild(svg);\n var svgRect = path.getBBox();\n remove(tempDiv);\n return svgRect;\n}\n/** @private */\nexport function getElement(id) {\n return document.getElementById(id);\n}\n/** @private */\nexport function removeElement(id) {\n var element = getElement(id);\n if (element) {\n remove(element);\n }\n}\n/** @private */\nexport function isPointerDrag(axes) {\n var pointerEnable = false;\n axes.map(function (axis, index) {\n axis.pointers.map(function (pointer, index) {\n if (pointer.enableDrag) {\n pointerEnable = true;\n }\n });\n });\n return pointerEnable;\n}\n/** @private */\nexport function valueToCoefficient(value, axis, orientation, range) {\n var result = (value - range.min) / range.delta;\n result = (orientation === 'Vertical') ? (!axis.isInversed) ? (1 - result) : result : (!axis.isInversed) ? result : (1 - result);\n return result;\n}\nexport function getFontStyle(font) {\n var style = '';\n style = 'font-size:' + font.size +\n '; font-style:' + font.fontStyle + '; font-weight:' + font.fontWeight +\n '; font-family:' + font.fontFamily + ';opacity:' + font.opacity +\n '; color:' + font.color + ';';\n return style;\n}\n/** @private */\nexport function getLabelFormat(format) {\n var customLabelFormat = format && format.match('{value}') !== null;\n var skeleton = customLabelFormat ? '' : format;\n return skeleton;\n}\n/** @private */\nexport function getTemplateFunction(template) {\n var templateFn = null;\n var e;\n try {\n if (document.querySelectorAll(template).length) {\n templateFn = templateComplier(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (e) {\n templateFn = templateComplier(template);\n }\n return templateFn;\n}\n/** @private */\nexport function getElementOffset(childElement, parentElement) {\n var width;\n var height;\n parentElement.appendChild(childElement);\n width = childElement.offsetWidth;\n height = childElement.offsetHeight;\n parentElement.removeChild(childElement);\n return new Size(width, height);\n}\n/** @private */\nvar VisibleRange = /** @class */ (function () {\n function VisibleRange(min, max, interval, delta) {\n this.min = min;\n this.max = max;\n this.interval = interval;\n this.delta = delta;\n }\n return VisibleRange;\n}());\nexport { VisibleRange };\n/** @private */\nvar GaugeLocation = /** @class */ (function () {\n function GaugeLocation(x, y) {\n this.x = x;\n this.y = y;\n }\n return GaugeLocation;\n}());\nexport { GaugeLocation };\n/**\n * Internal class size for height and width\n */\nvar Size = /** @class */ (function () {\n function Size(width, height) {\n this.width = width;\n this.height = height;\n }\n return Size;\n}());\nexport { Size };\n/** @private */\nvar Rect = /** @class */ (function () {\n function Rect(x, y, width, height) {\n this.x = x;\n this.y = y;\n this.width = width;\n this.height = height;\n }\n return Rect;\n}());\nexport { Rect };\n/** @private */\nvar CustomizeOption = /** @class */ (function () {\n function CustomizeOption(id) {\n this.id = id;\n }\n return CustomizeOption;\n}());\nexport { CustomizeOption };\n/** @private */\nvar PathOption = /** @class */ (function (_super) {\n __extends(PathOption, _super);\n function PathOption(id, fill, width, color, opacity, dashArray, d, transform) {\n if (transform === void 0) { transform = ''; }\n var _this = _super.call(this, id) || this;\n _this.opacity = opacity;\n _this.fill = fill;\n _this.stroke = color;\n _this['stroke-width'] = width;\n _this['stroke-dasharray'] = dashArray;\n _this.d = d;\n _this.transform = transform;\n return _this;\n }\n return PathOption;\n}(CustomizeOption));\nexport { PathOption };\n/** @private */\nvar RectOption = /** @class */ (function () {\n function RectOption(id, fill, border, opacity, rect, transform, dashArray) {\n this.opacity = opacity;\n this.id = id;\n this.y = rect.y;\n this.x = rect.x;\n this.fill = fill;\n this.stroke = border.color;\n this['stroke-width'] = border.width;\n this.height = rect.height;\n this.width = rect.width;\n }\n return RectOption;\n}());\nexport { RectOption };\n/** @private */\nvar TextOption = /** @class */ (function (_super) {\n __extends(TextOption, _super);\n function TextOption(id, x, y, anchor, text, transform, baseLine) {\n if (transform === void 0) { transform = ''; }\n var _this = _super.call(this, id) || this;\n _this.transform = '';\n _this.baseLine = 'auto';\n _this.x = x;\n _this.y = y;\n _this.anchor = anchor;\n _this.text = text;\n _this.transform = transform;\n _this.baseLine = baseLine;\n return _this;\n }\n return TextOption;\n}(CustomizeOption));\nexport { TextOption };\n/** @private */\nvar VisibleLabels = /** @class */ (function () {\n function VisibleLabels(text, value, size) {\n this.text = text;\n this.value = value;\n this.size = size;\n }\n return VisibleLabels;\n}());\nexport { VisibleLabels };\n/** @private */\nvar Align = /** @class */ (function () {\n function Align(axisIndex, align) {\n this.align = align;\n this.axisIndex = axisIndex;\n }\n return Align;\n}());\nexport { Align };\n/** @private */\nexport function textElement(options, font, color, parent) {\n var renderOptions = {};\n var htmlObject;\n var renderer = new SvgRenderer('');\n var style = 'fill:' + color + '; font-size:' + font.size +\n '; font-style:' + font.fontStyle + ' ; font-weight:' + font.fontWeight + '; font-family:' +\n font.fontFamily + '; text-anchor:' + options.anchor + '; transform:' + options.transform +\n '; opacity:' + font.opacity + '; dominant-baseline:' + options.baseLine + ';';\n renderOptions = {\n 'id': options.id,\n 'x': options.x,\n 'y': options.y,\n 'style': style\n };\n htmlObject = renderer.createText(renderOptions, options.text);\n parent.appendChild(htmlObject);\n return htmlObject;\n}\nexport function calculateNiceInterval(min, max, size, orientation) {\n var delta = max - min;\n var currentInterval;\n var intervalDivs = [10, 5, 2, 1];\n var desiredIntervalsCount = getActualDesiredIntervalsCount(size, orientation);\n var niceInterval = delta / desiredIntervalsCount;\n var minInterval = Math.pow(10, Math.floor(Math.log(niceInterval) / Math.log(10)));\n for (var _i = 0, intervalDivs_1 = intervalDivs; _i < intervalDivs_1.length; _i++) {\n var interval = intervalDivs_1[_i];\n currentInterval = minInterval * interval;\n if (desiredIntervalsCount < (delta / currentInterval)) {\n break;\n }\n niceInterval = currentInterval;\n }\n return niceInterval;\n}\nexport function getActualDesiredIntervalsCount(size, orientation) {\n var maximumLabels = 5;\n var desiredIntervalsCount = (orientation === 'Horizontal' ? 0.533 : 1) * maximumLabels;\n desiredIntervalsCount = Math.max((size * (desiredIntervalsCount / 100)), 1);\n return desiredIntervalsCount;\n}\n/** @private */\nexport function getPointer(target, gauge) {\n var split = [];\n var axisIndex;\n var radix = 10;\n var pointIndex;\n var axis;\n var pointer;\n split = target.id.split('_');\n axisIndex = parseInt(split[2], radix);\n pointIndex = parseInt(split[4], radix);\n axis = gauge.axes[axisIndex];\n pointer = gauge.axes[axisIndex].pointers[pointIndex];\n return { axis: axis, axisIndex: axisIndex, pointer: pointer, pointerIndex: pointIndex };\n}\n/** @private */\nexport function getRangeColor(value, ranges) {\n var rangeColor = null;\n ranges.forEach(function (range, index) {\n if (value >= range.start && range.end >= value) {\n rangeColor = range.interior;\n }\n });\n return rangeColor;\n}\n/** @private */\nexport function getRangePalette() {\n var palette = ['#ff5985', '#ffb133', '#fcde0b', '#27d5ff', '#50c917'];\n return palette;\n}\n/** @private */\nexport function calculateShapes(location, shape, size, url, options, orientation, axis, pointer) {\n var path;\n var width = size.width;\n var height = size.height;\n var locX = location.x;\n var locY = location.y;\n var radius;\n switch (shape) {\n case 'Circle':\n radius = ((width + height) / 4);\n locX = (orientation === 'Vertical') ? (!axis.opposedPosition) ? (pointer.placement !== 'Far') ? locX - radius : locX + radius :\n pointer.placement === 'Near' ? locX - radius : locX + radius : locX;\n locY = (orientation === 'Vertical') ? locY : (!axis.opposedPosition) ? (pointer.placement === 'Far') ?\n locY + radius : locY - radius : (pointer.placement === 'Near') ? locY - radius : locY + radius;\n merge(options, { 'r': radius, 'cx': locX, 'cy': locY });\n break;\n case 'Diamond':\n case 'Rectangle':\n locX = (orientation === 'Horizontal') ? ((locX - (width / 2))) : ((!axis.opposedPosition && pointer.placement !== 'Far') ||\n (axis.opposedPosition && pointer.placement === 'Near')) ? locX - width : locX;\n locY = (orientation === 'Vertical') ? locY : (!axis.opposedPosition) ?\n (pointer.placement === 'Far') ? locY + (height / 2) : locY - (height / 2) :\n (pointer.placement === 'Near') ? locY - (height / 2) : locY + (height / 2);\n if (shape === 'Diamond') {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + width) + ' ' + locY + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + locY + ' z';\n }\n else {\n path = 'M' + ' ' + locX + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + width) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + width) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY - (height / 2)) + ' z';\n }\n merge(options, { 'd': path });\n break;\n case 'Triangle':\n if (orientation === 'Vertical') {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' +\n 'L' + (locX - width) + ' ' + (locY - (height / 2)) +\n 'L' + (locX - width) + ' ' + (locY + (height / 2)) + ' Z';\n }\n else {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' +\n 'L' + (locX + (width / 2)) + ' ' + (locY - height) +\n 'L' + (locX - (width / 2)) + ' ' + (locY - height) + ' Z';\n }\n merge(options, { 'd': path });\n break;\n case 'InvertedTriangle':\n if (orientation === 'Vertical') {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' +\n 'L' + (locX + width) + ' ' + (locY - (height / 2)) +\n 'L' + (locX + width) + ' ' + (locY + (height / 2)) + ' Z';\n }\n else {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' +\n 'L' + (locX + (width / 2)) + ' ' + (locY + height) +\n 'L' + (locX - (width / 2)) + ' ' + (locY + height) + ' Z';\n }\n merge(options, { 'd': path });\n break;\n case 'Arrow':\n if (orientation === 'Vertical') {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' + 'L' + (locX - (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + (locX - (width / 2)) + ' ' + ((locY - (height / 2)) + (height / 4)) + ' ' + 'L' + (locX - width) + ' '\n + ((locY - (height / 2)) + (height / 4)) + ' ' + 'L' + (locX - width) + ' ' + ((locY + (height / 2)) -\n (height / 4)) + ' ' + 'L' + (locX - (width / 2)) + ' ' + ((locY + (height / 2)) - (height / 4)) + ' ' +\n 'L' + (locX - (width / 2)) + ' ' + (locY + height / 2) + 'z';\n }\n else {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' + 'L' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ((locX + (width / 2)) - (width / 4)) + ' ' + (locY - (height / 2)) + ' ' + 'L' + ((locX + (width / 2)) -\n (width / 4)) + ' ' + (locY - height) + ' ' + 'L' + ((locX - (width / 2)) + (width / 4)) + ' ' + (locY - height) +\n ' ' + 'L' + ((locX - (width / 2)) + (width / 4)) + ' ' + (locY - (height / 2)) + ' ' + 'L' + (locX - (width / 2))\n + ' ' + (locY - (height / 2)) + 'z';\n }\n merge(options, { 'd': path });\n break;\n case 'InvertedArrow':\n if (orientation === 'Vertical') {\n path = 'M' + ' ' + locX + ' ' + locY + 'L' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + (locX + (width / 2)) + ' ' + ((locY - (height / 2)) + (height / 4)) + ' ' + 'L' + (locX + width) + ' '\n + ((locY - (height / 2)) + (height / 4)) + ' ' + 'L' + (locX + width) + ' ' + ((locY + (height / 2)) - (height / 4))\n + ' ' + 'L' + (locX + (width / 2)) + ' ' + ((locY + (height / 2)) - (height / 4)) + ' ' +\n 'L' + (locX + (width / 2)) + ' ' + (locY + height / 2) + 'z';\n }\n else {\n path = 'M' + ' ' + locX + ' ' + locY + ' ' + 'L' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ((locX + (width / 2)) - (width / 4)) + ' ' + (locY + (height / 2)) + ' ' + 'L' + ((locX + (width / 2)) -\n (width / 4)) + ' ' + (locY + height) + ' ' + 'L' + ((locX - (width / 2)) + (width / 4)) + ' ' + (locY + height)\n + ' ' + 'L' + ((locX - (width / 2)) + (width / 4)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + (locX - (width / 2)) + ' ' + (locY + (height / 2)) + 'z';\n }\n merge(options, { 'd': path });\n break;\n case 'Image':\n merge(options, { 'href': url, 'height': height, 'width': width, x: locX - (width / 2), y: locY - (height / 2) });\n break;\n }\n return options;\n}\n/** @private */\nexport function getBox(location, boxName, orientation, size, type, containerWidth, axis, cornerRadius) {\n var path = ' ';\n var radius = cornerRadius;\n var x1;\n var y1;\n var rectWidth;\n var rectHeight;\n var bottomRadius;\n var topRadius;\n switch (boxName) {\n case 'RoundedRectangle':\n x1 = location.x;\n y1 = location.y;\n rectWidth = location.width;\n rectHeight = location.height;\n path = 'M' + ' ' + x1 + ' ' + (radius + y1) + ' Q ' + x1 + ' ' + y1 + ' ' + (x1 + radius) + ' ' + y1 + ' ';\n path += 'L' + ' ' + (x1 + rectWidth - radius) + ' ' + y1 + ' Q ' + (x1 + rectWidth) + ' ' + y1 + ' '\n + (x1 + rectWidth) + ' ' + (y1 + radius) + ' ';\n path += 'L ' + (x1 + rectWidth) + ' ' + (y1 + rectHeight - radius) + ' Q ' + (x1 + rectWidth) + ' ' + (y1 + rectHeight)\n + ' ' + (x1 + rectWidth - radius) + ' ' + (y1 + rectHeight) + ' ';\n path += ' L ' + (x1 + radius) + ' ' + (y1 + rectHeight) + ' Q ' + x1 + ' ' + (y1 + rectHeight)\n + ' ' + x1 + ' ' + (y1 + rectHeight - radius) + ' ';\n path += 'L' + ' ' + x1 + ' ' + (radius + y1) + ' ' + 'z';\n break;\n case 'Thermometer':\n var width = (orientation === 'Vertical') ? location.width : location.height;\n bottomRadius = width + ((width / 2) / Math.PI);\n topRadius = width / 2;\n if (orientation === 'Vertical') {\n var addValue = ((containerWidth + ((containerWidth / 2) / Math.PI)) - bottomRadius);\n var y1_1 = (type === 'bar') ? location.y + addValue : location.y;\n var locY = (type === 'bar') ? location.y + (topRadius - (topRadius / Math.PI)) : location.y;\n var locHeight = location.height;\n path = 'M' + location.x + ' ' + (y1_1 + locHeight) +\n ' A ' + bottomRadius + ' ' + bottomRadius + ', 0, 1, 0, ' + (location.x + location.width) + ' ' + (y1_1 + locHeight) +\n ' L ' + (location.x + location.width) + ' ' + locY +\n ' A ' + topRadius + ' ' + topRadius + ', 0, 1, 0, ' + location.x + ' ' + locY + ' z ';\n }\n else {\n var x1_1 = (type === 'bar' && !axis.isInversed) ?\n location.x - ((containerWidth + ((containerWidth / 2) / Math.PI)) - bottomRadius) : location.x;\n var locWidth = (type === 'bar') ? (location.width - (topRadius - ((topRadius / Math.PI)))) : location.width;\n path = 'M' + x1_1 + ' ' + (location.y) +\n ' A ' + bottomRadius + ' ' + bottomRadius + ', 0, 1, 0, ' + x1_1 + ' ' + (location.y + location.height) +\n ' L ' + ((type === 'bar' ? location.x : x1_1) + locWidth) + ' ' + (location.y + location.height) +\n ' A ' + topRadius + ' ' + topRadius + ', 0, 1, 0, ' +\n ((type === 'bar' ? location.x : x1_1) + locWidth) + ' ' + (location.y) + ' z ';\n }\n break;\n }\n return path;\n}\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 * Helper functions for maps control\n */\nimport { SvgRenderer, createElement, isNullOrUndefined, remove, compile as templateComplier, merge } from '@syncfusion/ej2-base';\nimport { Animation } from '@syncfusion/ej2-base';\nimport { animationComplete } from '../index';\n/**\n * Maps internal use of `Size` type\n * @private\n */\nvar Size = /** @class */ (function () {\n function Size(width, height) {\n this.width = width;\n this.height = height;\n }\n return Size;\n}());\nexport { Size };\n/**\n * To find number from string\n * @private\n */\nexport function stringToNumber(value, containerSize) {\n if (value !== null && value !== undefined) {\n return value.indexOf('%') !== -1 ? (containerSize / 100) * parseInt(value, 10) : parseInt(value, 10);\n }\n return null;\n}\n/**\n * Method to calculate the width and height of the maps\n */\nexport function calculateSize(maps) {\n var containerWidth = maps.element.clientWidth;\n var containerHeight = maps.element.clientHeight;\n maps.availableSize = new Size(stringToNumber(maps.width, containerWidth) || containerWidth || 600, stringToNumber(maps.height, containerHeight) || containerHeight || (maps.isDevice ?\n Math.min(window.innerWidth, window.innerHeight) : 450));\n}\n/**\n * Method to create svg for maps.\n */\nexport function createSvg(maps) {\n maps.renderer = new SvgRenderer(maps.element.id);\n calculateSize(maps);\n maps.svgObject = maps.renderer.createSvg({\n id: maps.element.id + '_svg',\n width: maps.availableSize.width,\n height: maps.availableSize.height\n });\n}\n/**\n * Method to convert degrees to radians\n */\nexport function degreesToRadians(deg) {\n return deg * (Math.PI / 180);\n}\n/**\n * Convert radians to degrees method\n */\nexport function radiansToDegrees(radian) {\n return radian * (180 / Math.PI);\n}\n/**\n * Method for converting from latitude and longitude values to points\n */\nexport function convertGeoToPoint(latitude, longitude, factor, layer, mapModel) {\n var mapSize = new Size(mapModel.mapAreaRect.width, mapModel.mapAreaRect.height);\n var x;\n var y;\n var value;\n var lat;\n var lng;\n var temp;\n var longitudeMinMax = mapModel.baseMapBounds.longitude;\n var latitudeMinMax = mapModel.baseMapBounds.latitude;\n var latRadian = degreesToRadians(latitude);\n var lngRadian = degreesToRadians(longitude);\n var type = mapModel.projectionType;\n var size = (mapModel.isTileMap) ? Math.pow(2, 1) * 256 : (isNullOrUndefined(factor)) ? Math.min(mapSize.width, mapSize.height) :\n (Math.min(mapSize.width, mapSize.height) * factor);\n if (layer.geometryType === 'Normal') {\n x = isNullOrUndefined(factor) ? longitude : Math.abs((longitude - longitudeMinMax.min) * factor);\n y = isNullOrUndefined(factor) ? latitude : Math.abs((latitudeMinMax.max - latitude) * factor);\n }\n else if (layer.geometryType === 'Geographic') {\n switch (type) {\n case 'Mercator':\n var pixelOrigin = new Point(size / 2, size / 2);\n x = pixelOrigin.x + longitude * (size / 360);\n var sinY = calculateBound(Math.sin(degreesToRadians(latitude)), -0.9999, 0.9999);\n y = pixelOrigin.y + 0.5 * (Math.log((1 + sinY) / (1 - sinY))) * (-(size / (2 * Math.PI)));\n break;\n case 'Winkel3':\n value = aitoff(lngRadian, latRadian);\n lng = (value.x + lngRadian / (Math.PI / 2)) / 2;\n lat = (value.y + latRadian) / 2;\n break;\n case 'Miller':\n lng = lngRadian;\n lat = (1.25 * Math.log(Math.tan((Math.PI / 4) + (.4 * latRadian))));\n break;\n case 'Eckert3':\n temp = Math.sqrt(Math.PI * (4 + Math.PI));\n lng = 2 / temp * lngRadian * (1 + Math.sqrt(1 - 4 * latRadian * latRadian / (Math.PI * Math.PI)));\n lat = 4 / temp * latRadian;\n break;\n case 'AitOff':\n value = aitoff(lngRadian, latRadian);\n lng = value.x;\n lat = value.y;\n break;\n case 'Eckert5':\n lng = lngRadian * (1 + Math.cos(latRadian)) / Math.sqrt(2 + Math.PI);\n lat = 2 * latRadian / Math.sqrt(2 + Math.PI);\n break;\n case 'Equirectangular':\n lng = lngRadian;\n lat = latRadian;\n break;\n case 'Eckert6':\n var epsilon = 1e-6;\n temp = (1 + (Math.PI / 2)) * Math.sin(latRadian);\n var delta = Infinity;\n for (var i = 0; i < 10 && Math.abs(delta) > epsilon; i++) {\n delta = (latRadian + (Math.sin(latRadian)) - temp) / (1 + Math.cos(latRadian));\n latRadian = latRadian - delta;\n }\n temp = Math.sqrt(2 + Math.PI);\n lng = lngRadian * (1 + Math.cos(latRadian)) / temp;\n lat = 2 * latRadian / temp;\n break;\n }\n x = (type === 'Mercator') ? x : roundTo(xToCoordinate(mapModel, radiansToDegrees(lng)), 3);\n y = (type === 'Mercator') ? y : (-(roundTo(yToCoordinate(mapModel, radiansToDegrees(lat)), 3)));\n }\n return new Point(x, y);\n}\n/**\n * Converting tile latitude and longitude to point\n */\nexport function convertTileLatLongToPoint(center, zoomLevel, tileTranslatePoint, isMapCoordinates) {\n var size = Math.pow(2, zoomLevel) * 256;\n var x = (center.x + 180) / 360;\n var sinLatitude = Math.sin(center.y * Math.PI / 180);\n var y = 0.5 - Math.log((1 + sinLatitude) / (1 - sinLatitude)) / (4 * Math.PI);\n var pixelX = center.x;\n var pixelY = center.y;\n if (isMapCoordinates) {\n pixelX = (x * size + 0.5) + tileTranslatePoint.x;\n pixelY = (y * size + 0.5) + tileTranslatePoint.y;\n }\n return { x: pixelX, y: pixelY };\n}\n/**\n * Method for calculate x point\n */\nexport function xToCoordinate(mapObject, val) {\n var longitudeMinMax = mapObject.baseMapBounds.longitude;\n var totalSize = isNullOrUndefined(mapObject.baseSize) ? mapObject.mapAreaRect.width : mapObject.mapAreaRect.width +\n (Math.abs(mapObject.baseSize.width - mapObject.mapAreaRect.width) / 2);\n return Math.round(totalSize * (val - longitudeMinMax.min) / (longitudeMinMax.max - longitudeMinMax.min) * 100) / 100;\n}\n/**\n * Method for calculate y point\n */\nexport function yToCoordinate(mapObject, val) {\n var latitudeMinMax = mapObject.baseMapBounds.latitude;\n return Math.round(mapObject.mapAreaRect.height * (val - latitudeMinMax.min) / (latitudeMinMax.max - latitudeMinMax.min) * 100) / 100;\n}\n/**\n * Method for calculate aitoff projection\n */\nexport function aitoff(x, y) {\n var cosy = Math.cos(y);\n var sincia = sinci(acos(cosy * Math.cos(x /= 2)));\n return new Point(2 * cosy * Math.sin(x) * sincia, Math.sin(y) * sincia);\n}\n/**\n * Method to round the number\n */\nexport function roundTo(a, b) {\n var c = Math.pow(10, b);\n return (Math.round(a * c) / c);\n}\nexport function sinci(x) {\n return x / Math.sin(x);\n}\nexport function acos(a) {\n return Math.acos(a);\n}\n/**\n * Method to calculate bound\n */\nexport function calculateBound(value, min, max) {\n if (!isNullOrUndefined(min)) {\n value = Math.max(value, min);\n }\n if (!(isNullOrUndefined(max))) {\n value = Math.min(value, max);\n }\n return value;\n}\n/**\n * Map internal class for point\n */\nvar Point = /** @class */ (function () {\n function Point(x, y) {\n this.x = x;\n this.y = y;\n }\n return Point;\n}());\nexport { Point };\n/**\n * Map internal class for min and max\n *\n */\nvar MinMax = /** @class */ (function () {\n function MinMax(min, max) {\n this.min = min;\n this.max = max;\n }\n return MinMax;\n}());\nexport { MinMax };\n/**\n * Map internal class locations\n */\nvar GeoLocation = /** @class */ (function () {\n function GeoLocation(latitude, longitude) {\n this.latitude = new MinMax(latitude.min, latitude.max);\n this.longitude = new MinMax(longitude.min, longitude.max);\n }\n return GeoLocation;\n}());\nexport { GeoLocation };\n/**\n * Function to measure the height and width of the text.\n * @param {string} text\n * @param {FontModel} font\n * @param {string} id\n * @returns no\n * @private\n */\nexport function measureText(text, font) {\n var htmlObject = document.getElementById('mapsmeasuretext');\n if (htmlObject === null) {\n htmlObject = createElement('text', { id: 'mapsmeasuretext' });\n document.body.appendChild(htmlObject);\n }\n htmlObject.innerHTML = text;\n htmlObject.style.position = 'absolute';\n htmlObject.style.fontSize = font.size;\n htmlObject.style.fontWeight = font.fontWeight;\n htmlObject.style.fontStyle = font.fontStyle;\n htmlObject.style.fontFamily = font.fontFamily;\n htmlObject.style.visibility = 'hidden';\n htmlObject.style.top = '-100';\n htmlObject.style.left = '0';\n htmlObject.style.whiteSpace = 'nowrap';\n // For bootstrap line height issue\n htmlObject.style.lineHeight = 'normal';\n return new Size(htmlObject.clientWidth, htmlObject.clientHeight);\n}\n/**\n * Internal use of text options\n * @private\n */\nvar TextOption = /** @class */ (function () {\n function TextOption(id, x, y, anchor, text, transform, baseLine) {\n if (transform === void 0) { transform = ''; }\n this.transform = '';\n this.baseLine = 'auto';\n this.id = id;\n this.x = x;\n this.y = y;\n this.anchor = anchor;\n this.text = text;\n this.transform = transform;\n this.baseLine = baseLine;\n }\n return TextOption;\n}());\nexport { TextOption };\n/**\n * Internal use of path options\n * @private\n */\nvar PathOption = /** @class */ (function () {\n function PathOption(id, fill, width, color, opacity, dashArray, d) {\n this.id = id;\n this.opacity = opacity;\n this.fill = fill;\n this.stroke = color;\n this['stroke-width'] = width;\n this['stroke-dasharray'] = dashArray;\n this.d = d;\n }\n return PathOption;\n}());\nexport { PathOption };\n/**\n * Internal use of rectangle options\n * @private\n */\nvar RectOption = /** @class */ (function (_super) {\n __extends(RectOption, _super);\n function RectOption(id, fill, border, opacity, rect, rx, ry, transform, dashArray) {\n var _this = _super.call(this, id, fill, border.width, border.color, opacity, dashArray) || this;\n _this.y = rect.y;\n _this.x = rect.x;\n _this.height = rect.height;\n _this.width = rect.width;\n _this.rx = rx ? rx : 0;\n _this.ry = ry ? ry : 0;\n _this.transform = transform ? transform : '';\n _this['stroke-dasharray'] = dashArray;\n return _this;\n }\n return RectOption;\n}(PathOption));\nexport { RectOption };\n/**\n * Internal use of circle options\n * @private\n */\nvar CircleOption = /** @class */ (function (_super) {\n __extends(CircleOption, _super);\n function CircleOption(id, fill, border, opacity, cx, cy, r, dashArray) {\n var _this = _super.call(this, id, fill, border.width, border.color, opacity) || this;\n _this.cy = cy;\n _this.cx = cx;\n _this.r = r;\n _this['stroke-dasharray'] = dashArray;\n return _this;\n }\n return CircleOption;\n}(PathOption));\nexport { CircleOption };\n/**\n * Internal use of polygon options\n * @private\n */\nvar PolygonOption = /** @class */ (function (_super) {\n __extends(PolygonOption, _super);\n function PolygonOption(id, points, fill, width, color, opacity, dashArray) {\n if (opacity === void 0) { opacity = 1; }\n if (dashArray === void 0) { dashArray = ''; }\n var _this = _super.call(this, id, fill, width, color, opacity, dashArray) || this;\n _this.points = points;\n return _this;\n }\n return PolygonOption;\n}(PathOption));\nexport { PolygonOption };\n/**\n * Internal use of polyline options\n * @private\n */\nvar PolylineOption = /** @class */ (function (_super) {\n __extends(PolylineOption, _super);\n function PolylineOption(id, points, fill, width, color, opacity, dashArray) {\n if (opacity === void 0) { opacity = 1; }\n if (dashArray === void 0) { dashArray = ''; }\n return _super.call(this, id, points, fill, width, color, opacity, dashArray) || this;\n }\n return PolylineOption;\n}(PolygonOption));\nexport { PolylineOption };\n/**\n * Internal use of line options\n * @private\n */\nvar LineOption = /** @class */ (function (_super) {\n __extends(LineOption, _super);\n function LineOption(id, line, fill, width, color, opacity, dashArray) {\n if (opacity === void 0) { opacity = 1; }\n if (dashArray === void 0) { dashArray = ''; }\n var _this = _super.call(this, id, fill, width, color, opacity, dashArray) || this;\n _this.x1 = line.x1;\n _this.y1 = line.y1;\n _this.x2 = line.x2;\n _this.y2 = line.y2;\n return _this;\n }\n return LineOption;\n}(PathOption));\nexport { LineOption };\n/**\n * Internal use of line\n * @property\n */\nvar Line = /** @class */ (function () {\n function Line(x1, y1, x2, y2) {\n this.x1 = x1;\n this.y1 = y1;\n this.x2 = x2;\n this.y2 = y2;\n }\n return Line;\n}());\nexport { Line };\n/**\n * Internal use of map location type\n * @private\n */\nvar MapLocation = /** @class */ (function () {\n function MapLocation(x, y) {\n this.x = x;\n this.y = y;\n }\n return MapLocation;\n}());\nexport { MapLocation };\n/**\n * Internal use of type rect\n * @private\n */\nvar Rect = /** @class */ (function () {\n function Rect(x, y, width, height) {\n this.x = x;\n this.y = y;\n this.width = width;\n this.height = height;\n }\n return Rect;\n}());\nexport { Rect };\n/**\n * Internal use for pattern creation.\n * @property\n */\nvar PatternOptions = /** @class */ (function () {\n function PatternOptions(id, x, y, width, height, patternUnits, patternContentUnits, patternTransform, href) {\n if (patternUnits === void 0) { patternUnits = 'userSpaceOnUse'; }\n if (patternContentUnits === void 0) { patternContentUnits = 'userSpaceOnUse'; }\n if (patternTransform === void 0) { patternTransform = ''; }\n if (href === void 0) { href = ''; }\n this.id = id;\n this.x = x;\n this.y = y;\n this.width = width;\n this.height = height;\n this.patternUnits = patternUnits;\n this.patternContentUnits = patternContentUnits;\n this.patternTransform = patternTransform;\n this.href = href;\n }\n return PatternOptions;\n}());\nexport { PatternOptions };\n/**\n * Internal rendering of text\n * @private\n */\nexport function renderTextElement(options, font, color, parent, isMinus) {\n if (isMinus === void 0) { isMinus = false; }\n var renderOptions = {\n 'id': options.id,\n 'x': options.x,\n 'y': options.y,\n 'fill': color,\n 'font-size': font.size,\n 'font-style': font.fontStyle,\n 'font-family': font.fontFamily,\n 'font-weight': font.fontWeight,\n 'text-anchor': options.anchor,\n 'transform': options.transform,\n 'opacity': font.opacity,\n 'dominant-baseline': options.baseLine\n };\n var text = typeof options.text === 'string' ? options.text : isMinus ? options.text[options.text.length - 1] : options.text[0];\n var tspanElement;\n var renderer = new SvgRenderer('');\n var height;\n var htmlObject = renderer.createText(renderOptions, text);\n htmlObject.style['user-select'] = 'none';\n htmlObject.style['-moz-user-select'] = 'none';\n htmlObject.style['-webkit-touch-callout'] = 'none';\n htmlObject.style['-webkit-user-select'] = 'none';\n htmlObject.style['-khtml-user-select'] = 'none';\n htmlObject.style['-ms-user-select'] = 'none';\n htmlObject.style['-o-user-select'] = 'none';\n if (typeof options.text !== 'string' && options.text.length > 1) {\n for (var i = 1, len = options.text.length; i < len; i++) {\n height = (measureText(options.text[i], font).height);\n tspanElement = renderer.createTSpan({\n 'x': options.x, 'id': options.id,\n 'y': (options.y) + ((isMinus) ? -(i * height) : (i * height))\n }, isMinus ? options.text[options.text.length - (i + 1)] : options.text[i]);\n htmlObject.appendChild(tspanElement);\n }\n }\n parent.appendChild(htmlObject);\n return htmlObject;\n}\n/**\n * @private\n */\nexport function convertElement(element, markerId, data, index, mapObj) {\n var childElement = createElement('div', {\n id: markerId,\n styles: 'position: absolute;pointer-events: auto;'\n });\n while (element.length > 0) {\n childElement.appendChild(element[0]);\n }\n var templateHtml = childElement.innerHTML;\n var properties = Object.keys(data);\n for (var i = 0; i < properties.length; i++) {\n if (properties[i].toLowerCase() !== 'latitude' && properties[i].toLowerCase() !== 'longitude') {\n templateHtml = templateHtml.replace(new RegExp('{{:' + properties[i] + '}}', 'g'), data[properties[i].toString()]);\n }\n }\n childElement.innerHTML = templateHtml;\n return childElement;\n}\nexport function convertElementFromLabel(element, labelId, data, index, mapObj) {\n var labelEle = isNullOrUndefined(element.childElementCount) ? element[0] : element;\n var templateHtml = labelEle.outerHTML;\n var properties = Object.keys(data);\n for (var i = 0; i < properties.length; i++) {\n templateHtml = templateHtml.replace(new RegExp('{{:' + properties[i] + '}}', 'g'), data[properties[i].toString()]);\n }\n return createElement('div', {\n id: labelId,\n innerHTML: templateHtml,\n styles: 'position: absolute'\n });\n}\n/**\n * Internal use of append shape element\n * @private\n */\nexport function appendShape(shape, element) {\n if (element) {\n element.appendChild(shape);\n }\n return shape;\n}\n/**\n * Internal rendering of Circle\n * @private\n */\nexport function drawCircle(maps, options, element) {\n return appendShape(maps.renderer.drawCircle(options), element);\n}\n/**\n * Internal rendering of Rectangle\n * @private\n */\nexport function drawRectangle(maps, options, element) {\n return appendShape(maps.renderer.drawRectangle(options), element);\n}\n/**\n * Internal rendering of Path\n * @private\n */\nexport function drawPath(maps, options, element) {\n return appendShape(maps.renderer.drawPath(options), element);\n}\n/**\n * Internal rendering of Polygon\n * @private\n */\nexport function drawPolygon(maps, options, element) {\n return appendShape(maps.renderer.drawPolygon(options), element);\n}\n/**\n * Internal rendering of Polyline\n * @private\n */\nexport function drawPolyline(maps, options, element) {\n return appendShape(maps.renderer.drawPolyline(options), element);\n}\n/**\n * Internal rendering of Line\n * @private\n */\nexport function drawLine(maps, options, element) {\n return appendShape(maps.renderer.drawLine(options), element);\n}\n/**\n * @private\n * Calculate marker shapes\n */\nexport function calculateShapes(maps, shape, options, size, location, markerEle) {\n var tempGroup;\n switch (shape) {\n case 'Balloon':\n tempGroup = drawBalloon(maps, options, size, location, markerEle);\n break;\n case 'Cross':\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + location.x + ' ' + (location.y + size.height\n / 2) + ' M ' + (location.x - size.width / 2) + ' ' + location.y + ' L ' + (location.x + size.width / 2) + ' ' + location.y;\n break;\n case 'Diamond':\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + (location.x + size.width / 2) + ' '\n + location.y + ' L ' + location.x + ' ' + (location.y + size.height / 2) + ' L ' + (location.x - size.width / 2)\n + ' ' + location.y + ' Z';\n break;\n case 'Star':\n options.d = 'M ' + (location.x + size.width / 3) + ' ' + (location.y - size.height / 2) + ' L ' + (location.x - size.width / 2)\n + ' ' + (location.y + size.height / 6) + ' L ' + (location.x + size.width / 2) + ' ' + (location.y + size.height / 6)\n + ' L ' + (location.x - size.width / 3) + ' ' + (location.y - size.height / 2) + ' L ' + location.x + ' ' +\n (location.y + size.height / 2) + ' L ' + (location.x + size.width / 3) + ' ' + (location.y - size.height / 2) + ' Z';\n break;\n case 'Triangle':\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + (location.x + size.width / 2) + ' ' +\n (location.y + size.height / 2) + ' L ' + (location.x - size.width / 2) + ' ' + (location.y + size.height / 2) + ' Z';\n break;\n case 'HorizontalLine':\n options.d = ' M ' + (location.x - size.width / 2) + ' ' + location.y + ' L ' + (location.x + size.width / 2) + ' '\n + location.y;\n break;\n case 'VerticalLine':\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + location.x + ' ' +\n (location.y + size.height / 2);\n break;\n }\n return shape === 'Balloon' ? tempGroup : maps.renderer.drawPath(options);\n}\n/**\n * Internal rendering of Diamond\n * @private\n */\nexport function drawDiamond(maps, options, size, location, element) {\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + (location.x + size.width / 2) + ' ' + location.y +\n ' L ' + location.x + ' ' + (location.y + size.height / 2) + ' L ' + (location.x - size.width / 2) + ' ' + location.y + ' Z';\n return appendShape(maps.renderer.drawPath(options), element);\n}\n/**\n * Internal rendering of Triangle\n * @private\n */\nexport function drawTriangle(maps, options, size, location, element) {\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + (location.x + size.width / 2) + ' ' +\n (location.y + size.height / 2) + ' L ' + (location.x - size.width / 2) + ' ' + (location.y + size.height / 2) + ' Z';\n return appendShape(maps.renderer.drawPath(options), element);\n}\n/**\n * Internal rendering of Cross\n * @private\n */\nexport function drawCross(maps, options, size, location, element) {\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + location.x + ' ' + (location.y + size.height / 2) +\n ' M ' + (location.x - size.width / 2) + ' ' + location.y + ' L ' + (location.x + size.width / 2) + ' ' + location.y;\n return appendShape(maps.renderer.drawPath(options), element);\n}\n/**\n * Internal rendering of HorizontalLine\n * @private\n */\nexport function drawHorizontalLine(maps, options, size, location, element) {\n options.d = ' M ' + (location.x - size.width / 2) + ' ' + location.y + ' L ' + (location.x + size.width / 2) + ' ' + location.y;\n return appendShape(maps.renderer.drawPath(options), element);\n}\n/**\n * Internal rendering of VerticalLine\n * @private\n */\nexport function drawVerticalLine(maps, options, size, location, element) {\n options.d = 'M ' + location.x + ' ' + (location.y - size.height / 2) + ' L ' + location.x + ' ' + (location.y + size.height / 2);\n return appendShape(maps.renderer.drawPath(options), element);\n}\n/**\n * Internal rendering of Star\n * @private\n */\nexport function drawStar(maps, options, size, location, element) {\n options.d = 'M ' + (location.x + size.width / 3) + ' ' + (location.y - size.height / 2) + ' L ' + (location.x - size.width / 2)\n + ' ' + (location.y + size.height / 6) + ' L ' + (location.x + size.width / 2) + ' ' + (location.y + size.height / 6) + ' L '\n + (location.x - size.width / 3) + ' ' + (location.y - size.height / 2) + ' L ' + location.x + ' ' + (location.y + size.height / 2)\n + ' L ' + (location.x + size.width / 3) + ' ' + (location.y - size.height / 2) + ' Z';\n return appendShape(maps.renderer.drawPath(options), element);\n}\n/**\n * Internal rendering of Balloon\n * @private\n */\nexport function drawBalloon(maps, options, size, location, element) {\n var width = size.width;\n var height = size.height;\n var padding = 5;\n location.x -= width / 2;\n location.y -= height;\n options.d = 'M15,0C8.8,0,3.8,5,3.8,11.2C3.8,17.5,9.4,24.4,15,30c5.6-5.6,11.2-12.5,11.2-18.8C26.2,5,21.2,0,15,0z M15,16' +\n 'c-2.8,0-5-2.2-5-5s2.2-5,5-5s5,2.2,5,5S17.8,16,15,16z';\n var balloon = maps.renderer.drawPath(options);\n var x = size.width / 22.5;\n var y = size.height / 30;\n balloon.setAttribute('transform', 'translate(' + location.x + ', ' + location.y + ') scale(' + x + ', ' + y + ')');\n var g = maps.renderer.createGroup({ id: options.id });\n appendShape(balloon, g);\n return appendShape(g, element);\n}\n/**\n * Internal rendering of Pattern\n * @private\n */\nexport function drawPattern(maps, options, elements, element) {\n var pattern = maps.renderer.createPattern(options, 'pattern');\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var ele = elements_1[_i];\n appendShape(ele, pattern);\n }\n return appendShape(pattern, element);\n}\n/**\n * Method to get specific field and vaues from data.\n * @private\n */\n// tslint:disable:no-any\nexport function getFieldData(dataSource, fields) {\n var newData = [];\n var data;\n for (var _i = 0, dataSource_1 = dataSource; _i < dataSource_1.length; _i++) {\n var temp = dataSource_1[_i];\n data = {};\n for (var _a = 0, fields_1 = fields; _a < fields_1.length; _a++) {\n var field = fields_1[_a];\n if (temp[field]) {\n data[field] = temp[field];\n }\n }\n newData.push(data);\n }\n return newData;\n}\n/**\n * To find the index of dataSource from shape properties\n */\n// tslint:disable:no-string-literal\nexport function checkShapeDataFields(dataSource, properties, dataPath, propertyPath) {\n if (!(isNullOrUndefined(properties))) {\n for (var i = 0; i < dataSource.length; i++) {\n if (dataSource[i][dataPath] === properties[propertyPath]) {\n return i;\n }\n }\n }\n return null;\n}\nexport function filter(points, start, end) {\n var pointObject = [];\n for (var i = 0; i < points.length; i++) {\n var point = points[i];\n if (start <= point.y && end >= point.y) {\n pointObject.push(point);\n }\n }\n return pointObject;\n}\n/**\n * To find the midpoint of the polygon from points\n */\nexport function findMidPointOfPolygon(points) {\n if (!points.length) {\n return null;\n }\n var min = 0;\n var max = points.length;\n var startX;\n var startY;\n var startX1;\n var startY1;\n var sum = 0;\n var xSum = 0;\n var ySum = 0;\n for (var i = min; i <= max - 1; i++) {\n startX = points[i].x;\n startY = points[i].y;\n if (i === max - 1) {\n startX1 = points[0].x;\n startY1 = points[0].y;\n }\n else {\n startX1 = points[i + 1].x;\n startY1 = points[i + 1].y;\n }\n sum = sum + Math.abs(((startX * startY1)) - (startX1 * startY));\n xSum = xSum + Math.abs(((startX + startX1) * (((startX * startY1) - (startX1 * startY)))));\n ySum = ySum + Math.abs(((startY + startY1) * (((startX * startY1) - (startX1 * startY)))));\n }\n sum = 0.5 * sum;\n xSum = (1 / (4 * sum)) * xSum;\n ySum = (1 / (4 * sum)) * ySum;\n /* Code for finding nearest points in polygon related to midPoint*/\n var rightMinPoint = { x: 0, y: 0 };\n var rightMaxPoint = { x: 0, y: 0 };\n var leftMinPoint = { x: 0, y: 0 };\n var leftMaxPoint = { x: 0, y: 0 };\n var bottomMinPoint = { x: 0, y: 0 };\n var bottomMaxPoint = { x: 0, y: 0 };\n var topMinPoint = { x: 0, y: 0 };\n var topMaxPoint = { x: 0, y: 0 };\n var height = 0;\n for (var i = min; i <= max - 1; i++) {\n var point = points[i];\n if (point.y > ySum) {\n if (point.x < xSum && xSum - point.x < xSum - bottomMinPoint.x) {\n bottomMinPoint = { x: point.x, y: point.y };\n }\n else if (point.x > xSum && (bottomMaxPoint.x === 0 || point.x - xSum < bottomMaxPoint.x - xSum)) {\n bottomMaxPoint = { x: point.x, y: point.y };\n }\n }\n else {\n if (point.x < xSum && xSum - point.x < xSum - topMinPoint.x) {\n topMinPoint = { x: point.x, y: point.y };\n }\n else if (point.x > xSum && (topMaxPoint.x === 0 || point.x - xSum < topMaxPoint.x - xSum)) {\n topMaxPoint = { x: point.x, y: point.y };\n }\n }\n height = (bottomMaxPoint.y - topMaxPoint.y) + ((bottomMaxPoint.y - topMaxPoint.y) / 4);\n if (point.x > xSum) {\n if (point.y < ySum && ySum - point.y < ySum - rightMinPoint.y) {\n rightMinPoint = { x: point.x, y: point.y };\n }\n else if (point.y > ySum && (rightMaxPoint.y === 0 || point.y - ySum < rightMaxPoint.y - ySum)) {\n rightMaxPoint = { x: point.x, y: point.y };\n }\n }\n else {\n if (point.y < ySum && ySum - point.y < ySum - leftMinPoint.y) {\n leftMinPoint = { x: point.x, y: point.y };\n }\n else if (point.y > ySum && (leftMaxPoint.y === 0 || point.y - ySum < leftMaxPoint.y - ySum)) {\n leftMaxPoint = { x: point.x, y: point.y };\n }\n }\n }\n return {\n x: xSum, y: ySum, rightMin: rightMinPoint, rightMax: rightMaxPoint,\n leftMin: leftMinPoint, leftMax: leftMaxPoint, points: points, topMax: topMaxPoint, topMin: topMinPoint,\n bottomMax: bottomMaxPoint, bottomMin: bottomMinPoint, height: height\n };\n}\n/**\n * @private\n * Check custom path\n */\n/* tslint:disable:no-string-literal */\nexport function isCustomPath(layerData) {\n var customPath = false;\n if (Object.prototype.toString.call(layerData) === '[object Array]') {\n layerData.forEach(function (layer, index) {\n if (!isNullOrUndefined(layer['geometry']) && layer['geometry']['type'] === 'Path') {\n customPath = true;\n }\n });\n }\n return customPath;\n}\n/**\n * @private\n * Trim the title text\n */\nexport function textTrim(maxWidth, text, font) {\n var label = text;\n var size = measureText(text, font).width;\n if (size > maxWidth) {\n var textLength = text.length;\n for (var i = textLength - 1; i >= 0; --i) {\n label = text.substring(0, i) + '...';\n size = measureText(label, font).width;\n if (size <= maxWidth || label.length < 4) {\n if (label.length < 4) {\n label = ' ';\n }\n return label;\n }\n }\n }\n return label;\n}\n/**\n * Method to calculate x position of title\n */\nexport function findPosition(location, alignment, textSize, type) {\n var x;\n var y;\n switch (alignment) {\n case 'Near':\n x = location.x;\n break;\n case 'Center':\n x = (type === 'title') ? (location.width / 2 - textSize.width / 2) :\n ((location.x + (location.width / 2)) - textSize.width / 2);\n break;\n case 'Far':\n x = (type === 'title') ? (location.width - location.y - textSize.width) :\n ((location.x + location.width) - textSize.width);\n break;\n }\n y = (type === 'title') ? location.y + (textSize.height / 2) : ((location.y + location.height / 2) + textSize.height / 2);\n return new Point(x, y);\n}\n/**\n * To remove element by id\n */\nexport function removeElement(id) {\n var element = document.getElementById(id);\n return element ? remove(element) : null;\n}\n/**\n * @private\n */\nexport function getTranslate(mapObject, layer, animate) {\n var zoomFactor = animate ? 1 : mapObject.zoomSettings.zoomFactor;\n var min = mapObject.baseMapRectBounds['min'];\n var max = mapObject.baseMapRectBounds['max'];\n var size = mapObject.mapAreaRect;\n var availSize = mapObject.availableSize;\n var x;\n var y;\n var mapWidth = Math.abs(max['x'] - min['x']);\n var mapHeight = Math.abs(min['y'] - max['y']);\n var factor = animate ? 1 : mapObject.zoomSettings.zoomFactor;\n var scaleFactor;\n var scaleX;\n var scaleY;\n var center = mapObject.centerPosition;\n if (!isNullOrUndefined(center.longitude) && !isNullOrUndefined(center.latitude)) {\n var leftPosition = ((mapWidth + Math.abs(mapObject.mapAreaRect.width - mapWidth)) / 2) / factor;\n var topPosition = ((mapHeight + Math.abs(mapObject.mapAreaRect.height - mapHeight)) / 2) / factor;\n var point = convertGeoToPoint(center.latitude, center.longitude, mapObject.mapLayerPanel.calculateFactor(layer), layer, mapObject);\n x = -point.x + leftPosition;\n y = -point.y + topPosition;\n scaleFactor = zoomFactor;\n }\n else {\n scaleFactor = parseFloat(Math.min(size.width / mapWidth, size.height / mapHeight).toFixed(2));\n mapWidth *= scaleFactor;\n mapHeight *= scaleFactor;\n x = size.x + ((-(min['x'])) + ((size.width / 2) - (mapWidth / 2)));\n y = size.y + ((-(min['y'])) + ((size.height / 2) - (mapHeight / 2)));\n }\n return { scale: scaleFactor, location: new Point(x, y) };\n}\n/**\n * To get the html element by specified id\n */\nexport function getElementByID(id) {\n return document.getElementById(id);\n}\n/**\n * To apply internalization\n */\nexport function Internalize(maps, value) {\n maps.formatFunction =\n maps.intl.getNumberFormat({ format: maps.format, useGrouping: maps.useGroupingSeparator });\n return maps.formatFunction(value);\n}\n/**\n * Function to compile the template function for maps.\n * @returns Function\n * @private\n */\nexport function getTemplateFunction(template) {\n var templateFn = null;\n var e;\n try {\n if (document.querySelectorAll(template).length) {\n templateFn = templateComplier(document.querySelector(template).innerHTML.trim());\n }\n }\n catch (e) {\n templateFn = templateComplier(template);\n }\n return templateFn;\n}\n/**\n * Function to get element from id.\n * @returns Element\n * @private\n */\nexport function getElement(id) {\n return document.getElementById(id);\n}\n/**\n * Function to get shape data using target id\n */\nexport function getShapeData(targetId, map) {\n var layerIndex = parseInt(targetId.split('_LayerIndex_')[1].split('_')[0], 10);\n var shapeIndex = parseInt(targetId.split('_ShapeIndex_')[1].split('_')[0], 10);\n var layer = map.layers[layerIndex];\n var shapeData = layer.layerData[shapeIndex]['property'];\n var data;\n if (layer.dataSource) {\n data = layer.dataSource[checkShapeDataFields(layer.dataSource, shapeData, layer.shapeDataPath, layer.shapePropertyPath)];\n }\n return { shapeData: shapeData, data: data };\n}\n/**\n * Function to trigger shapeSelected event\n * @private\n */\nexport function triggerShapeEvent(targetId, selection, maps, eventName) {\n var shape = getShapeData(targetId, maps);\n var eventArgs = {\n cancel: false,\n name: eventName,\n fill: selection.fill,\n opacity: selection.opacity,\n border: selection.border,\n shapeData: shape.shapeData,\n data: shape.data,\n target: targetId\n };\n maps.trigger(eventName, eventArgs);\n return eventArgs;\n}\n/**\n * Function to get elements using class name\n */\nexport function getElementsByClassName(className) {\n return document.getElementsByClassName(className);\n}\n/**\n * Function to get elements using querySelectorAll\n */\n// export function querySelectorAll(args: string, element: Element): NodeListOf {\n// return element.querySelectorAll('.' + args);\n// }\n/**\n * Function to get elements using querySelector\n */\nexport function querySelector(args, elementSelector) {\n var targetEle = null;\n if (document.getElementById(elementSelector)) {\n targetEle = document.getElementById(elementSelector).querySelector('#' + args);\n }\n return targetEle;\n}\n/**\n * Function to get the element for selection and highlight using public method\n */\nexport function getTargetElement(layerIndex, name, enable, map) {\n var shapeIndex;\n var targetId;\n var targetEle;\n var shapeData = map.layers[layerIndex].shapeData['features'];\n for (var i = 0; i < shapeData.length; i++) {\n if (shapeData[i]['properties'].name === name) {\n targetId = map.element.id + '_' + 'LayerIndex_' + layerIndex + '_ShapeIndex_' + i + '_dataIndex_undefined';\n break;\n }\n }\n targetEle = getElement(targetId);\n return targetEle;\n}\n/**\n * Function to create style element for highlight and selection\n */\nexport function createStyle(id, className, eventArgs) {\n return createElement('style', {\n id: id, innerHTML: '.' + className + '{fill:'\n + eventArgs.fill + ';' + 'opacity:' + eventArgs.opacity.toString() + ';' +\n '}'\n });\n}\n/**\n * Function to customize the style for highlight and selection\n */\nexport function customizeStyle(id, className, eventArgs) {\n var styleEle = getElement(id);\n styleEle.innerHTML = '.' + className + '{fill:'\n + eventArgs.fill + ';' + 'opacity:' + eventArgs.opacity.toString() + ';' +\n 'stroke-width:' + eventArgs.border.width.toString() +\n 'stroke-color:' + eventArgs.border.color + '}';\n}\n/**\n * Function to remove class from element\n */\nexport function removeClass(element) {\n element.removeAttribute('class');\n}\n/**\n * Animation Effect Calculation End\n * @private\n */\nexport function elementAnimate(element, delay, duration, point, maps, ele, radius) {\n if (radius === void 0) { radius = 0; }\n var centerX = point.x;\n var centerY = point.y;\n var height = 0;\n var transform = element.getAttribute('transform') || '';\n new Animation({}).animate(element, {\n duration: duration,\n delay: delay,\n progress: function (args) {\n if (args.timeStamp > args.delay) {\n height = ((args.timeStamp - args.delay) / args.duration);\n element.setAttribute('transform', 'translate( ' + (centerX - (radius * height)) + ' ' + (centerY - (radius * height)) +\n ' ) scale(' + height + ')');\n }\n },\n end: function (model) {\n element.setAttribute('transform', transform);\n if (!ele) {\n return;\n }\n var event = {\n cancel: false, name: animationComplete, element: ele, maps: maps\n };\n maps.trigger(animationComplete, event);\n }\n });\n}\nexport function timeout(id) {\n removeElement(id);\n}\nexport function showTooltip(text, size, x, y, areaWidth, areaHeight, id, element, isTouch) {\n var tooltip = document.getElementById(id);\n var width = measureText(text, {\n fontFamily: 'Segoe UI', size: '8px',\n fontStyle: 'Normal', fontWeight: 'Regular'\n }).width;\n var str = text.split(' ');\n var demo = str[0].length;\n for (var i = 1; i < str.length; i++) {\n if (demo < str[i].length) {\n demo = str[i].length;\n }\n }\n if (!tooltip) {\n tooltip = createElement('div', {\n id: id,\n styles: 'background-color: rgb(255, 255, 255) !important; color:black !important; ' +\n 'position:absolute;border:1px solid rgb(0, 0, 0); padding-left:5px;' +\n 'font-size:12px; font-family: \"Segoe UI\"; text-align:center'\n });\n }\n if (x < (areaWidth - width)) {\n x = x;\n }\n else if (x > (areaWidth - width) && x < areaWidth - (demo * 8)) {\n width = (areaWidth - x);\n }\n else if (x >= areaWidth - demo * 8) {\n if (x > width) {\n x = x - width;\n }\n else {\n width = x;\n x = 0;\n }\n }\n var size1 = size.split('px');\n wordWrap(tooltip, text, x, y, size1, width, areaWidth, element);\n var height = tooltip.clientHeight;\n if ((height + parseInt(size1[0], 10) * 2) > areaHeight) {\n width = x;\n x = 0;\n }\n wordWrap(tooltip, text, x, y, size1, width, areaWidth, element);\n if (isTouch) {\n setTimeout(timeout, 5000, id);\n }\n}\nexport function wordWrap(tooltip, text, x, y, size1, width, areaWidth, element) {\n tooltip.innerHTML = text;\n tooltip.style.top = (y + parseInt(size1[0], 10)).toString() + 'px';\n tooltip.style.left = (x).toString() + 'px';\n tooltip.style.width = width.toString() + 'px';\n tooltip.style.maxWidth = (areaWidth).toString() + 'px';\n tooltip.style.wordWrap = 'break-word';\n element.appendChild(tooltip);\n}\n// /**\n// * \n// * @param touchList \n// * @param e \n// * @param touches \n// */\n// export function addTouchPointer(touchList: ITouches[], e: PointerEvent, touches: TouchList): ITouches[] {\n// if (touches) {\n// touchList = [];\n// for (let i: number = 0, length: number = touches.length; i < length; i++) {\n// touchList.push({ pageX: touches[i].clientX, pageY: touches[i].clientY, pointerId: null });\n// }\n// } else {\n// touchList = touchList ? touchList : [];\n// if (touchList.length === 0) {\n// touchList.push({ pageX: e.clientX, pageY: e.clientY, pointerId: e.pointerId });\n// } else {\n// for (let i: number = 0, length: number = touchList.length; i < length; i++) {\n// if (touchList[i].pointerId === e.pointerId) {\n// touchList[i] = { pageX: e.clientX, pageY: e.clientY, pointerId: e.pointerId };\n// } else {\n// touchList.push({ pageX: e.clientX, pageY: e.clientY, pointerId: e.pointerId });\n// }\n// }\n// }\n// }\n// return touchList;\n// }\n/** @private */\nexport function createTooltip(id, text, top, left, fontSize) {\n var tooltip = getElement(id);\n var style = 'top:' + top.toString() + 'px;' +\n 'left:' + left.toString() + 'px;' +\n 'background:' + '#FFFFFF' + ';' +\n 'position:absolute;border:1px solid #707070;font-size:' + fontSize + ';border-radius:2px;';\n if (!tooltip) {\n tooltip = createElement('div', {\n id: id, innerHTML: ' ' + text + ' ', styles: style\n });\n document.body.appendChild(tooltip);\n }\n else {\n tooltip.setAttribute('innerHTML', ' ' + text + ' ');\n tooltip.setAttribute('styles', style);\n }\n}\n/** @private */\nexport function drawSymbol(location, shape, size, url, options) {\n var functionName = 'Path';\n var renderer = new SvgRenderer('');\n var temp = calculateLegendShapes(location, size, shape, options, url);\n var htmlObject = renderer['draw' + temp.functionName](temp.renderOption);\n return htmlObject;\n}\n/** @private */\nexport function calculateLegendShapes(location, size, shape, options, url) {\n var path;\n var functionName = 'Path';\n var width = size.width;\n var height = size.height;\n var locX = location.x;\n var locY = location.y;\n var x = location.x + (-width / 2);\n var y = location.y + (-height / 2);\n switch (shape) {\n case 'Circle':\n case 'Bubble':\n functionName = 'Ellipse';\n merge(options, { 'rx': width / 2, 'ry': height / 2, 'cx': locX, 'cy': locY });\n break;\n case 'Star':\n path = 'M ' + (location.x + size.width / 3) + ' ' + (location.y - size.height / 2) + ' L ' + (location.x - size.width / 2)\n + ' ' + (location.y + size.height / 6) + ' L ' + (location.x + size.width / 2) + ' ' + (location.y + size.height / 6)\n + ' L ' + (location.x - size.width / 3) + ' ' + (location.y - size.height / 2) + ' L ' + location.x + ' ' +\n (location.y + size.height / 2) + ' L ' + (location.x + size.width / 3) + ' ' + (location.y - size.height / 2) + ' Z';\n merge(options, { 'd': path });\n break;\n case 'Cross':\n path = 'M' + ' ' + x + ' ' + locY + ' ' + 'L' + ' ' + (locX + (width / 2)) + ' ' + locY + ' ' +\n 'M' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + locX + ' ' +\n (locY + (-height / 2));\n merge(options, { 'd': path });\n break;\n case 'HorizontalLine':\n path = 'M' + ' ' + x + ' ' + locY + ' ' + 'L' + ' ' + (locX + (width / 2)) + ' ' + locY;\n merge(options, { 'd': path });\n break;\n case 'VerticalLine':\n path = 'M' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' + 'L' + ' ' + locX + ' ' + (locY + (-height / 2));\n merge(options, { 'd': path });\n break;\n case 'Diamond':\n path = 'M' + ' ' + x + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + locY + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + locY + ' z';\n merge(options, { 'd': path });\n break;\n case 'Rectangle':\n path = 'M' + ' ' + x + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (-height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'Triangle':\n path = 'M' + ' ' + x + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (-height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + x + ' ' + (locY + (height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'InvertedTriangle':\n path = 'M' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + locX + ' ' + (locY + (height / 2)) + ' ' +\n 'L' + ' ' + (locX - (width / 2)) + ' ' + (locY - (height / 2)) + ' ' +\n 'L' + ' ' + (locX + (width / 2)) + ' ' + (locY - (height / 2)) + ' z';\n merge(options, { 'd': path });\n break;\n case 'Pentagon':\n var eq = 72;\n var xValue = void 0;\n var yValue = void 0;\n for (var i = 0; i <= 5; i++) {\n xValue = (width / 2) * Math.cos((Math.PI / 180) * (i * eq));\n yValue = (height / 2) * Math.sin((Math.PI / 180) * (i * eq));\n if (i === 0) {\n path = 'M' + ' ' + (locX + xValue) + ' ' + (locY + yValue) + ' ';\n }\n else {\n path = path.concat('L' + ' ' + (locX + xValue) + ' ' + (locY + yValue) + ' ');\n }\n }\n path = path.concat('Z');\n merge(options, { 'd': path });\n break;\n case 'Image':\n functionName = 'Image';\n merge(options, { 'href': url, 'height': height, 'width': width, x: x, y: y });\n break;\n }\n return { renderOption: options, functionName: functionName };\n}\n/**\n * Animation Effect Calculation End\n * @private\n */\n// export function markerTemplateAnimate(element: Element, delay: number, duration: number, point: MapLocation): void {\n// let delta: number = 0;\n// let top: string = (element as HTMLElement).style.top;\n// let y: number = parseInt(top, 10);\n// new Animation({}).animate(element, {\n// duration: duration,\n// delay: delay,\n// progress: (args: AnimationOptions): void => {\n// if (args.timeStamp > args.delay) {\n// delta = ((args.timeStamp - args.delay) / args.duration);\n// (element as HTMLElement).style.top = y - 100 + (delta * 100) + 'px';\n// }\n// },\n// end: (model: AnimationOptions) => {\n// (element as HTMLElement).style.top = top;\n// }\n// });\n// }\n/** @private */\nexport function getElementOffset(childElement, parentElement) {\n var width;\n var height;\n parentElement.appendChild(childElement);\n width = childElement.offsetWidth;\n height = childElement.offsetHeight;\n parentElement.removeChild(childElement);\n return new Size(width, height);\n}\n/** @private */\nexport function changeBorderWidth(element, index, scale, maps) {\n var childNode;\n for (var l = 0; l < element.childElementCount; l++) {\n childNode = element.childNodes[l];\n if (childNode.id.indexOf('_NavigationGroup') > -1) {\n changeNavaigationLineWidth(childNode, index, scale, maps);\n }\n else {\n var currentStroke = (maps.layersCollection[index].shapeSettings.border.width);\n childNode.setAttribute('stroke-width', (currentStroke / scale).toString());\n }\n }\n}\n/** @private */\nexport function changeNavaigationLineWidth(element, index, scale, maps) {\n var node;\n for (var m = 0; m < element.childElementCount; m++) {\n node = element.childNodes[m];\n if (node.tagName === 'path') {\n var currentStroke = (maps.layersCollection[index]\n .navigationLineSettings[parseFloat(node.id.split('_')[2])].width);\n node.setAttribute('stroke-width', (currentStroke / scale).toString());\n }\n }\n}\n// /** Pinch zoom helper methods */\n/** @private */\nexport function targetTouches(event) {\n var targetTouches = [];\n var touches = event.touches;\n for (var i = 0; i < touches.length; i++) {\n targetTouches.push({ pageX: touches[i].pageX, pageY: touches[i].pageY });\n }\n return targetTouches;\n}\n/** @private */\nexport function calculateScale(startTouches, endTouches) {\n var startDistance = getDistance(startTouches[0], startTouches[1]);\n var endDistance = getDistance(endTouches[0], endTouches[1]);\n return (endDistance / startDistance);\n}\n/** @private */\nexport function getDistance(a, b) {\n var x = a.pageX - b.pageX;\n var y = a.pageY - b.pageY;\n return Math.sqrt(x * x + y * y);\n}\n/** @private */\nexport function getTouches(touches, maps) {\n var rect = maps.element.getBoundingClientRect();\n var posTop = rect.top + document.defaultView.pageXOffset;\n var posLeft = rect.left + document.defaultView.pageYOffset;\n return Array.prototype.slice.call(touches).map(function (touch) {\n return {\n x: touch.pageX - posLeft,\n y: touch.pageY - posTop,\n };\n });\n}\n/** @private */\nexport function getTouchCenter(touches) {\n return {\n x: touches.map(function (e) { return e['x']; }).reduce(sum) / touches.length,\n y: touches.map(function (e) { return e['y']; }).reduce(sum) / touches.length\n };\n}\n/** @private */\nexport function sum(a, b) {\n return a + b;\n}\n/**\n * Animation Effect Calculation End\n * @private\n */\nexport function zoomAnimate(element, delay, duration, point, scale, size, maps) {\n var delta = 0;\n var previousLocation = maps.previousPoint;\n var preScale = maps.previousScale;\n var diffScale = scale - preScale;\n var currentLocation = new MapLocation(0, 0);\n var currentScale = 1;\n if (scale === preScale) {\n element.setAttribute('transform', 'scale( ' + (scale) + ' ) translate( ' + point.x + ' ' + point.y + ' )');\n return;\n }\n var slope = function (previousLocation, point) {\n if (previousLocation.x === point.x) {\n return null;\n }\n return (point.y - previousLocation.y) / (point.x - previousLocation.x);\n };\n var intercept = function (point, slopeValue) {\n if (slopeValue === null) {\n return point.x;\n }\n return point.y - slopeValue * point.x;\n };\n var slopeFactor = slope(previousLocation, point);\n var slopeIntersection = intercept(previousLocation, slopeFactor);\n var horizontalDifference = point.x - previousLocation.x;\n var verticalDifference = point.y - previousLocation.y;\n animate(element, delay, duration, function (args) {\n if (args.timeStamp > args.delay) {\n delta = ((args.timeStamp - args.delay) / args.duration);\n currentScale = preScale + (delta * diffScale);\n currentLocation.x = previousLocation.x + (delta * horizontalDifference) / (currentScale / scale);\n if (slopeFactor == null) {\n currentLocation.y = previousLocation.y + (delta * verticalDifference);\n }\n else {\n currentLocation.y = ((slopeFactor * currentLocation.x) + slopeIntersection);\n }\n args.element.setAttribute('transform', 'scale( ' + currentScale + ' ) ' +\n 'translate( ' + currentLocation.x + ' ' + currentLocation.y + ' )');\n maps.translatePoint = currentLocation;\n maps.scale = currentScale;\n maps.zoomModule.processTemplate(point.x, point.y, currentScale, maps);\n }\n }, function () {\n maps.translatePoint = point;\n maps.scale = scale;\n element.setAttribute('transform', 'scale( ' + (scale) + ' ) translate( ' + point.x + ' ' + point.y + ' )');\n maps.zoomModule.processTemplate(point.x, point.y, scale, maps);\n });\n}\n/**\n * To process custom animation\n */\nexport function animate(element, delay, duration, process, end) {\n var _this = this;\n var start = null;\n var clearAnimation;\n var startAnimation = function (timestamp) {\n if (!start) {\n start = timestamp;\n }\n var progress = timestamp - start;\n if (progress < duration) {\n process.call(_this, { element: element, delay: 0, timeStamp: progress, duration: duration });\n window.requestAnimationFrame(startAnimation);\n }\n else {\n window.cancelAnimationFrame(clearAnimation);\n end.call(_this, { element: element });\n }\n };\n clearAnimation = window.requestAnimationFrame(startAnimation);\n}\nvar MapAjax = /** @class */ (function () {\n function MapAjax(url, sendData) {\n this.url = null;\n this.sendData = null;\n this.url = url;\n this.sendData = sendData;\n }\n return MapAjax;\n}());\nexport { MapAjax };\n/**\n * Animation Translate\n * @private\n */\nexport function smoothTranslate(element, delay, duration, point) {\n var delta = 0;\n var transform = element.getAttribute('transform').split(' ');\n if (transform.length === 2) {\n transform[2] = transform[1].split(')')[0];\n transform[1] = transform[0].split('(')[1];\n }\n var previousLocation = new MapLocation(parseInt(transform[1], 10), parseInt(transform[2], 10));\n var diffx = point.x - previousLocation.x;\n var diffy = point.y - previousLocation.y;\n var currentLocation = new MapLocation(0, 0);\n animate(element, delay, duration, function (args) {\n if (args.timeStamp > args.delay) {\n delta = ((args.timeStamp - args.delay) / args.duration);\n currentLocation.x = previousLocation.x + (delta * diffx);\n currentLocation.y = previousLocation.y + (delta * diffy);\n args.element.setAttribute('transform', 'translate( ' + currentLocation.x + ' ' + currentLocation.y + ' )');\n }\n }, function () {\n element.setAttribute('transform', 'translate( ' + point.x + ' ' + point.y + ' )');\n });\n}\n","/**\n * Schedule common utilities\n */\nexport var WEEK_LENGTH = 7;\nexport var MS_PER_DAY = 86400000;\nexport var MS_PER_MINUTE = 60000;\nexport function getWeekFirstDate(date1, firstDayOfWeek) {\n var date = new Date(date1.getTime());\n firstDayOfWeek = (firstDayOfWeek - date.getDay() + 7 * (-1)) % 7;\n return new Date(date.setDate(date.getDate() + firstDayOfWeek));\n}\nexport function firstDateOfMonth(date) {\n return new Date(date.getFullYear(), date.getMonth());\n}\nexport function lastDateOfMonth(dt) {\n return new Date(dt.getFullYear(), dt.getMonth() + 1, 0);\n}\nexport function getWeekNumber(dt) {\n var currentDate = new Date('' + dt).valueOf();\n var date = new Date(dt.getFullYear(), 0, 1).valueOf();\n var a = (currentDate - date);\n return Math.ceil((((a) / MS_PER_DAY) + new Date(date).getDay() + 1) / 7);\n}\nexport function setTime(date, time) {\n var tzOffsetBefore = date.getTimezoneOffset();\n var d = new Date(date.getTime() + time);\n var tzOffsetDiff = d.getTimezoneOffset() - tzOffsetBefore;\n date.setTime(d.getTime() + tzOffsetDiff * MS_PER_DAY);\n return date;\n}\nexport function resetTime(date) {\n date.setHours(0, 0, 0, 0);\n return date;\n}\nexport function getDateInMs(date) {\n return date.getTime() - new Date(date.getFullYear(), date.getMonth(), date.getDate(), 0, 0, 0).getTime();\n}\nexport function addDays(date, i) {\n date = new Date('' + date);\n return new Date(date.setDate(date.getDate() + i));\n}\nexport function addMonths(date, i) {\n date = new Date('' + date);\n var day = date.getDate();\n date.setDate(1);\n date.setMonth(date.getMonth() + i);\n date.setDate(Math.min(day, getMaxDays(date)));\n return date;\n}\nexport function addYears(date, i) {\n date = new Date('' + date);\n var day = date.getDate();\n date.setDate(1);\n date.setFullYear(date.getFullYear() + i);\n date.setDate(Math.min(day, getMaxDays(date)));\n return date;\n}\nexport function getStartEndHours(date, startHour, endHour) {\n var date1 = new Date(date.getTime());\n date1.setHours(startHour.getHours());\n date1.setMinutes(startHour.getMinutes());\n date1.setSeconds(startHour.getSeconds());\n var date2 = new Date(date.getTime());\n if (endHour.getHours() === 0) {\n date2 = addDays(date2, 1);\n }\n else {\n date2.setHours(endHour.getHours());\n date2.setMinutes(endHour.getMinutes());\n date2.setSeconds(endHour.getSeconds());\n }\n return { startHour: date1, endHour: date2 };\n}\nexport function getMaxDays(d) {\n var date = new Date(d.getFullYear(), d.getMonth() + 1, 0);\n return date.getDate();\n}\nexport function getDaysCount(startDate, endDate) {\n var strTime = resetTime(new Date(startDate));\n var endTime = resetTime(new Date(endDate));\n return (endTime.getTime() - strTime.getTime()) / MS_PER_DAY;\n}\n/** @hidden */\nvar scrollWidth = null;\n/** @hidden */\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","import { isNullOrUndefined, getDefaultDateObject, getValue, cldrData } from '@syncfusion/ej2-base';\nimport { MS_PER_DAY } from '../schedule/base/util';\n/**\n * Date Generator from Recurrence Rule\n */\nexport function generateSummary(rule, localeObject, locale) {\n var ruleObject = extractObjectFromRule(rule);\n var summary = localeObject.getConstant(EVERY) + ' ';\n var cldrObj;\n var cldrObj1;\n if (locale === 'en' || locale === 'en-US') {\n cldrObj1 = (getValue('months.stand-alone.abbreviated', getDefaultDateObject()));\n cldrObj = (getValue('days.stand-alone.abbreviated', getDefaultDateObject()));\n }\n else {\n cldrObj1 = (getValue('main.' + '' + locale + '.dates.calendars.gregorian.months.stand-alone.abbreviated', cldrData));\n cldrObj = (getValue('main.' + '' + locale + '.dates.calendars.gregorian.days.stand-alone.abbreviated', cldrData));\n }\n if (ruleObject.interval > 1) {\n summary += ruleObject.interval + ' ';\n }\n switch (ruleObject.freq) {\n case 'DAILY':\n summary += localeObject.getConstant(DAYS);\n break;\n case 'WEEKLY':\n summary += localeObject.getConstant(WEEKS) + ' ' + localeObject.getConstant(ON) + ' ';\n ruleObject.day.forEach(function (day, index) {\n summary += getValue(DAYINDEXOBJECT[day], cldrObj);\n summary += (((ruleObject.day.length - 1) === index) ? '' : ', ');\n });\n break;\n case 'MONTHLY':\n summary += localeObject.getConstant(MONTHS) + ' ' + localeObject.getConstant(ON) + ' ';\n summary += getMonthSummary(ruleObject, cldrObj, localeObject);\n break;\n case 'YEARLY':\n summary += localeObject.getConstant(YEARS) + ' ' + localeObject.getConstant(ON) + ' ';\n summary += getValue((ruleObject.month[0]).toString(), cldrObj1) + ' ';\n summary += getMonthSummary(ruleObject, cldrObj, localeObject);\n break;\n default:\n return '';\n }\n if (ruleObject.count) {\n summary += ', ' + (ruleObject.count) + ' ' + localeObject.getConstant(TIMES);\n }\n else if (ruleObject.until) {\n var tempDate = ruleObject.until;\n summary += ', ' + localeObject.getConstant(UNTIL)\n + ' ' + tempDate.getDate()\n + ' ' + getValue((tempDate.getMonth() + 1).toString(), cldrObj1)\n + ' ' + tempDate.getFullYear();\n }\n return summary;\n}\nfunction getMonthSummary(ruleObject, cldrObj, localeObj) {\n var summary = '';\n if (ruleObject.monthDay.length) {\n summary += ruleObject.monthDay[0];\n }\n else if (ruleObject.day) {\n var pos = ruleObject.setPosition - 1;\n summary += localeObj.getConstant(WEEKPOS[pos > -1 ? pos : (WEEKPOS.length - 1)])\n + ' ' + getValue(DAYINDEXOBJECT[ruleObject.day[0]], cldrObj);\n }\n return summary;\n}\nexport function generate(startDate, rule, excludeDate, startDayOfWeek, maximumCount, viewDate) {\n if (maximumCount === void 0) { maximumCount = MAXOCCURRENCE; }\n if (viewDate === void 0) { viewDate = null; }\n var ruleObject = extractObjectFromRule(rule);\n var cacheDate;\n var data = [];\n var modifiedDate = new Date(startDate.getTime());\n if (viewDate && viewDate > startDate && !ruleObject.count) {\n tempViewDate = new Date(viewDate.getTime());\n tempViewDate.setHours(startDate.getHours(), startDate.getMinutes(), startDate.getSeconds());\n }\n else {\n tempViewDate = null;\n }\n if (!ruleObject.until && tempViewDate) {\n cacheDate = new Date(tempViewDate.getTime());\n cacheDate.setDate(tempViewDate.getDate() + 42 * (ruleObject.interval));\n ruleObject.until = cacheDate;\n }\n if (ruleObject.until && startDate > ruleObject.until) {\n return data;\n }\n maxOccurrence = maximumCount;\n setFirstDayOfWeek(DAYINDEX[startDayOfWeek]);\n tempExcludeDate = [];\n var tempDate = isNullOrUndefined(excludeDate) ? [] : excludeDate.split(',');\n tempDate.forEach(function (content) {\n var parsedDate = getDateFromRecurrenceDateString(content);\n tempExcludeDate.push(new Date(parsedDate.getTime()).setHours(0, 0, 0, 0));\n });\n switch (ruleObject.freq) {\n case 'DAILY':\n dailyType(modifiedDate, ruleObject.until, data, ruleObject);\n break;\n case 'WEEKLY':\n weeklyType(modifiedDate, ruleObject.until, data, ruleObject);\n break;\n case 'MONTHLY':\n monthlyType(modifiedDate, ruleObject.until, data, ruleObject);\n break;\n case 'YEARLY':\n yearlyType(modifiedDate, ruleObject.until, data, ruleObject);\n }\n return data;\n}\nfunction getDateFromRecurrenceDateString(recDateString) {\n return new Date(recDateString.substr(0, 4) +\n '-' + recDateString.substr(4, 2) +\n '-' + recDateString.substr(6, 5) +\n ':' + recDateString.substr(11, 2) +\n ':' + recDateString.substr(13));\n}\nfunction excludeDateHandler(data, date) {\n var zeroIndex = new Date(date).setHours(0, 0, 0, 0);\n if (tempExcludeDate.indexOf(zeroIndex) === -1 && (!tempViewDate || zeroIndex >= tempViewDate.getTime())) {\n data.push(date);\n }\n}\nfunction dailyType(startDate, endDate, data, ruleObject) {\n var tempDate = new Date(startDate.getTime());\n var interval = ruleObject.interval;\n var expectedCount = ruleObject.count ? ruleObject.count : maxOccurrence;\n var state;\n while (compareDates(tempDate, endDate)) {\n state = true;\n state = validateRules(tempDate, ruleObject);\n if (state) {\n excludeDateHandler(data, tempDate.getTime());\n if (expectedCount && (data.length + tempExcludeDate.length) >= expectedCount) {\n break;\n }\n }\n tempDate.setDate(tempDate.getDate() + interval);\n }\n}\nfunction weeklyType(startDate, endDate, data, ruleObject) {\n var tempDate = getStartDateForWeek(startDate, ruleObject.day);\n var interval = ruleObject.interval;\n var expectedDays = ruleObject.day;\n var expectedCount = ruleObject.count ? ruleObject.count : maxOccurrence;\n var state;\n var dayCycleData = processWeekDays(expectedDays);\n while (compareDates(tempDate, endDate)) {\n state = true;\n state = validateRules(tempDate, ruleObject);\n if (state) {\n excludeDateHandler(data, tempDate.getTime());\n if (expectedCount && (data.length + tempExcludeDate.length) >= expectedCount) {\n break;\n }\n }\n if (expectedDays.length > 1) {\n tempDate.setDate(tempDate.getDate()\n + dayCycleData[DAYINDEX[tempDate.getDay()]]\n + ((expectedDays.indexOf(DAYINDEX[tempDate.getDay()]) === expectedDays.length - 1) ?\n ((interval - 1) * 7) : 0));\n }\n else {\n tempDate.setDate(tempDate.getDate()\n + (interval * 7));\n }\n }\n}\nfunction monthlyType(startDate, endDate, data, ruleObject) {\n var ruleType = validateMonthlyRuleType(ruleObject);\n switch (ruleType) {\n case 'day':\n monthlyDayTypeProcess(startDate, endDate, data, ruleObject);\n break;\n case 'both':\n case 'date':\n monthlyDateTypeProcess(startDate, endDate, data, ruleObject);\n break;\n }\n}\nfunction yearlyType(startDate, endDate, data, ruleObject) {\n var typeValue = checkYearlyType(ruleObject);\n switch (typeValue) {\n case 'MONTH':\n monthlyType(startDate, endDate, data, ruleObject);\n break;\n case 'WEEKNO':\n processWeekNo(startDate, endDate, data, ruleObject);\n break;\n case 'YEARDAY':\n processYearDay(startDate, endDate, data, ruleObject);\n break;\n }\n}\nfunction processWeekNo(startDate, endDate, data, ruleObject) {\n var stDate = new Date(startDate.getFullYear(), 0, 0);\n var tempDate;\n var expectedCount = ruleObject.count ? ruleObject.count : maxOccurrence;\n var state;\n var startDay;\n var firstWeekSpan;\n var weekNos = ruleObject.weekNo;\n var weekNo;\n var maxDate;\n var minDate;\n while (compareDates(stDate, endDate)) {\n startDay = dayIndex.indexOf(DAYINDEX[stDate.getDay()]);\n firstWeekSpan = (6 - startDay) + 1;\n for (var index = 0; index < weekNos.length; index++) {\n weekNo = weekNos[index];\n weekNo = (weekNo > 0) ? weekNo : 53 + weekNo + 1;\n maxDate = (weekNo === 1) ? firstWeekSpan : firstWeekSpan + ((weekNo - 1) * 7);\n minDate = (weekNo === 1) ? firstWeekSpan - 7 : firstWeekSpan + ((weekNo - 2) * 7);\n while (minDate < maxDate) {\n tempDate = new Date(stDate.getTime() + (MS_PER_DAY * minDate));\n state = validateRules(tempDate, ruleObject);\n if ((tempDate >= startDate) && state && compareDates(tempDate, endDate)) {\n excludeDateHandler(data, tempDate.getTime());\n if (expectedCount && (data.length + tempExcludeDate.length) >= expectedCount) {\n return;\n }\n }\n minDate++;\n }\n }\n stDate = new Date(tempDate.getFullYear() + ruleObject.interval, 0, 0);\n }\n}\nfunction processYearDay(startDate, endDate, data, ruleObject) {\n var stDate = new Date(startDate.getFullYear(), 0, 0);\n var tempDate;\n var expectedCount = ruleObject.count ? ruleObject.count : maxOccurrence;\n var state;\n var date;\n while (compareDates(stDate, endDate)) {\n for (var index = 0; index < ruleObject.yearDay.length; index++) {\n date = ruleObject.yearDay[index];\n tempDate = new Date(stDate.getTime());\n if ((date === LEAPYEAR || date === -LEAPYEAR) && ((tempDate.getFullYear() + 1) % 4 !== 0)) {\n tempDate.setDate(tempDate.getDate() + 1);\n continue;\n }\n tempDate.setDate(tempDate.getDate() + ((date < 0) ? getMaxYearDay(tempDate.getFullYear() + 1) + 1 + date : date));\n state = validateRules(tempDate, ruleObject);\n if ((tempDate >= startDate) && state && compareDates(tempDate, endDate)) {\n excludeDateHandler(data, tempDate.getTime());\n if (expectedCount && (data.length + tempExcludeDate.length) >= expectedCount) {\n return;\n }\n }\n }\n stDate = new Date(tempDate.getFullYear() + ruleObject.interval, 0, 0);\n }\n}\nfunction getMaxYearDay(date) {\n return (date % 4 === 0) ? LEAPYEAR : NORMALYEAR;\n}\nfunction checkYearlyType(ruleObject) {\n if (ruleObject.yearDay.length) {\n return 'YEARDAY';\n }\n else if (ruleObject.weekNo.length) {\n return 'WEEKNO';\n }\n return 'MONTH';\n}\nfunction monthlyDateTypeProcess(startDate, endDate, data, ruleObject) {\n var tempDate = new Date(startDate.getTime());\n var mainDate = new Date(startDate.getTime());\n var expectedCount = ruleObject.count ? ruleObject.count : maxOccurrence;\n var interval = ruleObject.interval;\n var monthInit = 0;\n var date;\n var state;\n tempDate.setDate(1);\n mainDate.setDate(1);\n if (ruleObject.month.length) {\n tempDate.setMonth(ruleObject.month[0] - 1);\n }\n while (compareDates(tempDate, endDate)) {\n for (var index = 0; index < ruleObject.monthDay.length; index++) {\n date = ruleObject.monthDay[index];\n var maxDate = (tempDate.getMonth() === 1) ?\n (tempDate.getFullYear() % 4 === 0 ? 29 : 28) : monthDay[tempDate.getMonth()];\n date = date > 0 ? date : (maxDate + date + 1);\n if ((date > 0) && validateProperDate(tempDate, date, mainDate)) {\n tempDate.setDate(date);\n if (endDate && tempDate > endDate) {\n return;\n }\n state = validateRules(tempDate, ruleObject);\n if ((tempDate >= startDate) && state && compareDates(tempDate, endDate)) {\n excludeDateHandler(data, tempDate.getTime());\n if (expectedCount && (data.length + tempExcludeDate.length) >= expectedCount) {\n return;\n }\n }\n }\n }\n monthInit = setNextValidDate(tempDate, ruleObject, monthInit, interval);\n }\n}\nfunction setNextValidDate(tempDate, ruleObject, monthInit, interval, beginDate) {\n if (beginDate === void 0) { beginDate = null; }\n var monthData = beginDate ? beginDate.getMonth() : 0;\n tempDate.setDate(1);\n if (ruleObject.month.length) {\n monthInit++;\n monthInit = monthInit % ruleObject.month.length;\n tempDate.setMonth(ruleObject.month[monthInit] - 1);\n if (monthInit === 0) {\n tempDate.setFullYear(tempDate.getFullYear() + interval);\n }\n }\n else {\n if (beginDate && (beginDate.getFullYear() < tempDate.getFullYear())) {\n monthData = tempDate.getMonth() - 1;\n }\n tempDate.setMonth((beginDate ?\n monthData :\n tempDate.getMonth()) + interval);\n }\n return monthInit;\n}\nfunction monthlyDayTypeProcess(startDate, endDate, data, ruleObject) {\n var tempDate = new Date(startDate.getTime());\n var expectedDays = ruleObject.day;\n var expectedCount = ruleObject.count ? ruleObject.count : maxOccurrence;\n var dayCycleData = processWeekDays(expectedDays);\n var interval = ruleObject.interval;\n var state;\n var monthCollection = [];\n var weekCollection = [];\n var month;\n var index;\n var beginDate;\n var monthInit = 0;\n tempDate.setDate(1);\n if (ruleObject.month.length) {\n tempDate.setMonth(ruleObject.month[0] - 1);\n }\n tempDate = getStartDateForWeek(tempDate, ruleObject.day);\n while (compareDates(tempDate, endDate)) {\n month = tempDate.getMonth();\n beginDate = new Date(tempDate.getTime());\n if (expectedDays.length > 1) {\n while (tempDate.getMonth() === month) {\n weekCollection.push(tempDate.getTime());\n if (DAYINDEX[tempDate.getDay()] === expectedDays[expectedDays.length - 1]) {\n monthCollection.push(weekCollection);\n weekCollection = [];\n }\n tempDate.setDate(tempDate.getDate()\n + dayCycleData[DAYINDEX[tempDate.getDay()]]);\n }\n }\n else {\n while (tempDate.getMonth() === month) {\n monthCollection.push([tempDate.getTime()]);\n tempDate.setDate(tempDate.getDate()\n + (7));\n }\n }\n index = ((ruleObject.setPosition < 1) ? (monthCollection.length + ruleObject.setPosition) : ruleObject.setPosition - 1);\n if (ruleObject.setPosition === null) {\n index = 0;\n var datas = [];\n for (var week = 0; week < monthCollection.length; week++) {\n for (var row = 0; row < monthCollection[week].length; row++) {\n datas.push(monthCollection[week][row]);\n }\n }\n monthCollection = [datas];\n }\n for (var week = 0; week < monthCollection[index].length; week++) {\n var dayData = monthCollection[index][week];\n var chDate = new Date(dayData);\n state = validateRules(chDate, ruleObject);\n if ((chDate >= startDate) && compareDates(chDate, endDate) && state) {\n excludeDateHandler(data, dayData);\n if (expectedCount && (data.length + tempExcludeDate.length) >= expectedCount) {\n return;\n }\n }\n }\n monthInit = setNextValidDate(tempDate, ruleObject, monthInit, interval, beginDate);\n monthCollection = [];\n weekCollection = [];\n tempDate = getStartDateForWeek(tempDate, ruleObject.day);\n }\n}\nfunction compareDates(startDate, endDate) {\n return endDate ? (startDate <= endDate) : true;\n}\nfunction checkDayIndex(day, expectedDays) {\n return (expectedDays.indexOf(DAYINDEX[day]) === -1);\n}\nfunction getStartDateForWeek(startDate, expectedDays) {\n var tempDate = new Date(startDate.getTime());\n if (expectedDays.indexOf(DAYINDEX[tempDate.getDay()]) === -1) {\n do {\n tempDate.setDate(tempDate.getDate() + 1);\n } while (expectedDays.indexOf(DAYINDEX[tempDate.getDay()]) === -1);\n }\n return tempDate;\n}\nexport function extractObjectFromRule(rules) {\n var ruleObject = {\n freq: null,\n interval: 1,\n count: null,\n until: null,\n day: [],\n month: [],\n weekNo: [],\n monthDay: [],\n yearDay: [],\n setPosition: null,\n validRules: []\n };\n var rulesList = rules.split(';');\n var splitData = [];\n var temp;\n rulesList.forEach(function (data) {\n splitData = data.split('=');\n switch (splitData[0]) {\n case 'UNTIL':\n temp = splitData[1];\n ruleObject.until = getDateFromRecurrenceDateString(temp);\n break;\n case 'BYDAY':\n ruleObject.day = splitData[1].split(',');\n ruleObject.validRules.push(splitData[0]);\n break;\n case 'BYMONTHDAY':\n ruleObject.monthDay = splitData[1].split(',').map(Number);\n ruleObject.validRules.push(splitData[0]);\n break;\n case 'BYMONTH':\n ruleObject.month = splitData[1].split(',').map(Number);\n ruleObject.validRules.push(splitData[0]);\n break;\n case 'BYYEARDAY':\n ruleObject.yearDay = splitData[1].split(',').map(Number);\n ruleObject.validRules.push(splitData[0]);\n break;\n case 'BYWEEKNO':\n ruleObject.weekNo = splitData[1].split(',').map(Number);\n ruleObject.validRules.push(splitData[0]);\n break;\n case 'INTERVAL':\n ruleObject.interval = parseInt(splitData[1], 10);\n break;\n case 'COUNT':\n ruleObject.count = parseInt(splitData[1], 10);\n break;\n case 'BYSETPOS':\n ruleObject.setPosition = parseInt(splitData[1], 10);\n break;\n case 'FREQ':\n ruleObject.freq = splitData[1];\n break;\n }\n });\n if ((ruleObject.freq === 'MONTHLY') && (ruleObject.monthDay.length === 0)) {\n var index = ruleObject.validRules.indexOf('BYDAY');\n ruleObject.validRules.splice(index, 1);\n }\n return ruleObject;\n}\nfunction validateProperDate(tempDate, data, startDate) {\n var maxDate = (tempDate.getMonth() === 1) ? (tempDate.getFullYear() % 4 === 0 ? 29 : 28) : monthDay[tempDate.getMonth()];\n return (data <= maxDate) && (tempDate >= startDate);\n}\nfunction processWeekDays(expectedDays) {\n var dayCycle = {};\n expectedDays.forEach(function (element, index) {\n if (index === expectedDays.length - 1) {\n var startIndex = dayIndex.indexOf(element);\n var temp = startIndex;\n while (temp % 7 !== dayIndex.indexOf(expectedDays[0])) {\n temp++;\n }\n dayCycle[element] = temp - startIndex;\n }\n else {\n dayCycle[element] = dayIndex.indexOf(expectedDays[(index + 1)]) - dayIndex.indexOf(element);\n }\n });\n return dayCycle;\n}\nfunction checkMonth(tempDate, expectedMonth) {\n return (expectedMonth.indexOf(tempDate.getMonth() + 1) === -1);\n}\nfunction checkDate(tempDate, expectedDate) {\n var temp = expectedDate.slice(0);\n var data;\n var maxDate = (tempDate.getMonth() === 1) ?\n (tempDate.getFullYear() % 4 === 0 ? 29 : 28) : monthDay[tempDate.getMonth()];\n data = temp.shift();\n while (data) {\n if (data < 0) {\n data = data + maxDate + 1;\n }\n if (data === tempDate.getDate()) {\n return false;\n }\n data = temp.shift();\n }\n return true;\n}\nfunction checkYear(tempDate, expectedyearDay) {\n var temp = expectedyearDay.slice(0);\n var data;\n var yearDay = getYearDay(tempDate);\n data = temp.shift();\n while (data) {\n if (data < 0) {\n data = data + getMaxYearDay(tempDate.getFullYear()) + 1;\n }\n if (data === yearDay) {\n return false;\n }\n data = temp.shift();\n }\n return true;\n}\nfunction getYearDay(currentDate) {\n if (!startDateCollection[currentDate.getFullYear()]) {\n startDateCollection[currentDate.getFullYear()] = new Date(currentDate.getFullYear(), 0, 0);\n }\n var tempDate = startDateCollection[currentDate.getFullYear()];\n var diff = currentDate.getTime() - tempDate.getTime();\n return Math.ceil(diff / MS_PER_DAY);\n}\nfunction validateMonthlyRuleType(ruleObject) {\n if (ruleObject.monthDay.length && !ruleObject.day.length) {\n return 'date';\n }\n else if (!ruleObject.monthDay.length && ruleObject.day.length) {\n return 'day';\n }\n return 'both';\n}\nfunction rotate(days) {\n var data = days.shift();\n days.push(data);\n}\nfunction setFirstDayOfWeek(day) {\n while (dayIndex[0] !== day) {\n rotate(dayIndex);\n }\n}\nfunction validateRules(tempDate, ruleObject) {\n var state = true;\n var expectedDays = ruleObject.day;\n var expectedMonth = ruleObject.month;\n var expectedDate = ruleObject.monthDay;\n var expectedyearDay = ruleObject.yearDay;\n ruleObject.validRules.forEach(function (rule) {\n switch (rule) {\n case 'BYDAY':\n if (checkDayIndex(tempDate.getDay(), expectedDays)) {\n state = false;\n }\n break;\n case 'BYMONTH':\n if (checkMonth(tempDate, expectedMonth)) {\n state = false;\n }\n break;\n case 'BYMONTHDAY':\n if (checkDate(tempDate, expectedDate)) {\n state = false;\n }\n break;\n case 'BYYEARDAY':\n if (checkYear(tempDate, expectedyearDay)) {\n state = false;\n }\n break;\n }\n });\n return state;\n}\nvar startDateCollection = {};\nvar propertyKeys = {\n FREQ: 'freq',\n BYDAY: 'day',\n BYSETPOS: 'setPos',\n UNTIL: 'until',\n INTERVAL: 'interval',\n COUNT: 'count',\n BYMONTH: 'month',\n BYWEEKNO: 'weekNo',\n BYMONTHDAY: 'monthDay',\n BYYEARDAY: 'yearDay'\n};\nvar tempExcludeDate;\nvar dayIndex = ['SU', 'MO', 'TU', 'WE', 'TH', 'FR', 'SA'];\nvar maxOccurrence;\nvar tempViewDate;\nvar monthDay = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];\nvar DAYINDEX = ['SU', 'MO', 'TU', 'WE', 'TH', 'FR', 'SA'];\nvar MAXOCCURRENCE = 43;\nvar LEAPYEAR = 366;\nvar NORMALYEAR = 365;\nvar WEEKPOS = ['first', 'second', 'third', 'fourth', 'last'];\nvar MONTHDATA = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];\nvar TIMES = 'summaryTimes';\nvar ON = 'summaryOn';\nvar REPEAT = 'summaryRepeat';\nvar EVERY = 'every';\nvar UNTIL = 'summaryUntil';\nvar DAYS = 'summaryDay';\nvar WEEKS = 'summaryWeek';\nvar MONTHS = 'summaryMonth';\nvar YEARS = 'summaryYear';\nvar DAYINDEXOBJECT = {\n SU: 'sun',\n MO: 'mon',\n TU: 'tue',\n WE: 'wed',\n TH: 'thu',\n FR: 'fri',\n SA: 'sat'\n};\nexport function getRecurrenceStringFromDate(date) {\n return [date.getUTCFullYear(),\n roundDateValues(date.getUTCMonth() + 1),\n roundDateValues(date.getUTCDate()),\n 'T',\n roundDateValues(date.getUTCHours()),\n roundDateValues(date.getUTCMinutes()),\n roundDateValues(date.getUTCSeconds()),\n 'Z'].join('');\n}\nfunction roundDateValues(date) {\n return ('0' + date).slice(-2);\n}\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from '@syncfusion/ej2-base';\n/**\n * @param props\n * @param 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}\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 return Item;\n}(ChildProperty));\nexport { Item };\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 * @param {string|Object} options?\n * @param {string} type?\n * @param {boolean} async?\n * @returns defaultType\n */\n function Ajax(options, type, async) {\n /**\n * A boolean value indicating whether the request should be sent asynchronous or not.\n * @default true\n */\n this.mode = 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 }\n /**\n * Send the request to server.\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 promise = new Promise(function (resolve, reject) {\n _this.httpRequest = new XMLHttpRequest();\n _this.httpRequest.onreadystatechange = function () { _this.stateChange(resolve, reject); };\n _this.httpRequest.open(_this.type, _this.url, _this.mode);\n // Set default headers\n if (!isNullOrUndefined(_this.data)) {\n _this.httpRequest.setRequestHeader('Content-Type', _this.contentType || 'application/json; charset=utf-8');\n }\n if (_this.beforeSend) {\n _this.beforeSend();\n }\n _this.httpRequest.send(!isNullOrUndefined(_this.data) ? _this.data : null);\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 if (this.httpRequest.status === 200 || this.httpRequest.status === 304) {\n resolve(this.successHandler(data));\n }\n else {\n reject(new Error(this.failureHandler(this.httpRequest.statusText)));\n }\n }\n };\n /**\n * To get the response header from XMLHttpRequest\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 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 header = responseHeaders[key.toLowerCase()];\n return isNullOrUndefined(header) ? null : header;\n };\n return Ajax;\n}());\nexport { Ajax };\n","import { debounce, extend } from './util';\n/**\n * EventHandler class provides option to add, remove, clear and trigger events to a HTML DOM element\n * @private\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 * @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} debounce - Specifies at what interval given event listener should be triggered.\n * @return {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[i],\n listener: listener,\n debounce: debounceListener\n });\n element.addEventListener(event[i], debounceListener);\n }\n return debounceListener;\n };\n /**\n * Remove an event listener that has been attached before.\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 * @return {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[j] && 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[j], 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 * @param {any} element - Specifies the target html element to clear the events\n * @return {void}\n */\n EventHandler.clearEvents = function (element) {\n var eventData;\n var copyData;\n eventData = EventHandler.addOrGetEventData(element);\n copyData = extend([], copyData, eventData);\n for (var i = 0; i < copyData.length; i++) {\n element.removeEventListener(copyData[i].name, copyData[i].debounce);\n eventData.shift();\n }\n };\n /**\n * Trigger particular event of the element.\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 * @return {void}\n */\n EventHandler.trigger = function (element, eventName, eventProp) {\n var eventData = EventHandler.addOrGetEventData(element);\n var fn = null;\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","import { isNullOrUndefined, getValue } 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 /**\n * To attach handler for given property in current context.\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 * @return {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 }];\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 * @param {string} eventName - specifies the name of the event.\n * @param {Function} handler - Optional argument specifies the handler function to be called while event notified.\n * @return {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 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 else if (handler === curObject[i].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 * @param {string} property - Specifies the event to be notify.\n * @param {Object} args - Additional parameters to pass while calling the handler.\n * @return {void}\n */\n Observer.prototype.notify = function (property, argument) {\n if (this.notExist(property)) {\n return;\n }\n if (argument) {\n argument.name = property;\n }\n var curObject = getValue(property, this.boundedEvents).slice(0);\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 };\n /**\n * To destroy handlers in the event\n */\n Observer.prototype.destroy = function () {\n this.boundedEvents = this.context = undefined;\n };\n /**\n * Returns if the property exists.\n */\n Observer.prototype.notExist = function (prop) {\n return this.boundedEvents.hasOwnProperty(prop) === false;\n };\n /**\n * Returns if the handler is present.\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 { isUndefined, isNullOrUndefined, merge, setImmediate, setValue } from './util';\nimport { addClass, removeClass } from './dom';\nimport { Observer } from './observer';\n/* tslint:enable:no-any */\n/**\n * Base library module is common module for Framework modules like touch,keyboard and etc.,\n * @private\n */\nvar Base = /** @class */ (function () {\n /**\n * Base constructor accept options and element\n */\n function Base(options, element) {\n this.isProtectedOnChange = true;\n this.properties = {};\n this.changedProperties = {};\n this.oldProperties = {};\n this.refreshing = false;\n // tslint:disable-next-line:no-empty\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 * @private\n * @param {Object} prop - JSON object which holds components properties.\n * @param {boolean} muteOnChange? - Specifies to true when we set properties.\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 this.finalUpdate();\n this.changedProperties = {};\n this.oldProperties = {};\n this.isProtectedOnChange = prevDetection;\n };\n ;\n /**\n * Calls for child element data bind\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 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 ;\n Base.prototype.saveChanges = function (key, newValue, oldValue) {\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 ;\n /** Event Base Section */\n /**\n * Adds the handler to the given event listener.\n * @param {string} eventName - A String that specifies the name of the event\n * @param {Function} listener - Specifies the call to run when the event occurs.\n * @return {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 * @param {string} eventName - A String that specifies the name of the event to remove\n * @param {Function} listener - Specifies the function to remove\n * @return {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 * @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 * @return {void}\n */\n Base.prototype.trigger = function (eventName, eventProp) {\n if (this.isDestroyed !== true) {\n var prevDetection = this.isProtectedOnChange;\n this.isProtectedOnChange = false;\n this.modelObserver.notify(eventName, eventProp);\n this.isProtectedOnChange = prevDetection;\n }\n };\n /**\n * To maintain instance in base class\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-control', 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 Base.prototype.destroy = function () {\n var _this = this;\n this.element.ej2_instances =\n this.element.ej2_instances.filter(function (i) { return i !== _this; });\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-control']);\n }\n this.clearChanges();\n this.modelObserver.destroy();\n this.isDestroyed = true;\n };\n return Base;\n}());\nexport { Base };\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 * @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 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 * @param {string} event - type of event triggered.\n * @returns {Boolean}\n */\n Browser.getEvent = function (event) {\n // tslint:disable-next-line:no-any\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 };\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 * @returns {string}\n */\n Browser.getTouchStartEvent = function () {\n return Browser.getEvent('start');\n };\n /**\n * To get the Touch end event from browser\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 * @returns {string}\n */\n Browser.getTouchMoveEvent = function () {\n return Browser.getEvent('move');\n };\n /**\n * To get the value based on provided key and regX\n * @param {string} key\n * @param {RegExp} regX\n * @returns {Object}\n */\n Browser.getValue = function (key, regX) {\n var browserDetails = window.browserDetails;\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 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 * @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 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 get: function () {\n if (isUndefined(window.browserDetails.isTouch)) {\n return window.browserDetails.isTouch = ('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 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 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 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 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 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 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 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 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 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 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 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 /* istanbul ignore next */\n Browser.uA = typeof navigator !== 'undefined' ? navigator.userAgent : '';\n return Browser;\n}());\nexport { Browser };\n","import { defaultCurrencyCode } from '../internationalization';\nimport { getValue, isNullOrUndefined, extend } from '../util';\nimport { ParserBase as parser } from './parser-base';\nimport { DateFormat } from './date-formatter';\nimport { NumberFormat } from './number-formatter';\n/**\n * Date base common constants and function for date parser and formatter.\n */\nexport var IntlBase;\n(function (IntlBase) {\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#]*)?)|([#,]*@+#*))(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.formatRegex = /(^[ncpae]{1})([0-1]?[0-9]|20)?$/i;\n IntlBase.currencyFormatRegex = /(^[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 },\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 /* 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 * @private\n * @param {string} skeleton\n * @param {Object} dateObject\n * @param {string} type\n * @returns {string}\n */\n function getResultantPattern(skeleton, dateObject, type) {\n var resPattern;\n var iType = type || 'date';\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 return resPattern;\n }\n IntlBase.getResultantPattern = getResultantPattern;\n /**\n * Returns the dependable object for provided cldr data and culture\n * @private\n * @param {Object} cldr\n * @param {string} culture\n * @param {boolean} isNumber\n * @returns {Dependables}\n */\n function getDependables(cldr, culture, isNumber) {\n var ret = {};\n ret.parserObject = parser.getMainObject(cldr, culture) || IntlBase.defaultObject;\n if (isNumber) {\n ret.numericObject = getValue('numbers', ret.parserObject);\n }\n else {\n ret.dateObject = getValue('dates.calendars.gregorian', ret.parserObject);\n }\n return ret;\n }\n IntlBase.getDependables = getDependables;\n /**\n * Returns the symbol pattern for provided parameters\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 * Returns proper numeric skeleton\n * @private\n * @param {string} skeleton\n * @returns {NumericSkeleton}\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 /* tslint:disable no-any */\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 * @private\n * @param {string} pattern\n * @param {boolean} needFraction\n * @param {string} cSymbol\n * @param {boolean} fractionOnly\n * @returns {NegativeData}\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 * @private\n * @param {string} val\n * @param {string} sym\n * @returns {string}\n */\n function changeCurrencySymbol(val, sym) {\n if (val) {\n return val.replace(IntlBase.defaultCurrency, sym);\n }\n return '';\n }\n /**\n * Returns currency symbol based on currency code\n * @private\n * @param {Object} numericObject\n * @param {string} currencyCode\n * @returns {string}\n */\n function getCurrencySymbol(numericObject, currencyCode) {\n return getValue('currencies.' + currencyCode + '.symbol', numericObject) || '$';\n }\n IntlBase.getCurrencySymbol = getCurrencySymbol;\n /**\n * Returns formatting options for custom number format\n * @private\n * @param {string} format\n * @param {CommonOptions} dOptions\n * @param {Dependables} obj\n * @returns {GenericFormatOptions}\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 * @private\n * @param {string} format\n * @param {CommonOptions} dOptions\n * @param {Object} numObject\n * @returns {NegativeData}\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 }\n cOptions.nlead = pattern[1];\n cOptions.nend = pattern[10];\n var integerPart = pattern[6];\n cOptions.useGrouping = integerPart.indexOf(',') !== -1;\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 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 = dOptions.numberMapper.numberSymbols[mapper[2]];\n cOptions.groupData = NumberFormat.getGroupingDetails(symbolPattern.split(';')[0]);\n }\n cOptions.nlead = cOptions.nlead.replace(/\\'/g, '');\n cOptions.nend = cOptions.nend.replace(/\\'/g, '');\n }\n return cOptions;\n }\n /**\n * Returns formatting options for currency or percent type\n * @private\n * @param {string[]} parts\n * @param {string} actual\n * @param {string} symbol\n * @returns {NegativeData}\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[i];\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 * @private\n * @param {Object} dateObj\n * @returns {string}\n */\n function getDateSeparator(dateObj) {\n var value = (getValue('dateFormats.short', dateObj) || '').match(/[dM]([^dM])[dM]/i);\n return value ? value[1] : '/';\n }\n IntlBase.getDateSeparator = getDateSeparator;\n /**\n * Returns Native Date Time pattern\n * @private\n * @param {string} culture\n * @param {DateFormatOptions} options\n * @param {Object} cldr\n * @returns {string}\n */\n function getActualDateTimeFormat(culture, options, cldr, isExcelFormat) {\n var dependable = getDependables(cldr, culture);\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 * Returns Native Number pattern\n * @private\n * @param {string} culture\n * @param {NumberFormatOptions} options\n * @param {Object} cldr\n * @returns {string}\n */\n function getActualNumberFormat(culture, options, cldr) {\n var dependable = getDependables(cldr, culture, true);\n var parseOptions = { custom: true };\n var minFrac;\n var curObj = {};\n var curMatch = (options.format || '').match(IntlBase.currencyFormatRegex);\n if (curMatch) {\n var dOptions = {};\n dOptions.numberMapper = parser.getNumberMapper(dependable.parserObject, parser.getNumberingSystem(cldr), true);\n var curCode = getCurrencySymbol(dependable.numericObject, options.currency || defaultCurrencyCode);\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 = (split.length > 1);\n curObj.nData = getFormatData(split[1] || '-' + split[0], true, curCode);\n curObj.pData = 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') {\n var cPattern = actualPattern;\n actualPattern = curObj.pData.nlead + cPattern + curObj.pData.nend;\n if (curObj.hasNegativePattern) {\n actualPattern += ';' + curObj.nData.nlead + cPattern + curObj.nData.nend;\n }\n }\n if (parseOptions.type === 'percent') {\n actualPattern += ' %';\n }\n }\n else {\n actualPattern = options.format.replace(/\\'/g, '\"');\n }\n return actualPattern;\n }\n IntlBase.getActualNumberFormat = getActualNumberFormat;\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 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 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[x] + pattern;\n }\n pattern = pattern.slice(1);\n return temp[1] ? (pattern + '.' + temp[1]) : pattern;\n }\n})(IntlBase || (IntlBase = {}));\n","/**\n * To import utils\n */\nimport { isNullOrUndefined } from './util';\n/**\n * @private\n */\nvar CanvasRenderer = /** @class */ (function () {\n /* End-Properties */\n function CanvasRenderer(rootID) {\n this.rootId = rootID;\n }\n // method to get the attributes value\n /* tslint:disable */\n CanvasRenderer.prototype.getOptionValue = function (options, key) {\n return options[key];\n };\n /* tslint:enable */\n /**\n * To create a Html5 canvas element\n * @param {BaseAttibutes} options - Options to create canvas\n * @return {HTMLCanvasElement}\n */\n CanvasRenderer.prototype.createCanvas = function (options) {\n var canvasObj = document.createElement('canvas');\n canvasObj.setAttribute('id', this.rootId + '_canvas');\n this.ctx = canvasObj.getContext('2d');\n this.canvasObj = canvasObj;\n this.setCanvasSize(options.width, options.height);\n return this.canvasObj;\n };\n /**\n * To set the width and height for the Html5 canvas element\n * @param {number} width - width of the canvas\n * @param {number} height - height of the canvas\n * @return {void}\n */\n CanvasRenderer.prototype.setCanvasSize = function (width, height) {\n var element = document.getElementById(this.rootId);\n var size = !isNullOrUndefined(element) ? element.getBoundingClientRect() : null;\n if (isNullOrUndefined(this.width)) {\n this.canvasObj.setAttribute('width', width ? width.toString() : size.width.toString());\n }\n else {\n this.canvasObj.setAttribute('width', this.width.toString());\n }\n if (isNullOrUndefined(this.height)) {\n this.canvasObj.setAttribute('height', height ? height.toString() : '450');\n }\n else {\n this.canvasObj.setAttribute('height', this.height.toString());\n }\n };\n // To set the values to the attributes\n CanvasRenderer.prototype.setAttributes = function (options) {\n this.ctx.lineWidth = this.getOptionValue(options, 'stroke-width');\n var dashArray = this.getOptionValue(options, 'stroke-dasharray');\n if (!isNullOrUndefined(dashArray)) {\n var dashArrayString = dashArray.split(',');\n this.ctx.setLineDash([parseInt(dashArrayString[0], 10), parseInt(dashArrayString[1], 10)]);\n }\n this.ctx.strokeStyle = this.getOptionValue(options, 'stroke');\n };\n /**\n * To draw a line\n * @param {LineAttributes} options - required options to draw a line on the canvas\n * @return {void}\n */\n CanvasRenderer.prototype.drawLine = function (options) {\n this.ctx.save();\n this.ctx.beginPath();\n this.ctx.lineWidth = this.getOptionValue(options, 'stroke-width');\n this.ctx.strokeStyle = options.stroke;\n this.ctx.moveTo(options.x1, options.y1);\n this.ctx.lineTo(options.x2, options.y2);\n this.ctx.stroke();\n this.ctx.restore();\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To draw a rectangle\n * @param {RectAttributes} options - required options to draw a rectangle on the canvas\n * @return {void}\n */\n CanvasRenderer.prototype.drawRectangle = function (options) {\n var canvasCtx = this.ctx;\n var cornerRadius = options.rx;\n this.ctx.save();\n this.ctx.beginPath();\n this.ctx.globalAlpha = this.getOptionValue(options, 'opacity');\n this.setAttributes(options);\n this.ctx.rect(options.x, options.y, options.width, options.height);\n if (cornerRadius !== null && cornerRadius >= 0) {\n this.drawCornerRadius(options);\n }\n else {\n if (options.fill === 'none') {\n options.fill = 'transparent';\n }\n this.ctx.fillStyle = options.fill;\n this.ctx.fillRect(options.x, options.y, options.width, options.height);\n this.ctx.stroke();\n }\n this.ctx.restore();\n this.ctx = canvasCtx;\n this.dataUrl = this.canvasObj.toDataURL();\n };\n // To draw the corner of a rectangle\n CanvasRenderer.prototype.drawCornerRadius = function (options) {\n var cornerRadius = options.rx;\n var x = options.x;\n var y = options.y;\n var width = options.width;\n var height = options.height;\n if (options.fill === 'none') {\n options.fill = 'transparent';\n }\n this.ctx.fillStyle = options.fill;\n if (width < 2 * cornerRadius) {\n cornerRadius = width / 2;\n }\n if (height < 2 * cornerRadius) {\n cornerRadius = height / 2;\n }\n this.ctx.beginPath();\n this.ctx.moveTo(x + width - cornerRadius, y);\n this.ctx.arcTo(x + width, y, x + width, y + height, cornerRadius);\n this.ctx.arcTo(x + width, y + height, x, y + height, cornerRadius);\n this.ctx.arcTo(x, y + height, x, y, cornerRadius);\n this.ctx.arcTo(x, y, x + width, y, cornerRadius);\n this.ctx.closePath();\n this.ctx.fill();\n this.ctx.stroke();\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To draw a path on the canvas\n * @param {PathAttributes} options - options needed to draw path\n * @param {Int32Array} canvasTranslate - Array of numbers to translate the canvas\n * @return {void}\n */\n CanvasRenderer.prototype.drawPath = function (options, canvasTranslate) {\n var path = options.d;\n var dataSplit = path.split(' ');\n var borderWidth = this.getOptionValue(options, 'stroke-width');\n var canvasCtx = this.ctx;\n var flag = true;\n this.ctx.save();\n this.ctx.beginPath();\n if (canvasTranslate) {\n this.ctx.translate(canvasTranslate[0], canvasTranslate[1]);\n }\n this.ctx.globalAlpha = options.opacity ? options.opacity : this.getOptionValue(options, 'fill-opacity');\n this.setAttributes(options);\n for (var i = 0; i < dataSplit.length; i = i + 3) {\n var x1 = parseFloat(dataSplit[i + 1]);\n var y1 = parseFloat(dataSplit[i + 2]);\n switch (dataSplit[i]) {\n case 'M':\n if (!options.innerR && !options.cx) {\n this.ctx.moveTo(x1, y1);\n }\n break;\n case 'L':\n if (!options.innerR) {\n this.ctx.lineTo(x1, y1);\n }\n break;\n case 'C':\n var c1 = parseFloat(dataSplit[i + 3]);\n var c2 = parseFloat(dataSplit[i + 4]);\n var c3 = parseFloat(dataSplit[i + 5]);\n var c4 = parseFloat(dataSplit[i + 6]);\n this.ctx.bezierCurveTo(x1, y1, c1, c2, c3, c4);\n i = i + 4;\n break;\n case 'A':\n if (!options.innerR) {\n if (options.cx) {\n this.ctx.arc(options.cx, options.cy, options.radius, 0, 2 * Math.PI, options.counterClockWise);\n }\n else {\n this.ctx.moveTo(options.x, options.y);\n this.ctx.arc(options.x, options.y, options.radius, options.start, options.end, options.counterClockWise);\n this.ctx.lineTo(options.x, options.y);\n }\n }\n else if (flag) {\n this.ctx.arc(options.x, options.y, options.radius, options.start, options.end, options.counterClockWise);\n this.ctx.arc(options.x, options.y, options.innerR, options.end, options.start, !options.counterClockWise);\n flag = false;\n }\n i = i + 5;\n break;\n case 'z':\n this.ctx.closePath();\n break;\n }\n }\n if (options.fill !== 'none' && options.fill !== undefined) {\n this.ctx.fillStyle = options.fill;\n this.ctx.fill();\n }\n if (borderWidth > 0) {\n this.ctx.stroke();\n }\n this.ctx.restore();\n this.ctx = canvasCtx;\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To draw a text\n * @param {TextAttributes} options - options required to draw text\n * @param {string} label - Specifies the text which has to be drawn on the canvas\n * @return {void}\n */\n CanvasRenderer.prototype.drawText = function (options, label) {\n var fontWeight = this.getOptionValue(options, 'font-weight');\n if (!isNullOrUndefined(fontWeight) && fontWeight.toLowerCase() === 'regular') {\n fontWeight = 'normal';\n }\n var fontSize = this.getOptionValue(options, 'font-size');\n var fontFamily = this.getOptionValue(options, 'font-family');\n var fontStyle = this.getOptionValue(options, 'font-style').toLowerCase();\n var font = (fontStyle + ' ' + fontWeight + ' ' + fontSize + ' ' + fontFamily);\n var anchor = this.getOptionValue(options, 'text-anchor');\n var opacity = options.opacity !== undefined ? options.opacity : 1;\n if (anchor === 'middle') {\n anchor = 'center';\n }\n this.ctx.save();\n this.ctx.fillStyle = options.fill;\n this.ctx.font = font;\n this.ctx.textAlign = anchor;\n this.ctx.globalAlpha = opacity;\n if (options.baseline) {\n this.ctx.textBaseline = options.baseline;\n }\n var txtlngth = 0;\n this.ctx.translate(options.x + (txtlngth / 2), options.y);\n this.ctx.rotate(options.labelRotation * Math.PI / 180);\n this.ctx.fillText(label, 0, 0);\n this.ctx.restore();\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To draw circle on the canvas\n * @param {CircleAttributes} options - required options to draw the circle\n * @return {void}\n */\n CanvasRenderer.prototype.drawCircle = function (options) {\n var canvasCtx = this.ctx;\n this.ctx.save();\n this.ctx.beginPath();\n this.ctx.arc(options.cx, options.cy, options.r, 0, 2 * Math.PI);\n this.ctx.fillStyle = options.fill;\n this.ctx.globalAlpha = options.opacity;\n this.ctx.fill();\n this.setAttributes(options);\n this.ctx.stroke();\n this.ctx.restore();\n this.ctx = canvasCtx;\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To draw polyline\n * @param {PolylineAttributes} options - options needed to draw polyline\n * @return {void}\n */\n CanvasRenderer.prototype.drawPolyline = function (options) {\n this.ctx.save();\n this.ctx.beginPath();\n var points = options.points.split(' ');\n for (var i = 0; i < points.length - 1; i++) {\n var point = points[i].split(',');\n var x = parseFloat(point[0]);\n var y = parseFloat(point[1]);\n if (i === 0) {\n this.ctx.moveTo(x, y);\n }\n else {\n this.ctx.lineTo(x, y);\n }\n }\n this.ctx.lineWidth = this.getOptionValue(options, 'stroke-width');\n this.ctx.strokeStyle = options.stroke;\n this.ctx.stroke();\n this.ctx.restore();\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To draw an ellipse on the canvas\n * @param {EllipseAttributes} options - options needed to draw ellipse\n * @return {void}\n */\n CanvasRenderer.prototype.drawEllipse = function (options) {\n var canvasCtx = this.ctx;\n var circumference = Math.max(options.rx, options.ry);\n var scaleX = options.rx / circumference;\n var scaleY = options.ry / circumference;\n this.ctx.save();\n this.ctx.beginPath();\n this.ctx.translate(options.cx, options.cy);\n this.ctx.save();\n this.ctx.scale(scaleX, scaleY);\n this.ctx.arc(0, 0, circumference, 0, 2 * Math.PI, false);\n this.ctx.fillStyle = options.fill;\n this.ctx.fill();\n this.ctx.restore();\n this.ctx.lineWidth = this.getOptionValue(options, 'stroke-width');\n this.ctx.strokeStyle = options.stroke;\n this.ctx.stroke();\n this.ctx.restore();\n this.ctx = canvasCtx;\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To draw an image\n * @param {ImageAttributes} options - options required to draw an image on the canvas\n * @return {void}\n */\n CanvasRenderer.prototype.drawImage = function (options) {\n this.ctx.save();\n var imageObj = new Image();\n if (!isNullOrUndefined(options.href)) {\n imageObj.src = options.href;\n this.ctx.drawImage(imageObj, options.x, options.y, options.width, options.height);\n }\n this.ctx.restore();\n this.dataUrl = this.canvasObj.toDataURL();\n };\n /**\n * To create a linear gradient\n * @param {string[]} colors - Specifies the colors required to create linear gradient\n * @return {string}\n */\n CanvasRenderer.prototype.createLinearGradient = function (colors) {\n var myGradient;\n if (!isNullOrUndefined(colors[0].colorStop)) {\n myGradient = this.ctx.createLinearGradient(0, 0, 0, this.canvasObj.height);\n }\n var color = this.setGradientValues(colors, myGradient);\n return color;\n };\n /**\n * To create a radial gradient\n * @param {string[]} colors - Specifies the colors required to create linear gradient\n * @return {string}\n */\n CanvasRenderer.prototype.createRadialGradient = function (colors) {\n var myGradient;\n if (!isNullOrUndefined(colors[0].colorStop)) {\n myGradient = this.ctx.createRadialGradient(0, 0, 0, 0, 0, this.canvasObj.height);\n }\n var colorName = this.setGradientValues(colors, myGradient);\n return colorName;\n };\n // To set the gradient values\n CanvasRenderer.prototype.setGradientValues = function (colors, myGradient) {\n var colorName;\n if (!isNullOrUndefined(colors[0].colorStop)) {\n for (var i = 0; i <= colors.length - 1; i++) {\n var color = colors[i].color;\n var newColorStop = (colors[i].colorStop).slice(0, -1);\n var stopColor = parseInt(newColorStop, 10) / 100;\n myGradient.addColorStop(stopColor, color);\n }\n colorName = myGradient.toString();\n }\n else {\n colorName = colors[0].color.toString();\n }\n this.dataUrl = this.canvasObj.toDataURL();\n return colorName;\n };\n /**\n * To set the attributes to the element\n * @param {SVGCanvasAttributes} options - Attributes to set for the element\n * @param {HTMLElement} element - The element to which the attributes need to be set\n * @return {HTMLElement}\n */\n CanvasRenderer.prototype.setElementAttributes = function (options, element) {\n var keys = Object.keys(options);\n var values = Object.keys(options).map(function (key) { return options[key]; });\n for (var i = 0; i < keys.length; i++) {\n element.setAttribute(keys[i], values[i]);\n }\n return element;\n };\n /**\n * To update the values of the canvas element attributes\n * @param {SVGCanvasAttributes} options - Specifies the colors required to create gradient\n * @return {void}\n */\n CanvasRenderer.prototype.updateCanvasAttributes = function (options) {\n this.setElementAttributes(options, this.canvasObj);\n var ctx = this.ctx;\n if (!isNullOrUndefined(this.dataUrl)) {\n var img_1 = new Image;\n img_1.onload = function () {\n ctx.drawImage(img_1, 0, 0);\n };\n img_1.src = this.dataUrl;\n }\n };\n return CanvasRenderer;\n}());\nexport { CanvasRenderer };\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 /**\n * Inject required modules in component library\n * @return {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[i];\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.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 * @return {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 * Removes all unused modules\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 * @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 * @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 } from './util';\nimport { Base } from './base';\n/**\n * To detect the changes for inner properties.\n * @private\n */\nvar ChildProperty = /** @class */ (function () {\n function ChildProperty(parent, propName, defaultValue, isArray) {\n this.properties = {};\n this.changedProperties = {};\n this.childChangedProperties = {};\n this.oldProperties = {};\n // tslint:disable-next-line:no-empty\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.setProperties(defaultValue, true);\n this.isParentArray = isArray;\n }\n /**\n * Updates the property changes\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 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 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 * @param {Object} prop\n * @param {boolean} muteOnChange\n * {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 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 * @param {string} key\n * @param {Object} newValue\n * @param {Object} oldValue\n * @returns {void}\n */\n ChildProperty.prototype.saveChanges = function (key, newValue, oldValue) {\n if (this.controlParent.isProtectedOnChange) {\n return;\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 return ChildProperty;\n}());\nexport { ChildProperty };\n","/**\n * Parser\n */\nvar defaultNumberingSystem = {\n 'latn': {\n '_digits': '0123456789',\n '_type': 'numeric'\n }\n};\nimport { isUndefined, getValue } from '../util';\nvar latnRegex = /^[0-9]*$/;\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 * @private\n */\nvar ParserBase = /** @class */ (function () {\n function ParserBase() {\n }\n /**\n * Returns the cldr object for the culture specifies\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 return getValue('main.' + cName, obj);\n };\n /**\n * Returns the numbering system object from given cldr data.\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 * @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 /* tslint:disable no-any */\n if (!res.hasOwnProperty(prop[key])) {\n res[prop[key]] = key;\n }\n }\n return res;\n };\n /**\n * Returns the symbol regex by skipping the escape sequence.\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 return new RegExp(regexStr, 'g');\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 ret[prop[key]] = defaultNumberSymbols[key];\n }\n return ret;\n };\n /**\n * Returns regex string for provided value\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[i] + '|';\n }\n else {\n ret += val[i];\n }\n }\n return ret;\n };\n /**\n * Returns the replaced value of matching regex and obj mapper.\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 return obj[str];\n });\n };\n /**\n * Returns default numbering system object for formatting from cldr data\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 ParserBase.getCurrentNumericOptions = function (curObj, numberSystem, needSymbols) {\n var ret = {};\n var cur = this.getDefaultNumberingSystem(curObj);\n if (!isUndefined(cur.nSystem)) {\n var digits = getValue(cur.nSystem + '._digits', numberSystem);\n if (!isUndefined(digits)) {\n ret.numericPair = this.reverseObject(digits, latnNumberSystem);\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('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 * @param {Object} curObj\n * @param {Object} numberSystem\n * @param {boolean} isNumber\n * @returns {NumberMapper}\n */\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 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","import { isUndefined, throwError, isNullOrUndefined, extend } 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 integerError = 'minimumIntegerDigits';\nvar percentSign = 'percentSign';\nvar minusSign = 'minusSign';\nvar spaceRegex = /\\s/;\nvar mapper = ['infinity', 'nan', 'group', 'decimal', 'exponential'];\nvar infinity = 'infinity';\nvar nan = 'nan';\n/**\n * Module for number formatting.\n * @private\n */\nvar NumberFormat = /** @class */ (function () {\n function NumberFormat() {\n }\n /**\n * Returns the formatter function for given skeleton.\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} object- Specifies the global cldr data collection.\n * @return 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 dOptions.numberMapper = parser.getNumberMapper(dependable.parserObject, parser.getNumberingSystem(cldr), true);\n dOptions.currencySymbol = base.getCurrencySymbol(dependable.numericObject, fOptions.currency || defaultCurrencyCode);\n /* tslint:disable no-any */\n dOptions.percentSymbol = dOptions.numberMapper.numberSymbols[percentSign];\n dOptions.minusSymbol = 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 symbolPattern = base.getSymbolPattern(fOptions.type, dOptions.numberMapper.numberSystem, dependable.numericObject, fOptions.isAccount);\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) {\n symbolPattern = symbolPattern.replace(/\\u00A4/g, base.defaultCurrency);\n }\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 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);\n };\n };\n /**\n * Returns grouping details for the pattern provided\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 * @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 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 * @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 * @param {number} value\n * @param {base.GenericFormatOptions} fOptions\n * @param {CommonOptions} dOptions\n * @returns {string}\n */\n NumberFormat.intNumberFormatter = function (value, fOptions, dOptions) {\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);\n if (curData.minimumIntegerDigits) {\n fValue = this.processMinimumIntegers(fValue, curData.minimumIntegerDigits);\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 if (curData.useGrouping) {\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 return curData.nlead + fValue + curData.nend;\n }\n }\n };\n /**\n * Returns significant digits processed numeric string\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 * @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 * @param {number} value\n * @param {number} min\n * @param {number} max\n * @returns {string}\n */\n NumberFormat.processFraction = function (value, min, max) {\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 return value + '';\n };\n /**\n * Returns integer processed numeric string\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 return NumberFormat;\n}());\nexport { NumberFormat };\n","import { ParserBase as parser } from './parser-base';\nimport { IntlBase as base } from './intl-base';\nimport { isUndefined, throwError, getValue } from '../util';\nvar abbreviateRegexGlobal = /\\/MMMMM|MMMM|MMM|a|LLL|EEEEE|EEEE|E|K|ccc|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};\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};\nvar timeSeparator = 'timeSeparator';\n/**\n * Date Format is a framework provides support for date formatting.\n * @private\n */\nvar DateFormat = /** @class */ (function () {\n function DateFormat() {\n }\n /**\n * Returns the formatter function for given skeleton.\n * @param {string} - Specifies the culture name to be which formatting.\n * @param {DateFormatOptions} - Specific the format in which date will format.\n * @param {cldr} - Specifies the global cldr data collection.\n * @return Function.\n */\n DateFormat.dateFormat = function (culture, option, cldr) {\n var _this = this;\n var dependable = base.getDependables(cldr, culture);\n var formatOptions = {};\n var resPattern = option.format || base.getResultantPattern(option.skeleton, dependable.dateObject, option.type);\n formatOptions.dateSeperator = base.getDateSeparator(dependable.dateObject);\n if (isUndefined(resPattern)) {\n throwError('Format options or type given must be invalid');\n }\n else {\n formatOptions.pattern = resPattern;\n formatOptions.numMapper = 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 /* tslint:disable no-any */\n var charKey = datePartMatcher[char];\n switch (char) {\n case 'E':\n case 'c':\n formatOptions.weekday = dependable.dateObject[base.days][standalone][base.monthIndex[len]];\n break;\n case 'M':\n case 'L':\n formatOptions.month = dependable.dateObject[base.month][standalone][base.monthIndex[len]];\n break;\n case 'a':\n formatOptions.designator = getValue('dayPeriods.format.wide', dependable.dateObject);\n break;\n case 'G':\n var eText = (len <= 3) ? 'eraAbbr' : (len === 4) ? 'eraNames' : 'eraNarrow';\n formatOptions.era = 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 * @param {Date} value\n * @param {FormatOptions} options\n */\n DateFormat.intDateFormatter = function (value, options) {\n var pattern = options.pattern;\n var ret = '';\n var matches = pattern.match(base.dateParseRegex);\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 isNumber = void 0;\n var processNumber = void 0;\n var curstr = '';\n switch (char) {\n case 'M':\n case 'L':\n curval = value.getMonth() + 1;\n if (length_1 > 2) {\n ret += options.month[curval];\n }\n else {\n isNumber = true;\n }\n break;\n case 'E':\n case 'c':\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 isNumber = true;\n curval = value[timeSetter[char]]();\n if (char === 'h') {\n curval = curval % 12 || 12;\n }\n break;\n case 'y':\n processNumber = true;\n curstr += value.getFullYear();\n if (length_1 === 2) {\n curstr = curstr.substr(curstr.length - 2);\n }\n break;\n case 'a':\n var desig = value.getHours() < 12 ? 'am' : 'pm';\n ret += options.designator[desig];\n break;\n case 'G':\n var dec = value.getFullYear() < 0 ? 0 : 1;\n ret += options.era[dec];\n break;\n case '\\'':\n ret += (match === '\\'\\'') ? '\\'' : match.replace(/\\'/g, '');\n break;\n case 'z':\n var timezone = value.getTimezoneOffset();\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 ret += options.numMapper.numberSymbols[timeSeparator];\n /* tslint:enable no-any */\n break;\n case '/':\n ret += options.dateSeperator;\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 /**\n * Returns two digit numbers for given value and length\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 * @param {number} tVal\n * @param {string} pattern\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","var __extends = (this && this.__extends) || (function () {\n var 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 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 } 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';\nvar componentCount = 0;\nvar lastPageID;\nvar lastHistoryLen = 0;\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 function Component(options, selector) {\n var _this = _super.call(this, options, selector) || this;\n _this.randomId = uniqueID();\n _this.needsID = 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 _this.detectFunction = new Function('args', 'var prop = Object.keys(args); if(prop.length){this[prop[0]] = args[prop[0]];}');\n onIntlChange.on('notifyExternalChange', _this.detectFunction, _this, _this.randomId);\n if (!isUndefined(selector)) {\n _this.appendTo();\n }\n return _this;\n }\n Component.prototype.requiredModules = function () {\n return [];\n };\n ;\n /**\n * Destroys the sub modules while destroying the widget\n */\n Component.prototype.destroy = function () {\n if (this.isDestroyed) {\n return;\n }\n if (this.enablePersistence) {\n this.setPersistData();\n }\n this.localObserver.destroy();\n if (this.refreshing) {\n return;\n }\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 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 /**\n * Appends the control within the given HTML element\n * @param {string | HTMLElement} selector - Target element where control needs to be appended\n */\n Component.prototype.appendTo = function (selector) {\n if (!isNullOrUndefined(selector) && typeof (selector) === 'string') {\n this.element = document.querySelector(selector);\n }\n else if (!isNullOrUndefined(selector)) {\n this.element = selector;\n }\n if (!isNullOrUndefined(this.element)) {\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 window.addEventListener('unload', this.setPersistData.bind(this));\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 this.render();\n this.trigger('created');\n }\n };\n /**\n * When invoked, applies the pending property changes immediately to the component.\n */\n Component.prototype.dataBind = function () {\n this.injectModules();\n _super.prototype.dataBind.call(this);\n };\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 * @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 * @return {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 * @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 * @return {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 * @param {string} property - Specifies the event to be notify.\n * @param {Object} argument - Additional parameters to pass while calling the handler.\n * @return {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 * @private\n */\n Component.prototype.getInjectedModules = function () {\n return this.injectedModules;\n };\n ;\n /**\n * Dynamically injects the required modules to the component.\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[i]) === -1) {\n this.prototype.injectedModules.push(moduleList[i]);\n }\n }\n };\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.mergePersistData = function () {\n var data = window.localStorage.getItem(this.getModuleName() + this.element.id);\n if (!(isNullOrUndefined(data) || (data === ''))) {\n this.setProperties(JSON.parse(data), true);\n }\n };\n Component.prototype.setPersistData = function () {\n if (!this.isDestroyed) {\n window.localStorage.setItem(this.getModuleName() + this.element.id, this.getPersistData());\n }\n };\n Component.prototype.clearTemplate = function (templateName) {\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 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 // tslint:disable-next-line:no-any\n var value = obj[key];\n if (typeof value === 'object' && !(value instanceof Array)) {\n var newList = ignoreList.filter(function (str) {\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","import { IntlBase as base } from './intl-base';\nimport { ParserBase as parser } from './parser-base';\nimport { isUndefined, throwError, getValue, isNullOrUndefined } from '../util';\nimport { datePartMatcher } from './date-formatter';\nvar number = 'numbers';\nvar defNoSystem = 'defaultNumberingSystem';\nvar noSystem = 'numberingSystem';\nvar standalone = 'stand-alone';\nvar curWeekDay = 'curWeekDay';\nvar latnRegex = /^[0-9]*$/;\nvar abbreviateRegex = /\\/MMMMM|MMMM|MMM|a|LLL|EEEEE|EEEE|E|ccc/;\nvar timeSetter = {\n minute: 'setMinutes',\n hour: 'setHours',\n second: 'setSeconds',\n day: 'setDate',\n month: 'setMonth'\n};\nvar month = 'months';\n/* tslint:disable no-any */\n/**\n * Date Parser.\n * @private\n */\nvar DateParser = /** @class */ (function () {\n function DateParser() {\n }\n /**\n * Returns the parser function for given skeleton.\n * @param {string} - Specifies the culture name to be which formatting.\n * @param {DateFormatOptions} - Specific the format in which string date will be parsed.\n * @param {cldr} - Specifies the global cldr data collection.\n * @return Function.\n */\n // tslint:disable-next-line:max-func-body-length\n DateParser.dateParser = function (culture, option, cldr) {\n var _this = this;\n var dependable = base.getDependables(cldr, culture);\n var numOptions = parser.getCurrentNumericOptions(dependable.parserObject, parser.getNumberingSystem(cldr));\n var parseOptions = {};\n var resPattern = option.format || base.getResultantPattern(option.skeleton, dependable.dateObject, option.type);\n var regexString = '';\n var hourOnly;\n if (isUndefined(resPattern)) {\n throwError('Format options or type given must be invalid');\n }\n else {\n parseOptions = { pattern: resPattern, evalposition: {} };\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 for (var i = 0; i < length_1; i++) {\n var str = patternMatch[i];\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 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 // tslint:disable-next-line\n var weekObject = parser.reverseObject(dependable.dateObject[base.days][standalone][base.monthIndex[len]]);\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 canUpdate = true;\n if ((char === 'M' || char === 'L') && len > 2) {\n // tslint:disable-next-line\n parseOptions[charKey] = parser.reverseObject(dependable.dateObject[month][standalone][base.monthIndex[len]]);\n /* tslint:disable no-any */\n regexString += '(' + Object.keys(parseOptions[charKey]).join('|') + ')';\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 '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 parseOptions[charKey] = parser.reverseObject(getValue('dayPeriods.format.wide', dependable.dateObject));\n regexString += '(' + Object.keys(parseOptions[charKey]).join('|') + ')';\n break;\n case 'G':\n canUpdate = true;\n var eText = (len <= 3) ? 'eraAbbr' : (len === 4) ? 'eraNames' : 'eraNarrow';\n parseOptions[charKey] = parser.reverseObject(getValue('eras.' + eText, dependable.dateObject));\n regexString += '(' + Object.keys(parseOptions[charKey]).join('|') + '?)';\n break;\n case 'z':\n var tval = new Date().getTimezoneOffset();\n canUpdate = (tval !== 0);\n parseOptions[charKey] = getValue('dates.timeZoneNames', dependable.parserObject);\n var tzone = parseOptions[charKey];\n hourOnly = (len < 4);\n var hpattern = hourOnly ? '+H;-H' : tzone.hourFormat;\n regexString += '(' + this.parseTimeZoneRegx(hpattern, tzone, nRegx) + ')?';\n isgmtTraversed = true;\n zCorrectTemp = hourOnly ? 6 : 12;\n break;\n case '\\'':\n var iString = str.replace(/\\'/g, '');\n regexString += '(' + iString + ')?';\n break;\n default:\n regexString += '(.)?';\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 parseOptions.parserRegex = new RegExp('^' + regexString + '$');\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 return _this.getDateObject(parsedDateParts);\n };\n };\n /**\n * Returns date object for provided date options\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', '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 var tValue = options[key];\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 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 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 * @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 var nRegx = num.numericRegex;\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 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 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 * @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 * @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 result;\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 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 * @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 } from '../util';\nimport { ParserBase as parser } from './parser-base';\nimport { IntlBase as base } from './intl-base';\nvar formatRegex = /(^[ncpa]{1})([0-1]?[0-9]|20)?$/i;\nvar parseRegex = /^([^0-9]*)(([0-9,]*[0-9]+)(\\.[0-9]+)?)([Ee][+-]?[0-9]+)?([^0-9]*)$/;\nvar groupRegex = /,/g;\nvar latnDecimalRegex = /^[0-9]*(\\.[0-9]+)?$/;\nvar keys = ['minusSign', 'infinity'];\n/**\n * Module for Number Parser.\n * @private\n */\nvar NumberParser = /** @class */ (function () {\n function NumberParser() {\n }\n /**\n * Returns the parser function for given skeleton.\n * @param {string} - Specifies the culture name to be which formatting.\n * @param {NumberFormatOptions} - Specific the format in which number will parsed.\n * @param {cldr} - Specifies the global cldr data collection.\n * @return 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 }\n else {\n extend(parseOptions, base.customFormat(option.format, null, null));\n }\n numOptions = parser.getCurrentNumericOptions(dependable.parserObject, parser.getNumberingSystem(cldr), true);\n parseOptions.symbolRegex = parser.getSymbolRegex(Object.keys(numOptions.symbolMatch));\n // tslint:disable-next-line:no-any\n parseOptions.infinity = numOptions.symbolNumberSystem[keys[1]];\n var 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 return function (value) {\n return _this.getParsedNumber(value, parseOptions, numOptions);\n };\n };\n /**\n * Returns parsed number for the provided formatting options\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 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 (isNegative) {\n ret *= -1;\n }\n return ret;\n }\n };\n return NumberParser;\n}());\nexport { NumberParser };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from './util';\nvar defaultPosition = { left: 0, top: 0, bottom: 0, right: 0 };\nvar positionProp = ['offsetLeft', 'offsetTop'];\nvar axisMapper = ['x', 'y'];\nvar axisValueMapper = ['left', 'top'];\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.diffY = 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 if (isUnWire) {\n EventHandler.remove(ele || this.element, Browser.touchStartEvent, this.initialize);\n }\n else {\n EventHandler.add(ele || this.element, Browser.touchStartEvent, this.initialize, this);\n }\n };\n Draggable.prototype.initialize = function (evt) {\n this.target = evt.currentTarget;\n if (this.preventDefault && !isUndefined(evt.changedTouches)) {\n evt.preventDefault();\n }\n if (this.abort) {\n if (!isNullOrUndefined(closest(evt.target, this.abort))) {\n return;\n }\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.relativeXPosition = intCoord.pageX - pos.left;\n this.relativeYPosition = intCoord.pageY - pos.top;\n }\n EventHandler.add(document, Browser.touchMoveEvent, this.intDragStart, this);\n EventHandler.add(document, Browser.touchEndEvent, this.intDestroy, this);\n this.toggleEvents(true);\n document.body.classList.add('e-prevent-select');\n EventHandler.trigger(document.documentElement, Browser.touchStartEvent, evt);\n };\n Draggable.prototype.intDragStart = function (evt) {\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 this.offset = this.calculateParentPosition(element);\n this.position = this.getMousePosition(evt);\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) {\n var ele = this.getHelperElement(evt);\n if (!ele || isNullOrUndefined(ele)) {\n return;\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 this.trigger('dragStart', { event: evt, element: element, target: curTarget });\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 var posValue = this.getProcessedPositionValue({ top: (pos.top - this.diffY) + 'px',\n left: (pos.left - this.diffX) + 'px' });\n setStyleAttribute(dragTargetElement, {\n position: 'absolute', top: posValue.top, left: posValue.left\n });\n EventHandler.remove(document, Browser.touchMoveEvent, this.intDragStart);\n EventHandler.remove(document, Browser.touchEndEvent, this.intDestroy);\n if (isVisible(dragTargetElement)) {\n EventHandler.add(document, Browser.touchMoveEvent, this.intDrag, this);\n EventHandler.add(document, Browser.touchEndEvent, this.intDragStop, this);\n this.setGlobalDroppables(false, this.element, dragTargetElement);\n }\n else {\n document.body.classList.remove('e-prevent-select');\n }\n }\n };\n Draggable.prototype.getProcessedPositionValue = function (value) {\n if (this.axis) {\n if (this.axis === 'x') {\n value.top = '0px';\n }\n else if (this.axis === 'y') {\n value.left = '0px';\n }\n }\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 Draggable.prototype.intDrag = function (evt) {\n if (!isUndefined(evt.changedTouches) && (evt.changedTouches.length !== 1)) {\n return;\n }\n var left;\n var top;\n this.position = this.getMousePosition(evt);\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 eleObj.instance.intOver(evt, eleObj.target);\n /* tslint:disable no-any */\n eleObj.instance.dragData[this.scope] = this.droppables[this.scope];\n this.hoverObject = eleObj;\n }\n else if (this.hoverObject) {\n this.hoverObject.instance.intOut(evt, eleObj.target);\n this.hoverObject.instance.dragData[this.scope] = null;\n this.hoverObject = null;\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 if (this.dragArea) {\n var styles = getComputedStyle(helperElement);\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) {\n left = this.dragLimit.left;\n }\n else if (this.dragLimit.right < dLeft + helperWidth) {\n left = this.dragLimit.right - helperWidth;\n }\n else {\n 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) {\n top = this.dragLimit.top;\n }\n else if (this.dragLimit.bottom < dTop + helperHeight) {\n top = this.dragLimit.bottom - helperHeight;\n }\n else {\n 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 var dragValue = this.getProcessedPositionValue({ top: (top - iTop) + 'px', left: (left - iLeft) + 'px' });\n setStyleAttribute(helperElement, { left: dragValue.left, top: dragValue.top });\n this.position.left = left;\n this.position.top = top;\n this.pageX = pagex;\n this.pageY = pagey;\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 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 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 Draggable.prototype.intDestroy = function (evt) {\n this.toggleEvents();\n document.body.classList.remove('e-prevent-select');\n this.element.setAttribute('aria-grabbed', 'false');\n EventHandler.remove(document, Browser.touchMoveEvent, this.intDragStart);\n EventHandler.remove(document, Browser.touchEndEvent, this.intDragStop);\n EventHandler.remove(document, Browser.touchEndEvent, this.intDestroy);\n EventHandler.remove(document, Browser.touchMoveEvent, this.intDrag);\n };\n // triggers when property changed\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.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 = elementArea.width ? elementArea.width : elementArea.right - elementArea.left;\n eleHeightBound = elementArea.height ? elementArea.height : elementArea.bottom - elementArea.top;\n var keys = ['Top', 'Left', 'Bottom', 'Right'];\n var styles = getComputedStyle(ele);\n for (var i = 0; i < keys.length; i++) {\n var key = keys[i];\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 top = elementArea.top;\n left = elementArea.left;\n this.dragLimit.left = left + this.borderWidth.left + this.padding.left;\n this.dragLimit.top = top + 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.display || '';\n if (compareElementParent(evt.target, this.helperElement) || evt.type.indexOf('touch') !== -1) {\n this.helperElement.style.display = 'none';\n ele = document.elementFromPoint(intCoord.clientX, intCoord.clientY);\n this.helperElement.style.display = prevStyle;\n }\n else {\n ele = evt.target;\n }\n return ele;\n };\n Draggable.prototype.getMousePosition = function (evt) {\n var intCoord = this.getCoordinates(evt);\n var pageX = this.clone ? intCoord.pageX : intCoord.pageX - this.relativeXPosition;\n var pageY = this.clone ? intCoord.pageY : intCoord.pageY - this.relativeYPosition;\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 __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 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 Draggable = Draggable_1 = __decorate([\n NotifyPropertyChanges\n ], Draggable);\n return Draggable;\n var Draggable_1;\n}(Base));\nexport { Draggable };\n","import { createElement, attributes, addClass, removeClass, detach, classList, closest, isNullOrUndefined } from '@syncfusion/ej2-base';\nvar CLASSNAMES = {\n RTL: 'e-rtl',\n DISABLE: 'e-disabled',\n INPUT: 'e-input',\n INPUTGROUP: 'e-input-group',\n FLOATINPUT: 'e-float-input',\n FLOATLINE: 'e-float-line',\n FLOATTEXT: 'e-float-text',\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 * Base for Input creation through util methods.\n */\nexport var Input;\n(function (Input) {\n var privateInputObj = {\n container: null,\n buttons: [],\n clearButton: null\n };\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 * @param args\n */\n function createInput(args) {\n var inputObject = { container: null, buttons: [], clearButton: null };\n if (isNullOrUndefined(args.floatLabelType) || args.floatLabelType === 'Never') {\n inputObject.container = createInputContainer(args, CLASSNAMES.INPUTGROUP, CLASSNAMES.INPUTCUSTOMTAG, 'span');\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);\n }\n args.element.addEventListener('focus', function () {\n var parent = getParentNode(this);\n if (parent.classList.contains('e-input-group')) {\n parent.classList.add('e-input-focus');\n }\n });\n args.element.addEventListener('blur', function () {\n var parent = getParentNode(this);\n if (parent.classList.contains('e-input-group')) {\n parent.classList.remove('e-input-focus');\n }\n });\n if (!isNullOrUndefined(args.properties) && !isNullOrUndefined(args.properties.showClearButton) && args.properties.showClearButton) {\n setClearButton(args.properties.showClearButton, args.element, inputObject, true);\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));\n }\n }\n inputObject = setPropertyValue(args, inputObject);\n privateInputObj = inputObject;\n return inputObject;\n }\n Input.createInput = createInput;\n function _focusFn() {\n var label = getParentNode(this).getElementsByClassName('e-float-text')[0];\n addClass([label], CLASSNAMES.LABELTOP);\n if (label.classList.contains(CLASSNAMES.LABELBOTTOM)) {\n removeClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n function _blurFn() {\n var parent = getParentNode(this);\n if (parent.getElementsByTagName('input')[0].value === '') {\n var label = parent.getElementsByClassName('e-float-text')[0];\n if (label.classList.contains(CLASSNAMES.LABELTOP)) {\n removeClass([label], CLASSNAMES.LABELTOP);\n }\n addClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n function wireFloatingEvents(element) {\n element.addEventListener('focus', _focusFn);\n element.addEventListener('blur', _blurFn);\n }\n function unwireFloatingEvents(element) {\n element.removeEventListener('focus', _focusFn);\n element.removeEventListener('blur', _blurFn);\n }\n function createFloatingInput(args, inputObject) {\n var inputElement;\n var floatLinelement;\n var floatLabelElement;\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');\n args.element.parentNode.insertBefore(inputObject.container, args.element);\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 floatLinelement = createElement('span', { className: CLASSNAMES.FLOATLINE });\n floatLabelElement = createElement('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.innerHTML = args.element.placeholder;\n args.element.removeAttribute('placeholder');\n }\n if (!isNullOrUndefined(args.properties) && !isNullOrUndefined(args.properties.placeholder) &&\n args.properties.placeholder !== '') {\n floatLabelElement.innerHTML = args.properties.placeholder;\n }\n if (!floatLabelElement.innerHTML) {\n inputObject.container.classList.add(CLASSNAMES.NOFLOATLABEL);\n }\n inputObject.container.appendChild(args.element);\n inputObject.container.appendChild(floatLinelement);\n inputObject.container.appendChild(floatLabelElement);\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 args.element.addEventListener('input', function (event) {\n updateLabelState(args.element.value, floatLabelElement);\n });\n args.element.addEventListener('blur', function (event) {\n updateLabelState(args.element.value, floatLabelElement);\n });\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 break;\n case 'enabled':\n setEnabled(args.properties.enabled, args.element);\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) {\n if (value) {\n removeClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n else {\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n }\n function updateLabelState(value, label) {\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 if (label.classList.contains(CLASSNAMES.LABELTOP)) {\n removeClass([label], CLASSNAMES.LABELTOP);\n }\n addClass([label], CLASSNAMES.LABELBOTTOM);\n }\n }\n function getParentNode(element) {\n var parentNode = element.parentNode;\n return parentNode;\n }\n /**\n * To create clear button.\n */\n function createClearButton(element, inputObject, initial) {\n var button = createElement('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 if (!isNullOrUndefined(container) &&\n container.classList.contains(CLASSNAMES.FLOATINPUT)) {\n addClass([container], CLASSNAMES.INPUTGROUP);\n }\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n wireClearBtnEvents(element, button);\n return button;\n }\n function wireClearBtnEvents(element, button) {\n button.addEventListener('click', function (event) {\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 element.addEventListener('input', function (event) {\n updateIconState(element.value, button);\n });\n element.addEventListener('focus', function (event) {\n updateIconState(element.value, button);\n });\n element.addEventListener('blur', function (event) {\n setTimeout(function () { addClass([button], CLASSNAMES.CLEARICONHIDE); }, 200);\n });\n }\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);\n }\n }\n /**\n * To create input box contianer.\n */\n function createInputContainer(args, className, tagClass, tag) {\n var container;\n if (!isNullOrUndefined(args.customTag)) {\n container = createElement(args.customTag, { className: className });\n container.classList.add(tagClass);\n }\n else {\n container = createElement(tag, { className: className });\n }\n container.classList.add('e-control-wrapper');\n return container;\n }\n /**\n * Sets the value to the input element.\n * ```\n * E.g : Input.setValue('content', element, \"Auto\", true );\n * ```\n * @param value - Specify the value of the input element.\n * @param element - The element on which the specified value is updated.\n * @param floatLabelType - Specify the float label type of the input element.\n * @param 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 ((!isNullOrUndefined(floatLabelType)) && floatLabelType === 'Auto') {\n validateLabel(element, floatLabelType);\n }\n if (!isNullOrUndefined(clearButton) && clearButton) {\n var parentElement = getParentNode(element);\n var button = parentElement.getElementsByClassName(CLASSNAMES.CLEARICON)[0];\n if (element.value && parentElement.classList.contains('e-input-focus')) {\n removeClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n else {\n addClass([button], CLASSNAMES.CLEARICONHIDE);\n }\n }\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 * @param cssClass - Css class names which are needed to add.\n * @param elements - The elements which are needed to add / remove classes.\n * @param oldClass - 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);\n }\n if (!isNullOrUndefined(cssClass) && cssClass !== '') {\n addClass(elements, cssClass);\n }\n }\n Input.setCssClass = setCssClass;\n /**\n * Set the placeholder attribute to the input element.\n * ```\n * E.g : Input.setPlaceholder('Search here', element);\n * ```\n * @param placeholder - Placeholder value which is need to add.\n * @param element - The element on which the placeholder is need to add.\n */\n function setPlaceholder(placeholder, element) {\n var parentElement;\n parentElement = getParentNode(element);\n if (parentElement.classList.contains(CLASSNAMES.FLOATINPUT)) {\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = placeholder;\n parentElement.classList.remove(CLASSNAMES.NOFLOATLABEL);\n }\n else {\n parentElement.classList.add(CLASSNAMES.NOFLOATLABEL);\n parentElement.getElementsByClassName(CLASSNAMES.FLOATTEXT)[0].textContent = '';\n }\n }\n else {\n if (!isNullOrUndefined(placeholder) && placeholder !== '') {\n attributes(element, { 'placeholder': placeholder, 'aria-placeholder': placeholder });\n }\n else {\n element.removeAttribute('placeholder');\n element.removeAttribute('aria-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 * @param isReadonly\n * - Boolean value to specify whether to set read only. Setting \"True\" value enables read only.\n * @param 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 * @param isRtl\n * - Boolean value to specify whether to set RTL. Setting \"True\" value enables the RTL mode.\n * @param 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 * @param isEnable\n * - Boolean value to specify whether to enable or disable.\n * @param element\n * - Element to be enabled or disabled.\n */\n function setEnabled(isEnable, element, floatLabelType) {\n var disabledAttrs = { 'disabled': 'disabled', 'aria-disabled': 'true' };\n if (isEnable) {\n element.classList.remove(CLASSNAMES.DISABLE);\n removeAttributes(disabledAttrs, element);\n }\n else {\n element.classList.add(CLASSNAMES.DISABLE);\n addAttributes(disabledAttrs, element);\n }\n if (!isNullOrUndefined(floatLabelType)) {\n validateLabel(element, floatLabelType);\n }\n }\n Input.setEnabled = setEnabled;\n function setClearButton(isClear, element, inputObject, initial) {\n if (isClear) {\n inputObject.clearButton = createClearButton(element, inputObject, initial);\n }\n else {\n inputObject.clearButton.remove();\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 * @param attrs\n * - Array of attributes which are need to removed from the element.\n * @param 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 = void 0;\n 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 * @param attrs\n * - Array of attributes which is added to element.\n * @param 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 = void 0;\n 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('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) {\n inputEle.removeAttribute('required');\n }\n }\n }\n Input.removeFloating = removeFloating;\n function addFloating(input, type, placeholder) {\n var container = closest(input, '.' + CLASSNAMES.INPUTGROUP);\n if (type !== 'Never') {\n var customTag = container.tagName;\n customTag = customTag !== 'DIV' && customTag !== 'SPAN' ? customTag : null;\n var args = { element: input, floatLabelType: type, customTag: customTag, properties: { placeholder: placeholder } };\n var iconEle = container.querySelector('.e-clear-icon');\n var inputObj = { container: container };\n input.classList.remove(CLASSNAMES.INPUT);\n createFloatingInput(args, inputObj);\n if (isNullOrUndefined(iconEle)) {\n iconEle = container.querySelector('.e-input-group-icon');\n }\n if (isNullOrUndefined(iconEle)) {\n container.classList.remove(CLASSNAMES.INPUTGROUP);\n }\n else {\n var floatLine = container.querySelector('.' + CLASSNAMES.FLOATLINE);\n var floatText = container.querySelector('.' + CLASSNAMES.FLOATTEXT);\n container.insertBefore(input, iconEle);\n container.insertBefore(floatLine, iconEle);\n container.insertBefore(floatText, iconEle);\n }\n }\n }\n Input.addFloating = addFloating;\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 * @param 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 container - The container on which created span element is going to append.\n */\n function appendSpan(iconClass, container) {\n var button = createElement('span', { className: iconClass });\n container.appendChild(button);\n if (!container.classList.contains(CLASSNAMES.INPUTGROUP)) {\n container.classList.add(CLASSNAMES.INPUTGROUP);\n }\n button.addEventListener('mousedown', function () {\n if (!container.classList.contains('e-disabled') && !container.querySelector('input').readOnly) {\n this.classList.add('e-input-btn-ripple');\n }\n });\n button.addEventListener('mouseup', function () {\n var ele = this;\n setTimeout(function () { ele.classList.remove('e-input-btn-ripple'); }, 500);\n });\n return button;\n }\n Input.appendSpan = appendSpan;\n})(Input || (Input = {}));\n","var __extends = (this && this.__extends) || (function () {\n var 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 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.touchEndEvent, this.intDrop, this);\n };\n // triggers when property changed\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 this.trigger('over', { event: event, target: element });\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 };\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.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 = 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 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 * @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 _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 * @return {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 * @param newProp\n * @param oldProp\n * @returns {void}\n * @private\n */\n KeyboardEvents.prototype.onPropertyChanged = function (newProp, oldProp) {\n // No code are needed\n };\n ;\n KeyboardEvents.prototype.bind = function () {\n this.wireEvents();\n };\n /**\n * To get the module name, returns 'keyboard'.\n * @private\n */\n KeyboardEvents.prototype.getModuleName = function () {\n return 'keyboard';\n };\n /**\n * Wiring event handlers to events\n */\n KeyboardEvents.prototype.wireEvents = function () {\n this.element.addEventListener(this.eventName, this.keyPressHandler);\n };\n /**\n * Unwiring event handlers to events\n */\n KeyboardEvents.prototype.unwireEvents = function () {\n this.element.removeEventListener(this.eventName, this.keyPressHandler);\n };\n /**\n * To get the key configuration data\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 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 var KeyboardEvents_1;\n}(Base));\nexport { KeyboardEvents };\n","import { extend } 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 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 * @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 * @param {Object} localeObject - specifies the localeObject to be set as global locale.\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 * @param {string} propertyName - specifies the property for which localize text to be returned.\n * @return string\n */\n L10n.prototype.getConstant = function (prop) {\n /* tslint:disable no-any */\n return this.currentLocale[prop] || this.localeStrings[prop] || '';\n };\n /**\n * Returns the control constant object for current object and the locale specified.\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","/**\n * To import utils\n */\nimport { isNullOrUndefined, } from './util';\nvar SvgRenderer = /** @class */ (function () {\n /* End-Properties */\n function SvgRenderer(rootID) {\n //Internal Variables \n this.svgLink = 'http://www.w3.org/2000/svg';\n this.rootId = rootID;\n }\n // method to get the attributes value\n /* tslint:disable */\n SvgRenderer.prototype.getOptionValue = function (options, key) {\n return options[key];\n }; /* tslint:enable */\n /**\n * To create a Html5 SVG element\n * @param {SVGAttributes} options - Options to create SVG\n * @return {Element}\n */\n SvgRenderer.prototype.createSvg = function (options) {\n if (isNullOrUndefined(options.id)) {\n options.id = this.rootId + '_svg';\n }\n this.svgObj = document.getElementById(options.id);\n if (isNullOrUndefined(document.getElementById(options.id))) {\n this.svgObj = document.createElementNS(this.svgLink, 'svg');\n }\n this.svgObj = this.setElementAttributes(options, this.svgObj);\n this.setSVGSize(options.width, options.height);\n return this.svgObj;\n };\n // method to set the height and width for the SVG element\n SvgRenderer.prototype.setSVGSize = function (width, height) {\n var element = document.getElementById(this.rootId);\n var size = !isNullOrUndefined(element) ? element.getBoundingClientRect() : null;\n if (isNullOrUndefined(this.width) || this.width <= 0) {\n this.svgObj.setAttribute('width', width ? width.toString() : size.width.toString());\n }\n else {\n this.svgObj.setAttribute('width', this.width.toString());\n }\n if (isNullOrUndefined(this.height) || this.height <= 0) {\n this.svgObj.setAttribute('height', height ? height.toString() : '450');\n }\n else {\n this.svgObj.setAttribute('height', this.height.toString());\n }\n };\n /**\n * To draw a path\n * @param {PathAttributes} options - Options to draw a path in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.drawPath = function (options) {\n var path = document.getElementById(options.id);\n if (path === null) {\n path = document.createElementNS(this.svgLink, 'path');\n }\n path = this.setElementAttributes(options, path);\n return path;\n };\n /**\n * To draw a line\n * @param {LineAttributes} options - Options to draw a line in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.drawLine = function (options) {\n var line = document.getElementById(options.id);\n if (line === null) {\n line = document.createElementNS(this.svgLink, 'line');\n }\n line = this.setElementAttributes(options, line);\n return line;\n };\n /**\n * To draw a rectangle\n * @param {BaseAttibutes} options - Required options to draw a rectangle in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.drawRectangle = function (options) {\n var rectangle = document.getElementById(options.id);\n if (rectangle === null) {\n rectangle = document.createElementNS(this.svgLink, 'rect');\n }\n rectangle = this.setElementAttributes(options, rectangle);\n return rectangle;\n };\n /**\n * To draw a circle\n * @param {CircleAttributes} options - Required options to draw a circle in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.drawCircle = function (options) {\n var circle = document.getElementById(options.id);\n if (circle === null) {\n circle = document.createElementNS(this.svgLink, 'circle');\n }\n circle = this.setElementAttributes(options, circle);\n return circle;\n };\n /**\n * To draw a polyline\n * @param {PolylineAttributes} options - Options required to draw a polyline\n * @return {Element}\n */\n SvgRenderer.prototype.drawPolyline = function (options) {\n var polyline = document.getElementById(options.id);\n if (polyline === null) {\n polyline = document.createElementNS(this.svgLink, 'polyline');\n }\n polyline = this.setElementAttributes(options, polyline);\n return polyline;\n };\n /**\n * To draw an ellipse\n * @param {EllipseAttributes} options - Options required to draw an ellipse\n * @return {Element}\n */\n SvgRenderer.prototype.drawEllipse = function (options) {\n var ellipse = document.getElementById(options.id);\n if (ellipse === null) {\n ellipse = document.createElementNS(this.svgLink, 'ellipse');\n }\n ellipse = this.setElementAttributes(options, ellipse);\n return ellipse;\n };\n /**\n * To draw a polygon\n * @param {PolylineAttributes} options - Options needed to draw a polygon in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.drawPolygon = function (options) {\n var polygon = document.getElementById(options.id);\n if (polygon === null) {\n polygon = document.createElementNS(this.svgLink, 'polygon');\n }\n polygon = this.setElementAttributes(options, polygon);\n return polygon;\n };\n /**\n * To draw an image\n * @param {ImageAttributes} options - Required options to draw an image in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.drawImage = function (options) {\n var img = document.createElementNS(this.svgLink, 'image');\n img.setAttributeNS(null, 'height', options.height.toString());\n img.setAttributeNS(null, 'width', options.width.toString());\n img.setAttributeNS('http://www.w3.org/1999/xlink', 'href', options.href);\n img.setAttributeNS(null, 'x', options.x.toString());\n img.setAttributeNS(null, 'y', options.y.toString());\n img.setAttributeNS(null, 'id', options.id);\n img.setAttributeNS(null, 'visibility', options.visibility);\n if (!isNullOrUndefined(this.getOptionValue(options, 'clip-path'))) {\n img.setAttributeNS(null, 'clip-path', this.getOptionValue(options, 'clip-path'));\n }\n if (!isNullOrUndefined(options.preserveAspectRatio)) {\n img.setAttributeNS(null, 'preserveAspectRatio', options.preserveAspectRatio);\n }\n return img;\n };\n /**\n * To draw a text\n * @param {TextAttributes} options - Options needed to draw a text in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.createText = function (options, label) {\n var text = document.createElementNS(this.svgLink, 'text');\n text = this.setElementAttributes(options, text);\n if (!isNullOrUndefined(label)) {\n text.textContent = label;\n }\n return text;\n };\n /**\n * To create a tSpan\n * @param {TextAttributes} options - Options to create tSpan\n * @param {string} label - The text content which is to be rendered in the tSpan\n * @return {Element}\n */\n SvgRenderer.prototype.createTSpan = function (options, label) {\n var tSpan = document.createElementNS(this.svgLink, 'tspan');\n tSpan = this.setElementAttributes(options, tSpan);\n if (!isNullOrUndefined(label)) {\n tSpan.textContent = label;\n }\n return tSpan;\n };\n /**\n * To create a title\n * @param {string} text - The text content which is to be rendered in the title\n * @return {Element}\n */\n SvgRenderer.prototype.createTitle = function (text) {\n var title = document.createElementNS(this.svgLink, 'title');\n title.textContent = text;\n return title;\n };\n /**\n * To create defs element in SVG\n * @return {Element}\n */\n SvgRenderer.prototype.createDefs = function () {\n var defs = document.createElementNS(this.svgLink, 'defs');\n return defs;\n };\n /**\n * To create clip path in SVG\n * @param {BaseAttibutes} options - Options needed to create clip path\n * @return {Element}\n */\n SvgRenderer.prototype.createClipPath = function (options) {\n var clipPath = document.createElementNS(this.svgLink, 'clipPath');\n clipPath = this.setElementAttributes(options, clipPath);\n return clipPath;\n };\n /**\n * To create foreign object in SVG\n * @param {BaseAttibutes} options - Options needed to create foreign object\n * @return {Element}\n */\n SvgRenderer.prototype.createForeignObject = function (options) {\n var foreignObject = document.createElementNS(this.svgLink, 'foreignObject');\n foreignObject = this.setElementAttributes(options, foreignObject);\n return foreignObject;\n };\n /**\n * To create group element in SVG\n * @param {BaseAttibutes} options - Options needed to create group\n * @return {Element}\n */\n SvgRenderer.prototype.createGroup = function (options) {\n var group = document.createElementNS(this.svgLink, 'g');\n group = this.setElementAttributes(options, group);\n return group;\n };\n /**\n * To create pattern in SVG\n * @param {PatternAttributes} options - Required options to create pattern in SVG\n * @param {string} type - Specifies the name of the pattern\n * @return {Element}\n */\n SvgRenderer.prototype.createPattern = function (options, element) {\n var pattern = document.createElementNS(this.svgLink, element);\n pattern = this.setElementAttributes(options, pattern);\n return pattern;\n };\n /**\n * To create radial gradient in SVG\n * @param {string[]} colors - Specifies the colors required to create radial gradient\n * @param {string[]} colorStop - Specifies the colorstop required to create radial gradient\n * @param {string} name - Specifies the name of the gradient\n * @param {RadialGradient} options - value for radial gradient\n * @return {string}\n */\n SvgRenderer.prototype.createRadialGradient = function (colors, name, options) {\n var colorName;\n if (!isNullOrUndefined(colors[0].colorStop)) {\n var newOptions = {\n 'id': this.rootId + '_' + name + 'radialGradient',\n 'cx': options.cx + '%',\n 'cy': options.cy + '%',\n 'r': options.r + '%',\n 'fx': options.fx + '%',\n 'fy': options.fy + '%'\n };\n this.drawGradient('radialGradient', newOptions, colors);\n colorName = 'url(#' + this.rootId + '_' + name + 'radialGradient)';\n }\n else {\n colorName = colors[0].color.toString();\n }\n return colorName;\n };\n /**\n * To create linear gradient in SVG\n * @param {string[]} colors - Array of string specifies the values for color\n * @param {string[]} colors - Array of string specifies the values for colorStop\n * @param {string} name - Specifies the name of the gradient\n * @param {LinearGradient} options - Specifies the options for gradient\n * @return {string}\n */\n SvgRenderer.prototype.createLinearGradient = function (colors, name, options) {\n var colorName;\n if (!isNullOrUndefined(colors[0].colorStop)) {\n var newOptions = {\n 'id': this.rootId + '_' + name + 'linearGradient',\n 'x1': options.x1 + '%',\n 'y1': options.y1 + '%',\n 'x2': options.x2 + '%',\n 'y2': options.y2 + '%'\n };\n this.drawGradient('linearGradient', newOptions, colors);\n colorName = 'url(#' + this.rootId + '_' + name + 'linearGradient)';\n }\n else {\n colorName = colors[0].color.toString();\n }\n return colorName;\n };\n /**\n * To render the gradient element in SVG\n * @param {string} gradientType - Specifies the type of the gradient\n * @param {RadialGradient | LinearGradient} options - Options required to render a gradient\n * @param {string[]} colors - Array of string specifies the values for color\n * @param {string[]} colorStop - Array of string specifies the values for colorStop\n * @return {Element}\n */\n SvgRenderer.prototype.drawGradient = function (gradientType, options, colors) {\n var defs = this.createDefs();\n var gradient = document.createElementNS(this.svgLink, gradientType);\n gradient = this.setElementAttributes(options, gradient);\n for (var i = 0; i < colors.length; i++) {\n var stop_1 = document.createElementNS(this.svgLink, 'stop');\n stop_1.setAttribute('offset', colors[i].colorStop);\n stop_1.setAttribute('stop-color', colors[i].color);\n stop_1.setAttribute('stop-opacity', '1');\n gradient.appendChild(stop_1);\n }\n defs.appendChild(gradient);\n return defs;\n };\n /**\n * To render a clip path\n * @param {BaseAttibutes} options - Options required to render a clip path\n * @return {Element}\n */\n SvgRenderer.prototype.drawClipPath = function (options) {\n var defs = this.createDefs();\n var clipPath = this.createClipPath({ 'id': options.id });\n var rect = this.drawRectangle(options);\n clipPath.appendChild(rect);\n defs.appendChild(clipPath);\n return defs;\n };\n /**\n * To create circular clip path in SVG\n * @param {CircleAttributes} options - Options required to create circular clip path\n * @return {Element}\n */\n SvgRenderer.prototype.drawCircularClipPath = function (options) {\n var defs = this.createDefs();\n var clipPath = this.createClipPath({ 'id': options.id });\n var circle = this.drawCircle(options);\n clipPath.appendChild(circle);\n defs.appendChild(clipPath);\n return defs;\n };\n /**\n * To set the attributes to the element\n * @param {SVGCanvasAttributes} options - Attributes to set for the element\n * @param {Element} element - The element to which the attributes need to be set\n * @return {Element}\n */\n SvgRenderer.prototype.setElementAttributes = function (options, element) {\n var keys = Object.keys(options);\n for (var i = 0; i < keys.length; i++) {\n element.setAttribute(keys[i], options[keys[i]]);\n }\n return element;\n };\n return SvgRenderer;\n}());\nexport { SvgRenderer };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 * @private\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 _this.startEvent = function (evt) {\n if (_this.touchAction === true) {\n var point = (evt.changedTouches ? evt.changedTouches[0] : 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 }\n };\n _this.moveEvent = function (evt) {\n var point = evt.changedTouches ? evt.changedTouches[0] : 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 _this.endEvent = function (evt) {\n clearTimeout(_this.timeOutTapHold);\n clearTimeout(_this.timeOutTap);\n var point = evt;\n if (evt.changedTouches) {\n point = evt.changedTouches[0];\n }\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 _this.endPoint = point;\n var eSwipeArgs;\n var tDistance = _this.swipeSettings.swipeThresholdDistance;\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 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 else {\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 = setTimeout(function () {\n _this.touchAction = true;\n }, (typeof _this.tap !== 'function' ? 0 : 10));\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 };\n _this.bind();\n return _this;\n }\n // triggers when property changed \n /**\n * @private\n * @param newProp\n * @param oldProp\n */\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 * @return {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 * @returns {string}\n * @private\n */\n Touch.prototype.getModuleName = function () {\n return 'touch';\n };\n /**\n * Returns if the HTML element is Scrollable.\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 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 eTapArgs = { originalEvent: evt };\n this.trigger('tapHold', eTapArgs);\n };\n Touch.prototype.calcPoints = function (evt) {\n var point = evt.changedTouches ? evt.changedTouches[0] : 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 = evt.changedTouches ? evt.changedTouches[0] : 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 // tslint:disable-next-line:no-any\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 __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","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from '@syncfusion/ej2-base';\nimport { addClass, createElement, detach, removeClass, rippleEffect, EventHandler } from '@syncfusion/ej2-base';\nimport { getTextNode } from '../common/common';\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 * @param {ButtonModel} options?\n * @param {string|HTMLButtonElement} 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 * @returns void\n * @private\n */\n Button.prototype.render = function () {\n this.initialize();\n };\n Button.prototype.initialize = function () {\n if (this.cssClass) {\n addClass([this.element], this.cssClass.split(' '));\n }\n if (this.isPrimary) {\n this.element.classList.add(cssClassName.PRIMARY);\n }\n if (this.content) {\n this.element.innerHTML = this.content;\n }\n this.setIconCss();\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 rippleEffect(this.element, { selector: '.' + cssClassName.BUTTON });\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 = 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 }\n var node = this.element.childNodes[0];\n if (node && (this.iconPosition === 'Left')) {\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 * @returns void\n */\n Button.prototype.destroy = function () {\n var span;\n var element = this.element;\n _super.prototype.destroy.call(this);\n removeClass([this.element], [cssClassName.PRIMARY, cssClassName.RTL, cssClassName.ICONBTN, 'e-success',\n 'e-info', 'e-danger', 'e-warning', 'e-flat', 'e-outline', 'e-small', 'e-bigger', 'e-active', 'e-round']);\n ['e-ripple', 'disabled'].forEach(function (value) {\n element.removeAttribute(value);\n });\n if (this.content) {\n element.innerHTML = element.innerHTML.replace(this.content, '');\n }\n span = element.querySelector('span.e-btn-icon');\n if (span) {\n detach(span);\n }\n this.unWireEvents();\n };\n /**\n * Get component name.\n * @returns string\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 * @returns string\n */\n Button.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Called internally if any of the property value changed.\n * @param {Button} newProp\n * @param {Button} oldProp\n * @returns void\n * @private\n */\n Button.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 '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 this.unWireEvents();\n break;\n case 'iconCss':\n var span = this.element.querySelector('span.e-btn-icon');\n if (span) {\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 this.setIconCss();\n }\n break;\n case 'iconPosition':\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.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 this.element.innerHTML = newProp.content;\n this.setIconCss();\n break;\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 __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 Button = __decorate([\n NotifyPropertyChanges\n ], Button);\n return Button;\n}(Component));\nexport { Button };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from '@syncfusion/ej2-base';\nimport { Event, EventHandler } from '@syncfusion/ej2-base';\nimport { addClass, createElement, detach, getUniqueID, isRippleEnabled, removeClass, rippleEffect } from '@syncfusion/ej2-base';\nimport { wrapperInitialize, rippleMouseHandler } 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';\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 * @private\n */\n function CheckBox(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isKeyPressed = false;\n return _this;\n }\n CheckBox.prototype.changeState = function (state) {\n var ariaState;\n var rippleSpan;\n var frameSpan = this.getWrapper().getElementsByClassName(FRAME)[0];\n if (isRippleEnabled) {\n rippleSpan = this.getWrapper().getElementsByClassName(RIPPLE)[0];\n }\n if (state === 'check') {\n frameSpan.classList.remove(INDETERMINATE);\n frameSpan.classList.add(CHECK);\n if (rippleSpan) {\n rippleSpan.classList.remove(RIPPLEINDETERMINATE);\n rippleSpan.classList.add(RIPPLECHECK);\n }\n ariaState = 'true';\n this.element.checked = true;\n }\n else if (state === 'uncheck') {\n removeClass([frameSpan], [CHECK, INDETERMINATE]);\n if (rippleSpan) {\n removeClass([rippleSpan], [RIPPLECHECK, RIPPLEINDETERMINATE]);\n }\n ariaState = 'false';\n this.element.checked = false;\n }\n else {\n frameSpan.classList.remove(CHECK);\n frameSpan.classList.add(INDETERMINATE);\n if (rippleSpan) {\n rippleSpan.classList.remove(RIPPLECHECK);\n rippleSpan.classList.add(RIPPLEINDETERMINATE);\n }\n ariaState = 'mixed';\n this.element.indeterminate = true;\n }\n this.getWrapper().setAttribute('aria-checked', ariaState);\n };\n CheckBox.prototype.clickHandler = function (event) {\n this.focusOutHandler();\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.element.checked, event: event };\n this.trigger('change', changeEventArgs);\n };\n /**\n * Destroys the widget.\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.disabled) {\n this.unWireEvents();\n }\n if (this.tagName === 'INPUT') {\n wrapper.parentNode.insertBefore(this.element, wrapper);\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 ['role', 'aria-checked', 'class'].forEach(function (key) {\n wrapper.removeAttribute(key);\n });\n if (this.element.id) {\n wrapper.setAttribute('id', this.element.id);\n }\n wrapper.innerHTML = '';\n }\n };\n CheckBox.prototype.focusHandler = function () {\n if (this.isKeyPressed) {\n this.getWrapper().classList.add('e-focus');\n }\n };\n CheckBox.prototype.focusOutHandler = function () {\n this.getWrapper().classList.remove('e-focus');\n };\n /**\n * Gets the module name.\n * @private\n */\n CheckBox.prototype.getModuleName = function () {\n return 'checkbox';\n };\n /**\n * Gets the properties to be maintained in the persistence state.\n * @private\n */\n CheckBox.prototype.getPersistData = function () {\n return this.addOnPersist(['checked', 'indeterminate']);\n };\n CheckBox.prototype.getWrapper = function () {\n return this.element.parentElement.parentElement;\n };\n CheckBox.prototype.initialize = function () {\n if (this.name) {\n this.element.setAttribute('name', this.name);\n }\n if (this.value) {\n this.element.setAttribute('value', this.value);\n }\n if (this.checked) {\n this.changeState('check');\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 = createElement('div', {\n className: WRAPPER, attrs: { 'role': 'checkbox', 'aria-checked': 'false' }\n });\n this.element.parentNode.insertBefore(wrapper, this.element);\n }\n var label = createElement('label', { attrs: { for: this.element.id } });\n var frameSpan = createElement('span', { className: 'e-icons ' + FRAME });\n if (this.enableRtl) {\n wrapper.classList.add(RTL);\n }\n if (this.cssClass) {\n addClass([wrapper], this.cssClass.split(' '));\n }\n wrapper.appendChild(label);\n label.appendChild(this.element);\n label.appendChild(frameSpan);\n if (isRippleEnabled) {\n var rippleSpan = 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.keyDownHandler = function () {\n this.isKeyPressed = true;\n };\n CheckBox.prototype.labelMouseHandler = function (e) {\n var rippleSpan = this.getWrapper().getElementsByClassName(RIPPLE)[0];\n rippleMouseHandler(e, rippleSpan);\n };\n CheckBox.prototype.mouseDownHandler = function () {\n this.isKeyPressed = false;\n };\n /**\n * Called internally if any of the property value changes.\n * @private\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.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 wrapper.classList.remove(oldProp.cssClass);\n }\n wrapper.classList.add(newProp.cssClass);\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 case 'name':\n this.element.setAttribute('name', newProp.name);\n break;\n case 'value':\n this.element.setAttribute('value', newProp.value);\n break;\n }\n }\n };\n /**\n * Initialize Angular, React and Unique ID support.\n * @private\n */\n CheckBox.prototype.preRender = function () {\n var element = this.element;\n this.tagName = this.element.tagName;\n element = wrapperInitialize('EJS-CHECKBOX', 'checkbox', element, WRAPPER);\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 * @private\n */\n CheckBox.prototype.render = function () {\n this.initWrapper();\n this.initialize();\n if (!this.disabled) {\n this.wireEvents();\n }\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 CheckBox.prototype.setText = function (text) {\n var label = this.getWrapper().getElementsByClassName(LABEL)[0];\n if (label) {\n label.textContent = text;\n }\n else {\n label = createElement('span', { className: LABEL, innerHTML: text });\n var labelWrap = this.getWrapper().getElementsByTagName('label')[0];\n if (this.labelPosition === 'Before') {\n labelWrap.insertBefore(label, this.getWrapper().getElementsByClassName(FRAME)[0]);\n }\n else {\n labelWrap.appendChild(label);\n }\n }\n };\n CheckBox.prototype.unWireEvents = function () {\n var wrapper = this.getWrapper();\n EventHandler.remove(this.element, 'click', this.clickHandler);\n EventHandler.remove(document, 'keydown', this.keyDownHandler);\n EventHandler.remove(wrapper, 'mousedown', this.mouseDownHandler);\n EventHandler.remove(this.element, 'focus', this.focusHandler);\n EventHandler.remove(this.element, 'focusout', this.focusOutHandler);\n var label = wrapper.getElementsByTagName('label')[0];\n EventHandler.remove(label, 'mousedown', this.labelMouseHandler);\n EventHandler.remove(label, 'mouseup', this.labelMouseHandler);\n };\n CheckBox.prototype.wireEvents = function () {\n var wrapper = this.getWrapper();\n EventHandler.add(this.element, 'click', this.clickHandler, this);\n EventHandler.add(document, 'keydown', this.keyDownHandler, this);\n EventHandler.add(wrapper, 'mousedown', this.mouseDownHandler, 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.labelMouseHandler, this);\n EventHandler.add(label, 'mouseup', this.labelMouseHandler, this);\n };\n __decorate([\n Event()\n ], CheckBox.prototype, \"change\", 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 CheckBox = __decorate([\n NotifyPropertyChanges\n ], CheckBox);\n return CheckBox;\n}(Component));\nexport { CheckBox };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from '@syncfusion/ej2-base';\nimport { addClass, createElement, getInstance, getUniqueID, isRippleEnabled, removeClass } from '@syncfusion/ej2-base';\nimport { detach, Event, EventHandler } 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';\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 * @private\n */\n function RadioButton(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.isKeyPressed = false;\n return _this;\n }\n RadioButton_1 = RadioButton;\n RadioButton.prototype.changeHandler = function (event) {\n this.checked = true;\n this.dataBind();\n var changeEventArgs = { value: this.value, event: event };\n this.trigger('change', changeEventArgs);\n };\n RadioButton.prototype.updateChange = function (state) {\n var input;\n var name = this.element.getAttribute('name');\n var radioGrp = document.querySelectorAll('input.e-radio[name=\"' + name + '\"]');\n for (var i = 0; i < radioGrp.length; i++) {\n input = radioGrp[i];\n if (input !== this.element) {\n getInstance(input, RadioButton_1).checked = false;\n }\n }\n };\n /**\n * Destroys the widget.\n * @returns void\n */\n RadioButton.prototype.destroy = function () {\n var _this = this;\n var radioWrap = this.element.parentElement;\n _super.prototype.destroy.call(this);\n if (!this.disabled) {\n this.unWireEvents();\n }\n if (this.tagName === 'INPUT') {\n radioWrap.parentNode.insertBefore(this.element, radioWrap);\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 if (this.element.id) {\n radioWrap.setAttribute('id', this.element.id);\n }\n radioWrap.innerHTML = '';\n }\n };\n RadioButton.prototype.focusHandler = function () {\n if (this.isKeyPressed) {\n this.getLabel().classList.add('e-focus');\n }\n };\n RadioButton.prototype.focusOutHandler = function () {\n this.getLabel().classList.remove('e-focus');\n };\n RadioButton.prototype.getModuleName = function () {\n return 'radio';\n };\n /**\n * Gets the properties to be maintained in the persistence state.\n * @private\n */\n RadioButton.prototype.getPersistData = function () {\n return this.addOnPersist(['checked']);\n };\n RadioButton.prototype.getLabel = function () {\n return this.element.nextElementSibling;\n };\n RadioButton.prototype.initialize = function () {\n this.initWrapper();\n if (this.name) {\n this.element.setAttribute('name', this.name);\n }\n if (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 = createElement('div', { className: WRAPPER });\n this.element.parentNode.insertBefore(wrapper, this.element);\n }\n var label = createElement('label', { attrs: { for: this.element.id } });\n wrapper.appendChild(this.element);\n wrapper.appendChild(label);\n if (isRippleEnabled) {\n rippleSpan = createElement('span', { className: (RIPPLE) });\n label.appendChild(rippleSpan);\n rippleEffect(rippleSpan, {\n duration: 400,\n isCenterRipple: true\n });\n }\n if (this.enableRtl) {\n label.classList.add(RTL);\n }\n if (this.cssClass) {\n addClass([label], this.cssClass.split(' '));\n }\n if (this.label) {\n this.setText(this.label);\n }\n };\n RadioButton.prototype.keyDownHandler = function () {\n this.isKeyPressed = true;\n };\n RadioButton.prototype.labelRippleHandler = function (e) {\n var ripple = this.getLabel().getElementsByClassName(RIPPLE)[0];\n rippleMouseHandler(e, ripple);\n };\n RadioButton.prototype.mouseDownHandler = function () {\n this.isKeyPressed = false;\n };\n /**\n * Called internally if any of the property value changes.\n * @private\n */\n RadioButton.prototype.onPropertyChanged = function (newProp, oldProp) {\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(newProp.checked);\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([label], oldProp.cssClass.split(' '));\n }\n addClass([label], newProp.cssClass.split(' '));\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 this.element.setAttribute('value', newProp.value);\n break;\n }\n }\n };\n /**\n * Initialize checked Property, Angular and React and Unique ID support.\n * @private\n */\n RadioButton.prototype.preRender = function () {\n var element = this.element;\n this.tagName = this.element.tagName;\n element = wrapperInitialize('EJS-RADIOBUTTON', 'radio', element, WRAPPER);\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 };\n /**\n * Initialize the control rendering\n * @private\n */\n RadioButton.prototype.render = function () {\n this.initialize();\n if (!this.disabled) {\n this.wireEvents();\n }\n };\n RadioButton.prototype.setDisabled = function () {\n this.element.disabled = true;\n };\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 textLabel = 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.unWireEvents = function () {\n var label = this.getLabel();\n EventHandler.remove(this.element, 'change', this.changeHandler);\n EventHandler.remove(document, 'keydown', this.keyDownHandler);\n EventHandler.remove(label, 'mousedown', this.mouseDownHandler);\n EventHandler.remove(this.element, 'focus', this.focusHandler);\n EventHandler.remove(this.element, 'focusout', this.focusOutHandler);\n var rippleLabel = label.getElementsByClassName(LABEL)[0];\n if (rippleLabel) {\n EventHandler.remove(rippleLabel, 'mousedown', this.labelRippleHandler);\n EventHandler.remove(rippleLabel, 'mouseup', this.labelRippleHandler);\n }\n };\n RadioButton.prototype.wireEvents = function () {\n var label = this.getLabel();\n EventHandler.add(this.element, 'change', this.changeHandler, this);\n EventHandler.add(document, 'keydown', this.keyDownHandler, this);\n EventHandler.add(label, 'mousedown', this.mouseDownHandler, 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.labelRippleHandler, this);\n EventHandler.add(rippleLabel, 'mouseup', this.labelRippleHandler, this);\n }\n };\n __decorate([\n Event()\n ], RadioButton.prototype, \"change\", 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 RadioButton = RadioButton_1 = __decorate([\n NotifyPropertyChanges\n ], RadioButton);\n return RadioButton;\n var RadioButton_1;\n}(Component));\nexport { RadioButton };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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, Browser, Complex } from '@syncfusion/ej2-base';\nimport { createElement, addClass, removeClass, detach, attributes, prepend, setStyleAttribute } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit } from '@syncfusion/ej2-base';\nimport { EventHandler } from '@syncfusion/ej2-base';\nimport { Draggable } from '@syncfusion/ej2-base';\nimport { Popup, PositionData, getZindexPartial } from '../popup/popup';\nimport { Button } from '@syncfusion/ej2-buttons';\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()\n ], ButtonProps.prototype, \"buttonModel\", void 0);\n __decorate([\n Property()\n ], ButtonProps.prototype, \"click\", void 0);\n return ButtonProps;\n}(ChildProperty));\nexport { ButtonProps };\n/**\n * Specifies Dialog open and close animation settings.\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_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';\n/**\n * Represents the Dialog component that displays information to the user, and used to get the user input.\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 * @hidden\n */\n function Dialog(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Initialize the control rendering\n * @private\n */\n Dialog.prototype.render = function () {\n this.initialize();\n this.initRender();\n this.wireEvents();\n };\n /**\n * Initialize the event handler\n * @private\n */\n Dialog.prototype.preRender = function () {\n var _this = this;\n this.headerContent = null;\n var classArray = [];\n for (var j = 0; j < this.element.classList.length; j++) {\n if (!isNullOrUndefined(this.element.classList[j].match('e-control')) ||\n !isNullOrUndefined(this.element.classList[j].match(ROOT))) {\n classArray.push(this.element.classList[j]);\n }\n }\n removeClass([this.element], classArray);\n this.clonedEle = this.element.cloneNode(true);\n this.closeIconClickEventHandler = function (event) {\n _this.hide();\n _this.closedFrom = event;\n };\n this.dlgOverlayClickEventHandler = function (event) {\n _this.trigger('overlayClick', event);\n };\n var localeText = { close: 'Close' };\n this.l10n = new L10n('dialog', localeText, this.locale);\n };\n ;\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(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.hide();\n this.closedFrom = event;\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 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 * @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 addClass([this.element], ROOT);\n if (Browser.isDevice) {\n addClass([this.element], DEVICE);\n }\n this.setCSSClass();\n this.setMaxHeight();\n };\n /**\n * Initialize the rendering\n * @private\n */\n Dialog.prototype.initRender = function () {\n var _this = this;\n attributes(this.element, { role: 'dialog' });\n if (this.zIndex === 1000) {\n this.zIndex = getZindexPartial(this.element);\n }\n this.setTargetContent();\n if (this.header !== '') {\n this.setHeader();\n }\n if (this.showCloseIcon) {\n this.renderCloseIcon();\n }\n if (!isNullOrUndefined(this.content) && this.content !== '') {\n this.setContent();\n }\n else if (this.element.hasChildNodes()) {\n this.contentEle = this.element;\n }\n if (this.footerTemplate !== '') {\n this.setFooterTemplate();\n }\n if (!isNullOrUndefined(this.buttons[0].buttonModel) && this.footerTemplate === '') {\n this.setButton();\n }\n if (this.allowDragging && (!this.isModal) && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n attributes(this.element, { 'aria-modal': (this.isModal ? 'true' : 'false') });\n if (this.isModal) {\n this.setIsModal();\n }\n if (!isNullOrUndefined(this.targetEle)) {\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 open: function () {\n _this.focusContent();\n _this.trigger('open');\n },\n close: function (event) {\n _this.unBindEvent(_this.element);\n if (_this.isModal) {\n _this.dlgContainer.style.display = 'none';\n }\n _this.trigger('close', _this.closedFrom);\n _this.closedFrom = {};\n if (!isNullOrUndefined(_this.storeActiveElement)) {\n _this.storeActiveElement.focus();\n }\n }\n });\n this.positionChange();\n this.setEnableRTL();\n addClass([this.element], DLG_HIDE);\n if (this.isModal) {\n this.setOverlayZindex();\n }\n if (this.visible) {\n this.show();\n }\n else {\n if (this.isModal) {\n this.dlgOverlay.style.display = 'none';\n }\n }\n };\n Dialog.prototype.setOverlayZindex = function () {\n var zIndex = parseInt(this.element.style.zIndex, 10) ? parseInt(this.element.style.zIndex, 10) : this.zIndex;\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 this.popupObj.setProperties({\n position: {\n X: this.position.X, Y: this.position.Y\n }\n });\n }\n else {\n this.dlgContainer.classList.add('e-dlg-' + this.position.X + '-' + this.position.Y);\n }\n };\n Dialog.prototype.setAllowDragging = function () {\n var _this = this;\n var handleContent = '.' + DLG_HEADER_CONTENT;\n this.dragObj = new Draggable(this.element, {\n clone: false,\n handle: handleContent,\n dragStart: function (event) {\n _this.trigger('dragStart', event);\n },\n dragStop: function (event) {\n _this.trigger('dragStop', event);\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 Dialog.prototype.setButton = function () {\n this.buttonContent = [];\n this.btnObj = [];\n var primaryBtnFlag = true;\n for (var i = 0; i < this.buttons.length; i++) {\n var btn = createElement('button', { attrs: { type: 'button' } });\n this.buttonContent.push(btn.outerHTML);\n }\n this.setFooterTemplate();\n for (var i = 0; i < this.buttons.length; i++) {\n this.btnObj[i] = new Button(this.buttons[i].buttonModel);\n if (typeof (this.buttons[i].click) === 'function') {\n EventHandler.add(this.ftrTemplateContent.children[i], 'click', this.buttons[i].click, this);\n }\n this.btnObj[i].appendTo(this.ftrTemplateContent.children[i]);\n if (!this.btnObj[i].isPrimary) {\n this.btnObj[i].element.classList.add('e-flat');\n }\n this.primaryButtonEle = this.element.getElementsByClassName('e-primary')[0];\n }\n };\n Dialog.prototype.setContent = function () {\n attributes(this.element, { 'aria-describedby': this.element.id + '_dialog-content' });\n this.contentEle = createElement('div', { className: DLG_CONTENT, id: this.element.id + '_dialog-content' });\n typeof (this.content) === 'string' ? this.contentEle.innerHTML = this.content : this.contentEle.appendChild(this.content);\n !isNullOrUndefined(this.headerContent) ? this.element.insertBefore(this.contentEle, this.element.children[1]) :\n this.element.insertBefore(this.contentEle, this.element.children[0]);\n if (this.height === 'auto') {\n this.setMaxHeight();\n }\n };\n Dialog.prototype.setMaxHeight = function () {\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 - 20) + 'px' : (window.innerHeight - 20) + 'px';\n this.element.style.display = display;\n };\n Dialog.prototype.setEnableRTL = function () {\n this.enableRtl ? addClass([this.element], RTL) : removeClass([this.element], RTL);\n };\n Dialog.prototype.setTargetContent = function () {\n var isContent = this.element.innerHTML.replace(/\\s/g, '') !== '';\n if (this.element.children.length > 0 || isContent) {\n var contentDiv = document.createDocumentFragment();\n while (this.element.childNodes.length !== 0) {\n contentDiv.appendChild(this.element.childNodes[0]);\n }\n this.setProperties({ content: contentDiv }, true);\n }\n };\n Dialog.prototype.setHeader = function () {\n this.headerEle = createElement('div', { id: this.element.id + '_title', className: DLG_HEADER, innerHTML: this.header });\n attributes(this.element, { 'aria-labelledby': this.element.id + '_title' });\n this.createHeaderContent();\n this.headerContent.appendChild(this.headerEle);\n this.element.insertBefore(this.headerContent, this.element.children[0]);\n };\n Dialog.prototype.setFooterTemplate = function () {\n this.ftrTemplateContent = createElement('div', {\n className: DLG_FOOTER_CONTENT,\n innerHTML: (this.footerTemplate !== '' ? this.footerTemplate : this.buttonContent.join(''))\n });\n this.element.appendChild(this.ftrTemplateContent);\n };\n Dialog.prototype.createHeaderContent = function () {\n if (isNullOrUndefined(this.headerContent)) {\n this.headerContent = createElement('div', { className: DLG_HEADER_CONTENT });\n }\n };\n Dialog.prototype.renderCloseIcon = function () {\n this.closeIcon = 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 Dialog.prototype.closeIconTitle = function () {\n this.l10n.setLocale(this.locale);\n var closeIconTitle = this.l10n.getConstant('close');\n this.closeIcon.setAttribute('title', closeIconTitle);\n };\n Dialog.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 Dialog.prototype.setIsModal = function () {\n this.dlgContainer = createElement('div', { className: DLG_CONTAINER });\n this.element.parentNode.insertBefore(this.dlgContainer, this.element);\n this.dlgContainer.appendChild(this.element);\n addClass([this.element], MODAL_DLG);\n this.dlgOverlay = 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 }\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 (!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.msMatchesSelector : null;\n if (elementMatch) {\n for (; element; element = element.parentNode) {\n if (element instanceof Element && elementMatch.call(element, t)) {\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 node.focus();\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 /**\n * Module required function\n * @private\n */\n Dialog.prototype.getModuleName = function () {\n return 'dialog';\n };\n /**\n * Called internally if any of the property value changed\n * @private\n */\n Dialog.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 'content':\n if (!isNullOrUndefined(this.content) && this.content !== '') {\n if (!isNullOrUndefined(this.contentEle) && this.contentEle.getAttribute('role') !== 'dialog') {\n this.contentEle.innerHTML = '';\n typeof (this.content) === 'string' ?\n this.contentEle.innerHTML = this.content : this.contentEle.appendChild(this.content);\n this.setMaxHeight();\n }\n else {\n this.setContent();\n }\n }\n else if (!isNullOrUndefined(this.contentEle)) {\n this.element.removeChild(this.contentEle);\n }\n break;\n case 'header':\n if (this.header === '') {\n detach(this.headerEle);\n }\n else {\n this.element.getElementsByClassName(DLG_HEADER).length > 0 ?\n this.element.getElementsByClassName(DLG_HEADER)[0].innerHTML = this.header\n : this.setHeader();\n }\n break;\n case 'footerTemplate':\n this.element.getElementsByClassName(DLG_FOOTER_CONTENT).length > 0 ?\n this.ftrTemplateContent.innerHTML = this.footerTemplate : this.setFooterTemplate();\n break;\n case 'showCloseIcon':\n if (this.element.getElementsByClassName(DLG_CLOSE_ICON).length > 0) {\n if (!this.showCloseIcon && this.header === '') {\n detach(this.headerContent);\n }\n else if (!this.showCloseIcon) {\n detach(this.closeIcon);\n }\n }\n else {\n this.renderCloseIcon();\n this.wireEvents();\n }\n break;\n case 'locale':\n if (this.showCloseIcon) {\n this.closeIconTitle();\n }\n break;\n case 'visible':\n this.visible ? this.show() : this.hide();\n break;\n case 'isModal':\n this.element.setAttribute('aria-modal', this.isModal ? 'true' : 'false');\n if (this.isModal) {\n this.setIsModal();\n this.wireEvents();\n if (!isNullOrUndefined(this.targetEle)) {\n this.isModal ? this.targetEle.appendChild(this.dlgContainer) : this.targetEle.appendChild(this.element);\n }\n }\n else {\n removeClass([this.element], MODAL_DLG);\n removeClass([document.body], 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 break;\n case 'height':\n setStyleAttribute(this.element, { 'height': formatUnit(newProp.height) });\n break;\n case 'width':\n setStyleAttribute(this.element, { 'width': formatUnit(newProp.width) });\n break;\n case 'zIndex':\n this.popupObj.zIndex = this.zIndex;\n if (this.isModal) {\n this.setOverlayZindex();\n }\n break;\n case 'cssClass':\n this.setCSSClass(oldProp.cssClass);\n break;\n case 'animationSettings':\n this.show();\n break;\n case 'buttons':\n if (!isNullOrUndefined(this.buttons[0].buttonModel) && this.footerTemplate === '') {\n if (!isNullOrUndefined(this.ftrTemplateContent)) {\n detach(this.ftrTemplateContent);\n }\n this.setButton();\n }\n break;\n case 'allowDragging':\n if (this.allowDragging && (!this.isModal) && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n else {\n this.dragObj.destroy();\n }\n break;\n case 'target':\n this.popupObj.relateTo = newProp.target;\n break;\n case 'position':\n if (oldProp.position.X === this.position.X && oldProp.position.Y === this.position.Y) {\n break;\n }\n if (this.isModal) {\n this.dlgContainer.classList.remove('e-dlg-' + oldProp.position.X + '-' + oldProp.position.Y);\n this.dlgContainer.classList.add('e-dlg-' + this.position.X + '-' + this.position.Y);\n }\n else {\n this.popupObj.position.X = this.position.X;\n this.popupObj.position.Y = this.position.Y;\n break;\n }\n break;\n case 'enableRtl':\n this.setEnableRTL();\n break;\n }\n }\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Dialog.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * To destroy the widget\n * @method destroy\n * @return {void}\n * @private\n * @memberof dialog\n */\n Dialog.prototype.destroy = function () {\n if (this.element.classList.contains(ROOT)) {\n this.unWireEvents();\n _super.prototype.destroy.call(this);\n var classArray = [\n ROOT, RTL, MODAL_DLG\n ];\n removeClass([this.element, this.element], classArray);\n if (this.popupObj.element.classList.contains(POPUP_ROOT)) {\n this.popupObj.destroy();\n }\n if (!isNullOrUndefined(this.btnObj)) {\n for (var i = void 0; i < this.btnObj.length; i++) {\n this.btnObj[i].destroy();\n }\n }\n if (this.isModal) {\n detach(this.dlgOverlay);\n this.dlgContainer.parentNode.insertBefore(this.element, this.dlgContainer);\n detach(this.dlgContainer);\n }\n this.element.innerHTML = '';\n while (this.element.attributes.length > 0) {\n this.element.removeAttribute(this.element.attributes[0].name);\n }\n for (var k = 0; k < this.clonedEle.attributes.length; k++) {\n this.element.setAttribute(this.clonedEle.attributes[k].name, this.clonedEle.attributes[k].value);\n }\n }\n };\n /**\n * Binding event to the element while widget creation\n * @hidden\n */\n Dialog.prototype.wireEvents = function () {\n if (this.showCloseIcon) {\n EventHandler.add(this.closeIcon, 'click', this.closeIconClickEventHandler, this);\n }\n if (this.isModal) {\n EventHandler.add(this.dlgOverlay, 'click', this.dlgOverlayClickEventHandler, this);\n }\n };\n /**\n * Unbinding event to the element while widget destroy\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 (!isNullOrUndefined(this.buttons[0].buttonModel)) {\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 * Specifies dialog offset x and y position changed dynamically or\n * change the header,footer height or width dynamically, reposition the dialog as per the new changes.\n * @return {void}\n */\n Dialog.prototype.refreshPosition = function () {\n this.popupObj.refreshPosition();\n };\n /**\n * To show the Dialog element on screen.\n * To enable the fullScreen Dialog pass the parameter to 'true'.\n * @param { boolean } isFullScreen - Enable the fullScreen Dialog.\n * @return {void}\n */\n Dialog.prototype.show = function (isFullScreen) {\n if (!this.element.classList.contains(DLG_SHOW) || (!isNullOrUndefined(isFullScreen))) {\n if (!isNullOrUndefined(isFullScreen)) {\n this.fullScreen(isFullScreen);\n }\n var eventArgs = {\n cancel: false,\n container: this.isModal ? this.dlgContainer : this.element\n };\n this.trigger('beforeOpen', eventArgs);\n if (eventArgs.cancel) {\n return;\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 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 this.element.style.position = 'relative';\n addClass([this.targetEle], SCROLL_DISABLED);\n }\n else {\n addClass([document.body], SCROLL_DISABLED);\n }\n }\n var openAnimation = {\n name: this.animationSettings.effect + 'In',\n duration: this.animationSettings.duration,\n delay: this.animationSettings.delay\n };\n this.animationSettings.effect === 'None' ? this.popupObj.show() : this.popupObj.show(openAnimation);\n this.dialogOpen = true;\n this.setProperties({ visible: true }, true);\n }\n };\n /**\n * To hide the Dialog element on screen.\n * @return {void}\n */\n Dialog.prototype.hide = function () {\n var eventArgs = {\n cancel: false,\n container: this.isModal ? this.dlgContainer : this.element\n };\n this.trigger('beforeClose', eventArgs);\n if (eventArgs.cancel) {\n return;\n }\n if (this.isModal) {\n this.dlgOverlay.style.display = 'none';\n !isNullOrUndefined(this.targetEle) ? removeClass([this.targetEle], SCROLL_DISABLED) :\n removeClass([document.body], SCROLL_DISABLED);\n }\n var closeAnimation = {\n name: this.animationSettings.effect + 'Out',\n duration: this.animationSettings.duration,\n delay: this.animationSettings.delay\n };\n this.animationSettings.effect === 'None' ? this.popupObj.hide() : this.popupObj.hide(closeAnimation);\n this.dialogOpen = false;\n this.setProperties({ visible: false }, true);\n };\n /**\n * Specifies to view the Full screen Dialog.\n * @private\n */\n Dialog.prototype.fullScreen = function (args) {\n var top = this.element.offsetTop;\n var left = this.element.offsetLeft;\n if (args) {\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], 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], SCROLL_DISABLED);\n if (this.allowDragging && (!this.isModal) && (!isNullOrUndefined(this.headerContent))) {\n this.setAllowDragging();\n }\n }\n return args;\n };\n __decorate([\n Property('')\n ], Dialog.prototype, \"content\", 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('auto')\n ], Dialog.prototype, \"height\", 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, \"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 Dialog = __decorate([\n NotifyPropertyChanges\n ], Dialog);\n return Dialog;\n}(Component));\nexport { Dialog };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from '@syncfusion/ej2-base';\nimport { EventHandler, Touch, Browser, Animation as PopupAnimation } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, getUniqueID, formatUnit } from '@syncfusion/ej2-base';\nimport { attributes, createElement, closest, removeClass, addClass, remove } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, Complex } from '@syncfusion/ej2-base';\nimport { Popup } from '../popup/popup';\nimport { calculatePosition } from '../common/position';\nimport { isCollide, fit } 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 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 /**\n * Constructor for creating the Tooltip Component\n */\n function Tooltip(options, element) {\n return _super.call(this, options, element) || this;\n }\n Tooltip.prototype.initialize = function () {\n this.formatPosition();\n addClass([this.element], ROOT);\n };\n Tooltip.prototype.formatPosition = function () {\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 var _a, _b;\n };\n Tooltip.prototype.renderArrow = function () {\n this.setTipClass(this.position);\n var tip = createElement('div', { className: ARROW_TIP + ' ' + this.tipClass });\n tip.appendChild(createElement('div', { className: ARROW_TIP_OUTER + ' ' + this.tipClass }));\n tip.appendChild(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.popupObj = new Popup(this.tooltipEle, {\n height: this.height,\n width: this.width,\n position: {\n X: elePos.left,\n Y: elePos.top\n },\n enableRtl: this.enableRtl,\n open: this.openPopupHandler.bind(this),\n close: this.closePopupHandler.bind(this)\n });\n };\n Tooltip.prototype.getTooltipPosition = function (target) {\n var pos = calculatePosition(target, this.tooltipPositionX, this.tooltipPositionY);\n var offsetPos = this.calculateTooltipOffset(this.position);\n var elePos = this.collisionFlipFit(target, pos.left + offsetPos.left, pos.top + offsetPos.top);\n return elePos;\n };\n Tooltip.prototype.reposition = function (target) {\n var elePos = this.getTooltipPosition(target);\n this.popupObj.position = { X: elePos.left, Y: elePos.top };\n this.popupObj.dataBind();\n };\n Tooltip.prototype.openPopupHandler = function () {\n this.trigger('afterOpen', this.tooltipEventArgs);\n };\n Tooltip.prototype.closePopupHandler = function () {\n this.clear();\n this.trigger('afterClose', this.tooltipEventArgs);\n };\n Tooltip.prototype.calculateTooltipOffset = function (position) {\n var pos = { top: 0, left: 0 };\n var tooltipEleWidth = this.tooltipEle.offsetWidth;\n var tooltipEleHeight = this.tooltipEle.offsetHeight;\n var arrowEle = this.tooltipEle.querySelector('.' + ARROW_TIP);\n var tipWidth = arrowEle ? arrowEle.offsetWidth : 0;\n var tipHeight = arrowEle ? arrowEle.offsetHeight : 0;\n var tipAdjust = (this.showTipPointer ? SHOW_POINTER_TIP_GAP : HIDE_POINTER_TIP_GAP);\n var tipHeightAdjust = (tipHeight / 2) + POINTER_ADJUST + (this.tooltipEle.offsetHeight - this.tooltipEle.clientHeight);\n var tipWidthAdjust = (tipWidth / 2) + POINTER_ADJUST + (this.tooltipEle.offsetWidth - this.tooltipEle.clientWidth);\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 = this.tooltipEle.querySelectorAll('.' + ARROW_TIP + ',.' + ARROW_TIP_OUTER + ',.' + ARROW_TIP_INNER);\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 if (this.showTipPointer === false) {\n return;\n }\n this.updateTipPosition(position);\n var leftValue;\n var topValue;\n var tooltipWidth = this.tooltipEle.clientWidth;\n var tooltipHeight = this.tooltipEle.clientHeight;\n var arrowEle = this.tooltipEle.querySelector('.' + ARROW_TIP);\n var arrowInnerELe = this.tooltipEle.querySelector('.' + ARROW_TIP_INNER);\n var tipWidth = arrowEle.offsetWidth;\n var tipHeight = arrowEle.offsetHeight;\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 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 {\n leftValue = ((tooltipWidth / 2) - (tipWidth / 2)) + 'px';\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 = this.tooltipEle.querySelector('.' + CONTENT);\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 if (typeof (this.content) === 'string') {\n tooltipContent.innerHTML = this.content;\n }\n else {\n while (tooltipContent.firstChild) {\n tooltipContent.removeChild(tooltipContent.firstChild);\n }\n tooltipContent.appendChild(this.content);\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 return;\n }\n var tipClose = 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) {\n return;\n }\n var targetList = [].slice.call(document.querySelectorAll('[data-tooltip-id= ' + this.ctrlId + '_content]'));\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 this.wireMouseEvents(e, target);\n };\n Tooltip.prototype.showTooltip = function (target, showAnimation, e) {\n var _this = this;\n clearTimeout(this.showTimer);\n clearTimeout(this.hideTimer);\n this.tooltipEventArgs = e ? { type: e.type, cancel: false, target: target, event: e, element: this.tooltipEle } :\n { type: null, cancel: false, target: target, event: null, element: this.tooltipEle };\n this.trigger('beforeRender', this.tooltipEventArgs);\n if (this.tooltipEventArgs.cancel) {\n this.isHidden = true;\n this.clear();\n return;\n }\n this.isHidden = false;\n if (isNullOrUndefined(this.tooltipEle)) {\n this.ctrlId = this.element.getAttribute('id') ? getUniqueID(this.element.getAttribute('id')) : getUniqueID('tooltip');\n this.tooltipEle = createElement('div', {\n className: TOOLTIP_WRAP + ' ' + POPUP_ROOT, attrs: {\n role: 'tooltip', 'aria-hidden': 'false', 'id': this.ctrlId + '_content'\n }, styles: 'width:' + formatUnit(this.width) + ';height:' + formatUnit(this.height) + ';position:absolute;'\n });\n if (this.cssClass) {\n addClass([this.tooltipEle], this.cssClass.split(' '));\n }\n if (Browser.isDevice) {\n addClass([this.tooltipEle], DEVICE);\n }\n if (this.width !== 'auto') {\n this.tooltipEle.style.maxWidth = formatUnit(this.width);\n }\n this.tooltipEle.appendChild(createElement('div', { className: CONTENT }));\n document.body.appendChild(this.tooltipEle);\n this.addDescribedBy(target, this.ctrlId + '_content');\n this.renderContent(target);\n addClass([this.tooltipEle], POPUP_OPEN);\n if (this.showTipPointer) {\n this.renderArrow();\n }\n this.renderCloseIcon();\n this.renderPopup(target);\n }\n else {\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 }\n removeClass([this.tooltipEle], POPUP_OPEN);\n addClass([this.tooltipEle], POPUP_CLOSE);\n this.tooltipEventArgs = e ? { type: e.type, cancel: false, target: target, event: e, element: this.tooltipEle } :\n { type: null, cancel: false, target: target, event: null, element: this.tooltipEle };\n this.trigger('beforeOpen', this.tooltipEventArgs);\n if (this.tooltipEventArgs.cancel) {\n this.isHidden = true;\n this.clear();\n return;\n }\n var openAnimation = {\n name: showAnimation.effect, duration: showAnimation.duration, delay: showAnimation.delay, timingFunction: 'easeOut'\n };\n if (showAnimation.effect === 'None') {\n openAnimation = undefined;\n }\n if (this.openDelay > 0) {\n var show = function () {\n if (_this.popupObj) {\n _this.popupObj.show(openAnimation);\n }\n };\n this.showTimer = setTimeout(show, this.openDelay);\n }\n else {\n this.popupObj.show(openAnimation);\n }\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.target ? this.element : null), 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.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 (elePos.position !== newpos) {\n var pos = calculatePosition(target, this.tooltipPositionX, elePos.vertical);\n this.adjustArrow(target, newpos, elePos.horizontal, elePos.vertical);\n var offsetPos = this.calculateTooltipOffset(newpos);\n elePos.position = newpos;\n elePos.left = pos.left + offsetPos.left;\n elePos.top = pos.top + offsetPos.top;\n }\n else {\n this.adjustArrow(target, newpos, elePos.horizontal, elePos.vertical);\n }\n var eleOffset = { left: elePos.left, top: elePos.top };\n var left = fit(this.tooltipEle, (this.target ? this.element : null), { X: true, Y: false }, eleOffset).left;\n if (this.showTipPointer && (newpos.indexOf('Bottom') === 0 || newpos.indexOf('Top') === 0)) {\n var arrowEle = this.tooltipEle.querySelector('.' + ARROW_TIP);\n var arrowleft = parseInt(arrowEle.style.left, 10) - (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 eleOffset.left = left;\n return eleOffset;\n };\n Tooltip.prototype.hideTooltip = function (hideAnimation, e, targetElement) {\n var _this = this;\n var target;\n if (e) {\n target = this.target ? (targetElement || e.target) : this.element;\n this.tooltipEventArgs = {\n type: e.type, cancel: false, target: target, event: e, element: this.tooltipEle\n };\n }\n else {\n target = document.querySelector('[data-tooltip-id= ' + this.ctrlId + '_content]');\n this.tooltipEventArgs = {\n type: null, cancel: false, target: target, event: null, element: this.tooltipEle\n };\n }\n if (isNullOrUndefined(target)) {\n return;\n }\n this.trigger('beforeClose', this.tooltipEventArgs);\n if (!this.tooltipEventArgs.cancel) {\n this.restoreElement(target);\n this.isHidden = true;\n var closeAnimation_1 = {\n name: hideAnimation.effect, duration: hideAnimation.duration, delay: hideAnimation.delay, timingFunction: 'easeIn'\n };\n if (hideAnimation.effect === 'None') {\n closeAnimation_1 = undefined;\n }\n if (this.closeDelay > 0) {\n var hide = function () {\n if (_this.popupObj) {\n _this.popupObj.hide(closeAnimation_1);\n }\n };\n this.hideTimer = setTimeout(hide, this.closeDelay);\n }\n else {\n this.popupObj.hide(closeAnimation_1);\n }\n }\n else {\n this.isHidden = false;\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 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.onMouseOut = function (e) {\n this.hideTooltip(this.animation.close, e);\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 pos = this.calculateTooltipOffset(this.position);\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);\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) {\n this.close();\n }\n };\n Tooltip.prototype.scrollHandler = function (e) {\n if (this.tooltipEle) {\n this.close();\n }\n };\n /**\n * Core method that initializes the control rendering.\n * @private\n */\n Tooltip.prototype.render = function () {\n this.initialize();\n this.wireEvents(this.opensOn);\n };\n /**\n * Initializes the values of private members.\n * @private\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 * @hidden\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', this.scrollHandler, 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(this.element.querySelectorAll(this.target));\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, 'focus', 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 === 'mouseover') {\n EventHandler.add(target, 'mouseleave', this.onMouseOut, this);\n }\n }\n if (this.mouseTrail) {\n EventHandler.add(target, 'mousemove touchstart mouseenter', this.onMouseMove, this);\n }\n }\n };\n /**\n * Unbinding events from the element on widget destroy.\n * @hidden\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', this.scrollHandler);\n EventHandler.remove(document, 'keydown', this.keyDown);\n };\n Tooltip.prototype.unwireFocusEvents = function () {\n if (!isNullOrUndefined(this.target)) {\n var targetList = [].slice.call(this.element.querySelectorAll(this.target));\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, 'focus', 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 }\n if (opensOn === 'Hover' && !Browser.isDevice) {\n EventHandler.remove(target, 'mouseleave', this.onMouseOut);\n }\n }\n }\n if (this.mouseTrail) {\n EventHandler.remove(target, 'mousemove touchstart mouseenter', this.onMouseMove);\n }\n };\n /**\n * Core method to return the component name.\n * @private\n */\n Tooltip.prototype.getModuleName = function () {\n return 'tooltip';\n };\n /**\n * Returns the properties to be maintained in the persisted state.\n * @private\n */\n Tooltip.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Called internally, if any of the property value changed.\n * @private\n */\n Tooltip.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 if (this.tooltipEle) {\n this.tooltipEle.style.width = formatUnit(newProp.width);\n }\n break;\n case 'height':\n if (this.tooltipEle) {\n this.tooltipEle.style.height = formatUnit(newProp.height);\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 var target = document.querySelector('[data-tooltip-id= ' + this.ctrlId + '_content]');\n if (this.tooltipEle && target) {\n var arrowInnerELe = this.tooltipEle.querySelector('.' + ARROW_TIP_INNER);\n arrowInnerELe.style.top = arrowInnerELe.style.left = null;\n this.reposition(target);\n }\n break;\n case 'tipPointerPosition':\n var trgt = document.querySelector('[data-tooltip-id= ' + this.ctrlId + '_content]');\n if (this.tooltipEle && trgt) {\n this.reposition(trgt);\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 }\n }\n };\n /**\n * It is used to show the Tooltip on the specified target with specific animation settings.\n * @param element Target element where the Tooltip is to be displayed.\n * @param animation Sets the specific animation, while showing the Tooltip on the screen.\n * @return {void}\n */\n Tooltip.prototype.open = function (element, animation) {\n if (animation === void 0) { animation = this.animation.open; }\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 * @param animation Sets the specific animation when hiding Tooltip from the screen.\n * @return {void}\n */\n Tooltip.prototype.close = function (animation) {\n if (animation === void 0) { animation = this.animation.close; }\n this.hideTooltip(animation);\n };\n /**\n * It is used to refresh the Tooltip content and its position.\n * @param target Target element where the Tooltip content or position needs to be refreshed.\n * @return {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 };\n /**\n * It is used to destroy the Tooltip component.\n * @method destroy\n * @return {void}\n * @memberof Tooltip\n */\n Tooltip.prototype.destroy = function () {\n _super.prototype.destroy.call(this);\n removeClass([this.element], ROOT);\n this.unwireEvents(this.opensOn);\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 __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()\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('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(false)\n ], Tooltip.prototype, \"enableRtl\", 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","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { createElement, attributes, addClass, removeClass, setStyleAttribute, detach } 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 = '.';\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 function NumericTextBox(options, element) {\n return _super.call(this, options, element) || this;\n }\n NumericTextBox.prototype.preRender = function () {\n this.isPrevFocused = false;\n this.decimalSeparator = '.';\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 this.angularTagName = null;\n if (this.element.tagName === 'EJS-NUMERICTEXTBOX') {\n this.angularTagName = this.element.tagName;\n var input = createElement('input');\n var index = 0;\n for (index; index < this.element.attributes.length; index++) {\n input.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);\n input.innerHTML = this.element.innerHTML;\n }\n this.element.parentNode.appendChild(input);\n this.element.parentNode.removeChild(this.element);\n this.element = input;\n setValue('ej2_instances', ejInstance, this.element);\n }\n attributes(this.element, { 'role': 'spinbutton', 'tabindex': '0', 'autocomplete': 'off', 'aria-live': 'assertive' });\n var localeText = { incrementTitle: 'Increment value', decrementTitle: 'Decrement value', placeholder: '' };\n this.l10n = new L10n('numerictextbox', localeText, this.locale);\n this.isValidState = true;\n this.inputStyle = null;\n this.inputName = null;\n this.cultureInfo = {};\n this.initCultureInfo();\n this.initCultureFunc();\n this.checkAttributes();\n this.prevValue = this.value;\n this.validateMinMax();\n this.validateStep();\n if (this.placeholder === null) {\n this.updatePlaceholder();\n }\n };\n /**\n * To Initialize the control rendering\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 if (!isNullOrUndefined(this.width)) {\n setStyleAttribute(this.container, { 'width': formatUnit(this.width) });\n }\n if (!this.container.classList.contains('e-input-group')) {\n this.container.classList.add('e-input-group');\n }\n this.changeValue(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 }\n };\n NumericTextBox.prototype.checkAttributes = function () {\n var attributes = ['value', 'min', 'max', 'step', 'disabled', 'readonly', 'style', 'name'];\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 var enabled = this.element.getAttribute(prop) === 'disabled' ||\n this.element.getAttribute(prop) === 'true' ? false : true;\n this.setProperties({ enabled: enabled }, true);\n break;\n case 'readonly':\n var readonly = this.element.getAttribute(prop) === 'readonly'\n || this.element.getAttribute(prop) === 'true' ? true : false;\n this.setProperties({ readonly: readonly }, true);\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 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 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 inputObj = Input.createInput({\n element: this.element,\n customTag: this.angularTagName,\n floatLabelType: this.floatLabelType,\n properties: {\n readonly: this.readonly,\n placeholder: this.placeholder,\n cssClass: this.cssClass,\n enableRtl: this.enableRtl,\n showClearButton: this.showClearButton,\n enabled: this.enabled\n }\n });\n this.inputWrapper = inputObj;\n this.container = inputObj.container;\n this.container.setAttribute('class', ROOT + ' ' + this.container.getAttribute('class'));\n if (this.readonly) {\n attributes(this.element, { 'aria-readonly': 'true' });\n }\n this.hiddenInput = (createElement('input', { attrs: { type: 'hidden' } }));\n this.inputName = this.inputName !== null ? this.inputName : this.element.id;\n this.element.removeAttribute('name');\n attributes(this.hiddenInput, { 'name': this.inputName });\n this.container.insertBefore(this.hiddenInput, this.container.childNodes[1]);\n if (this.inputStyle !== null) {\n attributes(this.container, { 'style': this.inputStyle });\n }\n };\n /* Spinner creation */\n NumericTextBox.prototype.spinBtnCreation = function () {\n this.spinDown = Input.appendSpan(SPINICON + ' ' + SPINDOWN, this.container);\n attributes(this.spinDown, {\n 'title': this.l10n.getConstant('decrementTitle'),\n 'aria-label': this.l10n.getConstant('decrementTitle')\n });\n this.spinUp = Input.appendSpan(SPINICON + ' ' + SPINUP, this.container);\n attributes(this.spinUp, {\n 'title': this.l10n.getConstant('incrementTitle'),\n 'aria-label': 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 attributes(this.element, { 'aria-valuemin': this.min.toString(), 'aria-valuemax': this.max.toString() });\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'))) {\n this.clear(e);\n }\n };\n NumericTextBox.prototype.clear = function (event) {\n this.setProperties({ value: null }, true);\n this.setElementValue('');\n };\n NumericTextBox.prototype.wireEvents = function () {\n EventHandler.add(this.element, 'focus', this.focusIn, this);\n EventHandler.add(this.element, 'blur', this.focusOut, this);\n EventHandler.add(this.element, 'keydown', this.keyDownHandler, 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 }\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.focusIn);\n EventHandler.remove(this.element, 'blur', this.focusOut);\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 };\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 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 if (this.prevValue !== this.value) {\n var eventArgs = {};\n this.changeEventArgs = { value: this.value, previousValue: this.prevValue, isInteraction: this.isInteract, event: event };\n if (event) {\n this.changeEventArgs.event = event;\n }\n merge(eventArgs, this.changeEventArgs);\n this.prevValue = this.value;\n this.isInteract = false;\n this.trigger('change', eventArgs);\n }\n };\n NumericTextBox.prototype.pasteHandler = function () {\n var _this = this;\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.keyDownHandler = function (event) {\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 if (!this.element.value.length) {\n this.setProperties({ value: null }, true);\n this.isKeyDown = true;\n this.updateValue(this.instance.getNumberParser({ format: 'n' })(this.element.value));\n this.isKeyDown = false;\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 ;\n NumericTextBox.prototype.correctRounding = function (value, step, result) {\n var floatExp = new RegExp('[,.](.*)');\n var valueText = value.toString();\n var stepText = step.toString();\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 ;\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 ;\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.changeValue(value === null || isNaN(value) ? null : this.strictMode ? this.trimValue(value) : value);\n if (!this.isKeyDown) {\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 = void 0;\n var decimalPart = value.toString().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 this.setProperties({ value: this.roundNumber(value, numberOfDecimals) }, true);\n }\n this.modifyText();\n if (!this.strictMode) {\n this.validateState();\n }\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 = value;\n }\n else {\n this.setElementValue('');\n this.element.removeAttribute('aria-valuenow');\n this.hiddenInput.value = null;\n }\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.formatNumber = function () {\n var numberOfDecimals;\n var currentValue = this.value;\n var decimalPart = currentValue.toString().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 this.instance.getNumberFormat({\n maximumFractionDigits: numberOfDecimals,\n minimumFractionDigits: numberOfDecimals, useGrouping: false\n })(this.value);\n };\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 ;\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 ;\n NumericTextBox.prototype.cancelEvent = function (event) {\n event.preventDefault();\n return false;\n };\n NumericTextBox.prototype.keyPressHandler = function (event) {\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 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 return true;\n }\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) {\n return INTREGEXP;\n }\n if (this.decimals && this.validateDecimalOnType) {\n fractionRule = '{0,' + this.decimals + '}';\n }\n return new RegExp('^(-)?(((\\\\d+(' + decimalSeparator + '\\\\d' + fractionRule +\n ')?)|(' + decimalSeparator + '\\\\d' + fractionRule + ')))?$');\n };\n ;\n NumericTextBox.prototype.mouseWheel = function (event) {\n event.preventDefault();\n var delta;\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.focusIn = function (event) {\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 = this.formatNumber();\n this.setElementValue(formatValue);\n if (!this.isPrevFocused) {\n this.element.setSelectionRange(0, formatValue.length);\n }\n }\n if (!Browser.isDevice) {\n EventHandler.add(this.element, 'mousewheel DOMMouseScroll', this.mouseWheel, this);\n }\n };\n ;\n NumericTextBox.prototype.focusOut = function (event) {\n var _this = this;\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 };\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 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 () { _this.isCalled = true; _this.action(action, event); }, 150);\n EventHandler.add(document, 'mouseup', this.mouseUpClick, this);\n };\n NumericTextBox.prototype.touchMoveOnSpinner = function (event) {\n var target = document.elementFromPoint(event.clientX, event.clientY);\n if (!(target.classList.contains(SPINICON))) {\n clearInterval(this.timeOut);\n }\n };\n NumericTextBox.prototype.mouseUpOnSpinner = function (event) {\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 };\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.mouseUpClick = function (event) {\n event.stopPropagation();\n clearInterval(this.timeOut);\n this.isCalled = false;\n EventHandler.remove(this.spinUp, 'mouseleave', this.mouseUpClick);\n EventHandler.remove(this.spinDown, 'mouseleave', this.mouseUpClick);\n };\n /**\n * Increments the NumericTextBox value with the specified step value.\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 */\n NumericTextBox.prototype.increment = function (step) {\n if (step === void 0) { step = this.step; }\n this.changeValue(this.performAction(this.value, step, INCREMENT));\n };\n /**\n * Decrements the NumericTextBox value with specified step value.\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 */\n NumericTextBox.prototype.decrement = function (step) {\n if (step === void 0) { step = this.step; }\n this.changeValue(this.performAction(this.value, step, DECREMENT));\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 * @method destroy\n * @return {void}\n */\n NumericTextBox.prototype.destroy = function () {\n this.unwireEvents();\n detach(this.hiddenInput);\n if (this.showSpinButton) {\n this.unwireSpinBtnEvents();\n detach(this.spinUp);\n detach(this.spinDown);\n }\n this.container.parentElement.appendChild(this.cloneElement);\n detach(this.container);\n _super.prototype.destroy.call(this);\n };\n /**\n * Returns the value of NumericTextBox with the format applied to the NumericTextBox.\n */\n NumericTextBox.prototype.getText = function () {\n return this.element.value;\n };\n /**\n * Gets the properties to be maintained in the persisted state.\n * @return {string}\n */\n NumericTextBox.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Calls internally if any of the property value is changed.\n * @private\n */\n NumericTextBox.prototype.onPropertyChanged = function (newProp, oldProp) {\n var elementVal;\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.container, { 'width': formatUnit(newProp.width) });\n break;\n case 'cssClass':\n Input.setCssClass(newProp.cssClass, [this.container], oldProp.cssClass);\n break;\n case 'enabled':\n Input.setEnabled(newProp.enabled, this.element);\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 'placeholder':\n Input.setPlaceholder(newProp.placeholder, this.element);\n break;\n case 'step':\n this.step = newProp.step;\n this.validateStep();\n break;\n case 'showSpinButton':\n if (newProp.showSpinButton) {\n this.spinBtnCreation();\n }\n else {\n detach(this.spinUp);\n detach(this.spinDown);\n }\n break;\n case 'showClearButton':\n Input.setClearButton(newProp.showClearButton, this.element, this.inputWrapper);\n break;\n case 'value':\n this.updateValue(newProp.value);\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 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 this.updatePlaceholder();\n Input.setPlaceholder(this.placeholder, this.element);\n this.updateValue(this.value);\n break;\n case 'currency':\n var propVal = getValue(prop, newProp);\n this.setProperties({ currencyCode: propVal }, true);\n this.updateCurrency(prop, propVal);\n break;\n case 'currencyCode':\n var propValue = getValue(prop, newProp);\n this.setProperties({ currency: propValue }, true);\n this.updateCurrency('currency', propValue);\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 /**\n * Gets 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(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, \"enableRtl\", 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 NumericTextBox = __decorate([\n NotifyPropertyChanges\n ], NumericTextBox);\n return NumericTextBox;\n}(Component));\nexport { NumericTextBox };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 { selectAll, select, createElement, Base } from '@syncfusion/ej2-base';\nimport { extend, isNullOrUndefined, EventHandler } from '@syncfusion/ej2-base';\nimport { Property, NotifyPropertyChanges, Event } from '@syncfusion/ej2-base';\n/**\n * global declarations\n */\nvar VALIDATE_EMAIL = new RegExp('^[A-Za-z0-9._%+-]{3,}@[a-zA-Z]{3,}([.]{1}[a-zA-Z]{2,5}' +\n '|[.]{1}[a-zA-Z]{2,4}[.]{1}[a-zA-Z]{2,4})$');\nvar VALIDATE_URL = new RegExp('^((ftp|http|https):\\/\\/)?www\\.([A-z]{2,})\\.([A-z]{2,})$');\nvar VALIDATE_DATE_ISO = new RegExp('^([0-9]{4})-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$');\nvar VALIDATE_DIGITS = new RegExp('^[0-9]*$');\nvar VALIDATE_PHONE = new RegExp('^[+]?[0-9]{9,13}$');\nvar VALIDATE_CREDITCARD = new RegExp('^\\\\d{13,16}$');\n/**\n * ErrorOption values\n * @private\n */\nexport var ErrorOption;\n(function (ErrorOption) {\n ErrorOption[ErrorOption[\"Message\"] = 0] = \"Message\";\n ErrorOption[ErrorOption[\"Label\"] = 1] = \"Label\";\n})(ErrorOption || (ErrorOption = {}));\n/**\n * FormValidator class enables you to validate the form fields based on your defined rules\n * ```html\n * \n * \n * ```\n */\nvar FormValidator = /** @class */ (function (_super) {\n __extends(FormValidator, _super);\n // Initializes the FormValidator \n function FormValidator(element, options) {\n var _this = _super.call(this, options, element) || this;\n _this.validated = [];\n _this.errorRules = [];\n _this.allowSubmit = false;\n _this.required = 'required';\n _this.infoElement = null;\n _this.inputElement = null;\n _this.selectQuery = 'input:not([type=reset]):not([type=button]), select, textarea';\n /**\n * Specifies the default messages for validation rules.\n * @default : { List of validation message };\n */\n _this.defaultMessages = {\n required: 'This field is required.',\n email: 'Please enter a valid email address.',\n url: 'Please enter a valid URL.',\n date: 'Please enter a valid date.',\n dateIso: 'Please enter a valid date ( ISO ).',\n creditcard: 'Please enter valid card number',\n number: 'Please enter a valid number.',\n digits: 'Please enter only digits.',\n maxLength: 'Please enter no more than {0} characters.',\n minLength: 'Please enter at least {0} characters.',\n rangeLength: 'Please enter a value between {0} and {1} characters long.',\n range: 'Please enter a value between {0} and {1}.',\n max: 'Please enter a value less than or equal to {0}.',\n min: 'Please enter a value greater than or equal to {0}.',\n regex: 'Please enter a correct value.',\n tel: 'Please enter a valid phone number.',\n pattern: 'Please enter a correct pattern value.',\n equalTo: 'Please enter the valid match text',\n };\n if (typeof _this.rules === 'undefined') {\n _this.rules = {};\n }\n element = typeof element === 'string' ? select(element, document) : element;\n // Set novalidate to prevent default HTML5 form validation\n if (_this.element != null) {\n _this.element.setAttribute('novalidate', '');\n _this.inputElements = selectAll(_this.selectQuery, _this.element);\n _this.createHTML5Rules();\n _this.wireEvents();\n }\n else {\n return undefined;\n }\n return _this;\n }\n FormValidator_1 = FormValidator;\n /**\n * Add validation rules to the corresponding input element based on `name` attribute.\n * @param {string} name `name` of form field.\n * @param {Object} rules Validation rules for the corresponding element.\n * @return {void}\n */\n FormValidator.prototype.addRules = function (name, rules) {\n if (name) {\n if (this.rules.hasOwnProperty(name)) {\n extend(this.rules[name], rules, {});\n }\n else {\n this.rules[name] = rules;\n }\n }\n };\n /**\n * Remove validation to the corresponding field based on name attribute.\n * When no parameter is passed, remove all the validations in the form.\n * @param {string} name Input name attribute value.\n * @param {string[]} rules List of validation rules need to be remove from the corresponding element.\n * @return {void}\n */\n FormValidator.prototype.removeRules = function (name, rules) {\n if (!name && !rules) {\n this.rules = {};\n }\n else if (this.rules[name] && !rules) {\n delete this.rules[name];\n }\n else if (!isNullOrUndefined(this.rules[name] && rules)) {\n for (var i = 0; i < rules.length; i++) {\n delete this.rules[name][rules[i]];\n }\n }\n else {\n return;\n }\n };\n /**\n * Validate the current form values using defined rules.\n * Returns `true` when the form is valid otherwise `false`\n * @param {string} selected - Optional parameter to validate specified element.\n * @return {boolean}\n */\n FormValidator.prototype.validate = function (selected) {\n var rules = Object.keys(this.rules);\n if (selected && rules.length) {\n this.validateRules(selected);\n //filter the selected element it don't have any valid input element\n return rules.indexOf(selected) !== -1 && this.errorRules.filter(function (data) {\n return data.name === selected;\n }).length === 0;\n }\n else {\n for (var _i = 0, rules_1 = rules; _i < rules_1.length; _i++) {\n var name_1 = rules_1[_i];\n this.validateRules(name_1);\n }\n return this.errorRules.length === 0;\n }\n };\n /**\n * Reset the value of all the fields in form.\n * @return {void}\n */\n FormValidator.prototype.reset = function () {\n this.element.reset();\n this.clearForm();\n };\n /**\n * Get input element by name.\n * @param {string} name - Input element name attribute value.\n * @return {HTMLInputElement}\n */\n FormValidator.prototype.getInputElement = function (name) {\n this.inputElement = (select('[name=' + name + ']', this.element));\n return this.inputElement;\n };\n /**\n * Destroy the form validator object and error elements.\n * @return {void}\n */\n FormValidator.prototype.destroy = function () {\n this.reset();\n this.unwireEvents();\n this.rules = {};\n var elements = selectAll('.' + this.errorClass + ', .' + this.validClass, this.element);\n for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {\n var element = elements_1[_i];\n element.remove();\n }\n _super.prototype.destroy.call(this);\n };\n /**\n * @private\n */\n FormValidator.prototype.onPropertyChanged = function (newProp, oldProp) {\n // No code are needed\n };\n ;\n /**\n * @private\n */\n FormValidator.prototype.getModuleName = function () {\n return 'formValidator';\n };\n FormValidator.prototype.clearForm = function () {\n this.errorRules = [];\n this.validated = [];\n var elements = selectAll(this.selectQuery, this.element);\n for (var _i = 0, elements_2 = elements; _i < elements_2.length; _i++) {\n var element = elements_2[_i];\n var input = element;\n input.removeAttribute('aria-invalid');\n input.classList.remove(this.errorClass);\n if (input.name.length > 0) {\n this.getInputElement(input.name);\n this.getErrorElement(input.name);\n this.hideMessage(input.name);\n }\n input.classList.remove(this.validClass);\n }\n };\n FormValidator.prototype.createHTML5Rules = function () {\n var defRules = ['required', 'regex', 'rangeLength', 'maxLength', 'minLength', 'dateIso', 'digits', 'pattern',\n 'data-val-required', 'type', 'data-validation', 'min', 'max', 'range', 'equalTo', 'data-val-minlength-min',\n 'data-val-equalto-other', 'data-val-maxlength-max', 'data-val-range-min', 'data-val-regex-pattern', 'data-val-length-max',\n 'data-val-creditcard', 'data-val-phone'];\n var acceptedTypes = ['email', 'url', 'date', 'number', 'tel'];\n for (var _i = 0, _a = (this.inputElements); _i < _a.length; _i++) {\n var input = _a[_i];\n // Default attribute rules \n var allRule = {};\n for (var _b = 0, defRules_1 = defRules; _b < defRules_1.length; _b++) {\n var rule = defRules_1[_b];\n if (input.getAttribute(rule) !== null) {\n switch (rule) {\n case 'required':\n this.defRule(input, allRule, rule, input.required);\n break;\n case 'data-validation':\n rule = input.getAttribute(rule);\n this.defRule(input, allRule, rule, true);\n break;\n case 'type':\n if (acceptedTypes.indexOf(input.type) !== -1) {\n this.defRule(input, allRule, input.type, true);\n }\n break;\n case 'rangeLength':\n case 'range':\n this.defRule(input, allRule, rule, JSON.parse(input.getAttribute(rule)));\n break;\n case 'equalTo':\n var id = input.getAttribute(rule);\n this.defRule(input, allRule, rule, id);\n break;\n default:\n if (input.getAttribute('data-val') === 'true') {\n this.annotationRule(input, allRule, rule, input.getAttribute(rule));\n }\n else {\n this.defRule(input, allRule, rule, input.getAttribute(rule));\n }\n }\n }\n }\n //adding pattern type validation\n if (Object.keys(allRule).length !== 0) {\n this.addRules(input.name, allRule);\n }\n }\n };\n FormValidator.prototype.annotationRule = function (input, ruleCon, ruleName, value) {\n var annotationRule = ruleName.split('-');\n var rulesList = ['required', 'creditcard', 'phone', 'maxlength', 'minlength', 'range', 'regex', 'equalto'];\n var ruleFirstName = annotationRule[annotationRule.length - 1];\n var ruleSecondName = annotationRule[annotationRule.length - 2];\n if (rulesList.indexOf(ruleFirstName) !== -1) {\n switch (ruleFirstName) {\n case 'required':\n this.defRule(input, ruleCon, 'required', value);\n break;\n case 'creditcard':\n this.defRule(input, ruleCon, 'creditcard', value);\n break;\n case 'phone':\n this.defRule(input, ruleCon, 'tel', value);\n break;\n }\n }\n else if (rulesList.indexOf(ruleSecondName) !== -1) {\n switch (ruleSecondName) {\n case 'maxlength':\n this.defRule(input, ruleCon, 'maxLength', value);\n break;\n case 'minlength':\n this.defRule(input, ruleCon, 'minLength', value);\n break;\n case 'range':\n var minvalue = input.getAttribute('data-val-range-min');\n var maxvalue = input.getAttribute('data-val-range-max');\n this.defRule(input, ruleCon, 'range', [minvalue, maxvalue]);\n break;\n case 'equalto':\n var id = input.getAttribute(ruleName).split('.');\n this.defRule(input, ruleCon, 'equalTo', id[id.length - 1]);\n break;\n case 'regex':\n this.defRule(input, ruleCon, 'regex', value);\n break;\n }\n }\n };\n FormValidator.prototype.defRule = function (input, ruleCon, ruleName, value) {\n var message = input.getAttribute('data-' + ruleName + '-message');\n var annotationMessage = input.getAttribute('data-val-' + ruleName);\n if (message) {\n value = [value, message];\n }\n else if (annotationMessage) {\n value = [value, annotationMessage];\n }\n ruleCon[ruleName] = value;\n };\n // Wire events to the form elements\n FormValidator.prototype.wireEvents = function () {\n for (var _i = 0, _a = (this.inputElements); _i < _a.length; _i++) {\n var input = _a[_i];\n if (FormValidator_1.isCheckable(input)) {\n EventHandler.add(input, 'click', this.clickHandler, this);\n }\n else if (input.tagName === 'SELECT') {\n EventHandler.add(input, 'change', this.changeHandler, this);\n }\n else {\n EventHandler.add(input, 'focusout', this.focusOutHandler, this);\n EventHandler.add(input, 'keyup', this.keyUpHandler, this);\n }\n }\n EventHandler.add(this.element, 'submit', this.submitHandler, this);\n EventHandler.add(this.element, 'reset', this.resetHandler, this);\n };\n // UnWire events to the form elements\n FormValidator.prototype.unwireEvents = function () {\n for (var _i = 0, _a = (this.inputElements); _i < _a.length; _i++) {\n var input = _a[_i];\n EventHandler.clearEvents(input);\n }\n EventHandler.remove(this.element, 'submit', this.submitHandler);\n EventHandler.remove(this.element, 'reset', this.resetHandler);\n };\n // Handle input element focusout event\n FormValidator.prototype.focusOutHandler = function (e) {\n this.trigger('focusout', e);\n //FormValidator.triggerCallback(this.focusout, e);\n var element = e.target;\n if (this.rules[element.name]) {\n if (this.rules[element.name][this.required] || element.value.length > 0) {\n this.validate(element.name);\n }\n else if (this.validated.indexOf(element.name) === -1) {\n this.validated.push(element.name);\n }\n }\n };\n // Handle input element keyup event\n FormValidator.prototype.keyUpHandler = function (e) {\n this.trigger('keyup', e);\n var element = e.target;\n // List of keys need to prevent while validation\n var excludeKeys = [16, 17, 18, 20, 35, 36, 37, 38, 39, 40, 45, 144, 225];\n if (e.which === 9 && (!this.rules[element.name] || (this.rules[element.name] && !this.rules[element.name][this.required]))) {\n return;\n }\n if (this.validated.indexOf(element.name) !== -1 && this.rules[element.name] && excludeKeys.indexOf(e.which) === -1) {\n this.validate(element.name);\n }\n };\n // Handle input click event\n FormValidator.prototype.clickHandler = function (e) {\n this.trigger('click', e);\n var element = e.target;\n // If element type is not submit allow validation\n if (element.type !== 'submit') {\n this.validate(element.name);\n }\n else if (element.getAttribute('formnovalidate') !== null) {\n // Prevent form validation, if submit button has formnovalidate attribute\n this.allowSubmit = true;\n }\n };\n // Handle input change event\n FormValidator.prototype.changeHandler = function (e) {\n this.trigger('change', e);\n var element = e.target;\n this.validate(element.name);\n };\n // Handle form submit event\n FormValidator.prototype.submitHandler = function (e) {\n this.trigger('submit', e);\n //FormValidator.triggerCallback(this.submit, e);\n // Prevent form submit if validation failed\n if (!this.allowSubmit && !this.validate()) {\n e.preventDefault();\n }\n else {\n this.allowSubmit = false;\n }\n };\n // Handle form reset\n FormValidator.prototype.resetHandler = function () {\n this.clearForm();\n };\n // Validate each rule based on input element name\n FormValidator.prototype.validateRules = function (name) {\n if (!this.rules[name]) {\n return;\n }\n var rules = Object.keys(this.rules[name]);\n this.getInputElement(name);\n this.getErrorElement(name);\n for (var _i = 0, rules_2 = rules; _i < rules_2.length; _i++) {\n var rule = rules_2[_i];\n var errorMessage = this.getErrorMessage(this.rules[name][rule], rule);\n var errorRule = { name: name, message: errorMessage };\n var eventArgs = {\n inputName: name,\n element: this.inputElement,\n message: errorMessage\n };\n if (!this.isValid(name, rule) && !this.inputElement.classList.contains(this.ignore)) {\n this.removeErrorRules(name);\n this.errorRules.push(errorRule);\n // Set aria attributes to invalid elements\n this.inputElement.setAttribute('aria-invalid', 'true');\n this.inputElement.setAttribute('aria-describedby', this.inputElement.id + '-info');\n if (!this.infoElement) {\n this.createErrorElement(name, errorRule.message, this.inputElement);\n }\n else {\n this.showMessage(errorRule);\n }\n eventArgs.errorElement = this.infoElement;\n eventArgs.status = 'failure';\n this.inputElement.classList.add(this.errorClass);\n this.inputElement.classList.remove(this.validClass);\n this.trigger('validationComplete', eventArgs);\n // Set aria-required to required rule elements\n if (rule === 'required') {\n this.inputElement.setAttribute('aria-required', 'true');\n }\n break;\n }\n else {\n this.hideMessage(name);\n eventArgs.status = 'success';\n this.trigger('validationComplete', eventArgs);\n }\n }\n };\n // Check the input element whether it's value satisfy the validation rule or not\n FormValidator.prototype.isValid = function (name, rule) {\n var params = this.rules[name][rule];\n var param = (params instanceof Array && typeof params[1] === 'string') ? params[0] : params;\n var currentRule = this.rules[name][rule];\n var args = { value: this.inputElement.value, param: param, element: this.inputElement, formElement: this.element };\n this.trigger('validationBegin', args);\n if (currentRule && typeof currentRule[0] === 'function') {\n var fn = currentRule[0];\n return fn.call(this, { element: this.inputElement, value: this.inputElement.value });\n }\n else if (FormValidator_1.isCheckable(this.inputElement)) {\n if (rule !== 'required') {\n return true;\n }\n return selectAll('input[name=' + name + ']:checked', this.element).length > 0;\n }\n else {\n return FormValidator_1.checkValidator[rule](args);\n }\n };\n // Return default error message or custom error message \n FormValidator.prototype.getErrorMessage = function (ruleValue, rule) {\n var message = (ruleValue instanceof Array && typeof ruleValue[1] === 'string') ? ruleValue[1] : this.defaultMessages[rule];\n var formats = message.match(/{(\\d)}/g);\n if (!isNullOrUndefined(formats)) {\n for (var i = 0; i < formats.length; i++) {\n var value = ruleValue instanceof Array ? ruleValue[i] : ruleValue;\n message = message.replace(formats[i], value);\n }\n }\n return message;\n };\n // Create error element based on name and error message\n FormValidator.prototype.createErrorElement = function (name, message, input) {\n var errorElement = createElement(this.errorElement, {\n className: this.errorClass,\n innerHTML: message,\n attrs: { for: name }\n });\n // Create message design if errorOption is message\n if (this.errorOption === ErrorOption.Message) {\n errorElement.classList.remove(this.errorClass);\n errorElement.classList.add('e-message');\n errorElement = createElement(this.errorContainer, { className: this.errorClass, innerHTML: errorElement.outerHTML });\n }\n errorElement.id = this.inputElement.name + '-info';\n // Append error message into MVC error message element\n if (this.element.querySelector('[data-valmsg-for=\"' + input.id + '\"]')) {\n this.element.querySelector('[data-valmsg-for=\"' + input.id + '\"]').appendChild(errorElement);\n }\n else if (input.hasAttribute('data-msg-containerid') === true) {\n // Append error message into custom div element\n var containerId = input.getAttribute('data-msg-containerid');\n var divElement = this.element.querySelector('#' + containerId);\n divElement.appendChild(errorElement);\n }\n else if (this.customPlacement != null) {\n // Call custom placement function if customPlacement is not null\n this.customPlacement.call(this, this.inputElement, errorElement);\n }\n else {\n this.inputElement.parentNode.insertBefore(errorElement, this.inputElement.nextSibling);\n }\n errorElement.style.display = 'block';\n this.getErrorElement(name);\n this.validated.push(name);\n this.checkRequired(name);\n };\n // Get error element by name\n FormValidator.prototype.getErrorElement = function (name) {\n this.infoElement = select(this.errorElement + '.' + this.errorClass, this.inputElement.parentElement);\n if (!this.infoElement) {\n this.infoElement = select(this.errorElement + '.' + this.errorClass + '[for=\"' + name + '\"]');\n }\n return this.infoElement;\n };\n // Remove existing rule from errorRules object\n FormValidator.prototype.removeErrorRules = function (name) {\n for (var i = 0; i < this.errorRules.length; i++) {\n var rule = this.errorRules[i];\n if (rule.name === name) {\n this.errorRules.splice(i, 1);\n }\n }\n };\n // Show error message to the input element\n FormValidator.prototype.showMessage = function (errorRule) {\n this.infoElement.style.display = 'block';\n this.infoElement.innerHTML = errorRule.message;\n this.checkRequired(errorRule.name);\n };\n // Hide error message based on input name\n FormValidator.prototype.hideMessage = function (name) {\n if (this.infoElement) {\n this.infoElement.style.display = 'none';\n this.removeErrorRules(name);\n this.inputElement.classList.add(this.validClass);\n this.inputElement.classList.remove(this.errorClass);\n this.inputElement.setAttribute('aria-invalid', 'false');\n }\n };\n // Check whether the input element have required rule and its value is not empty\n FormValidator.prototype.checkRequired = function (name) {\n if (!this.rules[name][this.required] && !this.inputElement.value.length) {\n this.infoElement.innerHTML = this.inputElement.value;\n this.infoElement.setAttribute('aria-invalid', 'false');\n this.hideMessage(name);\n }\n };\n // Return boolean result if the input have chekcable or submit types\n FormValidator.isCheckable = function (input) {\n var inputType = input.getAttribute('type');\n return inputType && (inputType === 'checkbox' || inputType === 'radio' || inputType === 'submit');\n };\n // List of function to validate the rules\n FormValidator.checkValidator = {\n required: function (option) {\n return option.value.length > 0;\n },\n email: function (option) {\n return VALIDATE_EMAIL.test(option.value);\n },\n url: function (option) {\n return VALIDATE_URL.test(option.value);\n },\n dateIso: function (option) {\n return VALIDATE_DATE_ISO.test(option.value);\n },\n tel: function (option) {\n return VALIDATE_PHONE.test(option.value);\n },\n creditcard: function (option) {\n return VALIDATE_CREDITCARD.test(option.value);\n },\n number: function (option) {\n return !isNaN(Number(option.value)) && option.value.indexOf(' ') === -1;\n },\n digits: function (option) {\n return VALIDATE_DIGITS.test(option.value);\n },\n maxLength: function (option) {\n return option.value.length <= option.param;\n },\n minLength: function (option) {\n return option.value.length >= option.param;\n },\n rangeLength: function (option) {\n var param = option.param;\n return option.value.length >= param[0] && option.value.length <= param[1];\n },\n range: function (option) {\n var param = option.param;\n return !isNaN(Number(option.value)) && Number(option.value) >= param[0] && Number(option.value) <= param[1];\n },\n date: function (option) {\n return !isNaN(new Date(option.value).getTime());\n },\n max: function (option) {\n if (!isNaN(Number(option.value))) {\n // Maximum rule validation for number\n return +option.value <= option.param;\n }\n // Maximum rule validation for date\n return new Date(option.value).getTime() <= new Date(JSON.parse(JSON.stringify(option.param))).getTime();\n },\n min: function (option) {\n if (!isNaN(Number(option.value))) {\n // Minimum rule validation for number\n return +option.value >= option.param;\n }\n // Minimum rule validation for date\n return new Date(option.value).getTime() >= new Date(JSON.parse(JSON.stringify(option.param))).getTime();\n },\n regex: function (option) {\n return new RegExp(option.param).test(option.value);\n },\n equalTo: function (option) {\n var compareTo = option.formElement.querySelector('#' + option.param);\n option.param = compareTo.value;\n return option.param === option.value;\n },\n };\n __decorate([\n Property('e-hidden')\n ], FormValidator.prototype, \"ignore\", void 0);\n __decorate([\n Property()\n ], FormValidator.prototype, \"rules\", void 0);\n __decorate([\n Property('e-error')\n ], FormValidator.prototype, \"errorClass\", void 0);\n __decorate([\n Property('e-valid')\n ], FormValidator.prototype, \"validClass\", void 0);\n __decorate([\n Property('label')\n ], FormValidator.prototype, \"errorElement\", void 0);\n __decorate([\n Property('div')\n ], FormValidator.prototype, \"errorContainer\", void 0);\n __decorate([\n Property(ErrorOption.Label)\n ], FormValidator.prototype, \"errorOption\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"focusout\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"keyup\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"click\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"submit\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"validationBegin\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"validationComplete\", void 0);\n __decorate([\n Event()\n ], FormValidator.prototype, \"customPlacement\", void 0);\n FormValidator = FormValidator_1 = __decorate([\n NotifyPropertyChanges\n ], FormValidator);\n return FormValidator;\n var FormValidator_1;\n}(Base));\nexport { FormValidator };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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, Event, Property, NotifyPropertyChanges } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, getValue, setValue, addClass, detach, createElement } from '@syncfusion/ej2-base';\nimport { Input } from '../../input/input';\nimport { regularExpressions, createMask, applyMask, wireEvents, unwireEvents, unstrippedValue, strippedValue } from '../base/index';\nimport { setMaskValue, setElementValue } from '../base/index';\nimport { maskInputBlurHandler } from '../base/mask-base';\nvar ROOT = 'e-widget e-control-wrapper e-mask';\nvar INPUT = 'e-input';\n/**\n * The MaskedTextBox allows the user to enter the valid input only based on the provided mask.\n * ```html\n * \n * ```\n * ```typescript\n * \n * ```\n */\nvar MaskedTextBox = /** @class */ (function (_super) {\n __extends(MaskedTextBox, _super);\n function MaskedTextBox(options, element) {\n return _super.call(this, options, element) || this;\n }\n /**\n * Gets the component name\n * @private\n */\n MaskedTextBox.prototype.getModuleName = function () {\n return 'maskedtextbox';\n };\n /**\n * Initializes the event handler\n * @private\n */\n MaskedTextBox.prototype.preRender = function () {\n this.promptMask = '';\n this.hiddenMask = '';\n this.escapeMaskValue = '';\n this.regExpCollec = regularExpressions;\n this.customRegExpCollec = [];\n this.undoCollec = [];\n this.redoCollec = [];\n this.changeEventArgs = {};\n this.focusEventArgs = {};\n this.maskKeyPress = false;\n this.isFocus = false;\n this.isInitial = false;\n this.isIosInvalid = false;\n var ejInstance = getValue('ej2_instances', this.element);\n this.cloneElement = this.element.cloneNode(true);\n this.angularTagName = null;\n if (this.element.tagName === 'EJS-MASKEDTEXTBOX') {\n this.angularTagName = this.element.tagName;\n var input = createElement('input');\n for (var i = 0; i < this.element.attributes.length; i++) {\n input.setAttribute(this.element.attributes[i].nodeName, this.element.attributes[i].nodeValue);\n input.innerHTML = this.element.innerHTML;\n }\n this.element.parentNode.appendChild(input);\n this.element.parentNode.removeChild(this.element);\n this.element = input;\n setValue('ej2_instances', ejInstance, this.element);\n }\n };\n /**\n * Gets the properties to be maintained in the persisted state.\n * @return {string}\n */\n MaskedTextBox.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Initializes the component rendering.\n * @private\n */\n MaskedTextBox.prototype.render = function () {\n if (this.element.tagName.toLowerCase() === 'input') {\n if (this.floatLabelType === 'Never') {\n addClass([this.element], INPUT);\n }\n this.createWrapper();\n this.isInitial = true;\n this.resetMaskedTextBox();\n this.isInitial = false;\n this.setMaskPlaceholder(true);\n this.setWidth(this.width);\n }\n };\n MaskedTextBox.prototype.resetMaskedTextBox = function () {\n this.promptMask = '';\n this.hiddenMask = '';\n this.escapeMaskValue = '';\n this.customRegExpCollec = [];\n this.undoCollec = [];\n this.redoCollec = [];\n if (this.promptChar.length > 1) {\n this.promptChar = this.promptChar[0];\n }\n createMask.call(this);\n applyMask.call(this);\n var val = strippedValue.call(this, this.element);\n this.prevValue = val;\n this.value = val;\n if (!this.isInitial) {\n unwireEvents.call(this);\n }\n wireEvents.call(this);\n };\n MaskedTextBox.prototype.setMaskPlaceholder = function (setVal) {\n if (this.placeholder) {\n Input.setPlaceholder(this.placeholder, this.element);\n if (this.element.value === this.promptMask && setVal && this.floatLabelType !== 'Always') {\n setElementValue.call(this, '');\n }\n if (this.floatLabelType === 'Never') {\n maskInputBlurHandler.call(this);\n }\n }\n };\n MaskedTextBox.prototype.setCssClass = function (cssClass, element) {\n if (cssClass) {\n addClass(element, cssClass);\n }\n };\n MaskedTextBox.prototype.setWidth = function (width) {\n if (!isNullOrUndefined(width)) {\n this.element.style.width = formatUnit(width);\n }\n };\n MaskedTextBox.prototype.createWrapper = function () {\n this.inputObj = Input.createInput({\n element: this.element,\n customTag: this.angularTagName,\n floatLabelType: this.floatLabelType,\n properties: {\n enableRtl: this.enableRtl,\n enabled: this.enabled,\n placeholder: this.placeholder\n }\n });\n this.inputObj.container.setAttribute('class', ROOT + ' ' + this.inputObj.container.getAttribute('class'));\n };\n /**\n * Calls internally if any of the property value is changed.\n * @hidden\n */\n MaskedTextBox.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 setMaskValue.call(this, this.value);\n if (this.placeholder) {\n this.setMaskPlaceholder(false);\n }\n break;\n case 'placeholder':\n this.setMaskPlaceholder(true);\n break;\n case 'width':\n this.setWidth(newProp.width);\n break;\n case 'cssClass':\n this.setCssClass(newProp.cssClass, [this.inputObj.container]);\n break;\n case 'enabled':\n Input.setEnabled(newProp.enabled, this.element);\n break;\n case 'enableRtl':\n Input.setEnableRtl(newProp.enableRtl, [this.inputObj.container]);\n break;\n case 'customCharacters':\n this.customCharacters = newProp.customCharacters;\n this.resetMaskedTextBox();\n break;\n case 'mask':\n var strippedValue_1 = this.value;\n this.mask = newProp.mask;\n this.updateValue(strippedValue_1);\n break;\n case 'promptChar':\n if (newProp.promptChar.length > 1) {\n newProp.promptChar = newProp.promptChar[0];\n }\n if (newProp.promptChar) {\n this.promptChar = newProp.promptChar;\n }\n else {\n this.promptChar = '_';\n }\n var value = this.element.value.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);\n if (this.promptMask === this.element.value) {\n value = this.promptMask.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);\n }\n this.promptMask = this.promptMask.replace(new RegExp('[' + oldProp.promptChar + ']', 'g'), this.promptChar);\n this.undoCollec = this.redoCollec = [];\n setElementValue.call(this, value);\n break;\n }\n }\n };\n MaskedTextBox.prototype.updateValue = function (strippedVal) {\n this.resetMaskedTextBox();\n setMaskValue.call(this, strippedVal);\n };\n /**\n * Gets the value of the MaskedTextBox with the masked format.\n * By using `value` property, you can get the raw value of maskedtextbox without literals and prompt characters.\n * @return {string}\n */\n MaskedTextBox.prototype.getMaskedValue = function () {\n return unstrippedValue.call(this, this.element);\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 * @method destroy\n * @return {void}\n */\n MaskedTextBox.prototype.destroy = function () {\n unwireEvents.call(this);\n this.inputObj.container.parentElement.appendChild(this.cloneElement);\n detach(this.inputObj.container);\n _super.prototype.destroy.call(this);\n };\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"cssClass\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"width\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"placeholder\", void 0);\n __decorate([\n Property('Never')\n ], MaskedTextBox.prototype, \"floatLabelType\", void 0);\n __decorate([\n Property(true)\n ], MaskedTextBox.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], MaskedTextBox.prototype, \"enablePersistence\", void 0);\n __decorate([\n Property(false)\n ], MaskedTextBox.prototype, \"enableRtl\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"mask\", void 0);\n __decorate([\n Property('_')\n ], MaskedTextBox.prototype, \"promptChar\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"value\", void 0);\n __decorate([\n Property(null)\n ], MaskedTextBox.prototype, \"customCharacters\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"created\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"destroyed\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"change\", void 0);\n __decorate([\n Event()\n ], MaskedTextBox.prototype, \"focus\", void 0);\n MaskedTextBox = __decorate([\n NotifyPropertyChanges\n ], MaskedTextBox);\n return MaskedTextBox;\n}(Component));\nexport { MaskedTextBox };\n","var __extends = (this && this.__extends) || (function () {\n var 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 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 } from '@syncfusion/ej2-base';\nimport { L10n, Internationalization } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, ChildProperty } from '@syncfusion/ej2-base';\nimport { createElement, attributes, addClass, removeClass, setStyleAttribute, detach } from '@syncfusion/ej2-base';\nimport { isNullOrUndefined, formatUnit, Browser } from '@syncfusion/ej2-base';\nimport { Tooltip } 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 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 classNames = {\n root: 'e-slider',\n rtl: 'e-rtl',\n sliderHiddenInput: 'e-slider-input',\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 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};\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',\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 return _this;\n }\n Slider.prototype.preRender = function () {\n var localeText = { incrementTitle: 'Increase', decrementTitle: 'Decrease' };\n this.l10n = new L10n('slider', localeText, this.locale);\n this.tickElementCollection = [];\n this.tooltipFormatInfo = {};\n this.ticksFormatInfo = {};\n this.initCultureInfo();\n this.initCultureFunc();\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 ;\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 ;\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 ;\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 * @private\n */\n Slider.prototype.render = function () {\n this.initialize();\n this.initRender();\n this.wireEvents();\n this.setZindex();\n };\n Slider.prototype.initialize = function () {\n addClass([this.element], classNames.root);\n this.setCSSClass();\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 var tooltipElement = this.type !== 'Range' ? [this.firstTooltipElement] :\n [this.firstTooltipElement, this.secondTooltipElement];\n if (!this.enabled) {\n addClass([this.sliderContainer], [classNames.sliderDisabled]);\n if (this.tooltip.isVisible && this.tooltip.showOn === 'Always') {\n tooltipElement.forEach(function (tooltipElement) {\n tooltipElement.classList.add(classNames.sliderDisabled);\n });\n }\n this.unwireEvents();\n }\n else {\n removeClass([this.sliderContainer], [classNames.sliderDisabled]);\n if (this.tooltip.isVisible && this.tooltip.showOn === 'Always') {\n tooltipElement.forEach(function (tooltipElement) {\n tooltipElement.classList.remove(classNames.sliderDisabled);\n });\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 * @private\n */\n Slider.prototype.initRender = function () {\n this.sliderContainer = createElement('div', { className: classNames.sliderContainer });\n this.element.parentNode.insertBefore(this.sliderContainer, this.element);\n this.sliderContainer.appendChild(this.element);\n this.sliderTrack = createElement('div', { className: classNames.sliderTrack });\n this.element.appendChild(this.sliderTrack);\n this.element.tabIndex = -1;\n this.isMaterial = this.getTheme(this.sliderContainer) === 'material';\n this.setHandler();\n this.createRangeBar();\n this.setOrientClass();\n this.hiddenInput = (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 this.setValue();\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.createRangeBar = function () {\n if (this.type !== 'Default') {\n this.rangeBar = (createElement('div', { attrs: { class: classNames.rangeBar } }));\n this.element.appendChild(this.rangeBar);\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 if (this.type !== 'Range') {\n attributes(element, {\n 'aria-valuemin': this.min.toString(), 'aria-valuemax': this.max.toString()\n });\n }\n else {\n var range = [[this.min.toString(), this.value[1].toString()],\n [this.value[0].toString(), this.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 = createElement('div', {\n attrs: {\n class: classNames.sliderHandle, 'role': 'slider', 'aria-labelledby': this.element.id + '_title', tabIndex: '0'\n }\n });\n this.secondHandle.classList.add(classNames.sliderSecondHandle);\n this.element.appendChild(this.secondHandle);\n if (this.isMaterial && this.tooltip.isVisible) {\n this.secondMaterialHandle = createElement('div', {\n attrs: {\n class: classNames.sliderHandle + ' ' +\n classNames.sliderMaterialHandle\n }\n });\n this.element.appendChild(this.secondMaterialHandle);\n }\n };\n Slider.prototype.createFirstHandle = function () {\n this.firstHandle = createElement('div', {\n attrs: {\n class: classNames.sliderHandle, 'role': 'slider', 'aria-labelledby': this.element.id + '_title', tabIndex: '0'\n }\n });\n this.firstHandle.classList.add(classNames.sliderFirstHandle);\n this.element.appendChild(this.firstHandle);\n if (this.isMaterial && this.tooltip.isVisible) {\n this.firstMaterialHandle = createElement('div', {\n attrs: {\n class: classNames.sliderHandle + ' ' +\n classNames.sliderMaterialHandle\n }\n });\n this.element.appendChild(this.firstMaterialHandle);\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 var pos = (this.activeHandle === 1) ? this.handlePos1 : this.handlePos2;\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n if (pos === 0 && this.type !== 'Range') {\n this.getHandle().classList.add(classNames.sliderHandleStart);\n if (this.isMaterial && this.tooltip.isVisible) {\n this.firstMaterialHandle.classList.add(classNames.sliderHandleStart);\n if (tooltipElement) {\n tooltipElement.classList.add(classNames.sliderTooltipStart);\n }\n }\n }\n };\n Slider.prototype.transitionEnd = function (e) {\n this.handleStart();\n this.getHandle().style.transition = 'none';\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n if (this.tooltip.isVisible) {\n var tooltipObj = this.activeHandle === 1 ? this.firstTooltipObj : this.secondTooltipObj;\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n if (!this.isMaterial) {\n tooltipObj.animation = { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } };\n this.tooltipAnimation();\n }\n else {\n if (!tooltipElement.classList.contains(classNames.materialTooltipOpen) && e.propertyName !== 'transform') {\n this.openMaterialTooltip();\n }\n else {\n if (this.type === 'Default') {\n tooltipElement.style.transition = this.transition.handle;\n }\n this.refreshTooltip();\n }\n }\n }\n if (this.tooltip.showOn !== 'Always') {\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 if (e.currentTarget === this.firstHandle) {\n this.firstHandle.classList.add(classNames.sliderHandleFocused);\n }\n else {\n this.secondHandle.classList.add(classNames.sliderHandleFocused);\n }\n };\n Slider.prototype.handleOver = function (e) {\n if (this.tooltip.isVisible && this.tooltip.showOn === 'Hover') {\n this.tooltipValue();\n var tooltipObj = e.currentTarget === this.firstHandle ? this.firstTooltipObj : this.secondTooltipObj;\n tooltipObj.animation = { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } };\n if (e.currentTarget === this.firstHandle) {\n this.firstTooltipObj.open(this.firstHandle);\n }\n else {\n this.secondTooltipObj.open(this.secondHandle);\n }\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.tooltipValue();\n var tooltipObj = e.currentTarget === this.firstHandle ? this.firstTooltipObj : this.secondTooltipObj;\n if (e.currentTarget === this.firstHandle) {\n this.firstTooltipObj.close();\n }\n else {\n this.secondTooltipObj.close();\n }\n tooltipObj.animation = { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } };\n }\n };\n Slider.prototype.setHandler = function () {\n if (this.min > this.max) {\n this.min = this.max;\n }\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 };\n Slider.prototype.tooltipValue = function () {\n var text;\n var value1;\n var value2;\n var args = {\n value: this.value,\n text: ''\n };\n this.setTooltipContent();\n args.text = text = this.firstTooltipObj.content;\n this.trigger('tooltipChange', args);\n this.addTooltipClass(args.text);\n if (text !== args.text) {\n this.customAriaText = args.text;\n this.firstTooltipObj.content = args.text;\n this.setAriaAttrValue(this.firstHandle);\n if (this.type === 'Range') {\n this.secondTooltipObj.content = args.text;\n this.setAriaAttrValue(this.secondHandle);\n }\n }\n };\n Slider.prototype.setTooltipContent = function () {\n var content;\n if (this.type === 'Range') {\n var content_1 = this.formatContent(this.tooltipFormatInfo, false);\n this.firstTooltipObj.content = content_1;\n this.secondTooltipObj.content = content_1;\n }\n else {\n if (!isNullOrUndefined(this.handleVal1)) {\n var content_2 = this.formatContent(this.tooltipFormatInfo, false);\n this.firstTooltipObj.content = content_2;\n }\n }\n };\n Slider.prototype.formatContent = function (formatInfo, ariaContent) {\n var content = '';\n if (!ariaContent) {\n if (this.type === 'Range') {\n if (this.enableRtl && this.orientation !== 'Vertical') {\n content = (!isNullOrUndefined(formatInfo.format)) ? (this.formatString(this.handleVal2, formatInfo)\n .formatString + ' - ' + this.formatString(this.handleVal1, formatInfo).formatString) :\n (this.handleVal2.toString() + ' - ' + this.handleVal1.toString());\n }\n else {\n content = (!isNullOrUndefined(formatInfo.format)) ? (this.formatString(this.handleVal1, formatInfo)\n .formatString + ' - ' + this.formatString(this.handleVal2, formatInfo).formatString) :\n (this.handleVal1.toString() + ' - ' + this.handleVal2.toString());\n }\n }\n else {\n if (!isNullOrUndefined(this.handleVal1)) {\n content = (!isNullOrUndefined(formatInfo.format)) ?\n this.formatString(this.handleVal1, formatInfo).formatString : this.handleVal1.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(this.handleVal2, formatInfo).elementVal + ' - ' +\n this.formatString(this.handleVal1, formatInfo).elementVal) :\n (this.handleVal2.toString() + ' - ' + this.handleVal1.toString());\n }\n else {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n (this.formatString(this.handleVal1, formatInfo).elementVal + ' - ' +\n this.formatString(this.handleVal2, formatInfo).elementVal) :\n (this.handleVal1.toString() + ' - ' + this.handleVal2.toString());\n }\n }\n else {\n if (!isNullOrUndefined(this.handleVal1)) {\n content = (!isNullOrUndefined(this.tooltip) && !isNullOrUndefined(this.tooltip.format)) ?\n this.formatString(this.handleVal1, formatInfo).elementVal : this.handleVal1.toString();\n }\n }\n return content;\n }\n };\n Slider.prototype.addTooltipClass = function (content) {\n var _this = this;\n if (this.isMaterial && this.tooltip.isVisible) {\n var count_1 = content.toString().length;\n var tooltipElement = this.type !== 'Range' ? [this.firstTooltipElement] :\n [this.firstTooltipElement, this.secondTooltipElement];\n tooltipElement.forEach(function (element, index) {\n if (!element) {\n var cssClass = count_1 > 4 ? classNames.sliderMaterialRange : classNames.sliderMaterialDefault;\n !index ? _this.firstTooltipObj.cssClass = classNames.sliderTooltip + ' ' + cssClass :\n _this.secondTooltipObj.cssClass = classNames.sliderTooltip + ' ' + cssClass;\n }\n else {\n if (count_1 > 4) {\n element.classList.remove(classNames.sliderMaterialDefault);\n if (!element.classList.contains(classNames.sliderMaterialRange)) {\n element.classList.add(classNames.sliderMaterialRange);\n element.style.transform = 'scale(1)';\n }\n }\n else {\n element.classList.remove(classNames.sliderMaterialRange);\n if (!element.classList.contains(classNames.sliderMaterialDefault)) {\n element.classList.add(classNames.sliderMaterialDefault);\n element.style.transform = _this.getTooltipTransformProperties(_this.previousTooltipClass).rotate;\n }\n }\n }\n });\n }\n };\n Slider.prototype.tooltipPlacement = function () {\n var tooltipPosition;\n if (this.orientation === 'Horizontal') {\n this.tooltip.placement === 'Before' ? tooltipPosition = 'TopCenter' : tooltipPosition = 'BottomCenter';\n }\n else {\n this.tooltip.placement === 'Before' ? tooltipPosition = 'LeftCenter' : tooltipPosition = 'RightCenter';\n }\n this.firstTooltipObj.position = tooltipPosition;\n if (this.type === 'Range') {\n this.secondTooltipObj.position = tooltipPosition;\n }\n if (this.isMaterial) {\n this.firstTooltipObj.showTipPointer = true;\n this.setProperties({ tooltip: { showOn: 'Always' } }, true);\n this.firstTooltipObj.height = 30;\n if (this.type === 'Range') {\n this.secondTooltipObj.showTipPointer = true;\n this.secondTooltipObj.height = 30;\n }\n }\n };\n Slider.prototype.tooltipBeforeOpen = function (args) {\n var tooltipElement = args.target === this.firstHandle ? this.firstTooltipElement = args.element :\n this.secondTooltipElement = args.element;\n args.target.removeAttribute('aria-describedby');\n if (this.isMaterial && this.tooltip.isVisible) {\n var transformProperties = this.getTooltipTransformProperties(this.previousTooltipClass);\n tooltipElement.firstChild.classList.add(classNames.materialTooltipHide);\n this.handleStart();\n if (tooltipElement.firstElementChild.innerText.length > 4) {\n tooltipElement.style.transform = transformProperties.translate + \" scale(0.01)\";\n }\n else {\n tooltipElement.style.transform = transformProperties.translate + \" \" + transformProperties.rotate + \" scale(0.01)\";\n }\n }\n };\n Slider.prototype.wireMaterialTooltipEvent = function (destroy) {\n if (this.isMaterial && this.tooltip.isVisible) {\n if (!destroy) {\n EventHandler.add(this.firstTooltipElement, 'mousedown touchstart', this.sliderDown, this);\n if (this.type === 'Range') {\n EventHandler.add(this.secondTooltipElement, 'mousedown touchstart', this.sliderDown, this);\n }\n }\n else {\n EventHandler.remove(this.firstTooltipElement, 'mousedown touchstart', this.sliderDown);\n if (this.type === 'Range') {\n EventHandler.remove(this.secondTooltipElement, 'mousedown touchstart', this.sliderDown);\n }\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 if (this.firstTooltipElement) {\n var position = void 0;\n if (this.orientation === 'Horizontal') {\n position = (this.firstTooltipElement.clientHeight + 14) - (this.firstTooltipElement.clientHeight / 2);\n }\n else {\n position = (this.firstTooltipElement.clientWidth + 14) - (this.firstTooltipElement.clientWidth / 2);\n }\n var 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 return transformProperties;\n }\n return undefined;\n };\n Slider.prototype.openMaterialTooltip = function () {\n var _this = this;\n this.refreshTooltip();\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n var handle = this.activeHandle === 1 ? this.firstMaterialHandle : this.secondMaterialHandle;\n if (tooltipElement.firstChild.classList.contains(classNames.materialTooltipHide)) {\n tooltipElement.firstChild.classList.remove(classNames.materialTooltipHide);\n }\n tooltipElement.firstChild.classList.add(classNames.materialTooltipShow);\n this.getHandle().style.cursor = 'default';\n tooltipElement.style.transition = this.scaleTransform;\n tooltipElement.classList.add(classNames.materialTooltipOpen);\n handle.style.transform = 'scale(0)';\n if (tooltipElement.firstElementChild.innerText.length > 4) {\n tooltipElement.style.transform = 'scale(1)';\n }\n else {\n tooltipElement.style.transform = this.getTooltipTransformProperties(this.previousTooltipClass).rotate;\n }\n if (this.type === 'Default') {\n setTimeout(function () { tooltipElement.style.transition = _this.transition.handle; }, 2500);\n }\n else {\n setTimeout(function () { tooltipElement.style.transition = 'none'; }, 2500);\n }\n };\n Slider.prototype.checkTooltipPosition = function (args) {\n var tooltipPosition = args.target === this.firstHandle ? this.firstHandleTooltipPosition :\n this.secondHandleTooltipPosition;\n if (tooltipPosition === undefined || tooltipPosition !== args.collidedPosition) {\n var tooltipClass = this.tooltipPositionCalculation(args.collidedPosition);\n args.element.classList.remove(this.previousTooltipClass);\n args.element.classList.add(tooltipClass);\n this.previousTooltipClass = tooltipClass;\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 if (args.target === this.firstHandle) {\n this.firstHandleTooltipPosition = args.collidedPosition;\n }\n else {\n this.secondHandleTooltipPosition = args.collidedPosition;\n }\n }\n };\n Slider.prototype.renderTooltip = function () {\n if (this.tooltip.showOn === 'Auto') {\n this.setProperties({ tooltip: { showOn: 'Hover' } }, true);\n }\n this.firstTooltipObj = new Tooltip({\n showTipPointer: false,\n cssClass: classNames.sliderTooltip,\n animation: { open: { effect: 'None' }, close: { effect: 'None' } },\n opensOn: 'Custom',\n beforeOpen: this.tooltipBeforeOpen.bind(this),\n beforeCollision: this.checkTooltipPosition.bind(this),\n afterClose: this.tooltipAfterClose.bind(this)\n });\n this.firstTooltipObj.appendTo(this.firstHandle);\n if (this.type === 'Range') {\n this.secondTooltipObj = new Tooltip({\n showTipPointer: false,\n cssClass: classNames.sliderTooltip,\n animation: { open: { effect: 'None' }, close: { effect: 'None' } },\n opensOn: 'Custom',\n beforeOpen: this.tooltipBeforeOpen.bind(this),\n beforeCollision: this.checkTooltipPosition.bind(this),\n afterClose: this.tooltipAfterClose.bind(this)\n });\n this.secondTooltipObj.appendTo(this.secondHandle);\n }\n this.tooltipPlacement();\n this.firstHandle.style.transition = 'none';\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n if (this.type === 'Range') {\n this.secondHandle.style.transition = 'none';\n }\n if (this.isMaterial) {\n this.sliderContainer.classList.add(classNames.materialSlider);\n this.tooltipValue();\n this.firstTooltipObj.open(this.firstHandle);\n if (this.type === 'Range') {\n this.secondTooltipObj.open(this.secondHandle);\n }\n }\n };\n Slider.prototype.tooltipAfterClose = function (args) {\n if (args.element === this.firstTooltipElement) {\n this.firstTooltipElement = undefined;\n }\n else {\n this.secondTooltipElement = undefined;\n }\n };\n Slider.prototype.setButtons = function () {\n this.firstBtn = createElement('div', { className: classNames.sliderButton + ' ' + classNames.firstButton });\n this.firstBtn.appendChild(createElement('span', { className: classNames.sliderButtonIcon }));\n this.firstBtn.tabIndex = -1;\n this.secondBtn = createElement('div', { className: classNames.sliderButton + ' ' + classNames.secondButton });\n this.secondBtn.appendChild(createElement('span', { className: classNames.sliderButtonIcon }));\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) {\n this.getHandle().style.transform = this.getHandle().style.transform.replace('scale(1.5)', 'scale(1)');\n }\n };\n Slider.prototype.repeatButton = function (args) {\n var buttonElement = args.target.parentElement;\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n if (!tooltipElement && this.tooltip.isVisible) {\n this.openTooltip();\n }\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 (value >= this.min && value <= this.max) {\n this.changeHandleValue(value);\n this.refreshTooltipOnMove();\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().style.transform.indexOf('scale(1.5') === -1) {\n this.getHandle().style.transform = 'scale(1.5)';\n }\n };\n Slider.prototype.repeatHandlerUp = function (e) {\n this.changeEvent('changed');\n if (this.tooltip.isVisible && this.tooltip.showOn !== 'Always' && !this.isMaterial) {\n this.closeTooltip();\n }\n clearInterval(this.repeatInterval);\n this.getHandle().focus();\n };\n Slider.prototype.renderScale = function () {\n var orien = this.orientation === 'Vertical' ? 'v' : 'h';\n var spanText;\n this.noOfDecimals = this.numberOfDecimals(this.step);\n this.ul = 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 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 count = 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 tickWidth = 100 / count;\n if (tickWidth === Infinity) {\n tickWidth = 5;\n }\n for (var i = 0; i <= count; i++) {\n li = (createElement('li', {\n attrs: {\n class: classNames.tick, title: start.toString(), role: 'presentation', tabIndex: '-1',\n 'aria-hidden': 'true'\n }\n }));\n var islargeTick = void 0;\n if (this.numberOfDecimals(this.max) === 0 && this.numberOfDecimals(this.min) === 0 && 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 islargeTick = ((startValue - min) % largestep === 0) ? true : false;\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);\n }\n }\n else {\n this.formatTicksValue(li, start);\n }\n this.ul.appendChild(li);\n this.tickElementCollection.push(li);\n var decimalPoints = void 0;\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 start = this.makeRoundNumber(start - smallStep, decimalPoints);\n }\n left = this.makeRoundNumber(left + smallStep, decimalPoints);\n }\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 this.trigger('renderedTicks', eventArgs);\n this.scaleAlignment();\n };\n Slider.prototype.createTick = function (li, start) {\n var span = 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 span.innerHTML = this.formatTicksValue(li, start);\n };\n Slider.prototype.formatTicksValue = function (li, start) {\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);\n li.setAttribute('title', eventArgs.text.toString());\n return eventArgs.text.toString();\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 var first = this.firstChild.getBoundingClientRect();\n var firstChild;\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 var 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 (!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.buttonClick = function (args) {\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 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 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 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 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.toString());\n }\n else if ((args.keyCode === 35)) {\n value = parseFloat(this.max.toString());\n }\n this.changeHandleValue(value);\n if (this.isMaterial && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.tooltipAnimation();\n this.getHandle().focus();\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.tooltipAnimation = function () {\n if (this.tooltip.isVisible) {\n var tooltipObj = this.activeHandle === 1 ? this.firstTooltipObj : this.secondTooltipObj;\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n if (this.isMaterial) {\n !tooltipElement.classList.contains(classNames.materialTooltipOpen) ? this.openMaterialTooltip() : this.refreshTooltip();\n }\n else {\n tooltipObj.animation = { open: { effect: 'None' }, close: { effect: 'FadeOut', duration: 500 } };\n this.openTooltip();\n }\n }\n };\n Slider.prototype.buttonUp = function (args) {\n if (this.tooltip.isVisible) {\n if (!this.isMaterial) {\n var tooltipObj = this.activeHandle === 1 ? this.firstTooltipObj : this.secondTooltipObj;\n tooltipObj.animation = { open: { effect: 'None' }, close: { effect: 'None' } };\n }\n }\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') {\n if (this.type === 'MinRange') {\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 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 if (this.type === 'MinRange') {\n this.rangeBar.style.bottom = '0px';\n setStyleAttribute(this.rangeBar, { 'height': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else {\n this.rangeBar.style.bottom = this.handlePos1 + 'px';\n setStyleAttribute(this.rangeBar, { 'height': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n };\n Slider.prototype.setValue = function () {\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 isNullOrUndefined(this.activeHandle) ? (this.type === 'Range' ? this.activeHandle = 2 : this.activeHandle = 1) :\n this.activeHandle = this.activeHandle;\n if (this.type === 'Default' || this.type === 'MinRange') {\n this.setHandlePosition();\n this.handleStart();\n this.value = this.handleVal1;\n this.setAriaAttrValue(this.firstHandle);\n this.changeEvent('changed');\n }\n else {\n this.validateRangeValue();\n }\n if (this.type !== 'Default') {\n this.setRangeBar();\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') {\n if (this.activeHandle === 1) {\n this.firstHandle.style.zIndex = (this.zIndex + 4) + '';\n this.secondHandle.style.zIndex = (this.zIndex + 3) + '';\n if (this.isMaterial && this.tooltip.isVisible && this.firstTooltipElement && this.secondTooltipElement) {\n this.firstTooltipElement.style.zIndex = (this.zIndex + 4) + '';\n this.secondTooltipElement.style.zIndex = (this.zIndex + 3) + '';\n }\n }\n else {\n this.firstHandle.style.zIndex = (this.zIndex + 3) + '';\n this.secondHandle.style.zIndex = (this.zIndex + 4) + '';\n if (this.isMaterial && this.tooltip.isVisible && this.firstTooltipElement && this.secondTooltipElement) {\n this.firstTooltipElement.style.zIndex = (this.zIndex + 3) + '';\n this.secondTooltipElement.style.zIndex = (this.zIndex + 4) + '';\n }\n }\n }\n else if (this.isMaterial && this.tooltip.isVisible && this.firstTooltipElement) {\n this.firstTooltipElement.style.zIndex = (this.zIndex + 4) + '';\n }\n };\n Slider.prototype.setHandlePosition = function () {\n var _this = this;\n var pos = (this.activeHandle === 1) ? this.handlePos1 : this.handlePos2;\n var val = (this.activeHandle === 1) ? this.handleVal1 : this.handleVal2;\n var handle;\n var tooltipElement;\n if (this.isMaterial && this.tooltip.isVisible) {\n tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n handle = [this.getHandle(), (this.activeHandle === 1 ? this.firstMaterialHandle : this.secondMaterialHandle)];\n }\n else {\n handle = [this.getHandle()];\n }\n if (this.tooltip.isVisible && pos === 0 && this.type !== 'Range') {\n handle[0].classList.add(classNames.sliderHandleStart);\n if (this.isMaterial) {\n handle[1].classList.add(classNames.sliderHandleStart);\n if (tooltipElement) {\n tooltipElement.classList.add(classNames.sliderTooltipStart);\n }\n }\n }\n else {\n handle[0].classList.remove(classNames.sliderHandleStart);\n if (this.tooltip.isVisible && this.isMaterial) {\n handle[1].classList.remove(classNames.sliderHandleStart);\n if (tooltipElement) {\n tooltipElement.classList.remove(classNames.sliderTooltipStart);\n }\n }\n }\n handle.forEach(function (handle) {\n if (_this.orientation === 'Horizontal') {\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');\n };\n Slider.prototype.getHandle = function () {\n return (this.activeHandle === 1) ? this.firstHandle : this.secondHandle;\n };\n Slider.prototype.setRangeValue = function () {\n var temp = this.activeHandle;\n this.updateRangeValue();\n this.activeHandle = 1;\n this.setHandlePosition();\n this.activeHandle = 2;\n this.setHandlePosition();\n this.activeHandle = 1;\n };\n Slider.prototype.changeEvent = function (eventName) {\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) {\n this.trigger(eventName, this.changeEventArgs(eventName));\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.trigger(eventName, this.changeEventArgs(eventName));\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) {\n var eventArgs;\n if (this.tooltip.isVisible && this.firstTooltipObj) {\n this.tooltipValue();\n eventArgs = {\n value: this.value,\n previousValue: eventName === 'change' ? this.previousVal : this.previousChanged,\n action: eventName, text: this.firstTooltipObj.content\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 };\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.handlePos1 > this.handlePos2) {\n this.handlePos1 = this.handlePos2;\n this.handleVal1 = this.handleVal2;\n }\n this.preHandlePos1 = this.handlePos1;\n this.preHandlePos2 = this.handlePos2;\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 this.min = this.max;\n }\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 Slider.prototype.onResize = function () {\n var _this = this;\n this.firstHandle.style.transition = 'none';\n if (this.type !== 'Default') {\n this.rangeBar.style.transition = 'none';\n }\n if (this.type === 'Range') {\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 this.enableRtl ? this.firstHandle.style.right =\n this.handlePos1 + \"px\" : this.firstHandle.style.left = this.handlePos1 + \"px\";\n if (this.isMaterial && this.tooltip.isVisible && this.firstMaterialHandle) {\n this.enableRtl ? this.firstMaterialHandle.style.right =\n this.handlePos1 + \"px\" : this.firstMaterialHandle.style.left = this.handlePos1 + \"px\";\n }\n if (this.type === 'MinRange') {\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') {\n this.enableRtl ? this.secondHandle.style.right =\n this.handlePos2 + \"px\" : this.secondHandle.style.left = this.handlePos2 + \"px\";\n if (this.isMaterial && this.tooltip.isVisible && this.secondMaterialHandle) {\n this.enableRtl ? this.secondMaterialHandle.style.right =\n this.handlePos2 + \"px\" : this.secondMaterialHandle.style.left = this.handlePos2 + \"px\";\n }\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.isMaterial && this.tooltip.isVisible && this.firstMaterialHandle) {\n this.firstMaterialHandle.style.bottom = this.handlePos1 + \"px\";\n }\n if (this.type === 'MinRange') {\n this.rangeBar.style.bottom = '0px';\n setStyleAttribute(this.rangeBar, { 'height': isNullOrUndefined(this.handlePos1) ? 0 : this.handlePos1 + 'px' });\n }\n else if (this.type === 'Range') {\n this.secondHandle.style.bottom = this.handlePos2 + \"px\";\n if (this.isMaterial && this.tooltip.isVisible && this.secondMaterialHandle) {\n this.secondMaterialHandle.style.bottom = this.handlePos2 + \"px\";\n }\n this.rangeBar.style.bottom = this.handlePos1 + 'px';\n setStyleAttribute(this.rangeBar, { 'height': this.handlePos2 - this.handlePos1 + 'px' });\n }\n }\n if (this.ticks.placement !== 'None' && this.ul) {\n this.removeElement(this.ul);\n this.renderScale();\n }\n if (!this.tooltip.isVisible) {\n setTimeout(function () {\n _this.firstHandle.style.transition = _this.scaleTransform;\n if (_this.type === 'Range') {\n _this.secondHandle.style.transition = _this.scaleTransform;\n }\n });\n }\n this.refreshTooltip();\n };\n Slider.prototype.changeHandleValue = function (value) {\n var position = null;\n if (this.activeHandle === 1) {\n this.handleVal1 = this.checkHandleValue(value);\n this.handlePos1 = this.checkHandlePosition(this.handleVal1);\n if (this.type === 'Range' && this.handlePos1 > this.handlePos2) {\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 this.modifyZindex();\n }\n else {\n this.handleVal2 = this.checkHandleValue(value);\n this.handlePos2 = this.checkHandlePosition(this.handleVal2);\n if (this.type === 'Range' && this.handlePos2 < this.handlePos1) {\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 this.modifyZindex();\n }\n if (position !== null) {\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n this.setHandlePosition();\n }\n };\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 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.round = function (a) {\n var f = this.step.toString().split('.');\n return f[1] ? parseFloat(a.toFixed(f[1].length)) : Math.round(a);\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 var proxy = this;\n var pos;\n if (evt.type === 'mousedown' || evt.type === 'click') {\n pos = { x: evt.clientX, y: evt.clientY };\n }\n else if (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') {\n this.handleVal1 = handleVal;\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n }\n if (this.type === 'Range' && (this.handlePos2 - handlepos) < (handlepos - this.handlePos1)) {\n this.secondHandle.classList.add(classNames.sliderActiveHandle);\n this.handlePos2 = this.preHandlePos2 = handlepos;\n this.handleVal2 = handleVal;\n this.activeHandle = 2;\n this.modifyZindex();\n this.secondHandle.focus();\n }\n else {\n this.firstHandle.classList.add(classNames.sliderActiveHandle);\n this.handlePos1 = this.preHandlePos1 = handlepos;\n this.handleVal1 = handleVal;\n this.activeHandle = 1;\n this.modifyZindex();\n this.firstHandle.focus();\n }\n if (this.isMaterial && this.tooltip.isVisible) {\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n 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 if (evt.target === handle) {\n if (this.isMaterial && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n this.tooltipAnimation();\n return;\n }\n if (!this.checkRepeatedValue(handleVal)) {\n return;\n }\n var transition = this.isMaterial && 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();\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\n };\n Slider.prototype.refreshTooltipOnMove = function () {\n if (this.tooltip.isVisible) {\n this.tooltipValue();\n this.activeHandle === 1 ? this.firstTooltipObj.refresh(this.firstHandle) :\n this.secondTooltipObj.refresh(this.secondHandle);\n }\n };\n Slider.prototype.sliderDown = function (event) {\n event.preventDefault();\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.sliderBarUp = function () {\n this.changeEvent('changed');\n this.handleFocusOut();\n this.firstHandle.classList.remove(classNames.sliderActiveHandle);\n if (this.type === 'Range') {\n this.secondHandle.classList.remove(classNames.sliderActiveHandle);\n }\n if (this.tooltip.isVisible) {\n if (this.tooltip.showOn !== 'Always') {\n this.closeTooltip();\n }\n if (!this.isMaterial) {\n var tooltipObj = this.activeHandle === 1 ? this.firstTooltipObj : this.secondTooltipObj;\n tooltipObj.animation = { open: { effect: 'None' }, close: { effect: 'None' } };\n }\n }\n if (this.isMaterial) {\n this.getHandle().style.transform = this.getHandle().style.transform.replace('scale(1.5)', 'scale(1)');\n if (this.tooltip.isVisible) {\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n 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 this.handlePos1 = handlepos;\n this.handleVal1 = handleVal;\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 (handlepos > this.handlePos2) {\n handlepos = this.handlePos2;\n handleVal = this.handleVal2;\n }\n if (handlepos !== this.preHandlePos1) {\n this.handlePos1 = this.preHandlePos1 = handlepos;\n this.handleVal1 = handleVal;\n this.activeHandle = 1;\n }\n }\n else if (this.activeHandle === 2) {\n this.secondHandle.classList.add(classNames.sliderActiveHandle);\n if (handlepos < this.handlePos1) {\n handlepos = this.handlePos1;\n handleVal = this.handleVal1;\n }\n if (handlepos !== this.preHandlePos2) {\n this.handlePos2 = this.preHandlePos2 = handlepos;\n this.handleVal2 = handleVal;\n this.activeHandle = 2;\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();\n if (this.isMaterial && !this.tooltip.isVisible &&\n !this.getHandle().classList.contains(classNames.sliderTabHandle)) {\n this.materialChange();\n }\n var tooltipElement = this.activeHandle === 1 ? this.firstTooltipElement : this.secondTooltipElement;\n if (this.tooltip.isVisible) {\n if (this.isMaterial) {\n !tooltipElement.classList.contains(classNames.materialTooltipOpen) ? this.openMaterialTooltip() :\n this.refreshTooltipOnMove();\n }\n else {\n !tooltipElement ? this.openTooltip() : this.refreshTooltipOnMove();\n }\n }\n if (this.type !== 'Default') {\n this.setRangeBar();\n }\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 () {\n if (this.tooltip.isVisible && this.firstTooltipObj) {\n this.tooltipValue();\n this.firstTooltipObj.refresh(this.firstHandle);\n if (this.type === 'Range') {\n this.secondTooltipObj.refresh(this.secondHandle);\n }\n }\n };\n Slider.prototype.openTooltip = function () {\n if (this.tooltip.isVisible && this.firstTooltipObj) {\n this.tooltipValue();\n if (this.isMaterial) {\n this.openMaterialTooltip();\n }\n else {\n if (this.activeHandle === 1) {\n this.firstTooltipObj.open(this.firstHandle);\n }\n else {\n this.secondTooltipObj.open(this.secondHandle);\n }\n }\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 if (this.tooltip.isVisible && this.tooltip.showOn !== 'Always' && !this.isMaterial) {\n this.closeTooltip();\n }\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.wireEvents = function () {\n this.onresize = this.onResize.bind(this);\n window.addEventListener('resize', this.onresize);\n if (this.enabled && !this.readOnly) {\n EventHandler.add(this.element, 'mousedown touchstart', this.sliderDown, this);\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 }\n };\n Slider.prototype.unwireEvents = function () {\n EventHandler.remove(this.element, 'mousedown touchstart', this.sliderDown);\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 };\n Slider.prototype.keyUp = function (event) {\n if (event.keyCode === 9 && event.target.classList.contains(classNames.sliderHandle)) {\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.tooltipAnimation();\n if (this.tooltip.isVisible && this.tooltip.showOn !== 'Always' && !this.isMaterial) {\n this.closeTooltip();\n }\n }\n }\n this.changeEvent('changed');\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 }\n }\n };\n Slider.prototype.sliderFocusOut = function (event) {\n var _this = this;\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.hiddenInput.focus();\n this.hiddenInput.blur();\n if (this.isMaterial && this.tooltip.isVisible) {\n var transformProperties_1 = this.getTooltipTransformProperties(this.previousTooltipClass);\n var tooltipElement = this.type !== 'Range' ? [this.firstTooltipElement] :\n [this.firstTooltipElement, this.secondTooltipElement];\n var hiddenHandle_1 = this.type !== 'Range' ? [this.firstHandle] : [this.firstHandle, this.secondHandle];\n var handle_1 = this.type !== 'Range' ? [this.firstMaterialHandle] :\n [this.firstMaterialHandle, this.secondMaterialHandle];\n tooltipElement.forEach(function (tooltipElement, index) {\n if (tooltipElement) {\n tooltipElement.style.transition = _this.scaleTransform;\n tooltipElement.firstChild.classList.remove(classNames.materialTooltipShow);\n tooltipElement.firstChild.classList.add(classNames.materialTooltipHide);\n hiddenHandle_1[index].style.cursor = '-webkit-grab';\n hiddenHandle_1[index].style.cursor = 'grab';\n handle_1[index].style.transform = 'scale(1)';\n tooltipElement.classList.remove(classNames.materialTooltipOpen);\n if (tooltipElement.firstElementChild.innerText.length > 4) {\n tooltipElement.style.transform = transformProperties_1.translate + ' ' + 'scale(0.01)';\n }\n else {\n tooltipElement.style.transform = transformProperties_1.translate + ' ' +\n transformProperties_1.rotate + ' ' + 'scale(0.01)';\n }\n setTimeout(function () { tooltipElement.style.transition = 'none'; }, 2500);\n }\n });\n }\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 }\n };\n Slider.prototype.closeTooltip = function () {\n if (this.tooltip.isVisible) {\n this.tooltipValue();\n if (this.activeHandle === 1) {\n this.firstTooltipObj.close();\n }\n else {\n this.secondTooltipObj.close();\n }\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) {\n if (this.isMaterial && this.firstMaterialHandle) {\n this.sliderContainer.classList.remove(classNames.materialSlider);\n this.removeElement(this.firstMaterialHandle);\n this.firstTooltipElement = undefined;\n this.firstHandleTooltipPosition = undefined;\n if (this.secondMaterialHandle) {\n this.removeElement(this.secondMaterialHandle);\n this.secondTooltipElement = undefined;\n this.secondHandleTooltipPosition = undefined;\n }\n }\n if (this.tooltip.isVisible && this.isMaterial) {\n this.sliderContainer.classList.add(classNames.materialSlider);\n }\n this.removeElement(this.firstHandle);\n if (type !== 'Default') {\n if (type === 'Range') {\n this.removeElement(this.secondHandle);\n }\n this.removeElement(this.rangeBar);\n }\n if (this.tooltip.isVisible && !isNullOrUndefined(this.firstTooltipObj)) {\n this.firstTooltipObj.destroy();\n if (type === 'Range' && !isNullOrUndefined(this.secondTooltipObj)) {\n this.secondTooltipObj.destroy();\n }\n }\n this.createRangeBar();\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.updateConfig();\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.firstTooltipObj.refresh(this.firstHandle);\n if (this.type === 'Range') {\n this.secondTooltipObj.refresh(this.secondHandle);\n }\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);\n };\n Slider.prototype.updateConfig = function () {\n this.setEnableRTL();\n this.setValue();\n if (this.tooltip.isVisible) {\n this.refreshTooltip();\n }\n if (this.ticks.placement !== 'None') {\n if (this.ul) {\n this.removeElement(this.ul);\n this.renderScale();\n }\n }\n };\n /**\n * Get the properties to be maintained in the persisted state.\n * @private\n */\n Slider.prototype.getPersistData = function () {\n var keyEntity = ['value'];\n return this.addOnPersist(keyEntity);\n };\n /**\n * Prepares the slider for safe removal from the DOM.\n * Detaches all event handlers, attributes, and classes to avoid memory leaks.\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.firstTooltipObj.destroy();\n if (this.type === 'Range' && !isNullOrUndefined(this.secondTooltipObj)) {\n this.secondTooltipObj.destroy();\n }\n }\n this.element.innerHTML = '';\n };\n /**\n * Calls internally if any of the property value is changed.\n * @private\n */\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 (!isNullOrUndefined(oldProp.value) && !isNullOrUndefined(newProp.value)) {\n if (oldProp.value.toString() !== newProp.value.toString()) {\n this.setValue();\n this.refreshTooltip();\n if (this.type === 'Range') {\n if (oldProp.value[0] === newProp.value[0]) {\n this.activeHandle = 2;\n }\n else {\n this.activeHandle = 1;\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.setTooltip();\n }\n break;\n case 'type':\n this.changeSliderType(oldProp.type);\n this.setZindex();\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 '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.onResize();\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.firstBtn = undefined;\n this.secondBtn = undefined;\n }\n }\n break;\n case 'enabled':\n this.setEnabled();\n break;\n case 'readOnly':\n this.setReadOnly();\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();\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') {\n this.ul.style.zIndex = (this.zIndex + -7) + '';\n this.element.style.zIndex = (this.zIndex + 2) + '';\n }\n if (!this.isMaterial && !isNullOrUndefined(this.ticks) && this.ticks.placement === 'Both') {\n this.element.style.zIndex = (this.zIndex + 2) + '';\n }\n this.firstHandle.style.zIndex = (this.zIndex + 3) + '';\n if (this.type === 'Range') {\n this.secondHandle.style.zIndex = (this.zIndex + 4) + '';\n }\n };\n Slider.prototype.setTooltip = function () {\n this.changeSliderType(this.type);\n };\n /**\n * Gets the component name\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(1)\n ], Slider.prototype, \"step\", 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 Complex({}, TicksData)\n ], Slider.prototype, \"ticks\", void 0);\n __decorate([\n Property(true)\n ], Slider.prototype, \"enabled\", void 0);\n __decorate([\n Property(false)\n ], Slider.prototype, \"enableRtl\", 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 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 = 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 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, compile, isNullOrUndefined } from '@syncfusion/ej2-base';\nimport { NotifyPropertyChanges, createElement, detach, Animation } from '@syncfusion/ej2-base';\nimport { addClass, removeClass, KeyboardEvents, setValue, getValue, ChildProperty } from '@syncfusion/ej2-base';\nimport { Collection, Complex, Browser } from '@syncfusion/ej2-base';\nvar ROOT = 'e-uploader';\nvar CONTROL_WRAPPER = 'e-upload';\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-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 CLEAR_ICON = 'e-file-remove-btn';\nvar REMOVE_ICON = 'e-file-delete-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 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 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 function Uploader(options, element) {\n var _this = _super.call(this, options, element) || this;\n _this.initialAttr = { accept: null, multiple: false, disabled: false };\n _this.fileList = [];\n _this.filesData = [];\n _this.uploadedFilesData = [];\n _this.isForm = false;\n return _this;\n }\n /**\n * Calls internally if any of the property value is changed.\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.setDropArea();\n break;\n case 'showFileList':\n if (this.listParent) {\n this.listParent.style.display = this.showFileList ? 'block' : 'none';\n this.actionButtons.style.display = this.showFileList ? 'block' : 'none';\n }\n break;\n case 'files':\n this.renderPreLoadFiles();\n break;\n case 'minFileSize':\n case 'maxFileSize':\n case 'template':\n case 'autoUpload':\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 }\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 this.uploadWrapper.querySelector('.' + DROP_AREA).innerHTML = this.localizedTexts('dropFilesHint');\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 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('remove'));\n }\n else {\n this.fileList[i].querySelector('.e-icons').setAttribute('title', this.localizedTexts('delete'));\n }\n if (!this.autoUpload) {\n this.uploadButton.innerText = (this.buttons.upload === 'Upload') ?\n this.localizedTexts('Upload') : this.buttons.upload;\n this.clearButton.innerText = (this.buttons.clear === 'Clear') ?\n this.localizedTexts('Clear') : this.buttons.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.removeActionButtons();\n this.createFileList(this.filesData);\n this.renderActionButtons();\n }\n };\n Uploader.prototype.preRender = function () {\n this.cloneElement = this.element.cloneNode(true);\n this.localeText = { Browse: 'Browse', Clear: 'Clear', Upload: 'Upload',\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: 'File failed to remove', inProgress: 'Uploading',\n readyToUploadMessage: 'Ready to upload', remove: 'Remove', cancel: 'Cancel', delete: 'Delete file'\n };\n this.l10n = new L10n('uploader', this.localeText, this.locale);\n this.preLocaleObj = getValue('currentLocale', this.l10n);\n this.checkHTMLAttributes();\n if (this.asyncSettings.saveUrl === '' && this.asyncSettings.removeUrl === '' && !this.autoUpload) {\n if (!isNullOrUndefined(this.element.closest('form'))) {\n this.isForm = true;\n this.element.closest('form').setAttribute('enctype', 'multipart/form-data');\n this.element.closest('form').setAttribute('encoding', 'multipart/form-data');\n }\n }\n var ejInstance = getValue('ej2_instances', this.element);\n if (this.element.tagName === 'EJS-UPLOADER' || this.element.tagName === 'UPLOADERCOMPONENT') {\n var inputElement = createElement('input', { attrs: { type: 'file' } });\n var index = 0;\n for (index; index < this.element.attributes.length; index++) {\n inputElement.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);\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 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.keyConfigs = {\n previous: 'shift+tab',\n enter: 'enter',\n next: 'tab'\n };\n };\n Uploader.prototype.getPersistData = function () {\n return this.addOnPersist([]);\n };\n /**\n * Return the module name of the component.\n */\n Uploader.prototype.getModuleName = function () {\n return 'uploader';\n };\n /**\n * To Initialize the control rendering\n * @private\n */\n Uploader.prototype.render = function () {\n this.renderBrowseButton();\n this.initializeUpload();\n this.wireEvents();\n this.setMultipleSelection();\n this.setExtensions(this.allowedExtensions);\n this.setRTL();\n this.renderPreLoadFiles();\n this.setControlStatus();\n };\n Uploader.prototype.renderBrowseButton = function () {\n this.browseButton = createElement('button', { className: 'e-css e-btn', attrs: { 'type': 'button' } });\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 }\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 = createElement('div', { className: ACTION_BUTTONS });\n this.uploadButton = createElement('button', { className: UPLOAD_BUTTONS, attrs: { 'type': 'button', 'tabindex': '-1' } });\n this.clearButton = createElement('button', { className: CLEAR_BUTTONS, attrs: { 'type': 'button', 'tabindex': '-1' } });\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 this.uploadButton.focus();\n this.wireActionButtonEvents();\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.innerText = (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 if (this.uploadButton) {\n var uploadText = void 0;\n uploadText = isNullOrUndefined(this.buttons.upload) ? 'Upload' : this.buttons.upload;\n this.buttons.upload = uploadText;\n if (typeof (this.buttons.upload) === 'string') {\n this.uploadButton.innerText = (this.buttons.upload === 'Upload') ?\n this.localizedTexts('Upload') : this.buttons.upload;\n this.uploadButton.setAttribute('title', this.uploadButton.innerText);\n }\n else {\n this.uploadButton.appendChild(this.buttons.upload);\n }\n }\n if (this.clearButton) {\n var clearText = void 0;\n clearText = isNullOrUndefined(this.buttons.clear) ? 'Clear' : this.buttons.clear;\n this.buttons.clear = clearText;\n if (typeof (this.buttons.clear) === 'string') {\n this.clearButton.innerText = (this.buttons.clear === 'Clear') ?\n this.localizedTexts('Clear') : this.buttons.clear;\n this.clearButton.setAttribute('title', this.clearButton.innerText);\n }\n else {\n this.clearButton.appendChild(this.buttons.clear);\n }\n }\n };\n Uploader.prototype.initializeUpload = function () {\n this.element.setAttribute('tabindex', '-1');\n var inputWrapper = createElement('span', { className: INPUT_WRAPPER });\n this.element.parentElement.insertBefore(inputWrapper, this.element);\n this.dropAreaWrapper = 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 var fileDropArea = createElement('span', { className: DROP_AREA });\n fileDropArea.innerHTML = this.localizedTexts('dropFilesHint');\n this.dropAreaWrapper.appendChild(fileDropArea);\n this.uploadWrapper = createElement('div', { className: CONTROL_WRAPPER, attrs: { 'aria-activedescendant': 'li-focused' } });\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 (isNullOrUndefined(this.files[0].size) || !isNullOrUndefined(this.template)) {\n return;\n }\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: this.getFileNameOnly(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.createFileList(filesData);\n if (!this.autoUpload && this.listParent && !this.actionButtons && !this.isForm) {\n this.renderActionButtons();\n }\n this.checkActionButtonStatus();\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 document.querySelector(this.dropArea);\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 }\n }\n if (!enableDropText) {\n dropTextArea.textContent = '';\n }\n }\n else {\n this.dropZoneElement = this.uploadWrapper;\n dropTextArea.textContent = this.localizedTexts('dropFilesHint');\n }\n this.bindDropEvents();\n };\n Uploader.prototype.setMultipleSelection = function () {\n if (this.multiple && !this.element.hasAttribute('multiple')) {\n var newAttr = document.createAttribute('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 this.upload(fileData);\n this.removeActionButtons();\n }\n else if (!this.actionButtons) {\n this.renderActionButtons();\n }\n this.checkActionButtonStatus();\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.element.closest('form'), '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 this.keyboardModule.destroy();\n };\n Uploader.prototype.resetForm = function () {\n this.clearAll();\n this.element.value = '';\n };\n Uploader.prototype.keyActionHandler = function (e) {\n switch (e.action) {\n case 'next':\n if (e.target === this.browseButton && isNullOrUndefined(this.listParent)) {\n this.browseButton.blur();\n }\n else if (e.target === this.uploadButton) {\n this.uploadButton.blur();\n }\n else {\n this.setTabFocus(e);\n e.preventDefault();\n e.stopPropagation();\n if (e.target === this.clearButton && this.uploadButton.hasAttribute('disabled')) {\n this.clearButton.blur();\n }\n }\n break;\n case 'previous':\n if (e.target === this.browseButton) {\n this.browseButton.blur();\n }\n else {\n this.setReverseFocus(e);\n e.preventDefault();\n e.stopPropagation();\n }\n break;\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 {\n this.removeFiles(e);\n this.browseButton.focus();\n }\n e.preventDefault();\n e.stopPropagation();\n break;\n }\n };\n Uploader.prototype.setReverseFocus = function (e) {\n var target = e.target;\n if (target === this.uploadButton) {\n this.uploadButton.blur();\n this.clearButton.focus();\n }\n else if (target === this.clearButton && this.listParent && this.listParent.querySelector('.e-icons')) {\n this.clearButton.blur();\n var items = [].slice.call(this.listParent.querySelectorAll('span.e-icons'));\n items[items.length - 1].classList.add(ICON_FOCUSED);\n items[items.length - 1].focus();\n }\n else {\n var iconElements = [].slice.call(this.listParent.querySelectorAll('span.e-icons'));\n var index = iconElements.indexOf(target);\n if (index > 0) {\n this.removeFocus();\n iconElements[index - 1].classList.add(ICON_FOCUSED);\n iconElements[index - 1].focus();\n }\n else {\n this.removeFocus();\n this.browseButton.focus();\n }\n }\n };\n Uploader.prototype.setTabFocus = function (e) {\n var target = e.target;\n if (target === this.clearButton) {\n this.removeFocus();\n if (this.uploadButton.hasAttribute('disabled')) {\n return;\n }\n this.uploadButton.focus();\n }\n else if (target.classList.contains('e-icons')) {\n var iconElements = [].slice.call(this.listParent.querySelectorAll('span.e-icons'));\n var index = iconElements.indexOf(target);\n if (index < (iconElements.length - 1)) {\n this.removeFocus();\n iconElements[index + 1].classList.add(ICON_FOCUSED);\n iconElements[index + 1].focus();\n }\n else {\n this.removeFocus();\n this.clearButton.focus();\n }\n }\n else {\n this.browseButton.blur();\n var iconElement = this.listParent.querySelector('span.e-icons');\n iconElement.focus();\n iconElement.classList.add(ICON_FOCUSED);\n }\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 this.upload(this.filesData);\n };\n Uploader.prototype.clearButtonClick = function () {\n this.clearAll();\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 }\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 }\n };\n Uploader.prototype.onDragLeave = function (e) {\n this.dropZoneElement.classList.remove(DRAG_HOVER);\n };\n Uploader.prototype.dragHover = function (e) {\n if (!this.enabled) {\n return;\n }\n this.dropZoneElement.classList.add(DRAG_HOVER);\n e.preventDefault();\n e.stopPropagation();\n };\n Uploader.prototype.dropElement = function (e) {\n this.dropZoneElement.classList.remove(DRAG_HOVER);\n this.onSelectFiles(e);\n e.preventDefault();\n e.stopPropagation();\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 fileData = this.filesData[index];\n this.remove(fileData);\n this.element.value = '';\n this.checkActionButtonStatus();\n };\n Uploader.prototype.removeFilesData = function (file, customTemplate) {\n if (customTemplate) {\n return;\n }\n var selectedElement = this.getLiElement(file);\n if (isNullOrUndefined(selectedElement)) {\n return;\n }\n detach(selectedElement);\n var 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 };\n Uploader.prototype.removeUploadedFile = function (file, custom) {\n var _this = this;\n var selectedFiles = file;\n var ajax = new XMLHttpRequest();\n var name = this.element.getAttribute('name');\n var formData = new FormData();\n formData.append(name, selectedFiles.rawFile);\n ajax.addEventListener('load', function (e) { _this.removeCompleted(e, selectedFiles, custom); }, false);\n /* istanbul ignore next */\n ajax.addEventListener('error', function (e) { _this.removeFailed(e, selectedFiles, custom); }, false);\n ajax.open('POST', this.asyncSettings.removeUrl);\n ajax.send(formData);\n };\n Uploader.prototype.removeCompleted = function (e, files, customTemplate) {\n var args = {\n e: e, 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 Uploader.prototype.removeFailed = function (e, files, customTemplate) {\n var args = {\n e: e, 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 var statusElement = rootElement.querySelector('.' + STATUS);\n rootElement.classList.remove(UPLOAD_SUCCESS);\n statusElement.classList.remove(UPLOAD_SUCCESS);\n rootElement.classList.add(UPLOAD_FAILED);\n statusElement.classList.add(UPLOAD_FAILED);\n }\n this.checkActionButtonStatus();\n }\n this.trigger('failure', args);\n };\n Uploader.prototype.onSelectFiles = function (args) {\n if (!this.enabled) {\n return;\n }\n var fileData = [];\n var targetFiles;\n if (args.type === 'drop') {\n var files = args.dataTransfer.files;\n targetFiles = this.multiple ? this.sortFileList(files) : [files[0]];\n }\n else {\n targetFiles = [].slice.call(args.target.files);\n }\n if (!this.multiple) {\n this.clearData();\n targetFiles = [targetFiles[0]];\n }\n for (var i = 0; i < targetFiles.length; i++) {\n var file = targetFiles[i];\n var eventArgs_1 = {\n name: file.name,\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 };\n eventArgs_1.status = eventArgs_1.validationMessages.minSize !== '' ? this.localizedTexts('invalidMinFileSize') :\n eventArgs_1.validationMessages.maxSize !== '' ? this.localizedTexts('invalidMaxFileSize') : eventArgs_1.status;\n if (eventArgs_1.validationMessages.minSize !== '' || eventArgs_1.validationMessages.maxSize !== '') {\n eventArgs_1.statusCode = '0';\n }\n fileData.push(eventArgs_1);\n }\n var eventArgs = {\n cancel: false,\n filesData: fileData,\n isModified: false,\n modifiedFilesData: [],\n progressInterval: ''\n };\n if (args.type === 'drop') {\n fileData = this.checkExtension(fileData);\n }\n this.trigger('selected', eventArgs);\n if (eventArgs.cancel) {\n return;\n }\n if (eventArgs.isModified && eventArgs.modifiedFilesData.length > 0) {\n var dataFiles = this.checkExtension(eventArgs.modifiedFilesData);\n this.updateSortedFileList(dataFiles);\n if (!this.isForm) {\n this.checkAutoUpload(dataFiles);\n }\n this.filesData = dataFiles;\n }\n else {\n this.createFileList(fileData);\n this.filesData = this.filesData.concat(fileData);\n if (!this.isForm) {\n this.checkAutoUpload(fileData);\n }\n }\n if (!isNullOrUndefined(eventArgs.progressInterval) && eventArgs.progressInterval !== '') {\n this.progressInterval = eventArgs.progressInterval;\n }\n };\n Uploader.prototype.clearData = function () {\n if (!isNullOrUndefined(this.listParent)) {\n detach(this.listParent);\n this.listParent = null;\n }\n if (Browser.info.name !== 'msie') {\n this.element.value = '';\n }\n this.fileList = [];\n this.filesData = [];\n this.removeActionButtons();\n };\n Uploader.prototype.updateSortedFileList = function (filesData) {\n var previousListClone = 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 removedList = this.listParent.querySelectorAll('li');\n for (var _i = 0, removedList_1 = removedList; _i < removedList_1.length; _i++) {\n var item = removedList_1[_i];\n detach(item);\n }\n this.removeActionButtons();\n var oldList = [].slice.call(previousListClone.childNodes);\n detach(this.listParent);\n this.listParent = null;\n this.fileList = [];\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.createFileList([filesData[index]]);\n }\n }\n }\n else {\n this.createFileList(filesData);\n }\n };\n Uploader.prototype.checkExtension = function (files) {\n var dropFiles = files;\n if (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 if (allowedExtensions.indexOf(('.' + files[i].type).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.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 liElement = createElement('li', { className: FILE, attrs: { 'data-file-name': listItem.name } });\n this.uploadTemplateFn = this.templateComplier(this.template);\n var length_2 = this.uploadTemplateFn(listItem).length;\n for (var i = 0; i < length_2; i++) {\n liElement.appendChild(this.uploadTemplateFn(listItem)[i]);\n }\n this.listParent.appendChild(liElement);\n this.fileList.push(liElement);\n }\n };\n Uploader.prototype.createParentUL = function () {\n if (isNullOrUndefined(this.listParent)) {\n this.listParent = createElement('ul', { className: LIST_PARENT });\n this.uploadWrapper.appendChild(this.listParent);\n this.listParent.style.display = this.showFileList ? 'block' : 'none';\n }\n };\n Uploader.prototype.createFileList = function (fileData) {\n this.createParentUL();\n if (this.template !== '' && !isNullOrUndefined(this.template)) {\n this.createCustomfileList(fileData);\n }\n else {\n for (var _i = 0, fileData_2 = fileData; _i < fileData_2.length; _i++) {\n var listItem = fileData_2[_i];\n var liElement = createElement('li', { className: FILE, attrs: { 'data-file-name': listItem.name } });\n var textContainer = createElement('span', { className: TEXT_CONTAINER });\n var textElement = createElement('span', { className: FILE_NAME, attrs: { 'title': listItem.name } });\n textElement.innerHTML = this.getFileNameOnly(listItem.name);\n var fileExtension = createElement('span', { className: FILE_TYPE });\n fileExtension.innerHTML = '.' + this.getFileType(listItem.name);\n if (!this.enableRtl) {\n textContainer.appendChild(textElement);\n textContainer.appendChild(fileExtension);\n }\n else {\n var rtlContainer = createElement('span', { className: RTL_CONTAINER });\n rtlContainer.appendChild(fileExtension);\n rtlContainer.appendChild(textElement);\n textContainer.appendChild(rtlContainer);\n }\n var fileSize = createElement('span', { className: FILE_SIZE });\n fileSize.innerHTML = this.bytesToSize(listItem.size);\n textContainer.appendChild(fileSize);\n var statusElement = createElement('span', { className: STATUS });\n textContainer.appendChild(statusElement);\n statusElement.innerHTML = listItem.status;\n liElement.appendChild(textContainer);\n var iconElement = createElement('span', { className: ' e-icons', attrs: { 'tabindex': '-1' } });\n if (Browser.info.name === 'msie') {\n iconElement.classList.add('e-msie');\n }\n if (listItem.statusCode !== '2') {\n iconElement.setAttribute('title', this.localizedTexts('remove'));\n }\n else {\n iconElement.setAttribute('title', this.localizedTexts('delete'));\n }\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(REMOVE_ICON);\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(REMOVE_ICON)) {\n iconElement.classList.add(CLEAR_ICON);\n }\n this.listParent.appendChild(liElement);\n this.fileList.push(liElement);\n this.truncateName(textElement);\n }\n }\n };\n Uploader.prototype.truncateName = function (name) {\n var nameElement = name;\n var text;\n if (nameElement.offsetWidth < nameElement.scrollWidth) {\n text = nameElement.textContent;\n nameElement.dataset.tail = text.slice(text.length - 10);\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 (!li.classList.contains(UPLOAD_SUCCESS)) {\n filterFiles.push(files[i]);\n }\n }\n return filterFiles;\n };\n Uploader.prototype.updateStatus = function (files, status, statusCode) {\n if (!(status === '' || isNullOrUndefined(status)) && !(statusCode === '' || isNullOrUndefined(statusCode))) {\n files.status = status;\n files.statusCode = statusCode;\n }\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 return files;\n };\n Uploader.prototype.getLiElement = function (files) {\n var liElements = [];\n var li;\n if (this.uploadWrapper) {\n liElements = this.uploadWrapper.querySelectorAll('.' + LIST_PARENT + '> li');\n for (var i = 0; i < liElements.length; i++) {\n if (liElements[i].getAttribute('data-file-name') === files.name) {\n li = liElements[i];\n }\n }\n }\n return li;\n };\n Uploader.prototype.createProgressBar = function (liElement) {\n var progressbarWrapper = createElement('span', { className: PROGRESS_WRAPPER });\n var progressBar = createElement('progressbar', { className: PROGRESSBAR, attrs: { value: '0', max: '100' } });\n var progressbarInnerWrapper = createElement('span', { className: PROGRESS_INNER_WRAPPER });\n progressBar.setAttribute('style', 'width: 0%');\n var progressbarText = 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 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) {\n var li = this.getLiElement(files);\n if (isNullOrUndefined(li) && (!customUI || isNullOrUndefined(customUI))) {\n return;\n }\n if (!isNullOrUndefined(li)) {\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 }\n this.updateProgressbar(e, li);\n if (!isNullOrUndefined(li.querySelector('.e-icons'))) {\n li.querySelector('.e-icons').removeAttribute('title');\n li.querySelector('.e-icons').classList.add(UPLOAD_INPROGRESS);\n }\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.uploadComplete = function (e, files, customUI) {\n var status = e.target;\n if (status.readyState === 4 && status.status === 200) {\n var li = this.getLiElement(files);\n if (isNullOrUndefined(li) && (!customUI || isNullOrUndefined(customUI))) {\n return;\n }\n if (!isNullOrUndefined(li)) {\n this.updateProgressBarClasses(li, UPLOAD_SUCCESS);\n this.removeProgressbar(li, 'success');\n if (!isNullOrUndefined(li.querySelector('.' + CLEAR_ICON))) {\n li.querySelector('.' + CLEAR_ICON).classList.add(REMOVE_ICON);\n li.querySelector('.' + CLEAR_ICON).setAttribute('title', this.localizedTexts('delete'));\n li.querySelector('.' + CLEAR_ICON).classList.remove(CLEAR_ICON);\n }\n if (!isNullOrUndefined(li.querySelector('.e-icons'))) {\n li.querySelector('.e-icons').classList.remove(UPLOAD_INPROGRESS);\n li.querySelector('.e-icons').setAttribute('title', this.localizedTexts('delete'));\n }\n }\n var args = { e: e, operation: 'upload', file: this.updateStatus(files, this.localizedTexts('uploadSuccessMessage'), '2') };\n this.trigger('success', args);\n this.uploadedFilesData.push(files);\n this.trigger('change', { files: this.uploadedFilesData });\n this.checkActionButtonStatus();\n }\n else {\n this.uploadFailed(e, files);\n }\n };\n Uploader.prototype.uploadFailed = function (e, files) {\n var li = this.getLiElement(files);\n var args = { e: e, operation: 'upload', file: this.updateStatus(files, this.localizedTexts('uploadFailedMessage'), '0') };\n if (!isNullOrUndefined(li)) {\n this.updateProgressBarClasses(li, UPLOAD_FAILED);\n this.removeProgressbar(li, 'failure');\n li.querySelector('.' + CLEAR_ICON).setAttribute('title', this.localizedTexts('remove'));\n li.querySelector('.e-icons').classList.remove(UPLOAD_INPROGRESS);\n }\n this.trigger('failure', args);\n this.checkActionButtonStatus();\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 () { _this.animateProgressBar(li, callType); }, 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 detach(li.querySelector('.' + PROGRESS_WRAPPER));\n };\n Uploader.prototype.setExtensions = function (extensions) {\n this.element.setAttribute('accept', extensions);\n };\n Uploader.prototype.templateComplier = function (uploadTemplate) {\n if (uploadTemplate) {\n var exception = void 0;\n try {\n if (document.querySelectorAll(uploadTemplate).length) {\n return compile(document.querySelector(uploadTemplate).innerHTML.trim());\n }\n }\n catch (exception) {\n return compile(uploadTemplate);\n }\n }\n return undefined;\n };\n Uploader.prototype.setRTL = function () {\n this.enableRtl ? addClass([this.uploadWrapper], RTL) : removeClass([this.uploadWrapper], RTL);\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 () {\n if (this.element.hasAttribute('accept')) {\n this.allowedExtensions = this.element.getAttribute('accept');\n this.initialAttr.accept = this.allowedExtensions;\n }\n if (this.element.hasAttribute('multiple')) {\n this.multiple = true;\n this.initialAttr.multiple = true;\n }\n if (this.element.hasAttribute('disabled')) {\n this.enabled = false;\n this.initialAttr.disabled = true;\n }\n };\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 * @param { number } bytes - specifies the file size in bytes.\n * @returns string\n */\n Uploader.prototype.bytesToSize = function (bytes) {\n var i = -1;\n var size;\n if (!bytes) {\n return '0.0 KB';\n }\n do {\n bytes = bytes / 1000;\n i++;\n } while (bytes > 99);\n if (i >= 2) {\n bytes = bytes * 1000;\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 * @param { FileList } filesData - specifies the files data for upload.\n * @returns File[]\n */\n Uploader.prototype.sortFileList = function (filesData) {\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 var index = 0;\n for (var _i = 0, sortedFileNames_1 = sortedFileNames; _i < sortedFileNames_1.length; _i++) {\n var name_1 = sortedFileNames_1[_i];\n for (var i = 0; i < files.length; i++) {\n if (name_1 === files[i].name) {\n sortedFilesData.push(files[i]);\n }\n }\n }\n return sortedFilesData;\n };\n /**\n * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.\n * @method destroy\n * @return {void}.\n */\n Uploader.prototype.destroy = function () {\n this.element.value = null;\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 this.uploadWrapper.parentElement.appendChild(this.cloneElement);\n this.cloneElement.classList.remove('e-control', ROOT);\n detach(this.uploadWrapper);\n this.uploadWrapper = 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 * @param { FileInfo[] } files - specifies the files data for upload.\n * @returns void\n */\n Uploader.prototype.upload = function (files, custom) {\n var _this = this;\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 var _loop_1 = function (i) {\n var ajax = new XMLHttpRequest();\n var formData = new FormData();\n if (selectedFiles[i].statusCode === '1') {\n var eventArgs = {\n fileData: selectedFiles[i],\n customFormData: [],\n cancel: false\n };\n this_1.trigger('uploading', eventArgs);\n if (eventArgs.cancel) {\n return { value: void 0 };\n }\n var name_2 = this_1.element.getAttribute('name');\n formData.append(name_2, selectedFiles[i].rawFile, selectedFiles[i].name);\n if (eventArgs.customFormData.length > 0) {\n var datas = eventArgs.customFormData;\n for (var i_1 = 0; i_1 < eventArgs.customFormData.length; i_1++) {\n var customData = eventArgs.customFormData[i_1];\n // tslint:disable-next-line\n formData.append(Object.keys(customData)[0], Object.values(customData)[0]);\n }\n }\n ajax.addEventListener('load', function (e) { _this.uploadComplete(e, selectedFiles[i], custom); }, false);\n /* istanbul ignore next */\n ajax.addEventListener('error', function (e) { _this.uploadFailed(e, selectedFiles[i]); }, false);\n ajax.upload.addEventListener('progress', function (e) { _this.uploadInProgress(e, selectedFiles[i], custom); }, false);\n ajax.open('POST', this_1.asyncSettings.saveUrl);\n ajax.send(formData);\n }\n };\n var this_1 = this;\n for (var i = 0; i < selectedFiles.length; i++) {\n var state_1 = _loop_1(i);\n if (typeof state_1 === \"object\")\n return state_1.value;\n }\n };\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 * @param { FileInfo | FileInfo[] } fileData - specifies the files data to remove from file list/server.\n * @returns void\n */\n Uploader.prototype.remove = function (fileData, customTemplate) {\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 var eventArgs = {\n cancel: false,\n filesData: removeFiles\n };\n this.trigger('removing', eventArgs);\n if (eventArgs.cancel) {\n return;\n }\n var removeUrl = this.asyncSettings.removeUrl;\n var validUrl = (removeUrl === '' || isNullOrUndefined(removeUrl)) ? false : true;\n for (var _i = 0, removeFiles_1 = removeFiles; _i < removeFiles_1.length; _i++) {\n var files = removeFiles_1[_i];\n if (files.statusCode === '2' && validUrl) {\n this.removeUploadedFile(files, customTemplate);\n }\n else {\n this.removeFilesData(files, customTemplate);\n }\n }\n };\n /**\n * Clear all the file entries from list that can be uploaded files or added in upload queue.\n * @returns void\n */\n Uploader.prototype.clearAll = function () {\n if (isNullOrUndefined(this.listParent)) {\n return;\n }\n var eventArgs = {\n cancel: false,\n filesData: this.filesData\n };\n this.trigger('clearing', eventArgs);\n if (eventArgs.cancel) {\n return;\n }\n this.clearData();\n };\n Uploader.prototype.getFilesData = function () {\n return this.filesData;\n };\n __decorate([\n Complex({ saveUrl: '', removeUrl: '' }, AsyncSettings)\n ], Uploader.prototype, \"asyncSettings\", void 0);\n __decorate([\n Property(false)\n ], Uploader.prototype, \"enableRtl\", 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 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 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, \"clearing\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"progress\", void 0);\n __decorate([\n Event()\n ], Uploader.prototype, \"change\", void 0);\n Uploader = __decorate([\n NotifyPropertyChanges\n ], Uploader);\n return Uploader;\n}(Component));\nexport { Uploader };\n","import { DataUtil } from './util';\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 * @param {string|string[]} from?\n * @hidden\n */\n function Query(from) {\n /** @hidden */\n this.subQuery = null;\n /** @hidden */\n this.isChild = false;\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 return this;\n }\n /**\n * Sets the primary key.\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 * @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 * @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 *