История

pipeline 59348e5abf v20.4.52 is released		2023-02-28 12:42:30 +00:00
..
src	v20.4.43 is released	2023-01-10 13:30:28 +00:00
styles	v20.4.38 is released	2022-12-21 09:48:29 +00:00
CHANGELOG.md	v20.4.52 is released	2023-02-28 12:42:30 +00:00
README.md	v20.4.38 is released	2022-12-21 09:48:29 +00:00
gulpfile.js	v17.3.16 is released	2019-10-09 12:29:52 +00:00
license	v17.3.16 is released	2019-10-09 12:29:52 +00:00
package.json	v20.4.52 is released	2023-02-28 12:42:30 +00:00
tsconfig.json	v17.3.16 is released	2019-10-09 12:29:52 +00:00

README.md

ej2-angular-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.

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

Setup

To install Input and its dependent packages, use the following command

npm install @syncfusion/ej2-angular-inputs

Components included

Following list of components are available in the package.

ColorPicker - Color picker is a user interface that is used to select and adjust color values.
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.
MaskedTextBox - MaskedTextBox allows the user to enter the valid input only based on the provided mask.
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.
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.
Slider - The slider component allows you to select a value or range of values between the min and max range.
Uploader - The Angular File Upload component is an extended version of the HTML5 upload control which is used to upload images, documents, and other files to a server.

Supported frameworks

Input component is also offered in following list of frameworks.

Showcase samples

Expanse Tracker (Source, Live Demo)
Loan Calculator (Source, Live Demo)
Cloud Pricing (Live Demo)

Key Features

1. ColorPicker

Color specification - Supports Red Green Blue, Hue Saturation Value and Hex codes.
Mode - Supports Picker and Palette mode.
Inline - Supports inline type rendering of color picker.
Custom palettes - Allows you to customize palettes and supports multiple palette groups rendering.
Opacity - Allows to set and change the opacity of the selected color.
Accessibility - Built-in accessibility features to access color picker using the keyboard, screen readers, or other assistive technology devices.

2. TextBox

Floating Label – floats the placeholder text while focus.
Input Group – group the icons, buttons along with textbox.
Validation States – provides styles for success, error, and warning states.
Multiline – handles multiline input with placeholder text

3. MaskedTextBox

Custom Characters - allows you to use your own characters as the mask elements.
Regular Expression - can be used as a mask element for each character of the MaskedTextBox.
Accessibility - 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 - allows to set the minimum and maximum range of values in the NumericTextBox.
Number Formats - supports the number display formatting with MSDN standard and custom number formats.
Precision Of Numbers - allows to restrict the number precision when enters the value.
Keyboard Interaction - allows users to interact with the NumericTextBox using the keyboard.
Accessibility - 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 - library provides support for formatting and parsing number using the official Unicode CLDR JSON data.
Localization - Supports to localize spin up and down buttons title for the tooltip to different cultures.

5. Signature

Customization - Support various customization options like background color, background image, stroke color, stroke width, save with background, undo, redo, clear, readonly, and disabled.
Save - Support to save the signature as image like PNG, JPEG, and SVG.
Load
Support to load the signature as base64 url of the image.
Draw
Support to draw the text with the different font family and font size.

6. Slider

Types - Provided three types of Slider.
Orientation - Displays the Slider in horizontal or vertical direction.
Buttons - Provided built-in support to render the buttons in both edges of the Slider.
Tooltip - Displays a tooltip to show the currently selected value.
Ticks - Displays a scale with small and big ticks.
Format - Customize the slider values into various format.
Limits - Slider thumb movement restriction enabled with interval dragging in range-slider.
Accessibility - Built-in compliance with the WAI-ARIA specifications.
Keyboard Interaction - The Slider can be intractable through the keyboard.

7. Upload

Chunk Upload – used to upload large files as chunks
Drag-and-drop – drag the files and drop into component to upload them.
Template – the file list and buttons can be customize using template
Validation – validate extension and size of upload file
Auto Upload – Process the file to upload without interaction.
Preload Files – View and manipulate previously uploaded files

Support

Product support is available for through following mediums.

Creating incident in Syncfusion Direct-trac support system or Community forum.
New GitHub issue.
Ask your query in Stack Overflow with tag syncfusion, ej2.

License

Check the license detail here.

Changelog

Check the changelog here