@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
64 lines (63 loc) • 2.86 kB
JavaScript
"use client";
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _DoneButton, _CancelButton;
const _excluded = ["children", "className", "title", "onDone", "onCancel"];
import React, { useCallback, useContext, useMemo, useRef } from 'react';
import classnames from 'classnames';
import { convertJsxToString } from '../../../../../shared/component-helper';
import { Flex } from '../../../../../components';
import { Lead } from '../../../../../elements';
import FieldBoundaryProvider from '../../../DataContext/FieldBoundary/FieldBoundaryProvider';
import SectionContainerContext from '../containers/SectionContainerContext';
import Toolbar from '../Toolbar/Toolbar';
import DoneButton from './DoneButton';
import CancelButton from './CancelButton';
import SectionContainer from '../containers/SectionContainer';
function EditContainer(props) {
const _ref = props || {},
{
children,
className,
title,
onDone,
onCancel
} = _ref,
restProps = _objectWithoutProperties(_ref, _excluded);
const ariaLabel = useMemo(() => convertJsxToString(title), [title]);
const {
containerMode,
initialContainerMode,
validateInitially,
switchContainerMode
} = useContext(SectionContainerContext) || {};
const omitFocusManagementRef = useRef(false);
const onPathError = useCallback((path, error) => {
if (initialContainerMode === 'auto' && containerMode !== 'edit' && error instanceof Error) {
omitFocusManagementRef.current = true;
switchContainerMode === null || switchContainerMode === void 0 ? void 0 : switchContainerMode('edit');
}
}, [containerMode, initialContainerMode, switchContainerMode]);
const hasToolbar = React.Children.toArray(children).some(child => {
return (child === null || child === void 0 ? void 0 : child['type']) === Toolbar;
});
return React.createElement(FieldBoundaryProvider, {
showErrors: validateInitially,
onPathError: onPathError
}, React.createElement(SectionContainer, _extends({
mode: "edit",
ariaLabel: ariaLabel,
omitFocusManagementRef: omitFocusManagementRef,
className: classnames('dnb-forms-section-edit-block', className)
}, restProps), React.createElement(Flex.Stack, null, title && React.createElement(Lead, {
size: "basis"
}, title), children, hasToolbar ? null : React.createElement(Toolbar, {
onDone: onDone,
onCancel: onCancel
}, _DoneButton || (_DoneButton = React.createElement(DoneButton, null)), _CancelButton || (_CancelButton = React.createElement(CancelButton, null))))));
}
EditContainer.DoneButton = DoneButton;
EditContainer.CancelButton = CancelButton;
EditContainer._supportsSpacingProps = true;
export default EditContainer;
//# sourceMappingURL=EditContainer.js.map