@djangocfg/layouts 2.1.460 → 2.1.463

package/README.md

@@ -103,16 +103,17 @@ Architecture: `AuthShell` orchestrator dispatches to `CenteredShell` or `SplitSh
 
 ## Theme
 
-`baseApp.theme.style` injects `<style id="djangocfg-baseapp-theme-style">` with `--*` CSS variables. Merge order: imported globals → preset → `vars` (strongest).
+Themes are selected by the host application's CSS import. `BaseApp` owns only
+the light/dark class and does not inject token styles at runtime:
 
-| Piece | Meaning |
-|---|---|
-| `preset` | `default` · `django-cfg` · `ios` · `soft` · `dense` · `high-contrast`. |
-| `vars.light` / `vars.dark` | Partial `ThemeCssVarMap` — HSL triplets (`192 90% 35%`); `radius` accepts any CSS length. |
-
-Playground-only buckets (shadows, typography, spacing) are **not** injected — export full CSS from the Theme Configurator when you need them.
+```css
+@import "@djangocfg/ui-core/styles/full";
+@import "@djangocfg/ui-core/styles/presets/macos";
+```
 
-Exports: `ThemeStyleConfig`, `ThemeCssVarKey`, `ThemeCssVarMap`, `ThemeStylePresetId`, `THEME_STYLE_PRESETS`, `THEME_STYLE_PRESET_ORDER`, `buildThemeStyleSheet`, `ThemeStyleBridge`.
+The package exports `ThemeStylePresetId` and `THEME_STYLE_PRESET_ORDER` for
+metadata and selectors. Preset tokens live exclusively in the static CSS
+files shipped by `@djangocfg/ui-core`.
 
 ---
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/layouts",
-  "version": "2.1.460",
+  "version": "2.1.463",
   "description": "Simple, straightforward layout components for Next.js - import and use with props",
   "keywords": [
     "layouts",
@@ -89,10 +89,10 @@
     "check": "tsc --noEmit"
   },
   "peerDependencies": {
-    "@djangocfg/api": "^2.1.460",
-    "@djangocfg/centrifugo": "^2.1.460",
-    "@djangocfg/i18n": "^2.1.460",
-    "@djangocfg/ui-core": "^2.1.460",
+    "@djangocfg/api": "^2.1.463",
+    "@djangocfg/centrifugo": "^2.1.463",
+    "@djangocfg/i18n": "^2.1.463",
+    "@djangocfg/ui-core": "^2.1.463",
     "@hookform/resolvers": "^5.2.2",
     "consola": "^3.4.2",
     "lucide-react": "^0.545.0",
@@ -109,7 +109,7 @@
     "tailwindcss-animate": "^1.0.7",
     "zod": "^4.3.6",
     "zustand": "^5.0.0",
-    "@djangocfg/devtools": "^2.1.460"
+    "@djangocfg/devtools": "^2.1.463"
   },
   "peerDependenciesMeta": {
     "@djangocfg/devtools": {
@@ -124,12 +124,12 @@
     "uuid": "^11.1.0"
   },
   "devDependencies": {
-    "@djangocfg/api": "^2.1.460",
-    "@djangocfg/centrifugo": "^2.1.460",
-    "@djangocfg/i18n": "^2.1.460",
-    "@djangocfg/typescript-config": "^2.1.460",
-    "@djangocfg/ui-core": "^2.1.460",
-    "@djangocfg/ui-tools": "^2.1.460",
+    "@djangocfg/api": "^2.1.463",
+    "@djangocfg/centrifugo": "^2.1.463",
+    "@djangocfg/i18n": "^2.1.463",
+    "@djangocfg/typescript-config": "^2.1.463",
+    "@djangocfg/ui-core": "^2.1.463",
+    "@djangocfg/ui-tools": "^2.1.463",
     "@types/node": "^25.2.3",
     "@types/react": "^19.2.15",
     "@types/react-dom": "^19.2.3",
@@ -137,7 +137,7 @@
     "next-intl": "^4.9.1",
     "typescript": "^5.9.3",
     "zustand": "^5.0.9",
-    "@djangocfg/devtools": "^2.1.460"
+    "@djangocfg/devtools": "^2.1.463"
   },
   "publishConfig": {
     "access": "public"

package/src/layouts/AppLayout/BaseApp.tsx

@@ -56,7 +56,6 @@ import { UiProviders } from '@djangocfg/ui-core/providers';
 import { NextRouterAdapter, NextLinkProvider } from '@djangocfg/ui-core/adapters/nextjs';
 import { NextIntlLinkBridge } from './NextIntlLinkBridge';
 import { ThemeProvider } from '@djangocfg/ui-core/theme';
-import { ThemeStyleBridge } from '../../theme/ThemeStyleBridge';
 import type { BoundaryRenderProps } from '@djangocfg/ui-core/components';
 import { getT } from '@djangocfg/i18n';
 import { ErrorTrackingProvider } from '../../components/errors/ErrorsTracker';
@@ -160,7 +159,6 @@ export function BaseApp({
       defaultTheme={theme?.defaultTheme || 'system'}
       storageKey={theme?.storageKey}
     >
-      <ThemeStyleBridge style={theme?.style} />
       {/*
        * NextRouterAdapter wires @djangocfg/ui-core router hooks
        * (useNavigate, useQueryState, etc.) to next/navigation so

package/src/layouts/PublicLayout/primitives/NavDesktopItems.tsx

@@ -46,10 +46,10 @@ function subMenuLinkCls(active: boolean) {
 }
 
 // Real glass: low-opacity surface so the blur actually shows the page behind
-// it. backdrop-blur-2xl + saturate gives the frosted look; the previous
-// bg-card/80 (80% opaque) let almost nothing through, so the blur was invisible.
+// it. The package-level nav-dropdown-glass utility keeps the frosted effect
+// present even when the consuming app does not scan layout sources.
 const popoverCls =
-  'absolute left-0 top-full mt-1 z-[1200] min-w-[14.5rem] rounded-xl border border-white/10 bg-background/55 backdrop-blur-2xl backdrop-saturate-150 dark:bg-card/55 p-1.5 shadow-[0_1px_2px_rgba(0,0,0,0.05),0_8px_28px_rgba(0,0,0,0.18)] dark:shadow-[0_8px_30px_rgba(0,0,0,0.45)]';
+  'absolute left-0 top-full mt-1 z-[1200] min-w-[14.5rem] rounded-xl border border-white/10 nav-dropdown-glass p-1.5 shadow-[0_1px_2px_rgba(0,0,0,0.05),0_8px_28px_rgba(0,0,0,0.18)] dark:shadow-[0_8px_30px_rgba(0,0,0,0.45)]';
 
 function NavDesktopItemsRaw({
   items,

package/src/layouts/types/index.ts

@@ -12,9 +12,6 @@
 // Local provider configs
 export type {
   ThemeConfig,
-  ThemeStyleConfig,
-  ThemeCssVarKey,
-  ThemeCssVarMap,
   ThemeStylePresetId,
   SWRConfigOptions,
   CentrifugoConfig,

package/src/layouts/types/providers.types.ts

@@ -5,10 +5,7 @@
  * Note: Analytics, PWA, Push, and Error types are defined in their respective modules
  */
 
-import type { ThemeStyleConfig } from '@djangocfg/ui-core/styles/presets';
-
-// Re-export for consumers that only import from `layouts/types`
-export type { ThemeStyleConfig, ThemeCssVarKey, ThemeCssVarMap, ThemeStylePresetId } from '@djangocfg/ui-core/styles/presets';
+export type { ThemeStylePresetId } from '@djangocfg/ui-core/styles/presets';
 
 // ============================================================================
 // Theme Configuration
@@ -17,11 +14,6 @@ export type { ThemeStyleConfig, ThemeCssVarKey, ThemeCssVarMap, ThemeStylePreset
 export interface ThemeConfig {
   defaultTheme?: 'light' | 'dark' | 'system';
   storageKey?: string;
-  /**
-   * Typed CSS variable presets and per-mode overrides (see `ThemeStyleBridge` in BaseApp).
-   * For heavy visual editing, use the playground Theme Configurator and export CSS instead.
-   */
-  style?: ThemeStyleConfig;
 }
 
 // ============================================================================

package/src/theme/index.ts

@@ -1,14 +1,3 @@
-export type {
-  ThemeCssVarChartKey,
-  ThemeCssVarChromeKey,
-  ThemeCssVarColorKey,
-  ThemeCssVarKey,
-  ThemeCssVarMap,
-  ThemeCssVarSidebarKey,
-  ThemeStyleConfig,
-  ThemeStylePresetId,
-} from '@djangocfg/ui-core/styles/presets';
+export type { ThemeStylePresetId } from '@djangocfg/ui-core/styles/presets';
 
-export { THEME_STYLE_PRESETS, THEME_STYLE_PRESET_ORDER, buildThemeStyleSheet } from '@djangocfg/ui-core/styles/presets';
-
-export { ThemeStyleBridge, type ThemeStyleBridgeProps } from './ThemeStyleBridge';
+export { THEME_STYLE_PRESET_ORDER } from '@djangocfg/ui-core/styles/presets';

package/src/theme/ThemeStyleBridge.tsx

@@ -1,39 +0,0 @@
-'use client';
-
-import { useEffect, useMemo } from 'react';
-
-import { buildThemeStyleSheet, type ThemeStyleConfig } from '@djangocfg/ui-core/styles/presets';
-
-const STYLE_ELEMENT_ID = 'djangocfg-baseapp-theme-style';
-
-export interface ThemeStyleBridgeProps {
-  style?: ThemeStyleConfig;
-}
-
-/**
- * Injects merged theme CSS variables after globals (preset + typed overrides).
- * Renders nothing; safe to mount once under ThemeProvider.
- */
-export function ThemeStyleBridge({ style }: ThemeStyleBridgeProps) {
-  const css = useMemo(() => buildThemeStyleSheet(style), [style]);
-
-  useEffect(() => {
-    if (typeof document === 'undefined') return;
-
-    let el = document.getElementById(STYLE_ELEMENT_ID) as HTMLStyleElement | null;
-    if (!css) {
-      el?.remove();
-      return;
-    }
-
-    if (!el) {
-      el = document.createElement('style');
-      el.id = STYLE_ELEMENT_ID;
-      document.head.appendChild(el);
-    }
-
-    el.textContent = css;
-  }, [css]);
-
-  return null;
-}