Hint - fix content position when centered

[Inbal-Tish]

Description

Hint - fix content position when centered

Changelog

Hint - fix content position when centered

Additional info

ticket 4487

[ethanshar]

@Inbal-Tish
I didn't review yet, just tried it out, this snippet still reproduce the issue

export default class PlaygroundScreen extends Component {
  state = {};
  render() {
    return (
      <View bg-grey80 flex padding-20>
        <View row center>
          <Hint visible={this.state.showHint} message={'xx'} onBackgroundPress={() => this.setState({showHint: false})}>
            <Button label="Button" onPress={() => this.setState({showHint: !this.state.showHint})}/>
          </Hint>
        </View>
      </View>
    );
  }
}

[Inbal-Tish]

@Inbal-Tish I didn't review yet, just tried it out, this snippet still reproduce the issue

export default class PlaygroundScreen extends Component {
  state = {};
  render() {
    return (
      <View bg-grey80 flex padding-20>
        <View row center>
          <Hint visible={this.state.showHint} message={'xx'} onBackgroundPress={() => this.setState({showHint: false})}>
            <Button label="Button" onPress={() => this.setState({showHint: !this.state.showHint})}/>
          </Hint>
        </View>
      </View>
    );
  }
}

Looks like it related to the target and the hint widths

[ethanshar]

Looks like it related to the target and the hint widths

I see now that I copied a wrong reproduce snippet 🤦

This code still doesn't work

export default class PlaygroundScreen extends Component {
  state = {};
  render() {
    return (
      <View bg-grey80 flex padding-20>
        <View row center>
          <Text>SOME TEXT</Text>
          <Hint
            visible={this.state.showHint}
            message={'XXX'}
            onBackgroundPress={() => this.setState({showHint: false})}
          >
            <Button label="Button" onPress={() => this.setState({showHint: !this.state.showHint})}/>
          </Hint>
        </View>
      </View>
    );
  }
}