@synerise/ds-factors 1.11.11 → 1.11.12
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 +4 -0
- package/dist/FactorTypeSelector/FactorTypeSelector.d.ts +2 -2
- package/dist/FactorTypeSelector/FactorTypeSelector.js +37 -58
- package/dist/FactorTypeSelector/FactorTypeSelector.styles.d.ts +18 -18
- package/dist/FactorTypeSelector/FactorTypeSelector.styles.js +10 -10
- package/dist/FactorValue/Array/Array.const.js +8 -3
- package/dist/FactorValue/Array/Array.d.ts +2 -2
- package/dist/FactorValue/Array/Array.js +45 -57
- package/dist/FactorValue/Array/Array.styles.d.ts +39 -39
- package/dist/FactorValue/Array/Array.styles.js +44 -33
- package/dist/FactorValue/Array/Array.types.d.ts +3 -3
- package/dist/FactorValue/Array/Array.types.js +1 -1
- package/dist/FactorValue/Array/Array.utils.d.ts +2 -2
- package/dist/FactorValue/Array/Array.utils.js +21 -18
- package/dist/FactorValue/Array/components/ArrayCollector.d.ts +2 -2
- package/dist/FactorValue/Array/components/ArrayCollector.js +70 -94
- package/dist/FactorValue/Array/components/ArrayCreator.d.ts +2 -2
- package/dist/FactorValue/Array/components/ArrayCreator.js +43 -75
- package/dist/FactorValue/Array/components/ArrayLimit.d.ts +2 -2
- package/dist/FactorValue/Array/components/ArrayLimit.js +16 -14
- package/dist/FactorValue/Array/components/ArrayModal.d.ts +2 -2
- package/dist/FactorValue/Array/components/ArrayModal.js +78 -143
- package/dist/FactorValue/Array/components/ArrayRaw.d.ts +2 -2
- package/dist/FactorValue/Array/components/ArrayRaw.js +47 -58
- package/dist/FactorValue/Array/components/CopyButton.d.ts +2 -2
- package/dist/FactorValue/Array/components/CopyButton.js +20 -30
- package/dist/FactorValue/Array/hooks/useCollector.d.ts +3 -3
- package/dist/FactorValue/Array/hooks/useCollector.js +21 -22
- package/dist/FactorValue/Date/Date.d.ts +2 -2
- package/dist/FactorValue/Date/Date.js +38 -53
- package/dist/FactorValue/DateRange/DateRange.d.ts +2 -2
- package/dist/FactorValue/DateRange/DateRange.js +26 -41
- package/dist/FactorValue/DynamicKey/DynamicKey.d.ts +2 -2
- package/dist/FactorValue/DynamicKey/DynamicKey.js +37 -66
- package/dist/FactorValue/DynamicKey/DynamicKey.style.d.ts +2 -2
- package/dist/FactorValue/DynamicKey/DynamicKey.style.js +10 -8
- package/dist/FactorValue/FactorValue.d.ts +2 -2
- package/dist/FactorValue/FactorValue.js +68 -70
- package/dist/FactorValue/FactorValue.style.d.ts +1 -1
- package/dist/FactorValue/FactorValue.style.js +20 -20
- package/dist/FactorValue/Formula/Formula.d.ts +2 -2
- package/dist/FactorValue/Formula/Formula.js +36 -54
- package/dist/FactorValue/Formula/Formula.styles.d.ts +1 -1
- package/dist/FactorValue/Formula/Formula.styles.js +6 -5
- package/dist/FactorValue/Formula/FormulaModal.d.ts +2 -2
- package/dist/FactorValue/Formula/FormulaModal.js +27 -42
- package/dist/FactorValue/Number/NumberInput.d.ts +2 -2
- package/dist/FactorValue/Number/NumberInput.js +21 -31
- package/dist/FactorValue/Parameter/Parameter.constants.d.ts +1 -1
- package/dist/FactorValue/Parameter/Parameter.constants.js +27 -13
- package/dist/FactorValue/Parameter/Parameter.d.ts +2 -2
- package/dist/FactorValue/Parameter/Parameter.js +82 -127
- package/dist/FactorValue/Parameter/Parameter.style.d.ts +28 -28
- package/dist/FactorValue/Parameter/Parameter.style.js +34 -31
- package/dist/FactorValue/Parameter/Parameter.types.d.ts +2 -2
- package/dist/FactorValue/Parameter/Parameter.types.js +1 -1
- package/dist/FactorValue/Parameter/ParameterDropdown.d.ts +2 -2
- package/dist/FactorValue/Parameter/ParameterDropdown.js +155 -226
- package/dist/FactorValue/Parameter/ParameterDropdownItem.d.ts +3 -3
- package/dist/FactorValue/Parameter/ParameterDropdownItem.js +27 -33
- package/dist/FactorValue/Parameter/useGroups.d.ts +2 -2
- package/dist/FactorValue/Parameter/useGroups.js +30 -42
- package/dist/FactorValue/Parameter/utils.d.ts +2 -2
- package/dist/FactorValue/Parameter/utils.js +22 -17
- package/dist/FactorValue/RelativeDate/RelativeDate.const.d.ts +1 -1
- package/dist/FactorValue/RelativeDate/RelativeDate.const.js +12 -5
- package/dist/FactorValue/RelativeDate/RelativeDate.d.ts +2 -2
- package/dist/FactorValue/RelativeDate/RelativeDate.js +57 -88
- package/dist/FactorValue/RelativeDate/RelativeDate.utils.d.ts +1 -1
- package/dist/FactorValue/RelativeDate/RelativeDate.utils.js +14 -10
- package/dist/FactorValue/RelativeDate/RelativeDateDropdown.d.ts +2 -2
- package/dist/FactorValue/RelativeDate/RelativeDateDropdown.js +56 -87
- package/dist/FactorValue/RelativeDate/RelativeDateDropdown.styles.d.ts +7 -7
- package/dist/FactorValue/RelativeDate/RelativeDateDropdown.styles.js +23 -20
- package/dist/FactorValue/Text/Text.d.ts +2 -2
- package/dist/FactorValue/Text/Text.js +56 -121
- package/dist/FactorValue/Text/Text.styles.d.ts +3 -3
- package/dist/FactorValue/Text/Text.styles.js +11 -10
- package/dist/FactorValue/Text/TextModal.d.ts +2 -2
- package/dist/FactorValue/Text/TextModal.js +19 -33
- package/dist/Factors.d.ts +2 -2
- package/dist/Factors.js +95 -132
- package/dist/Factors.types.d.ts +9 -9
- package/dist/Factors.types.js +8 -3
- package/dist/hooks/useTexts.d.ts +2 -2
- package/dist/hooks/useTexts.js +287 -291
- package/dist/index.js +7 -6
- package/dist/modules.d.js +1 -1
- package/dist/modules.d.ts +0 -0
- package/dist/style/Factors.style.d.ts +1 -1
- package/dist/style/Factors.style.js +10 -11
- package/package.json +32 -32
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,10 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [1.11.12](https://github.com/Synerise/synerise-design/compare/@synerise/ds-factors@1.11.11...@synerise/ds-factors@1.11.12) (2026-03-24)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @synerise/ds-factors
|
|
9
|
+
|
|
6
10
|
## [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)
|
|
7
11
|
|
|
8
12
|
**Note:** Version bump only for package @synerise/ds-factors
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import {
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { FactorTypeSelectorProps } from '../Factors.types';
|
|
3
3
|
declare const FactorTypeSelector: ({ selectedFactorType, setSelectedFactorType, unavailableFactorTypes, availableFactorTypes, factorTypeMapping, selectedFactor, getPopupContainerOverride, texts, readOnly, }: FactorTypeSelectorProps) => React.JSX.Element;
|
|
4
4
|
export default FactorTypeSelector;
|
|
@@ -1,74 +1,53 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useMemo } from "react";
|
|
3
|
+
import { theme } from "@synerise/ds-core";
|
|
4
|
+
import { DropdownMenu } from "@synerise/ds-dropdown";
|
|
5
|
+
import Icon, { CheckS } from "@synerise/ds-icon";
|
|
6
|
+
import Tooltip from "@synerise/ds-tooltip";
|
|
7
|
+
import { getPopupContainer } from "@synerise/ds-utils";
|
|
8
|
+
import { ALL_FACTOR_TYPES } from "../Factors.types.js";
|
|
9
|
+
import { TriggerButton } from "./FactorTypeSelector.styles.js";
|
|
10
|
+
const FactorTypeSelector = ({
|
|
11
|
+
selectedFactorType,
|
|
12
|
+
setSelectedFactorType,
|
|
13
|
+
unavailableFactorTypes,
|
|
14
|
+
availableFactorTypes,
|
|
15
|
+
factorTypeMapping,
|
|
16
|
+
selectedFactor,
|
|
17
|
+
getPopupContainerOverride,
|
|
18
|
+
texts,
|
|
19
|
+
readOnly
|
|
20
|
+
}) => {
|
|
21
|
+
const typesListData = useMemo(() => {
|
|
22
|
+
let list = availableFactorTypes || ALL_FACTOR_TYPES;
|
|
23
|
+
if (unavailableFactorTypes !== void 0) {
|
|
24
|
+
list = [...list].filter((type) => unavailableFactorTypes.indexOf(type) < 0);
|
|
25
25
|
}
|
|
26
|
-
return list.map(
|
|
27
|
-
|
|
26
|
+
return list.map((type) => {
|
|
27
|
+
const typeData = factorTypeMapping[type];
|
|
28
28
|
return {
|
|
29
|
-
className:
|
|
29
|
+
className: "ds-factor-type",
|
|
30
30
|
key: typeData.name,
|
|
31
|
-
prefixel:
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
suffixel: type === selectedFactorType ? /*#__PURE__*/React.createElement(Icon, {
|
|
35
|
-
component: /*#__PURE__*/React.createElement(CheckS, null),
|
|
36
|
-
color: theme.palette['green-600']
|
|
37
|
-
}) : '',
|
|
38
|
-
onClick: function onClick() {
|
|
31
|
+
prefixel: /* @__PURE__ */ jsx(Icon, { component: typeData.icon }),
|
|
32
|
+
suffixel: type === selectedFactorType ? /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(CheckS, {}), color: theme.palette["green-600"] }) : "",
|
|
33
|
+
onClick: () => {
|
|
39
34
|
setSelectedFactorType(type);
|
|
40
35
|
},
|
|
41
36
|
text: texts[type]
|
|
42
37
|
};
|
|
43
38
|
});
|
|
44
39
|
}, [availableFactorTypes, unavailableFactorTypes, factorTypeMapping, selectedFactorType, texts, setSelectedFactorType]);
|
|
45
|
-
|
|
46
|
-
mode: "single-icon",
|
|
47
|
-
className: "ds-factors-type-selector",
|
|
48
|
-
"data-testid": "ds-factors-type-selector",
|
|
49
|
-
readOnly: readOnly
|
|
50
|
-
}, /*#__PURE__*/React.createElement(Icon, {
|
|
51
|
-
component: selectedFactor.icon
|
|
52
|
-
}));
|
|
40
|
+
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 }) });
|
|
53
41
|
if (readOnly) {
|
|
54
42
|
return trigger;
|
|
55
43
|
}
|
|
56
44
|
return (
|
|
57
|
-
/*#__PURE__*/
|
|
58
45
|
// @ts-expect-error selectedFactorType can be any string - requires type refactor in analytics-core
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
}, /*#__PURE__*/React.createElement(DropdownMenu, {
|
|
63
|
-
dataSource: typesListData,
|
|
64
|
-
trigger: ['click'],
|
|
65
|
-
disabled: readOnly,
|
|
66
|
-
getPopupContainer: getPopupContainerOverride || getPopupContainer,
|
|
67
|
-
popoverProps: {
|
|
68
|
-
testId: 'factors-types'
|
|
69
|
-
},
|
|
70
|
-
asChild: true
|
|
71
|
-
}, trigger))
|
|
46
|
+
/* @__PURE__ */ jsx(Tooltip, { title: texts[selectedFactorType], trigger: ["hover"], children: /* @__PURE__ */ jsx(DropdownMenu, { dataSource: typesListData, trigger: ["click"], disabled: readOnly, getPopupContainer: getPopupContainerOverride || getPopupContainer, popoverProps: {
|
|
47
|
+
testId: "factors-types"
|
|
48
|
+
}, asChild: true, children: trigger }) })
|
|
72
49
|
);
|
|
73
50
|
};
|
|
74
|
-
export
|
|
51
|
+
export {
|
|
52
|
+
FactorTypeSelector as default
|
|
53
|
+
};
|
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
export declare const FactorTypeList: import(
|
|
2
|
-
export declare const TriggerButton: import(
|
|
1
|
+
export declare const FactorTypeList: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
2
|
+
export declare const TriggerButton: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<Omit<Partial<{
|
|
3
3
|
href: string;
|
|
4
4
|
target?: string;
|
|
5
5
|
onClick?: React.MouseEventHandler<HTMLElement>;
|
|
6
|
-
} & import(
|
|
7
|
-
htmlType?: import(
|
|
6
|
+
} & import('antd/lib/button/button').BaseButtonProps & Omit<import('react').AnchorHTMLAttributes<any>, "onClick" | "type"> & {
|
|
7
|
+
htmlType?: import('antd/lib/button/button').ButtonHTMLType;
|
|
8
8
|
onClick?: React.MouseEventHandler<HTMLElement>;
|
|
9
|
-
} & Omit<import(
|
|
10
|
-
type?: import(
|
|
11
|
-
mode?: import(
|
|
12
|
-
color?: import(
|
|
13
|
-
groupVariant?: import(
|
|
9
|
+
} & Omit<import('react').ButtonHTMLAttributes<any>, "onClick" | "type">>, "type" | "ghost"> & {
|
|
10
|
+
type?: import('@synerise/ds-utils').LiteralStringUnion<import('@synerise/ds-button/dist/Button.types').ButtonType>;
|
|
11
|
+
mode?: import('@synerise/ds-utils').LiteralStringUnion<"single-icon" | "split" | "two-icons" | "label-icon" | "icon-label">;
|
|
12
|
+
color?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
|
|
13
|
+
groupVariant?: import('@synerise/ds-utils').LiteralStringUnion<"left-rounded" | "squared" | "right-rounded">;
|
|
14
14
|
justifyContent?: string;
|
|
15
15
|
loading?: boolean | {
|
|
16
16
|
delay?: number;
|
|
17
17
|
};
|
|
18
|
-
onClick?: (event: import(
|
|
19
|
-
iconColor?: import(
|
|
18
|
+
onClick?: (event: import('react').MouseEvent<HTMLElement>) => void;
|
|
19
|
+
iconColor?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
|
|
20
20
|
error?: boolean;
|
|
21
21
|
readOnly?: boolean;
|
|
22
|
-
tagProps?: import(
|
|
23
|
-
tooltipProps?: import(
|
|
24
|
-
} & import(
|
|
25
|
-
Creator: import(
|
|
26
|
-
Expander: ({ size, expanded, disabled, onClick, className, }: import(
|
|
27
|
-
Star: (props: import(
|
|
28
|
-
Checkbox: (props: import(
|
|
22
|
+
tagProps?: import('@synerise/ds-tag').TagProps;
|
|
23
|
+
tooltipProps?: import('@synerise/ds-tooltip').TooltipProps;
|
|
24
|
+
} & import('react').RefAttributes<HTMLButtonElement>> & {
|
|
25
|
+
Creator: import('react').ForwardRefExoticComponent<Omit<import('@synerise/ds-button').CreatorProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
|
|
26
|
+
Expander: ({ size, expanded, disabled, onClick, className, }: import('@synerise/ds-button').ExpanderProps) => import("react").JSX.Element;
|
|
27
|
+
Star: (props: import('@synerise/ds-button').StarButtonProps) => React.ReactElement;
|
|
28
|
+
Checkbox: (props: import('@synerise/ds-button').CheckboxButtonProps) => React.ReactElement;
|
|
29
29
|
}, any, {}, never>;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
import Button from
|
|
3
|
-
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
import Button from "@synerise/ds-button";
|
|
3
|
+
const FactorTypeList = /* @__PURE__ */ styled.div.withConfig({
|
|
4
4
|
displayName: "FactorTypeSelectorstyles__FactorTypeList",
|
|
5
5
|
componentId: "sc-15cv997-0"
|
|
6
|
-
})(["padding:8px;background:", ";"],
|
|
7
|
-
|
|
8
|
-
});
|
|
9
|
-
export var TriggerButton = styled(Button).withConfig({
|
|
6
|
+
})(["padding:8px;background:", ";"], (props) => props.theme.palette.white);
|
|
7
|
+
const TriggerButton = /* @__PURE__ */ styled(Button).withConfig({
|
|
10
8
|
displayName: "FactorTypeSelectorstyles__TriggerButton",
|
|
11
9
|
componentId: "sc-15cv997-1"
|
|
12
|
-
})(["&&&{display:inline-flex;border-radius:3px 0 0 3px;min-width:32px;&:focus{.btn-focus{box-shadow:inset 0 0 0 1px ", ";}}}"],
|
|
13
|
-
|
|
14
|
-
|
|
10
|
+
})(["&&&{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"]);
|
|
11
|
+
export {
|
|
12
|
+
FactorTypeList,
|
|
13
|
+
TriggerButton
|
|
14
|
+
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import {
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { ArrayItemType, FactorValueComponentProps } from '../../Factors.types';
|
|
3
3
|
export declare const Array: <ItemType extends ArrayItemType>({ value: arrayValue, onChange, texts, onActivate, onDeactivate, readOnly, error, arrayProps, }: FactorValueComponentProps) => React.JSX.Element;
|
|
@@ -1,73 +1,61 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import { useTheme } from
|
|
4
|
-
import Icon, { EditS } from
|
|
5
|
-
import { TagShape } from
|
|
6
|
-
import
|
|
7
|
-
import { ArrayModal } from
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
isVisible = _useState[0],
|
|
21
|
-
setIsVisible = _useState[1];
|
|
22
|
-
var handleOnClick = function handleOnClick() {
|
|
1
|
+
import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState, useMemo } from "react";
|
|
3
|
+
import { useTheme } from "@synerise/ds-core";
|
|
4
|
+
import Icon, { EditS } from "@synerise/ds-icon";
|
|
5
|
+
import { TagShape } from "@synerise/ds-tag";
|
|
6
|
+
import { TriggerButton, TriggerButtonLabel } from "./Array.styles.js";
|
|
7
|
+
import { ArrayModal } from "./components/ArrayModal.js";
|
|
8
|
+
const Array = ({
|
|
9
|
+
value: arrayValue,
|
|
10
|
+
onChange,
|
|
11
|
+
texts,
|
|
12
|
+
onActivate,
|
|
13
|
+
onDeactivate,
|
|
14
|
+
readOnly = false,
|
|
15
|
+
error,
|
|
16
|
+
arrayProps = {}
|
|
17
|
+
}) => {
|
|
18
|
+
const [isVisible, setIsVisible] = useState(false);
|
|
19
|
+
const handleOnClick = () => {
|
|
23
20
|
setIsVisible(true);
|
|
24
21
|
onActivate && onActivate();
|
|
25
22
|
};
|
|
26
|
-
|
|
27
|
-
if (!
|
|
23
|
+
const buttonLabel = useMemo(() => {
|
|
24
|
+
if (!arrayValue?.length) {
|
|
28
25
|
return texts.array.triggerLabel;
|
|
29
26
|
}
|
|
30
|
-
return arrayValue.join(
|
|
27
|
+
return `${arrayValue.join(", ")} `;
|
|
31
28
|
}, [arrayValue, texts.array.triggerLabel]);
|
|
32
|
-
|
|
33
|
-
return readOnly ?
|
|
29
|
+
const triggerMode = useMemo(() => {
|
|
30
|
+
return readOnly ? "" : "label-icon";
|
|
34
31
|
}, [readOnly]);
|
|
35
|
-
|
|
32
|
+
const handleApply = (changedValue) => {
|
|
36
33
|
setIsVisible(false);
|
|
37
34
|
onChange(changedValue);
|
|
38
35
|
};
|
|
39
|
-
|
|
36
|
+
const handleCancel = () => {
|
|
40
37
|
setIsVisible(false);
|
|
41
38
|
onDeactivate && onDeactivate();
|
|
42
39
|
};
|
|
43
|
-
|
|
44
|
-
|
|
40
|
+
const theme = useTheme();
|
|
41
|
+
const tagProps = {
|
|
45
42
|
asPill: true,
|
|
46
|
-
name:
|
|
47
|
-
color: error ? theme.palette[
|
|
48
|
-
textColor:
|
|
43
|
+
name: `${arrayValue.length}`,
|
|
44
|
+
color: error ? theme.palette["red-600"] : theme.palette["grey-600"],
|
|
45
|
+
textColor: "#fff",
|
|
49
46
|
shape: TagShape.DEFAULT_ROUND
|
|
50
47
|
};
|
|
51
|
-
|
|
52
|
-
title:
|
|
53
|
-
} :
|
|
54
|
-
return
|
|
55
|
-
error:
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
value: arrayValue,
|
|
66
|
-
onApply: handleApply,
|
|
67
|
-
onCancel: handleCancel,
|
|
68
|
-
texts: texts,
|
|
69
|
-
visible: isVisible,
|
|
70
|
-
readOnly: readOnly,
|
|
71
|
-
itemType: "string"
|
|
72
|
-
}, arrayProps)));
|
|
73
|
-
};
|
|
48
|
+
const tooltipProps = arrayValue?.length ? {
|
|
49
|
+
title: /* @__PURE__ */ jsx(Fragment, { children: arrayValue.join(", ") })
|
|
50
|
+
} : void 0;
|
|
51
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
52
|
+
/* @__PURE__ */ jsxs(TriggerButton, { error, type: "secondary", mode: triggerMode, onClick: handleOnClick, tooltipProps, "data-testid": "ds-factors-array", tagProps: arrayValue.length ? tagProps : void 0, children: [
|
|
53
|
+
/* @__PURE__ */ jsx(TriggerButtonLabel, { children: buttonLabel }),
|
|
54
|
+
!readOnly && /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(EditS, {}) })
|
|
55
|
+
] }),
|
|
56
|
+
/* @__PURE__ */ jsx(ArrayModal, { value: arrayValue, onApply: handleApply, onCancel: handleCancel, texts, visible: isVisible, readOnly, itemType: "string", ...arrayProps })
|
|
57
|
+
] });
|
|
58
|
+
};
|
|
59
|
+
export {
|
|
60
|
+
Array
|
|
61
|
+
};
|
|
@@ -1,53 +1,53 @@
|
|
|
1
|
-
export declare const TextArea: import(
|
|
2
|
-
export declare const Modal: import(
|
|
3
|
-
(props: import(
|
|
4
|
-
info: import(
|
|
5
|
-
success: import(
|
|
6
|
-
error: import(
|
|
7
|
-
warning: import(
|
|
8
|
-
confirm: import(
|
|
1
|
+
export declare const TextArea: import('styled-components').StyledComponent<"textarea", any, {}, never>;
|
|
2
|
+
export declare const Modal: import('styled-components').StyledComponent<{
|
|
3
|
+
(props: import('@synerise/ds-modal').ModalProps): React.JSX.Element;
|
|
4
|
+
info: import('antd/lib/modal/confirm').ModalFunc;
|
|
5
|
+
success: import('antd/lib/modal/confirm').ModalFunc;
|
|
6
|
+
error: import('antd/lib/modal/confirm').ModalFunc;
|
|
7
|
+
warning: import('antd/lib/modal/confirm').ModalFunc;
|
|
8
|
+
confirm: import('antd/lib/modal/confirm').ModalFunc;
|
|
9
9
|
}, any, {
|
|
10
10
|
viewportHeight: number;
|
|
11
11
|
}, never>;
|
|
12
|
-
export declare const EmptyState: import(
|
|
13
|
-
export declare const TriggerButtonLabel: import(
|
|
14
|
-
export declare const TriggerButton: import(
|
|
12
|
+
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>;
|
|
13
|
+
export declare const TriggerButtonLabel: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
14
|
+
export declare const TriggerButton: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<Omit<Partial<{
|
|
15
15
|
href: string;
|
|
16
16
|
target?: string;
|
|
17
17
|
onClick?: React.MouseEventHandler<HTMLElement>;
|
|
18
|
-
} & import(
|
|
19
|
-
htmlType?: import(
|
|
18
|
+
} & import('antd/lib/button/button').BaseButtonProps & Omit<import('react').AnchorHTMLAttributes<any>, "onClick" | "type"> & {
|
|
19
|
+
htmlType?: import('antd/lib/button/button').ButtonHTMLType;
|
|
20
20
|
onClick?: React.MouseEventHandler<HTMLElement>;
|
|
21
|
-
} & Omit<import(
|
|
22
|
-
type?: import(
|
|
23
|
-
mode?: import(
|
|
24
|
-
color?: import(
|
|
25
|
-
groupVariant?: import(
|
|
21
|
+
} & Omit<import('react').ButtonHTMLAttributes<any>, "onClick" | "type">>, "type" | "ghost"> & {
|
|
22
|
+
type?: import('@synerise/ds-utils').LiteralStringUnion<import('@synerise/ds-button/dist/Button.types').ButtonType>;
|
|
23
|
+
mode?: import('@synerise/ds-utils').LiteralStringUnion<"single-icon" | "split" | "two-icons" | "label-icon" | "icon-label">;
|
|
24
|
+
color?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
|
|
25
|
+
groupVariant?: import('@synerise/ds-utils').LiteralStringUnion<"left-rounded" | "squared" | "right-rounded">;
|
|
26
26
|
justifyContent?: string;
|
|
27
27
|
loading?: boolean | {
|
|
28
28
|
delay?: number;
|
|
29
29
|
};
|
|
30
|
-
onClick?: (event: import(
|
|
31
|
-
iconColor?: import(
|
|
30
|
+
onClick?: (event: import('react').MouseEvent<HTMLElement>) => void;
|
|
31
|
+
iconColor?: import('@synerise/ds-utils').LiteralStringUnion<"blue" | "grey" | "red" | "green" | "yellow" | "pink" | "mars" | "orange" | "fern" | "cyan" | "purple" | "violet">;
|
|
32
32
|
error?: boolean;
|
|
33
33
|
readOnly?: boolean;
|
|
34
|
-
tagProps?: import(
|
|
35
|
-
tooltipProps?: import(
|
|
36
|
-
} & import(
|
|
37
|
-
Creator: import(
|
|
38
|
-
Expander: ({ size, expanded, disabled, onClick, className, }: import(
|
|
39
|
-
Star: (props: import(
|
|
40
|
-
Checkbox: (props: import(
|
|
34
|
+
tagProps?: import('@synerise/ds-tag').TagProps;
|
|
35
|
+
tooltipProps?: import('@synerise/ds-tooltip').TooltipProps;
|
|
36
|
+
} & import('react').RefAttributes<HTMLButtonElement>> & {
|
|
37
|
+
Creator: import('react').ForwardRefExoticComponent<Omit<import('@synerise/ds-button').CreatorProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
|
|
38
|
+
Expander: ({ size, expanded, disabled, onClick, className, }: import('@synerise/ds-button').ExpanderProps) => import("react").JSX.Element;
|
|
39
|
+
Star: (props: import('@synerise/ds-button').StarButtonProps) => React.ReactElement;
|
|
40
|
+
Checkbox: (props: import('@synerise/ds-button').CheckboxButtonProps) => React.ReactElement;
|
|
41
41
|
}, any, {}, never>;
|
|
42
|
-
export declare const ModalFooterLeftSide: import(
|
|
43
|
-
export declare const ModalSubHeader: import(
|
|
44
|
-
export declare const ModalContentWrapper: import(
|
|
45
|
-
export declare const Limit: import(
|
|
46
|
-
export declare const LimitPart: import(
|
|
47
|
-
export declare const SearchWrapper: import(
|
|
48
|
-
export declare const RightSide: import(
|
|
49
|
-
export declare const LeftSide: import(
|
|
50
|
-
export declare const CreatorItemsList: import(
|
|
51
|
-
export declare const DeleteIcon: import(
|
|
52
|
-
export declare const CollectorWrapper: import(
|
|
53
|
-
export declare const CreatorRow: import(
|
|
42
|
+
export declare const ModalFooterLeftSide: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
43
|
+
export declare const ModalSubHeader: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
44
|
+
export declare const ModalContentWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
45
|
+
export declare const Limit: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
46
|
+
export declare const LimitPart: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
47
|
+
export declare const SearchWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
48
|
+
export declare const RightSide: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
49
|
+
export declare const LeftSide: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
50
|
+
export declare const CreatorItemsList: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
51
|
+
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>;
|
|
52
|
+
export declare const CollectorWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
53
|
+
export declare const CreatorRow: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
@@ -1,81 +1,92 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
import Button from
|
|
3
|
-
import EmptyStateBase from
|
|
4
|
-
import Icon from
|
|
5
|
-
import
|
|
6
|
-
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
import Button from "@synerise/ds-button";
|
|
3
|
+
import EmptyStateBase from "@synerise/ds-empty-states";
|
|
4
|
+
import Icon from "@synerise/ds-icon";
|
|
5
|
+
import ModalProxy from "@synerise/ds-modal";
|
|
6
|
+
const TextArea = /* @__PURE__ */ styled.textarea.withConfig({
|
|
7
7
|
displayName: "Arraystyles__TextArea",
|
|
8
8
|
componentId: "sc-9atgo7-0"
|
|
9
9
|
})(["width:100%;padding:8px 12px;"]);
|
|
10
|
-
|
|
10
|
+
const Modal = /* @__PURE__ */ styled(ModalProxy).withConfig({
|
|
11
11
|
displayName: "Arraystyles__Modal",
|
|
12
12
|
componentId: "sc-9atgo7-1"
|
|
13
|
-
})(["&&{top:50px;.ant-modal-content{height:", "vh;}}", "{height:calc(", "vh - 215px);min-height:auto;resize:none;font-family:'IBM Plex Mono Regular',monospace;&,&:focus{border:0;background:transparent;box-shadow:none;}}"],
|
|
14
|
-
|
|
15
|
-
}, TextArea, function (props) {
|
|
16
|
-
return props.viewportHeight;
|
|
17
|
-
});
|
|
18
|
-
export var EmptyState = styled(EmptyStateBase).withConfig({
|
|
13
|
+
})(["&&{top:50px;.ant-modal-content{height:", "vh;}}", "{height:calc(", "vh - 215px);min-height:auto;resize:none;font-family:'IBM Plex Mono Regular',monospace;&,&:focus{border:0;background:transparent;box-shadow:none;}}"], (props) => props.viewportHeight, TextArea, (props) => props.viewportHeight);
|
|
14
|
+
const EmptyState = /* @__PURE__ */ styled(EmptyStateBase).withConfig({
|
|
19
15
|
displayName: "Arraystyles__EmptyState",
|
|
20
16
|
componentId: "sc-9atgo7-2"
|
|
21
17
|
})(["margin:90px auto 120px;"]);
|
|
22
|
-
|
|
18
|
+
const TriggerButtonLabel = /* @__PURE__ */ styled.div.withConfig({
|
|
23
19
|
displayName: "Arraystyles__TriggerButtonLabel",
|
|
24
20
|
componentId: "sc-9atgo7-3"
|
|
25
21
|
})(["min-width:0;text-overflow:ellipsis;overflow:hidden;"]);
|
|
26
|
-
|
|
22
|
+
const TriggerButton = /* @__PURE__ */ styled(Button).withConfig({
|
|
27
23
|
displayName: "Arraystyles__TriggerButton",
|
|
28
24
|
componentId: "sc-9atgo7-4"
|
|
29
25
|
})(["max-width:100%;"]);
|
|
30
|
-
|
|
26
|
+
const ModalFooterLeftSide = /* @__PURE__ */ styled.div.withConfig({
|
|
31
27
|
displayName: "Arraystyles__ModalFooterLeftSide",
|
|
32
28
|
componentId: "sc-9atgo7-5"
|
|
33
29
|
})(["flex:1 1 100%;text-align:left;"]);
|
|
34
|
-
|
|
30
|
+
const ModalSubHeader = /* @__PURE__ */ styled.div.withConfig({
|
|
35
31
|
displayName: "Arraystyles__ModalSubHeader",
|
|
36
32
|
componentId: "sc-9atgo7-6"
|
|
37
33
|
})(["display:flex;justify-content:space-between;"]);
|
|
38
|
-
|
|
34
|
+
const ModalContentWrapper = /* @__PURE__ */ styled.div.withConfig({
|
|
39
35
|
displayName: "Arraystyles__ModalContentWrapper",
|
|
40
36
|
componentId: "sc-9atgo7-7"
|
|
41
37
|
})(["padding:24px;"]);
|
|
42
|
-
|
|
38
|
+
const Limit = /* @__PURE__ */ styled.div.withConfig({
|
|
43
39
|
displayName: "Arraystyles__Limit",
|
|
44
40
|
componentId: "sc-9atgo7-8"
|
|
45
41
|
})(["display:flex;gap:4px;align-items:center;"]);
|
|
46
|
-
|
|
42
|
+
const LimitPart = /* @__PURE__ */ styled.div.withConfig({
|
|
47
43
|
displayName: "Arraystyles__LimitPart",
|
|
48
44
|
componentId: "sc-9atgo7-9"
|
|
49
45
|
})([""]);
|
|
50
|
-
|
|
46
|
+
const SearchWrapper = /* @__PURE__ */ styled.div.withConfig({
|
|
51
47
|
displayName: "Arraystyles__SearchWrapper",
|
|
52
48
|
componentId: "sc-9atgo7-10"
|
|
53
49
|
})(["max-width:200px;min-width:32px;"]);
|
|
54
|
-
|
|
50
|
+
const RightSide = /* @__PURE__ */ styled.div.withConfig({
|
|
55
51
|
displayName: "Arraystyles__RightSide",
|
|
56
52
|
componentId: "sc-9atgo7-11"
|
|
57
53
|
})(["flex:1 1 auto;display:flex;justify-content:flex-end;align-items:center;gap:12px;"]);
|
|
58
|
-
|
|
54
|
+
const LeftSide = /* @__PURE__ */ styled.div.withConfig({
|
|
59
55
|
displayName: "Arraystyles__LeftSide",
|
|
60
56
|
componentId: "sc-9atgo7-12"
|
|
61
57
|
})(["flex:0 0 auto;text-align:left;"]);
|
|
62
|
-
|
|
58
|
+
const CreatorItemsList = /* @__PURE__ */ styled.div.withConfig({
|
|
63
59
|
displayName: "Arraystyles__CreatorItemsList",
|
|
64
60
|
componentId: "sc-9atgo7-13"
|
|
65
61
|
})(["display:flex;flex-direction:column;gap:12px;"]);
|
|
66
|
-
|
|
62
|
+
const DeleteIcon = /* @__PURE__ */ styled(Icon).withConfig({
|
|
67
63
|
displayName: "Arraystyles__DeleteIcon",
|
|
68
64
|
componentId: "sc-9atgo7-14"
|
|
69
|
-
})(["position:absolute;right:0;top:50%;transform:translateY(-50%);display:none;color:", ";&:hover{color:", ";}"],
|
|
70
|
-
|
|
71
|
-
}, function (props) {
|
|
72
|
-
return props.theme.palette['red-500'];
|
|
73
|
-
});
|
|
74
|
-
export var CollectorWrapper = styled.div.withConfig({
|
|
65
|
+
})(["position:absolute;right:0;top:50%;transform:translateY(-50%);display:none;color:", ";&:hover{color:", ";}"], (props) => props.theme.palette["red-600"], (props) => props.theme.palette["red-500"]);
|
|
66
|
+
const CollectorWrapper = /* @__PURE__ */ styled.div.withConfig({
|
|
75
67
|
displayName: "Arraystyles__CollectorWrapper",
|
|
76
68
|
componentId: "sc-9atgo7-15"
|
|
77
69
|
})(["padding:0 34px;margin-bottom:24px;"]);
|
|
78
|
-
|
|
70
|
+
const CreatorRow = /* @__PURE__ */ styled.div.withConfig({
|
|
79
71
|
displayName: "Arraystyles__CreatorRow",
|
|
80
72
|
componentId: "sc-9atgo7-16"
|
|
81
|
-
})(["padding:0 34px;position:relative;&:hover{", "{display:block;}}"], DeleteIcon);
|
|
73
|
+
})(["padding:0 34px;position:relative;&:hover{", "{display:block;}}"], DeleteIcon);
|
|
74
|
+
export {
|
|
75
|
+
CollectorWrapper,
|
|
76
|
+
CreatorItemsList,
|
|
77
|
+
CreatorRow,
|
|
78
|
+
DeleteIcon,
|
|
79
|
+
EmptyState,
|
|
80
|
+
LeftSide,
|
|
81
|
+
Limit,
|
|
82
|
+
LimitPart,
|
|
83
|
+
Modal,
|
|
84
|
+
ModalContentWrapper,
|
|
85
|
+
ModalFooterLeftSide,
|
|
86
|
+
ModalSubHeader,
|
|
87
|
+
RightSide,
|
|
88
|
+
SearchWrapper,
|
|
89
|
+
TextArea,
|
|
90
|
+
TriggerButton,
|
|
91
|
+
TriggerButtonLabel
|
|
92
|
+
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { RequiredProps } from '@synerise/ds-utils';
|
|
3
|
+
import { ArrayProps, ArrayValueElement, FactorsTexts } from '../../Factors.types';
|
|
4
4
|
export type ArrayModalProps<ItemType extends 'string' | 'number'> = RequiredProps<ArrayProps, 'itemType'> & {
|
|
5
5
|
visible?: boolean;
|
|
6
6
|
readOnly?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { ArrayValueElement } from '../../Factors.types';
|
|
2
|
+
import { ArrayValueWithID } from './Array.types';
|
|
3
3
|
export declare const matchesSearchQuery: (item: string | number, searchQuery: string) => boolean;
|
|
4
4
|
export declare const arrayWithUUID: <ItemType extends "string" | "number">(items: ArrayValueElement<ItemType>[]) => ArrayValueWithID<ItemType>[];
|
|
5
5
|
export declare const sanitiseValues: (element: string) => string;
|