@progress/kendo-react-form 13.3.0 → 13.4.0-develop.2

package/Field.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { FieldProps } from './interfaces/FieldProps.js';
+import * as React from 'react';
+/**
+ * Represents the Field component that is used inside the KendoReact Form component.
+ * It uses `name` property to access field value and meta information from Form state.
+ */
+export declare const Field: {
+    (props: FieldProps & {
+        [customProp: string]: any;
+    }): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
+    displayName: string;
+};

package/FieldArray.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { FieldArrayProps } from './interfaces/FieldArrayProps.js';
+import * as React from 'react';
+/**
+ * Represents the FieldArray component that is used inside the KendoReact Form component.
+ * It provides methods via render props for common array manipulations.
+ */
+export declare const FieldArray: React.FunctionComponent<FieldArrayProps>;

package/FieldWrapper.d.ts

@@ -0,0 +1,45 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { FormClassStructure } from '@progress/kendo-react-common';
+import { ResponsiveFormBreakPoint } from './interfaces/ResponsiveFormBreakPoint.js';
+import * as React from 'react';
+/**
+ * Represents the props of the KendoReact FieldWrapper component.
+ */
+export interface FieldWrapperProps {
+    /**
+     * @hidden
+     */
+    children: any;
+    /**
+     * The styles that are applied to the FieldWrapper.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets a class for the FieldWrapper DOM element.
+     */
+    className?: string;
+    /**
+     * Specifies the direction of the content.
+     */
+    dir?: string;
+    /**
+     * Defines the colspan for the form field element related to the parent Form component columns. Can be a number or an array of responsive breakpoints.
+     */
+    colSpan?: number | ResponsiveFormBreakPoint[];
+    /**
+     * @hidden
+     */
+    unstyled?: FormClassStructure;
+}
+/**
+ * Represents the KendoReact FieldWrapper component.
+ * It's designed to wrap the field editor, Label, Hint and Error components.
+ * The FieldWrapper supports only single editor inside it.
+ */
+export declare const FieldWrapper: React.FunctionComponent<FieldWrapperProps>;

package/Form.d.ts

@@ -0,0 +1,274 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { default as PropTypes } from 'prop-types';
+import { FieldValidatorType } from './interfaces/FieldValidator.js';
+import { FormProps } from './interfaces/FormProps.js';
+import { KeyValue } from './interfaces/KeyValue.js';
+import * as React from 'react';
+/**
+ * Represents the [KendoReact Form component](https://www.telerik.com/kendo-react-ui/components/form).
+ *
+ * @example
+ * ```jsx
+ * export const FormInput = (fieldRenderProps) => {
+ *     const onValueChange = React.useCallback(
+ *         (event) => fieldRenderProps.onChange(event.target.value),
+ *         [fieldRenderProps.onChange]
+ *     );
+ *     return (
+ *         <input
+ *             className={'k-input'}
+ *             value={fieldRenderProps.value}
+ *             onChange={onValueChange}
+ *         />
+ *     );
+ * };
+ *
+ * export const App = () => {
+ *     const handleSubmit = (dataItem) => alert(JSON.stringify(dataItem));
+ *     return (
+ *         <Form
+ *             initialValues={{title: ''}}
+ *             onSubmit={handleSubmit}
+ *             render={(formRenderProps) => (
+ *                 <div>
+ *                     <Field name={'title'} component={FormInput} />
+ *                     <Button
+ *                         disabled={!formRenderProps.allowSubmit}
+ *                         onClick={formRenderProps.onSubmit}
+ *                     >
+ *                         Submit
+ *                     </Button>
+ *                 </div>
+ *             )}
+ *         />
+ *     );
+ * };
+ * ```
+ */
+export declare class Form extends React.Component<FormProps, {}> {
+    /**
+     * @hidden
+     */
+    static displayName: string;
+    /**
+     * @hidden
+     */
+    static propTypes: {
+        initialValues: PropTypes.Requireable<any>;
+        onSubmit: PropTypes.Requireable<(...args: any[]) => any>;
+        onSubmitClick: PropTypes.Requireable<(...args: any[]) => any>;
+        render: PropTypes.Validator<(...args: any[]) => any>;
+        id: PropTypes.Requireable<string>;
+    };
+    private _key?;
+    private _touched;
+    private _visited;
+    private _modified;
+    private _validatorsByField;
+    private _values;
+    private _fields;
+    private _unmounted;
+    private _submitted;
+    private readonly showLicenseWatermark;
+    private readonly licenseMessage?;
+    /**
+     * @hidden
+     */
+    private _accumulatorTimeout;
+    /**
+     * @hidden
+     */
+    get touched(): KeyValue<boolean>;
+    /**
+     * @hidden
+     */
+    set touched(value: KeyValue<boolean>);
+    /**
+     * @hidden
+     */
+    get visited(): KeyValue<boolean>;
+    /**
+     * @hidden
+     */
+    set visited(value: KeyValue<boolean>);
+    /**
+     * @hidden
+     */
+    get modified(): KeyValue<boolean>;
+    /**
+     * @hidden
+     */
+    set modified(value: KeyValue<boolean>);
+    /**
+     * @hidden
+     */
+    get validatorsByField(): KeyValue<(FieldValidatorType | FieldValidatorType[] | undefined)[]>;
+    /**
+     * @hidden
+     */
+    set validatorsByField(value: KeyValue<(FieldValidatorType | FieldValidatorType[] | undefined)[]>);
+    /**
+     * @hidden
+     */
+    get values(): KeyValue<any>;
+    /**
+     * @hidden
+     */
+    set values(value: KeyValue<any>);
+    /**
+     * @hidden
+     */
+    get fields(): string[];
+    /**
+     * @hidden
+     */
+    get formErrors(): KeyValue<string> | undefined;
+    /**
+     * @hidden
+     */
+    get errors(): KeyValue<string>;
+    /**
+     * @hidden
+     */
+    constructor(props: FormProps);
+    /**
+     * @hidden
+     */
+    componentWillUnmount(): void;
+    /**
+     * @hidden
+     */
+    isValid: () => boolean;
+    /**
+     * @hidden
+     */
+    accumulatedForceUpdate: () => void;
+    /**
+     * @hidden
+     */
+    resetForm: () => void;
+    /**
+     * Method for resetting the form state outside the form component.
+     *
+     * > Use `onReset` only if you cannot achieve the desired behavior through the Field component or by FormRenderProps.
+     */
+    onReset: () => void;
+    /**
+     * @hidden
+     */
+    addField: (field: string) => void;
+    /**
+     * @hidden
+     */
+    onSubmit: (event: React.SyntheticEvent<any>) => void;
+    /**
+     * Method for emiting changes to a specific field outside the form component.
+     *
+     * > Use `onChange` only if you cannot achieve the desired behavior through the Field component by FormRenderProps.
+     */
+    onChange: (name: string, options: {
+        value: any;
+    }) => void;
+    /**
+     * @hidden
+     */
+    onFocus: (name: string, skipForceUpdate?: boolean) => void;
+    /**
+     * @hidden
+     */
+    onBlur: (name: string, skipForceUpdate?: boolean) => void;
+    /**
+     * @hidden
+     */
+    onFieldRegister: (name: string, validator: FieldValidatorType | FieldValidatorType[] | undefined) => () => void;
+    /**
+     * @hidden
+     */
+    isFormValid: (errors: KeyValue<any>) => boolean;
+    /**
+     * @hidden
+     */
+    isFormModified: (modified: KeyValue<boolean>, fields: string[]) => boolean;
+    /**
+     * @hidden
+     */
+    isFormHasNotTouched: (touched: KeyValue<boolean>, fields: string[]) => boolean;
+    /**
+     * @hidden
+     */
+    isFormTouched: (touched: KeyValue<boolean>, fields: string[]) => boolean;
+    /**
+     * @hidden
+     */
+    isFormVisited: (visited: KeyValue<boolean>, fields: string[]) => boolean;
+    /**
+     * @hidden
+     */
+    valueGetter: (fieldName: string) => any;
+    /**
+     * @hidden
+     */
+    valueSetter: (fieldName: string, value: any) => any;
+    /**
+     * @hidden
+     */
+    onArrayAction: (name: string) => void;
+    /**
+     * @hidden
+     */
+    onInsert: (name: string, options: {
+        value: any;
+        index: number;
+    }) => void;
+    /**
+     * @hidden
+     */
+    onUnshift: (name: string, options: {
+        value: any;
+    }) => void;
+    /**
+     * @hidden
+     */
+    onPush: (name: string, options: {
+        value: any;
+    }) => void;
+    /**
+     * @hidden
+     */
+    onPop: (name: string) => any;
+    /**
+     * @hidden
+     */
+    onRemove: (name: string, options: {
+        index: number;
+    }) => any;
+    /**
+     * @hidden
+     */
+    onReplace: (name: string, options: {
+        value: any;
+        index: number;
+    }) => void;
+    /**
+     * @hidden
+     */
+    onMove: (name: string, options: {
+        prevIndex: number;
+        nextIndex: number;
+    }) => void;
+    /**
+     * @hidden
+     */
+    render(): React.JSX.Element;
+}
+/**
+ * Represent the `ref` of the Form component.
+ */
+export interface FormHandle extends Pick<Form, keyof Form> {
+}

package/FormContext.d.ts

@@ -0,0 +1,57 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { FieldValidatorType } from './interfaces/FieldValidator.js';
+import * as React from 'react';
+/** @hidden */
+export type FormContextType = {
+    onSubmit: (event: React.SyntheticEvent<any>) => void;
+    onChange: (name: string, options: {
+        value: any;
+    }) => void;
+    onFocus: (name: string) => void;
+    onBlur: (name: string) => void;
+    onUnshift: (name: string, options: {
+        value: any;
+    }) => void;
+    onPush: (name: string, options: {
+        value: any;
+    }) => void;
+    onInsert: (name: string, options: {
+        index: number;
+        value: any;
+    }) => void;
+    onPop: (name: string) => any;
+    onRemove: (name: string, options: {
+        index: number;
+    }) => any;
+    onReplace: (name: string, options: {
+        index: number;
+        value: any;
+    }) => void;
+    onMove: (name: string, options: {
+        prevIndex: number;
+        nextIndex: number;
+    }) => void;
+    registerField: (name: string, validator: FieldValidatorType | FieldValidatorType[] | undefined) => void;
+    valueGetter: (name: string) => any;
+    errors: {
+        [name: string]: string;
+    };
+    touched: {
+        [name: string]: boolean;
+    };
+    visited: {
+        [name: string]: boolean;
+    };
+    modified: {
+        [name: string]: boolean;
+    };
+    id: string;
+};
+/** @hidden */
+export declare const FormContext: React.Context<FormContextType | null>;

package/FormElement.d.ts

@@ -0,0 +1,95 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { FormClassStructure } from '@progress/kendo-react-common';
+import { ResponsiveFormBreakPoint } from './interfaces/ResponsiveFormBreakPoint.js';
+import { Gutters } from './interfaces/Gutters.js';
+import * as React from 'react';
+/**
+ * @hidden
+ */
+export declare const DEFAULT_FORM_GUTTERS: {
+    cols?: number | string | null;
+    rows?: number | string | null;
+};
+/**
+ * Represents the props of the KendoReact FormElement component.
+ */
+export interface FormElementProps {
+    /**
+     * @hidden
+     */
+    children?: any;
+    /**
+     * The styles that are applied to the form DOM element.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets a class for the form DOM element.
+     */
+    className?: string;
+    /**
+     * If set to `true` enable the horizontal layout of the form editors.
+     */
+    horizontal?: boolean;
+    /**
+     * Sets the id of the form DOM element. Takes priority over the Form's id.
+     */
+    id?: string;
+    /**
+     * Defines the number of columns in the form. Can be a number or an array of responsive breakpoints.
+     */
+    cols?: number | ResponsiveFormBreakPoint[];
+    /**
+     * Defines the gutters for the form. You can specify gutters for rows and columns. Number is equivalent to px.
+     */
+    gutters?: string | number | Gutters | ResponsiveFormBreakPoint[];
+    /**
+     * @hidden
+     */
+    [customProp: string]: any;
+    /**
+     * Configures the `size` of the Form.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     *
+     * @default undefined (theme-controlled)
+     *
+     * @example
+     * ```jsx
+     * <FormElement size="large" />
+     * ```
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * @hidden
+     */
+    unstyled?: FormClassStructure;
+}
+/**
+ * Represent the `ref` of the FormElement component.
+ */
+export interface FormElementHandle {
+    /**
+     * Represents the props of the FormElement component.
+     */
+    props: FormElementProps;
+    /**
+     * Represents the element of the FormElement component.
+     */
+    element: HTMLFormElement | null;
+}
+/**
+ * Represents the KendoReact FormElement component.
+ * It's small wrapper around HTML form element which automatically attach the
+ * Form component's `onSubmit` render prop and Kendo CSS classes.
+ * Other props are passed to the DOM node.
+ */
+export declare const FormElement: React.FunctionComponent<FormElementProps>;

package/FormElement.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),u=require("@progress/kendo-react-common"),_=require("./FormContext.js"),s=require("./utils.js");function M(t){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const r in t)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(t,r);Object.defineProperty(o,r,n.get?n:{enumerable:!0,get:()=>t[r]})}}return o.default=t,Object.freeze(o)}const e=M(G),a={rows:"0px",cols:"32px"},N=e.forwardRef((t,o)=>{const r={size:"medium",...t},n=e.useRef(null),S=e.useRef(null);e.useImperativeHandle(S,()=>({element:n.current,props:r})),e.useImperativeHandle(o,()=>S.current);const c=e.useContext(_.FormContext),{className:F,style:j,horizontal:g,size:R,cols:l,gutters:i=a,...O}=r,p=u.useUnstyled(),v=p&&p.uForm,[h,w]=e.useState(void 0),[T,b]=e.useState(void 0),C=e.useMemo(()=>{if(g)return"horizontal";if(g===!1)return"vertical"},[g]),z=e.useMemo(()=>u.classNames(u.uForm.form({c:v,size:R,orientation:C}),F),[F,v,C,R]);return e.useEffect(()=>{if(!l&&!i){w(void 0);return}if(!i){b(void 0);return}const E=()=>{let f=0;if(n.current?f=s.innerWidth(n.current):typeof window!="undefined"&&(f=window.innerWidth),l){const y=s.calculateColumns(l,f);w(s.generateColumnClass(y))}if(i){const y=s.calculateGutters(i,f);b(y?{gap:s.generateGuttersStyling(y,a)}:{gap:s.generateGuttersStyling(a,a)})}};E();let m;const d=n.current;return d&&typeof window!="undefined"&&"ResizeObserver"in window&&(m=new ResizeObserver(E),m.observe(d)),()=>{m&&d&&m.unobserve(d)}},[l,i]),e.createElement("form",{ref:n,...O,id:t.id||(c?c.id:void 0),style:t.style,className:z,onSubmit:c?c.onSubmit:void 0},l?e.createElement("div",{className:u.classNames(u.uForm.formLayout({c:v}),h),style:T},t.children):t.children)});N.displayName="KendoReactFormElement";exports.DEFAULT_FORM_GUTTERS=a;exports.FormElement=N;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),a=require("@progress/kendo-react-common"),_=require("./FormContext.js"),o=require("./utils.js");function M(t){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const r in t)if(r!=="default"){const n=Object.getOwnPropertyDescriptor(t,r);Object.defineProperty(s,r,n.get?n:{enumerable:!0,get:()=>t[r]})}}return s.default=t,Object.freeze(s)}const e=M(G),c={rows:"0px",cols:"32px"},N=e.forwardRef((t,s)=>{const r={size:void 0,...t},n=e.useRef(null),S=e.useRef(null);e.useImperativeHandle(S,()=>({element:n.current,props:r})),e.useImperativeHandle(s,()=>S.current);const u=e.useContext(_.FormContext),{className:F,style:j,horizontal:v,size:R,cols:l,gutters:i=c,...O}=r,p=a.useUnstyled(),g=p&&p.uForm,[h,w]=e.useState(void 0),[T,b]=e.useState(void 0),C=e.useMemo(()=>{if(v)return"horizontal";if(v===!1)return"vertical"},[v]),z=e.useMemo(()=>a.classNames(a.uForm.form({c:g,size:R,orientation:C}),F),[F,g,C,R]);return e.useEffect(()=>{if(!l&&!i){w(void 0);return}if(!i){b(void 0);return}const E=()=>{let f=0;if(n.current?f=o.innerWidth(n.current):typeof window!="undefined"&&(f=window.innerWidth),l){const y=o.calculateColumns(l,f);w(o.generateColumnClass(y))}if(i){const y=o.calculateGutters(i,f);b(y?{gap:o.generateGuttersStyling(y,c)}:{gap:o.generateGuttersStyling(c,c)})}};E();let m;const d=n.current;return d&&typeof window!="undefined"&&"ResizeObserver"in window&&(m=new ResizeObserver(E),m.observe(d)),()=>{m&&d&&m.unobserve(d)}},[l,i]),e.createElement("form",{ref:n,...O,id:t.id||(u?u.id:void 0),style:t.style,className:z,onSubmit:u?u.onSubmit:void 0},l?e.createElement("div",{className:a.classNames(a.uForm.formLayout({c:g}),h),style:T},t.children):t.children)});N.displayName="KendoReactFormElement";exports.DEFAULT_FORM_GUTTERS=c;exports.FormElement=N;

package/FormElement.mjs

@@ -9,21 +9,21 @@ import * as e from "react";
 import { useUnstyled as L, classNames as g, uForm as h } from "@progress/kendo-react-common";
 import { FormContext as M } from "./FormContext.mjs";
 import { innerWidth as O, calculateColumns as T, generateColumnClass as U, calculateGutters as W, generateGuttersStyling as E } from "./utils.mjs";
-const m = {
+const c = {
   rows: "0px",
   cols: "32px"
 }, A = e.forwardRef((t, F) => {
-  const y = {
-    size: "medium",
+  const v = {
+    size: void 0,
     ...t
-  }, s = e.useRef(null), v = e.useRef(null);
-  e.useImperativeHandle(v, () => ({ element: s.current, props: y })), e.useImperativeHandle(F, () => v.current);
-  const n = e.useContext(M), { className: w, style: H, horizontal: c, size: p, cols: r, gutters: o = m, ...N } = y, C = L(), d = C && C.uForm, [z, R] = e.useState(void 0), [x, f] = e.useState(void 0), S = e.useMemo(() => {
-    if (c)
+  }, s = e.useRef(null), y = e.useRef(null);
+  e.useImperativeHandle(y, () => ({ element: s.current, props: v })), e.useImperativeHandle(F, () => y.current);
+  const n = e.useContext(M), { className: w, style: H, horizontal: m, size: p, cols: o, gutters: r = c, ...N } = v, C = L(), d = C && C.uForm, [z, R] = e.useState(void 0), [x, f] = e.useState(void 0), S = e.useMemo(() => {
+    if (m)
       return "horizontal";
-    if (c === !1)
+    if (m === !1)
       return "vertical";
-  }, [c]), G = e.useMemo(
+  }, [m]), G = e.useMemo(
     () => g(
       h.form({
         c: d,
@@ -35,23 +35,23 @@ const m = {
     [w, d, S, p]
   );
   return e.useEffect(() => {
-    if (!r && !o) {
+    if (!o && !r) {
       R(void 0);
       return;
     }
-    if (!o) {
+    if (!r) {
       f(void 0);
       return;
     }
     const b = () => {
       let a = 0;
-      if (s.current ? a = O(s.current) : typeof window != "undefined" && (a = window.innerWidth), r) {
-        const u = T(r, a);
+      if (s.current ? a = O(s.current) : typeof window != "undefined" && (a = window.innerWidth), o) {
+        const u = T(o, a);
         R(U(u));
       }
-      if (o) {
-        const u = W(o, a);
-        f(u ? { gap: E(u, m) } : { gap: E(m, m) });
+      if (r) {
+        const u = W(r, a);
+        f(u ? { gap: E(u, c) } : { gap: E(c, c) });
       }
     };
     b();
@@ -60,7 +60,7 @@ const m = {
     return l && typeof window != "undefined" && "ResizeObserver" in window && (i = new ResizeObserver(b), i.observe(l)), () => {
       i && l && i.unobserve(l);
     };
-  }, [r, o]), /* @__PURE__ */ e.createElement(
+  }, [o, r]), /* @__PURE__ */ e.createElement(
     "form",
     {
       ref: s,
@@ -70,7 +70,7 @@ const m = {
       className: G,
       onSubmit: n ? n.onSubmit : void 0
     },
-    r ? /* @__PURE__ */ e.createElement(
+    o ? /* @__PURE__ */ e.createElement(
       "div",
       {
         className: g(
@@ -87,6 +87,6 @@ const m = {
 });
 A.displayName = "KendoReactFormElement";
 export {
-  m as DEFAULT_FORM_GUTTERS,
+  c as DEFAULT_FORM_GUTTERS,
   A as FormElement
 };

package/FormFieldSet.d.ts

@@ -0,0 +1,67 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ResponsiveFormBreakPoint } from './interfaces/ResponsiveFormBreakPoint.js';
+import { Gutters } from './interfaces/Gutters.js';
+import * as React from 'react';
+/**
+ * @hidden
+ */
+export declare const DEFAULT_FIELDSET_GUTTERS: {
+    cols?: number | string | null;
+    rows?: number | string | null;
+};
+/**
+ * Represents the props of the KendoReact FormFieldSet component.
+ */
+export interface FormFieldSetProps {
+    /**
+     * Defines the number of columns of the fieldset. Can be a number or an array of responsive breakpoints.
+     */
+    cols?: number | ResponsiveFormBreakPoint[];
+    /**
+     * Defines the colspan for the fieldset related to the parent Form component columns. Can be a number or an array of responsive breakpoints.
+     */
+    colSpan?: number | ResponsiveFormBreakPoint[];
+    /**
+     * Defines the gutters for the fieldset. You can specify gutters for rows and columns. Number is equivalent to px.
+     */
+    gutters?: string | number | Gutters | ResponsiveFormBreakPoint[];
+    /**
+     * Defines the legend for the fieldset.
+     */
+    legend?: string;
+    /**
+     * @hidden
+     */
+    children?: any;
+    /**
+     * The styles that are applied to the form DOM element.
+     */
+    style?: React.CSSProperties;
+    /**
+     * Sets a class for the form DOM element.
+     */
+    className?: string;
+}
+/**
+ * Represent the `ref` of the FormFieldSet component.
+ */
+export interface FormFieldSetHandle {
+    /**
+     * Represents the props of the  FormFieldSet component.
+     */
+    props: FormFieldSetProps;
+    /**
+     * Represents the element of the FormFieldSet component.
+     */
+    element: HTMLFieldSetElement | null;
+}
+/**
+ * Represents the KendoReact FormFieldSet component.
+ */
+export declare const FormFieldSet: React.FunctionComponent<FormFieldSetProps>;