@evoke-platform/ui-components 1.1.0-testing.2 → 1.1.0-testing.4

package/dist/published/components/custom/CriteriaBuilder/CriteriaBuilder.d.ts

@@ -1,4 +1,4 @@
-import { ElementType } from 'react';
+/// <reference types="react" />
 import 'react-querybuilder/dist/query-builder.css';
 import { EvokeObject } from '../../../types';
 import { ObjectProperty, Operator, PresetValue, TreeViewObject } from './types';
@@ -10,10 +10,9 @@ export type CriteriaInputProps = {
     originalCriteria?: Record<string, unknown>;
     enablePresetValues?: boolean;
     presetValues?: PresetValue[];
-    dynamicContentInput?: {
-        component: ElementType;
-        previousSteps: unknown[];
-        trigger?: Record<string, unknown>;
+    customValueEditor?: {
+        component: (props: ValueEditorProps) => JSX.Element;
+        props?: Record<string, unknown>;
     };
     operators?: Operator[];
     disabledCriteria?: {

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

@@ -212,7 +212,10 @@ const customSelector = (props) => {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         onChange: (event, newValue) => {
             handleOnChange(newValue?.value.name);
-        }, renderInput: (params) => React.createElement(TextField, { ...params, placeholder: placeholder, size: "small" }), sx: { width: width, background: '#fff' }, disableClearable: true, readOnly: readOnly }))));
+        }, renderInput: (params) => (React.createElement(TextField, { ...params, placeholder: placeholder, size: "small", inputProps: {
+                ...params.inputProps,
+                'aria-label': placeholder,
+            } })), sx: { width: width, background: '#fff' }, disableClearable: true, readOnly: readOnly }))));
 };
 const customCombinator = (props) => {
     const { value, handleOnChange, context, level, path } = props;
@@ -277,7 +280,7 @@ export const valueEditor = (props) => {
     return ValueEditor(props);
 };
 const CriteriaBuilder = (props) => {
-    const { properties, criteria, setCriteria, originalCriteria, enablePresetValues, presetValues, operators, dynamicContentInput, disabled, disabledCriteria, hideBorder, presetGroupLabel, treeViewOpts, disableRegexEscapeChars, } = props;
+    const { properties, criteria, setCriteria, originalCriteria, enablePresetValues, presetValues, operators, disabled, disabledCriteria, hideBorder, presetGroupLabel, customValueEditor, treeViewOpts, disableRegexEscapeChars, } = props;
     const [query, setQuery] = useState(undefined);
     const [propertyTreeMap, setPropertyTreeMap] = useState();
     useEffect(() => {
@@ -294,7 +297,7 @@ const CriteriaBuilder = (props) => {
             setQuery({ combinator: 'and', rules: [] });
         }
     }, [originalCriteria]);
-    function processRules(rules, isSavedValue) {
+    const processRules = (rules, isSavedValue) => {
         return rules.map((rule) => {
             if ('rules' in rule) {
                 return {
@@ -320,7 +323,7 @@ const CriteriaBuilder = (props) => {
                 };
             }
         });
-    }
+    };
     // this retrieves the properties from a treeview for each property in the query
     // they are then used in the custom query builder components to determine the input type etc
     const updatePropertyTreeMap = (q) => {
@@ -386,16 +389,12 @@ const CriteriaBuilder = (props) => {
                 return defaultRuleProcessorMongoDB(newRule, options);
             },
         }));
-        //when q has no rules, it formats and parses to { $and: [{ $expr: true }] }
-        const allRulesDeleted = isEmpty(difference(newCriteria, { $and: [{ $expr: true }] }));
-        // since the Add Condition / Add Group buttons add rules with all the fields empty,
-        // we need to check if the first rule was added because q will still parse to { $and: [{ $expr: true }] }
-        const firstRuleAdded = isEmpty(criteria) && q.rules.length > 0;
-        if (allRulesDeleted && !firstRuleAdded) {
-            setCriteria(undefined);
+        if (!isEmpty(difference(newCriteria, { $and: [{ $expr: true }] }))) {
+            setCriteria(newCriteria);
         }
         else {
-            setCriteria(newCriteria);
+            if (q.rules.length === 0)
+                setCriteria(undefined);
         }
     };
     const fields = useMemo(() => {
@@ -498,9 +497,9 @@ const CriteriaBuilder = (props) => {
                         ruleGroup: CustomRuleGroup,
                         removeGroupAction: customDelete,
                         removeRuleAction: customDelete,
-                        valueEditor: valueEditor,
+                        valueEditor: customValueEditor ? customValueEditor.component : valueEditor,
                     }, context: {
-                        dynamicContentInput,
+                        ...(customValueEditor?.props ?? {}),
                         presetValues,
                         enablePresetValues,
                         presetGroupLabel,

package/dist/published/components/custom/Form/FormComponents/ObjectComponent/ObjectPropertyInput.js

@@ -78,7 +78,11 @@ export const ObjectPropertyInput = (props) => {
             updatedFilter = {};
         }
         updatedFilter.limit = 100;
-        updatedFilter.order = 'name ASC';
+        const { propertyId, direction } = layout?.sort ?? {
+            propertyId: 'name',
+            direction: 'asc',
+        };
+        updatedFilter.order = `${propertyId} ${direction}`;
         const where = name
             ? transformToWhere({
                 name: {
@@ -103,7 +107,7 @@ export const ObjectPropertyInput = (props) => {
                 setLoadingOptions(false);
             }
         });
-    }, [relatedObject, setLoadingOptions, setOptions, property, filter]);
+    }, [relatedObject, setLoadingOptions, setOptions, property, filter, layout]);
     useEffect(() => {
         if (displayOption === 'dropdown') {
             getDropdownOptions();
@@ -281,7 +285,7 @@ export const ObjectPropertyInput = (props) => {
                                 caretColor: 'white',
                             }
                             : {}),
-                    } })), readOnly: !loadingOptions && !canUpdateProperty, error: error }))) : (React.createElement(Box, { sx: {
+                    } })), readOnly: !loadingOptions && !canUpdateProperty, error: error, sortBy: "NONE" }))) : (React.createElement(Box, { sx: {
                 padding: (instance?.[property.id]?.name ?? selectedInstance?.name)
                     ? '16.5px 14px'
                     : '10.5px 0',

package/dist/published/components/custom/Form/FormComponents/RepeatableFieldComponent/ManyToMany/DropdownRepeatableField.js

@@ -78,9 +78,13 @@ export const DropdownRepeatableField = (props) => {
             setLoading(true);
             const endObjectProperty = middleObject.properties?.find((currProperty) => property.manyToManyPropertyId === currProperty.id);
             if (endObjectProperty?.objectId) {
+                const { propertyId, direction } = layout?.sort ?? {
+                    propertyId: 'name',
+                    direction: 'asc',
+                };
                 const filter = {
                     limit: 100,
-                    order: 'name ASC',
+                    order: `${propertyId} ${direction}`,
                 };
                 let searchCriteria = criteria && !isEmpty(criteria) ? transformToWhere(criteria) : {};
                 if (searchedName?.length) {
@@ -106,7 +110,7 @@ export const DropdownRepeatableField = (props) => {
                 });
             }
         }
-    }, [property.objectId, property.manyToManyPropertyId, apiServices, middleObject]);
+    }, [property.objectId, property.manyToManyPropertyId, apiServices, middleObject, layout]);
     const debouncedEndObjectSearch = useCallback(debounce(fetchEndObjectInstances, 500), [fetchEndObjectInstances]);
     useEffect(() => {
         debouncedEndObjectSearch(searchValue);

package/dist/published/components/custom/Form/FormComponents/RepeatableFieldComponent/ManyToMany/DropdownRepeatableFieldInput.js

@@ -86,6 +86,7 @@ export const DropdownRepeatableFieldInput = (props) => {
                         setSearchValue(event.target.value);
                     } })),
                 loading: loading,
+                sortBy: 'NONE',
             } }),
         React.createElement(Snackbar, { open: snackbarError.showAlert, handleClose: () => setSnackbarError({ isError: snackbarError.isError, showAlert: false }), message: snackbarError.message, error: snackbarError.isError })))) : (React.createElement(Typography, null, selectedOptions && selectedOptions.map((option) => option.label).join(', ')))));
 };

package/dist/published/components/custom/Form/utils.js

@@ -384,7 +384,7 @@ export function convertComponentsToForm(components) {
                                             ...(component.orderBy ? { sortBy: component.orderBy } : {}),
                                         }
                                         : isArray(component.initialValue)
-                                            ? component.initialValue.map((c) => c.value)
+                                            ? component.initialValue.map((c) => typeof c === 'string' ? c : c.value)
                                             : component.initialValue?.value
                                                 ? component.initialValue?.value
                                                 : component.initialValue,

package/dist/published/index.d.ts

@@ -1,11 +1,13 @@
-export { ClickAwayListener, Toolbar, createTheme, styled } from '@mui/material';
+export { ClickAwayListener, createTheme, darken, lighten, styled, Toolbar } from '@mui/material';
 export { CalendarPicker, DateTimePicker, MonthPicker, PickersDay, StaticDateTimePicker, StaticTimePicker, TimePicker, YearPicker, } from '@mui/x-date-pickers';
+export * from './colors';
 export * from './components/core';
-export { BuilderGrid, CriteriaBuilder, DataGrid, ErrorComponent, Form, FormField, MenuBar, MultiSelect, RepeatableField, UserAvatar, HistoryLog, RichTextViewer, } from './components/custom';
+export { BuilderGrid, CriteriaBuilder, DataGrid, ErrorComponent, Form, FormField, HistoryLog, MenuBar, MultiSelect, RepeatableField, RichTextViewer, UserAvatar, } from './components/custom';
+export { NumericFormat } from './components/custom/FormField/InputFieldComponent';
 export { Box, Container, Grid, Stack } from './components/layout';
 export * as EVOKE_TYPES from './types';
 export * from './util';
-export type { ButtonBaseActions, ButtonBaseClasses, FormControlProps, FormHelperTextProps, GridSize, MenuItemClasses, Theme, } from '@mui/material';
+export type { AutocompleteRenderGroupParams, ButtonBaseActions, ButtonBaseClasses, FormControlProps, FormHelperTextProps, GridSize, MenuItemClasses, TextFieldProps, Theme, } from '@mui/material';
 export type { TouchRippleActions, TouchRippleProps } from '@mui/material/ButtonBase/TouchRipple';
 export type { CommonProps } from '@mui/material/OverridableComponent';
 export type { SxProps } from '@mui/system';

package/dist/published/index.js

@@ -1,7 +1,9 @@
-export { ClickAwayListener, Toolbar, createTheme, styled } from '@mui/material';
+export { ClickAwayListener, createTheme, darken, lighten, styled, Toolbar } from '@mui/material';
 export { CalendarPicker, DateTimePicker, MonthPicker, PickersDay, StaticDateTimePicker, StaticTimePicker, TimePicker, YearPicker, } from '@mui/x-date-pickers';
+export * from './colors';
 export * from './components/core';
-export { BuilderGrid, CriteriaBuilder, DataGrid, ErrorComponent, Form, FormField, MenuBar, MultiSelect, RepeatableField, UserAvatar, HistoryLog, RichTextViewer, } from './components/custom';
+export { BuilderGrid, CriteriaBuilder, DataGrid, ErrorComponent, Form, FormField, HistoryLog, MenuBar, MultiSelect, RepeatableField, RichTextViewer, UserAvatar, } from './components/custom';
+export { NumericFormat } from './components/custom/FormField/InputFieldComponent';
 export { Box, Container, Grid, Stack } from './components/layout';
 export * as EVOKE_TYPES from './types';
 export * from './util';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@evoke-platform/ui-components",
-    "version": "1.1.0-testing.2",
+    "version": "1.1.0-testing.4",
     "description": "",
     "main": "dist/published/index.js",
     "module": "dist/published/index.js",
@@ -94,7 +94,7 @@
         "@dnd-kit/sortable": "^7.0.1",
         "@emotion/react": "^11.13.5",
         "@emotion/styled": "^11.8.1",
-        "@evoke-platform/context": "^1.0.0-dev.118",
+        "@evoke-platform/context": "^1.0.0-dev.126",
         "@formio/react": "^5.2.4-rc.1",
         "@js-joda/core": "^3.2.0",
         "@js-joda/locale_en-us": "^3.2.2",
@@ -135,12 +135,6 @@
             "npm run lint:fix"
         ]
     },
-    "husky": {
-        "hooks": {
-            "pre-commit": "npx lint-staged",
-            "commit-msg": "npx commitlint --edit $1"
-        }
-    },
     "jest": {
         "verbose": true,
         "testEnvironment": "jsdom",