Auto Fill Templates Component

The Auto Fill Templates Component is a modal window that allows users to automatically fill structured medical templates from free-form dictated text using AI. This high-level component is designed to be integrated quickly and easily in your web application.

Getting started

1. Import resources

Install the SDK via npm:

npm install @invox-medical-npm/invox-dictation

Then import AutoFillTemplatesDialog as a named export:

import INVOX, { AutoFillTemplatesDialog } from "@invox-medical-npm/invox-dictation";

Component styles are auto-injected at runtime — no separate CSS import needed.

2. Initialize component

1. Create a container in the DOM. You can use the same container for all dialog components:

   <div id="invox-dialogs-container"></div>
   

   Copy to clipboard
2. Create the component:

   const autoFillTemplatesDialog = AutoFillTemplatesDialog.create("invox-dialogs-container");
   

   Copy to clipboard

3. Show component

autoFillTemplatesDialog.show();

4. Hide component (optional)

The dialog can also be closed by pressing ESC or clicking the Close button.

autoFillTemplatesDialog.hide();

5. Remove component (optional)

autoFillTemplatesDialog.remove();

Public methods

create

const autoFillTemplatesDialog = AutoFillTemplatesDialog.create("invox-dialogs-container");

show

autoFillTemplatesDialog.show();

hide

autoFillTemplatesDialog.hide();

remove

autoFillTemplatesDialog.remove();

Customize design

Uses the same auto-injected CSS variables as the Dictionary Component.

How to use

The Auto Fill Templates dialog allows users to select a medical template and have the AI automatically extract relevant information from their dictated text to fill in the template fields.