informed - npm Package Compare versions

Comparing version 4.52.0 to 4.53.0

dist/cjs/FormController.js

@@ -699,2 +699,3 @@ 'use strict';
       this.setValue(name, undefined);
+      this.emit('clear', name);
     }
@@ -701,0 +702,0 @@ }, {

dist/cjs/hooks/useArrayField.js

@@ -15,2 +15,3 @@ 'use strict';
 var useFormApi = require('./useFormApi.js');
+var useFieldSubscription = require('./useFieldSubscription.js');
 
@@ -158,2 +159,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
   };
+  var clear = function clear() {
+    formController.remove(name);
+    setInitialValues([]);
+    setKeys([]);
+  };
 
@@ -203,3 +209,4 @@ // Create meta object
       addWithInitialValue: addWithInitialValue,
-      reset: reset
+      reset: reset,
+      clear: clear
     };
@@ -239,2 +246,10 @@ }, []);
   }, [name]);
+  useFieldSubscription.useFieldSubscription('clear', [name], function (target) {
+    logger("clear event triggered for ".concat(name, " because of ").concat(target));
+    clear();
+  }, false,
+  // No scope ( lol ) because we are already scoped
+  true // Flip order of target comparison
+  );
+
   var render = function render(children) {
@@ -241,0 +256,0 @@ return /*#__PURE__*/React__default["default"].createElement(Context.FormControllerContext.Provider, {

dist/cjs/hooks/useField.js

@@ -351,3 +351,5 @@ 'use strict';
     }
-  });
+  }, false // No scope as we are already scoped
+  );
+
   useUpdateEffect.useUpdateEffect(function () {
@@ -354,0 +356,0 @@ logger("revalidating for ".concat(metaRef.current.name, " because of deps change"));

dist/cjs/hooks/useFieldSubscription.js

@@ -20,2 +20,3 @@ 'use strict';
   var scoped = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
+  var flipped = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
   // Create scoper function
@@ -56,2 +57,3 @@ var scope = useScoper.useScoper();
     var listener = function listener(target) {
+      // console.log('TARGET', target, 'FIELDS', scopedFields);
       // either
@@ -62,3 +64,9 @@ // 1. All fields are supposed to update
       if (target === '_ALL_' || scopedFields.includes(target) || target && scopedFields.some(function (field) {
-        return utils.isChild(field, target);
+        if (flipped) {
+          // isChild( parent, child )
+          return utils.isChild(target, field);
+        } else {
+          // isChild( parent, child )
+          return utils.isChild(field, target);
+        }
       })) {
@@ -65,0 +73,0 @@ debug("subscription ".concat(event, " triggered with target ").concat(target, " for"), scopedFields);

dist/cjs/ObjectMap.js

@@ -316,1 +316,2 @@ 'use strict';
 exports.ObjectMap = ObjectMap;
+exports.ldtoPath = ldtoPath;

dist/esm/FormController.js

@@ -695,2 +695,3 @@ import { createClass as _createClass, objectSpread2 as _objectSpread2, classCallCheck as _classCallCheck } from './_virtual/_rollupPluginBabelHelpers.js';
       this.setValue(name, undefined);
+      this.emit('clear', name);
     }
@@ -697,0 +698,0 @@ }, {

dist/esm/hooks/useArrayField.js

@@ -11,2 +11,3 @@ import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, toConsumableArray as _toConsumableArray } from '../_virtual/_rollupPluginBabelHelpers.js';
 import { useFormApi } from './useFormApi.js';
+import { useFieldSubscription } from './useFieldSubscription.js';
 
@@ -150,2 +151,7 @@ var logger = Debug('informed:useArrayField' + '\t');
   };
+  var clear = function clear() {
+    formController.remove(name);
+    setInitialValues([]);
+    setKeys([]);
+  };
 
@@ -195,3 +201,4 @@ // Create meta object
       addWithInitialValue: addWithInitialValue,
-      reset: reset
+      reset: reset,
+      clear: clear
     };
@@ -231,2 +238,10 @@ }, []);
   }, [name]);
+  useFieldSubscription('clear', [name], function (target) {
+    logger("clear event triggered for ".concat(name, " because of ").concat(target));
+    clear();
+  }, false,
+  // No scope ( lol ) because we are already scoped
+  true // Flip order of target comparison
+  );
+
   var render = function render(children) {
@@ -233,0 +248,0 @@ return /*#__PURE__*/React.createElement(FormControllerContext.Provider, {

dist/esm/hooks/useField.js

@@ -343,3 +343,5 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, toConsumableArray as _toConsumableArray, objectSpread2 as _objectSpread2 } from '../_virtual/_rollupPluginBabelHelpers.js';
     }
-  });
+  }, false // No scope as we are already scoped
+  );
+
   useUpdateEffect(function () {
@@ -346,0 +348,0 @@ logger("revalidating for ".concat(metaRef.current.name, " because of deps change"));

dist/esm/hooks/useFieldSubscription.js

@@ -16,2 +16,3 @@ import { toConsumableArray as _toConsumableArray } from '../_virtual/_rollupPluginBabelHelpers.js';
   var scoped = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
+  var flipped = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
   // Create scoper function
@@ -52,2 +53,3 @@ var scope = useScoper();
     var listener = function listener(target) {
+      // console.log('TARGET', target, 'FIELDS', scopedFields);
       // either
@@ -58,3 +60,9 @@ // 1. All fields are supposed to update
       if (target === '_ALL_' || scopedFields.includes(target) || target && scopedFields.some(function (field) {
-        return isChild(field, target);
+        if (flipped) {
+          // isChild( parent, child )
+          return isChild(target, field);
+        } else {
+          // isChild( parent, child )
+          return isChild(field, target);
+        }
       })) {
@@ -61,0 +69,0 @@ debug("subscription ".concat(event, " triggered with target ").concat(target, " for"), scopedFields);

dist/esm/ObjectMap.js

@@ -311,2 +311,2 @@ import { createClass as _createClass, typeof as _typeof, classCallCheck as _classCallCheck } from './_virtual/_rollupPluginBabelHelpers.js';
 
-export { ObjectMap };
+export { ObjectMap, ldtoPath };

package.json

 {
   "name": "informed",
-  "version": "4.52.0",
+  "version": "4.53.0",
   "description": "A lightweight framework and utility for building powerful forms in React applications",
@@ -84,2 +84,3 @@ "type": "module",
     "@babel/preset-react": "^7.0.0",
+    "@babel/traverse": "^7.23.2",
     "@codesandbox/sandpack-react": "^2.6.1",
@@ -122,2 +123,3 @@ "@emotion/core": "^10.0.10",
     "react-live": "^2.2.3",
+    "react-markdown": "^9.0.0",
     "react-prism": "^4.3.2",
@@ -124,0 +126,0 @@ "react-router-dom": "^6.9.0",

README.md

@@ -8,8 +8,2 @@ # Informed
 
-<!-- [![Discord](https://img.shields.io/discord/676066734746370058)](https://discord.gg/zpF5wA) -->
-
-<!-- [![Build Status](https://travis-ci.org/joepuzzo/informed.svg?branch=master)](https://travis-ci.org/joepuzzo/informed)
-[![Coverage Status](https://coveralls.io/repos/github/joepuzzo/informed/badge.svg?branch=master)](https://coveralls.io/github/joepuzzo/informed?branch=master)
-[![Minzipped-Size](https://badgen.net/bundlephobia/minzip/informed)](https://bundlephobia.com/result?p=informed) -->
-
 ## Introduction
@@ -66,2 +60,20 @@
 
+## Feature List
+
+`informed` was designed to support many important features
+
+- Arrays: ability to render dynamic arrays of fields `[ 'a', 'b' ]` or `[ { name: 'Joe', age: 29 }, { name: 'Hope', age: 24 }]`
+- Relevance: ability to render render fields conditionally depending on the state of other parts of the form
+- JSPAN: ability to easily and intuitively manipulate form state
+- Formatting: ability to perform display formatting, where the format shown to user can differ from the state of the values stored
+- Validation: ability to perform both synchronous and asynchronous validation in a controlled manner
+- Api: ability to manipulate the form state both inside and outside the context of the form
+- State: ability to access field and form data
+- Multistep: ability to create dynamic multistep forms
+- Scope: ability to scope ( group ) fields
+- Schema: ability to render forms based on pure JSON schema
+- Dynaic: ability to hide and show fields ( render and unrender ) and either cleanup or maintain state of unmounted fields
+- Debugging: ability to easily debug users state as well as internals of the library
+- Nesting: ability to have highly nested value strucutre `state.values.friends[1].brother.parents.cars[0].model`
+
 ## Creating Your Own Fields
@@ -208,6 +220,32 @@
 - **JSON Schema:** `informed` was designed to support rendering forms based on pure JSON
+
   - this is especially useful when form definitions are stored on the backend
 
+- **Feature List:** `informed` was designed to support many important features
+  - Arrays: ability to render dynamic arrays of fields `[ 'a', 'b' ]` or `[ { name: 'Joe', age: 29 }, { name: 'Hope', age: 24 }]`
+  - Relevance: ability to render render fields conditionally depending on the state of other parts of the form
+  - JSPAN: ability to easily and intuitively manipulate form state
+  - Formatting: ability to perform display formatting, where the format shown to user can differ from the state of the values stored
+  - Validation: ability to perform both synchronous and asynchronous validation in a controlled manner
+  - Api: ability to manipulate the form state both inside and outside the context of the form
+  - State: ability to access field and form data
+  - Multistep: ability to create dynamic multistep forms
+  - Scope: ability to scope ( group ) fields
+  - Schema: ability to render forms based on pure JSON schema
+  - Dynaic: ability to hide and show fields ( render and unrender ) and either cleanup or maintain state of unmounted fields
+  - Debugging: ability to easily debug users state as well as internals of the library
+  - Nesting: ability to have highly nested value strucutre `state.values.friends[1].brother.parents.cars[0].model`
+
 ---
 
+### Terminology
+
+- **JSPAN:** ( Java Script Path Access Notation ) much like how you access and write to objects and arrays in javascript you can use the string representation to address a place in an object.
+
+```js
+const path = 'state.values.friends[1].brother.name';
+```
+
+---
+
 ### Layout
@@ -306,3 +344,3 @@
 
-```js
+```jsx
 import Example from './Example';
@@ -309,0 +347,0 @@ import exampleCode from './Example.jsx?raw';

No alert changes

Improved metrics

Total package byte prevSize

595696

increased by0.7%

Lines of code

15064

increased by0.33%

Number of lines in readme file

361

increased by11.76%

Worsened metrics

Dev dependency count

60

increased by3.45%

No dependency changes