hunk.code_window:     </React.Fragment>
     );
   };
   type Props = {
     name: string;
     label: string;
     rightIcon?: Function;
     description?: string;
     actionConfig?: any;
     extraData?: ControlData[];
     isRequired?: boolean;
   };
   class KeyValueFieldArray extends BaseControl<KeyValueArrayProps> {
     render() {
       const name = getFieldName(this.props.configProperty);
       return (
  
hunk.labels: keep keep keep keep replace replace replace replace replace replace replace replace replace replace keep keep keep keep keep
hunk.file_path: app/client/src/components/formControls/KeyValueArrayControl.tsx
hunk.type: replace
file: import { Component } from "react";
  import { ControlType } from "constants/PropertyControlConstants";
  import { InputType } from "widgets/InputWidget";
  
  abstract class BaseControl<P extends ControlProps, S = {}> extends Component<
    P,
    S
  > {
    abstract getControlType(): ControlType;
  }
  
  export interface ControlBuilder<T extends ControlProps> {
    buildPropertyControl(controlProps: T): JSX.Element;
  }
  
  export interface ControlProps extends ControlData, ControlFunctions {
    key?: string;
    extraData?: ControlData[];
  }
  
  export interface ControlData {
    id: string;
    label: string;
    configProperty: string;
    helpText?: string;
    isJSConvertible?: boolean;
    controlType: ControlType;
    propertyValue?: any;
    isValid: boolean;
    validationMessage?: string;
    dataType?: InputType;
    isRequired?: boolean;
  }
  
  export interface ControlFunctions {
    onPropertyChange?: (propertyName: string, propertyValue: string) => void;
  }
  
  export default BaseControl;
  