refactor(component): refactor the implementation of Button and IconButton (#7716)

## Button
- Remove props withoutHoverStyle
   refactor hover impl with independent layer, so that hover-color won't affect the background even if is overridden outside
- Update `type` (renamed to `variant`):
  - remove `processing` and `warning`
  - rename `default` with `secondary`
- Remove `shape` props
- Remove `icon` and `iconPosition`, replaced with `prefix: ReactNode` and `suffix: ReactNode`
- Integrate tooltip for more convenient usage
- New Storybook document
- Focus style

## IconButton
- A Wrapper base on `<Button />`
- Override Button size and variant
  - size: `'12' | '14' | '16' | '20' | '24' | number`
     These presets size are referenced from the design system.
  - variant:  `'plain' | 'solid' | 'danger' | 'custom'`
- Inset icon via Button 's prefix

## Fix
- fix some button related issues
- close AF-1159, AF-1160, AF-1161, AF-1162, AF-1163, AF-1158, AF-1157

## Storybook

![CleanShot 2024-08-03 at 14.57.20@2x.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/LakojjjzZNf6ogjOVwKE/f5a76110-35d0-4082-a940-efc12bed87b0.png)

packages/frontend/component/src/components/member-components/accept-invite-page.tsx

@@ -37,7 +37,7 @@ export const AcceptInvitePage = ({
         </FlexWrapper>
       }
     >
-      <Button type="primary" size="large" onClick={onOpenWorkspace}>
+      <Button variant="primary" size="large" onClick={onOpenWorkspace}>
         {t['Visit Workspace']()}
       </Button>
     </AuthPageContainer>

packages/frontend/component/src/components/member-components/invite-modal.tsx

@@ -60,7 +60,7 @@ export const InviteModal = ({
       confirmText={t['Invite']()}
       confirmButtonOptions={{
         loading: isMutating,
-        type: 'primary',
+        variant: 'primary',
         ['data-testid' as string]: 'confirm-enable-affine-cloud-button',
       }}
       onConfirm={handleConfirm}

packages/frontend/component/src/components/member-components/member-limit-modal.tsx

@@ -44,7 +44,7 @@ export const MemberLimitModal = ({
           : 'com.affine.payment.member-limit.pro.confirm'
       ]()}
       confirmButtonOptions={{
-        type: 'primary',
+        variant: 'primary',
       }}
       onConfirm={handleConfirm}
     ></ConfirmModal>