@synerise/ds-condition 0.20.65 → 0.21.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.21.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-condition@0.20.65...@synerise/ds-condition@0.21.0) (2023-12-14)
+
+
+### Features
+
+* **filter:** reorder cruds in filter step conditions ([8d4019b](https://github.com/Synerise/synerise-design/commit/8d4019b49c7579000e093aabbcd31a75626d9c1c))
+
+
+
+
+
 ## [0.20.65](https://github.com/Synerise/synerise-design/compare/@synerise/ds-condition@0.20.64...@synerise/ds-condition@0.20.65) (2023-12-13)
 
 **Note:** Version bump only for package @synerise/ds-condition

package/dist/Condition.d.ts

@@ -1,8 +1,7 @@
-import * as React from 'react';
 import * as T from './Condition.types';
 export declare const OPERATOR = "operator";
 export declare const PARAMETER = "parameter";
 export declare const FACTOR = "factor";
 export declare const SUBJECT = "subject";
-declare const Condition: React.FC<T.ConditionProps>;
+declare const Condition: (props: T.ConditionProps) => JSX.Element;
 export default Condition;

package/dist/Condition.js

@@ -6,7 +6,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import * as React from 'react';
+import React, { useEffect, useState, useCallback, useMemo } from 'react';
 import { useIntl } from 'react-intl';
 import { ReactSortable } from 'react-sortablejs';
 import Icon, { Add3M } from '@synerise/ds-icon';
@@ -65,7 +65,7 @@ var Condition = function Condition(props) {
   var _useIntl = useIntl(),
       formatMessage = _useIntl.formatMessage;
 
-  var text = React.useMemo(function () {
+  var text = useMemo(function () {
     return _objectSpread({
       addStep: formatMessage({
         id: 'DS.CONDITION.ADD-STEP',
@@ -78,20 +78,20 @@ var Condition = function Condition(props) {
     }, texts);
   }, [texts, formatMessage]);
 
-  var _React$useState = React.useState(DEFAULT_CONDITION),
-      currentConditionId = _React$useState[0],
-      setCurrentConditionId = _React$useState[1];
+  var _useState = useState(DEFAULT_CONDITION),
+      currentConditionId = _useState[0],
+      setCurrentConditionId = _useState[1];
 
-  var _React$useState2 = React.useState(DEFAULT_STEP),
-      currentStepId = _React$useState2[0],
-      setCurrentStepId = _React$useState2[1];
+  var _useState2 = useState(DEFAULT_STEP),
+      currentStepId = _useState2[0],
+      setCurrentStepId = _useState2[1];
 
-  var _React$useState3 = React.useState(autoOpenedComponent),
-      currentField = _React$useState3[0],
-      setCurrentField = _React$useState3[1];
+  var _useState3 = useState(autoOpenedComponent),
+      currentField = _useState3[0],
+      setCurrentField = _useState3[1];
 
   var prevSteps = usePrevious(steps);
-  React.useEffect(function () {
+  useEffect(function () {
     if (autoOpenedComponent && steps.length && steps[0].conditions[0].operator && steps[0].conditions[0].operator.value === undefined) {
       setCurrentStepId(steps[0].id);
       setCurrentConditionId(steps[0].conditions[0].id);
@@ -99,7 +99,7 @@ var Condition = function Condition(props) {
     } // eslint-disable-next-line react-hooks/exhaustive-deps
 
   }, []);
-  React.useEffect(function () {
+  useEffect(function () {
     var newConditionId = prevSteps && steps && steps.reduce(function (id, step) {
       var result = id;
       var conditions = step.conditions.map(function (condition) {
@@ -135,7 +135,7 @@ var Condition = function Condition(props) {
       setCurrentConditionId(newConditionId);
     }
   }, [currentConditionId, currentField, prevSteps, steps]);
-  var clearConditionRow = React.useCallback(function (stepId) {
+  var clearConditionRow = useCallback(function (stepId) {
     var step = steps.find(function (s) {
       return s.id === stepId;
     });
@@ -163,19 +163,19 @@ var Condition = function Condition(props) {
       setCurrentField(OPERATOR);
     }
   }, [steps, removeCondition, addCondition, autoClearCondition, onChangeFactorValue, onChangeOperator, onChangeParameter]);
-  var selectSubject = React.useCallback(function (value, stepId) {
+  var selectSubject = useCallback(function (value, stepId) {
     clearConditionRow(stepId);
     setCurrentStepId(stepId);
     setCurrentField(PARAMETER);
     onChangeSubject && onChangeSubject(stepId, value);
   }, [clearConditionRow, onChangeSubject]);
-  var selectContext = React.useCallback(function (value, stepId) {
+  var selectContext = useCallback(function (value, stepId) {
     clearConditionRow(stepId);
     setCurrentStepId(stepId);
     setCurrentField(PARAMETER);
     onChangeContext && onChangeContext(stepId, value);
   }, [clearConditionRow, onChangeContext]);
-  var selectParameter = React.useCallback(function (stepId, conditionId, value) {
+  var selectParameter = useCallback(function (stepId, conditionId, value) {
     if (conditionId && onChangeParameter) {
       autoClearCondition && onChangeOperator && onChangeOperator(stepId, conditionId, undefined);
       autoClearCondition && onChangeFactorValue && onChangeFactorValue(stepId, conditionId, undefined);
@@ -185,7 +185,7 @@ var Condition = function Condition(props) {
       setCurrentField(OPERATOR);
     }
   }, [autoClearCondition, onChangeFactorValue, onChangeOperator, onChangeParameter]);
-  var selectOperator = React.useCallback(function (stepId, conditionId, value) {
+  var selectOperator = useCallback(function (stepId, conditionId, value) {
     if (conditionId && onChangeOperator) {
       autoClearCondition && onChangeFactorValue && onChangeFactorValue(stepId, conditionId, undefined);
       onChangeOperator(stepId, conditionId, value);
@@ -194,21 +194,21 @@ var Condition = function Condition(props) {
       setCurrentField(FACTOR);
     }
   }, [autoClearCondition, onChangeFactorValue, onChangeOperator]);
-  var setStepConditionFactorType = React.useCallback(function (stepId, conditionId, factorType) {
+  var setStepConditionFactorType = useCallback(function (stepId, conditionId, factorType) {
     setCurrentConditionId(conditionId);
     setCurrentStepId(stepId);
     setCurrentField(FACTOR);
     onChangeFactorType && onChangeFactorType(stepId, conditionId, factorType);
   }, [onChangeFactorType]);
-  var setStepConditionFactorValue = React.useCallback(function (stepId, conditionId, value) {
+  var setStepConditionFactorValue = useCallback(function (stepId, conditionId, value) {
     setCurrentField(DEFAULT_FIELD);
     setCurrentStepId(stepId);
     onChangeFactorValue && onChangeFactorValue(stepId, conditionId, value);
   }, [onChangeFactorValue]);
-  var draggableEnabled = React.useMemo(function () {
+  var draggableEnabled = useMemo(function () {
     return onChangeOrder && steps.length > 1;
   }, [steps, onChangeOrder]);
-  var handleAddStep = React.useCallback(function () {
+  var handleAddStep = useCallback(function () {
     var newStepId = addStep ? addStep() : undefined;
 
     if (newStepId) {
@@ -216,7 +216,7 @@ var Condition = function Condition(props) {
       setCurrentField(SUBJECT);
     }
   }, [addStep]);
-  var handleAddCondition = React.useMemo(function () {
+  var handleAddCondition = useMemo(function () {
     if (!addCondition) {
       return undefined;
     }
@@ -231,13 +231,13 @@ var Condition = function Condition(props) {
       }
     };
   }, [addCondition]);
-  var handleClearActiveCondition = React.useCallback(function () {
+  var handleClearActiveCondition = useCallback(function () {
     onDeactivate && onDeactivate(currentStepId, currentConditionId);
     setCurrentConditionId(DEFAULT_CONDITION);
     setCurrentStepId(DEFAULT_STEP);
     setCurrentField(DEFAULT_FIELD);
   }, [currentConditionId, currentStepId, onDeactivate]);
-  return React.useMemo(function () {
+  return useMemo(function () {
     return /*#__PURE__*/React.createElement(S.Condition, {
       className: "ds-conditions",
       "data-popup-container": true
@@ -285,7 +285,7 @@ var Condition = function Condition(props) {
     }, /*#__PURE__*/React.createElement(Icon, {
       component: /*#__PURE__*/React.createElement(Add3M, null)
     }), text.addStep)), !readOnly && renderAddStep && /*#__PURE__*/React.createElement(S.AddStepButton, null, renderAddStep()));
-  }, [steps, onChangeOrder, addStep, handleAddStep, text, renderAddStep, currentStepId, getPopupContainerOverride, draggableEnabled, selectOperator, selectParameter, selectContext, selectSubject, onUpdateStepName, duplicateStep, removeStep, minConditionsLength, maxConditionsLength, setStepConditionFactorType, setStepConditionFactorValue, currentConditionId, currentField, removeCondition, handleAddCondition, handleClearActiveCondition, showSuffix, hoverDisabled, inputProps, readOnly]);
+  }, [steps, onChangeOrder, addStep, handleAddStep, text, readOnly, renderAddStep, currentStepId, getPopupContainerOverride, draggableEnabled, selectOperator, selectParameter, selectContext, selectSubject, onUpdateStepName, duplicateStep, removeStep, minConditionsLength, maxConditionsLength, setStepConditionFactorType, setStepConditionFactorValue, currentConditionId, currentField, removeCondition, handleAddCondition, handleClearActiveCondition, showSuffix, hoverDisabled, inputProps]);
 };
 
 export default Condition;

package/dist/Condition.types.d.ts

@@ -1,28 +1,29 @@
-import * as React from 'react';
+import { ReactText, ReactNode } from 'react';
 import { SubjectItem, SubjectProps } from '@synerise/ds-subject/dist/Subject.types';
 import { FactorsProps, FactorType, FactorValueType, InputProps } from '@synerise/ds-factors/dist/Factors.types';
 import { OperatorsItem, OperatorsProps } from '@synerise/ds-operators/dist/Operator.types';
 import { ContextGroup, ContextItem, ContextProps } from '@synerise/ds-context-selector/dist/ContextSelector.types';
+import type { ConditionStepCrudActions } from './ConditionStep/ConditionStep.types';
 export type StepConditions = {
-    id: React.ReactText;
+    id: ReactText;
     parameter?: Omit<FactorsProps, 'onChangeValue'>;
     operator?: Omit<OperatorsProps, 'onChange'>;
     factor?: Omit<FactorsProps, 'onChangeValue' | 'setSelectedFactorType'>;
 };
 export type ConditionStep = {
-    id: React.ReactText;
+    id: ReactText;
     subject?: Omit<SubjectProps, 'onSelectItem'>;
     context?: Omit<ContextProps, 'onSelectItem'>;
     stepName?: string;
     conditions: StepConditions[];
-    addConditionErrorText?: React.ReactNode | string;
+    addConditionErrorText?: ReactNode;
 };
 export type ConditionTexts = {
     stepNamePlaceholder: string;
     removeConditionRowTooltip: string;
     addFirstConditionRowButton: string;
     addConditionRowButton: string;
-    addStep: string | React.ReactNode;
+    addStep: ReactNode;
     dropLabel: string;
     moveTooltip: string;
     duplicateTooltip: string;
@@ -32,29 +33,27 @@ export type ConditionTexts = {
 export type ConditionProps = {
     steps: ConditionStep[];
     getPopupContainerOverride?: (trigger: HTMLElement | null) => HTMLElement;
-    addCondition?: (stepId: React.ReactText) => string | void;
-    renderAddStep?: () => React.ReactNode;
-    removeCondition?: (stepId: React.ReactText, conditionRowId: React.ReactText) => void;
-    removeStep?: (stepId: React.ReactText) => void;
-    duplicateStep?: (stepId: React.ReactText) => void;
+    addCondition?: (stepId: ReactText) => string | void;
+    renderAddStep?: () => ReactNode;
+    removeCondition?: (stepId: ReactText, conditionRowId: ReactText) => void;
     addStep?: () => string | void;
     onChangeOrder?: (newOrder: ConditionStep[]) => void;
     texts?: Partial<ConditionTexts>;
     minConditionsLength: number;
     maxConditionsLength?: number | undefined;
     autoClearCondition?: boolean;
-    onChangeContext: (stepId: React.ReactText, value: ContextItem | ContextGroup | undefined) => void;
-    onChangeSubject: (stepId: React.ReactText, value: SubjectItem | undefined) => void;
-    onChangeParameter: (stepId: React.ReactText, conditionId: React.ReactText, value: FactorValueType | undefined) => void;
-    onChangeOperator: (stepId: React.ReactText, conditionId: React.ReactText, value: OperatorsItem | undefined) => void;
-    onChangeFactorValue: (stepId: React.ReactText, conditionId: React.ReactText, value: FactorValueType | undefined) => void;
-    onChangeFactorType: (stepId: React.ReactText, conditionId: React.ReactText, value: FactorType | undefined) => void;
-    onUpdateStepName?: (stepId: React.ReactText, value: string) => void;
+    onChangeContext: (stepId: ReactText, value: ContextItem | ContextGroup | undefined) => void;
+    onChangeSubject: (stepId: ReactText, value: SubjectItem | undefined) => void;
+    onChangeParameter: (stepId: ReactText, conditionId: ReactText, value: FactorValueType | undefined) => void;
+    onChangeOperator: (stepId: ReactText, conditionId: ReactText, value: OperatorsItem | undefined) => void;
+    onChangeFactorValue: (stepId: ReactText, conditionId: ReactText, value: FactorValueType | undefined) => void;
+    onChangeFactorType: (stepId: ReactText, conditionId: ReactText, value: FactorType | undefined) => void;
+    onUpdateStepName?: (stepId: ReactText, value: string) => void;
     type?: 'attribute' | 'event';
     showSuffix?: boolean;
     hoverDisabled?: boolean;
     autoOpenedComponent?: 'subject' | 'operator' | 'factor' | 'parameter' | 'context';
     inputProps?: Partial<InputProps>;
-    onDeactivate?: (currentStepId: React.ReactText, currentConditionId: React.ReactText) => void;
+    onDeactivate?: (currentStepId: ReactText, currentConditionId: ReactText) => void;
     readOnly?: boolean;
-};
+} & ConditionStepCrudActions;

package/dist/ConditionStep/ConditionStep.d.ts

@@ -1,3 +1,2 @@
-import * as React from 'react';
 import * as T from './ConditionStep.types';
-export declare const ConditionStep: React.FC<T.ConditionStepProps>;
+export declare const ConditionStep: ({ step, texts, index, addCondition, removeCondition, updateStepName, removeStep, duplicateStep, minConditionsLength, maxConditionsLength, draggableEnabled, selectSubject, selectContext, selectOperator, selectParameter, setStepConditionFactorType, setStepConditionFactorValue, getPopupContainerOverride, hasPriority, currentStepId, currentConditionId, currentField, setCurrentField, setCurrentCondition, setCurrentStep, onDeactivate, showSuffix, hoverDisabled, inputProps, readOnly, }: T.ConditionStepProps) => JSX.Element;

package/dist/ConditionStep/ConditionStep.js

@@ -6,7 +6,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import * as React from 'react';
+import React, { useCallback, useMemo } from 'react';
 import Subject from '@synerise/ds-subject';
 import ContextSelector from '@synerise/ds-context-selector';
 import { useIntl } from 'react-intl';
@@ -15,8 +15,7 @@ import * as S from '../Condition.style';
 import { StepHeader } from './StepHeader';
 import { AddCondition } from './AddCondition';
 import { ConditionRow } from './ConditionRow';
-import { SUBJECT } from '../Condition'; // eslint-disable-next-line import/prefer-default-export
-
+import { SUBJECT } from '../Condition';
 export var ConditionStep = function ConditionStep(_ref) {
   var _step$subject2, _step$subject2$select, _step$context3, _step$context3$select;
 
@@ -56,7 +55,7 @@ export var ConditionStep = function ConditionStep(_ref) {
   var _useIntl = useIntl(),
       formatMessage = _useIntl.formatMessage;
 
-  var text = React.useMemo(function () {
+  var text = useMemo(function () {
     return _objectSpread({
       stepNamePlaceholder: formatMessage({
         id: 'DS.CONDITION.STEP_NAME-PLACEHOLDER',
@@ -100,16 +99,16 @@ export var ConditionStep = function ConditionStep(_ref) {
       })
     }, texts);
   }, [texts, formatMessage]);
-  var onActivate = React.useCallback(function () {
+  var onActivate = useCallback(function () {
     return setCurrentStep ? function () {
       return setCurrentStep(step.id);
     } : undefined;
   }, [step.id, setCurrentStep]);
-  var onAddCondition = React.useCallback(function (stepId) {
+  var onAddCondition = useCallback(function (stepId) {
     addCondition && addCondition(stepId);
     onActivate && onActivate();
   }, [addCondition, onActivate]);
-  var stepHeader = React.useMemo(function () {
+  var stepHeader = useMemo(function () {
     return /*#__PURE__*/React.createElement(StepHeader, {
       index: index,
       stepId: step.id,
@@ -122,7 +121,7 @@ export var ConditionStep = function ConditionStep(_ref) {
       readOnly: readOnly
     });
   }, [draggableEnabled, duplicateStep, index, removeStep, step.id, step.stepName, text, updateStepName, readOnly]);
-  var addConditionButton = React.useMemo(function () {
+  var addConditionButton = useMemo(function () {
     var _step$subject, _step$context;
 
     return !readOnly && addCondition && (maxConditionsLength === undefined || step.conditions.length < maxConditionsLength) && /*#__PURE__*/React.createElement(AddCondition, {
@@ -135,7 +134,7 @@ export var ConditionStep = function ConditionStep(_ref) {
       selectedContext: Boolean((_step$context = step.context) == null ? void 0 : _step$context.selectedItem)
     });
   }, [addCondition, onAddCondition, maxConditionsLength, step.conditions.length, step.context, step.id, step.subject, text, readOnly, step.addConditionErrorText]);
-  var renderConditionRow = React.useCallback(function (condition, conditionIndex) {
+  var renderConditionRow = useCallback(function (condition, conditionIndex) {
     var _step$context2;
 
     var handleActivation = function handleActivation(conditionId) {

package/dist/ConditionStep/ConditionStep.types.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { ReactText } from 'react';
 import { FactorType, FactorValueType, InputProps } from '@synerise/ds-factors/dist/Factors.types';
 import { ContextGroup, ContextItem } from '@synerise/ds-context-selector/dist/ContextSelector.types';
 import { SubjectItem } from '@synerise/ds-subject/dist/Subject.types';
@@ -8,32 +8,34 @@ export type ConditionStepProps = {
     index: number;
     step: ConditionStep;
     hasPriority?: boolean;
-    onStepActivate?: (stepid: React.ReactText) => void;
+    onStepActivate?: (stepid: ReactText) => void;
     getPopupContainerOverride?: ConditionProps['getPopupContainerOverride'];
-    addCondition?: (stepId: React.ReactText) => void;
-    removeCondition?: (stepId: React.ReactText, conditionRowId: React.ReactText) => void;
-    updateStepName?: (stepId: React.ReactText, value: string) => void;
-    removeStep?: (stepId: React.ReactText) => void;
-    duplicateStep?: (stepId: React.ReactText) => void;
+    addCondition?: (stepId: ReactText) => void;
+    removeCondition?: (stepId: ReactText, conditionRowId: ReactText) => void;
+    updateStepName?: (stepId: ReactText, value: string) => void;
     texts?: Partial<ConditionTexts>;
     minConditionsLength: number;
     maxConditionsLength: number | undefined;
     draggableEnabled?: boolean;
-    selectSubject: (value: SubjectItem, stepId: React.ReactText) => void;
-    selectContext: (value: ContextItem | ContextGroup | undefined, stepId: React.ReactText) => void;
-    selectParameter: (stepId: React.ReactText, condition: React.ReactText, value: FactorValueType | undefined) => void;
-    selectOperator: (stepId: React.ReactText, condition: React.ReactText, value: OperatorsItem | OperatorsGroup | undefined) => void;
-    setStepConditionFactorType: (stepId: React.ReactText, condition: React.ReactText, factorType: FactorType | undefined) => void;
-    setStepConditionFactorValue: (stepId: React.ReactText, condition: React.ReactText, value: FactorValueType) => void;
-    currentStepId: React.ReactText;
-    currentConditionId: React.ReactText;
-    currentField: React.ReactText;
+    selectSubject: (value: SubjectItem, stepId: ReactText) => void;
+    selectContext: (value: ContextItem | ContextGroup | undefined, stepId: ReactText) => void;
+    selectParameter: (stepId: ReactText, condition: ReactText, value: FactorValueType | undefined) => void;
+    selectOperator: (stepId: ReactText, condition: ReactText, value: OperatorsItem | OperatorsGroup | undefined) => void;
+    setStepConditionFactorType: (stepId: ReactText, condition: ReactText, factorType: FactorType | undefined) => void;
+    setStepConditionFactorValue: (stepId: ReactText, condition: ReactText, value: FactorValueType) => void;
+    currentStepId: ReactText;
+    currentConditionId: ReactText;
+    currentField: ReactText;
     setCurrentField: (field: string) => void;
     setCurrentCondition: (conditionId: string) => void;
-    setCurrentStep: (stepId: React.ReactText) => void;
+    setCurrentStep: (stepId: ReactText) => void;
     onDeactivate: () => void;
     showSuffix?: boolean;
     hoverDisabled?: boolean;
     inputProps?: Partial<InputProps>;
     readOnly?: boolean;
+} & ConditionStepCrudActions;
+export type ConditionStepCrudActions = {
+    removeStep?: (stepId: ReactText) => void;
+    duplicateStep?: (stepId: ReactText) => void;
 };

package/dist/index.d.ts

@@ -1 +1,2 @@
 export { default } from './Condition';
+export type { ConditionStepCrudActions } from './ConditionStep/ConditionStep.types';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-condition",
-  "version": "0.20.65",
+  "version": "0.21.0",
   "description": "Condition UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -34,10 +34,10 @@
   "types": "dist/index.d.ts",
   "dependencies": {
     "@synerise/ds-button": "^0.18.9",
-    "@synerise/ds-context-selector": "^0.19.22",
+    "@synerise/ds-context-selector": "^0.19.23",
     "@synerise/ds-core": "^0.40.9",
-    "@synerise/ds-cruds": "^0.3.43",
-    "@synerise/ds-factors": "^0.20.15",
+    "@synerise/ds-cruds": "^0.4.0",
+    "@synerise/ds-factors": "^0.20.16",
     "@synerise/ds-icon": "^0.58.9",
     "@synerise/ds-inline-edit": "^0.6.91",
     "@synerise/ds-operators": "^0.10.50",
@@ -59,5 +59,5 @@
     "@testing-library/react": "10.0.1",
     "uuid": "^8.3.2"
   },
-  "gitHead": "76edb4723a30c59f1a54f666f66fcd814de0af70"
+  "gitHead": "0a23e5f431033a6180383d3e0e19e885b5a66778"
 }