@crystaldesign/diva-navigator 25.11.0-beta.2 → 25.11.0-beta.20
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/build/esm/index.js +54 -98
- package/build/types/navigator/src/Header/index.d.ts.map +1 -1
- package/build/types/navigator/src/Mobile/Menu.d.ts +1 -2
- package/build/types/navigator/src/Mobile/Menu.d.ts.map +1 -1
- package/build/types/navigator/src/index.d.ts.map +1 -1
- package/package.json +2 -2
- package/build/types/navigator/src/Mobile/Burger.d.ts +0 -5
- package/build/types/navigator/src/Mobile/Burger.d.ts.map +0 -1
- package/build/types/navigator/src/Mobile/index.d.ts +0 -7
- package/build/types/navigator/src/Mobile/index.d.ts.map +0 -1
package/build/esm/index.js
CHANGED
|
@@ -17,7 +17,6 @@ import _typeof from '@babel/runtime/helpers/typeof';
|
|
|
17
17
|
import { Html5Qrcode } from 'html5-qrcode';
|
|
18
18
|
import { Alert } from '@mui/material';
|
|
19
19
|
import Snowfall from 'react-snowfall';
|
|
20
|
-
import { useSwipeable } from 'react-swipeable';
|
|
21
20
|
|
|
22
21
|
(function() {
|
|
23
22
|
const env = {"STAGE":"production"};
|
|
@@ -61,7 +60,7 @@ function styleInject(css, ref) {
|
|
|
61
60
|
var header = "header-bLyVg";
|
|
62
61
|
var headerWrapper = "header-wrapper-BPUbF";
|
|
63
62
|
var headerWrapperRight = "header-wrapper-right-zLaAR";
|
|
64
|
-
var hide
|
|
63
|
+
var hide = "hide-1DmsJ";
|
|
65
64
|
var breadcrumbsWrapper = "breadcrumbs-wrapper-nqYkU";
|
|
66
65
|
var customArea = "custom-area-FLAOC";
|
|
67
66
|
var css_248z$o = ".header-bLyVg {\n background-color: white;\n color: #333333;\n height: -moz-fit-content;\n height: fit-content;\n width: 100%;\n position: relative;\n box-shadow: 0px 1px 4px 0px rgba(51, 51, 51, 1);\n font-family: var(--diva-typography-font-family);\n transition: height ease-in-out 1s;\n z-index: 2;\n display: flex;\n flex-direction: column;\n}\n\n.header-wrapper-BPUbF {\n width: 100%;\n height: 60px;\n position: relative;\n display: flex;\n justify-content: flex-start;\n z-index: 1;\n}\n\n.header-wrapper-left-qxYUn {\n display: flex;\n z-index: 1;\n}\n\n.header-wrapper-right-zLaAR {\n display: flex;\n flex: 1 1 250px;\n max-width: -moz-max-content;\n max-width: max-content;\n justify-content: flex-end;\n height: 100%;\n align-items: center;\n overflow: hidden;\n right: 0;\n background-color: #fff;\n z-index: 10;\n margin-left: auto;\n flex-basis: fit-content;\n}\n\n.darkmode .header-wrapper-right-zLaAR {\n background-color: transparent;\n background-color: initial;\n}\n\n.hide-1DmsJ {\n height: 0;\n transition: height ease-in-out 1s;\n}\n\n.breadcrumbs-wrapper-nqYkU {\n width: 100%;\n height: 30px;\n position: relative;\n border-top: 1px solid #f2f2f2;\n}\n\n.selected-z3Uht {\n transform: scale(1.1);\n color: var(--diva-theme-palette-primary-main);\n}\n.custom-area-FLAOC {\n margin: 8px;\n height: 46px;\n overflow: auto;\n}\n";
|
|
@@ -292,8 +291,8 @@ var disabledClick = "disabled-click-74X-4";
|
|
|
292
291
|
var css_248z$j = ".item-pGwu4 {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-bottom: 4px;\n}\n.text-nRjLJ {\n font-weight: normal;\n color: gray;\n}\n\n.selected-z25La {\n font-weight: 700;\n text-decoration: underline;\n cursor: pointer;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n height: 20px;\n flex-shrink: 0;\n}\n\n.open-class-gFhWe .selected-z25La {\n height: -moz-fit-content;\n height: fit-content;\n}\n\n.row-I58t6 {\n display: flex;\n flex-direction: column;\n width: 100%;\n position: relative;\n height: -moz-fit-content;\n height: fit-content;\n}\n\n.row-I58t6 .MuiFormControl-root {\n margin-left: 25px;\n margin-top: 0;\n}\n\n.row-I58t6 .MuiInputBase-root {\n font-size: small;\n margin-top: 0;\n}\n\n.selectable-2W-K7 {\n cursor: pointer;\n line-height: 20px;\n padding-left: 8px;\n position: relative;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: calc(100% - 20px);\n color: inherit;\n transition: color 0.3s ease;\n}\n\n.selectable-2W-K7:hover {\n font-weight: 700;\n color: var(--diva-theme-palette-primary-main);\n}\n\n.left-space-vcauM {\n width: 16px;\n height: 20px;\n}\n\n.arrow-egJ6F {\n background: center / 50% no-repeat url(\"data:image/svg+xml,%3Csvg width%3D%227%22 height%3D%2211%22 viewBox%3D%220 0 7 11%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M4.24303 5.41303L0.517911 1.73629C0.220592 1.44283 0.220592 0.967042 0.517911 0.673584C0.81523 0.380127 1.29728 0.380127 1.5946 0.673584L5.85806 4.88168C6.15538 5.17513 6.15538 5.65092 5.85806 5.94438L1.5946 10.1525C1.29728 10.4459 0.81523 10.4459 0.517911 10.1525C0.220592 9.85902 0.220592 9.38323 0.517911 9.08977L4.24303 5.41303Z%22 fill%3D%22%23B6B6B7%22%2F%3E%3C%2Fsvg%3E\");\n transition: transform 0.3s ease;\n}\n\n.arrow-egJ6F:hover {\n cursor: pointer;\n}\n\n.open-class-gFhWe .arrow-egJ6F {\n transform: rotate(90deg);\n height: 16px;\n width: 16px;\n}\n\n.list-4f7FZ {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n/* ===== Scrollbar CSS ===== */\n/* Firefox */\n.list-4f7FZ {\n scrollbar-width: thin;\n scrollbar-color: #7b7b7b #dfdfdf;\n}\n\n/* Chrome, Edge, and Safari */\n.list-4f7FZ::-webkit-scrollbar {\n width: 6px;\n}\n\n.list-4f7FZ::-webkit-scrollbar-track {\n background: #dfdfdf;\n border-radius: 3px;\n}\n\n.list-4f7FZ::-webkit-scrollbar-thumb {\n background-color: #7b7b7b;\n border-radius: 3px;\n border: 0px solid #ffffff;\n}\n\n.tooltip-gsR2r {\n background-color: #1b181a;\n color: white;\n padding: 6px;\n border-radius: 4px;\n font-size: 14px;\n z-index: 12;\n}\n\n.disabled-RYfn7 {\n color: grey !important;\n}\n\n.disabled-RYfn7 {\n opacity: 0.8;\n}\n.disabled-click-74X-4 {\n cursor: normal;\n}\n\n.search-87aXI {\n background-color: #fff;\n border-radius: 16px;\n}\n";
|
|
293
292
|
styleInject(css_248z$j);
|
|
294
293
|
|
|
295
|
-
function ownKeys$
|
|
296
|
-
function _objectSpread$
|
|
294
|
+
function ownKeys$1(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; }
|
|
295
|
+
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
297
296
|
function TextElement(_ref) {
|
|
298
297
|
var _theme$typography;
|
|
299
298
|
var data = _ref.data,
|
|
@@ -360,7 +359,7 @@ function TextElement(_ref) {
|
|
|
360
359
|
arrowProps = _useLayer.arrowProps,
|
|
361
360
|
renderLayer = _useLayer.renderLayer;
|
|
362
361
|
return /*#__PURE__*/jsxs(Fragment$1, {
|
|
363
|
-
children: [/*#__PURE__*/jsx("div", _objectSpread$
|
|
362
|
+
children: [/*#__PURE__*/jsx("div", _objectSpread$1(_objectSpread$1(_objectSpread$1({}, triggerProps), hoverProps), {}, {
|
|
364
363
|
style: {
|
|
365
364
|
width: 'calc(100% - 30px)'
|
|
366
365
|
},
|
|
@@ -375,13 +374,13 @@ function TextElement(_ref) {
|
|
|
375
374
|
,
|
|
376
375
|
children: displayName
|
|
377
376
|
})
|
|
378
|
-
})), isOver && (hoverStatus || isShortend) && renderLayer(/*#__PURE__*/jsxs("div", _objectSpread$
|
|
377
|
+
})), isOver && (hoverStatus || isShortend) && renderLayer(/*#__PURE__*/jsxs("div", _objectSpread$1(_objectSpread$1({
|
|
379
378
|
className: tooltip
|
|
380
379
|
}, layerProps), {}, {
|
|
381
|
-
style: _objectSpread$
|
|
380
|
+
style: _objectSpread$1(_objectSpread$1({}, {
|
|
382
381
|
fontFamily: theme === null || theme === void 0 || (_theme$typography = theme.typography) === null || _theme$typography === void 0 ? void 0 : _theme$typography.fontFamily
|
|
383
382
|
}), layerProps.style),
|
|
384
|
-
children: [tooltipText, /*#__PURE__*/jsx(Arrow, _objectSpread$
|
|
383
|
+
children: [tooltipText, /*#__PURE__*/jsx(Arrow, _objectSpread$1(_objectSpread$1({
|
|
385
384
|
onPointerEnterCapture: undefined,
|
|
386
385
|
onPointerLeaveCapture: undefined
|
|
387
386
|
}, arrowProps), {}, {
|
|
@@ -463,8 +462,8 @@ var SearchField = function SearchField(_ref) {
|
|
|
463
462
|
});
|
|
464
463
|
};
|
|
465
464
|
|
|
466
|
-
function ownKeys
|
|
467
|
-
function _objectSpread
|
|
465
|
+
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; }
|
|
466
|
+
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; }
|
|
468
467
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
|
|
469
468
|
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; } }
|
|
470
469
|
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; }
|
|
@@ -746,7 +745,7 @@ function OrganizationSelection (_ref) {
|
|
|
746
745
|
case 15:
|
|
747
746
|
result = _context5.sent;
|
|
748
747
|
(_parent$children3 = parent.children).push.apply(_parent$children3, _toConsumableArray(result.data.map(function (d) {
|
|
749
|
-
return _objectSpread
|
|
748
|
+
return _objectSpread(_objectSpread({}, d), {}, {
|
|
750
749
|
parent: elem._id
|
|
751
750
|
});
|
|
752
751
|
})));
|
|
@@ -782,7 +781,7 @@ function OrganizationSelection (_ref) {
|
|
|
782
781
|
case 33:
|
|
783
782
|
_result = _context5.sent;
|
|
784
783
|
(_elem$children2 = elem.children).push.apply(_elem$children2, _toConsumableArray(_result.data.map(function (d) {
|
|
785
|
-
return _objectSpread
|
|
784
|
+
return _objectSpread(_objectSpread({}, d), {}, {
|
|
786
785
|
parent: elem._id
|
|
787
786
|
});
|
|
788
787
|
})));
|
|
@@ -840,7 +839,7 @@ function OrganizationSelection (_ref) {
|
|
|
840
839
|
}
|
|
841
840
|
parentsOfSelected = hierarchy.slice(rootIndex, -1);
|
|
842
841
|
parentsOfSelected.reverse(); //iterate list from the back
|
|
843
|
-
orgData = _objectSpread
|
|
842
|
+
orgData = _objectSpread(_objectSpread({}, selectedChild), {}, {
|
|
844
843
|
parent: (_parentsOfSelected$_i = (_parentsOfSelected = parentsOfSelected[parentsOfSelected.length - 1]) === null || _parentsOfSelected === void 0 ? void 0 : _parentsOfSelected._id) !== null && _parentsOfSelected$_i !== void 0 ? _parentsOfSelected$_i : 'ROOT',
|
|
845
844
|
isSelected: true,
|
|
846
845
|
hasChildren: selectedChild.hasChildren,
|
|
@@ -874,7 +873,7 @@ function OrganizationSelection (_ref) {
|
|
|
874
873
|
orgData = existing;
|
|
875
874
|
} else {
|
|
876
875
|
//if the parent was not loaded yet, create a new instance, and add the previouse organization as first child
|
|
877
|
-
orgData = _objectSpread
|
|
876
|
+
orgData = _objectSpread(_objectSpread({}, organization), {}, {
|
|
878
877
|
parent: '',
|
|
879
878
|
//parent ID is set below on next iteration
|
|
880
879
|
hasChildren: true,
|
|
@@ -924,7 +923,7 @@ function OrganizationSelection (_ref) {
|
|
|
924
923
|
orgData.open = true;
|
|
925
924
|
orgData.total = _result3.total;
|
|
926
925
|
orgData.children = [].concat(_toConsumableArray(orgData.children), _toConsumableArray(_result3.data.map(function (d) {
|
|
927
|
-
return _objectSpread
|
|
926
|
+
return _objectSpread(_objectSpread({}, d), {}, {
|
|
928
927
|
parent: organization._id
|
|
929
928
|
});
|
|
930
929
|
})));
|
|
@@ -1011,9 +1010,9 @@ function OrganizationSelection (_ref) {
|
|
|
1011
1010
|
return organizationHandler.getOrganizationsChildren(root._id, 0, elementLimit - total);
|
|
1012
1011
|
case 24:
|
|
1013
1012
|
result = _context8.sent;
|
|
1014
|
-
totalList.push(_objectSpread
|
|
1013
|
+
totalList.push(_objectSpread(_objectSpread({}, root), {}, {
|
|
1015
1014
|
children: _toConsumableArray(result.data.map(function (d) {
|
|
1016
|
-
return _objectSpread
|
|
1015
|
+
return _objectSpread(_objectSpread({}, d), {}, {
|
|
1017
1016
|
parent: root._id
|
|
1018
1017
|
});
|
|
1019
1018
|
})),
|
|
@@ -1048,7 +1047,7 @@ function OrganizationSelection (_ref) {
|
|
|
1048
1047
|
_id: 'ROOT',
|
|
1049
1048
|
displayName: '',
|
|
1050
1049
|
children: _toConsumableArray(totalList.map(function (d) {
|
|
1051
|
-
return _objectSpread
|
|
1050
|
+
return _objectSpread(_objectSpread({}, d), {}, {
|
|
1052
1051
|
parent: 'ROOT'
|
|
1053
1052
|
});
|
|
1054
1053
|
})),
|
|
@@ -1158,7 +1157,7 @@ function OrganizationSelection (_ref) {
|
|
|
1158
1157
|
setLoading(false);
|
|
1159
1158
|
} else {
|
|
1160
1159
|
(_ref10 = lastParent.children).push.apply(_ref10, _toConsumableArray(result.data.map(function (d) {
|
|
1161
|
-
return _objectSpread
|
|
1160
|
+
return _objectSpread(_objectSpread({}, d), {}, {
|
|
1162
1161
|
parent: lastParent._id
|
|
1163
1162
|
});
|
|
1164
1163
|
})));
|
|
@@ -1602,7 +1601,7 @@ var languageWrapper = "language-wrapper-Cl-bc";
|
|
|
1602
1601
|
var dropdown = "dropdown-ryNwY";
|
|
1603
1602
|
var clickable = "clickable-MhS-F";
|
|
1604
1603
|
var controlWrapper = "control-wrapper-u1DL4";
|
|
1605
|
-
var menu = "menu-w8zcL";
|
|
1604
|
+
var menu$1 = "menu-w8zcL";
|
|
1606
1605
|
var arrowWrapper = "arrow-wrapper-rHbX-";
|
|
1607
1606
|
var arrow = "arrow-i5G-Z";
|
|
1608
1607
|
var openClass$1 = "open-class-U2edh";
|
|
@@ -1644,7 +1643,7 @@ var UserAndLanguage = function UserAndLanguage(_ref) {
|
|
|
1644
1643
|
children: i18n.language.toLocaleUpperCase()
|
|
1645
1644
|
}), availableLanguages.length > 1 && /*#__PURE__*/jsx(Dropdown, {
|
|
1646
1645
|
className: classNames(dropdown, clickable),
|
|
1647
|
-
menuClassName: menu,
|
|
1646
|
+
menuClassName: menu$1,
|
|
1648
1647
|
options: [currentLang].concat(_toConsumableArray(availableLanguages.map(function (l) {
|
|
1649
1648
|
return l.toUpperCase();
|
|
1650
1649
|
}).filter(function (l) {
|
|
@@ -2398,9 +2397,8 @@ var Header = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2398
2397
|
showOrgName = _useDivaCore$state$na.showOrgName,
|
|
2399
2398
|
showUserName = _useDivaCore$state$na.showUserName,
|
|
2400
2399
|
qrCodeScanner = _useDivaCore$state$na.qrCodeScanner,
|
|
2401
|
-
showSnow = _useDivaCore$state$na.showSnow
|
|
2402
|
-
_useDivaCore$state
|
|
2403
|
-
var initializing = _useDivaCore$state.initializing,
|
|
2400
|
+
showSnow = _useDivaCore$state$na.showSnow,
|
|
2401
|
+
initializing = _useDivaCore$state.initializing,
|
|
2404
2402
|
availableLanguages = _useDivaCore$state.availableLanguages;
|
|
2405
2403
|
var _useTranslation = useTranslation();
|
|
2406
2404
|
_useTranslation.t;
|
|
@@ -2442,7 +2440,7 @@ var Header = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2442
2440
|
children: [/*#__PURE__*/jsxs("div", {
|
|
2443
2441
|
id: "diva-header",
|
|
2444
2442
|
ref: ref,
|
|
2445
|
-
className: classNames(header, initializing || headerLoading ? hide
|
|
2443
|
+
className: classNames(header, initializing || headerLoading ? hide : undefined),
|
|
2446
2444
|
children: [!hideSnow && showSnow && /*#__PURE__*/jsx(Snowfall, {
|
|
2447
2445
|
color: "#a7b6eb",
|
|
2448
2446
|
speed: [0.01, 0.03],
|
|
@@ -2502,13 +2500,7 @@ function Footer () {
|
|
|
2502
2500
|
});
|
|
2503
2501
|
}
|
|
2504
2502
|
|
|
2505
|
-
var
|
|
2506
|
-
var mobile = "mobile-Z9o4Q";
|
|
2507
|
-
var swipable = "swipable-mZfE6";
|
|
2508
|
-
var sideMenu = "side-menu-922Ex";
|
|
2509
|
-
var hide = "hide-Gw-dY";
|
|
2510
|
-
var show = "show-Nh7LC";
|
|
2511
|
-
var closeIcon = "close-icon-w0Qa8";
|
|
2503
|
+
var menu = "menu-zxz3X";
|
|
2512
2504
|
var menuGroup = "menu-group-MIbAN";
|
|
2513
2505
|
var sideButton = "side-button-CA5qH";
|
|
2514
2506
|
var link = "link-2uP9-";
|
|
@@ -2519,17 +2511,9 @@ var mobileBcGroup = "mobile-bc-group-qpSWw";
|
|
|
2519
2511
|
var mobileBreadcrumb = "mobile-breadcrumb-AUdyP";
|
|
2520
2512
|
var mobileSelected = "mobile-selected-9UuOs";
|
|
2521
2513
|
var mobileSplitter = "mobile-splitter-MPW46";
|
|
2522
|
-
var css_248z$1 = ".menu-
|
|
2514
|
+
var css_248z$1 = ".menu-zxz3X {\n width: 100vw;\n max-width: 400px;\n height: 100%;\n background-color: #f2f2f2;\n position: fixed;\n top: 0;\n left: 0;\n transition: transform 0.3s cubic-bezier(0, 0.52, 0, 1);\n overflow: auto;\n box-sizing: border-box;\n padding-top: 32px;\n padding-bottom: 32px;\n}\n\n.menu-zxz3X > img {\n margin-left: 16px;\n max-width: 146px;\n max-height: 46px;\n}\n\n.show-Nh7LC {\n transform: translate3d(0px, 0, 0);\n overflow: hidden;\n}\n\n.close-icon-w0Qa8 {\n position: relative;\n opacity: 0.3;\n margin: 16px 16px 0 0;\n width: 32px;\n height: 32px;\n z-index: 300;\n align-self: flex-end;\n cursor: pointer;\n margin: 16px;\n width: 50px;\n height: 40px;\n}\n\n.menu-group-MIbAN {\n margin: 40px 16px 0 16px;\n display: flex;\n flex-direction: column;\n}\n\n.side-button-CA5qH {\n width: 100%;\n background: #f8f8f8;\n padding: 10px 7px;\n border-radius: 5px;\n cursor: pointer;\n box-sizing: border-box;\n margin-top: 6px;\n line-height: 16px;\n position: relative;\n}\n\n.side-button-CA5qH:hover {\n background: #e1e2e1;\n}\n\n.link-2uP9-::after {\n background: url(\"data:image/svg+xml,%3Csvg viewBox%3D%220 0 8 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M5.54795 7.20988L0.682832 2.2301C0.294525 1.83264 0.294525 1.18823 0.682832 0.79077C1.07114 0.393311 1.70071 0.393311 2.08902 0.79077L7.65722 6.49021C8.04553 6.88767 8.04553 7.53208 7.65722 7.92954L2.08902 13.629C1.70071 14.0264 1.07114 14.0264 0.682832 13.629C0.294525 13.2315 0.294525 12.5871 0.682832 12.1897L5.54795 7.20988Z%22 fill%3D%22%23BBBBBB%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n content: '';\n display: block;\n width: 10px;\n height: 10px;\n float: right;\n position: absolute;\n top: 50%;\n right: 0;\n transform: translateY(-50%);\n margin-right: 7px;\n}\n\n.mobile-footer-E-HE9 {\n height: 120px;\n background-color: #272727;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n}\n\n.mobile-footer-links-iYfrX {\n display: flex;\n font-size: small;\n color: #b6b6b6;\n justify-content: space-around;\n margin-top: 20px;\n}\n\n.mobile-footer-links-iYfrX a {\n cursor: pointer;\n color: #b6b6b6;\n}\n\n.mobile-footer-logo-dytg6 {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 viewBox%3D%220 0 1000 293.65%22%3E%3Cpath d%3D%22M250.89%2C147.3c-3.18-74-30.4-143.18-141.73-143.18L0%2C4.26A307.86%2C307.86%2C0%2C0%2C1%2C26.12%2C60.7h74.2c52.86%2C0%2C76%2C25.68%2C78.61%2C85.29%2C2.66%2C61.81-18.29%2C87.92-71.15%2C87.92H79.2l-46.71.52a287.29%2C287.29%2C0%2C0%2C1-20%2C53.88h109c111.32%2C0%2C132.67-67%2C129.48-141M306.84%2C289h71.23V0a300.07%2C300.07%2C0%2C0%2C1-71.23%2C25.92Zm318.8.62L726.59.85a300%2C300%2C0%2C0%2C1-83.65%2C32.24L577.11%2C224%2C511.29%2C33.09A300%2C300%2C0%2C0%2C1%2C427.64.85l101%2C288.76Zm374.36%2C4L899.05%2C4.91H802L775.14%2C81.74%2C701.05%2C293.65A300.32%2C300.32%2C0%2C0%2C1%2C785%2C261.35l6.79-21%2C19.14-57.54L850.52%2C62l40.07%2C120.85%2C18.7%2C57.54%2C7%2C21A300.2%2C300.2%2C0%2C0%2C1%2C1000%2C293.65%22 fill%3D%22%23b3b3b3%22%2F%3E%3C%2Fsvg%3E\");\n background-repeat: no-repeat;\n height: 20px;\n width: 70px;\n position: absolute;\n left: 50%;\n bottom: 20px;\n transform: translateX(-50%);\n}\n\n.mobile-bc-group-qpSWw {\n display: flex;\n border-top: 0.8px solid #b6b6b7;\n padding: 12px 16px;\n border-bottom: 0.8px solid #b6b6b7;\n margin-top: 40px;\n overflow: auto;\n -ms-overflow-style: none; /* IE and Edge */\n scrollbar-width: none; /* Firefox */\n}\n\n.mobile-bc-group-qpSWw::-webkit-scrollbar {\n display: none;\n}\n\n.mobile-breadcrumb-AUdyP:hover {\n font-weight: 300;\n text-decoration: underline;\n transition: all 200ms;\n}\n\n.mobile-selected-9UuOs {\n font-weight: 300;\n text-decoration: underline;\n color: var(--diva-theme-palette-primary-main);\n}\n\n.mobile-splitter-MPW46:first-of-type {\n display: none;\n}\n\n.mobile-splitter-MPW46 {\n background: url(\"data:image/svg+xml,%3Csvg viewBox%3D%220 0 8 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M5.54795 7.20988L0.682832 2.2301C0.294525 1.83264 0.294525 1.18823 0.682832 0.79077C1.07114 0.393311 1.70071 0.393311 2.08902 0.79077L7.65722 6.49021C8.04553 6.88767 8.04553 7.53208 7.65722 7.92954L2.08902 13.629C1.70071 14.0264 1.07114 14.0264 0.682832 13.629C0.294525 13.2315 0.294525 12.5871 0.682832 12.1897L5.54795 7.20988Z%22 fill%3D%22%23BBBBBB%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n min-width: 10px;\n height: 10px;\n margin: auto 5px;\n}\n";
|
|
2523
2515
|
styleInject(css_248z$1);
|
|
2524
2516
|
|
|
2525
|
-
function Burger (_ref) {
|
|
2526
|
-
var onClick = _ref.onClick;
|
|
2527
|
-
return /*#__PURE__*/jsx("div", {
|
|
2528
|
-
className: menuButton,
|
|
2529
|
-
onClick: onClick
|
|
2530
|
-
});
|
|
2531
|
-
}
|
|
2532
|
-
|
|
2533
2517
|
function Language (_ref) {
|
|
2534
2518
|
var data = _ref.data,
|
|
2535
2519
|
selectedLang = _ref.selected,
|
|
@@ -2654,8 +2638,7 @@ function MobileBreadcrumbs (_ref) {
|
|
|
2654
2638
|
}
|
|
2655
2639
|
|
|
2656
2640
|
function Menu (_ref) {
|
|
2657
|
-
var
|
|
2658
|
-
onClose = _ref.onClose;
|
|
2641
|
+
var onClose = _ref.onClose;
|
|
2659
2642
|
var _useDivaCore = useDivaCore(),
|
|
2660
2643
|
_useDivaCore$actions = _useDivaCore.actions,
|
|
2661
2644
|
openComponent = _useDivaCore$actions.openComponent,
|
|
@@ -2690,11 +2673,8 @@ function Menu (_ref) {
|
|
|
2690
2673
|
openComponent(action);
|
|
2691
2674
|
};
|
|
2692
2675
|
return /*#__PURE__*/jsxs("div", {
|
|
2693
|
-
className: classNames(
|
|
2694
|
-
children: [/*#__PURE__*/jsx("
|
|
2695
|
-
className: closeIcon,
|
|
2696
|
-
onClick: onClose
|
|
2697
|
-
}), /*#__PURE__*/jsx("img", {
|
|
2676
|
+
className: classNames(menu),
|
|
2677
|
+
children: [/*#__PURE__*/jsx("img", {
|
|
2698
2678
|
src: displayLogo,
|
|
2699
2679
|
onClick: onClickLogo
|
|
2700
2680
|
}), /*#__PURE__*/jsx(MobileBreadcrumbs, {
|
|
@@ -2721,46 +2701,6 @@ function Menu (_ref) {
|
|
|
2721
2701
|
});
|
|
2722
2702
|
}
|
|
2723
2703
|
|
|
2724
|
-
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; }
|
|
2725
|
-
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; }
|
|
2726
|
-
var Mobile = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
2727
|
-
var children = _ref.children;
|
|
2728
|
-
var _useState = useState(false),
|
|
2729
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
2730
|
-
open = _useState2[0],
|
|
2731
|
-
setOpen = _useState2[1];
|
|
2732
|
-
var swipeHandler = useSwipeable({
|
|
2733
|
-
onSwipedRight: function onSwipedRight() {
|
|
2734
|
-
if (!open) setOpen(true);
|
|
2735
|
-
},
|
|
2736
|
-
onSwipedLeft: function onSwipedLeft(e) {
|
|
2737
|
-
var _e$event$path;
|
|
2738
|
-
// do not swipe if the event is triggered withing the breadcrumbs
|
|
2739
|
-
if (open && !((_e$event$path = e.event.path) !== null && _e$event$path !== void 0 && _e$event$path.find(function (p) {
|
|
2740
|
-
return p.className == mobileBcGroup;
|
|
2741
|
-
}))) setOpen(false);
|
|
2742
|
-
},
|
|
2743
|
-
trackMouse: true
|
|
2744
|
-
});
|
|
2745
|
-
return /*#__PURE__*/jsxs("div", {
|
|
2746
|
-
className: mobile,
|
|
2747
|
-
ref: ref,
|
|
2748
|
-
children: [/*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, swipeHandler), {}, {
|
|
2749
|
-
className: swipable,
|
|
2750
|
-
children: /*#__PURE__*/jsx(Menu, {
|
|
2751
|
-
open: open,
|
|
2752
|
-
onClose: function onClose() {
|
|
2753
|
-
setOpen(false);
|
|
2754
|
-
}
|
|
2755
|
-
})
|
|
2756
|
-
})), /*#__PURE__*/jsx(Burger, {
|
|
2757
|
-
onClick: function onClick() {
|
|
2758
|
-
setOpen(true);
|
|
2759
|
-
}
|
|
2760
|
-
}), children]
|
|
2761
|
-
});
|
|
2762
|
-
});
|
|
2763
|
-
|
|
2764
2704
|
var wrapper = "wrapper-811ne";
|
|
2765
2705
|
var css_248z = ".wrapper-811ne {\n display: flex;\n position: relative;\n height: 100%;\n flex-direction: column;\n}\n";
|
|
2766
2706
|
styleInject(css_248z);
|
|
@@ -2769,21 +2709,42 @@ var DivaNavigator = function DivaNavigator(_ref) {
|
|
|
2769
2709
|
var children = _ref.children;
|
|
2770
2710
|
var headerElement = useRef(null);
|
|
2771
2711
|
var _useDivaCore = useDivaCore(),
|
|
2772
|
-
|
|
2712
|
+
_useDivaCore$actions = _useDivaCore.actions,
|
|
2713
|
+
updateHeaderInfos = _useDivaCore$actions.updateHeaderInfos,
|
|
2714
|
+
openDrawerMenu = _useDivaCore$actions.openDrawerMenu,
|
|
2715
|
+
closeSideMenu = _useDivaCore$actions.closeSideMenu,
|
|
2773
2716
|
_useDivaCore$state = _useDivaCore.state,
|
|
2774
2717
|
isMobile = _useDivaCore$state.dimensions.isMobile,
|
|
2775
2718
|
_useDivaCore$state$na = _useDivaCore$state.navigationConfiguration,
|
|
2776
2719
|
enableMobile = _useDivaCore$state$na.enableMobile,
|
|
2777
|
-
hideHeader = _useDivaCore$state$na.hideHeader
|
|
2720
|
+
hideHeader = _useDivaCore$state$na.hideHeader,
|
|
2721
|
+
sideMenuOpen = _useDivaCore$state.sideMenuOpen;
|
|
2778
2722
|
var showMobile = isMobile && enableMobile;
|
|
2779
2723
|
useEffect(function () {
|
|
2780
2724
|
var _headerElement$curren;
|
|
2781
2725
|
updateHeaderInfos({
|
|
2782
|
-
onlyBurgerVisibles: !!showMobile,
|
|
2783
|
-
visible: true,
|
|
2784
2726
|
HeaderElement: (_headerElement$curren = headerElement === null || headerElement === void 0 ? void 0 : headerElement.current) !== null && _headerElement$curren !== void 0 ? _headerElement$curren : undefined
|
|
2785
2727
|
});
|
|
2786
2728
|
}, [showMobile, headerElement.current]);
|
|
2729
|
+
useEffect(function () {
|
|
2730
|
+
if (!showMobile) return;
|
|
2731
|
+
//here the state sideMenuOpen is handled by the core. via openSideMenu two separate components communicate via core. (eg: configurator and navigator)
|
|
2732
|
+
if (sideMenuOpen) {
|
|
2733
|
+
openDrawerMenu({
|
|
2734
|
+
id: 'side-menu',
|
|
2735
|
+
open: true,
|
|
2736
|
+
onClose: closeSideMenu,
|
|
2737
|
+
content: /*#__PURE__*/jsx(Menu, {
|
|
2738
|
+
onClose: closeSideMenu
|
|
2739
|
+
}),
|
|
2740
|
+
direction: 'left',
|
|
2741
|
+
showOverlay: true,
|
|
2742
|
+
handleInternScroll: true
|
|
2743
|
+
});
|
|
2744
|
+
} else {
|
|
2745
|
+
closeSideMenu();
|
|
2746
|
+
}
|
|
2747
|
+
}, [sideMenuOpen]);
|
|
2787
2748
|
if (hideHeader) {
|
|
2788
2749
|
return /*#__PURE__*/jsx("div", {
|
|
2789
2750
|
className: wrapper,
|
|
@@ -2796,12 +2757,7 @@ var DivaNavigator = function DivaNavigator(_ref) {
|
|
|
2796
2757
|
children: [/*#__PURE__*/jsx(Header, {
|
|
2797
2758
|
ref: headerElement
|
|
2798
2759
|
}), children, /*#__PURE__*/jsx(Footer, {})]
|
|
2799
|
-
}), showMobile &&
|
|
2800
|
-
children: /*#__PURE__*/jsx(Mobile, {
|
|
2801
|
-
ref: headerElement,
|
|
2802
|
-
children: children
|
|
2803
|
-
})
|
|
2804
|
-
})]
|
|
2760
|
+
}), showMobile && children]
|
|
2805
2761
|
});
|
|
2806
2762
|
};
|
|
2807
2763
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Header/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;;AAgBnD,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Header/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;;AAgBnD,wBAyEG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../../src/Mobile/Menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AASvC,MAAM,CAAC,OAAO,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../../src/Mobile/Menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AASvC,MAAM,CAAC,OAAO,WAAW,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,qBAqD5D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,UAAU,KAAK;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AACD,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAMjD,UAAU,KAAK;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AACD,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAoDlC,CAAC;AAEF,eAAe,aAAa,CAAC;AAC7B,OAAO,SAAS,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,CAAC;AACrB,YAAY,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@crystaldesign/diva-navigator",
|
|
3
|
-
"version": "25.11.0-beta.
|
|
3
|
+
"version": "25.11.0-beta.20",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"devDependencies": {
|
|
6
6
|
"@testing-library/jest-dom": "^6.5.0",
|
|
@@ -24,5 +24,5 @@
|
|
|
24
24
|
},
|
|
25
25
|
"module": "build/esm/index.js",
|
|
26
26
|
"types": "./build/types/navigator/src/index.d.ts",
|
|
27
|
-
"gitHead": "
|
|
27
|
+
"gitHead": "7cd150fe282b157b09fbfecd0226fafce166e382"
|
|
28
28
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Burger.d.ts","sourceRoot":"","sources":["../../../../../src/Mobile/Burger.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,CAAC,OAAO,WAAW,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,qBAE7D"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Mobile/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,UAAU,KAAK;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;;AAED,wBA+BG"}
|