blue-react 9.0.0-alpha1 → 9.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.
Files changed (50) hide show
  1. package/dist/components/ActionMenu.js +98 -109
  2. package/dist/components/ActionMenuSwitch.js +44 -55
  3. package/dist/components/Body.js +38 -50
  4. package/dist/components/Caret.js +19 -32
  5. package/dist/components/DocumentView.js +76 -88
  6. package/dist/components/Header.js +22 -34
  7. package/dist/components/HeaderTitle.js +54 -66
  8. package/dist/components/Intro.js +35 -48
  9. package/dist/components/Layout.js +313 -292
  10. package/dist/components/MenuItem.js +130 -139
  11. package/dist/components/Modal.js +164 -173
  12. package/dist/components/ModalProvider.js +184 -195
  13. package/dist/components/Outside.js +50 -63
  14. package/dist/components/Page.js +62 -74
  15. package/dist/components/Search.js +159 -168
  16. package/dist/components/SidebarMenu.js +56 -69
  17. package/dist/components/SidebarMenuItem.js +124 -0
  18. package/dist/components/SidebarToggler.js +33 -0
  19. package/dist/components/SlimContainer.js +21 -34
  20. package/dist/components/Status.js +64 -76
  21. package/dist/components/StatusProvider.js +68 -79
  22. package/dist/components/Switch.js +57 -70
  23. package/dist/components/Utilities.js +183 -192
  24. package/dist/components/shared.js +24 -37
  25. package/dist/neu.scss +76 -0
  26. package/dist/style.css +1632 -522
  27. package/dist/style.min.css +9 -10
  28. package/dist/style.scss +4 -4
  29. package/dist/styles/_bootstrap-variables.scss +2 -2
  30. package/dist/styles/_bootstrap.scss +1 -0
  31. package/dist/styles/_general.scss +2 -2
  32. package/dist/styles/_layout.scss +3 -7
  33. package/dist/styles/_sidebar.scss +36 -0
  34. package/dist/styles/_variables.scss +5 -20
  35. package/dist/styles/mixins/_sidebar.scss +16 -2
  36. package/dist/types/components/Layout.d.ts +17 -1
  37. package/dist/types/components/MenuItem.d.ts +4 -0
  38. package/dist/types/components/Search.d.ts +7 -3
  39. package/dist/types/components/SidebarMenuItem.d.ts +21 -0
  40. package/dist/types/components/SidebarToggler.d.ts +10 -0
  41. package/dist/types/components/Utilities.d.ts +4 -0
  42. package/index.d.ts +5 -6
  43. package/index.js +1 -2
  44. package/package.json +4 -5
  45. package/dist/components/BodyRounded.js +0 -44
  46. package/dist/components/Grid.js +0 -288
  47. package/dist/style.css.map +0 -1
  48. package/dist/styles/_bootstrap-optimizations.scss +0 -5
  49. package/dist/types/components/BodyRounded.d.ts +0 -10
  50. package/dist/types/components/Grid.d.ts +0 -110
@@ -1,168 +1,159 @@
1
+ "use strict";
2
+
1
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); }
2
4
 
3
- (function (global, factory) {
4
- if (typeof define === "function" && define.amd) {
5
- define(["exports", "clsx", "react", "./Caret", "./Outside", "./Utilities"], factory);
6
- } else if (typeof exports !== "undefined") {
7
- factory(exports, require("clsx"), require("react"), require("./Caret"), require("./Outside"), require("./Utilities"));
8
- } else {
9
- var mod = {
10
- exports: {}
11
- };
12
- factory(mod.exports, global.clsx, global.react, global.Caret, global.Outside, global.Utilities);
13
- global.MenuItem = mod.exports;
14
- }
15
- })(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _clsx, _react, _Caret, _Outside, _Utilities) {
16
- "use strict";
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = MenuItem;
17
9
 
18
- Object.defineProperty(_exports, "__esModule", {
19
- value: true
20
- });
21
- _exports.default = MenuItem;
22
- _clsx = _interopRequireDefault(_clsx);
23
- _react = _interopRequireWildcard(_react);
24
- _Caret = _interopRequireDefault(_Caret);
25
- _Outside = _interopRequireDefault(_Outside);
26
- _Utilities = _interopRequireDefault(_Utilities);
10
+ var _clsx = _interopRequireDefault(require("clsx"));
27
11
 
28
- 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); }
12
+ var _react = _interopRequireWildcard(require("react"));
29
13
 
30
- 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; }
14
+ var _Caret = _interopRequireDefault(require("./Caret"));
31
15
 
32
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
+ var _Outside = _interopRequireDefault(require("./Outside"));
33
17
 
34
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
18
+ var _Utilities = _interopRequireDefault(require("./Utilities"));
35
19
 
36
- 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."); }
20
+ 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); }
37
21
 
38
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
22
+ 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; }
39
23
 
40
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
24
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
41
25
 
42
- function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
26
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
43
27
 
44
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
28
+ 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."); }
45
29
 
46
- /**
47
- * Link, button or custom component for Sidebar, Actions or ActionMenu
48
- */
49
- function MenuItem(props) {
50
- var _useState = (0, _react.useState)(false),
51
- _useState2 = _slicedToArray(_useState, 2),
52
- showDropdown = _useState2[0],
53
- setShowDropdown = _useState2[1];
30
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
54
31
 
55
- var _useState3 = (0, _react.useState)(false),
56
- _useState4 = _slicedToArray(_useState3, 2),
57
- active = _useState4[0],
58
- setActive = _useState4[1];
32
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
59
33
 
60
- var checkActive = function checkActive() {
61
- setActive(props.href && window.location.hash.indexOf(props.href) > -1 || props.isHome && (window.location.hash === "" || window.location.hash === "#/") ? true : false);
62
- };
34
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
63
35
 
64
- var onClick = function onClick(event) {
65
- if (props.href === "#") {
66
- event.preventDefault();
67
- }
36
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
68
37
 
69
- if (props.onClick) {
70
- props.onClick(event);
71
- }
38
+ /**
39
+ * Link, button or custom component for Sidebar, Actions or ActionMenu
40
+ */
41
+ function MenuItem(props) {
42
+ var _useState = (0, _react.useState)(false),
43
+ _useState2 = _slicedToArray(_useState, 2),
44
+ showDropdown = _useState2[0],
45
+ setShowDropdown = _useState2[1];
72
46
 
73
- if (props.children) {
74
- setShowDropdown(!showDropdown);
75
- } // When user clicks again on active menu item, scroll to top of page
47
+ var _useState3 = (0, _react.useState)(false),
48
+ _useState4 = _slicedToArray(_useState3, 2),
49
+ active = _useState4[0],
50
+ setActive = _useState4[1];
76
51
 
52
+ var checkActive = function checkActive() {
53
+ setActive(props.href && window.location.hash.indexOf(props.href) > -1 || props.isHome && (window.location.hash === "" || window.location.hash === "#/") ? true : false);
54
+ };
77
55
 
78
- if (props.href && props.href === window.location.hash) {
79
- _Utilities.default.scrollToTop();
80
- }
56
+ var onClick = function onClick(event) {
57
+ if (props.href === "#") {
58
+ event.preventDefault();
59
+ }
81
60
 
82
- if (props.onClickAttached !== undefined) {
83
- props.onClickAttached(event);
84
- }
85
- };
61
+ if (props.onClick) {
62
+ props.onClick(event);
63
+ }
86
64
 
87
- var onClickOutside = function onClickOutside(_ref) {
88
- var target = _ref.target;
65
+ if (props.children) {
66
+ setShowDropdown(!showDropdown);
67
+ } // When user clicks again on active menu item, scroll to top of page
89
68
 
90
- // Don't trigger when clicking on MenuItem
91
- if (!_Utilities.default.hasClass(target, "blue-menu-item-dropdown-toggle") && !_Utilities.default.hasClass(target, "blue-menu-item-label")) {
92
- setShowDropdown(false);
93
- }
94
- };
95
69
 
96
- (0, _react.useEffect)(function () {
97
- checkActive();
98
- window.addEventListener("hashchange", function () {
99
- checkActive();
100
- });
101
- }, []);
102
- (0, _react.useEffect)(function () {
103
- if (props.showDropdown !== undefined) setShowDropdown(props.showDropdown);
104
- }, [props.showDropdown]);
105
- var className = "blue-menu-item btn" + (props.isActive ? " active" : "") + (props.className ? " " + props.className : "") + (props.children ? " blue-menu-item-dropdown-toggle" : "");
106
- var icon, iconForActive;
107
-
108
- if (typeof props.icon === "string") {
109
- // is className
110
- icon = /*#__PURE__*/_react.default.createElement("span", {
111
- className: props.icon + (props.children ? " blue-menu-item-dropdown-icon" : "")
112
- });
113
- } else {
114
- // is element / component
115
- icon = props.icon;
70
+ if (props.href && props.href === window.location.hash) {
71
+ _Utilities.default.scrollToTop();
116
72
  }
117
73
 
118
- if (typeof props.iconForActive === "string") {
119
- // is className
120
- iconForActive = /*#__PURE__*/_react.default.createElement("span", {
121
- className: props.iconForActive + (props.children ? " blue-menu-item-dropdown-icon" : "")
122
- });
123
- } else {
124
- // is element / component
125
- iconForActive = props.iconForActive;
74
+ if (props.onClickAttached !== undefined) {
75
+ props.onClickAttached(event);
126
76
  }
77
+ };
127
78
 
128
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/(0, _react.createElement)(props.elementType || (props.href ? "a" : "button"), {
129
- to: props.to,
130
- href: props.href,
131
- exact: props.exact,
132
- className: className + (props.isActive || active ? " active" : "") + (props.label ? " has-label" : ""),
133
- onClick: onClick,
134
- target: props.target,
135
- rel: props.rel,
136
- title: props.title,
137
- onDragStart: props.onDragStart,
138
- onDrag: props.onDrag,
139
- onDragEnd: props.onDragEnd,
140
- onDragEnter: props.onDragEnter,
141
- onDragOver: props.onDragOver,
142
- onDragLeave: props.onDragLeave,
143
- onDrop: props.onDrop,
144
- draggable: props.draggable,
145
- "data-tooltip": props["data-tooltip"],
146
- disabled: props.disabled,
147
- style: props.style,
148
- type: props.type
149
- }, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
150
- className: (0, _clsx.default)("blue-menu-item-icon", {
151
- hasIconForActive: iconForActive
152
- })
153
- }, icon), iconForActive && /*#__PURE__*/_react.default.createElement("span", {
154
- className: "blue-menu-item-icon iconForActive"
155
- }, iconForActive), props.label && /*#__PURE__*/_react.default.createElement("span", {
156
- className: "blue-menu-item-label text-truncate"
157
- }, props.label), props.children && /*#__PURE__*/_react.default.createElement(_Caret.default, {
158
- open: showDropdown,
159
- mirrored: true,
160
- className: "blue-menu-item-dropdown-caret mt-2"
161
- }))), showDropdown && (props.supportOutside ? /*#__PURE__*/_react.default.createElement(_Outside.default, {
162
- className: "blue-menu-item-dropdown ".concat(props.dropdownClassName),
163
- onClickOutside: onClickOutside
164
- }, props.children) : /*#__PURE__*/_react.default.createElement("div", {
165
- className: "blue-menu-item-dropdown ".concat(props.dropdownClassName)
166
- }, props.children)));
79
+ var onClickOutside = function onClickOutside(_ref) {
80
+ var target = _ref.target;
81
+
82
+ // Don't trigger when clicking on MenuItem
83
+ if (!_Utilities.default.hasClass(target, "blue-menu-item-dropdown-toggle") && !_Utilities.default.hasClass(target, "blue-menu-item-label")) {
84
+ setShowDropdown(false);
85
+ }
86
+ };
87
+
88
+ (0, _react.useEffect)(function () {
89
+ checkActive();
90
+ window.addEventListener("hashchange", function () {
91
+ checkActive();
92
+ });
93
+ }, []);
94
+ (0, _react.useEffect)(function () {
95
+ if (props.showDropdown !== undefined) setShowDropdown(props.showDropdown);
96
+ }, [props.showDropdown]);
97
+ var className = "blue-menu-item btn" + (props.isActive ? " active" : "") + (props.className ? " " + props.className : "") + (props.children ? " blue-menu-item-dropdown-toggle" : "") + (props.highlighted ? " highlighted" : "");
98
+ var icon, iconForActive;
99
+
100
+ if (typeof props.icon === "string") {
101
+ // is className
102
+ icon = /*#__PURE__*/_react.default.createElement("span", {
103
+ className: props.icon + (props.children ? " blue-menu-item-dropdown-icon" : "")
104
+ });
105
+ } else {
106
+ // is element / component
107
+ icon = props.icon;
167
108
  }
168
- });
109
+
110
+ if (typeof props.iconForActive === "string") {
111
+ // is className
112
+ iconForActive = /*#__PURE__*/_react.default.createElement("span", {
113
+ className: props.iconForActive + (props.children ? " blue-menu-item-dropdown-icon" : "")
114
+ });
115
+ } else {
116
+ // is element / component
117
+ iconForActive = props.iconForActive;
118
+ }
119
+
120
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/(0, _react.createElement)(props.elementType || (props.href ? "a" : "button"), {
121
+ to: props.to,
122
+ href: props.href,
123
+ exact: props.exact,
124
+ className: className + (props.isActive || active ? " active" : "") + (props.label ? " has-label" : ""),
125
+ onClick: onClick,
126
+ target: props.target,
127
+ rel: props.rel,
128
+ title: props.title,
129
+ onDragStart: props.onDragStart,
130
+ onDrag: props.onDrag,
131
+ onDragEnd: props.onDragEnd,
132
+ onDragEnter: props.onDragEnter,
133
+ onDragOver: props.onDragOver,
134
+ onDragLeave: props.onDragLeave,
135
+ onDrop: props.onDrop,
136
+ draggable: props.draggable,
137
+ "data-tooltip": props["data-tooltip"],
138
+ disabled: props.disabled,
139
+ style: props.style,
140
+ type: props.type
141
+ }, /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
142
+ className: (0, _clsx.default)("blue-menu-item-icon", {
143
+ hasIconForActive: iconForActive
144
+ })
145
+ }, icon), iconForActive && /*#__PURE__*/_react.default.createElement("span", {
146
+ className: "blue-menu-item-icon iconForActive"
147
+ }, iconForActive), props.label && /*#__PURE__*/_react.default.createElement("span", {
148
+ className: "blue-menu-item-label text-truncate"
149
+ }, props.label), props.children && /*#__PURE__*/_react.default.createElement(_Caret.default, {
150
+ open: showDropdown,
151
+ mirrored: true,
152
+ className: "blue-menu-item-dropdown-caret mt-2"
153
+ }))), showDropdown && (props.supportOutside ? /*#__PURE__*/_react.default.createElement(_Outside.default, {
154
+ className: "blue-menu-item-dropdown ".concat(props.dropdownClassName),
155
+ onClickOutside: onClickOutside
156
+ }, props.children) : /*#__PURE__*/_react.default.createElement("div", {
157
+ className: "blue-menu-item-dropdown ".concat(props.dropdownClassName)
158
+ }, props.children)));
159
+ }