@gravity-ui/page-constructor 1.7.0-alpha.4 → 1.7.0-alpha.5
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/components/navigation/components/NavigationItem/NavigationItem.d.ts +0 -1
- package/build/cjs/components/navigation/components/NavigationItem/NavigationItem.js +3 -4
- package/build/cjs/components/navigation/components/NavigationPopup/NavigationPopup.js +1 -3
- package/build/cjs/models/navigation.d.ts +0 -1
- package/build/esm/components/navigation/components/NavigationItem/NavigationItem.d.ts +0 -1
- package/build/esm/components/navigation/components/NavigationItem/NavigationItem.js +3 -4
- package/build/esm/components/navigation/components/NavigationPopup/NavigationPopup.js +2 -4
- package/build/esm/models/navigation.d.ts +0 -1
- package/package.json +1 -1
- package/server/models/navigation.d.ts +0 -1
- package/build/cjs/components/navigation/components/NavigationPopup/NavigationPopup-class.d.ts +0 -24
- package/build/cjs/components/navigation/components/NavigationPopup/NavigationPopup-class.js +0 -57
- package/build/esm/components/navigation/components/NavigationPopup/NavigationPopup-class.d.ts +0 -25
- package/build/esm/components/navigation/components/NavigationPopup/NavigationPopup-class.js +0 -54
|
@@ -22,10 +22,9 @@ const NavigationDropdown = (_a) => {
|
|
|
22
22
|
react_1.default.createElement(index_1.ToggleArrow, { className: b('dropdown'), size: 12, type: 'vertical', iconType: "navigation", open: isOpened })));
|
|
23
23
|
};
|
|
24
24
|
const NavigationLink = (props) => {
|
|
25
|
-
const { hostname
|
|
26
|
-
const { url, text, icon, arrow, target
|
|
27
|
-
const
|
|
28
|
-
const linkExtraProps = (0, utils_1.getLinkProps)(url, currentHostname, target);
|
|
25
|
+
const { hostname } = (0, react_1.useContext)(locationContext_1.LocationContext);
|
|
26
|
+
const { url, text, icon, arrow, target } = props, rest = (0, tslib_1.__rest)(props, ["url", "text", "icon", "arrow", "target"]);
|
|
27
|
+
const linkExtraProps = (0, utils_1.getLinkProps)(url, hostname, target);
|
|
29
28
|
const iconData = icon && (0, utils_2.getMediaImage)(icon);
|
|
30
29
|
const content = (react_1.default.createElement(react_1.Fragment, null,
|
|
31
30
|
react_1.default.createElement(Content, { text: text, icon: iconData }),
|
|
@@ -8,12 +8,10 @@ const react_1 = (0, tslib_1.__importStar)(require("react"));
|
|
|
8
8
|
const uikit_1 = require("@gravity-ui/uikit");
|
|
9
9
|
const index_1 = require("../../../index");
|
|
10
10
|
const NavigationItem_1 = (0, tslib_1.__importDefault)(require("../NavigationItem/NavigationItem"));
|
|
11
|
-
const locationContext_1 = require("../../../../context/locationContext");
|
|
12
11
|
const b = (0, bem_cn_lite_1.default)('navigation-popup');
|
|
13
12
|
const NavigationPopup = ({ items, left, onClose }) => {
|
|
14
13
|
const [calculatedLeft, setCalculatedLeft] = (0, react_1.useState)(left);
|
|
15
14
|
const popupRef = (0, react_1.useRef)(null);
|
|
16
|
-
const { hostname } = (0, react_1.useContext)(locationContext_1.LocationContext);
|
|
17
15
|
const calculateLeft = (0, react_1.useCallback)(() => {
|
|
18
16
|
if (popupRef && popupRef.current && left) {
|
|
19
17
|
const right = left + popupRef.current.offsetWidth;
|
|
@@ -39,7 +37,7 @@ const NavigationPopup = ({ items, left, onClose }) => {
|
|
|
39
37
|
if (!document || !document.body) {
|
|
40
38
|
return null;
|
|
41
39
|
}
|
|
42
|
-
const renderDefaultPopup = (react_1.default.createElement(react_1.Fragment, null, items.map((item) => (react_1.default.createElement(NavigationItem_1.default, { key: item.text, className: b('link'), data: item
|
|
40
|
+
const renderDefaultPopup = (react_1.default.createElement(react_1.Fragment, null, items.map((item) => (react_1.default.createElement(NavigationItem_1.default, { key: item.text, className: b('link'), data: item })))));
|
|
43
41
|
return (react_1.default.createElement(uikit_1.Portal, null,
|
|
44
42
|
react_1.default.createElement("div", { ref: popupRef, className: b(), style: { left: calculatedLeft } },
|
|
45
43
|
react_1.default.createElement(index_1.OutsideClick, { onOutsideClick: onClose }, renderDefaultPopup))));
|
|
@@ -21,10 +21,9 @@ const NavigationDropdown = (_a) => {
|
|
|
21
21
|
React.createElement(ToggleArrow, { className: b('dropdown'), size: 12, type: 'vertical', iconType: "navigation", open: isOpened })));
|
|
22
22
|
};
|
|
23
23
|
const NavigationLink = (props) => {
|
|
24
|
-
const { hostname
|
|
25
|
-
const { url, text, icon, arrow, target
|
|
26
|
-
const
|
|
27
|
-
const linkExtraProps = getLinkProps(url, currentHostname, target);
|
|
24
|
+
const { hostname } = useContext(LocationContext);
|
|
25
|
+
const { url, text, icon, arrow, target } = props, rest = __rest(props, ["url", "text", "icon", "arrow", "target"]);
|
|
26
|
+
const linkExtraProps = getLinkProps(url, hostname, target);
|
|
28
27
|
const iconData = icon && getMediaImage(icon);
|
|
29
28
|
const content = (React.createElement(Fragment, null,
|
|
30
29
|
React.createElement(Content, { text: text, icon: iconData }),
|
|
@@ -1,16 +1,14 @@
|
|
|
1
1
|
import _ from 'lodash';
|
|
2
2
|
import block from 'bem-cn-lite';
|
|
3
|
-
import React, { Fragment, useRef, useState, useEffect, useCallback
|
|
3
|
+
import React, { Fragment, useRef, useState, useEffect, useCallback } from 'react';
|
|
4
4
|
import { Portal } from '@gravity-ui/uikit';
|
|
5
5
|
import { OutsideClick } from '../../../index';
|
|
6
6
|
import NavigationItem from '../NavigationItem/NavigationItem';
|
|
7
7
|
import './NavigationPopup.css';
|
|
8
|
-
import { LocationContext } from '../../../../context/locationContext';
|
|
9
8
|
const b = block('navigation-popup');
|
|
10
9
|
export const NavigationPopup = ({ items, left, onClose }) => {
|
|
11
10
|
const [calculatedLeft, setCalculatedLeft] = useState(left);
|
|
12
11
|
const popupRef = useRef(null);
|
|
13
|
-
const { hostname } = useContext(LocationContext);
|
|
14
12
|
const calculateLeft = useCallback(() => {
|
|
15
13
|
if (popupRef && popupRef.current && left) {
|
|
16
14
|
const right = left + popupRef.current.offsetWidth;
|
|
@@ -36,7 +34,7 @@ export const NavigationPopup = ({ items, left, onClose }) => {
|
|
|
36
34
|
if (!document || !document.body) {
|
|
37
35
|
return null;
|
|
38
36
|
}
|
|
39
|
-
const renderDefaultPopup = (React.createElement(Fragment, null, items.map((item) => (React.createElement(NavigationItem, { key: item.text, className: b('link'), data: item
|
|
37
|
+
const renderDefaultPopup = (React.createElement(Fragment, null, items.map((item) => (React.createElement(NavigationItem, { key: item.text, className: b('link'), data: item })))));
|
|
40
38
|
return (React.createElement(Portal, null,
|
|
41
39
|
React.createElement("div", { ref: popupRef, className: b(), style: { left: calculatedLeft } },
|
|
42
40
|
React.createElement(OutsideClick, { onOutsideClick: onClose }, renderDefaultPopup))));
|
package/package.json
CHANGED
package/build/cjs/components/navigation/components/NavigationPopup/NavigationPopup-class.d.ts
DELETED
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import React, { RefObject } from 'react';
|
|
2
|
-
import { NavigationLinkItem } from '../../../../models/navigation';
|
|
3
|
-
export interface NavigationPopupProps {
|
|
4
|
-
items: NavigationLinkItem[];
|
|
5
|
-
onClose: () => void;
|
|
6
|
-
left?: number;
|
|
7
|
-
className?: string;
|
|
8
|
-
}
|
|
9
|
-
interface NavigationPopupState {
|
|
10
|
-
calculatedLeft?: number;
|
|
11
|
-
}
|
|
12
|
-
export default class NavigationPopup extends React.Component<NavigationPopupProps, NavigationPopupState> {
|
|
13
|
-
ref: RefObject<HTMLDivElement>;
|
|
14
|
-
state: {
|
|
15
|
-
calculatedLeft: number | undefined;
|
|
16
|
-
};
|
|
17
|
-
private calculateLeft;
|
|
18
|
-
componentDidMount(): void;
|
|
19
|
-
componentDidUpdate(prevProps: NavigationPopupProps): void;
|
|
20
|
-
componentWillUnmount(): void;
|
|
21
|
-
render(): JSX.Element | null;
|
|
22
|
-
private renderDefaultPopup;
|
|
23
|
-
}
|
|
24
|
-
export {};
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const tslib_1 = require("tslib");
|
|
4
|
-
const lodash_1 = (0, tslib_1.__importDefault)(require("lodash"));
|
|
5
|
-
const bem_cn_lite_1 = (0, tslib_1.__importDefault)(require("bem-cn-lite"));
|
|
6
|
-
const react_1 = (0, tslib_1.__importStar)(require("react"));
|
|
7
|
-
const uikit_1 = require("@gravity-ui/uikit");
|
|
8
|
-
const index_1 = require("../../../index");
|
|
9
|
-
const NavigationItem_1 = (0, tslib_1.__importDefault)(require("../NavigationItem/NavigationItem"));
|
|
10
|
-
const b = (0, bem_cn_lite_1.default)('navigation-popup');
|
|
11
|
-
class NavigationPopup extends react_1.default.Component {
|
|
12
|
-
constructor() {
|
|
13
|
-
super(...arguments);
|
|
14
|
-
this.ref = (0, react_1.createRef)();
|
|
15
|
-
this.state = {
|
|
16
|
-
calculatedLeft: this.props.left,
|
|
17
|
-
};
|
|
18
|
-
this.calculateLeft = lodash_1.default.debounce(() => {
|
|
19
|
-
const { left } = this.props;
|
|
20
|
-
if (this.ref && this.ref.current && left) {
|
|
21
|
-
const right = left + this.ref.current.offsetWidth;
|
|
22
|
-
const docWidth = document.body.clientWidth;
|
|
23
|
-
const calculatedLeft = right > docWidth ? left - (right - docWidth) : left;
|
|
24
|
-
this.setState({ calculatedLeft });
|
|
25
|
-
}
|
|
26
|
-
else {
|
|
27
|
-
this.setState({ calculatedLeft: left });
|
|
28
|
-
}
|
|
29
|
-
}, 100);
|
|
30
|
-
}
|
|
31
|
-
componentDidMount() {
|
|
32
|
-
this.calculateLeft();
|
|
33
|
-
window.addEventListener('resize', this.calculateLeft);
|
|
34
|
-
}
|
|
35
|
-
componentDidUpdate(prevProps) {
|
|
36
|
-
if (prevProps.left !== this.props.left) {
|
|
37
|
-
this.calculateLeft();
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
componentWillUnmount() {
|
|
41
|
-
window.removeEventListener('resize', this.calculateLeft);
|
|
42
|
-
}
|
|
43
|
-
render() {
|
|
44
|
-
if (!document || !document.body) {
|
|
45
|
-
return null;
|
|
46
|
-
}
|
|
47
|
-
const { onClose } = this.props;
|
|
48
|
-
const { calculatedLeft } = this.state;
|
|
49
|
-
return (react_1.default.createElement(uikit_1.Portal, null,
|
|
50
|
-
react_1.default.createElement("div", { ref: this.ref, className: b(), style: { left: calculatedLeft } },
|
|
51
|
-
react_1.default.createElement(index_1.OutsideClick, { onOutsideClick: onClose }, this.renderDefaultPopup()))));
|
|
52
|
-
}
|
|
53
|
-
renderDefaultPopup() {
|
|
54
|
-
return (react_1.default.createElement(react_1.Fragment, null, this.props.items.map((item) => (react_1.default.createElement(NavigationItem_1.default, { key: item.text, className: b('link'), data: item })))));
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
exports.default = NavigationPopup;
|
package/build/esm/components/navigation/components/NavigationPopup/NavigationPopup-class.d.ts
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import React, { RefObject } from 'react';
|
|
2
|
-
import { NavigationLinkItem } from '../../../../models/navigation';
|
|
3
|
-
import './NavigationPopup.css';
|
|
4
|
-
export interface NavigationPopupProps {
|
|
5
|
-
items: NavigationLinkItem[];
|
|
6
|
-
onClose: () => void;
|
|
7
|
-
left?: number;
|
|
8
|
-
className?: string;
|
|
9
|
-
}
|
|
10
|
-
interface NavigationPopupState {
|
|
11
|
-
calculatedLeft?: number;
|
|
12
|
-
}
|
|
13
|
-
export default class NavigationPopup extends React.Component<NavigationPopupProps, NavigationPopupState> {
|
|
14
|
-
ref: RefObject<HTMLDivElement>;
|
|
15
|
-
state: {
|
|
16
|
-
calculatedLeft: number | undefined;
|
|
17
|
-
};
|
|
18
|
-
private calculateLeft;
|
|
19
|
-
componentDidMount(): void;
|
|
20
|
-
componentDidUpdate(prevProps: NavigationPopupProps): void;
|
|
21
|
-
componentWillUnmount(): void;
|
|
22
|
-
render(): JSX.Element | null;
|
|
23
|
-
private renderDefaultPopup;
|
|
24
|
-
}
|
|
25
|
-
export {};
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import _ from 'lodash';
|
|
2
|
-
import block from 'bem-cn-lite';
|
|
3
|
-
import React, { Fragment, createRef } from 'react';
|
|
4
|
-
import { Portal } from '@gravity-ui/uikit';
|
|
5
|
-
import { OutsideClick } from '../../../index';
|
|
6
|
-
import NavigationItem from '../NavigationItem/NavigationItem';
|
|
7
|
-
import './NavigationPopup.css';
|
|
8
|
-
const b = block('navigation-popup');
|
|
9
|
-
export default class NavigationPopup extends React.Component {
|
|
10
|
-
constructor() {
|
|
11
|
-
super(...arguments);
|
|
12
|
-
this.ref = createRef();
|
|
13
|
-
this.state = {
|
|
14
|
-
calculatedLeft: this.props.left,
|
|
15
|
-
};
|
|
16
|
-
this.calculateLeft = _.debounce(() => {
|
|
17
|
-
const { left } = this.props;
|
|
18
|
-
if (this.ref && this.ref.current && left) {
|
|
19
|
-
const right = left + this.ref.current.offsetWidth;
|
|
20
|
-
const docWidth = document.body.clientWidth;
|
|
21
|
-
const calculatedLeft = right > docWidth ? left - (right - docWidth) : left;
|
|
22
|
-
this.setState({ calculatedLeft });
|
|
23
|
-
}
|
|
24
|
-
else {
|
|
25
|
-
this.setState({ calculatedLeft: left });
|
|
26
|
-
}
|
|
27
|
-
}, 100);
|
|
28
|
-
}
|
|
29
|
-
componentDidMount() {
|
|
30
|
-
this.calculateLeft();
|
|
31
|
-
window.addEventListener('resize', this.calculateLeft);
|
|
32
|
-
}
|
|
33
|
-
componentDidUpdate(prevProps) {
|
|
34
|
-
if (prevProps.left !== this.props.left) {
|
|
35
|
-
this.calculateLeft();
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
componentWillUnmount() {
|
|
39
|
-
window.removeEventListener('resize', this.calculateLeft);
|
|
40
|
-
}
|
|
41
|
-
render() {
|
|
42
|
-
if (!document || !document.body) {
|
|
43
|
-
return null;
|
|
44
|
-
}
|
|
45
|
-
const { onClose } = this.props;
|
|
46
|
-
const { calculatedLeft } = this.state;
|
|
47
|
-
return (React.createElement(Portal, null,
|
|
48
|
-
React.createElement("div", { ref: this.ref, className: b(), style: { left: calculatedLeft } },
|
|
49
|
-
React.createElement(OutsideClick, { onOutsideClick: onClose }, this.renderDefaultPopup()))));
|
|
50
|
-
}
|
|
51
|
-
renderDefaultPopup() {
|
|
52
|
-
return (React.createElement(Fragment, null, this.props.items.map((item) => (React.createElement(NavigationItem, { key: item.text, className: b('link'), data: item })))));
|
|
53
|
-
}
|
|
54
|
-
}
|