@industry-theme/alexandria-panels 0.1.6 → 0.1.8

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.
@@ -3,7 +3,7 @@
3
3
  try {
4
4
  if (typeof document != "undefined") {
5
5
  var elementStyle = document.createElement("style");
6
- elementStyle.appendChild(document.createTextNode("/* Container query for responsive LocalProjectCard */\n.local-projects-panel {\n container-type: inline-size;\n container-name: local-projects;\n height: 100%;\n}\n\n.local-project-card {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 12px;\n position: relative;\n}\n\n.local-project-card__content {\n display: flex;\n align-items: center;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n\n.local-project-card__info {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.local-project-card__meta {\n display: flex;\n}\n\n.local-project-card__actions {\n display: flex;\n gap: 4px;\n align-items: center;\n flex-shrink: 0;\n}\n\n.local-project-card__actions--stacked {\n display: none;\n}\n\n/* Compact mode when container is 400px or less */\n@container local-projects (max-width: 400px) {\n .local-projects-panel {\n padding: 8px !important;\n gap: 8px !important;\n }\n\n .local-projects-list {\n gap: 12px !important;\n }\n\n .local-project-card {\n flex-direction: column;\n align-items: stretch;\n gap: 6px;\n padding: 0 !important;\n }\n\n .local-project-card__content {\n gap: 8px;\n }\n\n .local-project-card__meta {\n display: none;\n }\n\n .local-project-card__actions {\n display: none;\n }\n\n .local-project-card__actions--stacked {\n display: flex;\n gap: 4px;\n }\n\n .local-project-card__actions--stacked button {\n flex: 1;\n }\n}"));
6
+ elementStyle.appendChild(document.createTextNode("/* Container query for responsive LocalProjectCard */\n.local-projects-panel {\n container-type: inline-size;\n container-name: local-projects;\n height: 100%;\n}\n\n/* Compact mode when container is 400px or less */\n@container local-projects (max-width: 400px) {\n .local-projects-panel {\n padding: 8px !important;\n gap: 8px !important;\n }\n\n .local-projects-list {\n gap: 8px !important;\n }\n\n .local-project-card {\n padding: 8px !important;\n }\n}"));
7
7
  document.head.appendChild(elementStyle);
8
8
  }
9
9
  } catch (e) {
@@ -562,16 +562,28 @@ const LocalProjectCard = ({
562
562
  isLoading = false,
563
563
  windowState = "closed",
564
564
  compact: _compact = false,
565
- isInWorkspaceDirectory
565
+ isInWorkspaceDirectory,
566
+ workspacePath,
567
+ userHomePath
566
568
  }) => {
567
- var _a, _b, _c, _d;
569
+ var _a, _b, _c, _d, _e;
568
570
  const { theme } = useTheme();
569
571
  const [isHovered, setIsHovered] = useState(false);
570
572
  const [copiedPath, setCopiedPath] = useState(false);
571
573
  const [isMoving, setIsMoving] = useState(false);
572
574
  const [isRemoving, setIsRemoving] = useState(false);
573
- const highlightColor = theme.colors.primary;
574
575
  const avatarUrl = ((_a = entry.github) == null ? void 0 : _a.owner) ? `https://github.com/${entry.github.owner}.png` : null;
576
+ const getDisplayPath = (path) => {
577
+ if (workspacePath && path.startsWith(workspacePath)) {
578
+ const relativePath = path.slice(workspacePath.length);
579
+ return relativePath.startsWith("/") ? relativePath.slice(1) : relativePath;
580
+ }
581
+ if (userHomePath && path.startsWith(userHomePath)) {
582
+ return "~" + path.slice(userHomePath.length);
583
+ }
584
+ return path;
585
+ };
586
+ const displayPath = getDisplayPath(entry.path);
575
587
  const handleCardClick = () => {
576
588
  onSelect == null ? void 0 : onSelect(entry);
577
589
  };
@@ -622,241 +634,70 @@ const LocalProjectCard = ({
622
634
  display: "flex",
623
635
  alignItems: "center",
624
636
  justifyContent: "center",
625
- width: "24px",
637
+ gap: "4px",
638
+ flex: 1,
626
639
  height: "24px",
627
- padding: 0,
640
+ padding: "0 8px",
628
641
  border: "none",
629
642
  borderRadius: "4px",
630
643
  backgroundColor: "transparent",
631
644
  color: theme.colors.textSecondary,
632
645
  cursor: "pointer",
633
- opacity: isHovered ? 1 : 0,
634
- pointerEvents: isHovered ? "auto" : "none",
646
+ fontSize: `${theme.fontSizes[1]}px`,
647
+ fontFamily: theme.fonts.body,
635
648
  transition: "all 0.15s ease"
636
649
  };
637
- const renderActionButtons = (isCompact = false) => {
638
- const buttonFlex = isCompact ? 1 : void 0;
639
- if (isCompact) {
640
- if (actionMode === "add-to-workspace") {
641
- return /* @__PURE__ */ jsxs(
642
- "button",
643
- {
644
- type: "button",
645
- onClick: handleAddToWorkspaceClick,
646
- disabled: isLoading,
647
- title: "Add to workspace",
648
- style: {
649
- flex: buttonFlex,
650
- display: "inline-flex",
651
- alignItems: "center",
652
- justifyContent: "center",
653
- padding: "6px 10px",
654
- gap: "4px",
655
- borderRadius: "4px",
656
- border: `1px solid ${theme.colors.primary || "#3b82f6"}`,
657
- backgroundColor: `${theme.colors.primary || "#3b82f6"}15`,
658
- color: theme.colors.primary || "#3b82f6",
659
- fontSize: `${theme.fontSizes[0]}px`,
660
- fontWeight: theme.fontWeights.medium,
661
- cursor: isLoading ? "wait" : "pointer",
662
- opacity: isLoading ? 0.6 : 1,
663
- transition: "all 0.15s ease"
664
- },
665
- children: [
666
- isLoading ? /* @__PURE__ */ jsx(LoaderCircle, { size: 12, className: "animate-spin" }) : /* @__PURE__ */ jsx(Plus, { size: 12 }),
667
- isLoading ? "Adding..." : "Add"
668
- ]
669
- }
670
- );
671
- }
672
- if (actionMode === "workspace") {
673
- return /* @__PURE__ */ jsxs(Fragment, { children: [
674
- isInWorkspaceDirectory === false && onMoveToWorkspace && /* @__PURE__ */ jsxs(
675
- "button",
676
- {
677
- type: "button",
678
- onClick: handleMoveToWorkspaceClick,
679
- disabled: isMoving,
680
- title: "Move to workspace directory",
681
- style: {
682
- flex: 1,
683
- display: "inline-flex",
684
- alignItems: "center",
685
- justifyContent: "center",
686
- padding: "6px 10px",
687
- gap: "4px",
688
- borderRadius: "4px",
689
- border: `1px solid ${theme.colors.primary || "#3b82f6"}`,
690
- backgroundColor: `${theme.colors.primary || "#3b82f6"}15`,
691
- color: theme.colors.primary || "#3b82f6",
692
- fontSize: `${theme.fontSizes[0]}px`,
693
- fontWeight: theme.fontWeights.medium,
694
- cursor: isMoving ? "wait" : "pointer",
695
- opacity: isMoving ? 0.6 : 1,
696
- transition: "all 0.15s ease"
697
- },
698
- children: [
699
- isMoving ? /* @__PURE__ */ jsx(LoaderCircle, { size: 12, className: "animate-spin" }) : /* @__PURE__ */ jsx(MoveUp, { size: 12 }),
700
- isMoving ? "Moving..." : "Move"
701
- ]
702
- }
703
- ),
704
- /* @__PURE__ */ jsxs(
705
- "button",
706
- {
707
- type: "button",
708
- onClick: handleOpenClick,
709
- title: "Open repository",
710
- style: {
711
- flex: 1,
712
- display: "inline-flex",
713
- alignItems: "center",
714
- justifyContent: "center",
715
- padding: "6px 10px",
716
- gap: "4px",
717
- borderRadius: "4px",
718
- border: `1px solid ${theme.colors.success || "#10b981"}`,
719
- backgroundColor: `${theme.colors.success || "#10b981"}15`,
720
- color: theme.colors.success || "#10b981",
721
- fontSize: `${theme.fontSizes[0]}px`,
722
- fontWeight: theme.fontWeights.medium,
723
- cursor: "pointer",
724
- transition: "all 0.15s ease"
725
- },
726
- children: [
727
- /* @__PURE__ */ jsx(FolderOpen, { size: 12 }),
728
- "Open"
729
- ]
730
- }
731
- ),
732
- onRemoveFromWorkspace && /* @__PURE__ */ jsxs(
733
- "button",
734
- {
735
- type: "button",
736
- onClick: handleRemoveFromWorkspaceClick,
737
- disabled: isRemoving,
738
- title: "Remove from workspace",
739
- style: {
740
- flex: 1,
741
- display: "inline-flex",
742
- alignItems: "center",
743
- justifyContent: "center",
744
- padding: "6px 10px",
745
- gap: "4px",
746
- borderRadius: "4px",
747
- border: `1px solid ${theme.colors.error || "#ef4444"}`,
748
- backgroundColor: `${theme.colors.error || "#ef4444"}15`,
749
- color: theme.colors.error || "#ef4444",
750
- fontSize: `${theme.fontSizes[0]}px`,
751
- fontWeight: theme.fontWeights.medium,
752
- cursor: isRemoving ? "wait" : "pointer",
753
- opacity: isRemoving ? 0.6 : 1,
754
- transition: "all 0.15s ease"
755
- },
756
- children: [
757
- isRemoving ? /* @__PURE__ */ jsx(LoaderCircle, { size: 12, className: "animate-spin" }) : /* @__PURE__ */ jsx(X, { size: 12 }),
758
- isRemoving ? "Removing..." : "Remove"
759
- ]
760
- }
761
- )
762
- ] });
763
- }
764
- return /* @__PURE__ */ jsxs(Fragment, { children: [
765
- /* @__PURE__ */ jsxs(
766
- "button",
767
- {
768
- type: "button",
769
- onClick: handleOpenClick,
770
- title: "Open locally",
771
- disabled: windowState === "opening",
772
- style: {
773
- flex: 1,
774
- display: "inline-flex",
775
- alignItems: "center",
776
- justifyContent: "center",
777
- padding: "6px 10px",
778
- gap: "4px",
779
- borderRadius: "4px",
780
- border: `1px solid ${theme.colors.success || "#10b981"}`,
781
- backgroundColor: `${theme.colors.success || "#10b981"}15`,
782
- color: theme.colors.success || "#10b981",
783
- fontSize: `${theme.fontSizes[0]}px`,
784
- fontWeight: theme.fontWeights.medium,
785
- cursor: windowState === "opening" ? "wait" : "pointer",
786
- opacity: windowState === "opening" ? 0.6 : 1,
787
- transition: "all 0.15s ease"
788
- },
789
- children: [
790
- windowState === "opening" ? /* @__PURE__ */ jsx(LoaderCircle, { size: 12, className: "animate-spin" }) : /* @__PURE__ */ jsx(FolderOpen, { size: 12 }),
791
- windowState === "opening" ? "Opening..." : "Open"
792
- ]
793
- }
794
- ),
795
- actionMode === "default" && onRemove && /* @__PURE__ */ jsxs(
796
- "button",
797
- {
798
- type: "button",
799
- onClick: handleRemoveClick,
800
- disabled: isLoading,
801
- title: "Remove from local projects",
802
- style: {
803
- flex: 1,
804
- display: "inline-flex",
805
- alignItems: "center",
806
- justifyContent: "center",
807
- padding: "6px 10px",
808
- gap: "4px",
809
- borderRadius: "4px",
810
- border: `1px solid ${theme.colors.error || "#ef4444"}`,
811
- backgroundColor: `${theme.colors.error || "#ef4444"}15`,
812
- color: theme.colors.error || "#ef4444",
813
- fontSize: `${theme.fontSizes[0]}px`,
814
- fontWeight: theme.fontWeights.medium,
815
- cursor: isLoading ? "wait" : "pointer",
816
- opacity: isLoading ? 0.6 : 1,
817
- transition: "all 0.15s ease"
818
- },
819
- children: [
820
- isLoading ? /* @__PURE__ */ jsx(LoaderCircle, { size: 12, className: "animate-spin" }) : /* @__PURE__ */ jsx(X, { size: 12 }),
821
- isLoading ? "Removing..." : "Remove"
822
- ]
823
- }
824
- )
825
- ] });
650
+ const handleButtonHover = (e, isDestructive = false) => {
651
+ if (isDestructive) {
652
+ e.currentTarget.style.backgroundColor = `${theme.colors.error || "#ef4444"}15`;
653
+ e.currentTarget.style.color = theme.colors.error || "#ef4444";
654
+ } else {
655
+ e.currentTarget.style.backgroundColor = theme.colors.backgroundTertiary;
656
+ e.currentTarget.style.color = theme.colors.text;
826
657
  }
658
+ };
659
+ const handleButtonLeave = (e, defaultColor) => {
660
+ e.currentTarget.style.backgroundColor = "transparent";
661
+ e.currentTarget.style.color = defaultColor || theme.colors.textSecondary;
662
+ };
663
+ const renderActionButtons = () => {
827
664
  if (actionMode === "add-to-workspace") {
828
- return /* @__PURE__ */ jsx(
665
+ return /* @__PURE__ */ jsxs(
829
666
  "button",
830
667
  {
831
668
  type: "button",
832
669
  onClick: handleAddToWorkspaceClick,
833
670
  disabled: isLoading,
834
671
  title: "Add to workspace",
835
- style: {
836
- ...actionButtonStyle,
837
- color: theme.colors.primary || "#3b82f6"
838
- },
839
- children: isLoading ? /* @__PURE__ */ jsx(LoaderCircle, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ jsx(Plus, { size: 16 })
672
+ style: actionButtonStyle,
673
+ onMouseEnter: (e) => handleButtonHover(e),
674
+ onMouseLeave: (e) => handleButtonLeave(e),
675
+ children: [
676
+ isLoading ? /* @__PURE__ */ jsx(LoaderCircle, { size: 14, className: "animate-spin" }) : /* @__PURE__ */ jsx(Plus, { size: 14 }),
677
+ /* @__PURE__ */ jsx("span", { children: "Add" })
678
+ ]
840
679
  }
841
680
  );
842
681
  }
843
682
  if (actionMode === "workspace") {
844
683
  return /* @__PURE__ */ jsxs(Fragment, { children: [
845
- isInWorkspaceDirectory === false && onMoveToWorkspace && /* @__PURE__ */ jsx(
684
+ isInWorkspaceDirectory === false && onMoveToWorkspace && /* @__PURE__ */ jsxs(
846
685
  "button",
847
686
  {
848
687
  type: "button",
849
688
  onClick: handleMoveToWorkspaceClick,
850
689
  disabled: isMoving,
851
690
  title: "Move to workspace directory",
852
- style: {
853
- ...actionButtonStyle,
854
- color: theme.colors.primary || "#3b82f6"
855
- },
856
- children: isMoving ? /* @__PURE__ */ jsx(LoaderCircle, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ jsx(MoveUp, { size: 16 })
691
+ style: actionButtonStyle,
692
+ onMouseEnter: (e) => handleButtonHover(e),
693
+ onMouseLeave: (e) => handleButtonLeave(e),
694
+ children: [
695
+ isMoving ? /* @__PURE__ */ jsx(LoaderCircle, { size: 14, className: "animate-spin" }) : /* @__PURE__ */ jsx(MoveUp, { size: 14 }),
696
+ /* @__PURE__ */ jsx("span", { children: "Move" })
697
+ ]
857
698
  }
858
699
  ),
859
- /* @__PURE__ */ jsx(
700
+ /* @__PURE__ */ jsxs(
860
701
  "button",
861
702
  {
862
703
  type: "button",
@@ -866,23 +707,30 @@ const LocalProjectCard = ({
866
707
  ...actionButtonStyle,
867
708
  color: copiedPath ? theme.colors.success || "#10b981" : theme.colors.textSecondary
868
709
  },
869
- children: copiedPath ? /* @__PURE__ */ jsx(Check, { size: 16 }) : /* @__PURE__ */ jsx(Copy, { size: 16 })
710
+ onMouseEnter: (e) => handleButtonHover(e),
711
+ onMouseLeave: (e) => handleButtonLeave(e, copiedPath ? theme.colors.success || "#10b981" : void 0),
712
+ children: [
713
+ copiedPath ? /* @__PURE__ */ jsx(Check, { size: 14 }) : /* @__PURE__ */ jsx(Copy, { size: 14 }),
714
+ /* @__PURE__ */ jsx("span", { children: copiedPath ? "Copied" : "Copy" })
715
+ ]
870
716
  }
871
717
  ),
872
- /* @__PURE__ */ jsx(
718
+ /* @__PURE__ */ jsxs(
873
719
  "button",
874
720
  {
875
721
  type: "button",
876
722
  onClick: handleOpenClick,
877
723
  title: "Open repository",
878
- style: {
879
- ...actionButtonStyle,
880
- color: theme.colors.success || "#10b981"
881
- },
882
- children: /* @__PURE__ */ jsx(FolderOpen, { size: 16 })
724
+ style: actionButtonStyle,
725
+ onMouseEnter: (e) => handleButtonHover(e),
726
+ onMouseLeave: (e) => handleButtonLeave(e),
727
+ children: [
728
+ /* @__PURE__ */ jsx(FolderOpen, { size: 14 }),
729
+ /* @__PURE__ */ jsx("span", { children: "Open" })
730
+ ]
883
731
  }
884
732
  ),
885
- onRemoveFromWorkspace && /* @__PURE__ */ jsx(
733
+ onRemoveFromWorkspace && /* @__PURE__ */ jsxs(
886
734
  "button",
887
735
  {
888
736
  type: "button",
@@ -890,13 +738,18 @@ const LocalProjectCard = ({
890
738
  disabled: isRemoving,
891
739
  title: "Remove from workspace",
892
740
  style: actionButtonStyle,
893
- children: isRemoving ? /* @__PURE__ */ jsx(LoaderCircle, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ jsx(X, { size: 16 })
741
+ onMouseEnter: (e) => handleButtonHover(e, true),
742
+ onMouseLeave: (e) => handleButtonLeave(e),
743
+ children: [
744
+ isRemoving ? /* @__PURE__ */ jsx(LoaderCircle, { size: 14, className: "animate-spin" }) : /* @__PURE__ */ jsx(X, { size: 14 }),
745
+ /* @__PURE__ */ jsx("span", { children: "Remove" })
746
+ ]
894
747
  }
895
748
  )
896
749
  ] });
897
750
  }
898
751
  return /* @__PURE__ */ jsxs(Fragment, { children: [
899
- /* @__PURE__ */ jsx(
752
+ /* @__PURE__ */ jsxs(
900
753
  "button",
901
754
  {
902
755
  type: "button",
@@ -906,24 +759,31 @@ const LocalProjectCard = ({
906
759
  ...actionButtonStyle,
907
760
  color: copiedPath ? theme.colors.success || "#10b981" : theme.colors.textSecondary
908
761
  },
909
- children: copiedPath ? /* @__PURE__ */ jsx(Check, { size: 16 }) : /* @__PURE__ */ jsx(Copy, { size: 16 })
762
+ onMouseEnter: (e) => handleButtonHover(e),
763
+ onMouseLeave: (e) => handleButtonLeave(e, copiedPath ? theme.colors.success || "#10b981" : void 0),
764
+ children: [
765
+ copiedPath ? /* @__PURE__ */ jsx(Check, { size: 14 }) : /* @__PURE__ */ jsx(Copy, { size: 14 }),
766
+ /* @__PURE__ */ jsx("span", { children: copiedPath ? "Copied" : "Copy" })
767
+ ]
910
768
  }
911
769
  ),
912
- /* @__PURE__ */ jsx(
770
+ /* @__PURE__ */ jsxs(
913
771
  "button",
914
772
  {
915
773
  type: "button",
916
774
  onClick: handleOpenClick,
917
775
  title: windowState === "ready" ? "Focus window" : windowState === "opening" ? "Window is opening..." : "Open locally",
918
776
  disabled: windowState === "opening",
919
- style: {
920
- ...actionButtonStyle,
921
- color: theme.colors.success || "#10b981"
922
- },
923
- children: windowState === "ready" ? /* @__PURE__ */ jsx(Focus, { size: 16 }) : windowState === "opening" ? /* @__PURE__ */ jsx(LoaderCircle, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ jsx(FolderOpen, { size: 16 })
777
+ style: actionButtonStyle,
778
+ onMouseEnter: (e) => handleButtonHover(e),
779
+ onMouseLeave: (e) => handleButtonLeave(e),
780
+ children: [
781
+ windowState === "ready" ? /* @__PURE__ */ jsx(Focus, { size: 14 }) : windowState === "opening" ? /* @__PURE__ */ jsx(LoaderCircle, { size: 14, className: "animate-spin" }) : /* @__PURE__ */ jsx(FolderOpen, { size: 14 }),
782
+ /* @__PURE__ */ jsx("span", { children: windowState === "ready" ? "Focus" : "Open" })
783
+ ]
924
784
  }
925
785
  ),
926
- actionMode === "default" && onRemove && /* @__PURE__ */ jsx(
786
+ actionMode === "default" && onRemove && /* @__PURE__ */ jsxs(
927
787
  "button",
928
788
  {
929
789
  type: "button",
@@ -931,93 +791,149 @@ const LocalProjectCard = ({
931
791
  disabled: isLoading,
932
792
  title: "Remove from local projects",
933
793
  style: actionButtonStyle,
934
- children: isLoading ? /* @__PURE__ */ jsx(LoaderCircle, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ jsx(X, { size: 16 })
794
+ onMouseEnter: (e) => handleButtonHover(e, true),
795
+ onMouseLeave: (e) => handleButtonLeave(e),
796
+ children: [
797
+ isLoading ? /* @__PURE__ */ jsx(LoaderCircle, { size: 14, className: "animate-spin" }) : /* @__PURE__ */ jsx(X, { size: 14 }),
798
+ /* @__PURE__ */ jsx("span", { children: "Remove" })
799
+ ]
935
800
  }
936
801
  )
937
802
  ] });
938
803
  };
804
+ const cardStyle = {
805
+ display: "flex",
806
+ flexDirection: "row",
807
+ gap: "12px",
808
+ padding: "12px",
809
+ borderRadius: "6px",
810
+ backgroundColor: isSelected ? theme.colors.backgroundTertiary : isHovered ? theme.colors.backgroundTertiary : "transparent",
811
+ border: `1px solid ${isSelected ? theme.colors.primary || theme.colors.border : isHovered ? theme.colors.border : "transparent"}`,
812
+ cursor: "pointer",
813
+ transition: "all 0.15s ease",
814
+ fontFamily: theme.fonts.body
815
+ };
939
816
  return /* @__PURE__ */ jsxs(
940
817
  "div",
941
818
  {
942
819
  className: "local-project-card",
943
- style: {
944
- padding: "8px 12px",
945
- borderRadius: "4px",
946
- backgroundColor: isSelected ? `${highlightColor}15` : "transparent",
947
- border: isSelected ? `1px solid ${highlightColor}40` : "1px solid transparent",
948
- cursor: "pointer",
949
- transition: "background-color 0.15s",
950
- fontFamily: theme.fonts.body
951
- },
820
+ style: cardStyle,
952
821
  onClick: handleCardClick,
953
822
  onDoubleClick: handleDoubleClick,
954
823
  onMouseEnter: () => setIsHovered(true),
955
824
  onMouseLeave: () => setIsHovered(false),
956
825
  children: [
957
- /* @__PURE__ */ jsxs("div", { className: "local-project-card__content", children: [
958
- /* @__PURE__ */ jsx(
959
- RepositoryAvatar,
960
- {
961
- customAvatarUrl: avatarUrl,
962
- size: 32,
963
- fallbackIcon: /* @__PURE__ */ jsx(
964
- "div",
965
- {
966
- style: {
967
- color: theme.colors.textSecondary,
968
- fontSize: `${theme.fontSizes[0]}px`,
969
- fontWeight: theme.fontWeights.semibold
970
- },
971
- children: ((_b = entry.name[0]) == null ? void 0 : _b.toUpperCase()) || "?"
972
- }
973
- )
974
- }
975
- ),
976
- /* @__PURE__ */ jsxs("div", { className: "local-project-card__info", children: [
977
- /* @__PURE__ */ jsx(
978
- "span",
979
- {
980
- style: {
981
- fontSize: `${theme.fontSizes[2]}px`,
982
- fontWeight: theme.fontWeights.medium,
983
- color: theme.colors.text,
984
- overflow: "hidden",
985
- textOverflow: "ellipsis",
986
- whiteSpace: "nowrap",
987
- textDecoration: "underline",
988
- textDecorationColor: ((_c = entry.github) == null ? void 0 : _c.primaryLanguage) ? getLanguageColor(entry.github.primaryLanguage) : theme.colors.textSecondary,
989
- textUnderlineOffset: "3px"
990
- },
991
- children: entry.name
992
- }
993
- ),
994
- ((_d = entry.github) == null ? void 0 : _d.description) && /* @__PURE__ */ jsx(
826
+ /* @__PURE__ */ jsx(
827
+ RepositoryAvatar,
828
+ {
829
+ customAvatarUrl: avatarUrl,
830
+ size: 48,
831
+ fallbackIcon: /* @__PURE__ */ jsx(
995
832
  "div",
996
833
  {
997
- className: "local-project-card__meta",
998
834
  style: {
999
- alignItems: "center",
1000
- gap: "12px",
1001
- fontSize: `${theme.fontSizes[0]}px`,
1002
- color: theme.colors.textSecondary
835
+ color: theme.colors.textSecondary,
836
+ fontSize: `${theme.fontSizes[2]}px`,
837
+ fontWeight: theme.fontWeights.semibold
1003
838
  },
1004
- children: /* @__PURE__ */ jsx(
1005
- "span",
1006
- {
1007
- style: {
1008
- overflow: "hidden",
1009
- textOverflow: "ellipsis",
1010
- whiteSpace: "nowrap"
1011
- },
1012
- children: entry.github.description
1013
- }
1014
- )
839
+ children: ((_b = entry.name[0]) == null ? void 0 : _b.toUpperCase()) || "?"
1015
840
  }
1016
841
  )
1017
- ] }),
1018
- /* @__PURE__ */ jsx("div", { className: "local-project-card__actions", children: renderActionButtons(false) })
1019
- ] }),
1020
- /* @__PURE__ */ jsx("div", { className: "local-project-card__actions--stacked", children: renderActionButtons(true) })
842
+ }
843
+ ),
844
+ /* @__PURE__ */ jsxs(
845
+ "div",
846
+ {
847
+ style: {
848
+ flex: 1,
849
+ display: "flex",
850
+ flexDirection: "column",
851
+ gap: "4px",
852
+ minWidth: 0
853
+ },
854
+ children: [
855
+ /* @__PURE__ */ jsx(
856
+ "div",
857
+ {
858
+ style: {
859
+ display: "flex",
860
+ alignItems: "center",
861
+ gap: "8px"
862
+ },
863
+ children: /* @__PURE__ */ jsx(
864
+ "span",
865
+ {
866
+ style: {
867
+ flex: 1,
868
+ fontSize: `${theme.fontSizes[2]}px`,
869
+ fontWeight: theme.fontWeights.semibold,
870
+ color: theme.colors.text,
871
+ overflow: "hidden",
872
+ textOverflow: "ellipsis",
873
+ whiteSpace: "nowrap",
874
+ textDecoration: "underline",
875
+ textDecorationColor: ((_c = entry.github) == null ? void 0 : _c.primaryLanguage) ? getLanguageColor(entry.github.primaryLanguage) : theme.colors.textSecondary,
876
+ textUnderlineOffset: "3px"
877
+ },
878
+ children: entry.name
879
+ }
880
+ )
881
+ }
882
+ ),
883
+ /* @__PURE__ */ jsxs(
884
+ "div",
885
+ {
886
+ style: {
887
+ display: "flex",
888
+ alignItems: "center",
889
+ minHeight: "24px",
890
+ position: "relative"
891
+ },
892
+ children: [
893
+ /* @__PURE__ */ jsx(
894
+ "div",
895
+ {
896
+ style: {
897
+ flex: 1,
898
+ fontSize: `${theme.fontSizes[1]}px`,
899
+ color: theme.colors.textSecondary,
900
+ lineHeight: 1.4,
901
+ whiteSpace: "nowrap",
902
+ overflow: "hidden",
903
+ textOverflow: "ellipsis",
904
+ minWidth: 0,
905
+ opacity: isHovered ? 0 : 1,
906
+ transition: "opacity 0.15s ease"
907
+ },
908
+ title: ((_d = entry.github) == null ? void 0 : _d.description) || displayPath,
909
+ children: ((_e = entry.github) == null ? void 0 : _e.description) || displayPath
910
+ }
911
+ ),
912
+ /* @__PURE__ */ jsx(
913
+ "div",
914
+ {
915
+ style: {
916
+ position: "absolute",
917
+ left: 0,
918
+ right: 0,
919
+ top: 0,
920
+ bottom: 0,
921
+ display: "flex",
922
+ alignItems: "center",
923
+ gap: "4px",
924
+ opacity: isHovered ? 1 : 0,
925
+ pointerEvents: isHovered ? "auto" : "none",
926
+ transition: "opacity 0.15s ease"
927
+ },
928
+ children: renderActionButtons()
929
+ }
930
+ )
931
+ ]
932
+ }
933
+ )
934
+ ]
935
+ }
936
+ )
1021
937
  ]
1022
938
  }
1023
939
  );
@@ -1423,7 +1339,9 @@ const WorkspaceRepositoriesPanelContent = ({
1423
1339
  const panelActions = actions;
1424
1340
  const workspaceSlice = context.getSlice("workspace");
1425
1341
  const repositoriesSlice = context.getSlice("workspaceRepositories");
1342
+ const userHomePathSlice = context.getSlice("userHomePath");
1426
1343
  const workspace = (workspaceSlice == null ? void 0 : workspaceSlice.data) ?? null;
1344
+ const userHomePath = (userHomePathSlice == null ? void 0 : userHomePathSlice.data) ?? void 0;
1427
1345
  const isLoading = (workspaceSlice == null ? void 0 : workspaceSlice.loading) || (repositoriesSlice == null ? void 0 : repositoriesSlice.loading) || false;
1428
1346
  const sortedRepositories = useMemo(() => {
1429
1347
  const repos = (repositoriesSlice == null ? void 0 : repositoriesSlice.data) ?? [];
@@ -1802,6 +1720,7 @@ const WorkspaceRepositoriesPanelContent = ({
1802
1720
  actionMode: "workspace",
1803
1721
  isInWorkspaceDirectory: true,
1804
1722
  workspacePath: workspace.suggestedClonePath,
1723
+ userHomePath,
1805
1724
  onSelect: handleSelectRepository,
1806
1725
  onOpen: handleOpenRepository,
1807
1726
  onRemoveFromWorkspace: handleRemoveFromWorkspace,
@@ -1834,6 +1753,7 @@ const WorkspaceRepositoriesPanelContent = ({
1834
1753
  actionMode: "workspace",
1835
1754
  isInWorkspaceDirectory: false,
1836
1755
  workspacePath: workspace.suggestedClonePath,
1756
+ userHomePath,
1837
1757
  onSelect: handleSelectRepository,
1838
1758
  onOpen: handleOpenRepository,
1839
1759
  onRemoveFromWorkspace: handleRemoveFromWorkspace,
@@ -1950,16 +1870,17 @@ const WorkspaceCard = ({
1950
1870
  display: "flex",
1951
1871
  alignItems: "center",
1952
1872
  justifyContent: "center",
1953
- width: "24px",
1873
+ gap: "4px",
1874
+ flex: 1,
1954
1875
  height: "24px",
1955
- padding: 0,
1876
+ padding: "0 8px",
1956
1877
  border: "none",
1957
1878
  borderRadius: "4px",
1958
1879
  backgroundColor: "transparent",
1959
1880
  color: theme.colors.textSecondary,
1960
1881
  cursor: "pointer",
1961
- opacity: isHovered ? 1 : 0,
1962
- pointerEvents: isHovered ? "auto" : "none",
1882
+ fontSize: `${theme.fontSizes[1]}px`,
1883
+ fontFamily: theme.fonts.body,
1963
1884
  transition: "all 0.15s ease"
1964
1885
  };
1965
1886
  return /* @__PURE__ */ jsxs(
@@ -1978,15 +1899,14 @@ const WorkspaceCard = ({
1978
1899
  display: "flex",
1979
1900
  alignItems: "center",
1980
1901
  justifyContent: "center",
1981
- width: "40px",
1982
- height: "40px",
1902
+ width: "48px",
1903
+ height: "48px",
1983
1904
  borderRadius: "6px",
1984
1905
  backgroundColor: `color-mix(in srgb, ${iconColor} 12%, transparent)`,
1985
1906
  color: iconColor,
1986
- flexShrink: 0,
1987
- marginTop: "2px"
1907
+ flexShrink: 0
1988
1908
  },
1989
- children: workspace.icon ? /* @__PURE__ */ jsx("span", { style: { fontSize: `${theme.fontSizes[3]}px` }, children: workspace.icon }) : /* @__PURE__ */ jsx(DoorClosed, { size: 24 })
1909
+ children: workspace.icon ? /* @__PURE__ */ jsx("span", { style: { fontSize: `${theme.fontSizes[4]}px` }, children: workspace.icon }) : /* @__PURE__ */ jsx(DoorClosed, { size: 28 })
1990
1910
  }
1991
1911
  ),
1992
1912
  /* @__PURE__ */ jsxs(
@@ -2086,57 +2006,6 @@ const WorkspaceCard = ({
2086
2006
  children: workspace.name
2087
2007
  }
2088
2008
  ),
2089
- onOpen && /* @__PURE__ */ jsx(
2090
- "button",
2091
- {
2092
- onClick: handleOpenClick,
2093
- title: "Open workspace",
2094
- style: actionButtonStyle,
2095
- onMouseEnter: (e) => {
2096
- e.currentTarget.style.backgroundColor = theme.colors.backgroundTertiary;
2097
- e.currentTarget.style.color = theme.colors.text;
2098
- },
2099
- onMouseLeave: (e) => {
2100
- e.currentTarget.style.backgroundColor = "transparent";
2101
- e.currentTarget.style.color = theme.colors.textSecondary;
2102
- },
2103
- children: /* @__PURE__ */ jsx(ExternalLink, { size: 16 })
2104
- }
2105
- ),
2106
- onUpdateName && /* @__PURE__ */ jsx(
2107
- "button",
2108
- {
2109
- onClick: handleStartEdit,
2110
- title: "Edit workspace name",
2111
- style: actionButtonStyle,
2112
- onMouseEnter: (e) => {
2113
- e.currentTarget.style.backgroundColor = theme.colors.backgroundTertiary;
2114
- e.currentTarget.style.color = theme.colors.text;
2115
- },
2116
- onMouseLeave: (e) => {
2117
- e.currentTarget.style.backgroundColor = "transparent";
2118
- e.currentTarget.style.color = theme.colors.textSecondary;
2119
- },
2120
- children: /* @__PURE__ */ jsx(Pen, { size: 16 })
2121
- }
2122
- ),
2123
- onDelete && /* @__PURE__ */ jsx(
2124
- "button",
2125
- {
2126
- onClick: handleDeleteClick,
2127
- title: "Delete workspace",
2128
- style: actionButtonStyle,
2129
- onMouseEnter: (e) => {
2130
- e.currentTarget.style.backgroundColor = `${theme.colors.error}15`;
2131
- e.currentTarget.style.color = theme.colors.error;
2132
- },
2133
- onMouseLeave: (e) => {
2134
- e.currentTarget.style.backgroundColor = "transparent";
2135
- e.currentTarget.style.color = theme.colors.textSecondary;
2136
- },
2137
- children: /* @__PURE__ */ jsx(Trash2, { size: 16 })
2138
- }
2139
- ),
2140
2009
  isDefault && /* @__PURE__ */ jsx(
2141
2010
  "span",
2142
2011
  {
@@ -2150,20 +2019,117 @@ const WorkspaceCard = ({
2150
2019
  }
2151
2020
  )
2152
2021
  ] }) }),
2153
- workspace.description && !isEditing && /* @__PURE__ */ jsx(
2022
+ !isEditing && /* @__PURE__ */ jsxs(
2154
2023
  "div",
2155
2024
  {
2156
2025
  style: {
2157
- fontSize: `${theme.fontSizes[1]}px`,
2158
- color: theme.colors.textSecondary,
2159
- fontFamily: theme.fonts.body,
2160
- lineHeight: 1.4,
2161
- whiteSpace: "nowrap",
2162
- overflow: "hidden",
2163
- textOverflow: "ellipsis"
2026
+ display: "flex",
2027
+ alignItems: "center",
2028
+ minHeight: "24px",
2029
+ position: "relative"
2164
2030
  },
2165
- title: workspace.description,
2166
- children: workspace.description
2031
+ children: [
2032
+ /* @__PURE__ */ jsx(
2033
+ "div",
2034
+ {
2035
+ style: {
2036
+ flex: 1,
2037
+ fontSize: `${theme.fontSizes[1]}px`,
2038
+ color: theme.colors.textSecondary,
2039
+ fontFamily: theme.fonts.body,
2040
+ lineHeight: 1.4,
2041
+ whiteSpace: "nowrap",
2042
+ overflow: "hidden",
2043
+ textOverflow: "ellipsis",
2044
+ minWidth: 0,
2045
+ opacity: isHovered ? 0 : 1,
2046
+ transition: "opacity 0.15s ease"
2047
+ },
2048
+ title: workspace.description,
2049
+ children: workspace.description || " "
2050
+ }
2051
+ ),
2052
+ /* @__PURE__ */ jsxs(
2053
+ "div",
2054
+ {
2055
+ style: {
2056
+ position: "absolute",
2057
+ left: 0,
2058
+ right: 0,
2059
+ top: 0,
2060
+ bottom: 0,
2061
+ display: "flex",
2062
+ alignItems: "center",
2063
+ gap: "4px",
2064
+ opacity: isHovered ? 1 : 0,
2065
+ pointerEvents: isHovered ? "auto" : "none",
2066
+ transition: "opacity 0.15s ease"
2067
+ },
2068
+ children: [
2069
+ onOpen && /* @__PURE__ */ jsxs(
2070
+ "button",
2071
+ {
2072
+ onClick: handleOpenClick,
2073
+ title: "Open workspace",
2074
+ style: actionButtonStyle,
2075
+ onMouseEnter: (e) => {
2076
+ e.currentTarget.style.backgroundColor = theme.colors.backgroundTertiary;
2077
+ e.currentTarget.style.color = theme.colors.text;
2078
+ },
2079
+ onMouseLeave: (e) => {
2080
+ e.currentTarget.style.backgroundColor = "transparent";
2081
+ e.currentTarget.style.color = theme.colors.textSecondary;
2082
+ },
2083
+ children: [
2084
+ /* @__PURE__ */ jsx(ExternalLink, { size: 14 }),
2085
+ /* @__PURE__ */ jsx("span", { children: "Open" })
2086
+ ]
2087
+ }
2088
+ ),
2089
+ onUpdateName && /* @__PURE__ */ jsxs(
2090
+ "button",
2091
+ {
2092
+ onClick: handleStartEdit,
2093
+ title: "Edit workspace name",
2094
+ style: actionButtonStyle,
2095
+ onMouseEnter: (e) => {
2096
+ e.currentTarget.style.backgroundColor = theme.colors.backgroundTertiary;
2097
+ e.currentTarget.style.color = theme.colors.text;
2098
+ },
2099
+ onMouseLeave: (e) => {
2100
+ e.currentTarget.style.backgroundColor = "transparent";
2101
+ e.currentTarget.style.color = theme.colors.textSecondary;
2102
+ },
2103
+ children: [
2104
+ /* @__PURE__ */ jsx(Pen, { size: 14 }),
2105
+ /* @__PURE__ */ jsx("span", { children: "Edit" })
2106
+ ]
2107
+ }
2108
+ ),
2109
+ onDelete && /* @__PURE__ */ jsxs(
2110
+ "button",
2111
+ {
2112
+ onClick: handleDeleteClick,
2113
+ title: "Delete workspace",
2114
+ style: actionButtonStyle,
2115
+ onMouseEnter: (e) => {
2116
+ e.currentTarget.style.backgroundColor = `${theme.colors.error}15`;
2117
+ e.currentTarget.style.color = theme.colors.error;
2118
+ },
2119
+ onMouseLeave: (e) => {
2120
+ e.currentTarget.style.backgroundColor = "transparent";
2121
+ e.currentTarget.style.color = theme.colors.textSecondary;
2122
+ },
2123
+ children: [
2124
+ /* @__PURE__ */ jsx(Trash2, { size: 14 }),
2125
+ /* @__PURE__ */ jsx("span", { children: "Delete" })
2126
+ ]
2127
+ }
2128
+ )
2129
+ ]
2130
+ }
2131
+ )
2132
+ ]
2167
2133
  }
2168
2134
  )
2169
2135
  ]