feat: add tooltip & popover

packages/app/src/components/tooltip/Container.tsx

@@ -0,0 +1,36 @@
+import { styled } from '@/styles';
+import type { ReactNode, CSSProperties } from 'react';
+import type { PopoverDirection } from './interface';
+export interface PopoverContainerProps {
+  children?: ReactNode;
+  /**
+   * The pop-up window points to. The pop-up window has three rounded corners, one is a right angle, and the right angle is the direction of the pop-up window.
+   */
+  direction: PopoverDirection;
+  style?: CSSProperties;
+}
+const border_radius_map: Record<PopoverContainerProps['direction'], string> = {
+  none: '10px',
+  'left-top': '0 10px 10px 10px',
+  'left-bottom': '10px 10px 10px 0',
+  'right-top': '10px 0 10px 10px',
+  'right-bottom': '10px 10px 0 10px',
+};
+
+export const PopoverContainer = styled('div')<
+  Pick<PopoverContainerProps, 'direction'>
+>(({ theme, direction, style }) => {
+  return '';
+  // const shadow = theme.affine.shadows.shadow1;
+  // const white = theme.affine.palette.white;
+  //
+  // const borderRadius =
+  //   border_radius_map[direction] || border_radius_map['left-top'];
+  // return {
+  //   boxShadow: shadow,
+  //   borderRadius: borderRadius,
+  //   padding: '8px 4px',
+  //   backgroundColor: white,
+  //   ...style,
+  // };
+});