From 20ed0ddaec131240afbfd14f48e8d4c73d3f4c0f Mon Sep 17 00:00:00 2001
From: azu <azuciao@gmail.com>
Date: Sat, 28 May 2022 23:51:58 +0900
Subject: [PATCH] feat: support options

---
 public/README.md |  7 +++++++
 src/sandpack.tsx | 17 ++++++++++++-----
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/public/README.md b/public/README.md
index 97ed6be..df2ebf5 100644
--- a/public/README.md
+++ b/public/README.md
@@ -52,6 +52,13 @@ Open editor at first.
     }
   },
   "entry": "/index.html",
+  "options": {
+    "showLineNumbers": true,
+    "showInlineErrors": true,
+    "wrapContent": false,
+    "editorHeight": 550,
+    "editorWidthPercentage": 60
+  },
   "honkitSettings": {
     "isOpen": true,
     "hideExitButton": true
diff --git a/src/sandpack.tsx b/src/sandpack.tsx
index 9060968..c5200b2 100644
--- a/src/sandpack.tsx
+++ b/src/sandpack.tsx
@@ -3,13 +3,16 @@ import React from "react";
 import { createRoot } from "react-dom/client";
 import { parseCommentAsSandboxOptions } from "./parse-comment-as-sandbox-options";
 import { t } from "./localize";
-import { Dependencies, SandpackBundlerFile } from "@codesandbox/sandpack-client/dist/types/types";
+import type { SandboxInfo } from "@codesandbox/sandpack-client";
 
 // Based: SandboxInfo
 export type SandboxOptions = {
     files: Record<
         string,
-        SandpackBundlerFile & {
+        {
+            code: string;
+            readOnly?: boolean;
+        } & {
             // prepend code snippet
             prependCode?: string;
             // load the path and fill code with it
@@ -19,13 +22,14 @@ export type SandboxOptions = {
             appendCode?: string;
         }
     >;
-    dependencies?: Dependencies;
-    devDependencies?: Dependencies;
+    dependencies?: SandboxInfo["dependencies"];
+    devDependencies?: SandboxInfo["devDependencies"];
     entry?: string;
     /**
      * What template we use, if not defined we infer the template from the dependencies or files.
      */
     template?: string;
+    options?: Record<string, any>; // Refer SandpackInternalProps
     honkitSettings?: {
         isOpen: boolean; // false by default
         hideExitButton: boolean; // false by default
@@ -109,6 +113,8 @@ export const attachToElement = (element: HTMLElement | ChildNode, options: Sandb
             environment: "parcel"
         };
         const entry = options.entry;
+        const sandpackOptions = options.options;
+        console.log({ sandpackOptions });
         const template = (options.template ?? "vanilla") as SandpackPredefinedTemplate;
         currentRoot.render(
             <Sandpack
@@ -117,7 +123,8 @@ export const attachToElement = (element: HTMLElement | ChildNode, options: Sandb
                 options={{
                     startRoute: entry,
                     skipEval: false,
-                    autorun: true
+                    autorun: true,
+                    ...sandpackOptions
                 }}
                 template={template}
             />