pages/Form_Component/demo_input.py

'''
title: Input
'''

import streamsync as ss

ss.md("## ss.input")

ss.space()
ss.md("#### 🔅 Example")

ss.md("---")
ss.space()

def onchange(state, value):
    ss.message(f"onchange, {value}")

def onclear(state, value):
    ss.message("onclear event happend")

def onblur(state, value):
    print("onblur")
    ss.message(f"onblur, {value}")
    
def testme():
    ss.message(myinput.value)
    
#ui
cols = ss.columns([60,40], border = True)
with cols[0]:
    myinput = ss.text_input("Hello SimpleStart", clearable=True, width=300)


def myevent(event):
    if event.tag == "sel1":
        myinput.variant = event.value
    elif event.tag == "sel2":
        myinput.type = event.value
    elif event.tag == "but1":
        ss.message(myinput.value)
    

with cols[1]:
    ss.selectbox(["filled","outlined","underlined", "solo", "solo-filled", "solo-inverted"], label='#### Change the input style', \
                value="solo", onchange = myevent, eventTag="sel1")
    
    ss.selectbox(["text","time", "date", "week", "month", "password",  "color"], label='#### Change the input type', \
                onchange = myevent, eventTag="sel2")
 
    ss.write('#### Get Input Value', color="#66656a")
    ss.button("Get Text Value", onclick=myevent, eventTag="but1")



ss.write("---")
ss.write("#### 🔎 Code")

ss.md('''
```python
import simplestart as ss

myinput = ss.input("Hello SimpleStart", clearable=True, width = 300)

#Or
#ss.text_input("hello", type="text", variant = "filled")

''')