refactor(editor): replace @vanilla-extract/css with @emotion/css (#12195)

close: BS-3446

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **Refactor**
  - Migrated all styling from vanilla-extract to Emotion for improved CSS-in-JS consistency across database, table, and data view components.
  - Updated import paths for style modules to reflect the new Emotion-based file naming.
  - Removed unused or redundant style exports and updated selector syntax where necessary.

- **Chores**
  - Updated dependencies: removed vanilla-extract and added Emotion in relevant package files.

- **Style**
  - No visual changes to existing components; all style definitions remain consistent with previous designs.

- **New Features**
  - Introduced new reusable CSS classes for data view and table components using Emotion.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
zzj3720
2025-05-09 10:08:03 +00:00
parent a5872dff65
commit 7b6e00d84a
51 changed files with 374 additions and 482 deletions
@@ -1,12 +1,12 @@
import { cssVarV2 } from '@blocksuite/affine-shared/theme';
import { style } from '@vanilla-extract/css';
import { css } from '@emotion/css';
export const titleCellStyle = style({
export const titleCellStyle = css({
width: '100%',
display: 'flex',
});
export const titleRichTextStyle = style({
export const titleRichTextStyle = css({
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
@@ -18,7 +18,7 @@ export const titleRichTextStyle = style({
lineHeight: 'var(--data-view-cell-text-line-height)',
});
export const headerAreaIconStyle = style({
export const headerAreaIconStyle = css({
height: 'max-content',
display: 'flex',
alignItems: 'center',
@@ -24,7 +24,7 @@ import {
headerAreaIconStyle,
titleCellStyle,
titleRichTextStyle,
} from './cell-renderer.css.js';
} from './cell-renderer-css.js';
export class HeaderAreaTextCell extends BaseCellRenderer<Text, string> {
activity = true;