# ember-cp-validated-control

> The default blueprint for ember-cli addons.

Latest version **0.0.2** (published 2019-12-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install ember-cp-validated-control
pnpm add ember-cp-validated-control
yarn add ember-cp-validated-control
bun add ember-cp-validated-control
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2019-12-01 |
| First published | 2019-02-17 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | 6.* \|\| 8.* \|\| >= 10.* |
| Dependencies | 2 |
| Unpacked size | 10.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Nathan Cook |
| Maintainers | nathancharles |
| Keywords | ember-addon, validated-control, ember-cp-validated-control, ember-cp-validations |

## Links

- npm: https://www.npmjs.com/package/ember-cp-validated-control
- Repository: https://github.com/nathancharles/ember-cp-validated-control
- Homepage: https://github.com/nathancharles/ember-cp-validated-control#readme
- Issues: https://github.com/nathancharles/ember-cp-validated-control/issues
- npm.io page: https://npm.io/package/ember-cp-validated-control

## Dependencies (2)

- [ember-cli-babel](https://npm.io/package/ember-cli-babel.md) ^7.13.0
- [ember-cli-htmlbars](https://npm.io/package/ember-cli-htmlbars.md) ^4.0.8

## Alternatives

- [vest](https://npm.io/package/vest.md) — 50.1K weekly downloads
- [@regle/core](https://npm.io/package/@regle/core.md) — 47.0K weekly downloads
- [typeof-arguments](https://npm.io/package/typeof-arguments.md) — 12.5K weekly downloads
- [@lokalise/projects-engine-contracts](https://npm.io/package/@lokalise/projects-engine-contracts.md) — 978 weekly downloads
- [@osjwnpm/nam-laboriosam-quibusdam](https://npm.io/package/@osjwnpm/nam-laboriosam-quibusdam.md) — 70 weekly downloads

## Recent versions

- 0.0.2 (latest) — 2019-12-01
- 0.0.1 — 2019-02-17

## README

ember-cp-validated-control
==============================================================================

A wrapper for ember-cp-validations for handling the visibility of error and warning messages, as well as providing the display state of the validations. This is also A11Y friendly by communicating message changes via [aria-live="polite"](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions) and providing [aria-invalid](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-invalid_attribute) and [aria-describedby](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-describedby_attribute) attributes to integrate with the wrapped control.

Compatibility
------------------------------------------------------------------------------

* Ember.js v2.18 or above
* Ember CLI v2.13 or above


Installation
------------------------------------------------------------------------------

```
npm install ember-cp-validated-control
```


Usage
------------------------------------------------------------------------------

### Example
```hbs
<CpValidatedControl
  @validations={{model.validations.attrs.foobar}}
  @showValidation={{showValidation}}
  @errorClassName="my-custom-error-message"
  @warningClassName="my-custom-warning-message"
  as |cvc| >
  <input
    type="text"
    name="foobar"
    aria-describedby={{cvc.ariaDescribedby}}
    aria-invalid={{cvc.ariaInvalid}}
    value={{model.foobar}} />
</CpValidatedControl>
```

### API
Property | Type | Description
-------- | ---- | -----------
validations | [ResultCollection](http://offirgolan.github.io/ember-cp-validations/docs/classes/ResultCollection.html) | ember-cp-validation object for the given attribute.
showValidations | Boolean | Flag to determine the visibility of the messages.
errorClassName | String | (optional) Custom class name for the error message.
warningClassName | String | (optional) Custom class name for the warning message.

### Exposed Properties
Property | Type | Description
-------- | ---- | -----------
isErrorVisible | Boolean | Indicates error message visibility.
isWarningVisible | Boolean | Indicates warning message visibility.
isValidationVisible | Boolean | Indicates either the error message or warning message visibility.
ariaDescribedby | String | The id of the message container for the aria-describedby attribute on the control.
ariaInvalid | Boolean | Indicates if the attribute is invalid and the error message is visibile.

Contributing
------------------------------------------------------------------------------

If you would like to contribute, you can fork the project, edit, and make a pull request. Please make sure you have passing tests and updated documentation.


### Installation

* `git clone <repository-url>`
* `cd ember-validated-input`
* `yarn install`

### Linting

* `yarn lint:hbs`
* `yarn lint:js`
* `yarn lint:js --fix`

### Running tests

* `ember test` – Runs the test suite on the current Ember version
* `ember test --server` – Runs the test suite in "watch mode"
* `yarn test` – Runs `ember try:each` to test your addon against multiple Ember versions

### Running the dummy application

* `ember serve`
* Visit the dummy application at [http://localhost:4200](http://localhost:4200).

For more information on using ember-cli, visit [https://ember-cli.com/](https://ember-cli.com/).

License
------------------------------------------------------------------------------

This project is licensed under the [MIT License](LICENSE.md).

---
_Source: https://npm.io/package/ember-cp-validated-control · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._