@industry-theme/file-city-panel 0.2.52 → 0.2.53
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 +2242 -298
- package/dist/panels.bundle.js.map +1 -1
- package/package.json +2 -3
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,
|
|
@@ -682,7 +2625,7 @@ const PrChangesTree = ({
|
|
|
682
2625
|
onFileClick,
|
|
683
2626
|
onNodeHover
|
|
684
2627
|
}) => {
|
|
685
|
-
const { theme } = useTheme();
|
|
2628
|
+
const { theme: theme2 } = useTheme();
|
|
686
2629
|
const hasChanges = useMemo(
|
|
687
2630
|
() => prFiles.added.length > 0 || prFiles.modified.length > 0 || prFiles.removed.length > 0 || prFiles.renamed.length > 0,
|
|
688
2631
|
[prFiles.added.length, prFiles.modified.length, prFiles.removed.length, prFiles.renamed.length]
|
|
@@ -762,9 +2705,9 @@ const PrChangesTree = ({
|
|
|
762
2705
|
{
|
|
763
2706
|
style: {
|
|
764
2707
|
padding: "12px 0",
|
|
765
|
-
fontSize:
|
|
766
|
-
fontFamily:
|
|
767
|
-
color:
|
|
2708
|
+
fontSize: theme2.fontSizes[0],
|
|
2709
|
+
fontFamily: theme2.fonts.body,
|
|
2710
|
+
color: theme2.colors.textSecondary,
|
|
768
2711
|
fontStyle: "italic",
|
|
769
2712
|
textAlign: "center"
|
|
770
2713
|
},
|
|
@@ -779,7 +2722,7 @@ const PrChangesTree = ({
|
|
|
779
2722
|
GitStatusFileTree,
|
|
780
2723
|
{
|
|
781
2724
|
fileTree: prChangesData.tree,
|
|
782
|
-
theme,
|
|
2725
|
+
theme: theme2,
|
|
783
2726
|
gitStatusData: prChangesData.statusData,
|
|
784
2727
|
onFileSelect: handleFileSelect,
|
|
785
2728
|
onNodeHover,
|
|
@@ -798,7 +2741,7 @@ const CommitChangesTree = ({
|
|
|
798
2741
|
onFileClick,
|
|
799
2742
|
onNodeHover
|
|
800
2743
|
}) => {
|
|
801
|
-
const { theme } = useTheme();
|
|
2744
|
+
const { theme: theme2 } = useTheme();
|
|
802
2745
|
const hasChanges = useMemo(
|
|
803
2746
|
() => commitFiles.added.length > 0 || commitFiles.modified.length > 0 || commitFiles.removed.length > 0 || commitFiles.renamed.length > 0,
|
|
804
2747
|
[commitFiles.added.length, commitFiles.modified.length, commitFiles.removed.length, commitFiles.renamed.length]
|
|
@@ -874,9 +2817,9 @@ const CommitChangesTree = ({
|
|
|
874
2817
|
{
|
|
875
2818
|
style: {
|
|
876
2819
|
padding: "12px 0",
|
|
877
|
-
fontSize:
|
|
878
|
-
fontFamily:
|
|
879
|
-
color:
|
|
2820
|
+
fontSize: theme2.fontSizes[0],
|
|
2821
|
+
fontFamily: theme2.fonts.body,
|
|
2822
|
+
color: theme2.colors.textSecondary,
|
|
880
2823
|
fontStyle: "italic",
|
|
881
2824
|
textAlign: "center"
|
|
882
2825
|
},
|
|
@@ -891,7 +2834,7 @@ const CommitChangesTree = ({
|
|
|
891
2834
|
GitStatusFileTree,
|
|
892
2835
|
{
|
|
893
2836
|
fileTree: commitChangesData.tree,
|
|
894
|
-
theme,
|
|
2837
|
+
theme: theme2,
|
|
895
2838
|
gitStatusData: commitChangesData.statusData,
|
|
896
2839
|
onFileSelect: handleFileSelect,
|
|
897
2840
|
onNodeHover,
|
|
@@ -927,7 +2870,7 @@ const Legend = ({
|
|
|
927
2870
|
onClearAgentLayers,
|
|
928
2871
|
position = "bottom"
|
|
929
2872
|
}) => {
|
|
930
|
-
const { theme } = useTheme();
|
|
2873
|
+
const { theme: theme2 } = useTheme();
|
|
931
2874
|
const hasGitStatus = gitStatus != null && (gitStatus.staged.length > 0 || gitStatus.unstaged.length > 0 || gitStatus.untracked.length > 0 || gitStatus.deleted.length > 0);
|
|
932
2875
|
const hasPrFiles = prFiles != null && (prFiles.added.length > 0 || prFiles.modified.length > 0 || prFiles.removed.length > 0 || prFiles.renamed.length > 0);
|
|
933
2876
|
const hasCommitFiles = commitFiles != null && (commitFiles.added.length > 0 || commitFiles.modified.length > 0 || commitFiles.removed.length > 0 || commitFiles.renamed.length > 0);
|
|
@@ -952,9 +2895,9 @@ const Legend = ({
|
|
|
952
2895
|
flexDirection: "column",
|
|
953
2896
|
gap: "12px",
|
|
954
2897
|
padding: `12px 0`,
|
|
955
|
-
backgroundColor:
|
|
956
|
-
borderTop: isRight ? "none" : `1px solid ${
|
|
957
|
-
borderLeft: isRight ? `1px solid ${
|
|
2898
|
+
backgroundColor: theme2.colors.background,
|
|
2899
|
+
borderTop: isRight ? "none" : `1px solid ${theme2.colors.border}`,
|
|
2900
|
+
borderLeft: isRight ? `1px solid ${theme2.colors.border}` : "none",
|
|
958
2901
|
boxSizing: "border-box",
|
|
959
2902
|
flex: 1,
|
|
960
2903
|
minWidth: 0,
|
|
@@ -970,9 +2913,9 @@ const Legend = ({
|
|
|
970
2913
|
alignItems: "center",
|
|
971
2914
|
justifyContent: "center",
|
|
972
2915
|
padding: `8px ${horizontalPadding}`,
|
|
973
|
-
fontSize:
|
|
974
|
-
fontFamily:
|
|
975
|
-
color:
|
|
2916
|
+
fontSize: theme2.fontSizes[0],
|
|
2917
|
+
fontFamily: theme2.fonts.body,
|
|
2918
|
+
color: theme2.colors.textSecondary,
|
|
976
2919
|
fontStyle: "italic"
|
|
977
2920
|
},
|
|
978
2921
|
children: [
|
|
@@ -989,10 +2932,10 @@ const Legend = ({
|
|
|
989
2932
|
display: "flex",
|
|
990
2933
|
alignItems: "center",
|
|
991
2934
|
gap: "6px",
|
|
992
|
-
fontSize:
|
|
993
|
-
fontFamily:
|
|
2935
|
+
fontSize: theme2.fontSizes[0],
|
|
2936
|
+
fontFamily: theme2.fonts.body,
|
|
994
2937
|
fontWeight: 600,
|
|
995
|
-
color:
|
|
2938
|
+
color: theme2.colors.textSecondary,
|
|
996
2939
|
textTransform: "uppercase",
|
|
997
2940
|
letterSpacing: "0.5px"
|
|
998
2941
|
},
|
|
@@ -1019,8 +2962,8 @@ const Legend = ({
|
|
|
1019
2962
|
alignItems: "center",
|
|
1020
2963
|
gap: "8px",
|
|
1021
2964
|
padding: "6px 10px",
|
|
1022
|
-
backgroundColor:
|
|
1023
|
-
border: `1px solid ${
|
|
2965
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
2966
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1024
2967
|
borderRadius: "4px",
|
|
1025
2968
|
cursor: onQualityMetricClick ? "pointer" : "default",
|
|
1026
2969
|
opacity: metric.enabled ? 1 : 0.4,
|
|
@@ -1048,9 +2991,9 @@ const Legend = ({
|
|
|
1048
2991
|
"span",
|
|
1049
2992
|
{
|
|
1050
2993
|
style: {
|
|
1051
|
-
fontSize:
|
|
1052
|
-
fontFamily:
|
|
1053
|
-
color:
|
|
2994
|
+
fontSize: theme2.fontSizes[0],
|
|
2995
|
+
fontFamily: theme2.fonts.body,
|
|
2996
|
+
color: theme2.colors.text,
|
|
1054
2997
|
whiteSpace: "nowrap",
|
|
1055
2998
|
overflow: "hidden",
|
|
1056
2999
|
textOverflow: "ellipsis",
|
|
@@ -1064,9 +3007,9 @@ const Legend = ({
|
|
|
1064
3007
|
"span",
|
|
1065
3008
|
{
|
|
1066
3009
|
style: {
|
|
1067
|
-
fontSize:
|
|
1068
|
-
fontFamily:
|
|
1069
|
-
color:
|
|
3010
|
+
fontSize: theme2.fontSizes[0],
|
|
3011
|
+
fontFamily: theme2.fonts.body,
|
|
3012
|
+
color: theme2.colors.textSecondary,
|
|
1070
3013
|
flexShrink: 0
|
|
1071
3014
|
},
|
|
1072
3015
|
children: [
|
|
@@ -1100,10 +3043,10 @@ const Legend = ({
|
|
|
1100
3043
|
display: "flex",
|
|
1101
3044
|
alignItems: "center",
|
|
1102
3045
|
gap: "6px",
|
|
1103
|
-
fontSize:
|
|
1104
|
-
fontFamily:
|
|
3046
|
+
fontSize: theme2.fontSizes[0],
|
|
3047
|
+
fontFamily: theme2.fonts.body,
|
|
1105
3048
|
fontWeight: 600,
|
|
1106
|
-
color:
|
|
3049
|
+
color: theme2.colors.primary,
|
|
1107
3050
|
textTransform: "uppercase",
|
|
1108
3051
|
letterSpacing: "0.5px"
|
|
1109
3052
|
},
|
|
@@ -1122,11 +3065,11 @@ const Legend = ({
|
|
|
1122
3065
|
alignItems: "center",
|
|
1123
3066
|
gap: "4px",
|
|
1124
3067
|
padding: "2px 6px",
|
|
1125
|
-
fontSize:
|
|
1126
|
-
fontFamily:
|
|
1127
|
-
color:
|
|
3068
|
+
fontSize: theme2.fontSizes[0],
|
|
3069
|
+
fontFamily: theme2.fonts.body,
|
|
3070
|
+
color: theme2.colors.textSecondary,
|
|
1128
3071
|
backgroundColor: "transparent",
|
|
1129
|
-
border: `1px solid ${
|
|
3072
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1130
3073
|
borderRadius: "3px",
|
|
1131
3074
|
cursor: "pointer",
|
|
1132
3075
|
transition: "all 0.15s ease"
|
|
@@ -1158,8 +3101,8 @@ const Legend = ({
|
|
|
1158
3101
|
alignItems: "center",
|
|
1159
3102
|
gap: "8px",
|
|
1160
3103
|
padding: "6px 10px",
|
|
1161
|
-
backgroundColor:
|
|
1162
|
-
border: `1px solid ${
|
|
3104
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3105
|
+
border: `1px solid ${theme2.colors.primary}40`,
|
|
1163
3106
|
borderRadius: "4px",
|
|
1164
3107
|
cursor: onAgentLayerClick ? "pointer" : "default",
|
|
1165
3108
|
opacity: layer.enabled ? 1 : 0.4,
|
|
@@ -1187,9 +3130,9 @@ const Legend = ({
|
|
|
1187
3130
|
"span",
|
|
1188
3131
|
{
|
|
1189
3132
|
style: {
|
|
1190
|
-
fontSize:
|
|
1191
|
-
fontFamily:
|
|
1192
|
-
color:
|
|
3133
|
+
fontSize: theme2.fontSizes[0],
|
|
3134
|
+
fontFamily: theme2.fonts.body,
|
|
3135
|
+
color: theme2.colors.text,
|
|
1193
3136
|
whiteSpace: "nowrap",
|
|
1194
3137
|
overflow: "hidden",
|
|
1195
3138
|
textOverflow: "ellipsis",
|
|
@@ -1203,9 +3146,9 @@ const Legend = ({
|
|
|
1203
3146
|
"span",
|
|
1204
3147
|
{
|
|
1205
3148
|
style: {
|
|
1206
|
-
fontSize:
|
|
1207
|
-
fontFamily:
|
|
1208
|
-
color:
|
|
3149
|
+
fontSize: theme2.fontSizes[0],
|
|
3150
|
+
fontFamily: theme2.fonts.body,
|
|
3151
|
+
color: theme2.colors.textSecondary,
|
|
1209
3152
|
flexShrink: 0
|
|
1210
3153
|
},
|
|
1211
3154
|
children: layer.count
|
|
@@ -1223,10 +3166,10 @@ const Legend = ({
|
|
|
1223
3166
|
"div",
|
|
1224
3167
|
{
|
|
1225
3168
|
style: {
|
|
1226
|
-
fontSize:
|
|
1227
|
-
fontFamily:
|
|
3169
|
+
fontSize: theme2.fontSizes[0],
|
|
3170
|
+
fontFamily: theme2.fonts.body,
|
|
1228
3171
|
fontWeight: 600,
|
|
1229
|
-
color:
|
|
3172
|
+
color: theme2.colors.textSecondary,
|
|
1230
3173
|
textTransform: "uppercase",
|
|
1231
3174
|
letterSpacing: "0.5px",
|
|
1232
3175
|
padding: `0 ${horizontalPadding}`
|
|
@@ -1254,10 +3197,10 @@ const Legend = ({
|
|
|
1254
3197
|
display: "flex",
|
|
1255
3198
|
alignItems: "center",
|
|
1256
3199
|
gap: "6px",
|
|
1257
|
-
fontSize:
|
|
1258
|
-
fontFamily:
|
|
3200
|
+
fontSize: theme2.fontSizes[0],
|
|
3201
|
+
fontFamily: theme2.fonts.body,
|
|
1259
3202
|
fontWeight: 600,
|
|
1260
|
-
color:
|
|
3203
|
+
color: theme2.colors.textSecondary,
|
|
1261
3204
|
textTransform: "uppercase",
|
|
1262
3205
|
letterSpacing: "0.5px",
|
|
1263
3206
|
flexShrink: 0,
|
|
@@ -1290,10 +3233,10 @@ const Legend = ({
|
|
|
1290
3233
|
display: "flex",
|
|
1291
3234
|
alignItems: "center",
|
|
1292
3235
|
gap: "6px",
|
|
1293
|
-
fontSize:
|
|
1294
|
-
fontFamily:
|
|
3236
|
+
fontSize: theme2.fontSizes[0],
|
|
3237
|
+
fontFamily: theme2.fonts.body,
|
|
1295
3238
|
fontWeight: 600,
|
|
1296
|
-
color:
|
|
3239
|
+
color: theme2.colors.textSecondary,
|
|
1297
3240
|
textTransform: "uppercase",
|
|
1298
3241
|
letterSpacing: "0.5px",
|
|
1299
3242
|
flexShrink: 0,
|
|
@@ -1323,10 +3266,10 @@ const Legend = ({
|
|
|
1323
3266
|
"div",
|
|
1324
3267
|
{
|
|
1325
3268
|
style: {
|
|
1326
|
-
fontSize:
|
|
1327
|
-
fontFamily:
|
|
3269
|
+
fontSize: theme2.fontSizes[0],
|
|
3270
|
+
fontFamily: theme2.fonts.body,
|
|
1328
3271
|
fontWeight: 600,
|
|
1329
|
-
color:
|
|
3272
|
+
color: theme2.colors.textSecondary,
|
|
1330
3273
|
textTransform: "uppercase",
|
|
1331
3274
|
letterSpacing: "0.5px"
|
|
1332
3275
|
},
|
|
@@ -1350,8 +3293,8 @@ const Legend = ({
|
|
|
1350
3293
|
alignItems: "center",
|
|
1351
3294
|
gap: "8px",
|
|
1352
3295
|
padding: "6px 10px",
|
|
1353
|
-
backgroundColor:
|
|
1354
|
-
border: `1px solid ${
|
|
3296
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3297
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1355
3298
|
borderRadius: "4px",
|
|
1356
3299
|
cursor: onItemClick ? "pointer" : "default",
|
|
1357
3300
|
opacity: fileType.enabled ? 1 : 0.4,
|
|
@@ -1380,9 +3323,9 @@ const Legend = ({
|
|
|
1380
3323
|
"span",
|
|
1381
3324
|
{
|
|
1382
3325
|
style: {
|
|
1383
|
-
fontSize:
|
|
1384
|
-
fontFamily:
|
|
1385
|
-
color:
|
|
3326
|
+
fontSize: theme2.fontSizes[0],
|
|
3327
|
+
fontFamily: theme2.fonts.body,
|
|
3328
|
+
color: theme2.colors.text,
|
|
1386
3329
|
whiteSpace: "nowrap",
|
|
1387
3330
|
overflow: "hidden",
|
|
1388
3331
|
textOverflow: "ellipsis",
|
|
@@ -1396,9 +3339,9 @@ const Legend = ({
|
|
|
1396
3339
|
"span",
|
|
1397
3340
|
{
|
|
1398
3341
|
style: {
|
|
1399
|
-
fontSize:
|
|
1400
|
-
fontFamily:
|
|
1401
|
-
color:
|
|
3342
|
+
fontSize: theme2.fontSizes[0],
|
|
3343
|
+
fontFamily: theme2.fonts.body,
|
|
3344
|
+
color: theme2.colors.textSecondary,
|
|
1402
3345
|
flexShrink: 0
|
|
1403
3346
|
},
|
|
1404
3347
|
children: fileType.count
|
|
@@ -1421,7 +3364,7 @@ const AgentActivityView = ({
|
|
|
1421
3364
|
onClearAll,
|
|
1422
3365
|
showHeader = true
|
|
1423
3366
|
}) => {
|
|
1424
|
-
const { theme } = useTheme();
|
|
3367
|
+
const { theme: theme2 } = useTheme();
|
|
1425
3368
|
const [expandedLayers, setExpandedLayers] = React.useState(/* @__PURE__ */ new Set());
|
|
1426
3369
|
const toggleExpanded = (id2) => {
|
|
1427
3370
|
setExpandedLayers((prev) => {
|
|
@@ -1459,9 +3402,9 @@ const AgentActivityView = ({
|
|
|
1459
3402
|
display: "flex",
|
|
1460
3403
|
flexDirection: "column",
|
|
1461
3404
|
flex: 1,
|
|
1462
|
-
backgroundColor:
|
|
3405
|
+
backgroundColor: theme2.colors.background,
|
|
1463
3406
|
...showHeader && {
|
|
1464
|
-
border: `1px solid ${
|
|
3407
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1465
3408
|
borderRadius: "6px"
|
|
1466
3409
|
},
|
|
1467
3410
|
overflow: "hidden"
|
|
@@ -1475,8 +3418,8 @@ const AgentActivityView = ({
|
|
|
1475
3418
|
alignItems: "center",
|
|
1476
3419
|
justifyContent: "space-between",
|
|
1477
3420
|
padding: "12px 16px",
|
|
1478
|
-
backgroundColor:
|
|
1479
|
-
borderBottom: `1px solid ${
|
|
3421
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3422
|
+
borderBottom: `1px solid ${theme2.colors.border}`
|
|
1480
3423
|
},
|
|
1481
3424
|
children: /* @__PURE__ */ jsxs(
|
|
1482
3425
|
"div",
|
|
@@ -1485,10 +3428,10 @@ const AgentActivityView = ({
|
|
|
1485
3428
|
display: "flex",
|
|
1486
3429
|
alignItems: "center",
|
|
1487
3430
|
gap: "8px",
|
|
1488
|
-
color:
|
|
1489
|
-
fontFamily:
|
|
3431
|
+
color: theme2.colors.primary,
|
|
3432
|
+
fontFamily: theme2.fonts.body,
|
|
1490
3433
|
fontWeight: 600,
|
|
1491
|
-
fontSize:
|
|
3434
|
+
fontSize: theme2.fontSizes[1]
|
|
1492
3435
|
},
|
|
1493
3436
|
children: [
|
|
1494
3437
|
/* @__PURE__ */ jsx(Activity, { size: 16 }),
|
|
@@ -1508,9 +3451,9 @@ const AgentActivityView = ({
|
|
|
1508
3451
|
justifyContent: "center",
|
|
1509
3452
|
flex: 1,
|
|
1510
3453
|
padding: "32px 16px",
|
|
1511
|
-
color:
|
|
1512
|
-
fontFamily:
|
|
1513
|
-
fontSize:
|
|
3454
|
+
color: theme2.colors.textSecondary,
|
|
3455
|
+
fontFamily: theme2.fonts.body,
|
|
3456
|
+
fontSize: theme2.fontSizes[0]
|
|
1514
3457
|
},
|
|
1515
3458
|
children: [
|
|
1516
3459
|
/* @__PURE__ */ jsx(Activity, { size: 32, style: { opacity: 0.3, marginBottom: "8px" } }),
|
|
@@ -1529,9 +3472,9 @@ const AgentActivityView = ({
|
|
|
1529
3472
|
display: "flex",
|
|
1530
3473
|
flexDirection: "column",
|
|
1531
3474
|
flex: 1,
|
|
1532
|
-
backgroundColor:
|
|
3475
|
+
backgroundColor: theme2.colors.background,
|
|
1533
3476
|
...showHeader && {
|
|
1534
|
-
border: `1px solid ${
|
|
3477
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1535
3478
|
borderRadius: "6px"
|
|
1536
3479
|
},
|
|
1537
3480
|
overflow: "hidden"
|
|
@@ -1545,8 +3488,8 @@ const AgentActivityView = ({
|
|
|
1545
3488
|
alignItems: "center",
|
|
1546
3489
|
justifyContent: "space-between",
|
|
1547
3490
|
padding: "12px 16px",
|
|
1548
|
-
backgroundColor:
|
|
1549
|
-
borderBottom: `1px solid ${
|
|
3491
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3492
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
1550
3493
|
flexShrink: 0
|
|
1551
3494
|
},
|
|
1552
3495
|
children: [
|
|
@@ -1557,10 +3500,10 @@ const AgentActivityView = ({
|
|
|
1557
3500
|
display: "flex",
|
|
1558
3501
|
alignItems: "center",
|
|
1559
3502
|
gap: "8px",
|
|
1560
|
-
color:
|
|
1561
|
-
fontFamily:
|
|
3503
|
+
color: theme2.colors.primary,
|
|
3504
|
+
fontFamily: theme2.fonts.body,
|
|
1562
3505
|
fontWeight: 600,
|
|
1563
|
-
fontSize:
|
|
3506
|
+
fontSize: theme2.fontSizes[1]
|
|
1564
3507
|
},
|
|
1565
3508
|
children: [
|
|
1566
3509
|
/* @__PURE__ */ jsx(Activity, { size: 16 }),
|
|
@@ -1569,11 +3512,11 @@ const AgentActivityView = ({
|
|
|
1569
3512
|
"span",
|
|
1570
3513
|
{
|
|
1571
3514
|
style: {
|
|
1572
|
-
backgroundColor:
|
|
1573
|
-
color:
|
|
3515
|
+
backgroundColor: theme2.colors.primary,
|
|
3516
|
+
color: theme2.colors.background,
|
|
1574
3517
|
padding: "2px 8px",
|
|
1575
3518
|
borderRadius: "10px",
|
|
1576
|
-
fontSize:
|
|
3519
|
+
fontSize: theme2.fontSizes[0],
|
|
1577
3520
|
fontWeight: 500
|
|
1578
3521
|
},
|
|
1579
3522
|
children: layers.length
|
|
@@ -1591,11 +3534,11 @@ const AgentActivityView = ({
|
|
|
1591
3534
|
alignItems: "center",
|
|
1592
3535
|
gap: "4px",
|
|
1593
3536
|
padding: "4px 10px",
|
|
1594
|
-
fontSize:
|
|
1595
|
-
fontFamily:
|
|
1596
|
-
color:
|
|
3537
|
+
fontSize: theme2.fontSizes[0],
|
|
3538
|
+
fontFamily: theme2.fonts.body,
|
|
3539
|
+
color: theme2.colors.textSecondary,
|
|
1597
3540
|
backgroundColor: "transparent",
|
|
1598
|
-
border: `1px solid ${
|
|
3541
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1599
3542
|
borderRadius: "4px",
|
|
1600
3543
|
cursor: "pointer",
|
|
1601
3544
|
transition: "all 0.15s ease"
|
|
@@ -1626,7 +3569,7 @@ const AgentActivityView = ({
|
|
|
1626
3569
|
"div",
|
|
1627
3570
|
{
|
|
1628
3571
|
style: {
|
|
1629
|
-
borderBottom: index < layers.length - 1 ? `1px solid ${
|
|
3572
|
+
borderBottom: index < layers.length - 1 ? `1px solid ${theme2.colors.border}` : "none"
|
|
1630
3573
|
},
|
|
1631
3574
|
children: [
|
|
1632
3575
|
/* @__PURE__ */ jsxs(
|
|
@@ -1638,7 +3581,7 @@ const AgentActivityView = ({
|
|
|
1638
3581
|
alignItems: "center",
|
|
1639
3582
|
gap: "12px",
|
|
1640
3583
|
padding: "12px 16px",
|
|
1641
|
-
backgroundColor: layer.enabled ? "transparent" : `${
|
|
3584
|
+
backgroundColor: layer.enabled ? "transparent" : `${theme2.colors.backgroundLight}`,
|
|
1642
3585
|
opacity: layer.enabled ? 1 : 0.6,
|
|
1643
3586
|
cursor: "pointer",
|
|
1644
3587
|
transition: "all 0.15s ease"
|
|
@@ -1653,7 +3596,7 @@ const AgentActivityView = ({
|
|
|
1653
3596
|
justifyContent: "center",
|
|
1654
3597
|
width: "20px",
|
|
1655
3598
|
height: "20px",
|
|
1656
|
-
color:
|
|
3599
|
+
color: theme2.colors.textSecondary,
|
|
1657
3600
|
flexShrink: 0
|
|
1658
3601
|
},
|
|
1659
3602
|
children: isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { size: 16 }) : /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
|
|
@@ -1695,10 +3638,10 @@ const AgentActivityView = ({
|
|
|
1695
3638
|
"span",
|
|
1696
3639
|
{
|
|
1697
3640
|
style: {
|
|
1698
|
-
fontFamily:
|
|
1699
|
-
fontSize:
|
|
3641
|
+
fontFamily: theme2.fonts.body,
|
|
3642
|
+
fontSize: theme2.fontSizes[1],
|
|
1700
3643
|
fontWeight: 500,
|
|
1701
|
-
color:
|
|
3644
|
+
color: theme2.colors.text,
|
|
1702
3645
|
overflow: "hidden",
|
|
1703
3646
|
textOverflow: "ellipsis",
|
|
1704
3647
|
whiteSpace: "nowrap"
|
|
@@ -1715,9 +3658,9 @@ const AgentActivityView = ({
|
|
|
1715
3658
|
display: "flex",
|
|
1716
3659
|
alignItems: "center",
|
|
1717
3660
|
gap: "12px",
|
|
1718
|
-
fontFamily:
|
|
1719
|
-
fontSize:
|
|
1720
|
-
color:
|
|
3661
|
+
fontFamily: theme2.fonts.body,
|
|
3662
|
+
fontSize: theme2.fontSizes[0],
|
|
3663
|
+
color: theme2.colors.textSecondary
|
|
1721
3664
|
},
|
|
1722
3665
|
children: [
|
|
1723
3666
|
/* @__PURE__ */ jsxs("span", { children: [
|
|
@@ -1747,10 +3690,10 @@ const AgentActivityView = ({
|
|
|
1747
3690
|
height: "32px",
|
|
1748
3691
|
padding: 0,
|
|
1749
3692
|
backgroundColor: "transparent",
|
|
1750
|
-
border: `1px solid ${
|
|
3693
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
1751
3694
|
borderRadius: "4px",
|
|
1752
3695
|
cursor: onLayerClick ? "pointer" : "default",
|
|
1753
|
-
color: layer.enabled ?
|
|
3696
|
+
color: layer.enabled ? theme2.colors.primary : theme2.colors.textSecondary,
|
|
1754
3697
|
flexShrink: 0,
|
|
1755
3698
|
transition: "all 0.15s ease"
|
|
1756
3699
|
},
|
|
@@ -1765,8 +3708,8 @@ const AgentActivityView = ({
|
|
|
1765
3708
|
"div",
|
|
1766
3709
|
{
|
|
1767
3710
|
style: {
|
|
1768
|
-
backgroundColor:
|
|
1769
|
-
borderTop: `1px solid ${
|
|
3711
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
3712
|
+
borderTop: `1px solid ${theme2.colors.border}`
|
|
1770
3713
|
},
|
|
1771
3714
|
children: layer.items.map((item, itemIndex) => /* @__PURE__ */ jsxs(
|
|
1772
3715
|
"div",
|
|
@@ -1776,7 +3719,7 @@ const AgentActivityView = ({
|
|
|
1776
3719
|
alignItems: "center",
|
|
1777
3720
|
gap: "8px",
|
|
1778
3721
|
padding: "8px 16px 8px 48px",
|
|
1779
|
-
borderBottom: itemIndex < layer.items.length - 1 ? `1px solid ${
|
|
3722
|
+
borderBottom: itemIndex < layer.items.length - 1 ? `1px solid ${theme2.colors.border}40` : "none"
|
|
1780
3723
|
},
|
|
1781
3724
|
children: [
|
|
1782
3725
|
/* @__PURE__ */ jsx(
|
|
@@ -1804,9 +3747,9 @@ const AgentActivityView = ({
|
|
|
1804
3747
|
"span",
|
|
1805
3748
|
{
|
|
1806
3749
|
style: {
|
|
1807
|
-
fontFamily:
|
|
1808
|
-
fontSize:
|
|
1809
|
-
color:
|
|
3750
|
+
fontFamily: theme2.fonts.body,
|
|
3751
|
+
fontSize: theme2.fontSizes[0],
|
|
3752
|
+
color: theme2.colors.text,
|
|
1810
3753
|
overflow: "hidden",
|
|
1811
3754
|
textOverflow: "ellipsis",
|
|
1812
3755
|
whiteSpace: "nowrap"
|
|
@@ -1818,9 +3761,9 @@ const AgentActivityView = ({
|
|
|
1818
3761
|
"span",
|
|
1819
3762
|
{
|
|
1820
3763
|
style: {
|
|
1821
|
-
fontFamily:
|
|
3764
|
+
fontFamily: theme2.fonts.body,
|
|
1822
3765
|
fontSize: "10px",
|
|
1823
|
-
color:
|
|
3766
|
+
color: theme2.colors.textSecondary,
|
|
1824
3767
|
overflow: "hidden",
|
|
1825
3768
|
textOverflow: "ellipsis",
|
|
1826
3769
|
whiteSpace: "nowrap"
|
|
@@ -1835,9 +3778,9 @@ const AgentActivityView = ({
|
|
|
1835
3778
|
"span",
|
|
1836
3779
|
{
|
|
1837
3780
|
style: {
|
|
1838
|
-
fontFamily:
|
|
3781
|
+
fontFamily: theme2.fonts.body,
|
|
1839
3782
|
fontSize: "10px",
|
|
1840
|
-
color:
|
|
3783
|
+
color: theme2.colors.textSecondary,
|
|
1841
3784
|
backgroundColor: `${layer.color}20`,
|
|
1842
3785
|
padding: "2px 6px",
|
|
1843
3786
|
borderRadius: "3px",
|
|
@@ -1870,7 +3813,7 @@ const LegendTabs = ({
|
|
|
1870
3813
|
onTabChange
|
|
1871
3814
|
}) => {
|
|
1872
3815
|
var _a;
|
|
1873
|
-
const { theme } = useTheme();
|
|
3816
|
+
const { theme: theme2 } = useTheme();
|
|
1874
3817
|
const [activeTab, setActiveTab] = React.useState(
|
|
1875
3818
|
defaultTab || ((_a = tabs[0]) == null ? void 0 : _a.id) || "agent"
|
|
1876
3819
|
);
|
|
@@ -1893,9 +3836,9 @@ const LegendTabs = ({
|
|
|
1893
3836
|
justifyContent: "center",
|
|
1894
3837
|
flex: 1,
|
|
1895
3838
|
padding: "24px 16px",
|
|
1896
|
-
color:
|
|
1897
|
-
fontFamily:
|
|
1898
|
-
fontSize:
|
|
3839
|
+
color: theme2.colors.textSecondary,
|
|
3840
|
+
fontFamily: theme2.fonts.body,
|
|
3841
|
+
fontSize: theme2.fontSizes[0],
|
|
1899
3842
|
fontStyle: "italic"
|
|
1900
3843
|
},
|
|
1901
3844
|
children: "No data available"
|
|
@@ -1937,16 +3880,16 @@ const LegendTabs = ({
|
|
|
1937
3880
|
gap: "6px",
|
|
1938
3881
|
flex: 1,
|
|
1939
3882
|
padding: "10px 12px",
|
|
1940
|
-
backgroundColor:
|
|
1941
|
-
border: `1px solid ${
|
|
1942
|
-
borderBottom: isActive ? `1px solid ${
|
|
1943
|
-
borderLeft: index === 0 ? `1px solid ${
|
|
3883
|
+
backgroundColor: theme2.colors.background,
|
|
3884
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
3885
|
+
borderBottom: isActive ? `1px solid ${theme2.colors.background}` : `1px solid ${theme2.colors.border}`,
|
|
3886
|
+
borderLeft: index === 0 ? `1px solid ${theme2.colors.border}` : "none",
|
|
1944
3887
|
marginBottom: "-1px",
|
|
1945
3888
|
cursor: "pointer",
|
|
1946
|
-
fontFamily:
|
|
1947
|
-
fontSize:
|
|
3889
|
+
fontFamily: theme2.fonts.body,
|
|
3890
|
+
fontSize: theme2.fontSizes[0],
|
|
1948
3891
|
fontWeight: isActive ? 600 : 400,
|
|
1949
|
-
color: isActive ?
|
|
3892
|
+
color: isActive ? theme2.colors.text : theme2.colors.textSecondary,
|
|
1950
3893
|
opacity: isActive ? 1 : 0.9,
|
|
1951
3894
|
transition: "all 0.15s ease"
|
|
1952
3895
|
},
|
|
@@ -1957,7 +3900,7 @@ const LegendTabs = ({
|
|
|
1957
3900
|
style: {
|
|
1958
3901
|
display: "flex",
|
|
1959
3902
|
alignItems: "center",
|
|
1960
|
-
color: isActive ?
|
|
3903
|
+
color: isActive ? theme2.colors.primary : theme2.colors.textSecondary
|
|
1961
3904
|
},
|
|
1962
3905
|
children: tab.icon
|
|
1963
3906
|
}
|
|
@@ -1967,8 +3910,8 @@ const LegendTabs = ({
|
|
|
1967
3910
|
"span",
|
|
1968
3911
|
{
|
|
1969
3912
|
style: {
|
|
1970
|
-
backgroundColor: isActive ?
|
|
1971
|
-
color: isActive ?
|
|
3913
|
+
backgroundColor: isActive ? theme2.colors.primary : theme2.colors.border,
|
|
3914
|
+
color: isActive ? theme2.colors.background : theme2.colors.textSecondary,
|
|
1972
3915
|
padding: "1px 6px",
|
|
1973
3916
|
borderRadius: "8px",
|
|
1974
3917
|
fontSize: "10px",
|
|
@@ -1995,7 +3938,7 @@ const LegendTabs = ({
|
|
|
1995
3938
|
flex: 1,
|
|
1996
3939
|
minHeight: 0,
|
|
1997
3940
|
overflow: "auto",
|
|
1998
|
-
borderTop: `1px solid ${
|
|
3941
|
+
borderTop: `1px solid ${theme2.colors.border}`
|
|
1999
3942
|
},
|
|
2000
3943
|
children: activeTabData == null ? void 0 : activeTabData.content
|
|
2001
3944
|
}
|
|
@@ -2047,6 +3990,7 @@ function getAugmentedNamespace(n) {
|
|
|
2047
3990
|
}
|
|
2048
3991
|
var dist$1 = {};
|
|
2049
3992
|
var ArchitectureMapHighlightLayers = {};
|
|
3993
|
+
const require$$7 = /* @__PURE__ */ getAugmentedNamespace(esm$1);
|
|
2050
3994
|
var cityDataUtils = {};
|
|
2051
3995
|
var hasRequiredCityDataUtils;
|
|
2052
3996
|
function requireCityDataUtils() {
|
|
@@ -2937,7 +4881,7 @@ function requireArchitectureMapHighlightLayers() {
|
|
|
2937
4881
|
Object.defineProperty(ArchitectureMapHighlightLayers, "__esModule", { value: true });
|
|
2938
4882
|
ArchitectureMapHighlightLayers.ArchitectureMapHighlightLayers = void 0;
|
|
2939
4883
|
const react_1 = __importStar(React);
|
|
2940
|
-
const industry_theme_1 = require$$
|
|
4884
|
+
const industry_theme_1 = require$$7;
|
|
2941
4885
|
const cityDataUtils_1 = requireCityDataUtils();
|
|
2942
4886
|
const drawLayeredBuildings_1 = requireDrawLayeredBuildings();
|
|
2943
4887
|
const DEFAULT_DISPLAY_OPTIONS = {
|
|
@@ -3103,11 +5047,11 @@ function requireArchitectureMapHighlightLayers() {
|
|
|
3103
5047
|
buildingBorderRadius = 0,
|
|
3104
5048
|
districtBorderRadius = 0
|
|
3105
5049
|
}) {
|
|
3106
|
-
const { theme } = (0, industry_theme_1.useTheme)();
|
|
3107
|
-
const resolvedCanvasBackgroundColor = canvasBackgroundColor ??
|
|
3108
|
-
const resolvedHoverBorderColor = hoverBorderColor ??
|
|
3109
|
-
const resolvedDefaultDirectoryColor = defaultDirectoryColor ??
|
|
3110
|
-
const resolvedDefaultBuildingColor = defaultBuildingColor ??
|
|
5050
|
+
const { theme: theme2 } = (0, industry_theme_1.useTheme)();
|
|
5051
|
+
const resolvedCanvasBackgroundColor = canvasBackgroundColor ?? theme2.colors.background;
|
|
5052
|
+
const resolvedHoverBorderColor = hoverBorderColor ?? theme2.colors.text;
|
|
5053
|
+
const resolvedDefaultDirectoryColor = defaultDirectoryColor ?? theme2.colors.backgroundSecondary;
|
|
5054
|
+
const resolvedDefaultBuildingColor = defaultBuildingColor ?? theme2.colors.muted;
|
|
3111
5055
|
const canvasRef = (0, react_1.useRef)(null);
|
|
3112
5056
|
const containerRef = (0, react_1.useRef)(null);
|
|
3113
5057
|
const [interactionState, setInteractionState] = (0, react_1.useState)({
|
|
@@ -3935,14 +5879,14 @@ ${projectInfo.currentBranch}`;
|
|
|
3935
5879
|
width: "100%",
|
|
3936
5880
|
height: "100%",
|
|
3937
5881
|
minHeight: "250px",
|
|
3938
|
-
backgroundColor:
|
|
3939
|
-
borderRadius: `${
|
|
3940
|
-
padding: `${
|
|
5882
|
+
backgroundColor: theme2.colors.backgroundSecondary,
|
|
5883
|
+
borderRadius: `${theme2.radii[2]}px`,
|
|
5884
|
+
padding: `${theme2.space[4]}px`,
|
|
3941
5885
|
display: "flex",
|
|
3942
5886
|
alignItems: "center",
|
|
3943
5887
|
justifyContent: "center"
|
|
3944
5888
|
} },
|
|
3945
|
-
react_1.default.createElement("div", { style: { color:
|
|
5889
|
+
react_1.default.createElement("div", { style: { color: theme2.colors.textMuted, fontFamily: theme2.fonts.body } }, "No city data available")
|
|
3946
5890
|
);
|
|
3947
5891
|
}
|
|
3948
5892
|
return react_1.default.createElement(
|
|
@@ -3970,28 +5914,28 @@ ${projectInfo.currentBranch}`;
|
|
|
3970
5914
|
} },
|
|
3971
5915
|
showLayerControls && highlightLayers.length > 0 && react_1.default.createElement("div", { style: {
|
|
3972
5916
|
position: "absolute",
|
|
3973
|
-
bottom: `${
|
|
3974
|
-
left: `${
|
|
5917
|
+
bottom: `${theme2.space[4]}px`,
|
|
5918
|
+
left: `${theme2.space[4]}px`,
|
|
3975
5919
|
zIndex: 10,
|
|
3976
5920
|
display: "flex",
|
|
3977
5921
|
flexDirection: "column",
|
|
3978
|
-
gap: `${
|
|
5922
|
+
gap: `${theme2.space[2]}px`
|
|
3979
5923
|
} }, highlightLayers.map((layer) => react_1.default.createElement(
|
|
3980
5924
|
"button",
|
|
3981
5925
|
{ key: layer.id, onClick: () => onLayerToggle == null ? void 0 : onLayerToggle(layer.id, !layer.enabled), style: {
|
|
3982
|
-
padding: `${
|
|
3983
|
-
borderRadius: `${
|
|
5926
|
+
padding: `${theme2.space[2]}px ${theme2.space[3]}px`,
|
|
5927
|
+
borderRadius: `${theme2.radii[2]}px`,
|
|
3984
5928
|
boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)",
|
|
3985
5929
|
transition: "all 0.2s ease",
|
|
3986
5930
|
display: "flex",
|
|
3987
5931
|
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 :
|
|
5932
|
+
gap: `${theme2.space[2]}px`,
|
|
5933
|
+
fontSize: `${theme2.fontSizes[0]}px`,
|
|
5934
|
+
fontWeight: theme2.fontWeights.medium,
|
|
5935
|
+
fontFamily: theme2.fonts.body,
|
|
5936
|
+
backgroundColor: layer.enabled ? theme2.colors.backgroundSecondary : theme2.colors.background,
|
|
5937
|
+
color: layer.enabled ? theme2.colors.text : theme2.colors.textSecondary,
|
|
5938
|
+
border: `2px solid ${layer.enabled ? layer.color : theme2.colors.border}`,
|
|
3995
5939
|
minWidth: "120px",
|
|
3996
5940
|
cursor: "pointer"
|
|
3997
5941
|
}, title: `Toggle ${layer.name}` },
|
|
@@ -4005,8 +5949,8 @@ ${projectInfo.currentBranch}`;
|
|
|
4005
5949
|
} }),
|
|
4006
5950
|
react_1.default.createElement("span", { style: { textAlign: "left", flex: 1 } }, layer.name),
|
|
4007
5951
|
layer.items && layer.items.length > 0 && react_1.default.createElement("span", { style: {
|
|
4008
|
-
fontSize: `${
|
|
4009
|
-
color: layer.enabled ?
|
|
5952
|
+
fontSize: `${theme2.fontSizes[0]}px`,
|
|
5953
|
+
color: layer.enabled ? theme2.colors.textSecondary : theme2.colors.textMuted
|
|
4010
5954
|
} }, layer.items.length)
|
|
4011
5955
|
))),
|
|
4012
5956
|
react_1.default.createElement("canvas", { ref: canvasRef, style: {
|
|
@@ -13550,12 +15494,12 @@ function requireCityViewWithReactFlow() {
|
|
|
13550
15494
|
CityViewWithReactFlow.CityViewWithReactFlow = void 0;
|
|
13551
15495
|
const react_1 = __importStar(React);
|
|
13552
15496
|
const reactflow_1 = __importStar(require$$1);
|
|
13553
|
-
const industry_theme_1 = require$$
|
|
15497
|
+
const industry_theme_1 = require$$7;
|
|
13554
15498
|
const file_city_builder_1 = require$$4;
|
|
13555
15499
|
const ArchitectureMapHighlightLayers_1 = requireArchitectureMapHighlightLayers();
|
|
13556
15500
|
const CellNode = ({ data, selected }) => {
|
|
13557
15501
|
const { label, fileTree, fileCount, directoryCount } = data;
|
|
13558
|
-
const { theme } = (0, industry_theme_1.useTheme)();
|
|
15502
|
+
const { theme: theme2 } = (0, industry_theme_1.useTheme)();
|
|
13559
15503
|
const cityBuilder = (0, react_1.useMemo)(() => new file_city_builder_1.CodeCityBuilderWithGrid(), []);
|
|
13560
15504
|
const cityData = (0, react_1.useMemo)(() => {
|
|
13561
15505
|
if (!fileTree || !fileTree.root || fileTree.root.children.length === 0) {
|
|
@@ -13571,40 +15515,40 @@ function requireCityViewWithReactFlow() {
|
|
|
13571
15515
|
return react_1.default.createElement(
|
|
13572
15516
|
"div",
|
|
13573
15517
|
{ className: "cell-node", style: {
|
|
13574
|
-
background: selected ? `linear-gradient(135deg, ${
|
|
13575
|
-
borderRadius: `${
|
|
13576
|
-
padding: `${
|
|
15518
|
+
background: selected ? `linear-gradient(135deg, ${theme2.colors.primary} 0%, ${theme2.colors.accent} 100%)` : `linear-gradient(135deg, ${theme2.colors.backgroundSecondary} 0%, ${theme2.colors.background} 100%)`,
|
|
15519
|
+
borderRadius: `${theme2.radii[2]}px`,
|
|
15520
|
+
padding: `${theme2.space[3]}px`,
|
|
13577
15521
|
width: "450px",
|
|
13578
15522
|
height: "450px",
|
|
13579
|
-
border: selected ? `3px solid ${
|
|
13580
|
-
boxShadow: selected ? `0 10px 25px ${
|
|
15523
|
+
border: selected ? `3px solid ${theme2.colors.accent}` : `2px solid ${theme2.colors.border}`,
|
|
15524
|
+
boxShadow: selected ? `0 10px 25px ${theme2.colors.accent}30` : "0 4px 6px rgba(0, 0, 0, 0.1)",
|
|
13581
15525
|
display: "flex",
|
|
13582
15526
|
flexDirection: "column",
|
|
13583
15527
|
transition: "all 0.3s ease"
|
|
13584
15528
|
} },
|
|
13585
|
-
react_1.default.createElement(reactflow_1.Handle, { type: "target", position: reactflow_1.Position.Top, style: { background:
|
|
15529
|
+
react_1.default.createElement(reactflow_1.Handle, { type: "target", position: reactflow_1.Position.Top, style: { background: theme2.colors.accent } }),
|
|
13586
15530
|
react_1.default.createElement(
|
|
13587
15531
|
"div",
|
|
13588
15532
|
{ style: {
|
|
13589
|
-
marginBottom: `${
|
|
13590
|
-
paddingBottom: `${
|
|
13591
|
-
borderBottom: `1px solid ${
|
|
15533
|
+
marginBottom: `${theme2.space[2]}px`,
|
|
15534
|
+
paddingBottom: `${theme2.space[2]}px`,
|
|
15535
|
+
borderBottom: `1px solid ${theme2.colors.border}`
|
|
13592
15536
|
} },
|
|
13593
15537
|
react_1.default.createElement("h3", { style: {
|
|
13594
|
-
margin: `0 0 ${
|
|
13595
|
-
fontSize: `${
|
|
13596
|
-
fontWeight:
|
|
13597
|
-
fontFamily:
|
|
13598
|
-
color:
|
|
15538
|
+
margin: `0 0 ${theme2.space[1]}px 0`,
|
|
15539
|
+
fontSize: `${theme2.fontSizes[2]}px`,
|
|
15540
|
+
fontWeight: theme2.fontWeights.bold,
|
|
15541
|
+
fontFamily: theme2.fonts.heading,
|
|
15542
|
+
color: theme2.colors.text
|
|
13599
15543
|
} }, label),
|
|
13600
15544
|
react_1.default.createElement(
|
|
13601
15545
|
"div",
|
|
13602
15546
|
{ style: {
|
|
13603
|
-
fontSize: `${
|
|
13604
|
-
fontFamily:
|
|
13605
|
-
color:
|
|
15547
|
+
fontSize: `${theme2.fontSizes[0]}px`,
|
|
15548
|
+
fontFamily: theme2.fonts.body,
|
|
15549
|
+
color: theme2.colors.textSecondary,
|
|
13606
15550
|
display: "flex",
|
|
13607
|
-
gap: `${
|
|
15551
|
+
gap: `${theme2.space[3]}px`
|
|
13608
15552
|
} },
|
|
13609
15553
|
react_1.default.createElement(
|
|
13610
15554
|
"span",
|
|
@@ -13622,8 +15566,8 @@ function requireCityViewWithReactFlow() {
|
|
|
13622
15566
|
),
|
|
13623
15567
|
react_1.default.createElement("div", { style: {
|
|
13624
15568
|
position: "relative",
|
|
13625
|
-
background:
|
|
13626
|
-
borderRadius: `${
|
|
15569
|
+
background: theme2.colors.background,
|
|
15570
|
+
borderRadius: `${theme2.radii[1]}px`,
|
|
13627
15571
|
overflow: "hidden",
|
|
13628
15572
|
width: "350px",
|
|
13629
15573
|
height: "350px"
|
|
@@ -13637,7 +15581,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13637
15581
|
id: "typescript",
|
|
13638
15582
|
name: "TypeScript Files",
|
|
13639
15583
|
enabled: true,
|
|
13640
|
-
color:
|
|
15584
|
+
color: theme2.colors.success,
|
|
13641
15585
|
opacity: 0.8,
|
|
13642
15586
|
priority: 1,
|
|
13643
15587
|
items: cityData.buildings.filter((b) => b.path.endsWith(".ts") || b.path.endsWith(".tsx")).map((b) => ({
|
|
@@ -13649,9 +15593,9 @@ function requireCityViewWithReactFlow() {
|
|
|
13649
15593
|
],
|
|
13650
15594
|
showGrid: false,
|
|
13651
15595
|
showDirectoryLabels: false,
|
|
13652
|
-
canvasBackgroundColor:
|
|
13653
|
-
defaultBuildingColor:
|
|
13654
|
-
defaultDirectoryColor:
|
|
15596
|
+
canvasBackgroundColor: theme2.colors.background,
|
|
15597
|
+
defaultBuildingColor: theme2.colors.muted,
|
|
15598
|
+
defaultDirectoryColor: theme2.colors.backgroundSecondary,
|
|
13655
15599
|
className: "w-full h-full",
|
|
13656
15600
|
// Disable interactions to prevent conflicts with React Flow
|
|
13657
15601
|
onFileClick: void 0
|
|
@@ -13661,18 +15605,18 @@ function requireCityViewWithReactFlow() {
|
|
|
13661
15605
|
alignItems: "center",
|
|
13662
15606
|
justifyContent: "center",
|
|
13663
15607
|
height: "100%",
|
|
13664
|
-
color:
|
|
13665
|
-
fontSize: `${
|
|
13666
|
-
fontFamily:
|
|
15608
|
+
color: theme2.colors.textMuted,
|
|
15609
|
+
fontSize: `${theme2.fontSizes[1]}px`,
|
|
15610
|
+
fontFamily: theme2.fonts.body
|
|
13667
15611
|
} }, "Empty cell")),
|
|
13668
|
-
react_1.default.createElement(reactflow_1.Handle, { type: "source", position: reactflow_1.Position.Bottom, style: { background:
|
|
15612
|
+
react_1.default.createElement(reactflow_1.Handle, { type: "source", position: reactflow_1.Position.Bottom, style: { background: theme2.colors.accent } })
|
|
13669
15613
|
);
|
|
13670
15614
|
};
|
|
13671
15615
|
const nodeTypes = {
|
|
13672
15616
|
cellNode: CellNode
|
|
13673
15617
|
};
|
|
13674
15618
|
const CityViewWithReactFlowInner = ({ fileTree, gridConfig, onCellClick, cellWidth = 450, cellHeight = 350, cellSpacing = 100 }) => {
|
|
13675
|
-
const { theme } = (0, industry_theme_1.useTheme)();
|
|
15619
|
+
const { theme: theme2 } = (0, industry_theme_1.useTheme)();
|
|
13676
15620
|
const defaultGridConfig = {
|
|
13677
15621
|
id: "default",
|
|
13678
15622
|
version: "1.0",
|
|
@@ -13743,7 +15687,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13743
15687
|
type: "straight",
|
|
13744
15688
|
animated: false,
|
|
13745
15689
|
style: {
|
|
13746
|
-
stroke: `${
|
|
15690
|
+
stroke: `${theme2.colors.border}40`,
|
|
13747
15691
|
strokeWidth: 1,
|
|
13748
15692
|
strokeDasharray: "5 10"
|
|
13749
15693
|
}
|
|
@@ -13760,7 +15704,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13760
15704
|
type: "straight",
|
|
13761
15705
|
animated: false,
|
|
13762
15706
|
style: {
|
|
13763
|
-
stroke: `${
|
|
15707
|
+
stroke: `${theme2.colors.border}40`,
|
|
13764
15708
|
strokeWidth: 1,
|
|
13765
15709
|
strokeDasharray: "5 10"
|
|
13766
15710
|
}
|
|
@@ -13770,7 +15714,7 @@ function requireCityViewWithReactFlow() {
|
|
|
13770
15714
|
}
|
|
13771
15715
|
}
|
|
13772
15716
|
return { nodes: generatedNodes, edges: generatedEdges };
|
|
13773
|
-
}, [fileTree, config, cellWidth, cellHeight, cellSpacing,
|
|
15717
|
+
}, [fileTree, config, cellWidth, cellHeight, cellSpacing, theme2]);
|
|
13774
15718
|
const [nodesState, , onNodesChange] = (0, reactflow_1.useNodesState)(nodes);
|
|
13775
15719
|
const [edgesState, , onEdgesChange] = (0, reactflow_1.useEdgesState)(edges);
|
|
13776
15720
|
const onNodeClick = (0, react_1.useCallback)((_event, node) => {
|
|
@@ -13780,18 +15724,18 @@ function requireCityViewWithReactFlow() {
|
|
|
13780
15724
|
}, [onCellClick]);
|
|
13781
15725
|
return react_1.default.createElement(
|
|
13782
15726
|
"div",
|
|
13783
|
-
{ style: { width: "100%", height: "100%", background:
|
|
15727
|
+
{ style: { width: "100%", height: "100%", background: theme2.colors.background } },
|
|
13784
15728
|
react_1.default.createElement(
|
|
13785
15729
|
reactflow_1.ReactFlowProvider,
|
|
13786
15730
|
null,
|
|
13787
15731
|
react_1.default.createElement(
|
|
13788
15732
|
reactflow_1.default,
|
|
13789
15733
|
{ 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: `${
|
|
15734
|
+
react_1.default.createElement(reactflow_1.Background, { variant: reactflow_1.BackgroundVariant.Dots, gap: 30, size: 1, color: `${theme2.colors.border}40` }),
|
|
13791
15735
|
react_1.default.createElement(reactflow_1.Controls, null),
|
|
13792
|
-
react_1.default.createElement(reactflow_1.MiniMap, { nodeColor: () =>
|
|
13793
|
-
backgroundColor:
|
|
13794
|
-
border: `1px solid ${
|
|
15736
|
+
react_1.default.createElement(reactflow_1.MiniMap, { nodeColor: () => theme2.colors.primary, style: {
|
|
15737
|
+
backgroundColor: theme2.colors.backgroundSecondary,
|
|
15738
|
+
border: `1px solid ${theme2.colors.border}`
|
|
13795
15739
|
}, maskColor: "rgba(0, 0, 0, 0.6)" })
|
|
13796
15740
|
)
|
|
13797
15741
|
)
|
|
@@ -13847,7 +15791,7 @@ function requireDist() {
|
|
|
13847
15791
|
Object.defineProperty(exports$1, "CityViewWithReactFlow", { enumerable: true, get: function() {
|
|
13848
15792
|
return CityViewWithReactFlow_1.CityViewWithReactFlow;
|
|
13849
15793
|
} });
|
|
13850
|
-
var industry_theme_1 = require$$
|
|
15794
|
+
var industry_theme_1 = require$$7;
|
|
13851
15795
|
Object.defineProperty(exports$1, "ThemeProvider", { enumerable: true, get: function() {
|
|
13852
15796
|
return industry_theme_1.ThemeProvider;
|
|
13853
15797
|
} });
|
|
@@ -15512,7 +17456,7 @@ const CodeCityPanelContent = ({
|
|
|
15512
17456
|
events
|
|
15513
17457
|
}) => {
|
|
15514
17458
|
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();
|
|
17459
|
+
const { theme: theme2 } = useTheme();
|
|
15516
17460
|
const [cityData, setCityData] = useState(null);
|
|
15517
17461
|
const [hoverInfo, setHoverInfo] = useState(null);
|
|
15518
17462
|
const [highlightLayers, setHighlightLayers] = useState([]);
|
|
@@ -16424,7 +18368,7 @@ const CodeCityPanelContent = ({
|
|
|
16424
18368
|
flexDirection: "column",
|
|
16425
18369
|
height: "100%",
|
|
16426
18370
|
width: "100%",
|
|
16427
|
-
backgroundColor:
|
|
18371
|
+
backgroundColor: theme2.colors.background
|
|
16428
18372
|
},
|
|
16429
18373
|
children: [
|
|
16430
18374
|
/* @__PURE__ */ jsxs(
|
|
@@ -16436,8 +18380,8 @@ const CodeCityPanelContent = ({
|
|
|
16436
18380
|
justifyContent: "space-between",
|
|
16437
18381
|
padding: "0 16px",
|
|
16438
18382
|
height: "40px",
|
|
16439
|
-
borderBottom: `1px solid ${
|
|
16440
|
-
backgroundColor:
|
|
18383
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
18384
|
+
backgroundColor: theme2.colors.background,
|
|
16441
18385
|
flexShrink: 0,
|
|
16442
18386
|
gap: "12px"
|
|
16443
18387
|
},
|
|
@@ -16449,8 +18393,8 @@ const CodeCityPanelContent = ({
|
|
|
16449
18393
|
style: { display: "flex", alignItems: "center", gap: "4px", whiteSpace: "nowrap" },
|
|
16450
18394
|
title: `${computedTreeStats.fileCount.toLocaleString()} files`,
|
|
16451
18395
|
children: [
|
|
16452
|
-
/* @__PURE__ */ jsx(File, { size: 14, style: { color:
|
|
16453
|
-
/* @__PURE__ */ jsxs("span", { style: { fontSize:
|
|
18396
|
+
/* @__PURE__ */ jsx(File, { size: 14, style: { color: theme2.colors.textSecondary, flexShrink: 0 } }),
|
|
18397
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: theme2.fontSizes[1], fontFamily: theme2.fonts.body, color: theme2.colors.text }, children: [
|
|
16454
18398
|
computedTreeStats.fileCount.toLocaleString(),
|
|
16455
18399
|
!headerCompact && " files"
|
|
16456
18400
|
] })
|
|
@@ -16463,8 +18407,8 @@ const CodeCityPanelContent = ({
|
|
|
16463
18407
|
style: { display: "flex", alignItems: "center", gap: "4px", whiteSpace: "nowrap" },
|
|
16464
18408
|
title: `${computedTreeStats.directoryCount.toLocaleString()} folders`,
|
|
16465
18409
|
children: [
|
|
16466
|
-
/* @__PURE__ */ jsx(Folder, { size: 14, style: { color:
|
|
16467
|
-
/* @__PURE__ */ jsxs("span", { style: { fontSize:
|
|
18410
|
+
/* @__PURE__ */ jsx(Folder, { size: 14, style: { color: theme2.colors.textSecondary, flexShrink: 0 } }),
|
|
18411
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: theme2.fontSizes[1], fontFamily: theme2.fonts.body, color: theme2.colors.text }, children: [
|
|
16468
18412
|
computedTreeStats.directoryCount.toLocaleString(),
|
|
16469
18413
|
!headerCompact && " folders"
|
|
16470
18414
|
] })
|
|
@@ -16477,10 +18421,10 @@ const CodeCityPanelContent = ({
|
|
|
16477
18421
|
{
|
|
16478
18422
|
style: {
|
|
16479
18423
|
padding: "4px 10px",
|
|
16480
|
-
fontSize:
|
|
16481
|
-
fontFamily:
|
|
16482
|
-
color:
|
|
16483
|
-
backgroundColor:
|
|
18424
|
+
fontSize: theme2.fontSizes[0],
|
|
18425
|
+
fontFamily: theme2.fonts.body,
|
|
18426
|
+
color: theme2.colors.primary,
|
|
18427
|
+
backgroundColor: theme2.colors.primary + "15",
|
|
16484
18428
|
borderRadius: "4px"
|
|
16485
18429
|
},
|
|
16486
18430
|
children: currentColorModeConfig.name
|
|
@@ -16524,7 +18468,7 @@ const CodeCityPanelContent = ({
|
|
|
16524
18468
|
alignItems: "center",
|
|
16525
18469
|
justifyContent: "center",
|
|
16526
18470
|
height: "100%",
|
|
16527
|
-
color:
|
|
18471
|
+
color: theme2.colors.textSecondary
|
|
16528
18472
|
},
|
|
16529
18473
|
children: "Loading repository structure..."
|
|
16530
18474
|
}
|
|
@@ -16537,7 +18481,7 @@ const CodeCityPanelContent = ({
|
|
|
16537
18481
|
alignItems: "center",
|
|
16538
18482
|
justifyContent: "center",
|
|
16539
18483
|
height: "100%",
|
|
16540
|
-
color:
|
|
18484
|
+
color: theme2.colors.textSecondary,
|
|
16541
18485
|
gap: "12px"
|
|
16542
18486
|
},
|
|
16543
18487
|
children: [
|
|
@@ -16571,14 +18515,14 @@ const CodeCityPanelContent = ({
|
|
|
16571
18515
|
{
|
|
16572
18516
|
style: {
|
|
16573
18517
|
height: selectedPackagePath ? "68px" : "48px",
|
|
16574
|
-
borderTop: `1px solid ${
|
|
16575
|
-
backgroundColor:
|
|
18518
|
+
borderTop: `1px solid ${theme2.colors.border}`,
|
|
18519
|
+
backgroundColor: theme2.colors.background,
|
|
16576
18520
|
display: "flex",
|
|
16577
18521
|
flexDirection: "column",
|
|
16578
18522
|
padding: "0 12px",
|
|
16579
|
-
fontSize:
|
|
16580
|
-
fontFamily:
|
|
16581
|
-
color:
|
|
18523
|
+
fontSize: theme2.fontSizes[0],
|
|
18524
|
+
fontFamily: theme2.fonts.body,
|
|
18525
|
+
color: theme2.colors.text,
|
|
16582
18526
|
flexShrink: 0
|
|
16583
18527
|
},
|
|
16584
18528
|
children: [
|
|
@@ -16597,14 +18541,14 @@ const CodeCityPanelContent = ({
|
|
|
16597
18541
|
{
|
|
16598
18542
|
style: {
|
|
16599
18543
|
padding: "2px 8px",
|
|
16600
|
-
backgroundColor:
|
|
16601
|
-
color:
|
|
18544
|
+
backgroundColor: theme2.colors.primary + "20",
|
|
18545
|
+
color: theme2.colors.primary,
|
|
16602
18546
|
borderRadius: "4px",
|
|
16603
18547
|
fontWeight: 500,
|
|
16604
18548
|
display: "flex",
|
|
16605
18549
|
alignItems: "center",
|
|
16606
18550
|
gap: "6px",
|
|
16607
|
-
fontSize:
|
|
18551
|
+
fontSize: theme2.fontSizes[0]
|
|
16608
18552
|
},
|
|
16609
18553
|
children: [
|
|
16610
18554
|
/* @__PURE__ */ jsx(Folder, { size: 10 }),
|
|
@@ -16641,9 +18585,9 @@ const CodeCityPanelContent = ({
|
|
|
16641
18585
|
{
|
|
16642
18586
|
style: {
|
|
16643
18587
|
fontWeight: 600,
|
|
16644
|
-
fontFamily:
|
|
16645
|
-
color:
|
|
16646
|
-
fontSize:
|
|
18588
|
+
fontFamily: theme2.fonts.monospace,
|
|
18589
|
+
color: theme2.colors.primary,
|
|
18590
|
+
fontSize: theme2.fontSizes[1],
|
|
16647
18591
|
overflow: "hidden",
|
|
16648
18592
|
textOverflow: "ellipsis",
|
|
16649
18593
|
whiteSpace: "nowrap"
|
|
@@ -16655,9 +18599,9 @@ const CodeCityPanelContent = ({
|
|
|
16655
18599
|
"div",
|
|
16656
18600
|
{
|
|
16657
18601
|
style: {
|
|
16658
|
-
fontFamily:
|
|
16659
|
-
color:
|
|
16660
|
-
fontSize:
|
|
18602
|
+
fontFamily: theme2.fonts.monospace,
|
|
18603
|
+
color: theme2.colors.textSecondary,
|
|
18604
|
+
fontSize: theme2.fontSizes[0],
|
|
16661
18605
|
overflow: "hidden",
|
|
16662
18606
|
textOverflow: "ellipsis",
|
|
16663
18607
|
whiteSpace: "nowrap"
|
|
@@ -16672,9 +18616,9 @@ const CodeCityPanelContent = ({
|
|
|
16672
18616
|
"div",
|
|
16673
18617
|
{
|
|
16674
18618
|
style: {
|
|
16675
|
-
fontFamily:
|
|
16676
|
-
color:
|
|
16677
|
-
fontSize:
|
|
18619
|
+
fontFamily: theme2.fonts.body,
|
|
18620
|
+
color: theme2.colors.textSecondary,
|
|
18621
|
+
fontSize: theme2.fontSizes[0],
|
|
16678
18622
|
flexShrink: 0
|
|
16679
18623
|
},
|
|
16680
18624
|
children: [
|
|
@@ -16692,13 +18636,13 @@ const CodeCityPanelContent = ({
|
|
|
16692
18636
|
alignItems: "center",
|
|
16693
18637
|
gap: "6px",
|
|
16694
18638
|
padding: "4px 10px",
|
|
16695
|
-
backgroundColor:
|
|
18639
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
16696
18640
|
borderRadius: "4px",
|
|
16697
|
-
border: `1px solid ${
|
|
16698
|
-
fontSize:
|
|
16699
|
-
fontFamily:
|
|
18641
|
+
border: `1px solid ${theme2.colors.border}`,
|
|
18642
|
+
fontSize: theme2.fontSizes[0],
|
|
18643
|
+
fontFamily: theme2.fonts.body,
|
|
16700
18644
|
fontWeight: 500,
|
|
16701
|
-
color: hoveredFileMetric.value === null ?
|
|
18645
|
+
color: hoveredFileMetric.value === null ? theme2.colors.textSecondary : theme2.colors.text,
|
|
16702
18646
|
flexShrink: 0
|
|
16703
18647
|
},
|
|
16704
18648
|
children: hoveredFileMetric.label
|
|
@@ -16713,9 +18657,9 @@ const CodeCityPanelContent = ({
|
|
|
16713
18657
|
display: "flex",
|
|
16714
18658
|
alignItems: "center",
|
|
16715
18659
|
gap: "8px",
|
|
16716
|
-
color:
|
|
16717
|
-
fontSize:
|
|
16718
|
-
fontFamily:
|
|
18660
|
+
color: theme2.colors.text,
|
|
18661
|
+
fontSize: theme2.fontSizes[0],
|
|
18662
|
+
fontFamily: theme2.fonts.body
|
|
16719
18663
|
},
|
|
16720
18664
|
children: [
|
|
16721
18665
|
/* @__PURE__ */ jsxs(
|
|
@@ -16723,8 +18667,8 @@ const CodeCityPanelContent = ({
|
|
|
16723
18667
|
{
|
|
16724
18668
|
style: {
|
|
16725
18669
|
padding: "4px 10px",
|
|
16726
|
-
backgroundColor:
|
|
16727
|
-
color:
|
|
18670
|
+
backgroundColor: theme2.colors.accent + "20",
|
|
18671
|
+
color: theme2.colors.accent,
|
|
16728
18672
|
borderRadius: "4px",
|
|
16729
18673
|
fontWeight: 500,
|
|
16730
18674
|
display: "flex",
|
|
@@ -16738,7 +18682,7 @@ const CodeCityPanelContent = ({
|
|
|
16738
18682
|
]
|
|
16739
18683
|
}
|
|
16740
18684
|
),
|
|
16741
|
-
/* @__PURE__ */ jsx("span", { style: { color:
|
|
18685
|
+
/* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary, fontStyle: "italic" }, children: "Files outside this package are dimmed" })
|
|
16742
18686
|
]
|
|
16743
18687
|
}
|
|
16744
18688
|
)
|
|
@@ -16748,10 +18692,10 @@ const CodeCityPanelContent = ({
|
|
|
16748
18692
|
"div",
|
|
16749
18693
|
{
|
|
16750
18694
|
style: {
|
|
16751
|
-
color:
|
|
18695
|
+
color: theme2.colors.textSecondary,
|
|
16752
18696
|
fontStyle: "italic",
|
|
16753
|
-
fontSize:
|
|
16754
|
-
fontFamily:
|
|
18697
|
+
fontSize: theme2.fontSizes[0],
|
|
18698
|
+
fontFamily: theme2.fonts.body
|
|
16755
18699
|
},
|
|
16756
18700
|
children: "Hover over files and directories to see details • Click to open"
|
|
16757
18701
|
}
|
|
@@ -16883,11 +18827,11 @@ function adjustBrightness(color2, percent) {
|
|
|
16883
18827
|
return color2;
|
|
16884
18828
|
}
|
|
16885
18829
|
const FeedProjectHeaderSkeleton = ({ compact = false }) => {
|
|
16886
|
-
const { theme } = useTheme();
|
|
18830
|
+
const { theme: theme2 } = useTheme();
|
|
16887
18831
|
React.useEffect(() => {
|
|
16888
18832
|
injectShimmerStyles();
|
|
16889
18833
|
}, []);
|
|
16890
|
-
const shimmerBg =
|
|
18834
|
+
const shimmerBg = theme2.colors.backgroundLight || "#2a2a2a";
|
|
16891
18835
|
return /* @__PURE__ */ jsxs(
|
|
16892
18836
|
"div",
|
|
16893
18837
|
{
|
|
@@ -16896,8 +18840,8 @@ const FeedProjectHeaderSkeleton = ({ compact = false }) => {
|
|
|
16896
18840
|
flexDirection: "column",
|
|
16897
18841
|
gap: compact ? 8 : 12,
|
|
16898
18842
|
padding: compact ? "10px 12px" : "14px 16px",
|
|
16899
|
-
backgroundColor:
|
|
16900
|
-
borderBottom: `1px solid ${
|
|
18843
|
+
backgroundColor: theme2.colors.background,
|
|
18844
|
+
borderBottom: `1px solid ${theme2.colors.border}`
|
|
16901
18845
|
},
|
|
16902
18846
|
children: [
|
|
16903
18847
|
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12 }, children: [
|
|
@@ -16940,10 +18884,10 @@ const FeedProjectHeader = ({
|
|
|
16940
18884
|
onOpen,
|
|
16941
18885
|
compact = false
|
|
16942
18886
|
}) => {
|
|
16943
|
-
const { theme } = useTheme();
|
|
16944
|
-
const fontSizeSmall =
|
|
16945
|
-
const fontSizeMedium =
|
|
16946
|
-
const fontSizeLarge =
|
|
18887
|
+
const { theme: theme2 } = useTheme();
|
|
18888
|
+
const fontSizeSmall = theme2.fontSizes[0];
|
|
18889
|
+
const fontSizeMedium = theme2.fontSizes[1];
|
|
18890
|
+
const fontSizeLarge = theme2.fontSizes[2] || theme2.fontSizes[1];
|
|
16947
18891
|
return /* @__PURE__ */ jsxs(
|
|
16948
18892
|
"div",
|
|
16949
18893
|
{
|
|
@@ -16952,9 +18896,9 @@ const FeedProjectHeader = ({
|
|
|
16952
18896
|
flexDirection: "column",
|
|
16953
18897
|
gap: compact ? 8 : 12,
|
|
16954
18898
|
padding: compact ? "10px 12px" : "14px 16px",
|
|
16955
|
-
backgroundColor:
|
|
16956
|
-
borderBottom: `1px solid ${
|
|
16957
|
-
fontFamily:
|
|
18899
|
+
backgroundColor: theme2.colors.background,
|
|
18900
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
18901
|
+
fontFamily: theme2.fonts.body
|
|
16958
18902
|
},
|
|
16959
18903
|
children: [
|
|
16960
18904
|
/* @__PURE__ */ jsxs(
|
|
@@ -16987,13 +18931,13 @@ const FeedProjectHeader = ({
|
|
|
16987
18931
|
width: compact ? 24 : 28,
|
|
16988
18932
|
height: compact ? 24 : 28,
|
|
16989
18933
|
borderRadius: repo.isOrganization ? "6px" : "50%",
|
|
16990
|
-
backgroundColor:
|
|
18934
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
16991
18935
|
display: "flex",
|
|
16992
18936
|
alignItems: "center",
|
|
16993
18937
|
justifyContent: "center",
|
|
16994
18938
|
flexShrink: 0
|
|
16995
18939
|
},
|
|
16996
|
-
children: repo.isOrganization ? /* @__PURE__ */ jsx(Building2, { size: 14, color:
|
|
18940
|
+
children: repo.isOrganization ? /* @__PURE__ */ jsx(Building2, { size: 14, color: theme2.colors.textSecondary }) : /* @__PURE__ */ jsx(User, { size: 14, color: theme2.colors.textSecondary })
|
|
16997
18941
|
}
|
|
16998
18942
|
),
|
|
16999
18943
|
/* @__PURE__ */ jsx(
|
|
@@ -17002,7 +18946,7 @@ const FeedProjectHeader = ({
|
|
|
17002
18946
|
style: {
|
|
17003
18947
|
fontSize: compact ? fontSizeMedium : fontSizeLarge,
|
|
17004
18948
|
fontWeight: 600,
|
|
17005
|
-
color:
|
|
18949
|
+
color: theme2.colors.text,
|
|
17006
18950
|
overflow: "hidden",
|
|
17007
18951
|
textOverflow: "ellipsis",
|
|
17008
18952
|
whiteSpace: "nowrap"
|
|
@@ -17021,7 +18965,7 @@ const FeedProjectHeader = ({
|
|
|
17021
18965
|
alignItems: "center",
|
|
17022
18966
|
gap: 4,
|
|
17023
18967
|
fontSize: fontSizeSmall,
|
|
17024
|
-
color:
|
|
18968
|
+
color: theme2.colors.textSecondary
|
|
17025
18969
|
},
|
|
17026
18970
|
children: [
|
|
17027
18971
|
/* @__PURE__ */ jsx(Scale, { size: 12 }),
|
|
@@ -17040,9 +18984,9 @@ const FeedProjectHeader = ({
|
|
|
17040
18984
|
padding: "5px 12px",
|
|
17041
18985
|
fontSize: fontSizeSmall,
|
|
17042
18986
|
fontWeight: 500,
|
|
17043
|
-
fontFamily:
|
|
18987
|
+
fontFamily: theme2.fonts.body,
|
|
17044
18988
|
color: "#ffffff",
|
|
17045
|
-
backgroundColor:
|
|
18989
|
+
backgroundColor: theme2.colors.primary,
|
|
17046
18990
|
border: "none",
|
|
17047
18991
|
borderRadius: "4px",
|
|
17048
18992
|
cursor: "pointer",
|
|
@@ -17071,7 +19015,7 @@ const FeedProjectHeader = ({
|
|
|
17071
19015
|
style: {
|
|
17072
19016
|
margin: 0,
|
|
17073
19017
|
fontSize: fontSizeMedium,
|
|
17074
|
-
color:
|
|
19018
|
+
color: theme2.colors.textSecondary,
|
|
17075
19019
|
lineHeight: 1.5,
|
|
17076
19020
|
display: "-webkit-box",
|
|
17077
19021
|
WebkitLineClamp: 2,
|
|
@@ -17100,7 +19044,7 @@ const FeedProjectHeader = ({
|
|
|
17100
19044
|
alignItems: "center",
|
|
17101
19045
|
gap: 4,
|
|
17102
19046
|
fontSize: fontSizeSmall,
|
|
17103
|
-
color:
|
|
19047
|
+
color: theme2.colors.textSecondary
|
|
17104
19048
|
},
|
|
17105
19049
|
title: `${repo.stars.toLocaleString()} stars`,
|
|
17106
19050
|
children: [
|
|
@@ -17117,7 +19061,7 @@ const FeedProjectHeader = ({
|
|
|
17117
19061
|
alignItems: "center",
|
|
17118
19062
|
gap: 4,
|
|
17119
19063
|
fontSize: fontSizeSmall,
|
|
17120
|
-
color:
|
|
19064
|
+
color: theme2.colors.textSecondary
|
|
17121
19065
|
},
|
|
17122
19066
|
title: `${repo.forks.toLocaleString()} forks`,
|
|
17123
19067
|
children: [
|
|
@@ -17134,7 +19078,7 @@ const FeedProjectHeader = ({
|
|
|
17134
19078
|
alignItems: "center",
|
|
17135
19079
|
gap: 4,
|
|
17136
19080
|
fontSize: fontSizeSmall,
|
|
17137
|
-
color:
|
|
19081
|
+
color: theme2.colors.textSecondary
|
|
17138
19082
|
},
|
|
17139
19083
|
title: `${repo.watchers.toLocaleString()} watching`,
|
|
17140
19084
|
children: [
|
|
@@ -17151,7 +19095,7 @@ const FeedProjectHeader = ({
|
|
|
17151
19095
|
alignItems: "center",
|
|
17152
19096
|
gap: 4,
|
|
17153
19097
|
fontSize: fontSizeSmall,
|
|
17154
|
-
color:
|
|
19098
|
+
color: theme2.colors.textSecondary
|
|
17155
19099
|
},
|
|
17156
19100
|
title: `${repo.openIssues.toLocaleString()} open issues`,
|
|
17157
19101
|
children: [
|
|
@@ -17171,7 +19115,7 @@ const FeedProjectHeader = ({
|
|
|
17171
19115
|
alignItems: "center",
|
|
17172
19116
|
gap: 4,
|
|
17173
19117
|
fontSize: fontSizeSmall,
|
|
17174
|
-
color:
|
|
19118
|
+
color: theme2.colors.textSecondary,
|
|
17175
19119
|
textDecoration: "none"
|
|
17176
19120
|
},
|
|
17177
19121
|
title: repo.htmlUrl,
|
|
@@ -17194,7 +19138,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17194
19138
|
events
|
|
17195
19139
|
}) => {
|
|
17196
19140
|
var _a, _b, _c, _d, _e, _f;
|
|
17197
|
-
const { theme } = useTheme();
|
|
19141
|
+
const { theme: theme2 } = useTheme();
|
|
17198
19142
|
const [cityData, setCityData] = useState(null);
|
|
17199
19143
|
const [hoverInfo, setHoverInfo] = useState(null);
|
|
17200
19144
|
const [highlightLayers, setHighlightLayers] = useState([]);
|
|
@@ -17341,7 +19285,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17341
19285
|
flexDirection: "column",
|
|
17342
19286
|
height: "100%",
|
|
17343
19287
|
width: "100%",
|
|
17344
|
-
backgroundColor:
|
|
19288
|
+
backgroundColor: theme2.colors.background
|
|
17345
19289
|
},
|
|
17346
19290
|
children: [
|
|
17347
19291
|
feedProjectLoading ? /* @__PURE__ */ jsx(FeedProjectHeaderSkeleton, {}) : (feedProjectData == null ? void 0 : feedProjectData.repo) ? /* @__PURE__ */ jsx(
|
|
@@ -17385,7 +19329,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17385
19329
|
alignItems: "center",
|
|
17386
19330
|
justifyContent: "center",
|
|
17387
19331
|
height: "100%",
|
|
17388
|
-
color:
|
|
19332
|
+
color: theme2.colors.textSecondary
|
|
17389
19333
|
},
|
|
17390
19334
|
children: "Loading repository structure..."
|
|
17391
19335
|
}
|
|
@@ -17398,7 +19342,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17398
19342
|
alignItems: "center",
|
|
17399
19343
|
justifyContent: "center",
|
|
17400
19344
|
height: "100%",
|
|
17401
|
-
color:
|
|
19345
|
+
color: theme2.colors.textSecondary,
|
|
17402
19346
|
gap: "12px"
|
|
17403
19347
|
},
|
|
17404
19348
|
children: [
|
|
@@ -17430,14 +19374,14 @@ const FeedCodeCityPanelContent = ({
|
|
|
17430
19374
|
{
|
|
17431
19375
|
style: {
|
|
17432
19376
|
height: "48px",
|
|
17433
|
-
borderTop: `1px solid ${
|
|
17434
|
-
backgroundColor:
|
|
19377
|
+
borderTop: `1px solid ${theme2.colors.border}`,
|
|
19378
|
+
backgroundColor: theme2.colors.background,
|
|
17435
19379
|
display: "flex",
|
|
17436
19380
|
alignItems: "center",
|
|
17437
19381
|
padding: "0 12px",
|
|
17438
|
-
fontSize:
|
|
17439
|
-
fontFamily:
|
|
17440
|
-
color:
|
|
19382
|
+
fontSize: theme2.fontSizes[0],
|
|
19383
|
+
fontFamily: theme2.fonts.body,
|
|
19384
|
+
color: theme2.colors.text,
|
|
17441
19385
|
flexShrink: 0
|
|
17442
19386
|
},
|
|
17443
19387
|
children: hoverInfo && (hoverInfo.hoveredBuilding || hoverInfo.hoveredDistrict) ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
@@ -17457,9 +19401,9 @@ const FeedCodeCityPanelContent = ({
|
|
|
17457
19401
|
{
|
|
17458
19402
|
style: {
|
|
17459
19403
|
fontWeight: 600,
|
|
17460
|
-
fontFamily:
|
|
17461
|
-
color:
|
|
17462
|
-
fontSize:
|
|
19404
|
+
fontFamily: theme2.fonts.monospace,
|
|
19405
|
+
color: theme2.colors.primary,
|
|
19406
|
+
fontSize: theme2.fontSizes[1],
|
|
17463
19407
|
overflow: "hidden",
|
|
17464
19408
|
textOverflow: "ellipsis",
|
|
17465
19409
|
whiteSpace: "nowrap"
|
|
@@ -17471,9 +19415,9 @@ const FeedCodeCityPanelContent = ({
|
|
|
17471
19415
|
"div",
|
|
17472
19416
|
{
|
|
17473
19417
|
style: {
|
|
17474
|
-
fontFamily:
|
|
17475
|
-
color:
|
|
17476
|
-
fontSize:
|
|
19418
|
+
fontFamily: theme2.fonts.monospace,
|
|
19419
|
+
color: theme2.colors.textSecondary,
|
|
19420
|
+
fontSize: theme2.fontSizes[0],
|
|
17477
19421
|
overflow: "hidden",
|
|
17478
19422
|
textOverflow: "ellipsis",
|
|
17479
19423
|
whiteSpace: "nowrap"
|
|
@@ -17488,8 +19432,8 @@ const FeedCodeCityPanelContent = ({
|
|
|
17488
19432
|
"div",
|
|
17489
19433
|
{
|
|
17490
19434
|
style: {
|
|
17491
|
-
fontSize:
|
|
17492
|
-
color:
|
|
19435
|
+
fontSize: theme2.fontSizes[0],
|
|
19436
|
+
color: theme2.colors.textSecondary,
|
|
17493
19437
|
whiteSpace: "nowrap"
|
|
17494
19438
|
},
|
|
17495
19439
|
children: [
|
|
@@ -17499,7 +19443,7 @@ const FeedCodeCityPanelContent = ({
|
|
|
17499
19443
|
]
|
|
17500
19444
|
}
|
|
17501
19445
|
)
|
|
17502
|
-
] }) : /* @__PURE__ */ jsx("div", { style: { color:
|
|
19446
|
+
] }) : /* @__PURE__ */ jsx("div", { style: { color: theme2.colors.textSecondary, fontStyle: "italic" }, children: "Hover over the map to see file details" })
|
|
17503
19447
|
}
|
|
17504
19448
|
)
|
|
17505
19449
|
]
|
|
@@ -17645,11 +19589,11 @@ const ProjectInfoHeader = ({
|
|
|
17645
19589
|
onOpen,
|
|
17646
19590
|
compact = false
|
|
17647
19591
|
}) => {
|
|
17648
|
-
const { theme } = useTheme();
|
|
19592
|
+
const { theme: theme2 } = useTheme();
|
|
17649
19593
|
const totalDeps = (project.dependencyCount || 0) + (project.devDependencyCount || 0);
|
|
17650
|
-
const fontSizeSmall =
|
|
17651
|
-
const fontSizeMedium =
|
|
17652
|
-
const fontSizeLarge =
|
|
19594
|
+
const fontSizeSmall = theme2.fontSizes[0];
|
|
19595
|
+
const fontSizeMedium = theme2.fontSizes[1];
|
|
19596
|
+
const fontSizeLarge = theme2.fontSizes[2] || theme2.fontSizes[1];
|
|
17653
19597
|
return /* @__PURE__ */ jsxs(
|
|
17654
19598
|
"div",
|
|
17655
19599
|
{
|
|
@@ -17658,9 +19602,9 @@ const ProjectInfoHeader = ({
|
|
|
17658
19602
|
flexDirection: "column",
|
|
17659
19603
|
gap: compact ? 4 : 8,
|
|
17660
19604
|
padding: compact ? "8px 12px" : "12px 16px",
|
|
17661
|
-
backgroundColor:
|
|
17662
|
-
borderBottom: `1px solid ${
|
|
17663
|
-
fontFamily:
|
|
19605
|
+
backgroundColor: theme2.colors.background,
|
|
19606
|
+
borderBottom: `1px solid ${theme2.colors.border}`,
|
|
19607
|
+
fontFamily: theme2.fonts.body,
|
|
17664
19608
|
minHeight: compact ? 48 : "auto"
|
|
17665
19609
|
},
|
|
17666
19610
|
children: [
|
|
@@ -17680,7 +19624,7 @@ const ProjectInfoHeader = ({
|
|
|
17680
19624
|
{
|
|
17681
19625
|
packageManager: project.packageManager,
|
|
17682
19626
|
size: compact ? 18 : 20,
|
|
17683
|
-
color:
|
|
19627
|
+
color: theme2.colors.textSecondary
|
|
17684
19628
|
}
|
|
17685
19629
|
) }),
|
|
17686
19630
|
/* @__PURE__ */ jsx(
|
|
@@ -17689,7 +19633,7 @@ const ProjectInfoHeader = ({
|
|
|
17689
19633
|
style: {
|
|
17690
19634
|
fontSize: compact ? fontSizeMedium : fontSizeLarge,
|
|
17691
19635
|
fontWeight: 600,
|
|
17692
|
-
color:
|
|
19636
|
+
color: theme2.colors.text,
|
|
17693
19637
|
overflow: "hidden",
|
|
17694
19638
|
textOverflow: "ellipsis",
|
|
17695
19639
|
whiteSpace: "nowrap"
|
|
@@ -17703,8 +19647,8 @@ const ProjectInfoHeader = ({
|
|
|
17703
19647
|
{
|
|
17704
19648
|
style: {
|
|
17705
19649
|
fontSize: fontSizeSmall,
|
|
17706
|
-
color:
|
|
17707
|
-
backgroundColor:
|
|
19650
|
+
color: theme2.colors.textSecondary,
|
|
19651
|
+
backgroundColor: theme2.colors.backgroundLight,
|
|
17708
19652
|
padding: "2px 6px",
|
|
17709
19653
|
borderRadius: "4px",
|
|
17710
19654
|
flexShrink: 0
|
|
@@ -17747,9 +19691,9 @@ const ProjectInfoHeader = ({
|
|
|
17747
19691
|
padding: "4px 10px",
|
|
17748
19692
|
fontSize: fontSizeSmall,
|
|
17749
19693
|
fontWeight: 500,
|
|
17750
|
-
fontFamily:
|
|
19694
|
+
fontFamily: theme2.fonts.body,
|
|
17751
19695
|
color: "#ffffff",
|
|
17752
|
-
backgroundColor:
|
|
19696
|
+
backgroundColor: theme2.colors.primary,
|
|
17753
19697
|
border: "none",
|
|
17754
19698
|
borderRadius: "4px",
|
|
17755
19699
|
cursor: "pointer",
|
|
@@ -17777,7 +19721,7 @@ const ProjectInfoHeader = ({
|
|
|
17777
19721
|
style: {
|
|
17778
19722
|
margin: 0,
|
|
17779
19723
|
fontSize: fontSizeSmall,
|
|
17780
|
-
color:
|
|
19724
|
+
color: theme2.colors.textSecondary,
|
|
17781
19725
|
overflow: "hidden",
|
|
17782
19726
|
textOverflow: "ellipsis",
|
|
17783
19727
|
whiteSpace: "nowrap"
|
|
@@ -17804,7 +19748,7 @@ const ProjectInfoHeader = ({
|
|
|
17804
19748
|
alignItems: "center",
|
|
17805
19749
|
gap: 4,
|
|
17806
19750
|
fontSize: fontSizeSmall,
|
|
17807
|
-
color:
|
|
19751
|
+
color: theme2.colors.textSecondary
|
|
17808
19752
|
},
|
|
17809
19753
|
title: `License: ${project.license}`,
|
|
17810
19754
|
children: [
|
|
@@ -17821,7 +19765,7 @@ const ProjectInfoHeader = ({
|
|
|
17821
19765
|
alignItems: "center",
|
|
17822
19766
|
gap: 4,
|
|
17823
19767
|
fontSize: fontSizeSmall,
|
|
17824
|
-
color:
|
|
19768
|
+
color: theme2.colors.textSecondary
|
|
17825
19769
|
},
|
|
17826
19770
|
title: `${project.dependencyCount || 0} prod, ${project.devDependencyCount || 0} dev dependencies`,
|
|
17827
19771
|
children: [
|
|
@@ -17842,7 +19786,7 @@ const ProjectInfoHeader = ({
|
|
|
17842
19786
|
alignItems: "center",
|
|
17843
19787
|
gap: 4,
|
|
17844
19788
|
fontSize: fontSizeSmall,
|
|
17845
|
-
color:
|
|
19789
|
+
color: theme2.colors.textSecondary
|
|
17846
19790
|
},
|
|
17847
19791
|
title: `Author: ${project.author}`,
|
|
17848
19792
|
children: [
|