@industry-theme/repository-composition-panels 0.2.1 → 0.2.2

package/dist/panels/components/DependencyRow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DependencyRow.d.ts","sourceRoot":"","sources":["../../../src/panels/components/DependencyRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE/D,UAAU,kBAAkB;IAC1B,UAAU,EAAE,cAAc,CAAC;CAC5B;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAoHtD,CAAC"}
+{"version":3,"file":"DependencyRow.d.ts","sourceRoot":"","sources":["../../../src/panels/components/DependencyRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAE/D,UAAU,kBAAkB;IAC1B,UAAU,EAAE,cAAc,CAAC;CAC5B;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA8JtD,CAAC"}

package/dist/panels.bundle.js

@@ -320,7 +320,7 @@ const createLucideIcon = (iconName, iconNode) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$i = [
+const __iconNode$k = [
   [
     "path",
     {
@@ -352,47 +352,66 @@ const __iconNode$i = [
   ["path", { d: "m12 8 4.74-2.85", key: "3rx089" }],
   ["path", { d: "M12 13.5V8", key: "1io7kd" }]
 ];
-const Boxes = createLucideIcon("boxes", __iconNode$i);
+const Boxes = createLucideIcon("boxes", __iconNode$k);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$h = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$h);
+const __iconNode$j = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$j);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$g = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$g);
+const __iconNode$i = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$i);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$f = [
+const __iconNode$h = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$h);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$g = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
   ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
 ];
-const CircleAlert = createLucideIcon("circle-alert", __iconNode$f);
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$g);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$e = [
+const __iconNode$f = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3", key: "1u773s" }],
   ["path", { d: "M12 17h.01", key: "p32p05" }]
 ];
-const CircleQuestionMark = createLucideIcon("circle-question-mark", __iconNode$e);
+const CircleQuestionMark = createLucideIcon("circle-question-mark", __iconNode$f);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$e = [
+  ["rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2", key: "17jyea" }],
+  ["path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2", key: "zix9uf" }]
+];
+const Copy = createLucideIcon("copy", __iconNode$e);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
@@ -9153,6 +9172,8 @@ const InfoItem = ({ badge, title, description, theme: theme2 }) => /* @__PURE__
 );
 const DependencyRow = ({ dependency }) => {
   const { theme: theme2 } = useTheme();
+  const [isHovered, setIsHovered] = useState(false);
+  const [copied, setCopied] = useState(false);
   const getDependencyTypeBadgeStyle = (type) => {
     const baseStyle = {
       padding: `${theme2.space[1]}px ${theme2.space[2]}px`,
@@ -9189,6 +9210,31 @@ const DependencyRow = ({ dependency }) => {
         };
     }
   };
+  const handleCopy = async (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    try {
+      const copyText = `${dependency.name}@${dependency.version}`;
+      await navigator.clipboard.writeText(copyText);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch (err) {
+      console.error("Failed to copy:", err);
+    }
+  };
+  const actionButtonStyle = {
+    padding: `${theme2.space[1]}px`,
+    borderRadius: `${theme2.radii[1]}px`,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    border: "none",
+    backgroundColor: "transparent",
+    cursor: "pointer",
+    transition: "all 0.15s ease",
+    opacity: isHovered ? 1 : 0,
+    pointerEvents: isHovered ? "auto" : "none"
+  };
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -9203,6 +9249,8 @@ const DependencyRow = ({ dependency }) => {
         border: `1px solid ${theme2.colors.border}`,
         transition: "all 0.2s"
       },
+      onMouseEnter: () => setIsHovered(true),
+      onMouseLeave: () => setIsHovered(false),
       children: [
         /* @__PURE__ */ jsxs(
           "div",
@@ -9228,6 +9276,22 @@ const DependencyRow = ({ dependency }) => {
                   },
                   children: dependency.name
                 }
+              ),
+              /* @__PURE__ */ jsx(
+                "a",
+                {
+                  href: `https://www.npmjs.com/package/${dependency.name}`,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  style: {
+                    ...actionButtonStyle,
+                    color: theme2.colors.textSecondary,
+                    textDecoration: "none",
+                    flexShrink: 0
+                  },
+                  title: "View on npm",
+                  children: /* @__PURE__ */ jsx(ExternalLink, { size: 12 })
+                }
               )
             ]
           }
@@ -9238,27 +9302,23 @@ const DependencyRow = ({ dependency }) => {
             style: {
               display: "flex",
               alignItems: "center",
-              gap: "8px"
+              gap: "4px"
             },
             children: [
-              /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary }, children: dependency.version }),
               /* @__PURE__ */ jsx(
-                "a",
+                "button",
                 {
-                  href: `https://www.npmjs.com/package/${dependency.name}`,
-                  target: "_blank",
-                  rel: "noopener noreferrer",
+                  type: "button",
+                  onClick: handleCopy,
                   style: {
-                    padding: `${theme2.space[1]}px`,
-                    borderRadius: `${theme2.radii[1]}px`,
-                    display: "flex",
-                    alignItems: "center",
-                    transition: "background-color 0.2s"
+                    ...actionButtonStyle,
+                    color: copied ? theme2.colors.success || "#10b981" : theme2.colors.textSecondary
                   },
-                  title: "View on npm",
-                  children: /* @__PURE__ */ jsx(ExternalLink, { size: 12, color: theme2.colors.textSecondary })
+                  title: copied ? "Copied!" : `Copy ${dependency.name}@${dependency.version}`,
+                  children: copied ? /* @__PURE__ */ jsx(Check, { size: 12 }) : /* @__PURE__ */ jsx(Copy, { size: 12 })
                 }
-              )
+              ),
+              /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary }, children: dependency.version })
             ]
           }
         )