@industry-theme/file-city-panel 0.2.52 → 0.2.54
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.
package/dist/panels.bundle.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
|
-
import React, { forwardRef, createElement,
|
|
3
|
-
import require$$1$1, { useTheme } from "@principal-ade/industry-theme";
|
|
2
|
+
import React, { forwardRef, createElement, createContext, useContext, useState, useEffect, useMemo, useCallback, memo, useRef } from "react";
|
|
4
3
|
import { GitStatusFileTree } from "@principal-ade/dynamic-file-tree";
|
|
5
4
|
import { createPortal } from "react-dom";
|
|
6
5
|
/**
|
|
@@ -427,6 +426,1950 @@ const __iconNode = [
|
|
|
427
426
|
["path", { d: "m6 6 12 12", key: "d8bk6v" }]
|
|
428
427
|
];
|
|
429
428
|
const X = createLucideIcon("x", __iconNode);
|
|
429
|
+
var glassmorphismTheme = {
|
|
430
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
431
|
+
fonts: {
|
|
432
|
+
body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
433
|
+
heading: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
434
|
+
monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
|
|
435
|
+
},
|
|
436
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
437
|
+
fontScale: 1,
|
|
438
|
+
fontWeights: {
|
|
439
|
+
body: 400,
|
|
440
|
+
heading: 600,
|
|
441
|
+
bold: 700,
|
|
442
|
+
light: 300,
|
|
443
|
+
medium: 500,
|
|
444
|
+
semibold: 600
|
|
445
|
+
},
|
|
446
|
+
lineHeights: {
|
|
447
|
+
body: 1.6,
|
|
448
|
+
heading: 1.3,
|
|
449
|
+
tight: 1.4,
|
|
450
|
+
relaxed: 1.8
|
|
451
|
+
},
|
|
452
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
453
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
454
|
+
radii: [0, 8, 12, 16, 20, 24, 32, 40],
|
|
455
|
+
shadows: [
|
|
456
|
+
"none",
|
|
457
|
+
"0 8px 32px 0 rgba(31, 38, 135, 0.15)",
|
|
458
|
+
"0 12px 40px 0 rgba(31, 38, 135, 0.2)",
|
|
459
|
+
"0 16px 48px 0 rgba(31, 38, 135, 0.25)",
|
|
460
|
+
"0 20px 56px 0 rgba(31, 38, 135, 0.3)",
|
|
461
|
+
"0 24px 64px 0 rgba(31, 38, 135, 0.35)"
|
|
462
|
+
],
|
|
463
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
464
|
+
colors: {
|
|
465
|
+
text: "rgba(255, 255, 255, 0.95)",
|
|
466
|
+
background: "rgba(255, 255, 255, 0.1)",
|
|
467
|
+
primary: "rgba(99, 102, 241, 0.9)",
|
|
468
|
+
secondary: "rgba(139, 92, 246, 0.9)",
|
|
469
|
+
accent: "rgba(236, 72, 153, 0.9)",
|
|
470
|
+
highlight: "rgba(99, 102, 241, 0.2)",
|
|
471
|
+
muted: "rgba(255, 255, 255, 0.05)",
|
|
472
|
+
success: "rgba(34, 197, 94, 0.9)",
|
|
473
|
+
warning: "rgba(251, 146, 60, 0.9)",
|
|
474
|
+
error: "rgba(239, 68, 68, 0.9)",
|
|
475
|
+
info: "rgba(59, 130, 246, 0.9)",
|
|
476
|
+
border: "rgba(255, 255, 255, 0.18)",
|
|
477
|
+
backgroundSecondary: "rgba(255, 255, 255, 0.15)",
|
|
478
|
+
backgroundTertiary: "rgba(255, 255, 255, 0.2)",
|
|
479
|
+
backgroundLight: "rgba(255, 255, 255, 0.08)",
|
|
480
|
+
backgroundHover: "rgba(255, 255, 255, 0.25)",
|
|
481
|
+
surface: "rgba(255, 255, 255, 0.12)",
|
|
482
|
+
textSecondary: "rgba(255, 255, 255, 0.8)",
|
|
483
|
+
textTertiary: "rgba(255, 255, 255, 0.6)",
|
|
484
|
+
textMuted: "rgba(255, 255, 255, 0.5)",
|
|
485
|
+
highlightBg: "rgba(251, 191, 36, 0.3)",
|
|
486
|
+
highlightBorder: "rgba(251, 191, 36, 0.5)"
|
|
487
|
+
},
|
|
488
|
+
modes: {
|
|
489
|
+
dark: {
|
|
490
|
+
text: "rgba(255, 255, 255, 0.95)",
|
|
491
|
+
background: "rgba(0, 0, 0, 0.3)",
|
|
492
|
+
primary: "rgba(129, 140, 248, 0.9)",
|
|
493
|
+
secondary: "rgba(167, 139, 250, 0.9)",
|
|
494
|
+
accent: "rgba(244, 114, 182, 0.9)",
|
|
495
|
+
highlight: "rgba(129, 140, 248, 0.25)",
|
|
496
|
+
muted: "rgba(0, 0, 0, 0.15)",
|
|
497
|
+
success: "rgba(74, 222, 128, 0.9)",
|
|
498
|
+
warning: "rgba(251, 191, 36, 0.9)",
|
|
499
|
+
error: "rgba(248, 113, 113, 0.9)",
|
|
500
|
+
info: "rgba(96, 165, 250, 0.9)",
|
|
501
|
+
border: "rgba(255, 255, 255, 0.15)",
|
|
502
|
+
backgroundSecondary: "rgba(0, 0, 0, 0.4)",
|
|
503
|
+
backgroundTertiary: "rgba(0, 0, 0, 0.5)",
|
|
504
|
+
backgroundLight: "rgba(0, 0, 0, 0.2)",
|
|
505
|
+
backgroundHover: "rgba(255, 255, 255, 0.1)",
|
|
506
|
+
surface: "rgba(0, 0, 0, 0.35)",
|
|
507
|
+
textSecondary: "rgba(255, 255, 255, 0.8)",
|
|
508
|
+
textTertiary: "rgba(255, 255, 255, 0.6)",
|
|
509
|
+
textMuted: "rgba(255, 255, 255, 0.4)",
|
|
510
|
+
highlightBg: "rgba(251, 191, 36, 0.35)",
|
|
511
|
+
highlightBorder: "rgba(251, 191, 36, 0.6)"
|
|
512
|
+
},
|
|
513
|
+
frosted: {
|
|
514
|
+
text: "rgba(31, 41, 55, 0.95)",
|
|
515
|
+
background: "rgba(255, 255, 255, 0.3)",
|
|
516
|
+
primary: "rgba(79, 70, 229, 0.95)",
|
|
517
|
+
secondary: "rgba(124, 58, 237, 0.95)",
|
|
518
|
+
accent: "rgba(219, 39, 119, 0.95)",
|
|
519
|
+
highlight: "rgba(79, 70, 229, 0.15)",
|
|
520
|
+
muted: "rgba(255, 255, 255, 0.4)",
|
|
521
|
+
success: "rgba(16, 185, 129, 0.95)",
|
|
522
|
+
warning: "rgba(245, 158, 11, 0.95)",
|
|
523
|
+
error: "rgba(220, 38, 38, 0.95)",
|
|
524
|
+
info: "rgba(37, 99, 235, 0.95)",
|
|
525
|
+
border: "rgba(255, 255, 255, 0.5)",
|
|
526
|
+
backgroundSecondary: "rgba(255, 255, 255, 0.4)",
|
|
527
|
+
backgroundTertiary: "rgba(255, 255, 255, 0.5)",
|
|
528
|
+
backgroundLight: "rgba(255, 255, 255, 0.25)",
|
|
529
|
+
backgroundHover: "rgba(255, 255, 255, 0.6)",
|
|
530
|
+
surface: "rgba(255, 255, 255, 0.35)",
|
|
531
|
+
textSecondary: "rgba(31, 41, 55, 0.8)",
|
|
532
|
+
textTertiary: "rgba(31, 41, 55, 0.6)",
|
|
533
|
+
textMuted: "rgba(31, 41, 55, 0.5)",
|
|
534
|
+
highlightBg: "rgba(251, 191, 36, 0.4)",
|
|
535
|
+
highlightBorder: "rgba(251, 191, 36, 0.7)"
|
|
536
|
+
}
|
|
537
|
+
},
|
|
538
|
+
buttons: {
|
|
539
|
+
primary: {
|
|
540
|
+
color: "white",
|
|
541
|
+
bg: "primary",
|
|
542
|
+
borderWidth: 1,
|
|
543
|
+
borderStyle: "solid",
|
|
544
|
+
borderColor: "rgba(255, 255, 255, 0.2)",
|
|
545
|
+
"&:hover": {
|
|
546
|
+
bg: "secondary"
|
|
547
|
+
}
|
|
548
|
+
},
|
|
549
|
+
secondary: {
|
|
550
|
+
color: "text",
|
|
551
|
+
bg: "rgba(255, 255, 255, 0.1)",
|
|
552
|
+
borderWidth: 1,
|
|
553
|
+
borderStyle: "solid",
|
|
554
|
+
borderColor: "rgba(255, 255, 255, 0.2)",
|
|
555
|
+
"&:hover": {
|
|
556
|
+
bg: "rgba(255, 255, 255, 0.2)"
|
|
557
|
+
}
|
|
558
|
+
},
|
|
559
|
+
ghost: {
|
|
560
|
+
color: "text",
|
|
561
|
+
bg: "transparent",
|
|
562
|
+
borderWidth: 1,
|
|
563
|
+
borderStyle: "solid",
|
|
564
|
+
borderColor: "transparent",
|
|
565
|
+
"&:hover": {
|
|
566
|
+
borderColor: "rgba(255, 255, 255, 0.2)",
|
|
567
|
+
bg: "rgba(255, 255, 255, 0.05)"
|
|
568
|
+
}
|
|
569
|
+
}
|
|
570
|
+
},
|
|
571
|
+
text: {
|
|
572
|
+
heading: {
|
|
573
|
+
fontFamily: "heading",
|
|
574
|
+
fontWeight: "heading",
|
|
575
|
+
lineHeight: "heading"
|
|
576
|
+
},
|
|
577
|
+
body: {
|
|
578
|
+
fontFamily: "body",
|
|
579
|
+
fontWeight: "body",
|
|
580
|
+
lineHeight: "body"
|
|
581
|
+
},
|
|
582
|
+
caption: {
|
|
583
|
+
fontSize: 1,
|
|
584
|
+
color: "textSecondary"
|
|
585
|
+
}
|
|
586
|
+
},
|
|
587
|
+
cards: {
|
|
588
|
+
primary: {
|
|
589
|
+
bg: "surface",
|
|
590
|
+
border: "1px solid",
|
|
591
|
+
borderColor: "border",
|
|
592
|
+
borderRadius: 3
|
|
593
|
+
},
|
|
594
|
+
secondary: {
|
|
595
|
+
bg: "backgroundSecondary",
|
|
596
|
+
border: "1px solid",
|
|
597
|
+
borderColor: "border",
|
|
598
|
+
borderRadius: 3
|
|
599
|
+
}
|
|
600
|
+
}
|
|
601
|
+
};
|
|
602
|
+
var defaultMarkdownTheme = {
|
|
603
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
604
|
+
fonts: {
|
|
605
|
+
body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
606
|
+
heading: '"Crimson Text", "Georgia", "Times New Roman", serif',
|
|
607
|
+
monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
|
|
608
|
+
},
|
|
609
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
610
|
+
fontScale: 1,
|
|
611
|
+
fontWeights: {
|
|
612
|
+
body: 400,
|
|
613
|
+
heading: 600,
|
|
614
|
+
bold: 700,
|
|
615
|
+
light: 300,
|
|
616
|
+
medium: 500,
|
|
617
|
+
semibold: 600
|
|
618
|
+
},
|
|
619
|
+
lineHeights: {
|
|
620
|
+
body: 1.6,
|
|
621
|
+
heading: 1.3,
|
|
622
|
+
tight: 1.25,
|
|
623
|
+
relaxed: 1.75
|
|
624
|
+
},
|
|
625
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
626
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
627
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
628
|
+
shadows: [
|
|
629
|
+
"none",
|
|
630
|
+
"0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
|
|
631
|
+
"0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
|
|
632
|
+
"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
|
|
633
|
+
"0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
|
|
634
|
+
"0 25px 50px -12px rgba(0, 0, 0, 0.25)"
|
|
635
|
+
],
|
|
636
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
637
|
+
colors: {
|
|
638
|
+
text: "#1a1a1a",
|
|
639
|
+
background: "#ffffff",
|
|
640
|
+
primary: "#007acc",
|
|
641
|
+
secondary: "#005a9e",
|
|
642
|
+
accent: "#1a1a1a",
|
|
643
|
+
highlight: "rgba(0, 122, 204, 0.1)",
|
|
644
|
+
muted: "#f0f0f0",
|
|
645
|
+
success: "#28a745",
|
|
646
|
+
warning: "#ffc107",
|
|
647
|
+
error: "#dc3545",
|
|
648
|
+
info: "#17a2b8",
|
|
649
|
+
border: "rgba(0, 0, 0, 0.1)",
|
|
650
|
+
backgroundSecondary: "#f8f9fa",
|
|
651
|
+
backgroundTertiary: "#e9ecef",
|
|
652
|
+
backgroundLight: "rgba(0, 0, 0, 0.03)",
|
|
653
|
+
backgroundHover: "rgba(0, 0, 0, 0.05)",
|
|
654
|
+
surface: "#ffffff",
|
|
655
|
+
textSecondary: "#555555",
|
|
656
|
+
textTertiary: "#888888",
|
|
657
|
+
textMuted: "#aaaaaa",
|
|
658
|
+
highlightBg: "rgba(255, 235, 59, 0.3)",
|
|
659
|
+
highlightBorder: "rgba(255, 235, 59, 0.6)"
|
|
660
|
+
},
|
|
661
|
+
buttons: {
|
|
662
|
+
primary: {
|
|
663
|
+
color: "white",
|
|
664
|
+
bg: "primary",
|
|
665
|
+
"&:hover": { bg: "secondary" }
|
|
666
|
+
},
|
|
667
|
+
secondary: {
|
|
668
|
+
color: "primary",
|
|
669
|
+
bg: "transparent",
|
|
670
|
+
borderWidth: 1,
|
|
671
|
+
borderStyle: "solid",
|
|
672
|
+
borderColor: "primary",
|
|
673
|
+
"&:hover": { bg: "highlight" }
|
|
674
|
+
},
|
|
675
|
+
ghost: {
|
|
676
|
+
color: "text",
|
|
677
|
+
bg: "transparent",
|
|
678
|
+
"&:hover": { bg: "backgroundHover" }
|
|
679
|
+
}
|
|
680
|
+
},
|
|
681
|
+
text: {
|
|
682
|
+
heading: {
|
|
683
|
+
fontFamily: "heading",
|
|
684
|
+
fontWeight: "heading",
|
|
685
|
+
lineHeight: "heading"
|
|
686
|
+
},
|
|
687
|
+
body: {
|
|
688
|
+
fontFamily: "body",
|
|
689
|
+
fontWeight: "body",
|
|
690
|
+
lineHeight: "body"
|
|
691
|
+
},
|
|
692
|
+
caption: {
|
|
693
|
+
fontSize: 1,
|
|
694
|
+
color: "textSecondary"
|
|
695
|
+
}
|
|
696
|
+
},
|
|
697
|
+
cards: {
|
|
698
|
+
primary: {
|
|
699
|
+
bg: "surface",
|
|
700
|
+
border: "1px solid",
|
|
701
|
+
borderColor: "border",
|
|
702
|
+
borderRadius: 2
|
|
703
|
+
},
|
|
704
|
+
secondary: {
|
|
705
|
+
bg: "backgroundSecondary",
|
|
706
|
+
border: "1px solid",
|
|
707
|
+
borderColor: "border",
|
|
708
|
+
borderRadius: 2
|
|
709
|
+
}
|
|
710
|
+
}
|
|
711
|
+
};
|
|
712
|
+
var defaultTerminalTheme = {
|
|
713
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
714
|
+
fonts: {
|
|
715
|
+
body: '"Courier New", Courier, monospace',
|
|
716
|
+
heading: '"Courier New", Courier, monospace',
|
|
717
|
+
monospace: '"Courier New", Courier, monospace'
|
|
718
|
+
},
|
|
719
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
720
|
+
fontScale: 1,
|
|
721
|
+
fontWeights: {
|
|
722
|
+
body: 400,
|
|
723
|
+
heading: 500,
|
|
724
|
+
bold: 600,
|
|
725
|
+
light: 300,
|
|
726
|
+
medium: 500,
|
|
727
|
+
semibold: 600
|
|
728
|
+
},
|
|
729
|
+
lineHeights: {
|
|
730
|
+
body: 1.4,
|
|
731
|
+
heading: 1.2,
|
|
732
|
+
tight: 1.3,
|
|
733
|
+
relaxed: 1.6
|
|
734
|
+
},
|
|
735
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
736
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
737
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
738
|
+
shadows: [
|
|
739
|
+
"none",
|
|
740
|
+
"0 0 5px rgba(255, 193, 7, 0.1)",
|
|
741
|
+
"0 0 10px rgba(255, 193, 7, 0.15)",
|
|
742
|
+
"0 0 15px rgba(255, 193, 7, 0.2)",
|
|
743
|
+
"0 0 20px rgba(255, 193, 7, 0.25)",
|
|
744
|
+
"0 0 30px rgba(255, 193, 7, 0.3)"
|
|
745
|
+
],
|
|
746
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
747
|
+
colors: {
|
|
748
|
+
text: "#ffc107",
|
|
749
|
+
background: "#000000",
|
|
750
|
+
primary: "#ffc107",
|
|
751
|
+
secondary: "#ffb300",
|
|
752
|
+
accent: "#ffffff",
|
|
753
|
+
highlight: "rgba(255, 193, 7, 0.1)",
|
|
754
|
+
muted: "#1a1a1a",
|
|
755
|
+
success: "#4caf50",
|
|
756
|
+
warning: "#ff9800",
|
|
757
|
+
error: "#f44336",
|
|
758
|
+
info: "#2196f3",
|
|
759
|
+
border: "rgba(255, 193, 7, 0.2)",
|
|
760
|
+
backgroundSecondary: "#0a0a0a",
|
|
761
|
+
backgroundTertiary: "#111111",
|
|
762
|
+
backgroundLight: "rgba(255, 193, 7, 0.03)",
|
|
763
|
+
backgroundHover: "rgba(255, 193, 7, 0.05)",
|
|
764
|
+
surface: "#050505",
|
|
765
|
+
textSecondary: "#e0e0e0",
|
|
766
|
+
textTertiary: "#b0b0b0",
|
|
767
|
+
textMuted: "#808080",
|
|
768
|
+
highlightBg: "rgba(255, 193, 7, 0.2)",
|
|
769
|
+
highlightBorder: "rgba(255, 193, 7, 0.4)"
|
|
770
|
+
},
|
|
771
|
+
buttons: {
|
|
772
|
+
primary: {
|
|
773
|
+
color: "black",
|
|
774
|
+
bg: "primary",
|
|
775
|
+
borderWidth: 0,
|
|
776
|
+
"&:hover": { bg: "secondary" }
|
|
777
|
+
},
|
|
778
|
+
secondary: {
|
|
779
|
+
color: "primary",
|
|
780
|
+
bg: "transparent",
|
|
781
|
+
borderWidth: 1,
|
|
782
|
+
borderStyle: "solid",
|
|
783
|
+
borderColor: "primary",
|
|
784
|
+
"&:hover": { bg: "highlight" }
|
|
785
|
+
},
|
|
786
|
+
ghost: {
|
|
787
|
+
color: "text",
|
|
788
|
+
bg: "transparent",
|
|
789
|
+
"&:hover": { bg: "backgroundHover" }
|
|
790
|
+
}
|
|
791
|
+
},
|
|
792
|
+
text: {
|
|
793
|
+
heading: {
|
|
794
|
+
fontFamily: "heading",
|
|
795
|
+
fontWeight: "heading",
|
|
796
|
+
lineHeight: "heading"
|
|
797
|
+
},
|
|
798
|
+
body: {
|
|
799
|
+
fontFamily: "body",
|
|
800
|
+
fontWeight: "body",
|
|
801
|
+
lineHeight: "body"
|
|
802
|
+
},
|
|
803
|
+
caption: {
|
|
804
|
+
fontSize: 1,
|
|
805
|
+
color: "textSecondary"
|
|
806
|
+
}
|
|
807
|
+
},
|
|
808
|
+
cards: {
|
|
809
|
+
primary: {
|
|
810
|
+
bg: "surface",
|
|
811
|
+
border: "1px solid",
|
|
812
|
+
borderColor: "border",
|
|
813
|
+
borderRadius: 0
|
|
814
|
+
},
|
|
815
|
+
secondary: {
|
|
816
|
+
bg: "backgroundSecondary",
|
|
817
|
+
border: "1px solid",
|
|
818
|
+
borderColor: "border",
|
|
819
|
+
borderRadius: 0
|
|
820
|
+
}
|
|
821
|
+
}
|
|
822
|
+
};
|
|
823
|
+
var defaultEditorTheme = {
|
|
824
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
825
|
+
fonts: {
|
|
826
|
+
body: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace',
|
|
827
|
+
heading: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
828
|
+
monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
|
|
829
|
+
},
|
|
830
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
831
|
+
fontScale: 1,
|
|
832
|
+
fontWeights: {
|
|
833
|
+
body: 400,
|
|
834
|
+
heading: 600,
|
|
835
|
+
bold: 700,
|
|
836
|
+
light: 300,
|
|
837
|
+
medium: 500,
|
|
838
|
+
semibold: 600
|
|
839
|
+
},
|
|
840
|
+
lineHeights: {
|
|
841
|
+
body: 1.5,
|
|
842
|
+
heading: 1.2,
|
|
843
|
+
tight: 1.3,
|
|
844
|
+
relaxed: 1.7
|
|
845
|
+
},
|
|
846
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
847
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
848
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
849
|
+
shadows: [
|
|
850
|
+
"none",
|
|
851
|
+
"0 1px 2px rgba(0, 0, 0, 0.05)",
|
|
852
|
+
"0 2px 4px rgba(0, 0, 0, 0.1)",
|
|
853
|
+
"0 4px 8px rgba(0, 0, 0, 0.15)",
|
|
854
|
+
"0 8px 16px rgba(0, 0, 0, 0.2)",
|
|
855
|
+
"0 12px 24px rgba(0, 0, 0, 0.25)"
|
|
856
|
+
],
|
|
857
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
858
|
+
colors: {
|
|
859
|
+
text: "#d4d4d4",
|
|
860
|
+
background: "#1e1e1e",
|
|
861
|
+
primary: "#569cd6",
|
|
862
|
+
secondary: "#408ac9",
|
|
863
|
+
accent: "#c586c0",
|
|
864
|
+
highlight: "rgba(86, 156, 214, 0.1)",
|
|
865
|
+
muted: "#2a2a2a",
|
|
866
|
+
success: "#6a9955",
|
|
867
|
+
warning: "#d18616",
|
|
868
|
+
error: "#f44747",
|
|
869
|
+
info: "#569cd6",
|
|
870
|
+
border: "rgba(255, 255, 255, 0.1)",
|
|
871
|
+
backgroundSecondary: "#252526",
|
|
872
|
+
backgroundTertiary: "#333333",
|
|
873
|
+
backgroundLight: "rgba(255, 255, 255, 0.03)",
|
|
874
|
+
backgroundHover: "rgba(255, 255, 255, 0.05)",
|
|
875
|
+
surface: "#252526",
|
|
876
|
+
textSecondary: "#cccccc",
|
|
877
|
+
textTertiary: "#999999",
|
|
878
|
+
textMuted: "#666666",
|
|
879
|
+
highlightBg: "rgba(255, 235, 59, 0.2)",
|
|
880
|
+
highlightBorder: "rgba(255, 235, 59, 0.4)"
|
|
881
|
+
},
|
|
882
|
+
buttons: {
|
|
883
|
+
primary: {
|
|
884
|
+
color: "white",
|
|
885
|
+
bg: "primary",
|
|
886
|
+
"&:hover": { bg: "secondary" }
|
|
887
|
+
},
|
|
888
|
+
secondary: {
|
|
889
|
+
color: "primary",
|
|
890
|
+
bg: "transparent",
|
|
891
|
+
borderWidth: 1,
|
|
892
|
+
borderStyle: "solid",
|
|
893
|
+
borderColor: "primary",
|
|
894
|
+
"&:hover": { bg: "highlight" }
|
|
895
|
+
},
|
|
896
|
+
ghost: {
|
|
897
|
+
color: "text",
|
|
898
|
+
bg: "transparent",
|
|
899
|
+
"&:hover": { bg: "backgroundHover" }
|
|
900
|
+
}
|
|
901
|
+
},
|
|
902
|
+
text: {
|
|
903
|
+
heading: {
|
|
904
|
+
fontFamily: "heading",
|
|
905
|
+
fontWeight: "heading",
|
|
906
|
+
lineHeight: "heading"
|
|
907
|
+
},
|
|
908
|
+
body: {
|
|
909
|
+
fontFamily: "body",
|
|
910
|
+
fontWeight: "body",
|
|
911
|
+
lineHeight: "body"
|
|
912
|
+
},
|
|
913
|
+
caption: {
|
|
914
|
+
fontSize: 1,
|
|
915
|
+
color: "textSecondary"
|
|
916
|
+
}
|
|
917
|
+
},
|
|
918
|
+
cards: {
|
|
919
|
+
primary: {
|
|
920
|
+
bg: "surface",
|
|
921
|
+
border: "1px solid",
|
|
922
|
+
borderColor: "border",
|
|
923
|
+
borderRadius: 1
|
|
924
|
+
},
|
|
925
|
+
secondary: {
|
|
926
|
+
bg: "backgroundSecondary",
|
|
927
|
+
border: "1px solid",
|
|
928
|
+
borderColor: "border",
|
|
929
|
+
borderRadius: 1
|
|
930
|
+
}
|
|
931
|
+
}
|
|
932
|
+
};
|
|
933
|
+
var landingPageTheme = {
|
|
934
|
+
space: [0, 4, 8, 12, 16, 20, 24, 32, 40, 48, 64, 80, 100, 128],
|
|
935
|
+
fonts: {
|
|
936
|
+
body: 'Inter, "Geist Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
|
|
937
|
+
heading: '-apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
|
|
938
|
+
monospace: '"SF Mono", Monaco, Inconsolata, "Fira Code", monospace'
|
|
939
|
+
},
|
|
940
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
941
|
+
fontScale: 1,
|
|
942
|
+
fontWeights: {
|
|
943
|
+
body: 400,
|
|
944
|
+
heading: 600,
|
|
945
|
+
bold: 700,
|
|
946
|
+
light: 300,
|
|
947
|
+
medium: 500,
|
|
948
|
+
semibold: 600
|
|
949
|
+
},
|
|
950
|
+
lineHeights: {
|
|
951
|
+
body: 1.6,
|
|
952
|
+
heading: 1.2,
|
|
953
|
+
tight: 1.05,
|
|
954
|
+
relaxed: 1.7
|
|
955
|
+
},
|
|
956
|
+
breakpoints: ["640px", "768px", "1024px", "1280px", "1400px"],
|
|
957
|
+
sizes: [16, 32, 64, 128, 200, 240, 256, 300, 512, 740, 768, 820, 900, 1024, 1200, 1400, 1536],
|
|
958
|
+
radii: [0, 2, 4, 6, 7, 8, 9, 10, 12, 14, 16, 24],
|
|
959
|
+
shadows: [
|
|
960
|
+
"none",
|
|
961
|
+
"0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
|
|
962
|
+
"0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
|
|
963
|
+
"0 4px 12px rgba(0, 194, 255, 0.4)",
|
|
964
|
+
"0 6px 24px rgba(0, 194, 255, 0.1)",
|
|
965
|
+
"0 8px 32px rgba(0, 0, 0, 0.4)"
|
|
966
|
+
],
|
|
967
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50, 1e3],
|
|
968
|
+
colors: {
|
|
969
|
+
text: "#ffffff",
|
|
970
|
+
background: "#000000",
|
|
971
|
+
primary: "#00C2FF",
|
|
972
|
+
secondary: "#0098CC",
|
|
973
|
+
accent: "#0066FF",
|
|
974
|
+
highlight: "rgba(0, 194, 255, 0.15)",
|
|
975
|
+
muted: "#1a1a1a",
|
|
976
|
+
success: "#4caf50",
|
|
977
|
+
warning: "#ff9800",
|
|
978
|
+
error: "#f44336",
|
|
979
|
+
info: "#2196f3",
|
|
980
|
+
border: "rgba(0, 194, 255, 0.2)",
|
|
981
|
+
backgroundSecondary: "#0a1628",
|
|
982
|
+
backgroundTertiary: "#0f1c2e",
|
|
983
|
+
backgroundLight: "rgba(0, 194, 255, 0.04)",
|
|
984
|
+
backgroundHover: "rgba(0, 194, 255, 0.1)",
|
|
985
|
+
surface: "rgba(0, 0, 0, 0.4)",
|
|
986
|
+
textSecondary: "#d1d5db",
|
|
987
|
+
textTertiary: "#9ca3af",
|
|
988
|
+
textMuted: "#6b7280",
|
|
989
|
+
highlightBg: "rgba(255, 235, 59, 0.25)",
|
|
990
|
+
highlightBorder: "rgba(255, 235, 59, 0.5)"
|
|
991
|
+
},
|
|
992
|
+
buttons: {
|
|
993
|
+
primary: {
|
|
994
|
+
color: "#000000",
|
|
995
|
+
bg: "#00C2FF",
|
|
996
|
+
borderWidth: 0,
|
|
997
|
+
padding: "8px 20px",
|
|
998
|
+
fontSize: 14,
|
|
999
|
+
fontWeight: 600,
|
|
1000
|
+
cursor: "pointer",
|
|
1001
|
+
"&:hover": {
|
|
1002
|
+
bg: "#00D9FF"
|
|
1003
|
+
}
|
|
1004
|
+
},
|
|
1005
|
+
secondary: {
|
|
1006
|
+
color: "#00C2FF",
|
|
1007
|
+
bg: "transparent",
|
|
1008
|
+
borderWidth: 1,
|
|
1009
|
+
borderStyle: "solid",
|
|
1010
|
+
borderColor: "rgba(0, 194, 255, 0.3)",
|
|
1011
|
+
padding: "8px 16px",
|
|
1012
|
+
fontSize: 14,
|
|
1013
|
+
fontWeight: 600,
|
|
1014
|
+
cursor: "pointer",
|
|
1015
|
+
"&:hover": {
|
|
1016
|
+
bg: "rgba(0, 194, 255, 0.1)",
|
|
1017
|
+
borderColor: "#00C2FF"
|
|
1018
|
+
}
|
|
1019
|
+
},
|
|
1020
|
+
ghost: {
|
|
1021
|
+
color: "#00C2FF",
|
|
1022
|
+
bg: "transparent",
|
|
1023
|
+
borderWidth: 0,
|
|
1024
|
+
padding: "8px 16px",
|
|
1025
|
+
fontSize: 14,
|
|
1026
|
+
fontWeight: 500,
|
|
1027
|
+
cursor: "pointer",
|
|
1028
|
+
"&:hover": {
|
|
1029
|
+
color: "#00D9FF",
|
|
1030
|
+
bg: "rgba(0, 194, 255, 0.1)"
|
|
1031
|
+
}
|
|
1032
|
+
}
|
|
1033
|
+
},
|
|
1034
|
+
text: {
|
|
1035
|
+
heading: {
|
|
1036
|
+
fontFamily: "heading",
|
|
1037
|
+
fontWeight: "heading",
|
|
1038
|
+
lineHeight: "heading",
|
|
1039
|
+
color: "#ffffff"
|
|
1040
|
+
},
|
|
1041
|
+
body: {
|
|
1042
|
+
fontFamily: "body",
|
|
1043
|
+
fontWeight: "body",
|
|
1044
|
+
lineHeight: "body",
|
|
1045
|
+
color: "text"
|
|
1046
|
+
},
|
|
1047
|
+
caption: {
|
|
1048
|
+
fontSize: 1,
|
|
1049
|
+
color: "textSecondary"
|
|
1050
|
+
}
|
|
1051
|
+
},
|
|
1052
|
+
cards: {
|
|
1053
|
+
primary: {
|
|
1054
|
+
bg: "surface",
|
|
1055
|
+
border: "1px solid",
|
|
1056
|
+
borderColor: "border",
|
|
1057
|
+
borderRadius: 4
|
|
1058
|
+
},
|
|
1059
|
+
secondary: {
|
|
1060
|
+
bg: "rgba(0, 194, 255, 0.05)",
|
|
1061
|
+
border: "1px solid",
|
|
1062
|
+
borderColor: "rgba(0, 194, 255, 0.2)",
|
|
1063
|
+
borderRadius: 4
|
|
1064
|
+
}
|
|
1065
|
+
}
|
|
1066
|
+
};
|
|
1067
|
+
var landingPageLightTheme = {
|
|
1068
|
+
...landingPageTheme,
|
|
1069
|
+
colors: {
|
|
1070
|
+
text: "#1a1a1a",
|
|
1071
|
+
background: "#ffffff",
|
|
1072
|
+
primary: "#0098CC",
|
|
1073
|
+
secondary: "#00C2FF",
|
|
1074
|
+
accent: "#0066FF",
|
|
1075
|
+
highlight: "rgba(0, 152, 204, 0.1)",
|
|
1076
|
+
muted: "#f0f0f0",
|
|
1077
|
+
success: "#4caf50",
|
|
1078
|
+
warning: "#ff9800",
|
|
1079
|
+
error: "#f44336",
|
|
1080
|
+
info: "#2196f3",
|
|
1081
|
+
border: "rgba(0, 152, 204, 0.2)",
|
|
1082
|
+
backgroundSecondary: "#f8f9fa",
|
|
1083
|
+
backgroundTertiary: "#e9ecef",
|
|
1084
|
+
backgroundLight: "rgba(0, 152, 204, 0.03)",
|
|
1085
|
+
backgroundHover: "rgba(0, 152, 204, 0.05)",
|
|
1086
|
+
surface: "rgba(255, 255, 255, 0.95)",
|
|
1087
|
+
textSecondary: "#555555",
|
|
1088
|
+
textTertiary: "#888888",
|
|
1089
|
+
textMuted: "#aaaaaa",
|
|
1090
|
+
highlightBg: "rgba(255, 235, 59, 0.3)",
|
|
1091
|
+
highlightBorder: "rgba(255, 235, 59, 0.6)"
|
|
1092
|
+
},
|
|
1093
|
+
buttons: {
|
|
1094
|
+
primary: {
|
|
1095
|
+
color: "#ffffff",
|
|
1096
|
+
bg: "#0098CC",
|
|
1097
|
+
borderWidth: 0,
|
|
1098
|
+
padding: "8px 20px",
|
|
1099
|
+
fontSize: 14,
|
|
1100
|
+
fontWeight: 600,
|
|
1101
|
+
cursor: "pointer",
|
|
1102
|
+
"&:hover": {
|
|
1103
|
+
bg: "#007aa8"
|
|
1104
|
+
}
|
|
1105
|
+
},
|
|
1106
|
+
secondary: {
|
|
1107
|
+
color: "#0098CC",
|
|
1108
|
+
bg: "transparent",
|
|
1109
|
+
borderWidth: 1,
|
|
1110
|
+
borderStyle: "solid",
|
|
1111
|
+
borderColor: "rgba(0, 152, 204, 0.3)",
|
|
1112
|
+
padding: "8px 16px",
|
|
1113
|
+
fontSize: 14,
|
|
1114
|
+
fontWeight: 600,
|
|
1115
|
+
cursor: "pointer",
|
|
1116
|
+
"&:hover": {
|
|
1117
|
+
bg: "rgba(0, 152, 204, 0.05)",
|
|
1118
|
+
borderColor: "#0098CC"
|
|
1119
|
+
}
|
|
1120
|
+
},
|
|
1121
|
+
ghost: {
|
|
1122
|
+
color: "#0098CC",
|
|
1123
|
+
bg: "transparent",
|
|
1124
|
+
borderWidth: 0,
|
|
1125
|
+
padding: "8px 16px",
|
|
1126
|
+
fontSize: 14,
|
|
1127
|
+
fontWeight: 500,
|
|
1128
|
+
cursor: "pointer",
|
|
1129
|
+
"&:hover": {
|
|
1130
|
+
color: "#007aa8",
|
|
1131
|
+
bg: "rgba(0, 152, 204, 0.05)"
|
|
1132
|
+
}
|
|
1133
|
+
}
|
|
1134
|
+
}
|
|
1135
|
+
};
|
|
1136
|
+
var regalTheme = {
|
|
1137
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
1138
|
+
fonts: {
|
|
1139
|
+
body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
1140
|
+
heading: '"Crimson Text", "Georgia", "Times New Roman", serif',
|
|
1141
|
+
monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
|
|
1142
|
+
},
|
|
1143
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
1144
|
+
fontScale: 1,
|
|
1145
|
+
fontWeights: {
|
|
1146
|
+
body: 400,
|
|
1147
|
+
heading: 600,
|
|
1148
|
+
bold: 700,
|
|
1149
|
+
light: 300,
|
|
1150
|
+
medium: 500,
|
|
1151
|
+
semibold: 600
|
|
1152
|
+
},
|
|
1153
|
+
lineHeights: {
|
|
1154
|
+
body: 1.5,
|
|
1155
|
+
heading: 1.2,
|
|
1156
|
+
tight: 1.25,
|
|
1157
|
+
relaxed: 1.75
|
|
1158
|
+
},
|
|
1159
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
1160
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
1161
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
1162
|
+
shadows: [
|
|
1163
|
+
"none",
|
|
1164
|
+
"0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
|
|
1165
|
+
"0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
|
|
1166
|
+
"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
|
|
1167
|
+
"0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
|
|
1168
|
+
"0 25px 50px -12px rgba(0, 0, 0, 0.25)"
|
|
1169
|
+
],
|
|
1170
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
1171
|
+
colors: {
|
|
1172
|
+
text: "#f1e8dc",
|
|
1173
|
+
background: "#1a1f2e",
|
|
1174
|
+
primary: "#d4a574",
|
|
1175
|
+
secondary: "#e0b584",
|
|
1176
|
+
accent: "#c9b8a3",
|
|
1177
|
+
highlight: "rgba(212, 165, 116, 0.15)",
|
|
1178
|
+
muted: "#8b7968",
|
|
1179
|
+
success: "#5c8a72",
|
|
1180
|
+
warning: "#d4a574",
|
|
1181
|
+
error: "#a85751",
|
|
1182
|
+
info: "#d4a574",
|
|
1183
|
+
border: "rgba(212, 165, 116, 0.2)",
|
|
1184
|
+
backgroundSecondary: "#212738",
|
|
1185
|
+
backgroundTertiary: "#2d3446",
|
|
1186
|
+
backgroundLight: "rgba(212, 165, 116, 0.08)",
|
|
1187
|
+
backgroundHover: "rgba(212, 165, 116, 0.15)",
|
|
1188
|
+
surface: "#212738",
|
|
1189
|
+
textSecondary: "#c9b8a3",
|
|
1190
|
+
textTertiary: "#8b7968",
|
|
1191
|
+
textMuted: "#8b7968",
|
|
1192
|
+
highlightBg: "rgba(255, 193, 7, 0.25)",
|
|
1193
|
+
highlightBorder: "rgba(255, 193, 7, 0.5)"
|
|
1194
|
+
},
|
|
1195
|
+
buttons: {
|
|
1196
|
+
primary: {
|
|
1197
|
+
color: "background",
|
|
1198
|
+
bg: "primary",
|
|
1199
|
+
"&:hover": {
|
|
1200
|
+
bg: "secondary"
|
|
1201
|
+
}
|
|
1202
|
+
},
|
|
1203
|
+
secondary: {
|
|
1204
|
+
color: "text",
|
|
1205
|
+
bg: "muted",
|
|
1206
|
+
"&:hover": {
|
|
1207
|
+
bg: "backgroundSecondary"
|
|
1208
|
+
}
|
|
1209
|
+
},
|
|
1210
|
+
ghost: {
|
|
1211
|
+
color: "primary",
|
|
1212
|
+
bg: "transparent",
|
|
1213
|
+
"&:hover": {
|
|
1214
|
+
bg: "muted"
|
|
1215
|
+
}
|
|
1216
|
+
}
|
|
1217
|
+
},
|
|
1218
|
+
text: {
|
|
1219
|
+
heading: {
|
|
1220
|
+
fontFamily: "heading",
|
|
1221
|
+
fontWeight: "heading",
|
|
1222
|
+
lineHeight: "heading"
|
|
1223
|
+
},
|
|
1224
|
+
body: {
|
|
1225
|
+
fontFamily: "body",
|
|
1226
|
+
fontWeight: "body",
|
|
1227
|
+
lineHeight: "body"
|
|
1228
|
+
},
|
|
1229
|
+
caption: {
|
|
1230
|
+
fontSize: 1,
|
|
1231
|
+
color: "textSecondary"
|
|
1232
|
+
}
|
|
1233
|
+
},
|
|
1234
|
+
cards: {
|
|
1235
|
+
primary: {
|
|
1236
|
+
bg: "background",
|
|
1237
|
+
border: "1px solid",
|
|
1238
|
+
borderColor: "border",
|
|
1239
|
+
borderRadius: 2
|
|
1240
|
+
},
|
|
1241
|
+
secondary: {
|
|
1242
|
+
bg: "backgroundSecondary",
|
|
1243
|
+
border: "1px solid",
|
|
1244
|
+
borderColor: "border",
|
|
1245
|
+
borderRadius: 2
|
|
1246
|
+
}
|
|
1247
|
+
}
|
|
1248
|
+
};
|
|
1249
|
+
var terminalTheme = {
|
|
1250
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
1251
|
+
fonts: {
|
|
1252
|
+
body: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace',
|
|
1253
|
+
heading: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace',
|
|
1254
|
+
monospace: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace'
|
|
1255
|
+
},
|
|
1256
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
1257
|
+
fontScale: 1,
|
|
1258
|
+
fontWeights: {
|
|
1259
|
+
body: 400,
|
|
1260
|
+
heading: 500,
|
|
1261
|
+
bold: 600,
|
|
1262
|
+
light: 300,
|
|
1263
|
+
medium: 500,
|
|
1264
|
+
semibold: 600
|
|
1265
|
+
},
|
|
1266
|
+
lineHeights: {
|
|
1267
|
+
body: 1.6,
|
|
1268
|
+
heading: 1.3,
|
|
1269
|
+
tight: 1.4,
|
|
1270
|
+
relaxed: 1.8
|
|
1271
|
+
},
|
|
1272
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
1273
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
1274
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
1275
|
+
shadows: [
|
|
1276
|
+
"none",
|
|
1277
|
+
"0 1px 2px 0 rgba(0, 0, 0, 0.05)",
|
|
1278
|
+
"0 2px 4px 0 rgba(0, 0, 0, 0.06)",
|
|
1279
|
+
"0 4px 6px 0 rgba(0, 0, 0, 0.07)",
|
|
1280
|
+
"0 8px 12px 0 rgba(0, 0, 0, 0.08)",
|
|
1281
|
+
"0 16px 24px 0 rgba(0, 0, 0, 0.10)"
|
|
1282
|
+
],
|
|
1283
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
1284
|
+
colors: {
|
|
1285
|
+
text: "#e4e4e4",
|
|
1286
|
+
background: "rgba(10, 10, 10, 0.85)",
|
|
1287
|
+
primary: "#66b3ff",
|
|
1288
|
+
secondary: "#80c4ff",
|
|
1289
|
+
accent: "#66ff99",
|
|
1290
|
+
highlight: "rgba(102, 179, 255, 0.15)",
|
|
1291
|
+
muted: "rgba(26, 26, 26, 0.8)",
|
|
1292
|
+
success: "#66ff99",
|
|
1293
|
+
warning: "#ffcc66",
|
|
1294
|
+
error: "#ff6666",
|
|
1295
|
+
info: "#66b3ff",
|
|
1296
|
+
border: "rgba(255, 255, 255, 0.1)",
|
|
1297
|
+
backgroundSecondary: "rgba(15, 15, 15, 0.9)",
|
|
1298
|
+
backgroundTertiary: "rgba(20, 20, 20, 0.9)",
|
|
1299
|
+
backgroundLight: "rgba(255, 255, 255, 0.05)",
|
|
1300
|
+
backgroundHover: "rgba(102, 179, 255, 0.08)",
|
|
1301
|
+
surface: "rgba(15, 15, 15, 0.95)",
|
|
1302
|
+
textSecondary: "rgba(255, 255, 255, 0.7)",
|
|
1303
|
+
textTertiary: "rgba(255, 255, 255, 0.5)",
|
|
1304
|
+
textMuted: "rgba(255, 255, 255, 0.4)",
|
|
1305
|
+
highlightBg: "rgba(255, 235, 59, 0.25)",
|
|
1306
|
+
highlightBorder: "rgba(255, 235, 59, 0.5)"
|
|
1307
|
+
},
|
|
1308
|
+
modes: {
|
|
1309
|
+
light: {
|
|
1310
|
+
text: "#1a1a1a",
|
|
1311
|
+
background: "rgba(255, 255, 255, 0.9)",
|
|
1312
|
+
primary: "#0066cc",
|
|
1313
|
+
secondary: "#0052a3",
|
|
1314
|
+
accent: "#00cc88",
|
|
1315
|
+
highlight: "rgba(0, 102, 204, 0.08)",
|
|
1316
|
+
muted: "rgba(245, 245, 245, 0.8)",
|
|
1317
|
+
success: "#00cc88",
|
|
1318
|
+
warning: "#ffaa00",
|
|
1319
|
+
error: "#ff3333",
|
|
1320
|
+
info: "#0066cc",
|
|
1321
|
+
border: "rgba(0, 0, 0, 0.1)",
|
|
1322
|
+
backgroundSecondary: "rgba(250, 250, 250, 0.9)",
|
|
1323
|
+
backgroundTertiary: "rgba(245, 245, 245, 0.9)",
|
|
1324
|
+
backgroundLight: "rgba(0, 0, 0, 0.02)",
|
|
1325
|
+
backgroundHover: "rgba(0, 102, 204, 0.04)",
|
|
1326
|
+
surface: "rgba(255, 255, 255, 0.95)",
|
|
1327
|
+
textSecondary: "rgba(0, 0, 0, 0.6)",
|
|
1328
|
+
textTertiary: "rgba(0, 0, 0, 0.4)",
|
|
1329
|
+
textMuted: "rgba(0, 0, 0, 0.3)",
|
|
1330
|
+
highlightBg: "rgba(255, 235, 59, 0.3)",
|
|
1331
|
+
highlightBorder: "rgba(255, 235, 59, 0.6)"
|
|
1332
|
+
}
|
|
1333
|
+
},
|
|
1334
|
+
buttons: {
|
|
1335
|
+
primary: {
|
|
1336
|
+
color: "white",
|
|
1337
|
+
bg: "primary",
|
|
1338
|
+
borderWidth: 0,
|
|
1339
|
+
"&:hover": {
|
|
1340
|
+
bg: "secondary"
|
|
1341
|
+
}
|
|
1342
|
+
},
|
|
1343
|
+
secondary: {
|
|
1344
|
+
color: "primary",
|
|
1345
|
+
bg: "transparent",
|
|
1346
|
+
borderWidth: 1,
|
|
1347
|
+
borderStyle: "solid",
|
|
1348
|
+
borderColor: "primary",
|
|
1349
|
+
"&:hover": {
|
|
1350
|
+
bg: "highlight"
|
|
1351
|
+
}
|
|
1352
|
+
},
|
|
1353
|
+
ghost: {
|
|
1354
|
+
color: "text",
|
|
1355
|
+
bg: "transparent",
|
|
1356
|
+
"&:hover": {
|
|
1357
|
+
bg: "backgroundHover"
|
|
1358
|
+
}
|
|
1359
|
+
}
|
|
1360
|
+
},
|
|
1361
|
+
text: {
|
|
1362
|
+
heading: {
|
|
1363
|
+
fontFamily: "heading",
|
|
1364
|
+
fontWeight: "heading",
|
|
1365
|
+
lineHeight: "heading"
|
|
1366
|
+
},
|
|
1367
|
+
body: {
|
|
1368
|
+
fontFamily: "body",
|
|
1369
|
+
fontWeight: "body",
|
|
1370
|
+
lineHeight: "body"
|
|
1371
|
+
},
|
|
1372
|
+
caption: {
|
|
1373
|
+
fontSize: 1,
|
|
1374
|
+
color: "textSecondary"
|
|
1375
|
+
}
|
|
1376
|
+
},
|
|
1377
|
+
cards: {
|
|
1378
|
+
primary: {
|
|
1379
|
+
bg: "surface",
|
|
1380
|
+
border: "1px solid",
|
|
1381
|
+
borderColor: "border",
|
|
1382
|
+
borderRadius: 1
|
|
1383
|
+
},
|
|
1384
|
+
secondary: {
|
|
1385
|
+
bg: "backgroundSecondary",
|
|
1386
|
+
border: "1px solid",
|
|
1387
|
+
borderColor: "border",
|
|
1388
|
+
borderRadius: 1
|
|
1389
|
+
}
|
|
1390
|
+
}
|
|
1391
|
+
};
|
|
1392
|
+
var matrixTheme = {
|
|
1393
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
1394
|
+
fonts: {
|
|
1395
|
+
body: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
|
|
1396
|
+
heading: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
|
|
1397
|
+
monospace: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace'
|
|
1398
|
+
},
|
|
1399
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
1400
|
+
fontScale: 1,
|
|
1401
|
+
fontWeights: {
|
|
1402
|
+
body: 400,
|
|
1403
|
+
heading: 500,
|
|
1404
|
+
bold: 600,
|
|
1405
|
+
light: 300,
|
|
1406
|
+
medium: 500,
|
|
1407
|
+
semibold: 600
|
|
1408
|
+
},
|
|
1409
|
+
lineHeights: {
|
|
1410
|
+
body: 1.5,
|
|
1411
|
+
heading: 1.2,
|
|
1412
|
+
tight: 1.3,
|
|
1413
|
+
relaxed: 1.7
|
|
1414
|
+
},
|
|
1415
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
1416
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
1417
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
1418
|
+
shadows: [
|
|
1419
|
+
"none",
|
|
1420
|
+
"0 0 5px rgba(0, 216, 53, 0.15)",
|
|
1421
|
+
"0 0 10px rgba(0, 216, 53, 0.2)",
|
|
1422
|
+
"0 0 15px rgba(0, 216, 53, 0.25)",
|
|
1423
|
+
"0 0 20px rgba(0, 216, 53, 0.3)",
|
|
1424
|
+
"0 0 30px rgba(0, 216, 53, 0.4)"
|
|
1425
|
+
],
|
|
1426
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
1427
|
+
colors: {
|
|
1428
|
+
text: "#a8a8a8",
|
|
1429
|
+
background: "#000000",
|
|
1430
|
+
primary: "#00d835",
|
|
1431
|
+
secondary: "#00a828",
|
|
1432
|
+
accent: "#00d835",
|
|
1433
|
+
highlight: "rgba(0, 216, 53, 0.15)",
|
|
1434
|
+
muted: "#0a0a0a",
|
|
1435
|
+
success: "#00d835",
|
|
1436
|
+
warning: "#d4a000",
|
|
1437
|
+
error: "#d63333",
|
|
1438
|
+
info: "#00a8d6",
|
|
1439
|
+
border: "rgba(0, 216, 53, 0.2)",
|
|
1440
|
+
backgroundSecondary: "#0a0a0a",
|
|
1441
|
+
backgroundTertiary: "#111111",
|
|
1442
|
+
backgroundLight: "rgba(0, 216, 53, 0.03)",
|
|
1443
|
+
backgroundHover: "rgba(0, 216, 53, 0.08)",
|
|
1444
|
+
surface: "#050505",
|
|
1445
|
+
textSecondary: "#808080",
|
|
1446
|
+
textTertiary: "#606060",
|
|
1447
|
+
textMuted: "#484848",
|
|
1448
|
+
highlightBg: "rgba(0, 216, 53, 0.25)",
|
|
1449
|
+
highlightBorder: "rgba(0, 216, 53, 0.5)"
|
|
1450
|
+
},
|
|
1451
|
+
buttons: {
|
|
1452
|
+
primary: {
|
|
1453
|
+
color: "black",
|
|
1454
|
+
bg: "primary",
|
|
1455
|
+
borderWidth: 0,
|
|
1456
|
+
"&:hover": {
|
|
1457
|
+
bg: "secondary"
|
|
1458
|
+
}
|
|
1459
|
+
},
|
|
1460
|
+
secondary: {
|
|
1461
|
+
color: "primary",
|
|
1462
|
+
bg: "transparent",
|
|
1463
|
+
borderWidth: 1,
|
|
1464
|
+
borderStyle: "solid",
|
|
1465
|
+
borderColor: "primary",
|
|
1466
|
+
"&:hover": {
|
|
1467
|
+
bg: "highlight"
|
|
1468
|
+
}
|
|
1469
|
+
},
|
|
1470
|
+
ghost: {
|
|
1471
|
+
color: "text",
|
|
1472
|
+
bg: "transparent",
|
|
1473
|
+
"&:hover": {
|
|
1474
|
+
bg: "backgroundHover"
|
|
1475
|
+
}
|
|
1476
|
+
}
|
|
1477
|
+
},
|
|
1478
|
+
text: {
|
|
1479
|
+
heading: {
|
|
1480
|
+
fontFamily: "heading",
|
|
1481
|
+
fontWeight: "heading",
|
|
1482
|
+
lineHeight: "heading"
|
|
1483
|
+
},
|
|
1484
|
+
body: {
|
|
1485
|
+
fontFamily: "body",
|
|
1486
|
+
fontWeight: "body",
|
|
1487
|
+
lineHeight: "body"
|
|
1488
|
+
},
|
|
1489
|
+
caption: {
|
|
1490
|
+
fontSize: 1,
|
|
1491
|
+
color: "textSecondary"
|
|
1492
|
+
}
|
|
1493
|
+
},
|
|
1494
|
+
cards: {
|
|
1495
|
+
primary: {
|
|
1496
|
+
bg: "surface",
|
|
1497
|
+
border: "1px solid",
|
|
1498
|
+
borderColor: "border",
|
|
1499
|
+
borderRadius: 0
|
|
1500
|
+
},
|
|
1501
|
+
secondary: {
|
|
1502
|
+
bg: "backgroundSecondary",
|
|
1503
|
+
border: "1px solid",
|
|
1504
|
+
borderColor: "border",
|
|
1505
|
+
borderRadius: 0
|
|
1506
|
+
}
|
|
1507
|
+
}
|
|
1508
|
+
};
|
|
1509
|
+
var matrixMinimalTheme = {
|
|
1510
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
1511
|
+
fonts: {
|
|
1512
|
+
body: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
|
|
1513
|
+
heading: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace',
|
|
1514
|
+
monospace: '"Courier New", "Courier", "Lucida Console", "Monaco", monospace'
|
|
1515
|
+
},
|
|
1516
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
1517
|
+
fontScale: 1,
|
|
1518
|
+
fontWeights: {
|
|
1519
|
+
body: 400,
|
|
1520
|
+
heading: 500,
|
|
1521
|
+
bold: 600,
|
|
1522
|
+
light: 300,
|
|
1523
|
+
medium: 500,
|
|
1524
|
+
semibold: 600
|
|
1525
|
+
},
|
|
1526
|
+
lineHeights: {
|
|
1527
|
+
body: 1.5,
|
|
1528
|
+
heading: 1.2,
|
|
1529
|
+
tight: 1.3,
|
|
1530
|
+
relaxed: 1.7
|
|
1531
|
+
},
|
|
1532
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
1533
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
1534
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
1535
|
+
shadows: [
|
|
1536
|
+
"none",
|
|
1537
|
+
"0 1px 2px rgba(0, 0, 0, 0.05)",
|
|
1538
|
+
"0 2px 4px rgba(0, 0, 0, 0.1)",
|
|
1539
|
+
"0 4px 8px rgba(0, 0, 0, 0.15)",
|
|
1540
|
+
"0 8px 16px rgba(0, 0, 0, 0.2)",
|
|
1541
|
+
"0 0 20px rgba(0, 216, 53, 0.1)"
|
|
1542
|
+
],
|
|
1543
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
1544
|
+
colors: {
|
|
1545
|
+
text: "#a8a8a8",
|
|
1546
|
+
background: "#000000",
|
|
1547
|
+
primary: "#b8b8b8",
|
|
1548
|
+
secondary: "#909090",
|
|
1549
|
+
accent: "#00d835",
|
|
1550
|
+
highlight: "rgba(0, 216, 53, 0.1)",
|
|
1551
|
+
muted: "#0a0a0a",
|
|
1552
|
+
success: "#00d835",
|
|
1553
|
+
warning: "#d4a000",
|
|
1554
|
+
error: "#d63333",
|
|
1555
|
+
info: "#00a8d6",
|
|
1556
|
+
border: "rgba(184, 184, 184, 0.1)",
|
|
1557
|
+
backgroundSecondary: "#0a0a0a",
|
|
1558
|
+
backgroundTertiary: "#111111",
|
|
1559
|
+
backgroundLight: "rgba(184, 184, 184, 0.02)",
|
|
1560
|
+
backgroundHover: "rgba(0, 216, 53, 0.05)",
|
|
1561
|
+
surface: "#050505",
|
|
1562
|
+
textSecondary: "#808080",
|
|
1563
|
+
textTertiary: "#606060",
|
|
1564
|
+
textMuted: "#484848",
|
|
1565
|
+
highlightBg: "rgba(0, 216, 53, 0.2)",
|
|
1566
|
+
highlightBorder: "rgba(0, 216, 53, 0.4)"
|
|
1567
|
+
},
|
|
1568
|
+
buttons: {
|
|
1569
|
+
primary: {
|
|
1570
|
+
color: "black",
|
|
1571
|
+
bg: "primary",
|
|
1572
|
+
borderWidth: 0,
|
|
1573
|
+
"&:hover": {
|
|
1574
|
+
bg: "secondary"
|
|
1575
|
+
}
|
|
1576
|
+
},
|
|
1577
|
+
secondary: {
|
|
1578
|
+
color: "primary",
|
|
1579
|
+
bg: "transparent",
|
|
1580
|
+
borderWidth: 1,
|
|
1581
|
+
borderStyle: "solid",
|
|
1582
|
+
borderColor: "primary",
|
|
1583
|
+
"&:hover": {
|
|
1584
|
+
bg: "backgroundHover"
|
|
1585
|
+
}
|
|
1586
|
+
},
|
|
1587
|
+
ghost: {
|
|
1588
|
+
color: "text",
|
|
1589
|
+
bg: "transparent",
|
|
1590
|
+
"&:hover": {
|
|
1591
|
+
bg: "backgroundHover"
|
|
1592
|
+
}
|
|
1593
|
+
}
|
|
1594
|
+
},
|
|
1595
|
+
text: {
|
|
1596
|
+
heading: {
|
|
1597
|
+
fontFamily: "heading",
|
|
1598
|
+
fontWeight: "heading",
|
|
1599
|
+
lineHeight: "heading"
|
|
1600
|
+
},
|
|
1601
|
+
body: {
|
|
1602
|
+
fontFamily: "body",
|
|
1603
|
+
fontWeight: "body",
|
|
1604
|
+
lineHeight: "body"
|
|
1605
|
+
},
|
|
1606
|
+
caption: {
|
|
1607
|
+
fontSize: 1,
|
|
1608
|
+
color: "textSecondary"
|
|
1609
|
+
}
|
|
1610
|
+
},
|
|
1611
|
+
cards: {
|
|
1612
|
+
primary: {
|
|
1613
|
+
bg: "surface",
|
|
1614
|
+
border: "1px solid",
|
|
1615
|
+
borderColor: "border",
|
|
1616
|
+
borderRadius: 0
|
|
1617
|
+
},
|
|
1618
|
+
secondary: {
|
|
1619
|
+
bg: "backgroundSecondary",
|
|
1620
|
+
border: "1px solid",
|
|
1621
|
+
borderColor: "border",
|
|
1622
|
+
borderRadius: 0
|
|
1623
|
+
}
|
|
1624
|
+
}
|
|
1625
|
+
};
|
|
1626
|
+
var slateTheme = {
|
|
1627
|
+
space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
|
|
1628
|
+
fonts: {
|
|
1629
|
+
body: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
1630
|
+
heading: '"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
1631
|
+
monospace: '"Fira Code", "SF Mono", Monaco, Inconsolata, monospace'
|
|
1632
|
+
},
|
|
1633
|
+
fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
|
|
1634
|
+
fontScale: 1,
|
|
1635
|
+
fontWeights: {
|
|
1636
|
+
body: 400,
|
|
1637
|
+
heading: 600,
|
|
1638
|
+
bold: 700,
|
|
1639
|
+
light: 300,
|
|
1640
|
+
medium: 500,
|
|
1641
|
+
semibold: 600
|
|
1642
|
+
},
|
|
1643
|
+
lineHeights: {
|
|
1644
|
+
body: 1.6,
|
|
1645
|
+
heading: 1.3,
|
|
1646
|
+
tight: 1.25,
|
|
1647
|
+
relaxed: 1.75
|
|
1648
|
+
},
|
|
1649
|
+
breakpoints: ["640px", "768px", "1024px", "1280px"],
|
|
1650
|
+
sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
|
|
1651
|
+
radii: [0, 2, 4, 6, 8, 12, 16, 24],
|
|
1652
|
+
shadows: [
|
|
1653
|
+
"none",
|
|
1654
|
+
"0 1px 3px 0 rgba(0, 0, 0, 0.2)",
|
|
1655
|
+
"0 4px 6px -1px rgba(0, 0, 0, 0.2)",
|
|
1656
|
+
"0 10px 15px -3px rgba(0, 0, 0, 0.2)",
|
|
1657
|
+
"0 20px 25px -5px rgba(0, 0, 0, 0.25)",
|
|
1658
|
+
"0 25px 50px -12px rgba(0, 0, 0, 0.3)"
|
|
1659
|
+
],
|
|
1660
|
+
zIndices: [0, 1, 10, 20, 30, 40, 50],
|
|
1661
|
+
colors: {
|
|
1662
|
+
text: "#9ca3af",
|
|
1663
|
+
background: "#1a1c1e",
|
|
1664
|
+
primary: "#d1d5db",
|
|
1665
|
+
secondary: "#6b7280",
|
|
1666
|
+
accent: "#f59e0b",
|
|
1667
|
+
highlight: "rgba(209, 213, 219, 0.15)",
|
|
1668
|
+
muted: "#2d3134",
|
|
1669
|
+
success: "#10b981",
|
|
1670
|
+
warning: "#f59e0b",
|
|
1671
|
+
error: "#ef4444",
|
|
1672
|
+
info: "#3b82f6",
|
|
1673
|
+
border: "rgba(156, 163, 175, 0.15)",
|
|
1674
|
+
backgroundSecondary: "#22252a",
|
|
1675
|
+
backgroundTertiary: "#2d3134",
|
|
1676
|
+
backgroundLight: "rgba(156, 163, 175, 0.05)",
|
|
1677
|
+
backgroundHover: "rgba(156, 163, 175, 0.1)",
|
|
1678
|
+
surface: "#1f2124",
|
|
1679
|
+
textSecondary: "#e5e7eb",
|
|
1680
|
+
textTertiary: "#6b7280",
|
|
1681
|
+
textMuted: "#4b5563",
|
|
1682
|
+
highlightBg: "rgba(245, 158, 11, 0.25)",
|
|
1683
|
+
highlightBorder: "rgba(245, 158, 11, 0.5)"
|
|
1684
|
+
},
|
|
1685
|
+
buttons: {
|
|
1686
|
+
primary: {
|
|
1687
|
+
color: "#1a1c1e",
|
|
1688
|
+
bg: "primary",
|
|
1689
|
+
borderWidth: 0,
|
|
1690
|
+
"&:hover": {
|
|
1691
|
+
bg: "#9ca3af"
|
|
1692
|
+
}
|
|
1693
|
+
},
|
|
1694
|
+
secondary: {
|
|
1695
|
+
color: "#e5e7eb",
|
|
1696
|
+
bg: "secondary",
|
|
1697
|
+
borderWidth: 0,
|
|
1698
|
+
"&:hover": {
|
|
1699
|
+
bg: "#4b5563"
|
|
1700
|
+
}
|
|
1701
|
+
},
|
|
1702
|
+
ghost: {
|
|
1703
|
+
color: "textSecondary",
|
|
1704
|
+
bg: "transparent",
|
|
1705
|
+
"&:hover": {
|
|
1706
|
+
bg: "backgroundHover"
|
|
1707
|
+
}
|
|
1708
|
+
}
|
|
1709
|
+
},
|
|
1710
|
+
text: {
|
|
1711
|
+
heading: {
|
|
1712
|
+
fontFamily: "heading",
|
|
1713
|
+
fontWeight: "heading",
|
|
1714
|
+
lineHeight: "heading",
|
|
1715
|
+
color: "textSecondary"
|
|
1716
|
+
},
|
|
1717
|
+
body: {
|
|
1718
|
+
fontFamily: "body",
|
|
1719
|
+
fontWeight: "body",
|
|
1720
|
+
lineHeight: "body"
|
|
1721
|
+
},
|
|
1722
|
+
caption: {
|
|
1723
|
+
fontSize: 1,
|
|
1724
|
+
color: "textTertiary"
|
|
1725
|
+
}
|
|
1726
|
+
},
|
|
1727
|
+
cards: {
|
|
1728
|
+
primary: {
|
|
1729
|
+
bg: "surface",
|
|
1730
|
+
border: "1px solid",
|
|
1731
|
+
borderColor: "border",
|
|
1732
|
+
borderRadius: 3
|
|
1733
|
+
},
|
|
1734
|
+
secondary: {
|
|
1735
|
+
bg: "backgroundSecondary",
|
|
1736
|
+
border: "1px solid",
|
|
1737
|
+
borderColor: "border",
|
|
1738
|
+
borderRadius: 3
|
|
1739
|
+
}
|
|
1740
|
+
}
|
|
1741
|
+
};
|
|
1742
|
+
function overrideColors(theme2, colors) {
|
|
1743
|
+
return {
|
|
1744
|
+
...theme2,
|
|
1745
|
+
colors: {
|
|
1746
|
+
...theme2.colors,
|
|
1747
|
+
...colors
|
|
1748
|
+
}
|
|
1749
|
+
};
|
|
1750
|
+
}
|
|
1751
|
+
function makeTheme(baseTheme, overrides) {
|
|
1752
|
+
return {
|
|
1753
|
+
...baseTheme,
|
|
1754
|
+
...overrides,
|
|
1755
|
+
colors: {
|
|
1756
|
+
...baseTheme.colors,
|
|
1757
|
+
...overrides.colors
|
|
1758
|
+
},
|
|
1759
|
+
fonts: {
|
|
1760
|
+
...baseTheme.fonts,
|
|
1761
|
+
...overrides.fonts
|
|
1762
|
+
}
|
|
1763
|
+
};
|
|
1764
|
+
}
|
|
1765
|
+
function addMode(theme2, modeName, colors, baseMode) {
|
|
1766
|
+
let baseColors;
|
|
1767
|
+
if (baseMode && theme2.modes && theme2.modes[baseMode]) {
|
|
1768
|
+
baseColors = {
|
|
1769
|
+
...theme2.colors,
|
|
1770
|
+
...theme2.modes[baseMode]
|
|
1771
|
+
};
|
|
1772
|
+
} else {
|
|
1773
|
+
baseColors = theme2.colors;
|
|
1774
|
+
}
|
|
1775
|
+
const newMode = {
|
|
1776
|
+
...baseColors,
|
|
1777
|
+
...colors
|
|
1778
|
+
};
|
|
1779
|
+
return {
|
|
1780
|
+
...theme2,
|
|
1781
|
+
modes: {
|
|
1782
|
+
...theme2.modes,
|
|
1783
|
+
[modeName]: newMode
|
|
1784
|
+
}
|
|
1785
|
+
};
|
|
1786
|
+
}
|
|
1787
|
+
function getMode(theme2, mode) {
|
|
1788
|
+
if (!mode || !theme2.modes || !theme2.modes[mode]) {
|
|
1789
|
+
return theme2.colors;
|
|
1790
|
+
}
|
|
1791
|
+
return {
|
|
1792
|
+
...theme2.colors,
|
|
1793
|
+
...theme2.modes[mode]
|
|
1794
|
+
};
|
|
1795
|
+
}
|
|
1796
|
+
var ThemeContext;
|
|
1797
|
+
var getThemeContext = () => {
|
|
1798
|
+
if (typeof window !== "undefined") {
|
|
1799
|
+
const globalWindow = window;
|
|
1800
|
+
if (!globalWindow.__principlemd_theme_context__) {
|
|
1801
|
+
globalWindow.__principlemd_theme_context__ = createContext(void 0);
|
|
1802
|
+
}
|
|
1803
|
+
return globalWindow.__principlemd_theme_context__;
|
|
1804
|
+
} else {
|
|
1805
|
+
if (!ThemeContext) {
|
|
1806
|
+
ThemeContext = createContext(void 0);
|
|
1807
|
+
}
|
|
1808
|
+
return ThemeContext;
|
|
1809
|
+
}
|
|
1810
|
+
};
|
|
1811
|
+
var ThemeContextSingleton = getThemeContext();
|
|
1812
|
+
var useTheme = () => {
|
|
1813
|
+
const context = useContext(ThemeContextSingleton);
|
|
1814
|
+
if (!context) {
|
|
1815
|
+
throw new Error("useTheme must be used within a ThemeProvider");
|
|
1816
|
+
}
|
|
1817
|
+
return context;
|
|
1818
|
+
};
|
|
1819
|
+
var ThemeProvider = ({
|
|
1820
|
+
children: children2,
|
|
1821
|
+
theme: customTheme = theme,
|
|
1822
|
+
initialMode
|
|
1823
|
+
}) => {
|
|
1824
|
+
const [mode, setMode] = useState(initialMode);
|
|
1825
|
+
const activeTheme = React.useMemo(() => {
|
|
1826
|
+
if (!mode || !customTheme.modes || !customTheme.modes[mode]) {
|
|
1827
|
+
return customTheme;
|
|
1828
|
+
}
|
|
1829
|
+
return {
|
|
1830
|
+
...customTheme,
|
|
1831
|
+
colors: getMode(customTheme, mode)
|
|
1832
|
+
};
|
|
1833
|
+
}, [customTheme, mode]);
|
|
1834
|
+
useEffect(() => {
|
|
1835
|
+
if (!initialMode) {
|
|
1836
|
+
const savedMode = localStorage.getItem("principlemd-theme-mode");
|
|
1837
|
+
if (savedMode) {
|
|
1838
|
+
setMode(savedMode);
|
|
1839
|
+
}
|
|
1840
|
+
}
|
|
1841
|
+
}, [initialMode]);
|
|
1842
|
+
useEffect(() => {
|
|
1843
|
+
if (mode) {
|
|
1844
|
+
localStorage.setItem("principlemd-theme-mode", mode);
|
|
1845
|
+
} else {
|
|
1846
|
+
localStorage.removeItem("principlemd-theme-mode");
|
|
1847
|
+
}
|
|
1848
|
+
}, [mode]);
|
|
1849
|
+
const value = {
|
|
1850
|
+
theme: activeTheme,
|
|
1851
|
+
mode,
|
|
1852
|
+
setMode
|
|
1853
|
+
};
|
|
1854
|
+
return /* @__PURE__ */ React.createElement(ThemeContextSingleton.Provider, {
|
|
1855
|
+
value
|
|
1856
|
+
}, children2);
|
|
1857
|
+
};
|
|
1858
|
+
var withTheme = (Component) => {
|
|
1859
|
+
return (props) => {
|
|
1860
|
+
const { theme: theme2 } = useTheme();
|
|
1861
|
+
return /* @__PURE__ */ React.createElement(Component, {
|
|
1862
|
+
...props,
|
|
1863
|
+
theme: theme2
|
|
1864
|
+
});
|
|
1865
|
+
};
|
|
1866
|
+
};
|
|
1867
|
+
var getColor = (theme2, colorKey) => {
|
|
1868
|
+
const colors = theme2.colors;
|
|
1869
|
+
const value = colors[colorKey];
|
|
1870
|
+
return typeof value === "string" ? value : colorKey;
|
|
1871
|
+
};
|
|
1872
|
+
var getSpace = (theme2, index) => {
|
|
1873
|
+
return theme2.space[index] || 0;
|
|
1874
|
+
};
|
|
1875
|
+
var getFontSize = (theme2, index) => {
|
|
1876
|
+
return theme2.fontSizes[index] || theme2.fontSizes[2];
|
|
1877
|
+
};
|
|
1878
|
+
var getRadius = (theme2, index) => {
|
|
1879
|
+
return theme2.radii[index] || 0;
|
|
1880
|
+
};
|
|
1881
|
+
var getShadow = (theme2, index) => {
|
|
1882
|
+
return theme2.shadows[index] || "none";
|
|
1883
|
+
};
|
|
1884
|
+
var getZIndex = (theme2, index) => {
|
|
1885
|
+
return theme2.zIndices[index] || 0;
|
|
1886
|
+
};
|
|
1887
|
+
var responsive = (values) => {
|
|
1888
|
+
return values.reduce((acc, value, index) => {
|
|
1889
|
+
if (index === 0) {
|
|
1890
|
+
return value;
|
|
1891
|
+
}
|
|
1892
|
+
return {
|
|
1893
|
+
...acc,
|
|
1894
|
+
[`@media screen and (min-width: ${values[index - 1]})`]: value
|
|
1895
|
+
};
|
|
1896
|
+
}, {});
|
|
1897
|
+
};
|
|
1898
|
+
var sx = (styles) => styles;
|
|
1899
|
+
var createStyle = (theme2, styleObj) => {
|
|
1900
|
+
const processValue = (value) => {
|
|
1901
|
+
if (typeof value === "string") {
|
|
1902
|
+
if (value in theme2.colors) {
|
|
1903
|
+
return getColor(theme2, value);
|
|
1904
|
+
}
|
|
1905
|
+
return value;
|
|
1906
|
+
}
|
|
1907
|
+
if (typeof value === "number") {
|
|
1908
|
+
return value;
|
|
1909
|
+
}
|
|
1910
|
+
if (Array.isArray(value)) {
|
|
1911
|
+
return value.map(processValue);
|
|
1912
|
+
}
|
|
1913
|
+
if (typeof value === "object" && value !== null) {
|
|
1914
|
+
const processed2 = {};
|
|
1915
|
+
for (const [key, val] of Object.entries(value)) {
|
|
1916
|
+
processed2[key] = processValue(val);
|
|
1917
|
+
}
|
|
1918
|
+
return processed2;
|
|
1919
|
+
}
|
|
1920
|
+
return value;
|
|
1921
|
+
};
|
|
1922
|
+
const processed = {};
|
|
1923
|
+
for (const [key, val] of Object.entries(styleObj)) {
|
|
1924
|
+
processed[key] = processValue(val);
|
|
1925
|
+
}
|
|
1926
|
+
return processed;
|
|
1927
|
+
};
|
|
1928
|
+
var mergeThemes = (baseTheme, ...overrides) => {
|
|
1929
|
+
return overrides.reduce((theme2, override) => ({
|
|
1930
|
+
space: override.space || theme2.space,
|
|
1931
|
+
fonts: { ...theme2.fonts, ...override.fonts || {} },
|
|
1932
|
+
fontSizes: override.fontSizes || theme2.fontSizes,
|
|
1933
|
+
fontWeights: { ...theme2.fontWeights, ...override.fontWeights || {} },
|
|
1934
|
+
lineHeights: { ...theme2.lineHeights, ...override.lineHeights || {} },
|
|
1935
|
+
breakpoints: override.breakpoints || theme2.breakpoints,
|
|
1936
|
+
sizes: override.sizes || theme2.sizes,
|
|
1937
|
+
radii: override.radii || theme2.radii,
|
|
1938
|
+
shadows: override.shadows || theme2.shadows,
|
|
1939
|
+
zIndices: override.zIndices || theme2.zIndices,
|
|
1940
|
+
colors: {
|
|
1941
|
+
...theme2.colors,
|
|
1942
|
+
...override.colors || {}
|
|
1943
|
+
},
|
|
1944
|
+
buttons: { ...theme2.buttons, ...override.buttons || {} },
|
|
1945
|
+
text: { ...theme2.text, ...override.text || {} },
|
|
1946
|
+
cards: { ...theme2.cards, ...override.cards || {} }
|
|
1947
|
+
}), baseTheme);
|
|
1948
|
+
};
|
|
1949
|
+
var ThemeShowcase = ({
|
|
1950
|
+
theme: theme2,
|
|
1951
|
+
title,
|
|
1952
|
+
showValues = true,
|
|
1953
|
+
sections = ["colors", "typography", "spacing", "shadows", "radii"]
|
|
1954
|
+
}) => {
|
|
1955
|
+
const containerStyle2 = {
|
|
1956
|
+
fontFamily: theme2.fonts.body,
|
|
1957
|
+
color: theme2.colors.text,
|
|
1958
|
+
backgroundColor: theme2.colors.background,
|
|
1959
|
+
padding: theme2.space[4],
|
|
1960
|
+
minHeight: "100vh"
|
|
1961
|
+
};
|
|
1962
|
+
const sectionStyle = {
|
|
1963
|
+
marginBottom: theme2.space[5],
|
|
1964
|
+
padding: theme2.space[4],
|
|
1965
|
+
backgroundColor: theme2.colors.surface || theme2.colors.backgroundSecondary,
|
|
1966
|
+
borderRadius: theme2.radii[2],
|
|
1967
|
+
border: `1px solid ${theme2.colors.border}`
|
|
1968
|
+
};
|
|
1969
|
+
const headingStyle = {
|
|
1970
|
+
fontFamily: theme2.fonts.heading,
|
|
1971
|
+
fontSize: theme2.fontSizes[5],
|
|
1972
|
+
fontWeight: theme2.fontWeights.heading,
|
|
1973
|
+
marginBottom: theme2.space[3],
|
|
1974
|
+
color: theme2.colors.primary
|
|
1975
|
+
};
|
|
1976
|
+
const subheadingStyle = {
|
|
1977
|
+
fontFamily: theme2.fonts.heading,
|
|
1978
|
+
fontSize: theme2.fontSizes[3],
|
|
1979
|
+
fontWeight: theme2.fontWeights.medium,
|
|
1980
|
+
marginBottom: theme2.space[2],
|
|
1981
|
+
marginTop: theme2.space[3],
|
|
1982
|
+
color: theme2.colors.text
|
|
1983
|
+
};
|
|
1984
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1985
|
+
style: containerStyle2
|
|
1986
|
+
}, title && /* @__PURE__ */ React.createElement("h1", {
|
|
1987
|
+
style: {
|
|
1988
|
+
...headingStyle,
|
|
1989
|
+
fontSize: theme2.fontSizes[6],
|
|
1990
|
+
marginBottom: theme2.space[4]
|
|
1991
|
+
}
|
|
1992
|
+
}, title), sections.includes("colors") && /* @__PURE__ */ React.createElement("div", {
|
|
1993
|
+
style: sectionStyle
|
|
1994
|
+
}, /* @__PURE__ */ React.createElement("h2", {
|
|
1995
|
+
style: headingStyle
|
|
1996
|
+
}, "Colors"), /* @__PURE__ */ React.createElement("h3", {
|
|
1997
|
+
style: subheadingStyle
|
|
1998
|
+
}, "Primary Colors"), /* @__PURE__ */ React.createElement("div", {
|
|
1999
|
+
style: {
|
|
2000
|
+
display: "grid",
|
|
2001
|
+
gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))",
|
|
2002
|
+
gap: theme2.space[3],
|
|
2003
|
+
marginBottom: theme2.space[3]
|
|
2004
|
+
}
|
|
2005
|
+
}, ["text", "background", "primary", "secondary", "accent", "muted"].map((key) => {
|
|
2006
|
+
const color2 = theme2.colors[key];
|
|
2007
|
+
if (!color2)
|
|
2008
|
+
return null;
|
|
2009
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
2010
|
+
key,
|
|
2011
|
+
style: {
|
|
2012
|
+
display: "flex",
|
|
2013
|
+
alignItems: "center",
|
|
2014
|
+
padding: theme2.space[2],
|
|
2015
|
+
backgroundColor: theme2.colors.backgroundLight || theme2.colors.backgroundTertiary,
|
|
2016
|
+
borderRadius: theme2.radii[1]
|
|
2017
|
+
}
|
|
2018
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2019
|
+
style: {
|
|
2020
|
+
width: 40,
|
|
2021
|
+
height: 40,
|
|
2022
|
+
backgroundColor: color2,
|
|
2023
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
2024
|
+
borderRadius: theme2.radii[1],
|
|
2025
|
+
marginRight: theme2.space[2]
|
|
2026
|
+
}
|
|
2027
|
+
}), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", {
|
|
2028
|
+
style: {
|
|
2029
|
+
fontFamily: theme2.fonts.monospace,
|
|
2030
|
+
fontSize: theme2.fontSizes[1],
|
|
2031
|
+
fontWeight: theme2.fontWeights.medium
|
|
2032
|
+
}
|
|
2033
|
+
}, key), showValues && /* @__PURE__ */ React.createElement("div", {
|
|
2034
|
+
style: {
|
|
2035
|
+
fontFamily: theme2.fonts.monospace,
|
|
2036
|
+
fontSize: theme2.fontSizes[0],
|
|
2037
|
+
color: theme2.colors.textSecondary
|
|
2038
|
+
}
|
|
2039
|
+
}, color2)));
|
|
2040
|
+
})), /* @__PURE__ */ React.createElement("h3", {
|
|
2041
|
+
style: subheadingStyle
|
|
2042
|
+
}, "Status Colors"), /* @__PURE__ */ React.createElement("div", {
|
|
2043
|
+
style: {
|
|
2044
|
+
display: "grid",
|
|
2045
|
+
gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))",
|
|
2046
|
+
gap: theme2.space[3],
|
|
2047
|
+
marginBottom: theme2.space[3]
|
|
2048
|
+
}
|
|
2049
|
+
}, ["success", "warning", "error", "info"].map((key) => {
|
|
2050
|
+
const color2 = theme2.colors[key];
|
|
2051
|
+
if (!color2)
|
|
2052
|
+
return null;
|
|
2053
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
2054
|
+
key,
|
|
2055
|
+
style: {
|
|
2056
|
+
display: "flex",
|
|
2057
|
+
alignItems: "center",
|
|
2058
|
+
padding: theme2.space[2],
|
|
2059
|
+
backgroundColor: theme2.colors.backgroundLight || theme2.colors.backgroundTertiary,
|
|
2060
|
+
borderRadius: theme2.radii[1]
|
|
2061
|
+
}
|
|
2062
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2063
|
+
style: {
|
|
2064
|
+
width: 40,
|
|
2065
|
+
height: 40,
|
|
2066
|
+
backgroundColor: color2,
|
|
2067
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
2068
|
+
borderRadius: theme2.radii[1],
|
|
2069
|
+
marginRight: theme2.space[2]
|
|
2070
|
+
}
|
|
2071
|
+
}), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", {
|
|
2072
|
+
style: {
|
|
2073
|
+
fontFamily: theme2.fonts.monospace,
|
|
2074
|
+
fontSize: theme2.fontSizes[1],
|
|
2075
|
+
fontWeight: theme2.fontWeights.medium
|
|
2076
|
+
}
|
|
2077
|
+
}, key), showValues && /* @__PURE__ */ React.createElement("div", {
|
|
2078
|
+
style: {
|
|
2079
|
+
fontFamily: theme2.fonts.monospace,
|
|
2080
|
+
fontSize: theme2.fontSizes[0],
|
|
2081
|
+
color: theme2.colors.textSecondary
|
|
2082
|
+
}
|
|
2083
|
+
}, color2)));
|
|
2084
|
+
})), /* @__PURE__ */ React.createElement("h3", {
|
|
2085
|
+
style: subheadingStyle
|
|
2086
|
+
}, "Background Colors"), /* @__PURE__ */ React.createElement("div", {
|
|
2087
|
+
style: {
|
|
2088
|
+
display: "grid",
|
|
2089
|
+
gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))",
|
|
2090
|
+
gap: theme2.space[3]
|
|
2091
|
+
}
|
|
2092
|
+
}, ["backgroundSecondary", "backgroundTertiary", "backgroundLight", "backgroundHover", "surface"].map((key) => {
|
|
2093
|
+
const color2 = theme2.colors[key];
|
|
2094
|
+
if (!color2)
|
|
2095
|
+
return null;
|
|
2096
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
2097
|
+
key,
|
|
2098
|
+
style: {
|
|
2099
|
+
padding: theme2.space[3],
|
|
2100
|
+
backgroundColor: color2,
|
|
2101
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
2102
|
+
borderRadius: theme2.radii[1]
|
|
2103
|
+
}
|
|
2104
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2105
|
+
style: {
|
|
2106
|
+
fontFamily: theme2.fonts.monospace,
|
|
2107
|
+
fontSize: theme2.fontSizes[1],
|
|
2108
|
+
fontWeight: theme2.fontWeights.medium
|
|
2109
|
+
}
|
|
2110
|
+
}, key), showValues && /* @__PURE__ */ React.createElement("div", {
|
|
2111
|
+
style: {
|
|
2112
|
+
fontFamily: theme2.fonts.monospace,
|
|
2113
|
+
fontSize: theme2.fontSizes[0],
|
|
2114
|
+
color: theme2.colors.textSecondary,
|
|
2115
|
+
marginTop: theme2.space[1]
|
|
2116
|
+
}
|
|
2117
|
+
}, color2));
|
|
2118
|
+
}))), sections.includes("typography") && /* @__PURE__ */ React.createElement("div", {
|
|
2119
|
+
style: sectionStyle
|
|
2120
|
+
}, /* @__PURE__ */ React.createElement("h2", {
|
|
2121
|
+
style: headingStyle
|
|
2122
|
+
}, "Typography"), /* @__PURE__ */ React.createElement("h3", {
|
|
2123
|
+
style: subheadingStyle
|
|
2124
|
+
}, "Font Families"), /* @__PURE__ */ React.createElement("div", {
|
|
2125
|
+
style: { marginBottom: theme2.space[4] }
|
|
2126
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2127
|
+
style: {
|
|
2128
|
+
fontFamily: theme2.fonts.heading,
|
|
2129
|
+
fontSize: theme2.fontSizes[4],
|
|
2130
|
+
marginBottom: theme2.space[2]
|
|
2131
|
+
}
|
|
2132
|
+
}, "Heading Font: ", showValues && /* @__PURE__ */ React.createElement("span", {
|
|
2133
|
+
style: {
|
|
2134
|
+
fontFamily: theme2.fonts.monospace,
|
|
2135
|
+
fontSize: theme2.fontSizes[1],
|
|
2136
|
+
color: theme2.colors.textSecondary
|
|
2137
|
+
}
|
|
2138
|
+
}, " ", theme2.fonts.heading)), /* @__PURE__ */ React.createElement("div", {
|
|
2139
|
+
style: {
|
|
2140
|
+
fontFamily: theme2.fonts.body,
|
|
2141
|
+
fontSize: theme2.fontSizes[2],
|
|
2142
|
+
marginBottom: theme2.space[2]
|
|
2143
|
+
}
|
|
2144
|
+
}, "Body Font: ", showValues && /* @__PURE__ */ React.createElement("span", {
|
|
2145
|
+
style: {
|
|
2146
|
+
fontFamily: theme2.fonts.monospace,
|
|
2147
|
+
fontSize: theme2.fontSizes[1],
|
|
2148
|
+
color: theme2.colors.textSecondary
|
|
2149
|
+
}
|
|
2150
|
+
}, " ", theme2.fonts.body)), /* @__PURE__ */ React.createElement("div", {
|
|
2151
|
+
style: {
|
|
2152
|
+
fontFamily: theme2.fonts.monospace,
|
|
2153
|
+
fontSize: theme2.fontSizes[2]
|
|
2154
|
+
}
|
|
2155
|
+
}, "Monospace Font: ", showValues && /* @__PURE__ */ React.createElement("span", {
|
|
2156
|
+
style: {
|
|
2157
|
+
fontSize: theme2.fontSizes[1],
|
|
2158
|
+
color: theme2.colors.textSecondary
|
|
2159
|
+
}
|
|
2160
|
+
}, " ", theme2.fonts.monospace))), /* @__PURE__ */ React.createElement("h3", {
|
|
2161
|
+
style: subheadingStyle
|
|
2162
|
+
}, "Font Sizes"), /* @__PURE__ */ React.createElement("div", {
|
|
2163
|
+
style: { marginBottom: theme2.space[4] }
|
|
2164
|
+
}, theme2.fontSizes.map((size, index) => /* @__PURE__ */ React.createElement("div", {
|
|
2165
|
+
key: index,
|
|
2166
|
+
style: {
|
|
2167
|
+
fontSize: size,
|
|
2168
|
+
lineHeight: theme2.lineHeights.body,
|
|
2169
|
+
marginBottom: theme2.space[1]
|
|
2170
|
+
}
|
|
2171
|
+
}, "Size ", index, ": Sample Text ", showValues && `(${size}px)`))), /* @__PURE__ */ React.createElement("h3", {
|
|
2172
|
+
style: subheadingStyle
|
|
2173
|
+
}, "Font Weights"), /* @__PURE__ */ React.createElement("div", {
|
|
2174
|
+
style: {
|
|
2175
|
+
display: "grid",
|
|
2176
|
+
gridTemplateColumns: "repeat(auto-fit, minmax(150px, 1fr))",
|
|
2177
|
+
gap: theme2.space[2]
|
|
2178
|
+
}
|
|
2179
|
+
}, Object.entries(theme2.fontWeights).map(([name, weight]) => /* @__PURE__ */ React.createElement("div", {
|
|
2180
|
+
key: name,
|
|
2181
|
+
style: {
|
|
2182
|
+
fontWeight: weight,
|
|
2183
|
+
fontSize: theme2.fontSizes[2]
|
|
2184
|
+
}
|
|
2185
|
+
}, name, " ", showValues && `(${weight})`)))), sections.includes("spacing") && /* @__PURE__ */ React.createElement("div", {
|
|
2186
|
+
style: sectionStyle
|
|
2187
|
+
}, /* @__PURE__ */ React.createElement("h2", {
|
|
2188
|
+
style: headingStyle
|
|
2189
|
+
}, "Spacing"), /* @__PURE__ */ React.createElement("div", {
|
|
2190
|
+
style: { display: "flex", flexDirection: "column", gap: theme2.space[2] }
|
|
2191
|
+
}, theme2.space.map((space, index) => /* @__PURE__ */ React.createElement("div", {
|
|
2192
|
+
key: index,
|
|
2193
|
+
style: { display: "flex", alignItems: "center" }
|
|
2194
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2195
|
+
style: {
|
|
2196
|
+
width: 60,
|
|
2197
|
+
fontFamily: theme2.fonts.monospace,
|
|
2198
|
+
fontSize: theme2.fontSizes[1],
|
|
2199
|
+
color: theme2.colors.textSecondary
|
|
2200
|
+
}
|
|
2201
|
+
}, "[", index, "]"), /* @__PURE__ */ React.createElement("div", {
|
|
2202
|
+
style: {
|
|
2203
|
+
height: 24,
|
|
2204
|
+
width: space,
|
|
2205
|
+
backgroundColor: theme2.colors.primary,
|
|
2206
|
+
borderRadius: theme2.radii[1]
|
|
2207
|
+
}
|
|
2208
|
+
}), showValues && /* @__PURE__ */ React.createElement("div", {
|
|
2209
|
+
style: {
|
|
2210
|
+
marginLeft: theme2.space[2],
|
|
2211
|
+
fontFamily: theme2.fonts.monospace,
|
|
2212
|
+
fontSize: theme2.fontSizes[1],
|
|
2213
|
+
color: theme2.colors.textSecondary
|
|
2214
|
+
}
|
|
2215
|
+
}, space, "px"))))), sections.includes("radii") && /* @__PURE__ */ React.createElement("div", {
|
|
2216
|
+
style: sectionStyle
|
|
2217
|
+
}, /* @__PURE__ */ React.createElement("h2", {
|
|
2218
|
+
style: headingStyle
|
|
2219
|
+
}, "Border Radii"), /* @__PURE__ */ React.createElement("div", {
|
|
2220
|
+
style: {
|
|
2221
|
+
display: "grid",
|
|
2222
|
+
gridTemplateColumns: "repeat(auto-fill, minmax(100px, 1fr))",
|
|
2223
|
+
gap: theme2.space[3]
|
|
2224
|
+
}
|
|
2225
|
+
}, theme2.radii.map((radius, index) => /* @__PURE__ */ React.createElement("div", {
|
|
2226
|
+
key: index,
|
|
2227
|
+
style: { textAlign: "center" }
|
|
2228
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2229
|
+
style: {
|
|
2230
|
+
width: 80,
|
|
2231
|
+
height: 80,
|
|
2232
|
+
backgroundColor: theme2.colors.primary,
|
|
2233
|
+
borderRadius: radius,
|
|
2234
|
+
marginBottom: theme2.space[1],
|
|
2235
|
+
margin: "0 auto"
|
|
2236
|
+
}
|
|
2237
|
+
}), /* @__PURE__ */ React.createElement("div", {
|
|
2238
|
+
style: {
|
|
2239
|
+
fontFamily: theme2.fonts.monospace,
|
|
2240
|
+
fontSize: theme2.fontSizes[0],
|
|
2241
|
+
color: theme2.colors.textSecondary
|
|
2242
|
+
}
|
|
2243
|
+
}, "[", index, "] ", showValues && `${radius}px`))))), sections.includes("shadows") && /* @__PURE__ */ React.createElement("div", {
|
|
2244
|
+
style: sectionStyle
|
|
2245
|
+
}, /* @__PURE__ */ React.createElement("h2", {
|
|
2246
|
+
style: headingStyle
|
|
2247
|
+
}, "Shadows"), /* @__PURE__ */ React.createElement("div", {
|
|
2248
|
+
style: {
|
|
2249
|
+
display: "grid",
|
|
2250
|
+
gridTemplateColumns: "repeat(auto-fill, minmax(150px, 1fr))",
|
|
2251
|
+
gap: theme2.space[4]
|
|
2252
|
+
}
|
|
2253
|
+
}, theme2.shadows.map((shadow, index) => /* @__PURE__ */ React.createElement("div", {
|
|
2254
|
+
key: index,
|
|
2255
|
+
style: { textAlign: "center" }
|
|
2256
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2257
|
+
style: {
|
|
2258
|
+
width: 100,
|
|
2259
|
+
height: 100,
|
|
2260
|
+
backgroundColor: theme2.colors.background,
|
|
2261
|
+
boxShadow: shadow,
|
|
2262
|
+
borderRadius: theme2.radii[2],
|
|
2263
|
+
margin: "0 auto",
|
|
2264
|
+
marginBottom: theme2.space[2],
|
|
2265
|
+
border: `1px solid ${theme2.colors.border}`
|
|
2266
|
+
}
|
|
2267
|
+
}), /* @__PURE__ */ React.createElement("div", {
|
|
2268
|
+
style: {
|
|
2269
|
+
fontFamily: theme2.fonts.monospace,
|
|
2270
|
+
fontSize: theme2.fontSizes[0],
|
|
2271
|
+
color: theme2.colors.textSecondary
|
|
2272
|
+
}
|
|
2273
|
+
}, "Shadow [", index, "]"), showValues && /* @__PURE__ */ React.createElement("div", {
|
|
2274
|
+
style: {
|
|
2275
|
+
fontFamily: theme2.fonts.monospace,
|
|
2276
|
+
fontSize: theme2.fontSizes[0],
|
|
2277
|
+
color: theme2.colors.textMuted,
|
|
2278
|
+
marginTop: theme2.space[1]
|
|
2279
|
+
}
|
|
2280
|
+
}, shadow === "none" ? "none" : "..."))))), theme2.modes && Object.keys(theme2.modes).length > 0 && /* @__PURE__ */ React.createElement("div", {
|
|
2281
|
+
style: sectionStyle
|
|
2282
|
+
}, /* @__PURE__ */ React.createElement("h2", {
|
|
2283
|
+
style: headingStyle
|
|
2284
|
+
}, "Available Modes"), /* @__PURE__ */ React.createElement("div", {
|
|
2285
|
+
style: {
|
|
2286
|
+
display: "flex",
|
|
2287
|
+
gap: theme2.space[2],
|
|
2288
|
+
flexWrap: "wrap"
|
|
2289
|
+
}
|
|
2290
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
2291
|
+
style: {
|
|
2292
|
+
padding: `${theme2.space[2]}px ${theme2.space[3]}px`,
|
|
2293
|
+
backgroundColor: theme2.colors.primary,
|
|
2294
|
+
color: "#ffffff",
|
|
2295
|
+
borderRadius: theme2.radii[2],
|
|
2296
|
+
fontFamily: theme2.fonts.body,
|
|
2297
|
+
fontSize: theme2.fontSizes[1]
|
|
2298
|
+
}
|
|
2299
|
+
}, "default"), Object.keys(theme2.modes).map((modeName) => /* @__PURE__ */ React.createElement("div", {
|
|
2300
|
+
key: modeName,
|
|
2301
|
+
style: {
|
|
2302
|
+
padding: `${theme2.space[2]}px ${theme2.space[3]}px`,
|
|
2303
|
+
backgroundColor: theme2.colors.secondary,
|
|
2304
|
+
color: theme2.colors.text,
|
|
2305
|
+
borderRadius: theme2.radii[2],
|
|
2306
|
+
fontFamily: theme2.fonts.body,
|
|
2307
|
+
fontSize: theme2.fontSizes[1]
|
|
2308
|
+
}
|
|
2309
|
+
}, modeName)))));
|
|
2310
|
+
};
|
|
2311
|
+
var theme = terminalTheme;
|
|
2312
|
+
function scaleThemeFonts(theme2, scale) {
|
|
2313
|
+
const currentScale = theme2.fontScale || 1;
|
|
2314
|
+
const effectiveScale = scale / currentScale;
|
|
2315
|
+
return {
|
|
2316
|
+
...theme2,
|
|
2317
|
+
fontSizes: theme2.fontSizes.map((size) => Math.round(size * effectiveScale)),
|
|
2318
|
+
fontScale: scale
|
|
2319
|
+
};
|
|
2320
|
+
}
|
|
2321
|
+
function increaseFontScale(theme2) {
|
|
2322
|
+
const currentScale = theme2.fontScale || 1;
|
|
2323
|
+
const newScale = Math.min(currentScale * 1.1, 2);
|
|
2324
|
+
return scaleThemeFonts(theme2, newScale);
|
|
2325
|
+
}
|
|
2326
|
+
function decreaseFontScale(theme2) {
|
|
2327
|
+
const currentScale = theme2.fontScale || 1;
|
|
2328
|
+
const newScale = Math.max(currentScale * 0.9, 0.5);
|
|
2329
|
+
return scaleThemeFonts(theme2, newScale);
|
|
2330
|
+
}
|
|
2331
|
+
function resetFontScale(theme2) {
|
|
2332
|
+
return scaleThemeFonts(theme2, 1);
|
|
2333
|
+
}
|
|
2334
|
+
var src_default = theme;
|
|
2335
|
+
const esm$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
2336
|
+
__proto__: null,
|
|
2337
|
+
ThemeProvider,
|
|
2338
|
+
ThemeShowcase,
|
|
2339
|
+
addMode,
|
|
2340
|
+
createStyle,
|
|
2341
|
+
decreaseFontScale,
|
|
2342
|
+
default: src_default,
|
|
2343
|
+
defaultEditorTheme,
|
|
2344
|
+
defaultMarkdownTheme,
|
|
2345
|
+
defaultTerminalTheme,
|
|
2346
|
+
getColor,
|
|
2347
|
+
getFontSize,
|
|
2348
|
+
getMode,
|
|
2349
|
+
getRadius,
|
|
2350
|
+
getShadow,
|
|
2351
|
+
getSpace,
|
|
2352
|
+
getZIndex,
|
|
2353
|
+
glassmorphismTheme,
|
|
2354
|
+
increaseFontScale,
|
|
2355
|
+
landingPageLightTheme,
|
|
2356
|
+
landingPageTheme,
|
|
2357
|
+
makeTheme,
|
|
2358
|
+
matrixMinimalTheme,
|
|
2359
|
+
matrixTheme,
|
|
2360
|
+
mergeThemes,
|
|
2361
|
+
overrideColors,
|
|
2362
|
+
regalTheme,
|
|
2363
|
+
resetFontScale,
|
|
2364
|
+
responsive,
|
|
2365
|
+
scaleThemeFonts,
|
|
2366
|
+
slateTheme,
|
|
2367
|
+
sx,
|
|
2368
|
+
terminalTheme,
|
|
2369
|
+
theme,
|
|
2370
|
+
useTheme,
|
|
2371
|
+
withTheme
|
|
2372
|
+
}, Symbol.toStringTag, { value: "Module" }));
|
|
430
2373
|
class _ {
|
|
431
2374
|
static buildTreeFromPaths(j, k = "") {
|
|
432
2375
|
let q = k.endsWith("/") ? k.slice(0, -1) : k, E = /* @__PURE__ */ new Map(), J = [], O = [], X2 = /* @__PURE__ */ new Set();
|
|
@@ -553,7 +2496,7 @@ const GitChangesTree = ({
|
|
|
553
2496
|
onFileClick,
|
|
554
2497
|
onNodeHover
|
|
555
2498
|
}) => {
|
|
556
|
-
const { theme } = useTheme();
|
|
2499
|
+
const { theme: theme2 } = useTheme();
|
|
557
2500
|
const hasChanges = useMemo(
|
|
558
2501
|
() => gitStatus.staged.length > 0 || gitStatus.unstaged.length > 0 || gitStatus.untracked.length > 0 || gitStatus.deleted.length > 0,
|
|
559
2502
|
[gitStatus.staged.length, gitStatus.unstaged.length, gitStatus.untracked.length, gitStatus.deleted.length]
|
|
@@ -646,9 +2589,9 @@ const GitChangesTree = ({
|
|
|
646
2589
|
{
|
|
647
2590
|
style: {
|
|
648
2591
|
padding: "12px 0",
|
|
649
|
-
fontSize:
|
|
650
|
-
fontFamily:
|
|
651
|
-
color:
|
|
2592
|
+
fontSize: theme2.fontSizes[0],
|
|
2593
|
+
fontFamily: theme2.fonts.body,
|
|
2594
|
+
color: theme2.colors.textSecondary,
|
|
652
2595
|
fontStyle: "italic",
|
|
653
2596
|
textAlign: "center"
|
|
654
2597
|
},
|
|
@@ -663,7 +2606,7 @@ const GitChangesTree = ({
|
|
|
663
2606
|
GitStatusFileTree,
|
|
664
2607
|
{
|
|
665
2608
|
fileTree: gitChangesData.tree,
|
|
666
|
-
theme,
|
|
2609
|
+
theme: theme2,
|
|
667
2610
|
gitStatusData: gitChangesData.statusData,
|
|
668
2611
|
onFileSelect: handleFileSelect,
|
|
669
2612
|
onNodeHover,
|
|
@@ -671,7 +2614,8 @@ const GitChangesTree = ({
|
|
|
671
2614
|
horizontalNodePadding: horizontalPadding,
|
|
672
2615
|
verticalPadding: "4px",
|
|
673
2616
|
openByDefault: true,
|
|
674
|
-
enableDragAndDrop: false
|
|
2617
|
+
enableDragAndDrop: false,
|
|
2618
|
+
autoHeight: true
|
|
675
2619
|
}
|
|
676
2620
|
);
|
|
677
2621
|
};
|
|
@@ -682,7 +2626,7 @@ const PrChangesTree = ({
|
|
|
682
2626
|
onFileClick,
|
|
683
2627
|
onNodeHover
|
|
684
2628
|
}) => {
|
|
685
|
-
const { theme } = useTheme();
|
|
2629
|
+
const { theme: theme2 } = useTheme();
|
|
686
2630
|
const hasChanges = useMemo(
|
|
687
2631
|
() => prFiles.added.length > 0 || prFiles.modified.length > 0 || prFiles.removed.length > 0 || prFiles.renamed.length > 0,
|
|
688
2632
|
[prFiles.added.length, prFiles.modified.length, prFiles.removed.length, prFiles.renamed.length]
|
|
@@ -762,9 +2706,9 @@ const PrChangesTree = ({
|
|
|
762
2706
|
{
|
|
763
2707
|
style: {
|
|
764
2708
|
padding: "12px 0",
|
|
765
|
-
fontSize:
|
|
766
|
-
fontFamily:
|
|
767
|
-
color:
|
|
2709
|
+
fontSize: theme2.fontSizes[0],
|
|
2710
|
+
fontFamily: theme2.fonts.body,
|
|
2711
|
+
color: theme2.colors.textSecondary,
|
|
768
2712
|
fontStyle: "italic",
|
|
769
2713
|
textAlign: "center"
|
|
770
2714
|
},
|
|
@@ -779,7 +2723,7 @@ const PrChangesTree = ({
|
|
|
779
2723
|
GitStatusFileTree,
|
|
780
2724
|
{
|
|
781
2725
|
fileTree: prChangesData.tree,
|
|
782
|
-
theme,
|
|
2726
|
+
theme: theme2,
|
|
783
2727
|
gitStatusData: prChangesData.statusData,
|
|
784
2728
|
onFileSelect: handleFileSelect,
|
|
785
2729
|
onNodeHover,
|
|
@@ -798,7 +2742,7 @@ const CommitChangesTree = ({
|
|
|
798
2742
|
onFileClick,
|
|
799
2743
|
onNodeHover
|
|
800
2744
|
}) => {
|
|
801
|
-
const { theme } = useTheme();
|
|
2745
|
+
const { theme: theme2 } = useTheme();
|
|
802
2746
|
const hasChanges = useMemo(
|
|
803
2747
|
() => commitFiles.added.length > 0 || commitFiles.modified.length > 0 || commitFiles.removed.length > 0 || commitFiles.renamed.length > 0,
|
|
804
2748
|
[commitFiles.added.length, commitFiles.modified.length, commitFiles.removed.length, commitFiles.renamed.length]
|
|
@@ -874,9 +2818,9 @@ const CommitChangesTree = ({
|
|
|
874
2818
|
{
|
|
875
2819
|
style: {
|
|
876
2820
|
padding: "12px 0",
|
|
877
|
-
fontSize:
|
|
878
|
-
fontFamily:
|
|
879
|
-
color:
|
|
2821
|
+
fontSize: theme2.fontSizes[0],
|
|
2822
|
+
fontFamily: theme2.fonts.body,
|
|
2823
|
+
color: theme2.colors.textSecondary,
|
|
880
2824
|
fontStyle: "italic",
|
|
881
2825
|
textAlign: "center"
|
|
882
2826
|
},
|
|
@@ -891,7 +2835,7 @@ const CommitChangesTree = ({
|
|
|
891
2835
|
GitStatusFileTree,
|
|
892
2836
|
{
|
|
893
2837
|
fileTree: commitChangesData.tree,
|
|
894
|
-
theme,
|
|
2838
|
+
theme: theme2,
|
|
895
2839
|
gitStatusData: commitChangesData.statusData,
|
|
896
2840
|
onFileSelect: handleFileSelect,
|
|
897
2841
|
onNodeHover,
|
|
@@ -927,7 +2871,7 @@ const Legend = ({
|
|
|
927
2871
|
onClearAgentLayers,
|
|
928
2872
|
position = "bottom"
|
|
929
2873
|
}) => {
|
|
930
|
-
const { theme } = useTheme();
|
|
2874
|
+
const { theme: theme2 } = useTheme();
|
|
931
2875
|
const hasGitStatus = gitStatus != null && (gitStatus.staged.length > 0 || gitStatus.unstaged.length > 0 || gitStatus.untracked.length > 0 || gitStatus.deleted.length > 0);
|
|
932
2876
|
const hasPrFiles = prFiles != null && (prFiles.added.length > 0 || prFiles.modified.length > 0 || prFiles.removed.length > 0 || prFiles.renamed.length > 0);
|
|
933
2877
|
const hasCommitFiles = commitFiles != null && (commitFiles.added.length > 0 || commitFiles.modified.length > 0 || commitFiles.removed.length > 0 || commitFiles.renamed.length > 0);
|
|
@@ -952,9 +2896,9 @@ const Legend = ({
|
|
|
952
2896
|
flexDirection: "column",
|
|
953
2897
|
gap: "12px",
|
|
954
2898
|
padding: `12px 0`,
|
|
955
|
-
backgroundColor:
|
|
956
|
-
borderTop: isRight ? "none" : `1px solid ${
|
|
957
|
-
borderLeft: isRight ? `1px solid ${
|
|
2899
|
+
backgroundColor: theme2.colors.background,
|
|
2900
|
+
borderTop: isRight ? "none" : `1px solid ${theme2.colors.border}`,
|
|
2901
|
+
borderLeft: isRight ? `1px solid ${theme2.colors.border}` : "none",
|
|
958
2902
|
boxSizing: "border-box",
|
|
959
2903
|
flex: 1,
|
|
960
2904
|
minWidth: 0,
|
|
@@ -970,9 +2914,9 @@ const Legend = ({
|
|
|
970
2914
|
alignItems: "center",
|
|
971
2915
|
justifyContent: "center",
|
|
972
2916
|
padding: `8px ${horizontalPadding}`,
|
|
973
|
-
fontSize:
|
|
974
|
-
fontFamily:
|
|
975
|
-
color:
|
|
2917
|
+
fontSize: theme2.fontSizes[0],
|
|
2918
|
+
fontFamily: theme2.fonts.body,
|
|
2919
|
+
color: theme2.colors.textSecondary,
|
|
976
2920
|
fontStyle: "italic"
|
|
977
2921
|
},
|
|
978
2922
|
children: [
|
|
@@ -989,10 +2933,10 @@ const Legend = ({
|
|
|
989
2933
|
display: "flex",
|
|
990
2934
|
alignItems: "center",
|
|
991
2935
|
gap: "6px",
|
|
992
|
-
fontSize:
|
|
993
|
-
fontFamily:
|
|
2936
|
+
fontSize: theme2.fontSizes[0],
|
|
2937
|
+
fontFamily: theme2.fonts.body,
|
|
994
2938
|
fontWeight: 600,
|
|
995
|
-
color:
|
|
2939
|
+
color: theme2.colors.textSecondary,
|
|
996
2940
|
textTransform: "uppercase",
|
|
997
2941
|
letterSpacing: "0.5px"
|
|
998
2942
|
},
|
|
@@ -1019,8 +2963,8 @@ const Legend = ({
|
|
|
1019
2963
|
alignItems: "center",
|
|
1020
2964
|
gap: "8px",
|
|
1021
2965
|
padding: "6px 10px",
|
|
1022
|
-
backgroundColor:
|
|
1023
|
-
border: `1px solid ${
|
|
2966
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
2967
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1024
2968
|
borderRadius: "4px",
|
|
1025
2969
|
cursor: onQualityMetricClick ? "pointer" : "default",
|
|
1026
2970
|
opacity: metric.enabled ? 1 : 0.4,
|
|
@@ -1048,9 +2992,9 @@ const Legend = ({
|
|
|
1048
2992
|
"span",
|
|
1049
2993
|
{
|
|
1050
2994
|
style: {
|
|
1051
|
-
fontSize:
|
|
1052
|
-
fontFamily:
|
|
1053
|
-
color:
|
|
2995
|
+
fontSize: theme2.fontSizes[0],
|
|
2996
|
+
fontFamily: theme2.fonts.body,
|
|
2997
|
+
color: theme2.colors.text,
|
|
1054
2998
|
whiteSpace: "nowrap",
|
|
1055
2999
|
overflow: "hidden",
|
|
1056
3000
|
textOverflow: "ellipsis",
|
|
@@ -1064,9 +3008,9 @@ const Legend = ({
|
|
|
1064
3008
|
"span",
|
|
1065
3009
|
{
|
|
1066
3010
|
style: {
|
|
1067
|
-
fontSize:
|
|
1068
|
-
fontFamily:
|
|
1069
|
-
color:
|
|
3011
|
+
fontSize: theme2.fontSizes[0],
|
|
3012
|
+
fontFamily: theme2.fonts.body,
|
|
3013
|
+
color: theme2.colors.textSecondary,
|
|
1070
3014
|
flexShrink: 0
|
|
1071
3015
|
},
|
|
1072
3016
|
children: [
|
|
@@ -1100,10 +3044,10 @@ const Legend = ({
|
|
|
1100
3044
|
display: "flex",
|
|
1101
3045
|
alignItems: "center",
|
|
1102
3046
|
gap: "6px",
|
|
1103
|
-
fontSize:
|
|
1104
|
-
fontFamily:
|
|
3047
|
+
fontSize: theme2.fontSizes[0],
|
|
3048
|
+
fontFamily: theme2.fonts.body,
|
|
1105
3049
|
fontWeight: 600,
|
|
1106
|
-
color:
|
|
3050
|
+
color: theme2.colors.primary,
|
|
1107
3051
|
textTransform: "uppercase",
|
|
1108
3052
|
letterSpacing: "0.5px"
|
|
1109
3053
|
},
|
|
@@ -1122,11 +3066,11 @@ const Legend = ({
|
|
|
1122
3066
|
alignItems: "center",
|
|
1123
3067
|
gap: "4px",
|
|
1124
3068
|
padding: "2px 6px",
|
|
1125
|
-
fontSize:
|
|
1126
|
-
fontFamily:
|
|
1127
|
-
color:
|
|
3069
|
+
fontSize: theme2.fontSizes[0],
|
|
3070
|
+
fontFamily: theme2.fonts.body,
|
|
3071
|
+
color: theme2.colors.textSecondary,
|
|
1128
3072
|
backgroundColor: "transparent",
|
|
1129
|
-
border: `1px solid ${
|
|
3073
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1130
3074
|
borderRadius: "3px",
|
|
1131
3075
|
cursor: "pointer",
|
|
1132
3076
|
transition: "all 0.15s ease"
|
|
@@ -1158,8 +3102,8 @@ const Legend = ({
|
|
|
1158
3102
|
alignItems: "center",
|
|
1159
3103
|
gap: "8px",
|
|
1160
3104
|
padding: "6px 10px",
|
|
1161
|
-
backgroundColor:
|
|
1162
|
-
border: `1px solid ${
|
|
3105
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3106
|
+
border: `1px solid ${theme2.colors.primary}40`,
|
|
1163
3107
|
borderRadius: "4px",
|
|
1164
3108
|
cursor: onAgentLayerClick ? "pointer" : "default",
|
|
1165
3109
|
opacity: layer.enabled ? 1 : 0.4,
|
|
@@ -1187,9 +3131,9 @@ const Legend = ({
|
|
|
1187
3131
|
"span",
|
|
1188
3132
|
{
|
|
1189
3133
|
style: {
|
|
1190
|
-
fontSize:
|
|
1191
|
-
fontFamily:
|
|
1192
|
-
color:
|
|
3134
|
+
fontSize: theme2.fontSizes[0],
|
|
3135
|
+
fontFamily: theme2.fonts.body,
|
|
3136
|
+
color: theme2.colors.text,
|
|
1193
3137
|
whiteSpace: "nowrap",
|
|
1194
3138
|
overflow: "hidden",
|
|
1195
3139
|
textOverflow: "ellipsis",
|
|
@@ -1203,9 +3147,9 @@ const Legend = ({
|
|
|
1203
3147
|
"span",
|
|
1204
3148
|
{
|
|
1205
3149
|
style: {
|
|
1206
|
-
fontSize:
|
|
1207
|
-
fontFamily:
|
|
1208
|
-
color:
|
|
3150
|
+
fontSize: theme2.fontSizes[0],
|
|
3151
|
+
fontFamily: theme2.fonts.body,
|
|
3152
|
+
color: theme2.colors.textSecondary,
|
|
1209
3153
|
flexShrink: 0
|
|
1210
3154
|
},
|
|
1211
3155
|
children: layer.count
|
|
@@ -1218,23 +3162,24 @@ const Legend = ({
|
|
|
1218
3162
|
}
|
|
1219
3163
|
)
|
|
1220
3164
|
] }),
|
|
1221
|
-
hasGitStatus && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
|
|
3165
|
+
hasGitStatus && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px", flex: 1, minHeight: 0 }, children: [
|
|
1222
3166
|
/* @__PURE__ */ jsx(
|
|
1223
3167
|
"div",
|
|
1224
3168
|
{
|
|
1225
3169
|
style: {
|
|
1226
|
-
fontSize:
|
|
1227
|
-
fontFamily:
|
|
3170
|
+
fontSize: theme2.fontSizes[0],
|
|
3171
|
+
fontFamily: theme2.fonts.body,
|
|
1228
3172
|
fontWeight: 600,
|
|
1229
|
-
color:
|
|
3173
|
+
color: theme2.colors.textSecondary,
|
|
1230
3174
|
textTransform: "uppercase",
|
|
1231
3175
|
letterSpacing: "0.5px",
|
|
1232
|
-
padding: `0 ${horizontalPadding}
|
|
3176
|
+
padding: `0 ${horizontalPadding}`,
|
|
3177
|
+
flexShrink: 0
|
|
1233
3178
|
},
|
|
1234
3179
|
children: "Git Changes"
|
|
1235
3180
|
}
|
|
1236
3181
|
),
|
|
1237
|
-
/* @__PURE__ */ jsx(
|
|
3182
|
+
/* @__PURE__ */ jsx("div", { style: { flex: 1, minHeight: 0, overflow: "auto" }, children: /* @__PURE__ */ jsx(
|
|
1238
3183
|
GitChangesTree,
|
|
1239
3184
|
{
|
|
1240
3185
|
gitStatus,
|
|
@@ -1244,7 +3189,7 @@ const Legend = ({
|
|
|
1244
3189
|
onFileClick: onGitFileClick,
|
|
1245
3190
|
onNodeHover: onGitNodeHover
|
|
1246
3191
|
}
|
|
1247
|
-
)
|
|
3192
|
+
) })
|
|
1248
3193
|
] }),
|
|
1249
3194
|
hasPrFiles && /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px", flex: 1, minHeight: 0 }, children: [
|
|
1250
3195
|
/* @__PURE__ */ jsxs(
|
|
@@ -1254,10 +3199,10 @@ const Legend = ({
|
|
|
1254
3199
|
display: "flex",
|
|
1255
3200
|
alignItems: "center",
|
|
1256
3201
|
gap: "6px",
|
|
1257
|
-
fontSize:
|
|
1258
|
-
fontFamily:
|
|
3202
|
+
fontSize: theme2.fontSizes[0],
|
|
3203
|
+
fontFamily: theme2.fonts.body,
|
|
1259
3204
|
fontWeight: 600,
|
|
1260
|
-
color:
|
|
3205
|
+
color: theme2.colors.textSecondary,
|
|
1261
3206
|
textTransform: "uppercase",
|
|
1262
3207
|
letterSpacing: "0.5px",
|
|
1263
3208
|
flexShrink: 0,
|
|
@@ -1290,10 +3235,10 @@ const Legend = ({
|
|
|
1290
3235
|
display: "flex",
|
|
1291
3236
|
alignItems: "center",
|
|
1292
3237
|
gap: "6px",
|
|
1293
|
-
fontSize:
|
|
1294
|
-
fontFamily:
|
|
3238
|
+
fontSize: theme2.fontSizes[0],
|
|
3239
|
+
fontFamily: theme2.fonts.body,
|
|
1295
3240
|
fontWeight: 600,
|
|
1296
|
-
color:
|
|
3241
|
+
color: theme2.colors.textSecondary,
|
|
1297
3242
|
textTransform: "uppercase",
|
|
1298
3243
|
letterSpacing: "0.5px",
|
|
1299
3244
|
flexShrink: 0,
|
|
@@ -1323,10 +3268,10 @@ const Legend = ({
|
|
|
1323
3268
|
"div",
|
|
1324
3269
|
{
|
|
1325
3270
|
style: {
|
|
1326
|
-
fontSize:
|
|
1327
|
-
fontFamily:
|
|
3271
|
+
fontSize: theme2.fontSizes[0],
|
|
3272
|
+
fontFamily: theme2.fonts.body,
|
|
1328
3273
|
fontWeight: 600,
|
|
1329
|
-
color:
|
|
3274
|
+
color: theme2.colors.textSecondary,
|
|
1330
3275
|
textTransform: "uppercase",
|
|
1331
3276
|
letterSpacing: "0.5px"
|
|
1332
3277
|
},
|
|
@@ -1350,14 +3295,14 @@ const Legend = ({
|
|
|
1350
3295
|
alignItems: "center",
|
|
1351
3296
|
gap: "8px",
|
|
1352
3297
|
padding: "6px 10px",
|
|
1353
|
-
backgroundColor:
|
|
1354
|
-
border: `1px solid ${
|
|
3298
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3299
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1355
3300
|
borderRadius: "4px",
|
|
1356
3301
|
cursor: onItemClick ? "pointer" : "default",
|
|
1357
3302
|
opacity: fileType.enabled ? 1 : 0.4,
|
|
1358
3303
|
transition: "all 0.15s ease",
|
|
1359
|
-
minWidth: "
|
|
1360
|
-
flex: "1 1
|
|
3304
|
+
minWidth: "150px",
|
|
3305
|
+
flex: "1 1 150px",
|
|
1361
3306
|
maxWidth: "300px",
|
|
1362
3307
|
boxSizing: "border-box"
|
|
1363
3308
|
},
|
|
@@ -1380,9 +3325,9 @@ const Legend = ({
|
|
|
1380
3325
|
"span",
|
|
1381
3326
|
{
|
|
1382
3327
|
style: {
|
|
1383
|
-
fontSize:
|
|
1384
|
-
fontFamily:
|
|
1385
|
-
color:
|
|
3328
|
+
fontSize: theme2.fontSizes[0],
|
|
3329
|
+
fontFamily: theme2.fonts.body,
|
|
3330
|
+
color: theme2.colors.text,
|
|
1386
3331
|
whiteSpace: "nowrap",
|
|
1387
3332
|
overflow: "hidden",
|
|
1388
3333
|
textOverflow: "ellipsis",
|
|
@@ -1396,9 +3341,9 @@ const Legend = ({
|
|
|
1396
3341
|
"span",
|
|
1397
3342
|
{
|
|
1398
3343
|
style: {
|
|
1399
|
-
fontSize:
|
|
1400
|
-
fontFamily:
|
|
1401
|
-
color:
|
|
3344
|
+
fontSize: theme2.fontSizes[0],
|
|
3345
|
+
fontFamily: theme2.fonts.body,
|
|
3346
|
+
color: theme2.colors.textSecondary,
|
|
1402
3347
|
flexShrink: 0
|
|
1403
3348
|
},
|
|
1404
3349
|
children: fileType.count
|
|
@@ -1421,7 +3366,7 @@ const AgentActivityView = ({
|
|
|
1421
3366
|
onClearAll,
|
|
1422
3367
|
showHeader = true
|
|
1423
3368
|
}) => {
|
|
1424
|
-
const { theme } = useTheme();
|
|
3369
|
+
const { theme: theme2 } = useTheme();
|
|
1425
3370
|
const [expandedLayers, setExpandedLayers] = React.useState(/* @__PURE__ */ new Set());
|
|
1426
3371
|
const toggleExpanded = (id2) => {
|
|
1427
3372
|
setExpandedLayers((prev) => {
|
|
@@ -1459,9 +3404,9 @@ const AgentActivityView = ({
|
|
|
1459
3404
|
display: "flex",
|
|
1460
3405
|
flexDirection: "column",
|
|
1461
3406
|
flex: 1,
|
|
1462
|
-
backgroundColor:
|
|
3407
|
+
backgroundColor: theme2.colors.background,
|
|
1463
3408
|
...showHeader && {
|
|
1464
|
-
border: `1px solid ${
|
|
3409
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1465
3410
|
borderRadius: "6px"
|
|
1466
3411
|
},
|
|
1467
3412
|
overflow: "hidden"
|
|
@@ -1475,8 +3420,8 @@ const AgentActivityView = ({
|
|
|
1475
3420
|
alignItems: "center",
|
|
1476
3421
|
justifyContent: "space-between",
|
|
1477
3422
|
padding: "12px 16px",
|
|
1478
|
-
backgroundColor:
|
|
1479
|
-
borderBottom: `1px solid ${
|
|
3423
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3424
|
+
borderBottom: `1px solid ${theme2.colors.border}`
|
|
1480
3425
|
},
|
|
1481
3426
|
children: /* @__PURE__ */ jsxs(
|
|
1482
3427
|
"div",
|
|
@@ -1485,10 +3430,10 @@ const AgentActivityView = ({
|
|
|
1485
3430
|
display: "flex",
|
|
1486
3431
|
alignItems: "center",
|
|
1487
3432
|
gap: "8px",
|
|
1488
|
-
color:
|
|
1489
|
-
fontFamily:
|
|
3433
|
+
color: theme2.colors.primary,
|
|
3434
|
+
fontFamily: theme2.fonts.body,
|
|
1490
3435
|
fontWeight: 600,
|
|
1491
|
-
fontSize:
|
|
3436
|
+
fontSize: theme2.fontSizes[1]
|
|
1492
3437
|
},
|
|
1493
3438
|
children: [
|
|
1494
3439
|
/* @__PURE__ */ jsx(Activity, { size: 16 }),
|
|
@@ -1508,9 +3453,9 @@ const AgentActivityView = ({
|
|
|
1508
3453
|
justifyContent: "center",
|
|
1509
3454
|
flex: 1,
|
|
1510
3455
|
padding: "32px 16px",
|
|
1511
|
-
color:
|
|
1512
|
-
fontFamily:
|
|
1513
|
-
fontSize:
|
|
3456
|
+
color: theme2.colors.textSecondary,
|
|
3457
|
+
fontFamily: theme2.fonts.body,
|
|
3458
|
+
fontSize: theme2.fontSizes[0]
|
|
1514
3459
|
},
|
|
1515
3460
|
children: [
|
|
1516
3461
|
/* @__PURE__ */ jsx(Activity, { size: 32, style: { opacity: 0.3, marginBottom: "8px" } }),
|
|
@@ -1529,9 +3474,9 @@ const AgentActivityView = ({
|
|
|
1529
3474
|
display: "flex",
|
|
1530
3475
|
flexDirection: "column",
|
|
1531
3476
|
flex: 1,
|
|
1532
|
-
backgroundColor:
|
|
3477
|
+
backgroundColor: theme2.colors.background,
|
|
1533
3478
|
...showHeader && {
|
|
1534
|
-
border: `1px solid ${
|
|
3479
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1535
3480
|
borderRadius: "6px"
|
|
1536
3481
|
},
|
|
1537
3482
|
overflow: "hidden"
|
|
@@ -1545,8 +3490,8 @@ const AgentActivityView = ({
|
|
|
1545
3490
|
alignItems: "center",
|
|
1546
3491
|
justifyContent: "space-between",
|
|
1547
3492
|
padding: "12px 16px",
|
|
1548
|
-
backgroundColor:
|
|
1549
|
-
borderBottom: `1px solid ${
|
|
3493
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3494
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
1550
3495
|
flexShrink: 0
|
|
1551
3496
|
},
|
|
1552
3497
|
children: [
|
|
@@ -1557,10 +3502,10 @@ const AgentActivityView = ({
|
|
|
1557
3502
|
display: "flex",
|
|
1558
3503
|
alignItems: "center",
|
|
1559
3504
|
gap: "8px",
|
|
1560
|
-
color:
|
|
1561
|
-
fontFamily:
|
|
3505
|
+
color: theme2.colors.primary,
|
|
3506
|
+
fontFamily: theme2.fonts.body,
|
|
1562
3507
|
fontWeight: 600,
|
|
1563
|
-
fontSize:
|
|
3508
|
+
fontSize: theme2.fontSizes[1]
|
|
1564
3509
|
},
|
|
1565
3510
|
children: [
|
|
1566
3511
|
/* @__PURE__ */ jsx(Activity, { size: 16 }),
|
|
@@ -1569,11 +3514,11 @@ const AgentActivityView = ({
|
|
|
1569
3514
|
"span",
|
|
1570
3515
|
{
|
|
1571
3516
|
style: {
|
|
1572
|
-
backgroundColor:
|
|
1573
|
-
color:
|
|
3517
|
+
backgroundColor: theme2.colors.primary,
|
|
3518
|
+
color: theme2.colors.background,
|
|
1574
3519
|
padding: "2px 8px",
|
|
1575
3520
|
borderRadius: "10px",
|
|
1576
|
-
fontSize:
|
|
3521
|
+
fontSize: theme2.fontSizes[0],
|
|
1577
3522
|
fontWeight: 500
|
|
1578
3523
|
},
|
|
1579
3524
|
children: layers.length
|
|
@@ -1591,11 +3536,11 @@ const AgentActivityView = ({
|
|
|
1591
3536
|
alignItems: "center",
|
|
1592
3537
|
gap: "4px",
|
|
1593
3538
|
padding: "4px 10px",
|
|
1594
|
-
fontSize:
|
|
1595
|
-
fontFamily:
|
|
1596
|
-
color:
|
|
3539
|
+
fontSize: theme2.fontSizes[0],
|
|
3540
|
+
fontFamily: theme2.fonts.body,
|
|
3541
|
+
color: theme2.colors.textSecondary,
|
|
1597
3542
|
backgroundColor: "transparent",
|
|
1598
|
-
border: `1px solid ${
|
|
3543
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1599
3544
|
borderRadius: "4px",
|
|
1600
3545
|
cursor: "pointer",
|
|
1601
3546
|
transition: "all 0.15s ease"
|
|
@@ -1626,7 +3571,7 @@ const AgentActivityView = ({
|
|
|
1626
3571
|
"div",
|
|
1627
3572
|
{
|
|
1628
3573
|
style: {
|
|
1629
|
-
borderBottom: index < layers.length - 1 ? `1px solid ${
|
|
3574
|
+
borderBottom: index < layers.length - 1 ? `1px solid ${theme2.colors.border}` : "none"
|
|
1630
3575
|
},
|
|
1631
3576
|
children: [
|
|
1632
3577
|
/* @__PURE__ */ jsxs(
|
|
@@ -1638,7 +3583,7 @@ const AgentActivityView = ({
|
|
|
1638
3583
|
alignItems: "center",
|
|
1639
3584
|
gap: "12px",
|
|
1640
3585
|
padding: "12px 16px",
|
|
1641
|
-
backgroundColor: layer.enabled ? "transparent" : `${
|
|
3586
|
+
backgroundColor: layer.enabled ? "transparent" : `${theme2.colors.backgroundLight}`,
|
|
1642
3587
|
opacity: layer.enabled ? 1 : 0.6,
|
|
1643
3588
|
cursor: "pointer",
|
|
1644
3589
|
transition: "all 0.15s ease"
|
|
@@ -1653,7 +3598,7 @@ const AgentActivityView = ({
|
|
|
1653
3598
|
justifyContent: "center",
|
|
1654
3599
|
width: "20px",
|
|
1655
3600
|
height: "20px",
|
|
1656
|
-
color:
|
|
3601
|
+
color: theme2.colors.textSecondary,
|
|
1657
3602
|
flexShrink: 0
|
|
1658
3603
|
},
|
|
1659
3604
|
children: isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { size: 16 }) : /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
|
|
@@ -1695,10 +3640,10 @@ const AgentActivityView = ({
|
|
|
1695
3640
|
"span",
|
|
1696
3641
|
{
|
|
1697
3642
|
style: {
|
|
1698
|
-
fontFamily:
|
|
1699
|
-
fontSize:
|
|
3643
|
+
fontFamily: theme2.fonts.body,
|
|
3644
|
+
fontSize: theme2.fontSizes[1],
|
|
1700
3645
|
fontWeight: 500,
|
|
1701
|
-
color:
|
|
3646
|
+
color: theme2.colors.text,
|
|
1702
3647
|
overflow: "hidden",
|
|
1703
3648
|
textOverflow: "ellipsis",
|
|
1704
3649
|
whiteSpace: "nowrap"
|
|
@@ -1715,9 +3660,9 @@ const AgentActivityView = ({
|
|
|
1715
3660
|
display: "flex",
|
|
1716
3661
|
alignItems: "center",
|
|
1717
3662
|
gap: "12px",
|
|
1718
|
-
fontFamily:
|
|
1719
|
-
fontSize:
|
|
1720
|
-
color:
|
|
3663
|
+
fontFamily: theme2.fonts.body,
|
|
3664
|
+
fontSize: theme2.fontSizes[0],
|
|
3665
|
+
color: theme2.colors.textSecondary
|
|
1721
3666
|
},
|
|
1722
3667
|
children: [
|
|
1723
3668
|
/* @__PURE__ */ jsxs("span", { children: [
|
|
@@ -1747,10 +3692,10 @@ const AgentActivityView = ({
|
|
|
1747
3692
|
height: "32px",
|
|
1748
3693
|
padding: 0,
|
|
1749
3694
|
backgroundColor: "transparent",
|
|
1750
|
-
border: `1px solid ${
|
|
3695
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1751
3696
|
borderRadius: "4px",
|
|
1752
3697
|
cursor: onLayerClick ? "pointer" : "default",
|
|
1753
|
-
color: layer.enabled ?
|
|
3698
|
+
color: layer.enabled ? theme2.colors.primary : theme2.colors.textSecondary,
|
|
1754
3699
|
flexShrink: 0,
|
|
1755
3700
|
transition: "all 0.15s ease"
|
|
1756
3701
|
},
|
|
@@ -1765,8 +3710,8 @@ const AgentActivityView = ({
|
|
|
1765
3710
|
"div",
|
|
1766
3711
|
{
|
|
1767
3712
|
style: {
|
|
1768
|
-
backgroundColor:
|
|
1769
|
-
borderTop: `1px solid ${
|
|
3713
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3714
|
+
borderTop: `1px solid ${theme2.colors.border}`
|
|
1770
3715
|
},
|
|
1771
3716
|
children: layer.items.map((item, itemIndex) => /* @__PURE__ */ jsxs(
|
|
1772
3717
|
"div",
|
|
@@ -1776,7 +3721,7 @@ const AgentActivityView = ({
|
|
|
1776
3721
|
alignItems: "center",
|
|
1777
3722
|
gap: "8px",
|
|
1778
3723
|
padding: "8px 16px 8px 48px",
|
|
1779
|
-
borderBottom: itemIndex < layer.items.length - 1 ? `1px solid ${
|
|
3724
|
+
borderBottom: itemIndex < layer.items.length - 1 ? `1px solid ${theme2.colors.border}40` : "none"
|
|
1780
3725
|
},
|
|
1781
3726
|
children: [
|
|
1782
3727
|
/* @__PURE__ */ jsx(
|
|
@@ -1804,9 +3749,9 @@ const AgentActivityView = ({
|
|
|
1804
3749
|
"span",
|
|
1805
3750
|
{
|
|
1806
3751
|
style: {
|
|
1807
|
-
fontFamily:
|
|
1808
|
-
fontSize:
|
|
1809
|
-
color:
|
|
3752
|
+
fontFamily: theme2.fonts.body,
|
|
3753
|
+
fontSize: theme2.fontSizes[0],
|
|
3754
|
+
color: theme2.colors.text,
|
|
1810
3755
|
overflow: "hidden",
|
|
1811
3756
|
textOverflow: "ellipsis",
|
|
1812
3757
|
whiteSpace: "nowrap"
|
|
@@ -1818,9 +3763,9 @@ const AgentActivityView = ({
|
|
|
1818
3763
|
"span",
|
|
1819
3764
|
{
|
|
1820
3765
|
style: {
|
|
1821
|
-
fontFamily:
|
|
3766
|
+
fontFamily: theme2.fonts.body,
|
|
1822
3767
|
fontSize: "10px",
|
|
1823
|
-
color:
|
|
3768
|
+
color: theme2.colors.textSecondary,
|
|
1824
3769
|
overflow: "hidden",
|
|
1825
3770
|
textOverflow: "ellipsis",
|
|
1826
3771
|
whiteSpace: "nowrap"
|
|
@@ -1835,9 +3780,9 @@ const AgentActivityView = ({
|
|
|
1835
3780
|
"span",
|
|
1836
3781
|
{
|
|
1837
3782
|
style: {
|
|
1838
|
-
fontFamily:
|
|
3783
|
+
fontFamily: theme2.fonts.body,
|
|
1839
3784
|
fontSize: "10px",
|
|
1840
|
-
color:
|
|
3785
|
+
color: theme2.colors.textSecondary,
|
|
1841
3786
|
backgroundColor: `${layer.color}20`,
|
|
1842
3787
|
padding: "2px 6px",
|
|
1843
3788
|
borderRadius: "3px",
|
|
@@ -1870,7 +3815,7 @@ const LegendTabs = ({
|
|
|
1870
3815
|
onTabChange
|
|
1871
3816
|
}) => {
|
|
1872
3817
|
var _a;
|
|
1873
|
-
const { theme } = useTheme();
|
|
3818
|
+
const { theme: theme2 } = useTheme();
|
|
1874
3819
|
const [activeTab, setActiveTab] = React.useState(
|
|
1875
3820
|
defaultTab || ((_a = tabs[0]) == null ? void 0 : _a.id) || "agent"
|
|
1876
3821
|
);
|
|
@@ -1893,9 +3838,9 @@ const LegendTabs = ({
|
|
|
1893
3838
|
justifyContent: "center",
|
|
1894
3839
|
flex: 1,
|
|
1895
3840
|
padding: "24px 16px",
|
|
1896
|
-
color:
|
|
1897
|
-
fontFamily:
|
|
1898
|
-
fontSize:
|
|
3841
|
+
color: theme2.colors.textSecondary,
|
|
3842
|
+
fontFamily: theme2.fonts.body,
|
|
3843
|
+
fontSize: theme2.fontSizes[0],
|
|
1899
3844
|
fontStyle: "italic"
|
|
1900
3845
|
},
|
|
1901
3846
|
children: "No data available"
|
|
@@ -1937,16 +3882,16 @@ const LegendTabs = ({
|
|
|
1937
3882
|
gap: "6px",
|
|
1938
3883
|
flex: 1,
|
|
1939
3884
|
padding: "10px 12px",
|
|
1940
|
-
backgroundColor:
|
|
1941
|
-
border: `1px solid ${
|
|
1942
|
-
borderBottom: isActive ? `1px solid ${
|
|
1943
|
-
borderLeft: index === 0 ? `1px solid ${
|
|
3885
|
+
backgroundColor: theme2.colors.background,
|
|
3886
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
3887
|
+
borderBottom: isActive ? `1px solid ${theme2.colors.background}` : `1px solid ${theme2.colors.border}`,
|
|
3888
|
+
borderLeft: index === 0 ? `1px solid ${theme2.colors.border}` : "none",
|
|
1944
3889
|
marginBottom: "-1px",
|
|
1945
3890
|
cursor: "pointer",
|
|
1946
|
-
fontFamily:
|
|
1947
|
-
fontSize:
|
|
3891
|
+
fontFamily: theme2.fonts.body,
|
|
3892
|
+
fontSize: theme2.fontSizes[0],
|
|
1948
3893
|
fontWeight: isActive ? 600 : 400,
|
|
1949
|
-
color: isActive ?
|
|
3894
|
+
color: isActive ? theme2.colors.text : theme2.colors.textSecondary,
|
|
1950
3895
|
opacity: isActive ? 1 : 0.9,
|
|
1951
3896
|
transition: "all 0.15s ease"
|
|
1952
3897
|
},
|
|
@@ -1957,7 +3902,7 @@ const LegendTabs = ({
|
|
|
1957
3902
|
style: {
|
|
1958
3903
|
display: "flex",
|
|
1959
3904
|
alignItems: "center",
|
|
1960
|
-
color: isActive ?
|
|
3905
|
+
color: isActive ? theme2.colors.primary : theme2.colors.textSecondary
|
|
1961
3906
|
},
|
|
1962
3907
|
children: tab.icon
|
|
1963
3908
|
}
|
|
@@ -1967,8 +3912,8 @@ const LegendTabs = ({
|
|
|
1967
3912
|
"span",
|
|
1968
3913
|
{
|
|
1969
3914
|
style: {
|
|
1970
|
-
backgroundColor: isActive ?
|
|
1971
|
-
color: isActive ?
|
|
3915
|
+
backgroundColor: isActive ? theme2.colors.primary : theme2.colors.border,
|
|
3916
|
+
color: isActive ? theme2.colors.background : theme2.colors.textSecondary,
|
|
1972
3917
|
padding: "1px 6px",
|
|
1973
3918
|
borderRadius: "8px",
|
|
1974
3919
|
fontSize: "10px",
|
|
@@ -1995,7 +3940,7 @@ const LegendTabs = ({
|
|
|
1995
3940
|
flex: 1,
|
|
1996
3941
|
minHeight: 0,
|
|
1997
3942
|
overflow: "auto",
|
|
1998
|
-
borderTop: `1px solid ${
|
|
3943
|
+
borderTop: `1px solid ${theme2.colors.border}`
|
|
1999
3944
|
},
|
|
2000
3945
|
children: activeTabData == null ? void 0 : activeTabData.content
|
|
2001
3946
|
}
|
|
@@ -2047,6 +3992,7 @@ function getAugmentedNamespace(n) {
|
|
|
2047
3992
|
}
|
|
2048
3993
|
var dist$1 = {};
|
|
2049
3994
|
var ArchitectureMapHighlightLayers = {};
|
|
3995
|
+
const require$$7 = /* @__PURE__ */ getAugmentedNamespace(esm$1);
|
|
2050
3996
|
var cityDataUtils = {};
|
|
2051
3997
|
var hasRequiredCityDataUtils;
|
|
2052
3998
|
function requireCityDataUtils() {
|
|
@@ -2937,7 +4883,7 @@ function requireArchitectureMapHighlightLayers() {
|
|
|
2937
4883
|
Object.defineProperty(ArchitectureMapHighlightLayers, "__esModule", { value: true });
|
|
2938
4884
|
ArchitectureMapHighlightLayers.ArchitectureMapHighlightLayers = void 0;
|
|
2939
4885
|
const react_1 = __importStar(React);
|
|
2940
|
-
const industry_theme_1 = require$$
|
|
4886
|
+
const industry_theme_1 = require$$7;
|
|
2941
4887
|
const cityDataUtils_1 = requireCityDataUtils();
|
|
2942
4888
|
const drawLayeredBuildings_1 = requireDrawLayeredBuildings();
|
|
2943
4889
|
const DEFAULT_DISPLAY_OPTIONS = {
|
|
@@ -3103,11 +5049,11 @@ function requireArchitectureMapHighlightLayers() {
|
|
|
3103
5049
|
buildingBorderRadius = 0,
|
|
3104
5050
|
districtBorderRadius = 0
|
|
3105
5051
|
}) {
|
|
3106
|
-
const { theme } = (0, industry_theme_1.useTheme)();
|
|
3107
|
-
const resolvedCanvasBackgroundColor = canvasBackgroundColor ??
|
|
3108
|
-
const resolvedHoverBorderColor = hoverBorderColor ??
|
|
3109
|
-
const resolvedDefaultDirectoryColor = defaultDirectoryColor ??
|
|
3110
|
-
const resolvedDefaultBuildingColor = defaultBuildingColor ??
|
|
5052
|
+
const { theme: theme2 } = (0, industry_theme_1.useTheme)();
|
|
5053
|
+
const resolvedCanvasBackgroundColor = canvasBackgroundColor ?? theme2.colors.background;
|
|
5054
|
+
const resolvedHoverBorderColor = hoverBorderColor ?? theme2.colors.text;
|
|
5055
|
+
const resolvedDefaultDirectoryColor = defaultDirectoryColor ?? theme2.colors.backgroundSecondary;
|
|
5056
|
+
const resolvedDefaultBuildingColor = defaultBuildingColor ?? theme2.colors.muted;
|
|
3111
5057
|
const canvasRef = (0, react_1.useRef)(null);
|
|
3112
5058
|
const containerRef = (0, react_1.useRef)(null);
|
|
3113
5059
|
const [interactionState, setInteractionState] = (0, react_1.useState)({
|
|
@@ -3935,14 +5881,14 @@ ${projectInfo.currentBranch}`;
|
|
|
3935
5881
|
width: "100%",
|
|
3936
5882
|
height: "100%",
|
|
3937
5883
|
minHeight: "250px",
|
|
3938
|
-
backgroundColor:
|
|
3939
|
-
borderRadius: `${
|
|
3940
|
-
padding: `${
|
|
5884
|
+
backgroundColor: theme2.colors.backgroundSecondary,
|
|
5885
|
+
borderRadius: `${theme2.radii[2]}px`,
|
|
5886
|
+
padding: `${theme2.space[4]}px`,
|
|
3941
5887
|
display: "flex",
|
|
3942
5888
|
alignItems: "center",
|
|
3943
5889
|
justifyContent: "center"
|
|
3944
5890
|
} },
|
|
3945
|
-
react_1.default.createElement("div", { style: { color:
|
|
5891
|
+
react_1.default.createElement("div", { style: { color: theme2.colors.textMuted, fontFamily: theme2.fonts.body } }, "No city data available")
|
|
3946
5892
|
);
|
|
3947
5893
|
}
|
|
3948
5894
|
return react_1.default.createElement(
|
|
@@ -3970,28 +5916,28 @@ ${projectInfo.currentBranch}`;
|
|
|
3970
5916
|
} },
|
|
3971
5917
|
showLayerControls && highlightLayers.length > 0 && react_1.default.createElement("div", { style: {
|
|
3972
5918
|
position: "absolute",
|
|
3973
|
-
bottom: `${
|
|
3974
|
-
left: `${
|
|
5919
|
+
bottom: `${theme2.space[4]}px`,
|
|
5920
|
+
left: `${theme2.space[4]}px`,
|
|
3975
5921
|
zIndex: 10,
|
|
3976
5922
|
display: "flex",
|
|
3977
5923
|
flexDirection: "column",
|
|
3978
|
-
gap: `${
|
|
5924
|
+
gap: `${theme2.space[2]}px`
|
|
3979
5925
|
} }, highlightLayers.map((layer) => react_1.default.createElement(
|
|
3980
5926
|
"button",
|
|
3981
5927
|
{ key: layer.id, onClick: () => onLayerToggle == null ? void 0 : onLayerToggle(layer.id, !layer.enabled), style: {
|
|
3982
|
-
padding: `${
|
|
3983
|
-
borderRadius: `${
|
|
5928
|
+
padding: `${theme2.space[2]}px ${theme2.space[3]}px`,
|
|
5929
|
+
borderRadius: `${theme2.radii[2]}px`,
|
|
3984
5930
|
boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
|
|
3985
5931
|
transition: "all 0.2s ease",
|
|
3986
5932
|
display: "flex",
|
|
3987
5933
|
alignItems: "center",
|
|
3988
|
-
gap: `${
|
|
3989
|
-
fontSize: `${
|
|
3990
|
-
fontWeight:
|
|
3991
|
-
fontFamily:
|
|
3992
|
-
backgroundColor: layer.enabled ?
|
|
3993
|
-
color: layer.enabled ?
|
|
3994
|
-
border: `2px solid ${layer.enabled ? layer.color :
|
|
5934
|
+
gap: `${theme2.space[2]}px`,
|
|
5935
|
+
fontSize: `${theme2.fontSizes[0]}px`,
|
|
5936
|
+
fontWeight: theme2.fontWeights.medium,
|
|
5937
|
+
fontFamily: theme2.fonts.body,
|
|
5938
|
+
backgroundColor: layer.enabled ? theme2.colors.backgroundSecondary : theme2.colors.background,
|
|
5939
|
+
color: layer.enabled ? theme2.colors.text : theme2.colors.textSecondary,
|
|
5940
|
+
border: `2px solid ${layer.enabled ? layer.color : theme2.colors.border}`,
|
|
3995
5941
|
minWidth: "120px",
|
|
3996
5942
|
cursor: "pointer"
|
|
3997
5943
|
}, title: `Toggle ${layer.name}` },
|
|
@@ -4005,8 +5951,8 @@ ${projectInfo.currentBranch}`;
|
|
|
4005
5951
|
} }),
|
|
4006
5952
|
react_1.default.createElement("span", { style: { textAlign: "left", flex: 1 } }, layer.name),
|
|
4007
5953
|
layer.items && layer.items.length > 0 && react_1.default.createElement("span", { style: {
|
|
4008
|
-
fontSize: `${
|
|
4009
|
-
color: layer.enabled ?
|
|
5954
|
+
fontSize: `${theme2.fontSizes[0]}px`,
|
|
5955
|
+
color: layer.enabled ? theme2.colors.textSecondary : theme2.colors.textMuted
|
|
4010
5956
|
} }, layer.items.length)
|
|
4011
5957
|
))),
|
|
4012
5958
|
react_1.default.createElement("canvas", { ref: canvasRef, style: {
|
|
@@ -13550,12 +15496,12 @@ function requireCityViewWithReactFlow() {
|
|
|
13550
15496
|
CityViewWithReactFlow.CityViewWithReactFlow = void 0;
|
|
13551
15497
|
const react_1 = __importStar(React);
|
|
13552
15498
|
const reactflow_1 = __importStar(require$$1);
|
|
13553
|
-
const industry_theme_1 = require$$
|
|
15499
|
+
const industry_theme_1 = require$$7;
|
|
13554
15500
|
const file_city_builder_1 = require$$4;
|
|
13555
15501
|
const ArchitectureMapHighlightLayers_1 = requireArchitectureMapHighlightLayers();
|
|
13556
15502
|
const CellNode = ({ data, selected }) => {
|
|
13557
15503
|
const { label, fileTree, fileCount, directoryCount } = data;
|
|
13558
|
-
const { theme } = (0, industry_theme_1.useTheme)();
|
|
15504
|
+
const { theme: theme2 } = (0, industry_theme_1.useTheme)();
|
|
13559
15505
|
const cityBuilder = (0, react_1.useMemo)(() => new file_city_builder_1.CodeCityBuilderWithGrid(), []);
|
|
13560
15506
|
const cityData = (0, react_1.useMemo)(() => {
|
|
13561
15507
|
if (!fileTree || !fileTree.root || fileTree.root.children.length === 0) {
|
|
@@ -13571,40 +15517,40 @@ function requireCityViewWithReactFlow() {
|
|
|
13571
15517
|
return react_1.default.createElement(
|
|
13572
15518
|
"div",
|
|
13573
15519
|
{ className: "cell-node", style: {
|
|
13574
|
-
background: selected ? `linear-gradient(135deg, ${
|
|
13575
|
-
borderRadius: `${
|
|
13576
|
-
padding: `${
|
|
15520
|
+
background: selected ? `linear-gradient(135deg, ${theme2.colors.primary} 0%, ${theme2.colors.accent} 100%)` : `linear-gradient(135deg, ${theme2.colors.backgroundSecondary} 0%, ${theme2.colors.background} 100%)`,
|
|
15521
|
+
borderRadius: `${theme2.radii[2]}px`,
|
|
15522
|
+
padding: `${theme2.space[3]}px`,
|
|
13577
15523
|
width: "450px",
|
|
13578
15524
|
height: "450px",
|
|
13579
|
-
border: selected ? `3px solid ${
|
|
13580
|
-
boxShadow: selected ? `0 10px 25px ${
|
|
15525
|
+
border: selected ? `3px solid ${theme2.colors.accent}` : `2px solid ${theme2.colors.border}`,
|
|
15526
|
+
boxShadow: selected ? `0 10px 25px ${theme2.colors.accent}30` : "0 4px 6px rgba(0, 0, 0, 0.1)",
|
|
13581
15527
|
display: "flex",
|
|
13582
15528
|
flexDirection: "column",
|
|
13583
15529
|
transition: "all 0.3s ease"
|
|
13584
15530
|
} },
|
|
13585
|
-
react_1.default.createElement(reactflow_1.Handle, { type: "target", position: reactflow_1.Position.Top, style: { background:
|
|
15531
|
+
react_1.default.createElement(reactflow_1.Handle, { type: "target", position: reactflow_1.Position.Top, style: { background: theme2.colors.accent } }),
|
|
13586
15532
|
react_1.default.createElement(
|
|
13587
15533
|
"div",
|
|
13588
15534
|
{ style: {
|
|
13589
|
-
marginBottom: `${
|
|
13590
|
-
paddingBottom: `${
|
|
13591
|
-
borderBottom: `1px solid ${
|
|
15535
|
+
marginBottom: `${theme2.space[2]}px`,
|
|
15536
|
+
paddingBottom: `${theme2.space[2]}px`,
|
|
15537
|
+
borderBottom: `1px solid ${theme2.colors.border}`
|
|
13592
15538
|
} },
|
|
13593
15539
|
react_1.default.createElement("h3", { style: {
|
|
13594
|
-
margin: `0 0 ${
|
|
13595
|
-
fontSize: `${
|
|
13596
|
-
fontWeight:
|
|
13597
|
-
fontFamily:
|
|
13598
|
-
color:
|
|
15540
|
+
margin: `0 0 ${theme2.space[1]}px 0`,
|
|
15541
|
+
fontSize: `${theme2.fontSizes[2]}px`,
|
|
15542
|
+
fontWeight: theme2.fontWeights.bold,
|
|
15543
|
+
fontFamily: theme2.fonts.heading,
|
|
15544
|
+
color: theme2.colors.text
|
|
13599
15545
|
} }, label),
|
|
13600
15546
|
react_1.default.createElement(
|
|
13601
15547
|
"div",
|
|
13602
15548
|
{ style: {
|
|
13603
|
-
fontSize: `${
|
|
13604
|
-
fontFamily:
|
|
13605
|
-
color:
|
|
15549
|
+
fontSize: `${theme2.fontSizes[0]}px`,
|
|
15550
|
+
fontFamily: theme2.fonts.body,
|
|
15551
|
+
color: theme2.colors.textSecondary,
|
|
13606
15552
|
display: "flex",
|
|
13607
|
-
gap: `${
|
|
15553
|
+
gap: `${theme2.space[3]}px`
|
|
13608
15554
|
} },
|
|
13609
15555
|
react_1.default.createElement(
|
|
13610
15556
|
"span",
|
|
@@ -13622,8 +15568,8 @@ function requireCityViewWithReactFlow() {
|
|
|
13622
15568
|
),
|
|
13623
15569
|
react_1.default.createElement("div", { style: {
|
|
13624
15570
|
position: "relative",
|
|
13625
|
-
background:
|
|
13626
|
-
borderRadius: `${
|
|
15571
|
+
background: theme2.colors.background,
|
|
15572
|
+
borderRadius: `${theme2.radii[1]}px`,
|
|
13627
15573
|
overflow: "hidden",
|
|
13628
15574
|
width: "350px",
|
|
13629
15575
|
height: "350px"
|
|
@@ -13637,7 +15583,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13637
15583
|
id: "typescript",
|
|
13638
15584
|
name: "TypeScript Files",
|
|
13639
15585
|
enabled: true,
|
|
13640
|
-
color:
|
|
15586
|
+
color: theme2.colors.success,
|
|
13641
15587
|
opacity: 0.8,
|
|
13642
15588
|
priority: 1,
|
|
13643
15589
|
items: cityData.buildings.filter((b) => b.path.endsWith(".ts") || b.path.endsWith(".tsx")).map((b) => ({
|
|
@@ -13649,9 +15595,9 @@ function requireCityViewWithReactFlow() {
|
|
|
13649
15595
|
],
|
|
13650
15596
|
showGrid: false,
|
|
13651
15597
|
showDirectoryLabels: false,
|
|
13652
|
-
canvasBackgroundColor:
|
|
13653
|
-
defaultBuildingColor:
|
|
13654
|
-
defaultDirectoryColor:
|
|
15598
|
+
canvasBackgroundColor: theme2.colors.background,
|
|
15599
|
+
defaultBuildingColor: theme2.colors.muted,
|
|
15600
|
+
defaultDirectoryColor: theme2.colors.backgroundSecondary,
|
|
13655
15601
|
className: "w-full h-full",
|
|
13656
15602
|
// Disable interactions to prevent conflicts with React Flow
|
|
13657
15603
|
onFileClick: void 0
|
|
@@ -13661,18 +15607,18 @@ function requireCityViewWithReactFlow() {
|
|
|
13661
15607
|
alignItems: "center",
|
|
13662
15608
|
justifyContent: "center",
|
|
13663
15609
|
height: "100%",
|
|
13664
|
-
color:
|
|
13665
|
-
fontSize: `${
|
|
13666
|
-
fontFamily:
|
|
15610
|
+
color: theme2.colors.textMuted,
|
|
15611
|
+
fontSize: `${theme2.fontSizes[1]}px`,
|
|
15612
|
+
fontFamily: theme2.fonts.body
|
|
13667
15613
|
} }, "Empty cell")),
|
|
13668
|
-
react_1.default.createElement(reactflow_1.Handle, { type: "source", position: reactflow_1.Position.Bottom, style: { background:
|
|
15614
|
+
react_1.default.createElement(reactflow_1.Handle, { type: "source", position: reactflow_1.Position.Bottom, style: { background: theme2.colors.accent } })
|
|
13669
15615
|
);
|
|
13670
15616
|
};
|
|
13671
15617
|
const nodeTypes = {
|
|
13672
15618
|
cellNode: CellNode
|
|
13673
15619
|
};
|
|
13674
15620
|
const CityViewWithReactFlowInner = ({ fileTree, gridConfig, onCellClick, cellWidth = 450, cellHeight = 350, cellSpacing = 100 }) => {
|
|
13675
|
-
const { theme } = (0, industry_theme_1.useTheme)();
|
|
15621
|
+
const { theme: theme2 } = (0, industry_theme_1.useTheme)();
|
|
13676
15622
|
const defaultGridConfig = {
|
|
13677
15623
|
id: "default",
|
|
13678
15624
|
version: "1.0",
|
|
@@ -13743,7 +15689,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13743
15689
|
type: "straight",
|
|
13744
15690
|
animated: false,
|
|
13745
15691
|
style: {
|
|
13746
|
-
stroke: `${
|
|
15692
|
+
stroke: `${theme2.colors.border}40`,
|
|
13747
15693
|
strokeWidth: 1,
|
|
13748
15694
|
strokeDasharray: "5 10"
|
|
13749
15695
|
}
|
|
@@ -13760,7 +15706,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13760
15706
|
type: "straight",
|
|
13761
15707
|
animated: false,
|
|
13762
15708
|
style: {
|
|
13763
|
-
stroke: `${
|
|
15709
|
+
stroke: `${theme2.colors.border}40`,
|
|
13764
15710
|
strokeWidth: 1,
|
|
13765
15711
|
strokeDasharray: "5 10"
|
|
13766
15712
|
}
|
|
@@ -13770,7 +15716,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13770
15716
|
}
|
|
13771
15717
|
}
|
|
13772
15718
|
return { nodes: generatedNodes, edges: generatedEdges };
|
|
13773
|
-
}, [fileTree, config, cellWidth, cellHeight, cellSpacing,
|
|
15719
|
+
}, [fileTree, config, cellWidth, cellHeight, cellSpacing, theme2]);
|
|
13774
15720
|
const [nodesState, , onNodesChange] = (0, reactflow_1.useNodesState)(nodes);
|
|
13775
15721
|
const [edgesState, , onEdgesChange] = (0, reactflow_1.useEdgesState)(edges);
|
|
13776
15722
|
const onNodeClick = (0, react_1.useCallback)((_event, node) => {
|
|
@@ -13780,18 +15726,18 @@ function requireCityViewWithReactFlow() {
|
|
|
13780
15726
|
}, [onCellClick]);
|
|
13781
15727
|
return react_1.default.createElement(
|
|
13782
15728
|
"div",
|
|
13783
|
-
{ style: { width: "100%", height: "100%", background:
|
|
15729
|
+
{ style: { width: "100%", height: "100%", background: theme2.colors.background } },
|
|
13784
15730
|
react_1.default.createElement(
|
|
13785
15731
|
reactflow_1.ReactFlowProvider,
|
|
13786
15732
|
null,
|
|
13787
15733
|
react_1.default.createElement(
|
|
13788
15734
|
reactflow_1.default,
|
|
13789
15735
|
{ nodes: nodesState, edges: edgesState, onNodesChange, onEdgesChange, onNodeClick, nodeTypes, fitView: true, fitViewOptions: { padding: 0.2 }, attributionPosition: "bottom-left", defaultViewport: { x: 0, y: 0, zoom: 0.8 }, minZoom: 0.2, maxZoom: 2 },
|
|
13790
|
-
react_1.default.createElement(reactflow_1.Background, { variant: reactflow_1.BackgroundVariant.Dots, gap: 30, size: 1, color: `${
|
|
15736
|
+
react_1.default.createElement(reactflow_1.Background, { variant: reactflow_1.BackgroundVariant.Dots, gap: 30, size: 1, color: `${theme2.colors.border}40` }),
|
|
13791
15737
|
react_1.default.createElement(reactflow_1.Controls, null),
|
|
13792
|
-
react_1.default.createElement(reactflow_1.MiniMap, { nodeColor: () =>
|
|
13793
|
-
backgroundColor:
|
|
13794
|
-
border: `1px solid ${
|
|
15738
|
+
react_1.default.createElement(reactflow_1.MiniMap, { nodeColor: () => theme2.colors.primary, style: {
|
|
15739
|
+
backgroundColor: theme2.colors.backgroundSecondary,
|
|
15740
|
+
border: `1px solid ${theme2.colors.border}`
|
|
13795
15741
|
}, maskColor: "rgba(0, 0, 0, 0.6)" })
|
|
13796
15742
|
)
|
|
13797
15743
|
)
|
|
@@ -13847,7 +15793,7 @@ function requireDist() {
|
|
|
13847
15793
|
Object.defineProperty(exports$1, "CityViewWithReactFlow", { enumerable: true, get: function() {
|
|
13848
15794
|
return CityViewWithReactFlow_1.CityViewWithReactFlow;
|
|
13849
15795
|
} });
|
|
13850
|
-
var industry_theme_1 = require$$
|
|
15796
|
+
var industry_theme_1 = require$$7;
|
|
13851
15797
|
Object.defineProperty(exports$1, "ThemeProvider", { enumerable: true, get: function() {
|
|
13852
15798
|
return industry_theme_1.ThemeProvider;
|
|
13853
15799
|
} });
|
|
@@ -15512,7 +17458,7 @@ const CodeCityPanelContent = ({
|
|
|
15512
17458
|
events
|
|
15513
17459
|
}) => {
|
|
15514
17460
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
|
|
15515
|
-
const { theme } = useTheme();
|
|
17461
|
+
const { theme: theme2 } = useTheme();
|
|
15516
17462
|
const [cityData, setCityData] = useState(null);
|
|
15517
17463
|
const [hoverInfo, setHoverInfo] = useState(null);
|
|
15518
17464
|
const [highlightLayers, setHighlightLayers] = useState([]);
|
|
@@ -16424,7 +18370,7 @@ const CodeCityPanelContent = ({
|
|
|
16424
18370
|
flexDirection: "column",
|
|
16425
18371
|
height: "100%",
|
|
16426
18372
|
width: "100%",
|
|
16427
|
-
backgroundColor:
|
|
18373
|
+
backgroundColor: theme2.colors.background
|
|
16428
18374
|
},
|
|
16429
18375
|
children: [
|
|
16430
18376
|
/* @__PURE__ */ jsxs(
|
|
@@ -16436,8 +18382,8 @@ const CodeCityPanelContent = ({
|
|
|
16436
18382
|
justifyContent: "space-between",
|
|
16437
18383
|
padding: "0 16px",
|
|
16438
18384
|
height: "40px",
|
|
16439
|
-
borderBottom: `1px solid ${
|
|
16440
|
-
backgroundColor:
|
|
18385
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
18386
|
+
backgroundColor: theme2.colors.background,
|
|
16441
18387
|
flexShrink: 0,
|
|
16442
18388
|
gap: "12px"
|
|
16443
18389
|
},
|
|
@@ -16449,8 +18395,8 @@ const CodeCityPanelContent = ({
|
|
|
16449
18395
|
style: { display: "flex", alignItems: "center", gap: "4px", whiteSpace: "nowrap" },
|
|
16450
18396
|
title: `${computedTreeStats.fileCount.toLocaleString()} files`,
|
|
16451
18397
|
children: [
|
|
16452
|
-
/* @__PURE__ */ jsx(File, { size: 14, style: { color:
|
|
16453
|
-
/* @__PURE__ */ jsxs("span", { style: { fontSize:
|
|
18398
|
+
/* @__PURE__ */ jsx(File, { size: 14, style: { color: theme2.colors.textSecondary, flexShrink: 0 } }),
|
|
18399
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: theme2.fontSizes[1], fontFamily: theme2.fonts.body, color: theme2.colors.text }, children: [
|
|
16454
18400
|
computedTreeStats.fileCount.toLocaleString(),
|
|
16455
18401
|
!headerCompact && " files"
|
|
16456
18402
|
] })
|
|
@@ -16463,8 +18409,8 @@ const CodeCityPanelContent = ({
|
|
|
16463
18409
|
style: { display: "flex", alignItems: "center", gap: "4px", whiteSpace: "nowrap" },
|
|
16464
18410
|
title: `${computedTreeStats.directoryCount.toLocaleString()} folders`,
|
|
16465
18411
|
children: [
|
|
16466
|
-
/* @__PURE__ */ jsx(Folder, { size: 14, style: { color:
|
|
16467
|
-
/* @__PURE__ */ jsxs("span", { style: { fontSize:
|
|
18412
|
+
/* @__PURE__ */ jsx(Folder, { size: 14, style: { color: theme2.colors.textSecondary, flexShrink: 0 } }),
|
|
18413
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: theme2.fontSizes[1], fontFamily: theme2.fonts.body, color: theme2.colors.text }, children: [
|
|
16468
18414
|
computedTreeStats.directoryCount.toLocaleString(),
|
|
16469
18415
|
!headerCompact && " folders"
|
|
16470
18416
|
] })
|
|
@@ -16477,10 +18423,10 @@ const CodeCityPanelContent = ({
|
|
|
16477
18423
|
{
|
|
16478
18424
|
style: {
|
|
16479
18425
|
padding: "4px 10px",
|
|
16480
|
-
fontSize:
|
|
16481
|
-
fontFamily:
|
|
16482
|
-
color:
|
|
16483
|
-
backgroundColor:
|
|
18426
|
+
fontSize: theme2.fontSizes[0],
|
|
18427
|
+
fontFamily: theme2.fonts.body,
|
|
18428
|
+
color: theme2.colors.primary,
|
|
18429
|
+
backgroundColor: theme2.colors.primary + "15",
|
|
16484
18430
|
borderRadius: "4px"
|
|
16485
18431
|
},
|
|
16486
18432
|
children: currentColorModeConfig.name
|
|
@@ -16524,7 +18470,7 @@ const CodeCityPanelContent = ({
|
|
|
16524
18470
|
alignItems: "center",
|
|
16525
18471
|
justifyContent: "center",
|
|
16526
18472
|
height: "100%",
|
|
16527
|
-
color:
|
|
18473
|
+
color: theme2.colors.textSecondary
|
|
16528
18474
|
},
|
|
16529
18475
|
children: "Loading repository structure..."
|
|
16530
18476
|
}
|
|
@@ -16537,7 +18483,7 @@ const CodeCityPanelContent = ({
|
|
|
16537
18483
|
alignItems: "center",
|
|
16538
18484
|
justifyContent: "center",
|
|
16539
18485
|
height: "100%",
|
|
16540
|
-
color:
|
|
18486
|
+
color: theme2.colors.textSecondary,
|
|
16541
18487
|
gap: "12px"
|
|
16542
18488
|
},
|
|
16543
18489
|
children: [
|
|
@@ -16571,14 +18517,14 @@ const CodeCityPanelContent = ({
|
|
|
16571
18517
|
{
|
|
16572
18518
|
style: {
|
|
16573
18519
|
height: selectedPackagePath ? "68px" : "48px",
|
|
16574
|
-
borderTop: `1px solid ${
|
|
16575
|
-
backgroundColor:
|
|
18520
|
+
borderTop: `1px solid ${theme2.colors.border}`,
|
|
18521
|
+
backgroundColor: theme2.colors.background,
|
|
16576
18522
|
display: "flex",
|
|
16577
18523
|
flexDirection: "column",
|
|
16578
18524
|
padding: "0 12px",
|
|
16579
|
-
fontSize:
|
|
16580
|
-
fontFamily:
|
|
16581
|
-
color:
|
|
18525
|
+
fontSize: theme2.fontSizes[0],
|
|
18526
|
+
fontFamily: theme2.fonts.body,
|
|
18527
|
+
color: theme2.colors.text,
|
|
16582
18528
|
flexShrink: 0
|
|
16583
18529
|
},
|
|
16584
18530
|
children: [
|
|
@@ -16597,14 +18543,14 @@ const CodeCityPanelContent = ({
|
|
|
16597
18543
|
{
|
|
16598
18544
|
style: {
|
|
16599
18545
|
padding: "2px 8px",
|
|
16600
|
-
backgroundColor:
|
|
16601
|
-
color:
|
|
18546
|
+
backgroundColor: theme2.colors.primary + "20",
|
|
18547
|
+
color: theme2.colors.primary,
|
|
16602
18548
|
borderRadius: "4px",
|
|
16603
18549
|
fontWeight: 500,
|
|
16604
18550
|
display: "flex",
|
|
16605
18551
|
alignItems: "center",
|
|
16606
18552
|
gap: "6px",
|
|
16607
|
-
fontSize:
|
|
18553
|
+
fontSize: theme2.fontSizes[0]
|
|
16608
18554
|
},
|
|
16609
18555
|
children: [
|
|
16610
18556
|
/* @__PURE__ */ jsx(Folder, { size: 10 }),
|
|
@@ -16641,9 +18587,9 @@ const CodeCityPanelContent = ({
|
|
|
16641
18587
|
{
|
|
16642
18588
|
style: {
|
|
16643
18589
|
fontWeight: 600,
|
|
16644
|
-
fontFamily:
|
|
16645
|
-
color:
|
|
16646
|
-
fontSize:
|
|
18590
|
+
fontFamily: theme2.fonts.monospace,
|
|
18591
|
+
color: theme2.colors.primary,
|
|
18592
|
+
fontSize: theme2.fontSizes[1],
|
|
16647
18593
|
overflow: "hidden",
|
|
16648
18594
|
textOverflow: "ellipsis",
|
|
16649
18595
|
whiteSpace: "nowrap"
|
|
@@ -16655,9 +18601,9 @@ const CodeCityPanelContent = ({
|
|
|
16655
18601
|
"div",
|
|
16656
18602
|
{
|
|
16657
18603
|
style: {
|
|
16658
|
-
fontFamily:
|
|
16659
|
-
color:
|
|
16660
|
-
fontSize:
|
|
18604
|
+
fontFamily: theme2.fonts.monospace,
|
|
18605
|
+
color: theme2.colors.textSecondary,
|
|
18606
|
+
fontSize: theme2.fontSizes[0],
|
|
16661
18607
|
overflow: "hidden",
|
|
16662
18608
|
textOverflow: "ellipsis",
|
|
16663
18609
|
whiteSpace: "nowrap"
|
|
@@ -16672,9 +18618,9 @@ const CodeCityPanelContent = ({
|
|
|
16672
18618
|
"div",
|
|
16673
18619
|
{
|
|
16674
18620
|
style: {
|
|
16675
|
-
fontFamily:
|
|
16676
|
-
color:
|
|
16677
|
-
fontSize:
|
|
18621
|
+
fontFamily: theme2.fonts.body,
|
|
18622
|
+
color: theme2.colors.textSecondary,
|
|
18623
|
+
fontSize: theme2.fontSizes[0],
|
|
16678
18624
|
flexShrink: 0
|
|
16679
18625
|
},
|
|
16680
18626
|
children: [
|
|
@@ -16692,13 +18638,13 @@ const CodeCityPanelContent = ({
|
|
|
16692
18638
|
alignItems: "center",
|
|
16693
18639
|
gap: "6px",
|
|
16694
18640
|
padding: "4px 10px",
|
|
16695
|
-
backgroundColor:
|
|
18641
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
16696
18642
|
borderRadius: "4px",
|
|
16697
|
-
border: `1px solid ${
|
|
16698
|
-
fontSize:
|
|
16699
|
-
fontFamily:
|
|
18643
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
18644
|
+
fontSize: theme2.fontSizes[0],
|
|
18645
|
+
fontFamily: theme2.fonts.body,
|
|
16700
18646
|
fontWeight: 500,
|
|
16701
|
-
color: hoveredFileMetric.value === null ?
|
|
18647
|
+
color: hoveredFileMetric.value === null ? theme2.colors.textSecondary : theme2.colors.text,
|
|
16702
18648
|
flexShrink: 0
|
|
16703
18649
|
},
|
|
16704
18650
|
children: hoveredFileMetric.label
|
|
@@ -16713,9 +18659,9 @@ const CodeCityPanelContent = ({
|
|
|
16713
18659
|
display: "flex",
|
|
16714
18660
|
alignItems: "center",
|
|
16715
18661
|
gap: "8px",
|
|
16716
|
-
color:
|
|
16717
|
-
fontSize:
|
|
16718
|
-
fontFamily:
|
|
18662
|
+
color: theme2.colors.text,
|
|
18663
|
+
fontSize: theme2.fontSizes[0],
|
|
18664
|
+
fontFamily: theme2.fonts.body
|
|
16719
18665
|
},
|
|
16720
18666
|
children: [
|
|
16721
18667
|
/* @__PURE__ */ jsxs(
|
|
@@ -16723,8 +18669,8 @@ const CodeCityPanelContent = ({
|
|
|
16723
18669
|
{
|
|
16724
18670
|
style: {
|
|
16725
18671
|
padding: "4px 10px",
|
|
16726
|
-
backgroundColor:
|
|
16727
|
-
color:
|
|
18672
|
+
backgroundColor: theme2.colors.accent + "20",
|
|
18673
|
+
color: theme2.colors.accent,
|
|
16728
18674
|
borderRadius: "4px",
|
|
16729
18675
|
fontWeight: 500,
|
|
16730
18676
|
display: "flex",
|
|
@@ -16738,7 +18684,7 @@ const CodeCityPanelContent = ({
|
|
|
16738
18684
|
]
|
|
16739
18685
|
}
|
|
16740
18686
|
),
|
|
16741
|
-
/* @__PURE__ */ jsx("span", { style: { color:
|
|
18687
|
+
/* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary, fontStyle: "italic" }, children: "Files outside this package are dimmed" })
|
|
16742
18688
|
]
|
|
16743
18689
|
}
|
|
16744
18690
|
)
|
|
@@ -16748,10 +18694,10 @@ const CodeCityPanelContent = ({
|
|
|
16748
18694
|
"div",
|
|
16749
18695
|
{
|
|
16750
18696
|
style: {
|
|
16751
|
-
color:
|
|
18697
|
+
color: theme2.colors.textSecondary,
|
|
16752
18698
|
fontStyle: "italic",
|
|
16753
|
-
fontSize:
|
|
16754
|
-
fontFamily:
|
|
18699
|
+
fontSize: theme2.fontSizes[0],
|
|
18700
|
+
fontFamily: theme2.fonts.body
|
|
16755
18701
|
},
|
|
16756
18702
|
children: "Hover over files and directories to see details • Click to open"
|
|
16757
18703
|
}
|
|
@@ -16883,11 +18829,11 @@ function adjustBrightness(color2, percent) {
|
|
|
16883
18829
|
return color2;
|
|
16884
18830
|
}
|
|
16885
18831
|
const FeedProjectHeaderSkeleton = ({ compact = false }) => {
|
|
16886
|
-
const { theme } = useTheme();
|
|
18832
|
+
const { theme: theme2 } = useTheme();
|
|
16887
18833
|
React.useEffect(() => {
|
|
16888
18834
|
injectShimmerStyles();
|
|
16889
18835
|
}, []);
|
|
16890
|
-
const shimmerBg =
|
|
18836
|
+
const shimmerBg = theme2.colors.backgroundLight || "#2a2a2a";
|
|
16891
18837
|
return /* @__PURE__ */ jsxs(
|
|
16892
18838
|
"div",
|
|
16893
18839
|
{
|
|
@@ -16896,8 +18842,8 @@ const FeedProjectHeaderSkeleton = ({ compact = false }) => {
|
|
|
16896
18842
|
flexDirection: "column",
|
|
16897
18843
|
gap: compact ? 8 : 12,
|
|
16898
18844
|
padding: compact ? "10px 12px" : "14px 16px",
|
|
16899
|
-
backgroundColor:
|
|
16900
|
-
borderBottom: `1px solid ${
|
|
18845
|
+
backgroundColor: theme2.colors.background,
|
|
18846
|
+
borderBottom: `1px solid ${theme2.colors.border}`
|
|
16901
18847
|
},
|
|
16902
18848
|
children: [
|
|
16903
18849
|
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12 }, children: [
|
|
@@ -16940,10 +18886,10 @@ const FeedProjectHeader = ({
|
|
|
16940
18886
|
onOpen,
|
|
16941
18887
|
compact = false
|
|
16942
18888
|
}) => {
|
|
16943
|
-
const { theme } = useTheme();
|
|
16944
|
-
const fontSizeSmall =
|
|
16945
|
-
const fontSizeMedium =
|
|
16946
|
-
const fontSizeLarge =
|
|
18889
|
+
const { theme: theme2 } = useTheme();
|
|
18890
|
+
const fontSizeSmall = theme2.fontSizes[0];
|
|
18891
|
+
const fontSizeMedium = theme2.fontSizes[1];
|
|
18892
|
+
const fontSizeLarge = theme2.fontSizes[2] || theme2.fontSizes[1];
|
|
16947
18893
|
return /* @__PURE__ */ jsxs(
|
|
16948
18894
|
"div",
|
|
16949
18895
|
{
|
|
@@ -16952,9 +18898,9 @@ const FeedProjectHeader = ({
|
|
|
16952
18898
|
flexDirection: "column",
|
|
16953
18899
|
gap: compact ? 8 : 12,
|
|
16954
18900
|
padding: compact ? "10px 12px" : "14px 16px",
|
|
16955
|
-
backgroundColor:
|
|
16956
|
-
borderBottom: `1px solid ${
|
|
16957
|
-
fontFamily:
|
|
18901
|
+
backgroundColor: theme2.colors.background,
|
|
18902
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
18903
|
+
fontFamily: theme2.fonts.body
|
|
16958
18904
|
},
|
|
16959
18905
|
children: [
|
|
16960
18906
|
/* @__PURE__ */ jsxs(
|
|
@@ -16987,13 +18933,13 @@ const FeedProjectHeader = ({
|
|
|
16987
18933
|
width: compact ? 24 : 28,
|
|
16988
18934
|
height: compact ? 24 : 28,
|
|
16989
18935
|
borderRadius: repo.isOrganization ? "6px" : "50%",
|
|
16990
|
-
backgroundColor:
|
|
18936
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
16991
18937
|
display: "flex",
|
|
16992
18938
|
alignItems: "center",
|
|
16993
18939
|
justifyContent: "center",
|
|
16994
18940
|
flexShrink: 0
|
|
16995
18941
|
},
|
|
16996
|
-
children: repo.isOrganization ? /* @__PURE__ */ jsx(Building2, { size: 14, color:
|
|
18942
|
+
children: repo.isOrganization ? /* @__PURE__ */ jsx(Building2, { size: 14, color: theme2.colors.textSecondary }) : /* @__PURE__ */ jsx(User, { size: 14, color: theme2.colors.textSecondary })
|
|
16997
18943
|
}
|
|
16998
18944
|
),
|
|
16999
18945
|
/* @__PURE__ */ jsx(
|
|
@@ -17002,7 +18948,7 @@ const FeedProjectHeader = ({
|
|
|
17002
18948
|
style: {
|
|
17003
18949
|
fontSize: compact ? fontSizeMedium : fontSizeLarge,
|
|
17004
18950
|
fontWeight: 600,
|
|
17005
|
-
color:
|
|
18951
|
+
color: theme2.colors.text,
|
|
17006
18952
|
overflow: "hidden",
|
|
17007
18953
|
textOverflow: "ellipsis",
|
|
17008
18954
|
whiteSpace: "nowrap"
|
|
@@ -17021,7 +18967,7 @@ const FeedProjectHeader = ({
|
|
|
17021
18967
|
alignItems: "center",
|
|
17022
18968
|
gap: 4,
|
|
17023
18969
|
fontSize: fontSizeSmall,
|
|
17024
|
-
color:
|
|
18970
|
+
color: theme2.colors.textSecondary
|
|
17025
18971
|
},
|
|
17026
18972
|
children: [
|
|
17027
18973
|
/* @__PURE__ */ jsx(Scale, { size: 12 }),
|
|
@@ -17040,9 +18986,9 @@ const FeedProjectHeader = ({
|
|
|
17040
18986
|
padding: "5px 12px",
|
|
17041
18987
|
fontSize: fontSizeSmall,
|
|
17042
18988
|
fontWeight: 500,
|
|
17043
|
-
fontFamily:
|
|
18989
|
+
fontFamily: theme2.fonts.body,
|
|
17044
18990
|
color: "#ffffff",
|
|
17045
|
-
backgroundColor:
|
|
18991
|
+
backgroundColor: theme2.colors.primary,
|
|
17046
18992
|
border: "none",
|
|
17047
18993
|
borderRadius: "4px",
|
|
17048
18994
|
cursor: "pointer",
|
|
@@ -17071,7 +19017,7 @@ const FeedProjectHeader = ({
|
|
|
17071
19017
|
style: {
|
|
17072
19018
|
margin: 0,
|
|
17073
19019
|
fontSize: fontSizeMedium,
|
|
17074
|
-
color:
|
|
19020
|
+
color: theme2.colors.textSecondary,
|
|
17075
19021
|
lineHeight: 1.5,
|
|
17076
19022
|
display: "-webkit-box",
|
|
17077
19023
|
WebkitLineClamp: 2,
|
|
@@ -17100,7 +19046,7 @@ const FeedProjectHeader = ({
|
|
|
17100
19046
|
alignItems: "center",
|
|
17101
19047
|
gap: 4,
|
|
17102
19048
|
fontSize: fontSizeSmall,
|
|
17103
|
-
color:
|
|
19049
|
+
color: theme2.colors.textSecondary
|
|
17104
19050
|
},
|
|
17105
19051
|
title: `${repo.stars.toLocaleString()} stars`,
|
|
17106
19052
|
children: [
|
|
@@ -17117,7 +19063,7 @@ const FeedProjectHeader = ({
|
|
|
17117
19063
|
alignItems: "center",
|
|
17118
19064
|
gap: 4,
|
|
17119
19065
|
fontSize: fontSizeSmall,
|
|
17120
|
-
color:
|
|
19066
|
+
color: theme2.colors.textSecondary
|
|
17121
19067
|
},
|
|
17122
19068
|
title: `${repo.forks.toLocaleString()} forks`,
|
|
17123
19069
|
children: [
|
|
@@ -17134,7 +19080,7 @@ const FeedProjectHeader = ({
|
|
|
17134
19080
|
alignItems: "center",
|
|
17135
19081
|
gap: 4,
|
|
17136
19082
|
fontSize: fontSizeSmall,
|
|
17137
|
-
color:
|
|
19083
|
+
color: theme2.colors.textSecondary
|
|
17138
19084
|
},
|
|
17139
19085
|
title: `${repo.watchers.toLocaleString()} watching`,
|
|
17140
19086
|
children: [
|
|
@@ -17151,7 +19097,7 @@ const FeedProjectHeader = ({
|
|
|
17151
19097
|
alignItems: "center",
|
|
17152
19098
|
gap: 4,
|
|
17153
19099
|
fontSize: fontSizeSmall,
|
|
17154
|
-
color:
|
|
19100
|
+
color: theme2.colors.textSecondary
|
|
17155
19101
|
},
|
|
17156
19102
|
title: `${repo.openIssues.toLocaleString()} open issues`,
|
|
17157
19103
|
children: [
|
|
@@ -17171,7 +19117,7 @@ const FeedProjectHeader = ({
|
|
|
17171
19117
|
alignItems: "center",
|
|
17172
19118
|
gap: 4,
|
|
17173
19119
|
fontSize: fontSizeSmall,
|
|
17174
|
-
color:
|
|
19120
|
+
color: theme2.colors.textSecondary,
|
|
17175
19121
|
textDecoration: "none"
|
|
17176
19122
|
},
|
|
17177
19123
|
title: repo.htmlUrl,
|
|
@@ -17194,7 +19140,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17194
19140
|
events
|
|
17195
19141
|
}) => {
|
|
17196
19142
|
var _a, _b, _c, _d, _e, _f;
|
|
17197
|
-
const { theme } = useTheme();
|
|
19143
|
+
const { theme: theme2 } = useTheme();
|
|
17198
19144
|
const [cityData, setCityData] = useState(null);
|
|
17199
19145
|
const [hoverInfo, setHoverInfo] = useState(null);
|
|
17200
19146
|
const [highlightLayers, setHighlightLayers] = useState([]);
|
|
@@ -17341,7 +19287,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17341
19287
|
flexDirection: "column",
|
|
17342
19288
|
height: "100%",
|
|
17343
19289
|
width: "100%",
|
|
17344
|
-
backgroundColor:
|
|
19290
|
+
backgroundColor: theme2.colors.background
|
|
17345
19291
|
},
|
|
17346
19292
|
children: [
|
|
17347
19293
|
feedProjectLoading ? /* @__PURE__ */ jsx(FeedProjectHeaderSkeleton, {}) : (feedProjectData == null ? void 0 : feedProjectData.repo) ? /* @__PURE__ */ jsx(
|
|
@@ -17385,7 +19331,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17385
19331
|
alignItems: "center",
|
|
17386
19332
|
justifyContent: "center",
|
|
17387
19333
|
height: "100%",
|
|
17388
|
-
color:
|
|
19334
|
+
color: theme2.colors.textSecondary
|
|
17389
19335
|
},
|
|
17390
19336
|
children: "Loading repository structure..."
|
|
17391
19337
|
}
|
|
@@ -17398,7 +19344,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17398
19344
|
alignItems: "center",
|
|
17399
19345
|
justifyContent: "center",
|
|
17400
19346
|
height: "100%",
|
|
17401
|
-
color:
|
|
19347
|
+
color: theme2.colors.textSecondary,
|
|
17402
19348
|
gap: "12px"
|
|
17403
19349
|
},
|
|
17404
19350
|
children: [
|
|
@@ -17430,14 +19376,14 @@ const FeedCodeCityPanelContent = ({
|
|
|
17430
19376
|
{
|
|
17431
19377
|
style: {
|
|
17432
19378
|
height: "48px",
|
|
17433
|
-
borderTop: `1px solid ${
|
|
17434
|
-
backgroundColor:
|
|
19379
|
+
borderTop: `1px solid ${theme2.colors.border}`,
|
|
19380
|
+
backgroundColor: theme2.colors.background,
|
|
17435
19381
|
display: "flex",
|
|
17436
19382
|
alignItems: "center",
|
|
17437
19383
|
padding: "0 12px",
|
|
17438
|
-
fontSize:
|
|
17439
|
-
fontFamily:
|
|
17440
|
-
color:
|
|
19384
|
+
fontSize: theme2.fontSizes[0],
|
|
19385
|
+
fontFamily: theme2.fonts.body,
|
|
19386
|
+
color: theme2.colors.text,
|
|
17441
19387
|
flexShrink: 0
|
|
17442
19388
|
},
|
|
17443
19389
|
children: hoverInfo && (hoverInfo.hoveredBuilding || hoverInfo.hoveredDistrict) ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
@@ -17457,9 +19403,9 @@ const FeedCodeCityPanelContent = ({
|
|
|
17457
19403
|
{
|
|
17458
19404
|
style: {
|
|
17459
19405
|
fontWeight: 600,
|
|
17460
|
-
fontFamily:
|
|
17461
|
-
color:
|
|
17462
|
-
fontSize:
|
|
19406
|
+
fontFamily: theme2.fonts.monospace,
|
|
19407
|
+
color: theme2.colors.primary,
|
|
19408
|
+
fontSize: theme2.fontSizes[1],
|
|
17463
19409
|
overflow: "hidden",
|
|
17464
19410
|
textOverflow: "ellipsis",
|
|
17465
19411
|
whiteSpace: "nowrap"
|
|
@@ -17471,9 +19417,9 @@ const FeedCodeCityPanelContent = ({
|
|
|
17471
19417
|
"div",
|
|
17472
19418
|
{
|
|
17473
19419
|
style: {
|
|
17474
|
-
fontFamily:
|
|
17475
|
-
color:
|
|
17476
|
-
fontSize:
|
|
19420
|
+
fontFamily: theme2.fonts.monospace,
|
|
19421
|
+
color: theme2.colors.textSecondary,
|
|
19422
|
+
fontSize: theme2.fontSizes[0],
|
|
17477
19423
|
overflow: "hidden",
|
|
17478
19424
|
textOverflow: "ellipsis",
|
|
17479
19425
|
whiteSpace: "nowrap"
|
|
@@ -17488,8 +19434,8 @@ const FeedCodeCityPanelContent = ({
|
|
|
17488
19434
|
"div",
|
|
17489
19435
|
{
|
|
17490
19436
|
style: {
|
|
17491
|
-
fontSize:
|
|
17492
|
-
color:
|
|
19437
|
+
fontSize: theme2.fontSizes[0],
|
|
19438
|
+
color: theme2.colors.textSecondary,
|
|
17493
19439
|
whiteSpace: "nowrap"
|
|
17494
19440
|
},
|
|
17495
19441
|
children: [
|
|
@@ -17499,7 +19445,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17499
19445
|
]
|
|
17500
19446
|
}
|
|
17501
19447
|
)
|
|
17502
|
-
] }) : /* @__PURE__ */ jsx("div", { style: { color:
|
|
19448
|
+
] }) : /* @__PURE__ */ jsx("div", { style: { color: theme2.colors.textSecondary, fontStyle: "italic" }, children: "Hover over the map to see file details" })
|
|
17503
19449
|
}
|
|
17504
19450
|
)
|
|
17505
19451
|
]
|
|
@@ -17645,11 +19591,11 @@ const ProjectInfoHeader = ({
|
|
|
17645
19591
|
onOpen,
|
|
17646
19592
|
compact = false
|
|
17647
19593
|
}) => {
|
|
17648
|
-
const { theme } = useTheme();
|
|
19594
|
+
const { theme: theme2 } = useTheme();
|
|
17649
19595
|
const totalDeps = (project.dependencyCount || 0) + (project.devDependencyCount || 0);
|
|
17650
|
-
const fontSizeSmall =
|
|
17651
|
-
const fontSizeMedium =
|
|
17652
|
-
const fontSizeLarge =
|
|
19596
|
+
const fontSizeSmall = theme2.fontSizes[0];
|
|
19597
|
+
const fontSizeMedium = theme2.fontSizes[1];
|
|
19598
|
+
const fontSizeLarge = theme2.fontSizes[2] || theme2.fontSizes[1];
|
|
17653
19599
|
return /* @__PURE__ */ jsxs(
|
|
17654
19600
|
"div",
|
|
17655
19601
|
{
|
|
@@ -17658,9 +19604,9 @@ const ProjectInfoHeader = ({
|
|
|
17658
19604
|
flexDirection: "column",
|
|
17659
19605
|
gap: compact ? 4 : 8,
|
|
17660
19606
|
padding: compact ? "8px 12px" : "12px 16px",
|
|
17661
|
-
backgroundColor:
|
|
17662
|
-
borderBottom: `1px solid ${
|
|
17663
|
-
fontFamily:
|
|
19607
|
+
backgroundColor: theme2.colors.background,
|
|
19608
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
19609
|
+
fontFamily: theme2.fonts.body,
|
|
17664
19610
|
minHeight: compact ? 48 : "auto"
|
|
17665
19611
|
},
|
|
17666
19612
|
children: [
|
|
@@ -17680,7 +19626,7 @@ const ProjectInfoHeader = ({
|
|
|
17680
19626
|
{
|
|
17681
19627
|
packageManager: project.packageManager,
|
|
17682
19628
|
size: compact ? 18 : 20,
|
|
17683
|
-
color:
|
|
19629
|
+
color: theme2.colors.textSecondary
|
|
17684
19630
|
}
|
|
17685
19631
|
) }),
|
|
17686
19632
|
/* @__PURE__ */ jsx(
|
|
@@ -17689,7 +19635,7 @@ const ProjectInfoHeader = ({
|
|
|
17689
19635
|
style: {
|
|
17690
19636
|
fontSize: compact ? fontSizeMedium : fontSizeLarge,
|
|
17691
19637
|
fontWeight: 600,
|
|
17692
|
-
color:
|
|
19638
|
+
color: theme2.colors.text,
|
|
17693
19639
|
overflow: "hidden",
|
|
17694
19640
|
textOverflow: "ellipsis",
|
|
17695
19641
|
whiteSpace: "nowrap"
|
|
@@ -17703,8 +19649,8 @@ const ProjectInfoHeader = ({
|
|
|
17703
19649
|
{
|
|
17704
19650
|
style: {
|
|
17705
19651
|
fontSize: fontSizeSmall,
|
|
17706
|
-
color:
|
|
17707
|
-
backgroundColor:
|
|
19652
|
+
color: theme2.colors.textSecondary,
|
|
19653
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
17708
19654
|
padding: "2px 6px",
|
|
17709
19655
|
borderRadius: "4px",
|
|
17710
19656
|
flexShrink: 0
|
|
@@ -17747,9 +19693,9 @@ const ProjectInfoHeader = ({
|
|
|
17747
19693
|
padding: "4px 10px",
|
|
17748
19694
|
fontSize: fontSizeSmall,
|
|
17749
19695
|
fontWeight: 500,
|
|
17750
|
-
fontFamily:
|
|
19696
|
+
fontFamily: theme2.fonts.body,
|
|
17751
19697
|
color: "#ffffff",
|
|
17752
|
-
backgroundColor:
|
|
19698
|
+
backgroundColor: theme2.colors.primary,
|
|
17753
19699
|
border: "none",
|
|
17754
19700
|
borderRadius: "4px",
|
|
17755
19701
|
cursor: "pointer",
|
|
@@ -17777,7 +19723,7 @@ const ProjectInfoHeader = ({
|
|
|
17777
19723
|
style: {
|
|
17778
19724
|
margin: 0,
|
|
17779
19725
|
fontSize: fontSizeSmall,
|
|
17780
|
-
color:
|
|
19726
|
+
color: theme2.colors.textSecondary,
|
|
17781
19727
|
overflow: "hidden",
|
|
17782
19728
|
textOverflow: "ellipsis",
|
|
17783
19729
|
whiteSpace: "nowrap"
|
|
@@ -17804,7 +19750,7 @@ const ProjectInfoHeader = ({
|
|
|
17804
19750
|
alignItems: "center",
|
|
17805
19751
|
gap: 4,
|
|
17806
19752
|
fontSize: fontSizeSmall,
|
|
17807
|
-
color:
|
|
19753
|
+
color: theme2.colors.textSecondary
|
|
17808
19754
|
},
|
|
17809
19755
|
title: `License: ${project.license}`,
|
|
17810
19756
|
children: [
|
|
@@ -17821,7 +19767,7 @@ const ProjectInfoHeader = ({
|
|
|
17821
19767
|
alignItems: "center",
|
|
17822
19768
|
gap: 4,
|
|
17823
19769
|
fontSize: fontSizeSmall,
|
|
17824
|
-
color:
|
|
19770
|
+
color: theme2.colors.textSecondary
|
|
17825
19771
|
},
|
|
17826
19772
|
title: `${project.dependencyCount || 0} prod, ${project.devDependencyCount || 0} dev dependencies`,
|
|
17827
19773
|
children: [
|
|
@@ -17842,7 +19788,7 @@ const ProjectInfoHeader = ({
|
|
|
17842
19788
|
alignItems: "center",
|
|
17843
19789
|
gap: 4,
|
|
17844
19790
|
fontSize: fontSizeSmall,
|
|
17845
|
-
color:
|
|
19791
|
+
color: theme2.colors.textSecondary
|
|
17846
19792
|
},
|
|
17847
19793
|
title: `Author: ${project.author}`,
|
|
17848
19794
|
children: [
|