@ribajs/bs5
Version:
Bootstrap 5 module for Riba.js
82 lines • 7.19 kB
JavaScript
import { Component } from "@ribajs/core";
import { EventDispatcher } from "@ribajs/events";
import { hasChildNodesTrim } from "@ribajs/utils/src/dom.js";
import { TOGGLE_BUTTON } from "../../constants/index.js";
export class Bs5ToggleButtonComponent extends Component {
static get observedAttributes() {
return ["target-id"];
}
requiredAttributes() {
return ["target-id"];
}
static tagName = "bs5-toggle-button";
autobind = true;
_debug = false;
eventDispatcher;
lifecycleEvents = EventDispatcher.getInstance("lifecycle");
scope = {
targetId: undefined,
toggle: this.toggle,
state: "undefined",
isActive: true,
isClosed: false,
};
constructor() {
super();
this.lifecycleEvents.once("ComponentLifecycle:allBound", this.onAllComponentsReady, this);
}
toggle() {
this.debug("toggle", this.eventDispatcher);
if (this.eventDispatcher) {
this.eventDispatcher.trigger(TOGGLE_BUTTON.eventNames.toggle, this.scope.targetId);
}
}
onAllComponentsReady() {
this.debug("onAllComponentsReady");
this.eventDispatcher?.trigger(TOGGLE_BUTTON.eventNames.init, this.scope.targetId);
}
async afterBind() {
await super.afterBind();
}
connectedCallback() {
super.connectedCallback();
this.init(Bs5ToggleButtonComponent.observedAttributes);
}
onToggledEvent(state) {
this.scope.state = state;
this.scope.isActive = state !== "hidden" && state !== "removed";
this.scope.isClosed = !this.scope.isActive;
}
initEventDispatcher(id) {
if (this.eventDispatcher) {
this.eventDispatcher.off(TOGGLE_BUTTON.eventNames.toggled, this.onToggledEvent, this);
}
const namespace = TOGGLE_BUTTON.nsPrefix + id;
this.debug(`Init event dispatcher for namespace ${namespace}`);
this.eventDispatcher = new EventDispatcher(namespace);
this.eventDispatcher.on(TOGGLE_BUTTON.eventNames.toggled, this.onToggledEvent, this);
this.eventDispatcher.on(TOGGLE_BUTTON.eventNames.state, this.onToggledEvent, this);
}
async attributeChangedCallback(attributeName, oldValue, newValue, namespace) {
super.attributeChangedCallback(attributeName, oldValue, newValue, namespace);
}
parsedAttributeChangedCallback(attributeName, oldValue, newValue, namespace) {
super.parsedAttributeChangedCallback(attributeName, oldValue, newValue, namespace);
if (attributeName === "targetId" && newValue) {
this.initEventDispatcher(newValue);
}
}
disconnectedCallback() {
super.disconnectedCallback();
if (this.eventDispatcher) {
this.eventDispatcher.off(TOGGLE_BUTTON.eventNames.toggled, this.onToggledEvent, this);
}
}
template() {
if (!hasChildNodesTrim(this)) {
console.warn("No child elements found, this component as no template so you need to define your own as child of this component.");
}
return null;
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnM1LXRvZ2dsZS1idXR0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvYnM1LXRvZ2dsZS1idXR0b24vYnM1LXRvZ2dsZS1idXR0b24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVNBLE9BQU8sRUFBRSxTQUFTLEVBQStCLE1BQU0sY0FBYyxDQUFDO0FBQ3RFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNqRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQztBQUU3RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFzQnpELE1BQU0sT0FBTyx3QkFBeUIsU0FBUSxTQUFTO0lBQ3JELE1BQU0sS0FBSyxrQkFBa0I7UUFDM0IsT0FBTyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBQ3ZCLENBQUM7SUFFUyxrQkFBa0I7UUFDMUIsT0FBTyxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBQ3ZCLENBQUM7SUFFTSxNQUFNLENBQUMsT0FBTyxHQUFHLG1CQUFtQixDQUFDO0lBRWxDLFFBQVEsR0FBRyxJQUFJLENBQUM7SUFFbkIsTUFBTSxHQUFHLEtBQUssQ0FBQztJQUVaLGVBQWUsQ0FBbUI7SUFFbEMsZUFBZSxHQUFHLGVBQWUsQ0FBQyxXQUFXLENBQUMsV0FBVyxDQUFDLENBQUM7SUFFOUQsS0FBSyxHQUFVO1FBQ3BCLFFBQVEsRUFBRSxTQUFTO1FBQ25CLE1BQU0sRUFBRSxJQUFJLENBQUMsTUFBTTtRQUNuQixLQUFLLEVBQUUsV0FBVztRQUNsQixRQUFRLEVBQUUsSUFBSTtRQUNkLFFBQVEsRUFBRSxLQUFLO0tBQ2hCLENBQUM7SUFFRjtRQUNFLEtBQUssRUFBRSxDQUFDO1FBQ1IsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQ3ZCLDZCQUE2QixFQUM3QixJQUFJLENBQUMsb0JBQW9CLEVBQ3pCLElB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