@iimm/formily-mui
Version:
form field components based on @mui/material and @formily/react
59 lines (58 loc) • 2.1 kB
TypeScript
import { type ReactNode } from "react";
import { type GridProps } from "@mui/material";
export declare const FormLayoutContext: import("react").Context<IFormLayoutContext>;
export declare const useFormLayout: () => IFormLayoutContext;
export declare const FormLayout: import("react").MemoExoticComponent<import("@formily/react").ReactFC<Omit<FormLayoutProps & {
children?: ReactNode;
}, "ref">>>;
export interface FormLayoutCols {
xs?: GridProps["xs"];
sm?: GridProps["xs"];
md?: GridProps["xs"];
lg?: GridProps["xs"];
xl?: GridProps["xs"];
}
interface IFormLayoutContext extends CommonLayoutProps {
/** 传递给下层formField，是否包裹FormItemBase
* @default true
*/
withFormItem?: boolean;
}
export interface CommonLayoutProps {
/** Input Select组件显示border上的标签 */
showInnerLabel?: boolean;
/** lable/title显示的位置 */
labelPosition?: "top" | "left" | "inner";
labelWidth?: number | string;
labelAlign?: "left" | "right";
labelWrap?: boolean;
wrapperAlign?: "left" | "right";
wrapperWrap?: boolean;
wrapperWidth?: number | string;
/**
* 子项fullWidth?
* @default true
*/
fullWidth?: boolean;
/** label/title显示冒号? */
colon?: boolean;
tooltipIcon?: ReactNode;
/** 帮助文本显示方式, text:在问题上显示tooltip, icon:在图标上显示tooltip */
tooltipLayout?: "text" | "icon";
/** 显示反馈/错误信息? */
showFeedback?: boolean;
/** 反馈/错误文本显示方式： text：以文本方式显示在组件下方, popover:以在图片上的tooltip方式显示在组件右侧 */
feedbackLayout?: "popover" | "text";
/** 手动指定不从外层Field获取信息 */
noField?: boolean;
keepFeedbackSpace?: boolean;
}
export interface FormLayoutProps extends IFormLayoutContext, Omit<GridProps, "item"> {
/** 手动指定无需获取form信息 */
noForm?: boolean;
/** 默认Grid布局
* @default { xs: 6, sm: 4, md: 3, xl: 2 }
*/
defaultCols?: FormLayoutCols;
}
export {};