From 88deef0781acfb01402903a375c0c2a967b07bb5 Mon Sep 17 00:00:00 2001
From: "moxey.eth" <jakemoxey@gmail.com>
Date: Thu, 8 Feb 2024 16:21:31 +1100
Subject: [PATCH] feat: text input

---
 example/src/index.tsx |  3 ++-
 src/index.tsx         | 14 ++++++++++++--
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/example/src/index.tsx b/example/src/index.tsx
index 808c2df8..d091be6c 100644
--- a/example/src/index.tsx
+++ b/example/src/index.tsx
@@ -2,7 +2,7 @@
 /** @jsxImportSource hono/jsx */
 /** @jsxFrag */
 
-import { Button, Framework } from 'farc'
+import { Button, Framework, TextInput } from 'farc'
 
 const app = new Framework()
 
@@ -43,6 +43,7 @@ app.frame('/', ({ status }) => {
       <>
         <Button>Apples</Button>
         <Button>Oranges</Button>
+        <TextInput placeholder="Enter custom fruit..." />
       </>
     ),
   }
diff --git a/src/index.tsx b/src/index.tsx
index 0f0c3492..8002d088 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -245,6 +245,15 @@ export function Button({ children, index = 0 }: ButtonProps) {
   return <meta property={`fc:frame:button:${index}`} content={children} />
 }
 
+export type TextInputProps = {
+  placeholder?: string
+}
+
+TextInput.__type = 'text-input'
+export function TextInput({ placeholder }: TextInputProps) {
+  return <meta property="fc:frame:input:text" content={placeholder} />
+}
+
 type FramePreviewProps = {
   baseUrl: string
   frame: Frame
@@ -382,8 +391,9 @@ async function parseIntents(intents_: JSX.Element) {
 function parseIntent(node: JSXNode, counter: Counter) {
   const props = (() => {
     if ((node.tag as any).__type === 'button')
-      return { children: node.children, index: counter.button++ }
-    // TODO: handle text input
+      return { ...node.props, children: node.children, index: counter.button++ }
+    if ((node.tag as any).__type === 'text-input')
+      return { ...node.props, children: node.children }
     return {}
   })()