gilles/excalidraw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

split strokeWidth constants into own file

Browse Source
This commit is contained in:
dwelle
2026-06-24 09:21:26 +02:00
parent 80e83374d4
commit 638d730cd5
4 changed files with 71 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/common/src/constants.strokeWidth.ts
+63
View File
@@ -0,0 +1,63 @@
import type { ExcalidrawElement } from "@excalidraw/element/types";
export type StrokeWidthKey = "thin" | "medium" | "bold";
export const STROKE_WIDTH_KEYS: readonly StrokeWidthKey[] = [
"thin",
"medium",
"bold",
];
export const STROKE_WIDTH: Readonly<
Record<StrokeWidthKey | "extraBold", ExcalidrawElement["strokeWidth"]>
> = {
thin: 1,
medium: 2,
bold: 4,
extraBold: 8, // unused (may be introduced in the future)
};
// freedraw schema 2.0 uses thinner stroke, but to maintain backwards and
// forwards compatibility, instead of changing the shape renderer, we scale
// the stroke width by 1/2 (previous, thin was 1, medium 2 etc.)
//
// note that in the UI, STROKE_WIDTH.thin == FREEDRAW_STROKE_WIDTH.thin still
export const FREEDRAW_STROKE_WIDTH: Readonly<
Record<StrokeWidthKey | "extraBold", ExcalidrawElement["strokeWidth"]>
> = {
thin: 0.5,
medium: 1,
bold: 2,
extraBold: 4, // legacy (may be used again in the future)
};
const STROKE_WIDTH_TO_KEY = {
generic: Object.fromEntries(
Object.entries(STROKE_WIDTH).map(([key, value]) => [value, key]),
) as Record<ExcalidrawElement["strokeWidth"], StrokeWidthKey | undefined>,
freedraw: Object.fromEntries(
Object.entries(FREEDRAW_STROKE_WIDTH).map(([key, value]) => [value, key]),
) as Record<ExcalidrawElement["strokeWidth"], StrokeWidthKey | undefined>,
};
export const getStrokeWidthKeyForElement = (
element: Pick<ExcalidrawElement, "type" | "strokeWidth">,
): StrokeWidthKey | null => {
const strokeWidthToKey =
element.type === "freedraw"
? STROKE_WIDTH_TO_KEY.freedraw
: STROKE_WIDTH_TO_KEY.generic;
return strokeWidthToKey[element.strokeWidth] ?? null;
};
export const getStrokeWidthByKey = (
elementType: ExcalidrawElement["type"],
strokeWidthKey: StrokeWidthKey,
): ExcalidrawElement["strokeWidth"] => {
return elementType === "freedraw"
? FREEDRAW_STROKE_WIDTH[strokeWidthKey]
: STROKE_WIDTH[strokeWidthKey];
};
export const DEFAULT_ELEMENT_STROKE_WIDTH_KEY: StrokeWidthKey = "medium";
packages/common/src/constants.ts
+4 -62
View File
@@ -5,6 +5,10 @@ import type {
import type { AppProps, AppState } from "@excalidraw/excalidraw/types";
import { COLOR_PALETTE } from "./colors";
import {
STROKE_WIDTH,
DEFAULT_ELEMENT_STROKE_WIDTH_KEY,
} from "./constants.strokeWidth";
export const supportsResizeObserver =
typeof window !== "undefined" && "ResizeObserver" in window;
@@ -404,68 +408,6 @@ export const ROUGHNESS = {
cartoonist: 2,
} as const;
export type StrokeWidthKey = "thin" | "medium" | "bold";
export const STROKE_WIDTH_KEYS: readonly StrokeWidthKey[] = [
"thin",
"medium",
"bold",
];
export const STROKE_WIDTH: Readonly<
Record<StrokeWidthKey | "extraBold", ExcalidrawElement["strokeWidth"]>
> = {
thin: 1,
medium: 2,
bold: 4,
extraBold: 8, // unused (may be introduced in the future)
};
// freedraw schema 2.0 uses thinner stroke, but to maintain backwards and
// forwards compatibility, instead of changing the shape renderer, we scale
// the stroke width by 1/2 (previous, thin was 1, medium 2 etc.)
//
// note that in the UI, STROKE_WIDTH.thin == FREEDRAW_STROKE_WIDTH.thin still
export const FREEDRAW_STROKE_WIDTH: Readonly<
Record<StrokeWidthKey | "extraBold", ExcalidrawElement["strokeWidth"]>
> = {
thin: 0.5,
medium: 1,
bold: 2,
extraBold: 4, // legacy (may be used again in the future)
};
const STROKE_WIDTH_TO_KEY = {
generic: Object.fromEntries(
Object.entries(STROKE_WIDTH).map(([key, value]) => [value, key]),
) as Record<ExcalidrawElement["strokeWidth"], StrokeWidthKey | undefined>,
freedraw: Object.fromEntries(
Object.entries(FREEDRAW_STROKE_WIDTH).map(([key, value]) => [value, key]),
) as Record<ExcalidrawElement["strokeWidth"], StrokeWidthKey | undefined>,
};
export const getStrokeWidthKeyForElement = (
element: Pick<ExcalidrawElement, "type" | "strokeWidth">,
): StrokeWidthKey | null => {
const strokeWidthToKey =
element.type === "freedraw"
? STROKE_WIDTH_TO_KEY.freedraw
: STROKE_WIDTH_TO_KEY.generic;
return strokeWidthToKey[element.strokeWidth] ?? null;
};
export const getStrokeWidthByKey = (
elementType: ExcalidrawElement["type"],
strokeWidthKey: StrokeWidthKey,
): ExcalidrawElement["strokeWidth"] => {
return elementType === "freedraw"
? FREEDRAW_STROKE_WIDTH[strokeWidthKey]
: STROKE_WIDTH[strokeWidthKey];
};
export const DEFAULT_ELEMENT_STROKE_WIDTH_KEY: StrokeWidthKey = "medium";
export const DEFAULT_ELEMENT_PROPS: {
strokeColor: ExcalidrawElement["strokeColor"];
backgroundColor: ExcalidrawElement["backgroundColor"];
packages/common/src/index.ts
+1
View File
@@ -2,6 +2,7 @@ export * from "./binary-heap";
export * from "./bounds";
export * from "./colors";
export * from "./constants";
export * from "./constants.strokeWidth";
export * from "./font-metadata";
export * from "./queue";
export * from "./keys";
packages/excalidraw/data/restore.ts
+3 -2
View File
@@ -19,9 +19,8 @@ import {
getSizeFromPoints,
normalizeLink,
getLineHeight,
STROKE_WIDTH,
STROKE_WIDTH_KEYS,
type StrokeWidthKey,
STROKE_WIDTH,
} from "@excalidraw/common";
import {
calculateFixedPointForNonElbowArrowBinding,
@@ -58,6 +57,8 @@ import { getNormalizedDimensions } from "@excalidraw/element";
import { isInvisiblySmallElement } from "@excalidraw/element";
import type { StrokeWidthKey } from "@excalidraw/common";
import type { LocalPoint, Radians } from "@excalidraw/math";
import type {