fix: jsx import source types

src/components/Button.tsx

@@ -24,7 +24,7 @@ export function ButtonRoot({
   // @ts-ignore - private
   index = 1,
   value,
-}: ButtonRootProps) {
+}: ButtonRootProps): JSX.Element {
   return [
     <meta
       property={`fc:frame:button:${index}`}
@@ -48,7 +48,7 @@ export function ButtonLink({
   // @ts-ignore - private
   index = 1,
   href,
-}: ButtonLinkProps) {
+}: ButtonLinkProps): JSX.Element {
   return [
     <meta
       property={`fc:frame:button:${index}`}
@@ -70,7 +70,7 @@ export function ButtonMint({
   // @ts-ignore - private
   index = 1,
   target,
-}: ButtonMintProps) {
+}: ButtonMintProps): JSX.Element {
   return [
     <meta
       property={`fc:frame:button:${index}`}
@@ -92,7 +92,7 @@ export function ButtonRedirect({
   // @ts-ignore - private
   index = 1,
   location,
-}: ButtonRedirectProps) {
+}: ButtonRedirectProps): JSX.Element {
   return [
     <meta
       property={`fc:frame:button:${index}`}
@@ -116,7 +116,7 @@ export function ButtonReset({
   children,
   // @ts-ignore - private
   index = 1,
-}: ButtonResetProps) {
+}: ButtonResetProps): JSX.Element {
   return (
     <meta
       property={`fc:frame:button:${index}`}
@@ -139,7 +139,7 @@ export function ButtonTransaction({
   // @ts-ignore - private
   index = 1,
   target,
-}: ButtonTransactionProps) {
+}: ButtonTransactionProps): JSX.Element {
   return [
     <meta
       property={`fc:frame:button:${index}`}

src/components/TextInput.tsx

@@ -3,6 +3,6 @@ export type TextInputProps = {
 }
 
 TextInput.__type = 'text-input'
-export function TextInput({ placeholder }: TextInputProps) {
+export function TextInput({ placeholder }: TextInputProps): JSX.Element {
   return <meta property="fc:frame:input:text" content={placeholder} />
 }

src/frog-base.tsx

@@ -384,6 +384,10 @@ export class FrogBase<
         return c.redirect(location, 302)
       }
 
+      const renderAsHTML =
+        c.req.header('Accept') === 'text/html' ||
+        c.req.query('accept') === 'text/html'
+
       // If the user is coming from a browser, and a `browserLocation` is set,
       // then we will redirect the user to that location.
       const browser = detect(c.req.header('user-agent'))
@@ -392,7 +396,7 @@ export class FrogBase<
         basePath: this.basePath,
         path,
       })
-      if (browser?.name && browserLocation_)
+      if (!renderAsHTML && browser?.name && browserLocation_)
         return c.redirect(
           browserLocation_.startsWith('http')
             ? browserLocation_
@@ -502,9 +506,6 @@ export class FrogBase<
       for (const [key, value] of Object.entries(headers ?? {}))
         c.header(key, value)
 
-      const renderAsHTML =
-        c.req.header('Accept') === 'text/html' ||
-        c.req.query('accept') === 'text/html'
       if (renderAsHTML) {
         const height = imageOptions?.height ?? 630
         const width = imageOptions?.width ?? 1200

src/index.ts

@@ -30,6 +30,7 @@ export type { Env } from './types/env.js'
 export type {
   FrameResponse,
   FrameIntent,
+  /** @deprecated Use `FrameIntent[]` instead. */
   FrameIntents,
 } from './types/frame.js'
 export type { HandlerResponse, TypedResponse } from './types/response.js'

src/types/frame.ts

@@ -118,7 +118,7 @@ export type FrameResponse = {
    *   <Button>Submit</Button>,
    * ]
    */
-  intents?: FrameIntents | undefined
+  intents?: FrameIntent | FrameIntent[] | undefined
   /**
    * Title of the frame (added as `og:title`).
    *
@@ -149,7 +149,8 @@ export type FrameImageAspectRatio = '1.91:1' | '1:1'
 
 export type FrameVersion = 'vNext'
 
-export type FrameIntent = JSX.Element | false | null | undefined
+export type FrameIntent = JSX.Element | JSX.Element[] | false | null | undefined
+/** @deprecated */
 export type FrameIntents = FrameIntent | FrameIntent[]
 
 export type FrameButtonValue = string

src/ui/Box.tsx

@@ -1,6 +1,9 @@
-import type { Child } from 'hono/jsx'
-
-import type { Direction, SatoriStyleProperties, ValueOf } from './types.js'
+import type {
+  Child,
+  Direction,
+  SatoriStyleProperties,
+  ValueOf,
+} from './types.js'
 import { type DefaultVars, type Vars, defaultVars } from './vars.js'
 
 export type VariableValue<property extends keyof SatoriStyleProperties, token> =

src/ui/Text.tsx

@@ -1,10 +1,11 @@
-import type { Child } from 'hono/jsx'
 import { Box, type BoxProps } from './Box.js'
+import type { Child } from './types.js'
 import type { DefaultVars, Vars } from './vars.js'
 
 export type TextProps<vars extends Vars = DefaultVars> = {
   /** Sets the horizontal alignment of the text. */
   align?: BoxProps<vars>['textAlign']
+  /** The text content. */
   children: Child
   /** Sets the color of the text. */
   color?: BoxProps<vars>['color']

src/ui/types.ts

@@ -1,5 +1,7 @@
 import type { Properties } from 'csstype'
 
+export type Child = import('hono/jsx').Child | JSX.Element
+
 export type SatoriStyleProperties = Pick<
   Properties,
   | 'alignContent'

src/utils/parseImage.ts

@@ -1,7 +1,7 @@
-import type { Child, JSXNode } from 'hono/jsx'
+import type { JSXNode } from 'hono/jsx'
 
 import type { Frog } from '../frog.js'
-import type { Direction } from '../ui/types.js'
+import type { Child, Direction } from '../ui/types.js'
 import { parsePath } from './parsePath.js'
 
 export async function parseImage(

src/utils/parseIntents.ts

@@ -1,7 +1,7 @@
 import { type JSXNode } from 'hono/jsx'
 
 import { buttonPrefix } from '../components/Button.js'
-import { type FrameIntents } from '../types/frame.js'
+import { type FrameIntent } from '../types/frame.js'
 import { parsePath } from './parsePath.js'
 
 type Counter = { button: number }
@@ -12,7 +12,7 @@ type ParseIntentsOptions = {
 }
 
 export function parseIntents(
-  intents_: FrameIntents | undefined,
+  intents_: FrameIntent | FrameIntent[] | undefined,
   options: ParseIntentsOptions = {},
   counter: Counter = { button: 1 },
 ): JSXNode[] {