feat(blueprint): added typings to components

Author: Hyperkid123

packages/blueprint-component-mapper/src/files/checkbox.d.ts

@@ -0,0 +1,17 @@
+import { UseFieldApiComponentConfig, AnyObject } from "@data-driven-forms/react-form-renderer";
+import { ReactNode } from "react";
+import { ICheckboxProps } from '@blueprintjs/core';
+import { FormGroupProps } from "./form-group";
+
+export interface CheckboxOption extends AnyObject {
+  value?: any;
+  label: ReactNode;
+}
+
+export interface CheckboxProps extends ICheckboxProps {
+  options?: CheckboxOption[];
+}
+
+declare const Checkbox: React.ComponentType<CheckboxProps & FormGroupProps &  UseFieldApiComponentConfig>;
+
+export default Checkbox;

packages/blueprint-component-mapper/src/files/component-mapper.d.ts

@@ -0,0 +1,41 @@
+import { ComponentTypes } from '@data-driven-forms/react-form-renderer';
+
+interface Components  {
+  TextField: React.ComponentType;
+  Textarea: React.ComponentType;
+  Select: React.ComponentType;
+  Checkbox: React.ComponentType;
+  Radio: React.ComponentType;
+  Switch: React.ComponentType;
+  DatePicker: React.ComponentType;
+  TimePicker: React.ComponentType;
+  PlainText: React.ComponentType;
+  SubForm: React.ComponentType;
+  Wizard: React.ComponentType;
+  DualListSelect: React.ComponentType;
+  Slider: React.ComponentType;
+}
+
+interface componentMapper  {
+  [ComponentTypes.TEXT_FIELD]: React.ComponentType;
+  [ComponentTypes.TEXTAREA]: React.ComponentType;
+  [ComponentTypes.SELECT]: React.ComponentType;
+  [ComponentTypes.CHECKBOX]: React.ComponentType;
+  [ComponentTypes.SUB_FORM]: React.ComponentType;
+  [ComponentTypes.RADIO]: React.ComponentType;
+  [ComponentTypes.TABS]: React.ComponentType;
+  [ComponentTypes.DATE_PICKER]: React.ComponentType;
+  [ComponentTypes.TIME_PICKER]: React.ComponentType;
+  [ComponentTypes.SWITCH]: React.ComponentType;
+  [ComponentTypes.PLAIN_TEXT]: React.ComponentType;
+  [ComponentTypes.WIZARD]: React.ComponentType;
+  [ComponentTypes.FIELD_ARRAY]: React.ComponentType;
+  [ComponentTypes.DUAL_LIST_SELECT]: React.ComponentType;
+  [ComponentTypes.SLIDER]: React.ComponentType;
+}
+
+declare const componentMapper: componentMapper;
+
+export const components: Components;
+
+export default componentMapper;

packages/blueprint-component-mapper/src/files/component-mapper.js

@@ -46,5 +46,6 @@ export const components = {
   Switch,
   PlainText,
   DualListSelect,
-  Slider
+  Slider,
+  Wizard
 };

packages/blueprint-component-mapper/src/files/date-picker.d.ts

@@ -0,0 +1,19 @@
+import { FormGroupProps } from "./form-group";
+import { UseFieldApiComponentConfig } from "@data-driven-forms/react-form-renderer";
+import { IDatePickerProps } from '@blueprintjs/datetime';
+import { IPopoverProps, IButtonProps } from "@blueprintjs/core";
+
+export interface DatePickerValueRenderer {
+  (value?: string | Date): string;
+}
+
+export interface DatePickerProps extends IDatePickerProps {
+  disabled?: boolean;
+  valueRenderer?: DatePickerValueRenderer;
+  PopoverProps?: IPopoverProps;
+  ButtonProps: IButtonProps;
+}
+
+declare const DatePicker: React.ComponentType<DatePickerProps & FormGroupProps & UseFieldApiComponentConfig>
+
+export default DatePicker;

packages/blueprint-component-mapper/src/files/date-picker.js

@@ -7,7 +7,7 @@ import { DatePicker as BDatePicker } from '@blueprintjs/datetime';
 import FormGroupWrapper from './form-group';
 import propsCatcher from '../common/props-catcher';
 
-const DatePicker = ({ input, className, disabled, placeholder, valueRenderer, PopoverProps, ButtonProps, ...props }) => (
+const DatePicker = ({ input, disabled, placeholder, valueRenderer, PopoverProps, ButtonProps, ...props }) => (
   <Popover disabled={disabled} {...PopoverProps}>
     <Button text={input.value ? valueRenderer(input.value) : placeholder} disabled={disabled} {...ButtonProps} />
     <BDatePicker id={input.name} {...propsCatcher(props)} {...input} value={input.value || null} />
@@ -21,7 +21,6 @@ DatePicker.defaultProps = {
 
 DatePicker.propTypes = {
   input: PropTypes.object,
-  className: PropTypes.string,
   disabled: PropTypes.bool,
   placeholder: PropTypes.node,
   valueRenderer: PropTypes.func,

packages/blueprint-component-mapper/src/files/dual-list-select.d.ts

@@ -0,0 +1,51 @@
+import { FormGroupProps } from "./form-group";
+import { UseFieldApiComponentConfig, AnyObject } from "@data-driven-forms/react-form-renderer";
+import { ReactNode } from "react";
+import { IButtonGroupProps, IButtonProps, IControlGroupProps, IInputGroupProps, IMenuProps, IMenuItemProps } from "@blueprintjs/core";
+
+export interface DualListSelectValue extends AnyObject {
+  value?: any;
+  label: ReactNode;
+}
+
+export interface DualListSelectProps {
+  leftTitle?: ReactNode;
+  rightTitle?: ReactNode;
+  moveLeftTitle?: ReactNode;
+  moveRightTitle?: ReactNode;
+  allToLeft?: boolean;
+  allToRight?: boolean;
+  validateOnMount?: boolean;
+  moveAllLeftTitle?: ReactNode;
+  moveAllRightTitle?: ReactNode;
+  noValueTitle?: ReactNode;
+  noOptionsTitle?: ReactNode;
+  filterOptionsTitle?: ReactNode;
+  filterValueTitle?: ReactNode;
+  filterValueText?: ReactNode;
+  filterOptionsText?: ReactNode;
+  leftValues?: DualListSelectValue[];
+  rightValues?: DualListSelectValue[];
+  WrapperProps?: React.HTMLProps<HTMLDivElement>;
+  LeftWrapperProps?: React.HTMLProps<HTMLDivElement>;
+  RightWrapperProps?: React.HTMLProps<HTMLDivElement>;
+  ButtonGroupProps?: IButtonGroupProps;
+  ToRightButtonProps?: IButtonProps;
+  AllToRightButtonProps?: IButtonProps;
+  AllToLeftButtonProps?: IButtonProps;
+  ToLeftButtonProps?: IButtonProps;
+  LeftControlGroupProps?: IControlGroupProps;
+  LeftInputGroupProps?: IInputGroupProps;
+  LeftButtonProps?: IButtonProps;
+  RightControlGroupProps?: IControlGroupProps;
+  RightInputGroupProps?: IInputGroupProps;
+  RightButtonProps?: IButtonProps;
+  LeftMenuProps?: IMenuProps;
+  LeftMenuItemProps?: IMenuItemProps;
+  RightMenuProps?: IMenuProps;
+  RightMenuItemProps?: IMenuItemProps;
+}
+
+declare const DualListSelect: React.ComponentType<DualListSelectProps & FormGroupProps & UseFieldApiComponentConfig>
+
+export default DualListSelect;

packages/blueprint-component-mapper/src/files/dual-list-select.js

@@ -241,7 +241,6 @@ DualListInternal.propTypes = {
   filterValues: PropTypes.func,
   rightValues: PropTypes.array,
   handleValuesClick: PropTypes.func,
-  FormFieldGridProps: PropTypes.object,
   WrapperProps: PropTypes.object,
   LeftWrapperProps: PropTypes.object,
   RightWrapperProps: PropTypes.object,

packages/blueprint-component-mapper/src/files/field-array.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from "react";
+import { FieldArrayField } from "@data-driven-forms/react-form-renderer";
+import { IButtonProps, IFormGroupProps } from "@blueprintjs/core";
+
+export interface FieldArrayButtonLabels {
+  add: ReactNode;
+  remove: ReactNode;
+}
+
+export interface FieldArrayProps {
+  label?: ReactNode;
+  description?: ReactNode;
+  fields: FieldArrayField[];
+  defaultItem?: any;
+  minItems?: number;
+  maxItems?: number;
+  noItemsMessage?: ReactNode;
+  name: string;
+  buttonLabels?: FieldArrayButtonLabels;
+  AddContainerProps?: React.HTMLProps<HTMLDivElement>;
+  AddButtonProps?: IButtonProps;
+  RemoveButtonProps?: IButtonProps;
+  ArrayItemProps?: React.HTMLProps<HTMLDivElement>;
+  FormGroupProps?: IFormGroupProps;
+  FieldArrayProps?: React.HTMLProps<HTMLDivElement>;
+  validateOnMount?: boolean;
+  helperText?: ReactNode;
+  isRequired?: boolean;
+}
+
+declare const FieldArray: React.ComponentType<FieldArrayProps>;
+
+export default FieldArray;

packages/blueprint-component-mapper/src/files/form-group.d.ts

@@ -0,0 +1,27 @@
+import { UseFieldApiComponentConfig, AnyObject } from "@data-driven-forms/react-form-renderer";
+import { IFormGroupProps } from '@blueprintjs/core';
+import { ReactNode } from "react";
+
+export interface FormGroupProps extends IFormGroupProps {
+  isDisabled?: boolean;
+  FormGroupProps?: IFormGroupProps;
+  isReadOnly?: boolean;
+  isRequired?: boolean;
+  helperText?: ReactNode;
+  label?: ReactNode;
+  validateOnMount?: boolean;
+  description?: ReactNode;
+  hideLabel?: boolean;
+}
+
+export interface FormGroupInternalProps extends FormGroupProps {
+  meta: AnyObject;
+  input: AnyObject;
+  Component: React.ComponentType;
+}
+
+export const FormGroupInternal: React.ComponentType<FormGroupInternalProps>;
+
+declare const FormGroup: React.ComponentType<FormGroupProps & UseFieldApiComponentConfig>;
+
+export default FormGroup;

packages/blueprint-component-mapper/src/files/form-template.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from "react";
+
+export interface FormTemplateProps {
+  requiredLabelInfo?: ReactNode;
+  formWrapperProps?: React.HTMLProps<HTMLFormElement>;
+  showFormControls?: boolean;
+  disableSubmit: string[];
+}
+
+declare const FormTemplate: React.ComponentType<FormTemplateProps>;
+
+export default FormTemplate;