change options, drop svg_out_path in favor of outputs list

packages/demo/canvas.ts

@@ -1,12 +1,13 @@
 import { Color, Grid } from "@snk/types/grid";
 import { drawLerpWorld, drawWorld } from "@snk/draw/drawWorld";
 import { Snake } from "@snk/types/snake";
+import type { Options as DrawOptions } from "@snk/svg-creator";
 
-export const drawOptions = {
-  sizeBorderRadius: 2,
+export const drawOptions: DrawOptions = {
+  sizeDotBorderRadius: 2,
   sizeCell: 16,
   sizeDot: 12,
-  colorBorder: "#1b1f230a",
+  colorDotBorder: "#1b1f230a",
   colorDots: {
     1: "#9be9a8",
     2: "#40c463",

packages/demo/demo.interactive.ts

@@ -6,7 +6,7 @@ import type { Snake } from "@snk/types/snake";
 import {
   drawLerpWorld,
   getCanvasWorldSize,
-  Options,
+  Options as DrawOptions,
 } from "@snk/draw/drawWorld";
 import { userContributionToGrid } from "@snk/action/userContributionToGrid";
 import { createSvg } from "@snk/svg-creator";
@@ -120,7 +120,7 @@ const createViewer = ({
 }: {
   grid0: Grid;
   chain: Snake[];
-  drawOptions: Options;
+  drawOptions: DrawOptions;
 }) => {
   //
   // canvas
@@ -229,11 +229,11 @@ const onSubmit = async (userName: string) => {
   );
   const { cells, colorScheme } = (await res.json()) as Res;
 
-  const drawOptions = {
-    sizeBorderRadius: 2,
+  const drawOptions: DrawOptions = {
+    sizeDotBorderRadius: 2,
     sizeCell: 16,
     sizeDot: 12,
-    colorBorder: "#1b1f230a",
+    colorDotBorder: "#1b1f230a",
     colorDots: colorScheme as any,
     colorEmpty: colorScheme[0],
     colorSnake: "purple",