@tscircuit/runframe 0.0.1137 → 0.0.1139

package/dist/preview.js

@@ -8,7 +8,7 @@ import {
   linkify,
   useOrderDialog,
   useOrderDialogCli
-} from "./chunk-LA5Z7XHL.js";
+} from "./chunk-L5MGTEEA.js";
 export {
   BomTable,
   CadViewer,

package/dist/runner.js

@@ -32,7 +32,7 @@ import {
   useRunFrameStore,
   useRunnerStore,
   useStyles
-} from "./chunk-LA5Z7XHL.js";
+} from "./chunk-L5MGTEEA.js";
 
 // lib/components/RunFrame/RunFrame.tsx
 import { createCircuitWebWorker } from "@tscircuit/eval/worker";
@@ -1028,22 +1028,19 @@ var EnhancedFileSelectorCombobox = ({
   files,
   onFileChange,
   currentFile,
-  config = {}
+  fileFilter = defaultFileFilter,
+  getDisplayName = defaultDisplayName,
+  placeholder = "Select file",
+  searchPlaceholder = "Search for file",
+  emptyMessage = "No files found in this directory.",
+  pinnedFiles = [],
+  onToggleFavorite
 }) => {
   const [open, setOpen] = useState5(false);
   const [file, setFile] = useState5(currentFile);
   const { currentFolder, navigateToFolder, resetManualNavigation } = useCurrentFolder({ currentFile: file, files });
   const [currentFileIndex, setCurrentFileIndex] = useState5(0);
   const [searchValue, setSearchValue] = useState5("");
-  const {
-    fileFilter = defaultFileFilter,
-    getDisplayName = defaultDisplayName,
-    placeholder = "Select file",
-    searchPlaceholder = "Search for file",
-    emptyMessage = "No files found in this directory.",
-    pinnedFiles = [],
-    onToggleFavorite
-  } = config;
   useEffect6(() => {
     setFile(currentFile);
   }, [currentFile]);
@@ -1112,7 +1109,8 @@ var EnhancedFileSelectorCombobox = ({
   const displayPath = currentFolder ?? "/";
   const shortDisplayPath = displayPath.length > 25 ? "..." + displayPath.slice(-22) : displayPath;
   const getDropdownWidth = () => {
-    return "rf-w-[400px] rf-min-w-[400px] rf-max-w-[400px]";
+    const maxWidth = isSearching ? "rf-max-w-[600px]" : "rf-max-w-[1000px]";
+    return `rf-w-full rf-min-w-[600px] ${maxWidth}`;
   };
   return /* @__PURE__ */ jsx5("div", { className: "rf-flex rf-items-center rf-gap-1", children: /* @__PURE__ */ jsxs4(
     Popover,
@@ -1132,7 +1130,7 @@ var EnhancedFileSelectorCombobox = ({
             variant: "outline",
             role: "combobox",
             "aria-expanded": open,
-            className: "rf-w-fit rf-min-w-32 rf-max-w-64 rf-justify-center rf-items-center rf-gap-1 !rf-font-normal",
+            className: "rf-w-fit rf-min-w-32 rf-max-w-100 rf-justify-center rf-items-center rf-gap-1 !rf-font-normal",
             children: [
               /* @__PURE__ */ jsx5("span", { className: "rf-truncate rf-text-left", children: file ? getDisplayName(file) : placeholder }),
               /* @__PURE__ */ jsx5(ChevronsUpDown, { className: "rf-opacity-50 rf-flex-shrink-0" })
@@ -1143,7 +1141,7 @@ var EnhancedFileSelectorCombobox = ({
           PopoverContent,
           {
             className: cn(
-              "!rf-p-0 !rf-overflow-x-auto !rf-z-[200]",
+              "!rf-p-0 !rf-overflow-hidden !rf-z-[200]",
               getDropdownWidth()
             ),
             children: /* @__PURE__ */ jsxs4(Command, { shouldFilter: false, children: [
@@ -1177,7 +1175,7 @@ var EnhancedFileSelectorCombobox = ({
                           index === array.length - 1 ? /* @__PURE__ */ jsx5(
                             "span",
                             {
-                              className: "rf-text-slate-800 rf-truncate rf-max-w-[150px]",
+                              className: "rf-text-slate-800 rf-truncate rf-max-w-[200px]",
                               title: segment,
                               children: segment
                             }
@@ -1185,7 +1183,7 @@ var EnhancedFileSelectorCombobox = ({
                             "button",
                             {
                               onClick: () => handleNavigateToFolder(pathToSegment),
-                              className: "rf-text-blue-600 hover:rf-text-blue-800 rf-underline rf-cursor-pointer rf-bg-transparent rf-border-none rf-p-0 rf-truncate rf-max-w-[100px]",
+                              className: "rf-text-blue-600 hover:rf-text-blue-800 rf-underline rf-cursor-pointer rf-bg-transparent rf-border-none rf-p-0 rf-truncate rf-max-w-[150px]",
                               title: segment,
                               children: segment
                             }
@@ -1227,7 +1225,7 @@ var EnhancedFileSelectorCombobox = ({
                         children: [
                           /* @__PURE__ */ jsx5(Star, { className: "rf-mr-2 rf-h-4 rf-w-4 rf-text-amber-500 rf-fill-amber-500" }),
                           getDisplayName(path.split("/").pop() || ""),
-                          /* @__PURE__ */ jsx5("span", { className: "rf-text-xs rf-text-muted-foreground rf-ml-2 rf-truncate rf-max-w-[120px]", children: getDirectoryPath2(path) }),
+                          /* @__PURE__ */ jsx5("span", { className: "rf-text-xs rf-text-muted-foreground rf-ml-2 rf-truncate rf-max-w-[40%]", children: getDirectoryPath2(path) }),
                           /* @__PURE__ */ jsx5(
                             Check,
                             {
@@ -1268,7 +1266,10 @@ var EnhancedFileSelectorCombobox = ({
                                   e.stopPropagation();
                                   onToggleFavorite(fileNode.path);
                                 },
-                                className: "rf-p-1 rf-rounded hover:rf-bg-slate-200 rf-opacity-0 group-hover:rf-opacity-100 rf-transition-opacity",
+                                className: cn(
+                                  "rf-p-1 rf-rounded hover:rf-bg-slate-200 rf-transition-opacity",
+                                  pinnedFiles.includes(fileNode.path) ? "rf-opacity-100" : "rf-opacity-0 group-hover:rf-opacity-100"
+                                ),
                                 "aria-label": pinnedFiles.includes(fileNode.path) ? "Remove from favorites" : "Add to favorites",
                                 title: pinnedFiles.includes(fileNode.path) ? "Remove from favorites" : "Add to favorites",
                                 children: /* @__PURE__ */ jsx5(
@@ -1342,7 +1343,7 @@ var EnhancedFileSelectorCombobox = ({
                         /* @__PURE__ */ jsx5("span", { className: "rf-mr-2", children: defaultFileIcon(file2.fileName) }),
                         /* @__PURE__ */ jsxs4("div", { className: "rf-flex rf-items-center rf-w-full rf-min-w-0", children: [
                           /* @__PURE__ */ jsx5("span", { className: "rf-truncate rf-flex-1", children: getDisplayName(file2.fileName) }),
-                          /* @__PURE__ */ jsx5("span", { className: "rf-text-xs rf-text-muted-foreground rf-ml-2 rf-truncate rf-max-w-[120px]", children: currentFolder || "/" }),
+                          /* @__PURE__ */ jsx5("span", { className: "rf-text-xs rf-text-muted-foreground rf-ml-2 rf-truncate rf-max-w-[40%]", children: currentFolder || "/" }),
                           onToggleFavorite && /* @__PURE__ */ jsx5(
                             "button",
                             {
@@ -1351,7 +1352,10 @@ var EnhancedFileSelectorCombobox = ({
                                 e.stopPropagation();
                                 onToggleFavorite(file2.path);
                               },
-                              className: "rf-p-1 rf-rounded hover:rf-bg-slate-200 rf-opacity-0 group-hover:rf-opacity-100 rf-transition-opacity rf-ml-2",
+                              className: cn(
+                                "rf-p-1 rf-rounded hover:rf-bg-slate-200 rf-transition-opacity rf-ml-2",
+                                pinnedFiles.includes(file2.path) ? "rf-opacity-100" : "rf-opacity-0 group-hover:rf-opacity-100"
+                              ),
                               "aria-label": pinnedFiles.includes(file2.path) ? "Remove from favorites" : "Add to favorites",
                               title: pinnedFiles.includes(file2.path) ? "Remove from favorites" : "Add to favorites",
                               children: /* @__PURE__ */ jsx5(
@@ -1389,7 +1393,7 @@ var EnhancedFileSelectorCombobox = ({
                       /* @__PURE__ */ jsx5("span", { className: "rf-mr-2", children: defaultFileIcon(file2.fileName) }),
                       /* @__PURE__ */ jsxs4("div", { className: "rf-flex rf-items-center rf-w-full rf-min-w-0", children: [
                         /* @__PURE__ */ jsx5("span", { className: "rf-truncate rf-flex-1", children: getDisplayName(file2.fileName) }),
-                        /* @__PURE__ */ jsx5("span", { className: "rf-text-xs rf-text-muted-foreground rf-ml-2 rf-truncate rf-max-w-[120px]", children: getDirectoryPath2(file2.path) }),
+                        /* @__PURE__ */ jsx5("span", { className: "rf-text-xs rf-text-muted-foreground rf-ml-2 rf-truncate rf-max-w-[40%]", children: getDirectoryPath2(file2.path) }),
                         onToggleFavorite && /* @__PURE__ */ jsx5(
                           "button",
                           {
@@ -1397,7 +1401,10 @@ var EnhancedFileSelectorCombobox = ({
                               e.stopPropagation();
                               onToggleFavorite(file2.path);
                             },
-                            className: "rf-p-1 rf-rounded hover:rf-bg-slate-200 rf-opacity-0 group-hover:rf-opacity-100 rf-transition-opacity rf-ml-2",
+                            className: cn(
+                              "rf-p-1 rf-rounded hover:rf-bg-slate-200 rf-transition-opacity rf-ml-2",
+                              pinnedFiles.includes(file2.path) ? "rf-opacity-100" : "rf-opacity-0 group-hover:rf-opacity-100"
+                            ),
                             title: pinnedFiles.includes(file2.path) ? "Remove from favorites" : "Add to favorites",
                             children: /* @__PURE__ */ jsx5(
                               Star,
@@ -1489,11 +1496,34 @@ var RunFrameWithApi = (props) => {
     const params = new URLSearchParams(window.location.hash.slice(1));
     return params.get("file") ?? props.initialMainComponentPath ?? "";
   });
+  const [favorites, setFavorites] = useLocalStorageState(
+    "runframe:favorites",
+    []
+  );
   const isLoadingFiles = !hasReceivedInitialFiles;
+  const handleToggleFavorite = useCallback3(
+    (filePath) => {
+      setFavorites(
+        (prev) => prev.includes(filePath) ? prev.filter((f) => f !== filePath) : [...prev, filePath]
+      );
+    },
+    [setFavorites]
+  );
   useEffect7(() => {
     if (componentPath && boardFiles.includes(componentPath)) {
       return;
     }
+    if (componentPath) {
+      const currentDir = componentPath.includes("/") ? componentPath.substring(0, componentPath.lastIndexOf("/")) : "";
+      const fileInSameDir = boardFiles.find((file) => {
+        const fileDir = file.includes("/") ? file.substring(0, file.lastIndexOf("/")) : "";
+        return fileDir === currentDir;
+      });
+      if (fileInSameDir) {
+        setComponentPath(fileInSameDir);
+        return;
+      }
+    }
     const defaultPath = window?.TSCIRCUIT_DEFAULT_MAIN_COMPONENT_PATH;
     const candidatePaths = [props.initialMainComponentPath, defaultPath].filter(
       (value) => Boolean(value)
@@ -1566,7 +1596,9 @@ var RunFrameWithApi = (props) => {
               if (typeof fsMap.get(value) === "string") {
                 setComponentPath(value);
               }
-            }
+            },
+            pinnedFiles: favorites,
+            onToggleFavorite: handleToggleFavorite
           }
         ) })
       ] }),
@@ -2249,12 +2281,6 @@ import { useCallback as useCallback5, useEffect as useEffect9, useState as useSt
 
 // lib/components/RunFrameStaticBuildViewer/CircuitJsonFileSelectorCombobox.tsx
 import { jsx as jsx9 } from "react/jsx-runtime";
-var circuitJsonConfig = {
-  fileFilter: () => true,
-  placeholder: "Select circuit",
-  searchPlaceholder: "Search for circuit file",
-  emptyMessage: "No circuit files found in this directory."
-};
 var CircuitJsonFileSelectorCombobox = ({
   files,
   onFileChange,
@@ -2266,7 +2292,10 @@ var CircuitJsonFileSelectorCombobox = ({
       files,
       onFileChange,
       currentFile,
-      config: circuitJsonConfig
+      fileFilter: () => true,
+      placeholder: "Select circuit",
+      searchPlaceholder: "Search for circuit file",
+      emptyMessage: "No circuit files found in this directory."
     }
   );
 };