@mesob/ai-react 0.5.0

package/dist/index.d.ts

@@ -0,0 +1,30 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+type AIFormProps<TData = unknown> = {
+    code: string;
+    zodSchema: unknown;
+    /** Sent as `<Context>` to the API (user, locale, etc.). */
+    context?: string;
+    defaultPrompt?: string;
+    defaultCount?: number;
+    multiple?: boolean;
+    onGenerate?: (value: TData) => void;
+};
+
+declare function AIForm<TData = unknown>({ code, zodSchema, context, defaultPrompt, defaultCount, multiple, onGenerate, }: AIFormProps<TData>): react_jsx_runtime.JSX.Element;
+
+type AiProviderProps = {
+    api?: string;
+    children: ReactNode;
+};
+declare function AiProvider({ api, children, }: AiProviderProps): react_jsx_runtime.JSX.Element;
+declare function useApi(): {
+    hooks: any;
+};
+declare const $api: {
+    useQuery(args_0: string, args_1: string, ...args: unknown[]): any;
+    useMutation(args_0: string, args_1: string, ...args: unknown[]): any;
+};
+
+export { $api, AIForm, type AIFormProps, AiProvider, useApi };

package/dist/index.js

@@ -0,0 +1,370 @@
+"use client";
+
+// src/components/ai-form.tsx
+import {
+  Button,
+  Field,
+  FieldContent,
+  FieldError,
+  Modal,
+  NumberInput
+} from "@mesob/ui/components";
+import { IconSparkles } from "@tabler/icons-react";
+import { useId, useState } from "react";
+import * as z from "zod/v4";
+
+// src/provider.tsx
+import createFetchClient from "openapi-fetch";
+import createClient from "openapi-react-query";
+import { createContext, useContext, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+var DEFAULT_AI_API = "/api/ai";
+var AiContext = createContext({
+  api: DEFAULT_AI_API,
+  hooks: null
+});
+function AiProvider({
+  api = DEFAULT_AI_API,
+  children
+}) {
+  const fetchClient = useMemo(
+    () => createFetchClient({ baseUrl: api }),
+    [api]
+  );
+  const hooks = useMemo(() => createClient(fetchClient), [fetchClient]);
+  return /* @__PURE__ */ jsx(AiContext.Provider, { value: { api, hooks }, children });
+}
+function useApi() {
+  const context = useContext(AiContext);
+  if (!context.hooks) {
+    throw new Error("useApi must be used within AiProvider");
+  }
+  return { hooks: context.hooks };
+}
+var $api = {
+  useQuery(...args) {
+    const { hooks } = useApi();
+    return hooks.useQuery(...args);
+  },
+  useMutation(...args) {
+    const { hooks } = useApi();
+    return hooks.useMutation(...args);
+  }
+};
+
+// src/components/ai-form.tsx
+import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
+function AIForm({
+  code,
+  zodSchema,
+  context,
+  defaultPrompt,
+  defaultCount,
+  multiple = false,
+  onGenerate
+}) {
+  const [promptValue, setPromptValue] = useState(defaultPrompt ?? "");
+  const [countValue, setCountValue] = useState(
+    defaultCount ?? ""
+  );
+  const [promptError, setPromptError] = useState(null);
+  const [countError, setCountError] = useState(null);
+  const [requestError, setRequestError] = useState(null);
+  const [open, setOpen] = useState(false);
+  const aiFormMutation = $api.useMutation("post", "/ai-form");
+  const countEnabled = multiple || defaultCount !== void 0;
+  const isLoading = aiFormMutation.isPending;
+  const triggerText = multiple ? "AI Bulk Generate" : "AI Fill";
+  const modalTitle = multiple ? "AI Bulk Generate" : "AI Fill";
+  const modalSubtitle = multiple ? "Type a prompt and AI will generate multiple structured items." : "Type a prompt and AI will fill the form.";
+  const submitText = multiple ? "Bulk Generate" : "Fill Form";
+  const loadingAriaLabel = multiple ? "Generating bulk items" : "Generating Fill Form";
+  const submitAriaLabel = isLoading ? loadingAriaLabel : submitText;
+  const sparklesGradientId = useId();
+  const formId = useId();
+  const handleOpen = () => {
+    setRequestError(null);
+    setPromptValue(defaultPrompt ?? "");
+    setCountValue(defaultCount ?? "");
+    setOpen(true);
+  };
+  const handleClose = () => {
+    setOpen(false);
+  };
+  const handleValidatedSubmit = async (event) => {
+    event.preventDefault();
+    const validated = validateAiFormInput({
+      prompt: promptValue,
+      countValue,
+      countEnabled
+    });
+    if (!validated.ok) {
+      setPromptError(validated.promptError);
+      setCountError(validated.countError);
+      return;
+    }
+    if (aiFormMutation.isPending) {
+      return;
+    }
+    setPromptError(null);
+    setCountError(null);
+    setRequestError(null);
+    let result;
+    try {
+      const schema = toAiFormSchema(z.toJSONSchema(zodSchema));
+      result = await aiFormMutation.mutateAsync({
+        body: buildAiFormRequestBody({
+          code,
+          prompt: validated.prompt,
+          context,
+          count: validated.count,
+          schema
+        })
+      });
+    } catch (err) {
+      setRequestError(parseAiFormHttpError(err));
+      return;
+    }
+    if (isAiFormSuccess(result)) {
+      if (onGenerate) {
+        onGenerate(result.data);
+      }
+      resetLocalState({
+        setPromptValue,
+        setCountValue,
+        defaultPrompt,
+        defaultCount
+      });
+      setOpen(false);
+      return;
+    }
+    const failureMsg = getAiFormFailureMessage(result);
+    setRequestError(failureMsg);
+  };
+  return /* @__PURE__ */ jsx2(
+    Modal,
+    {
+      open,
+      onOpenChange: (nextOpen) => setOpen(nextOpen),
+      size: "lg",
+      title: modalTitle,
+      subtitle: modalSubtitle,
+      trigger: /* @__PURE__ */ jsxs(
+        Button,
+        {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          className: "ai-fill-button group relative overflow-visible! rounded-full gap-2 isolate",
+          onClick: handleOpen,
+          disabled: isLoading,
+          children: [
+            /* @__PURE__ */ jsx2(
+              "span",
+              {
+                "aria-hidden": "true",
+                className: "ai-fill-ring pointer-events-none absolute inset-0 z-20 opacity-0 rounded-full"
+              }
+            ),
+            /* @__PURE__ */ jsx2(
+              IconSparkles,
+              {
+                className: "relative z-10 size-4 animate-bounce transition-transform group-hover:scale-110",
+                color: `url(#${sparklesGradientId})`,
+                children: /* @__PURE__ */ jsx2("defs", { children: /* @__PURE__ */ jsxs(
+                  "linearGradient",
+                  {
+                    id: sparklesGradientId,
+                    x1: "4",
+                    y1: "4",
+                    x2: "20",
+                    y2: "20",
+                    gradientUnits: "userSpaceOnUse",
+                    children: [
+                      /* @__PURE__ */ jsx2("stop", { offset: "0%", stopColor: "#c084fc" }),
+                      /* @__PURE__ */ jsx2("stop", { offset: "50%", stopColor: "#a855f7" }),
+                      /* @__PURE__ */ jsx2("stop", { offset: "100%", stopColor: "#7c3aed" })
+                    ]
+                  }
+                ) })
+              }
+            ),
+            /* @__PURE__ */ jsx2("span", { className: "relative z-10", children: triggerText })
+          ]
+        }
+      ),
+      bodyProps: { className: "space-y-3" },
+      footer: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx2(Button, { type: "button", variant: "secondary", onClick: handleClose, children: "Cancel" }),
+        /* @__PURE__ */ jsx2(
+          Button,
+          {
+            type: "submit",
+            form: formId,
+            loading: isLoading,
+            "aria-label": submitAriaLabel,
+            children: submitText
+          }
+        )
+      ] }),
+      children: /* @__PURE__ */ jsxs("form", { id: formId, onSubmit: handleValidatedSubmit, className: "space-y-3", children: [
+        requestError ? /* @__PURE__ */ jsx2("div", { className: "rounded-xl border border-destructive/25 bg-destructive/8 px-3 py-2 text-sm text-destructive", children: requestError }) : null,
+        /* @__PURE__ */ jsx2(Field, { "data-invalid": !!promptError, children: /* @__PURE__ */ jsxs(FieldContent, { children: [
+          /* @__PURE__ */ jsx2(
+            "textarea",
+            {
+              "data-slot": "textarea",
+              name: "prompt",
+              disabled: isLoading,
+              rows: 5,
+              style: { minHeight: "8rem" },
+              "aria-label": "Generate form",
+              value: promptValue,
+              onChange: (event) => {
+                const value = event.target.value;
+                setPromptValue(value);
+                if (promptError && value.trim()) {
+                  setPromptError(null);
+                }
+              },
+              onKeyDown: (event) => {
+                if (event.key === "Enter" && !event.shiftKey) {
+                  event.preventDefault();
+                  event.currentTarget.form?.requestSubmit();
+                }
+              },
+              placeholder: "Ask AI to generate structured form values",
+              className: "cn-textarea placeholder:text-muted-foreground min-h-32 w-full resize-y border border-border/70 px-2.5 py-2 text-sm leading-6 outline-none disabled:cursor-not-allowed disabled:opacity-50"
+            }
+          ),
+          /* @__PURE__ */ jsx2(FieldError, { children: promptError })
+        ] }) }),
+        countEnabled ? /* @__PURE__ */ jsx2(Field, { "data-invalid": !!countError, children: /* @__PURE__ */ jsxs(FieldContent, { children: [
+          /* @__PURE__ */ jsxs("div", { className: "max-w-44", children: [
+            /* @__PURE__ */ jsx2(
+              "label",
+              {
+                htmlFor: `${formId}-count`,
+                className: "mb-1 block text-sm font-medium",
+                children: "How many item"
+              }
+            ),
+            /* @__PURE__ */ jsx2(
+              NumberInput,
+              {
+                id: `${formId}-count`,
+                value: countValue,
+                onChange: (next) => {
+                  setCountValue(next);
+                  if (countError) {
+                    setCountError(null);
+                  }
+                },
+                min: 1,
+                max: 100,
+                step: 1,
+                controls: true,
+                disabled: isLoading
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx2(FieldError, { children: countError })
+        ] }) }) : null
+      ] })
+    }
+  );
+}
+function validateAiFormInput(args) {
+  const trimmedPrompt = args.prompt.trim();
+  if (!trimmedPrompt) {
+    return {
+      ok: false,
+      promptError: "Prompt is required.",
+      countError: null
+    };
+  }
+  if (!args.countEnabled) {
+    return {
+      ok: true,
+      prompt: trimmedPrompt
+    };
+  }
+  const parsedCount = parseCount(args.countValue);
+  if (parsedCount == null) {
+    return {
+      ok: false,
+      promptError: null,
+      countError: "Count must be between 1 and 100."
+    };
+  }
+  return {
+    ok: true,
+    prompt: trimmedPrompt,
+    count: parsedCount
+  };
+}
+function buildAiFormRequestBody(args) {
+  const trimmedContext = args.context == null ? "" : args.context.trim();
+  const contextBody = trimmedContext.length > 0 ? { context: trimmedContext } : {};
+  const countBody = args.count == null ? {} : { count: args.count };
+  return {
+    code: args.code,
+    prompt: args.prompt,
+    ...contextBody,
+    ...countBody,
+    schema: args.schema
+  };
+}
+function resetLocalState(args) {
+  args.setPromptValue(args.defaultPrompt ?? "");
+  args.setCountValue(args.defaultCount ?? "");
+}
+function parseCount(value) {
+  const parsed = typeof value === "number" ? value : Number.parseInt(String(value).trim(), 10);
+  if (!Number.isFinite(parsed) || parsed < 1 || parsed > 100) {
+    return null;
+  }
+  return parsed;
+}
+function isAiFormSuccess(value) {
+  return typeof value === "object" && value !== null && "ok" in value && value.ok === true;
+}
+function isAiFormFailure(value) {
+  return typeof value === "object" && value !== null && "ok" in value && value.ok === false;
+}
+function getAiFormFailureMessage(result) {
+  if (!isAiFormFailure(result)) {
+    return "AI request failed.";
+  }
+  return formatAiFormErrorMessage(result.error?.code, result.error?.message);
+}
+function parseAiFormHttpError(err) {
+  if (err && typeof err === "object" && "ok" in err && err.ok === false && "error" in err) {
+    const e = err.error;
+    return formatAiFormErrorMessage(e?.code, e?.message);
+  }
+  if (err instanceof Error && err.message) {
+    return err.message;
+  }
+  return "Something went wrong. Check the AI API and try again.";
+}
+function formatAiFormErrorMessage(code, message) {
+  const msg = typeof message === "string" && message.length > 0 ? message : "";
+  if (code === "INSUFFICIENT_INPUT") {
+    return msg || "That prompt does not contain enough to fill the form.";
+  }
+  return msg || "AI request failed.";
+}
+function toAiFormSchema(schema) {
+  if (typeof schema !== "object" || schema === null || !("type" in schema) || schema.type !== "object") {
+    throw new Error('AI form schema root must be type "object".');
+  }
+  return schema;
+}
+export {
+  $api,
+  AIForm,
+  AiProvider,
+  useApi
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ai-form.tsx","../src/provider.tsx"],"sourcesContent":["'use client';\n\nimport {\n  Button,\n  Field,\n  FieldContent,\n  FieldError,\n  Modal,\n  NumberInput,\n} from '@mesob/ui/components';\nimport { IconSparkles } from '@tabler/icons-react';\nimport { type FormEvent, useId, useState } from 'react';\nimport * as z from 'zod/v4';\nimport { $api } from '../provider';\nimport type { AIFormProps } from '../types';\n\nexport type { AIFormProps } from '../types';\n\nexport function AIForm<TData = unknown>({\n  code,\n  zodSchema,\n  context,\n  defaultPrompt,\n  defaultCount,\n  multiple = false,\n  onGenerate,\n}: AIFormProps<TData>) {\n  const [promptValue, setPromptValue] = useState(defaultPrompt ?? '');\n  const [countValue, setCountValue] = useState<number | string>(\n    defaultCount ?? '',\n  );\n  const [promptError, setPromptError] = useState<string | null>(null);\n  const [countError, setCountError] = useState<string | null>(null);\n  const [requestError, setRequestError] = useState<string | null>(null);\n  const [open, setOpen] = useState(false);\n  const aiFormMutation = $api.useMutation('post', '/ai-form');\n  const countEnabled = multiple || defaultCount !== undefined;\n  const isLoading = aiFormMutation.isPending;\n  const triggerText = multiple ? 'AI Bulk Generate' : 'AI Fill';\n  const modalTitle = multiple ? 'AI Bulk Generate' : 'AI Fill';\n  const modalSubtitle = multiple\n    ? 'Type a prompt and AI will generate multiple structured items.'\n    : 'Type a prompt and AI will fill the form.';\n  const submitText = multiple ? 'Bulk Generate' : 'Fill Form';\n  const loadingAriaLabel = multiple\n    ? 'Generating bulk items'\n    : 'Generating Fill Form';\n  const submitAriaLabel = isLoading ? loadingAriaLabel : submitText;\n  const sparklesGradientId = useId();\n  const formId = useId();\n  const handleOpen = () => {\n    setRequestError(null);\n    setPromptValue(defaultPrompt ?? '');\n    setCountValue(defaultCount ?? '');\n    setOpen(true);\n  };\n  const handleClose = () => {\n    setOpen(false);\n  };\n\n  const handleValidatedSubmit = async (event: FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const validated = validateAiFormInput({\n      prompt: promptValue,\n      countValue,\n      countEnabled,\n    });\n    if (!validated.ok) {\n      setPromptError(validated.promptError);\n      setCountError(validated.countError);\n      return;\n    }\n\n    if (aiFormMutation.isPending) {\n      return;\n    }\n\n    setPromptError(null);\n    setCountError(null);\n    setRequestError(null);\n\n    let result: unknown;\n    try {\n      const schema = toAiFormSchema(z.toJSONSchema(zodSchema as never));\n      result = await aiFormMutation.mutateAsync({\n        body: buildAiFormRequestBody({\n          code,\n          prompt: validated.prompt,\n          context,\n          count: validated.count,\n          schema,\n        }),\n      });\n    } catch (err: unknown) {\n      setRequestError(parseAiFormHttpError(err));\n      return;\n    }\n    if (isAiFormSuccess(result)) {\n      if (onGenerate) {\n        onGenerate(result.data as TData);\n      }\n      resetLocalState({\n        setPromptValue,\n        setCountValue,\n        defaultPrompt,\n        defaultCount,\n      });\n      setOpen(false);\n      return;\n    }\n    const failureMsg = getAiFormFailureMessage(result);\n    setRequestError(failureMsg);\n  };\n\n  return (\n    <Modal\n      open={open}\n      onOpenChange={(nextOpen) => setOpen(nextOpen)}\n      size=\"lg\"\n      title={modalTitle}\n      subtitle={modalSubtitle}\n      trigger={\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          size=\"sm\"\n          className=\"ai-fill-button group relative overflow-visible! rounded-full gap-2 isolate\"\n          onClick={handleOpen}\n          disabled={isLoading}\n        >\n          <span\n            aria-hidden=\"true\"\n            className=\"ai-fill-ring pointer-events-none absolute inset-0 z-20 opacity-0 rounded-full\"\n          />\n          <IconSparkles\n            className=\"relative z-10 size-4 animate-bounce transition-transform group-hover:scale-110\"\n            color={`url(#${sparklesGradientId})`}\n          >\n            <defs>\n              <linearGradient\n                id={sparklesGradientId}\n                x1=\"4\"\n                y1=\"4\"\n                x2=\"20\"\n                y2=\"20\"\n                gradientUnits=\"userSpaceOnUse\"\n              >\n                <stop offset=\"0%\" stopColor=\"#c084fc\" />\n                <stop offset=\"50%\" stopColor=\"#a855f7\" />\n                <stop offset=\"100%\" stopColor=\"#7c3aed\" />\n              </linearGradient>\n            </defs>\n          </IconSparkles>\n          <span className=\"relative z-10\">{triggerText}</span>\n        </Button>\n      }\n      bodyProps={{ className: 'space-y-3' }}\n      footer={\n        <>\n          <Button type=\"button\" variant=\"secondary\" onClick={handleClose}>\n            Cancel\n          </Button>\n          <Button\n            type=\"submit\"\n            form={formId}\n            loading={isLoading}\n            aria-label={submitAriaLabel}\n          >\n            {submitText}\n          </Button>\n        </>\n      }\n    >\n      <form id={formId} onSubmit={handleValidatedSubmit} className=\"space-y-3\">\n        {requestError ? (\n          <div className=\"rounded-xl border border-destructive/25 bg-destructive/8 px-3 py-2 text-sm text-destructive\">\n            {requestError}\n          </div>\n        ) : null}\n        <Field data-invalid={!!promptError}>\n          <FieldContent>\n            <textarea\n              data-slot=\"textarea\"\n              name=\"prompt\"\n              disabled={isLoading}\n              rows={5}\n              style={{ minHeight: '8rem' }}\n              aria-label=\"Generate form\"\n              value={promptValue}\n              onChange={(event) => {\n                const value = event.target.value;\n                setPromptValue(value);\n                if (promptError && value.trim()) {\n                  setPromptError(null);\n                }\n              }}\n              onKeyDown={(event) => {\n                if (event.key === 'Enter' && !event.shiftKey) {\n                  event.preventDefault();\n                  event.currentTarget.form?.requestSubmit();\n                }\n              }}\n              placeholder=\"Ask AI to generate structured form values\"\n              className=\"cn-textarea placeholder:text-muted-foreground min-h-32 w-full resize-y border border-border/70 px-2.5 py-2 text-sm leading-6 outline-none disabled:cursor-not-allowed disabled:opacity-50\"\n            />\n            <FieldError>{promptError}</FieldError>\n          </FieldContent>\n        </Field>\n        {countEnabled ? (\n          <Field data-invalid={!!countError}>\n            <FieldContent>\n              <div className=\"max-w-44\">\n                <label\n                  htmlFor={`${formId}-count`}\n                  className=\"mb-1 block text-sm font-medium\"\n                >\n                  How many item\n                </label>\n                <NumberInput\n                  id={`${formId}-count`}\n                  value={countValue}\n                  onChange={(next) => {\n                    setCountValue(next);\n                    if (countError) {\n                      setCountError(null);\n                    }\n                  }}\n                  min={1}\n                  max={100}\n                  step={1}\n                  controls\n                  disabled={isLoading}\n                />\n              </div>\n              <FieldError>{countError}</FieldError>\n            </FieldContent>\n          </Field>\n        ) : null}\n      </form>\n    </Modal>\n  );\n}\n\nfunction validateAiFormInput(args: {\n  prompt: string;\n  countValue: number | string;\n  countEnabled: boolean;\n}):\n  | { ok: true; prompt: string; count?: number }\n  | { ok: false; promptError: string | null; countError: string | null } {\n  const trimmedPrompt = args.prompt.trim();\n  if (!trimmedPrompt) {\n    return {\n      ok: false,\n      promptError: 'Prompt is required.',\n      countError: null,\n    };\n  }\n\n  if (!args.countEnabled) {\n    return {\n      ok: true,\n      prompt: trimmedPrompt,\n    };\n  }\n\n  const parsedCount = parseCount(args.countValue);\n  if (parsedCount == null) {\n    return {\n      ok: false,\n      promptError: null,\n      countError: 'Count must be between 1 and 100.',\n    };\n  }\n\n  return {\n    ok: true,\n    prompt: trimmedPrompt,\n    count: parsedCount,\n  };\n}\n\nfunction buildAiFormRequestBody(args: {\n  code: string;\n  prompt: string;\n  context?: string;\n  count?: number;\n  schema: Record<string, unknown> & { type: 'object' };\n}) {\n  const trimmedContext = args.context == null ? '' : args.context.trim();\n  const contextBody =\n    trimmedContext.length > 0 ? { context: trimmedContext } : {};\n  const countBody = args.count == null ? {} : { count: args.count };\n\n  return {\n    code: args.code,\n    prompt: args.prompt,\n    ...contextBody,\n    ...countBody,\n    schema: args.schema,\n  };\n}\n\nfunction resetLocalState(args: {\n  setPromptValue: (v: string) => void;\n  setCountValue: (v: number | string) => void;\n  defaultPrompt?: string;\n  defaultCount?: number;\n}) {\n  args.setPromptValue(args.defaultPrompt ?? '');\n  args.setCountValue(args.defaultCount ?? '');\n}\n\nfunction parseCount(value: number | string): number | null {\n  const parsed =\n    typeof value === 'number'\n      ? value\n      : Number.parseInt(String(value).trim(), 10);\n  if (!Number.isFinite(parsed) || parsed < 1 || parsed > 100) {\n    return null;\n  }\n  return parsed;\n}\n\nfunction isAiFormSuccess(value: unknown): value is {\n  ok: true;\n  data?: unknown;\n} {\n  return (\n    typeof value === 'object' &&\n    value !== null &&\n    'ok' in value &&\n    (value as { ok?: unknown }).ok === true\n  );\n}\n\nfunction isAiFormFailure(value: unknown): value is {\n  ok: false;\n  error?: {\n    code?: string;\n    message?: string;\n  };\n} {\n  return (\n    typeof value === 'object' &&\n    value !== null &&\n    'ok' in value &&\n    (value as { ok?: unknown }).ok === false\n  );\n}\n\nfunction getAiFormFailureMessage(result: unknown): string {\n  if (!isAiFormFailure(result)) {\n    return 'AI request failed.';\n  }\n  return formatAiFormErrorMessage(result.error?.code, result.error?.message);\n}\n\n/** openapi-react-query throws the parsed JSON body on 4xx/5xx. */\nfunction parseAiFormHttpError(err: unknown): string {\n  if (\n    err &&\n    typeof err === 'object' &&\n    'ok' in err &&\n    (err as { ok: unknown }).ok === false &&\n    'error' in err\n  ) {\n    const e = (err as { error?: { code?: unknown; message?: unknown } }).error;\n    return formatAiFormErrorMessage(e?.code, e?.message);\n  }\n  if (err instanceof Error && err.message) {\n    return err.message;\n  }\n  return 'Something went wrong. Check the AI API and try again.';\n}\n\nfunction formatAiFormErrorMessage(code: unknown, message: unknown): string {\n  const msg = typeof message === 'string' && message.length > 0 ? message : '';\n  if (code === 'INSUFFICIENT_INPUT') {\n    return msg || 'That prompt does not contain enough to fill the form.';\n  }\n  return msg || 'AI request failed.';\n}\n\nfunction toAiFormSchema(\n  schema: unknown,\n): Record<string, unknown> & { type: 'object' } {\n  if (\n    typeof schema !== 'object' ||\n    schema === null ||\n    !('type' in schema) ||\n    (schema as { type?: unknown }).type !== 'object'\n  ) {\n    throw new Error('AI form schema root must be type \"object\".');\n  }\n\n  return schema as Record<string, unknown> & { type: 'object' };\n}\n","'use client';\n\nimport createFetchClient from 'openapi-fetch';\nimport createClient from 'openapi-react-query';\nimport { createContext, type ReactNode, useContext, useMemo } from 'react';\nimport type { paths } from './data/openapi';\n\ntype AiContextValue = {\n  api: string;\n  // biome-ignore lint/suspicious/noExplicitAny: openapi hooks\n  hooks: any;\n};\n\nconst DEFAULT_AI_API = '/api/ai';\nlet hasWarnedFallbackApi = false;\n\nconst AiContext = createContext<AiContextValue>({\n  api: DEFAULT_AI_API,\n  hooks: null,\n});\n\ntype AiProviderProps = {\n  api?: string;\n  children: ReactNode;\n};\n\nexport function AiProvider({\n  api = DEFAULT_AI_API,\n  children,\n}: AiProviderProps) {\n  const fetchClient = useMemo(\n    () => createFetchClient<paths>({ baseUrl: api }),\n    [api],\n  );\n  const hooks = useMemo(() => createClient(fetchClient), [fetchClient]);\n\n  return (\n    <AiContext.Provider value={{ api, hooks }}>{children}</AiContext.Provider>\n  );\n}\n\nexport function useAiApi(explicitApi?: string) {\n  const context = useContext(AiContext);\n  const resolvedApi = explicitApi ?? context.api;\n\n  if (\n    process.env.NODE_ENV === 'development' &&\n    resolvedApi === DEFAULT_AI_API &&\n    !hasWarnedFallbackApi\n  ) {\n    hasWarnedFallbackApi = true;\n    // biome-ignore lint/suspicious/noConsole: dev-only runtime diagnostic\n    console.warn(\n      'AI API URL fell back to /api/ai. Wrap your app in <AiProvider api=\"...\">.',\n    );\n  }\n\n  return resolvedApi;\n}\n\nexport function useApi() {\n  const context = useContext(AiContext);\n  if (!context.hooks) {\n    throw new Error('useApi must be used within AiProvider');\n  }\n\n  return { hooks: context.hooks };\n}\n\ntype HookArgs = [string, string, ...unknown[]];\n\nexport const $api = {\n  useQuery(...args: HookArgs) {\n    const { hooks } = useApi();\n\n    return hooks.useQuery(...args);\n  },\n  useMutation(...args: HookArgs) {\n    const { hooks } = useApi();\n\n    return hooks.useMutation(...args);\n  },\n};\n"],"mappings":"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","names":["jsx"]}

package/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@mesob/ai-react",
+  "version": "0.5.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./data/openapi": {
+      "types": "./src/data/openapi.d.ts",
+      "default": "./src/data/openapi.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@tabler/icons-react": "^3.35.0",
+    "openapi-fetch": "^0.15.0",
+    "openapi-react-query": "^0.5.1",
+    "@mesob/ui": "0.5.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "openapi-typescript": "^7.0.0",
+    "tsup": "^8.5.0",
+    "typescript": "^5.7.2",
+    "zod": "^4.3.6"
+  },
+  "peerDependencies": {
+    "@tanstack/react-query": "^5.0.0",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "zod": "^4.1.13"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "generate:client": "node scripts/generate-client.mjs",
+    "lint": "biome check --write .",
+    "check-types": "tsc --noEmit"
+  }
+}