@tscircuit/runframe 0.0.11 → 0.0.12

package/lib/components/ui/dropdown-menu.tsx

@@ -1,203 +0,0 @@
-import * as React from "react"
-import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
-import {
-  CheckIcon,
-  ChevronRightIcon,
-  DotFilledIcon,
-} from "@radix-ui/react-icons"
-
-import { cn } from "lib/utils"
-
-const DropdownMenu = DropdownMenuPrimitive.Root
-
-const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
-
-const DropdownMenuGroup = DropdownMenuPrimitive.Group
-
-const DropdownMenuPortal = DropdownMenuPrimitive.Portal
-
-const DropdownMenuSub = DropdownMenuPrimitive.Sub
-
-const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
-
-const DropdownMenuSubTrigger = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {
-    inset?: boolean
-  }
->(({ className, inset, children, ...props }, ref) => (
-  <DropdownMenuPrimitive.SubTrigger
-    ref={ref}
-    className={cn(
-      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-slate-100 data-[state=open]:bg-slate-100 dark:focus:bg-slate-800 dark:data-[state=open]:bg-slate-800",
-      inset && "pl-8",
-      className,
-    )}
-    {...props}
-  >
-    {children}
-    <ChevronRightIcon className="ml-auto h-4 w-4" />
-  </DropdownMenuPrimitive.SubTrigger>
-))
-DropdownMenuSubTrigger.displayName =
-  DropdownMenuPrimitive.SubTrigger.displayName
-
-const DropdownMenuSubContent = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>
->(({ className, ...props }, ref) => (
-  <DropdownMenuPrimitive.SubContent
-    ref={ref}
-    className={cn(
-      "z-50 min-w-[8rem] overflow-hidden rounded-md border border-slate-200 bg-white p-1 text-slate-950 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-slate-800 dark:bg-slate-950 dark:text-slate-50",
-      className,
-    )}
-    {...props}
-  />
-))
-DropdownMenuSubContent.displayName =
-  DropdownMenuPrimitive.SubContent.displayName
-
-const DropdownMenuContent = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
->(({ className, sideOffset = 4, ...props }, ref) => (
-  <DropdownMenuPrimitive.Portal>
-    <DropdownMenuPrimitive.Content
-      ref={ref}
-      sideOffset={sideOffset}
-      className={cn(
-        "z-50 min-w-[8rem] overflow-hidden rounded-md border border-slate-200 bg-white p-1 text-slate-950 shadow-md dark:border-slate-800 dark:bg-slate-950 dark:text-slate-50",
-        "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        className,
-      )}
-      {...props}
-    />
-  </DropdownMenuPrimitive.Portal>
-))
-DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
-
-const DropdownMenuItem = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.Item>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
-    inset?: boolean
-  }
->(({ className, inset, ...props }, ref) => (
-  <DropdownMenuPrimitive.Item
-    ref={ref}
-    className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-slate-100 focus:text-slate-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-slate-800 dark:focus:text-slate-50",
-      inset && "pl-8",
-      className,
-    )}
-    {...props}
-  />
-))
-DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
-
-const DropdownMenuCheckboxItem = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>
->(({ className, children, checked, ...props }, ref) => (
-  <DropdownMenuPrimitive.CheckboxItem
-    ref={ref}
-    className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-slate-100 focus:text-slate-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-slate-800 dark:focus:text-slate-50",
-      className,
-    )}
-    checked={checked}
-    {...props}
-  >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
-      <DropdownMenuPrimitive.ItemIndicator>
-        <CheckIcon className="h-4 w-4" />
-      </DropdownMenuPrimitive.ItemIndicator>
-    </span>
-    {children}
-  </DropdownMenuPrimitive.CheckboxItem>
-))
-DropdownMenuCheckboxItem.displayName =
-  DropdownMenuPrimitive.CheckboxItem.displayName
-
-const DropdownMenuRadioItem = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>
->(({ className, children, ...props }, ref) => (
-  <DropdownMenuPrimitive.RadioItem
-    ref={ref}
-    className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-slate-100 focus:text-slate-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-slate-800 dark:focus:text-slate-50",
-      className,
-    )}
-    {...props}
-  >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
-      <DropdownMenuPrimitive.ItemIndicator>
-        <DotFilledIcon className="h-4 w-4 fill-current" />
-      </DropdownMenuPrimitive.ItemIndicator>
-    </span>
-    {children}
-  </DropdownMenuPrimitive.RadioItem>
-))
-DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
-
-const DropdownMenuLabel = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.Label>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {
-    inset?: boolean
-  }
->(({ className, inset, ...props }, ref) => (
-  <DropdownMenuPrimitive.Label
-    ref={ref}
-    className={cn(
-      "px-2 py-1.5 text-sm font-semibold",
-      inset && "pl-8",
-      className,
-    )}
-    {...props}
-  />
-))
-DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
-
-const DropdownMenuSeparator = React.forwardRef<
-  React.ElementRef<typeof DropdownMenuPrimitive.Separator>,
-  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>
->(({ className, ...props }, ref) => (
-  <DropdownMenuPrimitive.Separator
-    ref={ref}
-    className={cn("-mx-1 my-1 h-px bg-slate-100 dark:bg-slate-800", className)}
-    {...props}
-  />
-))
-DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
-
-const DropdownMenuShortcut = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLSpanElement>) => {
-  return (
-    <span
-      className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
-      {...props}
-    />
-  )
-}
-DropdownMenuShortcut.displayName = "DropdownMenuShortcut"
-
-export {
-  DropdownMenu,
-  DropdownMenuTrigger,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuCheckboxItem,
-  DropdownMenuRadioItem,
-  DropdownMenuLabel,
-  DropdownMenuSeparator,
-  DropdownMenuShortcut,
-  DropdownMenuGroup,
-  DropdownMenuPortal,
-  DropdownMenuSub,
-  DropdownMenuSubContent,
-  DropdownMenuSubTrigger,
-  DropdownMenuRadioGroup,
-}

package/lib/components/ui/tabs.tsx

@@ -1,53 +0,0 @@
-import * as React from "react"
-import * as TabsPrimitive from "@radix-ui/react-tabs"
-
-import { cn } from "lib/utils"
-
-const Tabs = TabsPrimitive.Root
-
-const TabsList = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.List>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.List
-    ref={ref}
-    className={cn(
-      "inline-flex h-9 items-center justify-center rounded-lg bg-slate-100 p-1 text-slate-500 dark:bg-slate-800 dark:text-slate-400",
-      className,
-    )}
-    {...props}
-  />
-))
-TabsList.displayName = TabsPrimitive.List.displayName
-
-const TabsTrigger = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Trigger>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Trigger
-    ref={ref}
-    className={cn(
-      "inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-white transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-950 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-white data-[state=active]:text-slate-950 data-[state=active]:shadow dark:ring-offset-slate-950 dark:focus-visible:ring-slate-300 dark:data-[state=active]:bg-slate-950 dark:data-[state=active]:text-slate-50",
-      className,
-    )}
-    {...props}
-  />
-))
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
-
-const TabsContent = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Content
-    ref={ref}
-    className={cn(
-      "mt-2 ring-offset-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-950 focus-visible:ring-offset-2 dark:ring-offset-slate-950 dark:focus-visible:ring-slate-300",
-      className,
-    )}
-    {...props}
-  />
-))
-TabsContent.displayName = TabsPrimitive.Content.displayName
-
-export { Tabs, TabsList, TabsTrigger, TabsContent }

package/lib/dev/render-to-circuit-json.ts

@@ -1,7 +0,0 @@
-import * as Core from "@tscircuit/core"
-
-export const renderToCircuitJson = (board: React.ReactElement) => {
-  const circuit = new Core.Circuit()
-  circuit.add(board)
-  return circuit.getCircuitJson()
-}

package/lib/hooks/use-styles.ts

@@ -1,17 +0,0 @@
-import { useEffect } from "react"
-import styles from "./styles.generated"
-
-export const useStyles = () => {
-  useEffect(() => {
-    // Check if styles are already added
-    const existingStyle = document.querySelector(
-      'style[data-styles="tscircuit-runframe"]',
-    )
-    if (existingStyle) return
-
-    const styleElement = document.createElement("style")
-    styleElement.setAttribute("data-styles", "tscircuit-runframe")
-    styleElement.textContent = styles
-    document.head.appendChild(styleElement)
-  }, [])
-}

package/lib/preview.ts

@@ -1 +0,0 @@
-export * from "./components/CircuitJsonPreview"

package/lib/runner.ts

@@ -1,2 +0,0 @@
-export * from "./preview"
-export * from "./components/RunFrame"

package/lib/utils/index.ts

@@ -1,6 +0,0 @@
-import { clsx, type ClassValue } from "clsx"
-import { twMerge } from "tailwind-merge"
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
-}

package/lib/utils/pcbManualEditEventHandler.ts

@@ -1,156 +0,0 @@
-import type { ManualTraceHint } from "@tscircuit/layout"
-import { getManualTraceHintFromEvent } from "@tscircuit/layout"
-import type { EditEvent } from "@tscircuit/manual-edit-events"
-import type {
-  AnyCircuitElement,
-  PcbComponent,
-  SourceComponentBase,
-} from "circuit-json"
-
-export interface PCBPlacement {
-  selector: string
-  center: { x: number; y: number }
-  relative_to: "group_center"
-  _edit_event_id?: string
-}
-
-export interface ManualEditState {
-  pcb_placements: PCBPlacement[]
-  edit_events: EditEvent[]
-  manual_trace_hints: ManualTraceHint[]
-}
-
-export const createInitialManualEditState = (): ManualEditState => ({
-  pcb_placements: [],
-  edit_events: [],
-  manual_trace_hints: [],
-})
-
-export const applyPcbEditEvents = ({
-  editEvents,
-  circuitJson,
-  manualEditsFileContent,
-}: {
-  editEvents: EditEvent[]
-  circuitJson: AnyCircuitElement[]
-  manualEditsFileContent?: string
-}): ManualEditState => {
-  try {
-    // Ensure we have a valid state to work with
-    const validatedManualEdits = ensureValidState(manualEditsFileContent)
-
-    // Create a new state object with properly initialized arrays
-    const newManualEditState: ManualEditState = {
-      pcb_placements: [...validatedManualEdits.pcb_placements],
-      edit_events: [...validatedManualEdits.edit_events],
-      manual_trace_hints: [...validatedManualEdits.manual_trace_hints],
-    }
-
-    // Create a set of handled event IDs
-    const handledEventIds = new Set<string>()
-
-    // Add existing event IDs to the set
-    newManualEditState.pcb_placements.forEach((placement) => {
-      if (placement._edit_event_id) {
-        handledEventIds.add(placement._edit_event_id)
-      }
-    })
-
-    newManualEditState.edit_events.forEach((event) => {
-      if (event.edit_event_id) {
-        handledEventIds.add(event.edit_event_id)
-      }
-    })
-
-    // Process new edit events
-    for (const editEvent of editEvents) {
-      if (
-        (editEvent.in_progress && !editEvent.edit_event_id) ||
-        handledEventIds.has(editEvent.edit_event_id)
-      )
-        continue
-
-      if (
-        editEvent.pcb_edit_event_type === "edit_component_location" &&
-        editEvent.pcb_component_id
-      ) {
-        // Find the component in the circuitJson
-        const pcbComponent = circuitJson.find(
-          (item: AnyCircuitElement) =>
-            item.type === "pcb_component" &&
-            item.pcb_component_id === editEvent.pcb_component_id,
-        ) as PcbComponent
-
-        if (!pcbComponent?.pcb_component_id) continue
-
-        const nameofComponent = circuitJson.find(
-          (item: AnyCircuitElement) =>
-            item.type === "source_component" &&
-            item.source_component_id === pcbComponent.source_component_id,
-        ) as SourceComponentBase
-
-        // Update or add placement
-        const existingPlacementIndex =
-          newManualEditState.pcb_placements.findIndex(
-            (p) => p.selector === nameofComponent.name,
-          )
-
-        const newPlacement: PCBPlacement = {
-          selector: nameofComponent.name,
-          center: editEvent.new_center,
-          relative_to: "group_center",
-          _edit_event_id: editEvent.edit_event_id,
-        }
-
-        if (existingPlacementIndex !== -1) {
-          // Update existing placement
-          newManualEditState.pcb_placements[existingPlacementIndex] =
-            newPlacement
-        } else {
-          // Add new placement
-          newManualEditState.pcb_placements.push(newPlacement)
-        }
-      } else if (editEvent.pcb_edit_event_type === "edit_trace_hint") {
-        const newTraceHint = getManualTraceHintFromEvent(circuitJson, editEvent)
-        if (newTraceHint) {
-          newManualEditState.manual_trace_hints = [
-            ...newManualEditState.manual_trace_hints.filter(
-              (th) => th.pcb_port_selector !== newTraceHint.pcb_port_selector,
-            ),
-            newTraceHint,
-          ]
-        }
-      } else {
-        // Add any other type of event to edit_events array
-        newManualEditState.edit_events.push(editEvent)
-      }
-
-      handledEventIds.add(editEvent.edit_event_id)
-    }
-
-    return newManualEditState
-  } catch (error) {
-    console.error("Error handling edit events:", error)
-    // Return a fresh state if there's an error
-    return createInitialManualEditState()
-  }
-}
-
-// Helper function to ensure we have a valid state
-const ensureValidState = (manualEditsFileContent?: string): ManualEditState => {
-  if (!manualEditsFileContent) return createInitialManualEditState()
-
-  const manualEditState = JSON.parse(manualEditsFileContent)
-
-  return {
-    pcb_placements: Array.isArray(manualEditState.pcb_placements)
-      ? manualEditState.pcb_placements
-      : [],
-    edit_events: Array.isArray(manualEditState.edit_events)
-      ? manualEditState.edit_events
-      : [],
-    manual_trace_hints: Array.isArray(manualEditState.manual_trace_hints)
-      ? manualEditState.manual_trace_hints
-      : [],
-  }
-}

package/postcss.config.js

@@ -1,8 +0,0 @@
-export default {
-  plugins: {
-    tailwindcss: {},
-    cssnano: {
-      preset: "default",
-    },
-  },
-}

package/renovate.json

@@ -1,15 +0,0 @@
-{
-  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": ["config:base"],
-  "packageRules": [
-    {
-      "packagePatterns": ["*"],
-      "excludePackagePatterns": ["@tscircuit/*", "circuit-to-svg"],
-      "enabled": false
-    },
-    {
-      "matchUpdateTypes": ["major", "minor", "patch"],
-      "automerge": true
-    }
-  ]
-}

package/scripts/build-css.ts

@@ -1,26 +0,0 @@
-import fs from "node:fs"
-import postcss from "postcss"
-import tailwindcss from "tailwindcss"
-import autoprefixer from "autoprefixer"
-import cssnano from "cssnano"
-import tailwindConfig from "../tailwind.config"
-
-async function buildCss() {
-  // Read your base CSS file with @tailwind directives
-  const css = "@tailwind components; @tailwind utilities;"
-
-  const result = await postcss([
-    tailwindcss(tailwindConfig),
-    autoprefixer,
-    cssnano,
-  ]).process(css, {
-    from: undefined,
-  })
-
-  fs.writeFileSync(
-    "./lib/hooks/styles.generated.ts",
-    `export default \`${result.css.replace(/\\/g, "\\\\")}\``,
-  )
-}
-
-buildCss()

package/src/main.tsx

@@ -1,13 +0,0 @@
-import { RunFrameWithApi } from "lib/components/RunFrameWithApi"
-import React from "react"
-import { createRoot } from "react-dom/client"
-
-const root = createRoot(document.getElementById("root")!)
-
-root.render(
-  <React.StrictMode>
-    <div style={{ width: "100vw", height: "100vh" }}>
-      <RunFrameWithApi />
-    </div>
-  </React.StrictMode>,
-)

package/tailwind.config.js

@@ -1,3 +0,0 @@
-export default {
-  content: ["./lib/**/*.{js,jsx,ts,tsx}"],
-}

package/tsconfig.json

@@ -1,45 +0,0 @@
-{
-  "compilerOptions": {
-    // Enable latest features
-    "lib": ["ESNext", "DOM"],
-    "target": "ES2020",
-    "module": "ESNext",
-    "moduleDetection": "force",
-    "jsx": "react-jsx",
-    "allowJs": true,
-
-    "baseUrl": ".",
-    "paths": {
-      "lib/*": ["lib/*"]
-    },
-    "esModuleInterop": true,
-
-    // Bundler mode
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "verbatimModuleSyntax": true,
-    "noEmit": true,
-
-    // Best practices
-    "strict": true,
-    "skipLibCheck": true,
-    "noFallthroughCasesInSwitch": true,
-
-    // Some stricter flags (disabled by default)
-    "noUnusedLocals": false,
-    "noUnusedParameters": false,
-    "noPropertyAccessFromIndexSignature": false
-  },
-  "include": [
-    "lib/**/*.ts",
-    "lib/**/*.tsx",
-    "examples/**/*.ts",
-    "examples/**/*.tsx",
-    "cli/**/*.ts",
-    "cli/**/*.tsx",
-    "scripts/**/*.ts",
-    "scripts/**/*.tsx",
-    "src/**/*.ts",
-    "src/**/*.tsx"
-  ]
-}

package/vite.config.ts

@@ -1,72 +0,0 @@
-import { defineConfig, type Plugin } from "vite"
-import react from "@vitejs/plugin-react"
-import { resolve } from "node:path"
-import winterspecBundle from "@tscircuit/file-server/dist/bundle"
-import { getNodeHandler } from "winterspec/adapters/node"
-import { visualizer } from "rollup-plugin-visualizer"
-
-const fakeHandler = getNodeHandler(winterspecBundle as any, {})
-
-function apiServerPlugin(): Plugin {
-  return {
-    name: "api-server",
-    configureServer(server) {
-      server.middlewares.use(async (req, res, next) => {
-        if (req.url?.startsWith("/api/")) {
-          req.url = req.url.replace("/api/", "/")
-          fakeHandler(req, res)
-        } else {
-          next()
-        }
-      })
-    },
-  }
-}
-
-const plugins: any[] = [react()]
-
-if (!process.env.VERCEL && !process.env.STANDALONE) {
-  plugins.push(apiServerPlugin())
-}
-
-let build: any = undefined
-
-if (process.env.STANDALONE) {
-  // plugins.push(
-  //   visualizer({
-  //     filename: "stats.html",
-  //     open: true, // Will open the stats.html file after build
-  //     gzipSize: true,
-  //     brotliSize: true,
-  //   }),
-  // )
-  build = {
-    lib: {
-      entry: resolve(__dirname, "src/main.tsx"),
-      name: "standalone",
-      fileName: (format) => `standalone.min.js`,
-      formats: ["umd"],
-    },
-    minify: true,
-    // reportCompressedSize: true,
-  }
-}
-
-export default defineConfig({
-  plugins,
-  resolve: {
-    alias: {
-      lib: resolve(__dirname, "./lib"),
-    },
-  },
-  define: {
-    global: {
-      process: {
-        env: {},
-      },
-    },
-  },
-  root: ".",
-  publicDir: "public",
-  build,
-})