blue-react 10.0.0-rc1 → 10.0.0-rc3
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/README.md +50 -0
- package/dist/components/A.js +8 -23
- package/dist/components/ActionMenu.js +35 -67
- package/dist/components/ActionMenuItem.js +15 -37
- package/dist/components/Body.js +13 -27
- package/dist/components/Caret.js +6 -9
- package/dist/components/Chevron.js +14 -24
- package/dist/components/HashRouter.js +23 -66
- package/dist/components/Header.js +12 -15
- package/dist/components/HeaderTitle.js +37 -45
- package/dist/components/IconMenuItem.js +17 -33
- package/dist/components/Intro.js +12 -22
- package/dist/components/Layout.js +47 -42
- package/dist/components/MenuItem.js +41 -83
- package/dist/components/Modal.js +53 -86
- package/dist/components/ModalProvider.js +70 -125
- package/dist/components/Outside.js +13 -29
- package/dist/components/Page.js +18 -44
- package/dist/components/Search.js +47 -85
- package/dist/components/SidebarMenu.js +8 -22
- package/dist/components/SidebarMenuItem.js +34 -65
- package/dist/components/SidebarToggler.js +12 -22
- package/dist/components/SlimContainer.js +6 -16
- package/dist/components/Status.js +33 -44
- package/dist/components/StatusProvider.js +28 -65
- package/dist/components/Switch.js +17 -23
- package/dist/components/ToastProvider.js +43 -83
- package/dist/components/Utilities.js +23 -45
- package/dist/components/shared.js +1 -11
- package/dist/style.scss +1 -1
- package/dist/types/components/A.d.ts +9 -9
- package/dist/types/components/ActionMenu.d.ts +25 -25
- package/dist/types/components/ActionMenuItem.d.ts +36 -35
- package/dist/types/components/Body.d.ts +20 -21
- package/dist/types/components/Caret.d.ts +18 -18
- package/dist/types/components/Chevron.d.ts +17 -17
- package/dist/types/components/HashRouter.d.ts +76 -77
- package/dist/types/components/Header.d.ts +9 -8
- package/dist/types/components/HeaderTitle.d.ts +40 -40
- package/dist/types/components/IconMenuItem.d.ts +18 -19
- package/dist/types/components/Intro.d.ts +22 -23
- package/dist/types/components/Layout.d.ts +9 -16
- package/dist/types/components/MenuItem.d.ts +149 -149
- package/dist/types/components/Modal.d.ts +30 -30
- package/dist/types/components/ModalProvider.d.ts +21 -21
- package/dist/types/components/Outside.d.ts +17 -17
- package/dist/types/components/Page.d.ts +11 -12
- package/dist/types/components/Search.d.ts +36 -36
- package/dist/types/components/SidebarMenu.d.ts +31 -32
- package/dist/types/components/SidebarMenuItem.d.ts +21 -22
- package/dist/types/components/SidebarToggler.d.ts +10 -10
- package/dist/types/components/SlimContainer.d.ts +10 -10
- package/dist/types/components/Status.d.ts +12 -12
- package/dist/types/components/StatusProvider.d.ts +15 -15
- package/dist/types/components/Switch.d.ts +33 -33
- package/dist/types/components/ToastProvider.d.ts +22 -22
- package/dist/types/components/Utilities.d.ts +41 -41
- package/dist/types/components/shared.d.ts +15 -15
- package/index.d.ts +8 -12
- package/index.js +56 -30
- package/package.json +27 -43
- package/dist/components/ActionMenuSwitch.js +0 -44
- package/dist/components/LegacyLayout.js +0 -367
- package/dist/components/LegacySidebarMenu.js +0 -74
- package/dist/style.css +0 -11944
- package/dist/style.min.css +0 -16
- package/dist/types/components/ActionMenuSwitch.d.ts +0 -12
- package/dist/types/components/LegacyLayout.d.ts +0 -145
- package/dist/types/components/LegacySidebarMenu.d.ts +0 -33
package/dist/components/Modal.js
CHANGED
|
@@ -1,147 +1,114 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.default = Modal;
|
|
9
|
-
|
|
10
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
|
-
var _bootstrap = require("bootstrap");
|
|
13
|
-
|
|
14
|
-
var _shared = require("./shared");
|
|
15
|
-
|
|
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
|
-
|
|
18
|
-
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; }
|
|
19
|
-
|
|
20
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
21
|
-
|
|
1
|
+
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
22
2
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
23
|
-
|
|
24
|
-
function
|
|
25
|
-
|
|
26
|
-
function
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
31
|
-
|
|
3
|
+
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
4
|
+
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
5
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
+
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
7
|
+
import React, { useEffect, useState, useRef } from "react";
|
|
8
|
+
import { Modal as BootstrapModal } from "bootstrap";
|
|
9
|
+
import { getPhrase } from "./shared";
|
|
32
10
|
/**
|
|
33
11
|
* Simple modal/dialog. Designed to work as an alternative to JavaScript's native `alert()`, `prompt()` and `confirm()` functions.
|
|
34
12
|
* It uses Bootstrap's Modal components.
|
|
35
13
|
*
|
|
36
14
|
* For easy use, you should use the hook `useModal` together with `ModalProvider`. See the example there.
|
|
37
15
|
*/
|
|
38
|
-
function Modal(_ref) {
|
|
16
|
+
export default function Modal(_ref) {
|
|
39
17
|
var modalContent = _ref.modalContent,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
var modalRef =
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
setInput = _useState2[1];
|
|
58
|
-
|
|
18
|
+
modalTitle = _ref.modalTitle,
|
|
19
|
+
modalIcon = _ref.modalIcon,
|
|
20
|
+
unSetModalContent = _ref.unSetModalContent,
|
|
21
|
+
onSubmit = _ref.onSubmit,
|
|
22
|
+
defaultInput = _ref.defaultInput,
|
|
23
|
+
type = _ref.type,
|
|
24
|
+
_ref$inputType = _ref.inputType,
|
|
25
|
+
inputType = _ref$inputType === void 0 ? "text" : _ref$inputType,
|
|
26
|
+
_ref$switchPrimaryBtn = _ref.switchPrimaryBtn,
|
|
27
|
+
switchPrimaryBtn = _ref$switchPrimaryBtn === void 0 ? false : _ref$switchPrimaryBtn,
|
|
28
|
+
acceptBtnText = _ref.acceptBtnText,
|
|
29
|
+
cancelBtnText = _ref.cancelBtnText;
|
|
30
|
+
var modalRef = useRef(null);
|
|
31
|
+
var _useState = useState(defaultInput || ""),
|
|
32
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
33
|
+
input = _useState2[0],
|
|
34
|
+
setInput = _useState2[1];
|
|
59
35
|
var cancel = function cancel() {
|
|
60
36
|
unSetModalContent();
|
|
61
|
-
|
|
62
37
|
if (onSubmit) {
|
|
63
38
|
onSubmit(null);
|
|
64
39
|
}
|
|
65
40
|
};
|
|
66
|
-
|
|
67
41
|
var sayNo = function sayNo() {
|
|
68
42
|
unSetModalContent();
|
|
69
|
-
|
|
70
43
|
if (onSubmit) {
|
|
71
44
|
onSubmit(false);
|
|
72
45
|
}
|
|
73
46
|
};
|
|
74
|
-
|
|
75
47
|
var submit = function submit(e) {
|
|
76
48
|
e.preventDefault();
|
|
77
|
-
|
|
78
49
|
if (onSubmit) {
|
|
79
50
|
onSubmit(input || true);
|
|
80
51
|
}
|
|
81
52
|
};
|
|
82
|
-
|
|
83
53
|
var btnStyle = {
|
|
84
54
|
maxWidth: "10rem"
|
|
85
55
|
};
|
|
86
|
-
|
|
87
|
-
var focusFirstControl = function focusFirstControl() {
|
|
56
|
+
var _focusFirstControl = function focusFirstControl() {
|
|
88
57
|
var myModal = modalRef.current;
|
|
89
|
-
myModal.removeEventListener("shown.bs.modal",
|
|
58
|
+
myModal.removeEventListener("shown.bs.modal", _focusFirstControl);
|
|
90
59
|
var firstControl = myModal.querySelector(".btn-primary, .form-control");
|
|
91
|
-
|
|
92
60
|
if (firstControl) {
|
|
93
61
|
firstControl.focus();
|
|
94
62
|
}
|
|
95
63
|
};
|
|
96
|
-
|
|
97
|
-
(0, _react.useEffect)(function () {
|
|
64
|
+
useEffect(function () {
|
|
98
65
|
setInput(defaultInput || "");
|
|
99
66
|
}, [defaultInput]);
|
|
100
|
-
|
|
67
|
+
useEffect(function () {
|
|
101
68
|
var myModal = modalRef.current;
|
|
102
|
-
|
|
103
|
-
var bsModal = _bootstrap.Modal.getInstance(myModal);
|
|
104
|
-
|
|
69
|
+
var bsModal = BootstrapModal.getInstance(myModal);
|
|
105
70
|
if (!bsModal) {
|
|
106
|
-
bsModal = new
|
|
107
|
-
bsModal.hide();
|
|
71
|
+
bsModal = new BootstrapModal(myModal);
|
|
72
|
+
bsModal.hide();
|
|
108
73
|
|
|
74
|
+
// When the user clicks on underlay to close the modal
|
|
109
75
|
myModal.addEventListener("hidden.bs.modal", function () {
|
|
110
76
|
cancel();
|
|
111
77
|
});
|
|
112
78
|
} else {
|
|
113
|
-
modalContent !== undefined ? bsModal.show() : bsModal.hide();
|
|
114
|
-
// For accessibility: This way you can control the modal actions with a keyboard.
|
|
79
|
+
modalContent !== undefined ? bsModal.show() : bsModal.hide();
|
|
115
80
|
|
|
116
|
-
|
|
81
|
+
// Will focus first button or text field inside of modal when it is shown.
|
|
82
|
+
// For accessibility: This way you can control the modal actions with a keyboard.
|
|
83
|
+
myModal.addEventListener("shown.bs.modal", _focusFirstControl);
|
|
117
84
|
}
|
|
118
85
|
}, [modalContent]);
|
|
119
|
-
return /*#__PURE__*/
|
|
86
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
120
87
|
className: "modal",
|
|
121
88
|
ref: modalRef,
|
|
122
89
|
tabIndex: -1
|
|
123
|
-
}, /*#__PURE__*/
|
|
90
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
124
91
|
className: "modal-dialog"
|
|
125
|
-
}, /*#__PURE__*/
|
|
92
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
126
93
|
className: "modal-content"
|
|
127
|
-
}, /*#__PURE__*/
|
|
94
|
+
}, /*#__PURE__*/React.createElement("form", {
|
|
128
95
|
onSubmit: submit
|
|
129
|
-
}, /*#__PURE__*/
|
|
96
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
130
97
|
className: "modal-header align-items-center"
|
|
131
|
-
}, modalIcon !== undefined && /*#__PURE__*/
|
|
98
|
+
}, modalIcon !== undefined && /*#__PURE__*/React.createElement("div", {
|
|
132
99
|
className: "me-2"
|
|
133
|
-
}, modalIcon), /*#__PURE__*/
|
|
100
|
+
}, modalIcon), /*#__PURE__*/React.createElement("h5", {
|
|
134
101
|
className: "modal-title"
|
|
135
|
-
}, modalTitle ||
|
|
102
|
+
}, modalTitle || getPhrase("Message")), /*#__PURE__*/React.createElement("button", {
|
|
136
103
|
type: "button",
|
|
137
104
|
className: "btn-close",
|
|
138
105
|
onClick: cancel
|
|
139
|
-
})), /*#__PURE__*/
|
|
106
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
140
107
|
className: "modal-body",
|
|
141
108
|
style: {
|
|
142
109
|
whiteSpace: "pre-wrap"
|
|
143
110
|
}
|
|
144
|
-
}, modalContent, type === "ask" && /*#__PURE__*/
|
|
111
|
+
}, modalContent, type === "ask" && /*#__PURE__*/React.createElement("input", {
|
|
145
112
|
type: inputType,
|
|
146
113
|
className: "form-control mt-1",
|
|
147
114
|
value: input,
|
|
@@ -150,21 +117,21 @@ function Modal(_ref) {
|
|
|
150
117
|
return setInput(target.value);
|
|
151
118
|
},
|
|
152
119
|
autoFocus: true
|
|
153
|
-
})), /*#__PURE__*/
|
|
120
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
154
121
|
className: "modal-footer"
|
|
155
|
-
}, /*#__PURE__*/
|
|
122
|
+
}, /*#__PURE__*/React.createElement("button", {
|
|
156
123
|
type: "submit",
|
|
157
124
|
className: "btn ".concat(switchPrimaryBtn ? "btn-outline-primary" : "btn-primary", " d-block w-100"),
|
|
158
125
|
style: btnStyle
|
|
159
|
-
}, type === "verify" ? acceptBtnText ? acceptBtnText :
|
|
126
|
+
}, type === "verify" ? acceptBtnText ? acceptBtnText : getPhrase("Yes") : acceptBtnText ? acceptBtnText : "OK"), (type === "ask" || type === "verify") && (type === "verify" ? /*#__PURE__*/React.createElement("button", {
|
|
160
127
|
type: "button",
|
|
161
128
|
className: "btn ".concat(switchPrimaryBtn ? "btn-primary" : "btn-outline-primary", " d-block w-100"),
|
|
162
129
|
style: btnStyle,
|
|
163
130
|
onClick: sayNo
|
|
164
|
-
}, cancelBtnText ? cancelBtnText :
|
|
131
|
+
}, cancelBtnText ? cancelBtnText : getPhrase("No")) : /*#__PURE__*/React.createElement("button", {
|
|
165
132
|
type: "button",
|
|
166
133
|
className: "btn btn-outline-primary d-block w-100",
|
|
167
134
|
style: btnStyle,
|
|
168
135
|
onClick: cancel
|
|
169
|
-
}, cancelBtnText ? cancelBtnText :
|
|
136
|
+
}, cancelBtnText ? cancelBtnText : getPhrase("Cancel"))))))));
|
|
170
137
|
}
|
|
@@ -1,118 +1,77 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.useModal = exports.ModalProvider = void 0;
|
|
9
|
-
|
|
10
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
|
-
var _Modal = _interopRequireDefault(require("./Modal"));
|
|
13
|
-
|
|
14
1
|
var _excluded = ["children"];
|
|
15
|
-
|
|
16
|
-
function
|
|
17
|
-
|
|
18
|
-
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); }
|
|
19
|
-
|
|
20
|
-
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; }
|
|
21
|
-
|
|
22
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
23
|
-
|
|
24
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
25
|
-
|
|
2
|
+
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
3
|
+
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
26
4
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
27
|
-
|
|
28
|
-
function
|
|
29
|
-
|
|
30
|
-
function
|
|
31
|
-
|
|
32
|
-
function
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
37
|
-
|
|
38
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
39
|
-
|
|
40
|
-
var ModalContext = /*#__PURE__*/(0, _react.createContext)({
|
|
5
|
+
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
6
|
+
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
7
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
8
|
+
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
9
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
10
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
|
|
11
|
+
import React, { createContext, useCallback, useContext, useState } from "react";
|
|
12
|
+
import Modal from "./Modal";
|
|
13
|
+
var ModalContext = /*#__PURE__*/createContext({
|
|
41
14
|
ask: undefined,
|
|
42
15
|
tell: undefined,
|
|
43
16
|
verify: undefined
|
|
44
17
|
});
|
|
45
|
-
|
|
46
18
|
var ModalProvider = function ModalProvider(_ref) {
|
|
47
19
|
var children = _ref.children,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
var
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
var
|
|
86
|
-
_useState16 = _slicedToArray(_useState15, 2),
|
|
87
|
-
acceptBtnText = _useState16[0],
|
|
88
|
-
setAcceptBtnText = _useState16[1];
|
|
89
|
-
|
|
90
|
-
var _useState17 = (0, _react.useState)(),
|
|
91
|
-
_useState18 = _slicedToArray(_useState17, 2),
|
|
92
|
-
cancelBtnText = _useState18[0],
|
|
93
|
-
setCancelBtnText = _useState18[1];
|
|
94
|
-
|
|
95
|
-
var unSetModalContent = (0, _react.useCallback)(function () {
|
|
20
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
21
|
+
var _useState = useState("tell"),
|
|
22
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
23
|
+
type = _useState2[0],
|
|
24
|
+
setType = _useState2[1];
|
|
25
|
+
var _useState3 = useState(),
|
|
26
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
27
|
+
modalContent = _useState4[0],
|
|
28
|
+
setModalContent = _useState4[1];
|
|
29
|
+
var _useState5 = useState(),
|
|
30
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
31
|
+
modalTitle = _useState6[0],
|
|
32
|
+
setModalTitle = _useState6[1];
|
|
33
|
+
var _useState7 = useState(),
|
|
34
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
35
|
+
modalIcon = _useState8[0],
|
|
36
|
+
setModalIcon = _useState8[1];
|
|
37
|
+
var _useState9 = useState(),
|
|
38
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
39
|
+
defaultInput = _useState10[0],
|
|
40
|
+
setDefaultInput = _useState10[1];
|
|
41
|
+
var _useState11 = useState(),
|
|
42
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
43
|
+
inputType = _useState12[0],
|
|
44
|
+
setInputType = _useState12[1];
|
|
45
|
+
var _useState13 = useState(false),
|
|
46
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
47
|
+
switchPrimaryBtn = _useState14[0],
|
|
48
|
+
setSwitchPrimaryBtn = _useState14[1];
|
|
49
|
+
var _useState15 = useState(),
|
|
50
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
51
|
+
acceptBtnText = _useState16[0],
|
|
52
|
+
setAcceptBtnText = _useState16[1];
|
|
53
|
+
var _useState17 = useState(),
|
|
54
|
+
_useState18 = _slicedToArray(_useState17, 2),
|
|
55
|
+
cancelBtnText = _useState18[0],
|
|
56
|
+
setCancelBtnText = _useState18[1];
|
|
57
|
+
var unSetModalContent = useCallback(function () {
|
|
96
58
|
setModalContent(undefined);
|
|
97
59
|
}, [setModalContent]);
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
setOnSubmit = _useState20[1];
|
|
103
|
-
|
|
60
|
+
var _useState19 = useState(),
|
|
61
|
+
_useState20 = _slicedToArray(_useState19, 2),
|
|
62
|
+
onSubmit = _useState20[0],
|
|
63
|
+
setOnSubmit = _useState20[1];
|
|
104
64
|
var ask = function ask(text, options) {
|
|
105
65
|
return new Promise(function (resolve) {
|
|
106
66
|
setType("ask");
|
|
107
67
|
setModalContent(text);
|
|
108
|
-
|
|
109
68
|
if (options) {
|
|
110
69
|
var title = options.title,
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
70
|
+
icon = options.icon,
|
|
71
|
+
_inputType = options.inputType,
|
|
72
|
+
_switchPrimaryBtn = options.switchPrimaryBtn,
|
|
73
|
+
_acceptBtnText = options.acceptBtnText,
|
|
74
|
+
_cancelBtnText = options.cancelBtnText;
|
|
116
75
|
setModalTitle(title);
|
|
117
76
|
setModalIcon(icon);
|
|
118
77
|
setInputType(_inputType);
|
|
@@ -120,7 +79,6 @@ var ModalProvider = function ModalProvider(_ref) {
|
|
|
120
79
|
setAcceptBtnText(_acceptBtnText);
|
|
121
80
|
setCancelBtnText(_cancelBtnText);
|
|
122
81
|
}
|
|
123
|
-
|
|
124
82
|
setDefaultInput("");
|
|
125
83
|
setOnSubmit(function () {
|
|
126
84
|
return function (input) {
|
|
@@ -131,25 +89,22 @@ var ModalProvider = function ModalProvider(_ref) {
|
|
|
131
89
|
});
|
|
132
90
|
});
|
|
133
91
|
};
|
|
134
|
-
|
|
135
92
|
var tell = function tell(text, options) {
|
|
136
93
|
return new Promise(function (resolve) {
|
|
137
94
|
setType("tell");
|
|
138
95
|
setModalContent(text);
|
|
139
|
-
|
|
140
96
|
if (options) {
|
|
141
97
|
var title = options.title,
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
98
|
+
icon = options.icon,
|
|
99
|
+
_switchPrimaryBtn2 = options.switchPrimaryBtn,
|
|
100
|
+
_acceptBtnText2 = options.acceptBtnText,
|
|
101
|
+
_cancelBtnText2 = options.cancelBtnText;
|
|
146
102
|
setModalTitle(title);
|
|
147
103
|
setModalIcon(icon);
|
|
148
104
|
setSwitchPrimaryBtn(_switchPrimaryBtn2);
|
|
149
105
|
setAcceptBtnText(_acceptBtnText2);
|
|
150
106
|
setCancelBtnText(_cancelBtnText2);
|
|
151
107
|
}
|
|
152
|
-
|
|
153
108
|
setOnSubmit(function () {
|
|
154
109
|
return function (input) {
|
|
155
110
|
resolve(input ? true : false);
|
|
@@ -158,25 +113,22 @@ var ModalProvider = function ModalProvider(_ref) {
|
|
|
158
113
|
});
|
|
159
114
|
});
|
|
160
115
|
};
|
|
161
|
-
|
|
162
116
|
var verify = function verify(text, options) {
|
|
163
117
|
return new Promise(function (resolve) {
|
|
164
118
|
setType("verify");
|
|
165
119
|
setModalContent(text);
|
|
166
|
-
|
|
167
120
|
if (options) {
|
|
168
121
|
var title = options.title,
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
122
|
+
icon = options.icon,
|
|
123
|
+
_switchPrimaryBtn3 = options.switchPrimaryBtn,
|
|
124
|
+
_acceptBtnText3 = options.acceptBtnText,
|
|
125
|
+
_cancelBtnText3 = options.cancelBtnText;
|
|
173
126
|
setModalTitle(title);
|
|
174
127
|
setModalIcon(icon);
|
|
175
128
|
setSwitchPrimaryBtn(_switchPrimaryBtn3);
|
|
176
129
|
setAcceptBtnText(_acceptBtnText3);
|
|
177
130
|
setCancelBtnText(_cancelBtnText3);
|
|
178
131
|
}
|
|
179
|
-
|
|
180
132
|
setOnSubmit(function () {
|
|
181
133
|
return function (input) {
|
|
182
134
|
resolve(input ? true : false);
|
|
@@ -185,14 +137,13 @@ var ModalProvider = function ModalProvider(_ref) {
|
|
|
185
137
|
});
|
|
186
138
|
});
|
|
187
139
|
};
|
|
188
|
-
|
|
189
|
-
return /*#__PURE__*/_react.default.createElement(ModalContext.Provider, _extends({
|
|
140
|
+
return /*#__PURE__*/React.createElement(ModalContext.Provider, _extends({
|
|
190
141
|
value: {
|
|
191
142
|
ask: ask,
|
|
192
143
|
tell: tell,
|
|
193
144
|
verify: verify
|
|
194
145
|
}
|
|
195
|
-
}, rest), children, /*#__PURE__*/
|
|
146
|
+
}, rest), children, /*#__PURE__*/React.createElement(Modal, {
|
|
196
147
|
modalContent: modalContent,
|
|
197
148
|
modalTitle: modalTitle,
|
|
198
149
|
modalIcon: modalIcon,
|
|
@@ -206,17 +157,11 @@ var ModalProvider = function ModalProvider(_ref) {
|
|
|
206
157
|
cancelBtnText: cancelBtnText
|
|
207
158
|
}));
|
|
208
159
|
};
|
|
209
|
-
|
|
210
|
-
exports.ModalProvider = ModalProvider;
|
|
211
|
-
|
|
212
160
|
var useModal = function useModal() {
|
|
213
|
-
var context =
|
|
214
|
-
|
|
161
|
+
var context = useContext(ModalContext);
|
|
215
162
|
if (context === undefined) {
|
|
216
163
|
throw new Error("useModal must be used within a ModalProvider");
|
|
217
164
|
}
|
|
218
|
-
|
|
219
165
|
return context;
|
|
220
166
|
};
|
|
221
|
-
|
|
222
|
-
exports.useModal = useModal;
|
|
167
|
+
export { ModalProvider, useModal };
|
|
@@ -1,24 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports.default = Outside;
|
|
9
|
-
exports.useOutside = useOutside;
|
|
10
|
-
|
|
11
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
-
|
|
13
|
-
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); }
|
|
14
|
-
|
|
15
|
-
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; }
|
|
1
|
+
import React, { useEffect, useRef } from "react";
|
|
16
2
|
|
|
17
3
|
/**
|
|
18
4
|
* Hook that alerts clicks outside of the passed ref
|
|
19
5
|
*/
|
|
20
|
-
function useOutside(ref, callback) {
|
|
21
|
-
|
|
6
|
+
export function useOutside(ref, callback) {
|
|
7
|
+
useEffect(function () {
|
|
22
8
|
/**
|
|
23
9
|
* Alert if clicked on outside of element
|
|
24
10
|
*/
|
|
@@ -26,9 +12,8 @@ function useOutside(ref, callback) {
|
|
|
26
12
|
if (ref.current && !ref.current.contains(event.target) && callback) {
|
|
27
13
|
callback(event);
|
|
28
14
|
}
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
|
|
15
|
+
}
|
|
16
|
+
// Bind the event listener
|
|
32
17
|
document.addEventListener("mousedown", handleClickOutside);
|
|
33
18
|
return function () {
|
|
34
19
|
// Unbind the event listener on clean up
|
|
@@ -36,20 +21,19 @@ function useOutside(ref, callback) {
|
|
|
36
21
|
};
|
|
37
22
|
}, [ref]);
|
|
38
23
|
}
|
|
39
|
-
|
|
40
24
|
/**
|
|
41
25
|
* Component that fires an event if you click outside of it
|
|
42
26
|
*/
|
|
43
|
-
function Outside(_ref) {
|
|
27
|
+
export default function Outside(_ref) {
|
|
44
28
|
var children = _ref.children,
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
var ref =
|
|
29
|
+
className = _ref.className,
|
|
30
|
+
onClickOutside = _ref.onClickOutside,
|
|
31
|
+
onClick = _ref.onClick,
|
|
32
|
+
style = _ref.style,
|
|
33
|
+
wrapperRef = _ref.wrapperRef;
|
|
34
|
+
var ref = useRef(null);
|
|
51
35
|
useOutside(wrapperRef || ref, onClickOutside);
|
|
52
|
-
return /*#__PURE__*/
|
|
36
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
53
37
|
ref: wrapperRef || ref,
|
|
54
38
|
className: className,
|
|
55
39
|
style: style,
|