rimmel/dist/esm/sinks/attribute-sink.js

A Streams-Oriented UI library for the Rx.Observable Universe

import { addListener } from '../lib/addListener.js';
import { asap } from '../lib/drain.js';
import { DatasetObjectSink, DatasetItemPreSink } from './dataset-sink.js';
import { isRMLEventListener } from '../types/event-listener.js';
import { sinkByAttributeName } from '../parser/sink-map.js';

const FixedAttributeSink = (node, attributeName) => 
// data => node.setAttribute(attributeName, data)
node.setAttribute.bind(node, attributeName);
const FixedAttributePreSink = (attributeName) => (node) => 
// data => node.setAttribute(attributeName, data)
node.setAttribute.bind(node, attributeName);
/**
 * Set the value of a form's element, given its name
 **/
const FormElementSink = (node, elementName) => (value) => {
    const e = (node.elements.namedItem(elementName));
    // TODO: add checkbox and radio...
    if (e) {
        if (e.type == 'checkbox') {
            e.checked = value;
        }
        else if (e.type == 'radio') {
            e.checked = e.value == value;
        }
        else {
            e.value = value;
        }
    }
};
/**
 * An implicit sink for any DOM Attributes (the ones that can be set via node[attr] = value)
 * @example <div contenteditable="${stream}">...</div>
 **/
const DOMAttributePreSink = (attributeName) => (node) => (value) => node[attributeName] = value;
const AttributeObjectSink = (node) => (attributeobject) => {
    (Object.entries(attributeobject) ?? [])
        .forEach(([k, v]) => {
        // TODO: toggle/remove event listener, if matches /^on/ (or /^off/ maybe?)
        // N.B.: keep v === false || v == 'false' for transpilers changing it to v == '0' || v == 0
        // which is no good, because 0 is no special value for non-boolean attributess. value="0"
        if (v == null || v === false || v == 'false' || v == undefined) {
            node.removeAttribute(k);
        }
        else if (isRMLEventListener(k)) { //if(k.startsWith('on') /* && isFunction((<Observer<any>><unknown>v).next ?? (<Promise<any>>v).then ?? v) */) {
            // addListener(node, <RMLEventName>k.substring(2), v);
            const e = k.replace(/^(rml:)?on/, '$1');
            addListener(node, e, v);
        }
        else {
            const sink = k == 'dataset'
                ? DatasetObjectSink :
                k.startsWith('data-')
                    ? DatasetItemPreSink(k.substring(5)) :
                    node.tagName == 'FORM'
                        ? FormElementSink :
                        sinkByAttributeName.get(k)
                            ?? FixedAttributeSink;
            //?? DOMAttributeSink;
            asap(sink(node, k), v); // TODO: use drain()
        }
    });
};

export { AttributeObjectSink, DOMAttributePreSink, FixedAttributePreSink, FixedAttributeSink, FormElementSink };
//# sourceMappingURL=attribute-sink.js.map