@indietabletop/appkit 3.2.0-0 → 3.2.0-2

package/dist/client.d.ts

@@ -1,5 +1,5 @@
-import { Failure, Success } from "@indietabletop/appkit/async-op";
 import { type Infer, Struct } from "superstruct";
+import { Failure, Success } from "./async-op.js";
 import type { CurrentUser, FailurePayload, SessionInfo } from "./types.js";
 export declare class IndieTabletopClient {
     origin: string;

package/dist/client.js

@@ -1,5 +1,5 @@
-import { Failure, Success } from "@indietabletop/appkit/async-op";
 import { mask, object, string, Struct } from "superstruct";
+import { Failure, Success } from "./async-op.js";
 import { currentUser, sessionInfo } from "./structs.js";
 export class IndieTabletopClient {
     constructor(props) {

package/dist/index.d.ts

@@ -2,6 +2,7 @@ export * from "./ExternalLink.tsx";
 export * from "./FormSubmitButton.tsx";
 export * from "./FullscreenDismissBlocker.tsx";
 export * from "./IndieTabletopClubSymbol.tsx";
+export * from "./Letterhead.tsx";
 export * from "./LetterheadFooter.tsx";
 export * from "./LoadingIndicator.tsx";
 export * from "./ServiceWorkerHandler.tsx";

package/dist/index.js

@@ -3,6 +3,7 @@ export * from "./ExternalLink.js";
 export * from "./FormSubmitButton.js";
 export * from "./FullscreenDismissBlocker.js";
 export * from "./IndieTabletopClubSymbol.js";
+export * from "./Letterhead.js";
 export * from "./LetterheadFooter.js";
 export * from "./LoadingIndicator.js";
 export * from "./ServiceWorkerHandler.js";

package/dist/use-form.d.ts

@@ -1,5 +1,5 @@
 import { type FormStoreState } from "@ariakit/react";
-import { Failure, Success } from "@indietabletop/appkit/async-op";
+import { Failure, Success } from "./async-op.ts";
 type Validator<T> = (value: T) => string | null;
 type MaybePromise<T> = T | Promise<T>;
 export declare function useForm<T extends object, R>(props: {

package/dist/use-form.js

@@ -1,6 +1,6 @@
 import { useFormStore } from "@ariakit/react";
-import { Failure, Success } from "@indietabletop/appkit/async-op";
 import { useState } from "react";
+import { Failure, Success } from "./async-op.js";
 export function useForm(props) {
     const submitName = "submit";
     const [op, setOp] = useState(null);

package/package.json

@@ -1,18 +1,19 @@
 {
   "name": "@indietabletop/appkit",
-  "version": "3.2.0-0",
+  "version": "3.2.0-2",
   "description": "A collection of modules used in apps built by Indie Tabletop Club",
   "private": false,
   "type": "module",
   "scripts": {
-    "release": "npm run build && np",
+    "release": "np",
     "build": "tsc",
     "dev": "tsc --watch",
-    "test": "vitest"
+    "test": "vitest",
+    "prepare": "npm run build"
   },
   "exports": {
-    ".": "./dist/index.js",
-    "./*": "./dist/*.js"
+    ".": "./lib/index.ts",
+    "./*": "./lib/*"
   },
   "files": [
     "/dist"

package/dist/IndieTabletopClubFooter.d.ts

@@ -1 +0,0 @@
-export declare function IndieTabletopClubFooter(): import("react/jsx-runtime").JSX.Element;

package/dist/IndieTabletopClubFooter.js

@@ -1,17 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { interactiveText } from "./common.css.js";
-import { ExternalLink } from "./external-link.js";
-import { IndieTabletopClubLogo } from "./IndieTabletopClubLogo.js";
-export function IndieTabletopClubFooter() {
-    return (_jsxs("div", { style: {
-            textAlign: "center",
-            paddingBlockStart: "2rem",
-            borderBlockStart: "1px solid #ececec",
-            marginBlockStart: "3rem",
-        }, children: [_jsx(IndieTabletopClubLogo, { style: { margin: "0 auto 1.125rem" } }), _jsxs("p", { style: {
-                    margin: "0 auto",
-                    maxInlineSize: "25rem",
-                    fontSize: "0.875rem",
-                    lineHeight: "1.25rem",
-                }, children: ["Indie Tabletop Club supports independent game creators with high-quality digital tools.", " ", _jsx(ExternalLink, { href: "https://indietabletop.club", className: interactiveText, children: "Learn more" }), "."] })] }));
-}

package/dist/defineNetlifyConfig.d.ts

@@ -1,34 +0,0 @@
-import type { ConfigEnv, PluginOption, UserConfig } from "vite";
-export declare function defineNetlifyConfig(props: {
-    /**
-     * The server port number.
-     *
-     * Game apps start from 8000, automation apps from 9000. So far, we got:
-     *
-     * - API: 8000
-     * - Hobgoblin: 8001
-     * - Eternol: 8002
-     * - Gregbot: 9000
-     */
-    port: number;
-    /**
-     * By default, react and vanilla extract are always configured.
-     */
-    additionalPlugins?: PluginOption[];
-    /**
-     * Can be used to import from `@` at the path specified here. Has to match
-     * tsconfig > compilerOptions > paths.
-     *
-     * Do not use this, just use relative imports.
-     *
-     * @deprecated
-     */
-    resolveAlias?: string;
-    /**
-     * Determines whether input is "/index.html", or "index.html" or
-     * "/src/main.tsx" depnending on command.
-     *
-     * This is useful when using pre-rendered HTML as input.
-     */
-    conditionalInput?: boolean;
-}): ({ command }: ConfigEnv) => UserConfig;

package/dist/defineNetlifyConfig.js

@@ -1,35 +0,0 @@
-import { vanillaExtractPlugin as vanilla } from "@vanilla-extract/vite-plugin";
-import react from "@vitejs/plugin-react";
-export function defineNetlifyConfig(props) {
-    const { additionalPlugins = [], conditionalInput = false, resolveAlias, } = props;
-    return function configureVite({ command }) {
-        return {
-            define: {
-                // These vars are supplied by Netlify
-                BRANCH: JSON.stringify(process.env.BRANCH),
-                COMMIT_SHORTCODE: JSON.stringify(process.env.COMMIT_REF?.slice(0, 7)),
-            },
-            plugins: [react(), vanilla(), ...additionalPlugins],
-            esbuild: {
-                target: "es2022",
-            },
-            server: {
-                port: props.port,
-            },
-            resolve: {
-                alias: resolveAlias ? { "@": resolveAlias } : undefined,
-            },
-            build: {
-                sourcemap: true,
-                manifest: true,
-                rollupOptions: {
-                    // During `build`, we want to only deal with JS files. Production HTML
-                    // entrypoint is generated via the `build:entrypoint` package script.
-                    input: conditionalInput && command === "build"
-                        ? "/src/main.tsx"
-                        : "/index.html",
-                },
-            },
-        };
-    };
-}

package/dist/external-link.d.ts

@@ -1,4 +0,0 @@
-import type { AnchorHTMLAttributes } from "react";
-type ExternalLinkProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "rel" | "target">;
-export declare function ExternalLink(props: ExternalLinkProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/external-link.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export function ExternalLink(props) {
-    return _jsx("a", { ...props, target: "_blank", rel: "noreferrer noopener" });
-}

package/dist/form-submit-button.d.ts

@@ -1,7 +0,0 @@
-import { type FormSubmitProps } from "@ariakit/react";
-import type { ReactNode } from "react";
-export type FormSubmitButtonProps = FormSubmitProps & {
-    children: ReactNode;
-    loading: ReactNode;
-};
-export declare function FormSubmitButton(props: FormSubmitButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/form-submit-button.js

@@ -1,16 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FormSubmit, useFormContext, useStoreState, } from "@ariakit/react";
-import { fadeIn } from "./animations.css.js";
-export function FormSubmitButton(props) {
-    const { children, className, style, loading, ...submitProps } = props;
-    const form = useFormContext();
-    const isSubmitting = useStoreState(form, (s) => s?.submitting);
-    return (_jsxs(FormSubmit, { ...submitProps, className: className, style: { position: "relative", ...style }, children: [_jsx("span", { style: { opacity: isSubmitting ? 0 : 1, transition: "200ms opacity" }, children: children }), isSubmitting && (_jsx("div", { style: {
-                    display: "flex",
-                    position: "absolute",
-                    inset: "0",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    animation: `${fadeIn} 200ms 200ms both`,
-                }, children: loading }))] }));
-}

package/dist/fullscreen-dismiss-blocker.d.ts

@@ -1,5 +0,0 @@
-/**
- * This component prevents the default MacOS behaviour where a fullscreen window
- * gets minimised by pressing Escape.
- */
-export declare function FullscreenDismissBlocker(): null;

package/dist/fullscreen-dismiss-blocker.js

@@ -1,19 +0,0 @@
-import { useEffect } from "react";
-function handleKeydown(event) {
-    if (event.key === "Escape") {
-        event.preventDefault();
-    }
-}
-/**
- * This component prevents the default MacOS behaviour where a fullscreen window
- * gets minimised by pressing Escape.
- */
-export function FullscreenDismissBlocker() {
-    useEffect(() => {
-        window.addEventListener("keydown", handleKeydown);
-        return () => {
-            window.removeEventListener("keydown", handleKeydown);
-        };
-    }, []);
-    return null;
-}

package/dist/service-worker-handler.d.ts

@@ -1,11 +0,0 @@
-import { type ReactNode } from "react";
-/**
- * This component handles the installation of a service worker.
- *
- * Currently it doesn't do much, but, eventually, it should provide context
- * to nested components communicating the status of the service worker installation.
- */
-export declare function ServiceWorkerHandler(props: {
-    children: ReactNode;
-    path: string;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/service-worker-handler.js

@@ -1,42 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import { useEffect } from "react";
-/**
- * This component handles the installation of a service worker.
- *
- * Currently it doesn't do much, but, eventually, it should provide context
- * to nested components communicating the status of the service worker installation.
- */
-export function ServiceWorkerHandler(props) {
-    useEffect(() => {
-        async function registerWorker() {
-            // Although modern browsers all support service workers, native app's
-            // web views (eg. the Facebook app's embedded browsers) do not.
-            if ("serviceWorker" in navigator) {
-                try {
-                    const registration = await navigator.serviceWorker.register(props.path);
-                    console.info("Service worker registration obtained.");
-                    registration.addEventListener("updatefound", () => {
-                        const worker = registration.installing;
-                        console.info("Installing new service worker.");
-                        worker?.addEventListener("statechange", ({ target }) => {
-                            if (target instanceof ServiceWorker) {
-                                console.info(`Service worker state changed: '${target.state}'.`);
-                            }
-                        });
-                    });
-                }
-                catch (error) {
-                    // In rare cases, service worker installation can fail, e.g. due to network
-                    // connectivity. There is no need to report the error as there is nothing
-                    // that can be done to prevent this from occassionally happening.
-                    console.error(error);
-                }
-            }
-        }
-        void registerWorker();
-        // Note that it is not necessary to 'cleanup' the registration in
-        // the useEffect hook. Calling register() multiple times is a no-op.
-        // See https://web.dev/articles/service-workers-registration#subsequent_visits
-    }, [props.path]);
-    return _jsx(_Fragment, { children: props.children });
-}