Overriding style

Since https://github.com/gcanti/tcomb-form-native/commit/869dd50b2aca4c581c0a964edc251bd94815e964, I can’t properly override tcomb-form-native style.

• tcomb-form-native v0.6.1
• react-native v0.31.0

Here is how I override tcomb Form style:

import {stylesheet} from './style';
t.form.Form.stylesheet = stylesheet;

Here is my code:

  render() {
    return = (
      <t.form.Form
        {...this.props}  // props does not contain any stylesheet
        context={{
          onTiming: this.onTiming,
          onLocation: this.onLocation,
          getTimeSpend: this._getTimeSpend
        }}
        onChange={this.onChange}
        options={this.state.options}
        ref="form"
      />
    );
  }

In my custom component:

export class Group extends t.form.Struct {
  getTemplate() {
    return (locals) => {
      var stylesheet = locals.stylesheet;  // unaware of anything that has been overriden
      var groupStyle = stylesheet.group.normal;

      return (<View style={groupStyle}>
        {t.form.Form.templates.struct(locals)}
      </View>);
    };
  }
}

[jgkim]

@mxmtsk That’s because you import tcomb-form-native in other places. Take a look at index.js. You can figure it out easily.

[alvaromb]

Hi @btoueg!

Sorry, never user stylesheet override. Can you pass your stylesheet through the options object?

const options = {
  stylesheet: stylesheet,
}