@atlaskit/editor-plugin-floating-toolbar
Version:
Floating toolbar plugin for @atlaskit/editor-core
86 lines • 3.58 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import React, { useState } from 'react';
import Button from '@atlaskit/button/new';
import { Checkbox } from '@atlaskit/checkbox';
import { messages } from '@atlaskit/editor-common/floating-toolbar';
import Modal, { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '@atlaskit/modal-dialog';
import { Text } from '@atlaskit/primitives/compiled';
export const CheckboxModal = props => {
var _options$getChildrenI;
const [isChecked, setCheckbox] = useState(false);
const {
onConfirm,
onClose,
options,
intl: {
formatMessage
},
testId
} = props;
const heading = (options === null || options === void 0 ? void 0 : options.title) || formatMessage(messages.confirmModalDefaultHeading);
const okButtonLabel = (options === null || options === void 0 ? void 0 : options.okButtonLabel) || formatMessage(messages.confirmModalOK);
const cancelButtonLabel = (options === null || options === void 0 ? void 0 : options.cancelButtonLabel) || formatMessage(messages.confirmModalCancel);
const checkboxlabel = options === null || options === void 0 ? void 0 : options.checkboxLabel;
const childrenInfo = options === null || options === void 0 ? void 0 : (_options$getChildrenI = options.getChildrenInfo) === null || _options$getChildrenI === void 0 ? void 0 : _options$getChildrenI.call(options);
const ListComponent = ({
nodes
}) => {
if (nodes.length === 0) {
return null;
}
return /*#__PURE__*/React.createElement("ul", null, nodes.map(node =>
/*#__PURE__*/
// Ignored via go/ees005
// eslint-disable-next-line react/jsx-props-no-spreading
React.createElement(ListItem, _extends({}, node, {
key: node.id
}))));
};
const ListItem = props => {
const {
id,
name,
amount
} = props;
return /*#__PURE__*/React.createElement("li", {
id: id
}, formatMessage(messages.confirmModalListUnit, {
name,
amount
}));
};
return /*#__PURE__*/React.createElement(Modal, {
onClose: onClose,
testId: testId
}, /*#__PURE__*/React.createElement(ModalHeader, {
hasCloseButton: true
}, /*#__PURE__*/React.createElement(ModalTitle, {
appearance: "warning"
}, heading)), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Text, {
as: "p"
}, options === null || options === void 0 ? void 0 : options.message), !!(childrenInfo !== null && childrenInfo !== void 0 && childrenInfo.length) && /*#__PURE__*/React.createElement(ListComponent, {
nodes: childrenInfo
}), /*#__PURE__*/React.createElement(Text, {
as: "p"
}, /*#__PURE__*/React.createElement(Checkbox, {
isChecked: isChecked
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
,
onChange: () => setCheckbox(!isChecked),
label: checkboxlabel,
testId: testId ? `${testId}-checkbox` : undefined
}))), /*#__PURE__*/React.createElement(ModalFooter, null, /*#__PURE__*/React.createElement(Button, {
appearance: "default",
onClick: onClose,
testId: testId ? `${testId}-cancel-button` : undefined
}, cancelButtonLabel), /*#__PURE__*/React.createElement(Button, {
appearance: "warning"
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
,
onClick: () => {
onConfirm(isChecked);
onClose();
},
testId: testId ? `${testId}-confirm-button` : undefined
}, okButtonLabel)));
};