feat: introduce font picker (#8012)

Co-authored-by: dwelle <5153846+dwelle@users.noreply.github.com>
This commit is contained in:
Marcel Mraz 2024-07-25 18:55:55 +02:00 committed by GitHub
parent 4c5408263c
commit 62228e0bbb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
120 changed files with 3390 additions and 1106 deletions

View file

@ -239,7 +239,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -285,7 +285,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -386,7 +386,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to existing t
"containerId": "id48",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -487,7 +487,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to shapes whe
"containerId": "id37",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -662,7 +662,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"containerId": "id41",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -708,7 +708,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -754,7 +754,7 @@ exports[`Test Transform > Test arrow bindings > should bind arrows to text when
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -1207,7 +1207,7 @@ exports[`Test Transform > should transform text element 1`] = `
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -1248,7 +1248,7 @@ exports[`Test Transform > should transform text element 2`] = `
"containerId": null,
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -1581,7 +1581,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
"containerId": "B",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [
@ -1624,7 +1624,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
"containerId": "A",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [
@ -1667,7 +1667,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
"containerId": "Alice",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [
@ -1710,7 +1710,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
"containerId": "Bob",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [
@ -1753,7 +1753,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
"containerId": "Bob_Alice",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -1794,7 +1794,7 @@ exports[`Test Transform > should transform the elements correctly when linear el
"containerId": "Bob_B",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2043,7 +2043,7 @@ exports[`Test Transform > should transform to labelled arrows when label provide
"containerId": "id25",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2084,7 +2084,7 @@ exports[`Test Transform > should transform to labelled arrows when label provide
"containerId": "id26",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2125,7 +2125,7 @@ exports[`Test Transform > should transform to labelled arrows when label provide
"containerId": "id27",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2167,7 +2167,7 @@ exports[`Test Transform > should transform to labelled arrows when label provide
"containerId": "id28",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2431,7 +2431,7 @@ exports[`Test Transform > should transform to text containers when label provide
"containerId": "id13",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2472,7 +2472,7 @@ exports[`Test Transform > should transform to text containers when label provide
"containerId": "id14",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2514,7 +2514,7 @@ exports[`Test Transform > should transform to text containers when label provide
"containerId": "id15",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2558,7 +2558,7 @@ exports[`Test Transform > should transform to text containers when label provide
"containerId": "id16",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2600,7 +2600,7 @@ exports[`Test Transform > should transform to text containers when label provide
"containerId": "id17",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],
@ -2643,7 +2643,7 @@ exports[`Test Transform > should transform to text containers when label provide
"containerId": "id18",
"customData": undefined,
"fillStyle": "solid",
"fontFamily": 1,
"fontFamily": 5,
"fontSize": 20,
"frameId": null,
"groupIds": [],

View file

@ -44,14 +44,11 @@ import { bumpVersion } from "../element/mutateElement";
import { getUpdatedTimestamp, updateActiveTool } from "../utils";
import { arrayToMap } from "../utils";
import type { MarkOptional, Mutable } from "../utility-types";
import {
detectLineHeight,
getContainerElement,
getDefaultLineHeight,
} from "../element/textElement";
import { detectLineHeight, getContainerElement } from "../element/textElement";
import { normalizeLink } from "./url";
import { syncInvalidIndices } from "../fractionalIndex";
import { getSizeFromPoints } from "../points";
import { getLineHeight } from "../fonts";
type RestoredAppState = Omit<
AppState,
@ -206,7 +203,7 @@ const restoreElement = (
detectLineHeight(element)
: // no element height likely means programmatic use, so default
// to a fixed line height
getDefaultLineHeight(element.fontFamily));
getLineHeight(element.fontFamily));
element = restoreElementWithProperties(element, {
fontSize,
fontFamily,

View file

@ -18,11 +18,7 @@ import {
newMagicFrameElement,
newTextElement,
} from "../element/newElement";
import {
getDefaultLineHeight,
measureText,
normalizeText,
} from "../element/textElement";
import { measureText, normalizeText } from "../element/textElement";
import type {
ElementsMap,
ExcalidrawArrowElement,
@ -54,6 +50,7 @@ import {
import { getSizeFromPoints } from "../points";
import { randomId } from "../random";
import { syncInvalidIndices } from "../fractionalIndex";
import { getLineHeight } from "../fonts";
export type ValidLinearElement = {
type: "arrow" | "line";
@ -568,8 +565,7 @@ export const convertToExcalidrawElements = (
case "text": {
const fontFamily = element?.fontFamily || DEFAULT_FONT_FAMILY;
const fontSize = element?.fontSize || DEFAULT_FONT_SIZE;
const lineHeight =
element?.lineHeight || getDefaultLineHeight(fontFamily);
const lineHeight = element?.lineHeight || getLineHeight(fontFamily);
const text = element.text ?? "";
const normalizedText = normalizeText(text);
const metrics = measureText(