sitevision-cli 0.6.0-beta.1 → 0.6.0-beta.2

package/dist/cli.js

@@ -12,7 +12,7 @@ import { checkForUpdate } from './utils/version-check.js';
 import { isFirstRun, markFirstRunComplete, getLastSeenVersion, setLastSeenVersion, } from './utils/config.js';
 import { WelcomeScreen } from './components/WelcomeScreen.js';
 import { AnimatedLogo } from './components/AnimatedLogo.js';
-import { printBranding, BIG_LOGO_WIDTH } from './utils/branding.js';
+import { printBranding, BIG_LOGO, BIG_LOGO_WIDTH, SMALL_LOGO, SMALL_LOGO_WIDTH, } from './utils/branding.js';
 const pkg = JSON.parse(readFileSync(new URL('../package.json', import.meta.url), 'utf8'));
 const cli = meow(`
 	Usage
@@ -85,10 +85,19 @@ function printMasthead(version) {
         `${spaces(gap)}${DIM}${right}${RESET}${spaces(padding)}${CYAN}│${RESET}`);
     console.log(`${CYAN}╰${border}╯${RESET}`);
 }
+// Pick the widest wordmark that fits the terminal, or undefined if even the
+// compact one would wrap (caller then falls back to the static masthead).
+function pickIntroArt(columns) {
+    if (columns >= BIG_LOGO_WIDTH)
+        return BIG_LOGO;
+    if (columns >= SMALL_LOGO_WIDTH)
+        return SMALL_LOGO;
+    return undefined;
+}
 // Play the one-shot animated wordmark and resolve once it finishes.
-async function playIntro() {
+async function playIntro(art) {
     await new Promise(resolve => {
-        const app = render(_jsx(AnimatedLogo, { onDone: () => app.unmount() }));
+        const app = render(_jsx(AnimatedLogo, { art: art, onDone: () => app.unmount() }));
         app.waitUntilExit().then(() => resolve(), () => resolve());
     });
 }
@@ -104,19 +113,18 @@ async function main() {
     const lastSeen = getLastSeenVersion();
     const isUpdate = !firstRun && lastSeen !== undefined && lastSeen !== pkg.version;
     // On the plain interactive `svc` (no command), play the animated wordmark
-    // instead of the static masthead — but only when stdout is wide enough for
-    // the art and stdin is a TTY (so it doesn't run in CI / piped input).
-    const wantsIntro = !firstRun &&
-        !isUpdate &&
-        !commandName &&
-        Boolean(process.stdin.isTTY) &&
-        (process.stdout.columns ?? 0) >= BIG_LOGO_WIDTH;
+    // instead of the static masthead — sized to the terminal. Only on a TTY so it
+    // doesn't run in CI / piped input.
+    const introEligible = !firstRun && !isUpdate && !commandName && Boolean(process.stdin.isTTY);
+    const introArt = introEligible
+        ? pickIntroArt(process.stdout.columns ?? 0)
+        : undefined;
     if (!firstRun) {
         if (isUpdate) {
             printBranding();
             console.log(`\x1b[32m\n  ✨ Updated to v${pkg.version}\x1b[0m \x1b[2m(from v${lastSeen})\x1b[0m\n`);
         }
-        else if (!wantsIntro) {
+        else if (!introArt) {
             printMasthead(pkg.version);
         }
         // Record the current version so the banner shows once per upgrade.
@@ -152,8 +160,8 @@ async function main() {
     // If no command, show interactive menu (with the animated intro first when
     // the terminal can fit it).
     if (!commandName) {
-        if (wantsIntro) {
-            await playIntro();
+        if (introArt) {
+            await playIntro(introArt);
         }
         render(_jsx(App, { project: project }));
         return;

package/dist/components/AnimatedLogo.d.ts

@@ -1,9 +1,10 @@
 interface Props {
+    art?: string[];
     onDone: () => void;
 }
 /**
  * One-shot startup flair: wipes the big wordmark in left-to-right while a
  * rainbow gradient drifts across it, then calls `onDone`. Purely decorative.
  */
-export declare function AnimatedLogo({ onDone }: Props): import("react").JSX.Element;
+export declare function AnimatedLogo({ art, onDone }: Props): import("react").JSX.Element;
 export {};

package/dist/components/AnimatedLogo.js

@@ -1,15 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, useEffect, useRef, useState } from 'react';
 import { Box, Text } from 'ink';
-import { AUTHOR, BIG_LOGO, BIG_LOGO_WIDTH } from '../utils/branding.js';
+import { AUTHOR, BIG_LOGO } from '../utils/branding.js';
 const FRAME_MS = 45;
 const SWEEP_COLS_PER_FRAME = 7; // how fast the wipe edge moves left → right
 const BAND = 18; // width of the rainbow zone trailing the sweep edge
 const HOLD_FRAMES = 6; // frames to hold the fully-settled logo before finishing
-// The sweep edge runs past the right side by BAND so the rainbow zone trails
-// all the way off, leaving every character settled to the terminal default.
-const SWEEP_FRAMES = Math.ceil((BIG_LOGO_WIDTH + BAND) / SWEEP_COLS_PER_FRAME);
-const TOTAL_FRAMES = SWEEP_FRAMES + HOLD_FRAMES;
+// Frames to fully reveal and settle art `width` columns wide. The sweep edge
+// runs past the right side by BAND so the rainbow zone trails all the way off,
+// leaving every character settled to the terminal default.
+function framesFor(width) {
+    return Math.ceil((width + BAND) / SWEEP_COLS_PER_FRAME) + HOLD_FRAMES;
+}
 // Convert HSL (h in degrees, s/l in 0..1) to a #rrggbb string for ink/chalk.
 function hslToHex(h, s, l) {
     const hue = h / 360;
@@ -59,9 +61,11 @@ function buildSpans(line, y, frame, edge) {
  * One-shot startup flair: wipes the big wordmark in left-to-right while a
  * rainbow gradient drifts across it, then calls `onDone`. Purely decorative.
  */
-export function AnimatedLogo({ onDone }) {
+export function AnimatedLogo({ art = BIG_LOGO, onDone }) {
     const [frame, setFrame] = useState(0);
     const intervalRef = useRef(undefined);
+    const width = Math.max(...art.map(line => [...line].length));
+    const total = framesFor(width);
     useEffect(() => {
         intervalRef.current = setInterval(() => {
             setFrame(current => current + 1);
@@ -73,11 +77,11 @@ export function AnimatedLogo({ onDone }) {
     // Stop the loop and notify the parent exactly once, when the last frame is
     // reached. Kept out of the setFrame updater so that updater stays pure.
     useEffect(() => {
-        if (frame >= TOTAL_FRAMES) {
+        if (frame >= total) {
             clearInterval(intervalRef.current);
             onDone();
         }
-    }, [frame, onDone]);
+    }, [frame, total, onDone]);
     const edge = (frame + 1) * SWEEP_COLS_PER_FRAME;
-    return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [BIG_LOGO.map((line, y) => (_jsx(Text, { children: buildSpans(line, y, frame, edge).map((span, index) => (_jsx(Fragment, { children: span.color ? (_jsx(Text, { color: span.color, children: span.text })) : (_jsx(Text, { children: span.text })) }, index))) }, y))), _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { dimColor: true, children: '  a tool by ' }), _jsx(Text, { bold: true, children: AUTHOR })] })] }));
+    return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [art.map((line, y) => (_jsx(Text, { children: buildSpans(line, y, frame, edge).map((span, index) => (_jsx(Fragment, { children: span.color ? (_jsx(Text, { color: span.color, children: span.text })) : (_jsx(Text, { children: span.text })) }, index))) }, y))), _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { dimColor: true, children: '  a tool by ' }), _jsx(Text, { bold: true, children: AUTHOR })] })] }));
 }

package/dist/utils/branding.d.ts

@@ -14,6 +14,13 @@ export declare const AUTHOR = "Rasmus S\u00F6derstr\u00F6m";
 export declare const BIG_LOGO: string[];
 /** Display width of the widest BIG_LOGO line. */
 export declare const BIG_LOGO_WIDTH: number;
+/**
+ * Compact "Sitevision CLI" wordmark, animated on terminals too narrow for
+ * BIG_LOGO. ~72 columns wide.
+ */
+export declare const SMALL_LOGO: string[];
+/** Display width of the widest SMALL_LOGO line. */
+export declare const SMALL_LOGO_WIDTH: number;
 /**
  * Print the logo + author line straight to stdout (non-interactive), mirroring
  * how the masthead is printed. Used for the update banner.

package/dist/utils/branding.js

@@ -35,6 +35,17 @@ export const BIG_LOGO = [
 ];
 /** Display width of the widest BIG_LOGO line. */
 export const BIG_LOGO_WIDTH = Math.max(...BIG_LOGO.map(line => line.length));
+/**
+ * Compact "Sitevision CLI" wordmark, animated on terminals too narrow for
+ * BIG_LOGO. ~72 columns wide.
+ */
+export const SMALL_LOGO = [
+    '▄█████ ▄▄ ▄▄▄▄▄▄ ▄▄▄▄▄ ▄▄ ▄▄ ▄▄  ▄▄▄▄ ▄▄  ▄▄▄  ▄▄  ▄▄   ▄█████ ██     ██ ',
+    '▀▀▀▄▄▄ ██   ██   ██▄▄  ██▄██ ██ ███▄▄ ██ ██▀██ ███▄██   ██     ██     ██ ',
+    '█████▀ ██   ██   ██▄▄▄  ▀█▀  ██ ▄▄██▀ ██ ▀███▀ ██ ▀██   ▀█████ ██████ ██ ',
+];
+/** Display width of the widest SMALL_LOGO line. */
+export const SMALL_LOGO_WIDTH = Math.max(...SMALL_LOGO.map(line => [...line].length));
 /**
  * Print the logo + author line straight to stdout (non-interactive), mirroring
  * how the masthead is printed. Used for the update banner.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "sitevision-cli",
-	"version": "0.6.0-beta.1",
+	"version": "0.6.0-beta.2",
 	"license": "MIT",
 	"bin": {
 		"svc": "dist/cli.js"