@replicated/portal-components 0.0.11 → 0.0.12

package/dist/esm/update-layout.js

@@ -61,10 +61,14 @@ var defaultTopNavLinks = [
         className: "h-4 w-4",
         fill: "none",
         stroke: "currentColor",
-        strokeWidth: "1.5",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
         children: [
-          /* @__PURE__ */ jsx("path", { d: "M4 13h6V3H4z" }),
-          /* @__PURE__ */ jsx("path", { d: "M14 21h6V3h-6z" })
+          /* @__PURE__ */ jsx("rect", { width: "7", height: "9", x: "3", y: "3", rx: "1" }),
+          /* @__PURE__ */ jsx("rect", { width: "7", height: "5", x: "14", y: "3", rx: "1" }),
+          /* @__PURE__ */ jsx("rect", { width: "7", height: "9", x: "14", y: "12", rx: "1" }),
+          /* @__PURE__ */ jsx("rect", { width: "7", height: "5", x: "3", y: "16", rx: "1" })
         ]
       }
     )
@@ -79,11 +83,13 @@ var defaultTopNavLinks = [
         className: "h-4 w-4",
         fill: "none",
         stroke: "currentColor",
-        strokeWidth: "1.5",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
         children: [
-          /* @__PURE__ */ jsx("path", { d: "M12 3v12" }),
-          /* @__PURE__ */ jsx("path", { d: "m7 11 5 5 5-5" }),
-          /* @__PURE__ */ jsx("path", { d: "M5 21h14" })
+          /* @__PURE__ */ jsx("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+          /* @__PURE__ */ jsx("polyline", { points: "7 10 12 15 17 10" }),
+          /* @__PURE__ */ jsx("line", { x1: "12", x2: "12", y1: "15", y2: "3" })
         ]
       }
     )
@@ -99,10 +105,13 @@ var defaultTopNavLinks = [
         className: "h-4 w-4",
         fill: "none",
         stroke: "currentColor",
-        strokeWidth: "1.5",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
         children: [
-          /* @__PURE__ */ jsx("path", { d: "M12 5v14" }),
-          /* @__PURE__ */ jsx("path", { d: "M5 12h14" })
+          /* @__PURE__ */ jsx("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+          /* @__PURE__ */ jsx("polyline", { points: "7 10 12 15 17 10" }),
+          /* @__PURE__ */ jsx("line", { x1: "12", x2: "12", y1: "15", y2: "3" })
         ]
       }
     )
@@ -118,15 +127,34 @@ var defaultTopNavLinks = [
         className: "h-4 w-4",
         fill: "none",
         stroke: "currentColor",
-        strokeWidth: "1.5",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
         children: [
-          /* @__PURE__ */ jsx("path", { d: "M4 4v6h6" }),
-          /* @__PURE__ */ jsx("path", { d: "M20 20v-6h-6" }),
-          /* @__PURE__ */ jsx("path", { d: "M4 10c1.5-4 6-6 10-4m6 4c-1.5 4-6 6-10 4" })
+          /* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8" }),
+          /* @__PURE__ */ jsx("path", { d: "M21 3v5h-5" })
         ]
       }
     )
   },
+  {
+    label: "Security",
+    href: "/security",
+    icon: /* @__PURE__ */ jsx(
+      "svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 24 24",
+        className: "h-4 w-4",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: /* @__PURE__ */ jsx("path", { d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z" })
+      }
+    )
+  },
   {
     label: "Release History",
     href: "/release-history",
@@ -138,10 +166,15 @@ var defaultTopNavLinks = [
         className: "h-4 w-4",
         fill: "none",
         stroke: "currentColor",
-        strokeWidth: "1.5",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
         children: [
-          /* @__PURE__ */ jsx("path", { d: "M12 8v4l3 2" }),
-          /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "9" })
+          /* @__PURE__ */ jsx("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+          /* @__PURE__ */ jsx("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" }),
+          /* @__PURE__ */ jsx("path", { d: "M10 9H8" }),
+          /* @__PURE__ */ jsx("path", { d: "M16 13H8" }),
+          /* @__PURE__ */ jsx("path", { d: "M16 17H8" })
         ]
       }
     )
@@ -157,12 +190,13 @@ var defaultTopNavLinks = [
         className: "h-4 w-4",
         fill: "none",
         stroke: "currentColor",
-        strokeWidth: "1.5",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
         children: [
-          /* @__PURE__ */ jsx("rect", { width: "14", height: "18", x: "5", y: "3", rx: "2" }),
-          /* @__PURE__ */ jsx("path", { d: "M9 7h6" }),
-          /* @__PURE__ */ jsx("path", { d: "M9 11h6" }),
-          /* @__PURE__ */ jsx("path", { d: "M9 15h6" })
+          /* @__PURE__ */ jsx("path", { d: "m15.5 7.5 2.3 2.3a1 1 0 0 0 1.4 0l2.1-2.1a1 1 0 0 0 0-1.4L19 4" }),
+          /* @__PURE__ */ jsx("path", { d: "m21 2-9.6 9.6" }),
+          /* @__PURE__ */ jsx("circle", { cx: "7.5", cy: "15.5", r: "5.5" })
         ]
       }
     )
@@ -178,10 +212,16 @@ var defaultTopNavLinks = [
         className: "h-4 w-4",
         fill: "none",
         stroke: "currentColor",
-        strokeWidth: "1.5",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
         children: [
-          /* @__PURE__ */ jsx("path", { d: "M18 16a6 6 0 1 0-12 0v2h12Z" }),
-          /* @__PURE__ */ jsx("circle", { cx: "12", cy: "7", r: "4" })
+          /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+          /* @__PURE__ */ jsx("path", { d: "m4.93 4.93 4.24 4.24" }),
+          /* @__PURE__ */ jsx("path", { d: "m14.83 9.17 4.24-4.24" }),
+          /* @__PURE__ */ jsx("path", { d: "m14.83 14.83 4.24 4.24" }),
+          /* @__PURE__ */ jsx("path", { d: "m9.17 14.83-4.24 4.24" }),
+          /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "4" })
         ]
       }
     )
@@ -281,7 +321,7 @@ var TopNav = async ({
   return /* @__PURE__ */ jsx(
     "div",
     {
-      className: "relative flex h-[165px] w-full items-start justify-center",
+      className: "relative flex h-[280px] w-full items-start justify-center",
       style: {
         backgroundImage: `linear-gradient(to top, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 33%), linear-gradient(${gradientStart}, ${gradientEnd})`,
         backgroundRepeat: "no-repeat",
@@ -308,7 +348,7 @@ var TopNav = async ({
             brandTitle ? /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold text-gray-900", children: brandTitle }) : null
           ] }) : /* @__PURE__ */ jsx("div", {}),
           /* @__PURE__ */ jsxs("details", { className: "group relative", children: [
-            /* @__PURE__ */ jsxs("summary", { className: "flex cursor-pointer items-center gap-2 rounded-lg bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 list-none", children: [
+            /* @__PURE__ */ jsxs("summary", { className: "flex cursor-pointer items-center gap-2 text-sm font-medium text-gray-600 hover:text-gray-900 list-none", children: [
               /* @__PURE__ */ jsxs(
                 "svg",
                 {
@@ -380,12 +420,12 @@ var TopNav = async ({
           const className = `flex items-center gap-2 px-4 py-1 transition text-gray-500 ${isActive ? "underline underline-offset-8 decoration-2" : ""}`;
           if (href) {
             return /* @__PURE__ */ jsxs(Link, { href, className, children: [
-              /* @__PURE__ */ jsx("span", { className: isActive ? "text-rose-600" : "text-gray-500", children: icon }),
+              /* @__PURE__ */ jsx("span", { className: isActive ? "text-gray-900" : "text-gray-500", children: icon }),
               /* @__PURE__ */ jsx("span", { children: label })
             ] }, label);
           }
           return /* @__PURE__ */ jsxs("button", { className, type: "button", children: [
-            /* @__PURE__ */ jsx("span", { className: isActive ? "text-rose-600" : "text-gray-500", children: icon }),
+            /* @__PURE__ */ jsx("span", { className: isActive ? "text-gray-900" : "text-gray-500", children: icon }),
             /* @__PURE__ */ jsx("span", { children: label })
           ] }, label);
         }) })