@dnb/eufemia 10.31.0 → 10.33.0

package/extensions/forms/Form/Visibility/Visibility.js

@@ -2,13 +2,14 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["visible", "pathDefined", "pathUndefined", "pathTruthy", "pathFalsy", "pathTrue", "pathFalse", "pathValue", "whenValue", "inferData", "animate", "keepInDOM", "fieldPropsWhenHidden", "children"];
-import React, { useContext } from 'react';
+const _excluded = ["visible", "pathDefined", "pathUndefined", "pathTruthy", "pathFalsy", "pathTrue", "pathFalse", "pathValue", "whenValue", "visibleWhen", "visibleWhenNot", "inferData", "filterData", "animate", "keepInDOM", "fieldPropsWhenHidden", "children"];
+import React, { useCallback, useContext } from 'react';
 import pointer from 'json-pointer';
 import { warn } from '../../../../shared/helpers';
 import useMountEffect from '../../../../shared/helpers/useMountEffect';
 import HeightAnimation from '../../../../components/HeightAnimation';
 import DataContext from '../../DataContext/Context';
+import SectionContext from '../Section/SectionContext';
 import FieldProps from '../FieldProps';
 function Visibility(_ref) {
   let {
@@ -21,7 +22,10 @@ function Visibility(_ref) {
       pathFalse,
       pathValue,
       whenValue,
+      visibleWhen,
+      visibleWhenNot,
       inferData,
+      filterData,
       animate,
       keepInDOM,
       fieldPropsWhenHidden,
@@ -29,37 +33,70 @@ function Visibility(_ref) {
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
   const dataContext = useContext(DataContext);
+  const sectionContext = useContext(SectionContext);
+  const sectionPath = sectionContext === null || sectionContext === void 0 ? void 0 : sectionContext.path;
+  const composePath = useCallback(path => {
+    return `${sectionPath && sectionPath !== '/' ? sectionPath : ''}${path}`;
+  }, [sectionPath]);
   useMountEffect(() => {
     if (fieldPropsWhenHidden && !keepInDOM) {
       warn('Using "fieldPropsWhenHidden" requires "keepInDOM" to be true.');
     }
   });
   const check = () => {
+    var _dataContext$filterDa;
     if (visible === false) {
       return;
     }
-    if (pathDefined && !pointer.has(dataContext.data, pathDefined)) {
+    const data = filterData && ((_dataContext$filterDa = dataContext.filterDataHandler) === null || _dataContext$filterDa === void 0 ? void 0 : _dataContext$filterDa.call(dataContext, dataContext.data, filterData)) || dataContext.data;
+    if (visibleWhen || visibleWhenNot) {
+      if (visibleWhenNot) {
+        visibleWhen = visibleWhenNot;
+      }
+      const hasPath = pointer.has(data, composePath(visibleWhen.path));
+      if (hasPath) {
+        var _visibleWhen, _visibleWhen2;
+        const value = pointer.get(data, composePath(visibleWhen.path));
+        const withValue = (_visibleWhen = visibleWhen) === null || _visibleWhen === void 0 ? void 0 : _visibleWhen['withValue'];
+        const result = withValue && (withValue === null || withValue === void 0 ? void 0 : withValue(value)) === false || Object.prototype.hasOwnProperty.call(visibleWhen, 'hasValue') && ((_visibleWhen2 = visibleWhen) === null || _visibleWhen2 === void 0 ? void 0 : _visibleWhen2['hasValue']) !== value;
+        if (visibleWhenNot) {
+          if (!result) {
+            return;
+          }
+        } else if (result) {
+          return;
+        }
+      } else {
+        return;
+      }
+    }
+    if (pathDefined && !pointer.has(data, composePath(pathDefined))) {
       return;
     }
-    if (pathUndefined && pointer.has(dataContext.data, pathUndefined)) {
+    if (pathUndefined && pointer.has(data, composePath(pathUndefined))) {
       return;
     }
-    if (pathTruthy && (!pointer.has(dataContext.data, pathTruthy) || !pointer.get(dataContext.data, pathTruthy))) {
+    const getValue = path => {
+      if (pointer.has(data, path)) {
+        return pointer.get(data, path);
+      }
+    };
+    if (pathTrue && getValue(composePath(pathTrue)) !== true) {
       return;
     }
-    if (pathFalsy && pointer.has(dataContext.data, pathFalsy) && Boolean(pointer.get(dataContext.data, pathFalsy))) {
+    if (pathFalse && getValue(composePath(pathFalse)) !== false) {
       return;
     }
-    if (pathTrue && (!pointer.has(dataContext.data, pathTrue) || pointer.get(dataContext.data, pathTrue) !== true)) {
+    if (pathTruthy && Boolean(getValue(composePath(pathTruthy))) === false) {
       return;
     }
-    if (pathFalse && (!pointer.has(dataContext.data, pathFalse) || pointer.get(dataContext.data, pathFalse) !== false)) {
+    if (pathFalsy && Boolean(getValue(composePath(pathFalsy))) === true) {
       return;
     }
-    if (pathValue && !(pointer.has(dataContext.data, pathValue) && pointer.get(dataContext.data, pathValue) === whenValue)) {
+    if (inferData && !inferData(data)) {
       return;
     }
-    if (inferData && !inferData(dataContext.data)) {
+    if (pathValue && getValue(composePath(pathValue)) !== whenValue) {
       return;
     }
     return true;
@@ -69,7 +106,7 @@ function Visibility(_ref) {
     const props = !open ? fieldPropsWhenHidden : null;
     return React.createElement(HeightAnimation, _extends({
       open: open,
-      keepInDOM: keepInDOM,
+      keepInDOM: Boolean(keepInDOM),
       className: "dnb-forms-visibility"
     }, rest), React.createElement(FieldProps, props, children));
   }

package/extensions/forms/Form/Visibility/Visibility.js.map

@@ -1 +1 @@
-{"version":3,"file":"Visibility.js","names":["React","useContext","pointer","warn","useMountEffect","HeightAnimation","DataContext","FieldProps","Visibility","_ref","visible","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","pathValue","whenValue","inferData","animate","keepInDOM","fieldPropsWhenHidden","children","rest","_objectWithoutProperties","_excluded","dataContext","check","has","data","get","Boolean","open","props","createElement","_extends","className","hidden","Fragment","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/Visibility.tsx"],"sourcesContent":["import React, { AriaAttributes, useContext } from 'react'\nimport pointer from 'json-pointer'\nimport { warn } from '../../../../shared/helpers'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport HeightAnimation, {\n  HeightAnimationProps,\n} from '../../../../components/HeightAnimation'\nimport DataContext from '../../DataContext/Context'\nimport FieldProps from '../FieldProps'\nimport type { UseFieldProps } from '../../types'\nimport type { DataAttributes } from '../../hooks/useFieldProps'\n\nexport type Props = {\n  visible?: boolean\n  /** Given data context path must be defined to show children */\n  pathDefined?: string\n  /** Given data context path must be undefined to show children */\n  pathUndefined?: string\n  /** Given data context path must be truthy to show children */\n  pathTruthy?: string\n  /** Given data context path must be falsy to show children */\n  pathFalsy?: string\n  /** Given data context path must be true to show children */\n  pathTrue?: string\n  /** Given data context path must be false to show children */\n  pathFalse?: string\n  /** Given data context path must match, as well as the \"whenValue\" value */\n  pathValue?: string\n  /** Given data context value must match this value to show children */\n  whenValue?: unknown\n  /** Infer visibility calling given derivative function with the whole data set. Should return true/false for visibility.   */\n  inferData?: (data: unknown) => boolean\n  /** Animate the visibility change */\n  animate?: boolean\n  /** Keep the content in the DOM, even if it's not visible */\n  keepInDOM?: boolean\n  /** When visibility is hidden, and `keepInDOM` is true, pass these props to the children */\n  fieldPropsWhenHidden?: UseFieldProps & DataAttributes & AriaAttributes\n  element?: HeightAnimationProps['element']\n  children: React.ReactNode\n}\n\nfunction Visibility({\n  visible,\n  pathDefined,\n  pathUndefined,\n  pathTruthy,\n  pathFalsy,\n  pathTrue,\n  pathFalse,\n  pathValue,\n  whenValue,\n  inferData,\n  animate,\n  keepInDOM,\n  fieldPropsWhenHidden,\n  children,\n  ...rest\n}: Props) {\n  const dataContext = useContext(DataContext)\n\n  useMountEffect(() => {\n    if (fieldPropsWhenHidden && !keepInDOM) {\n      warn('Using \"fieldPropsWhenHidden\" requires \"keepInDOM\" to be true.')\n    }\n  })\n\n  const check = () => {\n    if (visible === false) {\n      return\n    }\n\n    if (pathDefined && !pointer.has(dataContext.data, pathDefined)) {\n      return\n    }\n    if (pathUndefined && pointer.has(dataContext.data, pathUndefined)) {\n      return\n    }\n\n    if (\n      pathTruthy &&\n      (!pointer.has(dataContext.data, pathTruthy) ||\n        !pointer.get(dataContext.data, pathTruthy))\n    ) {\n      return\n    }\n    if (\n      pathFalsy &&\n      pointer.has(dataContext.data, pathFalsy) &&\n      Boolean(pointer.get(dataContext.data, pathFalsy))\n    ) {\n      return\n    }\n\n    if (\n      pathTrue &&\n      (!pointer.has(dataContext.data, pathTrue) ||\n        pointer.get(dataContext.data, pathTrue) !== true)\n    ) {\n      return\n    }\n    if (\n      pathFalse &&\n      (!pointer.has(dataContext.data, pathFalse) ||\n        pointer.get(dataContext.data, pathFalse) !== false)\n    ) {\n      return\n    }\n\n    if (\n      pathValue &&\n      !(\n        pointer.has(dataContext.data, pathValue) &&\n        pointer.get(dataContext.data, pathValue) === whenValue\n      )\n    ) {\n      return\n    }\n\n    if (inferData && !inferData(dataContext.data)) {\n      return\n    }\n\n    return true\n  }\n\n  const open = Boolean(check())\n\n  if (animate) {\n    const props = !open ? fieldPropsWhenHidden : null\n\n    return (\n      <HeightAnimation\n        open={open}\n        keepInDOM={keepInDOM}\n        className=\"dnb-forms-visibility\"\n        {...rest}\n      >\n        <FieldProps {...props}>{children}</FieldProps>\n      </HeightAnimation>\n    )\n  }\n\n  if (keepInDOM) {\n    const props = !open ? fieldPropsWhenHidden : null\n    return (\n      <span className=\"dnb-forms-visibility\" hidden={!open}>\n        <FieldProps {...props}>{children}</FieldProps>\n      </span>\n    )\n  }\n\n  return <>{open ? children : null}</>\n}\n\nVisibility._supportsSpacingProps = 'children'\nexport default Visibility\n"],"mappings":"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"}
+{"version":3,"file":"Visibility.js","names":["React","useCallback","useContext","pointer","warn","useMountEffect","HeightAnimation","DataContext","SectionContext","FieldProps","Visibility","_ref","visible","pathDefined","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","pathValue","whenValue","visibleWhen","visibleWhenNot","inferData","filterData","animate","keepInDOM","fieldPropsWhenHidden","children","rest","_objectWithoutProperties","_excluded","dataContext","sectionContext","sectionPath","path","composePath","check","_dataContext$filterDa","data","filterDataHandler","call","hasPath","has","_visibleWhen","_visibleWhen2","value","get","withValue","result","Object","prototype","hasOwnProperty","getValue","Boolean","open","props","createElement","_extends","className","hidden","Fragment","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/Visibility.tsx"],"sourcesContent":["import React, { AriaAttributes, useCallback, useContext } from 'react'\nimport pointer from 'json-pointer'\nimport { warn } from '../../../../shared/helpers'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport HeightAnimation, {\n  HeightAnimationProps,\n} from '../../../../components/HeightAnimation'\nimport DataContext, { FilterData } from '../../DataContext/Context'\nimport SectionContext from '../Section/SectionContext'\nimport FieldProps from '../FieldProps'\nimport type { Path, UseFieldProps } from '../../types'\nimport type { DataAttributes } from '../../hooks/useFieldProps'\n\ntype VisibleWhen =\n  | {\n      path: string\n      hasValue: unknown\n    }\n  | {\n      path: string\n      withValue: (value: unknown) => boolean\n    }\n\nexport type Props = {\n  visible?: boolean\n  /** Given data context path must be defined to show children */\n  pathDefined?: string\n  /** Given data context path must be undefined to show children */\n  pathUndefined?: string\n  /** Given data context path must be truthy to show children */\n  pathTruthy?: string\n  /** Given data context path must be falsy to show children */\n  pathFalsy?: string\n  /** Given data context path must be true to show children */\n  pathTrue?: string\n  /** Given data context path must be false to show children */\n  pathFalse?: string\n  /** Provide a `path` and a `hasValue` property with the excepted value in order to show children. You can alternatively provide a `withValue` function that returns a boolean. The first parameter is the value of the path. */\n  visibleWhen?: VisibleWhen\n  /** Same as `visibleWhen`, but with inverted logic. */\n  visibleWhenNot?: VisibleWhen\n  /** Infer visibility calling given derivative function with the whole data set. Should return true/false for visibility.   */\n  inferData?: (data: unknown) => boolean\n  /** Filter data based on provided criteria. The first parameter is the path, the second is the value, and the third is the props, and the fourth is the internal. Return false to filter out the data. */\n  filterData?: FilterData\n  /** Animate the visibility change */\n  animate?: boolean\n  /** Keep the content in the DOM, even if it's not visible */\n  keepInDOM?: boolean\n  /** When visibility is hidden, and `keepInDOM` is true, pass these props to the children */\n  fieldPropsWhenHidden?: UseFieldProps & DataAttributes & AriaAttributes\n  element?: HeightAnimationProps['element']\n  children: React.ReactNode\n\n  /** @deprecated Use `visibleWhen` instead */\n  pathValue?: string\n  /** @deprecated Use `visibleWhen` instead */\n  whenValue?: unknown\n}\n\nfunction Visibility({\n  visible,\n  pathDefined,\n  pathUndefined,\n  pathTruthy,\n  pathFalsy,\n  pathTrue,\n  pathFalse,\n  pathValue,\n  whenValue,\n  visibleWhen,\n  visibleWhenNot,\n  inferData,\n  filterData,\n  animate,\n  keepInDOM,\n  fieldPropsWhenHidden,\n  children,\n  ...rest\n}: Props) {\n  const dataContext = useContext(DataContext)\n  const sectionContext = useContext(SectionContext)\n\n  const sectionPath = sectionContext?.path\n  const composePath = useCallback(\n    (path: Path) => {\n      return `${\n        sectionPath && sectionPath !== '/' ? sectionPath : ''\n      }${path}`\n    },\n    [sectionPath]\n  )\n\n  useMountEffect(() => {\n    if (fieldPropsWhenHidden && !keepInDOM) {\n      warn('Using \"fieldPropsWhenHidden\" requires \"keepInDOM\" to be true.')\n    }\n  })\n\n  const check = () => {\n    if (visible === false) {\n      return\n    }\n\n    const data =\n      (filterData &&\n        dataContext.filterDataHandler?.(dataContext.data, filterData)) ||\n      dataContext.data\n\n    if (visibleWhen || visibleWhenNot) {\n      if (visibleWhenNot) {\n        visibleWhen = visibleWhenNot\n      }\n      const hasPath = pointer.has(data, composePath(visibleWhen.path))\n      if (hasPath) {\n        const value = pointer.get(data, composePath(visibleWhen.path))\n\n        const withValue = visibleWhen?.['withValue']\n        const result =\n          (withValue && withValue?.(value) === false) ||\n          (Object.prototype.hasOwnProperty.call(visibleWhen, 'hasValue') &&\n            visibleWhen?.['hasValue'] !== value)\n\n        if (visibleWhenNot) {\n          if (!result) {\n            return\n          }\n        } else if (result) {\n          return\n        }\n      } else {\n        return\n      }\n    }\n\n    if (pathDefined && !pointer.has(data, composePath(pathDefined))) {\n      return\n    }\n    if (pathUndefined && pointer.has(data, composePath(pathUndefined))) {\n      return\n    }\n\n    const getValue = (path: Path) => {\n      if (pointer.has(data, path)) {\n        return pointer.get(data, path)\n      }\n    }\n\n    if (pathTrue && getValue(composePath(pathTrue)) !== true) {\n      return\n    }\n    if (pathFalse && getValue(composePath(pathFalse)) !== false) {\n      return\n    }\n    if (\n      pathTruthy &&\n      Boolean(getValue(composePath(pathTruthy))) === false\n    ) {\n      return\n    }\n    if (pathFalsy && Boolean(getValue(composePath(pathFalsy))) === true) {\n      return\n    }\n    if (inferData && !inferData(data)) {\n      return\n    }\n\n    // Deprecated can be removed in v11\n    if (pathValue && getValue(composePath(pathValue)) !== whenValue) {\n      return\n    }\n\n    return true\n  }\n\n  const open = Boolean(check())\n\n  if (animate) {\n    const props = !open ? fieldPropsWhenHidden : null\n\n    return (\n      <HeightAnimation\n        open={open}\n        keepInDOM={Boolean(keepInDOM)}\n        className=\"dnb-forms-visibility\"\n        {...rest}\n      >\n        <FieldProps {...props}>{children}</FieldProps>\n      </HeightAnimation>\n    )\n  }\n\n  if (keepInDOM) {\n    const props = !open ? fieldPropsWhenHidden : null\n    return (\n      <span className=\"dnb-forms-visibility\" hidden={!open}>\n        <FieldProps {...props}>{children}</FieldProps>\n      </span>\n    )\n  }\n\n  return <>{open ? children : null}</>\n}\n\nVisibility._supportsSpacingProps = 'children'\nexport default Visibility\n"],"mappings":"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"}

package/extensions/forms/Form/Visibility/VisibilityDocs.js

@@ -29,14 +29,14 @@ export const VisibilityProperties = {
     type: 'string',
     status: 'optional'
   },
-  pathValue: {
-    doc: 'Given data context path must match, as well as the `whenValue` value.',
-    type: 'string',
+  visibleWhen: {
+    doc: 'Provide a `path` and a `hasValue` property with the excepted value in order to show children. You can alternatively provide a `withValue` function that returns a boolean. The first parameter is the value of the path.',
+    type: 'object',
     status: 'optional'
   },
-  whenValue: {
-    doc: 'The value to match. Should be used together with `pathValue`.',
-    type: 'string',
+  visibleWhenNot: {
+    doc: 'Same as `visibleWhen`, but with inverted logic.',
+    type: 'object',
     status: 'optional'
   },
   inferData: {
@@ -59,6 +59,11 @@ export const VisibilityProperties = {
     type: 'boolean',
     status: 'optional'
   },
+  filterData: {
+    doc: 'Filter data based on provided criteria. More info about `filterData` can be found in the [Getting Started](/uilib/extensions/forms/getting-started/#filter-data) documentation.',
+    type: ['object', 'function'],
+    status: 'optional'
+  },
   fieldPropsWhenHidden: {
     doc: 'When visibility is hidden, and `keepInDOM` is true, pass these props to the children.',
     type: 'various',

package/extensions/forms/Form/Visibility/VisibilityDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"VisibilityDocs.js","names":["VisibilityProperties","pathDefined","doc","type","status","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","pathValue","whenValue","inferData","visible","animate","keepInDOM","fieldPropsWhenHidden","element","children"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/VisibilityDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const VisibilityProperties: PropertiesTableProps = {\n  pathDefined: {\n    doc: 'Given data context path must be defined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathUndefined: {\n    doc: 'Given data context path must be undefined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTruthy: {\n    doc: 'Given data context path must be truthy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalsy: {\n    doc: 'Given data context path must be falsy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTrue: {\n    doc: 'Given data context path must be true to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalse: {\n    doc: 'Given data context path must be false to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathValue: {\n    doc: 'Given data context path must match, as well as the `whenValue` value.',\n    type: 'string',\n    status: 'optional',\n  },\n  whenValue: {\n    doc: 'The value to match. Should be used together with `pathValue`.',\n    type: 'string',\n    status: 'optional',\n  },\n  inferData: {\n    doc: 'Will be called to decide by external logic, and show/hide contents based on the return value.',\n    type: 'function',\n    status: 'optional',\n  },\n  visible: {\n    doc: 'Control visibility directly by boolean value.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  animate: {\n    doc: 'Define if the content should animate during show/hide.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  keepInDOM: {\n    doc: \"Keep the content in the DOM, even if it's not visible. Can be used to let fields run validation.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  fieldPropsWhenHidden: {\n    doc: 'When visibility is hidden, and `keepInDOM` is true, pass these props to the children.',\n    type: 'various',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Define the type of element. Defaults to `div`. Only for when `animate` is true.',\n    type: 'string or React.Element',\n    status: 'optional',\n  },\n  children: {\n    doc: 'Contents.',\n    type: 'React.Node',\n    status: 'required',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,oBAA0C,GAAG;EACxDC,WAAW,EAAE;IACXC,GAAG,EAAE,2DAA2D;IAChEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,aAAa,EAAE;IACbH,GAAG,EAAE,6DAA6D;IAClEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,UAAU,EAAE;IACVJ,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,SAAS,EAAE;IACTL,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,QAAQ,EAAE;IACRN,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,SAAS,EAAE;IACTP,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,SAAS,EAAE;IACTR,GAAG,EAAE,uEAAuE;IAC5EC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,SAAS,EAAE;IACTT,GAAG,EAAE,+DAA+D;IACpEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,SAAS,EAAE;IACTV,GAAG,EAAE,+FAA+F;IACpGC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDS,OAAO,EAAE;IACPX,GAAG,EAAE,+CAA+C;IACpDC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDU,OAAO,EAAE;IACPZ,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDW,SAAS,EAAE;IACTb,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDY,oBAAoB,EAAE;IACpBd,GAAG,EAAE,uFAAuF;IAC5FC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDa,OAAO,EAAE;IACPf,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,yBAAyB;IAC/BC,MAAM,EAAE;EACV,CAAC;EACDc,QAAQ,EAAE;IACRhB,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC"}
+{"version":3,"file":"VisibilityDocs.js","names":["VisibilityProperties","pathDefined","doc","type","status","pathUndefined","pathTruthy","pathFalsy","pathTrue","pathFalse","visibleWhen","visibleWhenNot","inferData","visible","animate","keepInDOM","filterData","fieldPropsWhenHidden","element","children"],"sources":["../../../../../../src/extensions/forms/Form/Visibility/VisibilityDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const VisibilityProperties: PropertiesTableProps = {\n  pathDefined: {\n    doc: 'Given data context path must be defined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathUndefined: {\n    doc: 'Given data context path must be undefined to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTruthy: {\n    doc: 'Given data context path must be truthy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalsy: {\n    doc: 'Given data context path must be falsy to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathTrue: {\n    doc: 'Given data context path must be true to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  pathFalse: {\n    doc: 'Given data context path must be false to show children.',\n    type: 'string',\n    status: 'optional',\n  },\n  visibleWhen: {\n    doc: 'Provide a `path` and a `hasValue` property with the excepted value in order to show children. You can alternatively provide a `withValue` function that returns a boolean. The first parameter is the value of the path.',\n    type: 'object',\n    status: 'optional',\n  },\n  visibleWhenNot: {\n    doc: 'Same as `visibleWhen`, but with inverted logic.',\n    type: 'object',\n    status: 'optional',\n  },\n  inferData: {\n    doc: 'Will be called to decide by external logic, and show/hide contents based on the return value.',\n    type: 'function',\n    status: 'optional',\n  },\n  visible: {\n    doc: 'Control visibility directly by boolean value.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  animate: {\n    doc: 'Define if the content should animate during show/hide.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  keepInDOM: {\n    doc: \"Keep the content in the DOM, even if it's not visible. Can be used to let fields run validation.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  filterData: {\n    doc: 'Filter data based on provided criteria. More info about `filterData` can be found in the [Getting Started](/uilib/extensions/forms/getting-started/#filter-data) documentation.',\n    type: ['object', 'function'],\n    status: 'optional',\n  },\n  fieldPropsWhenHidden: {\n    doc: 'When visibility is hidden, and `keepInDOM` is true, pass these props to the children.',\n    type: 'various',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Define the type of element. Defaults to `div`. Only for when `animate` is true.',\n    type: 'string or React.Element',\n    status: 'optional',\n  },\n  children: {\n    doc: 'Contents.',\n    type: 'React.Node',\n    status: 'required',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,oBAA0C,GAAG;EACxDC,WAAW,EAAE;IACXC,GAAG,EAAE,2DAA2D;IAChEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,aAAa,EAAE;IACbH,GAAG,EAAE,6DAA6D;IAClEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,UAAU,EAAE;IACVJ,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,SAAS,EAAE;IACTL,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,QAAQ,EAAE;IACRN,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDK,SAAS,EAAE;IACTP,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDM,WAAW,EAAE;IACXR,GAAG,EAAE,0NAA0N;IAC/NC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDO,cAAc,EAAE;IACdT,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDQ,SAAS,EAAE;IACTV,GAAG,EAAE,+FAA+F;IACpGC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDS,OAAO,EAAE;IACPX,GAAG,EAAE,+CAA+C;IACpDC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDU,OAAO,EAAE;IACPZ,GAAG,EAAE,wDAAwD;IAC7DC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDW,SAAS,EAAE;IACTb,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDY,UAAU,EAAE;IACVd,GAAG,EAAE,iLAAiL;IACtLC,IAAI,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC;IAC5BC,MAAM,EAAE;EACV,CAAC;EACDa,oBAAoB,EAAE;IACpBf,GAAG,EAAE,uFAAuF;IAC5FC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDc,OAAO,EAAE;IACPhB,GAAG,EAAE,iFAAiF;IACtFC,IAAI,EAAE,yBAAyB;IAC/BC,MAAM,EAAE;EACV,CAAC;EACDe,QAAQ,EAAE;IACRjB,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV;AACF,CAAC"}

package/extensions/forms/Form/data-context/useData.d.ts

@@ -5,7 +5,7 @@ type PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}` ? Ke
 type PathType<T, P extends string> = P extends `/${infer Rest}` ? PathImpl<T, Rest> : never;
 type UseDataReturnUpdate<Data> = <P extends Path>(path: P, value: ((value: PathType<Data, P>) => unknown) | unknown) => void;
 export type UseDataReturnGetValue<Data> = <P extends Path>(path: P) => PathType<Data, P>;
-export type UseDataReturnFilterData<Data> = (filterDataHandler: FilterData) => Partial<Data>;
+export type UseDataReturnFilterData<Data> = (filterDataHandler: FilterData, data?: Data) => Partial<Data>;
 type UseDataReturn<Data> = {
     data: Data;
     set: (newData: Data) => void;

package/extensions/forms/Form/data-context/useData.js

@@ -13,8 +13,12 @@ export default function useData() {
   const [, forceUpdate] = useReducer(() => ({}), {});
   sharedDataRef.current = useSharedState(id, initialData, forceUpdate);
   const context = useContext(DataContext);
-  if (!id && context !== null && context !== void 0 && context.data) {
-    sharedDataRef.current.data = context.data;
+  if (!id) {
+    if (context !== null && context !== void 0 && context.data) {
+      sharedDataRef.current.data = context.data;
+    } else if (!(context !== null && context !== void 0 && context.hasContext)) {
+      throw new Error('useData needs to run inside DataContext (Form.Handler) or have a valid id');
+    }
   }
   const updateDataValue = context === null || context === void 0 ? void 0 : context.updateDataValue;
   const setData = context === null || context === void 0 ? void 0 : context.setData;
@@ -42,8 +46,8 @@ export default function useData() {
       }
     }
   }, [id, updateDataValue]);
-  const filterData = useCallback(filter => {
-    const data = sharedDataRef.current.data;
+  const filterData = useCallback(function (filter) {
+    let data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : sharedDataRef.current.data;
     if (id) {
       var _sharedAttachmentsRef, _sharedAttachmentsRef2;
       return (_sharedAttachmentsRef = sharedAttachmentsRef.current.data) === null || _sharedAttachmentsRef === void 0 ? void 0 : (_sharedAttachmentsRef2 = _sharedAttachmentsRef.filterDataHandler) === null || _sharedAttachmentsRef2 === void 0 ? void 0 : _sharedAttachmentsRef2.call(_sharedAttachmentsRef, data, filter);

package/extensions/forms/Form/data-context/useData.js.map

@@ -1 +1 @@
-{"version":3,"file":"useData.js","names":["useCallback","useContext","useMemo","useReducer","useRef","pointer","useSharedState","useMountEffect","DataContext","useData","id","arguments","length","undefined","initialData","sharedDataRef","sharedAttachmentsRef","forceUpdate","current","context","data","updateDataValue","setData","rerenderUseDataHook","setHandler","newData","update","updateHandler","path","value","existingData","existingValue","has","get","newValue","set","extend","filterData","filter","_sharedAttachmentsRef","_sharedAttachmentsRef2","filterDataHandler","call","getValue","hadInitialData"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useData.tsx"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport pointer from 'json-pointer'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport type { Path } from '../../types'\nimport DataContext, {\n  FilterData,\n  FilterDataHandler,\n} from '../../DataContext/Context'\n\ntype PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}`\n  ? Key extends keyof T\n    ? Rest extends ''\n      ? T[Key]\n      : PathImpl<T[Key], Rest>\n    : never\n  : T[P & keyof T]\n\ntype PathType<T, P extends string> = P extends `/${infer Rest}`\n  ? PathImpl<T, Rest>\n  : never\n\ntype UseDataReturnUpdate<Data> = <P extends Path>(\n  path: P,\n  value: ((value: PathType<Data, P>) => unknown) | unknown\n) => void\n\nexport type UseDataReturnGetValue<Data> = <P extends Path>(\n  path: P\n) => PathType<Data, P>\n\nexport type UseDataReturnFilterData<Data> = (\n  filterDataHandler: FilterData\n) => Partial<Data>\n\ntype UseDataReturn<Data> = {\n  data: Data\n  set: (newData: Data) => void\n  update: UseDataReturnUpdate<Data>\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n}\n\ntype SharedAttachment<Data> = {\n  rerenderUseDataHook: () => void\n  filterDataHandler?: FilterDataHandler<Data>\n}\n\n/**\n * Custom hook that provides form data management functionality.\n *\n * @template Data - The type of data being managed.\n * @param {SharedStateId} id - The identifier for the data.\n * @param {Data} initialData - The initial data value (optional).\n * @returns {UseDataReturn<Data>} An object containing the data and data management functions.\n */\nexport default function useData<Data>(\n  id: SharedStateId = undefined,\n  initialData: Data = undefined\n): UseDataReturn<Data> {\n  const sharedDataRef =\n    useRef<ReturnType<typeof useSharedState<Data>>>(null)\n  const sharedAttachmentsRef =\n    useRef<ReturnType<typeof useSharedState<SharedAttachment<Data>>>>(null)\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  sharedDataRef.current = useSharedState<Data>(\n    id,\n    initialData,\n    forceUpdate\n  )\n\n  // If no id is provided, use the context data\n  const context = useContext(DataContext)\n  if (!id && context?.data) {\n    sharedDataRef.current.data = context.data\n  }\n  const updateDataValue = context?.updateDataValue\n  const setData = context?.setData\n\n  sharedAttachmentsRef.current = useSharedState<SharedAttachment<Data>>(\n    id + '-attachments',\n    { rerenderUseDataHook: forceUpdate }\n  )\n\n  const setHandler = useCallback(\n    (newData: Data) => {\n      if (id) {\n        sharedDataRef.current.update(newData)\n      } else {\n        setData?.(newData)\n      }\n    },\n    [id, setData]\n  )\n\n  const updateHandler = useCallback<UseDataReturnUpdate<Data>>(\n    (path, value = undefined) => {\n      const existingData = sharedDataRef.current.data || ({} as Data)\n      const existingValue = pointer.has(existingData, path)\n        ? pointer.get(existingData, path)\n        : undefined\n\n      // get new value\n      const newValue =\n        typeof value === 'function' ? value(existingValue) : value\n\n      if (newValue !== existingValue) {\n        // update existing data\n        pointer.set(existingData, path, newValue)\n\n        // update provider\n        if (id) {\n          sharedDataRef.current.extend(existingData)\n        } else {\n          updateDataValue(path, newValue)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const filterData = useCallback<UseDataReturn<Data>['filterData']>(\n    (filter) => {\n      const data = sharedDataRef.current.data\n\n      if (id) {\n        return sharedAttachmentsRef.current.data?.filterDataHandler?.(\n          data,\n          filter\n        )\n      }\n\n      return context?.filterDataHandler(data, filter)\n    },\n    [context, id]\n  )\n\n  const getValue = useCallback<UseDataReturn<Data>['getValue']>((path) => {\n    if (pointer.has(sharedDataRef.current.data, path)) {\n      return pointer.get(sharedDataRef.current.data, path)\n    }\n\n    return undefined\n  }, [])\n\n  useMountEffect(() => {\n    if (id && !sharedDataRef.current.hadInitialData && initialData) {\n      sharedDataRef.current.extend(initialData)\n    }\n  })\n\n  const { data } = sharedDataRef.current\n\n  return useMemo(\n    () => ({\n      data,\n      update: updateHandler,\n      set: setHandler,\n      getValue,\n      filterData,\n    }),\n    [data, filterData, getValue, setHandler, updateHandler]\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"useData.js","names":["useCallback","useContext","useMemo","useReducer","useRef","pointer","useSharedState","useMountEffect","DataContext","useData","id","arguments","length","undefined","initialData","sharedDataRef","sharedAttachmentsRef","forceUpdate","current","context","data","hasContext","Error","updateDataValue","setData","rerenderUseDataHook","setHandler","newData","update","updateHandler","path","value","existingData","existingValue","has","get","newValue","set","extend","filterData","filter","_sharedAttachmentsRef","_sharedAttachmentsRef2","filterDataHandler","call","getValue","hadInitialData"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useData.tsx"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport pointer from 'json-pointer'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport type { Path } from '../../types'\nimport DataContext, {\n  FilterData,\n  FilterDataHandler,\n} from '../../DataContext/Context'\n\ntype PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}`\n  ? Key extends keyof T\n    ? Rest extends ''\n      ? T[Key]\n      : PathImpl<T[Key], Rest>\n    : never\n  : T[P & keyof T]\n\ntype PathType<T, P extends string> = P extends `/${infer Rest}`\n  ? PathImpl<T, Rest>\n  : never\n\ntype UseDataReturnUpdate<Data> = <P extends Path>(\n  path: P,\n  value: ((value: PathType<Data, P>) => unknown) | unknown\n) => void\n\nexport type UseDataReturnGetValue<Data> = <P extends Path>(\n  path: P\n) => PathType<Data, P>\n\nexport type UseDataReturnFilterData<Data> = (\n  filterDataHandler: FilterData,\n  data?: Data\n) => Partial<Data>\n\ntype UseDataReturn<Data> = {\n  data: Data\n  set: (newData: Data) => void\n  update: UseDataReturnUpdate<Data>\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n}\n\ntype SharedAttachment<Data> = {\n  rerenderUseDataHook: () => void\n  filterDataHandler?: FilterDataHandler<Data>\n}\n\n/**\n * Custom hook that provides form data management functionality.\n *\n * @template Data - The type of data being managed.\n * @param {SharedStateId} id - The identifier for the data.\n * @param {Data} initialData - The initial data value (optional).\n * @returns {UseDataReturn<Data>} An object containing the data and data management functions.\n */\nexport default function useData<Data>(\n  id: SharedStateId = undefined,\n  initialData: Data = undefined\n): UseDataReturn<Data> {\n  const sharedDataRef =\n    useRef<ReturnType<typeof useSharedState<Data>>>(null)\n  const sharedAttachmentsRef =\n    useRef<ReturnType<typeof useSharedState<SharedAttachment<Data>>>>(null)\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  sharedDataRef.current = useSharedState<Data>(\n    id,\n    initialData,\n    forceUpdate\n  )\n\n  // If no id is provided, use the context data\n  const context = useContext(DataContext)\n  if (!id) {\n    if (context?.data) {\n      sharedDataRef.current.data = context.data\n    } else if (!context?.hasContext) {\n      throw new Error(\n        'useData needs to run inside DataContext (Form.Handler) or have a valid id'\n      )\n    }\n  }\n  const updateDataValue = context?.updateDataValue\n  const setData = context?.setData\n\n  sharedAttachmentsRef.current = useSharedState<SharedAttachment<Data>>(\n    id + '-attachments',\n    { rerenderUseDataHook: forceUpdate }\n  )\n\n  const setHandler = useCallback(\n    (newData: Data) => {\n      if (id) {\n        sharedDataRef.current.update(newData)\n      } else {\n        setData?.(newData)\n      }\n    },\n    [id, setData]\n  )\n\n  const updateHandler = useCallback<UseDataReturnUpdate<Data>>(\n    (path, value = undefined) => {\n      const existingData = sharedDataRef.current.data || ({} as Data)\n      const existingValue = pointer.has(existingData, path)\n        ? pointer.get(existingData, path)\n        : undefined\n\n      // get new value\n      const newValue =\n        typeof value === 'function' ? value(existingValue) : value\n\n      if (newValue !== existingValue) {\n        // update existing data\n        pointer.set(existingData, path, newValue)\n\n        // update provider\n        if (id) {\n          sharedDataRef.current.extend(existingData)\n        } else {\n          updateDataValue(path, newValue)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const filterData = useCallback<UseDataReturn<Data>['filterData']>(\n    (filter, data = sharedDataRef.current.data) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.filterDataHandler?.(\n          data,\n          filter\n        )\n      }\n\n      return context?.filterDataHandler(data, filter)\n    },\n    [context, id]\n  )\n\n  const getValue = useCallback<UseDataReturn<Data>['getValue']>((path) => {\n    if (pointer.has(sharedDataRef.current.data, path)) {\n      return pointer.get(sharedDataRef.current.data, path)\n    }\n\n    return undefined\n  }, [])\n\n  useMountEffect(() => {\n    if (id && !sharedDataRef.current.hadInitialData && initialData) {\n      sharedDataRef.current.extend(initialData)\n    }\n  })\n\n  const { data } = sharedDataRef.current\n\n  return useMemo(\n    () => ({\n      data,\n      update: updateHandler,\n      set: setHandler,\n      getValue,\n      filterData,\n    }),\n    [data, filterData, getValue, setHandler, updateHandler]\n  )\n}\n"],"mappings":"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"}

package/extensions/forms/Form/data-context/useError.d.ts

@@ -2,6 +2,7 @@ import { SharedStateId } from '../../../../shared/helpers/useSharedState';
 import { ContextState } from '../../DataContext/Context';
 type UseDataReturn = {
     hasErrors: ContextState['hasErrors'];
+    hasFieldError: ContextState['hasFieldError'];
     setFormError: (error: Error) => void;
 };
 export default function useError(id?: SharedStateId): UseDataReturn;

package/extensions/forms/Form/data-context/useError.js

@@ -4,14 +4,15 @@ import { useCallback, useContext, useMemo, useRef } from 'react';
 import { useSharedState } from '../../../../shared/helpers/useSharedState';
 import DataContext from '../../DataContext/Context';
 export default function useError() {
-  var _sharedAttachmentsRef, _sharedAttachmentsRef2, _sharedAttachmentsRef3, _sharedAttachmentsRef4;
+  var _sharedAttachmentsRef, _sharedAttachmentsRef2, _sharedAttachmentsRef3, _sharedAttachmentsRef4, _sharedAttachmentsRef5, _sharedAttachmentsRef6;
   let id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : undefined;
   const sharedAttachmentsRef = useRef(null);
   sharedAttachmentsRef.current = useSharedState(id + '-attachments');
   const fallback = useCallback(() => false, []);
   const context = useContext(DataContext);
   const hasErrors = ((_sharedAttachmentsRef = sharedAttachmentsRef.current) === null || _sharedAttachmentsRef === void 0 ? void 0 : (_sharedAttachmentsRef2 = _sharedAttachmentsRef.data) === null || _sharedAttachmentsRef2 === void 0 ? void 0 : _sharedAttachmentsRef2.hasErrors) || !id && (context === null || context === void 0 ? void 0 : context.hasErrors) || fallback;
-  const setSubmitState = ((_sharedAttachmentsRef3 = sharedAttachmentsRef.current) === null || _sharedAttachmentsRef3 === void 0 ? void 0 : (_sharedAttachmentsRef4 = _sharedAttachmentsRef3.data) === null || _sharedAttachmentsRef4 === void 0 ? void 0 : _sharedAttachmentsRef4.setSubmitState) || !id && (context === null || context === void 0 ? void 0 : context.setSubmitState) || fallback;
+  const hasFieldError = ((_sharedAttachmentsRef3 = sharedAttachmentsRef.current) === null || _sharedAttachmentsRef3 === void 0 ? void 0 : (_sharedAttachmentsRef4 = _sharedAttachmentsRef3.data) === null || _sharedAttachmentsRef4 === void 0 ? void 0 : _sharedAttachmentsRef4.hasFieldError) || !id && (context === null || context === void 0 ? void 0 : context.hasFieldError) || fallback;
+  const setSubmitState = ((_sharedAttachmentsRef5 = sharedAttachmentsRef.current) === null || _sharedAttachmentsRef5 === void 0 ? void 0 : (_sharedAttachmentsRef6 = _sharedAttachmentsRef5.data) === null || _sharedAttachmentsRef6 === void 0 ? void 0 : _sharedAttachmentsRef6.setSubmitState) || !id && (context === null || context === void 0 ? void 0 : context.setSubmitState) || fallback;
   const setFormError = useCallback(error => {
     setSubmitState === null || setSubmitState === void 0 ? void 0 : setSubmitState({
       error
@@ -19,7 +20,8 @@ export default function useError() {
   }, [setSubmitState]);
   return useMemo(() => ({
     hasErrors,
+    hasFieldError,
     setFormError
-  }), [hasErrors, setFormError]);
+  }), [hasErrors, hasFieldError, setFormError]);
 }
 //# sourceMappingURL=useError.js.map

package/extensions/forms/Form/data-context/useError.js.map

@@ -1 +1 @@
-{"version":3,"file":"useError.js","names":["useCallback","useContext","useMemo","useRef","useSharedState","DataContext","useError","_sharedAttachmentsRef","_sharedAttachmentsRef2","_sharedAttachmentsRef3","_sharedAttachmentsRef4","id","arguments","length","undefined","sharedAttachmentsRef","current","fallback","context","hasErrors","data","setSubmitState","setFormError","error"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useError.tsx"],"sourcesContent":["import { useCallback, useContext, useMemo, useRef } from 'react'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport DataContext, { ContextState } from '../../DataContext/Context'\n\ntype UseDataReturn = {\n  hasErrors: ContextState['hasErrors']\n  setFormError: (error: Error) => void\n}\n\nexport default function useError(\n  id: SharedStateId = undefined\n): UseDataReturn {\n  const sharedAttachmentsRef = useRef(null)\n  sharedAttachmentsRef.current = useSharedState<UseDataReturn>(\n    id + '-attachments'\n  )\n\n  const fallback = useCallback(() => false, [])\n\n  // If no id is provided, use the context version\n  const context = useContext(DataContext)\n  const hasErrors =\n    sharedAttachmentsRef.current?.data?.hasErrors ||\n    (!id && context?.hasErrors) ||\n    fallback\n\n  // Error handling\n  const setSubmitState =\n    sharedAttachmentsRef.current?.data?.setSubmitState ||\n    (!id && context?.setSubmitState) ||\n    fallback\n  const setFormError = useCallback(\n    (error: Error) => {\n      setSubmitState?.({ error })\n      // console.error(error)\n    },\n    [setSubmitState]\n  )\n\n  return useMemo(\n    () => ({ hasErrors, setFormError }),\n    [hasErrors, setFormError]\n  )\n}\n"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,UAAU,EAAEC,OAAO,EAAEC,MAAM,QAAQ,OAAO;AAChE,SAEEC,cAAc,QACT,2CAA2C;AAClD,OAAOC,WAAW,MAAwB,2BAA2B;AAOrE,eAAe,SAASC,QAAQA,CAAA,EAEf;EAAA,IAAAC,qBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA;EAAA,IADfC,EAAiB,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGE,SAAS;EAE7B,MAAMC,oBAAoB,GAAGZ,MAAM,CAAC,IAAI,CAAC;EACzCY,oBAAoB,CAACC,OAAO,GAAGZ,cAAc,CAC3CO,EAAE,GAAG,cACP,CAAC;EAED,MAAMM,QAAQ,GAAGjB,WAAW,CAAC,MAAM,KAAK,EAAE,EAAE,CAAC;EAG7C,MAAMkB,OAAO,GAAGjB,UAAU,CAACI,WAAW,CAAC;EACvC,MAAMc,SAAS,GACb,EAAAZ,qBAAA,GAAAQ,oBAAoB,CAACC,OAAO,cAAAT,qBAAA,wBAAAC,sBAAA,GAA5BD,qBAAA,CAA8Ba,IAAI,cAAAZ,sBAAA,uBAAlCA,sBAAA,CAAoCW,SAAS,KAC5C,CAACR,EAAE,KAAIO,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEC,SAAS,CAAC,IAC3BF,QAAQ;EAGV,MAAMI,cAAc,GAClB,EAAAZ,sBAAA,GAAAM,oBAAoB,CAACC,OAAO,cAAAP,sBAAA,wBAAAC,sBAAA,GAA5BD,sBAAA,CAA8BW,IAAI,cAAAV,sBAAA,uBAAlCA,sBAAA,CAAoCW,cAAc,KACjD,CAACV,EAAE,KAAIO,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEG,cAAc,CAAC,IAChCJ,QAAQ;EACV,MAAMK,YAAY,GAAGtB,WAAW,CAC7BuB,KAAY,IAAK;IAChBF,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAG;MAAEE;IAAM,CAAC,CAAC;EAE7B,CAAC,EACD,CAACF,cAAc,CACjB,CAAC;EAED,OAAOnB,OAAO,CACZ,OAAO;IAAEiB,SAAS;IAAEG;EAAa,CAAC,CAAC,EACnC,CAACH,SAAS,EAAEG,YAAY,CAC1B,CAAC;AACH"}
+{"version":3,"file":"useError.js","names":["useCallback","useContext","useMemo","useRef","useSharedState","DataContext","useError","_sharedAttachmentsRef","_sharedAttachmentsRef2","_sharedAttachmentsRef3","_sharedAttachmentsRef4","_sharedAttachmentsRef5","_sharedAttachmentsRef6","id","arguments","length","undefined","sharedAttachmentsRef","current","fallback","context","hasErrors","data","hasFieldError","setSubmitState","setFormError","error"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useError.tsx"],"sourcesContent":["import { useCallback, useContext, useMemo, useRef } from 'react'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport DataContext, { ContextState } from '../../DataContext/Context'\n\ntype UseDataReturn = {\n  hasErrors: ContextState['hasErrors']\n  hasFieldError: ContextState['hasFieldError']\n  setFormError: (error: Error) => void\n}\n\nexport default function useError(\n  id: SharedStateId = undefined\n): UseDataReturn {\n  const sharedAttachmentsRef = useRef(null)\n  sharedAttachmentsRef.current = useSharedState<UseDataReturn>(\n    id + '-attachments'\n  )\n\n  const fallback = useCallback(() => false, [])\n\n  // If no id is provided, use the context version\n  const context = useContext(DataContext)\n  const hasErrors =\n    sharedAttachmentsRef.current?.data?.hasErrors ||\n    (!id && context?.hasErrors) ||\n    fallback\n  const hasFieldError =\n    sharedAttachmentsRef.current?.data?.hasFieldError ||\n    (!id && context?.hasFieldError) ||\n    fallback\n\n  // Error handling\n  const setSubmitState =\n    sharedAttachmentsRef.current?.data?.setSubmitState ||\n    (!id && context?.setSubmitState) ||\n    fallback\n  const setFormError = useCallback(\n    (error: Error) => {\n      setSubmitState?.({ error })\n    },\n    [setSubmitState]\n  )\n\n  return useMemo(\n    () => ({ hasErrors, hasFieldError, setFormError }),\n    [hasErrors, hasFieldError, setFormError]\n  )\n}\n"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,UAAU,EAAEC,OAAO,EAAEC,MAAM,QAAQ,OAAO;AAChE,SAEEC,cAAc,QACT,2CAA2C;AAClD,OAAOC,WAAW,MAAwB,2BAA2B;AAQrE,eAAe,SAASC,QAAQA,CAAA,EAEf;EAAA,IAAAC,qBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA,EAAAC,sBAAA;EAAA,IADfC,EAAiB,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGE,SAAS;EAE7B,MAAMC,oBAAoB,GAAGd,MAAM,CAAC,IAAI,CAAC;EACzCc,oBAAoB,CAACC,OAAO,GAAGd,cAAc,CAC3CS,EAAE,GAAG,cACP,CAAC;EAED,MAAMM,QAAQ,GAAGnB,WAAW,CAAC,MAAM,KAAK,EAAE,EAAE,CAAC;EAG7C,MAAMoB,OAAO,GAAGnB,UAAU,CAACI,WAAW,CAAC;EACvC,MAAMgB,SAAS,GACb,EAAAd,qBAAA,GAAAU,oBAAoB,CAACC,OAAO,cAAAX,qBAAA,wBAAAC,sBAAA,GAA5BD,qBAAA,CAA8Be,IAAI,cAAAd,sBAAA,uBAAlCA,sBAAA,CAAoCa,SAAS,KAC5C,CAACR,EAAE,KAAIO,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEC,SAAS,CAAC,IAC3BF,QAAQ;EACV,MAAMI,aAAa,GACjB,EAAAd,sBAAA,GAAAQ,oBAAoB,CAACC,OAAO,cAAAT,sBAAA,wBAAAC,sBAAA,GAA5BD,sBAAA,CAA8Ba,IAAI,cAAAZ,sBAAA,uBAAlCA,sBAAA,CAAoCa,aAAa,KAChD,CAACV,EAAE,KAAIO,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEG,aAAa,CAAC,IAC/BJ,QAAQ;EAGV,MAAMK,cAAc,GAClB,EAAAb,sBAAA,GAAAM,oBAAoB,CAACC,OAAO,cAAAP,sBAAA,wBAAAC,sBAAA,GAA5BD,sBAAA,CAA8BW,IAAI,cAAAV,sBAAA,uBAAlCA,sBAAA,CAAoCY,cAAc,KACjD,CAACX,EAAE,KAAIO,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEI,cAAc,CAAC,IAChCL,QAAQ;EACV,MAAMM,YAAY,GAAGzB,WAAW,CAC7B0B,KAAY,IAAK;IAChBF,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAG;MAAEE;IAAM,CAAC,CAAC;EAC7B,CAAC,EACD,CAACF,cAAc,CACjB,CAAC;EAED,OAAOtB,OAAO,CACZ,OAAO;IAAEmB,SAAS;IAAEE,aAAa;IAAEE;EAAa,CAAC,CAAC,EAClD,CAACJ,SAAS,EAAEE,aAAa,EAAEE,YAAY,CACzC,CAAC;AACH"}

package/extensions/forms/Form/index.d.ts

@@ -7,6 +7,7 @@ export { default as ButtonRow } from './ButtonRow';
 export { default as MainHeading } from './MainHeading';
 export { default as SubHeading } from './SubHeading';
 export { default as Visibility } from './Visibility';
+export { default as Section } from './Section';
 export { default as FieldProps } from './FieldProps';
 export { default as useData } from './data-context/useData';
 export { default as setData } from './data-context/setData';

package/extensions/forms/Form/index.js

@@ -7,6 +7,7 @@ export { default as ButtonRow } from './ButtonRow';
 export { default as MainHeading } from './MainHeading';
 export { default as SubHeading } from './SubHeading';
 export { default as Visibility } from './Visibility';
+export { default as Section } from './Section';
 export { default as FieldProps } from './FieldProps';
 export { default as useData } from './data-context/useData';
 export { default as setData } from './data-context/setData';

package/extensions/forms/Form/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","Handler","Element","Appearance","SubmitButton","SubmitIndicator","ButtonRow","MainHeading","SubHeading","Visibility","FieldProps","useData","setData","getData","useError","useTranslation","useLocale"],"sources":["../../../../../src/extensions/forms/Form/index.ts"],"sourcesContent":["export { default as Handler } from './Handler'\nexport { default as Element } from './Element'\nexport { default as Appearance } from './Appearance'\nexport { default as SubmitButton } from './SubmitButton'\nexport { default as SubmitIndicator } from './SubmitIndicator'\nexport { default as ButtonRow } from './ButtonRow'\nexport { default as MainHeading } from './MainHeading'\nexport { default as SubHeading } from './SubHeading'\nexport { default as Visibility } from './Visibility'\nexport { default as FieldProps } from './FieldProps'\nexport { default as useData } from './data-context/useData'\nexport { default as setData } from './data-context/setData'\nexport { default as getData } from './data-context/getData'\nexport { default as useError } from './data-context/useError'\nexport { default as useTranslation } from '../hooks/useTranslation'\n\n/**\n * Can be removed in v11\n * @deprecated Use `useTranslation` instead\n */\nexport { default as useLocale } from '../hooks/useTranslation'\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,OAAO,QAAQ,WAAW;AAC9C,SAASD,OAAO,IAAIE,OAAO,QAAQ,WAAW;AAC9C,SAASF,OAAO,IAAIG,UAAU,QAAQ,cAAc;AACpD,SAASH,OAAO,IAAII,YAAY,QAAQ,gBAAgB;AACxD,SAASJ,OAAO,IAAIK,eAAe,QAAQ,mBAAmB;AAC9D,SAASL,OAAO,IAAIM,SAAS,QAAQ,aAAa;AAClD,SAASN,OAAO,IAAIO,WAAW,QAAQ,eAAe;AACtD,SAASP,OAAO,IAAIQ,UAAU,QAAQ,cAAc;AACpD,SAASR,OAAO,IAAIS,UAAU,QAAQ,cAAc;AACpD,SAAST,OAAO,IAAIU,UAAU,QAAQ,cAAc;AACpD,SAASV,OAAO,IAAIW,OAAO,QAAQ,wBAAwB;AAC3D,SAASX,OAAO,IAAIY,OAAO,QAAQ,wBAAwB;AAC3D,SAASZ,OAAO,IAAIa,OAAO,QAAQ,wBAAwB;AAC3D,SAASb,OAAO,IAAIc,QAAQ,QAAQ,yBAAyB;AAC7D,SAASd,OAAO,IAAIe,cAAc,QAAQ,yBAAyB;AAMnE,SAASf,OAAO,IAAIgB,SAAS,QAAQ,yBAAyB"}
+{"version":3,"file":"index.js","names":["default","Handler","Element","Appearance","SubmitButton","SubmitIndicator","ButtonRow","MainHeading","SubHeading","Visibility","Section","FieldProps","useData","setData","getData","useError","useTranslation","useLocale"],"sources":["../../../../../src/extensions/forms/Form/index.ts"],"sourcesContent":["export { default as Handler } from './Handler'\nexport { default as Element } from './Element'\nexport { default as Appearance } from './Appearance'\nexport { default as SubmitButton } from './SubmitButton'\nexport { default as SubmitIndicator } from './SubmitIndicator'\nexport { default as ButtonRow } from './ButtonRow'\nexport { default as MainHeading } from './MainHeading'\nexport { default as SubHeading } from './SubHeading'\nexport { default as Visibility } from './Visibility'\nexport { default as Section } from './Section'\nexport { default as FieldProps } from './FieldProps'\nexport { default as useData } from './data-context/useData'\nexport { default as setData } from './data-context/setData'\nexport { default as getData } from './data-context/getData'\nexport { default as useError } from './data-context/useError'\nexport { default as useTranslation } from '../hooks/useTranslation'\n\n/**\n * Can be removed in v11\n * @deprecated Use `useTranslation` instead\n */\nexport { default as useLocale } from '../hooks/useTranslation'\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,OAAO,QAAQ,WAAW;AAC9C,SAASD,OAAO,IAAIE,OAAO,QAAQ,WAAW;AAC9C,SAASF,OAAO,IAAIG,UAAU,QAAQ,cAAc;AACpD,SAASH,OAAO,IAAII,YAAY,QAAQ,gBAAgB;AACxD,SAASJ,OAAO,IAAIK,eAAe,QAAQ,mBAAmB;AAC9D,SAASL,OAAO,IAAIM,SAAS,QAAQ,aAAa;AAClD,SAASN,OAAO,IAAIO,WAAW,QAAQ,eAAe;AACtD,SAASP,OAAO,IAAIQ,UAAU,QAAQ,cAAc;AACpD,SAASR,OAAO,IAAIS,UAAU,QAAQ,cAAc;AACpD,SAAST,OAAO,IAAIU,OAAO,QAAQ,WAAW;AAC9C,SAASV,OAAO,IAAIW,UAAU,QAAQ,cAAc;AACpD,SAASX,OAAO,IAAIY,OAAO,QAAQ,wBAAwB;AAC3D,SAASZ,OAAO,IAAIa,OAAO,QAAQ,wBAAwB;AAC3D,SAASb,OAAO,IAAIc,OAAO,QAAQ,wBAAwB;AAC3D,SAASd,OAAO,IAAIe,QAAQ,QAAQ,yBAAyB;AAC7D,SAASf,OAAO,IAAIgB,cAAc,QAAQ,yBAAyB;AAMnE,SAAShB,OAAO,IAAIiB,SAAS,QAAQ,yBAAyB"}

package/extensions/forms/Iterate/AnimatedContainer/ElementBlock.d.ts

@@ -1,11 +1,18 @@
 import { Props as FlexContainerProps } from '../../../../components/flex/Container';
 import { ContainerMode } from '../Array/types';
+export type ElementSectionProps = {
+    /**
+     * Defines the variant of the ViewContainer or EditContainer. Can be `outline`.
+     * Defaults to `outline`.
+     */
+    variant?: 'outline' | 'basic';
+};
 export type Props = {
     mode: ContainerMode;
     open?: boolean | undefined;
     ariaLabel?: string;
     openDelay?: number;
-};
+} & ElementSectionProps;
 declare function ElementBlock(props: Props & FlexContainerProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ElementBlock {
     var _supportsSpacingProps: boolean;

package/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js

@@ -2,7 +2,7 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["mode", "open", "ariaLabel", "onAnimationEnd", "className", "children", "openDelay"];
+const _excluded = ["mode", "open", "ariaLabel", "onAnimationEnd", "className", "children", "openDelay", "variant"];
 import React, { useCallback, useContext, useEffect, useReducer, useRef } from 'react';
 import classnames from 'classnames';
 import { Flex, HeightAnimation } from '../../../../components';
@@ -35,7 +35,8 @@ function ElementBlock(props) {
       onAnimationEnd,
       className,
       children,
-      openDelay = 100
+      openDelay = 100,
+      variant = 'outline'
     } = props,
     restProps = _objectWithoutProperties(props, _excluded);
   const openRef = useRef(open !== null && open !== void 0 ? open : containerMode === mode && !isNew);
@@ -102,7 +103,7 @@ function ElementBlock(props) {
       handleRemoveBlock
     }
   }, React.createElement(HeightAnimation, {
-    className: classnames('dnb-forms-iterate-block', className, isNew && 'dnb-forms-iterate-block--new', contextRef.current.hasErrorAndShowIt && 'dnb-forms-iterate-block--error'),
+    className: classnames('dnb-forms-iterate-block', className, variant && `dnb-forms-iterate-block--variant-${variant}`, isNew && 'dnb-forms-iterate-block--new', contextRef.current.hasErrorAndShowIt && 'dnb-forms-iterate-block--error'),
     open: openRef.current,
     onAnimationEnd: handleAnimationEnd,
     duration: 450,

package/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElementBlock.js","names":["React","useCallback","useContext","useEffect","useReducer","useRef","classnames","Flex","HeightAnimation","IterateElementContext","ElementBlockContext","FieldBoundaryContext","ElementBlock","props","forceUpdate","contextRef","current","hasError","hasErrorAndShowIt","containerMode","handleRemove","switchContainerMode","isNew","mode","open","ariaLabel","onAnimationEnd","className","children","openDelay","restProps","_objectWithoutProperties","_excluded","openRef","isRemoving","setOpenState","setTimeout","handleAnimationEnd","state","preventFocusOnErrorOpening","_contextRef$current","_contextRef$current$e","_contextRef$current$e2","_contextRef$current$e3","elementRef","focus","call","window","requestAnimationFrame","_document$activeEleme","document","activeElement","closest","_contextRef$current2","elements","containerRef","querySelectorAll","length","e","_contextRef$current3","_contextRef$current3$","fulfillRemove","handleRemoveBlock","keepItems","createElement","Provider","value","duration","keepInDOM","Stack","_extends","element","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/AnimatedContainer/ElementBlock.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useReducer,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { Flex, HeightAnimation } from '../../../../components'\nimport IterateElementContext, {\n  IterateElementContextState,\n} from '../IterateElementContext'\nimport ElementBlockContext from './ElementBlockContext'\nimport FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { ContainerMode } from '../Array/types'\n\nexport type Props = {\n  mode: ContainerMode\n  open?: boolean | undefined\n  ariaLabel?: string\n  openDelay?: number\n}\n\nfunction ElementBlock(props: Props & FlexContainerProps) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const contextRef = useRef<\n    IterateElementContextState & {\n      hasError?: boolean\n      hasErrorAndShowIt?: boolean\n    }\n  >()\n  contextRef.current = useContext(IterateElementContext) || {}\n\n  const { hasError, hasErrorAndShowIt } =\n    useContext(FieldBoundaryContext) || {}\n  contextRef.current.hasError = hasError\n  contextRef.current.hasErrorAndShowIt = hasErrorAndShowIt\n\n  // - Set the container mode to \"edit\" if we have an error\n  if (hasErrorAndShowIt) {\n    contextRef.current.containerMode = 'edit'\n  }\n\n  const { handleRemove, switchContainerMode, containerMode, isNew } =\n    contextRef.current\n\n  const {\n    mode,\n    open,\n    ariaLabel,\n    onAnimationEnd,\n    className,\n    children,\n    openDelay = 100,\n    ...restProps\n  } = props\n\n  const openRef = useRef(open ?? (containerMode === mode && !isNew))\n  const isRemoving = useRef(false)\n\n  const setOpenState = useCallback((open: boolean) => {\n    openRef.current = open\n    forceUpdate()\n  }, [])\n\n  useEffect(() => {\n    if (!isRemoving.current) {\n      // - Set the open state, if it's controlled\n      if (typeof open !== 'undefined') {\n        setOpenState(open)\n      } else {\n        // - Open the block with animation, if it's in the right mode\n        if (openRef.current !== (containerMode === mode)) {\n          if (isNew) {\n            setTimeout(() => {\n              setOpenState(containerMode === mode)\n            }, openDelay) // in order to apply the animation\n          } else {\n            setOpenState(containerMode === mode)\n          }\n        }\n      }\n    }\n  }, [containerMode, isNew, mode, open, openDelay, setOpenState])\n\n  // - Remove the block with animation, if it's in the right mode\n  const handleAnimationEnd = useCallback(\n    (state) => {\n      // - Keep the block open if we have an error\n      if (contextRef.current.hasErrorAndShowIt) {\n        switchContainerMode('edit')\n      }\n\n      const preventFocusOnErrorOpening =\n        !contextRef.current.hasErrorAndShowIt\n      if (preventFocusOnErrorOpening) {\n        if (state === 'opened') {\n          contextRef.current?.elementRef?.current?.focus?.()\n        } else {\n          // Wait until the element is removed, then check if we can set focus\n          window.requestAnimationFrame(() => {\n            // try to focus on the second last element\n            try {\n              if (\n                // But not when we focus is already inside our element\n                !document.activeElement?.closest(\n                  '.dnb-forms-iterate__element'\n                )\n              ) {\n                const elements =\n                  contextRef.current?.containerRef.current.querySelectorAll<HTMLDivElement>(\n                    '.dnb-forms-iterate__element'\n                  )\n                elements[elements.length - 1].focus()\n              }\n            } catch (e) {\n              /**/\n            }\n          })\n        }\n      }\n\n      if (!openRef.current && isRemoving.current) {\n        isRemoving.current = false\n        contextRef.current?.fulfillRemove?.()\n      }\n\n      onAnimationEnd?.(state)\n    },\n    [onAnimationEnd, switchContainerMode]\n  )\n  const handleRemoveBlock = useCallback(() => {\n    isRemoving.current = true\n    handleRemove?.({ keepItems: true })\n    setOpenState(false)\n  }, [handleRemove, setOpenState])\n\n  return (\n    <ElementBlockContext.Provider value={{ handleRemoveBlock }}>\n      <HeightAnimation\n        className={classnames(\n          'dnb-forms-iterate-block',\n          isNew && 'dnb-forms-iterate-block--new',\n          contextRef.current.hasErrorAndShowIt &&\n            'dnb-forms-iterate-block--error',\n          className\n        )}\n        open={openRef.current}\n        onAnimationEnd={handleAnimationEnd}\n        duration={450}\n        keepInDOM // Ensure fields get mounted so they will sync with the data context\n      >\n        <Flex.Stack\n          className=\"dnb-forms-iterate-block__inner\"\n          {...restProps}\n          element=\"section\"\n          aria-label={ariaLabel}\n        >\n          {children}\n        </Flex.Stack>\n      </HeightAnimation>\n    </ElementBlockContext.Provider>\n  )\n}\n\nElementBlock._supportsSpacingProps = true\nexport default ElementBlock\n"],"mappings":"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"}
+{"version":3,"file":"ElementBlock.js","names":["React","useCallback","useContext","useEffect","useReducer","useRef","classnames","Flex","HeightAnimation","IterateElementContext","ElementBlockContext","FieldBoundaryContext","ElementBlock","props","forceUpdate","contextRef","current","hasError","hasErrorAndShowIt","containerMode","handleRemove","switchContainerMode","isNew","mode","open","ariaLabel","onAnimationEnd","className","children","openDelay","variant","restProps","_objectWithoutProperties","_excluded","openRef","isRemoving","setOpenState","setTimeout","handleAnimationEnd","state","preventFocusOnErrorOpening","_contextRef$current","_contextRef$current$e","_contextRef$current$e2","_contextRef$current$e3","elementRef","focus","call","window","requestAnimationFrame","_document$activeEleme","document","activeElement","closest","_contextRef$current2","elements","containerRef","querySelectorAll","length","e","_contextRef$current3","_contextRef$current3$","fulfillRemove","handleRemoveBlock","keepItems","createElement","Provider","value","duration","keepInDOM","Stack","_extends","element","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/AnimatedContainer/ElementBlock.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useReducer,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { Flex, HeightAnimation } from '../../../../components'\nimport IterateElementContext, {\n  IterateElementContextState,\n} from '../IterateElementContext'\nimport ElementBlockContext from './ElementBlockContext'\nimport FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { ContainerMode } from '../Array/types'\n\nexport type ElementSectionProps = {\n  /**\n   * Defines the variant of the ViewContainer or EditContainer. Can be `outline`.\n   * Defaults to `outline`.\n   */\n  variant?: 'outline' | 'basic'\n}\n\nexport type Props = {\n  mode: ContainerMode\n  open?: boolean | undefined\n  ariaLabel?: string\n  openDelay?: number\n} & ElementSectionProps\n\nfunction ElementBlock(props: Props & FlexContainerProps) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const contextRef = useRef<\n    IterateElementContextState & {\n      hasError?: boolean\n      hasErrorAndShowIt?: boolean\n    }\n  >()\n  contextRef.current = useContext(IterateElementContext) || {}\n\n  const { hasError, hasErrorAndShowIt } =\n    useContext(FieldBoundaryContext) || {}\n  contextRef.current.hasError = hasError\n  contextRef.current.hasErrorAndShowIt = hasErrorAndShowIt\n\n  // - Set the container mode to \"edit\" if we have an error\n  if (hasErrorAndShowIt) {\n    contextRef.current.containerMode = 'edit'\n  }\n\n  const { handleRemove, switchContainerMode, containerMode, isNew } =\n    contextRef.current\n\n  const {\n    mode,\n    open,\n    ariaLabel,\n    onAnimationEnd,\n    className,\n    children,\n    openDelay = 100,\n    variant = 'outline',\n    ...restProps\n  } = props\n\n  const openRef = useRef(open ?? (containerMode === mode && !isNew))\n  const isRemoving = useRef(false)\n\n  const setOpenState = useCallback((open: boolean) => {\n    openRef.current = open\n    forceUpdate()\n  }, [])\n\n  useEffect(() => {\n    if (!isRemoving.current) {\n      // - Set the open state, if it's controlled\n      if (typeof open !== 'undefined') {\n        setOpenState(open)\n      } else {\n        // - Open the block with animation, if it's in the right mode\n        if (openRef.current !== (containerMode === mode)) {\n          if (isNew) {\n            setTimeout(() => {\n              setOpenState(containerMode === mode)\n            }, openDelay) // in order to apply the animation\n          } else {\n            setOpenState(containerMode === mode)\n          }\n        }\n      }\n    }\n  }, [containerMode, isNew, mode, open, openDelay, setOpenState])\n\n  // - Remove the block with animation, if it's in the right mode\n  const handleAnimationEnd = useCallback(\n    (state) => {\n      // - Keep the block open if we have an error\n      if (contextRef.current.hasErrorAndShowIt) {\n        switchContainerMode('edit')\n      }\n\n      const preventFocusOnErrorOpening =\n        !contextRef.current.hasErrorAndShowIt\n      if (preventFocusOnErrorOpening) {\n        if (state === 'opened') {\n          contextRef.current?.elementRef?.current?.focus?.()\n        } else {\n          // Wait until the element is removed, then check if we can set focus\n          window.requestAnimationFrame(() => {\n            // try to focus on the second last element\n            try {\n              if (\n                // But not when we focus is already inside our element\n                !document.activeElement?.closest(\n                  '.dnb-forms-iterate__element'\n                )\n              ) {\n                const elements =\n                  contextRef.current?.containerRef.current.querySelectorAll<HTMLDivElement>(\n                    '.dnb-forms-iterate__element'\n                  )\n                elements[elements.length - 1].focus()\n              }\n            } catch (e) {\n              /**/\n            }\n          })\n        }\n      }\n\n      if (!openRef.current && isRemoving.current) {\n        isRemoving.current = false\n        contextRef.current?.fulfillRemove?.()\n      }\n\n      onAnimationEnd?.(state)\n    },\n    [onAnimationEnd, switchContainerMode]\n  )\n  const handleRemoveBlock = useCallback(() => {\n    isRemoving.current = true\n    handleRemove?.({ keepItems: true })\n    setOpenState(false)\n  }, [handleRemove, setOpenState])\n\n  return (\n    <ElementBlockContext.Provider value={{ handleRemoveBlock }}>\n      <HeightAnimation\n        className={classnames(\n          'dnb-forms-iterate-block',\n          variant && `dnb-forms-iterate-block--variant-${variant}`,\n          isNew && 'dnb-forms-iterate-block--new',\n          contextRef.current.hasErrorAndShowIt &&\n            'dnb-forms-iterate-block--error',\n          className\n        )}\n        open={openRef.current}\n        onAnimationEnd={handleAnimationEnd}\n        duration={450}\n        keepInDOM // Ensure fields get mounted so they will sync with the data context\n      >\n        <Flex.Stack\n          className=\"dnb-forms-iterate-block__inner\"\n          {...restProps}\n          element=\"section\"\n          aria-label={ariaLabel}\n        >\n          {children}\n        </Flex.Stack>\n      </HeightAnimation>\n    </ElementBlockContext.Provider>\n  )\n}\n\nElementBlock._supportsSpacingProps = true\nexport default ElementBlock\n"],"mappings":"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"}

package/extensions/forms/Iterate/EditContainer/EditContainer.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import { Props as FlexContainerProps } from '../../../../components/flex/Container';
+import { ElementSectionProps } from '../AnimatedContainer/ElementBlock';
 export type Props = {
     /**
      * The title of the EditContainer.
@@ -20,7 +21,7 @@ export type Props = {
      */
     toolbar?: React.ReactNode;
 };
-export type AllProps = Props & FlexContainerProps;
+export type AllProps = Props & FlexContainerProps & ElementSectionProps;
 declare function EditContainer(props: AllProps): import("react/jsx-runtime").JSX.Element;
 declare namespace EditContainer {
     var _supportsSpacingProps: boolean;

package/extensions/forms/Iterate/EditContainer/EditContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditContainer.js","names":["React","useContext","useEffect","useMemo","useRef","classnames","convertJsxToString","Lead","IterateElementContext","EditToolbarTools","ElementBlock","Toolbar","EditContainer","props","createElement","EditContainerWithoutToolbar","_extends","toolbar","_Toolbar","iterateElementContext","containerMode","isNew","_ref","children","className","title","titleWhenNew","restProps","_objectWithoutProperties","_excluded","wasNewRef","current","blockTitle","ariaLabel","mode","size","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditContainer.tsx"],"sourcesContent":["import React, { useContext, useEffect, useMemo, useRef } from 'react'\nimport classnames from 'classnames'\nimport { convertJsxToString } from '../../../../shared/component-helper'\nimport { Lead } from '../../../../elements'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport IterateElementContext from '../IterateElementContext'\nimport EditToolbarTools from './EditToolbarTools'\nimport ElementBlock from '../AnimatedContainer/ElementBlock'\nimport Toolbar from '../Toolbar'\n\nexport type Props = {\n  /**\n   * The title of the EditContainer.\n   */\n  title?: React.ReactNode\n\n  /**\n   * The title for a new item show within the EditContainer.\n   */\n  titleWhenNew?: React.ReactNode\n\n  /**\n   * If the EditContainer is open or not.\n   * Used internally.\n   */\n  open?: boolean\n\n  /**\n   * The toolbar to be shown in the EditContainer.\n   * Used internally.\n   */\n  toolbar?: React.ReactNode\n}\n\nexport type AllProps = Props & FlexContainerProps\n\nexport default function EditContainer(props: AllProps) {\n  return (\n    <EditContainerWithoutToolbar\n      toolbar={\n        <Toolbar>\n          <EditToolbarTools />\n        </Toolbar>\n      }\n      {...props}\n    />\n  )\n}\n\nexport function EditContainerWithoutToolbar(\n  props: Props & FlexContainerProps & { toolbar?: React.ReactNode }\n) {\n  const iterateElementContext = useContext(IterateElementContext)\n  const { containerMode, isNew } = iterateElementContext ?? {}\n\n  const {\n    children,\n    className,\n    title,\n    titleWhenNew,\n    toolbar,\n    ...restProps\n  } = props || {}\n\n  const wasNewRef = useRef<unknown>(isNew)\n\n  useEffect(() => {\n    if (containerMode === 'view') {\n      wasNewRef.current = false\n    }\n  }, [isNew, containerMode])\n\n  const blockTitle =\n    wasNewRef.current && titleWhenNew ? titleWhenNew : title\n  const ariaLabel = useMemo(\n    () => convertJsxToString(blockTitle),\n    [blockTitle]\n  )\n\n  return (\n    <ElementBlock\n      mode=\"edit\"\n      className={classnames('dnb-forms-iterate-edit-block', className)}\n      ariaLabel={ariaLabel}\n      {...restProps}\n    >\n      {blockTitle && <Lead size=\"basis\">{blockTitle}</Lead>}\n      {children}\n      {toolbar}\n    </ElementBlock>\n  )\n}\n\nEditContainer._supportsSpacingProps = true\nEditContainerWithoutToolbar._supportsSpacingProps = true\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,OAAO;AACrE,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,kBAAkB,QAAQ,qCAAqC;AACxE,SAASC,IAAI,QAAQ,sBAAsB;AAE3C,OAAOC,qBAAqB,MAAM,0BAA0B;AAC5D,OAAOC,gBAAgB,MAAM,oBAAoB;AACjD,OAAOC,YAAY,MAAM,mCAAmC;AAC5D,OAAOC,OAAO,MAAM,YAAY;AA4BhC,eAAe,SAASC,aAAaA,CAACC,KAAe,EAAE;EACrD,OACEb,KAAA,CAAAc,aAAA,CAACC,2BAA2B,EAAAC,QAAA;IAC1BC,OAAO,EAAAC,QAAA,KAAAA,QAAA,GACLlB,KAAA,CAAAc,aAAA,CAACH,OAAO,QACNX,KAAA,CAAAc,aAAA,CAACL,gBAAgB,MAAE,CACZ,CAAC;EACX,GACGI,KAAK,CACV,CAAC;AAEN;AAEA,OAAO,SAASE,2BAA2BA,CACzCF,KAAiE,EACjE;EACA,MAAMM,qBAAqB,GAAGlB,UAAU,CAACO,qBAAqB,CAAC;EAC/D,MAAM;IAAEY,aAAa;IAAEC;EAAM,CAAC,GAAGF,qBAAqB,aAArBA,qBAAqB,cAArBA,qBAAqB,GAAI,CAAC,CAAC;EAE5D,MAAAG,IAAA,GAOIT,KAAK,IAAI,CAAC,CAAC;IAPT;MACJU,QAAQ;MACRC,SAAS;MACTC,KAAK;MACLC,YAAY;MACZT;IAEF,CAAC,GAAAK,IAAA;IADIK,SAAS,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA;EAGd,MAAMC,SAAS,GAAG1B,MAAM,CAAUiB,KAAK,CAAC;EAExCnB,SAAS,CAAC,MAAM;IACd,IAAIkB,aAAa,KAAK,MAAM,EAAE;MAC5BU,SAAS,CAACC,OAAO,GAAG,KAAK;IAC3B;EACF,CAAC,EAAE,CAACV,KAAK,EAAED,aAAa,CAAC,CAAC;EAE1B,MAAMY,UAAU,GACdF,SAAS,CAACC,OAAO,IAAIL,YAAY,GAAGA,YAAY,GAAGD,KAAK;EAC1D,MAAMQ,SAAS,GAAG9B,OAAO,CACvB,MAAMG,kBAAkB,CAAC0B,UAAU,CAAC,EACpC,CAACA,UAAU,CACb,CAAC;EAED,OACEhC,KAAA,CAAAc,aAAA,CAACJ,YAAY,EAAAM,QAAA;IACXkB,IAAI,EAAC,MAAM;IACXV,SAAS,EAAEnB,UAAU,CAAC,8BAA8B,EAAEmB,SAAS,CAAE;IACjES,SAAS,EAAEA;EAAU,GACjBN,SAAS,GAEZK,UAAU,IAAIhC,KAAA,CAAAc,aAAA,CAACP,IAAI;IAAC4B,IAAI,EAAC;EAAO,GAAEH,UAAiB,CAAC,EACpDT,QAAQ,EACRN,OACW,CAAC;AAEnB;AAEAL,aAAa,CAACwB,qBAAqB,GAAG,IAAI;AAC1CrB,2BAA2B,CAACqB,qBAAqB,GAAG,IAAI"}
+{"version":3,"file":"EditContainer.js","names":["React","useContext","useEffect","useMemo","useRef","classnames","convertJsxToString","Lead","IterateElementContext","EditToolbarTools","ElementBlock","Toolbar","EditContainer","props","createElement","EditContainerWithoutToolbar","_extends","toolbar","_Toolbar","iterateElementContext","containerMode","isNew","_ref","children","className","title","titleWhenNew","restProps","_objectWithoutProperties","_excluded","wasNewRef","current","blockTitle","ariaLabel","mode","size","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditContainer.tsx"],"sourcesContent":["import React, { useContext, useEffect, useMemo, useRef } from 'react'\nimport classnames from 'classnames'\nimport { convertJsxToString } from '../../../../shared/component-helper'\nimport { Lead } from '../../../../elements'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport IterateElementContext from '../IterateElementContext'\nimport EditToolbarTools from './EditToolbarTools'\nimport ElementBlock, {\n  ElementSectionProps,\n} from '../AnimatedContainer/ElementBlock'\nimport Toolbar from '../Toolbar'\n\nexport type Props = {\n  /**\n   * The title of the EditContainer.\n   */\n  title?: React.ReactNode\n\n  /**\n   * The title for a new item show within the EditContainer.\n   */\n  titleWhenNew?: React.ReactNode\n\n  /**\n   * If the EditContainer is open or not.\n   * Used internally.\n   */\n  open?: boolean\n\n  /**\n   * The toolbar to be shown in the EditContainer.\n   * Used internally.\n   */\n  toolbar?: React.ReactNode\n}\n\nexport type AllProps = Props & FlexContainerProps & ElementSectionProps\n\nexport default function EditContainer(props: AllProps) {\n  return (\n    <EditContainerWithoutToolbar\n      toolbar={\n        <Toolbar>\n          <EditToolbarTools />\n        </Toolbar>\n      }\n      {...props}\n    />\n  )\n}\n\nexport function EditContainerWithoutToolbar(\n  props: Props & FlexContainerProps & { toolbar?: React.ReactNode }\n) {\n  const iterateElementContext = useContext(IterateElementContext)\n  const { containerMode, isNew } = iterateElementContext ?? {}\n\n  const {\n    children,\n    className,\n    title,\n    titleWhenNew,\n    toolbar,\n    ...restProps\n  } = props || {}\n\n  const wasNewRef = useRef<unknown>(isNew)\n\n  useEffect(() => {\n    if (containerMode === 'view') {\n      wasNewRef.current = false\n    }\n  }, [isNew, containerMode])\n\n  const blockTitle =\n    wasNewRef.current && titleWhenNew ? titleWhenNew : title\n  const ariaLabel = useMemo(\n    () => convertJsxToString(blockTitle),\n    [blockTitle]\n  )\n\n  return (\n    <ElementBlock\n      mode=\"edit\"\n      className={classnames('dnb-forms-iterate-edit-block', className)}\n      ariaLabel={ariaLabel}\n      {...restProps}\n    >\n      {blockTitle && <Lead size=\"basis\">{blockTitle}</Lead>}\n      {children}\n      {toolbar}\n    </ElementBlock>\n  )\n}\n\nEditContainer._supportsSpacingProps = true\nEditContainerWithoutToolbar._supportsSpacingProps = true\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,OAAO;AACrE,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,kBAAkB,QAAQ,qCAAqC;AACxE,SAASC,IAAI,QAAQ,sBAAsB;AAE3C,OAAOC,qBAAqB,MAAM,0BAA0B;AAC5D,OAAOC,gBAAgB,MAAM,oBAAoB;AACjD,OAAOC,YAAY,MAEZ,mCAAmC;AAC1C,OAAOC,OAAO,MAAM,YAAY;AA4BhC,eAAe,SAASC,aAAaA,CAACC,KAAe,EAAE;EACrD,OACEb,KAAA,CAAAc,aAAA,CAACC,2BAA2B,EAAAC,QAAA;IAC1BC,OAAO,EAAAC,QAAA,KAAAA,QAAA,GACLlB,KAAA,CAAAc,aAAA,CAACH,OAAO,QACNX,KAAA,CAAAc,aAAA,CAACL,gBAAgB,MAAE,CACZ,CAAC;EACX,GACGI,KAAK,CACV,CAAC;AAEN;AAEA,OAAO,SAASE,2BAA2BA,CACzCF,KAAiE,EACjE;EACA,MAAMM,qBAAqB,GAAGlB,UAAU,CAACO,qBAAqB,CAAC;EAC/D,MAAM;IAAEY,aAAa;IAAEC;EAAM,CAAC,GAAGF,qBAAqB,aAArBA,qBAAqB,cAArBA,qBAAqB,GAAI,CAAC,CAAC;EAE5D,MAAAG,IAAA,GAOIT,KAAK,IAAI,CAAC,CAAC;IAPT;MACJU,QAAQ;MACRC,SAAS;MACTC,KAAK;MACLC,YAAY;MACZT;IAEF,CAAC,GAAAK,IAAA;IADIK,SAAS,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA;EAGd,MAAMC,SAAS,GAAG1B,MAAM,CAAUiB,KAAK,CAAC;EAExCnB,SAAS,CAAC,MAAM;IACd,IAAIkB,aAAa,KAAK,MAAM,EAAE;MAC5BU,SAAS,CAACC,OAAO,GAAG,KAAK;IAC3B;EACF,CAAC,EAAE,CAACV,KAAK,EAAED,aAAa,CAAC,CAAC;EAE1B,MAAMY,UAAU,GACdF,SAAS,CAACC,OAAO,IAAIL,YAAY,GAAGA,YAAY,GAAGD,KAAK;EAC1D,MAAMQ,SAAS,GAAG9B,OAAO,CACvB,MAAMG,kBAAkB,CAAC0B,UAAU,CAAC,EACpC,CAACA,UAAU,CACb,CAAC;EAED,OACEhC,KAAA,CAAAc,aAAA,CAACJ,YAAY,EAAAM,QAAA;IACXkB,IAAI,EAAC,MAAM;IACXV,SAAS,EAAEnB,UAAU,CAAC,8BAA8B,EAAEmB,SAAS,CAAE;IACjES,SAAS,EAAEA;EAAU,GACjBN,SAAS,GAEZK,UAAU,IAAIhC,KAAA,CAAAc,aAAA,CAACP,IAAI;IAAC4B,IAAI,EAAC;EAAO,GAAEH,UAAiB,CAAC,EACpDT,QAAQ,EACRN,OACW,CAAC;AAEnB;AAEAL,aAAa,CAACwB,qBAAqB,GAAG,IAAI;AAC1CrB,2BAA2B,CAACqB,qBAAqB,GAAG,IAAI"}

package/extensions/forms/Iterate/EditContainer/EditContainerDocs.js

@@ -9,6 +9,11 @@ export const EditContainerProperties = {
     type: 'React.Node',
     status: 'optional'
   },
+  variant: {
+    doc: 'Defines the variant of the container. Can be `outline` or `basic`. Defaults to `outline`.',
+    type: 'string',
+    status: 'optional'
+  },
   '[FlexVertical](/uilib/layout/flex/container/)': {
     doc: 'All Flex.Vertical properties.',
     type: 'Various',

package/extensions/forms/Iterate/EditContainer/EditContainerDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditContainerDocs.js","names":["EditContainerProperties","title","doc","type","status","titleWhenNew","EditContainerEvents"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditContainerDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const EditContainerProperties: PropertiesTableProps = {\n  title: {\n    doc: 'The title of the container.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  titleWhenNew: {\n    doc: 'The title for a new item.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  '[FlexVertical](/uilib/layout/flex/container/)': {\n    doc: 'All Flex.Vertical properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n}\n\nexport const EditContainerEvents: PropertiesTableProps = {}\n"],"mappings":"AAEA,OAAO,MAAMA,uBAA6C,GAAG;EAC3DC,KAAK,EAAE;IACLC,GAAG,EAAE,6BAA6B;IAClCC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDC,YAAY,EAAE;IACZH,GAAG,EAAE,2BAA2B;IAChCC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACD,+CAA+C,EAAE;IAC/CF,GAAG,EAAE,+BAA+B;IACpCC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAME,mBAAyC,GAAG,CAAC,CAAC"}
+{"version":3,"file":"EditContainerDocs.js","names":["EditContainerProperties","title","doc","type","status","titleWhenNew","variant","EditContainerEvents"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditContainerDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const EditContainerProperties: PropertiesTableProps = {\n  title: {\n    doc: 'The title of the container.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  titleWhenNew: {\n    doc: 'The title for a new item.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  variant: {\n    doc: 'Defines the variant of the container. Can be `outline` or `basic`. Defaults to `outline`.',\n    type: 'string',\n    status: 'optional',\n  },\n  '[FlexVertical](/uilib/layout/flex/container/)': {\n    doc: 'All Flex.Vertical properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n}\n\nexport const EditContainerEvents: PropertiesTableProps = {}\n"],"mappings":"AAEA,OAAO,MAAMA,uBAA6C,GAAG;EAC3DC,KAAK,EAAE;IACLC,GAAG,EAAE,6BAA6B;IAClCC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDC,YAAY,EAAE;IACZH,GAAG,EAAE,2BAA2B;IAChCC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDE,OAAO,EAAE;IACPJ,GAAG,EAAE,2FAA2F;IAChGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACD,+CAA+C,EAAE;IAC/CF,GAAG,EAAE,+BAA+B;IACpCC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMG,mBAAyC,GAAG,CAAC,CAAC"}

package/extensions/forms/Iterate/EditContainer/EditToolbarTools.js

@@ -44,7 +44,7 @@ export default function EditToolbarTools() {
     switchContainerMode === null || switchContainerMode === void 0 ? void 0 : switchContainerMode('view');
   }, [switchContainerMode]);
   return React.createElement(Flex.Horizontal, {
-    spacing: "large"
+    gap: "large"
   }, React.createElement(Button, {
     variant: "tertiary",
     icon: check,