@sandlada/vue-mdc
Version:

63 lines (62 loc) • 1.66 kB
JavaScript
/**
* @license
* Copyright 2025 Sandlada & Kai Orion
* SPDX-License-Identifier: MIT
*/
import { isServer } from "../../utils/is-server.js";
import { useAttachable } from "../../internals/controller/use-attachable.js";
import "vue";
import "../../internals/navigation/render-navigation-destination.js";
import { FocusRingEvents } from "./focus-ring-events.js";
const SHandleByFocusRing = Symbol("handleByFocusRing");
class FocusRingController {
host;
_visible = false;
get visible() {
return this._visible;
}
set visible(value) {
if (value === this._visible) {
return;
}
this._visible = value;
if (value) {
this.host.value?.setAttribute("visible", ``);
} else if (this.host.value?.hasAttribute("visible")) {
this.host.value?.removeAttribute("visible");
}
}
attachale = null;
constructor(host) {
this.host = host;
this.attachale = useAttachable(host, (prev, next) => {
if (isServer()) {
return;
}
for (const event of FocusRingEvents) {
prev?.removeEventListener(event, this.handleEvent);
next?.addEventListener(event, this.handleEvent);
}
});
}
handleEvent = (e) => {
const event = e;
if (event[SHandleByFocusRing]) {
return;
}
switch (event.type) {
case "focusin":
this.visible = this.attachale?.control?.value?.matches(":focus-visible") ?? false;
break;
case "focusout":
case "pointerdown":
this.visible = false;
break;
}
event[SHandleByFocusRing] = true;
};
}
export {
FocusRingController
};
//# sourceMappingURL=focus-ring-controller.js.map