@synerise/ds-factors 0.23.6 → 0.24.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,33 @@
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
+ # [0.24.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.23.7...@synerise/ds-factors@0.24.0) (2024-08-30)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **context-selector:** reuse renderHoverTooltip for selected item ([57e8a14](https://github.com/Synerise/synerise-design/commit/57e8a148e70bccd54c6d4540fb36c14d492f110b))
12
+
13
+
14
+ ### Features
15
+
16
+ * **storybook7:** condition stories ([50c3613](https://github.com/Synerise/synerise-design/commit/50c36138dfd1097fe3b1182047eded4bbea584e9))
17
+
18
+
19
+
20
+
21
+
22
+ ## [0.23.7](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.23.6...@synerise/ds-factors@0.23.7) (2024-08-27)
23
+
24
+
25
+ ### Bug Fixes
26
+
27
+ * **factors:** btn color for selected parameter factor ([ef17cbb](https://github.com/Synerise/synerise-design/commit/ef17cbb394078fa27bad346c6f926521ad892aa4))
28
+
29
+
30
+
31
+
32
+
6
33
  ## [0.23.6](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.23.5...@synerise/ds-factors@0.23.6) (2024-08-19)
7
34
 
8
35
  **Note:** Version bump only for package @synerise/ds-factors
package/README.md CHANGED
@@ -151,10 +151,10 @@ Type of value depends on current factor type and can contain values: `string` \
151
151
 
152
152
  ### ParameterOptions
153
153
 
154
- | Property | Description | Type | Default |
155
- | --- | --- | --- | --- |
156
- | buttonIcon | Icon in button | React.ReactNode | - |
157
- | buttonLabel | Label of button | string \ React.ReactNode | - |
158
- | groups | Array of parameter groups | ParameterGroup[] | - |
159
- | items | Array of parameters | ParameterItem[] | - |
160
- | showAllGroup | Whether to show all groups | boolean | false |
154
+ | Property | Description | Type | Default |
155
+ |-----------------------|------------------------------------------------------------|--------------------------|---------|
156
+ | buttonIcon | Icon in button | React.ReactNode | - |
157
+ | buttonLabel | Label of button | string \ React.ReactNode | - |
158
+ | groups | Array of parameter groups | ParameterGroup[] | - |
159
+ | items | Array of parameters | ParameterItem[] | - |
160
+ | selectedButtonColored | Whether to use green custom color if parameter is selected | boolean | - |
@@ -1,4 +1,4 @@
1
- var _excluded = ["buttonIcon", "buttonLabel", "loading"];
1
+ var _excluded = ["buttonIcon", "buttonLabel", "selectedButtonColored", "loading"];
2
2
 
3
3
  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); }
4
4
 
@@ -39,6 +39,7 @@ var ParameterInput = function ParameterInput(_ref) {
39
39
  // @ts-ignore
40
40
  var buttonIcon = parameters.buttonIcon,
41
41
  buttonLabel = parameters.buttonLabel,
42
+ selectedButtonColored = parameters.selectedButtonColored,
42
43
  loading = parameters.loading,
43
44
  restParameters = _objectWithoutPropertiesLoose(parameters, _excluded);
44
45
 
@@ -52,12 +53,14 @@ var ParameterInput = function ParameterInput(_ref) {
52
53
 
53
54
  var _useMemo = useMemo(function () {
54
55
  return {
56
+ isSelected: Boolean((parameter == null ? void 0 : parameter.icon) || (parameter == null ? void 0 : parameter.name)),
55
57
  parameterIcon: (parameter == null ? void 0 : parameter.icon) || buttonIcon,
56
58
  parameterName: (parameter == null ? void 0 : parameter.name) || buttonLabel
57
59
  };
58
60
  }, [parameter, buttonIcon, buttonLabel]),
59
61
  parameterIcon = _useMemo.parameterIcon,
60
- parameterName = _useMemo.parameterName;
62
+ parameterName = _useMemo.parameterName,
63
+ isSelected = _useMemo.isSelected;
61
64
 
62
65
  var handleChange = useCallback(function (val) {
63
66
  onChange(val);
@@ -96,7 +99,8 @@ var ParameterInput = function ParameterInput(_ref) {
96
99
  }, [parameterIcon, readOnly]);
97
100
  var triggerButton = /*#__PURE__*/React.createElement(Button, {
98
101
  error: error,
99
- type: "secondary",
102
+ type: isSelected && selectedButtonColored ? 'custom-color' : 'secondary',
103
+ color: isSelected && selectedButtonColored ? 'green' : undefined,
100
104
  mode: triggerMode,
101
105
  onClick: !readOnly ? handleOnClick : undefined,
102
106
  readOnly: readOnly
@@ -115,7 +119,7 @@ var ParameterInput = function ParameterInput(_ref) {
115
119
  popupPlacement: 'top',
116
120
  getPopupContainer: getPopupContainerOverride || getPopupContainer
117
121
  },
118
- renderHoverTooltip: parameter != null && parameter.name ? function () {
122
+ renderHoverTooltip: isSelected ? (parameter == null ? void 0 : parameter.renderHoverTooltip) || function () {
119
123
  var _parameter$id;
120
124
 
121
125
  return /*#__PURE__*/React.createElement(InformationCard, _extends({
@@ -171,6 +171,7 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
171
171
  };
172
172
 
173
173
  return /*#__PURE__*/React.createElement(Dropdown.Wrapper, {
174
+ "data-testid": "ds-factors-parameter-dropdown-wrapper",
174
175
  style: {
175
176
  width: '300px'
176
177
  },
@@ -18,7 +18,7 @@ var ParameterDropdownItem = function ParameterDropdownItem(_ref) {
18
18
  style = _ref.style;
19
19
 
20
20
  var id = item.id,
21
- _ = item.icon,
21
+ icon = item.icon,
22
22
  itemProps = _objectWithoutPropertiesLoose(item, _excluded);
23
23
 
24
24
  return /*#__PURE__*/React.createElement(ListItem, _extends({}, itemProps, {
@@ -26,7 +26,7 @@ var ParameterDropdownItem = function ParameterDropdownItem(_ref) {
26
26
  className: className,
27
27
  key: item.name + item.id,
28
28
  prefixel: /*#__PURE__*/React.createElement(Icon, {
29
- component: item.icon
29
+ component: icon
30
30
  }),
31
31
  highlight: searchQuery,
32
32
  onClick: function onClick() {
@@ -1,48 +1,49 @@
1
- import * as React from 'react';
2
- import { DateFilter } from '@synerise/ds-date-range-picker/dist/date.types';
3
- import { Texts as DateRangeTexts } from '@synerise/ds-date-range-picker/dist/DateRangePicker.types';
1
+ import type { ReactText, ReactNode, ElementType } from 'react';
2
+ import type { DateFilter } from '@synerise/ds-date-range-picker/dist/date.types';
3
+ import type { Texts as DateRangeTexts } from '@synerise/ds-date-range-picker/dist/DateRangePicker.types';
4
4
  import type { MenuItemProps } from '@synerise/ds-menu';
5
5
  import type { AutoResizeProp } from '@synerise/ds-input';
6
- import { InformationCardProps } from '@synerise/ds-information-card';
6
+ import type { InformationCardProps } from '@synerise/ds-information-card';
7
+ import type { ListItemProps } from '@synerise/ds-list-item';
7
8
  export declare const ALL_FACTOR_TYPES: readonly ["text", "number", "parameter", "contextParameter", "dynamicKey", "formula", "array", "date", "dateRange"];
8
9
  export type FactorType = typeof ALL_FACTOR_TYPES[number] | string;
9
10
  export type DefinedFactorTypes = typeof ALL_FACTOR_TYPES[number];
10
11
  export type DynamicKeyValueType = {
11
- key: React.ReactText;
12
- value: React.ReactText;
12
+ key: ReactText;
13
+ value: ReactText;
13
14
  };
14
15
  export type FormulaValueType = {
15
16
  name: string;
16
17
  value: string;
17
18
  };
18
- export type ParameterValueType = {
19
+ export type ParameterValueType = Pick<ListItemProps, 'renderHoverTooltip' | 'hoverTooltipProps' | 'disabled'> & {
19
20
  type: string;
20
- icon: React.ReactNode;
21
+ icon: ReactNode;
21
22
  name: string;
22
- id: React.ReactText;
23
- groupId?: React.ReactText;
23
+ id: ReactText;
24
+ groupId?: ReactText;
24
25
  description?: string;
25
26
  informationCardProps?: Partial<InformationCardProps>;
26
27
  };
27
28
  export type ParameterGroup = {
28
- id: React.ReactText;
29
+ id: ReactText;
29
30
  name: string;
30
31
  defaultGroup?: boolean;
31
- icon?: React.ReactNode;
32
+ icon?: ReactNode;
32
33
  subGroups?: ParameterGroup[];
33
34
  };
34
35
  export type ParameterItem = {
35
- id: React.ReactText;
36
+ id: ReactText;
36
37
  name: string;
37
- groupId: React.ReactText;
38
- icon?: React.ReactNode;
38
+ groupId: ReactText;
39
+ icon?: ReactNode;
39
40
  disabled?: boolean;
40
41
  };
41
42
  export type FactorValueType = string | number | Date | undefined | DynamicKeyValueType | FormulaValueType | ParameterValueType | Partial<DateFilter>;
42
43
  export type SelectedFactorType = {
43
44
  name: string;
44
- icon: React.ReactNode;
45
- input: React.ElementType;
45
+ icon: ReactNode;
46
+ input: ElementType;
46
47
  };
47
48
  export type FactorsTexts = {
48
49
  dateRangePicker: Partial<DateRangeTexts>;
@@ -74,9 +75,9 @@ export type FactorsTexts = {
74
75
  };
75
76
  };
76
77
  export type FactorsProps = {
77
- factorKey?: React.ReactText;
78
+ factorKey?: ReactText;
78
79
  error?: boolean;
79
- errorText?: React.ReactNode | string;
80
+ errorText?: ReactNode;
80
81
  withoutTypeSelector?: boolean;
81
82
  setSelectedFactorType?: (factor: FactorType) => void;
82
83
  unavailableFactorTypes?: FactorType[];
@@ -94,19 +95,20 @@ export type FactorsProps = {
94
95
  options: string[];
95
96
  };
96
97
  parameters?: {
97
- buttonLabel: string | React.ReactNode;
98
- buttonIcon: React.ReactNode;
98
+ buttonLabel: ReactNode;
99
+ buttonIcon: ReactNode;
100
+ selectedButtonColored?: boolean;
99
101
  groups?: ParameterGroup[];
100
102
  items: ParameterItem[];
101
103
  showAllGroup?: boolean;
102
104
  };
103
105
  onParamsClick?: () => void;
104
- formulaEditor?: React.ReactNode;
106
+ formulaEditor?: ReactNode;
105
107
  texts?: Partial<FactorsTexts>;
106
108
  opened?: boolean;
107
109
  loading?: boolean;
108
110
  preventAutoloadData?: boolean;
109
- withCustomFactor?: React.ReactNode;
111
+ withCustomFactor?: ReactNode;
110
112
  inputProps?: Partial<InputProps>;
111
113
  readOnly?: boolean;
112
114
  getMenuEntryProps?: (arg?: ParameterValueType) => MenuItemProps;
@@ -127,7 +129,7 @@ export type InputProps = Pick<FactorsProps, 'value' | 'parameters' | 'autocomple
127
129
  onChange: (value: FactorValueType) => void;
128
130
  factorType: FactorType;
129
131
  onParamsClick?: () => void;
130
- formulaEditor?: React.ReactNode;
132
+ formulaEditor?: ReactNode;
131
133
  loading?: boolean;
132
134
  preventAutoloadData?: boolean;
133
135
  };
@@ -154,5 +156,5 @@ export type FormulaModalProps = {
154
156
  visible: boolean;
155
157
  onCancel: () => void;
156
158
  texts: FactorsTexts;
157
- formulaEditor?: React.ReactNode;
159
+ formulaEditor?: ReactNode;
158
160
  };
package/dist/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  export { default, factorTypes } from './Factors';
2
2
  export { ALL_FACTOR_TYPES } from './Factors.types';
3
- export type { FactorsProps, ParameterValueType, InputProps } from './Factors.types';
3
+ export type { FactorsProps, ParameterValueType, InputProps, FactorValueType } from './Factors.types';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-factors",
3
- "version": "0.23.6",
3
+ "version": "0.24.0",
4
4
  "description": "Factors UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -33,25 +33,25 @@
33
33
  ],
34
34
  "types": "dist/index.d.ts",
35
35
  "dependencies": {
36
- "@synerise/ds-autocomplete": "^0.8.13",
37
- "@synerise/ds-badge": "^0.8.4",
38
- "@synerise/ds-button": "^0.21.5",
39
- "@synerise/ds-date-picker": "^0.11.11",
40
- "@synerise/ds-date-range-picker": "^0.29.6",
41
- "@synerise/ds-dropdown": "^0.18.9",
42
- "@synerise/ds-icon": "^0.65.0",
43
- "@synerise/ds-information-card": "^0.5.3",
44
- "@synerise/ds-inline-edit": "^0.8.5",
45
- "@synerise/ds-input": "^0.23.6",
46
- "@synerise/ds-input-number": "^0.10.0",
47
- "@synerise/ds-list-item": "^0.4.5",
48
- "@synerise/ds-menu": "^0.19.9",
49
- "@synerise/ds-modal": "^0.17.36",
50
- "@synerise/ds-result": "^0.6.62",
51
- "@synerise/ds-scrollbar": "^0.11.5",
52
- "@synerise/ds-skeleton": "^0.6.4",
53
- "@synerise/ds-tabs": "^0.15.2",
54
- "@synerise/ds-tooltip": "^0.14.35",
36
+ "@synerise/ds-autocomplete": "^0.8.15",
37
+ "@synerise/ds-badge": "^0.8.6",
38
+ "@synerise/ds-button": "^0.21.7",
39
+ "@synerise/ds-date-picker": "^0.11.13",
40
+ "@synerise/ds-date-range-picker": "^0.29.8",
41
+ "@synerise/ds-dropdown": "^0.18.11",
42
+ "@synerise/ds-icon": "^0.65.2",
43
+ "@synerise/ds-information-card": "^0.5.5",
44
+ "@synerise/ds-inline-edit": "^0.8.7",
45
+ "@synerise/ds-input": "^0.24.1",
46
+ "@synerise/ds-input-number": "^0.10.2",
47
+ "@synerise/ds-list-item": "^0.4.7",
48
+ "@synerise/ds-menu": "^0.19.11",
49
+ "@synerise/ds-modal": "^0.17.38",
50
+ "@synerise/ds-result": "^0.7.1",
51
+ "@synerise/ds-scrollbar": "^0.11.7",
52
+ "@synerise/ds-skeleton": "^0.6.5",
53
+ "@synerise/ds-tabs": "^0.15.4",
54
+ "@synerise/ds-tooltip": "^0.14.37",
55
55
  "@synerise/ds-utils": "^0.28.2",
56
56
  "lodash": "^4.17.19",
57
57
  "react-intl": "3.12.0",
@@ -60,8 +60,9 @@
60
60
  },
61
61
  "peerDependencies": {
62
62
  "@synerise/ds-core": "*",
63
+ "antd": "4.7.0",
63
64
  "react": ">=16.9.0 <= 17.0.2",
64
65
  "styled-components": "5.0.1"
65
66
  },
66
- "gitHead": "2e6de17b64023536c24be8fcb67b1e53e8bffa3d"
67
+ "gitHead": "d5df67eecdc1cbcb56def8c17d04b7d883876fbf"
67
68
  }