diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts b/apps/examples/e2e/tests/export-snapshots.spec.ts index 7a9a08e97..b3218c148 100644 --- a/apps/examples/e2e/tests/export-snapshots.spec.ts +++ b/apps/examples/e2e/tests/export-snapshots.spec.ts @@ -1,4 +1,4 @@ -import test, { expect } from '@playwright/test' +import test, { Page, expect } from '@playwright/test' import { Editor, TLShapeId, TLShapePartial } from '@tldraw/tldraw' import { rename, writeFile } from 'fs/promises' import { setupPage } from '../shared-e2e' @@ -174,33 +174,54 @@ test.describe('Export snapshots', () => { .createShapes(shapes) }, shapes as any) - const downloadEvent = page.waitForEvent('download') - await page.click('[data-testid="main.menu"]') - await page.click('[data-testid="menu-item.edit"]') - await page.click('[data-testid="menu-item.export-as"]') - await page.click('[data-testid="menu-item.export-as-svg"]') + snapshotTest(page) + }) + } - const download = await downloadEvent - const path = (await download.path()) as string - // assert(path) - await rename(path, path + '.svg') - await writeFile( - path + '.html', - ` + for (const [name, shapes] of Object.entries(snapshots)) { + test(`Exports with ${name} in dark mode`, async ({ browser }) => { + const page = await browser.newPage() + await setupPage(page) + await page.evaluate((shapes) => { + editor.user.updateUserPreferences({ isDarkMode: true }) + editor + .updateInstanceState({ exportBackground: false }) + .selectAll() + .deleteShapes() + .createShapes(shapes) + }, shapes as any) + + snapshotTest(page) + }) + } +}) + +async function snapshotTest(page: Page) { + const downloadEvent = page.waitForEvent('download') + await page.click('[data-testid="main.menu"]') + await page.click('[data-testid="menu-item.edit"]') + await page.click('[data-testid="menu-item.export-as"]') + await page.click('[data-testid="menu-item.export-as-svg"]') + + const download = await downloadEvent + const path = (await download.path()) as string + // assert(path) + await rename(path, path + '.svg') + await writeFile( + path + '.html', + ` `, - 'utf-8' - ) + 'utf-8' + ) - await page.goto(`file://${path}.html`) - const clip = await page.$eval('img', (img) => img.getBoundingClientRect()) - await expect(page).toHaveScreenshot({ - omitBackground: true, - clip, - }) - }) - } -}) + await page.goto(`file://${path}.html`) + const clip = await page.$eval('img', (img) => img.getBoundingClientRect()) + await expect(page).toHaveScreenshot({ + omitBackground: true, + clip, + }) +} diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..26d06d59b Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-none-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-none-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..26d06d59b Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-none-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-Mobile-Chrome-darwin.png index 841c6c09b..91f4662b7 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-chromium-darwin.png index 841c6c09b..3d1fb6828 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..f57289a33 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..7fd05d349 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-pattern-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-1-Mobile-Chrome-darwin.png index 113def77e..5a605436a 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..2153d5273 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..2153d5273 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-semi-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-Mobile-Chrome-darwin.png index 4d0cf08b9..113def77e 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-chromium-darwin.png index 4d0cf08b9..5a605436a 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..7839725e0 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..7839725e0 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-fill-solid-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-Mobile-Chrome-darwin.png index 4b013a949..69a61ef38 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-chromium-darwin.png index 4b013a949..7f903f0bf 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..7e6f517fa Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..7e6f517fa Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-draw-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-Mobile-Chrome-darwin.png index 24067d3fc..71eb3be77 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-chromium-darwin.png index 24067d3fc..219ca5969 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..81593c6b6 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..f2f75ddd0 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-mono-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-Mobile-Chrome-darwin.png index 7ca939f9f..653233cfe 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-chromium-darwin.png index 7ca939f9f..4b013a949 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..0a8ff9265 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..0a8ff9265 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-sans-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-Mobile-Chrome-darwin.png index 219ca5969..90634ebf0 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-chromium-darwin.png index 219ca5969..fb80d9402 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..9a7008243 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..9a7008243 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-arrow-font-serif-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..24067d3fc Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-none-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-none-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..24067d3fc Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-none-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-Mobile-Chrome-darwin.png index 91e57367f..4d0cf08b9 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-chromium-darwin.png index 91e57367f..69a61ef38 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..7fd05d349 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..f57289a33 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-pattern-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-Mobile-Chrome-darwin.png index 3d1fb6828..de46309f8 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-chromium-darwin.png index 3d1fb6828..113def77e 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..24e62f91a Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..24e62f91a Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-semi-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-Mobile-Chrome-darwin.png index 7f903f0bf..91b40bcbd 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-chromium-darwin.png index 7f903f0bf..91b40bcbd 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..abed0b483 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..29ab153d6 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-draw-fill-solid-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..783703b58 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-none-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-none-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-none-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..2bc34be0b Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-none-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-Mobile-Chrome-darwin.png index 69a61ef38..3d1fb6828 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-chromium-darwin.png index 69a61ef38..91f4662b7 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..29ab153d6 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..abed0b483 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-pattern-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..ff57ffad0 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-semi-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-semi-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-semi-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..ff57ffad0 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-semi-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-1-chromium-darwin.png index 164365517..de46309f8 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..04c83a369 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..04c83a369 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-fill-solid-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-Mobile-Chrome-darwin.png index 653233cfe..7f903f0bf 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-chromium-darwin.png index 653233cfe..164365517 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..f54d3d341 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..f54d3d341 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-draw-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-Mobile-Chrome-darwin.png index 26d06d59b..9d24df462 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-chromium-darwin.png index 26d06d59b..531019bac 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..f2f75ddd0 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..81593c6b6 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-mono-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-Mobile-Chrome-darwin.png index 90634ebf0..91e57367f 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-chromium-darwin.png index 90634ebf0..841c6c09b 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..b7da93436 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..b7da93436 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-sans-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-Mobile-Chrome-darwin.png index 71eb3be77..fb80d9402 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-chromium-darwin.png index 71eb3be77..90634ebf0 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..9c2213341 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..9c2213341 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-geo-font-serif-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-Mobile-Chrome-darwin.png index 1b3d37a02..164365517 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-chromium-darwin.png index 1b3d37a02..4d0cf08b9 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..86b8a1e70 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..86b8a1e70 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-draw-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-Mobile-Chrome-darwin.png index ff57ffad0..219ca5969 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-chromium-darwin.png index ff57ffad0..71eb3be77 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..5bb9fdab2 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..5bb9fdab2 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-mono-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-Mobile-Chrome-darwin.png index 531019bac..4b013a949 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-chromium-darwin.png index 531019bac..653233cfe 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..89ff1e38d Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..89ff1e38d Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-sans-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-Mobile-Chrome-darwin.png index 2bc34be0b..7ca939f9f 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-chromium-darwin.png index 2bc34be0b..7ca939f9f 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..bc48e26d6 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..bc48e26d6 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-note-font-serif-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-Mobile-Chrome-darwin.png index fb80d9402..841c6c09b 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-chromium-darwin.png index fb80d9402..91e57367f 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..38b3d37da Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..38b3d37da Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-draw-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-Mobile-Chrome-darwin.png index 2153d5273..2bc34be0b 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-chromium-darwin.png index 2153d5273..783703b58 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..9fd6baac0 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..bcb3af63b Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-mono-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-Mobile-Chrome-darwin.png index 9d24df462..1b3d37a02 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-chromium-darwin.png index 9d24df462..1b3d37a02 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..0f0470805 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..0f0470805 Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-sans-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-Mobile-Chrome-darwin.png index 783703b58..01678c92c 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-Mobile-Chrome-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-chromium-darwin.png index 783703b58..9d24df462 100644 Binary files a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-chromium-darwin.png and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..0a1d9502a Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-chromium-darwin.png b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-chromium-darwin.png new file mode 100644 index 000000000..0a1d9502a Binary files /dev/null and b/apps/examples/e2e/tests/export-snapshots.spec.ts-snapshots/Export-snapshots-Exports-with-text-font-serif-in-dark-mode-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-down-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-down-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..30195f11a Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-down-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-down-1-chromium-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-down-1-chromium-darwin.png new file mode 100644 index 000000000..bc5a38ae5 Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-down-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-leave-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-leave-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..bc5a38ae5 Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-leave-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-leave-1-chromium-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-leave-1-chromium-darwin.png new file mode 100644 index 000000000..30195f11a Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Canvas-events-pointer-events-pointer-leave-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-enter-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-enter-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..7995e9776 Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-enter-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-enter-1-chromium-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-enter-1-chromium-darwin.png new file mode 100644 index 000000000..7995e9776 Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-enter-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-move-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-move-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..5861e3968 Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-move-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-move-1-chromium-darwin.png b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-move-1-chromium-darwin.png new file mode 100644 index 000000000..5861e3968 Binary files /dev/null and b/apps/examples/e2e/tests/test-canvas-events.spec.ts-snapshots/Shape-events-pointer-events-pointer-move-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-focus-events-1-Mobile-Chrome-darwin.png b/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-focus-events-1-Mobile-Chrome-darwin.png new file mode 100644 index 000000000..b62609102 Binary files /dev/null and b/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-focus-events-1-Mobile-Chrome-darwin.png differ diff --git a/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-focus-events-1-chromium-darwin.png b/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-focus-events-1-chromium-darwin.png new file mode 100644 index 000000000..b62609102 Binary files /dev/null and b/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-focus-events-1-chromium-darwin.png differ diff --git a/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-kbds-after-clicking-on-ui-elements-1-chromium-darwin.png b/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-kbds-after-clicking-on-ui-elements-1-chromium-darwin.png new file mode 100644 index 000000000..5861e3968 Binary files /dev/null and b/apps/examples/e2e/tests/test-focus.spec.ts-snapshots/Focus-kbds-after-clicking-on-ui-elements-1-chromium-darwin.png differ diff --git a/packages/editor/api-report.md b/packages/editor/api-report.md index 385e7c7e6..29abd9d50 100644 --- a/packages/editor/api-report.md +++ b/packages/editor/api-report.md @@ -2230,6 +2230,9 @@ export const useEditor: () => Editor; // @public (undocumented) export function useIsCropping(shapeId: TLShapeId): boolean; +// @public (undocumented) +export function useIsDarkMode(): boolean; + // @public (undocumented) export function useIsEditing(shapeId: TLShapeId): boolean; diff --git a/packages/editor/src/index.ts b/packages/editor/src/index.ts index ed9614a28..a64b9c875 100644 --- a/packages/editor/src/index.ts +++ b/packages/editor/src/index.ts @@ -202,6 +202,7 @@ export { getCursor } from './lib/hooks/useCursor' export { useEditor } from './lib/hooks/useEditor' export type { TLEditorComponents } from './lib/hooks/useEditorComponents' export { useIsCropping } from './lib/hooks/useIsCropping' +export { useIsDarkMode } from './lib/hooks/useIsDarkMode' export { useIsEditing } from './lib/hooks/useIsEditing' export { useLocalStore } from './lib/hooks/useLocalStore' export { usePeerIds } from './lib/hooks/usePeerIds' diff --git a/packages/editor/src/lib/hooks/useCursor.ts b/packages/editor/src/lib/hooks/useCursor.ts index f0b8653e4..fca22c4d9 100644 --- a/packages/editor/src/lib/hooks/useCursor.ts +++ b/packages/editor/src/lib/hooks/useCursor.ts @@ -1,8 +1,9 @@ -import { useQuickReactor, useValue } from '@tldraw/state' +import { useQuickReactor } from '@tldraw/state' import { TLCursorType } from '@tldraw/tlschema' import { PI, radiansToDegrees } from '../primitives/utils' import { useContainer } from './useContainer' import { useEditor } from './useEditor' +import { useIsDarkMode } from './useIsDarkMode' const DEFAULT_SVG = `` const POINTER_SVG = `` @@ -72,7 +73,7 @@ const STATIC_CURSORS = ['default', 'pointer', 'cross', 'move', 'grab', 'grabbing export function useCursor() { const editor = useEditor() const container = useContainer() - const isDarkMode = useValue('dark mode', () => editor.user.isDarkMode, [editor]) + const isDarkMode = useIsDarkMode() useQuickReactor( 'useCursor', diff --git a/packages/editor/src/lib/hooks/useDarkMode.ts b/packages/editor/src/lib/hooks/useDarkMode.ts index a4ed3e3e5..6c3283d62 100644 --- a/packages/editor/src/lib/hooks/useDarkMode.ts +++ b/packages/editor/src/lib/hooks/useDarkMode.ts @@ -3,11 +3,12 @@ import React from 'react' import { debugFlags } from '../utils/debug-flags' import { useContainer } from './useContainer' import { useEditor } from './useEditor' +import { useIsDarkMode } from './useIsDarkMode' export function useDarkMode() { const editor = useEditor() const container = useContainer() - const isDarkMode = useValue('isDarkMode', () => editor.user.isDarkMode, [editor]) + const isDarkMode = useIsDarkMode() const forceSrgb = useValue(debugFlags.forceSrgb) React.useEffect(() => { diff --git a/packages/editor/src/lib/hooks/useIsDarkMode.ts b/packages/editor/src/lib/hooks/useIsDarkMode.ts new file mode 100644 index 000000000..62a64fdde --- /dev/null +++ b/packages/editor/src/lib/hooks/useIsDarkMode.ts @@ -0,0 +1,8 @@ +import { useValue } from '@tldraw/state' +import { useEditor } from './useEditor' + +/** @public */ +export function useIsDarkMode() { + const editor = useEditor() + return useValue('isDarkMode', () => editor.user.isDarkMode, [editor]) +} diff --git a/packages/tldraw/src/lib/shapes/arrow/ArrowShapeUtil.tsx b/packages/tldraw/src/lib/shapes/arrow/ArrowShapeUtil.tsx index e77d203c0..f495feadd 100644 --- a/packages/tldraw/src/lib/shapes/arrow/ArrowShapeUtil.tsx +++ b/packages/tldraw/src/lib/shapes/arrow/ArrowShapeUtil.tsx @@ -712,10 +712,10 @@ export class ArrowShapeUtil extends ShapeUtil { /> {as && maskStartArrowhead && shape.props.fill !== 'none' && ( - + )} {ae && maskEndArrowhead && shape.props.fill !== 'none' && ( - + )} {as && } {ae && } diff --git a/packages/tldraw/src/lib/shapes/draw/DrawShapeUtil.tsx b/packages/tldraw/src/lib/shapes/draw/DrawShapeUtil.tsx index 2c0b4093e..aca63aaac 100644 --- a/packages/tldraw/src/lib/shapes/draw/DrawShapeUtil.tsx +++ b/packages/tldraw/src/lib/shapes/draw/DrawShapeUtil.tsx @@ -161,6 +161,7 @@ export class DrawShapeUtil extends ShapeUtil { return ( { return ( - + {arcs.map(({ leftPoint, rightPoint, center, radius }, i) => { const angle = canonicalizeRotation( diff --git a/packages/tldraw/src/lib/shapes/geo/components/DashStyleEllipse.tsx b/packages/tldraw/src/lib/shapes/geo/components/DashStyleEllipse.tsx index 539d63188..d5f545e2c 100644 --- a/packages/tldraw/src/lib/shapes/geo/components/DashStyleEllipse.tsx +++ b/packages/tldraw/src/lib/shapes/geo/components/DashStyleEllipse.tsx @@ -47,7 +47,7 @@ export const DashStyleEllipse = React.memo(function DashStyleEllipse({ return ( <> - + - + - + {lines && lines.map((l, i) => ( - + ) diff --git a/packages/tldraw/src/lib/shapes/geo/components/DrawStyleEllipse.tsx b/packages/tldraw/src/lib/shapes/geo/components/DrawStyleEllipse.tsx index 50c967e92..688fee4a0 100644 --- a/packages/tldraw/src/lib/shapes/geo/components/DrawStyleEllipse.tsx +++ b/packages/tldraw/src/lib/shapes/geo/components/DrawStyleEllipse.tsx @@ -40,7 +40,7 @@ export const DrawStyleEllipse = React.memo(function DrawStyleEllipse({ return ( <> - + ) diff --git a/packages/tldraw/src/lib/shapes/geo/components/DrawStylePolygon.tsx b/packages/tldraw/src/lib/shapes/geo/components/DrawStylePolygon.tsx index ec4e72165..35b880a5d 100644 --- a/packages/tldraw/src/lib/shapes/geo/components/DrawStylePolygon.tsx +++ b/packages/tldraw/src/lib/shapes/geo/components/DrawStylePolygon.tsx @@ -36,7 +36,7 @@ export const DrawStylePolygon = React.memo(function DrawStylePolygon({ return ( <> - + ) diff --git a/packages/tldraw/src/lib/shapes/geo/components/SolidStyleCloud.tsx b/packages/tldraw/src/lib/shapes/geo/components/SolidStyleCloud.tsx index 258826d93..f575e3569 100644 --- a/packages/tldraw/src/lib/shapes/geo/components/SolidStyleCloud.tsx +++ b/packages/tldraw/src/lib/shapes/geo/components/SolidStyleCloud.tsx @@ -25,7 +25,7 @@ export const SolidStyleCloud = React.memo(function SolidStyleCloud({ return ( <> - + ) diff --git a/packages/tldraw/src/lib/shapes/geo/components/SolidStyleEllipse.tsx b/packages/tldraw/src/lib/shapes/geo/components/SolidStyleEllipse.tsx index af5fa98c2..145c06b8a 100644 --- a/packages/tldraw/src/lib/shapes/geo/components/SolidStyleEllipse.tsx +++ b/packages/tldraw/src/lib/shapes/geo/components/SolidStyleEllipse.tsx @@ -24,7 +24,7 @@ export const SolidStyleEllipse = React.memo(function SolidStyleEllipse({ return ( <> - + ) diff --git a/packages/tldraw/src/lib/shapes/geo/components/SolidStyleOval.tsx b/packages/tldraw/src/lib/shapes/geo/components/SolidStyleOval.tsx index 1a75d0fb4..c8755aa82 100644 --- a/packages/tldraw/src/lib/shapes/geo/components/SolidStyleOval.tsx +++ b/packages/tldraw/src/lib/shapes/geo/components/SolidStyleOval.tsx @@ -20,7 +20,7 @@ export const SolidStyleOval = React.memo(function SolidStyleOval({ const d = getOvalIndicatorPath(w, h) return ( <> - + ) diff --git a/packages/tldraw/src/lib/shapes/geo/components/SolidStylePolygon.tsx b/packages/tldraw/src/lib/shapes/geo/components/SolidStylePolygon.tsx index 183dad12c..1d8c77b1b 100644 --- a/packages/tldraw/src/lib/shapes/geo/components/SolidStylePolygon.tsx +++ b/packages/tldraw/src/lib/shapes/geo/components/SolidStylePolygon.tsx @@ -29,7 +29,7 @@ export const SolidStylePolygon = React.memo(function SolidStylePolygon({ return ( <> - + ) diff --git a/packages/tldraw/src/lib/shapes/line/LineShapeUtil.tsx b/packages/tldraw/src/lib/shapes/line/LineShapeUtil.tsx index d39a7f63d..657acd463 100644 --- a/packages/tldraw/src/lib/shapes/line/LineShapeUtil.tsx +++ b/packages/tldraw/src/lib/shapes/line/LineShapeUtil.tsx @@ -202,7 +202,7 @@ export class LineShapeUtil extends ShapeUtil { return ( - + ) @@ -214,7 +214,7 @@ export class LineShapeUtil extends ShapeUtil { return ( - + {spline.segments.map((segment, i) => { const { strokeDasharray, strokeDashoffset } = getPerfectDashProps( @@ -248,7 +248,7 @@ export class LineShapeUtil extends ShapeUtil { return ( - + { if (dash === 'solid' || (dash === 'draw' && forceSolid)) { return ( - + { if (dash === 'dashed' || dash === 'dotted') { return ( - + {spline.segments.map((segment, i) => { const { strokeDasharray, strokeDashoffset } = getPerfectDashProps( @@ -312,7 +312,7 @@ export class LineShapeUtil extends ShapeUtil { if (dash === 'draw') { return ( - + @@ -33,16 +33,14 @@ export const ShapeFill = React.memo(function ShapeFill({ d, color, fill }: Shape return } case 'pattern': { - return + return } } }) -const PatternFill = function PatternFill({ d, color }: ShapeFillProps) { +const PatternFill = function PatternFill({ d, color, theme }: ShapeFillProps) { const editor = useEditor() - const theme = useDefaultColorTheme() const zoomLevel = useValue('zoomLevel', () => editor.zoomLevel, [editor]) - const isDarkMode = useValue('isDarkMode', () => editor.user.isDarkMode, [editor]) const intZoom = Math.ceil(zoomLevel) const teenyTiny = editor.zoomLevel <= 0.18 @@ -54,7 +52,7 @@ const PatternFill = function PatternFill({ d, color }: ShapeFillProps) { fill={ teenyTiny ? theme[color].semi - : `url(#${HASH_PATTERN_ZOOM_NAMES[intZoom + (isDarkMode ? '_dark' : '_light')]})` + : `url(#${HASH_PATTERN_ZOOM_NAMES[`${intZoom}_${theme.id}`]})` } d={d} /> @@ -62,12 +60,7 @@ const PatternFill = function PatternFill({ d, color }: ShapeFillProps) { ) } -export function getShapeFillSvg({ - d, - color, - fill, - theme, -}: ShapeFillProps & { theme: TLDefaultColorTheme }) { +export function getShapeFillSvg({ d, color, fill, theme }: ShapeFillProps) { if (fill === 'none') { return } diff --git a/packages/tlschema/api-report.md b/packages/tlschema/api-report.md index ee3c9f3b2..1f9611b8a 100644 --- a/packages/tlschema/api-report.md +++ b/packages/tlschema/api-report.md @@ -870,6 +870,7 @@ export type TLDefaultColorStyle = T.TypeOf; // @public (undocumented) export type TLDefaultColorTheme = Expand<{ + id: 'dark' | 'light'; text: string; background: string; solid: string; diff --git a/packages/tlschema/src/styles/TLColorStyle.ts b/packages/tlschema/src/styles/TLColorStyle.ts index edd0385f6..990326682 100644 --- a/packages/tlschema/src/styles/TLColorStyle.ts +++ b/packages/tlschema/src/styles/TLColorStyle.ts @@ -31,6 +31,7 @@ export type TLDefaultColorThemeColor = { /** @public */ export type TLDefaultColorTheme = Expand< { + id: 'light' | 'dark' text: string background: string solid: string @@ -43,6 +44,7 @@ export const DefaultColorThemePalette: { darkMode: TLDefaultColorTheme } = { lightMode: { + id: 'light', text: '#000000', background: 'rgb(249, 250, 251)', solid: '#fcfffe', @@ -157,6 +159,7 @@ export const DefaultColorThemePalette: { }, }, darkMode: { + id: 'dark', text: '#f8f9fa', background: '#212529', solid: '#28292e',