@pantherpdf/cloud-editor-angular
TypeScript icon, indicating that this package has built-in type declarations

1.0.0-beta.1 • Public • Published

PantherPDF Cloud Editor Angular component

PantherPDF is a report editor and PDF generator service for creating customized PDF reports.

This package is a thin wrapper around a cloud based editor for simplified integration into Angular apps. There is also a React and Vue wrapper.

Underlying editor is open source and available here.

Installation

npm install --save @pantherpdf/cloud-editor-angular

Example using reportSecret:

Report data is stored on PantherPDF database.

import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { PantherpdfCloudEditorComponent } from '@pantherpdf/cloud-editor-angular';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [
    PantherpdfCloudEditorComponent,
    CommonModule,
  ],
  template: `
    <pantherpdf-cloud-editor
      [reportSecret]="reportSecret"
    >
    </pantherpdf-cloud-editor>
  `,
  styles: [
    ':host pantherpdf-cloud-editor ::ng-deep iframe { width: 100%; height: 100vh; }'
  ],
})
export class AppComponent {
  reportSecret = '...';
}

Example using value:

Report data is stored on customer's database.

import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { PantherpdfCloudEditorComponent, ReportCloudData } from '@pantherpdf/cloud-editor-angular';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [
    PantherpdfCloudEditorComponent,
    CommonModule,
  ],
  template: `
    <pantherpdf-cloud-editor
      [(value)]="reportValue"
      [editorKey]="editorKey"
    >
    </pantherpdf-cloud-editor>
  `,
  styles: [
    ':host pantherpdf-cloud-editor ::ng-deep iframe { width: 100%; height: 100vh; }'
  ],
})
export class AppComponent {
  editorKey: string;
  reportValue: ReportCloudData | null;

  constructor() {
    this.editorKey = '...';
    this.reportValue = null;
  }
}

Props

Parameter Description
[reportSecret] Access token for a report.
[editorKey] Access token for editor.
[lang] Editor language. Possible values: en (default, uses metric units) and en-us which uses imperial units.
[(value)] ReportCloudData from customer's database.

License

MIT

Readme

Keywords

none

Package Sidebar

Install

npm i @pantherpdf/cloud-editor-angular

Weekly Downloads

1

Version

1.0.0-beta.1

License

none

Unpacked Size

65.7 kB

Total Files

16

Last publish

Collaborators

  • ibanic