pc.input value type number error : TypeError: Invalid var passed for prop value, expected type <class 'str'>, got value {state.price} of type <class 'int'>.

[bobwatcherx]

i have problem how to use int in value pc.input

i have error
File "/home/mopt/belajar/pynecrud/pynecrud/pynecrud.py", line 151, in index
pc.input(
File "/usr/local/lib/python3.10/dist-packages/pynecone/components/component.py", line 365, in create
return cls(children=children, **props)
File "/usr/local/lib/python3.10/dist-packages/pynecone/components/component.py", line 131, in init
raise TypeError(
TypeError: Invalid var passed for prop value, expected type <class 'str'>, got value {state.price} of type <class 'int'>.

my code
import pynecone as pc
from .mymodel.food import Foods

class State(pc.State):
name:str
price:int
stock:int
id_edit:int

show_modal: bool = False



def open_modal(self):
    self.show_modal = not (self.show_modal)

def showme(self,row):
    print("tolol",row)

def addnew(self):
    if self.name and self.price and self.stock:
        try:
            with pc.session() as s:
                s.add(
                    Foods(
                        food_name=self.name,
                        price=self.price,
                        stock=self.stock
                        )
                    )
                s.commit()
        except Exception as e:
            print(e)
    else:
        print("Please fill in all fields before adding new food.")




@pc.var
def get_user(self)-> list[Foods]:
    with pc.session() as s:
        self.users = s.query(Foods).all()
        return self.users

def delete_data(self,id_delete):
    with pc.session() as s:
        s.query(Foods).filter_by(id=id_delete).delete()
        s.commit()

def edit_data(self, user):
    self.show_modal = True
    print(user)
    print(dir(self.name))
    self.name = user['food_name']
    self.id_edit = user['id']
    self.price = int(user['price'])
    self.stock = int(user['stock'])


def save_data(self):
    with pc.session() as s:
        # Get the record to be edited
        food = s.query(Foods).filter_by(id=self.id_edit).first()
        print(food)
        if food is not None:
            # Update the record with the new values
            food.food_name = self.name
            food.price = self.price
            food.stock = self.stock
            s.commit()
            self.show_modal = False
        else:
            print(f"Food with ID {id_edit} not found.")

def showcustomer(user:Foods):
print(user)
return pc.tr(
pc.td(user.food_name),
pc.td(user.price),
pc.td(user.stock),
pc.td(
pc.button("Edit",
on_click=lambda: State.edit_data(user),
bg="red",
color="white"
),
pc.button("delete",
on_click=lambda: State.delete_data(user.id),
bg="blue",
color="white"
),
)
)

def index():
return pc.vstack(
pc.heading("Crud Pynecone",size="md"),
pc.input(
focus_border_color="purple",
placeholder="Food Name",
on_change=State.set_name),

    pc.input(
        focus_border_color="purple",
        placeholder="Price",
        on_change=State.set_price),
    pc.input(
        focus_border_color="purple",
        placeholder="Stock",
        on_change=State.set_stock),


    pc.button("addnew",
        bg="yellow",color="black",size="lg",
    on_click=State.addnew
        ),

    # SHOW DATA IN TABLE
    pc.table_container(
        pc.table(
            # pc.table_caption("Example Table"),
            pc.thead(
                  pc.tr(
                            pc.th("Name"),
                            pc.th("Price"),
                            pc.th("Stock"),
                        )
            ),
            pc.tbody(pc.foreach(State.get_user,showcustomer))                
        )
    ),

    # MODAL DIALOG EDIT
    pc.modal(
        pc.modal_overlay(
            pc.modal_content(
                pc.modal_header("Edit"),
                pc.modal_body(
                    pc.vstack(
                    pc.input(
                        placeholder="foood name",
                        on_change=State.set_name,
                        value=State.name
                        ),
                      pc.input(
                        placeholder="Price",
                        on_change=State.set_price,
                        value=State.price

                        ),
                        pc.input(
                        placeholder="Stock",
                        on_change=State.set_stock,

                        value=State.stock

                        ),
                        
                        )
                    ),
                pc.modal_footer(
                    pc.button("save",
                            bg="blue",
                            on_click=State.save_data
                            ),
                    pc.button("close",on_click=State.open_modal)
                    )
                )
            ),
        is_open=State.show_modal

        )
    )

Add state and page to the app.

app = pc.App(state=State)
app.add_page(index)
app.compile()