@itwin/components-react 4.17.6 → 5.0.0-dev.3

package/lib/esm/components-react/datepicker/TimeField.js

@@ -1,257 +0,0 @@
-/*---------------------------------------------------------------------------------------------
- * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
- * See LICENSE.md in the project root for license terms and full copyright notice.
- *--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Date
- */
-import * as React from "react";
-import classnames from "classnames";
-import { Key } from "ts-key-enum";
-import { Input } from "@itwin/itwinui-react";
-import "./TimeField.scss";
-import { useTranslation } from "../l10n/useTranslation";
-function getValidInt(intText, min, max, defaultValue) {
-    try {
-        const newValue = parseInt(intText, 10);
-        if (newValue >= min && newValue <= max)
-            return newValue;
-    }
-    catch (_e) {
-        return defaultValue;
-    }
-    return defaultValue;
-}
-function isSameTime(a, b) {
-    return (a.hours === b.hours && a.minutes === b.minutes && a.seconds === b.seconds);
-}
-/** Field used to set the Hour:Minutes:Seconds in the [[DatePicker]] Popup panel. The user may key-in the value or use up/down keys to
- * change the time.
- * @internal
- */
-export function TimeField({ time, timeDisplay, readOnly, onTimeChange, }) {
-    const { translate } = useTranslation();
-    const initialDateRef = React.useRef(time);
-    const amLabel = translate("timepicker.day-period-am");
-    const pmLabel = translate("timepicker.day-period-pm");
-    const [timeSpec, setTimeSpec] = React.useState(time);
-    const { hours, minutes, seconds } = timeSpec;
-    const showDayPeriod = -1 !== timeDisplay.search("aa");
-    const getDisplayHours = React.useCallback((timeHours) => {
-        if (!showDayPeriod) {
-            return timeHours;
-        }
-        const outHours = 0 === timeHours ? 12 : timeHours > 12 ? timeHours - 12 : timeHours;
-        return outHours;
-    }, [showDayPeriod]);
-    // See if new initialDate props have changed since component mounted
-    React.useEffect(() => {
-        if (!isSameTime(time, initialDateRef.current)) {
-            setTimeSpec(time);
-            initialDateRef.current = time;
-        }
-    }, [time]);
-    const displayHour = getDisplayHours(hours);
-    const [dayPeriodText, setDayPeriodText] = React.useState(showDayPeriod ? (hours >= 12 ? pmLabel : amLabel) : undefined);
-    const [hoursText, setHoursText] = React.useState(displayHour.toString().padStart(2, "0"));
-    const [minutesText, setMinutesText] = React.useState(minutes.toString().padStart(2, "0"));
-    const [secondsText, setSecondsText] = React.useState(seconds.toString().padStart(2, "0"));
-    const updateTimeSpec = React.useCallback((newTime) => {
-        if (newTime.hours !== timeSpec.hours ||
-            newTime.minutes !== timeSpec.minutes ||
-            newTime.seconds !== timeSpec.seconds) {
-            setTimeSpec(newTime);
-            onTimeChange && onTimeChange(newTime);
-        }
-    }, [onTimeChange, timeSpec.hours, timeSpec.minutes, timeSpec.seconds]);
-    const handleHoursChange = React.useCallback((event) => {
-        setHoursText(event.currentTarget.value);
-    }, []);
-    const handleMinutesChange = React.useCallback((event) => {
-        setMinutesText(event.currentTarget.value);
-    }, []);
-    const handleSecondsChange = React.useCallback((event) => {
-        setSecondsText(event.currentTarget.value);
-    }, []);
-    const handleDayPeriodChange = React.useCallback((event) => {
-        setDayPeriodText(event.currentTarget.value);
-    }, []);
-    const handleHoursOnBlur = React.useCallback(() => {
-        const newHours = getValidInt(hoursText, 0, 24, hours);
-        setHoursText(getDisplayHours(newHours).toString().padStart(2, "0"));
-        updateTimeSpec({ ...timeSpec, hours: newHours });
-        showDayPeriod && setDayPeriodText(newHours >= 12 ? pmLabel : amLabel);
-    }, [
-        amLabel,
-        getDisplayHours,
-        hours,
-        hoursText,
-        pmLabel,
-        showDayPeriod,
-        timeSpec,
-        updateTimeSpec,
-    ]);
-    const handleMinutesOnBlur = React.useCallback(() => {
-        const newMinutes = getValidInt(minutesText, 0, 59, minutes);
-        setMinutesText(newMinutes.toString().padStart(2, "0"));
-        updateTimeSpec({ ...timeSpec, minutes: newMinutes });
-    }, [minutes, minutesText, timeSpec, updateTimeSpec]);
-    const handleSecondsOnBlur = React.useCallback(() => {
-        const newSeconds = getValidInt(secondsText, 0, 59, seconds);
-        setSecondsText(newSeconds.toString().padStart(2, "0"));
-        updateTimeSpec({ ...timeSpec, seconds: newSeconds });
-    }, [seconds, secondsText, timeSpec, updateTimeSpec]);
-    const handleDayPeriodOnBlur = React.useCallback(() => {
-        let newPeriodText;
-        if (dayPeriodText === "AM" ||
-            dayPeriodText === "am" ||
-            dayPeriodText === amLabel)
-            newPeriodText = amLabel;
-        else if (dayPeriodText === "PM" ||
-            dayPeriodText === "pm" ||
-            dayPeriodText === pmLabel)
-            newPeriodText = pmLabel;
-        if (undefined !== newPeriodText) {
-            setDayPeriodText(newPeriodText);
-            if (newPeriodText === amLabel && hours > 12) {
-                updateTimeSpec({ ...timeSpec, hours: hours - 12 });
-            }
-            else if (newPeriodText === pmLabel && hours <= 11) {
-                updateTimeSpec({ ...timeSpec, hours: hours + 12 });
-            }
-        }
-    }, [amLabel, dayPeriodText, hours, pmLabel, timeSpec, updateTimeSpec]);
-    const handleHoursOnKeyDown = React.useCallback((event) => {
-        if (event.key === Key.ArrowDown.valueOf() ||
-            event.key === Key.ArrowUp.valueOf()) {
-            let newHours = hours + (event.key === Key.ArrowDown.valueOf() ? -1 : 1);
-            if (newHours < 0)
-                newHours = 24;
-            if (newHours > 24 || (newHours > 23 && minutes + seconds > 0))
-                newHours = 0;
-            setHoursText(getDisplayHours(newHours).toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, hours: newHours });
-            showDayPeriod && setDayPeriodText(newHours >= 12 ? pmLabel : amLabel);
-            event.preventDefault();
-        }
-        else if (event.key === Key.Enter.valueOf()) {
-            const newHours = getValidInt(hoursText, 0, 24, hours);
-            setHoursText(getDisplayHours(newHours).toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, hours: newHours });
-            showDayPeriod && setDayPeriodText(newHours >= 12 ? pmLabel : amLabel);
-            event.preventDefault();
-        }
-    }, [
-        amLabel,
-        getDisplayHours,
-        hours,
-        hoursText,
-        minutes,
-        pmLabel,
-        seconds,
-        showDayPeriod,
-        timeSpec,
-        updateTimeSpec,
-    ]);
-    const handleMinutesOnKeyDown = React.useCallback((event) => {
-        if (event.key === Key.ArrowDown.valueOf()) {
-            const newMinutes = minutes === 0 ? 59 : minutes - 1;
-            setMinutesText(newMinutes.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, minutes: newMinutes });
-            event.preventDefault();
-        }
-        else if (event.key === Key.ArrowUp.valueOf()) {
-            const newMinutes = minutes === 59 ? 0 : minutes + 1;
-            setMinutesText(newMinutes.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, minutes: newMinutes });
-            event.preventDefault();
-        }
-        else if (event.key === Key.Home.valueOf() ||
-            event.key === Key.End.valueOf()) {
-            const newMinutes = event.key === Key.Home.valueOf() ? 0 : 59;
-            setMinutesText(newMinutes.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, minutes: newMinutes });
-            event.preventDefault();
-        }
-        else if (event.key === Key.Enter.valueOf()) {
-            const newMinutes = getValidInt(minutesText, 0, 59, minutes);
-            setMinutesText(newMinutes.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, minutes: newMinutes });
-            event.preventDefault();
-        }
-    }, [minutesText, minutes, timeSpec, updateTimeSpec]);
-    const handleSecondsOnKeyDown = React.useCallback((event) => {
-        if (event.key === Key.ArrowDown.valueOf()) {
-            const newSeconds = seconds === 0 ? 59 : seconds - 1;
-            setSecondsText(newSeconds.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, seconds: newSeconds });
-            event.preventDefault();
-        }
-        else if (event.key === Key.ArrowUp.valueOf()) {
-            const newSeconds = seconds === 59 ? 0 : seconds + 1;
-            setSecondsText(newSeconds.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, seconds: newSeconds });
-            event.preventDefault();
-        }
-        else if (event.key === Key.Home.valueOf() ||
-            event.key === Key.End.valueOf()) {
-            const newSeconds = event.key === Key.Home.valueOf() ? 0 : 59;
-            setSecondsText(newSeconds.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, seconds: newSeconds });
-            event.preventDefault();
-        }
-        else if (event.key === Key.Enter.valueOf()) {
-            const newSeconds = getValidInt(secondsText, 0, 59, seconds);
-            setSecondsText(newSeconds.toString().padStart(2, "0"));
-            updateTimeSpec({ ...timeSpec, seconds: newSeconds });
-            event.preventDefault();
-        }
-    }, [seconds, secondsText, timeSpec, updateTimeSpec]);
-    const handleDayPeriodOnKeyDown = React.useCallback((event) => {
-        let newPeriodText;
-        if (event.key === Key.ArrowDown.valueOf() ||
-            event.key === Key.Home.valueOf() ||
-            event.key === "a" ||
-            event.key === "A") {
-            newPeriodText = amLabel;
-            event.preventDefault();
-        }
-        else if (event.key === Key.ArrowUp.valueOf() ||
-            event.key === Key.End.valueOf() ||
-            event.key === "p" ||
-            event.key === "P") {
-            newPeriodText = pmLabel;
-            event.preventDefault();
-        }
-        else if (event.key === Key.Enter.valueOf()) {
-            if (dayPeriodText === "AM" ||
-                dayPeriodText === "am" ||
-                dayPeriodText === amLabel)
-                newPeriodText = amLabel;
-            else if (dayPeriodText === "PM" ||
-                dayPeriodText === "pm" ||
-                dayPeriodText === pmLabel)
-                newPeriodText = pmLabel;
-            event.preventDefault();
-        }
-        if (undefined !== newPeriodText) {
-            setDayPeriodText(newPeriodText);
-            if (newPeriodText === amLabel && hours > 12) {
-                updateTimeSpec({ ...timeSpec, hours: hours - 12 });
-            }
-            else if (newPeriodText === pmLabel && hours <= 11) {
-                updateTimeSpec({ ...timeSpec, hours: hours + 12 });
-            }
-        }
-    }, [amLabel, dayPeriodText, hours, pmLabel, timeSpec, updateTimeSpec]);
-    const showSeconds = -1 !== timeDisplay.search(":ss");
-    return (React.createElement("div", { "data-testid": "components-time-input", className: "components-time" },
-        React.createElement(Input, { className: classnames("components-time-input", "components-input"), onKeyDown: handleHoursOnKeyDown, onBlur: handleHoursOnBlur, onChange: handleHoursChange, value: hoursText, disabled: readOnly, size: "small" }),
-        React.createElement("span", { className: "component-time-separator" }, ":"),
-        React.createElement(Input, { className: classnames("components-time-input", "components-input"), onKeyDown: handleMinutesOnKeyDown, onBlur: handleMinutesOnBlur, onChange: handleMinutesChange, value: minutesText, disabled: readOnly, size: "small" }),
-        showSeconds && (React.createElement(React.Fragment, null,
-            React.createElement("span", { className: "component-time-separator" }, ":"),
-            React.createElement(Input, { className: classnames("components-time-input", "components-input"), onKeyDown: handleSecondsOnKeyDown, onBlur: handleSecondsOnBlur, onChange: handleSecondsChange, value: secondsText, disabled: readOnly, size: "small" }))),
-        dayPeriodText && (React.createElement(Input, { className: classnames("components-time-period-input", "components-input"), onKeyDown: handleDayPeriodOnKeyDown, onBlur: handleDayPeriodOnBlur, onChange: handleDayPeriodChange, value: dayPeriodText, disabled: readOnly, size: "small" }))));
-}
-//# sourceMappingURL=TimeField.js.map

package/lib/esm/components-react/datepicker/TimeField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TimeField.js","sourceRoot":"","sources":["../../../../src/components-react/datepicker/TimeField.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Date\n */\n\nimport * as React from \"react\";\nimport classnames from \"classnames\";\nimport { Key } from \"ts-key-enum\";\nimport { Input } from \"@itwin/itwinui-react\";\nimport type { TimeDisplay } from \"@itwin/appui-abstract\";\nimport \"./TimeField.scss\";\nimport { useTranslation } from \"../l10n/useTranslation\";\n\n/** Interface used to hold 24 hour time in\n * hours, minutes, and seconds.\n * @internal\n */\nexport interface TimeSpec {\n  hours: number;\n  minutes: number;\n  seconds: number;\n}\n\n/** Interface for props used by [[TimeField]] component.\n * @internal\n */\nexport interface TimeFieldProps {\n  time: TimeSpec;\n  timeDisplay: TimeDisplay;\n  onTimeChange?: (time: TimeSpec) => void;\n  readOnly?: boolean;\n}\n\nfunction getValidInt(\n  intText: string,\n  min: number,\n  max: number,\n  defaultValue: number\n) {\n  try {\n    const newValue = parseInt(intText, 10);\n    if (newValue >= min && newValue <= max) return newValue;\n  } catch (_e) {\n    return defaultValue;\n  }\n  return defaultValue;\n}\n\nfunction isSameTime(a: TimeSpec, b: TimeSpec) {\n  return (\n    a.hours === b.hours && a.minutes === b.minutes && a.seconds === b.seconds\n  );\n}\n\n/** Field used to set the Hour:Minutes:Seconds in the [[DatePicker]] Popup panel. The user may key-in the value or use up/down keys to\n * change the time.\n * @internal\n */\nexport function TimeField({\n  time,\n  timeDisplay,\n  readOnly,\n  onTimeChange,\n}: TimeFieldProps) {\n  const { translate } = useTranslation();\n  const initialDateRef = React.useRef(time);\n  const amLabel = translate(\"timepicker.day-period-am\");\n  const pmLabel = translate(\"timepicker.day-period-pm\");\n  const [timeSpec, setTimeSpec] = React.useState(time);\n  const { hours, minutes, seconds } = timeSpec;\n  const showDayPeriod = -1 !== (timeDisplay as string).search(\"aa\");\n\n  const getDisplayHours = React.useCallback(\n    (timeHours: number) => {\n      if (!showDayPeriod) {\n        return timeHours;\n      }\n      const outHours =\n        0 === timeHours ? 12 : timeHours > 12 ? timeHours - 12 : timeHours;\n      return outHours;\n    },\n    [showDayPeriod]\n  );\n\n  // See if new initialDate props have changed since component mounted\n  React.useEffect(() => {\n    if (!isSameTime(time, initialDateRef.current)) {\n      setTimeSpec(time);\n      initialDateRef.current = time;\n    }\n  }, [time]);\n\n  const displayHour = getDisplayHours(hours);\n  const [dayPeriodText, setDayPeriodText] = React.useState(\n    showDayPeriod ? (hours >= 12 ? pmLabel : amLabel) : undefined\n  );\n  const [hoursText, setHoursText] = React.useState(\n    displayHour.toString().padStart(2, \"0\")\n  );\n  const [minutesText, setMinutesText] = React.useState(\n    minutes.toString().padStart(2, \"0\")\n  );\n  const [secondsText, setSecondsText] = React.useState(\n    seconds.toString().padStart(2, \"0\")\n  );\n\n  const updateTimeSpec = React.useCallback(\n    (newTime: TimeSpec) => {\n      if (\n        newTime.hours !== timeSpec.hours ||\n        newTime.minutes !== timeSpec.minutes ||\n        newTime.seconds !== timeSpec.seconds\n      ) {\n        setTimeSpec(newTime);\n        onTimeChange && onTimeChange(newTime);\n      }\n    },\n    [onTimeChange, timeSpec.hours, timeSpec.minutes, timeSpec.seconds]\n  );\n\n  const handleHoursChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      setHoursText(event.currentTarget.value);\n    },\n    []\n  );\n\n  const handleMinutesChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      setMinutesText(event.currentTarget.value);\n    },\n    []\n  );\n  const handleSecondsChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      setSecondsText(event.currentTarget.value);\n    },\n    []\n  );\n  const handleDayPeriodChange = React.useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      setDayPeriodText(event.currentTarget.value);\n    },\n    []\n  );\n\n  const handleHoursOnBlur = React.useCallback(() => {\n    const newHours = getValidInt(hoursText, 0, 24, hours);\n    setHoursText(getDisplayHours(newHours).toString().padStart(2, \"0\"));\n    updateTimeSpec({ ...timeSpec, hours: newHours });\n    showDayPeriod && setDayPeriodText(newHours >= 12 ? pmLabel : amLabel);\n  }, [\n    amLabel,\n    getDisplayHours,\n    hours,\n    hoursText,\n    pmLabel,\n    showDayPeriod,\n    timeSpec,\n    updateTimeSpec,\n  ]);\n  const handleMinutesOnBlur = React.useCallback(() => {\n    const newMinutes = getValidInt(minutesText, 0, 59, minutes);\n    setMinutesText(newMinutes.toString().padStart(2, \"0\"));\n    updateTimeSpec({ ...timeSpec, minutes: newMinutes });\n  }, [minutes, minutesText, timeSpec, updateTimeSpec]);\n  const handleSecondsOnBlur = React.useCallback(() => {\n    const newSeconds = getValidInt(secondsText, 0, 59, seconds);\n    setSecondsText(newSeconds.toString().padStart(2, \"0\"));\n    updateTimeSpec({ ...timeSpec, seconds: newSeconds });\n  }, [seconds, secondsText, timeSpec, updateTimeSpec]);\n  const handleDayPeriodOnBlur = React.useCallback(() => {\n    let newPeriodText: string | undefined;\n    if (\n      dayPeriodText === \"AM\" ||\n      dayPeriodText === \"am\" ||\n      dayPeriodText === amLabel\n    )\n      newPeriodText = amLabel;\n    else if (\n      dayPeriodText === \"PM\" ||\n      dayPeriodText === \"pm\" ||\n      dayPeriodText === pmLabel\n    )\n      newPeriodText = pmLabel;\n\n    if (undefined !== newPeriodText) {\n      setDayPeriodText(newPeriodText);\n      if (newPeriodText === amLabel && hours > 12) {\n        updateTimeSpec({ ...timeSpec, hours: hours - 12 });\n      } else if (newPeriodText === pmLabel && hours <= 11) {\n        updateTimeSpec({ ...timeSpec, hours: hours + 12 });\n      }\n    }\n  }, [amLabel, dayPeriodText, hours, pmLabel, timeSpec, updateTimeSpec]);\n\n  const handleHoursOnKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (\n        event.key === Key.ArrowDown.valueOf() ||\n        event.key === Key.ArrowUp.valueOf()\n      ) {\n        let newHours = hours + (event.key === Key.ArrowDown.valueOf() ? -1 : 1);\n        if (newHours < 0) newHours = 24;\n        if (newHours > 24 || (newHours > 23 && minutes + seconds > 0))\n          newHours = 0;\n        setHoursText(getDisplayHours(newHours).toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, hours: newHours });\n        showDayPeriod && setDayPeriodText(newHours >= 12 ? pmLabel : amLabel);\n        event.preventDefault();\n      } else if (event.key === Key.Enter.valueOf()) {\n        const newHours = getValidInt(hoursText, 0, 24, hours);\n        setHoursText(getDisplayHours(newHours).toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, hours: newHours });\n        showDayPeriod && setDayPeriodText(newHours >= 12 ? pmLabel : amLabel);\n        event.preventDefault();\n      }\n    },\n    [\n      amLabel,\n      getDisplayHours,\n      hours,\n      hoursText,\n      minutes,\n      pmLabel,\n      seconds,\n      showDayPeriod,\n      timeSpec,\n      updateTimeSpec,\n    ]\n  );\n\n  const handleMinutesOnKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (event.key === Key.ArrowDown.valueOf()) {\n        const newMinutes = minutes === 0 ? 59 : minutes - 1;\n        setMinutesText(newMinutes.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, minutes: newMinutes });\n        event.preventDefault();\n      } else if (event.key === Key.ArrowUp.valueOf()) {\n        const newMinutes = minutes === 59 ? 0 : minutes + 1;\n        setMinutesText(newMinutes.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, minutes: newMinutes });\n        event.preventDefault();\n      } else if (\n        event.key === Key.Home.valueOf() ||\n        event.key === Key.End.valueOf()\n      ) {\n        const newMinutes = event.key === Key.Home.valueOf() ? 0 : 59;\n        setMinutesText(newMinutes.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, minutes: newMinutes });\n        event.preventDefault();\n      } else if (event.key === Key.Enter.valueOf()) {\n        const newMinutes = getValidInt(minutesText, 0, 59, minutes);\n        setMinutesText(newMinutes.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, minutes: newMinutes });\n        event.preventDefault();\n      }\n    },\n    [minutesText, minutes, timeSpec, updateTimeSpec]\n  );\n\n  const handleSecondsOnKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\n      if (event.key === Key.ArrowDown.valueOf()) {\n        const newSeconds = seconds === 0 ? 59 : seconds - 1;\n        setSecondsText(newSeconds.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, seconds: newSeconds });\n        event.preventDefault();\n      } else if (event.key === Key.ArrowUp.valueOf()) {\n        const newSeconds = seconds === 59 ? 0 : seconds + 1;\n        setSecondsText(newSeconds.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, seconds: newSeconds });\n        event.preventDefault();\n      } else if (\n        event.key === Key.Home.valueOf() ||\n        event.key === Key.End.valueOf()\n      ) {\n        const newSeconds = event.key === Key.Home.valueOf() ? 0 : 59;\n        setSecondsText(newSeconds.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, seconds: newSeconds });\n        event.preventDefault();\n      } else if (event.key === Key.Enter.valueOf()) {\n        const newSeconds = getValidInt(secondsText, 0, 59, seconds);\n        setSecondsText(newSeconds.toString().padStart(2, \"0\"));\n        updateTimeSpec({ ...timeSpec, seconds: newSeconds });\n        event.preventDefault();\n      }\n    },\n    [seconds, secondsText, timeSpec, updateTimeSpec]\n  );\n\n  const handleDayPeriodOnKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\n      let newPeriodText: string | undefined;\n      if (\n        event.key === Key.ArrowDown.valueOf() ||\n        event.key === Key.Home.valueOf() ||\n        event.key === \"a\" ||\n        event.key === \"A\"\n      ) {\n        newPeriodText = amLabel;\n        event.preventDefault();\n      } else if (\n        event.key === Key.ArrowUp.valueOf() ||\n        event.key === Key.End.valueOf() ||\n        event.key === \"p\" ||\n        event.key === \"P\"\n      ) {\n        newPeriodText = pmLabel;\n        event.preventDefault();\n      } else if (event.key === Key.Enter.valueOf()) {\n        if (\n          dayPeriodText === \"AM\" ||\n          dayPeriodText === \"am\" ||\n          dayPeriodText === amLabel\n        )\n          newPeriodText = amLabel;\n        else if (\n          dayPeriodText === \"PM\" ||\n          dayPeriodText === \"pm\" ||\n          dayPeriodText === pmLabel\n        )\n          newPeriodText = pmLabel;\n        event.preventDefault();\n      }\n      if (undefined !== newPeriodText) {\n        setDayPeriodText(newPeriodText);\n\n        if (newPeriodText === amLabel && hours > 12) {\n          updateTimeSpec({ ...timeSpec, hours: hours - 12 });\n        } else if (newPeriodText === pmLabel && hours <= 11) {\n          updateTimeSpec({ ...timeSpec, hours: hours + 12 });\n        }\n      }\n    },\n    [amLabel, dayPeriodText, hours, pmLabel, timeSpec, updateTimeSpec]\n  );\n\n  const showSeconds = -1 !== (timeDisplay as string).search(\":ss\");\n\n  return (\n    <div data-testid=\"components-time-input\" className=\"components-time\">\n      <Input\n        className={classnames(\"components-time-input\", \"components-input\")}\n        onKeyDown={handleHoursOnKeyDown}\n        onBlur={handleHoursOnBlur}\n        onChange={handleHoursChange}\n        value={hoursText}\n        disabled={readOnly}\n        size=\"small\"\n      />\n      <span className=\"component-time-separator\">:</span>\n      <Input\n        className={classnames(\"components-time-input\", \"components-input\")}\n        onKeyDown={handleMinutesOnKeyDown}\n        onBlur={handleMinutesOnBlur}\n        onChange={handleMinutesChange}\n        value={minutesText}\n        disabled={readOnly}\n        size=\"small\"\n      />\n      {showSeconds && (\n        <>\n          <span className=\"component-time-separator\">:</span>\n          <Input\n            className={classnames(\"components-time-input\", \"components-input\")}\n            onKeyDown={handleSecondsOnKeyDown}\n            onBlur={handleSecondsOnBlur}\n            onChange={handleSecondsChange}\n            value={secondsText}\n            disabled={readOnly}\n            size=\"small\"\n          />\n        </>\n      )}\n      {dayPeriodText && (\n        <Input\n          className={classnames(\n            \"components-time-period-input\",\n            \"components-input\"\n          )}\n          onKeyDown={handleDayPeriodOnKeyDown}\n          onBlur={handleDayPeriodOnBlur}\n          onChange={handleDayPeriodChange}\n          value={dayPeriodText}\n          disabled={readOnly}\n          size=\"small\"\n        />\n      )}\n    </div>\n  );\n}\n"]}

package/lib/esm/components-react/editors/BooleanEditor.d.ts

@@ -1,41 +0,0 @@
-/** @packageDocumentation
- * @module PropertyEditors
- */
-import "./BooleanEditor.scss";
-import * as React from "react";
-import type { PropertyValue } from "@itwin/appui-abstract";
-import type { PropertyEditorProps, TypeEditor } from "./EditorContainer";
-import { PropertyEditorBase } from "./PropertyEditorManager";
-/** @internal */
-interface BooleanEditorState {
-    checkboxValue: boolean;
-    isDisabled?: boolean;
-}
-/** BooleanEditor React component that is a property editor with checkbox input
- * @public
- */
-export declare class BooleanEditor extends React.PureComponent<PropertyEditorProps, BooleanEditorState> implements TypeEditor {
-    private _isMounted;
-    private _inputElement;
-    readonly state: Readonly<BooleanEditorState>;
-    getPropertyValue(): Promise<PropertyValue | undefined>;
-    private getPropertyValueSync;
-    get htmlElement(): HTMLElement | null;
-    get hasFocus(): boolean;
-    private _updateCheckboxValue;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    componentDidUpdate(prevProps: PropertyEditorProps): void;
-    private setStateFromProps;
-    render(): React.JSX.Element;
-}
-/** Boolean Property Editor registered for the "bool" and "boolean" type names.
- * It uses the [[BooleanEditor]] React component.
- * @public
- */
-export declare class BooleanPropertyEditor extends PropertyEditorBase {
-    get containerHandlesBlur(): boolean;
-    get reactNode(): React.ReactNode;
-}
-export {};
-//# sourceMappingURL=BooleanEditor.d.ts.map

package/lib/esm/components-react/editors/BooleanEditor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BooleanEditor.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/BooleanEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,sBAAsB,CAAC;AAE9B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAG3D,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EACL,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AAEjC,gBAAgB;AAChB,UAAU,kBAAkB;IAC1B,aAAa,EAAE,OAAO,CAAC;IACvB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,qBAAa,aACX,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,kBAAkB,CACnE,YAAW,UAAU;IAErB,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAAuC;IAE5D,SAAyB,KAAK,EAAE,QAAQ,CAAC,kBAAkB,CAAC,CAG1D;IAEW,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAInE,OAAO,CAAC,oBAAoB;IAe5B,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAE7B;IAED,OAAO,CAAC,oBAAoB,CAqB1B;IAEc,iBAAiB;IAKjB,oBAAoB;IAIpB,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;IAMjE,OAAO,CAAC,iBAAiB;IAmBT,MAAM;CAuBvB;AAED;;;GAGG;AACH,qBAAa,qBAAsB,SAAQ,kBAAkB;IAC3D,IAAoB,oBAAoB,IAAI,OAAO,CAElD;IAED,IAAW,SAAS,IAAI,KAAK,CAAC,SAAS,CAEtC;CACF"}

package/lib/esm/components-react/editors/BooleanEditor.js

@@ -1,113 +0,0 @@
-/*---------------------------------------------------------------------------------------------
- * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
- * See LICENSE.md in the project root for license terms and full copyright notice.
- *--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module PropertyEditors
- */
-import "./BooleanEditor.scss";
-import classnames from "classnames";
-import * as React from "react";
-import { PropertyValueFormat, StandardTypeNames } from "@itwin/appui-abstract";
-import { Checkbox } from "@itwin/itwinui-react";
-import { PropertyEditorBase, PropertyEditorManager, } from "./PropertyEditorManager";
-/** BooleanEditor React component that is a property editor with checkbox input
- * @public
- */
-export class BooleanEditor extends React.PureComponent {
-    constructor() {
-        super(...arguments);
-        this._isMounted = false;
-        this._inputElement = React.createRef();
-        this.state = {
-            checkboxValue: false,
-            isDisabled: false,
-        };
-        this._updateCheckboxValue = (e) => {
-            if (this._isMounted) {
-                const checkboxValue = !!e.target.checked;
-                this.setState({
-                    checkboxValue,
-                }, () => {
-                    if (this.props.propertyRecord && this.props.onCommit) {
-                        const propertyValue = this.getPropertyValueSync();
-                        if (propertyValue !== undefined) {
-                            this.props.onCommit({
-                                propertyRecord: this.props.propertyRecord,
-                                newValue: propertyValue,
-                            });
-                        }
-                    }
-                });
-            }
-        };
-    }
-    async getPropertyValue() {
-        return this.getPropertyValueSync();
-    }
-    getPropertyValueSync() {
-        const record = this.props.propertyRecord;
-        let propertyValue;
-        if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {
-            propertyValue = {
-                valueFormat: PropertyValueFormat.Primitive,
-                value: this.state.checkboxValue,
-                displayValue: "",
-            };
-        }
-        return propertyValue;
-    }
-    get htmlElement() {
-        return this._inputElement.current;
-    }
-    get hasFocus() {
-        return document.activeElement === this._inputElement.current;
-    }
-    componentDidMount() {
-        this._isMounted = true;
-        this.setStateFromProps();
-    }
-    componentWillUnmount() {
-        this._isMounted = false;
-    }
-    componentDidUpdate(prevProps) {
-        if (this.props.propertyRecord !== prevProps.propertyRecord) {
-            this.setStateFromProps();
-        }
-    }
-    setStateFromProps() {
-        const { propertyRecord } = this.props;
-        let checkboxValue = false;
-        let isDisabled = false;
-        if (propertyRecord &&
-            propertyRecord.value.valueFormat === PropertyValueFormat.Primitive) {
-            const primitiveValue = propertyRecord.value.value;
-            checkboxValue = primitiveValue;
-        }
-        if (propertyRecord && propertyRecord.isDisabled)
-            isDisabled = propertyRecord.isDisabled;
-        if (this._isMounted)
-            this.setState({ checkboxValue, isDisabled });
-    }
-    render() {
-        const className = classnames("components-cell-editor", "components-boolean-editor", this.props.className);
-        const checked = this.state.checkboxValue;
-        const isDisabled = !!this.state.isDisabled;
-        return (React.createElement(Checkbox, { ref: this._inputElement, onBlur: this.props.onBlur, className: className, style: this.props.style, checked: checked, onChange: this._updateCheckboxValue, autoFocus: this.props.setFocus, disabled: isDisabled, "data-testid": "components-checkbox-editor" }));
-    }
-}
-/** Boolean Property Editor registered for the "bool" and "boolean" type names.
- * It uses the [[BooleanEditor]] React component.
- * @public
- */
-export class BooleanPropertyEditor extends PropertyEditorBase {
-    get containerHandlesBlur() {
-        return false;
-    }
-    get reactNode() {
-        return React.createElement(BooleanEditor, null);
-    }
-}
-PropertyEditorManager.registerEditor(StandardTypeNames.Bool, BooleanPropertyEditor);
-PropertyEditorManager.registerEditor(StandardTypeNames.Boolean, BooleanPropertyEditor);
-//# sourceMappingURL=BooleanEditor.js.map

package/lib/esm/components-react/editors/BooleanEditor.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BooleanEditor.js","sourceRoot":"","sources":["../../../../src/components-react/editors/BooleanEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport \"./BooleanEditor.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { PropertyValue } from \"@itwin/appui-abstract\";\nimport { PropertyValueFormat, StandardTypeNames } from \"@itwin/appui-abstract\";\nimport { Checkbox } from \"@itwin/itwinui-react\";\nimport type { PropertyEditorProps, TypeEditor } from \"./EditorContainer\";\nimport {\n  PropertyEditorBase,\n  PropertyEditorManager,\n} from \"./PropertyEditorManager\";\n\n/** @internal */\ninterface BooleanEditorState {\n  checkboxValue: boolean;\n  isDisabled?: boolean;\n}\n\n/** BooleanEditor React component that is a property editor with checkbox input\n * @public\n */\nexport class BooleanEditor\n  extends React.PureComponent<PropertyEditorProps, BooleanEditorState>\n  implements TypeEditor\n{\n  private _isMounted = false;\n  private _inputElement = React.createRef<HTMLInputElement>();\n\n  public override readonly state: Readonly<BooleanEditorState> = {\n    checkboxValue: false,\n    isDisabled: false,\n  };\n\n  public async getPropertyValue(): Promise<PropertyValue | undefined> {\n    return this.getPropertyValueSync();\n  }\n\n  private getPropertyValueSync(): PropertyValue | undefined {\n    const record = this.props.propertyRecord;\n    let propertyValue: PropertyValue | undefined;\n\n    if (record && record.value.valueFormat === PropertyValueFormat.Primitive) {\n      propertyValue = {\n        valueFormat: PropertyValueFormat.Primitive,\n        value: this.state.checkboxValue,\n        displayValue: \"\",\n      };\n    }\n\n    return propertyValue;\n  }\n\n  public get htmlElement(): HTMLElement | null {\n    return this._inputElement.current;\n  }\n\n  public get hasFocus(): boolean {\n    return document.activeElement === this._inputElement.current;\n  }\n\n  private _updateCheckboxValue = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (this._isMounted) {\n      const checkboxValue = !!e.target.checked;\n\n      this.setState(\n        {\n          checkboxValue,\n        },\n        () => {\n          if (this.props.propertyRecord && this.props.onCommit) {\n            const propertyValue = this.getPropertyValueSync();\n            if (propertyValue !== undefined) {\n              this.props.onCommit({\n                propertyRecord: this.props.propertyRecord,\n                newValue: propertyValue,\n              });\n            }\n          }\n        }\n      );\n    }\n  };\n\n  public override componentDidMount() {\n    this._isMounted = true;\n    this.setStateFromProps();\n  }\n\n  public override componentWillUnmount() {\n    this._isMounted = false;\n  }\n\n  public override componentDidUpdate(prevProps: PropertyEditorProps) {\n    if (this.props.propertyRecord !== prevProps.propertyRecord) {\n      this.setStateFromProps();\n    }\n  }\n\n  private setStateFromProps() {\n    const { propertyRecord } = this.props;\n    let checkboxValue = false;\n    let isDisabled = false;\n\n    if (\n      propertyRecord &&\n      propertyRecord.value.valueFormat === PropertyValueFormat.Primitive\n    ) {\n      const primitiveValue = propertyRecord.value.value;\n      checkboxValue = primitiveValue as boolean;\n    }\n\n    if (propertyRecord && propertyRecord.isDisabled)\n      isDisabled = propertyRecord.isDisabled;\n\n    if (this._isMounted) this.setState({ checkboxValue, isDisabled });\n  }\n\n  public override render() {\n    const className = classnames(\n      \"components-cell-editor\",\n      \"components-boolean-editor\",\n      this.props.className\n    );\n    const checked = this.state.checkboxValue;\n    const isDisabled = !!this.state.isDisabled;\n\n    return (\n      <Checkbox\n        ref={this._inputElement}\n        onBlur={this.props.onBlur}\n        className={className}\n        style={this.props.style}\n        checked={checked}\n        onChange={this._updateCheckboxValue}\n        autoFocus={this.props.setFocus} // eslint-disable-line jsx-a11y/no-autofocus\n        disabled={isDisabled}\n        data-testid=\"components-checkbox-editor\"\n      ></Checkbox>\n    );\n  }\n}\n\n/** Boolean Property Editor registered for the \"bool\" and \"boolean\" type names.\n * It uses the [[BooleanEditor]] React component.\n * @public\n */\nexport class BooleanPropertyEditor extends PropertyEditorBase {\n  public override get containerHandlesBlur(): boolean {\n    return false;\n  }\n\n  public get reactNode(): React.ReactNode {\n    return <BooleanEditor />;\n  }\n}\n\nPropertyEditorManager.registerEditor(\n  StandardTypeNames.Bool,\n  BooleanPropertyEditor\n);\nPropertyEditorManager.registerEditor(\n  StandardTypeNames.Boolean,\n  BooleanPropertyEditor\n);\n"]}

package/lib/esm/components-react/editors/CustomNumberEditor.d.ts

@@ -1,50 +0,0 @@
-/** @packageDocumentation
- * @module PropertyEditors
- */
-import "./CustomNumberEditor.scss";
-import * as React from "react";
-import type { PropertyValue } from "@itwin/appui-abstract";
-import type { PropertyEditorProps, TypeEditor } from "./EditorContainer";
-import { PropertyEditorBase } from "./PropertyEditorManager";
-/** @internal */
-interface CustomNumberEditorState {
-    inputValue: string;
-    size?: number;
-    maxLength?: number;
-    iconSpec?: string;
-}
-/** CustomNumberEditor is a React component that is a property editor for numbers that specify custom formatting and parsing functions.
- * @alpha
- */
-export declare class CustomNumberEditor extends React.PureComponent<PropertyEditorProps, CustomNumberEditorState> implements TypeEditor {
-    private _isMounted;
-    private _formatParams;
-    private _inputElement;
-    private _lastValidValue;
-    readonly state: Readonly<CustomNumberEditorState>;
-    getPropertyValue(): Promise<PropertyValue | undefined>;
-    get htmlElement(): HTMLElement | null;
-    get hasFocus(): boolean;
-    private shouldSetFocus;
-    private _applyUpdatedValue;
-    private _updateInputValue;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    componentDidUpdate(prevProps: PropertyEditorProps): void;
-    private _getInitialDisplayValue;
-    private setStateFromProps;
-    private _resetToLastValidDisplayValue;
-    private _onKeyPress;
-    private _onFocus;
-    render(): React.ReactNode;
-}
-/** Custom Property Editor registered for the "number" type name and the "number-custom" editor name.
- * It uses the [[CustomNumberEditor]] React component.
- * @alpha
- */
-export declare class CustomNumberPropertyEditor extends PropertyEditorBase {
-    get reactNode(): React.ReactNode;
-    get containerHandlesEscape(): boolean;
-}
-export {};
-//# sourceMappingURL=CustomNumberEditor.d.ts.map

package/lib/esm/components-react/editors/CustomNumberEditor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CustomNumberEditor.d.ts","sourceRoot":"","sources":["../../../../src/components-react/editors/CustomNumberEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAIH,OAAO,2BAA2B,CAAC;AAEnC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAOV,aAAa,EACd,MAAM,uBAAuB,CAAC;AAe/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EACL,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AAEjC,gBAAgB;AAChB,UAAU,uBAAuB;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;GAEG;AACH,qBAAa,kBACX,SAAQ,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE,uBAAuB,CACxE,YAAW,UAAU;IAErB,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAA0C;IAC/D,OAAO,CAAC,aAAa,CAAuC;IAC5D,OAAO,CAAC,eAAe,CAA4B;IAEnD,SAAyB,KAAK,EAAE,QAAQ,CAAC,uBAAuB,CAAC,CAE/D;IAEW,gBAAgB,IAAI,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC;IAoEnE,IAAW,WAAW,IAAI,WAAW,GAAG,IAAI,CAE3C;IAED,IAAW,QAAQ,IAAI,OAAO,CAE7B;IAED,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,kBAAkB;IAa1B,OAAO,CAAC,iBAAiB,CAEvB;IAEc,iBAAiB;IAKjB,oBAAoB;IAIpB,kBAAkB,CAAC,SAAS,EAAE,mBAAmB;IAMjE,OAAO,CAAC,uBAAuB;YAuBjB,iBAAiB;IAuE/B,OAAO,CAAC,6BAA6B;IAQrC,OAAO,CAAC,WAAW,CAkBjB;IAEF,OAAO,CAAC,QAAQ,CAEd;IAEc,MAAM,IAAI,KAAK,CAAC,SAAS;CA0D1C;AAED;;;GAGG;AACH,qBAAa,0BAA2B,SAAQ,kBAAkB;IAChE,IAAW,SAAS,IAAI,KAAK,CAAC,SAAS,CAEtC;IACD,IAAoB,sBAAsB,IAAI,OAAO,CAEpD;CACF"}