oc-front/lib/widgets/inputs/shallow_text_input.dart

import 'package:flutter/material.dart';
import 'package:oc_front/models/response.dart';
import 'package:oc_front/pages/shared.dart';
class ShallowTextInputWidget extends StatefulWidget {
  double? width;
  SharedWorkspaceType type = SharedWorkspaceType.workspace;
  Future<void> Function(Map<String,dynamic>)? load;
  Future<void> Function(String)? loadStr;
  Future<void>  Function(String)? remove;
  bool Function(String?)? canLoad;
  bool Function(String?)? canRemove;
  void Function(String?)? change;
  String? current;
  String? compare;

  IconData? iconLoad;
  IconData? iconRemove;

  String? hint;

  String? tooltipLoad;
  String? tooltipRemove;

  Color? filled;
  Color? hintColor;
  Color? color;
  List<ShallowTextInputWidget> forms = [];

  String? attr;

  ShallowTextInputWidget ({ Key? key, this.width, this.current, this.attr,
  this.iconLoad, this.iconRemove, this.hint, this.forms = const [], this.loadStr,
  this.tooltipLoad = "", this.tooltipRemove = "",
  this.filled, this.hintColor, this.color,
  required this.type, this.canLoad, this.canRemove, this.load, this.remove, this.change }): super(key: key);
  @override ShallowTextInputWidgetState createState() => ShallowTextInputWidgetState();

  Map<String, dynamic> serialize() {
    Map<String, dynamic> map = { "name" : current };
    for (var form in forms) {
      if (form.attr == null) {
        continue;
      }
      map[form.attr!] = form.current;
    }
    return map;
  }

  bool validate() {
    return canLoad == null ? true : canLoad!(current);
  }
}
class ShallowTextInputWidgetState extends State<ShallowTextInputWidget> {
  bool validForms() {
    for (var form in widget.forms) {
      if (!form.validate()) {
        return false;
      }
    }
    return true;
  }

  @override Widget build(BuildContext context) {
    var t = widget.type == SharedWorkspaceType.workspace ? "workspace" : (widget.type == SharedWorkspaceType.workflow ? "workflow" : "peer");
    return Row( children: [
          Tooltip( message: widget.hint ?? "current $t", child:
          Theme(
            data: Theme.of(context).copyWith(
              canvasColor: Colors.grey.shade300,
            ),
            child: Container( height: 50, width: (widget.width ?? MediaQuery.of(context).size.width) - (widget.load == null ? 0 : 50) - (widget.remove == null ? 0 : 50), 
            decoration: BoxDecoration(
              color: Colors.white,
            ),       
            child:  TextFormField(
                      onChanged: (value) {
                        setState(() {
                          widget.current = value;
                          if (widget.change != null) {
                            widget.change!(value);
                          }
                        });
                      },
                      initialValue: widget.current,
                      style: TextStyle(color: widget.color ?? Colors.black, fontSize: 15),
                      decoration: InputDecoration( 
                        filled: true,
                        border: InputBorder.none,
                        focusedBorder: InputBorder.none,
                        disabledBorder: InputBorder.none,
                        enabledBorder: InputBorder.none,
                        fillColor: widget.filled ?? Colors.white,
                        hintText: widget.hint ?? "enter $t ${widget.attr ?? "name"}...", 
                        contentPadding: const EdgeInsets.only(left: 30, right: 30, top: 18, bottom: 18),
                        hintStyle: TextStyle(color: widget.hintColor ??const Color.fromARGB(255, 85, 44, 44), fontSize: 14)),
                      ),
                      ))),
          widget.load == null && widget.loadStr == null ? Container() : Tooltip(
            message: widget.tooltipLoad ?? "add $t",
            child:InkWell( 
            mouseCursor: SystemMouseCursors.click,
            onTap: () async {
              if (widget.canLoad == null || !widget.canLoad!(widget.current) || !validForms()
              || (widget.load == null && widget.loadStr == null)  || widget.current == null) {
                return;
              }
              if (widget.loadStr != null) {
                await widget.loadStr!(widget.current!);
              } else {
                await widget.load!(widget.serialize());
              }
              setState(() {  });
            },
            child: Container( width: 50,height: 50,
              color: Colors.black,
              child: Icon( widget.iconLoad ?? Icons.add, color: widget.current == null || !validForms()
              || widget.canLoad == null || !widget.canLoad!(widget.current) ? Colors.grey : Colors.white)
            )
          )
        ),
        widget.remove == null ? Container() : Tooltip(
            message: widget.tooltipRemove ?? "refresh entry",
            child: InkWell( mouseCursor: SystemMouseCursors.click,
              onTap: () async {
                if (widget.canRemove == null || !widget.canRemove!(widget.current) || widget.remove == null || widget.current == null) {
                  return;
                }
                await widget.remove!(widget.current!);
                setState(() {  });
            },
            child: Container( width: 50,height: 50,
              decoration: BoxDecoration(color: Colors.black, border: Border(left: BorderSide(color: Colors.grey.shade300))),
              child: Icon(widget.iconRemove ?? Icons.delete, color: widget.current == null || widget.canRemove == null || !widget.canRemove!(widget.current) ? Colors.grey : Colors.white)) )
          ),
        ]);
  }
}