@awcrotwell/motion/dist/serializeEvent.js

Motion allows you to build reactive, real-time frontend UI components in your Amber application using pure Crystal that are reusable, testable & encapsulated. For brevity, we will call them MotionComponents.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const detailProperties = [
    'button',
    'x',
    'y',
    'key',
    'keyCode',
    'altKey',
    'ctrlKey',
    'metaKey',
    'shiftKey',
];
function serializeEventDetails(event) {
    const details = {};
    for (const property of detailProperties) {
        if (Object.prototype.hasOwnProperty.call(event, property)) {
            details[property] = event[property];
        }
    }
    return details;
}
function serializeElementAttributes(element) {
    const attributes = {};
    for (const attributeName of element.getAttributeNames()) {
        attributes[attributeName] = element.getAttribute(attributeName);
    }
    return attributes;
}
function serializeElementFormData(element) {
    const form = element.form || element.closest('form');
    if (!form) {
        return null;
    }
    const formData = new FormData(form);
    return Array.from(formData.entries())
        .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
        .join('&');
}
function serializeElement(element) {
    const { tagName, value } = element;
    const attributes = serializeElementAttributes(element);
    const formData = serializeElementFormData(element);
    return {
        tagName,
        value,
        attributes,
        formData,
    };
}
function serializeEvent(event, extraData = null) {
    const { type } = event;
    const details = serializeEventDetails(event);
    const target = serializeElement(event.target);
    const currentTarget = serializeElement(event.currentTarget);
    return {
        type,
        details,
        extraData,
        target,
        currentTarget,
    };
}
exports.default = serializeEvent;