@opendata-ai/openchart-vanilla 2.11.0 → 2.12.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opendata-ai/openchart-vanilla",
-  "version": "2.11.0",
+  "version": "2.12.1",
   "description": "Vanilla JS renderer for openchart: SVG charts, HTML tables, force-directed graphs",
   "license": "Apache-2.0",
   "author": "Riley Hilliard",
@@ -50,8 +50,8 @@
   },
   "dependencies": {
     "@floating-ui/dom": "^1.7.6",
-    "@opendata-ai/openchart-core": "2.11.0",
-    "@opendata-ai/openchart-engine": "2.11.0",
+    "@opendata-ai/openchart-core": "2.12.1",
+    "@opendata-ai/openchart-engine": "2.12.1",
     "d3-force": "^3.0.0",
     "d3-quadtree": "^3.0.1"
   },

package/src/mount.ts

@@ -1297,6 +1297,17 @@ function createScreenReaderTable(
 
   const table = document.createElement('table');
   table.className = 'viz-sr-only';
+  // Inline critical SR-only styles so the table stays hidden even when the
+  // external stylesheet isn't loaded (e.g. CDN / esm.sh usage).
+  table.style.position = 'absolute';
+  table.style.width = '1px';
+  table.style.height = '1px';
+  table.style.padding = '0';
+  table.style.margin = '-1px';
+  table.style.overflow = 'hidden';
+  table.style.clipPath = 'inset(50%)';
+  table.style.whiteSpace = 'nowrap';
+  table.style.borderWidth = '0';
   table.setAttribute('role', 'table');
   table.setAttribute('aria-label', `Data table: ${layout.a11y.altText}`);
 

package/src/table-renderer.ts

@@ -316,9 +316,19 @@ export function renderTable(layout: TableLayout, container: HTMLElement): HTMLEl
       table.classList.add('viz-table--sticky');
     }
 
-    // Caption (screen reader only)
+    // Caption (screen reader only – inline styles ensure hiding even without
+    // the external stylesheet, e.g. CDN / esm.sh usage)
     const caption = document.createElement('caption');
     caption.className = 'viz-sr-only';
+    caption.style.position = 'absolute';
+    caption.style.width = '1px';
+    caption.style.height = '1px';
+    caption.style.padding = '0';
+    caption.style.margin = '-1px';
+    caption.style.overflow = 'hidden';
+    caption.style.clipPath = 'inset(50%)';
+    caption.style.whiteSpace = 'nowrap';
+    caption.style.borderWidth = '0';
     caption.textContent = layout.a11y.summary;
     table.appendChild(caption);
 
@@ -347,6 +357,15 @@ export function renderTable(layout: TableLayout, container: HTMLElement): HTMLEl
   // Live region for screen reader announcements (sort changes, search results)
   const liveRegion = document.createElement('div');
   liveRegion.className = 'viz-table-live-region viz-sr-only';
+  liveRegion.style.position = 'absolute';
+  liveRegion.style.width = '1px';
+  liveRegion.style.height = '1px';
+  liveRegion.style.padding = '0';
+  liveRegion.style.margin = '-1px';
+  liveRegion.style.overflow = 'hidden';
+  liveRegion.style.clipPath = 'inset(50%)';
+  liveRegion.style.whiteSpace = 'nowrap';
+  liveRegion.style.borderWidth = '0';
   liveRegion.setAttribute('aria-live', 'polite');
   liveRegion.setAttribute('aria-atomic', 'true');
   liveRegion.setAttribute('role', 'status');