@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.
- package/dist/esm/date/LocalDatePicker/LocalDatePicker.js +11 -54
- package/dist/esm/date/LocalDatePicker/LocalDatePicker.js.map +1 -1
- package/dist/esm/date/LocalMonthSelect/LocalMonthSelect.js +19 -23
- package/dist/esm/date/LocalMonthSelect/LocalMonthSelect.js.map +1 -1
- package/dist/esm/date/LocalTimePicker/LocalTimePicker.js +6 -55
- package/dist/esm/date/LocalTimePicker/LocalTimePicker.js.map +1 -1
- package/dist/esm/date/MonthDayPicker/MonthDayPicker.js +13 -69
- package/dist/esm/date/MonthDayPicker/MonthDayPicker.js.map +1 -1
- package/dist/esm/date/MonthYearPicker/MonthYearPicker.js +14 -57
- package/dist/esm/date/MonthYearPicker/MonthYearPicker.js.map +1 -1
- package/dist/esm/date/YearSelect/YearSelect.js +25 -39
- package/dist/esm/date/YearSelect/YearSelect.js.map +1 -1
- package/dist/esm/form/TForm/useTForm.js +12 -8
- package/dist/esm/form/TForm/useTForm.js.map +1 -1
- package/dist/esm/form/TMForm/TMForm.js +55 -0
- package/dist/esm/form/TMForm/TMForm.js.map +1 -0
- package/dist/esm/form/TMForm/errorMessages.js +39 -0
- package/dist/esm/form/TMForm/errorMessages.js.map +1 -0
- package/dist/esm/form/TMForm/graphqlErrorTypes.js +6 -0
- package/dist/esm/form/TMForm/graphqlErrorTypes.js.map +1 -0
- package/dist/esm/index.js +1 -23
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/inputs/MaskedInput/MaskedInput.js +5 -8
- package/dist/esm/inputs/MaskedInput/MaskedInput.js.map +1 -1
- package/dist/esm/inputs/MaskedInput/useMaskedInput.js +2 -3
- package/dist/esm/inputs/MaskedInput/useMaskedInput.js.map +1 -1
- package/dist/esm/inputs/PhoneInput/PhoneInput.js.map +1 -1
- package/dist/stats.html +1 -1
- package/dist/stats.txt +26 -86
- package/dist/types/commonTypes.d.ts +1 -0
- package/dist/types/date/LocalDatePicker/LocalDatePicker.d.ts +5 -7
- package/dist/types/date/LocalDatePicker/localdatepicker.stories.d.ts +6 -0
- package/dist/types/date/LocalMonthSelect/LocalMonthSelect.d.ts +2 -3
- package/dist/types/date/LocalMonthSelect/localmonthselect.stories.d.ts +5 -0
- package/dist/types/date/LocalTimePicker/LocalTimePicker.d.ts +2 -6
- package/dist/types/date/LocalTimePicker/localtimepicker.stories.d.ts +5 -0
- package/dist/types/date/MonthDayPicker/MonthDayPicker.d.ts +7 -6
- package/dist/types/date/MonthDayPicker/monthdaypicker.stories.d.ts +5 -0
- package/dist/types/date/MonthYearPicker/MonthYearPicker.d.ts +10 -11
- package/dist/types/date/MonthYearPicker/monthyearpicker.stories.d.ts +6 -0
- package/dist/types/date/YearSelect/YearSelect.d.ts +1 -3
- package/dist/types/date/YearSelect/yearselect.stories.d.ts +7 -0
- package/dist/types/form/TForm/tform.stories.d.ts +19 -0
- package/dist/types/form/TForm/types.d.ts +32 -0
- package/dist/types/form/TMForm/TMForm.d.ts +8 -0
- package/dist/types/form/TMForm/errorMessages.d.ts +5 -0
- package/dist/types/form/TMForm/graphqlErrorTypes.d.ts +50 -0
- package/dist/types/form/TMForm/tmform.stories.d.ts +12 -0
- package/dist/types/index.d.ts +2 -19
- package/dist/types/inputs/CreditCardInput/CreditCardInput.d.ts +3 -2
- package/dist/types/inputs/CreditCardInput/CreditCardNumberInput.d.ts +2 -2
- package/dist/types/inputs/CreditCardInput/creditcardinput.stories.d.ts +5 -0
- package/dist/types/inputs/CreditCardInput/creditcardnumberinput.stories.d.ts +5 -0
- package/dist/types/inputs/MaskedInput/MaskedInput.d.ts +2 -3
- package/dist/types/inputs/MaskedInput/maskedinput.stories.d.ts +6 -0
- package/dist/types/inputs/MaskedInput/useMaskedInput.d.ts +10 -0
- package/dist/types/inputs/PhoneInput/PhoneInput.d.ts +1 -2
- package/dist/types/inputs/PhoneInput/phoneinput.stories.d.ts +5 -0
- package/dist/types/inputs/RadioGroup/radiogroup.stories.d.ts +5 -0
- package/dist/types/inputs/SinInput/SinInput.d.ts +0 -1
- package/dist/types/inputs/SinInput/sininput.stories.d.ts +5 -0
- package/dist/types/inputs/TableInput/DropdownCell.d.ts +3 -2
- package/dist/types/inputs/TableInput/HoverCell.d.ts +6 -0
- package/dist/types/inputs/TableInput/MoneyCell.d.ts +8 -0
- package/dist/types/inputs/TableInput/MoneyEditCell.d.ts +2 -1
- package/dist/types/inputs/TableInput/MoneySumFooter.d.ts +6 -0
- package/dist/types/inputs/TableInput/StringEditCell.d.ts +2 -2
- package/dist/types/inputs/TableInput/TableInput.d.ts +5 -2
- package/dist/types/inputs/TableInput/addRowOnTab.d.ts +1 -0
- package/dist/types/inputs/TableInput/main.story.d.ts +7 -0
- package/dist/types/inputs/TableInput/tableinput.stories.d.ts +5 -0
- package/dist/types/inputs/TableInput/withHover.story.d.ts +7 -0
- package/dist/types/money/MoneyCurrencyInput/MoneyCurrencyInput.d.ts +2 -4
- package/dist/types/money/MoneyCurrencyInput/moneycurrencyinput.stories.d.ts +5 -0
- package/dist/types/money/MoneyInput/MoneyInput.d.ts +4 -5
- package/dist/types/money/MoneyInput/moneyinput.stories.d.ts +6 -0
- package/dist/types/money/useMoneyInput.d.ts +13 -0
- package/dist/types/storyDecorator.d.ts +6 -0
- package/package.json +13 -10
- package/dist/esm/date/DatePicker/styles.css.js +0 -7
- package/dist/esm/date/DatePicker/styles.css.js.map +0 -1
- package/dist/esm/date/LocalDatePicker/MaskedDateInput.js +0 -22
- package/dist/esm/date/LocalDatePicker/MaskedDateInput.js.map +0 -1
- package/dist/esm/date/LocalTimePicker/MaskedTimeInput.js +0 -21
- package/dist/esm/date/LocalTimePicker/MaskedTimeInput.js.map +0 -1
- package/dist/esm/external/style-inject/dist/style-inject.es.js +0 -29
- package/dist/esm/external/style-inject/dist/style-inject.es.js.map +0 -1
- package/dist/esm/inputs/CreditCardInput/CreditCardInput.js +0 -71
- package/dist/esm/inputs/CreditCardInput/CreditCardInput.js.map +0 -1
- package/dist/esm/inputs/CreditCardInput/CreditCardNumberInput.js +0 -76
- package/dist/esm/inputs/CreditCardInput/CreditCardNumberInput.js.map +0 -1
- package/dist/esm/inputs/CreditCardInput/styles.css.js +0 -7
- package/dist/esm/inputs/CreditCardInput/styles.css.js.map +0 -1
- package/dist/esm/inputs/RadioGroup/RadioGroup.js +0 -25
- package/dist/esm/inputs/RadioGroup/RadioGroup.js.map +0 -1
- package/dist/esm/inputs/Scriptel/Scriptel.js +0 -52
- package/dist/esm/inputs/Scriptel/Scriptel.js.map +0 -1
- package/dist/esm/inputs/Scriptel/ScriptelContext.js +0 -6
- package/dist/esm/inputs/Scriptel/ScriptelContext.js.map +0 -1
- package/dist/esm/inputs/Scriptel/scriptel/enums.js +0 -21
- package/dist/esm/inputs/Scriptel/scriptel/enums.js.map +0 -1
- package/dist/esm/inputs/Scriptel/scriptel/index.js +0 -93
- package/dist/esm/inputs/Scriptel/scriptel/index.js.map +0 -1
- package/dist/esm/inputs/Scriptel/withScriptel.js +0 -15
- package/dist/esm/inputs/Scriptel/withScriptel.js.map +0 -1
- package/dist/esm/inputs/ScriptelInput/ScriptelInput.js +0 -67
- package/dist/esm/inputs/ScriptelInput/ScriptelInput.js.map +0 -1
- package/dist/esm/inputs/SinInput/SinInput.js +0 -54
- package/dist/esm/inputs/SinInput/SinInput.js.map +0 -1
- package/dist/esm/inputs/TableInput/DropdownCell.js +0 -26
- package/dist/esm/inputs/TableInput/DropdownCell.js.map +0 -1
- package/dist/esm/inputs/TableInput/HoverCell.js +0 -20
- package/dist/esm/inputs/TableInput/HoverCell.js.map +0 -1
- package/dist/esm/inputs/TableInput/LocalDateCell.js +0 -13
- package/dist/esm/inputs/TableInput/LocalDateCell.js.map +0 -1
- package/dist/esm/inputs/TableInput/LocalDateEditCell.js +0 -29
- package/dist/esm/inputs/TableInput/LocalDateEditCell.js.map +0 -1
- package/dist/esm/inputs/TableInput/MoneyCell.js +0 -13
- package/dist/esm/inputs/TableInput/MoneyCell.js.map +0 -1
- package/dist/esm/inputs/TableInput/MoneyEditCell.js +0 -30
- package/dist/esm/inputs/TableInput/MoneyEditCell.js.map +0 -1
- package/dist/esm/inputs/TableInput/MoneySumFooter.js +0 -15
- package/dist/esm/inputs/TableInput/MoneySumFooter.js.map +0 -1
- package/dist/esm/inputs/TableInput/StringEditCell.js +0 -34
- package/dist/esm/inputs/TableInput/StringEditCell.js.map +0 -1
- package/dist/esm/inputs/TableInput/TableInput.js +0 -75
- package/dist/esm/inputs/TableInput/TableInput.js.map +0 -1
- package/dist/esm/inputs/TableInput/addRowOnTab.js +0 -13
- package/dist/esm/inputs/TableInput/addRowOnTab.js.map +0 -1
- package/dist/esm/money/MoneyCurrencyInput/MoneyCurrencyInput.js +0 -51
- package/dist/esm/money/MoneyCurrencyInput/MoneyCurrencyInput.js.map +0 -1
- package/dist/esm/money/MoneyInput/MoneyInput.js +0 -31
- package/dist/esm/money/MoneyInput/MoneyInput.js.map +0 -1
- package/dist/esm/money/useMoneyInput.js +0 -75
- package/dist/esm/money/useMoneyInput.js.map +0 -1
- package/dist/esm/step/FormStep.js +0 -17
- package/dist/esm/step/FormStep.js.map +0 -1
- package/dist/esm/step/Step.js +0 -10
- package/dist/esm/step/Step.js.map +0 -1
- package/dist/esm/step/StepProvider.js +0 -95
- package/dist/esm/step/StepProvider.js.map +0 -1
- package/dist/esm/step/stepContext.js +0 -10
- package/dist/esm/step/stepContext.js.map +0 -1
- package/dist/esm/step/useStep.js +0 -10
- package/dist/esm/step/useStep.js.map +0 -1
- package/dist/types/date/LocalDatePicker/MaskedDateInput.d.ts +0 -12
- package/dist/types/date/LocalTimePicker/MaskedTimeInput.d.ts +0 -11
- package/dist/types/inputs/CreditCardInput/index.d.ts +0 -2
- package/dist/types/inputs/RadioGroup/RadioGroup.d.ts +0 -8
- package/dist/types/inputs/RadioGroup/index.d.ts +0 -2
- package/dist/types/inputs/ScriptelInput/ScriptelInput.d.ts +0 -8
- package/dist/types/inputs/ScriptelInput/index.d.ts +0 -2
- package/dist/types/inputs/SinInput/index.d.ts +0 -2
- package/dist/types/inputs/TableInput/LocalDateCell.d.ts +0 -8
- package/dist/types/inputs/TableInput/LocalDateEditCell.d.ts +0 -3
- package/dist/types/inputs/TableInput/index.d.ts +0 -11
- package/dist/types/money/MoneyCurrencyInput/index.d.ts +0 -2
- package/dist/types/step/StepProvider.d.ts +0 -10
- 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
|
-
|
|
55
|
-
|
|
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
|
-
|
|
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 {
|
|
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
|
-
{
|
|
9
|
-
{
|
|
10
|
-
{
|
|
11
|
-
{
|
|
12
|
-
{
|
|
13
|
-
{
|
|
14
|
-
{
|
|
15
|
-
{
|
|
16
|
-
{
|
|
17
|
-
{
|
|
18
|
-
{
|
|
19
|
-
{
|
|
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,
|
|
22
|
+
const { value, onChange, year, ...rest } = props;
|
|
23
23
|
const theYear = year || LocalDate.now().year();
|
|
24
24
|
return /* @__PURE__ */ React.createElement(Select, {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
onChange: (ev, v) => {
|
|
25
|
+
data: monthOptions,
|
|
26
|
+
value: value ? `${value.monthValue()}` : null,
|
|
27
|
+
onChange: (v) => {
|
|
29
28
|
if (onChange) {
|
|
30
|
-
if (
|
|
31
|
-
onChange(
|
|
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
|
|
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
|
-
|
|
39
|
-
|
|
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
|
-
|
|
65
|
-
|
|
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 {
|
|
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
|
-
|
|
72
|
-
|
|
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
|
-
|
|
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 {
|
|
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 {
|
|
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
|
-
|
|
57
|
-
|
|
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) :
|
|
21
|
+
onChange(date ? toLocalDate(date) : null);
|
|
22
|
+
if (onChangeRaw)
|
|
23
|
+
onChangeRaw(date);
|
|
61
24
|
},
|
|
62
|
-
|
|
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 {
|
|
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 {
|
|
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,
|
|
9
|
-
const
|
|
10
|
-
|
|
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
|
-
|
|
17
|
-
|
|
13
|
+
variant: "outline",
|
|
14
|
+
sx: { height: 36 }
|
|
15
|
+
};
|
|
16
|
+
return /* @__PURE__ */ React.createElement(Group, {
|
|
17
|
+
spacing: 2
|
|
18
18
|
}, /* @__PURE__ */ React.createElement(Button, {
|
|
19
|
-
|
|
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
|
-
|
|
29
|
-
|
|
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
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
28
|
+
max: maxYear,
|
|
29
|
+
min: minYear,
|
|
30
|
+
onChange: (v) => {
|
|
31
|
+
if (v && onChange) {
|
|
32
|
+
onChange(v);
|
|
33
|
+
}
|
|
41
34
|
},
|
|
42
|
-
|
|
43
|
-
|
|
35
|
+
sx: { width: "4rem" },
|
|
36
|
+
styles: { input: { borderColor: error ? "red" : void 0, textAlign: "center" } }
|
|
44
37
|
}), /* @__PURE__ */ React.createElement(Button, {
|
|
45
|
-
|
|
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
|
-
|
|
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 {
|
|
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;;;;"}
|