@atlaskit/editor-plugin-floating-toolbar
Version:
Floating toolbar plugin for @atlaskit/editor-core
88 lines • 4.01 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
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 var CheckboxModal = function CheckboxModal(props) {
var _options$getChildrenI;
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
isChecked = _useState2[0],
setCheckbox = _useState2[1];
var onConfirm = props.onConfirm,
onClose = props.onClose,
options = props.options,
formatMessage = props.intl.formatMessage,
testId = props.testId;
var heading = (options === null || options === void 0 ? void 0 : options.title) || formatMessage(messages.confirmModalDefaultHeading);
var okButtonLabel = (options === null || options === void 0 ? void 0 : options.okButtonLabel) || formatMessage(messages.confirmModalOK);
var cancelButtonLabel = (options === null || options === void 0 ? void 0 : options.cancelButtonLabel) || formatMessage(messages.confirmModalCancel);
var checkboxlabel = options === null || options === void 0 ? void 0 : options.checkboxLabel;
var childrenInfo = options === null || options === void 0 || (_options$getChildrenI = options.getChildrenInfo) === null || _options$getChildrenI === void 0 ? void 0 : _options$getChildrenI.call(options);
var ListComponent = function ListComponent(_ref) {
var nodes = _ref.nodes;
if (nodes.length === 0) {
return null;
}
return /*#__PURE__*/React.createElement("ul", null, nodes.map(function (node) {
return (
/*#__PURE__*/
// Ignored via go/ees005
// eslint-disable-next-line react/jsx-props-no-spreading
React.createElement(ListItem, _extends({}, node, {
key: node.id
}))
);
}));
};
var ListItem = function ListItem(props) {
var id = props.id,
name = props.name,
amount = props.amount;
return /*#__PURE__*/React.createElement("li", {
id: id
}, formatMessage(messages.confirmModalListUnit, {
name: name,
amount: 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: function onChange() {
return setCheckbox(!isChecked);
},
label: checkboxlabel,
testId: testId ? "".concat(testId, "-checkbox") : undefined
}))), /*#__PURE__*/React.createElement(ModalFooter, null, /*#__PURE__*/React.createElement(Button, {
appearance: "default",
onClick: onClose,
testId: testId ? "".concat(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: function onClick() {
onConfirm(isChecked);
onClose();
},
testId: testId ? "".concat(testId, "-confirm-button") : undefined
}, okButtonLabel)));
};