react-formule 1.2.1 → 1.3.0

package/README.md

@@ -43,7 +43,7 @@ Formule consists of the following main components:
 
 It also exports the following functions:
 
-- **`initFormuleSchema`**: Inits the JSONSchema, **_needs_** to be run on startup.
+- **`initFormuleSchema`**: Inits or resets the JSONSchema. You can also load an existing schema by passing it as an argument.
 - **`getFormuleState`**: Formule has its own internal redux state. You can retrieve it at any moment if you so require for more advanced use cases. If you want to continuosly synchronize the Formule state in your app, you can pass a callback function to FormuleContext instead (see below), which will be called every time the form state changes.
 
 And the following utilities:
@@ -52,6 +52,16 @@ And the following utilities:
 - **`CodeViewer`**: Useful if you want to visualize the JSON schemas that are being generated (as you can see in the demo).
 - **`CodeDiffViewer`**: Useful if you want to compare two different JSON schemas, for example to see the changes since the last save.
 
+As well as the following utility functions to handle saving and loading schemas from local storage if you need and for unsaved change detection:
+
+- `getAllFromLocalStorage`
+- `saveToLocalStorage`
+- `deleteFromLocalStorage`
+- `loadFromLocalStorage`
+- `isUnsaved`
+
+Have a look at `src/index.ts` to see all exported components and functions. You can also have a look at `formule-demo` to see how they are used there.
+
 ### Field types
 
 Formule includes a variety of predefined field types, grouped in three categories:
@@ -83,20 +93,19 @@ yarn add react-formule
 
 ```jsx
 import {
-    FormuleContext,
-    SelectOrEdit,
-    SchemaPreview,
-    FormPreview,
-    initFormuleSchema
+  FormuleContext,
+  SelectOrEdit,
+  SchemaPreview,
+  FormPreview,
 } from "react-formule";
 
-const useEffect(() => initFormuleSchema(), []);
-
-<FormuleContext>
+return (
+  <FormuleContext>
     <SelectOrEdit />
     <SchemaPreview />
     <FormPreview />
-</FormuleContext>
+  </FormuleContext>
+);
 ```
 
 ### Customizing and adding new field types
@@ -168,8 +177,8 @@ const handleFormuleStateChange = (newState) => {
 Alternatively, you can pull the current state on demand by calling `getFormuleState` at any moment.
 
 > [!TIP]
-> For more examples, feel free to browse around the [CERN Analysis Preservation](https://github.com/cernanalysispreservation/analysispreservation.cern.ch) repository, where we use all the features mentioned above.
+> For more examples, feel free to browse around formule-demo and the [CERN Analysis Preservation](https://github.com/cernanalysispreservation/analysispreservation.cern.ch) repository, where we use all the features mentioned above.
 
 ## :space_invader: Local demo & how to contribute
 
-Apart from trying the online [demo](https://cern-sis.github.io/react-formule/) you can clone the repo and run `formule-demo` to play around. Follow the instructions in its [README](./formule-demo/README.md): it will explain how to install `react-formule` as a local dependency so that you can modify Formule and test the changes live in your host app, which will be ideal if you want to troubleshoot or contribute to the project.
+Apart from trying the online [demo](https://cern-sis.github.io/react-formule/) you can clone the repo and run `formule-demo` to play around. Follow the instructions in its [README](./formule-demo/README.md): it will explain how to install `react-formule` as a local dependency so that you can modify Formule and test the changes live in your host app, which will be ideal if you want to troubleshoot or contribute to the project. Your contributions are welcome! :rocket:

package/dist/admin/components/SchemaPreview.d.ts

@@ -1,6 +1,8 @@
 import { default as PropTypes } from 'prop-types';
 export default SchemaPreview;
-declare function SchemaPreview(): import("react/jsx-runtime").JSX.Element;
+declare function SchemaPreview({ hideSchemaKey }: {
+    hideSchemaKey: any;
+}): import("react/jsx-runtime").JSX.Element;
 declare namespace SchemaPreview {
     namespace propTypes {
         let schema: PropTypes.Requireable<object>;

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

@@ -5,15 +5,6 @@ export namespace SIZE_OPTIONS {
     let large: number;
     let xlarge: number;
 }
-export function initSchemaStructure(name?: string, description?: string): {
-    schema: {
-        title: string;
-        description: string;
-        type: string;
-        properties: {};
-    };
-    uiSchema: {};
-};
 export function _validate(formData: any, errors: any): any;
 export function shoudDisplayGuideLinePopUp(schema: any): any;
 export function isItTheArrayField(schema: any, uiSchema: any): boolean;

package/dist/exposed.d.ts

@@ -1,5 +1,5 @@
 import { ThemeConfig } from 'antd';
-import { ReactNode } from 'react';
+import { ReactNode, SetStateAction } from 'react';
 import { RJSFSchema } from '@rjsf/utils';
 import { SchemaWizardState } from './store/schemaWizard';
 
@@ -17,23 +17,37 @@ type FormuleContextProps = {
     transformSchema?: (schema: object) => object;
 };
 export declare const FormuleContext: ({ children, customFieldTypes, customFields, customWidgets, customPublishedFields, customPublishedWidgets, theme, separator, errorBoundary, synchronizeState, transformSchema, }: FormuleContextProps) => import("react/jsx-runtime").JSX.Element;
-export declare const initFormuleSchema: (data?: RJSFSchema, name?: string, description?: string) => void;
+export declare const initFormuleSchema: (data?: RJSFSchema, title?: string, description?: string) => void;
 export declare const getFormuleState: () => {
     current: {
-        schema: {};
+        schema: {
+            title: string;
+            description: string;
+            type: string;
+            properties: {};
+        };
         uiSchema: {};
     };
     initial: {
         schema: {};
         uiSchema: {};
     };
-    initialConfig: {};
-    config: {};
+    id: string;
     field: {};
     formData: {};
-    propKeyEditor: null;
-    error: null;
-    loader: boolean;
-    version: null;
 };
+export declare const getAllFromLocalStorage: () => {
+    id: string;
+    value: any;
+}[];
+export declare const saveToLocalStorage: () => Promise<SetStateAction<{
+    id: string;
+    value: object;
+}[]>>;
+export declare const deleteFromLocalStorage: (id: string) => Promise<SetStateAction<{
+    id: string;
+    value: object;
+}[]>>;
+export declare const loadFromLocalStorage: (id: string) => void;
+export declare const isUnsaved: () => boolean;
 export {};

package/dist/forms/Form.d.ts

@@ -36,7 +36,6 @@ declare namespace RJSFForm {
         let formContext: PropTypes.Requireable<object>;
         let widgets: PropTypes.Requireable<object>;
         let mode: PropTypes.Requireable<string>;
-        let draftEditor: PropTypes.Requireable<boolean>;
         let readonly: PropTypes.Requireable<boolean>;
         let className: PropTypes.Requireable<string>;
         let liveValidate: PropTypes.Requireable<boolean>;

package/dist/index.d.ts

@@ -1,6 +1,11 @@
 export { initFormuleSchema } from './exposed';
 export { getFormuleState } from './exposed';
 export { FormuleContext } from './exposed';
+export { getAllFromLocalStorage } from './exposed';
+export { saveToLocalStorage } from './exposed';
+export { deleteFromLocalStorage } from './exposed';
+export { loadFromLocalStorage } from './exposed';
+export { isUnsaved } from './exposed';
 export { default as PropertyEditor } from './admin/components/PropertyEditor';
 export { default as SelectFieldType } from './admin/components/SelectFieldType';
 export { default as SchemaPreview } from './admin/components/SchemaPreview';