@tscircuit/runframe 0.0.105 → 0.0.107

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,1127 +0,0 @@
1
- // lib/components/ui/tabs.tsx
2
- import * as React from "react";
3
- import * as TabsPrimitive from "@radix-ui/react-tabs";
4
-
5
- // lib/utils/index.ts
6
- import { clsx } from "clsx";
7
- import { twMerge } from "tailwind-merge";
8
- function cn(...inputs) {
9
- return twMerge(clsx(inputs));
10
- }
11
-
12
- // lib/components/ui/tabs.tsx
13
- import { jsx } from "react/jsx-runtime";
14
- var Tabs = TabsPrimitive.Root;
15
- var TabsList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
16
- TabsPrimitive.List,
17
- {
18
- ref,
19
- className: cn(
20
- "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",
21
- className
22
- ),
23
- ...props
24
- }
25
- ));
26
- TabsList.displayName = TabsPrimitive.List.displayName;
27
- var TabsTrigger = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
28
- TabsPrimitive.Trigger,
29
- {
30
- ref,
31
- className: cn(
32
- "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",
33
- className
34
- ),
35
- ...props
36
- }
37
- ));
38
- TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
39
- var TabsContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
40
- TabsPrimitive.Content,
41
- {
42
- ref,
43
- className: cn(
44
- "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",
45
- className
46
- ),
47
- ...props
48
- }
49
- ));
50
- TabsContent.displayName = TabsPrimitive.Content.displayName;
51
-
52
- // lib/utils/pcbManualEditEventHandler.ts
53
- import { getManualTraceHintFromEvent } from "@tscircuit/layout";
54
-
55
- // lib/components/CircuitJsonPreview.tsx
56
- import { CadViewer } from "@tscircuit/3d-viewer";
57
- import "@tscircuit/pcb-viewer";
58
- import { useCallback, useEffect as useEffect2, useState as useState4 } from "react";
59
-
60
- // lib/components/ErrorFallback.tsx
61
- import "react";
62
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
63
- var ErrorFallback = ({ error }) => {
64
- return /* @__PURE__ */ jsx2(
65
- "div",
66
- {
67
- "data-testid": "error-container",
68
- className: "error-container mt-4 bg-red-50 rounded-md border border-red-200",
69
- children: /* @__PURE__ */ jsxs("div", { className: "p-4", children: [
70
- /* @__PURE__ */ jsx2("h2", { className: "text-lg font-semibold text-red-800 mb-3", children: "Error Loading 3D Viewer" }),
71
- /* @__PURE__ */ jsx2("p", { className: "text-xs font-mono whitespace-pre-wrap text-red-700", children: error.message }),
72
- /* @__PURE__ */ jsx2(
73
- "details",
74
- {
75
- style: { whiteSpace: "pre-wrap" },
76
- className: "text-xs font-mono text-red-600 mt-2",
77
- children: error.stack
78
- }
79
- )
80
- ] })
81
- }
82
- );
83
- };
84
-
85
- // lib/components/CircuitJsonPreview.tsx
86
- import { ErrorBoundary } from "react-error-boundary";
87
-
88
- // lib/components/ErrorTabContent.tsx
89
- import { GitHubLogoIcon } from "@radix-ui/react-icons";
90
- import { ClipboardIcon } from "lucide-react";
91
-
92
- // lib/components/ui/button.tsx
93
- import * as React3 from "react";
94
- import { cva } from "class-variance-authority";
95
- import { jsx as jsx3 } from "react/jsx-runtime";
96
- var buttonVariants = cva(
97
- "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-slate-950 disabled:pointer-events-none disabled:opacity-50 dark:focus-visible:ring-slate-300",
98
- {
99
- variants: {
100
- variant: {
101
- default: "bg-slate-900 text-slate-50 shadow hover:bg-slate-900/90 dark:bg-slate-50 dark:text-slate-900 dark:hover:bg-slate-50/90",
102
- destructive: "bg-red-500 text-slate-50 shadow-sm hover:bg-red-500/90 dark:bg-red-900 dark:text-slate-50 dark:hover:bg-red-900/90",
103
- outline: "border border-slate-200 bg-white shadow-sm hover:bg-slate-100 hover:text-slate-900 dark:border-slate-800 dark:bg-slate-950 dark:hover:bg-slate-800 dark:hover:text-slate-50",
104
- secondary: "bg-slate-100 text-slate-900 shadow-sm hover:bg-slate-100/80 dark:bg-slate-800 dark:text-slate-50 dark:hover:bg-slate-800/80",
105
- ghost: "hover:bg-slate-100 hover:text-slate-900 dark:hover:bg-slate-800 dark:hover:text-slate-50",
106
- link: "text-slate-900 underline-offset-4 hover:underline dark:text-slate-50"
107
- },
108
- size: {
109
- default: "h-9 px-4 py-2",
110
- sm: "h-8 rounded-md px-3 text-xs",
111
- lg: "h-10 rounded-md px-8",
112
- icon: "h-9 w-9"
113
- }
114
- },
115
- defaultVariants: {
116
- variant: "default",
117
- size: "default"
118
- }
119
- }
120
- );
121
- var Button = React3.forwardRef(
122
- ({ className, variant, size, asChild = false, ...props }, ref) => {
123
- const Comp = "button";
124
- return /* @__PURE__ */ jsx3(
125
- Comp,
126
- {
127
- className: cn(buttonVariants({ variant, size, className })),
128
- ref,
129
- ...props
130
- }
131
- );
132
- }
133
- );
134
- Button.displayName = "Button";
135
-
136
- // lib/components/ErrorTabContent.tsx
137
- import { Fragment, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
138
- var ErrorTabContent = ({
139
- code,
140
- isStreaming,
141
- errorMessage
142
- }) => {
143
- if (!errorMessage) {
144
- return /* @__PURE__ */ jsx4("div", { className: "mt-4 bg-green-50 rounded-md border border-green-200", children: /* @__PURE__ */ jsxs2("div", { className: "p-4", children: [
145
- /* @__PURE__ */ jsx4("h3", { className: "text-lg font-semibold text-green-800 mb-3", children: "No Errors \u{1F44C}" }),
146
- /* @__PURE__ */ jsx4("p", { className: "text-sm text-green-700", children: "Your code is running without any errors." })
147
- ] }) });
148
- }
149
- return /* @__PURE__ */ jsxs2(Fragment, { children: [
150
- /* @__PURE__ */ jsx4("div", { className: "mt-4 bg-red-50 rounded-md border border-red-200 max-h-[500px] overflow-y-auto", children: /* @__PURE__ */ jsxs2("div", { className: "p-4", children: [
151
- /* @__PURE__ */ jsx4("h3", { className: "text-lg font-semibold text-red-800 mb-3", children: "Error" }),
152
- /* @__PURE__ */ jsx4("p", { className: "text-xs font-mono whitespace-pre-wrap text-red-600 mt-2", children: errorMessage })
153
- ] }) }),
154
- /* @__PURE__ */ jsxs2("div", { className: "flex gap-2 mt-4 justify-end", children: [
155
- /* @__PURE__ */ jsxs2(
156
- Button,
157
- {
158
- variant: "outline",
159
- onClick: () => {
160
- if (!errorMessage) return;
161
- navigator.clipboard.writeText(errorMessage);
162
- alert("Error copied to clipboard!");
163
- },
164
- children: [
165
- /* @__PURE__ */ jsx4(ClipboardIcon, { className: "w-4 h-4 mr-2" }),
166
- "Copy Error"
167
- ]
168
- }
169
- ),
170
- /* @__PURE__ */ jsxs2(
171
- Button,
172
- {
173
- variant: "outline",
174
- onClick: () => {
175
- window.alert(
176
- "Not supported yet! Please report/upvote an issue on github.com/tscircuit/tscircuit"
177
- );
178
- },
179
- children: [
180
- /* @__PURE__ */ jsx4(GitHubLogoIcon, { className: "w-4 h-4 mr-2" }),
181
- "Report Issue"
182
- ]
183
- }
184
- )
185
- ] })
186
- ] });
187
- };
188
-
189
- // lib/components/CircuitJsonPreview.tsx
190
- import { SchematicViewer } from "@tscircuit/schematic-viewer";
191
- import { AssemblyViewer } from "@tscircuit/assembly-viewer";
192
-
193
- // lib/components/PreviewEmptyState.tsx
194
- import { PlayIcon } from "lucide-react";
195
- import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
196
- var PreviewEmptyState = ({ onRunClicked }) => /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-3 bg-gray-100 text-center justify-center py-10", children: [
197
- "No circuit json loaded",
198
- onRunClicked && /* @__PURE__ */ jsxs3(Button, { className: "bg-blue-600 hover:bg-blue-500", onClick: onRunClicked, children: [
199
- "Run Code",
200
- /* @__PURE__ */ jsx5(PlayIcon, { className: "w-3 h-3 ml-2" })
201
- ] })
202
- ] });
203
- var PreviewEmptyState_default = PreviewEmptyState;
204
-
205
- // lib/components/CircuitJsonTableViewer/CircuitJsonTableViewer.tsx
206
- import { useReducer, useState } from "react";
207
-
208
- // lib/components/CircuitJsonTableViewer/ClickableText.tsx
209
- import { jsx as jsx6 } from "react/jsx-runtime";
210
- var ClickableText = ({
211
- text,
212
- onClick
213
- }) => {
214
- return /* @__PURE__ */ jsx6(
215
- "span",
216
- {
217
- className: "cursor-pointer underline text-blue-300 mx-2",
218
- onClick,
219
- children: text
220
- }
221
- );
222
- };
223
-
224
- // lib/components/CircuitJsonTableViewer/HeaderCell.tsx
225
- import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
226
- var HeaderCell = (p) => {
227
- return /* @__PURE__ */ jsxs4("div", { className: "leading-5", children: [
228
- /* @__PURE__ */ jsx7("div", { className: "py-2 font-bold", children: p.column.name }),
229
- /* @__PURE__ */ jsx7("div", { children: p.field?.() ?? /* @__PURE__ */ jsx7(
230
- "input",
231
- {
232
- type: "text",
233
- className: "border rounded p-1 w-full",
234
- onChange: (e) => {
235
- p.onTextChange?.(e.target.value);
236
- }
237
- }
238
- ) })
239
- ] });
240
- };
241
-
242
- // lib/components/CircuitJsonTableViewer/Modal.tsx
243
- import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
244
- var Modal = ({ open, children, title, onClose }) => {
245
- if (!open) return null;
246
- return /* @__PURE__ */ jsx8(
247
- "div",
248
- {
249
- className: "fixed inset-0 bg-black bg-opacity-50 flex justify-center items-center z-50",
250
- onClick: onClose,
251
- children: /* @__PURE__ */ jsxs5(
252
- "div",
253
- {
254
- className: "bg-white p-5 rounded-lg relative w-11/12 max-w-2xl",
255
- onClick: (e) => {
256
- e.preventDefault();
257
- e.stopPropagation();
258
- },
259
- children: [
260
- /* @__PURE__ */ jsx8("h2", { className: "mt-0 text-xl", children: title }),
261
- /* @__PURE__ */ jsx8(
262
- "button",
263
- {
264
- className: "absolute top-4 right-4 text-2xl font-bold",
265
- onClick: onClose,
266
- children: "\xD7"
267
- }
268
- ),
269
- children
270
- ]
271
- }
272
- )
273
- }
274
- );
275
- };
276
- var Modal_default = Modal;
277
-
278
- // lib/components/CircuitJsonTableViewer/CircuitJsonTableViewer.tsx
279
- import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
280
- var CircuitJsonTableViewer = ({
281
- elements
282
- }) => {
283
- const [modal, setModal] = useState({ open: false });
284
- const [filters, setFilter] = useReducer(
285
- (s, a) => ({
286
- ...s,
287
- ...a
288
- }),
289
- {}
290
- );
291
- const element_types = [...new Set(elements.map((e) => e.type))];
292
- const elements2 = elements.map((e) => {
293
- const primary_id = e[`${e.type}_id`];
294
- const other_ids = Object.fromEntries(
295
- Object.entries(e).filter(([k]) => {
296
- if (k === `${e.type}_id`) return false;
297
- if (!k.endsWith("_id")) return false;
298
- return true;
299
- })
300
- );
301
- const other_props = Object.fromEntries(
302
- Object.entries(e).filter(([k]) => !k.endsWith("_id"))
303
- );
304
- return {
305
- primary_id,
306
- other_ids,
307
- ...other_props,
308
- _og_elm: e
309
- };
310
- });
311
- const elements3 = elements2.map((e) => {
312
- let selector_path = "";
313
- const getSelectorPath = (e2) => {
314
- const parent_key = Object.keys(e2.other_ids).find(
315
- (k) => k.startsWith("source_")
316
- );
317
- if (!parent_key) return `.${e2.name}`;
318
- const parent_type = parent_key.slice(0, -3);
319
- const parent = elements2.find(
320
- (p) => p.type === parent_type && p.primary_id === e2.other_ids[parent_key]
321
- );
322
- if (!parent) return `??? > .${e2.name}`;
323
- if (!("name" in parent)) return `#${parent.primary_id} > .${e2.name}`;
324
- return `${getSelectorPath(parent)} > .${e2.name}`;
325
- };
326
- if ("name" in e) {
327
- selector_path = getSelectorPath(e);
328
- }
329
- return {
330
- ...e,
331
- selector_path
332
- };
333
- });
334
- const columns = [
335
- {
336
- key: "primary_id",
337
- name: "primary_id",
338
- renderCell: (row) => /* @__PURE__ */ jsxs6("div", { className: "flex items-center", children: [
339
- /* @__PURE__ */ jsx9(
340
- ClickableText,
341
- {
342
- text: row.primary_id,
343
- onClick: () => setFilter({
344
- focused_id: row.primary_id,
345
- id_search: void 0,
346
- selector_search: void 0
347
- })
348
- }
349
- ),
350
- /* @__PURE__ */ jsx9("span", { className: "flex-grow" }),
351
- /* @__PURE__ */ jsx9(
352
- ClickableText,
353
- {
354
- text: "(JSON)",
355
- onClick: () => setModal({
356
- open: true,
357
- element: row._og_elm,
358
- title: row.primary_id
359
- })
360
- }
361
- )
362
- ] }),
363
- renderHeaderCell: (col) => /* @__PURE__ */ jsx9(
364
- HeaderCell,
365
- {
366
- column: col,
367
- onTextChange: (v) => setFilter({ id_search: v }),
368
- field: !filters.focused_id ? void 0 : () => /* @__PURE__ */ jsxs6("div", { children: [
369
- "Focus:",
370
- " ",
371
- /* @__PURE__ */ jsx9("span", { className: "underline", children: filters.focused_id }),
372
- /* @__PURE__ */ jsx9(
373
- ClickableText,
374
- {
375
- text: "(unfocus)",
376
- onClick: () => setFilter({ focused_id: void 0 })
377
- }
378
- )
379
- ] })
380
- }
381
- )
382
- },
383
- {
384
- key: "type",
385
- name: "type",
386
- renderHeaderCell: (col) => /* @__PURE__ */ jsx9(
387
- HeaderCell,
388
- {
389
- column: col,
390
- field: () => /* @__PURE__ */ jsxs6(
391
- "select",
392
- {
393
- onChange: (e) => setFilter({ component_type_filter: e.target.value }),
394
- className: "border rounded p-1 w-full",
395
- children: [
396
- /* @__PURE__ */ jsx9("option", { value: "any", children: "any" }, "any"),
397
- /* @__PURE__ */ jsx9("option", { value: "source", children: "source" }, "source"),
398
- /* @__PURE__ */ jsx9("option", { value: "source/pcb", children: "source/pcb" }, "source/pcb"),
399
- /* @__PURE__ */ jsx9("option", { value: "source/schematic", children: "source/schematic" }, "source/schematic"),
400
- element_types.map((type) => /* @__PURE__ */ jsx9("option", { value: type, children: type }, type))
401
- ]
402
- }
403
- )
404
- }
405
- )
406
- },
407
- {
408
- key: "name",
409
- name: "name",
410
- renderHeaderCell: (col) => /* @__PURE__ */ jsx9(
411
- HeaderCell,
412
- {
413
- column: col,
414
- onTextChange: (t) => setFilter({ name_search: t })
415
- }
416
- )
417
- },
418
- {
419
- key: "selector_path",
420
- name: "selector_path",
421
- renderHeaderCell: (col) => /* @__PURE__ */ jsx9(
422
- HeaderCell,
423
- {
424
- column: col,
425
- onTextChange: (t) => setFilter({ selector_search: t })
426
- }
427
- )
428
- },
429
- {
430
- key: "other_ids",
431
- name: "other_ids",
432
- renderCell: (row) => /* @__PURE__ */ jsx9("div", { className: "space-x-2", children: Object.entries(row.other_ids).map(([other_id, v]) => /* @__PURE__ */ jsx9(
433
- ClickableText,
434
- {
435
- text: v,
436
- onClick: () => setFilter({ focused_id: v })
437
- },
438
- v
439
- )) })
440
- }
441
- ];
442
- const elements4 = elements3.filter((e) => {
443
- if (!filters.name_search) return true;
444
- return e.name?.toLowerCase()?.includes(filters.name_search.toLowerCase());
445
- }).filter((e) => {
446
- if (!filters.component_type_filter) return true;
447
- if (filters.component_type_filter === "any") return true;
448
- if (filters.component_type_filter === "source") {
449
- return e.type.startsWith("source_");
450
- }
451
- if (filters.component_type_filter === "source/pcb") {
452
- return e.type.startsWith("source_") || e.type.startsWith("pcb_");
453
- }
454
- if (filters.component_type_filter === "source/schematic") {
455
- return e.type.startsWith("source_") || e.type.startsWith("schematic_");
456
- }
457
- return e.type?.includes(filters.component_type_filter);
458
- }).filter((e) => {
459
- if (!filters.selector_search) return true;
460
- const parts = filters.selector_search.split(" ").filter((p) => p.length > 0);
461
- return parts.every((part) => e.selector_path?.includes(part));
462
- }).filter((e) => {
463
- if (!filters.id_search) return true;
464
- return e.primary_id?.includes(filters.id_search);
465
- }).filter((e) => {
466
- if (!filters.focused_id) return true;
467
- if (e.primary_id === filters.focused_id) return true;
468
- if (Object.values(e.other_ids).includes(filters.focused_id)) return true;
469
- return false;
470
- });
471
- return /* @__PURE__ */ jsxs6("div", { className: "font-mono text-xs", children: [
472
- /* @__PURE__ */ jsx9("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs6("table", { className: "table-auto w-full text-left", children: [
473
- /* @__PURE__ */ jsx9("thead", { children: /* @__PURE__ */ jsx9("tr", { children: columns.map((col) => /* @__PURE__ */ jsx9("th", { className: "px-4 py-2 border-b", children: col.renderHeaderCell ? col.renderHeaderCell(col) : col.name }, col.key)) }) }),
474
- /* @__PURE__ */ jsx9("tbody", { children: elements4.map((row, rowIndex) => /* @__PURE__ */ jsx9("tr", { className: "hover:bg-gray-100", children: columns.map((col) => /* @__PURE__ */ jsx9("td", { className: "px-4 py-2 border-b", children: col.renderCell ? col.renderCell(row) : row[col.key] }, col.key)) }, rowIndex)) })
475
- ] }) }),
476
- /* @__PURE__ */ jsx9(
477
- Modal_default,
478
- {
479
- open: modal.open,
480
- onClose: () => setModal({ open: false }),
481
- title: modal.open ? modal.title : "",
482
- children: /* @__PURE__ */ jsx9("div", { className: "bg-gray-800 p-3 text-white rounded", children: /* @__PURE__ */ jsx9("pre", { className: "whitespace-pre-wrap", children: modal.open ? JSON.stringify(modal.element, null, 2) : "" }) })
483
- }
484
- )
485
- ] });
486
- };
487
-
488
- // lib/components/BomTable.tsx
489
- import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
490
- var linkify = (supplier, partNumber) => {
491
- if (supplier === "jlcpcb") {
492
- return /* @__PURE__ */ jsx10(
493
- "a",
494
- {
495
- className: "underline text-blue-500",
496
- target: "_blank",
497
- rel: "noreferrer",
498
- href: `https://jlcpcb.com/partdetail/${partNumber}`,
499
- children: partNumber
500
- }
501
- );
502
- }
503
- return partNumber;
504
- };
505
- var BomTable = ({ circuitJson }) => {
506
- const sourceComponents = circuitJson.filter(
507
- (el) => el.type === "source_component"
508
- );
509
- const supplierColumns = /* @__PURE__ */ new Set();
510
- for (const comp of sourceComponents) {
511
- if (comp.supplier_part_numbers) {
512
- for (const supplier of Object.keys(comp.supplier_part_numbers)) {
513
- supplierColumns.add(supplier);
514
- }
515
- }
516
- }
517
- return /* @__PURE__ */ jsx10("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs7("table", { className: "w-full text-left text-sm", children: [
518
- /* @__PURE__ */ jsx10("thead", { children: /* @__PURE__ */ jsxs7("tr", { className: "border-b", children: [
519
- /* @__PURE__ */ jsx10("th", { className: "p-2", children: "Name" }),
520
- Array.from(supplierColumns).map((supplier) => /* @__PURE__ */ jsx10("th", { className: "p-2 capitalize", children: supplier }, supplier))
521
- ] }) }),
522
- /* @__PURE__ */ jsx10("tbody", { children: sourceComponents.map((comp) => /* @__PURE__ */ jsxs7("tr", { className: "border-b", children: [
523
- /* @__PURE__ */ jsx10("td", { className: "p-2", children: comp.name }),
524
- Array.from(supplierColumns).map((supplier) => /* @__PURE__ */ jsx10("td", { className: "p-2", children: linkify(
525
- supplier,
526
- comp.supplier_part_numbers?.[supplier]?.[0] || ""
527
- ) }, supplier))
528
- ] }, comp.source_component_id)) })
529
- ] }) });
530
- };
531
-
532
- // lib/components/CircuitJsonPreview.tsx
533
- import {
534
- CheckIcon as CheckIcon2,
535
- EllipsisIcon,
536
- FullscreenIcon,
537
- LoaderCircleIcon,
538
- MinimizeIcon
539
- } from "lucide-react";
540
-
541
- // lib/components/ui/dropdown-menu.tsx
542
- import * as React4 from "react";
543
- import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
544
- import {
545
- CheckIcon,
546
- ChevronRightIcon,
547
- DotFilledIcon
548
- } from "@radix-ui/react-icons";
549
- import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
550
- var DropdownMenu = DropdownMenuPrimitive.Root;
551
- var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
552
- var DropdownMenuSubTrigger = React4.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs8(
553
- DropdownMenuPrimitive.SubTrigger,
554
- {
555
- ref,
556
- className: cn(
557
- "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",
558
- inset && "pl-8",
559
- className
560
- ),
561
- ...props,
562
- children: [
563
- children,
564
- /* @__PURE__ */ jsx11(ChevronRightIcon, { className: "ml-auto h-4 w-4" })
565
- ]
566
- }
567
- ));
568
- DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
569
- var DropdownMenuSubContent = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
570
- DropdownMenuPrimitive.SubContent,
571
- {
572
- ref,
573
- className: cn(
574
- "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",
575
- className
576
- ),
577
- ...props
578
- }
579
- ));
580
- DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
581
- var DropdownMenuContent = React4.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx11(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx11(
582
- DropdownMenuPrimitive.Content,
583
- {
584
- ref,
585
- sideOffset,
586
- className: cn(
587
- "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",
588
- "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",
589
- className
590
- ),
591
- ...props
592
- }
593
- ) }));
594
- DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
595
- var DropdownMenuItem = React4.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx11(
596
- DropdownMenuPrimitive.Item,
597
- {
598
- ref,
599
- className: cn(
600
- "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",
601
- inset && "pl-8",
602
- className
603
- ),
604
- ...props
605
- }
606
- ));
607
- DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
608
- var DropdownMenuCheckboxItem = React4.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs8(
609
- DropdownMenuPrimitive.CheckboxItem,
610
- {
611
- ref,
612
- className: cn(
613
- "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",
614
- className
615
- ),
616
- checked,
617
- ...props,
618
- children: [
619
- /* @__PURE__ */ jsx11("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx11(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx11(CheckIcon, { className: "h-4 w-4" }) }) }),
620
- children
621
- ]
622
- }
623
- ));
624
- DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
625
- var DropdownMenuRadioItem = React4.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs8(
626
- DropdownMenuPrimitive.RadioItem,
627
- {
628
- ref,
629
- className: cn(
630
- "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",
631
- className
632
- ),
633
- ...props,
634
- children: [
635
- /* @__PURE__ */ jsx11("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx11(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx11(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
636
- children
637
- ]
638
- }
639
- ));
640
- DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
641
- var DropdownMenuLabel = React4.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx11(
642
- DropdownMenuPrimitive.Label,
643
- {
644
- ref,
645
- className: cn(
646
- "px-2 py-1.5 text-sm font-semibold",
647
- inset && "pl-8",
648
- className
649
- ),
650
- ...props
651
- }
652
- ));
653
- DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
654
- var DropdownMenuSeparator = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx11(
655
- DropdownMenuPrimitive.Separator,
656
- {
657
- ref,
658
- className: cn("-mx-1 my-1 h-px bg-slate-100 dark:bg-slate-800", className),
659
- ...props
660
- }
661
- ));
662
- DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
663
- var DropdownMenuShortcut = ({
664
- className,
665
- ...props
666
- }) => {
667
- return /* @__PURE__ */ jsx11(
668
- "span",
669
- {
670
- className: cn("ml-auto text-xs tracking-widest opacity-60", className),
671
- ...props
672
- }
673
- );
674
- };
675
- DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
676
-
677
- // lib/components/PcbViewerWithContainerHeight.tsx
678
- import { useRef, useState as useState2, useLayoutEffect } from "react";
679
- import { PCBViewer } from "@tscircuit/pcb-viewer";
680
- import { jsx as jsx12 } from "react/jsx-runtime";
681
- var PcbViewerWithContainerHeight = ({
682
- containerClassName,
683
- ...props
684
- }) => {
685
- const containerRef = useRef(null);
686
- const [computedHeight, setComputedHeight] = useState2(620);
687
- useLayoutEffect(() => {
688
- const updateHeight = () => {
689
- if (containerRef.current) {
690
- const containerHeight = containerRef.current.clientHeight;
691
- const screenHeight = window.innerHeight;
692
- setComputedHeight(
693
- Math.min(Math.max(containerHeight, 620), screenHeight)
694
- );
695
- }
696
- };
697
- updateHeight();
698
- const resizeObserver = new ResizeObserver(updateHeight);
699
- if (containerRef.current) {
700
- resizeObserver.observe(containerRef.current);
701
- }
702
- window.addEventListener("resize", updateHeight);
703
- return () => {
704
- resizeObserver.disconnect();
705
- window.removeEventListener("resize", updateHeight);
706
- };
707
- }, []);
708
- return /* @__PURE__ */ jsx12("div", { ref: containerRef, className: containerClassName || "w-full h-full", children: /* @__PURE__ */ jsx12(PCBViewer, { ...props, height: computedHeight }) });
709
- };
710
-
711
- // lib/hooks/use-styles.ts
712
- import { useEffect } from "react";
713
-
714
- // lib/hooks/styles.generated.ts
715
- var styles_generated_default = `.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.bottom-full{bottom:100%}.left-1{left:.25rem}.left-1\\/2{left:50%}.left-2{left:.5rem}.right-4{right:1rem}.right-\\[4px\\]{right:4px}.top-2{top:.5rem}.top-4{top:1rem}.top-\\[6px\\]{top:6px}.z-50{z-index:50}.z-\\[100\\]{z-index:100}.-mx-1{margin-left:-.25rem;margin-right:-.25rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.my-1{margin-bottom:.25rem;margin-top:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.ml-1{margin-left:.25rem}.ml-1\\.5{margin-left:.375rem}.ml-2{margin-left:.5rem}.ml-auto{margin-left:auto}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mt-0{margin-top:0}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.contents{display:contents}.hidden{display:none}.h-1{height:.25rem}.h-10{height:2.5rem}.h-2{height:.5rem}.h-3{height:.75rem}.h-3\\.5{height:.875rem}.h-4{height:1rem}.h-60{height:15rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-\\[620px\\]{height:620px}.h-\\[calc\\(100vh-96px\\)\\]{height:calc(100vh - 96px)}.h-full{height:100%}.h-px{height:1px}.max-h-\\[500px\\]{max-height:500px}.min-h-\\[620px\\]{min-height:620px}.min-h-\\[calc\\(100vh-240px\\)\\]{min-height:calc(100vh - 240px)}.w-1{width:.25rem}.w-11{width:2.75rem}.w-11\\/12{width:91.666667%}.w-2{width:.5rem}.w-3{width:.75rem}.w-3\\.5{width:.875rem}.w-4{width:1rem}.w-9{width:2.25rem}.w-96{width:24rem}.w-full{width:100%}.min-w-\\[8rem\\]{min-width:8rem}.max-w-2xl{max-width:42rem}.flex-grow{flex-grow:1}.table-auto{table-layout:auto}.-translate-x-1{--tw-translate-x:-0.25rem}.-translate-x-1,.-translate-x-1\\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-1\\/2{--tw-translate-x:-50%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(.5rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(.5rem*var(--tw-space-x-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.5rem*var(--tw-space-y-reverse));margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)))}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-sm{border-radius:.125rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219/var(--tw-border-opacity,1))}.border-green-200{--tw-border-opacity:1;border-color:rgb(187 247 208/var(--tw-border-opacity,1))}.border-red-200{--tw-border-opacity:1;border-color:rgb(254 202 202/var(--tw-border-opacity,1))}.border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1))}.bg-black{background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-black,.bg-blue-50{--tw-bg-opacity:1}.bg-blue-50{background-color:rgb(239 246 255/var(--tw-bg-opacity,1))}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1))}.bg-blue-600{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity,1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.bg-gray-500{--tw-bg-opacity:1;background-color:rgb(107 114 128/var(--tw-bg-opacity,1))}.bg-gray-800{--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1))}.bg-gray-900{--tw-bg-opacity:1;background-color:rgb(17 24 39/var(--tw-bg-opacity,1))}.bg-green-50{--tw-bg-opacity:1;background-color:rgb(240 253 244/var(--tw-bg-opacity,1))}.bg-orange-400{--tw-bg-opacity:1;background-color:rgb(251 146 60/var(--tw-bg-opacity,1))}.bg-red-50{--tw-bg-opacity:1;background-color:rgb(254 242 242/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-red-900{--tw-bg-opacity:1;background-color:rgb(127 29 29/var(--tw-bg-opacity,1))}.bg-slate-100{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.bg-slate-800{--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.bg-slate-900{--tw-bg-opacity:1;background-color:rgb(15 23 42/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-opacity-50{--tw-bg-opacity:0.5}.fill-current{fill:currentColor}.p-0{padding:0}.p-0\\.5{padding:.125rem}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.py-10{padding-bottom:2.5rem;padding-top:2.5rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.pl-8{padding-left:2rem}.pr-2{padding-right:.5rem}.text-left{text-align:left}.text-center{text-align:center}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.text-2xl{font-size:1.5rem;line-height:2rem}.text-\\[8px\\]{font-size:8px}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.capitalize{text-transform:capitalize}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.leading-5{line-height:1.25rem}.tracking-widest{letter-spacing:.1em}.text-blue-300{--tw-text-opacity:1;color:rgb(147 197 253/var(--tw-text-opacity,1))}.text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.text-green-500{--tw-text-opacity:1;color:rgb(34 197 94/var(--tw-text-opacity,1))}.text-green-700{--tw-text-opacity:1;color:rgb(21 128 61/var(--tw-text-opacity,1))}.text-green-800{--tw-text-opacity:1;color:rgb(22 101 52/var(--tw-text-opacity,1))}.text-red-600{--tw-text-opacity:1;color:rgb(220 38 38/var(--tw-text-opacity,1))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.text-red-800{--tw-text-opacity:1;color:rgb(153 27 27/var(--tw-text-opacity,1))}.text-slate-50{--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.text-slate-900{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.text-slate-950{--tw-text-opacity:1;color:rgb(2 6 23/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-md{--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color)}.shadow-md,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.ring-offset-white{--tw-ring-offset-color:#fff}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0) scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0) scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}.running{animation-play-state:running}.\\*\\:text-xs>*{font-size:.75rem;line-height:1rem}.hover\\:bg-blue-500:hover{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1))}.hover\\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity,1))}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity,1))}.hover\\:bg-red-500\\/90:hover{background-color:rgba(239,68,68,.9)}.hover\\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.hover\\:bg-slate-100\\/80:hover{background-color:rgba(241,245,249,.8)}.hover\\:bg-slate-900\\/90:hover{background-color:rgba(15,23,42,.9)}.hover\\:text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity,1))}.hover\\:text-slate-900:hover{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.hover\\:underline:hover{text-decoration-line:underline}.focus\\:bg-slate-100:focus{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.focus\\:text-slate-900:focus{--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.focus-visible\\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\\:ring-1:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\\:ring-2:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus-visible\\:ring-slate-950:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(2 6 23/var(--tw-ring-opacity,1))}.focus-visible\\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px}.disabled\\:pointer-events-none:disabled{pointer-events:none}.disabled\\:opacity-50:disabled{opacity:.5}.group:hover .group-hover\\:opacity-100{opacity:1}.data-\\[disabled\\]\\:pointer-events-none[data-disabled]{pointer-events:none}.data-\\[state\\=active\\]\\:bg-white[data-state=active]{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.data-\\[state\\=open\\]\\:bg-slate-100[data-state=open]{--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.data-\\[state\\=active\\]\\:text-slate-950[data-state=active]{--tw-text-opacity:1;color:rgb(2 6 23/var(--tw-text-opacity,1))}.data-\\[disabled\\]\\:opacity-50[data-disabled]{opacity:.5}.data-\\[state\\=active\\]\\:shadow[data-state=active]{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.data-\\[state\\=open\\]\\:animate-in[data-state=open]{animation-duration:.15s;animation-name:enter;--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial}.data-\\[state\\=closed\\]\\:animate-out[data-state=closed]{animation-duration:.15s;animation-name:exit;--tw-exit-opacity:initial;--tw-exit-scale:initial;--tw-exit-rotate:initial;--tw-exit-translate-x:initial;--tw-exit-translate-y:initial}.data-\\[state\\=closed\\]\\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.data-\\[state\\=open\\]\\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.data-\\[state\\=closed\\]\\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.data-\\[state\\=open\\]\\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.data-\\[side\\=bottom\\]\\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:-0.5rem}.data-\\[side\\=left\\]\\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:0.5rem}.data-\\[side\\=right\\]\\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:-0.5rem}.data-\\[side\\=top\\]\\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:0.5rem}.dark\\:border-slate-800:is(.dark *){--tw-border-opacity:1;border-color:rgb(30 41 59/var(--tw-border-opacity,1))}.dark\\:bg-red-900:is(.dark *){--tw-bg-opacity:1;background-color:rgb(127 29 29/var(--tw-bg-opacity,1))}.dark\\:bg-slate-50:is(.dark *){--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1))}.dark\\:bg-slate-800:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\\:bg-slate-950:is(.dark *){--tw-bg-opacity:1;background-color:rgb(2 6 23/var(--tw-bg-opacity,1))}.dark\\:text-slate-400:is(.dark *){--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1))}.dark\\:text-slate-50:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\\:text-slate-900:is(.dark *){--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.dark\\:ring-offset-slate-950:is(.dark *){--tw-ring-offset-color:#020617}.dark\\:hover\\:bg-red-900\\/90:hover:is(.dark *){background-color:rgba(127,29,29,.9)}.dark\\:hover\\:bg-slate-50\\/90:hover:is(.dark *){background-color:rgba(248,250,252,.9)}.dark\\:hover\\:bg-slate-800:hover:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\\:hover\\:bg-slate-800\\/80:hover:is(.dark *){background-color:rgba(30,41,59,.8)}.dark\\:hover\\:text-slate-50:hover:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\\:focus\\:bg-slate-800:focus:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\\:focus\\:text-slate-50:focus:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}.dark\\:focus-visible\\:ring-slate-300:focus-visible:is(.dark *){--tw-ring-opacity:1;--tw-ring-color:rgb(203 213 225/var(--tw-ring-opacity,1))}.dark\\:data-\\[state\\=active\\]\\:bg-slate-950[data-state=active]:is(.dark *){--tw-bg-opacity:1;background-color:rgb(2 6 23/var(--tw-bg-opacity,1))}.dark\\:data-\\[state\\=open\\]\\:bg-slate-800[data-state=open]:is(.dark *){--tw-bg-opacity:1;background-color:rgb(30 41 59/var(--tw-bg-opacity,1))}.dark\\:data-\\[state\\=active\\]\\:text-slate-50[data-state=active]:is(.dark *){--tw-text-opacity:1;color:rgb(248 250 252/var(--tw-text-opacity,1))}@media (min-width:768px){.md\\:sticky{position:sticky}.md\\:top-2{top:.5rem}}`;
716
-
717
- // lib/hooks/use-styles.ts
718
- var useStyles = () => {
719
- useEffect(() => {
720
- const existingStyle = document.querySelector(
721
- 'style[data-styles="tscircuit-runframe"]'
722
- );
723
- if (existingStyle) return;
724
- const styleElement = document.createElement("style");
725
- styleElement.setAttribute("data-styles", "tscircuit-runframe");
726
- styleElement.textContent = styles_generated_default;
727
- document.head.appendChild(styleElement);
728
- }, []);
729
- };
730
-
731
- // lib/components/RenderLogViewer/RenderLogViewer.tsx
732
- import { orderedRenderPhases as orderedRenderPhases2 } from "@tscircuit/core";
733
- import { useState as useState3 } from "react";
734
-
735
- // lib/components/RenderLogViewer/RenderTimingsBar.tsx
736
- import { orderedRenderPhases } from "@tscircuit/core";
737
- import "react";
738
- import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
739
- var RenderTimingsBar = ({
740
- phaseTimings
741
- }) => {
742
- if (!phaseTimings) return null;
743
- const getPhaseColor = (index) => {
744
- const hue = index * 137.5 % 360;
745
- return `hsl(${hue}, 70%, 50%)`;
746
- };
747
- const totalTime = Object.values(phaseTimings).reduce(
748
- (sum, time) => sum + time,
749
- 0
750
- );
751
- return /* @__PURE__ */ jsxs9("div", { className: "space-y-2 w-full px-4", children: [
752
- /* @__PURE__ */ jsx13("div", { className: "relative h-8 flex rounded-sm", children: orderedRenderPhases.map((phase, index) => {
753
- const time = phaseTimings[phase] || 0;
754
- const width = time / totalTime * 100;
755
- return /* @__PURE__ */ jsx13(
756
- "div",
757
- {
758
- className: "group relative overflow-visible",
759
- style: {
760
- width: `${width}%`,
761
- backgroundColor: getPhaseColor(index)
762
- },
763
- children: /* @__PURE__ */ jsxs9("div", { className: "opacity-0 group-hover:opacity-100 transition-opacity absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 px-2 py-1 text-xs whitespace-nowrap rounded bg-gray-900 text-white pointer-events-none", children: [
764
- phase,
765
- ": ",
766
- time,
767
- "ms"
768
- ] })
769
- },
770
- phase
771
- );
772
- }) }),
773
- /* @__PURE__ */ jsxs9("div", { className: "text-xs text-gray-500", children: [
774
- "Total: ",
775
- totalTime.toFixed(2),
776
- "ms"
777
- ] })
778
- ] });
779
- };
780
- var RenderTimingsBar_default = RenderTimingsBar;
781
-
782
- // lib/components/RenderLogViewer/RenderLogViewer.tsx
783
- import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
784
- var RenderLogViewer = ({
785
- renderLog
786
- }) => {
787
- const [sortOption, setSortOption] = useState3(
788
- "chronological"
789
- );
790
- if (!renderLog)
791
- return /* @__PURE__ */ jsx14("div", { className: "p-4 bg-gray-100 rounded-md", children: "No render log, make sure this tab is open when you render (TODO add a rerender button here)" });
792
- const orderedPhaseTimings = Object.entries(renderLog?.phaseTimings ?? {});
793
- if (sortOption === "chronological") {
794
- orderedPhaseTimings.sort(
795
- (a, b) => orderedRenderPhases2.indexOf(a[0]) - orderedRenderPhases2.indexOf(b[0])
796
- );
797
- } else {
798
- orderedPhaseTimings.sort((a, b) => b[1] - a[1]);
799
- }
800
- return /* @__PURE__ */ jsxs10("div", { children: [
801
- /* @__PURE__ */ jsxs10("div", { className: "flex justify-between items-center", children: [
802
- /* @__PURE__ */ jsx14("div", { children: "Render Logs" }),
803
- /* @__PURE__ */ jsxs10("div", { className: "mb-4 pr-2 flex text-xs items-center", children: [
804
- /* @__PURE__ */ jsx14("div", { className: "mr-2", children: "Sort by:" }),
805
- /* @__PURE__ */ jsxs10(
806
- "select",
807
- {
808
- value: sortOption,
809
- onChange: (e) => setSortOption(e.target.value),
810
- className: "px-2 py-1 border rounded text-xs",
811
- children: [
812
- /* @__PURE__ */ jsx14("option", { value: "chronological", children: "Phase Order" }),
813
- /* @__PURE__ */ jsx14("option", { value: "longest", children: "Duration" })
814
- ]
815
- }
816
- )
817
- ] })
818
- ] }),
819
- /* @__PURE__ */ jsx14(RenderTimingsBar_default, { phaseTimings: renderLog.phaseTimings }),
820
- /* @__PURE__ */ jsxs10("table", { className: "w-full text-xs", children: [
821
- /* @__PURE__ */ jsx14("thead", { children: /* @__PURE__ */ jsxs10("tr", { children: [
822
- /* @__PURE__ */ jsx14("th", { className: "text-left p-2", children: "Phase Order" }),
823
- /* @__PURE__ */ jsx14("th", { className: "text-left p-2", children: "Phase" }),
824
- /* @__PURE__ */ jsx14("th", { className: "text-left p-2", children: "Duration (ms)" })
825
- ] }) }),
826
- /* @__PURE__ */ jsx14("tbody", { children: orderedPhaseTimings.map(([phase, duration]) => /* @__PURE__ */ jsxs10("tr", { children: [
827
- /* @__PURE__ */ jsx14("td", { className: "p-2", children: orderedRenderPhases2.indexOf(phase) }),
828
- /* @__PURE__ */ jsx14("td", { className: "p-2", children: phase }),
829
- /* @__PURE__ */ jsx14("td", { className: "p-2", children: duration })
830
- ] }, phase)) })
831
- ] })
832
- ] });
833
- };
834
-
835
- // lib/components/CircuitJsonPreview.tsx
836
- import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
837
- var CircuitJsonPreview = ({
838
- code,
839
- onRunClicked = void 0,
840
- tsxRunTriggerCount,
841
- errorMessage,
842
- circuitJsonKey = "",
843
- circuitJson,
844
- showCodeTab = false,
845
- codeTabContent,
846
- showJsonTab = true,
847
- showRenderLogTab = true,
848
- onActiveTabChange,
849
- renderLog,
850
- showImportAndFormatButtons = true,
851
- className,
852
- headerClassName,
853
- leftHeaderContent,
854
- readOnly,
855
- isStreaming,
856
- onToggleFullScreen,
857
- isFullScreen,
858
- isRunningCode,
859
- hasCodeChangedSinceLastRun,
860
- onEditEvent,
861
- editEvents,
862
- defaultActiveTab
863
- }) => {
864
- useStyles();
865
- const [activeTab, setActiveTabState] = useState4(defaultActiveTab ?? "pcb");
866
- const setActiveTab = useCallback(
867
- (tab) => {
868
- setActiveTabState(tab);
869
- onActiveTabChange?.(tab);
870
- },
871
- [onActiveTabChange]
872
- );
873
- useEffect2(() => {
874
- if (errorMessage) {
875
- setActiveTab("error");
876
- }
877
- }, [errorMessage]);
878
- useEffect2(() => {
879
- if (activeTab === "code" && circuitJson && !errorMessage) {
880
- setActiveTab("pcb");
881
- }
882
- }, [circuitJson]);
883
- return /* @__PURE__ */ jsx15("div", { className: cn("flex flex-col relative", className), children: /* @__PURE__ */ jsx15("div", { className: "md:sticky md:top-2", children: /* @__PURE__ */ jsxs11(
884
- Tabs,
885
- {
886
- value: activeTab,
887
- onValueChange: setActiveTab,
888
- className: "flex-grow flex flex-col p-2",
889
- children: [
890
- /* @__PURE__ */ jsxs11("div", { className: cn("flex items-center gap-2", headerClassName), children: [
891
- leftHeaderContent,
892
- leftHeaderContent && /* @__PURE__ */ jsx15("div", { className: "flex-grow" }),
893
- !leftHeaderContent && /* @__PURE__ */ jsx15("div", { className: "flex-grow" }),
894
- renderLog && renderLog.progress !== 1 && /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
895
- renderLog.lastRenderEvent && /* @__PURE__ */ jsx15("div", { className: "text-xs text-gray-500", children: renderLog.lastRenderEvent?.type.split("renderable:renderLifecycle:")[1].split(":")[0] }),
896
- /* @__PURE__ */ jsx15("div", { className: "w-4 h-4 bg-blue-500 opacity-50 rounded-full text-white", children: /* @__PURE__ */ jsx15(LoaderCircleIcon, { className: "w-4 h-4 animate-spin" }) }),
897
- /* @__PURE__ */ jsxs11("div", { className: "text-xs font-bold text-gray-700 tabular-nums", children: [
898
- ((renderLog.progress ?? 0) * 100).toFixed(1),
899
- "%"
900
- ] })
901
- ] }),
902
- /* @__PURE__ */ jsxs11(TabsList, { children: [
903
- showCodeTab && /* @__PURE__ */ jsx15(TabsTrigger, { value: "code", children: "Code" }),
904
- /* @__PURE__ */ jsxs11(TabsTrigger, { value: "pcb", className: "whitespace-nowrap", children: [
905
- circuitJson && /* @__PURE__ */ jsx15(
906
- "span",
907
- {
908
- className: cn(
909
- "inline-flex items-center justify-center w-2 h-2 mr-1 text-xs font-bold text-white rounded-full",
910
- !hasCodeChangedSinceLastRun ? "bg-blue-500" : "bg-gray-500"
911
- )
912
- }
913
- ),
914
- "PCB"
915
- ] }),
916
- /* @__PURE__ */ jsxs11(TabsTrigger, { value: "schematic", className: "whitespace-nowrap", children: [
917
- circuitJson && /* @__PURE__ */ jsx15(
918
- "span",
919
- {
920
- className: cn(
921
- "inline-flex items-center justify-center w-2 h-2 mr-1 text-xs font-bold text-white rounded-full",
922
- !hasCodeChangedSinceLastRun ? "bg-blue-500" : "bg-gray-500"
923
- )
924
- }
925
- ),
926
- "Schematic"
927
- ] }),
928
- /* @__PURE__ */ jsxs11(TabsTrigger, { value: "cad", children: [
929
- circuitJson && /* @__PURE__ */ jsx15(
930
- "span",
931
- {
932
- className: cn(
933
- "inline-flex items-center justify-center w-2 h-2 mr-1 text-xs font-bold text-white rounded-full",
934
- !hasCodeChangedSinceLastRun ? "bg-blue-500" : "bg-gray-500"
935
- )
936
- }
937
- ),
938
- "3D"
939
- ] }),
940
- /* @__PURE__ */ jsxs11(DropdownMenu, { children: [
941
- /* @__PURE__ */ jsx15(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs11("div", { className: "whitespace-nowrap p-2 mr-1 cursor-pointer relative", children: [
942
- /* @__PURE__ */ jsx15(EllipsisIcon, { className: "w-4 h-4" }),
943
- errorMessage && /* @__PURE__ */ jsx15("span", { className: "inline-flex absolute top-[6px] right-[4px] items-center justify-center w-1 h-1 ml-2 text-[8px] font-bold text-white bg-red-500 rounded-full" })
944
- ] }) }),
945
- /* @__PURE__ */ jsxs11(DropdownMenuContent, { className: "*:text-xs", children: [
946
- /* @__PURE__ */ jsxs11(DropdownMenuItem, { onSelect: () => setActiveTab("assembly"), children: [
947
- /* @__PURE__ */ jsx15(
948
- CheckIcon2,
949
- {
950
- className: cn(
951
- "w-3 h-3 mr-2",
952
- activeTab !== "assembly" && "invisible"
953
- )
954
- }
955
- ),
956
- "Assembly"
957
- ] }),
958
- /* @__PURE__ */ jsxs11(
959
- DropdownMenuItem,
960
- {
961
- onSelect: () => setActiveTab("error"),
962
- className: "flex",
963
- children: [
964
- /* @__PURE__ */ jsx15(
965
- CheckIcon2,
966
- {
967
- className: cn(
968
- "w-3 h-3 mr-2",
969
- activeTab !== "error" && "invisible"
970
- )
971
- }
972
- ),
973
- /* @__PURE__ */ jsx15("div", { className: "flex-grow", children: "Errors" }),
974
- errorMessage && /* @__PURE__ */ jsx15("span", { className: "inline-flex items-center justify-center w-3 h-3 ml-2 text-[8px] font-bold text-white bg-red-500 rounded-full", children: "1" })
975
- ]
976
- }
977
- ),
978
- /* @__PURE__ */ jsxs11(DropdownMenuItem, { onSelect: () => setActiveTab("bom"), children: [
979
- /* @__PURE__ */ jsx15(
980
- CheckIcon2,
981
- {
982
- className: cn(
983
- "w-3 h-3 mr-2",
984
- activeTab !== "bom" && "invisible"
985
- )
986
- }
987
- ),
988
- "Bill of Materials"
989
- ] }),
990
- /* @__PURE__ */ jsxs11(
991
- DropdownMenuItem,
992
- {
993
- onSelect: () => setActiveTab("circuitjson"),
994
- children: [
995
- /* @__PURE__ */ jsx15(
996
- CheckIcon2,
997
- {
998
- className: cn(
999
- "w-3 h-3 mr-2",
1000
- activeTab !== "circuitjson" && "invisible"
1001
- )
1002
- }
1003
- ),
1004
- "JSON"
1005
- ]
1006
- }
1007
- ),
1008
- /* @__PURE__ */ jsxs11(DropdownMenuItem, { onSelect: () => setActiveTab("render_log"), children: [
1009
- /* @__PURE__ */ jsx15(
1010
- CheckIcon2,
1011
- {
1012
- className: cn(
1013
- "w-3 h-3 mr-2",
1014
- activeTab !== "render_log" && "invisible"
1015
- )
1016
- }
1017
- ),
1018
- "Render Log"
1019
- ] })
1020
- ] })
1021
- ] })
1022
- ] }),
1023
- onToggleFullScreen && /* @__PURE__ */ jsx15(Button, { onClick: onToggleFullScreen, variant: "ghost", children: isFullScreen ? /* @__PURE__ */ jsx15(MinimizeIcon, { size: 16 }) : /* @__PURE__ */ jsx15(FullscreenIcon, { size: 16 }) })
1024
- ] }),
1025
- showCodeTab && /* @__PURE__ */ jsx15(TabsContent, { value: "code", className: "flex-grow overflow-hidden", children: /* @__PURE__ */ jsx15("div", { className: "h-full", children: codeTabContent }) }),
1026
- /* @__PURE__ */ jsx15(TabsContent, { value: "pcb", children: /* @__PURE__ */ jsx15(
1027
- "div",
1028
- {
1029
- className: cn(
1030
- "overflow-hidden",
1031
- isFullScreen ? "h-[calc(100vh-96px)]" : "h-[620px]"
1032
- ),
1033
- children: /* @__PURE__ */ jsx15(ErrorBoundary, { fallback: /* @__PURE__ */ jsx15("div", { children: "Error loading PCB viewer" }), children: circuitJson ? /* @__PURE__ */ jsx15(
1034
- PcbViewerWithContainerHeight,
1035
- {
1036
- soup: circuitJson,
1037
- containerClassName: cn(
1038
- "h-full w-full",
1039
- isFullScreen ? "min-h-[calc(100vh-240px)]" : "min-h-[620px]"
1040
- )
1041
- },
1042
- circuitJsonKey
1043
- ) : /* @__PURE__ */ jsx15(PreviewEmptyState_default, { onRunClicked }) })
1044
- }
1045
- ) }),
1046
- /* @__PURE__ */ jsx15(TabsContent, { value: "assembly", children: /* @__PURE__ */ jsx15(
1047
- "div",
1048
- {
1049
- className: cn(
1050
- "overflow-auto",
1051
- isFullScreen ? "h-[calc(100vh-96px)]" : "h-[620px]"
1052
- ),
1053
- children: /* @__PURE__ */ jsx15(ErrorBoundary, { fallback: /* @__PURE__ */ jsx15("div", { children: "Error loading Assembly" }), children: circuitJson ? /* @__PURE__ */ jsx15(
1054
- AssemblyViewer,
1055
- {
1056
- circuitJson,
1057
- containerStyle: {
1058
- height: "100%"
1059
- },
1060
- editingEnabled: true,
1061
- debugGrid: true
1062
- }
1063
- ) : /* @__PURE__ */ jsx15(PreviewEmptyState_default, { onRunClicked }) })
1064
- }
1065
- ) }),
1066
- /* @__PURE__ */ jsx15(TabsContent, { value: "schematic", children: /* @__PURE__ */ jsx15(
1067
- "div",
1068
- {
1069
- className: cn(
1070
- "overflow-auto",
1071
- isFullScreen ? "h-[calc(100vh-96px)]" : "h-[620px]"
1072
- ),
1073
- children: /* @__PURE__ */ jsx15(ErrorBoundary, { fallback: /* @__PURE__ */ jsx15("div", { children: "Error loading Schematic" }), children: circuitJson ? /* @__PURE__ */ jsx15(
1074
- SchematicViewer,
1075
- {
1076
- circuitJson,
1077
- containerStyle: {
1078
- height: "100%"
1079
- },
1080
- editingEnabled: true,
1081
- onEditEvent: (ee) => onEditEvent?.(ee),
1082
- editEvents,
1083
- debugGrid: true
1084
- }
1085
- ) : /* @__PURE__ */ jsx15(PreviewEmptyState_default, { onRunClicked }) })
1086
- }
1087
- ) }),
1088
- /* @__PURE__ */ jsx15(TabsContent, { value: "cad", children: /* @__PURE__ */ jsx15(
1089
- "div",
1090
- {
1091
- className: cn(
1092
- "overflow-auto",
1093
- isFullScreen ? "h-[calc(100vh-96px)]" : "h-[620px]"
1094
- ),
1095
- children: /* @__PURE__ */ jsx15(ErrorBoundary, { FallbackComponent: ErrorFallback, children: circuitJson ? /* @__PURE__ */ jsx15(CadViewer, { soup: circuitJson }) : /* @__PURE__ */ jsx15(PreviewEmptyState_default, { onRunClicked }) })
1096
- }
1097
- ) }),
1098
- /* @__PURE__ */ jsx15(TabsContent, { value: "bom", children: /* @__PURE__ */ jsx15(
1099
- "div",
1100
- {
1101
- className: cn(
1102
- "overflow-auto",
1103
- isFullScreen ? "h-[calc(100vh-96px)]" : "h-[620px]"
1104
- ),
1105
- children: /* @__PURE__ */ jsx15(ErrorBoundary, { fallback: /* @__PURE__ */ jsx15("div", { children: "Error loading BOM" }), children: circuitJson ? /* @__PURE__ */ jsx15(BomTable, { circuitJson }) : /* @__PURE__ */ jsx15(PreviewEmptyState_default, { onRunClicked }) })
1106
- }
1107
- ) }),
1108
- /* @__PURE__ */ jsx15(TabsContent, { value: "circuitjson", children: /* @__PURE__ */ jsx15(
1109
- "div",
1110
- {
1111
- className: cn(
1112
- "overflow-auto",
1113
- isFullScreen ? "h-[calc(100vh-96px)]" : "h-[620px]"
1114
- ),
1115
- children: /* @__PURE__ */ jsx15(ErrorBoundary, { fallback: /* @__PURE__ */ jsx15("div", { children: "Error loading JSON viewer" }), children: circuitJson ? /* @__PURE__ */ jsx15(CircuitJsonTableViewer, { elements: circuitJson }) : /* @__PURE__ */ jsx15(PreviewEmptyState_default, { onRunClicked }) })
1116
- }
1117
- ) }),
1118
- /* @__PURE__ */ jsx15(TabsContent, { value: "error", children: circuitJson || errorMessage ? /* @__PURE__ */ jsx15(ErrorTabContent, { code, errorMessage }) : /* @__PURE__ */ jsx15(PreviewEmptyState_default, { onRunClicked }) }),
1119
- showRenderLogTab && /* @__PURE__ */ jsx15(TabsContent, { value: "render_log", children: /* @__PURE__ */ jsx15(RenderLogViewer, { renderLog }) })
1120
- ]
1121
- }
1122
- ) }) });
1123
- };
1124
-
1125
- export {
1126
- CircuitJsonPreview
1127
- };