Merge pull request #346 from oceanbase/dengfuping-ui

feat(ui): Export components' TypeScript definition

packages/charts/src/index.ts

@@ -2,6 +2,8 @@ import './index.less';
 
 export * from '@ant-design/charts';
 
+export { version } from '../package.json';
+
 export { default as Stat } from './Stat';
 export type { StatConfig } from './Stat';
 

packages/ui/src/Action/index.ts

@@ -1,4 +1,6 @@
 import Group from './Group';
 import { ActionButton, ActionLink } from './Item';
 
+export type { GroupProps as ActionGroupProps } from './Group';
+
 export default { Group, Button: ActionButton, Link: ActionLink };

packages/ui/src/BatchOperationBar/index.tsx

@@ -19,7 +19,7 @@ export type RenderFun = ((props: AlertRenderParams) => ReactNode) | false;
 export type Vertical = 'top' | 'bottom';
 export type Horizontal = 'left' | 'right';
 
-export interface Props extends LocaleWrapperProps {
+export interface BatchOperationBarProps extends LocaleWrapperProps {
   width?: number | string;
   title?: ReactNode;
   selectedRows?: any[];
@@ -41,7 +41,7 @@ export interface Props extends LocaleWrapperProps {
 
 const prefix = 'ob-batch-operation-bar';
 
-const BatchOperationBar = (props: Props) => {
+const BatchOperationBar = (props: BatchOperationBarProps) => {
   const locale = props?.locale;
   const {
     title,

packages/ui/src/Dialog/index.tsx

@@ -31,17 +31,17 @@ const DEFAULT_BORDER_WIDTH = 24;
 // 预留滚动条宽度
 const SCROLL_BAR_WIDTH = 1;
 
-export interface IDialogLocale {
+export interface DialogLocale {
   helpDocument: string;
   openHelpCenter: string;
 }
 
-export interface IDialogExtLink {
+export interface DialogExtLink {
   text?: string;
   link: string;
 }
 
-export interface IDialogProps extends LocaleWrapperProps {
+export interface DialogProps extends LocaleWrapperProps {
   className?: string;
   visible?: boolean;
   children?: React.ReactNode;
@@ -58,15 +58,15 @@ export interface IDialogProps extends LocaleWrapperProps {
   resizable?: boolean;
   draggable?: boolean;
   enableMaximization?: boolean;
-  locale?: IDialogLocale;
-  extLink?: IDialogExtLink;
+  locale?: DialogLocale;
+  extLink?: DialogExtLink;
   // 内部修改外部容器宽度
   setRootWidth?: (newWidth: string) => void;
   // 是否嵌入模式
   isEmbed?: boolean;
 }
 
-interface IDialogStates {
+interface DialogState {
   mask?: boolean;
   width?: number;
   height?: number;
@@ -79,7 +79,7 @@ interface IDialogStates {
   headerStyle?: Record<string, any>;
 }
 
-class DialogComp extends React.PureComponent<IDialogProps, IDialogStates> {
+class DialogComp extends React.PureComponent<DialogProps, DialogState> {
   state = {
     mask: true,
     width: this.props.width ?? DEFAULT_WIDTH_MEMBER,
@@ -135,7 +135,7 @@ class DialogComp extends React.PureComponent<IDialogProps, IDialogStates> {
     DialogComp.container.appendChild(this.host);
   }
 
-  componentDidUpdate(prevProps: Readonly<IDialogProps>, _: Readonly<IDialogStates>): void {
+  componentDidUpdate(prevProps: Readonly<DialogProps>, _: Readonly<DialogState>): void {
     const {
       visible: preVisible,
       clientWidth: preClientWidth,
@@ -546,7 +546,7 @@ class DialogComp extends React.PureComponent<IDialogProps, IDialogStates> {
   checkSize(width: number, height: number) {
     const { max } = this;
     const { min } = this;
-    const newModel: IDialogStates = {};
+    const newModel: DialogState = {};
 
     const result = {
       widthShouldChange: true,

packages/ui/src/DocDialog/index.tsx

@@ -1,6 +1,6 @@
 import { debounce } from 'lodash';
 import React, { useEffect, useMemo, useState } from 'react';
-import type { IDialogProps } from '../Dialog';
+import type { DialogProps } from '../Dialog';
 import Dialog from '../Dialog';
 import type { LocaleWrapperProps } from '../locale/LocaleWrapper';
 import LocaleWrapper from '../locale/LocaleWrapper';
@@ -12,7 +12,7 @@ const MIN_EMBED_WIDTH = 0.3;
 const DEFAULT_MOBILE_CLIENT_WIDTH = 1280;
 const DEFAULT_TOP_HEIGHT = 0;
 
-interface IDialogConfig {
+interface DialogConfig {
   height?: number;
   width?: number;
   top?: number;
@@ -21,21 +21,21 @@ interface IDialogConfig {
   max?: [number, number];
 }
 
-export interface IDocDialogProps extends LocaleWrapperProps {
+export interface DocDialogProps extends LocaleWrapperProps {
   className?: string;
   title?: string;
   fallbackUrl: string;
   docUrls?: Record<string, string>;
-  embedConfig?: IDialogConfig;
-  normalConfig?: IDialogConfig;
+  embedConfig?: DialogConfig;
+  normalConfig?: DialogConfig;
   normalModeWidth?: number;
   defautTop?: number;
   visible: boolean;
   setRootWidth: (newWidth: string) => void;
   setVisible: (payload: boolean) => void;
 }
 
-const DocDialogComp = (props: IDocDialogProps) => {
+const DocDialogComp = (props: DocDialogProps) => {
   const {
     fallbackUrl,
     docUrls,
@@ -74,7 +74,7 @@ const DocDialogComp = (props: IDocDialogProps) => {
   const DialogProps = useMemo(() => {
     const maxDialogHeight = clientHeight - defautTop;
 
-    let result: IDialogProps = {
+    let result: DialogProps = {
       className,
       visible,
       title,

packages/ui/src/IconFont/index.tsx

@@ -2,7 +2,7 @@ import { createFromIconfontCN } from '@oceanbase/icons';
 import React from 'react';
 import './font/iconfont.css';
 
-interface IconFontProps {
+export interface IconFontProps {
   type: string;
   className?: string;
   style?: React.CSSProperties;

packages/ui/src/NavMenu/index.tsx

@@ -8,24 +8,24 @@ import './index.less';
 
 const prefix = getPrefix('menu');
 
-export interface IMenu {
+export interface NavMenuItem {
   key: string;
   title: string;
   link: string | string[];
   disabled?: boolean;
   openNewTab?: boolean; // 不在本应用内打开
   href?: boolean;
   id?: string;
-  children?: IMenu[];
+  children?: NavMenuItem[];
 }
 
-interface MenuProps {
-  menuList: IMenu[];
+export interface NavMenuProps {
+  menuList: NavMenuItem[];
   className?: string;
   style?: React.CSSProperties;
 }
 
-export default (props: MenuProps) => {
+export default (props: NavMenuProps) => {
   const { menuList, className, style } = props;
   const [selectedKeys, setSelectedKeys] = useState(['0']);
   const [menus, setMenus] = useState([]);

packages/ui/src/Ranger/Ranger.tsx

@@ -31,7 +31,8 @@ export type RangeDateValue = {
   range: RangeValue;
 };
 
-interface RangerProps extends Omit<RangePickerProps, 'mode' | 'picker' | 'value' | 'defaultValue'> {
+export interface RangerProps
+  extends Omit<RangePickerProps, 'mode' | 'picker' | 'value' | 'defaultValue'> {
   // 数据相关
   selects?: RangeOption[];
   defaultQuickValue?: string;

packages/ui/src/TreeSearch/index.tsx

@@ -32,7 +32,7 @@ export interface TreeSearchRef {
   invertSelect: () => void;
 }
 
-interface TreeSearchProps {
+export interface TreeSearchProps {
   treeData: Node[];
   titleRender?: (nodeData: DataNode) => React.ReactNode;
   checkable?: boolean;
@@ -47,7 +47,7 @@ interface TreeSearchProps {
   followLeaf?: boolean;
   /** 异步请求节点数据的回调函数 */
   loadData?: (data: unknown) => Promise<void>;
-  searchStyle?: {};
+  searchStyle?: React.CSSProperties;
 }
 
 export default forwardRef<TreeSearchRef, TreeSearchProps>(

packages/ui/src/index.ts

@@ -1,34 +1,56 @@
 import './index.less';
 
 export * from '@ant-design/pro-components';
+
 export { version } from '../package.json';
+
+export * from './constant';
+
+export * from './interface';
+
 export { default as Action } from './Action';
-export {
-  BackgroundTaskManagerConstants,
-  default as BackgroundTaskManager,
-} from './BackgroundTaskManager';
-export type {
-  BackgroundTaskManagerRef,
-  ITaskMgrPreset,
-  ITaskMgrQueue,
-  TaskMgrID,
-} from './BackgroundTaskManager';
+export type { ActionGroupProps } from './Action';
+
 export { default as BasicLayout } from './BasicLayout';
+export type { BasicLayoutProps } from './BasicLayout';
+
 export { default as BatchOperationBar } from './BatchOperationBar';
+export type { BatchOperationBarProps } from './BatchOperationBar';
+
 export { default as Boundary } from './Boundary';
-export * from './constant';
+
 export { default as ContentWithQuestion } from './ContentWithQuestion';
+export type { ContentWithQuestionProps } from './ContentWithQuestion';
+
 export { default as ContentWithIcon } from './ContentWithIcon';
+export type { ContentWithIconProps } from './ContentWithIcon';
+
 export { default as Dialog } from './Dialog';
+export type { DialogProps } from './Dialog';
+
 export { default as DocDialog } from './DocDialog';
+export type { DocDialogProps } from './DocDialog';
+
 export { default as FullscreenBox } from './FullscreenBox';
+export type { FullscreenBoxProps } from './FullscreenBox';
+
 export { default as GraphToolbar } from './GraphToolbar';
+export type { GraphToolbarProps } from './GraphToolbar';
+
 export { default as Highlight } from './Highlight';
+export type { HighlightProps } from './Highlight';
+
 export { default as IconFont } from './IconFont';
-export * from './interface';
+export type { IconFontProps } from './IconFont';
+
 export { default as Login } from './Login';
+export type { LoginProps } from './Login';
+
 export { default as Lottie } from './Lottie';
+export type { LottieProps } from './Lottie';
+
 export { default as NavMenu } from './NavMenu';
+export type { NavMenuProps, NavMenuItem } from './NavMenu';
 
 export { default as PageContainer } from './PageContainer';
 export type { PageContainerProps } from './PageContainer';
@@ -37,9 +59,32 @@ export { default as FooterToolbar } from './FooterToolbar';
 export type { FooterToolbarProps } from './FooterToolbar';
 
 export { default as Password } from './Password';
+export type { PasswordProps } from './Password';
+
 export { default as Ranger } from './Ranger';
+export type { RangerProps } from './Ranger';
+
 export { default as SideTip } from './SideTip';
+export type { SideTipProps } from './SideTip';
+
 export { default as TaskGraph } from './TaskGraph';
+export type { TaskGraphProps } from './TaskGraph';
+
 export { default as TreeSearch } from './TreeSearch';
+export type { TreeSearchProps, TreeSearchRef } from './TreeSearch';
+
 export { default as Welcome } from './Welcome';
+export type { WelcomeProps } from './Welcome';
+
 export { default as TagSelect } from './TagSelect';
+
+export {
+  BackgroundTaskManagerConstants,
+  default as BackgroundTaskManager,
+} from './BackgroundTaskManager';
+export type {
+  BackgroundTaskManagerRef,
+  ITaskMgrPreset,
+  ITaskMgrQueue,
+  TaskMgrID,
+} from './BackgroundTaskManager';

packages/util/src/index.ts

@@ -1,3 +1,5 @@
+export { version } from '../package.json';
+
 export * from './format';
 export * from './robust';
 export * from './sort';