@dnb/eufemia/extensions/forms/Iterate/Toolbar/Toolbar.js

DNB Eufemia Design System UI Library

"use client";

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _Fragment, _Hr;
const _excluded = ["children", "className"];
import "core-js/modules/web.dom-collections.iterator.js";
import React, { useContext, useEffect, useState } from 'react';
import classnames from 'classnames';
import { Hr } from '../../../../elements';
import { Flex, FormStatus, Space } from '../../../../components';
import IterateItemContext from '../IterateItemContext';
import ToolbarContext from './ToolbarContext';
import FieldBoundaryContext from '../../DataContext/FieldBoundary/FieldBoundaryContext';
import ArrayItemAreaContext from '../Array/ArrayItemAreaContext';
import { useTranslation } from '../../hooks';
export default function Toolbar() {
  let _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  let {
      children,
      className
    } = _ref,
    rest = _objectWithoutProperties(_ref, _excluded);
  const {
    index,
    value,
    arrayValue: items
  } = useContext(IterateItemContext) || {};
  const {
    toolbarVariant,
    divider
  } = useContext(ArrayItemAreaContext) || {};
  const {
    errorInContainer
  } = useTranslation().IterateEditContainer;
  const {
    hasError,
    hasVisibleError
  } = useContext(FieldBoundaryContext) || {};
  const [showError, setShowError] = useState(false);
  useEffect(() => {
    if (showError && !hasError) {
      setShowError(false);
    }
  }, [hasError, showError]);
  if (typeof children === 'function') {
    var _children;
    children = (_children = children) === null || _children === void 0 ? void 0 : _children({
      index,
      items,
      value
    });
  }
  if (React.Children.count(children) === 0) {
    return _Fragment || (_Fragment = React.createElement(React.Fragment, null));
  }
  return React.createElement(Space, _extends({
    top: toolbarVariant === 'custom' ? false : 'medium',
    className: classnames('dnb-forms-iterate-toolbar', className)
  }, rest), toolbarVariant !== 'custom' && divider !== 'line' && (_Hr || (_Hr = React.createElement(Hr, {
    space: 0
  }))), React.createElement(ToolbarContext.Provider, {
    value: {
      setShowError
    }
  }, React.createElement(Flex.Horizontal, {
    top: toolbarVariant === 'custom' ? false : 'x-small',
    gap: "large"
  }, children)), React.createElement(FormStatus, {
    show: showError && hasVisibleError,
    shellSpace: {
      top: 'x-small'
    },
    no_animation: false
  }, errorInContainer));
}
Toolbar._supportsSpacingProps = true;
//# sourceMappingURL=Toolbar.js.map