@tscircuit/cli 0.0.394 → 0.1.2

package/frontend/components/ui/tabs.tsx

@@ -1,53 +0,0 @@
-import * as React from "react"
-import * as TabsPrimitive from "@radix-ui/react-tabs"
-
-import { cn } from "frontend/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-muted p-1 text-muted-foreground",
-      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-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow",
-      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-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-      className,
-    )}
-    {...props}
-  />
-))
-TabsContent.displayName = TabsPrimitive.Content.displayName
-
-export { Tabs, TabsList, TabsTrigger, TabsContent }

package/frontend/components/ui/toggle-group.tsx

@@ -1,59 +0,0 @@
-import * as React from "react"
-import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group"
-import { VariantProps } from "class-variance-authority"
-
-import { cn } from "frontend/lib/utils"
-import { toggleVariants } from "frontend/components/ui/toggle"
-
-const ToggleGroupContext = React.createContext<
-  VariantProps<typeof toggleVariants>
->({
-  size: "default",
-  variant: "default",
-})
-
-const ToggleGroup = React.forwardRef<
-  React.ElementRef<typeof ToggleGroupPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root> &
-    VariantProps<typeof toggleVariants>
->(({ className, variant, size, children, ...props }, ref) => (
-  <ToggleGroupPrimitive.Root
-    ref={ref}
-    className={cn("flex items-center justify-center gap-1", className)}
-    {...props}
-  >
-    <ToggleGroupContext.Provider value={{ variant, size }}>
-      {children}
-    </ToggleGroupContext.Provider>
-  </ToggleGroupPrimitive.Root>
-))
-
-ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName
-
-const ToggleGroupItem = React.forwardRef<
-  React.ElementRef<typeof ToggleGroupPrimitive.Item>,
-  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item> &
-    VariantProps<typeof toggleVariants>
->(({ className, children, variant, size, ...props }, ref) => {
-  const context = React.useContext(ToggleGroupContext)
-
-  return (
-    <ToggleGroupPrimitive.Item
-      ref={ref}
-      className={cn(
-        toggleVariants({
-          variant: context.variant || variant,
-          size: context.size || size,
-        }),
-        className,
-      )}
-      {...props}
-    >
-      {children}
-    </ToggleGroupPrimitive.Item>
-  )
-})
-
-ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName
-
-export { ToggleGroup, ToggleGroupItem }

package/frontend/components/ui/toggle.tsx

@@ -1,43 +0,0 @@
-import * as React from "react"
-import * as TogglePrimitive from "@radix-ui/react-toggle"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "frontend/lib/utils"
-
-const toggleVariants = cva(
-  "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground",
-  {
-    variants: {
-      variant: {
-        default: "bg-transparent",
-        outline:
-          "border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground",
-      },
-      size: {
-        default: "h-9 px-3",
-        sm: "h-8 px-2",
-        lg: "h-10 px-3",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  },
-)
-
-const Toggle = React.forwardRef<
-  React.ElementRef<typeof TogglePrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> &
-    VariantProps<typeof toggleVariants>
->(({ className, variant, size, ...props }, ref) => (
-  <TogglePrimitive.Root
-    ref={ref}
-    className={cn(toggleVariants({ variant, size, className }))}
-    {...props}
-  />
-))
-
-Toggle.displayName = TogglePrimitive.Root.displayName
-
-export { Toggle, toggleVariants }

package/frontend/components/ui/tooltip.tsx

@@ -1,28 +0,0 @@
-import * as React from "react"
-import * as TooltipPrimitive from "@radix-ui/react-tooltip"
-
-import { cn } from "frontend/lib/utils"
-
-const TooltipProvider = TooltipPrimitive.Provider
-
-const Tooltip = TooltipPrimitive.Root
-
-const TooltipTrigger = TooltipPrimitive.Trigger
-
-const TooltipContent = React.forwardRef<
-  React.ElementRef<typeof TooltipPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
->(({ className, sideOffset = 4, ...props }, ref) => (
-  <TooltipPrimitive.Content
-    ref={ref}
-    sideOffset={sideOffset}
-    className={cn(
-      "z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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}
-  />
-))
-TooltipContent.displayName = TooltipPrimitive.Content.displayName
-
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }

package/frontend/components.json

@@ -1,17 +0,0 @@
-{
-  "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "new-york",
-  "rsc": false,
-  "tsx": true,
-  "tailwind": {
-    "config": "tailwind.config.js",
-    "css": "src/index.css",
-    "baseColor": "gray",
-    "cssVariables": true,
-    "prefix": ""
-  },
-  "aliases": {
-    "components": "src/components",
-    "utils": "src/lib/utils"
-  }
-}

package/frontend/hooks/toast-if-api-not-connected.ts

@@ -1,23 +0,0 @@
-import { useEffect } from "react"
-import axios from "axios"
-import toast from "react-hot-toast"
-
-export const useToastIfApiNotConnected = () => {
-  useEffect(() => {
-    let lastWasConnected = true
-    const interval = setInterval(async () => {
-      try {
-        await axios.get("/api/health")
-        if (!lastWasConnected) {
-          toast.success("Reconnected to dev server API")
-          lastWasConnected = true
-        }
-      } catch (e) {
-        toast.error("Not connected to dev server API")
-        lastWasConnected = false
-      }
-    }, 5000)
-
-    return () => clearInterval(interval)
-  }, [])
-}

package/frontend/hooks/use-active-dev-package-example-lite.ts

@@ -1,39 +0,0 @@
-import { useDevPackageExamples } from "./use-dev-package-examples"
-import { useGlobalStore } from "./use-global-store"
-
-export function inflatePackageExample(ex: any): {
-  dev_package_example_id: number
-  searchable_id: string
-  file_path: string
-  expath: string
-  export_name: string
-  last_updated_at: string
-} {
-  if (!ex) return ex
-  return {
-    ...ex,
-    expath: ex.file_path.replace(/.*examples\//, ""),
-    searchable_id: `${ex.file_path.replace(/.*examples\//, "")} | ${
-      ex.export_name
-    }`,
-  }
-}
-
-export const useActiveDevPackageExampleLite = () => {
-  const { data: examples } = useDevPackageExamples()
-
-  const [active_dev_example_package_id, setActiveDevExamplePackageId] =
-    useGlobalStore((s) => [
-      s.active_dev_example_package_id,
-      s.setActiveDevExamplePackageId,
-    ])
-
-  const activeDevExamplePackage = inflatePackageExample(
-    examples?.find(
-      (ex) =>
-        ex.dev_package_example_id.toString() === active_dev_example_package_id,
-    ),
-  )
-
-  return activeDevExamplePackage
-}

package/frontend/hooks/use-dev-package-examples.tsx

@@ -1,18 +0,0 @@
-"use client"
-import { useQuery } from "react-query"
-import axios from "axios"
-import { inflatePackageExample } from "../components/select-example-search"
-
-export const useDevPackageExamples = () => {
-  return useQuery("examples", async () => {
-    const { data } = await axios.get("/api/dev_package_examples/list")
-    return data.dev_package_examples.map(inflatePackageExample) as Array<{
-      dev_package_example_id: number
-      searchable_id: string
-      file_path: string
-      expath: string
-      export_name: string
-      last_updated_at: string
-    }>
-  })
-}

package/frontend/hooks/use-global-store.ts

@@ -1,42 +0,0 @@
-import { create } from "zustand"
-import { persist } from "zustand/middleware"
-
-export interface GlobalState {
-  active_dev_example_package_id: string | null
-
-  view_mode: "schematic" | "pcb" | "split" | "soup" | "3d"
-  split_mode: "horizontal" | "vertical"
-  in_debug_mode: boolean
-
-  setActiveDevExamplePackageId: (id: string) => void
-  setViewMode: (mode: "schematic" | "pcb" | "split") => void
-  setSplitMode: (mode: "horizontal" | "vertical") => void
-  setDebugMode: (mode: boolean) => void
-}
-
-export const useGlobalStore = create<GlobalState>()(
-  persist(
-    (set) => ({
-      active_dev_example_package_id: null,
-      view_mode: "schematic",
-      split_mode: "horizontal",
-      in_debug_mode: false,
-
-      setActiveDevExamplePackageId: (id: string) => {
-        set({ active_dev_example_package_id: id })
-      },
-      setViewMode: (mode: "schematic" | "pcb" | "split") => {
-        set({ view_mode: mode })
-      },
-      setSplitMode: (mode: "horizontal" | "vertical") => {
-        set({ split_mode: mode })
-      },
-      setDebugMode: (mode: boolean) => {
-        set({ in_debug_mode: mode })
-      },
-    }),
-    {
-      name: "global-store",
-    },
-  ),
-)

package/frontend/index.css

@@ -1,76 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@layer base {
-  :root {
-    --background: 0 0% 100%;
-    --foreground: 224 71.4% 4.1%;
-
-    --card: 0 0% 100%;
-    --card-foreground: 224 71.4% 4.1%;
-
-    --popover: 0 0% 100%;
-    --popover-foreground: 224 71.4% 4.1%;
-
-    --primary: 220.9 39.3% 11%;
-    --primary-foreground: 210 20% 98%;
-
-    --secondary: 220 14.3% 95.9%;
-    --secondary-foreground: 220.9 39.3% 11%;
-
-    --muted: 220 14.3% 95.9%;
-    --muted-foreground: 220 8.9% 46.1%;
-
-    --accent: 220 14.3% 95.9%;
-    --accent-foreground: 220.9 39.3% 11%;
-
-    --destructive: 0 84.2% 60.2%;
-    --destructive-foreground: 210 20% 98%;
-
-    --border: 220 13% 91%;
-    --input: 220 13% 91%;
-    --ring: 224 71.4% 4.1%;
-
-    --radius: 0.5rem;
-  }
-
-  .dark {
-    --background: 224 71.4% 4.1%;
-    --foreground: 210 20% 98%;
-
-    --card: 224 71.4% 4.1%;
-    --card-foreground: 210 20% 98%;
-
-    --popover: 224 71.4% 4.1%;
-    --popover-foreground: 210 20% 98%;
-
-    --primary: 210 20% 98%;
-    --primary-foreground: 220.9 39.3% 11%;
-
-    --secondary: 215 27.9% 16.9%;
-    --secondary-foreground: 210 20% 98%;
-
-    --muted: 215 27.9% 16.9%;
-    --muted-foreground: 217.9 10.6% 64.9%;
-
-    --accent: 215 27.9% 16.9%;
-    --accent-foreground: 210 20% 98%;
-
-    --destructive: 0 62.8% 30.6%;
-    --destructive-foreground: 210 20% 98%;
-
-    --border: 215 27.9% 16.9%;
-    --input: 215 27.9% 16.9%;
-    --ring: 216 12.2% 83.9%;
-  }
-}
-
-@layer base {
-  * {
-    @apply border-border;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}

package/frontend/index.html

@@ -1,13 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <!-- <link rel="icon" type="image/svg+xml" href="/vite.svg" /> -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>[dev] tscircuit</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/main.tsx"></script>
-  </body>
-</html>

package/frontend/lib/utils.ts

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

package/frontend/main.tsx

@@ -1,13 +0,0 @@
-import React from "react"
-import ReactDOM from "react-dom/client"
-import App from "./views/App.tsx"
-import "./index.css"
-import { GlobalContextProviders } from "./components/global-context-providers.tsx"
-
-ReactDOM.createRoot(document.getElementById("root")!).render(
-  <React.StrictMode>
-    <GlobalContextProviders>
-      <App />
-    </GlobalContextProviders>
-  </React.StrictMode>,
-)

package/frontend/tailwind.config.js

@@ -1,74 +0,0 @@
-const path = require("node:path")
-
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  darkMode: ["class"],
-  content: [path.join(__dirname, "./{src,components,lib,views}/**/*.{ts,tsx}")],
-  prefix: "",
-  theme: {
-    container: {
-      center: true,
-      padding: "2rem",
-      screens: {
-        "2xl": "1400px",
-      },
-    },
-    extend: {
-      colors: {
-        border: "hsl(var(--border))",
-        input: "hsl(var(--input))",
-        ring: "hsl(var(--ring))",
-        background: "hsl(var(--background))",
-        foreground: "hsl(var(--foreground))",
-        primary: {
-          DEFAULT: "hsl(var(--primary))",
-          foreground: "hsl(var(--primary-foreground))",
-        },
-        secondary: {
-          DEFAULT: "hsl(var(--secondary))",
-          foreground: "hsl(var(--secondary-foreground))",
-        },
-        destructive: {
-          DEFAULT: "hsl(var(--destructive))",
-          foreground: "hsl(var(--destructive-foreground))",
-        },
-        muted: {
-          DEFAULT: "hsl(var(--muted))",
-          foreground: "hsl(var(--muted-foreground))",
-        },
-        accent: {
-          DEFAULT: "hsl(var(--accent))",
-          foreground: "hsl(var(--accent-foreground))",
-        },
-        popover: {
-          DEFAULT: "hsl(var(--popover))",
-          foreground: "hsl(var(--popover-foreground))",
-        },
-        card: {
-          DEFAULT: "hsl(var(--card))",
-          foreground: "hsl(var(--card-foreground))",
-        },
-      },
-      borderRadius: {
-        lg: "var(--radius)",
-        md: "calc(var(--radius) - 2px)",
-        sm: "calc(var(--radius) - 4px)",
-      },
-      keyframes: {
-        "accordion-down": {
-          from: { height: "0" },
-          to: { height: "var(--radix-accordion-content-height)" },
-        },
-        "accordion-up": {
-          from: { height: "var(--radix-accordion-content-height)" },
-          to: { height: "0" },
-        },
-      },
-      animation: {
-        "accordion-down": "accordion-down 0.2s ease-out",
-        "accordion-up": "accordion-up 0.2s ease-out",
-      },
-    },
-  },
-  plugins: [require("tailwindcss-animate")],
-}

package/frontend/views/App.tsx

@@ -1,22 +0,0 @@
-import { TabsContent } from "frontend/components/ui/tabs"
-import { MenubarShortcut } from "frontend/components/ui/menubar"
-import { CommandK } from "frontend/components/command-k"
-import { useToastIfApiNotConnected } from "frontend/hooks/toast-if-api-not-connected"
-import { Header } from "./Header"
-import { MainContentView } from "./MainContentView"
-
-function App() {
-  useToastIfApiNotConnected()
-
-  return (
-    <div className="">
-      <Header />
-      <div className="">
-        <MainContentView />
-      </div>
-      <CommandK />
-    </div>
-  )
-}
-
-export default App

package/frontend/views/Header.tsx

@@ -1,55 +0,0 @@
-import { useState } from "react"
-import { SelectExampleSearch } from "frontend/components/select-example-search"
-import { Button } from "frontend/components/ui/button"
-import { Tabs, TabsList, TabsTrigger } from "frontend/components/ui/tabs"
-import { RotateCounterClockwiseIcon } from "@radix-ui/react-icons"
-import { useGlobalStore } from "frontend/hooks/use-global-store"
-import { HeaderMenu } from "./HeaderMenu"
-import { CommandShortcut } from "frontend/components/ui/command"
-
-export const Header = () => {
-  const [viewMode, setViewMode] = useGlobalStore((s) => [
-    s.view_mode,
-    s.setViewMode,
-  ])
-  const [splitMode, setSplitMode] = useGlobalStore((s) => [
-    s.split_mode,
-    s.setSplitMode,
-  ])
-  const [inDebugMode, setInDebugMode] = useState(false)
-
-  return (
-    <div className="p-2 border-b border-b-gray-200 shadow-sm grid grid-cols-3">
-      <div className="flex">
-        <div className="inline-flex">
-          <HeaderMenu />
-        </div>
-      </div>
-      <div className="justify-center flex">
-        <SelectExampleSearch />
-      </div>
-      <div className="flex justify-end">
-        {/* Tabs from shadcn with "Tab One" and "Tab Two" */}
-        <Tabs onValueChange={(v) => setViewMode(v as any)} value={viewMode}>
-          <TabsList>
-            <TabsTrigger value="schematic">Schematic</TabsTrigger>
-            <TabsTrigger value="pcb">PCB</TabsTrigger>
-            {/* <TabsTrigger value="split">Split</TabsTrigger> */}
-            <TabsTrigger value="3d">3D</TabsTrigger>
-          </TabsList>
-        </Tabs>
-        {/* Button is only relevant when the "Split" button is available */}
-        {/* <Button
-          variant="outline"
-          disabled={viewMode !== "split"}
-          className="ml-1 group"
-          onClick={() => {
-            setSplitMode(splitMode === "horizontal" ? "vertical" : "horizontal")
-          }}
-        >
-          <RotateCounterClockwiseIcon className="scale-x-[-1] group-hover:rotate-[30deg] transition-transform" />
-        </Button> */}
-      </div>
-    </div>
-  )
-}