@synerise/ds-condition 0.13.10 → 0.14.0

package/CHANGELOG.md

@@ -3,6 +3,23 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.14.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-condition@0.13.10...@synerise/ds-condition@0.14.0) (2022-04-05)
+
+
+### Bug Fixes
+
+* **condition:** styles of StepHeader, hiding step name in stories ([9924476](https://github.com/Synerise/synerise-design/commit/9924476909449c5a11db7f784ba3a30008f48120))
+
+
+### Features
+
+* **condition:** updates styles, allows to dragging by header, not only icon ([4c070eb](https://github.com/Synerise/synerise-design/commit/4c070ebaa5c3779733acea5cdff06d06842719b0))
+* **filter:** fixes bugs ([b862ddd](https://github.com/Synerise/synerise-design/commit/b862dddbce1293c2a5381663fc903bb574edd135))
+
+
+
+
+
 ## [0.13.10](https://github.com/Synerise/synerise-design/compare/@synerise/ds-condition@0.13.9...@synerise/ds-condition@0.13.10) (2022-03-31)
 
 **Note:** Version bump only for package @synerise/ds-condition

package/dist/Condition.js

@@ -25,6 +25,7 @@ var SORTABLE_CONFIG = {
   ghostClass: 'steps-list-ghost-element',
   className: 'steps-list',
   handle: '.step-drag-handler',
+  filter: '.ds-condition-step-name, .ds-cruds',
   animation: 150,
   forceFallback: true
 };
@@ -58,7 +59,7 @@ var Condition = function Condition(props) {
     return _objectSpread({
       addStep: formatMessage({
         id: 'DS.CONDITION.ADD-STEP',
-        defaultMessage: 'Add step'
+        defaultMessage: 'and then...'
       })
     }, texts);
   }, [texts, formatMessage]);
@@ -189,7 +190,8 @@ var Condition = function Condition(props) {
   }, [steps, onChangeOrder]);
   return React.useMemo(function () {
     return /*#__PURE__*/React.createElement(S.Condition, {
-      className: "ds-conditions"
+      className: "ds-conditions",
+      "data-popup-container": true
     }, /*#__PURE__*/React.createElement(ReactSortable, _extends({}, SORTABLE_CONFIG, {
       list: steps,
       setList: onChangeOrder || NOOP
@@ -197,7 +199,7 @@ var Condition = function Condition(props) {
       return /*#__PURE__*/React.createElement(ConditionStep, {
         key: "step-id-" + step.id,
         step: step,
-        texts: texts,
+        texts: text,
         index: index,
         hasPriority: step.id === priorityStepId,
         onStepActivate: setPriorityStepId,
@@ -218,16 +220,17 @@ var Condition = function Condition(props) {
         currentStepId: currentStepId,
         currentField: currentField,
         removeCondition: removeCondition,
-        addCondition: addCondition
+        addCondition: addCondition,
+        setCurrentField: setCurrentField
       });
-    })), addStep && /*#__PURE__*/React.createElement(Button, {
-      type: "ghost-primary",
+    })), addStep && /*#__PURE__*/React.createElement(S.AddStepButton, null, /*#__PURE__*/React.createElement(Button, {
+      type: "ghost",
       mode: "icon-label",
       onClick: addStep
     }, /*#__PURE__*/React.createElement(Icon, {
       component: /*#__PURE__*/React.createElement(Add3M, null)
-    }), text.addStep));
-  }, [steps, priorityStepId, setPriorityStepId, onChangeOrder, addStep, text.addStep, texts, draggableEnabled, selectOperator, selectParameter, selectContext, selectSubject, onUpdateStepName, duplicateStep, removeStep, minConditionsLength, maxConditionsLength, setStepConditionFactorType, setStepConditionFactorValue, currentConditionId, currentStepId, currentField, removeCondition, addCondition, getPopupContainerOverride]);
+    }), text.addStep)));
+  }, [steps, priorityStepId, setPriorityStepId, onChangeOrder, addStep, text, draggableEnabled, selectOperator, selectParameter, selectContext, selectSubject, onUpdateStepName, duplicateStep, removeStep, minConditionsLength, maxConditionsLength, setStepConditionFactorType, setStepConditionFactorValue, currentConditionId, currentStepId, currentField, removeCondition, addCondition, getPopupContainerOverride]);
 };
 
 export default Condition;

package/dist/Condition.style.d.ts

@@ -1,10 +1,17 @@
+/// <reference types="react" />
 export declare const StepConditions: import("styled-components").StyledComponent<"div", any, {
     withoutStepName: boolean;
 }, never>;
 export declare const StepName: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Condition: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ConditionStepWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const And: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DragIcon: import("styled-components").StyledComponent<import("react").FC<import("@synerise/ds-icon").IconProps>, any, {}, never>;
 export declare const StepCruds: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StepHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const LeftSide: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StepHeader: import("styled-components").StyledComponent<"div", any, {
+    draggable: boolean;
+}, never>;
 export declare const Step: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ConditionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Subject: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -18,3 +25,4 @@ export declare const ConditionConnections: import("styled-components").StyledCom
     first?: boolean | undefined;
     last?: boolean | undefined;
 }, never>;
+export declare const AddStepButton: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/Condition.style.js

@@ -1,40 +1,57 @@
 import styled from 'styled-components';
 import { IconWrapper } from '@synerise/ds-inline-edit/dist/InlineEdit.styles';
+import Icon from '@synerise/ds-icon';
 export var StepConditions = styled.div.withConfig({
   displayName: "Conditionstyle__StepConditions",
   componentId: "sc-1lk06p3-0"
-})(["display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;margin-top:", ";"], function (props) {
-  return props.withoutStepName ? '22px' : '0';
-});
+})(["display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;margin-top:0;padding:0 24px;width:100%;"]);
 export var StepName = styled.div.withConfig({
   displayName: "Conditionstyle__StepName",
   componentId: "sc-1lk06p3-1"
-})(["font-size:13px;line-height:1.84;color:", ";margin:0 0 8px;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;white-space:pre-wrap;"], function (props) {
-  return props.theme.palette['grey-400'];
+})(["font-size:13px;line-height:1.84;color:", ";display:flex;flex-direction:row;align-items:center;justify-content:flex-start;white-space:pre-wrap;&&& input{margin-top:2px;cursor:default;}"], function (props) {
+  return props.theme.palette['grey-800'];
 });
 export var Condition = styled.div.withConfig({
   displayName: "Conditionstyle__Condition",
   componentId: "sc-1lk06p3-2"
-})(["padding:12px 0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-width:575px;.steps-list{width:100%;}"]);
+})(["padding:12px 0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-width:575px;width:100%;.steps-list{width:100%;}"]);
+export var ConditionStepWrapper = styled.div.withConfig({
+  displayName: "Conditionstyle__ConditionStepWrapper",
+  componentId: "sc-1lk06p3-3"
+})(["display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;width:100%;"]);
+export var And = styled.div.withConfig({
+  displayName: "Conditionstyle__And",
+  componentId: "sc-1lk06p3-4"
+})([""]);
+export var DragIcon = styled(Icon).withConfig({
+  displayName: "Conditionstyle__DragIcon",
+  componentId: "sc-1lk06p3-5"
+})(["opacity:0;visibility:hidden;position:absolute;top:0;left:-24px;"]);
 export var StepCruds = styled.div.withConfig({
   displayName: "Conditionstyle__StepCruds",
-  componentId: "sc-1lk06p3-3"
-})(["display:flex;align-items:center;justify-content:flex-end;opacity:0;visibility:hidden;margin-bottom:8px;"]);
+  componentId: "sc-1lk06p3-6"
+})(["display:flex;align-items:center;justify-content:flex-end;opacity:0;visibility:hidden;"]);
+export var LeftSide = styled.div.withConfig({
+  displayName: "Conditionstyle__LeftSide",
+  componentId: "sc-1lk06p3-7"
+})(["display:flex;flex-direction:row;align-items:center;justify-content:flex-start;position:relative;"]);
 export var StepHeader = styled.div.withConfig({
   displayName: "Conditionstyle__StepHeader",
-  componentId: "sc-1lk06p3-4"
-})(["display:flex;width:100%;height:46px;flex-direction:row;align-items:flex-end;justify-content:space-between;"]);
+  componentId: "sc-1lk06p3-8"
+})(["display:flex;width:100%;flex-direction:row;align-items:flex-end;justify-content:space-between;margin-bottom:8px;padding:12px 24px 0;cursor:", ";"], function (props) {
+  return props.draggable ? 'grab' : 'default';
+});
 export var Step = styled.div.withConfig({
   displayName: "Conditionstyle__Step",
-  componentId: "sc-1lk06p3-5"
-})(["display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:0 0 24px 0;border-top:1px dotted ", ";position:relative;&:first-of-type{border-top:0;&.steps-list-ghost-element{&:after{display:none;}}}&:hover{", "{opacity:1;visibility:visible;}}&.sortable-chosen{cursor:grabbing;width:100%;opacity:1 !important;height:50px;background-color:", ";display:flex;align-items:center;justify-content:center;padding:0 20px;box-shadow:0 16px 32px 0 #23293619;", "{align-items:center;}", "{margin:0;", "{display:none;}}", "{display:none;}}&.steps-list-ghost-element{cursor:grabbing;width:100%;background-color:", ";border:1px dashed ", ";border-radius:3px;display:flex;align-items:center;justify-content:center;padding:0;height:50px;box-shadow:none;position:relative;margin:24px 0;&:after{content:'';position:absolute;top:-24px;left:0;width:100%;height:1px;border-bottom:1px dotted ", ";}&:before{content:attr(data-dropLabel);text-align:center;position:relative;color:", ";}*{display:none;}}}"], function (props) {
-  return props.theme.palette['grey-300'];
-}, StepCruds, function (props) {
+  componentId: "sc-1lk06p3-9"
+})(["display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:0 0 12px;position:relative;&:first-of-type{&.steps-list-ghost-element{&:after{display:none;}}}&:hover{background-color:", ";", "{opacity:1;visibility:visible;}", "{opacity:1;visibility:visible;}}&.sortable-chosen{cursor:grabbing;width:100%;opacity:1 !important;height:50px;background-color:", ";display:flex;align-items:center;justify-content:center;padding:0 20px;box-shadow:0 16px 32px 0 #23293619;", "{align-items:center;}", "{margin:0;", "{display:none;}}", "{display:none;}}&.steps-list-ghost-element{cursor:grabbing;width:100%;background-color:", ";border-left:2px solid ", ";border-radius:0;display:flex;align-items:center;justify-content:center;padding:0;height:50px;box-shadow:none;position:relative;margin:24px 0;&:after{content:'';position:absolute;top:-24px;left:0;width:100%;height:1px;border-bottom:1px dotted ", ";}&:before{content:attr(data-dropLabel);text-align:center;position:relative;color:", ";}*{display:none;}}}"], function (props) {
+  return props.theme.palette['grey-050'];
+}, StepCruds, DragIcon, function (props) {
   return props.theme.palette.white;
 }, StepHeader, StepName, IconWrapper, StepConditions, function (props) {
   return props.theme.palette['blue-050'];
 }, function (props) {
-  return props.theme.palette['blue-300'];
+  return props.theme.palette['blue-600'];
 }, function (props) {
   return props.theme.palette['grey-300'];
 }, function (props) {
@@ -42,33 +59,33 @@ export var Step = styled.div.withConfig({
 });
 export var ConditionWrapper = styled.div.withConfig({
   displayName: "Conditionstyle__ConditionWrapper",
-  componentId: "sc-1lk06p3-6"
+  componentId: "sc-1lk06p3-10"
 })([""]);
 export var Subject = styled.div.withConfig({
   displayName: "Conditionstyle__Subject",
-  componentId: "sc-1lk06p3-7"
+  componentId: "sc-1lk06p3-11"
 })([""]);
 export var RemoveIconWrapper = styled.span.withConfig({
   displayName: "Conditionstyle__RemoveIconWrapper",
-  componentId: "sc-1lk06p3-8"
+  componentId: "sc-1lk06p3-12"
 })(["visibility:hidden;pointer-events:none;opacity:0;transition:all 0.3s ease;width:32px;height:32px;display:flex;align-items:center;justify-content:center;margin-left:8px;"]);
 export var ConditionRows = styled.div.withConfig({
   displayName: "Conditionstyle__ConditionRows",
-  componentId: "sc-1lk06p3-9"
+  componentId: "sc-1lk06p3-13"
 })(["display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;"]);
 export var ConditionRow = styled.div.withConfig({
   displayName: "Conditionstyle__ConditionRow",
-  componentId: "sc-1lk06p3-10"
+  componentId: "sc-1lk06p3-14"
 })(["display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;padding-bottom:16px;min-width:780px;z-index:", ";", "{margin-right:8px;&:last-of-type{margin-right:0;}}&:hover{", "{opacity:1;visibility:visible;pointer-events:all;cursor:pointer;}}"], function (props) {
   return 10000 - props.index;
 }, ConditionWrapper, RemoveIconWrapper);
 export var AddConditionRow = styled.div.withConfig({
   displayName: "Conditionstyle__AddConditionRow",
-  componentId: "sc-1lk06p3-11"
+  componentId: "sc-1lk06p3-15"
 })(["display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:row;"]);
 export var ConditionConnections = styled.span.withConfig({
   displayName: "Conditionstyle__ConditionConnections",
-  componentId: "sc-1lk06p3-12"
+  componentId: "sc-1lk06p3-16"
 })(["display:flex;width:32px;margin:0 12px;position:relative;height:32px;&:before{position:absolute;content:'';width:", ";height:1px;top:50%;left:", ";background-color:", ";}&:after{display:", ";position:absolute;content:'';width:1px;left:50%;height:auto;top:", ";bottom:", ";background-color:", ";}"], function (props) {
   return props.first ? '100%' : '16px';
 }, function (props) {
@@ -83,4 +100,8 @@ export var ConditionConnections = styled.span.withConfig({
   return props.last ? '16px' : '-16px';
 }, function (props) {
   return props.theme.palette['grey-300'];
-});
+});
+export var AddStepButton = styled.div.withConfig({
+  displayName: "Conditionstyle__AddStepButton",
+  componentId: "sc-1lk06p3-17"
+})(["margin:12px 24px 0;"]);

package/dist/Condition.types.d.ts

@@ -47,4 +47,5 @@ export declare type ConditionProps = {
     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;
+    type?: 'attribute' | 'event';
 };

package/dist/ConditionStep/ConditionRow/ConditionRow.js

@@ -29,7 +29,7 @@ export var ConditionRow = function ConditionRow(_ref) {
       setStepConditionFactorType = _ref.setStepConditionFactorType,
       setStepConditionFactorValue = _ref.setStepConditionFactorValue,
       getPopupContainerOverride = _ref.getPopupContainerOverride,
-      onActivate = _ref.onActivate,
+      _onActivate = _ref.onActivate,
       hasPriority = _ref.hasPriority,
       texts = _ref.texts;
   return /*#__PURE__*/React.createElement(S.ConditionRow, {
@@ -43,21 +43,27 @@ export var ConditionRow = function ConditionRow(_ref) {
     last: Boolean(addCondition && index + 1 === conditionsNumber && maxConditionLength !== undefined && conditionsNumber === maxConditionLength)
   }), /*#__PURE__*/React.createElement(S.ConditionWrapper, null, conditionParameter && /*#__PURE__*/React.createElement(Factors, _extends({}, conditionParameter, {
     getPopupContainerOverride: getPopupContainerOverride,
-    onActivate: onActivate,
+    onActivate: function onActivate() {
+      return _onActivate && _onActivate(PARAMETER);
+    },
     onChangeValue: function onChangeValue(value) {
       return selectParameter(stepId, conditionId, value);
     },
     opened: stepId === currentStepId && conditionId === currentConditionId && currentField === PARAMETER
-  }))), (!conditionParameter || (conditionParameter == null ? void 0 : conditionParameter.value)) && conditionOperator && /*#__PURE__*/React.createElement(S.ConditionWrapper, null, /*#__PURE__*/React.createElement(Operators, _extends({}, conditionOperator, {
+  }))), (!conditionParameter || (conditionParameter == null ? void 0 : conditionParameter.value) && (conditionParameter == null ? void 0 : conditionParameter.value).name !== '') && conditionOperator && /*#__PURE__*/React.createElement(S.ConditionWrapper, null, /*#__PURE__*/React.createElement(Operators, _extends({}, conditionOperator, {
     getPopupContainerOverride: getPopupContainerOverride,
-    onActivate: onActivate,
+    onActivate: function onActivate() {
+      return _onActivate && _onActivate(OPERATOR);
+    },
     onChange: function onChange(value) {
       return selectOperator(stepId, conditionId, value);
     },
     opened: stepId === currentStepId && conditionId === currentConditionId && currentField === OPERATOR
-  }))), (conditionOperator == null ? void 0 : conditionOperator.value) && /*#__PURE__*/React.createElement(S.ConditionWrapper, null, /*#__PURE__*/React.createElement(React.Fragment, null, (conditionFactor == null ? void 0 : conditionFactor.withCustomFactor) || /*#__PURE__*/React.createElement(Factors, _extends({}, conditionFactor, {
+  }))), conditionFactor !== undefined && (conditionOperator == null ? void 0 : conditionOperator.value) && (conditionFactor == null ? void 0 : conditionFactor.availableFactorTypes) !== null && /*#__PURE__*/React.createElement(S.ConditionWrapper, null, /*#__PURE__*/React.createElement(React.Fragment, null, (conditionFactor == null ? void 0 : conditionFactor.withCustomFactor) || /*#__PURE__*/React.createElement(Factors, _extends({}, conditionFactor, {
     getPopupContainerOverride: getPopupContainerOverride,
-    onActivate: onActivate,
+    onActivate: function onActivate() {
+      return _onActivate && _onActivate(FACTOR);
+    },
     setSelectedFactorType: function setSelectedFactorType(factorType) {
       return setStepConditionFactorType(stepId, conditionId, factorType);
     },

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

@@ -5,7 +5,7 @@ import { ConditionProps, ConditionTexts } from '../../Condition.types';
 export declare type ConditionRowProps = {
     index: number;
     hasPriority?: boolean;
-    onActivate?: () => void;
+    onActivate?: (fieldType: string) => void;
     conditionId: React.ReactText;
     addCondition: ConditionProps['addCondition'];
     conditionParameter: FactorsProps;

package/dist/ConditionStep/ConditionStep.js

@@ -39,7 +39,8 @@ export var ConditionStep = function ConditionStep(_ref) {
       hasPriority = _ref.hasPriority,
       currentStepId = _ref.currentStepId,
       currentConditionId = _ref.currentConditionId,
-      currentField = _ref.currentField;
+      currentField = _ref.currentField,
+      setCurrentField = _ref.setCurrentField;
 
   var _React$useState = React.useState(null),
       activeConditionId = _React$useState[0],
@@ -123,9 +124,10 @@ export var ConditionStep = function ConditionStep(_ref) {
     var _step$context2;
 
     var handleActivation = function handleActivation(conditionId) {
-      return function () {
+      return function (fieldType) {
         setActiveConditionId(conditionId);
         onActivate && onActivate();
+        setCurrentField && setCurrentField(fieldType);
       };
     };
 
@@ -157,7 +159,7 @@ export var ConditionStep = function ConditionStep(_ref) {
       texts: text,
       stepType: (_step$context2 = step.context) == null ? void 0 : _step$context2.type
     });
-  }, [getPopupContainerOverride, addCondition, currentConditionId, currentField, currentStepId, maxConditionsLength, minConditionsLength, removeCondition, selectOperator, selectParameter, setStepConditionFactorType, setStepConditionFactorValue, step.conditions.length, step.context, step.id, text, onActivate, activeConditionId, hasPriority]);
+  }, [step.id, step.conditions.length, step.context, hasPriority, activeConditionId, addCondition, removeCondition, minConditionsLength, maxConditionsLength, currentStepId, currentConditionId, currentField, selectParameter, selectOperator, getPopupContainerOverride, setStepConditionFactorType, setStepConditionFactorValue, text, onActivate, setCurrentField]);
   return /*#__PURE__*/React.createElement(S.Step, {
     key: step.id,
     id: "condition-step-" + step.id,

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

@@ -28,4 +28,5 @@ export declare type ConditionStepProps = {
     currentStepId: React.ReactText;
     currentConditionId: React.ReactText;
     currentField: React.ReactText;
+    setCurrentField: (field: string) => void;
 };

package/dist/ConditionStep/StepHeader/StepHeader.js

@@ -10,13 +10,12 @@ export var StepHeader = function StepHeader(_ref) {
   var stepName = _ref.stepName,
       stepId = _ref.stepId,
       texts = _ref.texts,
-      _ref$updateStepName = _ref.updateStepName,
-      updateStepName = _ref$updateStepName === void 0 ? NOOP : _ref$updateStepName,
+      updateStepName = _ref.updateStepName,
       duplicateStep = _ref.duplicateStep,
       removeStep = _ref.removeStep,
       index = _ref.index,
       draggableEnabled = _ref.draggableEnabled;
-  var onChangeNameDebounce = React.useCallback(debounce(updateStepName, 300), [updateStepName]);
+  var onChangeNameDebounce = React.useCallback(debounce(updateStepName || NOOP, 300), [updateStepName]);
 
   var _React$useState = React.useState(stepName),
       localName = _React$useState[0],
@@ -29,7 +28,14 @@ export var StepHeader = function StepHeader(_ref) {
     setLocalName(event.target.value);
     onChangeNameDebounce(stepId, event.target.value);
   }, [onChangeNameDebounce, stepId]);
-  return /*#__PURE__*/React.createElement(S.StepHeader, null, updateStepName && /*#__PURE__*/React.createElement(S.StepName, null, index + 1 + ".", ' ', /*#__PURE__*/React.createElement(InlineEdit, {
+  return /*#__PURE__*/React.createElement(S.StepHeader, {
+    className: "step-drag-handler",
+    draggable: draggableEnabled
+  }, /*#__PURE__*/React.createElement(S.LeftSide, null, draggableEnabled && /*#__PURE__*/React.createElement(S.DragIcon, {
+    component: /*#__PURE__*/React.createElement(DragHandleM, null)
+  }), updateStepName && /*#__PURE__*/React.createElement(S.StepName, {
+    className: "ds-condition-step-name"
+  }, "" + (index + 1), ' ', /*#__PURE__*/React.createElement(InlineEdit, {
     size: "small",
     input: {
       value: localName,
@@ -37,12 +43,7 @@ export var StepHeader = function StepHeader(_ref) {
       placeholder: texts.stepNamePlaceholder,
       onChange: handleChangeName
     }
-  })), /*#__PURE__*/React.createElement(S.StepCruds, null, draggableEnabled && /*#__PURE__*/React.createElement(Cruds.CustomAction, {
-    icon: /*#__PURE__*/React.createElement(DragHandleM, null),
-    title: texts.moveTooltip,
-    onClick: NOOP,
-    className: "step-drag-handler"
-  }), /*#__PURE__*/React.createElement(Cruds, {
+  }))), /*#__PURE__*/React.createElement(S.StepCruds, null, /*#__PURE__*/React.createElement(Cruds, {
     onDuplicate: duplicateStep ? function () {
       return duplicateStep(stepId);
     } : undefined,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-condition",
-  "version": "0.13.10",
+  "version": "0.14.0",
   "description": "Condition UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -33,14 +33,14 @@
   "types": "dist/index.d.ts",
   "dependencies": {
     "@synerise/ds-button": "^0.17.2",
-    "@synerise/ds-context-selector": "^0.10.10",
-    "@synerise/ds-core": "^0.32.1",
+    "@synerise/ds-context-selector": "^0.11.0",
+    "@synerise/ds-core": "^0.33.0",
     "@synerise/ds-cruds": "^0.3.9",
-    "@synerise/ds-factors": "^0.11.9",
+    "@synerise/ds-factors": "^0.12.0",
     "@synerise/ds-icon": "^0.49.0",
-    "@synerise/ds-inline-edit": "^0.6.9",
-    "@synerise/ds-operators": "^0.7.9",
-    "@synerise/ds-subject": "^0.7.9",
+    "@synerise/ds-inline-edit": "^0.6.10",
+    "@synerise/ds-operators": "^0.8.0",
+    "@synerise/ds-subject": "^0.8.0",
     "@synerise/ds-tooltip": "^0.11.9",
     "@synerise/ds-utils": "^0.19.0",
     "react-sortablejs": "^6.0.0"
@@ -49,5 +49,5 @@
     "@synerise/ds-core": "*",
     "react": ">=16.9.0 < 17.0.0"
   },
-  "gitHead": "510d01309981d010c794496292be958796c0b6b6"
+  "gitHead": "5793ce09feb88b36cc8ca1923ddfcb272b889cb0"
 }