@activecollab/components
Version:
ActiveCollab Components
47 lines • 2.47 kB
JavaScript
import React, { useCallback } from "react";
import { StepActionButton } from "./StepActionButton";
import { StyledStepTitle, StyledStepHeaderLeft, StyledStepHeader, StyledCustomStep } from "./Styles";
import { Dialog } from "../Dialog";
import { IconButton } from "../IconButton";
import { ArrowBackMobileIcon, CancelCrossIcon } from "../Icons";
import { Caption2, Header3 } from "../Typography";
export const Step = _ref => {
let {
index,
isLast,
subtitle,
title,
onNextButtonClick,
onPreviousButtonClick,
onClose,
children,
actionLabel = "Proceed",
shouldRenderNextButton = true,
changingStepInProgress = false,
disableBackButton = false,
customRightHeader,
skip = false
} = _ref;
const onActionButtonClick = useCallback(() => {
if (isLast && onClose) {
return onClose();
}
return onNextButtonClick && onNextButtonClick();
}, [isLast, onClose, onNextButtonClick]);
return !skip ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledStepHeader, null, /*#__PURE__*/React.createElement(StyledStepHeaderLeft, null, !disableBackButton && index && index > 0 ? /*#__PURE__*/React.createElement(IconButton, {
onClick: onPreviousButtonClick,
variant: "text gray",
className: "tw--ml-3 tw-mr-2",
disabled: changingStepInProgress
}, /*#__PURE__*/React.createElement(ArrowBackMobileIcon, null)) : null, /*#__PURE__*/React.createElement(StyledStepTitle, null, /*#__PURE__*/React.createElement(Caption2, null, title), /*#__PURE__*/React.createElement(Header3, null, subtitle))), customRightHeader ? customRightHeader : /*#__PURE__*/React.createElement(IconButton, {
onClick: onClose,
variant: "text gray",
disabled: changingStepInProgress
}, /*#__PURE__*/React.createElement(CancelCrossIcon, null))), /*#__PURE__*/React.createElement(Dialog.ContentDivider, null), shouldRenderNextButton ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Dialog.Content, null, children), /*#__PURE__*/React.createElement(Dialog.ContentDivider, null), /*#__PURE__*/React.createElement(Dialog.Actions, null, /*#__PURE__*/React.createElement(StepActionButton, {
isLast: isLast,
actionLabel: actionLabel,
onNextButtonClick: onActionButtonClick
}))) : /*#__PURE__*/React.createElement(StyledCustomStep, null, children)) : null;
};
Step.displayName = "Step";
//# sourceMappingURL=Step.js.map