feat: Disabled state for dropdown list #28

h2oai · Oct 18, 2022 · e973aa2 · e973aa2
1 parent ae5b1f0
commit e973aa2
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 1 deletion.
diff --git a/help/docs/guide/dropdown-list.md b/help/docs/guide/dropdown-list.md
@@ -88,3 +88,21 @@ while True:
 
 
 ![Screenshot](assets/screenshots/multi_dropdown_live.png)
+
+
+## Disable
+
+Set `disabled=True` to disable.
+
+
+```py
+view(box(
+    'Choose some colors',
+    mode='multi menu',
+    options=['green', 'yellow', 'orange', 'red'],
+    disabled=True
+))
+```
+
+
+![Screenshot](assets/screenshots/multi_dropdown_disable.png)
diff --git a/py/pkg/docs/dropdown_list.py b/py/pkg/docs/dropdown_list.py
@@ -73,3 +73,14 @@ def multi_dropdown_live(view: View):  # height 3
             ),
             f'You chose {choices}.'
         )
+
+
+# ## Disable
+# Set `disabled=True` to disable.
+def multi_dropdown_disable(view: View):  # height 2
+    view(box(
+        'Choose some colors',
+        mode='multi menu',
+        options=['green', 'yellow', 'orange', 'red'],
+        disabled=True
+    ))
diff --git a/web/src/droplist.tsx b/web/src/droplist.tsx
@@ -21,7 +21,7 @@ import { BoxProps, make } from './ui';
 
 export const Droplist = make(({ context, box }: BoxProps) => {
   const
-    { name, modes, text, placeholder, error, options: rawOptions, style } = box,
+    { name, modes, text, placeholder, error, options: rawOptions, style, disabled } = box,
     options = rawOptions ?? [],
     required = modes.has('required'),
     live = modes.has('live'),
@@ -53,6 +53,7 @@ export const Droplist = make(({ context, box }: BoxProps) => {
           errorMessage={error}
           required={required ? true : false}
           onChange={onChange}
+          disabled={disabled === true}
         />
       </div>
     )