@dnb/eufemia 10.44.0 → 10.45.0

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

@@ -1,28 +1,33 @@
 "use client";
 
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["children", "className", "title", "titleWhenNew", "toolbar"];
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _Toolbar;
-import React, { useContext, useEffect, useMemo, useRef } from 'react';
+const _excluded = ["toolbar"],
+  _excluded2 = ["children", "className", "title", "titleWhenNew", "toolbar"];
+import React, { useContext, useMemo } from 'react';
 import classnames from 'classnames';
 import { convertJsxToString } from '../../../../shared/component-helper';
 import { Lead } from '../../../../elements';
-import IterateElementContext from '../IterateElementContext';
-import EditToolbarTools from './EditToolbarTools';
+import IterateItemContext from '../IterateItemContext';
+import EditToolbarTools, { useWasNew } from './EditToolbarTools';
 import ElementBlock from '../AnimatedContainer/ElementBlock';
 import Toolbar from '../Toolbar';
 export default function EditContainer(props) {
+  const {
+      toolbar
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
   return React.createElement(EditContainerWithoutToolbar, _extends({
-    toolbar: _Toolbar || (_Toolbar = React.createElement(Toolbar, null, React.createElement(EditToolbarTools, null)))
-  }, props));
+    toolbar: toolbar !== null && toolbar !== void 0 ? toolbar : _Toolbar || (_Toolbar = React.createElement(Toolbar, null, React.createElement(EditToolbarTools, null)))
+  }, rest));
 }
 export function EditContainerWithoutToolbar(props) {
-  const iterateElementContext = useContext(IterateElementContext);
+  const iterateItemContext = useContext(IterateItemContext);
   const {
     containerMode,
     isNew
-  } = iterateElementContext !== null && iterateElementContext !== void 0 ? iterateElementContext : {};
+  } = iterateItemContext !== null && iterateItemContext !== void 0 ? iterateItemContext : {};
   const _ref = props || {},
     {
       children,
@@ -31,22 +36,23 @@ export function EditContainerWithoutToolbar(props) {
       titleWhenNew,
       toolbar
     } = _ref,
-    restProps = _objectWithoutProperties(_ref, _excluded);
-  const wasNewRef = useRef(isNew);
-  useEffect(() => {
-    if (containerMode === 'view') {
-      wasNewRef.current = false;
-    }
-  }, [isNew, containerMode]);
-  const blockTitle = wasNewRef.current && titleWhenNew ? titleWhenNew : title;
-  const ariaLabel = useMemo(() => convertJsxToString(blockTitle), [blockTitle]);
+    restProps = _objectWithoutProperties(_ref, _excluded2);
+  const wasNew = useWasNew({
+    isNew,
+    containerMode
+  });
+  let itemTitle = wasNew && titleWhenNew ? titleWhenNew : title;
+  let ariaLabel = useMemo(() => convertJsxToString(itemTitle), [itemTitle]);
+  if (ariaLabel.includes('{itemNr}')) {
+    itemTitle = ariaLabel = ariaLabel.replace('{itemNr}', iterateItemContext.index + 1);
+  }
   return React.createElement(ElementBlock, _extends({
     mode: "edit",
     className: classnames('dnb-forms-section-edit-block', className),
     ariaLabel: ariaLabel
-  }, restProps), blockTitle && React.createElement(Lead, {
+  }, restProps), itemTitle && React.createElement(Lead, {
     size: "basis"
-  }, blockTitle), children, toolbar);
+  }, itemTitle), children, toolbar);
 }
 EditContainer._supportsSpacingProps = true;
 EditContainerWithoutToolbar._supportsSpacingProps = true;

package/es/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, {\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-section-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"}
+{"version":3,"file":"EditContainer.js","names":["React","useContext","useMemo","classnames","convertJsxToString","Lead","IterateItemContext","EditToolbarTools","useWasNew","ElementBlock","Toolbar","EditContainer","props","toolbar","rest","_objectWithoutProperties","_excluded","createElement","EditContainerWithoutToolbar","_extends","_Toolbar","iterateItemContext","containerMode","isNew","_ref","children","className","title","titleWhenNew","restProps","_excluded2","wasNew","itemTitle","ariaLabel","includes","replace","index","mode","size","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditContainer.tsx"],"sourcesContent":["import React, { useContext, useMemo } 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 IterateItemContext from '../IterateItemContext'\nimport EditToolbarTools, { useWasNew } 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   */\n  open?: boolean\n\n  /**\n   * An alternative toolbar to be shown in the EditContainer.\n   */\n  toolbar?: React.ReactNode\n}\n\nexport type AllProps = Props & FlexContainerProps & ElementSectionProps\n\nexport default function EditContainer(props: AllProps) {\n  const { toolbar, ...rest } = props\n  return (\n    <EditContainerWithoutToolbar\n      toolbar={\n        toolbar ?? (\n          <Toolbar>\n            <EditToolbarTools />\n          </Toolbar>\n        )\n      }\n      {...rest}\n    />\n  )\n}\n\nexport function EditContainerWithoutToolbar(\n  props: Props & FlexContainerProps & { toolbar?: React.ReactNode }\n) {\n  const iterateItemContext = useContext(IterateItemContext)\n  const { containerMode, isNew } = iterateItemContext ?? {}\n\n  const {\n    children,\n    className,\n    title,\n    titleWhenNew,\n    toolbar,\n    ...restProps\n  } = props || {}\n\n  const wasNew = useWasNew({ isNew, containerMode })\n  let itemTitle = wasNew && titleWhenNew ? titleWhenNew : 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=\"edit\"\n      className={classnames('dnb-forms-section-edit-block', className)}\n      ariaLabel={ariaLabel}\n      {...restProps}\n    >\n      {itemTitle && <Lead size=\"basis\">{itemTitle}</Lead>}\n      {children}\n      {toolbar}\n    </ElementBlock>\n  )\n}\n\nEditContainer._supportsSpacingProps = true\nEditContainerWithoutToolbar._supportsSpacingProps = true\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,sBAAsB;AAE3C,OAAOC,kBAAkB,MAAM,uBAAuB;AACtD,OAAOC,gBAAgB,IAAIC,SAAS,QAAQ,oBAAoB;AAChE,OAAOC,YAAY,MAEZ,mCAAmC;AAC1C,OAAOC,OAAO,MAAM,YAAY;AA0BhC,eAAe,SAASC,aAAaA,CAACC,KAAe,EAAE;EACrD,MAAM;MAAEC;IAAiB,CAAC,GAAGD,KAAK;IAAdE,IAAI,GAAAC,wBAAA,CAAKH,KAAK,EAAAI,SAAA;EAClC,OACEhB,KAAA,CAAAiB,aAAA,CAACC,2BAA2B,EAAAC,QAAA;IAC1BN,OAAO,EACLA,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAAO,QAAA,KAAAA,QAAA,GACLpB,KAAA,CAAAiB,aAAA,CAACP,OAAO,QACNV,KAAA,CAAAiB,aAAA,CAACV,gBAAgB,MAAE,CACZ,CAAC;EAEb,GACGO,IAAI,CACT,CAAC;AAEN;AAEA,OAAO,SAASI,2BAA2BA,CACzCN,KAAiE,EACjE;EACA,MAAMS,kBAAkB,GAAGpB,UAAU,CAACK,kBAAkB,CAAC;EACzD,MAAM;IAAEgB,aAAa;IAAEC;EAAM,CAAC,GAAGF,kBAAkB,aAAlBA,kBAAkB,cAAlBA,kBAAkB,GAAI,CAAC,CAAC;EAEzD,MAAAG,IAAA,GAOIZ,KAAK,IAAI,CAAC,CAAC;IAPT;MACJa,QAAQ;MACRC,SAAS;MACTC,KAAK;MACLC,YAAY;MACZf;IAEF,CAAC,GAAAW,IAAA;IADIK,SAAS,GAAAd,wBAAA,CAAAS,IAAA,EAAAM,UAAA;EAGd,MAAMC,MAAM,GAAGvB,SAAS,CAAC;IAAEe,KAAK;IAAED;EAAc,CAAC,CAAC;EAClD,IAAIU,SAAS,GAAGD,MAAM,IAAIH,YAAY,GAAGA,YAAY,GAAGD,KAAK;EAC7D,IAAIM,SAAS,GAAG/B,OAAO,CAAC,MAAME,kBAAkB,CAAC4B,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,EACVd,kBAAkB,CAACe,KAAK,GAAG,CAC7B,CAAC;EACH;EAEA,OACEpC,KAAA,CAAAiB,aAAA,CAACR,YAAY,EAAAU,QAAA;IACXkB,IAAI,EAAC,MAAM;IACXX,SAAS,EAAEvB,UAAU,CAAC,8BAA8B,EAAEuB,SAAS,CAAE;IACjEO,SAAS,EAAEA;EAAU,GACjBJ,SAAS,GAEZG,SAAS,IAAIhC,KAAA,CAAAiB,aAAA,CAACZ,IAAI;IAACiC,IAAI,EAAC;EAAO,GAAEN,SAAgB,CAAC,EAClDP,QAAQ,EACRZ,OACW,CAAC;AAEnB;AAEAF,aAAa,CAAC4B,qBAAqB,GAAG,IAAI;AAC1CrB,2BAA2B,CAACqB,qBAAqB,GAAG,IAAI"}

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

@@ -14,6 +14,16 @@ export const EditContainerProperties = {
     type: 'string',
     status: 'optional'
   },
+  toolbar: {
+    doc: 'An alternative toolbar to be shown in the container.',
+    type: 'React.Node',
+    status: 'optional'
+  },
+  open: {
+    doc: 'If the container should be open or not. This is taken care of internally by default.',
+    type: 'boolean',
+    status: 'optional'
+  },
   '[FlexVertical](/uilib/layout/flex/container/)': {
     doc: 'All Flex.Vertical properties.',
     type: 'Various',

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

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"EditContainerDocs.js","names":["EditContainerProperties","title","doc","type","status","titleWhenNew","variant","toolbar","open","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  toolbar: {\n    doc: 'An alternative toolbar to be shown in the container.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  open: {\n    doc: 'If the container should be open or not. This is taken care of internally by default.',\n    type: 'boolean',\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;EACDG,OAAO,EAAE;IACPL,GAAG,EAAE,sDAAsD;IAC3DC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDI,IAAI,EAAE;IACJN,GAAG,EAAE,sFAAsF;IAC3FC,IAAI,EAAE,SAAS;IACfC,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,MAAMK,mBAAyC,GAAG,CAAC,CAAC"}

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

@@ -3,10 +3,11 @@
 import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
 import { Button, Flex, FormStatus } from '../../../../components';
 import useTranslation from '../../hooks/useTranslation';
-import IterateElementContext from '../IterateElementContext';
+import IterateItemContext from '../IterateItemContext';
 import { check, close } from '../../../../icons';
 import RemoveButton from '../RemoveButton';
 import FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext';
+import PushContainerContext from '../PushContainer/PushContainerContext';
 export default function EditToolbarTools() {
   const {
     restoreOriginalValue,
@@ -15,11 +16,25 @@ export default function EditToolbarTools() {
     arrayValue,
     index,
     isNew
-  } = useContext(IterateElementContext) || {};
+  } = useContext(IterateItemContext) || {};
   const {
-    hasVisibleError
+    hasError,
+    hasVisibleError,
+    setShowBoundaryErrors
   } = useContext(FieldBoundaryContext) || {};
-  const translation = useTranslation().IterateEditContainer;
+  const {
+    entries,
+    commitHandleRef
+  } = useContext(PushContainerContext) || {};
+  const {
+    doneButton,
+    cancelButton,
+    removeButton,
+    errorInSection
+  } = useTranslation().IterateEditContainer;
+  const {
+    createButton
+  } = useTranslation().IteratePushContainer;
   const valueBackupRef = useRef();
   const wasNew = useWasNew({
     isNew,
@@ -39,34 +54,49 @@ export default function EditToolbarTools() {
       restoreOriginalValue === null || restoreOriginalValue === void 0 ? void 0 : restoreOriginalValue(valueBackupRef.current);
     }
     setShowError(false);
+    setShowBoundaryErrors === null || setShowBoundaryErrors === void 0 ? void 0 : setShowBoundaryErrors(false);
     switchContainerMode === null || switchContainerMode === void 0 ? void 0 : switchContainerMode('view');
-  }, [restoreOriginalValue, switchContainerMode]);
+  }, [restoreOriginalValue, setShowBoundaryErrors, switchContainerMode]);
   const doneHandler = useCallback(() => {
-    if (hasVisibleError) {
-      setShowError(true);
+    if (hasError) {
+      setShowBoundaryErrors === null || setShowBoundaryErrors === void 0 ? void 0 : setShowBoundaryErrors(true);
+      if (hasVisibleError) {
+        setShowError(true);
+      }
     } else {
+      setShowBoundaryErrors === null || setShowBoundaryErrors === void 0 ? void 0 : setShowBoundaryErrors(false);
       setShowError(false);
-      switchContainerMode === null || switchContainerMode === void 0 ? void 0 : switchContainerMode('view');
+      if (commitHandleRef) {
+        var _commitHandleRef$curr;
+        (_commitHandleRef$curr = commitHandleRef.current) === null || _commitHandleRef$curr === void 0 ? void 0 : _commitHandleRef$curr.call(commitHandleRef);
+      } else {
+        switchContainerMode === null || switchContainerMode === void 0 ? void 0 : switchContainerMode('view');
+      }
     }
-  }, [hasVisibleError, switchContainerMode]);
+  }, [commitHandleRef, hasError, hasVisibleError, setShowBoundaryErrors, switchContainerMode]);
   return React.createElement(React.Fragment, null, React.createElement(FormStatus, {
     show: showError && hasVisibleError,
     no_animation: false
-  }, translation.errorInSection), React.createElement(Flex.Horizontal, {
+  }, errorInSection), React.createElement(Flex.Horizontal, {
     gap: "large"
-  }, React.createElement(Button, {
+  }, commitHandleRef ? React.createElement(Button, {
+    variant: "tertiary",
+    icon: check,
+    icon_position: "left",
+    on_click: doneHandler
+  }, createButton) : React.createElement(Button, {
     variant: "tertiary",
     icon: check,
     icon_position: "left",
     on_click: doneHandler
-  }, translation.doneButton), wasNew ? React.createElement(RemoveButton, {
-    text: translation.removeButton
+  }, doneButton), (!entries || (entries === null || entries === void 0 ? void 0 : entries.length) > 0 && containerMode === 'edit') && (wasNew ? React.createElement(RemoveButton, {
+    text: removeButton
   }) : React.createElement(Button, {
     variant: "tertiary",
     icon: close,
     icon_position: "left",
     on_click: cancelHandler
-  }, translation.cancelButton)));
+  }, cancelButton))));
 }
 export function useWasNew({
   isNew,

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

@@ -1 +1 @@
-{"version":3,"file":"EditToolbarTools.js","names":["React","useCallback","useContext","useEffect","useRef","useState","Button","Flex","FormStatus","useTranslation","IterateElementContext","check","close","RemoveButton","FieldBoundaryContext","EditToolbarTools","restoreOriginalValue","switchContainerMode","containerMode","arrayValue","index","isNew","hasVisibleError","translation","IterateEditContainer","valueBackupRef","wasNew","useWasNew","showError","setShowError","current","cancelHandler","doneHandler","createElement","Fragment","show","no_animation","errorInSection","Horizontal","gap","variant","icon","icon_position","on_click","doneButton","text","removeButton","cancelButton","wasNewRef"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditToolbarTools.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\nimport { Button, Flex, FormStatus } from '../../../../components'\nimport useTranslation from '../../hooks/useTranslation'\nimport IterateElementContext from '../IterateElementContext'\nimport { check, close } from '../../../../icons'\nimport RemoveButton from '../RemoveButton'\nimport { ContainerMode } from '../Array/types'\nimport FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext'\n\nexport default function EditToolbarTools() {\n  const {\n    restoreOriginalValue,\n    switchContainerMode,\n    containerMode,\n    arrayValue,\n    index,\n    isNew,\n  } = useContext(IterateElementContext) || {}\n  const { hasVisibleError } = useContext(FieldBoundaryContext) || {}\n\n  const translation = useTranslation().IterateEditContainer\n  const valueBackupRef = useRef<unknown>()\n  const wasNew = useWasNew({ isNew, containerMode })\n  const [showError, setShowError] = useState(false)\n\n  useEffect(() => {\n    if (containerMode === 'edit' && !valueBackupRef.current) {\n      valueBackupRef.current = arrayValue?.[index]\n    }\n    if (containerMode === 'view') {\n      valueBackupRef.current = null\n    }\n  }, [arrayValue, containerMode, index])\n\n  const cancelHandler = useCallback(() => {\n    if (valueBackupRef.current) {\n      restoreOriginalValue?.(valueBackupRef.current)\n    }\n    setShowError(false)\n    switchContainerMode?.('view')\n  }, [restoreOriginalValue, switchContainerMode])\n  const doneHandler = useCallback(() => {\n    if (hasVisibleError) {\n      setShowError(true)\n    } else {\n      setShowError(false)\n      switchContainerMode?.('view')\n    }\n  }, [hasVisibleError, switchContainerMode])\n\n  return (\n    <>\n      <FormStatus show={showError && hasVisibleError} no_animation={false}>\n        {translation.errorInSection}\n      </FormStatus>\n      <Flex.Horizontal gap=\"large\">\n        <Button\n          variant=\"tertiary\"\n          icon={check}\n          icon_position=\"left\"\n          on_click={doneHandler}\n        >\n          {translation.doneButton}\n        </Button>\n\n        {wasNew ? (\n          <RemoveButton text={translation.removeButton} />\n        ) : (\n          <Button\n            variant=\"tertiary\"\n            icon={close}\n            icon_position=\"left\"\n            on_click={cancelHandler}\n          >\n            {translation.cancelButton}\n          </Button>\n        )}\n      </Flex.Horizontal>\n    </>\n  )\n}\n\nexport function useWasNew({\n  isNew,\n  containerMode,\n}: {\n  isNew: boolean\n  containerMode: ContainerMode\n}) {\n  const wasNewRef = useRef<unknown>(isNew)\n\n  useEffect(() => {\n    if (containerMode === 'view') {\n      wasNewRef.current = false\n    }\n  }, [isNew, containerMode])\n\n  return wasNewRef.current\n}\n"],"mappings":"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"}
+{"version":3,"file":"EditToolbarTools.js","names":["React","useCallback","useContext","useEffect","useRef","useState","Button","Flex","FormStatus","useTranslation","IterateItemContext","check","close","RemoveButton","FieldBoundaryContext","PushContainerContext","EditToolbarTools","restoreOriginalValue","switchContainerMode","containerMode","arrayValue","index","isNew","hasError","hasVisibleError","setShowBoundaryErrors","entries","commitHandleRef","doneButton","cancelButton","removeButton","errorInSection","IterateEditContainer","createButton","IteratePushContainer","valueBackupRef","wasNew","useWasNew","showError","setShowError","current","cancelHandler","doneHandler","_commitHandleRef$curr","call","createElement","Fragment","show","no_animation","Horizontal","gap","variant","icon","icon_position","on_click","length","text","wasNewRef"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditToolbarTools.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\nimport { Button, Flex, FormStatus } from '../../../../components'\nimport useTranslation from '../../hooks/useTranslation'\nimport IterateItemContext from '../IterateItemContext'\nimport { check, close } from '../../../../icons'\nimport RemoveButton from '../RemoveButton'\nimport { ContainerMode } from '../Array/types'\nimport FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext'\nimport PushContainerContext from '../PushContainer/PushContainerContext'\n\nexport default function EditToolbarTools() {\n  const {\n    restoreOriginalValue,\n    switchContainerMode,\n    containerMode,\n    arrayValue,\n    index,\n    isNew,\n  } = useContext(IterateItemContext) || {}\n  const { hasError, hasVisibleError, setShowBoundaryErrors } =\n    useContext(FieldBoundaryContext) || {}\n  const { entries, commitHandleRef } =\n    useContext(PushContainerContext) || {}\n\n  const { doneButton, cancelButton, removeButton, errorInSection } =\n    useTranslation().IterateEditContainer\n  const { createButton } = useTranslation().IteratePushContainer\n  const valueBackupRef = useRef<unknown>()\n  const wasNew = useWasNew({ isNew, containerMode })\n  const [showError, setShowError] = useState(false)\n\n  useEffect(() => {\n    if (containerMode === 'edit' && !valueBackupRef.current) {\n      valueBackupRef.current = arrayValue?.[index]\n    }\n    if (containerMode === 'view') {\n      valueBackupRef.current = null\n    }\n  }, [arrayValue, containerMode, index])\n\n  const cancelHandler = useCallback(() => {\n    if (valueBackupRef.current) {\n      restoreOriginalValue?.(valueBackupRef.current)\n    }\n    setShowError(false)\n    setShowBoundaryErrors?.(false)\n    switchContainerMode?.('view')\n  }, [restoreOriginalValue, setShowBoundaryErrors, switchContainerMode])\n  const doneHandler = useCallback(() => {\n    if (hasError) {\n      setShowBoundaryErrors?.(true)\n      if (hasVisibleError) {\n        setShowError(true)\n      }\n    } else {\n      setShowBoundaryErrors?.(false)\n      setShowError(false)\n      if (commitHandleRef) {\n        commitHandleRef.current?.()\n      } else {\n        switchContainerMode?.('view')\n      }\n    }\n  }, [\n    commitHandleRef,\n    hasError,\n    hasVisibleError,\n    setShowBoundaryErrors,\n    switchContainerMode,\n  ])\n\n  return (\n    <>\n      <FormStatus show={showError && hasVisibleError} no_animation={false}>\n        {errorInSection}\n      </FormStatus>\n      <Flex.Horizontal gap=\"large\">\n        {commitHandleRef ? (\n          <Button\n            variant=\"tertiary\"\n            icon={check}\n            icon_position=\"left\"\n            on_click={doneHandler}\n          >\n            {createButton}\n          </Button>\n        ) : (\n          <Button\n            variant=\"tertiary\"\n            icon={check}\n            icon_position=\"left\"\n            on_click={doneHandler}\n          >\n            {doneButton}\n          </Button>\n        )}\n\n        {(!entries || (entries?.length > 0 && containerMode === 'edit')) &&\n          (wasNew ? (\n            <RemoveButton text={removeButton} />\n          ) : (\n            <Button\n              variant=\"tertiary\"\n              icon={close}\n              icon_position=\"left\"\n              on_click={cancelHandler}\n            >\n              {cancelButton}\n            </Button>\n          ))}\n      </Flex.Horizontal>\n    </>\n  )\n}\n\nexport function useWasNew({\n  isNew,\n  containerMode,\n}: {\n  isNew: boolean\n  containerMode: ContainerMode\n}) {\n  const wasNewRef = useRef<unknown>(isNew)\n\n  useEffect(() => {\n    if (containerMode === 'view') {\n      wasNewRef.current = false\n    }\n  }, [isNew, containerMode])\n\n  return wasNewRef.current\n}\n"],"mappings":"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"}

package/{extensions/forms/Iterate/IterateElementContext.d.ts → es/extensions/forms/Iterate/IterateItemContext.d.ts}

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Path } from '../types';
 import { ContainerMode } from './Array/types';
-export interface IterateElementContextState {
+export interface IterateItemContextState {
     id?: string;
     index?: number;
     value?: unknown;
@@ -20,5 +20,5 @@ export interface IterateElementContextState {
     restoreOriginalValue?: (value: unknown) => void;
     fulfillRemove?: () => void;
 }
-declare const IterateElementContext: React.Context<IterateElementContextState>;
-export default IterateElementContext;
+declare const IterateItemContext: React.Context<IterateItemContextState>;
+export default IterateItemContext;

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

@@ -0,0 +1,4 @@
+import React from 'react';
+const IterateItemContext = React.createContext(undefined);
+export default IterateItemContext;
+//# sourceMappingURL=IterateItemContext.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IterateItemContext.js","names":["React","IterateItemContext","createContext","undefined"],"sources":["../../../../../src/extensions/forms/Iterate/IterateItemContext.ts"],"sourcesContent":["import React from 'react'\nimport { Path } from '../types'\nimport { ContainerMode } from './Array/types'\n\nexport interface IterateItemContextState {\n  id?: string\n  index?: number\n  value?: unknown\n  isNew?: boolean\n  path?: Path\n  arrayValue?: Array<unknown>\n  containerMode?: ContainerMode\n  containerRef?: React.RefObject<HTMLDivElement>\n  elementRef?: React.RefObject<HTMLDivElement>\n  switchContainerMode?: (mode: ContainerMode) => void\n  handleChange?: (path: Path, value: unknown) => void\n  handleRemove?: ({ keepItems }?: { keepItems?: boolean }) => void\n  handlePush?: (value: unknown) => void\n  restoreOriginalValue?: (value: unknown) => void\n  fulfillRemove?: () => void\n}\n\nconst IterateItemContext = React.createContext<\n  IterateItemContextState | undefined\n>(undefined)\n\nexport default IterateItemContext\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAsBzB,MAAMC,kBAAkB,GAAGD,KAAK,CAACE,aAAa,CAE5CC,SAAS,CAAC;AAEZ,eAAeF,kBAAkB"}

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

@@ -6,15 +6,15 @@ const _excluded = ["pushValue", "className"];
 import React, { useCallback, useContext } from 'react';
 import classnames from 'classnames';
 import { Button } from '../../../../components';
-import IterateElementContext from '../IterateElementContext';
+import IterateItemContext from '../IterateItemContext';
 import { useFieldProps } from '../../hooks';
 import { omitDataValueReadWriteProps } from '../../types';
 import { add } from '../../../../icons';
 function PushButton(props) {
-  const iterateElementContext = useContext(IterateElementContext);
+  const iterateItemContext = useContext(IterateItemContext);
   const {
     handlePush
-  } = iterateElementContext !== null && iterateElementContext !== void 0 ? iterateElementContext : {};
+  } = iterateItemContext !== null && iterateItemContext !== void 0 ? iterateItemContext : {};
   const {
       pushValue,
       className

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

@@ -1 +1 @@
-{"version":3,"file":"PushButton.js","names":["React","useCallback","useContext","classnames","Button","IterateElementContext","useFieldProps","omitDataValueReadWriteProps","add","PushButton","props","iterateElementContext","handlePush","pushValue","className","restProps","_objectWithoutProperties","_excluded","buttonProps","value","handleChange","children","undefined","Array","isArray","Error","handleClick","newValue","createElement","_extends","variant","icon","icon_position","on_click","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/PushButton/PushButton.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport classnames from 'classnames'\nimport { Button } from '../../../../components'\nimport { ButtonProps } from '../../../../components/Button'\nimport IterateElementContext from '../IterateElementContext'\nimport { useFieldProps } from '../../hooks'\nimport {\n  DataValueReadWriteComponentProps,\n  omitDataValueReadWriteProps,\n} from '../../types'\nimport { add } from '../../../../icons'\n\nexport type Props = ButtonProps &\n  DataValueReadWriteComponentProps<unknown[]> & {\n    pushValue: unknown | ((value: unknown) => void)\n  }\n\nfunction PushButton(props: Props) {\n  const iterateElementContext = useContext(IterateElementContext)\n  const { handlePush } = iterateElementContext ?? {}\n\n  const { pushValue, className, ...restProps } = props\n  const buttonProps = omitDataValueReadWriteProps(restProps)\n  const { value, handleChange, children } = useFieldProps(restProps)\n\n  if (value !== undefined && !Array.isArray(value)) {\n    throw new Error('PushButton received a non-array value')\n  }\n\n  const handleClick = useCallback(() => {\n    const newValue =\n      typeof pushValue === 'function' ? pushValue(value) : pushValue\n\n    if (handlePush) {\n      // Inside an Iterate element - make the change through the Iterate component\n      handlePush(newValue)\n      return // stop here\n    }\n\n    // If not inside an iterate, it could still manipulate a source data set through useFieldProps\n    handleChange([...(value ?? []), newValue])\n  }, [value, pushValue, handlePush, handleChange])\n\n  return (\n    <Button\n      className={classnames('dnb-forms-iterate-push-button', className)}\n      variant=\"secondary\"\n      icon={add}\n      icon_position=\"left\"\n      on_click={handleClick}\n      {...buttonProps}\n    >\n      {children}\n    </Button>\n  )\n}\n\nPushButton._supportsSpacingProps = true\nexport default PushButton\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAOC,qBAAqB,MAAM,0BAA0B;AAC5D,SAASC,aAAa,QAAQ,aAAa;AAC3C,SAEEC,2BAA2B,QACtB,aAAa;AACpB,SAASC,GAAG,QAAQ,mBAAmB;AAOvC,SAASC,UAAUA,CAACC,KAAY,EAAE;EAChC,MAAMC,qBAAqB,GAAGT,UAAU,CAACG,qBAAqB,CAAC;EAC/D,MAAM;IAAEO;EAAW,CAAC,GAAGD,qBAAqB,aAArBA,qBAAqB,cAArBA,qBAAqB,GAAI,CAAC,CAAC;EAElD,MAAM;MAAEE,SAAS;MAAEC;IAAwB,CAAC,GAAGJ,KAAK;IAAnBK,SAAS,GAAAC,wBAAA,CAAKN,KAAK,EAAAO,SAAA;EACpD,MAAMC,WAAW,GAAGX,2BAA2B,CAACQ,SAAS,CAAC;EAC1D,MAAM;IAAEI,KAAK;IAAEC,YAAY;IAAEC;EAAS,CAAC,GAAGf,aAAa,CAACS,SAAS,CAAC;EAElE,IAAII,KAAK,KAAKG,SAAS,IAAI,CAACC,KAAK,CAACC,OAAO,CAACL,KAAK,CAAC,EAAE;IAChD,MAAM,IAAIM,KAAK,CAAC,uCAAuC,CAAC;EAC1D;EAEA,MAAMC,WAAW,GAAGzB,WAAW,CAAC,MAAM;IACpC,MAAM0B,QAAQ,GACZ,OAAOd,SAAS,KAAK,UAAU,GAAGA,SAAS,CAACM,KAAK,CAAC,GAAGN,SAAS;IAEhE,IAAID,UAAU,EAAE;MAEdA,UAAU,CAACe,QAAQ,CAAC;MACpB;IACF;IAGAP,YAAY,CAAC,CAAC,IAAID,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE,CAAC,EAAEQ,QAAQ,CAAC,CAAC;EAC5C,CAAC,EAAE,CAACR,KAAK,EAAEN,SAAS,EAAED,UAAU,EAAEQ,YAAY,CAAC,CAAC;EAEhD,OACEpB,KAAA,CAAA4B,aAAA,CAACxB,MAAM,EAAAyB,QAAA;IACLf,SAAS,EAAEX,UAAU,CAAC,+BAA+B,EAAEW,SAAS,CAAE;IAClEgB,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAEvB,GAAI;IACVwB,aAAa,EAAC,MAAM;IACpBC,QAAQ,EAAEP;EAAY,GAClBR,WAAW,GAEdG,QACK,CAAC;AAEb;AAEAZ,UAAU,CAACyB,qBAAqB,GAAG,IAAI;AACvC,eAAezB,UAAU"}
+{"version":3,"file":"PushButton.js","names":["React","useCallback","useContext","classnames","Button","IterateItemContext","useFieldProps","omitDataValueReadWriteProps","add","PushButton","props","iterateItemContext","handlePush","pushValue","className","restProps","_objectWithoutProperties","_excluded","buttonProps","value","handleChange","children","undefined","Array","isArray","Error","handleClick","newValue","createElement","_extends","variant","icon","icon_position","on_click","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/PushButton/PushButton.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport classnames from 'classnames'\nimport { Button } from '../../../../components'\nimport { ButtonProps } from '../../../../components/Button'\nimport IterateItemContext from '../IterateItemContext'\nimport { useFieldProps } from '../../hooks'\nimport {\n  DataValueReadWriteComponentProps,\n  omitDataValueReadWriteProps,\n} from '../../types'\nimport { add } from '../../../../icons'\n\nexport type Props = ButtonProps &\n  DataValueReadWriteComponentProps<unknown[]> & {\n    pushValue: unknown | ((value: unknown) => void)\n  }\n\nfunction PushButton(props: Props) {\n  const iterateItemContext = useContext(IterateItemContext)\n  const { handlePush } = iterateItemContext ?? {}\n\n  const { pushValue, className, ...restProps } = props\n  const buttonProps = omitDataValueReadWriteProps(restProps)\n  const { value, handleChange, children } = useFieldProps(restProps)\n\n  if (value !== undefined && !Array.isArray(value)) {\n    throw new Error('PushButton received a non-array value')\n  }\n\n  const handleClick = useCallback(() => {\n    const newValue =\n      typeof pushValue === 'function' ? pushValue(value) : pushValue\n\n    if (handlePush) {\n      // Inside an Iterate element - make the change through the Iterate component\n      handlePush(newValue)\n      return // stop here\n    }\n\n    // If not inside an iterate, it could still manipulate a source data set through useFieldProps\n    handleChange([...(value ?? []), newValue])\n  }, [value, pushValue, handlePush, handleChange])\n\n  return (\n    <Button\n      className={classnames('dnb-forms-iterate-push-button', className)}\n      variant=\"secondary\"\n      icon={add}\n      icon_position=\"left\"\n      on_click={handleClick}\n      {...buttonProps}\n    >\n      {children}\n    </Button>\n  )\n}\n\nPushButton._supportsSpacingProps = true\nexport default PushButton\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAOC,kBAAkB,MAAM,uBAAuB;AACtD,SAASC,aAAa,QAAQ,aAAa;AAC3C,SAEEC,2BAA2B,QACtB,aAAa;AACpB,SAASC,GAAG,QAAQ,mBAAmB;AAOvC,SAASC,UAAUA,CAACC,KAAY,EAAE;EAChC,MAAMC,kBAAkB,GAAGT,UAAU,CAACG,kBAAkB,CAAC;EACzD,MAAM;IAAEO;EAAW,CAAC,GAAGD,kBAAkB,aAAlBA,kBAAkB,cAAlBA,kBAAkB,GAAI,CAAC,CAAC;EAE/C,MAAM;MAAEE,SAAS;MAAEC;IAAwB,CAAC,GAAGJ,KAAK;IAAnBK,SAAS,GAAAC,wBAAA,CAAKN,KAAK,EAAAO,SAAA;EACpD,MAAMC,WAAW,GAAGX,2BAA2B,CAACQ,SAAS,CAAC;EAC1D,MAAM;IAAEI,KAAK;IAAEC,YAAY;IAAEC;EAAS,CAAC,GAAGf,aAAa,CAACS,SAAS,CAAC;EAElE,IAAII,KAAK,KAAKG,SAAS,IAAI,CAACC,KAAK,CAACC,OAAO,CAACL,KAAK,CAAC,EAAE;IAChD,MAAM,IAAIM,KAAK,CAAC,uCAAuC,CAAC;EAC1D;EAEA,MAAMC,WAAW,GAAGzB,WAAW,CAAC,MAAM;IACpC,MAAM0B,QAAQ,GACZ,OAAOd,SAAS,KAAK,UAAU,GAAGA,SAAS,CAACM,KAAK,CAAC,GAAGN,SAAS;IAEhE,IAAID,UAAU,EAAE;MAEdA,UAAU,CAACe,QAAQ,CAAC;MACpB;IACF;IAGAP,YAAY,CAAC,CAAC,IAAID,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE,CAAC,EAAEQ,QAAQ,CAAC,CAAC;EAC5C,CAAC,EAAE,CAACR,KAAK,EAAEN,SAAS,EAAED,UAAU,EAAEQ,YAAY,CAAC,CAAC;EAEhD,OACEpB,KAAA,CAAA4B,aAAA,CAACxB,MAAM,EAAAyB,QAAA;IACLf,SAAS,EAAEX,UAAU,CAAC,+BAA+B,EAAEW,SAAS,CAAE;IAClEgB,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAEvB,GAAI;IACVwB,aAAa,EAAC,MAAM;IACpBC,QAAQ,EAAEP;EAAY,GAClBR,WAAW,GAEdG,QACK,CAAC;AAEb;AAEAZ,UAAU,CAACyB,qBAAqB,GAAG,IAAI;AACvC,eAAezB,UAAU"}

package/es/extensions/forms/Iterate/PushButton/PushButtonDocs.js

@@ -1,4 +1,9 @@
 export const PushButtonProperties = {
+  path: {
+    doc: 'The path to the array to add the new item to.',
+    type: 'string',
+    status: 'required'
+  },
   pushValue: {
     doc: 'The element to add to the array when the button is clicked. Can be a function to returns the push value.',
     type: 'unknown',

package/es/extensions/forms/Iterate/PushButton/PushButtonDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"PushButtonDocs.js","names":["PushButtonProperties","pushValue","doc","type","status","PushButtonEvents"],"sources":["../../../../../../src/extensions/forms/Iterate/PushButton/PushButtonDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const PushButtonProperties: PropertiesTableProps = {\n  pushValue: {\n    doc: 'The element to add to the array when the button is clicked. Can be a function to returns the push value.',\n    type: 'unknown',\n    status: 'optional',\n  },\n  '[Button](/uilib/components/button/properties)': {\n    doc: 'All button properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n}\n\nexport const PushButtonEvents: PropertiesTableProps = {}\n"],"mappings":"AAEA,OAAO,MAAMA,oBAA0C,GAAG;EACxDC,SAAS,EAAE;IACTC,GAAG,EAAE,0GAA0G;IAC/GC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,+CAA+C,EAAE;IAC/CF,GAAG,EAAE,wBAAwB;IAC7BC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMC,gBAAsC,GAAG,CAAC,CAAC"}
+{"version":3,"file":"PushButtonDocs.js","names":["PushButtonProperties","path","doc","type","status","pushValue","PushButtonEvents"],"sources":["../../../../../../src/extensions/forms/Iterate/PushButton/PushButtonDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const PushButtonProperties: PropertiesTableProps = {\n  path: {\n    doc: 'The path to the array to add the new item to.',\n    type: 'string',\n    status: 'required',\n  },\n  pushValue: {\n    doc: 'The element to add to the array when the button is clicked. Can be a function to returns the push value.',\n    type: 'unknown',\n    status: 'optional',\n  },\n  '[Button](/uilib/components/button/properties)': {\n    doc: 'All button properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n}\n\nexport const PushButtonEvents: PropertiesTableProps = {}\n"],"mappings":"AAEA,OAAO,MAAMA,oBAA0C,GAAG;EACxDC,IAAI,EAAE;IACJC,GAAG,EAAE,+CAA+C;IACpDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,SAAS,EAAE;IACTH,GAAG,EAAE,0GAA0G;IAC/GC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,+CAA+C,EAAE;IAC/CF,GAAG,EAAE,wBAAwB;IAC7BC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAME,gBAAsC,GAAG,CAAC,CAAC"}

package/es/extensions/forms/Iterate/PushContainer/OpenButton.d.ts

@@ -0,0 +1,4 @@
+import { ButtonProps } from '../../../../components/Button';
+type Props = ButtonProps;
+declare function OpenButton(props: Props): import("react/jsx-runtime").JSX.Element;
+export default OpenButton;

package/es/extensions/forms/Iterate/PushContainer/OpenButton.js

@@ -0,0 +1,32 @@
+"use client";
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["className", "children"];
+import React, { useCallback, useContext } from 'react';
+import classnames from 'classnames';
+import Button from '../../../../components/Button';
+import { add } from '../../../../icons';
+import IterateItemContext from '../IterateItemContext';
+function OpenButton(props) {
+  const {
+      className,
+      children
+    } = props,
+    restProps = _objectWithoutProperties(props, _excluded);
+  const {
+    switchContainerMode
+  } = useContext(IterateItemContext) || {};
+  const handleClick = useCallback(() => {
+    switchContainerMode === null || switchContainerMode === void 0 ? void 0 : switchContainerMode('edit');
+  }, [switchContainerMode]);
+  return React.createElement(Button, _extends({
+    className: classnames('dnb-forms-iterate-open-button', className),
+    variant: "secondary",
+    icon: add,
+    icon_position: "left",
+    on_click: handleClick
+  }, restProps), children);
+}
+export default OpenButton;
+//# sourceMappingURL=OpenButton.js.map

package/es/extensions/forms/Iterate/PushContainer/OpenButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenButton.js","names":["React","useCallback","useContext","classnames","Button","add","IterateItemContext","OpenButton","props","className","children","restProps","_objectWithoutProperties","_excluded","switchContainerMode","handleClick","createElement","_extends","variant","icon","icon_position","on_click"],"sources":["../../../../../../src/extensions/forms/Iterate/PushContainer/OpenButton.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport classnames from 'classnames'\nimport Button, { ButtonProps } from '../../../../components/Button'\nimport { add } from '../../../../icons'\nimport IterateItemContext from '../IterateItemContext'\n\ntype Props = ButtonProps\n\nfunction OpenButton(props: Props) {\n  const { className, children, ...restProps } = props\n  const { switchContainerMode } = useContext(IterateItemContext) || {}\n\n  const handleClick = useCallback(() => {\n    switchContainerMode?.('edit')\n  }, [switchContainerMode])\n\n  return (\n    <Button\n      className={classnames('dnb-forms-iterate-open-button', className)}\n      variant=\"secondary\"\n      icon={add}\n      icon_position=\"left\"\n      on_click={handleClick}\n      {...restProps}\n    >\n      {children}\n    </Button>\n  )\n}\n\nexport default OpenButton\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,MAAM,MAAuB,+BAA+B;AACnE,SAASC,GAAG,QAAQ,mBAAmB;AACvC,OAAOC,kBAAkB,MAAM,uBAAuB;AAItD,SAASC,UAAUA,CAACC,KAAY,EAAE;EAChC,MAAM;MAAEC,SAAS;MAAEC;IAAuB,CAAC,GAAGF,KAAK;IAAnBG,SAAS,GAAAC,wBAAA,CAAKJ,KAAK,EAAAK,SAAA;EACnD,MAAM;IAAEC;EAAoB,CAAC,GAAGZ,UAAU,CAACI,kBAAkB,CAAC,IAAI,CAAC,CAAC;EAEpE,MAAMS,WAAW,GAAGd,WAAW,CAAC,MAAM;IACpCa,mBAAmB,aAAnBA,mBAAmB,uBAAnBA,mBAAmB,CAAG,MAAM,CAAC;EAC/B,CAAC,EAAE,CAACA,mBAAmB,CAAC,CAAC;EAEzB,OACEd,KAAA,CAAAgB,aAAA,CAACZ,MAAM,EAAAa,QAAA;IACLR,SAAS,EAAEN,UAAU,CAAC,+BAA+B,EAAEM,SAAS,CAAE;IAClES,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAEd,GAAI;IACVe,aAAa,EAAC,MAAM;IACpBC,QAAQ,EAAEN;EAAY,GAClBJ,SAAS,GAEZD,QACK,CAAC;AAEb;AAEA,eAAeH,UAAU"}

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

@@ -0,0 +1,37 @@
+import React from 'react';
+import { Path } from '../../types';
+import { SpacingProps } from '../../../../shared/types';
+export type Props = {
+    /**
+     * The path to the array to add the new item to.
+     */
+    path: Path;
+    /**
+     * The title of the container.
+     */
+    title?: React.ReactNode;
+    /**
+     * The button to open container.
+     */
+    openButton?: React.ReactNode;
+    /**
+     * Define when the "open button" should be shown.
+     * Should be a function that returns a boolean.
+     */
+    showOpenButtonWhen?: (list: unknown[]) => boolean;
+    /**
+     * Prefilled data to add to the fields.
+     */
+    data?: Record<string, unknown>;
+    /**
+     * The container contents.
+     */
+    children: React.ReactNode;
+};
+export type AllProps = Props & SpacingProps;
+declare function PushContainer(props: AllProps): import("react/jsx-runtime").JSX.Element;
+declare namespace PushContainer {
+    var OpenButton: typeof import("./OpenButton").default;
+    var _supportsSpacingProps: boolean;
+}
+export default PushContainer;

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

@@ -0,0 +1,80 @@
+"use client";
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["data", "path", "title", "children", "openButton", "showOpenButtonWhen"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+import React, { useRef } from 'react';
+import Isolation from '../../Form/Isolation';
+import PushContainerContext from './PushContainerContext';
+import IterateItemContext from '../IterateItemContext';
+import useDataValue from '../../hooks/useDataValue';
+import EditContainer from '../EditContainer';
+import IterateArray from '../Array';
+import OpenButton from './OpenButton';
+import { HeightAnimation } from '../../../../components';
+function PushContainer(props) {
+  const {
+      data = {},
+      path,
+      title,
+      children,
+      openButton,
+      showOpenButtonWhen
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  const commitHandleRef = useRef();
+  const switchContainerModeRef = useRef();
+  const {
+    value: entries = [],
+    moveValueToPath
+  } = useDataValue({
+    path
+  });
+  const showOpenButton = showOpenButtonWhen === null || showOpenButtonWhen === void 0 ? void 0 : showOpenButtonWhen(entries);
+  const newItemContextProps = {
+    path,
+    entries,
+    commitHandleRef,
+    switchContainerMode: switchContainerModeRef.current
+  };
+  return React.createElement(Isolation, {
+    commitHandleRef: commitHandleRef,
+    transformOnCommit: ({
+      newItem
+    }) => {
+      return moveValueToPath(path, [...entries, _objectSpread(_objectSpread({}, newItem[0]), {}, {
+        __containerMode: 'view'
+      })]);
+    },
+    onCommit: (data, {
+      clearData
+    }) => {
+      var _switchContainerModeR;
+      clearData();
+      (_switchContainerModeR = switchContainerModeRef.current) === null || _switchContainerModeR === void 0 ? void 0 : _switchContainerModeR.call(switchContainerModeRef, 'view');
+    }
+  }, React.createElement(PushContainerContext.Provider, {
+    value: newItemContextProps
+  }, React.createElement(IterateArray, {
+    value: [data],
+    path: "/newItem"
+  }, React.createElement(IterateItemContext.Consumer, null, ({
+    containerMode,
+    switchContainerMode
+  }) => {
+    switchContainerModeRef.current = switchContainerMode;
+    return React.createElement(React.Fragment, null, React.createElement(EditContainer, _extends({
+      open: !showOpenButton || containerMode === 'edit',
+      title: title
+    }, rest), children), openButton && typeof showOpenButton === 'boolean' && React.createElement(HeightAnimation, {
+      open: showOpenButton && containerMode === 'view'
+    }, openButton));
+  }))));
+}
+PushContainer.OpenButton = OpenButton;
+PushContainer._supportsSpacingProps = true;
+export default PushContainer;
+//# sourceMappingURL=PushContainer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PushContainer.js","names":["React","useRef","Isolation","PushContainerContext","IterateItemContext","useDataValue","EditContainer","IterateArray","OpenButton","HeightAnimation","PushContainer","props","data","path","title","children","openButton","showOpenButtonWhen","rest","_objectWithoutProperties","_excluded","commitHandleRef","switchContainerModeRef","value","entries","moveValueToPath","showOpenButton","newItemContextProps","switchContainerMode","current","createElement","transformOnCommit","newItem","_objectSpread","__containerMode","onCommit","clearData","_switchContainerModeR","call","Provider","Consumer","containerMode","Fragment","_extends","open","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/PushContainer/PushContainer.tsx"],"sourcesContent":["import React, { useRef } from 'react'\nimport Isolation from '../../Form/Isolation'\nimport PushContainerContext from './PushContainerContext'\nimport IterateItemContext from '../IterateItemContext'\nimport useDataValue from '../../hooks/useDataValue'\nimport EditContainer from '../EditContainer'\nimport IterateArray, { ContainerMode } from '../Array'\nimport OpenButton from './OpenButton'\nimport { HeightAnimation } from '../../../../components'\nimport { Path } from '../../types'\nimport { SpacingProps } from '../../../../shared/types'\n\nexport type Props = {\n  /**\n   * The path to the array to add the new item to.\n   */\n  path: Path\n\n  /**\n   * The title of the container.\n   */\n  title?: React.ReactNode\n\n  /**\n   * The button to open container.\n   */\n  openButton?: React.ReactNode\n\n  /**\n   * Define when the \"open button\" should be shown.\n   * Should be a function that returns a boolean.\n   */\n  showOpenButtonWhen?: (list: unknown[]) => boolean\n\n  /**\n   * Prefilled data to add to the fields.\n   */\n  data?: Record<string, unknown>\n\n  /**\n   * The container contents.\n   */\n  children: React.ReactNode\n}\n\nexport type AllProps = Props & SpacingProps\n\nfunction PushContainer(props: AllProps) {\n  const {\n    data = {},\n    path,\n    title,\n    children,\n    openButton,\n    showOpenButtonWhen,\n    ...rest\n  } = props\n\n  const commitHandleRef = useRef<() => void>()\n  const switchContainerModeRef = useRef<(mode: ContainerMode) => void>()\n  const { value: entries = [], moveValueToPath } = useDataValue<\n    Array<unknown>\n  >({ path })\n\n  const showOpenButton = showOpenButtonWhen?.(entries)\n  const newItemContextProps: PushContainerContext = {\n    path,\n    entries,\n    commitHandleRef,\n    switchContainerMode: switchContainerModeRef.current,\n  }\n\n  return (\n    <Isolation\n      commitHandleRef={commitHandleRef}\n      transformOnCommit={({ newItem }) => {\n        return moveValueToPath(path, [\n          ...entries,\n          { ...newItem[0], __containerMode: 'view' },\n        ])\n      }}\n      onCommit={(data, { clearData }) => {\n        clearData()\n        switchContainerModeRef.current?.('view')\n      }}\n    >\n      <PushContainerContext.Provider value={newItemContextProps}>\n        <IterateArray value={[data]} path=\"/newItem\">\n          <IterateItemContext.Consumer>\n            {({ containerMode, switchContainerMode }) => {\n              switchContainerModeRef.current = switchContainerMode\n\n              return (\n                <>\n                  <EditContainer\n                    open={!showOpenButton || containerMode === 'edit'}\n                    title={title}\n                    {...rest}\n                  >\n                    {children}\n                  </EditContainer>\n\n                  {openButton && typeof showOpenButton === 'boolean' && (\n                    <HeightAnimation\n                      open={showOpenButton && containerMode === 'view'}\n                    >\n                      {openButton}\n                    </HeightAnimation>\n                  )}\n                </>\n              )\n            }}\n          </IterateItemContext.Consumer>\n        </IterateArray>\n      </PushContainerContext.Provider>\n    </Isolation>\n  )\n}\n\nPushContainer.OpenButton = OpenButton\nPushContainer._supportsSpacingProps = true\n\nexport default PushContainer\n"],"mappings":"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"}

package/es/extensions/forms/Iterate/PushContainer/PushContainerContext.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { Path } from '../../types';
+import { ContainerMode } from '../Array';
+type PushContainerContext = {
+    path: Path;
+    entries?: Array<unknown>;
+    commitHandleRef: React.MutableRefObject<() => void>;
+    switchContainerMode?: (mode: ContainerMode) => void;
+};
+declare const PushContainerContext: import("react").Context<PushContainerContext>;
+export default PushContainerContext;

package/es/extensions/forms/Iterate/PushContainer/PushContainerContext.js

@@ -0,0 +1,6 @@
+"use client";
+
+import { createContext } from 'react';
+const PushContainerContext = createContext(null);
+export default PushContainerContext;
+//# sourceMappingURL=PushContainerContext.js.map

package/es/extensions/forms/Iterate/PushContainer/PushContainerContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PushContainerContext.js","names":["createContext","PushContainerContext"],"sources":["../../../../../../src/extensions/forms/Iterate/PushContainer/PushContainerContext.tsx"],"sourcesContent":["import { createContext } from 'react'\nimport { Path } from '../../types'\nimport { ContainerMode } from '../Array'\n\ntype PushContainerContext = {\n  path: Path\n  entries?: Array<unknown>\n  commitHandleRef: React.MutableRefObject<() => void>\n  switchContainerMode?: (mode: ContainerMode) => void\n}\n\nconst PushContainerContext = createContext<PushContainerContext>(null)\n\nexport default PushContainerContext\n"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,OAAO;AAWrC,MAAMC,oBAAoB,GAAGD,aAAa,CAAuB,IAAI,CAAC;AAEtE,eAAeC,oBAAoB"}

package/es/extensions/forms/Iterate/PushContainer/PushContainerDocs.d.ts

@@ -0,0 +1,3 @@
+import { PropertiesTableProps } from '../../../../shared/types';
+export declare const PushContainerProperties: PropertiesTableProps;
+export declare const PushContainerEvents: PropertiesTableProps;