basalt-ui 2.0.4 → 2.1.0

package/src/cli/index.ts

@@ -148,23 +148,11 @@ function sanitizeSeverity(cfg: BasaltConfig): BasaltConfig {
 /** Does `cwd`'s own `package.json` carry a `basalt` key? — "misconfigured roots" vs "wrong
  *  directory", the failure a root-invoked hook hits since 1.29.0's single resolver. Never a walk. */
 export function hasBasaltKey(cwd: string): boolean {
-  const raw = readIfExists(resolve(cwd, 'package.json'))
-  try {
-    return raw !== null && (JSON.parse(raw) as { basalt?: unknown }).basalt !== undefined
-  } catch {
-    return false
-  }
+  return readPackageJson<{ basalt?: unknown }>(cwd)?.basalt !== undefined
 }
 
 export function readBasaltConfig(cwd: string): BasaltConfig {
-  try {
-    const pkg = JSON.parse(readFileSync(resolve(cwd, 'package.json'), 'utf8')) as {
-      basalt?: BasaltConfig
-    }
-    return sanitizeSeverity(pkg.basalt ?? {})
-  } catch {
-    return {}
-  }
+  return sanitizeSeverity(readPackageJson<{ basalt?: BasaltConfig }>(cwd)?.basalt ?? {})
 }
 
 /**
@@ -237,13 +225,10 @@ const UNRESOLVED_INSTALL: BasaltInstall = { dir: null, version: null, how: null
 /** `<dir>/node_modules/basalt-ui` when it holds a readable package.json, else null. */
 function basaltInstallAt(dir: string): { dir: string; version: string | null } | null {
   const installDir = resolve(dir, 'node_modules', 'basalt-ui')
-  const raw = readIfExists(resolve(installDir, 'package.json'))
-  if (raw === null) return null
-  try {
-    const pkg = JSON.parse(raw) as { version?: string }
-    return { dir: installDir, version: pkg.version ?? null }
-  } catch {
-    return { dir: installDir, version: null }
+  if (readIfExists(resolve(installDir, 'package.json')) === null) return null
+  return {
+    dir: installDir,
+    version: readPackageJson<{ version?: string }>(installDir)?.version ?? null,
   }
 }
 
@@ -500,31 +485,30 @@ export function readIfExists(abs: string): string | null {
   }
 }
 
+/** `<dir>/package.json` parsed as `T`; null when absent or not JSON. */
+export function readPackageJson<T>(dir: string): T | null {
+  const raw = readIfExists(resolve(dir, 'package.json'))
+  try {
+    return raw === null ? null : (JSON.parse(raw) as T)
+  } catch {
+    return null
+  }
+}
+
 /** Read a shipped source asset from the package root; null if the sibling hasn't authored it yet. */
 export function readSource(pkgRoot: string, source: string): string | null {
   return readIfExists(resolve(pkgRoot, source))
 }
 
 function readPackageName(cwd: string): string {
-  try {
-    const pkg = JSON.parse(readFileSync(resolve(cwd, 'package.json'), 'utf8')) as { name?: string }
-    if (pkg.name && pkg.name.length > 0) return pkg.name
-  } catch {
-    // fall through to dir name
-  }
+  const name = readPackageJson<{ name?: string }>(cwd)?.name
+  if (name && name.length > 0) return name
   return cwd.split('/').filter(Boolean).pop() ?? 'app'
 }
 
 /** The framework's own published version, read from the package root package.json. */
 export function readFrameworkVersion(pkgRoot: string): string {
-  try {
-    const pkg = JSON.parse(readFileSync(resolve(pkgRoot, 'package.json'), 'utf8')) as {
-      version?: string
-    }
-    return pkg.version ?? '0.0.0'
-  } catch {
-    return '0.0.0'
-  }
+  return readPackageJson<{ version?: string }>(pkgRoot)?.version ?? '0.0.0'
 }
 
 /**
@@ -733,20 +717,18 @@ export function resolveAppDir(root: string): AppResolution {
 
 /** True when `pkgName` appears in the consumer's dependencies, devDependencies, or peerDependencies. */
 function hasDependency(cwd: string, pkgName: string): boolean {
-  try {
-    const pkg = JSON.parse(readFileSync(resolve(cwd, 'package.json'), 'utf8')) as {
-      dependencies?: Record<string, string>
-      devDependencies?: Record<string, string>
-      peerDependencies?: Record<string, string>
-    }
-    return Boolean(
-      pkg.dependencies?.[pkgName] ??
-      pkg.devDependencies?.[pkgName] ??
-      pkg.peerDependencies?.[pkgName],
-    )
-  } catch {
-    return false
-  }
+  const pkg =
+    readPackageJson<
+      Record<
+        'dependencies' | 'devDependencies' | 'peerDependencies',
+        Record<string, string> | undefined
+      >
+    >(cwd)
+  return Boolean(
+    pkg?.dependencies?.[pkgName] ??
+    pkg?.devDependencies?.[pkgName] ??
+    pkg?.peerDependencies?.[pkgName],
+  )
 }
 
 /**
@@ -1275,14 +1257,8 @@ export function patchPackageJson(
 ): boolean {
   const abs = resolve(cwd, 'package.json')
   const raw = readIfExists(abs)
-  if (raw === null) return false
-  let pkg: Record<string, unknown>
-  try {
-    pkg = JSON.parse(raw) as Record<string, unknown>
-  } catch {
-    return false
-  }
-  if (!mutate(pkg)) return false
+  const pkg = readPackageJson<Record<string, unknown>>(cwd)
+  if (raw === null || pkg === null || !mutate(pkg)) return false
   const indent = /\n([ \t]+)"/.exec(raw)?.[1] ?? '  '
   writeFileSync(abs, JSON.stringify(pkg, null, indent) + (raw.endsWith('\n') ? '\n' : ''))
   return true
@@ -1689,15 +1665,8 @@ function expandWorkspaceGlobs(cwd: string, patterns: readonly string[]): string[
  * an unrecognized `workspaces` shape.
  */
 function collectWorkspacePackages(cwd: string): WorkspaceWalk {
-  const raw = readIfExists(resolve(cwd, 'package.json'))
-  if (raw === null) return { packages: [], hasWorkspacesField: false }
-
-  let parsed: { workspaces?: unknown; name?: string }
-  try {
-    parsed = JSON.parse(raw) as { workspaces?: unknown; name?: string }
-  } catch {
-    return { packages: [], hasWorkspacesField: false }
-  }
+  const parsed = readPackageJson<{ workspaces?: unknown; name?: string }>(cwd)
+  if (parsed === null) return { packages: [], hasWorkspacesField: false }
 
   const patterns = isStringArray(parsed.workspaces)
     ? parsed.workspaces

package/src/content/highlighter.ts

@@ -64,6 +64,18 @@ const LANG_ALIASES: Record<string, string> = {
 }
 
 let highlighterPromise: Promise<HighlighterCore | null> | null = null
+let warnedMissingPeer = false
+
+/** Dev-only, once per process: the highlighter peers did not resolve, so code stays unhighlighted. */
+function warnMissingPeer(error: unknown): void {
+  if (warnedMissingPeer || process.env['NODE_ENV'] === 'production') return
+  warnedMissingPeer = true
+  console.warn(
+    '[basalt] CodeBlock: syntax highlighting is off — a peer of basalt-ui/content did not load ' +
+      `(${error instanceof Error ? error.message : String(error)}). Code renders unhighlighted. ` +
+      'Install them with: bun add shiki @shikijs/langs @shikijs/themes',
+  )
+}
 
 async function loadHighlighter(): Promise<HighlighterCore | null> {
   const [{ createHighlighterCore }, { createJavaScriptRegexEngine }] = await Promise.all([
@@ -79,7 +91,10 @@ async function loadHighlighter(): Promise<HighlighterCore | null> {
 
 /** Module-level singleton — resolves once; every caller shares the same highlighter instance. */
 function getHighlighter(): Promise<HighlighterCore | null> {
-  highlighterPromise ??= loadHighlighter().catch(() => null)
+  highlighterPromise ??= loadHighlighter().catch((error: unknown) => {
+    warnMissingPeer(error)
+    return null
+  })
   return highlighterPromise
 }
 
@@ -91,7 +106,8 @@ async function ensureLanguage(highlighter: HighlighterCore, lang: string): Promi
   try {
     await highlighter.loadLanguage(loadLang() as LanguageInput)
     return true
-  } catch {
+  } catch (error) {
+    warnMissingPeer(error)
     return false
   }
 }

package/src/shell/app-main.module.css

@@ -103,9 +103,11 @@
    * Block is breathing room under the band's single `--vx-divider` line — nothing aligns to it.
    * `stack-md` (12) on a phone, one rung down (`stack-sm`, 8) from `sm` up where the inline gutter
    * is 16: the page then sits 16 from the seam and 8 under the header, rather than the 20/12 it
-   * used to.
+   * used to. The value rides `--basalt-main-pad-block`, which descendants inherit: the data
+   * table's page-sticky offset reads it instead of repeating this module's `sm` switch.
    */
-  padding: var(--vx-space-stack-md) var(--app-shell-padding);
+  --basalt-main-pad-block: var(--vx-space-stack-md);
+  padding: var(--basalt-main-pad-block) var(--app-shell-padding);
   /* Without this a wide flex/grid child (a bare table, a nowrap control row) sizes Main to ITSELF. */
   min-width: 0;
   overflow-y: auto;
@@ -124,7 +126,7 @@
 
 @media (min-width: 52.5em) {
   .main {
-    padding-block: var(--vx-space-stack-sm);
+    --basalt-main-pad-block: var(--vx-space-stack-sm);
   }
 }
 

package/src/shell/app-sidebar.tsx

@@ -327,7 +327,9 @@ function NavSection({ section, collapsed }: { section: SidebarSection; collapsed
         <SectionLabel>{section.label}</SectionLabel>
         <IconChevron open={!folded} />
       </UnstyledButton>
-      <Collapse expanded={!folded}>
+      {/* The rail hides the header (the only way to unfold), so a folded section would strand its
+          destinations and their badges: the rail ignores the fold; expanding restores it. */}
+      <Collapse expanded={!folded || collapsed}>
         <Stack gap={1}>{items}</Stack>
       </Collapse>
     </div>

package/src/table/data-table.module.css

@@ -70,20 +70,14 @@
  * one rung down to `stack-sm` from `sm` up). A sticky `<thead>` resolves against the scrollport's
  * CONTENT edge, so at `top: 0` it parked that padding below the band and every body row scrolled
  * through the gap. A negative offset equal to the padding moves the stick line out to the band's
- * edge, flush. The two media/token pairs below mirror `.main` there — the layout suite
- * (`data-table.layout.test.ts`, invariant 8) fails on drift. A consumer `stickyHeaderOffset` is an
+ * edge, flush. The padding is read from `--basalt-main-pad-block`, which `.main` sets and owns
+ * (including its `sm` switch), so the two cannot drift; `data-table.layout.test.ts` invariant 8
+ * pins both steps. A consumer `stickyHeaderOffset` is an
  * inline `--table-sticky-header-offset` on the table and beats this class, so it still wins.
  * Outside a shell no `.mantine-AppShell-main` ancestor matches and the offset stays 0.
  */
 :global(.mantine-AppShell-main) .pageSticky {
-  --table-sticky-header-offset: calc(-1 * var(--vx-space-stack-md));
-}
-
-/* theme-allow raw-media-query — mirrors app-main.module.css's own `sm` switch for Main's block padding; invariant 8 in data-table.layout.test.ts fails on drift */
-@media (min-width: 52.5em) {
-  :global(.mantine-AppShell-main) .pageSticky {
-    --table-sticky-header-offset: calc(-1 * var(--vx-space-stack-sm));
-  }
+  --table-sticky-header-offset: calc(-1 * var(--basalt-main-pad-block, 0px));
 }
 
 /*