@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.
77 lines (76 loc) • 2.59 kB
JavaScript
import { jsx } from "react/jsx-runtime";
import { NumberInput as NumberInput$1 } from "@mantine/core";
import { forwardRef } from "react";
import { ComponentErrorBoundary } from "../errorBoundary/ComponentErrorBoundary.js";
import { useCommonLayoutStyle } from "../layout/useCommonLayoutStyle.js";
import { useRegisterFormInput } from "../../state/components/form/useRegisterFormInput.js";
import { useInput } from "../../state/components/input/useInput.js";
import { useNumberInputState } from "../../state/components/number-input/useNumberInputState.js";
import { useComponentId } from "../../state/components/useId.js";
import { currencyParser, currencyFormatter, percentParser, percentFormatter } from "./numberUtils.js";
const NumberInputComponent = /* @__PURE__ */ forwardRef(({
width,
...props
}, ref) => {
let parser;
let formatter;
if (props.format === "currency") {
parser = currencyParser(props.currency);
formatter = currencyFormatter(props.currency);
} else if (props.format === "percent") {
parser = percentParser;
formatter = percentFormatter;
}
return /* @__PURE__ */ jsx(NumberInput$1, { parser, formatter, ...props, ref });
});
const NumberInput = /* @__PURE__ */ forwardRef((props, ref) => /* @__PURE__ */ jsx(ComponentErrorBoundary, { componentName: DISPLAY_NAME, children: /* @__PURE__ */ jsx(NumberInputWithoutRef, { ...props, innerRef: ref }) }));
const NumberInputWithoutRef = (props) => {
const id = useComponentId(props.id);
const {
state,
dispatch
} = useNumberInputState(id, {
initialState: {
disabled: props.disabled ?? props.defaultDisabled,
value: props.value ?? props.defaultValue
},
focus,
min: props.min,
max: props.max
});
const {
inputProps
} = useInput(props, state, dispatch, (v) => v);
const {
className,
style,
width,
height,
grow,
innerRef: _,
validate: __,
onChange: ___,
defaultDisabled: ____,
defaultValue: _____,
...restProps
} = props;
const {
classes: layoutClasses,
cx
} = useCommonLayoutStyle({
width,
height,
grow
});
useRegisterFormInput(id, "number-input");
return /* @__PURE__ */ jsx(NumberInputComponent, { ref: props.innerRef, className: cx(layoutClasses.style, className), style, ...inputProps, ...restProps });
};
NumberInputComponent.displayName = "NumberInputComponent";
const DISPLAY_NAME = "NumberInput";
NumberInput.displayName = DISPLAY_NAME;
export {
NumberInput,
NumberInputComponent,
NumberInputWithoutRef
};
//# sourceMappingURL=NumberInput.js.map