@crystaldesign/diva-core 25.14.0-beta.3 → 25.14.0-beta.30
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-5e4b10f0.js → ModalsWrapper-848a6a76.js} +1 -2
- package/build/esm/{index-fa63a2bc.js → index-2f48abbe.js} +1 -2
- package/build/esm/{index-dc543253.js → index-93edd96b.js} +367 -138
- 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 -2
- 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/types/core/src/store/LoadingAndErrorStore.d.ts.map +1 -1
- package/build/types/core/src/store/RootStore.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.30"};
|
|
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) {
|
|
@@ -3670,6 +3666,7 @@ var _default = /*#__PURE__*/function () {
|
|
|
3670
3666
|
}, {
|
|
3671
3667
|
key: "isLoading",
|
|
3672
3668
|
get: function get() {
|
|
3669
|
+
LOG$8.debug("isLoading: ".concat(this.loading.size, " [").concat(Array.from(this.loading.keys()).join(', '), "]"));
|
|
3673
3670
|
return this.loading.size != 0;
|
|
3674
3671
|
}
|
|
3675
3672
|
}, {
|
|
@@ -8130,7 +8127,7 @@ var ClientArticleHandler = /*#__PURE__*/function () {
|
|
|
8130
8127
|
key: "saveProductsSMArticles",
|
|
8131
8128
|
value: function () {
|
|
8132
8129
|
var _saveProductsSMArticles = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(data, serverUrl, organizationId) {
|
|
8133
|
-
var fullUrl, response;
|
|
8130
|
+
var fullUrl, response, _ref, _errorData$message, errorData;
|
|
8134
8131
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
8135
8132
|
while (1) switch (_context.prev = _context.next) {
|
|
8136
8133
|
case 0:
|
|
@@ -8158,13 +8155,28 @@ var ClientArticleHandler = /*#__PURE__*/function () {
|
|
|
8158
8155
|
case 8:
|
|
8159
8156
|
return _context.abrupt("return", _context.sent);
|
|
8160
8157
|
case 9:
|
|
8161
|
-
_context.next =
|
|
8158
|
+
_context.next = 18;
|
|
8162
8159
|
break;
|
|
8163
8160
|
case 11:
|
|
8164
8161
|
_context.prev = 11;
|
|
8165
8162
|
_context.t0 = _context["catch"](1);
|
|
8166
|
-
|
|
8167
|
-
|
|
8163
|
+
if (!(axios.isAxiosError(_context.t0) && _context.t0.response)) {
|
|
8164
|
+
_context.next = 17;
|
|
8165
|
+
break;
|
|
8166
|
+
}
|
|
8167
|
+
if (!(_context.t0.response.status === 500)) {
|
|
8168
|
+
_context.next = 17;
|
|
8169
|
+
break;
|
|
8170
|
+
}
|
|
8171
|
+
errorData = _context.t0.response.data;
|
|
8172
|
+
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'), {
|
|
8173
|
+
cause: errorData
|
|
8174
|
+
});
|
|
8175
|
+
case 17:
|
|
8176
|
+
throw new Error('Unexpected error occurred during saveProductsSMArticles', {
|
|
8177
|
+
cause: _context.t0
|
|
8178
|
+
});
|
|
8179
|
+
case 18:
|
|
8168
8180
|
case "end":
|
|
8169
8181
|
return _context.stop();
|
|
8170
8182
|
}
|
|
@@ -8829,7 +8841,9 @@ var RootStore = /*#__PURE__*/function () {
|
|
|
8829
8841
|
});
|
|
8830
8842
|
case 91:
|
|
8831
8843
|
_context.prev = 91;
|
|
8832
|
-
|
|
8844
|
+
setTimeout(function () {
|
|
8845
|
+
_this4.loadingAndErrorStore.toggleLoading('initalize');
|
|
8846
|
+
}, 50);
|
|
8833
8847
|
runInAction(function () {
|
|
8834
8848
|
_this4._initializing = false;
|
|
8835
8849
|
});
|
|
@@ -9497,10 +9511,7 @@ var closeIcon = "close-icon-1kDyU";
|
|
|
9497
9511
|
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
9512
|
styleInject(css_248z$4);
|
|
9499
9513
|
|
|
9500
|
-
var
|
|
9501
|
-
var left = "left-SicAa";
|
|
9502
|
-
var right = "right-p1mpA";
|
|
9503
|
-
var handle = "handle-5tzN-";
|
|
9514
|
+
var drawerContent = "drawer-content-3-85N";
|
|
9504
9515
|
var overlay = "overlay-vhpU9";
|
|
9505
9516
|
var drawerHandleLine = "drawer-handle-line-65wJw";
|
|
9506
9517
|
var drawerHandle = "drawer-handle-zhmPW";
|
|
@@ -9509,39 +9520,224 @@ var drawerHeader = "drawer-header-FOHFa";
|
|
|
9509
9520
|
var scrollWrapper = "scroll-wrapper-f27j2";
|
|
9510
9521
|
var closeButton = "close-button-Tg2c5";
|
|
9511
9522
|
var bottom = "bottom-VZZjn";
|
|
9523
|
+
var left = "left-SicAa";
|
|
9524
|
+
var right = "right-p1mpA";
|
|
9512
9525
|
var top = "top-o1Wjp";
|
|
9513
9526
|
var bottomSpacer = "bottom-spacer-kdhiH";
|
|
9514
9527
|
var onSide = "on-side-JUQWn";
|
|
9515
|
-
var css_248z$3 = ".drawer-
|
|
9528
|
+
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
9529
|
styleInject(css_248z$3);
|
|
9517
9530
|
|
|
9531
|
+
var useSwipeToDismiss = function useSwipeToDismiss(direction, onDismiss) {
|
|
9532
|
+
var _useState = useState(false),
|
|
9533
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
9534
|
+
isDragging = _useState2[0],
|
|
9535
|
+
setIsDragging = _useState2[1];
|
|
9536
|
+
var _useState3 = useState(0),
|
|
9537
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
9538
|
+
dragOffset = _useState4[0],
|
|
9539
|
+
setDragOffset = _useState4[1];
|
|
9540
|
+
var wrapperRef = useRef(null);
|
|
9541
|
+
var startPos = useRef(null);
|
|
9542
|
+
var scrollAtBoundary = useRef(false);
|
|
9543
|
+
var startTime = useRef(0);
|
|
9544
|
+
var scrollableElement = useRef(null);
|
|
9545
|
+
var lastSwipeTime = useRef(0);
|
|
9546
|
+
var lastSwipeDistance = useRef(0);
|
|
9547
|
+
var hasConfirmedFastSwipe = useRef(false);
|
|
9548
|
+
var isVertical = direction === 'top' || direction === 'bottom';
|
|
9549
|
+
|
|
9550
|
+
// Velocity threshold: minimum pixels per second for a "fast swipe"
|
|
9551
|
+
// Lower thresholds for horizontal swipes as they're less common and more intentional
|
|
9552
|
+
var MIN_VELOCITY = isVertical ? 800 : 100; // 800px/s for vertical, 500px/s for horizontal
|
|
9553
|
+
var CONFIRMATION_DISTANCE = isVertical ? 150 : 15; // 150px for vertical, 100px for horizontal
|
|
9554
|
+
|
|
9555
|
+
var checkScrollBoundary = useCallback(function (element) {
|
|
9556
|
+
if (isVertical) {
|
|
9557
|
+
var scrollTop = element.scrollTop,
|
|
9558
|
+
scrollHeight = element.scrollHeight,
|
|
9559
|
+
clientHeight = element.clientHeight;
|
|
9560
|
+
if (direction === 'bottom') {
|
|
9561
|
+
// For bottom drawer, check if at top
|
|
9562
|
+
return scrollTop <= 1; // Small tolerance for floating point
|
|
9563
|
+
} else {
|
|
9564
|
+
// For top drawer, check if at bottom
|
|
9565
|
+
return scrollTop + clientHeight >= scrollHeight - 1;
|
|
9566
|
+
}
|
|
9567
|
+
} else {
|
|
9568
|
+
var scrollLeft = element.scrollLeft,
|
|
9569
|
+
scrollWidth = element.scrollWidth,
|
|
9570
|
+
clientWidth = element.clientWidth;
|
|
9571
|
+
if (direction === 'left') {
|
|
9572
|
+
// For left drawer, check if at left edge
|
|
9573
|
+
return scrollLeft <= 1;
|
|
9574
|
+
} else {
|
|
9575
|
+
// For right drawer, check if at right edge
|
|
9576
|
+
return scrollLeft + clientWidth >= scrollWidth - 1;
|
|
9577
|
+
}
|
|
9578
|
+
}
|
|
9579
|
+
}, [direction, isVertical]);
|
|
9580
|
+
var findScrollableParent = function findScrollableParent(element) {
|
|
9581
|
+
if (!element) return null;
|
|
9582
|
+
var isScrollable = function isScrollable(el) {
|
|
9583
|
+
var style = window.getComputedStyle(el);
|
|
9584
|
+
var overflowY = style.overflowY;
|
|
9585
|
+
var overflowX = style.overflowX;
|
|
9586
|
+
return isVertical && (overflowY === 'auto' || overflowY === 'scroll') || !isVertical && (overflowX === 'auto' || overflowX === 'scroll');
|
|
9587
|
+
};
|
|
9588
|
+
var current = element;
|
|
9589
|
+
while (current && current !== wrapperRef.current) {
|
|
9590
|
+
if (isScrollable(current)) {
|
|
9591
|
+
return current;
|
|
9592
|
+
}
|
|
9593
|
+
current = current.parentElement;
|
|
9594
|
+
}
|
|
9595
|
+
return wrapperRef.current;
|
|
9596
|
+
};
|
|
9597
|
+
var handleTouchStart = useCallback(function (e) {
|
|
9598
|
+
var target = e.target;
|
|
9599
|
+
|
|
9600
|
+
// Ignore swipe if touch starts on or within an element with diva-stop-swipe-detection
|
|
9601
|
+
if (target.closest('.diva-stop-swipe-detection')) {
|
|
9602
|
+
return;
|
|
9603
|
+
}
|
|
9604
|
+
var touch = e.touches[0];
|
|
9605
|
+
startPos.current = {
|
|
9606
|
+
x: touch.clientX,
|
|
9607
|
+
y: touch.clientY
|
|
9608
|
+
};
|
|
9609
|
+
startTime.current = Date.now();
|
|
9610
|
+
lastSwipeTime.current = Date.now();
|
|
9611
|
+
lastSwipeDistance.current = 0;
|
|
9612
|
+
hasConfirmedFastSwipe.current = false; // Reset confirmation
|
|
9613
|
+
setIsDragging(false);
|
|
9614
|
+
setDragOffset(0);
|
|
9615
|
+
|
|
9616
|
+
// Find scrollable element
|
|
9617
|
+
var element = findScrollableParent(target);
|
|
9618
|
+
scrollableElement.current = element;
|
|
9619
|
+
if (element) {
|
|
9620
|
+
scrollAtBoundary.current = checkScrollBoundary(element);
|
|
9621
|
+
} else {
|
|
9622
|
+
scrollAtBoundary.current = false;
|
|
9623
|
+
}
|
|
9624
|
+
}, [checkScrollBoundary]);
|
|
9625
|
+
var handleTouchMove = useCallback(function (e) {
|
|
9626
|
+
if (!startPos.current) return;
|
|
9627
|
+
var touch = e.touches[0];
|
|
9628
|
+
var deltaX = touch.clientX - startPos.current.x;
|
|
9629
|
+
var deltaY = touch.clientY - startPos.current.y;
|
|
9630
|
+
var currentTime = Date.now();
|
|
9631
|
+
|
|
9632
|
+
// Calculate current velocity
|
|
9633
|
+
var timeDelta = currentTime - lastSwipeTime.current;
|
|
9634
|
+
var currentDistance = isVertical ? Math.abs(deltaY) : Math.abs(deltaX);
|
|
9635
|
+
var distanceDelta = currentDistance - lastSwipeDistance.current;
|
|
9636
|
+
var velocity = timeDelta > 0 ? distanceDelta / timeDelta * 1000 : 0; // pixels per second
|
|
9637
|
+
|
|
9638
|
+
// Update tracking
|
|
9639
|
+
lastSwipeTime.current = currentTime;
|
|
9640
|
+
lastSwipeDistance.current = currentDistance;
|
|
9641
|
+
|
|
9642
|
+
// Determine if gesture is in dismiss direction
|
|
9643
|
+
var dismissDirection = false;
|
|
9644
|
+
var offset = 0;
|
|
9645
|
+
if (isVertical) {
|
|
9646
|
+
offset = deltaY;
|
|
9647
|
+
if (direction === 'bottom') {
|
|
9648
|
+
dismissDirection = deltaY > 0; // Swipe down
|
|
9649
|
+
} else {
|
|
9650
|
+
dismissDirection = deltaY < 0; // Swipe up
|
|
9651
|
+
}
|
|
9652
|
+
} else {
|
|
9653
|
+
offset = deltaX;
|
|
9654
|
+
if (direction === 'left') {
|
|
9655
|
+
dismissDirection = deltaX < 0; // Swipe left
|
|
9656
|
+
} else {
|
|
9657
|
+
dismissDirection = deltaX > 0; // Swipe right
|
|
9658
|
+
}
|
|
9659
|
+
}
|
|
9660
|
+
var absOffset = Math.abs(offset);
|
|
9661
|
+
var isFastSwipe = velocity > MIN_VELOCITY;
|
|
9662
|
+
var isMainlyVertical = Math.abs(deltaY) > Math.abs(deltaX) * 1.5;
|
|
9663
|
+
var isMainlyHorizontal = Math.abs(deltaX) > Math.abs(deltaY) * 1.5;
|
|
9664
|
+
var correctAxis = isVertical ? isMainlyVertical : isMainlyHorizontal;
|
|
9665
|
+
|
|
9666
|
+
// PESSIMISTIC: Only confirm fast swipe once we've traveled enough distance at high velocity
|
|
9667
|
+
if (!hasConfirmedFastSwipe.current && scrollAtBoundary.current && dismissDirection && correctAxis && isFastSwipe && absOffset > CONFIRMATION_DISTANCE) {
|
|
9668
|
+
hasConfirmedFastSwipe.current = true;
|
|
9669
|
+
}
|
|
9670
|
+
|
|
9671
|
+
// Only show visual feedback AFTER confirmation
|
|
9672
|
+
if (hasConfirmedFastSwipe.current && scrollAtBoundary.current && dismissDirection && correctAxis) {
|
|
9673
|
+
e.preventDefault();
|
|
9674
|
+
setIsDragging(true);
|
|
9675
|
+
// Visual feedback during fast swipe
|
|
9676
|
+
var resistance = Math.min(absOffset / 3, 100);
|
|
9677
|
+
setDragOffset(offset > 0 ? resistance : -resistance);
|
|
9678
|
+
} else if (isDragging) {
|
|
9679
|
+
// Reset if conditions no longer met
|
|
9680
|
+
setIsDragging(false);
|
|
9681
|
+
setDragOffset(0);
|
|
9682
|
+
}
|
|
9683
|
+
}, [direction, isVertical, isDragging]);
|
|
9684
|
+
var handleTouchEnd = useCallback(function () {
|
|
9685
|
+
if (!startPos.current) {
|
|
9686
|
+
setIsDragging(false);
|
|
9687
|
+
setDragOffset(0);
|
|
9688
|
+
return;
|
|
9689
|
+
}
|
|
9690
|
+
|
|
9691
|
+
// Calculate final velocity
|
|
9692
|
+
var duration = Date.now() - startTime.current;
|
|
9693
|
+
var totalDistance = lastSwipeDistance.current;
|
|
9694
|
+
var avgVelocity = duration > 0 ? totalDistance / duration * 1000 : 0; // pixels per second
|
|
9695
|
+
|
|
9696
|
+
// Dismiss only if it was confirmed as a fast swipe
|
|
9697
|
+
var wasFastSwipe = hasConfirmedFastSwipe.current && avgVelocity > MIN_VELOCITY * 0.7 && scrollAtBoundary.current;
|
|
9698
|
+
if (wasFastSwipe) {
|
|
9699
|
+
onDismiss();
|
|
9700
|
+
}
|
|
9701
|
+
|
|
9702
|
+
// Reset state
|
|
9703
|
+
setIsDragging(false);
|
|
9704
|
+
setDragOffset(0);
|
|
9705
|
+
startPos.current = null;
|
|
9706
|
+
scrollAtBoundary.current = false;
|
|
9707
|
+
lastSwipeDistance.current = 0;
|
|
9708
|
+
lastSwipeTime.current = 0;
|
|
9709
|
+
hasConfirmedFastSwipe.current = false;
|
|
9710
|
+
}, [onDismiss]);
|
|
9711
|
+
return {
|
|
9712
|
+
isDragging: isDragging,
|
|
9713
|
+
dragOffset: dragOffset,
|
|
9714
|
+
handleTouchStart: handleTouchStart,
|
|
9715
|
+
handleTouchMove: handleTouchMove,
|
|
9716
|
+
handleTouchEnd: handleTouchEnd,
|
|
9717
|
+
wrapperRef: wrapperRef
|
|
9718
|
+
};
|
|
9719
|
+
};
|
|
9720
|
+
|
|
9518
9721
|
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
9722
|
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
|
|
9723
|
+
var DrawerMenu = function DrawerMenu(_ref) {
|
|
9724
|
+
var _contentStore$drawerM;
|
|
9522
9725
|
_objectDestructuringEmpty(_ref);
|
|
9523
9726
|
var _useDivaCoreContext = useDivaCoreContext(),
|
|
9524
9727
|
contentStore = _useDivaCoreContext.contentStore;
|
|
9525
|
-
var _useState = useState(0),
|
|
9526
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
9527
|
-
activeSnapPoint = _useState2[0],
|
|
9528
|
-
_setActiveSnapPoint = _useState2[1];
|
|
9529
9728
|
var useMove = useMemo(function () {
|
|
9530
9729
|
return function (ev) {
|
|
9531
9730
|
return ev.preventDefault();
|
|
9532
9731
|
};
|
|
9533
9732
|
}, []);
|
|
9534
|
-
var
|
|
9535
|
-
var _ref2 = (_contentStore$drawerM = contentStore.drawerMenu) !== null && _contentStore$drawerM !== void 0 ? _contentStore$drawerM : {},
|
|
9733
|
+
var _ref2 = (_contentStore$drawerM = contentStore === null || contentStore === void 0 ? void 0 : contentStore.drawerMenu) !== null && _contentStore$drawerM !== void 0 ? _contentStore$drawerM : {},
|
|
9536
9734
|
showOverlay = _ref2.showOverlay,
|
|
9537
|
-
|
|
9538
|
-
mountElementId = _ref2$mountElementId === void 0 ? 'DivaCore' : _ref2$mountElementId,
|
|
9735
|
+
mountElement = _ref2.mountElement,
|
|
9539
9736
|
onClose = _ref2.onClose,
|
|
9540
9737
|
open = _ref2.open,
|
|
9541
9738
|
_ref2$direction = _ref2.direction,
|
|
9542
9739
|
direction = _ref2$direction === void 0 ? 'bottom' : _ref2$direction,
|
|
9543
9740
|
title = _ref2.title,
|
|
9544
|
-
snapPoints = _ref2.snapPoints,
|
|
9545
9741
|
noModal = _ref2.noModal,
|
|
9546
9742
|
handleInternScroll = _ref2.handleInternScroll,
|
|
9547
9743
|
hideCloseButton = _ref2.hideCloseButton,
|
|
@@ -9549,7 +9745,12 @@ var MobileDrawer = function MobileDrawer(_ref) {
|
|
|
9549
9745
|
backgroundColor = _ref2.backgroundColor,
|
|
9550
9746
|
drawerStyle = _ref2.drawerStyle,
|
|
9551
9747
|
wrapperStyle = _ref2.wrapperStyle;
|
|
9748
|
+
var _useState = useState(open !== null && open !== void 0 ? open : false),
|
|
9749
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
9750
|
+
isOpen = _useState2[0],
|
|
9751
|
+
setIsOpen = _useState2[1];
|
|
9552
9752
|
useEffect(function () {
|
|
9753
|
+
setIsOpen(open !== null && open !== void 0 ? open : false);
|
|
9553
9754
|
//when drawer is open, prevent swipe to refresh the page on android
|
|
9554
9755
|
if (open) {
|
|
9555
9756
|
window.addEventListener('touchmove', useMove, {
|
|
@@ -9564,102 +9765,130 @@ var MobileDrawer = function MobileDrawer(_ref) {
|
|
|
9564
9765
|
window.removeEventListener('touchmove', useMove);
|
|
9565
9766
|
if (!noModal) document.body.classList.remove('drawer-open');
|
|
9566
9767
|
};
|
|
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
|
-
}
|
|
9768
|
+
}, [open]);
|
|
9573
9769
|
var close = function close() {
|
|
9574
|
-
|
|
9770
|
+
setIsOpen(false);
|
|
9575
9771
|
//delay the state changes so the animation of the drawer is not interrupted
|
|
9576
9772
|
setTimeout(function () {
|
|
9577
9773
|
onClose === null || onClose === void 0 || onClose();
|
|
9578
9774
|
}, 400);
|
|
9579
9775
|
};
|
|
9580
|
-
var
|
|
9581
|
-
|
|
9582
|
-
|
|
9583
|
-
|
|
9584
|
-
|
|
9585
|
-
|
|
9586
|
-
|
|
9587
|
-
|
|
9588
|
-
|
|
9589
|
-
|
|
9590
|
-
|
|
9591
|
-
|
|
9592
|
-
|
|
9593
|
-
|
|
9594
|
-
|
|
9595
|
-
|
|
9776
|
+
var anchor = direction === 'left' ? 'left' : direction === 'right' ? 'right' : direction === 'top' ? 'top' : 'bottom';
|
|
9777
|
+
var isVertical = ['bottom', 'top'].includes(direction);
|
|
9778
|
+
var maxWidth = !isVertical ? 400 : undefined;
|
|
9779
|
+
|
|
9780
|
+
// Swipe to dismiss functionality
|
|
9781
|
+
var _useSwipeToDismiss = useSwipeToDismiss(direction, close),
|
|
9782
|
+
isDragging = _useSwipeToDismiss.isDragging,
|
|
9783
|
+
dragOffset = _useSwipeToDismiss.dragOffset,
|
|
9784
|
+
handleTouchStart = _useSwipeToDismiss.handleTouchStart,
|
|
9785
|
+
handleTouchMove = _useSwipeToDismiss.handleTouchMove,
|
|
9786
|
+
handleTouchEnd = _useSwipeToDismiss.handleTouchEnd,
|
|
9787
|
+
wrapperRef = _useSwipeToDismiss.wrapperRef;
|
|
9788
|
+
var iOS = typeof navigator !== 'undefined' && /iPad|iPhone|iPod/.test(navigator.userAgent);
|
|
9789
|
+
if (!(contentStore !== null && contentStore !== void 0 && contentStore.drawerMenu)) return /*#__PURE__*/jsx(Fragment, {});
|
|
9790
|
+
return /*#__PURE__*/jsxs(SwipeableDrawer, {
|
|
9791
|
+
anchor: anchor,
|
|
9792
|
+
open: !!isOpen,
|
|
9596
9793
|
onClose: close,
|
|
9597
|
-
|
|
9598
|
-
|
|
9599
|
-
|
|
9600
|
-
|
|
9794
|
+
disableBackdropTransition: !iOS,
|
|
9795
|
+
disableDiscovery: iOS,
|
|
9796
|
+
hideBackdrop: !showOverlay,
|
|
9797
|
+
onOpen: function onOpen() {},
|
|
9798
|
+
disableSwipeToOpen: true,
|
|
9799
|
+
container: mountElement,
|
|
9800
|
+
variant: 'temporary',
|
|
9801
|
+
ModalProps: {
|
|
9802
|
+
keepMounted: true,
|
|
9803
|
+
style: _objectSpread$5(_objectSpread$5({}, noModal ? {
|
|
9804
|
+
pointerEvents: 'none'
|
|
9805
|
+
} : undefined), (drawerStyle === null || drawerStyle === void 0 ? void 0 : drawerStyle.zIndex) !== undefined ? {
|
|
9806
|
+
zIndex: drawerStyle.zIndex
|
|
9807
|
+
} : undefined),
|
|
9808
|
+
disableEnforceFocus: !showOverlay,
|
|
9809
|
+
// Allow focus outside drawer when no overlay
|
|
9810
|
+
disableAutoFocus: !showOverlay // Don't auto-focus drawer content when no overlay
|
|
9601
9811
|
},
|
|
9602
|
-
|
|
9603
|
-
|
|
9604
|
-
|
|
9605
|
-
|
|
9606
|
-
|
|
9607
|
-
|
|
9608
|
-
|
|
9609
|
-
|
|
9610
|
-
|
|
9812
|
+
slotProps: _objectSpread$5(_objectSpread$5({}, showOverlay ? {
|
|
9813
|
+
backdrop: {
|
|
9814
|
+
className: overlay,
|
|
9815
|
+
style: {
|
|
9816
|
+
position: 'absolute'
|
|
9817
|
+
}
|
|
9818
|
+
}
|
|
9819
|
+
} : {}), {}, {
|
|
9820
|
+
paper: {
|
|
9821
|
+
className: classnames(drawerContent, direction === 'bottom' ? bottom : direction === 'left' ? left : direction === 'right' ? right : direction === 'top' ? top : undefined),
|
|
9611
9822
|
style: _objectSpread$5({
|
|
9612
|
-
height:
|
|
9613
|
-
maxHeight:
|
|
9614
|
-
maxWidth: maxWidth
|
|
9823
|
+
height: isVertical ? 'auto' : '100%',
|
|
9824
|
+
maxHeight: isVertical ? '85%' : undefined,
|
|
9825
|
+
maxWidth: maxWidth,
|
|
9826
|
+
position: 'absolute',
|
|
9827
|
+
borderTopRightRadius: ['bottom', 'left'].includes(direction) ? '10px' : '0px',
|
|
9828
|
+
borderTopLeftRadius: ['bottom', 'right'].includes(direction) ? '10px' : '0px',
|
|
9829
|
+
borderBottomRightRadius: ['top', 'right'].includes(direction) ? '10px' : '0px',
|
|
9830
|
+
borderBottomLeftRadius: ['top', 'left'].includes(direction) ? '10px' : '0px',
|
|
9831
|
+
display: 'flex',
|
|
9832
|
+
flexDirection: 'column',
|
|
9833
|
+
transform: isDragging ? "translate".concat(isVertical ? 'Y' : 'X', "(").concat(dragOffset, "px)") : undefined,
|
|
9834
|
+
transition: isDragging ? 'none' : 'transform 0.3s cubic-bezier(0.4, 0.0, 0.2, 1)',
|
|
9835
|
+
willChange: isDragging ? 'transform' : 'auto'
|
|
9615
9836
|
}, 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]
|
|
9837
|
+
elevation: 0
|
|
9838
|
+
}
|
|
9839
|
+
}),
|
|
9840
|
+
children: [isVertical && /*#__PURE__*/jsx("div", {
|
|
9841
|
+
className: drawerHandle,
|
|
9842
|
+
children: /*#__PURE__*/jsx("div", {
|
|
9843
|
+
className: drawerHandleLine
|
|
9844
|
+
})
|
|
9845
|
+
}), title !== undefined && /*#__PURE__*/jsx("div", {
|
|
9846
|
+
className: classnames(drawerHeader),
|
|
9847
|
+
children: title
|
|
9848
|
+
}), /*#__PURE__*/jsxs("div", {
|
|
9849
|
+
className: classnames(drawer, !isVertical ? onSide : undefined),
|
|
9850
|
+
onTouchMove: function onTouchMove(e) {
|
|
9851
|
+
if (!e.target.closest('.diva-stop-swipe-detection')) e.stopPropagation();
|
|
9852
|
+
},
|
|
9853
|
+
style: _objectSpread$5({
|
|
9854
|
+
maxWidth: maxWidth,
|
|
9855
|
+
backgroundColor: backgroundColor
|
|
9856
|
+
}, wrapperStyle),
|
|
9857
|
+
children: [!hideCloseButton && /*#__PURE__*/jsx("button", {
|
|
9858
|
+
className: closeButton,
|
|
9859
|
+
onClick: close
|
|
9860
|
+
}), !handleInternScroll ? /*#__PURE__*/jsxs("div", {
|
|
9861
|
+
ref: wrapperRef,
|
|
9862
|
+
className: classnames(scrollWrapper),
|
|
9863
|
+
onTouchStart: handleTouchStart,
|
|
9864
|
+
onTouchMove: handleTouchMove,
|
|
9865
|
+
onTouchEnd: handleTouchEnd,
|
|
9866
|
+
children: [content, /*#__PURE__*/jsx("div", {
|
|
9867
|
+
className: bottomSpacer
|
|
9652
9868
|
})]
|
|
9869
|
+
}) : /*#__PURE__*/jsx("div", {
|
|
9870
|
+
ref: wrapperRef,
|
|
9871
|
+
style: {
|
|
9872
|
+
flex: 1,
|
|
9873
|
+
minHeight: 0,
|
|
9874
|
+
overflow: 'hidden',
|
|
9875
|
+
display: 'flex',
|
|
9876
|
+
flexDirection: 'column'
|
|
9877
|
+
},
|
|
9878
|
+
onTouchStart: handleTouchStart,
|
|
9879
|
+
onTouchMove: handleTouchMove,
|
|
9880
|
+
onTouchEnd: handleTouchEnd,
|
|
9881
|
+
children: content
|
|
9653
9882
|
})]
|
|
9654
|
-
})
|
|
9883
|
+
})]
|
|
9655
9884
|
});
|
|
9656
9885
|
};
|
|
9657
|
-
var DrawerMenu = observer(
|
|
9886
|
+
var DrawerMenu$1 = observer(DrawerMenu);
|
|
9658
9887
|
|
|
9659
9888
|
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
9889
|
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
9890
|
var LazyModals$1 = /*#__PURE__*/React.lazy(function () {
|
|
9662
|
-
return import('./ModalsWrapper-
|
|
9891
|
+
return import('./ModalsWrapper-848a6a76.js');
|
|
9663
9892
|
});
|
|
9664
9893
|
function Fullscreen(_ref) {
|
|
9665
9894
|
var inAbsoluteFullscreen = _ref.inAbsoluteFullscreen;
|
|
@@ -9755,7 +9984,7 @@ function Fullscreen(_ref) {
|
|
|
9755
9984
|
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
9985
|
children: [/*#__PURE__*/jsx(Fullscreen, {
|
|
9757
9986
|
inAbsoluteFullscreen: true
|
|
9758
|
-
}), /*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(DrawerMenu, {}), configurationStore.enableModals && /*#__PURE__*/jsx(LazyModals$1, {}), /*#__PURE__*/jsx(Suspense, {
|
|
9987
|
+
}), /*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(DrawerMenu$1, {}), configurationStore.enableModals && /*#__PURE__*/jsx(LazyModals$1, {}), /*#__PURE__*/jsx(Suspense, {
|
|
9759
9988
|
fallback: /*#__PURE__*/jsx(Fallback, {}),
|
|
9760
9989
|
children: /*#__PURE__*/jsx(C, _objectSpread$4({}, c.state))
|
|
9761
9990
|
})]
|
|
@@ -9768,7 +9997,7 @@ function Fullscreen(_ref) {
|
|
|
9768
9997
|
style: {
|
|
9769
9998
|
zIndex: contentStore.fullscreen.overwrittenZIndex
|
|
9770
9999
|
},
|
|
9771
|
-
children: [
|
|
10000
|
+
children: [/*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(DrawerMenu$1, {}), configurationStore.enableModals && /*#__PURE__*/jsx(LazyModals$1, {}), !contentStore.fullscreen.hideClose && /*#__PURE__*/jsx("div", {
|
|
9772
10001
|
className: closeIcon,
|
|
9773
10002
|
onClick: onClose,
|
|
9774
10003
|
"data-test-id": "closeFullscreenBtn",
|
|
@@ -10119,10 +10348,10 @@ function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymb
|
|
|
10119
10348
|
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
10349
|
var LOG$2 = getLogger('Framework', 'Root');
|
|
10121
10350
|
var LazyAuth = /*#__PURE__*/React.lazy(function () {
|
|
10122
|
-
return import('./index-
|
|
10351
|
+
return import('./index-2f48abbe.js');
|
|
10123
10352
|
});
|
|
10124
10353
|
var LazyModals = /*#__PURE__*/React.lazy(function () {
|
|
10125
|
-
return import('./ModalsWrapper-
|
|
10354
|
+
return import('./ModalsWrapper-848a6a76.js');
|
|
10126
10355
|
});
|
|
10127
10356
|
function ContentComponent() {
|
|
10128
10357
|
var context = useDivaCoreContext();
|
|
@@ -10133,7 +10362,7 @@ function ContentComponent() {
|
|
|
10133
10362
|
children: [/*#__PURE__*/jsxs(Suspense, {
|
|
10134
10363
|
fallback: /*#__PURE__*/jsx(Fragment, {}),
|
|
10135
10364
|
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", {
|
|
10365
|
+
}), /*#__PURE__*/jsx(Banner$1, {}), /*#__PURE__*/jsx(Fullscreen$1, {}), /*#__PURE__*/jsx(SnackBar, {}), !context.contentStore.isFullscreenComponentDefined && /*#__PURE__*/jsx(DrawerMenu$1, {}), /*#__PURE__*/jsxs("div", {
|
|
10137
10366
|
style: {
|
|
10138
10367
|
position: 'relative',
|
|
10139
10368
|
width: '100%',
|
|
@@ -10142,7 +10371,7 @@ function ContentComponent() {
|
|
|
10142
10371
|
overflow: 'auto'
|
|
10143
10372
|
},
|
|
10144
10373
|
id: "Diva-content-wrapper",
|
|
10145
|
-
children: [/*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(ErrorDisplay$1, {}), context.contentStore.components.map(function (c) {
|
|
10374
|
+
children: [!context.contentStore.isFullscreenComponentDefined && !context.contentStore.fullscreen && /*#__PURE__*/jsx(Spinner$1, {}), /*#__PURE__*/jsx(ErrorDisplay$1, {}), context.contentStore.components.map(function (c) {
|
|
10146
10375
|
var C = c.component;
|
|
10147
10376
|
return /*#__PURE__*/jsx("div", {
|
|
10148
10377
|
hidden: !context.contentStore.isVisible(c.name),
|
|
@@ -11103,4 +11332,4 @@ LOG.startTransaction({
|
|
|
11103
11332
|
});
|
|
11104
11333
|
window.DIVA_VERSION = "v".concat(process.env.VERSION);
|
|
11105
11334
|
|
|
11106
|
-
export { AuthorizationHandler as A, Content as C,
|
|
11335
|
+
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 };
|