jb-checkbox/react/dist/JBCheckbox.cjs.js

checkbox web component

'use strict';

var React = require('react');
require('jb-checkbox');

function useBindEvent(ref, event, handler, passive = false) {
    React.useEffect(() => {
        const dom = ref.current;
        if (dom) {
            // initiate the event handler
            dom.addEventListener(event, handler, passive);
        }
        // this will clean up the event every time the component is re-rendered
        return function cleanup() {
            if (dom) {
                dom.removeEventListener(event, handler, passive);
            }
        };
    }, [ref, event, handler, passive]);
}

const JBCheckbox = React.forwardRef((props, ref) => {
    const element = React.useRef(null);
    const [refChangeCount, refChangeCountSetter] = React.useState(0);
    React.useImperativeHandle(ref, () => (element ? element.current : undefined), [element]);
    React.useEffect(() => {
        refChangeCountSetter(refChangeCount + 1);
    }, [element.current]);
    const onchange = React.useCallback((e) => {
        if (props.value !== undefined && props.value !== null) {
            e.preventDefault();
        }
        if (typeof props.onChange == "function") {
            props.onChange(e);
        }
    }, [props.onChange, props.value]);
    useBindEvent(element, 'before-change', onchange, true);
    useBindEvent(element, 'change', onchange, true);
    React.useEffect(() => {
        if (element.current && props.value !== null && props.value !== undefined) {
            element.current.value = props.value;
        }
    }, [props.value]);
    React.useEffect(() => {
        if (element.current && typeof props.style == "string") {
            element.current.setAttribute("style", props.style);
        }
    }, [props.style]);
    React.useEffect(() => {
        if (element.current && typeof props.name == "string") {
            element.current.setAttribute("name", props.name);
        }
        else if (element.current && props.name == null) {
            element.current.removeAttribute("name");
        }
    }, [props.name]);
    React.useEffect(() => {
        if (element.current) {
            element.current.disabled = Boolean(props.disabled);
        }
    }, [element.current, props.disabled]);
    React.useEffect(() => {
        if (element.current && Array.isArray(props.validationList)) {
            element.current.validation.list = props.validationList;
        }
    }, [props.validationList]);
    return (React.createElement("jb-checkbox", { class: props.className ? props.className : "", label: props.label ? props.label : '', ref: element }, props.children));
});
JBCheckbox.displayName = "JBSwitch";

exports.JBCheckbox = JBCheckbox;
//# sourceMappingURL=JBCheckbox.cjs.js.map