Now Observable provide many builtin inputs, such as Text, Range, etc.
I’m wondering if we can define our own custom class and inherit from these builtin inputs? If it is possible, how to do it in a notebook?
Not sure what you mean by “inherit”, but for the Observable inputs like Text and Range, under the hood they are just JavaScript functions and not classes (in case you were thinking of having something like class MyText extends Text).
You could create a wrapper function around an Input, to provide defaults/ re-map arguments like so:
Query = value => Text({label: "Query", placeholder: "Search", submit: true, value})
viewof name = Query("Alex");
viewof dog = Query("clifford");
Query is light wrapper around Text, providing some default arguments and allowing you to provide a default value.
Also, you could built your own inputs that work with viewof, if you want to make something completely customizable. Here are some of my favorite notebooks that demonstrate that:
lmk if this answers your question!
1 Like
Thanks for your kind help 
This is just what I need.
With the help from you and @mcmcclur , I managed to define my custom input object:
2 Likes