[dx] Allow vscode to search inside md files by default (#3105)

Before this PR all .md files were targeted by the `.ignore` file, which
has bitten me on a number of occasions since .md files often contain
valuable information (e.g. the vscode extensions docs). This PR
unignores .md files while still ignoring _generated_ .md files like our
changelogs, the api-report files, and the generated docs sections.

Additionally, the `yarn format` and `yarn lint` commands were configured
slightly differently, which was confusing, so I've unified those and
simplified the lint.ts script at the same time.

### Change Type

- [ ] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [x] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

.eslintignore

@@ -17,6 +17,7 @@
 **/next.config.js
 **/setupTests.js
 **/setupJest.js
+**/jestResolver.js
 apps/vscode/extension/editor
 apps/examples/www
 apps/docs/api-content.json

.github/workflows/checks.yml

@@ -73,4 +73,4 @@ jobs:
         run: "yarn build | sed -E 's/^.*? ::/::/'"
 
       - name: Pack public packages
-        run: "yarn lazy pack-tarball | sed -E 's/^.*? ::/::/'"
+        run: "yarn lazy pack-tarball | sed -E 's/^.*? ::/::/'"

.github/workflows/publish-new.yml

@@ -76,6 +76,4 @@ jobs:
     secrets:
       VITE_TEMPLATE_REPO_SSH_DEPLOY_KEY: ${{ secrets.VITE_TEMPLATE_REPO_SSH_DEPLOY_KEY }}
       NEXTJS_TEMPLATE_REPO_SSH_DEPLOY_KEY: ${{ secrets.NEXTJS_TEMPLATE_REPO_SSH_DEPLOY_KEY }}
-    needs: [
+    needs: [deploy]
-      deploy
-    ]

.ignore

@@ -2,9 +2,9 @@ dist
 .tsbuild-dev
 .tsbuild-pub
 .tsbuild
-node\*modules
+node_modules
 *.d.ts
-*.md
+**/api-report.md
 **/_archive
 **/*.tsbuildinfo
 yarn.lock
@@ -25,4 +25,6 @@ packages/tldraw/tldraw.css
 **/*.js.map
 **/*.api.json
 apps/docs/utils/vector-db
+apps/docs/content/releases/**/*
+apps/docs/content/reference/**/*
 packages/**/api

.prettierignore

@@ -8,7 +8,6 @@
 !**/pages/api/*
 **/.tsbuild*
 **/.next/*
-*.mdx
 **/_archive/*
 apps/docs/api-content.json
 apps/docs/content.json
@@ -18,6 +17,11 @@ content.json
 apps/docs/utils/vector-db/index.json
 **/gen/**/*.md
 
+**/api-report.md
+**/CHANGELOG.md
+apps/docs/content/releases/**/*
+apps/docs/content/reference/**/*
+
 **/.vercel/*
 **/.wrangler/*
 **/.out/*

.yarnrc.yml

@@ -4,4 +4,4 @@ enableGlobalCache: false
 
 enableInlineBuilds: true
 
-nodeLinker: node-modules
+nodeLinker: node-modules

apps/docs/content/docs/user-interface.mdx

@@ -59,7 +59,6 @@ Note that `onUiEvent` is only called when interacting with the user interface. I
 
 See the [tldraw repository](https://github.com/tldraw/tldraw/tree/main/apps/examples) for an example of how to customize tldraw's user interface.
 
-
 ## Overrides
 
 The content of tldraw's menus can be controlled via the `overrides` prop. This prop accepts a [TLUiOverrides](/reference/tldraw/TLUiOverrides) object, which has methods for each part of the user interface, such as the `toolbar` or `keyboardShortcutsMenu`.

apps/docs/content/getting-started/quick-start.mdx

@@ -10,7 +10,7 @@ order: 0
 
 You can use the tldraw SDK to craft infinite canvas experiences for the web. It's perfect for collaborative whiteboards but you can use it for lots of other things, too.
 
-By the end of this guide you will have made something that looks like this: 
+By the end of this guide you will have made something that looks like this:
 
 <Embed className="article__embed--quickstart" src="https://examples.tldraw.com/develop" />
 
@@ -50,26 +50,26 @@ To render the Tldraw component
 This will render a full screen canvas:
 
 ```javascript
-import { Tldraw } from "tldraw";
+import { Tldraw } from 'tldraw'
-import "./index.css";
+import './index.css'
 
 export default function App() {
-  return (
+	return (
-    <div style={{ position: 'fixed', inset: 0 }}>
+		<div style={{ position: 'fixed', inset: 0 }}>
-      <Tldraw />
+			<Tldraw />
-    </div>
+		</div>
-  );
+	)
 }
 ```
 
 ## Next Steps
 
-Now that you have your canvas working, you may be wondering: what next? 
+Now that you have your canvas working, you may be wondering: what next?
 
-You can try: 
+You can try:
 
 - Giving the editor a makeover by [customizing the UI](/docs/user-interface)
 - Adding your own [shapes](/docs/shapes) and [tools](/docs/tools)
-- Providing collaboration using [multiplayer](https://github.com/tldraw/tldraw-yjs-example) 
+- Providing collaboration using [multiplayer](https://github.com/tldraw/tldraw-yjs-example)
 
 We provide the above examples and more in our [examples section](/examples). Go build something creative and please do share it with us in our [#show-and-tell](https://discord.com/invite/SBBEVCA4PG) channel on Discord!

apps/dotcom/README.md

@@ -60,21 +60,24 @@ You need to have a psql client [installed](https://www.timescale.com/blog/how-to
 
 ## Sending emails
 
-We are using [Resend](https://resend.com/) for sending emails. It allows us to write emails as React components. Emails live in a separate app `apps/tl-emails`. 
+We are using [Resend](https://resend.com/) for sending emails. It allows us to write emails as React components. Emails live in a separate app `apps/tl-emails`.
 
 Right now we are only using Resend via Supabase, but in the future we will probably also include Resend in our application and send emails directly.
 
 The development workflow is as follows:
 
 ### 1. Creating / updating an email template
- To start the development server for email run `yarn dev-email` from the root folder of our repo. You can then open [http://localhost:3333](http://localhost:3333) to see the result. This allows for quick local development of email templates. 
+
+To start the development server for email run `yarn dev-email` from the root folder of our repo. You can then open [http://localhost:3333](http://localhost:3333) to see the result. This allows for quick local development of email templates.
 
 Any images you want to use in the email should be uploaded to supabase to the `email` bucket.
 
 Supabase provides some custom params (like the magic link url) that we can insert into our email, [check their website](https://supabase.com/dashboard/project/faafybhoymfftncjttyq/auth/templates) for more info.
 
 ### 2. Generating the `html` version of the email
-Once you are happy with the email template you can run `yarn build-email` from the root folder of our repo. This will generate the `html` version of the email and place it in `apps/tl-emails/out` folder. 
+
+Once you are happy with the email template you can run `yarn build-email` from the root folder of our repo. This will generate the `html` version of the email and place it in `apps/tl-emails/out` folder.
 
 ### 3. Updating the template in Supabase
+
 Once you have the `html` version of the email you can copy it into the Supabase template editor. You can find the templates [here](https://supabase.com/dashboard/project/faafybhoymfftncjttyq/auth/templates).

apps/dotcom/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
 	<head>
 		<meta charset="UTF-8" />
@@ -46,5 +46,4 @@
 		<script type="module" src="./src/main.tsx"></script>
 		<noscript>You need to enable JavaScript to run tldraw. ✌️</noscript>
 	</body>
-
 </html>

apps/examples/src/examples/basic/README.md

@@ -5,8 +5,6 @@ category: basic
 priority: 1
 ---
 
-
-
 ---
 
 The `Tldraw` component provides the tldraw editor as a regular React component. You can put this component anywhere in your React project. In this example, we make the component take up the height and width of the container.

apps/examples/src/examples/infer-dark-mode/README.md

@@ -5,8 +5,6 @@ category: basic
 priority: 5
 ---
 
-
-
 ---
 
 When the `Tldraw` component's `inferDarkMode` is true, the editor will infer its initial theme based on the user's system preferences, if available. You can toggle the dark mode by pressing `Command + /`.

apps/examples/src/examples/peristence-key/README.md

@@ -5,8 +5,6 @@ category: basic
 priority: 2
 ---
 
-
-
 ---
 
 If the `persistenceKey` prop is provided to the `<Tldraw/>` component, the editor will persist its data locally under that key.

apps/examples/src/examples/speech-bubble/customhandles.css

@@ -1,5 +1,4 @@
 /* Resize handles are normally on top, but We're going to give shape handles priority */
 .tl-user-handles {
 	z-index: 101;
-
+}
-}

apps/examples/src/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
 	<head>
 		<meta charset="UTF-8" />

apps/health-worker/README.md

@@ -1,3 +1,3 @@
 # Health Worker
 
-Accepts webhooks from [Updown](https://updown.io/), sends them to our Discord.
+Accepts webhooks from [Updown](https://updown.io/), sends them to our Discord.

package.json

@@ -50,7 +50,7 @@
 		"build-package": "lazy build-package",
 		"preview-app": "VITE_PREVIEW=1 yarn dev-app",
 		"lint": "lazy lint",
-		"format": "prettier --write --cache \"**/*.{ts,tsx,js,jsx,json}\"",
+		"format": "prettier --write --cache '**/*.{yml,yaml,json,md,mdx,html,css,js,jsx,ts,tsx,cjs,mjs}'",
 		"typecheck": "yarn refresh-assets && tsx scripts/typecheck.ts",
 		"check-scripts": "tsx scripts/check-scripts.ts",
 		"check-tsconfigs": "tsx scripts/check-tsconfigs.ts",

scripts/lint.ts

@@ -1,70 +1,26 @@
-import ignore from 'ignore'
 import * as path from 'path'
 import { exec } from './lib/exec'
-import { REPO_ROOT, readFileIfExists } from './lib/file'
+import { REPO_ROOT } from './lib/file'
-
-const ESLINT_EXTENSIONS = ['js', 'jsx', 'ts', 'tsx']
-const PRETTIER_EXTENSIONS = ['js', 'jsx', 'ts', 'tsx', 'json']
 
 async function main() {
 	const shouldFix = process.argv.includes('--fix')
-
-	const lsFiles = await exec('git', ['ls-files', '.'], {
-		processStdoutLine: () => {
-			// don't print anything
-		},
-	})
-
-	const filesByExtension = new Map<string, string[]>()
-	for (const file of lsFiles.trim().split('\n')) {
-		const ext = file.split('.').pop()
-		if (!ext) continue
-		let files = filesByExtension.get(ext)
-		if (!files) {
-			files = []
-			filesByExtension.set(ext.toLowerCase(), files)
-		}
-		files.push(file)
-	}
-
-	let prettierFiles = PRETTIER_EXTENSIONS.flatMap((ext) => filesByExtension.get(ext) ?? [])
-	let eslintFiles = ESLINT_EXTENSIONS.flatMap((ext) => filesByExtension.get(ext) ?? [])
-
 	const relativeCwd = path.relative(REPO_ROOT, process.cwd())
 
-	const prettierIgnoreFile = await readFileIfExists(path.join(REPO_ROOT, '.prettierignore'))
-	if (prettierIgnoreFile) {
-		prettierFiles = prettierFiles
-			.map((f) => path.join(relativeCwd, f))
-			.filter(ignore().add(prettierIgnoreFile).createFilter())
-			.map((f) => path.relative(relativeCwd, f))
-	}
-
-	const eslintIgnoreFile = await readFileIfExists(path.join(REPO_ROOT, '.eslintignore'))
-	if (eslintIgnoreFile) {
-		eslintFiles = eslintFiles
-			.map((f) => path.join(relativeCwd, f))
-			.filter(ignore().add(eslintIgnoreFile).createFilter())
-			.map((f) => path.relative(relativeCwd, f))
-	}
-
 	try {
-		await exec('yarn', [
+		await exec('yarn', ['prettier', shouldFix ? '--write' : '--check', '--cache', relativeCwd], {
-			'run',
+			pwd: REPO_ROOT,
-			'-T',
+		})
-			'prettier',
+		await exec(
-			shouldFix ? '--write' : '--check',
+			'yarn',
-			'--cache',
+			[
-			...prettierFiles,
+				'eslint',
-		])
+				'--report-unused-disable-directives',
-		await exec('yarn', [
+				'--no-error-on-unmatched-pattern',
-			'run',
+				shouldFix ? '--fix' : null,
-			'-T',
+				relativeCwd,
-			'eslint',
+			],
-			'--report-unused-disable-directives',
+			{ pwd: REPO_ROOT }
-			shouldFix ? '--fix' : null,
+		)
-			...eslintFiles,
-		])
 	} catch (error) {
 		process.exit(1)
 	}

templates/nextjs/next.config.cjs

@@ -1,8 +1,8 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  experimental: {
+	experimental: {
-    serverComponentsExternalPackages: ["@tldraw/tldraw"],
+		serverComponentsExternalPackages: ['@tldraw/tldraw'],
-  },
+	},
-};
+}
 
-module.exports = nextConfig;
+module.exports = nextConfig

templates/vite/.eslintrc.cjs

@@ -1,14 +1,14 @@
 module.exports = {
-  env: { browser: true, es2020: true },
+	env: { browser: true, es2020: true },
-  extends: [
+	extends: [
-    'eslint:recommended',
+		'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
+		'plugin:@typescript-eslint/recommended',
-    'plugin:react-hooks/recommended',
+		'plugin:react-hooks/recommended',
-  ],
+	],
-  parser: '@typescript-eslint/parser',
+	parser: '@typescript-eslint/parser',
-  parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
+	parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
-  plugins: ['react-refresh'],
+	plugins: ['react-refresh'],
-  rules: {
+	rules: {
-    'react-refresh/only-export-components': 'warn',
+		'react-refresh/only-export-components': 'warn',
-  },
+	},
 }

templates/vite/index.html

@@ -1,13 +1,13 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-  <head>
+	<head>
-    <meta charset="UTF-8" />
+		<meta charset="UTF-8" />
-    <link rel="icon" href="/favicon.ico" />
+		<link rel="icon" href="/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>tldraw Vite template</title>
+		<title>tldraw Vite template</title>
-  </head>
+	</head>
-  <body>
+	<body>
-    <div id="root"></div>
+		<div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
+		<script type="module" src="/src/main.tsx"></script>
-  </body>
+	</body>
 </html>