38 lines
873 B
JavaScript
38 lines
873 B
JavaScript
|
import Component from '@glimmer/component';
|
||
|
import { tracked } from '@glimmer/tracking';
|
||
|
import { action } from '@ember/object';
|
||
|
|
||
|
export default class Element extends Component {
|
||
|
@tracked el;
|
||
|
|
||
|
@tracked touched = false;
|
||
|
|
||
|
get type() {
|
||
|
if (typeof this.el !== 'undefined') {
|
||
|
return this.el.dataset.type || this.el.getAttribute('type') || this.el.getAttribute('role');
|
||
|
}
|
||
|
return this.args.type;
|
||
|
}
|
||
|
get name() {
|
||
|
if (typeof this.args.group !== 'undefined') {
|
||
|
return `${this.args.group.name}[${this.args.name}]`;
|
||
|
} else {
|
||
|
return this.args.name;
|
||
|
}
|
||
|
}
|
||
|
get prop() {
|
||
|
return `${this.args.name.toLowerCase().replaceAll('.', '-')}`;
|
||
|
}
|
||
|
get state() {
|
||
|
const error = this.touched && this.args.error;
|
||
|
return {
|
||
|
matches: name => name === 'error' && error,
|
||
|
};
|
||
|
}
|
||
|
|
||
|
@action
|
||
|
connect($el) {
|
||
|
this.el = $el;
|
||
|
}
|
||
|
}
|