@neuravision/construct 2.1.4 → 2.1.6

package/CHANGELOG.md

@@ -5,6 +5,31 @@ All notable changes to `@neuravision/construct` will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [2.1.6] - 2026-07-19
+
+### Fixed
+
+- Datum registration marks on `ct-datum-frame` and `ct-card--datum` now establish an
+  isolated component stacking context and render above component-local chrome. Opaque,
+  positioned headers (such as terminal captions at `z-index: 1`) previously painted over
+  the orange corner even though `ct-datum-frame` explicitly supports code samples. The
+  mark remains contained below global overlays, and the Storybook contract now covers a
+  clipped, rounded code frame with layered chrome.
+
+## [2.1.5] - 2026-07-17
+
+### Fixed
+
+- **Card & Modal: the 2.1.4 `[hidden]` slot guards are replaced with `:not(:has(*))`
+  empty-slot rules — update immediately if you are on 2.1.4.** The attribute guards
+  trusted the wrapper's projection detection; ng-construct's `AfCard`/`AfModal` detection
+  (`contentChild('[header]')` resolves a template reference name, never a CSS selector)
+  reports "empty" for every slot, so 2.1.4 blanked out populated card headers/footers and
+  every modal footer in consuming apps. The slots now decide visibility purely in CSS:
+  a header/footer wrapper with no projected element hides itself, one with content always
+  renders — regardless of what the wrapper's `hidden` attribute claims. The original
+  2.1.4 goal (no ghost divider under footerless cards/modals) is preserved.
+
 ## [2.1.4] - 2026-07-17
 
 ### Fixed

package/components/card.css

@@ -46,12 +46,12 @@
   border-top: var(--border-thin) solid var(--color-border-subtle);
 }
 
-/* Wrappers hide empty slots via the `hidden` attribute (e.g. framework
-   integrations when no content is projected). The display rules above would
-   otherwise override the UA stylesheet's `[hidden] { display: none }` and
-   leave a ghost divider + spacing behind. */
-.ct-card__header[hidden],
-.ct-card__footer[hidden] {
+/* Slot wrappers render even when no content is projected into them (framework
+   wrappers cannot reliably detect projection, and the `hidden` attribute they
+   set is overridden by the display rules above). Hide slots without projected
+   content so an empty header/footer leaves no ghost spacing or divider. */
+.ct-card__header:not(:has(*)),
+.ct-card__footer:not(:has(*)) {
   display: none;
 }
 
@@ -110,6 +110,9 @@
    Both are opt-in and additive — they don't change default cards. */
 .ct-card--datum {
   position: relative;
+  /* Contain the datum's internal paint layer so it cannot overlap adjacent
+     cards or consumer overlays. */
+  isolation: isolate;
 }
 
 .ct-card--datum::before {
@@ -122,6 +125,8 @@
   border-block-start: var(--border-medium) solid var(--color-brand-accent);
   border-inline-start: var(--border-medium) solid var(--color-brand-accent);
   border-start-start-radius: var(--radius-lg);
+  /* Card chrome may use layer 1; the registration mark stays above it. */
+  z-index: 2;
   pointer-events: none;
 }
 

package/components/datum.css

@@ -255,6 +255,9 @@
    forced colors keeps the borders via CanvasText automatically. */
 .ct-datum-frame {
   position: relative;
+  /* Keep the datum's internal paint layer above local figure chrome without
+     allowing it to participate in the consumer's global overlay stack. */
+  isolation: isolate;
 }
 
 .ct-datum-frame::before {
@@ -267,6 +270,9 @@
   border-block-start: var(--border-medium) solid var(--color-brand-accent);
   border-inline-start: var(--border-medium) solid var(--color-brand-accent);
   border-start-start-radius: var(--radius-lg);
+  /* Code-frame headers commonly occupy layer 1. The datum must remain visible
+     above that chrome because it is the frame's registration mark. */
+  z-index: 2;
   pointer-events: none;
 }
 

package/components/modal.css

@@ -64,10 +64,10 @@
   flex-wrap: wrap;
 }
 
-/* Wrappers hide the footer via the `hidden` attribute when no content is
-   projected; `display: flex` above would otherwise override the UA
-   stylesheet's `[hidden]` rule and leave a ghost divider behind. */
-.ct-modal__footer[hidden] {
+/* The footer wrapper renders even when no content is projected into it
+   (framework wrappers cannot reliably detect projection). Hide it when
+   empty so footerless modals leave no ghost divider behind. */
+.ct-modal__footer:not(:has(*)) {
   display: none;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neuravision/construct",
-  "version": "2.1.4",
+  "version": "2.1.6",
   "description": "Construct Design System - Accessible, token-based design system for modern web applications",
   "license": "MIT",
   "repository": {