@synerise/ds-factors 1.7.7 → 1.8.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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,12 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [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)
7
+
8
+ ### Features
9
+
10
+ - **information-card:** migrate to popover ([de900e4](https://github.com/Synerise/synerise-design/commit/de900e4bc1c32a4bbbf175401374619e691023f2))
11
+
6
12
  ## [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)
7
13
 
8
14
  **Note:** Version bump only for package @synerise/ds-factors
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { type FactorValueProps } from '../Factors.types';
3
- 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;
3
+ 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;
4
4
  export default FactorValue;
@@ -26,7 +26,6 @@ var FactorValue = function FactorValue(_ref) {
26
26
  allowClear = _ref.allowClear,
27
27
  _ref$readOnly = _ref.readOnly,
28
28
  readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
29
- getMenuEntryProps = _ref.getMenuEntryProps,
30
29
  relativeDateProps = _ref.relativeDateProps,
31
30
  arrayProps = _ref.arrayProps,
32
31
  factorValueExtraProps = _ref.factorValueExtraProps,
@@ -60,13 +59,12 @@ var FactorValue = function FactorValue(_ref) {
60
59
  error: error,
61
60
  allowClear: allowClear,
62
61
  readOnly: readOnly,
63
- getMenuEntryProps: getMenuEntryProps,
64
62
  inputProps: inputProps,
65
63
  factorValueExtraProps: factorValueExtraProps
66
64
  }, relativeDateProps, {
67
65
  uncontrolledComponent: uncontrolledComponent
68
66
  }));
69
- }, [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]);
67
+ }, [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]);
70
68
  return /*#__PURE__*/React.createElement(S.FactorInput, {
71
69
  inputType: selectedFactorType,
72
70
  inputTextType: textType,
@@ -8,7 +8,7 @@ var DEFAULT_WIDTH = {
8
8
  export var FactorInput = styled.div.withConfig({
9
9
  displayName: "FactorValuestyle__FactorInput",
10
10
  componentId: "sc-17jtnx3-0"
11
- })(["&&{", ";", "{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) {
11
+ })(["&&{", ";", "{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) {
12
12
  var inputType = props.inputType,
13
13
  _props$inputTextType = props.inputTextType,
14
14
  inputTextType = _props$inputTextType === void 0 ? 'default' : _props$inputTextType;
@@ -25,10 +25,6 @@ export var FactorInput = styled.div.withConfig({
25
25
  }
26
26
  return false;
27
27
  }, Container, function (props) {
28
- return props.withoutTypeSelector ? '3px' : '0';
29
- }, function (props) {
30
- return props.withoutTypeSelector ? '3px' : '0';
31
- }, function (props) {
32
28
  return props.withoutTypeSelector ? '3px' : '0 3px 3px 0';
33
29
  }, function (props) {
34
30
  return props.withoutTypeSelector ? '3px' : '0 3px 3px 0';
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { type FactorValueComponentProps } from '../../Factors.types';
3
- declare const ParameterInput: ({ value, onChange, onParamsClick, parameters, texts, opened, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, readOnly, error, loading, getMenuEntryProps, }: FactorValueComponentProps) => React.JSX.Element;
3
+ declare const ParameterInput: ({ value, onChange, onParamsClick, parameters, texts, opened, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate, readOnly, error, loading, }: FactorValueComponentProps) => React.JSX.Element;
4
4
  export default ParameterInput;
@@ -4,8 +4,7 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
4
4
  import React, { useCallback, useEffect, useMemo, useState } from 'react';
5
5
  import Dropdown from '@synerise/ds-dropdown';
6
6
  import Icon, { AngleDownS } from '@synerise/ds-icon';
7
- import InformationCard from '@synerise/ds-information-card';
8
- import Menu from '@synerise/ds-menu';
7
+ import InformationCard, { InformationCardTooltip } from '@synerise/ds-information-card';
9
8
  import { getPopupContainer } from '@synerise/ds-utils';
10
9
  import { DROPDOWN_HEIGHT, DROPDOWN_HEIGHT_BELOW_THRESHOLD, DROPDOWN_HEIGHT_THRESHOLD } from './Parameter.constants';
11
10
  import { ParameterButton, Value } from './Parameter.style';
@@ -24,8 +23,7 @@ var ParameterInput = function ParameterInput(_ref) {
24
23
  _ref$readOnly = _ref.readOnly,
25
24
  readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
26
25
  error = _ref.error,
27
- loading = _ref.loading,
28
- getMenuEntryProps = _ref.getMenuEntryProps;
26
+ loading = _ref.loading;
29
27
  var _ref2 = parameters || {},
30
28
  buttonIcon = _ref2.buttonIcon,
31
29
  buttonLabel = _ref2.buttonLabel,
@@ -79,10 +77,6 @@ var ParameterInput = function ParameterInput(_ref) {
79
77
  var onDropdownVisibilityChange = useCallback(function (newValue) {
80
78
  newValue && onActivate && onActivate();
81
79
  setDropdownVisible(newValue);
82
- // if (!newValue) {
83
- // // onDeactivate && onDeactivate();
84
- // setDropdownVisible(false);
85
- // }
86
80
  }, [onActivate]);
87
81
  var triggerMode = useMemo(function () {
88
82
  if (parameterIcon) {
@@ -102,31 +96,26 @@ var ParameterInput = function ParameterInput(_ref) {
102
96
  }), /*#__PURE__*/React.createElement(Value, null, parameterName), !readOnly && /*#__PURE__*/React.createElement(Icon, {
103
97
  component: /*#__PURE__*/React.createElement(AngleDownS, null)
104
98
  }));
105
- var trigger = /*#__PURE__*/React.createElement(Menu, {
106
- asDropdownMenu: true,
107
- showTextTooltip: true,
108
- asInfoCardContainer: true,
109
- dataSource: [_extends({
110
- text: triggerButton,
111
- hoverTooltipProps: {
112
- popupPlacement: 'top',
113
- getPopupContainer: getPopupContainerOverride || getPopupContainer
114
- },
115
- renderHoverTooltip: isSelected ? (parameter == null ? void 0 : parameter.renderHoverTooltip) || function () {
116
- var _parameter$id;
117
- return /*#__PURE__*/React.createElement(InformationCard, _extends({
118
- icon: parameterIcon,
119
- subtitle: (_parameter$id = parameter.id) == null ? void 0 : _parameter$id.toString(),
120
- title: parameterName,
121
- descriptionConfig: parameter.description ? {
122
- value: parameter.description,
123
- disabled: true,
124
- label: undefined
125
- } : undefined
126
- }, parameter.informationCardProps));
99
+ var selectedItemInfoCard = useMemo(function () {
100
+ var _parameter$id;
101
+ return isSelected && parameter && ((parameter.renderHoverTooltip == null ? void 0 : parameter.renderHoverTooltip()) || /*#__PURE__*/React.createElement(InformationCard, _extends({
102
+ icon: parameterIcon,
103
+ subtitle: (_parameter$id = parameter.id) == null ? void 0 : _parameter$id.toString(),
104
+ title: parameterName,
105
+ descriptionConfig: parameter.description ? {
106
+ value: parameter.description,
107
+ disabled: true,
108
+ label: undefined
127
109
  } : undefined
128
- }, getMenuEntryProps == null ? void 0 : getMenuEntryProps(parameter))]
129
- });
110
+ }, parameter.informationCardProps)));
111
+ }, [parameter, isSelected, parameterIcon, parameterName]);
112
+ var trigger = selectedItemInfoCard ? /*#__PURE__*/React.createElement(InformationCardTooltip, {
113
+ content: selectedItemInfoCard,
114
+ popoverProps: {
115
+ placement: 'top',
116
+ getPopupContainer: getPopupContainerOverride || getPopupContainer
117
+ }
118
+ }, triggerButton) : triggerButton;
130
119
  useEffect(function () {
131
120
  var checkViewportHeight = function checkViewportHeight() {
132
121
  return setOuterHeight(window.innerHeight < dimensionsConfig.threshold ? dimensionsConfig.lowerHeight : dimensionsConfig.defaultHeight);
@@ -5,7 +5,7 @@ import { useTheme } from '@synerise/ds-core';
5
5
  import Divider from '@synerise/ds-divider';
6
6
  import Dropdown from '@synerise/ds-dropdown';
7
7
  import Icon, { ArrowRightCircleM, SearchM } from '@synerise/ds-icon';
8
- import { itemSizes } from '@synerise/ds-list-item';
8
+ import { ListContextProvider, itemSizes } from '@synerise/ds-list-item';
9
9
  import Result from '@synerise/ds-result';
10
10
  import Scrollbar from '@synerise/ds-scrollbar';
11
11
  import Tabs from '@synerise/ds-tabs';
@@ -306,7 +306,7 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
306
306
  onScroll: handleScroll,
307
307
  maxHeight: dropdownContentHeight,
308
308
  ref: scrollBarRef
309
- }, /*#__PURE__*/React.createElement(S.StyledList, {
309
+ }, /*#__PURE__*/React.createElement(ListContextProvider, null, /*#__PURE__*/React.createElement(S.StyledList, {
310
310
  width: "100%",
311
311
  height: 300,
312
312
  itemCount: currentItems.length,
@@ -330,6 +330,6 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
330
330
  }, listItem.title) : /*#__PURE__*/React.createElement(ParameterDropdownItem, _extends({
331
331
  style: style
332
332
  }, listItem));
333
- })) : getNoResultContainer));
333
+ }))) : getNoResultContainer));
334
334
  };
335
335
  export default ParameterDropdown;
package/dist/Factors.d.ts CHANGED
@@ -2,5 +2,5 @@ import React from 'react';
2
2
  import { type DefinedFactorTypes, type FactorsProps, type SelectedFactorType } from './Factors.types';
3
3
  export declare const DEFAULT_FACTOR_TYPE: DefinedFactorTypes;
4
4
  export declare const FACTOR_TYPE_MAPPING: Record<DefinedFactorTypes, SelectedFactorType>;
5
- 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;
5
+ 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;
6
6
  export default Factors;
package/dist/Factors.js CHANGED
@@ -105,7 +105,6 @@ var Factors = function Factors(_ref) {
105
105
  arrayProps = _ref.arrayProps,
106
106
  readOnly = _ref.readOnly,
107
107
  factorValueExtraProps = _ref.factorValueExtraProps,
108
- getMenuEntryProps = _ref.getMenuEntryProps,
109
108
  _ref$uncontrolledComp = _ref.uncontrolledComponent,
110
109
  uncontrolledComponent = _ref$uncontrolledComp === void 0 ? false : _ref$uncontrolledComp;
111
110
  var allTexts = useTexts(texts);
@@ -168,7 +167,6 @@ var Factors = function Factors(_ref) {
168
167
  error: error,
169
168
  allowClear: allowClear,
170
169
  readOnly: readOnly,
171
- getMenuEntryProps: getMenuEntryProps,
172
170
  factorValueExtraProps: factorValueExtraProps,
173
171
  uncontrolledComponent: uncontrolledComponent
174
172
  }));
@@ -6,7 +6,6 @@ import type { DateFilter, RelativeUnits } from '@synerise/ds-date-range-picker/d
6
6
  import type { InformationCardProps } from '@synerise/ds-information-card';
7
7
  import type { AutoResizeProp, InputProps } from '@synerise/ds-input';
8
8
  import type { ListItemProps } from '@synerise/ds-list-item';
9
- import type { MenuItemProps } from '@synerise/ds-menu';
10
9
  import type { DeepPartial, LiteralStringUnion } from '@synerise/ds-utils';
11
10
  export declare const ALL_FACTOR_TYPES: readonly ["text", "number", "parameter", "contextParameter", "dynamicKey", "formula", "array", "date", "relativeDate", "dateRange"];
12
11
  export type FactorType = LiteralStringUnion<(typeof ALL_FACTOR_TYPES)[number]>;
@@ -26,7 +25,7 @@ export type FormulaValueType = {
26
25
  name: string;
27
26
  value: string;
28
27
  };
29
- export type ParameterValueType = Pick<ListItemProps, 'renderHoverTooltip' | 'hoverTooltipProps' | 'disabled'> & {
28
+ export type ParameterValueType = Pick<ListItemProps, 'renderHoverTooltip' | 'popoverProps' | 'disabled'> & {
30
29
  type: string;
31
30
  icon: ReactNode;
32
31
  name: string;
@@ -196,7 +195,6 @@ export type FactorsProps = {
196
195
  preventAutoloadData?: boolean;
197
196
  inputProps?: Partial<Omit<InputProps, 'handleInputRef' | 'defaultOpen' | 'placeholder' | 'value' | 'onChange' | 'onBlur' | 'error' | 'getPopupContainer' | 'readOnly' | 'allowClear'>>;
198
197
  readOnly?: boolean;
199
- getMenuEntryProps?: (arg?: ParameterValueType) => MenuItemProps;
200
198
  uncontrolledComponent?: boolean;
201
199
  };
202
200
  export type FactorTypeSelectorProps = Pick<FactorsProps, 'unavailableFactorTypes' | 'availableFactorTypes' | 'selectedFactorType' | 'readOnly' | 'getPopupContainerOverride'> & {
@@ -207,11 +205,11 @@ export type FactorTypeSelectorProps = Pick<FactorsProps, 'unavailableFactorTypes
207
205
  [k in DefinedFactorTypes]: string;
208
206
  };
209
207
  };
210
- 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'> & {
208
+ 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'> & {
211
209
  texts: FactorsTexts;
212
210
  selectedFactor: SelectedFactorType;
213
211
  };
214
- export type FactorValueComponentProps = Pick<FactorsProps, 'value' | 'parameters' | 'allowClear' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'inputProps' | 'autoResize' | 'readOnly' | 'arrayProps' | 'getMenuEntryProps' | 'factorValueExtraProps' | 'uncontrolledComponent'> & {
212
+ export type FactorValueComponentProps = Pick<FactorsProps, 'value' | 'parameters' | 'allowClear' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'inputProps' | 'autoResize' | 'readOnly' | 'arrayProps' | 'factorValueExtraProps' | 'uncontrolledComponent'> & {
215
213
  texts: FactorsTexts;
216
214
  onChange: (value: FactorValueType) => void;
217
215
  factorType: FactorType;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-factors",
3
- "version": "1.7.7",
3
+ "version": "1.8.0",
4
4
  "description": "Factors UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -40,27 +40,26 @@
40
40
  "@synerise/ds-badge": "^1.0.30",
41
41
  "@synerise/ds-button": "^1.5.5",
42
42
  "@synerise/ds-button-group": "^1.1.29",
43
- "@synerise/ds-collector": "^1.4.10",
44
- "@synerise/ds-date-picker": "^1.3.8",
45
- "@synerise/ds-date-range-picker": "^1.4.8",
43
+ "@synerise/ds-collector": "^1.4.11",
44
+ "@synerise/ds-date-picker": "^1.3.9",
45
+ "@synerise/ds-date-range-picker": "^1.4.9",
46
46
  "@synerise/ds-divider": "^1.2.6",
47
- "@synerise/ds-dropdown": "^1.1.8",
47
+ "@synerise/ds-dropdown": "^1.1.9",
48
48
  "@synerise/ds-empty-states": "^1.0.26",
49
49
  "@synerise/ds-icon": "^1.10.0",
50
- "@synerise/ds-information-card": "^1.3.9",
51
- "@synerise/ds-inline-edit": "^1.1.8",
50
+ "@synerise/ds-information-card": "^1.4.0",
51
+ "@synerise/ds-inline-edit": "^1.1.9",
52
52
  "@synerise/ds-input": "^1.5.6",
53
53
  "@synerise/ds-input-number": "^1.2.21",
54
- "@synerise/ds-list-item": "^1.2.6",
55
- "@synerise/ds-menu": "^1.2.5",
54
+ "@synerise/ds-list-item": "^1.3.0",
56
55
  "@synerise/ds-modal": "^1.2.22",
57
56
  "@synerise/ds-result": "^1.0.35",
58
57
  "@synerise/ds-scrollbar": "^1.2.5",
59
- "@synerise/ds-search": "^1.3.15",
58
+ "@synerise/ds-search": "^1.4.0",
60
59
  "@synerise/ds-select": "^1.3.6",
61
60
  "@synerise/ds-short-cuts": "^1.0.28",
62
61
  "@synerise/ds-skeleton": "^1.0.30",
63
- "@synerise/ds-tabs": "^1.1.8",
62
+ "@synerise/ds-tabs": "^1.1.9",
64
63
  "@synerise/ds-tag": "^1.4.5",
65
64
  "@synerise/ds-tooltip": "^1.3.5",
66
65
  "@synerise/ds-utils": "^1.5.3",
@@ -79,5 +78,5 @@
79
78
  "react-intl": ">=3.12.0 <= 6.8",
80
79
  "styled-components": "^5.3.3"
81
80
  },
82
- "gitHead": "4cde643d1f63a4b47e84707a13b1b1d138730d53"
81
+ "gitHead": "db758824923a2a231a0de460f0d6d10739514cda"
83
82
  }