@dnb/eufemia 10.57.1 → 10.59.0

package/es/extensions/forms/Form/Section/containers/SectionContainer.d.ts

@@ -6,7 +6,7 @@ export type SectionContainerProps = {
      * Defines the variant of the ViewContainer or EditContainer. Can be `outline`.
      * Defaults to `outline`.
      */
-    variant?: 'outline' | 'basic';
+    variant?: 'outline' | 'basic' | 'filled';
 };
 export type Props = {
     mode: ContainerMode;

package/es/extensions/forms/Form/Section/containers/SectionContainer.js

@@ -74,6 +74,7 @@ function SectionContainer(props) {
   }, React.createElement(Card, _extends({
     stack: true,
     innerSpace: variant === 'basic' ? false : 'small',
+    filled: variant === 'filled',
     className: "dnb-forms-section-block__inner"
   }, restProps, {
     "aria-label": ariaLabel,

package/es/extensions/forms/Form/Section/containers/SectionContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"SectionContainer.js","names":["React","useCallback","useContext","useEffect","useReducer","useRef","classnames","Card","HeightAnimation","SectionContainerContext","FieldBoundaryContext","SectionContainer","props","mode","open","ariaLabel","onAnimationEnd","className","children","variant","omitFocusManagementRef","current","undefined","restProps","_objectWithoutProperties","_excluded","forceUpdate","containerRef","contextRef","hasError","hasSubmitError","containerMode","openRef","setOpenState","setFocus","state","_containerRef$current","_containerRef$current2","focus","call","handleAnimationEnd","createElement","duration","keepInDOM","_extends","stack","innerSpace","innerRef","tabIndex","_supportsSpacingProps"],"sources":["../../../../../../../src/extensions/forms/Form/Section/containers/SectionContainer.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useReducer,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { Card, HeightAnimation } from '../../../../../components'\nimport SectionContainerContext, {\n  SectionContainerContextState,\n} from './SectionContainerContext'\nimport { Props as FlexContainerProps } from '../../../../../components/flex/Container'\nimport FieldBoundaryContext from '../../../DataContext/FieldBoundary/FieldBoundaryContext'\n\nexport type ContainerMode = 'view' | 'edit' | 'auto'\nexport type SectionContainerProps = {\n  /**\n   * Defines the variant of the ViewContainer or EditContainer. Can be `outline`.\n   * Defaults to `outline`.\n   */\n  variant?: 'outline' | 'basic'\n}\n\nexport type Props = {\n  mode: ContainerMode\n  open?: boolean | undefined\n  ariaLabel?: string\n  omitFocusManagementRef?: React.MutableRefObject<boolean>\n} & SectionContainerProps\n\nfunction SectionContainer(props: Props & FlexContainerProps) {\n  const {\n    mode,\n    open,\n    ariaLabel,\n    onAnimationEnd,\n    className,\n    children,\n    variant = 'outline',\n    omitFocusManagementRef = { current: undefined },\n    ...restProps\n  } = props\n\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const containerRef = useRef<HTMLDivElement>()\n  const contextRef = useRef<\n    SectionContainerContextState & {\n      hasError?: boolean\n      hasSubmitError?: boolean\n    }\n  >()\n  contextRef.current = useContext(SectionContainerContext) || {}\n\n  const { hasError, hasSubmitError } =\n    useContext(FieldBoundaryContext) || {}\n  contextRef.current.hasError = hasError\n  contextRef.current.hasSubmitError = hasSubmitError\n\n  // - Set the container mode to \"edit\" if we have an error\n  if (hasSubmitError) {\n    contextRef.current.containerMode = 'edit'\n  }\n\n  const { containerMode } = contextRef.current\n\n  const openRef = useRef(open ?? containerMode === mode)\n  const setOpenState = useCallback((open: boolean) => {\n    openRef.current = open\n    forceUpdate()\n  }, [])\n\n  useEffect(() => {\n    // - Set the open state, if it's controlled\n    if (typeof open !== 'undefined') {\n      setOpenState(open)\n    } else {\n      // - Open the block with animation, if it's in the right mode\n      if (openRef.current !== (containerMode === mode)) {\n        setOpenState(containerMode === mode)\n      }\n    }\n  }, [containerMode, mode, open, setOpenState])\n\n  const setFocus = useCallback(\n    (state) => {\n      if (state === 'opened') {\n        if (\n          !omitFocusManagementRef.current &&\n          !contextRef.current.hasSubmitError\n        ) {\n          containerRef?.current?.focus?.()\n        }\n        omitFocusManagementRef.current = false\n      }\n    },\n    [omitFocusManagementRef]\n  )\n\n  // - Remove the block with animation, if it's in the right mode\n  const handleAnimationEnd = useCallback(\n    (state) => {\n      setFocus(state)\n      onAnimationEnd?.(state)\n    },\n    [onAnimationEnd, setFocus]\n  )\n\n  return (\n    <HeightAnimation\n      className={classnames(\n        'dnb-forms-section-block',\n        variant && `dnb-forms-section-block--variant-${variant}`,\n        omitFocusManagementRef.current &&\n          'dnb-forms-section-block--no-animation',\n        contextRef.current.hasSubmitError &&\n          'dnb-forms-section-block--error',\n        className\n      )}\n      open={openRef.current}\n      onAnimationEnd={handleAnimationEnd}\n      duration={450}\n      keepInDOM // Ensure fields get mounted so they will sync with the data context\n    >\n      <Card\n        stack\n        innerSpace={variant === 'basic' ? false : 'small'}\n        className=\"dnb-forms-section-block__inner\"\n        {...restProps}\n        aria-label={ariaLabel}\n        innerRef={containerRef}\n        tabIndex={-1}\n      >\n        {children}\n      </Card>\n    </HeightAnimation>\n  )\n}\n\nSectionContainer._supportsSpacingProps = true\nexport default SectionContainer\n"],"mappings":"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"}
+{"version":3,"file":"SectionContainer.js","names":["React","useCallback","useContext","useEffect","useReducer","useRef","classnames","Card","HeightAnimation","SectionContainerContext","FieldBoundaryContext","SectionContainer","props","mode","open","ariaLabel","onAnimationEnd","className","children","variant","omitFocusManagementRef","current","undefined","restProps","_objectWithoutProperties","_excluded","forceUpdate","containerRef","contextRef","hasError","hasSubmitError","containerMode","openRef","setOpenState","setFocus","state","_containerRef$current","_containerRef$current2","focus","call","handleAnimationEnd","createElement","duration","keepInDOM","_extends","stack","innerSpace","filled","innerRef","tabIndex","_supportsSpacingProps"],"sources":["../../../../../../../src/extensions/forms/Form/Section/containers/SectionContainer.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useContext,\n  useEffect,\n  useReducer,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { Card, HeightAnimation } from '../../../../../components'\nimport SectionContainerContext, {\n  SectionContainerContextState,\n} from './SectionContainerContext'\nimport { Props as FlexContainerProps } from '../../../../../components/flex/Container'\nimport FieldBoundaryContext from '../../../DataContext/FieldBoundary/FieldBoundaryContext'\n\nexport type ContainerMode = 'view' | 'edit' | 'auto'\nexport type SectionContainerProps = {\n  /**\n   * Defines the variant of the ViewContainer or EditContainer. Can be `outline`.\n   * Defaults to `outline`.\n   */\n  variant?: 'outline' | 'basic' | 'filled'\n}\n\nexport type Props = {\n  mode: ContainerMode\n  open?: boolean | undefined\n  ariaLabel?: string\n  omitFocusManagementRef?: React.MutableRefObject<boolean>\n} & SectionContainerProps\n\nfunction SectionContainer(props: Props & FlexContainerProps) {\n  const {\n    mode,\n    open,\n    ariaLabel,\n    onAnimationEnd,\n    className,\n    children,\n    variant = 'outline',\n    omitFocusManagementRef = { current: undefined },\n    ...restProps\n  } = props\n\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const containerRef = useRef<HTMLDivElement>()\n  const contextRef = useRef<\n    SectionContainerContextState & {\n      hasError?: boolean\n      hasSubmitError?: boolean\n    }\n  >()\n  contextRef.current = useContext(SectionContainerContext) || {}\n\n  const { hasError, hasSubmitError } =\n    useContext(FieldBoundaryContext) || {}\n  contextRef.current.hasError = hasError\n  contextRef.current.hasSubmitError = hasSubmitError\n\n  // - Set the container mode to \"edit\" if we have an error\n  if (hasSubmitError) {\n    contextRef.current.containerMode = 'edit'\n  }\n\n  const { containerMode } = contextRef.current\n\n  const openRef = useRef(open ?? containerMode === mode)\n  const setOpenState = useCallback((open: boolean) => {\n    openRef.current = open\n    forceUpdate()\n  }, [])\n\n  useEffect(() => {\n    // - Set the open state, if it's controlled\n    if (typeof open !== 'undefined') {\n      setOpenState(open)\n    } else {\n      // - Open the block with animation, if it's in the right mode\n      if (openRef.current !== (containerMode === mode)) {\n        setOpenState(containerMode === mode)\n      }\n    }\n  }, [containerMode, mode, open, setOpenState])\n\n  const setFocus = useCallback(\n    (state) => {\n      if (state === 'opened') {\n        if (\n          !omitFocusManagementRef.current &&\n          !contextRef.current.hasSubmitError\n        ) {\n          containerRef?.current?.focus?.()\n        }\n        omitFocusManagementRef.current = false\n      }\n    },\n    [omitFocusManagementRef]\n  )\n\n  // - Remove the block with animation, if it's in the right mode\n  const handleAnimationEnd = useCallback(\n    (state) => {\n      setFocus(state)\n      onAnimationEnd?.(state)\n    },\n    [onAnimationEnd, setFocus]\n  )\n\n  return (\n    <HeightAnimation\n      className={classnames(\n        'dnb-forms-section-block',\n        variant && `dnb-forms-section-block--variant-${variant}`,\n        omitFocusManagementRef.current &&\n          'dnb-forms-section-block--no-animation',\n        contextRef.current.hasSubmitError &&\n          'dnb-forms-section-block--error',\n        className\n      )}\n      open={openRef.current}\n      onAnimationEnd={handleAnimationEnd}\n      duration={450}\n      keepInDOM // Ensure fields get mounted so they will sync with the data context\n    >\n      <Card\n        stack\n        innerSpace={variant === 'basic' ? false : 'small'}\n        filled={variant === 'filled'}\n        className=\"dnb-forms-section-block__inner\"\n        {...restProps}\n        aria-label={ariaLabel}\n        innerRef={containerRef}\n        tabIndex={-1}\n      >\n        {children}\n      </Card>\n    </HeightAnimation>\n  )\n}\n\nSectionContainer._supportsSpacingProps = true\nexport default SectionContainer\n"],"mappings":"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"}

package/es/extensions/forms/Form/Section/style/dnb-form-section.css

@@ -8,12 +8,6 @@
   display: flex;
   flex-direction: column;
 }
-.dnb-forms-section-block--variant-basic {
-  --border-color: transparent;
-}
-.dnb-forms-section-block--variant-basic .dnb-card {
-  --card-outline-color: transparent;
-}
 .dnb-forms-section-block__inner {
   flex: 1;
   outline: none;
@@ -33,6 +27,16 @@
 .dnb-forms-section-block__inner .dnb-dl .dnb-dd {
   margin-bottom: 0;
 }
+.dnb-forms-section-block--variant-basic {
+  --border-color: transparent;
+}
+.dnb-forms-section-block--variant-basic .dnb-card, .dnb-card .dnb-forms-section-block--variant-basic .dnb-card {
+  --card-outline-color: transparent;
+}
+.dnb-forms-section-block--variant-filled .dnb-forms-section-block__inner {
+  --space: var(--spacing-small);
+  background-color: var(--color-lavender);
+}
 .dnb-forms-section-block--no-animation .dnb-forms-section-block__inner {
   transform: translateY(0);
 }

package/es/extensions/forms/Form/Section/style/dnb-form-section.min.css

@@ -1 +1 @@
-.dnb-forms-section-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-section-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-section-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-section-block--variant-basic{--border-color:transparent}.dnb-forms-section-block--variant-basic .dnb-card{--card-outline-color:transparent}.dnb-forms-section-block__inner{flex:1;margin-bottom:var(--space);outline:none;transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-section-block__inner:has(.dnb-flex-container--spacing-small){--space:var(--spacing-small)}.dnb-forms-section-block__inner:has(.dnb-flex-container--spacing-medium){--space:var(--spacing-medium)}.dnb-forms-section-block__inner:has(.dnb-flex-container--spacing-large){--space:var(--spacing-large)}.dnb-forms-section-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-section-block--no-animation .dnb-forms-section-block__inner{transform:translateY(0)}.dnb-forms-section-block.dnb-height-animation--is-visible .dnb-forms-section-block__inner{transform:translateY(-.5rem)}.dnb-forms-section-block.dnb-height-animation--parallax .dnb-forms-section-block__inner{transform:translateY(0)}
+.dnb-forms-section-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-section-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-section-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-section-block__inner{flex:1;margin-bottom:var(--space);outline:none;transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-section-block__inner:has(.dnb-flex-container--spacing-small){--space:var(--spacing-small)}.dnb-forms-section-block__inner:has(.dnb-flex-container--spacing-medium){--space:var(--spacing-medium)}.dnb-forms-section-block__inner:has(.dnb-flex-container--spacing-large){--space:var(--spacing-large)}.dnb-forms-section-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-section-block--variant-basic{--border-color:transparent}.dnb-card .dnb-forms-section-block--variant-basic .dnb-card,.dnb-forms-section-block--variant-basic .dnb-card{--card-outline-color:transparent}.dnb-forms-section-block--variant-filled .dnb-forms-section-block__inner{--space:var(--spacing-small);background-color:var(--color-lavender)}.dnb-forms-section-block--no-animation .dnb-forms-section-block__inner{transform:translateY(0)}.dnb-forms-section-block.dnb-height-animation--is-visible .dnb-forms-section-block__inner{transform:translateY(-.5rem)}.dnb-forms-section-block.dnb-height-animation--parallax .dnb-forms-section-block__inner{transform:translateY(0)}

package/es/extensions/forms/Form/Section/style/dnb-form-section.scss

@@ -11,13 +11,6 @@
       flex-direction: column;
     }
 
-    &--variant-basic {
-      --border-color: transparent;
-      .dnb-card {
-        --card-outline-color: transparent;
-      }
-    }
-
     &__inner {
       flex: 1;
       outline: none; // for JavaSCript focus
@@ -43,6 +36,19 @@
       }
     }
 
+    &--variant-basic {
+      --border-color: transparent;
+      .dnb-card,
+      .dnb-card & .dnb-card {
+        --card-outline-color: transparent;
+      }
+    }
+
+    &--variant-filled &__inner {
+      --space: var(--spacing-small);
+      background-color: var(--color-lavender);
+    }
+
     &--no-animation &__inner {
       transform: translateY(0);
     }

package/es/extensions/forms/Form/Section/style/themes/dnb-form-section-theme-sbanken.css

@@ -0,0 +1,3 @@
+.dnb-forms-section-block--variant-filled .dnb-forms-section-block__inner {
+  --space: var(--spacing-small);
+}

package/es/extensions/forms/Form/Section/style/themes/dnb-form-section-theme-sbanken.min.css

@@ -0,0 +1 @@
+.dnb-forms-section-block--variant-filled .dnb-forms-section-block__inner{--space:var(--spacing-small)}

package/es/extensions/forms/Form/Section/style/themes/dnb-form-section-theme-sbanken.scss

@@ -0,0 +1,7 @@
+.dnb-forms-section {
+  &-block {
+    &--variant-filled &__inner {
+      --space: var(--spacing-small);
+    }
+  }
+}

package/es/extensions/forms/Form/Section/style/themes/dnb-form-section-theme-ui.css

@@ -0,0 +1,4 @@
+.dnb-forms-section-block--variant-filled .dnb-forms-section-block__inner {
+  --space: var(--spacing-small);
+  background-color: var(--color-lavender);
+}

package/es/extensions/forms/Form/Section/style/themes/dnb-form-section-theme-ui.min.css

@@ -0,0 +1 @@
+.dnb-forms-section-block--variant-filled .dnb-forms-section-block__inner{--space:var(--spacing-small);background-color:var(--color-lavender)}

package/es/extensions/forms/Form/Section/style/themes/dnb-form-section-theme-ui.scss

@@ -0,0 +1,8 @@
+.dnb-forms-section {
+  &-block {
+    &--variant-filled &__inner {
+      --space: var(--spacing-small);
+      background-color: var(--color-lavender);
+    }
+  }
+}

package/es/extensions/forms/Form/Section/style/themes/ui.d.ts

@@ -0,0 +1 @@
+export {};

package/es/extensions/forms/Form/Section/style/themes/ui.js

@@ -0,0 +1 @@
+import "./dnb-form-section-theme-ui.min.css";

package/es/extensions/forms/Form/Section/style/themes/ui.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui.js","names":[],"sources":["../../../../../../../../src/extensions/forms/Form/Section/style/themes/ui.js"],"sourcesContent":["/**\n * Imports the default theme\n *\n */\n\nimport './dnb-form-section-theme-ui.scss'\n"],"mappings":"AAKA,OAAO,qCAAkC"}

package/es/extensions/forms/Form/SubmitButton/SubmitButton.js

@@ -24,17 +24,17 @@ function SubmitButton(props) {
   const {
     formState,
     handleSubmit,
-    isInsideFormElement,
+    hasElementRef,
     props: dataContextProps
   } = useContext(DataContext) || {};
   const {
     isolate
   } = dataContextProps || {};
   const onClickHandler = useCallback(() => {
-    if (!isInsideFormElement) {
+    if (!(hasElementRef !== null && hasElementRef !== void 0 && hasElementRef.current)) {
       handleSubmit === null || handleSubmit === void 0 ? void 0 : handleSubmit();
     }
-  }, [isInsideFormElement, handleSubmit]);
+  }, [hasElementRef, handleSubmit]);
   return React.createElement(Button, _extends({
     className: classnames('dnb-forms-submit-button', className),
     onClick: onClickHandler,

package/es/extensions/forms/Form/SubmitButton/SubmitButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubmitButton.js","names":["React","useCallback","useContext","classnames","DataContext","Button","SubmitIndicator","useTranslation","send","SubmitButton","props","translations","variant","className","showIndicator","children","text","rest","_objectWithoutProperties","_excluded","content","sendText","formState","handleSubmit","isInsideFormElement","dataContextProps","isolate","onClickHandler","createElement","_extends","onClick","type","icon","state","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/SubmitButton/SubmitButton.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport classnames from 'classnames'\nimport type { ComponentProps } from '../../types'\nimport DataContext from '../../DataContext/Context'\nimport Button, { ButtonProps } from '../../../../components/button/Button'\nimport SubmitIndicator from '../SubmitIndicator'\nimport useTranslation from '../../hooks/useTranslation'\nimport { send } from '../../../../icons'\n\nexport type Props = {\n  /**\n   * Show the submit indicator\n   */\n  showIndicator?: boolean\n} & ComponentProps &\n  Omit<ButtonProps, 'variant'> &\n  Partial<React.HTMLAttributes<HTMLButtonElement | HTMLAnchorElement>> & {\n    variant?: 'send'\n  }\n\nfunction SubmitButton(props: Props) {\n  const translations = useTranslation().SubmitButton\n\n  const { variant, className, showIndicator, children, text, ...rest } =\n    props\n\n  const content =\n    text ||\n    children ||\n    (variant === 'send' ? translations.sendText : translations.text)\n\n  const {\n    formState,\n    handleSubmit,\n    isInsideFormElement,\n    props: dataContextProps,\n  } = useContext(DataContext) || {}\n  const { isolate } = dataContextProps || {}\n\n  const onClickHandler = useCallback(() => {\n    if (!isInsideFormElement) {\n      handleSubmit?.()\n    }\n  }, [isInsideFormElement, handleSubmit])\n\n  return (\n    <Button\n      className={classnames('dnb-forms-submit-button', className)}\n      onClick={onClickHandler}\n      type={isolate ? 'button' : 'submit'}\n      icon={variant === 'send' ? send : null}\n      {...rest}\n    >\n      {content}\n\n      <SubmitIndicator state={showIndicator ? 'pending' : formState} />\n    </Button>\n  )\n}\n\nSubmitButton._supportsSpacingProps = true\nexport default SubmitButton\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,UAAU,MAAM,YAAY;AAEnC,OAAOC,WAAW,MAAM,2BAA2B;AACnD,OAAOC,MAAM,MAAuB,sCAAsC;AAC1E,OAAOC,eAAe,MAAM,oBAAoB;AAChD,OAAOC,cAAc,MAAM,4BAA4B;AACvD,SAASC,IAAI,QAAQ,mBAAmB;AAaxC,SAASC,YAAYA,CAACC,KAAY,EAAE;EAClC,MAAMC,YAAY,GAAGJ,cAAc,CAAC,CAAC,CAACE,YAAY;EAElD,MAAM;MAAEG,OAAO;MAAEC,SAAS;MAAEC,aAAa;MAAEC,QAAQ;MAAEC;IAAc,CAAC,GAClEN,KAAK;IADuDO,IAAI,GAAAC,wBAAA,CAChER,KAAK,EAAAS,SAAA;EAEP,MAAMC,OAAO,GACXJ,IAAI,IACJD,QAAQ,KACPH,OAAO,KAAK,MAAM,GAAGD,YAAY,CAACU,QAAQ,GAAGV,YAAY,CAACK,IAAI,CAAC;EAElE,MAAM;IACJM,SAAS;IACTC,YAAY;IACZC,mBAAmB;IACnBd,KAAK,EAAEe;EACT,CAAC,GAAGvB,UAAU,CAACE,WAAW,CAAC,IAAI,CAAC,CAAC;EACjC,MAAM;IAAEsB;EAAQ,CAAC,GAAGD,gBAAgB,IAAI,CAAC,CAAC;EAE1C,MAAME,cAAc,GAAG1B,WAAW,CAAC,MAAM;IACvC,IAAI,CAACuB,mBAAmB,EAAE;MACxBD,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAG,CAAC;IAClB;EACF,CAAC,EAAE,CAACC,mBAAmB,EAAED,YAAY,CAAC,CAAC;EAEvC,OACEvB,KAAA,CAAA4B,aAAA,CAACvB,MAAM,EAAAwB,QAAA;IACLhB,SAAS,EAAEV,UAAU,CAAC,yBAAyB,EAAEU,SAAS,CAAE;IAC5DiB,OAAO,EAAEH,cAAe;IACxBI,IAAI,EAAEL,OAAO,GAAG,QAAQ,GAAG,QAAS;IACpCM,IAAI,EAAEpB,OAAO,KAAK,MAAM,GAAGJ,IAAI,GAAG;EAAK,GACnCS,IAAI,GAEPG,OAAO,EAERpB,KAAA,CAAA4B,aAAA,CAACtB,eAAe;IAAC2B,KAAK,EAAEnB,aAAa,GAAG,SAAS,GAAGQ;EAAU,CAAE,CAC1D,CAAC;AAEb;AAEAb,YAAY,CAACyB,qBAAqB,GAAG,IAAI;AACzC,eAAezB,YAAY"}
+{"version":3,"file":"SubmitButton.js","names":["React","useCallback","useContext","classnames","DataContext","Button","SubmitIndicator","useTranslation","send","SubmitButton","props","translations","variant","className","showIndicator","children","text","rest","_objectWithoutProperties","_excluded","content","sendText","formState","handleSubmit","hasElementRef","dataContextProps","isolate","onClickHandler","current","createElement","_extends","onClick","type","icon","state","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Form/SubmitButton/SubmitButton.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react'\nimport classnames from 'classnames'\nimport type { ComponentProps } from '../../types'\nimport DataContext from '../../DataContext/Context'\nimport Button, { ButtonProps } from '../../../../components/button/Button'\nimport SubmitIndicator from '../SubmitIndicator'\nimport useTranslation from '../../hooks/useTranslation'\nimport { send } from '../../../../icons'\n\nexport type Props = {\n  /**\n   * Show the submit indicator\n   */\n  showIndicator?: boolean\n} & ComponentProps &\n  Omit<ButtonProps, 'variant'> &\n  Partial<React.HTMLAttributes<HTMLButtonElement | HTMLAnchorElement>> & {\n    variant?: 'send'\n  }\n\nfunction SubmitButton(props: Props) {\n  const translations = useTranslation().SubmitButton\n\n  const { variant, className, showIndicator, children, text, ...rest } =\n    props\n\n  const content =\n    text ||\n    children ||\n    (variant === 'send' ? translations.sendText : translations.text)\n\n  const {\n    formState,\n    handleSubmit,\n    hasElementRef,\n    props: dataContextProps,\n  } = useContext(DataContext) || {}\n  const { isolate } = dataContextProps || {}\n\n  const onClickHandler = useCallback(() => {\n    if (!hasElementRef?.current) {\n      handleSubmit?.()\n    }\n  }, [hasElementRef, handleSubmit])\n\n  return (\n    <Button\n      className={classnames('dnb-forms-submit-button', className)}\n      onClick={onClickHandler}\n      type={isolate ? 'button' : 'submit'}\n      icon={variant === 'send' ? send : null}\n      {...rest}\n    >\n      {content}\n\n      <SubmitIndicator state={showIndicator ? 'pending' : formState} />\n    </Button>\n  )\n}\n\nSubmitButton._supportsSpacingProps = true\nexport default SubmitButton\n"],"mappings":";;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,UAAU,MAAM,YAAY;AAEnC,OAAOC,WAAW,MAAM,2BAA2B;AACnD,OAAOC,MAAM,MAAuB,sCAAsC;AAC1E,OAAOC,eAAe,MAAM,oBAAoB;AAChD,OAAOC,cAAc,MAAM,4BAA4B;AACvD,SAASC,IAAI,QAAQ,mBAAmB;AAaxC,SAASC,YAAYA,CAACC,KAAY,EAAE;EAClC,MAAMC,YAAY,GAAGJ,cAAc,CAAC,CAAC,CAACE,YAAY;EAElD,MAAM;MAAEG,OAAO;MAAEC,SAAS;MAAEC,aAAa;MAAEC,QAAQ;MAAEC;IAAc,CAAC,GAClEN,KAAK;IADuDO,IAAI,GAAAC,wBAAA,CAChER,KAAK,EAAAS,SAAA;EAEP,MAAMC,OAAO,GACXJ,IAAI,IACJD,QAAQ,KACPH,OAAO,KAAK,MAAM,GAAGD,YAAY,CAACU,QAAQ,GAAGV,YAAY,CAACK,IAAI,CAAC;EAElE,MAAM;IACJM,SAAS;IACTC,YAAY;IACZC,aAAa;IACbd,KAAK,EAAEe;EACT,CAAC,GAAGvB,UAAU,CAACE,WAAW,CAAC,IAAI,CAAC,CAAC;EACjC,MAAM;IAAEsB;EAAQ,CAAC,GAAGD,gBAAgB,IAAI,CAAC,CAAC;EAE1C,MAAME,cAAc,GAAG1B,WAAW,CAAC,MAAM;IACvC,IAAI,EAACuB,aAAa,aAAbA,aAAa,eAAbA,aAAa,CAAEI,OAAO,GAAE;MAC3BL,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAG,CAAC;IAClB;EACF,CAAC,EAAE,CAACC,aAAa,EAAED,YAAY,CAAC,CAAC;EAEjC,OACEvB,KAAA,CAAA6B,aAAA,CAACxB,MAAM,EAAAyB,QAAA;IACLjB,SAAS,EAAEV,UAAU,CAAC,yBAAyB,EAAEU,SAAS,CAAE;IAC5DkB,OAAO,EAAEJ,cAAe;IACxBK,IAAI,EAAEN,OAAO,GAAG,QAAQ,GAAG,QAAS;IACpCO,IAAI,EAAErB,OAAO,KAAK,MAAM,GAAGJ,IAAI,GAAG;EAAK,GACnCS,IAAI,GAEPG,OAAO,EAERpB,KAAA,CAAA6B,aAAA,CAACvB,eAAe;IAAC4B,KAAK,EAAEpB,aAAa,GAAG,SAAS,GAAGQ;EAAU,CAAE,CAC1D,CAAC;AAEb;AAEAb,YAAY,CAAC0B,qBAAqB,GAAG,IAAI;AACzC,eAAe1B,YAAY"}

package/es/extensions/forms/Form/data-context/clearData.d.ts

@@ -1 +1,2 @@
-export default function clearData(id: string): void;
+import { SharedStateId } from '../../../../shared/helpers/useSharedState';
+export default function clearData(id: SharedStateId): void;

package/es/extensions/forms/Form/data-context/clearData.js

@@ -1,7 +1,7 @@
-import { createSharedState } from '../../../../shared/helpers/useSharedState';
+import { createReferenceKey, createSharedState } from '../../../../shared/helpers/useSharedState';
 export default function clearData(id) {
   var _sharedAttachments$da, _sharedAttachments$da2;
-  const sharedAttachments = createSharedState(id + '-attachments');
+  const sharedAttachments = createSharedState(createReferenceKey(id, 'attachments'));
   (_sharedAttachments$da = (_sharedAttachments$da2 = sharedAttachments.data).clearData) === null || _sharedAttachments$da === void 0 ? void 0 : _sharedAttachments$da.call(_sharedAttachments$da2);
 }
 //# sourceMappingURL=clearData.js.map

package/es/extensions/forms/Form/data-context/clearData.js.map

@@ -1 +1 @@
-{"version":3,"file":"clearData.js","names":["createSharedState","clearData","id","_sharedAttachments$da","_sharedAttachments$da2","sharedAttachments","data","call"],"sources":["../../../../../../src/extensions/forms/Form/data-context/clearData.ts"],"sourcesContent":["import { createSharedState } from '../../../../shared/helpers/useSharedState'\nimport { SharedAttachments } from '../../DataContext/Provider'\n\nexport default function clearData(id: string) {\n  const sharedAttachments = createSharedState<SharedAttachments<unknown>>(\n    id + '-attachments'\n  )\n  sharedAttachments.data.clearData?.()\n}\n"],"mappings":"AAAA,SAASA,iBAAiB,QAAQ,2CAA2C;AAG7E,eAAe,SAASC,SAASA,CAACC,EAAU,EAAE;EAAA,IAAAC,qBAAA,EAAAC,sBAAA;EAC5C,MAAMC,iBAAiB,GAAGL,iBAAiB,CACzCE,EAAE,GAAG,cACP,CAAC;EACD,CAAAC,qBAAA,IAAAC,sBAAA,GAAAC,iBAAiB,CAACC,IAAI,EAACL,SAAS,cAAAE,qBAAA,uBAAhCA,qBAAA,CAAAI,IAAA,CAAAH,sBAAmC,CAAC;AACtC"}
+{"version":3,"file":"clearData.js","names":["createReferenceKey","createSharedState","clearData","id","_sharedAttachments$da","_sharedAttachments$da2","sharedAttachments","data","call"],"sources":["../../../../../../src/extensions/forms/Form/data-context/clearData.ts"],"sourcesContent":["import {\n  SharedStateId,\n  createReferenceKey,\n  createSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport { SharedAttachments } from '../../DataContext/Provider'\n\nexport default function clearData(id: SharedStateId) {\n  const sharedAttachments = createSharedState<SharedAttachments<unknown>>(\n    createReferenceKey(id, 'attachments')\n  )\n  sharedAttachments.data.clearData?.()\n}\n"],"mappings":"AAAA,SAEEA,kBAAkB,EAClBC,iBAAiB,QACZ,2CAA2C;AAGlD,eAAe,SAASC,SAASA,CAACC,EAAiB,EAAE;EAAA,IAAAC,qBAAA,EAAAC,sBAAA;EACnD,MAAMC,iBAAiB,GAAGL,iBAAiB,CACzCD,kBAAkB,CAACG,EAAE,EAAE,aAAa,CACtC,CAAC;EACD,CAAAC,qBAAA,IAAAC,sBAAA,GAAAC,iBAAiB,CAACC,IAAI,EAACL,SAAS,cAAAE,qBAAA,uBAAhCA,qBAAA,CAAAI,IAAA,CAAAH,sBAAmC,CAAC;AACtC"}

package/es/extensions/forms/Form/data-context/getData.js

@@ -1,8 +1,8 @@
 import pointer from '../../utils/json-pointer';
-import { createSharedState } from '../../../../shared/helpers/useSharedState';
+import { createReferenceKey, createSharedState } from '../../../../shared/helpers/useSharedState';
 export default function getData(id) {
   const sharedState = createSharedState(id);
-  const sharedAttachments = createSharedState(id + '-attachments');
+  const sharedAttachments = createSharedState(createReferenceKey(id, 'attachments'));
   const data = sharedState.get();
   const filterData = filter => {
     var _sharedAttachments$da, _sharedAttachments$da2;

package/es/extensions/forms/Form/data-context/getData.js.map

@@ -1 +1 @@
-{"version":3,"file":"getData.js","names":["pointer","createSharedState","getData","id","sharedState","sharedAttachments","data","get","filterData","filter","_sharedAttachments$da","_sharedAttachments$da2","filterDataHandler","call","reduceToVisibleFields","options","_sharedAttachments$da3","_sharedAttachments$da4","visibleDataHandler","getValue","path","has","undefined"],"sources":["../../../../../../src/extensions/forms/Form/data-context/getData.tsx"],"sourcesContent":["import pointer from '../../utils/json-pointer'\nimport {\n  SharedStateId,\n  createSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport { SharedAttachments } from '../../DataContext/Provider'\nimport type { Path } from '../../types'\nimport type {\n  UseDataReturnGetValue,\n  UseDataReturnFilterData,\n  UseDataReturnVisibleData,\n} from './useData'\n\ntype SetDataReturn<Data> = {\n  data: Data\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n  reduceToVisibleFields: UseDataReturnVisibleData<Data>\n}\n\nexport default function getData<Data>(\n  id: SharedStateId\n): SetDataReturn<Data> {\n  const sharedState = createSharedState(id)\n  const sharedAttachments = createSharedState<SharedAttachments<Data>>(\n    id + '-attachments'\n  )\n\n  const data = sharedState.get() as Data\n\n  const filterData: SetDataReturn<Data>['filterData'] = (filter) =>\n    sharedAttachments.data?.filterDataHandler?.(data, filter)\n\n  const reduceToVisibleFields: SetDataReturn<Data>['reduceToVisibleFields'] =\n    (data, options) =>\n      sharedAttachments.data?.visibleDataHandler?.(data, options)\n\n  const getValue = (path: Path) => {\n    if (pointer.has(data, path)) {\n      return pointer.get(data, path)\n    }\n\n    return undefined\n  }\n\n  return {\n    data,\n    getValue,\n    filterData,\n    reduceToVisibleFields,\n  }\n}\n"],"mappings":"AAAA,OAAOA,OAAO,MAAM,0BAA0B;AAC9C,SAEEC,iBAAiB,QACZ,2CAA2C;AAgBlD,eAAe,SAASC,OAAOA,CAC7BC,EAAiB,EACI;EACrB,MAAMC,WAAW,GAAGH,iBAAiB,CAACE,EAAE,CAAC;EACzC,MAAME,iBAAiB,GAAGJ,iBAAiB,CACzCE,EAAE,GAAG,cACP,CAAC;EAED,MAAMG,IAAI,GAAGF,WAAW,CAACG,GAAG,CAAC,CAAS;EAEtC,MAAMC,UAA6C,GAAIC,MAAM;IAAA,IAAAC,qBAAA,EAAAC,sBAAA;IAAA,QAAAD,qBAAA,GAC3DL,iBAAiB,CAACC,IAAI,cAAAI,qBAAA,wBAAAC,sBAAA,GAAtBD,qBAAA,CAAwBE,iBAAiB,cAAAD,sBAAA,uBAAzCA,sBAAA,CAAAE,IAAA,CAAAH,qBAAA,EAA4CJ,IAAI,EAAEG,MAAM,CAAC;EAAA;EAE3D,MAAMK,qBAAmE,GACvEA,CAACR,IAAI,EAAES,OAAO;IAAA,IAAAC,sBAAA,EAAAC,sBAAA;IAAA,QAAAD,sBAAA,GACZX,iBAAiB,CAACC,IAAI,cAAAU,sBAAA,wBAAAC,sBAAA,GAAtBD,sBAAA,CAAwBE,kBAAkB,cAAAD,sBAAA,uBAA1CA,sBAAA,CAAAJ,IAAA,CAAAG,sBAAA,EAA6CV,IAAI,EAAES,OAAO,CAAC;EAAA;EAE/D,MAAMI,QAAQ,GAAIC,IAAU,IAAK;IAC/B,IAAIpB,OAAO,CAACqB,GAAG,CAACf,IAAI,EAAEc,IAAI,CAAC,EAAE;MAC3B,OAAOpB,OAAO,CAACO,GAAG,CAACD,IAAI,EAAEc,IAAI,CAAC;IAChC;IAEA,OAAOE,SAAS;EAClB,CAAC;EAED,OAAO;IACLhB,IAAI;IACJa,QAAQ;IACRX,UAAU;IACVM;EACF,CAAC;AACH"}
+{"version":3,"file":"getData.js","names":["pointer","createReferenceKey","createSharedState","getData","id","sharedState","sharedAttachments","data","get","filterData","filter","_sharedAttachments$da","_sharedAttachments$da2","filterDataHandler","call","reduceToVisibleFields","options","_sharedAttachments$da3","_sharedAttachments$da4","visibleDataHandler","getValue","path","has","undefined"],"sources":["../../../../../../src/extensions/forms/Form/data-context/getData.tsx"],"sourcesContent":["import pointer from '../../utils/json-pointer'\nimport {\n  SharedStateId,\n  createReferenceKey,\n  createSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport { SharedAttachments } from '../../DataContext/Provider'\nimport type { Path } from '../../types'\nimport type {\n  UseDataReturnGetValue,\n  UseDataReturnFilterData,\n  UseDataReturnVisibleData,\n} from './useData'\n\ntype SetDataReturn<Data> = {\n  data: Data\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n  reduceToVisibleFields: UseDataReturnVisibleData<Data>\n}\n\nexport default function getData<Data>(\n  id: SharedStateId\n): SetDataReturn<Data> {\n  const sharedState = createSharedState(id)\n  const sharedAttachments = createSharedState<SharedAttachments<Data>>(\n    createReferenceKey(id, 'attachments')\n  )\n\n  const data = sharedState.get() as Data\n\n  const filterData: SetDataReturn<Data>['filterData'] = (filter) =>\n    sharedAttachments.data?.filterDataHandler?.(data, filter)\n\n  const reduceToVisibleFields: SetDataReturn<Data>['reduceToVisibleFields'] =\n    (data, options) =>\n      sharedAttachments.data?.visibleDataHandler?.(data, options)\n\n  const getValue = (path: Path) => {\n    if (pointer.has(data, path)) {\n      return pointer.get(data, path)\n    }\n\n    return undefined\n  }\n\n  return {\n    data,\n    getValue,\n    filterData,\n    reduceToVisibleFields,\n  }\n}\n"],"mappings":"AAAA,OAAOA,OAAO,MAAM,0BAA0B;AAC9C,SAEEC,kBAAkB,EAClBC,iBAAiB,QACZ,2CAA2C;AAgBlD,eAAe,SAASC,OAAOA,CAC7BC,EAAiB,EACI;EACrB,MAAMC,WAAW,GAAGH,iBAAiB,CAACE,EAAE,CAAC;EACzC,MAAME,iBAAiB,GAAGJ,iBAAiB,CACzCD,kBAAkB,CAACG,EAAE,EAAE,aAAa,CACtC,CAAC;EAED,MAAMG,IAAI,GAAGF,WAAW,CAACG,GAAG,CAAC,CAAS;EAEtC,MAAMC,UAA6C,GAAIC,MAAM;IAAA,IAAAC,qBAAA,EAAAC,sBAAA;IAAA,QAAAD,qBAAA,GAC3DL,iBAAiB,CAACC,IAAI,cAAAI,qBAAA,wBAAAC,sBAAA,GAAtBD,qBAAA,CAAwBE,iBAAiB,cAAAD,sBAAA,uBAAzCA,sBAAA,CAAAE,IAAA,CAAAH,qBAAA,EAA4CJ,IAAI,EAAEG,MAAM,CAAC;EAAA;EAE3D,MAAMK,qBAAmE,GACvEA,CAACR,IAAI,EAAES,OAAO;IAAA,IAAAC,sBAAA,EAAAC,sBAAA;IAAA,QAAAD,sBAAA,GACZX,iBAAiB,CAACC,IAAI,cAAAU,sBAAA,wBAAAC,sBAAA,GAAtBD,sBAAA,CAAwBE,kBAAkB,cAAAD,sBAAA,uBAA1CA,sBAAA,CAAAJ,IAAA,CAAAG,sBAAA,EAA6CV,IAAI,EAAES,OAAO,CAAC;EAAA;EAE/D,MAAMI,QAAQ,GAAIC,IAAU,IAAK;IAC/B,IAAIrB,OAAO,CAACsB,GAAG,CAACf,IAAI,EAAEc,IAAI,CAAC,EAAE;MAC3B,OAAOrB,OAAO,CAACQ,GAAG,CAACD,IAAI,EAAEc,IAAI,CAAC;IAChC;IAEA,OAAOE,SAAS;EAClB,CAAC;EAED,OAAO;IACLhB,IAAI;IACJa,QAAQ;IACRX,UAAU;IACVM;EACF,CAAC;AACH"}

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

@@ -2,7 +2,7 @@
 
 import { useCallback, useContext, useMemo, useReducer, useRef } from 'react';
 import pointer from '../../utils/json-pointer';
-import { useSharedState } from '../../../../shared/helpers/useSharedState';
+import { createReferenceKey, useSharedState } from '../../../../shared/helpers/useSharedState';
 import useMountEffect from '../../../../shared/helpers/useMountEffect';
 import DataContext from '../../DataContext/Context';
 import structuredClone from '@ungap/structured-clone';
@@ -11,7 +11,7 @@ export default function useData(id = undefined, initialData = undefined) {
   const sharedAttachmentsRef = useRef(null);
   const [, forceUpdate] = useReducer(() => ({}), {});
   sharedDataRef.current = useSharedState(id, initialData, forceUpdate);
-  sharedAttachmentsRef.current = useSharedState(id + '-attachments', {
+  sharedAttachmentsRef.current = useSharedState(createReferenceKey(id, 'attachments'), {
     rerenderUseDataHook: forceUpdate
   });
   const dataContext = useContext(DataContext);

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

@@ -1 +1 @@
-{"version":3,"file":"useData.js","names":["useCallback","useContext","useMemo","useReducer","useRef","pointer","useSharedState","useMountEffect","DataContext","structuredClone","useData","id","undefined","initialData","sharedDataRef","sharedAttachmentsRef","forceUpdate","current","rerenderUseDataHook","dataContext","hasContext","Error","data","filterDataHandler","updateDataValue","setData","set","newData","update","path","value","existingData","existingValue","has","get","newValue","extend","remove","reduceToVisibleFields","options","_dataContext$visibleD","_sharedAttachmentsRef","_sharedAttachmentsRef2","visibleDataHandler","call","filterData","filter","_dataContext$filterDa","_sharedAttachmentsRef3","_sharedAttachmentsRef4","getValue","hadInitialData"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useData.tsx"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport pointer, { JsonObject } from '../../utils/json-pointer'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport type { Path } from '../../types'\nimport DataContext, {\n  FilterData,\n  VisibleDataHandler,\n} from '../../DataContext/Context'\nimport { SharedAttachments } from '../../DataContext/Provider'\n\n/**\n * Deprecated, as it is supported by all major browsers and Node.js >=v18\n * So it's a question of time, when we will remove this polyfill\n */\nimport structuredClone from '@ungap/structured-clone'\n\ntype PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}`\n  ? Key extends keyof T\n    ? Rest extends ''\n      ? T[Key]\n      : PathImpl<T[Key], Rest>\n    : never\n  : T[P & keyof T]\n\ntype PathType<T, P extends string> = P extends `/${infer Rest}`\n  ? PathImpl<T, Rest>\n  : never\n\ntype UseDataReturnUpdate<Data> = <P extends Path>(\n  path: P,\n  value: ((value: PathType<Data, P>) => unknown) | unknown\n) => void\n\nexport type UseDataReturnGetValue<Data> = <P extends Path>(\n  path: P\n) => PathType<Data, P> | any\n\nexport type UseDataReturnFilterData<Data> = (\n  filterDataHandler: FilterData,\n  data?: Data\n) => Partial<Data>\n\nexport type UseDataReturnVisibleData<Data> = VisibleDataHandler<Data>\n\ntype UseDataReturn<Data> = {\n  data: Data\n  set: (newData: Data) => void\n  update: UseDataReturnUpdate<Data>\n  remove: (path: Path) => void\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n  reduceToVisibleFields: UseDataReturnVisibleData<Data>\n}\n\n/**\n * Custom hook that provides form data management functionality.\n *\n * @template Data - The type of data being managed.\n * @param {SharedStateId} id - The identifier for the data.\n * @param {Data} initialData - The initial data value (optional).\n * @returns {UseDataReturn<Data>} An object containing the data and data management functions.\n */\nexport default function useData<Data = JsonObject>(\n  id: SharedStateId = undefined,\n  initialData: Data = undefined\n): UseDataReturn<Data> {\n  const sharedDataRef =\n    useRef<ReturnType<typeof useSharedState<Data>>>(null)\n  const sharedAttachmentsRef =\n    useRef<ReturnType<typeof useSharedState<SharedAttachments<Data>>>>(\n      null\n    )\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  sharedDataRef.current = useSharedState<Data>(\n    id,\n    initialData,\n    forceUpdate\n  )\n\n  sharedAttachmentsRef.current = useSharedState<SharedAttachments<Data>>(\n    id + '-attachments',\n    { rerenderUseDataHook: forceUpdate }\n  )\n\n  // If no id is provided, use the context data\n  const dataContext = useContext(DataContext)\n  if (!id) {\n    if (!dataContext.hasContext) {\n      throw new Error(\n        'useData needs to run inside DataContext (Form.Handler) or have a valid id'\n      )\n    }\n\n    sharedDataRef.current.data = dataContext.data\n    sharedAttachmentsRef.current.data.filterDataHandler =\n      dataContext.filterDataHandler\n  }\n\n  const updateDataValue = dataContext?.updateDataValue\n  const setData = dataContext?.setData\n\n  const set = useCallback(\n    (newData: Data) => {\n      if (id) {\n        sharedDataRef.current.update(newData)\n      } else {\n        setData?.(newData)\n      }\n    },\n    [id, setData]\n  )\n\n  const update = useCallback<UseDataReturnUpdate<Data>>(\n    (path, value = undefined) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n      const existingValue = pointer.has(existingData, path)\n        ? pointer.get(existingData, path)\n        : undefined\n\n      // Get new value\n      const newValue =\n        typeof value === 'function' ? value(existingValue) : value\n\n      if (newValue !== existingValue) {\n        // Update existing data\n        pointer.set(existingData, path, newValue)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.extend(existingData)\n        } else {\n          updateDataValue(path, newValue)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const remove = useCallback<UseDataReturn<Data>['remove']>(\n    (path) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n\n      if (pointer.has(existingData, path)) {\n        // Remove existing data\n        pointer.remove(existingData, path)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.set(existingData)\n        } else {\n          updateDataValue(path, undefined)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const reduceToVisibleFields = useCallback<\n    UseDataReturn<Data>['reduceToVisibleFields']\n  >(\n    (data, options = {}) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.visibleDataHandler?.(\n          data,\n          options\n        )\n      }\n\n      return dataContext?.visibleDataHandler?.(data, options)\n    },\n    [dataContext, id]\n  )\n\n  const filterData = useCallback<UseDataReturn<Data>['filterData']>(\n    (filter, data = sharedDataRef.current.data) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.filterDataHandler?.(\n          data,\n          filter\n        )\n      }\n\n      return dataContext?.filterDataHandler?.(data, filter)\n    },\n    [dataContext, id]\n  )\n\n  const getValue = useCallback<UseDataReturn<Data>['getValue']>((path) => {\n    if (pointer.has(sharedDataRef.current.data, path)) {\n      return pointer.get(sharedDataRef.current.data, path)\n    }\n\n    return undefined\n  }, [])\n\n  useMountEffect(() => {\n    if (id && !sharedDataRef.current.hadInitialData && initialData) {\n      sharedDataRef.current.extend(initialData)\n    }\n  })\n\n  const { data } = sharedDataRef.current\n\n  return useMemo(\n    () => ({\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    }),\n    [\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    ]\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"useData.js","names":["useCallback","useContext","useMemo","useReducer","useRef","pointer","createReferenceKey","useSharedState","useMountEffect","DataContext","structuredClone","useData","id","undefined","initialData","sharedDataRef","sharedAttachmentsRef","forceUpdate","current","rerenderUseDataHook","dataContext","hasContext","Error","data","filterDataHandler","updateDataValue","setData","set","newData","update","path","value","existingData","existingValue","has","get","newValue","extend","remove","reduceToVisibleFields","options","_dataContext$visibleD","_sharedAttachmentsRef","_sharedAttachmentsRef2","visibleDataHandler","call","filterData","filter","_dataContext$filterDa","_sharedAttachmentsRef3","_sharedAttachmentsRef4","getValue","hadInitialData"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useData.tsx"],"sourcesContent":["import {\n  useCallback,\n  useContext,\n  useMemo,\n  useReducer,\n  useRef,\n} from 'react'\nimport pointer, { JsonObject } from '../../utils/json-pointer'\nimport {\n  SharedStateId,\n  createReferenceKey,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport useMountEffect from '../../../../shared/helpers/useMountEffect'\nimport type { Path } from '../../types'\nimport DataContext, {\n  FilterData,\n  VisibleDataHandler,\n} from '../../DataContext/Context'\nimport { SharedAttachments } from '../../DataContext/Provider'\n\n/**\n * Deprecated, as it is supported by all major browsers and Node.js >=v18\n * So it's a question of time, when we will remove this polyfill\n */\nimport structuredClone from '@ungap/structured-clone'\n\ntype PathImpl<T, P extends string> = P extends `${infer Key}/${infer Rest}`\n  ? Key extends keyof T\n    ? Rest extends ''\n      ? T[Key]\n      : PathImpl<T[Key], Rest>\n    : never\n  : T[P & keyof T]\n\ntype PathType<T, P extends string> = P extends `/${infer Rest}`\n  ? PathImpl<T, Rest>\n  : never\n\ntype UseDataReturnUpdate<Data> = <P extends Path>(\n  path: P,\n  value: ((value: PathType<Data, P>) => unknown) | unknown\n) => void\n\nexport type UseDataReturnGetValue<Data> = <P extends Path>(\n  path: P\n) => PathType<Data, P> | any\n\nexport type UseDataReturnFilterData<Data> = (\n  filterDataHandler: FilterData,\n  data?: Data\n) => Partial<Data>\n\nexport type UseDataReturnVisibleData<Data> = VisibleDataHandler<Data>\n\ntype UseDataReturn<Data> = {\n  data: Data\n  set: (newData: Data) => void\n  update: UseDataReturnUpdate<Data>\n  remove: (path: Path) => void\n  getValue: UseDataReturnGetValue<Data>\n  filterData: UseDataReturnFilterData<Data>\n  reduceToVisibleFields: UseDataReturnVisibleData<Data>\n}\n\n/**\n * Custom hook that provides form data management functionality.\n *\n * @template Data - The type of data being managed.\n * @param {SharedStateId} id - The identifier for the data.\n * @param {Data} initialData - The initial data value (optional).\n * @returns {UseDataReturn<Data>} An object containing the data and data management functions.\n */\nexport default function useData<Data = JsonObject>(\n  id: SharedStateId = undefined,\n  initialData: Data = undefined\n): UseDataReturn<Data> {\n  const sharedDataRef =\n    useRef<ReturnType<typeof useSharedState<Data>>>(null)\n  const sharedAttachmentsRef =\n    useRef<ReturnType<typeof useSharedState<SharedAttachments<Data>>>>(\n      null\n    )\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  sharedDataRef.current = useSharedState<Data>(\n    id,\n    initialData,\n    forceUpdate\n  )\n\n  sharedAttachmentsRef.current = useSharedState<SharedAttachments<Data>>(\n    createReferenceKey(id, 'attachments'),\n    { rerenderUseDataHook: forceUpdate }\n  )\n\n  // If no id is provided, use the context data\n  const dataContext = useContext(DataContext)\n  if (!id) {\n    if (!dataContext.hasContext) {\n      throw new Error(\n        'useData needs to run inside DataContext (Form.Handler) or have a valid id'\n      )\n    }\n\n    sharedDataRef.current.data = dataContext.data\n    sharedAttachmentsRef.current.data.filterDataHandler =\n      dataContext.filterDataHandler\n  }\n\n  const updateDataValue = dataContext?.updateDataValue\n  const setData = dataContext?.setData\n\n  const set = useCallback(\n    (newData: Data) => {\n      if (id) {\n        sharedDataRef.current.update(newData)\n      } else {\n        setData?.(newData)\n      }\n    },\n    [id, setData]\n  )\n\n  const update = useCallback<UseDataReturnUpdate<Data>>(\n    (path, value = undefined) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n      const existingValue = pointer.has(existingData, path)\n        ? pointer.get(existingData, path)\n        : undefined\n\n      // Get new value\n      const newValue =\n        typeof value === 'function' ? value(existingValue) : value\n\n      if (newValue !== existingValue) {\n        // Update existing data\n        pointer.set(existingData, path, newValue)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.extend(existingData)\n        } else {\n          updateDataValue(path, newValue)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const remove = useCallback<UseDataReturn<Data>['remove']>(\n    (path) => {\n      const existingData = structuredClone(\n        sharedDataRef.current.data || {}\n      ) as Data & JsonObject\n\n      if (pointer.has(existingData, path)) {\n        // Remove existing data\n        pointer.remove(existingData, path)\n\n        // Update provider with new data\n        if (id) {\n          sharedDataRef.current.set(existingData)\n        } else {\n          updateDataValue(path, undefined)\n        }\n      }\n    },\n    [id, updateDataValue]\n  )\n\n  const reduceToVisibleFields = useCallback<\n    UseDataReturn<Data>['reduceToVisibleFields']\n  >(\n    (data, options = {}) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.visibleDataHandler?.(\n          data,\n          options\n        )\n      }\n\n      return dataContext?.visibleDataHandler?.(data, options)\n    },\n    [dataContext, id]\n  )\n\n  const filterData = useCallback<UseDataReturn<Data>['filterData']>(\n    (filter, data = sharedDataRef.current.data) => {\n      if (id) {\n        return sharedAttachmentsRef.current.data?.filterDataHandler?.(\n          data,\n          filter\n        )\n      }\n\n      return dataContext?.filterDataHandler?.(data, filter)\n    },\n    [dataContext, id]\n  )\n\n  const getValue = useCallback<UseDataReturn<Data>['getValue']>((path) => {\n    if (pointer.has(sharedDataRef.current.data, path)) {\n      return pointer.get(sharedDataRef.current.data, path)\n    }\n\n    return undefined\n  }, [])\n\n  useMountEffect(() => {\n    if (id && !sharedDataRef.current.hadInitialData && initialData) {\n      sharedDataRef.current.extend(initialData)\n    }\n  })\n\n  const { data } = sharedDataRef.current\n\n  return useMemo(\n    () => ({\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    }),\n    [\n      data,\n      remove,\n      update,\n      set,\n      getValue,\n      reduceToVisibleFields,\n      filterData,\n    ]\n  )\n}\n"],"mappings":"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"}

package/es/extensions/forms/Form/data-context/useValidation.js

@@ -1,12 +1,12 @@
 "use client";
 
 import { useCallback, useContext, useMemo } from 'react';
-import { useSharedState } from '../../../../shared/helpers/useSharedState';
+import { createReferenceKey, useSharedState } from '../../../../shared/helpers/useSharedState';
 import DataContext from '../../DataContext/Context';
 export default function useValidation(id = undefined) {
   const {
     data
-  } = useSharedState(id + '-attachments');
+  } = useSharedState(createReferenceKey(id, 'attachments'));
   const fallback = useCallback(() => false, []);
   const context = useContext(DataContext);
   const hasErrors = (data === null || data === void 0 ? void 0 : data.hasErrors) || !id && (context === null || context === void 0 ? void 0 : context.hasErrors) || fallback;
@@ -35,7 +35,7 @@ export default function useValidation(id = undefined) {
 function useConnections(id = undefined) {
   const {
     get
-  } = useSharedState(id + '-attachments');
+  } = useSharedState(createReferenceKey(id, 'attachments'));
   const dataContext = useContext(DataContext);
   const {
     fieldConnectionsRef

package/es/extensions/forms/Form/data-context/useValidation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useValidation.js","names":["useCallback","useContext","useMemo","useSharedState","DataContext","useValidation","id","undefined","data","fallback","context","hasErrors","hasFieldError","setSubmitState","setFormError","error","getFieldConnections","useConnections","setFieldStatus","path","status","_connections$path","_connections$path$set","connections","setEventResult","call","get","dataContext","fieldConnectionsRef","attachments","current"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useValidation.tsx"],"sourcesContent":["import { useCallback, useContext, useMemo } from 'react'\nimport {\n  SharedStateId,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport DataContext, { ContextState } from '../../DataContext/Context'\nimport { SharedAttachments } from '../../DataContext/Provider'\nimport { EventStateObject, Path } from '../../types'\n\ntype UseDataReturn = {\n  hasErrors: ContextState['hasErrors']\n  hasFieldError: ContextState['hasFieldError']\n  setFormError: (error: Error) => void\n  setFieldStatus: (path: Path, status: EventStateObject) => void\n}\n\nexport default function useValidation(\n  id: SharedStateId = undefined\n): UseDataReturn {\n  const { data } = useSharedState<\n    UseDataReturn & SharedAttachments<unknown>\n  >(id + '-attachments')\n\n  const fallback = useCallback(() => false, [])\n\n  // If no id is provided, use the context version\n  const context = useContext(DataContext)\n  const hasErrors =\n    data?.hasErrors || (!id && context?.hasErrors) || fallback\n  const hasFieldError =\n    data?.hasFieldError || (!id && context?.hasFieldError) || fallback\n\n  // Error handling\n  const setSubmitState =\n    data?.setSubmitState || (!id && context?.setSubmitState) || fallback\n  const setFormError = useCallback(\n    (error: Error) => {\n      setSubmitState?.({ error })\n    },\n    [setSubmitState]\n  )\n\n  // Field status\n  const { getFieldConnections } = useConnections(id)\n  const setFieldStatus = useCallback(\n    (path: Path, status: EventStateObject) => {\n      const connections = getFieldConnections()\n      connections?.[path]?.setEventResult?.(status)\n    },\n    [getFieldConnections]\n  )\n\n  return useMemo(\n    () => ({ hasErrors, hasFieldError, setFormError, setFieldStatus }),\n    [hasErrors, hasFieldError, setFormError, setFieldStatus]\n  )\n}\n\ntype UseConnectionsSharedState = {\n  fieldConnectionsRef: ContextState['fieldConnectionsRef']\n}\n\nfunction useConnections(id: SharedStateId = undefined) {\n  const { get } = useSharedState<UseConnectionsSharedState>(\n    id + '-attachments'\n  )\n\n  const dataContext = useContext(DataContext)\n  const { fieldConnectionsRef } = dataContext || {}\n\n  const getFieldConnections = useCallback(() => {\n    const attachments = get()\n    const connections =\n      attachments?.fieldConnectionsRef || (!id && fieldConnectionsRef)\n\n    return connections.current\n  }, [fieldConnectionsRef, get, id])\n\n  return useMemo(() => ({ getFieldConnections }), [getFieldConnections])\n}\n"],"mappings":"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"}
+{"version":3,"file":"useValidation.js","names":["useCallback","useContext","useMemo","createReferenceKey","useSharedState","DataContext","useValidation","id","undefined","data","fallback","context","hasErrors","hasFieldError","setSubmitState","setFormError","error","getFieldConnections","useConnections","setFieldStatus","path","status","_connections$path","_connections$path$set","connections","setEventResult","call","get","dataContext","fieldConnectionsRef","attachments","current"],"sources":["../../../../../../src/extensions/forms/Form/data-context/useValidation.tsx"],"sourcesContent":["import { useCallback, useContext, useMemo } from 'react'\nimport {\n  SharedStateId,\n  createReferenceKey,\n  useSharedState,\n} from '../../../../shared/helpers/useSharedState'\nimport DataContext, { ContextState } from '../../DataContext/Context'\nimport { SharedAttachments } from '../../DataContext/Provider'\nimport { EventStateObject, Path } from '../../types'\n\ntype UseDataReturn = {\n  hasErrors: ContextState['hasErrors']\n  hasFieldError: ContextState['hasFieldError']\n  setFormError: (error: Error) => void\n  setFieldStatus: (path: Path, status: EventStateObject) => void\n}\n\nexport default function useValidation(\n  id: SharedStateId = undefined\n): UseDataReturn {\n  const { data } = useSharedState<\n    UseDataReturn & SharedAttachments<unknown>\n  >(createReferenceKey(id, 'attachments'))\n\n  const fallback = useCallback(() => false, [])\n\n  // If no id is provided, use the context version\n  const context = useContext(DataContext)\n  const hasErrors =\n    data?.hasErrors || (!id && context?.hasErrors) || fallback\n  const hasFieldError =\n    data?.hasFieldError || (!id && context?.hasFieldError) || fallback\n\n  // Error handling\n  const setSubmitState =\n    data?.setSubmitState || (!id && context?.setSubmitState) || fallback\n  const setFormError = useCallback(\n    (error: Error) => {\n      setSubmitState?.({ error })\n    },\n    [setSubmitState]\n  )\n\n  // Field status\n  const { getFieldConnections } = useConnections(id)\n  const setFieldStatus = useCallback(\n    (path: Path, status: EventStateObject) => {\n      const connections = getFieldConnections()\n      connections?.[path]?.setEventResult?.(status)\n    },\n    [getFieldConnections]\n  )\n\n  return useMemo(\n    () => ({ hasErrors, hasFieldError, setFormError, setFieldStatus }),\n    [hasErrors, hasFieldError, setFormError, setFieldStatus]\n  )\n}\n\ntype UseConnectionsSharedState = {\n  fieldConnectionsRef: ContextState['fieldConnectionsRef']\n}\n\nfunction useConnections(id: SharedStateId = undefined) {\n  const { get } = useSharedState<UseConnectionsSharedState>(\n    createReferenceKey(id, 'attachments')\n  )\n\n  const dataContext = useContext(DataContext)\n  const { fieldConnectionsRef } = dataContext || {}\n\n  const getFieldConnections = useCallback(() => {\n    const attachments = get()\n    const connections =\n      attachments?.fieldConnectionsRef || (!id && fieldConnectionsRef)\n\n    return connections.current\n  }, [fieldConnectionsRef, get, id])\n\n  return useMemo(() => ({ getFieldConnections }), [getFieldConnections])\n}\n"],"mappings":"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"}

package/es/extensions/forms/Iterate/Array/ArrayItemArea.d.ts

@@ -2,10 +2,11 @@ import { Props as FlexContainerProps } from '../../../../components/flex/Contain
 import { ContainerMode } from './types';
 export type ArrayItemAreaProps = {
     /**
-     * Defines the variant of the ViewContainer, EditContainer or PushContainer. Can be `outline` or `basic`.
+     * Defines the variant of the ViewContainer, EditContainer or PushContainer. Can be `outline`, `filled` or `basic`.
      * Defaults to `outline`.
      */
-    variant?: 'outline' | 'basic';
+    variant?: 'outline' | 'basic' | 'filled';
+    toolbarVariant?: 'minimumOneItem' | 'custom';
 };
 export type Props = {
     mode: ContainerMode;

package/es/extensions/forms/Iterate/Array/ArrayItemArea.js

@@ -2,7 +2,7 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["mode", "open", "ariaLabel", "onAnimationEnd", "className", "children", "openDelay", "variant"];
+const _excluded = ["mode", "open", "ariaLabel", "onAnimationEnd", "className", "children", "openDelay", "variant", "toolbarVariant"];
 import React, { useCallback, useContext, useReducer, useRef } from 'react';
 import classnames from 'classnames';
 import { Card, HeightAnimation } from '../../../../components';
@@ -20,7 +20,8 @@ function ArrayItemArea(props) {
       className,
       children,
       openDelay = 100,
-      variant = 'outline'
+      variant = 'outline',
+      toolbarVariant
     } = props,
     restProps = _objectWithoutProperties(props, _excluded);
   const localContextRef = useRef();
@@ -123,14 +124,16 @@ function ArrayItemArea(props) {
       nextFocusElementRef.current = Array.from(localContextRef.current.elementRef.current.parentElement.childNodes).at(index - 1);
     } catch (e) {}
     isRemoving.current = true;
+    setOpenState(false);
     handleRemove === null || handleRemove === void 0 ? void 0 : handleRemove({
       keepItems: true
     });
-    setOpenState(false);
   }, [handleRemove, index, setOpenState]);
   return React.createElement(ArrayItemAreaContext.Provider, {
     value: {
-      handleRemoveItem
+      handleRemoveItem,
+      variant,
+      toolbarVariant
     }
   }, React.createElement(HeightAnimation, {
     className: classnames('dnb-forms-section-block', className, variant && `dnb-forms-section-block--variant-${variant}`, isNew && 'dnb-forms-section-block--new', hasSubmitError && 'dnb-forms-section-block--error'),
@@ -140,7 +143,8 @@ function ArrayItemArea(props) {
     keepInDOM: true
   }, React.createElement(Card, _extends({
     stack: true,
-    innerSpace: "small",
+    filled: variant === 'filled',
+    innerSpace: variant === 'basic' ? false : 'small',
     className: "dnb-forms-section-block__inner"
   }, restProps, {
     "aria-label": ariaLabel

package/es/extensions/forms/Iterate/Array/ArrayItemArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"ArrayItemArea.js","names":["React","useCallback","useContext","useReducer","useRef","classnames","Card","HeightAnimation","IterateItemContext","ArrayItemAreaContext","FieldBoundaryContext","useLayoutEffect","window","useEffect","ArrayItemArea","props","forceUpdate","mode","open","ariaLabel","onAnimationEnd","className","children","openDelay","variant","restProps","_objectWithoutProperties","_excluded","localContextRef","hasError","hasSubmitError","current","nextFocusElementRef","isNew","determineMode","value","initialContainerMode","Object","keys","length","containerMode","modeOptions","omitFocusManagement","editMode","switchContainerMode","preventUpdate","handleRemove","index","previousContainerMode","openRef","isRemoving","setOpenState","setTimeout","setFocus","state","_localContextRef$curr","_localContextRef$curr2","_localContextRef$curr3","_localContextRef$curr4","elementRef","focus","call","_nextFocusElementRef$","_nextFocusElementRef$2","handleAnimationEnd","_localContextRef$curr5","_localContextRef$curr6","fulfillRemove","handleRemoveItem","Array","from","parentElement","childNodes","at","e","keepItems","createElement","Provider","duration","keepInDOM","_extends","stack","innerSpace","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/Array/ArrayItemArea.tsx"],"sourcesContent":["import React, { useCallback, useContext, useReducer, useRef } from 'react'\nimport classnames from 'classnames'\nimport { Card, HeightAnimation } from '../../../../components'\nimport IterateItemContext, {\n  IterateItemContextState,\n} from '../IterateItemContext'\nimport ArrayItemAreaContext from './ArrayItemAreaContext'\nimport FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { ContainerMode } from './types'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n  typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type ArrayItemAreaProps = {\n  /**\n   * Defines the variant of the ViewContainer, EditContainer or PushContainer. Can be `outline` or `basic`.\n   * Defaults to `outline`.\n   */\n  variant?: 'outline' | 'basic'\n}\n\nexport type Props = {\n  mode: ContainerMode\n  open?: boolean | undefined\n  ariaLabel?: string\n  openDelay?: number\n} & ArrayItemAreaProps\n\nfunction ArrayItemArea(props: Props & FlexContainerProps) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const {\n    mode,\n    open,\n    ariaLabel,\n    onAnimationEnd,\n    className,\n    children,\n    openDelay = 100,\n    variant = 'outline',\n    ...restProps\n  } = props\n\n  const localContextRef = useRef<IterateItemContextState>()\n  const { hasError, hasSubmitError } =\n    useContext(FieldBoundaryContext) || {}\n  localContextRef.current = useContext(IterateItemContext) || {}\n  const nextFocusElementRef = useRef<HTMLElement>()\n  const { isNew } = localContextRef.current\n\n  const determineMode = useCallback(() => {\n    const { value, initialContainerMode } = localContextRef.current\n    if (initialContainerMode === 'auto') {\n      // - Set the container mode to \"edit\" if we have an error\n      if (\n        hasSubmitError ||\n        hasError ||\n        !value ||\n        (typeof value === 'object' && Object.keys(value).length === 0)\n      ) {\n        return 'edit'\n      }\n    }\n  }, [hasError, hasSubmitError])\n\n  if (determineMode() === 'edit') {\n    localContextRef.current.containerMode = 'edit'\n    if (!localContextRef.current.modeOptions) {\n      localContextRef.current.modeOptions = {}\n    }\n    localContextRef.current.modeOptions.omitFocusManagement = true\n  }\n  if (localContextRef.current.containerMode === 'auto') {\n    localContextRef.current.containerMode = 'view'\n  }\n\n  useLayoutEffect(() => {\n    if (mode === 'edit') {\n      const editMode = determineMode()\n      if (editMode) {\n        const { switchContainerMode } = localContextRef.current\n        switchContainerMode?.(editMode, {\n          omitFocusManagement: true,\n          preventUpdate: true,\n        })\n      }\n    }\n  }, [determineMode, mode])\n\n  const { handleRemove, index, previousContainerMode, containerMode } =\n    localContextRef.current\n\n  const openRef = useRef(open ?? (containerMode === mode && !isNew))\n  const isRemoving = useRef(false)\n\n  const setOpenState = useCallback((open: boolean) => {\n    openRef.current = open\n    forceUpdate()\n  }, [])\n\n  useLayoutEffect(() => {\n    if (!isRemoving.current) {\n      // - Set the open state, if it's controlled\n      if (typeof open !== 'undefined') {\n        setOpenState(open)\n      } else {\n        // - Open the block with animation, if it's in the right mode\n        if (openRef.current !== (containerMode === mode)) {\n          if (isNew) {\n            setTimeout(() => {\n              setOpenState(containerMode === mode)\n            }, openDelay) // in order to apply the animation\n          } else {\n            setOpenState(containerMode === mode)\n          }\n        }\n      }\n    }\n  }, [containerMode, isNew, mode, open, openDelay, setOpenState])\n\n  const setFocus = useCallback(\n    (state) => {\n      if (\n        localContextRef.current.modeOptions?.omitFocusManagement !==\n          true &&\n        !hasSubmitError &&\n        containerMode === mode && // ensure we match the correct mode\n        containerMode !== previousContainerMode // ensure we have a new mode\n      ) {\n        if (state === 'opened') {\n          localContextRef.current.elementRef?.current?.focus?.()\n        } else if (state === 'closed') {\n          nextFocusElementRef.current?.focus?.()\n        }\n      }\n    },\n    [containerMode, hasSubmitError, mode, previousContainerMode]\n  )\n\n  // - Remove the block with animation, if it's in the right mode\n  const handleAnimationEnd = useCallback(\n    (state) => {\n      if (!openRef.current && isRemoving.current) {\n        isRemoving.current = false\n        localContextRef.current.fulfillRemove?.()\n      }\n\n      setFocus(state)\n      onAnimationEnd?.(state)\n    },\n    [onAnimationEnd, setFocus]\n  )\n\n  const handleRemoveItem = useCallback(() => {\n    try {\n      // Because \"previousElementSibling\" did not work in Jest/JSDOM\n      nextFocusElementRef.current = Array.from(\n        localContextRef.current.elementRef.current.parentElement.childNodes\n      ).at(index - 1) as HTMLElement\n    } catch (e) {\n      //\n    }\n    isRemoving.current = true\n    handleRemove?.({ keepItems: true })\n    setOpenState(false)\n  }, [handleRemove, index, setOpenState])\n\n  return (\n    <ArrayItemAreaContext.Provider value={{ handleRemoveItem }}>\n      <HeightAnimation\n        className={classnames(\n          'dnb-forms-section-block',\n          variant && `dnb-forms-section-block--variant-${variant}`,\n          isNew && 'dnb-forms-section-block--new',\n          hasSubmitError && 'dnb-forms-section-block--error',\n          className\n        )}\n        open={openRef.current}\n        onAnimationEnd={handleAnimationEnd}\n        duration={450}\n        keepInDOM // Ensure fields get mounted so they will sync with the data context\n      >\n        <Card\n          stack\n          innerSpace=\"small\"\n          className=\"dnb-forms-section-block__inner\"\n          {...restProps}\n          aria-label={ariaLabel}\n        >\n          {children}\n        </Card>\n      </HeightAnimation>\n    </ArrayItemAreaContext.Provider>\n  )\n}\n\nArrayItemArea._supportsSpacingProps = true\nexport default ArrayItemArea\n"],"mappings":"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"}
+{"version":3,"file":"ArrayItemArea.js","names":["React","useCallback","useContext","useReducer","useRef","classnames","Card","HeightAnimation","IterateItemContext","ArrayItemAreaContext","FieldBoundaryContext","useLayoutEffect","window","useEffect","ArrayItemArea","props","forceUpdate","mode","open","ariaLabel","onAnimationEnd","className","children","openDelay","variant","toolbarVariant","restProps","_objectWithoutProperties","_excluded","localContextRef","hasError","hasSubmitError","current","nextFocusElementRef","isNew","determineMode","value","initialContainerMode","Object","keys","length","containerMode","modeOptions","omitFocusManagement","editMode","switchContainerMode","preventUpdate","handleRemove","index","previousContainerMode","openRef","isRemoving","setOpenState","setTimeout","setFocus","state","_localContextRef$curr","_localContextRef$curr2","_localContextRef$curr3","_localContextRef$curr4","elementRef","focus","call","_nextFocusElementRef$","_nextFocusElementRef$2","handleAnimationEnd","_localContextRef$curr5","_localContextRef$curr6","fulfillRemove","handleRemoveItem","Array","from","parentElement","childNodes","at","e","keepItems","createElement","Provider","duration","keepInDOM","_extends","stack","filled","innerSpace","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/Array/ArrayItemArea.tsx"],"sourcesContent":["import React, { useCallback, useContext, useReducer, useRef } from 'react'\nimport classnames from 'classnames'\nimport { Card, HeightAnimation } from '../../../../components'\nimport IterateItemContext, {\n  IterateItemContextState,\n} from '../IterateItemContext'\nimport ArrayItemAreaContext from './ArrayItemAreaContext'\nimport FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { ContainerMode } from './types'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n  typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type ArrayItemAreaProps = {\n  /**\n   * Defines the variant of the ViewContainer, EditContainer or PushContainer. Can be `outline`, `filled` or `basic`.\n   * Defaults to `outline`.\n   */\n  variant?: 'outline' | 'basic' | 'filled'\n  toolbarVariant?: 'minimumOneItem' | 'custom'\n}\n\nexport type Props = {\n  mode: ContainerMode\n  open?: boolean | undefined\n  ariaLabel?: string\n  openDelay?: number\n} & ArrayItemAreaProps\n\nfunction ArrayItemArea(props: Props & FlexContainerProps) {\n  const [, forceUpdate] = useReducer(() => ({}), {})\n\n  const {\n    mode,\n    open,\n    ariaLabel,\n    onAnimationEnd,\n    className,\n    children,\n    openDelay = 100,\n    variant = 'outline',\n    toolbarVariant,\n    ...restProps\n  } = props\n\n  const localContextRef = useRef<IterateItemContextState>()\n  const { hasError, hasSubmitError } =\n    useContext(FieldBoundaryContext) || {}\n  localContextRef.current = useContext(IterateItemContext) || {}\n  const nextFocusElementRef = useRef<HTMLElement>()\n  const { isNew } = localContextRef.current\n\n  const determineMode = useCallback(() => {\n    const { value, initialContainerMode } = localContextRef.current\n    if (initialContainerMode === 'auto') {\n      // - Set the container mode to \"edit\" if we have an error\n      if (\n        hasSubmitError ||\n        hasError ||\n        !value ||\n        (typeof value === 'object' && Object.keys(value).length === 0)\n      ) {\n        return 'edit'\n      }\n    }\n  }, [hasError, hasSubmitError])\n\n  if (determineMode() === 'edit') {\n    localContextRef.current.containerMode = 'edit'\n    if (!localContextRef.current.modeOptions) {\n      localContextRef.current.modeOptions = {}\n    }\n    localContextRef.current.modeOptions.omitFocusManagement = true\n  }\n  if (localContextRef.current.containerMode === 'auto') {\n    localContextRef.current.containerMode = 'view'\n  }\n\n  useLayoutEffect(() => {\n    if (mode === 'edit') {\n      const editMode = determineMode()\n      if (editMode) {\n        const { switchContainerMode } = localContextRef.current\n        switchContainerMode?.(editMode, {\n          omitFocusManagement: true,\n          preventUpdate: true,\n        })\n      }\n    }\n  }, [determineMode, mode])\n\n  const { handleRemove, index, previousContainerMode, containerMode } =\n    localContextRef.current\n\n  const openRef = useRef(open ?? (containerMode === mode && !isNew))\n  const isRemoving = useRef(false)\n\n  const setOpenState = useCallback((open: boolean) => {\n    openRef.current = open\n    forceUpdate()\n  }, [])\n\n  useLayoutEffect(() => {\n    if (!isRemoving.current) {\n      // - Set the open state, if it's controlled\n      if (typeof open !== 'undefined') {\n        setOpenState(open)\n      } else {\n        // - Open the block with animation, if it's in the right mode\n        if (openRef.current !== (containerMode === mode)) {\n          if (isNew) {\n            setTimeout(() => {\n              setOpenState(containerMode === mode)\n            }, openDelay) // in order to apply the animation\n          } else {\n            setOpenState(containerMode === mode)\n          }\n        }\n      }\n    }\n  }, [containerMode, isNew, mode, open, openDelay, setOpenState])\n\n  const setFocus = useCallback(\n    (state) => {\n      if (\n        localContextRef.current.modeOptions?.omitFocusManagement !==\n          true &&\n        !hasSubmitError &&\n        containerMode === mode && // ensure we match the correct mode\n        containerMode !== previousContainerMode // ensure we have a new mode\n      ) {\n        if (state === 'opened') {\n          localContextRef.current.elementRef?.current?.focus?.()\n        } else if (state === 'closed') {\n          nextFocusElementRef.current?.focus?.()\n        }\n      }\n    },\n    [containerMode, hasSubmitError, mode, previousContainerMode]\n  )\n\n  // - Remove the block with animation, if it's in the right mode\n  const handleAnimationEnd = useCallback(\n    (state) => {\n      if (!openRef.current && isRemoving.current) {\n        isRemoving.current = false\n        localContextRef.current.fulfillRemove?.()\n      }\n\n      setFocus(state)\n      onAnimationEnd?.(state)\n    },\n    [onAnimationEnd, setFocus]\n  )\n\n  const handleRemoveItem = useCallback(() => {\n    try {\n      // Because \"previousElementSibling\" did not work in Jest/JSDOM\n      nextFocusElementRef.current = Array.from(\n        localContextRef.current.elementRef.current.parentElement.childNodes\n      ).at(index - 1) as HTMLElement\n    } catch (e) {\n      //\n    }\n    isRemoving.current = true\n    setOpenState(false)\n    handleRemove?.({ keepItems: true })\n  }, [handleRemove, index, setOpenState])\n\n  return (\n    <ArrayItemAreaContext.Provider\n      value={{ handleRemoveItem, variant, toolbarVariant }}\n    >\n      <HeightAnimation\n        className={classnames(\n          'dnb-forms-section-block',\n          variant && `dnb-forms-section-block--variant-${variant}`,\n          isNew && 'dnb-forms-section-block--new',\n          hasSubmitError && 'dnb-forms-section-block--error',\n          className\n        )}\n        open={openRef.current}\n        onAnimationEnd={handleAnimationEnd}\n        duration={450}\n        keepInDOM // Ensure fields get mounted so they will sync with the data context\n      >\n        <Card\n          stack\n          filled={variant === 'filled'}\n          innerSpace={variant === 'basic' ? false : 'small'}\n          className=\"dnb-forms-section-block__inner\"\n          {...restProps}\n          aria-label={ariaLabel}\n        >\n          {children}\n        </Card>\n      </HeightAnimation>\n    </ArrayItemAreaContext.Provider>\n  )\n}\n\nArrayItemArea._supportsSpacingProps = true\nexport default ArrayItemArea\n"],"mappings":"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"}

package/es/extensions/forms/Iterate/Array/ArrayItemAreaContext.d.ts

@@ -1,6 +1,9 @@
 /// <reference types="react" />
+import { ArrayItemAreaProps } from './ArrayItemArea';
 type ArrayItemAreaContext = {
     handleRemoveItem?: () => void;
+    variant?: ArrayItemAreaProps['variant'];
+    toolbarVariant?: ArrayItemAreaProps['toolbarVariant'];
 };
 declare const ArrayItemAreaContext: import("react").Context<ArrayItemAreaContext>;
 export default ArrayItemAreaContext;

package/es/extensions/forms/Iterate/Array/ArrayItemAreaContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ArrayItemAreaContext.js","names":["createContext","ArrayItemAreaContext"],"sources":["../../../../../../src/extensions/forms/Iterate/Array/ArrayItemAreaContext.ts"],"sourcesContent":["import { createContext } from 'react'\n\ntype ArrayItemAreaContext = {\n  handleRemoveItem?: () => void\n}\n\nconst ArrayItemAreaContext = createContext<ArrayItemAreaContext>(null)\n\nexport default ArrayItemAreaContext\n"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,OAAO;AAMrC,MAAMC,oBAAoB,GAAGD,aAAa,CAAuB,IAAI,CAAC;AAEtE,eAAeC,oBAAoB"}
+{"version":3,"file":"ArrayItemAreaContext.js","names":["createContext","ArrayItemAreaContext"],"sources":["../../../../../../src/extensions/forms/Iterate/Array/ArrayItemAreaContext.ts"],"sourcesContent":["import { createContext } from 'react'\nimport { ArrayItemAreaProps } from './ArrayItemArea'\n\ntype ArrayItemAreaContext = {\n  handleRemoveItem?: () => void\n  variant?: ArrayItemAreaProps['variant']\n  toolbarVariant?: ArrayItemAreaProps['toolbarVariant']\n}\n\nconst ArrayItemAreaContext = createContext<ArrayItemAreaContext>(null)\n\nexport default ArrayItemAreaContext\n"],"mappings":";;AAAA,SAASA,aAAa,QAAQ,OAAO;AASrC,MAAMC,oBAAoB,GAAGD,aAAa,CAAuB,IAAI,CAAC;AAEtE,eAAeC,oBAAoB"}

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

@@ -1,4 +1,5 @@
-import { Identifier, Path } from '../../types';
+import { Path } from '../../types';
+import { SharedStateId } from '../../../../shared/helpers/useSharedState';
 export type Props = {
     /**
      * The path (JSON Pointer) to the array or object to count.
@@ -7,7 +8,7 @@ export type Props = {
     /**
      * A Form.Handler or DataContext `id` for when called outside of the context.
      */
-    id?: Identifier;
+    id?: SharedStateId;
     /**
      * A filter function to filter the data before counting.
      */
@@ -15,6 +16,6 @@ export type Props = {
 };
 export declare function Count(props: Props): number;
 export declare function count(props: Props): number;
-export declare function useCount(id?: Identifier): {
+export declare function useCount(id?: SharedStateId): {
     count: (path: Props['path'], filter?: Props['filter']) => number;
 };