@xenide-io/the-old-ui-theme 0.6.5 → 0.6.7

package/dist/{ai-message-blocknote-4Q4U2T2W.mjs → ai-message-blocknote-DIUICX3G.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   useSuiteTheme
-} from "./chunk-IAH7Z46I.mjs";
+} from "./chunk-VIWW7AW2.mjs";
 import "./chunk-FWCSY2DS.mjs";
 
 // src/suite/components/ai-message-blocknote.tsx

package/dist/{chunk-IAH7Z46I.mjs → chunk-VIWW7AW2.mjs}

@@ -60,6 +60,9 @@ function SuiteThemeProvider({
     return { theme: theme2, resolvedTheme: resolvedTheme2 };
   });
   const { theme, resolvedTheme } = state;
+  useEffect(() => {
+    applyTheme(theme, config);
+  }, [theme, config]);
   useEffect(() => {
     if (theme !== "system") return;
     const media = window.matchMedia("(prefers-color-scheme: dark)");

package/dist/suite.js

@@ -106,6 +106,9 @@ function SuiteThemeProvider({
     return { theme: theme2, resolvedTheme: resolvedTheme2 };
   });
   const { theme, resolvedTheme } = state;
+  (0, import_react7.useEffect)(() => {
+    applyTheme(theme, config);
+  }, [theme, config]);
   (0, import_react7.useEffect)(() => {
     if (theme !== "system") return;
     const media = window.matchMedia("(prefers-color-scheme: dark)");
@@ -1381,7 +1384,7 @@ var SUITE_APPS2 = [
     name: "Kraken",
     description: "Documents and knowledge",
     icon: "/kraken-icon.svg",
-    landing: "/today",
+    landing: "/ask",
     baseUrlEnv: "NEXT_PUBLIC_KRAKEN_URL",
     baseUrlFallback: "http://localhost:3003"
   },

package/dist/suite.mjs

@@ -6,7 +6,7 @@ import {
 import {
   SuiteThemeProvider,
   useSuiteTheme
-} from "./chunk-IAH7Z46I.mjs";
+} from "./chunk-VIWW7AW2.mjs";
 import {
   __spreadProps,
   __spreadValues
@@ -1094,7 +1094,7 @@ var SUITE_APPS2 = [
     name: "Kraken",
     description: "Documents and knowledge",
     icon: "/kraken-icon.svg",
-    landing: "/today",
+    landing: "/ask",
     baseUrlEnv: "NEXT_PUBLIC_KRAKEN_URL",
     baseUrlFallback: "http://localhost:3003"
   },
@@ -2152,7 +2152,7 @@ import {
   Xmark as X2
 } from "iconoir-react";
 import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
-var SuiteAiBlockNoteMessage = lazy(() => import("./ai-message-blocknote-4Q4U2T2W.mjs"));
+var SuiteAiBlockNoteMessage = lazy(() => import("./ai-message-blocknote-DIUICX3G.mjs"));
 var SUITE_OPEN_ASK_AI_EVENT = "shellstack:open-ask-ai";
 function openSuiteAskAi(detail) {
   if (typeof window === "undefined") return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xenide-io/the-old-ui-theme",
-  "version": "0.6.5",
+  "version": "0.6.7",
   "description": "Props-driven React components and theme tokens inspired by classic interface design \u2014 optimized for Next.js apps and internal tools.",
   "author": "Xenide",
   "license": "MIT",

package/src/app/globals.css

@@ -1388,7 +1388,9 @@ body {
   .ph-modal-panel {
     @apply fixed left-1/2 top-1/2 z-[101] flex w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 flex-col p-6 text-ph-ink;
     max-height: min(42rem, calc(100dvh - 2rem));
-    overflow: hidden;
+    /* Visible so input focus rings and 3D button chrome are not clipped by
+       overflow:hidden + border-radius, especially at the bottom-right action. */
+    overflow: visible;
     overscroll-behavior: contain;
     background: var(--ph-surface-overlay);
     border-radius: var(--ph-radius-overlay);
@@ -1404,11 +1406,16 @@ body {
   .ph-modal-body {
     @apply mt-4 min-h-0 overflow-y-auto;
     overscroll-behavior: contain;
+    /* Focus ring is a 3px outer glow; pad so overflow-y:auto does not clip it. */
+    padding: 0.375rem;
+    margin-inline: -0.375rem;
   }
 
   .ph-modal-footer {
     @apply mt-6 flex shrink-0 flex-wrap justify-end gap-2 border-t pt-5;
     border-color: var(--ph-border-subtle);
+    overflow: visible;
+    padding-bottom: calc(var(--ph-chrome-depth) + 0.125rem);
   }
 
   @keyframes ph-modal-overlay-in {

package/src/styles/themes.css

@@ -424,7 +424,7 @@
 
 [data-theme="kraken-light"] {
   color-scheme: light;
-  --ph-canvas: #f7f4ed;
+  --ph-canvas: #fafafa;
   --ph-surface: #ffffff;
   --ph-muted: #f2f2f2;
   --ph-toolbar: #e8e8e6;

package/src/suite/components/theme-provider.test.tsx

@@ -0,0 +1,48 @@
+import { cleanup, render, waitFor } from "@testing-library/react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import { SuiteThemeProvider, type SuiteThemeConfig } from "./theme-provider";
+
+const config: SuiteThemeConfig = {
+  storageKey: "test-theme",
+  lightThemeId: "test-light",
+  darkThemeId: "test-dark",
+  fallbackTheme: "light",
+  themeColorLight: "#fafafa",
+  themeColorDark: "#191919",
+};
+
+beforeEach(() => {
+  vi.stubGlobal("localStorage", {
+    getItem: () => "dark",
+    setItem: vi.fn(),
+  });
+});
+
+afterEach(() => {
+  cleanup();
+  vi.unstubAllGlobals();
+  document.documentElement.removeAttribute("data-theme");
+  document.documentElement.classList.remove("dark");
+  document.getElementById("theme-color-meta")?.remove();
+});
+
+describe("SuiteThemeProvider", () => {
+  it("syncs the initial theme colour after mounting", async () => {
+    document.documentElement.setAttribute("data-theme", config.darkThemeId);
+    const meta = document.createElement("meta");
+    meta.id = "theme-color-meta";
+    meta.content = config.themeColorLight!;
+    document.head.append(meta);
+
+    render(
+      <SuiteThemeProvider config={config}>
+        <div />
+      </SuiteThemeProvider>,
+    );
+
+    await waitFor(() =>
+      expect(meta).toHaveAttribute("content", config.themeColorDark),
+    );
+  });
+});

package/src/suite/components/theme-provider.tsx

@@ -123,6 +123,10 @@ export function SuiteThemeProvider({
   });
   const { theme, resolvedTheme } = state;
 
+  useEffect(() => {
+    applyTheme(theme, config);
+  }, [theme, config]);
+
   useEffect(() => {
     if (theme !== 'system') return;
     const media = window.matchMedia('(prefers-color-scheme: dark)');

package/src/suite/lib/apps.ts

@@ -59,7 +59,7 @@ export const SUITE_APPS: readonly SuiteAppDefinition[] = [
     name: 'Kraken',
     description: 'Documents and knowledge',
     icon: '/kraken-icon.svg',
-    landing: '/today',
+    landing: '/ask',
     baseUrlEnv: 'NEXT_PUBLIC_KRAKEN_URL',
     baseUrlFallback: 'http://localhost:3003',
   },