From 6c8a7260ecb8d70c343fb055a373aa8cbe743537 Mon Sep 17 00:00:00 2001
From: dev <info@activething.com>
Date: Sat, 6 Jun 2026 01:42:54 +0200
Subject: [PATCH] perf(eidos): code-split 7 menu recipes + order-independent
 menu-indicator (Phase 3, batch 2)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

dropdown-menu context-menu menubar command listbox navigation-menu
grid-list now self-import their recipes; removed from index.css.

menu-indicator.css (shared by dropdown/context checkbox+radio rows) had
a load-ORDER dependency: its longhand padding-inline-start (0,1,0) only
beat the menu row's padding-inline shorthand (0,1,0) by coming later in
the aggregate. Code-splitting breaks that order, so the partial is made
ORDER-INDEPENDENT via a specificity bump (doubled attribute → 0,2,0).
It now travels in dropdown-menu/context-menu's chunk (imported from their
.svelte) instead of the foundation. Verified in browser: checkbox item
padding-inline-start = 26px (indicator wins), plain item = 8px.

index.css 58→51 @imports. Monolith 666,436→633,277 raw (−33 KB) /
90,381→86,535 gz (−3.8 KB). check 0 errors.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 src/uix/eidos/components/command/command.svelte   |  1 +
 .../components/context-menu/context-menu.svelte   |  4 ++++
 .../components/dropdown-menu/dropdown-menu.svelte |  4 ++++
 .../eidos/components/grid-list/grid-list.svelte   |  1 +
 src/uix/eidos/components/listbox/listbox.svelte   |  1 +
 src/uix/eidos/components/menubar/menubar.svelte   |  1 +
 .../navigation-menu/navigation-menu.svelte        |  1 +
 src/uix/eidos/index.css                           | 11 -----------
 src/uix/eidos/lib/menu-indicator.css              | 15 ++++++++++-----
 9 files changed, 23 insertions(+), 16 deletions(-)

diff --git a/src/uix/eidos/components/command/command.svelte b/src/uix/eidos/components/command/command.svelte
index 554a43446..6f68a659b 100644
--- a/src/uix/eidos/components/command/command.svelte
+++ b/src/uix/eidos/components/command/command.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './command.css';
 	/**
 	 * Eidos `<Command>` — root of the ⌘K palette. Wraps Soma's
 	 * `<Command.Provider>` adding:
diff --git a/src/uix/eidos/components/context-menu/context-menu.svelte b/src/uix/eidos/components/context-menu/context-menu.svelte
index 34ab3a9b4..4df58bd41 100644
--- a/src/uix/eidos/components/context-menu/context-menu.svelte
+++ b/src/uix/eidos/components/context-menu/context-menu.svelte
@@ -1,4 +1,8 @@
 <script lang="ts">
+	import './context-menu.css';
+	// Shared menu-item indicator (checkbox/radio rows). Order-independent via
+	// specificity, so it can travel in this chunk instead of the foundation.
+	import '$uix/eidos/lib/menu-indicator.css';
 	/**
 	 * Eidos `<ContextMenu>` — root provider. Pass-through over soma.
 	 *
diff --git a/src/uix/eidos/components/dropdown-menu/dropdown-menu.svelte b/src/uix/eidos/components/dropdown-menu/dropdown-menu.svelte
index a296cbad9..d813782ba 100644
--- a/src/uix/eidos/components/dropdown-menu/dropdown-menu.svelte
+++ b/src/uix/eidos/components/dropdown-menu/dropdown-menu.svelte
@@ -1,4 +1,8 @@
 <script lang="ts">
+	import './dropdown-menu.css';
+	// Shared menu-item indicator (checkbox/radio rows). Order-independent via
+	// specificity, so it can travel in this chunk instead of the foundation.
+	import '$uix/eidos/lib/menu-indicator.css';
 	/**
 	 * Eidos `<DropdownMenu>` — root provider. Pass-through over soma.
 	 * Children compose via the namespace attached in `index.ts`:
diff --git a/src/uix/eidos/components/grid-list/grid-list.svelte b/src/uix/eidos/components/grid-list/grid-list.svelte
index 3dd0acbff..d55d34993 100644
--- a/src/uix/eidos/components/grid-list/grid-list.svelte
+++ b/src/uix/eidos/components/grid-list/grid-list.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './grid-list.css';
 	/**
 	 * Eidos `<GridList>` — selectable list with `role="grid"` semantics.
 	 *
diff --git a/src/uix/eidos/components/listbox/listbox.svelte b/src/uix/eidos/components/listbox/listbox.svelte
index ef6be266c..60b45b534 100644
--- a/src/uix/eidos/components/listbox/listbox.svelte
+++ b/src/uix/eidos/components/listbox/listbox.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './listbox.css';
 	/**
 	 * Eidos `<Listbox>` — visual wrapper over Soma's `<Listbox.Provider>`.
 	 *
diff --git a/src/uix/eidos/components/menubar/menubar.svelte b/src/uix/eidos/components/menubar/menubar.svelte
index c58e4f6be..23e625f8c 100644
--- a/src/uix/eidos/components/menubar/menubar.svelte
+++ b/src/uix/eidos/components/menubar/menubar.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './menubar.css';
 	/**
 	 * Eidos `<Menubar>` — desktop File / Edit / View bar. Wraps soma's
 	 * `<Menubar.Provider>` and stamps `data-size` on the bar element.
diff --git a/src/uix/eidos/components/navigation-menu/navigation-menu.svelte b/src/uix/eidos/components/navigation-menu/navigation-menu.svelte
index 4aeb5cf6e..4761c86e3 100644
--- a/src/uix/eidos/components/navigation-menu/navigation-menu.svelte
+++ b/src/uix/eidos/components/navigation-menu/navigation-menu.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './navigation-menu.css';
 	/**
 	 * Eidos `<NavigationMenu>` — top-level site navigation with mega-menus.
 	 *
diff --git a/src/uix/eidos/index.css b/src/uix/eidos/index.css
index 2b80e5ded..7280e1c24 100644
--- a/src/uix/eidos/index.css
+++ b/src/uix/eidos/index.css
@@ -78,18 +78,7 @@
 @import './components/section/section.css';
 @import './components/aspect-ratio/aspect-ratio.css';
 @import './components/auto-grid/auto-grid.css';
-@import './components/dropdown-menu/dropdown-menu.css';
-@import './components/context-menu/context-menu.css';
-@import './components/menubar/menubar.css';
-@import './components/command/command.css';
-@import './components/listbox/listbox.css';
-@import './components/navigation-menu/navigation-menu.css';
-@import './components/grid-list/grid-list.css';
 @import './components/time-range-field/time-range-field.css';
-/* Shared menu-item indicator partial — must load AFTER the menu recipes
-   so its `padding-inline-start` calc wins over the row rule's
-   `padding-inline` shorthand at equal specificity. */
-@import './lib/menu-indicator.css';
 @import './components/date-range-field/date-range-field.css';
 @import './components/field/field.css';
 @import './components/form/form.css';
diff --git a/src/uix/eidos/lib/menu-indicator.css b/src/uix/eidos/lib/menu-indicator.css
index 0cb0cafff..a792e0607 100644
--- a/src/uix/eidos/lib/menu-indicator.css
+++ b/src/uix/eidos/lib/menu-indicator.css
@@ -35,11 +35,16 @@
  * rendered inside a menu chrome.
  */
 
-/* Reserve the indicator slot. */
-[data-context-menu-checkbox-item],
-[data-context-menu-radio-item],
-[data-dropdown-menu-checkbox-item],
-[data-dropdown-menu-radio-item] {
+/* Reserve the indicator slot.
+   Selectors are DOUBLED (`[x][x]` → specificity 0,2,0) so this longhand
+   `padding-inline-start` beats the menu recipe's `padding-inline` shorthand
+   (0,1,0) REGARDLESS of load order. Required now that menu recipes are
+   code-split: this partial loads with its own chunk and may resolve before or
+   after the menu recipe; the specificity bump removes the order dependency. */
+[data-context-menu-checkbox-item][data-context-menu-checkbox-item],
+[data-context-menu-radio-item][data-context-menu-radio-item],
+[data-dropdown-menu-checkbox-item][data-dropdown-menu-checkbox-item],
+[data-dropdown-menu-radio-item][data-dropdown-menu-radio-item] {
 	--_menu-indicator-size: 0.875rem;
 	--_menu-indicator-radius: 0.2rem;
 	--_menu-indicator-color: var(--color-primary-solid);