@coveord/plasma-mantine 56.1.5 → 56.1.6

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 +1 @@
1
- {"version":3,"file":"EditableDateTimeRangePicker.d.ts","sourceRoot":"","sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAE,eAAe,EAAE,eAAe,EAAiB,MAAM,gBAAgB,CAAC;AAGjG,MAAM,WAAW,gCAAgC;IAC7C,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC;IAC/C,QAAQ,CAAC,CAAC,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;IAChE;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;IAC9E;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;CAC/E;AAED,eAAO,MAAM,2BAA2B,GAAI,4CAKzC,gCAAgC,4CA8BlC,CAAC"}
1
+ {"version":3,"file":"EditableDateTimeRangePicker.d.ts","sourceRoot":"","sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAE,eAAe,EAAE,eAAe,EAAiB,MAAM,gBAAgB,CAAC;AAGjG,MAAM,WAAW,gCAAgC;IAC7C,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC;IAC/C,QAAQ,CAAC,CAAC,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;IAChE;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;IAC9E;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;CAC/E;AAED,eAAO,MAAM,2BAA2B,GAAI,4CAKzC,gCAAgC,4CAoClC,CAAC"}
@@ -36,7 +36,12 @@ var EditableDateTimeRangePicker = function(param) {
36
36
  value: value === null || value === void 0 ? void 0 : value[0],
37
37
  onChange: onStartDateChange,
38
38
  w: 150,
39
- styles: _object_spread._({}, startProps.styles)
39
+ styles: _object_spread._({}, startProps.styles),
40
+ timePickerProps: {
41
+ popoverProps: {
42
+ withinPortal: false
43
+ }
44
+ }
40
45
  }),
41
46
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_dates.DateTimePicker, {
42
47
  clearable: false,
@@ -50,7 +55,12 @@ var EditableDateTimeRangePicker = function(param) {
50
55
  ]);
51
56
  },
52
57
  w: 150,
53
- styles: _object_spread._({}, endProps.styles)
58
+ styles: _object_spread._({}, endProps.styles),
59
+ timePickerProps: {
60
+ popoverProps: {
61
+ withinPortal: false
62
+ }
63
+ }
54
64
  })
55
65
  ]
56
66
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"sourcesContent":["import {DatePickerProps, DatesRangeValue, DateStringValue, DateTimePicker} from '@mantine/dates';\nimport dayjs from 'dayjs';\n\nexport interface EditableDateTimeRangePickerProps {\n value: DatesRangeValue<DateStringValue | null>;\n onChange?(value: DatesRangeValue<DateStringValue | null>): void;\n /**\n * Props for the start input\n */\n startProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n /**\n * Props for the end input\n */\n endProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n}\n\nexport const EditableDateTimeRangePicker = ({\n value,\n onChange,\n startProps = {},\n endProps = {},\n}: EditableDateTimeRangePickerProps) => {\n const onStartDateChange = (startDate: string) => {\n if (value?.[1] && dayjs(startDate) > dayjs(value[1])) {\n onChange?.([startDate, null]);\n } else {\n onChange?.([startDate, value?.[1]]);\n }\n };\n\n return (\n <>\n <DateTimePicker\n clearable={false}\n label=\"Start\"\n value={value?.[0]}\n onChange={onStartDateChange}\n w={150}\n styles={{...startProps.styles}}\n />\n <DateTimePicker\n clearable={false}\n label=\"End\"\n value={value?.[1]}\n minDate={value?.[0]}\n onChange={(endDate) => onChange?.([value?.[0], endDate])}\n w={150}\n styles={{...endProps.styles}}\n />\n </>\n );\n};\n"],"names":["EditableDateTimeRangePicker","value","onChange","startProps","endProps","onStartDateChange","startDate","dayjs","DateTimePicker","clearable","label","w","styles","minDate","endDate"],"mappings":";;;;+BAgBaA;;;eAAAA;;;;;;qBAhBmE;8DAC9D;AAeX,IAAMA,8BAA8B;QACvCC,cAAAA,OACAC,iBAAAA,oCACAC,YAAAA,4CAAa,CAAC,+CACdC,UAAAA,wCAAW,CAAC;IAEZ,IAAMC,oBAAoB,SAACC;QACvB,IAAIL,CAAAA,kBAAAA,4BAAAA,KAAO,CAAC,EAAE,KAAIM,IAAAA,cAAK,EAACD,aAAaC,IAAAA,cAAK,EAACN,KAAK,CAAC,EAAE,GAAG;YAClDC,qBAAAA,+BAAAA,SAAW;gBAACI;gBAAW;aAAK;QAChC,OAAO;YACHJ,qBAAAA,+BAAAA,SAAW;gBAACI;gBAAWL,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;aAAC;QACtC;IACJ;IAEA,qBACI;;0BACI,qBAACO,qBAAc;gBACXC,WAAW;gBACXC,OAAM;gBACNT,KAAK,EAAEA,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;gBACjBC,UAAUG;gBACVM,GAAG;gBACHC,QAAQ,qBAAIT,WAAWS,MAAM;;0BAEjC,qBAACJ,qBAAc;gBACXC,WAAW;gBACXC,OAAM;gBACNT,KAAK,EAAEA,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;gBACjBY,OAAO,EAAEZ,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;gBACnBC,UAAU,SAACY;2BAAYZ,qBAAAA,+BAAAA,SAAW;wBAACD,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;wBAAEa;qBAAQ;;gBACvDH,GAAG;gBACHC,QAAQ,qBAAIR,SAASQ,MAAM;;;;AAI3C"}
1
+ {"version":3,"sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"sourcesContent":["import {DatePickerProps, DatesRangeValue, DateStringValue, DateTimePicker} from '@mantine/dates';\nimport dayjs from 'dayjs';\n\nexport interface EditableDateTimeRangePickerProps {\n value: DatesRangeValue<DateStringValue | null>;\n onChange?(value: DatesRangeValue<DateStringValue | null>): void;\n /**\n * Props for the start input\n */\n startProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n /**\n * Props for the end input\n */\n endProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n}\n\nexport const EditableDateTimeRangePicker = ({\n value,\n onChange,\n startProps = {},\n endProps = {},\n}: EditableDateTimeRangePickerProps) => {\n const onStartDateChange = (startDate: string) => {\n if (value?.[1] && dayjs(startDate) > dayjs(value[1])) {\n onChange?.([startDate, null]);\n } else {\n onChange?.([startDate, value?.[1]]);\n }\n };\n\n return (\n <>\n <DateTimePicker\n clearable={false}\n label=\"Start\"\n value={value?.[0]}\n onChange={onStartDateChange}\n w={150}\n styles={{...startProps.styles}}\n timePickerProps={{\n popoverProps: {withinPortal: false},\n }}\n />\n <DateTimePicker\n clearable={false}\n label=\"End\"\n value={value?.[1]}\n minDate={value?.[0]}\n onChange={(endDate) => onChange?.([value?.[0], endDate])}\n w={150}\n styles={{...endProps.styles}}\n timePickerProps={{\n popoverProps: {withinPortal: false},\n }}\n />\n </>\n );\n};\n"],"names":["EditableDateTimeRangePicker","value","onChange","startProps","endProps","onStartDateChange","startDate","dayjs","DateTimePicker","clearable","label","w","styles","timePickerProps","popoverProps","withinPortal","minDate","endDate"],"mappings":";;;;+BAgBaA;;;eAAAA;;;;;;qBAhBmE;8DAC9D;AAeX,IAAMA,8BAA8B;QACvCC,cAAAA,OACAC,iBAAAA,oCACAC,YAAAA,4CAAa,CAAC,+CACdC,UAAAA,wCAAW,CAAC;IAEZ,IAAMC,oBAAoB,SAACC;QACvB,IAAIL,CAAAA,kBAAAA,4BAAAA,KAAO,CAAC,EAAE,KAAIM,IAAAA,cAAK,EAACD,aAAaC,IAAAA,cAAK,EAACN,KAAK,CAAC,EAAE,GAAG;YAClDC,qBAAAA,+BAAAA,SAAW;gBAACI;gBAAW;aAAK;QAChC,OAAO;YACHJ,qBAAAA,+BAAAA,SAAW;gBAACI;gBAAWL,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;aAAC;QACtC;IACJ;IAEA,qBACI;;0BACI,qBAACO,qBAAc;gBACXC,WAAW;gBACXC,OAAM;gBACNT,KAAK,EAAEA,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;gBACjBC,UAAUG;gBACVM,GAAG;gBACHC,QAAQ,qBAAIT,WAAWS,MAAM;gBAC7BC,iBAAiB;oBACbC,cAAc;wBAACC,cAAc;oBAAK;gBACtC;;0BAEJ,qBAACP,qBAAc;gBACXC,WAAW;gBACXC,OAAM;gBACNT,KAAK,EAAEA,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;gBACjBe,OAAO,EAAEf,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;gBACnBC,UAAU,SAACe;2BAAYf,qBAAAA,+BAAAA,SAAW;wBAACD,kBAAAA,4BAAAA,KAAO,CAAC,EAAE;wBAAEgB;qBAAQ;;gBACvDN,GAAG;gBACHC,QAAQ,qBAAIR,SAASQ,MAAM;gBAC3BC,iBAAiB;oBACbC,cAAc;wBAACC,cAAc;oBAAK;gBACtC;;;;AAIhB"}
@@ -1 +1 @@
1
- {"version":3,"file":"EditableDateTimeRangePicker.d.ts","sourceRoot":"","sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAE,eAAe,EAAE,eAAe,EAAiB,MAAM,gBAAgB,CAAC;AAGjG,MAAM,WAAW,gCAAgC;IAC7C,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC;IAC/C,QAAQ,CAAC,CAAC,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;IAChE;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;IAC9E;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;CAC/E;AAED,eAAO,MAAM,2BAA2B,GAAI,4CAKzC,gCAAgC,4CA8BlC,CAAC"}
1
+ {"version":3,"file":"EditableDateTimeRangePicker.d.ts","sourceRoot":"","sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAE,eAAe,EAAE,eAAe,EAAiB,MAAM,gBAAgB,CAAC;AAGjG,MAAM,WAAW,gCAAgC;IAC7C,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC;IAC/C,QAAQ,CAAC,CAAC,KAAK,EAAE,eAAe,CAAC,eAAe,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;IAChE;;OAEG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;IAC9E;;OAEG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC;CAC/E;AAED,eAAO,MAAM,2BAA2B,GAAI,4CAKzC,gCAAgC,4CAoClC,CAAC"}
@@ -25,6 +25,11 @@ export const EditableDateTimeRangePicker = ({ value, onChange, startProps = {},
25
25
  w: 150,
26
26
  styles: {
27
27
  ...startProps.styles
28
+ },
29
+ timePickerProps: {
30
+ popoverProps: {
31
+ withinPortal: false
32
+ }
28
33
  }
29
34
  }),
30
35
  /*#__PURE__*/ _jsx(DateTimePicker, {
@@ -39,6 +44,11 @@ export const EditableDateTimeRangePicker = ({ value, onChange, startProps = {},
39
44
  w: 150,
40
45
  styles: {
41
46
  ...endProps.styles
47
+ },
48
+ timePickerProps: {
49
+ popoverProps: {
50
+ withinPortal: false
51
+ }
42
52
  }
43
53
  })
44
54
  ]
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"sourcesContent":["import {DatePickerProps, DatesRangeValue, DateStringValue, DateTimePicker} from '@mantine/dates';\nimport dayjs from 'dayjs';\n\nexport interface EditableDateTimeRangePickerProps {\n value: DatesRangeValue<DateStringValue | null>;\n onChange?(value: DatesRangeValue<DateStringValue | null>): void;\n /**\n * Props for the start input\n */\n startProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n /**\n * Props for the end input\n */\n endProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n}\n\nexport const EditableDateTimeRangePicker = ({\n value,\n onChange,\n startProps = {},\n endProps = {},\n}: EditableDateTimeRangePickerProps) => {\n const onStartDateChange = (startDate: string) => {\n if (value?.[1] && dayjs(startDate) > dayjs(value[1])) {\n onChange?.([startDate, null]);\n } else {\n onChange?.([startDate, value?.[1]]);\n }\n };\n\n return (\n <>\n <DateTimePicker\n clearable={false}\n label=\"Start\"\n value={value?.[0]}\n onChange={onStartDateChange}\n w={150}\n styles={{...startProps.styles}}\n />\n <DateTimePicker\n clearable={false}\n label=\"End\"\n value={value?.[1]}\n minDate={value?.[0]}\n onChange={(endDate) => onChange?.([value?.[0], endDate])}\n w={150}\n styles={{...endProps.styles}}\n />\n </>\n );\n};\n"],"names":["DateTimePicker","dayjs","EditableDateTimeRangePicker","value","onChange","startProps","endProps","onStartDateChange","startDate","clearable","label","w","styles","minDate","endDate"],"mappings":";AAAA,SAA2DA,cAAc,QAAO,iBAAiB;AACjG,OAAOC,WAAW,QAAQ;AAe1B,OAAO,MAAMC,8BAA8B,CAAC,EACxCC,KAAK,EACLC,QAAQ,EACRC,aAAa,CAAC,CAAC,EACfC,WAAW,CAAC,CAAC,EACkB;IAC/B,MAAMC,oBAAoB,CAACC;QACvB,IAAIL,OAAO,CAAC,EAAE,IAAIF,MAAMO,aAAaP,MAAME,KAAK,CAAC,EAAE,GAAG;YAClDC,WAAW;gBAACI;gBAAW;aAAK;QAChC,OAAO;YACHJ,WAAW;gBAACI;gBAAWL,OAAO,CAAC,EAAE;aAAC;QACtC;IACJ;IAEA,qBACI;;0BACI,KAACH;gBACGS,WAAW;gBACXC,OAAM;gBACNP,OAAOA,OAAO,CAAC,EAAE;gBACjBC,UAAUG;gBACVI,GAAG;gBACHC,QAAQ;oBAAC,GAAGP,WAAWO,MAAM;gBAAA;;0BAEjC,KAACZ;gBACGS,WAAW;gBACXC,OAAM;gBACNP,OAAOA,OAAO,CAAC,EAAE;gBACjBU,SAASV,OAAO,CAAC,EAAE;gBACnBC,UAAU,CAACU,UAAYV,WAAW;wBAACD,OAAO,CAAC,EAAE;wBAAEW;qBAAQ;gBACvDH,GAAG;gBACHC,QAAQ;oBAAC,GAAGN,SAASM,MAAM;gBAAA;;;;AAI3C,EAAE"}
1
+ {"version":3,"sources":["../../../../src/components/date-time-range-picker/EditableDateTimeRangePicker.tsx"],"sourcesContent":["import {DatePickerProps, DatesRangeValue, DateStringValue, DateTimePicker} from '@mantine/dates';\nimport dayjs from 'dayjs';\n\nexport interface EditableDateTimeRangePickerProps {\n value: DatesRangeValue<DateStringValue | null>;\n onChange?(value: DatesRangeValue<DateStringValue | null>): void;\n /**\n * Props for the start input\n */\n startProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n /**\n * Props for the end input\n */\n endProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n}\n\nexport const EditableDateTimeRangePicker = ({\n value,\n onChange,\n startProps = {},\n endProps = {},\n}: EditableDateTimeRangePickerProps) => {\n const onStartDateChange = (startDate: string) => {\n if (value?.[1] && dayjs(startDate) > dayjs(value[1])) {\n onChange?.([startDate, null]);\n } else {\n onChange?.([startDate, value?.[1]]);\n }\n };\n\n return (\n <>\n <DateTimePicker\n clearable={false}\n label=\"Start\"\n value={value?.[0]}\n onChange={onStartDateChange}\n w={150}\n styles={{...startProps.styles}}\n timePickerProps={{\n popoverProps: {withinPortal: false},\n }}\n />\n <DateTimePicker\n clearable={false}\n label=\"End\"\n value={value?.[1]}\n minDate={value?.[0]}\n onChange={(endDate) => onChange?.([value?.[0], endDate])}\n w={150}\n styles={{...endProps.styles}}\n timePickerProps={{\n popoverProps: {withinPortal: false},\n }}\n />\n </>\n );\n};\n"],"names":["DateTimePicker","dayjs","EditableDateTimeRangePicker","value","onChange","startProps","endProps","onStartDateChange","startDate","clearable","label","w","styles","timePickerProps","popoverProps","withinPortal","minDate","endDate"],"mappings":";AAAA,SAA2DA,cAAc,QAAO,iBAAiB;AACjG,OAAOC,WAAW,QAAQ;AAe1B,OAAO,MAAMC,8BAA8B,CAAC,EACxCC,KAAK,EACLC,QAAQ,EACRC,aAAa,CAAC,CAAC,EACfC,WAAW,CAAC,CAAC,EACkB;IAC/B,MAAMC,oBAAoB,CAACC;QACvB,IAAIL,OAAO,CAAC,EAAE,IAAIF,MAAMO,aAAaP,MAAME,KAAK,CAAC,EAAE,GAAG;YAClDC,WAAW;gBAACI;gBAAW;aAAK;QAChC,OAAO;YACHJ,WAAW;gBAACI;gBAAWL,OAAO,CAAC,EAAE;aAAC;QACtC;IACJ;IAEA,qBACI;;0BACI,KAACH;gBACGS,WAAW;gBACXC,OAAM;gBACNP,OAAOA,OAAO,CAAC,EAAE;gBACjBC,UAAUG;gBACVI,GAAG;gBACHC,QAAQ;oBAAC,GAAGP,WAAWO,MAAM;gBAAA;gBAC7BC,iBAAiB;oBACbC,cAAc;wBAACC,cAAc;oBAAK;gBACtC;;0BAEJ,KAACf;gBACGS,WAAW;gBACXC,OAAM;gBACNP,OAAOA,OAAO,CAAC,EAAE;gBACjBa,SAASb,OAAO,CAAC,EAAE;gBACnBC,UAAU,CAACa,UAAYb,WAAW;wBAACD,OAAO,CAAC,EAAE;wBAAEc;qBAAQ;gBACvDN,GAAG;gBACHC,QAAQ;oBAAC,GAAGN,SAASM,MAAM;gBAAA;gBAC3BC,iBAAiB;oBACbC,cAAc;wBAACC,cAAc;oBAAK;gBACtC;;;;AAIhB,EAAE"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@coveord/plasma-mantine",
3
- "version": "56.1.5",
3
+ "version": "56.1.6",
4
4
  "description": "A Plasma flavoured Mantine theme",
5
5
  "keywords": [
6
6
  "plasma",
@@ -37,6 +37,9 @@ export const EditableDateTimeRangePicker = ({
37
37
  onChange={onStartDateChange}
38
38
  w={150}
39
39
  styles={{...startProps.styles}}
40
+ timePickerProps={{
41
+ popoverProps: {withinPortal: false},
42
+ }}
40
43
  />
41
44
  <DateTimePicker
42
45
  clearable={false}
@@ -46,6 +49,9 @@ export const EditableDateTimeRangePicker = ({
46
49
  onChange={(endDate) => onChange?.([value?.[0], endDate])}
47
50
  w={150}
48
51
  styles={{...endProps.styles}}
52
+ timePickerProps={{
53
+ popoverProps: {withinPortal: false},
54
+ }}
49
55
  />
50
56
  </>
51
57
  );
@@ -1,5 +1,5 @@
1
1
  import {useForm} from '@mantine/form';
2
- import {render, screen, userEvent} from '@test-utils';
2
+ import {render, screen, userEvent, waitFor} from '@test-utils';
3
3
 
4
4
  import {DatesRangeValue, DateStringValue} from '@mantine/dates';
5
5
  import {DateTimeRangePicker} from '../DateTimeRangePicker.js';
@@ -42,4 +42,42 @@ describe('DateTimeRangePicker', () => {
42
42
 
43
43
  expect(screen.getByTestId('json')).toHaveTextContent('["2000-01-01T00:00:00.000Z","2000-12-31T23:59:59.000Z"]');
44
44
  });
45
+
46
+ it('can change the date and time', async () => {
47
+ const user = userEvent.setup();
48
+ const Fixture = () => {
49
+ const form = useForm<{dates: DatesRangeValue<DateStringValue | null>}>({
50
+ initialValues: {dates: [null, null]},
51
+ });
52
+ return (
53
+ <>
54
+ <DateTimeRangePicker
55
+ presets={{
56
+ year2k: {
57
+ label: 'Year 2K',
58
+ range: [new Date(2000, 0, 1, 0, 0, 0).toISOString(), null],
59
+ },
60
+ }}
61
+ {...form.getInputProps('dates')}
62
+ />
63
+ <code data-testid="json">{JSON.stringify(form.values.dates)}</code>
64
+ </>
65
+ );
66
+ };
67
+ render(<Fixture />);
68
+
69
+ await user.click(screen.getByRole('textbox', {name: 'Date range'}));
70
+ await user.click(screen.getByRole('option', {name: 'Year 2K'}));
71
+
72
+ await user.click(screen.getByRole('button', {name: /start/i}));
73
+ await waitFor(() => expect(screen.getByRole('dialog')).toBeVisible());
74
+
75
+ await user.click(screen.getAllByRole('button', {name: /15/i})[0]);
76
+ await user.click(screen.getAllByRole('spinbutton')[0]);
77
+ await user.click(screen.getAllByRole('button', {name: '01'})[0]);
78
+ await user.click(screen.getAllByRole('button', {name: '02'})[1]);
79
+ await user.click(screen.getByRole('button', {name: 'AM'}));
80
+
81
+ expect(screen.getByTestId('json')).toHaveTextContent('["2000-01-15 01:02:00",null]');
82
+ });
45
83
  });