@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
76 lines (75 loc) • 2.51 kB
JavaScript
"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 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(_ref = {}) {
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