@jmruthers/pace-core 0.6.10 → 0.6.11

package/src/services/interfaces/{__tests__/IEventService.test.ts → IEventService.test.ts}

@@ -1,7 +1,7 @@
 /**
  * @file IEventService Interface Contract Tests
  * @package @jmruthers/pace-core
- * @module Services/Interfaces/__tests__
+ * @module Services/Interfaces
  * @since 0.1.0
  *
  * Contract tests verifying that EventService implements all IEventService methods
@@ -9,10 +9,10 @@
  */
 
 import { describe, it, expect, beforeEach, vi } from 'vitest';
-import { EventService } from '../../EventService';
-import type { IEventService } from '../IEventService';
+import { EventService } from '../EventService';
+import type { IEventService } from './IEventService';
 import type { SupabaseClient, User, Session } from '@supabase/supabase-js';
-import type { Organisation } from '../../../types/organisation';
+import type { Organisation } from '../../types/organisation';
 
 // Following testing standards: use timeout parameter to prevent hanging
 const TEST_TIMEOUT = 10000; // 10 seconds per test

package/src/services/interfaces/{__tests__/IInactivityService.test.ts → IInactivityService.test.ts}

@@ -1,7 +1,7 @@
 /**
  * @file IInactivityService Interface Contract Tests
  * @package @jmruthers/pace-core
- * @module Services/Interfaces/__tests__
+ * @module Services/Interfaces
  * @since 0.1.0
  *
  * Contract tests verifying that InactivityService implements all IInactivityService methods
@@ -9,8 +9,8 @@
  */
 
 import { describe, it, expect, beforeEach, vi } from 'vitest';
-import { InactivityService } from '../../InactivityService';
-import type { IInactivityService } from '../IInactivityService';
+import { InactivityService } from '../InactivityService';
+import type { IInactivityService } from './IInactivityService';
 import type { SupabaseClient, User, Session } from '@supabase/supabase-js';
 
 // Following testing standards: use timeout parameter to prevent hanging

package/src/services/interfaces/{__tests__/IOrganisationService.test.ts → IOrganisationService.test.ts}

@@ -1,7 +1,7 @@
 /**
  * @file IOrganisationService Interface Contract Tests
  * @package @jmruthers/pace-core
- * @module Services/Interfaces/__tests__
+ * @module Services/Interfaces
  * @since 0.1.0
  *
  * Contract tests verifying that OrganisationService implements all IOrganisationService methods
@@ -9,8 +9,8 @@
  */
 
 import { describe, it, expect, beforeEach, vi } from 'vitest';
-import { OrganisationService } from '../../OrganisationService';
-import type { IOrganisationService } from '../IOrganisationService';
+import { OrganisationService } from '../OrganisationService';
+import type { IOrganisationService } from './IOrganisationService';
 import type { SupabaseClient, User, Session } from '@supabase/supabase-js';
 
 // Following testing standards: use timeout parameter to prevent hanging

package/src/styles/core.css

@@ -7,13 +7,27 @@
   --font-serif: "Open Sans", sans-serif;
   --font-mono: "Reddit Mono", monospace;
   --font-heading: "Georama", sans-serif;
-  --shadow-badge-soft: 0 0 0 0.1rem var(--color-main-600),  0 0 0 5rem var(--color-main-600) inset,  0 0 0.25rem 0.25rem var(--color-main-600);
-  --shadow-badge-soft-xl: 0 0 0 0.1rem var(--color-main-600),  0 0 0 5rem var(--color-main-600) inset,  0 0 0.25rem 0.75rem var(--color-main-600);
+  --shadow-badge-soft: 0 0 0 0.1rem var(--color-main-600), 0 0 0 5rem var(--color-main-600) inset, 0 0 0.25rem 0.25rem var(--color-main-600);
+  --shadow-badge-soft-xl: 0 0 0 0.1rem var(--color-main-600), 0 0 0 5rem var(--color-main-600) inset, 0 0 0.25rem 0.75rem var(--color-main-600);
+  /* Main content area max width: min(app-width, 100%). Consuming apps may set --app-width in app.css. */
+  --size-app-content-max: min(var(--app-width, 100%), 100%);
+  /* Layout z-index: header above content */
+  --z-header: 40;
+  /* Header horizontal padding: centers content when viewport wider than --app-width. Used by PublicPageHeader. */
+  --layout-header-padding-x: max(0rem, calc((100vw - var(--app-width, 100%)) / 2 - 0.5rem));
 }
 
 @layer base {
 
-  /*base resets */
+  /* Print header/footer variables on :root only so runtime can override on html and descendants inherit */
+  :root {
+    --print-title: "Print Title";
+    --print-event-name: "Event Name";
+    --print-app-name: "PACE";
+    --print-date-time: "Print Date Time";
+  }
+
+  /* Base resets */
   * {
     font-family: 'Open Sans';
     border-color: var(--color-border);
@@ -180,6 +194,7 @@
     margin: 0.25lh 0;
     padding-left: 1.5rem;
   }
+
   ul {
     list-style-type: disc;
   }
@@ -208,17 +223,13 @@
     background-color: oklch(from var(--color-main-700) l c h / 0.5);
   }
 
-  progress::indeterminate {
-    
-    background: var(--color-acc-600);
-    /*
-    background: linear-gradient(to right, var(--color-acc-700) 10%, var(--color-sec-200) 30%, var(--color-main-500) 70%, var(--color-acc-200) 90%); */
-  }
-  
+
+
   .appGradient {
     background: linear-gradient(145deg, var(--color-main-100) 10%, var(--color-main-200) 30%, var(--color-main-200) 70%, var(--color-main-300) 90%);
     background-attachment: fixed;
   }
+
 }
 
 @theme inline {
@@ -245,13 +256,111 @@
 }
 
 @layer components {
+
   /* Custom component styles go here */
+  progress {
+    background: var(--color-sec-200);
+  }
+
+  progress:not(:indeterminate)::-webkit-progress-value,
+  progress:not(:indeterminate)::-moz-progress-bar {
+    background: var(--color-main-700);
+  }
+
+  progress.progress-error:not(:indeterminate)::-webkit-progress-value,
+  progress.progress-error:not(:indeterminate)::-moz-progress-bar {
+    background: var(--color-acc-500);
+  }
+
+  progress:indeterminate {
+    background: linear-gradient(to right, var(--color-sec-200) 10%, var(--color-main-500) 30%, var(--color-main-500) 70%, var(--color-sec-200) 90%);
+    accent-color: transparent;
+    /* Prevent browser default accent color */
+  }
+
+  progress:indeterminate::-webkit-progress-bar {
+    background: linear-gradient(to right, var(--color-sec-200) 10%, var(--color-main-500) 30%, var(--color-main-500) 70%, var(--color-sec-200) 90%);
+  }
+
+  /* Dialog body: HTML content paragraph (replaces prose prose-sm max-w-none) */
+  .dialog-body-html-content {
+    font-size: 0.875rem;
+    line-height: 1.6;
+    max-width: none;
+  }
+
+  /* Dialog body: fallback message when HTML content is not processed */
+  .dialog-body-fallback {
+    color: var(--color-acc-500);
+    margin-bottom: 0.5rem;
+  }
+
+  /* Dialog header: layout, alignment, spacing (avoids typography utilities in component) */
+  .dialog-header {
+    display: flex;
+    flex-direction: column;
+    gap: 0.375rem;
+    margin-bottom: 1rem;
+    text-align: center;
+  }
+  @media (min-width: 640px) {
+    .dialog-header {
+      text-align: left;
+    }
+  }
+
+  /* Dialog footer: layout and spacing (avoids typography utilities in component) */
+  .dialog-footer {
+    margin-top: 1rem;
+    display: flex;
+    flex-direction: column-reverse;
+    gap: 0.5rem;
+  }
+  @media (min-width: 640px) {
+    .dialog-footer {
+      flex-direction: row;
+      justify-content: flex-end;
+    }
+  }
+
+  /* Card size: typography in core.css (avoids typography utilities in component) */
+  .card--sm {
+    font-size: 0.875rem;
+  }
+  .card--lg {
+    font-size: 1.125rem;
+  }
+
 }
 
+
+
 @layer utilities {
   /* Custom utility styles go here */
-  
-  
+
+  /* Main content area max width: uses --size-app-content-max from @theme (min(app-width, 100%)) */
+  .max-w-app-content-max {
+    max-width: var(--size-app-content-max);
+  }
+
+  /* Header horizontal padding: uses --layout-header-padding-x from @theme (centers when viewport > app-width) */
+  .px-app-header-inset {
+    padding-left: var(--layout-header-padding-x);
+    padding-right: var(--layout-header-padding-x);
+  }
+
+  /* Header z-index: uses --z-header from @theme */
+  .z-header {
+    z-index: var(--z-header);
+  }
+
+  /* Print page orientation utilities */
+  @media print {
+    .print-page-landscape {
+      page: landscape;
+    }
+  }
+
   /* Hide spinner arrows on all number inputs (modern UX convention) */
   input[type="number"]::-webkit-inner-spin-button,
   input[type="number"]::-webkit-outer-spin-button {
@@ -261,5 +370,127 @@
 
   input[type="number"] {
     -moz-appearance: textfield;
+    appearance: textfield;
+  }
+}
+
+@media print {
+  @page {
+    size: A4 portrait;
+    margin: 20mm 15mm 15mm;
+    border: 1px solid var(--color-sec-600);
+
+    @top-left {
+      content: var(--print-title);
+      font-family: 'Georama';
+      font-size: 18pt;
+      line-height: 20pt;
+      font-weight: 700;
+      color: var(--color-main-600);
+      vertical-align: bottom;
+      padding-bottom: 0pt;
+    }
+
+    @top-right {
+      content: var(--print-event-name);
+      font-family: 'Georama';
+      font-size: 14pt;
+      line-height: 16pt;
+      font-weight: 600;
+      color: var(--color-main-600);
+      vertical-align: bottom;
+      padding-bottom: 0pt;
+    }
+
+    @bottom-left {
+      content: "Powered by " var(--print-app-name);
+      font-size: 8pt;
+      display: table-cell;
+      vertical-align: top;
+    }
+
+    @bottom-center {
+      content: "Page " counter(page) " of " counter(pages);
+      font-size: 8pt;
+      display: table-cell;
+      vertical-align: top;
+    }
+
+    @bottom-right {
+      content: var(--print-date-time);
+      font-size: 8pt;
+      display: table-cell;
+      vertical-align: top;
+    }
+
+  }
+
+  @page landscape {
+    size: A4 landscape;
+    margin: 20mm 15mm 15mm;
+  }
+
+  h1 {
+    font-size: 25pt;
+  }
+
+  h2 {
+    font-size: 20pt;
+  }
+
+  h3 {
+    font-size: 18pt;
+  }
+
+  h4 {
+    font-size: 15pt;
+    letter-spacing: -0.5pt;
+  }
+
+  h5 {
+    font-size: 13pt;
+    letter-spacing: -0.25pt;
+  }
+
+  h6 {
+    font-size: 10pt;
   }
+
+  p {
+    font-size: 10pt;
+  }
+
+  pre,
+  code {
+    font-size: 9pt;
+    padding: 2pt 4pt;
+    border-radius: 2.5pt;
+  }
+
+  blockquote {
+    padding: 2pt 4pt;
+    margin: 1.15pt 0;
+  }
+
+  small {
+    font-size: 9pt;
+  }
+
+  .appGradient {
+    background: none;
+  }
+
+  main>article:not(main [class*="grid"] > article),
+  main>section>article:not(main [class*="grid"] > article) {
+    border: none;
+
+    >header,
+    >main,
+    >footer {
+      padding-left: 0;
+      padding-right: 0;
+    }
+  }
+
+
 }

package/src/theming/{__tests__/parseEventColours.test.ts → parseEventColours.test.ts}

@@ -8,7 +8,7 @@
  */
 
 import { describe, it, expect } from 'vitest';
-import { parseAndNormalizeEventColours } from '../parseEventColours';
+import { parseAndNormalizeEventColours } from './parseEventColours';
 
 describe('parseAndNormalizeEventColours', () => {
   describe('Input validation', () => {

package/src/theming/{__tests__/runtime.test.ts → runtime.test.ts}

@@ -1,7 +1,7 @@
 /**
  * @file Theming Runtime Tests
  * @package @jmruthers/pace-core
- * @module Theming/__tests__
+ * @module Theming
  * @since 2.0.0
  */
 
@@ -15,21 +15,13 @@ import {
   type ColorShade,
   type ColorPalette,
   type PaletteData
-} from '../runtime';
+} from './runtime';
 
-// Mock the Logger module
-vi.mock('../../utils/core/logger', () => {
-  const mockLoggerInstance = {
-    warn: vi.fn(),
-  };
-  return {
-    createLogger: vi.fn(() => mockLoggerInstance),
-  };
-});
-
-// Get the mock instance after mock is set up
-import { createLogger } from '../../utils/core/logger';
-const getMockLogger = () => createLogger('test');
+// Mock the Logger module - use hoisted fn so warn is a proper spy
+const mockWarn = vi.hoisted(() => vi.fn());
+vi.mock('../utils/core/logger', () => ({
+  createLogger: vi.fn(() => ({ warn: mockWarn })),
+}));
 
 // Create proper mock for style object that mimics CSSStyleDeclaration
 const createMockStyle = () => {
@@ -164,8 +156,7 @@ describe('[theming] applyPalette', () => {
     };
 
     expect(() => applyPalette(palette)).not.toThrow();
-    const logger = getMockLogger();
-    expect(vi.mocked(logger.warn)).toHaveBeenCalledWith('Document not available (SSR) - palette not applied');
+    expect(mockWarn).toHaveBeenCalledWith('Document not available (SSR) - palette not applied');
 
     // Restore document
     Object.defineProperty(global, 'document', {

package/src/theming/runtime.ts

@@ -61,13 +61,76 @@ function formatOklchCss(color: ColorShade): string {
   return `oklch(${color.L} ${color.C} ${color.H})`;
 }
 
+/**
+ * Formats a string as a CSS double-quoted string for use in content/margin-box.
+ * Minimal escaping: only backslash and double quote so the string is valid.
+ * Apostrophes (e.g. "Baloo's Bistro") need no escaping in double-quoted CSS strings.
+ */
+function asCssStringForContent(value: string): string {
+  const escaped = value
+    .replace(/\\/g, '\\\\')
+    .replace(/"/g, '\\22 ');
+  return `"${escaped}"`;
+}
+
+/**
+ * Sets --print-app-name on :root for print headers/footers. Call once when the app mounts.
+ * Uses the same quoted-string formatting as event name so content/margin-box use is valid.
+ */
+export function setPrintAppName(appName: string): void {
+  if (typeof document === 'undefined' || document === null) return;
+  document.documentElement.style.setProperty('--print-app-name', asCssStringForContent(appName));
+}
+
+/**
+ * Sets --print-title on :root for print headers/margin-box. Call when a page with a print title is shown.
+ * Uses the same quoted-string formatting as other print vars so content is valid.
+ */
+export function setPrintTitle(title: string): void {
+  if (typeof document === 'undefined' || document === null) return;
+  document.documentElement.style.setProperty('--print-title', asCssStringForContent(title));
+}
+
+/**
+ * Formats the current date/time as DD/MM/YYYY HH:mm (e.g. 28/01/2026 16:00) in local time.
+ */
+function formatPrintDateTime(): string {
+  const d = new Date();
+  const day = String(d.getDate()).padStart(2, '0');
+  const month = String(d.getMonth() + 1).padStart(2, '0');
+  const year = d.getFullYear();
+  const hours = String(d.getHours()).padStart(2, '0');
+  const minutes = String(d.getMinutes()).padStart(2, '0');
+  return `${day}/${month}/${year} ${hours}:${minutes}`;
+}
+
+/**
+ * Sets --print-date-time on :root to the current date/time (DD/MM/YYYY HH:mm). Safe for SSR.
+ */
+function setPrintDateTime(): void {
+  if (typeof document === 'undefined' || document === null) return;
+  document.documentElement.style.setProperty('--print-date-time', asCssStringForContent(formatPrintDateTime()));
+}
+
+/**
+ * Registers a beforeprint listener that updates --print-date-time so the printed page shows the current date/time.
+ * Returns a cleanup function that removes the listener. Call from layout useEffect and return the cleanup.
+ */
+export function setupPrintDateTime(): () => void {
+  if (typeof window === 'undefined') return () => {};
+  window.addEventListener('beforeprint', setPrintDateTime);
+  return () => window.removeEventListener('beforeprint', setPrintDateTime);
+}
+
 /**
  * Applies a complete palette to the document by setting CSS variables on :root.
  * Uses document.documentElement.style.setProperty() for runtime updates.
- * 
+ * When eventName is provided, also sets --print-event-name for print styles.
+ *
  * @param palette - Complete palette data with main, sec, and acc palettes
+ * @param eventName - Optional event name to set as --print-event-name (e.g. for print headers/footers)
  */
-export function applyPalette(palette: PaletteData): void {
+export function applyPalette(palette: PaletteData, eventName?: string): void {
   if (typeof document === 'undefined' || document === null) {
     log.warn('Document not available (SSR) - palette not applied');
     return;
@@ -78,6 +141,10 @@ export function applyPalette(palette: PaletteData): void {
   const sec = palette.sec || {};
   const acc = palette.acc || {};
 
+  if (eventName !== undefined) {
+    root.style.setProperty('--print-event-name', asCssStringForContent(eventName));
+  }
+
   // Apply main palette
   if (main.raw) {
     root.style.setProperty('--color-main-raw', formatOklchCss(main.raw));
@@ -132,6 +199,8 @@ export function clearPalette(): void {
       root.style.removeProperty(propertyName);
     }
   }
+
+  root.style.removeProperty('--print-event-name');
 }
 
 /**

package/src/types/api-result.ts

@@ -0,0 +1,53 @@
+/**
+ * @file API Result Types
+ * @package @jmruthers/pace-core
+ * @module Types/ApiResult
+ * @since 1.0.0
+ *
+ * Standard result shape for async API functions. Ensures consistent error handling
+ * across pace-core and consuming apps. See Architecture and API & Tech Stack standards.
+ */
+
+/**
+ * Machine-readable error code and user-facing message for API failures.
+ */
+export type ApiError = {
+  code: string;
+  message: string;
+  details?: object;
+};
+
+/**
+ * Type-safe result for async API functions: either success with data or failure with error.
+ */
+export type ApiResult<T> =
+  | { ok: true; data: T }
+  | { ok: false; error: ApiError };
+
+/**
+ * Creates a successful ApiResult.
+ */
+export function ok<T>(data: T): ApiResult<T> {
+  return { ok: true, data };
+}
+
+/**
+ * Creates a failed ApiResult.
+ */
+export function err(error: ApiError): ApiResult<never> {
+  return { ok: false, error };
+}
+
+/**
+ * Type guard: narrows ApiResult to success variant.
+ */
+export function isOk<T>(result: ApiResult<T>): result is { ok: true; data: T } {
+  return result.ok === true;
+}
+
+/**
+ * Type guard: narrows ApiResult to failure variant.
+ */
+export function isErr<T>(result: ApiResult<T>): result is { ok: false; error: ApiError } {
+  return result.ok === false;
+}

package/src/types/{__tests__/core.test.ts → core.test.ts}

@@ -1,7 +1,7 @@
 /**
  * @file Core Type Utilities Tests
  * @package @jmruthers/pace-core
- * @module Types/Core/__tests__
+ * @module Types/Core
  * @since 1.0.0
  *
  * Comprehensive tests for core type utility functions including branded type creators,
@@ -33,7 +33,7 @@ import {
   assertPageId,
   AuthErrorCode,
   PermissionErrorCode
-} from '../core';
+} from './core';
 
 // Following testing standards: use timeout parameter to prevent hanging
 const TEST_TIMEOUT = 10000; // 10 seconds per test

package/src/types/{__tests__/database-generated.test.ts → database-generated.test.ts}

@@ -1,7 +1,7 @@
 /**
  * @file Database Generated Constants Tests
  * @package @jmruthers/pace-core
- * @module Types/Database/__tests__
+ * @module Types/Database
  * @since 1.0.0
  *
  * Tests for runtime constants exported from the generated database types file.
@@ -9,8 +9,8 @@
  */
 
 import { describe, it, expect } from 'vitest';
-import { Constants } from '../database.generated';
-import { ORGANISATION_ROLE_PERMISSIONS } from '../organisation';
+import { Constants } from './database.generated';
+import { ORGANISATION_ROLE_PERMISSIONS } from './organisation';
 
 const TEST_TIMEOUT = 10000;