@winglet/react-utils/dist/hoc/withUploader/withUploader.cjs

React utility library providing custom hooks, higher-order components (HOCs), and utility functions to enhance React application development with improved reusability and functionality

'use strict';

var jsxRuntime = require('react/jsx-runtime');
var react = require('react');
var filter = require('@winglet/common-utils/filter');
var useHandle = require('../../hooks/useHandle.cjs');

const withUploader = (Component) => react.memo(({ onClick, onChange, acceptFormat, ...props }) => {
    const inputRef = react.useRef(null);
    const accept = react.useMemo(() => acceptFormat?.join(','), [acceptFormat]);
    const handleFileChange = useHandle.useHandle(({ target }) => {
        const file = target?.files?.[0];
        if (file)
            onChange?.(file);
        target.value = '';
    });
    const handleClick = useHandle.useHandle((e) => {
        if (filter.isFunction(onClick))
            onClick(e);
        inputRef.current?.click();
    });
    return (jsxRuntime.jsxs(react.Fragment, { children: [jsxRuntime.jsx("input", { type: "file", accept: accept, style: { display: 'none' }, onChange: handleFileChange, ref: inputRef }), jsxRuntime.jsx(Component, { ...props, onClick: handleClick })] }));
});

exports.withUploader = withUploader;