Typescript SDK

ForgeSDK is a TypeScript SDK for the Studio SaaS integration into your app. This SDK will let you execute deployments given a deployment id and client secret. ForgeSDK is available on npm as a typescript library.

npm install @hotg-ai/forge

A simple example of a Forge implementation in React looks like this:

import "@tensorflow/tfjs"; 
import { useState, useRef, useEffect } from "react";
import ReactDOM from "react-dom";
import Webcam from "react-webcam";
import backend from "@hotg-ai/rune-tflite";
import { Parameters, useForge, registerBackend, OutputValue } from "@hotg-ai/forge";

// Tell forge to use the tflite model handler
registerBackend(backend());

// Provide your apiKey and deploymentId from Hammer Forge Studio https://studio.hotg.ai
const forgeConfig: Parameters = {
    apiKey: "c8b2fa8916040a0daea179b3c2a55edfa8d415c2",
    deploymentId: "bd919ee2-e04f-4808-bf15-0b392adc10c5" 
};

// Create a React Component to use the Forge Hook
export default function App() {
    const [result, setResult] = useState<OutputValue[]>([]);
    const [image, setImage] = useState<string | undefined>();
    const forge = useForge(forgeConfig); // useForge Hook creates a state and a function to execute a deployment
    const webcamRef = useRef<Webcam | null>(null);

    // We want to re-run the prediction every time our image or the forge object
    // updates.
    useEffect(() => {
        if (image && forge.state === "loaded") {
            const img: HTMLImageElement = new Image();

            img.onload = () => {
                try {
                    const result = forge.predict({ image: [img] });
                    setResult(result);
                } catch (error) {
                    console.log(error);
                }
            }
            img.src = image;
        }
    }, [image, forge]);

    const videoConstraints = {
        width: 400,
        height: 300,
        facingMode: "user",
    };

    const onTimeUpdated = () => {
        if (forge.state != "loaded") {
            return;
        }
        const screenshot = webcamRef.current?.getCanvas();

        if (screenshot) {
            setImage(screenshot.toDataURL("image/jpeg"));
        }
    };

    const predictions = result.flatMap(v => [...v.elements])
        .map((p, i) => (<li key={i}>{p}</li>));

    return (
        <div className="App">
            <h1>Inception ({forge.state})</h1>
            <Webcam
                audio={false}
                height={videoConstraints.height}
                width={videoConstraints.width}
                ref={webcamRef}
                screenshotFormat="image/jpeg"
                videoConstraints={videoConstraints}
                onTimeUpdate={onTimeUpdated}
            />
            <ul>{predictions}</ul>
        </div>
    );
}

ReactDOM.render(<App />, document.getElementById('root'));

@hotg-ai/forge

Table of contents

./ts/classes

• Forge

Type aliases

• Evaluate
• ForgeHook
• Inputs
• OutputValue
• Parameters

Functions

• default
• registerBackend
• useForge

Type aliases

Evaluate

Ƭ Evaluate: (inputs: Inputs | ReadInput) => OutputValue[]

Type declaration

▸ (inputs): OutputValue[]

Parameters

Name	Type
inputs	Inputs | ReadInput

Returns

OutputValue[]

---

ForgeHook

Ƭ ForgeHook: NotLoaded | Loading | LoadingFailed | Loaded

The current state of the Forge hook.

---

Inputs

Ƭ Inputs: Object

A convenience type that can be used when all inputs are known ahead of time and you want things to "Just Work" out of the box.

Type declaration

Name	Type
audio?	AudioBuffer[]
floatImage?	HTMLImageElement[]
image?	HTMLImageElement[]
text?	string[]

---

OutputValue

Ƭ OutputValue: Object

A tensor value generated by the SERIAL output.

Type declaration

Name	Type	Description
channel	number	An integer specifying which SERIAL output this is attached to.
dimensions	number[]	The tensor's dimensions.
elements	string[] | number[]	The elements in this tensor, flattened into a single array in row-major order.
type_name	string	The Rust name for this tensor's element type.

---

Parameters

Ƭ Parameters: Object

Type declaration

Name	Type	Description
apiKey	string	An API key used to authenticate with the Forge backend.
backend?	"forge" | "enterprise"	Choose which backend to fetch Runes from. If not provided, defaults to Forge.
baseURL?	string	Override the base URL used for the interacting with the backend. This is normally only used when using the enterprise backend, routing requests through a proxy, or developing Forge itself.
deploymentId	string	The identifier of the Rune being deployed.
telemetry?	Partial<TelemetryConfig> | null	Configuration for the telemetry system. The default config is used if this field is undefined. If an object is provided, any fields that are set will override the corresponding field from the default config. Set to null to opt out of telemetry.

Functions

default

▸ default(parameters, signal?): Promise<Evaluate>

Load a Rune from the Forge backend.

Parameters

Name	Type	Description
parameters	Parameters	arguments used to specify how a Rune is loaded from the Forge backend.
signal?	AbortSignal	a signal that can be used to abort a pending download.

Returns

Promise<Evaluate>

---

registerBackend

▸ registerBackend(backend): void

Register an inference backend for a particular model type.

Parameters

Name	Type	Description
backend	ModelBackend	the backend to register.

Returns

void

---

useForge

▸ useForge(params?): ForgeHook

A React hook which will try to load a Rune from Forge in the background.

Parameters

Name	Type	Description
params?	Parameters	parameters used for loading the Rune.

Returns

ForgeHook

the loaded Rune, or an object representing the state