@dnb/eufemia 10.27.0 → 10.29.0

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

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

@@ -7,8 +7,8 @@ import useTranslation from '../../hooks/useTranslation';
 import IterateElementContext from '../IterateElementContext';
 import { check, close } from '../../../../icons';
 import RemoveButton from '../RemoveButton';
+import FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext';
 export default function EditToolbarTools() {
-  const iterateElementContext = useContext(IterateElementContext);
   const {
     restoreOriginalValue,
     switchContainerMode,
@@ -16,7 +16,10 @@ export default function EditToolbarTools() {
     arrayValue,
     index,
     isNew
-  } = iterateElementContext !== null && iterateElementContext !== void 0 ? iterateElementContext : {};
+  } = useContext(IterateElementContext) || {};
+  const {
+    hasErrorAndShowIt
+  } = useContext(FieldBoundaryContext) || {};
   const translation = useTranslation().Iterate;
   const valueBackupRef = useRef();
   const wasNew = useWasNew({
@@ -46,7 +49,8 @@ export default function EditToolbarTools() {
     variant: "tertiary",
     icon: check,
     icon_position: "left",
-    on_click: doneHandler
+    on_click: doneHandler,
+    disabled: hasErrorAndShowIt
   }, translation.done), wasNew ? _RemoveButton || (_RemoveButton = React.createElement(RemoveButton, null)) : React.createElement(Button, {
     variant: "tertiary",
     icon: close,

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

@@ -1 +1 @@
-{"version":3,"file":"EditToolbarTools.js","names":["React","useCallback","useContext","useEffect","useRef","Button","Flex","useTranslation","IterateElementContext","check","close","RemoveButton","EditToolbarTools","iterateElementContext","restoreOriginalValue","switchContainerMode","containerMode","arrayValue","index","isNew","translation","Iterate","valueBackupRef","wasNew","useWasNew","current","cancelHandler","doneHandler","createElement","Horizontal","spacing","variant","icon","icon_position","on_click","done","_RemoveButton","cancel","wasNewRef"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditToolbarTools.tsx"],"sourcesContent":["import React, { useCallback, useContext, useEffect, useRef } from 'react'\nimport { Button, Flex } 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'\n\nexport default function EditToolbarTools() {\n  const iterateElementContext = useContext(IterateElementContext)\n  const {\n    restoreOriginalValue,\n    switchContainerMode,\n    containerMode,\n    arrayValue,\n    index,\n    isNew,\n  } = iterateElementContext ?? {}\n\n  const translation = useTranslation().Iterate\n  const valueBackupRef = useRef<unknown>()\n  const wasNew = useWasNew({ isNew, containerMode })\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    switchContainerMode?.('view')\n  }, [restoreOriginalValue, switchContainerMode])\n  const doneHandler = useCallback(() => {\n    switchContainerMode?.('view')\n  }, [switchContainerMode])\n\n  return (\n    <Flex.Horizontal spacing=\"large\">\n      <Button\n        variant=\"tertiary\"\n        icon={check}\n        icon_position=\"left\"\n        on_click={doneHandler}\n      >\n        {translation.done}\n      </Button>\n\n      {wasNew ? (\n        <RemoveButton />\n      ) : (\n        <Button\n          variant=\"tertiary\"\n          icon={close}\n          icon_position=\"left\"\n          on_click={cancelHandler}\n        >\n          {translation.cancel}\n        </Button>\n      )}\n    </Flex.Horizontal>\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","Button","Flex","useTranslation","IterateElementContext","check","close","RemoveButton","FieldBoundaryContext","EditToolbarTools","restoreOriginalValue","switchContainerMode","containerMode","arrayValue","index","isNew","hasErrorAndShowIt","translation","Iterate","valueBackupRef","wasNew","useWasNew","current","cancelHandler","doneHandler","createElement","Horizontal","spacing","variant","icon","icon_position","on_click","disabled","done","_RemoveButton","cancel","wasNewRef"],"sources":["../../../../../../src/extensions/forms/Iterate/EditContainer/EditToolbarTools.tsx"],"sourcesContent":["import React, { useCallback, useContext, useEffect, useRef } from 'react'\nimport { Button, Flex } 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 { hasErrorAndShowIt } = useContext(FieldBoundaryContext) || {}\n\n  const translation = useTranslation().Iterate\n  const valueBackupRef = useRef<unknown>()\n  const wasNew = useWasNew({ isNew, containerMode })\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    switchContainerMode?.('view')\n  }, [restoreOriginalValue, switchContainerMode])\n  const doneHandler = useCallback(() => {\n    switchContainerMode?.('view')\n  }, [switchContainerMode])\n\n  return (\n    <Flex.Horizontal spacing=\"large\">\n      <Button\n        variant=\"tertiary\"\n        icon={check}\n        icon_position=\"left\"\n        on_click={doneHandler}\n        disabled={hasErrorAndShowIt}\n      >\n        {translation.done}\n      </Button>\n\n      {wasNew ? (\n        <RemoveButton />\n      ) : (\n        <Button\n          variant=\"tertiary\"\n          icon={close}\n          icon_position=\"left\"\n          on_click={cancelHandler}\n        >\n          {translation.cancel}\n        </Button>\n      )}\n    </Flex.Horizontal>\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/es/extensions/forms/Iterate/PushButton/PushButton.js

@@ -38,7 +38,7 @@ function PushButton(props) {
     handleChange([...(value !== null && value !== void 0 ? value : []), newValue]);
   }, [value, pushValue, handlePush, handleChange]);
   return React.createElement(Button, _extends({
-    className: classnames('dnb-form-iterate-push-button', className),
+    className: classnames('dnb-forms-iterate-push-button', className),
     variant: "secondary",
     icon: add,
     icon_position: "left",

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-form-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,wCAAwC,CAAC;EAC3D;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,8BAA8B,EAAEW,SAAS,CAAE;IACjEgB,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","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,wCAAwC,CAAC;EAC3D;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/RemoveButton/RemoveButton.js

@@ -42,7 +42,7 @@ function RemoveButton(props) {
     }
   }, [handleRemove, handleRemoveBlock]);
   return React.createElement(Button, _extends({
-    className: classnames('dnb-form-iterate-remove-element-button', className),
+    className: classnames('dnb-forms-iterate-remove-element-button', className),
     variant: textContent ? 'tertiary' : 'secondary',
     icon: trash,
     icon_position: "left",

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

@@ -1 +1 @@
-{"version":3,"file":"RemoveButton.js","names":["React","useCallback","useContext","classnames","Button","IterateElementContext","useFieldProps","useTranslation","ElementBlockContext","omitDataValueReadWriteProps","trash","RemoveButton","props","iterateElementContext","handleRemove","Error","className","restProps","_objectWithoutProperties","_excluded","children","text","buttonProps","translation","Iterate","textContent","remove","elementBlockContext","handleRemoveBlock","handleClick","createElement","_extends","variant","icon","icon_position","on_click","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/RemoveButton/RemoveButton.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, useTranslation } from '../../hooks'\nimport ElementBlockContext from '../AnimatedContainer/ElementBlockContext'\nimport {\n  DataValueReadWriteComponentProps,\n  omitDataValueReadWriteProps,\n} from '../../types'\nimport { trash } from '../../../../icons'\n\nexport type Props = ButtonProps &\n  DataValueReadWriteComponentProps<unknown[]>\n\nfunction RemoveButton(props: Props) {\n  const iterateElementContext = useContext(IterateElementContext)\n  const { handleRemove } = iterateElementContext ?? {}\n\n  if (!iterateElementContext) {\n    throw new Error(\n      'RemoveButton must be inside an Iterate.Array component.'\n    )\n  }\n\n  const { className, ...restProps } = props\n  const { children, text } = useFieldProps(restProps)\n  const buttonProps = omitDataValueReadWriteProps(restProps)\n  const translation = useTranslation().Iterate\n  const textContent = text || children || translation.remove\n\n  const elementBlockContext = useContext(ElementBlockContext)\n  const { handleRemoveBlock } = elementBlockContext ?? {}\n\n  const handleClick = useCallback(() => {\n    if (handleRemoveBlock) {\n      handleRemoveBlock()\n    } else {\n      handleRemove()\n    }\n  }, [handleRemove, handleRemoveBlock])\n\n  return (\n    <Button\n      className={classnames(\n        'dnb-form-iterate-remove-element-button',\n        className\n      )}\n      variant={textContent ? 'tertiary' : 'secondary'}\n      icon={trash}\n      icon_position=\"left\"\n      on_click={handleClick}\n      {...buttonProps}\n    >\n      {textContent}\n    </Button>\n  )\n}\n\nRemoveButton._supportsSpacingProps = true\nexport default RemoveButton\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,EAAEC,cAAc,QAAQ,aAAa;AAC3D,OAAOC,mBAAmB,MAAM,0CAA0C;AAC1E,SAEEC,2BAA2B,QACtB,aAAa;AACpB,SAASC,KAAK,QAAQ,mBAAmB;AAKzC,SAASC,YAAYA,CAACC,KAAY,EAAE;EAClC,MAAMC,qBAAqB,GAAGX,UAAU,CAACG,qBAAqB,CAAC;EAC/D,MAAM;IAAES;EAAa,CAAC,GAAGD,qBAAqB,aAArBA,qBAAqB,cAArBA,qBAAqB,GAAI,CAAC,CAAC;EAEpD,IAAI,CAACA,qBAAqB,EAAE;IAC1B,MAAM,IAAIE,KAAK,CACb,yDACF,CAAC;EACH;EAEA,MAAM;MAAEC;IAAwB,CAAC,GAAGJ,KAAK;IAAnBK,SAAS,GAAAC,wBAAA,CAAKN,KAAK,EAAAO,SAAA;EACzC,MAAM;IAAEC,QAAQ;IAAEC;EAAK,CAAC,GAAGf,aAAa,CAACW,SAAS,CAAC;EACnD,MAAMK,WAAW,GAAGb,2BAA2B,CAACQ,SAAS,CAAC;EAC1D,MAAMM,WAAW,GAAGhB,cAAc,CAAC,CAAC,CAACiB,OAAO;EAC5C,MAAMC,WAAW,GAAGJ,IAAI,IAAID,QAAQ,IAAIG,WAAW,CAACG,MAAM;EAE1D,MAAMC,mBAAmB,GAAGzB,UAAU,CAACM,mBAAmB,CAAC;EAC3D,MAAM;IAAEoB;EAAkB,CAAC,GAAGD,mBAAmB,aAAnBA,mBAAmB,cAAnBA,mBAAmB,GAAI,CAAC,CAAC;EAEvD,MAAME,WAAW,GAAG5B,WAAW,CAAC,MAAM;IACpC,IAAI2B,iBAAiB,EAAE;MACrBA,iBAAiB,CAAC,CAAC;IACrB,CAAC,MAAM;MACLd,YAAY,CAAC,CAAC;IAChB;EACF,CAAC,EAAE,CAACA,YAAY,EAAEc,iBAAiB,CAAC,CAAC;EAErC,OACE5B,KAAA,CAAA8B,aAAA,CAAC1B,MAAM,EAAA2B,QAAA;IACLf,SAAS,EAAEb,UAAU,CACnB,wCAAwC,EACxCa,SACF,CAAE;IACFgB,OAAO,EAAEP,WAAW,GAAG,UAAU,GAAG,WAAY;IAChDQ,IAAI,EAAEvB,KAAM;IACZwB,aAAa,EAAC,MAAM;IACpBC,QAAQ,EAAEN;EAAY,GAClBP,WAAW,GAEdG,WACK,CAAC;AAEb;AAEAd,YAAY,CAACyB,qBAAqB,GAAG,IAAI;AACzC,eAAezB,YAAY"}
+{"version":3,"file":"RemoveButton.js","names":["React","useCallback","useContext","classnames","Button","IterateElementContext","useFieldProps","useTranslation","ElementBlockContext","omitDataValueReadWriteProps","trash","RemoveButton","props","iterateElementContext","handleRemove","Error","className","restProps","_objectWithoutProperties","_excluded","children","text","buttonProps","translation","Iterate","textContent","remove","elementBlockContext","handleRemoveBlock","handleClick","createElement","_extends","variant","icon","icon_position","on_click","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/RemoveButton/RemoveButton.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, useTranslation } from '../../hooks'\nimport ElementBlockContext from '../AnimatedContainer/ElementBlockContext'\nimport {\n  DataValueReadWriteComponentProps,\n  omitDataValueReadWriteProps,\n} from '../../types'\nimport { trash } from '../../../../icons'\n\nexport type Props = ButtonProps &\n  DataValueReadWriteComponentProps<unknown[]>\n\nfunction RemoveButton(props: Props) {\n  const iterateElementContext = useContext(IterateElementContext)\n  const { handleRemove } = iterateElementContext ?? {}\n\n  if (!iterateElementContext) {\n    throw new Error(\n      'RemoveButton must be inside an Iterate.Array component.'\n    )\n  }\n\n  const { className, ...restProps } = props\n  const { children, text } = useFieldProps(restProps)\n  const buttonProps = omitDataValueReadWriteProps(restProps)\n  const translation = useTranslation().Iterate\n  const textContent = text || children || translation.remove\n\n  const elementBlockContext = useContext(ElementBlockContext)\n  const { handleRemoveBlock } = elementBlockContext ?? {}\n\n  const handleClick = useCallback(() => {\n    if (handleRemoveBlock) {\n      handleRemoveBlock()\n    } else {\n      handleRemove()\n    }\n  }, [handleRemove, handleRemoveBlock])\n\n  return (\n    <Button\n      className={classnames(\n        'dnb-forms-iterate-remove-element-button',\n        className\n      )}\n      variant={textContent ? 'tertiary' : 'secondary'}\n      icon={trash}\n      icon_position=\"left\"\n      on_click={handleClick}\n      {...buttonProps}\n    >\n      {textContent}\n    </Button>\n  )\n}\n\nRemoveButton._supportsSpacingProps = true\nexport default RemoveButton\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,EAAEC,cAAc,QAAQ,aAAa;AAC3D,OAAOC,mBAAmB,MAAM,0CAA0C;AAC1E,SAEEC,2BAA2B,QACtB,aAAa;AACpB,SAASC,KAAK,QAAQ,mBAAmB;AAKzC,SAASC,YAAYA,CAACC,KAAY,EAAE;EAClC,MAAMC,qBAAqB,GAAGX,UAAU,CAACG,qBAAqB,CAAC;EAC/D,MAAM;IAAES;EAAa,CAAC,GAAGD,qBAAqB,aAArBA,qBAAqB,cAArBA,qBAAqB,GAAI,CAAC,CAAC;EAEpD,IAAI,CAACA,qBAAqB,EAAE;IAC1B,MAAM,IAAIE,KAAK,CACb,yDACF,CAAC;EACH;EAEA,MAAM;MAAEC;IAAwB,CAAC,GAAGJ,KAAK;IAAnBK,SAAS,GAAAC,wBAAA,CAAKN,KAAK,EAAAO,SAAA;EACzC,MAAM;IAAEC,QAAQ;IAAEC;EAAK,CAAC,GAAGf,aAAa,CAACW,SAAS,CAAC;EACnD,MAAMK,WAAW,GAAGb,2BAA2B,CAACQ,SAAS,CAAC;EAC1D,MAAMM,WAAW,GAAGhB,cAAc,CAAC,CAAC,CAACiB,OAAO;EAC5C,MAAMC,WAAW,GAAGJ,IAAI,IAAID,QAAQ,IAAIG,WAAW,CAACG,MAAM;EAE1D,MAAMC,mBAAmB,GAAGzB,UAAU,CAACM,mBAAmB,CAAC;EAC3D,MAAM;IAAEoB;EAAkB,CAAC,GAAGD,mBAAmB,aAAnBA,mBAAmB,cAAnBA,mBAAmB,GAAI,CAAC,CAAC;EAEvD,MAAME,WAAW,GAAG5B,WAAW,CAAC,MAAM;IACpC,IAAI2B,iBAAiB,EAAE;MACrBA,iBAAiB,CAAC,CAAC;IACrB,CAAC,MAAM;MACLd,YAAY,CAAC,CAAC;IAChB;EACF,CAAC,EAAE,CAACA,YAAY,EAAEc,iBAAiB,CAAC,CAAC;EAErC,OACE5B,KAAA,CAAA8B,aAAA,CAAC1B,MAAM,EAAA2B,QAAA;IACLf,SAAS,EAAEb,UAAU,CACnB,yCAAyC,EACzCa,SACF,CAAE;IACFgB,OAAO,EAAEP,WAAW,GAAG,UAAU,GAAG,WAAY;IAChDQ,IAAI,EAAEvB,KAAM;IACZwB,aAAa,EAAC,MAAM;IACpBC,QAAQ,EAAEN;EAAY,GAClBP,WAAW,GAEdG,WACK,CAAC;AAEb;AAEAd,YAAY,CAACyB,qBAAqB,GAAG,IAAI;AACzC,eAAezB,YAAY"}

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

@@ -15,7 +15,7 @@ export default function Toolbar(props) {
     rest = _objectWithoutProperties(_ref, _excluded);
   return React.createElement(Space, _extends({
     top: "medium",
-    className: classnames('dnb-form-iterate-toolbar', className)
+    className: classnames('dnb-forms-iterate-toolbar', className)
   }, rest), _Hr || (_Hr = React.createElement(Hr, {
     space: 0
   })), React.createElement(Flex.Horizontal, {

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

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.js","names":["React","classnames","Hr","Flex","Space","Toolbar","props","_ref","children","className","rest","_objectWithoutProperties","_excluded","createElement","_extends","top","_Hr","space","Horizontal","spacing","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/Toolbar/Toolbar.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Hr } from '../../../../elements'\nimport { Flex, Space } from '../../../../components'\nimport { SpaceAllProps } from '../../../../components/Space'\n\nexport type Props = SpaceAllProps\n\nexport default function Toolbar(props: Props) {\n  const { children, className, ...rest } = props || {}\n\n  return (\n    <Space\n      top=\"medium\"\n      className={classnames('dnb-form-iterate-toolbar', className)}\n      {...rest}\n    >\n      <Hr space={0} />\n\n      <Flex.Horizontal top=\"x-small\" spacing=\"large\">\n        {children}\n      </Flex.Horizontal>\n    </Space>\n  )\n}\n\nToolbar._supportsSpacingProps = true\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,EAAE,QAAQ,sBAAsB;AACzC,SAASC,IAAI,EAAEC,KAAK,QAAQ,wBAAwB;AAKpD,eAAe,SAASC,OAAOA,CAACC,KAAY,EAAE;EAC5C,MAAAC,IAAA,GAAyCD,KAAK,IAAI,CAAC,CAAC;IAA9C;MAAEE,QAAQ;MAAEC;IAAmB,CAAC,GAAAF,IAAA;IAANG,IAAI,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAEpC,OACEZ,KAAA,CAAAa,aAAA,CAACT,KAAK,EAAAU,QAAA;IACJC,GAAG,EAAC,QAAQ;IACZN,SAAS,EAAER,UAAU,CAAC,0BAA0B,EAAEQ,SAAS;EAAE,GACzDC,IAAI,GAAAM,GAAA,KAAAA,GAAA,GAERhB,KAAA,CAAAa,aAAA,CAACX,EAAE;IAACe,KAAK,EAAE;EAAE,CAAE,CAAC,GAEhBjB,KAAA,CAAAa,aAAA,CAACV,IAAI,CAACe,UAAU;IAACH,GAAG,EAAC,SAAS;IAACI,OAAO,EAAC;EAAO,GAC3CX,QACc,CACZ,CAAC;AAEZ;AAEAH,OAAO,CAACe,qBAAqB,GAAG,IAAI"}
+{"version":3,"file":"Toolbar.js","names":["React","classnames","Hr","Flex","Space","Toolbar","props","_ref","children","className","rest","_objectWithoutProperties","_excluded","createElement","_extends","top","_Hr","space","Horizontal","spacing","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/Toolbar/Toolbar.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Hr } from '../../../../elements'\nimport { Flex, Space } from '../../../../components'\nimport { SpaceAllProps } from '../../../../components/Space'\n\nexport type Props = SpaceAllProps\n\nexport default function Toolbar(props: Props) {\n  const { children, className, ...rest } = props || {}\n\n  return (\n    <Space\n      top=\"medium\"\n      className={classnames('dnb-forms-iterate-toolbar', className)}\n      {...rest}\n    >\n      <Hr space={0} />\n\n      <Flex.Horizontal top=\"x-small\" spacing=\"large\">\n        {children}\n      </Flex.Horizontal>\n    </Space>\n  )\n}\n\nToolbar._supportsSpacingProps = true\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,EAAE,QAAQ,sBAAsB;AACzC,SAASC,IAAI,EAAEC,KAAK,QAAQ,wBAAwB;AAKpD,eAAe,SAASC,OAAOA,CAACC,KAAY,EAAE;EAC5C,MAAAC,IAAA,GAAyCD,KAAK,IAAI,CAAC,CAAC;IAA9C;MAAEE,QAAQ;MAAEC;IAAmB,CAAC,GAAAF,IAAA;IAANG,IAAI,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAEpC,OACEZ,KAAA,CAAAa,aAAA,CAACT,KAAK,EAAAU,QAAA;IACJC,GAAG,EAAC,QAAQ;IACZN,SAAS,EAAER,UAAU,CAAC,2BAA2B,EAAEQ,SAAS;EAAE,GAC1DC,IAAI,GAAAM,GAAA,KAAAA,GAAA,GAERhB,KAAA,CAAAa,aAAA,CAACX,EAAE;IAACe,KAAK,EAAE;EAAE,CAAE,CAAC,GAEhBjB,KAAA,CAAAa,aAAA,CAACV,IAAI,CAACe,UAAU;IAACH,GAAG,EAAC,SAAS;IAACI,OAAO,EAAC;EAAO,GAC3CX,QACc,CACZ,CAAC;AAEZ;AAEAH,OAAO,CAACe,qBAAqB,GAAG,IAAI"}

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

@@ -22,7 +22,7 @@ function ViewContainer(props) {
   return React.createElement(ElementBlock, _extends({
     mode: "view",
     ariaLabel: ariaLabel,
-    className: classnames('dnb-form-iterate-view-block', className)
+    className: classnames('dnb-forms-iterate-view-block', className)
   }, restProps), React.createElement(Flex.Stack, null, title && React.createElement(Lead, {
     size: "basis"
   }, title), children, _Toolbar || (_Toolbar = React.createElement(Toolbar, null, React.createElement(ViewToolbarTools, null)))));

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

@@ -1 +1 @@
-{"version":3,"file":"ViewContainer.js","names":["React","useMemo","classnames","convertJsxToString","Flex","Lead","ElementBlock","Toolbar","ViewToolbarTools","ViewContainer","props","_ref","children","className","title","restProps","_objectWithoutProperties","_excluded","ariaLabel","createElement","_extends","mode","Stack","size","_Toolbar","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/ViewContainer.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport classnames from 'classnames'\nimport { convertJsxToString } from '../../../../shared/component-helper'\nimport { Flex } from '../../../../components'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { Lead } from '../../../../elements'\nimport ElementBlock from '../AnimatedContainer/ElementBlock'\nimport Toolbar from '../Toolbar'\nimport ViewToolbarTools from './ViewToolbarTools'\n\nexport type Props = {\n  /**\n   * The title of the ViewContainer.\n   */\n  title?: React.ReactNode\n}\n\nexport type AllProps = Props & FlexContainerProps\n\nfunction ViewContainer(props: AllProps) {\n  const { children, className, title, ...restProps } = props || {}\n  const ariaLabel = useMemo(() => convertJsxToString(title), [title])\n\n  return (\n    <ElementBlock\n      mode=\"view\"\n      ariaLabel={ariaLabel}\n      className={classnames('dnb-form-iterate-view-block', className)}\n      {...restProps}\n    >\n      <Flex.Stack>\n        {title && <Lead size=\"basis\">{title}</Lead>}\n        {children}\n        <Toolbar>\n          <ViewToolbarTools />\n        </Toolbar>\n      </Flex.Stack>\n    </ElementBlock>\n  )\n}\n\nViewContainer._supportsSpacingProps = true\nexport default ViewContainer\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,kBAAkB,QAAQ,qCAAqC;AACxE,SAASC,IAAI,QAAQ,wBAAwB;AAE7C,SAASC,IAAI,QAAQ,sBAAsB;AAC3C,OAAOC,YAAY,MAAM,mCAAmC;AAC5D,OAAOC,OAAO,MAAM,YAAY;AAChC,OAAOC,gBAAgB,MAAM,oBAAoB;AAWjD,SAASC,aAAaA,CAACC,KAAe,EAAE;EACtC,MAAAC,IAAA,GAAqDD,KAAK,IAAI,CAAC,CAAC;IAA1D;MAAEE,QAAQ;MAAEC,SAAS;MAAEC;IAAoB,CAAC,GAAAH,IAAA;IAAXI,SAAS,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAChD,MAAMC,SAAS,GAAGjB,OAAO,CAAC,MAAME,kBAAkB,CAACW,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEnE,OACEd,KAAA,CAAAmB,aAAA,CAACb,YAAY,EAAAc,QAAA;IACXC,IAAI,EAAC,MAAM;IACXH,SAAS,EAAEA,SAAU;IACrBL,SAAS,EAAEX,UAAU,CAAC,6BAA6B,EAAEW,SAAS;EAAE,GAC5DE,SAAS,GAEbf,KAAA,CAAAmB,aAAA,CAACf,IAAI,CAACkB,KAAK,QACRR,KAAK,IAAId,KAAA,CAAAmB,aAAA,CAACd,IAAI;IAACkB,IAAI,EAAC;EAAO,GAAET,KAAY,CAAC,EAC1CF,QAAQ,EAAAY,QAAA,KAAAA,QAAA,GACTxB,KAAA,CAAAmB,aAAA,CAACZ,OAAO,QACNP,KAAA,CAAAmB,aAAA,CAACX,gBAAgB,MAAE,CACZ,CAAC,CACA,CACA,CAAC;AAEnB;AAEAC,aAAa,CAACgB,qBAAqB,GAAG,IAAI;AAC1C,eAAehB,aAAa"}
+{"version":3,"file":"ViewContainer.js","names":["React","useMemo","classnames","convertJsxToString","Flex","Lead","ElementBlock","Toolbar","ViewToolbarTools","ViewContainer","props","_ref","children","className","title","restProps","_objectWithoutProperties","_excluded","ariaLabel","createElement","_extends","mode","Stack","size","_Toolbar","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Iterate/ViewContainer/ViewContainer.tsx"],"sourcesContent":["import React, { useMemo } from 'react'\nimport classnames from 'classnames'\nimport { convertJsxToString } from '../../../../shared/component-helper'\nimport { Flex } from '../../../../components'\nimport { Props as FlexContainerProps } from '../../../../components/flex/Container'\nimport { Lead } from '../../../../elements'\nimport ElementBlock from '../AnimatedContainer/ElementBlock'\nimport Toolbar from '../Toolbar'\nimport ViewToolbarTools from './ViewToolbarTools'\n\nexport type Props = {\n  /**\n   * The title of the ViewContainer.\n   */\n  title?: React.ReactNode\n}\n\nexport type AllProps = Props & FlexContainerProps\n\nfunction ViewContainer(props: AllProps) {\n  const { children, className, title, ...restProps } = props || {}\n  const ariaLabel = useMemo(() => convertJsxToString(title), [title])\n\n  return (\n    <ElementBlock\n      mode=\"view\"\n      ariaLabel={ariaLabel}\n      className={classnames('dnb-forms-iterate-view-block', className)}\n      {...restProps}\n    >\n      <Flex.Stack>\n        {title && <Lead size=\"basis\">{title}</Lead>}\n        {children}\n        <Toolbar>\n          <ViewToolbarTools />\n        </Toolbar>\n      </Flex.Stack>\n    </ElementBlock>\n  )\n}\n\nViewContainer._supportsSpacingProps = true\nexport default ViewContainer\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,kBAAkB,QAAQ,qCAAqC;AACxE,SAASC,IAAI,QAAQ,wBAAwB;AAE7C,SAASC,IAAI,QAAQ,sBAAsB;AAC3C,OAAOC,YAAY,MAAM,mCAAmC;AAC5D,OAAOC,OAAO,MAAM,YAAY;AAChC,OAAOC,gBAAgB,MAAM,oBAAoB;AAWjD,SAASC,aAAaA,CAACC,KAAe,EAAE;EACtC,MAAAC,IAAA,GAAqDD,KAAK,IAAI,CAAC,CAAC;IAA1D;MAAEE,QAAQ;MAAEC,SAAS;MAAEC;IAAoB,CAAC,GAAAH,IAAA;IAAXI,SAAS,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAChD,MAAMC,SAAS,GAAGjB,OAAO,CAAC,MAAME,kBAAkB,CAACW,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEnE,OACEd,KAAA,CAAAmB,aAAA,CAACb,YAAY,EAAAc,QAAA;IACXC,IAAI,EAAC,MAAM;IACXH,SAAS,EAAEA,SAAU;IACrBL,SAAS,EAAEX,UAAU,CAAC,8BAA8B,EAAEW,SAAS;EAAE,GAC7DE,SAAS,GAEbf,KAAA,CAAAmB,aAAA,CAACf,IAAI,CAACkB,KAAK,QACRR,KAAK,IAAId,KAAA,CAAAmB,aAAA,CAACd,IAAI;IAACkB,IAAI,EAAC;EAAO,GAAET,KAAY,CAAC,EAC1CF,QAAQ,EAAAY,QAAA,KAAAA,QAAA,GACTxB,KAAA,CAAAmB,aAAA,CAACZ,OAAO,QACNP,KAAA,CAAAmB,aAAA,CAACX,gBAAgB,MAAE,CACZ,CAAC,CACA,CACA,CAAC;AAEnB;AAEAC,aAAa,CAACgB,qBAAqB,GAAG,IAAI;AAC1C,eAAehB,aAAa"}

package/es/extensions/forms/Iterate/style/dnb-form-iterate.css

@@ -1,48 +1,48 @@
-.dnb-form-iterate-block {
+.dnb-forms-iterate-block {
   --block-outline-color: var(--outline-color, var(--color-lavender));
 }
-.dnb-form-iterate-block--error:has(.dnb-form-status--error) {
+.dnb-forms-iterate-block--error:has(.dnb-form-status--error) {
   --block-outline-color: var(--color-fire-red);
 }
-.dnb-form-iterate-block:not(.dnb-height-animation--hidden) {
+.dnb-forms-iterate-block:not(.dnb-height-animation--hidden) {
   display: flex;
   flex-direction: column;
 }
-.dnb-form-iterate-block__inner {
+.dnb-forms-iterate-block__inner {
   flex: 1;
   margin-bottom: var(--space);
   padding: var(--padding, 1rem);
-  transition: transform 400ms var(--easing-default) 50ms;
+  transition: transform 400ms var(--easing-default) 50ms, box-shadow 0.8s var(--easing-default);
   transform: translateY(-2.5rem);
 }
-.dnb-form-iterate-block__inner:not([class*=dnb-flex-container--spacing]) {
+.dnb-forms-iterate-block__inner:not([class*=dnb-flex-container--spacing]) {
   --padding: 0;
 }
-.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing] {
+.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing] {
   border-radius: 0.375rem;
   box-shadow: inset 0 0 0 2px var(--block-outline-color);
 }
-.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small {
+.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small {
   --space: var(--spacing-small);
 }
-.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium {
+.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium {
   --space: var(--spacing-medium);
 }
-.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large {
+.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large {
   --space: var(--spacing-large);
 }
-.dnb-form-iterate-block__inner .dnb-dl .dnb-dd {
+.dnb-forms-iterate-block__inner .dnb-dl .dnb-dd {
   margin-bottom: 0;
 }
-.dnb-form-iterate-block.dnb-height-animation--is-visible .dnb-form-iterate-block__inner {
+.dnb-forms-iterate-block.dnb-height-animation--is-visible .dnb-forms-iterate-block__inner {
   transform: translateY(-0.5rem);
 }
-.dnb-form-iterate-block.dnb-height-animation--parallax .dnb-form-iterate-block__inner {
+.dnb-forms-iterate-block.dnb-height-animation--parallax .dnb-forms-iterate-block__inner {
   transform: translateY(0);
 }
-.dnb-form-iterate__element {
+.dnb-forms-iterate__element {
   outline: none;
 }
-.dnb-form-iterate > .dnb-form-iterate__element:has(.dnb-form-iterate-block) {
+.dnb-forms-iterate > .dnb-forms-iterate__element:has(.dnb-forms-iterate-block) {
   margin-top: 0;
 }

package/es/extensions/forms/Iterate/style/dnb-form-iterate.min.css

@@ -1 +1 @@
-.dnb-form-iterate-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-form-iterate-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-form-iterate-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-form-iterate-block__inner{flex:1;margin-bottom:var(--space);padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms}.dnb-form-iterate-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem;box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-form-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-form-iterate-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-form-iterate-block.dnb-height-animation--is-visible .dnb-form-iterate-block__inner{transform:translateY(-.5rem)}.dnb-form-iterate-block.dnb-height-animation--parallax .dnb-form-iterate-block__inner{transform:translateY(0)}.dnb-form-iterate__element{outline:none}.dnb-form-iterate>.dnb-form-iterate__element:has(.dnb-form-iterate-block){margin-top:0}
+.dnb-forms-iterate-block{--block-outline-color:var(--outline-color,var(--color-lavender))}.dnb-forms-iterate-block--error:has(.dnb-form-status--error){--block-outline-color:var(--color-fire-red)}.dnb-forms-iterate-block:not(.dnb-height-animation--hidden){display:flex;flex-direction:column}.dnb-forms-iterate-block__inner{flex:1;margin-bottom:var(--space);padding:var(--padding,1rem);transform:translateY(-2.5rem);transition:transform .4s var(--easing-default) 50ms,box-shadow .8s var(--easing-default)}.dnb-forms-iterate-block__inner:not([class*=dnb-flex-container--spacing]){--padding:0}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing]{border-radius:.375rem;box-shadow:inset 0 0 0 2px var(--block-outline-color)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-small{--space:var(--spacing-small)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-medium{--space:var(--spacing-medium)}.dnb-forms-iterate-block__inner[class*=dnb-flex-container--spacing].dnb-flex-container--spacing-large{--space:var(--spacing-large)}.dnb-forms-iterate-block__inner .dnb-dl .dnb-dd{margin-bottom:0}.dnb-forms-iterate-block.dnb-height-animation--is-visible .dnb-forms-iterate-block__inner{transform:translateY(-.5rem)}.dnb-forms-iterate-block.dnb-height-animation--parallax .dnb-forms-iterate-block__inner{transform:translateY(0)}.dnb-forms-iterate__element{outline:none}.dnb-forms-iterate>.dnb-forms-iterate__element:has(.dnb-forms-iterate-block){margin-top:0}

package/es/extensions/forms/Iterate/style/dnb-form-iterate.scss

@@ -1,4 +1,4 @@
-.dnb-form-iterate {
+.dnb-forms-iterate {
   &-block {
     --block-outline-color: var(--outline-color, var(--color-lavender));
     &--error:has(.dnb-form-status--error) {
@@ -38,7 +38,9 @@
         box-shadow: inset 0 0 0 2px var(--block-outline-color);
       }
 
-      transition: transform 400ms var(--easing-default) 50ms;
+      transition:
+        transform 400ms var(--easing-default) 50ms,
+        box-shadow 0.8s var(--easing-default);
       transform: translateY(-2.5rem);
 
       .dnb-dl .dnb-dd {

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

@@ -1,6 +1,8 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["value"];
+const _excluded = ["value", "className"];
 import React from 'react';
+import classnames from 'classnames';
 import ValueBlock from '../../ValueBlock';
 import { useValueProps } from '../../hooks';
 import useTranslation from '../../hooks/useTranslation';
@@ -8,10 +10,13 @@ function BooleanComponent(props) {
   const translations = useTranslation().BooleanField;
   const _useValueProps = useValueProps(props),
     {
-      value
+      value,
+      className
     } = _useValueProps,
     rest = _objectWithoutProperties(_useValueProps, _excluded);
-  return React.createElement(ValueBlock, rest, value === true || value === false ? value === true ? translations.yes : translations.no : null);
+  return React.createElement(ValueBlock, _extends({
+    className: classnames('dnb-forms-value-boolean', className)
+  }, rest), value === true || value === false ? value === true ? translations.yes : translations.no : null);
 }
 BooleanComponent._supportsSpacingProps = true;
 export default BooleanComponent;

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

@@ -1 +1 @@
-{"version":3,"file":"Boolean.js","names":["React","ValueBlock","useValueProps","useTranslation","BooleanComponent","props","translations","BooleanField","_useValueProps","value","rest","_objectWithoutProperties","_excluded","createElement","yes","no","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/Boolean/Boolean.tsx"],"sourcesContent":["import React from 'react'\nimport ValueBlock from '../../ValueBlock'\nimport { useValueProps } from '../../hooks'\nimport { ValueProps } from '../../types'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type Props = ValueProps<boolean>\n\nfunction BooleanComponent(props: Props) {\n  const translations = useTranslation().BooleanField\n  const { value, ...rest } = useValueProps(props)\n\n  return (\n    <ValueBlock {...rest}>\n      {value === true || value === false\n        ? value === true\n          ? translations.yes\n          : translations.no\n        : null}\n    </ValueBlock>\n  )\n}\n\nBooleanComponent._supportsSpacingProps = true\nexport default BooleanComponent\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,kBAAkB;AACzC,SAASC,aAAa,QAAQ,aAAa;AAE3C,OAAOC,cAAc,MAAM,4BAA4B;AAIvD,SAASC,gBAAgBA,CAACC,KAAY,EAAE;EACtC,MAAMC,YAAY,GAAGH,cAAc,CAAC,CAAC,CAACI,YAAY;EAClD,MAAAC,cAAA,GAA2BN,aAAa,CAACG,KAAK,CAAC;IAAzC;MAAEI;IAAe,CAAC,GAAAD,cAAA;IAANE,IAAI,GAAAC,wBAAA,CAAAH,cAAA,EAAAI,SAAA;EAEtB,OACEZ,KAAA,CAAAa,aAAA,CAACZ,UAAU,EAAKS,IAAI,EACjBD,KAAK,KAAK,IAAI,IAAIA,KAAK,KAAK,KAAK,GAC9BA,KAAK,KAAK,IAAI,GACZH,YAAY,CAACQ,GAAG,GAChBR,YAAY,CAACS,EAAE,GACjB,IACM,CAAC;AAEjB;AAEAX,gBAAgB,CAACY,qBAAqB,GAAG,IAAI;AAC7C,eAAeZ,gBAAgB"}
+{"version":3,"file":"Boolean.js","names":["React","classnames","ValueBlock","useValueProps","useTranslation","BooleanComponent","props","translations","BooleanField","_useValueProps","value","className","rest","_objectWithoutProperties","_excluded","createElement","_extends","yes","no","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/Boolean/Boolean.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport ValueBlock from '../../ValueBlock'\nimport { useValueProps } from '../../hooks'\nimport { ValueProps } from '../../types'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type Props = ValueProps<boolean>\n\nfunction BooleanComponent(props: Props) {\n  const translations = useTranslation().BooleanField\n  const { value, className, ...rest } = useValueProps(props)\n\n  return (\n    <ValueBlock\n      className={classnames('dnb-forms-value-boolean', className)}\n      {...rest}\n    >\n      {value === true || value === false\n        ? value === true\n          ? translations.yes\n          : translations.no\n        : null}\n    </ValueBlock>\n  )\n}\n\nBooleanComponent._supportsSpacingProps = true\nexport default BooleanComponent\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,UAAU,MAAM,kBAAkB;AACzC,SAASC,aAAa,QAAQ,aAAa;AAE3C,OAAOC,cAAc,MAAM,4BAA4B;AAIvD,SAASC,gBAAgBA,CAACC,KAAY,EAAE;EACtC,MAAMC,YAAY,GAAGH,cAAc,CAAC,CAAC,CAACI,YAAY;EAClD,MAAAC,cAAA,GAAsCN,aAAa,CAACG,KAAK,CAAC;IAApD;MAAEI,KAAK;MAAEC;IAAmB,CAAC,GAAAF,cAAA;IAANG,IAAI,GAAAC,wBAAA,CAAAJ,cAAA,EAAAK,SAAA;EAEjC,OACEd,KAAA,CAAAe,aAAA,CAACb,UAAU,EAAAc,QAAA;IACTL,SAAS,EAAEV,UAAU,CAAC,yBAAyB,EAAEU,SAAS;EAAE,GACxDC,IAAI,GAEPF,KAAK,KAAK,IAAI,IAAIA,KAAK,KAAK,KAAK,GAC9BA,KAAK,KAAK,IAAI,GACZH,YAAY,CAACU,GAAG,GAChBV,YAAY,CAACW,EAAE,GACjB,IACM,CAAC;AAEjB;AAEAb,gBAAgB,CAACc,qBAAqB,GAAG,IAAI;AAC7C,eAAed,gBAAgB"}

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

@@ -0,0 +1,10 @@
+import { Props as StringValueProps } from '../String';
+export type Props = StringValueProps;
+declare function Name(props: Props): import("react/jsx-runtime").JSX.Element;
+declare namespace Name {
+    var _supportsSpacingProps: boolean;
+    var First: (props: StringValueProps) => import("react/jsx-runtime").JSX.Element;
+    var Last: (props: StringValueProps) => import("react/jsx-runtime").JSX.Element;
+    var Company: (props: StringValueProps) => import("react/jsx-runtime").JSX.Element;
+}
+export default Name;

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

@@ -0,0 +1,40 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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 from 'react';
+import StringValue from '../String';
+import useTranslation from '../../hooks/useTranslation';
+function Name(props) {
+  const StringValueProps = _objectSpread({}, props);
+  return React.createElement(StringValue, StringValueProps);
+}
+Name._supportsSpacingProps = true;
+Name.First = function FirstName(props) {
+  var _props$label;
+  const translations = useTranslation();
+  const nameProps = _objectSpread(_objectSpread({}, props), {}, {
+    label: (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : translations.FirstName.label
+  });
+  return React.createElement(Name, nameProps);
+};
+Name.First['_supportsSpacingProps'] = true;
+Name.Last = function LastName(props) {
+  var _props$label2;
+  const translations = useTranslation();
+  const nameProps = _objectSpread(_objectSpread({}, props), {}, {
+    label: (_props$label2 = props.label) !== null && _props$label2 !== void 0 ? _props$label2 : translations.LastName.label
+  });
+  return React.createElement(Name, nameProps);
+};
+Name.Last['_supportsSpacingProps'] = true;
+Name.Company = function CompanyName(props) {
+  var _props$label3;
+  const translations = useTranslation();
+  const nameProps = _objectSpread(_objectSpread({}, props), {}, {
+    label: (_props$label3 = props.label) !== null && _props$label3 !== void 0 ? _props$label3 : translations.CompanyName.label
+  });
+  return React.createElement(Name, nameProps);
+};
+Name.Company['_supportsSpacingProps'] = true;
+export default Name;
+//# sourceMappingURL=Name.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Name.js","names":["React","StringValue","useTranslation","Name","props","StringValueProps","_objectSpread","createElement","_supportsSpacingProps","First","FirstName","_props$label","translations","nameProps","label","Last","LastName","_props$label2","Company","CompanyName","_props$label3"],"sources":["../../../../../../src/extensions/forms/Value/Name/Name.tsx"],"sourcesContent":["import React from 'react'\nimport StringValue, { Props as StringValueProps } from '../String'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type Props = StringValueProps\n\nfunction Name(props: Props) {\n  const StringValueProps: Props = {\n    ...props,\n  }\n\n  return <StringValue {...StringValueProps} />\n}\nName._supportsSpacingProps = true\n\nName.First = function FirstName(props: Props) {\n  const translations = useTranslation()\n\n  const nameProps: Props = {\n    ...props,\n    label: props.label ?? translations.FirstName.label,\n  }\n\n  return <Name {...nameProps} />\n}\nName.First['_supportsSpacingProps'] = true\n\nName.Last = function LastName(props: Props) {\n  const translations = useTranslation()\n\n  const nameProps: Props = {\n    ...props,\n    label: props.label ?? translations.LastName.label,\n  }\n\n  return <Name {...nameProps} />\n}\nName.Last['_supportsSpacingProps'] = true\n\nName.Company = function CompanyName(props: Props) {\n  const translations = useTranslation()\n\n  const nameProps: Props = {\n    ...props,\n    label: props.label ?? translations.CompanyName.label,\n  }\n\n  return <Name {...nameProps} />\n}\nName.Company['_supportsSpacingProps'] = true\n\nexport default Name\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,WAAW,MAAqC,WAAW;AAClE,OAAOC,cAAc,MAAM,4BAA4B;AAIvD,SAASC,IAAIA,CAACC,KAAY,EAAE;EAC1B,MAAMC,gBAAuB,GAAAC,aAAA,KACxBF,KAAK,CACT;EAED,OAAOJ,KAAA,CAAAO,aAAA,CAACN,WAAW,EAAKI,gBAAmB,CAAC;AAC9C;AACAF,IAAI,CAACK,qBAAqB,GAAG,IAAI;AAEjCL,IAAI,CAACM,KAAK,GAAG,SAASC,SAASA,CAACN,KAAY,EAAE;EAAA,IAAAO,YAAA;EAC5C,MAAMC,YAAY,GAAGV,cAAc,CAAC,CAAC;EAErC,MAAMW,SAAgB,GAAAP,aAAA,CAAAA,aAAA,KACjBF,KAAK;IACRU,KAAK,GAAAH,YAAA,GAAEP,KAAK,CAACU,KAAK,cAAAH,YAAA,cAAAA,YAAA,GAAIC,YAAY,CAACF,SAAS,CAACI;EAAK,EACnD;EAED,OAAOd,KAAA,CAAAO,aAAA,CAACJ,IAAI,EAAKU,SAAY,CAAC;AAChC,CAAC;AACDV,IAAI,CAACM,KAAK,CAAC,uBAAuB,CAAC,GAAG,IAAI;AAE1CN,IAAI,CAACY,IAAI,GAAG,SAASC,QAAQA,CAACZ,KAAY,EAAE;EAAA,IAAAa,aAAA;EAC1C,MAAML,YAAY,GAAGV,cAAc,CAAC,CAAC;EAErC,MAAMW,SAAgB,GAAAP,aAAA,CAAAA,aAAA,KACjBF,KAAK;IACRU,KAAK,GAAAG,aAAA,GAAEb,KAAK,CAACU,KAAK,cAAAG,aAAA,cAAAA,aAAA,GAAIL,YAAY,CAACI,QAAQ,CAACF;EAAK,EAClD;EAED,OAAOd,KAAA,CAAAO,aAAA,CAACJ,IAAI,EAAKU,SAAY,CAAC;AAChC,CAAC;AACDV,IAAI,CAACY,IAAI,CAAC,uBAAuB,CAAC,GAAG,IAAI;AAEzCZ,IAAI,CAACe,OAAO,GAAG,SAASC,WAAWA,CAACf,KAAY,EAAE;EAAA,IAAAgB,aAAA;EAChD,MAAMR,YAAY,GAAGV,cAAc,CAAC,CAAC;EAErC,MAAMW,SAAgB,GAAAP,aAAA,CAAAA,aAAA,KACjBF,KAAK;IACRU,KAAK,GAAAM,aAAA,GAAEhB,KAAK,CAACU,KAAK,cAAAM,aAAA,cAAAA,aAAA,GAAIR,YAAY,CAACO,WAAW,CAACL;EAAK,EACrD;EAED,OAAOd,KAAA,CAAAO,aAAA,CAACJ,IAAI,EAAKU,SAAY,CAAC;AAChC,CAAC;AACDV,IAAI,CAACe,OAAO,CAAC,uBAAuB,CAAC,GAAG,IAAI;AAE5C,eAAef,IAAI"}

package/es/extensions/forms/Value/Name/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Name';
+export * from './Name';

package/es/extensions/forms/Value/Name/index.js

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

package/es/extensions/forms/Value/Name/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default"],"sources":["../../../../../../src/extensions/forms/Value/Name/index.ts"],"sourcesContent":["export { default } from './Name'\nexport * from './Name'\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,QAAQ;AAChC,cAAc,QAAQ"}

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

@@ -0,0 +1,7 @@
+import { Props as StringValueProps } from '../String';
+export type Props = StringValueProps;
+declare function OrganizationNumber(props: Props): import("react/jsx-runtime").JSX.Element;
+declare namespace OrganizationNumber {
+    var _supportsSpacingProps: boolean;
+}
+export default OrganizationNumber;

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

@@ -0,0 +1,24 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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, { useCallback } from 'react';
+import StringValue from '../String';
+import { format, cleanNumber } from '../../../../components/number-format/NumberUtils';
+import useTranslation from '../../hooks/useTranslation';
+function OrganizationNumber(props) {
+  var _props$label;
+  const translations = useTranslation().OrganizationNumber;
+  const toInput = useCallback(value => {
+    return format(cleanNumber(value), {
+      org: true
+    }).toString();
+  }, []);
+  const stringValueProps = _objectSpread(_objectSpread({}, props), {}, {
+    label: (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : props.inline ? undefined : translations.label,
+    toInput
+  });
+  return React.createElement(StringValue, stringValueProps);
+}
+OrganizationNumber._supportsSpacingProps = true;
+export default OrganizationNumber;
+//# sourceMappingURL=OrganizationNumber.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationNumber.js","names":["React","useCallback","StringValue","format","cleanNumber","useTranslation","OrganizationNumber","props","_props$label","translations","toInput","value","org","toString","stringValueProps","_objectSpread","label","inline","undefined","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/OrganizationNumber/OrganizationNumber.tsx"],"sourcesContent":["import React, { useCallback } from 'react'\nimport StringValue, { Props as StringValueProps } from '../String'\nimport {\n  format,\n  cleanNumber,\n} from '../../../../components/number-format/NumberUtils'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type Props = StringValueProps\n\nfunction OrganizationNumber(props: Props) {\n  const translations = useTranslation().OrganizationNumber\n\n  const toInput = useCallback((value) => {\n    return format(cleanNumber(value), {\n      org: true,\n    }).toString()\n  }, [])\n\n  const stringValueProps: Props = {\n    ...props,\n    label: props.label ?? (props.inline ? undefined : translations.label),\n    toInput,\n  }\n  return <StringValue {...stringValueProps} />\n}\n\nOrganizationNumber._supportsSpacingProps = true\nexport default OrganizationNumber\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,OAAOC,WAAW,MAAqC,WAAW;AAClE,SACEC,MAAM,EACNC,WAAW,QACN,kDAAkD;AACzD,OAAOC,cAAc,MAAM,4BAA4B;AAIvD,SAASC,kBAAkBA,CAACC,KAAY,EAAE;EAAA,IAAAC,YAAA;EACxC,MAAMC,YAAY,GAAGJ,cAAc,CAAC,CAAC,CAACC,kBAAkB;EAExD,MAAMI,OAAO,GAAGT,WAAW,CAAEU,KAAK,IAAK;IACrC,OAAOR,MAAM,CAACC,WAAW,CAACO,KAAK,CAAC,EAAE;MAChCC,GAAG,EAAE;IACP,CAAC,CAAC,CAACC,QAAQ,CAAC,CAAC;EACf,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,gBAAuB,GAAAC,aAAA,CAAAA,aAAA,KACxBR,KAAK;IACRS,KAAK,GAAAR,YAAA,GAAED,KAAK,CAACS,KAAK,cAAAR,YAAA,cAAAA,YAAA,GAAKD,KAAK,CAACU,MAAM,GAAGC,SAAS,GAAGT,YAAY,CAACO,KAAM;IACrEN;EAAO,EACR;EACD,OAAOV,KAAA,CAAAmB,aAAA,CAACjB,WAAW,EAAKY,gBAAmB,CAAC;AAC9C;AAEAR,kBAAkB,CAACc,qBAAqB,GAAG,IAAI;AAC/C,eAAed,kBAAkB"}

package/es/extensions/forms/Value/OrganizationNumber/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './OrganizationNumber';
+export * from './OrganizationNumber';

package/es/extensions/forms/Value/OrganizationNumber/index.js

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

package/es/extensions/forms/Value/OrganizationNumber/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default"],"sources":["../../../../../../src/extensions/forms/Value/OrganizationNumber/index.ts"],"sourcesContent":["export { default } from './OrganizationNumber'\nexport * from './OrganizationNumber'\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,sBAAsB;AAC9C,cAAc,sBAAsB"}

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

@@ -0,0 +1,7 @@
+import { Props as StringValueProps } from '../String';
+export type Props = StringValueProps & Partial<Record<'postalCode' | 'city', StringValueProps>>;
+declare function PostalCodeAndCity(props: Props): import("react/jsx-runtime").JSX.Element;
+declare namespace PostalCodeAndCity {
+    var _supportsSpacingProps: boolean;
+}
+export default PostalCodeAndCity;

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

@@ -0,0 +1,31 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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 from 'react';
+import StringValue from '../String';
+import useTranslation from '../../hooks/useTranslation';
+import { useValueProps } from '../../hooks';
+function PostalCodeAndCity(props) {
+  var _props$value, _props$label;
+  const translations = useTranslation().PostalCodeAndCity;
+  const city = (props === null || props === void 0 ? void 0 : props.city) || {};
+  const postalCode = (props === null || props === void 0 ? void 0 : props.postalCode) || {};
+  const cityProps = useValueProps(city);
+  if (cityProps.value) {
+    city.value = cityProps.value;
+  }
+  const postalCodeProps = useValueProps(postalCode);
+  if (postalCodeProps.value) {
+    postalCode.value = postalCodeProps.value;
+  }
+  const value = (_props$value = props.value) !== null && _props$value !== void 0 ? _props$value : (postalCode || city ? [postalCode === null || postalCode === void 0 ? void 0 : postalCode.value, city === null || city === void 0 ? void 0 : city.value].filter(Boolean).join(' ') : undefined) || undefined;
+  const label = (_props$label = props.label) !== null && _props$label !== void 0 ? _props$label : props.inline ? undefined : translations.label;
+  const stringValueProps = _objectSpread(_objectSpread({}, props), {}, {
+    value,
+    label
+  });
+  return React.createElement(StringValue, stringValueProps);
+}
+PostalCodeAndCity._supportsSpacingProps = true;
+export default PostalCodeAndCity;
+//# sourceMappingURL=PostalCodeAndCity.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PostalCodeAndCity.js","names":["React","StringValue","useTranslation","useValueProps","PostalCodeAndCity","props","_props$value","_props$label","translations","city","postalCode","cityProps","value","postalCodeProps","filter","Boolean","join","undefined","label","inline","stringValueProps","_objectSpread","createElement","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Value/PostalCodeAndCity/PostalCodeAndCity.tsx"],"sourcesContent":["import React from 'react'\nimport StringValue, { Props as StringValueProps } from '../String'\nimport useTranslation from '../../hooks/useTranslation'\nimport { useValueProps } from '../../hooks'\n\nexport type Props = StringValueProps &\n  Partial<Record<'postalCode' | 'city', StringValueProps>>\n\nfunction PostalCodeAndCity(props: Props) {\n  const translations = useTranslation().PostalCodeAndCity\n\n  const city = props?.city || {}\n  const postalCode = props?.postalCode || {}\n\n  const cityProps = useValueProps(city)\n  if (cityProps.value) {\n    city.value = cityProps.value\n  }\n\n  const postalCodeProps = useValueProps(postalCode)\n  if (postalCodeProps.value) {\n    postalCode.value = postalCodeProps.value\n  }\n\n  const value =\n    props.value ??\n    ((postalCode || city\n      ? [postalCode?.value, city?.value].filter(Boolean).join(' ')\n      : undefined) ||\n      undefined)\n  const label =\n    props.label ?? (props.inline ? undefined : translations.label)\n\n  const stringValueProps: Props = {\n    ...props,\n    value,\n    label,\n  }\n\n  return <StringValue {...stringValueProps} />\n}\n\nPostalCodeAndCity._supportsSpacingProps = true\nexport default PostalCodeAndCity\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,WAAW,MAAqC,WAAW;AAClE,OAAOC,cAAc,MAAM,4BAA4B;AACvD,SAASC,aAAa,QAAQ,aAAa;AAK3C,SAASC,iBAAiBA,CAACC,KAAY,EAAE;EAAA,IAAAC,YAAA,EAAAC,YAAA;EACvC,MAAMC,YAAY,GAAGN,cAAc,CAAC,CAAC,CAACE,iBAAiB;EAEvD,MAAMK,IAAI,GAAG,CAAAJ,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEI,IAAI,KAAI,CAAC,CAAC;EAC9B,MAAMC,UAAU,GAAG,CAAAL,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEK,UAAU,KAAI,CAAC,CAAC;EAE1C,MAAMC,SAAS,GAAGR,aAAa,CAACM,IAAI,CAAC;EACrC,IAAIE,SAAS,CAACC,KAAK,EAAE;IACnBH,IAAI,CAACG,KAAK,GAAGD,SAAS,CAACC,KAAK;EAC9B;EAEA,MAAMC,eAAe,GAAGV,aAAa,CAACO,UAAU,CAAC;EACjD,IAAIG,eAAe,CAACD,KAAK,EAAE;IACzBF,UAAU,CAACE,KAAK,GAAGC,eAAe,CAACD,KAAK;EAC1C;EAEA,MAAMA,KAAK,IAAAN,YAAA,GACTD,KAAK,CAACO,KAAK,cAAAN,YAAA,cAAAA,YAAA,GACV,CAACI,UAAU,IAAID,IAAI,GAChB,CAACC,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEE,KAAK,EAAEH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEG,KAAK,CAAC,CAACE,MAAM,CAACC,OAAO,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,GAC1DC,SAAS,KACXA,SAAU;EACd,MAAMC,KAAK,IAAAX,YAAA,GACTF,KAAK,CAACa,KAAK,cAAAX,YAAA,cAAAA,YAAA,GAAKF,KAAK,CAACc,MAAM,GAAGF,SAAS,GAAGT,YAAY,CAACU,KAAM;EAEhE,MAAME,gBAAuB,GAAAC,aAAA,CAAAA,aAAA,KACxBhB,KAAK;IACRO,KAAK;IACLM;EAAK,EACN;EAED,OAAOlB,KAAA,CAAAsB,aAAA,CAACrB,WAAW,EAAKmB,gBAAmB,CAAC;AAC9C;AAEAhB,iBAAiB,CAACmB,qBAAqB,GAAG,IAAI;AAC9C,eAAenB,iBAAiB"}

package/es/extensions/forms/Value/PostalCodeAndCity/PostalCodeAndCityDocs.d.ts

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

package/es/extensions/forms/Value/PostalCodeAndCity/PostalCodeAndCityDocs.js

@@ -0,0 +1,13 @@
+export const PostalCodeAndCityProperties = {
+  postalCode: {
+    doc: 'Properties such as `value` and `path` for the [Value.String](/uilib/extensions/forms/Value/String) component for postcode.',
+    type: 'object',
+    status: 'optional'
+  },
+  city: {
+    doc: 'Properties such as `value` and `path` for the [Value.String](/uilib/extensions/forms/Value/String) component for city.',
+    type: 'object',
+    status: 'optional'
+  }
+};
+//# sourceMappingURL=PostalCodeAndCityDocs.js.map

package/es/extensions/forms/Value/PostalCodeAndCity/PostalCodeAndCityDocs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PostalCodeAndCityDocs.js","names":["PostalCodeAndCityProperties","postalCode","doc","type","status","city"],"sources":["../../../../../../src/extensions/forms/Value/PostalCodeAndCity/PostalCodeAndCityDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const PostalCodeAndCityProperties: PropertiesTableProps = {\n  postalCode: {\n    doc: 'Properties such as `value` and `path` for the [Value.String](/uilib/extensions/forms/Value/String) component for postcode.',\n    type: 'object',\n    status: 'optional',\n  },\n  city: {\n    doc: 'Properties such as `value` and `path` for the [Value.String](/uilib/extensions/forms/Value/String) component for city.',\n    type: 'object',\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,2BAAiD,GAAG;EAC/DC,UAAU,EAAE;IACVC,GAAG,EAAE,4HAA4H;IACjIC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,IAAI,EAAE;IACJH,GAAG,EAAE,wHAAwH;IAC7HC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV;AACF,CAAC"}

package/es/extensions/forms/Value/PostalCodeAndCity/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './PostalCodeAndCity';
+export * from './PostalCodeAndCity';

package/es/extensions/forms/Value/PostalCodeAndCity/index.js

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

package/es/extensions/forms/Value/PostalCodeAndCity/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default"],"sources":["../../../../../../src/extensions/forms/Value/PostalCodeAndCity/index.ts"],"sourcesContent":["export { default } from './PostalCodeAndCity'\nexport * from './PostalCodeAndCity'\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,qBAAqB;AAC7C,cAAc,qBAAqB"}

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

@@ -1,15 +1,20 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["value"];
+const _excluded = ["value", "className"];
 import React from 'react';
+import classnames from 'classnames';
 import ValueBlock from '../../ValueBlock';
 import { useValueProps } from '../../hooks';
 function StringComponent(props) {
   const _useValueProps = useValueProps(props),
     {
-      value
+      value,
+      className
     } = _useValueProps,
     rest = _objectWithoutProperties(_useValueProps, _excluded);
-  return React.createElement(ValueBlock, rest, value);
+  return React.createElement(ValueBlock, _extends({
+    className: classnames('dnb-forms-value-string', className)
+  }, rest), value);
 }
 StringComponent._supportsSpacingProps = true;
 export default StringComponent;