theme-vir 28.18.3 → 28.18.4

package/dist/color-theme/color-theme-book-pages.js

@@ -1,9 +1,10 @@
-import { check } from '@augment-vir/assert';
+import { assertWrap, check } from '@augment-vir/assert';
 import { groupArrayBy } from '@augment-vir/common';
 import { VirColorPair } from '@electrovir/color';
 import { BookPageControlType, defineBookPage, definePageControl, } from 'element-book';
-import { css, html, listen, nothing } from 'element-vir';
+import { css, html, listen, nothing, onDomRendered } from 'element-vir';
 import { generateThemeCode } from './color-theme-code.js';
+import { applyColorTheme } from './color-theme.js';
 const noneOverridesSelectionValue = 'None';
 /**
  * Create multiple element-book pages to showcase a theme its overrides (if any).
@@ -73,7 +74,14 @@ export function createColorThemeBookPages({ parent, title, theme, hideInverseCol
               `
             : nothing;
         return html `
-            <div class="with-inverse">${normalTemplate}${inverseTemplate}</div>
+            <div
+                class="with-inverse"
+                ${onDomRendered((element) => {
+            applyColorTheme(assertWrap.instanceOf(element, HTMLElement), theme);
+        })}
+            >
+                ${normalTemplate}${inverseTemplate}
+            </div>
         `;
     }
     function createThemePageExamples(defineExample, defaultTheme, overrides) {

package/dist/color-theme/color-theme.js

@@ -144,12 +144,12 @@ export function defineColorTheme(defaultInit, allColorsInit) {
                 syntax: CssVarSyntaxName.Color,
             };
             accum[names.foregroundInverse] = {
-                default: `var(--${names.background}, ${background})`,
+                default: `var(--${names.background})`,
                 initialValue: 'transparent',
                 syntax: CssVarSyntaxName.Color,
             };
             accum[names.backgroundInverse] = {
-                default: `var(--${names.foreground}, ${foreground})`,
+                default: `var(--${names.foreground})`,
                 initialValue: 'transparent',
                 syntax: CssVarSyntaxName.Color,
             };

package/dist/index.d.ts

@@ -1,5 +1,4 @@
 export * from './color-theme/build-color-theme.js';
-export * from './color-theme/color-css.js';
 export * from './color-theme/color-palette-book-pages.js';
 export * from './color-theme/color-theme-book-pages.js';
 export * from './color-theme/color-theme-code.js';

package/dist/index.js

@@ -1,5 +1,4 @@
 export * from './color-theme/build-color-theme.js';
-export * from './color-theme/color-css.js';
 export * from './color-theme/color-palette-book-pages.js';
 export * from './color-theme/color-theme-book-pages.js';
 export * from './color-theme/color-theme-code.js';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "theme-vir",
-    "version": "28.18.3",
+    "version": "28.18.4",
     "description": "Create an entire web theme.",
     "keywords": [
         "design",
@@ -45,9 +45,9 @@
     "dependencies": {
         "@augment-vir/assert": "^31.59.0",
         "@augment-vir/common": "^31.59.0",
-        "@electrovir/color": "^1.7.1",
+        "@electrovir/color": "^1.7.5",
         "apca-w3": "^0.1.9",
-        "lit-css-vars": "^3.2.1",
+        "lit-css-vars": "^3.2.2",
         "type-fest": "^5.4.1"
     },
     "devDependencies": {
@@ -58,14 +58,14 @@
         "@web/test-runner-commands": "^0.9.0",
         "@web/test-runner-playwright": "^0.11.1",
         "@web/test-runner-visual-regression": "^0.10.0",
-        "element-book": "^26.15.1",
+        "element-book": "^26.15.3",
         "element-vir": "^26.14.2",
         "esbuild": "^0.27.2",
         "istanbul-smart-text-reporter": "^1.1.5",
         "markdown-code-example-inserter": "^3.0.3",
         "typedoc": "^0.28.16",
         "typescript": "5.9.3",
-        "vira": "^28.19.6",
+        "vira": "^28.19.7",
         "vite": "^7.3.1",
         "vite-tsconfig-paths": "^6.0.4"
     },

package/dist/color-theme/color-css.d.ts

@@ -1,9 +0,0 @@
-import { type CSSResult } from 'element-vir';
-import { type ColorThemeColor } from './color-theme.js';
-/**
- * Creates foreground and background CSS code. The foreground color is applied to the CSS `color`
- * property and the background color is applied to the CSS `background-color` property.
- *
- * @category Color Theme
- */
-export declare function colorCss(color: Readonly<ColorThemeColor>): CSSResult;

package/dist/color-theme/color-css.js

@@ -1,13 +0,0 @@
-import { css } from 'element-vir';
-/**
- * Creates foreground and background CSS code. The foreground color is applied to the CSS `color`
- * property and the background color is applied to the CSS `background-color` property.
- *
- * @category Color Theme
- */
-export function colorCss(color) {
-    return css `
-        color: ${color.foreground.value};
-        background-color: ${color.background.value};
-    `;
-}