phoenix_duskmoon 10.0.10 → 10.0.12

package/CHANGELOG.md

@@ -1,3 +1,23 @@
+# [10.0.12](https://github.com/duskmoon-dev/phoenix-duskmoon-ui/compare/v10.0.11...v10.0.12) (2026-11-01)
+
+### Fixed
+
+- Exclude build-tool applications (`duskmoon_npm`, `duskmoon_hex_solver`, etc.) from
+  Storybook production release assembly, ensuring a clean runtime-only release.
+- Add Bun setup to test workflow for browser component tests.
+- Bump `@duskmoon-dev/components` to 0.5.5 for Popover API support, dropdown select
+  layout, and timeline marker styling.
+
+# [10.0.11](https://github.com/duskmoon-dev/phoenix-duskmoon-ui/compare/v10.0.10...v10.0.11) (2026-10-22)
+
+### Fixed
+
+- Synchronize native dropdown triggers' explicit `aria-expanded` state on open,
+  Escape, light dismiss and LiveView patches through the existing CSP-safe
+  `DuskmoonPopover` hook. Preserve native-only behavior and accessibility when
+  the hook is absent, resolving
+  [#209](https://github.com/duskmoon-dev/phoenix-duskmoon-ui/issues/209).
+
 # [10.0.10](https://github.com/duskmoon-dev/phoenix-duskmoon-ui/compare/v10.0.9...v10.0.10) (2026-10-22)
 
 ### Fixed

package/README.md

@@ -32,13 +32,13 @@ Add to `mix.exs`:
 Install frontend packages:
 
 ```bash
-bun add @duskmoon-dev/core @duskmoon-dev/elements
+mix npm.install @duskmoon-dev/core @duskmoon-dev/elements
 ```
 
 Optionally, add CSS Art and Art Custom Elements support:
 
 ```bash
-bun add @duskmoon-dev/css-art @duskmoon-dev/art-elements
+mix npm.install @duskmoon-dev/css-art @duskmoon-dev/art-elements
 ```
 
 ### View Helpers
@@ -189,12 +189,19 @@ application's upload mechanism; they cannot be sent as LiveView JSON payloads.
 ## Repository development
 
 This checkout contains the UI and Storybook. It consumes the published toolchain
-cohort pinned in `BUNDLER_VERSION` and `mix.lock`; ordinary UI builds use verified
-precompiled Duskmoon native artifacts. The toolchain source and its own releases
-live in [duskmoon-bundler](https://github.com/duskmoon-dev/duskmoon-bundler).
+cohort declared with `~> 10.0` requirements and resolved in `mix.lock`; ordinary UI
+builds use verified precompiled Duskmoon native artifacts. The toolchain source
+and its own releases live in [duskmoon-bundler](https://github.com/duskmoon-dev/duskmoon-bundler).
 See the [migration and development guide](docs/bundler-extraction.md) for setup,
 candidate integration and independent release order.
 
+Storybook also consumes `duskmoon_hologram ~> 10.0` and provides a Hologram section
+before Storybook in its top navigation. Run `mix duskmoon.dev` (or `mix holo`) and
+open `/hologram` for the component playground, task list and profile preview.
+The checkout requires OTP 28+; `phoenix_duskmoon` itself keeps its existing Elixir
+and Phoenix compatibility and does not depend on Hologram. See the
+[Hologram guide](docs/hologram-example.md) for runtime boundaries and verification.
+
 ## Live Storybook
 
 [Live Storybook](https://duskmoon-storybook.gsmlg.dev)

package/assets/js/hooks/duskmoon_popover.js

@@ -10,12 +10,55 @@ export function syncPopoverState(element) {
 	if (controlledOpen === "false" && open) element.hidePopover();
 }
 
+// Dropdown hooks live on the wrapper so patches to either the trigger or panel
+// resynchronize state. Existing popover hooks still mount directly on the panel.
+function hookPopover(element) {
+	return element.dataset.popoverId
+		? element.ownerDocument.getElementById(element.dataset.popoverId)
+		: element;
+}
+
+function syncExpandedState(element, popover) {
+	if (element === popover || !("showPopover" in popover)) return;
+
+	const expanded = String(popover.matches(":popover-open"));
+
+	for (const trigger of element.querySelectorAll("[aria-controls]")) {
+		if (trigger.getAttribute("aria-controls") === popover.id) {
+			trigger.setAttribute("aria-expanded", expanded);
+		}
+	}
+}
+
+function syncHookState(hook) {
+	const popover = hookPopover(hook.el);
+
+	if (hook._popover !== popover) {
+		hook._popover?.removeEventListener("toggle", hook._onPopoverToggle);
+		hook._popover = popover;
+		popover?.addEventListener("toggle", hook._onPopoverToggle);
+	}
+
+	if (!popover) return;
+
+	syncPopoverState(popover);
+	syncExpandedState(hook.el, popover);
+}
+
 export const DuskmoonPopover = {
 	mounted() {
-		syncPopoverState(this.el);
+		this._onPopoverToggle = () => {
+			if (this._popover) syncExpandedState(this.el, this._popover);
+		};
+		syncHookState(this);
 	},
 
 	updated() {
-		syncPopoverState(this.el);
+		syncHookState(this);
+	},
+
+	destroyed() {
+		this._popover?.removeEventListener("toggle", this._onPopoverToggle);
+		this._popover = null;
 	},
 };

package/assets/js/hooks/index.d.ts

@@ -48,7 +48,7 @@ export declare const Spotlight: LiveViewHook<HTMLDialogElement>;
 /** Page-header visibility observer. */
 export declare const PageHeader: LiveViewHook;
 
-/** Synchronizes an explicitly controlled native popover with LiveView state. */
+/** Synchronizes native dropdown expanded state and optional server-controlled popover visibility. */
 export declare const DuskmoonPopover: LiveViewHook<HTMLElement>;
 
 /** Preserves left-menu collapse, group, and scroll state across LiveView patches. */

package/assets/js/hooks/index.js

@@ -22,7 +22,7 @@
  * - ThemeSwitcher: Theme toggle with localStorage persistence
  * - Spotlight: Keyboard shortcut (Cmd/Ctrl+K) for spotlight search
  * - PageHeader: Intersection observer for scroll-based effects
- * - DuskmoonPopover: Optional server-controlled native popover state
+ * - DuskmoonPopover: Native dropdown expanded state and optional server-controlled popovers
  * - DuskmoonLeftMenu: Collapsible sidebar with persistent group and scroll state
  * - DuskmoonLeftMenuNavigation: Active-page synchronization for sticky left menus
  * - DuskmoonSplitPane: Accessible client-owned split-pane resizing

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "phoenix_duskmoon",
-  "version": "10.0.10",
+  "version": "10.0.12",
   "type": "module",
   "exports": {
     ".": "./priv/static/assets/js/phoenix_duskmoon.js",
@@ -37,18 +37,18 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@duskmoon-dev/art-elements": "1.9.3",
-    "@duskmoon-dev/components": "0.5.2",
-    "@duskmoon-dev/core": "1.20.6",
-    "@duskmoon-dev/css-art": "1.20.6",
-    "@duskmoon-dev/elements": "1.9.3",
-    "react": "19.3.0",
-    "react-dom": "19.3.0"
+    "@duskmoon-dev/art-elements": "1.10.2",
+    "@duskmoon-dev/components": "0.5.5",
+    "@duskmoon-dev/core": "1.20.8",
+    "@duskmoon-dev/css-art": "1.20.8",
+    "@duskmoon-dev/elements": "1.10.2",
+    "react": "19.3.1",
+    "react-dom": "19.3.1"
   },
   "devDependencies": {
     "@mdi/svg": "7.4.47",
     "bootstrap-icons": "1.13.2",
-    "postcss": "8.5.29"
+    "postcss": "8.5.32"
   },
   "peerDependencies": {
     "tailwindcss": "^4.3.2"