@synerise/ds-factors 0.12.2 → 0.13.2

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.
Files changed (15) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/README.md +19 -17
  3. package/dist/FactorTypeSelector/FactorTypeSelector.styles.js +1 -1
  4. package/dist/FactorValue/Date/Date.js +10 -2
  5. package/dist/FactorValue/DateRange/DateRange.js +9 -2
  6. package/dist/FactorValue/DynamicKey/DynamicKey.js +4 -2
  7. package/dist/FactorValue/FactorValue.js +23 -26
  8. package/dist/FactorValue/Number/NumberInput.js +4 -2
  9. package/dist/FactorValue/Parameter/Parameter.js +8 -3
  10. package/dist/FactorValue/Parameter/Parameter.style.js +1 -1
  11. package/dist/FactorValue/Parameter/ParameterDropdown.js +1 -0
  12. package/dist/FactorValue/Text/Text.js +4 -2
  13. package/dist/Factors.js +3 -1
  14. package/dist/Factors.types.d.ts +4 -3
  15. package/package.json +10 -10
package/CHANGELOG.md CHANGED
@@ -3,6 +3,40 @@
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.13.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.13.1...@synerise/ds-factors@0.13.2) (2022-05-13)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **factors:** adds changeHandler to onValueChange ([afe05e8](https://github.com/Synerise/synerise-design/commit/afe05e8d568316ca339c975a27bf1b28b0fce237))
12
+
13
+
14
+
15
+
16
+
17
+ ## [0.13.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.13.0...@synerise/ds-factors@0.13.1) (2022-04-29)
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * **factors:** fixes auto height of parameters dropdown list ([67ced37](https://github.com/Synerise/synerise-design/commit/67ced37b02f9e442721afb274c6a32b5def18a83))
23
+
24
+
25
+
26
+
27
+
28
+ # [0.13.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.12.2...@synerise/ds-factors@0.13.0) (2022-04-29)
29
+
30
+
31
+ ### Features
32
+
33
+ * **factors:** adds onDeactivate prop, updates Readme.md ([ff85234](https://github.com/Synerise/synerise-design/commit/ff852349a5c77047d6d0642d4b5587dbcc6d24cd))
34
+ * **factors:** adds tests ([8c469e1](https://github.com/Synerise/synerise-design/commit/8c469e164e986f346b591b3a97ed3b6fbab3cdaa))
35
+
36
+
37
+
38
+
39
+
6
40
  ## [0.12.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.12.1...@synerise/ds-factors@0.12.2) (2022-04-12)
7
41
 
8
42
 
package/README.md CHANGED
@@ -97,23 +97,25 @@ import Factors from '@synerise/ds-factors'
97
97
 
98
98
  ## API
99
99
 
100
- | Property | Description | Type | Default |
101
- | --- | --- | --- | --- |
102
- | autocompleteText | Array of available autocomplete suggestions (only if textType is equal to `autocomplete`) | {options: string[]} | - |
103
- | availableFactorTypes | Array of available factor types | FactorType[] | - |
104
- | defaultFactorType | Default factor type | FactorType | - |
105
- | formulaEditor | Formula editor render in modal when factory type is equal to `formula` | React.ReactNode | - |
106
- | onChangeValue | Callback called when user change value | (value: FactorValueType) => void | - |
107
- | opened | Whether if dropdown should opens from outside of component | boolean | false |
108
- | parameters | Options for parameters list | ParameterOptions | - |
109
- | selectedFactorType | Selected factor type | FactorType | - |
110
- | setSelectedFactorType | Callback called when user selects factor type | (factor: FactorType) => void | - |
111
- | texts | Translations object | FactorsTexts | - |
112
- | textType | Variant of text type input (`autocomplete` \ `expansible` \ `default` ) | string | `default` |
113
- | unavailableFactorTypes | Array of excluded factor types | FactorType[] | - |
114
- | value | Value | FactorValueType | - |
115
- | withoutTypeSelector | Whether if hide factor type selector | boolean | - |
116
- | getPopupContainerOverride | Popup container function for child tooltips and dropdowns | (trigger: HTMLElement | null) => HTMLElement; | - |
100
+ | Property | Description | Type | Default |
101
+ | --- | --- | --- | --- |
102
+ | autocompleteText | Array of available autocomplete suggestions (only if textType is equal to `autocomplete`) | {options: string[]} | - |
103
+ | availableFactorTypes | Array of available factor types | FactorType[] | - |
104
+ | defaultFactorType | Default factor type | FactorType | - |
105
+ | formulaEditor | Formula editor render in modal when factory type is equal to `formula` | React.ReactNode | - |
106
+ | getPopupContainerOverride | Popup container function for child tooltips and dropdowns | (trigger: HTMLElement \ null) => HTMLElement; | - |
107
+ | onActivate | Callback called when user opens dropdown | (fieldType: string) => void | - |
108
+ | onChangeValue | Callback called when user change value | (value: FactorValueType) => void | - |
109
+ | onDeactivate | Callback called when user closes dropdown | () => void | - |
110
+ | opened | Whether if dropdown should opens from outside of component | boolean | false |
111
+ | parameters | Options for parameters list | ParameterOptions | - |
112
+ | selectedFactorType | Selected factor type | FactorType | - |
113
+ | setSelectedFactorType | Callback called when user selects factor type | (factor: FactorType) => void | - |
114
+ | texts | Translations object | FactorsTexts | - |
115
+ | textType | Variant of text type input (`autocomplete` \ `expansible` \ `default` ) | string | `default` |
116
+ | unavailableFactorTypes | Array of excluded factor types | FactorType[] | - |
117
+ | value | Value | FactorValueType | - |
118
+ | withoutTypeSelector | Whether if hide factor type selector | boolean | - |
117
119
 
118
120
  ### FactorType
119
121
 
package/dist/FactorTypeSelector/FactorTypeSelector.styles.js CHANGED
@@ -8,6 +8,6 @@ export var FactorTypeList = styled(Menu).withConfig({
8
8
  export var TriggerButton = styled(Button).withConfig({
9
9
  displayName: "FactorTypeSelectorstyles__TriggerButton",
10
10
  componentId: "sc-15cv997-1"
11
- })(["&&&{display:inline-flex;border-radius:3px 0 0 3px;&:focus{.btn-focus{box-shadow:inset 0 0 0 1px ", ";}}}"], function (props) {
11
+ })(["&&&{display:inline-flex;border-radius:3px 0 0 3px;min-width:32px;&:focus{.btn-focus{box-shadow:inset 0 0 0 1px ", ";}}}"], function (props) {
12
12
  return props.theme.palette['grey-300'];
13
13
  });
package/dist/FactorValue/Date/Date.js CHANGED
@@ -5,12 +5,19 @@ var DateInput = function DateInput(_ref) {
5
5
  var value = _ref.value,
6
6
  onChange = _ref.onChange,
7
7
  texts = _ref.texts,
8
- opened = _ref.opened;
8
+ opened = _ref.opened,
9
+ onDeactivate = _ref.onDeactivate;
9
10
  var changeHandler = React.useCallback(function (date) {
10
11
  onChange(date);
11
12
  }, [onChange]);
13
+ var handleVisibleChange = React.useCallback(function (visible) {
14
+ if (!visible) {
15
+ onDeactivate && onDeactivate();
16
+ }
17
+ }, [onDeactivate]);
12
18
  return /*#__PURE__*/React.createElement(DatePicker, {
13
19
  onApply: changeHandler,
20
+ onValueChange: changeHandler,
14
21
  value: value,
15
22
  showTime: true,
16
23
  useStartOfDay: true,
@@ -18,7 +25,8 @@ var DateInput = function DateInput(_ref) {
18
25
  disabledHours: [],
19
26
  disabledMinutes: [],
20
27
  disabledSeconds: [],
21
- autoFocus: opened
28
+ autoFocus: opened,
29
+ onDropdownVisibleChange: handleVisibleChange
22
30
  });
23
31
  };
24
32
 
package/dist/FactorValue/DateRange/DateRange.js CHANGED
@@ -5,11 +5,17 @@ import { useIntl } from 'react-intl';
5
5
  var DateRangeInput = function DateRangeInput(_ref) {
6
6
  var value = _ref.value,
7
7
  onChange = _ref.onChange,
8
- texts = _ref.texts;
8
+ texts = _ref.texts,
9
+ onDeactivate = _ref.onDeactivate;
9
10
  var intl = useIntl();
10
11
  var changeHandler = React.useCallback(function (date) {
11
12
  onChange(date);
12
13
  }, [onChange]);
14
+ var handleVisibleChange = React.useCallback(function (visible) {
15
+ if (!visible) {
16
+ onDeactivate && onDeactivate();
17
+ }
18
+ }, [onDeactivate]);
13
19
  return /*#__PURE__*/React.createElement(DateRangePicker, {
14
20
  intl: intl,
15
21
  onApply: changeHandler,
@@ -21,7 +27,8 @@ var DateRangeInput = function DateRangeInput(_ref) {
21
27
  relativeModes: ['PAST'],
22
28
  showRelativePicker: true,
23
29
  popoverProps: {
24
- placement: 'bottomLeft'
30
+ placement: 'bottomLeft',
31
+ onVisibleChange: handleVisibleChange
25
32
  }
26
33
  });
27
34
  };
package/dist/FactorValue/DynamicKey/DynamicKey.js CHANGED
@@ -15,7 +15,8 @@ var DynamicKey = function DynamicKey(_ref) {
15
15
  _ref$withoutTypeSelec = _ref.withoutTypeSelector,
16
16
  withoutTypeSelector = _ref$withoutTypeSelec === void 0 ? false : _ref$withoutTypeSelec,
17
17
  texts = _ref.texts,
18
- opened = _ref.opened;
18
+ opened = _ref.opened,
19
+ onDeactivate = _ref.onDeactivate;
19
20
 
20
21
  var _React$useState = React.useState({
21
22
  key: value.key,
@@ -44,7 +45,8 @@ var DynamicKey = function DynamicKey(_ref) {
44
45
  value: localValue.key,
45
46
  name: "key",
46
47
  onChange: handleChange,
47
- autoFocus: opened
48
+ autoFocus: opened,
49
+ onBlur: onDeactivate
48
50
  }), /*#__PURE__*/React.createElement(RawInput, {
49
51
  placeholder: texts.dynamicKey.valuePlaceholder,
50
52
  value: localValue.value,
package/dist/FactorValue/FactorValue.js CHANGED
@@ -19,34 +19,31 @@ var FactorValue = function FactorValue(_ref) {
19
19
  factorKey = _ref.factorKey,
20
20
  preventAutoloadData = _ref.preventAutoloadData,
21
21
  getPopupContainerOverride = _ref.getPopupContainerOverride,
22
- onActivate = _ref.onActivate;
22
+ onActivate = _ref.onActivate,
23
+ onDeactivate = _ref.onDeactivate;
23
24
  var inputType = React.useMemo(function () {
24
25
  var InputComponent = selectedFactor.input;
25
- return (
26
- /*#__PURE__*/
27
- // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
28
- // @ts-ignore
29
- React.createElement(InputComponent, {
30
- key: factorKey + "-" + selectedFactor.name,
31
- value: value,
32
- placeholder: texts.valuePlaceholder,
33
- onChange: onChangeValue,
34
- textType: textType,
35
- factorType: selectedFactorType,
36
- autocompleteText: autocompleteText,
37
- parameters: ['parameter', 'contextParameter'].indexOf(selectedFactorType) >= 0 && parameters,
38
- withoutTypeSelector: withoutTypeSelector,
39
- texts: texts,
40
- formulaEditor: formulaEditor,
41
- opened: opened,
42
- loading: loading,
43
- onParamsClick: onParamsClick,
44
- preventAutoloadData: preventAutoloadData,
45
- getPopupContainerOverride: getPopupContainerOverride,
46
- onActivate: onActivate
47
- })
48
- );
49
- }, [selectedFactor.input, selectedFactor.name, factorKey, value, texts, onChangeValue, textType, selectedFactorType, autocompleteText, parameters, withoutTypeSelector, formulaEditor, opened, loading, onParamsClick, preventAutoloadData, onActivate, getPopupContainerOverride]);
26
+ return /*#__PURE__*/React.createElement(InputComponent, {
27
+ key: factorKey + "-" + selectedFactor.name,
28
+ value: value,
29
+ placeholder: texts.valuePlaceholder,
30
+ onChange: onChangeValue,
31
+ textType: textType,
32
+ factorType: selectedFactorType,
33
+ autocompleteText: autocompleteText,
34
+ parameters: ['parameter', 'contextParameter'].indexOf(selectedFactorType) >= 0 && parameters,
35
+ withoutTypeSelector: withoutTypeSelector,
36
+ texts: texts,
37
+ formulaEditor: formulaEditor,
38
+ opened: opened,
39
+ loading: loading,
40
+ onParamsClick: onParamsClick,
41
+ preventAutoloadData: preventAutoloadData,
42
+ getPopupContainerOverride: getPopupContainerOverride,
43
+ onActivate: onActivate,
44
+ onDeactivate: onDeactivate
45
+ });
46
+ }, [selectedFactor.input, selectedFactor.name, factorKey, value, texts, onChangeValue, textType, selectedFactorType, autocompleteText, parameters, withoutTypeSelector, formulaEditor, opened, loading, onParamsClick, preventAutoloadData, getPopupContainerOverride, onActivate, onDeactivate]);
50
47
  return /*#__PURE__*/React.createElement(S.FactorInput, {
51
48
  withoutTypeSelector: withoutTypeSelector
52
49
  }, inputType);
package/dist/FactorValue/Number/NumberInput.js CHANGED
@@ -6,7 +6,8 @@ var NumberInput = function NumberInput(_ref) {
6
6
  var value = _ref.value,
7
7
  onChange = _ref.onChange,
8
8
  texts = _ref.texts,
9
- opened = _ref.opened;
9
+ opened = _ref.opened,
10
+ onDeactivate = _ref.onDeactivate;
10
11
 
11
12
  var _React$useState = React.useState(value),
12
13
  localValue = _React$useState[0],
@@ -26,7 +27,8 @@ var NumberInput = function NumberInput(_ref) {
26
27
  autoFocus: opened,
27
28
  placeholder: texts.valuePlaceholder,
28
29
  value: localValue,
29
- onChange: handleChange
30
+ onChange: handleChange,
31
+ onBlur: onDeactivate
30
32
  });
31
33
  };
32
34
 
package/dist/FactorValue/Parameter/Parameter.js CHANGED
@@ -22,7 +22,8 @@ var ParameterInput = function ParameterInput(_ref) {
22
22
  opened = _ref.opened,
23
23
  preventAutoloadData = _ref.preventAutoloadData,
24
24
  getPopupContainerOverride = _ref.getPopupContainerOverride,
25
- onActivate = _ref.onActivate;
25
+ onActivate = _ref.onActivate,
26
+ onDeactivate = _ref.onDeactivate;
26
27
 
27
28
  // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
28
29
  // @ts-ignore
@@ -57,8 +58,12 @@ var ParameterInput = function ParameterInput(_ref) {
57
58
  }, []);
58
59
  var onDropdownVisibilityChange = React.useCallback(function (newValue) {
59
60
  newValue && onActivate && onActivate();
60
- !newValue && setDropdownVisible(false);
61
- }, [onActivate]);
61
+
62
+ if (!newValue) {
63
+ onDeactivate && onDeactivate();
64
+ setDropdownVisible(false);
65
+ }
66
+ }, [onActivate, onDeactivate]);
62
67
  return /*#__PURE__*/React.createElement("div", {
63
68
  "data-popup-container": true
64
69
  }, /*#__PURE__*/React.createElement(Dropdown, {
package/dist/FactorValue/Parameter/Parameter.style.js CHANGED
@@ -11,7 +11,7 @@ export var ContentPlaceholder = styled.div.withConfig({
11
11
  export var ItemsList = styled(Menu).withConfig({
12
12
  displayName: "Parameterstyle__ItemsList",
13
13
  componentId: "u2uvgh-2"
14
- })(["width:100%;"]);
14
+ })(["width:100%;.ds-factors-parameter-list{height:auto !important;max-height:300px;}"]);
15
15
  export var SearchResult = styled.span.withConfig({
16
16
  displayName: "Parameterstyle__SearchResult",
17
17
  componentId: "u2uvgh-3"
package/dist/FactorValue/Parameter/ParameterDropdown.js CHANGED
@@ -220,6 +220,7 @@ var ParameterDropdown = function ParameterDropdown(_ref) {
220
220
  onYReachEnd: onFetchData,
221
221
  onScroll: handleScroll
222
222
  }, /*#__PURE__*/React.createElement(List, {
223
+ className: "ds-factors-parameter-list",
223
224
  width: "100%",
224
225
  height: 300,
225
226
  itemCount: currentItems.length,
package/dist/FactorValue/Text/Text.js CHANGED
@@ -15,7 +15,8 @@ var TextInput = function TextInput(_ref) {
15
15
  textType = _ref.textType,
16
16
  autocompleteText = _ref.autocompleteText,
17
17
  factorType = _ref.factorType,
18
- opened = _ref.opened;
18
+ opened = _ref.opened,
19
+ onDeactivate = _ref.onDeactivate;
19
20
 
20
21
  var _React$useState = React.useState(false),
21
22
  openExpanseEditor = _React$useState[0],
@@ -81,7 +82,8 @@ var TextInput = function TextInput(_ref) {
81
82
  placeholder: texts.valuePlaceholder,
82
83
  suffix: SuffixIcon,
83
84
  value: localValue,
84
- onChange: handleChange
85
+ onChange: handleChange,
86
+ onBlur: onDeactivate
85
87
  })), /*#__PURE__*/React.createElement(TextModal, {
86
88
  visible: openExpanseEditor,
87
89
  onCancel: function onCancel() {
package/dist/Factors.js CHANGED
@@ -91,6 +91,7 @@ var Factors = function Factors(_ref) {
91
91
  factorKey = _ref.factorKey,
92
92
  preventAutoloadData = _ref.preventAutoloadData,
93
93
  onActivate = _ref.onActivate,
94
+ onDeactivate = _ref.onDeactivate,
94
95
  getPopupContainerOverride = _ref.getPopupContainerOverride;
95
96
 
96
97
  var _useIntl = useIntl(),
@@ -412,7 +413,8 @@ var Factors = function Factors(_ref) {
412
413
  factorKey: factorKey,
413
414
  preventAutoloadData: preventAutoloadData,
414
415
  getPopupContainerOverride: getPopupContainerOverride,
415
- onActivate: onActivate
416
+ onActivate: onActivate,
417
+ onDeactivate: onDeactivate
416
418
  }));
417
419
  };
418
420
 
package/dist/Factors.types.d.ts CHANGED
@@ -35,7 +35,7 @@ export declare type FactorValueType = string | number | Date | undefined | Dynam
35
35
  export declare type SelectedFactorType = {
36
36
  name: string;
37
37
  icon: React.ReactNode;
38
- input: React.ReactNode;
38
+ input: React.ElementType;
39
39
  };
40
40
  export declare type FactorsTexts = {
41
41
  dateRangePicker: DateRangeTexts;
@@ -73,6 +73,7 @@ export declare type FactorsProps = {
73
73
  defaultFactorType: FactorType;
74
74
  getPopupContainerOverride?: (trigger: HTMLElement | null) => HTMLElement;
75
75
  onActivate?: () => void;
76
+ onDeactivate?: () => void;
76
77
  onChangeValue: (value: FactorValueType) => void;
77
78
  value: FactorValueType;
78
79
  textType?: 'autocomplete' | 'expansible' | 'default' | string;
@@ -98,11 +99,11 @@ export declare type FactorTypeSelectorProps = Pick<FactorsProps, 'unavailableFac
98
99
  setSelectedFactorType: (factor: FactorType) => void;
99
100
  selectedFactor: SelectedFactorType;
100
101
  };
101
- export declare type FactorValueProps = Pick<FactorsProps, 'onChangeValue' | 'onParamsClick' | 'value' | 'selectedFactorType' | 'parameters' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'formulaEditor' | 'opened' | 'loading' | 'factorKey' | 'preventAutoloadData' | 'getPopupContainerOverride' | 'onActivate'> & {
102
+ export declare type FactorValueProps = Pick<FactorsProps, 'onChangeValue' | 'onParamsClick' | 'value' | 'selectedFactorType' | 'parameters' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'formulaEditor' | 'opened' | 'loading' | 'factorKey' | 'preventAutoloadData' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate'> & {
102
103
  texts: FactorsTexts;
103
104
  selectedFactor: SelectedFactorType;
104
105
  };
105
- export declare type InputProps = Pick<FactorsProps, 'value' | 'parameters' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate'> & {
106
+ export declare type InputProps = Pick<FactorsProps, 'value' | 'parameters' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate'> & {
106
107
  texts: FactorsTexts;
107
108
  onChange: (value: FactorValueType) => void;
108
109
  factorType: FactorType;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@synerise/ds-factors",
3
- "version": "0.12.2",
3
+ "version": "0.13.2",
4
4
  "description": "Factors UI Component for the Synerise Design System",
5
5
  "license": "ISC",
6
6
  "repository": "Synerise/synerise-design",
@@ -32,20 +32,20 @@
32
32
  ],
33
33
  "types": "dist/index.d.ts",
34
34
  "dependencies": {
35
- "@synerise/ds-autocomplete": "^0.4.9",
36
- "@synerise/ds-badge": "^0.6.2",
35
+ "@synerise/ds-autocomplete": "^0.4.10",
36
+ "@synerise/ds-badge": "^0.6.3",
37
37
  "@synerise/ds-button": "^0.17.2",
38
- "@synerise/ds-date-picker": "^0.6.16",
39
- "@synerise/ds-date-range-picker": "^0.12.12",
40
- "@synerise/ds-dropdown": "^0.17.16",
38
+ "@synerise/ds-date-picker": "^0.6.18",
39
+ "@synerise/ds-date-range-picker": "^0.12.14",
40
+ "@synerise/ds-dropdown": "^0.17.17",
41
41
  "@synerise/ds-icon": "^0.49.0",
42
- "@synerise/ds-inline-edit": "^0.6.11",
42
+ "@synerise/ds-inline-edit": "^0.6.12",
43
43
  "@synerise/ds-input": "^0.18.10",
44
- "@synerise/ds-input-number": "^0.6.9",
44
+ "@synerise/ds-input-number": "^0.6.10",
45
45
  "@synerise/ds-menu": "^0.13.2",
46
46
  "@synerise/ds-modal": "^0.15.9",
47
47
  "@synerise/ds-result": "^0.6.9",
48
- "@synerise/ds-tabs": "^0.13.10",
48
+ "@synerise/ds-tabs": "^0.13.11",
49
49
  "@synerise/ds-typography": "^0.12.2",
50
50
  "@synerise/ds-utils": "^0.19.0",
51
51
  "classnames": "^2.2.6",
@@ -55,5 +55,5 @@
55
55
  "@synerise/ds-core": "*",
56
56
  "react": ">=16.9.0 < 17.0.0"
57
57
  },
58
- "gitHead": "78a3de75d8ec9c917d96c1b54c70d24f50dc8c7a"
58
+ "gitHead": "25e5737ebe9d4319de963b369bc281651872887c"
59
59
  }