Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(editor): update edgeless color palette #9243

Merged
merged 1 commit into from
Dec 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion blocksuite/affine/block-attachment/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"file-type": "^19.5.0",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-bookmark/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
"zod": "^3.23.8"
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-code/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"@types/mdast": "^4.0.4",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-divider/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"@types/mdast": "^4.0.4",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-edgeless-text/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
"zod": "^3.23.8"
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-embed/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
"zod": "^3.23.8"
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-frame/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"@types/mdast": "^4.0.4",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-image/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"file-type": "^19.5.0",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-latex/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"@types/katex": "^0.16.7",
"@types/mdast": "^4.0.4",
"katex": "^0.16.11",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-list/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"@types/mdast": "^4.0.4",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-note/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
"zod": "^3.23.8"
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-paragraph/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"@types/mdast": "^4.0.4",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/block-surface/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
"@blocksuite/store": "workspace:*",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"fractional-indexing": "^3.2.0",
"lit": "^3.2.0",
"lodash.chunk": "^4.2.0",
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/components/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
"@lit/context": "^1.1.2",
"@lottiefiles/dotlottie-wc": "^0.4.0",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"date-fns": "^4.0.0",
"katex": "^0.16.11",
"lit": "^3.2.0",
Expand Down
15 changes: 0 additions & 15 deletions blocksuite/affine/components/src/icons/edgeless.ts
Original file line number Diff line number Diff line change
Expand Up @@ -427,21 +427,6 @@ export const ViewBarIcon = icons.ViewBarIcon({
height: '24',
});

export const TransparentIcon = html`<svg
width="16"
height="16"
viewBox="0 0 16 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M-0.939238 4.14286C-0.979281 4.4228 -1 4.70898 -1 5V6.71429H1.57143V9.28571H-1V11C-1 11.291 -0.979281 11.5772 -0.939238 11.8571H1.57143V14.4286H0.0754482C0.481795 15.0111 0.988871 15.5182 1.57143 15.9246V14.4286L4.14286 14.4286V16.9392C4.4228 16.9793 4.70898 17 5 17H6.71429V14.4286H9.28571V17H11C11.291 17 11.5772 16.9793 11.8571 16.9392V14.4286H14.4286L14.4286 15.9246C15.0111 15.5182 15.5182 15.0111 15.9246 14.4286L14.4286 14.4286V11.8571H16.9392C16.9793 11.5772 17 11.291 17 11V9.28571H14.4286V6.71429H17V5C17 4.70898 16.9793 4.4228 16.9392 4.14286H14.4286V1.57143H15.9246C15.5182 0.988871 15.0111 0.481795 14.4286 0.075448L14.4286 1.57143H11.8571V-0.939238C11.5772 -0.979281 11.291 -1 11 -1H9.28571V1.57143H6.71429V-1H5C4.70898 -1 4.4228 -0.979281 4.14286 -0.939238V1.57143H1.57143V0.0754479C0.988871 0.481795 0.481795 0.988871 0.0754479 1.57143H1.57143V4.14286H-0.939238ZM4.14286 4.14286V1.57143H6.71429V4.14286H4.14286ZM4.14286 6.71429H1.57143V4.14286H4.14286V6.71429ZM6.71429 6.71429V4.14286H9.28571V6.71429H6.71429ZM6.71429 9.28571V6.71429H4.14286V9.28571H1.57143V11.8571H4.14286V14.4286H6.71429V11.8571H9.28571V14.4286H11.8571V11.8571H14.4286V9.28571H11.8571V6.71429H14.4286V4.14286H11.8571V1.57143H9.28571V4.14286H11.8571V6.71429H9.28571V9.28571H6.71429ZM6.71429 9.28571V11.8571H4.14286V9.28571H6.71429ZM9.28571 9.28571H11.8571V11.8571H9.28571V9.28571Z"
fill="#D9D9D9"
/>
</svg>`;

export const MoreHorizontalIcon = icons.MoreHorizontalIcon({
width: '24',
height: '24',
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/data-view/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@toeverything/theme": "^1.1.3",
"date-fns": "^4.0.0",
"lit": "^3.2.0",
"zod": "^3.23.8"
Expand Down
2 changes: 1 addition & 1 deletion blocksuite/affine/model/src/blocks/frame/frame-model.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export const FrameBlockSchema = defineBlockSchema({
flavour: 'affine:frame',
props: (internal): FrameBlockProps => ({
title: internal.Text(),
background: '--affine-palette-transparent',
background: 'transparent',
xywh: `[0,0,100,100]`,
index: 'a0',
childElementIds: Object.create(null),
Expand Down
4 changes: 2 additions & 2 deletions blocksuite/affine/model/src/consts/brush.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
import { LineColor } from './line.js';
import { StrokeColor } from './color.js';

export const DEFAULT_BRUSH_COLOR = LineColor.Blue;
export const DEFAULT_BRUSH_COLOR = StrokeColor.Blue;
97 changes: 97 additions & 0 deletions blocksuite/affine/model/src/consts/color.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
import { themeToVar } from '@toeverything/theme/v2';
import { z } from 'zod';

import { createEnumMap } from '../utils/enum.js';

export const Transparent = 'transparent';
export const White = themeToVar('edgeless/palette/white');
export const Black = themeToVar('edgeless/palette/black');

export const Light = {
Red: themeToVar('edgeless/palette/light/redLight'),
Orange: themeToVar('edgeless/palette/light/orangeLight'),
Yellow: themeToVar('edgeless/palette/light/yellowLight'),
Green: themeToVar('edgeless/palette/light/greenLight'),
Blue: themeToVar('edgeless/palette/light/blueLight'),
Purple: themeToVar('edgeless/palette/light/purpleLight'),
Magenta: themeToVar('edgeless/palette/light/magentaLight'),
Grey: themeToVar('edgeless/palette/light/greyLight'),
} as const;

export const LIGHT_PALETTES = [
Light.Red,
Light.Orange,
Light.Yellow,
Light.Green,
Light.Blue,
Light.Purple,
Light.Magenta,
Light.Grey,
] as const;

export const Medium = {
Red: themeToVar('edgeless/palette/medium/redMedium'),
Orange: themeToVar('edgeless/palette/medium/orangeMedium'),
Yellow: themeToVar('edgeless/palette/medium/yellowMedium'),
Green: themeToVar('edgeless/palette/medium/greenMedium'),
Blue: themeToVar('edgeless/palette/medium/blueMedium'),
Purple: themeToVar('edgeless/palette/medium/purpleMedium'),
Magenta: themeToVar('edgeless/palette/medium/magentaMedium'),
Grey: themeToVar('edgeless/palette/medium/greyMedium'),
} as const;

export const MEDIUM_PALETTES = [
Medium.Red,
Medium.Orange,
Medium.Yellow,
Medium.Green,
Medium.Blue,
Medium.Purple,
Medium.Magenta,
Medium.Grey,
] as const;

export const Heavy = {
Red: themeToVar('edgeless/palette/heavy/red'),
Orange: themeToVar('edgeless/palette/heavy/orange'),
Yellow: themeToVar('edgeless/palette/heavy/yellow'),
Green: themeToVar('edgeless/palette/heavy/green'),
Blue: themeToVar('edgeless/palette/heavy/blue'),
Purple: themeToVar('edgeless/palette/heavy/purple'),
Magenta: themeToVar('edgeless/palette/heavy/magenta'),
} as const;

export const HEAVY_PALETTES = [
Heavy.Red,
Heavy.Orange,
Heavy.Yellow,
Heavy.Green,
Heavy.Blue,
Heavy.Purple,
Heavy.Magenta,
] as const;

export const PALETTES = [
// Light
...LIGHT_PALETTES,

Transparent,

// Medium
...MEDIUM_PALETTES,

White,

// Heavy
...HEAVY_PALETTES,

Black,
] as const;

export const PaletteEnum = z.enum(PALETTES);

export const StrokeColor = { Black, White, ...Medium } as const;

export const StrokeColorMap = createEnumMap(StrokeColor);

export const STROKE_COLORS = [...MEDIUM_PALETTES, Black, White] as const;
6 changes: 3 additions & 3 deletions blocksuite/affine/model/src/consts/connector.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { createEnumMap } from '../utils/enum.js';
import { LineColor } from './line.js';
import { StrokeColor } from './color.js';

export enum ConnectorEndpoint {
Front = 'Front',
Expand All @@ -16,9 +16,9 @@ export enum PointStyle {

export const PointStyleMap = createEnumMap(PointStyle);

export const DEFAULT_CONNECTOR_COLOR = LineColor.Grey;
export const DEFAULT_CONNECTOR_COLOR = StrokeColor.Grey;

export const DEFAULT_CONNECTOR_TEXT_COLOR = LineColor.Black;
export const DEFAULT_CONNECTOR_TEXT_COLOR = StrokeColor.Black;

export const DEFAULT_FRONT_END_POINT_STYLE = PointStyle.None;

Expand Down
28 changes: 2 additions & 26 deletions blocksuite/affine/model/src/consts/frame.ts
Original file line number Diff line number Diff line change
@@ -1,27 +1,3 @@
import { z } from 'zod';
import { Light } from './color.js';

export enum FrameBackgroundColor {
Blue = '--affine-tag-blue',
Gray = '--affine-tag-gray',
Green = '--affine-tag-green',
Orange = '--affine-tag-orange',
Pink = '--affine-tag-pink',
Purple = '--affine-tag-purple',
Red = '--affine-tag-red',
Teal = '--affine-tag-teal',
Yellow = '--affine-tag-yellow',
}

export const FRAME_BACKGROUND_COLORS = [
FrameBackgroundColor.Gray,
FrameBackgroundColor.Red,
FrameBackgroundColor.Orange,
FrameBackgroundColor.Yellow,
FrameBackgroundColor.Green,
FrameBackgroundColor.Teal,
FrameBackgroundColor.Blue,
FrameBackgroundColor.Purple,
FrameBackgroundColor.Pink,
];

export const FrameBackgroundColorsSchema = z.nativeEnum(FrameBackgroundColor);
export const FrameBackgroundColor = Light;
1 change: 1 addition & 0 deletions blocksuite/affine/model/src/consts/index.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
export * from './brush.js';
export * from './color.js';
export * from './connector.js';
export * from './doc.js';
export * from './frame.js';
Expand Down
14 changes: 14 additions & 0 deletions blocksuite/affine/model/src/consts/line.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,20 @@ export enum LineWidth {
Two = 2,
}

export const LINE_WIDTHS = [
LineWidth.Two,
LineWidth.Four,
LineWidth.Six,
LineWidth.Eight,
LineWidth.Ten,
LineWidth.Twelve,
];

/**
* Use `StrokeColor` instead.
*
* @deprecated
*/
export enum LineColor {
Black = '--affine-palette-line-black',
Blue = '--affine-palette-line-blue',
Expand Down
Loading
Loading