@arkyn/components 3.0.1-beta.146 → 3.0.1-beta.148
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/bundle.css +1 -1
- package/dist/bundle.js +234 -188
- package/dist/components/calendar/_calendarProvider.d.ts +6 -0
- package/dist/components/calendar/_calendarProvider.d.ts.map +1 -1
- package/dist/components/calendar/_calendarProvider.js +20 -14
- package/dist/components/calendar/index.d.ts +12 -0
- package/dist/components/calendar/index.d.ts.map +1 -1
- package/dist/components/calendar/index.js +2 -2
- package/dist/components/fullCalendar/_fullCalendarProvider.d.ts +11 -2
- package/dist/components/fullCalendar/_fullCalendarProvider.d.ts.map +1 -1
- package/dist/components/fullCalendar/_fullCalendarProvider.js +9 -6
- package/dist/components/fullCalendar/dayCalendar/dayCalendarEvent/index.d.ts.map +1 -1
- package/dist/components/fullCalendar/dayCalendar/dayCalendarEvent/index.js +16 -12
- package/dist/components/fullCalendar/dayCalendar/dayCalendarRow/index.d.ts.map +1 -1
- package/dist/components/fullCalendar/dayCalendar/dayCalendarRow/index.js +16 -1
- package/dist/components/fullCalendar/fullCalendarHeader/index.js +3 -3
- package/dist/components/fullCalendar/index.d.ts +65 -49
- package/dist/components/fullCalendar/index.d.ts.map +1 -1
- package/dist/components/fullCalendar/index.js +26 -36
- package/dist/components/fullCalendar/monthlyCalendar/monthlyCalendarEvent/index.d.ts.map +1 -1
- package/dist/components/fullCalendar/monthlyCalendar/monthlyCalendarEvent/index.js +8 -4
- package/dist/components/fullCalendar/monthlyCalendar/monthlyCalendarTableTd/index.d.ts.map +1 -1
- package/dist/components/fullCalendar/monthlyCalendar/monthlyCalendarTableTd/index.js +17 -1
- package/dist/components/fullCalendar/weekCalendar/weekCalendarEvent/index.d.ts.map +1 -1
- package/dist/components/fullCalendar/weekCalendar/weekCalendarEvent/index.js +16 -12
- package/dist/components/fullCalendar/weekCalendar/weekCalendarTableTd/index.d.ts.map +1 -1
- package/dist/components/fullCalendar/weekCalendar/weekCalendarTableTd/index.js +17 -6
- package/dist/components/imageUpload/index.js +1 -1
- package/dist/components/input/index.d.ts.map +1 -1
- package/dist/components/multiSelect/index.js +1 -1
- package/dist/components/radio/radioGroup/index.js +1 -1
- package/dist/components/richText/index.js +1 -1
- package/dist/components/select/index.js +1 -1
- package/package.json +7 -7
|
@@ -30,6 +30,9 @@ type SingleCalendarProviderProps = {
|
|
|
30
30
|
onChangeView?: (date: Date) => void;
|
|
31
31
|
defaultValue?: Date;
|
|
32
32
|
onChange?: (date: Date) => void;
|
|
33
|
+
value?: Date;
|
|
34
|
+
viewValue?: Date;
|
|
35
|
+
defaultViewValue?: Date;
|
|
33
36
|
};
|
|
34
37
|
type RangeCalendarProviderProps = {
|
|
35
38
|
children: ReactNode;
|
|
@@ -38,6 +41,9 @@ type RangeCalendarProviderProps = {
|
|
|
38
41
|
onChangeView?: (date: Date) => void;
|
|
39
42
|
defaultValue?: [Date, Date];
|
|
40
43
|
onChange?: (date: [Date, Date]) => void;
|
|
44
|
+
value?: [Date, Date];
|
|
45
|
+
viewValue?: Date;
|
|
46
|
+
defaultViewValue?: Date;
|
|
41
47
|
};
|
|
42
48
|
type CalendarProviderProps = SingleCalendarProviderProps | RangeCalendarProviderProps;
|
|
43
49
|
declare function useCalendar(): CalendarContextProps;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"_calendarProvider.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/_calendarProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAe,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAElE,KAAK,oBAAoB,GAAG;IAC1B,SAAS,EAAE,IAAI,EAAE,CAAC;IAClB,QAAQ,EAAE,IAAI,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,UAAU,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC/C,SAAS,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC9C,UAAU,EAAE,cAAc,CAAC;IAC3B,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,KAAK,2BAA2B,GAAG;IACjC,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,EAAE,QAAQ,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"_calendarProvider.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/_calendarProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAe,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAElE,KAAK,oBAAoB,GAAG;IAC1B,SAAS,EAAE,IAAI,EAAE,CAAC;IAClB,QAAQ,EAAE,IAAI,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,UAAU,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC/C,SAAS,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC9C,UAAU,EAAE,cAAc,CAAC;IAC3B,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,KAAK,2BAA2B,GAAG;IACjC,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,EAAE,QAAQ,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,KAAK,CAAC,EAAE,IAAI,CAAC;IACb,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,gBAAgB,CAAC,EAAE,IAAI,CAAC;CACzB,CAAC;AAEF,KAAK,0BAA0B,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC5B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC;IACxC,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IACrB,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,gBAAgB,CAAC,EAAE,IAAI,CAAC;CACzB,CAAC;AAEF,KAAK,qBAAqB,GACtB,2BAA2B,GAC3B,0BAA0B,CAAC;AAI/B,iBAAS,WAAW,yBAEnB;AAED,iBAAS,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CAsFrD;AAED,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -6,29 +6,35 @@ function useCalendar() {
|
|
|
6
6
|
return useContext(CalendarContext);
|
|
7
7
|
}
|
|
8
8
|
function CalendarProvider(props) {
|
|
9
|
-
const
|
|
10
|
-
const defaultValue =
|
|
11
|
-
? [
|
|
12
|
-
:
|
|
13
|
-
const [
|
|
14
|
-
const [
|
|
9
|
+
const { calendarType, children, defaultValue: rawDefaultValue, defaultViewValue = new Date(), language = "pt-BR", onChange, onChangeView, value, viewValue, } = props;
|
|
10
|
+
const defaultValue = calendarType === "single"
|
|
11
|
+
? [rawDefaultValue || new Date(), rawDefaultValue || new Date()]
|
|
12
|
+
: rawDefaultValue || [new Date(), new Date()];
|
|
13
|
+
const [rawViewDate, rawSetViewDate] = useState(defaultViewValue);
|
|
14
|
+
const [rawValueDate, rawSetValueDate] = useState(defaultValue);
|
|
15
|
+
const viewDate = viewValue || rawViewDate;
|
|
16
|
+
const valueDate = value
|
|
17
|
+
? calendarType === "single"
|
|
18
|
+
? [value, value]
|
|
19
|
+
: value
|
|
20
|
+
: rawValueDate;
|
|
15
21
|
const viewService = new ViewService();
|
|
16
22
|
function setValueDate(value) {
|
|
17
23
|
const normalizedValue = [
|
|
18
24
|
new Date(value[0]),
|
|
19
25
|
new Date(value[1]),
|
|
20
26
|
];
|
|
21
|
-
if (
|
|
22
|
-
|
|
27
|
+
if (onChange && calendarType === "range") {
|
|
28
|
+
onChange(normalizedValue);
|
|
23
29
|
}
|
|
24
|
-
if (
|
|
25
|
-
|
|
30
|
+
if (onChange && calendarType === "single") {
|
|
31
|
+
onChange(normalizedValue[0]);
|
|
26
32
|
}
|
|
27
33
|
rawSetValueDate(normalizedValue);
|
|
28
34
|
}
|
|
29
35
|
function setViewDate(date) {
|
|
30
|
-
if (
|
|
31
|
-
|
|
36
|
+
if (onChangeView)
|
|
37
|
+
onChangeView(date);
|
|
32
38
|
rawSetViewDate(date);
|
|
33
39
|
}
|
|
34
40
|
return (_jsx(CalendarContext.Provider, { value: {
|
|
@@ -42,11 +48,11 @@ function CalendarProvider(props) {
|
|
|
42
48
|
listMonths: viewService.listMonths(viewDate, language),
|
|
43
49
|
listYears: viewService.listYears(100),
|
|
44
50
|
listMatrix: viewService.listMatrix(viewDate, valueDate),
|
|
45
|
-
changeDay: (day, month, year) => viewService.changeDay(day, month, year,
|
|
51
|
+
changeDay: (day, month, year) => viewService.changeDay(day, month, year, calendarType, valueDate, setValueDate, setViewDate),
|
|
46
52
|
changeMonth: (month) => viewService.changeMonth(month, viewDate, setViewDate),
|
|
47
53
|
changeYear: (year) => viewService.changeYear(year, viewDate, setViewDate),
|
|
48
54
|
nextMonth: () => viewService.nextMonth(viewDate, setViewDate),
|
|
49
55
|
previousMonth: () => viewService.previousMonth(viewDate, setViewDate),
|
|
50
|
-
}, children:
|
|
56
|
+
}, children: children }));
|
|
51
57
|
}
|
|
52
58
|
export { CalendarProvider, useCalendar };
|
|
@@ -12,10 +12,16 @@ type SingleCalendarProps = {
|
|
|
12
12
|
* @default "complete"
|
|
13
13
|
*/
|
|
14
14
|
variant?: "basic" | "complete";
|
|
15
|
+
/** Currently selected date. */
|
|
16
|
+
value?: Date;
|
|
15
17
|
/** Initial selected date. */
|
|
16
18
|
defaultValue?: Date;
|
|
17
19
|
/** Callback fired when the selected date changes. */
|
|
18
20
|
onChange?: (date: Date) => void;
|
|
21
|
+
/** Currently focused view date. */
|
|
22
|
+
viewValue?: Date;
|
|
23
|
+
/** Initial focused view date. */
|
|
24
|
+
defaultViewValue?: Date;
|
|
19
25
|
/** Callback fired when the view (month/year) changes. */
|
|
20
26
|
onChangeView?: (date: Date) => void;
|
|
21
27
|
};
|
|
@@ -33,10 +39,16 @@ type RangeCalendarProps = {
|
|
|
33
39
|
* @default "complete"
|
|
34
40
|
*/
|
|
35
41
|
variant?: "basic" | "complete";
|
|
42
|
+
/** Currently selected range in `[start, end]` format. */
|
|
43
|
+
value?: [Date, Date];
|
|
36
44
|
/** Initial selected range in `[start, end]` format. */
|
|
37
45
|
defaultValue?: [Date, Date];
|
|
38
46
|
/** Callback fired when the selected range changes. */
|
|
39
47
|
onChange?: (date: [Date, Date]) => void;
|
|
48
|
+
/** Currently focused view date. */
|
|
49
|
+
viewValue?: Date;
|
|
50
|
+
/** Initial focused view date. */
|
|
51
|
+
defaultViewValue?: Date;
|
|
40
52
|
/** Callback fired when the view (month/year) changes. */
|
|
41
53
|
onChangeView?: (date: Date) => void;
|
|
42
54
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/index.tsx"],"names":[],"mappings":"AAOA;;GAEG;AACH,KAAK,mBAAmB,GAAG;IACzB,uCAAuC;IACvC,IAAI,EAAE,QAAQ,CAAC;IACf;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAC/B,6BAA6B;IAC7B,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,yDAAyD;IACzD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF;;GAEG;AACH,KAAK,kBAAkB,GAAG;IACxB,iCAAiC;IACjC,IAAI,EAAE,OAAO,CAAC;IACd;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAC/B,uDAAuD;IACvD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC5B,sDAAsD;IACtD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC;IACxC,yDAAyD;IACzD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF;;GAEG;AACH,KAAK,aAAa,GAAG,mBAAmB,GAAG,kBAAkB,CAAC;AAE9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,iBAAS,QAAQ,CAAC,KAAK,EAAE,aAAa,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/calendar/index.tsx"],"names":[],"mappings":"AAOA;;GAEG;AACH,KAAK,mBAAmB,GAAG;IACzB,uCAAuC;IACvC,IAAI,EAAE,QAAQ,CAAC;IACf;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAC/B,+BAA+B;IAC/B,KAAK,CAAC,EAAE,IAAI,CAAC;IACb,6BAA6B;IAC7B,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,mCAAmC;IACnC,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,iCAAiC;IACjC,gBAAgB,CAAC,EAAE,IAAI,CAAC;IACxB,yDAAyD;IACzD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF;;GAEG;AACH,KAAK,kBAAkB,GAAG;IACxB,iCAAiC;IACjC,IAAI,EAAE,OAAO,CAAC;IACd;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IAC/B,yDAAyD;IACzD,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IACrB,uDAAuD;IACvD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC5B,sDAAsD;IACtD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC;IACxC,mCAAmC;IACnC,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,iCAAiC;IACjC,gBAAgB,CAAC,EAAE,IAAI,CAAC;IACxB,yDAAyD;IACzD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF;;GAEG;AACH,KAAK,aAAa,GAAG,mBAAmB,GAAG,kBAAkB,CAAC;AAE9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,iBAAS,QAAQ,CAAC,KAAK,EAAE,aAAa,2CA4CrC;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -47,8 +47,8 @@ import { CalendarTableHeader } from "./calendarTableHeader";
|
|
|
47
47
|
function Calendar(props) {
|
|
48
48
|
const variant = props.variant || "complete";
|
|
49
49
|
if (props.type === "range") {
|
|
50
|
-
return (_jsx(CalendarProvider, { defaultValue: props.defaultValue, calendarType: "range", onChange: props.onChange, onChangeView: props.onChangeView, children: _jsxs(CalendarContainer, { children: [_jsx(CalendarHeader, { basicMode: variant.includes("basic") }), _jsxs(CalendarTableContainer, { children: [_jsx(CalendarTableHeader, {}), _jsx(CalendarTableBody, {})] })] }) }));
|
|
50
|
+
return (_jsx(CalendarProvider, { value: props.value, viewValue: props.viewValue, defaultViewValue: props.defaultViewValue, defaultValue: props.defaultValue, calendarType: "range", onChange: props.onChange, onChangeView: props.onChangeView, children: _jsxs(CalendarContainer, { children: [_jsx(CalendarHeader, { basicMode: variant.includes("basic") }), _jsxs(CalendarTableContainer, { children: [_jsx(CalendarTableHeader, {}), _jsx(CalendarTableBody, {})] })] }) }));
|
|
51
51
|
}
|
|
52
|
-
return (_jsx(CalendarProvider, { defaultValue: props.defaultValue, calendarType: "single", onChange: props.onChange, onChangeView: props.onChangeView, children: _jsxs(CalendarContainer, { children: [_jsx(CalendarHeader, { basicMode: variant.includes("basic") }), _jsxs(CalendarTableContainer, { children: [_jsx(CalendarTableHeader, {}), _jsx(CalendarTableBody, {})] })] }) }));
|
|
52
|
+
return (_jsx(CalendarProvider, { value: props.value, viewValue: props.viewValue, defaultViewValue: props.defaultViewValue, defaultValue: props.defaultValue, calendarType: "single", onChange: props.onChange, onChangeView: props.onChangeView, children: _jsxs(CalendarContainer, { children: [_jsx(CalendarHeader, { basicMode: variant.includes("basic") }), _jsxs(CalendarTableContainer, { children: [_jsx(CalendarTableHeader, {}), _jsx(CalendarTableBody, {})] })] }) }));
|
|
53
53
|
}
|
|
54
54
|
export { Calendar };
|
|
@@ -1,15 +1,20 @@
|
|
|
1
1
|
import { type ReactNode } from "react";
|
|
2
2
|
import { type FullCalendarMatrix, type FullCalendarWeekMatrix } from "./_viewService";
|
|
3
3
|
type FullCalendarEvent = {
|
|
4
|
-
|
|
4
|
+
initialDate: Date;
|
|
5
5
|
endDate?: Date;
|
|
6
6
|
title: string;
|
|
7
7
|
data?: any;
|
|
8
8
|
scheme?: "primary" | "success" | "warning" | "danger" | "info";
|
|
9
9
|
onClick?: (data: any) => void;
|
|
10
10
|
};
|
|
11
|
+
type BlockTimestamp = {
|
|
12
|
+
initialDate: Date;
|
|
13
|
+
endDate: Date;
|
|
14
|
+
};
|
|
11
15
|
type FullCalendarContextProps = {
|
|
12
16
|
events: FullCalendarEvent[];
|
|
17
|
+
blockedTimestamps: BlockTimestamp[];
|
|
13
18
|
viewDate: Date;
|
|
14
19
|
listHours: number[];
|
|
15
20
|
listWeek: string[];
|
|
@@ -21,13 +26,17 @@ type FullCalendarContextProps = {
|
|
|
21
26
|
previousMonth: () => void;
|
|
22
27
|
previousWeek: () => void;
|
|
23
28
|
previousDay: () => void;
|
|
29
|
+
onClickDate?: (date: Date) => void;
|
|
24
30
|
};
|
|
25
31
|
type FullCalendarProviderProps = {
|
|
26
32
|
events: FullCalendarEvent[];
|
|
33
|
+
blockedTimestamps: BlockTimestamp[];
|
|
27
34
|
children: ReactNode;
|
|
28
35
|
language?: string;
|
|
29
|
-
|
|
36
|
+
viewValue?: Date;
|
|
37
|
+
defaultViewValue?: Date;
|
|
30
38
|
onChangeView?: (date: Date) => void;
|
|
39
|
+
onClickDate?: (date: Date) => void;
|
|
31
40
|
};
|
|
32
41
|
declare function useFullCalendar(): FullCalendarContextProps;
|
|
33
42
|
declare function FullCalendarProvider(props: FullCalendarProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"_fullCalendarProvider.d.ts","sourceRoot":"","sources":["../../../src/components/fullCalendar/_fullCalendarProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5E,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,sBAAsB,EAC5B,MAAM,gBAAgB,CAAC;AAExB,KAAK,iBAAiB,GAAG;IACvB,
|
|
1
|
+
{"version":3,"file":"_fullCalendarProvider.d.ts","sourceRoot":"","sources":["../../../src/components/fullCalendar/_fullCalendarProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5E,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,sBAAsB,EAC5B,MAAM,gBAAgB,CAAC;AAExB,KAAK,iBAAiB,GAAG;IACvB,WAAW,EAAE,IAAI,CAAC;IAClB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC/D,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CAC/B,CAAC;AAEF,KAAK,cAAc,GAAG;IACpB,WAAW,EAAE,IAAI,CAAC;IAClB,OAAO,EAAE,IAAI,CAAC;CACf,CAAC;AAEF,KAAK,wBAAwB,GAAG;IAC9B,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,iBAAiB,EAAE,cAAc,EAAE,CAAC;IACpC,QAAQ,EAAE,IAAI,CAAC;IACf,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,iBAAiB,EAAE,kBAAkB,CAAC;IACtC,gBAAgB,EAAE,sBAAsB,CAAC;IACzC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF,KAAK,yBAAyB,GAAG;IAC/B,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,iBAAiB,EAAE,cAAc,EAAE,CAAC;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,gBAAgB,CAAC,EAAE,IAAI,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC,CAAC;AAIF,iBAAS,eAAe,6BAEvB;AAED,iBAAS,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,2CA6C7D;AAED,OAAO,EAAE,oBAAoB,EAAE,eAAe,EAAE,CAAC"}
|
|
@@ -6,17 +6,19 @@ function useFullCalendar() {
|
|
|
6
6
|
return useContext(FullCalendarContext);
|
|
7
7
|
}
|
|
8
8
|
function FullCalendarProvider(props) {
|
|
9
|
-
const
|
|
9
|
+
const { blockedTimestamps, children, events, defaultViewValue = new Date(), language = "pt-BR", onChangeView, onClickDate, viewValue, } = props;
|
|
10
10
|
const viewService = new ViewService();
|
|
11
11
|
const listHours = viewService.listHours([8, 18]);
|
|
12
|
-
const [
|
|
12
|
+
const [rawViewDate, rawSetViewDate] = useState(defaultViewValue);
|
|
13
|
+
const viewDate = viewValue || rawViewDate;
|
|
13
14
|
function setViewDate(date) {
|
|
14
|
-
if (
|
|
15
|
-
|
|
15
|
+
if (onChangeView)
|
|
16
|
+
onChangeView(date);
|
|
16
17
|
rawSetViewDate(date);
|
|
17
18
|
}
|
|
18
19
|
return (_jsx(FullCalendarContext.Provider, { value: {
|
|
19
|
-
events
|
|
20
|
+
events,
|
|
21
|
+
blockedTimestamps,
|
|
20
22
|
viewDate,
|
|
21
23
|
listHours,
|
|
22
24
|
listWeek: viewService.listWeek(viewDate, language),
|
|
@@ -28,6 +30,7 @@ function FullCalendarProvider(props) {
|
|
|
28
30
|
previousMonth: () => viewService.previousMonth(viewDate, setViewDate),
|
|
29
31
|
previousWeek: () => viewService.previousWeek(viewDate, setViewDate),
|
|
30
32
|
previousDay: () => viewService.previousDay(viewDate, setViewDate),
|
|
31
|
-
|
|
33
|
+
onClickDate,
|
|
34
|
+
}, children: children }));
|
|
32
35
|
}
|
|
33
36
|
export { FullCalendarProvider, useFullCalendar };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/dayCalendar/dayCalendarEvent/index.tsx"],"names":[],"mappings":"AACA,OAAO,cAAc,CAAC;AAEtB,KAAK,qBAAqB,GAAG;IAC3B,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC;AAKF,iBAAS,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/dayCalendar/dayCalendarEvent/index.tsx"],"names":[],"mappings":"AACA,OAAO,cAAc,CAAC;AAEtB,KAAK,qBAAqB,GAAG;IAC3B,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC;AAKF,iBAAS,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,uFAoJrD;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -11,13 +11,13 @@ function DayCalendarEvent(props) {
|
|
|
11
11
|
const dayEvents = events
|
|
12
12
|
.map((event, sourceIndex) => ({ event, sourceIndex }))
|
|
13
13
|
.filter(({ event }) => {
|
|
14
|
-
return (event.
|
|
15
|
-
event.
|
|
16
|
-
event.
|
|
14
|
+
return (event.initialDate.getDate() === day &&
|
|
15
|
+
event.initialDate.getMonth() === month &&
|
|
16
|
+
event.initialDate.getFullYear() === year);
|
|
17
17
|
})
|
|
18
18
|
.sort((a, b) => {
|
|
19
|
-
const startA = a.event.
|
|
20
|
-
const startB = b.event.
|
|
19
|
+
const startA = a.event.initialDate.getTime();
|
|
20
|
+
const startB = b.event.initialDate.getTime();
|
|
21
21
|
if (startA !== startB)
|
|
22
22
|
return startA - startB;
|
|
23
23
|
const endA = a.event.endDate?.getTime() ?? startA + SLOT_DURATION_MINUTES * 60_000;
|
|
@@ -31,8 +31,8 @@ function DayCalendarEvent(props) {
|
|
|
31
31
|
const dayHour = Math.floor(props.timeInMinutes / 60);
|
|
32
32
|
const dayMinute = props.timeInMinutes % 60;
|
|
33
33
|
function isEventInInterval() {
|
|
34
|
-
const eventHour = event.
|
|
35
|
-
const eventMinute = event.
|
|
34
|
+
const eventHour = event.initialDate.getHours();
|
|
35
|
+
const eventMinute = event.initialDate.getMinutes();
|
|
36
36
|
if (eventHour !== dayHour)
|
|
37
37
|
return false;
|
|
38
38
|
if (dayMinute === 0)
|
|
@@ -41,9 +41,9 @@ function DayCalendarEvent(props) {
|
|
|
41
41
|
return eventMinute >= 30 && eventMinute < 60;
|
|
42
42
|
}
|
|
43
43
|
return (isEventInInterval() &&
|
|
44
|
-
event.
|
|
45
|
-
event.
|
|
46
|
-
event.
|
|
44
|
+
event.initialDate.getDate() === day &&
|
|
45
|
+
event.initialDate.getMonth() === month &&
|
|
46
|
+
event.initialDate.getFullYear() === year);
|
|
47
47
|
});
|
|
48
48
|
if (filteredEvents.length === 0)
|
|
49
49
|
return _jsx(_Fragment, {});
|
|
@@ -58,7 +58,7 @@ function DayCalendarEvent(props) {
|
|
|
58
58
|
return `${hours}h${minutes}`;
|
|
59
59
|
}
|
|
60
60
|
function getEventRangeInMinutes(event) {
|
|
61
|
-
const startMinutes = event.
|
|
61
|
+
const startMinutes = event.initialDate.getHours() * 60 + event.initialDate.getMinutes();
|
|
62
62
|
const endMinutes = event.endDate
|
|
63
63
|
? event.endDate.getHours() * 60 + event.endDate.getMinutes()
|
|
64
64
|
: startMinutes + SLOT_DURATION_MINUTES;
|
|
@@ -96,6 +96,10 @@ function DayCalendarEvent(props) {
|
|
|
96
96
|
left: `${overlapOffset}px`,
|
|
97
97
|
};
|
|
98
98
|
}
|
|
99
|
-
|
|
99
|
+
function handleEventClick(event, eventData) {
|
|
100
|
+
event.stopPropagation();
|
|
101
|
+
eventData.onClick?.(eventData.data);
|
|
102
|
+
}
|
|
103
|
+
return filteredEvents.map(({ event, sourceIndex }, index) => (_jsxs("div", { className: `arkynDayCalendarEvent ${event?.scheme || "primary"}`, style: getEventStyle(event, sourceIndex), onClick: (e) => handleEventClick(e, event), children: [_jsxs("strong", { children: [makeHour(event.initialDate), " ", event?.endDate && `- ${makeHour(event.endDate)}`] }), _jsx("p", { children: event.title })] }, makeEventKey(index, sourceIndex))));
|
|
100
104
|
}
|
|
101
105
|
export { DayCalendarEvent };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/dayCalendar/dayCalendarRow/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/dayCalendar/dayCalendarRow/index.tsx"],"names":[],"mappings":"AAGA,OAAO,cAAc,CAAC;AAEtB,KAAK,mBAAmB,GAAG;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,iBAAS,cAAc,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,EAAE,mBAAmB,2CAmCnE;AAED,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,CAAC"}
|
|
@@ -1,9 +1,24 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useFullCalendar } from "../../_fullCalendarProvider";
|
|
2
3
|
import { ViewService } from "../../_viewService";
|
|
3
4
|
import { DayCalendarEvent } from "../dayCalendarEvent";
|
|
4
5
|
import "./styles.css";
|
|
5
6
|
function DayCalendarRow({ hour, timeInMinutes }) {
|
|
6
7
|
const viewService = new ViewService();
|
|
7
|
-
|
|
8
|
+
const { blockedTimestamps, viewDate, onClickDate } = useFullCalendar();
|
|
9
|
+
function isBlocked() {
|
|
10
|
+
return blockedTimestamps.some((timestamp) => viewDate >= timestamp.initialDate && viewDate <= timestamp.endDate);
|
|
11
|
+
}
|
|
12
|
+
function handleClick(event) {
|
|
13
|
+
event.stopPropagation();
|
|
14
|
+
if (isBlocked())
|
|
15
|
+
return;
|
|
16
|
+
if (onClickDate) {
|
|
17
|
+
const date = new Date(viewDate);
|
|
18
|
+
date.setHours(0, timeInMinutes, 0, 0);
|
|
19
|
+
onClickDate(date);
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
return (_jsxs("div", { className: `arkynDayCalendarRow ${isBlocked() ? "blocked" : ""}`, "data-time": timeInMinutes, onClick: handleClick, children: [_jsx("p", { children: viewService.formatHourLabel(hour) }), _jsx("div", { className: "arkynDayCalendarRowContent", children: _jsx(DayCalendarEvent, { timeInMinutes: timeInMinutes }) })] }));
|
|
8
23
|
}
|
|
9
24
|
export { DayCalendarRow };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { ChevronLeft, ChevronRight } from "lucide-react";
|
|
3
|
-
import { CardTabButton } from "
|
|
4
|
-
import { CardTabContainer } from "
|
|
5
|
-
import { IconButton } from "
|
|
3
|
+
import { CardTabButton } from "../../cardTab/cardTabButton";
|
|
4
|
+
import { CardTabContainer } from "../../cardTab/cardTabContainer";
|
|
5
|
+
import { IconButton } from "../../iconButton";
|
|
6
6
|
import { useFullCalendar } from "../_fullCalendarProvider";
|
|
7
7
|
import "./styles.css";
|
|
8
8
|
function FullCalendarHeader(props) {
|
|
@@ -1,77 +1,93 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Represents a single event rendered on the calendar.
|
|
3
|
+
*/
|
|
1
4
|
type FullCalendarEvent = {
|
|
2
|
-
/**
|
|
5
|
+
/** Display label shown on the event block. */
|
|
3
6
|
title: string;
|
|
4
|
-
/**
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
+
/** Start date and time of the event. */
|
|
8
|
+
initialDate: Date;
|
|
9
|
+
/** End date and time of the event. */
|
|
7
10
|
endDate?: Date;
|
|
8
|
-
/** Arbitrary payload forwarded to `onClick
|
|
11
|
+
/** Arbitrary payload forwarded to the `onClick` callback. */
|
|
9
12
|
data?: any;
|
|
10
|
-
/**
|
|
13
|
+
/**
|
|
14
|
+
* Color scheme applied to the event block.
|
|
15
|
+
* - `primary`: default blue.
|
|
16
|
+
* - `success`: green.
|
|
17
|
+
* - `warning`: yellow.
|
|
18
|
+
* - `danger`: red.
|
|
19
|
+
* - `info`: light blue.
|
|
20
|
+
*
|
|
21
|
+
* @default "primary"
|
|
22
|
+
*/
|
|
11
23
|
scheme?: "primary" | "success" | "warning" | "danger" | "info";
|
|
12
|
-
/** Callback fired when the user clicks the event
|
|
24
|
+
/** Callback fired when the user clicks the event. Receives `data` as argument. */
|
|
13
25
|
onClick?: (data: any) => void;
|
|
14
26
|
};
|
|
27
|
+
/**
|
|
28
|
+
* Represents a blocked (unavailable) time range on the calendar.
|
|
29
|
+
*/
|
|
30
|
+
type BlockTimestamp = {
|
|
31
|
+
/** Start of the blocked range. */
|
|
32
|
+
initialDate: Date;
|
|
33
|
+
/** End of the blocked range. */
|
|
34
|
+
endDate: Date;
|
|
35
|
+
};
|
|
36
|
+
/**
|
|
37
|
+
* Props for the FullCalendar component.
|
|
38
|
+
*/
|
|
15
39
|
type FullCalendarProps = {
|
|
16
|
-
/**
|
|
17
|
-
|
|
18
|
-
/** Initial
|
|
19
|
-
|
|
20
|
-
/**
|
|
40
|
+
/** Controlled value for the currently focused date. */
|
|
41
|
+
viewValue?: Date;
|
|
42
|
+
/** Initial focused date when the calendar mounts. */
|
|
43
|
+
defaultViewValue?: Date;
|
|
44
|
+
/** List of events to display across day, week, and month views. */
|
|
21
45
|
events?: FullCalendarEvent[];
|
|
22
|
-
/**
|
|
23
|
-
|
|
24
|
-
/** Callback fired when the user navigates to a different period.
|
|
46
|
+
/** Time ranges that should be visually marked as unavailable. */
|
|
47
|
+
blockedTimestamps?: BlockTimestamp[];
|
|
48
|
+
/** Callback fired when the user navigates to a different period. */
|
|
25
49
|
onChangeView?: (date: Date) => void;
|
|
50
|
+
/** Callback fired when the user clicks a date cell. */
|
|
51
|
+
onClickDate?: (date: Date) => void;
|
|
26
52
|
};
|
|
27
53
|
/**
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
* Renders a navigable calendar that displays a list of events. The active view
|
|
31
|
-
* can be switched at runtime via the built-in header controls.
|
|
54
|
+
* Full-featured calendar component with day, week, and month views.
|
|
32
55
|
*
|
|
33
|
-
*
|
|
34
|
-
*
|
|
35
|
-
*
|
|
36
|
-
* @param props.events[].title - Event label shown on the calendar.
|
|
37
|
-
* @param props.events[].date - Event start date/time.
|
|
38
|
-
* @param props.events[].endDate - Event end date/time (optional).
|
|
39
|
-
* @param props.events[].data - Arbitrary payload forwarded to `onClick`.
|
|
40
|
-
* @param props.events[].scheme - Color scheme for the event chip (`"primary"` | `"success"` | `"warning"` | `"danger"` | `"info"`).
|
|
41
|
-
* @param props.events[].onClick - Fires when the user clicks the event — receives `data`.
|
|
42
|
-
* @param props.onChange - Fires when the selected date changes — receives the new `Date`.
|
|
43
|
-
* @param props.onChangeView - Fires when the user navigates to a different period — receives the current `Date`.
|
|
56
|
+
* Renders a switchable calendar that supports event display, blocked time
|
|
57
|
+
* ranges, and date navigation. Internal state and business logic are managed
|
|
58
|
+
* by `FullCalendarProvider`, keeping the public API minimal.
|
|
44
59
|
*
|
|
45
|
-
* @
|
|
60
|
+
* @param props FullCalendar properties.
|
|
61
|
+
* @returns Calendar UI with a view switcher header and the active view grid.
|
|
46
62
|
*
|
|
47
63
|
* @example
|
|
48
|
-
*
|
|
49
|
-
* // Basic monthly calendar
|
|
50
|
-
* <FullCalendar />
|
|
51
|
-
*
|
|
52
|
-
* // Start on week view with a pre-selected date
|
|
53
|
-
* <FullCalendar defaultView="week" defaultValue={new Date("2025-06-01")} />
|
|
54
|
-
*
|
|
55
|
-
* // With events
|
|
64
|
+
* // Basic usage with events
|
|
56
65
|
* <FullCalendar
|
|
66
|
+
* defaultValue={new Date()}
|
|
57
67
|
* events={[
|
|
58
68
|
* {
|
|
59
|
-
* title: "Team
|
|
60
|
-
*
|
|
61
|
-
* endDate: new Date(
|
|
69
|
+
* title: "Team standup",
|
|
70
|
+
* initialDate: new Date(2026, 5, 22, 9, 0),
|
|
71
|
+
* endDate: new Date(2026, 5, 22, 9, 30),
|
|
62
72
|
* scheme: "primary",
|
|
63
|
-
*
|
|
64
|
-
* onClick: ({ meetingId }) => openMeeting(meetingId),
|
|
73
|
+
* onClick: (data) => console.log("Event clicked:", data),
|
|
65
74
|
* },
|
|
75
|
+
* ]}
|
|
76
|
+
* onChangeView={(date) => console.log("Viewing:", date)}
|
|
77
|
+
* onClickDate={(date) => console.log("Date clicked:", date)}
|
|
78
|
+
* />
|
|
79
|
+
*
|
|
80
|
+
* @example
|
|
81
|
+
* // With blocked timestamps
|
|
82
|
+
* <FullCalendar
|
|
83
|
+
* defaultValue={new Date()}
|
|
84
|
+
* blockedTimestamps={[
|
|
66
85
|
* {
|
|
67
|
-
*
|
|
68
|
-
*
|
|
69
|
-
* scheme: "danger",
|
|
86
|
+
* initialDate: new Date(2026, 5, 22, 12, 0),
|
|
87
|
+
* endDate: new Date(2026, 5, 22, 13, 0),
|
|
70
88
|
* },
|
|
71
89
|
* ]}
|
|
72
|
-
* onChangeView={(date) => fetchEventsForMonth(date)}
|
|
73
90
|
* />
|
|
74
|
-
* ```
|
|
75
91
|
*/
|
|
76
92
|
declare function FullCalendar(props: FullCalendarProps): import("react/jsx-runtime").JSX.Element;
|
|
77
93
|
export { FullCalendar };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/fullCalendar/index.tsx"],"names":[],"mappings":"AAQA,KAAK,iBAAiB,GAAG;IACvB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/fullCalendar/index.tsx"],"names":[],"mappings":"AAQA;;GAEG;AACH,KAAK,iBAAiB,GAAG;IACvB,8CAA8C;IAC9C,KAAK,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,WAAW,EAAE,IAAI,CAAC;IAClB,sCAAsC;IACtC,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,6DAA6D;IAC7D,IAAI,CAAC,EAAE,GAAG,CAAC;IACX;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC/D,kFAAkF;IAClF,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CAC/B,CAAC;AAEF;;GAEG;AACH,KAAK,cAAc,GAAG;IACpB,kCAAkC;IAClC,WAAW,EAAE,IAAI,CAAC;IAClB,gCAAgC;IAChC,OAAO,EAAE,IAAI,CAAC;CACf,CAAC;AAEF;;GAEG;AACH,KAAK,iBAAiB,GAAG;IACvB,uDAAuD;IACvD,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,qDAAqD;IACrD,gBAAgB,CAAC,EAAE,IAAI,CAAC;IACxB,mEAAmE;IACnE,MAAM,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC7B,iEAAiE;IACjE,iBAAiB,CAAC,EAAE,cAAc,EAAE,CAAC;IACrC,oEAAoE;IACpE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,uDAAuD;IACvD,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,iBAAS,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAoB7C;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -7,56 +7,46 @@ import { FullCalendarHeader } from "./fullCalendarHeader";
|
|
|
7
7
|
import { MonthlyCalendar } from "./monthlyCalendar";
|
|
8
8
|
import { WeekCalendar } from "./weekCalendar";
|
|
9
9
|
/**
|
|
10
|
-
*
|
|
10
|
+
* Full-featured calendar component with day, week, and month views.
|
|
11
11
|
*
|
|
12
|
-
* Renders a
|
|
13
|
-
*
|
|
12
|
+
* Renders a switchable calendar that supports event display, blocked time
|
|
13
|
+
* ranges, and date navigation. Internal state and business logic are managed
|
|
14
|
+
* by `FullCalendarProvider`, keeping the public API minimal.
|
|
14
15
|
*
|
|
15
|
-
* @param props
|
|
16
|
-
* @
|
|
17
|
-
* @param props.events - Array of events to display on the calendar.
|
|
18
|
-
* @param props.events[].title - Event label shown on the calendar.
|
|
19
|
-
* @param props.events[].date - Event start date/time.
|
|
20
|
-
* @param props.events[].endDate - Event end date/time (optional).
|
|
21
|
-
* @param props.events[].data - Arbitrary payload forwarded to `onClick`.
|
|
22
|
-
* @param props.events[].scheme - Color scheme for the event chip (`"primary"` | `"success"` | `"warning"` | `"danger"` | `"info"`).
|
|
23
|
-
* @param props.events[].onClick - Fires when the user clicks the event — receives `data`.
|
|
24
|
-
* @param props.onChange - Fires when the selected date changes — receives the new `Date`.
|
|
25
|
-
* @param props.onChangeView - Fires when the user navigates to a different period — receives the current `Date`.
|
|
26
|
-
*
|
|
27
|
-
* @returns FullCalendar JSX element.
|
|
16
|
+
* @param props FullCalendar properties.
|
|
17
|
+
* @returns Calendar UI with a view switcher header and the active view grid.
|
|
28
18
|
*
|
|
29
19
|
* @example
|
|
30
|
-
*
|
|
31
|
-
* // Basic monthly calendar
|
|
32
|
-
* <FullCalendar />
|
|
33
|
-
*
|
|
34
|
-
* // Start on week view with a pre-selected date
|
|
35
|
-
* <FullCalendar defaultView="week" defaultValue={new Date("2025-06-01")} />
|
|
36
|
-
*
|
|
37
|
-
* // With events
|
|
20
|
+
* // Basic usage with events
|
|
38
21
|
* <FullCalendar
|
|
22
|
+
* defaultValue={new Date()}
|
|
39
23
|
* events={[
|
|
40
24
|
* {
|
|
41
|
-
* title: "Team
|
|
42
|
-
*
|
|
43
|
-
* endDate: new Date(
|
|
25
|
+
* title: "Team standup",
|
|
26
|
+
* initialDate: new Date(2026, 5, 22, 9, 0),
|
|
27
|
+
* endDate: new Date(2026, 5, 22, 9, 30),
|
|
44
28
|
* scheme: "primary",
|
|
45
|
-
*
|
|
46
|
-
* onClick: ({ meetingId }) => openMeeting(meetingId),
|
|
29
|
+
* onClick: (data) => console.log("Event clicked:", data),
|
|
47
30
|
* },
|
|
31
|
+
* ]}
|
|
32
|
+
* onChangeView={(date) => console.log("Viewing:", date)}
|
|
33
|
+
* onClickDate={(date) => console.log("Date clicked:", date)}
|
|
34
|
+
* />
|
|
35
|
+
*
|
|
36
|
+
* @example
|
|
37
|
+
* // With blocked timestamps
|
|
38
|
+
* <FullCalendar
|
|
39
|
+
* defaultValue={new Date()}
|
|
40
|
+
* blockedTimestamps={[
|
|
48
41
|
* {
|
|
49
|
-
*
|
|
50
|
-
*
|
|
51
|
-
* scheme: "danger",
|
|
42
|
+
* initialDate: new Date(2026, 5, 22, 12, 0),
|
|
43
|
+
* endDate: new Date(2026, 5, 22, 13, 0),
|
|
52
44
|
* },
|
|
53
45
|
* ]}
|
|
54
|
-
* onChangeView={(date) => fetchEventsForMonth(date)}
|
|
55
46
|
* />
|
|
56
|
-
* ```
|
|
57
47
|
*/
|
|
58
48
|
function FullCalendar(props) {
|
|
59
|
-
const [viewType, setViewType] = useState(
|
|
60
|
-
return (_jsx(FullCalendarProvider, { events: props.events || [],
|
|
49
|
+
const [viewType, setViewType] = useState("month");
|
|
50
|
+
return (_jsx(FullCalendarProvider, { events: props.events || [], viewValue: props.viewValue, defaultViewValue: props.defaultViewValue, onChangeView: props.onChangeView, blockedTimestamps: props.blockedTimestamps || [], onClickDate: props.onClickDate, children: _jsxs(FullCalendarContainer, { children: [_jsx(FullCalendarHeader, { viewType: viewType, setViewType: setViewType }), viewType === "day" && _jsx(DayCalendar, {}), viewType === "month" && _jsx(MonthlyCalendar, {}), viewType === "week" && _jsx(WeekCalendar, {})] }) }));
|
|
61
51
|
}
|
|
62
52
|
export { FullCalendar };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/monthlyCalendar/monthlyCalendarEvent/index.tsx"],"names":[],"mappings":"AACA,OAAO,cAAc,CAAC;AAEtB,KAAK,yBAAyB,GAAG;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,iBAAS,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/monthlyCalendar/monthlyCalendarEvent/index.tsx"],"names":[],"mappings":"AACA,OAAO,cAAc,CAAC;AAEtB,KAAK,yBAAyB,GAAG;IAC/B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,iBAAS,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,uFA2C7D;AAED,OAAO,EAAE,oBAAoB,EAAE,CAAC"}
|
|
@@ -4,9 +4,9 @@ import "./styles.css";
|
|
|
4
4
|
function MonthlyCalendarEvent(props) {
|
|
5
5
|
const { events } = useFullCalendar();
|
|
6
6
|
const filteredEvents = events.filter((event) => {
|
|
7
|
-
return (event.
|
|
8
|
-
event.
|
|
9
|
-
event.
|
|
7
|
+
return (event.initialDate.getDate() === props.day &&
|
|
8
|
+
event.initialDate.getMonth() === props.month &&
|
|
9
|
+
event.initialDate.getFullYear() === props.year);
|
|
10
10
|
});
|
|
11
11
|
if (filteredEvents.length === 0)
|
|
12
12
|
return _jsx(_Fragment, {});
|
|
@@ -20,6 +20,10 @@ function MonthlyCalendarEvent(props) {
|
|
|
20
20
|
return `${hours}h`;
|
|
21
21
|
return `${hours}h${minutes}`;
|
|
22
22
|
}
|
|
23
|
-
|
|
23
|
+
function handleEventClick(event, eventData) {
|
|
24
|
+
event.stopPropagation();
|
|
25
|
+
eventData.onClick?.(eventData.data);
|
|
26
|
+
}
|
|
27
|
+
return filteredEvents.map((event, index) => (_jsxs("div", { className: `arkynMonthlyCalendarEvent ${event?.scheme || "primary"}`, onClick: (e) => handleEventClick(e, event), children: [_jsxs("strong", { children: [makeHour(event.initialDate), " ", event?.endDate && `- ${makeHour(event.endDate)}`] }), _jsx("p", { children: event.title })] }, makeEventKey(index))));
|
|
24
28
|
}
|
|
25
29
|
export { MonthlyCalendarEvent };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/monthlyCalendar/monthlyCalendarTableTd/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/fullCalendar/monthlyCalendar/monthlyCalendarTableTd/index.tsx"],"names":[],"mappings":"AAEA,OAAO,cAAc,CAAC;AAEtB,KAAK,2BAA2B,GAAG;IACjC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,UAAU,GAAG,SAAS,GAAG,MAAM,CAAC;CAC3C,CAAC;AAEF,iBAAS,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,2CA4CjE;AAED,OAAO,EAAE,sBAAsB,EAAE,CAAC"}
|