@gravity-ui/page-constructor 6.2.0-beta.3 → 6.2.1
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/cjs/navigation/components/MobileNavigation/MobileNavigation.js +2 -2
- package/build/cjs/navigation/components/MobileNavigation/MobileNavigation.js.map +1 -1
- package/build/cjs/navigation/components/Navigation/Navigation.d.ts +1 -0
- package/build/cjs/navigation/components/Navigation/Navigation.js +2 -2
- package/build/cjs/navigation/components/Navigation/Navigation.js.map +1 -1
- package/build/cjs/navigation/models.d.ts +1 -0
- package/build/cjs/navigation/models.js.map +1 -1
- package/build/esm/navigation/components/MobileNavigation/MobileNavigation.js +2 -2
- package/build/esm/navigation/components/MobileNavigation/MobileNavigation.js.map +1 -1
- package/build/esm/navigation/components/Navigation/Navigation.d.ts +1 -0
- package/build/esm/navigation/components/Navigation/Navigation.js +2 -2
- package/build/esm/navigation/components/Navigation/Navigation.js.map +1 -1
- package/build/esm/navigation/models.d.ts +1 -0
- package/build/esm/navigation/models.js.map +1 -1
- package/package.json +6 -6
|
@@ -11,13 +11,13 @@ const utils_1 = require("../../../utils/index.js");
|
|
|
11
11
|
const models_1 = require("../../models.js");
|
|
12
12
|
const NavigationList_1 = require("../NavigationList/NavigationList.js");
|
|
13
13
|
const b = (0, utils_1.block)('mobile-navigation');
|
|
14
|
-
const MobileNavigation = ({ isOpened, topItems, bottomItems, ...props }) => {
|
|
14
|
+
const MobileNavigation = ({ isOpened, topItems, bottomItems, portalContainer, ...props }) => {
|
|
15
15
|
const [isMounted, setIsMounted] = React.useState(false);
|
|
16
16
|
(0, hooks_1.useMount)(() => setIsMounted(true));
|
|
17
17
|
if (!isMounted) {
|
|
18
18
|
return null;
|
|
19
19
|
}
|
|
20
|
-
return ((0, jsx_runtime_1.jsx)(uikit_1.Portal, { children: (0, jsx_runtime_1.jsx)(Foldable_1.default, { className: b(), isOpened: Boolean(isOpened), children: (0, jsx_runtime_1.jsxs)("div", { className: b('wrapper'), children: [topItems && ((0, jsx_runtime_1.jsx)(NavigationList_1.NavigationList, { className: b('rows'), items: topItems, column: models_1.ItemColumnName.Top, menuLayout: models_1.NavigationLayout.Mobile, ...props })), bottomItems && ((0, jsx_runtime_1.jsx)(NavigationList_1.NavigationList, { className: b('rows'), items: bottomItems, column: models_1.ItemColumnName.Bottom, menuLayout: models_1.NavigationLayout.Mobile, ...props }))] }) }, topItems?.length) }));
|
|
20
|
+
return ((0, jsx_runtime_1.jsx)(uikit_1.Portal, { container: portalContainer?.current ?? undefined, children: (0, jsx_runtime_1.jsx)(Foldable_1.default, { className: b(), isOpened: Boolean(isOpened), children: (0, jsx_runtime_1.jsxs)("div", { className: b('wrapper'), children: [topItems && ((0, jsx_runtime_1.jsx)(NavigationList_1.NavigationList, { className: b('rows'), items: topItems, column: models_1.ItemColumnName.Top, menuLayout: models_1.NavigationLayout.Mobile, ...props })), bottomItems && ((0, jsx_runtime_1.jsx)(NavigationList_1.NavigationList, { className: b('rows'), items: bottomItems, column: models_1.ItemColumnName.Bottom, menuLayout: models_1.NavigationLayout.Mobile, ...props }))] }) }, topItems?.length) }));
|
|
21
21
|
};
|
|
22
22
|
exports.MobileNavigation = MobileNavigation;
|
|
23
23
|
exports.default = exports.MobileNavigation;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MobileNavigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/MobileNavigation/MobileNavigation.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,6CAAyC;AAEzC,gGAA6D;AAC7D,mDAAwC;AACxC,mDAAqC;AACrC,4CAAqF;AACrF,wEAAgE;AAIhE,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,mBAAmB,CAAC,CAAC;AAE9B,MAAM,gBAAgB,GAAoC,CAAC,EAC9D,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,IAAA,gBAAQ,EAAC,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;IAEnC,IAAI,CAAC,SAAS,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO,CACH,uBAAC,cAAM,
|
|
1
|
+
{"version":3,"file":"MobileNavigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/MobileNavigation/MobileNavigation.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,6CAAyC;AAEzC,gGAA6D;AAC7D,mDAAwC;AACxC,mDAAqC;AACrC,4CAAqF;AACrF,wEAAgE;AAIhE,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,mBAAmB,CAAC,CAAC;AAE9B,MAAM,gBAAgB,GAAoC,CAAC,EAC9D,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,eAAe,EACf,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,IAAA,gBAAQ,EAAC,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;IAEnC,IAAI,CAAC,SAAS,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO,CACH,uBAAC,cAAM,IAAC,SAAS,EAAE,eAAe,EAAE,OAAO,IAAI,SAAS,YACpD,uBAAC,kBAAQ,IAAwB,SAAS,EAAE,CAAC,EAAE,EAAE,QAAQ,EAAE,OAAO,CAAC,QAAQ,CAAC,YACxE,iCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aACvB,QAAQ,IAAI,CACT,uBAAC,+BAAc,IACX,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,KAAK,EAAE,QAAQ,EACf,MAAM,EAAE,uBAAc,CAAC,GAAG,EAC1B,UAAU,EAAE,yBAAgB,CAAC,MAAM,KAC/B,KAAK,GACX,CACL,EACA,WAAW,IAAI,CACZ,uBAAC,+BAAc,IACX,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,uBAAc,CAAC,MAAM,EAC7B,UAAU,EAAE,yBAAgB,CAAC,MAAM,KAC/B,KAAK,GACX,CACL,IACC,IApBK,QAAQ,EAAE,MAAM,CAqBpB,GACN,CACZ,CAAC;AACN,CAAC,CAAC;AAzCW,QAAA,gBAAgB,oBAyC3B;AAEF,kBAAe,wBAAgB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Portal} from '@gravity-ui/uikit';\n\nimport Foldable from '../../../components/Foldable/Foldable';\nimport {useMount} from '../../../hooks';\nimport {block} from '../../../utils';\nimport {ItemColumnName, MobileNavigationProps, NavigationLayout} from '../../models';\nimport {NavigationList} from '../NavigationList/NavigationList';\n\nimport './MobileNavigation.scss';\n\nconst b = block('mobile-navigation');\n\nexport const MobileNavigation: React.FC<MobileNavigationProps> = ({\n isOpened,\n topItems,\n bottomItems,\n portalContainer,\n ...props\n}) => {\n const [isMounted, setIsMounted] = React.useState(false);\n\n useMount(() => setIsMounted(true));\n\n if (!isMounted) {\n return null;\n }\n\n return (\n <Portal container={portalContainer?.current ?? undefined}>\n <Foldable key={topItems?.length} className={b()} isOpened={Boolean(isOpened)}>\n <div className={b('wrapper')}>\n {topItems && (\n <NavigationList\n className={b('rows')}\n items={topItems}\n column={ItemColumnName.Top}\n menuLayout={NavigationLayout.Mobile}\n {...props}\n />\n )}\n {bottomItems && (\n <NavigationList\n className={b('rows')}\n items={bottomItems}\n column={ItemColumnName.Bottom}\n menuLayout={NavigationLayout.Mobile}\n {...props}\n />\n )}\n </div>\n </Foldable>\n </Portal>\n );\n};\n\nexport default MobileNavigation;\n"]}
|
|
@@ -3,6 +3,7 @@ import { ClassNameProps, HeaderData, ThemedNavigationLogoData } from "../../../m
|
|
|
3
3
|
export interface NavigationComponentProps extends ClassNameProps {
|
|
4
4
|
logo: ThemedNavigationLogoData;
|
|
5
5
|
data: HeaderData;
|
|
6
|
+
mobilePortalContainer?: React.RefObject<HTMLElement>;
|
|
6
7
|
}
|
|
7
8
|
export declare const Navigation: React.FC<NavigationComponentProps>;
|
|
8
9
|
export default Navigation;
|
|
@@ -11,13 +11,13 @@ const hooks_1 = require("../../hooks/index.js");
|
|
|
11
11
|
const DesktopNavigation_1 = tslib_1.__importDefault(require("../DesktopNavigation/DesktopNavigation.js"));
|
|
12
12
|
const MobileNavigation_1 = tslib_1.__importDefault(require("../MobileNavigation/MobileNavigation.js"));
|
|
13
13
|
const b = (0, utils_1.block)('navigation');
|
|
14
|
-
const Navigation = ({ data, logo, className }) => {
|
|
14
|
+
const Navigation = ({ data, logo, className, mobilePortalContainer, }) => {
|
|
15
15
|
const { leftItems, rightItems, customMobileHeaderItems, iconSize = 20, withBorder = false, withBorderOnScroll = true, } = data;
|
|
16
16
|
const [isSidebarOpened, setIsSidebarOpened] = React.useState(false);
|
|
17
17
|
const [showBorder] = (0, hooks_1.useShowBorder)(withBorder, withBorderOnScroll);
|
|
18
18
|
const { activeItemId, leftItemsWithIconSize, rightItemsWithIconSize, onActiveItemChange } = (0, hooks_1.useActiveNavItem)(iconSize, leftItems, rightItems);
|
|
19
19
|
const onSidebarOpenedChange = (isOpen) => setIsSidebarOpened(isOpen);
|
|
20
|
-
return ((0, jsx_runtime_1.jsx)(grid_1.Grid, { className: b({ 'with-border': showBorder }, className), children: (0, jsx_runtime_1.jsx)(grid_1.Row, { children: (0, jsx_runtime_1.jsx)(grid_1.Col, { children: (0, jsx_runtime_1.jsxs)("nav", { children: [(0, jsx_runtime_1.jsx)(DesktopNavigation_1.default, { logo: logo, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange, leftItemsWithIconSize: leftItemsWithIconSize, rightItemsWithIconSize: rightItemsWithIconSize, customMobileHeaderItems: customMobileHeaderItems, isSidebarOpened: isSidebarOpened, onSidebarOpenedChange: onSidebarOpenedChange }), (0, jsx_runtime_1.jsx)(OutsideClick_1.default, { onOutsideClick: () => onSidebarOpenedChange(false), children: (0, jsx_runtime_1.jsx)(MobileNavigation_1.default, { topItems: leftItemsWithIconSize, bottomItems: rightItemsWithIconSize, isOpened: isSidebarOpened, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange }) })] }) }) }) }));
|
|
20
|
+
return ((0, jsx_runtime_1.jsx)(grid_1.Grid, { className: b({ 'with-border': showBorder }, className), children: (0, jsx_runtime_1.jsx)(grid_1.Row, { children: (0, jsx_runtime_1.jsx)(grid_1.Col, { children: (0, jsx_runtime_1.jsxs)("nav", { children: [(0, jsx_runtime_1.jsx)(DesktopNavigation_1.default, { logo: logo, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange, leftItemsWithIconSize: leftItemsWithIconSize, rightItemsWithIconSize: rightItemsWithIconSize, customMobileHeaderItems: customMobileHeaderItems, isSidebarOpened: isSidebarOpened, onSidebarOpenedChange: onSidebarOpenedChange }), (0, jsx_runtime_1.jsx)(OutsideClick_1.default, { onOutsideClick: () => onSidebarOpenedChange(false), children: (0, jsx_runtime_1.jsx)(MobileNavigation_1.default, { topItems: leftItemsWithIconSize, bottomItems: rightItemsWithIconSize, isOpened: isSidebarOpened, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange, portalContainer: mobilePortalContainer }) })] }) }) }) }));
|
|
21
21
|
};
|
|
22
22
|
exports.Navigation = Navigation;
|
|
23
23
|
exports.default = exports.Navigation;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Navigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/Navigation/Navigation.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,4GAAyE;AACzE,iDAA6C;AAE7C,mDAAqC;AACrC,gDAA4D;AAC5D,0GAAuE;AACvE,uGAAoE;AAIpE,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,YAAY,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"Navigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/Navigation/Navigation.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,4GAAyE;AACzE,iDAA6C;AAE7C,mDAAqC;AACrC,gDAA4D;AAC5D,0GAAuE;AACvE,uGAAoE;AAIpE,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,YAAY,CAAC,CAAC;AAQvB,MAAM,UAAU,GAAuC,CAAC,EAC3D,IAAI,EACJ,IAAI,EACJ,SAAS,EACT,qBAAqB,GACxB,EAAE,EAAE;IACD,MAAM,EACF,SAAS,EACT,UAAU,EACV,uBAAuB,EACvB,QAAQ,GAAG,EAAE,EACb,UAAU,GAAG,KAAK,EAClB,kBAAkB,GAAG,IAAI,GAC5B,GAAG,IAAI,CAAC;IAET,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpE,MAAM,CAAC,UAAU,CAAC,GAAG,IAAA,qBAAa,EAAC,UAAU,EAAE,kBAAkB,CAAC,CAAC;IACnE,MAAM,EAAC,YAAY,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,kBAAkB,EAAC,GACnF,IAAA,wBAAgB,EAAC,QAAQ,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;IAEtD,MAAM,qBAAqB,GAAG,CAAC,MAAe,EAAE,EAAE,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAE9E,OAAO,CACH,uBAAC,WAAI,IAAC,SAAS,EAAE,CAAC,CAAC,EAAC,aAAa,EAAE,UAAU,EAAC,EAAE,SAAS,CAAC,YACtD,uBAAC,UAAG,cACA,uBAAC,UAAG,cACA,4CACI,uBAAC,2BAAiB,IACd,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,EAC9C,uBAAuB,EAAE,uBAAuB,EAChD,eAAe,EAAE,eAAe,EAChC,qBAAqB,EAAE,qBAAqB,GAC9C,EACF,uBAAC,sBAAY,IAAC,cAAc,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,KAAK,CAAC,YAC5D,uBAAC,0BAAgB,IACb,QAAQ,EAAE,qBAAqB,EAC/B,WAAW,EAAE,sBAAsB,EACnC,QAAQ,EAAE,eAAe,EACzB,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,eAAe,EAAE,qBAAqB,GACxC,GACS,IACb,GACJ,GACJ,GACH,CACV,CAAC;AACN,CAAC,CAAC;AApDW,QAAA,UAAU,cAoDrB;AAEF,kBAAe,kBAAU,CAAC","sourcesContent":["import * as React from 'react';\n\nimport OutsideClick from '../../../components/OutsideClick/OutsideClick';\nimport {Col, Grid, Row} from '../../../grid';\nimport {ClassNameProps, HeaderData, ThemedNavigationLogoData} from '../../../models';\nimport {block} from '../../../utils';\nimport {useActiveNavItem, useShowBorder} from '../../hooks';\nimport DesktopNavigation from '../DesktopNavigation/DesktopNavigation';\nimport MobileNavigation from '../MobileNavigation/MobileNavigation';\n\nimport './Navigation.scss';\n\nconst b = block('navigation');\n\nexport interface NavigationComponentProps extends ClassNameProps {\n logo: ThemedNavigationLogoData;\n data: HeaderData;\n mobilePortalContainer?: React.RefObject<HTMLElement>;\n}\n\nexport const Navigation: React.FC<NavigationComponentProps> = ({\n data,\n logo,\n className,\n mobilePortalContainer,\n}) => {\n const {\n leftItems,\n rightItems,\n customMobileHeaderItems,\n iconSize = 20,\n withBorder = false,\n withBorderOnScroll = true,\n } = data;\n\n const [isSidebarOpened, setIsSidebarOpened] = React.useState(false);\n const [showBorder] = useShowBorder(withBorder, withBorderOnScroll);\n const {activeItemId, leftItemsWithIconSize, rightItemsWithIconSize, onActiveItemChange} =\n useActiveNavItem(iconSize, leftItems, rightItems);\n\n const onSidebarOpenedChange = (isOpen: boolean) => setIsSidebarOpened(isOpen);\n\n return (\n <Grid className={b({'with-border': showBorder}, className)}>\n <Row>\n <Col>\n <nav>\n <DesktopNavigation\n logo={logo}\n activeItemId={activeItemId}\n onActiveItemChange={onActiveItemChange}\n leftItemsWithIconSize={leftItemsWithIconSize}\n rightItemsWithIconSize={rightItemsWithIconSize}\n customMobileHeaderItems={customMobileHeaderItems}\n isSidebarOpened={isSidebarOpened}\n onSidebarOpenedChange={onSidebarOpenedChange}\n />\n <OutsideClick onOutsideClick={() => onSidebarOpenedChange(false)}>\n <MobileNavigation\n topItems={leftItemsWithIconSize}\n bottomItems={rightItemsWithIconSize}\n isOpened={isSidebarOpened}\n activeItemId={activeItemId}\n onActiveItemChange={onActiveItemChange}\n portalContainer={mobilePortalContainer}\n />\n </OutsideClick>\n </nav>\n </Col>\n </Row>\n </Grid>\n );\n};\n\nexport default Navigation;\n"]}
|
|
@@ -50,6 +50,7 @@ export interface MobileNavigationProps extends ClassNameProps, ActiveItemProps {
|
|
|
50
50
|
isOpened?: boolean;
|
|
51
51
|
topItems?: NavigationItemModel[];
|
|
52
52
|
bottomItems?: NavigationItemModel[];
|
|
53
|
+
portalContainer?: React.RefObject<HTMLElement>;
|
|
53
54
|
}
|
|
54
55
|
export interface NavigationProps extends MobileMenuButtonProps, ActiveItemProps {
|
|
55
56
|
logo: ThemedNavigationLogoData;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"models.js","sourceRoot":"../../../src","sources":["navigation/models.ts"],"names":[],"mappings":";;;AAeA,IAAY,cAKX;AALD,WAAY,cAAc;IACtB,+BAAa,CAAA;IACb,iCAAe,CAAA;IACf,6BAAW,CAAA;IACX,mCAAiB,CAAA;AACrB,CAAC,EALW,cAAc,8BAAd,cAAc,QAKzB;AAED,IAAY,gBAIX;AAJD,WAAY,gBAAgB;IACxB,uCAAmB,CAAA;IACnB,qCAAiB,CAAA;IACjB,yCAAqB,CAAA;AACzB,CAAC,EAJW,gBAAgB,gCAAhB,gBAAgB,QAI3B","sourcesContent":["import * as React from 'react';\n\nimport {\n ClassNameProps,\n NavigationItemData,\n NavigationItemModel,\n NavigationLinkItem,\n ThemedNavigationLogoData,\n} from '../models';\n\nexport interface MobileMenuButtonProps {\n isSidebarOpened: boolean;\n onSidebarOpenedChange: (arg: boolean) => void;\n}\n\nexport enum ItemColumnName {\n Left = 'left',\n Right = 'right',\n Top = 'top',\n Bottom = 'bottom',\n}\n\nexport enum NavigationLayout {\n Desktop = 'desktop',\n Mobile = 'mobile',\n Dropdown = 'dropdown',\n}\n\nexport interface ActiveItemProps {\n activeItemId?: string;\n onActiveItemChange: (id?: string) => void;\n}\n\nexport interface MenuLayoutProps {\n menuLayout?: NavigationLayout;\n}\nexport interface NavigationItemProps extends ClassNameProps, MenuLayoutProps {\n data: NavigationItemData;\n onClick?: React.MouseEventHandler;\n isActive?: boolean;\n isTopLevel?: boolean;\n hidePopup?: () => void;\n}\n\nexport interface NavigationListItemProps extends MenuLayoutProps, ActiveItemProps, ClassNameProps {\n data: NavigationItemModel;\n column: ItemColumnName;\n index: number;\n}\n\nexport interface NavigationListProps\n extends Pick<NavigationListItemProps, 'column'>,\n MenuLayoutProps,\n ActiveItemProps,\n ClassNameProps {\n items: NavigationItemModel[];\n itemClassName?: string;\n}\n\nexport interface ItemsWrapperProps\n extends Pick<NavigationListProps, 'items'>,\n ActiveItemProps,\n ClassNameProps {}\n\nexport interface DesktopNavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n customMobileHeaderItems?: NavigationItemModel[];\n}\n\nexport interface MobileNavigationProps extends ClassNameProps, ActiveItemProps {\n isOpened?: boolean;\n topItems?: NavigationItemModel[];\n bottomItems?: NavigationItemModel[];\n}\n\nexport interface NavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n}\n\nexport interface NavigationPopupProps {\n open: boolean;\n items: NavigationLinkItem[];\n onClose: () => void;\n anchorRef: React.RefObject<Element>;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"models.js","sourceRoot":"../../../src","sources":["navigation/models.ts"],"names":[],"mappings":";;;AAeA,IAAY,cAKX;AALD,WAAY,cAAc;IACtB,+BAAa,CAAA;IACb,iCAAe,CAAA;IACf,6BAAW,CAAA;IACX,mCAAiB,CAAA;AACrB,CAAC,EALW,cAAc,8BAAd,cAAc,QAKzB;AAED,IAAY,gBAIX;AAJD,WAAY,gBAAgB;IACxB,uCAAmB,CAAA;IACnB,qCAAiB,CAAA;IACjB,yCAAqB,CAAA;AACzB,CAAC,EAJW,gBAAgB,gCAAhB,gBAAgB,QAI3B","sourcesContent":["import * as React from 'react';\n\nimport {\n ClassNameProps,\n NavigationItemData,\n NavigationItemModel,\n NavigationLinkItem,\n ThemedNavigationLogoData,\n} from '../models';\n\nexport interface MobileMenuButtonProps {\n isSidebarOpened: boolean;\n onSidebarOpenedChange: (arg: boolean) => void;\n}\n\nexport enum ItemColumnName {\n Left = 'left',\n Right = 'right',\n Top = 'top',\n Bottom = 'bottom',\n}\n\nexport enum NavigationLayout {\n Desktop = 'desktop',\n Mobile = 'mobile',\n Dropdown = 'dropdown',\n}\n\nexport interface ActiveItemProps {\n activeItemId?: string;\n onActiveItemChange: (id?: string) => void;\n}\n\nexport interface MenuLayoutProps {\n menuLayout?: NavigationLayout;\n}\nexport interface NavigationItemProps extends ClassNameProps, MenuLayoutProps {\n data: NavigationItemData;\n onClick?: React.MouseEventHandler;\n isActive?: boolean;\n isTopLevel?: boolean;\n hidePopup?: () => void;\n}\n\nexport interface NavigationListItemProps extends MenuLayoutProps, ActiveItemProps, ClassNameProps {\n data: NavigationItemModel;\n column: ItemColumnName;\n index: number;\n}\n\nexport interface NavigationListProps\n extends Pick<NavigationListItemProps, 'column'>,\n MenuLayoutProps,\n ActiveItemProps,\n ClassNameProps {\n items: NavigationItemModel[];\n itemClassName?: string;\n}\n\nexport interface ItemsWrapperProps\n extends Pick<NavigationListProps, 'items'>,\n ActiveItemProps,\n ClassNameProps {}\n\nexport interface DesktopNavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n customMobileHeaderItems?: NavigationItemModel[];\n}\n\nexport interface MobileNavigationProps extends ClassNameProps, ActiveItemProps {\n isOpened?: boolean;\n topItems?: NavigationItemModel[];\n bottomItems?: NavigationItemModel[];\n portalContainer?: React.RefObject<HTMLElement>;\n}\n\nexport interface NavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n}\n\nexport interface NavigationPopupProps {\n open: boolean;\n items: NavigationLinkItem[];\n onClose: () => void;\n anchorRef: React.RefObject<Element>;\n}\n"]}
|
|
@@ -8,13 +8,13 @@ import { ItemColumnName, NavigationLayout } from "../../models.js";
|
|
|
8
8
|
import { NavigationList } from "../NavigationList/NavigationList.js";
|
|
9
9
|
import './MobileNavigation.css';
|
|
10
10
|
const b = block('mobile-navigation');
|
|
11
|
-
export const MobileNavigation = ({ isOpened, topItems, bottomItems, ...props }) => {
|
|
11
|
+
export const MobileNavigation = ({ isOpened, topItems, bottomItems, portalContainer, ...props }) => {
|
|
12
12
|
const [isMounted, setIsMounted] = React.useState(false);
|
|
13
13
|
useMount(() => setIsMounted(true));
|
|
14
14
|
if (!isMounted) {
|
|
15
15
|
return null;
|
|
16
16
|
}
|
|
17
|
-
return (_jsx(Portal, { children: _jsx(Foldable, { className: b(), isOpened: Boolean(isOpened), children: _jsxs("div", { className: b('wrapper'), children: [topItems && (_jsx(NavigationList, { className: b('rows'), items: topItems, column: ItemColumnName.Top, menuLayout: NavigationLayout.Mobile, ...props })), bottomItems && (_jsx(NavigationList, { className: b('rows'), items: bottomItems, column: ItemColumnName.Bottom, menuLayout: NavigationLayout.Mobile, ...props }))] }) }, topItems?.length) }));
|
|
17
|
+
return (_jsx(Portal, { container: portalContainer?.current ?? undefined, children: _jsx(Foldable, { className: b(), isOpened: Boolean(isOpened), children: _jsxs("div", { className: b('wrapper'), children: [topItems && (_jsx(NavigationList, { className: b('rows'), items: topItems, column: ItemColumnName.Top, menuLayout: NavigationLayout.Mobile, ...props })), bottomItems && (_jsx(NavigationList, { className: b('rows'), items: bottomItems, column: ItemColumnName.Bottom, menuLayout: NavigationLayout.Mobile, ...props }))] }) }, topItems?.length) }));
|
|
18
18
|
};
|
|
19
19
|
export default MobileNavigation;
|
|
20
20
|
//# sourceMappingURL=MobileNavigation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MobileNavigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/MobileNavigation/MobileNavigation.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,MAAM,EAAC,MAAM,mBAAmB,CAAC;AAEzC,OAAO,QAAQ,iDAA8C;AAC7D,OAAO,EAAC,QAAQ,EAAC,gCAAuB;AACxC,OAAO,EAAC,KAAK,EAAC,gCAAuB;AACrC,OAAO,EAAC,cAAc,EAAyB,gBAAgB,EAAC,wBAAqB;AACrF,OAAO,EAAC,cAAc,EAAC,4CAAyC;AAEhE,OAAO,wBAAwB,CAAC;AAEhC,MAAM,CAAC,GAAG,KAAK,CAAC,mBAAmB,CAAC,CAAC;AAErC,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAC9D,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,QAAQ,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;IAEnC,IAAI,CAAC,SAAS,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO,CACH,KAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"MobileNavigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/MobileNavigation/MobileNavigation.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,MAAM,EAAC,MAAM,mBAAmB,CAAC;AAEzC,OAAO,QAAQ,iDAA8C;AAC7D,OAAO,EAAC,QAAQ,EAAC,gCAAuB;AACxC,OAAO,EAAC,KAAK,EAAC,gCAAuB;AACrC,OAAO,EAAC,cAAc,EAAyB,gBAAgB,EAAC,wBAAqB;AACrF,OAAO,EAAC,cAAc,EAAC,4CAAyC;AAEhE,OAAO,wBAAwB,CAAC;AAEhC,MAAM,CAAC,GAAG,KAAK,CAAC,mBAAmB,CAAC,CAAC;AAErC,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAC9D,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,eAAe,EACf,GAAG,KAAK,EACX,EAAE,EAAE;IACD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,QAAQ,CAAC,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;IAEnC,IAAI,CAAC,SAAS,EAAE,CAAC;QACb,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO,CACH,KAAC,MAAM,IAAC,SAAS,EAAE,eAAe,EAAE,OAAO,IAAI,SAAS,YACpD,KAAC,QAAQ,IAAwB,SAAS,EAAE,CAAC,EAAE,EAAE,QAAQ,EAAE,OAAO,CAAC,QAAQ,CAAC,YACxE,eAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aACvB,QAAQ,IAAI,CACT,KAAC,cAAc,IACX,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,KAAK,EAAE,QAAQ,EACf,MAAM,EAAE,cAAc,CAAC,GAAG,EAC1B,UAAU,EAAE,gBAAgB,CAAC,MAAM,KAC/B,KAAK,GACX,CACL,EACA,WAAW,IAAI,CACZ,KAAC,cAAc,IACX,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,cAAc,CAAC,MAAM,EAC7B,UAAU,EAAE,gBAAgB,CAAC,MAAM,KAC/B,KAAK,GACX,CACL,IACC,IApBK,QAAQ,EAAE,MAAM,CAqBpB,GACN,CACZ,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Portal} from '@gravity-ui/uikit';\n\nimport Foldable from '../../../components/Foldable/Foldable';\nimport {useMount} from '../../../hooks';\nimport {block} from '../../../utils';\nimport {ItemColumnName, MobileNavigationProps, NavigationLayout} from '../../models';\nimport {NavigationList} from '../NavigationList/NavigationList';\n\nimport './MobileNavigation.scss';\n\nconst b = block('mobile-navigation');\n\nexport const MobileNavigation: React.FC<MobileNavigationProps> = ({\n isOpened,\n topItems,\n bottomItems,\n portalContainer,\n ...props\n}) => {\n const [isMounted, setIsMounted] = React.useState(false);\n\n useMount(() => setIsMounted(true));\n\n if (!isMounted) {\n return null;\n }\n\n return (\n <Portal container={portalContainer?.current ?? undefined}>\n <Foldable key={topItems?.length} className={b()} isOpened={Boolean(isOpened)}>\n <div className={b('wrapper')}>\n {topItems && (\n <NavigationList\n className={b('rows')}\n items={topItems}\n column={ItemColumnName.Top}\n menuLayout={NavigationLayout.Mobile}\n {...props}\n />\n )}\n {bottomItems && (\n <NavigationList\n className={b('rows')}\n items={bottomItems}\n column={ItemColumnName.Bottom}\n menuLayout={NavigationLayout.Mobile}\n {...props}\n />\n )}\n </div>\n </Foldable>\n </Portal>\n );\n};\n\nexport default MobileNavigation;\n"]}
|
|
@@ -4,6 +4,7 @@ import './Navigation.css';
|
|
|
4
4
|
export interface NavigationComponentProps extends ClassNameProps {
|
|
5
5
|
logo: ThemedNavigationLogoData;
|
|
6
6
|
data: HeaderData;
|
|
7
|
+
mobilePortalContainer?: React.RefObject<HTMLElement>;
|
|
7
8
|
}
|
|
8
9
|
export declare const Navigation: React.FC<NavigationComponentProps>;
|
|
9
10
|
export default Navigation;
|
|
@@ -8,13 +8,13 @@ import DesktopNavigation from "../DesktopNavigation/DesktopNavigation.js";
|
|
|
8
8
|
import MobileNavigation from "../MobileNavigation/MobileNavigation.js";
|
|
9
9
|
import './Navigation.css';
|
|
10
10
|
const b = block('navigation');
|
|
11
|
-
export const Navigation = ({ data, logo, className }) => {
|
|
11
|
+
export const Navigation = ({ data, logo, className, mobilePortalContainer, }) => {
|
|
12
12
|
const { leftItems, rightItems, customMobileHeaderItems, iconSize = 20, withBorder = false, withBorderOnScroll = true, } = data;
|
|
13
13
|
const [isSidebarOpened, setIsSidebarOpened] = React.useState(false);
|
|
14
14
|
const [showBorder] = useShowBorder(withBorder, withBorderOnScroll);
|
|
15
15
|
const { activeItemId, leftItemsWithIconSize, rightItemsWithIconSize, onActiveItemChange } = useActiveNavItem(iconSize, leftItems, rightItems);
|
|
16
16
|
const onSidebarOpenedChange = (isOpen) => setIsSidebarOpened(isOpen);
|
|
17
|
-
return (_jsx(Grid, { className: b({ 'with-border': showBorder }, className), children: _jsx(Row, { children: _jsx(Col, { children: _jsxs("nav", { children: [_jsx(DesktopNavigation, { logo: logo, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange, leftItemsWithIconSize: leftItemsWithIconSize, rightItemsWithIconSize: rightItemsWithIconSize, customMobileHeaderItems: customMobileHeaderItems, isSidebarOpened: isSidebarOpened, onSidebarOpenedChange: onSidebarOpenedChange }), _jsx(OutsideClick, { onOutsideClick: () => onSidebarOpenedChange(false), children: _jsx(MobileNavigation, { topItems: leftItemsWithIconSize, bottomItems: rightItemsWithIconSize, isOpened: isSidebarOpened, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange }) })] }) }) }) }));
|
|
17
|
+
return (_jsx(Grid, { className: b({ 'with-border': showBorder }, className), children: _jsx(Row, { children: _jsx(Col, { children: _jsxs("nav", { children: [_jsx(DesktopNavigation, { logo: logo, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange, leftItemsWithIconSize: leftItemsWithIconSize, rightItemsWithIconSize: rightItemsWithIconSize, customMobileHeaderItems: customMobileHeaderItems, isSidebarOpened: isSidebarOpened, onSidebarOpenedChange: onSidebarOpenedChange }), _jsx(OutsideClick, { onOutsideClick: () => onSidebarOpenedChange(false), children: _jsx(MobileNavigation, { topItems: leftItemsWithIconSize, bottomItems: rightItemsWithIconSize, isOpened: isSidebarOpened, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange, portalContainer: mobilePortalContainer }) })] }) }) }) }));
|
|
18
18
|
};
|
|
19
19
|
export default Navigation;
|
|
20
20
|
//# sourceMappingURL=Navigation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Navigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/Navigation/Navigation.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,YAAY,yDAAsD;AACzE,OAAO,EAAC,GAAG,EAAE,IAAI,EAAE,GAAG,EAAC,+BAAsB;AAE7C,OAAO,EAAC,KAAK,EAAC,gCAAuB;AACrC,OAAO,EAAC,gBAAgB,EAAE,aAAa,EAAC,6BAAoB;AAC5D,OAAO,iBAAiB,kDAA+C;AACvE,OAAO,gBAAgB,gDAA6C;AAEpE,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"Navigation.js","sourceRoot":"../../../../../src","sources":["navigation/components/Navigation/Navigation.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,YAAY,yDAAsD;AACzE,OAAO,EAAC,GAAG,EAAE,IAAI,EAAE,GAAG,EAAC,+BAAsB;AAE7C,OAAO,EAAC,KAAK,EAAC,gCAAuB;AACrC,OAAO,EAAC,gBAAgB,EAAE,aAAa,EAAC,6BAAoB;AAC5D,OAAO,iBAAiB,kDAA+C;AACvE,OAAO,gBAAgB,gDAA6C;AAEpE,OAAO,kBAAkB,CAAC;AAE1B,MAAM,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;AAQ9B,MAAM,CAAC,MAAM,UAAU,GAAuC,CAAC,EAC3D,IAAI,EACJ,IAAI,EACJ,SAAS,EACT,qBAAqB,GACxB,EAAE,EAAE;IACD,MAAM,EACF,SAAS,EACT,UAAU,EACV,uBAAuB,EACvB,QAAQ,GAAG,EAAE,EACb,UAAU,GAAG,KAAK,EAClB,kBAAkB,GAAG,IAAI,GAC5B,GAAG,IAAI,CAAC;IAET,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpE,MAAM,CAAC,UAAU,CAAC,GAAG,aAAa,CAAC,UAAU,EAAE,kBAAkB,CAAC,CAAC;IACnE,MAAM,EAAC,YAAY,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,kBAAkB,EAAC,GACnF,gBAAgB,CAAC,QAAQ,EAAE,SAAS,EAAE,UAAU,CAAC,CAAC;IAEtD,MAAM,qBAAqB,GAAG,CAAC,MAAe,EAAE,EAAE,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC;IAE9E,OAAO,CACH,KAAC,IAAI,IAAC,SAAS,EAAE,CAAC,CAAC,EAAC,aAAa,EAAE,UAAU,EAAC,EAAE,SAAS,CAAC,YACtD,KAAC,GAAG,cACA,KAAC,GAAG,cACA,0BACI,KAAC,iBAAiB,IACd,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,EAC9C,uBAAuB,EAAE,uBAAuB,EAChD,eAAe,EAAE,eAAe,EAChC,qBAAqB,EAAE,qBAAqB,GAC9C,EACF,KAAC,YAAY,IAAC,cAAc,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,KAAK,CAAC,YAC5D,KAAC,gBAAgB,IACb,QAAQ,EAAE,qBAAqB,EAC/B,WAAW,EAAE,sBAAsB,EACnC,QAAQ,EAAE,eAAe,EACzB,YAAY,EAAE,YAAY,EAC1B,kBAAkB,EAAE,kBAAkB,EACtC,eAAe,EAAE,qBAAqB,GACxC,GACS,IACb,GACJ,GACJ,GACH,CACV,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import * as React from 'react';\n\nimport OutsideClick from '../../../components/OutsideClick/OutsideClick';\nimport {Col, Grid, Row} from '../../../grid';\nimport {ClassNameProps, HeaderData, ThemedNavigationLogoData} from '../../../models';\nimport {block} from '../../../utils';\nimport {useActiveNavItem, useShowBorder} from '../../hooks';\nimport DesktopNavigation from '../DesktopNavigation/DesktopNavigation';\nimport MobileNavigation from '../MobileNavigation/MobileNavigation';\n\nimport './Navigation.scss';\n\nconst b = block('navigation');\n\nexport interface NavigationComponentProps extends ClassNameProps {\n logo: ThemedNavigationLogoData;\n data: HeaderData;\n mobilePortalContainer?: React.RefObject<HTMLElement>;\n}\n\nexport const Navigation: React.FC<NavigationComponentProps> = ({\n data,\n logo,\n className,\n mobilePortalContainer,\n}) => {\n const {\n leftItems,\n rightItems,\n customMobileHeaderItems,\n iconSize = 20,\n withBorder = false,\n withBorderOnScroll = true,\n } = data;\n\n const [isSidebarOpened, setIsSidebarOpened] = React.useState(false);\n const [showBorder] = useShowBorder(withBorder, withBorderOnScroll);\n const {activeItemId, leftItemsWithIconSize, rightItemsWithIconSize, onActiveItemChange} =\n useActiveNavItem(iconSize, leftItems, rightItems);\n\n const onSidebarOpenedChange = (isOpen: boolean) => setIsSidebarOpened(isOpen);\n\n return (\n <Grid className={b({'with-border': showBorder}, className)}>\n <Row>\n <Col>\n <nav>\n <DesktopNavigation\n logo={logo}\n activeItemId={activeItemId}\n onActiveItemChange={onActiveItemChange}\n leftItemsWithIconSize={leftItemsWithIconSize}\n rightItemsWithIconSize={rightItemsWithIconSize}\n customMobileHeaderItems={customMobileHeaderItems}\n isSidebarOpened={isSidebarOpened}\n onSidebarOpenedChange={onSidebarOpenedChange}\n />\n <OutsideClick onOutsideClick={() => onSidebarOpenedChange(false)}>\n <MobileNavigation\n topItems={leftItemsWithIconSize}\n bottomItems={rightItemsWithIconSize}\n isOpened={isSidebarOpened}\n activeItemId={activeItemId}\n onActiveItemChange={onActiveItemChange}\n portalContainer={mobilePortalContainer}\n />\n </OutsideClick>\n </nav>\n </Col>\n </Row>\n </Grid>\n );\n};\n\nexport default Navigation;\n"]}
|
|
@@ -50,6 +50,7 @@ export interface MobileNavigationProps extends ClassNameProps, ActiveItemProps {
|
|
|
50
50
|
isOpened?: boolean;
|
|
51
51
|
topItems?: NavigationItemModel[];
|
|
52
52
|
bottomItems?: NavigationItemModel[];
|
|
53
|
+
portalContainer?: React.RefObject<HTMLElement>;
|
|
53
54
|
}
|
|
54
55
|
export interface NavigationProps extends MobileMenuButtonProps, ActiveItemProps {
|
|
55
56
|
logo: ThemedNavigationLogoData;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"models.js","sourceRoot":"../../../src","sources":["navigation/models.ts"],"names":[],"mappings":"AAeA,MAAM,CAAN,IAAY,cAKX;AALD,WAAY,cAAc;IACtB,+BAAa,CAAA;IACb,iCAAe,CAAA;IACf,6BAAW,CAAA;IACX,mCAAiB,CAAA;AACrB,CAAC,EALW,cAAc,KAAd,cAAc,QAKzB;AAED,MAAM,CAAN,IAAY,gBAIX;AAJD,WAAY,gBAAgB;IACxB,uCAAmB,CAAA;IACnB,qCAAiB,CAAA;IACjB,yCAAqB,CAAA;AACzB,CAAC,EAJW,gBAAgB,KAAhB,gBAAgB,QAI3B","sourcesContent":["import * as React from 'react';\n\nimport {\n ClassNameProps,\n NavigationItemData,\n NavigationItemModel,\n NavigationLinkItem,\n ThemedNavigationLogoData,\n} from '../models';\n\nexport interface MobileMenuButtonProps {\n isSidebarOpened: boolean;\n onSidebarOpenedChange: (arg: boolean) => void;\n}\n\nexport enum ItemColumnName {\n Left = 'left',\n Right = 'right',\n Top = 'top',\n Bottom = 'bottom',\n}\n\nexport enum NavigationLayout {\n Desktop = 'desktop',\n Mobile = 'mobile',\n Dropdown = 'dropdown',\n}\n\nexport interface ActiveItemProps {\n activeItemId?: string;\n onActiveItemChange: (id?: string) => void;\n}\n\nexport interface MenuLayoutProps {\n menuLayout?: NavigationLayout;\n}\nexport interface NavigationItemProps extends ClassNameProps, MenuLayoutProps {\n data: NavigationItemData;\n onClick?: React.MouseEventHandler;\n isActive?: boolean;\n isTopLevel?: boolean;\n hidePopup?: () => void;\n}\n\nexport interface NavigationListItemProps extends MenuLayoutProps, ActiveItemProps, ClassNameProps {\n data: NavigationItemModel;\n column: ItemColumnName;\n index: number;\n}\n\nexport interface NavigationListProps\n extends Pick<NavigationListItemProps, 'column'>,\n MenuLayoutProps,\n ActiveItemProps,\n ClassNameProps {\n items: NavigationItemModel[];\n itemClassName?: string;\n}\n\nexport interface ItemsWrapperProps\n extends Pick<NavigationListProps, 'items'>,\n ActiveItemProps,\n ClassNameProps {}\n\nexport interface DesktopNavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n customMobileHeaderItems?: NavigationItemModel[];\n}\n\nexport interface MobileNavigationProps extends ClassNameProps, ActiveItemProps {\n isOpened?: boolean;\n topItems?: NavigationItemModel[];\n bottomItems?: NavigationItemModel[];\n}\n\nexport interface NavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n}\n\nexport interface NavigationPopupProps {\n open: boolean;\n items: NavigationLinkItem[];\n onClose: () => void;\n anchorRef: React.RefObject<Element>;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"models.js","sourceRoot":"../../../src","sources":["navigation/models.ts"],"names":[],"mappings":"AAeA,MAAM,CAAN,IAAY,cAKX;AALD,WAAY,cAAc;IACtB,+BAAa,CAAA;IACb,iCAAe,CAAA;IACf,6BAAW,CAAA;IACX,mCAAiB,CAAA;AACrB,CAAC,EALW,cAAc,KAAd,cAAc,QAKzB;AAED,MAAM,CAAN,IAAY,gBAIX;AAJD,WAAY,gBAAgB;IACxB,uCAAmB,CAAA;IACnB,qCAAiB,CAAA;IACjB,yCAAqB,CAAA;AACzB,CAAC,EAJW,gBAAgB,KAAhB,gBAAgB,QAI3B","sourcesContent":["import * as React from 'react';\n\nimport {\n ClassNameProps,\n NavigationItemData,\n NavigationItemModel,\n NavigationLinkItem,\n ThemedNavigationLogoData,\n} from '../models';\n\nexport interface MobileMenuButtonProps {\n isSidebarOpened: boolean;\n onSidebarOpenedChange: (arg: boolean) => void;\n}\n\nexport enum ItemColumnName {\n Left = 'left',\n Right = 'right',\n Top = 'top',\n Bottom = 'bottom',\n}\n\nexport enum NavigationLayout {\n Desktop = 'desktop',\n Mobile = 'mobile',\n Dropdown = 'dropdown',\n}\n\nexport interface ActiveItemProps {\n activeItemId?: string;\n onActiveItemChange: (id?: string) => void;\n}\n\nexport interface MenuLayoutProps {\n menuLayout?: NavigationLayout;\n}\nexport interface NavigationItemProps extends ClassNameProps, MenuLayoutProps {\n data: NavigationItemData;\n onClick?: React.MouseEventHandler;\n isActive?: boolean;\n isTopLevel?: boolean;\n hidePopup?: () => void;\n}\n\nexport interface NavigationListItemProps extends MenuLayoutProps, ActiveItemProps, ClassNameProps {\n data: NavigationItemModel;\n column: ItemColumnName;\n index: number;\n}\n\nexport interface NavigationListProps\n extends Pick<NavigationListItemProps, 'column'>,\n MenuLayoutProps,\n ActiveItemProps,\n ClassNameProps {\n items: NavigationItemModel[];\n itemClassName?: string;\n}\n\nexport interface ItemsWrapperProps\n extends Pick<NavigationListProps, 'items'>,\n ActiveItemProps,\n ClassNameProps {}\n\nexport interface DesktopNavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n customMobileHeaderItems?: NavigationItemModel[];\n}\n\nexport interface MobileNavigationProps extends ClassNameProps, ActiveItemProps {\n isOpened?: boolean;\n topItems?: NavigationItemModel[];\n bottomItems?: NavigationItemModel[];\n portalContainer?: React.RefObject<HTMLElement>;\n}\n\nexport interface NavigationProps extends MobileMenuButtonProps, ActiveItemProps {\n logo: ThemedNavigationLogoData;\n leftItemsWithIconSize: NavigationItemModel[];\n rightItemsWithIconSize?: NavigationItemModel[];\n}\n\nexport interface NavigationPopupProps {\n open: boolean;\n items: NavigationLinkItem[];\n onClose: () => void;\n anchorRef: React.RefObject<Element>;\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gravity-ui/page-constructor",
|
|
3
|
-
"version": "6.2.
|
|
3
|
+
"version": "6.2.1",
|
|
4
4
|
"description": "Gravity UI Page Constructor",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -99,17 +99,12 @@
|
|
|
99
99
|
"@bem-react/classname": "^1.6.0",
|
|
100
100
|
"@gravity-ui/components": "^4.0.1",
|
|
101
101
|
"@gravity-ui/dynamic-forms": "^5.0.0",
|
|
102
|
-
"@gravity-ui/gulp-utils": "^1.0.1",
|
|
103
102
|
"@gravity-ui/i18n": "^1.7.0",
|
|
104
103
|
"@react-spring/web": "^9.7.3",
|
|
105
|
-
"@testing-library/dom": "^10.4.0",
|
|
106
104
|
"ajv": "^8.12.0",
|
|
107
105
|
"ajv-keywords": "^5.1.0",
|
|
108
106
|
"final-form": "^4.20.9",
|
|
109
107
|
"github-buttons": "2.23.0",
|
|
110
|
-
"gulp-cli": "^3.0.0",
|
|
111
|
-
"gulp-sass": "^6.0.0",
|
|
112
|
-
"gulp-sourcemaps": "^3.0.0",
|
|
113
108
|
"js-yaml-source-map": "^0.2.2",
|
|
114
109
|
"lodash": "^4.17.21",
|
|
115
110
|
"monaco-editor": "^0.38.0",
|
|
@@ -141,6 +136,7 @@
|
|
|
141
136
|
"@commitlint/config-conventional": "^19.6.0",
|
|
142
137
|
"@diplodoc/transform": "^4.10.8",
|
|
143
138
|
"@gravity-ui/eslint-config": "^3.2.0",
|
|
139
|
+
"@gravity-ui/gulp-utils": "^1.0.3",
|
|
144
140
|
"@gravity-ui/icons": "^2.11.0",
|
|
145
141
|
"@gravity-ui/prettier-config": "^1.1.0",
|
|
146
142
|
"@gravity-ui/stylelint-config": "^4.0.1",
|
|
@@ -157,6 +153,7 @@
|
|
|
157
153
|
"@storybook/preset-scss": "^1.0.3",
|
|
158
154
|
"@storybook/react": "8.0.5",
|
|
159
155
|
"@storybook/react-webpack5": "8.0.5",
|
|
156
|
+
"@testing-library/dom": "^10.4.0",
|
|
160
157
|
"@testing-library/jest-dom": "^5.16.5",
|
|
161
158
|
"@testing-library/react": "^16.1.0",
|
|
162
159
|
"@testing-library/user-event": "^14.4.3",
|
|
@@ -181,7 +178,10 @@
|
|
|
181
178
|
"eslint-plugin-react": "^7.37.4",
|
|
182
179
|
"eslint-plugin-testing-library": "^6.5.0",
|
|
183
180
|
"gulp": "^5.0.0",
|
|
181
|
+
"gulp-cli": "^3.0.0",
|
|
184
182
|
"gulp-replace": "^1.1.4",
|
|
183
|
+
"gulp-sass": "^6.0.1",
|
|
184
|
+
"gulp-sourcemaps": "^3.0.0",
|
|
185
185
|
"gulp-ts-alias": "^2.0.0",
|
|
186
186
|
"gulp-typescript": "^6.0.0-alpha.1",
|
|
187
187
|
"html-loader": "^1.3.2",
|