import { MediaElement } from "./media-element.js";
import { applyElementProps, applyStateDataAttrs, createButton } from "@videojs/core/dom";

//#region src/ui/media-button-element.ts
/** Abstract base for HTML custom elements that render a media-control button. */
var MediaButtonElement = class extends MediaElement {
	constructor(..._args) {
		super(..._args);
		this.disabled = false;
		this.label = "";
	}
	static {
		this.properties = {
			label: { type: String },
			disabled: { type: Boolean }
		};
	}
	#disconnect = null;
	connectedCallback() {
		super.connectedCallback();
		this.#disconnect = new AbortController();
		const buttonProps = createButton({
			onActivate: () => this.activate(this.mediaState.value),
			isDisabled: () => this.disabled || !this.mediaState.value
		});
		applyElementProps(this, buttonProps, { signal: this.#disconnect.signal });
	}
	disconnectedCallback() {
		super.disconnectedCallback();
		this.#disconnect?.abort();
		this.#disconnect = null;
	}
	willUpdate(changed) {
		super.willUpdate(changed);
		this.core.setProps?.(this);
	}
	update(changed) {
		super.update(changed);
		const media = this.mediaState.value;
		if (!media) return;
		this.core.setMedia(media);
		const state = this.core.getState();
		applyElementProps(this, this.core.getAttrs?.(state) ?? {});
		applyStateDataAttrs(this, state, this.stateAttrMap);
	}
};

//#endregion
export { MediaButtonElement };
//# sourceMappingURL=media-button-element.js.map