Packages
phoenix_webcomponent
3.2.1
3.2.4
3.2.3
3.2.2
3.2.1
3.2.0
3.1.5
3.1.4
3.1.3
3.1.2
3.1.1
3.1.0
2.8.0
2.7.0
2.6.0
2.5.4
2.5.3
2.5.2
2.5.1
2.5.0
2.4.0
2.3.6
2.3.5
2.3.4
2.3.3
2.3.2
2.3.1
2.2.3
2.2.2
2.2.1
2.2.0
2.1.4
2.1.3
2.1.2
2.1.1
2.1.0
2.0.0
1.6.3
1.6.2
1.6.1
1.6.0
1.5.1
1.5.0
1.4.5
1.4.4
1.4.3
1.4.2
1.4.1
1.4.0
1.3.0
1.2.0
1.1.1
1.1.0
1.0.0
1.0.0-beta.4
1.0.0-beta.3
1.0.0-beta.2
0.0.0
Phoenix view functions for working with WebComponent
Current section
Files
Jump to
Current section
Files
priv/static/phoenix_webcomponent.js
(() => {
var import_lit = require("@gsmlg/lit");
const PhxWCHook = {
mounted() {
const attrs = this.el.attributes;
const phxTarget = attrs["phx-target"].value;
const pushEvent = phxTarget ? (event, payload, callback) => this.pushEventTo(phxTarget, event, payload, callback) : this.pushEvent;
for (var i = 0; i < attrs.length; i++) {
if (/^phx-wc-send-/.test(attrs[i].name)) {
const eventName = attrs[i].name.replace(/^phx-wc-send-/, "");
const [phxEvent, callbackName] = attrs[i].value.split(";");
this.el.addEventListener(eventName, ({ detail }) => {
pushEvent(phxEvent, detail, (e) => {
this[callbackName]?.(e, detail, eventName);
});
});
}
if (/^phx-wc-receive-/.test(attrs[i].name)) {
const eventName = attrs[i].name.replace(/^phx-wc-receive-/, "");
const handler = attrs[i].value;
this.handleEvent(eventName, (payload) => {
if (handler && this.el[handler]) {
this.el[handler]?.(payload);
} else {
this.el.dispatchEvent(new CustomEvent(eventName, { detail: payload }));
}
});
}
if (attrs[i].name === "phx-wc-receive") {
const [phxEvent, callbackName] = attrs[i].value.split(";");
this.handleEvent(phxEvent, (payload) => {
this.el[callbackName]?.(payload);
});
}
}
}
};
if (window) {
window.__PhxWCHook__ = PhxWCHook;
}
})();