diff --git a/src/components/Button.tsx b/src/components/Button.tsx index 352f51b3..0db7ee0b 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -24,7 +24,7 @@ export function ButtonRoot({ // @ts-ignore - private index = 1, value, -}: ButtonRootProps) { +}: ButtonRootProps): JSX.Element { return [ } diff --git a/src/frog-base.tsx b/src/frog-base.tsx index 63a52c23..7ef01be3 100644 --- a/src/frog-base.tsx +++ b/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 diff --git a/src/index.ts b/src/index.ts index a536f4e0..dc8a3da8 100644 --- a/src/index.ts +++ b/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' diff --git a/src/types/frame.ts b/src/types/frame.ts index 1015438f..4ae80e30 100644 --- a/src/types/frame.ts +++ b/src/types/frame.ts @@ -118,7 +118,7 @@ export type FrameResponse = { * , * ] */ - 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 diff --git a/src/ui/Box.tsx b/src/ui/Box.tsx index 6894eb2e..1ddb0643 100644 --- a/src/ui/Box.tsx +++ b/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 = diff --git a/src/ui/Text.tsx b/src/ui/Text.tsx index b2ec2c1a..40c721e3 100644 --- a/src/ui/Text.tsx +++ b/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 = { /** Sets the horizontal alignment of the text. */ align?: BoxProps['textAlign'] + /** The text content. */ children: Child /** Sets the color of the text. */ color?: BoxProps['color'] diff --git a/src/ui/types.ts b/src/ui/types.ts index 29bf4c3b..a41b1924 100644 --- a/src/ui/types.ts +++ b/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' diff --git a/src/utils/parseImage.ts b/src/utils/parseImage.ts index 9147d276..451d7745 100644 --- a/src/utils/parseImage.ts +++ b/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( diff --git a/src/utils/parseIntents.ts b/src/utils/parseIntents.ts index c43e7fb2..44ba374d 100644 --- a/src/utils/parseIntents.ts +++ b/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[] {