UNPKG

@airplane/views

Version:

A React library for building Airplane views. Views components are optimized in style and functionality to produce internal apps that are easy to build and maintain.

79 lines (78 loc) 2.58 kB
import { jsx } from "react/jsx-runtime"; import { forwardRef } from "react"; import { ComponentErrorBoundary } from "../errorBoundary/ComponentErrorBoundary.js"; import { useCommonLayoutStyle } from "../layout/useCommonLayoutStyle.js"; import { useFileInputState } from "../../state/components/file-input/useFileInputState.js"; import { useRegisterFormInput } from "../../state/components/form/useRegisterFormInput.js"; import { useInput } from "../../state/components/input/useInput.js"; import { useComponentId } from "../../state/components/useId.js"; import { BasicFileInputComponent } from "./BasicFileInput.js"; import { DropzoneFileInputComponent } from "./DropzoneFileInput.js"; const EMPTY_ARRAY = []; const FileInput = /* @__PURE__ */ forwardRef(({ variant = "dropzone", ...restProps }, ref) => { return /* @__PURE__ */ jsx(ComponentErrorBoundary, { componentName: DISPLAY_NAME, children: /* @__PURE__ */ jsx(FileInputWithoutRef, { variant, ...restProps, innerRef: ref }) }); }); const FileInputWithoutRef = ({ variant, ...props }) => { const id = useComponentId(props.id); const { state, dispatch } = useFileInputState(id, { initialState: { disabled: props.disabled ?? props.defaultDisabled, initialValue: props.multiple ? EMPTY_ARRAY : void 0 } }); const newOnChange = props.multiple ? (v) => { var _a; return (_a = props.onChange) == null ? void 0 : _a.call(props, v); } : (v) => { var _a; return (_a = props.onChange) == null ? void 0 : _a.call(props, v.length ? v[0] : void 0); }; const { inputProps } = useInput({ ...props, onChange: newOnChange }, state, dispatch, (v) => props.multiple ? v : v.length ? v[0] : void 0); useRegisterFormInput(id, "file-input"); const { innerRef, className, style, width, height, grow, validate: _, onChange: __, defaultDisabled: ___, ...restProps } = props; const { classes: layoutClasses, cx } = useCommonLayoutStyle({ width, height, grow }); if (variant === "dropzone") { return /* @__PURE__ */ jsx(DropzoneFileInputComponent, { ref: innerRef, className: cx(layoutClasses.style, className), style, ...inputProps, ...restProps }); } else { return /* @__PURE__ */ jsx(BasicFileInputComponent, { ref: innerRef, className: cx(layoutClasses.style, className), style, ...inputProps, ...restProps }); } }; const DISPLAY_NAME = "FileInput"; FileInput.displayName = DISPLAY_NAME; export { FileInput, FileInputWithoutRef }; //# sourceMappingURL=FileInput.js.map