From 308f638833e312b373fb4c1308173b86140eec66 Mon Sep 17 00:00:00 2001
From: dev <info@activething.com>
Date: Sat, 6 Jun 2026 00:54:58 +0200
Subject: [PATCH] perf(eidos): de-duplicate the 10 self-importing components
 from index.css
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Bundle Phase 0. The 10 components that already `import './x.css'` from
their `.svelte` (badge, card, image, password-field, s-text,
s-text-virtual-list, scroll-frames, skeleton, spinner, textarea) were
ALSO @import-ed in index.css — shipping their CSS twice (verified: badge
in both its own chunk and the 851 KB monolith). Removed their @import
lines so they ship only as code-split chunks; added a policy comment so
they're not re-added. Build green (1m21s).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 src/uix/eidos/index.css | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/src/uix/eidos/index.css b/src/uix/eidos/index.css
index 60a93bd2e..a9f87fbda 100644
--- a/src/uix/eidos/index.css
+++ b/src/uix/eidos/index.css
@@ -61,6 +61,14 @@
 
 /* ── Component recipes ──────────────────────────────────────────────────── */
 /* Layout primitives load first so component recipes can layer on top of them. */
+/*
+ * Code-split components are intentionally NOT aggregated here: they import
+ * their own CSS from their `.svelte`, so Vite emits a per-component chunk that
+ * loads only when the component mounts. Do NOT re-add their `@import` here or
+ * the CSS double-loads (aggregate + chunk). Currently code-split:
+ *   badge · card · image · password-field · s-text · s-text-virtual-list ·
+ *   scroll-frames · skeleton · spinner · textarea
+ */
 @import './components/box/box.css';
 @import './components/flex/flex.css';
 @import './components/grid/grid.css';
@@ -78,9 +86,6 @@
 @import './components/separator/separator.css';
 @import './components/splitter/splitter.css';
 @import './components/text/text.css';
-@import './components/s-text/s-text.css';
-@import './components/s-text-virtual-list/s-text-virtual-list.css';
-@import './components/scroll-frames/scroll-frames.css';
 @import './components/heading/heading.css';
 @import './components/display/display.css';
 @import './components/code/code.css';
@@ -90,11 +95,8 @@
 @import './components/highlight/highlight.css';
 @import './components/link/link.css';
 @import './components/icon/icon.css';
-@import './components/image/image.css';
 @import './components/avatar/avatar.css';
-@import './components/badge/badge.css';
 @import './components/breadcrumb/breadcrumb.css';
-@import './components/card/card.css';
 @import './components/toast/toast.css';
 @import './components/dialog/dialog.css';
 @import './components/alert-dialog/alert-dialog.css';
@@ -165,7 +167,3 @@
 @import './components/announce/announce.css';
 @import './components/clipboard/clipboard.css';
 @import './components/drag-drop/drag-drop.css';
-@import './components/password-field/password-field.css';
-@import './components/textarea/textarea.css';
-@import './components/skeleton/skeleton.css';
-@import './components/spinner/spinner.css';