@synerise/ds-factors 1.7.6 → 1.8.0

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.8.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.7.7...@synerise/ds-factors@1.8.0) (2026-01-20)
+
+### Features
+
+- **information-card:** migrate to popover ([de900e4](https://github.com/Synerise/synerise-design/commit/de900e4bc1c32a4bbbf175401374619e691023f2))
+
+## [1.7.7](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.7.6...@synerise/ds-factors@1.7.7) (2026-01-15)
+
+**Note:** Version bump only for package @synerise/ds-factors
+
 ## [1.7.6](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.7.5...@synerise/ds-factors@1.7.6) (2026-01-12)
 
 **Note:** Version bump only for package @synerise/ds-factors

package/dist/FactorValue/FactorValue.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { type FactorValueProps } from '../Factors.types';
-declare const FactorValue: ({ selectedFactorType, value, onChangeValue, onParamsClick, selectedFactor, textType, parameters, autocompleteText, withoutTypeSelector, texts, formulaEditor, opened, loading, factorKey, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, error, inputProps, allowClear, readOnly, getMenuEntryProps, relativeDateProps, arrayProps, factorValueExtraProps, uncontrolledComponent, }: FactorValueProps) => React.JSX.Element;
+declare const FactorValue: ({ selectedFactorType, value, onChangeValue, onParamsClick, selectedFactor, textType, parameters, autocompleteText, withoutTypeSelector, texts, formulaEditor, opened, loading, factorKey, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, error, inputProps, allowClear, readOnly, relativeDateProps, arrayProps, factorValueExtraProps, uncontrolledComponent, }: FactorValueProps) => React.JSX.Element;
 export default FactorValue;

package/dist/FactorValue/FactorValue.js

@@ -26,7 +26,6 @@ var FactorValue = function FactorValue(_ref) {
     allowClear = _ref.allowClear,
     _ref$readOnly = _ref.readOnly,
     readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    getMenuEntryProps = _ref.getMenuEntryProps,
     relativeDateProps = _ref.relativeDateProps,
     arrayProps = _ref.arrayProps,
     factorValueExtraProps = _ref.factorValueExtraProps,
@@ -60,13 +59,12 @@ var FactorValue = function FactorValue(_ref) {
       error: error,
       allowClear: allowClear,
       readOnly: readOnly,
-      getMenuEntryProps: getMenuEntryProps,
       inputProps: inputProps,
       factorValueExtraProps: factorValueExtraProps
     }, relativeDateProps, {
       uncontrolledComponent: uncontrolledComponent
     }));
-  }, [selectedFactor, factorKey, value, texts, onChangeValue, textType, selectedFactorType, autocompleteText, parameters, withoutTypeSelector, inputProps, arrayProps, formulaEditor, opened, loading, onParamsClick, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, error, allowClear, readOnly, getMenuEntryProps, relativeDateProps, factorValueExtraProps, uncontrolledComponent]);
+  }, [selectedFactor, factorKey, value, texts, onChangeValue, textType, selectedFactorType, autocompleteText, parameters, withoutTypeSelector, inputProps, arrayProps, formulaEditor, opened, loading, onParamsClick, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, error, allowClear, readOnly, relativeDateProps, factorValueExtraProps, uncontrolledComponent]);
   return /*#__PURE__*/React.createElement(S.FactorInput, {
     inputType: selectedFactorType,
     inputTextType: textType,

package/dist/FactorValue/FactorValue.style.js

@@ -8,7 +8,7 @@ var DEFAULT_WIDTH = {
 export var FactorInput = styled.div.withConfig({
   displayName: "FactorValuestyle__FactorInput",
   componentId: "sc-17jtnx3-0"
-})(["&&{", ";", "{width:auto;}li.ds-menu-item{border-radius:", ";}.ant-menu-item{border-radius:", ";}.ds-autocomplete{display:flex;> *{min-width:0;flex-grow:1;}.ant-select{width:100%;}.ant-select-selection-placeholder{padding:0;}.ant-select-selector{border-radius:", ";}}.ant-dropdown-trigger{input{border-radius:", ";}}}"], function (props) {
+})(["&&{", ";", "{width:auto;}.ds-autocomplete{display:flex;> *{min-width:0;flex-grow:1;}.ant-select{width:100%;}.ant-select-selection-placeholder{padding:0;}.ant-select-selector{border-radius:", ";}}.ant-dropdown-trigger{input{border-radius:", ";}}}"], function (props) {
   var inputType = props.inputType,
     _props$inputTextType = props.inputTextType,
     inputTextType = _props$inputTextType === void 0 ? 'default' : _props$inputTextType;
@@ -25,10 +25,6 @@ export var FactorInput = styled.div.withConfig({
   }
   return false;
 }, Container, function (props) {
-  return props.withoutTypeSelector ? '3px' : '0';
-}, function (props) {
-  return props.withoutTypeSelector ? '3px' : '0';
-}, function (props) {
   return props.withoutTypeSelector ? '3px' : '0 3px 3px 0';
 }, function (props) {
   return props.withoutTypeSelector ? '3px' : '0 3px 3px 0';

package/dist/FactorValue/Parameter/Parameter.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { type FactorValueComponentProps } from '../../Factors.types';
-declare const ParameterInput: ({ value, onChange, onParamsClick, parameters, texts, opened, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, readOnly, error, loading, getMenuEntryProps, }: FactorValueComponentProps) => React.JSX.Element;
+declare const ParameterInput: ({ value, onChange, onParamsClick, parameters, texts, opened, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, readOnly, error, loading, }: FactorValueComponentProps) => React.JSX.Element;
 export default ParameterInput;

package/dist/FactorValue/Parameter/Parameter.js

@@ -4,8 +4,7 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import Dropdown from '@synerise/ds-dropdown';
 import Icon, { AngleDownS } from '@synerise/ds-icon';
-import InformationCard from '@synerise/ds-information-card';
-import Menu from '@synerise/ds-menu';
+import InformationCard, { InformationCardTooltip } from '@synerise/ds-information-card';
 import { getPopupContainer } from '@synerise/ds-utils';
 import { DROPDOWN_HEIGHT, DROPDOWN_HEIGHT_BELOW_THRESHOLD, DROPDOWN_HEIGHT_THRESHOLD } from './Parameter.constants';
 import { ParameterButton, Value } from './Parameter.style';
@@ -24,8 +23,7 @@ var ParameterInput = function ParameterInput(_ref) {
     _ref$readOnly = _ref.readOnly,
     readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
     error = _ref.error,
-    loading = _ref.loading,
-    getMenuEntryProps = _ref.getMenuEntryProps;
+    loading = _ref.loading;
   var _ref2 = parameters || {},
     buttonIcon = _ref2.buttonIcon,
     buttonLabel = _ref2.buttonLabel,
@@ -79,10 +77,6 @@ var ParameterInput = function ParameterInput(_ref) {
   var onDropdownVisibilityChange = useCallback(function (newValue) {
     newValue && onActivate && onActivate();
     setDropdownVisible(newValue);
-    // if (!newValue) {
-    //   // onDeactivate && onDeactivate();
-    //   setDropdownVisible(false);
-    // }
   }, [onActivate]);
   var triggerMode = useMemo(function () {
     if (parameterIcon) {
@@ -102,31 +96,26 @@ var ParameterInput = function ParameterInput(_ref) {
   }), /*#__PURE__*/React.createElement(Value, null, parameterName), !readOnly && /*#__PURE__*/React.createElement(Icon, {
     component: /*#__PURE__*/React.createElement(AngleDownS, null)
   }));
-  var trigger = /*#__PURE__*/React.createElement(Menu, {
-    asDropdownMenu: true,
-    showTextTooltip: true,
-    asInfoCardContainer: true,
-    dataSource: [_extends({
-      text: triggerButton,
-      hoverTooltipProps: {
-        popupPlacement: 'top',
-        getPopupContainer: getPopupContainerOverride || getPopupContainer
-      },
-      renderHoverTooltip: isSelected ? (parameter == null ? void 0 : parameter.renderHoverTooltip) || function () {
-        var _parameter$id;
-        return /*#__PURE__*/React.createElement(InformationCard, _extends({
-          icon: parameterIcon,
-          subtitle: (_parameter$id = parameter.id) == null ? void 0 : _parameter$id.toString(),
-          title: parameterName,
-          descriptionConfig: parameter.description ? {
-            value: parameter.description,
-            disabled: true,
-            label: undefined
-          } : undefined
-        }, parameter.informationCardProps));
+  var selectedItemInfoCard = useMemo(function () {
+    var _parameter$id;
+    return isSelected && parameter && ((parameter.renderHoverTooltip == null ? void 0 : parameter.renderHoverTooltip()) || /*#__PURE__*/React.createElement(InformationCard, _extends({
+      icon: parameterIcon,
+      subtitle: (_parameter$id = parameter.id) == null ? void 0 : _parameter$id.toString(),
+      title: parameterName,
+      descriptionConfig: parameter.description ? {
+        value: parameter.description,
+        disabled: true,
+        label: undefined
       } : undefined
-    }, getMenuEntryProps == null ? void 0 : getMenuEntryProps(parameter))]
-  });
+    }, parameter.informationCardProps)));
+  }, [parameter, isSelected, parameterIcon, parameterName]);
+  var trigger = selectedItemInfoCard ? /*#__PURE__*/React.createElement(InformationCardTooltip, {
+    content: selectedItemInfoCard,
+    popoverProps: {
+      placement: 'top',
+      getPopupContainer: getPopupContainerOverride || getPopupContainer
+    }
+  }, triggerButton) : triggerButton;
   useEffect(function () {
     var checkViewportHeight = function checkViewportHeight() {
       return setOuterHeight(window.innerHeight < dimensionsConfig.threshold ? dimensionsConfig.lowerHeight : dimensionsConfig.defaultHeight);

package/dist/FactorValue/Parameter/ParameterDropdown.js

@@ -5,7 +5,7 @@ import { useTheme } from '@synerise/ds-core';
 import Divider from '@synerise/ds-divider';
 import Dropdown from '@synerise/ds-dropdown';
 import Icon, { ArrowRightCircleM, SearchM } from '@synerise/ds-icon';
-import { itemSizes } from '@synerise/ds-list-item';
+import { ListContextProvider, itemSizes } from '@synerise/ds-list-item';
 import Result from '@synerise/ds-result';
 import Scrollbar from '@synerise/ds-scrollbar';
 import Tabs from '@synerise/ds-tabs';
@@ -306,7 +306,7 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
     onScroll: handleScroll,
     maxHeight: dropdownContentHeight,
     ref: scrollBarRef
-  }, /*#__PURE__*/React.createElement(S.StyledList, {
+  }, /*#__PURE__*/React.createElement(ListContextProvider, null, /*#__PURE__*/React.createElement(S.StyledList, {
     width: "100%",
     height: 300,
     itemCount: currentItems.length,
@@ -330,6 +330,6 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
     }, listItem.title) : /*#__PURE__*/React.createElement(ParameterDropdownItem, _extends({
       style: style
     }, listItem));
-  })) : getNoResultContainer));
+  }))) : getNoResultContainer));
 };
 export default ParameterDropdown;

package/dist/Factors.d.ts

@@ -2,5 +2,5 @@ import React from 'react';
 import { type DefinedFactorTypes, type FactorsProps, type SelectedFactorType } from './Factors.types';
 export declare const DEFAULT_FACTOR_TYPE: DefinedFactorTypes;
 export declare const FACTOR_TYPE_MAPPING: Record<DefinedFactorTypes, SelectedFactorType>;
-declare const Factors: ({ selectedFactorType, setSelectedFactorType, onChangeValue, onParamsClick, value, defaultFactorType, textType, unavailableFactorTypes, availableFactorTypes, parameters, autocompleteText, allowClear, withoutTypeSelector, texts, formulaEditor, opened, loading, factorKey, preventAutoloadData, onActivate, onDeactivate, getPopupContainerOverride, customFactorValueComponents, error, inputProps, arrayProps, readOnly, factorValueExtraProps, getMenuEntryProps, uncontrolledComponent, }: FactorsProps) => React.JSX.Element;
+declare const Factors: ({ selectedFactorType, setSelectedFactorType, onChangeValue, onParamsClick, value, defaultFactorType, textType, unavailableFactorTypes, availableFactorTypes, parameters, autocompleteText, allowClear, withoutTypeSelector, texts, formulaEditor, opened, loading, factorKey, preventAutoloadData, onActivate, onDeactivate, getPopupContainerOverride, customFactorValueComponents, error, inputProps, arrayProps, readOnly, factorValueExtraProps, uncontrolledComponent, }: FactorsProps) => React.JSX.Element;
 export default Factors;

package/dist/Factors.js

@@ -105,7 +105,6 @@ var Factors = function Factors(_ref) {
     arrayProps = _ref.arrayProps,
     readOnly = _ref.readOnly,
     factorValueExtraProps = _ref.factorValueExtraProps,
-    getMenuEntryProps = _ref.getMenuEntryProps,
     _ref$uncontrolledComp = _ref.uncontrolledComponent,
     uncontrolledComponent = _ref$uncontrolledComp === void 0 ? false : _ref$uncontrolledComp;
   var allTexts = useTexts(texts);
@@ -168,7 +167,6 @@ var Factors = function Factors(_ref) {
     error: error,
     allowClear: allowClear,
     readOnly: readOnly,
-    getMenuEntryProps: getMenuEntryProps,
     factorValueExtraProps: factorValueExtraProps,
     uncontrolledComponent: uncontrolledComponent
   }));

package/dist/Factors.types.d.ts

@@ -6,7 +6,6 @@ import type { DateFilter, RelativeUnits } from '@synerise/ds-date-range-picker/d
 import type { InformationCardProps } from '@synerise/ds-information-card';
 import type { AutoResizeProp, InputProps } from '@synerise/ds-input';
 import type { ListItemProps } from '@synerise/ds-list-item';
-import type { MenuItemProps } from '@synerise/ds-menu';
 import type { DeepPartial, LiteralStringUnion } from '@synerise/ds-utils';
 export declare const ALL_FACTOR_TYPES: readonly ["text", "number", "parameter", "contextParameter", "dynamicKey", "formula", "array", "date", "relativeDate", "dateRange"];
 export type FactorType = LiteralStringUnion<(typeof ALL_FACTOR_TYPES)[number]>;
@@ -26,7 +25,7 @@ export type FormulaValueType = {
     name: string;
     value: string;
 };
-export type ParameterValueType = Pick<ListItemProps, 'renderHoverTooltip' | 'hoverTooltipProps' | 'disabled'> & {
+export type ParameterValueType = Pick<ListItemProps, 'renderHoverTooltip' | 'popoverProps' | 'disabled'> & {
     type: string;
     icon: ReactNode;
     name: string;
@@ -196,7 +195,6 @@ export type FactorsProps = {
     preventAutoloadData?: boolean;
     inputProps?: Partial<Omit<InputProps, 'handleInputRef' | 'defaultOpen' | 'placeholder' | 'value' | 'onChange' | 'onBlur' | 'error' | 'getPopupContainer' | 'readOnly' | 'allowClear'>>;
     readOnly?: boolean;
-    getMenuEntryProps?: (arg?: ParameterValueType) => MenuItemProps;
     uncontrolledComponent?: boolean;
 };
 export type FactorTypeSelectorProps = Pick<FactorsProps, 'unavailableFactorTypes' | 'availableFactorTypes' | 'selectedFactorType' | 'readOnly' | 'getPopupContainerOverride'> & {
@@ -207,11 +205,11 @@ export type FactorTypeSelectorProps = Pick<FactorsProps, 'unavailableFactorTypes
         [k in DefinedFactorTypes]: string;
     };
 };
-export type FactorValueProps = Pick<FactorsProps, 'onChangeValue' | 'onParamsClick' | 'value' | 'selectedFactorType' | 'parameters' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'formulaEditor' | 'opened' | 'loading' | 'factorKey' | 'preventAutoloadData' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'allowClear' | 'inputProps' | 'autoResize' | 'readOnly' | 'relativeDateProps' | 'arrayProps' | 'getMenuEntryProps' | 'factorValueExtraProps' | 'uncontrolledComponent'> & {
+export type FactorValueProps = Pick<FactorsProps, 'onChangeValue' | 'onParamsClick' | 'value' | 'selectedFactorType' | 'parameters' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'formulaEditor' | 'opened' | 'loading' | 'factorKey' | 'preventAutoloadData' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'allowClear' | 'inputProps' | 'autoResize' | 'readOnly' | 'relativeDateProps' | 'arrayProps' | 'factorValueExtraProps' | 'uncontrolledComponent'> & {
     texts: FactorsTexts;
     selectedFactor: SelectedFactorType;
 };
-export type FactorValueComponentProps = Pick<FactorsProps, 'value' | 'parameters' | 'allowClear' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'inputProps' | 'autoResize' | 'readOnly' | 'arrayProps' | 'getMenuEntryProps' | 'factorValueExtraProps' | 'uncontrolledComponent'> & {
+export type FactorValueComponentProps = Pick<FactorsProps, 'value' | 'parameters' | 'allowClear' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'inputProps' | 'autoResize' | 'readOnly' | 'arrayProps' | 'factorValueExtraProps' | 'uncontrolledComponent'> & {
     texts: FactorsTexts;
     onChange: (value: FactorValueType) => void;
     factorType: FactorType;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-factors",
-  "version": "1.7.6",
+  "version": "1.8.0",
   "description": "Factors UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -35,34 +35,33 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-alert": "^1.1.30",
-    "@synerise/ds-autocomplete": "^1.2.20",
-    "@synerise/ds-badge": "^1.0.29",
-    "@synerise/ds-button": "^1.5.4",
-    "@synerise/ds-button-group": "^1.1.28",
-    "@synerise/ds-collector": "^1.4.9",
-    "@synerise/ds-date-picker": "^1.3.7",
-    "@synerise/ds-date-range-picker": "^1.4.7",
-    "@synerise/ds-divider": "^1.2.5",
-    "@synerise/ds-dropdown": "^1.1.7",
-    "@synerise/ds-empty-states": "^1.0.25",
-    "@synerise/ds-icon": "^1.9.3",
-    "@synerise/ds-information-card": "^1.3.8",
-    "@synerise/ds-inline-edit": "^1.1.7",
-    "@synerise/ds-input": "^1.5.5",
-    "@synerise/ds-input-number": "^1.2.20",
-    "@synerise/ds-list-item": "^1.2.5",
-    "@synerise/ds-menu": "^1.2.4",
-    "@synerise/ds-modal": "^1.2.21",
-    "@synerise/ds-result": "^1.0.34",
-    "@synerise/ds-scrollbar": "^1.2.4",
-    "@synerise/ds-search": "^1.3.14",
-    "@synerise/ds-select": "^1.3.5",
-    "@synerise/ds-short-cuts": "^1.0.27",
-    "@synerise/ds-skeleton": "^1.0.29",
-    "@synerise/ds-tabs": "^1.1.7",
-    "@synerise/ds-tag": "^1.4.4",
-    "@synerise/ds-tooltip": "^1.3.4",
+    "@synerise/ds-alert": "^1.1.31",
+    "@synerise/ds-autocomplete": "^1.2.21",
+    "@synerise/ds-badge": "^1.0.30",
+    "@synerise/ds-button": "^1.5.5",
+    "@synerise/ds-button-group": "^1.1.29",
+    "@synerise/ds-collector": "^1.4.11",
+    "@synerise/ds-date-picker": "^1.3.9",
+    "@synerise/ds-date-range-picker": "^1.4.9",
+    "@synerise/ds-divider": "^1.2.6",
+    "@synerise/ds-dropdown": "^1.1.9",
+    "@synerise/ds-empty-states": "^1.0.26",
+    "@synerise/ds-icon": "^1.10.0",
+    "@synerise/ds-information-card": "^1.4.0",
+    "@synerise/ds-inline-edit": "^1.1.9",
+    "@synerise/ds-input": "^1.5.6",
+    "@synerise/ds-input-number": "^1.2.21",
+    "@synerise/ds-list-item": "^1.3.0",
+    "@synerise/ds-modal": "^1.2.22",
+    "@synerise/ds-result": "^1.0.35",
+    "@synerise/ds-scrollbar": "^1.2.5",
+    "@synerise/ds-search": "^1.4.0",
+    "@synerise/ds-select": "^1.3.6",
+    "@synerise/ds-short-cuts": "^1.0.28",
+    "@synerise/ds-skeleton": "^1.0.30",
+    "@synerise/ds-tabs": "^1.1.9",
+    "@synerise/ds-tag": "^1.4.5",
+    "@synerise/ds-tooltip": "^1.3.5",
     "@synerise/ds-utils": "^1.5.3",
     "lodash": "^4.17.21",
     "react-window": "^1.8.11",
@@ -79,5 +78,5 @@
     "react-intl": ">=3.12.0 <= 6.8",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "70a5256c87ef38313eedb9a004d1c6980082b2f5"
+  "gitHead": "db758824923a2a231a0de460f0d6d10739514cda"
 }