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

DNB Eufemia Design System UI Library

"use client";

import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
var _Fragment, _Toolbar;
import React, { useContext, useMemo } from 'react';
import classnames from 'classnames';
import { convertJsxToString } from "../../../../shared/component-helper.js";
import { Lead } from "../../../../elements/index.js";
import IterateItemContext from "../IterateItemContext.js";
import ArrayItemArea from "../Array/ArrayItemArea.js";
import Toolbar from "../Toolbar/index.js";
import { useSwitchContainerMode } from "../hooks/index.js";
import DoneButton from "./DoneButton.js";
import CancelButton, { useWasNew } from "./CancelButton.js";
import { replaceItemNo } from "../ItemNo/index.js";
export default function EditContainer(props) {
  const {
    toolbar,
    toolbarVariant,
    children,
    ...rest
  } = props;
  const {
    arrayValue
  } = useContext(IterateItemContext);
  let toolbarElement = toolbar;
  if (toolbarVariant === 'minimumOneItem' && arrayValue.length <= 1) {
    toolbarElement = _Fragment || (_Fragment = React.createElement(React.Fragment, null));
  }
  const hasToolbar = !toolbarElement && React.Children.toArray(children).some(child => {
    return (child === null || child === void 0 ? void 0 : child['type']) === Toolbar;
  });
  return React.createElement(EditContainerWithoutToolbar, _extends({
    toolbar: hasToolbar ? null : toolbarElement !== null && toolbarElement !== void 0 ? toolbarElement : toolbarVariant !== 'custom' && (_Toolbar || (_Toolbar = React.createElement(Toolbar, null, React.createElement(DoneButton, null), React.createElement(CancelButton, null)))),
    toolbarVariant: toolbarVariant
  }, rest), children);
}
export function EditContainerWithoutToolbar(props) {
  const {
    containerMode,
    isNew,
    index,
    path
  } = useContext(IterateItemContext);
  const {
    children,
    className,
    title,
    titleWhenNew,
    toolbar,
    toolbarVariant,
    ...restProps
  } = props || {};
  const wasNew = useWasNew({
    isNew,
    containerMode
  });
  const itemTitle = useMemo(() => {
    return replaceItemNo(wasNew && titleWhenNew ? titleWhenNew : title, index);
  }, [index, title, titleWhenNew, wasNew]);
  useSwitchContainerMode(path);
  return React.createElement(ArrayItemArea, _extends({
    mode: "edit",
    className: classnames('dnb-forms-section-edit-block', className),
    ariaLabel: convertJsxToString(itemTitle),
    toolbarVariant: toolbarVariant
  }, restProps), itemTitle && React.createElement(Lead, {
    size: "basis"
  }, itemTitle), children, toolbar);
}
EditContainer.DoneButton = DoneButton;
EditContainer.CancelButton = CancelButton;
EditContainer._supportsSpacingProps = true;
EditContainerWithoutToolbar._supportsSpacingProps = true;
//# sourceMappingURL=EditContainer.js.map