@synerise/ds-factors 1.0.0 → 1.1.0

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.1.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.0.1...@synerise/ds-factors@1.1.0) (2025-03-26)
+
+
+### Features
+
+* 🎸 removes debounce from factors ([1156197](https://github.com/Synerise/synerise-design/commit/11561979b0c1b368e9d9909e8a0cf84cfb45472b))
+
+
+
+
+
+## [1.0.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.0.0...@synerise/ds-factors@1.0.1) (2025-03-18)
+
+**Note:** Version bump only for package @synerise/ds-factors
+
+
+
+
+
 ## [0.28.14](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@0.28.13...@synerise/ds-factors@0.28.14) (2025-03-10)
 
 **Note:** Version bump only for package @synerise/ds-factors

package/dist/FactorTypeSelector/FactorTypeSelector.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { FactorTypeSelectorProps } from '../Factors.types';
-declare const FactorTypeSelector: ({ selectedFactorType, setSelectedFactorType, unavailableFactorTypes, availableFactorTypes, selectedFactor, texts, readOnly, }: FactorTypeSelectorProps) => React.JSX.Element;
+declare const FactorTypeSelector: ({ selectedFactorType, setSelectedFactorType, unavailableFactorTypes, availableFactorTypes, factorTypeMapping, selectedFactor, texts, readOnly, }: FactorTypeSelectorProps) => React.JSX.Element;
 export default FactorTypeSelector;

package/dist/FactorTypeSelector/FactorTypeSelector.js

@@ -6,12 +6,12 @@ import ListItem from '@synerise/ds-list-item';
 import { theme } from '@synerise/ds-core';
 import * as S from './FactorTypeSelector.styles';
 import { ALL_FACTOR_TYPES } from '../Factors.types';
-import { factorTypes } from '../Factors';
 var FactorTypeSelector = function FactorTypeSelector(_ref) {
   var selectedFactorType = _ref.selectedFactorType,
     setSelectedFactorType = _ref.setSelectedFactorType,
     unavailableFactorTypes = _ref.unavailableFactorTypes,
     availableFactorTypes = _ref.availableFactorTypes,
+    factorTypeMapping = _ref.factorTypeMapping,
     selectedFactor = _ref.selectedFactor,
     texts = _ref.texts,
     readOnly = _ref.readOnly;
@@ -28,9 +28,9 @@ var FactorTypeSelector = function FactorTypeSelector(_ref) {
     return list.map(function (type) {
       return /*#__PURE__*/React.createElement(ListItem, {
         className: "ds-factor-type",
-        key: factorTypes[type].name,
+        key: factorTypeMapping[type].name,
         prefixel: /*#__PURE__*/React.createElement(Icon, {
-          component: factorTypes[type].icon
+          component: factorTypeMapping[type].icon
         }),
         suffixel: type === selectedFactorType ? /*#__PURE__*/React.createElement(Icon, {
           component: /*#__PURE__*/React.createElement(CheckS, null),
@@ -42,7 +42,7 @@ var FactorTypeSelector = function FactorTypeSelector(_ref) {
         }
       }, texts[type]);
     });
-  }, [availableFactorTypes, unavailableFactorTypes, selectedFactorType, texts, setSelectedFactorType]);
+  }, [availableFactorTypes, unavailableFactorTypes, factorTypeMapping, selectedFactorType, texts, setSelectedFactorType]);
   var trigger = /*#__PURE__*/React.createElement(S.TriggerButton, {
     mode: "single-icon",
     className: "ds-factors-type-selector",

package/dist/FactorValue/Date/Date.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { InputProps } from '../../Factors.types';
-declare const DateInput: ({ value, onChange, texts, opened, onDeactivate, onActivate, error, allowClear, readOnly, getPopupContainerOverride, }: InputProps) => React.JSX.Element;
+import { FactorValueComponentProps } from '../../Factors.types';
+declare const DateInput: ({ value, onChange, texts, opened, onDeactivate, onActivate, error, allowClear, readOnly, getPopupContainerOverride, }: FactorValueComponentProps) => React.JSX.Element;
 export default DateInput;

package/dist/FactorValue/DateRange/DateRange.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { InputProps } from '../../Factors.types';
-declare const DateRangeInput: ({ getPopupContainerOverride, value, onChange, error, texts, onDeactivate, allowClear, readOnly, }: InputProps) => React.JSX.Element;
+import { FactorValueComponentProps } from '../../Factors.types';
+declare const DateRangeInput: ({ getPopupContainerOverride, value, onChange, error, texts, onDeactivate, allowClear, readOnly, }: FactorValueComponentProps) => React.JSX.Element;
 export default DateRangeInput;

package/dist/FactorValue/DynamicKey/DynamicKey.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { InputProps } from '../../Factors.types';
-declare const DynamicKey: ({ value, onChange, withoutTypeSelector, texts, opened, onDeactivate, error, readOnly, }: InputProps) => React.JSX.Element;
+import { FactorValueComponentProps } from '../../Factors.types';
+declare const DynamicKey: ({ value, onChange, withoutTypeSelector, texts, opened, onDeactivate, error, readOnly, }: FactorValueComponentProps) => React.JSX.Element;
 export default DynamicKey;

package/dist/FactorValue/DynamicKey/DynamicKey.js

@@ -1,7 +1,6 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { RawInput } from '@synerise/ds-input';
-import { debounce } from 'lodash';
 import * as S from './DynamicKey.style';
 var DynamicKey = function DynamicKey(_ref) {
   var value = _ref.value,
@@ -23,15 +22,11 @@ var DynamicKey = function DynamicKey(_ref) {
   var _useState2 = useState(false),
     localError = _useState2[0],
     setLocalError = _useState2[1];
-  var onChangeRef = useRef(onChange);
-  var debouncedOnChange = useRef(debounce(function (inputValue) {
-    onChangeRef.current && onChangeRef.current(inputValue);
-  }, 300)).current;
   var handleChange = function handleChange(event) {
     var newValue = _extends({}, value);
     newValue[event.target.name] = event.target.value;
     setLocalValue(newValue);
-    debouncedOnChange(newValue);
+    onChange(newValue);
     if (!event.target.value.length) {
       setLocalError(true);
     } else {
@@ -39,13 +34,11 @@ var DynamicKey = function DynamicKey(_ref) {
     }
   };
   useEffect(function () {
-    onChangeRef.current = onChange;
-  }, [localValue, onChange]);
-  useEffect(function () {
-    return function () {
-      debouncedOnChange.cancel();
-    };
-  }, [debouncedOnChange]);
+    setLocalValue({
+      key: value.key,
+      value: value.value
+    });
+  }, [value]);
   var trigger = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(RawInput, {
     placeholder: texts.dynamicKey.keyPlaceholder,
     value: localValue.key,

package/dist/FactorValue/FactorValue.js

@@ -30,16 +30,17 @@ var FactorValue = function FactorValue(_ref) {
     if (!selectedFactor) {
       return undefined;
     }
-    var InputComponent = selectedFactor.input;
-    return /*#__PURE__*/React.createElement(InputComponent, {
+    var FactorValueComponent = selectedFactor.component;
+    return /*#__PURE__*/React.createElement(FactorValueComponent, {
       key: factorKey + "-" + selectedFactor.name,
-      value: value,
-      placeholder: texts.valuePlaceholder,
+      value: value
+      // placeholder={texts.valuePlaceholder}
+      ,
       onChange: onChangeValue,
       textType: textType,
       factorType: selectedFactorType,
       autocompleteText: autocompleteText,
-      parameters: ['parameter', 'contextParameter'].indexOf(selectedFactorType) >= 0 && parameters,
+      parameters: ['parameter', 'contextParameter'].indexOf(selectedFactorType) >= 0 ? parameters : undefined,
       withoutTypeSelector: withoutTypeSelector,
       texts: texts,
       inputProps: inputProps,

package/dist/FactorValue/Formula/Formula.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { InputProps } from '../../Factors.types';
-declare const FormulaInput: ({ value, error, onChange, withoutTypeSelector, texts, formulaEditor, readOnly, }: InputProps) => React.JSX.Element;
+import { FactorValueComponentProps } from '../../Factors.types';
+declare const FormulaInput: ({ value, error, onChange, withoutTypeSelector, texts, formulaEditor, readOnly, }: FactorValueComponentProps) => React.JSX.Element;
 export default FormulaInput;

package/dist/FactorValue/Number/NumberInput.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { InputProps } from '../../Factors.types';
-declare const NumberInput: ({ error, value, onChange, texts, opened, onDeactivate, readOnly }: InputProps) => React.JSX.Element;
+import { FactorValueComponentProps } from '../../Factors.types';
+declare const NumberInput: ({ error, value, onChange, texts, opened, onDeactivate, readOnly, }: FactorValueComponentProps) => React.JSX.Element;
 export default NumberInput;

package/dist/FactorValue/Number/NumberInput.js

@@ -1,6 +1,5 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import InputNumber from '@synerise/ds-input-number';
-import { debounce } from 'lodash';
 var NumberInput = function NumberInput(_ref) {
   var error = _ref.error,
     value = _ref.value,
@@ -13,21 +12,12 @@ var NumberInput = function NumberInput(_ref) {
   var _useState = useState(value),
     localValue = _useState[0],
     setLocalValue = _useState[1];
-  var onChangeRef = useRef(onChange);
   useEffect(function () {
-    onChangeRef.current = onChange;
-  }, [localValue, onChange]);
-  var debouncedOnChange = useRef(debounce(function (inputValue) {
-    onChangeRef.current && onChangeRef.current(inputValue);
-  }, 300)).current;
-  useEffect(function () {
-    return function () {
-      debouncedOnChange.cancel();
-    };
-  }, [debouncedOnChange]);
+    setLocalValue(value);
+  }, [value]);
   var handleChange = function handleChange(val) {
     setLocalValue(val);
-    debouncedOnChange(val);
+    onChange(val);
   };
   return /*#__PURE__*/React.createElement(InputNumber, {
     error: error,

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

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

package/dist/FactorValue/Parameter/Parameter.js

@@ -27,12 +27,12 @@ var ParameterInput = function ParameterInput(_ref) {
     error = _ref.error,
     loading = _ref.loading,
     getMenuEntryProps = _ref.getMenuEntryProps;
-  // @ts-ignore
-  var buttonIcon = parameters.buttonIcon,
-    buttonLabel = parameters.buttonLabel,
-    selectedButtonColored = parameters.selectedButtonColored,
-    dropdownDimensionsConfig = parameters.dropdownDimensionsConfig,
-    restParameters = _objectWithoutPropertiesLoose(parameters, _excluded);
+  var _ref2 = parameters || {},
+    buttonIcon = _ref2.buttonIcon,
+    buttonLabel = _ref2.buttonLabel,
+    selectedButtonColored = _ref2.selectedButtonColored,
+    dropdownDimensionsConfig = _ref2.dropdownDimensionsConfig,
+    restParameters = _objectWithoutPropertiesLoose(_ref2, _excluded);
   var dimensionsConfig = _extends({
     defaultHeight: DROPDOWN_HEIGHT,
     lowerHeight: DROPDOWN_HEIGHT_BELOW_THRESHOLD,

package/dist/FactorValue/Parameter/Parameter.style.js

@@ -34,7 +34,7 @@ export var Value = styled.span.withConfig({
 export var StyledList = styled(VariableSizeList).withConfig({
   displayName: "Parameterstyle__StyledList",
   componentId: "sc-u2uvgh-6"
-})(["overflowx:unset;overflowy:unset;height:auto !important;max-height:300px;"]);
+})(["overflow-x:unset;overflow-y:unset;height:auto !important;max-height:300px;"]);
 export var Skeleton = styled(DropdownSkeleton).withConfig({
   displayName: "Parameterstyle__Skeleton",
   componentId: "sc-u2uvgh-7"

package/dist/FactorValue/Text/Text.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { InputProps } from '../../Factors.types';
-declare const TextInput: ({ value, onChange, texts, textType, autocompleteText, factorType, opened, onDeactivate, error, inputProps, getPopupContainerOverride, readOnly, }: InputProps) => React.JSX.Element;
+import { FactorValueComponentProps } from '../../Factors.types';
+declare const TextInput: ({ value, onChange, texts, textType, autocompleteText, factorType, opened, onDeactivate, error, inputProps, getPopupContainerOverride, readOnly, }: FactorValueComponentProps) => React.JSX.Element;
 export default TextInput;

package/dist/FactorValue/Text/Text.js

@@ -1,6 +1,5 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
-import React, { useCallback, useEffect, useMemo, useState, useRef } from 'react';
-import { debounce } from 'lodash';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import Icon, { FullScreenM } from '@synerise/ds-icon';
 import { theme } from '@synerise/ds-core';
 import Autocomplete from '@synerise/ds-autocomplete';
@@ -33,41 +32,32 @@ var TextInput = function TextInput(_ref) {
   var _useState4 = useState(false),
     localError = _useState4[0],
     setLocalError = _useState4[1];
-  var onChangeRef = useRef(onChange);
   useEffect(function () {
     if (inputRef != null && inputRef.current && opened) {
       inputRef.current.focus();
     }
   }, [inputRef, opened]);
-  useEffect(function () {
-    onChangeRef.current = onChange;
-  }, [localValue, onChange]);
-  var debouncedOnChange = useRef(debounce(function (inputValue) {
-    onChangeRef.current && onChangeRef.current(inputValue);
-  }, 300)).current;
-  useEffect(function () {
-    return function () {
-      debouncedOnChange.cancel();
-    };
-  }, [debouncedOnChange]);
   var handleChange = useCallback(function (event) {
     setLocalValue(event.target.value);
-    debouncedOnChange(event.target.value);
+    onChange(event.target.value);
     if (!event.target.value.length) {
       setLocalError(true);
     } else {
       setLocalError(false);
     }
-  }, [setLocalValue, setLocalError, debouncedOnChange]);
+  }, [setLocalValue, setLocalError, onChange]);
   var handleApply = useCallback(function (val) {
     setOpenExpanseEditor(false);
     setLocalValue(val);
-    debouncedOnChange(val);
-  }, [debouncedOnChange]);
+    onChange(val);
+  }, [onChange]);
   var handleAutocomplete = useCallback(function (val) {
     setLocalValue(val);
-    debouncedOnChange(val);
-  }, [debouncedOnChange]);
+    onChange(val);
+  }, [onChange]);
+  useEffect(function () {
+    setLocalValue(value);
+  }, [value]);
   var autocompleteOptions = useMemo(function () {
     return autocompleteText && autocompleteText.options.filter(function (option) {
       return option.toLowerCase().includes(String(localValue).toLowerCase());

package/dist/Factors.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { DefinedFactorTypes, FactorsProps, SelectedFactorType } from './Factors.types';
-export declare const factorTypes: 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, error, inputProps, readOnly, getMenuEntryProps, }: FactorsProps) => React.JSX.Element;
+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, readOnly, getMenuEntryProps, }: FactorsProps) => React.JSX.Element;
 export default Factors;

package/dist/Factors.js

@@ -1,5 +1,7 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 import React, { useMemo } from 'react';
 import { BookM, Calendar2M, DynamicKeyM, FormulaM, HashM, ListM, ShowM, TextM } from '@synerise/ds-icon';
+import { NOOP } from '@synerise/ds-utils';
 import * as S from './style/Factors.style';
 import FactorTypeSelector from './FactorTypeSelector/FactorTypeSelector';
 import FactorValue from './FactorValue/FactorValue';
@@ -11,55 +13,53 @@ import ParameterInput from './FactorValue/Parameter/Parameter';
 import NumberInput from './FactorValue/Number/NumberInput';
 import DateRangeInput from './FactorValue/DateRange/DateRange';
 import { useTexts } from './hooks/useTexts';
-export var factorTypes = {
+export var FACTOR_TYPE_MAPPING = {
   text: {
     icon: /*#__PURE__*/React.createElement(TextM, null),
     name: 'Text',
-    input: TextInput
+    component: TextInput
   },
   number: {
     icon: /*#__PURE__*/React.createElement(HashM, null),
     name: 'Number',
-    input: NumberInput
+    component: NumberInput
   },
   parameter: {
     icon: /*#__PURE__*/React.createElement(BookM, null),
     name: 'Parameter',
-    input: ParameterInput
+    component: ParameterInput
   },
   contextParameter: {
     icon: /*#__PURE__*/React.createElement(ShowM, null),
     name: 'Context parameter',
-    input: ParameterInput
+    component: ParameterInput
   },
   dynamicKey: {
     icon: /*#__PURE__*/React.createElement(DynamicKeyM, null),
     name: 'Dynamic key',
-    input: DynamicKey
+    component: DynamicKey
   },
   formula: {
     icon: /*#__PURE__*/React.createElement(FormulaM, null),
     name: 'Formula',
-    input: FormulaInput
+    component: FormulaInput
   },
   array: {
     icon: /*#__PURE__*/React.createElement(ListM, null),
     name: 'Array',
-    input: TextInput
+    component: TextInput
   },
   date: {
     icon: /*#__PURE__*/React.createElement(Calendar2M, null),
     name: 'Date',
-    input: DateInput
+    component: DateInput
   },
   dateRange: {
     icon: /*#__PURE__*/React.createElement(Calendar2M, null),
     name: 'Date range',
-    input: DateRangeInput
+    component: DateRangeInput
   }
 };
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-var NOOP = function NOOP() {};
 var Factors = function Factors(_ref) {
   var selectedFactorType = _ref.selectedFactorType,
     _ref$setSelectedFacto = _ref.setSelectedFactorType,
@@ -88,6 +88,7 @@ var Factors = function Factors(_ref) {
     onActivate = _ref.onActivate,
     onDeactivate = _ref.onDeactivate,
     getPopupContainerOverride = _ref.getPopupContainerOverride,
+    customFactorValueComponents = _ref.customFactorValueComponents,
     error = _ref.error,
     inputProps = _ref.inputProps,
     readOnly = _ref.readOnly,
@@ -96,19 +97,34 @@ var Factors = function Factors(_ref) {
   var factorType = useMemo(function () {
     return selectedFactorType || defaultFactorType;
   }, [selectedFactorType, defaultFactorType]);
-  var selectedFactor = useMemo(function () {
-    return factorTypes[factorType];
-  }, [factorType]);
+  var mergedFactorData = useMemo(function () {
+    return Object.entries(FACTOR_TYPE_MAPPING).map(function (_ref2) {
+      var type = _ref2[0],
+        factorTypeData = _ref2[1];
+      var mergedData = customFactorValueComponents ? _extends({}, factorTypeData, customFactorValueComponents[type]) : factorTypeData;
+      return [type, _extends({}, factorTypeData, mergedData)];
+    }).reduce(function (result, _ref3) {
+      var type = _ref3[0],
+        factorTypeData = _ref3[1];
+      // eslint-disable-next-line no-param-reassign
+      result[type] = factorTypeData;
+      return result;
+    }, {});
+  }, [customFactorValueComponents]);
+  var selectedFactorData = useMemo(function () {
+    return mergedFactorData[factorType];
+  }, [mergedFactorData, factorType]);
   return /*#__PURE__*/React.createElement(S.Group, {
     resetMargin: true,
     compact: true,
     withoutTypeSelector: withoutTypeSelector,
     className: "ds-factors ds-factors-" + factorType
-  }, selectedFactor && !withoutTypeSelector && setSelectedFactorType && /*#__PURE__*/React.createElement(FactorTypeSelector, {
+  }, selectedFactorData && !withoutTypeSelector && setSelectedFactorType && /*#__PURE__*/React.createElement(FactorTypeSelector, {
     texts: allTexts.factorTypes,
+    factorTypeMapping: mergedFactorData,
     selectedFactorType: factorType,
     setSelectedFactorType: setSelectedFactorType,
-    selectedFactor: selectedFactor,
+    selectedFactor: selectedFactorData,
     availableFactorTypes: availableFactorTypes,
     unavailableFactorTypes: unavailableFactorTypes,
     readOnly: readOnly
@@ -116,7 +132,7 @@ var Factors = function Factors(_ref) {
     value: value,
     onChangeValue: onChangeValue,
     onParamsClick: onParamsClick,
-    selectedFactor: selectedFactor,
+    selectedFactor: selectedFactorData,
     selectedFactorType: factorType,
     textType: textType,
     parameters: parameters,

package/dist/Factors.types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactText, ReactNode, ElementType } from 'react';
+import type { ReactText, ReactNode, ComponentType } from 'react';
 import type { DateFilter } from '@synerise/ds-date-range-picker/dist/date.types';
 import type { Texts as DateRangeTexts } from '@synerise/ds-date-range-picker/dist/DateRangePicker.types';
 import type { MenuItemProps } from '@synerise/ds-menu';
@@ -49,7 +49,7 @@ export type FactorValueType = string | number | null | Date | undefined | Dynami
 export type SelectedFactorType = {
     name: string;
     icon: ReactNode;
-    input: ElementType;
+    component: ComponentType<FactorValueComponentProps>;
 };
 export type FactorsTexts = {
     dateRangePicker: DateRangeTexts;
@@ -83,6 +83,7 @@ export type FactorsTexts = {
         [k in DefinedFactorTypes]: string;
     };
 };
+export type FactorTypeMapping = Record<DefinedFactorTypes, Partial<SelectedFactorType>>;
 export type FactorsProps = {
     factorKey?: ReactText;
     error?: boolean;
@@ -93,6 +94,7 @@ export type FactorsProps = {
     availableFactorTypes?: FactorType[];
     selectedFactorType: FactorType;
     defaultFactorType: FactorType;
+    customFactorValueComponents?: Partial<FactorTypeMapping>;
     getPopupContainerOverride?: (trigger: HTMLElement | null) => HTMLElement;
     onActivate?: () => void;
     onDeactivate?: () => void;
@@ -126,13 +128,14 @@ export type FactorsProps = {
     loading?: boolean;
     preventAutoloadData?: boolean;
     withCustomFactor?: ReactNode;
-    inputProps?: Partial<InputProps>;
+    inputProps?: Partial<FactorValueComponentProps>;
     readOnly?: boolean;
     getMenuEntryProps?: (arg?: ParameterValueType) => MenuItemProps;
 };
 export type FactorTypeSelectorProps = Pick<FactorsProps, 'unavailableFactorTypes' | 'availableFactorTypes' | 'selectedFactorType' | 'readOnly'> & {
     setSelectedFactorType: (factor: FactorType) => void;
     selectedFactor: SelectedFactorType;
+    factorTypeMapping: FactorTypeMapping;
     texts: {
         [k in DefinedFactorTypes]: string;
     };
@@ -141,7 +144,7 @@ export type FactorValueProps = Pick<FactorsProps, 'onChangeValue' | 'onParamsCli
     texts: FactorsTexts;
     selectedFactor: SelectedFactorType;
 };
-export type InputProps = Pick<FactorsProps, 'value' | 'parameters' | 'allowClear' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'inputProps' | 'autoResize' | 'readOnly' | 'getMenuEntryProps'> & {
+export type FactorValueComponentProps = Pick<FactorsProps, 'value' | 'parameters' | 'allowClear' | 'autocompleteText' | 'withoutTypeSelector' | 'textType' | 'opened' | 'getPopupContainerOverride' | 'onActivate' | 'onDeactivate' | 'error' | 'inputProps' | 'autoResize' | 'readOnly' | 'getMenuEntryProps'> & {
     texts: FactorsTexts;
     onChange: (value: FactorValueType) => void;
     factorType: FactorType;

package/dist/index.d.ts

@@ -1,3 +1,7 @@
-export { default, factorTypes } from './Factors';
+export { default, FACTOR_TYPE_MAPPING as factorTypes } from './Factors';
 export { ALL_FACTOR_TYPES } from './Factors.types';
-export type { FactorType, DefinedFactorTypes, FactorsProps, FactorsTexts, ParameterValueType, ParameterItem, ParameterGroup, InputProps, FactorValueType, FactorValueProps, DynamicKeyValueType, FormulaValueType, FactorTypeSelectorProps, FormulaModalProps, TextModalProps, ParameterDropdownProps, SelectedFactorType, } from './Factors.types';
+export type { FactorType, DefinedFactorTypes, FactorsProps, FactorsTexts, ParameterValueType, ParameterItem, ParameterGroup, FactorValueComponentProps, 
+/**
+ * @deprecated, use FactorValueComponentProps type instead
+ */
+FactorValueComponentProps as InputProps, FactorValueType, FactorValueProps, DynamicKeyValueType, FormulaValueType, FactorTypeSelectorProps, FormulaModalProps, TextModalProps, ParameterDropdownProps, SelectedFactorType, } from './Factors.types';

package/dist/index.js

@@ -1,2 +1,2 @@
-export { default, factorTypes } from './Factors';
+export { default, FACTOR_TYPE_MAPPING as factorTypes } from './Factors';
 export { ALL_FACTOR_TYPES } from './Factors.types';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-factors",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Factors UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -34,26 +34,26 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-autocomplete": "^1.0.0",
-    "@synerise/ds-badge": "^1.0.0",
-    "@synerise/ds-button": "^1.0.0",
-    "@synerise/ds-date-picker": "^1.0.0",
-    "@synerise/ds-date-range-picker": "^1.0.0",
-    "@synerise/ds-dropdown": "^1.0.0",
-    "@synerise/ds-icon": "^1.0.0",
-    "@synerise/ds-information-card": "^1.0.0",
-    "@synerise/ds-inline-edit": "^1.0.0",
-    "@synerise/ds-input": "^1.0.0",
-    "@synerise/ds-input-number": "^1.0.0",
-    "@synerise/ds-list-item": "^1.0.0",
-    "@synerise/ds-menu": "^1.0.0",
-    "@synerise/ds-modal": "^1.0.0",
-    "@synerise/ds-result": "^1.0.0",
-    "@synerise/ds-scrollbar": "^1.0.0",
-    "@synerise/ds-skeleton": "^1.0.0",
-    "@synerise/ds-tabs": "^1.0.0",
-    "@synerise/ds-tooltip": "^1.0.0",
-    "@synerise/ds-utils": "^1.0.0",
+    "@synerise/ds-autocomplete": "^1.0.2",
+    "@synerise/ds-badge": "^1.0.2",
+    "@synerise/ds-button": "^1.1.1",
+    "@synerise/ds-date-picker": "^1.0.2",
+    "@synerise/ds-date-range-picker": "^1.1.1",
+    "@synerise/ds-dropdown": "^1.0.2",
+    "@synerise/ds-icon": "^1.1.0",
+    "@synerise/ds-information-card": "^1.0.2",
+    "@synerise/ds-inline-edit": "^1.0.2",
+    "@synerise/ds-input": "^1.0.2",
+    "@synerise/ds-input-number": "^1.0.2",
+    "@synerise/ds-list-item": "^1.0.2",
+    "@synerise/ds-menu": "^1.0.2",
+    "@synerise/ds-modal": "^1.0.2",
+    "@synerise/ds-result": "^1.0.2",
+    "@synerise/ds-scrollbar": "^1.0.2",
+    "@synerise/ds-skeleton": "^1.0.2",
+    "@synerise/ds-tabs": "^1.0.2",
+    "@synerise/ds-tooltip": "^1.1.1",
+    "@synerise/ds-utils": "^1.0.1",
     "lodash": "^4.17.21",
     "react-window": "1.8.5",
     "uuid": "^8.3.2"
@@ -65,5 +65,5 @@
     "react-intl": ">=3.12.0 <= 6.8",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "e4c3690238a44b584b9ea41e4aa52b1eec42174b"
+  "gitHead": "47960dcd849dc47c85bd134bcfeb90a5505656a7"
 }