Skip to content

Commit f7ce097

Browse files
committed
feat: update documentation
Signed-off-by: Vitor Mattos <1079143+vitormattos@users.noreply.github.com>
1 parent 4299b87 commit f7ce097

1 file changed

Lines changed: 45 additions & 12 deletions

File tree

README.md

Lines changed: 45 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -13,25 +13,58 @@ A Vue 2 component for rendering PDFs with draggable and resizable element overla
1313

1414
### Props
1515

16-
| Prop | Type | Default |
17-
|------|------|---------|
18-
| `width` | String | `'100%'` |
19-
| `height` | String | `'100%'` |
20-
| `initFiles` | Array | `[]` |
21-
| `initFileNames` | Array | `[]` |
22-
| `initialScale` | Number | `1` |
23-
| `showPageFooter` | Boolean | `true` |
24-
| `hideSelectionUI` | Boolean | `false` |
25-
| `showSelectionHandles` | Boolean | `true` |
26-
| `showElementActions` | Boolean | `true` |
27-
| `pageCountFormat` | String | `'{currentPage} of {totalPages}'` |
16+
| Prop | Type | Default | Description |
17+
|------|------|---------|-------------|
18+
| `width` | String | `'100%'` | Container width |
19+
| `height` | String | `'100%'` | Container height |
20+
| `initFiles` | Array | `[]` | PDF files to load |
21+
| `initFileNames` | Array | `[]` | Names for the PDF files |
22+
| `initialScale` | Number | `1` | Initial zoom scale |
23+
| `showPageFooter` | Boolean | `true` | Show page footer with document name and page number |
24+
| `hideSelectionUI` | Boolean | `false` | Hide selection handles and actions UI |
25+
| `showSelectionHandles` | Boolean | `true` | Show resize/move handles on selected elements |
26+
| `showElementActions` | Boolean | `true` | Show action buttons on selected elements |
27+
| `pageCountFormat` | String | `'{currentPage} of {totalPages}'` | Format string for page counter |
28+
| `autoFitZoom` | Boolean | `false` | Automatically adjust zoom to fit viewport on window resize |
2829

2930
### Events
3031

3132
- `pdf-elements:end-init` - Emitted when PDF is loaded
3233

34+
### Methods
35+
36+
- `adjustZoomToFit()` - Manually trigger zoom adjustment to fit viewport (useful when calling programmatically)
37+
3338
### Slots
3439

3540
- `element-{type}` - Custom element rendering (e.g., `element-signature`)
3641
- `custom` - Fallback for elements without specific type
3742
- `actions` - Custom action buttons
43+
44+
### Usage Example
45+
46+
```vue
47+
<template>
48+
<PDFElements
49+
ref="pdfElements"
50+
:init-files="pdfFiles"
51+
:init-file-names="['document.pdf']"
52+
:auto-fit-zoom="true"
53+
@pdf-elements:end-init="onPdfLoaded"
54+
>
55+
<template #element-signature="{ object, onDelete }">
56+
<CustomSignature :data="object" @delete="onDelete" />
57+
</template>
58+
</PDFElements>
59+
</template>
60+
61+
<script>
62+
export default {
63+
methods: {
64+
onPdfLoaded() {
65+
// PDF is loaded, auto-fit zoom is active
66+
},
67+
},
68+
}
69+
</script>
70+
```

0 commit comments

Comments
 (0)