@redneckz/wildless-cms-uni-blocks 0.14.256 → 0.14.258
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/bundle/bundle.umd.js +3 -3
- package/bundle/bundle.umd.min.js +1 -1
- package/bundle/components/StickyBottomMenu/StickyBottomMenuBurger.d.ts +2 -1
- package/bundle/components/StickyBottomMenu/useBurgerMenuDialog.d.ts +3 -0
- package/bundle/ui-kit/DialogManager/Dialog.d.ts +2 -0
- package/dist/components/StickyBottomMenu/ActiveSubMenuItem.js +1 -1
- package/dist/components/StickyBottomMenu/ActiveSubMenuItem.js.map +1 -1
- package/dist/components/StickyBottomMenu/BurgerMenuDialog.js +8 -3
- package/dist/components/StickyBottomMenu/BurgerMenuDialog.js.map +1 -1
- package/dist/components/StickyBottomMenu/StickyBottomMenu.mobile.js +26 -29
- package/dist/components/StickyBottomMenu/StickyBottomMenu.mobile.js.map +1 -1
- package/dist/components/StickyBottomMenu/StickyBottomMenuBurger.d.ts +2 -1
- package/dist/components/StickyBottomMenu/StickyBottomMenuBurger.js.map +1 -1
- package/dist/components/StickyBottomMenu/useBurgerMenuDialog.d.ts +3 -0
- package/dist/components/StickyBottomMenu/useBurgerMenuDialog.js +1 -1
- package/dist/components/StickyBottomMenu/useBurgerMenuDialog.js.map +1 -1
- package/dist/ui-kit/DialogManager/Dialog.d.ts +2 -0
- package/dist/ui-kit/DialogManager/Dialog.js +2 -2
- package/dist/ui-kit/DialogManager/Dialog.js.map +1 -1
- package/lib/common.css +1 -1
- package/lib/components/StickyBottomMenu/ActiveSubMenuItem.js +1 -1
- package/lib/components/StickyBottomMenu/ActiveSubMenuItem.js.map +1 -1
- package/lib/components/StickyBottomMenu/BurgerMenuDialog.js +8 -3
- package/lib/components/StickyBottomMenu/BurgerMenuDialog.js.map +1 -1
- package/lib/components/StickyBottomMenu/StickyBottomMenu.mobile.js +26 -29
- package/lib/components/StickyBottomMenu/StickyBottomMenu.mobile.js.map +1 -1
- package/lib/components/StickyBottomMenu/StickyBottomMenuBurger.d.ts +2 -1
- package/lib/components/StickyBottomMenu/StickyBottomMenuBurger.js.map +1 -1
- package/lib/components/StickyBottomMenu/useBurgerMenuDialog.d.ts +3 -0
- package/lib/components/StickyBottomMenu/useBurgerMenuDialog.js +1 -1
- package/lib/components/StickyBottomMenu/useBurgerMenuDialog.js.map +1 -1
- package/lib/ui-kit/DialogManager/Dialog.d.ts +2 -0
- package/lib/ui-kit/DialogManager/Dialog.js +2 -2
- package/lib/ui-kit/DialogManager/Dialog.js.map +1 -1
- package/lib/ui-kit/LocationDialog/renderForeignOffices.d.ts +0 -1
- package/lib/ui-kit/LocationDialog/renderRegion.d.ts +0 -1
- package/lib/ui-kit/LocationDialog/renderRegionGroup.d.ts +0 -1
- package/mobile/bundle/bundle.umd.js +162 -39
- package/mobile/bundle/bundle.umd.min.js +1 -1
- package/mobile/bundle/components/StickyBottomMenu/StickyBottomMenuBurger.d.ts +2 -1
- package/mobile/bundle/components/StickyBottomMenu/useBurgerMenuDialog.d.ts +3 -0
- package/mobile/bundle/ui-kit/DialogManager/Dialog.d.ts +2 -0
- package/mobile/dist/components/StickyBottomMenu/ActiveSubMenuItem.js +1 -1
- package/mobile/dist/components/StickyBottomMenu/ActiveSubMenuItem.js.map +1 -1
- package/mobile/dist/components/StickyBottomMenu/BurgerMenuDialog.js +8 -3
- package/mobile/dist/components/StickyBottomMenu/BurgerMenuDialog.js.map +1 -1
- package/mobile/dist/components/StickyBottomMenu/StickyBottomMenu.js +26 -29
- package/mobile/dist/components/StickyBottomMenu/StickyBottomMenu.js.map +1 -1
- package/mobile/dist/components/StickyBottomMenu/StickyBottomMenuBurger.d.ts +2 -1
- package/mobile/dist/components/StickyBottomMenu/StickyBottomMenuBurger.js.map +1 -1
- package/mobile/dist/components/StickyBottomMenu/useBurgerMenuDialog.d.ts +3 -0
- package/mobile/dist/components/StickyBottomMenu/useBurgerMenuDialog.js +1 -1
- package/mobile/dist/components/StickyBottomMenu/useBurgerMenuDialog.js.map +1 -1
- package/mobile/dist/ui-kit/DialogManager/Dialog.d.ts +2 -0
- package/mobile/dist/ui-kit/DialogManager/Dialog.js +2 -2
- package/mobile/dist/ui-kit/DialogManager/Dialog.js.map +1 -1
- package/mobile/lib/common.css +1 -1
- package/mobile/lib/components/StickyBottomMenu/ActiveSubMenuItem.js +1 -1
- package/mobile/lib/components/StickyBottomMenu/ActiveSubMenuItem.js.map +1 -1
- package/mobile/lib/components/StickyBottomMenu/BurgerMenuDialog.js +8 -3
- package/mobile/lib/components/StickyBottomMenu/BurgerMenuDialog.js.map +1 -1
- package/mobile/lib/components/StickyBottomMenu/StickyBottomMenu.js +26 -29
- package/mobile/lib/components/StickyBottomMenu/StickyBottomMenu.js.map +1 -1
- package/mobile/lib/components/StickyBottomMenu/StickyBottomMenuBurger.d.ts +2 -1
- package/mobile/lib/components/StickyBottomMenu/StickyBottomMenuBurger.js.map +1 -1
- package/mobile/lib/components/StickyBottomMenu/useBurgerMenuDialog.d.ts +3 -0
- package/mobile/lib/components/StickyBottomMenu/useBurgerMenuDialog.js +1 -1
- package/mobile/lib/components/StickyBottomMenu/useBurgerMenuDialog.js.map +1 -1
- package/mobile/lib/ui-kit/DialogManager/Dialog.d.ts +2 -0
- package/mobile/lib/ui-kit/DialogManager/Dialog.js +2 -2
- package/mobile/lib/ui-kit/DialogManager/Dialog.js.map +1 -1
- package/mobile/src/components/StickyBottomMenu/ActiveSubMenuItem.tsx +1 -1
- package/mobile/src/components/StickyBottomMenu/BurgerMenuDialog.tsx +34 -3
- package/mobile/src/components/StickyBottomMenu/StickyBottomMenu.tsx +43 -44
- package/mobile/src/components/StickyBottomMenu/StickyBottomMenuBurger.tsx +2 -1
- package/mobile/src/components/StickyBottomMenu/useBurgerMenuDialog.tsx +4 -2
- package/mobile/src/ui-kit/DialogManager/Dialog.tsx +8 -2
- package/package.json +1 -1
- package/src/components/StickyBottomMenu/ActiveSubMenuItem.tsx +1 -1
- package/src/components/StickyBottomMenu/BurgerMenuDialog.tsx +34 -3
- package/src/components/StickyBottomMenu/StickyBottomMenu.fixture.mobile.tsx +0 -2
- package/src/components/StickyBottomMenu/StickyBottomMenu.mobile.tsx +43 -44
- package/src/components/StickyBottomMenu/StickyBottomMenuBurger.tsx +2 -1
- package/src/components/StickyBottomMenu/useBurgerMenuDialog.tsx +4 -2
- package/src/ui-kit/DialogManager/Dialog.tsx +8 -2
|
@@ -2,16 +2,20 @@ import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
|
|
|
2
2
|
import { JSX } from '@redneckz/uni-jsx';
|
|
3
3
|
import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
|
|
4
4
|
import { useActiveRoute } from '../../hooks/useActiveRoute.js';
|
|
5
|
+
import { useLocation } from '../../hooks/useLocation.js';
|
|
5
6
|
import { Dialog } from '../../ui-kit/DialogManager/Dialog.js';
|
|
6
7
|
import { Heading } from '../../ui-kit/Heading/Heading.js';
|
|
7
8
|
import { Img } from '../../ui-kit/Img/Img.js';
|
|
9
|
+
import { useLocationDialog } from '../../ui-kit/LocationDialog/useLocationDialog.js';
|
|
8
10
|
import { SwipeListContainer } from '../../ui-kit/SwipeListControl/SwipeListContainer.js';
|
|
9
11
|
import { useSwipeListScroll } from '../../ui-kit/SwipeListControl/useSwipeListScroll.js';
|
|
10
12
|
import { style } from '../../utils/style.js';
|
|
11
13
|
import { ActiveSubMenuItem } from './ActiveSubMenuItem.js';
|
|
12
14
|
import { TopItemMobile } from './TopItemMobile.js';
|
|
13
15
|
export const BurgerMenuDialog = JSX((props) => {
|
|
14
|
-
const { topItems, officesLink } = props;
|
|
16
|
+
const { topItems, defaultLocation, officesLink } = props;
|
|
17
|
+
const [location] = useLocation(defaultLocation);
|
|
18
|
+
const locationDialog = useLocationDialog(props);
|
|
15
19
|
const [containerRef, scroll] = useSwipeListScroll({
|
|
16
20
|
itemCount: topItems?.length ?? 0,
|
|
17
21
|
});
|
|
@@ -28,8 +32,9 @@ export const BurgerMenuDialog = JSX((props) => {
|
|
|
28
32
|
}
|
|
29
33
|
}, [activeTopItemIndex, scroll]);
|
|
30
34
|
const handleTopItemClick = useCallback((idx) => setActiveTopItemIndex(idx), []);
|
|
31
|
-
return (_jsx(Dialog, { head: _jsx("div", { className: "flex items-center", children: _jsx(Heading, { as: "h4", title: "\u041C\u0435\u043D\u044E" }) }), children: _jsxs("div", { className: "flex flex-col flex-nowrap relative w-full h-auto m-auto bg-white pb-24 box-border rounded-md", children: [_jsx("div", { className: "w-full mb-3", children: _jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: 0, gap: 10, className: "pb-3", children: topItems?.map((item, i) => (_jsx(TopItemMobile, { item: item, isActive: activeTopItemIndex === i, onClick: () => handleTopItemClick(i) }, String(i)))) }) }), _jsxs("div", { className: "relative grow", children: [renderActiveSubMenu(activeMenuSubItems, activeRoute?.href), renderOfficeLink(officesLink)] })] }) }));
|
|
35
|
+
return (_jsx(Dialog, { onClick: (e) => e.stopPropagation(), head: _jsx("div", { className: "flex items-center", children: _jsx(Heading, { as: "h4", title: "\u041C\u0435\u043D\u044E" }) }), children: _jsxs("div", { className: "flex flex-col flex-nowrap relative w-full h-auto m-auto bg-white pb-24 box-border rounded-md", children: [_jsx("div", { className: "w-full mb-3", children: _jsx(SwipeListContainer, { containerRef: containerRef, visibleItemCount: 0, gap: 10, className: "pb-3", children: topItems?.map((item, i) => (_jsx(TopItemMobile, { item: item, isActive: activeTopItemIndex === i, onClick: () => handleTopItemClick(i) }, String(i)))) }) }), _jsxs("div", { className: "relative grow", children: [renderActiveSubMenu(activeMenuSubItems, activeRoute?.href), renderOfficeLink(officesLink), renderLocation(location, () => locationDialog.open())] })] }) }));
|
|
32
36
|
});
|
|
33
37
|
const renderActiveSubMenu = (activeMenuSubItems, basePath) => activeMenuSubItems ? (_jsx("div", { children: activeMenuSubItems.map((_, i) => (_jsx(ActiveSubMenuItem, { item: _, basePath: basePath }, String(i)))) })) : null;
|
|
34
|
-
const renderOfficeLink = (officesLink) => officesLink ? (_jsx("div", { className: "mt-3", children: _jsxs("a", { className: style('text-primary-text', `
|
|
38
|
+
const renderOfficeLink = (officesLink) => officesLink ? (_jsx("div", { className: "mt-3", children: _jsxs("a", { className: style('text-primary-text', `p-4 text-h5 font-light flex justify-between cursor-pointer`, 'shadow-main-black', 'rounded-xl'), href: officesLink, rel: "noopener noreferrer", "aria-label": "\u041E\u0442\u0434\u0435\u043B\u0435\u043D\u0438\u044F \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B", children: [_jsx("span", { children: "\u041E\u0444\u0438\u0441\u044B \u0438 \u0431\u0430\u043D\u043A\u043E\u043C\u0430\u0442\u044B" }), _jsx(Img, { image: { icon: 'ArrowRightIcon', iconVersion: 'color' }, width: "24", height: "24", className: "text-secondary-text opacity-30" })] }) })) : null;
|
|
39
|
+
const renderLocation = (location, onClick) => (_jsxs("div", { className: style('text-primary-text', `p-4 text-h5 font-light flex justify-between cursor-pointer`, 'shadow-main-black', 'rounded-xl', 'mt-3'), onClick: onClick, children: [_jsx("div", { className: "flex flex-col items-start", children: _jsxs("span", { children: ["\u0412\u0430\u0448\u0430 \u043B\u043E\u043A\u0430\u0446\u0438\u044F - ", location.name] }) }), _jsx(Img, { image: { icon: 'ArrowRightIcon', iconVersion: 'color' }, width: "24", height: "24", className: "text-secondary-text opacity-30" })] }));
|
|
35
40
|
//# sourceMappingURL=BurgerMenuDialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BurgerMenuDialog.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/BurgerMenuDialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAGxF,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"BurgerMenuDialog.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/BurgerMenuDialog.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,8 +3,8 @@ import { useCallback, useEffect, useRef, useState } from '@redneckz/uni-jsx/lib/
|
|
|
3
3
|
import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
|
|
4
4
|
import { useOutsideClick } from '@redneckz/uni-jsx/lib/hooks/useOutsideClick';
|
|
5
5
|
import { BlockWrapper } from '../../ui-kit/BlockWrapper.js';
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
6
|
+
import { Dialog } from '../../ui-kit/DialogManager/Dialog.js';
|
|
7
|
+
import { Heading } from '../../ui-kit/Heading/Heading.js';
|
|
8
8
|
import { UniBlock } from '../../UniBlock/UniBlock.js';
|
|
9
9
|
import { StickyBottomMenuBurger } from './StickyBottomMenuBurger.js';
|
|
10
10
|
import { StickyBottomMenuItem } from './StickyBottomMenuItem.js';
|
|
@@ -13,48 +13,41 @@ const EMPTY_MENU = [];
|
|
|
13
13
|
// eslint-disable-next-line max-lines-per-function
|
|
14
14
|
export const StickyBottomMenu = UniBlock(({ sticky, ...rest }) => {
|
|
15
15
|
const { menuItems = EMPTY_MENU } = sticky ?? {};
|
|
16
|
-
const [isBurgerMenuDialogOpen, { toggle, close }] = useBurgerMenuDialog(rest.options?.page?.sitemap ?? {});
|
|
17
|
-
const popup = usePopupManager();
|
|
16
|
+
const [isBurgerMenuDialogOpen, { toggle, close, openDialog }] = useBurgerMenuDialog(rest.options?.page?.sitemap ?? {});
|
|
18
17
|
const middleIdx = Math.floor(menuItems.length / 2);
|
|
19
18
|
const leftItems = menuItems.slice(0, middleIdx);
|
|
20
19
|
const rightItems = menuItems.slice(middleIdx);
|
|
21
20
|
const [activeIndex, setActiveIndex] = useState(-1);
|
|
22
21
|
const [currentItemPosition, setCurrentItemPosition] = useState('');
|
|
23
|
-
const [
|
|
24
|
-
const
|
|
25
|
-
|
|
22
|
+
const [popupDialogState, { setFalse: setPopupDialogClosed, setTrue: setPopupDialogOpened }] = useBool();
|
|
23
|
+
const closePopupDialog = useCallback(() => {
|
|
24
|
+
setPopupDialogClosed();
|
|
26
25
|
setActiveIndex(-1);
|
|
27
26
|
setCurrentItemPosition('');
|
|
28
|
-
|
|
29
|
-
}, [
|
|
27
|
+
close();
|
|
28
|
+
}, [close]);
|
|
30
29
|
const menuRef = useRef(null);
|
|
31
|
-
const
|
|
32
|
-
const
|
|
33
|
-
|
|
30
|
+
const popupDialogRef = useOutsideClick(closePopupDialog);
|
|
31
|
+
const openPopupDialog = useCallback((index, itemsPosition) => {
|
|
32
|
+
setPopupDialogOpened();
|
|
34
33
|
close();
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
top: Math.max(globalThis.document?.documentElement?.clientHeight || 0, globalThis.innerHeight || 0) *
|
|
38
|
-
0.3 -
|
|
39
|
-
134,
|
|
40
|
-
left: menuDimensions?.left || 0,
|
|
41
|
-
width: menuDimensions?.width,
|
|
42
|
-
fixed: true,
|
|
34
|
+
openDialog(_jsx(Dialog, { onClick: (e) => e.stopPropagation(), className: "mt-[20%]", onClose: closePopupDialog, head: _jsx("div", { className: "flex items-center", children: _jsx(Heading, { as: "h4", title: itemsPosition === 'left' ? leftItems[index].title : rightItems[index].title }) }), children: _jsx("div", { className: "bg-white pb-24 pt-1 text-l", ref: popupDialogRef }) }), {
|
|
35
|
+
id: itemsPosition === 'left' ? leftItems[index].title : rightItems[index].title,
|
|
43
36
|
});
|
|
44
|
-
}, [close,
|
|
37
|
+
}, [close, closePopupDialog]);
|
|
45
38
|
const handleMenuItemClick = useCallback((index, itemsPosition) => {
|
|
46
39
|
setCurrentItemPosition(itemsPosition);
|
|
47
40
|
setActiveIndex(index);
|
|
48
|
-
|
|
49
|
-
}, [
|
|
41
|
+
openPopupDialog(index, itemsPosition);
|
|
42
|
+
}, [openPopupDialog]);
|
|
50
43
|
useEffect(() => {
|
|
51
|
-
if (!
|
|
44
|
+
if (!popupDialogRef.current) {
|
|
52
45
|
return;
|
|
53
46
|
}
|
|
54
|
-
if (!
|
|
55
|
-
|
|
47
|
+
if (!popupDialogRef.current.shadowRoot) {
|
|
48
|
+
popupDialogRef.current?.attachShadow({ mode: 'open' });
|
|
56
49
|
}
|
|
57
|
-
const shadowRoot =
|
|
50
|
+
const shadowRoot = popupDialogRef.current.shadowRoot;
|
|
58
51
|
if (!shadowRoot) {
|
|
59
52
|
return;
|
|
60
53
|
}
|
|
@@ -64,8 +57,12 @@ export const StickyBottomMenu = UniBlock(({ sticky, ...rest }) => {
|
|
|
64
57
|
else {
|
|
65
58
|
shadowRoot.innerHTML = rightItems[activeIndex]?.__html || '';
|
|
66
59
|
}
|
|
67
|
-
}, [activeIndex, currentItemPosition,
|
|
68
|
-
return (_jsx(BlockWrapper, { className: "h-[74px] z-[100] relative", defaultPadding: "p-0", ...rest, children: _jsxs("div", { ref: menuRef, className: "ml-auto container bg-white flex justify-center shadow-blue-gray", children: [leftItems.map(renderMenuItem(handleMenuItemClick, 'left', { activeIndex, currentItemPosition })), _jsx(StickyBottomMenuBurger, { isActive: isBurgerMenuDialogOpen, onClick:
|
|
60
|
+
}, [activeIndex, currentItemPosition, popupDialogState]);
|
|
61
|
+
return (_jsx(BlockWrapper, { className: "h-[74px] z-[100] relative", defaultPadding: "p-0", ...rest, children: _jsxs("div", { ref: menuRef, className: "ml-auto container bg-white flex justify-center shadow-blue-gray", children: [leftItems.map(renderMenuItem(handleMenuItemClick, 'left', { activeIndex, currentItemPosition })), _jsx(StickyBottomMenuBurger, { isActive: isBurgerMenuDialogOpen, onClick: (e) => {
|
|
62
|
+
closePopupDialog();
|
|
63
|
+
e.stopPropagation();
|
|
64
|
+
toggle();
|
|
65
|
+
} }), rightItems.map(renderMenuItem(handleMenuItemClick, 'right', { activeIndex, currentItemPosition }))] }) }));
|
|
69
66
|
});
|
|
70
67
|
const renderMenuItem = (handleMenuItemClick, itemsPosition, currentActiveItem) => (_, i, arr) => {
|
|
71
68
|
return (_jsx(StickyBottomMenuItem, { item: _, isActive: arr[currentActiveItem.activeIndex]?.title === _?.title &&
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StickyBottomMenu.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/StickyBottomMenu.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvF,OAAO,EAAE,OAAO,EAAE,MAAM,qCAAqC,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,6CAA6C,CAAC;AAE9E,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"StickyBottomMenu.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/StickyBottomMenu.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { type PreventableEvent } from '../../ui-kit/PreventableEvent';
|
|
1
2
|
interface StickyBottomMenuBurgerProps {
|
|
2
3
|
isActive?: boolean;
|
|
3
|
-
onClick?: () => void;
|
|
4
|
+
onClick?: (e: PreventableEvent) => void;
|
|
4
5
|
}
|
|
5
6
|
export declare const StickyBottomMenuBurger: import("@redneckz/uni-jsx").UNIComponent<StickyBottomMenuBurgerProps, any, any>;
|
|
6
7
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StickyBottomMenuBurger.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/StickyBottomMenuBurger.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"StickyBottomMenuBurger.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/StickyBottomMenuBurger.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAO1C,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAA8B,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAChG,kBACE,SAAS,EAAE,KAAK,CACd,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,mBAAmB,EACpD,2EAA2E,CAC5E,EACD,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,QAAQ,aAEb,KAAC,IAAI,IAAC,SAAS,EAAC,SAAS,EAAC,IAAI,EAAC,YAAY,EAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,GAAI,gCAElF,CACV,CAAC,CAAC"}
|
|
@@ -1,7 +1,10 @@
|
|
|
1
|
+
import { type VNode } from '../../model/VNode';
|
|
2
|
+
import { type DialogOptions } from '../../ui-kit/DialogManager/useDialogManager';
|
|
1
3
|
import { type BurgerMenuDialogProps } from './BurgerMenuDialog';
|
|
2
4
|
export declare const BURGER_MENU_DIALOG_ID = "burgerMenuDialog";
|
|
3
5
|
export declare const useBurgerMenuDialog: (props: BurgerMenuDialogProps) => [boolean, {
|
|
4
6
|
open: () => void;
|
|
5
7
|
close: () => void;
|
|
6
8
|
toggle: () => void;
|
|
9
|
+
openDialog: (dialog: VNode, options: DialogOptions) => void;
|
|
7
10
|
}];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBurgerMenuDialog.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/useBurgerMenuDialog.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"useBurgerMenuDialog.js","sourceRoot":"","sources":["../../../src/components/StickyBottomMenu/useBurgerMenuDialog.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AACvE,OAAO,EAAE,gBAAgB,EAAsB,MAAM,6CAA6C,CAAC;AACnG,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAA8B,MAAM,oBAAoB,CAAC;AAElF,MAAM,CAAC,MAAM,qBAAqB,GAAG,kBAAkB,CAAC;AAExD,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,KAA4B,EAS5B,EAAE;IACF,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAEjE,MAAM,OAAO,GAAG,cAAc,EAAE,CAAC;IACjC,MAAM,gBAAgB,GAAG,YAAY,CAAC,qBAAqB,EAAE,OAAO,CAAC,CAAC;IAEtE,MAAM,IAAI,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,KAAC,gBAAgB,OAAK,KAAK,GAAI,EAAE,EAAE,EAAE,EAAE,qBAAqB,EAAE,CAAC,CAAC;IAC9F,MAAM,MAAM,GAAG,GAAG,EAAE;QAClB,IAAI,gBAAgB,EAAE;YACpB,QAAQ,EAAE,CAAC;SACZ;aAAM;YACL,IAAI,EAAE,CAAC;SACR;IACH,CAAC,CAAC;IAEF,OAAO,CAAC,gBAAgB,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,CAAC,CAAC;AACjE,CAAC,CAAC"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { type VNode } from '../../model/VNode';
|
|
2
|
+
import { type PreventableEvent } from '../PreventableEvent';
|
|
2
3
|
export interface DialogProps {
|
|
3
4
|
className?: string;
|
|
4
5
|
head?: VNode;
|
|
5
6
|
onClose?: () => void;
|
|
7
|
+
onClick?: (e: PreventableEvent) => void;
|
|
6
8
|
}
|
|
7
9
|
export declare const Dialog: import("@redneckz/uni-jsx").UNIComponent<DialogProps, any, any>;
|
|
@@ -4,12 +4,12 @@ import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
|
|
|
4
4
|
import { style } from '../../utils/style.js';
|
|
5
5
|
import { CloseButton } from './CloseButton.js';
|
|
6
6
|
import { useDialogManager } from './useDialogManager.js';
|
|
7
|
-
export const Dialog = JSX(({ className, head, children, onClose }) => {
|
|
7
|
+
export const Dialog = JSX(({ className, head, children, onClose, onClick }) => {
|
|
8
8
|
const { close } = useDialogManager();
|
|
9
9
|
const handleClose = useCallback(() => {
|
|
10
10
|
close();
|
|
11
11
|
onClose && onClose();
|
|
12
12
|
}, [onClose]);
|
|
13
|
-
return (_jsxs("div", { className: style('relative min-h-full bg-white pt-0 p-lg', className), role: "dialog", children: [_jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [_jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), _jsx("div", { className: "container", children: head })] }), _jsx("div", { className: "container pb-6xl", children: children })] }));
|
|
13
|
+
return (_jsxs("div", { onClick: onClick, className: style('relative min-h-full bg-white pt-0 p-lg', className), role: "dialog", children: [_jsxs("div", { className: "sticky py-xl top-0 bg-white z-10", children: [_jsx(CloseButton, { className: "absolute top-0 right-0", onClose: handleClose }), _jsx("div", { className: "container", children: head })] }), _jsx("div", { className: "container pb-6xl", children: children })] }));
|
|
14
14
|
});
|
|
15
15
|
//# sourceMappingURL=Dialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/ui-kit/DialogManager/Dialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"Dialog.js","sourceRoot":"","sources":["../../../src/ui-kit/DialogManager/Dialog.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAE1D,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAStD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAc,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE;IACzF,MAAM,EAAE,KAAK,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAErC,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,KAAK,EAAE,CAAC;QACR,OAAO,IAAI,OAAO,EAAE,CAAC;IACvB,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACL,eACE,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,KAAK,CAAC,wCAAwC,EAAE,SAAS,CAAC,EACrE,IAAI,EAAC,QAAQ,aAEb,eAAK,SAAS,EAAC,kCAAkC,aAC/C,KAAC,WAAW,IAAC,SAAS,EAAC,wBAAwB,EAAC,OAAO,EAAE,WAAW,GAAI,EACxE,cAAK,SAAS,EAAC,WAAW,YAAE,IAAI,GAAO,IACnC,EACN,cAAK,SAAS,EAAC,kBAAkB,YAAE,QAAQ,GAAO,IAC9C,CACP,CAAC;AACJ,CAAC,CAAC,CAAC"}
|
|
@@ -26,7 +26,7 @@ export const ActiveSubMenuItem = JSX<ActiveSubMenuItemProps>(({ item, basePath }
|
|
|
26
26
|
<a
|
|
27
27
|
className={style(
|
|
28
28
|
isActive ? 'text-primary-main' : 'text-primary-text',
|
|
29
|
-
`
|
|
29
|
+
`p-4 text-h5 font-light flex justify-between cursor-pointer`,
|
|
30
30
|
'shadow-main-black',
|
|
31
31
|
'rounded-xl',
|
|
32
32
|
)}
|
|
@@ -3,10 +3,13 @@ import { useCallback, useEffect, useMemo, useState } from '@redneckz/uni-jsx/lib
|
|
|
3
3
|
import { type RefObject } from 'react';
|
|
4
4
|
import { type SitemapData } from '../../data/SitemapData';
|
|
5
5
|
import { useActiveRoute } from '../../hooks/useActiveRoute';
|
|
6
|
+
import { useLocation } from '../../hooks/useLocation';
|
|
7
|
+
import { type Region } from '../../hooks/useRegions';
|
|
6
8
|
import { type LinkProps } from '../../model/LinkProps';
|
|
7
9
|
import { Dialog } from '../../ui-kit/DialogManager/Dialog';
|
|
8
10
|
import { Heading } from '../../ui-kit/Heading/Heading';
|
|
9
11
|
import { Img } from '../../ui-kit/Img/Img';
|
|
12
|
+
import { useLocationDialog } from '../../ui-kit/LocationDialog/useLocationDialog';
|
|
10
13
|
import { SwipeListContainer } from '../../ui-kit/SwipeListControl/SwipeListContainer';
|
|
11
14
|
import { useSwipeListScroll } from '../../ui-kit/SwipeListControl/useSwipeListScroll';
|
|
12
15
|
import { style } from '../../utils/style';
|
|
@@ -18,7 +21,10 @@ export interface BurgerMenuDialogProps extends SitemapData {
|
|
|
18
21
|
}
|
|
19
22
|
|
|
20
23
|
export const BurgerMenuDialog = JSX<BurgerMenuDialogProps>((props) => {
|
|
21
|
-
const { topItems, officesLink } = props;
|
|
24
|
+
const { topItems, defaultLocation, officesLink } = props;
|
|
25
|
+
|
|
26
|
+
const [location] = useLocation(defaultLocation);
|
|
27
|
+
const locationDialog = useLocationDialog(props);
|
|
22
28
|
|
|
23
29
|
const [containerRef, scroll] = useSwipeListScroll<HTMLDivElement>({
|
|
24
30
|
itemCount: topItems?.length ?? 0,
|
|
@@ -42,6 +48,7 @@ export const BurgerMenuDialog = JSX<BurgerMenuDialogProps>((props) => {
|
|
|
42
48
|
|
|
43
49
|
return (
|
|
44
50
|
<Dialog
|
|
51
|
+
onClick={(e) => e.stopPropagation()}
|
|
45
52
|
head={
|
|
46
53
|
<div className="flex items-center">
|
|
47
54
|
<Heading as="h4" title="Меню" />
|
|
@@ -69,6 +76,7 @@ export const BurgerMenuDialog = JSX<BurgerMenuDialogProps>((props) => {
|
|
|
69
76
|
<div className="relative grow">
|
|
70
77
|
{renderActiveSubMenu(activeMenuSubItems, activeRoute?.href)}
|
|
71
78
|
{renderOfficeLink(officesLink)}
|
|
79
|
+
{renderLocation(location, () => locationDialog.open())}
|
|
72
80
|
</div>
|
|
73
81
|
</div>
|
|
74
82
|
</Dialog>
|
|
@@ -90,7 +98,7 @@ const renderOfficeLink = (officesLink?: string) =>
|
|
|
90
98
|
<a
|
|
91
99
|
className={style(
|
|
92
100
|
'text-primary-text',
|
|
93
|
-
`
|
|
101
|
+
`p-4 text-h5 font-light flex justify-between cursor-pointer`,
|
|
94
102
|
'shadow-main-black',
|
|
95
103
|
'rounded-xl',
|
|
96
104
|
)}
|
|
@@ -98,7 +106,7 @@ const renderOfficeLink = (officesLink?: string) =>
|
|
|
98
106
|
rel="noopener noreferrer"
|
|
99
107
|
aria-label="Отделения и банкоматы"
|
|
100
108
|
>
|
|
101
|
-
<span
|
|
109
|
+
<span>Офисы и банкоматы</span>
|
|
102
110
|
<Img
|
|
103
111
|
image={{ icon: 'ArrowRightIcon', iconVersion: 'color' }}
|
|
104
112
|
width="24"
|
|
@@ -108,3 +116,26 @@ const renderOfficeLink = (officesLink?: string) =>
|
|
|
108
116
|
</a>
|
|
109
117
|
</div>
|
|
110
118
|
) : null;
|
|
119
|
+
|
|
120
|
+
const renderLocation = (location: Region, onClick?: () => void) => (
|
|
121
|
+
<div
|
|
122
|
+
className={style(
|
|
123
|
+
'text-primary-text',
|
|
124
|
+
`p-4 text-h5 font-light flex justify-between cursor-pointer`,
|
|
125
|
+
'shadow-main-black',
|
|
126
|
+
'rounded-xl',
|
|
127
|
+
'mt-3',
|
|
128
|
+
)}
|
|
129
|
+
onClick={onClick}
|
|
130
|
+
>
|
|
131
|
+
<div className="flex flex-col items-start">
|
|
132
|
+
<span>Ваша локация - {location.name}</span>
|
|
133
|
+
</div>
|
|
134
|
+
<Img
|
|
135
|
+
image={{ icon: 'ArrowRightIcon', iconVersion: 'color' }}
|
|
136
|
+
width="24"
|
|
137
|
+
height="24"
|
|
138
|
+
className="text-secondary-text opacity-30"
|
|
139
|
+
/>
|
|
140
|
+
</div>
|
|
141
|
+
);
|
|
@@ -3,8 +3,8 @@ import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
|
|
|
3
3
|
import { useOutsideClick } from '@redneckz/uni-jsx/lib/hooks/useOutsideClick';
|
|
4
4
|
import { type StickyMenuItem } from '../../data/StickyMobileData';
|
|
5
5
|
import { BlockWrapper } from '../../ui-kit/BlockWrapper';
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
6
|
+
import { Dialog } from '../../ui-kit/DialogManager/Dialog';
|
|
7
|
+
import { Heading } from '../../ui-kit/Heading/Heading';
|
|
8
8
|
import { UniBlock } from '../../UniBlock/UniBlock';
|
|
9
9
|
import { StickyBottomMenuBurger } from './StickyBottomMenuBurger';
|
|
10
10
|
import { StickyBottomMenuItem } from './StickyBottomMenuItem';
|
|
@@ -21,10 +21,9 @@ interface CurrentActiveItem {
|
|
|
21
21
|
// eslint-disable-next-line max-lines-per-function
|
|
22
22
|
export const StickyBottomMenu = UniBlock<StickyBottomMenuProps>(({ sticky, ...rest }) => {
|
|
23
23
|
const { menuItems = EMPTY_MENU } = sticky ?? {};
|
|
24
|
-
const [isBurgerMenuDialogOpen, { toggle, close }] = useBurgerMenuDialog(
|
|
24
|
+
const [isBurgerMenuDialogOpen, { toggle, close, openDialog }] = useBurgerMenuDialog(
|
|
25
25
|
rest.options?.page?.sitemap ?? {},
|
|
26
26
|
);
|
|
27
|
-
const popup = usePopupManager();
|
|
28
27
|
|
|
29
28
|
const middleIdx = Math.floor(menuItems.length / 2);
|
|
30
29
|
const leftItems = menuItems.slice(0, middleIdx);
|
|
@@ -32,74 +31,67 @@ export const StickyBottomMenu = UniBlock<StickyBottomMenuProps>(({ sticky, ...re
|
|
|
32
31
|
|
|
33
32
|
const [activeIndex, setActiveIndex] = useState(-1);
|
|
34
33
|
const [currentItemPosition, setCurrentItemPosition] = useState<string>('');
|
|
35
|
-
const [
|
|
34
|
+
const [popupDialogState, { setFalse: setPopupDialogClosed, setTrue: setPopupDialogOpened }] =
|
|
35
|
+
useBool();
|
|
36
36
|
|
|
37
|
-
const
|
|
38
|
-
|
|
37
|
+
const closePopupDialog = useCallback(() => {
|
|
38
|
+
setPopupDialogClosed();
|
|
39
39
|
setActiveIndex(-1);
|
|
40
40
|
setCurrentItemPosition('');
|
|
41
|
-
|
|
42
|
-
}, [
|
|
41
|
+
close();
|
|
42
|
+
}, [close]);
|
|
43
43
|
|
|
44
44
|
const menuRef = useRef<HTMLDivElement | null>(null);
|
|
45
|
-
const
|
|
45
|
+
const popupDialogRef = useOutsideClick<HTMLDivElement>(closePopupDialog);
|
|
46
46
|
|
|
47
|
-
const
|
|
47
|
+
const openPopupDialog = useCallback(
|
|
48
48
|
(index: number, itemsPosition: string) => {
|
|
49
|
-
|
|
49
|
+
setPopupDialogOpened();
|
|
50
50
|
close();
|
|
51
|
-
const menuDimensions = menuRef?.current?.getBoundingClientRect();
|
|
52
51
|
|
|
53
|
-
|
|
54
|
-
<
|
|
52
|
+
openDialog(
|
|
53
|
+
<Dialog
|
|
55
54
|
onClick={(e) => e.stopPropagation()}
|
|
56
|
-
className="
|
|
55
|
+
className="mt-[20%]"
|
|
56
|
+
onClose={closePopupDialog}
|
|
57
|
+
head={
|
|
58
|
+
<div className="flex items-center">
|
|
59
|
+
<Heading
|
|
60
|
+
as="h4"
|
|
61
|
+
title={itemsPosition === 'left' ? leftItems[index].title : rightItems[index].title}
|
|
62
|
+
/>
|
|
63
|
+
</div>
|
|
64
|
+
}
|
|
57
65
|
>
|
|
58
|
-
<div className="
|
|
59
|
-
|
|
60
|
-
<CloseButton className="absolute top-0 right-0" onClose={closePopup} />
|
|
61
|
-
</div>
|
|
62
|
-
<div
|
|
63
|
-
className="bg-white text-l h-[70vh] overflow-y-auto no-scrollbar"
|
|
64
|
-
ref={popupRef}
|
|
65
|
-
></div>
|
|
66
|
-
</div>,
|
|
66
|
+
<div className="bg-white pb-24 pt-1 text-l" ref={popupDialogRef}></div>
|
|
67
|
+
</Dialog>,
|
|
67
68
|
{
|
|
68
|
-
|
|
69
|
-
Math.max(
|
|
70
|
-
globalThis.document?.documentElement?.clientHeight || 0,
|
|
71
|
-
globalThis.innerHeight || 0,
|
|
72
|
-
) *
|
|
73
|
-
0.3 -
|
|
74
|
-
134,
|
|
75
|
-
left: menuDimensions?.left || 0,
|
|
76
|
-
width: menuDimensions?.width,
|
|
77
|
-
fixed: true,
|
|
69
|
+
id: itemsPosition === 'left' ? leftItems[index].title : rightItems[index].title,
|
|
78
70
|
},
|
|
79
71
|
);
|
|
80
72
|
},
|
|
81
|
-
[close,
|
|
73
|
+
[close, closePopupDialog],
|
|
82
74
|
);
|
|
83
75
|
|
|
84
76
|
const handleMenuItemClick = useCallback(
|
|
85
77
|
(index: number, itemsPosition: string) => {
|
|
86
78
|
setCurrentItemPosition(itemsPosition);
|
|
87
79
|
setActiveIndex(index);
|
|
88
|
-
|
|
80
|
+
openPopupDialog(index, itemsPosition);
|
|
89
81
|
},
|
|
90
|
-
[
|
|
82
|
+
[openPopupDialog],
|
|
91
83
|
);
|
|
92
84
|
|
|
93
85
|
useEffect(() => {
|
|
94
|
-
if (!
|
|
86
|
+
if (!popupDialogRef.current) {
|
|
95
87
|
return;
|
|
96
88
|
}
|
|
97
89
|
|
|
98
|
-
if (!
|
|
99
|
-
|
|
90
|
+
if (!popupDialogRef.current.shadowRoot) {
|
|
91
|
+
popupDialogRef.current?.attachShadow({ mode: 'open' });
|
|
100
92
|
}
|
|
101
93
|
|
|
102
|
-
const shadowRoot =
|
|
94
|
+
const shadowRoot = popupDialogRef.current.shadowRoot;
|
|
103
95
|
if (!shadowRoot) {
|
|
104
96
|
return;
|
|
105
97
|
}
|
|
@@ -109,7 +101,7 @@ export const StickyBottomMenu = UniBlock<StickyBottomMenuProps>(({ sticky, ...re
|
|
|
109
101
|
} else {
|
|
110
102
|
shadowRoot.innerHTML = rightItems[activeIndex]?.__html || '';
|
|
111
103
|
}
|
|
112
|
-
}, [activeIndex, currentItemPosition,
|
|
104
|
+
}, [activeIndex, currentItemPosition, popupDialogState]);
|
|
113
105
|
|
|
114
106
|
return (
|
|
115
107
|
<BlockWrapper className="h-[74px] z-[100] relative" defaultPadding="p-0" {...rest}>
|
|
@@ -120,7 +112,14 @@ export const StickyBottomMenu = UniBlock<StickyBottomMenuProps>(({ sticky, ...re
|
|
|
120
112
|
{leftItems.map(
|
|
121
113
|
renderMenuItem(handleMenuItemClick, 'left', { activeIndex, currentItemPosition }),
|
|
122
114
|
)}
|
|
123
|
-
<StickyBottomMenuBurger
|
|
115
|
+
<StickyBottomMenuBurger
|
|
116
|
+
isActive={isBurgerMenuDialogOpen}
|
|
117
|
+
onClick={(e) => {
|
|
118
|
+
closePopupDialog();
|
|
119
|
+
e.stopPropagation();
|
|
120
|
+
toggle();
|
|
121
|
+
}}
|
|
122
|
+
/>
|
|
124
123
|
{rightItems.map(
|
|
125
124
|
renderMenuItem(handleMenuItemClick, 'right', { activeIndex, currentItemPosition }),
|
|
126
125
|
)}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { JSX } from '@redneckz/uni-jsx';
|
|
2
2
|
import { Icon } from '../../ui-kit/Icon/Icon';
|
|
3
|
+
import { type PreventableEvent } from '../../ui-kit/PreventableEvent';
|
|
3
4
|
import { style } from '../../utils/style';
|
|
4
5
|
|
|
5
6
|
interface StickyBottomMenuBurgerProps {
|
|
6
7
|
isActive?: boolean;
|
|
7
|
-
onClick?: () => void;
|
|
8
|
+
onClick?: (e: PreventableEvent) => void;
|
|
8
9
|
}
|
|
9
10
|
|
|
10
11
|
export const StickyBottomMenuBurger = JSX<StickyBottomMenuBurgerProps>(({ isActive, onClick }) => (
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
import { type VNode } from '../../model/VNode';
|
|
1
2
|
import { isDialogOpen } from '../../ui-kit/DialogManager/isDialogOpen';
|
|
2
|
-
import { useDialogManager } from '../../ui-kit/DialogManager/useDialogManager';
|
|
3
|
+
import { useDialogManager, type DialogOptions } from '../../ui-kit/DialogManager/useDialogManager';
|
|
3
4
|
import { useDialogsList } from '../../ui-kit/DialogManager/useDialogsList';
|
|
4
5
|
import { BurgerMenuDialog, type BurgerMenuDialogProps } from './BurgerMenuDialog';
|
|
5
6
|
|
|
@@ -13,6 +14,7 @@ export const useBurgerMenuDialog = (
|
|
|
13
14
|
open: () => void;
|
|
14
15
|
close: () => void;
|
|
15
16
|
toggle: () => void;
|
|
17
|
+
openDialog: (dialog: VNode, options: DialogOptions) => void;
|
|
16
18
|
},
|
|
17
19
|
] => {
|
|
18
20
|
const { open: openDialog, closeAll, close } = useDialogManager();
|
|
@@ -29,5 +31,5 @@ export const useBurgerMenuDialog = (
|
|
|
29
31
|
}
|
|
30
32
|
};
|
|
31
33
|
|
|
32
|
-
return [isBurgerMenuOpen, { open, close, toggle }];
|
|
34
|
+
return [isBurgerMenuOpen, { open, close, toggle, openDialog }];
|
|
33
35
|
};
|
|
@@ -2,6 +2,7 @@ import { JSX } from '@redneckz/uni-jsx';
|
|
|
2
2
|
import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
|
|
3
3
|
import { type VNode } from '../../model/VNode';
|
|
4
4
|
import { style } from '../../utils/style';
|
|
5
|
+
import { type PreventableEvent } from '../PreventableEvent';
|
|
5
6
|
import { CloseButton } from './CloseButton';
|
|
6
7
|
import { useDialogManager } from './useDialogManager';
|
|
7
8
|
|
|
@@ -9,9 +10,10 @@ export interface DialogProps {
|
|
|
9
10
|
className?: string;
|
|
10
11
|
head?: VNode;
|
|
11
12
|
onClose?: () => void;
|
|
13
|
+
onClick?: (e: PreventableEvent) => void;
|
|
12
14
|
}
|
|
13
15
|
|
|
14
|
-
export const Dialog = JSX<DialogProps>(({ className, head, children, onClose }) => {
|
|
16
|
+
export const Dialog = JSX<DialogProps>(({ className, head, children, onClose, onClick }) => {
|
|
15
17
|
const { close } = useDialogManager();
|
|
16
18
|
|
|
17
19
|
const handleClose = useCallback(() => {
|
|
@@ -20,7 +22,11 @@ export const Dialog = JSX<DialogProps>(({ className, head, children, onClose })
|
|
|
20
22
|
}, [onClose]);
|
|
21
23
|
|
|
22
24
|
return (
|
|
23
|
-
<div
|
|
25
|
+
<div
|
|
26
|
+
onClick={onClick}
|
|
27
|
+
className={style('relative min-h-full bg-white pt-0 p-lg', className)}
|
|
28
|
+
role="dialog"
|
|
29
|
+
>
|
|
24
30
|
<div className="sticky py-xl top-0 bg-white z-10">
|
|
25
31
|
<CloseButton className="absolute top-0 right-0" onClose={handleClose} />
|
|
26
32
|
<div className="container">{head}</div>
|
package/package.json
CHANGED
|
@@ -26,7 +26,7 @@ export const ActiveSubMenuItem = JSX<ActiveSubMenuItemProps>(({ item, basePath }
|
|
|
26
26
|
<a
|
|
27
27
|
className={style(
|
|
28
28
|
isActive ? 'text-primary-main' : 'text-primary-text',
|
|
29
|
-
`
|
|
29
|
+
`p-4 text-h5 font-light flex justify-between cursor-pointer`,
|
|
30
30
|
'shadow-main-black',
|
|
31
31
|
'rounded-xl',
|
|
32
32
|
)}
|