Skip to content

Commit f471b6c

Browse files
antfubotantfubot
authored
perf: deflate dts rollups by splitting published types out of framework type graphs (#237)
1 parent 3afb315 commit f471b6c

6 files changed

Lines changed: 98 additions & 84 deletions

File tree

‎packages/hub-ui/src/client/dock-preferences.ts‎

Lines changed: 0 additions & 26 deletions
This file was deleted.

‎packages/hub-ui/src/client/embedded/visibility.ts‎

Lines changed: 1 addition & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,6 @@
1+
import type { EmbeddedVisibility } from '../../types'
12
import { HUB_UI_HIDE_EVENT } from '../constants'
23

3-
/**
4-
* How the embedded floating dock reveals itself on a fresh page — the
5-
* reference UI's port of Nuxt DevTools' opt-in overlay, published as
6-
* `ConnectionMeta.configs.ui.embeddedVisibility` and set via
7-
* `createUi({ embeddedVisibility })`.
8-
*
9-
* - `normal` (default) — the dock is shown immediately.
10-
* - `passive` — the dock starts hidden and a console hint offers the reveal
11-
* shortcut; revealing persists per-origin, so later sessions on this
12-
* browser start shown. The "Hide" command returns to passive.
13-
* - `hidden` — the dock starts hidden and the shortcut reveals it for the
14-
* current session only; nothing is persisted.
15-
*
16-
* Whatever the policy, the reveal state is a user-overridable preference —
17-
* the same shape as the float/edge dock mode: the config seeds it, the
18-
* visitor's own reveal/hide wins from then on.
19-
*/
20-
export type EmbeddedVisibility = 'normal' | 'passive' | 'hidden'
21-
224
/** Per-origin persisted reveal flag for `passive` mode. */
235
const REVEAL_STORAGE_KEY = 'devframes-dock-revealed'
246

‎packages/hub-ui/src/client/state/branding.ts‎

Lines changed: 1 addition & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,8 @@
11
import type { Ref } from 'vue'
2+
import type { BrandingLogo, DevframeBranding } from '../../types'
23
import { computed, ref } from 'vue'
34
import { isDark } from './color-mode'
45

5-
/**
6-
* A logo asset — a single URL/data-URI, or per-color-scheme variants. The dark
7-
* variant falls back to the light one when only `light` is given (or a bare
8-
* string is used for both).
9-
*/
10-
export type BrandingLogo = string | { light: string, dark: string }
11-
12-
/**
13-
* Consumer-facing branding for the reference hub-ui. Every field is optional
14-
* and falls back to devframe's own identity. Published as
15-
* `ConnectionMeta.configs.ui.branding` via `createUi({ branding })`, and
16-
* read from the one connection handshake the dock already performs —
17-
* `ConnectionMeta` has its own cross-realm propagation (see
18-
* `DEVFRAME_CONNECTION_KEY`), so branding needs no globals or query params
19-
* of its own.
20-
*/
21-
export interface DevframeBranding {
22-
/** Product name — the wordmark, window titles, and all user-visible copy. */
23-
productName?: string
24-
/** Logo mark (URL / data-URI), rendered via `<img>`. */
25-
logo?: BrandingLogo
26-
/** Optional standalone wordmark image; when absent, mark + productName text is composed. */
27-
wordmark?: BrandingLogo
28-
/** Brand color; feeds `--devframe-primary` and the whole primary ramp. */
29-
primaryColor?: string
30-
/** Short line for the auth screen and the standalone meta description. */
31-
tagline?: string
32-
/** Favicon URL — applied on the standalone viewer and the popped-out window only. */
33-
favicon?: string
34-
/** Window/tab title; defaults to `productName`. */
35-
windowTitle?: string
36-
}
37-
386
/** Branding with defaults resolved — what the UI actually renders. */
397
export interface ResolvedBranding {
408
productName: string

‎packages/hub-ui/src/index.ts‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,10 @@
11
import type { DevframeHubUi } from '@devframes/hub/initiate'
2-
import type { DevframeDockPreferences } from './client/dock-preferences'
3-
import type { EmbeddedVisibility } from './client/embedded/visibility'
4-
import type { DevframeBranding } from './client/state/branding'
2+
import type { DevframeBranding, DevframeDockPreferences, EmbeddedVisibility } from './types'
53
import { existsSync } from 'node:fs'
64
import { join } from 'node:path'
75
import { fileURLToPath } from 'node:url'
86

9-
export type { DevframeDockPreferences } from './client/dock-preferences'
10-
export type { EmbeddedVisibility } from './client/embedded/visibility'
11-
export type { DevframeBranding } from './client/state/branding'
7+
export type { DevframeBranding, DevframeDockPreferences, EmbeddedVisibility } from './types'
128

139
declare module 'devframe/types' {
1410
interface DevframeConnectionConfigsRegistry {

‎packages/hub-ui/src/types.ts‎

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
/**
2+
* Published `createUi()` config types, kept framework-free so the node
3+
* entry's declaration rollup (`dist/index.d.mts`) never pulls in Vue's type
4+
* surface. Client modules that need these types import them *from* here
5+
* (never the reverse) — see `client/state/branding.ts`,
6+
* `client/embedded/visibility.ts`.
7+
*/
8+
9+
/**
10+
* A logo asset — a single URL/data-URI, or per-color-scheme variants. The dark
11+
* variant falls back to the light one when only `light` is given (or a bare
12+
* string is used for both).
13+
*/
14+
export type BrandingLogo = string | { light: string, dark: string }
15+
16+
/**
17+
* Consumer-facing branding for the reference hub-ui. Every field is optional
18+
* and falls back to devframe's own identity. Published as
19+
* `ConnectionMeta.configs.ui.branding` via `createUi({ branding })`, and
20+
* read from the one connection handshake the dock already performs —
21+
* `ConnectionMeta` has its own cross-realm propagation (see
22+
* `DEVFRAME_CONNECTION_KEY`), so branding needs no globals or query params
23+
* of its own.
24+
*/
25+
export interface DevframeBranding {
26+
/** Product name — the wordmark, window titles, and all user-visible copy. */
27+
productName?: string
28+
/** Logo mark (URL / data-URI), rendered via `<img>`. */
29+
logo?: BrandingLogo
30+
/** Optional standalone wordmark image; when absent, mark + productName text is composed. */
31+
wordmark?: BrandingLogo
32+
/** Brand color; feeds `--devframe-primary` and the whole primary ramp. */
33+
primaryColor?: string
34+
/** Short line for the auth screen and the standalone meta description. */
35+
tagline?: string
36+
/** Favicon URL — applied on the standalone viewer and the popped-out window only. */
37+
favicon?: string
38+
/** Window/tab title; defaults to `productName`. */
39+
windowTitle?: string
40+
}
41+
42+
/**
43+
* The reference UI's dock-bar rendering preferences, set via
44+
* `createUi({ dockPreferences })` and published as
45+
* `ConnectionMeta.configs.ui.dockPreferences`. Read by the embedded dock and
46+
* the standalone viewer at boot.
47+
*
48+
* Like the float/edge dock mode, these seed user-overridable state — the
49+
* config sets the default, the visitor's own choice wins from then on.
50+
*/
51+
export interface DevframeDockPreferences {
52+
/**
53+
* The top-level dock-bar **category** ordering — a map of category id →
54+
* ordering weight (lower sorts earlier), merged beneath
55+
* `DEFAULT_CATEGORIES_ORDER`.
56+
*/
57+
categoryOrder?: Record<string, number>
58+
/**
59+
* Preferred inline-item capacity for the floating dock bar before entries
60+
* overflow. Edge mode ignores it — it shows every entry with no cutoff.
61+
*/
62+
maxVisibleItems?: number
63+
/** Seeds a first-run visitor's dock mode (float vs edge). */
64+
defaultMode?: 'float' | 'edge'
65+
/** Seeds a first-run visitor's dock position. */
66+
defaultPosition?: 'left' | 'right' | 'top' | 'bottom'
67+
}
68+
69+
/**
70+
* How the embedded floating dock reveals itself on a fresh page — the
71+
* reference UI's port of Nuxt DevTools' opt-in overlay, published as
72+
* `ConnectionMeta.configs.ui.embeddedVisibility` and set via
73+
* `createUi({ embeddedVisibility })`.
74+
*
75+
* - `normal` (default) — the dock is shown immediately.
76+
* - `passive` — the dock starts hidden and a console hint offers the reveal
77+
* shortcut; revealing persists per-origin, so later sessions on this
78+
* browser start shown. The "Hide" command returns to passive.
79+
* - `hidden` — the dock starts hidden and the shortcut reveals it for the
80+
* current session only; nothing is persisted.
81+
*
82+
* Whatever the policy, the reveal state is a user-overridable preference —
83+
* the same shape as the float/edge dock mode: the config seeds it, the
84+
* visitor's own reveal/hide wins from then on.
85+
*/
86+
export type EmbeddedVisibility = 'normal' | 'passive' | 'hidden'

‎plugins/messages/tsdown.config.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,14 @@ export default defineConfig([
3636
clean: false,
3737
platform: 'neutral',
3838
tsconfig,
39+
// `client/index.ts` re-exports `useMessages(): Reactive<MessagesState>` —
40+
// a genuine Vue reactivity type, not just a documentation import. Without
41+
// this, the dts bundler inlines Vue's entire runtime-core/reactivity type
42+
// surface to describe `Reactive<T>` (≈935 KB); `neverBundle` keeps the
43+
// reference as `import('vue').Reactive<...>` instead. This build is
44+
// `emitDtsOnly`, so it has no effect on the JS output (built separately
45+
// by the Vite lib build for the client, and by the node build above).
46+
deps: { neverBundle: ['vue'] },
3947
dts: { emitDtsOnly: true },
4048
outExtensions: () => ({ dts: '.d.mts' }),
4149
entry: { ...clientEntries, ...serverEntries },

0 commit comments

Comments
 (0)