@headless-adminapp/fluent 0.0.17-alpha.8 → 1.0.0

package/PageCalendar/EventDialog/utils.js

@@ -0,0 +1,57 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateValidationSchema = exports.formValidator = void 0;
+const utils_1 = require("@headless-adminapp/app/dataform/utils");
+const yup_1 = require("@hookform/resolvers/yup");
+const lodash_1 = require("lodash");
+const yup = __importStar(require("yup"));
+// TODO: refactor duplicate code
+exports.formValidator = (0, lodash_1.memoize)(function formValidator({ attributes, language, strings, region, }) {
+    return async (values, context, options) => {
+        const validator = (0, exports.generateValidationSchema)({
+            attributes,
+            language,
+            strings,
+            region,
+        });
+        const resolver = (0, yup_1.yupResolver)(validator);
+        const result = await resolver(values, context, options);
+        return result;
+    };
+}, (options) => JSON.stringify(options));
+exports.generateValidationSchema = (0, lodash_1.memoize)(function generateValidationSchema({ attributes, language, strings, region, }) {
+    const columns = Object.keys(attributes);
+    return yup.object().shape({
+        ...columns.reduce((acc, column) => {
+            const attribute = attributes[column];
+            const validationSchema = (0, utils_1.generateAttributeValidationSchema)(attribute, language, strings, region);
+            return {
+                ...acc,
+                [column]: validationSchema,
+            };
+        }, {}),
+    });
+}, (options) => JSON.stringify(options));

package/PageCalendar/Header.d.ts

@@ -0,0 +1,8 @@
+import { InferredSchemaType, SchemaAttributes } from '@headless-adminapp/core/schema';
+import { UseFormReturn } from 'react-hook-form';
+interface HeaderProps<SA extends SchemaAttributes = SchemaAttributes> {
+    filterForm: UseFormReturn<InferredSchemaType<SA>, unknown, undefined>;
+    onCreateButtonClick: () => void;
+}
+export declare function Header<SA extends SchemaAttributes = SchemaAttributes>({ filterForm, onCreateButtonClick, }: Readonly<HeaderProps<SA>>): import("react/jsx-runtime").JSX.Element;
+export {};

package/PageCalendar/Header.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Header = Header;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+const useConfig_1 = require("@headless-adminapp/app/calendar/hooks/useConfig");
+const icons_fluent_1 = require("@headless-adminapp/icons-fluent");
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const StandardControl_1 = require("../PageEntityForm/StandardControl");
+function Header({ filterForm, onCreateButtonClick, }) {
+    const config = (0, useConfig_1.useConfig)();
+    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+            display: 'flex',
+            flexDirection: 'column',
+            background: react_components_1.tokens.colorNeutralBackground1,
+            borderRadius: react_components_1.tokens.borderRadiusLarge,
+            paddingBlock: react_components_1.tokens.spacingVerticalS,
+            paddingInline: react_components_1.tokens.spacingHorizontalM,
+            gap: react_components_1.tokens.spacingVerticalS,
+            boxShadow: react_components_1.tokens.shadow2,
+        }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    gap: react_components_1.tokens.spacingHorizontalM,
+                }, children: [(0, jsx_runtime_1.jsx)("div", { style: { flex: 1 }, children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsx)(react_components_1.Subtitle2, { style: { color: react_components_1.tokens.colorNeutralForeground1 }, children: config.title }), (0, jsx_runtime_1.jsx)(react_components_1.Caption1, { style: { color: react_components_1.tokens.colorNeutralForeground2 }, children: config.description })] }) }) }), (0, jsx_runtime_1.jsx)("div", { style: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            gap: react_components_1.tokens.spacingHorizontalS,
+                        }, children: (0, jsx_runtime_1.jsx)(react_components_1.Button, { style: { fontWeight: react_components_1.tokens.fontWeightMedium }, icon: (0, jsx_runtime_1.jsx)(icons_fluent_1.iconSet.Add, {}), appearance: "primary", onClick: onCreateButtonClick, children: "Create" }) })] }), !!config.filterAttributes && ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_components_1.Divider, { style: { opacity: 0.2 } }), (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', gap: react_components_1.tokens.spacingHorizontalS }, children: Object.entries(config.filterAttributes).map(([attributeName, attribute]) => {
+                            return ((0, jsx_runtime_1.jsx)(react_hook_form_1.Controller, { control: filterForm.control, name: attributeName, render: ({ field }) => {
+                                    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(StandardControl_1.StandardControl, { attribute: attribute, name: attributeName, value: field.value, onChange: field.onChange, onBlur: field.onBlur }) }));
+                                } }, attributeName));
+                        }) })] }))] }));
+}

package/PageCalendar/PageCalendar.d.ts

@@ -0,0 +1,7 @@
+import { CalendarConfig } from '@headless-adminapp/app/calendar/types';
+import { SchemaAttributes } from '@headless-adminapp/core/schema';
+interface PageCalendarProps<SA1 extends SchemaAttributes = SchemaAttributes, SA2 extends SchemaAttributes = SchemaAttributes, SA3 extends SchemaAttributes = SchemaAttributes> {
+    config: CalendarConfig<SA1, SA2, SA3>;
+}
+export declare function PageCalendar<SA1 extends SchemaAttributes = SchemaAttributes, SA2 extends SchemaAttributes = SchemaAttributes, SA3 extends SchemaAttributes = SchemaAttributes>(props: Readonly<PageCalendarProps<SA1, SA2, SA3>>): import("react/jsx-runtime").JSX.Element;
+export {};

package/PageCalendar/PageCalendar.js

@@ -0,0 +1,231 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageCalendar = PageCalendar;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+const auth_1 = require("@headless-adminapp/app/auth");
+const context_1 = require("@headless-adminapp/app/calendar/context");
+const dialog_1 = require("@headless-adminapp/app/dialog");
+const mutable_1 = require("@headless-adminapp/app/mutable");
+const progress_indicator_1 = require("@headless-adminapp/app/progress-indicator");
+const toast_notification_1 = require("@headless-adminapp/app/toast-notification");
+const react_query_1 = require("@tanstack/react-query");
+const dayjs_1 = __importDefault(require("dayjs"));
+const isoWeek_1 = __importDefault(require("dayjs/plugin/isoWeek"));
+const timezone_1 = __importDefault(require("dayjs/plugin/timezone"));
+const utc_1 = __importDefault(require("dayjs/plugin/utc"));
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const EventDialog_1 = require("./EventDialog/EventDialog");
+const Header_1 = require("./Header");
+const types_1 = require("./types");
+const utils_1 = require("./utils");
+const CalendarSection = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./CalendarSection'))).then((mod) => ({ default: mod.CalendarSection })));
+dayjs_1.default.extend(utc_1.default);
+dayjs_1.default.extend(timezone_1.default);
+dayjs_1.default.extend(isoWeek_1.default);
+function PageCalendar(props) {
+    const contextValue = (0, mutable_1.useCreateContextStore)({
+        config: props.config,
+    });
+    (0, react_1.useEffect)(() => {
+        contextValue.setValue({
+            config: props.config,
+        });
+    }, [contextValue, props.config]);
+    const config = props.config;
+    const openDialog = (0, dialog_1.useOpenDialog)();
+    const openConfirmDialog = (0, dialog_1.useOpenConfirmDialog)();
+    const openToastNotification = (0, toast_notification_1.useOpenToastNotification)();
+    const { hideProgressIndicator, showProgressIndicator } = (0, progress_indicator_1.useProgressIndicator)();
+    const [activeStartDate, setActiveStartDate] = (0, react_1.useState)(null);
+    const [activeEndDate, setActiveEndDate] = (0, react_1.useState)(null);
+    const [currentStartDate, setCurrentStartDate] = (0, react_1.useState)(null);
+    const [currentEndDate, setCurrentEndDate] = (0, react_1.useState)(null);
+    const [viewType, setViewType] = (0, react_1.useState)(types_1.ViewType.Month);
+    const queryClient = (0, react_query_1.useQueryClient)();
+    const filterForm = (0, react_hook_form_1.useForm)({
+        mode: 'all',
+        defaultValues: config.defaultFilter,
+        shouldUnregister: false,
+    });
+    const filterValues = filterForm.watch();
+    const auth = (0, auth_1.useAuthSession)();
+    const { data: events, isPending: loading } = (0, react_query_1.useQuery)({
+        queryKey: [
+            'calendar-events',
+            'list',
+            activeStartDate,
+            activeEndDate,
+            filterValues,
+            auth,
+        ],
+        queryFn: async () => {
+            if (!activeStartDate || !activeEndDate) {
+                return [];
+            }
+            try {
+                const result = await config.eventsResolver({
+                    start: activeStartDate,
+                    end: activeEndDate,
+                    filter: filterValues,
+                    auth,
+                });
+                return result.map(utils_1.transformEvent);
+            }
+            catch (error) {
+                openToastNotification({
+                    title: 'Error',
+                    text: error.message,
+                    type: 'error',
+                });
+                throw error;
+            }
+        },
+        staleTime: 1000 * 60 * 5, // 5 minutes
+    });
+    function openEventDetailModel(values) {
+        const { close } = openDialog({
+            type: 'custom',
+            Component: EventDialog_1.EventDialog,
+            props: {
+                onDismiss: () => {
+                    close();
+                },
+                config,
+                values,
+                onSubmit: async (data) => {
+                    try {
+                        const { id, end, start, title, allDay, description, ...rest } = data.values;
+                        await config.saveEvent({
+                            event: {
+                                id,
+                                title,
+                                start: start ? new Date(start) : null,
+                                end: end ? new Date(end) : null,
+                                allDay: allDay ?? false,
+                                description,
+                                ...rest,
+                            },
+                            modifiedValues: data.modifiedValues,
+                        });
+                        await queryClient.invalidateQueries({
+                            queryKey: ['calendar-events'],
+                        });
+                        close();
+                    }
+                    catch (error) {
+                        openToastNotification({
+                            title: 'Error',
+                            text: error.message,
+                            type: 'error',
+                        });
+                    }
+                },
+                onDelete: async (id) => {
+                    try {
+                        const confirmResult = await openConfirmDialog({
+                            title: 'Delete Event',
+                            text: 'Are you sure you want to delete this event?',
+                        });
+                        if (!confirmResult?.confirmed) {
+                            return;
+                        }
+                        showProgressIndicator('Deleting event...');
+                        await config.deleteEvent(id);
+                        await queryClient.invalidateQueries({
+                            queryKey: ['calendar-events'],
+                        });
+                        close();
+                    }
+                    catch (error) {
+                        openToastNotification({
+                            title: 'Error',
+                            text: error.message,
+                            type: 'error',
+                        });
+                    }
+                    finally {
+                        hideProgressIndicator();
+                    }
+                },
+                allowOpenRecord: !!config.openRecord,
+                onOpenRecord: config.openRecord,
+                onCancel: () => {
+                    close();
+                },
+            },
+        });
+    }
+    function handleDateSelect(selectInfo) {
+        openEventDetailModel({
+            title: '',
+            start: selectInfo.start.toISOString(),
+            end: selectInfo.end.toISOString(),
+            allDay: selectInfo.allDay,
+            customer: null,
+            description: '',
+        });
+    }
+    function handleEventClick(clickInfo) {
+        openEventDetailModel({
+            id: clickInfo.event.id,
+            title: clickInfo.event.title,
+            start: clickInfo.event.start?.toISOString(),
+            end: clickInfo.event.end?.toISOString(),
+            allDay: clickInfo.event.allDay,
+            description: '',
+            ...clickInfo.event.extendedProps,
+        });
+    }
+    function handleCreateButtonClick() {
+        openEventDetailModel({
+            title: '',
+            start: null,
+            end: null,
+            allDay: false,
+            description: '',
+        });
+    }
+    const onRangeChange = ({ currentStart, currentEnd, activeStart, activeEnd, viewType, }) => {
+        setCurrentStartDate(currentStart);
+        setCurrentEndDate(currentEnd);
+        setActiveStartDate(activeStart);
+        setActiveEndDate(activeEnd);
+        setViewType(viewType);
+    };
+    return ((0, jsx_runtime_1.jsx)(context_1.CalendarContext.Provider, { value: contextValue, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                display: 'flex',
+                flexDirection: 'column',
+                flex: 1,
+                gap: react_components_1.tokens.spacingVerticalM,
+                padding: react_components_1.tokens.spacingHorizontalL,
+                background: react_components_1.tokens.colorNeutralBackground3,
+            }, children: [(0, jsx_runtime_1.jsx)(Header_1.Header, { filterForm: filterForm, onCreateButtonClick: handleCreateButtonClick }), (0, jsx_runtime_1.jsx)(CalendarSection, { startDate: currentStartDate, endDate: currentEndDate, viewType: viewType, onRangeChange: onRangeChange, events: events ?? [], onEventClick: handleEventClick, onDateSelect: handleDateSelect, loading: loading })] }) }));
+}

package/PageCalendar/TitleSelector.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+import { ViewType } from './types';
+interface TitleSelectorProps {
+    start?: Date | null;
+    end?: Date | null;
+    viewType: ViewType;
+    onChange: (start: Date, end: Date) => void;
+}
+export declare const TitleSelector: FC<TitleSelectorProps>;
+export {};

package/PageCalendar/TitleSelector.js

@@ -0,0 +1,73 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TitleSelector = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_calendar_compat_1 = require("@fluentui/react-calendar-compat");
+const react_components_1 = require("@fluentui/react-components");
+const locale_1 = require("@headless-adminapp/app/locale");
+const icons_fluent_1 = require("@headless-adminapp/icons-fluent");
+const dayjs_1 = __importDefault(require("dayjs"));
+const isoWeek_1 = __importDefault(require("dayjs/plugin/isoWeek"));
+const timezone_1 = __importDefault(require("dayjs/plugin/timezone"));
+const utc_1 = __importDefault(require("dayjs/plugin/utc"));
+const react_1 = require("react");
+const types_1 = require("./types");
+dayjs_1.default.extend(utc_1.default);
+dayjs_1.default.extend(timezone_1.default);
+dayjs_1.default.extend(isoWeek_1.default);
+const TitleSelector = ({ start, end, onChange, viewType, }) => {
+    const { timezone } = (0, locale_1.useLocale)();
+    const label = (0, react_1.useMemo)(() => {
+        if (!start || !end) {
+            return '';
+        }
+        switch (viewType) {
+            case types_1.ViewType.Day:
+                return (0, dayjs_1.default)(start).format('MMM D, YYYY');
+            case types_1.ViewType.Week:
+                return `${(0, dayjs_1.default)(start).format('MMM D')} - ${(0, dayjs_1.default)(end).format('MMM D, YYYY')}`;
+            case types_1.ViewType.Month:
+                return (0, dayjs_1.default)(start).format('MMMM YYYY');
+        }
+        return '';
+    }, [start, end, viewType]);
+    if (!start || !end) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsxs)(react_components_1.Popover, { positioning: "below", children: [(0, jsx_runtime_1.jsx)(react_components_1.PopoverTrigger, { children: (0, jsx_runtime_1.jsx)(react_components_1.Button, { appearance: "subtle", style: {
+                        fontWeight: react_components_1.tokens.fontWeightMedium,
+                        fontSize: react_components_1.tokens.fontSizeBase400,
+                    }, icon: (0, jsx_runtime_1.jsx)(icons_fluent_1.iconSet.ChevronDown, { size: 16 }), iconPosition: "after", children: label }) }), (0, jsx_runtime_1.jsxs)(react_components_1.PopoverSurface, { tabIndex: -1, style: { padding: 0 }, children: [viewType === types_1.ViewType.Month && ((0, jsx_runtime_1.jsx)(react_calendar_compat_1.Calendar, { dateRangeType: react_calendar_compat_1.DateRangeType.Month, highlightSelectedMonth: true, isDayPickerVisible: false, value: start ? (0, dayjs_1.default)(start).toDate() : new Date(), onSelectDate: (date) => {
+                            const start = (0, dayjs_1.default)(date)
+                                .tz(timezone, true)
+                                .startOf('month')
+                                .toDate();
+                            const end = (0, dayjs_1.default)(date)
+                                .tz(timezone, true)
+                                .endOf('month')
+                                .toDate();
+                            onChange(start, end);
+                        } })), viewType === types_1.ViewType.Week && ((0, jsx_runtime_1.jsx)(react_calendar_compat_1.Calendar, { dateRangeType: react_calendar_compat_1.DateRangeType.Week, firstDayOfWeek: 1, value: start ? (0, dayjs_1.default)(start).toDate() : new Date(), onSelectDate: (date) => {
+                            const start = (0, dayjs_1.default)(date)
+                                .tz(timezone, true)
+                                .startOf('isoWeek')
+                                .toDate();
+                            const end = (0, dayjs_1.default)(date)
+                                .tz(timezone, true)
+                                .endOf('isoWeek')
+                                .toDate();
+                            onChange(start, end);
+                        } })), viewType === types_1.ViewType.Day && ((0, jsx_runtime_1.jsx)(react_calendar_compat_1.Calendar, { dateRangeType: react_calendar_compat_1.DateRangeType.Day, firstDayOfWeek: 1, value: start ? (0, dayjs_1.default)(start).toDate() : new Date(), onSelectDate: (date) => {
+                            console.log('d', date);
+                            const start = (0, dayjs_1.default)(date)
+                                .tz(timezone, true)
+                                .startOf('day')
+                                .toDate();
+                            const end = (0, dayjs_1.default)(date).tz(timezone, true).endOf('day').toDate();
+                            onChange(start, end);
+                        } }))] })] }));
+};
+exports.TitleSelector = TitleSelector;

package/PageCalendar/ViewSelector.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { ViewType } from './types';
+interface ViewSelectorProps {
+    viewType: ViewType;
+    onChange: (viewType: ViewType) => void;
+}
+export declare const ViewSelector: FC<ViewSelectorProps>;
+export {};

package/PageCalendar/ViewSelector.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViewSelector = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_components_1 = require("@fluentui/react-components");
+const react_1 = require("react");
+const types_1 = require("./types");
+const viewItems = [
+    {
+        label: 'Month',
+        value: types_1.ViewType.Month,
+    },
+    {
+        label: 'Week',
+        value: types_1.ViewType.Week,
+    },
+    {
+        label: 'Day',
+        value: types_1.ViewType.Day,
+    },
+];
+const useStyles = (0, react_components_1.makeStyles)({
+    root: {},
+    button: {
+        '&:not(:first-of-type)': {
+            // borderLeftWidth: 0,
+            borderTopLeftRadius: 0,
+            borderBottomLeftRadius: 0,
+        },
+        '&:not(:last-of-type)': {
+            borderRightWidth: 0,
+            borderTopRightRadius: 0,
+            borderBottomRightRadius: 0,
+        },
+    },
+    active: {
+        '&+button': {
+            borderLeftColor: 'transparent !important',
+        },
+    },
+});
+const ViewSelector = ({ viewType, onChange }) => {
+    const styles = useStyles();
+    return ((0, jsx_runtime_1.jsx)("div", { style: {
+            display: 'inline-flex',
+            overflow: 'hidden',
+        }, className: styles.root, children: viewItems.map((item) => ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: (0, jsx_runtime_1.jsx)(react_components_1.Button, { className: (0, react_components_1.mergeClasses)(styles.button, item.value === viewType && styles.active), appearance: item.value === viewType ? 'primary' : 'secondary', onClick: () => onChange(item.value), style: {
+                    fontWeight: react_components_1.tokens.fontWeightRegular,
+                    minWidth: 60,
+                }, children: item.label }, item.value) }, item.value))) }));
+};
+exports.ViewSelector = ViewSelector;

package/PageCalendar/baseEventAttributes.d.ts

@@ -0,0 +1,35 @@
+export declare const baseEventAttributes: {
+    id: {
+        type: "id";
+        label: string;
+        string: true;
+    };
+    title: {
+        type: "string";
+        format: "text";
+        label: string;
+        required: true;
+    };
+    start: {
+        type: "date";
+        format: "datetime";
+        label: string;
+        required: true;
+    };
+    end: {
+        type: "date";
+        format: "datetime";
+        label: string;
+        required: true;
+    };
+    allDay: {
+        type: "boolean";
+        label: string;
+    };
+    description: {
+        type: "string";
+        format: "textarea";
+        label: string;
+    };
+};
+export type BaseEventAttributes = typeof baseEventAttributes;

package/PageCalendar/baseEventAttributes.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.baseEventAttributes = void 0;
+const utils_1 = require("@headless-adminapp/core/schema/utils");
+exports.baseEventAttributes = (0, utils_1.defineSchemaAttributes)({
+    id: {
+        type: 'id',
+        label: 'ID',
+        string: true,
+    },
+    title: {
+        type: 'string',
+        format: 'text',
+        label: 'Title',
+        required: true,
+    },
+    start: {
+        type: 'date',
+        format: 'datetime',
+        label: 'Start',
+        required: true,
+    },
+    end: {
+        type: 'date',
+        format: 'datetime',
+        label: 'End',
+        required: true,
+    },
+    allDay: {
+        type: 'boolean',
+        label: 'All day',
+    },
+    description: {
+        type: 'string',
+        format: 'textarea',
+        label: 'Description',
+    },
+});

package/PageCalendar/context.d.ts

@@ -0,0 +1,20 @@
+import type { InferredSchemaType, SchemaAttributes } from '@headless-adminapp/core/schema';
+import { CalendarEventResolverFn, CalendarEventSaveFn, CalendarEventsResolverFn } from './types';
+export interface CalendarConfig<SA1 extends SchemaAttributes = SchemaAttributes, SA2 extends SchemaAttributes = SchemaAttributes, SA3 extends SchemaAttributes = SchemaAttributes> {
+    eventsResolver: CalendarEventsResolverFn<SA3>;
+    eventResolver?: CalendarEventResolverFn;
+    saveEvent: CalendarEventSaveFn<SA1, SA2>;
+    beforeDescriptionAttributes?: SA1;
+    afterDescriptionAttributes?: SA2;
+    filterAttributes?: SA3;
+    defaultFilter?: InferredSchemaType<SA3>;
+    openRecord?: (id: string) => void;
+    deleteEvent: (id: string) => Promise<void>;
+    title: string;
+    description: string;
+    eventLabel: string;
+}
+export interface CalendarContextState<SA1 extends SchemaAttributes = SchemaAttributes, SA2 extends SchemaAttributes = SchemaAttributes, SA3 extends SchemaAttributes = SchemaAttributes> {
+    config: CalendarConfig<SA1, SA2, SA3>;
+}
+export declare const CalendarContext: import("react").Context<import("@headless-adminapp/app/mutable").ContextValue<CalendarContextState<SchemaAttributes, SchemaAttributes, SchemaAttributes>>>;

package/PageCalendar/context.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CalendarContext = void 0;
+const mutable_1 = require("@headless-adminapp/app/mutable");
+exports.CalendarContext = (0, mutable_1.createContext)();

package/PageCalendar/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './useConfig';

package/PageCalendar/hooks/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useConfig"), exports);

package/PageCalendar/hooks/useConfig.d.ts

@@ -0,0 +1,3 @@
+import { SchemaAttributes } from '@headless-adminapp/core/schema';
+import { CalendarConfig } from '../context';
+export declare function useConfig<SA1 extends SchemaAttributes = SchemaAttributes, SA2 extends SchemaAttributes = SchemaAttributes, SA3 extends SchemaAttributes = SchemaAttributes>(): CalendarConfig<SA1, SA2, SA3>;

package/PageCalendar/hooks/useConfig.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useConfig = useConfig;
+const mutable_1 = require("@headless-adminapp/app/mutable");
+const context_1 = require("../context");
+function useConfig() {
+    return (0, mutable_1.useContextSelector)(context_1.CalendarContext, (state) => state.config);
+}

package/PageCalendar/index.d.ts

@@ -0,0 +1 @@
+export { PageCalendar } from './PageCalendar';

package/PageCalendar/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageCalendar = void 0;
+var PageCalendar_1 = require("./PageCalendar");
+Object.defineProperty(exports, "PageCalendar", { enumerable: true, get: function () { return PageCalendar_1.PageCalendar; } });

package/PageCalendar/renderEventContent.d.ts

@@ -0,0 +1,2 @@
+import type { EventContentArg } from '@fullcalendar/core';
+export declare function renderEventContent(eventInfo: EventContentArg): import("react/jsx-runtime").JSX.Element;