1 | import skate from './internal/skate';
|
2 | import skateTemplateHtml from 'skatejs-template-html';
|
3 | import enforce from './internal/enforcer';
|
4 | import { INPUT_SUFFIX } from './internal/constants';
|
5 |
|
6 | function getLabel(element) {
|
7 | return element.querySelector('label');
|
8 | }
|
9 |
|
10 | function updateLabelFor(element, change) {
|
11 | if (element.hasAttribute('for')) {
|
12 | getLabel(element).setAttribute('for', `${change.newValue}${INPUT_SUFFIX}`);
|
13 | } else {
|
14 | getLabel(element).removeAttribute('for');
|
15 | }
|
16 | }
|
17 |
|
18 | function updateLabelForm(element, change) {
|
19 | if (element.hasAttribute('form')) {
|
20 | getLabel(element).setAttribute('form', change.newValue);
|
21 | } else {
|
22 | getLabel(element).removeAttribute('form');
|
23 | }
|
24 | }
|
25 |
|
26 | const LabelEl = skate('aui-label', {
|
27 | template: skateTemplateHtml('<label><content></content></label>'),
|
28 | created: function (element) {
|
29 | element._label = getLabel(element);
|
30 | },
|
31 | attached: function (element) {
|
32 | enforce(element).attributeExists('for');
|
33 | },
|
34 | attributes: {
|
35 | 'for': updateLabelFor,
|
36 | form: updateLabelForm
|
37 | },
|
38 | prototype: {
|
39 | get disabled() {
|
40 | return this.hasAttribute('disabled');
|
41 | },
|
42 | set disabled(value) {
|
43 | if (value) {
|
44 | this.setAttribute('disabled', '');
|
45 | } else {
|
46 | this.removeAttribute('disabled');
|
47 | }
|
48 | }
|
49 | },
|
50 | events: {
|
51 | click: function (element, e) {
|
52 | if (element.disabled) {
|
53 | e.preventDefault();
|
54 | }
|
55 | }
|
56 | }
|
57 | });
|
58 |
|
59 | export default LabelEl;
|