@dndbuilder.com/react
Version:
Drag and drop builder for React
66 lines (65 loc) • 1.78 kB
JavaScript
"use client";
import { jsxs as a, jsx as m } from "react/jsx-runtime";
import { useAppSelector as $ } from "../../hooks/use-app-selector.js";
import { useSettings as v } from "../../hooks/use-settings.js";
import { getCurrentBreakpoint as h } from "../../../../../store/selectors.js";
import { Input as x } from "../shared/input.js";
import { Label as S } from "../shared/label.js";
import { RangeSlider as C } from "../shared/range-slider.js";
import { BreakpointSelector as b } from "../shared/breakpoint-selector.js";
import { classNames as k } from "../../../../../utils.js";
const L = ({
fieldName: r,
type: f,
mode: t,
label: n,
responsive: o = !1,
min: l = 0,
max: p = 100,
step: s = 1,
className: g
}) => {
const i = $(h), [u, c] = v(
o && t ? `${r}.${i}.${t}` : o ? `${r}.${i}` : t ? `${r}.${t}` : r,
f
);
return /* @__PURE__ */ a("div", { className: k("mt-4", g), children: [
n && /* @__PURE__ */ a(S, { className: "mb-1.5 flex items-center gap-1", children: [
n,
" ",
o && /* @__PURE__ */ m(b, {})
] }),
/* @__PURE__ */ a("div", { className: "flex gap-1.5", children: [
/* @__PURE__ */ m(
C,
{
value: [u ?? 0],
onValueChange: (e) => {
c(e[0]);
},
max: p,
step: s,
min: l
}
),
/* @__PURE__ */ m(
x,
{
type: "number",
value: u ?? "",
onChange: (e) => {
c(e.target.value === "" ? void 0 : Number(e.target.value));
},
min: l,
max: p,
step: s,
className: "w-[60px]"
}
)
] })
] });
};
export {
L as SliderInputControl
};
//# sourceMappingURL=slider-input.control.js.map