"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// packages/components/src/date-time/time/time-input/index.tsx
var time_input_exports = {};
__export(time_input_exports, {
  TimeInput: () => TimeInput,
  default: () => time_input_default
});
module.exports = __toCommonJS(time_input_exports);
var import_clsx = __toESM(require("clsx"), 1);
var import_i18n = require("@wordpress/i18n");
var import_element = require("@wordpress/element");
var import_styles = require("../styles.cjs");
var import_h_stack = require("../../../h-stack/index.cjs");
var import_utils = require("../../utils.cjs");
var import_utils2 = require("../../../utils/index.cjs");
var import_base_control = __toESM(require("../../../base-control/index.cjs"), 1);
var import_toggle_group_control = require("../../../toggle-group-control/index.cjs");
var import_jsx_runtime = require("react/jsx-runtime");
function TimeInput({
  value: valueProp,
  defaultValue,
  is12Hour,
  label,
  minutesProps,
  onChange
}) {
  const [value = {
    hours: (/* @__PURE__ */ new Date()).getHours(),
    minutes: (/* @__PURE__ */ new Date()).getMinutes()
  }, setValue] = (0, import_utils2.useControlledValue)({
    value: valueProp,
    onChange,
    defaultValue
  });
  const dayPeriod = parseDayPeriod(value.hours);
  const hours12Format = (0, import_utils.from24hTo12h)(value.hours);
  const buildNumberControlChangeCallback = (method) => {
    return (_value, {
      event
    }) => {
      if (!(0, import_utils.validateInputElementTarget)(event)) {
        return;
      }
      const numberValue = Number(_value);
      setValue({
        ...value,
        [method]: method === "hours" && is12Hour ? (0, import_utils.from12hTo24h)(numberValue, dayPeriod === "PM") : numberValue
      });
    };
  };
  const buildAmPmChangeCallback = (_value) => {
    return () => {
      if (dayPeriod === _value) {
        return;
      }
      setValue({
        ...value,
        hours: (0, import_utils.from12hTo24h)(hours12Format, _value === "PM")
      });
    };
  };
  function parseDayPeriod(_hours) {
    return _hours < 12 ? "AM" : "PM";
  }
  const Wrapper = label ? import_styles.Fieldset : import_element.Fragment;
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Wrapper, {
    children: [label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_base_control.default.VisualLabel, {
      as: "legend",
      children: label
    }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_h_stack.HStack, {
      alignment: "left",
      expanded: false,
      children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.TimeWrapper, {
        className: "components-datetime__time-field components-datetime__time-field-time",
        children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.HoursInput, {
          className: "components-datetime__time-field-hours-input",
          label: (0, import_i18n.__)("Hours"),
          hideLabelFromVision: true,
          __next40pxDefaultSize: true,
          value: String(is12Hour ? hours12Format : value.hours).padStart(2, "0"),
          step: 1,
          min: is12Hour ? 1 : 0,
          max: is12Hour ? 12 : 23,
          required: true,
          spinControls: "none",
          isPressEnterToChange: true,
          isDragEnabled: false,
          isShiftStepEnabled: false,
          onChange: buildNumberControlChangeCallback("hours"),
          __unstableStateReducer: (0, import_utils.buildPadInputStateReducer)(2)
        }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.TimeSeparator, {
          className: "components-datetime__time-separator",
          "aria-hidden": "true",
          children: ":"
        }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.MinutesInput, {
          className: (0, import_clsx.default)(
            "components-datetime__time-field-minutes-input",
            // Unused, for backwards compatibility.
            minutesProps?.className
          ),
          label: (0, import_i18n.__)("Minutes"),
          hideLabelFromVision: true,
          __next40pxDefaultSize: true,
          value: String(value.minutes).padStart(2, "0"),
          step: 1,
          min: 0,
          max: 59,
          required: true,
          spinControls: "none",
          isPressEnterToChange: true,
          isDragEnabled: false,
          isShiftStepEnabled: false,
          onChange: (...args) => {
            buildNumberControlChangeCallback("minutes")(...args);
            minutesProps?.onChange?.(...args);
          },
          __unstableStateReducer: (0, import_utils.buildPadInputStateReducer)(2),
          ...minutesProps
        })]
      }), is12Hour && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_toggle_group_control.ToggleGroupControl, {
        __next40pxDefaultSize: true,
        isBlock: true,
        label: (0, import_i18n.__)("Select AM or PM"),
        hideLabelFromVision: true,
        value: dayPeriod,
        onChange: (newValue) => {
          buildAmPmChangeCallback(newValue)();
        },
        children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_toggle_group_control.ToggleGroupControlOption, {
          value: "AM",
          label: (0, import_i18n.__)("AM")
        }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_toggle_group_control.ToggleGroupControlOption, {
          value: "PM",
          label: (0, import_i18n.__)("PM")
        })]
      })]
    })]
  });
}
var time_input_default = TimeInput;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  TimeInput
});
//# sourceMappingURL=index.cjs.map
