diff --git a/examples/_dev/src/index.tsx b/examples/_dev/src/index.tsx index ab74d3e0..dc1ac686 100644 --- a/examples/_dev/src/index.tsx +++ b/examples/_dev/src/index.tsx @@ -1,11 +1,9 @@ -/** @jsx jsx */ -/** @jsxImportSource hono/jsx */ -/** @jsxFrag */ - import { Button, Farc, TextInput } from 'farc' import { app as todoApp } from './todos' -const app = new Farc() +const app = new Farc({ + // basePath: '/api' +}) app.frame('/', (context) => { const { buttonValue, inputText, status } = context diff --git a/examples/_dev/src/todos.tsx b/examples/_dev/src/todos.tsx index dd152355..5fa5af46 100644 --- a/examples/_dev/src/todos.tsx +++ b/examples/_dev/src/todos.tsx @@ -1,7 +1,3 @@ -/** @jsx jsx */ -/** @jsxImportSource hono/jsx */ -/** @jsxFrag */ - import { Button, Farc, TextInput } from 'farc' type State = { diff --git a/src/farc.tsx b/src/farc.tsx index ea703faf..2ba861eb 100644 --- a/src/farc.tsx +++ b/src/farc.tsx @@ -27,12 +27,14 @@ import { parseIntents } from './utils/parseIntents.js' import { parsePath } from './utils/parsePath.js' import { requestToContext } from './utils/requestToContext.js' import { serializeJson } from './utils/serializeJson.js' -import { toBaseUrl } from './utils/toBaseUrl.js' export type FarcConstructorParameters< state = undefined, env extends Env = Env, -> = HonoOptions & { + basePath extends string = '/', +> = { + basePath?: basePath | string | undefined + honoOptions?: HonoOptions | undefined initialState?: state | undefined } @@ -48,14 +50,25 @@ export class Farc< env extends Env = Env, schema extends Schema = {}, basePath extends string = '/', -> extends Hono { +> { #initialState: state = undefined as state + hono: Hono + fetch: Hono['fetch'] + get: Hono['get'] + post: Hono['post'] + constructor({ + basePath, + honoOptions, initialState, - ...options - }: FarcConstructorParameters = {}) { - super(options) + }: FarcConstructorParameters = {}) { + this.hono = new Hono(honoOptions) + if (basePath) this.hono = this.hono.basePath(basePath) + this.fetch = this.hono.fetch.bind(this.hono) + this.get = this.hono.get.bind(this.hono) + this.post = this.hono.post.bind(this.hono) + if (initialState) this.#initialState = initialState } @@ -67,8 +80,12 @@ export class Farc< ) => FrameHandlerReturnType | Promise, ) { // Frame Route (implements GET & POST). - this.use(path, async (c) => { + this.hono.use(parsePath(path), async (c) => { const query = c.req.query() + + const url = new URL(c.req.url) + const baseUrl = `${url.origin}${url.pathname}` + const previousContext = query.previousContext ? deserializeJson>( query.previousContext, @@ -127,9 +144,7 @@ export class Farc< {parsedIntents} @@ -160,7 +175,7 @@ export class Farc< }) // OG Image Route - this.get(`${parsePath(path)}/image`, async (c) => { + this.hono.get(`${parsePath(path)}/image`, async (c) => { const query = c.req.query() const previousContext = query.previousContext ? deserializeJson>( @@ -178,35 +193,36 @@ export class Farc< }) // Frame Dev Routes - this.use(`${parsePath(path)}/dev`, (c, next) => - jsxRenderer((props) => { - const { children } = props - const path = new URL(c.req.url).pathname.replace('/dev', '') - return ( - - - 𝑭𝒂𝒓𝒄 {path || '/'} -