@diagrammo/dgmo 0.81.0 → 0.82.0

package/dist/block.css

@@ -9,9 +9,16 @@
  * swallowed into a rule they then emit as garbage. */
 
 /* === Color-mode visibility (dual-render) ===
- * The dark wrapper also carries the "hidden" ATTRIBUTE, so a page that never
+ * The dark wrapper also carries an inline display:none, so a page that never
  * loaded this stylesheet shows the light diagram rather than both of them.
- * Every rule below is author-origin and therefore still overrides it.
+ * The two reveal rules are !important because of it: an inline declaration
+ * outranks every normal author rule, and only an important one beats it.
+ *
+ * That inline style replaced the "hidden" ATTRIBUTE in issue 647. Tailwind v4
+ * hides [hidden] with !important from inside a cascade layer, and a layered
+ * important declaration outranks an unlayered one at ANY specificity — so no
+ * rule here could reveal the dark wrapper, and every diagram on a Tailwind v4
+ * host was a zero-height empty box in dark mode.
  * Keep the two host conventions in separate rule blocks — the adapters
  * rewrite by literal replace and a folded rule would half-rewrite. */
 .dgmo-dark {
@@ -21,13 +28,13 @@
   display: none;
 }
 [data-theme="dark"] .dgmo-dark {
-  display: block;
+  display: block !important;
 }
 html.dark .dgmo-light {
   display: none;
 }
 html.dark .dgmo-dark {
-  display: block;
+  display: block !important;
 }
 
 /* === Diagram sizing ===

package/dist/block.js

@@ -587,9 +587,16 @@ var BLOCK_CSS = `
  * swallowed into a rule they then emit as garbage. */
 
 /* === Color-mode visibility (dual-render) ===
- * The dark wrapper also carries the "hidden" ATTRIBUTE, so a page that never
+ * The dark wrapper also carries an inline display:none, so a page that never
  * loaded this stylesheet shows the light diagram rather than both of them.
- * Every rule below is author-origin and therefore still overrides it.
+ * The two reveal rules are !important because of it: an inline declaration
+ * outranks every normal author rule, and only an important one beats it.
+ *
+ * That inline style replaced the "hidden" ATTRIBUTE in issue 647. Tailwind v4
+ * hides [hidden] with !important from inside a cascade layer, and a layered
+ * important declaration outranks an unlayered one at ANY specificity \u2014 so no
+ * rule here could reveal the dark wrapper, and every diagram on a Tailwind v4
+ * host was a zero-height empty box in dark mode.
  * Keep the two host conventions in separate rule blocks \u2014 the adapters
  * rewrite by literal replace and a folded rule would half-rewrite. */
 .dgmo-dark {
@@ -599,13 +606,13 @@ var BLOCK_CSS = `
   display: none;
 }
 [data-theme="dark"] .dgmo-dark {
-  display: block;
+  display: block !important;
 }
 html.dark .dgmo-light {
   display: none;
 }
 html.dark .dgmo-dark {
-  display: block;
+  display: block !important;
 }
 
 /* === Diagram sizing ===
@@ -1090,7 +1097,7 @@ async function renderDgmoBlock(source, options = {}) {
       renderTheme("dark")
     ]);
     const background = opts.background === "auto" ? defaultEmbedBackground(chartType) : opts.background;
-    svgsHtml = `<div class="${escapeAttr(innerClasses(opts, "dgmo-light"))}" data-dgmo-bg="${escapeAttr(palette.light.bg)}">${normalizeSvgForEmbed(light, { background })}</div><div class="${escapeAttr(innerClasses(opts, "dgmo-dark"))}" data-dgmo-bg="${escapeAttr(palette.dark.bg)}" hidden>${normalizeSvgForEmbed(dark, { background })}</div>`;
+    svgsHtml = `<div class="${escapeAttr(innerClasses(opts, "dgmo-light"))}" data-dgmo-bg="${escapeAttr(palette.light.bg)}">${normalizeSvgForEmbed(light, { background })}</div><div class="${escapeAttr(innerClasses(opts, "dgmo-dark"))}" data-dgmo-bg="${escapeAttr(palette.dark.bg)}" style="display:none">${normalizeSvgForEmbed(dark, { background })}</div>`;
   } else {
     const svg = await renderTheme(opts.colorMode);
     const background = opts.background === "auto" ? defaultEmbedBackground(chartType) : opts.background;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@diagrammo/dgmo",
-  "version": "0.81.0",
+  "version": "0.82.0",
   "description": "DGMO diagram markup language — parser, renderer, and color system",
   "license": "MIT",
   "author": "Diagrammo LLC",