@gravity-ui/navigation 0.12.0 → 0.13.0

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.
@@ -15,6 +15,7 @@ export interface ItemProps extends ItemPopup {
15
15
  item: MenuItem;
16
16
  enableTooltip?: boolean;
17
17
  onItemClick?: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
18
+ onItemClickCapture?: (event: React.SyntheticEvent) => void;
18
19
  }
19
20
  interface ItemInnerProps extends ItemProps {
20
21
  className?: string;
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { ItemProps } from '../CompositeBar/Item/Item';
3
3
  import './FooterItem.scss';
4
- export interface FooterItemProps extends Omit<ItemProps, 'onItemClick'> {
4
+ export interface FooterItemProps extends Omit<ItemProps, 'onItemClick' | 'onItemClickCapture'> {
5
5
  compact: boolean;
6
6
  }
7
7
  export declare const FooterItem: React.FC<FooterItemProps>;
@@ -15,10 +15,12 @@ export interface MenuItem {
15
15
  current?: boolean;
16
16
  pinned?: boolean;
17
17
  onItemClick?: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
18
+ onItemClickCapture?: (event: React.SyntheticEvent) => void;
18
19
  itemWrapper?: (p: MakeItemParams, makeItem: (p: MakeItemParams) => React.ReactNode, opts: {
19
20
  collapsed: boolean;
20
21
  compact: boolean;
21
22
  item: MenuItem;
23
+ ref: React.RefObject<HTMLElement>;
22
24
  }) => React.ReactNode;
23
25
  rightAdornment?: React.ReactNode;
24
26
  type?: MenuItemType;
@@ -3745,7 +3745,7 @@ function renderItemTitle(item) {
3745
3745
  const defaultPopupPlacement = ['right-end'];
3746
3746
  const defaultPopupOffset = [-20, 8];
3747
3747
  const Item$1 = (props) => {
3748
- const { item, className, collapseItems, onMouseLeave, onMouseEnter, enableTooltip = true, popupVisible = false, popupAnchor, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onClosePopup, onItemClick, } = props;
3748
+ const { item, className, collapseItems, onMouseLeave, onMouseEnter, enableTooltip = true, popupVisible = false, popupAnchor, popupPlacement = defaultPopupPlacement, popupOffset = defaultPopupOffset, popupKeepMounted, renderPopupContent, onClosePopup, onItemClick, onItemClickCapture, } = props;
3749
3749
  const { compact } = useAsideHeaderContext();
3750
3750
  if (item.type === 'divider') {
3751
3751
  return React__default["default"].createElement("div", { className: b$l('menu-divider') });
@@ -3781,7 +3781,7 @@ const Item$1 = (props) => {
3781
3781
  else {
3782
3782
  onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(item, false, event);
3783
3783
  }
3784
- }, onMouseEnter: () => {
3784
+ }, onClickCapture: onItemClickCapture, onMouseEnter: () => {
3785
3785
  if (!compact) {
3786
3786
  onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter();
3787
3787
  }
@@ -3800,7 +3800,7 @@ const Item$1 = (props) => {
3800
3800
  const titleNode = renderItemTitle(item);
3801
3801
  const params = { icon: iconNode, title: titleNode };
3802
3802
  let node;
3803
- const opts = { compact, collapsed: false, item };
3803
+ const opts = { compact, collapsed: false, item, ref };
3804
3804
  if (typeof item.itemWrapper === 'function') {
3805
3805
  node = item.itemWrapper(params, makeNode, opts);
3806
3806
  }
@@ -3825,7 +3825,7 @@ function CollapsedPopup({ onItemClick, collapseItems, anchorRef, onClose, }) {
3825
3825
  };
3826
3826
  const titleNode = renderItemTitle(collapseItem);
3827
3827
  const params = { title: titleNode };
3828
- const opts = { compact, collapsed: true, item: collapseItem };
3828
+ const opts = { compact, collapsed: true, item: collapseItem, ref: anchorRef };
3829
3829
  if (typeof collapseItem.itemWrapper === 'function') {
3830
3830
  return collapseItem.itemWrapper(params, makeCollapseNode, opts);
3831
3831
  }
@@ -4149,7 +4149,7 @@ styleInject(css_248z$g);
4149
4149
  const b$h = block('footer-item');
4150
4150
  const FooterItem$1 = (_a) => {
4151
4151
  var { item } = _a, props = __rest(_a, ["item"]);
4152
- return (React__default["default"].createElement(Item$1, Object.assign({}, props, { item: Object.assign({ iconSize: ASIDE_HEADER_FOOTER_ICON_SIZE }, item), className: b$h({ compact: props.compact }), onItemClick: item.onItemClick })));
4152
+ return (React__default["default"].createElement(Item$1, Object.assign({}, props, { item: Object.assign({ iconSize: ASIDE_HEADER_FOOTER_ICON_SIZE }, item), className: b$h({ compact: props.compact }), onItemClick: item.onItemClick, onItemClickCapture: item.onItemClickCapture })));
4153
4153
  };
4154
4154
 
4155
4155
  var css_248z$f = ".ycn-action-bar-group {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n justify-content: flex-start;\n margin: 0;\n padding: 0;\n}\n.ycn-action-bar-group_pull_left {\n margin-left: 0;\n margin-right: auto;\n}\n.ycn-action-bar-group_pull_right {\n margin-left: auto;\n margin-right: 0;\n}\n.ycn-action-bar-group_pull_center {\n margin-left: auto;\n margin-right: auto;\n}";