From 6f808d99a8a322e2fa08e53bc247a8a31e3a8af4 Mon Sep 17 00:00:00 2001
From: Troy Chaplin <troy.chaplin@gmail.com>
Date: Thu, 9 Jul 2026 08:47:50 -0300
Subject: [PATCH 1/6] add update plans

---
 planned-updates/01-platform-baseline.md       | 45 ++++++++++
 planned-updates/02-tag-processor-refactor.md  | 71 ++++++++++++++++
 .../03-enqueue-and-script-modules.md          | 74 ++++++++++++++++
 .../04-single-source-design-tokens.md         | 49 +++++++++++
 .../05-interactivity-api-migration.md         | 82 ++++++++++++++++++
 .../06-server-rendered-dropdown.md            | 70 ++++++++++++++++
 .../07-editor-controls-modernization.md       | 72 ++++++++++++++++
 planned-updates/08-accessibility-hardening.md | 65 ++++++++++++++
 .../09-config-extensibility-and-qa.md         | 70 ++++++++++++++++
 planned-updates/README.md                     | 84 +++++++++++++++++++
 10 files changed, 682 insertions(+)
 create mode 100644 planned-updates/01-platform-baseline.md
 create mode 100644 planned-updates/02-tag-processor-refactor.md
 create mode 100644 planned-updates/03-enqueue-and-script-modules.md
 create mode 100644 planned-updates/04-single-source-design-tokens.md
 create mode 100644 planned-updates/05-interactivity-api-migration.md
 create mode 100644 planned-updates/06-server-rendered-dropdown.md
 create mode 100644 planned-updates/07-editor-controls-modernization.md
 create mode 100644 planned-updates/08-accessibility-hardening.md
 create mode 100644 planned-updates/09-config-extensibility-and-qa.md
 create mode 100644 planned-updates/README.md

diff --git a/planned-updates/01-platform-baseline.md b/planned-updates/01-platform-baseline.md
new file mode 100644
index 0000000..ec8a51f
--- /dev/null
+++ b/planned-updates/01-platform-baseline.md
@@ -0,0 +1,45 @@
+# 01 — Platform Baseline: Requirements, Metadata, and Tooling
+
+| | |
+|---|---|
+| **Priority** | High |
+| **Effort** | 0.5–1 day |
+| **Release** | readme.txt fixes: v1.2 · version bumps: v2.0 |
+| **Depends on** | — (gates docs 03.2, 05, 06) |
+
+## Current state
+
+- `priority-plus-navigation.php:7-8` declares `Requires at least: 6.0` and `Requires PHP: 7.4`.
+- The bootstrap (`priority-plus-navigation.php:26-29`) calls `wp_trigger_error()`, which **only exists since WP 6.4** — the declared 6.0 minimum is already inaccurate. On WP 6.0–6.3 with a missing autoloader this would fatal on an undefined function instead of surfacing the intended error.
+- `readme.txt` is **missing both** the `Requires at least:` and `Requires PHP:` headers entirely; the WP.org directory falls back to the plugin header, but the readme is the canonical source and should carry them.
+- `readme.txt` FAQ/description claims the default More-button label is **"Browse"**, but the actual default is **"More"** (`src/config.js:7`, `src/variation/block.js` attribute default, `classes/class-block-renderer.php` `collect_attributes()`). Documentation and code have drifted.
+- `package.json` pins `@wordpress/scripts ^31.6.0`; current is 32.x. Module builds (needed for doc 03 part 2) require the `--experimental-modules` flag even on 32.x.
+- `Tested up to: 7.0` — verify against the actual latest WP release at each ship date.
+
+## Proposed changes
+
+### v1.2 (non-breaking)
+
+1. Add `Requires at least:` and `Requires PHP:` headers to `readme.txt`, matching the plugin header.
+2. Correct the declared WP minimum to **6.4** (honest floor given `wp_trigger_error`), or guard the call with `function_exists()` if 6.0 support genuinely matters. Recommendation: declare 6.4 — WP 6.0 is long past its support window.
+3. Fix the "Browse" vs "More" drift. Decide the canonical default (recommendation: **"More"**, matching the code and the common Priority+ convention) and align readme.txt FAQ, description, and any screenshots.
+4. Upgrade `@wordpress/scripts` to ^32.x. This is a dev-dependency change with no runtime impact; run the full lint/build/format suite after upgrading and fix any new lint findings.
+
+### v2.0 (breaking)
+
+5. Bump to **`Requires at least: 6.8`** and **`Requires PHP: 8.0`**:
+   - The Interactivity API and Script Modules API ship in WP 6.5, but current core patterns the migration copies (`withSyncEvent`, mature module registration, `wp_register_script_module` ergonomics) make 6.8 the honest floor. It also matches what current Gutenberg targets (Gutenberg 23.5 declares `Requires at least: 6.9`; 6.8 keeps one version of slack).
+   - PHP 8.0 matches current ecosystem baselines; nothing in the codebase requires 7.4-only syntax. `WP_HTML_Tag_Processor` (doc 02) works on 7.4, so the PHP bump is policy, not necessity — it can be dropped to 7.4 if user data argues for it.
+6. State the support policy in readme.txt: sites on WP 6.4–6.7 stay on the 1.x line; 1.x receives security fixes only after 2.0 ships.
+
+## Version discipline going forward
+
+- Plugin header `Version`, readme.txt `Stable tag`, and the `PRIORITY_PLUS_NAVIGATION_VERSION`-style constants (if introduced) must move together; the existing `bump changelog` / `release:` commit pattern should be documented in `CONTRIBUTING` or a release checklist here.
+- Re-verify `Tested up to:` on every release.
+
+## Acceptance criteria
+
+- [ ] readme.txt carries `Requires at least`, `Requires PHP`, accurate `Tested up to`, and the corrected default-label copy.
+- [ ] Plugin header and readme.txt agree.
+- [ ] `npm run build && npm run lint:js && npm run lint:css && composer phpcs` pass on @wordpress/scripts 32.x.
+- [ ] v2.0 readme includes the 1.x support-policy paragraph.
diff --git a/planned-updates/02-tag-processor-refactor.md b/planned-updates/02-tag-processor-refactor.md
new file mode 100644
index 0000000..c81f998
--- /dev/null
+++ b/planned-updates/02-tag-processor-refactor.md
@@ -0,0 +1,71 @@
+# 02 — Replace Regex HTML Rewriting with WP_HTML_Tag_Processor
+
+| | |
+|---|---|
+| **Priority** | High |
+| **Effort** | 2–3 days |
+| **Release** | v1.2 (non-breaking) |
+| **Depends on** | — |
+| **Prerequisite for** | 05 (directive injection), 06 (server-rendered dropdown) |
+
+## Current state
+
+`classes/class-block-renderer.php` modifies the rendered `core/navigation` output with regular expressions:
+
+- `inject_priority_attributes()` (line 193) builds a `<nav …>` match pattern, **strips any existing `style` attribute** with `preg_replace` (line 220), and appends `data-more-label`, `data-more-icon`, `data-overlay-menu`, `data-mobile-collapse`, and a rebuilt `style` attribute via a second `preg_replace` (line 222).
+- `preserve_existing_styles()` (line 254) regex-extracts the current inline style (`preg_match` at line 255) so WP-generated nav styles survive the strip-and-rebuild.
+
+Regex HTML manipulation is fragile against attribute ordering, quoting variants, entities in attribute values, and markup changes from core or other `render_block` filters running earlier. WordPress core stopped doing this: `core/navigation` itself injects its Interactivity directives into saved markup with `WP_HTML_Tag_Processor` (see `block_core_navigation_add_directives_to_submenu()` in Gutenberg's `packages/block-library/src/navigation/index.php` — `next_tag()` / `get_attribute()` / `set_attribute()` / `get_updated_html()`).
+
+## Proposed change
+
+Rewrite the injection layer of `Block_Renderer` on `WP_HTML_Tag_Processor` (available since WP 6.2 — safe for the v1.2 minimum):
+
+```php
+private function inject_priority_attributes( string $block_content, array $attributes ): string {
+    $processor = new WP_HTML_Tag_Processor( $block_content );
+
+    if ( ! $processor->next_tag( array( 'tag_name' => 'NAV' ) ) ) {
+        return $block_content;
+    }
+
+    $processor->set_attribute( 'data-more-label', $attributes['more_label'] );
+    $processor->set_attribute( 'data-overlay-menu', $attributes['overlay_menu'] );
+    // … remaining data attributes …
+
+    $existing_style = (string) $processor->get_attribute( 'style' );
+    $processor->set_attribute( 'style', $this->merge_styles( $existing_style, $attributes ) );
+
+    return $processor->get_updated_html();
+}
+```
+
+Notes:
+
+- `preserve_existing_styles()` collapses into a `get_attribute( 'style' )` read — no regex extraction, no strip-and-re-add. The style merge logic (`build_style_parts()`, `add_toggle_styles()`, `add_menu_styles()`) keeps producing the same CSS custom-property strings.
+- **`CSS_Converter` is untouched.** It converts values (presets, borders, padding), not markup.
+- Optionally scope the `next_tag` to the nav carrying `wp-block-navigation` via `class_name` matching, mirroring the current regex's intent; in practice the first `<nav>` of a `core/navigation` render is the block wrapper.
+- No behavior change is intended: same attributes, same style string, same class contract.
+
+## Parity requirement (the real work)
+
+The swap must be provably output-identical, modulo attribute ordering. Build a PHPUnit data provider (lands in the doc 09 test suite) covering:
+
+- nav with / without an existing `style` attribute (WP emits one when the nav has layout/colors)
+- each attribute family present and absent: toggle colors, hover colors, padding (flat + per-side), border (flat + per-side), radius (string + per-corner), dropdown styling set, submenu colors
+- `overlayMenu` values `never` / `mobile` / `always` (the `always` case must still short-circuit in `is_priority_nav_enabled()`, line 93)
+- preset values (`var:preset|spacing|30`) passing through `CSS_Converter::convert_preset_value()`
+- markup quirks: single-quoted attributes, entities in `aria-label`, another filter having already added attributes to the nav
+
+Snapshot the regex implementation's output for the matrix **before** the refactor, then assert the Tag Processor implementation matches (normalizing attribute order).
+
+## Risks
+
+- Subtle output diffs where the regex silently tolerated malformed input — the snapshot matrix is the mitigation; treat any diff as a decision point, not an auto-accept.
+- `WP_HTML_Tag_Processor::set_attribute()` escapes values; the regex path built raw strings. Verify style strings containing `var()` and semicolons round-trip identically.
+
+## Definition of done
+
+- [ ] No `preg_match` / `preg_replace` remains in `class-block-renderer.php`.
+- [ ] Snapshot parity suite green across the attribute matrix.
+- [ ] `docs/architecture.md` render-pipeline section updated.
diff --git a/planned-updates/03-enqueue-and-script-modules.md b/planned-updates/03-enqueue-and-script-modules.md
new file mode 100644
index 0000000..694b774
--- /dev/null
+++ b/planned-updates/03-enqueue-and-script-modules.md
@@ -0,0 +1,74 @@
+# 03 — Asset Loading: Enqueue Fix + Script Modules Migration
+
+| | |
+|---|---|
+| **Priority** | High |
+| **Effort** | 2–3 days total |
+| **Release** | Part 1: v1.2 · Part 2: v2.0 |
+| **Depends on** | Part 2: doc 01 (WP 6.8 floor) |
+| **Prerequisite for** | Part 2 is required by doc 05 |
+
+## Current state
+
+`classes/class-enqueues.php`:
+
+- `init()` (line 51) hooks only `enqueue_block_editor_assets`. There is **no frontend enqueue hook at all**.
+- `enqueue_frontend_assets()` (line 93) is invoked as a callback **from inside the `render_block` filter** (wired in `priority-plus-navigation.php`, passed into `Block_Renderer`'s constructor). This achieves conditional loading — assets only load when a Priority+ nav actually renders — but calls `wp_enqueue_script()`/`wp_enqueue_style()` mid-body render, long after `wp_enqueue_scripts` and `wp_head` have fired. The script lands in the footer (fine); the **stylesheet prints in the body** (technically invalid, causes FOUC risk, flagged by validators).
+- Everything is classic `wp_enqueue_script` UMD bundles, even though the source is authored as ES modules and webpack down-compiles them.
+
+Core's pattern for the same problem (`core/navigation`, Gutenberg `packages/block-library/src/navigation/index.php:914`): register assets early, then conditionally enqueue **the registered handle** from the render callback — `wp_enqueue_script_module( '@wordpress/block-library/navigation/view' )` gated on the block actually being interactive.
+
+## Part 1 (v1.2): register early, enqueue late
+
+1. Hook `init` or `wp_enqueue_scripts` to **register** (not enqueue) the frontend script and style with `wp_register_script` / `wp_register_style`, keeping the `.asset.php` dependency/version wiring from `Plugin_Paths::get_asset_meta()`.
+2. The render-time callback becomes `wp_enqueue_script( 'priority-plus-navigation' )` + `wp_enqueue_style( … )` on the pre-registered handles. Registered-then-late-enqueued scripts print reliably in the footer.
+3. For the stylesheet, two acceptable options — pick one and document it:
+   - **Accept body-printed style** (current behavior, now at least on a registered handle). Low effort, unchanged UX.
+   - **Enqueue on `wp_enqueue_scripts` when detectable**: `has_block( 'core/navigation' )` covers post content but **misses navs in template parts / block themes** — which is exactly why the render-time signal exists today. A hybrid (early enqueue when `has_block()` hits, render-time fallback otherwise) is defensible but adds a code path.
+   - Recommendation: keep render-time enqueue for both, on registered handles. Simplicity wins; the style is small.
+4. Keep the `$frontend_assets_enqueued` guard so multi-nav pages enqueue once.
+
+## Part 2 (v2.0): Script Modules API
+
+The plugin extends an existing core block and has **no block.json**, so the declarative `viewScriptModule` field is unavailable. That's fine — core/navigation itself doesn't use it either; it registers and conditionally enqueues its module in PHP. Mirror that exactly:
+
+1. On `init`:
+
+   ```php
+   wp_register_script_module(
+       'priority-plus-navigation/view',
+       $this->paths->get_url( 'build/view.js' ),
+       array( '@wordpress/interactivity' ),
+       $version
+   );
+   ```
+
+2. From the render filter (only when `is_priority_nav_enabled()`):
+
+   ```php
+   wp_enqueue_script_module( 'priority-plus-navigation/view' );
+   ```
+
+3. **Build output split** in `webpack.config.js`:
+   - `view` entry → ES module output importing `@wordpress/interactivity` as an external module (`import { store } from '@wordpress/interactivity'` stays a real import, resolved by WP's import map). With @wordpress/scripts 32.x this requires the `--experimental-modules` flag; the module build runs as a second compiler pass alongside the classic one.
+   - `priority-plus-nav-editor` entry → stays a classic script (`wp_enqueue_script`) since the editor bundle uses `wp.blocks`/`wp.blockEditor` globals.
+   - Note: `.asset.php` handling differs for module builds (dependencies include module specifiers); verify `Plugin_Paths::get_asset_meta()` reads the module asset file correctly.
+4. Delete the classic frontend registration once doc 05 phase 1 lands — the module replaces it entirely. Until then both paths can coexist behind the feature flag described in doc 05.
+
+## Benefits
+
+- Valid, predictable asset loading; no mid-render `wp_enqueue_style` side effects.
+- Modules are deferred by default — no render blocking, no `DOMContentLoaded` dance (doc 05 removes the listener).
+- Zero frontend JS on pages without a Priority+ nav (unchanged, but now on a supported pattern).
+- Shares WP's single `@wordpress/interactivity` runtime with core blocks instead of shipping bundled duplicates.
+
+## Risks
+
+- `--experimental-modules` is still flag-gated in @wordpress/scripts 32.x; pin the version and re-check when module builds stabilize (the flag's removal is the signal to simplify).
+- Module scripts don't exist on WP < 6.5 — Part 2 must not ship before the doc 01 version bump.
+
+## Definition of done
+
+- [ ] Part 1: no `wp_enqueue_*` call happens without a prior `wp_register_*` on an `init`/`wp_enqueue_scripts` hook; W3C validator no longer flags body styles (if the early-style option is chosen).
+- [ ] Part 2: frontend loads as `<script type="module">` via the import map; network tab shows `@wordpress/interactivity` loaded once, shared with core navigation.
+- [ ] Editor bundle unaffected.
diff --git a/planned-updates/04-single-source-design-tokens.md b/planned-updates/04-single-source-design-tokens.md
new file mode 100644
index 0000000..8078510
--- /dev/null
+++ b/planned-updates/04-single-source-design-tokens.md
@@ -0,0 +1,49 @@
+# 04 — Single Source of Truth for Design Tokens
+
+| | |
+|---|---|
+| **Priority** | Medium |
+| **Effort** | ~2 days |
+| **Release** | v2.0 (can ship earlier — it's non-breaking — but pairs naturally with 05/06) |
+| **Depends on** | — |
+| **Consumed by** | 06 (server-rendered dropdown reads PHP tokens) |
+
+## Current state: the same defaults live in three places
+
+1. **`src/tokens.js`** — the JS "source of truth" feeding attribute defaults in `src/variation/block.js`, reset values in `src/variation/controls.js`, and the dropdown-customizer modal.
+2. **Hard-coded PHP** in `classes/class-block-renderer.php` — e.g. the separator defaults `#dddddd / 1px / solid` around line 498 and the always-emitted submenu-color fallbacks (lines 528–540), plus `CSS_Converter::BORDER_DEFAULTS` duplicating the same `#dddddd / 1px / solid`.
+3. **SCSS fallbacks** in `src/styles/_variables.scss` — `:root` defaults for the `--wp--custom--priority-plus-navigation--dropdown--*` properties and `.is-style-priority-plus-navigation` defaults for the toggle properties.
+
+Any default change requires three coordinated edits, and drift has already happened (the readme's "Browse" vs. the code's "More" — doc 01 — is the visible symptom of no single source).
+
+## Proposed change
+
+Promote a canonical **`src/tokens.json`** and generate the other consumers at build time:
+
+```
+src/tokens.json  ──┬──> src/tokens.js            (thin re-export: import tokens from './tokens.json')
+                   ├──> build/tokens.php          (generated: <?php return array( … );)
+                   └──> src/styles/_tokens.scss   (generated SCSS map / custom-property defaults)
+```
+
+- **JS**: webpack imports JSON natively — `tokens.js` becomes `import tokens from './tokens.json'; export default tokens;` (or consumers import the JSON directly and `tokens.js` is deleted).
+- **PHP**: a small Node script (invoked from the `build`/`start` npm scripts, alongside the existing webpack run) emits `build/tokens.php` as a returned array. `Block_Renderer` and `CSS_Converter` `include` it once (memoized in `Plugin_Paths` or a static) and read defaults from it instead of inline literals. Keep the generated file out of git but **in the plugin zip** (`npm run plugin-zip` already ships `build/`).
+- **SCSS**: the same script emits `_tokens.scss` (custom-property declarations or an SCSS map) that `_variables.scss` imports; hand-written fallback blocks are deleted.
+- Token shape stays what `tokens.js` already defines (`toggle`, `dropdown.item`, `dropdown.submenu` groups) — this is a plumbing change, not a redesign.
+
+### Alternative considered and rejected
+
+Reading defaults from server-registered block attributes (see doc 09) would cover PHP but not SCSS, and attribute defaults themselves need a source — the JSON file is upstream of both.
+
+## Constraints
+
+- **Do not rename any emitted CSS custom property.** The property names are a public theming contract (see README risks). This doc changes where defaults come from, not what they're called.
+- Generated files must be reproducible: the generator runs in `build` and `start`, and CI (doc 09) fails if `build/tokens.php` is stale relative to `tokens.json`.
+- Doc 06's server-rendered dropdown must take its default labels/values from `build/tokens.php` — flag this in its implementation, not fresh literals.
+
+## Definition of done
+
+- [ ] `grep -rn '#dddddd' classes/` returns nothing; all PHP defaults come from the generated file.
+- [ ] `_variables.scss` contains no hand-maintained default values duplicated from tokens.
+- [ ] Changing one value in `tokens.json` and rebuilding updates editor defaults, frontend inline styles, and SCSS fallbacks together (manual spot check + one automated test in the doc 09 suite).
+- [ ] `docs/styling.md` updated to point at `tokens.json` as the source of truth.
diff --git a/planned-updates/05-interactivity-api-migration.md b/planned-updates/05-interactivity-api-migration.md
new file mode 100644
index 0000000..098eb43
--- /dev/null
+++ b/planned-updates/05-interactivity-api-migration.md
@@ -0,0 +1,82 @@
+# 05 — Interactivity API Migration: Evaluation, Verdict, and Phased Plan
+
+| | |
+|---|---|
+| **Priority** | High (strategic centerpiece) |
+| **Effort** | 1.5–2 weeks across phases |
+| **Release** | v2.0 |
+| **Depends on** | 01 (WP 6.8), 02 (Tag Processor), 03 part 2 (Script Modules) |
+| **Enables** | 06 (server-rendered dropdown), 08 (a11y final form) |
+
+## The question
+
+Is there a real gain in refactoring the frontend to the Interactivity API, or would it be modernization for its own sake? Short answer: **yes, adopt it — but for specific, nameable reasons, and with one permanent caveat.** This doc is the honest ledger.
+
+## What the Interactivity API does NOT fix
+
+The Priority+ pattern is inherently **imperative measurement**: observe the nav's size, measure item widths, greedily compute how many fit. That's `ResizeObserver` + arithmetic (`src/layout/width-calculator.js`, `PriorityNav.checkOverflow()`), and no directive makes it declarative. No core block's `view.js` does measure-and-collapse — there is no in-core precedent to copy for this part. After the migration, the measurement kernel survives nearly unchanged, hosted inside a `data-wp-init` callback (`callbacks.init` attaching the ResizeObserver via `getElement().ref`, returning a disconnect function as cleanup). Anyone expecting the API to absorb the width math will be disappointed; it won't.
+
+What it does give that kernel: a real lifecycle. The current `PriorityNav.destroy()` (`src/core/PriorityNav.js:609`) is dead code — nothing ever calls it, instances leak observers on DOM removal. `data-wp-init` cleanup returns fix that structurally.
+
+## What it genuinely replaces (ranked by value)
+
+1. **Client-side dropdown rebuilding — the biggest win.** Today `src/dom/dom-extractor.js` scrapes the live DOM and `src/dom/dom-builder.js` regenerates the More-dropdown's innerHTML (hand-rolled `escapeHtml`, recursive accordion markup) **on every overflow change**. With the API, the dropdown is rendered **once, server-side** (doc 06), and the client only flips a `visibleCount` number in context; `data-wp-class` bindings do the rest. Deletes two modules, the escaping utility, rebuild-induced focus loss, and the SSR/hydration mismatch. This alone justifies the migration.
+2. **The config channel.** The regex/Tag-Processor-injected `data-more-label` / `data-overlay-menu` / `data-mobile-collapse` attributes become one structured context object emitted with `wp_interactivity_data_wp_context()` and set on the nav via the doc 02 Tag Processor pass:
+
+   ```php
+   $processor->set_attribute( 'data-wp-interactive', 'priority-plus-navigation' );
+   $processor->set_attribute( 'data-wp-context', wp_interactivity_data_wp_context( array(
+       'moreLabel'      => $attributes['more_label'],
+       'overlayMenu'    => $attributes['overlay_menu'],
+       'mobileCollapse' => $attributes['mobile_collapse'],
+       'visibleCount'   => PHP_INT_MAX,
+       'isOpen'         => false,
+   ) ) );
+   ```
+
+   CSS custom properties stay in `style` — they're styling, not state.
+3. **Event and ARIA wiring.** `src/events/event-handlers.js` (document-capture click-outside, document Escape listener) and `src/events/accordion-handler.js` (manual `aria-expanded`/`aria-hidden` + inline `!important` styles) map directly onto directives, matching core/navigation's own store shape:
+   - More button: `data-wp-on--click="actions.toggleDropdown"`, `data-wp-bind--aria-expanded="context.isOpen"`
+   - Escape/keyboard: `data-wp-on--keydown="actions.handleKeydown"` wrapped in **`withSyncEvent`** (required for `event.preventDefault()`/`stopPropagation` in current versions)
+   - Click-outside: `data-wp-on-document--click` (or core's focusout pattern)
+   - Accordions: per-item `data-wp-context` + `data-wp-class--is-open`, no inline style forcing
+4. **Bootstrapping.** The `DOMContentLoaded` scan in `src/priority-plus-navigation.js`, the `data-priority-nav-initialized` double-init guard, and the instance counter all disappear — `data-wp-interactive` regions self-initialize per element, modules are deferred by default, and conditional module enqueue (doc 03) means zero JS where the block isn't used. Bonus: compatibility with client-side navigation/router regions comes for free.
+
+## The permanent caveat: core's store is locked
+
+Core registers `store( 'core/navigation', …, { lock: true } )` (Gutenberg `packages/block-library/src/navigation/view.js`). Third-party code **cannot** read `state.isMenuOpen` or subscribe to core's overlay state — the lock throws. So the current hamburger detection (`MutationObserver` watching the responsive container's `is-menu-open`/`has-modal-open` classes, `PriorityNav.setupResponsiveObserver()` line 316) **must survive the migration** in some form.
+
+Treatment:
+
+- Isolate it as a single `src/view/core-nav-adapter.js` module, attached inside `data-wp-init`, disconnected in the cleanup return. It writes one boolean (`coreOverlayOpen`) into the plugin's own context; everything else reacts through normal bindings.
+- Evaluate in phase 3 whether pure CSS can replace it (e.g. suspend Priority+ layout under `.wp-block-navigation__responsive-container.is-menu-open` with CSS alone) — plausible but unproven; do not promise it.
+- Flag this as the migration's **version-fragile point**: core's class names are undocumented internals. The doc 09 e2e test must exercise the hamburger interplay on every WP release bump.
+
+## Costs
+
+| Cost | Assessment |
+|---|---|
+| WP 6.8+ floor | Real. Handled by doc 01's split-release policy (1.x line remains for WP 6.4–6.7). |
+| Dual build output (ESM view + classic editor) | Moderate, one-time (doc 03 part 2); `--experimental-modules` flag until wp-scripts stabilizes modules. |
+| Debuggability | Directives are harder to step through than plain listeners; mitigated by the store being small and the SSR preview tooling improving. Team learning curve is real but bounded. |
+| Editor preview | **Neutral** — the view module never runs in the editor; the React-based editor preview components (`more-button-preview.js`, `dropdown-preview.js`) are unaffected either way. |
+| HTML payload | Grows with the doc 06 duplicated dropdown (assessed there), plus context JSON on the nav. Minor. |
+
+## Verdict
+
+**Adopt — fully, but phased — in the plugin's own namespace: `store( 'priority-plus-navigation', … )`.** Never attempt to extend or unlock core's store.
+
+The frontend is exactly the shape the API was built for (state → class/aria bindings, event actions, server-rendered lists), the one imperative kernel fits cleanly in `data-wp-init`, and aligning with core/navigation's own architecture future-proofs the coexistence (both stores hydrate from the same server markup, share one runtime, and never fight over DOM). Rejecting adoption leaves the plugin on a bootstrap/rebuild architecture core has abandoned; stopping at partial adoption (context + events, keeping innerHTML rebuild) forfeits the biggest win and is acceptable only as the transitional phase 1 below, not as an end state.
+
+## Phased plan (each phase shippable)
+
+- **Phase 0 — prerequisites.** Docs 02 (Tag Processor) and 03 (enqueue fix + module registration). No behavior change; module registration can land dark behind the enable check.
+- **Phase 1 — hybrid store.** New `src/view.js` entry: `store( 'priority-plus-navigation', { state, actions, callbacks } )`. Config moves from bespoke `data-*` attributes to `data-wp-context` (set server-side via the doc 02 processor). Click-outside, Escape, More-toggle, and accordion aria move to directives. The ResizeObserver + width-calculator and the core-nav-adapter MutationObserver are hosted in `callbacks.init` with cleanup. **The innerHTML dropdown rebuild temporarily remains**, now triggered by a `data-wp-watch` on the computed overflow state. Delete: `src/priority-plus-navigation.js` bootstrap, `src/events/*`, the init guards.
+- **Phase 2 — server-rendered dropdown.** Doc 06. Delete `dom-extractor.js`, `dom-builder.js`, most of `html-utils.js`. A11y hardening (doc 08) completes here.
+- **Phase 3 — polish.** Evaluate the CSS-only core-nav adapter replacement; consider `getServerState()` needs (likely none — no client-side routing of nav config; record as N/A); delete the dead `destroy()` machinery; rewrite `docs/architecture.md` and `docs/how-it-works.md` for the new pipeline.
+
+## Definition of done (per phase gates)
+
+- [ ] Phase 1: all interaction behavior (open/close, Escape, click-outside, accordions, hamburger interplay, mobile collapse) passes the doc 09 e2e suite with the store-based wiring; no `addEventListener` outside `data-wp-init`-managed code.
+- [ ] Phase 2: doc 06 criteria; zero client-side HTML string construction remains in `src/`.
+- [ ] Phase 3: docs/ rewritten; adapter decision recorded here with the outcome.
diff --git a/planned-updates/06-server-rendered-dropdown.md b/planned-updates/06-server-rendered-dropdown.md
new file mode 100644
index 0000000..0df23f5
--- /dev/null
+++ b/planned-updates/06-server-rendered-dropdown.md
@@ -0,0 +1,70 @@
+# 06 — Server-Rendered Dropdown: Eliminate Client-Side DOM Building
+
+| | |
+|---|---|
+| **Priority** | High |
+| **Effort** | ~1 week |
+| **Release** | v2.0 (Interactivity phase 2) |
+| **Depends on** | 02 (Tag Processor), 05 phase 1 (store + context); consumes 04 (PHP tokens) |
+
+## Current state
+
+On every overflow change, the frontend rebuilds the More dropdown from scratch:
+
+- `src/dom/dom-extractor.js` — `extractNavItemData()` recursively scrapes labels/URLs/children out of the **live DOM** (cloning nodes, `:scope >` selectors to avoid submenu text contamination).
+- `src/dom/dom-builder.js` — `buildDropdownFromOverflow()` regenerates the dropdown `<ul>`'s **innerHTML** (recursive accordion markup, hand-rolled `escapeHtml` from `src/utils/html-utils.js`, literal `›` glyphs, fresh `id`/`aria-controls` counters each rebuild).
+- Overflowed originals are hidden with inline `display:none` plus a forced reflow (`PriorityNav.checkOverflow()`).
+
+Consequences: rebuild-induced focus loss (an open accordion vanishes under the user), duplicated escaping/security surface, markup that never matches what the server rendered (hydration mismatch by design), and two of the plugin's most complex modules existing solely to reconstruct information the server already had.
+
+## Proposed architecture
+
+Render the dropdown **once, server-side**, in the `render_block` filter; the client only updates a number.
+
+### Server side (in `Block_Renderer`, post-doc-02)
+
+1. Parse the rendered nav with **`WP_HTML_Processor`** (the tree-aware processor — right tool for extracting/duplicating `<li>` subtrees; fine at the WP 6.8 floor). Collect the top-level `.wp-block-navigation-item` list items.
+2. Append inside the nav: the More `<button>` (label/icon from attributes, defaults from doc 04's `build/tokens.php`) and a dropdown `<ul>` containing a **duplicate of every top-level item**, each rewritten for the dropdown context:
+   - item index `i` stamped as `data-wp-context='{"index": i}'`
+   - visibility binding: `data-wp-class--is-hidden="state.isItemInMain"` (hidden in dropdown when the item still fits in the main row)
+   - submenu items become the accordion structure (currently built in JS) — server-rendered, with `data-wp-bind--aria-expanded`, `data-wp-bind--aria-hidden`, `data-wp-on--click="actions.toggleAccordion"`, stable server-generated `id`/`aria-controls` pairs (use the block's anchor or a `wp_unique_id()` per nav)
+3. The **original** top-level items get the mirror binding: `data-wp-class--is-overflowed="state.isItemOverflowed"` (with `.is-overflowed { display: none }` in the stylesheet — replacing today's inline `display:none`).
+4. Derived state in the store compares `context.index` against `context.visibleCount`:
+
+   ```js
+   state: {
+       get isItemOverflowed() {
+           const { index, visibleCount } = getContext();
+           return index >= visibleCount;
+       },
+       get isItemInMain() { /* inverse */ },
+   }
+   ```
+
+5. The ResizeObserver kernel (doc 05) now does exactly one write per resize: `context.visibleCount = n`. All rendering falls out of bindings.
+
+### What gets deleted
+
+`src/dom/dom-extractor.js`, `src/dom/dom-builder.js`, most of `src/utils/html-utils.js` (`escapeHtml`, `extractLinkText`, `removeChildTextFromParent`), the rebuild scheduling in `PriorityNav`, and the forced-reflow hacks.
+
+## Details the implementation must get right
+
+- **Duplicate-content accessibility.** Every menu item now exists twice in the DOM. The hidden copy must be removed from the accessibility tree and tab order: `is-hidden`/`is-overflowed` styles must pair with `aria-hidden` + `inert` (bind via `data-wp-bind--inert` / `data-wp-bind--aria-hidden` on the same predicate, or set `visibility: hidden`/`display: none` which removes AT exposure inherently — prefer `display: none` for simplicity and document the choice). Keyboard users must never tab through invisible links. This is the doc 08 acceptance gate.
+- **The dropdown starts fully hidden**: initial context `visibleCount = PHP_INT_MAX` (all items in main row, dropdown items all hidden, More button `data-wp-class--is-hidden` when nothing overflows) so no-JS and pre-hydration render states are sane.
+- **Mobile collapse mode** (`mobileCollapse` + breakpoint) is just `visibleCount = 0` — no special markup path.
+- **Payload growth.** The menu ships twice. For typical menus (5–15 items) this is negligible; for very large mega-menus it doubles a large subtree. Flag in readme/docs; if it ever matters, a `priority_plus_navigation_render_dropdown` filter can let sites opt out per nav. Duplicated links are `aria-hidden`/inert and inside a `<nav>` already crawled once — no meaningful SEO effect.
+- **Styling contract.** The dropdown classes generated today by `dom-builder.js` are styled in `src/styles/style.scss` and potentially by themes. Keep the class names identical in the server-rendered markup; any structural change must be called out in v2.0 release notes.
+- **Interaction with core's own submenus**: duplicated items containing `wp-block-navigation-submenu` markup carry core's directives (`data-wp-interactive="core/navigation"`, injected by core before our filter runs at priority 10). Strip core's directive attributes from the duplicates with the Tag Processor so the copies belong solely to the plugin's namespace and don't double-register with core's store.
+
+## Risks
+
+- `WP_HTML_Processor` (vs. Tag Processor) has API constraints on tree manipulation; if extraction proves awkward, fall back to rendering duplicates from `$block['innerBlocks']` data instead of parsing HTML — decide during implementation, both are server-side.
+- Stable IDs across full-page caches: use deterministic per-nav ids, not `uniqid()`, so cached pages and hydration agree.
+
+## Definition of done
+
+- [ ] No innerHTML/string HTML construction remains in `src/`.
+- [ ] Resize across breakpoints updates visibility with **zero** DOM node creation/removal (verify with a MutationObserver in the e2e test).
+- [ ] Hidden copies are absent from the accessibility tree and tab order (doc 08 checklist).
+- [ ] Open accordion in the dropdown survives a window resize that doesn't change its visibility.
+- [ ] Snapshot tests cover the duplicated markup for flat and nested menus.
diff --git a/planned-updates/07-editor-controls-modernization.md b/planned-updates/07-editor-controls-modernization.md
new file mode 100644
index 0000000..23b4bec
--- /dev/null
+++ b/planned-updates/07-editor-controls-modernization.md
@@ -0,0 +1,72 @@
+# 07 — Editor Controls Modernization
+
+| | |
+|---|---|
+| **Priority** | Medium |
+| **Effort** | 2–3 days |
+| **Release** | v1.2 (independent, non-breaking) |
+| **Depends on** | — |
+
+## Current state
+
+`src/variation/controls.js` registers two `editor.BlockEdit` HOCs:
+
+1. **`addDisableAlwaysOption`** (line 37, filter priority 5) — after render, it reaches into the inspector with `document.querySelector('.block-editor-block-inspector … [data-value="always"]')` (line 58) to grey out the "Always" option of core's overlay-menu control. This DOM-poking depends on core's private inspector markup and silently breaks whenever the block-editor markup changes; it also fights React (core can re-render and undo the tweak).
+2. **`withPriorityPlusControls`** (line 85, priority 10) — the real controls. Uses:
+   - **`useSetting`** (lines 173, 176) — deprecated since WP 6.5 in favor of `useSettings` (plural, array signature).
+   - **Experimental imports** (lines 10–21): `__experimentalSpacingSizesControl`, `__experimentalBorderRadiusControl`, `__experimentalToolsPanel`, `__experimentalToolsPanelItem`, plus `BorderBoxControl`/`BoxControl` variants elsewhere in `variation/components/`.
+   - `.eslintrc.js` disables `@wordpress/no-unsafe-wp-apis` globally to permit all of the above.
+
+## Proposed changes
+
+### 1. Replace the inspector DOM-poking
+
+The intent: when the Priority+ variation is active, `overlayMenu: 'always'` is unsupported (the render filter bails on it, `class-block-renderer.php:93`). Options, in order of preference:
+
+- **Normalize instead of disable.** Delete the HOC. Keep (and rely on) the existing effect in `withPriorityPlusControls` that flips `always` → `mobile`, and surface a `Notice` in the inspector explaining why. Server-side, `is_priority_nav_enabled()` already treats `always` as disabled, so the invariant holds even if the attribute slips through. Zero private-API surface.
+- Alternatively, filter core's control via supported block-filter APIs — but core exposes no filter for the overlay control's options, which is precisely why the DOM hack exists. Don't chase this; normalization is the supported answer.
+
+### 2. Migrate `useSetting` → `useSettings`
+
+```js
+// before
+const spacingSizes = useSetting( 'spacing.spacingSizes' ) || [];
+const colors = useSetting( 'color.palette' ) || [];
+// after
+const [ spacingSizes = [], colors = [] ] = useSettings( 'spacing.spacingSizes', 'color.palette' );
+```
+
+Apply across `controls.js` and `variation/components/` (the dropdown-customizer modal also calls `useSetting` for typography presets).
+
+### 3. Audit every `__experimental*` import
+
+Produce a table in the PR: import → stable replacement or keep-with-justification. Known state as of Gutenberg 23.x / WP 6.8-6.9:
+
+| Import | Status |
+|---|---|
+| `__experimentalToolsPanel` / `ToolsPanelItem` | Still experimental but ubiquitous in core block UIs; keep, justify. |
+| `__experimentalSpacingSizesControl` | Still private/experimental (block-editor); keep or replace with `BoxControl` + preset units. |
+| `__experimentalBorderRadiusControl` | Still experimental; `BorderBoxControl` graduated in `@wordpress/components` — verify each at implementation time against the pinned WP version. |
+
+Then scope the eslint disable: remove the global `no-unsafe-wp-apis` off-switch and use per-line disables with the justification comment, so new unaudited experimental imports fail lint.
+
+### 4. Consolidate the HOCs
+
+After change 1 deletes `addDisableAlwaysOption`, a single HOC remains — fold its early-return guards so non-variation navigation blocks pay one cheap check.
+
+### 5. Small hygiene items
+
+- `more-button-preview.js` reads nav-item fonts via `getComputedStyle` on editor DOM — acceptable for a preview, but add a defensive fallback for when the selector misses (editor markup drift).
+- The typography-mirroring effect (copying core typography attrs into `priorityPlusTypography*`) should be checked for infinite-loop guards (`useEffect` deps) during this pass.
+
+## Risks
+
+- Removing the greyed-out "Always" option changes editor UX slightly (option selectable but auto-normalized + Notice). Call it out in the changelog; behavior on the frontend is unchanged.
+- Experimental-API graduation status must be re-verified against the actual WP minimum at implementation time — the table above is a snapshot.
+
+## Definition of done
+
+- [ ] No `document.querySelector` targeting editor internals anywhere in `src/variation/`.
+- [ ] No `useSetting` (singular) calls remain.
+- [ ] `.eslintrc.js` no longer globally disables `no-unsafe-wp-apis`; remaining experimental imports each carry a per-line disable + justification.
+- [ ] Variation controls render and persist correctly in the post editor and site editor (template part nav).
diff --git a/planned-updates/08-accessibility-hardening.md b/planned-updates/08-accessibility-hardening.md
new file mode 100644
index 0000000..57b31f4
--- /dev/null
+++ b/planned-updates/08-accessibility-hardening.md
@@ -0,0 +1,65 @@
+# 08 — Accessibility Hardening
+
+| | |
+|---|---|
+| **Priority** | Medium-High |
+| **Effort** | 2–3 days |
+| **Release** | Semantics fixes: v1.2 possible · final form: v2.0 (with 05/06) |
+| **Depends on** | Final form: 05, 06 |
+
+## Current state
+
+The frontend has genuine a11y plumbing (aria-expanded/aria-controls on accordions, Escape handling, click-outside) but several structural problems:
+
+1. **`role="menu"` on a list of links** (`src/dom/dom-builder.js`, `createMoreButton()` builds `<ul role="menu">`). WAI-ARIA `menu`/`menuitem` roles are for application-style menus with full arrow-key/typeahead keyboard contracts — which this dropdown doesn't (and shouldn't) implement. For site navigation, the correct pattern is a **disclosure**: `<button aria-expanded aria-controls>` + a plain `<ul>` of links. This matches core/navigation's submenu pattern exactly.
+2. **No focus return.** Closing the dropdown via Escape or click-outside leaves focus wherever it was (or drops it to `<body>` when the focused node is hidden). Escape-close should return focus to the More button.
+3. **No focus-loss handling on rebuild.** The innerHTML rebuild (doc 06's target) can destroy the focused element mid-interaction — solved structurally by doc 06, listed here for the test checklist.
+4. **`aria-hidden` + inline `!important` styles on accordions** (`src/events/accordion-handler.js`) — forcing `display/opacity/visibility/position` inline; should be class-driven.
+5. **Hidden overflow items** are `display:none`-inline; after doc 06 there will be duplicated items whose hidden copies must be fully out of the accessibility tree and tab order.
+6. **`destroy()` never runs** (`src/core/PriorityNav.js:609`) — observers/listeners leak when navs are removed from the DOM (relevant in client-side-navigation themes). Resolved structurally by doc 05's `data-wp-init` cleanup.
+7. Decorative glyphs: the accordion arrow is a literal `›` text node; the chevron SVG lacks `aria-hidden="true"` verification.
+
+## Proposed changes
+
+### Semantics (can ship in v1.2 within the current architecture)
+
+- Drop `role="menu"` / `role="menuitem"`; keep `<button aria-expanded aria-controls="…">` + plain `<ul>`/`<li>`/`<a>`. Update `src/styles/style.scss` selectors if any keyed off the roles.
+- `aria-haspopup`: remove or set to `true` only with the menu role gone (`aria-haspopup="menu"` would be wrong for a disclosure); plain disclosure buttons don't need it.
+- Mark all decorative icons `aria-hidden="true" focusable="false"`.
+
+### Focus management (final form with 05/06)
+
+- **Escape** closes the dropdown/accordions and returns focus to the More button (store action sets `context.isOpen = false` then focuses `getElement()`-captured button ref; mirror core/navigation's `previousFocus` handling).
+- **Click-outside** closes without stealing focus.
+- **No focus trap for the dropdown.** Core traps focus only for the modal overlay case; the More dropdown is a disclosure, not a modal — Tab should walk out of it naturally (and closing-on-focusout, core's `handleMenuFocusout` pattern, is the polish step).
+- If the plugin's overlay-menu mode ever presents modally, reuse core's conventions: `has-modal-open` class on `<html>` for CSS scroll lock, trap only then.
+
+### Hidden-content integrity (with doc 06)
+
+- Hidden duplicated items: `display: none` (removes from AT + tab order inherently) via the `is-hidden`/`is-overflowed` classes — no inline styles, no `!important`.
+- Verify no `aria-hidden="true"` element ever contains the active focus (WCAG 4.1.2 violation pattern).
+
+### Lifecycle
+
+- Delete `destroy()` and the manual listener bookkeeping once doc 05's `data-wp-init` cleanup return owns disconnection.
+
+## Acceptance criteria
+
+**Keyboard-only walkthrough (scripted in the doc 09 e2e suite):**
+
+- [ ] Tab reaches the More button; Enter/Space toggles it; `aria-expanded` reflects state.
+- [ ] Tab walks into the open dropdown through every visible link, then out the other side.
+- [ ] No hidden (overflowed/duplicated) link ever receives tab focus at any viewport width.
+- [ ] Escape inside the dropdown closes it and focus lands on the More button.
+- [ ] Accordion toggles operate with Enter/Space and update `aria-expanded`.
+- [ ] Hamburger (core overlay) open/close never strands focus in the Priority+ dropdown.
+
+**Screen-reader smoke checklist (manual, VoiceOver + one of NVDA/JAWS):**
+
+- [ ] More button announces name + expanded/collapsed state, and **not** "menu" application semantics.
+- [ ] Dropdown announces as a plain list of links; item count matches visible items only.
+- [ ] No double-announcement of menu items (doc 06 duplicates must be silent when hidden).
+
+**Automated:**
+
+- [ ] axe-core scan (via Playwright) reports no violations on the rendered nav in closed, open, overflowed, and mobile-collapsed states.
diff --git a/planned-updates/09-config-extensibility-and-qa.md b/planned-updates/09-config-extensibility-and-qa.md
new file mode 100644
index 0000000..329aa13
--- /dev/null
+++ b/planned-updates/09-config-extensibility-and-qa.md
@@ -0,0 +1,70 @@
+# 09 — Configuration Surface, Extensibility, and QA Scaffolding
+
+| | |
+|---|---|
+| **Priority** | Low (but the QA half should land **before** docs 05/06) |
+| **Effort** | 2–3 days |
+| **Release** | v1.2 |
+| **Depends on** | — |
+
+## Part A: configuration surface
+
+### Current state
+
+`src/config.js` hard-codes runtime behavior at compile time:
+
+```js
+moreLabel: 'More',      // line 7 — overridable per-block via attribute
+gap: 8,                 // line 8 — item gap assumption used in width math
+mobileBreakpoint: 600,  // line 9 — mobile-collapse threshold
+```
+
+`gap` and `mobileBreakpoint` are not filterable, not attributes, and not derivable from the theme — a theme with different nav spacing gets silently wrong overflow math, and 600px may not match the theme's own breakpoints.
+
+### Proposed change
+
+Decide per value:
+
+| Value | Recommendation |
+|---|---|
+| `gap` | **Measure it** instead of configuring it: read the computed `column-gap`/`gap` of the list in the width calculator (one `getComputedStyle` call at measure time). Falls back to the token default. Removes the config knob entirely. |
+| `mobileBreakpoint` | **Block attribute** (`priorityPlusMobileBreakpoint`, number, default 600) with an inspector control next to the existing mobile-collapse toggle — site builders differ on breakpoints per nav, so per-block beats global. |
+| `moreLabel` icon SVG | PHP filter (`priority_plus_navigation_more_icon`) for swapping the chevron without forking. |
+
+Plus a general server-side filter for the whole config array before it's emitted into `data-wp-context` (post-doc-05):
+
+```php
+$context = apply_filters( 'priority_plus_navigation_context', $context, $block );
+```
+
+### Server-side attribute registration
+
+The ~28 `priorityPlus*` attributes exist only in the JS `blocks.registerBlockType` filter (`src/variation/block.js:46`); PHP reads raw `$block['attrs']` with hand-maintained defaults in `Block_Renderer::collect_attributes()` (line 147). Register them server-side too, via the `block_type_metadata_settings` (or `register_block_type_args`) filter on `core/navigation`, sourcing defaults from doc 04's generated `build/tokens.php`. Benefits: typed defaults in one place, `collect_attributes()` shrinks to a merge, and REST/`get_block_type` consumers see the real schema. Low urgency — it's an internal-consistency win, not user-facing.
+
+## Part B: QA scaffolding
+
+### Current state
+
+Zero automated tests. The CI workflow (`.github/workflows/build.yml`) builds only. Docs 02, 05, and 06 all lean on test suites that don't exist yet — **this is why Part B should land first** despite the doc's Low priority.
+
+### Proposed scaffolding
+
+1. **PHPUnit** (`composer require --dev yoast/phpunit-polyfills`, `wp-env`'s phpunit container or `wp-phpunit`):
+   - `Block_Renderer` output snapshots — the doc 02 parity matrix lives here (attribute combinations × markup variants).
+   - `CSS_Converter` unit tests (preset conversion, border/padding shorthand collapse) — pure functions, trivial to cover.
+2. **End-to-end** via `wp-env` + Playwright (`@wordpress/e2e-test-utils-playwright`), or WordPress Playground (`@wp-playground/cli` with a blueprint auto-mounting the plugin) if a lighter setup is preferred:
+   - Fixture: a nav menu with enough items to overflow, including one submenu.
+   - Scenarios at multiple viewport widths (wide / medium / narrow / mobile-collapse): correct item counts in main row vs. dropdown; dropdown open/close via mouse and keyboard; Escape and click-outside; hamburger (core overlay) interplay — the canary for the core-internals dependency flagged in doc 05; accordion toggling inside the dropdown.
+   - The doc 08 keyboard walkthrough and axe-core scan run in the same suite.
+3. **CI**: extend the existing GitHub workflow with jobs for `phpcs`, `lint:js`, `lint:css`, PHPUnit, Playwright (Playwright can run against `wp-env` in CI), plus the doc 04 generated-tokens freshness check.
+
+### Sequencing note
+
+Land order within v1.2: Part B first → doc 02 (uses the snapshot suite) → everything else. The e2e suite is the regression net that makes the v2.0 rewrite (docs 05/06) safe to ship.
+
+## Definition of done
+
+- [ ] `gap` measured at runtime; `mobileBreakpoint` attribute + control; icon and context filters documented in `docs/`.
+- [ ] `priorityPlus*` attributes registered server-side with defaults from generated tokens.
+- [ ] `npm test` (or `composer test` + `npm run test:e2e`) runs the full suite locally and in CI.
+- [ ] CI is red if generated tokens are stale, lint fails, or any snapshot/e2e scenario regresses.
diff --git a/planned-updates/README.md b/planned-updates/README.md
new file mode 100644
index 0000000..8f21e86
--- /dev/null
+++ b/planned-updates/README.md
@@ -0,0 +1,84 @@
+# Planned Updates: Gutenberg Alignment & Interactivity API Migration
+
+This folder contains the modernization plan for Priority Plus Navigation. The goal is to move the plugin from its WP 6.0-era architecture — regex-based HTML rewriting, classic script enqueues, and an imperative vanilla-JS frontend that rebuilds DOM at runtime — to the patterns WordPress core itself now uses, with `core/navigation` in WP 6.9 / Gutenberg 23.x as the reference implementation: `WP_HTML_Tag_Processor` for server-side markup manipulation, the Script Modules API for asset loading, and the Interactivity API for frontend behavior.
+
+## The most important thing to know first
+
+**None of these changes touch saved content.** All `priorityPlus*` attributes live inside the `core/navigation` block's comment delimiters in posts and templates, and everything the plugin adds to the frontend markup is generated at render time by a `render_block` filter. Changing how that output is generated requires **no block deprecations, no migrations, and no changes to existing sites' stored content**. The risk surface is rendered-output parity, not data.
+
+## Documents
+
+| Doc | Title | Priority | Effort | Release | Depends on |
+|-----|-------|----------|--------|---------|------------|
+| [01](01-platform-baseline.md) | Platform baseline: requirements, metadata, tooling | High | 0.5–1 day | v1.2 (readme fixes) / v2.0 (version bumps) | — |
+| [02](02-tag-processor-refactor.md) | Replace regex HTML rewriting with `WP_HTML_Tag_Processor` | High | 2–3 days | v1.2 | — |
+| [03](03-enqueue-and-script-modules.md) | Asset loading: enqueue fix + Script Modules migration | High | 2–3 days | Part 1: v1.2 / Part 2: v2.0 | Part 2: 01 |
+| [04](04-single-source-design-tokens.md) | Single source of truth for design tokens | Medium | 2 days | v2.0 | — |
+| [05](05-interactivity-api-migration.md) | **Interactivity API migration (evaluation + verdict + phases)** | High | 1.5–2 weeks | v2.0 | 01, 02, 03.2 |
+| [06](06-server-rendered-dropdown.md) | Server-rendered dropdown (eliminate client DOM building) | High | 1 week | v2.0 | 02, 05; consumes 04 |
+| [07](07-editor-controls-modernization.md) | Editor controls modernization | Medium | 2–3 days | v1.2 | — |
+| [08](08-accessibility-hardening.md) | Accessibility hardening | Medium-High | 2–3 days | Partial v1.2, final v2.0 | Final form: 05, 06 |
+| [09](09-config-extensibility-and-qa.md) | Config surface, extensibility, and QA scaffolding | Low | 2–3 days | v1.2 | — (QA should land before 05/06) |
+
+## Dependency graph
+
+```mermaid
+graph TD
+    A01["01 Platform baseline<br/>(WP 6.8 / PHP 8.0 bump)"]
+    A02["02 Tag Processor refactor"]
+    A031["03.1 Enqueue fix"]
+    A032["03.2 Script Modules"]
+    A04["04 Token unification"]
+    A05["05 Interactivity API<br/>(phase 1: hybrid store)"]
+    A06["06 Server-rendered dropdown"]
+    A07["07 Editor controls"]
+    A08["08 A11y hardening (final)"]
+    A09["09 Config & QA"]
+
+    A01 --> A032
+    A02 --> A05
+    A032 --> A05
+    A01 --> A05
+    A05 --> A06
+    A02 --> A06
+    A04 -.consumed by.-> A06
+    A05 --> A08
+    A06 --> A08
+    A09 -.safety net before.-> A05
+```
+
+Docs 02, 03.1, 07, and 09 are independent and non-breaking — they can ship anytime. Docs 04, 05, 06, and 08 (final form) are the v2.0 train.
+
+## Release mapping
+
+### v1.2 — non-breaking maintenance release (keeps WP 6.0* support)
+
+- **01** (readme.txt corrections only — headers, "Browse"/"More" fix)
+- **02** Tag Processor refactor (output-identical, snapshot-tested)
+- **03 part 1** Enqueue registration fix
+- **07** Editor controls hygiene
+- **09** QA scaffolding (PHPUnit + e2e) — this is the safety net for v2.0
+
+\* Note: the code already calls `wp_trigger_error()` (WP 6.4+) in the bootstrap, so the declared 6.0 minimum is inaccurate today. v1.2 should honestly declare 6.4 unless that call is guarded.
+
+### v2.0 — WP 6.8+ / PHP 8.0+, Interactivity API
+
+- **01** version bumps (Requires at least: 6.8, Requires PHP: 8.0)
+- **03 part 2** Script Modules migration
+- **04** Token unification
+- **05** Interactivity API migration (phased)
+- **06** Server-rendered dropdown
+- **08** Accessibility hardening (final form)
+
+Sites on WP 6.4–6.7 stay on the 1.x line; readme.txt and the WP.org changelog should state this support policy explicitly.
+
+## Cross-cutting risks
+
+1. **Public contracts to keep byte-stable through v2.0:** the `is-style-priority-plus-navigation` class, the CSS custom property names (`--priority-plus-navigation--*` and `--wp--custom--priority-plus-navigation--dropdown--*`), and the generated dropdown class names styled in `src/styles/style.scss`. These are the de-facto API for theme authors.
+2. **`data-*` attribute contract change (v2.0):** `data-more-label`, `data-overlay-menu`, and `data-mobile-collapse` on the `<nav>` are replaced by a single `data-wp-context` in doc 05. Unlikely to have third-party consumers, but list it as breaking in v2.0 release notes.
+3. **Core navigation internals dependency:** the plugin detects core's hamburger overlay state by observing undocumented classes (`is-menu-open`, `has-modal-open`). Core's Interactivity store is locked, so there is no supported alternative (see doc 05). Isolate the dependency and re-verify each WP release with the e2e test from doc 09.
+4. **Regex → Tag Processor parity:** subtle differences (attribute ordering, entity handling, malformed markup tolerance) are mitigated by the snapshot test matrix in doc 02.
+
+## Relationship to existing docs
+
+`docs/architecture.md`, `docs/how-it-works.md`, and `docs/styling.md` describe the **current** state and remain authoritative until plans land. Each planned-updates doc lists which of those files it obsoletes or amends; updating them is part of each change's definition of done.

From 6e4d553666694a81d4816e72bfa132552d8378b9 Mon Sep 17 00:00:00 2001
From: Troy Chaplin <troy.chaplin@gmail.com>
Date: Wed, 15 Jul 2026 16:51:37 -0300
Subject: [PATCH 2/6] Replace regex nav-tag rewriting with
 WP_HTML_Tag_Processor

Aligns the render_block filter with core navigation's own pattern for
injecting attributes into rendered markup. Output verified identical to
the regex implementation across an 18-case attribute matrix on WP 7.0.1
(attribute order normalized). Also notes the current staged scope in
planned-updates/README.md.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 classes/class-block-renderer.php | 70 ++++++++++++++++----------------
 planned-updates/README.md        |  8 ++++
 2 files changed, 44 insertions(+), 34 deletions(-)

diff --git a/classes/class-block-renderer.php b/classes/class-block-renderer.php
index 7e52b0c..c8cb7f3 100644
--- a/classes/class-block-renderer.php
+++ b/classes/class-block-renderer.php
@@ -186,6 +186,9 @@ private function collect_attributes( array $block ): array {
 	/**
 	 * Inject Priority+ data attributes into the navigation element.
 	 *
+	 * Uses WP_HTML_Tag_Processor to modify the opening nav tag, mirroring how
+	 * core injects directives into rendered navigation markup.
+	 *
 	 * @param string $block_content The block HTML content.
 	 * @param array  $attributes    Collected attributes array.
 	 * @return string Modified block content with data attributes.
@@ -195,45 +198,47 @@ private function inject_priority_attributes( string $block_content, array $attri
 			return $block_content;
 		}
 
-		// Match the opening <nav> tag with wp-block-navigation class.
-		$pattern = '/(<nav[^>]*\bclass="[^"]*wp-block-navigation[^"]*")/i';
+		$processor = new \WP_HTML_Tag_Processor( $block_content );
 
-		// Build style parts array.
-		$style_parts = $this->build_style_parts( $block_content, $attributes );
+		if ( ! $processor->next_tag(
+			array(
+				'tag_name'   => 'NAV',
+				'class_name' => 'wp-block-navigation',
+			)
+		) ) {
+			return $block_content;
+		}
 
-		// Build data attributes string.
-		$data_attributes = sprintf(
-			'$1 data-more-label="%s" data-more-icon="%s" data-overlay-menu="%s" data-mobile-collapse="%s"',
-			esc_attr( $attributes['toggle_label'] ),
-			esc_attr( $attributes['toggle_icon'] ),
-			esc_attr( $attributes['overlay_menu'] ),
-			$attributes['mobile_collapse'] ? 'true' : 'false'
+		$existing_style = $processor->get_attribute( 'style' );
+		$style_parts    = $this->build_style_parts(
+			is_string( $existing_style ) ? $existing_style : '',
+			$attributes
 		);
 
-		// Add style attribute if we have any styles.
+		$processor->set_attribute( 'data-more-label', $attributes['toggle_label'] );
+		$processor->set_attribute( 'data-more-icon', $attributes['toggle_icon'] );
+		$processor->set_attribute( 'data-overlay-menu', $attributes['overlay_menu'] );
+		$processor->set_attribute( 'data-mobile-collapse', $attributes['mobile_collapse'] ? 'true' : 'false' );
+
 		if ( ! empty( $style_parts ) ) {
-			$style_attr       = implode( '; ', $style_parts );
-			$data_attributes .= ' style="' . $style_attr . ';"';
+			$processor->set_attribute( 'style', implode( '; ', $style_parts ) . ';' );
 		}
 
-		// Remove existing style attribute from the nav tag if it exists.
-		$block_content = preg_replace( '/(<nav[^>]*?)\s+style="[^"]*"([^>]*?>)/i', '$1$2', $block_content, 1 );
-
-		return preg_replace( $pattern, $data_attributes, $block_content, 1 );
+		return $processor->get_updated_html();
 	}
 
 	/**
 	 * Build array of CSS style declarations.
 	 *
-	 * @param string $block_content Original block content (to preserve existing styles).
-	 * @param array  $attributes    Collected attributes.
+	 * @param string $existing_style Existing inline style attribute value on the nav element.
+	 * @param array  $attributes     Collected attributes.
 	 * @return array Array of CSS style declarations.
 	 */
-	private function build_style_parts( string $block_content, array $attributes ): array {
+	private function build_style_parts( string $existing_style, array $attributes ): array {
 		$style_parts = array();
 
 		// First, preserve WordPress's existing inline styles (typography, etc.).
-		$style_parts = $this->preserve_existing_styles( $block_content, $style_parts );
+		$style_parts = $this->preserve_existing_styles( $existing_style, $style_parts );
 
 		// Add toggle button styles.
 		$style_parts = $this->add_toggle_styles( $attributes, $style_parts );
@@ -245,21 +250,18 @@ private function build_style_parts( string $block_content, array $attributes ):
 	}
 
 	/**
-	 * Preserve existing inline styles from the block content.
+	 * Preserve existing inline style declarations.
 	 *
-	 * @param string $block_content Block HTML content.
-	 * @param array  $style_parts   Current style parts array.
+	 * @param string $existing_style Existing inline style attribute value.
+	 * @param array  $style_parts    Current style parts array.
 	 * @return array Updated style parts array.
 	 */
-	private function preserve_existing_styles( string $block_content, array $style_parts ): array {
-		if ( preg_match( '/<nav[^>]*\bstyle="([^"]*)"/i', $block_content, $style_matches ) ) {
-			$existing_style     = $style_matches[1];
-			$style_declarations = explode( ';', $existing_style );
-			foreach ( $style_declarations as $declaration ) {
-				$declaration = trim( $declaration );
-				if ( ! empty( $declaration ) ) {
-					$style_parts[] = $declaration;
-				}
+	private function preserve_existing_styles( string $existing_style, array $style_parts ): array {
+		$style_declarations = explode( ';', $existing_style );
+		foreach ( $style_declarations as $declaration ) {
+			$declaration = trim( $declaration );
+			if ( ! empty( $declaration ) ) {
+				$style_parts[] = $declaration;
 			}
 		}
 		return $style_parts;
diff --git a/planned-updates/README.md b/planned-updates/README.md
index 8f21e86..27c84da 100644
--- a/planned-updates/README.md
+++ b/planned-updates/README.md
@@ -1,5 +1,13 @@
 # Planned Updates: Gutenberg Alignment & Interactivity API Migration
 
+> **Current staged scope (July 2026):** work in progress is limited to code-level Gutenberg
+> alignment and an Interactivity API exploration, in small reviewable stages:
+> **A** — Tag Processor refactor (doc 02); **B** — enqueue registration fix (doc 03 part 1);
+> **C** — editor API alignment on the existing toolchain (doc 07, minus eslint-config changes);
+> **D** — a throwaway Interactivity API spike feeding findings back into doc 05.
+> Build-tool upgrades (wp-scripts 32, Node, eslint flat config), test infrastructure (doc 09),
+> and version-metadata bumps (doc 01) are deferred until explicitly scheduled.
+
 This folder contains the modernization plan for Priority Plus Navigation. The goal is to move the plugin from its WP 6.0-era architecture — regex-based HTML rewriting, classic script enqueues, and an imperative vanilla-JS frontend that rebuilds DOM at runtime — to the patterns WordPress core itself now uses, with `core/navigation` in WP 6.9 / Gutenberg 23.x as the reference implementation: `WP_HTML_Tag_Processor` for server-side markup manipulation, the Script Modules API for asset loading, and the Interactivity API for frontend behavior.
 
 ## The most important thing to know first

From 2ad5a2aaba176c464164020a5b0c84f4debf48f4 Mon Sep 17 00:00:00 2001
From: Troy Chaplin <troy.chaplin@gmail.com>
Date: Wed, 15 Jul 2026 18:07:15 -0300
Subject: [PATCH 3/6] updated enqueues

---
 classes/class-enqueues.php | 67 ++++++++++++++++++++++++++++----------
 1 file changed, 50 insertions(+), 17 deletions(-)

diff --git a/classes/class-enqueues.php b/classes/class-enqueues.php
index e7aca98..479a0fc 100644
--- a/classes/class-enqueues.php
+++ b/classes/class-enqueues.php
@@ -50,6 +50,45 @@ public function __construct( string $build_path ) {
 	 */
 	public function init() {
 		add_action( 'enqueue_block_editor_assets', array( $this, 'enqueue_editor_assets' ) );
+		add_action( 'wp_enqueue_scripts', array( $this, 'register_frontend_assets' ) );
+	}
+
+	/**
+	 * Register (without enqueueing) the frontend script and style.
+	 *
+	 * Registration happens on wp_enqueue_scripts so the handles exist early;
+	 * the actual enqueue is deferred to render time (via Block_Renderer) so
+	 * assets only load on pages that render a Priority+ navigation.
+	 *
+	 * @return void
+	 */
+	public function register_frontend_assets(): void {
+		if ( wp_script_is( 'priority-plus-navigation', 'registered' ) ) {
+			return;
+		}
+
+		$asset_meta = $this->build_dir->get_asset_meta( 'priority-plus-navigation.js' );
+		if ( ! $asset_meta ) {
+			return;
+		}
+
+		wp_register_script(
+			'priority-plus-navigation',
+			$this->build_dir->get_url( 'priority-plus-navigation.js' ),
+			$asset_meta['dependencies'],
+			$asset_meta['version'],
+			true
+		);
+
+		$style_path = $this->build_dir->get_path( 'style-priority-plus-navigation.css' );
+		if ( file_exists( $style_path ) ) {
+			wp_register_style(
+				'priority-plus-navigation',
+				$this->build_dir->get_url( 'style-priority-plus-navigation.css' ),
+				array(),
+				$asset_meta['version']
+			);
+		}
 	}
 
 	/**
@@ -88,6 +127,10 @@ public function enqueue_editor_assets(): void {
 	 * Enqueue Priority+ frontend script and styles (only once).
 	 * Called from Block_Renderer when a Priority+ block is rendered.
 	 *
+	 * Only the pre-registered handles are enqueued here; registering happens
+	 * on wp_enqueue_scripts (with a fallback registration for render contexts
+	 * where that hook never fired, e.g. REST block rendering).
+	 *
 	 * @return void
 	 */
 	public function enqueue_frontend_assets(): void {
@@ -95,29 +138,19 @@ public function enqueue_frontend_assets(): void {
 			return;
 		}
 
-		$asset_meta = $this->build_dir->get_asset_meta( 'priority-plus-navigation.js' );
-		if ( ! $asset_meta ) {
+		// Fallback for contexts where wp_enqueue_scripts did not run.
+		$this->register_frontend_assets();
+
+		if ( ! wp_script_is( 'priority-plus-navigation', 'registered' ) ) {
 			return;
 		}
 
 		$this->frontend_assets_enqueued = true;
 
-		wp_enqueue_script(
-			'priority-plus-navigation',
-			$this->build_dir->get_url( 'priority-plus-navigation.js' ),
-			$asset_meta['dependencies'],
-			$asset_meta['version'],
-			true
-		);
+		wp_enqueue_script( 'priority-plus-navigation' );
 
-		$style_path = $this->build_dir->get_path( 'style-priority-plus-navigation.css' );
-		if ( file_exists( $style_path ) ) {
-			wp_enqueue_style(
-				'priority-plus-navigation',
-				$this->build_dir->get_url( 'style-priority-plus-navigation.css' ),
-				array(),
-				$asset_meta['version']
-			);
+		if ( wp_style_is( 'priority-plus-navigation', 'registered' ) ) {
+			wp_enqueue_style( 'priority-plus-navigation' );
 		}
 	}
 }

From 11e5d9ceefd08e303db1439f5c3c8e3fd153321b Mon Sep 17 00:00:00 2001
From: Troy Chaplin <troy.chaplin@gmail.com>
Date: Wed, 15 Jul 2026 21:05:20 -0300
Subject: [PATCH 4/6] update panel and style options

---
 build/priority-plus-nav-editor.asset.php      |  2 +-
 build/priority-plus-nav-editor.js             |  2 +-
 readme.txt                                    |  2 +-
 .../components/dropdown-customizer-modal.js   | 14 ++--
 .../components/panels/menu-items-panel.js     |  6 +-
 .../components/panels/menu-styles-panel.js    | 12 +--
 src/variation/controls.js                     | 75 +++----------------
 7 files changed, 32 insertions(+), 81 deletions(-)

diff --git a/build/priority-plus-nav-editor.asset.php b/build/priority-plus-nav-editor.asset.php
index 96e9535..1464926 100644
--- a/build/priority-plus-nav-editor.asset.php
+++ b/build/priority-plus-nav-editor.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-hooks', 'wp-i18n', 'wp-primitives'), 'version' => 'b305fc15ec1f3200a37a');
+<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-hooks', 'wp-i18n', 'wp-primitives'), 'version' => '72b3d6e346fd1838fcc9');
diff --git a/build/priority-plus-nav-editor.js b/build/priority-plus-nav-editor.js
index 480e1e5..63eb4cc 100644
--- a/build/priority-plus-nav-editor.js
+++ b/build/priority-plus-nav-editor.js
@@ -1 +1 @@
-(()=>{"use strict";const o=window.wp.i18n,e=window.wp.blocks,r=window.wp.primitives,t=window.ReactJSXRuntime;var i=(0,t.jsx)(r.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",children:(0,t.jsx)(r.Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M7.404 16.596a6.5 6.5 0 1 0 9.192-9.192 6.5 6.5 0 0 0-9.192 9.192ZM6.344 6.343a8 8 0 1 0 11.313 11.314A8 8 0 0 0 6.343 6.343Zm4.906 9.407v-3h-3v-1.5h3v-3h1.5v3h3v1.5h-3v3h-1.5Z"})});const n=window.wp.hooks,l={toggle:{border:{color:void 0,width:void 0,style:void 0},borderRadius:void 0},dropdown:{backgroundColor:"#ffffff",border:{color:"#dddddd",width:"1px",style:"solid"},borderRadius:"4px",boxShadow:"default",item:{padding:{top:"0.75rem",right:"1rem",bottom:"0.75rem",left:"1rem"},hoverBackground:"rgba(0, 0, 0, 0.05)",textColor:"#191919",hoverTextColor:"#191919",separator:{color:"#f0f0f0",width:"1px",style:"solid"}},submenu:{indent:"1.25rem",backgroundColor:"#ffffff",itemHoverBackground:"rgba(0, 0, 0, 0.05)",itemTextColor:"#191919",itemHoverTextColor:"#191919"}}};(0,e.registerBlockVariation)("core/navigation",{name:"priority-plus-navigation",title:(0,o.__)("Priority Plus Navigation","priority-plus-navigation"),description:(0,o.__)('A responsive navigation that automatically moves overflow items to a "More" dropdown.',"priority-plus-navigation"),icon:i,scope:["inserter","transform"],attributes:{className:"is-style-priority-plus-navigation",overlayMenu:"never",priorityPlusEnabled:!0,priorityPlusToggleLabel:"More",priorityPlusToggleBackgroundColor:void 0,priorityPlusToggleBackgroundColorHover:void 0,priorityPlusToggleTextColor:void 0,priorityPlusToggleTextColorHover:void 0},isActive:(o,e)=>o.className?.includes(e.className)}),(0,n.addFilter)("blocks.registerBlockType","priority-plus-navigation/extend-core-navigation",(o,e)=>"core/navigation"!==e?o:{...o,attributes:{...o.attributes,priorityPlusEnabled:{type:"boolean",default:!1},priorityPlusToggleLabel:{type:"string",default:"More"},priorityPlusToggleIcon:{type:"string",default:"none"},priorityPlusToggleBackgroundColor:{type:"string"},priorityPlusToggleBackgroundColorHover:{type:"string"},priorityPlusToggleTextColor:{type:"string"},priorityPlusToggleTextColorHover:{type:"string"},priorityPlusTogglePadding:{type:"object",default:void 0},priorityPlusToggleBorder:{type:"object",default:void 0},priorityPlusToggleBorderRadius:{type:["string","object"],default:void 0},priorityPlusMenuBackgroundColor:{type:"string",default:l.dropdown.backgroundColor},priorityPlusMenuBorder:{type:"object",default:l.dropdown.border},priorityPlusMenuBorderRadius:{type:["string","object"],default:l.dropdown.borderRadius},priorityPlusMenuBoxShadow:{type:"string",default:l.dropdown.boxShadow},priorityPlusMenuItemPadding:{type:"object",default:l.dropdown.item.padding},priorityPlusMenuItemHoverBackground:{type:"string",default:l.dropdown.item.hoverBackground},priorityPlusMenuItemTextColor:{type:"string",default:l.dropdown.item.textColor},priorityPlusMenuItemHoverTextColor:{type:"string",default:l.dropdown.item.hoverTextColor},priorityPlusMenuSubmenuIndent:{type:"string",default:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:{type:"object",default:l.dropdown.item.separator},priorityPlusSubmenuBackgroundColor:{type:"string",default:l.dropdown.submenu.backgroundColor},priorityPlusSubmenuItemHoverBackground:{type:"string",default:l.dropdown.submenu.itemHoverBackground},priorityPlusSubmenuItemTextColor:{type:"string",default:l.dropdown.submenu.itemTextColor},priorityPlusSubmenuItemHoverTextColor:{type:"string",default:l.dropdown.submenu.itemHoverTextColor},priorityPlusMobileCollapse:{type:"boolean",default:!0},priorityPlusTypographyFontFamily:{type:"string"},priorityPlusTypographyFontSize:{type:"string"},priorityPlusTypographyFontWeight:{type:"string"},priorityPlusTypographyFontStyle:{type:"string"}}});const s=window.wp.blockEditor,a=window.wp.components,u=window.wp.compose,p=window.wp.element,d=window.wp.data;function y(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const e=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(e)return`var(--wp--preset--${e[1]}--${e[2]})`}return o}const g=({attributes:e,wrapperRef:r,clientId:i})=>{const{priorityPlusToggleLabel:n,priorityPlusToggleBackgroundColor:l,priorityPlusToggleTextColor:a,priorityPlusTogglePadding:u,priorityPlusToggleBorder:g,priorityPlusToggleBorderRadius:c}=e,m=(0,p.useRef)(null),[b,h]=(0,p.useState)({}),{selectBlock:v}=(0,d.useDispatch)(s.store);(0,p.useEffect)(()=>{if(!r?.current)return;const o=()=>{const o=r.current.querySelector(".wp-block-navigation-item__content");if(!o)return;const e=window.getComputedStyle(o);h({fontSize:e.fontSize,fontFamily:e.fontFamily,fontWeight:e.fontWeight,fontStyle:e.fontStyle,lineHeight:e.lineHeight})};o();const e=setTimeout(o,200);return()=>clearTimeout(e)},[r,e.fontSize,e.fontFamily,e.style?.typography?.fontSize,e.style?.typography?.fontWeight,e.style?.typography?.fontStyle]);const w={display:"flex",alignItems:"center",gap:"0.25em",whiteSpace:"nowrap",cursor:"pointer",...function(o){if(!o)return{border:"none"};if(o.color||o.width||o.style)return{borderColor:o.color||void 0,borderWidth:o.width||void 0,borderStyle:o.style||void 0};const e={},r={top:"Top",right:"Right",bottom:"Bottom",left:"Left"};for(const[t,i]of Object.entries(r)){const r=o[t];r&&(r.color&&(e[`border${i}Color`]=r.color),r.width&&(e[`border${i}Width`]=r.width),r.style&&(e[`border${i}Style`]=r.style))}return Object.keys(e).length>0?e:{border:"none"}}(g),borderRadius:function(o){if(o){if("string"==typeof o)return o;if("object"==typeof o)return`${o.topLeft||"0"} ${o.topRight||"0"} ${o.bottomRight||"0"} ${o.bottomLeft||"0"}`}}(c),background:l||"transparent",color:a||"inherit",paddingTop:y(u?.top)||void 0,paddingRight:y(u?.right)||void 0,paddingBottom:y(u?.bottom)||void 0,paddingLeft:y(u?.left)||void 0,fontSize:b.fontSize||"inherit",fontFamily:b.fontFamily||"inherit",fontWeight:b.fontWeight||"inherit",fontStyle:b.fontStyle||"inherit",lineHeight:b.lineHeight||"inherit"};return(0,t.jsxs)("span",{ref:m,className:"priority-plus-navigation-editor-more-button",style:w,"aria-hidden":"true",role:"button",tabIndex:-1,onClick:()=>v(i),onKeyDown:o=>{"Enter"!==o.key&&" "!==o.key||v(i)},children:[(0,t.jsx)("span",{children:n||(0,o.__)("More","priority-plus-navigation")}),(0,t.jsx)("span",{style:{display:"inline-flex",alignItems:"center",marginRight:"-8px",lineHeight:1},children:(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"1.25em",height:"1.25em",fill:"currentColor","aria-hidden":"true",focusable:"false",children:(0,t.jsx)("path",{d:"M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 13.5l4.5-3.1.9 1.2z"})})})]})};function c(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const e=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(e)return`var(--wp--preset--${e[1]}--${e[2]})`}return o.startsWith("var("),o}function m(o){if(!o)return l.dropdown.borderRadius;if("string"==typeof o)return o;if("object"==typeof o){const{topLeft:e,topRight:r,bottomRight:t,bottomLeft:i}=o;return e===r&&r===t&&t===i&&e?e:`${e||"0"} ${r||"0"} ${t||"0"} ${i||"0"}`}return l.dropdown.borderRadius}function b(o){const e=`${l.dropdown.item.padding.top} ${l.dropdown.item.padding.right} ${l.dropdown.item.padding.bottom} ${l.dropdown.item.padding.left}`;if(!o)return e;if("string"==typeof o)return c(o);if("object"==typeof o){if(0===Object.keys(o).length)return e;const{top:r,right:t,bottom:i,left:n}=o;if(!(r&&""!==r&&"0"!==r||t&&""!==t&&"0"!==t||i&&""!==i&&"0"!==i||n&&""!==n&&"0"!==n))return e;const l=c(r)||"0",s=c(t)||"0",a=c(i)||"0",u=c(n)||"0";return l===s&&s===a&&a===u?l:l===a&&s===u?`${l} ${s}`:`${l} ${s} ${a} ${u}`}return e}function h({attributes:e,typographyStyles:r={}}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuBorder:n,priorityPlusMenuBorderRadius:s,priorityPlusMenuBoxShadow:a,priorityPlusMenuItemPadding:u,priorityPlusMenuItemHoverBackground:d,priorityPlusMenuItemTextColor:y,priorityPlusMenuItemHoverTextColor:g,priorityPlusMenuSubmenuIndent:h,priorityPlusMenuItemSeparator:v,priorityPlusSubmenuBackgroundColor:w,priorityPlusSubmenuItemHoverBackground:P,priorityPlusSubmenuItemTextColor:x,priorityPlusSubmenuItemHoverTextColor:f}=e,C=i||l.dropdown.backgroundColor,_=n||l.dropdown.border,S=s||l.dropdown.borderRadius,T=a||l.dropdown.boxShadow,B=u||l.dropdown.item.padding,M=d||l.dropdown.item.hoverBackground,k=y||l.dropdown.item.textColor,j=g||l.dropdown.item.hoverTextColor,I=v||l.dropdown.item.separator,H=w||l.dropdown.submenu.backgroundColor,F=P||l.dropdown.submenu.itemHoverBackground,R=x||l.dropdown.submenu.itemTextColor,A=f||l.dropdown.submenu.itemHoverTextColor,[z,D]=(0,p.useState)(!0),$=(0,p.useMemo)(()=>{const o=function(o){const e=l.dropdown.border,r="--wp--custom--priority-plus-navigation--dropdown--";if(!o)return{[`${r}border-color`]:e.color,[`${r}border-width`]:e.width,[`${r}border-style`]:e.style};if(o.color||o.width||o.style)return{[`${r}border-color`]:o.color||e.color,[`${r}border-width`]:o.width||e.width,[`${r}border-style`]:o.style||e.style};const t=["top","right","bottom","left"];if(t.some(e=>o[e])){const i={};if(t.forEach(t=>{const n=o[t];if(n&&(n.color||n.width||n.style)){const o=n.width||e.width,l=n.style||e.style,s=n.color||e.color;i[`${r}border-${t}`]=`${o} ${l} ${s}`}}),Object.keys(i).length>0)return i}return{[`${r}border-color`]:e.color,[`${r}border-width`]:e.width,[`${r}border-style`]:e.style}}(_),e={"--wp--custom--priority-plus-navigation--dropdown--background-color":C,"--wp--custom--priority-plus-navigation--dropdown--border-radius":m(S),"--wp--custom--priority-plus-navigation--dropdown--box-shadow":T,"--wp--custom--priority-plus-navigation--dropdown--item-spacing":b(B),"--wp--custom--priority-plus-navigation--dropdown--item-hover-background-color":M,"--wp--custom--priority-plus-navigation--dropdown--item-text-color":k,"--wp--custom--priority-plus-navigation--dropdown--item-hover-text-color":j,"--wp--custom--priority-plus-navigation--dropdown--multi-level-indent":(t=h,t?"object"==typeof t&&t.left?c(t.left):"string"==typeof t?c(t):l.dropdown.submenu.indent:l.dropdown.submenu.indent),"--wp--custom--priority-plus-navigation--dropdown--item-separator-color":I?.color||"transparent","--wp--custom--priority-plus-navigation--dropdown--item-separator-width":I?.width||"0","--wp--custom--priority-plus-navigation--dropdown--item-separator-style":I?.style||"solid","--wp--custom--priority-plus-navigation--dropdown--submenu-background-color":H,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-background-color":F,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-text-color":R,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-text-color":A,...o};var t;return r.fontFamily&&(e.fontFamily=r.fontFamily),r.fontSize&&(e.fontSize=r.fontSize),r.fontWeight&&(e.fontWeight=r.fontWeight),r.fontStyle&&(e.fontStyle=r.fontStyle),e},[C,_,S,T,B,M,k,j,h,I,H,F,R,A,r]);return(0,t.jsxs)("ul",{className:"priority-plus-navigation-dropdown is-open",style:$,children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Top level item","priority-plus-navigation")})}),(0,t.jsx)("li",{className:"dropdown-preview-hover-demo",children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Another top level item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>D(!z),"aria-expanded":z,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Top level with a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),z&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Submenu item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>D(!z),"aria-expanded":z,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Submenu in a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),z&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Going deeper into the submenu","priority-plus-navigation")})}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Woah, submenu inception!","priority-plus-navigation")})})]})]})]})]}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Don't forget to test nav item the hover effect!","priority-plus-navigation")})})]})}function v({attributes:e,setAttributes:r}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuItemHoverBackground:n,priorityPlusMenuItemTextColor:a,priorityPlusMenuItemHoverTextColor:u}=e;return(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Menu Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),value:i||l.dropdown.backgroundColor,onChange:o=>r({priorityPlusMenuBackgroundColor:o||l.dropdown.backgroundColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),value:n||l.dropdown.item.hoverBackground,onChange:o=>r({priorityPlusMenuItemHoverBackground:o||l.dropdown.item.hoverBackground}),enableAlpha:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),value:a||l.dropdown.item.textColor,onChange:o=>r({priorityPlusMenuItemTextColor:o||l.dropdown.item.textColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),value:u||l.dropdown.item.hoverTextColor,onChange:o=>r({priorityPlusMenuItemHoverTextColor:o||l.dropdown.item.hoverTextColor}),enableAlpha:!0}]})}function w({attributes:e,setAttributes:r}){const{priorityPlusSubmenuBackgroundColor:i,priorityPlusSubmenuItemHoverBackground:n,priorityPlusSubmenuItemTextColor:a,priorityPlusSubmenuItemHoverTextColor:u}=e;return(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Submenu Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),value:i||l.dropdown.submenu.backgroundColor,onChange:o=>r({priorityPlusSubmenuBackgroundColor:o||l.dropdown.submenu.backgroundColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),value:n||l.dropdown.submenu.itemHoverBackground,onChange:o=>r({priorityPlusSubmenuItemHoverBackground:o||l.dropdown.submenu.itemHoverBackground}),enableAlpha:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),value:a||l.dropdown.submenu.itemTextColor,onChange:o=>r({priorityPlusSubmenuItemTextColor:o||l.dropdown.submenu.itemTextColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),value:u||l.dropdown.submenu.itemHoverTextColor,onChange:o=>r({priorityPlusSubmenuItemHoverTextColor:o||l.dropdown.submenu.itemHoverTextColor}),enableAlpha:!0}]})}function P({value:e,onChange:r}){const i=(0,s.useSetting)("shadow.presets.theme"),n=(0,s.useSetting)("shadow.presets.default"),u=(0,p.useMemo)(()=>{const e=i||[],r=n||[],t=[{value:"none",label:(0,o.__)("None","priority-plus-navigation")},{value:l.dropdown.boxShadow,label:(0,o.__)("Default","priority-plus-navigation")}];return e.length>0&&e.forEach(o=>{t.push({value:o.shadow,label:o.name})}),r.length>0&&r.forEach(o=>{t.push({value:o.shadow,label:o.name})}),t},[i,n]),[d,y]=(0,p.useState)(u);return(0,t.jsx)(a.ComboboxControl,{__next40pxDefaultSize:!0,__nextHasNoMarginBottom:!0,label:(0,o.__)("Shadow","priority-plus-navigation"),value:e,onChange:o=>{r(o)},options:d,onFilterValueChange:o=>{if(!o)return void y(u);const e=o.toLowerCase();y(u.filter(o=>o.label.toLowerCase().includes(e)))}})}function x({attributes:e,setAttributes:r}){const{priorityPlusMenuBorder:i,priorityPlusMenuBorderRadius:n,priorityPlusMenuBoxShadow:u}=e,p=(0,s.useSetting)("color.palette")||[];return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Menu Styles","priority-plus-navigation"),resetAll:()=>{r({priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=i)&&(!!(o.color||o.width||o.style)||["top","right","bottom","left"].some(e=>{const r=o[e];return r&&(r.color||r.width||r.style)}));var o},label:(0,o.__)("Menu Border","priority-plus-navigation"),onDeselect:()=>r({priorityPlusMenuBorder:l.dropdown.border}),isShownByDefault:!0,children:(0,t.jsx)(a.__experimentalBorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:p,value:i,onChange:o=>r({priorityPlusMenuBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("string"==typeof o?""!==o:"object"==typeof o&&Object.values(o).some(o=>o&&""!==o));var o},label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>r({priorityPlusMenuBorderRadius:l.dropdown.borderRadius}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:n,onChange:o=>r({priorityPlusMenuBorderRadius:o})})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!u,label:(0,o.__)("Shadow","priority-plus-navigation"),onDeselect:()=>r({priorityPlusMenuBoxShadow:l.dropdown.boxShadow}),isShownByDefault:!0,children:(0,t.jsx)(P,{value:u||l.dropdown.boxShadow,onChange:o=>r({priorityPlusMenuBoxShadow:o})})})]})}function f({attributes:e,setAttributes:r,spacingSizes:i}){const{priorityPlusMenuItemPadding:n,priorityPlusMenuSubmenuIndent:u,priorityPlusMenuItemSeparator:p}=e,d=(0,s.useSetting)("color.palette")||[];return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Menu Item Styles","priority-plus-navigation"),resetAll:()=>{r({priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuSubmenuIndent:l.dropdown.submenu.indent,priorityPlusMenuItemSeparator:l.dropdown.item.separator})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=p)&&!!(o.color||o.width||o.style);var o},label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),onDeselect:()=>r({priorityPlusMenuItemSeparator:l.dropdown.item.separator}),isShownByDefault:!0,children:(0,t.jsx)(a.__experimentalBorderControl,{__next40pxDefaultSize:!0,label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),colors:d,value:p||l.dropdown.item.separator,onChange:o=>r({priorityPlusMenuItemSeparator:o}),enableAlpha:!0,enableStyle:!0,withSlider:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("object"==typeof o?Object.values(o).some(o=>o&&""!==o):!!o);var o},label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),onDeselect:()=>r({priorityPlusMenuItemPadding:l.dropdown.item.padding}),isShownByDefault:!0,children:i.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:n,onChange:o=>r({priorityPlusMenuItemPadding:o}),label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),values:n,onChange:o=>r({priorityPlusMenuItemPadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=u)&&("object"==typeof o?o.left&&""!==o.left:!!o);var o},label:(0,o.__)("Submenu Indent","priority-plus-navigation"),onDeselect:()=>r({priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent}}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalSpacingSizesControl,{label:(0,o.__)("Submenu Indent","priority-plus-navigation"),values:(y=u,y?"object"==typeof y&&y.left?y:"string"==typeof y?{left:y}:{left:l.dropdown.submenu.indent}:{left:l.dropdown.submenu.indent}),onChange:o=>r({priorityPlusMenuSubmenuIndent:o}),sides:["left"]})})]});var y}function C({attributes:e,setAttributes:r,onClose:i}){const n=(0,s.useSetting)("typography.fontSizes")||[],u=(0,s.useSetting)("typography.fontFamilies")||[],p={};if(e.priorityPlusTypographyFontFamily){let o=[];u&&"object"==typeof u&&!Array.isArray(u)?(u.theme&&Array.isArray(u.theme)&&(o=o.concat(u.theme)),u.custom&&Array.isArray(u.custom)&&(o=o.concat(u.custom))):Array.isArray(u)&&u.forEach(e=>{e.fontFamilies&&Array.isArray(e.fontFamilies)?o=o.concat(e.fontFamilies):e.slug&&e.fontFamily&&o.push(e)});const r=o.find(o=>o.slug===e.priorityPlusTypographyFontFamily);r&&(p.fontFamily=r.fontFamily)}if(e.priorityPlusTypographyFontSize){let o=[];Array.isArray(n)&&n.forEach(e=>{e.sizes&&Array.isArray(e.sizes)?o=o.concat(e.sizes):e.slug&&e.size&&o.push(e)});const r=o.find(o=>o.slug===e.priorityPlusTypographyFontSize);r&&(p.fontSize=r.size)}e.priorityPlusTypographyFontWeight&&(p.fontWeight=e.priorityPlusTypographyFontWeight),e.priorityPlusTypographyFontStyle&&(p.fontStyle=e.priorityPlusTypographyFontStyle);const d=(0,s.useSetting)("spacing.spacingSizes")||[];return(0,t.jsxs)(a.Modal,{title:(0,o.__)("Customize Priority Plus Menu","priority-plus-navigation"),onRequestClose:i,className:"priority-plus-dropdown-customizer",size:"large",isDismissible:!0,children:[(0,t.jsxs)("div",{className:"dropdown-customizer-layout",children:[(0,t.jsxs)("div",{className:"dropdown-customizer-controls",children:[(0,t.jsx)(v,{attributes:e,setAttributes:r}),(0,t.jsx)(x,{attributes:e,setAttributes:r}),(0,t.jsx)(w,{attributes:e,setAttributes:r}),(0,t.jsx)(f,{attributes:e,setAttributes:r,spacingSizes:d})]}),(0,t.jsx)("div",{className:"dropdown-customizer-preview",children:(0,t.jsx)(h,{attributes:e,typographyStyles:p})})]}),(0,t.jsxs)("div",{className:"dropdown-customizer-footer",children:[(0,t.jsx)(a.Button,{variant:"tertiary",isDestructive:!0,onClick:()=>{r({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor})},children:(0,o.__)("Reset to Defaults","priority-plus-navigation")}),(0,t.jsx)(a.Button,{variant:"primary",onClick:i,children:(0,o.__)("Done","priority-plus-navigation")})]})]})}const _=(0,u.createHigherOrderComponent)(o=>e=>{const{name:r,attributes:i}=e;if("core/navigation"!==r)return(0,t.jsx)(o,{...e});const n=(i.className||"").includes("is-style-priority-plus-navigation")||!0===i.priorityPlusEnabled;return(0,p.useEffect)(()=>{if(!n)return;const o=document.querySelector(".block-editor-block-inspector");if(!o)return;const e=o.querySelector('.components-toggle-group-control-option-base[data-value="always"]');e&&(e.style.opacity="0.4",e.style.pointerEvents="none",e.style.textDecoration="line-through",e.style.cursor="not-allowed")},[n,i.overlayMenu]),(0,t.jsx)(o,{...e})},"addDisableAlwaysOption"),S=(0,u.createHigherOrderComponent)(e=>r=>{const{name:i,attributes:n,setAttributes:u,clientId:d}=r;if("core/navigation"!==i)return(0,t.jsx)(e,{...r});const y=(n.className||"").includes("is-style-priority-plus-navigation")||!0===n.priorityPlusEnabled;if(!y)return(0,t.jsx)(e,{...r});const{priorityPlusToggleLabel:c,priorityPlusToggleBackgroundColor:m,priorityPlusToggleBackgroundColorHover:b,priorityPlusToggleTextColor:h,priorityPlusToggleTextColorHover:v,priorityPlusTogglePadding:w,priorityPlusToggleBorder:P,priorityPlusToggleBorderRadius:x,priorityPlusMobileCollapse:f=!0,overlayMenu:_}=n,S=(0,p.useRef)(null),[T,B]=(0,p.useState)(!1);(0,p.useEffect)(()=>{y&&"always"===_&&u({overlayMenu:"mobile"})},[y,_,u]),(0,p.useEffect)(()=>{if(!y)return;const o=n.style?.typography?.fontWeight,e=n.style?.typography?.fontStyle;n.fontSize===n.priorityPlusTypographyFontSize&&n.fontFamily===n.priorityPlusTypographyFontFamily&&o===n.priorityPlusTypographyFontWeight&&e===n.priorityPlusTypographyFontStyle||u({priorityPlusTypographyFontFamily:n.fontFamily,priorityPlusTypographyFontSize:n.fontSize,priorityPlusTypographyFontWeight:o,priorityPlusTypographyFontStyle:e})},[y,n.fontSize,n.fontFamily,n.style?.typography?.fontWeight,n.style?.typography?.fontStyle,n.priorityPlusTypographyFontFamily,n.priorityPlusTypographyFontSize,n.priorityPlusTypographyFontWeight,n.priorityPlusTypographyFontStyle,u]);const M=(0,s.useSetting)("spacing.spacingSizes")||[],k=(0,s.useSetting)("color.palette")||[];return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("div",{className:"priority-plus-navigation-editor-wrapper",ref:S,children:[(0,t.jsx)(e,{...r}),(0,t.jsx)(g,{attributes:n,wrapperRef:S,clientId:d})]}),(0,t.jsx)(s.InspectorControls,{group:"settings",children:(0,t.jsx)(a.Notice,{status:"info",isDismissible:!1,children:(0,o.__)('Priority Plus Navigation is not compatible with "Always" overlay menu. The overlay menu is set to "Mobile" to allow Priority+ to work on desktop.',"priority-plus-navigation")})}),(0,t.jsxs)(s.InspectorControls,{group:"styles",children:[(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Settings","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleLabel:"More",priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!c,label:(0,o.__)("Button Label","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleLabel:"More"}),isShownByDefault:!0,children:(0,t.jsx)(a.TextControl,{label:(0,o.__)("Button Label","priority-plus-navigation"),value:c,onChange:o=>u({priorityPlusToggleLabel:o}),help:(0,o.__)("Text displayed on the toggle button","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!0!==f,label:(0,o.__)("Mobile Collapse","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMobileCollapse:!0}),isShownByDefault:!0,children:(0,t.jsx)(a.ToggleControl,{label:(0,o.__)("Collapse all items on mobile","priority-plus-navigation"),checked:f,onChange:o=>u({priorityPlusMobileCollapse:o}),help:(0,o.__)("When enabled, all navigation items collapse into the toggle button at the mobile breakpoint.","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{const{priorityPlusMenuBackgroundColor:o,priorityPlusMenuBorder:e,priorityPlusMenuBorderRadius:r,priorityPlusMenuBoxShadow:t,priorityPlusMenuItemPadding:i,priorityPlusMenuItemHoverBackground:l,priorityPlusMenuItemHoverTextColor:s,priorityPlusMenuSubmenuIndent:a}=n;return!!(o||e||r||t||i||l||s||a)},label:(0,o.__)("Custom Dropdown","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),isShownByDefault:!0,children:(0,t.jsx)(a.Button,{variant:"primary",onClick:()=>B(!0),children:(0,o.__)("Customize Dropdown Menu","priority-plus-navigation")})})]}),(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Button Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Text Color","priority-plus-navigation"),value:h,onChange:o=>u({priorityPlusToggleTextColor:o||void 0}),clearable:!0},{label:(0,o.__)("Text Hover Color","priority-plus-navigation"),value:v,onChange:o=>u({priorityPlusToggleTextColorHover:o||void 0}),clearable:!0},{label:(0,o.__)("Background Color","priority-plus-navigation"),value:m,onChange:o=>u({priorityPlusToggleBackgroundColor:o||void 0}),clearable:!0},{label:(0,o.__)("Background Hover Color","priority-plus-navigation"),value:b,onChange:o=>u({priorityPlusToggleBackgroundColorHover:o||void 0}),clearable:!0,enableAlpha:!0}]}),(0,t.jsx)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Spacing","priority-plus-navigation"),resetAll:()=>u({priorityPlusTogglePadding:void 0}),children:(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!w&&Object.keys(w).length>0,label:(0,o.__)("Button Padding","priority-plus-navigation"),onDeselect:()=>u({priorityPlusTogglePadding:void 0}),isShownByDefault:!0,children:M.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:w,onChange:o=>u({priorityPlusTogglePadding:o}),label:(0,o.__)("Button Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Button Padding","priority-plus-navigation"),values:w,onChange:o=>u({priorityPlusTogglePadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})})}),(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Border","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleBorder:void 0,priorityPlusToggleBorderRadius:void 0}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!P&&(!!(P.color||P.width||P.style)||["top","right","bottom","left"].some(o=>{const e=P[o];return e&&(e.color||e.width||e.style)})),label:(0,o.__)("Border","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorder:void 0}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:k,value:P,onChange:o=>u({priorityPlusToggleBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!x&&("string"==typeof x?""!==x:"object"==typeof x&&Object.values(x).some(o=>o&&""!==o)),label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorderRadius:void 0}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:x,onChange:o=>u({priorityPlusToggleBorderRadius:o})})})]})]}),T&&(0,t.jsx)(C,{attributes:n,setAttributes:u,onClose:()=>B(!1)})]})},"withPriorityPlusControls");(0,n.addFilter)("editor.BlockEdit","priority-plus-navigation/add-disable-always-option",_,5),(0,n.addFilter)("editor.BlockEdit","priority-plus-navigation/add-priority-plus-navigation-controls",S,10)})();
\ No newline at end of file
+(()=>{"use strict";const o=window.wp.i18n,r=window.wp.blocks,e=window.wp.primitives,t=window.ReactJSXRuntime;var i=(0,t.jsx)(e.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",children:(0,t.jsx)(e.Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M7.404 16.596a6.5 6.5 0 1 0 9.192-9.192 6.5 6.5 0 0 0-9.192 9.192ZM6.344 6.343a8 8 0 1 0 11.313 11.314A8 8 0 0 0 6.343 6.343Zm4.906 9.407v-3h-3v-1.5h3v-3h1.5v3h3v1.5h-3v3h-1.5Z"})});const n=window.wp.hooks,l={toggle:{border:{color:void 0,width:void 0,style:void 0},borderRadius:void 0},dropdown:{backgroundColor:"#ffffff",border:{color:"#dddddd",width:"1px",style:"solid"},borderRadius:"4px",boxShadow:"default",item:{padding:{top:"0.75rem",right:"1rem",bottom:"0.75rem",left:"1rem"},hoverBackground:"rgba(0, 0, 0, 0.05)",textColor:"#191919",hoverTextColor:"#191919",separator:{color:"#f0f0f0",width:"1px",style:"solid"}},submenu:{indent:"1.25rem",backgroundColor:"#ffffff",itemHoverBackground:"rgba(0, 0, 0, 0.05)",itemTextColor:"#191919",itemHoverTextColor:"#191919"}}};(0,r.registerBlockVariation)("core/navigation",{name:"priority-plus-navigation",title:(0,o.__)("Priority Plus Navigation","priority-plus-navigation"),description:(0,o.__)('A responsive navigation that automatically moves overflow items to a "More" dropdown.',"priority-plus-navigation"),icon:i,scope:["inserter","transform"],attributes:{className:"is-style-priority-plus-navigation",overlayMenu:"never",priorityPlusEnabled:!0,priorityPlusToggleLabel:"More",priorityPlusToggleBackgroundColor:void 0,priorityPlusToggleBackgroundColorHover:void 0,priorityPlusToggleTextColor:void 0,priorityPlusToggleTextColorHover:void 0},isActive:(o,r)=>o.className?.includes(r.className)}),(0,n.addFilter)("blocks.registerBlockType","priority-plus-navigation/extend-core-navigation",(o,r)=>"core/navigation"!==r?o:{...o,attributes:{...o.attributes,priorityPlusEnabled:{type:"boolean",default:!1},priorityPlusToggleLabel:{type:"string",default:"More"},priorityPlusToggleIcon:{type:"string",default:"none"},priorityPlusToggleBackgroundColor:{type:"string"},priorityPlusToggleBackgroundColorHover:{type:"string"},priorityPlusToggleTextColor:{type:"string"},priorityPlusToggleTextColorHover:{type:"string"},priorityPlusTogglePadding:{type:"object",default:void 0},priorityPlusToggleBorder:{type:"object",default:void 0},priorityPlusToggleBorderRadius:{type:["string","object"],default:void 0},priorityPlusMenuBackgroundColor:{type:"string",default:l.dropdown.backgroundColor},priorityPlusMenuBorder:{type:"object",default:l.dropdown.border},priorityPlusMenuBorderRadius:{type:["string","object"],default:l.dropdown.borderRadius},priorityPlusMenuBoxShadow:{type:"string",default:l.dropdown.boxShadow},priorityPlusMenuItemPadding:{type:"object",default:l.dropdown.item.padding},priorityPlusMenuItemHoverBackground:{type:"string",default:l.dropdown.item.hoverBackground},priorityPlusMenuItemTextColor:{type:"string",default:l.dropdown.item.textColor},priorityPlusMenuItemHoverTextColor:{type:"string",default:l.dropdown.item.hoverTextColor},priorityPlusMenuSubmenuIndent:{type:"string",default:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:{type:"object",default:l.dropdown.item.separator},priorityPlusSubmenuBackgroundColor:{type:"string",default:l.dropdown.submenu.backgroundColor},priorityPlusSubmenuItemHoverBackground:{type:"string",default:l.dropdown.submenu.itemHoverBackground},priorityPlusSubmenuItemTextColor:{type:"string",default:l.dropdown.submenu.itemTextColor},priorityPlusSubmenuItemHoverTextColor:{type:"string",default:l.dropdown.submenu.itemHoverTextColor},priorityPlusMobileCollapse:{type:"boolean",default:!0},priorityPlusTypographyFontFamily:{type:"string"},priorityPlusTypographyFontSize:{type:"string"},priorityPlusTypographyFontWeight:{type:"string"},priorityPlusTypographyFontStyle:{type:"string"}}});const s=window.wp.blockEditor,a=window.wp.components,u=window.wp.compose,p=window.wp.element,d=window.wp.data;function y(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const r=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(r)return`var(--wp--preset--${r[1]}--${r[2]})`}return o}const g=({attributes:r,wrapperRef:e,clientId:i})=>{const{priorityPlusToggleLabel:n,priorityPlusToggleBackgroundColor:l,priorityPlusToggleTextColor:a,priorityPlusTogglePadding:u,priorityPlusToggleBorder:g,priorityPlusToggleBorderRadius:m}=r,c=(0,p.useRef)(null),[h,b]=(0,p.useState)({}),{selectBlock:v}=(0,d.useDispatch)(s.store);(0,p.useEffect)(()=>{if(!e?.current)return;const o=()=>{const o=e.current.querySelector(".wp-block-navigation-item__content");if(!o)return;const r=window.getComputedStyle(o);b({fontSize:r.fontSize,fontFamily:r.fontFamily,fontWeight:r.fontWeight,fontStyle:r.fontStyle,lineHeight:r.lineHeight})};o();const r=setTimeout(o,200);return()=>clearTimeout(r)},[e,r.fontSize,r.fontFamily,r.style?.typography?.fontSize,r.style?.typography?.fontWeight,r.style?.typography?.fontStyle]);const w={display:"flex",alignItems:"center",gap:"0.25em",whiteSpace:"nowrap",cursor:"pointer",...function(o){if(!o)return{border:"none"};if(o.color||o.width||o.style)return{borderColor:o.color||void 0,borderWidth:o.width||void 0,borderStyle:o.style||void 0};const r={},e={top:"Top",right:"Right",bottom:"Bottom",left:"Left"};for(const[t,i]of Object.entries(e)){const e=o[t];e&&(e.color&&(r[`border${i}Color`]=e.color),e.width&&(r[`border${i}Width`]=e.width),e.style&&(r[`border${i}Style`]=e.style))}return Object.keys(r).length>0?r:{border:"none"}}(g),borderRadius:function(o){if(o){if("string"==typeof o)return o;if("object"==typeof o)return`${o.topLeft||"0"} ${o.topRight||"0"} ${o.bottomRight||"0"} ${o.bottomLeft||"0"}`}}(m),background:l||"transparent",color:a||"inherit",paddingTop:y(u?.top)||void 0,paddingRight:y(u?.right)||void 0,paddingBottom:y(u?.bottom)||void 0,paddingLeft:y(u?.left)||void 0,fontSize:h.fontSize||"inherit",fontFamily:h.fontFamily||"inherit",fontWeight:h.fontWeight||"inherit",fontStyle:h.fontStyle||"inherit",lineHeight:h.lineHeight||"inherit"};return(0,t.jsxs)("span",{ref:c,className:"priority-plus-navigation-editor-more-button",style:w,"aria-hidden":"true",role:"button",tabIndex:-1,onClick:()=>v(i),onKeyDown:o=>{"Enter"!==o.key&&" "!==o.key||v(i)},children:[(0,t.jsx)("span",{children:n||(0,o.__)("More","priority-plus-navigation")}),(0,t.jsx)("span",{style:{display:"inline-flex",alignItems:"center",marginRight:"-8px",lineHeight:1},children:(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"1.25em",height:"1.25em",fill:"currentColor","aria-hidden":"true",focusable:"false",children:(0,t.jsx)("path",{d:"M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 13.5l4.5-3.1.9 1.2z"})})})]})};function m(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const r=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(r)return`var(--wp--preset--${r[1]}--${r[2]})`}return o.startsWith("var("),o}function c(o){if(!o)return l.dropdown.borderRadius;if("string"==typeof o)return o;if("object"==typeof o){const{topLeft:r,topRight:e,bottomRight:t,bottomLeft:i}=o;return r===e&&e===t&&t===i&&r?r:`${r||"0"} ${e||"0"} ${t||"0"} ${i||"0"}`}return l.dropdown.borderRadius}function h(o){const r=`${l.dropdown.item.padding.top} ${l.dropdown.item.padding.right} ${l.dropdown.item.padding.bottom} ${l.dropdown.item.padding.left}`;if(!o)return r;if("string"==typeof o)return m(o);if("object"==typeof o){if(0===Object.keys(o).length)return r;const{top:e,right:t,bottom:i,left:n}=o;if(!(e&&""!==e&&"0"!==e||t&&""!==t&&"0"!==t||i&&""!==i&&"0"!==i||n&&""!==n&&"0"!==n))return r;const l=m(e)||"0",s=m(t)||"0",a=m(i)||"0",u=m(n)||"0";return l===s&&s===a&&a===u?l:l===a&&s===u?`${l} ${s}`:`${l} ${s} ${a} ${u}`}return r}function b({attributes:r,typographyStyles:e={}}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuBorder:n,priorityPlusMenuBorderRadius:s,priorityPlusMenuBoxShadow:a,priorityPlusMenuItemPadding:u,priorityPlusMenuItemHoverBackground:d,priorityPlusMenuItemTextColor:y,priorityPlusMenuItemHoverTextColor:g,priorityPlusMenuSubmenuIndent:b,priorityPlusMenuItemSeparator:v,priorityPlusSubmenuBackgroundColor:w,priorityPlusSubmenuItemHoverBackground:P,priorityPlusSubmenuItemTextColor:x,priorityPlusSubmenuItemHoverTextColor:f}=r,C=i||l.dropdown.backgroundColor,_=n||l.dropdown.border,S=s||l.dropdown.borderRadius,T=a||l.dropdown.boxShadow,B=u||l.dropdown.item.padding,M=d||l.dropdown.item.hoverBackground,k=y||l.dropdown.item.textColor,j=g||l.dropdown.item.hoverTextColor,I=v||l.dropdown.item.separator,H=w||l.dropdown.submenu.backgroundColor,R=P||l.dropdown.submenu.itemHoverBackground,F=x||l.dropdown.submenu.itemTextColor,A=f||l.dropdown.submenu.itemHoverTextColor,[z,$]=(0,p.useState)(!0),D=(0,p.useMemo)(()=>{const o=function(o){const r=l.dropdown.border,e="--wp--custom--priority-plus-navigation--dropdown--";if(!o)return{[`${e}border-color`]:r.color,[`${e}border-width`]:r.width,[`${e}border-style`]:r.style};if(o.color||o.width||o.style)return{[`${e}border-color`]:o.color||r.color,[`${e}border-width`]:o.width||r.width,[`${e}border-style`]:o.style||r.style};const t=["top","right","bottom","left"];if(t.some(r=>o[r])){const i={};if(t.forEach(t=>{const n=o[t];if(n&&(n.color||n.width||n.style)){const o=n.width||r.width,l=n.style||r.style,s=n.color||r.color;i[`${e}border-${t}`]=`${o} ${l} ${s}`}}),Object.keys(i).length>0)return i}return{[`${e}border-color`]:r.color,[`${e}border-width`]:r.width,[`${e}border-style`]:r.style}}(_),r={"--wp--custom--priority-plus-navigation--dropdown--background-color":C,"--wp--custom--priority-plus-navigation--dropdown--border-radius":c(S),"--wp--custom--priority-plus-navigation--dropdown--box-shadow":T,"--wp--custom--priority-plus-navigation--dropdown--item-spacing":h(B),"--wp--custom--priority-plus-navigation--dropdown--item-hover-background-color":M,"--wp--custom--priority-plus-navigation--dropdown--item-text-color":k,"--wp--custom--priority-plus-navigation--dropdown--item-hover-text-color":j,"--wp--custom--priority-plus-navigation--dropdown--multi-level-indent":(t=b,t?"object"==typeof t&&t.left?m(t.left):"string"==typeof t?m(t):l.dropdown.submenu.indent:l.dropdown.submenu.indent),"--wp--custom--priority-plus-navigation--dropdown--item-separator-color":I?.color||"transparent","--wp--custom--priority-plus-navigation--dropdown--item-separator-width":I?.width||"0","--wp--custom--priority-plus-navigation--dropdown--item-separator-style":I?.style||"solid","--wp--custom--priority-plus-navigation--dropdown--submenu-background-color":H,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-background-color":R,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-text-color":F,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-text-color":A,...o};var t;return e.fontFamily&&(r.fontFamily=e.fontFamily),e.fontSize&&(r.fontSize=e.fontSize),e.fontWeight&&(r.fontWeight=e.fontWeight),e.fontStyle&&(r.fontStyle=e.fontStyle),r},[C,_,S,T,B,M,k,j,b,I,H,R,F,A,e]);return(0,t.jsxs)("ul",{className:"priority-plus-navigation-dropdown is-open",style:D,children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Top level item","priority-plus-navigation")})}),(0,t.jsx)("li",{className:"dropdown-preview-hover-demo",children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Another top level item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>$(!z),"aria-expanded":z,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Top level with a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),z&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Submenu item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>$(!z),"aria-expanded":z,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Submenu in a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),z&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Going deeper into the submenu","priority-plus-navigation")})}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Woah, submenu inception!","priority-plus-navigation")})})]})]})]})]}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Don't forget to test nav item the hover effect!","priority-plus-navigation")})})]})}function v({attributes:r,setAttributes:e}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuItemHoverBackground:n,priorityPlusMenuItemTextColor:a,priorityPlusMenuItemHoverTextColor:u}=r;return(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Menu Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),value:i||l.dropdown.backgroundColor,onChange:o=>e({priorityPlusMenuBackgroundColor:o||l.dropdown.backgroundColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),value:n||l.dropdown.item.hoverBackground,onChange:o=>e({priorityPlusMenuItemHoverBackground:o||l.dropdown.item.hoverBackground}),enableAlpha:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),value:a||l.dropdown.item.textColor,onChange:o=>e({priorityPlusMenuItemTextColor:o||l.dropdown.item.textColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),value:u||l.dropdown.item.hoverTextColor,onChange:o=>e({priorityPlusMenuItemHoverTextColor:o||l.dropdown.item.hoverTextColor}),enableAlpha:!0}]})}function w({attributes:r,setAttributes:e}){const{priorityPlusSubmenuBackgroundColor:i,priorityPlusSubmenuItemHoverBackground:n,priorityPlusSubmenuItemTextColor:a,priorityPlusSubmenuItemHoverTextColor:u}=r;return(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Submenu Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),value:i||l.dropdown.submenu.backgroundColor,onChange:o=>e({priorityPlusSubmenuBackgroundColor:o||l.dropdown.submenu.backgroundColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),value:n||l.dropdown.submenu.itemHoverBackground,onChange:o=>e({priorityPlusSubmenuItemHoverBackground:o||l.dropdown.submenu.itemHoverBackground}),enableAlpha:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),value:a||l.dropdown.submenu.itemTextColor,onChange:o=>e({priorityPlusSubmenuItemTextColor:o||l.dropdown.submenu.itemTextColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),value:u||l.dropdown.submenu.itemHoverTextColor,onChange:o=>e({priorityPlusSubmenuItemHoverTextColor:o||l.dropdown.submenu.itemHoverTextColor}),enableAlpha:!0}]})}function P({value:r,onChange:e}){const[i,n]=(0,s.useSettings)("shadow.presets.theme","shadow.presets.default"),u=(0,p.useMemo)(()=>{const r=i||[],e=n||[],t=[{value:"none",label:(0,o.__)("None","priority-plus-navigation")},{value:l.dropdown.boxShadow,label:(0,o.__)("Default","priority-plus-navigation")}];return r.length>0&&r.forEach(o=>{t.push({value:o.shadow,label:o.name})}),e.length>0&&e.forEach(o=>{t.push({value:o.shadow,label:o.name})}),t},[i,n]),[d,y]=(0,p.useState)(u);return(0,t.jsx)(a.ComboboxControl,{__next40pxDefaultSize:!0,__nextHasNoMarginBottom:!0,label:(0,o.__)("Shadow","priority-plus-navigation"),value:r,onChange:o=>{e(o)},options:d,onFilterValueChange:o=>{if(!o)return void y(u);const r=o.toLowerCase();y(u.filter(o=>o.label.toLowerCase().includes(r)))}})}function x({attributes:r,setAttributes:e}){const{priorityPlusMenuBorder:i,priorityPlusMenuBorderRadius:n,priorityPlusMenuBoxShadow:u}=r,[p=[]]=(0,s.useSettings)("color.palette");return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Menu Styles","priority-plus-navigation"),resetAll:()=>{e({priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=i)&&(!!(o.color||o.width||o.style)||["top","right","bottom","left"].some(r=>{const e=o[r];return e&&(e.color||e.width||e.style)}));var o},label:(0,o.__)("Menu Border","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBorder:l.dropdown.border}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:p,value:i,onChange:o=>e({priorityPlusMenuBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("string"==typeof o?""!==o:"object"==typeof o&&Object.values(o).some(o=>o&&""!==o));var o},label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBorderRadius:l.dropdown.borderRadius}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:n,onChange:o=>e({priorityPlusMenuBorderRadius:o})})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!u,label:(0,o.__)("Shadow","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBoxShadow:l.dropdown.boxShadow}),isShownByDefault:!0,children:(0,t.jsx)(P,{value:u||l.dropdown.boxShadow,onChange:o=>e({priorityPlusMenuBoxShadow:o})})})]})}function f({attributes:r,setAttributes:e,spacingSizes:i}){const{priorityPlusMenuItemPadding:n,priorityPlusMenuSubmenuIndent:u,priorityPlusMenuItemSeparator:p}=r,[d=[]]=(0,s.useSettings)("color.palette");return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Menu Item Styles","priority-plus-navigation"),resetAll:()=>{e({priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuSubmenuIndent:l.dropdown.submenu.indent,priorityPlusMenuItemSeparator:l.dropdown.item.separator})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=p)&&!!(o.color||o.width||o.style);var o},label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuItemSeparator:l.dropdown.item.separator}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderControl,{__next40pxDefaultSize:!0,label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),colors:d,value:p||l.dropdown.item.separator,onChange:o=>e({priorityPlusMenuItemSeparator:o}),enableAlpha:!0,enableStyle:!0,withSlider:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("object"==typeof o?Object.values(o).some(o=>o&&""!==o):!!o);var o},label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuItemPadding:l.dropdown.item.padding}),isShownByDefault:!0,children:i.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:n,onChange:o=>e({priorityPlusMenuItemPadding:o}),label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),values:n,onChange:o=>e({priorityPlusMenuItemPadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=u)&&("object"==typeof o?o.left&&""!==o.left:!!o);var o},label:(0,o.__)("Submenu Indent","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent}}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalSpacingSizesControl,{label:(0,o.__)("Submenu Indent","priority-plus-navigation"),values:(y=u,y?"object"==typeof y&&y.left?y:"string"==typeof y?{left:y}:{left:l.dropdown.submenu.indent}:{left:l.dropdown.submenu.indent}),onChange:o=>e({priorityPlusMenuSubmenuIndent:o}),sides:["left"]})})]});var y}function C({attributes:r,setAttributes:e,onClose:i}){const[n=[],u=[],p=[]]=(0,s.useSettings)("typography.fontSizes","typography.fontFamilies","spacing.spacingSizes"),d={};if(r.priorityPlusTypographyFontFamily){let o=[];u&&"object"==typeof u&&!Array.isArray(u)?(u.theme&&Array.isArray(u.theme)&&(o=o.concat(u.theme)),u.custom&&Array.isArray(u.custom)&&(o=o.concat(u.custom))):Array.isArray(u)&&u.forEach(r=>{r.fontFamilies&&Array.isArray(r.fontFamilies)?o=o.concat(r.fontFamilies):r.slug&&r.fontFamily&&o.push(r)});const e=o.find(o=>o.slug===r.priorityPlusTypographyFontFamily);e&&(d.fontFamily=e.fontFamily)}if(r.priorityPlusTypographyFontSize){let o=[];Array.isArray(n)&&n.forEach(r=>{r.sizes&&Array.isArray(r.sizes)?o=o.concat(r.sizes):r.slug&&r.size&&o.push(r)});const e=o.find(o=>o.slug===r.priorityPlusTypographyFontSize);e&&(d.fontSize=e.size)}return r.priorityPlusTypographyFontWeight&&(d.fontWeight=r.priorityPlusTypographyFontWeight),r.priorityPlusTypographyFontStyle&&(d.fontStyle=r.priorityPlusTypographyFontStyle),(0,t.jsxs)(a.Modal,{title:(0,o.__)("Customize Priority Plus Menu","priority-plus-navigation"),onRequestClose:i,className:"priority-plus-dropdown-customizer",size:"large",isDismissible:!0,children:[(0,t.jsxs)("div",{className:"dropdown-customizer-layout",children:[(0,t.jsxs)("div",{className:"dropdown-customizer-controls",children:[(0,t.jsx)(v,{attributes:r,setAttributes:e}),(0,t.jsx)(x,{attributes:r,setAttributes:e}),(0,t.jsx)(w,{attributes:r,setAttributes:e}),(0,t.jsx)(f,{attributes:r,setAttributes:e,spacingSizes:p})]}),(0,t.jsx)("div",{className:"dropdown-customizer-preview",children:(0,t.jsx)(b,{attributes:r,typographyStyles:d})})]}),(0,t.jsxs)("div",{className:"dropdown-customizer-footer",children:[(0,t.jsx)(a.Button,{variant:"tertiary",isDestructive:!0,onClick:()=>{e({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor})},children:(0,o.__)("Reset to Defaults","priority-plus-navigation")}),(0,t.jsx)(a.Button,{variant:"primary",onClick:i,children:(0,o.__)("Done","priority-plus-navigation")})]})]})}const _=(0,u.createHigherOrderComponent)(r=>e=>{const{name:i,attributes:n,setAttributes:u,clientId:d}=e;if("core/navigation"!==i)return(0,t.jsx)(r,{...e});const y=(n.className||"").includes("is-style-priority-plus-navigation")||!0===n.priorityPlusEnabled;if(!y)return(0,t.jsx)(r,{...e});const{priorityPlusToggleLabel:m,priorityPlusToggleBackgroundColor:c,priorityPlusToggleBackgroundColorHover:h,priorityPlusToggleTextColor:b,priorityPlusToggleTextColorHover:v,priorityPlusTogglePadding:w,priorityPlusToggleBorder:P,priorityPlusToggleBorderRadius:x,priorityPlusMobileCollapse:f=!0,overlayMenu:_}=n,S=(0,p.useRef)(null),[T,B]=(0,p.useState)(!1);(0,p.useEffect)(()=>{y&&"always"===_&&u({overlayMenu:"mobile"})},[y,_,u]),(0,p.useEffect)(()=>{if(!y)return;const o=n.style?.typography?.fontWeight,r=n.style?.typography?.fontStyle;n.fontSize===n.priorityPlusTypographyFontSize&&n.fontFamily===n.priorityPlusTypographyFontFamily&&o===n.priorityPlusTypographyFontWeight&&r===n.priorityPlusTypographyFontStyle||u({priorityPlusTypographyFontFamily:n.fontFamily,priorityPlusTypographyFontSize:n.fontSize,priorityPlusTypographyFontWeight:o,priorityPlusTypographyFontStyle:r})},[y,n.fontSize,n.fontFamily,n.style?.typography?.fontWeight,n.style?.typography?.fontStyle,n.priorityPlusTypographyFontFamily,n.priorityPlusTypographyFontSize,n.priorityPlusTypographyFontWeight,n.priorityPlusTypographyFontStyle,u]);const[M=[],k=[]]=(0,s.useSettings)("spacing.spacingSizes","color.palette");return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("div",{className:"priority-plus-navigation-editor-wrapper",ref:S,children:[(0,t.jsx)(r,{...e}),(0,t.jsx)(g,{attributes:n,wrapperRef:S,clientId:d})]}),(0,t.jsx)(s.InspectorControls,{group:"settings",children:(0,t.jsx)(a.Notice,{status:"info",isDismissible:!1,children:(0,o.__)('Priority Plus Navigation is not compatible with "Always" overlay menu. The overlay menu is set to "Mobile" to allow Priority+ to work on desktop.',"priority-plus-navigation")})}),(0,t.jsxs)(s.InspectorControls,{group:"styles",children:[(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Settings","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleLabel:"More",priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!m,label:(0,o.__)("Button Label","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleLabel:"More"}),isShownByDefault:!0,children:(0,t.jsx)(a.TextControl,{label:(0,o.__)("Button Label","priority-plus-navigation"),value:m,onChange:o=>u({priorityPlusToggleLabel:o}),help:(0,o.__)("Text displayed on the toggle button","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!0!==f,label:(0,o.__)("Mobile Collapse","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMobileCollapse:!0}),isShownByDefault:!0,children:(0,t.jsx)(a.ToggleControl,{label:(0,o.__)("Collapse all items on mobile","priority-plus-navigation"),checked:f,onChange:o=>u({priorityPlusMobileCollapse:o}),help:(0,o.__)("When enabled, all navigation items collapse into the toggle button at the mobile breakpoint.","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{const{priorityPlusMenuBackgroundColor:o,priorityPlusMenuBorder:r,priorityPlusMenuBorderRadius:e,priorityPlusMenuBoxShadow:t,priorityPlusMenuItemPadding:i,priorityPlusMenuItemHoverBackground:l,priorityPlusMenuItemHoverTextColor:s,priorityPlusMenuSubmenuIndent:a}=n;return!!(o||r||e||t||i||l||s||a)},label:(0,o.__)("Custom Dropdown","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),isShownByDefault:!0,children:(0,t.jsx)(a.Button,{variant:"primary",onClick:()=>B(!0),children:(0,o.__)("Customize Dropdown Menu","priority-plus-navigation")})})]}),(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Button Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Text Color","priority-plus-navigation"),value:b,onChange:o=>u({priorityPlusToggleTextColor:o||void 0}),clearable:!0},{label:(0,o.__)("Text Hover Color","priority-plus-navigation"),value:v,onChange:o=>u({priorityPlusToggleTextColorHover:o||void 0}),clearable:!0},{label:(0,o.__)("Background Color","priority-plus-navigation"),value:c,onChange:o=>u({priorityPlusToggleBackgroundColor:o||void 0}),clearable:!0},{label:(0,o.__)("Background Hover Color","priority-plus-navigation"),value:h,onChange:o=>u({priorityPlusToggleBackgroundColorHover:o||void 0}),clearable:!0,enableAlpha:!0}]}),(0,t.jsx)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Spacing","priority-plus-navigation"),resetAll:()=>u({priorityPlusTogglePadding:void 0}),children:(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!w&&Object.keys(w).length>0,label:(0,o.__)("Button Padding","priority-plus-navigation"),onDeselect:()=>u({priorityPlusTogglePadding:void 0}),isShownByDefault:!0,children:M.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:w,onChange:o=>u({priorityPlusTogglePadding:o}),label:(0,o.__)("Button Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Button Padding","priority-plus-navigation"),values:w,onChange:o=>u({priorityPlusTogglePadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})})}),(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Border","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleBorder:void 0,priorityPlusToggleBorderRadius:void 0}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!P&&(!!(P.color||P.width||P.style)||["top","right","bottom","left"].some(o=>{const r=P[o];return r&&(r.color||r.width||r.style)})),label:(0,o.__)("Border","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorder:void 0}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:k,value:P,onChange:o=>u({priorityPlusToggleBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!x&&("string"==typeof x?""!==x:"object"==typeof x&&Object.values(x).some(o=>o&&""!==o)),label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorderRadius:void 0}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:x,onChange:o=>u({priorityPlusToggleBorderRadius:o})})})]})]}),T&&(0,t.jsx)(C,{attributes:n,setAttributes:u,onClose:()=>B(!1)})]})},"withPriorityPlusControls");(0,n.addFilter)("editor.BlockEdit","priority-plus-navigation/add-priority-plus-navigation-controls",_,10)})();
\ No newline at end of file
diff --git a/readme.txt b/readme.txt
index 8842c3a..5ead3de 100755
--- a/readme.txt
+++ b/readme.txt
@@ -53,7 +53,7 @@ Priority Plus Navigation intelligently integrates with WordPress core navigation
 
 * **Never**: Priority Plus is always active across all screen sizes
 * **Mobile**: Priority Plus works on desktop and automatically disables when the hamburger menu activates
-* **Always**: Not compatible - Priority Plus is automatically disabled and the "Always" option appears greyed out in the editor
+* **Always**: Not compatible - selecting it in the editor switches the overlay back to "Mobile" (with an explanatory notice), and Priority Plus is disabled on the frontend if the attribute is ever set to "Always"
 
 = Is it accessible? =
 
diff --git a/src/variation/components/dropdown-customizer-modal.js b/src/variation/components/dropdown-customizer-modal.js
index 86214f4..b60d034 100644
--- a/src/variation/components/dropdown-customizer-modal.js
+++ b/src/variation/components/dropdown-customizer-modal.js
@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { Modal, Button } from '@wordpress/components';
-import { useSetting } from '@wordpress/block-editor';
+import { useSettings } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 
 /**
@@ -21,9 +21,12 @@ export function DropdownCustomizerModal({
 	setAttributes,
 	onClose,
 }) {
-	// Get typography settings from theme to convert slugs to values
-	const fontSizes = useSetting('typography.fontSizes') || [];
-	const fontFamilies = useSetting('typography.fontFamilies') || [];
+	// Get typography and spacing settings from theme to convert slugs to values
+	const [fontSizes = [], fontFamilies = [], spacingSizes = []] = useSettings(
+		'typography.fontSizes',
+		'typography.fontFamilies',
+		'spacing.spacingSizes'
+	);
 
 	// Convert typography slugs to actual CSS values
 	const typographyStyles = {};
@@ -97,9 +100,6 @@ export function DropdownCustomizerModal({
 		typographyStyles.fontStyle = attributes.priorityPlusTypographyFontStyle;
 	}
 
-	// Get spacing sizes from theme
-	const spacingSizes = useSetting('spacing.spacingSizes') || [];
-
 	// Reset all menu styles to defaults
 	const resetAllToDefaults = () => {
 		setAttributes({
diff --git a/src/variation/components/panels/menu-items-panel.js b/src/variation/components/panels/menu-items-panel.js
index c448710..2d4a651 100644
--- a/src/variation/components/panels/menu-items-panel.js
+++ b/src/variation/components/panels/menu-items-panel.js
@@ -3,12 +3,12 @@
  */
 import {
 	BoxControl,
+	BorderControl,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
-	__experimentalBorderControl as BorderControl,
 } from '@wordpress/components';
 import {
-	useSetting,
+	useSettings,
 	__experimentalSpacingSizesControl as SpacingSizesControl,
 } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
@@ -108,7 +108,7 @@ export function MenuItemsPanel({ attributes, setAttributes, spacingSizes }) {
 	} = attributes;
 
 	// Get color palette from theme settings
-	const colors = useSetting('color.palette') || [];
+	const [colors = []] = useSettings('color.palette');
 
 	return (
 		<ToolsPanel
diff --git a/src/variation/components/panels/menu-styles-panel.js b/src/variation/components/panels/menu-styles-panel.js
index 06217df..13537ad 100644
--- a/src/variation/components/panels/menu-styles-panel.js
+++ b/src/variation/components/panels/menu-styles-panel.js
@@ -3,12 +3,12 @@
  */
 import {
 	ComboboxControl,
-	__experimentalBorderBoxControl as BorderBoxControl,
+	BorderBoxControl,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
 import {
-	useSetting,
+	useSettings,
 	__experimentalBorderRadiusControl as BorderRadiusControl,
 } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
@@ -82,8 +82,10 @@ function hasBorderRadiusValue(borderRadius) {
  */
 function ShadowPresetPicker({ value, onChange }) {
 	// Get shadow presets from theme settings
-	const themeShadowsRaw = useSetting('shadow.presets.theme');
-	const defaultShadowsRaw = useSetting('shadow.presets.default');
+	const [themeShadowsRaw, defaultShadowsRaw] = useSettings(
+		'shadow.presets.theme',
+		'shadow.presets.default'
+	);
 
 	// Build options for ComboboxControl (requires value/label format)
 	const shadowOptions = useMemo(() => {
@@ -177,7 +179,7 @@ export function MenuStylesPanel({ attributes, setAttributes }) {
 	} = attributes;
 
 	// Get color palette from theme settings
-	const colors = useSetting('color.palette') || [];
+	const [colors = []] = useSettings('color.palette');
 
 	return (
 		<ToolsPanel
diff --git a/src/variation/controls.js b/src/variation/controls.js
index c4bc19e..e04d061 100644
--- a/src/variation/controls.js
+++ b/src/variation/controls.js
@@ -7,7 +7,7 @@ import { addFilter } from '@wordpress/hooks';
 import {
 	InspectorControls,
 	PanelColorSettings,
-	useSetting,
+	useSettings,
 	__experimentalSpacingSizesControl as SpacingSizesControl,
 	__experimentalBorderRadiusControl as BorderRadiusControl,
 } from '@wordpress/block-editor';
@@ -32,55 +32,12 @@ import { DropdownCustomizerModal } from './components/dropdown-customizer-modal'
 import { tokens } from '../tokens';
 
 /**
- * Add DOM manipulation to disable 'always' overlay option when Priority+ is active
- */
-const addDisableAlwaysOption = createHigherOrderComponent((BlockEdit) => {
-	return (props) => {
-		const { name, attributes } = props;
-
-		if (name !== 'core/navigation') {
-			return <BlockEdit {...props} />;
-		}
-
-		// Check if Priority+ variation is active
-		const className = attributes.className || '';
-		const isPriorityPlusVariation =
-			className.includes('is-style-priority-plus-navigation') ||
-			attributes.priorityPlusEnabled === true;
-
-		// Use effect to modify the DOM after render
-		useEffect(() => {
-			if (!isPriorityPlusVariation) {
-				return;
-			}
-
-			// Find all toggle group control buttons in the inspector
-			const inspector = document.querySelector(
-				'.block-editor-block-inspector'
-			);
-			if (!inspector) {
-				return;
-			}
-
-			// Find the 'always' button by data-value attribute
-			const alwaysButton = inspector.querySelector(
-				'.components-toggle-group-control-option-base[data-value="always"]'
-			);
-
-			if (alwaysButton) {
-				alwaysButton.style.opacity = '0.4';
-				alwaysButton.style.pointerEvents = 'none';
-				alwaysButton.style.textDecoration = 'line-through';
-				alwaysButton.style.cursor = 'not-allowed';
-			}
-		}, [isPriorityPlusVariation, attributes.overlayMenu]);
-
-		return <BlockEdit {...props} />;
-	};
-}, 'addDisableAlwaysOption');
-
-/**
- * Add Inspector Controls to core/navigation block
+ * Add Inspector Controls to core/navigation block.
+ *
+ * The "Always" overlay option is intentionally left selectable in core's
+ * control rather than disabled in the DOM: selecting it is normalized back
+ * to "mobile" by an effect below, the inspector Notice explains why, and the
+ * server-side renderer treats "always" as Priority+ disabled regardless.
  */
 const withPriorityPlusControls = createHigherOrderComponent((BlockEdit) => {
 	return (props) => {
@@ -169,11 +126,11 @@ const withPriorityPlusControls = createHigherOrderComponent((BlockEdit) => {
 			setAttributes,
 		]);
 
-		// Get spacing sizes from theme.
-		const spacingSizes = useSetting('spacing.spacingSizes') || [];
-
-		// Get color palette for border controls.
-		const colors = useSetting('color.palette') || [];
+		// Get spacing sizes and color palette from theme settings.
+		const [spacingSizes = [], colors = []] = useSettings(
+			'spacing.spacingSizes',
+			'color.palette'
+		);
 
 		// Helper to check if border has values.
 		const hasBorderValue = () => {
@@ -614,14 +571,6 @@ const withPriorityPlusControls = createHigherOrderComponent((BlockEdit) => {
 	};
 }, 'withPriorityPlusControls');
 
-// Apply filters in order: first add DOM manipulation for styling, then our controls
-addFilter(
-	'editor.BlockEdit',
-	'priority-plus-navigation/add-disable-always-option',
-	addDisableAlwaysOption,
-	5
-);
-
 addFilter(
 	'editor.BlockEdit',
 	'priority-plus-navigation/add-priority-plus-navigation-controls',

From 3d22391dbffd282676a6854a3dfc03dc282268ca Mon Sep 17 00:00:00 2001
From: Troy Chaplin <troy.chaplin@gmail.com>
Date: Wed, 15 Jul 2026 23:08:10 -0300
Subject: [PATCH 5/6] update color panels

---
 build/priority-plus-nav-editor.asset.php      |   2 +-
 build/priority-plus-nav-editor.js             |   2 +-
 planned-updates/Claude-Plan.md                |  76 ++++++++
 src/variation/components/color-tools-panel.js |  43 +++++
 .../components/panels/menu-color-panel.js     | 171 +++++++++++------
 .../components/panels/submenu-color-panel.js  | 176 ++++++++++++------
 src/variation/controls.js                     | 170 +++++++++++------
 7 files changed, 464 insertions(+), 176 deletions(-)
 create mode 100644 planned-updates/Claude-Plan.md
 create mode 100644 src/variation/components/color-tools-panel.js

diff --git a/build/priority-plus-nav-editor.asset.php b/build/priority-plus-nav-editor.asset.php
index 1464926..016142e 100644
--- a/build/priority-plus-nav-editor.asset.php
+++ b/build/priority-plus-nav-editor.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-hooks', 'wp-i18n', 'wp-primitives'), 'version' => '72b3d6e346fd1838fcc9');
+<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-hooks', 'wp-i18n', 'wp-primitives'), 'version' => '326c37c6d0eef4efc876');
diff --git a/build/priority-plus-nav-editor.js b/build/priority-plus-nav-editor.js
index 63eb4cc..e00d33c 100644
--- a/build/priority-plus-nav-editor.js
+++ b/build/priority-plus-nav-editor.js
@@ -1 +1 @@
-(()=>{"use strict";const o=window.wp.i18n,r=window.wp.blocks,e=window.wp.primitives,t=window.ReactJSXRuntime;var i=(0,t.jsx)(e.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",children:(0,t.jsx)(e.Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M7.404 16.596a6.5 6.5 0 1 0 9.192-9.192 6.5 6.5 0 0 0-9.192 9.192ZM6.344 6.343a8 8 0 1 0 11.313 11.314A8 8 0 0 0 6.343 6.343Zm4.906 9.407v-3h-3v-1.5h3v-3h1.5v3h3v1.5h-3v3h-1.5Z"})});const n=window.wp.hooks,l={toggle:{border:{color:void 0,width:void 0,style:void 0},borderRadius:void 0},dropdown:{backgroundColor:"#ffffff",border:{color:"#dddddd",width:"1px",style:"solid"},borderRadius:"4px",boxShadow:"default",item:{padding:{top:"0.75rem",right:"1rem",bottom:"0.75rem",left:"1rem"},hoverBackground:"rgba(0, 0, 0, 0.05)",textColor:"#191919",hoverTextColor:"#191919",separator:{color:"#f0f0f0",width:"1px",style:"solid"}},submenu:{indent:"1.25rem",backgroundColor:"#ffffff",itemHoverBackground:"rgba(0, 0, 0, 0.05)",itemTextColor:"#191919",itemHoverTextColor:"#191919"}}};(0,r.registerBlockVariation)("core/navigation",{name:"priority-plus-navigation",title:(0,o.__)("Priority Plus Navigation","priority-plus-navigation"),description:(0,o.__)('A responsive navigation that automatically moves overflow items to a "More" dropdown.',"priority-plus-navigation"),icon:i,scope:["inserter","transform"],attributes:{className:"is-style-priority-plus-navigation",overlayMenu:"never",priorityPlusEnabled:!0,priorityPlusToggleLabel:"More",priorityPlusToggleBackgroundColor:void 0,priorityPlusToggleBackgroundColorHover:void 0,priorityPlusToggleTextColor:void 0,priorityPlusToggleTextColorHover:void 0},isActive:(o,r)=>o.className?.includes(r.className)}),(0,n.addFilter)("blocks.registerBlockType","priority-plus-navigation/extend-core-navigation",(o,r)=>"core/navigation"!==r?o:{...o,attributes:{...o.attributes,priorityPlusEnabled:{type:"boolean",default:!1},priorityPlusToggleLabel:{type:"string",default:"More"},priorityPlusToggleIcon:{type:"string",default:"none"},priorityPlusToggleBackgroundColor:{type:"string"},priorityPlusToggleBackgroundColorHover:{type:"string"},priorityPlusToggleTextColor:{type:"string"},priorityPlusToggleTextColorHover:{type:"string"},priorityPlusTogglePadding:{type:"object",default:void 0},priorityPlusToggleBorder:{type:"object",default:void 0},priorityPlusToggleBorderRadius:{type:["string","object"],default:void 0},priorityPlusMenuBackgroundColor:{type:"string",default:l.dropdown.backgroundColor},priorityPlusMenuBorder:{type:"object",default:l.dropdown.border},priorityPlusMenuBorderRadius:{type:["string","object"],default:l.dropdown.borderRadius},priorityPlusMenuBoxShadow:{type:"string",default:l.dropdown.boxShadow},priorityPlusMenuItemPadding:{type:"object",default:l.dropdown.item.padding},priorityPlusMenuItemHoverBackground:{type:"string",default:l.dropdown.item.hoverBackground},priorityPlusMenuItemTextColor:{type:"string",default:l.dropdown.item.textColor},priorityPlusMenuItemHoverTextColor:{type:"string",default:l.dropdown.item.hoverTextColor},priorityPlusMenuSubmenuIndent:{type:"string",default:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:{type:"object",default:l.dropdown.item.separator},priorityPlusSubmenuBackgroundColor:{type:"string",default:l.dropdown.submenu.backgroundColor},priorityPlusSubmenuItemHoverBackground:{type:"string",default:l.dropdown.submenu.itemHoverBackground},priorityPlusSubmenuItemTextColor:{type:"string",default:l.dropdown.submenu.itemTextColor},priorityPlusSubmenuItemHoverTextColor:{type:"string",default:l.dropdown.submenu.itemHoverTextColor},priorityPlusMobileCollapse:{type:"boolean",default:!0},priorityPlusTypographyFontFamily:{type:"string"},priorityPlusTypographyFontSize:{type:"string"},priorityPlusTypographyFontWeight:{type:"string"},priorityPlusTypographyFontStyle:{type:"string"}}});const s=window.wp.blockEditor,a=window.wp.components,u=window.wp.compose,p=window.wp.element,d=window.wp.data;function y(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const r=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(r)return`var(--wp--preset--${r[1]}--${r[2]})`}return o}const g=({attributes:r,wrapperRef:e,clientId:i})=>{const{priorityPlusToggleLabel:n,priorityPlusToggleBackgroundColor:l,priorityPlusToggleTextColor:a,priorityPlusTogglePadding:u,priorityPlusToggleBorder:g,priorityPlusToggleBorderRadius:m}=r,c=(0,p.useRef)(null),[h,b]=(0,p.useState)({}),{selectBlock:v}=(0,d.useDispatch)(s.store);(0,p.useEffect)(()=>{if(!e?.current)return;const o=()=>{const o=e.current.querySelector(".wp-block-navigation-item__content");if(!o)return;const r=window.getComputedStyle(o);b({fontSize:r.fontSize,fontFamily:r.fontFamily,fontWeight:r.fontWeight,fontStyle:r.fontStyle,lineHeight:r.lineHeight})};o();const r=setTimeout(o,200);return()=>clearTimeout(r)},[e,r.fontSize,r.fontFamily,r.style?.typography?.fontSize,r.style?.typography?.fontWeight,r.style?.typography?.fontStyle]);const w={display:"flex",alignItems:"center",gap:"0.25em",whiteSpace:"nowrap",cursor:"pointer",...function(o){if(!o)return{border:"none"};if(o.color||o.width||o.style)return{borderColor:o.color||void 0,borderWidth:o.width||void 0,borderStyle:o.style||void 0};const r={},e={top:"Top",right:"Right",bottom:"Bottom",left:"Left"};for(const[t,i]of Object.entries(e)){const e=o[t];e&&(e.color&&(r[`border${i}Color`]=e.color),e.width&&(r[`border${i}Width`]=e.width),e.style&&(r[`border${i}Style`]=e.style))}return Object.keys(r).length>0?r:{border:"none"}}(g),borderRadius:function(o){if(o){if("string"==typeof o)return o;if("object"==typeof o)return`${o.topLeft||"0"} ${o.topRight||"0"} ${o.bottomRight||"0"} ${o.bottomLeft||"0"}`}}(m),background:l||"transparent",color:a||"inherit",paddingTop:y(u?.top)||void 0,paddingRight:y(u?.right)||void 0,paddingBottom:y(u?.bottom)||void 0,paddingLeft:y(u?.left)||void 0,fontSize:h.fontSize||"inherit",fontFamily:h.fontFamily||"inherit",fontWeight:h.fontWeight||"inherit",fontStyle:h.fontStyle||"inherit",lineHeight:h.lineHeight||"inherit"};return(0,t.jsxs)("span",{ref:c,className:"priority-plus-navigation-editor-more-button",style:w,"aria-hidden":"true",role:"button",tabIndex:-1,onClick:()=>v(i),onKeyDown:o=>{"Enter"!==o.key&&" "!==o.key||v(i)},children:[(0,t.jsx)("span",{children:n||(0,o.__)("More","priority-plus-navigation")}),(0,t.jsx)("span",{style:{display:"inline-flex",alignItems:"center",marginRight:"-8px",lineHeight:1},children:(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"1.25em",height:"1.25em",fill:"currentColor","aria-hidden":"true",focusable:"false",children:(0,t.jsx)("path",{d:"M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 13.5l4.5-3.1.9 1.2z"})})})]})};function m(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const r=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(r)return`var(--wp--preset--${r[1]}--${r[2]})`}return o.startsWith("var("),o}function c(o){if(!o)return l.dropdown.borderRadius;if("string"==typeof o)return o;if("object"==typeof o){const{topLeft:r,topRight:e,bottomRight:t,bottomLeft:i}=o;return r===e&&e===t&&t===i&&r?r:`${r||"0"} ${e||"0"} ${t||"0"} ${i||"0"}`}return l.dropdown.borderRadius}function h(o){const r=`${l.dropdown.item.padding.top} ${l.dropdown.item.padding.right} ${l.dropdown.item.padding.bottom} ${l.dropdown.item.padding.left}`;if(!o)return r;if("string"==typeof o)return m(o);if("object"==typeof o){if(0===Object.keys(o).length)return r;const{top:e,right:t,bottom:i,left:n}=o;if(!(e&&""!==e&&"0"!==e||t&&""!==t&&"0"!==t||i&&""!==i&&"0"!==i||n&&""!==n&&"0"!==n))return r;const l=m(e)||"0",s=m(t)||"0",a=m(i)||"0",u=m(n)||"0";return l===s&&s===a&&a===u?l:l===a&&s===u?`${l} ${s}`:`${l} ${s} ${a} ${u}`}return r}function b({attributes:r,typographyStyles:e={}}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuBorder:n,priorityPlusMenuBorderRadius:s,priorityPlusMenuBoxShadow:a,priorityPlusMenuItemPadding:u,priorityPlusMenuItemHoverBackground:d,priorityPlusMenuItemTextColor:y,priorityPlusMenuItemHoverTextColor:g,priorityPlusMenuSubmenuIndent:b,priorityPlusMenuItemSeparator:v,priorityPlusSubmenuBackgroundColor:w,priorityPlusSubmenuItemHoverBackground:P,priorityPlusSubmenuItemTextColor:x,priorityPlusSubmenuItemHoverTextColor:f}=r,C=i||l.dropdown.backgroundColor,_=n||l.dropdown.border,S=s||l.dropdown.borderRadius,T=a||l.dropdown.boxShadow,B=u||l.dropdown.item.padding,M=d||l.dropdown.item.hoverBackground,k=y||l.dropdown.item.textColor,j=g||l.dropdown.item.hoverTextColor,I=v||l.dropdown.item.separator,H=w||l.dropdown.submenu.backgroundColor,R=P||l.dropdown.submenu.itemHoverBackground,F=x||l.dropdown.submenu.itemTextColor,A=f||l.dropdown.submenu.itemHoverTextColor,[z,$]=(0,p.useState)(!0),D=(0,p.useMemo)(()=>{const o=function(o){const r=l.dropdown.border,e="--wp--custom--priority-plus-navigation--dropdown--";if(!o)return{[`${e}border-color`]:r.color,[`${e}border-width`]:r.width,[`${e}border-style`]:r.style};if(o.color||o.width||o.style)return{[`${e}border-color`]:o.color||r.color,[`${e}border-width`]:o.width||r.width,[`${e}border-style`]:o.style||r.style};const t=["top","right","bottom","left"];if(t.some(r=>o[r])){const i={};if(t.forEach(t=>{const n=o[t];if(n&&(n.color||n.width||n.style)){const o=n.width||r.width,l=n.style||r.style,s=n.color||r.color;i[`${e}border-${t}`]=`${o} ${l} ${s}`}}),Object.keys(i).length>0)return i}return{[`${e}border-color`]:r.color,[`${e}border-width`]:r.width,[`${e}border-style`]:r.style}}(_),r={"--wp--custom--priority-plus-navigation--dropdown--background-color":C,"--wp--custom--priority-plus-navigation--dropdown--border-radius":c(S),"--wp--custom--priority-plus-navigation--dropdown--box-shadow":T,"--wp--custom--priority-plus-navigation--dropdown--item-spacing":h(B),"--wp--custom--priority-plus-navigation--dropdown--item-hover-background-color":M,"--wp--custom--priority-plus-navigation--dropdown--item-text-color":k,"--wp--custom--priority-plus-navigation--dropdown--item-hover-text-color":j,"--wp--custom--priority-plus-navigation--dropdown--multi-level-indent":(t=b,t?"object"==typeof t&&t.left?m(t.left):"string"==typeof t?m(t):l.dropdown.submenu.indent:l.dropdown.submenu.indent),"--wp--custom--priority-plus-navigation--dropdown--item-separator-color":I?.color||"transparent","--wp--custom--priority-plus-navigation--dropdown--item-separator-width":I?.width||"0","--wp--custom--priority-plus-navigation--dropdown--item-separator-style":I?.style||"solid","--wp--custom--priority-plus-navigation--dropdown--submenu-background-color":H,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-background-color":R,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-text-color":F,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-text-color":A,...o};var t;return e.fontFamily&&(r.fontFamily=e.fontFamily),e.fontSize&&(r.fontSize=e.fontSize),e.fontWeight&&(r.fontWeight=e.fontWeight),e.fontStyle&&(r.fontStyle=e.fontStyle),r},[C,_,S,T,B,M,k,j,b,I,H,R,F,A,e]);return(0,t.jsxs)("ul",{className:"priority-plus-navigation-dropdown is-open",style:D,children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Top level item","priority-plus-navigation")})}),(0,t.jsx)("li",{className:"dropdown-preview-hover-demo",children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Another top level item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>$(!z),"aria-expanded":z,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Top level with a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),z&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Submenu item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>$(!z),"aria-expanded":z,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Submenu in a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),z&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Going deeper into the submenu","priority-plus-navigation")})}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Woah, submenu inception!","priority-plus-navigation")})})]})]})]})]}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Don't forget to test nav item the hover effect!","priority-plus-navigation")})})]})}function v({attributes:r,setAttributes:e}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuItemHoverBackground:n,priorityPlusMenuItemTextColor:a,priorityPlusMenuItemHoverTextColor:u}=r;return(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Menu Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),value:i||l.dropdown.backgroundColor,onChange:o=>e({priorityPlusMenuBackgroundColor:o||l.dropdown.backgroundColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),value:n||l.dropdown.item.hoverBackground,onChange:o=>e({priorityPlusMenuItemHoverBackground:o||l.dropdown.item.hoverBackground}),enableAlpha:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),value:a||l.dropdown.item.textColor,onChange:o=>e({priorityPlusMenuItemTextColor:o||l.dropdown.item.textColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),value:u||l.dropdown.item.hoverTextColor,onChange:o=>e({priorityPlusMenuItemHoverTextColor:o||l.dropdown.item.hoverTextColor}),enableAlpha:!0}]})}function w({attributes:r,setAttributes:e}){const{priorityPlusSubmenuBackgroundColor:i,priorityPlusSubmenuItemHoverBackground:n,priorityPlusSubmenuItemTextColor:a,priorityPlusSubmenuItemHoverTextColor:u}=r;return(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Submenu Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),value:i||l.dropdown.submenu.backgroundColor,onChange:o=>e({priorityPlusSubmenuBackgroundColor:o||l.dropdown.submenu.backgroundColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),value:n||l.dropdown.submenu.itemHoverBackground,onChange:o=>e({priorityPlusSubmenuItemHoverBackground:o||l.dropdown.submenu.itemHoverBackground}),enableAlpha:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),value:a||l.dropdown.submenu.itemTextColor,onChange:o=>e({priorityPlusSubmenuItemTextColor:o||l.dropdown.submenu.itemTextColor}),enableAlpha:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),value:u||l.dropdown.submenu.itemHoverTextColor,onChange:o=>e({priorityPlusSubmenuItemHoverTextColor:o||l.dropdown.submenu.itemHoverTextColor}),enableAlpha:!0}]})}function P({value:r,onChange:e}){const[i,n]=(0,s.useSettings)("shadow.presets.theme","shadow.presets.default"),u=(0,p.useMemo)(()=>{const r=i||[],e=n||[],t=[{value:"none",label:(0,o.__)("None","priority-plus-navigation")},{value:l.dropdown.boxShadow,label:(0,o.__)("Default","priority-plus-navigation")}];return r.length>0&&r.forEach(o=>{t.push({value:o.shadow,label:o.name})}),e.length>0&&e.forEach(o=>{t.push({value:o.shadow,label:o.name})}),t},[i,n]),[d,y]=(0,p.useState)(u);return(0,t.jsx)(a.ComboboxControl,{__next40pxDefaultSize:!0,__nextHasNoMarginBottom:!0,label:(0,o.__)("Shadow","priority-plus-navigation"),value:r,onChange:o=>{e(o)},options:d,onFilterValueChange:o=>{if(!o)return void y(u);const r=o.toLowerCase();y(u.filter(o=>o.label.toLowerCase().includes(r)))}})}function x({attributes:r,setAttributes:e}){const{priorityPlusMenuBorder:i,priorityPlusMenuBorderRadius:n,priorityPlusMenuBoxShadow:u}=r,[p=[]]=(0,s.useSettings)("color.palette");return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Menu Styles","priority-plus-navigation"),resetAll:()=>{e({priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=i)&&(!!(o.color||o.width||o.style)||["top","right","bottom","left"].some(r=>{const e=o[r];return e&&(e.color||e.width||e.style)}));var o},label:(0,o.__)("Menu Border","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBorder:l.dropdown.border}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:p,value:i,onChange:o=>e({priorityPlusMenuBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("string"==typeof o?""!==o:"object"==typeof o&&Object.values(o).some(o=>o&&""!==o));var o},label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBorderRadius:l.dropdown.borderRadius}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:n,onChange:o=>e({priorityPlusMenuBorderRadius:o})})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!u,label:(0,o.__)("Shadow","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBoxShadow:l.dropdown.boxShadow}),isShownByDefault:!0,children:(0,t.jsx)(P,{value:u||l.dropdown.boxShadow,onChange:o=>e({priorityPlusMenuBoxShadow:o})})})]})}function f({attributes:r,setAttributes:e,spacingSizes:i}){const{priorityPlusMenuItemPadding:n,priorityPlusMenuSubmenuIndent:u,priorityPlusMenuItemSeparator:p}=r,[d=[]]=(0,s.useSettings)("color.palette");return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Menu Item Styles","priority-plus-navigation"),resetAll:()=>{e({priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuSubmenuIndent:l.dropdown.submenu.indent,priorityPlusMenuItemSeparator:l.dropdown.item.separator})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=p)&&!!(o.color||o.width||o.style);var o},label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuItemSeparator:l.dropdown.item.separator}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderControl,{__next40pxDefaultSize:!0,label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),colors:d,value:p||l.dropdown.item.separator,onChange:o=>e({priorityPlusMenuItemSeparator:o}),enableAlpha:!0,enableStyle:!0,withSlider:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("object"==typeof o?Object.values(o).some(o=>o&&""!==o):!!o);var o},label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuItemPadding:l.dropdown.item.padding}),isShownByDefault:!0,children:i.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:n,onChange:o=>e({priorityPlusMenuItemPadding:o}),label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),values:n,onChange:o=>e({priorityPlusMenuItemPadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=u)&&("object"==typeof o?o.left&&""!==o.left:!!o);var o},label:(0,o.__)("Submenu Indent","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent}}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalSpacingSizesControl,{label:(0,o.__)("Submenu Indent","priority-plus-navigation"),values:(y=u,y?"object"==typeof y&&y.left?y:"string"==typeof y?{left:y}:{left:l.dropdown.submenu.indent}:{left:l.dropdown.submenu.indent}),onChange:o=>e({priorityPlusMenuSubmenuIndent:o}),sides:["left"]})})]});var y}function C({attributes:r,setAttributes:e,onClose:i}){const[n=[],u=[],p=[]]=(0,s.useSettings)("typography.fontSizes","typography.fontFamilies","spacing.spacingSizes"),d={};if(r.priorityPlusTypographyFontFamily){let o=[];u&&"object"==typeof u&&!Array.isArray(u)?(u.theme&&Array.isArray(u.theme)&&(o=o.concat(u.theme)),u.custom&&Array.isArray(u.custom)&&(o=o.concat(u.custom))):Array.isArray(u)&&u.forEach(r=>{r.fontFamilies&&Array.isArray(r.fontFamilies)?o=o.concat(r.fontFamilies):r.slug&&r.fontFamily&&o.push(r)});const e=o.find(o=>o.slug===r.priorityPlusTypographyFontFamily);e&&(d.fontFamily=e.fontFamily)}if(r.priorityPlusTypographyFontSize){let o=[];Array.isArray(n)&&n.forEach(r=>{r.sizes&&Array.isArray(r.sizes)?o=o.concat(r.sizes):r.slug&&r.size&&o.push(r)});const e=o.find(o=>o.slug===r.priorityPlusTypographyFontSize);e&&(d.fontSize=e.size)}return r.priorityPlusTypographyFontWeight&&(d.fontWeight=r.priorityPlusTypographyFontWeight),r.priorityPlusTypographyFontStyle&&(d.fontStyle=r.priorityPlusTypographyFontStyle),(0,t.jsxs)(a.Modal,{title:(0,o.__)("Customize Priority Plus Menu","priority-plus-navigation"),onRequestClose:i,className:"priority-plus-dropdown-customizer",size:"large",isDismissible:!0,children:[(0,t.jsxs)("div",{className:"dropdown-customizer-layout",children:[(0,t.jsxs)("div",{className:"dropdown-customizer-controls",children:[(0,t.jsx)(v,{attributes:r,setAttributes:e}),(0,t.jsx)(x,{attributes:r,setAttributes:e}),(0,t.jsx)(w,{attributes:r,setAttributes:e}),(0,t.jsx)(f,{attributes:r,setAttributes:e,spacingSizes:p})]}),(0,t.jsx)("div",{className:"dropdown-customizer-preview",children:(0,t.jsx)(b,{attributes:r,typographyStyles:d})})]}),(0,t.jsxs)("div",{className:"dropdown-customizer-footer",children:[(0,t.jsx)(a.Button,{variant:"tertiary",isDestructive:!0,onClick:()=>{e({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor})},children:(0,o.__)("Reset to Defaults","priority-plus-navigation")}),(0,t.jsx)(a.Button,{variant:"primary",onClick:i,children:(0,o.__)("Done","priority-plus-navigation")})]})]})}const _=(0,u.createHigherOrderComponent)(r=>e=>{const{name:i,attributes:n,setAttributes:u,clientId:d}=e;if("core/navigation"!==i)return(0,t.jsx)(r,{...e});const y=(n.className||"").includes("is-style-priority-plus-navigation")||!0===n.priorityPlusEnabled;if(!y)return(0,t.jsx)(r,{...e});const{priorityPlusToggleLabel:m,priorityPlusToggleBackgroundColor:c,priorityPlusToggleBackgroundColorHover:h,priorityPlusToggleTextColor:b,priorityPlusToggleTextColorHover:v,priorityPlusTogglePadding:w,priorityPlusToggleBorder:P,priorityPlusToggleBorderRadius:x,priorityPlusMobileCollapse:f=!0,overlayMenu:_}=n,S=(0,p.useRef)(null),[T,B]=(0,p.useState)(!1);(0,p.useEffect)(()=>{y&&"always"===_&&u({overlayMenu:"mobile"})},[y,_,u]),(0,p.useEffect)(()=>{if(!y)return;const o=n.style?.typography?.fontWeight,r=n.style?.typography?.fontStyle;n.fontSize===n.priorityPlusTypographyFontSize&&n.fontFamily===n.priorityPlusTypographyFontFamily&&o===n.priorityPlusTypographyFontWeight&&r===n.priorityPlusTypographyFontStyle||u({priorityPlusTypographyFontFamily:n.fontFamily,priorityPlusTypographyFontSize:n.fontSize,priorityPlusTypographyFontWeight:o,priorityPlusTypographyFontStyle:r})},[y,n.fontSize,n.fontFamily,n.style?.typography?.fontWeight,n.style?.typography?.fontStyle,n.priorityPlusTypographyFontFamily,n.priorityPlusTypographyFontSize,n.priorityPlusTypographyFontWeight,n.priorityPlusTypographyFontStyle,u]);const[M=[],k=[]]=(0,s.useSettings)("spacing.spacingSizes","color.palette");return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("div",{className:"priority-plus-navigation-editor-wrapper",ref:S,children:[(0,t.jsx)(r,{...e}),(0,t.jsx)(g,{attributes:n,wrapperRef:S,clientId:d})]}),(0,t.jsx)(s.InspectorControls,{group:"settings",children:(0,t.jsx)(a.Notice,{status:"info",isDismissible:!1,children:(0,o.__)('Priority Plus Navigation is not compatible with "Always" overlay menu. The overlay menu is set to "Mobile" to allow Priority+ to work on desktop.',"priority-plus-navigation")})}),(0,t.jsxs)(s.InspectorControls,{group:"styles",children:[(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Settings","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleLabel:"More",priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!m,label:(0,o.__)("Button Label","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleLabel:"More"}),isShownByDefault:!0,children:(0,t.jsx)(a.TextControl,{label:(0,o.__)("Button Label","priority-plus-navigation"),value:m,onChange:o=>u({priorityPlusToggleLabel:o}),help:(0,o.__)("Text displayed on the toggle button","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!0!==f,label:(0,o.__)("Mobile Collapse","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMobileCollapse:!0}),isShownByDefault:!0,children:(0,t.jsx)(a.ToggleControl,{label:(0,o.__)("Collapse all items on mobile","priority-plus-navigation"),checked:f,onChange:o=>u({priorityPlusMobileCollapse:o}),help:(0,o.__)("When enabled, all navigation items collapse into the toggle button at the mobile breakpoint.","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{const{priorityPlusMenuBackgroundColor:o,priorityPlusMenuBorder:r,priorityPlusMenuBorderRadius:e,priorityPlusMenuBoxShadow:t,priorityPlusMenuItemPadding:i,priorityPlusMenuItemHoverBackground:l,priorityPlusMenuItemHoverTextColor:s,priorityPlusMenuSubmenuIndent:a}=n;return!!(o||r||e||t||i||l||s||a)},label:(0,o.__)("Custom Dropdown","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),isShownByDefault:!0,children:(0,t.jsx)(a.Button,{variant:"primary",onClick:()=>B(!0),children:(0,o.__)("Customize Dropdown Menu","priority-plus-navigation")})})]}),(0,t.jsx)(s.PanelColorSettings,{title:(0,o.__)("Priority Plus Button Colors","priority-plus-navigation"),colorSettings:[{label:(0,o.__)("Text Color","priority-plus-navigation"),value:b,onChange:o=>u({priorityPlusToggleTextColor:o||void 0}),clearable:!0},{label:(0,o.__)("Text Hover Color","priority-plus-navigation"),value:v,onChange:o=>u({priorityPlusToggleTextColorHover:o||void 0}),clearable:!0},{label:(0,o.__)("Background Color","priority-plus-navigation"),value:c,onChange:o=>u({priorityPlusToggleBackgroundColor:o||void 0}),clearable:!0},{label:(0,o.__)("Background Hover Color","priority-plus-navigation"),value:h,onChange:o=>u({priorityPlusToggleBackgroundColorHover:o||void 0}),clearable:!0,enableAlpha:!0}]}),(0,t.jsx)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Spacing","priority-plus-navigation"),resetAll:()=>u({priorityPlusTogglePadding:void 0}),children:(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!w&&Object.keys(w).length>0,label:(0,o.__)("Button Padding","priority-plus-navigation"),onDeselect:()=>u({priorityPlusTogglePadding:void 0}),isShownByDefault:!0,children:M.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:w,onChange:o=>u({priorityPlusTogglePadding:o}),label:(0,o.__)("Button Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Button Padding","priority-plus-navigation"),values:w,onChange:o=>u({priorityPlusTogglePadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})})}),(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Border","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleBorder:void 0,priorityPlusToggleBorderRadius:void 0}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!P&&(!!(P.color||P.width||P.style)||["top","right","bottom","left"].some(o=>{const r=P[o];return r&&(r.color||r.width||r.style)})),label:(0,o.__)("Border","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorder:void 0}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:k,value:P,onChange:o=>u({priorityPlusToggleBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!x&&("string"==typeof x?""!==x:"object"==typeof x&&Object.values(x).some(o=>o&&""!==o)),label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorderRadius:void 0}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:x,onChange:o=>u({priorityPlusToggleBorderRadius:o})})})]})]}),T&&(0,t.jsx)(C,{attributes:n,setAttributes:u,onClose:()=>B(!1)})]})},"withPriorityPlusControls");(0,n.addFilter)("editor.BlockEdit","priority-plus-navigation/add-priority-plus-navigation-controls",_,10)})();
\ No newline at end of file
+(()=>{"use strict";const o=window.wp.i18n,r=window.wp.blocks,e=window.wp.primitives,t=window.ReactJSXRuntime;var i=(0,t.jsx)(e.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",children:(0,t.jsx)(e.Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M7.404 16.596a6.5 6.5 0 1 0 9.192-9.192 6.5 6.5 0 0 0-9.192 9.192ZM6.344 6.343a8 8 0 1 0 11.313 11.314A8 8 0 0 0 6.343 6.343Zm4.906 9.407v-3h-3v-1.5h3v-3h1.5v3h3v1.5h-3v3h-1.5Z"})});const n=window.wp.hooks,l={toggle:{border:{color:void 0,width:void 0,style:void 0},borderRadius:void 0},dropdown:{backgroundColor:"#ffffff",border:{color:"#dddddd",width:"1px",style:"solid"},borderRadius:"4px",boxShadow:"default",item:{padding:{top:"0.75rem",right:"1rem",bottom:"0.75rem",left:"1rem"},hoverBackground:"rgba(0, 0, 0, 0.05)",textColor:"#191919",hoverTextColor:"#191919",separator:{color:"#f0f0f0",width:"1px",style:"solid"}},submenu:{indent:"1.25rem",backgroundColor:"#ffffff",itemHoverBackground:"rgba(0, 0, 0, 0.05)",itemTextColor:"#191919",itemHoverTextColor:"#191919"}}};(0,r.registerBlockVariation)("core/navigation",{name:"priority-plus-navigation",title:(0,o.__)("Priority Plus Navigation","priority-plus-navigation"),description:(0,o.__)('A responsive navigation that automatically moves overflow items to a "More" dropdown.',"priority-plus-navigation"),icon:i,scope:["inserter","transform"],attributes:{className:"is-style-priority-plus-navigation",overlayMenu:"never",priorityPlusEnabled:!0,priorityPlusToggleLabel:"More",priorityPlusToggleBackgroundColor:void 0,priorityPlusToggleBackgroundColorHover:void 0,priorityPlusToggleTextColor:void 0,priorityPlusToggleTextColorHover:void 0},isActive:(o,r)=>o.className?.includes(r.className)}),(0,n.addFilter)("blocks.registerBlockType","priority-plus-navigation/extend-core-navigation",(o,r)=>"core/navigation"!==r?o:{...o,attributes:{...o.attributes,priorityPlusEnabled:{type:"boolean",default:!1},priorityPlusToggleLabel:{type:"string",default:"More"},priorityPlusToggleIcon:{type:"string",default:"none"},priorityPlusToggleBackgroundColor:{type:"string"},priorityPlusToggleBackgroundColorHover:{type:"string"},priorityPlusToggleTextColor:{type:"string"},priorityPlusToggleTextColorHover:{type:"string"},priorityPlusTogglePadding:{type:"object",default:void 0},priorityPlusToggleBorder:{type:"object",default:void 0},priorityPlusToggleBorderRadius:{type:["string","object"],default:void 0},priorityPlusMenuBackgroundColor:{type:"string",default:l.dropdown.backgroundColor},priorityPlusMenuBorder:{type:"object",default:l.dropdown.border},priorityPlusMenuBorderRadius:{type:["string","object"],default:l.dropdown.borderRadius},priorityPlusMenuBoxShadow:{type:"string",default:l.dropdown.boxShadow},priorityPlusMenuItemPadding:{type:"object",default:l.dropdown.item.padding},priorityPlusMenuItemHoverBackground:{type:"string",default:l.dropdown.item.hoverBackground},priorityPlusMenuItemTextColor:{type:"string",default:l.dropdown.item.textColor},priorityPlusMenuItemHoverTextColor:{type:"string",default:l.dropdown.item.hoverTextColor},priorityPlusMenuSubmenuIndent:{type:"string",default:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:{type:"object",default:l.dropdown.item.separator},priorityPlusSubmenuBackgroundColor:{type:"string",default:l.dropdown.submenu.backgroundColor},priorityPlusSubmenuItemHoverBackground:{type:"string",default:l.dropdown.submenu.itemHoverBackground},priorityPlusSubmenuItemTextColor:{type:"string",default:l.dropdown.submenu.itemTextColor},priorityPlusSubmenuItemHoverTextColor:{type:"string",default:l.dropdown.submenu.itemHoverTextColor},priorityPlusMobileCollapse:{type:"boolean",default:!0},priorityPlusTypographyFontFamily:{type:"string"},priorityPlusTypographyFontSize:{type:"string"},priorityPlusTypographyFontWeight:{type:"string"},priorityPlusTypographyFontStyle:{type:"string"}}});const s=window.wp.blockEditor,a=window.wp.components,u=window.wp.compose,p=window.wp.element,d=window.wp.data;function y(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const r=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(r)return`var(--wp--preset--${r[1]}--${r[2]})`}return o}const g=({attributes:r,wrapperRef:e,clientId:i})=>{const{priorityPlusToggleLabel:n,priorityPlusToggleBackgroundColor:l,priorityPlusToggleTextColor:a,priorityPlusTogglePadding:u,priorityPlusToggleBorder:g,priorityPlusToggleBorderRadius:m}=r,c=(0,p.useRef)(null),[b,h]=(0,p.useState)({}),{selectBlock:v}=(0,d.useDispatch)(s.store);(0,p.useEffect)(()=>{if(!e?.current)return;const o=()=>{const o=e.current.querySelector(".wp-block-navigation-item__content");if(!o)return;const r=window.getComputedStyle(o);h({fontSize:r.fontSize,fontFamily:r.fontFamily,fontWeight:r.fontWeight,fontStyle:r.fontStyle,lineHeight:r.lineHeight})};o();const r=setTimeout(o,200);return()=>clearTimeout(r)},[e,r.fontSize,r.fontFamily,r.style?.typography?.fontSize,r.style?.typography?.fontWeight,r.style?.typography?.fontStyle]);const w={display:"flex",alignItems:"center",gap:"0.25em",whiteSpace:"nowrap",cursor:"pointer",...function(o){if(!o)return{border:"none"};if(o.color||o.width||o.style)return{borderColor:o.color||void 0,borderWidth:o.width||void 0,borderStyle:o.style||void 0};const r={},e={top:"Top",right:"Right",bottom:"Bottom",left:"Left"};for(const[t,i]of Object.entries(e)){const e=o[t];e&&(e.color&&(r[`border${i}Color`]=e.color),e.width&&(r[`border${i}Width`]=e.width),e.style&&(r[`border${i}Style`]=e.style))}return Object.keys(r).length>0?r:{border:"none"}}(g),borderRadius:function(o){if(o){if("string"==typeof o)return o;if("object"==typeof o)return`${o.topLeft||"0"} ${o.topRight||"0"} ${o.bottomRight||"0"} ${o.bottomLeft||"0"}`}}(m),background:l||"transparent",color:a||"inherit",paddingTop:y(u?.top)||void 0,paddingRight:y(u?.right)||void 0,paddingBottom:y(u?.bottom)||void 0,paddingLeft:y(u?.left)||void 0,fontSize:b.fontSize||"inherit",fontFamily:b.fontFamily||"inherit",fontWeight:b.fontWeight||"inherit",fontStyle:b.fontStyle||"inherit",lineHeight:b.lineHeight||"inherit"};return(0,t.jsxs)("span",{ref:c,className:"priority-plus-navigation-editor-more-button",style:w,"aria-hidden":"true",role:"button",tabIndex:-1,onClick:()=>v(i),onKeyDown:o=>{"Enter"!==o.key&&" "!==o.key||v(i)},children:[(0,t.jsx)("span",{children:n||(0,o.__)("More","priority-plus-navigation")}),(0,t.jsx)("span",{style:{display:"inline-flex",alignItems:"center",marginRight:"-8px",lineHeight:1},children:(0,t.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"1.25em",height:"1.25em",fill:"currentColor","aria-hidden":"true",focusable:"false",children:(0,t.jsx)("path",{d:"M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 13.5l4.5-3.1.9 1.2z"})})})]})};function m(o){if(!o||"string"!=typeof o)return o;if(o.startsWith("var:preset|")){const r=o.match(/^var:preset\|([^|]+)\|(.+)$/);if(r)return`var(--wp--preset--${r[1]}--${r[2]})`}return o.startsWith("var("),o}function c(o){if(!o)return l.dropdown.borderRadius;if("string"==typeof o)return o;if("object"==typeof o){const{topLeft:r,topRight:e,bottomRight:t,bottomLeft:i}=o;return r===e&&e===t&&t===i&&r?r:`${r||"0"} ${e||"0"} ${t||"0"} ${i||"0"}`}return l.dropdown.borderRadius}function b(o){const r=`${l.dropdown.item.padding.top} ${l.dropdown.item.padding.right} ${l.dropdown.item.padding.bottom} ${l.dropdown.item.padding.left}`;if(!o)return r;if("string"==typeof o)return m(o);if("object"==typeof o){if(0===Object.keys(o).length)return r;const{top:e,right:t,bottom:i,left:n}=o;if(!(e&&""!==e&&"0"!==e||t&&""!==t&&"0"!==t||i&&""!==i&&"0"!==i||n&&""!==n&&"0"!==n))return r;const l=m(e)||"0",s=m(t)||"0",a=m(i)||"0",u=m(n)||"0";return l===s&&s===a&&a===u?l:l===a&&s===u?`${l} ${s}`:`${l} ${s} ${a} ${u}`}return r}function h({attributes:r,typographyStyles:e={}}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuBorder:n,priorityPlusMenuBorderRadius:s,priorityPlusMenuBoxShadow:a,priorityPlusMenuItemPadding:u,priorityPlusMenuItemHoverBackground:d,priorityPlusMenuItemTextColor:y,priorityPlusMenuItemHoverTextColor:g,priorityPlusMenuSubmenuIndent:h,priorityPlusMenuItemSeparator:v,priorityPlusSubmenuBackgroundColor:w,priorityPlusSubmenuItemHoverBackground:P,priorityPlusSubmenuItemTextColor:x,priorityPlusSubmenuItemHoverTextColor:f}=r,C=i||l.dropdown.backgroundColor,_=n||l.dropdown.border,T=s||l.dropdown.borderRadius,S=a||l.dropdown.boxShadow,B=u||l.dropdown.item.padding,k=d||l.dropdown.item.hoverBackground,M=y||l.dropdown.item.textColor,I=g||l.dropdown.item.hoverTextColor,j=v||l.dropdown.item.separator,H=w||l.dropdown.submenu.backgroundColor,A=P||l.dropdown.submenu.itemHoverBackground,F=x||l.dropdown.submenu.itemTextColor,R=f||l.dropdown.submenu.itemHoverTextColor,[D,z]=(0,p.useState)(!0),$=(0,p.useMemo)(()=>{const o=function(o){const r=l.dropdown.border,e="--wp--custom--priority-plus-navigation--dropdown--";if(!o)return{[`${e}border-color`]:r.color,[`${e}border-width`]:r.width,[`${e}border-style`]:r.style};if(o.color||o.width||o.style)return{[`${e}border-color`]:o.color||r.color,[`${e}border-width`]:o.width||r.width,[`${e}border-style`]:o.style||r.style};const t=["top","right","bottom","left"];if(t.some(r=>o[r])){const i={};if(t.forEach(t=>{const n=o[t];if(n&&(n.color||n.width||n.style)){const o=n.width||r.width,l=n.style||r.style,s=n.color||r.color;i[`${e}border-${t}`]=`${o} ${l} ${s}`}}),Object.keys(i).length>0)return i}return{[`${e}border-color`]:r.color,[`${e}border-width`]:r.width,[`${e}border-style`]:r.style}}(_),r={"--wp--custom--priority-plus-navigation--dropdown--background-color":C,"--wp--custom--priority-plus-navigation--dropdown--border-radius":c(T),"--wp--custom--priority-plus-navigation--dropdown--box-shadow":S,"--wp--custom--priority-plus-navigation--dropdown--item-spacing":b(B),"--wp--custom--priority-plus-navigation--dropdown--item-hover-background-color":k,"--wp--custom--priority-plus-navigation--dropdown--item-text-color":M,"--wp--custom--priority-plus-navigation--dropdown--item-hover-text-color":I,"--wp--custom--priority-plus-navigation--dropdown--multi-level-indent":(t=h,t?"object"==typeof t&&t.left?m(t.left):"string"==typeof t?m(t):l.dropdown.submenu.indent:l.dropdown.submenu.indent),"--wp--custom--priority-plus-navigation--dropdown--item-separator-color":j?.color||"transparent","--wp--custom--priority-plus-navigation--dropdown--item-separator-width":j?.width||"0","--wp--custom--priority-plus-navigation--dropdown--item-separator-style":j?.style||"solid","--wp--custom--priority-plus-navigation--dropdown--submenu-background-color":H,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-background-color":A,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-text-color":F,"--wp--custom--priority-plus-navigation--dropdown--submenu-item-hover-text-color":R,...o};var t;return e.fontFamily&&(r.fontFamily=e.fontFamily),e.fontSize&&(r.fontSize=e.fontSize),e.fontWeight&&(r.fontWeight=e.fontWeight),e.fontStyle&&(r.fontStyle=e.fontStyle),r},[C,_,T,S,B,k,M,I,h,j,H,A,F,R,e]);return(0,t.jsxs)("ul",{className:"priority-plus-navigation-dropdown is-open",style:$,children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Top level item","priority-plus-navigation")})}),(0,t.jsx)("li",{className:"dropdown-preview-hover-demo",children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Another top level item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>z(!D),"aria-expanded":D,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Top level with a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),D&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Submenu item","priority-plus-navigation")})}),(0,t.jsxs)("li",{children:[(0,t.jsxs)("button",{type:"button",className:"priority-plus-navigation-accordion-toggle priority-plus-navigation-accordion-toggle-full",onClick:()=>z(!D),"aria-expanded":D,children:[(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-text",children:(0,o.__)("Submenu in a submenu","priority-plus-navigation")}),(0,t.jsx)("span",{className:"priority-plus-navigation-accordion-arrow","aria-hidden":"true",children:"›"})]}),D&&(0,t.jsxs)("ul",{className:"priority-plus-navigation-accordion-content is-open",children:[(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Going deeper into the submenu","priority-plus-navigation")})}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Woah, submenu inception!","priority-plus-navigation")})})]})]})]})]}),(0,t.jsx)("li",{children:(0,t.jsx)("span",{className:"priority-plus-navigation-preview-link",children:(0,o.__)("Don't forget to test nav item the hover effect!","priority-plus-navigation")})})]})}function v({label:o,resetAll:r,children:e}){return(0,t.jsx)(a.__experimentalToolsPanel,{label:o,resetAll:r,hasInnerWrapper:!0,className:"color-block-support-panel",__experimentalFirstVisibleItemClass:"first",__experimentalLastVisibleItemClass:"last",children:(0,t.jsx)("div",{className:"color-block-support-panel__inner-wrapper",children:e})})}function w({attributes:r,setAttributes:e}){const{priorityPlusMenuBackgroundColor:i,priorityPlusMenuItemHoverBackground:n,priorityPlusMenuItemTextColor:a,priorityPlusMenuItemHoverTextColor:u}=r,p=(0,s.__experimentalUseMultipleOriginColorsAndGradients)();return(0,t.jsx)(v,{label:(0,o.__)("Priority Plus Menu Colors","priority-plus-navigation"),resetAll:()=>e({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor}),children:(0,t.jsx)(s.__experimentalColorGradientSettingsDropdown,{__experimentalIsRenderedInSidebar:!0,settings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),colorValue:i||l.dropdown.backgroundColor,onColorChange:o=>e({priorityPlusMenuBackgroundColor:o||l.dropdown.backgroundColor}),resetAllFilter:()=>e({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor}),enableAlpha:!0,isShownByDefault:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),colorValue:n||l.dropdown.item.hoverBackground,onColorChange:o=>e({priorityPlusMenuItemHoverBackground:o||l.dropdown.item.hoverBackground}),resetAllFilter:()=>e({priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground}),enableAlpha:!0,isShownByDefault:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),colorValue:a||l.dropdown.item.textColor,onColorChange:o=>e({priorityPlusMenuItemTextColor:o||l.dropdown.item.textColor}),resetAllFilter:()=>e({priorityPlusMenuItemTextColor:l.dropdown.item.textColor}),enableAlpha:!0,isShownByDefault:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),colorValue:u||l.dropdown.item.hoverTextColor,onColorChange:o=>e({priorityPlusMenuItemHoverTextColor:o||l.dropdown.item.hoverTextColor}),resetAllFilter:()=>e({priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor}),enableAlpha:!0,isShownByDefault:!0}],...p,gradients:[],disableCustomGradients:!0})})}function P({attributes:r,setAttributes:e}){const{priorityPlusSubmenuBackgroundColor:i,priorityPlusSubmenuItemHoverBackground:n,priorityPlusSubmenuItemTextColor:a,priorityPlusSubmenuItemHoverTextColor:u}=r,p=(0,s.__experimentalUseMultipleOriginColorsAndGradients)();return(0,t.jsx)(v,{label:(0,o.__)("Priority Plus Submenu Colors","priority-plus-navigation"),resetAll:()=>e({priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),children:(0,t.jsx)(s.__experimentalColorGradientSettingsDropdown,{__experimentalIsRenderedInSidebar:!0,settings:[{label:(0,o.__)("Background Color","priority-plus-navigation"),colorValue:i||l.dropdown.submenu.backgroundColor,onColorChange:o=>e({priorityPlusSubmenuBackgroundColor:o||l.dropdown.submenu.backgroundColor}),resetAllFilter:()=>e({priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor}),enableAlpha:!0,isShownByDefault:!0},{label:(0,o.__)("Item Hover Background","priority-plus-navigation"),colorValue:n||l.dropdown.submenu.itemHoverBackground,onColorChange:o=>e({priorityPlusSubmenuItemHoverBackground:o||l.dropdown.submenu.itemHoverBackground}),resetAllFilter:()=>e({priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground}),enableAlpha:!0,isShownByDefault:!0},{label:(0,o.__)("Item Text Color","priority-plus-navigation"),colorValue:a||l.dropdown.submenu.itemTextColor,onColorChange:o=>e({priorityPlusSubmenuItemTextColor:o||l.dropdown.submenu.itemTextColor}),resetAllFilter:()=>e({priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor}),enableAlpha:!0,isShownByDefault:!0},{label:(0,o.__)("Item Hover Text Color","priority-plus-navigation"),colorValue:u||l.dropdown.submenu.itemHoverTextColor,onColorChange:o=>e({priorityPlusSubmenuItemHoverTextColor:o||l.dropdown.submenu.itemHoverTextColor}),resetAllFilter:()=>e({priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),enableAlpha:!0,isShownByDefault:!0}],...p,gradients:[],disableCustomGradients:!0})})}function x({value:r,onChange:e}){const[i,n]=(0,s.useSettings)("shadow.presets.theme","shadow.presets.default"),u=(0,p.useMemo)(()=>{const r=i||[],e=n||[],t=[{value:"none",label:(0,o.__)("None","priority-plus-navigation")},{value:l.dropdown.boxShadow,label:(0,o.__)("Default","priority-plus-navigation")}];return r.length>0&&r.forEach(o=>{t.push({value:o.shadow,label:o.name})}),e.length>0&&e.forEach(o=>{t.push({value:o.shadow,label:o.name})}),t},[i,n]),[d,y]=(0,p.useState)(u);return(0,t.jsx)(a.ComboboxControl,{__next40pxDefaultSize:!0,__nextHasNoMarginBottom:!0,label:(0,o.__)("Shadow","priority-plus-navigation"),value:r,onChange:o=>{e(o)},options:d,onFilterValueChange:o=>{if(!o)return void y(u);const r=o.toLowerCase();y(u.filter(o=>o.label.toLowerCase().includes(r)))}})}function f({attributes:r,setAttributes:e}){const{priorityPlusMenuBorder:i,priorityPlusMenuBorderRadius:n,priorityPlusMenuBoxShadow:u}=r,[p=[]]=(0,s.useSettings)("color.palette");return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Menu Styles","priority-plus-navigation"),resetAll:()=>{e({priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=i)&&(!!(o.color||o.width||o.style)||["top","right","bottom","left"].some(r=>{const e=o[r];return e&&(e.color||e.width||e.style)}));var o},label:(0,o.__)("Menu Border","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBorder:l.dropdown.border}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:p,value:i,onChange:o=>e({priorityPlusMenuBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("string"==typeof o?""!==o:"object"==typeof o&&Object.values(o).some(o=>o&&""!==o));var o},label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBorderRadius:l.dropdown.borderRadius}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:n,onChange:o=>e({priorityPlusMenuBorderRadius:o})})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!u,label:(0,o.__)("Shadow","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuBoxShadow:l.dropdown.boxShadow}),isShownByDefault:!0,children:(0,t.jsx)(x,{value:u||l.dropdown.boxShadow,onChange:o=>e({priorityPlusMenuBoxShadow:o})})})]})}function C({attributes:r,setAttributes:e,spacingSizes:i}){const{priorityPlusMenuItemPadding:n,priorityPlusMenuSubmenuIndent:u,priorityPlusMenuItemSeparator:p}=r,[d=[]]=(0,s.useSettings)("color.palette");return(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Menu Item Styles","priority-plus-navigation"),resetAll:()=>{e({priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuSubmenuIndent:l.dropdown.submenu.indent,priorityPlusMenuItemSeparator:l.dropdown.item.separator})},children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=p)&&!!(o.color||o.width||o.style);var o},label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuItemSeparator:l.dropdown.item.separator}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderControl,{__next40pxDefaultSize:!0,label:(0,o.__)("Menu Item Divider","priority-plus-navigation"),colors:d,value:p||l.dropdown.item.separator,onChange:o=>e({priorityPlusMenuItemSeparator:o}),enableAlpha:!0,enableStyle:!0,withSlider:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=n)&&("object"==typeof o?Object.values(o).some(o=>o&&""!==o):!!o);var o},label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuItemPadding:l.dropdown.item.padding}),isShownByDefault:!0,children:i.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:n,onChange:o=>e({priorityPlusMenuItemPadding:o}),label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Menu Item Padding","priority-plus-navigation"),values:n,onChange:o=>e({priorityPlusMenuItemPadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{return!!(o=u)&&("object"==typeof o?o.left&&""!==o.left:!!o);var o},label:(0,o.__)("Submenu Indent","priority-plus-navigation"),onDeselect:()=>e({priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent}}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalSpacingSizesControl,{label:(0,o.__)("Submenu Indent","priority-plus-navigation"),values:(y=u,y?"object"==typeof y&&y.left?y:"string"==typeof y?{left:y}:{left:l.dropdown.submenu.indent}:{left:l.dropdown.submenu.indent}),onChange:o=>e({priorityPlusMenuSubmenuIndent:o}),sides:["left"]})})]});var y}function _({attributes:r,setAttributes:e,onClose:i}){const[n=[],u=[],p=[]]=(0,s.useSettings)("typography.fontSizes","typography.fontFamilies","spacing.spacingSizes"),d={};if(r.priorityPlusTypographyFontFamily){let o=[];u&&"object"==typeof u&&!Array.isArray(u)?(u.theme&&Array.isArray(u.theme)&&(o=o.concat(u.theme)),u.custom&&Array.isArray(u.custom)&&(o=o.concat(u.custom))):Array.isArray(u)&&u.forEach(r=>{r.fontFamilies&&Array.isArray(r.fontFamilies)?o=o.concat(r.fontFamilies):r.slug&&r.fontFamily&&o.push(r)});const e=o.find(o=>o.slug===r.priorityPlusTypographyFontFamily);e&&(d.fontFamily=e.fontFamily)}if(r.priorityPlusTypographyFontSize){let o=[];Array.isArray(n)&&n.forEach(r=>{r.sizes&&Array.isArray(r.sizes)?o=o.concat(r.sizes):r.slug&&r.size&&o.push(r)});const e=o.find(o=>o.slug===r.priorityPlusTypographyFontSize);e&&(d.fontSize=e.size)}return r.priorityPlusTypographyFontWeight&&(d.fontWeight=r.priorityPlusTypographyFontWeight),r.priorityPlusTypographyFontStyle&&(d.fontStyle=r.priorityPlusTypographyFontStyle),(0,t.jsxs)(a.Modal,{title:(0,o.__)("Customize Priority Plus Menu","priority-plus-navigation"),onRequestClose:i,className:"priority-plus-dropdown-customizer",size:"large",isDismissible:!0,children:[(0,t.jsxs)("div",{className:"dropdown-customizer-layout",children:[(0,t.jsxs)("div",{className:"dropdown-customizer-controls",children:[(0,t.jsx)(w,{attributes:r,setAttributes:e}),(0,t.jsx)(f,{attributes:r,setAttributes:e}),(0,t.jsx)(P,{attributes:r,setAttributes:e}),(0,t.jsx)(C,{attributes:r,setAttributes:e,spacingSizes:p})]}),(0,t.jsx)("div",{className:"dropdown-customizer-preview",children:(0,t.jsx)(h,{attributes:r,typographyStyles:d})})]}),(0,t.jsxs)("div",{className:"dropdown-customizer-footer",children:[(0,t.jsx)(a.Button,{variant:"tertiary",isDestructive:!0,onClick:()=>{e({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor})},children:(0,o.__)("Reset to Defaults","priority-plus-navigation")}),(0,t.jsx)(a.Button,{variant:"primary",onClick:i,children:(0,o.__)("Done","priority-plus-navigation")})]})]})}const T=(0,u.createHigherOrderComponent)(r=>e=>{const{name:i,attributes:n,setAttributes:u,clientId:d}=e;if("core/navigation"!==i)return(0,t.jsx)(r,{...e});const y=(n.className||"").includes("is-style-priority-plus-navigation")||!0===n.priorityPlusEnabled;if(!y)return(0,t.jsx)(r,{...e});const{priorityPlusToggleLabel:m,priorityPlusToggleBackgroundColor:c,priorityPlusToggleBackgroundColorHover:b,priorityPlusToggleTextColor:h,priorityPlusToggleTextColorHover:w,priorityPlusTogglePadding:P,priorityPlusToggleBorder:x,priorityPlusToggleBorderRadius:f,priorityPlusMobileCollapse:C=!0,overlayMenu:T}=n,S=(0,p.useRef)(null),[B,k]=(0,p.useState)(!1);(0,p.useEffect)(()=>{y&&"always"===T&&u({overlayMenu:"mobile"})},[y,T,u]),(0,p.useEffect)(()=>{if(!y)return;const o=n.style?.typography?.fontWeight,r=n.style?.typography?.fontStyle;n.fontSize===n.priorityPlusTypographyFontSize&&n.fontFamily===n.priorityPlusTypographyFontFamily&&o===n.priorityPlusTypographyFontWeight&&r===n.priorityPlusTypographyFontStyle||u({priorityPlusTypographyFontFamily:n.fontFamily,priorityPlusTypographyFontSize:n.fontSize,priorityPlusTypographyFontWeight:o,priorityPlusTypographyFontStyle:r})},[y,n.fontSize,n.fontFamily,n.style?.typography?.fontWeight,n.style?.typography?.fontStyle,n.priorityPlusTypographyFontFamily,n.priorityPlusTypographyFontSize,n.priorityPlusTypographyFontWeight,n.priorityPlusTypographyFontStyle,u]);const[M=[],I=[]]=(0,s.useSettings)("spacing.spacingSizes","color.palette"),j=(0,s.__experimentalUseMultipleOriginColorsAndGradients)();return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)("div",{className:"priority-plus-navigation-editor-wrapper",ref:S,children:[(0,t.jsx)(r,{...e}),(0,t.jsx)(g,{attributes:n,wrapperRef:S,clientId:d})]}),(0,t.jsx)(s.InspectorControls,{group:"settings",children:(0,t.jsx)(a.Notice,{status:"info",isDismissible:!1,children:(0,o.__)('Priority Plus Navigation is not compatible with "Always" overlay menu. The overlay menu is set to "Mobile" to allow Priority+ to work on desktop.',"priority-plus-navigation")})}),(0,t.jsxs)(s.InspectorControls,{group:"styles",children:[(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Settings","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleLabel:"More",priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!m,label:(0,o.__)("Button Label","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleLabel:"More"}),isShownByDefault:!0,children:(0,t.jsx)(a.TextControl,{label:(0,o.__)("Button Label","priority-plus-navigation"),value:m,onChange:o=>u({priorityPlusToggleLabel:o}),help:(0,o.__)("Text displayed on the toggle button","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!0!==C,label:(0,o.__)("Mobile Collapse","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMobileCollapse:!0}),isShownByDefault:!0,children:(0,t.jsx)(a.ToggleControl,{label:(0,o.__)("Collapse all items on mobile","priority-plus-navigation"),checked:C,onChange:o=>u({priorityPlusMobileCollapse:o}),help:(0,o.__)("When enabled, all navigation items collapse into the toggle button at the mobile breakpoint.","priority-plus-navigation")})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>{const{priorityPlusMenuBackgroundColor:o,priorityPlusMenuBorder:r,priorityPlusMenuBorderRadius:e,priorityPlusMenuBoxShadow:t,priorityPlusMenuItemPadding:i,priorityPlusMenuItemHoverBackground:l,priorityPlusMenuItemHoverTextColor:s,priorityPlusMenuSubmenuIndent:a}=n;return!!(o||r||e||t||i||l||s||a)},label:(0,o.__)("Custom Dropdown","priority-plus-navigation"),onDeselect:()=>u({priorityPlusMenuBackgroundColor:l.dropdown.backgroundColor,priorityPlusMenuBorder:l.dropdown.border,priorityPlusMenuBorderRadius:l.dropdown.borderRadius,priorityPlusMenuBoxShadow:l.dropdown.boxShadow,priorityPlusMenuItemPadding:l.dropdown.item.padding,priorityPlusMenuItemHoverBackground:l.dropdown.item.hoverBackground,priorityPlusMenuItemTextColor:l.dropdown.item.textColor,priorityPlusMenuItemHoverTextColor:l.dropdown.item.hoverTextColor,priorityPlusMenuSubmenuIndent:{left:l.dropdown.submenu.indent},priorityPlusMenuItemSeparator:l.dropdown.item.separator,priorityPlusSubmenuBackgroundColor:l.dropdown.submenu.backgroundColor,priorityPlusSubmenuItemHoverBackground:l.dropdown.submenu.itemHoverBackground,priorityPlusSubmenuItemTextColor:l.dropdown.submenu.itemTextColor,priorityPlusSubmenuItemHoverTextColor:l.dropdown.submenu.itemHoverTextColor}),isShownByDefault:!0,children:(0,t.jsx)(a.Button,{variant:"primary",onClick:()=>k(!0),children:(0,o.__)("Customize Dropdown Menu","priority-plus-navigation")})})]}),(0,t.jsx)(v,{label:(0,o.__)("Priority Plus Button Colors","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleTextColor:void 0,priorityPlusToggleTextColorHover:void 0,priorityPlusToggleBackgroundColor:void 0,priorityPlusToggleBackgroundColorHover:void 0}),children:(0,t.jsx)(s.__experimentalColorGradientSettingsDropdown,{__experimentalIsRenderedInSidebar:!0,settings:[{label:(0,o.__)("Text Color","priority-plus-navigation"),colorValue:h,onColorChange:o=>u({priorityPlusToggleTextColor:o||void 0}),resetAllFilter:()=>u({priorityPlusToggleTextColor:void 0}),clearable:!0,isShownByDefault:!0},{label:(0,o.__)("Text Hover Color","priority-plus-navigation"),colorValue:w,onColorChange:o=>u({priorityPlusToggleTextColorHover:o||void 0}),resetAllFilter:()=>u({priorityPlusToggleTextColorHover:void 0}),clearable:!0,isShownByDefault:!0},{label:(0,o.__)("Background Color","priority-plus-navigation"),colorValue:c,onColorChange:o=>u({priorityPlusToggleBackgroundColor:o||void 0}),resetAllFilter:()=>u({priorityPlusToggleBackgroundColor:void 0}),clearable:!0,isShownByDefault:!0},{label:(0,o.__)("Background Hover Color","priority-plus-navigation"),colorValue:b,onColorChange:o=>u({priorityPlusToggleBackgroundColorHover:o||void 0}),resetAllFilter:()=>u({priorityPlusToggleBackgroundColorHover:void 0}),clearable:!0,enableAlpha:!0,isShownByDefault:!0}],...j,gradients:[],disableCustomGradients:!0})}),(0,t.jsx)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Spacing","priority-plus-navigation"),resetAll:()=>u({priorityPlusTogglePadding:void 0}),children:(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!P&&Object.keys(P).length>0,label:(0,o.__)("Button Padding","priority-plus-navigation"),onDeselect:()=>u({priorityPlusTogglePadding:void 0}),isShownByDefault:!0,children:M.length>0?(0,t.jsx)(s.__experimentalSpacingSizesControl,{values:P,onChange:o=>u({priorityPlusTogglePadding:o}),label:(0,o.__)("Button Padding","priority-plus-navigation"),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"]}):(0,t.jsx)(a.BoxControl,{label:(0,o.__)("Button Padding","priority-plus-navigation"),values:P,onChange:o=>u({priorityPlusTogglePadding:o}),sides:["top","right","bottom","left"],units:["px","em","rem","vh","vw"],allowReset:!0})})}),(0,t.jsxs)(a.__experimentalToolsPanel,{label:(0,o.__)("Priority Plus Button Border","priority-plus-navigation"),resetAll:()=>u({priorityPlusToggleBorder:void 0,priorityPlusToggleBorderRadius:void 0}),children:[(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!x&&(!!(x.color||x.width||x.style)||["top","right","bottom","left"].some(o=>{const r=x[o];return r&&(r.color||r.width||r.style)})),label:(0,o.__)("Border","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorder:void 0}),isShownByDefault:!0,children:(0,t.jsx)(a.BorderBoxControl,{label:(0,o.__)("Border","priority-plus-navigation"),colors:I,value:x,onChange:o=>u({priorityPlusToggleBorder:o}),enableAlpha:!0,enableStyle:!0,size:"__unstable-large"})}),(0,t.jsx)(a.__experimentalToolsPanelItem,{hasValue:()=>!!f&&("string"==typeof f?""!==f:"object"==typeof f&&Object.values(f).some(o=>o&&""!==o)),label:(0,o.__)("Border Radius","priority-plus-navigation"),onDeselect:()=>u({priorityPlusToggleBorderRadius:void 0}),isShownByDefault:!0,children:(0,t.jsx)(s.__experimentalBorderRadiusControl,{label:(0,o.__)("Border Radius","priority-plus-navigation"),values:f,onChange:o=>u({priorityPlusToggleBorderRadius:o})})})]})]}),B&&(0,t.jsx)(_,{attributes:n,setAttributes:u,onClose:()=>k(!1)})]})},"withPriorityPlusControls");(0,n.addFilter)("editor.BlockEdit","priority-plus-navigation/add-priority-plus-navigation-controls",T,10)})();
\ No newline at end of file
diff --git a/planned-updates/Claude-Plan.md b/planned-updates/Claude-Plan.md
new file mode 100644
index 0000000..419d1b3
--- /dev/null
+++ b/planned-updates/Claude-Plan.md
@@ -0,0 +1,76 @@
+# Plan: Focused Gutenberg alignment + Interactivity API exploration
+
+## Context
+
+The full modernization roadmap lives in `planned-updates/` (committed as `6f808d9`). The first execution pass overreached: it upgraded build tooling (wp-scripts 32, ESLint flat config, Node 22) and added PHPUnit infrastructure, producing a 1000+ file diff. All of that was reverted; the tree is clean.
+
+**Narrowed scope (user-confirmed):** only two things, in small reviewable stages —
+1. **Align the plugin code with current Gutenberg practice** — server rendering, asset loading, editor APIs. No build-tool changes, no test infrastructure. The toolchain stays: wp-scripts 31.6, `.eslintrc.js` as-is, Node 20, existing CI.
+2. **Explore whether the Interactivity API is right for this block variation** — beyond the written verdict in `planned-updates/05-interactivity-api-migration.md`, validate it hands-on with a throwaway spike.
+
+Key facts already established (verified in prior session):
+- `useSettings`, stable `BorderControl`/`BorderBoxControl` all exist in the currently installed `@wordpress/block-editor` 15.14 / `components` 32.3 — the editor modernization needs **no toolchain change** (build + lint verified passing pre-upgrade).
+- The Tag Processor + enqueue changes were previously implemented and verified end-to-end on the Studio site (WP 7.0.1) — re-applying is low-risk, and the exact code is in this conversation's history.
+- `build/` is tracked in git, so the editor stage includes ~4 rebuilt artifacts (existing repo policy).
+- The Studio site at `/Users/troychaplin/Develop/wp-projects/block-plugins` (WP 7.0.1, plugin active, `studio wp` CLI) is the verification environment.
+
+## Stage A — Server-side alignment: regex → WP_HTML_Tag_Processor
+
+*1 file: `classes/class-block-renderer.php`*
+
+- Rewrite `inject_priority_attributes()` on `WP_HTML_Tag_Processor` (`next_tag` scoped to `NAV` + `class_name: wp-block-navigation`, `get_attribute('style')`, `set_attribute(...)`), matching core's own pattern in `block_core_navigation_add_directives_to_submenu()` (gutenberg `packages/block-library/src/navigation/index.php`).
+- `preserve_existing_styles()` becomes a plain string-split of the style value read from the processor; `build_style_parts()` signature changes from `$block_content` to `$existing_style`. `CSS_Converter` untouched.
+- Pass raw values to `set_attribute()` (it escapes internally); the style string keeps the exact `'; '`-join + trailing `;` format.
+
+**Verification without committed tests:** before changing anything, run an ad-hoc parity script from the scratchpad (not the repo) via `studio wp eval-file`: render a matrix of attribute combinations through the current regex implementation, save outputs; after the refactor, re-render and diff (normalizing attribute order). Plus a live `do_blocks()` render of a real navigation block checking data attributes, escaping, and style merging.
+
+## Stage B — Asset-loading alignment: register early, enqueue late
+
+*1 file: `classes/class-enqueues.php`*
+
+- New `register_frontend_assets()` on `wp_enqueue_scripts`: `wp_register_script`/`wp_register_style` with the existing `.asset.php` metadata wiring.
+- `enqueue_frontend_assets()` (called from the render filter) enqueues the registered handles only, with a fallback registration for contexts where `wp_enqueue_scripts` never fired (REST/CLI). Keep the once-only guard.
+- This is core/navigation's own conditional-loading shape (register up front, enqueue from the render callback).
+
+**Verification:** `studio wp eval` — render a Priority+ nav, assert `wp_script_is`/`wp_style_is` registered + enqueued; load a frontend page with a nav in the browser and confirm assets arrive and the nav behaves.
+
+## Stage C — Editor API alignment
+
+*4 source files + rebuilt `build/` artifacts; `.eslintrc.js` untouched*
+
+- `src/variation/controls.js`: delete the `addDisableAlwaysOption` HOC (the `document.querySelector` inspector DOM-poking) and its `addFilter`. The existing normalize effect (`overlayMenu 'always' → 'mobile'`) + inspector Notice + server-side `is_priority_nav_enabled()` guard already cover the behavior. Migrate `useSetting` → `useSettings` (array signature).
+- `src/variation/components/dropdown-customizer-modal.js`, `panels/menu-items-panel.js`, `panels/menu-styles-panel.js`: `useSetting` → `useSettings`; `__experimentalBorderControl` → stable `BorderControl`; `__experimentalBorderBoxControl` → stable `BorderBoxControl`. ToolsPanel/ToolsPanelItem/SpacingSizesControl/BorderRadiusControl stay experimental (no stable exports in the installed versions) — leave imports as-is, and leave the global `no-unsafe-wp-apis` eslint disable in place (removing it is deferred tooling hygiene, out of scope).
+- readme.txt FAQ line about the greyed-out "Always" option updated to describe the normalize-to-Mobile behavior (rides with this stage since that's when behavior changes).
+- `npm run build` regenerates the tracked `build/` files.
+
+**Verification:** editor smoke test in the browser on the Studio site (variation inserts; Settings tab shows the Notice; clicking "Always" flips back to Mobile — confirmed via `wp.data` attribute inspection; Styles panels and the dropdown-customizer modal render; zero console errors). This exact walkthrough passed previously.
+
+## Stage D — Interactivity API: hands-on spike, then decision
+
+*Throwaway branch (`spike/interactivity-api`); nothing merges. No build-tool changes — the spike avoids the bundler entirely.*
+
+The written verdict (doc 05) says "adopt, phased." This stage pressure-tests it with working code:
+
+1. **Hand-authored ES module, no build step:** a small plain-JS `view-spike.js` (no JSX, no imports needing bundling) registered with `wp_register_script_module( 'priority-plus-navigation/spike', <src url>, array( '@wordpress/interactivity' ) )` — WP's import map resolves `@wordpress/interactivity` natively on WP 6.5+. The Studio site runs WP 7.0.1.
+2. **Directives via the Stage A processor:** in the render filter, set `data-wp-interactive="priority-plus-navigation"` and a `data-wp-context` (via `wp_interactivity_data_wp_context()`) carrying `moreLabel`/`overlayMenu`/`mobileCollapse`/`isOpen`.
+3. **Port a representative slice, not everything:** More-button toggle (`data-wp-on--click`, `data-wp-bind--aria-expanded`), Escape/click-outside (`data-wp-on-document--keydown` with `withSyncEvent`, focusout pattern), and the ResizeObserver measurement kernel hosted in `data-wp-init` with cleanup — the three shapes that decide whether the migration is pleasant or painful. The dropdown innerHTML rebuild stays untouched (its replacement is the v2.0 server-rendered-dropdown design, out of spike scope).
+4. **Evaluate against core's navigation view.js** (gutenberg checkout: `packages/block-library/src/navigation/view.js`) for store shape and the locked-store constraint (hamburger detection still needs the MutationObserver adapter — confirm in practice).
+5. **Deliverable:** an updated `planned-updates/05-interactivity-api-migration.md` "Spike findings" section with the validated (or revised) verdict, DX notes, and any WP-version gotchas — plus the spike branch left in place for reference. Frontend behavior on the main branch is unchanged.
+
+## Explicitly deferred (from the prior pass — do not re-apply)
+
+- wp-scripts 32 / ESLint flat config / `.nvmrc` bump / `package.json` script changes
+- PHPUnit scaffolding, phpcs.xml test exclusions, CI workflow changes
+- readme.txt `Requires` headers / plugin-header 6.4 bump (worth doing eventually — `wp_trigger_error` in the bootstrap requires WP 6.4 — but it's metadata, not alignment; note it in planned-updates and leave for a release-prep pass)
+
+## Execution & review flow
+
+One stage per commit on `update/gutenberg-alignment`, pausing after each for review before starting the next (A → B → C → D). Stage diffs: A = 1 file, B = 1 file, C = ~5 source files + ~4 build artifacts, D = separate branch only + one docs file on the main branch.
+
+Finally, update `planned-updates/README.md` with a short "Current staged scope" note reflecting this narrowed plan (rides with Stage A's commit).
+
+## Verification summary
+
+- Stages A/B: ad-hoc parity script + `studio wp eval` render/enqueue assertions + frontend page load in browser.
+- Stage C: `npm run build` + `npm run lint:js` (existing toolchain) + browser editor walkthrough.
+- Stage D: spike exercised in the browser on the Studio frontend (toggle, Escape, click-outside, resize), findings written up.
\ No newline at end of file
diff --git a/src/variation/components/color-tools-panel.js b/src/variation/components/color-tools-panel.js
new file mode 100644
index 0000000..a7f564c
--- /dev/null
+++ b/src/variation/components/color-tools-panel.js
@@ -0,0 +1,43 @@
+/**
+ * WordPress dependencies
+ */
+import {
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- ToolsPanel has no stable export yet; ubiquitous in core block UIs.
+	__experimentalToolsPanel as ToolsPanel,
+} from '@wordpress/components';
+
+/**
+ * ColorToolsPanel Component
+ *
+ * Replicates the private `ColorToolsPanel` wrapper that core uses for every
+ * block's "Color" panel (see Gutenberg's
+ * packages/block-editor/src/components/global-styles/color-panel.js — it is
+ * not exported from @wordpress/block-editor, so it is reproduced here from
+ * public ToolsPanel props). The `hasInnerWrapper` + inner wrapper div +
+ * first/last item classes are what give core's color panels their contiguous
+ * bordered-group appearance: the inner wrapper's row gap is zeroed by core's
+ * `.color-block-support-panel__inner-wrapper` stylesheet rule, and the
+ * first/last classes round the outer corners of the item group.
+ *
+ * @param {Object}   props          - Component props.
+ * @param {string}   props.label    - Panel heading.
+ * @param {Function} props.resetAll - Callback for the panel's "Reset all".
+ * @param {Element}  props.children - Panel contents (color dropdown items).
+ * @return {Element} Color tools panel component.
+ */
+export function ColorToolsPanel({ label, resetAll, children }) {
+	return (
+		<ToolsPanel
+			label={label}
+			resetAll={resetAll}
+			hasInnerWrapper
+			className="color-block-support-panel"
+			__experimentalFirstVisibleItemClass="first"
+			__experimentalLastVisibleItemClass="last"
+		>
+			<div className="color-block-support-panel__inner-wrapper">
+				{children}
+			</div>
+		</ToolsPanel>
+	);
+}
diff --git a/src/variation/components/panels/menu-color-panel.js b/src/variation/components/panels/menu-color-panel.js
index bbfea9e..ebe4052 100644
--- a/src/variation/components/panels/menu-color-panel.js
+++ b/src/variation/components/panels/menu-color-panel.js
@@ -1,12 +1,18 @@
 /**
  * WordPress dependencies
  */
-import { PanelColorSettings } from '@wordpress/block-editor';
+import {
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent; matches core's own navigation/edit color controls.
+	__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent; matches core's own navigation/edit color controls.
+	__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,
+} from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
  */
+import { ColorToolsPanel } from '../color-tools-panel';
 import { tokens } from '../../../tokens';
 
 /**
@@ -28,65 +34,118 @@ export function ColorPanel({ attributes, setAttributes }) {
 		priorityPlusMenuItemHoverTextColor,
 	} = attributes;
 
+	const colorGradientSettings = useMultipleOriginColorsAndGradients();
+
 	return (
-		<PanelColorSettings
-			title={__('Priority Plus Menu Colors', 'priority-plus-navigation')}
-			colorSettings={[
-				{
-					label: __('Background Color', 'priority-plus-navigation'),
-					value:
-						priorityPlusMenuBackgroundColor ||
+		<ColorToolsPanel
+			label={__('Priority Plus Menu Colors', 'priority-plus-navigation')}
+			resetAll={() =>
+				setAttributes({
+					priorityPlusMenuBackgroundColor:
 						tokens.dropdown.backgroundColor,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusMenuBackgroundColor:
-								color || tokens.dropdown.backgroundColor,
-						}),
-					enableAlpha: true,
-				},
-				{
-					label: __(
-						'Item Hover Background',
-						'priority-plus-navigation'
-					),
-					value:
-						priorityPlusMenuItemHoverBackground ||
+					priorityPlusMenuItemHoverBackground:
 						tokens.dropdown.item.hoverBackground,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusMenuItemHoverBackground:
-								color || tokens.dropdown.item.hoverBackground,
-						}),
-					enableAlpha: true,
-				},
-				{
-					label: __('Item Text Color', 'priority-plus-navigation'),
-					value:
-						priorityPlusMenuItemTextColor ||
+					priorityPlusMenuItemTextColor:
 						tokens.dropdown.item.textColor,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusMenuItemTextColor:
-								color || tokens.dropdown.item.textColor,
-						}),
-					enableAlpha: true,
-				},
-				{
-					label: __(
-						'Item Hover Text Color',
-						'priority-plus-navigation'
-					),
-					value:
-						priorityPlusMenuItemHoverTextColor ||
+					priorityPlusMenuItemHoverTextColor:
 						tokens.dropdown.item.hoverTextColor,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusMenuItemHoverTextColor:
-								color || tokens.dropdown.item.hoverTextColor,
-						}),
-					enableAlpha: true,
-				},
-			]}
-		/>
+				})
+			}
+		>
+			<ColorGradientSettingsDropdown
+				__experimentalIsRenderedInSidebar
+				settings={[
+					{
+						label: __(
+							'Background Color',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusMenuBackgroundColor ||
+							tokens.dropdown.backgroundColor,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusMenuBackgroundColor:
+									color || tokens.dropdown.backgroundColor,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusMenuBackgroundColor:
+									tokens.dropdown.backgroundColor,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+					{
+						label: __(
+							'Item Hover Background',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusMenuItemHoverBackground ||
+							tokens.dropdown.item.hoverBackground,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusMenuItemHoverBackground:
+									color ||
+									tokens.dropdown.item.hoverBackground,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusMenuItemHoverBackground:
+									tokens.dropdown.item.hoverBackground,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+					{
+						label: __(
+							'Item Text Color',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusMenuItemTextColor ||
+							tokens.dropdown.item.textColor,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusMenuItemTextColor:
+									color || tokens.dropdown.item.textColor,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusMenuItemTextColor:
+									tokens.dropdown.item.textColor,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+					{
+						label: __(
+							'Item Hover Text Color',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusMenuItemHoverTextColor ||
+							tokens.dropdown.item.hoverTextColor,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusMenuItemHoverTextColor:
+									color ||
+									tokens.dropdown.item.hoverTextColor,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusMenuItemHoverTextColor:
+									tokens.dropdown.item.hoverTextColor,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+				]}
+				{...colorGradientSettings}
+				gradients={[]}
+				disableCustomGradients
+			/>
+		</ColorToolsPanel>
 	);
 }
diff --git a/src/variation/components/panels/submenu-color-panel.js b/src/variation/components/panels/submenu-color-panel.js
index 51fb6e6..00c83cf 100644
--- a/src/variation/components/panels/submenu-color-panel.js
+++ b/src/variation/components/panels/submenu-color-panel.js
@@ -1,12 +1,18 @@
 /**
  * WordPress dependencies
  */
-import { PanelColorSettings } from '@wordpress/block-editor';
+import {
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent; matches core's own navigation/edit color controls.
+	__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent; matches core's own navigation/edit color controls.
+	__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,
+} from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 
 /**
  * Internal dependencies
  */
+import { ColorToolsPanel } from '../color-tools-panel';
 import { tokens } from '../../../tokens';
 
 /**
@@ -28,71 +34,123 @@ export function SubmenuColorPanel({ attributes, setAttributes }) {
 		priorityPlusSubmenuItemHoverTextColor,
 	} = attributes;
 
+	const colorGradientSettings = useMultipleOriginColorsAndGradients();
+
 	return (
-		<PanelColorSettings
-			title={__(
+		<ColorToolsPanel
+			label={__(
 				'Priority Plus Submenu Colors',
 				'priority-plus-navigation'
 			)}
-			colorSettings={[
-				{
-					label: __('Background Color', 'priority-plus-navigation'),
-					value:
-						priorityPlusSubmenuBackgroundColor ||
+			resetAll={() =>
+				setAttributes({
+					priorityPlusSubmenuBackgroundColor:
 						tokens.dropdown.submenu.backgroundColor,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusSubmenuBackgroundColor:
-								color ||
-								tokens.dropdown.submenu.backgroundColor,
-						}),
-					enableAlpha: true,
-				},
-				{
-					label: __(
-						'Item Hover Background',
-						'priority-plus-navigation'
-					),
-					value:
-						priorityPlusSubmenuItemHoverBackground ||
+					priorityPlusSubmenuItemHoverBackground:
 						tokens.dropdown.submenu.itemHoverBackground,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusSubmenuItemHoverBackground:
-								color ||
-								tokens.dropdown.submenu.itemHoverBackground,
-						}),
-					enableAlpha: true,
-				},
-				{
-					label: __('Item Text Color', 'priority-plus-navigation'),
-					value:
-						priorityPlusSubmenuItemTextColor ||
+					priorityPlusSubmenuItemTextColor:
 						tokens.dropdown.submenu.itemTextColor,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusSubmenuItemTextColor:
-								color || tokens.dropdown.submenu.itemTextColor,
-						}),
-					enableAlpha: true,
-				},
-				{
-					label: __(
-						'Item Hover Text Color',
-						'priority-plus-navigation'
-					),
-					value:
-						priorityPlusSubmenuItemHoverTextColor ||
+					priorityPlusSubmenuItemHoverTextColor:
 						tokens.dropdown.submenu.itemHoverTextColor,
-					onChange: (color) =>
-						setAttributes({
-							priorityPlusSubmenuItemHoverTextColor:
-								color ||
-								tokens.dropdown.submenu.itemHoverTextColor,
-						}),
-					enableAlpha: true,
-				},
-			]}
-		/>
+				})
+			}
+		>
+			<ColorGradientSettingsDropdown
+				__experimentalIsRenderedInSidebar
+				settings={[
+					{
+						label: __(
+							'Background Color',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusSubmenuBackgroundColor ||
+							tokens.dropdown.submenu.backgroundColor,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusSubmenuBackgroundColor:
+									color ||
+									tokens.dropdown.submenu.backgroundColor,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusSubmenuBackgroundColor:
+									tokens.dropdown.submenu.backgroundColor,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+					{
+						label: __(
+							'Item Hover Background',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusSubmenuItemHoverBackground ||
+							tokens.dropdown.submenu.itemHoverBackground,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusSubmenuItemHoverBackground:
+									color ||
+									tokens.dropdown.submenu.itemHoverBackground,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusSubmenuItemHoverBackground:
+									tokens.dropdown.submenu.itemHoverBackground,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+					{
+						label: __(
+							'Item Text Color',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusSubmenuItemTextColor ||
+							tokens.dropdown.submenu.itemTextColor,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusSubmenuItemTextColor:
+									color ||
+									tokens.dropdown.submenu.itemTextColor,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusSubmenuItemTextColor:
+									tokens.dropdown.submenu.itemTextColor,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+					{
+						label: __(
+							'Item Hover Text Color',
+							'priority-plus-navigation'
+						),
+						colorValue:
+							priorityPlusSubmenuItemHoverTextColor ||
+							tokens.dropdown.submenu.itemHoverTextColor,
+						onColorChange: (color) =>
+							setAttributes({
+								priorityPlusSubmenuItemHoverTextColor:
+									color ||
+									tokens.dropdown.submenu.itemHoverTextColor,
+							}),
+						resetAllFilter: () =>
+							setAttributes({
+								priorityPlusSubmenuItemHoverTextColor:
+									tokens.dropdown.submenu.itemHoverTextColor,
+							}),
+						enableAlpha: true,
+						isShownByDefault: true,
+					},
+				]}
+				{...colorGradientSettings}
+				gradients={[]}
+				disableCustomGradients
+			/>
+		</ColorToolsPanel>
 	);
 }
diff --git a/src/variation/controls.js b/src/variation/controls.js
index e04d061..a65786b 100644
--- a/src/variation/controls.js
+++ b/src/variation/controls.js
@@ -6,10 +6,15 @@ import { addFilter } from '@wordpress/hooks';
 
 import {
 	InspectorControls,
-	PanelColorSettings,
 	useSettings,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent exists yet; matches core block UIs.
 	__experimentalSpacingSizesControl as SpacingSizesControl,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent exists yet; matches core block UIs.
 	__experimentalBorderRadiusControl as BorderRadiusControl,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent; matches core's own navigation/edit color controls.
+	__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,
+	// eslint-disable-next-line @wordpress/no-unsafe-wp-apis -- No stable equivalent; matches core's own navigation/edit color controls.
+	__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,
 } from '@wordpress/block-editor';
 import {
 	TextControl,
@@ -29,6 +34,7 @@ import { useEffect, useRef, useState } from '@wordpress/element';
  */
 import { MoreButtonPreview } from './components/more-button-preview';
 import { DropdownCustomizerModal } from './components/dropdown-customizer-modal';
+import { ColorToolsPanel } from './components/color-tools-panel';
 import { tokens } from '../tokens';
 
 /**
@@ -132,6 +138,9 @@ const withPriorityPlusControls = createHigherOrderComponent((BlockEdit) => {
 			'color.palette'
 		);
 
+		// Theme/default color and gradient palettes for the button color dropdowns.
+		const colorGradientSettings = useMultipleOriginColorsAndGradients();
+
 		// Helper to check if border has values.
 		const hasBorderValue = () => {
 			if (!priorityPlusToggleBorder) {
@@ -374,67 +383,110 @@ const withPriorityPlusControls = createHigherOrderComponent((BlockEdit) => {
 							</Button>
 						</ToolsPanelItem>
 					</ToolsPanel>
-					<PanelColorSettings
-						title={__(
+					<ColorToolsPanel
+						label={__(
 							'Priority Plus Button Colors',
 							'priority-plus-navigation'
 						)}
-						colorSettings={[
-							{
-								label: __(
-									'Text Color',
-									'priority-plus-navigation'
-								),
-								value: priorityPlusToggleTextColor,
-								onChange: (color) =>
-									setAttributes({
-										priorityPlusToggleTextColor:
-											color || undefined,
-									}),
-								clearable: true,
-							},
-							{
-								label: __(
-									'Text Hover Color',
-									'priority-plus-navigation'
-								),
-								value: priorityPlusToggleTextColorHover,
-								onChange: (color) =>
-									setAttributes({
-										priorityPlusToggleTextColorHover:
-											color || undefined,
-									}),
-								clearable: true,
-							},
-							{
-								label: __(
-									'Background Color',
-									'priority-plus-navigation'
-								),
-								value: priorityPlusToggleBackgroundColor,
-								onChange: (color) =>
-									setAttributes({
-										priorityPlusToggleBackgroundColor:
-											color || undefined,
-									}),
-								clearable: true,
-							},
-							{
-								label: __(
-									'Background Hover Color',
-									'priority-plus-navigation'
-								),
-								value: priorityPlusToggleBackgroundColorHover,
-								onChange: (color) =>
-									setAttributes({
-										priorityPlusToggleBackgroundColorHover:
-											color || undefined,
-									}),
-								clearable: true,
-								enableAlpha: true,
-							},
-						]}
-					/>
+						resetAll={() =>
+							setAttributes({
+								priorityPlusToggleTextColor: undefined,
+								priorityPlusToggleTextColorHover: undefined,
+								priorityPlusToggleBackgroundColor: undefined,
+								priorityPlusToggleBackgroundColorHover:
+									undefined,
+							})
+						}
+					>
+						<ColorGradientSettingsDropdown
+							__experimentalIsRenderedInSidebar
+							settings={[
+								{
+									label: __(
+										'Text Color',
+										'priority-plus-navigation'
+									),
+									colorValue: priorityPlusToggleTextColor,
+									onColorChange: (color) =>
+										setAttributes({
+											priorityPlusToggleTextColor:
+												color || undefined,
+										}),
+									resetAllFilter: () =>
+										setAttributes({
+											priorityPlusToggleTextColor:
+												undefined,
+										}),
+									clearable: true,
+									isShownByDefault: true,
+								},
+								{
+									label: __(
+										'Text Hover Color',
+										'priority-plus-navigation'
+									),
+									colorValue:
+										priorityPlusToggleTextColorHover,
+									onColorChange: (color) =>
+										setAttributes({
+											priorityPlusToggleTextColorHover:
+												color || undefined,
+										}),
+									resetAllFilter: () =>
+										setAttributes({
+											priorityPlusToggleTextColorHover:
+												undefined,
+										}),
+									clearable: true,
+									isShownByDefault: true,
+								},
+								{
+									label: __(
+										'Background Color',
+										'priority-plus-navigation'
+									),
+									colorValue:
+										priorityPlusToggleBackgroundColor,
+									onColorChange: (color) =>
+										setAttributes({
+											priorityPlusToggleBackgroundColor:
+												color || undefined,
+										}),
+									resetAllFilter: () =>
+										setAttributes({
+											priorityPlusToggleBackgroundColor:
+												undefined,
+										}),
+									clearable: true,
+									isShownByDefault: true,
+								},
+								{
+									label: __(
+										'Background Hover Color',
+										'priority-plus-navigation'
+									),
+									colorValue:
+										priorityPlusToggleBackgroundColorHover,
+									onColorChange: (color) =>
+										setAttributes({
+											priorityPlusToggleBackgroundColorHover:
+												color || undefined,
+										}),
+									resetAllFilter: () =>
+										setAttributes({
+											priorityPlusToggleBackgroundColorHover:
+												undefined,
+										}),
+									clearable: true,
+									enableAlpha: true,
+									isShownByDefault: true,
+								},
+							]}
+							{...colorGradientSettings}
+							gradients={[]}
+							disableCustomGradients
+						/>
+					</ColorToolsPanel>
 					<ToolsPanel
 						label={__(
 							'Priority Plus Button Spacing',

From a0194f33d429bada6d626549d5f5351b4c42deab Mon Sep 17 00:00:00 2001
From: Troy Chaplin <troy.chaplin@gmail.com>
Date: Wed, 15 Jul 2026 23:18:31 -0300
Subject: [PATCH 6/6] update changelog

---
 CHANGELOG.md | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 84c7e64..cb50eb5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -16,6 +16,16 @@ Prefix the change with one of these keywords:
 
 ## [Unreleased]
 
+-   _Added_: `ColorToolsPanel` component replicating core's private color panel wrapper (`color-block-support-panel` class, `hasInnerWrapper`, first/last item classes) for identical grouped-item styling
+-   _Changed_: Migrated `useSetting` to `useSettings` (stable block editor API)
+-   _Changed_: Border controls updated to use stable `BorderBoxControl` and `BorderRadiusControl` imports, replacing experimental aliases
+-   _Changed_: Replaced `PanelColorSettings` with `ColorGradientSettingsDropdown` and `useMultipleOriginColorsAndGradients` in the button color panel, menu color panel, and submenu color panel — matches core's own color control pattern and restores the CSS grid layout shared by all other panels
+-   _Changed_: Replaced regex-based HTML attribute injection in `Block_Renderer` with `WP_HTML_Tag_Processor`, aligning with core's own render-block pattern
+-   _Changed_: Frontend assets now register early on `wp_enqueue_scripts` and enqueue at render time, so scripts and styles only load on pages that contain a Priority+ navigation block
+-   _Changed_: Updated FAQ entry for the "Always" overlay option to reflect the new normalize-to-mobile behaviour
+-   _Removed_: `addDisableAlwaysOption` HOC that manipulated the DOM to disable the "Always" overlay button; selecting "Always" now normalizes back to "Mobile" via an effect, with an explanatory inspector notice
+
+
 ## [1.1.0]
 
 -   _Added_: Editor preview of the More button that reflects label, colors, and padding settings