@digigov/form 1.2.0-a7ffb5dc → 2.0.0-07ee8440

package/cjs/inputs/DateInput/index.js

@@ -1,141 +1,153 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+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);
+var DateInput_exports = {};
+__export(DateInput_exports, {
+  DateInput: () => DateInput,
+  default: () => DateInput_default
 });
-exports["default"] = exports.DateInput = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _dayjs = _interopRequireDefault(require("dayjs"));
-var _customParseFormat = _interopRequireDefault(require("dayjs/plugin/customParseFormat"));
-var _DateInputContainer = _interopRequireDefault(require("@digigov/react-core/cjs/DateInputContainer"));
-var _DateInputItem = _interopRequireDefault(require("@digigov/react-core/cjs/DateInputItem"));
-var _i18n = require("@digigov/ui/cjs/i18n");
-var _excluded = ["label"],
-  _excluded2 = ["name", "type"];
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
-_dayjs["default"].extend(_customParseFormat["default"]);
+module.exports = __toCommonJS(DateInput_exports);
+var import_react = __toESM(require("react"));
+var import_dayjs = __toESM(require("dayjs"));
+var import_customParseFormat = __toESM(require("dayjs/plugin/customParseFormat"));
+var import_DateInputContainer = require("@digigov/ui/form/DateInputContainer");
+var import_i18n = require("@digigov/ui/i18n");
+import_dayjs.default.extend(import_customParseFormat.default);
 function useDate(value, onChange) {
-  var _useMemo = (0, _react.useMemo)(function () {
-      if (!value || value.length === 0) {
-        onChange('');
-        return ['', '', ''];
-      }
-      var _value$split = value.split('/'),
-        _value$split2 = (0, _slicedToArray2["default"])(_value$split, 3),
-        day = _value$split2[0],
-        month = _value$split2[1],
-        year = _value$split2[2];
-      return [year, month, day];
-    }, [value]),
-    _useMemo2 = (0, _slicedToArray2["default"])(_useMemo, 3),
-    year = _useMemo2[0],
-    month = _useMemo2[1],
-    day = _useMemo2[2];
-  function set(year, month, day) {
-    var value = "".concat(day || '', "/").concat(month || '', "/").concat(year || '');
-    if (!year && !month && !day) {
+  const [year, month, day] = (0, import_react.useMemo)(() => {
+    if (!value || value.length === 0) {
+      onChange("");
+      return ["", "", ""];
+    }
+    const [day2, month2, year2] = value.split("/");
+    return [year2, month2, day2];
+  }, [value]);
+  function set(year2, month2, day2) {
+    const value2 = `${day2 || ""}/${month2 || ""}/${year2 || ""}`;
+    if (!year2 && !month2 && !day2) {
       onChange(null);
     } else {
-      onChange(value);
+      onChange(value2);
     }
   }
   function setYear(evt) {
-    var val = evt.target.value;
+    const val = evt.target.value.trim();
     set(val, month, day);
   }
   function setMonth(evt, cast) {
-    var val = evt.target.value;
+    let val = evt.target.value.trim();
     if (cast && val && val.length === 1) {
-      val = '0' + val;
+      val = "0" + val;
     }
     set(year, val, day);
   }
   function setDay(evt, cast) {
-    var val = evt.target.value;
+    let val = evt.target.value.trim();
     if (cast && val && val.length === 1) {
-      val = '0' + val;
+      val = "0" + val;
     }
     set(year, month, val);
   }
   return {
-    day: day,
-    month: month,
-    year: year,
-    setYear: setYear,
-    setMonth: setMonth,
-    setDay: setDay
+    day,
+    month,
+    year,
+    setYear,
+    setMonth,
+    setDay
   };
 }
-var VALID_FORMATS = ['DD/MM/YYYY'];
-var makeDate = function makeDate(val) {
-  var date = (0, _dayjs["default"])(val, VALID_FORMATS, true);
+const VALID_FORMATS = ["DD/MM/YYYY"];
+const makeDate = (val) => {
+  const date = (0, import_dayjs.default)(val, VALID_FORMATS, true);
   if (date.isValid()) {
-    return date.format('DD/MM/YYYY');
+    return date.format("DD/MM/YYYY");
   }
-  return '';
+  return "";
 };
-var DatePart = function DatePart(_ref) {
-  var label = _ref.label,
-    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  return /*#__PURE__*/_react["default"].createElement(_DateInputItem["default"], props, label);
+const DatePart = ({ label, ...props }) => {
+  return /* @__PURE__ */ import_react.default.createElement(import_DateInputContainer.DateInputItem, { ...props }, label);
 };
-var DateInput = exports.DateInput = function DateInput(_ref2) {
-  var name = _ref2.name,
-    type = _ref2.type,
-    props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
-  var _useTranslation = (0, _i18n.useTranslation)(),
-    t = _useTranslation.t;
-  var _useState = (0, _react.useState)(props.value),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 1),
-    initial = _useState2[0];
-  var value = (0, _react.useMemo)(function () {
+const DateInput = ({ name, ...props }) => {
+  const { t } = (0, import_i18n.useTranslation)();
+  const [initial] = (0, import_react.useState)(props.value);
+  const value = (0, import_react.useMemo)(() => {
     if (initial === props.value) {
       return makeDate(props.value);
     }
     return props.value;
   }, [props.value, initial]);
-  var date = useDate(value || makeDate(props.defaultValue), props.onChange);
-  return /*#__PURE__*/_react["default"].createElement(_DateInputContainer["default"], null, /*#__PURE__*/_react["default"].createElement(DatePart, {
-    label: t('form.label.day'),
-    onChange: date.setDay,
-    onBlur: function onBlur(e) {
-      return date.setDay(e, true);
-    },
-    value: date.day,
-    width: 2,
-    name: "".concat(name, "-day"),
-    maxLength: "2",
-    disabled: props.disabled,
-    "aria-required": props['aria-required'],
-    error: !date.day ? props.error : false
-  }), /*#__PURE__*/_react["default"].createElement(DatePart, {
-    label: t('form.label.month'),
-    onChange: date.setMonth,
-    onBlur: function onBlur(e) {
-      return date.setMonth(e, true);
-    },
-    value: date.month,
-    width: 2,
-    name: "".concat(props.name, "-month"),
-    maxLength: "2",
-    disabled: props.disabled,
-    "aria-required": props['aria-required'],
-    error: !date.month ? props.error : false
-  }), /*#__PURE__*/_react["default"].createElement(DatePart, {
-    label: t('form.label.year'),
-    onChange: date.setYear,
-    value: date.year,
-    width: 4,
-    name: "".concat(props.name, "-year"),
-    maxLength: "4",
-    disabled: props.disabled,
-    "aria-required": props['aria-required'],
-    error: !date.year ? props.error : false
-  }));
+  const date = useDate(value || makeDate(props.defaultValue), props.onChange);
+  return /* @__PURE__ */ import_react.default.createElement(import_DateInputContainer.DateInputContainer, null, /* @__PURE__ */ import_react.default.createElement(
+    DatePart,
+    {
+      label: t("form.label.day"),
+      onChange: date.setDay,
+      onBlur: (e) => date.setDay(e, true),
+      value: date.day,
+      width: 2,
+      name: `${name}-day`,
+      maxLength: "2",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !date.day ? props.error : false
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    DatePart,
+    {
+      label: t("form.label.month"),
+      onChange: date.setMonth,
+      onBlur: (e) => date.setMonth(e, true),
+      value: date.month,
+      width: 2,
+      name: `${name}-month`,
+      maxLength: "2",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !date.month ? props.error : false
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    DatePart,
+    {
+      label: t("form.label.year"),
+      onChange: date.setYear,
+      value: date.year,
+      width: 4,
+      name: `${name}-year`,
+      maxLength: "4",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !date.year ? props.error : false
+    }
+  ));
 };
-var _default = exports["default"] = DateInput;
+var DateInput_default = DateInput;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DateInput
+});
+//# sourceMappingURL=index.js.map

package/cjs/inputs/DateInput/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/inputs/DateInput/index.tsx"],
+  "sourcesContent": ["import React, { useMemo, useState } from 'react';\nimport dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport {\n  DateInputContainer,\n  DateInputItem,\n} from '@digigov/ui/form/DateInputContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\ndayjs.extend(customParseFormat);\n\nexport interface DateInputProps extends Omit<UncontrolledFieldProps, 'extra'> {\n  extra?: {\n    max?: string;\n    min?: string;\n  };\n}\n\nfunction useDate(value, onChange) {\n  const [year, month, day] = useMemo(() => {\n    if (!value || value.length === 0) {\n      onChange('');\n      return ['', '', ''];\n    }\n    const [day, month, year] = value.split('/');\n    return [year, month, day];\n  }, [value]);\n\n  function set(year, month, day) {\n    const value = `${day || ''}/${month || ''}/${year || ''}`;\n    if (!year && !month && !day) {\n      onChange(null);\n    } else {\n      onChange(value);\n    }\n  }\n\n  function setYear(evt) {\n    const val = evt.target.value.trim();\n    set(val, month, day);\n  }\n\n  function setMonth(evt, cast) {\n    let val = evt.target.value.trim();\n    if (cast && val && val.length === 1) {\n      val = '0' + val;\n    }\n    set(year, val, day);\n  }\n\n  function setDay(evt, cast) {\n    let val = evt.target.value.trim();\n    if (cast && val && val.length === 1) {\n      val = '0' + val;\n    }\n    set(year, month, val);\n  }\n\n  return {\n    day,\n    month,\n    year,\n    setYear,\n    setMonth,\n    setDay,\n  };\n}\n\nconst VALID_FORMATS = ['DD/MM/YYYY'];\n\nconst makeDate = (val) => {\n  const date = dayjs(val, VALID_FORMATS, true);\n  if (date.isValid()) {\n    return date.format('DD/MM/YYYY');\n  }\n  return '';\n};\n\nconst DatePart = ({ label, ...props }) => {\n  return <DateInputItem {...props}>{label}</DateInputItem>;\n};\n\nexport const DateInput = ({ name, ...props }) => {\n  const { t } = useTranslation();\n  const [initial] = useState(props.value);\n  const value = useMemo(() => {\n    if (initial === props.value) {\n      return makeDate(props.value);\n    }\n    return props.value;\n  }, [props.value, initial]);\n\n  const date = useDate(value || makeDate(props.defaultValue), props.onChange);\n\n  return (\n    <DateInputContainer>\n      <DatePart\n        label={t('form.label.day')}\n        onChange={date.setDay}\n        onBlur={(e) => date.setDay(e, true)}\n        value={date.day}\n        width={2}\n        name={`${name}-day`}\n        maxLength=\"2\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!date.day ? props.error : false}\n      />\n      <DatePart\n        label={t('form.label.month')}\n        onChange={date.setMonth}\n        onBlur={(e) => date.setMonth(e, true)}\n        value={date.month}\n        width={2}\n        name={`${name}-month`}\n        maxLength=\"2\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!date.month ? props.error : false}\n      />\n      <DatePart\n        label={t('form.label.year')}\n        onChange={date.setYear}\n        value={date.year}\n        width={4}\n        name={`${name}-year`}\n        maxLength=\"4\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!date.year ? props.error : false}\n      />\n    </DateInputContainer>\n  );\n};\n\nexport default DateInput;\n"],
+  "mappings": "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",
+  "names": ["dayjs", "customParseFormat", "day", "month", "year", "value", "React"]
+}

package/cjs/inputs/DateTimeInput/index.js

@@ -0,0 +1,206 @@
+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);
+var DateTimeInput_exports = {};
+__export(DateTimeInput_exports, {
+  DateTimeInput: () => DateTimeInput,
+  default: () => DateTimeInput_default
+});
+module.exports = __toCommonJS(DateTimeInput_exports);
+var import_react = __toESM(require("react"));
+var import_dayjs = __toESM(require("dayjs"));
+var import_customParseFormat = __toESM(require("dayjs/plugin/customParseFormat"));
+var import_DateInputContainer = require("@digigov/ui/form/DateInputContainer");
+var import_i18n = require("@digigov/ui/i18n");
+import_dayjs.default.extend(import_customParseFormat.default);
+function useDateTime(value, onChange) {
+  const [year, month, day, hours, minutes] = (0, import_react.useMemo)(() => {
+    if (!value || value.length === 0) {
+      onChange("");
+      return ["", "", "", "", ""];
+    }
+    const [datePart, timePart] = value.split(" ");
+    const [day2, month2, year2] = datePart.split("/");
+    const [hours2, minutes2] = timePart ? timePart.split(":") : ["", ""];
+    return [year2, month2, day2, hours2, minutes2];
+  }, [value]);
+  function set(year2, month2, day2, hours2, minutes2) {
+    const datePart = `${day2 || ""}/${month2 || ""}/${year2 || ""}`;
+    const timePart = hours2 || minutes2 ? `${hours2 || ""}:${minutes2 || ""}` : "";
+    const value2 = timePart ? `${datePart} ${timePart}` : datePart;
+    if (!year2 && !month2 && !day2 && !hours2 && !minutes2) {
+      onChange(null);
+    } else {
+      onChange(value2);
+    }
+  }
+  function setYear(evt) {
+    const val = evt.target.value;
+    set(val, month, day, hours, minutes);
+  }
+  function setMonth(evt, cast) {
+    let val = evt.target.value;
+    if (cast && val && val.length === 1) {
+      val = "0" + val;
+    }
+    set(year, val, day, hours, minutes);
+  }
+  function setDay(evt, cast) {
+    let val = evt.target.value;
+    if (cast && val && val.length === 1) {
+      val = "0" + val;
+    }
+    set(year, month, val, hours, minutes);
+  }
+  function setHours(evt, cast) {
+    let val = evt.target.value;
+    if (cast && val && val.length === 1) {
+      val = "0" + val;
+    }
+    set(year, month, day, val, minutes);
+  }
+  function setMinutes(evt, cast) {
+    let val = evt.target.value;
+    if (cast && val && val.length === 1) {
+      val = "0" + val;
+    }
+    set(year, month, day, hours, val);
+  }
+  return {
+    day,
+    month,
+    year,
+    hours,
+    minutes,
+    setYear,
+    setMonth,
+    setDay,
+    setHours,
+    setMinutes
+  };
+}
+const VALID_FORMATS = ["DD/MM/YYYY HH:mm", "DD/MM/YYYY"];
+const makeDateTime = (val) => {
+  const date = (0, import_dayjs.default)(val, VALID_FORMATS, true);
+  if (date.isValid()) {
+    return date.format("DD/MM/YYYY HH:mm");
+  }
+  return "";
+};
+const DateTimePart = ({ label, ...props }) => {
+  return /* @__PURE__ */ import_react.default.createElement(import_DateInputContainer.DateInputItem, { ...props }, label);
+};
+const DateTimeInput = ({ name, ...props }) => {
+  const { t } = (0, import_i18n.useTranslation)();
+  const [initial] = (0, import_react.useState)(props.value);
+  const value = (0, import_react.useMemo)(() => {
+    if (initial === props.value) {
+      return makeDateTime(props.value);
+    }
+    return props.value;
+  }, [props.value, initial]);
+  const datetime = useDateTime(
+    value || makeDateTime(props.defaultValue),
+    props.onChange
+  );
+  return /* @__PURE__ */ import_react.default.createElement(import_DateInputContainer.DateInputContainer, null, /* @__PURE__ */ import_react.default.createElement(
+    DateTimePart,
+    {
+      label: t("form.label.day"),
+      onChange: datetime.setDay,
+      onBlur: (e) => datetime.setDay(e, true),
+      value: datetime.day,
+      width: 2,
+      name: `${name}-day`,
+      maxLength: "2",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !datetime.day ? props.error : false
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    DateTimePart,
+    {
+      label: t("form.label.month"),
+      onChange: datetime.setMonth,
+      onBlur: (e) => datetime.setMonth(e, true),
+      value: datetime.month,
+      width: 2,
+      name: `${name}-month`,
+      maxLength: "2",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !datetime.month ? props.error : false
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    DateTimePart,
+    {
+      label: t("form.label.year"),
+      onChange: datetime.setYear,
+      value: datetime.year,
+      width: 4,
+      name: `${name}-year`,
+      maxLength: "4",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !datetime.year ? props.error : false
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    DateTimePart,
+    {
+      label: t("form.label.hours"),
+      onChange: datetime.setHours,
+      onBlur: (e) => datetime.setHours(e, true),
+      value: datetime.hours,
+      width: 2,
+      name: `${name}-hours`,
+      maxLength: "2",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !datetime.hours ? props.error : false
+    }
+  ), /* @__PURE__ */ import_react.default.createElement(
+    DateTimePart,
+    {
+      label: t("form.label.minutes"),
+      onChange: datetime.setMinutes,
+      onBlur: (e) => datetime.setMinutes(e, true),
+      value: datetime.minutes,
+      width: 2,
+      name: `${name}-minutes`,
+      maxLength: "2",
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      error: !datetime.minutes ? props.error : false
+    }
+  ));
+};
+var DateTimeInput_default = DateTimeInput;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  DateTimeInput
+});
+//# sourceMappingURL=index.js.map

package/cjs/inputs/DateTimeInput/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/inputs/DateTimeInput/index.tsx"],
+  "sourcesContent": ["import React, { useMemo, useState } from 'react';\nimport dayjs from 'dayjs';\nimport customParseFormat from 'dayjs/plugin/customParseFormat';\nimport { UncontrolledFieldProps } from '@digigov/form/Field/types';\nimport {\n  DateInputContainer,\n  DateInputItem,\n} from '@digigov/ui/form/DateInputContainer';\nimport { useTranslation } from '@digigov/ui/i18n';\ndayjs.extend(customParseFormat);\n\nexport interface DateTimeInputProps\n  extends Omit<UncontrolledFieldProps, 'extra'> {\n  extra?: {\n    max?: string;\n    min?: string;\n  };\n}\n\nfunction useDateTime(value, onChange) {\n  const [year, month, day, hours, minutes] = useMemo(() => {\n    if (!value || value.length === 0) {\n      onChange('');\n      return ['', '', '', '', ''];\n    }\n    const [datePart, timePart] = value.split(' ');\n    const [day, month, year] = datePart.split('/');\n    const [hours, minutes] = timePart ? timePart.split(':') : ['', ''];\n    return [year, month, day, hours, minutes];\n  }, [value]);\n\n  function set(year, month, day, hours, minutes) {\n    const datePart = `${day || ''}/${month || ''}/${year || ''}`;\n    const timePart = hours || minutes ? `${hours || ''}:${minutes || ''}` : '';\n    const value = timePart ? `${datePart} ${timePart}` : datePart;\n\n    if (!year && !month && !day && !hours && !minutes) {\n      onChange(null);\n    } else {\n      onChange(value);\n    }\n  }\n\n  function setYear(evt) {\n    const val = evt.target.value;\n    set(val, month, day, hours, minutes);\n  }\n\n  function setMonth(evt, cast) {\n    let val = evt.target.value;\n    if (cast && val && val.length === 1) {\n      val = '0' + val;\n    }\n    set(year, val, day, hours, minutes);\n  }\n\n  function setDay(evt, cast) {\n    let val = evt.target.value;\n    if (cast && val && val.length === 1) {\n      val = '0' + val;\n    }\n    set(year, month, val, hours, minutes);\n  }\n\n  function setHours(evt, cast) {\n    let val = evt.target.value;\n    if (cast && val && val.length === 1) {\n      val = '0' + val;\n    }\n    set(year, month, day, val, minutes);\n  }\n\n  function setMinutes(evt, cast) {\n    let val = evt.target.value;\n    if (cast && val && val.length === 1) {\n      val = '0' + val;\n    }\n    set(year, month, day, hours, val);\n  }\n\n  return {\n    day,\n    month,\n    year,\n    hours,\n    minutes,\n    setYear,\n    setMonth,\n    setDay,\n    setHours,\n    setMinutes,\n  };\n}\n\nconst VALID_FORMATS = ['DD/MM/YYYY HH:mm', 'DD/MM/YYYY'];\n\nconst makeDateTime = (val) => {\n  const date = dayjs(val, VALID_FORMATS, true);\n  if (date.isValid()) {\n    return date.format('DD/MM/YYYY HH:mm');\n  }\n  return '';\n};\n\nconst DateTimePart = ({ label, ...props }) => {\n  return <DateInputItem {...props}>{label}</DateInputItem>;\n};\n\nexport const DateTimeInput = ({ name, ...props }) => {\n  const { t } = useTranslation();\n  const [initial] = useState(props.value);\n  const value = useMemo(() => {\n    if (initial === props.value) {\n      return makeDateTime(props.value);\n    }\n    return props.value;\n  }, [props.value, initial]);\n\n  const datetime = useDateTime(\n    value || makeDateTime(props.defaultValue),\n    props.onChange\n  );\n\n  return (\n    <DateInputContainer>\n      <DateTimePart\n        label={t('form.label.day')}\n        onChange={datetime.setDay}\n        onBlur={(e) => datetime.setDay(e, true)}\n        value={datetime.day}\n        width={2}\n        name={`${name}-day`}\n        maxLength=\"2\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!datetime.day ? props.error : false}\n      />\n      <DateTimePart\n        label={t('form.label.month')}\n        onChange={datetime.setMonth}\n        onBlur={(e) => datetime.setMonth(e, true)}\n        value={datetime.month}\n        width={2}\n        name={`${name}-month`}\n        maxLength=\"2\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!datetime.month ? props.error : false}\n      />\n      <DateTimePart\n        label={t('form.label.year')}\n        onChange={datetime.setYear}\n        value={datetime.year}\n        width={4}\n        name={`${name}-year`}\n        maxLength=\"4\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!datetime.year ? props.error : false}\n      />\n      <DateTimePart\n        label={t('form.label.hours')}\n        onChange={datetime.setHours}\n        onBlur={(e) => datetime.setHours(e, true)}\n        value={datetime.hours}\n        width={2}\n        name={`${name}-hours`}\n        maxLength=\"2\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!datetime.hours ? props.error : false}\n      />\n      <DateTimePart\n        label={t('form.label.minutes')}\n        onChange={datetime.setMinutes}\n        onBlur={(e) => datetime.setMinutes(e, true)}\n        value={datetime.minutes}\n        width={2}\n        name={`${name}-minutes`}\n        maxLength=\"2\"\n        disabled={props.disabled}\n        aria-required={props['aria-required']}\n        error={!datetime.minutes ? props.error : false}\n      />\n    </DateInputContainer>\n  );\n};\n\nexport default DateTimeInput;\n"],
+  "mappings": "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",
+  "names": ["dayjs", "customParseFormat", "day", "month", "year", "hours", "minutes", "value", "React"]
+}