@dnb/eufemia 10.46.0 → 10.48.0

package/{extensions/forms/Iterate/ViewContainer/ViewToolbarTools.js → es/extensions/forms/Iterate/ViewContainer/EditButton.js}

@@ -1,29 +1,26 @@
 "use client";
 
 import React, { useCallback, useContext } from 'react';
-import { Button, Flex } from '../../../../components';
-import RemoveButton from '../RemoveButton';
+import { Button } from '../../../../components';
 import useTranslation from '../../hooks/useTranslation';
 import IterateItemContext from '../IterateItemContext';
 import { edit } from '../../../../icons';
-export default function ViewToolbarTools() {
+export default function ViewContainerEditButton() {
   const iterateItemContext = useContext(IterateItemContext);
   const {
     switchContainerMode
   } = iterateItemContext !== null && iterateItemContext !== void 0 ? iterateItemContext : {};
-  const translation = useTranslation().IterateViewContainer;
+  const {
+    editButton
+  } = useTranslation().IterateViewContainer;
   const editHandler = useCallback(() => {
     switchContainerMode === null || switchContainerMode === void 0 ? void 0 : switchContainerMode('edit');
   }, [switchContainerMode]);
-  return React.createElement(Flex.Horizontal, {
-    gap: "large"
-  }, React.createElement(Button, {
+  return React.createElement(Button, {
     variant: "tertiary",
     icon: edit,
     icon_position: "left",
     on_click: editHandler
-  }, translation.editButton), React.createElement(RemoveButton, {
-    text: translation.removeButton
-  }));
+  }, editButton);
 }
-//# sourceMappingURL=ViewToolbarTools.js.map
+//# sourceMappingURL=EditButton.js.map

package/es/extensions/forms/Iterate/ViewContainer/EditButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditButton.js","names":["React","useCallback","useContext","Button","useTranslation","IterateItemContext","edit","ViewContainerEditButton","iterateItemContext","switchContainerMode","editButton","IterateViewContainer","editHandler","createElement","variant","icon","icon_position","on_click"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/EditButton.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport { Button } from '../../../../components'\nimport useTranslation from '../../hooks/useTranslation'\nimport IterateItemContext from '../IterateItemContext'\nimport { edit } from '../../../../icons'\n\nexport default function ViewContainerEditButton() {\n  const iterateItemContext = useContext(IterateItemContext)\n  const { switchContainerMode } = iterateItemContext ?? {}\n  const { editButton } = useTranslation().IterateViewContainer\n\n  const editHandler = useCallback(() => {\n    switchContainerMode?.('edit')\n  }, [switchContainerMode])\n\n  return (\n    <Button\n      variant=\"tertiary\"\n      icon={edit}\n      icon_position=\"left\"\n      on_click={editHandler}\n    >\n      {editButton}\n    </Button>\n  )\n}\n"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,cAAc,MAAM,4BAA4B;AACvD,OAAOC,kBAAkB,MAAM,uBAAuB;AACtD,SAASC,IAAI,QAAQ,mBAAmB;AAExC,eAAe,SAASC,uBAAuBA,CAAA,EAAG;EAChD,MAAMC,kBAAkB,GAAGN,UAAU,CAACG,kBAAkB,CAAC;EACzD,MAAM;IAAEI;EAAoB,CAAC,GAAGD,kBAAkB,aAAlBA,kBAAkB,cAAlBA,kBAAkB,GAAI,CAAC,CAAC;EACxD,MAAM;IAAEE;EAAW,CAAC,GAAGN,cAAc,CAAC,CAAC,CAACO,oBAAoB;EAE5D,MAAMC,WAAW,GAAGX,WAAW,CAAC,MAAM;IACpCQ,mBAAmB,aAAnBA,mBAAmB,uBAAnBA,mBAAmB,CAAG,MAAM,CAAC;EAC/B,CAAC,EAAE,CAACA,mBAAmB,CAAC,CAAC;EAEzB,OACET,KAAA,CAAAa,aAAA,CAACV,MAAM;IACLW,OAAO,EAAC,UAAU;IAClBC,IAAI,EAAET,IAAK;IACXU,aAAa,EAAC,MAAM;IACpBC,QAAQ,EAAEL;EAAY,GAErBF,UACK,CAAC;AAEb"}

package/es/extensions/forms/Iterate/ViewContainer/RemoveButton.d.ts

@@ -0,0 +1 @@
+export default function ViewContainerRemoveButton(): import("react/jsx-runtime").JSX.Element;

package/es/extensions/forms/Iterate/ViewContainer/RemoveButton.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import RemoveButton from '../RemoveButton';
+import useTranslation from '../../hooks/useTranslation';
+export default function ViewContainerRemoveButton() {
+  const {
+    removeButton
+  } = useTranslation().IterateViewContainer;
+  return React.createElement(RemoveButton, {
+    text: removeButton
+  });
+}
+//# sourceMappingURL=RemoveButton.js.map

package/es/extensions/forms/Iterate/ViewContainer/RemoveButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RemoveButton.js","names":["React","RemoveButton","useTranslation","ViewContainerRemoveButton","removeButton","IterateViewContainer","createElement","text"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/RemoveButton.tsx"],"sourcesContent":["import React from 'react'\nimport RemoveButton from '../RemoveButton'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport default function ViewContainerRemoveButton() {\n  const { removeButton } = useTranslation().IterateViewContainer\n\n  return <RemoveButton text={removeButton} />\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,YAAY,MAAM,iBAAiB;AAC1C,OAAOC,cAAc,MAAM,4BAA4B;AAEvD,eAAe,SAASC,yBAAyBA,CAAA,EAAG;EAClD,MAAM;IAAEC;EAAa,CAAC,GAAGF,cAAc,CAAC,CAAC,CAACG,oBAAoB;EAE9D,OAAOL,KAAA,CAAAM,aAAA,CAACL,YAAY;IAACM,IAAI,EAAEH;EAAa,CAAE,CAAC;AAC7C"}

package/es/extensions/forms/Iterate/ViewContainer/ViewContainer.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Props as FlexContainerProps } from '../../../../components/flex/Container';
-import { ElementSectionProps } from '../AnimatedContainer/ElementBlock';
+import { ArrayItemAreaProps } from '../Array/ArrayItemArea';
 export type Props = {
     /**
      * The title of the ViewContainer.
@@ -10,10 +10,16 @@ export type Props = {
      * An alternative toolbar to be shown in the ViewContainer.
      */
     toolbar?: React.ReactNode;
+    /**
+     * The variant of the toolbar.
+     */
+    toolbarVariant?: 'minimumOneItem';
 };
-export type AllProps = Props & FlexContainerProps & ElementSectionProps;
+export type AllProps = Props & FlexContainerProps & ArrayItemAreaProps;
 declare function ViewContainer(props: AllProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ViewContainer {
+    var EditButton: typeof import("./EditButton").default;
+    var RemoveButton: typeof import("./RemoveButton").default;
     var _supportsSpacingProps: boolean;
 }
 export default ViewContainer;

package/es/extensions/forms/Iterate/ViewContainer/ViewContainer.js

@@ -2,40 +2,55 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _Toolbar;
-const _excluded = ["children", "className", "title", "toolbar"];
+var _Toolbar, _Toolbar2;
+const _excluded = ["children", "className", "title", "toolbar", "toolbarVariant"];
 import React, { useContext, useMemo } from 'react';
 import classnames from 'classnames';
 import { convertJsxToString } from '../../../../shared/component-helper';
 import { Flex } from '../../../../components';
 import { Lead } from '../../../../elements';
-import ElementBlock from '../AnimatedContainer/ElementBlock';
+import ArrayItemArea from '../Array/ArrayItemArea';
 import IterateItemContext from '../IterateItemContext';
 import Toolbar from '../Toolbar';
-import ViewToolbarTools from './ViewToolbarTools';
+import EditButton from './EditButton';
+import RemoveButton from './RemoveButton';
 function ViewContainer(props) {
+  var _toolbarElement;
   const _ref = props || {},
     {
       children,
       className,
       title,
-      toolbar
+      toolbar,
+      toolbarVariant
     } = _ref,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  const iterateItemContext = useContext(IterateItemContext);
+  const {
+    index,
+    arrayValue
+  } = useContext(IterateItemContext);
   let itemTitle = title;
   let ariaLabel = useMemo(() => convertJsxToString(itemTitle), [itemTitle]);
   if (ariaLabel.includes('{itemNr}')) {
-    itemTitle = ariaLabel = ariaLabel.replace('{itemNr}', iterateItemContext.index + 1);
+    itemTitle = ariaLabel = ariaLabel.replace('{itemNr}', index + 1);
   }
-  return React.createElement(ElementBlock, _extends({
+  let toolbarElement = toolbar;
+  if (toolbarVariant === 'minimumOneItem' && arrayValue.length <= 1) {
+    toolbarElement = _Toolbar || (_Toolbar = React.createElement(Toolbar, null, React.createElement(EditButton, null)));
+  }
+  const hasToolbar = !toolbarElement && React.Children.toArray(children).some(child => {
+    return (child === null || child === void 0 ? void 0 : child['type']) === Toolbar;
+  });
+  return React.createElement(ArrayItemArea, _extends({
     mode: "view",
     ariaLabel: ariaLabel,
     className: classnames('dnb-forms-section-view-block', className)
   }, restProps), React.createElement(Flex.Stack, null, itemTitle && React.createElement(Lead, {
     size: "basis"
-  }, itemTitle), children, toolbar !== null && toolbar !== void 0 ? toolbar : _Toolbar || (_Toolbar = React.createElement(Toolbar, null, React.createElement(ViewToolbarTools, null)))));
+  }, itemTitle), children, hasToolbar ? null : (_toolbarElement = toolbarElement) !== null && _toolbarElement !== void 0 ? _toolbarElement : _Toolbar2 || (_Toolbar2 = React.createElement(Toolbar, null, React.createElement(EditButton, null), React.createElement(RemoveButton, null)))));
 }
+ViewContainer.EditButton = EditButton;
+ViewContainer.RemoveButton = RemoveButton;
 ViewContainer._supportsSpacingProps = true;
 export default ViewContainer;
 //# sourceMappingURL=ViewContainer.js.map

package/es/extensions/forms/Iterate/ViewContainer/ViewContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewContainer.js","names":["React","useContext","useMemo","classnames","convertJsxToString","Flex","Lead","ElementBlock","IterateItemContext","Toolbar","ViewToolbarTools","ViewContainer","props","_ref","children","className","title","toolbar","restProps","_objectWithoutProperties","_excluded","iterateItemContext","itemTitle","ariaLabel","includes","replace","index","createElement","_extends","mode","Stack","size","_Toolbar","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/ViewContainer.tsx"],"sourcesContent":["import React, { useContext, useMemo } from 'react'\nimport classnames from 'classnames'\nimport { convertJsxToString } from '../../../../shared/component-helper'\nimport { Flex } from '../../../../components'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { Lead } from '../../../../elements'\nimport ElementBlock, {\n  ElementSectionProps,\n} from '../AnimatedContainer/ElementBlock'\nimport IterateItemContext from '../IterateItemContext'\nimport Toolbar from '../Toolbar'\nimport ViewToolbarTools from './ViewToolbarTools'\n\nexport type Props = {\n  /**\n   * The title of the ViewContainer.\n   */\n  title?: React.ReactNode\n  /**\n   * An alternative toolbar to be shown in the ViewContainer.\n   */\n  toolbar?: React.ReactNode\n}\n\nexport type AllProps = Props & FlexContainerProps & ElementSectionProps\n\nfunction ViewContainer(props: AllProps) {\n  const { children, className, title, toolbar, ...restProps } = props || {}\n  const iterateItemContext = useContext(IterateItemContext)\n\n  let itemTitle = title\n  let ariaLabel = useMemo(() => convertJsxToString(itemTitle), [itemTitle])\n  if (ariaLabel.includes('{itemNr}')) {\n    itemTitle = ariaLabel = ariaLabel.replace(\n      '{itemNr}',\n      iterateItemContext.index + 1\n    )\n  }\n\n  return (\n    <ElementBlock\n      mode=\"view\"\n      ariaLabel={ariaLabel}\n      className={classnames('dnb-forms-section-view-block', className)}\n      {...restProps}\n    >\n      <Flex.Stack>\n        {itemTitle && <Lead size=\"basis\">{itemTitle}</Lead>}\n        {children}\n        {toolbar ?? (\n          <Toolbar>\n            <ViewToolbarTools />\n          </Toolbar>\n        )}\n      </Flex.Stack>\n    </ElementBlock>\n  )\n}\n\nViewContainer._supportsSpacingProps = true\nexport default ViewContainer\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAClD,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,kBAAkB,QAAQ,qCAAqC;AACxE,SAASC,IAAI,QAAQ,wBAAwB;AAE7C,SAASC,IAAI,QAAQ,sBAAsB;AAC3C,OAAOC,YAAY,MAEZ,mCAAmC;AAC1C,OAAOC,kBAAkB,MAAM,uBAAuB;AACtD,OAAOC,OAAO,MAAM,YAAY;AAChC,OAAOC,gBAAgB,MAAM,oBAAoB;AAejD,SAASC,aAAaA,CAACC,KAAe,EAAE;EACtC,MAAAC,IAAA,GAA8DD,KAAK,IAAI,CAAC,CAAC;IAAnE;MAAEE,QAAQ;MAAEC,SAAS;MAAEC,KAAK;MAAEC;IAAsB,CAAC,GAAAJ,IAAA;IAAXK,SAAS,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA;EACzD,MAAMC,kBAAkB,GAAGpB,UAAU,CAACO,kBAAkB,CAAC;EAEzD,IAAIc,SAAS,GAAGN,KAAK;EACrB,IAAIO,SAAS,GAAGrB,OAAO,CAAC,MAAME,kBAAkB,CAACkB,SAAS,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EACzE,IAAIC,SAAS,CAACC,QAAQ,CAAC,UAAU,CAAC,EAAE;IAClCF,SAAS,GAAGC,SAAS,GAAGA,SAAS,CAACE,OAAO,CACvC,UAAU,EACVJ,kBAAkB,CAACK,KAAK,GAAG,CAC7B,CAAC;EACH;EAEA,OACE1B,KAAA,CAAA2B,aAAA,CAACpB,YAAY,EAAAqB,QAAA;IACXC,IAAI,EAAC,MAAM;IACXN,SAAS,EAAEA,SAAU;IACrBR,SAAS,EAAEZ,UAAU,CAAC,8BAA8B,EAAEY,SAAS;EAAE,GAC7DG,SAAS,GAEblB,KAAA,CAAA2B,aAAA,CAACtB,IAAI,CAACyB,KAAK,QACRR,SAAS,IAAItB,KAAA,CAAA2B,aAAA,CAACrB,IAAI;IAACyB,IAAI,EAAC;EAAO,GAAET,SAAgB,CAAC,EAClDR,QAAQ,EACRG,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAAe,QAAA,KAAAA,QAAA,GACNhC,KAAA,CAAA2B,aAAA,CAAClB,OAAO,QACNT,KAAA,CAAA2B,aAAA,CAACjB,gBAAgB,MAAE,CACZ,CAAC,CAEF,CACA,CAAC;AAEnB;AAEAC,aAAa,CAACsB,qBAAqB,GAAG,IAAI;AAC1C,eAAetB,aAAa"}
+{"version":3,"file":"ViewContainer.js","names":["React","useContext","useMemo","classnames","convertJsxToString","Flex","Lead","ArrayItemArea","IterateItemContext","Toolbar","EditButton","RemoveButton","ViewContainer","props","_toolbarElement","_ref","children","className","title","toolbar","toolbarVariant","restProps","_objectWithoutProperties","_excluded","index","arrayValue","itemTitle","ariaLabel","includes","replace","toolbarElement","length","_Toolbar","createElement","hasToolbar","Children","toArray","some","child","_extends","mode","Stack","size","_Toolbar2","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/ViewContainer.tsx"],"sourcesContent":["import React, { useContext, useMemo } from 'react'\nimport classnames from 'classnames'\nimport { convertJsxToString } from '../../../../shared/component-helper'\nimport { Flex } from '../../../../components'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { Lead } from '../../../../elements'\nimport ArrayItemArea, { ArrayItemAreaProps } from '../Array/ArrayItemArea'\nimport IterateItemContext from '../IterateItemContext'\nimport Toolbar from '../Toolbar'\nimport EditButton from './EditButton'\nimport RemoveButton from './RemoveButton'\n\nexport type Props = {\n  /**\n   * The title of the ViewContainer.\n   */\n  title?: React.ReactNode\n  /**\n   * An alternative toolbar to be shown in the ViewContainer.\n   */\n  toolbar?: React.ReactNode\n  /**\n   * The variant of the toolbar.\n   */\n  toolbarVariant?: 'minimumOneItem'\n}\n\nexport type AllProps = Props & FlexContainerProps & ArrayItemAreaProps\n\nfunction ViewContainer(props: AllProps) {\n  const {\n    children,\n    className,\n    title,\n    toolbar,\n    toolbarVariant,\n    ...restProps\n  } = props || {}\n  const { index, arrayValue } = useContext(IterateItemContext)\n\n  let itemTitle = title\n  let ariaLabel = useMemo(() => convertJsxToString(itemTitle), [itemTitle])\n  if (ariaLabel.includes('{itemNr}')) {\n    itemTitle = ariaLabel = ariaLabel.replace('{itemNr}', index + 1)\n  }\n\n  let toolbarElement = toolbar\n  if (toolbarVariant === 'minimumOneItem' && arrayValue.length <= 1) {\n    toolbarElement = (\n      <Toolbar>\n        <EditButton />\n      </Toolbar>\n    )\n  }\n\n  const hasToolbar =\n    !toolbarElement &&\n    React.Children.toArray(children).some((child) => {\n      return child?.['type'] === Toolbar\n    })\n\n  return (\n    <ArrayItemArea\n      mode=\"view\"\n      ariaLabel={ariaLabel}\n      className={classnames('dnb-forms-section-view-block', className)}\n      {...restProps}\n    >\n      <Flex.Stack>\n        {itemTitle && <Lead size=\"basis\">{itemTitle}</Lead>}\n        {children}\n        {hasToolbar\n          ? null\n          : toolbarElement ?? (\n              <Toolbar>\n                <EditButton />\n                <RemoveButton />\n              </Toolbar>\n            )}\n      </Flex.Stack>\n    </ArrayItemArea>\n  )\n}\n\nViewContainer.EditButton = EditButton\nViewContainer.RemoveButton = RemoveButton\n\nViewContainer._supportsSpacingProps = true\nexport default ViewContainer\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAClD,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,kBAAkB,QAAQ,qCAAqC;AACxE,SAASC,IAAI,QAAQ,wBAAwB;AAE7C,SAASC,IAAI,QAAQ,sBAAsB;AAC3C,OAAOC,aAAa,MAA8B,wBAAwB;AAC1E,OAAOC,kBAAkB,MAAM,uBAAuB;AACtD,OAAOC,OAAO,MAAM,YAAY;AAChC,OAAOC,UAAU,MAAM,cAAc;AACrC,OAAOC,YAAY,MAAM,gBAAgB;AAmBzC,SAASC,aAAaA,CAACC,KAAe,EAAE;EAAA,IAAAC,eAAA;EACtC,MAAAC,IAAA,GAOIF,KAAK,IAAI,CAAC,CAAC;IAPT;MACJG,QAAQ;MACRC,SAAS;MACTC,KAAK;MACLC,OAAO;MACPC;IAEF,CAAC,GAAAL,IAAA;IADIM,SAAS,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAEd,MAAM;IAAEC,KAAK;IAAEC;EAAW,CAAC,GAAGxB,UAAU,CAACO,kBAAkB,CAAC;EAE5D,IAAIkB,SAAS,GAAGR,KAAK;EACrB,IAAIS,SAAS,GAAGzB,OAAO,CAAC,MAAME,kBAAkB,CAACsB,SAAS,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EACzE,IAAIC,SAAS,CAACC,QAAQ,CAAC,UAAU,CAAC,EAAE;IAClCF,SAAS,GAAGC,SAAS,GAAGA,SAAS,CAACE,OAAO,CAAC,UAAU,EAAEL,KAAK,GAAG,CAAC,CAAC;EAClE;EAEA,IAAIM,cAAc,GAAGX,OAAO;EAC5B,IAAIC,cAAc,KAAK,gBAAgB,IAAIK,UAAU,CAACM,MAAM,IAAI,CAAC,EAAE;IACjED,cAAc,GAAAE,QAAA,KAAAA,QAAA,GACZhC,KAAA,CAAAiC,aAAA,CAACxB,OAAO,QACNT,KAAA,CAAAiC,aAAA,CAACvB,UAAU,MAAE,CACN,CAAC,CACX;EACH;EAEA,MAAMwB,UAAU,GACd,CAACJ,cAAc,IACf9B,KAAK,CAACmC,QAAQ,CAACC,OAAO,CAACpB,QAAQ,CAAC,CAACqB,IAAI,CAAEC,KAAK,IAAK;IAC/C,OAAO,CAAAA,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAG,MAAM,CAAC,MAAK7B,OAAO;EACpC,CAAC,CAAC;EAEJ,OACET,KAAA,CAAAiC,aAAA,CAAC1B,aAAa,EAAAgC,QAAA;IACZC,IAAI,EAAC,MAAM;IACXb,SAAS,EAAEA,SAAU;IACrBV,SAAS,EAAEd,UAAU,CAAC,8BAA8B,EAAEc,SAAS;EAAE,GAC7DI,SAAS,GAEbrB,KAAA,CAAAiC,aAAA,CAAC5B,IAAI,CAACoC,KAAK,QACRf,SAAS,IAAI1B,KAAA,CAAAiC,aAAA,CAAC3B,IAAI;IAACoC,IAAI,EAAC;EAAO,GAAEhB,SAAgB,CAAC,EAClDV,QAAQ,EACRkB,UAAU,GACP,IAAI,IAAApB,eAAA,GACJgB,cAAc,cAAAhB,eAAA,cAAAA,eAAA,GAAA6B,SAAA,KAAAA,SAAA,GACZ3C,KAAA,CAAAiC,aAAA,CAACxB,OAAO,QACNT,KAAA,CAAAiC,aAAA,CAACvB,UAAU,MAAE,CAAC,EACdV,KAAA,CAAAiC,aAAA,CAACtB,YAAY,MAAE,CACR,CAAC,CAEN,CACC,CAAC;AAEpB;AAEAC,aAAa,CAACF,UAAU,GAAGA,UAAU;AACrCE,aAAa,CAACD,YAAY,GAAGA,YAAY;AAEzCC,aAAa,CAACgC,qBAAqB,GAAG,IAAI;AAC1C,eAAehC,aAAa"}

package/es/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js

@@ -14,6 +14,11 @@ export const ViewContainerProperties = {
     type: 'React.Node',
     status: 'optional'
   },
+  toolbarVariant: {
+    doc: 'Use variants to render the toolbar differently. Currently there is only the `minimumOneItem` variant. See the info section for more info.',
+    type: 'string',
+    status: 'optional'
+  },
   '[FlexVertical](/uilib/layout/flex/container/)': {
     doc: 'All Flex.Vertical properties.',
     type: 'Various',

package/es/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewContainerDocs.js","names":["ViewContainerProperties","title","doc","type","status","variant","toolbar","ViewContainerEvents"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const ViewContainerProperties: PropertiesTableProps = {\n  title: {\n    doc: 'The title of the container.',\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  toolbar: {\n    doc: 'An alternative toolbar to be shown in the container.',\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 ViewContainerEvents: 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,OAAO,EAAE;IACPH,GAAG,EAAE,2FAA2F;IAChGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,OAAO,EAAE;IACPJ,GAAG,EAAE,sDAAsD;IAC3DC,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,MAAMG,mBAAyC,GAAG,CAAC,CAAC"}
+{"version":3,"file":"ViewContainerDocs.js","names":["ViewContainerProperties","title","doc","type","status","variant","toolbar","toolbarVariant","ViewContainerEvents"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const ViewContainerProperties: PropertiesTableProps = {\n  title: {\n    doc: 'The title of the container.',\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  toolbar: {\n    doc: 'An alternative toolbar to be shown in the container.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  toolbarVariant: {\n    doc: 'Use variants to render the toolbar differently. Currently there is only the `minimumOneItem` variant. See the info section for more info.',\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 ViewContainerEvents: 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,OAAO,EAAE;IACPH,GAAG,EAAE,2FAA2F;IAChGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,OAAO,EAAE;IACPJ,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDG,cAAc,EAAE;IACdL,GAAG,EAAE,2IAA2I;IAChJC,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,MAAMI,mBAAyC,GAAG,CAAC,CAAC"}

package/es/extensions/forms/Iterate/ViewContainer/index.d.ts

@@ -1,2 +1,4 @@
 export { default } from './ViewContainer';
 export * from './ViewContainer';
+export { default as EditButton } from './EditButton';
+export { default as RemoveButton } from './RemoveButton';

package/es/extensions/forms/Iterate/ViewContainer/index.js

@@ -1,3 +1,5 @@
 export { default } from './ViewContainer';
 export * from './ViewContainer';
+export { default as EditButton } from './EditButton';
+export { default as RemoveButton } from './RemoveButton';
 //# sourceMappingURL=index.js.map

package/es/extensions/forms/Iterate/ViewContainer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/index.ts"],"sourcesContent":["export { default } from './ViewContainer'\nexport * from './ViewContainer'\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,iBAAiB;AACzC,cAAc,iBAAiB"}
+{"version":3,"file":"index.js","names":["default","EditButton","RemoveButton"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/index.ts"],"sourcesContent":["export { default } from './ViewContainer'\nexport * from './ViewContainer'\nexport { default as EditButton } from './EditButton'\nexport { default as RemoveButton } from './RemoveButton'\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,iBAAiB;AACzC,cAAc,iBAAiB;AAC/B,SAASA,OAAO,IAAIC,UAAU,QAAQ,cAAc;AACpD,SAASD,OAAO,IAAIE,YAAY,QAAQ,gBAAgB"}

package/es/extensions/forms/Iterate/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export { default as useItem } from './useItem';
+export { default as useSwitchContainerMode } from './useSwitchContainerMode';

package/es/extensions/forms/Iterate/hooks/index.js

@@ -0,0 +1,3 @@
+export { default as useItem } from './useItem';
+export { default as useSwitchContainerMode } from './useSwitchContainerMode';
+//# sourceMappingURL=index.js.map

package/es/extensions/forms/Iterate/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","useItem","useSwitchContainerMode"],"sources":["../../../../../../src/extensions/forms/Iterate/hooks/index.ts"],"sourcesContent":["export { default as useItem } from './useItem'\nexport { default as useSwitchContainerMode } from './useSwitchContainerMode'\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,OAAO,QAAQ,WAAW;AAC9C,SAASD,OAAO,IAAIE,sBAAsB,QAAQ,0BAA0B"}

package/es/extensions/forms/Iterate/hooks/useSwitchContainerMode.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { ContainerMode } from '../Array';
+import { Path } from '../../types';
+/**
+ * This is a helper for the Iterate component.
+ * It is used to switch the container mode of the items inside the Iterate component.
+ * You can use the hook outside of the Iterate component, and it will communicate with the items inside the Iterate component.
+ * Therefore, it is imported and used in both e.g. the EditContainer and e.g. the PushButton.
+ */
+export default function useSwitchContainerMode({ path, }?: {
+    path?: Path;
+}): {
+    getNextContainerMode: () => ContainerMode | undefined;
+    nextContainerModeRef: import("react").MutableRefObject<undefined>;
+    setNextContainerMode: (mode: ContainerMode) => void;
+    setLastItemContainerMode: (mode: ContainerMode) => void;
+};

package/es/extensions/forms/Iterate/hooks/useSwitchContainerMode.js

@@ -0,0 +1,85 @@
+"use client";
+
+import { useCallback, useContext, useEffect, useRef } from 'react';
+import FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext';
+import IterateItemContext from '../IterateItemContext';
+const globalContainerModeRef = {
+  current: undefined
+};
+const globalCache = {};
+export default function useSwitchContainerMode({
+  path
+} = {}) {
+  const nextContainerModeRef = useRef();
+  const {
+    hasError
+  } = useContext(FieldBoundaryContext) || {};
+  const iterateItemContext = useContext(IterateItemContext);
+  const id = iterateItemContext === null || iterateItemContext === void 0 ? void 0 : iterateItemContext.id;
+  const hash = (path || '') + 'useSwitchContainerMode';
+  useEffect(() => {
+    nextContainerModeRef.current = globalContainerModeRef.current;
+    requestAnimationFrame(() => {
+      if (nextContainerModeRef.current) {
+        globalContainerModeRef.current = undefined;
+      }
+    });
+  });
+  useEffect(() => {
+    if (hash && iterateItemContext) {
+      globalCache[hash] = globalCache[hash] || {};
+      const {
+        index,
+        arrayValue,
+        switchContainerMode
+      } = iterateItemContext;
+      globalCache[hash][id] = {
+        index,
+        hasError,
+        count: arrayValue === null || arrayValue === void 0 ? void 0 : arrayValue.length,
+        switchContainerMode
+      };
+    }
+    return () => {
+      if (id) {
+        globalCache[hash][id] = undefined;
+      }
+    };
+  }, [hasError, hash, id, iterateItemContext]);
+  const setNextContainerMode = useCallback(mode => {
+    globalContainerModeRef.current = mode;
+  }, []);
+  const setContainerMode = useCallback(fn => {
+    const data = globalCache[hash];
+    for (const id in data) {
+      const item = data[id];
+      const mode = item && (fn === null || fn === void 0 ? void 0 : fn(item));
+      if (mode) {
+        item.switchContainerMode(mode, {
+          omitFocusManagement: true
+        });
+      }
+    }
+  }, [hash]);
+  const setLastItemContainerMode = useCallback(mode => {
+    setContainerMode(({
+      hasError,
+      index,
+      count
+    }) => {
+      if (!hasError && index === count - 2) {
+        return mode;
+      }
+    });
+  }, [setContainerMode]);
+  const getNextContainerMode = useCallback(() => {
+    return nextContainerModeRef.current;
+  }, []);
+  return {
+    getNextContainerMode,
+    nextContainerModeRef,
+    setNextContainerMode,
+    setLastItemContainerMode
+  };
+}
+//# sourceMappingURL=useSwitchContainerMode.js.map

package/es/extensions/forms/Iterate/hooks/useSwitchContainerMode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSwitchContainerMode.js","names":["useCallback","useContext","useEffect","useRef","FieldBoundaryContext","IterateItemContext","globalContainerModeRef","current","undefined","globalCache","useSwitchContainerMode","path","nextContainerModeRef","hasError","iterateItemContext","id","hash","requestAnimationFrame","index","arrayValue","switchContainerMode","count","length","setNextContainerMode","mode","setContainerMode","fn","data","item","omitFocusManagement","setLastItemContainerMode","getNextContainerMode"],"sources":["../../../../../../src/extensions/forms/Iterate/hooks/useSwitchContainerMode.ts"],"sourcesContent":["import { useCallback, useContext, useEffect, useRef } from 'react'\nimport { ContainerMode } from '../Array'\nimport FieldBoundaryContext, {\n  FieldBoundaryContextState,\n} from '../../DataContext/FieldBoundary/FieldBoundaryContext'\nimport IterateItemContext, {\n  IterateItemContextState,\n} from '../IterateItemContext'\nimport { Path } from '../../types'\n\ntype GlobalCacheHash = string\ntype GlobalCacheId = string\ntype GlobalCache = {\n  index: IterateItemContextState['index']\n  hasError: FieldBoundaryContextState['hasError']\n  count: number\n  switchContainerMode: IterateItemContextState['switchContainerMode']\n}\ntype GlobalCacheItem = {\n  [string: GlobalCacheHash]: GlobalCache\n}\n\nconst globalContainerModeRef = { current: undefined }\nconst globalCache: Record<\n  GlobalCacheHash,\n  Record<GlobalCacheId, GlobalCache>\n> = {}\n\n/**\n * This is a helper for the Iterate component.\n * It is used to switch the container mode of the items inside the Iterate component.\n * You can use the hook outside of the Iterate component, and it will communicate with the items inside the Iterate component.\n * Therefore, it is imported and used in both e.g. the EditContainer and e.g. the PushButton.\n */\nexport default function useSwitchContainerMode({\n  path,\n}: { path?: Path } = {}) {\n  const nextContainerModeRef = useRef()\n  const { hasError } = useContext(FieldBoundaryContext) || {}\n  const iterateItemContext = useContext(IterateItemContext)\n\n  const id = iterateItemContext?.id\n  const hash = (path || '') + 'useSwitchContainerMode'\n\n  useEffect(() => {\n    nextContainerModeRef.current = globalContainerModeRef.current\n    requestAnimationFrame(() => {\n      if (nextContainerModeRef.current) {\n        globalContainerModeRef.current = undefined\n      }\n    })\n  })\n\n  useEffect(() => {\n    if (hash && iterateItemContext) {\n      globalCache[hash] = globalCache[hash] || ({} as GlobalCacheItem)\n      const { index, arrayValue, switchContainerMode } = iterateItemContext\n      globalCache[hash][id] = {\n        index,\n        hasError,\n        count: arrayValue?.length,\n        switchContainerMode,\n      }\n    }\n\n    return () => {\n      if (id) {\n        globalCache[hash][id] = undefined\n      }\n    }\n  }, [hasError, hash, id, iterateItemContext])\n\n  const setNextContainerMode = useCallback((mode: ContainerMode) => {\n    globalContainerModeRef.current = mode\n  }, [])\n\n  const setContainerMode = useCallback(\n    (fn: ({ hasError, index, count }) => ContainerMode) => {\n      const data = globalCache[hash]\n      for (const id in data) {\n        const item = data[id]\n        const mode = item && fn?.(item)\n        if (mode) {\n          item.switchContainerMode(mode, { omitFocusManagement: true })\n        }\n      }\n    },\n    [hash]\n  )\n\n  const setLastItemContainerMode = useCallback(\n    (mode: ContainerMode) => {\n      setContainerMode(({ hasError, index, count }) => {\n        if (!hasError && index === count - 2) {\n          return mode\n        }\n      })\n    },\n    [setContainerMode]\n  )\n\n  const getNextContainerMode = useCallback(():\n    | ContainerMode\n    | undefined => {\n    return nextContainerModeRef.current\n  }, [])\n\n  return {\n    getNextContainerMode,\n    nextContainerModeRef,\n    setNextContainerMode,\n    setLastItemContainerMode,\n  }\n}\n"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,UAAU,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAElE,OAAOC,oBAAoB,MAEpB,sDAAsD;AAC7D,OAAOC,kBAAkB,MAElB,uBAAuB;AAe9B,MAAMC,sBAAsB,GAAG;EAAEC,OAAO,EAAEC;AAAU,CAAC;AACrD,MAAMC,WAGL,GAAG,CAAC,CAAC;AAQN,eAAe,SAASC,sBAAsBA,CAAC;EAC7CC;AACe,CAAC,GAAG,CAAC,CAAC,EAAE;EACvB,MAAMC,oBAAoB,GAAGT,MAAM,CAAC,CAAC;EACrC,MAAM;IAAEU;EAAS,CAAC,GAAGZ,UAAU,CAACG,oBAAoB,CAAC,IAAI,CAAC,CAAC;EAC3D,MAAMU,kBAAkB,GAAGb,UAAU,CAACI,kBAAkB,CAAC;EAEzD,MAAMU,EAAE,GAAGD,kBAAkB,aAAlBA,kBAAkB,uBAAlBA,kBAAkB,CAAEC,EAAE;EACjC,MAAMC,IAAI,GAAG,CAACL,IAAI,IAAI,EAAE,IAAI,wBAAwB;EAEpDT,SAAS,CAAC,MAAM;IACdU,oBAAoB,CAACL,OAAO,GAAGD,sBAAsB,CAACC,OAAO;IAC7DU,qBAAqB,CAAC,MAAM;MAC1B,IAAIL,oBAAoB,CAACL,OAAO,EAAE;QAChCD,sBAAsB,CAACC,OAAO,GAAGC,SAAS;MAC5C;IACF,CAAC,CAAC;EACJ,CAAC,CAAC;EAEFN,SAAS,CAAC,MAAM;IACd,IAAIc,IAAI,IAAIF,kBAAkB,EAAE;MAC9BL,WAAW,CAACO,IAAI,CAAC,GAAGP,WAAW,CAACO,IAAI,CAAC,IAAK,CAAC,CAAqB;MAChE,MAAM;QAAEE,KAAK;QAAEC,UAAU;QAAEC;MAAoB,CAAC,GAAGN,kBAAkB;MACrEL,WAAW,CAACO,IAAI,CAAC,CAACD,EAAE,CAAC,GAAG;QACtBG,KAAK;QACLL,QAAQ;QACRQ,KAAK,EAAEF,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEG,MAAM;QACzBF;MACF,CAAC;IACH;IAEA,OAAO,MAAM;MACX,IAAIL,EAAE,EAAE;QACNN,WAAW,CAACO,IAAI,CAAC,CAACD,EAAE,CAAC,GAAGP,SAAS;MACnC;IACF,CAAC;EACH,CAAC,EAAE,CAACK,QAAQ,EAAEG,IAAI,EAAED,EAAE,EAAED,kBAAkB,CAAC,CAAC;EAE5C,MAAMS,oBAAoB,GAAGvB,WAAW,CAAEwB,IAAmB,IAAK;IAChElB,sBAAsB,CAACC,OAAO,GAAGiB,IAAI;EACvC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,gBAAgB,GAAGzB,WAAW,CACjC0B,EAAiD,IAAK;IACrD,MAAMC,IAAI,GAAGlB,WAAW,CAACO,IAAI,CAAC;IAC9B,KAAK,MAAMD,EAAE,IAAIY,IAAI,EAAE;MACrB,MAAMC,IAAI,GAAGD,IAAI,CAACZ,EAAE,CAAC;MACrB,MAAMS,IAAI,GAAGI,IAAI,KAAIF,EAAE,aAAFA,EAAE,uBAAFA,EAAE,CAAGE,IAAI,CAAC;MAC/B,IAAIJ,IAAI,EAAE;QACRI,IAAI,CAACR,mBAAmB,CAACI,IAAI,EAAE;UAAEK,mBAAmB,EAAE;QAAK,CAAC,CAAC;MAC/D;IACF;EACF,CAAC,EACD,CAACb,IAAI,CACP,CAAC;EAED,MAAMc,wBAAwB,GAAG9B,WAAW,CACzCwB,IAAmB,IAAK;IACvBC,gBAAgB,CAAC,CAAC;MAAEZ,QAAQ;MAAEK,KAAK;MAAEG;IAAM,CAAC,KAAK;MAC/C,IAAI,CAACR,QAAQ,IAAIK,KAAK,KAAKG,KAAK,GAAG,CAAC,EAAE;QACpC,OAAOG,IAAI;MACb;IACF,CAAC,CAAC;EACJ,CAAC,EACD,CAACC,gBAAgB,CACnB,CAAC;EAED,MAAMM,oBAAoB,GAAG/B,WAAW,CAAC,MAExB;IACf,OAAOY,oBAAoB,CAACL,OAAO;EACrC,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IACLwB,oBAAoB;IACpBnB,oBAAoB;IACpBW,oBAAoB;IACpBO;EACF,CAAC;AACH"}

package/es/extensions/forms/Tools/Log.d.ts

@@ -0,0 +1,6 @@
+import { SectionProps } from '../../../components/Section';
+declare function Log(props: SectionProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Log {
+    var _supportsSpacingProps: boolean;
+}
+export default Log;

package/es/extensions/forms/Tools/Log.js

@@ -0,0 +1,22 @@
+"use client";
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { useContext } from 'react';
+import DataContext from '../DataContext/Context';
+import Section from '../../../components/Section';
+function Log(props) {
+  const {
+    data
+  } = useContext(DataContext);
+  return React.createElement(Section, _extends({
+    element: "output",
+    backgroundColor: "sand-yellow",
+    style: {
+      maxWidth: '80vw'
+    },
+    innerSpace: true
+  }, props), React.createElement("pre", null, JSON.stringify(data), ' '));
+}
+Log._supportsSpacingProps = true;
+export default Log;
+//# sourceMappingURL=Log.js.map

package/es/extensions/forms/Tools/Log.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Log.js","names":["useContext","DataContext","Section","Log","props","data","React","createElement","_extends","element","backgroundColor","style","maxWidth","innerSpace","JSON","stringify","_supportsSpacingProps"],"sources":["../../../../../src/extensions/forms/Tools/Log.tsx"],"sourcesContent":["import { useContext } from 'react'\nimport DataContext from '../DataContext/Context'\nimport Section, { SectionProps } from '../../../components/Section'\n\nfunction Log(props: SectionProps) {\n  const { data } = useContext(DataContext)\n\n  return (\n    <Section\n      element=\"output\"\n      backgroundColor=\"sand-yellow\"\n      style={{ maxWidth: '80vw' }}\n      innerSpace\n      {...props}\n    >\n      <pre>\n        {JSON.stringify(data)}\n        {' ' /* Ensure one line of spacing */}\n      </pre>\n    </Section>\n  )\n}\n\nLog._supportsSpacingProps = true\nexport default Log\n"],"mappings":";;;AAAA,SAASA,UAAU,QAAQ,OAAO;AAClC,OAAOC,WAAW,MAAM,wBAAwB;AAChD,OAAOC,OAAO,MAAwB,6BAA6B;AAEnE,SAASC,GAAGA,CAACC,KAAmB,EAAE;EAChC,MAAM;IAAEC;EAAK,CAAC,GAAGL,UAAU,CAACC,WAAW,CAAC;EAExC,OACEK,KAAA,CAAAC,aAAA,CAACL,OAAO,EAAAM,QAAA;IACNC,OAAO,EAAC,QAAQ;IAChBC,eAAe,EAAC,aAAa;IAC7BC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAO,CAAE;IAC5BC,UAAU;EAAA,GACNT,KAAK,GAETE,KAAA,CAAAC,aAAA,cACGO,IAAI,CAACC,SAAS,CAACV,IAAI,CAAC,EACpB,GACE,CACE,CAAC;AAEd;AAEAF,GAAG,CAACa,qBAAqB,GAAG,IAAI;AAChC,eAAeb,GAAG"}

package/es/extensions/forms/Tools/index.d.ts

@@ -1,2 +1,3 @@
 export { default as GenerateSchema } from './GenerateSchema';
 export { default as ListAllProps } from './ListAllProps';
+export { default as Log } from './Log';

package/es/extensions/forms/Tools/index.js

@@ -1,3 +1,4 @@
 export { default as GenerateSchema } from './GenerateSchema';
 export { default as ListAllProps } from './ListAllProps';
+export { default as Log } from './Log';
 //# sourceMappingURL=index.js.map

package/es/extensions/forms/Tools/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","GenerateSchema","ListAllProps"],"sources":["../../../../../src/extensions/forms/Tools/index.ts"],"sourcesContent":["export { default as GenerateSchema } from './GenerateSchema'\nexport { default as ListAllProps } from './ListAllProps'\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,cAAc,QAAQ,kBAAkB;AAC5D,SAASD,OAAO,IAAIE,YAAY,QAAQ,gBAAgB"}
+{"version":3,"file":"index.js","names":["default","GenerateSchema","ListAllProps","Log"],"sources":["../../../../../src/extensions/forms/Tools/index.ts"],"sourcesContent":["export { default as GenerateSchema } from './GenerateSchema'\nexport { default as ListAllProps } from './ListAllProps'\nexport { default as Log } from './Log'\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,cAAc,QAAQ,kBAAkB;AAC5D,SAASD,OAAO,IAAIE,YAAY,QAAQ,gBAAgB;AACxD,SAASF,OAAO,IAAIG,GAAG,QAAQ,OAAO"}

package/es/extensions/forms/Value/Date/Date.d.ts

@@ -1,7 +1,7 @@
 import { Props as StringValueProps } from '../String';
 import { AnyLocale } from '../../../../shared/Context';
 export type Props = StringValueProps & {
-    variant?: 'long' | 'short';
+    variant?: 'long' | 'short' | 'numeric';
     locale?: AnyLocale;
 };
 declare function DateComponent(props: Props): import("react/jsx-runtime").JSX.Element;

package/es/extensions/forms/Value/Date/Date.js

@@ -19,12 +19,22 @@ function DateComponent(props) {
     if (!value) {
       return undefined;
     }
-    const date = new Date(value);
-    const options = {
-      day: 'numeric',
-      month: variant,
-      year: 'numeric'
+    const getOptions = variant => {
+      if (variant === 'numeric') {
+        return {
+          day: '2-digit',
+          month: '2-digit',
+          year: 'numeric'
+        };
+      }
+      return {
+        day: 'numeric',
+        month: variant,
+        year: 'numeric'
+      };
     };
+    const date = new Date(value);
+    const options = getOptions(variant);
     const formattedDate = typeof Intl !== 'undefined' ? new Intl.DateTimeFormat(locale, options).format(date) : date.toLocaleString(locale, options);
     return formattedDate;
   }, [locale, variant]);

package/es/extensions/forms/Value/Date/Date.js.map

@@ -1 +1 @@
-{"version":3,"file":"Date.js","names":["React","useCallback","useContext","StringValue","useTranslation","SharedContext","DateComponent","props","_props$locale","_props$variant","_props$label","translations","Date","locale","contextLocale","variant","toInput","value","undefined","date","options","day","month","year","formattedDate","Intl","DateTimeFormat","format","toLocaleString","stringProps","_objectSpread","label","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/Date/Date.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport StringValue, { Props as StringValueProps } from '../String'\nimport useTranslation from '../../hooks/useTranslation'\nimport SharedContext, { AnyLocale } from '../../../../shared/Context'\n\nexport type Props = StringValueProps & {\n  variant?: 'long' | 'short'\n  locale?: AnyLocale\n}\n\nfunction DateComponent(props: Props) {\n  const translations = useTranslation().Date\n  const { locale: contextLocale } = useContext(SharedContext)\n  const locale = props.locale ?? contextLocale\n  const variant = props.variant ?? 'long'\n\n  const toInput = useCallback(\n    (value: string) => {\n      if (!value) {\n        return undefined\n      }\n\n      const date = new Date(value)\n      const options = {\n        day: 'numeric',\n        month: variant,\n        year: 'numeric',\n      } as const\n\n      const formattedDate =\n        typeof Intl !== 'undefined'\n          ? new Intl.DateTimeFormat(locale, options).format(date)\n          : date.toLocaleString(locale, options)\n\n      return formattedDate\n    },\n    [locale, variant]\n  )\n\n  const stringProps: Props = {\n    ...props,\n    label: props.label ?? translations.label,\n    toInput,\n  }\n  return <StringValue {...stringProps} />\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,WAAW,MAAqC,WAAW;AAClE,OAAOC,cAAc,MAAM,4BAA4B;AACvD,OAAOC,aAAa,MAAqB,4BAA4B;AAOrE,SAASC,aAAaA,CAACC,KAAY,EAAE;EAAA,IAAAC,aAAA,EAAAC,cAAA,EAAAC,YAAA;EACnC,MAAMC,YAAY,GAAGP,cAAc,CAAC,CAAC,CAACQ,IAAI;EAC1C,MAAM;IAAEC,MAAM,EAAEC;EAAc,CAAC,GAAGZ,UAAU,CAACG,aAAa,CAAC;EAC3D,MAAMQ,MAAM,IAAAL,aAAA,GAAGD,KAAK,CAACM,MAAM,cAAAL,aAAA,cAAAA,aAAA,GAAIM,aAAa;EAC5C,MAAMC,OAAO,IAAAN,cAAA,GAAGF,KAAK,CAACQ,OAAO,cAAAN,cAAA,cAAAA,cAAA,GAAI,MAAM;EAEvC,MAAMO,OAAO,GAAGf,WAAW,CACxBgB,KAAa,IAAK;IACjB,IAAI,CAACA,KAAK,EAAE;MACV,OAAOC,SAAS;IAClB;IAEA,MAAMC,IAAI,GAAG,IAAIP,IAAI,CAACK,KAAK,CAAC;IAC5B,MAAMG,OAAO,GAAG;MACdC,GAAG,EAAE,SAAS;MACdC,KAAK,EAAEP,OAAO;MACdQ,IAAI,EAAE;IACR,CAAU;IAEV,MAAMC,aAAa,GACjB,OAAOC,IAAI,KAAK,WAAW,GACvB,IAAIA,IAAI,CAACC,cAAc,CAACb,MAAM,EAAEO,OAAO,CAAC,CAACO,MAAM,CAACR,IAAI,CAAC,GACrDA,IAAI,CAACS,cAAc,CAACf,MAAM,EAAEO,OAAO,CAAC;IAE1C,OAAOI,aAAa;EACtB,CAAC,EACD,CAACX,MAAM,EAAEE,OAAO,CAClB,CAAC;EAED,MAAMc,WAAkB,GAAAC,aAAA,CAAAA,aAAA,KACnBvB,KAAK;IACRwB,KAAK,GAAArB,YAAA,GAAEH,KAAK,CAACwB,KAAK,cAAArB,YAAA,cAAAA,YAAA,GAAIC,YAAY,CAACoB,KAAK;IACxCf;EAAO,EACR;EACD,OAAOhB,KAAA,CAAAgC,aAAA,CAAC7B,WAAW,EAAK0B,WAAc,CAAC;AACzC;AAEAvB,aAAa,CAAC2B,qBAAqB,GAAG,IAAI;AAC1C,eAAe3B,aAAa"}
+{"version":3,"file":"Date.js","names":["React","useCallback","useContext","StringValue","useTranslation","SharedContext","DateComponent","props","_props$locale","_props$variant","_props$label","translations","Date","locale","contextLocale","variant","toInput","value","undefined","getOptions","day","month","year","date","options","formattedDate","Intl","DateTimeFormat","format","toLocaleString","stringProps","_objectSpread","label","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/Date/Date.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport StringValue, { Props as StringValueProps } from '../String'\nimport useTranslation from '../../hooks/useTranslation'\nimport SharedContext, { AnyLocale } from '../../../../shared/Context'\n\nexport type Props = StringValueProps & {\n  variant?: 'long' | 'short' | 'numeric'\n  locale?: AnyLocale\n}\n\nfunction DateComponent(props: Props) {\n  const translations = useTranslation().Date\n  const { locale: contextLocale } = useContext(SharedContext)\n  const locale = props.locale ?? contextLocale\n  const variant = props.variant ?? 'long'\n\n  const toInput = useCallback(\n    (value: string) => {\n      if (!value) {\n        return undefined\n      }\n\n      const getOptions = (variant) => {\n        if (variant === 'numeric') {\n          return {\n            day: '2-digit',\n            month: '2-digit',\n            year: 'numeric',\n          } as const\n        }\n        return {\n          day: 'numeric',\n          month: variant,\n          year: 'numeric',\n        } as const\n      }\n\n      const date = new Date(value)\n      const options = getOptions(variant)\n\n      const formattedDate =\n        typeof Intl !== 'undefined'\n          ? new Intl.DateTimeFormat(locale, options).format(date)\n          : date.toLocaleString(locale, options)\n\n      return formattedDate\n    },\n    [locale, variant]\n  )\n\n  const stringProps: Props = {\n    ...props,\n    label: props.label ?? translations.label,\n    toInput,\n  }\n  return <StringValue {...stringProps} />\n}\n\nDateComponent._supportsSpacingProps = true\nexport default DateComponent\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,WAAW,MAAqC,WAAW;AAClE,OAAOC,cAAc,MAAM,4BAA4B;AACvD,OAAOC,aAAa,MAAqB,4BAA4B;AAOrE,SAASC,aAAaA,CAACC,KAAY,EAAE;EAAA,IAAAC,aAAA,EAAAC,cAAA,EAAAC,YAAA;EACnC,MAAMC,YAAY,GAAGP,cAAc,CAAC,CAAC,CAACQ,IAAI;EAC1C,MAAM;IAAEC,MAAM,EAAEC;EAAc,CAAC,GAAGZ,UAAU,CAACG,aAAa,CAAC;EAC3D,MAAMQ,MAAM,IAAAL,aAAA,GAAGD,KAAK,CAACM,MAAM,cAAAL,aAAA,cAAAA,aAAA,GAAIM,aAAa;EAC5C,MAAMC,OAAO,IAAAN,cAAA,GAAGF,KAAK,CAACQ,OAAO,cAAAN,cAAA,cAAAA,cAAA,GAAI,MAAM;EAEvC,MAAMO,OAAO,GAAGf,WAAW,CACxBgB,KAAa,IAAK;IACjB,IAAI,CAACA,KAAK,EAAE;MACV,OAAOC,SAAS;IAClB;IAEA,MAAMC,UAAU,GAAIJ,OAAO,IAAK;MAC9B,IAAIA,OAAO,KAAK,SAAS,EAAE;QACzB,OAAO;UACLK,GAAG,EAAE,SAAS;UACdC,KAAK,EAAE,SAAS;UAChBC,IAAI,EAAE;QACR,CAAC;MACH;MACA,OAAO;QACLF,GAAG,EAAE,SAAS;QACdC,KAAK,EAAEN,OAAO;QACdO,IAAI,EAAE;MACR,CAAC;IACH,CAAC;IAED,MAAMC,IAAI,GAAG,IAAIX,IAAI,CAACK,KAAK,CAAC;IAC5B,MAAMO,OAAO,GAAGL,UAAU,CAACJ,OAAO,CAAC;IAEnC,MAAMU,aAAa,GACjB,OAAOC,IAAI,KAAK,WAAW,GACvB,IAAIA,IAAI,CAACC,cAAc,CAACd,MAAM,EAAEW,OAAO,CAAC,CAACI,MAAM,CAACL,IAAI,CAAC,GACrDA,IAAI,CAACM,cAAc,CAAChB,MAAM,EAAEW,OAAO,CAAC;IAE1C,OAAOC,aAAa;EACtB,CAAC,EACD,CAACZ,MAAM,EAAEE,OAAO,CAClB,CAAC;EAED,MAAMe,WAAkB,GAAAC,aAAA,CAAAA,aAAA,KACnBxB,KAAK;IACRyB,KAAK,GAAAtB,YAAA,GAAEH,KAAK,CAACyB,KAAK,cAAAtB,YAAA,cAAAA,YAAA,GAAIC,YAAY,CAACqB,KAAK;IACxChB;EAAO,EACR;EACD,OAAOhB,KAAA,CAAAiC,aAAA,CAAC9B,WAAW,EAAK2B,WAAc,CAAC;AACzC;AAEAxB,aAAa,CAAC4B,qBAAqB,GAAG,IAAI;AAC1C,eAAe5B,aAAa"}

package/es/extensions/forms/Value/Date/DateDocs.js

@@ -1,6 +1,6 @@
 export const DateProperties = {
   variant: {
-    doc: 'Defines the variant of the date. Can be `long` or `short`. Defaults to `long`.',
+    doc: 'Defines the variant of the date. Can be `long`, `short` or `numeric`. Defaults to `long`.',
     type: 'string',
     status: 'optional'
   },

package/es/extensions/forms/Value/Date/DateDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateDocs.js","names":["DateProperties","variant","doc","type","status","locale"],"sources":["../../../../../../src/extensions/forms/Value/Date/DateDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const DateProperties: PropertiesTableProps = {\n  variant: {\n    doc: 'Defines the variant of the date. Can be `long` or `short`. Defaults to `long`.',\n    type: 'string',\n    status: 'optional',\n  },\n  locale: {\n    doc: 'Defines the locale of the date. Defaults to `nb-NO`.',\n    type: 'string',\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,cAAoC,GAAG;EAClDC,OAAO,EAAE;IACPC,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,MAAM,EAAE;IACNH,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV;AACF,CAAC"}
+{"version":3,"file":"DateDocs.js","names":["DateProperties","variant","doc","type","status","locale"],"sources":["../../../../../../src/extensions/forms/Value/Date/DateDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const DateProperties: PropertiesTableProps = {\n  variant: {\n    doc: 'Defines the variant of the date. Can be `long`, `short` or `numeric`. Defaults to `long`.',\n    type: 'string',\n    status: 'optional',\n  },\n  locale: {\n    doc: 'Defines the locale of the date. Defaults to `nb-NO`.',\n    type: 'string',\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,cAAoC,GAAG;EAClDC,OAAO,EAAE;IACPC,GAAG,EAAE,2FAA2F;IAChGC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,MAAM,EAAE;IACNH,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV;AACF,CAAC"}

package/es/extensions/forms/ValueBlock/style/dnb-value-block.css

@@ -35,7 +35,7 @@
 .dnb-forms-value-block--max-width-stretch {
   width: 100%;
 }
-@media screen and (min-width: 25em) {
+@media screen and (min-width: 25.0625em) {
   .dnb-forms-value-block--max-width-small {
     max-width: var(--forms-field-width--small);
   }
@@ -73,7 +73,7 @@
 .dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large {
   --column-gap: var(--spacing-large);
 }
-@media screen and (min-width: 25em) {
+@media screen and (min-width: 25.0625em) {
   .dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content {
     align-items: flex-start;
   }

package/es/extensions/forms/ValueBlock/style/dnb-value-block.min.css

@@ -1 +1 @@
-@charset "UTF-8";.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal) .dnb-dt,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal)>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-none{--column-gap:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}
+@charset "UTF-8";.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal) .dnb-dt,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not([class*=dnb-space])>.dnb-dd>.dnb-dl,.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal)>.dnb-dd>.dnb-dl{margin:0}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd{margin-bottom:var(--spacing-medium)}.dnb-forms-summary-list.dnb-dl:not(.dnb-dl__layout--horizontal):not(.dnb-dl__layout--grid)>.dnb-dd:last-of-type{margin-bottom:0}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline:not([class*=__composition]){display:inline-block;font-size:inherit}.dnb-forms-value-block--inline:not([class*=__composition]):after,.dnb-forms-value-block--inline:not([class*=__composition]):before{content:" "}.dnb-forms-value-block+.dnb-forms-value-block--inline:not([class*=__composition]):before{content:none}.dnb-forms-value-block__label,.dnb-forms-value-block__label strong{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:var(--color-black-80)}.dnb-forms-value-block--max-width-stretch{width:100%}@media screen and (min-width:25.0625em){.dnb-forms-value-block--max-width-small{max-width:var(--forms-field-width--small)}.dnb-forms-value-block--max-width-medium{max-width:var(--forms-field-width--medium)}.dnb-forms-value-block--max-width-large{max-width:var(--forms-field-width--large)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{-moz-column-gap:var(--column-gap,0);column-gap:var(--column-gap,0);display:flex;flex-flow:row;row-gap:var(--row-gap,var(--spacing-medium))}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-none{--column-gap:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-xx-small{--column-gap:var(--spacing-xx-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-x-small{--column-gap:var(--spacing-x-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-small{--column-gap:var(--spacing-small)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-medium{--column-gap:var(--spacing-medium)}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content--gap-large{--column-gap:var(--spacing-large)}@media screen and (min-width:25.0625em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{align-items:flex-start}}@media screen and (max-width:25em){.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content{flex-flow:column}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not(:has(.dnb-forms-value-block__label)){--row-gap:var(--spacing-x-small)}}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content:not([class*=dnb-space])>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dd,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl,.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dt{margin:0}.dnb-forms-value-block__composition--horizontal .dnb-forms-value-block__content>.dnb-dl>.dnb-dd{margin-bottom:0}

package/es/extensions/forms/Wizard/Container/WizardContainer.js

@@ -53,15 +53,23 @@ function WizardContainer(props) {
   const totalStepsRef = useRef(NaN);
   const errorOnStepRef = useRef({});
   const stepElementRef = useRef();
+  const preventNextStepRef = useRef(false);
   const sharedStateRef = useRef();
   sharedStateRef.current = useSharedState(hasContext && id ? id + '-wizard' : undefined);
   errorOnStepRef.current[activeIndexRef.current] = showAllErrors;
+  const preventNavigation = useCallback((shouldPrevent = true) => {
+    preventNextStepRef.current = shouldPrevent;
+  }, []);
   const callOnStepChange = useCallback(async (index, mode) => {
     if (isAsync(onStepChange)) {
-      return await onStepChange(index, mode);
+      return await onStepChange(index, mode, {
+        preventNavigation
+      });
     }
-    return onStepChange === null || onStepChange === void 0 ? void 0 : onStepChange(index, mode);
-  }, [onStepChange]);
+    return onStepChange === null || onStepChange === void 0 ? void 0 : onStepChange(index, mode, {
+      preventNavigation
+    });
+  }, [onStepChange, preventNavigation]);
   const {
     setFocus,
     scrollToTop,
@@ -89,26 +97,29 @@ function WizardContainer(props) {
     handleSubmitCall({
       skipErrorCheck,
       skipFieldValidation: skipErrorCheck,
-      enableAsyncBehaviour: isAsync(onStepChange),
+      enableAsyncBehavior: isAsync(onStepChange),
       onSubmit: async () => {
         if (!skipStepChangeCallFromHook) {
           var _sharedStateRef$curre, _sharedStateRef$curre2, _sharedStateRef$curre3;
-          (_sharedStateRef$curre = sharedStateRef.current) === null || _sharedStateRef$curre === void 0 ? void 0 : (_sharedStateRef$curre2 = _sharedStateRef$curre.data) === null || _sharedStateRef$curre2 === void 0 ? void 0 : (_sharedStateRef$curre3 = _sharedStateRef$curre2.onStepChange) === null || _sharedStateRef$curre3 === void 0 ? void 0 : _sharedStateRef$curre3.call(_sharedStateRef$curre2, index, mode);
+          (_sharedStateRef$curre = sharedStateRef.current) === null || _sharedStateRef$curre === void 0 ? void 0 : (_sharedStateRef$curre2 = _sharedStateRef$curre.data) === null || _sharedStateRef$curre2 === void 0 ? void 0 : (_sharedStateRef$curre3 = _sharedStateRef$curre2.onStepChange) === null || _sharedStateRef$curre3 === void 0 ? void 0 : _sharedStateRef$curre3.call(_sharedStateRef$curre2, index, mode, {
+            preventNavigation
+          });
         }
         const result = skipStepChangeCall || skipStepChangeCallBeforeMounted && !isInteractionRef.current ? undefined : await callOnStepChange(index, mode);
         setFormState('abort');
         if (!skipErrorCheck) {
           setShowAllErrors(errorOnStepRef.current[index]);
         }
-        if (!(result instanceof Error)) {
+        if (!preventNextStepRef.current && !(result instanceof Error)) {
           handleLayoutEffect();
           activeIndexRef.current = index;
           forceUpdate();
         }
+        preventNextStepRef.current = false;
         return result;
       }
     });
-  }, [callOnStepChange, handleLayoutEffect, handleSubmitCall, isInteractionRef, onStepChange, setFormState, setShowAllErrors]);
+  }, [callOnStepChange, handleLayoutEffect, handleSubmitCall, isInteractionRef, onStepChange, preventNavigation, setFormState, setShowAllErrors]);
   const setActiveIndex = useCallback((index, options) => {
     if (index === activeIndexRef.current) {
       return;