@syncfusion/ej2-angular-inputs 22.1.34-ngcc → 22.1.34

package/README.md

@@ -1,216 +1,145 @@
-# Angular Inputs Components
+# ej2-angular-inputs
 
-A package of Angular Inputs components. It comes with a collection of form components which is useful to get different input values from the users such as text, numbers, patterns, color and file inputs.
+A package of Syncfusion angular UI Components (Essential JS 2) Input textbox components. It comes with a collection of form components which is useful to get different input values from the users such as text, numbers, patterns, color and file inputs.
 
-## What's Included in the Angular Inputs Package
+![ej2-angular-inputs](https://ej2.syncfusion.com/products/images/input/readme.gif)
 
-The Angular Inputs package includes the following list of components.
+> Input is part of Syncfusion Essential JS 2 commercial program. License is available in two models Community and Paid. Please refer the license file for more information. License can be obtained by registering at [https://www.syncfusion.com/downloads/essential-js2](https://www.syncfusion.com/downloads/essential-js2/?utm_source=npm&utm_campaign=input)
 
-### Angular ColorPicker
-
-The [Angular ColorPicker](https://www.syncfusion.com/angular-components/angular-color-picker?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm) component is a user interface that is used to select and adjust color values.
-
-<p align="center">
-  <a href="https://ej2.syncfusion.com/angular/documentation/color-picker/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Getting Started</a> .
-  <a href="https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm#/material/color-picker/default">Online demos</a> .
-  <a href="https://www.syncfusion.com/angular-components/angular-color-picker?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Learn more</a>
-</p>
-
-<p align="center">
-<img alt="Angular ColorPicker Component" src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/angular/angular-colorpicker.png">
-</p>
-
-#### Key features
-
-* [Color specification](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=color-picker#/material/color-picker/default) - Supports `Red Green Blue`, `Hue Saturation Value` and `Hex` codes.
-* [Mode](https://ej2.syncfusion.com/angular/documentation/color-picker/mode-and-value#mode-and-value) - Supports `Picker` and `Palette` mode.
-* [Inline](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=color-picker#/material/color-picker/inline) - Supports inline type rendering of color picker.
-* [Custom palettes](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=color-picker#/material/color-picker/custom) - Allows to customize palettes and supports multiple palette groups rendering.
-* [Opacity](https://ej2.syncfusion.com/angular/documentation/color-picker/mode-and-value#color-value) - Allows to set and change the `opacity` of the selected color.
-* [Accessibility](https://ej2.syncfusion.com/angular/documentation/color-picker/accessibility#accessibility) - Built-in accessibility features to access color picker using the keyboard, screen readers, or other assistive technology devices.
-
-### Angular TextBox
-
-The [Angular TextBox](https://www.syncfusion.com/angular-components/angular-textbox?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm) component is an extended version of the HTML input control which is used to edit or display text input on a form.
-
-<p align="center">
-  <a href="https://ej2.syncfusion.com/angular/documentation/textbox/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Getting Started</a> .
-  <a href="https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm#/material/textboxes/default">Online demos</a> .
-  <a href="https://www.syncfusion.com/angular-components/angular-textbox?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Learn more</a>
-</p>
-
-<p align="center">
-<img alt="Angular TextBox Component" src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/angular/angular-textbox.png">
-</p>
-
-#### Key features
-
-* [Floating label](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) - Floats the placeholder text while focus.
-* [Input group](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) - Group the icons, buttons along with textbox.
-* [Validation states](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) - Provides styles for success, error, and warning states.
-* [Multiline](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) - Handles multiline input with placeholder text.
-
-### Angular MaskedTextBox
-
-The [Angular MaskedTextBox](https://www.syncfusion.com/angular-components/angular-input-mask?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm) component allows the user to enter the valid input only based on the provided mask.
-
-<p align="center">
-  <a href="https://ej2.syncfusion.com/angular/documentation/maskedtextbox/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Getting Started</a> .
-  <a href="https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm#/material/maskedtextbox/default">Online demos</a> .
-  <a href="https://www.syncfusion.com/angular-components/angular-input-mask?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Learn more</a>
-</p>
-
-<p align="center">
-<img alt="Angular MaskedTextBox Component" src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/angular/angular-maskedtextbox.png">
-</p>
-
-#### Key features
-
-* [Custom characters](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=maskedtextbox#/material/maskedtextbox/custommask) - Allows you to use your own characters as the mask elements.
-* [Regular expression](https://ej2.syncfusion.com/angular/documentation/maskedtextbox/mask-configuration#regular-expression?utm_source=npm&utm_campaign=maskedtextbox#regular-expression) - Can be used as a mask element for each character of the MaskedTextBox.
-* [Accessibility](https://ej2.syncfusion.com/angular/documentation/maskedtextbox/accessibility?utm_source=npm&utm_campaign=maskedtextbox) - Provides built-in accessibility support which helps to access all the MaskedTextBox component features through keyboard, on-screen readers, or other assistive technology devices.
-
-### Angular NumericTextBox
-
-The [Angular NumericTextBox](https://www.syncfusion.com/angular-components/angular-numeric-textbox?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm) component is used to get the number inputs from the user. The input values can be incremented or decremented by a predefined step value.
-
-<p align="center">
-  <a href="https://ej2.syncfusion.com/angular/documentation/numerictextbox/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Getting Started</a> .
-  <a href="https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm#/material/numerictextbox/default">Online demos</a> .
-  <a href="https://www.syncfusion.com/angular-components/angular-numeric-textbox?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Learn more</a>
-</p>
-
-<p align="center">
-<img alt="Angular NumericTextBox Component" src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/angular/angular-numerictextbox.png">
-</p>
-
-#### Key features
-
-* [Range validation](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=numerictextbox#/material/numerictextbox/range) - Allows to set the minimum and maximum range of values in the NumericTextBox.
-* [Number formats](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=numerictextbox#/material/numerictextbox/format) - Supports the number display formatting with MSDN standard and custom number formats.
-* [Precision Of numbers](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=numerictextbox#/material/numerictextbox/restrict) - Allows to restrict the number precision when enters the value.
-* [Keyboard interaction](https://ej2.syncfusion.com/angular/documentation/numerictextbox/accessibility#keyboard-interaction?utm_source=npm&utm_campaign=numerictextbox#keyboard-interaction) - Allows users to interact with the NumericTextBox using the keyboard.
-* [Accessibility](https://ej2.syncfusion.com/angular/documentation/numerictextbox/accessibility?utm_source=npm&utm_campaign=numerictextbox) - Provides built-in accessibility support which helps to access all the NumericTextBox component features through keyboard, on-screen readers or other assistive technology devices.
-* [Internationalization](https://ej2.syncfusion.com/angular/documentation/numerictextbox/internationalization.html?utm_source=npm&utm_campaign=numerictextbox) - Library provides support for formatting and parsing number using the official Unicode CLDR JSON data.
-* [Localization](https://ej2.syncfusion.com/angular/documentation/numerictextbox/globalization#internationalization?utm_source=npm&utm_campaign=numerictextbox#localization) - Supports to localize spin up and down buttons title for the tooltip to different cultures.
-
-### Angular Signature
-
-The [Angular Signature](https://www.syncfusion.com/angular-components/angular-signature?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm) component allows user to draw smooth signatures as vector outline of strokes using variable width bezier curve interpolation. It allows to save signature as image.
-
-<p align="center">
-  <a href="https://ej2.syncfusion.com/angular/documentation/signature/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Getting Started</a> .
-  <a href="https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm#/material/signature/default">Online demos</a> .
-  <a href="https://www.syncfusion.com/angular-components/angular-signature?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Learn more</a>
-</p>
-
-<p align="center">
-<img alt="Angular Signature Component" src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/angular/angular-signature.png">
-</p>
-
-#### Key features
-
-* [Customization](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html) - Support various customization options like background color, background image, stroke color, stroke width, save with background, undo, redo, clear, readonly, and disabled.
-* [Save](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html) - Support to save the signature as image like PNG, JPEG, and SVG.
-* [Load](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html) - Support to load the signature as base64 url of the image.
-* [Draw](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html) - Support to draw the text with the different font family and font size.
-
-### Angular Slider
-
-The [Angular Slider](https://www.syncfusion.com/angular-components/angular-slider?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm) component allows you to select a value or range of values between the min and max range.
-
-<p align="center">
-  <a href="https://ej2.syncfusion.com/angular/documentation/range-slider/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Getting Started</a> .
-  <a href="https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm#/material/range-slider/default">Online demos</a> .
-  <a href="https://www.syncfusion.com/angular-components/angular-slider?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Learn more</a>
-</p>
-
-<p align="center">
-<img alt="Angular Slider Component" src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/angular/angular-slider.png">
-</p>
-
-#### Key features
+## Setup
 
-* [Types](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/default) - Provided three types of Slider.
-* [Orientation](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/orientation) - Displays the Slider in horizontal or vertical direction.
-* [Buttons](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/tooltip) - Provided built-in support to render the buttons in both edges of the Slider.
-* [Tooltip](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/tooltip) - Displays a tooltip to show the currently selected value.
-* [Ticks](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/ticks) - Displays a scale with small and big ticks.
-* [Format](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/format) - Customize the slider values into various format.
-* [Limits](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/limits) - Slider thumb movement restriction enabled with interval dragging in range-slider.
-* [Accessibility](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/default) - Built-in compliance with the [WAI-ARIA](https://www.w3.org/WAI/ARIA/apg/) specifications.
-* [Keyboard Interaction](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/api) - The Slider can be intractable through the keyboard.
+To install Input and its dependent packages, use the following command
 
-### Angular File Upload
+```sh
+npm install @syncfusion/ej2-angular-inputs
+```
 
-The Angular [File Upload](https://www.syncfusion.com/angular-ui-components/angular-file-upload/?utm_source=npm&utm_medium=listing&utm_campaign=anuglar-file-upload-npm) component is an extended version of the HTML5 upload control which is used to upload images, documents, and other files to a server.
+## Components included
 
-<p align="center">
-  <a href="https://ej2.syncfusion.com/angular/documentation/uploader/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Getting Started</a> .
-  <a href="https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm#/material/uploader/default">Online demos</a> .
-  <a href="https://www.syncfusion.com/angular-components/angular-file-upload?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm">Learn more</a>
-</p>
+Following list of components are available in the package.
 
-<p align="center">
-<img alt="Angular FileUpload Component" src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/angular/angular-file-upload.png">
-</p>
+* **ColorPicker** - Color picker is a user interface that is used to select and adjust color values.
+  * [Getting Started](https://ej2.syncfusion.com/angular/documentation/color-picker/getting-started/?utm_source=npm&utm_campaign=color-picker)
+  * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=color-picker#/material/color-picker/default)
+  * [Product Page](https://www.syncfusion.com/angular-ui-components/color-picker)
 
-#### Key features
+* **TextBox** - The text box component is an extended version of the HTML input control which is used to edit or display text input on a form.
+  * [Getting Started](https://ej2.syncfusion.com/angular/documentation/textbox/getting-started/?utm_source=npm&utm_campaign=textbox)
+  * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default)
+  * [Product Page](https://www.syncfusion.com/angular-ui-components/text-box/?utm_source=npm&utm_campaign=text-box)
 
-* [Chunk upload](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/chunk-upload) - Used to upload large files as chunks
-* [Drag and drop](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/custom-drop-area) - Drag the files and drop into component to upload them.
-* [Template](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/custom-file-list) - The file list and buttons can be customize using template.
-* [Validation](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/file-validation) - Validate extension and size of upload file
-* [Auto upload](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/default) - Process the file to upload without interaction.
-* [Preload files](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/preload-files) - View and manipulate previously uploaded files.
+* **MaskedTextBox** - MaskedTextBox allows the user to enter the valid input only based on the provided mask.
+  * [Getting Started](https://ej2.syncfusion.com/angular/documentation/maskedtextbox/getting-started/?utm_source=npm&utm_campaign=maskedtextbox)
+  * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=maskedtextbox#/material/maskedtextbox/default)
+  * [Product Page](https://www.syncfusion.com/angular-ui-components/maskedtextbox/?utm_source=npm&utm_campaign=maskedtextbox)
 
-<p align="center">
-Trusted by the world's leading companies
-  <a href="https://www.syncfusion.com/">
-    <img src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/syncfusion/syncfusion-trusted-companies.webp" alt="Syncfusion logo">
-  </a>
-</p>
+* **NumericTextBox** - NumericTextBox is used to get the number inputs from the user. The input values can be incremented or decremented by a predefined step value.
+  * [Getting Started](https://ej2.syncfusion.com/angular/documentation/numerictextbox/getting-started/?utm_source=npm&utm_campaign=numerictextbox)
+  * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=numerictextbox#/material/numerictextbox/default)
+  * [Product Page](https://www.syncfusion.com/angular-ui-components/numerictextbox/?utm_source=npm&utm_campaign=numerictextbox)
 
-## Setup
+* **Signature** - The Signature component allows user to draw smooth signatures as vector outline of strokes using variable width bezier curve interpolation. It allows to save signature as image.
+  * [Getting Started](https://ej2.syncfusion.com/documentation/signature/getting-started?lang=typescript&utm_source=npm&utm_campaign=signature)
+  * [View Online Demos](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=signature#/material/signature/default.html)
+  * [Product Page](https://www.syncfusion.com/javascript-ui-controls/signature/?utm_source=npm&utm_campaign=signature)
 
-To install `inputs` and its dependent packages, use the following command.
+* **Slider** - The slider component allows you to select a value or range of values between the min and max range.
+  * [Getting Started](https://ej2.syncfusion.com/angular/documentation/slider/getting-started/?utm_source=npm&utm_campaign=slider)
+  * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/default)
+  * [Product Page](https://www.syncfusion.com/angular-ui-components/slider/?utm_source=npm&utm_campaign=slider)
 
-```sh
-npm install @syncfusion/ej2-angular-inputs
-```
+* **Uploader** - The [Angular File Upload](https://www.syncfusion.com/angular-ui-components/angular-file-upload/?utm_source=npm&utm_medium=listing&utm_campaign=anuglar-file-upload-npm) component is an extended version of the HTML5 upload control which is used to upload images, documents, and other files to a server.
+  * [Product Page](https://www.syncfusion.com/angular-ui-components/angular-file-upload/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm)
+  * [Getting Started](https://ej2.syncfusion.com/angular/documentation/uploader/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm)
+  * [View Online Demos](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/default)
 
 ## Supported frameworks
 
-Inputs components are also offered in following list of frameworks.
+Input component is also offered in following list of frameworks.
 
-| [<img src="https://ej2.syncfusion.com/github/images/js.svg" height="50" />](https://www.syncfusion.com/javascript-ui-controls?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_medium=listing&utm_source=github)&nbsp;&nbsp;&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/react.svg"  height="50" />](https://www.syncfusion.com/react-ui-components?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[React](https://www.syncfusion.com/react-ui-components?utm_medium=listing&utm_source=github)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/vue.svg" height="50" />](https://www.syncfusion.com/vue-ui-components?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[Vue](https://www.syncfusion.com/vue-ui-components?utm_medium=listing&utm_source=github)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/netcore.svg" height="50" />](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;[ASP.NET&nbsp;Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/netmvc.svg" height="50" />](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;[ASP.NET&nbsp;MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)&nbsp;&nbsp; | 
-| :-----: | :-----: | :-----: | :-----: | :-----: |
+1. [React](https://github.com/syncfusion/ej2-react-ui-components/tree/master/components/inputs?utm_source=npm&utm_campaign=input)
+2. [VueJS](https://github.com/syncfusion/ej2-vue-ui-components/tree/master/components/inputs/?utm_source=npm&utm_campaign=input)
+3. [ASP.NET Core](https://www.syncfusion.com/aspnet-core-ui-controls/numeric-textbox/?utm_source=npm&utm_campaign=input)
+4. [ASP.NET MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls/input-mask/?utm_source=npm&utm_campaign=input)
+5. [JavaScript (ES5)](https://www.syncfusion.com/javascript-ui-controls/range-slider/?utm_source=npm&utm_campaign=input)
 
 ## Showcase samples
 
-* Loan Calculator - [Source](https://github.com/syncfusion/ej2-showcase-angular-loancalculator), [Live Demo]( https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_campaign=slider)
-* Cloud Pricing - [Live Demo](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/azure-pricing)
+* Expanse Tracker ([Source](https://github.com/syncfusion/ej2-showcase-ts-expensetracker), [Live Demo]( https://ej2.syncfusion.com/showcase/angular/expensetracker/?utm_source=npm&utm_campaign=numerictextbox#/expense))
+* Loan Calculator ([Source](https://github.com/syncfusion/ej2-showcase-angular-loancalculator), [Live Demo]( https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_campaign=slider))
+* Cloud Pricing ([Live Demo](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/azure-pricing))
+
+## Key Features
+
+### 1. ColorPicker
+- [**Color specification**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=color-picker#/material/color-picker/default) - Supports `Red Green Blue`, `Hue Saturation Value` and `Hex` codes.
+- [**Mode**](https://ej2.syncfusion.com/angular/documentation/color-picker/mode-and-value#mode-and-value) - Supports `Picker` and `Palette` mode.
+- [**Inline**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=color-picker#/material/color-picker/inline) - Supports inline type rendering of color picker.
+- [**Custom palettes**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=color-picker#/material/color-picker/custom) - Allows you to customize palettes and supports multiple palette groups rendering.
+- [**Opacity**](https://ej2.syncfusion.com/angular/documentation/color-picker/mode-and-value#color-value) - Allows to set and change the `opacity` of the selected color.
+- [**Accessibility**](https://ej2.syncfusion.com/angular/documentation/color-picker/accessibility#accessibility) - Built-in accessibility features to access color picker using the keyboard, screen readers, or other assistive technology devices.
+
+### 2. TextBox
+- [**Floating Label**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) – floats the placeholder text while focus.
+- [**Input Group**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) – group the icons, buttons along with textbox.
+- [**Validation States**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) – provides styles for success, error, and warning states.
+- [**Multiline**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=textbox#/material/textboxes/default) – handles multiline input with placeholder text
+
+### 3. MaskedTextBox
+- [**Custom Characters**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=maskedtextbox#/material/maskedtextbox/custommask) - allows you to use your own characters as the mask elements.
+- [**Regular Expression**](https://ej2.syncfusion.com/angular/documentation/maskedtextbox/mask-configuration#regular-expression?utm_source=npm&utm_campaign=maskedtextbox#regular-expression) - can be used as a mask element for each character of the MaskedTextBox.
+- [**Accessibility**](https://ej2.syncfusion.com/angular/documentation/maskedtextbox/accessibility?utm_source=npm&utm_campaign=maskedtextbox) - provides built-in accessibility support which helps to access all the MaskedTextBox component features through keyboard, on-screen readers, or other assistive technology devices.
+
+### 4. NumericTextBox
+- [**Range Validation**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=numerictextbox#/material/numerictextbox/range) - allows to set the minimum and maximum range of values in the NumericTextBox.
+- [**Number Formats**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=numerictextbox#/material/numerictextbox/format) - supports the number display formatting with MSDN standard and custom number formats.
+- [**Precision Of Numbers**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=numerictextbox#/material/numerictextbox/restrict) - allows to restrict the number precision when enters the value.
+- [**Keyboard Interaction**](https://ej2.syncfusion.com/angular/documentation/numerictextbox/accessibility#keyboard-interaction?utm_source=npm&utm_campaign=numerictextbox#keyboard-interaction) - allows users to interact with the NumericTextBox using the keyboard.
+- [**Accessibility**](https://ej2.syncfusion.com/angular/documentation/numerictextbox/accessibility?utm_source=npm&utm_campaign=numerictextbox) - provides built-in accessibility support which helps to access all the NumericTextBox component features through keyboard, on-screen readers or other assistive technology devices.
+- [**Internationalization**](https://ej2.syncfusion.com/angular/documentation/numerictextbox/internationalization.html?utm_source=npm&utm_campaign=numerictextbox) - library provides support for formatting and parsing number using the official Unicode CLDR JSON data.
+- [**Localization**](https://ej2.syncfusion.com/angular/documentation/numerictextbox/globalization#internationalization?utm_source=npm&utm_campaign=numerictextbox#localization) - Supports to localize spin up and down buttons title for the tooltip to different cultures.
+
+### 5. Signature
+- [**Customization**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html) - Support various customization options like background color, background image, stroke color, stroke width, save with background, undo, redo, clear, readonly, and disabled.
+- [**Save**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html) - Support to save the signature as image like PNG, JPEG, and SVG.
+- [**Load**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html)
+- Support to load the signature as base64 url of the image.
+- [**Draw**](https://ej2.syncfusion.com/demos/?utm_source=npm&utm_campaign=slider#/material/signature/default.html)
+- Support to draw the text with the different font family and font size.
+
+### 6. Slider
+- [**Types**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/default) - Provided three types of Slider.
+- [**Orientation**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/orientation) - Displays the Slider in horizontal or vertical direction.
+- [**Buttons**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/tooltip) - Provided built-in support to render the buttons in both edges of the Slider.
+- [**Tooltip**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/tooltip) - Displays a tooltip to show the currently selected value.
+- [**Ticks**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/ticks) - Displays a scale with small and big ticks.
+- [**Format**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/format) - Customize the slider values into various format.
+- [**Limits**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/limits) - Slider thumb movement restriction enabled with interval dragging in range-slider.
+- [**Accessibility**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/default) - Built-in compliance with the [WAI-ARIA](http://www.w3.org/WAI/PF/aria-practices/) specifications.
+- [**Keyboard Interaction**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/material/slider/api) - The Slider can be intractable through the keyboard.
+
+### 7. Upload
+- [**Chunk Upload**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/chunk-upload) – used to upload large files as chunks
+- [**Drag-and-drop**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/custom-drop-area) – drag the files and drop into component to upload them.
+- [**Template**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/custom-file-list) – the file list and buttons can be customize using template
+- [**Validation**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/file-validation) – validate extension and size of upload file
+- [**Auto Upload**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/default) – Process the file to upload without interaction.
+- [**Preload Files**](https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_medium=listing&utm_campaign=angular-file-upload-npm#/material/uploader/preload-files) – View and manipulate previously uploaded files
 
 ## Support
 
-Product support is available through following mediums.
-
-* [Support ticket](https://support.syncfusion.com/support/tickets/create) - Guaranteed Response in 24 hours | Unlimited tickets | Holiday support
-* [Community forum](https://www.syncfusion.com/forums/essential-js2?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm)
-* [GitHub issues](https://github.com/syncfusion/ej2-angular-ui-components/issues/new)
-* [Request feature or report bug](https://www.syncfusion.com/feedback/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm)
-* Live chat
+Product support is available for through following mediums.
 
-## Changelog
+* Creating incident in Syncfusion [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents/?utm_source=npm&utm_campaign=input) support system or [Community forum](https://www.syncfusion.com/forums/essential-js2/?utm_source=npm&utm_campaign=input).
+* New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues/new).
+* Ask your query in Stack Overflow with tag `syncfusion`, `ej2`.
 
-Check the changelog [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/inputs/CHANGELOG.md/?utm_source=npm&utm_campaign=input). Get minor improvements and bug fixes every week to stay up to date with frequent updates.
+## License
 
-## License and copyright
+Check the license detail [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/license/?utm_source=npm&utm_campaign=input).
 
-> This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's [EULA](https://www.syncfusion.com/eula/es/). To acquire a license for 80+ [Angular UI components](https://www.syncfusion.com/angular-components), you can [purchase](https://www.syncfusion.com/sales/products) or [start a free 30-day trial](https://www.syncfusion.com/account/manage-trials/start-trials).
-
-> A free community [license](https://www.syncfusion.com/products/communitylicense) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.
+## Changelog
 
-See [LICENSE FILE](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/license/?utm_source=npm&utm_campaign=input) for more info.
+Check the changelog [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/inputs/CHANGELOG.md/?utm_source=npm&utm_campaign=input)
 
-& Copyright 2023 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.
+© Copyright 2023 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.

package/esm2020/public_api.mjs

@@ -0,0 +1,3 @@
+// Mapping root file for package generation
+export * from './src/index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3B1YmxpY19hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsMkNBQTJDO0FBQzNDLGNBQWMsYUFBYSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLy8gTWFwcGluZyByb290IGZpbGUgZm9yIHBhY2thZ2UgZ2VuZXJhdGlvblxuZXhwb3J0ICogZnJvbSAnLi9zcmMvaW5kZXgnOyJdfQ==

package/esm2020/src/color-picker/colorpicker-all.module.mjs

@@ -0,0 +1,23 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ColorPickerModule } from './colorpicker.module';
+import * as i0 from "@angular/core";
+/**
+ * NgModule definition for the ColorPicker component with providers.
+ */
+export class ColorPickerAllModule {
+}
+ColorPickerAllModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerAllModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ColorPickerAllModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerAllModule, imports: [CommonModule, ColorPickerModule], exports: [ColorPickerModule] });
+ColorPickerAllModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerAllModule, providers: [], imports: [[CommonModule, ColorPickerModule], ColorPickerModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerAllModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, ColorPickerModule],
+                    exports: [
+                        ColorPickerModule
+                    ],
+                    providers: []
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3JwaWNrZXItYWxsLm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb2xvci1waWNrZXIvY29sb3JwaWNrZXItYWxsLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsUUFBUSxFQUFpQixNQUFNLGVBQWUsQ0FBQztBQUN4RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFL0MsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7O0FBTXpEOztHQUVHO0FBVUgsTUFBTSxPQUFPLG9CQUFvQjs7aUhBQXBCLG9CQUFvQjtrSEFBcEIsb0JBQW9CLFlBUm5CLFlBQVksRUFBRSxpQkFBaUIsYUFFckMsaUJBQWlCO2tIQU1aLG9CQUFvQixhQUpuQixFQUVULFlBTlEsQ0FBQyxZQUFZLEVBQUUsaUJBQWlCLENBQUMsRUFFdEMsaUJBQWlCOzJGQU1aLG9CQUFvQjtrQkFUaEMsUUFBUTttQkFBQztvQkFDTixPQUFPLEVBQUUsQ0FBQyxZQUFZLEVBQUUsaUJBQWlCLENBQUM7b0JBQzFDLE9BQU8sRUFBRTt3QkFDTCxpQkFBaUI7cUJBQ3BCO29CQUNELFNBQVMsRUFBQyxFQUVUO2lCQUNKIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUsIFZhbHVlUHJvdmlkZXIgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDb2xvclBpY2tlckNvbXBvbmVudCB9IGZyb20gJy4vY29sb3JwaWNrZXIuY29tcG9uZW50JztcbmltcG9ydCB7IENvbG9yUGlja2VyTW9kdWxlIH0gZnJvbSAnLi9jb2xvcnBpY2tlci5tb2R1bGUnO1xuXG5cblxuXG5cbi8qKlxuICogTmdNb2R1bGUgZGVmaW5pdGlvbiBmb3IgdGhlIENvbG9yUGlja2VyIGNvbXBvbmVudCB3aXRoIHByb3ZpZGVycy5cbiAqL1xuQE5nTW9kdWxlKHtcbiAgICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBDb2xvclBpY2tlck1vZHVsZV0sXG4gICAgZXhwb3J0czogW1xuICAgICAgICBDb2xvclBpY2tlck1vZHVsZVxuICAgIF0sXG4gICAgcHJvdmlkZXJzOltcbiAgICAgICAgXG4gICAgXVxufSlcbmV4cG9ydCBjbGFzcyBDb2xvclBpY2tlckFsbE1vZHVsZSB7IH0iXX0=

package/esm2020/src/color-picker/colorpicker.component.mjs

@@ -0,0 +1,83 @@
+var ColorPickerComponent_1;
+import { __decorate } from "tslib";
+import { Component, ChangeDetectionStrategy, forwardRef } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { ComponentBase, ComponentMixins, FormBase, setValue } from '@syncfusion/ej2-angular-base';
+import { ColorPicker } from '@syncfusion/ej2-inputs';
+import * as i0 from "@angular/core";
+export const inputs = ['columns', 'createPopupOnClick', 'cssClass', 'disabled', 'enableOpacity', 'enablePersistence', 'enableRtl', 'inline', 'locale', 'mode', 'modeSwitcher', 'noColor', 'presetColors', 'showButtons', 'value'];
+export const outputs = ['focus', 'blur', 'beforeClose', 'beforeModeSwitch', 'beforeOpen', 'beforeTileRender', 'change', 'created', 'onModeSwitch', 'open', 'select', 'valueChange'];
+export const twoWays = ['value'];
+/**
+ * Represents the EJ2 Angular ColorPicker Component.
+ * ```html
+ * <input ejs-colorpicker type='color'/>
+ * ```
+ */
+let ColorPickerComponent = ColorPickerComponent_1 = class ColorPickerComponent extends ColorPicker {
+    constructor(ngEle, srenderer, viewContainerRef, injector) {
+        super();
+        this.ngEle = ngEle;
+        this.srenderer = srenderer;
+        this.viewContainerRef = viewContainerRef;
+        this.injector = injector;
+        this.element = this.ngEle.nativeElement;
+        this.injectedModules = this.injectedModules || [];
+        this.registerEvents(outputs);
+        this.addTwoWay.call(this, twoWays);
+        setValue('currentInstance', this, this.viewContainerRef);
+        this.formContext = new FormBase();
+        this.formCompContext = new ComponentBase();
+    }
+    registerOnChange(registerFunction) {
+    }
+    registerOnTouched(registerFunction) {
+    }
+    writeValue(value) {
+    }
+    setDisabledState(disabled) {
+    }
+    ngOnInit() {
+        this.formCompContext.ngOnInit(this);
+    }
+    ngAfterViewInit() {
+        this.formContext.ngAfterViewInit(this);
+    }
+    ngOnDestroy() {
+        this.formCompContext.ngOnDestroy(this);
+    }
+    ngAfterContentChecked() {
+        this.formCompContext.ngAfterContentChecked(this);
+    }
+};
+ColorPickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
+ColorPickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: ColorPickerComponent, selector: "[ejs-colorpicker]", inputs: { columns: "columns", createPopupOnClick: "createPopupOnClick", cssClass: "cssClass", disabled: "disabled", enableOpacity: "enableOpacity", enablePersistence: "enablePersistence", enableRtl: "enableRtl", inline: "inline", locale: "locale", mode: "mode", modeSwitcher: "modeSwitcher", noColor: "noColor", presetColors: "presetColors", showButtons: "showButtons", value: "value" }, outputs: { focus: "focus", blur: "blur", beforeClose: "beforeClose", beforeModeSwitch: "beforeModeSwitch", beforeOpen: "beforeOpen", beforeTileRender: "beforeTileRender", change: "change", created: "created", onModeSwitch: "onModeSwitch", open: "open", select: "select", valueChange: "valueChange" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: forwardRef(() => ColorPickerComponent_1),
+            multi: true
+        }
+    ], usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ColorPickerComponent = ColorPickerComponent_1 = __decorate([
+    ComponentMixins([ComponentBase, FormBase])
+], ColorPickerComponent);
+export { ColorPickerComponent };
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[ejs-colorpicker]',
+                    inputs: inputs,
+                    outputs: outputs,
+                    template: '',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ColorPickerComponent),
+                            multi: true
+                        }
+                    ],
+                    queries: {}
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.Injector }]; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3JwaWNrZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NvbG9yLXBpY2tlci9jb2xvcnBpY2tlci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFvRSx1QkFBdUIsRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakosT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbkQsT0FBTyxFQUFFLGFBQWEsRUFBK0IsZUFBZSxFQUEwQixRQUFRLEVBQUUsUUFBUSxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDdkosT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLHdCQUF3QixDQUFDOztBQUlyRCxNQUFNLENBQUMsTUFBTSxNQUFNLEdBQWEsQ0FBQyxTQUFTLEVBQUMsb0JBQW9CLEVBQUMsVUFBVSxFQUFDLFVBQVUsRUFBQyxlQUFlLEVBQUMsbUJBQW1CLEVBQUMsV0FBVyxFQUFDLFFBQVEsRUFBQyxRQUFRLEVBQUMsTUFBTSxFQUFDLGNBQWMsRUFBQyxTQUFTLEVBQUMsY0FBYyxFQUFDLGFBQWEsRUFBQyxPQUFPLENBQUMsQ0FBQztBQUM5TixNQUFNLENBQUMsTUFBTSxPQUFPLEdBQWEsQ0FBQyxPQUFPLEVBQUUsTUFBTSxFQUFFLGFBQWEsRUFBQyxrQkFBa0IsRUFBQyxZQUFZLEVBQUMsa0JBQWtCLEVBQUMsUUFBUSxFQUFDLFNBQVMsRUFBQyxjQUFjLEVBQUMsTUFBTSxFQUFDLFFBQVEsRUFBQyxhQUFhLENBQUMsQ0FBQztBQUNyTCxNQUFNLENBQUMsTUFBTSxPQUFPLEdBQWEsQ0FBQyxPQUFPLENBQUMsQ0FBQztBQUUzQzs7Ozs7R0FLRztJQW1CVSxvQkFBb0Isa0NBQXBCLG9CQUFxQixTQUFRLFdBQVc7SUFtQmpELFlBQW9CLEtBQWlCLEVBQVUsU0FBb0IsRUFBVSxnQkFBaUMsRUFBVSxRQUFrQjtRQUN0SSxLQUFLLEVBQUUsQ0FBQztRQURRLFVBQUssR0FBTCxLQUFLLENBQVk7UUFBVSxjQUFTLEdBQVQsU0FBUyxDQUFXO1FBQVUscUJBQWdCLEdBQWhCLGdCQUFnQixDQUFpQjtRQUFVLGFBQVEsR0FBUixRQUFRLENBQVU7UUFFdEksSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsQ0FBQztRQUN4QyxJQUFJLENBQUMsZUFBZSxHQUFHLElBQUksQ0FBQyxlQUFlLElBQUksRUFBRSxDQUFDO1FBRWxELElBQUksQ0FBQyxjQUFjLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDN0IsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLE9BQU8sQ0FBQyxDQUFDO1FBQ25DLFFBQVEsQ0FBQyxpQkFBaUIsRUFBRSxJQUFJLEVBQUUsSUFBSSxDQUFDLGdCQUFnQixDQUFDLENBQUM7UUFDekQsSUFBSSxDQUFDLFdBQVcsR0FBSSxJQUFJLFFBQVEsRUFBRSxDQUFDO1FBQ25DLElBQUksQ0FBQyxlQUFlLEdBQUksSUFBSSxhQUFhLEVBQUUsQ0FBQztJQUNoRCxDQUFDO0lBRU0sZ0JBQWdCLENBQUMsZ0JBQWtDO0lBQzFELENBQUM7SUFFTSxpQkFBaUIsQ0FBQyxnQkFBNEI7SUFDckQsQ0FBQztJQUVNLFVBQVUsQ0FBQyxLQUFVO0lBQzVCLENBQUM7SUFFTSxnQkFBZ0IsQ0FBQyxRQUFpQjtJQUN6QyxDQUFDO0lBRU0sUUFBUTtRQUNYLElBQUksQ0FBQyxlQUFlLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ3hDLENBQUM7SUFFTSxlQUFlO1FBQ2xCLElBQUksQ0FBQyxXQUFXLENBQUMsZUFBZSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzNDLENBQUM7SUFFTSxXQUFXO1FBQ2QsSUFBSSxDQUFDLGVBQWUsQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDM0MsQ0FBQztJQUVNLHFCQUFxQjtRQUV4QixJQUFJLENBQUMsZUFBZSxDQUFDLHFCQUFxQixDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ3JELENBQUM7Q0FJSixDQUFBO2lIQTlEWSxvQkFBb0I7cUdBQXBCLG9CQUFvQiw2dEJBWmxCO1FBQ1A7WUFDSSxPQUFPLEVBQUUsaUJBQWlCO1lBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsc0JBQW9CLENBQUM7WUFDbkQsS0FBSyxFQUFFLElBQUk7U0FDZDtLQUNKLGlEQVJTLEVBQUU7QUFjSCxvQkFBb0I7SUFEaEMsZUFBZSxDQUFDLENBQUMsYUFBYSxFQUFFLFFBQVEsQ0FBQyxDQUFDO0dBQzlCLG9CQUFvQixDQThEaEM7U0E5RFksb0JBQW9COzJGQUFwQixvQkFBb0I7a0JBbEJoQyxTQUFTO21CQUFDO29CQUNQLFFBQVEsRUFBRSxtQkFBbUI7b0JBQzdCLE1BQU0sRUFBRSxNQUFNO29CQUNkLE9BQU8sRUFBRSxPQUFPO29CQUNoQixRQUFRLEVBQUUsRUFBRTtvQkFDWixlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtvQkFDL0MsU0FBUyxFQUFFO3dCQUNQOzRCQUNJLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLHFCQUFxQixDQUFDOzRCQUNuRCxLQUFLLEVBQUUsSUFBSTt5QkFDZDtxQkFDSjtvQkFDRCxPQUFPLEVBQUUsRUFFUjtpQkFDSiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgVmlld0NvbnRhaW5lclJlZiwgVmFsdWVQcm92aWRlciwgUmVuZGVyZXIyLCBJbmplY3RvciwgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIGZvcndhcmRSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgQ29tcG9uZW50QmFzZSwgSUNvbXBvbmVudEJhc2UsIGFwcGx5TWl4aW5zLCBDb21wb25lbnRNaXhpbnMsIFByb3BlcnR5Q29sbGVjdGlvbkluZm8sIEZvcm1CYXNlLCBzZXRWYWx1ZSB9IGZyb20gJ0BzeW5jZnVzaW9uL2VqMi1hbmd1bGFyLWJhc2UnO1xuaW1wb3J0IHsgQ29sb3JQaWNrZXIgfSBmcm9tICdAc3luY2Z1c2lvbi9lajItaW5wdXRzJztcblxuXG5cbmV4cG9ydCBjb25zdCBpbnB1dHM6IHN0cmluZ1tdID0gWydjb2x1bW5zJywnY3JlYXRlUG9wdXBPbkNsaWNrJywnY3NzQ2xhc3MnLCdkaXNhYmxlZCcsJ2VuYWJsZU9wYWNpdHknLCdlbmFibGVQZXJzaXN0ZW5jZScsJ2VuYWJsZVJ0bCcsJ2lubGluZScsJ2xvY2FsZScsJ21vZGUnLCdtb2RlU3dpdGNoZXInLCdub0NvbG9yJywncHJlc2V0Q29sb3JzJywnc2hvd0J1dHRvbnMnLCd2YWx1ZSddO1xuZXhwb3J0IGNvbnN0IG91dHB1dHM6IHN0cmluZ1tdID0gWydmb2N1cycsICdibHVyJywgJ2JlZm9yZUNsb3NlJywnYmVmb3JlTW9kZVN3aXRjaCcsJ2JlZm9yZU9wZW4nLCdiZWZvcmVUaWxlUmVuZGVyJywnY2hhbmdlJywnY3JlYXRlZCcsJ29uTW9kZVN3aXRjaCcsJ29wZW4nLCdzZWxlY3QnLCd2YWx1ZUNoYW5nZSddO1xuZXhwb3J0IGNvbnN0IHR3b1dheXM6IHN0cmluZ1tdID0gWyd2YWx1ZSddO1xuXG4vKipcbiAqIFJlcHJlc2VudHMgdGhlIEVKMiBBbmd1bGFyIENvbG9yUGlja2VyIENvbXBvbmVudC5cbiAqIGBgYGh0bWxcbiAqIDxpbnB1dCBlanMtY29sb3JwaWNrZXIgdHlwZT0nY29sb3InLz5cbiAqIGBgYFxuICovXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ1tlanMtY29sb3JwaWNrZXJdJyxcbiAgICBpbnB1dHM6IGlucHV0cyxcbiAgICBvdXRwdXRzOiBvdXRwdXRzLFxuICAgIHRlbXBsYXRlOiAnJyxcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgICBwcm92aWRlcnM6IFtcbiAgICAgICAge1xuICAgICAgICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgICAgICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBDb2xvclBpY2tlckNvbXBvbmVudCksXG4gICAgICAgICAgICBtdWx0aTogdHJ1ZVxuICAgICAgICB9XG4gICAgXSxcbiAgICBxdWVyaWVzOiB7XG5cbiAgICB9XG59KVxuQENvbXBvbmVudE1peGlucyhbQ29tcG9uZW50QmFzZSwgRm9ybUJhc2VdKVxuZXhwb3J0IGNsYXNzIENvbG9yUGlja2VyQ29tcG9uZW50IGV4dGVuZHMgQ29sb3JQaWNrZXIgaW1wbGVtZW50cyBJQ29tcG9uZW50QmFzZSB7XG4gICAgcHVibGljIGZvcm1Db21wQ29udGV4dCA6IGFueTtcbiAgICBwdWJsaWMgZm9ybUNvbnRleHQgOiBhbnk7XG4gICAgcHVibGljIHRhZ09iamVjdHM6IGFueTtcblx0YmVmb3JlQ2xvc2U6IGFueTtcblx0YmVmb3JlTW9kZVN3aXRjaDogYW55O1xuXHRiZWZvcmVPcGVuOiBhbnk7XG5cdGJlZm9yZVRpbGVSZW5kZXI6IGFueTtcblx0Y2hhbmdlOiBhbnk7XG5cdGNyZWF0ZWQ6IGFueTtcblx0b25Nb2RlU3dpdGNoOiBhbnk7XG5cdG9wZW46IGFueTtcblx0c2VsZWN0OiBhbnk7XG5cdHB1YmxpYyB2YWx1ZUNoYW5nZTogYW55O1xuXG5cblxuICAgIHB1YmxpYyBmb2N1czogYW55O1xuICAgIHB1YmxpYyBibHVyOiBhbnk7XG4gICAgY29uc3RydWN0b3IocHJpdmF0ZSBuZ0VsZTogRWxlbWVudFJlZiwgcHJpdmF0ZSBzcmVuZGVyZXI6IFJlbmRlcmVyMiwgcHJpdmF0ZSB2aWV3Q29udGFpbmVyUmVmOlZpZXdDb250YWluZXJSZWYsIHByaXZhdGUgaW5qZWN0b3I6IEluamVjdG9yKSB7XG4gICAgICAgIHN1cGVyKCk7XG4gICAgICAgIHRoaXMuZWxlbWVudCA9IHRoaXMubmdFbGUubmF0aXZlRWxlbWVudDtcbiAgICAgICAgdGhpcy5pbmplY3RlZE1vZHVsZXMgPSB0aGlzLmluamVjdGVkTW9kdWxlcyB8fCBbXTtcblxuICAgICAgICB0aGlzLnJlZ2lzdGVyRXZlbnRzKG91dHB1dHMpO1xuICAgICAgICB0aGlzLmFkZFR3b1dheS5jYWxsKHRoaXMsIHR3b1dheXMpO1xuICAgICAgICBzZXRWYWx1ZSgnY3VycmVudEluc3RhbmNlJywgdGhpcywgdGhpcy52aWV3Q29udGFpbmVyUmVmKTtcbiAgICAgICAgdGhpcy5mb3JtQ29udGV4dCAgPSBuZXcgRm9ybUJhc2UoKTtcbiAgICAgICAgdGhpcy5mb3JtQ29tcENvbnRleHQgID0gbmV3IENvbXBvbmVudEJhc2UoKTtcbiAgICB9XG5cbiAgICBwdWJsaWMgcmVnaXN0ZXJPbkNoYW5nZShyZWdpc3RlckZ1bmN0aW9uOiAoXzogYW55KSA9PiB2b2lkKTogdm9pZCB7XG4gICAgfVxuXG4gICAgcHVibGljIHJlZ2lzdGVyT25Ub3VjaGVkKHJlZ2lzdGVyRnVuY3Rpb246ICgpID0+IHZvaWQpOiB2b2lkIHtcbiAgICB9XG5cbiAgICBwdWJsaWMgd3JpdGVWYWx1ZSh2YWx1ZTogYW55KTogdm9pZCB7XG4gICAgfVxuICAgIFxuICAgIHB1YmxpYyBzZXREaXNhYmxlZFN0YXRlKGRpc2FibGVkOiBib29sZWFuKTogdm9pZCB7XG4gICAgfVxuXG4gICAgcHVibGljIG5nT25Jbml0KCkge1xuICAgICAgICB0aGlzLmZvcm1Db21wQ29udGV4dC5uZ09uSW5pdCh0aGlzKTtcbiAgICB9XG5cbiAgICBwdWJsaWMgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgICAgICB0aGlzLmZvcm1Db250ZXh0Lm5nQWZ0ZXJWaWV3SW5pdCh0aGlzKTtcbiAgICB9XG5cbiAgICBwdWJsaWMgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgICAgIHRoaXMuZm9ybUNvbXBDb250ZXh0Lm5nT25EZXN0cm95KHRoaXMpO1xuICAgIH1cblxuICAgIHB1YmxpYyBuZ0FmdGVyQ29udGVudENoZWNrZWQoKTogdm9pZCB7XG4gICAgICAgIFxuICAgICAgICB0aGlzLmZvcm1Db21wQ29udGV4dC5uZ0FmdGVyQ29udGVudENoZWNrZWQodGhpcyk7XG4gICAgfVxuXG4gICAgcHVibGljIHJlZ2lzdGVyRXZlbnRzOiAoZXZlbnRMaXN0OiBzdHJpbmdbXSkgPT4gdm9pZDtcbiAgICBwdWJsaWMgYWRkVHdvV2F5OiAocHJvcExpc3Q6IHN0cmluZ1tdKSA9PiB2b2lkO1xufVxuXG4iXX0=

package/esm2020/src/color-picker/colorpicker.module.mjs

@@ -0,0 +1,25 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ColorPickerComponent } from './colorpicker.component';
+import * as i0 from "@angular/core";
+/**
+ * NgModule definition for the ColorPicker component.
+ */
+export class ColorPickerModule {
+}
+ColorPickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ColorPickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerModule, declarations: [ColorPickerComponent], imports: [CommonModule], exports: [ColorPickerComponent] });
+ColorPickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerModule, imports: [[CommonModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: ColorPickerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule],
+                    declarations: [
+                        ColorPickerComponent
+                    ],
+                    exports: [
+                        ColorPickerComponent
+                    ]
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3JwaWNrZXIubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NvbG9yLXBpY2tlci9jb2xvcnBpY2tlci5tb2R1bGUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0seUJBQXlCLENBQUM7O0FBRS9EOztHQUVHO0FBVUgsTUFBTSxPQUFPLGlCQUFpQjs7OEdBQWpCLGlCQUFpQjsrR0FBakIsaUJBQWlCLGlCQU50QixvQkFBb0IsYUFGZCxZQUFZLGFBS2xCLG9CQUFvQjsrR0FHZixpQkFBaUIsWUFSakIsQ0FBQyxZQUFZLENBQUM7MkZBUWQsaUJBQWlCO2tCQVQ3QixRQUFRO21CQUFDO29CQUNOLE9BQU8sRUFBRSxDQUFDLFlBQVksQ0FBQztvQkFDdkIsWUFBWSxFQUFFO3dCQUNWLG9CQUFvQjtxQkFDdkI7b0JBQ0QsT0FBTyxFQUFFO3dCQUNMLG9CQUFvQjtxQkFDdkI7aUJBQ0oiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbG9yUGlja2VyQ29tcG9uZW50IH0gZnJvbSAnLi9jb2xvcnBpY2tlci5jb21wb25lbnQnO1xuXG4vKipcbiAqIE5nTW9kdWxlIGRlZmluaXRpb24gZm9yIHRoZSBDb2xvclBpY2tlciBjb21wb25lbnQuXG4gKi9cbkBOZ01vZHVsZSh7XG4gICAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gICAgZGVjbGFyYXRpb25zOiBbXG4gICAgICAgIENvbG9yUGlja2VyQ29tcG9uZW50XG4gICAgXSxcbiAgICBleHBvcnRzOiBbXG4gICAgICAgIENvbG9yUGlja2VyQ29tcG9uZW50XG4gICAgXVxufSlcbmV4cG9ydCBjbGFzcyBDb2xvclBpY2tlck1vZHVsZSB7IH0iXX0=