koval-ui
Version:
React components collection with minimalistic design. Supports theming, layout, and input validation.
33 lines (32 loc) • 1.21 kB
JavaScript
"use client";
import { jsxs as p, jsx as a } from "react/jsx-runtime";
import { useState as b, useCallback as i, useEffect as h } from "react";
/* empty css */
import s from "./Dialog.module.css.js";
import { FormField as c } from "../../FormField/FormField.js";
import { InputNumeric as d } from "../../InputNumeric/InputNumeric.js";
const v = (e) => Array.isArray(e) ? e.map((r) => String(r)) : ["", ""], N = (e) => e.map((r) => Number(r)), A = ({ value: e, onChange: r }) => {
const [n, u] = b(v(e)), [t, l] = n, f = i(
(o) => {
const m = [o.target.value, l];
u(m);
},
[l]
), g = i(
(o) => {
const m = [t, o.target.value];
u(m);
},
[t]
);
return h(() => {
r(N(n));
}, [r, n]), /* @__PURE__ */ p("div", { className: s.numberRange, children: [
/* @__PURE__ */ a(c, { className: s.numberField, label: "From:", children: /* @__PURE__ */ a(d, { mode: "floating", value: t, onChange: f }) }),
/* @__PURE__ */ a(c, { className: s.numberField, label: "To:", children: /* @__PURE__ */ a(d, { mode: "floating", value: l, onChange: g }) })
] });
};
export {
A as NumberRangeField
};
//# sourceMappingURL=NumberRangeField.js.map