From 36ecd23f8e3282f33aaf84e64fe51fae8f5a9a54 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Loi=CC=88c=20Correnson?= <loic.correnson@cea.fr>
Date: Thu, 10 Sep 2020 13:35:31 +0200
Subject: [PATCH] [dome] select field
---
.../dome/src/renderer/controls/buttons.tsx | 2 +-
ivette/src/dome/src/renderer/layout/form.tsx | 41 ++++++++++++++++++-
2 files changed, 41 insertions(+), 2 deletions(-)
diff --git a/ivette/src/dome/src/renderer/controls/buttons.tsx b/ivette/src/dome/src/renderer/controls/buttons.tsx
index f3f2c0a38ce..7be26bdabb9 100644
--- a/ivette/src/dome/src/renderer/controls/buttons.tsx
+++ b/ivette/src/dome/src/renderer/controls/buttons.tsx
@@ -522,7 +522,7 @@ export interface SelectProps {
className?: string;
/** Additional style for the `< dov /> ` container of Raiods */
style?: React.CSSProperties;
- /** Shall be [[Item]] elements. */
+ /** Shall be standard `<option/>` and `<optgroup/>` elements. */
children: any;
}
diff --git a/ivette/src/dome/src/renderer/layout/form.tsx b/ivette/src/dome/src/renderer/layout/form.tsx
index df762bdcc8a..1916757ce57 100644
--- a/ivette/src/dome/src/renderer/layout/form.tsx
+++ b/ivette/src/dome/src/renderer/layout/form.tsx
@@ -12,7 +12,7 @@ import React from 'react';
import * as Dome from 'dome';
import * as Utils from 'dome/misc/utils';
import { SVG } from 'dome/controls/icons';
-import { Checkbox, Radio } from 'dome/controls/buttons';
+import { Checkbox, Radio, Select as SelectMenu } from 'dome/controls/buttons';
export type Error =
| undefined | boolean | string
@@ -1050,6 +1050,7 @@ export interface RadioFieldProps<A> extends FieldProps<A> {
value: A;
}
+/** @category Form Fields */
export function RadioField<A>(props: RadioFieldProps<A>) {
const { hidden, disabled } = useContext(props);
@@ -1076,4 +1077,42 @@ export function RadioField<A>(props: RadioFieldProps<A>) {
);
}
+/* --------------------------------------------------------------------------*/
+/* --- Select Menu Field ---*/
+/* --------------------------------------------------------------------------*/
+
+/** @category Form Fields */
+export interface SelectFieldProps extends FieldProps<string | undefined> {
+ placeholder?: string;
+ children: any;
+}
+
+/**
+ Children must be standard `<option>` or `<optgroup>` elements.
+
+ @category Form Fields
+*/
+export function SelectField(props: SelectFieldProps) {
+ const id = useHtmlFor();
+ const [value, error, setState] = useChecker(props.state, props.checker);
+ const onChange = (newValue?: string) => setState(newValue, undefined);
+ const { children, placeholder } = props;
+ return (
+ <Field
+ {...props}
+ error={error}
+ htmlFor={id}
+ >
+ <SelectMenu
+ id={id}
+ value={value}
+ placeholder={placeholder}
+ onChange={onChange}
+ >
+ {children}
+ </SelectMenu>
+ </Field>
+ );
+}
+
// --------------------------------------------------------------------------
--
GitLab