@evoke-platform/ui-components 1.8.0-testing.9 → 1.8.0

package/dist/published/components/custom/FormV2/tests/test-data.js

@@ -0,0 +1,394 @@
+//Forms
+export const createSpecialtyForm = {
+    id: 'specialtyForm',
+    name: 'Specialty Form',
+    objectId: 'specialty',
+    actionId: '_create',
+    entries: [
+        {
+            parameterId: 'name',
+            type: 'input',
+            display: {
+                label: 'Name',
+            },
+        },
+        {
+            parameterId: 'specialtyType',
+            type: 'input',
+            display: {
+                label: 'Specialty Type',
+                relatedObjectDisplay: 'dropdown',
+            },
+        },
+        {
+            parameterId: 'license',
+            type: 'input',
+            display: {
+                label: 'License',
+                relatedObjectDisplay: 'dropdown',
+            },
+        },
+    ],
+};
+export const simpleConditionDisplayTestSpecialtyForm = {
+    id: 'specialtyForm',
+    name: 'Specialty Form',
+    objectId: 'specialty',
+    actionId: 'simpleConditionDisplayTest',
+    entries: [
+        {
+            parameterId: 'specialtyType',
+            type: 'input',
+            display: {
+                label: 'Specialty Type',
+                relatedObjectDisplay: 'dropdown',
+                visibility: {
+                    operator: 'all',
+                    conditions: [
+                        {
+                            property: 'name',
+                            operator: 'eq',
+                            value: 'Test Specialty Object Instance',
+                            isInstanceProperty: true,
+                        },
+                    ],
+                },
+            },
+        },
+        {
+            parameterId: 'license',
+            type: 'input',
+            display: {
+                label: 'License',
+                relatedObjectDisplay: 'dropdown',
+            },
+        },
+    ],
+};
+export const jsonLogicDisplayTestSpecialtyForm = {
+    id: 'specialtyForm',
+    name: 'Specialty Form',
+    objectId: 'specialty',
+    actionId: 'jsonLogicDisplayTest',
+    entries: [
+        {
+            parameterId: 'specialtyType',
+            type: 'input',
+            display: {
+                label: 'Specialty Type',
+                relatedObjectDisplay: 'dropdown',
+                visibility: {
+                    '===': [
+                        {
+                            var: 'instance.name',
+                        },
+                        'Test Specialty Object Instance',
+                    ],
+                },
+            },
+        },
+        {
+            parameterId: 'license',
+            type: 'input',
+            display: {
+                label: 'License',
+                relatedObjectDisplay: 'dropdown',
+            },
+        },
+    ],
+};
+// Objects
+export const licenseObject = {
+    id: 'license',
+    name: 'License',
+    properties: [
+        {
+            id: 'name',
+            name: 'License Number',
+            type: 'string',
+        },
+        {
+            id: 'status',
+            name: 'Status',
+            type: 'string',
+            enum: ['Active', 'Inactive'],
+        },
+        {
+            id: 'licenseType',
+            name: 'License Type',
+            type: 'object',
+            objectId: 'licenseType',
+        },
+    ],
+    actions: [
+        {
+            id: '_update',
+            name: 'Update',
+            type: 'update',
+            outputEvent: 'License Updated',
+        },
+        {
+            id: '_delete',
+            name: 'Delete',
+            type: 'delete',
+            outputEvent: 'License Deleted',
+        },
+        {
+            id: '_create',
+            name: 'Create',
+            type: 'create',
+            outputEvent: 'License Created',
+        },
+    ],
+};
+export const licenseTypeObject = {
+    id: 'licenseType',
+    name: 'License Type',
+    properties: [
+        {
+            id: 'name',
+            name: 'Name',
+            type: 'string',
+        },
+        {
+            id: 'licenseNumberPrefix',
+            name: 'License Number Prefix',
+            type: 'string',
+        },
+    ],
+    actions: [
+        {
+            id: '_update',
+            name: 'Update',
+            type: 'update',
+            outputEvent: 'License Type Updated',
+        },
+        {
+            id: '_delete',
+            name: 'Delete',
+            type: 'delete',
+            outputEvent: 'License Type Deleted',
+        },
+        {
+            id: '_create',
+            name: 'Create',
+            type: 'create',
+            outputEvent: 'License Type Created',
+        },
+    ],
+};
+export const specialtyObject = {
+    id: 'specialty',
+    name: 'Specialty',
+    properties: [
+        {
+            id: 'name',
+            name: 'Name',
+            type: 'string',
+        },
+        {
+            id: 'specialtyType',
+            name: 'Specialty Type',
+            type: 'object',
+            objectId: 'specialtyType',
+        },
+        {
+            id: 'license',
+            name: 'License',
+            type: 'object',
+            objectId: 'license',
+        },
+    ],
+    actions: [
+        {
+            id: '_update',
+            name: 'Update',
+            type: 'update',
+            outputEvent: 'Specialty Updated',
+        },
+        {
+            id: '_delete',
+            name: 'Delete',
+            type: 'delete',
+            outputEvent: 'Specialty Deleted',
+        },
+        {
+            id: '_create',
+            name: 'Create',
+            type: 'create',
+            outputEvent: 'Specialty Created',
+            parameters: [
+                {
+                    id: 'name',
+                    name: 'Name',
+                    type: 'string',
+                },
+                {
+                    id: 'specialtyType',
+                    name: 'Specialty Type',
+                    type: 'object',
+                    objectId: 'specialtyType',
+                    validation: {
+                        criteria: {
+                            $and: [{ 'licenseType.id': '{{{input.license.licenseType.id}}}' }],
+                        },
+                    },
+                },
+                {
+                    id: 'license',
+                    name: 'License',
+                    type: 'object',
+                    objectId: 'license',
+                },
+            ],
+        },
+        {
+            id: 'jsonLogicDisplayTest',
+            name: 'JsonLogic Display Test',
+            type: 'update',
+            outputEvent: 'Specialty Updated',
+            parameters: [
+                {
+                    id: 'specialtyType',
+                    name: 'Specialty Type',
+                    type: 'object',
+                    objectId: 'specialtyType',
+                },
+                {
+                    id: 'license',
+                    name: 'License',
+                    type: 'object',
+                    objectId: 'license',
+                },
+            ],
+        },
+        {
+            id: 'simpleConditionDisplayTest',
+            name: 'Simple Condition Display Test',
+            type: 'update',
+            outputEvent: 'Specialty Updated',
+            parameters: [
+                {
+                    id: 'specialtyType',
+                    name: 'Specialty Type',
+                    type: 'object',
+                    objectId: 'specialtyType',
+                },
+                {
+                    id: 'license',
+                    name: 'License',
+                    type: 'object',
+                    objectId: 'license',
+                },
+            ],
+        },
+    ],
+};
+export const specialtyTypeObject = {
+    id: 'specialtyType',
+    name: 'Specialty Type',
+    properties: [
+        {
+            id: 'name',
+            name: 'Name',
+            type: 'string',
+        },
+        {
+            id: 'licenseType',
+            name: 'License Type',
+            type: 'object',
+            objectId: 'licenseType',
+        },
+    ],
+    actions: [
+        {
+            id: '_update',
+            name: 'Update',
+            type: 'update',
+            outputEvent: 'Specialty Type Updated',
+        },
+        {
+            id: '_delete',
+            name: 'Delete',
+            type: 'delete',
+            outputEvent: 'Specialty Type Deleted',
+        },
+        {
+            id: '_create',
+            name: 'Create',
+            type: 'create',
+            outputEvent: 'Specialty Type Created',
+        },
+    ],
+};
+// Instances
+export const rnLicense = {
+    id: 'rnLicense',
+    objectId: 'license',
+    name: 'RN License',
+    licenseType: {
+        id: 'rnLicenseType',
+        name: 'RN License Type',
+    },
+    status: 'Active',
+};
+export const npLicense = {
+    id: 'npLicense',
+    objectId: 'license',
+    name: 'NP License',
+    licenseType: {
+        id: 'npLicenseType',
+        name: 'NP License Type',
+    },
+    status: 'Active',
+};
+export const rnLicenseType = {
+    id: 'rnLicenseType',
+    objectId: 'licenseType',
+    name: 'RN License Type',
+    licenseNumberPrefix: 'RN',
+};
+export const npLicesneType = {
+    id: 'npLicenseType',
+    objectId: 'licenseType',
+    name: 'NP License Type',
+    licenseNumberPrefix: 'NP',
+};
+export const rnSpecialtyType1 = {
+    id: 'specialtyType1',
+    objectId: 'specialtyType',
+    name: 'RN Specialty Type #1',
+    int: 1,
+    licenseType: {
+        id: 'rnLicenseType',
+        name: 'RN License Type',
+    },
+};
+export const rnSpecialtyType2 = {
+    id: 'specialtyType2',
+    objectId: 'specialtyType',
+    name: 'RN Specialty Type #2',
+    int: 1,
+    licenseType: {
+        id: 'rnLicenseType',
+        name: 'RN License Type',
+    },
+};
+export const npSpecialtyType1 = {
+    id: 'specialtyType3',
+    objectId: 'specialtyType',
+    name: 'NP Specialty Type #1',
+    licenseType: {
+        id: 'npLicenseType',
+        name: 'NP License Type',
+    },
+};
+export const npSpecialtyType2 = {
+    id: 'specialtyType4',
+    objectId: 'specialtyType',
+    name: 'NP Specialty Type #2',
+    licenseType: {
+        id: 'npLicenseType',
+        name: 'NP License Type',
+    },
+};

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

@@ -1,6 +1,7 @@
 export { BuilderGrid } from './BuilderGrid';
 export { CriteriaBuilder, getReadableQuery } from './CriteriaBuilder';
 export { DataGrid } from './DataGrid';
+export type { GridSortModel } from './DataGrid';
 export { ErrorComponent } from './ErrorComponent';
 export { Form } from './Form';
 export type { FormRef } from './Form';

package/dist/published/index.d.ts

@@ -3,7 +3,7 @@ export { CalendarPicker, DateTimePicker, MonthPicker, PickersDay, StaticDateTime
 export * from './colors';
 export * from './components/core';
 export { BuilderGrid, CriteriaBuilder, DataGrid, ErrorComponent, Form, FormContext, FormField, FormRenderer, FormRendererContainer, getReadableQuery, HistoryLog, MenuBar, MultiSelect, RecursiveEntryRenderer, RepeatableField, ResponsiveOverflow, RichTextViewer, UserAvatar, } from './components/custom';
-export type { FormRef } from './components/custom';
+export type { FormRef, GridSortModel } from './components/custom';
 export { NumericFormat } from './components/custom/FormField/InputFieldComponent';
 export { Box, Container, Grid, Stack } from './components/layout';
 export * from './theme';

package/dist/published/stories/FormRenderer.stories.d.ts

@@ -0,0 +1,7 @@
+import { ComponentMeta, ComponentStory } from '@storybook/react';
+import { FormRenderer } from '../components/custom';
+declare const _default: ComponentMeta<typeof FormRenderer>;
+export default _default;
+export declare const Editable: ComponentStory<typeof FormRenderer>;
+export declare const NoButtons: ComponentStory<typeof FormRenderer>;
+export declare const DocumentForm: ComponentStory<typeof FormRenderer>;

package/dist/published/stories/FormRenderer.stories.js

@@ -0,0 +1,65 @@
+import { Box } from '@mui/material';
+import { set } from 'lodash';
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import { FormRenderer } from '../components/custom';
+import { formatSubmission } from '../components/custom/FormV2/components/utils';
+import { docFormData, documentInstance, formData, instance, mockDocEvokeForm, mockEvokeForm } from './FormRendererData';
+export default {
+    title: 'Custom/FormRenderer',
+    component: FormRenderer,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    decorators: [
+        (Story) => (React.createElement(Box, { sx: { padding: '2rem', paddingBottom: 0, '& .css-x8wy7h': { bottom: 0 } } },
+            React.createElement(Story, null))),
+    ],
+};
+// Functions for story props
+async function onSave(data) {
+    console.log('raw data', data);
+    const formattedSubmission = await formatSubmission(structuredClone(data));
+    console.log('formatted data', formattedSubmission);
+}
+function onValidationChange(error) {
+    console.log('error', error);
+}
+const mockProps = {
+    onSubmit: onSave,
+    hideButtons: false,
+    fieldHeight: 'medium',
+    form: mockEvokeForm,
+    instance: instance,
+    onValidationChange: onValidationChange,
+};
+const Template = (args) => {
+    const [formDataState, setFormDataState] = React.useState(args.form.id === 'documentForm' ? docFormData : formData);
+    const handleChange = React.useCallback((field, value) => {
+        setFormDataState((prev) => {
+            const newData = { ...prev };
+            set(newData, field, value);
+            return newData;
+        });
+    }, []);
+    function onCancel() {
+        setFormDataState(formData);
+    }
+    return (React.createElement(MemoryRouter, null,
+        React.createElement(FormRenderer, { ...args, value: formDataState, onChange: handleChange, onCancel: onCancel })));
+};
+export const Editable = Template.bind({});
+Editable.args = {
+    ...mockProps,
+};
+export const NoButtons = Template.bind({});
+NoButtons.args = {
+    ...mockProps,
+    hideButtons: true,
+};
+export const DocumentForm = Template.bind({});
+DocumentForm.args = {
+    ...mockProps,
+    form: mockDocEvokeForm,
+    instance: documentInstance,
+};

package/dist/published/stories/FormRendererContainer.stories.d.ts

@@ -0,0 +1,7 @@
+import { ComponentMeta, ComponentStory } from '@storybook/react';
+import { FormRendererContainer } from '../components/custom';
+declare const _default: ComponentMeta<typeof FormRendererContainer>;
+export default _default;
+export declare const Editable: ComponentStory<typeof FormRendererContainer>;
+export declare const NoButtons: ComponentStory<typeof FormRendererContainer>;
+export declare const DocumentForm: ComponentStory<typeof FormRendererContainer>;

package/dist/published/stories/FormRendererContainer.stories.js

@@ -0,0 +1,56 @@
+import { Box } from '@mui/material';
+import { http, HttpResponse } from 'msw';
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import { FormRendererContainer } from '../components/custom';
+import { documentInstance } from './FormRendererData';
+import { sharedObjectHandlers } from './sharedMswHandlers';
+export default {
+    title: 'Custom/FormRendererContainer',
+    component: FormRendererContainer,
+    parameters: {
+        layout: 'fullscreen',
+        msw: {
+            handlers: [
+                ...sharedObjectHandlers,
+                // Document fetch
+                http.get('api/data/objects/genericEvokeForm/instances/updateGenericEvokeFormInstanceId/documents/documentInstanceId', () => HttpResponse.json(documentInstance)),
+            ],
+        },
+    },
+    decorators: [
+        (Story) => (React.createElement(Box, { sx: { padding: '2rem', paddingBottom: 0, '& .css-x8wy7h': { bottom: -1 } } },
+            React.createElement(Story, null))),
+    ],
+};
+const mockProps = {
+    formId: 'updateGenericEvokeForm',
+    instanceId: 'updateGenericEvokeFormInstanceId',
+    dataType: 'objectInstances',
+    display: {
+        fieldHeight: 'medium',
+    },
+    actionId: '_update',
+    stickyFooter: true,
+    objectId: 'genericEvokeForm',
+};
+const Template = (args) => {
+    return (React.createElement(MemoryRouter, null,
+        React.createElement(FormRendererContainer, { ...args })));
+};
+export const Editable = Template.bind({});
+Editable.args = {
+    ...mockProps,
+};
+export const NoButtons = Template.bind({});
+NoButtons.args = {
+    ...mockProps,
+    hideButtons: true,
+};
+export const DocumentForm = Template.bind({});
+DocumentForm.args = {
+    ...mockProps,
+    formId: 'documentForm',
+    documentId: 'documentInstanceId',
+    dataType: 'documents',
+};

package/dist/published/stories/FormRendererData.d.ts

@@ -0,0 +1,116 @@
+import { EvokeForm, Obj, ObjectInstance } from '@evoke-platform/context';
+import { Document } from '../components/custom/FormV2/components/types';
+export declare const formData: {
+    name: string;
+    multiSelect: string[];
+    address: {
+        city: string;
+    };
+};
+export declare const instance: ObjectInstance;
+export declare const documentInstance: Document;
+export declare const docFormData: {
+    id: string;
+    name: string;
+    contentType: string;
+    size: number;
+    uploadedDate: string;
+    type: string;
+    view_permission: string;
+    versionId: string;
+};
+export declare const mockGenericEvokeFormObject: Obj;
+export declare const mockMovieObject: Obj;
+export declare const mockCustomerObject: Obj;
+export declare const mockPeopleGenericObject: Obj;
+export declare const mockPeopleObject: Obj;
+export declare const mockEvokeForm: EvokeForm;
+export declare const mockCustomerUpdateForm: EvokeForm;
+export declare const mockCustomerCreateForm: EvokeForm;
+export declare const mockMovieCreateForm: EvokeForm;
+export declare const mockDocEvokeForm: EvokeForm;
+export declare const mockPropertiesForCriteria: ({
+    id: string;
+    name: string;
+    type: string;
+    required: boolean;
+    searchable: boolean;
+    enum?: undefined;
+    objectId?: undefined;
+    relatedPropertyId?: undefined;
+} | {
+    id: string;
+    name: string;
+    type: string;
+    enum: string[];
+    required?: undefined;
+    searchable?: undefined;
+    objectId?: undefined;
+    relatedPropertyId?: undefined;
+} | {
+    id: string;
+    name: string;
+    type: string;
+    required?: undefined;
+    searchable?: undefined;
+    enum?: undefined;
+    objectId?: undefined;
+    relatedPropertyId?: undefined;
+} | {
+    id: string;
+    name: string;
+    type: string;
+    objectId: string;
+    required?: undefined;
+    searchable?: undefined;
+    enum?: undefined;
+    relatedPropertyId?: undefined;
+} | {
+    id: string;
+    name: string;
+    type: string;
+    objectId: string;
+    relatedPropertyId: string;
+    required?: undefined;
+    searchable?: undefined;
+    enum?: undefined;
+})[];
+export declare const mockInstancesForRelatedObject: {
+    id: string;
+    objectId: string;
+    name: string;
+    runTime: string;
+    description: string;
+}[];
+export declare const mockInstancesForCollection: {
+    version: number;
+    id: string;
+    objectId: string;
+    genericEvokeForm: {
+        id: string;
+        name: string;
+    };
+    name: string;
+    decimal: number;
+    livingPlace: {
+        city: string;
+        line1: string;
+        line2: string;
+        state: string;
+        zipCode: string;
+        county: string;
+    };
+}[];
+export declare const mockPeopleGenericObjectInstances: {
+    id: string;
+    name: string;
+    people: {
+        id: string;
+        name: string;
+    };
+    genericEvokeForm: {
+        id: string;
+        name: string;
+    };
+    objectId: string;
+}[];