feat(component): new hook to open confirm modal (#6342)

new exports from `@affine/component`:
```ts
import { ConfirmModalProvider, useConfirmModal } from "@affine/component"
```

Open confirm modal with hook:

```ts
const Component = () => {
  const { openConfirmModal } = useConformModal();

  const open = () => {
    openConfirmModal({
      // props of ConfirmModal
      /**
       * will show loading state when confirm clicked, and close after onConfirm finished
       */
      onConfirm: async () => {
        await new Promise((r) => setTimeout(r, 2000));
      },
    });
  }
  return <Button onClick={open}>Open</Button>
}
```

packages/frontend/component/.storybook/preview.tsx

@@ -8,6 +8,7 @@ import { useDarkMode } from 'storybook-dark-mode';
 
 import type { Preview } from '@storybook/react';
 import React from 'react';
+import { ConfirmModalProvider } from '../src/ui/modal/confirm-modal';
 
 export const parameters: Preview = {
   argTypes: {
@@ -53,9 +54,11 @@ export const decorators = [
   (Story: ComponentType, context) => {
     return (
       <ThemeProvider themes={['dark', 'light']} enableSystem={true}>
-        <ThemeChange />
-        <Component />
-        <Story {...context} />
+        <ConfirmModalProvider>
+          <ThemeChange />
+          <Component />
+          <Story {...context} />
+        </ConfirmModalProvider>
       </ThemeProvider>
     );
   },