Add image annotator example (#3147)

This diff mostly adds an image annotator example, but also has a couple
of drive-by changes:
- Added a 'use-cases' category to the examples app for this style of
mini-app
- Add `editor.pageToViewport`, which is like `editor.pageToScreen` but
works with viewport coordinates (better for `InFrontOfTheCanvas` stuff)
- Prevent the chrome side-swipe-to-go-back thing in the examples app

Some cool features of the image annotator:
- The image cannot be unlocked, and cannot have shapes places behind it
  - I still need to work out a way of removing the context menu though
- Anything you place outside the bounds of the image (and therefore
outside the bounds of the export) will be greyed out
- You can't change pages
  - unless you find the "move to page" action... need to fix that
- The camera is constrained! It'll keep the image roughly centered on
the screen. If you pick a very long thin image, you can only scroll
vertically. If you pick a very big one, it'll default it to a reasonable
size.

### Change Type

<!-- ❗ Please select a 'Scope' label ❗️ -->

- [x] `sdk` — Changes the tldraw SDK
- [x] `docs` — Changes to the documentation, examples, or templates.

<!-- ❗ Please select a 'Type' label ❗️ -->

- [x] `feature` — New feature

apps/docs/scripts/functions/generateExamplesContent.ts

@@ -8,12 +8,13 @@ const section: InputSection = {
 	title: 'Examples',
 	description: 'Code recipes for bending tldraw to your will.',
 	categories: [
-		{ id: 'basic', title: 'Getting Started', description: '', groups: [], hero: null },
-		{ id: 'ui', title: 'UI & Theming', description: '', groups: [], hero: null },
-		{ id: 'shapes/tools', title: 'Shapes & Tools', description: '', groups: [], hero: null },
-		{ id: 'data/assets', title: 'Data & Assets', description: '', groups: [], hero: null },
+		{ id: 'basic', title: 'Getting started', description: '', groups: [], hero: null },
+		{ id: 'ui', title: 'UI & theming', description: '', groups: [], hero: null },
+		{ id: 'shapes/tools', title: 'Shapes & tools', description: '', groups: [], hero: null },
+		{ id: 'data/assets', title: 'Data & assets', description: '', groups: [], hero: null },
 		{ id: 'editor-api', title: 'Editor API', description: '', groups: [], hero: null },
 		{ id: 'collaboration', title: 'Collaboration', description: '', groups: [], hero: null },
+		{ id: 'use-cases', title: 'Use cases', description: '', groups: [], hero: null },
 	],
 	hero: null,
 	sidebar_behavior: 'show-links',