From 25718db38604481fd98d4b069738a282b1b4a1da Mon Sep 17 00:00:00 2001
From: "Anthony Fu (via agent)" <reg-github-bot@antfu.me>
Date: Tue, 14 Jul 2026 05:02:31 +0000
Subject: [PATCH 1/4] refactor(ui): consolidate getPluginColor branding palette
 into devtools-ui

Move the canonical predefinedColorMap/getPluginColor (branding hues,
hex-vs-hue branch) from packages/rolldown/src/app/utils/color.ts into
packages/ui/src/utils/color.ts, merging its test cases. Both rolldown
and vite apps now import getPluginColor from @vitejs/devtools-ui/utils/color
instead of maintaining their own copies. vite's palette previously
dropped the bailout/vite1/vite2/rolldown/nuxt branding hues; it now
matches rolldown's.
---
 .../display/HighlightedPackageName.ts         |  2 +-
 .../app/components/display/HighlightedPath.ts |  2 +-
 .../src/app/utils/__tests__/color.test.ts     | 20 --------
 packages/rolldown/src/app/utils/color.ts      | 46 -------------------
 packages/ui/src/utils/__tests__/color.test.ts | 19 +++++++-
 packages/ui/src/utils/color.ts                | 36 +++++++++++++--
 .../app/components/display/HighlightedPath.ts |  2 +-
 packages/vite/src/app/utils/color.ts          | 16 -------
 8 files changed, 54 insertions(+), 89 deletions(-)
 delete mode 100644 packages/rolldown/src/app/utils/__tests__/color.test.ts
 delete mode 100644 packages/rolldown/src/app/utils/color.ts
 delete mode 100644 packages/vite/src/app/utils/color.ts

diff --git a/packages/rolldown/src/app/components/display/HighlightedPackageName.ts b/packages/rolldown/src/app/components/display/HighlightedPackageName.ts
index 6fd18e10..0ec1d0be 100644
--- a/packages/rolldown/src/app/components/display/HighlightedPackageName.ts
+++ b/packages/rolldown/src/app/components/display/HighlightedPackageName.ts
@@ -1,6 +1,6 @@
+import { getPluginColor } from '@vitejs/devtools-ui/utils/color'
 import { defineComponent, h } from 'vue'
 import { isPackageName } from '~~/shared/utils/filepath'
-import { getPluginColor } from '~/utils/color'
 
 // @unocss-include
 export default defineComponent({
diff --git a/packages/rolldown/src/app/components/display/HighlightedPath.ts b/packages/rolldown/src/app/components/display/HighlightedPath.ts
index 07e790ca..bdd09b7c 100644
--- a/packages/rolldown/src/app/components/display/HighlightedPath.ts
+++ b/packages/rolldown/src/app/components/display/HighlightedPath.ts
@@ -1,5 +1,5 @@
+import { getPluginColor } from '@vitejs/devtools-ui/utils/color'
 import { defineComponent, h } from 'vue'
-import { getPluginColor } from '~/utils/color'
 
 // @unocss-include
 export default defineComponent({
diff --git a/packages/rolldown/src/app/utils/__tests__/color.test.ts b/packages/rolldown/src/app/utils/__tests__/color.test.ts
deleted file mode 100644
index 710d9c50..00000000
--- a/packages/rolldown/src/app/utils/__tests__/color.test.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { getHashColorFromString, getHsla } from '@vitejs/devtools-ui/utils/color'
-import { describe, expect, it } from 'vitest'
-import { getPluginColor, predefinedColorMap } from '../color'
-
-describe('getPluginColor', () => {
-  it('should use predefinedColorMap with known name', () => {
-    for (const name in predefinedColorMap) {
-      if (Object.hasOwn(predefinedColorMap, name)
-        && name === name.replace(/[^a-z]+/gi, '').toLowerCase()) {
-        if (typeof predefinedColorMap[name] === 'number') {
-          expect(getPluginColor(`8080-=(🤔)${name}`)).toBe(getHsla(predefinedColorMap[name]))
-        }
-      }
-    }
-  })
-
-  it('should use getHashColorFromString with unknown name', () => {
-    expect(getPluginColor('😄Foo')).toBe(getHashColorFromString('foo'))
-  })
-})
diff --git a/packages/rolldown/src/app/utils/color.ts b/packages/rolldown/src/app/utils/color.ts
deleted file mode 100644
index 5cbcb874..00000000
--- a/packages/rolldown/src/app/utils/color.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-import { getHashColorFromString, getHsla } from '@vitejs/devtools-ui/utils/color'
-
-/**
- * Predefined color map for matching the branding
- *
- * Accept a 6-digit hex color string or a hue number
- * Hue numbers are preferred because they will adapt better contrast in light/dark mode
- *
- * Hue numbers reference:
- * - 0: red
- * - 30: orange
- * - 60: yellow
- * - 120: green
- * - 180: cyan
- * - 240: blue
- * - 270: purple
- */
-export const predefinedColorMap = {
-  error: 0,
-  client: 60,
-  bailout: -1,
-  ssr: 270,
-  vite: 250,
-  vite1: 240,
-  vite2: 120,
-  rolldown: 18,
-  virtual: 160,
-  nuxt: 140,
-} as Record<string, number>
-
-export function getPluginColor(name: string, opacity = 1): string {
-  name = name.replace(/[^a-z]+/gi, '').toLowerCase()
-  if (name in predefinedColorMap) {
-    const color = predefinedColorMap[name]!
-    if (typeof color === 'number') {
-      return getHsla(color, opacity)
-    }
-    else {
-      if (opacity === 1)
-        return color
-      const opacityHex = Math.floor(opacity * 255).toString(16).padStart(2, '0')
-      return color + opacityHex
-    }
-  }
-  return getHashColorFromString(name, opacity)
-}
diff --git a/packages/ui/src/utils/__tests__/color.test.ts b/packages/ui/src/utils/__tests__/color.test.ts
index b8baa0dc..d98d8773 100644
--- a/packages/ui/src/utils/__tests__/color.test.ts
+++ b/packages/ui/src/utils/__tests__/color.test.ts
@@ -1,6 +1,6 @@
 import { isDark } from '@vitejs/devtools-ui/composables/dark'
 import { beforeEach, describe, expect, it } from 'vitest'
-import { getHashColorFromString, getHsla } from '../color'
+import { getHashColorFromString, getHsla, getPluginColor, predefinedColorMap } from '../color'
 
 describe('getHashColorFromString', () => {
   it('should get the same color with the same string', () => {
@@ -34,3 +34,20 @@ describe('getHsla', () => {
     expect(getHsla(180, 0.8)).toBe('hsla(180, 50%, 60%, 0.8)')
   })
 })
+
+describe('getPluginColor', () => {
+  it('should use predefinedColorMap with known name', () => {
+    for (const name in predefinedColorMap) {
+      if (Object.hasOwn(predefinedColorMap, name)
+        && name === name.replace(/[^a-z]+/gi, '').toLowerCase()) {
+        if (typeof predefinedColorMap[name] === 'number') {
+          expect(getPluginColor(`8080-=(🤔)${name}`)).toBe(getHsla(predefinedColorMap[name]))
+        }
+      }
+    }
+  })
+
+  it('should use getHashColorFromString with unknown name', () => {
+    expect(getPluginColor('😄Foo')).toBe(getHashColorFromString('foo'))
+  })
+})
diff --git a/packages/ui/src/utils/color.ts b/packages/ui/src/utils/color.ts
index 306ff735..48249efa 100644
--- a/packages/ui/src/utils/color.ts
+++ b/packages/ui/src/utils/color.ts
@@ -20,17 +20,47 @@ export function getHsla(
   return `hsla(${hue}, ${saturation}%, ${lightness}%, ${opacity})`
 }
 
-export const predefinedPluginColorMap = {
+/**
+ * Predefined color map for matching the branding
+ *
+ * Accept a 6-digit hex color string or a hue number
+ * Hue numbers are preferred because they will adapt better contrast in light/dark mode
+ *
+ * Hue numbers reference:
+ * - 0: red
+ * - 30: orange
+ * - 60: yellow
+ * - 120: green
+ * - 180: cyan
+ * - 240: blue
+ * - 270: purple
+ */
+export const predefinedColorMap = {
   error: 0,
   client: 60,
+  bailout: -1,
   ssr: 270,
   vite: 250,
+  vite1: 240,
+  vite2: 120,
+  rolldown: 18,
   virtual: 160,
+  nuxt: 140,
 } as Record<string, number>
 
 export function getPluginColor(name: string, opacity = 1): string {
   name = name.replace(/[^a-z]+/gi, '').toLowerCase()
-  if (name in predefinedPluginColorMap)
-    return getHsla(predefinedPluginColorMap[name]!, opacity)
+  if (name in predefinedColorMap) {
+    const color = predefinedColorMap[name]!
+    if (typeof color === 'number') {
+      return getHsla(color, opacity)
+    }
+    else {
+      if (opacity === 1)
+        return color
+      const opacityHex = Math.floor(opacity * 255).toString(16).padStart(2, '0')
+      return color + opacityHex
+    }
+  }
   return getHashColorFromString(name, opacity)
 }
diff --git a/packages/vite/src/app/components/display/HighlightedPath.ts b/packages/vite/src/app/components/display/HighlightedPath.ts
index 21405e20..ef4c7dba 100644
--- a/packages/vite/src/app/components/display/HighlightedPath.ts
+++ b/packages/vite/src/app/components/display/HighlightedPath.ts
@@ -1,5 +1,5 @@
+import { getPluginColor } from '@vitejs/devtools-ui/utils/color'
 import { defineComponent, h } from 'vue'
-import { getPluginColor } from '~/utils/color'
 
 // @unocss-include
 export default defineComponent({
diff --git a/packages/vite/src/app/utils/color.ts b/packages/vite/src/app/utils/color.ts
deleted file mode 100644
index b2bc84c4..00000000
--- a/packages/vite/src/app/utils/color.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import { getHashColorFromString, getHsla } from '@vitejs/devtools-ui/utils/color'
-
-export const predefinedColorMap = {
-  error: 0,
-  client: 60,
-  ssr: 270,
-  vite: 250,
-  virtual: 160,
-} as Record<string, number>
-
-export function getPluginColor(name: string, opacity = 1): string {
-  name = name.replace(/[^a-z]+/gi, '').toLowerCase()
-  if (name in predefinedColorMap)
-    return getHsla(predefinedColorMap[name]!, opacity)
-  return getHashColorFromString(name, opacity)
-}

From 43165c046ea10376f1319d44e083e52c351ae335 Mon Sep 17 00:00:00 2001
From: "Anthony Fu (via agent)" <reg-github-bot@antfu.me>
Date: Tue, 14 Jul 2026 05:02:50 +0000
Subject: [PATCH 2/4] refactor(ui): consolidate format utils
 (bytesToHumanSize/toTree/normalizeTimestamp) into devtools-ui

Move bytesToHumanSize, getContentByteSize, toTree and normalizeTimestamp
from the duplicated packages/{rolldown,vite}/src/app/utils/format.ts
into packages/ui/src/utils/format.ts alongside the existing
formatDuration, generalizing toTree/ModuleTreeNode over a generic
module-shape so both apps' own module types keep working unchanged.
Both apps now import these from @vitejs/devtools-ui/utils/format.
Folds in vite's bytes||1 guard against -Infinity on a 0-byte input,
and rolldown's defensive null checks in toTree, for both apps.
---
 .../src/app/components/assets/Folder.vue      |  2 +-
 .../app/components/chart/ModuleFlamegraph.vue |  2 +-
 .../src/app/components/compare/DeltaValue.vue |  2 +-
 .../src/app/components/compare/MetricCard.vue |  2 +-
 .../src/app/components/compare/TabView.vue    |  2 +-
 .../components/data/PluginDetailsLoader.vue   |  3 +-
 .../components/data/PluginDetailsTable.vue    |  2 +-
 .../app/components/display/FileSizeBadge.vue  |  2 +-
 .../src/app/components/modules/Folder.vue     |  2 +-
 .../rolldown/src/app/composables/chart.ts     |  2 +-
 packages/rolldown/src/app/utils/format.ts     | 72 ----------------
 .../src}/utils/__tests__/format.test.ts       | 35 +++++++-
 packages/ui/src/utils/format.ts               | 82 +++++++++++++++++++
 .../app/components/chart/ModuleFlamegraph.vue |  2 +-
 .../components/data/PluginDetailsLoader.vue   |  3 +-
 .../components/data/PluginDetailsTable.vue    |  2 +-
 .../app/components/display/FileSizeBadge.vue  |  2 +-
 .../src/app/components/modules/Folder.vue     |  2 +-
 packages/vite/src/app/composables/chart.ts    |  2 +-
 packages/vite/src/app/utils/format.ts         | 61 --------------
 20 files changed, 131 insertions(+), 153 deletions(-)
 delete mode 100644 packages/rolldown/src/app/utils/format.ts
 rename packages/{rolldown/src/app => ui/src}/utils/__tests__/format.test.ts (70%)
 delete mode 100644 packages/vite/src/app/utils/format.ts

diff --git a/packages/rolldown/src/app/components/assets/Folder.vue b/packages/rolldown/src/app/components/assets/Folder.vue
index 6cab1344..af319f1d 100644
--- a/packages/rolldown/src/app/components/assets/Folder.vue
+++ b/packages/rolldown/src/app/components/assets/Folder.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { ModuleDest, RolldownAssetInfo, SessionContext } from '~~/shared/types'
+import { toTree } from '@vitejs/devtools-ui/utils/format'
 import { computed } from 'vue'
-import { toTree } from '../../utils/format'
 import DisplayVirtualTree from '../display/VirtualTree.vue'
 
 const props = defineProps<{
diff --git a/packages/rolldown/src/app/components/chart/ModuleFlamegraph.vue b/packages/rolldown/src/app/components/chart/ModuleFlamegraph.vue
index 74a00790..8357e020 100644
--- a/packages/rolldown/src/app/components/chart/ModuleFlamegraph.vue
+++ b/packages/rolldown/src/app/components/chart/ModuleFlamegraph.vue
@@ -8,9 +8,9 @@ import type {
   SessionContext,
 } from '~~/shared/types'
 import DisplayDuration from '@vitejs/devtools-ui/components/DisplayDuration.vue'
+import { normalizeTimestamp } from '@vitejs/devtools-ui/utils/format'
 import { Flamegraph, normalizeTreeNode } from 'nanovis'
 import { computed, nextTick, onMounted, onUnmounted, ref, shallowRef, useTemplateRef, watch } from 'vue'
-import { normalizeTimestamp } from '~/utils/format'
 
 const props = defineProps<{
   info: ModuleInfo
diff --git a/packages/rolldown/src/app/components/compare/DeltaValue.vue b/packages/rolldown/src/app/components/compare/DeltaValue.vue
index 1ca4d3ec..59990da4 100644
--- a/packages/rolldown/src/app/components/compare/DeltaValue.vue
+++ b/packages/rolldown/src/app/components/compare/DeltaValue.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
+import { bytesToHumanSize } from '@vitejs/devtools-ui/utils/format'
 import { computed } from 'vue'
-import { bytesToHumanSize } from '~/utils/format'
 
 const props = withDefaults(defineProps<{
   value: number
diff --git a/packages/rolldown/src/app/components/compare/MetricCard.vue b/packages/rolldown/src/app/components/compare/MetricCard.vue
index 7e42f148..a176ce0a 100644
--- a/packages/rolldown/src/app/components/compare/MetricCard.vue
+++ b/packages/rolldown/src/app/components/compare/MetricCard.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
+import { bytesToHumanSize } from '@vitejs/devtools-ui/utils/format'
 import { computed } from 'vue'
-import { bytesToHumanSize } from '~/utils/format'
 
 const props = defineProps<{
   name: string
diff --git a/packages/rolldown/src/app/components/compare/TabView.vue b/packages/rolldown/src/app/components/compare/TabView.vue
index b8fbe034..1dcd88c4 100644
--- a/packages/rolldown/src/app/components/compare/TabView.vue
+++ b/packages/rolldown/src/app/components/compare/TabView.vue
@@ -5,8 +5,8 @@ import type {
   SessionCompareDetails,
   SessionCompareMetricValue,
 } from '~~/shared/types'
+import { bytesToHumanSize } from '@vitejs/devtools-ui/utils/format'
 import { computed, ref, watch } from 'vue'
-import { bytesToHumanSize } from '~/utils/format'
 
 type CompareTab = 'overview' | 'plugins' | 'chunks' | 'assets' | 'packages'
 type DiffMode = 'changed' | 'added' | 'removed'
diff --git a/packages/rolldown/src/app/components/data/PluginDetailsLoader.vue b/packages/rolldown/src/app/components/data/PluginDetailsLoader.vue
index 3003691d..228805eb 100644
--- a/packages/rolldown/src/app/components/data/PluginDetailsLoader.vue
+++ b/packages/rolldown/src/app/components/data/PluginDetailsLoader.vue
@@ -7,7 +7,7 @@ import DisplayDuration from '@vitejs/devtools-ui/components/DisplayDuration.vue'
 import DisplayNumberBadge from '@vitejs/devtools-ui/components/DisplayNumberBadge.vue'
 import DisplayPluginName from '@vitejs/devtools-ui/components/DisplayPluginName.vue'
 import PluginsSunburst from '@vitejs/devtools-ui/components/PluginsSunburst.vue'
-import { formatDuration } from '@vitejs/devtools-ui/utils/format'
+import { formatDuration, normalizeTimestamp } from '@vitejs/devtools-ui/utils/format'
 import { useAsyncState, useMouse } from '@vueuse/core'
 import { normalizeTreeNode, Sunburst } from 'nanovis'
 import { computed, reactive, watch } from 'vue'
@@ -16,7 +16,6 @@ import { useRoute } from '#app/composables/router'
 import { useRpc } from '#imports'
 import { useChartGraph } from '~/composables/chart'
 import { parseReadablePath } from '~/utils/filepath'
-import { normalizeTimestamp } from '~/utils/format'
 import { getFileTypeFromModuleId, ModuleTypeRules } from '~/utils/icon'
 
 const props = defineProps<{
diff --git a/packages/rolldown/src/app/components/data/PluginDetailsTable.vue b/packages/rolldown/src/app/components/data/PluginDetailsTable.vue
index 1b737415..ce0bc243 100644
--- a/packages/rolldown/src/app/components/data/PluginDetailsTable.vue
+++ b/packages/rolldown/src/app/components/data/PluginDetailsTable.vue
@@ -4,11 +4,11 @@ import type { FilterMatchRule } from '~/utils/icon'
 import DataVirtualList from '@vitejs/devtools-ui/components/DataVirtualList.vue'
 import DisplayBadge from '@vitejs/devtools-ui/components/DisplayBadge.vue'
 import DisplayDuration from '@vitejs/devtools-ui/components/DisplayDuration.vue'
+import { normalizeTimestamp } from '@vitejs/devtools-ui/utils/format'
 import { useCycleList } from '@vueuse/core'
 import { Menu as VMenu } from 'floating-vue'
 import { computed, ref } from 'vue'
 import { settings } from '~~/app/state/settings'
-import { normalizeTimestamp } from '~/utils/format'
 import { getFileTypeFromModuleId, ModuleTypeRules } from '~/utils/icon'
 
 const props = defineProps<{
diff --git a/packages/rolldown/src/app/components/display/FileSizeBadge.vue b/packages/rolldown/src/app/components/display/FileSizeBadge.vue
index cc0c185c..44388222 100644
--- a/packages/rolldown/src/app/components/display/FileSizeBadge.vue
+++ b/packages/rolldown/src/app/components/display/FileSizeBadge.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
+import { bytesToHumanSize } from '@vitejs/devtools-ui/utils/format'
 import { computed } from 'vue'
-import { bytesToHumanSize } from '~/utils/format'
 
 const props = withDefaults(
   defineProps<{
diff --git a/packages/rolldown/src/app/components/modules/Folder.vue b/packages/rolldown/src/app/components/modules/Folder.vue
index fe6f75b1..c2c0a8da 100644
--- a/packages/rolldown/src/app/components/modules/Folder.vue
+++ b/packages/rolldown/src/app/components/modules/Folder.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { ModuleDest, ModuleListItem, SessionContext } from '~~/shared/types'
+import { toTree } from '@vitejs/devtools-ui/utils/format'
 import { computed } from 'vue'
-import { toTree } from '../../utils/format'
 import DisplayVirtualTree from '../display/VirtualTree.vue'
 
 const props = defineProps<{
diff --git a/packages/rolldown/src/app/composables/chart.ts b/packages/rolldown/src/app/composables/chart.ts
index 734d0967..adaec6c7 100644
--- a/packages/rolldown/src/app/composables/chart.ts
+++ b/packages/rolldown/src/app/composables/chart.ts
@@ -1,10 +1,10 @@
 import type { GraphBase, GraphBaseOptions, TreeNode } from 'nanovis'
 import type { ComputedRef, MaybeRef } from 'vue'
 import { isDark } from '@vitejs/devtools-ui/composables/dark'
+import { bytesToHumanSize } from '@vitejs/devtools-ui/utils/format'
 import { createColorGetterSpectrum } from 'nanovis'
 import { computed, nextTick, onUnmounted, ref, shallowRef, unref, watch } from 'vue'
 import { settings } from '~/state/settings'
-import { bytesToHumanSize } from '~/utils/format'
 
 export interface ChartGraphOptions<T, I, N> {
   data: ComputedRef<T[]> | MaybeRef<T[]>
diff --git a/packages/rolldown/src/app/utils/format.ts b/packages/rolldown/src/app/utils/format.ts
deleted file mode 100644
index 30a9bfb6..00000000
--- a/packages/rolldown/src/app/utils/format.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-import type { ModuleDest, ModuleTreeNode } from '../../shared/types'
-
-export function bytesToHumanSize(bytes: number, digits = 2) {
-  const sizes = ['Bytes', 'kB', 'MB', 'GB', 'TB']
-  const i = Math.floor(Math.log(bytes) / Math.log(1000))
-  if (i === 0)
-    return [bytes, 'B']
-  return [(+(bytes / 1000 ** i).toFixed(digits)).toLocaleString(), sizes[i]]
-}
-
-export function getContentByteSize(content: string) {
-  if (!content)
-    return 0
-  return new TextEncoder().encode(content).length
-}
-
-export function toTree(modules: ModuleDest[], name: string) {
-  const node: ModuleTreeNode = { name, children: {}, items: [] }
-
-  function add(mod: ModuleDest, parts: string[], current = node) {
-    if (!mod)
-      return
-
-    if (parts.length <= 1) {
-      current.items.push(mod)
-      return
-    }
-
-    const first = parts.shift()!
-    if (!current.children[first])
-      current.children[first] = { name: first, children: {}, items: [] }
-    add(mod, parts, current.children[first])
-  }
-
-  modules.forEach((m) => {
-    const parts = m.path.split(/\//g).filter(Boolean)
-    add(m, parts)
-  })
-
-  function flat(node: ModuleTreeNode) {
-    if (!node)
-      return
-    const children = Object.values(node.children)
-    if (children.length === 1 && !node.items.length) {
-      const child = children[0]!
-      node.name = node.name ? `${node.name}/${child.name}` : child.name
-      node.items = child.items
-      node.children = child.children
-      flat(node)
-    }
-    else {
-      children.forEach(flat)
-    }
-  }
-
-  Object.values(node.children).forEach(flat)
-
-  return node
-}
-
-export function normalizeTimestamp(timestamp: number) {
-  return new Date(timestamp).toLocaleString(undefined, {
-    hour12: false,
-    year: 'numeric',
-    month: '2-digit',
-    day: '2-digit',
-    hour: '2-digit',
-    minute: '2-digit',
-    second: '2-digit',
-    fractionalSecondDigits: 3,
-  })
-}
diff --git a/packages/rolldown/src/app/utils/__tests__/format.test.ts b/packages/ui/src/utils/__tests__/format.test.ts
similarity index 70%
rename from packages/rolldown/src/app/utils/__tests__/format.test.ts
rename to packages/ui/src/utils/__tests__/format.test.ts
index 2b8333ad..95efb0c3 100644
--- a/packages/rolldown/src/app/utils/__tests__/format.test.ts
+++ b/packages/ui/src/utils/__tests__/format.test.ts
@@ -1,6 +1,33 @@
-import type { ModuleDest, ModuleTreeNode } from '../../../shared/types/data'
+import type { ModuleDest, ModuleTreeNode } from '../format'
 import { describe, expect, it } from 'vitest'
-import { bytesToHumanSize, getContentByteSize, toTree } from '../format'
+import { bytesToHumanSize, formatDuration, getContentByteSize, toTree } from '../format'
+
+describe('formatDuration', () => {
+  it('should return a placeholder for null/undefined', () => {
+    expect(formatDuration(null)).toEqual(['', '-'])
+    expect(formatDuration(undefined)).toEqual(['', '-'])
+  })
+
+  it('should format sub-millisecond durations', () => {
+    expect(formatDuration(0.5)).toEqual(['<1', 'ms'])
+  })
+
+  it('should format millisecond durations', () => {
+    expect(formatDuration(500)).toEqual(['500', 'ms'])
+  })
+
+  it('should format second durations', () => {
+    expect(formatDuration(1500)).toEqual(['1.5', 's'])
+  })
+
+  it('should format minute durations', () => {
+    expect(formatDuration(90000)).toEqual(['1.5', 'min'])
+  })
+
+  it('should stringify when requested', () => {
+    expect(formatDuration(500, true)).toBe('500 ms')
+  })
+})
 
 describe('bytesToHumanSize', () => {
   it('should return raw bytes (<1000)', () => {
@@ -19,6 +46,10 @@ describe('bytesToHumanSize', () => {
     expect(bytesToHumanSize(1000 * 1000 * 1.666, 1)).toEqual(['1.7', 'MB'])
   })
 
+  it('should not throw for 0 bytes', () => {
+    expect(bytesToHumanSize(0)).toEqual([0, 'B'])
+  })
+
   // larger...
 })
 
diff --git a/packages/ui/src/utils/format.ts b/packages/ui/src/utils/format.ts
index 8413cedf..2f1ac0d6 100644
--- a/packages/ui/src/utils/format.ts
+++ b/packages/ui/src/utils/format.ts
@@ -17,3 +17,85 @@ export function formatDuration(ms: number | null | undefined, stringify?: boolea
 
   return stringify ? duration.join(' ') : duration
 }
+
+export function bytesToHumanSize(bytes: number, digits = 2) {
+  const sizes = ['Bytes', 'kB', 'MB', 'GB', 'TB']
+  const i = Math.floor(Math.log(bytes || 1) / Math.log(1000))
+  if (i === 0)
+    return [bytes, 'B']
+  return [(+(bytes / 1000 ** i).toFixed(digits)).toLocaleString(), sizes[i]]
+}
+
+export function getContentByteSize(content: string) {
+  if (!content)
+    return 0
+  return new TextEncoder().encode(content).length
+}
+
+export interface ModuleDest {
+  full: string
+  path: string
+}
+
+export interface ModuleTreeNode<T extends { path: string } = ModuleDest> {
+  name?: string
+  children: Record<string, ModuleTreeNode<T>>
+  items: T[]
+}
+
+export function toTree<T extends { path: string }>(modules: T[], name: string): ModuleTreeNode<T> {
+  const node: ModuleTreeNode<T> = { name, children: {}, items: [] }
+
+  function add(mod: T, parts: string[], current = node) {
+    if (!mod)
+      return
+
+    if (parts.length <= 1) {
+      current.items.push(mod)
+      return
+    }
+
+    const first = parts.shift()!
+    if (!current.children[first])
+      current.children[first] = { name: first, children: {}, items: [] }
+    add(mod, parts, current.children[first])
+  }
+
+  modules.forEach((m) => {
+    const parts = m.path.split(/\//g).filter(Boolean)
+    add(m, parts)
+  })
+
+  function flat(node: ModuleTreeNode<T>) {
+    if (!node)
+      return
+    const children = Object.values(node.children)
+    if (children.length === 1 && !node.items.length) {
+      const child = children[0]!
+      node.name = node.name ? `${node.name}/${child.name}` : child.name
+      node.items = child.items
+      node.children = child.children
+      flat(node)
+    }
+    else {
+      children.forEach(flat)
+    }
+  }
+
+  Object.values(node.children).forEach(flat)
+
+  return node
+}
+
+export function normalizeTimestamp(timestamp: number) {
+  return new Date(timestamp).toLocaleString(undefined, {
+    hour12: false,
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+    second: '2-digit',
+    fractionalSecondDigits: 3,
+  })
+}
diff --git a/packages/vite/src/app/components/chart/ModuleFlamegraph.vue b/packages/vite/src/app/components/chart/ModuleFlamegraph.vue
index 9aa66eba..e155f6cd 100644
--- a/packages/vite/src/app/components/chart/ModuleFlamegraph.vue
+++ b/packages/vite/src/app/components/chart/ModuleFlamegraph.vue
@@ -2,9 +2,9 @@
 import type { TreeNodeInput } from 'nanovis'
 import type { ViteModuleListItem } from '~/types/modules'
 import DisplayDuration from '@vitejs/devtools-ui/components/DisplayDuration.vue'
+import { normalizeTimestamp } from '@vitejs/devtools-ui/utils/format'
 import { Flamegraph, normalizeTreeNode } from 'nanovis'
 import { computed, nextTick, onMounted, onUnmounted, ref, shallowRef, useTemplateRef, watch } from 'vue'
-import { normalizeTimestamp } from '~/utils/format'
 
 interface FlowTransform {
   name: string
diff --git a/packages/vite/src/app/components/data/PluginDetailsLoader.vue b/packages/vite/src/app/components/data/PluginDetailsLoader.vue
index 19520eef..c62ca16a 100644
--- a/packages/vite/src/app/components/data/PluginDetailsLoader.vue
+++ b/packages/vite/src/app/components/data/PluginDetailsLoader.vue
@@ -9,7 +9,7 @@ import DisplayDuration from '@vitejs/devtools-ui/components/DisplayDuration.vue'
 import DisplayNumberBadge from '@vitejs/devtools-ui/components/DisplayNumberBadge.vue'
 import DisplayPluginName from '@vitejs/devtools-ui/components/DisplayPluginName.vue'
 import PluginsSunburst from '@vitejs/devtools-ui/components/PluginsSunburst.vue'
-import { formatDuration } from '@vitejs/devtools-ui/utils/format'
+import { formatDuration, normalizeTimestamp } from '@vitejs/devtools-ui/utils/format'
 import { useAsyncState, useDebounceFn, useMouse } from '@vueuse/core'
 import { normalizeTreeNode, Sunburst } from 'nanovis'
 import { computed, reactive, watch } from 'vue'
@@ -18,7 +18,6 @@ import { useChartGraph } from '~/composables/chart'
 import { onInspectModuleUpdated } from '~/composables/rpc'
 import { settings } from '~/state/settings'
 import { parseReadablePath } from '~/utils/filepath'
-import { normalizeTimestamp } from '~/utils/format'
 import { getFileTypeFromModuleId, ModuleTypeRules } from '~/utils/icon'
 
 type InspectQuery = Parameters<DevToolsRpcServerFunctions['vite:inspect:get-plugin-details']>[0]
diff --git a/packages/vite/src/app/components/data/PluginDetailsTable.vue b/packages/vite/src/app/components/data/PluginDetailsTable.vue
index 68368a3d..220df3e2 100644
--- a/packages/vite/src/app/components/data/PluginDetailsTable.vue
+++ b/packages/vite/src/app/components/data/PluginDetailsTable.vue
@@ -5,11 +5,11 @@ import type { FilterMatchRule } from '~/utils/icon'
 import DataVirtualList from '@vitejs/devtools-ui/components/DataVirtualList.vue'
 import DisplayBadge from '@vitejs/devtools-ui/components/DisplayBadge.vue'
 import DisplayDuration from '@vitejs/devtools-ui/components/DisplayDuration.vue'
+import { normalizeTimestamp } from '@vitejs/devtools-ui/utils/format'
 import { useCycleList } from '@vueuse/core'
 import { Menu as VMenu } from 'floating-vue'
 import { computed, ref } from 'vue'
 import { settings } from '~/state/settings'
-import { normalizeTimestamp } from '~/utils/format'
 import { getFileTypeFromModuleId, ModuleTypeRules } from '~/utils/icon'
 
 const props = defineProps<{
diff --git a/packages/vite/src/app/components/display/FileSizeBadge.vue b/packages/vite/src/app/components/display/FileSizeBadge.vue
index 9f9aafbf..fa972639 100644
--- a/packages/vite/src/app/components/display/FileSizeBadge.vue
+++ b/packages/vite/src/app/components/display/FileSizeBadge.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
+import { bytesToHumanSize } from '@vitejs/devtools-ui/utils/format'
 import { computed } from 'vue'
-import { bytesToHumanSize } from '~/utils/format'
 
 const props = withDefaults(
   defineProps<{
diff --git a/packages/vite/src/app/components/modules/Folder.vue b/packages/vite/src/app/components/modules/Folder.vue
index 3a243477..710e5e65 100644
--- a/packages/vite/src/app/components/modules/Folder.vue
+++ b/packages/vite/src/app/components/modules/Folder.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { ViteModuleDest, ViteModuleListItem } from '~/types/modules'
+import { toTree } from '@vitejs/devtools-ui/utils/format'
 import { computed } from 'vue'
-import { toTree } from '~/utils/format'
 
 const props = defineProps<{
   root: string
diff --git a/packages/vite/src/app/composables/chart.ts b/packages/vite/src/app/composables/chart.ts
index d7900846..73509d6b 100644
--- a/packages/vite/src/app/composables/chart.ts
+++ b/packages/vite/src/app/composables/chart.ts
@@ -1,10 +1,10 @@
 import type { GraphBase, GraphBaseOptions, TreeNode } from 'nanovis'
 import type { ComputedRef, MaybeRef } from 'vue'
 import { isDark } from '@vitejs/devtools-ui/composables/dark'
+import { bytesToHumanSize } from '@vitejs/devtools-ui/utils/format'
 import { createColorGetterSpectrum } from 'nanovis'
 import { computed, nextTick, onUnmounted, ref, shallowRef, unref, watch } from 'vue'
 import { settings } from '~/state/settings'
-import { bytesToHumanSize } from '~/utils/format'
 
 export interface ChartGraphOptions<T, I, N> {
   data: ComputedRef<T[]> | MaybeRef<T[]>
diff --git a/packages/vite/src/app/utils/format.ts b/packages/vite/src/app/utils/format.ts
deleted file mode 100644
index 08f5482a..00000000
--- a/packages/vite/src/app/utils/format.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-import type { ViteModuleDest, ViteModuleTreeNode } from '~/types/modules'
-
-export function bytesToHumanSize(bytes: number, digits = 2) {
-  const sizes = ['Bytes', 'kB', 'MB', 'GB', 'TB']
-  const i = Math.floor(Math.log(bytes || 1) / Math.log(1000))
-  if (i === 0)
-    return [bytes, 'B']
-  return [(+(bytes / 1000 ** i).toFixed(digits)).toLocaleString(), sizes[i]]
-}
-
-export function toTree(modules: ViteModuleDest[], name: string) {
-  const node: ViteModuleTreeNode = { name, children: {}, items: [] }
-
-  function add(mod: ViteModuleDest, parts: string[], current = node) {
-    if (parts.length <= 1) {
-      current.items.push(mod)
-      return
-    }
-
-    const first = parts.shift()!
-    if (!current.children[first])
-      current.children[first] = { name: first, children: {}, items: [] }
-    add(mod, parts, current.children[first])
-  }
-
-  modules.forEach((m) => {
-    const parts = m.path.split(/\//g).filter(Boolean)
-    add(m, parts)
-  })
-
-  function flat(node: ViteModuleTreeNode) {
-    const children = Object.values(node.children)
-    if (children.length === 1 && !node.items.length) {
-      const child = children[0]!
-      node.name = node.name ? `${node.name}/${child.name}` : child.name
-      node.items = child.items
-      node.children = child.children
-      flat(node)
-    }
-    else {
-      children.forEach(flat)
-    }
-  }
-
-  Object.values(node.children).forEach(flat)
-
-  return node
-}
-
-export function normalizeTimestamp(timestamp: number) {
-  return new Date(timestamp).toLocaleString(undefined, {
-    hour12: false,
-    year: 'numeric',
-    month: '2-digit',
-    day: '2-digit',
-    hour: '2-digit',
-    minute: '2-digit',
-    second: '2-digit',
-    fractionalSecondDigits: 3,
-  })
-}

From 66beb30ed0bb33d62054e3332a43a735d3b2c1cd Mon Sep 17 00:00:00 2001
From: "Anthony Fu (via agent)" <reg-github-bot@antfu.me>
Date: Tue, 14 Jul 2026 05:03:10 +0000
Subject: [PATCH 3/4] refactor(ui): consolidate filepath utils
 (parseReadablePath/isPackageName) into devtools-ui

Move the module-path parsing logic (normalizeModulePath, isPackageName,
getModuleNameFromPath, isBuiltInModule, parseReadablePath, and the
pnpm/node_modules package-locator helpers) into packages/ui/src/utils/filepath.ts,
which was previously fully duplicated in packages/vite/src/app/utils/filepath.ts
and split between packages/rolldown/src/app/utils/filepath.ts and its
shared/utils/filepath.ts. Both apps' app/utils/filepath.ts now become
thin wrappers that re-export the shared implementation and wrap
parseReadablePath with their own local makeCachedFunction (cache.ts
stays app-local per plan scope). Carries over rolldown's #build remap
fix for .nuxt paths, which vite's copy was missing.

Adds pathe as a dependency of @vitejs/devtools-ui for the relative()
workaround parseReadablePath depends on.
---
 packages/rolldown/src/app/utils/filepath.ts   |  58 +------
 packages/ui/package.json                      |   3 +
 .../src}/utils/__tests__/filepath.test.ts     |   0
 packages/ui/src/utils/filepath.ts             | 154 ++++++++++++++++++
 packages/vite/src/app/utils/filepath.ts       | 145 +----------------
 pnpm-lock.yaml                                | 123 +++++++++++++-
 6 files changed, 285 insertions(+), 198 deletions(-)
 rename packages/{rolldown/src/app => ui/src}/utils/__tests__/filepath.test.ts (100%)
 create mode 100644 packages/ui/src/utils/filepath.ts

diff --git a/packages/rolldown/src/app/utils/filepath.ts b/packages/rolldown/src/app/utils/filepath.ts
index 8560552c..32bfd1ee 100644
--- a/packages/rolldown/src/app/utils/filepath.ts
+++ b/packages/rolldown/src/app/utils/filepath.ts
@@ -1,58 +1,6 @@
-import { relative } from 'pathe'
-import { getModuleNameFromPath, isPackageName } from '../../shared/utils/filepath'
+import { parseReadablePath as parseReadablePathImpl } from '@vitejs/devtools-ui/utils/filepath'
 import { makeCachedFunction } from './cache'
 
-function getModuleSubpathFromPath(path: string) {
-  const match = path.match(/.*\/node_modules\/(.*)$/)?.[1]
-  if (!match)
-    return undefined
-  return match
-}
+export { getModuleNameFromPath, isBuiltInModule, isPackageName, normalizeModulePath } from '@vitejs/devtools-ui/utils/filepath'
 
-export function isBuiltInModule(name: string | undefined) {
-  if (!name)
-    return
-  return ['nuxt', '#app', '#head', 'vue'].includes(name)
-}
-
-export const parseReadablePath = makeCachedFunction((path: string, root: string) => {
-  const parsedPath = path
-    .replace(/%2F/g, '/')
-    .replace(/\\/g, '/')
-  if (isPackageName(parsedPath)) {
-    return {
-      moduleName: parsedPath,
-      path: parsedPath,
-    }
-  }
-
-  if (/^\w+:/.test(parsedPath)
-    && !(/^[a-z]:\\/i.test(path)) // in order to check if it is Windows' path
-  ) {
-    return {
-      moduleName: parsedPath,
-      path: parsedPath,
-    }
-  }
-
-  const moduleName = getModuleNameFromPath(parsedPath)
-  const subpath = getModuleSubpathFromPath(parsedPath)
-  if (moduleName && subpath) {
-    return {
-      moduleName,
-      path: subpath,
-    }
-  }
-  // Workaround https://github.com/unjs/pathe/issues/113
-  try {
-    let result = relative(root, parsedPath)
-    if (!result.startsWith('./') && !result.startsWith('../'))
-      result = `./${result}`
-    if (result.startsWith('./.nuxt/'))
-      result = `#build${result.slice(7)}`
-    return { path: result }
-  }
-  catch {
-    return { path: parsedPath }
-  }
-})
+export const parseReadablePath = makeCachedFunction(parseReadablePathImpl)
diff --git a/packages/ui/package.json b/packages/ui/package.json
index e224df06..b79dc6ab 100644
--- a/packages/ui/package.json
+++ b/packages/ui/package.json
@@ -63,5 +63,8 @@
     "unocss": "*",
     "vue": "*",
     "vue-virtual-scroller": "^3.0.0"
+  },
+  "dependencies": {
+    "pathe": "catalog:deps"
   }
 }
diff --git a/packages/rolldown/src/app/utils/__tests__/filepath.test.ts b/packages/ui/src/utils/__tests__/filepath.test.ts
similarity index 100%
rename from packages/rolldown/src/app/utils/__tests__/filepath.test.ts
rename to packages/ui/src/utils/__tests__/filepath.test.ts
diff --git a/packages/ui/src/utils/filepath.ts b/packages/ui/src/utils/filepath.ts
new file mode 100644
index 00000000..82014fee
--- /dev/null
+++ b/packages/ui/src/utils/filepath.ts
@@ -0,0 +1,154 @@
+import { relative } from 'pathe'
+
+const NODE_MODULES = 'node_modules'
+
+export function normalizeModulePath(path: string) {
+  return path
+    .replace(/%2F/gi, '/')
+    .replace(/\\/g, '/')
+}
+
+export function isPackageName(name: string) {
+  return name[0] === '#' || !!name.match(/^(@[a-z0-9-~][a-z0-9-._~]*\/)?[a-z0-9-~][a-z0-9-._~]*$/)
+}
+
+export function getModuleNameFromPath(path: string) {
+  const normalizedPath = normalizeModulePath(path)
+  if (isPackageName(normalizedPath))
+    return normalizedPath
+
+  const segments = normalizedPath.split('/')
+  const packageRoot = findNodeModulesPackage(segments)
+
+  return packageRoot?.name ?? findPackageLocator(segments)?.name
+}
+
+function getModuleSubpathFromPath(path: string) {
+  return path.match(/.*\/node_modules\/(.*)$/)?.[1]
+}
+
+export function isBuiltInModule(name: string | undefined) {
+  if (!name)
+    return
+  return ['nuxt', '#app', '#head', 'vue'].includes(name)
+}
+
+export function parseReadablePath(path: string, root: string) {
+  const parsedPath = normalizeModulePath(path)
+  if (isPackageName(parsedPath)) {
+    return {
+      moduleName: parsedPath,
+      path: parsedPath,
+    }
+  }
+
+  if (/^\w+:/.test(parsedPath)
+    && !(/^[a-z]:\\/i.test(path)) // in order to check if it is Windows' path
+  ) {
+    return {
+      moduleName: parsedPath,
+      path: parsedPath,
+    }
+  }
+
+  const moduleName = getModuleNameFromPath(parsedPath)
+  const subpath = getModuleSubpathFromPath(parsedPath)
+  if (moduleName && subpath) {
+    return {
+      moduleName,
+      path: subpath,
+    }
+  }
+  // Workaround https://github.com/unjs/pathe/issues/113
+  try {
+    let result = relative(root, parsedPath)
+    if (!result.startsWith('./') && !result.startsWith('../'))
+      result = `./${result}`
+    if (result.startsWith('./.nuxt/'))
+      result = `#build${result.slice(7)}`
+    return { path: result }
+  }
+  catch {
+    return { path: parsedPath }
+  }
+}
+
+function findNodeModulesPackage(segments: string[]) {
+  for (const nodeModulesIndex of getNodeModulesIndexes(segments)) {
+    const name = getPackageNameFromSegments(segments, nodeModulesIndex + 1)
+    if (!name)
+      continue
+
+    return {
+      name,
+      endIndex: nodeModulesIndex + 1 + (name.startsWith('@') ? 2 : 1),
+    }
+  }
+}
+
+function getPackageNameFromSegments(segments: string[], startIndex: number) {
+  const firstSegment = segments[startIndex]
+  if (!firstSegment)
+    return undefined
+
+  const packageName = firstSegment.startsWith('@')
+    ? `${firstSegment}/${segments[startIndex + 1] ?? ''}`
+    : firstSegment
+
+  return isPackageName(packageName) ? packageName : undefined
+}
+
+function findPackageLocator(segments: string[]) {
+  for (const nodeModulesIndex of getNodeModulesIndexes(segments)) {
+    if (getPackageNameFromSegments(segments, nodeModulesIndex + 1))
+      continue
+
+    const startIndex = nodeModulesIndex + 1
+    const nextNodeModulesIndex = segments.indexOf(NODE_MODULES, startIndex)
+    const boundaryIndex = nextNodeModulesIndex >= 0 ? nextNodeModulesIndex : segments.length
+
+    for (const candidateIndex of [startIndex, startIndex + 1]) {
+      if (candidateIndex >= boundaryIndex)
+        continue
+
+      const segment = segments[candidateIndex]
+      if (!segment)
+        continue
+
+      const packageLocator = parsePackageLocatorSegment(segment)
+      if (packageLocator)
+        return { ...packageLocator, index: candidateIndex }
+    }
+  }
+}
+
+function getNodeModulesIndexes(segments: string[]) {
+  return segments
+    .map((segment, index) => segment === NODE_MODULES ? index : -1)
+    .filter(index => index >= 0)
+    .reverse()
+}
+
+function parsePackageLocatorSegment(segment: string): { name: string, version: string } | undefined {
+  const versionIndex = segment.startsWith('@')
+    ? segment.indexOf('@', 1)
+    : segment.indexOf('@')
+
+  if (versionIndex <= 0)
+    return undefined
+
+  const name = segment
+    .slice(0, versionIndex)
+    .replace(/\+/g, '/')
+  const version = segment
+    .slice(versionIndex + 1)
+    .split('_')[0]
+
+  if (!isPackageName(name) || !version)
+    return undefined
+
+  return {
+    name,
+    version,
+  }
+}
diff --git a/packages/vite/src/app/utils/filepath.ts b/packages/vite/src/app/utils/filepath.ts
index 50b72ff3..32bfd1ee 100644
--- a/packages/vite/src/app/utils/filepath.ts
+++ b/packages/vite/src/app/utils/filepath.ts
@@ -1,145 +1,6 @@
-import { relative } from 'pathe'
+import { parseReadablePath as parseReadablePathImpl } from '@vitejs/devtools-ui/utils/filepath'
 import { makeCachedFunction } from './cache'
 
-const NODE_MODULES = 'node_modules'
+export { getModuleNameFromPath, isBuiltInModule, isPackageName, normalizeModulePath } from '@vitejs/devtools-ui/utils/filepath'
 
-export function normalizeModulePath(path: string) {
-  return path
-    .replace(/%2F/gi, '/')
-    .replace(/\\/g, '/')
-}
-
-export function isPackageName(name: string) {
-  return name[0] === '#' || !!name.match(/^(@[a-z0-9-~][a-z0-9-._~]*\/)?[a-z0-9-~][a-z0-9-._~]*$/)
-}
-
-export function getModuleNameFromPath(path: string) {
-  const normalizedPath = normalizeModulePath(path)
-  if (isPackageName(normalizedPath))
-    return normalizedPath
-
-  const segments = normalizedPath.split('/')
-  const packageRoot = findNodeModulesPackage(segments)
-
-  return packageRoot?.name ?? findPackageLocator(segments)?.name
-}
-
-function getModuleSubpathFromPath(path: string) {
-  return path.match(/.*\/node_modules\/(.*)$/)?.[1]
-}
-
-export const parseReadablePath = makeCachedFunction((path: string, root: string) => {
-  const parsedPath = normalizeModulePath(path)
-  if (isPackageName(parsedPath)) {
-    return {
-      moduleName: parsedPath,
-      path: parsedPath,
-    }
-  }
-
-  if (/^\w+:/.test(parsedPath) && !(/^[a-z]:\\/i.test(path))) {
-    return {
-      moduleName: parsedPath,
-      path: parsedPath,
-    }
-  }
-
-  const moduleName = getModuleNameFromPath(parsedPath)
-  const subpath = getModuleSubpathFromPath(parsedPath)
-  if (moduleName && subpath) {
-    return {
-      moduleName,
-      path: subpath,
-    }
-  }
-
-  try {
-    let result = relative(root, parsedPath)
-    if (!result.startsWith('./') && !result.startsWith('../'))
-      result = `./${result}`
-    return { path: result }
-  }
-  catch {
-    return { path: parsedPath }
-  }
-})
-
-function findNodeModulesPackage(segments: string[]) {
-  for (const nodeModulesIndex of getNodeModulesIndexes(segments)) {
-    const name = getPackageNameFromSegments(segments, nodeModulesIndex + 1)
-    if (!name)
-      continue
-
-    return {
-      name,
-      endIndex: nodeModulesIndex + 1 + (name.startsWith('@') ? 2 : 1),
-    }
-  }
-}
-
-function getPackageNameFromSegments(segments: string[], startIndex: number) {
-  const firstSegment = segments[startIndex]
-  if (!firstSegment)
-    return undefined
-
-  const packageName = firstSegment.startsWith('@')
-    ? `${firstSegment}/${segments[startIndex + 1] ?? ''}`
-    : firstSegment
-
-  return isPackageName(packageName) ? packageName : undefined
-}
-
-function findPackageLocator(segments: string[]) {
-  for (const nodeModulesIndex of getNodeModulesIndexes(segments)) {
-    if (getPackageNameFromSegments(segments, nodeModulesIndex + 1))
-      continue
-
-    const startIndex = nodeModulesIndex + 1
-    const nextNodeModulesIndex = segments.indexOf(NODE_MODULES, startIndex)
-    const boundaryIndex = nextNodeModulesIndex >= 0 ? nextNodeModulesIndex : segments.length
-
-    for (const candidateIndex of [startIndex, startIndex + 1]) {
-      if (candidateIndex >= boundaryIndex)
-        continue
-
-      const segment = segments[candidateIndex]
-      if (!segment)
-        continue
-
-      const packageLocator = parsePackageLocatorSegment(segment)
-      if (packageLocator)
-        return { ...packageLocator, index: candidateIndex }
-    }
-  }
-}
-
-function getNodeModulesIndexes(segments: string[]) {
-  return segments
-    .map((segment, index) => segment === NODE_MODULES ? index : -1)
-    .filter(index => index >= 0)
-    .reverse()
-}
-
-function parsePackageLocatorSegment(segment: string): { name: string, version: string } | undefined {
-  const versionIndex = segment.startsWith('@')
-    ? segment.indexOf('@', 1)
-    : segment.indexOf('@')
-
-  if (versionIndex <= 0)
-    return undefined
-
-  const name = segment
-    .slice(0, versionIndex)
-    .replace(/\+/g, '/')
-  const version = segment
-    .slice(versionIndex + 1)
-    .split('_')[0]
-
-  if (!isPackageName(name) || !version)
-    return undefined
-
-  return {
-    name,
-    version,
-  }
-}
+export const parseReadablePath = makeCachedFunction(parseReadablePathImpl)
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index aabd5a6c..b693bebd 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -944,6 +944,9 @@ importers:
       nuxt:
         specifier: ^4.4.8
         version: 4.4.8(@babel/plugin-syntax-jsx@7.28.6(@babel/core@7.29.0))(@babel/plugin-syntax-typescript@7.28.6(@babel/core@7.29.0))(@parcel/watcher@2.5.6)(@types/node@25.0.3)(@vitejs/devtools@0.3.4)(@vue/compiler-sfc@3.5.39)(cac@7.0.0)(db0@0.3.4)(esbuild@0.28.1)(eslint@10.6.0(jiti@2.7.0))(idb-keyval@6.3.0)(ioredis@5.10.1)(magicast@0.5.2)(optionator@0.9.4)(rolldown@1.1.5)(rollup-plugin-visualizer@7.0.1(rolldown@1.1.5)(rollup@4.60.2))(rollup@4.60.2)(srvx@0.11.15)(terser@5.44.1)(tsx@4.23.0)(typescript@6.0.3)(vite@8.1.4)(vue-tsc@3.3.7(typescript@6.0.3))(webpack@5.104.1(esbuild@0.28.1))(yaml@2.9.0)
+      pathe:
+        specifier: catalog:deps
+        version: 2.0.3
       unocss:
         specifier: '*'
         version: 66.7.5(@unocss/webpack@66.7.5(esbuild@0.28.1)(rolldown@1.1.5)(rollup@4.60.2)(vite@8.1.4)(webpack@5.104.1(esbuild@0.28.1)))(vite@8.1.4)
@@ -1044,7 +1047,7 @@ importers:
     devDependencies:
       tsdown:
         specifier: catalog:build
-        version: 0.22.4(@vitejs/devtools@0.3.4)(oxc-resolver@11.23.0)(publint@0.3.21)(tsx@4.23.0)(typescript@6.0.3)(unrun@0.3.1(synckit@0.11.13))(vue-tsc@3.3.7(typescript@6.0.3))
+        version: 0.22.4(@vitejs/devtools@0.4.1)(oxc-resolver@11.23.0)(publint@0.3.21)(tsx@4.23.0)(typescript@6.0.3)(unrun@0.3.1(synckit@0.11.13))(vue-tsc@3.3.7(typescript@6.0.3))
       tsx:
         specifier: catalog:build
         version: 4.23.0
@@ -4320,15 +4323,29 @@ packages:
     peerDependencies:
       vite: ^8.1.3
 
+  '@vitejs/devtools-kit@0.4.1':
+    resolution: {integrity: sha512-5SvryUWtnE9F/s3ubJYSsbop35sJuavxadoO/UzPh59y54K4w9l/9wZBdrDKqbGpqD7g2aUwgcjM8nAh1AOnkw==}
+    peerDependencies:
+      vite: ^8.1.3
+
   '@vitejs/devtools-rolldown@0.3.4':
     resolution: {integrity: sha512-5MFcRpZIqL50A6Kb31jHaRDt1jg7WkdQUKx53deFZdp8DxRezzzwGBaYH00kK7fWJC1UDvlwROByHgavC/O52A==}
 
+  '@vitejs/devtools-rolldown@0.4.1':
+    resolution: {integrity: sha512-51MPmAXZOU0iwkDKpikXo58DBCC0DsZgAC7WkiIbb6TuKf7wAXwjiysZLCkbGv7eGdY5X9sJQKmzlJaoVrRpvg==}
+
   '@vitejs/devtools@0.3.4':
     resolution: {integrity: sha512-CkIy5lFs4e1D99HD050fbpUYXt2tZsMz2y1OoaRsxEUFQvZsYyhtC9taOM/CVMLOWpAD8A84o+KM6F7pz10wVA==}
     hasBin: true
     peerDependencies:
       vite: ^8.1.3
 
+  '@vitejs/devtools@0.4.1':
+    resolution: {integrity: sha512-j9/N9YYA/oUcKm2hq/EByEnOugi6tjhMDkeqbHYLRXIJW4PsPmzKz/sSRpkMImQyWGqMmc1HSHfMxDApr7l+Bg==}
+    hasBin: true
+    peerDependencies:
+      vite: ^8.1.3
+
   '@vitejs/plugin-vue-jsx@5.1.5':
     resolution: {integrity: sha512-jIAsvHOEtWpslLOI2MeElGFxH7M8pM83BU/Tor4RLyiwH0FM4nUW3xdvbw20EeU9wc5IspQwMq225K3CMnJEpA==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -12465,6 +12482,19 @@ snapshots:
       - utf-8-validate
       - webpack
 
+  '@vitejs/devtools-kit@0.4.1(srvx@0.11.15)(typescript@6.0.3)(vite@8.1.4)':
+    dependencies:
+      '@devframes/hub': 0.6.0(devframe@0.6.0(srvx@0.11.15)(typescript@6.0.3))
+      devframe: 0.6.0(srvx@0.11.15)(typescript@6.0.3)
+      mlly: 1.8.2
+      nostics: 1.1.4
+      vite: 8.1.4(@types/node@25.0.3)(@vitejs/devtools@0.4.1)(esbuild@0.28.1)(jiti@2.7.0)(terser@5.44.1)(tsx@4.23.0)(yaml@2.9.0)
+    transitivePeerDependencies:
+      - '@modelcontextprotocol/sdk'
+      - srvx
+      - typescript
+    optional: true
+
   '@vitejs/devtools-rolldown@0.3.4(crossws@0.4.9(srvx@0.11.15))(db0@0.3.4)(esbuild@0.28.1)(idb-keyval@6.3.0)(ioredis@5.10.1)(rolldown@1.1.5)(rollup@4.60.2)(typescript@6.0.3)(vite@8.1.4)(vue@3.5.39(typescript@6.0.3))(webpack@5.104.1(esbuild@0.28.1))':
     dependencies:
       '@floating-ui/dom': 1.7.6
@@ -12525,6 +12555,24 @@ snapshots:
       - webpack
     optional: true
 
+  '@vitejs/devtools-rolldown@0.4.1(srvx@0.11.15)(typescript@6.0.3)(vite@8.1.4)(vue@3.5.39(typescript@6.0.3))':
+    dependencies:
+      '@floating-ui/dom': 1.7.6
+      '@rolldown/debug': 1.1.5
+      '@vitejs/devtools-kit': 0.4.1(srvx@0.11.15)(typescript@6.0.3)(vite@8.1.4)
+      d3-shape: 3.2.0
+      diff: 9.0.0
+      nostics: 1.1.4
+      pathe: 2.0.3
+      vue-virtual-scroller: 3.0.4(vue@3.5.39(typescript@6.0.3))
+    transitivePeerDependencies:
+      - '@modelcontextprotocol/sdk'
+      - srvx
+      - typescript
+      - vite
+      - vue
+    optional: true
+
   '@vitejs/devtools@0.3.4(crossws@0.4.9(srvx@0.11.15))(db0@0.3.4)(esbuild@0.28.1)(idb-keyval@6.3.0)(ioredis@5.10.1)(rolldown@1.1.5)(rollup@4.60.2)(typescript@6.0.3)(vite@8.1.4)(webpack@5.104.1(esbuild@0.28.1))':
     dependencies:
       '@devframes/hub': 0.5.4(devframe@0.5.4(crossws@0.4.9(srvx@0.11.15))(esbuild@0.28.1)(rolldown@1.1.5)(rollup@4.60.2)(typescript@6.0.3)(vite@8.1.4)(webpack@5.104.1(esbuild@0.28.1)))(esbuild@0.28.1)(rolldown@1.1.5)(rollup@4.60.2)(vite@8.1.4)(webpack@5.104.1(esbuild@0.28.1))
@@ -12578,6 +12626,32 @@ snapshots:
       - webpack
     optional: true
 
+  '@vitejs/devtools@0.4.1(crossws@0.4.9(srvx@0.11.15))(srvx@0.11.15)(typescript@6.0.3)(valibot@1.4.2(typescript@6.0.3))(vite@8.1.4)':
+    dependencies:
+      '@devframes/hub': 0.6.0(devframe@0.6.0(srvx@0.11.15)(typescript@6.0.3))
+      '@devframes/plugin-inspect': 0.6.0(devframe@0.6.0(srvx@0.11.15)(typescript@6.0.3))(valibot@1.4.2(typescript@6.0.3))(vite@8.1.4)
+      '@devframes/plugin-messages': 0.6.0(@devframes/hub@0.6.0(devframe@0.6.0(srvx@0.11.15)(typescript@6.0.3)))(devframe@0.6.0(srvx@0.11.15)(typescript@6.0.3))(vite@8.1.4)
+      '@devframes/plugin-terminals': 0.6.0(devframe@0.6.0(srvx@0.11.15)(typescript@6.0.3))(typescript@6.0.3)(vite@8.1.4)
+      '@vitejs/devtools-kit': 0.4.1(srvx@0.11.15)(typescript@6.0.3)(vite@8.1.4)
+      '@vitejs/devtools-rolldown': 0.4.1(srvx@0.11.15)(typescript@6.0.3)(vite@8.1.4)(vue@3.5.39(typescript@6.0.3))
+      birpc: 4.0.0
+      cac: 7.0.0
+      devframe: 0.6.0(srvx@0.11.15)(typescript@6.0.3)
+      h3: 2.0.1-rc.22(crossws@0.4.9(srvx@0.11.15))
+      mlly: 1.8.2
+      nostics: 1.1.4
+      obug: 2.1.3
+      pathe: 2.0.3
+      vite: 8.1.4(@types/node@25.0.3)(@vitejs/devtools@0.4.1)(esbuild@0.28.1)(jiti@2.7.0)(terser@5.44.1)(tsx@4.23.0)(yaml@2.9.0)
+      vue: 3.5.39(typescript@6.0.3)
+    transitivePeerDependencies:
+      - '@modelcontextprotocol/sdk'
+      - crossws
+      - srvx
+      - typescript
+      - valibot
+    optional: true
+
   '@vitejs/plugin-vue-jsx@5.1.5(vite@8.1.4)(vue@3.5.39(typescript@6.0.3))':
     dependencies:
       '@babel/core': 7.29.0
@@ -17482,6 +17556,35 @@ snapshots:
       - oxc-resolver
       - vue-tsc
 
+  tsdown@0.22.4(@vitejs/devtools@0.4.1)(oxc-resolver@11.23.0)(publint@0.3.21)(tsx@4.23.0)(typescript@6.0.3)(unrun@0.3.1(synckit@0.11.13))(vue-tsc@3.3.7(typescript@6.0.3)):
+    dependencies:
+      ansis: 4.3.1
+      cac: 7.0.0
+      defu: 6.1.7
+      empathic: 2.0.1
+      hookable: 6.1.1
+      import-without-cache: 0.4.0
+      obug: 2.1.3
+      picomatch: 4.0.5
+      rolldown: 1.1.5
+      rolldown-plugin-dts: 0.27.4(oxc-resolver@11.23.0)(rolldown@1.1.5)(typescript@6.0.3)(vue-tsc@3.3.7(typescript@6.0.3))
+      semver: 7.8.5
+      tinyexec: 1.2.4
+      tinyglobby: 0.2.17
+      tree-kill: 1.2.2
+      unconfig-core: 7.5.0
+    optionalDependencies:
+      '@vitejs/devtools': 0.4.1(crossws@0.4.9(srvx@0.11.15))(srvx@0.11.15)(typescript@6.0.3)(valibot@1.4.2(typescript@6.0.3))(vite@8.1.4)
+      publint: 0.3.21
+      tsx: 4.23.0
+      typescript: 6.0.3
+      unrun: 0.3.1(synckit@0.11.13)
+    transitivePeerDependencies:
+      - '@ts-macro/tsc'
+      - '@typescript/native-preview'
+      - oxc-resolver
+      - vue-tsc
+
   tsdown@0.22.4(@vitejs/devtools@packages+core)(oxc-resolver@11.23.0)(publint@0.3.21)(tsx@4.23.0)(typescript@6.0.3)(unrun@0.3.1(synckit@0.11.13))(vue-tsc@3.3.7(typescript@6.0.3)):
     dependencies:
       ansis: 4.3.1
@@ -18042,6 +18145,24 @@ snapshots:
       tsx: 4.23.0
       yaml: 2.9.0
 
+  vite@8.1.4(@types/node@25.0.3)(@vitejs/devtools@0.4.1)(esbuild@0.28.1)(jiti@2.7.0)(terser@5.44.1)(tsx@4.23.0)(yaml@2.9.0):
+    dependencies:
+      lightningcss: 1.32.0
+      picomatch: 4.0.5
+      postcss: 8.5.16
+      rolldown: 1.1.5
+      tinyglobby: 0.2.17
+    optionalDependencies:
+      '@types/node': 25.0.3
+      '@vitejs/devtools': 0.4.1(crossws@0.4.9(srvx@0.11.15))(srvx@0.11.15)(typescript@6.0.3)(valibot@1.4.2(typescript@6.0.3))(vite@8.1.4)
+      esbuild: 0.28.1
+      fsevents: 2.3.3
+      jiti: 2.7.0
+      terser: 5.44.1
+      tsx: 4.23.0
+      yaml: 2.9.0
+    optional: true
+
   vite@8.1.4(@types/node@25.0.3)(@vitejs/devtools@packages+core)(esbuild@0.28.1)(jiti@2.7.0)(terser@5.44.1)(tsx@4.23.0)(yaml@2.9.0):
     dependencies:
       lightningcss: 1.32.0

From 1643ec5266164e90b945c7d7e38aa2b049629c24 Mon Sep 17 00:00:00 2001
From: "Anthony Fu (via agent)" <reg-github-bot@antfu.me>
Date: Tue, 14 Jul 2026 05:03:17 +0000
Subject: [PATCH 4/4] docs(plans): close out plan 015 (consolidate app utils)

Mark plan 015 DONE in plans/README.md and remove the executed plan file.
---
 plans/015-consolidate-app-utils.md | 143 -----------------------------
 plans/README.md                    |   2 +-
 2 files changed, 1 insertion(+), 144 deletions(-)
 delete mode 100644 plans/015-consolidate-app-utils.md

diff --git a/plans/015-consolidate-app-utils.md b/plans/015-consolidate-app-utils.md
deleted file mode 100644
index ceb68f85..00000000
--- a/plans/015-consolidate-app-utils.md
+++ /dev/null
@@ -1,143 +0,0 @@
-# Plan 015: Consolidate triplicated `color`/`format`/`filepath` utils into `packages/ui`
-
-> **Executor instructions**: Follow step by step; verify each step. Honor STOP
-> conditions. Update this plan's row in `plans/README.md` when done.
->
-> **Drift check (run first)**: `git diff --stat ae9555f..HEAD -- packages/ui/src/utils packages/rolldown/src/app/utils packages/vite/src/app/utils`
-> Compare "Current state" against live code first.
-
-## Status
-
-- **Priority**: P3
-- **Effort**: S–M
-- **Risk**: LOW
-- **Depends on**: plans/001 (test suite terminates)
-- **Category**: tech-debt
-- **Planned at**: commit `ae9555f`, 2026-07-09
-
-## Why this matters
-
-`color.ts`, `format.ts`, and `filepath.ts` are re-implemented across three locations:
-`packages/ui/src/utils/`, `packages/rolldown/src/app/utils/`, and `packages/vite/src/app/utils/`.
-`bytesToHumanSize`, `normalizeTimestamp`, `toTree`, `parseReadablePath` etc. are duplicated,
-and `color.ts` has **already drifted**: `packages/vite/src/app/utils/color.ts` collapsed the
-`predefinedColorMap` and dropped the branding hues (`bailout`/`vite1`/`vite2`/`rolldown`/`nuxt`)
-and the hex-vs-hue branch that `packages/rolldown/src/app/utils/color.ts` still carries. Three
-sources of truth mean inconsistent rendering and fixes that land in only one copy. `packages/ui`
-exists precisely to host shared UI utilities. This plan consolidates the utilities (low-risk,
-pure functions with existing tests) — the larger component dedup is plan 017.
-
-## Current state
-
-- `packages/ui/src/utils/`: `color.ts`, `format.ts`, `__tests__/color.test.ts` (no `filepath.ts` yet).
-- `packages/rolldown/src/app/utils/`: `cache.ts`, `color.ts`, `filepath.ts`, `format.ts`, `icon.ts`,
-  `is.ts`, `__tests__/{cache,color,filepath,format,icon,is}.test.ts` — **the tested, canonical copies**.
-- `packages/vite/src/app/utils/`: `cache.ts`, `color.ts`, `filepath.ts`, `format.ts`, `icon.ts`
-  — **untested copies**; `color.ts` is the drifted/collapsed one.
-- The rolldown `color.ts` is the richer/correct version (keeps `predefinedColorMap` with branding
-  hues and the hex-string-vs-hue-number branch). Treat **rolldown's copies as canonical** when
-  reconciling.
-- `packages/ui` publishes utilities under `@vitejs/devtools-ui/utils` (verify the exact subpath /
-  export map in `packages/ui/package.json`); `color` already partially lives in ui.
-- UnoCSS preset export is `presetDevToolsUI` from `@vitejs/devtools-ui/unocss` (unrelated, do not touch).
-
-## Commands you will need
-
-| Purpose        | Command                                                       | Expected    |
-|----------------|---------------------------------------------------------------|-------------|
-| Find usages    | `git grep -n "utils/color\|utils/format\|utils/filepath" -- 'packages/rolldown/**' 'packages/vite/**'` | list |
-| Test ui        | `pnpm -C packages/ui exec vitest run`                         | pass        |
-| Test rolldown  | `pnpm -C packages/rolldown exec vitest run`                   | pass        |
-| Build          | `pnpm build`                                                  | exit 0      |
-| Typecheck      | `pnpm typecheck`                                              | exit 0      |
-
-## Scope
-
-**In scope**:
-- `packages/ui/src/utils/` — become the single home for `color.ts`, `format.ts`, `filepath.ts`
-  (and their tests, moved/merged from rolldown's `__tests__`)
-- `packages/ui/package.json` export map (if a new subpath is needed)
-- `packages/rolldown/src/app/utils/` and `packages/vite/src/app/utils/` — replace the three
-  duplicated files with re-exports from `@vitejs/devtools-ui` (or delete + update imports)
-- Import sites in both apps
-
-**Out of scope** (defer to plan 017 / later):
-- `cache.ts`, `icon.ts`, `is.ts` (start with the three clearly-duplicated pure utils; if
-  `cache`/`icon`/`is` are byte-identical you may fold them in, but do not force it)
-- The `components/flowmap/*` and other component duplication (plan 017)
-
-## Git workflow
-
-- Branch: `refactor/consolidate-app-utils`.
-- Conventional commits per util (color, then format, then filepath).
-- Do NOT push/PR unless instructed.
-
-## Steps
-
-### Step 1: Reconcile `color.ts` on the rolldown (canonical) version
-
-Compare the three `color.ts` copies (`diff`). Move the **rolldown** version's logic into
-`packages/ui/src/utils/color.ts` (it already exists in ui — merge so the richer
-`predefinedColorMap` + hex/hue branch wins). Move rolldown's `__tests__/color.test.ts` cases
-into `packages/ui/src/utils/__tests__/color.test.ts` (merge with ui's existing color test).
-
-**Verify**: `pnpm -C packages/ui exec vitest run color` → pass (including the branding-hue cases).
-
-### Step 2: Move `format.ts` and `filepath.ts` into ui with their tests
-
-Create `packages/ui/src/utils/filepath.ts`; ensure `packages/ui/src/utils/format.ts` is the
-canonical (rolldown) version. Move rolldown's `format`/`filepath` tests into
-`packages/ui/src/utils/__tests__/`. Export all three from the package's utils entry (check/extend
-`packages/ui/package.json` exports).
-
-**Verify**: `pnpm -C packages/ui exec vitest run` → pass; `pnpm typecheck` → exit 0.
-
-### Step 3: Point both apps at the shared utils
-
-In `packages/rolldown/src/app` and `packages/vite/src/app`, replace the local `color.ts`/
-`format.ts`/`filepath.ts` with either deletion + updated imports (`from '@vitejs/devtools-ui/...'`)
-or thin re-export files if many import sites reference the local path. Use the grep from
-"Commands" to find every import site and update it. Delete the now-redundant local test copies
-(their cases now live in ui).
-
-**Verify**: `pnpm build` → exit 0 (both Nuxt apps build); `pnpm typecheck` → exit 0;
-`pnpm -C packages/rolldown exec vitest run` and `pnpm -C packages/vite exec vitest run` → pass.
-
-### Step 4: Confirm no behavioral drift for vite
-
-Because vite's `color.ts` was the collapsed one, switching it to the canonical version changes
-its palette to include branding hues. Confirm this is the intended (correct) behavior — it aligns
-vite with rolldown. Note it explicitly in the PR (it is a deliberate visual change).
-
-**Verify**: `pnpm build` → exit 0.
-
-## Test plan
-
-- Consolidated tests live in `packages/ui/src/utils/__tests__/` (color, format, filepath),
-  merged from rolldown's existing suites — so both apps are now covered by one suite.
-- Verification: `pnpm -C packages/ui exec vitest run` passes; both apps build and typecheck.
-
-## Done criteria
-
-ALL must hold:
-- [ ] `color.ts`/`format.ts`/`filepath.ts` exist once, in `packages/ui`, with merged tests
-- [ ] `packages/rolldown` and `packages/vite` import them from `@vitejs/devtools-ui` (no local duplicates)
-- [ ] The canonical (rolldown) `color` logic wins; vite's palette now matches (noted in PR)
-- [ ] `pnpm build`, `pnpm typecheck` exit 0; ui + both app test suites pass
-- [ ] `plans/README.md` status row updated
-
-## STOP conditions
-
-Stop and report if:
-- The `format`/`filepath` copies have **drifted** (not just duplicated) — reconcile carefully and
-  note every semantic difference; if a difference is load-bearing for one app, parameterize rather
-  than pick one blindly, or STOP and report.
-- `packages/ui`'s export map / build (tsdown) can't expose the new subpath without config changes
-  beyond a one-line export addition — report the build-config need.
-- An import path change cascades into `packages/core` (which consumes the apps) — rescope.
-
-## Maintenance notes
-
-- This is the low-risk first half of the larger dedup (plan 017 handles components). Land it first.
-- Reviewer: verify no app-local util file remains that shadows the shared one, and that the vite
-  palette change is intentional.
diff --git a/plans/README.md b/plans/README.md
index becc5c1f..baba7280 100644
--- a/plans/README.md
+++ b/plans/README.md
@@ -26,7 +26,7 @@ self-contained — it does not assume you saw the audit or the other plans.
 | 012 | Split the Rolldown `get-session-summary` payload | P2 | M | — | TODO |
 | 013 | Triage the dependency-audit advisories in the Nuxt UI toolchain | P2 | M | — | TODO |
 | 014 | Characterization tests for `events-reader` + `log-cache` | P2 | M–L | 001 | TODO |
-| 015 | Consolidate triplicated `color`/`format`/`filepath` utils into `packages/ui` | P3 | S–M | 001 | TODO |
+| 015 | Consolidate triplicated `color`/`format`/`filepath` utils into `packages/ui` | P3 | S–M | 001 | DONE |
 | 016 | Break up the `RolldownEventsReader` god class | P3 | L | 014 | TODO |
 | 017 | Deduplicate the parallel Rolldown/Vite Nuxt apps into `packages/ui` | P3 | L | 015 | TODO |