@elliemae/ds-controlled-form 2.3.0-next.0 → 3.0.0-alpha.0

package/dist/esm/controlled-date-time-picker/config/useGetDestructuredValues.js

@@ -0,0 +1,160 @@
+import * as React from "react";
+import { useMemo } from "react";
+import {
+  dateTimeToTime,
+  deconstructTimeValues,
+  dateTimeToDate,
+  deconstructValuesFromDateString,
+  fillStringWithPlaceHolders
+} from "../utils/stringHelpers";
+import { convertToPositiveNumberIfPossible } from "../utils/numberHelpers";
+import { monthNames, announcableCardinalDays } from "../utils/constants";
+const useGetDestructuredDateValues = ({
+  date,
+  dateTime,
+  isDateTimeSelector
+}) => {
+  const dateStringFromProps = isDateTimeSelector ? dateTimeToDate(dateTime) : date;
+  const deconstructedValues = deconstructValuesFromDateString(dateStringFromProps);
+  const { month, day, year } = deconstructedValues;
+  const monthNum = convertToPositiveNumberIfPossible(month);
+  const dayNum = convertToPositiveNumberIfPossible(day);
+  const yearNum = convertToPositiveNumberIfPossible(year);
+  const announcedMonth = monthNum !== -1 ? monthNames[monthNum - 1] : "empty month";
+  const announcedDay = dayNum !== -1 ? announcableCardinalDays[dayNum] : "empty day";
+  const announcedYear = yearNum !== -1 ? fillStringWithPlaceHolders(`${yearNum}`, 4, "0") : "empty year";
+  const announcedDateValues = `${announcedMonth}, ${announcedDay}, ${announcedYear}`;
+  return useMemo(() => ({
+    month,
+    day,
+    year,
+    monthNum,
+    dayNum,
+    yearNum,
+    announcedMonth,
+    announcedDay,
+    announcedYear,
+    announcedDateValues
+  }), [announcedDay, announcedMonth, announcedYear, announcedDateValues, day, dayNum, month, monthNum, year, yearNum]);
+};
+const useGetDestructuredTimeValues = ({
+  time,
+  dateTime,
+  isDateTimeSelector
+}) => {
+  const timeStringFromProps = isDateTimeSelector ? dateTimeToTime(dateTime) : time;
+  const deconstructedValues = deconstructTimeValues(timeStringFromProps);
+  const { hours, minutes, meridiem } = deconstructedValues;
+  const hoursNum = convertToPositiveNumberIfPossible(hours);
+  const minutesNum = convertToPositiveNumberIfPossible(minutes);
+  const announcedHours = hoursNum !== -1 ? `${hoursNum}` : "empty hours";
+  const announcedMinutes = minutesNum !== -1 ? `${minutesNum}` : "empty minutes";
+  const announcedMeridiem = meridiem === "PM" ? `post meridiem` : meridiem === "AM" ? "ante meridiem" : "empty meriediem";
+  const announcedTimeValues = `${announcedHours}, ${announcedMinutes}, ${announcedMeridiem}`;
+  return useMemo(() => ({
+    hours,
+    minutes,
+    meridiem,
+    hoursNum,
+    minutesNum,
+    announcedHours,
+    announcedMinutes,
+    announcedMeridiem,
+    announcedTimeValues
+  }), [
+    hours,
+    minutes,
+    meridiem,
+    hoursNum,
+    minutesNum,
+    announcedHours,
+    announcedMinutes,
+    announcedMeridiem,
+    announcedTimeValues
+  ]);
+};
+const useGetDestructuredValues = ({
+  date,
+  time,
+  dateTime,
+  isDateTimeSelector
+}) => {
+  const {
+    month,
+    day,
+    year,
+    monthNum,
+    dayNum,
+    yearNum,
+    announcedMonth,
+    announcedDay,
+    announcedYear,
+    announcedDateValues
+  } = useGetDestructuredDateValues({
+    date,
+    dateTime,
+    isDateTimeSelector
+  });
+  const {
+    hours,
+    minutes,
+    meridiem,
+    hoursNum,
+    minutesNum,
+    announcedHours,
+    announcedMinutes,
+    announcedMeridiem,
+    announcedTimeValues
+  } = useGetDestructuredTimeValues({
+    time,
+    dateTime,
+    isDateTimeSelector
+  });
+  return useMemo(() => ({
+    month,
+    day,
+    year,
+    monthNum,
+    dayNum,
+    yearNum,
+    announcedMonth,
+    announcedDay,
+    announcedYear,
+    announcedDateValues,
+    hours,
+    minutes,
+    meridiem,
+    hoursNum,
+    minutesNum,
+    announcedHours,
+    announcedMinutes,
+    announcedMeridiem,
+    announcedTimeValues
+  }), [
+    month,
+    day,
+    year,
+    monthNum,
+    dayNum,
+    yearNum,
+    announcedMonth,
+    announcedDay,
+    announcedYear,
+    announcedDateValues,
+    hours,
+    minutes,
+    meridiem,
+    hoursNum,
+    minutesNum,
+    announcedHours,
+    announcedMinutes,
+    announcedMeridiem,
+    announcedTimeValues
+  ]);
+};
+export {
+  useGetDestructuredDateValues,
+  useGetDestructuredTimeValues,
+  useGetDestructuredValues
+};
+//# sourceMappingURL=useGetDestructuredValues.js.map

package/dist/esm/controlled-date-time-picker/config/useGetDestructuredValues.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-date-time-picker/config/useGetDestructuredValues.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { useMemo } from 'react';\nimport {\n  dateTimeToTime,\n  deconstructTimeValues,\n  dateTimeToDate,\n  deconstructValuesFromDateString,\n  fillStringWithPlaceHolders,\n} from '../utils/stringHelpers';\nimport { convertToPositiveNumberIfPossible } from '../utils/numberHelpers';\nimport { monthNames, announcableCardinalDays } from '../utils/constants';\nimport type {\n  useGetDestructuredDateValuesAT,\n  useGetDestructuredDateValuesRT,\n  useGetDestructuredTimeValuesAT,\n  useGetDestructuredTimeValuesRT,\n  useGetDestructuredValuesAT,\n  useGetDestructuredValuesRT,\n} from '../index.d';\n\n// this is because it's fully controlled\n// our source of truth is either the date props or dateTime props\n// based on wheter it's a dateTime picker\n// or a date picker (it's date picker when hideTime is true)\nexport const useGetDestructuredDateValues = ({\n  date,\n  dateTime,\n  isDateTimeSelector,\n}: useGetDestructuredDateValuesAT): useGetDestructuredDateValuesRT => {\n  const dateStringFromProps = isDateTimeSelector ? dateTimeToDate(dateTime) : date;\n  const deconstructedValues = deconstructValuesFromDateString(dateStringFromProps);\n  const { month, day, year } = deconstructedValues;\n  const monthNum = convertToPositiveNumberIfPossible(month);\n  const dayNum = convertToPositiveNumberIfPossible(day);\n  const yearNum = convertToPositiveNumberIfPossible(year);\n  const announcedMonth = monthNum !== -1 ? monthNames[monthNum - 1] : 'empty month';\n  const announcedDay = dayNum !== -1 ? announcableCardinalDays[dayNum] : 'empty day';\n  const announcedYear = yearNum !== -1 ? fillStringWithPlaceHolders(`${yearNum}`, 4, '0') : 'empty year';\n  const announcedDateValues = `${announcedMonth}, ${announcedDay}, ${announcedYear}`;\n\n  return useMemo(\n    () => ({\n      month,\n      day,\n      year,\n      monthNum,\n      dayNum,\n      yearNum,\n      announcedMonth,\n      announcedDay,\n      announcedYear,\n      announcedDateValues,\n    }),\n    [announcedDay, announcedMonth, announcedYear, announcedDateValues, day, dayNum, month, monthNum, year, yearNum],\n  );\n};\n\n// this is because it's fully controlled\n// our source of truth is either the time props or dateTime props\n// based on wheter it's a dateTime picker\n// or a time picker (it's time picker when hideDate is true)\nexport const useGetDestructuredTimeValues = ({\n  time,\n  dateTime,\n  isDateTimeSelector,\n}: useGetDestructuredTimeValuesAT): useGetDestructuredTimeValuesRT => {\n  const timeStringFromProps = isDateTimeSelector ? dateTimeToTime(dateTime) : time;\n  const deconstructedValues = deconstructTimeValues(timeStringFromProps);\n  const { hours, minutes, meridiem } = deconstructedValues;\n  const hoursNum = convertToPositiveNumberIfPossible(hours);\n  const minutesNum = convertToPositiveNumberIfPossible(minutes);\n\n  // 01 -> 1 ~ 09 -> 9 || 1_ -> 1 ~ 9_ -> 9 || empty...\n  const announcedHours = hoursNum !== -1 ? `${hoursNum}` : 'empty hours';\n  // 01 -> 1 ~ 09 -> 9 || 1_ -> 1 ~ 9_ -> 9 || empty...\n  const announcedMinutes = minutesNum !== -1 ? `${minutesNum}` : 'empty minutes';\n  const announcedMeridiem =\n    // eslint-disable-next-line no-nested-ternary\n    meridiem === 'PM' ? `post meridiem` : meridiem === 'AM' ? 'ante meridiem' : 'empty meriediem';\n  const announcedTimeValues = `${announcedHours}, ${announcedMinutes}, ${announcedMeridiem}`;\n\n  return useMemo(\n    () => ({\n      hours,\n      minutes,\n      meridiem,\n      hoursNum,\n      minutesNum,\n      announcedHours,\n      announcedMinutes,\n      announcedMeridiem,\n      announcedTimeValues,\n    }),\n    [\n      hours,\n      minutes,\n      meridiem,\n      hoursNum,\n      minutesNum,\n      announcedHours,\n      announcedMinutes,\n      announcedMeridiem,\n      announcedTimeValues,\n    ],\n  );\n};\n\nexport const useGetDestructuredValues = ({\n  date,\n  time,\n  dateTime,\n  isDateTimeSelector,\n}: useGetDestructuredValuesAT): useGetDestructuredValuesRT => {\n  const {\n    month,\n    day,\n    year,\n    monthNum,\n    dayNum,\n    yearNum,\n    announcedMonth,\n    announcedDay,\n    announcedYear,\n    announcedDateValues,\n  } = useGetDestructuredDateValues({\n    date,\n    dateTime,\n    isDateTimeSelector,\n  });\n  const {\n    hours,\n    minutes,\n    meridiem,\n    hoursNum,\n    minutesNum,\n    announcedHours,\n    announcedMinutes,\n    announcedMeridiem,\n    announcedTimeValues,\n  } = useGetDestructuredTimeValues({\n    time,\n    dateTime,\n    isDateTimeSelector,\n  });\n\n  return useMemo(\n    () => ({\n      month,\n      day,\n      year,\n      monthNum,\n      dayNum,\n      yearNum,\n      announcedMonth,\n      announcedDay,\n      announcedYear,\n      announcedDateValues,\n      hours,\n      minutes,\n      meridiem,\n      hoursNum,\n      minutesNum,\n      announcedHours,\n      announcedMinutes,\n      announcedMeridiem,\n      announcedTimeValues,\n    }),\n    [\n      month,\n      day,\n      year,\n      monthNum,\n      dayNum,\n      yearNum,\n      announcedMonth,\n      announcedDay,\n      announcedYear,\n      announcedDateValues,\n      hours,\n      minutes,\n      meridiem,\n      hoursNum,\n      minutesNum,\n      announcedHours,\n      announcedMinutes,\n      announcedMeridiem,\n      announcedTimeValues,\n    ],\n  );\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/config/useGetPropsWithDefault.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { useMemoMergePropsWithDefault } from "@elliemae/ds-props-helpers";
+import { defaultProps } from "../ControlledDateTimePickerCTX";
+const useGetDatePickerWithDefaultsProps = (props) => useMemoMergePropsWithDefault(props, defaultProps);
+export {
+  useGetDatePickerWithDefaultsProps
+};
+//# sourceMappingURL=useGetPropsWithDefault.js.map

package/dist/esm/controlled-date-time-picker/config/useGetPropsWithDefault.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-date-time-picker/config/useGetPropsWithDefault.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { defaultProps } from '../ControlledDateTimePickerCTX';\nimport { PropsWithDefaultsT } from '../index.d';\n// we have to merge the \"default\" nested default values with what the user gives us...\nexport const useGetDatePickerWithDefaultsProps = (props: Partial<PropsWithDefaultsT>): PropsWithDefaultsT =>\n  useMemoMergePropsWithDefault(props, defaultProps);\n"],
+  "mappings": "AAAA;ACAA;AACA;AAGO,MAAM,oCAAoC,CAAC,UAChD,6BAA6B,OAAO;",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/config/useValidateProps.js

@@ -0,0 +1,128 @@
+import * as React from "react";
+import { CONTROLLED_DATE_TIME_PICKER_TYPES } from "../ControlledDateTimePickerTypes";
+import {
+  dateTimeToDate,
+  isValidDateString,
+  dateTimeToTime,
+  isValidTimeString,
+  deconstructValuesFromDateString
+} from "../utils/stringHelpers";
+import { convertToPositiveNumberIfPossible } from "../utils/numberHelpers";
+const PREPEND = `ControlledDateTimePicker:
+  Invalid configuration detected::
+  
+    `;
+const NOT_A_DEFECT = "";
+const INLINE_RECEIVED_PREPEND = `
+
+    Received:`;
+const throwInvalidDateTimeError = (invalidValue) => {
+  throw new Error(`${PREPEND}the "dateTime" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
+};
+const throwInvalidDaterror = (invalidValue) => {
+  throw new Error(`${PREPEND}the "date" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
+};
+const throwInvalidTimerror = (invalidValue) => {
+  throw new Error(`${PREPEND}the "time" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
+};
+const throwUncontrolledDateError = (date, onDateChange) => {
+  throw new Error(`${PREPEND}you are trying to use a date selector while providing a non-string "date" or providing a non-function to "onDateChange"
+  the full-controlled pattern must be used
+	check https://reactjs.org/docs/forms.html#controlled-components for more informations
+
+  Received:
+    ${date}(${typeof date})
+    ${onDateChange}(${typeof onDateChange})
+  ${NOT_A_DEFECT}`);
+};
+const throwUncontrolledTimeError = (time, onTimeChange) => {
+  throw new Error(`${PREPEND}you are trying to use a time selector while providing a non-string "time" or providing a non-function to "onTimeChange"
+  the full-controlled pattern must be used
+	check https://reactjs.org/docs/forms.html#controlled-components for more informations
+
+  Received:
+    ${time}(${typeof time})
+    ${onTimeChange}(${typeof onTimeChange})
+  ${NOT_A_DEFECT}`);
+};
+const throwUncontrolledDateTimeError = (dateTime, onDateTimeChange) => {
+  throw new Error(`${PREPEND}you are trying to use a date-time selector while providing a non-string "dateTime" or providing a non-function to "onDateTimeChange"
+  the full-controlled pattern must be used
+	check https://reactjs.org/docs/forms.html#controlled-components for more informations
+
+  Received:
+    ${dateTime}(${typeof dateTime})
+    ${onDateTimeChange}(${typeof onDateTimeChange})
+  ${NOT_A_DEFECT}`);
+};
+const throwInvalidEmptyPickerStartingMonthError = (emptyPickerStartingMonth) => {
+  throw new Error(`${PREPEND}the provided emptyPickerStartingMonth props is invalid. please provide a string with the format mm/__/yyyy, (mm 01~12, yyyy 0001~9999) 
+
+  Received:
+    ${emptyPickerStartingMonth}(${typeof emptyPickerStartingMonth})
+  ${NOT_A_DEFECT}`);
+};
+const throwInvalidOnCalendarOpenFocusedDayError = (onCalendarOpenFocusedDay) => {
+  throw new Error(`${PREPEND}the provided onCalendarOpenFocusedDay props is invalid. please provide a string with the format mm/dd/yyyy, (mm 01~12, dd 01~31, yyyy 0001~9999) 
+
+  Received:
+    ${onCalendarOpenFocusedDay}(${typeof onCalendarOpenFocusedDay})
+  ${NOT_A_DEFECT}`);
+};
+const useValidateProps = (props) => {
+  const {
+    type,
+    dateTime,
+    date,
+    time,
+    onDateChange,
+    onTimeChange,
+    onDateTimeChange,
+    emptyPickerStartingMonth,
+    onCalendarOpenFocusedDay
+  } = props;
+  const isDateSelector = type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE.FULL || type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE.INPUTS || type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE.PICKER;
+  const isTimeSelector = type === CONTROLLED_DATE_TIME_PICKER_TYPES.TIME.FULL || type === CONTROLLED_DATE_TIME_PICKER_TYPES.TIME.INPUTS || type === CONTROLLED_DATE_TIME_PICKER_TYPES.TIME.PICKER;
+  const isDateTimeSelector = type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.FULL || type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.INPUTS || type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.PICKER;
+  if (emptyPickerStartingMonth) {
+    const { month: stringMonthVal, year: stringYearVal } = deconstructValuesFromDateString(emptyPickerStartingMonth);
+    const monthNum = convertToPositiveNumberIfPossible(stringMonthVal);
+    const yearNum = convertToPositiveNumberIfPossible(stringYearVal);
+    if (monthNum <= 0 || monthNum >= 13 || yearNum <= 0 || yearNum > 9999)
+      throwInvalidEmptyPickerStartingMonthError(emptyPickerStartingMonth);
+  }
+  if (onCalendarOpenFocusedDay) {
+    const {
+      month: stringMonthVal,
+      day: stringDayVal,
+      year: stringYearVal
+    } = deconstructValuesFromDateString(onCalendarOpenFocusedDay);
+    const monthNum = convertToPositiveNumberIfPossible(stringMonthVal);
+    const dayNum = convertToPositiveNumberIfPossible(stringDayVal);
+    const yearNum = convertToPositiveNumberIfPossible(stringYearVal);
+    if (monthNum <= 0 || monthNum >= 13 || dayNum <= 0 || dayNum >= 31 || yearNum <= 0 || yearNum > 9999)
+      throwInvalidOnCalendarOpenFocusedDayError(onCalendarOpenFocusedDay);
+  }
+  if (isDateTimeSelector) {
+    if (typeof dateTime !== "string" || typeof onDateTimeChange !== "function")
+      throwUncontrolledDateTimeError(dateTime, onDateTimeChange);
+    else if (!isValidDateString(dateTimeToDate(dateTime)) || !isValidTimeString(dateTimeToTime(dateTime)))
+      throwInvalidDateTimeError(dateTimeToTime(dateTime));
+  }
+  if (isDateSelector) {
+    if (typeof date !== "string" || typeof onDateChange !== "function")
+      throwUncontrolledDateError(date, onDateChange);
+    else if (!isValidDateString(date))
+      throwInvalidDaterror(date);
+  }
+  if (isTimeSelector) {
+    if (typeof time !== "string" || typeof onTimeChange !== "function")
+      throwUncontrolledTimeError(time, onTimeChange);
+    else if (!isValidTimeString(time))
+      throwInvalidTimerror(time);
+  }
+};
+export {
+  useValidateProps
+};
+//# sourceMappingURL=useValidateProps.js.map

package/dist/esm/controlled-date-time-picker/config/useValidateProps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-date-time-picker/config/useValidateProps.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-len */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport { PropsWithDefaultsT } from '../index.d';\nimport { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../ControlledDateTimePickerTypes';\nimport {\n  dateTimeToDate,\n  isValidDateString,\n  dateTimeToTime,\n  isValidTimeString,\n  deconstructValuesFromDateString,\n} from '../utils/stringHelpers';\nimport { convertToPositiveNumberIfPossible } from '../utils/numberHelpers';\nconst PREPEND = `ControlledDateTimePicker:\n  Invalid configuration detected::\n  \n    `;\nconst NOT_A_DEFECT = '';\n// '\\n\\n\\t\\tThis is not a defect, please check\\n\\n\\t\\thttps://qa.dimsum.rd.elliemae.io/?path=/story/components-desktop-components-d-controlledform-date-time-picker--basic\\n\\n\\t\\tfor instructions on how to use the component correctly\\n\\n';\nconst INLINE_RECEIVED_PREPEND = `\n\n    Received:`;\nconst throwInvalidDateTimeError = (invalidValue) => {\n  throw new Error(\n    `${PREPEND}the \"dateTime\" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`,\n  );\n};\nconst throwInvalidDaterror = (invalidValue) => {\n  throw new Error(\n    `${PREPEND}the \"date\" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`,\n  );\n};\nconst throwInvalidTimerror = (invalidValue) => {\n  throw new Error(\n    `${PREPEND}the \"time\" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`,\n  );\n};\nconst throwUncontrolledDateError = (date, onDateChange) => {\n  throw new Error(\n    `${PREPEND}you are trying to use a date selector while providing a non-string \"date\" or providing a non-function to \"onDateChange\"\n  the full-controlled pattern must be used\\n\\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations\n\n  Received:\n    ${date}(${typeof date})\n    ${onDateChange}(${typeof onDateChange})\n  ${NOT_A_DEFECT}`,\n  );\n};\nconst throwUncontrolledTimeError = (time, onTimeChange) => {\n  throw new Error(\n    `${PREPEND}you are trying to use a time selector while providing a non-string \"time\" or providing a non-function to \"onTimeChange\"\n  the full-controlled pattern must be used\\n\\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations\n\n  Received:\n    ${time}(${typeof time})\n    ${onTimeChange}(${typeof onTimeChange})\n  ${NOT_A_DEFECT}`,\n  );\n};\n\nconst throwUncontrolledDateTimeError = (dateTime, onDateTimeChange) => {\n  throw new Error(\n    `${PREPEND}you are trying to use a date-time selector while providing a non-string \"dateTime\" or providing a non-function to \"onDateTimeChange\"\n  the full-controlled pattern must be used\\n\\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations\n\n  Received:\n    ${dateTime}(${typeof dateTime})\n    ${onDateTimeChange}(${typeof onDateTimeChange})\n  ${NOT_A_DEFECT}`,\n  );\n};\nconst throwInvalidEmptyPickerStartingMonthError = (emptyPickerStartingMonth) => {\n  throw new Error(\n    `${PREPEND}the provided emptyPickerStartingMonth props is invalid. please provide a string with the format mm/__/yyyy, (mm 01~12, yyyy 0001~9999) \n\n  Received:\n    ${emptyPickerStartingMonth}(${typeof emptyPickerStartingMonth})\n  ${NOT_A_DEFECT}`,\n  );\n};\nconst throwInvalidOnCalendarOpenFocusedDayError = (onCalendarOpenFocusedDay) => {\n  throw new Error(\n    `${PREPEND}the provided onCalendarOpenFocusedDay props is invalid. please provide a string with the format mm/dd/yyyy, (mm 01~12, dd 01~31, yyyy 0001~9999) \n\n  Received:\n    ${onCalendarOpenFocusedDay}(${typeof onCalendarOpenFocusedDay})\n  ${NOT_A_DEFECT}`,\n  );\n};\nexport const useValidateProps = (props: Partial<PropsWithDefaultsT>): void => {\n  const {\n    type,\n    dateTime,\n    date,\n    time,\n    onDateChange,\n    onTimeChange,\n    onDateTimeChange,\n    emptyPickerStartingMonth,\n    onCalendarOpenFocusedDay,\n  } = props;\n  const isDateSelector =\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE.FULL ||\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE.INPUTS ||\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE.PICKER;\n  const isTimeSelector =\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.TIME.FULL ||\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.TIME.INPUTS ||\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.TIME.PICKER;\n  const isDateTimeSelector =\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.FULL ||\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.INPUTS ||\n    type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.PICKER;\n  // validate generic use-cases\n  if (emptyPickerStartingMonth) {\n    const { month: stringMonthVal, year: stringYearVal } = deconstructValuesFromDateString(emptyPickerStartingMonth);\n    const monthNum = convertToPositiveNumberIfPossible(stringMonthVal);\n    const yearNum = convertToPositiveNumberIfPossible(stringYearVal);\n    if (monthNum <= 0 || monthNum >= 13 || yearNum <= 0 || yearNum > 9999)\n      throwInvalidEmptyPickerStartingMonthError(emptyPickerStartingMonth);\n  }\n  if (onCalendarOpenFocusedDay) {\n    const {\n      month: stringMonthVal,\n      day: stringDayVal,\n      year: stringYearVal,\n    } = deconstructValuesFromDateString(onCalendarOpenFocusedDay);\n    const monthNum = convertToPositiveNumberIfPossible(stringMonthVal);\n    const dayNum = convertToPositiveNumberIfPossible(stringDayVal);\n    const yearNum = convertToPositiveNumberIfPossible(stringYearVal);\n    if (monthNum <= 0 || monthNum >= 13 || dayNum <= 0 || dayNum >= 31 || yearNum <= 0 || yearNum > 9999)\n      throwInvalidOnCalendarOpenFocusedDayError(onCalendarOpenFocusedDay);\n  }\n\n  // validate full datetime cases\n  if (isDateTimeSelector) {\n    if (typeof dateTime !== 'string' || typeof onDateTimeChange !== 'function')\n      throwUncontrolledDateTimeError(dateTime, onDateTimeChange);\n    else if (!isValidDateString(dateTimeToDate(dateTime)) || !isValidTimeString(dateTimeToTime(dateTime)))\n      throwInvalidDateTimeError(dateTimeToTime(dateTime));\n  }\n\n  // validate date-only cases\n  if (isDateSelector) {\n    if (typeof date !== 'string' || typeof onDateChange !== 'function') throwUncontrolledDateError(date, onDateChange);\n    else if (!isValidDateString(date)) throwInvalidDaterror(date);\n  }\n\n  // validate time-only cases\n  if (isTimeSelector) {\n    if (typeof time !== 'string' || typeof onTimeChange !== 'function') throwUncontrolledTimeError(time, onTimeChange);\n    else if (!isValidTimeString(time)) throwInvalidTimerror(time);\n  }\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/index.d.js

@@ -0,0 +1,2 @@
+import * as React from "react";
+//# sourceMappingURL=index.d.js.map

package/dist/esm/controlled-date-time-picker/index.d.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n"],
+  "mappings": "AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/index.js

@@ -0,0 +1,28 @@
+import * as React from "react";
+import { DSControlledDateTimePickerWithSchema, DSControlledDateTimePicker } from "./ControlledDateTimePicker";
+import { ControlledDateTimePickerDatatestid } from "./ControlledDateTimePickerDatatestid";
+import { CONTROLLED_DATE_TIME_PICKER_TYPES } from "./ControlledDateTimePickerTypes";
+import { deconstructValuesFromDateString, prependStringWithPlaceHolders } from "./utils/stringHelpers";
+import { getValidationDateTimeStringMetaInfo } from "./utils/dateTimeHelpers";
+import {
+  getValidationDateStringMetaInfo,
+  getDateStringFromDay,
+  getDayFromDateString,
+  getDateValuesFromDate
+} from "./utils/dateHelpers";
+import { getValidationTimeStringMetaInfo } from "./utils/timeHelpers";
+export {
+  CONTROLLED_DATE_TIME_PICKER_TYPES,
+  ControlledDateTimePickerDatatestid,
+  DSControlledDateTimePicker,
+  DSControlledDateTimePickerWithSchema,
+  deconstructValuesFromDateString,
+  getDateStringFromDay,
+  getDateValuesFromDate,
+  getDayFromDateString,
+  getValidationDateStringMetaInfo,
+  getValidationDateTimeStringMetaInfo,
+  getValidationTimeStringMetaInfo,
+  prependStringWithPlaceHolders
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/controlled-date-time-picker/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/controlled-date-time-picker/index.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { DSControlledDateTimePickerWithSchema, DSControlledDateTimePicker } from './ControlledDateTimePicker';\nexport { ControlledDateTimePickerDatatestid } from './ControlledDateTimePickerDatatestid';\nexport { CONTROLLED_DATE_TIME_PICKER_TYPES } from './ControlledDateTimePickerTypes';\nexport { deconstructValuesFromDateString, prependStringWithPlaceHolders } from './utils/stringHelpers';\nexport { getValidationDateTimeStringMetaInfo } from './utils/dateTimeHelpers';\nexport {\n  getValidationDateStringMetaInfo,\n  getDateStringFromDay,\n  getDayFromDateString,\n  getDateValuesFromDate,\n} from './utils/dateHelpers';\nexport { getValidationTimeStringMetaInfo } from './utils/timeHelpers';\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/parts/ClearButton/ClearButton.js

@@ -0,0 +1,29 @@
+import * as React from "react";
+import React2 from "react";
+import { CloseMedium } from "@elliemae/ds-icons";
+import { DSIconColors } from "@elliemae/ds-icon";
+import { BUTTON_VARIANT, BUTTON_SIZES } from "@elliemae/ds-button";
+import { StyledClearButton } from "../Styleds";
+import { ControlledDateTimePickerDatatestid } from "../../ControlledDateTimePickerDatatestid";
+import { useClearButton } from "./useClearButton";
+const ClearButton = () => {
+  const { onClearClick, onClearButtonKeyDown, clearButtonRef, withAnyPicker, withClearBtn } = useClearButton();
+  return /* @__PURE__ */ React2.createElement(StyledClearButton, {
+    shouldDisplay: withClearBtn,
+    "aria-label": "clear selected date",
+    buttonType: "icon",
+    size: BUTTON_SIZES.M,
+    variant: BUTTON_VARIANT.DEFAULT,
+    "data-testid": ControlledDateTimePickerDatatestid.CLEAR_BUTTON,
+    innerRef: clearButtonRef,
+    onClick: onClearClick,
+    onKeyDown: onClearButtonKeyDown,
+    withAnyPicker
+  }, /* @__PURE__ */ React2.createElement(CloseMedium, {
+    color: DSIconColors.PRIMARY
+  }));
+};
+export {
+  ClearButton
+};
+//# sourceMappingURL=ClearButton.js.map

package/dist/esm/controlled-date-time-picker/parts/ClearButton/ClearButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-date-time-picker/parts/ClearButton/ClearButton.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { CloseMedium } from '@elliemae/ds-icons';\nimport { DSIconColors } from '@elliemae/ds-icon';\nimport { BUTTON_VARIANT, BUTTON_SIZES } from '@elliemae/ds-button';\nimport { StyledClearButton } from '../Styleds';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid';\nimport { useClearButton } from './useClearButton';\n\nexport const ClearButton = (): JSX.Element => {\n  const { onClearClick, onClearButtonKeyDown, clearButtonRef, withAnyPicker, withClearBtn } = useClearButton();\n  return (\n    <StyledClearButton\n      shouldDisplay={withClearBtn}\n      aria-label=\"clear selected date\"\n      buttonType=\"icon\"\n      size={BUTTON_SIZES.M}\n      variant={BUTTON_VARIANT.DEFAULT}\n      data-testid={ControlledDateTimePickerDatatestid.CLEAR_BUTTON}\n      innerRef={clearButtonRef}\n      onClick={onClearClick}\n      onKeyDown={onClearButtonKeyDown}\n      withAnyPicker={withAnyPicker}\n    >\n      <CloseMedium color={DSIconColors.PRIMARY} />\n    </StyledClearButton>\n  );\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEO,MAAM,cAAc,MAAmB;AAC5C,QAAM,EAAE,cAAc,sBAAsB,gBAAgB,eAAe,iBAAiB;AAC5F,SACE,qCAAC,mBAAD;AAAA,IACE,eAAe;AAAA,IACf,cAAW;AAAA,IACX,YAAW;AAAA,IACX,MAAM,aAAa;AAAA,IACnB,SAAS,eAAe;AAAA,IACxB,eAAa,mCAAmC;AAAA,IAChD,UAAU;AAAA,IACV,SAAS;AAAA,IACT,WAAW;AAAA,IACX;AAAA,KAEA,qCAAC,aAAD;AAAA,IAAa,OAAO,aAAa;AAAA;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/parts/ClearButton/useClearButton.js

@@ -0,0 +1,64 @@
+import * as React from "react";
+import { useCallback, useMemo, useContext } from "react";
+import { ControlledDateTimePickerContext } from "../../ControlledDateTimePickerCTX";
+const useClearButton = () => {
+  const {
+    handleClearAll,
+    clearButtonRef,
+    withAnyPicker,
+    withClearBtn,
+    withAnyInputs,
+    isWithTimeInputs,
+    isWithDateInputs,
+    isTimeSelector,
+    hourInputRef,
+    monthInputRef,
+    pickerButtonRef,
+    meridiemInputRef,
+    yearInputRef,
+    setLatestInteractionRegion
+  } = useContext(ControlledDateTimePickerContext);
+  const focusFirstRegion = useCallback(() => {
+    if (withAnyInputs)
+      if (isTimeSelector)
+        hourInputRef?.current?.focus?.();
+      else
+        monthInputRef?.current?.focus?.();
+  }, [withAnyInputs, isTimeSelector, hourInputRef, monthInputRef]);
+  const onClearClick = useCallback((e) => {
+    handleClearAll(e);
+    setLatestInteractionRegion("clear-btn");
+    focusFirstRegion();
+  }, [focusFirstRegion, handleClearAll, setLatestInteractionRegion]);
+  const onHomeKeyDown = useCallback(() => {
+    focusFirstRegion();
+  }, [focusFirstRegion]);
+  const onEndKeyDown = useCallback(() => {
+    if (withAnyPicker)
+      pickerButtonRef?.current?.focus?.();
+  }, [withAnyPicker, pickerButtonRef]);
+  const onClearButtonKeyDown = useCallback((e) => {
+    const { key } = e;
+    const preventDefaultKeys = ["Home", "End"];
+    const stopPropagationKeys = ["Home", "End"];
+    if (preventDefaultKeys.includes(key))
+      e.preventDefault();
+    if (stopPropagationKeys.includes(key))
+      e.stopPropagation();
+    if (key === "Home")
+      onHomeKeyDown();
+    if (key === "End")
+      onEndKeyDown();
+    if (key === "Backspace" && withAnyInputs) {
+      if (isWithTimeInputs)
+        meridiemInputRef?.current?.focus?.();
+      else if (isWithDateInputs)
+        yearInputRef?.current?.focus?.();
+    }
+  }, [isWithDateInputs, isWithTimeInputs, meridiemInputRef, onEndKeyDown, onHomeKeyDown, withAnyInputs, yearInputRef]);
+  return useMemo(() => ({ onClearClick, onClearButtonKeyDown, clearButtonRef, withAnyPicker, withClearBtn }), [onClearClick, onClearButtonKeyDown, clearButtonRef, withAnyPicker, withClearBtn]);
+};
+export {
+  useClearButton
+};
+//# sourceMappingURL=useClearButton.js.map

package/dist/esm/controlled-date-time-picker/parts/ClearButton/useClearButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-date-time-picker/parts/ClearButton/useClearButton.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport { useCallback, useMemo, useContext } from 'react';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX';\nimport type { onClearClickT, onKeyDownT } from '../../index.d';\n\ninterface useOnClearClickRT {\n  onClearClick: onClearClickT;\n  onClearButtonKeyDown: onKeyDownT<HTMLButtonElement>;\n  clearButtonRef: React.MutableRefObject<HTMLButtonElement>;\n  withAnyPicker: boolean;\n  withClearBtn: boolean;\n}\nexport const useClearButton = (): useOnClearClickRT => {\n  const {\n    handleClearAll,\n    clearButtonRef,\n    withAnyPicker,\n    withClearBtn,\n    withAnyInputs,\n    isWithTimeInputs,\n    isWithDateInputs,\n    isTimeSelector,\n    hourInputRef,\n    monthInputRef,\n    pickerButtonRef,\n    meridiemInputRef,\n    yearInputRef,\n    setLatestInteractionRegion,\n  } = useContext(ControlledDateTimePickerContext);\n\n  const focusFirstRegion = useCallback(() => {\n    if (withAnyInputs)\n      if (isTimeSelector) hourInputRef?.current?.focus?.();\n      else monthInputRef?.current?.focus?.();\n  }, [withAnyInputs, isTimeSelector, hourInputRef, monthInputRef]);\n\n  const onClearClick = useCallback(\n    (e) => {\n      handleClearAll(e);\n      setLatestInteractionRegion('clear-btn');\n      focusFirstRegion();\n    },\n    [focusFirstRegion, handleClearAll, setLatestInteractionRegion],\n  );\n  const onHomeKeyDown = useCallback(() => {\n    focusFirstRegion();\n  }, [focusFirstRegion]);\n  const onEndKeyDown = useCallback(() => {\n    if (withAnyPicker) pickerButtonRef?.current?.focus?.();\n  }, [withAnyPicker, pickerButtonRef]);\n\n  const onClearButtonKeyDown = useCallback(\n    (e) => {\n      const { key } = e;\n      const preventDefaultKeys = ['Home', 'End'];\n      const stopPropagationKeys = ['Home', 'End'];\n      if (preventDefaultKeys.includes(key)) e.preventDefault();\n      if (stopPropagationKeys.includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'Backspace' && withAnyInputs) {\n        if (isWithTimeInputs) meridiemInputRef?.current?.focus?.();\n        else if (isWithDateInputs) yearInputRef?.current?.focus?.();\n      }\n    },\n    [isWithDateInputs, isWithTimeInputs, meridiemInputRef, onEndKeyDown, onHomeKeyDown, withAnyInputs, yearInputRef],\n  );\n\n  return useMemo(\n    () => ({ onClearClick, onClearButtonKeyDown, clearButtonRef, withAnyPicker, withClearBtn }),\n    [onClearClick, onClearButtonKeyDown, clearButtonRef, withAnyPicker, withClearBtn],\n  );\n};\n"],
+  "mappings": "AAAA;ACEA;AACA;AAUO,MAAM,iBAAiB,MAAyB;AACrD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,WAAW;AAEf,QAAM,mBAAmB,YAAY,MAAM;AACzC,QAAI;AACF,UAAI;AAAgB,sBAAc,SAAS;AAAA;AACtC,uBAAe,SAAS;AAAA,KAC9B,CAAC,eAAe,gBAAgB,cAAc;AAEjD,QAAM,eAAe,YACnB,CAAC,MAAM;AACL,mBAAe;AACf,+BAA2B;AAC3B;AAAA,KAEF,CAAC,kBAAkB,gBAAgB;AAErC,QAAM,gBAAgB,YAAY,MAAM;AACtC;AAAA,KACC,CAAC;AACJ,QAAM,eAAe,YAAY,MAAM;AACrC,QAAI;AAAe,uBAAiB,SAAS;AAAA,KAC5C,CAAC,eAAe;AAEnB,QAAM,uBAAuB,YAC3B,CAAC,MAAM;AACL,UAAM,EAAE,QAAQ;AAChB,UAAM,qBAAqB,CAAC,QAAQ;AACpC,UAAM,sBAAsB,CAAC,QAAQ;AACrC,QAAI,mBAAmB,SAAS;AAAM,QAAE;AACxC,QAAI,oBAAoB,SAAS;AAAM,QAAE;AACzC,QAAI,QAAQ;AAAQ;AACpB,QAAI,QAAQ;AAAO;AACnB,QAAI,QAAQ,eAAe,eAAe;AACxC,UAAI;AAAkB,0BAAkB,SAAS;AAAA,eACxC;AAAkB,sBAAc,SAAS;AAAA;AAAA,KAGtD,CAAC,kBAAkB,kBAAkB,kBAAkB,cAAc,eAAe,eAAe;AAGrG,SAAO,QACL,MAAO,GAAE,cAAc,sBAAsB,gBAAgB,eAAe,iBAC5E,CAAC,cAAc,sBAAsB,gBAAgB,eAAe;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/parts/ControlledDateTimePickerContent.js

@@ -0,0 +1,59 @@
+import * as React from "react";
+import React2 from "react";
+import { Grid } from "@elliemae/ds-grid";
+import { ControlledDateTimePickerContext } from "../ControlledDateTimePickerCTX";
+import { StyledInputsWrapperGrid } from "./Styleds";
+import { DateInputs } from "./DateInputs/DateInputs";
+import { TimeInputs } from "./TimeInputs/TimeInputs";
+import { PickersIcons } from "./Pickers/PickersIcons";
+import { ClearButton } from "./ClearButton/ClearButton";
+const ControlledDateTimePickerContent = () => {
+  const {
+    hideDate,
+    hideDatePicker,
+    hideTime,
+    hideTimePicker,
+    hideDateTimePicker,
+    setLatestInteractionRegion,
+    withAnyPicker,
+    withAnyRightController,
+    shouldPreserveClearableSpace,
+    isControllerOnly,
+    props: { hasError, dataAttrs, disabled },
+    onGlobalKeyDown
+  } = React2.useContext(ControlledDateTimePickerContext);
+  const resetLatestInteraction = React2.useCallback(() => {
+    setLatestInteractionRegion("");
+  }, [setLatestInteractionRegion]);
+  const mainCols = [];
+  if (!hideDate)
+    mainCols.push("auto");
+  if (!hideTime)
+    mainCols.push("auto");
+  if (withAnyRightController)
+    mainCols.push("auto");
+  const rightControlCols = [];
+  if (shouldPreserveClearableSpace)
+    rightControlCols.push("28px");
+  if (withAnyPicker)
+    rightControlCols.push("auto");
+  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(StyledInputsWrapperGrid, {
+    cols: mainCols,
+    gutter: "xxs",
+    pr: hideDatePicker && hideTimePicker && hideDateTimePicker ? "2px" : null,
+    justPicker: hideDate && hideTime,
+    withAnyPicker,
+    onBlur: resetLatestInteraction,
+    onKeyDown: onGlobalKeyDown,
+    hasError,
+    isControllerOnly,
+    disabled,
+    ...dataAttrs
+  }, hideDate ? null : /* @__PURE__ */ React2.createElement(DateInputs, null), hideTime ? null : /* @__PURE__ */ React2.createElement(TimeInputs, null), withAnyRightController ? /* @__PURE__ */ React2.createElement(Grid, {
+    cols: rightControlCols
+  }, shouldPreserveClearableSpace ? /* @__PURE__ */ React2.createElement(ClearButton, null) : null, withAnyPicker ? /* @__PURE__ */ React2.createElement(PickersIcons, null) : null) : null));
+};
+export {
+  ControlledDateTimePickerContent
+};
+//# sourceMappingURL=ControlledDateTimePickerContent.js.map

package/dist/esm/controlled-date-time-picker/parts/ControlledDateTimePickerContent.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/controlled-date-time-picker/parts/ControlledDateTimePickerContent.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ControlledDateTimePickerContext } from '../ControlledDateTimePickerCTX';\nimport { StyledInputsWrapperGrid } from './Styleds';\nimport { DateInputs } from './DateInputs/DateInputs';\nimport { TimeInputs } from './TimeInputs/TimeInputs';\nimport { PickersIcons } from './Pickers/PickersIcons';\nimport { ClearButton } from './ClearButton/ClearButton';\n\nexport const ControlledDateTimePickerContent = (): JSX.Element => {\n  const {\n    hideDate,\n    hideDatePicker,\n    hideTime,\n    hideTimePicker,\n    hideDateTimePicker,\n    setLatestInteractionRegion,\n    withAnyPicker,\n    withAnyRightController,\n    shouldPreserveClearableSpace,\n    isControllerOnly,\n    props: { hasError, dataAttrs, disabled },\n    onGlobalKeyDown,\n  } = React.useContext(ControlledDateTimePickerContext);\n\n  const resetLatestInteraction = React.useCallback(() => {\n    setLatestInteractionRegion('');\n  }, [setLatestInteractionRegion]);\n\n  const mainCols = [];\n  if (!hideDate) mainCols.push('auto');\n  if (!hideTime) mainCols.push('auto');\n  if (withAnyRightController) mainCols.push('auto');\n\n  const rightControlCols = [];\n  if (shouldPreserveClearableSpace) rightControlCols.push('28px');\n  if (withAnyPicker) rightControlCols.push('auto');\n\n  return (\n    <>\n      {/* The <div> element is catching the component-wise global hotkeys, there is no valid aria role for this */}\n      {/* eslint-disable-next-line max-len */}\n      {/* https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-static-element-interactions.md#case-the-event-handler-is-only-being-used-to-capture-bubbled-events */}\n      {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n      <StyledInputsWrapperGrid\n        cols={mainCols}\n        gutter=\"xxs\"\n        pr={hideDatePicker && hideTimePicker && hideDateTimePicker ? '2px' : null}\n        justPicker={hideDate && hideTime}\n        withAnyPicker={withAnyPicker}\n        onBlur={resetLatestInteraction}\n        onKeyDown={onGlobalKeyDown}\n        hasError={hasError}\n        isControllerOnly={isControllerOnly}\n        disabled={disabled}\n        {...dataAttrs}\n      >\n        {hideDate ? null : <DateInputs />}\n        {hideTime ? null : <TimeInputs />}\n        {withAnyRightController ? (\n          <Grid cols={rightControlCols}>\n            {shouldPreserveClearableSpace ? <ClearButton /> : null}\n            {withAnyPicker ? <PickersIcons /> : null}\n          </Grid>\n        ) : null}\n      </StyledInputsWrapperGrid>\n    </>\n  );\n};\n"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEO,MAAM,kCAAkC,MAAmB;AAChE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,WAAW;AAAA,IAC9B;AAAA,MACE,OAAM,WAAW;AAErB,QAAM,yBAAyB,OAAM,YAAY,MAAM;AACrD,+BAA2B;AAAA,KAC1B,CAAC;AAEJ,QAAM,WAAW;AACjB,MAAI,CAAC;AAAU,aAAS,KAAK;AAC7B,MAAI,CAAC;AAAU,aAAS,KAAK;AAC7B,MAAI;AAAwB,aAAS,KAAK;AAE1C,QAAM,mBAAmB;AACzB,MAAI;AAA8B,qBAAiB,KAAK;AACxD,MAAI;AAAe,qBAAiB,KAAK;AAEzC,SACE,4DAKE,qCAAC,yBAAD;AAAA,IACE,MAAM;AAAA,IACN,QAAO;AAAA,IACP,IAAI,kBAAkB,kBAAkB,qBAAqB,QAAQ;AAAA,IACrE,YAAY,YAAY;AAAA,IACxB;AAAA,IACA,QAAQ;AAAA,IACR,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,OACI;AAAA,KAEH,WAAW,OAAO,qCAAC,YAAD,OAClB,WAAW,OAAO,qCAAC,YAAD,OAClB,yBACC,qCAAC,MAAD;AAAA,IAAM,MAAM;AAAA,KACT,+BAA+B,qCAAC,aAAD,QAAkB,MACjD,gBAAgB,qCAAC,cAAD,QAAmB,QAEpC;AAAA;",
+  "names": []
+}

package/dist/esm/controlled-date-time-picker/parts/DateInputs/DDInput.js

@@ -0,0 +1,47 @@
+import * as React from "react";
+import React2, { useCallback } from "react";
+import { ControlledDateTimePickerDatatestid } from "../../ControlledDateTimePickerDatatestid";
+import { Styled2DigitsInput } from "../Styleds";
+const regExpNumbers = /^[0-9]+$/;
+const isInvalidDay = (day) => {
+  if (day === "")
+    return false;
+  const numberOnly = regExpNumbers.test(day);
+  return day.length > 2 || day === "00" || !numberOnly || Number.parseInt(day, 10) > 31;
+};
+const DDInput = React2.memo(({
+  onChange,
+  onBlur,
+  onFocus,
+  onKeyDown,
+  value,
+  disabled,
+  contextRef,
+  placeholder,
+  ariaCurrentValueForInputs
+}) => {
+  const validateOnChange = useCallback((e) => {
+    if (isInvalidDay(e?.target?.value)) {
+      e.preventDefault();
+      return;
+    }
+    onChange(e);
+  }, [onChange]);
+  return /* @__PURE__ */ React2.createElement(Styled2DigitsInput, {
+    onChange: validateOnChange,
+    onBlur,
+    onFocus,
+    onKeyDown,
+    value,
+    ref: contextRef,
+    placeholder,
+    "aria-label": `day input field, ${ariaCurrentValueForInputs}`,
+    "data-testid": ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY,
+    disabled,
+    "aria-disabled": disabled
+  });
+});
+export {
+  DDInput
+};
+//# sourceMappingURL=DDInput.js.map