Uncaught (in promise) TypeError: undefined has no properties
 applyOperation http://127.0.0.1:8000/client/_snowpack/pkg/common/index-6ddd8323.js:322
 move http://127.0.0.1:8000/client/_snowpack/pkg/common/index-6ddd8323.js:151
 applyOperation http://127.0.0.1:8000/client/_snowpack/pkg/common/index-6ddd8323.js:304
 applyPatch http://127.0.0.1:8000/client/_snowpack/pkg/common/index-6ddd8323.js:343
 applyPatchInplace http://127.0.0.1:8000/client/_snowpack/pkg/common/mount-01d35dc3.js:193
 applyPatch http://127.0.0.1:8000/client/_snowpack/pkg/common/mount-01d35dc3.js:378
 onmessage http://127.0.0.1:8000/client/_snowpack/pkg/common/mount-01d35dc3.js:442

import idom
import random
@idom.component
def RangeWords(text):
 highlight_range, set_highlight_range = idom.hooks.use_state([])
 
 def update_range(index):
 if highlight_range == []:
 set_highlight_range([index])
 elif highlight_range == [index]:
 set_highlight_range([])
 elif index in [highlight_range[-1], highlight_range[0]]:
 set_highlight_range([index])
 elif index < highlight_range[0]:
 set_highlight_range(list(range(index, highlight_range[0] + 1)))
 else:
 set_highlight_range(list(range(highlight_range[0], index + 1)))
 
 divs = [
 idom.html.div({
 'onClick': lambda e, i=i: update_range(i),
 'style': {
 'backgroundColor': 'aquamarine' if i in highlight_range else 'white',
 'display':'inline',
 'padding':'5px'
 }
 },
 word,
 key=str(random.random())
 )
 for i,word in enumerate(text.split())
 ]
 
 return idom.html.div({
 'style': {
 'width':'95%',
 'display':'flex',
 'flex-wrap':'wrap',
 'margin':'5px'}
 },
 divs
 )
@idom.component
def WorkSentDiv(tfname):
 
 sid, set_sid = idom.hooks.use_state(0)
 
 works = {'bubs': ["it was the best of times, it was the blurst of times.",
 "they will break upon this fortress like water on rock.",
 "ah those heady days of yore.",
 "forge ahead, no matter the cost.",
 "bring me the head of alfredo garcia.",
 "there were monsters aboard that ship, and truly we were them."],
 'zugzug': ["나도너도나도 웰웰웰 아하아하.",
 "섬웨어 오버 더 레인보.",
 "유 캔트 듀 댓 온 테레비즌.",
 "컴퓨터 프로그램잉.",
 "어메이징 테일즈.",
 "대츠 오케이!",
 "데르즈 노 비지니스 라이크 쇼 비지니스"]}
 
 def get_stext(tfname, sid):
 if sid < len(works[tfname]): 
 return works[tfname][sid]
 else:
 return "no more sentences"
 
 
 def btn_click(count):
 if sid + count < 0:
 return
 
 set_sid(sid + count)
 
 return idom.html.div(
 idom.html.div(f"sentence id: {sid}"),
 idom.html.button({'onClick': lambda e:btn_click(-1)}, "Prev"),
 idom.html.button({'onClick': lambda e:btn_click(1)}, "Next"),
 RangeWords(get_stext(tfname, sid))
 )
@idom.component
def DualWorkView():
 return idom.html.div(
 WorkSentDiv("bubs"),
 WorkSentDiv("zugzug")
 )
idom.run(DualWorkView)