@labirthermal/webcomponents

Framework-independent webcomponents for displaying and analysing thermal images in the browser. They are built with Lit on top of @labirthermal/core.

Installation

Install @labirthermal/webcomponents from npm:

npm install @labirthermal/webcomponents

Usage

For direct browser use, load the IIFE build with a single <script> tag. For installation through npm, see the command above. More details are in Usage in the browser.

<script defer src="https://cdn.jsdelivr.net/npm/@labirthermal/webcomponents@2.0.4/dist/iife/embed.iife.js"></script>

<thermal-file-app thermal="/files/sequence.lrc"></thermal-file-app>

For a visual list of all elements, see the Overview of webcomponents.

Sections

Guide

• Context providers and consumers – the hierarchy of elements needed to build your own interface.
• Thermal palette – choose and share colour palettes.
• Thermal range – set and share the displayed temperature range.
• Styling and CSS variables – adapt the look of the components.

App components

Self-contained editors that do not need any context providers. See the overview of app components.

• thermal-dropin-app – lets users drop and analyse their own LRC files.
• thermal-file-app – viewer and editor of one thermal file loaded from a URL.
• thermal-group-app – viewer of a group of thermal files loaded from URLs.

UI components

General-purpose elements usable anywhere in the DOM. See the overview of UI components.

• Icons
• thermal-btn
• thermal-btn-group
• thermal-dialog
• thermal-dropdown
• thermal-app

Context providers

Elements exposing the core classes to nested context consumers. See Context providers and consumers.

• manager-provider – ThermalManager
• registry-provider – ThermalRegistry
• group-provider – ThermalGroup
• file-provider – ThermalFileInstance