import HTMLElement from '../html-element/HTMLElement.js';
import * as PropertySymbol from '../../PropertySymbol.js';
import EventPhaseEnum from '../../event/EventPhaseEnum.js';
import PointerEvent from '../../event/events/PointerEvent.js';
/**
* HTML Label Element.
*
* Reference:
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLLabelElement.
*/
export default class HTMLLabelElement extends HTMLElement {
/**
* Returns a string containing the ID of the labeled control. This reflects the "for" attribute.
*
* @returns ID of the labeled control.
*/
get htmlFor() {
const htmlFor = this.getAttribute('for');
if (htmlFor !== null) {
return htmlFor;
}
return htmlFor !== null ? htmlFor : '';
}
/**
* Sets a string containing the ID of the labeled control. This reflects the "for" attribute.
*
* @param htmlFor ID of the labeled control.
*/
set htmlFor(htmlFor) {
this.setAttribute('for', htmlFor);
}
/**
* Returns an HTML element representing the control with which the label is associated.
*
* @returns Control element.
*/
get control() {
const htmlFor = this.htmlFor;
if (htmlFor) {
const control = this[PropertySymbol.ownerDocument].getElementById(htmlFor);
return control !== this ? control : null;
}
return (this.querySelector('button,input:not([type="hidden"]),meter,output,progress,select,textarea'));
}
/**
* Returns the parent form element.
*
* @returns Form.
*/
get form() {
return this[PropertySymbol.formNode];
}
/**
* Clones a node.
*
* @override
* @param [deep=false] "true" to clone deep.
* @returns Cloned node.
*/
cloneNode(deep = false) {
return super.cloneNode(deep);
}
/**
* @override
*/
dispatchEvent(event) {
const returnValue = super.dispatchEvent(event);
if (event.type === 'click' &&
(event.eventPhase === EventPhaseEnum.atTarget || event.eventPhase === EventPhaseEnum.bubbling)) {
const control = this.control;
if (control && event.target !== control) {
control.dispatchEvent(new PointerEvent('click', { bubbles: true, cancelable: true }));
}
}
return returnValue;
}
}
//# sourceMappingURL=HTMLLabelElement.js.map