@gravity-ui/page-constructor 4.0.0-beta.0 → 4.0.1

package/build/esm/navigation/components/Header/Header.css

@@ -1,98 +0,0 @@
-/* use this for style redefinitions to awoid problems with
-unpredictable css rules order in build */
-.pc-header {
-  position: sticky;
-  z-index: 98;
-  top: 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: var(--header-height);
-  background-color: var(--yc-color-base-background);
-  box-shadow: inset 0 -1px 0 var(--yc-color-line-generic);
-}
-.pc-header__wrapper {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  height: var(--header-height);
-}
-@media (min-width: 769px) {
-  .pc-header__mobile-menu-button.pc-header__mobile-menu-button {
-    display: none;
-  }
-}
-
-.pc-header__navigation, .pc-header__left, .pc-header__right {
-  display: flex;
-  align-items: center;
-}
-.pc-header__navigation.pc-header__navigation {
-  position: relative;
-  flex: 1 0 0;
-  justify-content: flex-start;
-}
-@media (max-width: 768px) {
-  .pc-header__navigation.pc-header__navigation {
-    display: none;
-  }
-}
-
-.pc-header__right {
-  flex: 0;
-  justify-content: flex-end;
-  font-size: var(--yc-text-body-2-font-size);
-  line-height: var(--yc-text-body-2-line-height);
-}
-.pc-header__navigation-container {
-  display: flex;
-  overflow-x: hidden;
-  flex: 1 0 0;
-  justify-content: space-between;
-  align-items: center;
-  margin-right: 32px;
-}
-.pc-header__buttons {
-  display: flex;
-  align-items: center;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-@media (max-width: 768px) {
-  .pc-header__buttons {
-    display: none;
-  }
-}
-.pc-header__buttons > *:not(:last-child) {
-  margin-right: 16px;
-}
-.pc-header__buttons-item {
-  position: relative;
-}
-.pc-header__buttons-item:not(:last-child) {
-  margin-right: 20px;
-}
-.pc-header__button {
-  margin-top: 0;
-}
-.pc-header__logo {
-  margin: 0 32px 0 0;
-  cursor: pointer;
-}
-@media (max-width: 768px) {
-  .pc-header__navigation-container {
-    justify-content: flex-end;
-  }
-  .pc-header__left {
-    flex: 1 0 0;
-  }
-}
-@media (max-width: 576px) {
-  .pc-header__navigation-container {
-    margin-right: 12px;
-  }
-  .pc-header__logo {
-    margin-right: 0;
-  }
-}

package/build/esm/navigation/components/Header/Header.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { HeaderData, ThemedNavigationLogoData } from '../../../models';
-import './Header.css';
-export interface HeaderProps {
-    logo: ThemedNavigationLogoData;
-    data: HeaderData;
-}
-export declare const Header: React.FC<HeaderProps>;
-export default Header;

package/build/esm/navigation/components/Header/Header.js

@@ -1,64 +0,0 @@
-import React, { useCallback, useMemo, useState } from 'react';
-import Control from '../../../components/Control/Control';
-import OutsideClick from '../../../components/OutsideClick/OutsideClick';
-import { Col, Grid, Row } from '../../../grid';
-import { NavigationClose, NavigationOpen } from '../../../icons';
-import { block } from '../../../utils';
-import { ItemColumnName } from '../../constants';
-import Logo from '../Logo/Logo';
-import MobileNavigation from '../MobileNavigation/MobileNavigation';
-import Navigation from '../Navigation/Navigation';
-import { NavigationListItem } from '../NavigationListItem/NavigationListItem';
-import './Header.css';
-const b = block('header');
-const ICON_SIZE = 36;
-const MobileMenuButton = ({ isSidebarOpened, onSidebarOpenedChange, }) => {
-    const iconProps = {
-        icon: isSidebarOpened ? NavigationClose : NavigationOpen,
-        iconSize: ICON_SIZE,
-    };
-    return (React.createElement(Control, Object.assign({ className: b('mobile-menu-button'), onClick: (e) => {
-            e.stopPropagation();
-            onSidebarOpenedChange(!isSidebarOpened);
-        }, size: "l" }, iconProps)));
-};
-const iconSizeKey = 'iconSize';
-export const Header = ({ data, logo }) => {
-    const { leftItems, rightItems, iconSize = 20 } = data;
-    const [isSidebarOpened, setIsSidebarOpened] = useState(false);
-    const [activeItemId, setactiveItemId] = useState(undefined);
-    const getNavigationItemWithIconSize = useCallback((item) => {
-        if (!(iconSizeKey in item)) {
-            return Object.assign(Object.assign({}, item), { iconSize });
-        }
-        return item;
-    }, [iconSize]);
-    const leftItemsWithIconSize = useMemo(() => leftItems.map(getNavigationItemWithIconSize), [getNavigationItemWithIconSize, leftItems]);
-    const rightItemsWithIconSize = useMemo(() => rightItems === null || rightItems === void 0 ? void 0 : rightItems.map(getNavigationItemWithIconSize), [getNavigationItemWithIconSize, rightItems]);
-    const onActiveItemChange = useCallback((id) => {
-        setactiveItemId(id);
-    }, []);
-    const hidePopup = useCallback(() => {
-        onActiveItemChange();
-    }, [onActiveItemChange]);
-    const onSidebarOpenedChange = useCallback((isOpen) => {
-        setIsSidebarOpened(isOpen);
-    }, []);
-    const hideSidebar = useCallback(() => {
-        setIsSidebarOpened(false);
-    }, []);
-    return (React.createElement(Grid, { className: b() },
-        React.createElement(Row, null,
-            React.createElement(Col, null,
-                React.createElement("header", { className: b('wrapper') },
-                    logo && (React.createElement("div", { className: b('left') },
-                        React.createElement(Logo, Object.assign({}, logo, { className: b('logo') })))),
-                    React.createElement("div", { className: b('navigation-container') },
-                        React.createElement(Navigation, { className: b('navigation'), links: leftItemsWithIconSize, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange })),
-                    React.createElement("div", { className: b('right') },
-                        React.createElement(MobileMenuButton, { isSidebarOpened: isSidebarOpened, onSidebarOpenedChange: onSidebarOpenedChange }),
-                        rightItemsWithIconSize && (React.createElement("ul", { className: b('buttons') }, rightItemsWithIconSize.map((button, index) => (React.createElement(NavigationListItem, { key: index, className: b('buttons-item'), item: button, index: index, activeItemId: activeItemId, hidePopup: hidePopup, column: ItemColumnName.Right, onActiveItemChange: onActiveItemChange })))))),
-                    React.createElement(OutsideClick, { onOutsideClick: () => onSidebarOpenedChange(false) },
-                        React.createElement(MobileNavigation, { topItems: leftItems, bottomItems: rightItems, isOpened: isSidebarOpened, activeItemId: activeItemId, onActiveItemChange: onActiveItemChange, onClose: hideSidebar })))))));
-};
-export default Header;

package/build/esm/navigation/components/NavigationDropdownItem/NavigationDropdownItem.d.ts

@@ -1,11 +0,0 @@
-import React, { MouseEventHandler } from 'react';
-import { NavigationDropdownItem } from '../../../models';
-export interface NavigationDropdownProps {
-    className?: string;
-    data: NavigationDropdownItem;
-    onClick: MouseEventHandler;
-    isActive: boolean;
-    hidePopup: () => void;
-}
-declare const NavigationDropdown: React.FC<NavigationDropdownProps>;
-export default NavigationDropdown;

package/build/esm/navigation/components/NavigationDropdownItem/NavigationDropdownItem.js

@@ -1,13 +0,0 @@
-import { __rest } from "tslib";
-import React, { Fragment, useRef } from 'react';
-import { NavigationItemType } from '../../../models';
-import NavigationItem from '../NavigationItem/NavigationItem';
-import NavigationPopup from '../NavigationPopup/NavigationPopup';
-const NavigationDropdown = ({ className, data, isActive, hidePopup, onClick, }) => {
-    const anchorRef = useRef(null);
-    const { text, icon, items, iconSize } = data, popupProps = __rest(data, ["text", "icon", "items", "iconSize"]);
-    return (React.createElement(Fragment, null,
-        React.createElement(NavigationItem, { className: className, ref: anchorRef, onClick: onClick, isOpened: isActive, data: { text, type: NavigationItemType.Dropdown, icon, iconSize } }),
-        React.createElement(NavigationPopup, Object.assign({ open: isActive, onClose: hidePopup, items: items, anchorRef: anchorRef }, popupProps))));
-};
-export default NavigationDropdown;

package/build/esm/navigation/components/NavigationListItem/NavigationListItem.css

@@ -1,27 +0,0 @@
-/* use this for style redefinitions to awoid problems with
-unpredictable css rules order in build */
-.pc-navigation-list-item {
-  height: var(--header-height);
-  line-height: var(--header-height);
-  cursor: pointer;
-  outline: none;
-  color: inherit;
-  text-decoration: none;
-}
-.utilityfocus .pc-navigation-list-item:focus {
-  outline: 2px solid #ffdb4d;
-}
-.pc-navigation-list-item__content:hover, .pc-navigation-list-item__content:active {
-  color: var(--yc-color-text-link);
-}
-.pc-navigation-list-item__slider-container {
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  left: 0;
-}
-.pc-navigation-list-item__slider {
-  width: 100%;
-  height: 2px;
-  background-color: var(--yc-color-text-link);
-}

package/build/esm/navigation/constants.d.ts

@@ -1,6 +0,0 @@
-export declare enum ItemColumnName {
-    Left = "left",
-    Right = "right",
-    Top = "top",
-    Bottom = "bottom"
-}