@xenide-io/the-old-ui-theme 0.5.2 → 0.5.3

package/dist/suite.mjs

@@ -99,10 +99,10 @@ var APP_ACCENTS = {
   },
   nakama: {
     label: "Nakama",
-    accent: "#0891b2",
-    tile: "#155e75",
-    onTile: "#ffffff",
-    onTileAccent: "#a5f3fc"
+    accent: "#b8eb44",
+    tile: "#17101f",
+    onTile: "#fff2e2",
+    onTileAccent: "#f54b87"
   }
 };
 var APP_GLYPHS = {
@@ -111,7 +111,7 @@ var APP_GLYPHS = {
   kraken: "squid-doc",
   shellstack: "stack-hex",
   crew: "crew-bot",
-  nakama: "crew-bot"
+  nakama: "nakama-fist"
 };
 
 // src/suite/icons/glyph-parts.tsx
@@ -121,7 +121,15 @@ function GlyphElement({ element }) {
   const stroke = element.filled ? "none" : void 0;
   switch (element.kind) {
     case "path":
-      return /* @__PURE__ */ jsx2("path", { d: element.d, fill, stroke });
+      return /* @__PURE__ */ jsx2(
+        "path",
+        {
+          d: element.d,
+          fill,
+          stroke,
+          transform: element.transform
+        }
+      );
     case "circle":
       return /* @__PURE__ */ jsx2(
         "circle",
@@ -226,6 +234,24 @@ var SUITE_GLYPHS = {
       { kind: "path", d: "M9.6 14.6q2.4 1.7 4.8 0", accent: true }
     ]
   },
+  "nakama-fist": {
+    description: "Nakama \u2014 raised fist with neon crew signal lines",
+    elements: [
+      {
+        kind: "path",
+        d: "M192 0c17.7 0 32 14.3 32 32v112h-64V32c0-17.7 14.3-32 32-32zM64 64c0-17.7-32-32 32-32s32 14.3 32 32v80H64V64zm192 0c0-17.7 14.3-32 32-32s32 14.3 32 32v96c0 17.7-14.3 32-32 32s-32-14.3-32-32V64zm96 64c0-17.7 14.3-32 32-32s32 14.3 32 32v64c0 17.7-14.3 32-32 32s-32-14.3-32-32v-64zm-96 88v-.6c9.4 5.4 20.3 8.6 32 8.6 13.2 0 25.4-4 35.6-10.8 8.7 24.9 32.5 42.8 60.4 42.8 11.7 0 22.6-3.1 32-8.6v8.6c0 52.3-25.1 98.8-64 128v96c0 17.7-14.3 32-32 32H160c-17.7 0-32-14.3-32-32v-78.4c-17.3-7.9-33.2-18.8-46.9-32.5L69.5 357.5C45.5 333.5 32 300.9 32 267v-27c0-35.3 28.7-64 64-64h88c22.1 0 40 17.9 40 40s-17.9 40-40 40h-56c-8.8 0-16 7.2-16 16s7.2 16 16 16h56c39.8 0 72-32.2 72-72z",
+        filled: true,
+        transform: "translate(2.5 1.75) scale(.0425 .0375)"
+      },
+      { kind: "path", d: "M7 18h3.5M12.2 18h3M8.5 19.5h6", accent: true },
+      {
+        kind: "path",
+        d: "M4.8 5.8h2.7M4.8 7.4h1.4M18.5 17.1h1.7",
+        accent: true
+      },
+      { kind: "circle", cx: 18.5, cy: 4.5, r: 0.8, accent: true, filled: true }
+    ]
+  },
   workspace: {
     description: "Workspace container \u2014 panel with header bar and content",
     elements: [
@@ -239,7 +265,15 @@ var SUITE_GLYPHS = {
   organisation: {
     description: "Organisation chart \u2014 root node with two members",
     elements: [
-      { kind: "rect", x: 9.5, y: 3.5, width: 5, height: 5, rx: 1.4, accent: true },
+      {
+        kind: "rect",
+        x: 9.5,
+        y: 3.5,
+        width: 5,
+        height: 5,
+        rx: 1.4,
+        accent: true
+      },
       { kind: "path", d: "M12 8.5v2.5" },
       { kind: "path", d: "M6.75 13.5v-2.5h10.5v2.5" },
       { kind: "rect", x: 4.25, y: 13.5, width: 5, height: 5, rx: 1.4 },
@@ -283,7 +317,10 @@ var SUITE_GLYPHS = {
   "bell-wave": {
     description: "Notifications \u2014 bell with sound waves",
     elements: [
-      { kind: "path", d: "M7 9.2a5 5 0 0 1 10 0c0 5.3 2.4 7.3 2.4 7.3H4.6S7 14.5 7 9.2" },
+      {
+        kind: "path",
+        d: "M7 9.2a5 5 0 0 1 10 0c0 5.3 2.4 7.3 2.4 7.3H4.6S7 14.5 7 9.2"
+      },
       { kind: "path", d: "M10.7 19.3a1.5 1.5 0 0 0 2.6 0" },
       { kind: "path", d: "M17.9 6.4a5.5 5.5 0 0 1 1.4 3.7", accent: true },
       { kind: "path", d: "M15.7 4a9.4 9.4 0 0 1 2.4 6", accent: true }
@@ -1806,23 +1843,24 @@ function SuiteUserMenu({
   settingsHref,
   onSignOut,
   fallbackInitials,
+  showSignOutAction = false,
   dataTest = "suite-user-menu",
   className
 }) {
   const router = useRouter2();
   const initials = fallbackInitials != null ? fallbackInitials : computeInitials(name, email);
-  const avatar = /* @__PURE__ */ jsx14("span", { className: "inline-flex h-11 w-11 items-center justify-center rounded-full transition-colors hover:bg-ph-muted", children: image ? /* @__PURE__ */ jsx14(
+  const avatar = /* @__PURE__ */ jsx14("span", { className: "inline-flex h-11 w-11 items-center justify-center rounded-full ring-2 ring-ph-border ring-offset-1 ring-offset-ph-canvas transition-colors hover:bg-ph-muted", children: image ? /* @__PURE__ */ jsx14(
     Image2,
     {
       src: image,
       alt: "",
-      width: 32,
-      height: 32,
-      className: "h-8 w-8 rounded-full object-cover",
+      width: 40,
+      height: 40,
+      className: "h-10 w-10 rounded-full object-cover",
       unoptimized: true
     }
-  ) : /* @__PURE__ */ jsx14("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-ph-muted text-sm font-semibold text-ph-brand", children: initials }) });
-  return /* @__PURE__ */ jsxs12(
+  ) : /* @__PURE__ */ jsx14("span", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-ph-muted text-sm font-semibold text-ph-brand", children: initials }) });
+  const accountMenu = /* @__PURE__ */ jsxs12(
     DropdownMenu,
     {
       trigger: avatar,
@@ -1832,7 +1870,7 @@ function SuiteUserMenu({
       sideOffset: 6,
       collisionPadding: 16,
       modal: false,
-      className,
+      className: showSignOutAction ? void 0 : className,
       "data-test": dataTest,
       children: [
         /* @__PURE__ */ jsxs12("div", { className: "px-2 py-1.5", children: [
@@ -1851,20 +1889,31 @@ function SuiteUserMenu({
             ]
           }
         ),
-        /* @__PURE__ */ jsxs12(
-          DropdownItem,
-          {
-            "data-test": `${dataTest}-sign-out`,
-            onClick: onSignOut,
-            children: [
-              /* @__PURE__ */ jsx14(LogOut, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
-              "Sign out"
-            ]
-          }
-        )
+        /* @__PURE__ */ jsxs12(DropdownItem, { "data-test": `${dataTest}-sign-out`, onClick: onSignOut, children: [
+          /* @__PURE__ */ jsx14(LogOut, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
+          "Sign out"
+        ] })
       ]
     }
   );
+  if (!showSignOutAction) {
+    return accountMenu;
+  }
+  return /* @__PURE__ */ jsxs12("div", { className: cn("flex min-w-0 items-center gap-2", className), children: [
+    accountMenu,
+    /* @__PURE__ */ jsx14(
+      "button",
+      {
+        type: "button",
+        "data-test": `${dataTest}-visible-sign-out`,
+        title: "Sign out",
+        "aria-label": "Sign out",
+        className: "inline-flex h-11 w-11 shrink-0 items-center justify-center rounded-lg text-ph-mutedtext transition-colors hover:bg-ph-muted hover:text-ph-ink focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ph-focus-ring",
+        onClick: onSignOut,
+        children: /* @__PURE__ */ jsx14(LogOut, { className: "h-4 w-4", "aria-hidden": true })
+      }
+    )
+  ] });
 }
 
 // src/suite/components/suite-bottom-nav.tsx
@@ -2544,8 +2593,9 @@ function snapWidth(width) {
   if (width < SIDEBAR_MIN_EXPANDED_WIDTH) return SIDEBAR_MIN_EXPANDED_WIDTH;
   return Math.min(SIDEBAR_MAX_WIDTH, width);
 }
-function useSidebarWidth(storageKey) {
-  const [width, setWidth] = useState8(SIDEBAR_DEFAULT_WIDTH);
+function useSidebarWidth(storageKey, defaultWidth = SIDEBAR_DEFAULT_WIDTH) {
+  const fallbackWidth = snapWidth(clampWidth(defaultWidth));
+  const [width, setWidth] = useState8(fallbackWidth);
   const [narrowViewport, setNarrowViewport] = useState8(false);
   const collapsed = narrowViewport || width <= SIDEBAR_COLLAPSE_THRESHOLD;
   useEffect7(() => {
@@ -2579,17 +2629,17 @@ function useSidebarWidth(storageKey) {
   const setCollapsed = useCallback3(
     (value) => {
       setWidth((current) => {
-        const next = value ? SIDEBAR_RAIL_WIDTH : current <= SIDEBAR_COLLAPSE_THRESHOLD ? SIDEBAR_DEFAULT_WIDTH : snapWidth(current);
+        const next = value ? SIDEBAR_RAIL_WIDTH : current <= SIDEBAR_COLLAPSE_THRESHOLD ? fallbackWidth : snapWidth(current);
         persist(next);
         return next;
       });
     },
-    [persist]
+    [fallbackWidth, persist]
   );
   const resetWidth = useCallback3(() => {
-    setWidth(SIDEBAR_DEFAULT_WIDTH);
-    persist(SIDEBAR_DEFAULT_WIDTH);
-  }, [persist]);
+    setWidth(fallbackWidth);
+    persist(fallbackWidth);
+  }, [fallbackWidth, persist]);
   const startResize = useCallback3(
     (event) => {
       event.preventDefault();
@@ -2612,7 +2662,17 @@ function useSidebarWidth(storageKey) {
     },
     [persist, width]
   );
-  return { width, collapsed, setCollapsed, resetWidth, startResize };
+  const resizeBy = useCallback3(
+    (delta) => {
+      setWidth((current) => {
+        const next = clampWidth(current + delta);
+        persist(next);
+        return next;
+      });
+    },
+    [persist]
+  );
+  return { width, collapsed, setCollapsed, resetWidth, startResize, resizeBy };
 }
 
 // src/suite/lib/motion.tsx
@@ -2881,67 +2941,60 @@ function SuiteSidebar({
               collapsed ? "px-1.5 py-2" : "p-2"
             ),
             children: [
-              /* @__PURE__ */ jsxs18(
-                "nav",
-                {
-                  "aria-label": "Pages",
-                  className: "shrink-0 space-y-0.5",
-                  children: [
-                    /* @__PURE__ */ jsx21("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
-                    /* @__PURE__ */ jsx21("div", { className: "space-y-0.5", children: navItems.map((item) => {
-                      const Icon = item.icon;
-                      const active = Boolean(item.active);
-                      const link = /* @__PURE__ */ jsxs18(
-                        Link2,
-                        {
-                          href: item.href,
-                          "data-test": "nav-link",
-                          "aria-current": active ? "page" : void 0,
-                          onClick: item.onClick,
-                          className: cn(
-                            "group relative flex items-center gap-2.5 rounded-[var(--ph-radius-app)] text-sm font-medium transition-colors",
-                            active ? "bg-ph-muted" : "text-ph-subtle hover:bg-ph-muted hover:text-ph-ink",
-                            collapsed ? "mx-auto size-10 shrink-0 justify-center gap-0 px-0 py-0" : "w-full px-2.5 py-2"
-                          ),
-                          children: [
-                            /* @__PURE__ */ jsx21(
-                              "span",
-                              {
-                                className: cn(
-                                  "relative flex h-4 w-4 shrink-0 items-center justify-center",
-                                  item.iconClassName
-                                ),
-                                "aria-hidden": true,
-                                children: /* @__PURE__ */ jsx21(
-                                  Icon,
-                                  {
-                                    className: "h-full w-full",
-                                    strokeWidth: active ? 2 : 1.75
-                                  }
-                                )
-                              }
+              /* @__PURE__ */ jsxs18("nav", { "aria-label": "Pages", className: "shrink-0 space-y-0.5", children: [
+                /* @__PURE__ */ jsx21("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
+                /* @__PURE__ */ jsx21("div", { className: "space-y-0.5", children: navItems.map((item) => {
+                  const Icon = item.icon;
+                  const active = Boolean(item.active);
+                  const link = /* @__PURE__ */ jsxs18(
+                    Link2,
+                    {
+                      href: item.href,
+                      "data-test": "nav-link",
+                      "aria-current": active ? "page" : void 0,
+                      onClick: item.onClick,
+                      className: cn(
+                        "group relative flex items-center gap-2.5 rounded-[var(--ph-radius-app)] text-sm font-medium transition-colors",
+                        active ? "bg-ph-muted" : "text-ph-subtle hover:bg-ph-muted hover:text-ph-ink",
+                        collapsed ? "mx-auto size-10 shrink-0 justify-center gap-0 px-0 py-0" : "w-full px-2.5 py-2"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx21(
+                          "span",
+                          {
+                            className: cn(
+                              "relative flex h-4 w-4 shrink-0 items-center justify-center",
+                              item.iconClassName
                             ),
-                            /* @__PURE__ */ jsx21(
-                              "span",
+                            "aria-hidden": true,
+                            children: /* @__PURE__ */ jsx21(
+                              Icon,
                               {
-                                className: cn(
-                                  "relative truncate",
-                                  active ? "text-ph-ink" : "text-ph-subtle group-hover:text-ph-ink",
-                                  collapsed && "sr-only"
-                                ),
-                                children: item.label
+                                className: "h-full w-full",
+                                strokeWidth: active ? 2 : 1.75
                               }
+                            )
+                          }
+                        ),
+                        /* @__PURE__ */ jsx21(
+                          "span",
+                          {
+                            className: cn(
+                              "relative truncate",
+                              active ? "text-ph-ink" : "text-ph-subtle group-hover:text-ph-ink",
+                              collapsed && "sr-only"
                             ),
-                            !collapsed && item.badge ? /* @__PURE__ */ jsx21("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
-                          ]
-                        },
-                        item.label
-                      );
-                      return collapsed ? /* @__PURE__ */ jsx21(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
-                    }) })
-                  ]
-                }
-              ),
+                            children: item.label
+                          }
+                        ),
+                        !collapsed && item.badge ? /* @__PURE__ */ jsx21("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
+                      ]
+                    },
+                    item.label
+                  );
+                  return collapsed ? /* @__PURE__ */ jsx21(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
+                }) })
+              ] }),
               secondaryNav ? /* @__PURE__ */ jsx21(
                 "div",
                 {
@@ -2966,11 +3019,11 @@ function SuiteSidebar({
               {
                 className: cn(
                   "flex items-center gap-2",
-                  collapsed && "justify-center"
+                  collapsed ? "flex-col justify-center" : "min-w-0"
                 ),
                 children: [
                   renderNode(userMenu, collapsed),
-                  !collapsed && footerExtras ? /* @__PURE__ */ jsx21("div", { className: "ml-auto shrink-0", children: renderNode(footerExtras, collapsed) }) : null
+                  footerExtras ? /* @__PURE__ */ jsx21("div", { className: cn("shrink-0", collapsed ? "mt-2" : "ml-auto"), children: renderNode(footerExtras, collapsed) }) : null
                 ]
               }
             )
@@ -2992,6 +3045,7 @@ function SuiteAppLayout({
   collapsed = false,
   lockMainScroll = false,
   onStartResize,
+  onResizeBy,
   onResetWidth,
   className
 }) {
@@ -2999,12 +3053,15 @@ function SuiteAppLayout({
     "div",
     {
       "data-test": "app-shell",
-      className: cn("flex min-h-dvh lg:h-screen lg:overflow-hidden", className),
+      className: cn(
+        "suite-app-layout flex min-h-dvh lg:h-screen lg:overflow-hidden",
+        className
+      ),
       children: [
         /* @__PURE__ */ jsxs19(
           "aside",
           {
-            className: "relative hidden shrink-0 flex-col overflow-hidden border-r border-ph-border transition-[width] duration-200 ease-out lg:flex",
+            className: "relative hidden shrink-0 flex-col overflow-visible border-r border-ph-border ease-out lg:flex",
             style: { width: `${sidebarWidth}px` },
             "data-collapsed": collapsed ? "true" : "false",
             children: [
@@ -3015,9 +3072,23 @@ function SuiteAppLayout({
                   role: "separator",
                   "aria-orientation": "vertical",
                   "aria-label": "Resize sidebar",
+                  "data-test": "sidebar-resize-handle",
+                  tabIndex: onResizeBy ? 0 : void 0,
                   onPointerDown: onStartResize,
                   onDoubleClick: onResetWidth,
-                  className: "absolute inset-y-0 right-0 z-10 w-1 cursor-col-resize transition-colors hover:bg-[color-mix(in_oklab,var(--ph-accent)_30%,transparent)]"
+                  onKeyDown: (event) => {
+                    if (event.key === "Home") {
+                      event.preventDefault();
+                      onResetWidth == null ? void 0 : onResetWidth();
+                    } else if (event.key === "ArrowLeft") {
+                      event.preventDefault();
+                      onResizeBy == null ? void 0 : onResizeBy(-16);
+                    } else if (event.key === "ArrowRight") {
+                      event.preventDefault();
+                      onResizeBy == null ? void 0 : onResizeBy(16);
+                    }
+                  },
+                  className: "absolute inset-y-0 -right-1 z-10 w-2 cursor-col-resize touch-none transition-colors hover:bg-[color-mix(in_oklab,var(--ph-accent)_30%,transparent)]"
                 }
               ) : null
             ]
@@ -3033,6 +3104,7 @@ function SuiteAppLayout({
               "data-lock-scroll": lockMainScroll ? "true" : void 0,
               className: cn(
                 "flex min-h-0 min-w-0 flex-1 flex-col overflow-x-hidden overscroll-contain bg-ph-canvas focus:outline-none",
+                "suite-app-layout__main",
                 lockMainScroll ? "overflow-hidden" : "overflow-y-auto"
               ),
               children

package/dist/ui.js

@@ -2388,177 +2388,65 @@ var THEMES = [
     colorScheme: "dark",
     group: "HedgeHog"
   },
-  {
-    id: "catppuccin-light",
-    name: "Catppuccin Light",
-    description: "Catppuccin Latte \u2014 soft pastels and mauve accent.",
-    colorScheme: "light",
-    group: "Catppuccin"
-  },
-  {
-    id: "catppuccin-dark",
-    name: "Catppuccin Dark",
-    description: "Catppuccin Mocha \u2014 deep base and lavender peach.",
-    colorScheme: "dark",
-    group: "Catppuccin"
-  },
-  {
-    id: "sheets",
-    name: "Sheets",
-    description: "Spreadsheet green on office neutrals.",
-    colorScheme: "light",
-    group: "Productivity"
-  },
-  {
-    id: "sheets-dark",
-    name: "Sheets Dark",
-    description: "Dark shell with spreadsheet green accent.",
-    colorScheme: "dark",
-    group: "Productivity"
-  },
   {
     id: "note",
-    name: "Note",
+    name: "Note Light",
     description: "Notebook purple on lavender-white chrome.",
     colorScheme: "light",
-    group: "Productivity"
+    group: "Note"
   },
   {
     id: "note-dark",
     name: "Note Dark",
     description: "Dark notebook purple \u2014 night reading mode.",
     colorScheme: "dark",
-    group: "Productivity"
-  },
-  {
-    id: "presentation",
-    name: "Presentation",
-    description: "Orange-red on office neutrals.",
-    colorScheme: "light",
-    group: "Productivity"
-  },
-  {
-    id: "presentation-dark",
-    name: "Presentation Dark",
-    description: "Dark shell with orange-red accent.",
-    colorScheme: "dark",
-    group: "Productivity"
-  },
-  {
-    id: "socials",
-    name: "Socials",
-    description: "Meta blue accent on familiar social greys.",
-    colorScheme: "light",
-    group: "Social"
-  },
-  {
-    id: "socials-dark",
-    name: "Socials Dark",
-    description: "Social dark mode \u2014 #18191A base and Meta blue.",
-    colorScheme: "dark",
-    group: "Social"
-  },
-  {
-    id: "chats-light",
-    name: "Chats Light",
-    description: "Aubergine brand on clean workspace neutrals.",
-    colorScheme: "light",
-    group: "Chats"
-  },
-  {
-    id: "chats-dark",
-    name: "Chats Dark",
-    description: "Dark sidebar \u2014 #1A1D21 base and green highlights.",
-    colorScheme: "dark",
-    group: "Chats"
-  },
-  {
-    id: "xenide-light",
-    name: "Xenide Light",
-    description: "xenide.io light \u2014 Excel green + purple on neutral greys.",
-    colorScheme: "light",
-    group: "Xenide"
-  },
-  {
-    id: "xenide-dark",
-    name: "Xenide Dark",
-    description: "xenide.io dark \u2014 #0A0A0F base, emerald green + violet.",
-    colorScheme: "dark",
-    group: "Xenide"
-  },
-  {
-    id: "bikini-bottom",
-    name: "Bikini Bottom",
-    description: "SpongeBob palette \u2014 ocean canvas, readable surfaces, character accents.",
-    colorScheme: "light",
-    group: "Fun"
-  },
-  {
-    id: "bikini-bottom-dark",
-    name: "Bikini Bottom Dark",
-    description: "Bikini Bottom at night \u2014 deep ocean with neon character accents.",
-    colorScheme: "dark",
-    group: "Fun"
+    group: "Note"
   },
   {
     id: "turtletime",
-    name: "TurtleTime",
+    name: "TurtleTime Light",
     description: "Turtle mascot palette \u2014 shell orange, leaf green, and warm cream.",
     colorScheme: "light",
-    group: "Fun"
+    group: "TurtleTime"
   },
   {
     id: "turtletime-dark",
     name: "TurtleTime Dark",
     description: "TurtleTime after dusk \u2014 dark olive shell with bright orange clock accents.",
     colorScheme: "dark",
-    group: "Fun"
-  },
-  {
-    id: "github-light",
-    name: "GitHub Light",
-    description: "GitHub Primer \u2014 #f6f8fa canvas and emphasis blue accents.",
-    colorScheme: "light",
-    group: "GitHub"
-  },
-  {
-    id: "github-dark",
-    name: "GitHub Dark",
-    description: "GitHub dark dimmed \u2014 #0d1117 base and #4493f8 links.",
-    colorScheme: "dark",
-    group: "GitHub"
+    group: "TurtleTime"
   },
   {
     id: "rosepine-light",
-    name: "Ros\xE9 Pine Dawn",
+    name: "Ros\xE9 Pine Light",
     description: "Ros\xE9 Pine Dawn \u2014 warm paper base with muted iris accents.",
     colorScheme: "light",
     group: "Ros\xE9 Pine"
   },
   {
     id: "rosepine-dark",
-    name: "Ros\xE9 Pine",
+    name: "Ros\xE9 Pine Dark",
     description: "Ros\xE9 Pine Main \u2014 moonlit base with iris and love accents.",
     colorScheme: "dark",
     group: "Ros\xE9 Pine"
   },
   {
-    id: "notion",
-    name: "Notion",
-    description: "Notion light \u2014 warm off-white canvas, Notion blue accent, signature dark text.",
+    id: "kraken-light",
+    name: "Kraken Light",
+    description: "Medium-inspired warm paper, editorial black actions, and publication yellow.",
     colorScheme: "light",
-    group: "Productivity"
+    group: "Kraken"
   },
   {
-    id: "notion-dark",
-    name: "Notion Dark",
-    description: "Notion dark mode \u2014 dark charcoal canvas with blue accent and clean typography.",
+    id: "kraken-dark",
+    name: "Kraken Dark",
+    description: "Medium-inspired night reading canvas with white actions and publication yellow.",
     colorScheme: "dark",
-    group: "Productivity"
+    group: "Kraken"
   },
   {
     id: "deepsea-light",
-    name: "Tokyo Night Day",
+    name: "Tokyo Day",
     description: "Tokyo Night Day \u2014 soft bluish greys with vivid blue and purple accents.",
     colorScheme: "light",
     group: "Tokyo Night"
@@ -2571,21 +2459,23 @@ var THEMES = [
     group: "Tokyo Night"
   },
   {
-    id: "kraken-light",
-    name: "Kraken Light",
-    description: "Medium-inspired warm paper, editorial black actions, and classic publication yellow.",
+    id: "malibu-light",
+    name: "Malibu Light",
+    description: "Sun-bleached GTA San Andreas palette with hot pink, sunset orange, and lime signals.",
     colorScheme: "light",
-    group: "Kraken"
+    group: "Malibu"
   },
   {
-    id: "kraken-dark",
-    name: "Kraken Dark",
-    description: "Medium-inspired night reading canvas with white actions and classic publication yellow.",
+    id: "malibu-dark",
+    name: "Malibu Dark",
+    description: "Deep plum command deck with hot pink, lime, cyan, and sunset signals.",
     colorScheme: "dark",
-    group: "Kraken"
+    group: "Malibu"
   }
 ];
-var THEME_GROUPS = Array.from(new Set(THEMES.map((theme) => theme.group)));
+var THEME_GROUPS = Array.from(
+  new Set(THEMES.map((theme) => theme.group))
+);
 function isThemeId(value) {
   return THEMES.some((theme) => theme.id === value);
 }
@@ -2593,7 +2483,7 @@ function isThemeId(value) {
 // src/themes/init-theme.ts
 var STORAGE_KEY = "ph-theme";
 var VALID_THEMES = THEMES.map((theme) => theme.id);
-var THEME_INIT_SCRIPT = `(function(){try{var k="${STORAGE_KEY}",d="${DEFAULT_THEME_ID}",v=${JSON.stringify(VALID_THEMES)},t=localStorage.getItem(k);if(t==="xenide")t="xenide-light";if(!t||v.indexOf(t)<0)t=d;document.documentElement.setAttribute("data-theme",t)}catch(e){document.documentElement.setAttribute("data-theme","${DEFAULT_THEME_ID}")}})();`;
+var THEME_INIT_SCRIPT = `(function(){try{var k="${STORAGE_KEY}",d="${DEFAULT_THEME_ID}",v=${JSON.stringify(VALID_THEMES)},t=localStorage.getItem(k);if(!t||v.indexOf(t)<0)t=d;document.documentElement.setAttribute("data-theme",t)}catch(e){document.documentElement.setAttribute("data-theme","${DEFAULT_THEME_ID}")}})();`;
 function persistTheme(themeId) {
   if (typeof window === "undefined") {
     return;
@@ -2609,9 +2499,6 @@ function readStoredTheme() {
     return DEFAULT_THEME_ID;
   }
   const stored = localStorage.getItem(STORAGE_KEY);
-  if (stored === "xenide") {
-    return "xenide-light";
-  }
   return stored && isThemeId(stored) ? stored : DEFAULT_THEME_ID;
 }
 
@@ -2637,7 +2524,7 @@ function ThemeManager({ children }) {
 var import_react15 = require("react");
 var import_jsx_runtime27 = require("react/jsx-runtime");
 function ThemeSwitcher({ className }) {
-  const [themeId, setThemeId] = (0, import_react15.useState)("hedgehog-light");
+  const [themeId, setThemeId] = (0, import_react15.useState)(DEFAULT_THEME_ID);
   (0, import_react15.useEffect)(() => {
     const id = readStoredTheme();
     persistTheme(id);