blue-react 10.2.0 → 11.0.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/README.md +41 -84
- package/dist/components/A.js +13 -6
- package/dist/components/ActionMenu.js +27 -22
- package/dist/components/Actions.js +30 -22
- package/dist/components/Button.d.ts +31 -0
- package/dist/components/Button.js +119 -0
- package/dist/components/Chevron.js +11 -9
- package/dist/components/HashRouter.js +9 -6
- package/dist/components/Header.js +5 -3
- package/dist/components/HeaderTitle.js +31 -26
- package/dist/components/IconMenuItem.d.ts +2 -2
- package/dist/components/IconMenuItem.js +17 -10
- package/dist/components/Intro.js +23 -17
- package/dist/components/Layout.js +79 -71
- package/dist/{types/components/MenuItem.d.ts → components/LegacyMenuItem.d.ts} +150 -149
- package/dist/components/LegacyMenuItem.js +170 -0
- package/dist/components/MenuItem.d.ts +13 -149
- package/dist/components/MenuItem.js +168 -153
- package/dist/components/Modal.js +62 -49
- package/dist/components/ModalProvider.js +43 -35
- package/dist/components/Outside.js +5 -3
- package/dist/components/Search.js +69 -60
- package/dist/components/SidebarMenu.js +9 -6
- package/dist/components/SimpleLayout.js +16 -11
- package/dist/components/SlimContainer.js +8 -5
- package/dist/components/Status.js +56 -40
- package/dist/components/StatusProvider.js +22 -14
- package/dist/components/Tab.js +28 -19
- package/dist/components/Tabs.js +8 -5
- package/dist/components/ToastProvider.js +55 -44
- package/dist/components/shared.js +4 -1
- package/index.d.ts +5 -5
- package/index.js +4 -2
- package/package.json +14 -12
- package/dist/components/ActionMenuItem.js +0 -73
- package/dist/components/ActionMenuSwitch.js +0 -44
- package/dist/components/Body.d.ts +0 -21
- package/dist/components/Body.js +0 -25
- package/dist/components/Caret.js +0 -25
- package/dist/components/Layout/LayoutHeader.d.ts +0 -4
- package/dist/components/Layout/LayoutHeader.js +0 -25
- package/dist/components/Layout/LayoutMain.d.ts +0 -5
- package/dist/components/Layout/LayoutMain.js +0 -17
- package/dist/components/Page.d.ts +0 -13
- package/dist/components/Page.js +0 -39
- package/dist/components/SidebarMenuItem.js +0 -115
- package/dist/components/SidebarToggler.d.ts +0 -11
- package/dist/components/SidebarToggler.js +0 -24
- package/dist/components/Switch.js +0 -65
- package/dist/types/components/A.d.ts +0 -9
- package/dist/types/components/ActionMenu.d.ts +0 -25
- package/dist/types/components/ActionMenuItem.d.ts +0 -35
- package/dist/types/components/ActionMenuSwitch.d.ts +0 -12
- package/dist/types/components/Body.d.ts +0 -21
- package/dist/types/components/Caret.d.ts +0 -18
- package/dist/types/components/Chevron.d.ts +0 -17
- package/dist/types/components/Header.d.ts +0 -8
- package/dist/types/components/HeaderTitle.d.ts +0 -40
- package/dist/types/components/IconMenuItem.d.ts +0 -19
- package/dist/types/components/Intro.d.ts +0 -23
- package/dist/types/components/Layout.d.ts +0 -144
- package/dist/types/components/Modal.d.ts +0 -30
- package/dist/types/components/ModalProvider.d.ts +0 -21
- package/dist/types/components/Outside.d.ts +0 -17
- package/dist/types/components/Page.d.ts +0 -12
- package/dist/types/components/Search.d.ts +0 -36
- package/dist/types/components/SidebarMenu.d.ts +0 -32
- package/dist/types/components/SidebarMenuItem.d.ts +0 -22
- package/dist/types/components/SidebarToggler.d.ts +0 -10
- package/dist/types/components/SlimContainer.d.ts +0 -10
- package/dist/types/components/Status.d.ts +0 -12
- package/dist/types/components/StatusProvider.d.ts +0 -15
- package/dist/types/components/Switch.d.ts +0 -33
- package/dist/types/components/ToastProvider.d.ts +0 -22
- package/dist/types/components/Utilities.d.ts +0 -41
- package/dist/types/components/shared.d.ts +0 -15
package/dist/components/Modal.js
CHANGED
|
@@ -7,6 +7,7 @@ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
|
7
7
|
import React, { useEffect, useState, useRef } from "react";
|
|
8
8
|
import { Modal as BootstrapModal } from "bootstrap";
|
|
9
9
|
import { getPhrase } from "./shared.js";
|
|
10
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
11
|
/**
|
|
11
12
|
* Simple modal/dialog. Designed to work as an alternative to JavaScript's native `alert()`, `prompt()` and `confirm()` functions.
|
|
12
13
|
* It uses Bootstrap's Modal components.
|
|
@@ -83,55 +84,67 @@ export default function Modal(_ref) {
|
|
|
83
84
|
myModal.addEventListener("shown.bs.modal", _focusFirstControl);
|
|
84
85
|
}
|
|
85
86
|
}, [modalContent]);
|
|
86
|
-
return /*#__PURE__*/
|
|
87
|
+
return /*#__PURE__*/_jsx("div", {
|
|
87
88
|
className: "modal",
|
|
88
89
|
ref: modalRef,
|
|
89
|
-
tabIndex: -1
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
90
|
+
tabIndex: -1,
|
|
91
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
92
|
+
className: "modal-dialog",
|
|
93
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
94
|
+
className: "modal-content",
|
|
95
|
+
children: /*#__PURE__*/_jsxs("form", {
|
|
96
|
+
onSubmit: submit,
|
|
97
|
+
children: [/*#__PURE__*/_jsxs("div", {
|
|
98
|
+
className: "modal-header align-items-center",
|
|
99
|
+
children: [modalIcon !== undefined && /*#__PURE__*/_jsx("div", {
|
|
100
|
+
className: "me-2",
|
|
101
|
+
children: modalIcon
|
|
102
|
+
}), /*#__PURE__*/_jsx("h5", {
|
|
103
|
+
className: "modal-title",
|
|
104
|
+
children: modalTitle || getPhrase("Message")
|
|
105
|
+
}), /*#__PURE__*/_jsx("button", {
|
|
106
|
+
type: "button",
|
|
107
|
+
className: "btn-close",
|
|
108
|
+
onClick: cancel
|
|
109
|
+
})]
|
|
110
|
+
}), /*#__PURE__*/_jsxs("div", {
|
|
111
|
+
className: "modal-body",
|
|
112
|
+
style: {
|
|
113
|
+
whiteSpace: "pre-wrap"
|
|
114
|
+
},
|
|
115
|
+
children: [modalContent, type === "ask" && /*#__PURE__*/_jsx("input", {
|
|
116
|
+
type: inputType,
|
|
117
|
+
className: "form-control mt-1",
|
|
118
|
+
value: input,
|
|
119
|
+
onChange: function onChange(_ref2) {
|
|
120
|
+
var target = _ref2.target;
|
|
121
|
+
return setInput(target.value);
|
|
122
|
+
},
|
|
123
|
+
autoFocus: true
|
|
124
|
+
})]
|
|
125
|
+
}), /*#__PURE__*/_jsxs("div", {
|
|
126
|
+
className: "modal-footer",
|
|
127
|
+
children: [/*#__PURE__*/_jsx("button", {
|
|
128
|
+
type: "submit",
|
|
129
|
+
className: "btn ".concat(switchPrimaryBtn ? "btn-outline-primary" : "btn-primary", " d-block w-100"),
|
|
130
|
+
style: btnStyle,
|
|
131
|
+
children: type === "verify" ? acceptBtnText ? acceptBtnText : getPhrase("Yes") : acceptBtnText ? acceptBtnText : "OK"
|
|
132
|
+
}), (type === "ask" || type === "verify") && (type === "verify" ? /*#__PURE__*/_jsx("button", {
|
|
133
|
+
type: "button",
|
|
134
|
+
className: "btn ".concat(switchPrimaryBtn ? "btn-primary" : "btn-outline-primary", " d-block w-100"),
|
|
135
|
+
style: btnStyle,
|
|
136
|
+
onClick: sayNo,
|
|
137
|
+
children: cancelBtnText ? cancelBtnText : getPhrase("No")
|
|
138
|
+
}) : /*#__PURE__*/_jsx("button", {
|
|
139
|
+
type: "button",
|
|
140
|
+
className: "btn btn-outline-primary d-block w-100",
|
|
141
|
+
style: btnStyle,
|
|
142
|
+
onClick: cancel,
|
|
143
|
+
children: cancelBtnText ? cancelBtnText : getPhrase("Cancel")
|
|
144
|
+
}))]
|
|
145
|
+
})]
|
|
146
|
+
})
|
|
147
|
+
})
|
|
148
|
+
})
|
|
149
|
+
});
|
|
137
150
|
}
|
|
@@ -1,15 +1,21 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
1
2
|
var _excluded = ["children"];
|
|
2
|
-
function
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
|
+
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
6
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
7
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
3
8
|
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
4
9
|
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."); }
|
|
5
10
|
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
11
|
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
12
|
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
13
|
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
|
|
10
|
-
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.
|
|
14
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
15
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
11
16
|
import React, { createContext, useCallback, useContext, useState } from "react";
|
|
12
17
|
import Modal from "./Modal.js";
|
|
18
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
19
|
var ModalContext = /*#__PURE__*/createContext({
|
|
14
20
|
ask: undefined,
|
|
15
21
|
tell: undefined,
|
|
@@ -35,32 +41,32 @@ var ModalProvider = function ModalProvider(_ref) {
|
|
|
35
41
|
modalIcon = _useState8[0],
|
|
36
42
|
setModalIcon = _useState8[1];
|
|
37
43
|
var _useState9 = useState(),
|
|
38
|
-
|
|
39
|
-
defaultInput =
|
|
40
|
-
setDefaultInput =
|
|
41
|
-
var
|
|
44
|
+
_useState0 = _slicedToArray(_useState9, 2),
|
|
45
|
+
defaultInput = _useState0[0],
|
|
46
|
+
setDefaultInput = _useState0[1];
|
|
47
|
+
var _useState1 = useState(),
|
|
48
|
+
_useState10 = _slicedToArray(_useState1, 2),
|
|
49
|
+
inputType = _useState10[0],
|
|
50
|
+
setInputType = _useState10[1];
|
|
51
|
+
var _useState11 = useState(false),
|
|
42
52
|
_useState12 = _slicedToArray(_useState11, 2),
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
var _useState13 = useState(
|
|
53
|
+
switchPrimaryBtn = _useState12[0],
|
|
54
|
+
setSwitchPrimaryBtn = _useState12[1];
|
|
55
|
+
var _useState13 = useState(),
|
|
46
56
|
_useState14 = _slicedToArray(_useState13, 2),
|
|
47
|
-
|
|
48
|
-
|
|
57
|
+
acceptBtnText = _useState14[0],
|
|
58
|
+
setAcceptBtnText = _useState14[1];
|
|
49
59
|
var _useState15 = useState(),
|
|
50
60
|
_useState16 = _slicedToArray(_useState15, 2),
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
var _useState17 = useState(),
|
|
54
|
-
_useState18 = _slicedToArray(_useState17, 2),
|
|
55
|
-
cancelBtnText = _useState18[0],
|
|
56
|
-
setCancelBtnText = _useState18[1];
|
|
61
|
+
cancelBtnText = _useState16[0],
|
|
62
|
+
setCancelBtnText = _useState16[1];
|
|
57
63
|
var unSetModalContent = useCallback(function () {
|
|
58
64
|
setModalContent(undefined);
|
|
59
65
|
}, [setModalContent]);
|
|
60
|
-
var
|
|
61
|
-
|
|
62
|
-
onSubmit =
|
|
63
|
-
setOnSubmit =
|
|
66
|
+
var _useState17 = useState(),
|
|
67
|
+
_useState18 = _slicedToArray(_useState17, 2),
|
|
68
|
+
onSubmit = _useState18[0],
|
|
69
|
+
setOnSubmit = _useState18[1];
|
|
64
70
|
var ask = function ask(text, options) {
|
|
65
71
|
return new Promise(function (resolve) {
|
|
66
72
|
setType("ask");
|
|
@@ -137,24 +143,26 @@ var ModalProvider = function ModalProvider(_ref) {
|
|
|
137
143
|
});
|
|
138
144
|
});
|
|
139
145
|
};
|
|
140
|
-
return /*#__PURE__*/
|
|
146
|
+
return /*#__PURE__*/_jsxs(ModalContext.Provider, _objectSpread(_objectSpread({
|
|
141
147
|
value: {
|
|
142
148
|
ask: ask,
|
|
143
149
|
tell: tell,
|
|
144
150
|
verify: verify
|
|
145
151
|
}
|
|
146
|
-
}, rest),
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
152
|
+
}, rest), {}, {
|
|
153
|
+
children: [children, /*#__PURE__*/_jsx(Modal, {
|
|
154
|
+
modalContent: modalContent,
|
|
155
|
+
modalTitle: modalTitle,
|
|
156
|
+
modalIcon: modalIcon,
|
|
157
|
+
unSetModalContent: unSetModalContent,
|
|
158
|
+
onSubmit: onSubmit,
|
|
159
|
+
defaultInput: defaultInput,
|
|
160
|
+
type: type,
|
|
161
|
+
inputType: inputType,
|
|
162
|
+
switchPrimaryBtn: switchPrimaryBtn,
|
|
163
|
+
acceptBtnText: acceptBtnText,
|
|
164
|
+
cancelBtnText: cancelBtnText
|
|
165
|
+
})]
|
|
158
166
|
}));
|
|
159
167
|
};
|
|
160
168
|
var useModal = function useModal() {
|
|
@@ -3,6 +3,7 @@ import React, { useEffect, useRef } from "react";
|
|
|
3
3
|
/**
|
|
4
4
|
* Hook that alerts clicks outside of the passed ref
|
|
5
5
|
*/
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
7
|
export function useOutside(ref, callback) {
|
|
7
8
|
useEffect(function () {
|
|
8
9
|
/**
|
|
@@ -33,10 +34,11 @@ export default function Outside(_ref) {
|
|
|
33
34
|
wrapperRef = _ref.wrapperRef;
|
|
34
35
|
var ref = useRef(null);
|
|
35
36
|
useOutside(wrapperRef || ref, onClickOutside);
|
|
36
|
-
return /*#__PURE__*/
|
|
37
|
+
return /*#__PURE__*/_jsx("div", {
|
|
37
38
|
ref: wrapperRef || ref,
|
|
38
39
|
className: className,
|
|
39
40
|
style: style,
|
|
40
|
-
onClick: onClick
|
|
41
|
-
|
|
41
|
+
onClick: onClick,
|
|
42
|
+
children: children
|
|
43
|
+
});
|
|
42
44
|
}
|
|
@@ -7,6 +7,7 @@ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
|
7
7
|
import React, { useEffect, useState } from "react";
|
|
8
8
|
import { guid } from "blue-web/dist/js/utils.js";
|
|
9
9
|
import { getPhrase } from "./shared.js";
|
|
10
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
11
|
/**
|
|
11
12
|
* A search bar that can be placed to the sidebar or on a page.
|
|
12
13
|
*/
|
|
@@ -31,69 +32,77 @@ export default function Search(props) {
|
|
|
31
32
|
useEffect(function () {
|
|
32
33
|
if (props.value) setValue(props.value);
|
|
33
34
|
}, [props.value]);
|
|
34
|
-
return /*#__PURE__*/
|
|
35
|
+
return /*#__PURE__*/_jsx("form", {
|
|
35
36
|
className: className,
|
|
36
37
|
onSubmit: function onSubmit(event) {
|
|
37
38
|
event.preventDefault();
|
|
38
39
|
if (_onSubmit) _onSubmit(event);
|
|
39
|
-
}
|
|
40
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
41
|
-
className: "blue-input-group input-group"
|
|
42
|
-
}, /*#__PURE__*/React.createElement("label", {
|
|
43
|
-
htmlFor: SearchControlId,
|
|
44
|
-
className: "input-group-text"
|
|
45
|
-
}, icon || /*#__PURE__*/React.createElement("svg", {
|
|
46
|
-
width: "1em",
|
|
47
|
-
height: "1em",
|
|
48
|
-
viewBox: "0 0 16 16",
|
|
49
|
-
className: "bi bi-search",
|
|
50
|
-
fill: "currentColor",
|
|
51
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
52
|
-
"aria-hidden": true
|
|
53
|
-
}, /*#__PURE__*/React.createElement("path", {
|
|
54
|
-
fillRule: "evenodd",
|
|
55
|
-
d: "M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
|
|
56
|
-
}), /*#__PURE__*/React.createElement("path", {
|
|
57
|
-
fillRule: "evenodd",
|
|
58
|
-
d: "M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
|
|
59
|
-
})), /*#__PURE__*/React.createElement("span", {
|
|
60
|
-
className: "visually-hidden"
|
|
61
|
-
}, getPhrase("Search"))), props.children || /*#__PURE__*/React.createElement("input", {
|
|
62
|
-
ref: inputRef,
|
|
63
|
-
type: reset ? "text" : "search",
|
|
64
|
-
value: value,
|
|
65
|
-
onChange: function onChange(event) {
|
|
66
|
-
setValue(event.target.value);
|
|
67
|
-
if (_onChange) _onChange(event);
|
|
68
40
|
},
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
41
|
+
children: /*#__PURE__*/_jsxs("div", {
|
|
42
|
+
className: "blue-input-group input-group",
|
|
43
|
+
children: [/*#__PURE__*/_jsxs("label", {
|
|
44
|
+
htmlFor: SearchControlId,
|
|
45
|
+
className: "input-group-text",
|
|
46
|
+
children: [icon || /*#__PURE__*/_jsxs("svg", {
|
|
47
|
+
width: "1em",
|
|
48
|
+
height: "1em",
|
|
49
|
+
viewBox: "0 0 16 16",
|
|
50
|
+
className: "bi bi-search",
|
|
51
|
+
fill: "currentColor",
|
|
52
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
53
|
+
"aria-hidden": true,
|
|
54
|
+
children: [/*#__PURE__*/_jsx("path", {
|
|
55
|
+
fillRule: "evenodd",
|
|
56
|
+
d: "M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
|
|
57
|
+
}), /*#__PURE__*/_jsx("path", {
|
|
58
|
+
fillRule: "evenodd",
|
|
59
|
+
d: "M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
|
|
60
|
+
})]
|
|
61
|
+
}), /*#__PURE__*/_jsx("span", {
|
|
62
|
+
className: "visually-hidden",
|
|
63
|
+
children: getPhrase("Search")
|
|
64
|
+
})]
|
|
65
|
+
}), props.children || /*#__PURE__*/_jsx("input", {
|
|
66
|
+
ref: inputRef,
|
|
67
|
+
type: reset ? "text" : "search",
|
|
68
|
+
value: value,
|
|
69
|
+
onChange: function onChange(event) {
|
|
70
|
+
setValue(event.target.value);
|
|
71
|
+
if (_onChange) _onChange(event);
|
|
72
|
+
},
|
|
73
|
+
id: SearchControlId,
|
|
74
|
+
className: "form-control " + inputClassName,
|
|
75
|
+
placeholder: placeholder,
|
|
76
|
+
autoFocus: autoFocus
|
|
77
|
+
}), reset && value.length > 0 && /*#__PURE__*/_jsx("div", {
|
|
78
|
+
className: "input-group-btn",
|
|
79
|
+
children: /*#__PURE__*/_jsx("button", {
|
|
80
|
+
type: "button",
|
|
81
|
+
className: "btn btn-link",
|
|
82
|
+
onClick: function onClick() {
|
|
83
|
+
var _document$getElementB;
|
|
84
|
+
setValue("");
|
|
85
|
+
(_document$getElementB = document.getElementById(SearchControlId)) === null || _document$getElementB === void 0 || _document$getElementB.focus();
|
|
86
|
+
if (_onChange) _onChange({
|
|
87
|
+
target: {
|
|
88
|
+
value: ""
|
|
89
|
+
}
|
|
90
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
91
|
+
});
|
|
92
|
+
},
|
|
93
|
+
children: resetIcon || /*#__PURE__*/_jsx("svg", {
|
|
94
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
95
|
+
width: "1em",
|
|
96
|
+
height: "1em",
|
|
97
|
+
fill: "currentColor",
|
|
98
|
+
className: "bi bi-x mt-n1",
|
|
99
|
+
viewBox: "0 0 16 16",
|
|
100
|
+
children: /*#__PURE__*/_jsx("path", {
|
|
101
|
+
d: "M4.646 4.646a.5.5 0 01.708 0L8 7.293l2.646-2.647a.5.5 0 01.708.708L8.707 8l2.647 2.646a.5.5 0 01-.708.708L8 8.707l-2.646 2.647a.5.5 0 01-.708-.708L7.293 8 4.646 5.354a.5.5 0 010-.708z"
|
|
102
|
+
})
|
|
103
|
+
})
|
|
104
|
+
})
|
|
105
|
+
})]
|
|
106
|
+
})
|
|
107
|
+
});
|
|
99
108
|
}
|
|
@@ -1,13 +1,16 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
3
|
/**
|
|
3
4
|
* Sidebar for the `Layout` component.
|
|
4
5
|
*/
|
|
5
6
|
export default function SidebarMenu(props) {
|
|
6
|
-
return /*#__PURE__*/
|
|
7
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
7
8
|
className: "d-flex flex-column h-100 " + (props.sidebarClass || ""),
|
|
8
|
-
style: props.sidebarStyle
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
9
|
+
style: props.sidebarStyle,
|
|
10
|
+
children: [props.topContent, /*#__PURE__*/_jsx("div", {
|
|
11
|
+
className: "flex-grow-1 overflow-auto " + (props.menuClass || ""),
|
|
12
|
+
style: props.menuStyle ? props.menuStyle : {},
|
|
13
|
+
children: props.children
|
|
14
|
+
}), props.bottomContent]
|
|
15
|
+
});
|
|
13
16
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import clsx from "clsx";
|
|
3
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
4
|
/**
|
|
4
5
|
* A simple layout with header and main content area.
|
|
5
6
|
*/
|
|
@@ -10,16 +11,20 @@ export default function SimpleLayout(_ref) {
|
|
|
10
11
|
header = _ref.header,
|
|
11
12
|
_ref$noPageBorder = _ref.noPageBorder,
|
|
12
13
|
noPageBorder = _ref$noPageBorder === void 0 ? false : _ref$noPageBorder;
|
|
13
|
-
return /*#__PURE__*/
|
|
14
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
14
15
|
className: clsx("blue-layout", className),
|
|
15
|
-
style: style
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
16
|
+
style: style,
|
|
17
|
+
children: [/*#__PURE__*/_jsx("header", {
|
|
18
|
+
className: "blue-layout-header",
|
|
19
|
+
children: header
|
|
20
|
+
}), /*#__PURE__*/_jsx("main", {
|
|
21
|
+
className: "blue-layout-main",
|
|
22
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
23
|
+
className: clsx("blue-layout-body", {
|
|
24
|
+
"border-0": noPageBorder
|
|
25
|
+
}),
|
|
26
|
+
children: children
|
|
27
|
+
})
|
|
28
|
+
})]
|
|
29
|
+
});
|
|
25
30
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
3
|
/**
|
|
3
4
|
* Shortcut for a combination using Bootstrap's Grid System to create a slim responsive container.
|
|
4
5
|
*/
|
|
@@ -6,9 +7,11 @@ export default function SlimContainer(_ref) {
|
|
|
6
7
|
var children = _ref.children,
|
|
7
8
|
className = _ref.className,
|
|
8
9
|
innerClassName = _ref.innerClassName;
|
|
9
|
-
return /*#__PURE__*/
|
|
10
|
-
className: "row " + (className || "")
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
10
|
+
return /*#__PURE__*/_jsx("div", {
|
|
11
|
+
className: "row " + (className || ""),
|
|
12
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
13
|
+
className: "col-md-6 col-lg-4 " + (innerClassName || ""),
|
|
14
|
+
children: children
|
|
15
|
+
})
|
|
16
|
+
});
|
|
14
17
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import clsx from "clsx";
|
|
3
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
4
|
export default function Status(_ref) {
|
|
4
5
|
var alert = _ref.alert,
|
|
5
6
|
onUnsetAlert = _ref.onUnsetAlert,
|
|
@@ -13,44 +14,59 @@ export default function Status(_ref) {
|
|
|
13
14
|
dangerIcon = _ref$dangerIcon === void 0 ? "❌" : _ref$dangerIcon,
|
|
14
15
|
_ref$status = _ref.status,
|
|
15
16
|
status = _ref$status === void 0 ? null : _ref$status;
|
|
16
|
-
return /*#__PURE__*/
|
|
17
|
-
|
|
18
|
-
"
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
})
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
"
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
17
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
18
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
19
|
+
className: clsx("blue-status-circle blue-loading blue-status-loading", {
|
|
20
|
+
"d-block": status === "loading" || alert && alert.status === "loading"
|
|
21
|
+
}),
|
|
22
|
+
children: /*#__PURE__*/_jsxs("div", {
|
|
23
|
+
className: "spinner-bounce-circle",
|
|
24
|
+
children: [/*#__PURE__*/_jsx("div", {}), /*#__PURE__*/_jsx("div", {})]
|
|
25
|
+
})
|
|
26
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
27
|
+
className: clsx("blue-status-circle blue-status-success", {
|
|
28
|
+
"d-flex": status === "success" || alert && alert.status === "success"
|
|
29
|
+
}),
|
|
30
|
+
children: successIcon
|
|
31
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
32
|
+
className: clsx("blue-status-circle blue-status-info", {
|
|
33
|
+
"d-flex": status === "info" || alert && alert.status === "info"
|
|
34
|
+
}),
|
|
35
|
+
children: infoIcon
|
|
36
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
37
|
+
className: clsx("blue-status-circle blue-status-warning", {
|
|
38
|
+
"d-flex": status === "warning" || alert && alert.status === "warning"
|
|
39
|
+
}),
|
|
40
|
+
children: warningIcon
|
|
41
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
42
|
+
className: clsx("blue-status-circle blue-status-danger", {
|
|
43
|
+
"d-flex": status === "danger" || alert && alert.status === "danger"
|
|
44
|
+
}),
|
|
45
|
+
children: dangerIcon
|
|
46
|
+
}), /*#__PURE__*/_jsxs("div", {
|
|
47
|
+
className: "blue-status-alert alert",
|
|
48
|
+
children: [/*#__PURE__*/_jsx("button", {
|
|
49
|
+
type: "button",
|
|
50
|
+
className: "btn-close float-end mb-1",
|
|
51
|
+
"aria-label": "Close"
|
|
52
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
53
|
+
className: "alert-body"
|
|
54
|
+
})]
|
|
55
|
+
}), alert && /*#__PURE__*/_jsxs("div", {
|
|
56
|
+
className: clsx("blue-status-alert alert d-block", alert.alertClassName, alert.status && "alert-".concat(alert.status)),
|
|
57
|
+
children: [/*#__PURE__*/_jsx("button", {
|
|
58
|
+
type: "button",
|
|
59
|
+
className: "btn-close float-end mb-1 d-inline-block",
|
|
60
|
+
"aria-label": "Close",
|
|
61
|
+
onClick: onUnsetAlert
|
|
62
|
+
}), /*#__PURE__*/_jsxs("div", {
|
|
63
|
+
className: "alert-body",
|
|
64
|
+
children: [alert.title && /*#__PURE__*/_jsx("h2", {
|
|
65
|
+
children: alert.title
|
|
66
|
+
}), alert.detailText && /*#__PURE__*/_jsx("span", {
|
|
67
|
+
children: alert.detailText
|
|
68
|
+
})]
|
|
69
|
+
})]
|
|
70
|
+
})]
|
|
71
|
+
});
|
|
56
72
|
}
|