Forms & Tasks Designerπ π§¨
Elements
File Viewer
3 min
the file viewer element provides an inline or modal document preview experience directly within a form rather than forcing users to download a file to inspect it, the file viewer renders the document in place β supporting file types like pdf β with customizable messaging for loading, empty, and error states the src attribute accepts a url, base64 string, or file reference, making it easy to display files uploaded earlier in the same form, documents retrieved from a process, or static reference materials the viewer can render inline (embedded directly on the form surface) or in a modal popup β giving you control over how much space the preview consumes key use cases β’ displaying a contract or policy pdf for the user to review before signing or approving β’ showing a document generated by a procesio process (e g , a quote or invoice) for review β’ previewing a file immediately after it is uploaded in a file upload element β’ embedding reference materials (sops, specifications) alongside the form fields that reference them β’ using modal mode to keep the form layout compact while still offering a full screen view runtime api β attributes in procesio forms all attributes below are accessible and modifiable at runtime via the element's data model in procesio forms api name description type default notes label display label for the file viewer string β β tooltip help text shown alongside the label string β β visible controls element visibility boolean true β src file source β url, base64 string, or file reference string|file β updatable at runtime loadingviewmessage message shown while the file is loading string loading β openviewmessage message shown as a prompt to open the viewer string click to open β emptyviewmessage message shown when no file source is set string field source not set β failedviewmessage error message shown if loading fails string file is invalid β allowedfiletypes permitted file types for display string\[] pdf β viewertype how the viewer is presented string β inline, modal name unique element name string β β id unique element id string β β for support, please join our https //discord com/invite/cebukgjefv for further assistance and support
