@licklist/design 0.44.486-dev.26 → 0.44.486-dev.28
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/calendar/Calendar.d.ts +16 -0
- package/dist/calendar/Calendar.d.ts.map +1 -0
- package/dist/calendar/Calendar.js +1 -0
- package/dist/calendar/components/CalendarButtons/CalendarButtons.d.ts +6 -0
- package/dist/calendar/components/CalendarButtons/CalendarButtons.d.ts.map +1 -0
- package/dist/calendar/components/CalendarButtons/CalendarButtons.js +1 -0
- package/dist/calendar/components/CalendarButtons/index.d.ts.map +1 -0
- package/dist/calendar/components/CalendarDate/CalendarDate.d.ts.map +1 -0
- package/dist/calendar/components/CalendarDate/index.d.ts.map +1 -0
- package/dist/calendar/components/CalendarDates/CalendarDates.d.ts +8 -0
- package/dist/calendar/components/CalendarDates/CalendarDates.d.ts.map +1 -0
- package/dist/calendar/components/CalendarDates/CalendarDates.js +1 -0
- package/dist/calendar/components/CalendarDates/index.d.ts.map +1 -0
- package/dist/calendar/components/CalendarSelect/CalendarSelect.d.ts.map +1 -0
- package/dist/calendar/components/CalendarSelect/CalendarSelect.js +1 -0
- package/dist/calendar/components/CalendarSelect/index.d.ts.map +1 -0
- package/dist/calendar/components/CalendarWeekdays/CalendarWeekdays.d.ts.map +1 -0
- package/dist/calendar/components/CalendarWeekdays/index.d.ts.map +1 -0
- package/dist/calendar/index.d.ts +4 -0
- package/dist/calendar/index.d.ts.map +1 -0
- package/dist/calendar/utils/index.d.ts +5 -0
- package/dist/calendar/utils/index.d.ts.map +1 -0
- package/dist/calendar/utils/index.js +1 -0
- package/dist/iframe/event/index.d.ts +0 -1
- package/dist/iframe/event/index.d.ts.map +1 -1
- package/dist/iframe/index.d.ts +1 -1
- package/dist/iframe/index.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/components/BookingSummaryAccordion/BookingSummaryAccordion.js +1 -1
- package/dist/iframe/order-process/components/CalendarStepsForm/CalendarStepsForm.js +1 -1
- package/dist/iframe/page/components/PageBody/components/LeftBlock/LeftBlock.js +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/snippet/snippet-template/preview/Preview.d.ts.map +1 -1
- package/dist/snippet/snippet-template/preview/Preview.js +1 -1
- package/dist/styles/resources-blocking/_index.scss +1 -1
- package/package.json +1 -1
- package/src/calendar/Calendar.stories.tsx +33 -0
- package/src/calendar/Calendar.tsx +59 -0
- package/src/{iframe/event/event-calendar → calendar}/components/CalendarButtons/CalendarButtons.tsx +31 -14
- package/src/{iframe/event/event-calendar → calendar}/components/CalendarDates/CalendarDates.tsx +16 -16
- package/src/{iframe/event/event-calendar → calendar}/components/CalendarSelect/CalendarSelect.tsx +1 -1
- package/src/calendar/index.ts +3 -0
- package/src/calendar/utils/index.ts +28 -0
- package/src/iframe/event/event-venue-map/IframeEventVenueMap.stories.tsx +1 -1
- package/src/iframe/event/index.ts +0 -6
- package/src/iframe/index.ts +0 -1
- package/src/iframe/order-process/components/CalendarStepsForm/CalendarStepsForm.tsx +3 -1
- package/src/iframe/page/Page.stories.tsx +2 -2
- package/src/index.ts +1 -0
- package/src/snippet/snippet-template/preview/Preview.tsx +14 -2
- package/src/styles/resources-blocking/_index.scss +1 -1
- package/dist/iframe/event/event-calendar/EventCalendar.d.ts +0 -7
- package/dist/iframe/event/event-calendar/EventCalendar.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/EventCalendar.js +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarButtons/CalendarButtons.d.ts +0 -6
- package/dist/iframe/event/event-calendar/components/CalendarButtons/CalendarButtons.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarButtons/CalendarButtons.js +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarButtons/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarDate/CalendarDate.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarDate/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarDates/CalendarDates.d.ts +0 -7
- package/dist/iframe/event/event-calendar/components/CalendarDates/CalendarDates.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarDates/CalendarDates.js +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarDates/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarSelect/CalendarSelect.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarSelect/CalendarSelect.js +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarSelect/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarWeekdays/CalendarWeekdays.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/components/CalendarWeekdays/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/index.d.ts +0 -4
- package/dist/iframe/event/event-calendar/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/types/index.d.ts +0 -6
- package/dist/iframe/event/event-calendar/types/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/utils/index.d.ts +0 -3
- package/dist/iframe/event/event-calendar/utils/index.d.ts.map +0 -1
- package/dist/iframe/event/event-calendar/utils/index.js +0 -1
- package/src/iframe/event/event-calendar/EventCalendar.stories.tsx +0 -36
- package/src/iframe/event/event-calendar/EventCalendar.tsx +0 -27
- package/src/iframe/event/event-calendar/index.ts +0 -6
- package/src/iframe/event/event-calendar/types/index.ts +0 -6
- package/src/iframe/event/event-calendar/utils/index.ts +0 -11
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarButtons/index.d.ts +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarDate/CalendarDate.d.ts +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarDate/CalendarDate.js +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarDate/index.d.ts +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarDates/index.d.ts +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarSelect/CalendarSelect.d.ts +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarSelect/index.d.ts +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarWeekdays/CalendarWeekdays.d.ts +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarWeekdays/CalendarWeekdays.js +0 -0
- /package/dist/{iframe/event/event-calendar → calendar}/components/CalendarWeekdays/index.d.ts +0 -0
- /package/src/{iframe/event/event-calendar → calendar}/components/CalendarButtons/index.ts +0 -0
- /package/src/{iframe/event/event-calendar → calendar}/components/CalendarDate/CalendarDate.tsx +0 -0
- /package/src/{iframe/event/event-calendar → calendar}/components/CalendarDate/index.ts +0 -0
- /package/src/{iframe/event/event-calendar → calendar}/components/CalendarDates/index.ts +0 -0
- /package/src/{iframe/event/event-calendar → calendar}/components/CalendarSelect/index.ts +0 -0
- /package/src/{iframe/event/event-calendar → calendar}/components/CalendarWeekdays/CalendarWeekdays.tsx +0 -0
- /package/src/{iframe/event/event-calendar → calendar}/components/CalendarWeekdays/index.ts +0 -0
package/src/{iframe/event/event-calendar → calendar}/components/CalendarButtons/CalendarButtons.tsx
RENAMED
|
@@ -1,36 +1,53 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useCallback, useMemo } from "react";
|
|
2
2
|
import { Button } from "react-bootstrap";
|
|
3
3
|
import { useTranslation } from "react-i18next";
|
|
4
4
|
import { range } from "lodash";
|
|
5
|
-
import {
|
|
6
|
-
import { ReactComponent as SelectArrow } from "../../../../../assets/iframe/selectArrow.svg";
|
|
5
|
+
import { ReactComponent as SelectArrow } from "../../../assets/iframe/selectArrow.svg";
|
|
7
6
|
import { CalendarSelect } from "../CalendarSelect";
|
|
8
|
-
import { CalendarBaseProps } from "../../types";
|
|
9
7
|
import { isSelectedDateDisabled } from "../../utils";
|
|
8
|
+
import { CalendarProps } from "../../Calendar";
|
|
10
9
|
|
|
11
|
-
type CalendarButtonsProps =
|
|
10
|
+
type CalendarButtonsProps = Pick<
|
|
11
|
+
CalendarProps,
|
|
12
|
+
| "isLoading"
|
|
13
|
+
| "disabledDates"
|
|
14
|
+
| "initialDate"
|
|
15
|
+
| "currentDate"
|
|
16
|
+
| "setCurrentDate"
|
|
17
|
+
| "setSelectedDate"
|
|
18
|
+
>;
|
|
12
19
|
|
|
13
20
|
export const CalendarButtons = ({
|
|
14
21
|
disabledDates = [],
|
|
15
22
|
isLoading = false,
|
|
23
|
+
initialDate,
|
|
24
|
+
currentDate,
|
|
25
|
+
setCurrentDate,
|
|
26
|
+
setSelectedDate,
|
|
16
27
|
}: CalendarButtonsProps) => {
|
|
17
|
-
const {
|
|
18
|
-
initialDate,
|
|
19
|
-
currentDate,
|
|
20
|
-
canMoveBack,
|
|
21
|
-
onSelectPreviousMonth,
|
|
22
|
-
onSelectNextMonth,
|
|
23
|
-
setCurrentDate,
|
|
24
|
-
setSelectedDate,
|
|
25
|
-
} = useContext(EventCalendarContext);
|
|
26
28
|
const { t } = useTranslation("Design");
|
|
27
29
|
|
|
30
|
+
const onSelectNextMonth = useCallback(() => {
|
|
31
|
+
setCurrentDate((prevDate) => prevDate.plus({ months: 1 }));
|
|
32
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
33
|
+
}, []);
|
|
34
|
+
|
|
35
|
+
const onSelectPreviousMonth = useCallback(() => {
|
|
36
|
+
setCurrentDate((prevDate) => prevDate.minus({ month: 1 }));
|
|
37
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
38
|
+
}, []);
|
|
39
|
+
|
|
28
40
|
const yearOptions = useMemo(() => {
|
|
29
41
|
return range(initialDate.year, initialDate.year + 5, 1).map((year) => {
|
|
30
42
|
return { label: String(year), value: year };
|
|
31
43
|
});
|
|
32
44
|
}, [initialDate]);
|
|
33
45
|
|
|
46
|
+
const canMoveBack = useMemo(
|
|
47
|
+
() => currentDate > initialDate,
|
|
48
|
+
[currentDate, initialDate]
|
|
49
|
+
);
|
|
50
|
+
|
|
34
51
|
const onSelectYear = (value: string) => {
|
|
35
52
|
const selectedYear = Number(value);
|
|
36
53
|
const nextDateTime = currentDate.set({ year: selectedYear });
|
package/src/{iframe/event/event-calendar → calendar}/components/CalendarDates/CalendarDates.tsx
RENAMED
|
@@ -1,23 +1,28 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useMemo } from "react";
|
|
2
2
|
import { DateTime } from "luxon";
|
|
3
|
-
import { EventCalendarContext } from "@licklist/plugins/dist/context/event/EventCalendarContext";
|
|
4
3
|
import { CalendarWeekdays } from "../CalendarWeekdays";
|
|
5
4
|
import { CalendarDate } from "../CalendarDate";
|
|
6
|
-
import { CalendarBaseProps } from "../../types";
|
|
7
5
|
import { isSelectedDateDisabled } from "../../utils";
|
|
6
|
+
import { CalendarProps } from "../../Calendar";
|
|
8
7
|
|
|
9
|
-
export type CalendarDatesProps =
|
|
10
|
-
|
|
8
|
+
export type CalendarDatesProps = Pick<
|
|
9
|
+
CalendarProps,
|
|
10
|
+
| "calendarDates"
|
|
11
|
+
| "fromPrice"
|
|
12
|
+
| "isLoading"
|
|
13
|
+
| "disabledDates"
|
|
14
|
+
| "selectedDate"
|
|
15
|
+
| "setSelectedDate"
|
|
16
|
+
> & {
|
|
17
|
+
initialDate: DateTime;
|
|
11
18
|
};
|
|
12
19
|
|
|
13
20
|
export const CalendarDates = ({
|
|
14
21
|
disabledDates = [],
|
|
15
22
|
isLoading = false,
|
|
16
|
-
|
|
23
|
+
calendarDates,
|
|
24
|
+
...props
|
|
17
25
|
}: CalendarDatesProps) => {
|
|
18
|
-
const { calendarDates, initialDate, selectedDate, setSelectedDate } =
|
|
19
|
-
useContext(EventCalendarContext);
|
|
20
|
-
|
|
21
26
|
const fillCalendarDates = useMemo(() => {
|
|
22
27
|
let firstDayOfWeek = calendarDates[0]?.weekday ?? 0;
|
|
23
28
|
|
|
@@ -40,9 +45,7 @@ export const CalendarDates = ({
|
|
|
40
45
|
<CalendarWeekdays />
|
|
41
46
|
<div className="calendar-dates">
|
|
42
47
|
{fillCalendarDates.map((date: DateTime | null) => {
|
|
43
|
-
if (date === null)
|
|
44
|
-
return <div />;
|
|
45
|
-
}
|
|
48
|
+
if (date === null) return <div />;
|
|
46
49
|
|
|
47
50
|
const isDisabled =
|
|
48
51
|
isLoading || isSelectedDateDisabled(date, disabledDates);
|
|
@@ -51,11 +54,8 @@ export const CalendarDates = ({
|
|
|
51
54
|
<CalendarDate
|
|
52
55
|
key={+date}
|
|
53
56
|
currentDate={date}
|
|
54
|
-
initialDate={initialDate}
|
|
55
|
-
selectedDate={selectedDate}
|
|
56
|
-
setSelectedDate={setSelectedDate}
|
|
57
57
|
isDisabled={isDisabled}
|
|
58
|
-
|
|
58
|
+
{...props}
|
|
59
59
|
/>
|
|
60
60
|
);
|
|
61
61
|
})}
|
package/src/{iframe/event/event-calendar → calendar}/components/CalendarSelect/CalendarSelect.tsx
RENAMED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { useRef } from "react";
|
|
2
2
|
import { Form } from "react-bootstrap";
|
|
3
3
|
import clsx from "clsx";
|
|
4
|
-
import { PAGE_CALENDAR_SELECT_WRAPPER } from "
|
|
4
|
+
import { PAGE_CALENDAR_SELECT_WRAPPER } from "../../../iframe/page/components/PageBody/constants";
|
|
5
5
|
|
|
6
6
|
export type CalendarSelectOption = {
|
|
7
7
|
label: string;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { DateTime, Interval } from "luxon";
|
|
2
|
+
import isEqual from "lodash/isEqual";
|
|
3
|
+
|
|
4
|
+
export const isSelectedDateDisabled = (
|
|
5
|
+
selectedDate: DateTime,
|
|
6
|
+
disabledDates: DateTime[] = []
|
|
7
|
+
) => {
|
|
8
|
+
return !!disabledDates.find((disabledDate) =>
|
|
9
|
+
isEqual(disabledDate.toObject(), selectedDate.toObject())
|
|
10
|
+
);
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
export const getMonthCalendarDates = (initialDate: DateTime): DateTime[] => {
|
|
14
|
+
const startOfMonth = initialDate.startOf("month");
|
|
15
|
+
const endOfMonth = initialDate.endOf("month");
|
|
16
|
+
|
|
17
|
+
return Interval.fromDateTimes(startOfMonth, endOfMonth)
|
|
18
|
+
.splitBy({ day: 1 })
|
|
19
|
+
.map((d) => d.start);
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
export const getWeekCalendarDates = (initialDate: DateTime): DateTime[] => {
|
|
23
|
+
const lastDay = initialDate.plus({ days: 7 });
|
|
24
|
+
|
|
25
|
+
return Interval.fromDateTimes(initialDate, lastDay)
|
|
26
|
+
.splitBy({ day: 1 })
|
|
27
|
+
.map((d) => d.start);
|
|
28
|
+
};
|
|
@@ -5,7 +5,7 @@ import { IframeEventVenueMap } from "./IframeEventVenueMap";
|
|
|
5
5
|
import { Page, PageBody, PageHeader } from "../../page";
|
|
6
6
|
import { BookingSummaryFooter } from "../../order-process/components/BookingSummaryFooter";
|
|
7
7
|
import { BookingSummary } from "../../order-process/components/BookingSummary";
|
|
8
|
-
import { CalendarSelect } from "
|
|
8
|
+
import { CalendarSelect } from "../../../calendar/components/CalendarSelect";
|
|
9
9
|
import { Product } from "../../../types";
|
|
10
10
|
|
|
11
11
|
export default {
|
|
@@ -13,12 +13,6 @@ export {
|
|
|
13
13
|
} from "./event-order-short-summary";
|
|
14
14
|
export { EventDescription } from "./event-description";
|
|
15
15
|
export { EventProductSets, EventProductSetsProps } from "./event-product-sets";
|
|
16
|
-
export {
|
|
17
|
-
EventCalendar,
|
|
18
|
-
CalendarSelect,
|
|
19
|
-
CalendarSelectProps,
|
|
20
|
-
CalendarSelectOption,
|
|
21
|
-
} from "./event-calendar";
|
|
22
16
|
export {
|
|
23
17
|
EventStepVenueMapZones,
|
|
24
18
|
EventStepVenueMapZonesProps,
|
package/src/iframe/index.ts
CHANGED
|
@@ -28,7 +28,7 @@ import { PageBody } from "../../../page/components/PageBody";
|
|
|
28
28
|
import {
|
|
29
29
|
CalendarSelect,
|
|
30
30
|
CalendarSelectOption,
|
|
31
|
-
} from "
|
|
31
|
+
} from "../../../../calendar/components/CalendarSelect";
|
|
32
32
|
import { IframeEventVenueMap } from "../../../event/event-venue-map";
|
|
33
33
|
import { VenueMapRef } from "../../../../events/event-venue-map/components/VenueMap";
|
|
34
34
|
import { useCategoryVerification } from "../utils/useCategoryVerification";
|
|
@@ -363,3 +363,5 @@ export const CalendarStepsForm = forwardRef<
|
|
|
363
363
|
);
|
|
364
364
|
}
|
|
365
365
|
);
|
|
366
|
+
|
|
367
|
+
CalendarStepsForm.displayName = "CalendarStepsForm";
|
|
@@ -6,7 +6,7 @@ import { Page } from "./Page";
|
|
|
6
6
|
import { PageHeader } from "./components/PageHeader";
|
|
7
7
|
import { PageBody } from "./components/PageBody";
|
|
8
8
|
import { IframeEventCard } from "../event/event-card/IframeEventCard";
|
|
9
|
-
import { CalendarSelect } from "
|
|
9
|
+
import { CalendarSelect } from "../../calendar/components/CalendarSelect";
|
|
10
10
|
|
|
11
11
|
export default {
|
|
12
12
|
title: "Iframe/Page/Page",
|
|
@@ -219,7 +219,7 @@ export function Default() {
|
|
|
219
219
|
<>
|
|
220
220
|
<CalendarSelect
|
|
221
221
|
options={[{ label: "Floor 1", value: "1" }]}
|
|
222
|
-
value=
|
|
222
|
+
value="1"
|
|
223
223
|
onChange={(chagedId: string) => console.log({ chagedId })}
|
|
224
224
|
/>
|
|
225
225
|
</>
|
package/src/index.ts
CHANGED
|
@@ -7,6 +7,9 @@ import {
|
|
|
7
7
|
SNIPPET_TYPE_VENUE_MAP,
|
|
8
8
|
} from "@licklist/core/dist/DataMapper/Provider/SnippetDataMapper";
|
|
9
9
|
import { ProductSet } from "@licklist/core/dist/DataMapper/Product/ProductSetDataMapper";
|
|
10
|
+
import { DateTime } from "luxon";
|
|
11
|
+
import { Calendar, defaultStartDay } from "../../../calendar";
|
|
12
|
+
import { getMonthCalendarDates } from "../../../calendar/utils";
|
|
10
13
|
import { IframeEventCard } from "../../../iframe/event/event-card";
|
|
11
14
|
import { SettingButton } from "../settings";
|
|
12
15
|
import {
|
|
@@ -24,7 +27,6 @@ import {
|
|
|
24
27
|
} from "../../../iframe";
|
|
25
28
|
import { NumberInput } from "../../../iframe/order-process/components/CategoryProduct/components/NumberInput";
|
|
26
29
|
import { SnippetTemplateContext } from "../context/snippetTemplate";
|
|
27
|
-
import { EventCalendar } from "../../../iframe/event/event-calendar";
|
|
28
30
|
|
|
29
31
|
const DEFAULT_IMAGE =
|
|
30
32
|
"https://images.unsplash.com/photo-1638988319382-90e61be77c59?ixlib=rb-1.2.1&auto=format&fit=crop&w=687&q=80";
|
|
@@ -52,6 +54,10 @@ export function Preview({
|
|
|
52
54
|
onSettingClick();
|
|
53
55
|
};
|
|
54
56
|
|
|
57
|
+
const [currentDate, setCurrentDate] = useState<DateTime>(defaultStartDay);
|
|
58
|
+
const [selectedDate, setSelectedDate] = useState<DateTime | null>(null);
|
|
59
|
+
const calendarDates = getMonthCalendarDates(currentDate);
|
|
60
|
+
|
|
55
61
|
return (
|
|
56
62
|
<div className="w-100 h-100 snippet-template-preview">
|
|
57
63
|
<Page
|
|
@@ -196,7 +202,13 @@ export function Preview({
|
|
|
196
202
|
className="mt-3 m-0"
|
|
197
203
|
containerClassName="mt-5 pt-5"
|
|
198
204
|
>
|
|
199
|
-
<
|
|
205
|
+
<Calendar
|
|
206
|
+
currentDate={currentDate}
|
|
207
|
+
setCurrentDate={setCurrentDate}
|
|
208
|
+
selectedDate={selectedDate}
|
|
209
|
+
setSelectedDate={setSelectedDate}
|
|
210
|
+
calendarDates={calendarDates}
|
|
211
|
+
/>
|
|
200
212
|
</SettingButton>
|
|
201
213
|
</div>
|
|
202
214
|
<div className="pt-4">
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { ReactElement } from "react";
|
|
2
|
-
import { CalendarBaseProps } from "./types";
|
|
3
|
-
export type EventCalendarProps = CalendarBaseProps & {
|
|
4
|
-
fromPrice?: string | ReactElement | null;
|
|
5
|
-
};
|
|
6
|
-
export declare const EventCalendar: ({ disabledDates, isLoading, fromPrice, }: EventCalendarProps) => JSX.Element;
|
|
7
|
-
//# sourceMappingURL=EventCalendar.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"EventCalendar.d.ts","sourceRoot":"","sources":["../../../../src/iframe/event/event-calendar/EventCalendar.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,MAAM,kBAAkB,GAAG,iBAAiB,GAAG;IACnD,SAAS,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,IAAI,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,aAAa,6CAIvB,kBAAkB,gBAapB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,a=require("react"),t=(e=a)&&"object"==typeof e&&"default"in e?e.default:e,r=require("./components/CalendarButtons/CalendarButtons.js"),n=require("./components/CalendarDates/CalendarDates.js");exports.EventCalendar=function(e){var a=e.disabledDates,s=void 0===a?[]:a,d=e.isLoading,i=void 0!==d&&d,l=e.fromPrice;return t.createElement("div",{className:"calendar-wrapper"},t.createElement("div",{className:"calendar"},t.createElement(r.CalendarButtons,{disabledDates:s,isLoading:i}),t.createElement(n.CalendarDates,{disabledDates:s,isLoading:i,fromPrice:l})))};
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { CalendarBaseProps } from "../../types";
|
|
3
|
-
type CalendarButtonsProps = CalendarBaseProps;
|
|
4
|
-
export declare const CalendarButtons: ({ disabledDates, isLoading, }: CalendarButtonsProps) => JSX.Element;
|
|
5
|
-
export {};
|
|
6
|
-
//# sourceMappingURL=CalendarButtons.d.ts.map
|
package/dist/iframe/event/event-calendar/components/CalendarButtons/CalendarButtons.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarButtons.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarButtons/CalendarButtons.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAGhD,KAAK,oBAAoB,GAAG,iBAAiB,CAAC;AAE9C,eAAO,MAAM,eAAe,kCAGzB,oBAAoB,gBAoGtB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),a=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,n=require("react-i18next"),r=require("react-bootstrap"),l=require("lodash"),s=require("@licklist/plugins/dist/context/event/EventCalendarContext"),i=require("../../../../../assets/iframe/selectArrow.svg.js"),o=require("../CalendarSelect/CalendarSelect.js"),c=require("../../utils/index.js");exports.CalendarButtons=function(e){var u=e.disabledDates,d=void 0===u?[]:u,m=e.isLoading,v=void 0!==m&&m,b=t.useContext(s.EventCalendarContext),C=b.initialDate,E=b.currentDate,p=b.canMoveBack,f=b.onSelectPreviousMonth,y=b.onSelectNextMonth,D=b.setCurrentDate,N=b.setSelectedDate,x=n.useTranslation("Design").t,M=t.useMemo((function(){return l.range(C.year,C.year+5,1).map((function(e){return{label:String(e),value:e}}))}),[C]);return a.createElement("div",null,a.createElement("div",{className:"calendar-top-buttons"},a.createElement(r.Button,{variant:"outline-secondary",className:"mr-4",size:"sm",onClick:function(){D(C),c.isSelectedDateDisabled(C,d)||N(C)},disabled:v},x("today")),a.createElement(r.Button,{variant:"outline-secondary",size:"sm",onClick:function(){var e=C.set({day:C.day+1});D(e),c.isSelectedDateDisabled(e,d)||N(e)},disabled:v},x("tomorrow"))),a.createElement("hr",null),a.createElement("div",{className:"calendar-buttons"},a.createElement("div",{className:"buttons-wrapper"},a.createElement(r.Button,{className:"calendar-button left-button",onClick:f,disabled:!p,variant:"link"},a.createElement(i.ReactComponent,null)),a.createElement("div",{className:"month-title"},E.toFormat("MMMM")),a.createElement(r.Button,{className:"calendar-button",onClick:y,variant:"link"},a.createElement(i.ReactComponent,null))),a.createElement(o.CalendarSelect,{options:M,onChange:function(e){var t=Number(e),a=E.set({year:t});D(a<=C?C:a)},value:E.year,className:"ml-4"})))};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarButtons/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarDate.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarDate/CalendarDate.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,WAAW,EAAE,QAAQ,CAAC;IACtB,WAAW,EAAE,QAAQ,CAAC;IACtB,YAAY,CAAC,EAAE,QAAQ,CAAC;IACxB,eAAe,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC1C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,IAAI,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,YAAY,wFAOtB,iBAAiB,gBA6BnB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarDate/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { ReactElement } from "react";
|
|
2
|
-
import { CalendarBaseProps } from "../../types";
|
|
3
|
-
export type CalendarDatesProps = CalendarBaseProps & {
|
|
4
|
-
fromPrice?: string | ReactElement | null;
|
|
5
|
-
};
|
|
6
|
-
export declare const CalendarDates: ({ disabledDates, isLoading, fromPrice, }: CalendarDatesProps) => JSX.Element;
|
|
7
|
-
//# sourceMappingURL=CalendarDates.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarDates.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarDates/CalendarDates.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAuB,MAAM,OAAO,CAAC;AAKjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAGhD,MAAM,MAAM,kBAAkB,GAAG,iBAAiB,GAAG;IACnD,SAAS,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,IAAI,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,aAAa,6CAIvB,kBAAkB,gBAgDpB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,a=require("tslib"),t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,l=require("@licklist/plugins/dist/context/event/EventCalendarContext"),n=require("../../utils/index.js"),d=require("../CalendarWeekdays/CalendarWeekdays.js"),i=require("../CalendarDate/CalendarDate.js");exports.CalendarDates=function(e){var s=e.disabledDates,u=void 0===s?[]:s,c=e.isLoading,o=void 0!==c&&c,v=e.fromPrice,D=t.useContext(l.EventCalendarContext),f=D.calendarDates,C=D.initialDate,m=D.selectedDate,p=D.setSelectedDate,_=t.useMemo((function(){var e,t,r=null!==(t=null===(e=f[0])||void 0===e?void 0:e.weekday)&&void 0!==t?t:0;if(1===r)return f;for(var l=[];r>1;)l.push(null),r-=1;return a.__spreadArray(a.__spreadArray([],a.__read(l),!1),a.__read(f),!1)}),[f]);return r.createElement("div",{className:"calendar-dates-wrapper"},r.createElement(d.CalendarWeekdays,null),r.createElement("div",{className:"calendar-dates"},_.map((function(e){if(null===e)return r.createElement("div",null);var a=o||n.isSelectedDateDisabled(e,u);return r.createElement(i.CalendarDate,{key:+e,currentDate:e,initialDate:C,selectedDate:m,setSelectedDate:p,isDisabled:a,fromPrice:v})}))))};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarDates/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarSelect.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarSelect/CalendarSelect.tsx"],"names":[],"mappings":";AAKA,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,oBAAoB,EAAE,CAAC;IAChC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,cAAc,6CAKxB,mBAAmB,gBA+BrB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var a=require("react"),t=e(a),r=require("react-bootstrap"),n=e(require("clsx")),l=require("../../../../page/components/PageBody/constants.js");exports.CalendarSelect=function(e){var o=e.options,c=e.onChange,s=e.value,u=e.className,i=a.useRef(null);return t.createElement("div",{className:n("calendar-select-wrapper",u),id:l.PAGE_CALENDAR_SELECT_WRAPPER},t.createElement(r.Form.Control,{as:"select",onChange:function(e){var a=e.target.value;c&&c(a)},className:"calendar-select",value:s,ref:i},o.map((function(e){var a=e.label,r=e.value;return t.createElement("option",{value:r,key:a||r},a)}))))};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarSelect/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EACV,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,kBAAkB,CAAC"}
|
package/dist/iframe/event/event-calendar/components/CalendarWeekdays/CalendarWeekdays.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarWeekdays.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarWeekdays/CalendarWeekdays.tsx"],"names":[],"mappings":";AAaA,eAAO,MAAM,gBAAgB,mBAc5B,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/event/event-calendar/components/CalendarWeekdays/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/iframe/event/event-calendar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EACV,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,6BAA6B,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/event/event-calendar/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,aAAa,CAAC,EAAE,QAAQ,EAAE,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/event/event-calendar/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,eAAO,MAAM,sBAAsB,iBACnB,QAAQ,kBACP,QAAQ,EAAE,YAK1B,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=(e=require("lodash/isEqual"))&&"object"==typeof e&&"default"in e?e.default:e;exports.isSelectedDateDisabled=function(e,o){return void 0===o&&(o=[]),!!o.find((function(o){return t(o.toObject(),e.toObject())}))};
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { DateTime } from "luxon";
|
|
3
|
-
import { Meta, Story } from "@storybook/react";
|
|
4
|
-
import {
|
|
5
|
-
EventCalendarProvider,
|
|
6
|
-
getMonthCalendarDates,
|
|
7
|
-
} from "@licklist/plugins/dist/context/event/EventCalendarContext";
|
|
8
|
-
import { EventCalendar, EventCalendarProps } from "./EventCalendar";
|
|
9
|
-
|
|
10
|
-
export default {
|
|
11
|
-
title: "Iframe/Event/Calendar",
|
|
12
|
-
component: EventCalendar,
|
|
13
|
-
} as Meta;
|
|
14
|
-
|
|
15
|
-
export const Default: Story<EventCalendarProps> = (args) => {
|
|
16
|
-
return (
|
|
17
|
-
<EventCalendarProvider getCalendarDates={getMonthCalendarDates}>
|
|
18
|
-
<div style={{ backgroundColor: "white" }}>
|
|
19
|
-
<EventCalendar {...args} />
|
|
20
|
-
</div>
|
|
21
|
-
</EventCalendarProvider>
|
|
22
|
-
);
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
const now = DateTime.now().set({
|
|
26
|
-
hour: 0,
|
|
27
|
-
second: 0,
|
|
28
|
-
millisecond: 0,
|
|
29
|
-
minute: 0,
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
Default.args = {
|
|
33
|
-
disabledDates: [now.minus({ day: 2 }), now, now.plus({ day: 2 })],
|
|
34
|
-
isLoading: false,
|
|
35
|
-
fromPrice: "from £10",
|
|
36
|
-
};
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import React, { ReactElement } from "react";
|
|
2
|
-
import { CalendarButtons } from "./components/CalendarButtons";
|
|
3
|
-
import { CalendarDates } from "./components/CalendarDates";
|
|
4
|
-
import { CalendarBaseProps } from "./types";
|
|
5
|
-
|
|
6
|
-
export type EventCalendarProps = CalendarBaseProps & {
|
|
7
|
-
fromPrice?: string | ReactElement | null;
|
|
8
|
-
};
|
|
9
|
-
|
|
10
|
-
export const EventCalendar = ({
|
|
11
|
-
disabledDates = [],
|
|
12
|
-
isLoading = false,
|
|
13
|
-
fromPrice,
|
|
14
|
-
}: EventCalendarProps) => {
|
|
15
|
-
return (
|
|
16
|
-
<div className="calendar-wrapper">
|
|
17
|
-
<div className="calendar">
|
|
18
|
-
<CalendarButtons disabledDates={disabledDates} isLoading={isLoading} />
|
|
19
|
-
<CalendarDates
|
|
20
|
-
disabledDates={disabledDates}
|
|
21
|
-
isLoading={isLoading}
|
|
22
|
-
fromPrice={fromPrice}
|
|
23
|
-
/>
|
|
24
|
-
</div>
|
|
25
|
-
</div>
|
|
26
|
-
);
|
|
27
|
-
};
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { DateTime } from "luxon";
|
|
2
|
-
import isEqual from "lodash/isEqual";
|
|
3
|
-
|
|
4
|
-
export const isSelectedDateDisabled = (
|
|
5
|
-
selectedDate: DateTime,
|
|
6
|
-
disabledDates: DateTime[] = []
|
|
7
|
-
) => {
|
|
8
|
-
return !!disabledDates.find((disabledDate) =>
|
|
9
|
-
isEqual(disabledDate.toObject(), selectedDate.toObject())
|
|
10
|
-
);
|
|
11
|
-
};
|
/package/dist/{iframe/event/event-calendar → calendar}/components/CalendarButtons/index.d.ts
RENAMED
|
File without changes
|
/package/dist/{iframe/event/event-calendar → calendar}/components/CalendarDate/CalendarDate.d.ts
RENAMED
|
File without changes
|
/package/dist/{iframe/event/event-calendar → calendar}/components/CalendarDate/CalendarDate.js
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|
/package/dist/{iframe/event/event-calendar → calendar}/components/CalendarSelect/CalendarSelect.d.ts
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
/package/dist/{iframe/event/event-calendar → calendar}/components/CalendarWeekdays/index.d.ts
RENAMED
|
File without changes
|
|
File without changes
|
/package/src/{iframe/event/event-calendar → calendar}/components/CalendarDate/CalendarDate.tsx
RENAMED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|