Document Insights Connect widget by Plextera Studio

This widget represents a Web Component, so it works in any major framework or with no framework at all and runs in any browser supporting the Custom Elements specification.

Getting Started

To use Document Insights Connect widget on any website, inject this into your HTML:

<script type="module" src="https://unpkg.com/doc-insights-connect"></script>
<doc-insights-connect></doc-insights-connect>

This will only load the necessary scripts needed to render <doc-insights-connect />.

You can also import the script as part of your node_modules in your applications entry file:

import 'doc-insights-connect';

In a React + TypeScript environment you may need to create declarations.d.ts file in root folder for custom tag definition:

import { JSX as DocInsightsJSX } from 'doc-insights-connect';

declare global {
  namespace JSX {
    interface IntrinsicElements extends DocInsightsJSX.IntrinsicElements {}
  }
}

In Angular Web Components could be enabled in the following way:

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

@NgModule({
  ...
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
export class AppModule {}

The widget sends API requests to https://api.plextera.com. This domain should be added to Access-Control-Allow-Origin header on the server or a reverse proxy should be implemented to bypass CORS error.

Component Attributes

| Attribute | Description | Type | Default | | -------------------------- | -------------------------------------------------------------------------------- | ------------ | -------------- | | open | If true, the component is shown | boolean | | | widget-key | API token. Required | string | | | doc-id | Document ID. Required | string | | | onclose | Callback function called on window close | () => void | |