feat(editor): update edgeless color palette (#9243)

Closes: [BS-1475](https://linear.app/affine-design/issue/BS-1475/颜色主题更新) [BS-1803](https://linear.app/affine-design/issue/BS-1803/fill-color色板影响的yuan素) [BS-1804](https://linear.app/affine-design/issue/BS-1804/border-color色板影响的yuan素) [BS-1815](https://linear.app/affine-design/issue/BS-1815/连线文字配色略瞎)

### What's Changed

* refactor `EdgelessLineWidthPanel` component, the previous width is fixed and cannot be used in the new design
* refactor `EdgelessColorPanel` and `EdgelessColorButton` components, make them simple and reusable
* delete redundant `EdgelessOneRowColorPanel` component
* unity and update color palette, if the previously set color is not in the latest color palette, the custom color button will be selected
This commit is contained in:
fundon
2024-12-30 03:36:33 +00:00
parent 6b1865ff92
commit a5641ae608
250 changed files with 952 additions and 964 deletions

View File

@@ -14,22 +14,20 @@ import {
DEFAULT_SHAPE_STROKE_COLOR,
DEFAULT_SHAPE_TEXT_COLOR,
DEFAULT_TEXT_COLOR,
FillColorsSchema,
FontFamily,
FontStyle,
FontWeight,
FrameBackgroundColorsSchema,
LayoutType,
LineColor,
LineColorsSchema,
LineWidth,
MindmapStyle,
NoteBackgroundColorsSchema,
NoteBackgroundPaletteEnum,
NoteDisplayMode,
NoteShadowsSchema,
PaletteEnum,
PointStyle,
ShapeStyle,
StrokeColorsSchema,
StrokeColor,
StrokeStyle,
TextAlign,
TextVerticalAlign,
@@ -59,17 +57,12 @@ export const ColorSchema = z.union([
dark: z.string(),
}),
]);
const LineColorSchema = z.union([LineColorsSchema, ColorSchema]);
const ShapeFillColorSchema = z.union([FillColorsSchema, ColorSchema]);
const ShapeStrokeColorSchema = z.union([StrokeColorsSchema, ColorSchema]);
const TextColorSchema = z.union([LineColorsSchema, ColorSchema]);
const ColorPaletteSchema = z.union([ColorSchema, PaletteEnum]);
const LineColorSchema = z.union([LineColorsSchema, ColorPaletteSchema]);
const TextColorSchema = z.union([LineColorsSchema, ColorPaletteSchema]);
const NoteBackgroundColorSchema = z.union([
NoteBackgroundColorsSchema,
ColorSchema,
]);
const FrameBackgroundColorSchema = z.union([
FrameBackgroundColorsSchema,
ColorSchema,
NoteBackgroundPaletteEnum,
]);
export const ConnectorSchema = z
@@ -110,13 +103,13 @@ export const ConnectorSchema = z
export const BrushSchema = z
.object({
color: LineColorSchema,
color: ColorPaletteSchema,
lineWidth: LineWidthSchema,
})
.default({
color: {
dark: LineColor.White,
light: LineColor.Black,
dark: StrokeColor.White,
light: StrokeColor.Black,
},
lineWidth: LineWidth.Four,
});
@@ -140,8 +133,8 @@ const DEFAULT_SHAPE = {
const ShapeObject = {
color: TextColorSchema,
fillColor: ShapeFillColorSchema,
strokeColor: ShapeStrokeColorSchema,
fillColor: ColorPaletteSchema,
strokeColor: ColorPaletteSchema,
strokeStyle: StrokeStyleSchema,
strokeWidth: z.number(),
shapeStyle: ShapeStyleSchema,
@@ -235,7 +228,7 @@ export const MindmapSchema = z
export const FrameSchema = z
.object({
background: FrameBackgroundColorSchema.optional(),
background: ColorPaletteSchema.optional(),
})
.default({});