@xenide-io/the-old-ui-theme 0.6.6 → 0.6.8

package/dist/ui.js

@@ -2169,14 +2169,14 @@ var THEMES = [
   {
     id: "note",
     name: "Note Light",
-    description: "Notebook purple on lavender-white chrome.",
+    description: "OneNote purple on lavender-white chrome.",
     colorScheme: "light",
     group: "Note"
   },
   {
     id: "note-dark",
     name: "Note Dark",
-    description: "Dark notebook purple \u2014 night reading mode.",
+    description: "Office-dark chrome with OneNote purple accents.",
     colorScheme: "dark",
     group: "Note"
   },

package/dist/ui.mjs

@@ -65,7 +65,7 @@ import {
   ThemeDomSync,
   ThemeSwitcher,
   Toggle
-} from "./chunk-3G43JEI3.mjs";
+} from "./chunk-VOCHIR3W.mjs";
 import {
   ButtonChrome,
   DropdownButton,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xenide-io/the-old-ui-theme",
-  "version": "0.6.6",
+  "version": "0.6.8",
   "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/suite-skin.css

@@ -659,6 +659,7 @@ button:hover > .ph-card {
   color: var(--ph-text-primary);
   font-family: inherit;
   font-size: 0.875rem;
+  overflow-wrap: anywhere;
 }
 .suite-ai-blocknote .bn-block-content {
   padding-block: 2px;
@@ -672,6 +673,11 @@ button:hover > .ph-card {
   border-radius: 6px;
   background: var(--ph-surface);
 }
+.suite-ai-blocknote a {
+  color: var(--ph-brand);
+  text-decoration: underline;
+  text-underline-offset: 2px;
+}
 
 /* ── Auth / OAuth / launch handoff ──────────────────────────────────────
    One calm opacity fade — no stacked entrance reveals on bridge pages. */

package/src/styles/themes.css

@@ -133,6 +133,7 @@
   --ph-accent-highlight-secondary: hsl(19deg 100% 52% / 14%);
 }
 
+/* OneNote — brand purple #7719aa on lavender paper. */
 [data-theme="note"] {
   color-scheme: light;
   --ph-canvas: #f8f6fc;
@@ -175,55 +176,56 @@
 
 [data-theme="note-dark"] {
   color-scheme: dark;
-  --ph-canvas: #1a1224;
-  --ph-surface: #221830;
-  --ph-muted: #2a1f3d;
-  --ph-toolbar: #322648;
-  --ph-surface-inset: #21162f;
-  --ph-surface-raised: #2a1f3d;
-  --ph-surface-overlay: #34284a;
-  --ph-border: #4a3860;
-  --ph-border-strong: #9b7bb8;
-  --ph-text-primary: #f0e8f8;
-  --ph-text-secondary: #c4b5d8;
-  --ph-text-tertiary: #9b7bb8;
-  --ph-accent: #b146c2;
-  --ph-accent-hover: #c96bd4;
+  /* Office Fluent dark neutrals — OneNote purple stays on accents only. */
+  --ph-canvas: #1b1a19;
+  --ph-surface: #252423;
+  --ph-muted: #2d2c2b;
+  --ph-toolbar: #323130;
+  --ph-surface-inset: #201f1e;
+  --ph-surface-raised: #2d2c2b;
+  --ph-surface-overlay: #3b3a39;
+  --ph-border: #484644;
+  --ph-border-strong: #8a8886;
+  --ph-text-primary: #f3f2f1;
+  --ph-text-secondary: #c8c6c4;
+  --ph-text-tertiary: #a19f9d;
+  --ph-accent: #c9a0e4;
+  --ph-accent-hover: #d8b8ed;
   --ph-blue: #4f9ff5;
   --ph-violet: #b146c2;
-  --ph-purple: #93278f;
+  --ph-purple: #c77dd4;
   --ph-success: #33a867;
   --ph-warning: #e67e22;
   --ph-danger: #f87171;
   --ph-info: #4f9ff5;
-  --ph-on-accent: #ffffff;
+  --ph-on-accent: #1b1a19;
   --ph-on-violet: #ffffff;
   --ph-on-success: #ffffff;
   --ph-on-warning: #211606;
   --ph-on-danger: #ffffff;
   --ph-on-info: #ffffff;
-  --ph-focus-ring: #c96bd4;
-  --ph-selected-bg: #3a254c;
-  --ph-selected-text: #f0c9f5;
-  --ph-selected-border: #8d4c9c;
-  --ph-text-3000: #f0e8f8;
-  --ph-primary-button-face: #221830;
-  --ph-primary-button-border: #7719aa;
-  --ph-primary-button-border-hover: #b146c2;
+  --ph-focus-ring: #d8b8ed;
+  --ph-selected-bg: #3a2f42;
+  --ph-selected-text: #ead8f5;
+  --ph-selected-border: #9b4ec4;
+  --ph-text-3000: #f3f2f1;
+  --ph-primary-button-face: #252423;
+  --ph-primary-button-border: #8764b8;
+  --ph-primary-button-border-hover: #c9a0e4;
   --ph-primary-frame-bg: #b146c2;
-  --ph-secondary-button-bg: #2a1f3d;
-  --ph-secondary-frame-bg: #4a3860;
-  --ph-secondary-button-border: #4a3860;
-  --ph-secondary-button-border-hover: #93278f;
-  --ph-border-3000: #322648;
-  --ph-accent-highlight-secondary: hsl(291deg 48% 54% / 14%);
-  --ph-data-1: #b146c2;
-  --ph-data-2: #93278f;
+  --ph-secondary-button-bg: #323130;
+  --ph-secondary-frame-bg: #3b3a39;
+  --ph-secondary-button-border: #484644;
+  --ph-secondary-button-border-hover: #8764b8;
+  --ph-border-3000: #323130;
+  --ph-accent-highlight-secondary: hsl(280deg 36% 62% / 12%);
+  --ph-data-1: #c9a0e4;
+  --ph-data-2: #c77dd4;
   --ph-data-3: #4f9ff5;
   --ph-data-4: #f87171;
   --ph-data-5: #e67e22;
   --ph-data-6: #33a867;
-  --ph-data-7: #7719aa;
+  --ph-data-7: #b146c2;
 }
 
 [data-theme="turtletime"] {
@@ -424,7 +426,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/ai-panel.test.ts

@@ -1,46 +1,20 @@
-import { describe, expect, it } from 'vitest';
+import { describe, expect, it, vi } from "vitest";
 
 import {
-  resolveSuiteAiLauncherPosition,
-  resolveSuiteAiNearestEdge,
-  resolveSuiteAiPanelSide,
-} from './ai-panel';
+  consumePendingAskAiPrompt,
+  openSuiteAskAi,
+  SUITE_OPEN_ASK_AI_EVENT,
+} from "./ai-panel";
 
-describe('resolveSuiteAiLauncherPosition', () => {
-  it('docks to every edge and keeps the launcher inside the viewport', () => {
-    expect(
-      resolveSuiteAiLauncherPosition('left', 900, -20, 1000, 800, 120, 40),
-    ).toEqual({ x: 12, y: 12 });
-    expect(
-      resolveSuiteAiLauncherPosition('right', 0, 900, 1000, 800, 120, 40),
-    ).toEqual({ x: 868, y: 748 });
-    expect(
-      resolveSuiteAiLauncherPosition('top', -20, 900, 1000, 800, 120, 40),
-    ).toEqual({ x: 12, y: 12 });
-    expect(
-      resolveSuiteAiLauncherPosition('bottom', 900, -20, 1000, 800, 120, 40),
-    ).toEqual({ x: 868, y: 748 });
-  });
-});
-
-describe('resolveSuiteAiNearestEdge', () => {
-  it('docks to the closest of all four edges', () => {
-    expect(resolveSuiteAiNearestEdge(10, 400, 120, 40, 1000, 800)).toBe('left');
-    expect(resolveSuiteAiNearestEdge(870, 400, 120, 40, 1000, 800)).toBe(
-      'right',
-    );
-    expect(resolveSuiteAiNearestEdge(440, 10, 120, 40, 1000, 800)).toBe('top');
-    expect(resolveSuiteAiNearestEdge(440, 740, 120, 40, 1000, 800)).toBe(
-      'bottom',
-    );
-  });
-});
+describe("openSuiteAskAi", () => {
+  it("queues a prompt for the panel that mounts after the event", () => {
+    const onOpen = vi.fn();
+    window.addEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
+    openSuiteAskAi({ prompt: "  Summarise this week  " });
+    window.removeEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
 
-describe('resolveSuiteAiPanelSide', () => {
-  it('opens from the docked horizontal edge or the launcher half', () => {
-    expect(resolveSuiteAiPanelSide('left', 500, 1000)).toBe('left');
-    expect(resolveSuiteAiPanelSide('right', 500, 1000)).toBe('right');
-    expect(resolveSuiteAiPanelSide('top', 100, 1000)).toBe('left');
-    expect(resolveSuiteAiPanelSide('bottom', 900, 1000)).toBe('right');
+    expect(onOpen).toHaveBeenCalledTimes(1);
+    expect(consumePendingAskAiPrompt()).toBe("Summarise this week");
+    expect(consumePendingAskAiPrompt()).toBeNull();
   });
 });