@amauta/input-text

Properties

| Property | Attribute | Description | Type | Default | | -------------- | -------------- | ----------- | --------- | --------------------------------------------------------------------------------------------------- | | inputId | inputid | | string | '' | | label | label | | string | '' | | paramClass | paramclass | | any | { containerClass: '', labelClass: '', containerInputClass: '', inputClass: '' } | | parseText | parsetext | | string | 'UPPER_CASE | LOWER_CASE | CAPITALIZE_CASE | NAME_CASE | NUMBER_CASE | TEL_CASE ' | | placeholder | placeholder | | string | '' | | readonly | readonly | | boolean | false | | type | type | | string | '' | | typeValidate | typevalidate | | string | '' | | validForm | validform | | boolean | false | | value | value | | any | '' |

Events

| Event | Description | Type | | ----------------- | ----------- | ------------------ | | eventOnChange | | CustomEvent<any> | | eventOnFocusin | | CustomEvent<any> | | eventOnFocusout | | CustomEvent<any> | | eventOnKeyUp | | CustomEvent<any> |

Built with StencilJS

Install web component in Angular project

• Run npm i @amauta/input-text

• Put a script tag in main.js file

  import * as inputRangeCustomElements from '@amauta/input-text/loader';
    
  // @ts-ignore
  inputTextCustomElements.defineCustomElements().catch(err => console.error(err));

• Use in components html

  <amauta-input-text
     [input_id]="inputId"
     [label]="label"
     placeholder="ingrese su nombre"
     readonly="{{false}}"
     type="text"
     validate="email"
     valid_form="{{true}}"
     value="{{label}}"
     [param_class]="paramClass"
     (eventOnKeyUp)="eventFunction($event)" >
  </amauta-input-text>