@cahyo-dimas/freeday 1.51.0 → 1.51.1

package/CHANGELOG.md

@@ -3,6 +3,33 @@
 Semua perubahan penting dicatat di sini. Format longgar mengikuti
 [Keep a Changelog](https://keepachangelog.com/); tiap versi = git tag.
 
+## [1.51.1] — 2026-08-24
+### Docs
+- **`COMPONENTS.md` never said whether two overlays may be open at once** (#046). Modal and Drawer
+  were documented in isolation, so "can a confirm modal open over an open drawer?" had no answer in
+  the file — and the built CSS does not answer it either: the only overlay `z-index` in the bundle
+  belongs to the toast region. Both entries now state the rule, because both components are
+  `<dialog>` opened with `showModal()` and therefore enter the **top layer**, where paint order is
+  the order they were opened: the later modal is above the drawer with no `z-index` from either,
+  Escape closes the topmost first (so cancelling returns to the still-open drawer), and closing them
+  out of order leaves the survivor painted and dismissible.
+- **The one caveat is the browser's, and it is now written down**: open each overlay from the
+  gesture that asked for it. A `showModal()` with no user activation — from a timer, or after an
+  `await` that outlived the click — has its close watcher GROUPED with the dialog below it, and a
+  single Escape then closes both. Measured, not assumed: two untrusted `.click()` opens, one Escape,
+  both dialogs shut.
+### Added — guards
+- `browser/overlay-stack.mjs` (3 tests) proves that paragraph instead of restating it — the #041
+  lesson applied to a documentation change. Paint order is asserted in **pixels** at the overlap of
+  the two, because a modal dialog makes the rest of the document inert and `elementFromPoint` will
+  name the dialog whatever is really on top; the overlays are opened with **trusted** clicks, or the
+  close-watcher grouping above would fail the Escape assertion for a reason that is not the kit's.
+- **`pressKey` in the browser harness sent every key but Tab with virtual-key code 0** — delivered
+  to the page, but not acted on by the browser: Escape reached a `keydown` listener yet never closed
+  a native `<dialog>`. A dismissal guard written with it would have passed for the wrong reason and
+  reported a broken kit as fine. It now carries the real `windowsVirtualKeyCode` /
+  `nativeVirtualKeyCode` for the keys the suite presses.
+
 ## [1.51.0] — 2026-08-21
 ### Fixed
 - **A cartesian chart's axis text and dots grew with the container** (#042). `renderCartesian` built

package/COMPONENTS.md

@@ -1049,6 +1049,18 @@ painted on top of a modal, because it will tell you the dialog is, even when it
 `__close`. The body scrolls; the footer never clips. `aria-labelledby` → the title's `id`;
 `data-close` on any button that should close it.
 
+**Stacking two overlays is supported.** Modal and drawer are both `<dialog>` opened with
+`showModal()`, so both enter the top layer and paint in the order they were opened — a confirm
+modal opened from inside an open drawer paints **above** it, and neither needs a `z-index` for
+that. Escape closes the topmost first, so cancelling returns to the still-open drawer; a second
+Escape then closes the drawer. Closing them out of order is fine too: closing the drawer while the
+modal is up leaves the modal open, painted and dismissible.
+
+One caveat, and it is the browser's rather than the kit's: **open each overlay from the gesture
+that asked for it.** A `showModal()` that runs with no user activation — from a timer, or after an
+`await` that outlived the click — has its close watcher grouped with the dialog below it, and then
+a single Escape closes both at once instead of the topmost only.
+
 ## Drawer — `.fdy-drawer`
 > **Typed wrapper: `<FdyDrawer>`** — Vue (`:open` + `@close`) · React (`open` + `onClose`) · Blazor (`@bind-Open`). In those stacks use the wrapper; the markup below is for stacks without an adapter (and is what the wrapper renders).
 
@@ -1056,6 +1068,11 @@ Temporary side panel on native `<dialog>` — left by default, `--right` to flip
 `__title` `__body` `__footer` `__close`. Open it from any
 `<button data-fdy-drawer="<dialog id>">`. Needs `freeday-drawer.js`.
 
+Opened with `showModal()`, so it is in the **top layer** on the same terms as the modal — including
+opening a modal over an open drawer, which is supported and described under
+[Modal → *Stacking two overlays*](#modal--fdy-modal). It slides in on `transform` and never animates
+opacity: wait on its position, not on `opacity`, if you need to know when it has arrived.
+
 ## Accordion — `.fdy-accordion`
 Native `<details>`, zero JS: `.fdy-accordion__item` on each `<details>`, content in
 `.fdy-accordion__panel`, the trigger is the `<summary>`.

package/README.id.md

@@ -5,7 +5,7 @@
 > **Lebih banyak _free day_ buat dev — UI kit-nya sudah siap pakai.**
 
 [![Live docs](https://img.shields.io/badge/docs-live-2050d8?style=flat-square)](https://cahyo-dimas.github.io/freeday-ui-kit/)
-[![Release](https://img.shields.io/badge/release-v1.51.0-0078d4?style=flat-square)](https://github.com/cahyo-dimas/freeday-ui-kit/tree/v1.51.0)
+[![Release](https://img.shields.io/badge/release-v1.51.1-0078d4?style=flat-square)](https://github.com/cahyo-dimas/freeday-ui-kit/tree/v1.51.1)
 
 UI KIT yang token-driven & framework-agnostic — satu sumber kebenaran untuk warna, tipografi,
 spasi, dan komponen. Blueprint: `docs/superpowers/specs/2026-07-21-freeday-ui-kit-design.md`.

package/README.md

@@ -5,7 +5,7 @@
 > **More free days for devs — the UI kit is ready to use.**
 
 [![Live docs](https://img.shields.io/badge/docs-live-2050d8?style=flat-square)](https://cahyo-dimas.github.io/freeday-ui-kit/)
-[![Release](https://img.shields.io/badge/release-v1.51.0-0078d4?style=flat-square)](https://github.com/cahyo-dimas/freeday-ui-kit/tree/v1.51.0)
+[![Release](https://img.shields.io/badge/release-v1.51.1-0078d4?style=flat-square)](https://github.com/cahyo-dimas/freeday-ui-kit/tree/v1.51.1)
 
 A token-driven, framework-agnostic UI kit — one source of truth for color, typography,
 spacing, and components. Blueprint: `docs/superpowers/specs/2026-07-21-freeday-ui-kit-design.md`.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cahyo-dimas/freeday",
-  "version": "1.51.0",
+  "version": "1.51.1",
   "description": "Freeday — token-driven, framework-agnostic UI KIT (design source-of-truth).",
   "type": "module",
   "license": "MIT",
@@ -92,7 +92,7 @@
   "scripts": {
     "build": "node tokens/build.mjs",
     "test": "node --test",
-    "test:browser": "node --test browser/vanilla.mjs browser/adapter.mjs browser/layout.mjs browser/theme.mjs browser/state.mjs browser/root-init.mjs browser/upload-states.mjs browser/number.mjs browser/card-stretch.mjs browser/text-override.mjs browser/control-heights.mjs browser/cfl-multi.mjs browser/crowding.mjs browser/over-dialog.mjs browser/chart-scale.mjs",
+    "test:browser": "node --test browser/vanilla.mjs browser/adapter.mjs browser/layout.mjs browser/theme.mjs browser/state.mjs browser/root-init.mjs browser/upload-states.mjs browser/number.mjs browser/card-stretch.mjs browser/text-override.mjs browser/control-heights.mjs browser/cfl-multi.mjs browser/crowding.mjs browser/over-dialog.mjs browser/chart-scale.mjs browser/overlay-stack.mjs",
     "prepack": "node tokens/build.mjs",
     "version": "node tokens/build.mjs && git add dist",
     "typecheck:react": "tsc -p adapters/react/tsconfig.json --noEmit"