feat(Popover): add popover header component

src/components/popover/Popover.module.css

@@ -7,3 +7,10 @@
   font-weight: var(--j2-font-weight-strong);
   line-height: var(--j2-line-height-heading-4);
 }
+
+.popoverHeader {
+  box-shadow: 0 2px 4px rgb(0 0 0 / 0.05);
+  border-radius: var(--j2-border-radius) var(--j2-border-radius) 0 0;
+
+  font-weight: bold;
+}

src/components/popover/Popover.tsx

@@ -1,5 +1,7 @@
 import { Popover as AntdPopover, PopoverProps } from 'antd'
+import cx from 'classnames'
 import styles from './Popover.module.css'
+
 export type Props = Expand<PopoverProps>
 
 const Popover = ({ children, placement = 'top', ...props }: Props) => {
@@ -14,4 +16,12 @@ const Popover = ({ children, placement = 'top', ...props }: Props) => {
   )
 }
 
-export { Popover }
+const PopoverHeader = ({ title }: { title: string }) => {
+  return (
+    <div className={cx('py-2 px-3 items-center', styles.popoverHeader)}>
+      {title}
+    </div>
+  )
+}
+
+export { Popover, PopoverHeader }

src/components/popover/index.tsx

@@ -1 +1 @@
-export { Popover } from './Popover'
+export * from './Popover'