feat: add button

components/button/button-helper.tsx

@@ -0,0 +1,67 @@
+const rxTwoCNChar = /^[\u4E00-\u9FA5]{2}$/
+export const isTwoCNChar = rxTwoCNChar.test.bind(rxTwoCNChar)
+
+export function isUnBorderedButtonType(type?: ButtonType) {
+  return type === 'text' || type === 'link'
+}
+//
+// function splitCNCharsBySpace(child: VNodeChild , needInserted: boolean) {
+//     if (child === null || child === undefined) {
+//         return;
+//     }
+//
+//     const SPACE = needInserted ? ' ' : '';
+//
+//     if (
+//         typeof child !== 'string' &&
+//         typeof child !== 'number' &&
+//         isString((child as VNode)) &&
+//         isTwoCNChar((child as VNode).children)
+//     ) {
+//         return cloneVNode(child as , {
+//             children: child.props.children.split('').join(SPACE),
+//         });
+//     }
+//
+//     if (typeof child === 'string') {
+//         return isTwoCNChar(child) ? <span>{child.split('').join(SPACE)}</span> : <span>{child}</span>;
+//     }
+//
+//     if (isFragment(child)) {
+//         return <span>{child}</span>;
+//     }
+//
+//     return child;
+// }
+//
+// export function spaceChildren(children: React.ReactNode, needInserted: boolean) {
+//     let isPrevChildPure: boolean = false;
+//     const childList: React.ReactNode[] = [];
+//
+//     React.Children.forEach(children, (child) => {
+//         const type = typeof child;
+//         const isCurrentChildPure = type === 'string' || type === 'number';
+//         if (isPrevChildPure && isCurrentChildPure) {
+//             const lastIndex = childList.length - 1;
+//             const lastChild = childList[lastIndex];
+//             childList[lastIndex] = `${lastChild}${child}`;
+//         } else {
+//             childList.push(child);
+//         }
+//
+//         isPrevChildPure = isCurrentChildPure;
+//     });
+//
+//     return React.Children.map(childList, (child) =>
+//         splitCNCharsBySpace(child as React.ReactElement | string | number, needInserted),
+//     );
+// }
+
+const ButtonTypes = ['default', 'primary', 'ghost', 'dashed', 'link', 'text'] as const
+export type ButtonType = (typeof ButtonTypes)[number]
+
+const ButtonShapes = ['default', 'circle', 'round'] as const
+export type ButtonShape = (typeof ButtonShapes)[number]
+
+const ButtonHTMLTypes = ['submit', 'button', 'reset'] as const
+export type ButtonHTMLType = (typeof ButtonHTMLTypes)[number]

components/button/button.tsx

@@ -2,18 +2,14 @@ import { computed, defineComponent } from 'vue'
 import { useProviderConfigState } from '../config-provider/context'
 import Wave from '../_util/wave'
 import useStyle from './style'
+import { buttonProps } from './interface'
 
 const Button = defineComponent({
   name: 'AButton',
   inheritAttrs: false,
+  __ANT_BUTTON: true,
   props: {
-    prefixCls: {
-      type: String
-    },
-    type: {
-      type: String,
-      default: 'default'
-    }
+    ...buttonProps
   },
   setup(props, { slots, attrs }) {
     const { getPrefixCls } = useProviderConfigState()

components/button/interface.ts

@@ -0,0 +1,21 @@
+import { booleanType, someType, stringType, vNodeType } from '@v-c/utils'
+import type { ExtractPropTypes } from 'vue'
+import type { SizeType } from '../config-provider/context'
+import type { ButtonHTMLType, ButtonShape, ButtonType } from './button-helper'
+
+export const buttonProps = {
+  type: stringType<ButtonType>('default'),
+  icon: vNodeType(),
+  shape: stringType<ButtonShape>(),
+  size: someType<SizeType | 'default'>([String], 'default'),
+  disabled: booleanType(),
+  loading: someType<boolean | { delay?: number }>(),
+  prefixCls: stringType(),
+  rootClassName: stringType(),
+  ghost: booleanType(),
+  danger: booleanType(),
+  block: booleanType(),
+  htmlType: stringType<ButtonHTMLType>('button')
+}
+
+export type ButtonProps = ExtractPropTypes<typeof buttonProps>