import { not, notEmpty, and, or, readOnly, alias } from '@ember/object/computed'; import Component from '@ember/component'; import { defineProperty } from '@ember/object'; export default Component.extend({ classNames: ['validated-input'], classNameBindings: ['showErrorClass:has-error', 'isValid:has-success'], name: '', options: null, model: null, value: null, type: 'text', valuePath: '', placeholder: '', primaryValue: 'name', label: '', disable: false, isEditable: true, validation: null, showValidations: false, allowClear: false, didValidate: false, notValidating: not('validation.isValidating').readOnly(), hasContent: notEmpty('model').readOnly(), hasWarnings: notEmpty('validation.warnings').readOnly(), isValid: and('hasContent', 'validation.isTruelyValid').readOnly(), shouldDisplayValidations: or( 'showValidations', 'didValidate', 'hasContent' ).readOnly(), showErrorClass: and( 'notValidating', 'showErrorMessage', 'hasContent', 'validation' ).readOnly(), showErrorMessage: and( 'shouldDisplayValidations', 'validation.isInvalid' ).readOnly(), showWarningMessage: and( 'shouldDisplayValidations', 'hasWarnings', 'isValid' ).readOnly(), init() { this._super(...arguments); let valuePath = this.get('valuePath'); defineProperty( this, 'validation', readOnly(`modelAll.validations.attrs.${valuePath}`) ); defineProperty(this, 'value', alias(`model.${valuePath}`)); }, actions: { onChangeCombo(propertyName, item) { this.set(propertyName, item); if (this.get('onChangeCombo')) { this.onChangeCombo(this.get('name'), propertyName, item); } }, }, focusOut() { this._super(...arguments); this.set('showValidations', true); } });