Hint - fix anchor position for x = 0 (#2556)

Author: Inbal-Tish

src/components/hint/index.tsx

@@ -291,7 +291,7 @@ class Hint extends Component<HintProps, HintState> {
   }
 
   getTargetPositionOnScreen() {
-    if (this.targetLayout?.x && this.targetLayout?.width) {
+    if (this.targetLayout?.x !== undefined && this.targetLayout?.width) {
       const targetMidPosition = this.targetLayout.x + this.targetLayout.width / 2;
 
       if (targetMidPosition > this.containerWidth * (2 / 3)) {
@@ -314,7 +314,7 @@ class Hint extends Component<HintProps, HintState> {
     const {position} = this.props;
     const hintPositionStyle: HintPositionStyle = {alignItems: 'center'};
 
-    if (this.targetLayout?.x) {
+    if (this.targetLayout?.x !== undefined) {
       hintPositionStyle.left = -this.targetLayout.x;
     }
 
@@ -337,7 +337,7 @@ class Hint extends Component<HintProps, HintState> {
   getHintPadding() {
     const paddings: Paddings = {paddingVertical: this.hintOffset, paddingHorizontal: this.edgeMargins};
 
-    if (this.useSideTip && this.targetLayout?.x) {
+    if (this.useSideTip && this.targetLayout?.x !== undefined) {
       const targetPositionOnScreen = this.getTargetPositionOnScreen();
       if (targetPositionOnScreen === TARGET_POSITIONS.LEFT) {
         paddings.paddingLeft = this.targetLayout.x;
@@ -376,7 +376,7 @@ class Hint extends Component<HintProps, HintState> {
 
     const layoutWidth = this.targetLayout?.width || 0;
 
-    if (this.targetLayout?.x) {
+    if (this.targetLayout?.x !== undefined) {
       const targetMidWidth = layoutWidth / 2;
       const tipMidWidth = this.tipSize.width / 2;