titleWrapperStyle / Modal Form with Inputs

[aboe026]

Problem description

I'm trying to create a modal with form inputs like so:

I'm using the ContentDialog currently:

<ContentDialog
  className='dialog'
  defaultShow={visible}
  statusBarTitle={'Add Visit'}
  showCloseButton={true}
  primaryButtonText={'Add'}
  secondaryButtonText={'Close'}
  contentNode={
    <div>
      <div>
        <span>Country</span>
        <TextBox />
      </div>
      <div>
        <span>State</span>
        <TextBox />
      </div>
      <div>
        <span>City</span>
        <TextBox />
      </div>
      <div>
        <span>Start</span>
        <CalendarDatePicker />
      </div>
      <div>
        <span>End</span>
        <CalendarDatePicker />
      </div>
    </div>
  }
/>

but that leaves a massive gap where the title property should go. Am I using the correct component? If so, could i get titleWrapperStyle exposed as a property on ContentDialog so i can set display: none; on it.

Link to minimal working code that reproduces the issue

see above

Versions

• React-UWP: 1.1.9
• React: 16.3.2
• Browser: Chrome 67.0.3396.87