@headless-adminapp/fluent 1.2.0 → 1.2.2

package/PageCalendar/CalendarSection.d.ts

@@ -14,6 +14,8 @@ interface CalendarSectionProps {
     events: EventInput[];
     onDateSelect?: (event: DateSelectArg) => void;
     loading?: boolean;
+    selectable?: boolean;
+    initialDate?: Date;
 }
-export declare const CalendarSection: ({ startDate, endDate, viewType, onRangeChange, events, onDateSelect, loading, }: Readonly<CalendarSectionProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const CalendarSection: ({ startDate, endDate, viewType, onRangeChange, events, onDateSelect, loading, selectable, initialDate, }: Readonly<CalendarSectionProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/PageCalendar/CalendarSection.js

@@ -8,6 +8,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_components_1 = require("@fluentui/react-components");
 const daygrid_1 = __importDefault(require("@fullcalendar/daygrid"));
 const interaction_1 = __importDefault(require("@fullcalendar/interaction"));
+const moment_timezone_1 = __importDefault(require("@fullcalendar/moment-timezone"));
 const react_1 = __importDefault(require("@fullcalendar/react"));
 const timegrid_1 = __importDefault(require("@fullcalendar/timegrid"));
 const hooks_1 = require("@headless-adminapp/app/hooks");
@@ -26,9 +27,9 @@ const ViewSelector_1 = require("./ViewSelector");
 dayjs_1.default.extend(utc_1.default);
 dayjs_1.default.extend(timezone_1.default);
 dayjs_1.default.extend(isoWeek_1.default);
-const CalendarSection = ({ startDate, endDate, viewType, onRangeChange, events, onDateSelect, loading, }) => {
+const CalendarSection = ({ startDate, endDate, viewType, onRangeChange, events, onDateSelect, loading, selectable, initialDate, }) => {
     const calendarRef = (0, react_2.useRef)(null);
-    const { timezone } = (0, locale_1.useLocale)();
+    const { timezone, timeFormats } = (0, locale_1.useLocale)();
     const isMobile = (0, hooks_1.useIsMobile)();
     const isToday = (0, react_2.useMemo)(() => {
         if (!startDate || !endDate) {
@@ -130,8 +131,13 @@ const CalendarSection = ({ startDate, endDate, viewType, onRangeChange, events,
                         }, children: (0, jsx_runtime_1.jsx)(ViewSelector_1.ViewSelector, { viewType: viewType, onChange: (viewType) => {
                                 calendarRef.current?.getApi().changeView(viewType);
                                 calendarRef.current?.getApi().scrollToTime(initialScrollTime);
-                            } }) })] }), (0, jsx_runtime_1.jsxs)("div", { style: { flex: 1, position: 'relative' }, children: [(0, jsx_runtime_1.jsx)("div", { style: { position: 'absolute', inset: 0 }, children: (0, jsx_runtime_1.jsx)(react_1.default, { ref: calendarRef, plugins: [daygrid_1.default, timegrid_1.default, interaction_1.default], initialView: types_1.ViewType.Month, weekends: true, firstDay: 1, events: events, datesSet: handleDateRangeChange, select: onDateSelect, eventContent: renderEventContent_1.renderEventContent, timeZone: timezone, height: "100%", nowIndicator: true, scrollTime: initialScrollTime, scrollTimeReset: false, editable: false, selectable: true, selectMirror: true, dayMaxEvents: true, eventMinHeight: 24, eventTimeFormat: (props) => {
-                                return (0, dayjs_1.default)(props.start.marker).tz(timezone).format('hh:mm A');
+                            } }) })] }), (0, jsx_runtime_1.jsxs)("div", { style: { flex: 1, position: 'relative' }, children: [(0, jsx_runtime_1.jsx)("div", { style: { position: 'absolute', inset: 0 }, children: (0, jsx_runtime_1.jsx)(react_1.default, { ref: calendarRef, plugins: [
+                                daygrid_1.default,
+                                timegrid_1.default,
+                                interaction_1.default,
+                                moment_timezone_1.default,
+                            ], initialView: viewType, initialDate: initialDate, weekends: true, firstDay: 1, events: events, datesSet: handleDateRangeChange, select: onDateSelect, eventContent: renderEventContent_1.renderEventContent, timeZone: timezone, height: "100%", nowIndicator: true, scrollTime: initialScrollTime, scrollTimeReset: false, editable: false, selectable: selectable, selectMirror: true, dayMaxEvents: true, eventMinHeight: 24, eventTimeFormat: (props) => {
+                                return (0, dayjs_1.default)(new Date(props.start.year, props.start.month, props.start.day, props.start.hour, props.start.minute)).format(timeFormats.short);
                             }, headerToolbar: false }) }), (0, jsx_runtime_1.jsx)(BodyLoading_1.BodyLoading, { loading: loading })] })] }));
 };
 exports.CalendarSection = CalendarSection;

package/PageCalendar/PageCalendar.d.ts

@@ -2,6 +2,9 @@ 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>;
+    initialView?: string;
+    initialDate?: string;
+    onChange?: (view: string, date: string) => void;
 }
 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

@@ -16,5 +16,5 @@ function PageCalendar(props) {
         });
     }, [contextValue, props.config]);
     const config = props.config;
-    return ((0, jsx_runtime_1.jsx)(CalendarProvider_1.CalendarProvider, { config: config, children: (0, jsx_runtime_1.jsx)(PageCalendarUI_1.PageCalendarUI, {}) }));
+    return ((0, jsx_runtime_1.jsx)(CalendarProvider_1.CalendarProvider, { config: config, children: (0, jsx_runtime_1.jsx)(PageCalendarUI_1.PageCalendarUI, { initialView: props.initialView, initialDate: props.initialDate, onChange: props.onChange }) }));
 }

package/PageCalendar/PageCalendarUI.d.ts

@@ -1,2 +1,8 @@
 import { SchemaAttributes } from '@headless-adminapp/core/schema';
-export declare function PageCalendarUI<SA3 extends SchemaAttributes = SchemaAttributes>(): import("react/jsx-runtime").JSX.Element;
+interface PageCalendarUIProps {
+    initialView?: string;
+    initialDate?: string;
+    onChange?: (view: string, date: string) => void;
+}
+export declare function PageCalendarUI<SA3 extends SchemaAttributes = SchemaAttributes>(props: Readonly<PageCalendarUIProps>): import("react/jsx-runtime").JSX.Element;
+export {};

package/PageCalendar/PageCalendarUI.js

@@ -33,6 +33,7 @@ const auth_1 = require("@headless-adminapp/app/auth");
 const hooks_1 = require("@headless-adminapp/app/calendar/hooks");
 const useOpenDetailDialog_1 = require("@headless-adminapp/app/calendar/hooks/useOpenDetailDialog");
 const hooks_2 = require("@headless-adminapp/app/hooks");
+const locale_1 = require("@headless-adminapp/app/locale");
 const navigation_1 = require("@headless-adminapp/app/navigation");
 const route_1 = require("@headless-adminapp/app/route");
 const toast_notification_1 = require("@headless-adminapp/app/toast-notification");
@@ -51,15 +52,50 @@ const CalendarSection = (0, react_1.lazy)(() => Promise.resolve().then(() => __i
 dayjs_1.default.extend(utc_1.default);
 dayjs_1.default.extend(timezone_1.default);
 dayjs_1.default.extend(isoWeek_1.default);
-function PageCalendarUI() {
+function strToViewType(view) {
+    switch (view) {
+        case 'month':
+        case types_1.ViewType.Month:
+            return types_1.ViewType.Month;
+        case 'week':
+        case types_1.ViewType.Week:
+            return types_1.ViewType.Week;
+        case 'day':
+        case types_1.ViewType.Day:
+            return types_1.ViewType.Day;
+        default:
+            return undefined;
+    }
+}
+function viewTypeToStr(view) {
+    switch (view) {
+        case types_1.ViewType.Month:
+            return 'month';
+        case types_1.ViewType.Week:
+            return 'week';
+        case types_1.ViewType.Day:
+            return 'day';
+    }
+}
+function getInitialView(isMobile, initialView) {
+    if (initialView) {
+        const _view = strToViewType(initialView);
+        if (_view) {
+            return _view;
+        }
+    }
+    return isMobile ? types_1.ViewType.Day : types_1.ViewType.Month;
+}
+function PageCalendarUI(props) {
     const config = (0, hooks_1.useConfig)();
     const openToastNotification = (0, toast_notification_1.useOpenToastNotification)();
     const isMobile = (0, hooks_2.useIsMobile)();
+    const { timezone } = (0, locale_1.useLocale)();
     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)(isMobile ? types_1.ViewType.Day : types_1.ViewType.Month);
+    const [viewType, setViewType] = (0, react_1.useState)(getInitialView(isMobile, props.initialView));
     const filterForm = (0, react_hook_form_1.useForm)({
         mode: 'all',
         defaultValues: config.defaultFilter,
@@ -100,10 +136,28 @@ function PageCalendarUI() {
         },
         staleTime: 1000 * 60 * 5, // 5 minutes
     });
+    const initialDate = (0, react_1.useMemo)(() => {
+        if (!props.initialDate) {
+            return undefined;
+        }
+        return (0, dayjs_1.default)(props.initialDate).tz(timezone, true).toDate();
+    }, [props.initialDate, timezone]);
     const openEventDetailModel = (0, useOpenDetailDialog_1.useOpenDetailDialog)(EventDialog_1.EventDialog);
     const router = (0, route_1.useRouter)();
     const routeResolver = (0, route_1.useRouteResolver)();
     const openForm = (0, navigation_1.useOpenForm)();
+    const selectable = (0, react_1.useMemo)(() => {
+        if (!config.createOptions) {
+            return false;
+        }
+        if (config.createOptions.mode === 'dialog') {
+            return true;
+        }
+        if (config.createOptions.mode === 'custom') {
+            return config.createOptions.allowQuickCreate ?? false;
+        }
+        return false;
+    }, [config.createOptions]);
     const handleNewRecord = (values) => {
         if (!config.createOptions) {
             return;
@@ -157,6 +211,7 @@ function PageCalendarUI() {
         setActiveStartDate(activeStart);
         setActiveEndDate(activeEnd);
         setViewType(viewType);
+        props.onChange?.(viewTypeToStr(viewType), (0, dayjs_1.default)(currentStart).tz(timezone).format('YYYY-MM-DD'));
     };
     return ((0, jsx_runtime_1.jsxs)("div", { style: {
             display: 'flex',
@@ -165,5 +220,5 @@ function PageCalendarUI() {
             gap: react_components_1.tokens.spacingVerticalM,
             padding: react_components_1.tokens.spacingHorizontalM,
             background: react_components_1.tokens.colorNeutralBackground2,
-        }, children: [(0, jsx_runtime_1.jsx)(Header_1.Header, { filterForm: filterForm, onCreateButtonClick: handleCreateButtonClick }), (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(CalendarSection, { startDate: currentStartDate, endDate: currentEndDate, viewType: viewType, onRangeChange: onRangeChange, events: events ?? [], onDateSelect: handleDateSelect, loading: loading }) })] }));
+        }, children: [(0, jsx_runtime_1.jsx)(Header_1.Header, { filterForm: filterForm, onCreateButtonClick: handleCreateButtonClick }), (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(CalendarSection, { startDate: currentStartDate, endDate: currentEndDate, viewType: viewType, onRangeChange: onRangeChange, events: events ?? [], onDateSelect: handleDateSelect, loading: loading, selectable: selectable, initialDate: initialDate }) })] }));
 }

package/PageCalendar/renderEventContent.js

@@ -14,32 +14,35 @@ const navigation_1 = require("@headless-adminapp/app/navigation");
 const route_1 = require("@headless-adminapp/app/route");
 const icons_1 = require("@headless-adminapp/icons");
 const dayjs_1 = __importDefault(require("dayjs"));
+const timezone_1 = __importDefault(require("dayjs/plugin/timezone"));
+const utc_1 = __importDefault(require("dayjs/plugin/utc"));
 const react_1 = require("react");
 const EventDialog_1 = require("./EventDialog/EventDialog");
+dayjs_1.default.extend(utc_1.default);
+dayjs_1.default.extend(timezone_1.default);
 function renderEventContent(eventInfo) {
     return (0, jsx_runtime_1.jsx)(EventContent, { eventInfo: eventInfo });
 }
 const EventContent = ({ eventInfo }) => {
     const [open, setOpen] = (0, react_1.useState)(false);
-    return ((0, jsx_runtime_1.jsxs)(react_components_1.Popover, { positioning: "after", withArrow: true, open: open, onOpenChange: (e, data) => setOpen(data.open), children: [(0, jsx_runtime_1.jsx)(react_components_1.PopoverTrigger, { children: (0, jsx_runtime_1.jsxs)("div", { style: {
-                        display: 'flex',
-                        backgroundColor: react_components_1.tokens.colorBrandBackground2,
-                        color: react_components_1.tokens.colorNeutralForeground1,
-                        borderRadius: react_components_1.tokens.borderRadiusMedium,
-                        paddingBlock: react_components_1.tokens.spacingVerticalXXS,
-                        paddingInline: react_components_1.tokens.spacingHorizontalS,
-                        border: `1px solid ${react_components_1.tokens.colorBrandStroke2}`,
-                        gap: react_components_1.tokens.spacingHorizontalS,
-                        width: '100%',
-                        overflow: 'hidden',
-                        textOverflow: 'ellipsis',
-                        height: '100%',
-                        cursor: 'pointer',
-                    }, children: [eventInfo.timeText && (0, jsx_runtime_1.jsx)("span", { children: eventInfo.timeText }), (0, jsx_runtime_1.jsx)("span", { style: { fontWeight: react_components_1.tokens.fontWeightSemibold }, children: eventInfo.event.title })] }) }), (0, jsx_runtime_1.jsx)(react_components_1.PopoverSurface, { style: { maxWidth: 600 }, children: (0, jsx_runtime_1.jsx)(PopoverContent, { eventInfo: eventInfo, onClose: () => setOpen(false) }) })] }));
+    return ((0, jsx_runtime_1.jsx)("div", { style: { height: '100%', display: 'flex' }, children: (0, jsx_runtime_1.jsxs)(react_components_1.Popover, { positioning: "after", withArrow: true, open: open, onOpenChange: (e, data) => setOpen(data.open), children: [(0, jsx_runtime_1.jsx)(react_components_1.PopoverTrigger, { children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                            display: 'flex',
+                            backgroundColor: react_components_1.tokens.colorBrandBackground2,
+                            color: react_components_1.tokens.colorNeutralForeground1,
+                            borderRadius: react_components_1.tokens.borderRadiusMedium,
+                            paddingBlock: react_components_1.tokens.spacingVerticalXXS,
+                            paddingInline: react_components_1.tokens.spacingHorizontalS,
+                            border: `1px solid ${react_components_1.tokens.colorBrandStroke2}`,
+                            gap: react_components_1.tokens.spacingHorizontalS,
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            height: '100%',
+                            cursor: 'pointer',
+                        }, children: [eventInfo.timeText && (0, jsx_runtime_1.jsx)("span", { children: eventInfo.timeText }), (0, jsx_runtime_1.jsx)("span", { style: { fontWeight: react_components_1.tokens.fontWeightSemibold }, children: eventInfo.event.title })] }) }), (0, jsx_runtime_1.jsx)(react_components_1.PopoverSurface, { style: { maxWidth: 480 }, children: (0, jsx_runtime_1.jsx)(PopoverContent, { eventInfo: eventInfo, onClose: () => setOpen(false) }) })] }) }));
 };
 const PopoverContent = ({ eventInfo, onClose }) => {
     const config = (0, useConfig_1.useConfig)();
-    const { dateFormats, timeFormats } = (0, locale_1.useLocale)();
+    const { dateFormats, timeFormats, timezone } = (0, locale_1.useLocale)();
     const deleteEvent = (0, useDeleteEvent_1.useDeleteEvent)();
     const openEventDetailModel = (0, useOpenDetailDialog_1.useOpenDetailDialog)(EventDialog_1.EventDialog);
     const router = (0, route_1.useRouter)();
@@ -92,7 +95,11 @@ const PopoverContent = ({ eventInfo, onClose }) => {
                     display: 'flex',
                     flexDirection: 'column',
                     gap: react_components_1.tokens.spacingVerticalM,
-                }, children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, dayjs_1.default)(eventInfo.event.start).format(dateFormats.long), ' ', (0, dayjs_1.default)(eventInfo.event.start).format(timeFormats.short), ' ', eventInfo.event.allDay
-                                ? 'All Day'
-                                : '- ' + (0, dayjs_1.default)(eventInfo.event.end).format(timeFormats.short)] }), (0, jsx_runtime_1.jsx)("div", { children: eventInfo.event.extendedProps.description })] })] }));
+                }, children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, dayjs_1.default)(eventInfo.event.start).tz(timezone).format(dateFormats.long), ' ', eventInfo.event.allDay
+                                ? '(All Day)'
+                                : (0, dayjs_1.default)(eventInfo.event.start)
+                                    .tz(timezone)
+                                    .format(timeFormats.short) +
+                                    ' - ' +
+                                    (0, dayjs_1.default)(eventInfo.event.end).tz(timezone).format(timeFormats.short)] }), (0, jsx_runtime_1.jsx)("div", { children: eventInfo.event.extendedProps.description })] })] }));
 };

package/PageEntityForm/StandardControl.js

@@ -18,6 +18,7 @@ const DateTimeControl_1 = require("../form/controls/DateTimeControl");
 const DecimalControl_1 = require("../form/controls/DecimalControl");
 const DurationControl_1 = require("../form/controls/DurationControl");
 const EmailControl_1 = require("../form/controls/EmailControl");
+const IdControl_1 = require("../form/controls/IdControl");
 const IntegerControl_1 = require("../form/controls/IntegerControl");
 const LookupControl_1 = require("../form/controls/LookupControl");
 const MultiSelectControl_1 = __importDefault(require("../form/controls/MultiSelectControl"));
@@ -56,6 +57,21 @@ const StandardControl = (props) => {
     const { schemaStore, experienceStore } = (0, hooks_1.useMetadata)();
     // const { openQuickCreate } = useQuickCreateForm();
     switch (attribute.type) {
+        case 'id': {
+            const controlProps = {
+                name,
+                placeholder,
+                value,
+                onChange,
+                onBlur,
+                error: isError,
+                disabled: readOnly,
+                readOnly,
+            };
+            const Control = componentStore_1.componentStore.getComponent('Form.IdControl') ??
+                IdControl_1.IdControl;
+            return (0, jsx_runtime_1.jsx)(Control, { ...controlProps, idTypes: attribute });
+        }
         case 'string': {
             const controlProps = {
                 name,

package/form/controls/IdControl.d.ts

@@ -0,0 +1,7 @@
+import { Id } from '@headless-adminapp/core';
+import { IdTypes } from '@headless-adminapp/core/attributes/IdAttribute';
+import { ControlProps } from './types';
+export interface IdControlProps extends ControlProps<Id> {
+    idTypes: IdTypes;
+}
+export declare function IdControl({ idTypes, ...props }: Readonly<IdControlProps>): import("react/jsx-runtime").JSX.Element;

package/form/controls/IdControl.js

@@ -0,0 +1,68 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IdControl = IdControl;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const IntegerControl_1 = require("./IntegerControl");
+const TextControl_1 = require("./TextControl");
+function formatGuid(value) {
+    if (!value) {
+        return '';
+    }
+    value = value.replace(/[^0-9a-fA-F]/g, '');
+    const part1 = value.substring(0, 8);
+    const part2 = value.substring(8, 12);
+    const part3 = value.substring(12, 16);
+    const part4 = value.substring(16, 20);
+    const part5 = value.substring(20, 32);
+    let formattedValue = '';
+    formattedValue += part1;
+    if (part2) {
+        formattedValue += `-${part2}`;
+    }
+    if (part3) {
+        formattedValue += `-${part3}`;
+    }
+    if (part4) {
+        formattedValue += `-${part4}`;
+    }
+    if (part5) {
+        formattedValue += `-${part5}`;
+    }
+    return formattedValue.toLowerCase();
+}
+function formatObjectId(value) {
+    if (!value) {
+        return '';
+    }
+    value = value.replace(/[^0-9a-fA-F]/g, '');
+    return value.substring(0, 24).toLowerCase();
+}
+function IdControl({ idTypes, ...props }) {
+    if ('string' in idTypes && idTypes.string) {
+        return (0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, value: props.value });
+    }
+    else if ('number' in idTypes && idTypes.number) {
+        return (0, jsx_runtime_1.jsx)(IntegerControl_1.IntegerControl, { ...props, value: props.value });
+    }
+    else if ('guid' in idTypes && idTypes.guid) {
+        return ((0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, maxLength: 36, value: formatGuid(props.value), onChange: (value) => {
+                if (!value) {
+                    props.onChange?.(null);
+                }
+                else {
+                    props.onChange?.(formatGuid(value));
+                }
+            } }));
+    }
+    else if ('objectId' in idTypes && idTypes.objectId) {
+        return ((0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, maxLength: 24, value: props.value, onChange: (value) => {
+                if (!value) {
+                    props.onChange?.(null);
+                }
+                else {
+                    props.onChange?.(formatObjectId(value));
+                }
+            } }));
+    }
+    return ((0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, value: props.value ? String(props.value) : null, onChange: () => { }, placeholder: "Unsupported ID type", disabled: true }));
+}

package/form/controls/TextControl.d.ts

@@ -6,5 +6,6 @@ export interface TextControlProps extends ControlProps<string> {
     autoCorrect?: string;
     textTransform?: 'capitalize' | 'uppercase' | 'lowercase' | 'none';
     appearance?: InputProps['appearance'];
+    maxLength?: number;
 }
-export declare function TextControl({ value, onChange, id, name, onBlur, onFocus, placeholder, disabled, autoComplete, autoFocus, autoCapitalize, autoCorrect, textTransform, readOnly, appearance, }: TextControlProps): import("react/jsx-runtime").JSX.Element;
+export declare function TextControl({ value, onChange, id, name, onBlur, onFocus, placeholder, disabled, autoComplete, autoFocus, autoCapitalize, autoCorrect, textTransform, readOnly, appearance, maxLength, }: TextControlProps): import("react/jsx-runtime").JSX.Element;

package/form/controls/TextControl.js

@@ -7,7 +7,7 @@ function TextControl({ value, onChange, id, name, onBlur, onFocus,
 // error,
 placeholder, disabled, autoComplete, autoFocus, autoCapitalize, autoCorrect, textTransform, 
 // borderOnFocusOnly,
-readOnly, appearance = 'filled-darker', }) {
+readOnly, appearance = 'filled-darker', maxLength, }) {
     const readonly = disabled || readOnly;
     return ((0, jsx_runtime_1.jsx)(react_components_1.Input, { placeholder: placeholder, id: id, name: name, autoFocus: autoFocus, appearance: appearance, value: value || '', onChange: (e) => {
             textTransform === 'uppercase'
@@ -20,5 +20,5 @@ readOnly, appearance = 'filled-darker', }) {
         // readOnly={readOnly || disabled}
         readOnly: readonly, autoComplete: autoComplete, autoCorrect: autoCorrect, autoCapitalize: autoCapitalize, className: (0, react_components_1.mergeClasses)(readonly && 'TextControl_readonly'), style: {
             width: '100%',
-        } }));
+        }, maxLength: maxLength }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@headless-adminapp/fluent",
-  "version": "1.2.0",
+  "version": "1.2.2",
   "description": "",
   "main": "index.js",
   "types": "index.d.ts",
@@ -32,6 +32,7 @@
     "@fullcalendar/core": "6.1.15",
     "@fullcalendar/daygrid": "6.1.15",
     "@fullcalendar/interaction": "6.1.15",
+    "@fullcalendar/moment-timezone": "6.1.15",
     "@fullcalendar/react": "6.1.15",
     "@fullcalendar/timegrid": "6.1.15",
     "@hookform/resolvers": "^3.9.0",
@@ -50,5 +51,5 @@
     "uuid": "11.0.3",
     "yup": "^1.4.0"
   },
-  "gitHead": "3c59cbbf000e71e39b81c9440a71363b729e6e3c"
+  "gitHead": "ae232366aacd1153ee983d09b24f2f3e20548a68"
 }