@synerise/ds-factors 1.11.10 → 1.11.12

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.11.12](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.11.11...@synerise/ds-factors@1.11.12) (2026-03-24)
+
+**Note:** Version bump only for package @synerise/ds-factors
+
+## [1.11.11](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.11.10...@synerise/ds-factors@1.11.11) (2026-03-20)
+
+**Note:** Version bump only for package @synerise/ds-factors
+
 ## [1.11.10](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.11.9...@synerise/ds-factors@1.11.10) (2026-03-09)
 
 **Note:** Version bump only for package @synerise/ds-factors

package/README.md

@@ -100,35 +100,48 @@ import Factors from '@synerise/ds-factors'
 
 ## API
 
-| Property                  | Description                                                                               | Type                                               | Default   |
-| ------------------------- | ----------------------------------------------------------------------------------------- | -------------------------------------------------- | --------- |
-| autocompleteText          | Array of available autocomplete suggestions (only if textType is equal to `autocomplete`) | {options: string[]}                                | -         |
-| availableFactorTypes      | Array of available factor types                                                           | FactorType[]                                       | -         |
-| defaultFactorType         | Default factor type                                                                       | FactorType                                         | -         |
-| formulaEditor             | Formula editor render in modal when factory type is equal to `formula`                    | React.ReactNode                                    | -         |
-| getPopupContainerOverride | Popup container function for child tooltips and dropdowns                                 | (trigger: HTMLElement \ null) => HTMLElement;      | -         |
-| onActivate                | Callback called when user opens dropdown                                                  | (fieldType: string) => void                        | -         |
-| onChangeValue             | Callback called when user change value                                                    | (value: FactorValueType) => void                   | -         |
-| onDeactivate              | Callback called when user closes dropdown                                                 | () => void                                         | -         |
-| opened                    | Whether if dropdown should opens from outside of component                                | boolean                                            | false     |
-| parameters                | Options for parameters list                                                               | ParameterOptions                                   | -         |
-| selectedFactorType        | Selected factor type                                                                      | FactorType                                         | -         |
-| setSelectedFactorType     | Callback called when user selects factor type                                             | (factor: FactorType) => void                       | -         |
-| texts                     | Translations object                                                                       | FactorsTexts                                       | -         |
-| textType                  | Variant of text type input (`autocomplete` \ `expansible` \ `default` )                   | string                                             | `default` |
-| unavailableFactorTypes    | Array of excluded factor types                                                            | FactorType[]                                       | -         |
-| value                     | Value                                                                                     | FactorValueType                                    | -         |
-| withoutTypeSelector       | Whether if hide factor type selector                                                      | boolean                                            | -         |
-| inputProps                | text input additional props (for text factor type)                                        | InputProps                                         | -         |
-| arrayProps                | options for array factor type                                                             | { itemType?: 'string' / 'number', limit?: number } | -         |
+| Property                  | Description                                                                               | Type                                                                             | Default   |
+| ------------------------- | ----------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------- | --------- |
+| selectedFactorType        | Selected factor type                                                                      | FactorType                                                                       | -         |
+| onChangeValue             | Callback called when user changes value                                                   | (value: FactorValueType) => void                                                 | -         |
+| value                     | Value                                                                                     | FactorValueType                                                                  | -         |
+| defaultFactorType         | Default factor type (fallback when selectedFactorType is unrecognised)                    | FactorType                                                                       | `'text'`  |
+| setSelectedFactorType     | Callback called when user selects factor type                                             | (factor: FactorType) => void                                                     | -         |
+| textType                  | Variant of text type input                                                                | `'autocomplete'` / `'expansible'` / `'default'`                                  | `default` |
+| allowClear                | Shows clear button on inputs that support it                                              | boolean                                                                          | true      |
+| withoutTypeSelector       | Whether to hide factor type selector                                                      | boolean                                                                          | false     |
+| uncontrolledComponent     | Sub-components manage their own open/close state                                          | boolean                                                                          | false     |
+| error                     | Shows error styling on the input                                                          | boolean                                                                          | -         |
+| errorText                 | Error message text                                                                        | ReactNode                                                                        | -         |
+| unavailableFactorTypes    | Array of excluded factor types                                                            | FactorType[]                                                                     | -         |
+| availableFactorTypes      | Array of available factor types (allowlist)                                               | FactorType[]                                                                     | -         |
+| customFactorValueComponents | Override component, name, or icon for any built-in factor type                          | Partial<FactorTypeMapping>                                                       | -         |
+| factorValueExtraProps     | Pass extra icon/tooltip props to text or dynamicKey inputs                                | Partial<ExtraPropsMapping>                                                       | -         |
+| autocompleteText          | Autocomplete suggestions (only when textType is `autocomplete`)                           | { options: string[] }                                                            | -         |
+| formulaEditor             | Content rendered inside the formula editor modal                                          | React.ReactNode                                                                  | -         |
+| getPopupContainerOverride | Popup container function for child tooltips and dropdowns                                 | (trigger: HTMLElement / null) => HTMLElement                                     | -         |
+| onActivate                | Callback called when user opens dropdown                                                  | () => void                                                                       | -         |
+| onDeactivate              | Callback called when user closes dropdown                                                 | () => void                                                                       | -         |
+| opened                    | Externally controls whether the dropdown/modal is open                                    | boolean                                                                          | -         |
+| loading                   | Shows loading state in the input                                                          | boolean                                                                          | -         |
+| preventAutoloadData       | Prevents auto-fetching data in parameter input                                            | boolean                                                                          | -         |
+| parameters                | Options for parameters list                                                               | ParameterOptions                                                                 | -         |
+| onParamsClick             | Called when the parameter button is clicked                                               | () => void                                                                       | -         |
+| arrayProps                | Options for array factor type                                                             | { itemType?: 'string' / 'number'; limit?: number; collectorSuggestions?: CollectorValue[] } | - |
+| relativeDateProps         | Customise relative date display and available units                                       | { triggerValueFormatter?: (value) => string; availableUnits?: RelativeDateUnit[] } | -       |
+| autoResize                | Auto-resize behaviour for text inputs                                                     | AutoResizeProp                                                                   | -         |
+| inputProps                | Extra props forwarded to text inputs                                                      | Partial<InputProps>                                                              | -         |
+| readOnly                  | Disables all interaction                                                                  | boolean                                                                          | -         |
+| factorKey                 | Unique key for the factor instance; used to reset state on remount                        | ReactText                                                                        | -         |
+| texts                     | Translations object (deep partial — any subset can be overridden)                         | DeepPartial<FactorsTexts>                                                        | -         |
 
 ### FactorType
 
-All available factor types: `text`, `number`, `parameter`, `contextParameter`, `dynamicKey`, `formula`, `array`, `date`, `relativeDate`,
+All available factor types: `text`, `number`, `parameter`, `contextParameter`, `dynamicKey`, `formula`, `array`, `date`, `relativeDate`, `dateRange`
 
 ### FactorValueType
 
-Type of value depends on current factor type and can contain values: `string` \ `number` \ `Array<string | numer>` \ `Date` \ `undefined` \ `DynamicKeyValueType` \ `FormulaValueType` \ `ParameterValueType`;
+Type of value depends on current factor type and can contain values: `string` / `number` / `Array<string | number>` / `Date` / `undefined` / `DynamicKeyValueType` / `FormulaValueType` / `ParameterValueType` / `Partial<DateFilter>`
 
 ### DynamicKeyValueType
 
@@ -140,15 +153,18 @@ Type of value depends on current factor type and can contain values: `string` \
 
 ### ParameterValueType
 
-`{ type: string; icon: string; name: string; id: React.ReactText; }`
+`{ type: string; icon: ReactNode; name: string; id: React.ReactText; groupId?: React.ReactText; description?: string; value?: React.ReactText | null }`
 
 ### ParameterOptions
 
 | Property                | Description                                                | Type                     | Default |
 | ----------------------- | ---------------------------------------------------------- | ------------------------ | ------- |
 | buttonIcon              | Icon in button                                             | React.ReactNode          | -       |
-| buttonLabel             | Label of button                                            | string \ React.ReactNode | -       |
-| groups                  | Array of parameter groups                                  | ParameterGroup[]         | -       |
+| buttonLabel             | Label of button                                            | string / React.ReactNode | -       |
 | items                   | Array of parameters                                        | ParameterItem[]          | -       |
+| groups                  | Array of parameter groups                                  | ParameterGroup[]         | -       |
+| recentItems             | Items shown at top as recently used                        | ParameterItem[]          | -       |
 | selectedButtonColored   | Whether to use green custom color if parameter is selected | boolean                  | -       |
-| maxSearchResultsInGroup | How many search results should be shown per group          | number                   | 4       |
+| renderEmptyGroups       | Show group headers even if group has no items              | boolean                  | -       |
+| dropdownDimensionsConfig | Override dropdown height at different viewport sizes      | { defaultHeight?, lowerHeight?, threshold? } | - |
+| showAllGroup            | **Deprecated**                                             | boolean                  | -       |

package/dist/FactorTypeSelector/FactorTypeSelector.d.ts

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

package/dist/FactorTypeSelector/FactorTypeSelector.js

@@ -1,74 +1,53 @@
-import React, { useMemo } from 'react';
-import { theme } from '@synerise/ds-core';
-import { DropdownMenu } from '@synerise/ds-dropdown';
-import Icon, { CheckS } from '@synerise/ds-icon';
-import Tooltip from '@synerise/ds-tooltip';
-import { getPopupContainer } from '@synerise/ds-utils';
-import { ALL_FACTOR_TYPES } from '../Factors.types';
-import * as S from './FactorTypeSelector.styles';
-var FactorTypeSelector = function FactorTypeSelector(_ref) {
-  var selectedFactorType = _ref.selectedFactorType,
-    setSelectedFactorType = _ref.setSelectedFactorType,
-    unavailableFactorTypes = _ref.unavailableFactorTypes,
-    availableFactorTypes = _ref.availableFactorTypes,
-    factorTypeMapping = _ref.factorTypeMapping,
-    selectedFactor = _ref.selectedFactor,
-    getPopupContainerOverride = _ref.getPopupContainerOverride,
-    texts = _ref.texts,
-    readOnly = _ref.readOnly;
-  var typesListData = useMemo(function () {
-    var list = availableFactorTypes || ALL_FACTOR_TYPES;
-    if (unavailableFactorTypes !== undefined) {
-      list = [].concat(list).filter(function (type) {
-        return unavailableFactorTypes.indexOf(type) < 0;
-      });
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { theme } from "@synerise/ds-core";
+import { DropdownMenu } from "@synerise/ds-dropdown";
+import Icon, { CheckS } from "@synerise/ds-icon";
+import Tooltip from "@synerise/ds-tooltip";
+import { getPopupContainer } from "@synerise/ds-utils";
+import { ALL_FACTOR_TYPES } from "../Factors.types.js";
+import { TriggerButton } from "./FactorTypeSelector.styles.js";
+const FactorTypeSelector = ({
+  selectedFactorType,
+  setSelectedFactorType,
+  unavailableFactorTypes,
+  availableFactorTypes,
+  factorTypeMapping,
+  selectedFactor,
+  getPopupContainerOverride,
+  texts,
+  readOnly
+}) => {
+  const typesListData = useMemo(() => {
+    let list = availableFactorTypes || ALL_FACTOR_TYPES;
+    if (unavailableFactorTypes !== void 0) {
+      list = [...list].filter((type) => unavailableFactorTypes.indexOf(type) < 0);
     }
-    return list.map(function (type) {
-      var typeData = factorTypeMapping[type];
+    return list.map((type) => {
+      const typeData = factorTypeMapping[type];
       return {
-        className: 'ds-factor-type',
+        className: "ds-factor-type",
         key: typeData.name,
-        prefixel: /*#__PURE__*/React.createElement(Icon, {
-          component: typeData.icon
-        }),
-        suffixel: type === selectedFactorType ? /*#__PURE__*/React.createElement(Icon, {
-          component: /*#__PURE__*/React.createElement(CheckS, null),
-          color: theme.palette['green-600']
-        }) : '',
-        onClick: function onClick() {
+        prefixel: /* @__PURE__ */ jsx(Icon, { component: typeData.icon }),
+        suffixel: type === selectedFactorType ? /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(CheckS, {}), color: theme.palette["green-600"] }) : "",
+        onClick: () => {
           setSelectedFactorType(type);
         },
         text: texts[type]
       };
     });
   }, [availableFactorTypes, unavailableFactorTypes, factorTypeMapping, selectedFactorType, texts, setSelectedFactorType]);
-  var trigger = /*#__PURE__*/React.createElement(S.TriggerButton, {
-    mode: "single-icon",
-    className: "ds-factors-type-selector",
-    "data-testid": "ds-factors-type-selector",
-    readOnly: readOnly
-  }, /*#__PURE__*/React.createElement(Icon, {
-    component: selectedFactor.icon
-  }));
+  const trigger = /* @__PURE__ */ jsx(TriggerButton, { mode: "single-icon", className: "ds-factors-type-selector", "data-testid": "ds-factors-type-selector", readOnly, children: /* @__PURE__ */ jsx(Icon, { component: selectedFactor.icon }) });
   if (readOnly) {
     return trigger;
   }
   return (
-    /*#__PURE__*/
     // @ts-expect-error selectedFactorType can be any string - requires type refactor in analytics-core
-    React.createElement(Tooltip, {
-      title: texts[selectedFactorType],
-      trigger: ['hover']
-    }, /*#__PURE__*/React.createElement(DropdownMenu, {
-      dataSource: typesListData,
-      trigger: ['click'],
-      disabled: readOnly,
-      getPopupContainer: getPopupContainerOverride || getPopupContainer,
-      popoverProps: {
-        testId: 'factors-types'
-      },
-      asChild: true
-    }, trigger))
+    /* @__PURE__ */ jsx(Tooltip, { title: texts[selectedFactorType], trigger: ["hover"], children: /* @__PURE__ */ jsx(DropdownMenu, { dataSource: typesListData, trigger: ["click"], disabled: readOnly, getPopupContainer: getPopupContainerOverride || getPopupContainer, popoverProps: {
+      testId: "factors-types"
+    }, asChild: true, children: trigger }) })
   );
 };
-export default FactorTypeSelector;
+export {
+  FactorTypeSelector as default
+};

package/dist/FactorTypeSelector/FactorTypeSelector.styles.d.ts

@@ -1,29 +1,29 @@
-export declare const FactorTypeList: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TriggerButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<Partial<{
+export declare const FactorTypeList: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TriggerButton: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<Omit<Partial<{
     href: string;
     target?: string;
     onClick?: React.MouseEventHandler<HTMLElement>;
-} & import("antd/lib/button/button").BaseButtonProps & Omit<import("react").AnchorHTMLAttributes<any>, "onClick" | "type"> & {
-    htmlType?: import("antd/lib/button/button").ButtonHTMLType;
+} & import('antd/lib/button/button').BaseButtonProps & Omit<import('react').AnchorHTMLAttributes<any>, "onClick" | "type"> & {
+    htmlType?: import('antd/lib/button/button').ButtonHTMLType;
     onClick?: React.MouseEventHandler<HTMLElement>;
-} & Omit<import("react").ButtonHTMLAttributes<any>, "onClick" | "type">>, "type" | "ghost"> & {
-    type?: import("@synerise/ds-utils").LiteralStringUnion<import("@synerise/ds-button/dist/Button.types").ButtonType>;
-    mode?: import("@synerise/ds-utils").LiteralStringUnion<"single-icon" | "split" | "two-icons" | "label-icon" | "icon-label">;
-    color?: import("@synerise/ds-utils").LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
-    groupVariant?: import("@synerise/ds-utils").LiteralStringUnion<"left-rounded" | "squared" | "right-rounded">;
+} & Omit<import('react').ButtonHTMLAttributes<any>, "onClick" | "type">>, "type" | "ghost"> & {
+    type?: import('@synerise/ds-utils').LiteralStringUnion<import('@synerise/ds-button/dist/Button.types').ButtonType>;
+    mode?: import('@synerise/ds-utils').LiteralStringUnion<"single-icon" | "split" | "two-icons" | "label-icon" | "icon-label">;
+    color?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
+    groupVariant?: import('@synerise/ds-utils').LiteralStringUnion<"left-rounded" | "squared" | "right-rounded">;
     justifyContent?: string;
     loading?: boolean | {
         delay?: number;
     };
-    onClick?: (event: import("react").MouseEvent<HTMLElement>) => void;
-    iconColor?: import("@synerise/ds-utils").LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
+    onClick?: (event: import('react').MouseEvent<HTMLElement>) => void;
+    iconColor?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
     error?: boolean;
     readOnly?: boolean;
-    tagProps?: import("@synerise/ds-tag").TagProps;
-    tooltipProps?: import("@synerise/ds-tooltip").TooltipProps;
-} & import("react").RefAttributes<HTMLButtonElement>> & {
-    Creator: import("react").ForwardRefExoticComponent<Omit<import("@synerise/ds-button").CreatorProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    Expander: ({ size, expanded, disabled, onClick, className, }: import("@synerise/ds-button").ExpanderProps) => import("react").JSX.Element;
-    Star: (props: import("@synerise/ds-button").StarButtonProps) => React.ReactElement;
-    Checkbox: (props: import("@synerise/ds-button").CheckboxButtonProps) => React.ReactElement;
+    tagProps?: import('@synerise/ds-tag').TagProps;
+    tooltipProps?: import('@synerise/ds-tooltip').TooltipProps;
+} & import('react').RefAttributes<HTMLButtonElement>> & {
+    Creator: import('react').ForwardRefExoticComponent<Omit<import('@synerise/ds-button').CreatorProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+    Expander: ({ size, expanded, disabled, onClick, className, }: import('@synerise/ds-button').ExpanderProps) => import("react").JSX.Element;
+    Star: (props: import('@synerise/ds-button').StarButtonProps) => React.ReactElement;
+    Checkbox: (props: import('@synerise/ds-button').CheckboxButtonProps) => React.ReactElement;
 }, any, {}, never>;

package/dist/FactorTypeSelector/FactorTypeSelector.styles.js

@@ -1,14 +1,14 @@
-import styled from 'styled-components';
-import Button from '@synerise/ds-button';
-export var FactorTypeList = styled.div.withConfig({
+import styled from "styled-components";
+import Button from "@synerise/ds-button";
+const FactorTypeList = /* @__PURE__ */ styled.div.withConfig({
   displayName: "FactorTypeSelectorstyles__FactorTypeList",
   componentId: "sc-15cv997-0"
-})(["padding:8px;background:", ";"], function (props) {
-  return props.theme.palette.white;
-});
-export var TriggerButton = styled(Button).withConfig({
+})(["padding:8px;background:", ";"], (props) => props.theme.palette.white);
+const TriggerButton = /* @__PURE__ */ styled(Button).withConfig({
   displayName: "FactorTypeSelectorstyles__TriggerButton",
   componentId: "sc-15cv997-1"
-})(["&&&{display:inline-flex;border-radius:3px 0 0 3px;min-width:32px;&:focus{.btn-focus{box-shadow:inset 0 0 0 1px ", ";}}}"], function (props) {
-  return props.theme.palette['grey-300'];
-});
+})(["&&&{display:inline-flex;border-radius:3px 0 0 3px;min-width:32px;&:focus{.btn-focus{box-shadow:inset 0 0 0 1px ", ";}}}"], (props) => props.theme.palette["grey-300"]);
+export {
+  FactorTypeList,
+  TriggerButton
+};

package/dist/FactorValue/Array/Array.const.js

@@ -1,3 +1,8 @@
-export var MODAL_VIEWPORT_HEIGHT = 80;
-export var BACKTICK = '```';
-export var COMMA = ',';
+const MODAL_VIEWPORT_HEIGHT = 80;
+const BACKTICK = "```";
+const COMMA = ",";
+export {
+  BACKTICK,
+  COMMA,
+  MODAL_VIEWPORT_HEIGHT
+};

package/dist/FactorValue/Array/Array.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { type ArrayItemType, type FactorValueComponentProps } from '../../Factors.types';
+import { default as React } from 'react';
+import { ArrayItemType, FactorValueComponentProps } from '../../Factors.types';
 export declare const Array: <ItemType extends ArrayItemType>({ value: arrayValue, onChange, texts, onActivate, onDeactivate, readOnly, error, arrayProps, }: FactorValueComponentProps) => React.JSX.Element;

package/dist/FactorValue/Array/Array.js

@@ -1,73 +1,61 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useMemo, useState } from 'react';
-import { useTheme } from '@synerise/ds-core';
-import Icon, { EditS } from '@synerise/ds-icon';
-import { TagShape } from '@synerise/ds-tag';
-import * as S from './Array.styles';
-import { ArrayModal } from './components/ArrayModal';
-export var Array = function Array(_ref) {
-  var arrayValue = _ref.value,
-    onChange = _ref.onChange,
-    texts = _ref.texts,
-    onActivate = _ref.onActivate,
-    onDeactivate = _ref.onDeactivate,
-    _ref$readOnly = _ref.readOnly,
-    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
-    error = _ref.error,
-    _ref$arrayProps = _ref.arrayProps,
-    arrayProps = _ref$arrayProps === void 0 ? {} : _ref$arrayProps;
-  var _useState = useState(false),
-    isVisible = _useState[0],
-    setIsVisible = _useState[1];
-  var handleOnClick = function handleOnClick() {
+import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import { useState, useMemo } from "react";
+import { useTheme } from "@synerise/ds-core";
+import Icon, { EditS } from "@synerise/ds-icon";
+import { TagShape } from "@synerise/ds-tag";
+import { TriggerButton, TriggerButtonLabel } from "./Array.styles.js";
+import { ArrayModal } from "./components/ArrayModal.js";
+const Array = ({
+  value: arrayValue,
+  onChange,
+  texts,
+  onActivate,
+  onDeactivate,
+  readOnly = false,
+  error,
+  arrayProps = {}
+}) => {
+  const [isVisible, setIsVisible] = useState(false);
+  const handleOnClick = () => {
     setIsVisible(true);
     onActivate && onActivate();
   };
-  var buttonLabel = useMemo(function () {
-    if (!(arrayValue != null && arrayValue.length)) {
+  const buttonLabel = useMemo(() => {
+    if (!arrayValue?.length) {
       return texts.array.triggerLabel;
     }
-    return arrayValue.join(', ') + " ";
+    return `${arrayValue.join(", ")} `;
   }, [arrayValue, texts.array.triggerLabel]);
-  var triggerMode = useMemo(function () {
-    return readOnly ? '' : 'label-icon';
+  const triggerMode = useMemo(() => {
+    return readOnly ? "" : "label-icon";
   }, [readOnly]);
-  var handleApply = function handleApply(changedValue) {
+  const handleApply = (changedValue) => {
     setIsVisible(false);
     onChange(changedValue);
   };
-  var handleCancel = function handleCancel() {
+  const handleCancel = () => {
     setIsVisible(false);
     onDeactivate && onDeactivate();
   };
-  var theme = useTheme();
-  var tagProps = {
+  const theme = useTheme();
+  const tagProps = {
     asPill: true,
-    name: "" + arrayValue.length,
-    color: error ? theme.palette['red-600'] : theme.palette['grey-600'],
-    textColor: '#fff',
+    name: `${arrayValue.length}`,
+    color: error ? theme.palette["red-600"] : theme.palette["grey-600"],
+    textColor: "#fff",
     shape: TagShape.DEFAULT_ROUND
   };
-  var tooltipProps = arrayValue != null && arrayValue.length ? {
-    title: /*#__PURE__*/React.createElement(React.Fragment, null, arrayValue.join(', '))
-  } : undefined;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(S.TriggerButton, {
-    error: error,
-    type: "secondary",
-    mode: triggerMode,
-    onClick: handleOnClick,
-    tooltipProps: tooltipProps,
-    "data-testid": "ds-factors-array",
-    tagProps: arrayValue.length ? tagProps : undefined
-  }, /*#__PURE__*/React.createElement(S.TriggerButtonLabel, null, buttonLabel), !readOnly && /*#__PURE__*/React.createElement(Icon, {
-    component: /*#__PURE__*/React.createElement(EditS, null)
-  })), /*#__PURE__*/React.createElement(ArrayModal, _extends({
-    value: arrayValue,
-    onApply: handleApply,
-    onCancel: handleCancel,
-    texts: texts,
-    visible: isVisible,
-    readOnly: readOnly,
-    itemType: "string"
-  }, arrayProps)));
-};
+  const tooltipProps = arrayValue?.length ? {
+    title: /* @__PURE__ */ jsx(Fragment, { children: arrayValue.join(", ") })
+  } : void 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(TriggerButton, { error, type: "secondary", mode: triggerMode, onClick: handleOnClick, tooltipProps, "data-testid": "ds-factors-array", tagProps: arrayValue.length ? tagProps : void 0, children: [
+      /* @__PURE__ */ jsx(TriggerButtonLabel, { children: buttonLabel }),
+      !readOnly && /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(EditS, {}) })
+    ] }),
+    /* @__PURE__ */ jsx(ArrayModal, { value: arrayValue, onApply: handleApply, onCancel: handleCancel, texts, visible: isVisible, readOnly, itemType: "string", ...arrayProps })
+  ] });
+};
+export {
+  Array
+};

package/dist/FactorValue/Array/Array.styles.d.ts

@@ -1,53 +1,53 @@
-export declare const TextArea: import("styled-components").StyledComponent<"textarea", any, {}, never>;
-export declare const Modal: import("styled-components").StyledComponent<{
-    (props: import("@synerise/ds-modal").ModalProps): React.JSX.Element;
-    info: import("antd/lib/modal/confirm").ModalFunc;
-    success: import("antd/lib/modal/confirm").ModalFunc;
-    error: import("antd/lib/modal/confirm").ModalFunc;
-    warning: import("antd/lib/modal/confirm").ModalFunc;
-    confirm: import("antd/lib/modal/confirm").ModalFunc;
+export declare const TextArea: import('styled-components').StyledComponent<"textarea", any, {}, never>;
+export declare const Modal: import('styled-components').StyledComponent<{
+    (props: import('@synerise/ds-modal').ModalProps): React.JSX.Element;
+    info: import('antd/lib/modal/confirm').ModalFunc;
+    success: import('antd/lib/modal/confirm').ModalFunc;
+    error: import('antd/lib/modal/confirm').ModalFunc;
+    warning: import('antd/lib/modal/confirm').ModalFunc;
+    confirm: import('antd/lib/modal/confirm').ModalFunc;
 }, any, {
     viewportHeight: number;
 }, never>;
-export declare const EmptyState: import("styled-components").StyledComponent<({ size, label, text, button, fontSize, customIcon, className, mode, iconPosition, textAlign, }: import("@synerise/ds-empty-states").EmptyStatesProps) => React.JSX.Element, any, {}, never>;
-export declare const TriggerButtonLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TriggerButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<Partial<{
+export declare const EmptyState: import('styled-components').StyledComponent<({ size, label, text, button, fontSize, customIcon, className, mode, iconPosition, textAlign, }: import('@synerise/ds-empty-states').EmptyStatesProps) => React.JSX.Element, any, {}, never>;
+export declare const TriggerButtonLabel: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const TriggerButton: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<Omit<Partial<{
     href: string;
     target?: string;
     onClick?: React.MouseEventHandler<HTMLElement>;
-} & import("antd/lib/button/button").BaseButtonProps & Omit<import("react").AnchorHTMLAttributes<any>, "onClick" | "type"> & {
-    htmlType?: import("antd/lib/button/button").ButtonHTMLType;
+} & import('antd/lib/button/button').BaseButtonProps & Omit<import('react').AnchorHTMLAttributes<any>, "onClick" | "type"> & {
+    htmlType?: import('antd/lib/button/button').ButtonHTMLType;
     onClick?: React.MouseEventHandler<HTMLElement>;
-} & Omit<import("react").ButtonHTMLAttributes<any>, "onClick" | "type">>, "type" | "ghost"> & {
-    type?: import("@synerise/ds-utils").LiteralStringUnion<import("@synerise/ds-button/dist/Button.types").ButtonType>;
-    mode?: import("@synerise/ds-utils").LiteralStringUnion<"single-icon" | "split" | "two-icons" | "label-icon" | "icon-label">;
-    color?: import("@synerise/ds-utils").LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
-    groupVariant?: import("@synerise/ds-utils").LiteralStringUnion<"left-rounded" | "squared" | "right-rounded">;
+} & Omit<import('react').ButtonHTMLAttributes<any>, "onClick" | "type">>, "type" | "ghost"> & {
+    type?: import('@synerise/ds-utils').LiteralStringUnion<import('@synerise/ds-button/dist/Button.types').ButtonType>;
+    mode?: import('@synerise/ds-utils').LiteralStringUnion<"single-icon" | "split" | "two-icons" | "label-icon" | "icon-label">;
+    color?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
+    groupVariant?: import('@synerise/ds-utils').LiteralStringUnion<"left-rounded" | "squared" | "right-rounded">;
     justifyContent?: string;
     loading?: boolean | {
         delay?: number;
     };
-    onClick?: (event: import("react").MouseEvent<HTMLElement>) => void;
-    iconColor?: import("@synerise/ds-utils").LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
+    onClick?: (event: import('react').MouseEvent<HTMLElement>) => void;
+    iconColor?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
     error?: boolean;
     readOnly?: boolean;
-    tagProps?: import("@synerise/ds-tag").TagProps;
-    tooltipProps?: import("@synerise/ds-tooltip").TooltipProps;
-} & import("react").RefAttributes<HTMLButtonElement>> & {
-    Creator: import("react").ForwardRefExoticComponent<Omit<import("@synerise/ds-button").CreatorProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    Expander: ({ size, expanded, disabled, onClick, className, }: import("@synerise/ds-button").ExpanderProps) => import("react").JSX.Element;
-    Star: (props: import("@synerise/ds-button").StarButtonProps) => React.ReactElement;
-    Checkbox: (props: import("@synerise/ds-button").CheckboxButtonProps) => React.ReactElement;
+    tagProps?: import('@synerise/ds-tag').TagProps;
+    tooltipProps?: import('@synerise/ds-tooltip').TooltipProps;
+} & import('react').RefAttributes<HTMLButtonElement>> & {
+    Creator: import('react').ForwardRefExoticComponent<Omit<import('@synerise/ds-button').CreatorProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+    Expander: ({ size, expanded, disabled, onClick, className, }: import('@synerise/ds-button').ExpanderProps) => import("react").JSX.Element;
+    Star: (props: import('@synerise/ds-button').StarButtonProps) => React.ReactElement;
+    Checkbox: (props: import('@synerise/ds-button').CheckboxButtonProps) => React.ReactElement;
 }, any, {}, never>;
-export declare const ModalFooterLeftSide: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ModalSubHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ModalContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Limit: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const LimitPart: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SearchWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RightSide: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const LeftSide: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CreatorItemsList: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const DeleteIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@synerise/ds-icon").BaseIconProps & Omit<import("react").HTMLAttributes<HTMLDivElement>, keyof import("@synerise/ds-icon").BaseIconProps> & import("@synerise/ds-utils").DataAttributes & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
-export declare const CollectorWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CreatorRow: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ModalFooterLeftSide: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ModalSubHeader: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ModalContentWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const Limit: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const LimitPart: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const SearchWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const RightSide: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const LeftSide: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const CreatorItemsList: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const DeleteIcon: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<import('@synerise/ds-icon').BaseIconProps & Omit<import('react').HTMLAttributes<HTMLDivElement>, keyof import('@synerise/ds-icon').BaseIconProps> & import('@synerise/ds-utils').DataAttributes & import('react').RefAttributes<HTMLDivElement>>, any, {}, never>;
+export declare const CollectorWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const CreatorRow: import('styled-components').StyledComponent<"div", any, {}, never>;