@crystaldesign/diva-core 25.14.0-beta.2 → 25.14.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/{ModalsWrapper-0139509e.js → ModalsWrapper-8792921c.js} +1 -2
- package/build/esm/{index-77c56d9d.js → index-60e32e6e.js} +1 -2
- package/build/esm/{index-c1998248.js → index-fe7284a2.js} +362 -136
- package/build/esm/index.js +2 -3
- package/build/types/core/src/elements/DrawerMenu/index.d.ts +1 -2
- package/build/types/core/src/elements/DrawerMenu/index.d.ts.map +1 -1
- package/build/types/core/src/elements/DrawerMenu/useSwipeToDismiss.d.ts +11 -0
- package/build/types/core/src/elements/DrawerMenu/useSwipeToDismiss.d.ts.map +1 -0
- package/build/types/core/src/elements/HeightAnimator/index.d.ts +9 -0
- package/build/types/core/src/elements/HeightAnimator/index.d.ts.map +1 -0
- package/build/types/core/src/externalTypes.d.ts +1 -1
- package/build/types/core/src/externalTypes.d.ts.map +1 -1
- package/build/types/core/src/handler/ClientArticleHandler/index.d.ts.map +1 -1
- package/build/types/core/src/index.d.ts +2 -0
- package/build/types/core/src/index.d.ts.map +1 -1
- package/build/types/core/src/store/ConfigurationStore.d.ts.map +1 -1
- package/build/umd/{914.diva-core.umd.min.js → 152.diva-core.umd.min.js} +2 -2
- package/build/umd/152.diva-core.umd.min.js.LICENSE.txt +1 -0
- package/build/umd/{803.diva-core.umd.min.js → 609.diva-core.umd.min.js} +2 -2
- package/build/umd/609.diva-core.umd.min.js.LICENSE.txt +1 -0
- package/build/umd/{486.diva-core.umd.min.js → 618.diva-core.umd.min.js} +2 -2
- package/build/umd/618.diva-core.umd.min.js.LICENSE.txt +1 -0
- package/build/umd/70.diva-core.umd.min.js +2 -0
- package/build/umd/70.diva-core.umd.min.js.LICENSE.txt +1 -0
- package/build/umd/820.diva-core.umd.min.js +2 -0
- package/build/umd/820.diva-core.umd.min.js.LICENSE.txt +1 -0
- package/build/umd/diva-core.umd.min.js +6 -6
- package/build/umd/report.html +1 -1
- package/package.json +11 -12
- package/build/umd/272.diva-core.umd.min.js +0 -2
- package/build/umd/272.diva-core.umd.min.js.LICENSE.txt +0 -1
- package/build/umd/486.diva-core.umd.min.js.LICENSE.txt +0 -1
- package/build/umd/515.diva-core.umd.min.js +0 -2
- package/build/umd/515.diva-core.umd.min.js.LICENSE.txt +0 -1
- package/build/umd/558.diva-core.umd.min.js +0 -2
- package/build/umd/558.diva-core.umd.min.js.LICENSE.txt +0 -1
- package/build/umd/803.diva-core.umd.min.js.LICENSE.txt +0 -1
- package/build/umd/914.diva-core.umd.min.js.LICENSE.txt +0 -1
|
@@ -34,9 +34,8 @@ import axios from 'axios';
|
|
|
34
34
|
import { ProductHandlerAbstract } from '@crystaldesign/product-handler';
|
|
35
35
|
import classnames from 'classnames';
|
|
36
36
|
import _objectDestructuringEmpty from '@babel/runtime/helpers/objectDestructuringEmpty';
|
|
37
|
-
import {
|
|
37
|
+
import { SwipeableDrawer, Button, Snackbar, SnackbarContent, IconButton, Card, CardHeader, CardContent } from '@mui/material';
|
|
38
38
|
import { ContentBoxComponent } from '@crystaldesign/content-box';
|
|
39
|
-
import { Button, Snackbar, SnackbarContent, IconButton, Card, CardHeader, CardContent } from '@mui/material';
|
|
40
39
|
import { useTranslation as useTranslation$1, useDivaCore as useDivaCore$1 } from '@crystaldesign/diva-core';
|
|
41
40
|
import QRCode from 'react-qr-code';
|
|
42
41
|
import CloseIcon from '@mui/icons-material/Close';
|
|
@@ -46,7 +45,7 @@ import { actions } from '@storybook/addon-actions';
|
|
|
46
45
|
import * as Styles from '@mui/styles';
|
|
47
46
|
|
|
48
47
|
(function() {
|
|
49
|
-
const env = {"STAGE":"production","VERSION":"25.14.0-beta.
|
|
48
|
+
const env = {"STAGE":"production","VERSION":"25.14.0-beta.20"};
|
|
50
49
|
try {
|
|
51
50
|
if (process) {
|
|
52
51
|
process.env = Object.assign({}, process.env);
|
|
@@ -870,31 +869,31 @@ var ConfigurationStore = /*#__PURE__*/function () {
|
|
|
870
869
|
}, {
|
|
871
870
|
key: "theme",
|
|
872
871
|
get: function get() {
|
|
873
|
-
var _this$_configuration9, _this$root$dataStore$,
|
|
872
|
+
var _this$_configuration9, _this$root$dataStore$, _theme$palette, _theme$palette2, _theme$palette3, _theme$palette4, _theme$palette5, _theme$palette6, _theme$palette7, _theme$palette8, _theme$palette9, _theme$palette10, _theme$palette11, _theme$palette12, _theme$palette13, _theme$palette14, _theme$typography, _theme$components;
|
|
874
873
|
var theme = (_this$_configuration9 = this._configuration) === null || _this$_configuration9 === void 0 ? void 0 : _this$_configuration9.theme;
|
|
875
874
|
var orgTheme = (_this$root$dataStore$ = this.root.dataStore.organization) === null || _this$root$dataStore$ === void 0 || (_this$root$dataStore$ = _this$root$dataStore$.settings) === null || _this$root$dataStore$ === void 0 ? void 0 : _this$root$dataStore$.theme;
|
|
876
875
|
|
|
877
876
|
// Apply organization theme overrides if they exist
|
|
878
877
|
var palette = {
|
|
879
878
|
primary: {
|
|
880
|
-
main: (
|
|
881
|
-
light: (
|
|
882
|
-
dark: (
|
|
883
|
-
contrastText: (
|
|
879
|
+
main: (orgTheme === null || orgTheme === void 0 ? void 0 : orgTheme.main) || (theme === null || theme === void 0 || (_theme$palette = theme.palette) === null || _theme$palette === void 0 || (_theme$palette = _theme$palette.primary) === null || _theme$palette === void 0 ? void 0 : _theme$palette.main) || defaultTheme.palette.primary.main,
|
|
880
|
+
light: (orgTheme === null || orgTheme === void 0 ? void 0 : orgTheme.light) || (theme === null || theme === void 0 || (_theme$palette2 = theme.palette) === null || _theme$palette2 === void 0 || (_theme$palette2 = _theme$palette2.primary) === null || _theme$palette2 === void 0 ? void 0 : _theme$palette2.light) || defaultTheme.palette.primary.light,
|
|
881
|
+
dark: (orgTheme === null || orgTheme === void 0 ? void 0 : orgTheme.dark) || (theme === null || theme === void 0 || (_theme$palette3 = theme.palette) === null || _theme$palette3 === void 0 || (_theme$palette3 = _theme$palette3.primary) === null || _theme$palette3 === void 0 ? void 0 : _theme$palette3.dark) || defaultTheme.palette.primary.dark,
|
|
882
|
+
contrastText: (theme === null || theme === void 0 || (_theme$palette4 = theme.palette) === null || _theme$palette4 === void 0 || (_theme$palette4 = _theme$palette4.primary) === null || _theme$palette4 === void 0 ? void 0 : _theme$palette4.contrastText) || defaultTheme.palette.primary.contrastText
|
|
884
883
|
},
|
|
885
884
|
secondary: {
|
|
886
|
-
main: (
|
|
887
|
-
light: (
|
|
888
|
-
dark: (
|
|
889
|
-
contrastText: (
|
|
885
|
+
main: (theme === null || theme === void 0 || (_theme$palette5 = theme.palette) === null || _theme$palette5 === void 0 || (_theme$palette5 = _theme$palette5.secondary) === null || _theme$palette5 === void 0 ? void 0 : _theme$palette5.main) || (orgTheme === null || orgTheme === void 0 ? void 0 : orgTheme.main) || (theme === null || theme === void 0 || (_theme$palette6 = theme.palette) === null || _theme$palette6 === void 0 || (_theme$palette6 = _theme$palette6.primary) === null || _theme$palette6 === void 0 ? void 0 : _theme$palette6.main) || defaultTheme.palette.secondary.main,
|
|
886
|
+
light: (theme === null || theme === void 0 || (_theme$palette7 = theme.palette) === null || _theme$palette7 === void 0 || (_theme$palette7 = _theme$palette7.secondary) === null || _theme$palette7 === void 0 ? void 0 : _theme$palette7.light) || (orgTheme === null || orgTheme === void 0 ? void 0 : orgTheme.light) || (theme === null || theme === void 0 || (_theme$palette8 = theme.palette) === null || _theme$palette8 === void 0 || (_theme$palette8 = _theme$palette8.primary) === null || _theme$palette8 === void 0 ? void 0 : _theme$palette8.light) || defaultTheme.palette.secondary.light,
|
|
887
|
+
dark: (theme === null || theme === void 0 || (_theme$palette9 = theme.palette) === null || _theme$palette9 === void 0 || (_theme$palette9 = _theme$palette9.secondary) === null || _theme$palette9 === void 0 ? void 0 : _theme$palette9.dark) || (orgTheme === null || orgTheme === void 0 ? void 0 : orgTheme.dark) || (theme === null || theme === void 0 || (_theme$palette10 = theme.palette) === null || _theme$palette10 === void 0 || (_theme$palette10 = _theme$palette10.primary) === null || _theme$palette10 === void 0 ? void 0 : _theme$palette10.dark) || defaultTheme.palette.secondary.dark,
|
|
888
|
+
contrastText: (theme === null || theme === void 0 || (_theme$palette11 = theme.palette) === null || _theme$palette11 === void 0 || (_theme$palette11 = _theme$palette11.secondary) === null || _theme$palette11 === void 0 ? void 0 : _theme$palette11.contrastText) || (theme === null || theme === void 0 || (_theme$palette12 = theme.palette) === null || _theme$palette12 === void 0 || (_theme$palette12 = _theme$palette12.primary) === null || _theme$palette12 === void 0 ? void 0 : _theme$palette12.contrastText) || defaultTheme.palette.secondary.contrastText
|
|
890
889
|
},
|
|
891
890
|
text: {
|
|
892
|
-
primary: (
|
|
893
|
-
secondary: (
|
|
891
|
+
primary: (theme === null || theme === void 0 || (_theme$palette13 = theme.palette) === null || _theme$palette13 === void 0 || (_theme$palette13 = _theme$palette13.text) === null || _theme$palette13 === void 0 ? void 0 : _theme$palette13.primary) || defaultTheme.palette.text.primary,
|
|
892
|
+
secondary: (theme === null || theme === void 0 || (_theme$palette14 = theme.palette) === null || _theme$palette14 === void 0 || (_theme$palette14 = _theme$palette14.text) === null || _theme$palette14 === void 0 ? void 0 : _theme$palette14.secondary) || defaultTheme.palette.text.secondary
|
|
894
893
|
}
|
|
895
894
|
};
|
|
896
895
|
var typography = {
|
|
897
|
-
fontFamily: (
|
|
896
|
+
fontFamily: (theme === null || theme === void 0 || (_theme$typography = theme.typography) === null || _theme$typography === void 0 ? void 0 : _theme$typography.fontFamily) || defaultTheme.typography.fontFamily
|
|
898
897
|
};
|
|
899
898
|
var components = (_theme$components = theme === null || theme === void 0 ? void 0 : theme.components) !== null && _theme$components !== void 0 ? _theme$components : defaultTheme.components;
|
|
900
899
|
|
|
@@ -917,10 +916,10 @@ var ConfigurationStore = /*#__PURE__*/function () {
|
|
|
917
916
|
var root = document.documentElement;
|
|
918
917
|
|
|
919
918
|
// Apply custom variables without prefix
|
|
920
|
-
Object.entries(customCssVariables).forEach(function (
|
|
921
|
-
var
|
|
922
|
-
key =
|
|
923
|
-
value =
|
|
919
|
+
Object.entries(customCssVariables).forEach(function (_ref) {
|
|
920
|
+
var _ref2 = _slicedToArray(_ref, 2),
|
|
921
|
+
key = _ref2[0],
|
|
922
|
+
value = _ref2[1];
|
|
924
923
|
if (key && value) {
|
|
925
924
|
// Ensure variable name starts with --
|
|
926
925
|
var varName = key.startsWith('--') ? key : "--".concat(key);
|
|
@@ -1054,9 +1053,7 @@ var ConfigurationStore = /*#__PURE__*/function () {
|
|
|
1054
1053
|
}, {
|
|
1055
1054
|
key: "priceFormat",
|
|
1056
1055
|
get: function get() {
|
|
1057
|
-
var _this$root$dataStore$3,
|
|
1058
|
-
_this$_configuration55,
|
|
1059
|
-
_this = this;
|
|
1056
|
+
var _this$root$dataStore$3, _this$_configuration55;
|
|
1060
1057
|
var fallbackPriceFormat = {
|
|
1061
1058
|
currency: '€',
|
|
1062
1059
|
spacing: true,
|
|
@@ -1066,26 +1063,25 @@ var ConfigurationStore = /*#__PURE__*/function () {
|
|
|
1066
1063
|
decimalSeparator: ',',
|
|
1067
1064
|
decimalsDigits: 2
|
|
1068
1065
|
};
|
|
1069
|
-
(_this$root$dataStore$3 = this.root.dataStore.organization) === null || _this$root$dataStore$3 === void 0 || (_this$root$dataStore$3 = _this$root$dataStore$3.settings) === null || _this$root$dataStore$3 === void 0 ? void 0 : _this$root$dataStore$3.defaultCurrency;
|
|
1066
|
+
var currency = (_this$root$dataStore$3 = this.root.dataStore.organization) === null || _this$root$dataStore$3 === void 0 || (_this$root$dataStore$3 = _this$root$dataStore$3.settings) === null || _this$root$dataStore$3 === void 0 ? void 0 : _this$root$dataStore$3.defaultCurrency;
|
|
1070
1067
|
if ((_this$_configuration55 = this._configuration) !== null && _this$_configuration55 !== void 0 && _this$_configuration55.priceFormat) {
|
|
1071
1068
|
var _this$_configuration56;
|
|
1072
1069
|
if (Array.isArray((_this$_configuration56 = this._configuration) === null || _this$_configuration56 === void 0 ? void 0 : _this$_configuration56.priceFormat)) {
|
|
1073
1070
|
var _this$_configuration$6, _this$_configuration57;
|
|
1074
1071
|
return (_this$_configuration$6 = (_this$_configuration57 = this._configuration) === null || _this$_configuration57 === void 0 ? void 0 : _this$_configuration57.priceFormat.find(function (pf) {
|
|
1075
|
-
|
|
1076
|
-
return pf.currency === ((_this$root$dataStore$4 = _this.root.dataStore.organization) === null || _this$root$dataStore$4 === void 0 ? void 0 : _this$root$dataStore$4.settings.defaultCurrency);
|
|
1072
|
+
return pf.currency === currency;
|
|
1077
1073
|
})) !== null && _this$_configuration$6 !== void 0 ? _this$_configuration$6 : _objectSpread$d(_objectSpread$d({}, fallbackPriceFormat), {}, {
|
|
1078
|
-
currency:
|
|
1074
|
+
currency: currency
|
|
1079
1075
|
});
|
|
1080
1076
|
} else {
|
|
1081
|
-
var _this$_configuration58, _this$
|
|
1077
|
+
var _this$_configuration58, _this$_configuration59;
|
|
1082
1078
|
return _objectSpread$d(_objectSpread$d({}, (_this$_configuration58 = this._configuration) === null || _this$_configuration58 === void 0 ? void 0 : _this$_configuration58.priceFormat), {}, {
|
|
1083
|
-
currency:
|
|
1079
|
+
currency: currency !== null && currency !== void 0 ? currency : (_this$_configuration59 = this._configuration) === null || _this$_configuration59 === void 0 ? void 0 : _this$_configuration59.priceFormat.currency
|
|
1084
1080
|
});
|
|
1085
1081
|
}
|
|
1086
1082
|
} else {
|
|
1087
1083
|
return _objectSpread$d(_objectSpread$d({}, fallbackPriceFormat), {}, {
|
|
1088
|
-
currency:
|
|
1084
|
+
currency: currency
|
|
1089
1085
|
});
|
|
1090
1086
|
}
|
|
1091
1087
|
}
|
|
@@ -1112,12 +1108,12 @@ var ConfigurationStore = /*#__PURE__*/function () {
|
|
|
1112
1108
|
}, {
|
|
1113
1109
|
key: "fetchConfiguration",
|
|
1114
1110
|
value: function () {
|
|
1115
|
-
var _fetchConfiguration = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(
|
|
1116
|
-
var identifier, type, domain,
|
|
1111
|
+
var _fetchConfiguration = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(_ref3) {
|
|
1112
|
+
var identifier, type, domain, _ref3$organizationId, organizationId, configuration, types, settingsKeys, _i, _types, subType;
|
|
1117
1113
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
1118
1114
|
while (1) switch (_context.prev = _context.next) {
|
|
1119
1115
|
case 0:
|
|
1120
|
-
identifier =
|
|
1116
|
+
identifier = _ref3.identifier, type = _ref3.type, domain = _ref3.domain, _ref3$organizationId = _ref3.organizationId, organizationId = _ref3$organizationId === void 0 ? this.root.dataStore.organizationId : _ref3$organizationId;
|
|
1121
1117
|
LOG$d.debug("Fetching configuration for ".concat(type, " ").concat(identifier !== null && identifier !== void 0 ? identifier : '', " ").concat(domain !== null && domain !== void 0 ? domain : '', " ").concat(organizationId));
|
|
1122
1118
|
configuration = this.configurationCache.get(type + identifier + organizationId);
|
|
1123
1119
|
if (!configuration) {
|
|
@@ -8130,7 +8126,7 @@ var ClientArticleHandler = /*#__PURE__*/function () {
|
|
|
8130
8126
|
key: "saveProductsSMArticles",
|
|
8131
8127
|
value: function () {
|
|
8132
8128
|
var _saveProductsSMArticles = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(data, serverUrl, organizationId) {
|
|
8133
|
-
var fullUrl, response;
|
|
8129
|
+
var fullUrl, response, _ref, _errorData$message, errorData;
|
|
8134
8130
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
8135
8131
|
while (1) switch (_context.prev = _context.next) {
|
|
8136
8132
|
case 0:
|
|
@@ -8158,13 +8154,28 @@ var ClientArticleHandler = /*#__PURE__*/function () {
|
|
|
8158
8154
|
case 8:
|
|
8159
8155
|
return _context.abrupt("return", _context.sent);
|
|
8160
8156
|
case 9:
|
|
8161
|
-
_context.next =
|
|
8157
|
+
_context.next = 18;
|
|
8162
8158
|
break;
|
|
8163
8159
|
case 11:
|
|
8164
8160
|
_context.prev = 11;
|
|
8165
8161
|
_context.t0 = _context["catch"](1);
|
|
8166
|
-
|
|
8167
|
-
|
|
8162
|
+
if (!(axios.isAxiosError(_context.t0) && _context.t0.response)) {
|
|
8163
|
+
_context.next = 17;
|
|
8164
|
+
break;
|
|
8165
|
+
}
|
|
8166
|
+
if (!(_context.t0.response.status === 500)) {
|
|
8167
|
+
_context.next = 17;
|
|
8168
|
+
break;
|
|
8169
|
+
}
|
|
8170
|
+
errorData = _context.t0.response.data;
|
|
8171
|
+
throw new Error('PRODSM_0001:' + ((_ref = (_errorData$message = errorData === null || errorData === void 0 ? void 0 : errorData.message) !== null && _errorData$message !== void 0 ? _errorData$message : errorData === null || errorData === void 0 ? void 0 : errorData.error) !== null && _ref !== void 0 ? _ref : 'Unexpected error occurred during saveProductsSMArticles'), {
|
|
8172
|
+
cause: errorData
|
|
8173
|
+
});
|
|
8174
|
+
case 17:
|
|
8175
|
+
throw new Error('Unexpected error occurred during saveProductsSMArticles', {
|
|
8176
|
+
cause: _context.t0
|
|
8177
|
+
});
|
|
8178
|
+
case 18:
|
|
8168
8179
|
case "end":
|
|
8169
8180
|
return _context.stop();
|
|
8170
8181
|
}
|
|
@@ -9497,10 +9508,7 @@ var closeIcon = "close-icon-1kDyU";
|
|
|
9497
9508
|
var css_248z$4 = ".overlay-34l68 {\n height: 100%;\n width: 100%;\n display: flex;\n background-color: #fff;\n z-index: 999;\n justify-content: center;\n align-items: center;\n position: absolute;\n}\n\n.absolute-overlay-cG7uO {\n height: 100% !important;\n}\n\n.absolute-overlay-cG7uO {\n background-color: #fff;\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n overflow: hidden;\n z-index: 1000000;\n display: block;\n width: 100vw;\n}\n\n.diva-pseudo-fullscreen body {\n height: auto !important;\n}\n.diva-pseudo-fullscreen, .diva-pseudo-fullscreen body {\n overflow: hidden !important;\n}\n\n.close-icon-1kDyU {\n position: absolute;\n right: 32px;\n top: 32px;\n width: 50px;\n height: 40px;\n opacity: 0.3;\n z-index: 700;\n cursor: pointer;\n}\n\n.close-icon-1kDyU:before {\n transform: rotate(45deg);\n}\n\n.close-icon-1kDyU:after {\n transform: rotate(-45deg);\n}\n\n.close-icon-1kDyU:before,\n.close-icon-1kDyU:after {\n position: absolute;\n left: 23px;\n top: 5px;\n content: ' ';\n height: 33px;\n width: 3px;\n background-color: #4b4b4b;\n}\n\n.close-icon-1kDyU:hover {\n opacity: 0.8;\n transition: opacity 0.2s ease-in-out;\n}\n";
|
|
9498
9509
|
styleInject(css_248z$4);
|
|
9499
9510
|
|
|
9500
|
-
var
|
|
9501
|
-
var left = "left-SicAa";
|
|
9502
|
-
var right = "right-p1mpA";
|
|
9503
|
-
var handle = "handle-5tzN-";
|
|
9511
|
+
var drawerContent = "drawer-content-3-85N";
|
|
9504
9512
|
var overlay = "overlay-vhpU9";
|
|
9505
9513
|
var drawerHandleLine = "drawer-handle-line-65wJw";
|
|
9506
9514
|
var drawerHandle = "drawer-handle-zhmPW";
|
|
@@ -9509,39 +9517,224 @@ var drawerHeader = "drawer-header-FOHFa";
|
|
|
9509
9517
|
var scrollWrapper = "scroll-wrapper-f27j2";
|
|
9510
9518
|
var closeButton = "close-button-Tg2c5";
|
|
9511
9519
|
var bottom = "bottom-VZZjn";
|
|
9520
|
+
var left = "left-SicAa";
|
|
9521
|
+
var right = "right-p1mpA";
|
|
9512
9522
|
var top = "top-o1Wjp";
|
|
9513
9523
|
var bottomSpacer = "bottom-spacer-kdhiH";
|
|
9514
9524
|
var onSide = "on-side-JUQWn";
|
|
9515
|
-
var css_248z$3 = ".drawer-
|
|
9525
|
+
var css_248z$3 = ".drawer-content-3-85N {\n outline: medium none invert;\n outline: initial;\n position: absolute;\n z-index: 14000;\n pointer-events: auto;\n opacity: 1;\n overscroll-behavior: contain;\n backface-visibility: hidden;\n -webkit-backface-visibility: hidden;\n transform: translateZ(0);\n -webkit-transform: translateZ(0);\n /* Optimize for smooth swiping animations */\n contain: layout style paint;\n}\n.MuiDrawer-anchorRight.MuiDrawer-root.MuiDrawer-modal.MuiModal-root,\n.MuiDrawer-anchorLeft.MuiDrawer-root.MuiDrawer-modal.MuiModal-root {\n position: absolute;\n}\n\n/* Fix for mobile browser address bar showing/hiding */\n@supports (height: 100dvh) {\n .drawer-content-3-85N {\n max-height: 100dvh;\n }\n}\n\n.overlay-vhpU9 {\n background-color: rgba(0, 0, 0, 0.4);\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n opacity: 0;\n animation: fadeIn-W2rJo 0.3s ease-in forwards;\n z-index: 10000;\n}\n\n@keyframes fadeIn-W2rJo {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n.drawer-handle-line-65wJw {\n width: calc(36px);\n height: 4px;\n background-color: rgba(234, 234, 234, 0.9);\n border-radius: 2px;\n}\n\n.drawer-handle-zhmPW {\n position: absolute;\n left: 50%;\n transform: translate(-50%, -32px);\n width: 40px;\n height: 40px;\n touch-action: none;\n display: flex;\n align-items: center;\n justify-content: center;\n border-top-right-radius: 10px;\n border-top-left-radius: 10px;\n cursor: grab;\n user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n}\n\n.drawer-P-5-0 {\n display: flex;\n flex-direction: column;\n z-index: 20000;\n background-color: rgba(255, 255, 255, 0.95);\n overflow: hidden;\n flex: 1;\n min-height: 0;\n}\n\n.drawer-header-FOHFa {\n padding: 8px 32px;\n flex-shrink: 0;\n}\n\n.drawer-open #Diva-content-wrapper {\n overflow: visible !important;\n z-index: 3 !important;\n}\n\n.scroll-wrapper-f27j2 {\n overflow-y: auto;\n overflow-x: hidden;\n overscroll-behavior: contain;\n padding: 0px 32px;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n gap: 12px;\n flex: 1;\n min-height: 0;\n /* Smooth scrolling on iOS */\n -webkit-overflow-scrolling: touch;\n /* Prevent pull-to-refresh interference */\n touch-action: pan-y;\n}\n\n.close-button-Tg2c5 {\n position: absolute;\n top: 18px;\n right: 18px;\n width: 32px;\n height: 32px;\n background: center / 70% no-repeat url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2248%22 viewBox%3D%220 -960 960 960%22 width%3D%2248%22 fill%3D%22%23ccc%22%3E%3Cpath d%3D%22m249-207-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z%22%2F%3E%3C%2Fsvg%3E\");\n transition:\n border-color 0.2s ease-in,\n background-image 0.2s ease-in;\n cursor: pointer;\n z-index: 500;\n border: 1px solid transparent;\n border-radius: 50%;\n padding: 0px;\n}\n\n.close-button-Tg2c5:hover {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 height%3D%2248%22 viewBox%3D%220 -960 960 960%22 width%3D%2248%22 fill%3D%22%23aaa%22%3E%3Cpath d%3D%22m249-207-42-42 231-231-231-231 42-42 231 231 231-231 42 42-231 231 231 231-42 42-231-231-231 231Z%22%2F%3E%3C%2Fsvg%3E\");\n border: 1px solid #aaa;\n}\n\n.bottom-VZZjn {\n bottom: 0;\n left: 0;\n right: 0;\n}\n\n.left-SicAa {\n left: 0;\n bottom: 0;\n top: 0;\n}\n\n.right-p1mpA {\n right: 0;\n bottom: 0;\n top: 0;\n}\n\n.top-o1Wjp {\n top: 0;\n left: 0;\n right: 0;\n}\n\nhtml body[data-scroll-locked] {\n position: static !important;\n}\n\n.bottom-spacer-kdhiH {\n min-height: 12px;\n}\n\n.on-side-JUQWn {\n width: 100%;\n}\n";
|
|
9516
9526
|
styleInject(css_248z$3);
|
|
9517
9527
|
|
|
9528
|
+
var useSwipeToDismiss = function useSwipeToDismiss(direction, onDismiss) {
|
|
9529
|
+
var _useState = useState(false),
|
|
9530
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
9531
|
+
isDragging = _useState2[0],
|
|
9532
|
+
setIsDragging = _useState2[1];
|
|
9533
|
+
var _useState3 = useState(0),
|
|
9534
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
9535
|
+
dragOffset = _useState4[0],
|
|
9536
|
+
setDragOffset = _useState4[1];
|
|
9537
|
+
var wrapperRef = useRef(null);
|
|
9538
|
+
var startPos = useRef(null);
|
|
9539
|
+
var scrollAtBoundary = useRef(false);
|
|
9540
|
+
var startTime = useRef(0);
|
|
9541
|
+
var scrollableElement = useRef(null);
|
|
9542
|
+
var lastSwipeTime = useRef(0);
|
|
9543
|
+
var lastSwipeDistance = useRef(0);
|
|
9544
|
+
var hasConfirmedFastSwipe = useRef(false);
|
|
9545
|
+
var isVertical = direction === 'top' || direction === 'bottom';
|
|
9546
|
+
|
|
9547
|
+
// Velocity threshold: minimum pixels per second for a "fast swipe"
|
|
9548
|
+
// Lower thresholds for horizontal swipes as they're less common and more intentional
|
|
9549
|
+
var MIN_VELOCITY = isVertical ? 800 : 100; // 800px/s for vertical, 500px/s for horizontal
|
|
9550
|
+
var CONFIRMATION_DISTANCE = isVertical ? 150 : 15; // 150px for vertical, 100px for horizontal
|
|
9551
|
+
|
|
9552
|
+
var checkScrollBoundary = useCallback(function (element) {
|
|
9553
|
+
if (isVertical) {
|
|
9554
|
+
var scrollTop = element.scrollTop,
|
|
9555
|
+
scrollHeight = element.scrollHeight,
|
|
9556
|
+
clientHeight = element.clientHeight;
|
|
9557
|
+
if (direction === 'bottom') {
|
|
9558
|
+
// For bottom drawer, check if at top
|
|
9559
|
+
return scrollTop <= 1; // Small tolerance for floating point
|
|
9560
|
+
} else {
|
|
9561
|
+
// For top drawer, check if at bottom
|
|
9562
|
+
return scrollTop + clientHeight >= scrollHeight - 1;
|
|
9563
|
+
}
|
|
9564
|
+
} else {
|
|
9565
|
+
var scrollLeft = element.scrollLeft,
|
|
9566
|
+
scrollWidth = element.scrollWidth,
|
|
9567
|
+
clientWidth = element.clientWidth;
|
|
9568
|
+
if (direction === 'left') {
|
|
9569
|
+
// For left drawer, check if at left edge
|
|
9570
|
+
return scrollLeft <= 1;
|
|
9571
|
+
} else {
|
|
9572
|
+
// For right drawer, check if at right edge
|
|
9573
|
+
return scrollLeft + clientWidth >= scrollWidth - 1;
|
|
9574
|
+
}
|
|
9575
|
+
}
|
|
9576
|
+
}, [direction, isVertical]);
|
|
9577
|
+
var findScrollableParent = function findScrollableParent(element) {
|
|
9578
|
+
if (!element) return null;
|
|
9579
|
+
var isScrollable = function isScrollable(el) {
|
|
9580
|
+
var style = window.getComputedStyle(el);
|
|
9581
|
+
var overflowY = style.overflowY;
|
|
9582
|
+
var overflowX = style.overflowX;
|
|
9583
|
+
return isVertical && (overflowY === 'auto' || overflowY === 'scroll') || !isVertical && (overflowX === 'auto' || overflowX === 'scroll');
|
|
9584
|
+
};
|
|
9585
|
+
var current = element;
|
|
9586
|
+
while (current && current !== wrapperRef.current) {
|
|
9587
|
+
if (isScrollable(current)) {
|
|
9588
|
+
return current;
|
|
9589
|
+
}
|
|
9590
|
+
current = current.parentElement;
|
|
9591
|
+
}
|
|
9592
|
+
return wrapperRef.current;
|
|
9593
|
+
};
|
|
9594
|
+
var handleTouchStart = useCallback(function (e) {
|
|
9595
|
+
var target = e.target;
|
|
9596
|
+
|
|
9597
|
+
// Ignore swipe if touch starts on or within an element with diva-stop-swipe-detection
|
|
9598
|
+
if (target.closest('.diva-stop-swipe-detection')) {
|
|
9599
|
+
return;
|
|
9600
|
+
}
|
|
9601
|
+
var touch = e.touches[0];
|
|
9602
|
+
startPos.current = {
|
|
9603
|
+
x: touch.clientX,
|
|
9604
|
+
y: touch.clientY
|
|
9605
|
+
};
|
|
9606
|
+
startTime.current = Date.now();
|
|
9607
|
+
lastSwipeTime.current = Date.now();
|
|
9608
|
+
lastSwipeDistance.current = 0;
|
|
9609
|
+
hasConfirmedFastSwipe.current = false; // Reset confirmation
|
|
9610
|
+
setIsDragging(false);
|
|
9611
|
+
setDragOffset(0);
|
|
9612
|
+
|
|
9613
|
+
// Find scrollable element
|
|
9614
|
+
var element = findScrollableParent(target);
|
|
9615
|
+
scrollableElement.current = element;
|
|
9616
|
+
if (element) {
|
|
9617
|
+
scrollAtBoundary.current = checkScrollBoundary(element);
|
|
9618
|
+
} else {
|
|
9619
|
+
scrollAtBoundary.current = false;
|
|
9620
|
+
}
|
|
9621
|
+
}, [checkScrollBoundary]);
|
|
9622
|
+
var handleTouchMove = useCallback(function (e) {
|
|
9623
|
+
if (!startPos.current) return;
|
|
9624
|
+
var touch = e.touches[0];
|
|
9625
|
+
var deltaX = touch.clientX - startPos.current.x;
|
|
9626
|
+
var deltaY = touch.clientY - startPos.current.y;
|
|
9627
|
+
var currentTime = Date.now();
|
|
9628
|
+
|
|
9629
|
+
// Calculate current velocity
|
|
9630
|
+
var timeDelta = currentTime - lastSwipeTime.current;
|
|
9631
|
+
var currentDistance = isVertical ? Math.abs(deltaY) : Math.abs(deltaX);
|
|
9632
|
+
var distanceDelta = currentDistance - lastSwipeDistance.current;
|
|
9633
|
+
var velocity = timeDelta > 0 ? distanceDelta / timeDelta * 1000 : 0; // pixels per second
|
|
9634
|
+
|
|
9635
|
+
// Update tracking
|
|
9636
|
+
lastSwipeTime.current = currentTime;
|
|
9637
|
+
lastSwipeDistance.current = currentDistance;
|
|
9638
|
+
|
|
9639
|
+
// Determine if gesture is in dismiss direction
|
|
9640
|
+
var dismissDirection = false;
|
|
9641
|
+
var offset = 0;
|
|
9642
|
+
if (isVertical) {
|
|
9643
|
+
offset = deltaY;
|
|
9644
|
+
if (direction === 'bottom') {
|
|
9645
|
+
dismissDirection = deltaY > 0; // Swipe down
|
|
9646
|
+
} else {
|
|
9647
|
+
dismissDirection = deltaY < 0; // Swipe up
|
|
9648
|
+
}
|
|
9649
|
+
} else {
|
|
9650
|
+
offset = deltaX;
|
|
9651
|
+
if (direction === 'left') {
|
|
9652
|
+
dismissDirection = deltaX < 0; // Swipe left
|
|
9653
|
+
} else {
|
|
9654
|
+
dismissDirection = deltaX > 0; // Swipe right
|
|
9655
|
+
}
|
|
9656
|
+
}
|
|
9657
|
+
var absOffset = Math.abs(offset);
|
|
9658
|
+
var isFastSwipe = velocity > MIN_VELOCITY;
|
|
9659
|
+
var isMainlyVertical = Math.abs(deltaY) > Math.abs(deltaX) * 1.5;
|
|
9660
|
+
var isMainlyHorizontal = Math.abs(deltaX) > Math.abs(deltaY) * 1.5;
|
|
9661
|
+
var correctAxis = isVertical ? isMainlyVertical : isMainlyHorizontal;
|
|
9662
|
+
|
|
9663
|
+
// PESSIMISTIC: Only confirm fast swipe once we've traveled enough distance at high velocity
|
|
9664
|
+
if (!hasConfirmedFastSwipe.current && scrollAtBoundary.current && dismissDirection && correctAxis && isFastSwipe && absOffset > CONFIRMATION_DISTANCE) {
|
|
9665
|
+
hasConfirmedFastSwipe.current = true;
|
|
9666
|
+
}
|
|
9667
|
+
|
|
9668
|
+
// Only show visual feedback AFTER confirmation
|
|
9669
|
+
if (hasConfirmedFastSwipe.current && scrollAtBoundary.current && dismissDirection && correctAxis) {
|
|
9670
|
+
e.preventDefault();
|
|
9671
|
+
setIsDragging(true);
|
|
9672
|
+
// Visual feedback during fast swipe
|
|
9673
|
+
var resistance = Math.min(absOffset / 3, 100);
|
|
9674
|
+
setDragOffset(offset > 0 ? resistance : -resistance);
|
|
9675
|
+
} else if (isDragging) {
|
|
9676
|
+
// Reset if conditions no longer met
|
|
9677
|
+
setIsDragging(false);
|
|
9678
|
+
setDragOffset(0);
|
|
9679
|
+
}
|
|
9680
|
+
}, [direction, isVertical, isDragging]);
|
|
9681
|
+
var handleTouchEnd = useCallback(function () {
|
|
9682
|
+
if (!startPos.current) {
|
|
9683
|
+
setIsDragging(false);
|
|
9684
|
+
setDragOffset(0);
|
|
9685
|
+
return;
|
|
9686
|
+
}
|
|
9687
|
+
|
|
9688
|
+
// Calculate final velocity
|
|
9689
|
+
var duration = Date.now() - startTime.current;
|
|
9690
|
+
var totalDistance = lastSwipeDistance.current;
|
|
9691
|
+
var avgVelocity = duration > 0 ? totalDistance / duration * 1000 : 0; // pixels per second
|
|
9692
|
+
|
|
9693
|
+
// Dismiss only if it was confirmed as a fast swipe
|
|
9694
|
+
var wasFastSwipe = hasConfirmedFastSwipe.current && avgVelocity > MIN_VELOCITY * 0.7 && scrollAtBoundary.current;
|
|
9695
|
+
if (wasFastSwipe) {
|
|
9696
|
+
onDismiss();
|
|
9697
|
+
}
|
|
9698
|
+
|
|
9699
|
+
// Reset state
|
|
9700
|
+
setIsDragging(false);
|
|
9701
|
+
setDragOffset(0);
|
|
9702
|
+
startPos.current = null;
|
|
9703
|
+
scrollAtBoundary.current = false;
|
|
9704
|
+
lastSwipeDistance.current = 0;
|
|
9705
|
+
lastSwipeTime.current = 0;
|
|
9706
|
+
hasConfirmedFastSwipe.current = false;
|
|
9707
|
+
}, [onDismiss]);
|
|
9708
|
+
return {
|
|
9709
|
+
isDragging: isDragging,
|
|
9710
|
+
dragOffset: dragOffset,
|
|
9711
|
+
handleTouchStart: handleTouchStart,
|
|
9712
|
+
handleTouchMove: handleTouchMove,
|
|
9713
|
+
handleTouchEnd: handleTouchEnd,
|
|
9714
|
+
wrapperRef: wrapperRef
|
|
9715
|
+
};
|
|
9716
|
+
};
|
|
9717
|
+
|
|
9518
9718
|
function ownKeys$5(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; }
|
|
9519
9719
|
function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
9520
|
-
var
|
|
9521
|
-
var _contentStore$drawerM
|
|
9720
|
+
var DrawerMenu = function DrawerMenu(_ref) {
|
|
9721
|
+
var _contentStore$drawerM;
|
|
9522
9722
|
_objectDestructuringEmpty(_ref);
|
|
9523
9723
|
var _useDivaCoreContext = useDivaCoreContext(),
|
|
9524
9724
|
contentStore = _useDivaCoreContext.contentStore;
|
|
9525
|
-
var _useState = useState(0),
|
|
9526
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
9527
|
-
activeSnapPoint = _useState2[0],
|
|
9528
|
-
_setActiveSnapPoint = _useState2[1];
|
|
9529
9725
|
var useMove = useMemo(function () {
|
|
9530
9726
|
return function (ev) {
|
|
9531
9727
|
return ev.preventDefault();
|
|
9532
9728
|
};
|
|
9533
9729
|
}, []);
|
|
9534
|
-
var
|
|
9535
|
-
var _ref2 = (_contentStore$drawerM = contentStore.drawerMenu) !== null && _contentStore$drawerM !== void 0 ? _contentStore$drawerM : {},
|
|
9730
|
+
var _ref2 = (_contentStore$drawerM = contentStore === null || contentStore === void 0 ? void 0 : contentStore.drawerMenu) !== null && _contentStore$drawerM !== void 0 ? _contentStore$drawerM : {},
|
|
9536
9731
|
showOverlay = _ref2.showOverlay,
|
|
9537
|
-
|
|
9538
|
-
mountElementId = _ref2$mountElementId === void 0 ? 'DivaCore' : _ref2$mountElementId,
|
|
9732
|
+
mountElement = _ref2.mountElement,
|
|
9539
9733
|
onClose = _ref2.onClose,
|
|
9540
9734
|
open = _ref2.open,
|
|
9541
9735
|
_ref2$direction = _ref2.direction,
|
|
9542
9736
|
direction = _ref2$direction === void 0 ? 'bottom' : _ref2$direction,
|
|
9543
9737
|
title = _ref2.title,
|
|
9544
|
-
snapPoints = _ref2.snapPoints,
|
|
9545
9738
|
noModal = _ref2.noModal,
|
|
9546
9739
|
handleInternScroll = _ref2.handleInternScroll,
|
|
9547
9740
|
hideCloseButton = _ref2.hideCloseButton,
|
|
@@ -9549,7 +9742,12 @@ var MobileDrawer = function MobileDrawer(_ref) {
|
|
|
9549
9742
|
backgroundColor = _ref2.backgroundColor,
|
|
9550
9743
|
drawerStyle = _ref2.drawerStyle,
|
|
9551
9744
|
wrapperStyle = _ref2.wrapperStyle;
|
|
9745
|
+
var _useState = useState(open !== null && open !== void 0 ? open : false),
|
|
9746
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
9747
|
+
isOpen = _useState2[0],
|
|
9748
|
+
setIsOpen = _useState2[1];
|
|
9552
9749
|
useEffect(function () {
|
|
9750
|
+
setIsOpen(open !== null && open !== void 0 ? open : false);
|
|
9553
9751
|
//when drawer is open, prevent swipe to refresh the page on android
|
|
9554
9752
|
if (open) {
|
|
9555
9753
|
window.addEventListener('touchmove', useMove, {
|
|
@@ -9564,102 +9762,130 @@ var MobileDrawer = function MobileDrawer(_ref) {
|
|
|
9564
9762
|
window.removeEventListener('touchmove', useMove);
|
|
9565
9763
|
if (!noModal) document.body.classList.remove('drawer-open');
|
|
9566
9764
|
};
|
|
9567
|
-
}, [
|
|
9568
|
-
if (!contentStore.drawerMenu) return /*#__PURE__*/jsx(Fragment, {});
|
|
9569
|
-
var mountElement = mountElementId ? document.getElementById(mountElementId) : undefined;
|
|
9570
|
-
if (!mountElement) {
|
|
9571
|
-
return /*#__PURE__*/jsx(Fragment, {});
|
|
9572
|
-
}
|
|
9765
|
+
}, [open]);
|
|
9573
9766
|
var close = function close() {
|
|
9574
|
-
|
|
9767
|
+
setIsOpen(false);
|
|
9575
9768
|
//delay the state changes so the animation of the drawer is not interrupted
|
|
9576
9769
|
setTimeout(function () {
|
|
9577
9770
|
onClose === null || onClose === void 0 || onClose();
|
|
9578
9771
|
}, 400);
|
|
9579
9772
|
};
|
|
9580
|
-
var
|
|
9581
|
-
|
|
9582
|
-
|
|
9583
|
-
|
|
9584
|
-
|
|
9585
|
-
|
|
9586
|
-
|
|
9587
|
-
|
|
9588
|
-
|
|
9589
|
-
|
|
9590
|
-
|
|
9591
|
-
|
|
9592
|
-
|
|
9593
|
-
|
|
9594
|
-
|
|
9595
|
-
|
|
9773
|
+
var anchor = direction === 'left' ? 'left' : direction === 'right' ? 'right' : direction === 'top' ? 'top' : 'bottom';
|
|
9774
|
+
var isVertical = ['bottom', 'top'].includes(direction);
|
|
9775
|
+
var maxWidth = !isVertical ? 400 : undefined;
|
|
9776
|
+
|
|
9777
|
+
// Swipe to dismiss functionality
|
|
9778
|
+
var _useSwipeToDismiss = useSwipeToDismiss(direction, close),
|
|
9779
|
+
isDragging = _useSwipeToDismiss.isDragging,
|
|
9780
|
+
dragOffset = _useSwipeToDismiss.dragOffset,
|
|
9781
|
+
handleTouchStart = _useSwipeToDismiss.handleTouchStart,
|
|
9782
|
+
handleTouchMove = _useSwipeToDismiss.handleTouchMove,
|
|
9783
|
+
handleTouchEnd = _useSwipeToDismiss.handleTouchEnd,
|
|
9784
|
+
wrapperRef = _useSwipeToDismiss.wrapperRef;
|
|
9785
|
+
var iOS = typeof navigator !== 'undefined' && /iPad|iPhone|iPod/.test(navigator.userAgent);
|
|
9786
|
+
if (!(contentStore !== null && contentStore !== void 0 && contentStore.drawerMenu)) return /*#__PURE__*/jsx(Fragment, {});
|
|
9787
|
+
return /*#__PURE__*/jsxs(SwipeableDrawer, {
|
|
9788
|
+
anchor: anchor,
|
|
9789
|
+
open: !!isOpen,
|
|
9596
9790
|
onClose: close,
|
|
9597
|
-
|
|
9598
|
-
|
|
9599
|
-
|
|
9600
|
-
|
|
9791
|
+
disableBackdropTransition: !iOS,
|
|
9792
|
+
disableDiscovery: iOS,
|
|
9793
|
+
hideBackdrop: !showOverlay,
|
|
9794
|
+
onOpen: function onOpen() {},
|
|
9795
|
+
disableSwipeToOpen: true,
|
|
9796
|
+
container: mountElement,
|
|
9797
|
+
variant: 'temporary',
|
|
9798
|
+
ModalProps: {
|
|
9799
|
+
keepMounted: true,
|
|
9800
|
+
style: _objectSpread$5(_objectSpread$5({}, noModal ? {
|
|
9801
|
+
pointerEvents: 'none'
|
|
9802
|
+
} : undefined), (drawerStyle === null || drawerStyle === void 0 ? void 0 : drawerStyle.zIndex) !== undefined ? {
|
|
9803
|
+
zIndex: drawerStyle.zIndex
|
|
9804
|
+
} : undefined),
|
|
9805
|
+
disableEnforceFocus: !showOverlay,
|
|
9806
|
+
// Allow focus outside drawer when no overlay
|
|
9807
|
+
disableAutoFocus: !showOverlay // Don't auto-focus drawer content when no overlay
|
|
9601
9808
|
},
|
|
9602
|
-
|
|
9603
|
-
|
|
9604
|
-
|
|
9605
|
-
|
|
9606
|
-
|
|
9607
|
-
|
|
9608
|
-
|
|
9609
|
-
|
|
9610
|
-
|
|
9809
|
+
slotProps: _objectSpread$5(_objectSpread$5({}, showOverlay ? {
|
|
9810
|
+
backdrop: {
|
|
9811
|
+
className: overlay,
|
|
9812
|
+
style: {
|
|
9813
|
+
position: 'absolute'
|
|
9814
|
+
}
|
|
9815
|
+
}
|
|
9816
|
+
} : {}), {}, {
|
|
9817
|
+
paper: {
|
|
9818
|
+
className: classnames(drawerContent, direction === 'bottom' ? bottom : direction === 'left' ? left : direction === 'right' ? right : direction === 'top' ? top : undefined),
|
|
9611
9819
|
style: _objectSpread$5({
|
|
9612
|
-
height:
|
|
9613
|
-
maxHeight:
|
|
9614
|
-
maxWidth: maxWidth
|
|
9820
|
+
height: isVertical ? 'auto' : '100%',
|
|
9821
|
+
maxHeight: isVertical ? '85%' : undefined,
|
|
9822
|
+
maxWidth: maxWidth,
|
|
9823
|
+
position: 'absolute',
|
|
9824
|
+
borderTopRightRadius: ['bottom', 'left'].includes(direction) ? '10px' : '0px',
|
|
9825
|
+
borderTopLeftRadius: ['bottom', 'right'].includes(direction) ? '10px' : '0px',
|
|
9826
|
+
borderBottomRightRadius: ['top', 'right'].includes(direction) ? '10px' : '0px',
|
|
9827
|
+
borderBottomLeftRadius: ['top', 'left'].includes(direction) ? '10px' : '0px',
|
|
9828
|
+
display: 'flex',
|
|
9829
|
+
flexDirection: 'column',
|
|
9830
|
+
transform: isDragging ? "translate".concat(isVertical ? 'Y' : 'X', "(").concat(dragOffset, "px)") : undefined,
|
|
9831
|
+
transition: isDragging ? 'none' : 'transform 0.3s cubic-bezier(0.4, 0.0, 0.2, 1)',
|
|
9832
|
+
willChange: isDragging ? 'transform' : 'auto'
|
|
9615
9833
|
}, drawerStyle),
|
|
9616
|
-
|
|
9617
|
-
|
|
9618
|
-
|
|
9619
|
-
|
|
9620
|
-
|
|
9621
|
-
|
|
9622
|
-
|
|
9623
|
-
|
|
9624
|
-
|
|
9625
|
-
|
|
9626
|
-
|
|
9627
|
-
|
|
9628
|
-
|
|
9629
|
-
|
|
9630
|
-
|
|
9631
|
-
|
|
9632
|
-
|
|
9633
|
-
|
|
9634
|
-
|
|
9635
|
-
|
|
9636
|
-
|
|
9637
|
-
|
|
9638
|
-
|
|
9639
|
-
|
|
9640
|
-
|
|
9641
|
-
|
|
9642
|
-
|
|
9643
|
-
|
|
9644
|
-
|
|
9645
|
-
|
|
9646
|
-
|
|
9647
|
-
className: classnames(scrollWrapper),
|
|
9648
|
-
children: [content, /*#__PURE__*/jsx("div", {
|
|
9649
|
-
className: bottomSpacer
|
|
9650
|
-
})]
|
|
9651
|
-
}) : content]
|
|
9834
|
+
elevation: 0
|
|
9835
|
+
}
|
|
9836
|
+
}),
|
|
9837
|
+
children: [isVertical && /*#__PURE__*/jsx("div", {
|
|
9838
|
+
className: drawerHandle,
|
|
9839
|
+
children: /*#__PURE__*/jsx("div", {
|
|
9840
|
+
className: drawerHandleLine
|
|
9841
|
+
})
|
|
9842
|
+
}), title !== undefined && /*#__PURE__*/jsx("div", {
|
|
9843
|
+
className: classnames(drawerHeader),
|
|
9844
|
+
children: title
|
|
9845
|
+
}), /*#__PURE__*/jsxs("div", {
|
|
9846
|
+
className: classnames(drawer, !isVertical ? onSide : undefined),
|
|
9847
|
+
onTouchMove: function onTouchMove(e) {
|
|
9848
|
+
if (!e.target.closest('.diva-stop-swipe-detection')) e.stopPropagation();
|
|
9849
|
+
},
|
|
9850
|
+
style: _objectSpread$5({
|
|
9851
|
+
maxWidth: maxWidth,
|
|
9852
|
+
backgroundColor: backgroundColor
|
|
9853
|
+
}, wrapperStyle),
|
|
9854
|
+
children: [!hideCloseButton && /*#__PURE__*/jsx("button", {
|
|
9855
|
+
className: closeButton,
|
|
9856
|
+
onClick: close
|
|
9857
|
+
}), !handleInternScroll ? /*#__PURE__*/jsxs("div", {
|
|
9858
|
+
ref: wrapperRef,
|
|
9859
|
+
className: classnames(scrollWrapper),
|
|
9860
|
+
onTouchStart: handleTouchStart,
|
|
9861
|
+
onTouchMove: handleTouchMove,
|
|
9862
|
+
onTouchEnd: handleTouchEnd,
|
|
9863
|
+
children: [content, /*#__PURE__*/jsx("div", {
|
|
9864
|
+
className: bottomSpacer
|
|
9652
9865
|
})]
|
|
9866
|
+
}) : /*#__PURE__*/jsx("div", {
|
|
9867
|
+
ref: wrapperRef,
|
|
9868
|
+
style: {
|
|
9869
|
+
flex: 1,
|
|
9870
|
+
minHeight: 0,
|
|
9871
|
+
overflow: 'hidden',
|
|
9872
|
+
display: 'flex',
|
|
9873
|
+
flexDirection: 'column'
|
|
9874
|
+
},
|
|
9875
|
+
onTouchStart: handleTouchStart,
|
|
9876
|
+
onTouchMove: handleTouchMove,
|
|
9877
|
+
onTouchEnd: handleTouchEnd,
|
|
9878
|
+
children: content
|
|
9653
9879
|
})]
|
|
9654
|
-
})
|
|
9880
|
+
})]
|
|
9655
9881
|
});
|
|
9656
9882
|
};
|
|
9657
|
-
var DrawerMenu = observer(
|
|
9883
|
+
var DrawerMenu$1 = observer(DrawerMenu);
|
|
9658
9884
|
|
|
9659
9885
|
function ownKeys$4(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; }
|
|
9660
9886
|
function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
9661
9887
|
var LazyModals$1 = /*#__PURE__*/React.lazy(function () {
|
|
9662
|
-
return import('./ModalsWrapper-
|
|
9888
|
+
return import('./ModalsWrapper-8792921c.js');
|
|
9663
9889
|
});
|
|
9664
9890
|
function Fullscreen(_ref) {
|
|
9665
9891
|
var inAbsoluteFullscreen = _ref.inAbsoluteFullscreen;
|
|
@@ -9755,7 +9981,7 @@ function Fullscreen(_ref) {
|
|
|
9755
9981
|
style: isMobile ? (_c$state$absoluteFull = c.state.absoluteFullscreenStyle) === null || _c$state$absoluteFull === void 0 ? void 0 : _c$state$absoluteFull.mobile : (_c$state$absoluteFull2 = c.state.absoluteFullscreenStyle) === null || _c$state$absoluteFull2 === void 0 ? void 0 : _c$state$absoluteFull2.desktop,
|
|
9756
9982
|
children: [/*#__PURE__*/jsx(Fullscreen, {
|
|
9757
9983
|
inAbsoluteFullscreen: true
|
|
9758
|
-
}), /*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(DrawerMenu, {}), configurationStore.enableModals && /*#__PURE__*/jsx(LazyModals$1, {}), /*#__PURE__*/jsx(Suspense, {
|
|
9984
|
+
}), /*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(DrawerMenu$1, {}), configurationStore.enableModals && /*#__PURE__*/jsx(LazyModals$1, {}), /*#__PURE__*/jsx(Suspense, {
|
|
9759
9985
|
fallback: /*#__PURE__*/jsx(Fallback, {}),
|
|
9760
9986
|
children: /*#__PURE__*/jsx(C, _objectSpread$4({}, c.state))
|
|
9761
9987
|
})]
|
|
@@ -9768,7 +9994,7 @@ function Fullscreen(_ref) {
|
|
|
9768
9994
|
style: {
|
|
9769
9995
|
zIndex: contentStore.fullscreen.overwrittenZIndex
|
|
9770
9996
|
},
|
|
9771
|
-
children: [!contentStore.fullscreen.hideSpinner && /*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(DrawerMenu, {}), configurationStore.enableModals && /*#__PURE__*/jsx(LazyModals$1, {}), !contentStore.fullscreen.hideClose && /*#__PURE__*/jsx("div", {
|
|
9997
|
+
children: [!contentStore.fullscreen.hideSpinner && /*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(DrawerMenu$1, {}), configurationStore.enableModals && /*#__PURE__*/jsx(LazyModals$1, {}), !contentStore.fullscreen.hideClose && /*#__PURE__*/jsx("div", {
|
|
9772
9998
|
className: closeIcon,
|
|
9773
9999
|
onClick: onClose,
|
|
9774
10000
|
"data-test-id": "closeFullscreenBtn",
|
|
@@ -10119,10 +10345,10 @@ function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymb
|
|
|
10119
10345
|
function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
10120
10346
|
var LOG$2 = getLogger('Framework', 'Root');
|
|
10121
10347
|
var LazyAuth = /*#__PURE__*/React.lazy(function () {
|
|
10122
|
-
return import('./index-
|
|
10348
|
+
return import('./index-60e32e6e.js');
|
|
10123
10349
|
});
|
|
10124
10350
|
var LazyModals = /*#__PURE__*/React.lazy(function () {
|
|
10125
|
-
return import('./ModalsWrapper-
|
|
10351
|
+
return import('./ModalsWrapper-8792921c.js');
|
|
10126
10352
|
});
|
|
10127
10353
|
function ContentComponent() {
|
|
10128
10354
|
var context = useDivaCoreContext();
|
|
@@ -10133,7 +10359,7 @@ function ContentComponent() {
|
|
|
10133
10359
|
children: [/*#__PURE__*/jsxs(Suspense, {
|
|
10134
10360
|
fallback: /*#__PURE__*/jsx(Fragment, {}),
|
|
10135
10361
|
children: [context.configurationStore.hasAuthentication && /*#__PURE__*/jsx(LazyAuth, {}), context.configurationStore.enableModals && !context.contentStore.fullscreen && !context.contentStore.isFullscreenComponentDefined && /*#__PURE__*/jsx(LazyModals, {})]
|
|
10136
|
-
}), /*#__PURE__*/jsx(Banner$1, {}), /*#__PURE__*/jsx(Fullscreen$1, {}), /*#__PURE__*/jsx(SnackBar, {}), !context.contentStore.isFullscreenComponentDefined && /*#__PURE__*/jsx(DrawerMenu, {}), /*#__PURE__*/jsxs("div", {
|
|
10362
|
+
}), /*#__PURE__*/jsx(Banner$1, {}), /*#__PURE__*/jsx(Fullscreen$1, {}), /*#__PURE__*/jsx(SnackBar, {}), !context.contentStore.isFullscreenComponentDefined && /*#__PURE__*/jsx(DrawerMenu$1, {}), /*#__PURE__*/jsxs("div", {
|
|
10137
10363
|
style: {
|
|
10138
10364
|
position: 'relative',
|
|
10139
10365
|
width: '100%',
|
|
@@ -11103,4 +11329,4 @@ LOG.startTransaction({
|
|
|
11103
11329
|
});
|
|
11104
11330
|
window.DIVA_VERSION = "v".concat(process.env.VERSION);
|
|
11105
11331
|
|
|
11106
|
-
export { AuthorizationHandler as A, Content as C,
|
|
11332
|
+
export { AuthorizationHandler as A, Content as C, DrawerMenu$1 as D, HelpButton as H, ONE_DAY_UNIX as O, ProductHandler as P, RequestStatus as R, SupportHandler as S, useDivaCore as a, DivaCore as b, AnalyticsHandler as c, OrganizationHandler as d, ClientArticleHandler as e, DivaMockProvider as f, getLogger as g, storyBookCoreMock as h, styleInject as s, useDivaCoreContext as u };
|