@evoke-platform/ui-components 1.0.0-dev.199 → 1.0.0-dev.201

package/dist/published/components/core/DateTimePicker/DateTimePicker.js

@@ -14,13 +14,13 @@ import UIThemeProvider from '../../../theme';
 import { DateTimePicker as MUIDateTimePicker, } from '@mui/x-date-pickers';
 import TextField from '../TextField';
 import { InvalidDate } from '../../../util';
-import { LocalDateTime } from '@js-joda/core';
+import { LocalDateTime, nativeJs } from '@js-joda/core';
 const DateTimePicker = (props) => {
     var _a;
     const { value: inputValue, onChange: handleChange } = props, rest = __rest(props, ["value", "onChange"]);
     let value = null;
     try {
-        value = typeof inputValue === 'string' ? LocalDateTime.parse(inputValue) : inputValue;
+        value = typeof inputValue === 'string' ? LocalDateTime.from(nativeJs(new Date(inputValue))) : inputValue;
     }
     catch (err) {
         // If we fail to parse the input string, log the error and continue as if no value was set.

package/dist/published/components/custom/FormField/DateTimePickerSelect/DateTimePickerSelect.js

@@ -3,6 +3,8 @@ import { DateTimePicker, LocalizationProvider, TextField } from '../../../core';
 import InputFieldComponent from '../InputFieldComponent/InputFieldComponent';
 import { LocalDate, LocalDateTime, LocalTime, nativeJs } from '@js-joda/core';
 import { InvalidDate } from '../../../../util';
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const { format } = require('small-date');
 function asCalendarDate(value) {
     if (!value) {
         return null;
@@ -19,6 +21,11 @@ function asCalendarDate(value) {
     }
     return value.toString();
 }
+const formatDateTime = (date) => {
+    if (date) {
+        return format(new Date(date), 'MM-dd-yyyy hh:mm a');
+    }
+};
 const DateTimePickerSelect = (props) => {
     const { id, property, defaultValue, error, errorMessage, readOnly, required, size, onBlur, additionalProps } = props;
     const [value, setValue] = useState(asCalendarDate(defaultValue));
@@ -35,7 +42,7 @@ const DateTimePickerSelect = (props) => {
         setValue(date);
         props.onChange(property.id, date, property);
     };
-    return readOnly ? (React.createElement(InputFieldComponent, Object.assign({}, Object.assign(Object.assign({}, props), { defaultValue: value })))) : (React.createElement(LocalizationProvider, null,
+    return readOnly ? (React.createElement(InputFieldComponent, Object.assign({}, Object.assign(Object.assign({}, props), { defaultValue: formatDateTime(value) })))) : (React.createElement(LocalizationProvider, null,
         React.createElement(DateTimePicker, { value: value, onChange: handleChange, renderInput: (params) => (React.createElement(TextField, Object.assign({}, params, { id: id, error: error, errorMessage: errorMessage, onBlur: onBlur, fullWidth: true, required: required, sx: { background: 'white', borderRadius: '8px' }, size: size !== null && size !== void 0 ? size : 'medium' }, (additionalProps !== null && additionalProps !== void 0 ? additionalProps : {})))) })));
 };
 export default DateTimePickerSelect;

package/dist/published/components/custom/MultiSelect/MultiSelect.js

@@ -156,7 +156,9 @@ export default function MultiSelect(props) {
                         padding: '4px',
                         borderRadius: '8px',
                     }, size: 'small', variant: 'outlined', onClick: (e) => handleDeletedOptions(e) }, "Clear all") },
-                React.createElement(AlertTitle, { sx: { fontWeight: 700, lineHeight: '22px', fontSize: '13px', color: '#7A4F01' } }, `${deletedOptions.length} fields has been deleted`),
+                React.createElement(AlertTitle, { sx: { fontWeight: 700, lineHeight: '22px', fontSize: '13px', color: '#7A4F01' } }, deletedOptions.length > 1
+                    ? `${deletedOptions.length} fields have been deleted`
+                    : `${deletedOptions.length} field has been deleted`),
                 React.createElement(Typography, { sx: { fontWeight: 400, lineHeight: '18px', fontSize: '12px', color: '#7A4F01' } }, "Any cleared deleted fields will be removed after saving."))),
             options.length > 4 && (React.createElement(Grid, { item: true, p: 1 },
                 React.createElement(TextField, { placeholder: "Search Properties", size: "small", InputProps: {
@@ -164,9 +166,9 @@ export default function MultiSelect(props) {
                             React.createElement(Search, null))),
                     }, fullWidth: true, sx: styles.textField, value: searchText, onChange: filterItems }))),
             (optionsArray === null || optionsArray === void 0 ? void 0 : optionsArray.length) > 1 && (React.createElement(Grid, { container: true },
-                React.createElement(Grid, { item: true, xs: 3 },
+                React.createElement(Grid, { item: true, xs: 4, md: 3 },
                     React.createElement(Button, { sx: Object.assign(Object.assign({}, styles.button), { fontWeight: 'bold' }), variant: "text", onClick: (e) => handleSelectAllChange(e), disabled: optionsArray.every((option) => option.disabled === true || selectAll) }, "Select All")),
-                React.createElement(Grid, { item: true, xs: 9 },
+                React.createElement(Grid, { item: true, xs: 8, md: 9 },
                     React.createElement(Button, { sx: Object.assign(Object.assign({}, styles.button), { fontWeight: 'bold' }), variant: "text", onClick: (e) => handleClearAll(e), disabled: optionsArray.every((option) => option.disabled === true) ||
                             optionsArray.every((option) => option.value === false) }, "Clear All")))),
             React.createElement(Box, { sx: Object.assign(Object.assign({}, styles.list), { maxHeight: maxHeight !== null && maxHeight !== void 0 ? maxHeight : 'auto' }) }, isSortable ? (React.createElement(DndContext, { sensors: sensors, collisionDetection: closestCenter, onDragEnd: handleDragEnd, modifiers: [restrictToVerticalAxis, restrictToWindowEdges] },

package/dist/published/util/date.d.ts

@@ -20,4 +20,4 @@ export declare class InvalidDate implements Temporal {
 }
 export declare type CalendarDate = LocalDate | InvalidDate | LocalDateTime;
 export declare function isValidDate(date: CalendarDate): date is LocalDate | LocalDateTime;
-export { nativeJs, LocalDate, LocalDateTime, Instant, ZoneOffset } from '@js-joda/core';
+export { nativeJs, LocalDate, LocalDateTime } from '@js-joda/core';

package/dist/published/util/date.js

@@ -44,4 +44,4 @@ export function isValidDate(date) {
     return date.invalid !== true;
 }
 // Re-export type and utility function from Joda for convenience.
-export { nativeJs, LocalDate, LocalDateTime, Instant, ZoneOffset } from '@js-joda/core';
+export { nativeJs, LocalDate, LocalDateTime } from '@js-joda/core';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@evoke-platform/ui-components",
-    "version": "1.0.0-dev.199",
+    "version": "1.0.0-dev.201",
     "description": "",
     "main": "dist/published/index.js",
     "module": "dist/published/index.js",
@@ -105,7 +105,8 @@
         "react-dropzone": "^14.2.2",
         "react-input-mask": "^2.0.4",
         "react-number-format": "^4.9.3",
-        "react-querybuilder": "^6.0.2"
+        "react-querybuilder": "^6.0.2",
+        "small-date": "^2.0.0"
     },
     "lint-staged": {
         "*.{js,jsx,ts,tsx,json,css,md}": [