@synerise/ds-menu 0.15.8 → 0.16.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.16.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-menu@0.15.8...@synerise/ds-menu@0.16.0) (2022-09-21)
+
+
+### Features
+
+* **menu:** add information card tooltip ([ded0bf1](https://github.com/Synerise/synerise-design/commit/ded0bf1b58e68f7061630810925669cb0fdad560))
+
+
+
+
+
 ## [0.15.8](https://github.com/Synerise/synerise-design/compare/@synerise/ds-menu@0.15.7...@synerise/ds-menu@0.15.8) (2022-08-31)
 
 **Note:** Version bump only for package @synerise/ds-menu

package/dist/Elements/Item/Text/Text.js

@@ -5,16 +5,17 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 import * as React from 'react';
+import "rc-trigger/assets/index.css";
 import classNames from 'classnames';
 import { useTheme } from 'styled-components';
-import theme from '@synerise/ds-core/dist/js/DSProvider/ThemeProvider/theme';
 import * as copy from 'copy-to-clipboard';
 import Trigger from 'rc-trigger';
 import Tooltip from '@synerise/ds-tooltip';
-import Icon, { CheckS, AngleRightS } from '@synerise/ds-icon';
 import { escapeRegEx } from '@synerise/ds-utils';
-import "rc-trigger/assets/index.css";
+import Icon, { CheckS, AngleRightS } from '@synerise/ds-icon';
+import theme from '@synerise/ds-core/dist/js/DSProvider/ThemeProvider/theme';
 import * as S from './Text.styles';
+import { triggerPlacements } from '../../../utils';
 import { VisibilityTrigger } from '../../../Menu.types';
 
 var renderAddon = function renderAddon(addon) {
@@ -25,10 +26,6 @@ var renderAddon = function renderAddon(addon) {
   return addon instanceof Function ? addon.apply(void 0, params) : addon;
 };
 
-var placement = {
-  right: ['cl', 'cr']
-};
-
 function WithHoverTooltip(_ref) {
   var _hoverTooltipProps$de;
 
@@ -51,12 +48,10 @@ function WithHoverTooltip(_ref) {
       onKeyDown: cancelBubblingEvent,
       onClick: cancelBubblingEvent
     }, /*#__PURE__*/React.createElement(Trigger, _extends({
+      builtinPlacements: triggerPlacements,
       defaultPopupVisible: (_hoverTooltipProps$de = hoverTooltipProps == null ? void 0 : hoverTooltipProps.defaultPopupVisible) != null ? _hoverTooltipProps$de : false,
-      action: ['click', 'hover'],
-      popupAlign: {
-        points: placement.right,
-        offset: [4, 0]
-      },
+      action: (hoverTooltipProps == null ? void 0 : hoverTooltipProps.action) || ['click', 'hover'],
+      popupPlacement: (hoverTooltipProps == null ? void 0 : hoverTooltipProps.popupPlacement) || 'right',
       popup: renderHoverTooltip && renderHoverTooltip(),
       popupClassName: "ignore-click-outside ds-hide-arrow",
       mouseEnterDelay: 0.2,

package/dist/Menu.styles.js

@@ -23,11 +23,13 @@ export var MenuDivider = styled.div.withConfig({
 export var AntdMenu = styled(Menu).withConfig({
   displayName: "Menustyles__AntdMenu",
   componentId: "sc-10eu0qe-1"
-})(["", " ", " > li{> .ant-menu-submenu-title{padding-left:12px !important;}&:not(.ant-menu-submenu){padding-left:12px !important;}}.ant-menu-submenu-title{display:flex;", " .ds-submenu-title-wrapper{", " .ds-submenu-title{padding-top:5px;padding-bottom:5px;", "}}}&&{.ant-menu-inline,.ant-menu-vertical,.ant-menu-vertical-left{border-right-width:0px;margin:8px 0 8px 0;}}"], function (props) {
-  return Boolean(props.asDropdownMenu) && css(["&&{padding:8px;width:194px;"]);
+})(["", " ", " > li{> .ant-menu-submenu-title{padding-left:12px !important;}&:not(.ant-menu-submenu){padding-left:12px !important;}}.ant-menu-submenu-title{display:flex;", " .ds-submenu-title-wrapper{", " .ds-submenu-title{padding-top:5px;padding-bottom:5px;", "}}}&&{.ant-menu-inline,.ant-menu-vertical,.ant-menu-vertical-left{border-right-width:0px;margin:8px 0 8px 0;}}", ""], function (props) {
+  return Boolean(props.asDropdownMenu) && !props.asInfoCardContainer && css(["&&{padding:8px;width:194px;"]);
 }, function (props) {
   return !!props.ordered && css(["&,ul{counter-reset:custom-counter;li:not(.ds-submenu-title){counter-increment:custom-counter;&::before{content:'0' counter(custom-counter) '. \\a0';line-height:1.39;font-weight:normal;color:", ";}}li.ant-menu-submenu{&::before{content:'';}}}"], props.theme.palette['grey-500']);
-}, overflowStyles, overflowStyles, overflowStyles);
+}, overflowStyles, overflowStyles, overflowStyles, function (props) {
+  return Boolean(props.asInfoCardContainer) && css(["&&& li.ds-menu-item{padding:0 !important;}"]);
+});
 export var SubMenuItem = styled(Menu.SubMenu).withConfig({
   displayName: "Menustyles__SubMenuItem",
   componentId: "sc-10eu0qe-2"

package/dist/Menu.types.d.ts

@@ -5,6 +5,7 @@ export interface AntdMenuProps extends Omit<MenuProps, 'dataSource' | 'footer'>
     ordered?: boolean;
     asDropdownMenu?: boolean;
     showTextTooltip?: boolean;
+    asInfoCardContainer?: boolean;
 }
 export declare type MenuDividerProps = {
     higher?: boolean;

package/dist/index.d.ts

@@ -1,3 +1,4 @@
 export { default } from './Menu';
 export * from './Menu.types';
 export * from './Elements/Item/MenuItem.types';
+export * from './utils';

package/dist/index.js

@@ -1,3 +1,4 @@
 export { default } from './Menu';
 export * from './Menu.types';
-export * from './Elements/Item/MenuItem.types';
+export * from './Elements/Item/MenuItem.types';
+export * from './utils';

package/dist/utils.d.ts

@@ -0,0 +1,34 @@
+export declare const triggerPlacements: {
+    left: {
+        points: string[];
+        offset: number[];
+    };
+    right: {
+        points: string[];
+        offset: number[];
+    };
+    top: {
+        points: string[];
+        offset: number[];
+    };
+    bottom: {
+        points: string[];
+        offset: number[];
+    };
+    topLeft: {
+        points: string[];
+        offset: number[];
+    };
+    topRight: {
+        points: string[];
+        offset: number[];
+    };
+    bottomRight: {
+        points: string[];
+        offset: number[];
+    };
+    bottomLeft: {
+        points: string[];
+        offset: number[];
+    };
+};

package/dist/utils.js

@@ -0,0 +1,35 @@
+/* eslint-disable import/prefer-default-export */
+export var triggerPlacements = {
+  left: {
+    points: ['cr', 'cl'],
+    offset: [-8, 0]
+  },
+  right: {
+    points: ['cl', 'cr'],
+    offset: [0, 0]
+  },
+  top: {
+    points: ['bc', 'tc'],
+    offset: [0, -8]
+  },
+  bottom: {
+    points: ['tc', 'bc'],
+    offset: [0, 8]
+  },
+  topLeft: {
+    points: ['bl', 'tl'],
+    offset: [0, -8]
+  },
+  topRight: {
+    points: ['br', 'tr'],
+    offset: [0, -8]
+  },
+  bottomRight: {
+    points: ['tr', 'br'],
+    offset: [0, 8]
+  },
+  bottomLeft: {
+    points: ['tl', 'bl'],
+    offset: [0, 8]
+  }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-menu",
-  "version": "0.15.8",
+  "version": "0.16.0",
   "description": "Menu UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -41,5 +41,5 @@
     "@synerise/ds-core": "*",
     "react": ">=16.9.0 < 17.0.0"
   },
-  "gitHead": "ef480757296035e4ba2928cd169a98458477b8d1"
+  "gitHead": "aef9ed09c6b307baccd74eb6a15d3134a6c7defe"
 }