Factor out svg-vocabulary.ts, increase symbol padding.

.gitignore

@@ -2,4 +2,4 @@ node_modules
 dist
 dist-watch
 .cache
-lib/svg-vocabulary.json
+lib/_svg-vocabulary.json

lib/pages/vocabulary-page.tsx

@@ -5,10 +5,8 @@ import { FILL_REPLACEMENT_COLOR, STROKE_REPLACEMENT_COLOR } from "../colors";
 import * as colors from "../colors";
 import { PointWithNormal, Specs } from "../specs";
 
-import _SvgVocabulary from "../svg-vocabulary.json";
 import type { SvgSymbolData, SvgSymbolElement } from "../vocabulary";
-
+import { SvgVocabulary } from "../svg-vocabulary";
-const SvgVocabulary: SvgSymbolData[] = _SvgVocabulary as any;
 
 type SvgSymbolContext = {
   stroke: string;
@@ -155,7 +153,7 @@ const SvgSymbolSpecs: React.FC<{ specs: Specs }> = ({ specs }) => {
   );
 };
 
-const BBOX_DILATION = 50;
+const BBOX_DILATION = 100;
 
 const SvgSymbol: React.FC<SvgSymbolProps> = (props) => {
   const d = props.data;

lib/svg-vocabulary.ts

@@ -0,0 +1,4 @@
+import type { SvgSymbolData } from "./vocabulary";
+import _SvgVocabulary from "./_svg-vocabulary.json";
+
+export const SvgVocabulary: SvgSymbolData[] = _SvgVocabulary as any;

lib/vocabulary.ts

@@ -31,7 +31,7 @@ const SUPPORTED_SVG_TAGS = new Set(SUPPORTED_SVG_TAG_ARRAY);
 
 const MY_DIR = __dirname;
 const SVG_DIR = path.join(MY_DIR, "..", "svg");
-const VOCAB_PATH = path.join(MY_DIR, "svg-vocabulary.json");
+const VOCAB_PATH = path.join(MY_DIR, "_svg-vocabulary.json");
 const SVG_EXT = ".svg";
 
 function onlyTags(