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

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

import { jsxs, jsx } from 'react/jsx-runtime';
import { memo, useRef, useMemo, Fragment } from 'react';
import { isFunction } from '@winglet/common-utils/filter';
import { useHandle } from '../../hooks/useHandle.mjs';

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

export { withUploader };