-
-
Notifications
You must be signed in to change notification settings - Fork 2.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(editor): store real color values in edgeless
- Loading branch information
Showing
273 changed files
with
1,887 additions
and
1,264 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,97 +1,54 @@ | ||
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; | ||
export enum ColorScheme { | ||
Dark = 'dark', | ||
Light = 'light', | ||
} | ||
|
||
const ColorNormalSchema = z.object({ | ||
normal: z.string(), | ||
}); | ||
|
||
const ColorDarkLightSchema = z.object({ | ||
[ColorScheme.Dark]: z.string(), | ||
[ColorScheme.Light]: z.string(), | ||
}); | ||
|
||
export const ColorSchema = z.union([ | ||
z.string(), | ||
ColorNormalSchema, | ||
ColorDarkLightSchema, | ||
]); | ||
|
||
export type Color = z.infer<typeof ColorSchema>; | ||
|
||
// Converts `Color` type to string. | ||
export function resolveColor( | ||
color: Color, | ||
colorScheme: ColorScheme, | ||
fallback = 'transparent' | ||
): string { | ||
let value = fallback; | ||
|
||
if (typeof color === 'object') { | ||
if (ColorScheme.Dark in color && ColorScheme.Light in color) { | ||
value = color[colorScheme]; | ||
} else if ('normal' in color) { | ||
value = color.normal; | ||
} | ||
} else { | ||
value = color; | ||
} | ||
|
||
if (!value) { | ||
value = fallback; | ||
} | ||
|
||
return value; | ||
} | ||
|
||
export function isTransparent(color: Color) { | ||
return ( | ||
typeof color === 'string' && color.toLowerCase().endsWith('transparent') | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,10 +1,9 @@ | ||
export * from './brush.js'; | ||
export * from './color.js'; | ||
export * from './connector.js'; | ||
export * from './doc.js'; | ||
export * from './frame.js'; | ||
export * from './line.js'; | ||
export * from './mindmap.js'; | ||
export * from './note.js'; | ||
export * from './shape.js'; | ||
export * from './text.js'; | ||
export * from './themes/index.js'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.