Просмотр исходного кода

initial work for info tooltips

Ivan Galakhov 4 лет назад
Родитель
Сommit
20b8beaa11

+ 1 - 0
dashboard/src/components/values-form/FormDebugger.tsx

@@ -272,6 +272,7 @@ tabs:
       label: Required Field A
       required: true
       variable: field_a
+      info: This is some info
     - type: string-input
       placeholder: "ex: sapporo"
       required: true

+ 6 - 3
dashboard/src/components/values-form/InputRow.tsx

@@ -3,6 +3,7 @@ import styled from "styled-components";
 
 type PropsType = {
   label?: string;
+  info?: string;
   type: string;
   value: string | number;
   setValue?: (x: string | number) => void;
@@ -31,12 +32,14 @@ export default class InputRow extends Component<PropsType, StateType> {
   };
 
   render() {
-    let { label, value, type, unit, placeholder, width } = this.props;
+    let { label, value, type, unit, placeholder, width, info } = this.props;
     return (
       <StyledInputRow>
-        {label && (
+        {(label || info) && (
           <Label>
-            {label} <Required>{this.props.isRequired ? " *" : null}</Required>
+            {label}
+            {info && " ?"}
+            {this.props.isRequired && <Required>{" *"}</Required>}
           </Label>
         )}
         <InputWrapper>

+ 2 - 0
dashboard/src/components/values-form/ValuesForm.tsx

@@ -141,6 +141,7 @@ export default class ValuesForm extends Component<PropsType, StateType> {
             />
           );
         case "string-input":
+          console.log(item);
           return (
             <InputRow
               key={key}
@@ -160,6 +161,7 @@ export default class ValuesForm extends Component<PropsType, StateType> {
                 this.props.setMetaState(key, x);
               }}
               label={item.label}
+              info={item.info}
               unit={item.settings ? item.settings.unit : null}
               disabled={isDisabled}
             />

+ 1 - 0
dashboard/src/shared/types.tsx

@@ -102,6 +102,7 @@ export interface Section {
 // FormElement represents a form element
 export interface FormElement {
   type: string;
+  info?: string;
   label: string;
   required?: boolean;
   name?: string;