@mantine/dates
Version:
Calendars, date and time pickers based on Mantine components
78 lines (77 loc) • 2.8 kB
JavaScript
"use client";
const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
const require_TimeInput_module = require("./TimeInput.module.cjs");
let react_jsx_runtime = require("react/jsx-runtime");
let clsx = require("clsx");
clsx = require_runtime.__toESM(clsx);
let _mantine_core = require("@mantine/core");
//#region packages/@mantine/dates/src/components/TimeInput/TimeInput.tsx
const TimeInput = (0, _mantine_core.factory)((_props) => {
const props = (0, _mantine_core.useProps)([
"Input",
"InputWrapper",
"TimeInput"
], null, _props);
const { classNames, styles, unstyled, vars, withSeconds, minTime, maxTime, value, onChange, step, ...others } = props;
const { resolvedClassNames, resolvedStyles } = (0, _mantine_core.useResolvedStylesApi)({
classNames,
styles,
props
});
/**
* Check if time is within limits or not
* If the given value is within limits, return 0
* If the given value is greater than the maxTime, return 1
* If the given value is less than the minTime, return -1
*/
const checkIfTimeLimitExceeded = (val) => {
if (minTime !== void 0 || maxTime !== void 0) {
const [hours, minutes, seconds] = val.split(":").map(Number);
if (minTime) {
const [minHours, minMinutes, minSeconds] = minTime.split(":").map(Number);
if (hours < minHours || hours === minHours && minutes < minMinutes || withSeconds && hours === minHours && minutes === minMinutes && seconds < minSeconds) return -1;
}
if (maxTime) {
const [maxHours, maxMinutes, maxSeconds] = maxTime.split(":").map(Number);
if (hours > maxHours || hours === maxHours && minutes > maxMinutes || withSeconds && hours === maxHours && minutes === maxMinutes && seconds > maxSeconds) return 1;
}
}
return 0;
};
const onTimeBlur = (event) => {
props.onBlur?.(event);
if (minTime !== void 0 || maxTime !== void 0) {
const val = event.currentTarget.value;
if (val) {
const check = checkIfTimeLimitExceeded(val);
if (check === 1) {
if (maxTime) event.currentTarget.value = maxTime;
props.onChange?.(event);
} else if (check === -1) {
if (minTime) event.currentTarget.value = minTime;
props.onChange?.(event);
}
}
}
};
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_mantine_core.InputBase, {
classNames: {
...resolvedClassNames,
input: (0, clsx.default)(require_TimeInput_module.default.input, resolvedClassNames?.input)
},
styles: resolvedStyles,
unstyled,
value,
step: step ?? (withSeconds ? 1 : 60),
...others,
onChange,
onBlur: onTimeBlur,
type: "time",
__staticSelector: "TimeInput"
});
});
TimeInput.classes = _mantine_core.InputBase.classes;
TimeInput.displayName = "@mantine/dates/TimeInput";
//#endregion
exports.TimeInput = TimeInput;
//# sourceMappingURL=TimeInput.cjs.map