init: the first public commit for AFFiNE

libs/components/ui/src/divider/Divider.tsx

@@ -0,0 +1,52 @@
+import type { FC, ReactNode, CSSProperties } from 'react';
+import { styled } from '../styled';
+import { MuiDivider } from '../mui';
+import type { MuiDividerProps } from '../mui';
+
+interface DividerProps {
+    orientation?: 'horizontal' | 'vertical';
+    textAlign?: 'center' | 'start' | 'end';
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+
+const _textAlignMap: Record<
+    DividerProps['textAlign'],
+    MuiDividerProps['textAlign']
+> = {
+    center: 'center',
+    start: 'left',
+    end: 'right',
+};
+
+export const Divider: FC<DividerProps> = ({
+    orientation = 'horizontal',
+    textAlign = 'center',
+    children,
+}) => {
+    return (
+        <StyledMuiDivider
+            orientation={orientation}
+            textAlign={_textAlignMap[textAlign]}
+            variant="fullWidth"
+        >
+            {children}
+        </StyledMuiDivider>
+    );
+};
+
+const StyledMuiDivider = styled(MuiDivider)<Pick<DividerProps, 'orientation'>>(
+    ({ orientation }) => {
+        if (orientation === 'horizontal') {
+            return {
+                marginTop: '6px',
+                marginBottom: '6px',
+            };
+        }
+        return {
+            marginLeft: '6px',
+            marginRight: '6px',
+        };
+    }
+);

libs/components/ui/src/divider/index.ts

@@ -0,0 +1 @@
+export * from './Divider';