@elliemae/ds-form-date-time-picker 3.53.0-beta.0 → 3.53.0-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/config/useValidateProps.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSControlledDateTimePickerT } from '../react-desc-prop-types.js';\nimport {\n dateTimeToDate,\n isValidDateString,\n dateTimeToTime,\n isValidTimeString,\n deconstructValuesFromDateString,\n} from '../utils/stringHelpers.js';\nimport { convertToPositiveNumberIfPossible } from '../utils/numberHelpers.js';\nimport { getIsDateTime, getIsDate, getIsTime } from '../utils/typeGuards.js';\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: string) => {\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: string) => {\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: string) => {\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: string, onDateChange: unknown) => {\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: ${date}(${typeof date})\n onDateChange: (${typeof onDateChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwUncontrolledTimeError = (time: string, onTimeChange: unknown) => {\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: ${time}(${typeof time})\n onTimeChange: (${typeof onTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\n\nconst throwUncontrolledDateTimeError = (dateTime: string, onDateTimeChange: unknown) => {\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: ${dateTime}(${typeof dateTime})\n onDateTimeChange: (${typeof onDateTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwInvalidEmptyPickerStartingMonthError = (emptyPickerStartingMonth: string) => {\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: string) => {\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: DSControlledDateTimePickerT.Props): void => {\n // validate date-related props\n if (getIsDateTime(props) || getIsDate(props)) {\n const { emptyPickerStartingMonth, onCalendarOpenFocusedDay } = props;\n\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 (getIsDateTime(props)) {\n const { dateTime, onDateTimeChange } = props;\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 (getIsDate(props)) {\n const { date, onDateChange } = props;\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\n if (getIsTime(props)) {\n const { time, onTimeChange } = props;\n if (typeof time !== 'string' || typeof onTimeChange !== 'function') throwUncontrolledTimeError(time, onTimeChange);\n else if (!isValidTimeString(time)) throwInvalidTimerror(time);\n }\n};\n", "import * as React from 'react';\nexport { React };\n"],
4
+ "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSControlledDateTimePickerT } from '../react-desc-prop-types.js';\nimport {\n dateTimeToDate,\n isValidDateString,\n dateTimeToTime,\n isValidTimeString,\n deconstructValuesFromDateString,\n} from '../utils/stringHelpers.js';\nimport { convertToPositiveNumberIfPossible } from '../utils/numberHelpers.js';\nimport { getIsDateTime, getIsDate, getIsTime } from '../utils/typeGuards.js';\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.d1.ice.com/?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: string) => {\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: string) => {\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: string) => {\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: string, onDateChange: unknown) => {\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: ${date}(${typeof date})\n onDateChange: (${typeof onDateChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwUncontrolledTimeError = (time: string, onTimeChange: unknown) => {\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: ${time}(${typeof time})\n onTimeChange: (${typeof onTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\n\nconst throwUncontrolledDateTimeError = (dateTime: string, onDateTimeChange: unknown) => {\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: ${dateTime}(${typeof dateTime})\n onDateTimeChange: (${typeof onDateTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwInvalidEmptyPickerStartingMonthError = (emptyPickerStartingMonth: string) => {\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: string) => {\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: DSControlledDateTimePickerT.Props): void => {\n // validate date-related props\n if (getIsDateTime(props) || getIsDate(props)) {\n const { emptyPickerStartingMonth, onCalendarOpenFocusedDay } = props;\n\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 (getIsDateTime(props)) {\n const { dateTime, onDateTimeChange } = props;\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 (getIsDate(props)) {\n const { date, onDateChange } = props;\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\n if (getIsTime(props)) {\n const { time, onTimeChange } = props;\n if (typeof time !== 'string' || typeof onTimeChange !== 'function') throwUncontrolledTimeError(time, onTimeChange);\n else if (!isValidTimeString(time)) throwInvalidTimerror(time);\n }\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
5
  "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -55,7 +55,9 @@ const StyledCalendarWithTimeWheelWrapper = (0, import_ds_system.styled)("div", {
55
55
  display: grid;
56
56
  grid-template-columns: 260px 192px;
57
57
  grid-template-rows: 1fr;
58
- column-gap: 0;
58
+ // this gap and background color simulate the border separator between the calendar and time wheel
59
+ column-gap: 1px;
60
+ background-color: ${({ theme }) => theme.colors.neutral["200"]};
59
61
  `;
60
62
  const StyledCalendar = (0, import_ds_system.styled)(import_CalendarContent.CalendarContent)`
61
63
  box-shadow: none;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/Pickers/CalendarWithTimeWheel/Styleds.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { CalendarContent } from '../Calendar/CalendarContent.js';\nimport {\n DSControlledDateTimePickerName,\n DSControlledDateTimePickerSlots,\n} from '../../../ControlledDateTimePickerDefinitions.js';\n\nexport const StyledIconTriggerButton = styled(DSButtonV2, {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.PICKER_ICONS.CALENDAR_TIMEWHEEL,\n})`\n color: ${({ theme }) => theme.colors.brand['800']};\n width: 2rem;\n height: 2rem;\n`;\n\nexport const StyledCalendarWithTimeWheelWrapper = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.CONTROLLER_COMPONENT.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n background: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n display: grid;\n grid-template-columns: 260px 192px;\n grid-template-rows: 1fr;\n column-gap: 0;\n`;\n\nexport const StyledCalendar = styled(CalendarContent)`\n box-shadow: none;\n`;\n\nexport const CalendarWithTimeWheelFooterMessage = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.FOOTERS.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n border-top: solid 1px ${({ theme }) => theme.colors.neutral[300]};\n padding: ${({ theme }) => theme.space.xxs2};\n color: ${({ theme }) => theme.colors.danger[900]};\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n grid-column: 1/3;\n background-color: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,0BAA2B;AAC3B,6BAAgC;AAChC,iDAGO;AAEA,MAAM,8BAA0B,yBAAO,gCAAY;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,2EAAgC,aAAa;AACrD,CAAC;AAAA,WACU,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA;AAAA;AAAA;AAK5C,MAAM,yCAAqC,yBAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,2EAAgC,qBAAqB;AAC7D,CAAC;AAAA,gBACe,CAAC,EAAE,OAAO,eAAe,MACrC,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOvE,MAAM,qBAAiB,yBAAO,sCAAe;AAAA;AAAA;AAI7C,MAAM,yCAAqC,yBAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,2EAAgC,QAAQ;AAChD,CAAC;AAAA,0BACyB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,aACrD,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,WACjC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,OAAO,GAAG,CAAC;AAAA,eACnC,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,UAAU,GAAG,CAAC;AAAA;AAAA;AAAA,sBAGtC,CAAC,EAAE,OAAO,eAAe,MAC3C,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;",
4
+ "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { CalendarContent } from '../Calendar/CalendarContent.js';\nimport {\n DSControlledDateTimePickerName,\n DSControlledDateTimePickerSlots,\n} from '../../../ControlledDateTimePickerDefinitions.js';\n\nexport const StyledIconTriggerButton = styled(DSButtonV2, {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.PICKER_ICONS.CALENDAR_TIMEWHEEL,\n})`\n color: ${({ theme }) => theme.colors.brand['800']};\n width: 2rem;\n height: 2rem;\n`;\n\nexport const StyledCalendarWithTimeWheelWrapper = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.CONTROLLER_COMPONENT.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n background: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n display: grid;\n grid-template-columns: 260px 192px;\n grid-template-rows: 1fr;\n // this gap and background color simulate the border separator between the calendar and time wheel\n column-gap: 1px;\n background-color: ${({ theme }) => theme.colors.neutral['200']};\n`;\n\nexport const StyledCalendar = styled(CalendarContent)`\n box-shadow: none;\n`;\n\nexport const CalendarWithTimeWheelFooterMessage = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.FOOTERS.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n border-top: solid 1px ${({ theme }) => theme.colors.neutral[300]};\n padding: ${({ theme }) => theme.space.xxs2};\n color: ${({ theme }) => theme.colors.danger[900]};\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n grid-column: 1/3;\n background-color: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,0BAA2B;AAC3B,6BAAgC;AAChC,iDAGO;AAEA,MAAM,8BAA0B,yBAAO,gCAAY;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,2EAAgC,aAAa;AACrD,CAAC;AAAA,WACU,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA;AAAA;AAAA;AAK5C,MAAM,yCAAqC,yBAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,2EAAgC,qBAAqB;AAC7D,CAAC;AAAA,gBACe,CAAC,EAAE,OAAO,eAAe,MACrC,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAMxD,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAGzD,MAAM,qBAAiB,yBAAO,sCAAe;AAAA;AAAA;AAI7C,MAAM,yCAAqC,yBAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,2EAAgC,QAAQ;AAChD,CAAC;AAAA,0BACyB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,aACrD,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,WACjC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,OAAO,GAAG,CAAC;AAAA,eACnC,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,UAAU,GAAG,CAAC;AAAA;AAAA;AAAA,sBAGtC,CAAC,EAAE,OAAO,eAAe,MAC3C,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useValidateProps.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSControlledDateTimePickerT } from '../react-desc-prop-types.js';\nimport {\n dateTimeToDate,\n isValidDateString,\n dateTimeToTime,\n isValidTimeString,\n deconstructValuesFromDateString,\n} from '../utils/stringHelpers.js';\nimport { convertToPositiveNumberIfPossible } from '../utils/numberHelpers.js';\nimport { getIsDateTime, getIsDate, getIsTime } from '../utils/typeGuards.js';\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: string) => {\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: string) => {\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: string) => {\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: string, onDateChange: unknown) => {\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: ${date}(${typeof date})\n onDateChange: (${typeof onDateChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwUncontrolledTimeError = (time: string, onTimeChange: unknown) => {\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: ${time}(${typeof time})\n onTimeChange: (${typeof onTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\n\nconst throwUncontrolledDateTimeError = (dateTime: string, onDateTimeChange: unknown) => {\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: ${dateTime}(${typeof dateTime})\n onDateTimeChange: (${typeof onDateTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwInvalidEmptyPickerStartingMonthError = (emptyPickerStartingMonth: string) => {\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: string) => {\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: DSControlledDateTimePickerT.Props): void => {\n // validate date-related props\n if (getIsDateTime(props) || getIsDate(props)) {\n const { emptyPickerStartingMonth, onCalendarOpenFocusedDay } = props;\n\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 (getIsDateTime(props)) {\n const { dateTime, onDateTimeChange } = props;\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 (getIsDate(props)) {\n const { date, onDateChange } = props;\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\n if (getIsTime(props)) {\n const { time, onTimeChange } = props;\n if (typeof time !== 'string' || typeof onTimeChange !== 'function') throwUncontrolledTimeError(time, onTimeChange);\n else if (!isValidTimeString(time)) throwInvalidTimerror(time);\n }\n};\n"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSControlledDateTimePickerT } from '../react-desc-prop-types.js';\nimport {\n dateTimeToDate,\n isValidDateString,\n dateTimeToTime,\n isValidTimeString,\n deconstructValuesFromDateString,\n} from '../utils/stringHelpers.js';\nimport { convertToPositiveNumberIfPossible } from '../utils/numberHelpers.js';\nimport { getIsDateTime, getIsDate, getIsTime } from '../utils/typeGuards.js';\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.d1.ice.com/?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: string) => {\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: string) => {\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: string) => {\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: string, onDateChange: unknown) => {\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: ${date}(${typeof date})\n onDateChange: (${typeof onDateChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwUncontrolledTimeError = (time: string, onTimeChange: unknown) => {\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: ${time}(${typeof time})\n onTimeChange: (${typeof onTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\n\nconst throwUncontrolledDateTimeError = (dateTime: string, onDateTimeChange: unknown) => {\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: ${dateTime}(${typeof dateTime})\n onDateTimeChange: (${typeof onDateTimeChange})\n ${NOT_A_DEFECT}`,\n );\n};\nconst throwInvalidEmptyPickerStartingMonthError = (emptyPickerStartingMonth: string) => {\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: string) => {\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: DSControlledDateTimePickerT.Props): void => {\n // validate date-related props\n if (getIsDateTime(props) || getIsDate(props)) {\n const { emptyPickerStartingMonth, onCalendarOpenFocusedDay } = props;\n\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 (getIsDateTime(props)) {\n const { dateTime, onDateTimeChange } = props;\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 (getIsDate(props)) {\n const { date, onDateChange } = props;\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\n if (getIsTime(props)) {\n const { time, onTimeChange } = props;\n if (typeof time !== 'string' || typeof onTimeChange !== 'function') throwUncontrolledTimeError(time, onTimeChange);\n else if (!isValidTimeString(time)) throwInvalidTimerror(time);\n }\n};\n"],
5
5
  "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -22,7 +22,9 @@ const StyledCalendarWithTimeWheelWrapper = styled("div", {
22
22
  display: grid;
23
23
  grid-template-columns: 260px 192px;
24
24
  grid-template-rows: 1fr;
25
- column-gap: 0;
25
+ // this gap and background color simulate the border separator between the calendar and time wheel
26
+ column-gap: 1px;
27
+ background-color: ${({ theme }) => theme.colors.neutral["200"]};
26
28
  `;
27
29
  const StyledCalendar = styled(CalendarContent)`
28
30
  box-shadow: none;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Pickers/CalendarWithTimeWheel/Styleds.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { CalendarContent } from '../Calendar/CalendarContent.js';\nimport {\n DSControlledDateTimePickerName,\n DSControlledDateTimePickerSlots,\n} from '../../../ControlledDateTimePickerDefinitions.js';\n\nexport const StyledIconTriggerButton = styled(DSButtonV2, {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.PICKER_ICONS.CALENDAR_TIMEWHEEL,\n})`\n color: ${({ theme }) => theme.colors.brand['800']};\n width: 2rem;\n height: 2rem;\n`;\n\nexport const StyledCalendarWithTimeWheelWrapper = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.CONTROLLER_COMPONENT.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n background: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n display: grid;\n grid-template-columns: 260px 192px;\n grid-template-rows: 1fr;\n column-gap: 0;\n`;\n\nexport const StyledCalendar = styled(CalendarContent)`\n box-shadow: none;\n`;\n\nexport const CalendarWithTimeWheelFooterMessage = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.FOOTERS.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n border-top: solid 1px ${({ theme }) => theme.colors.neutral[300]};\n padding: ${({ theme }) => theme.space.xxs2};\n color: ${({ theme }) => theme.colors.danger[900]};\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n grid-column: 1/3;\n background-color: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n`;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAEA,MAAM,0BAA0B,OAAO,YAAY;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,gCAAgC,aAAa;AACrD,CAAC;AAAA,WACU,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA;AAAA;AAAA;AAK5C,MAAM,qCAAqC,OAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,gCAAgC,qBAAqB;AAC7D,CAAC;AAAA,gBACe,CAAC,EAAE,OAAO,eAAe,MACrC,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOvE,MAAM,iBAAiB,OAAO,eAAe;AAAA;AAAA;AAI7C,MAAM,qCAAqC,OAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,gCAAgC,QAAQ;AAChD,CAAC;AAAA,0BACyB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,aACrD,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,WACjC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,OAAO,GAAG,CAAC;AAAA,eACnC,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,UAAU,GAAG,CAAC;AAAA;AAAA;AAAA,sBAGtC,CAAC,EAAE,OAAO,eAAe,MAC3C,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { CalendarContent } from '../Calendar/CalendarContent.js';\nimport {\n DSControlledDateTimePickerName,\n DSControlledDateTimePickerSlots,\n} from '../../../ControlledDateTimePickerDefinitions.js';\n\nexport const StyledIconTriggerButton = styled(DSButtonV2, {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.PICKER_ICONS.CALENDAR_TIMEWHEEL,\n})`\n color: ${({ theme }) => theme.colors.brand['800']};\n width: 2rem;\n height: 2rem;\n`;\n\nexport const StyledCalendarWithTimeWheelWrapper = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.CONTROLLER_COMPONENT.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n background: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n display: grid;\n grid-template-columns: 260px 192px;\n grid-template-rows: 1fr;\n // this gap and background color simulate the border separator between the calendar and time wheel\n column-gap: 1px;\n background-color: ${({ theme }) => theme.colors.neutral['200']};\n`;\n\nexport const StyledCalendar = styled(CalendarContent)`\n box-shadow: none;\n`;\n\nexport const CalendarWithTimeWheelFooterMessage = styled('div', {\n name: DSControlledDateTimePickerName,\n slot: DSControlledDateTimePickerSlots.FOOTERS.CALENDAR_TIMEWHEEL,\n})<{ readOnlyStyles?: boolean }>`\n border-top: solid 1px ${({ theme }) => theme.colors.neutral[300]};\n padding: ${({ theme }) => theme.space.xxs2};\n color: ${({ theme }) => theme.colors.danger[900]};\n font-size: ${({ theme }) => theme.fontSizes.microText[200]};\n text-align: right;\n grid-column: 1/3;\n background-color: ${({ theme, readOnlyStyles }) =>\n readOnlyStyles ? theme.colors.neutral['050'] : theme.colors.neutral['000']};\n`;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAEA,MAAM,0BAA0B,OAAO,YAAY;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,gCAAgC,aAAa;AACrD,CAAC;AAAA,WACU,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA;AAAA;AAAA;AAK5C,MAAM,qCAAqC,OAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,gCAAgC,qBAAqB;AAC7D,CAAC;AAAA,gBACe,CAAC,EAAE,OAAO,eAAe,MACrC,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAMxD,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAGzD,MAAM,iBAAiB,OAAO,eAAe;AAAA;AAAA;AAI7C,MAAM,qCAAqC,OAAO,OAAO;AAAA,EAC9D,MAAM;AAAA,EACN,MAAM,gCAAgC,QAAQ;AAChD,CAAC;AAAA,0BACyB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,aACrD,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,WACjC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,OAAO,GAAG,CAAC;AAAA,eACnC,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,UAAU,GAAG,CAAC;AAAA;AAAA;AAAA,sBAGtC,CAAC,EAAE,OAAO,eAAe,MAC3C,iBAAiB,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-form-date-time-picker",
3
- "version": "3.53.0-beta.0",
3
+ "version": "3.53.0-beta.4",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Controlled Form Date Time Picker",
6
6
  "files": [
@@ -36,25 +36,25 @@
36
36
  "indent": 4
37
37
  },
38
38
  "dependencies": {
39
- "@elliemae/ds-accessibility": "3.53.0-beta.0",
40
- "@elliemae/ds-button-v2": "3.53.0-beta.0",
41
- "@elliemae/ds-grid": "3.53.0-beta.0",
42
- "@elliemae/ds-popperjs": "3.53.0-beta.0",
43
- "@elliemae/ds-icons": "3.53.0-beta.0",
44
- "@elliemae/ds-props-helpers": "3.53.0-beta.0",
45
- "@elliemae/ds-system": "3.53.0-beta.0",
46
- "@elliemae/ds-typescript-helpers": "3.53.0-beta.0"
39
+ "@elliemae/ds-accessibility": "3.53.0-beta.4",
40
+ "@elliemae/ds-grid": "3.53.0-beta.4",
41
+ "@elliemae/ds-icons": "3.53.0-beta.4",
42
+ "@elliemae/ds-popperjs": "3.53.0-beta.4",
43
+ "@elliemae/ds-button-v2": "3.53.0-beta.4",
44
+ "@elliemae/ds-props-helpers": "3.53.0-beta.4",
45
+ "@elliemae/ds-system": "3.53.0-beta.4",
46
+ "@elliemae/ds-typescript-helpers": "3.53.0-beta.4"
47
47
  },
48
48
  "devDependencies": {
49
49
  "@elliemae/pui-cli": "9.0.0-next.63",
50
- "@elliemae/pui-theme": "~2.12.0",
50
+ "@elliemae/pui-theme": "~2.13.0",
51
51
  "jest": "~29.7.0",
52
52
  "styled-components": "~5.3.9",
53
53
  "styled-system": "^5.1.5",
54
- "@elliemae/ds-monorepo-devops": "3.53.0-beta.0"
54
+ "@elliemae/ds-monorepo-devops": "3.53.0-beta.4"
55
55
  },
56
56
  "peerDependencies": {
57
- "@elliemae/pui-theme": "~2.12.0",
57
+ "@elliemae/pui-theme": "~2.13.0",
58
58
  "react": "^18.3.1",
59
59
  "react-dom": "^18.3.1",
60
60
  "styled-components": "~5.3.9",