@synerise/ds-factors 0.14.30 → 0.15.1

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.15.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.15.0...@synerise/ds-factors@0.15.1) (2022-09-21)
+
+
+### Bug Fixes
+
+* **factors:** add autoresize option into input - autoResize prop ([44c35dd](https://github.com/Synerise/synerise-design/commit/44c35dd4523718a806867478d3dea78220c3e8e1))
+
+
+
+
+
+# [0.15.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.14.30...@synerise/ds-factors@0.15.0) (2022-09-21)
+
+
+### Features
+
+* **menu:** add information card tooltip ([ded0bf1](https://github.com/Synerise/synerise-design/commit/ded0bf1b58e68f7061630810925669cb0fdad560))
+
+
+
+
+
 ## [0.14.30](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.14.29...@synerise/ds-factors@0.14.30) (2022-09-13)
 
 **Note:** Version bump only for package @synerise/ds-factors

package/dist/FactorValue/Parameter/Parameter.js

@@ -7,9 +7,10 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import Dropdown from '@synerise/ds-dropdown';
 import * as React from 'react';
 import Button from '@synerise/ds-button';
+import Menu from '@synerise/ds-menu';
 import Icon, { AngleDownS } from '@synerise/ds-icon';
-import Tooltip from '@synerise/ds-tooltip';
 import { getPopupContainer } from '@synerise/ds-utils';
+import InformationCard from '@synerise/ds-information-card';
 import { Value } from './Parameter.style';
 import ParameterDropdown from './ParameterDropdown';
 
@@ -36,6 +37,19 @@ var ParameterInput = function ParameterInput(_ref) {
       dropdownVisible = _React$useState[0],
       setDropdownVisible = _React$useState[1];
 
+  var parameter = React.useMemo(function () {
+    return value;
+  }, [value]);
+
+  var _React$useMemo = React.useMemo(function () {
+    return {
+      parameterIcon: (parameter == null ? void 0 : parameter.icon) || buttonIcon,
+      parameterName: (parameter == null ? void 0 : parameter.name) || buttonLabel
+    };
+  }, [parameter, buttonIcon, buttonLabel]),
+      parameterIcon = _React$useMemo.parameterIcon,
+      parameterName = _React$useMemo.parameterName;
+
   var handleChange = React.useCallback(function (val) {
     onChange(val);
   }, [onChange]);
@@ -77,19 +91,38 @@ var ParameterInput = function ParameterInput(_ref) {
       texts: texts,
       loading: loading
     }))
-  }, /*#__PURE__*/React.createElement(Tooltip, {
-    getPopupContainer: getPopupContainerOverride || getPopupContainer,
-    title: (value == null ? void 0 : value.name) || '',
-    trigger: ['hover']
-  }, /*#__PURE__*/React.createElement(Button, {
-    type: "secondary",
-    mode: "two-icons",
-    onClick: handleOnClick
-  }, /*#__PURE__*/React.createElement(Icon, {
-    component: (value == null ? void 0 : value.icon) || buttonIcon
-  }), /*#__PURE__*/React.createElement(Value, null, (value == null ? void 0 : value.name) || buttonLabel), /*#__PURE__*/React.createElement(Icon, {
-    component: /*#__PURE__*/React.createElement(AngleDownS, null)
-  })))));
+  }, /*#__PURE__*/React.createElement(Menu, {
+    asDropdownMenu: true,
+    showTextTooltip: true,
+    asInfoCardContainer: true,
+    dataSource: [{
+      text: /*#__PURE__*/React.createElement(Button, {
+        type: "secondary",
+        mode: "two-icons",
+        onClick: handleOnClick
+      }, /*#__PURE__*/React.createElement(Icon, {
+        component: parameterIcon
+      }), /*#__PURE__*/React.createElement(Value, null, parameterName), /*#__PURE__*/React.createElement(Icon, {
+        component: /*#__PURE__*/React.createElement(AngleDownS, null)
+      })),
+      hoverTooltipProps: {
+        popupPlacement: 'top',
+        getPopupContainer: getPopupContainerOverride || getPopupContainer
+      },
+      renderHoverTooltip: parameter ? function () {
+        return /*#__PURE__*/React.createElement(InformationCard, {
+          icon: parameterIcon,
+          subtitle: parameterName,
+          title: parameterName.replace('_', ' '),
+          descriptionConfig: parameter.description ? {
+            value: parameter.description,
+            disabled: true,
+            label: undefined
+          } : undefined
+        });
+      } : undefined
+    }]
+  })));
 };
 
 export default ParameterInput;

package/dist/FactorValue/Text/Text.js

@@ -76,7 +76,7 @@ var TextInput = function TextInput(_ref) {
   }, [onChange]);
   var autocompleteOptions = React.useMemo(function () {
     return autocompleteText && autocompleteText.options.filter(function (option) {
-      return option.toLowerCase().includes(localValue.toLowerCase());
+      return option.toLowerCase().includes(String(localValue).toLowerCase());
     }) || [];
   }, [localValue, autocompleteText]);
   return /*#__PURE__*/React.createElement(S.TextWrapper, null, factorType === 'text' && textType === 'autocomplete' ? /*#__PURE__*/React.createElement(Autocomplete, {
@@ -99,7 +99,12 @@ var TextInput = function TextInput(_ref) {
     value: localValue,
     onChange: handleChange,
     onBlur: onDeactivate,
-    error: localError || error
+    error: localError || error,
+    style: {
+      minWidth: 144,
+      maxWidth: 450
+    },
+    autoResize: true
   })), /*#__PURE__*/React.createElement(TextModal, {
     visible: openExpanseEditor,
     onCancel: function onCancel() {

package/dist/Factors.types.d.ts

@@ -18,6 +18,7 @@ export declare type ParameterValueType = {
     name: string;
     id: React.ReactText;
     groupId?: React.ReactText;
+    description?: string;
 };
 export declare type ParameterGroup = {
     id: React.ReactText;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-factors",
-  "version": "0.14.30",
+  "version": "0.15.1",
   "description": "Factors UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -32,20 +32,21 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-autocomplete": "^0.4.26",
-    "@synerise/ds-badge": "^0.6.16",
+    "@synerise/ds-autocomplete": "^0.4.27",
+    "@synerise/ds-badge": "^0.6.17",
     "@synerise/ds-button": "^0.17.9",
-    "@synerise/ds-date-picker": "^0.6.39",
-    "@synerise/ds-date-range-picker": "^0.16.0",
-    "@synerise/ds-dropdown": "^0.17.36",
+    "@synerise/ds-date-picker": "^0.6.40",
+    "@synerise/ds-date-range-picker": "^0.17.0",
+    "@synerise/ds-dropdown": "^0.17.37",
     "@synerise/ds-icon": "^0.51.0",
-    "@synerise/ds-inline-edit": "^0.6.32",
+    "@synerise/ds-information-card": "^0.1.22",
+    "@synerise/ds-inline-edit": "^0.6.33",
     "@synerise/ds-input": "^0.18.22",
-    "@synerise/ds-input-number": "^0.6.23",
-    "@synerise/ds-menu": "^0.15.8",
+    "@synerise/ds-input-number": "^0.6.24",
+    "@synerise/ds-menu": "^0.16.0",
     "@synerise/ds-modal": "^0.16.7",
     "@synerise/ds-result": "^0.6.16",
-    "@synerise/ds-tabs": "^0.13.31",
+    "@synerise/ds-tabs": "^0.13.32",
     "@synerise/ds-typography": "^0.12.7",
     "@synerise/ds-utils": "^0.19.0",
     "classnames": "^2.2.6",
@@ -55,5 +56,5 @@
     "@synerise/ds-core": "*",
     "react": ">=16.9.0 < 17.0.0"
   },
-  "gitHead": "4a728965c03f982f1da86336e3a16db41ffc5a27"
+  "gitHead": "1f88bb29b929f0e7108cecc31a7768a1a95af461"
 }