ish-ui 1.0.30 → 1.0.32

package/dist/formFields/EditInPlaceFileField.js

@@ -25,6 +25,7 @@ import InputAdornment from '@mui/material/InputAdornment';
 import EditInPlaceField from './EditInPlaceField';
 import { stubFunction } from '../utils';
 function EditInPlaceFileField(_a) {
+    var _b;
     var { input } = _a, restProps = __rest(_a, ["input"]);
     const inputRef = useRef();
     const fileRef = useRef();
@@ -48,7 +49,7 @@ function EditInPlaceFileField(_a) {
                 onFocus: stubFunction,
                 onBlur: stubFunction
             }, InputProps: {
-                startAdornment: React.createElement(InputAdornment, { position: "start" },
+                startAdornment: React.createElement(InputAdornment, { position: "start", className: (_b = restProps.fieldClasses) === null || _b === void 0 ? void 0 : _b.text },
                     React.createElement(AttachmentIcon, null)),
                 onFocus,
                 inputProps: {

package/dist/formFields/EditInPlaceMoneyField.d.ts

@@ -5,5 +5,5 @@ interface Props<InputProps, MetaProps> extends EditInPlaceFieldProps<InputProps,
     currencySymbol: string;
     dispatch?: Dispatch;
 }
-declare function EditInPlaceMoneyField<IP, MP>({ InputProps, currencySymbol, dispatch, className, ...restProps }: Props<IP, MP>): React.JSX.Element;
+declare function EditInPlaceMoneyField<IP, MP>({ InputProps, currencySymbol, className, ...restProps }: Props<IP, MP>): React.JSX.Element;
 export default EditInPlaceMoneyField;

package/dist/formFields/EditInPlaceMoneyField.js

@@ -31,7 +31,8 @@ const NumberFormatCustom = React.forwardRef((props, ref) => {
 });
 const preformatDisplayValue = value => value || value === 0 ? formatCurrency(value, '') : value;
 function EditInPlaceMoneyField(_a) {
-    var { InputProps, currencySymbol, dispatch, className } = _a, restProps = __rest(_a, ["InputProps", "currencySymbol", "dispatch", "className"]);
-    return (React.createElement(EditInPlaceField, Object.assign({}, restProps, { preformatDisplayValue: preformatDisplayValue, InputProps: Object.assign(Object.assign({}, InputProps), { startAdornment: React.createElement(InputAdornment, { position: "start" }, currencySymbol), inputComponent: NumberFormatCustom }), className: clsx('money', className) })));
+    var _b;
+    var { InputProps, currencySymbol, className } = _a, restProps = __rest(_a, ["InputProps", "currencySymbol", "className"]);
+    return (React.createElement(EditInPlaceField, Object.assign({}, restProps, { preformatDisplayValue: preformatDisplayValue, InputProps: Object.assign(Object.assign({}, InputProps), { startAdornment: React.createElement(InputAdornment, { position: "start", className: (_b = restProps.fieldClasses) === null || _b === void 0 ? void 0 : _b.text }, currencySymbol), inputComponent: NumberFormatCustom }), className: clsx('money', className) })));
 }
 export default EditInPlaceMoneyField;

package/dist/formFields/EditInPlacePhoneField.js

@@ -62,8 +62,9 @@ const NumberFormatCustom = React.forwardRef((props, ref) => {
     return (React.createElement(NumberFormat, Object.assign({}, other, { getInputRef: getInputRef, onKeyPress: onKeyPress, prefix: prefix, onValueChange: onValueChange, format: format, type: "text" })));
 });
 function EditInPlacePhoneField(_a) {
+    var _b;
     var { InputProps, className } = _a, restProps = __rest(_a, ["InputProps", "className"]);
-    return (React.createElement(EditInPlaceField, Object.assign({}, restProps, { InputProps: Object.assign(Object.assign({}, InputProps), { startAdornment: React.createElement(InputAdornment, { position: "start" },
+    return (React.createElement(EditInPlaceField, Object.assign({}, restProps, { InputProps: Object.assign(Object.assign({}, InputProps), { startAdornment: React.createElement(InputAdornment, { position: "start", className: (_b = restProps.fieldClasses) === null || _b === void 0 ? void 0 : _b.text },
                 React.createElement(PhoneIcon, null)), inputComponent: NumberFormatCustom }), className: className })));
 }
 export default EditInPlacePhoneField;

package/dist/timetable/miniCalendar/CalendarDay.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { DateArgFunction } from '../../model';
 interface Props {
     day: number;
     isToday?: boolean;
@@ -8,8 +9,15 @@ interface Props {
     selectedMonthSessionDays: number[];
     disabled: boolean;
     theme?: any;
-    targetDay?: any;
-    setTargetDay?: any;
+    targetDay?: Date;
+    setTargetDay?: DateArgFunction;
+    customClasses?: {
+        root?: string;
+        hasSession?: string;
+        today?: string;
+        selected?: string;
+        disabled?: string;
+    };
 }
 declare const CalendarDay: React.MemoExoticComponent<(props: Props) => React.JSX.Element>;
 export default CalendarDay;

package/dist/timetable/miniCalendar/CalendarDay.js

@@ -5,13 +5,12 @@
  *
  *  This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details.
  */
-import React, { useMemo } from 'react';
+import React, { useMemo, memo } from 'react';
 import { Button } from '@mui/material';
 import { isSameDay } from 'date-fns';
 import clsx from 'clsx';
 import { alpha } from '@mui/material/styles';
 import { makeAppStyles } from '../../styles';
-import { useAppTheme } from '../../themes';
 const useStyles = makeAppStyles(theme => ({
     root: {
         padding: 0,
@@ -39,26 +38,34 @@ const useStyles = makeAppStyles(theme => ({
             border: `2px solid ${theme.palette.text.primary}`
         }
     },
-    same: {}
+    same: {},
+    hasSession: ({ dayIndexValue }) => {
+        const backgroundColor = alpha(theme.palette.primary.main, dayIndexValue);
+        return {
+            backgroundColor,
+            color: theme.palette.getContrastText(backgroundColor),
+            '&:hover': {
+                backgroundColor,
+                color: theme.palette.getContrastText(backgroundColor)
+            }
+        };
+    },
+    isToday: {
+        fontWeight: 900
+    }
 }));
-const CalendarDay = React.memo((props) => {
-    const { day, status, date, disabled, targetDay, setTargetDay, selectedMonthSessionDays } = props;
-    const classes = useStyles();
-    const theme = useAppTheme();
+const CalendarDay = memo((props) => {
+    const { customClasses = {}, day, status, date, disabled, targetDay, setTargetDay, selectedMonthSessionDays } = props;
     const isSame = isSameDay(targetDay, date);
     const isToday = isSameDay(new Date(), date);
-    const style = useMemo(() => {
-        let result;
-        const dayIndexValue = selectedMonthSessionDays[day - 1];
-        if (selectedMonthSessionDays.length && status === 'current' && dayIndexValue !== 0) {
-            const backgroundColor = alpha(theme.palette.primary.main, dayIndexValue);
-            result = Object.assign(Object.assign({}, result || {}), { backgroundColor, color: theme.palette.getContrastText(backgroundColor) });
-        }
-        if (isToday) {
-            result = Object.assign(Object.assign({}, result || {}), { fontWeight: '900' });
-        }
-        return result;
-    }, [isToday, status, selectedMonthSessionDays, day, theme]);
-    return (React.createElement(Button, { className: clsx(classes.root, isSame && classes.same), onClick: () => setTargetDay(date), disabled: disabled, style: style }, day));
+    const dayIndexValue = selectedMonthSessionDays[day - 1];
+    const hasSession = useMemo(() => selectedMonthSessionDays.length && status === 'current' && dayIndexValue !== 0, [selectedMonthSessionDays, dayIndexValue, status]);
+    const classes = useStyles({ dayIndexValue, hasSession, isToday });
+    return (React.createElement(Button, { className: clsx(classes.root, customClasses.root, isSame && clsx(classes.same, customClasses.selected), {
+            [customClasses.hasSession || classes.hasSession]: hasSession,
+            [customClasses.today || classes.isToday]: isToday
+        }), onClick: () => setTargetDay(date), classes: {
+            disabled: customClasses.disabled
+        }, disabled: disabled }, day));
 });
 export default CalendarDay;

package/dist/timetable/miniCalendar/CalendarHeader.d.ts

@@ -1,10 +1,16 @@
-import React from "react";
+import React from 'react';
 interface Props {
     month: string;
     year: number;
     previousMonth: () => void;
     nextMonth: () => void;
     classes?: any;
+    customClasses?: {
+        root?: string;
+        leftButton?: string;
+        rightbutton?: string;
+        selectedMonth?: string;
+    };
 }
-declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles").StyledComponentProps<never>>;
-export default _default;
+declare const CalendarHeader: ({ month, year, previousMonth, nextMonth, customClasses }: Props) => React.JSX.Element;
+export default CalendarHeader;

package/dist/timetable/miniCalendar/CalendarHeader.js

@@ -1,22 +1,26 @@
-import React from "react";
-import { IconButton, Typography } from "@mui/material";
-import { createStyles, withStyles } from "@mui/styles";
-import { KeyboardArrowLeft, KeyboardArrowRight } from "@mui/icons-material";
-const styles = createStyles(theme => ({
+import React from 'react';
+import { IconButton, Typography } from '@mui/material';
+import { KeyboardArrowLeft, KeyboardArrowRight } from '@mui/icons-material';
+import clsx from 'clsx';
+import { makeAppStyles } from '../../styles';
+const useStyles = makeAppStyles(theme => ({
     root: {
-        display: "flex",
-        justifyContent: "space-between",
-        alignItems: "center",
+        display: 'flex',
+        justifyContent: 'space-between',
+        alignItems: 'center',
         padding: theme.spacing(0, 1)
     }
 }));
-const CalendarHeader = ({ classes, month, year, previousMonth, nextMonth }) => (React.createElement("div", { className: classes.root },
-    React.createElement(IconButton, { onClick: previousMonth },
-        React.createElement(KeyboardArrowLeft, null)),
-    React.createElement(Typography, { align: "center" },
-        month,
-        " ",
-        year),
-    React.createElement(IconButton, { onClick: nextMonth },
-        React.createElement(KeyboardArrowRight, null))));
-export default withStyles(styles)(CalendarHeader);
+const CalendarHeader = ({ month, year, previousMonth, nextMonth, customClasses = {} }) => {
+    const classes = useStyles();
+    return React.createElement("div", { className: clsx(classes.root, customClasses.root) },
+        React.createElement(IconButton, { onClick: previousMonth, className: customClasses.leftButton },
+            React.createElement(KeyboardArrowLeft, null)),
+        React.createElement(Typography, { align: "center", className: customClasses.selectedMonth },
+            month,
+            " ",
+            year),
+        React.createElement(IconButton, { onClick: nextMonth, className: customClasses.rightbutton },
+            React.createElement(KeyboardArrowRight, null)));
+};
+export default CalendarHeader;

package/dist/timetable/miniCalendar/CalendarWeekPanel.d.ts

@@ -1,8 +1,9 @@
-import React from "react";
+import React from 'react';
 interface Props {
-    classes?: any;
-    switchWeekDays: (dayId: number) => void;
-    selectedWeekDays: boolean[];
+    switchWeekDays?: (dayId: number) => void;
+    selectedWeekDays?: boolean[];
+    className?: string;
+    dayClass?: string;
 }
-declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles").StyledComponentProps<"root">>;
-export default _default;
+declare const CalendarWeekPanel: ({ className, dayClass, switchWeekDays, selectedWeekDays }: Props) => React.JSX.Element;
+export default CalendarWeekPanel;

package/dist/timetable/miniCalendar/CalendarWeekPanel.js

@@ -1,18 +1,20 @@
-import React from "react";
-import { createStyles, withStyles } from "@mui/styles";
-import WeekDay from "./WeekDay";
-const styles = theme => createStyles({
+import React from 'react';
+import WeekDay from './WeekDay';
+import clsx from 'clsx';
+import { makeAppStyles } from '../../styles';
+const useStyles = makeAppStyles(theme => ({
     root: {
-        display: "grid",
+        display: 'grid',
         gridTemplateColumns: `repeat(7, ${theme.spacing(4)})`,
-        gridColumnGap: 1,
+        gap: 1,
         padding: theme.spacing(0, 1),
         marginBottom: theme.spacing(1),
-        justifyContent: "center"
+        justifyContent: 'center'
     }
-});
-const week = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
-const CalendarWeekPanel = ({ classes, switchWeekDays, selectedWeekDays }) => {
-    return (React.createElement("div", { className: classes.root }, week.map((el, id) => (React.createElement(WeekDay, { key: id, id: id, name: el, selected: selectedWeekDays[id], click: switchWeekDays })))));
+}));
+const week = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];
+const CalendarWeekPanel = ({ className, dayClass, switchWeekDays, selectedWeekDays = [] }) => {
+    const classes = useStyles();
+    return (React.createElement("div", { className: clsx(classes.root, className) }, week.map((el, id) => (React.createElement(WeekDay, { key: id, id: id, name: el, selected: selectedWeekDays[id], click: switchWeekDays, className: dayClass })))));
 };
-export default withStyles(styles)(CalendarWeekPanel);
+export default CalendarWeekPanel;

package/dist/timetable/miniCalendar/WeekDay.d.ts

@@ -1,10 +1,10 @@
-import React from "react";
+import React from 'react';
 interface Props {
-    name: string;
-    selected: boolean;
-    click: (id: any) => void;
     id: number;
-    classes?: any;
+    name: string;
+    selected?: boolean;
+    click?: (id: any) => void;
+    className?: string;
 }
-declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles").StyledComponentProps<"weekButton" | "selectedWeekDay" | "weekDayText">>;
-export default _default;
+declare const WeekDay: ({ name, selected, click, id, className }: Props) => React.JSX.Element;
+export default WeekDay;

package/dist/timetable/miniCalendar/WeekDay.js

@@ -1,25 +1,30 @@
-import React from "react";
-import { Button, Typography } from "@mui/material";
-import { createStyles, withStyles } from "@mui/styles";
-import clsx from "clsx";
-const styles = theme => createStyles({
+import React from 'react';
+import { Button, Typography } from '@mui/material';
+import clsx from 'clsx';
+import { makeAppStyles } from '../../styles';
+const useStyles = makeAppStyles(theme => ({
     weekButton: {
         padding: theme.spacing(0.5),
-        minWidth: "initial",
-        textTransform: "capitalize"
+        minWidth: 'initial',
+        textTransform: 'capitalize'
     },
     selectedWeekDay: {
-        boxShadow: "none",
-        "&:active": {
-            boxShadow: "none"
+        boxShadow: 'none',
+        '&:active': {
+            boxShadow: 'none'
         }
     },
     weekDayText: {
         color: theme.palette.common.white
     }
-});
-const WeekDay = ({ classes, name, selected, click, id }) => (React.createElement(Button, { className: clsx(classes.weekButton, {
-        [classes.selectedWeekDay]: selected
-    }), onClick: () => click(id), variant: selected ? "contained" : "text", color: selected ? "primary" : "inherit" },
-    React.createElement(Typography, { variant: "caption", align: "center", className: selected ? classes.weekDayText : "" }, name)));
-export default withStyles(styles)(WeekDay);
+}));
+const DivRoot = props => React.createElement("div", { className: props.className });
+const WeekDay = ({ name, selected, click, id, className }) => {
+    const classes = useStyles();
+    const Root = click ? Button : DivRoot;
+    return React.createElement(Root, { className: clsx(classes.weekButton, {
+            [classes.selectedWeekDay]: selected
+        }, className), onClick: () => click(id), variant: selected ? 'contained' : 'text', color: selected ? 'primary' : 'inherit', disableElevation: true },
+        React.createElement(Typography, { variant: "caption", align: "center", className: selected ? classes.weekDayText : '' }, name));
+};
+export default WeekDay;

package/dist/utils/dates/timetable.d.ts

@@ -1,4 +1,4 @@
-export declare const getCalendarDays: (today: any) => {
+export declare const getCalendarDays: (date: Date) => {
     day: number;
     date: Date;
     status: any;

package/dist/utils/dates/timetable.js

@@ -13,12 +13,12 @@ const generateOneMonth = (today, status) => Array(getDaysInMonth(today))
     date: new Date(today.getFullYear(), today.getMonth(), id + 1),
     status
 }));
-export const getCalendarDays = today => {
-    const currentMonth = generateOneMonth(today, 'current');
-    const previousMonth = generateOneMonth(new Date(today.getFullYear(), today.getMonth() - 1), 'previous');
-    const nextMonth = generateOneMonth(new Date(today.getFullYear(), today.getMonth() + 1), 'next');
-    const firstDayIndex = getDay(new Date(today.getFullYear(), today.getMonth(), 1));
-    const lastDayIndex = getDay(lastDayOfMonth(today));
+export const getCalendarDays = (date) => {
+    const currentMonth = generateOneMonth(date, 'current');
+    const previousMonth = generateOneMonth(new Date(date.getFullYear(), date.getMonth() - 1), 'previous');
+    const nextMonth = generateOneMonth(new Date(date.getFullYear(), date.getMonth() + 1), 'next');
+    const firstDayIndex = getDay(new Date(date.getFullYear(), date.getMonth(), 1));
+    const lastDayIndex = getDay(lastDayOfMonth(date));
     const binaryCalendarState = (firstDayIndex, lastDayIndex) => parseInt(String(+!!firstDayIndex) + +(lastDayIndex < 6), 2);
     switch (binaryCalendarState(firstDayIndex, lastDayIndex)) {
         case 0:

package/dist/utils/index.d.ts

@@ -7,3 +7,4 @@ export * from './dates';
 export * from './fields';
 export * from './hooks';
 export * from './events';
+export * from './validation';

package/dist/utils/index.js

@@ -14,3 +14,4 @@ export * from './dates';
 export * from './fields';
 export * from './hooks';
 export * from './events';
+export * from './validation';

package/dist/utils/validation/datesValidation.d.ts

@@ -0,0 +1,2 @@
+export declare const validateMinMaxDate: (value: string, minDate: string, maxDate: string, minErrMsg?: string, maxErrMsg?: string) => any;
+export declare const validateDate: (value: any) => boolean;

package/dist/utils/validation/datesValidation.js

@@ -0,0 +1,23 @@
+/*
+ * Copyright ish group pty ltd 2023.
+ *
+ * This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License version 3 as published by the Free Software Foundation.
+ *
+ *  This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details.
+ */
+export const validateMinMaxDate = (value, minDate, maxDate, minErrMsg = 'Date is beyond minimum limit', maxErrMsg = 'Date is beyond maximum limit') => {
+    let result;
+    if (value) {
+        const valueTime = new Date(value).getTime();
+        if (minDate) {
+            const minDateTime = new Date(minDate).getTime();
+            result = valueTime >= minDateTime ? undefined : minErrMsg;
+        }
+        if (maxDate) {
+            const maxDateTime = new Date(maxDate).getTime();
+            result = valueTime <= maxDateTime ? undefined : maxErrMsg;
+        }
+    }
+    return result;
+};
+export const validateDate = value => !Number.isNaN(new Date(value).getTime());

package/dist/utils/validation/index.d.ts

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

package/dist/utils/validation/index.js

@@ -0,0 +1,8 @@
+/*
+ * Copyright ish group pty ltd 2023.
+ *
+ * This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License version 3 as published by the Free Software Foundation.
+ *
+ *  This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details.
+ */
+export * from './datesValidation';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ish-ui",
-  "version": "1.0.30",
+  "version": "1.0.32",
   "description": "UI elements for onCourse and other ish apps",
   "main": "main.ts",
   "devDependencies": {