flipper-ui 0.26.22 → 0.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/core/AutoComplete.d.ts +1 -1
- package/core/ChipField.d.ts +1 -1
- package/core/DataTable/DataTable.d.ts +2 -2
- package/core/DataTable/DataTableAction.d.ts +1 -1
- package/core/DataTable/DataTableQueryPaginated.d.ts +2 -2
- package/core/DataTable/Rows.d.ts +2 -2
- package/core/DataTable/Rows.js +1 -1
- package/core/DataTable/types.d.ts +16 -16
- package/core/DataTable/useRowsState.d.ts +1 -1
- package/core/DateTime.d.ts +1 -1
- package/core/EditableTable.d.ts +1 -1
- package/core/Experimental/Button/Button.d.ts +9 -0
- package/core/Experimental/Button/Button.js +28 -0
- package/core/Experimental/Button/button.spec.d.ts +1 -0
- package/core/Experimental/Button/button.spec.js +32 -0
- package/core/Experimental/Button/button.stories.d.ts +6 -0
- package/core/Experimental/Button/button.stories.js +21 -0
- package/core/Experimental/Button/index.d.ts +1 -0
- package/core/Experimental/Button/index.js +13 -0
- package/core/Experimental/Card/Card.d.ts +29 -0
- package/core/Experimental/Card/Card.js +67 -0
- package/core/Experimental/Card/card.stories.d.ts +6 -0
- package/core/Experimental/Card/card.stories.js +22 -0
- package/core/Experimental/Card/index.d.ts +1 -0
- package/core/Experimental/Card/index.js +13 -0
- package/core/Experimental/Dialog/ConfirmDialog.d.ts +14 -0
- package/core/Experimental/Dialog/ConfirmDialog.js +35 -0
- package/core/Experimental/Dialog/Dialog.d.ts +21 -0
- package/core/Experimental/Dialog/Dialog.js +75 -0
- package/core/Experimental/Dialog/Dialog.stories.d.ts +12 -0
- package/core/Experimental/Dialog/Dialog.stories.js +84 -0
- package/core/Experimental/Dialog/RemoveDialog.d.ts +14 -0
- package/core/Experimental/Dialog/RemoveDialog.js +38 -0
- package/core/Experimental/Dialog/__test__/confirm-dialog.spec.d.ts +1 -0
- package/core/Experimental/Dialog/__test__/confirm-dialog.spec.js +132 -0
- package/core/Experimental/Dialog/__test__/dialog.spec.d.ts +1 -0
- package/core/Experimental/Dialog/__test__/dialog.spec.js +63 -0
- package/core/Experimental/Dialog/__test__/remove-dialog.spec.d.ts +1 -0
- package/core/Experimental/Dialog/__test__/remove-dialog.spec.js +131 -0
- package/core/Experimental/Dialog/index.d.ts +3 -0
- package/core/Experimental/Dialog/index.js +27 -0
- package/core/Experimental/Fab/Fab.d.ts +14 -0
- package/core/Experimental/Fab/Fab.js +48 -0
- package/core/Experimental/Fab/Fab.stories.d.ts +9 -0
- package/core/Experimental/Fab/Fab.stories.js +29 -0
- package/core/Experimental/Fab/FabWrapper.d.ts +10 -0
- package/core/Experimental/Fab/FabWrapper.js +32 -0
- package/core/Experimental/Fab/fab.spec.d.ts +1 -0
- package/core/Experimental/Fab/fab.spec.js +51 -0
- package/core/Experimental/Fab/index.d.ts +2 -0
- package/core/Experimental/Fab/index.js +20 -0
- package/core/Experimental/Sidebar/Sidebar.stories.d.ts +7 -0
- package/core/Experimental/Sidebar/Sidebar.stories.js +51 -0
- package/core/Experimental/Sidebar/SidebarV2.d.ts +19 -0
- package/core/Experimental/Sidebar/SidebarV2.js +143 -0
- package/core/Experimental/Sidebar/index.d.ts +1 -0
- package/core/Experimental/Sidebar/index.js +13 -0
- package/core/Experimental/Sidebar/sidebar.spec.d.ts +1 -0
- package/core/Experimental/Sidebar/sidebar.spec.js +129 -0
- package/core/Experimental/index.d.ts +5 -0
- package/core/Experimental/index.js +41 -0
- package/core/ListItem.js +1 -0
- package/core/Sidebar.js +1 -0
- package/core/Slider.d.ts +1 -1
- package/core/StepCard/StepCardDetails.js +2 -2
- package/core/StepCard/index.d.ts +9 -2
- package/core/Stepper.d.ts +1 -1
- package/core/TextField.d.ts +1 -1
- package/core/types.d.ts +1 -1
- package/index.d.ts +1 -0
- package/index.js +7 -1
- package/package.json +8 -10
- package/stories/Sidebar.stories.js +5 -0
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export declare const Dialog: () => JSX.Element;
|
|
2
|
+
export declare const RemoveDialog: () => JSX.Element;
|
|
3
|
+
export declare const ConfirmDialog: () => JSX.Element;
|
|
4
|
+
declare const _default: {
|
|
5
|
+
title: string;
|
|
6
|
+
component: (props: import("./Dialog").IProps) => JSX.Element;
|
|
7
|
+
subcomponents: {
|
|
8
|
+
ConfirmDialog: () => JSX.Element;
|
|
9
|
+
RemoveDialog: () => JSX.Element;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
export default _default;
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports["default"] = exports.RemoveDialog = exports.Dialog = exports.ConfirmDialog = void 0;
|
|
8
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
9
|
+
var _react = _interopRequireDefault(require("react"));
|
|
10
|
+
var _Dialog = _interopRequireDefault(require("./Dialog"));
|
|
11
|
+
var _ConfirmDialog = _interopRequireDefault(require("./ConfirmDialog"));
|
|
12
|
+
var _RemoveDialog = _interopRequireDefault(require("./RemoveDialog"));
|
|
13
|
+
var Dialog = function Dialog() {
|
|
14
|
+
var _React$useState = _react["default"].useState(false),
|
|
15
|
+
_React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
|
|
16
|
+
open = _React$useState2[0],
|
|
17
|
+
setOpen = _React$useState2[1];
|
|
18
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("button", {
|
|
19
|
+
onClick: function onClick() {
|
|
20
|
+
return setOpen(true);
|
|
21
|
+
}
|
|
22
|
+
}, "open dialog"), /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
|
|
23
|
+
open: open,
|
|
24
|
+
title: "dialog title",
|
|
25
|
+
primaryButtonText: "Close",
|
|
26
|
+
primaryButtonAction: function primaryButtonAction() {
|
|
27
|
+
return setOpen(!open);
|
|
28
|
+
},
|
|
29
|
+
text: 'A content here!'
|
|
30
|
+
}));
|
|
31
|
+
};
|
|
32
|
+
exports.Dialog = Dialog;
|
|
33
|
+
var RemoveDialog = function RemoveDialog() {
|
|
34
|
+
var _React$useState3 = _react["default"].useState(false),
|
|
35
|
+
_React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
|
|
36
|
+
open = _React$useState4[0],
|
|
37
|
+
setOpen = _React$useState4[1];
|
|
38
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("button", {
|
|
39
|
+
onClick: function onClick() {
|
|
40
|
+
return setOpen(true);
|
|
41
|
+
}
|
|
42
|
+
}, "open dialog"), /*#__PURE__*/_react["default"].createElement(_RemoveDialog["default"], {
|
|
43
|
+
open: open,
|
|
44
|
+
text: "COD123",
|
|
45
|
+
onCancel: function onCancel() {
|
|
46
|
+
return setOpen(false);
|
|
47
|
+
},
|
|
48
|
+
onConfirm: function onConfirm() {
|
|
49
|
+
return setOpen(false);
|
|
50
|
+
}
|
|
51
|
+
}));
|
|
52
|
+
};
|
|
53
|
+
exports.RemoveDialog = RemoveDialog;
|
|
54
|
+
var ConfirmDialog = function ConfirmDialog() {
|
|
55
|
+
var _React$useState5 = _react["default"].useState(false),
|
|
56
|
+
_React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
|
|
57
|
+
open = _React$useState6[0],
|
|
58
|
+
setOpen = _React$useState6[1];
|
|
59
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("button", {
|
|
60
|
+
onClick: function onClick() {
|
|
61
|
+
return setOpen(true);
|
|
62
|
+
}
|
|
63
|
+
}, "open dialog"), /*#__PURE__*/_react["default"].createElement(_ConfirmDialog["default"], {
|
|
64
|
+
open: open,
|
|
65
|
+
title: "dialog title",
|
|
66
|
+
text: "A content here!",
|
|
67
|
+
onCancel: function onCancel() {
|
|
68
|
+
return setOpen(false);
|
|
69
|
+
},
|
|
70
|
+
onConfirm: function onConfirm() {
|
|
71
|
+
return setOpen(false);
|
|
72
|
+
}
|
|
73
|
+
}));
|
|
74
|
+
};
|
|
75
|
+
exports.ConfirmDialog = ConfirmDialog;
|
|
76
|
+
var _default = {
|
|
77
|
+
title: 'V2/Dialog',
|
|
78
|
+
component: _Dialog["default"],
|
|
79
|
+
subcomponents: {
|
|
80
|
+
ConfirmDialog: ConfirmDialog,
|
|
81
|
+
RemoveDialog: RemoveDialog
|
|
82
|
+
}
|
|
83
|
+
};
|
|
84
|
+
exports["default"] = _default;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export interface IProps {
|
|
2
|
+
open: boolean;
|
|
3
|
+
title?: string;
|
|
4
|
+
text: string;
|
|
5
|
+
disableBackdropClick?: boolean;
|
|
6
|
+
labels?: {
|
|
7
|
+
cancel?: string;
|
|
8
|
+
confirm?: string;
|
|
9
|
+
};
|
|
10
|
+
onCancel(): void;
|
|
11
|
+
onConfirm(): void;
|
|
12
|
+
}
|
|
13
|
+
declare const RemoveDialog: (props: IProps) => JSX.Element;
|
|
14
|
+
export default RemoveDialog;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports["default"] = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
|
+
var _toUpper = _interopRequireDefault(require("ramda/es/toUpper"));
|
|
11
|
+
var _react = _interopRequireDefault(require("react"));
|
|
12
|
+
var _Dialog = _interopRequireDefault(require("./Dialog"));
|
|
13
|
+
var _excluded = ["open", "onCancel", "onConfirm", "title", "text", "labels", "disableBackdropClick"];
|
|
14
|
+
var RemoveDialog = function RemoveDialog(props) {
|
|
15
|
+
var open = props.open,
|
|
16
|
+
onCancel = props.onCancel,
|
|
17
|
+
onConfirm = props.onConfirm,
|
|
18
|
+
title = props.title,
|
|
19
|
+
text = props.text,
|
|
20
|
+
labels = props.labels,
|
|
21
|
+
disableBackdropClick = props.disableBackdropClick,
|
|
22
|
+
otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
|
|
23
|
+
return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], (0, _extends2["default"])({}, otherProps, {
|
|
24
|
+
open: open,
|
|
25
|
+
title: (0, _toUpper["default"])(title || 'EXCLUIR'),
|
|
26
|
+
text: text,
|
|
27
|
+
primaryButtonAction: onConfirm,
|
|
28
|
+
primaryButtonText: (labels === null || labels === void 0 ? void 0 : labels.confirm) || 'Excluir',
|
|
29
|
+
primaryButtonName: "confirm-delete",
|
|
30
|
+
primaryButtonColor: "secondary",
|
|
31
|
+
secondaryButtonAction: onCancel,
|
|
32
|
+
secondaryButtonName: "cancel-delete",
|
|
33
|
+
secondaryButtonText: (labels === null || labels === void 0 ? void 0 : labels.cancel) || 'Cancelar',
|
|
34
|
+
onClose: disableBackdropClick ? undefined : onCancel
|
|
35
|
+
}));
|
|
36
|
+
};
|
|
37
|
+
var _default = RemoveDialog;
|
|
38
|
+
exports["default"] = _default;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
+
var React = _interopRequireWildcard(require("react"));
|
|
6
|
+
var _react2 = require("@testing-library/react");
|
|
7
|
+
var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
|
|
8
|
+
var _ConfirmDialog = _interopRequireDefault(require("../ConfirmDialog"));
|
|
9
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
10
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
11
|
+
describe('ConfirmDialog', function () {
|
|
12
|
+
var TITLE = 'dialog title';
|
|
13
|
+
var TEXT = 'Dialog text';
|
|
14
|
+
var LABELS = {
|
|
15
|
+
cancel: 'cancel',
|
|
16
|
+
confirm: 'confirm'
|
|
17
|
+
};
|
|
18
|
+
it('Should render component', function () {
|
|
19
|
+
var onCancelSpy = jest.fn();
|
|
20
|
+
var onConfirmSpy = jest.fn();
|
|
21
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_ConfirmDialog["default"], {
|
|
22
|
+
open: true,
|
|
23
|
+
title: TITLE,
|
|
24
|
+
text: TEXT,
|
|
25
|
+
labels: LABELS,
|
|
26
|
+
onCancel: onCancelSpy,
|
|
27
|
+
onConfirm: onConfirmSpy
|
|
28
|
+
}));
|
|
29
|
+
var title = _react2.screen.getByText(TITLE);
|
|
30
|
+
var text = _react2.screen.getByText(TEXT);
|
|
31
|
+
var confirmButton = _react2.screen.getByText(LABELS.confirm);
|
|
32
|
+
var cancelButton = _react2.screen.getByText(LABELS.cancel);
|
|
33
|
+
expect(title).toBeDefined();
|
|
34
|
+
expect(text).toBeDefined();
|
|
35
|
+
expect(confirmButton).toBeDefined();
|
|
36
|
+
expect(cancelButton).toBeDefined();
|
|
37
|
+
});
|
|
38
|
+
it('Should render component with default labels', function () {
|
|
39
|
+
var onCancelSpy = jest.fn();
|
|
40
|
+
var onConfirmSpy = jest.fn();
|
|
41
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_ConfirmDialog["default"], {
|
|
42
|
+
open: true,
|
|
43
|
+
title: TITLE,
|
|
44
|
+
text: TEXT,
|
|
45
|
+
onCancel: onCancelSpy,
|
|
46
|
+
onConfirm: onConfirmSpy
|
|
47
|
+
}));
|
|
48
|
+
var title = _react2.screen.getByText(TITLE);
|
|
49
|
+
var text = _react2.screen.getByText(TEXT);
|
|
50
|
+
var confirmButton = _react2.screen.getByText('Sim');
|
|
51
|
+
var cancelButton = _react2.screen.getByText('Voltar');
|
|
52
|
+
expect(title).toBeDefined();
|
|
53
|
+
expect(text).toBeDefined();
|
|
54
|
+
expect(confirmButton).toBeDefined();
|
|
55
|
+
expect(cancelButton).toBeDefined();
|
|
56
|
+
});
|
|
57
|
+
it('Should call primaryButtonAction', function () {
|
|
58
|
+
var onCancelSpy = jest.fn();
|
|
59
|
+
var onConfirmSpy = jest.fn();
|
|
60
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_ConfirmDialog["default"], {
|
|
61
|
+
open: true,
|
|
62
|
+
title: TITLE,
|
|
63
|
+
text: TEXT,
|
|
64
|
+
labels: LABELS,
|
|
65
|
+
onCancel: onCancelSpy,
|
|
66
|
+
onConfirm: onConfirmSpy
|
|
67
|
+
}));
|
|
68
|
+
var confirmButton = _react2.screen.getByText(LABELS.confirm);
|
|
69
|
+
_userEvent["default"].click(confirmButton);
|
|
70
|
+
(0, _react2.waitFor)(function () {
|
|
71
|
+
expect(onConfirmSpy).toHaveBeenCalled();
|
|
72
|
+
});
|
|
73
|
+
});
|
|
74
|
+
it('Should call secondaryButtonAction', function () {
|
|
75
|
+
var onCancelSpy = jest.fn();
|
|
76
|
+
var onConfirmSpy = jest.fn();
|
|
77
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_ConfirmDialog["default"], {
|
|
78
|
+
open: true,
|
|
79
|
+
title: TITLE,
|
|
80
|
+
text: TEXT,
|
|
81
|
+
labels: LABELS,
|
|
82
|
+
onCancel: onCancelSpy,
|
|
83
|
+
onConfirm: onConfirmSpy
|
|
84
|
+
}));
|
|
85
|
+
var cancelButton = _react2.screen.getByText(LABELS.cancel);
|
|
86
|
+
_userEvent["default"].click(cancelButton);
|
|
87
|
+
(0, _react2.waitFor)(function () {
|
|
88
|
+
expect(onCancelSpy).toHaveBeenCalled();
|
|
89
|
+
});
|
|
90
|
+
});
|
|
91
|
+
it('Should call onCancel', function () {
|
|
92
|
+
var onCancelSpy = jest.fn();
|
|
93
|
+
var onConfirmSpy = jest.fn();
|
|
94
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_ConfirmDialog["default"], {
|
|
95
|
+
open: true,
|
|
96
|
+
title: TITLE,
|
|
97
|
+
text: TEXT,
|
|
98
|
+
labels: LABELS,
|
|
99
|
+
onCancel: onCancelSpy,
|
|
100
|
+
onConfirm: onConfirmSpy
|
|
101
|
+
}));
|
|
102
|
+
var title = _react2.screen.getByText(TITLE);
|
|
103
|
+
_react2.fireEvent.keyDown(title, {
|
|
104
|
+
key: 'Escape',
|
|
105
|
+
keyCode: 27
|
|
106
|
+
});
|
|
107
|
+
(0, _react2.waitFor)(function () {
|
|
108
|
+
expect(onCancelSpy).toHaveBeenCalled();
|
|
109
|
+
});
|
|
110
|
+
});
|
|
111
|
+
it('Should not call onCancel when disableBackdropClick', function () {
|
|
112
|
+
var onCancelSpy = jest.fn();
|
|
113
|
+
var onConfirmSpy = jest.fn();
|
|
114
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_ConfirmDialog["default"], {
|
|
115
|
+
open: true,
|
|
116
|
+
disableBackdropClick: true,
|
|
117
|
+
title: TITLE,
|
|
118
|
+
text: TEXT,
|
|
119
|
+
labels: LABELS,
|
|
120
|
+
onCancel: onCancelSpy,
|
|
121
|
+
onConfirm: onConfirmSpy
|
|
122
|
+
}));
|
|
123
|
+
var title = _react2.screen.getByText(TITLE);
|
|
124
|
+
_react2.fireEvent.keyDown(title, {
|
|
125
|
+
key: 'Escape',
|
|
126
|
+
keyCode: 27
|
|
127
|
+
});
|
|
128
|
+
(0, _react2.waitFor)(function () {
|
|
129
|
+
expect(onCancelSpy).not.toHaveBeenCalled();
|
|
130
|
+
});
|
|
131
|
+
});
|
|
132
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
+
var React = _interopRequireWildcard(require("react"));
|
|
6
|
+
var _react2 = require("@testing-library/react");
|
|
7
|
+
var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
|
|
8
|
+
var _Dialog = _interopRequireDefault(require("../Dialog"));
|
|
9
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
10
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
11
|
+
describe('Dialog', function () {
|
|
12
|
+
var TITLE = 'dialog title';
|
|
13
|
+
var TEXT = 'Dialog text';
|
|
14
|
+
var PRIMARY_BUTTON_TEXT = 'Close';
|
|
15
|
+
it('Should render component', function () {
|
|
16
|
+
var onClickSpy = jest.fn();
|
|
17
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_Dialog["default"], {
|
|
18
|
+
open: true,
|
|
19
|
+
title: TITLE,
|
|
20
|
+
primaryButtonText: PRIMARY_BUTTON_TEXT,
|
|
21
|
+
primaryButtonAction: onClickSpy,
|
|
22
|
+
text: TEXT
|
|
23
|
+
}));
|
|
24
|
+
var title = _react2.screen.getByText(TITLE);
|
|
25
|
+
var text = _react2.screen.getByText(TEXT);
|
|
26
|
+
var primaryButton = _react2.screen.getByText(PRIMARY_BUTTON_TEXT);
|
|
27
|
+
expect(title).toBeDefined();
|
|
28
|
+
expect(text).toBeDefined();
|
|
29
|
+
expect(primaryButton).toBeDefined();
|
|
30
|
+
});
|
|
31
|
+
it('Should call primaryButtonAction', function () {
|
|
32
|
+
var onClickSpy = jest.fn();
|
|
33
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_Dialog["default"], {
|
|
34
|
+
open: true,
|
|
35
|
+
title: TITLE,
|
|
36
|
+
primaryButtonText: PRIMARY_BUTTON_TEXT,
|
|
37
|
+
primaryButtonAction: onClickSpy,
|
|
38
|
+
text: TEXT
|
|
39
|
+
}));
|
|
40
|
+
var primaryButton = _react2.screen.getByText(PRIMARY_BUTTON_TEXT);
|
|
41
|
+
_userEvent["default"].click(primaryButton);
|
|
42
|
+
(0, _react2.waitFor)(function () {
|
|
43
|
+
expect(onClickSpy).toHaveBeenCalled();
|
|
44
|
+
});
|
|
45
|
+
});
|
|
46
|
+
it('Should call secondaryButtonAction', function () {
|
|
47
|
+
var onClickSpy = jest.fn();
|
|
48
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_Dialog["default"], {
|
|
49
|
+
open: true,
|
|
50
|
+
title: TITLE,
|
|
51
|
+
primaryButtonText: PRIMARY_BUTTON_TEXT,
|
|
52
|
+
primaryButtonAction: onClickSpy,
|
|
53
|
+
text: TEXT,
|
|
54
|
+
secondaryButtonText: "secondary",
|
|
55
|
+
secondaryButtonAction: onClickSpy
|
|
56
|
+
}));
|
|
57
|
+
var secondaryButton = _react2.screen.getByText('secondary');
|
|
58
|
+
_userEvent["default"].click(secondaryButton);
|
|
59
|
+
(0, _react2.waitFor)(function () {
|
|
60
|
+
expect(onClickSpy).toHaveBeenCalled();
|
|
61
|
+
});
|
|
62
|
+
});
|
|
63
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
+
var React = _interopRequireWildcard(require("react"));
|
|
6
|
+
var _react2 = require("@testing-library/react");
|
|
7
|
+
var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
|
|
8
|
+
var _RemoveDialog = _interopRequireDefault(require("../RemoveDialog"));
|
|
9
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
10
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
11
|
+
describe('RemoveDialog', function () {
|
|
12
|
+
var TITLE = 'dialog title';
|
|
13
|
+
var TEXT = 'Dialog text';
|
|
14
|
+
var LABELS = {
|
|
15
|
+
cancel: 'cancel',
|
|
16
|
+
confirm: 'confirm'
|
|
17
|
+
};
|
|
18
|
+
it('Should render component', function () {
|
|
19
|
+
var onCancelSpy = jest.fn();
|
|
20
|
+
var onConfirmSpy = jest.fn();
|
|
21
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_RemoveDialog["default"], {
|
|
22
|
+
open: true,
|
|
23
|
+
title: TITLE,
|
|
24
|
+
text: TEXT,
|
|
25
|
+
labels: LABELS,
|
|
26
|
+
onCancel: onCancelSpy,
|
|
27
|
+
onConfirm: onConfirmSpy
|
|
28
|
+
}));
|
|
29
|
+
var title = _react2.screen.getByText(TITLE.toUpperCase());
|
|
30
|
+
var text = _react2.screen.getByText(TEXT);
|
|
31
|
+
var confirmButton = _react2.screen.getByText(LABELS.confirm);
|
|
32
|
+
var cancelButton = _react2.screen.getByText(LABELS.cancel);
|
|
33
|
+
expect(title).toBeDefined();
|
|
34
|
+
expect(text).toBeDefined();
|
|
35
|
+
expect(confirmButton).toBeDefined();
|
|
36
|
+
expect(cancelButton).toBeDefined();
|
|
37
|
+
});
|
|
38
|
+
it('Should render component with default labels', function () {
|
|
39
|
+
var onCancelSpy = jest.fn();
|
|
40
|
+
var onConfirmSpy = jest.fn();
|
|
41
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_RemoveDialog["default"], {
|
|
42
|
+
open: true,
|
|
43
|
+
text: TEXT,
|
|
44
|
+
onCancel: onCancelSpy,
|
|
45
|
+
onConfirm: onConfirmSpy
|
|
46
|
+
}));
|
|
47
|
+
var title = _react2.screen.getByText('EXCLUIR');
|
|
48
|
+
var text = _react2.screen.getByText(TEXT);
|
|
49
|
+
var confirmButton = _react2.screen.getByText('Excluir');
|
|
50
|
+
var cancelButton = _react2.screen.getByText('Cancelar');
|
|
51
|
+
expect(title).toBeDefined();
|
|
52
|
+
expect(text).toBeDefined();
|
|
53
|
+
expect(confirmButton).toBeDefined();
|
|
54
|
+
expect(cancelButton).toBeDefined();
|
|
55
|
+
});
|
|
56
|
+
it('Should call primaryButtonAction', function () {
|
|
57
|
+
var onCancelSpy = jest.fn();
|
|
58
|
+
var onConfirmSpy = jest.fn();
|
|
59
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_RemoveDialog["default"], {
|
|
60
|
+
open: true,
|
|
61
|
+
title: TITLE,
|
|
62
|
+
text: TEXT,
|
|
63
|
+
labels: LABELS,
|
|
64
|
+
onCancel: onCancelSpy,
|
|
65
|
+
onConfirm: onConfirmSpy
|
|
66
|
+
}));
|
|
67
|
+
var confirmButton = _react2.screen.getByText(LABELS.confirm);
|
|
68
|
+
_userEvent["default"].click(confirmButton);
|
|
69
|
+
(0, _react2.waitFor)(function () {
|
|
70
|
+
expect(onConfirmSpy).toHaveBeenCalled();
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
it('Should call secondaryButtonAction', function () {
|
|
74
|
+
var onCancelSpy = jest.fn();
|
|
75
|
+
var onConfirmSpy = jest.fn();
|
|
76
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_RemoveDialog["default"], {
|
|
77
|
+
open: true,
|
|
78
|
+
title: TITLE,
|
|
79
|
+
text: TEXT,
|
|
80
|
+
labels: LABELS,
|
|
81
|
+
onCancel: onCancelSpy,
|
|
82
|
+
onConfirm: onConfirmSpy
|
|
83
|
+
}));
|
|
84
|
+
var cancelButton = _react2.screen.getByText(LABELS.cancel);
|
|
85
|
+
_userEvent["default"].click(cancelButton);
|
|
86
|
+
(0, _react2.waitFor)(function () {
|
|
87
|
+
expect(onCancelSpy).toHaveBeenCalled();
|
|
88
|
+
});
|
|
89
|
+
});
|
|
90
|
+
it('Should call onCancel', function () {
|
|
91
|
+
var onCancelSpy = jest.fn();
|
|
92
|
+
var onConfirmSpy = jest.fn();
|
|
93
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_RemoveDialog["default"], {
|
|
94
|
+
open: true,
|
|
95
|
+
title: TITLE,
|
|
96
|
+
text: TEXT,
|
|
97
|
+
labels: LABELS,
|
|
98
|
+
onCancel: onCancelSpy,
|
|
99
|
+
onConfirm: onConfirmSpy
|
|
100
|
+
}));
|
|
101
|
+
var title = _react2.screen.getByText(TITLE.toUpperCase());
|
|
102
|
+
_react2.fireEvent.keyDown(title, {
|
|
103
|
+
key: 'Escape',
|
|
104
|
+
keyCode: 27
|
|
105
|
+
});
|
|
106
|
+
(0, _react2.waitFor)(function () {
|
|
107
|
+
expect(onCancelSpy).toHaveBeenCalled();
|
|
108
|
+
});
|
|
109
|
+
});
|
|
110
|
+
it('Should not call onCancel when disableBackdropClick', function () {
|
|
111
|
+
var onCancelSpy = jest.fn();
|
|
112
|
+
var onConfirmSpy = jest.fn();
|
|
113
|
+
(0, _react2.render)( /*#__PURE__*/React.createElement(_RemoveDialog["default"], {
|
|
114
|
+
open: true,
|
|
115
|
+
disableBackdropClick: true,
|
|
116
|
+
title: TITLE,
|
|
117
|
+
text: TEXT,
|
|
118
|
+
labels: LABELS,
|
|
119
|
+
onCancel: onCancelSpy,
|
|
120
|
+
onConfirm: onConfirmSpy
|
|
121
|
+
}));
|
|
122
|
+
var title = _react2.screen.getByText(TITLE.toUpperCase());
|
|
123
|
+
_react2.fireEvent.keyDown(title, {
|
|
124
|
+
key: 'Escape',
|
|
125
|
+
keyCode: 27
|
|
126
|
+
});
|
|
127
|
+
(0, _react2.waitFor)(function () {
|
|
128
|
+
expect(onCancelSpy).not.toHaveBeenCalled();
|
|
129
|
+
});
|
|
130
|
+
});
|
|
131
|
+
});
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
Object.defineProperty(exports, "ConfirmDialog", {
|
|
8
|
+
enumerable: true,
|
|
9
|
+
get: function get() {
|
|
10
|
+
return _ConfirmDialog["default"];
|
|
11
|
+
}
|
|
12
|
+
});
|
|
13
|
+
Object.defineProperty(exports, "RemoveDialog", {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: function get() {
|
|
16
|
+
return _RemoveDialog["default"];
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
Object.defineProperty(exports, "default", {
|
|
20
|
+
enumerable: true,
|
|
21
|
+
get: function get() {
|
|
22
|
+
return _Dialog["default"];
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
var _Dialog = _interopRequireDefault(require("./Dialog"));
|
|
26
|
+
var _RemoveDialog = _interopRequireDefault(require("./RemoveDialog"));
|
|
27
|
+
var _ConfirmDialog = _interopRequireDefault(require("./ConfirmDialog"));
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { MouseEvent, CSSProperties } from 'react';
|
|
2
|
+
export interface IProps {
|
|
3
|
+
mini?: boolean;
|
|
4
|
+
className?: string;
|
|
5
|
+
name?: string;
|
|
6
|
+
tooltip?: string;
|
|
7
|
+
padding?: string | number;
|
|
8
|
+
margin?: string | number;
|
|
9
|
+
style?: CSSProperties;
|
|
10
|
+
children: JSX.Element;
|
|
11
|
+
onClick(event: MouseEvent<HTMLButtonElement>): void;
|
|
12
|
+
}
|
|
13
|
+
declare const FabV2: (props: IProps) => JSX.Element;
|
|
14
|
+
export default FabV2;
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports["default"] = void 0;
|
|
9
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
12
|
+
var React = _interopRequireWildcard(require("react"));
|
|
13
|
+
var _Fab = _interopRequireDefault(require("../../Fab"));
|
|
14
|
+
var _Tooltip = _interopRequireDefault(require("../../Tooltip"));
|
|
15
|
+
var _excluded = ["mini", "children", "padding", "name", "margin", "style"];
|
|
16
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
18
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
19
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
20
|
+
var FabV2 = function FabV2(props) {
|
|
21
|
+
var renderButton = function renderButton() {
|
|
22
|
+
var _props$mini = props.mini,
|
|
23
|
+
mini = _props$mini === void 0 ? true : _props$mini,
|
|
24
|
+
children = props.children,
|
|
25
|
+
padding = props.padding,
|
|
26
|
+
name = props.name,
|
|
27
|
+
margin = props.margin,
|
|
28
|
+
style = props.style,
|
|
29
|
+
otherProps = (0, _objectWithoutProperties2["default"])(props, _excluded);
|
|
30
|
+
return /*#__PURE__*/React.createElement(_Fab["default"], (0, _extends2["default"])({
|
|
31
|
+
size: mini ? 'small' : 'medium',
|
|
32
|
+
name: name || 'action-button',
|
|
33
|
+
"data-testid": "fab-button"
|
|
34
|
+
}, otherProps, {
|
|
35
|
+
style: _objectSpread({
|
|
36
|
+
margin: margin,
|
|
37
|
+
padding: padding
|
|
38
|
+
}, style),
|
|
39
|
+
onClick: props.onClick
|
|
40
|
+
}), children);
|
|
41
|
+
};
|
|
42
|
+
return props.tooltip ? /*#__PURE__*/React.createElement(_Tooltip["default"], {
|
|
43
|
+
withWrapper: true,
|
|
44
|
+
title: props.tooltip
|
|
45
|
+
}, renderButton()) : renderButton();
|
|
46
|
+
};
|
|
47
|
+
var _default = FabV2;
|
|
48
|
+
exports["default"] = _default;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export declare const fab: () => JSX.Element;
|
|
2
|
+
declare const _default: {
|
|
3
|
+
title: string;
|
|
4
|
+
component: (props: import("./Fab").IProps) => JSX.Element;
|
|
5
|
+
subcomponents: {
|
|
6
|
+
FabWrapper: ({ padding, children, style, width, height }: import("./FabWrapper").IProps) => JSX.Element;
|
|
7
|
+
};
|
|
8
|
+
};
|
|
9
|
+
export default _default;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.fab = exports["default"] = void 0;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _Fab = _interopRequireDefault(require("./Fab"));
|
|
10
|
+
var _FabWrapper = _interopRequireDefault(require("./FabWrapper"));
|
|
11
|
+
var _FileCopy = _interopRequireDefault(require("@material-ui/icons/FileCopy"));
|
|
12
|
+
var fab = function fab() {
|
|
13
|
+
return /*#__PURE__*/_react["default"].createElement(_Fab["default"], {
|
|
14
|
+
name: "copy",
|
|
15
|
+
tooltip: "Copy file",
|
|
16
|
+
onClick: function onClick() {
|
|
17
|
+
return alert('fab click');
|
|
18
|
+
}
|
|
19
|
+
}, /*#__PURE__*/_react["default"].createElement(_FileCopy["default"], null));
|
|
20
|
+
};
|
|
21
|
+
exports.fab = fab;
|
|
22
|
+
var _default = {
|
|
23
|
+
title: 'V2/Fab',
|
|
24
|
+
component: _Fab["default"],
|
|
25
|
+
subcomponents: {
|
|
26
|
+
FabWrapper: _FabWrapper["default"]
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
exports["default"] = _default;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
|
+
export interface IProps {
|
|
3
|
+
padding?: number | string;
|
|
4
|
+
style?: CSSProperties;
|
|
5
|
+
width?: number | string;
|
|
6
|
+
height?: number | string;
|
|
7
|
+
children?: ReactNode;
|
|
8
|
+
}
|
|
9
|
+
declare const FabWrapper: ({ padding, children, style, width, height }: IProps) => JSX.Element;
|
|
10
|
+
export default FabWrapper;
|