Adding Form Annotation support

[axel7083]

Since pdfkit support Form Annotation I added the logic to support them in react-pdf. I've never contributed to this project, so I am not aware if I was suppose to add this feature in the way I did. I also added the types support for TS.

See issue https://github.com/diegomura/react-pdf/issues/42

Here is an example

<Document>
    <Page>
      <View style={{backgroundColor: 'rgba(182,28,28,0.62)', width: '30%', height: '100%'}}>
          <Form>
              <FormField name="user-info" style={{flexDirection: 'column'}}>
                  <Text>FormText</Text>
                  <FormText name={'name'} value={"hello"} align={'center'} style={{height: '50px'}} password />

                  <Text>FormCombo</Text>
                  <FormCombo
                      name={'combo'}
                      select={['', 'option 1', 'option 2']}
                      value={''}
                      defaultValue={''}
                      style={{height: '20px'}}
                  />

                  <Text>FormList</Text>
                  <FormList name={'list'} select={['', 'option 1', 'option 2']} value={''} defaultValue={''} style={{height: '50px'}}/>

                  <Text>FormPushButton</Text>
                  <FormPushButton name={'bouton'} label={'push button'} style={{height: '50px'}}/>
              </FormField>
          </Form>
      </View>
    </Page>
  </Document>

And the result example.pdf

[jamesmfriedman]

I just started looking into React-PDF today and was hoping they would add form support. Your timing is impeccable.

[Ovyerus]

Hi, any chance of this being fixed up & merged in the near future? Been using react-pdf at work and we're looking to add some form stuff to our PDFs. I'm down to contribute and help get this out the door if necessary!

[axel7083]

Hello @Ovyerus sadly I do not have much time to spend on side project currently, but I would be accepting contributions!

[Ovyerus]

Sounds good!

[mdefeche]

Would love to have this feature as well !

[majid701]

@diegomura Any ETA on this. Would love this feature!

[runelk]

@axel7083 @diegomura Hi, I'll try to do some work on this onwards. I have a WIP with the latest changes and @axel7083 's commits, and have started implementing some of your proposed changes @diegomura . Should I open a new PR here for this when I'm closer to done, or is it better that I make a PR against the fork?

[axel7083]

@axel7083 @diegomura Hi, I'll try to do some work on this onwards. I have a WIP with the latest changes and @axel7083 's commits, and have started implementing some of your proposed changes @diegomura . Should I open a new PR here for this when I'm closer to done, or is it better that I make a PR against the fork?

If you make a PR against the fork I can quickly review it to commit it here.

[joneldiablo]

Its there documentation about form elements?

[kjossendal]

Any update on this? Or maybe someone could publish a fork while this is waiting to be merged? I would but I'm not familiar with the packaging/publishing process on a library like this.

[kjossendal]

Is it acceptable, when using <Form /> the way this pr does, to just ignore it's initialization if it has already been initialized? Otherwise I'm not sure where it would be done globally. For example, the below prevents broken rendering issues from misuse in pdfkit/src/mixins/acroform.js. The problem is that, with this pr implementation, <Form /> can only be used once but it cannot wrap several pages the way it is rendered. So this bypasses having to change the renderNode method.

 initForm() {
    if (this._root.data.AcroForm) {                     <------------ Add this block
      // Form is already initialized
      return this;
    }
    if (!this._font) {
      throw new Error('Must set a font before calling initForm method');
    }
    this._acroform = {
      fonts: {},
      defaultFont: this._font.name
    };
    this._acroform.fonts[this._font.id] = this._font.ref();
   ...rest of method

Edit: Sorry, not sure how to format json... Edit: Figured it out

[natterstefan]

Hi 👋 any update on this? Unfortunately I can't work on this myself at the moment, but maybe one of the community has the time and skills to do this. Thank you all!

[axel7083]

Hi 👋 any update on this? Unfortunately I can't work on this myself at the moment, but maybe one of the community has the time and skills to do this. Thank you all!

Hey, sadly I do not have time to look at this PR, which is almost 2 years old. I will close it. Everyone is welcome to take the code I wrote.