@thx/controls 16.3.0 → 17.0.0-mantine.0

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.
Files changed (159) hide show
  1. package/dist/esm/date/LocalDatePicker/LocalDatePicker.js +11 -54
  2. package/dist/esm/date/LocalDatePicker/LocalDatePicker.js.map +1 -1
  3. package/dist/esm/date/LocalMonthSelect/LocalMonthSelect.js +19 -23
  4. package/dist/esm/date/LocalMonthSelect/LocalMonthSelect.js.map +1 -1
  5. package/dist/esm/date/LocalTimePicker/LocalTimePicker.js +6 -55
  6. package/dist/esm/date/LocalTimePicker/LocalTimePicker.js.map +1 -1
  7. package/dist/esm/date/MonthDayPicker/MonthDayPicker.js +13 -69
  8. package/dist/esm/date/MonthDayPicker/MonthDayPicker.js.map +1 -1
  9. package/dist/esm/date/MonthYearPicker/MonthYearPicker.js +14 -57
  10. package/dist/esm/date/MonthYearPicker/MonthYearPicker.js.map +1 -1
  11. package/dist/esm/date/YearSelect/YearSelect.js +25 -39
  12. package/dist/esm/date/YearSelect/YearSelect.js.map +1 -1
  13. package/dist/esm/form/TForm/useTForm.js +12 -8
  14. package/dist/esm/form/TForm/useTForm.js.map +1 -1
  15. package/dist/esm/form/TMForm/TMForm.js +55 -0
  16. package/dist/esm/form/TMForm/TMForm.js.map +1 -0
  17. package/dist/esm/form/TMForm/errorMessages.js +39 -0
  18. package/dist/esm/form/TMForm/errorMessages.js.map +1 -0
  19. package/dist/esm/form/TMForm/graphqlErrorTypes.js +6 -0
  20. package/dist/esm/form/TMForm/graphqlErrorTypes.js.map +1 -0
  21. package/dist/esm/index.js +1 -23
  22. package/dist/esm/index.js.map +1 -1
  23. package/dist/esm/inputs/MaskedInput/MaskedInput.js +5 -8
  24. package/dist/esm/inputs/MaskedInput/MaskedInput.js.map +1 -1
  25. package/dist/esm/inputs/MaskedInput/useMaskedInput.js +2 -3
  26. package/dist/esm/inputs/MaskedInput/useMaskedInput.js.map +1 -1
  27. package/dist/esm/inputs/PhoneInput/PhoneInput.js.map +1 -1
  28. package/dist/stats.html +1 -1
  29. package/dist/stats.txt +26 -86
  30. package/dist/types/commonTypes.d.ts +1 -0
  31. package/dist/types/date/LocalDatePicker/LocalDatePicker.d.ts +5 -7
  32. package/dist/types/date/LocalDatePicker/localdatepicker.stories.d.ts +6 -0
  33. package/dist/types/date/LocalMonthSelect/LocalMonthSelect.d.ts +2 -3
  34. package/dist/types/date/LocalMonthSelect/localmonthselect.stories.d.ts +5 -0
  35. package/dist/types/date/LocalTimePicker/LocalTimePicker.d.ts +2 -6
  36. package/dist/types/date/LocalTimePicker/localtimepicker.stories.d.ts +5 -0
  37. package/dist/types/date/MonthDayPicker/MonthDayPicker.d.ts +7 -6
  38. package/dist/types/date/MonthDayPicker/monthdaypicker.stories.d.ts +5 -0
  39. package/dist/types/date/MonthYearPicker/MonthYearPicker.d.ts +10 -11
  40. package/dist/types/date/MonthYearPicker/monthyearpicker.stories.d.ts +6 -0
  41. package/dist/types/date/YearSelect/YearSelect.d.ts +1 -3
  42. package/dist/types/date/YearSelect/yearselect.stories.d.ts +7 -0
  43. package/dist/types/form/TForm/tform.stories.d.ts +19 -0
  44. package/dist/types/form/TForm/types.d.ts +32 -0
  45. package/dist/types/form/TMForm/TMForm.d.ts +8 -0
  46. package/dist/types/form/TMForm/errorMessages.d.ts +5 -0
  47. package/dist/types/form/TMForm/graphqlErrorTypes.d.ts +50 -0
  48. package/dist/types/form/TMForm/tmform.stories.d.ts +12 -0
  49. package/dist/types/index.d.ts +2 -19
  50. package/dist/types/inputs/CreditCardInput/CreditCardInput.d.ts +3 -2
  51. package/dist/types/inputs/CreditCardInput/CreditCardNumberInput.d.ts +2 -2
  52. package/dist/types/inputs/CreditCardInput/creditcardinput.stories.d.ts +5 -0
  53. package/dist/types/inputs/CreditCardInput/creditcardnumberinput.stories.d.ts +5 -0
  54. package/dist/types/inputs/MaskedInput/MaskedInput.d.ts +2 -3
  55. package/dist/types/inputs/MaskedInput/maskedinput.stories.d.ts +6 -0
  56. package/dist/types/inputs/MaskedInput/useMaskedInput.d.ts +10 -0
  57. package/dist/types/inputs/PhoneInput/PhoneInput.d.ts +1 -2
  58. package/dist/types/inputs/PhoneInput/phoneinput.stories.d.ts +5 -0
  59. package/dist/types/inputs/RadioGroup/radiogroup.stories.d.ts +5 -0
  60. package/dist/types/inputs/SinInput/SinInput.d.ts +0 -1
  61. package/dist/types/inputs/SinInput/sininput.stories.d.ts +5 -0
  62. package/dist/types/inputs/TableInput/DropdownCell.d.ts +3 -2
  63. package/dist/types/inputs/TableInput/HoverCell.d.ts +6 -0
  64. package/dist/types/inputs/TableInput/MoneyCell.d.ts +8 -0
  65. package/dist/types/inputs/TableInput/MoneyEditCell.d.ts +2 -1
  66. package/dist/types/inputs/TableInput/MoneySumFooter.d.ts +6 -0
  67. package/dist/types/inputs/TableInput/StringEditCell.d.ts +2 -2
  68. package/dist/types/inputs/TableInput/TableInput.d.ts +5 -2
  69. package/dist/types/inputs/TableInput/addRowOnTab.d.ts +1 -0
  70. package/dist/types/inputs/TableInput/main.story.d.ts +7 -0
  71. package/dist/types/inputs/TableInput/tableinput.stories.d.ts +5 -0
  72. package/dist/types/inputs/TableInput/withHover.story.d.ts +7 -0
  73. package/dist/types/money/MoneyCurrencyInput/MoneyCurrencyInput.d.ts +2 -4
  74. package/dist/types/money/MoneyCurrencyInput/moneycurrencyinput.stories.d.ts +5 -0
  75. package/dist/types/money/MoneyInput/MoneyInput.d.ts +4 -5
  76. package/dist/types/money/MoneyInput/moneyinput.stories.d.ts +6 -0
  77. package/dist/types/money/useMoneyInput.d.ts +13 -0
  78. package/dist/types/storyDecorator.d.ts +6 -0
  79. package/package.json +13 -10
  80. package/dist/esm/date/DatePicker/styles.css.js +0 -7
  81. package/dist/esm/date/DatePicker/styles.css.js.map +0 -1
  82. package/dist/esm/date/LocalDatePicker/MaskedDateInput.js +0 -22
  83. package/dist/esm/date/LocalDatePicker/MaskedDateInput.js.map +0 -1
  84. package/dist/esm/date/LocalTimePicker/MaskedTimeInput.js +0 -21
  85. package/dist/esm/date/LocalTimePicker/MaskedTimeInput.js.map +0 -1
  86. package/dist/esm/external/style-inject/dist/style-inject.es.js +0 -29
  87. package/dist/esm/external/style-inject/dist/style-inject.es.js.map +0 -1
  88. package/dist/esm/inputs/CreditCardInput/CreditCardInput.js +0 -71
  89. package/dist/esm/inputs/CreditCardInput/CreditCardInput.js.map +0 -1
  90. package/dist/esm/inputs/CreditCardInput/CreditCardNumberInput.js +0 -76
  91. package/dist/esm/inputs/CreditCardInput/CreditCardNumberInput.js.map +0 -1
  92. package/dist/esm/inputs/CreditCardInput/styles.css.js +0 -7
  93. package/dist/esm/inputs/CreditCardInput/styles.css.js.map +0 -1
  94. package/dist/esm/inputs/RadioGroup/RadioGroup.js +0 -25
  95. package/dist/esm/inputs/RadioGroup/RadioGroup.js.map +0 -1
  96. package/dist/esm/inputs/Scriptel/Scriptel.js +0 -52
  97. package/dist/esm/inputs/Scriptel/Scriptel.js.map +0 -1
  98. package/dist/esm/inputs/Scriptel/ScriptelContext.js +0 -6
  99. package/dist/esm/inputs/Scriptel/ScriptelContext.js.map +0 -1
  100. package/dist/esm/inputs/Scriptel/scriptel/enums.js +0 -21
  101. package/dist/esm/inputs/Scriptel/scriptel/enums.js.map +0 -1
  102. package/dist/esm/inputs/Scriptel/scriptel/index.js +0 -93
  103. package/dist/esm/inputs/Scriptel/scriptel/index.js.map +0 -1
  104. package/dist/esm/inputs/Scriptel/withScriptel.js +0 -15
  105. package/dist/esm/inputs/Scriptel/withScriptel.js.map +0 -1
  106. package/dist/esm/inputs/ScriptelInput/ScriptelInput.js +0 -67
  107. package/dist/esm/inputs/ScriptelInput/ScriptelInput.js.map +0 -1
  108. package/dist/esm/inputs/SinInput/SinInput.js +0 -54
  109. package/dist/esm/inputs/SinInput/SinInput.js.map +0 -1
  110. package/dist/esm/inputs/TableInput/DropdownCell.js +0 -26
  111. package/dist/esm/inputs/TableInput/DropdownCell.js.map +0 -1
  112. package/dist/esm/inputs/TableInput/HoverCell.js +0 -20
  113. package/dist/esm/inputs/TableInput/HoverCell.js.map +0 -1
  114. package/dist/esm/inputs/TableInput/LocalDateCell.js +0 -13
  115. package/dist/esm/inputs/TableInput/LocalDateCell.js.map +0 -1
  116. package/dist/esm/inputs/TableInput/LocalDateEditCell.js +0 -29
  117. package/dist/esm/inputs/TableInput/LocalDateEditCell.js.map +0 -1
  118. package/dist/esm/inputs/TableInput/MoneyCell.js +0 -13
  119. package/dist/esm/inputs/TableInput/MoneyCell.js.map +0 -1
  120. package/dist/esm/inputs/TableInput/MoneyEditCell.js +0 -30
  121. package/dist/esm/inputs/TableInput/MoneyEditCell.js.map +0 -1
  122. package/dist/esm/inputs/TableInput/MoneySumFooter.js +0 -15
  123. package/dist/esm/inputs/TableInput/MoneySumFooter.js.map +0 -1
  124. package/dist/esm/inputs/TableInput/StringEditCell.js +0 -34
  125. package/dist/esm/inputs/TableInput/StringEditCell.js.map +0 -1
  126. package/dist/esm/inputs/TableInput/TableInput.js +0 -75
  127. package/dist/esm/inputs/TableInput/TableInput.js.map +0 -1
  128. package/dist/esm/inputs/TableInput/addRowOnTab.js +0 -13
  129. package/dist/esm/inputs/TableInput/addRowOnTab.js.map +0 -1
  130. package/dist/esm/money/MoneyCurrencyInput/MoneyCurrencyInput.js +0 -51
  131. package/dist/esm/money/MoneyCurrencyInput/MoneyCurrencyInput.js.map +0 -1
  132. package/dist/esm/money/MoneyInput/MoneyInput.js +0 -31
  133. package/dist/esm/money/MoneyInput/MoneyInput.js.map +0 -1
  134. package/dist/esm/money/useMoneyInput.js +0 -75
  135. package/dist/esm/money/useMoneyInput.js.map +0 -1
  136. package/dist/esm/step/FormStep.js +0 -17
  137. package/dist/esm/step/FormStep.js.map +0 -1
  138. package/dist/esm/step/Step.js +0 -10
  139. package/dist/esm/step/Step.js.map +0 -1
  140. package/dist/esm/step/StepProvider.js +0 -95
  141. package/dist/esm/step/StepProvider.js.map +0 -1
  142. package/dist/esm/step/stepContext.js +0 -10
  143. package/dist/esm/step/stepContext.js.map +0 -1
  144. package/dist/esm/step/useStep.js +0 -10
  145. package/dist/esm/step/useStep.js.map +0 -1
  146. package/dist/types/date/LocalDatePicker/MaskedDateInput.d.ts +0 -12
  147. package/dist/types/date/LocalTimePicker/MaskedTimeInput.d.ts +0 -11
  148. package/dist/types/inputs/CreditCardInput/index.d.ts +0 -2
  149. package/dist/types/inputs/RadioGroup/RadioGroup.d.ts +0 -8
  150. package/dist/types/inputs/RadioGroup/index.d.ts +0 -2
  151. package/dist/types/inputs/ScriptelInput/ScriptelInput.d.ts +0 -8
  152. package/dist/types/inputs/ScriptelInput/index.d.ts +0 -2
  153. package/dist/types/inputs/SinInput/index.d.ts +0 -2
  154. package/dist/types/inputs/TableInput/LocalDateCell.d.ts +0 -8
  155. package/dist/types/inputs/TableInput/LocalDateEditCell.d.ts +0 -3
  156. package/dist/types/inputs/TableInput/index.d.ts +0 -11
  157. package/dist/types/money/MoneyCurrencyInput/index.d.ts +0 -2
  158. package/dist/types/step/StepProvider.d.ts +0 -10
  159. package/dist/types/step/index.d.ts +0 -4
@@ -1,69 +1,26 @@
1
1
  import React from 'react';
2
+ import { DatePicker } from '@mantine/dates';
2
3
  import { toDate, toLocalDate } from '@thx/date';
3
4
  import debug from 'debug';
4
- import DatePicker from 'react-datepicker';
5
- import '../DatePicker/styles.css.js';
6
- import { MaskedDateInput } from './MaskedDateInput.js';
7
5
 
8
6
  debug("thx.controls.date.LocalDatePicker");
9
7
  function LocalDatePicker(props) {
10
- const {
11
- minDate,
12
- maxDate,
13
- value,
14
- onChange,
15
- onBlur,
16
- as,
17
- action,
18
- actionPosition,
19
- className,
20
- error,
21
- fluid,
22
- focus,
23
- icon,
24
- iconPosition,
25
- inverted,
26
- label,
27
- labelPosition,
28
- loading,
29
- size,
30
- tabIndex,
31
- transparent,
32
- ...rest
33
- } = props;
8
+ const { minDate, maxDate, value, onChange, onChangeRaw, defaultValue, initialMonth, ...rest } = props;
34
9
  const selected = value ? toDate(value) : null;
35
- const inputProps = {
36
- as,
37
- action,
38
- actionPosition,
39
- className,
40
- error,
41
- fluid,
42
- focus,
43
- icon,
44
- iconPosition,
45
- inverted,
46
- label,
47
- labelPosition,
48
- loading,
49
- size,
50
- tabIndex,
51
- transparent
52
- };
53
10
  return /* @__PURE__ */ React.createElement(DatePicker, {
54
- ...rest,
55
- selected,
11
+ defaultValue: defaultValue ? toDate(defaultValue) : void 0,
12
+ initialMonth: initialMonth ? toDate(initialMonth) : void 0,
13
+ allowFreeInput: true,
14
+ minDate: minDate ? toDate(minDate) : void 0,
15
+ maxDate: maxDate ? toDate(maxDate) : void 0,
16
+ value: selected,
56
17
  onChange: (date) => {
57
18
  if (onChange)
58
19
  onChange(date ? toLocalDate(date) : null);
20
+ if (onChangeRaw)
21
+ onChangeRaw(date);
59
22
  },
60
- onBlur,
61
- customInput: /* @__PURE__ */ React.createElement(MaskedDateInput, {
62
- ...inputProps,
63
- onBlur
64
- }),
65
- minDate: minDate ? toDate(minDate) : null,
66
- maxDate: maxDate ? toDate(maxDate) : null
23
+ ...rest
67
24
  });
68
25
  }
69
26
 
@@ -1 +1 @@
1
- {"version":3,"file":"LocalDatePicker.js","sources":["../../../../src/date/LocalDatePicker/LocalDatePicker.tsx"],"sourcesContent":["import type {LocalDate} from '@js-joda/core';\nimport {toDate, toLocalDate} from '@thx/date';\nimport debug from 'debug';\nimport type {ReactDatePickerProps} from 'react-datepicker';\nimport type {InputProps} from 'semantic-ui-react';\nimport {DatePicker} from '../DatePicker/index';\nimport '../DatePicker/styles.css';\nimport {MaskedDateInput} from './MaskedDateInput';\n\nconst d = debug('thx.controls.date.LocalDatePicker');\n\ninterface ILocalDatePicker {\n\tvalue?: LocalDate | number | null;\n\tonChange?: (value: LocalDate | null) => void;\n\tonChangeRaw?: () => void;\n\tminDate?: LocalDate;\n\tmaxDate?: LocalDate;\n}\n\ntype InputPropsOmitted = Omit<InputProps, 'onChange'>;\ntype ReactDatePickerPropsOmitted = Omit<Omit<ReactDatePickerProps, 'value'>, 'onChange' | 'minDate' | 'maxDate'>;\nexport type LocalDatePickerProps = ILocalDatePicker & InputPropsOmitted & ReactDatePickerPropsOmitted;\n\nexport function LocalDatePicker(props: LocalDatePickerProps): JSX.Element {\n\tconst {\n\t\tminDate,\n\t\tmaxDate,\n\t\tvalue,\n\t\tonChange,\n\t\tonBlur,\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t\t...rest\n\t} = props;\n\n\tconst selected = value ? toDate(value) : null;\n\n\tconst inputProps = {\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t};\n\n\treturn (\n\t\t<DatePicker\n\t\t\t{...rest}\n\t\t\tselected={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalDate(date) : null);\n\t\t\t}}\n\t\t\tonBlur={onBlur}\n\t\t\tcustomInput={<MaskedDateInput {...inputProps} onBlur={onBlur} />}\n\t\t\tminDate={minDate ? toDate(minDate) : null}\n\t\t\tmaxDate={maxDate ? toDate(maxDate) : null}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;;;AASU,MAAM,mCAAmC,EAAA;AAc5C,SAAA,eAAA,CAAyB,KAA0C,EAAA;AACzE,EAAM,MAAA;AAAA,IACL,OAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,MAAA;AAAA,IACA,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACG,GAAA,IAAA;AAAA,GACA,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,QAAW,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAEzC,EAAA,MAAM,UAAa,GAAA;AAAA,IAClB,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,GACD,CAAA;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IACI,GAAA,IAAA;AAAA,IACJ,QAAA;AAAA,IACA,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,IAAI,CAAA,CAAA;AAAA,KACvD;AAAA,IACA,MAAA;AAAA,IACA,6BAAc,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAA,MAAoB,GAAA,UAAA;AAAA,MAAY,MAAA;AAAA,KAAgB,CAAA;AAAA,IAC9D,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,IAAA;AAAA,IACrC,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,IAAA;AAAA,GACtC,CAAA,CAAA;AAEF;;;;"}
1
+ {"version":3,"file":"LocalDatePicker.js","sources":["../../../../src/date/LocalDatePicker/LocalDatePicker.tsx"],"sourcesContent":["import type {LocalDate} from '@js-joda/core';\nimport {DatePicker} from '@mantine/dates';\nimport type {DatePickerProps} from '@mantine/dates';\nimport {toDate, toLocalDate} from '@thx/date';\nimport debug from 'debug';\n\nconst d = debug('thx.controls.date.LocalDatePicker');\n\ninterface ILocalDatePicker {\n\tdefaultValue?: LocalDate | number | null;\n\tinitialMonth?: LocalDate | number | null;\n\tvalue?: LocalDate | number | null;\n\tonChange?: (value: LocalDate | null) => void;\n\tonChangeRaw?: (value: Date | null) => void;\n\tminDate?: LocalDate;\n\tmaxDate?: LocalDate;\n}\n\nexport type LocalDatePickerProps = ILocalDatePicker &\n\tOmit<DatePickerProps, 'onChange' | 'value' | 'defaultValue' | 'initialMonth' | 'minDate' | 'maxDate'>;\n\nexport function LocalDatePicker(props: LocalDatePickerProps): JSX.Element {\n\tconst {minDate, maxDate, value, onChange, onChangeRaw, defaultValue, initialMonth, ...rest} = props;\n\n\tconst selected = value ? toDate(value) : null;\n\n\treturn (\n\t\t<DatePicker\n\t\t\tdefaultValue={defaultValue ? toDate(defaultValue) : undefined}\n\t\t\tinitialMonth={initialMonth ? toDate(initialMonth) : undefined}\n\t\t\tallowFreeInput\n\t\t\tminDate={minDate ? toDate(minDate) : undefined}\n\t\t\tmaxDate={maxDate ? toDate(maxDate) : undefined}\n\t\t\tvalue={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalDate(date) : null);\n\t\t\t\tif (onChangeRaw) onChangeRaw(date);\n\t\t\t}}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;AAMU,MAAM,mCAAmC,EAAA;AAe5C,SAAA,eAAA,CAAyB,KAA0C,EAAA;AACzE,EAAM,MAAA,EAAC,SAAS,OAAS,EAAA,KAAA,EAAO,UAAU,WAAa,EAAA,YAAA,EAAc,iBAAiB,IAAQ,EAAA,GAAA,KAAA,CAAA;AAE9F,EAAA,MAAM,QAAW,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAEzC,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IACA,YAAc,EAAA,YAAA,GAAe,MAAO,CAAA,YAAY,CAAI,GAAA,KAAA,CAAA;AAAA,IACpD,YAAc,EAAA,YAAA,GAAe,MAAO,CAAA,YAAY,CAAI,GAAA,KAAA,CAAA;AAAA,IACpD,cAAc,EAAA,IAAA;AAAA,IACd,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,KAAA,CAAA;AAAA,IACrC,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,KAAA,CAAA;AAAA,IACrC,KAAO,EAAA,QAAA;AAAA,IACP,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,IAAI,CAAA,CAAA;AACtD,MAAI,IAAA,WAAA;AAAa,QAAA,WAAA,CAAY,IAAI,CAAA,CAAA;AAAA,KAClC;AAAA,IACI,GAAA,IAAA;AAAA,GACL,CAAA,CAAA;AAEF;;;;"}
@@ -1,40 +1,36 @@
1
1
  import React from 'react';
2
2
  import { LocalDate } from '@js-joda/core';
3
+ import { Select } from '@mantine/core';
3
4
  import debug from 'debug';
4
- import { Select } from 'semantic-ui-react';
5
5
 
6
6
  debug("thx.controls.date.LocalMonthSelect");
7
7
  const monthOptions = [
8
- { text: "January", value: 1, key: 1 },
9
- { text: "February", value: 2, key: 2 },
10
- { text: "March", value: 3, key: 3 },
11
- { text: "April", value: 4, key: 4 },
12
- { text: "May", value: 5, key: 5 },
13
- { text: "June", value: 6, key: 6 },
14
- { text: "July", value: 7, key: 7 },
15
- { text: "August", value: 8, key: 8 },
16
- { text: "September", value: 9, key: 9 },
17
- { text: "October", value: 10, key: 10 },
18
- { text: "November", value: 11, key: 11 },
19
- { text: "December", value: 12, key: 12 }
8
+ { label: "January", value: "1" },
9
+ { label: "February", value: "2" },
10
+ { label: "March", value: "3" },
11
+ { label: "April", value: "4" },
12
+ { label: "May", value: "5" },
13
+ { label: "June", value: "6" },
14
+ { label: "July", value: "7" },
15
+ { label: "August", value: "8" },
16
+ { label: "September", value: "9" },
17
+ { label: "October", value: "10" },
18
+ { label: "November", value: "11" },
19
+ { label: "December", value: "12" }
20
20
  ];
21
21
  function LocalMonthSelect(props) {
22
- const { value, onChange, year, handleBlur, ...rest } = props;
22
+ const { value, onChange, year, ...rest } = props;
23
23
  const theYear = year || LocalDate.now().year();
24
24
  return /* @__PURE__ */ React.createElement(Select, {
25
- placeholder: "Select Month",
26
- options: monthOptions,
27
- value: value ? value.monthValue() : "",
28
- onChange: (ev, v) => {
25
+ data: monthOptions,
26
+ value: value ? `${value.monthValue()}` : null,
27
+ onChange: (v) => {
29
28
  if (onChange) {
30
- if (typeof v.value === "number") {
31
- onChange(v ? LocalDate.of(theYear, v.value, 1) : null);
32
- } else {
33
- onChange(null);
29
+ if (v) {
30
+ onChange(LocalDate.of(theYear, parseInt(v, 10), 1));
34
31
  }
35
32
  }
36
33
  },
37
- onBlur: handleBlur,
38
34
  ...rest
39
35
  });
40
36
  }
@@ -1 +1 @@
1
- {"version":3,"file":"LocalMonthSelect.js","sources":["../../../../src/date/LocalMonthSelect/LocalMonthSelect.tsx"],"sourcesContent":["import {LocalDate} from '@js-joda/core';\nimport debug from 'debug';\nimport {Select, SelectProps} from 'semantic-ui-react';\n\nconst d = debug('thx.controls.date.LocalMonthSelect');\n\nconst monthOptions = [\n\t{text: 'January', value: 1, key: 1},\n\t{text: 'February', value: 2, key: 2},\n\t{text: 'March', value: 3, key: 3},\n\t{text: 'April', value: 4, key: 4},\n\t{text: 'May', value: 5, key: 5},\n\t{text: 'June', value: 6, key: 6},\n\t{text: 'July', value: 7, key: 7},\n\t{text: 'August', value: 8, key: 8},\n\t{text: 'September', value: 9, key: 9},\n\t{text: 'October', value: 10, key: 10},\n\t{text: 'November', value: 11, key: 11},\n\t{text: 'December', value: 12, key: 12},\n];\n\ninterface ILocalMonthSelectProps {\n\tonChange?: (value: LocalDate | null) => void;\n\tvalue?: LocalDate | null;\n\tyear?: number;\n\thandleBlur?: (event: any) => void;\n}\n\nexport type LocalMonthSelectProps = ILocalMonthSelectProps & Omit<SelectProps, 'options'>;\n\nexport function LocalMonthSelect(props: LocalMonthSelectProps): JSX.Element {\n\tconst {value, onChange, year, handleBlur, ...rest} = props;\n\n\tconst theYear = year || LocalDate.now().year();\n\n\treturn (\n\t\t<Select\n\t\t\tplaceholder=\"Select Month\"\n\t\t\toptions={monthOptions}\n\t\t\tvalue={value ? value.monthValue() : ''}\n\t\t\tonChange={(ev, v) => {\n\t\t\t\tif (onChange) {\n\t\t\t\t\tif (typeof v.value === 'number') {\n\t\t\t\t\t\tonChange(v ? LocalDate.of(theYear, v.value, 1) : null);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tonChange(null);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}}\n\t\t\tonBlur={handleBlur}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;AAIU,MAAM,oCAAoC,EAAA;AAEpD,MAAM,YAAe,GAAA;AAAA,EACpB,EAAC,IAAM,EAAA,SAAA,EAAW,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EAClC,EAAC,IAAM,EAAA,UAAA,EAAY,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EACnC,EAAC,IAAM,EAAA,OAAA,EAAS,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EAChC,EAAC,IAAM,EAAA,OAAA,EAAS,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EAChC,EAAC,IAAM,EAAA,KAAA,EAAO,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EAC9B,EAAC,IAAM,EAAA,MAAA,EAAQ,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EAC/B,EAAC,IAAM,EAAA,MAAA,EAAQ,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EAC/B,EAAC,IAAM,EAAA,QAAA,EAAU,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EACjC,EAAC,IAAM,EAAA,WAAA,EAAa,KAAO,EAAA,CAAA,EAAG,KAAK,CAAC,EAAA;AAAA,EACpC,EAAC,IAAM,EAAA,SAAA,EAAW,KAAO,EAAA,EAAA,EAAI,KAAK,EAAE,EAAA;AAAA,EACpC,EAAC,IAAM,EAAA,UAAA,EAAY,KAAO,EAAA,EAAA,EAAI,KAAK,EAAE,EAAA;AAAA,EACrC,EAAC,IAAM,EAAA,UAAA,EAAY,KAAO,EAAA,EAAA,EAAI,KAAK,EAAE,EAAA;AACtC,CAAA,CAAA;AAWO,SAAA,gBAAA,CAA0B,KAA2C,EAAA;AAC3E,EAAA,MAAM,EAAC,KAAA,EAAO,QAAU,EAAA,IAAA,EAAM,eAAe,IAAQ,EAAA,GAAA,KAAA,CAAA;AAErD,EAAA,MAAM,OAAU,GAAA,IAAA,IAAQ,SAAU,CAAA,GAAA,GAAM,IAAK,EAAA,CAAA;AAE7C,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACA,WAAY,EAAA,cAAA;AAAA,IACZ,OAAS,EAAA,YAAA;AAAA,IACT,KAAO,EAAA,KAAA,GAAQ,KAAM,CAAA,UAAA,EAAe,GAAA,EAAA;AAAA,IACpC,QAAA,EAAU,CAAC,EAAA,EAAI,CAAM,KAAA;AACpB,MAAA,IAAI,QAAU,EAAA;AACb,QAAI,IAAA,OAAO,CAAE,CAAA,KAAA,KAAU,QAAU,EAAA;AAChC,UAAS,QAAA,CAAA,CAAA,GAAI,UAAU,EAAG,CAAA,OAAA,EAAS,EAAE,KAAO,EAAA,CAAC,IAAI,IAAI,CAAA,CAAA;AAAA,SAC/C,MAAA;AACN,UAAA,QAAA,CAAS,IAAI,CAAA,CAAA;AAAA,SACd;AAAA,OACD;AAAA,KACD;AAAA,IACA,MAAQ,EAAA,UAAA;AAAA,IACJ,GAAA,IAAA;AAAA,GACL,CAAA,CAAA;AAEF;;;;"}
1
+ {"version":3,"file":"LocalMonthSelect.js","sources":["../../../../src/date/LocalMonthSelect/LocalMonthSelect.tsx"],"sourcesContent":["import {LocalDate} from '@js-joda/core';\nimport {Select} from '@mantine/core';\nimport type {SelectProps} from '@mantine/core';\nimport debug from 'debug';\n\nconst d = debug('thx.controls.date.LocalMonthSelect');\n\nconst monthOptions = [\n\t{label: 'January', value: '1'},\n\t{label: 'February', value: '2'},\n\t{label: 'March', value: '3'},\n\t{label: 'April', value: '4'},\n\t{label: 'May', value: '5'},\n\t{label: 'June', value: '6'},\n\t{label: 'July', value: '7'},\n\t{label: 'August', value: '8'},\n\t{label: 'September', value: '9'},\n\t{label: 'October', value: '10'},\n\t{label: 'November', value: '11'},\n\t{label: 'December', value: '12'},\n];\n\ninterface ILocalMonthSelectProps {\n\tonChange?: (value: LocalDate | null) => void;\n\tvalue?: LocalDate | null;\n\tyear?: number;\n}\n\nexport type LocalMonthSelectProps = ILocalMonthSelectProps & Omit<SelectProps, 'options' | 'data' | 'value' | 'onChange'>;\n\nexport function LocalMonthSelect(props: LocalMonthSelectProps): JSX.Element {\n\tconst {value, onChange, year, ...rest} = props;\n\n\tconst theYear = year || LocalDate.now().year();\n\n\treturn (\n\t\t<Select\n\t\t\tdata={monthOptions}\n\t\t\tvalue={value ? `${value.monthValue()}` : null}\n\t\t\tonChange={v => {\n\t\t\t\tif (onChange) {\n\t\t\t\t\tif (v) {\n\t\t\t\t\t\tonChange(LocalDate.of(theYear, parseInt(v, 10), 1));\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;AAKU,MAAM,oCAAoC,EAAA;AAEpD,MAAM,YAAe,GAAA;AAAA,EACpB,EAAC,KAAA,EAAO,SAAW,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC7B,EAAC,KAAA,EAAO,UAAY,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC9B,EAAC,KAAA,EAAO,OAAS,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC3B,EAAC,KAAA,EAAO,OAAS,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC3B,EAAC,KAAA,EAAO,KAAO,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EACzB,EAAC,KAAA,EAAO,MAAQ,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC1B,EAAC,KAAA,EAAO,MAAQ,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC1B,EAAC,KAAA,EAAO,QAAU,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC5B,EAAC,KAAA,EAAO,WAAa,EAAA,KAAA,EAAO,GAAG,EAAA;AAAA,EAC/B,EAAC,KAAA,EAAO,SAAW,EAAA,KAAA,EAAO,IAAI,EAAA;AAAA,EAC9B,EAAC,KAAA,EAAO,UAAY,EAAA,KAAA,EAAO,IAAI,EAAA;AAAA,EAC/B,EAAC,KAAA,EAAO,UAAY,EAAA,KAAA,EAAO,IAAI,EAAA;AAChC,CAAA,CAAA;AAUO,SAAA,gBAAA,CAA0B,KAA2C,EAAA;AAC3E,EAAA,MAAM,EAAC,KAAA,EAAO,QAAU,EAAA,IAAA,EAAA,GAAS,IAAQ,EAAA,GAAA,KAAA,CAAA;AAEzC,EAAA,MAAM,OAAU,GAAA,IAAA,IAAQ,SAAU,CAAA,GAAA,GAAM,IAAK,EAAA,CAAA;AAE7C,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACA,IAAM,EAAA,YAAA;AAAA,IACN,KAAO,EAAA,KAAA,GAAQ,CAAG,EAAA,KAAA,CAAM,YAAiB,CAAA,CAAA,GAAA,IAAA;AAAA,IACzC,UAAU,CAAK,CAAA,KAAA;AACd,MAAA,IAAI,QAAU,EAAA;AACb,QAAA,IAAI,CAAG,EAAA;AACN,UAAS,QAAA,CAAA,SAAA,CAAU,GAAG,OAAS,EAAA,QAAA,CAAS,GAAG,EAAE,CAAA,EAAG,CAAC,CAAC,CAAA,CAAA;AAAA,SACnD;AAAA,OACD;AAAA,KACD;AAAA,IACI,GAAA,IAAA;AAAA,GACL,CAAA,CAAA;AAEF;;;;"}
@@ -1,74 +1,25 @@
1
1
  import React from 'react';
2
2
  import { LocalTime } from '@js-joda/core';
3
+ import { TimeInput } from '@mantine/dates';
3
4
  import { toDate, toLocalTime } from '@thx/date';
4
5
  import debug from 'debug';
5
- import DatePicker from 'react-datepicker';
6
- import '../DatePicker/styles.css.js';
7
- import { MaskedTimeInput } from './MaskedTimeInput.js';
8
6
 
9
7
  debug("thx.controls.date.LocalTimePicker");
10
8
  function LocalTimePicker(props) {
11
- const {
12
- value,
13
- onChange,
14
- as,
15
- action,
16
- actionPosition,
17
- className,
18
- disabled,
19
- error,
20
- fluid,
21
- focus,
22
- icon,
23
- iconPosition,
24
- inverted,
25
- label,
26
- labelPosition,
27
- loading,
28
- size,
29
- tabIndex,
30
- transparent,
31
- ...rest
32
- } = props;
9
+ const { value, onChange, ...rest } = props;
33
10
  let selected;
34
11
  if (typeof value === "number")
35
12
  selected = toDate(LocalTime.ofSecondOfDay(value));
36
13
  else
37
14
  selected = value ? toDate(value) : null;
38
- const inputProps = {
39
- as,
40
- action,
41
- actionPosition,
42
- className,
43
- disabled,
44
- error,
45
- fluid,
46
- focus,
47
- icon,
48
- iconPosition,
49
- inverted,
50
- label,
51
- labelPosition,
52
- loading,
53
- size,
54
- tabIndex,
55
- transparent
56
- };
57
- return /* @__PURE__ */ React.createElement(DatePicker, {
58
- ...rest,
59
- selected,
15
+ return /* @__PURE__ */ React.createElement(TimeInput, {
16
+ value: selected,
60
17
  onChange: (date) => {
61
18
  if (onChange)
62
19
  onChange(date ? toLocalTime(date) : null);
63
20
  },
64
- showTimeSelect: true,
65
- showTimeSelectOnly: true,
66
- timeIntervals: 15,
67
- timeCaption: "Time",
68
- dateFormat: "hh:mm aa",
69
- customInput: /* @__PURE__ */ React.createElement(MaskedTimeInput, {
70
- ...inputProps
71
- })
21
+ format: "12",
22
+ ...rest
72
23
  });
73
24
  }
74
25
 
@@ -1 +1 @@
1
- {"version":3,"file":"LocalTimePicker.js","sources":["../../../../src/date/LocalTimePicker/LocalTimePicker.tsx"],"sourcesContent":["import {LocalTime} from '@js-joda/core';\nimport {toDate, toLocalTime} from '@thx/date';\nimport debug from 'debug';\nimport type {ReactDatePickerProps} from 'react-datepicker';\nimport type {InputProps} from 'semantic-ui-react';\nimport {DatePicker} from '../DatePicker/index';\nimport {MaskedTimeInput} from './MaskedTimeInput';\n\nconst d = debug('thx.controls.date.LocalTimePicker');\n\ninterface ILocalTimePicker {\n\tvalue?: LocalTime | number | null;\n\tonChange?: (value: LocalTime | null) => void;\n\tonChangeRaw?: () => void;\n}\n\ntype InputPropsOmitted = Omit<InputProps, 'onChange'>;\ntype ReactDatePickerPropsOmitted = Omit<Omit<ReactDatePickerProps, 'value'>, 'onChange'>;\nexport type LocalTimePickerProps = ILocalTimePicker & InputPropsOmitted & ReactDatePickerPropsOmitted;\n\nexport function LocalTimePicker(props: LocalTimePickerProps): JSX.Element {\n\tconst {\n\t\tvalue,\n\t\tonChange,\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\tdisabled,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t\t...rest\n\t} = props;\n\n\tlet selected;\n\tif (typeof value === 'number') selected = toDate(LocalTime.ofSecondOfDay(value));\n\telse selected = value ? toDate(value) : null;\n\n\tconst inputProps = {\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\tdisabled,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t};\n\n\treturn (\n\t\t<DatePicker\n\t\t\t{...rest}\n\t\t\tselected={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalTime(date) : null);\n\t\t\t}}\n\t\t\tshowTimeSelect\n\t\t\tshowTimeSelectOnly\n\t\t\ttimeIntervals={15}\n\t\t\ttimeCaption=\"Time\"\n\t\t\tdateFormat=\"hh:mm aa\"\n\t\t\tcustomInput={<MaskedTimeInput {...inputProps} />}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;;;;AAQU,MAAM,mCAAmC,EAAA;AAY5C,SAAA,eAAA,CAAyB,KAA0C,EAAA;AACzE,EAAM,MAAA;AAAA,IACL,KAAA;AAAA,IACA,QAAA;AAAA,IACA,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACG,GAAA,IAAA;AAAA,GACA,GAAA,KAAA,CAAA;AAEJ,EAAI,IAAA,QAAA,CAAA;AACJ,EAAA,IAAI,OAAO,KAAU,KAAA,QAAA;AAAU,IAAA,QAAA,GAAW,MAAO,CAAA,SAAA,CAAU,aAAc,CAAA,KAAK,CAAC,CAAA,CAAA;AAAA;AAC1E,IAAW,QAAA,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAExC,EAAA,MAAM,UAAa,GAAA;AAAA,IAClB,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,GACD,CAAA;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IACI,GAAA,IAAA;AAAA,IACJ,QAAA;AAAA,IACA,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,IAAI,CAAA,CAAA;AAAA,KACvD;AAAA,IACA,cAAc,EAAA,IAAA;AAAA,IACd,kBAAkB,EAAA,IAAA;AAAA,IAClB,aAAe,EAAA,EAAA;AAAA,IACf,WAAY,EAAA,MAAA;AAAA,IACZ,UAAW,EAAA,UAAA;AAAA,IACX,6BAAc,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA;AAAA,MAAoB,GAAA,UAAA;AAAA,KAAY,CAAA;AAAA,GAC/C,CAAA,CAAA;AAEF;;;;"}
1
+ {"version":3,"file":"LocalTimePicker.js","sources":["../../../../src/date/LocalTimePicker/LocalTimePicker.tsx"],"sourcesContent":["import {LocalTime} from '@js-joda/core';\nimport {TimeInput} from '@mantine/dates';\nimport type {TimeInputProps} from '@mantine/dates';\nimport {toDate, toLocalTime} from '@thx/date';\nimport debug from 'debug';\n\nconst d = debug('thx.controls.date.LocalTimePicker');\n\ninterface ILocalTimePicker {\n\tvalue?: LocalTime | number | null;\n\tonChange?: (value: LocalTime | null) => void;\n}\n\nexport type LocalTimePickerProps = ILocalTimePicker & Omit<TimeInputProps, 'onChange' | 'value'>;\n\nexport function LocalTimePicker(props: LocalTimePickerProps): JSX.Element {\n\tconst {value, onChange, ...rest} = props;\n\n\tlet selected: Date | null;\n\tif (typeof value === 'number') selected = toDate(LocalTime.ofSecondOfDay(value));\n\telse selected = value ? toDate(value) : null;\n\n\treturn (\n\t\t<TimeInput\n\t\t\tvalue={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalTime(date) : null);\n\t\t\t}}\n\t\t\tformat=\"12\"\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;;AAMU,MAAM,mCAAmC,EAAA;AAS5C,SAAA,eAAA,CAAyB,KAA0C,EAAA;AACzE,EAAM,MAAA,EAAC,KAAO,EAAA,QAAA,EAAA,GAAa,IAAQ,EAAA,GAAA,KAAA,CAAA;AAEnC,EAAI,IAAA,QAAA,CAAA;AACJ,EAAA,IAAI,OAAO,KAAU,KAAA,QAAA;AAAU,IAAA,QAAA,GAAW,MAAO,CAAA,SAAA,CAAU,aAAc,CAAA,KAAK,CAAC,CAAA,CAAA;AAAA;AAC1E,IAAW,QAAA,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAExC,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA;AAAA,IACA,KAAO,EAAA,QAAA;AAAA,IACP,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,IAAI,CAAA,CAAA;AAAA,KACvD;AAAA,IACA,MAAO,EAAA,IAAA;AAAA,IACH,GAAA,IAAA;AAAA,GACL,CAAA,CAAA;AAEF;;;;"}
@@ -1,84 +1,28 @@
1
1
  import React from 'react';
2
+ import { DatePicker } from '@mantine/dates';
2
3
  import { toDate, toLocalDate } from '@thx/date';
3
4
  import debug from 'debug';
4
- import { Input } from 'semantic-ui-react';
5
- import DatePicker from 'react-datepicker';
6
- import '../DatePicker/styles.css.js';
7
5
 
8
6
  debug("thx.controls.date.MonthDayPicker");
9
- const months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
10
- function MonthDayHeader(props) {
11
- return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", {
12
- className: "react-datepicker__current-month"
13
- }, months[props.date.getMonth()]), /* @__PURE__ */ React.createElement("button", {
14
- type: "button",
15
- className: "react-datepicker__navigation react-datepicker__navigation--previous",
16
- "aria-label": "Previous Month",
17
- onClick: props.decreaseMonth,
18
- disabled: props.prevMonthButtonDisabled
19
- }, "Previous Month"), /* @__PURE__ */ React.createElement("button", {
20
- type: "button",
21
- className: "react-datepicker__navigation react-datepicker__navigation--next",
22
- "aria-label": "Next Month",
23
- onClick: props.increaseMonth,
24
- disabled: props.nextMonthButtonDisabled
25
- }, "Next Month"));
26
- }
27
7
  function MonthDayPicker(props) {
28
- const {
29
- value,
30
- onChange,
31
- as,
32
- action,
33
- actionPosition,
34
- className,
35
- disabled,
36
- error,
37
- fluid,
38
- focus,
39
- icon,
40
- iconPosition,
41
- inverted,
42
- label,
43
- labelPosition,
44
- loading,
45
- size,
46
- tabIndex,
47
- transparent,
48
- ...rest
49
- } = props;
8
+ const { defaultValue, initialMonth, minDate, maxDate, value, onChange, onChangeRaw, ...rest } = props;
50
9
  const selected = value ? toDate(value) : null;
51
- const inputProps = {
52
- as,
53
- action,
54
- actionPosition,
55
- className,
56
- disabled,
57
- error,
58
- fluid,
59
- focus,
60
- icon,
61
- iconPosition,
62
- inverted,
63
- label,
64
- labelPosition,
65
- loading,
66
- size,
67
- tabIndex,
68
- transparent
69
- };
70
10
  return /* @__PURE__ */ React.createElement(DatePicker, {
71
- ...rest,
72
- selected,
11
+ inputFormat: "MMMM D",
12
+ labelFormat: "MMMM D",
13
+ defaultValue: defaultValue ? toDate(defaultValue) : void 0,
14
+ initialMonth: initialMonth ? toDate(initialMonth) : void 0,
15
+ allowFreeInput: true,
16
+ minDate: minDate ? toDate(minDate) : void 0,
17
+ maxDate: maxDate ? toDate(maxDate) : void 0,
18
+ value: selected,
73
19
  onChange: (date) => {
74
20
  if (onChange)
75
21
  onChange(date ? toLocalDate(date) : null);
22
+ if (onChangeRaw)
23
+ onChangeRaw(date);
76
24
  },
77
- customInput: /* @__PURE__ */ React.createElement(Input, {
78
- ...inputProps
79
- }),
80
- renderCustomHeader: MonthDayHeader,
81
- dateFormat: "MMMM d"
25
+ ...rest
82
26
  });
83
27
  }
84
28
 
@@ -1 +1 @@
1
- {"version":3,"file":"MonthDayPicker.js","sources":["../../../../src/date/MonthDayPicker/MonthDayPicker.tsx"],"sourcesContent":["import type {LocalDate} from '@js-joda/core';\nimport {toDate, toLocalDate} from '@thx/date';\nimport debug from 'debug';\nimport type {ReactDatePickerProps} from 'react-datepicker';\nimport {InputProps, Input} from 'semantic-ui-react';\nimport {DatePicker} from '../DatePicker/index';\n\nconst d = debug('thx.controls.date.MonthDayPicker');\n\nconst months = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];\n\ninterface MonthDayHeaderProps {\n\tdate: Date;\n\tchangeYear(year: number): void;\n\tchangeMonth(month: number): void;\n\tdecreaseMonth(): void;\n\tincreaseMonth(): void;\n\tprevMonthButtonDisabled: boolean;\n\tnextMonthButtonDisabled: boolean;\n\tdecreaseYear(): void;\n\tincreaseYear(): void;\n\tprevYearButtonDisabled: boolean;\n\tnextYearButtonDisabled: boolean;\n}\n\nfunction MonthDayHeader(props: MonthDayHeaderProps) {\n\treturn (\n\t\t<>\n\t\t\t<div className=\"react-datepicker__current-month\">{months[props.date.getMonth()]}</div>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclassName=\"react-datepicker__navigation react-datepicker__navigation--previous\"\n\t\t\t\taria-label=\"Previous Month\"\n\t\t\t\tonClick={props.decreaseMonth}\n\t\t\t\tdisabled={props.prevMonthButtonDisabled}\n\t\t\t>\n\t\t\t\tPrevious Month\n\t\t\t</button>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tclassName=\"react-datepicker__navigation react-datepicker__navigation--next\"\n\t\t\t\taria-label=\"Next Month\"\n\t\t\t\tonClick={props.increaseMonth}\n\t\t\t\tdisabled={props.nextMonthButtonDisabled}\n\t\t\t>\n\t\t\t\tNext Month\n\t\t\t</button>\n\t\t</>\n\t);\n}\n\ninterface IMonthDayPickerProps {\n\tvalue?: LocalDate | number | null;\n\tonChange?: (value: LocalDate | null) => void;\n\tonChangeRaw?: () => void;\n}\n\ntype InputPropsOmitted = Omit<InputProps, 'onChange'>;\ntype ReactDatePickerPropsOmitted = Omit<Omit<ReactDatePickerProps, 'value'>, 'onChange'>;\nexport type MonthDayPickerProps = IMonthDayPickerProps & InputPropsOmitted & ReactDatePickerPropsOmitted;\n\nexport function MonthDayPicker(props: MonthDayPickerProps): JSX.Element {\n\tconst {\n\t\tvalue,\n\t\tonChange,\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\tdisabled,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t\t...rest\n\t} = props;\n\n\tconst selected = value ? toDate(value) : null;\n\n\tconst inputProps = {\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\tdisabled,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t};\n\n\treturn (\n\t\t<DatePicker\n\t\t\t{...rest}\n\t\t\tselected={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalDate(date) : null);\n\t\t\t}}\n\t\t\tcustomInput={<Input {...inputProps} />}\n\t\t\trenderCustomHeader={MonthDayHeader}\n\t\t\tdateFormat=\"MMMM d\"\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;;;AAOU,MAAM,kCAAkC,EAAA;AAElD,MAAM,MAAS,GAAA,CAAC,SAAW,EAAA,UAAA,EAAY,OAAS,EAAA,OAAA,EAAS,KAAO,EAAA,MAAA,EAAQ,MAAQ,EAAA,QAAA,EAAU,WAAa,EAAA,SAAA,EAAW,YAAY,UAAU,CAAA,CAAA;AAgBxI,SAAA,cAAA,CAAwB,KAA4B,EAAA;AACnD,EAAA,iFAEG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAU,EAAA,iCAAA;AAAA,GAAA,EAAmC,OAAO,KAAM,CAAA,IAAA,CAAK,QAAS,EAAA,CAAG,mBAC/E,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IACL,SAAU,EAAA,qEAAA;AAAA,IACV,YAAW,EAAA,gBAAA;AAAA,IACX,SAAS,KAAM,CAAA,aAAA;AAAA,IACf,UAAU,KAAM,CAAA,uBAAA;AAAA,GAChB,EAAA,gBAED,mBACC,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IACA,IAAK,EAAA,QAAA;AAAA,IACL,SAAU,EAAA,iEAAA;AAAA,IACV,YAAW,EAAA,YAAA;AAAA,IACX,SAAS,KAAM,CAAA,aAAA;AAAA,IACf,UAAU,KAAM,CAAA,uBAAA;AAAA,GAAA,EAChB,YAED,CACD,CAAA,CAAA;AAEF,CAAA;AAYO,SAAA,cAAA,CAAwB,KAAyC,EAAA;AACvE,EAAM,MAAA;AAAA,IACL,KAAA;AAAA,IACA,QAAA;AAAA,IACA,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACG,GAAA,IAAA;AAAA,GACA,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,QAAW,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAEzC,EAAA,MAAM,UAAa,GAAA;AAAA,IAClB,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,GACD,CAAA;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IACI,GAAA,IAAA;AAAA,IACJ,QAAA;AAAA,IACA,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,IAAI,CAAA,CAAA;AAAA,KACvD;AAAA,IACA,6BAAc,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,MAAU,GAAA,UAAA;AAAA,KAAY,CAAA;AAAA,IACpC,kBAAoB,EAAA,cAAA;AAAA,IACpB,UAAW,EAAA,QAAA;AAAA,GACZ,CAAA,CAAA;AAEF;;;;"}
1
+ {"version":3,"file":"MonthDayPicker.js","sources":["../../../../src/date/MonthDayPicker/MonthDayPicker.tsx"],"sourcesContent":["import type {LocalDate} from '@js-joda/core';\nimport {DatePicker} from '@mantine/dates';\nimport type {DatePickerProps} from '@mantine/dates';\nimport {toDate, toLocalDate} from '@thx/date';\nimport debug from 'debug';\n\nconst d = debug('thx.controls.date.MonthDayPicker');\n\ninterface IMonthDayPickerProps {\n\tdefaultValue?: LocalDate | number | null;\n\tinitialMonth?: LocalDate | number | null;\n\tvalue?: LocalDate | number | null;\n\tonChange?: (value: LocalDate | null) => void;\n\tonChangeRaw?: (value: Date | null) => void;\n\tminDate?: LocalDate;\n\tmaxDate?: LocalDate;\n}\n\nexport type MonthDayPickerProps = IMonthDayPickerProps & Omit<DatePickerProps, 'onChange' | 'value'>;\n\nexport function MonthDayPicker(props: MonthDayPickerProps): JSX.Element {\n\tconst {defaultValue, initialMonth, minDate, maxDate, value, onChange, onChangeRaw, ...rest} = props;\n\n\tconst selected = value ? toDate(value) : null;\n\n\treturn (\n\t\t<DatePicker\n\t\t\tinputFormat=\"MMMM D\"\n\t\t\tlabelFormat=\"MMMM D\"\n\t\t\tdefaultValue={defaultValue ? toDate(defaultValue) : undefined}\n\t\t\tinitialMonth={initialMonth ? toDate(initialMonth) : undefined}\n\t\t\tallowFreeInput\n\t\t\tminDate={minDate ? toDate(minDate) : undefined}\n\t\t\tmaxDate={maxDate ? toDate(maxDate) : undefined}\n\t\t\tvalue={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalDate(date) : null);\n\t\t\t\tif (onChangeRaw) onChangeRaw(date);\n\t\t\t}}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;AAMU,MAAM,kCAAkC,EAAA;AAc3C,SAAA,cAAA,CAAwB,KAAyC,EAAA;AACvE,EAAM,MAAA,EAAC,cAAc,YAAc,EAAA,OAAA,EAAS,SAAS,KAAO,EAAA,QAAA,EAAU,gBAAgB,IAAQ,EAAA,GAAA,KAAA,CAAA;AAE9F,EAAA,MAAM,QAAW,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAEzC,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IACA,WAAY,EAAA,QAAA;AAAA,IACZ,WAAY,EAAA,QAAA;AAAA,IACZ,YAAc,EAAA,YAAA,GAAe,MAAO,CAAA,YAAY,CAAI,GAAA,KAAA,CAAA;AAAA,IACpD,YAAc,EAAA,YAAA,GAAe,MAAO,CAAA,YAAY,CAAI,GAAA,KAAA,CAAA;AAAA,IACpD,cAAc,EAAA,IAAA;AAAA,IACd,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,KAAA,CAAA;AAAA,IACrC,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,KAAA,CAAA;AAAA,IACrC,KAAO,EAAA,QAAA;AAAA,IACP,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,IAAI,CAAA,CAAA;AACtD,MAAI,IAAA,WAAA;AAAa,QAAA,WAAA,CAAY,IAAI,CAAA,CAAA;AAAA,KAClC;AAAA,IACI,GAAA,IAAA;AAAA,GACL,CAAA,CAAA;AAEF;;;;"}
@@ -1,71 +1,28 @@
1
1
  import React from 'react';
2
- import { LocalDate } from '@js-joda/core';
2
+ import { DatePicker } from '@mantine/dates';
3
3
  import { toDate, toLocalDate } from '@thx/date';
4
4
  import debug from 'debug';
5
- import { Input } from 'semantic-ui-react';
6
- import DatePicker from 'react-datepicker';
7
- import '../DatePicker/styles.css.js';
8
5
 
9
6
  debug("thx.controls.date.MonthYearPicker");
10
7
  function MonthYearPicker(props) {
11
- const {
12
- value,
13
- onChange,
14
- as,
15
- action,
16
- actionPosition,
17
- className,
18
- disabled,
19
- error,
20
- fluid,
21
- focus,
22
- icon,
23
- iconPosition,
24
- inverted,
25
- label,
26
- labelPosition,
27
- loading,
28
- size,
29
- tabIndex,
30
- transparent,
31
- minDate,
32
- maxDate,
33
- ...rest
34
- } = props;
8
+ const { defaultValue, initialMonth, minDate, maxDate, value, onChange, onChangeRaw, ...rest } = props;
35
9
  const selected = value ? toDate(value) : null;
36
- const inputProps = {
37
- as,
38
- action,
39
- actionPosition,
40
- className,
41
- disabled,
42
- error,
43
- fluid,
44
- focus,
45
- icon,
46
- iconPosition,
47
- inverted,
48
- label,
49
- labelPosition,
50
- loading,
51
- size,
52
- tabIndex,
53
- transparent
54
- };
55
10
  return /* @__PURE__ */ React.createElement(DatePicker, {
56
- ...rest,
57
- selected,
11
+ inputFormat: "MMMM YYYY",
12
+ labelFormat: "MMMM YYYY",
13
+ defaultValue: defaultValue ? toDate(defaultValue) : void 0,
14
+ initialMonth: initialMonth ? toDate(initialMonth) : void 0,
15
+ allowFreeInput: true,
16
+ minDate: minDate ? toDate(minDate) : void 0,
17
+ maxDate: maxDate ? toDate(maxDate) : void 0,
18
+ value: selected,
58
19
  onChange: (date) => {
59
20
  if (onChange)
60
- onChange(date ? toLocalDate(date) : void 0);
21
+ onChange(date ? toLocalDate(date) : null);
22
+ if (onChangeRaw)
23
+ onChangeRaw(date);
61
24
  },
62
- customInput: /* @__PURE__ */ React.createElement(Input, {
63
- ...inputProps
64
- }),
65
- dateFormat: "MMMM yyyy",
66
- showMonthYearPicker: true,
67
- minDate: toDate(minDate?.withDayOfMonth(1) || LocalDate.ofEpochDay(0)),
68
- maxDate: toDate(maxDate?.plusMonths(1).withDayOfMonth(1).minusDays(1) || LocalDate.now().plusYears(20))
25
+ ...rest
69
26
  });
70
27
  }
71
28
 
@@ -1 +1 @@
1
- {"version":3,"file":"MonthYearPicker.js","sources":["../../../../src/date/MonthYearPicker/MonthYearPicker.tsx"],"sourcesContent":["import {LocalDate} from '@js-joda/core';\nimport {toDate, toLocalDate} from '@thx/date';\nimport debug from 'debug';\nimport type {ReactDatePickerProps} from 'react-datepicker';\nimport {InputProps, Input} from 'semantic-ui-react';\nimport {DatePicker} from '../DatePicker/index';\n\nconst d = debug('thx.controls.date.MonthYearPicker');\n\ninterface IMonthYearPickerProps {\n\tvalue?: LocalDate | number | undefined;\n\tonChange?: (value: LocalDate | undefined) => void;\n\tonChangeRaw?: () => void;\n\tminDate?: LocalDate | undefined;\n\tmaxDate?: LocalDate | undefined;\n}\n\ntype InputPropsOmitted = Omit<InputProps, 'onChange'>;\ntype ReactDatePickerPropsOmitted = Omit<Omit<ReactDatePickerProps, 'value' | 'minDate' | 'maxDate'>, 'onChange'>;\nexport type MonthYearPickerProps = IMonthYearPickerProps & InputPropsOmitted & ReactDatePickerPropsOmitted;\n\nexport function MonthYearPicker(props: MonthYearPickerProps): JSX.Element {\n\tconst {\n\t\tvalue,\n\t\tonChange,\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\tdisabled,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t\tminDate,\n\t\tmaxDate,\n\t\t...rest\n\t} = props;\n\n\tconst selected = value ? toDate(value) : null;\n\n\tconst inputProps = {\n\t\tas,\n\t\taction,\n\t\tactionPosition,\n\t\tclassName,\n\t\tdisabled,\n\t\terror,\n\t\tfluid,\n\t\tfocus,\n\t\ticon,\n\t\ticonPosition,\n\t\tinverted,\n\t\tlabel,\n\t\tlabelPosition,\n\t\tloading,\n\t\tsize,\n\t\ttabIndex,\n\t\ttransparent,\n\t};\n\n\treturn (\n\t\t<DatePicker\n\t\t\t{...rest}\n\t\t\tselected={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalDate(date) : undefined);\n\t\t\t}}\n\t\t\tcustomInput={<Input {...inputProps} />}\n\t\t\tdateFormat=\"MMMM yyyy\"\n\t\t\tshowMonthYearPicker\n\t\t\tminDate={toDate(minDate?.withDayOfMonth(1) || LocalDate.ofEpochDay(0))}\n\t\t\tmaxDate={toDate(maxDate?.plusMonths(1).withDayOfMonth(1).minusDays(1) || LocalDate.now().plusYears(20))}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;;;;AAOU,MAAM,mCAAmC,EAAA;AAc5C,SAAA,eAAA,CAAyB,KAA0C,EAAA;AACzE,EAAM,MAAA;AAAA,IACL,KAAA;AAAA,IACA,QAAA;AAAA,IACA,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACG,GAAA,IAAA;AAAA,GACA,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,QAAW,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAEzC,EAAA,MAAM,UAAa,GAAA;AAAA,IAClB,EAAA;AAAA,IACA,MAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA;AAAA,IACA,IAAA;AAAA,IACA,YAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,GACD,CAAA;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IACI,GAAA,IAAA;AAAA,IACJ,QAAA;AAAA,IACA,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,KAAS,CAAA,CAAA,CAAA;AAAA,KAC5D;AAAA,IACA,6BAAc,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,MAAU,GAAA,UAAA;AAAA,KAAY,CAAA;AAAA,IACpC,UAAW,EAAA,WAAA;AAAA,IACX,mBAAmB,EAAA,IAAA;AAAA,IACnB,OAAA,EAAS,OAAO,OAAS,EAAA,cAAA,CAAe,CAAC,CAAK,IAAA,SAAA,CAAU,UAAW,CAAA,CAAC,CAAC,CAAA;AAAA,IACrE,SAAS,MAAO,CAAA,OAAA,EAAS,UAAW,CAAA,CAAC,EAAE,cAAe,CAAA,CAAC,CAAE,CAAA,SAAA,CAAU,CAAC,CAAK,IAAA,SAAA,CAAU,KAAM,CAAA,SAAA,CAAU,EAAE,CAAC,CAAA;AAAA,GACvG,CAAA,CAAA;AAEF;;;;"}
1
+ {"version":3,"file":"MonthYearPicker.js","sources":["../../../../src/date/MonthYearPicker/MonthYearPicker.tsx"],"sourcesContent":["import type {LocalDate} from '@js-joda/core';\nimport {DatePicker} from '@mantine/dates';\nimport type {DatePickerProps} from '@mantine/dates';\nimport {toDate, toLocalDate} from '@thx/date';\nimport debug from 'debug';\n\nconst d = debug('thx.controls.date.MonthYearPicker');\n\ninterface IMonthYearPickerProps {\n\tdefaultValue?: LocalDate | number | null;\n\tinitialMonth?: LocalDate | number | null;\n\tvalue?: LocalDate | number | null;\n\tonChange?: (value: LocalDate | null) => void;\n\tonChangeRaw?: (value: Date | null) => void;\n\tminDate?: LocalDate;\n\tmaxDate?: LocalDate;\n}\n\nexport type MonthYearPickerProps = IMonthYearPickerProps & Omit<DatePickerProps, 'onChange' | 'value' | 'minDate' | 'maxDate'>;\n\nexport function MonthYearPicker(props: MonthYearPickerProps): JSX.Element {\n\tconst {defaultValue, initialMonth, minDate, maxDate, value, onChange, onChangeRaw, ...rest} = props;\n\n\tconst selected = value ? toDate(value) : null;\n\n\treturn (\n\t\t<DatePicker\n\t\t\tinputFormat=\"MMMM YYYY\"\n\t\t\tlabelFormat=\"MMMM YYYY\"\n\t\t\tdefaultValue={defaultValue ? toDate(defaultValue) : undefined}\n\t\t\tinitialMonth={initialMonth ? toDate(initialMonth) : undefined}\n\t\t\tallowFreeInput\n\t\t\tminDate={minDate ? toDate(minDate) : undefined}\n\t\t\tmaxDate={maxDate ? toDate(maxDate) : undefined}\n\t\t\tvalue={selected}\n\t\t\tonChange={date => {\n\t\t\t\tif (onChange) onChange(date ? toLocalDate(date) : null);\n\t\t\t\tif (onChangeRaw) onChangeRaw(date);\n\t\t\t}}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"names":[],"mappings":";;;;;AAMU,MAAM,mCAAmC,EAAA;AAc5C,SAAA,eAAA,CAAyB,KAA0C,EAAA;AACzE,EAAM,MAAA,EAAC,cAAc,YAAc,EAAA,OAAA,EAAS,SAAS,KAAO,EAAA,QAAA,EAAU,gBAAgB,IAAQ,EAAA,GAAA,KAAA,CAAA;AAE9F,EAAA,MAAM,QAAW,GAAA,KAAA,GAAQ,MAAO,CAAA,KAAK,CAAI,GAAA,IAAA,CAAA;AAEzC,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IACA,WAAY,EAAA,WAAA;AAAA,IACZ,WAAY,EAAA,WAAA;AAAA,IACZ,YAAc,EAAA,YAAA,GAAe,MAAO,CAAA,YAAY,CAAI,GAAA,KAAA,CAAA;AAAA,IACpD,YAAc,EAAA,YAAA,GAAe,MAAO,CAAA,YAAY,CAAI,GAAA,KAAA,CAAA;AAAA,IACpD,cAAc,EAAA,IAAA;AAAA,IACd,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,KAAA,CAAA;AAAA,IACrC,OAAS,EAAA,OAAA,GAAU,MAAO,CAAA,OAAO,CAAI,GAAA,KAAA,CAAA;AAAA,IACrC,KAAO,EAAA,QAAA;AAAA,IACP,UAAU,CAAQ,IAAA,KAAA;AACjB,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAO,GAAA,WAAA,CAAY,IAAI,CAAA,GAAI,IAAI,CAAA,CAAA;AACtD,MAAI,IAAA,WAAA;AAAa,QAAA,WAAA,CAAY,IAAI,CAAA,CAAA;AAAA,KAClC;AAAA,IACI,GAAA,IAAA;AAAA,GACL,CAAA,CAAA;AAEF;;;;"}
@@ -1,61 +1,47 @@
1
1
  import React from 'react';
2
+ import { Group, Button, NumberInput } from '@mantine/core';
2
3
  import debug from 'debug';
3
- import { Segment, Button, Icon, Dropdown } from 'semantic-ui-react';
4
+ import { ArrowLeft, ArrowRight } from 'tabler-icons-react';
4
5
 
5
6
  debug("thx.controls.date.YearSelect");
6
7
  function YearSelect(props) {
7
8
  const thisYear = new Date().getFullYear();
8
- const { value, minYear = 1970, maxYear = thisYear, onChange, onBlur, error, ...rest } = props;
9
- const availableYears = [];
10
- for (let i = maxYear; i >= minYear; i--) {
11
- availableYears.push({ value: i, text: i.toString(), key: i });
12
- }
13
- return /* @__PURE__ */ React.createElement(Segment, {
14
- basic: true,
9
+ const { value, minYear = 1970, maxYear = thisYear, onChange, error } = props;
10
+ const buttonProps = {
11
+ size: "sm",
15
12
  compact: true,
16
- style: { padding: 0, margin: 0 },
17
- ...rest
13
+ variant: "outline",
14
+ sx: { height: 36 }
15
+ };
16
+ return /* @__PURE__ */ React.createElement(Group, {
17
+ spacing: 2
18
18
  }, /* @__PURE__ */ React.createElement(Button, {
19
- basic: true,
20
- icon: true,
21
- type: "button",
22
- color: error ? "red" : "green",
19
+ ...buttonProps,
23
20
  disabled: value <= minYear,
24
21
  onClick: () => {
25
22
  if (onChange)
26
23
  onChange(value - 1);
27
- },
28
- onBlur
29
- }, /* @__PURE__ */ React.createElement(Icon, {
30
- name: "arrow left"
31
- })), /* @__PURE__ */ React.createElement(Dropdown, {
32
- icon: /* @__PURE__ */ React.createElement("div", null),
33
- button: true,
34
- basic: true,
35
- scrolling: true,
24
+ }
25
+ }, /* @__PURE__ */ React.createElement(ArrowLeft, null)), /* @__PURE__ */ React.createElement(NumberInput, {
26
+ hideControls: true,
36
27
  value,
37
- options: availableYears,
38
- onChange: (e, val) => {
39
- if (typeof val.value === "number" && onChange)
40
- onChange(val.value);
28
+ max: maxYear,
29
+ min: minYear,
30
+ onChange: (v) => {
31
+ if (v && onChange) {
32
+ onChange(v);
33
+ }
41
34
  },
42
- error,
43
- onBlur
35
+ sx: { width: "4rem" },
36
+ styles: { input: { borderColor: error ? "red" : void 0, textAlign: "center" } }
44
37
  }), /* @__PURE__ */ React.createElement(Button, {
45
- basic: true,
46
- icon: true,
47
- type: "button",
48
- color: error ? "red" : "green",
38
+ ...buttonProps,
49
39
  disabled: value >= maxYear,
50
40
  onClick: () => {
51
41
  if (onChange)
52
42
  onChange(value + 1);
53
- },
54
- onBlur,
55
- style: { marginRight: 0 }
56
- }, /* @__PURE__ */ React.createElement(Icon, {
57
- name: "arrow right"
58
- })));
43
+ }
44
+ }, /* @__PURE__ */ React.createElement(ArrowRight, null)));
59
45
  }
60
46
 
61
47
  export { YearSelect };
@@ -1 +1 @@
1
- {"version":3,"file":"YearSelect.js","sources":["../../../../src/date/YearSelect/YearSelect.tsx"],"sourcesContent":["import debug from 'debug';\nimport {Icon, Button, Dropdown, DropdownItemProps, Segment, SegmentProps} from 'semantic-ui-react';\n\nconst d = debug('thx.controls.date.YearSelect');\n\nexport interface YearSelectProps {\n\tonChange?: (value: number) => void;\n\tonBlur?: (ev: any) => void;\n\tvalue: number;\n\tminYear?: number; // Defaults to 1970\n\tmaxYear?: number; // Defaults to current year\n\terror?: boolean; // Defaults to false\n}\n\nexport function YearSelect(props: YearSelectProps & Omit<SegmentProps, 'onChange'>) {\n\tconst thisYear = new Date().getFullYear();\n\tconst {value, minYear = 1970, maxYear = thisYear, onChange, onBlur, error, ...rest} = props;\n\n\tconst availableYears: DropdownItemProps[] = [];\n\tfor (let i = maxYear; i >= minYear; i--) {\n\t\tavailableYears.push({value: i, text: i.toString(), key: i});\n\t}\n\n\treturn (\n\t\t<Segment basic compact style={{padding: 0, margin: 0}} {...rest}>\n\t\t\t<Button\n\t\t\t\tbasic\n\t\t\t\ticon\n\t\t\t\ttype=\"button\"\n\t\t\t\tcolor={error ? 'red' : 'green'}\n\t\t\t\tdisabled={value <= minYear}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (onChange) onChange(value - 1);\n\t\t\t\t}}\n\t\t\t\tonBlur={onBlur}\n\t\t\t>\n\t\t\t\t<Icon name=\"arrow left\" />\n\t\t\t</Button>\n\t\t\t<Dropdown\n\t\t\t\ticon={<div />}\n\t\t\t\tbutton\n\t\t\t\tbasic\n\t\t\t\tscrolling\n\t\t\t\tvalue={value}\n\t\t\t\toptions={availableYears}\n\t\t\t\tonChange={(e, val) => {\n\t\t\t\t\tif (typeof val.value === 'number' && onChange) onChange(val.value);\n\t\t\t\t}}\n\t\t\t\terror={error}\n\t\t\t\tonBlur={onBlur}\n\t\t\t/>\n\t\t\t<Button\n\t\t\t\tbasic\n\t\t\t\ticon\n\t\t\t\ttype=\"button\"\n\t\t\t\tcolor={error ? 'red' : 'green'}\n\t\t\t\tdisabled={value >= maxYear}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (onChange) onChange(value + 1);\n\t\t\t\t}}\n\t\t\t\tonBlur={onBlur}\n\t\t\t\tstyle={{marginRight: 0}}\n\t\t\t>\n\t\t\t\t<Icon name=\"arrow right\" />\n\t\t\t</Button>\n\t\t</Segment>\n\t);\n}\n"],"names":[],"mappings":";;;;AAGU,MAAM,8BAA8B,EAAA;AAWvC,SAAA,UAAA,CAAoB,KAAyD,EAAA;AACnF,EAAA,MAAM,QAAW,GAAA,IAAI,IAAK,EAAA,CAAE,WAAY,EAAA,CAAA;AACxC,EAAM,MAAA,EAAC,OAAO,OAAU,GAAA,IAAA,EAAM,UAAU,QAAU,EAAA,QAAA,EAAU,MAAQ,EAAA,KAAA,EAAA,GAAU,IAAQ,EAAA,GAAA,KAAA,CAAA;AAEtF,EAAA,MAAM,iBAAsC,EAAC,CAAA;AAC7C,EAAA,KAAA,IAAS,CAAI,GAAA,OAAA,EAAS,CAAK,IAAA,OAAA,EAAS,CAAK,EAAA,EAAA;AACxC,IAAe,cAAA,CAAA,IAAA,CAAK,EAAC,KAAA,EAAO,CAAG,EAAA,IAAA,EAAM,EAAE,QAAS,EAAA,EAAG,GAAK,EAAA,CAAA,EAAE,CAAA,CAAA;AAAA,GAC3D;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA;AAAA,IAAQ,KAAK,EAAA,IAAA;AAAA,IAAC,OAAO,EAAA,IAAA;AAAA,IAAC,KAAO,EAAA,EAAC,OAAS,EAAA,CAAA,EAAG,QAAQ,CAAC,EAAA;AAAA,IAAO,GAAA,IAAA;AAAA,GAAA,kBACzD,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACA,KAAK,EAAA,IAAA;AAAA,IACL,IAAI,EAAA,IAAA;AAAA,IACJ,IAAK,EAAA,QAAA;AAAA,IACL,KAAA,EAAO,QAAQ,KAAQ,GAAA,OAAA;AAAA,IACvB,UAAU,KAAS,IAAA,OAAA;AAAA,IACnB,SAAS,MAAM;AACd,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,QAAQ,CAAC,CAAA,CAAA;AAAA,KACjC;AAAA,IACA,MAAA;AAAA,GAAA,kBAEC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,IAAK,EAAA,YAAA;AAAA,GAAa,CACzB,mBACC,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IACA,IAAA,sCAAO,KAAI,EAAA,IAAA,CAAA;AAAA,IACX,MAAM,EAAA,IAAA;AAAA,IACN,KAAK,EAAA,IAAA;AAAA,IACL,SAAS,EAAA,IAAA;AAAA,IACT,KAAA;AAAA,IACA,OAAS,EAAA,cAAA;AAAA,IACT,QAAA,EAAU,CAAC,CAAA,EAAG,GAAQ,KAAA;AACrB,MAAI,IAAA,OAAO,GAAI,CAAA,KAAA,KAAU,QAAY,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,IAAI,KAAK,CAAA,CAAA;AAAA,KAClE;AAAA,IACA,KAAA;AAAA,IACA,MAAA;AAAA,GACD,mBACC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACA,KAAK,EAAA,IAAA;AAAA,IACL,IAAI,EAAA,IAAA;AAAA,IACJ,IAAK,EAAA,QAAA;AAAA,IACL,KAAA,EAAO,QAAQ,KAAQ,GAAA,OAAA;AAAA,IACvB,UAAU,KAAS,IAAA,OAAA;AAAA,IACnB,SAAS,MAAM;AACd,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,QAAQ,CAAC,CAAA,CAAA;AAAA,KACjC;AAAA,IACA,MAAA;AAAA,IACA,KAAA,EAAO,EAAC,WAAA,EAAa,CAAC,EAAA;AAAA,GAAA,kBAErB,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,IAAK,EAAA,aAAA;AAAA,GAAc,CAC1B,CACD,CAAA,CAAA;AAEF;;;;"}
1
+ {"version":3,"file":"YearSelect.js","sources":["../../../../src/date/YearSelect/YearSelect.tsx"],"sourcesContent":["import {Button, ButtonProps, Group, NumberInput} from '@mantine/core';\nimport debug from 'debug';\nimport {ArrowLeft, ArrowRight} from 'tabler-icons-react';\n\nconst d = debug('thx.controls.date.YearSelect');\n\nexport interface YearSelectProps {\n\tonChange?: (value: number) => void;\n\tvalue: number;\n\tminYear?: number; // Defaults to 1970\n\tmaxYear?: number; // Defaults to current year\n\terror?: boolean; // Defaults to false\n}\n\nexport function YearSelect(props: YearSelectProps) {\n\tconst thisYear = new Date().getFullYear();\n\tconst {value, minYear = 1970, maxYear = thisYear, onChange, error} = props;\n\n\tconst buttonProps: ButtonProps<any> = {\n\t\tsize: 'sm',\n\t\tcompact: true,\n\t\tvariant: 'outline',\n\t\tsx: {height: 36},\n\t};\n\n\treturn (\n\t\t<Group spacing={2}>\n\t\t\t<Button\n\t\t\t\t{...buttonProps}\n\t\t\t\tdisabled={value <= minYear}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (onChange) onChange(value - 1);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<ArrowLeft />\n\t\t\t</Button>\n\t\t\t<NumberInput\n\t\t\t\thideControls\n\t\t\t\tvalue={value}\n\t\t\t\tmax={maxYear}\n\t\t\t\tmin={minYear}\n\t\t\t\tonChange={v => {\n\t\t\t\t\tif (v && onChange) {\n\t\t\t\t\t\tonChange(v);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tsx={{width: '4rem'}}\n\t\t\t\tstyles={{input: {borderColor: error ? 'red' : undefined, textAlign: 'center'}}}\n\t\t\t/>\n\t\t\t<Button\n\t\t\t\t{...buttonProps}\n\t\t\t\tdisabled={value >= maxYear}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (onChange) onChange(value + 1);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<ArrowRight />\n\t\t\t</Button>\n\t\t</Group>\n\t);\n}\n"],"names":[],"mappings":";;;;;AAIU,MAAM,8BAA8B,EAAA;AAUvC,SAAA,UAAA,CAAoB,KAAwB,EAAA;AAClD,EAAA,MAAM,QAAW,GAAA,IAAI,IAAK,EAAA,CAAE,WAAY,EAAA,CAAA;AACxC,EAAA,MAAM,EAAC,KAAO,EAAA,OAAA,GAAU,MAAM,OAAU,GAAA,QAAA,EAAU,UAAU,KAAS,EAAA,GAAA,KAAA,CAAA;AAErE,EAAA,MAAM,WAAgC,GAAA;AAAA,IACrC,IAAM,EAAA,IAAA;AAAA,IACN,OAAS,EAAA,IAAA;AAAA,IACT,OAAS,EAAA,SAAA;AAAA,IACT,EAAA,EAAI,EAAC,MAAA,EAAQ,EAAE,EAAA;AAAA,GAChB,CAAA;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,IAAM,OAAS,EAAA,CAAA;AAAA,GAAA,kBACd,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACI,GAAA,WAAA;AAAA,IACJ,UAAU,KAAS,IAAA,OAAA;AAAA,IACnB,SAAS,MAAM;AACd,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,QAAQ,CAAC,CAAA,CAAA;AAAA,KACjC;AAAA,GAAA,kBAEC,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,IAAU,CACZ,CAAA,kBACC,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAA,IACA,YAAY,EAAA,IAAA;AAAA,IACZ,KAAA;AAAA,IACA,GAAK,EAAA,OAAA;AAAA,IACL,GAAK,EAAA,OAAA;AAAA,IACL,UAAU,CAAK,CAAA,KAAA;AACd,MAAA,IAAI,KAAK,QAAU,EAAA;AAClB,QAAA,QAAA,CAAS,CAAC,CAAA,CAAA;AAAA,OACX;AAAA,KACD;AAAA,IACA,EAAA,EAAI,EAAC,KAAA,EAAO,MAAM,EAAA;AAAA,IAClB,MAAA,EAAQ,EAAC,KAAA,EAAO,EAAC,WAAA,EAAa,QAAQ,KAAQ,GAAA,KAAA,CAAA,EAAW,SAAW,EAAA,QAAA,EAAS,EAAA;AAAA,GAC9E,mBACC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IACI,GAAA,WAAA;AAAA,IACJ,UAAU,KAAS,IAAA,OAAA;AAAA,IACnB,SAAS,MAAM;AACd,MAAI,IAAA,QAAA;AAAU,QAAA,QAAA,CAAS,QAAQ,CAAC,CAAA,CAAA;AAAA,KACjC;AAAA,GAEA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,IAAA,CACb,CACD,CAAA,CAAA;AAEF;;;;"}