the-couch / rimp

clientside mailchimp subscriptions

rimp

Small library for handling mailchimp subscriptions on the client side in react. This is not a documented solution within mailchimp however it does still work

Setup

You will need to grab the naked post url from the mailchimp embed form code

Usage

import Rimp from 'rimp'

<Rimp
  buttonValue={`submit`}
  buttonStyles={`btn`}
  containerStyles={`newsletter__form`}
  completeMessage={`Thanks, we'll send you an email to confirm!`}
  mailChimpUrl="//url.us10.list-manage.com/subscribe/post?u=user&amp;id=list"
 />

Configurable options:

buttonValue: 'submit',
buttonStyles: 'button',
placeholder: 'enter your email address',
formWrapper: 'flex flex-justify-between flex-align-center',
containerStyles: 'newsletter__form',
completeMessage: 'Thanks for subscribing',
helpText: 'Please provide a valid email address',
labelText: 'Email address:',
labelStyles: 'newsletter__form--label',
formID: 'newsletter_email__input',
showLabel: false,
showError: true,
emailAddress: '',
mailChimpUrl: null

MIT License

rimp's Issues

completeMessage prop does not work

Hi, thanks for releasing this package - seems to be the best and easiest Mailchimp subscription library out there.

So far the only issue I've had is that the completeMessage prop is not working, and I always get the 'You’ve been added to our list.' message after submitting the form.

Looking at the package's code in my node_modules folder, it looks like the updates for 'allow for a configurable complete message' are not reflected on the package published on NPM.

I'm not too familiar with NPM publishing/updating, so this could be user error on my part. But just wanted to check in here to see if this has happened for anyone else and/or if there is a fix.

Thanks!

Callback function needed

I don't see it in the documentation, but I think it would be really helpful to have a callback function in order to perform actions on submit. My use case is needing to fire an analytics event when someone submits the form.

Add option for label on input field.

Great project, thanks for publishing it!

I would like to add an option for a label within the component so that it better passes accessibility best practices as defined by deque/axe ( https://dequeuniversity.com/rules/axe/2.2/label?application=lighthouse )

This is partially for my own self-interest -- the only item that was dinged on my own accessibility audit was the lack of form label on the Rimp form component.

I haven't contributed much to open source on Github but if you think this would add some value I could take a stab at it!

Thanks!

can't change the completeMessage text

Hi,

First of all great job! I Love the simplicity of this.

For some reason my completeMessage is You’ve been added to our list. X instead of the text I defined as completeMessage={"Thanks for subscribing!"}

Any idea how this is possible?

Modify the name attribute

Is there a way to modify the input's name attribute? I tried using name={'Email'} as a prop but it doesn't seem to pass through to the component. I've submitted a pull request to address. #7