@dnb/eufemia 10.7.0 → 10.9.0

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

@@ -0,0 +1,80 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { useMemo, useCallback } from 'react';
+import FlexContainer from '../Layout/FlexContainer';
+import classnames from 'classnames';
+import pointer from 'json-pointer';
+import IterateElementContext from './IterateElementContext';
+import FieldBlock from '../FieldBlock';
+import { useDataValue } from '../hooks';
+import { pickSpacingProps } from '../types';
+function ArrayComponent(props) {
+  const {
+    className,
+    layout = 'vertical',
+    placeholder,
+    label,
+    labelDescription,
+    labelSecondary,
+    path,
+    value: arrayValue,
+    info,
+    warning,
+    error,
+    emptyValue,
+    width,
+    spacing = 'small',
+    handleChange,
+    children
+  } = useDataValue(props);
+  const elementData = useMemo(() => {
+    return (arrayValue ?? []).map((elementValue, elementIndex) => ({
+      elementValue,
+      handleElementChange: (path, value) => {
+        const newArrayValue = structuredClone(arrayValue);
+        pointer.set(newArrayValue, path, value);
+        handleChange === null || handleChange === void 0 ? void 0 : handleChange(newArrayValue);
+      },
+      handleRemoveElement: () => {
+        const newArrayValue = structuredClone(arrayValue);
+        newArrayValue.splice(elementIndex, 1);
+        handleChange === null || handleChange === void 0 ? void 0 : handleChange(newArrayValue);
+      }
+    }));
+  }, [arrayValue, handleChange]);
+  const handlePush = useCallback(element => {
+    handleChange([...(arrayValue ?? []), element]);
+  }, [arrayValue, handleChange]);
+  return React.createElement(FieldBlock, _extends({
+    className: classnames('dnb-forms-field-number', className),
+    layout: layout,
+    label: label,
+    labelDescription: labelDescription,
+    labelSecondary: labelSecondary,
+    info: info,
+    warning: warning,
+    error: error,
+    contentsWidth: width !== false ? width : undefined
+  }, pickSpacingProps(props)), React.createElement(FlexContainer, {
+    direction: layout === 'horizontal' ? 'row' : 'column',
+    spacing: spacing
+  }, arrayValue === emptyValue ? React.createElement("em", null, placeholder) : elementData.map(({
+    elementValue,
+    handleElementChange,
+    handleRemoveElement
+  }, elementIndex) => {
+    return React.createElement(IterateElementContext.Provider, {
+      key: `element-${elementIndex}`,
+      value: {
+        index: elementIndex,
+        value: elementValue,
+        path,
+        handleChange: handleElementChange,
+        handleRemove: handleRemoveElement,
+        handlePush
+      }
+    }, Array.isArray(children) ? children.map(childElement => typeof childElement === 'function' ? childElement(elementValue, elementIndex) : childElement) : typeof children === 'function' ? children(elementValue, elementIndex) : children);
+  })));
+}
+ArrayComponent._supportsEufemiaSpacingProps = true;
+export default ArrayComponent;
+//# sourceMappingURL=Array.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Array.js","names":["React","useMemo","useCallback","FlexContainer","classnames","pointer","IterateElementContext","FieldBlock","useDataValue","pickSpacingProps","ArrayComponent","props","className","layout","placeholder","label","labelDescription","labelSecondary","path","value","arrayValue","info","warning","error","emptyValue","width","spacing","handleChange","children","elementData","map","elementValue","elementIndex","handleElementChange","newArrayValue","structuredClone","set","handleRemoveElement","splice","handlePush","element","createElement","_extends","contentsWidth","undefined","direction","Provider","key","index","handleRemove","Array","isArray","childElement","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Iterate/Array.tsx"],"sourcesContent":["import React, { useMemo, useCallback } from 'react'\nimport FlexContainer, {\n  Props as FlexContainerProps,\n} from '../Layout/FlexContainer'\nimport classnames from 'classnames'\nimport pointer from 'json-pointer'\nimport IterateElementContext from './IterateElementContext'\nimport FieldBlock from '../FieldBlock'\nimport { useDataValue } from '../hooks'\nimport { FieldProps, FieldHelpProps, pickSpacingProps } from '../types'\n\ninterface ErrorMessages {\n  required?: string\n  schema?: string\n}\n\nexport type Props = FieldHelpProps &\n  FieldProps<unknown[], undefined, ErrorMessages> & {\n    width?: false | 'small' | 'medium' | 'large' | 'stretch'\n    spacing?: FlexContainerProps['spacing']\n    children:\n      | React.ReactNode\n      | ((value: any, index: number) => React.ReactNode)\n      | Array<\n          | React.ReactNode\n          | ((value: any, index: number) => React.ReactNode)\n        >\n  }\n\nfunction ArrayComponent(props: Props) {\n  const {\n    className,\n    layout = 'vertical',\n    placeholder,\n    label,\n    labelDescription,\n    labelSecondary,\n    path,\n    value: arrayValue,\n    info,\n    warning,\n    error,\n    emptyValue,\n    width,\n    spacing = 'small',\n    handleChange,\n    children,\n  } = useDataValue(props)\n\n  const elementData: {\n    elementValue: unknown\n    handleElementChange: (path: string, value: unknown) => void\n    handleRemoveElement: () => void\n  }[] = useMemo(() => {\n    return (arrayValue ?? []).map((elementValue, elementIndex) => ({\n      elementValue,\n      handleElementChange: (path, value) => {\n        const newArrayValue = structuredClone(arrayValue)\n        pointer.set(newArrayValue, path, value)\n        handleChange?.(newArrayValue)\n      },\n      handleRemoveElement: () => {\n        const newArrayValue = structuredClone(arrayValue)\n        newArrayValue.splice(elementIndex, 1)\n        handleChange?.(newArrayValue)\n      },\n    }))\n  }, [arrayValue, handleChange])\n\n  const handlePush = useCallback(\n    (element: unknown) => {\n      handleChange([...(arrayValue ?? []), element])\n    },\n    [arrayValue, handleChange]\n  )\n\n  return (\n    <FieldBlock\n      className={classnames('dnb-forms-field-number', className)}\n      layout={layout}\n      label={label}\n      labelDescription={labelDescription}\n      labelSecondary={labelSecondary}\n      info={info}\n      warning={warning}\n      error={error}\n      contentsWidth={width !== false ? width : undefined}\n      {...pickSpacingProps(props)}\n    >\n      <FlexContainer\n        direction={layout === 'horizontal' ? 'row' : 'column'}\n        spacing={spacing}\n      >\n        {arrayValue === emptyValue ? (\n          <em>{placeholder}</em>\n        ) : (\n          elementData.map(\n            (\n              { elementValue, handleElementChange, handleRemoveElement },\n              elementIndex\n            ) => {\n              return (\n                <IterateElementContext.Provider\n                  key={`element-${elementIndex}`}\n                  value={{\n                    index: elementIndex,\n                    value: elementValue,\n                    path,\n                    handleChange: handleElementChange,\n                    handleRemove: handleRemoveElement,\n                    handlePush,\n                  }}\n                >\n                  {Array.isArray(children)\n                    ? children.map((childElement) =>\n                        typeof childElement === 'function'\n                          ? childElement(elementValue, elementIndex)\n                          : childElement\n                      )\n                    : typeof children === 'function'\n                    ? children(elementValue, elementIndex)\n                    : children}\n                </IterateElementContext.Provider>\n              )\n            }\n          )\n        )}\n      </FlexContainer>\n    </FieldBlock>\n  )\n}\n\nArrayComponent._supportsEufemiaSpacingProps = true\nexport default ArrayComponent\n"],"mappings":"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"}

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

@@ -0,0 +1,10 @@
+import { ButtonProps } from '../../../components/Button';
+import { DataValueReadWriteComponentProps } from '../types';
+export type Props = ButtonProps & DataValueReadWriteComponentProps<unknown[]> & {
+    pushValue: unknown;
+};
+declare function ArrayPushButton(props: Props): import("react/jsx-runtime").JSX.Element;
+declare namespace ArrayPushButton {
+    var _supportsEufemiaSpacingProps: boolean;
+}
+export default ArrayPushButton;

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

@@ -0,0 +1,42 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["pushValue"];
+import React, { useCallback, useContext } from 'react';
+import classnames from 'classnames';
+import { Button } from '../../../components';
+import IterateElementContext from './IterateElementContext';
+import { useDataValue } from '../hooks';
+import { omitDataValueReadWriteProps } from '../types';
+function ArrayPushButton(props) {
+  const iterateElementContext = useContext(IterateElementContext);
+  const {
+    handlePush
+  } = iterateElementContext ?? {};
+  const {
+      pushValue
+    } = props,
+    restProps = _objectWithoutProperties(props, _excluded);
+  const buttonProps = omitDataValueReadWriteProps(restProps);
+  const {
+    value,
+    handleChange,
+    children
+  } = useDataValue(restProps);
+  if (value !== undefined && !Array.isArray(value)) {
+    throw new Error('ArrayPushButton received a non-array value.');
+  }
+  const handleClick = useCallback(() => {
+    if (handlePush) {
+      handlePush(pushValue);
+      return;
+    }
+    handleChange([...(value ?? []), pushValue]);
+  }, [value, pushValue, handlePush, handleChange]);
+  return React.createElement(Button, _extends({
+    className: classnames('dnb-forms-array-push-button', props.className),
+    on_click: handleClick
+  }, buttonProps), children);
+}
+ArrayPushButton._supportsEufemiaSpacingProps = true;
+export default ArrayPushButton;
+//# sourceMappingURL=ArrayPushButton.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayPushButton.js","names":["React","useCallback","useContext","classnames","Button","IterateElementContext","useDataValue","omitDataValueReadWriteProps","ArrayPushButton","props","iterateElementContext","handlePush","pushValue","restProps","_objectWithoutProperties","_excluded","buttonProps","value","handleChange","children","undefined","Array","isArray","Error","handleClick","createElement","_extends","className","on_click","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Iterate/ArrayPushButton.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 { useDataValue } from '../hooks'\nimport {\n  DataValueReadWriteComponentProps,\n  omitDataValueReadWriteProps,\n} from '../types'\n\nexport type Props = ButtonProps &\n  DataValueReadWriteComponentProps<unknown[]> & {\n    pushValue: unknown\n  }\n\nfunction ArrayPushButton(props: Props) {\n  const iterateElementContext = useContext(IterateElementContext)\n  const { handlePush } = iterateElementContext ?? {}\n\n  const { pushValue, ...restProps } = props\n  const buttonProps = omitDataValueReadWriteProps(restProps)\n  const { value, handleChange, children } = useDataValue(restProps)\n\n  if (value !== undefined && !Array.isArray(value)) {\n    throw new Error('ArrayPushButton received a non-array value.')\n  }\n\n  const handleClick = useCallback(() => {\n    if (handlePush) {\n      // Inside an Iterate element - make the change through the Iterate component\n      handlePush(pushValue)\n      return\n    }\n\n    // If not inside an iterate, it could still manipulate a source data set through useDataValue\n    handleChange([...(value ?? []), pushValue])\n  }, [value, pushValue, handlePush, handleChange])\n\n  return (\n    <Button\n      className={classnames(\n        'dnb-forms-array-push-button',\n        props.className\n      )}\n      on_click={handleClick}\n      {...buttonProps}\n    >\n      {children}\n    </Button>\n  )\n}\n\nArrayPushButton._supportsEufemiaSpacingProps = true\nexport default ArrayPushButton\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,MAAM,QAAQ,qBAAqB;AAE5C,OAAOC,qBAAqB,MAAM,yBAAyB;AAC3D,SAASC,YAAY,QAAQ,UAAU;AACvC,SAEEC,2BAA2B,QACtB,UAAU;AAOjB,SAASC,eAAeA,CAACC,KAAY,EAAE;EACrC,MAAMC,qBAAqB,GAAGR,UAAU,CAACG,qBAAqB,CAAC;EAC/D,MAAM;IAAEM;EAAW,CAAC,GAAGD,qBAAqB,IAAI,CAAC,CAAC;EAElD,MAAM;MAAEE;IAAwB,CAAC,GAAGH,KAAK;IAAnBI,SAAS,GAAAC,wBAAA,CAAKL,KAAK,EAAAM,SAAA;EACzC,MAAMC,WAAW,GAAGT,2BAA2B,CAACM,SAAS,CAAC;EAC1D,MAAM;IAAEI,KAAK;IAAEC,YAAY;IAAEC;EAAS,CAAC,GAAGb,YAAY,CAACO,SAAS,CAAC;EAEjE,IAAII,KAAK,KAAKG,SAAS,IAAI,CAACC,KAAK,CAACC,OAAO,CAACL,KAAK,CAAC,EAAE;IAChD,MAAM,IAAIM,KAAK,CAAC,6CAA6C,CAAC;EAChE;EAEA,MAAMC,WAAW,GAAGvB,WAAW,CAAC,MAAM;IACpC,IAAIU,UAAU,EAAE;MAEdA,UAAU,CAACC,SAAS,CAAC;MACrB;IACF;IAGAM,YAAY,CAAC,CAAC,IAAID,KAAK,IAAI,EAAE,CAAC,EAAEL,SAAS,CAAC,CAAC;EAC7C,CAAC,EAAE,CAACK,KAAK,EAAEL,SAAS,EAAED,UAAU,EAAEO,YAAY,CAAC,CAAC;EAEhD,OACElB,KAAA,CAAAyB,aAAA,CAACrB,MAAM,EAAAsB,QAAA;IACLC,SAAS,EAAExB,UAAU,CACnB,6BAA6B,EAC7BM,KAAK,CAACkB,SACR,CAAE;IACFC,QAAQ,EAAEJ;EAAY,GAClBR,WAAW,GAEdG,QACK,CAAC;AAEb;AAEAX,eAAe,CAACqB,4BAA4B,GAAG,IAAI;AACnD,eAAerB,eAAe"}

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

@@ -0,0 +1,8 @@
+import { ButtonProps } from '../../../components/Button';
+import { DataValueReadWriteComponentProps } from '../types';
+export type Props = ButtonProps & DataValueReadWriteComponentProps<unknown[]>;
+declare function ArrayRemoveElementButton(props: Props): import("react/jsx-runtime").JSX.Element;
+declare namespace ArrayRemoveElementButton {
+    var _supportsEufemiaSpacingProps: boolean;
+}
+export default ArrayRemoveElementButton;

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

@@ -0,0 +1,30 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { useCallback, useContext } from 'react';
+import classnames from 'classnames';
+import { Button } from '../../../components';
+import IterateElementContext from './IterateElementContext';
+import { useDataValue } from '../hooks';
+import { omitDataValueReadWriteProps } from '../types';
+function ArrayRemoveElementButton(props) {
+  const iterateElementContext = useContext(IterateElementContext);
+  const {
+    handleRemove
+  } = iterateElementContext ?? {};
+  if (!iterateElementContext) {
+    throw new Error('ArrayRemoveElementButton must be inside an Iterate.Array component.');
+  }
+  const buttonProps = omitDataValueReadWriteProps(props);
+  const {
+    children
+  } = useDataValue(props);
+  const handleClick = useCallback(() => {
+    handleRemove();
+  }, [handleRemove]);
+  return React.createElement(Button, _extends({
+    className: classnames('dnb-forms-array-remove-element-button', props.className),
+    on_click: handleClick
+  }, buttonProps), children);
+}
+ArrayRemoveElementButton._supportsEufemiaSpacingProps = true;
+export default ArrayRemoveElementButton;
+//# sourceMappingURL=ArrayRemoveElementButton.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayRemoveElementButton.js","names":["React","useCallback","useContext","classnames","Button","IterateElementContext","useDataValue","omitDataValueReadWriteProps","ArrayRemoveElementButton","props","iterateElementContext","handleRemove","Error","buttonProps","children","handleClick","createElement","_extends","className","on_click","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Iterate/ArrayRemoveElementButton.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 { useDataValue } from '../hooks'\nimport {\n  DataValueReadWriteComponentProps,\n  omitDataValueReadWriteProps,\n} from '../types'\n\nexport type Props = ButtonProps &\n  DataValueReadWriteComponentProps<unknown[]>\n\nfunction ArrayRemoveElementButton(props: Props) {\n  const iterateElementContext = useContext(IterateElementContext)\n  const { handleRemove } = iterateElementContext ?? {}\n\n  if (!iterateElementContext) {\n    throw new Error(\n      'ArrayRemoveElementButton must be inside an Iterate.Array component.'\n    )\n  }\n\n  const buttonProps = omitDataValueReadWriteProps(props)\n\n  const { children } = useDataValue(props)\n\n  const handleClick = useCallback(() => {\n    handleRemove()\n  }, [handleRemove])\n\n  return (\n    <Button\n      className={classnames(\n        'dnb-forms-array-remove-element-button',\n        props.className\n      )}\n      on_click={handleClick}\n      {...buttonProps}\n    >\n      {children}\n    </Button>\n  )\n}\n\nArrayRemoveElementButton._supportsEufemiaSpacingProps = true\nexport default ArrayRemoveElementButton\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,QAAQ,OAAO;AACtD,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,MAAM,QAAQ,qBAAqB;AAE5C,OAAOC,qBAAqB,MAAM,yBAAyB;AAC3D,SAASC,YAAY,QAAQ,UAAU;AACvC,SAEEC,2BAA2B,QACtB,UAAU;AAKjB,SAASC,wBAAwBA,CAACC,KAAY,EAAE;EAC9C,MAAMC,qBAAqB,GAAGR,UAAU,CAACG,qBAAqB,CAAC;EAC/D,MAAM;IAAEM;EAAa,CAAC,GAAGD,qBAAqB,IAAI,CAAC,CAAC;EAEpD,IAAI,CAACA,qBAAqB,EAAE;IAC1B,MAAM,IAAIE,KAAK,CACb,qEACF,CAAC;EACH;EAEA,MAAMC,WAAW,GAAGN,2BAA2B,CAACE,KAAK,CAAC;EAEtD,MAAM;IAAEK;EAAS,CAAC,GAAGR,YAAY,CAACG,KAAK,CAAC;EAExC,MAAMM,WAAW,GAAGd,WAAW,CAAC,MAAM;IACpCU,YAAY,CAAC,CAAC;EAChB,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,OACEX,KAAA,CAAAgB,aAAA,CAACZ,MAAM,EAAAa,QAAA;IACLC,SAAS,EAAEf,UAAU,CACnB,uCAAuC,EACvCM,KAAK,CAACS,SACR,CAAE;IACFC,QAAQ,EAAEJ;EAAY,GAClBF,WAAW,GAEdC,QACK,CAAC;AAEb;AAEAN,wBAAwB,CAACY,4BAA4B,GAAG,IAAI;AAC5D,eAAeZ,wBAAwB"}

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

@@ -0,0 +1,11 @@
+import React from 'react';
+export interface IterateElementContextState {
+    index: number;
+    value: unknown;
+    path?: string;
+    handleChange: (path: string, value: unknown) => void;
+    handleRemove: () => void;
+    handlePush: (value: unknown) => void;
+}
+declare const IterateElementContext: React.Context<IterateElementContextState>;
+export default IterateElementContext;

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"IterateElementContext.js","names":["React","IterateElementContext","createContext","undefined"],"sources":["../../../../../src/extensions/forms/Iterate/IterateElementContext.ts"],"sourcesContent":["import React from 'react'\n\nexport interface IterateElementContextState {\n  index: number\n  value: unknown\n  path?: string\n  handleChange: (path: string, value: unknown) => void\n  handleRemove: () => void\n  handlePush: (value: unknown) => void\n}\n\nconst IterateElementContext = React.createContext<\n  IterateElementContextState | undefined\n>(undefined)\n\nexport default IterateElementContext\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAWzB,MAAMC,qBAAqB,GAAGD,KAAK,CAACE,aAAa,CAE/CC,SAAS,CAAC;AAEZ,eAAeF,qBAAqB"}

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

@@ -0,0 +1,11 @@
+import ArrayComponent from './Array';
+import ArrayPushButton from './ArrayPushButton';
+import ArrayRemoveElementButton from './ArrayRemoveElementButton';
+import IterateElementContext from './IterateElementContext';
+declare const Iterate: {
+    Array: typeof ArrayComponent;
+    ArrayPushButton: typeof ArrayPushButton;
+    ArrayRemoveElementButton: typeof ArrayRemoveElementButton;
+};
+export default Iterate;
+export { IterateElementContext };

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

@@ -0,0 +1,12 @@
+import ArrayComponent from './Array';
+import ArrayPushButton from './ArrayPushButton';
+import ArrayRemoveElementButton from './ArrayRemoveElementButton';
+import IterateElementContext from './IterateElementContext';
+const Iterate = {
+  Array: ArrayComponent,
+  ArrayPushButton,
+  ArrayRemoveElementButton
+};
+export default Iterate;
+export { IterateElementContext };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ArrayComponent","ArrayPushButton","ArrayRemoveElementButton","IterateElementContext","Iterate","Array"],"sources":["../../../../../src/extensions/forms/Iterate/index.ts"],"sourcesContent":["import ArrayComponent from './Array'\nimport ArrayPushButton from './ArrayPushButton'\nimport ArrayRemoveElementButton from './ArrayRemoveElementButton'\nimport IterateElementContext from './IterateElementContext'\n\nconst Iterate = {\n  Array: ArrayComponent,\n  ArrayPushButton,\n  ArrayRemoveElementButton,\n}\n\nexport default Iterate\n\nexport { IterateElementContext }\n"],"mappings":"AAAA,OAAOA,cAAc,MAAM,SAAS;AACpC,OAAOC,eAAe,MAAM,mBAAmB;AAC/C,OAAOC,wBAAwB,MAAM,4BAA4B;AACjE,OAAOC,qBAAqB,MAAM,yBAAyB;AAE3D,MAAMC,OAAO,GAAG;EACdC,KAAK,EAAEL,cAAc;EACrBC,eAAe;EACfC;AACF,CAAC;AAED,eAAeE,OAAO;AAEtB,SAASD,qBAAqB"}

package/es/extensions/forms/Layout/ButtonRow.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ComponentProps } from '../component-types';
+import { ComponentProps } from '../types';
 export type Props = ComponentProps & {
     children?: React.ReactNode;
 };

package/es/extensions/forms/Layout/ButtonRow.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import classnames from 'classnames';
 import { Div } from '../../../elements';
-import { forwardSpaceProps } from '../utils';
+import { pickSpacingProps } from '../types';
 function ButtonRow(props) {
   const {
     className,
@@ -10,7 +10,7 @@ function ButtonRow(props) {
   } = props;
   return React.createElement(Div, _extends({
     className: classnames('dnb-forms-button-row', className)
-  }, forwardSpaceProps(props)), children);
+  }, pickSpacingProps(props)), children);
 }
 ButtonRow._supportsEufemiaSpacingProps = true;
 export default ButtonRow;

package/es/extensions/forms/Layout/ButtonRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonRow.js","names":["React","classnames","Div","forwardSpaceProps","ButtonRow","props","className","children","createElement","_extends","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/ButtonRow.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Div } from '../../../elements'\nimport { forwardSpaceProps } from '../utils'\nimport type { ComponentProps } from '../component-types'\n\nexport type Props = ComponentProps & {\n  children?: React.ReactNode\n}\n\nfunction ButtonRow(props: Props) {\n  const { className, children } = props\n  return (\n    <Div\n      className={classnames('dnb-forms-button-row', className)}\n      {...forwardSpaceProps(props)}\n    >\n      {children}\n    </Div>\n  )\n}\n\nButtonRow._supportsEufemiaSpacingProps = true\nexport default ButtonRow\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,GAAG,QAAQ,mBAAmB;AACvC,SAASC,iBAAiB,QAAQ,UAAU;AAO5C,SAASC,SAASA,CAACC,KAAY,EAAE;EAC/B,MAAM;IAAEC,SAAS;IAAEC;EAAS,CAAC,GAAGF,KAAK;EACrC,OACEL,KAAA,CAAAQ,aAAA,CAACN,GAAG,EAAAO,QAAA;IACFH,SAAS,EAAEL,UAAU,CAAC,sBAAsB,EAAEK,SAAS;EAAE,GACrDH,iBAAiB,CAACE,KAAK,CAAC,GAE3BE,QACE,CAAC;AAEV;AAEAH,SAAS,CAACM,4BAA4B,GAAG,IAAI;AAC7C,eAAeN,SAAS"}
+{"version":3,"file":"ButtonRow.js","names":["React","classnames","Div","pickSpacingProps","ButtonRow","props","className","children","createElement","_extends","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/ButtonRow.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Div } from '../../../elements'\nimport { ComponentProps, pickSpacingProps } from '../types'\n\nexport type Props = ComponentProps & {\n  children?: React.ReactNode\n}\n\nfunction ButtonRow(props: Props) {\n  const { className, children } = props\n  return (\n    <Div\n      className={classnames('dnb-forms-button-row', className)}\n      {...pickSpacingProps(props)}\n    >\n      {children}\n    </Div>\n  )\n}\n\nButtonRow._supportsEufemiaSpacingProps = true\nexport default ButtonRow\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,GAAG,QAAQ,mBAAmB;AACvC,SAAyBC,gBAAgB,QAAQ,UAAU;AAM3D,SAASC,SAASA,CAACC,KAAY,EAAE;EAC/B,MAAM;IAAEC,SAAS;IAAEC;EAAS,CAAC,GAAGF,KAAK;EACrC,OACEL,KAAA,CAAAQ,aAAA,CAACN,GAAG,EAAAO,QAAA;IACFH,SAAS,EAAEL,UAAU,CAAC,sBAAsB,EAAEK,SAAS;EAAE,GACrDH,gBAAgB,CAACE,KAAK,CAAC,GAE1BE,QACE,CAAC;AAEV;AAEAH,SAAS,CAACM,4BAA4B,GAAG,IAAI;AAC7C,eAAeN,SAAS"}

package/es/extensions/forms/Layout/Card.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ComponentProps } from '../component-types';
+import { ComponentProps } from '../types';
 import { Props as FlexContainerProps } from './FlexContainer';
 export type Props = ComponentProps & {
     stack?: boolean;

package/es/extensions/forms/Layout/Card.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import classnames from 'classnames';
-import { forwardSpaceProps } from '../utils';
+import { pickSpacingProps } from '../types';
 import FlexContainer from './FlexContainer';
 import FlexItem from './FlexItem';
 function Card(props) {
@@ -18,7 +18,7 @@ function Card(props) {
       direction: "column",
       divider: "line",
       spacing: spacing ?? 'medium'
-    }, forwardSpaceProps(props)), children);
+    }, pickSpacingProps(props)), children);
   }
   if (direction || spacing) {
     return React.createElement(FlexContainer, _extends({
@@ -26,11 +26,11 @@ function Card(props) {
       direction: direction ?? 'column',
       divider: "space",
       spacing: spacing ?? 'small'
-    }, forwardSpaceProps(props)), children);
+    }, pickSpacingProps(props)), children);
   }
-  return React.createElement(FlexItem, {
+  return React.createElement(FlexItem, _extends({
     className: classnames('dnb-forms-card', className)
-  }, children);
+  }, pickSpacingProps(props)), children);
 }
 Card._supportsEufemiaSpacingProps = true;
 export default Card;

package/es/extensions/forms/Layout/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","names":["React","classnames","forwardSpaceProps","FlexContainer","FlexItem","Card","props","className","stack","direction","spacing","children","createElement","_extends","divider","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { forwardSpaceProps } from '../utils'\nimport type { ComponentProps } from '../component-types'\nimport FlexContainer, {\n  Props as FlexContainerProps,\n} from './FlexContainer'\nimport FlexItem from './FlexItem'\n\nexport type Props = ComponentProps & {\n  stack?: boolean\n  direction?: FlexContainerProps['direction']\n  spacing?: FlexContainerProps['spacing']\n  children: React.ReactNode\n}\n\nfunction Card(props: Props) {\n  const { className, stack, direction, spacing, children } = props\n\n  if (stack) {\n    return (\n      <FlexContainer\n        className={classnames('dnb-forms-card', className)}\n        direction=\"column\"\n        divider=\"line\"\n        spacing={spacing ?? 'medium'}\n        {...forwardSpaceProps(props)}\n      >\n        {children}\n      </FlexContainer>\n    )\n  }\n\n  if (direction || spacing) {\n    return (\n      <FlexContainer\n        className={classnames('dnb-forms-card', className)}\n        direction={direction ?? 'column'}\n        divider=\"space\"\n        spacing={spacing ?? 'small'}\n        {...forwardSpaceProps(props)}\n      >\n        {children}\n      </FlexContainer>\n    )\n  }\n\n  return (\n    <FlexItem className={classnames('dnb-forms-card', className)}>\n      {children}\n    </FlexItem>\n  )\n}\n\nCard._supportsEufemiaSpacingProps = true\nexport default Card\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,iBAAiB,QAAQ,UAAU;AAE5C,OAAOC,aAAa,MAEb,iBAAiB;AACxB,OAAOC,QAAQ,MAAM,YAAY;AASjC,SAASC,IAAIA,CAACC,KAAY,EAAE;EAC1B,MAAM;IAAEC,SAAS;IAAEC,KAAK;IAAEC,SAAS;IAAEC,OAAO;IAAEC;EAAS,CAAC,GAAGL,KAAK;EAEhE,IAAIE,KAAK,EAAE;IACT,OACER,KAAA,CAAAY,aAAA,CAACT,aAAa,EAAAU,QAAA;MACZN,SAAS,EAAEN,UAAU,CAAC,gBAAgB,EAAEM,SAAS,CAAE;MACnDE,SAAS,EAAC,QAAQ;MAClBK,OAAO,EAAC,MAAM;MACdJ,OAAO,EAAEA,OAAO,IAAI;IAAS,GACzBR,iBAAiB,CAACI,KAAK,CAAC,GAE3BK,QACY,CAAC;EAEpB;EAEA,IAAIF,SAAS,IAAIC,OAAO,EAAE;IACxB,OACEV,KAAA,CAAAY,aAAA,CAACT,aAAa,EAAAU,QAAA;MACZN,SAAS,EAAEN,UAAU,CAAC,gBAAgB,EAAEM,SAAS,CAAE;MACnDE,SAAS,EAAEA,SAAS,IAAI,QAAS;MACjCK,OAAO,EAAC,OAAO;MACfJ,OAAO,EAAEA,OAAO,IAAI;IAAQ,GACxBR,iBAAiB,CAACI,KAAK,CAAC,GAE3BK,QACY,CAAC;EAEpB;EAEA,OACEX,KAAA,CAAAY,aAAA,CAACR,QAAQ;IAACG,SAAS,EAAEN,UAAU,CAAC,gBAAgB,EAAEM,SAAS;EAAE,GAC1DI,QACO,CAAC;AAEf;AAEAN,IAAI,CAACU,4BAA4B,GAAG,IAAI;AACxC,eAAeV,IAAI"}
+{"version":3,"file":"Card.js","names":["React","classnames","pickSpacingProps","FlexContainer","FlexItem","Card","props","className","stack","direction","spacing","children","createElement","_extends","divider","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { ComponentProps, pickSpacingProps } from '../types'\nimport FlexContainer, {\n  Props as FlexContainerProps,\n} from './FlexContainer'\nimport FlexItem from './FlexItem'\n\nexport type Props = ComponentProps & {\n  stack?: boolean\n  direction?: FlexContainerProps['direction']\n  spacing?: FlexContainerProps['spacing']\n  children: React.ReactNode\n}\n\nfunction Card(props: Props) {\n  const { className, stack, direction, spacing, children } = props\n\n  if (stack) {\n    return (\n      <FlexContainer\n        className={classnames('dnb-forms-card', className)}\n        direction=\"column\"\n        divider=\"line\"\n        spacing={spacing ?? 'medium'}\n        {...pickSpacingProps(props)}\n      >\n        {children}\n      </FlexContainer>\n    )\n  }\n\n  if (direction || spacing) {\n    return (\n      <FlexContainer\n        className={classnames('dnb-forms-card', className)}\n        direction={direction ?? 'column'}\n        divider=\"space\"\n        spacing={spacing ?? 'small'}\n        {...pickSpacingProps(props)}\n      >\n        {children}\n      </FlexContainer>\n    )\n  }\n\n  return (\n    <FlexItem\n      className={classnames('dnb-forms-card', className)}\n      {...pickSpacingProps(props)}\n    >\n      {children}\n    </FlexItem>\n  )\n}\n\nCard._supportsEufemiaSpacingProps = true\nexport default Card\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAAyBC,gBAAgB,QAAQ,UAAU;AAC3D,OAAOC,aAAa,MAEb,iBAAiB;AACxB,OAAOC,QAAQ,MAAM,YAAY;AASjC,SAASC,IAAIA,CAACC,KAAY,EAAE;EAC1B,MAAM;IAAEC,SAAS;IAAEC,KAAK;IAAEC,SAAS;IAAEC,OAAO;IAAEC;EAAS,CAAC,GAAGL,KAAK;EAEhE,IAAIE,KAAK,EAAE;IACT,OACER,KAAA,CAAAY,aAAA,CAACT,aAAa,EAAAU,QAAA;MACZN,SAAS,EAAEN,UAAU,CAAC,gBAAgB,EAAEM,SAAS,CAAE;MACnDE,SAAS,EAAC,QAAQ;MAClBK,OAAO,EAAC,MAAM;MACdJ,OAAO,EAAEA,OAAO,IAAI;IAAS,GACzBR,gBAAgB,CAACI,KAAK,CAAC,GAE1BK,QACY,CAAC;EAEpB;EAEA,IAAIF,SAAS,IAAIC,OAAO,EAAE;IACxB,OACEV,KAAA,CAAAY,aAAA,CAACT,aAAa,EAAAU,QAAA;MACZN,SAAS,EAAEN,UAAU,CAAC,gBAAgB,EAAEM,SAAS,CAAE;MACnDE,SAAS,EAAEA,SAAS,IAAI,QAAS;MACjCK,OAAO,EAAC,OAAO;MACfJ,OAAO,EAAEA,OAAO,IAAI;IAAQ,GACxBR,gBAAgB,CAACI,KAAK,CAAC,GAE1BK,QACY,CAAC;EAEpB;EAEA,OACEX,KAAA,CAAAY,aAAA,CAACR,QAAQ,EAAAS,QAAA;IACPN,SAAS,EAAEN,UAAU,CAAC,gBAAgB,EAAEM,SAAS;EAAE,GAC/CL,gBAAgB,CAACI,KAAK,CAAC,GAE1BK,QACO,CAAC;AAEf;AAEAN,IAAI,CAACU,4BAA4B,GAAG,IAAI;AACxC,eAAeV,IAAI"}

package/es/extensions/forms/Layout/FlexContainer.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ComponentProps } from '../component-types';
+import { ComponentProps } from '../types';
 export declare function isHeadingElement(element: any): boolean;
 export declare const isEufemiaElement: (element: any) => boolean;
 /**
@@ -14,6 +14,7 @@ export type Props = ComponentProps & {
     divider?: 'space' | 'line';
     /** Spacing between items inside */
     spacing?: false | 'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large';
+    width?: 'small' | 'medium' | 'large';
     children: React.ReactNode;
 };
 declare function FlexContainer(props: Props): import("react/jsx-runtime").JSX.Element;

package/es/extensions/forms/Layout/FlexContainer.js

@@ -5,7 +5,7 @@ import classnames from 'classnames';
 import { Space } from '../../../components';
 import { Div } from '../../../elements';
 import * as EufemiaElements from '../../../elements';
-import { forwardSpaceProps } from '../utils';
+import { pickSpacingProps } from '../types';
 import MainHeading from './MainHeading';
 import SubHeading from './SubHeading';
 export function isHeadingElement(element) {
@@ -43,15 +43,16 @@ function FlexContainer(props) {
     direction = 'column',
     wrap = false,
     justify = 'flex-start',
-    align = 'stretch',
+    align = 'flex-start',
     divider = 'space',
-    spacing = 'small'
+    spacing = 'small',
+    width
   } = props;
-  const cn = classnames('dnb-forms-flex-container', className, direction && `dnb-forms-flex-container--direction-${direction}`, justify && `dnb-forms-flex-container--justify-${justify}`, align && `dnb-forms-flex-container--align-${align}`, wrap && `dnb-forms-flex-container--wrap`, divider && `dnb-forms-flex-container--divider-${divider}`, spacing && `dnb-forms-flex-container--spacing-${spacing}`);
+  const cn = classnames('dnb-forms-flex-container', className, direction && `dnb-forms-flex-container--direction-${direction}`, justify && `dnb-forms-flex-container--justify-${justify}`, align && `dnb-forms-flex-container--align-${align}`, wrap && `dnb-forms-flex-container--wrap`, divider && `dnb-forms-flex-container--divider-${divider}`, spacing && `dnb-forms-flex-container--spacing-${spacing}`, width && `dnb-forms-flex-container--width-${width}`);
   const childrenArray = React.Children.toArray(children);
   return React.createElement(Div, _extends({
     className: cn
-  }, forwardSpaceProps(props)), direction === 'column' ? childrenArray.map((child, i) => {
+  }, pickSpacingProps(props)), direction === 'column' ? childrenArray.map((child, i) => {
     const isFirst = i === 0;
     const previousChild = childrenArray === null || childrenArray === void 0 ? void 0 : childrenArray[i - 1];
     const currentIsHeading = isHeadingElement(child);

package/es/extensions/forms/Layout/FlexContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlexContainer.js","names":["React","classnames","Space","Div","EufemiaElements","forwardSpaceProps","MainHeading","SubHeading","isHeadingElement","element","type","getSpaceTop","_element$props","_element$props2","isValidElement","props","top","space","undefined","getSpaceBottom","_element$props3","_element$props4","bottom","isEufemiaElement","Object","values","some","eufemiaElement","isSpacePropsComponent","_element$type","renderWithSpacing","takesSpaceProps","cloneElement","createElement","FlexContainer","className","children","direction","wrap","justify","align","divider","spacing","cn","childrenArray","Children","toArray","_extends","map","child","i","isFirst","previousChild","currentIsHeading","previousWasHeading","spaceAboveLine","Fragment","key","_hr","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/FlexContainer.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Space } from '../../../components'\nimport { Div } from '../../../elements'\nimport * as EufemiaElements from '../../../elements'\nimport { SpaceType } from '../../../components/space/types'\nimport { forwardSpaceProps } from '../utils'\nimport type { ComponentProps } from '../component-types'\nimport MainHeading from './MainHeading'\nimport SubHeading from './SubHeading'\n\nexport function isHeadingElement(element): boolean {\n  return element.type === MainHeading || element.type === SubHeading\n}\n\nconst getSpaceTop = (\n  element: React.ReactChild | React.ReactFragment | React.ReactPortal\n): SpaceType | undefined => {\n  if (!React.isValidElement(element)) {\n    return\n  }\n  return (\n    element.props?.top ??\n    (typeof element.props?.space === 'object'\n      ? element.props.space.top\n      : undefined)\n  )\n}\n\nconst getSpaceBottom = (\n  element: React.ReactChild | React.ReactFragment | React.ReactPortal\n): SpaceType | undefined => {\n  if (!React.isValidElement(element)) {\n    return\n  }\n  return (\n    element.props?.bottom ??\n    (typeof element.props?.space === 'object'\n      ? element.props.space.bottom\n      : undefined)\n  )\n}\n\nexport const isEufemiaElement = (element): boolean => {\n  return Object.values(EufemiaElements).some(\n    (eufemiaElement) => element?.type === eufemiaElement\n  )\n}\n\n/**\n * Is the requested element a component that can receive Eufemia space props (space, top, bottom, left and right)?\n */\nexport const isSpacePropsComponent = (\n  element: React.ReactNode\n): boolean => {\n  return (\n    (React.isValidElement(element) &&\n      element?.type?.['_supportsEufemiaSpacingProps'] === true) ||\n    isEufemiaElement(element)\n  )\n}\n\nconst renderWithSpacing = (element: React.ReactNode, props) => {\n  const takesSpaceProps = isSpacePropsComponent(element)\n\n  return takesSpaceProps ? (\n    React.cloneElement(element as React.ReactElement<unknown>, props)\n  ) : (\n    <Div {...props}>{element}</Div>\n  )\n}\n\nexport type Props = ComponentProps & {\n  direction?: 'row' | 'column'\n  wrap?: boolean\n  justify?:\n    | 'flex-start'\n    | 'flex-end'\n    | 'center'\n    | 'space-between'\n    | 'space-around'\n    | 'space-evenly'\n  align?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline'\n  divider?: 'space' | 'line'\n  /** Spacing between items inside */\n  spacing?:\n    | false\n    | 'xx-small'\n    | 'x-small'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'x-large'\n    | 'xx-large'\n  children: React.ReactNode\n}\n\nfunction FlexContainer(props: Props) {\n  const {\n    className,\n    children,\n    direction = 'column',\n    wrap = false,\n    justify = 'flex-start',\n    align = 'stretch',\n    divider = 'space',\n    spacing = 'small',\n  } = props\n\n  const cn = classnames(\n    'dnb-forms-flex-container',\n    direction && `dnb-forms-flex-container--direction-${direction}`,\n    justify && `dnb-forms-flex-container--justify-${justify}`,\n    align && `dnb-forms-flex-container--align-${align}`,\n    wrap && `dnb-forms-flex-container--wrap`,\n    divider && `dnb-forms-flex-container--divider-${divider}`,\n    spacing && `dnb-forms-flex-container--spacing-${spacing}`,\n    className\n  )\n  const childrenArray = React.Children.toArray(children)\n\n  return (\n    <Div className={cn} {...forwardSpaceProps(props)}>\n      {direction === 'column'\n        ? childrenArray.map((child, i) => {\n            // Set spacing on child components by props (instead of CSS) to be able to dynamically override by props on each child. The default\n            // is the spacing-props that controls space between children. Then override with props sent to the children, including both top\n            // and bottom when th\n            const isFirst = i === 0\n            const previousChild = childrenArray?.[i - 1]\n            const currentIsHeading = isHeadingElement(child)\n            const previousWasHeading =\n              i > 0 && isHeadingElement(previousChild)\n\n            // Always set spacing between elements in the column layout on the top props, and 0 on bottom, to avoid\n            // having to divide spacing between both with smaller values.\n            const bottom = 0\n\n            if (\n              divider === 'line' &&\n              // No line above first element\n              !isFirst &&\n              // No line above/below headings\n              !previousWasHeading &&\n              !currentIsHeading\n            ) {\n              const spaceAboveLine =\n                getSpaceBottom(previousChild) ?? spacing\n              const top = getSpaceTop(child) ?? spacing\n\n              return (\n                <React.Fragment key={`element-${i}`}>\n                  <Space top={spaceAboveLine} />\n                  <hr className=\"dnb-forms-flex-container__hr\" />\n                  {renderWithSpacing(child, {\n                    space: { top, bottom },\n                    top,\n                    bottom,\n                  })}\n                </React.Fragment>\n              )\n            }\n\n            const top =\n              // No space above first element.\n              isFirst\n                ? 0\n                : // Since top space of current and bottom space of previous component is the same\n                  getSpaceTop(child) ??\n                  getSpaceBottom(previousChild) ??\n                  spacing\n\n            return renderWithSpacing(child, {\n              key: `element-${i}`,\n              space: { top, bottom },\n              top,\n              bottom,\n            })\n          })\n        : // TODO: Consider doing the same with spacing between horizontal items (direction = row) as vertical\n          children}\n    </Div>\n  )\n}\n\nFlexContainer._supportsEufemiaSpacingProps = true\nexport default FlexContainer\n"],"mappings":"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"}
+{"version":3,"file":"FlexContainer.js","names":["React","classnames","Space","Div","EufemiaElements","pickSpacingProps","MainHeading","SubHeading","isHeadingElement","element","type","getSpaceTop","_element$props","_element$props2","isValidElement","props","top","space","undefined","getSpaceBottom","_element$props3","_element$props4","bottom","isEufemiaElement","Object","values","some","eufemiaElement","isSpacePropsComponent","_element$type","renderWithSpacing","takesSpaceProps","cloneElement","createElement","FlexContainer","className","children","direction","wrap","justify","align","divider","spacing","width","cn","childrenArray","Children","toArray","_extends","map","child","i","isFirst","previousChild","currentIsHeading","previousWasHeading","spaceAboveLine","Fragment","key","_hr","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/FlexContainer.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Space } from '../../../components'\nimport { Div } from '../../../elements'\nimport * as EufemiaElements from '../../../elements'\nimport { SpaceType } from '../../../components/space/types'\nimport { ComponentProps, pickSpacingProps } from '../types'\nimport MainHeading from './MainHeading'\nimport SubHeading from './SubHeading'\n\nexport function isHeadingElement(element): boolean {\n  return element.type === MainHeading || element.type === SubHeading\n}\n\nconst getSpaceTop = (\n  element: React.ReactChild | React.ReactFragment | React.ReactPortal\n): SpaceType | undefined => {\n  if (!React.isValidElement(element)) {\n    return\n  }\n  return (\n    element.props?.top ??\n    (typeof element.props?.space === 'object'\n      ? element.props.space.top\n      : undefined)\n  )\n}\n\nconst getSpaceBottom = (\n  element: React.ReactChild | React.ReactFragment | React.ReactPortal\n): SpaceType | undefined => {\n  if (!React.isValidElement(element)) {\n    return\n  }\n  return (\n    element.props?.bottom ??\n    (typeof element.props?.space === 'object'\n      ? element.props.space.bottom\n      : undefined)\n  )\n}\n\nexport const isEufemiaElement = (element): boolean => {\n  return Object.values(EufemiaElements).some(\n    (eufemiaElement) => element?.type === eufemiaElement\n  )\n}\n\n/**\n * Is the requested element a component that can receive Eufemia space props (space, top, bottom, left and right)?\n */\nexport const isSpacePropsComponent = (\n  element: React.ReactNode\n): boolean => {\n  return (\n    (React.isValidElement(element) &&\n      element?.type?.['_supportsEufemiaSpacingProps'] === true) ||\n    isEufemiaElement(element)\n  )\n}\n\nconst renderWithSpacing = (element: React.ReactNode, props) => {\n  const takesSpaceProps = isSpacePropsComponent(element)\n\n  return takesSpaceProps ? (\n    React.cloneElement(element as React.ReactElement<unknown>, props)\n  ) : (\n    <Div {...props}>{element}</Div>\n  )\n}\n\nexport type Props = ComponentProps & {\n  direction?: 'row' | 'column'\n  wrap?: boolean\n  justify?:\n    | 'flex-start'\n    | 'flex-end'\n    | 'center'\n    | 'space-between'\n    | 'space-around'\n    | 'space-evenly'\n  align?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline'\n  divider?: 'space' | 'line'\n  /** Spacing between items inside */\n  spacing?:\n    | false\n    | 'xx-small'\n    | 'x-small'\n    | 'small'\n    | 'medium'\n    | 'large'\n    | 'x-large'\n    | 'xx-large'\n  width?: 'small' | 'medium' | 'large'\n  children: React.ReactNode\n}\n\nfunction FlexContainer(props: Props) {\n  const {\n    className,\n    children,\n    direction = 'column',\n    wrap = false,\n    justify = 'flex-start',\n    align = 'flex-start',\n    divider = 'space',\n    spacing = 'small',\n    width,\n  } = props\n\n  const cn = classnames(\n    'dnb-forms-flex-container',\n    direction && `dnb-forms-flex-container--direction-${direction}`,\n    justify && `dnb-forms-flex-container--justify-${justify}`,\n    align && `dnb-forms-flex-container--align-${align}`,\n    wrap && `dnb-forms-flex-container--wrap`,\n    divider && `dnb-forms-flex-container--divider-${divider}`,\n    spacing && `dnb-forms-flex-container--spacing-${spacing}`,\n    width && `dnb-forms-flex-container--width-${width}`,\n    className\n  )\n  const childrenArray = React.Children.toArray(children)\n\n  return (\n    <Div className={cn} {...pickSpacingProps(props)}>\n      {direction === 'column'\n        ? childrenArray.map((child, i) => {\n            // Set spacing on child components by props (instead of CSS) to be able to dynamically override by props on each child. The default\n            // is the spacing-props that controls space between children. Then override with props sent to the children, including both top\n            // and bottom when th\n            const isFirst = i === 0\n            const previousChild = childrenArray?.[i - 1]\n            const currentIsHeading = isHeadingElement(child)\n            const previousWasHeading =\n              i > 0 && isHeadingElement(previousChild)\n\n            // Always set spacing between elements in the column layout on the top props, and 0 on bottom, to avoid\n            // having to divide spacing between both with smaller values.\n            const bottom = 0\n\n            if (\n              divider === 'line' &&\n              // No line above first element\n              !isFirst &&\n              // No line above/below headings\n              !previousWasHeading &&\n              !currentIsHeading\n            ) {\n              const spaceAboveLine =\n                getSpaceBottom(previousChild) ?? spacing\n              const top = getSpaceTop(child) ?? spacing\n\n              return (\n                <React.Fragment key={`element-${i}`}>\n                  <Space top={spaceAboveLine} />\n                  <hr className=\"dnb-forms-flex-container__hr\" />\n                  {renderWithSpacing(child, {\n                    space: { top, bottom },\n                    top,\n                    bottom,\n                  })}\n                </React.Fragment>\n              )\n            }\n\n            const top =\n              // No space above first element.\n              isFirst\n                ? 0\n                : // Since top space of current and bottom space of previous component is the same\n                  getSpaceTop(child) ??\n                  getSpaceBottom(previousChild) ??\n                  spacing\n\n            return renderWithSpacing(child, {\n              key: `element-${i}`,\n              space: { top, bottom },\n              top,\n              bottom,\n            })\n          })\n        : // TODO: Consider doing the same with spacing between horizontal items (direction = row) as vertical\n          children}\n    </Div>\n  )\n}\n\nFlexContainer._supportsEufemiaSpacingProps = true\nexport default FlexContainer\n"],"mappings":"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"}

package/es/extensions/forms/Layout/FlexItem.d.ts

@@ -1,8 +1,9 @@
 import React from 'react';
-import type { ComponentProps } from '../component-types';
+import { ComponentProps } from '../types';
 export type Props = ComponentProps & {
     grow?: boolean;
     shrink?: boolean;
+    width?: 'small' | 'medium' | 'large';
     children: React.ReactNode;
 };
 declare function FlexItem(props: Props): import("react/jsx-runtime").JSX.Element;

package/es/extensions/forms/Layout/FlexItem.js

@@ -2,18 +2,19 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import classnames from 'classnames';
 import { Div } from '../../../elements';
-import { forwardSpaceProps } from '../utils';
+import { pickSpacingProps } from '../types';
 function FlexItem(props) {
   const {
     className,
     grow,
     shrink,
+    width,
     children
   } = props;
-  const cn = classnames('dnb-forms-flex-item', className, grow && 'dnb-forms-flex-item--grow', shrink && 'dnb-forms-flex-item--shrink');
+  const cn = classnames('dnb-forms-flex-item', className, grow && 'dnb-forms-flex-item--grow', shrink && 'dnb-forms-flex-item--shrink', width && `dnb-forms-flex-item--width-${width}`);
   return React.createElement(Div, _extends({
     className: cn
-  }, forwardSpaceProps(props)), children);
+  }, pickSpacingProps(props)), children);
 }
 FlexItem._supportsEufemiaSpacingProps = true;
 export default FlexItem;

package/es/extensions/forms/Layout/FlexItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlexItem.js","names":["React","classnames","Div","forwardSpaceProps","FlexItem","props","className","grow","shrink","children","cn","createElement","_extends","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/FlexItem.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Div } from '../../../elements'\nimport type { ComponentProps } from '../component-types'\nimport { forwardSpaceProps } from '../utils'\n\nexport type Props = ComponentProps & {\n  grow?: boolean\n  shrink?: boolean\n  children: React.ReactNode\n}\n\nfunction FlexItem(props: Props) {\n  const { className, grow, shrink, children } = props\n  const cn = classnames(\n    'dnb-forms-flex-item',\n    grow && 'dnb-forms-flex-item--grow',\n    shrink && 'dnb-forms-flex-item--shrink',\n    className\n  )\n\n  return (\n    <Div className={cn} {...forwardSpaceProps(props)}>\n      {children}\n    </Div>\n  )\n}\n\nFlexItem._supportsEufemiaSpacingProps = true\nexport default FlexItem\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,GAAG,QAAQ,mBAAmB;AAEvC,SAASC,iBAAiB,QAAQ,UAAU;AAQ5C,SAASC,QAAQA,CAACC,KAAY,EAAE;EAC9B,MAAM;IAAEC,SAAS;IAAEC,IAAI;IAAEC,MAAM;IAAEC;EAAS,CAAC,GAAGJ,KAAK;EACnD,MAAMK,EAAE,GAAGT,UAAU,CACnB,qBAAqB,EAGrBK,SAAS,EAFTC,IAAI,IAAI,2BAA2B,EACnCC,MAAM,IAAI,6BAEZ,CAAC;EAED,OACER,KAAA,CAAAW,aAAA,CAACT,GAAG,EAAAU,QAAA;IAACN,SAAS,EAAEI;EAAG,GAAKP,iBAAiB,CAACE,KAAK,CAAC,GAC7CI,QACE,CAAC;AAEV;AAEAL,QAAQ,CAACS,4BAA4B,GAAG,IAAI;AAC5C,eAAeT,QAAQ"}
+{"version":3,"file":"FlexItem.js","names":["React","classnames","Div","pickSpacingProps","FlexItem","props","className","grow","shrink","width","children","cn","createElement","_extends","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/FlexItem.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Div } from '../../../elements'\nimport { ComponentProps, pickSpacingProps } from '../types'\n\nexport type Props = ComponentProps & {\n  grow?: boolean\n  shrink?: boolean\n  width?: 'small' | 'medium' | 'large'\n  children: React.ReactNode\n}\n\nfunction FlexItem(props: Props) {\n  const { className, grow, shrink, width, children } = props\n  const cn = classnames(\n    'dnb-forms-flex-item',\n    grow && 'dnb-forms-flex-item--grow',\n    shrink && 'dnb-forms-flex-item--shrink',\n    width && `dnb-forms-flex-item--width-${width}`,\n    className\n  )\n\n  return (\n    <Div className={cn} {...pickSpacingProps(props)}>\n      {children}\n    </Div>\n  )\n}\n\nFlexItem._supportsEufemiaSpacingProps = true\nexport default FlexItem\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,GAAG,QAAQ,mBAAmB;AACvC,SAAyBC,gBAAgB,QAAQ,UAAU;AAS3D,SAASC,QAAQA,CAACC,KAAY,EAAE;EAC9B,MAAM;IAAEC,SAAS;IAAEC,IAAI;IAAEC,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAC,GAAGL,KAAK;EAC1D,MAAMM,EAAE,GAAGV,UAAU,CACnB,qBAAqB,EAIrBK,SAAS,EAHTC,IAAI,IAAI,2BAA2B,EACnCC,MAAM,IAAI,6BAA6B,EACvCC,KAAK,IAAK,8BAA6BA,KAAM,EAE/C,CAAC;EAED,OACET,KAAA,CAAAY,aAAA,CAACV,GAAG,EAAAW,QAAA;IAACP,SAAS,EAAEK;EAAG,GAAKR,gBAAgB,CAACE,KAAK,CAAC,GAC5CK,QACE,CAAC;AAEV;AAEAN,QAAQ,CAACU,4BAA4B,GAAG,IAAI;AAC5C,eAAeV,QAAQ"}

package/es/extensions/forms/Layout/MainHeading.d.ts

@@ -1,9 +1,11 @@
 import React from 'react';
-import type { ComponentProps } from '../component-types';
+import { ComponentProps } from '../types';
+import type { HeadingLevel } from '../../../components/Heading';
 export type Props = ComponentProps & {
+    level?: HeadingLevel;
     children?: React.ReactNode;
 };
-declare function MainHeading(props: Props): import("react/jsx-runtime").JSX.Element;
+declare function MainHeading({ level, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 declare namespace MainHeading {
     var _supportsEufemiaSpacingProps: boolean;
 }

package/es/extensions/forms/Layout/MainHeading.js

@@ -1,18 +1,24 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["level"];
 import React from 'react';
 import classnames from 'classnames';
 import { Heading } from '../../../components';
-import { forwardSpaceProps } from '../utils';
-function MainHeading(props) {
+import { pickSpacingProps } from '../types';
+function MainHeading(_ref) {
+  let {
+      level
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
   const {
     className,
     children
   } = props;
   return React.createElement(Heading, _extends({
     className: classnames('dnb-forms-main-heading', className),
-    level: "2",
+    level: level || 2,
     size: "large"
-  }, forwardSpaceProps(props)), children);
+  }, pickSpacingProps(props)), children);
 }
 MainHeading._supportsEufemiaSpacingProps = true;
 export default MainHeading;

package/es/extensions/forms/Layout/MainHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"MainHeading.js","names":["React","classnames","Heading","forwardSpaceProps","MainHeading","props","className","children","createElement","_extends","level","size","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/MainHeading.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Heading } from '../../../components'\nimport { forwardSpaceProps } from '../utils'\nimport type { ComponentProps } from '../component-types'\n\nexport type Props = ComponentProps & {\n  children?: React.ReactNode\n}\n\nfunction MainHeading(props: Props) {\n  const { className, children } = props\n  return (\n    <Heading\n      className={classnames('dnb-forms-main-heading', className)}\n      level=\"2\"\n      size=\"large\"\n      {...forwardSpaceProps(props)}\n    >\n      {children}\n    </Heading>\n  )\n}\n\nMainHeading._supportsEufemiaSpacingProps = true\nexport default MainHeading\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,OAAO,QAAQ,qBAAqB;AAC7C,SAASC,iBAAiB,QAAQ,UAAU;AAO5C,SAASC,WAAWA,CAACC,KAAY,EAAE;EACjC,MAAM;IAAEC,SAAS;IAAEC;EAAS,CAAC,GAAGF,KAAK;EACrC,OACEL,KAAA,CAAAQ,aAAA,CAACN,OAAO,EAAAO,QAAA;IACNH,SAAS,EAAEL,UAAU,CAAC,wBAAwB,EAAEK,SAAS,CAAE;IAC3DI,KAAK,EAAC,GAAG;IACTC,IAAI,EAAC;EAAO,GACRR,iBAAiB,CAACE,KAAK,CAAC,GAE3BE,QACM,CAAC;AAEd;AAEAH,WAAW,CAACQ,4BAA4B,GAAG,IAAI;AAC/C,eAAeR,WAAW"}
+{"version":3,"file":"MainHeading.js","names":["React","classnames","Heading","pickSpacingProps","MainHeading","_ref","level","props","_objectWithoutProperties","_excluded","className","children","createElement","_extends","size","_supportsEufemiaSpacingProps"],"sources":["../../../../../src/extensions/forms/Layout/MainHeading.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport { Heading } from '../../../components'\nimport { ComponentProps, pickSpacingProps } from '../types'\nimport type { HeadingLevel } from '../../../components/Heading'\n\nexport type Props = ComponentProps & {\n  level?: HeadingLevel\n  children?: React.ReactNode\n}\n\nfunction MainHeading({ level, ...props }: Props) {\n  const { className, children } = props\n  return (\n    <Heading\n      className={classnames('dnb-forms-main-heading', className)}\n      level={level || 2}\n      size=\"large\"\n      {...pickSpacingProps(props)}\n    >\n      {children}\n    </Heading>\n  )\n}\n\nMainHeading._supportsEufemiaSpacingProps = true\nexport default MainHeading\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,OAAO,QAAQ,qBAAqB;AAC7C,SAAyBC,gBAAgB,QAAQ,UAAU;AAQ3D,SAASC,WAAWA,CAAAC,IAAA,EAA6B;EAAA,IAA5B;MAAEC;IAAuB,CAAC,GAAAD,IAAA;IAAdE,KAAK,GAAAC,wBAAA,CAAAH,IAAA,EAAAI,SAAA;EACpC,MAAM;IAAEC,SAAS;IAAEC;EAAS,CAAC,GAAGJ,KAAK;EACrC,OACEP,KAAA,CAAAY,aAAA,CAACV,OAAO,EAAAW,QAAA;IACNH,SAAS,EAAET,UAAU,CAAC,wBAAwB,EAAES,SAAS,CAAE;IAC3DJ,KAAK,EAAEA,KAAK,IAAI,CAAE;IAClBQ,IAAI,EAAC;EAAO,GACRX,gBAAgB,CAACI,KAAK,CAAC,GAE1BI,QACM,CAAC;AAEd;AAEAP,WAAW,CAACW,4BAA4B,GAAG,IAAI;AAC/C,eAAeX,WAAW"}

package/es/extensions/forms/Layout/Section.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ComponentProps } from '../component-types';
+import { ComponentProps } from '../types';
 import { Props as FlexContainerProps } from './FlexContainer';
 export type Props = ComponentProps & {
     direction?: FlexContainerProps['direction'];

package/es/extensions/forms/Layout/Section.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import React from 'react';
 import classnames from 'classnames';
-import { forwardSpaceProps } from '../utils';
+import { pickSpacingProps } from '../types';
 import FlexContainer from './FlexContainer';
 function Section(props) {
   const {
@@ -14,7 +14,7 @@ function Section(props) {
     className: classnames('dnb-forms-section', className),
     direction: direction ?? 'column',
     spacing: spacing ?? 'small'
-  }, forwardSpaceProps(props)), children);
+  }, pickSpacingProps(props)), children);
 }
 Section._supportsEufemiaSpacingProps = true;
 export default Section;