Official react npm package with typescript

It would be great if we could get an official react npm package that also has typescript. I believe this would make adoption far easier and give developers more confidence. Here’s an example of a react wrapper I wrote for my app.

"use client";

import Script from "next/script";
import React, {
createContext,
useCallback,
useContext,
useEffect,
useState,
} from "react";

interface FeaturebaseContextType {
isLoaded: boolean;
show: (pageName?: "home" | "messages" | "changelog" | "help") => void;
showNewMessage: (initialText?: string) => void;
showArticle: (articleId: string) => void;
showChangelog: (entryId?: string) => void;
showConversation: (conversationId: string) => void;
hide: () => void;
toggle: () => void;
isVisible: boolean;
setTheme: (theme: "light" | "dark") => void;
setLanguage: (language: string) => void;
}

const FeaturebaseContext = createContext(null);

interface FeaturebaseProviderProps {
children: React.ReactNode;
appId: string;
theme?: "light" | "dark";
language?: string;
onShow?: () => void;
onHide?: () => void;
onUnreadCountChange?: (unreadCount: number) => void;
}

export const FeaturebaseProvider: React.FC = ({
children,
appId,
theme = "light",
language = "en",
onShow,
onHide,
onUnreadCountChange,
}) => {
const [isLoaded, setIsLoaded] = useState(false);
const [isVisible, setIsVisible] = useState(false);

useEffect(() => {
const win = window as any;

// Initialize Featurebase if it doesn't exist
if (typeof win.Featurebase !== "function") {
win.Featurebase = function () {
(win.Featurebase.q = win.Featurebase.q || []).push(arguments);
};
}

// Boot Featurebase messenger with configuration
win.Featurebase("boot", {
appId,
theme,
language,
hide: true,
});

win.Featurebase("onShow", () => {
setIsVisible(true);
onShow?.();
});

win.Featurebase("onHide", () => {
setIsVisible(false);
onHide?.();
});

win.Featurebase("onUnreadCountChange", (unreadCount: number) => {
onUnreadCountChange?.(unreadCount);
});

setIsLoaded(true);
}, [appId, theme, language, onShow, onHide, onUnreadCountChange]);

const show = useCallback(
(pageName: "home" | "messages" | "changelog" | "help" | undefined) => {
const win = window as any;
win.Featurebase?.("show", pageName);
},
[]
);

const showNewMessage = useCallback((initialText: string | undefined) => {
const win = window as any;
win.Featurebase?.("showNewMessage", initialText);
}, []);

const showArticle = useCallback((articleId: string) => {
const win = window as any;
win.Featurebase?.("showArticle", articleId);
}, []);

const showChangelog = useCallback((entryId: string | undefined) => {
const win = window as any;
win.Featurebase?.("showChangelog", entryId);
}, []);

const showConversation = useCallback((conversationId: string) => {
const win = window as any;
win.Featurebase?.("showConversation", conversationId);
}, []);

const hide = useCallback(() => {
const win = window as any;
win.Featurebase?.("hide");
}, []);

const toggle = useCallback(() => {
const win = window as any;
win.Featurebase?.("toggle");
}, []);

const setTheme = useCallback((theme: "light" | "dark") => {
const win = window as any;
win.Featurebase?.("setTheme", theme);
}, []);

const setLanguage = useCallback((language: string) => {
const win = window as any;
win.Featurebase?.("setLanguage", language);
}, []);

return (