@hitachivantara/uikit-react-core
Version:
Core React components for the NEXT Design System.
61 lines (60 loc) • 2.13 kB
JavaScript
;
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const setId = require("../../utils/setId.cjs");
const utils = require("../utils.cjs");
const SliderInput_styles = require("./SliderInput.styles.cjs");
const Input = require("../../Input/Input.cjs");
const HvSliderInput = ({
classes: classesProp,
className,
id,
label,
status,
values: valuesProp = [],
inputProps = [],
readOnly = false,
disabled = false,
markDigits = 0,
onChange,
...others
}) => {
const { classes, cx } = SliderInput_styles.useClasses(classesProp);
const [inputValues, setInputValues] = React.useState(
utils.knobsValuesToString(valuesProp, markDigits)
);
const handleChange = (index) => {
if (disabled) return;
onChange?.(utils.stringValuesToKnobs(inputValues), index);
};
React.useEffect(() => {
setInputValues(utils.knobsValuesToString(valuesProp, markDigits));
}, [markDigits, valuesProp]);
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(classes.root, className), ...others, children: inputValues.map((value, index) => /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
index !== 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { children: "—" }),
/* @__PURE__ */ jsxRuntime.jsx(
Input.HvInput,
{
id: setId.setId(id, index),
"aria-label": `${label}-${index}`,
className: classes.input,
disabled,
value: Number.isNaN(value) || value == null ? "" : value.toString(),
onEnter: () => handleChange(index),
onBlur: () => handleChange(index),
onChange: (_, inputValue) => {
const newValues = [...inputValues];
newValues[index] = inputValue;
setInputValues(newValues);
},
status: status?.[index] || "standBy",
readOnly,
disableClear: true,
...inputProps[index]
}
)
] }, setId.setId(id, index))) });
};
exports.sliderInputClasses = SliderInput_styles.staticClasses;
exports.HvSliderInput = HvSliderInput;