revolunet / react-mailchimp-subscribe

React subscribe form for Mailchimp.
https://revolunet.github.io/react-mailchimp-subscribe/
245 stars 48 forks source link

How to edit return of this in my project to add css classes and stuff. #3

Closed agustif closed 6 years ago

agustif commented 6 years ago

I've managed to hack it together diting es/index.js return's render function for this.

Example code: ` render() { const { action, messages, className, style, styles } = this.props const { status } = this.state return React.createElement( "div", { className: className, style: style }, React.createElement( "form", { action: action, method: "post", noValidate: true }, React.createElement( "div", { className: 'ui input', style: style },

      null,
      React.createElement("input", {
        ref: function ref(node) {
          return _this2.input = node;
        },
        type: "name",
        defaultValue: "",
        name: "NAME",
        required: true,
        placeholder: messages.namePlaceholder
      }),
      React.createElement("input", {
        ref: function ref(node) {
          return _this2.input = node;
        },
        type: "email",
        defaultValue: "",
        name: "EMAIL",
        required: true,
        placeholder: messages.inputPlaceholder
      }),

      React.createElement(
        "button",
        {
          className: 'ui primary button',
          role: 'button',
          attached: 'left',
          disabled: this.state.status === "sending" || this.state.status === "success",
          onClick: this.onSubmit,
          type: "submit"
        },
        messages.btnLabel
      )
    ),
    status === "sending" && React.createElement("p", { style: styles.sending, dangerouslySetInnerHTML: { __html: messages.sending } }),
    status === "success" && React.createElement("p", { style: styles.success, dangerouslySetInnerHTML: { __html: messages.success } }),
    status === "error" && React.createElement("p", { style: styles.error, dangerouslySetInnerHTML: { __html: messages.error } })
  )
);

}; ` How should I approach this if I want the code to live in my project, not the package, or is this something PR worthy?

revolunet commented 6 years ago

ATM, the Form component takes className and style props