mantine-entity
Version:
A library combining Mantine, TanStack Query, and Mantine React Table for efficient entity management
27 lines (26 loc) • 1.39 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/* eslint-disable @typescript-eslint/no-explicit-any */
import { forwardRef } from "react";
import { InputDescription, InputError, InputLabel, InputWrapper, SegmentedControl, } from "@mantine/core";
const SegmentedInput = forwardRef(({ label, data, description, error, onChange, value, withAsterisk, inputWrapperOrder, }, ref) => {
const content = inputWrapperOrder.map((part) => {
switch (part) {
case "label":
return (_jsx(InputLabel, { required: withAsterisk, children: label }, "label"));
case "input":
return (_jsx(SegmentedControl, { value: value, onChange: (v) => onChange && onChange(v), data: data, fullWidth: true, size: "xs", className: `mb-1 ${error && "border border-[var(--mantine-color-error)]"}` }, "input"));
case "description":
return (_jsx(InputDescription, { children: description }, "description"));
case "error":
return (_jsx(InputError, { ta: "left", children: error }, "error"));
default:
return null;
}
});
if (data && data.length >= 1) {
return (_jsxs(InputWrapper, { children: [_jsx("button", { ref: ref }), content] }));
}
return null;
});
SegmentedInput.displayName = "SegmentedInput";
export default SegmentedInput;