@posthog/wizard 2.9.1 → 2.10.0

package/dist/src/ui/tui/playground/demos/HealthCheckDemo.js

@@ -1,57 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * HealthCheckDemo — Playground demo for health check UI components.
- *
- * Shows the ModalOverlay with ServiceHealthList, cycling through states:
- *   1. Checking (spinner) — 2 seconds
- *   2. Blocking outage modal (Anthropic down, npm degraded)
- *
- * Renders components directly (not HealthCheckScreen) to avoid useInput
- * conflicts with TabContainer's key handling.
- */
-import { useEffect, useState } from 'react';
-import { Box, Text } from 'ink';
-import { LoadingBox, ModalOverlay } from '../../primitives/index.js';
-import { Icons } from '../../styles.js';
-import { ServiceHealthList } from '../../components/ServiceHealthList.js';
-import { getBlockingServiceKeys } from '../../../../lib/health-checks/readiness.js';
-import { ServiceHealthStatus } from '../../../../lib/health-checks/types.js';
-const HEALTHY = { status: ServiceHealthStatus.Healthy };
-const MOCK_HEALTH = {
-    anthropic: { status: ServiceHealthStatus.Down, rawIndicator: 'major' },
-    posthogOverall: HEALTHY,
-    posthogComponents: { status: ServiceHealthStatus.Healthy },
-    github: HEALTHY,
-    npmOverall: {
-        status: ServiceHealthStatus.Degraded,
-        rawIndicator: 'minor',
-    },
-    npmComponents: {
-        status: ServiceHealthStatus.Degraded,
-        degradedOrDownComponents: [
-            {
-                name: 'Registry API',
-                status: ServiceHealthStatus.Degraded,
-                rawStatus: 'degraded_performance',
-            },
-        ],
-    },
-    cloudflareOverall: HEALTHY,
-    cloudflareComponents: { status: ServiceHealthStatus.Healthy },
-    llmGateway: HEALTHY,
-    mcp: HEALTHY,
-    githubReleases: HEALTHY,
-};
-export const HealthCheckDemo = () => {
-    const [showOutage, setShowOutage] = useState(false);
-    useEffect(() => {
-        const timer = setTimeout(() => setShowOutage(true), 2000);
-        return () => clearTimeout(timer);
-    }, []);
-    if (!showOutage) {
-        return (_jsx(Box, { flexDirection: "column", flexGrow: 1, alignItems: "center", justifyContent: "center", children: _jsx(LoadingBox, { message: "Checking service status..." }) }));
-    }
-    const blockingKeys = getBlockingServiceKeys(MOCK_HEALTH);
-    return (_jsxs(ModalOverlay, { borderColor: "red", title: `${Icons.warning} Ongoing service disruptions`, width: 72, footer: _jsx(Box, { marginLeft: 2, children: _jsx(Text, { dimColor: true, children: "Continue [Enter] / Exit [Esc] (disabled in playground)" }) }), children: [_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Box, { marginBottom: 1, children: _jsxs(Text, { children: [_jsx(Text, { color: "red", children: Icons.squareFilled }), _jsx(Text, { dimColor: true, children: " Down " }), _jsx(Text, { color: "#DC9300", children: Icons.squareFilled }), _jsx(Text, { dimColor: true, children: " Degraded" })] }) }), _jsx(ServiceHealthList, { health: MOCK_HEALTH, filterKeys: blockingKeys, showHealthy: false })] }), _jsx(Text, { dimColor: true, children: "The wizard may not work reliably while services are affected." })] }));
-};
-//# sourceMappingURL=HealthCheckDemo.js.map

package/dist/src/ui/tui/playground/demos/HealthCheckDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HealthCheckDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/HealthCheckDemo.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * HealthCheckDemo — Playground demo for health check UI components.\n *\n * Shows the ModalOverlay with ServiceHealthList, cycling through states:\n *   1. Checking (spinner) — 2 seconds\n *   2. Blocking outage modal (Anthropic down, npm degraded)\n *\n * Renders components directly (not HealthCheckScreen) to avoid useInput\n * conflicts with TabContainer's key handling.\n */\n\nimport { useEffect, useState } from 'react';\nimport { Box, Text } from 'ink';\nimport { LoadingBox, ModalOverlay } from '../../primitives/index.js';\nimport { Icons } from '../../styles.js';\nimport { ServiceHealthList } from '../../components/ServiceHealthList.js';\nimport { getBlockingServiceKeys } from '../../../../lib/health-checks/readiness.js';\nimport { ServiceHealthStatus } from '../../../../lib/health-checks/types.js';\nimport type { AllServicesHealth } from '../../../../lib/health-checks/types.js';\n\nconst HEALTHY = { status: ServiceHealthStatus.Healthy } as const;\n\nconst MOCK_HEALTH: AllServicesHealth = {\n  anthropic: { status: ServiceHealthStatus.Down, rawIndicator: 'major' },\n  posthogOverall: HEALTHY,\n  posthogComponents: { status: ServiceHealthStatus.Healthy },\n  github: HEALTHY,\n  npmOverall: {\n    status: ServiceHealthStatus.Degraded,\n    rawIndicator: 'minor',\n  },\n  npmComponents: {\n    status: ServiceHealthStatus.Degraded,\n    degradedOrDownComponents: [\n      {\n        name: 'Registry API',\n        status: ServiceHealthStatus.Degraded,\n        rawStatus: 'degraded_performance',\n      },\n    ],\n  },\n  cloudflareOverall: HEALTHY,\n  cloudflareComponents: { status: ServiceHealthStatus.Healthy },\n  llmGateway: HEALTHY,\n  mcp: HEALTHY,\n  githubReleases: HEALTHY,\n};\n\nexport const HealthCheckDemo = () => {\n  const [showOutage, setShowOutage] = useState(false);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setShowOutage(true), 2000);\n    return () => clearTimeout(timer);\n  }, []);\n\n  if (!showOutage) {\n    return (\n      <Box\n        flexDirection=\"column\"\n        flexGrow={1}\n        alignItems=\"center\"\n        justifyContent=\"center\"\n      >\n        <LoadingBox message=\"Checking service status...\" />\n      </Box>\n    );\n  }\n\n  const blockingKeys = getBlockingServiceKeys(MOCK_HEALTH);\n\n  return (\n    <ModalOverlay\n      borderColor=\"red\"\n      title={`${Icons.warning} Ongoing service disruptions`}\n      width={72}\n      footer={\n        <Box marginLeft={2}>\n          <Text dimColor>\n            Continue [Enter] / Exit [Esc] (disabled in playground)\n          </Text>\n        </Box>\n      }\n    >\n      <Box flexDirection=\"column\" marginBottom={1}>\n        <Box marginBottom={1}>\n          <Text>\n            <Text color=\"red\">{Icons.squareFilled}</Text>\n            <Text dimColor> Down </Text>\n            <Text color=\"#DC9300\">{Icons.squareFilled}</Text>\n            <Text dimColor> Degraded</Text>\n          </Text>\n        </Box>\n\n        <ServiceHealthList\n          health={MOCK_HEALTH}\n          filterKeys={blockingKeys}\n          showHealthy={false}\n        />\n      </Box>\n\n      <Text dimColor>\n        The wizard may not work reliably while services are affected.\n      </Text>\n    </ModalOverlay>\n  );\n};\n"]}

package/dist/src/ui/tui/playground/demos/InputDemo.d.ts

@@ -1,4 +0,0 @@
-/**
- * InputDemo — Demonstrates PickerMenu (single + multi) and ConfirmationInput.
- */
-export declare const InputDemo: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/tui/playground/demos/InputDemo.js

@@ -1,53 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * InputDemo — Demonstrates PickerMenu (single + multi) and ConfirmationInput.
- */
-import { Box, Text } from 'ink';
-import { useState } from 'react';
-import { PickerMenu, ConfirmationInput } from '../../primitives/index.js';
-import { Colors } from '../../styles.js';
-var DemoStep;
-(function (DemoStep) {
-    DemoStep["Single"] = "single";
-    DemoStep["Multi"] = "multi";
-    DemoStep["Confirm"] = "confirm";
-    DemoStep["Done"] = "done";
-})(DemoStep || (DemoStep = {}));
-export const InputDemo = () => {
-    const [step, setStep] = useState(DemoStep.Single);
-    const [results, setResults] = useState([]);
-    if (step === DemoStep.Single) {
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: Colors.accent, children: "Input Demo \u2014 Single Select" }), _jsx(Box, { height: 1 }), _jsx(PickerMenu, { message: "Pick a color", options: [
-                        { label: 'Red', value: 'red', hint: 'warm' },
-                        { label: 'Blue', value: 'blue', hint: 'cool' },
-                        { label: 'Green', value: 'green', hint: 'natural' },
-                    ], onSelect: (value) => {
-                        setResults((prev) => [...prev, `Single: ${value}`]);
-                        setStep(DemoStep.Multi);
-                    } })] }));
-    }
-    if (step === DemoStep.Multi) {
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: Colors.accent, children: "Input Demo \u2014 Multi Select" }), _jsx(Box, { height: 1 }), _jsx(PickerMenu, { message: "Pick toppings", mode: "multi", options: [
-                        { label: 'Cheese', value: 'cheese' },
-                        { label: 'Pepperoni', value: 'pepperoni' },
-                        { label: 'Mushrooms', value: 'mushrooms' },
-                        { label: 'Onions', value: 'onions' },
-                    ], onSelect: (values) => {
-                        const arr = Array.isArray(values) ? values : [values];
-                        setResults((prev) => [...prev, `Multi: ${arr.join(', ')}`]);
-                        setStep(DemoStep.Confirm);
-                    } })] }));
-    }
-    if (step === DemoStep.Confirm) {
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: Colors.accent, children: "Input Demo \u2014 Confirmation" }), _jsx(Box, { height: 1 }), _jsx(ConfirmationInput, { message: "Are you satisfied with your choices?", onConfirm: () => {
-                        setResults((prev) => [...prev, 'Confirmed: Yes']);
-                        setStep(DemoStep.Done);
-                    }, onCancel: () => {
-                        setResults((prev) => [...prev, 'Confirmed: No']);
-                        setStep(DemoStep.Done);
-                    } })] }));
-    }
-    // done
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: Colors.accent, children: "Input Demo \u2014 Results" }), _jsx(Box, { height: 1 }), results.map((r, i) => (_jsxs(Text, { color: Colors.success, children: ['\u2714', " ", r] }, i))), _jsx(Box, { height: 1 }), _jsx(Text, { dimColor: true, children: "Switch away from this tab and back to restart." })] }));
-};
-//# sourceMappingURL=InputDemo.js.map

package/dist/src/ui/tui/playground/demos/InputDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InputDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/InputDemo.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * InputDemo — Demonstrates PickerMenu (single + multi) and ConfirmationInput.\n */\n\nimport { Box, Text } from 'ink';\nimport { useState } from 'react';\nimport { PickerMenu, ConfirmationInput } from '../../primitives/index.js';\nimport { Colors } from '../../styles.js';\n\nenum DemoStep {\n  Single = 'single',\n  Multi = 'multi',\n  Confirm = 'confirm',\n  Done = 'done',\n}\n\nexport const InputDemo = () => {\n  const [step, setStep] = useState<DemoStep>(DemoStep.Single);\n  const [results, setResults] = useState<string[]>([]);\n\n  if (step === DemoStep.Single) {\n    return (\n      <Box flexDirection=\"column\">\n        <Text bold color={Colors.accent}>\n          Input Demo — Single Select\n        </Text>\n        <Box height={1} />\n        <PickerMenu\n          message=\"Pick a color\"\n          options={[\n            { label: 'Red', value: 'red', hint: 'warm' },\n            { label: 'Blue', value: 'blue', hint: 'cool' },\n            { label: 'Green', value: 'green', hint: 'natural' },\n          ]}\n          onSelect={(value) => {\n            setResults((prev) => [...prev, `Single: ${value}`]);\n            setStep(DemoStep.Multi);\n          }}\n        />\n      </Box>\n    );\n  }\n\n  if (step === DemoStep.Multi) {\n    return (\n      <Box flexDirection=\"column\">\n        <Text bold color={Colors.accent}>\n          Input Demo — Multi Select\n        </Text>\n        <Box height={1} />\n        <PickerMenu\n          message=\"Pick toppings\"\n          mode=\"multi\"\n          options={[\n            { label: 'Cheese', value: 'cheese' },\n            { label: 'Pepperoni', value: 'pepperoni' },\n            { label: 'Mushrooms', value: 'mushrooms' },\n            { label: 'Onions', value: 'onions' },\n          ]}\n          onSelect={(values) => {\n            const arr = Array.isArray(values) ? values : [values];\n            setResults((prev) => [...prev, `Multi: ${arr.join(', ')}`]);\n            setStep(DemoStep.Confirm);\n          }}\n        />\n      </Box>\n    );\n  }\n\n  if (step === DemoStep.Confirm) {\n    return (\n      <Box flexDirection=\"column\">\n        <Text bold color={Colors.accent}>\n          Input Demo — Confirmation\n        </Text>\n        <Box height={1} />\n        <ConfirmationInput\n          message=\"Are you satisfied with your choices?\"\n          onConfirm={() => {\n            setResults((prev) => [...prev, 'Confirmed: Yes']);\n            setStep(DemoStep.Done);\n          }}\n          onCancel={() => {\n            setResults((prev) => [...prev, 'Confirmed: No']);\n            setStep(DemoStep.Done);\n          }}\n        />\n      </Box>\n    );\n  }\n\n  // done\n  return (\n    <Box flexDirection=\"column\">\n      <Text bold color={Colors.accent}>\n        Input Demo — Results\n      </Text>\n      <Box height={1} />\n      {results.map((r, i) => (\n        <Text key={i} color={Colors.success}>\n          {'\\u2714'} {r}\n        </Text>\n      ))}\n      <Box height={1} />\n      <Text dimColor>Switch away from this tab and back to restart.</Text>\n    </Box>\n  );\n};\n"]}

package/dist/src/ui/tui/playground/demos/LayoutDemo.d.ts

@@ -1,5 +0,0 @@
-/**
- * LayoutDemo — Demonstrates CardLayout + SplitView.
- * Cycles alignment enums with keyboard shortcuts.
- */
-export declare const LayoutDemo: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/tui/playground/demos/LayoutDemo.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * LayoutDemo — Demonstrates CardLayout + SplitView.
- * Cycles alignment enums with keyboard shortcuts.
- */
-import { Box, Text, useInput } from 'ink';
-import { useState } from 'react';
-import { CardLayout, SplitView } from '../../primitives/index.js';
-import { HAlign, VAlign, Colors } from '../../styles.js';
-const hAligns = [HAlign.Left, HAlign.Center, HAlign.Right];
-const vAligns = [VAlign.Top, VAlign.Center, VAlign.Bottom];
-const hLabels = ['Left', 'Center', 'Right'];
-const vLabels = ['Top', 'Center', 'Bottom'];
-export const LayoutDemo = () => {
-    const [hIdx, setHIdx] = useState(0);
-    const [vIdx, setVIdx] = useState(0);
-    useInput((input) => {
-        if (input === 'h')
-            setHIdx((i) => (i + 1) % hAligns.length);
-        if (input === 'v')
-            setVIdx((i) => (i + 1) % vAligns.length);
-    });
-    return (_jsxs(Box, { flexDirection: "column", flexGrow: 1, children: [_jsx(Text, { bold: true, color: Colors.accent, children: "Layout Demo" }), _jsxs(Text, { dimColor: true, children: ["Press [h] to cycle hAlign (", hLabels[hIdx], "), [v] to cycle vAlign (", vLabels[vIdx], ")"] }), _jsx(Box, { height: 1 }), _jsx(SplitView, { left: _jsx(CardLayout, { hAlign: hAligns[hIdx], vAlign: vAligns[vIdx], children: _jsx(Box, { borderStyle: "single", borderColor: Colors.primary, paddingX: 1, children: _jsx(Text, { color: Colors.primary, children: "Left Pane" }) }) }), right: _jsx(CardLayout, { hAlign: HAlign.Center, vAlign: VAlign.Center, children: _jsx(Box, { borderStyle: "single", borderColor: Colors.accent, paddingX: 1, children: _jsx(Text, { color: Colors.accent, children: "Right Pane" }) }) }) })] }));
-};
-//# sourceMappingURL=LayoutDemo.js.map

package/dist/src/ui/tui/playground/demos/LayoutDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/LayoutDemo.tsx"],"names":[],"mappings":";AAAA;;;GAGG;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzD,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;AAC3D,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;AAC3D,MAAM,OAAO,GAAG,CAAC,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;AAC5C,MAAM,OAAO,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAE5C,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE;IAC7B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IACpC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAEpC,QAAQ,CAAC,CAAC,KAAK,EAAE,EAAE;QACjB,IAAI,KAAK,KAAK,GAAG;YAAE,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;QAC5D,IAAI,KAAK,KAAK,GAAG;YAAE,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;IAC9D,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,MAAC,GAAG,IAAC,aAAa,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,aACrC,KAAC,IAAI,IAAC,IAAI,QAAC,KAAK,EAAE,MAAM,CAAC,MAAM,4BAExB,EACP,MAAC,IAAI,IAAC,QAAQ,kDACgB,OAAO,CAAC,IAAI,CAAC,8BACxC,OAAO,CAAC,IAAI,CAAC,SACT,EACP,KAAC,GAAG,IAAC,MAAM,EAAE,CAAC,GAAI,EAClB,KAAC,SAAS,IACR,IAAI,EACF,KAAC,UAAU,IAAC,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,YACtD,KAAC,GAAG,IAAC,WAAW,EAAC,QAAQ,EAAC,WAAW,EAAE,MAAM,CAAC,OAAO,EAAE,QAAQ,EAAE,CAAC,YAChE,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,0BAAkB,GACzC,GACK,EAEf,KAAK,EACH,KAAC,UAAU,IAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,YACtD,KAAC,GAAG,IAAC,WAAW,EAAC,QAAQ,EAAC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,EAAE,CAAC,YAC/D,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,MAAM,2BAAmB,GACzC,GACK,GAEf,IACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * LayoutDemo — Demonstrates CardLayout + SplitView.\n * Cycles alignment enums with keyboard shortcuts.\n */\n\nimport { Box, Text, useInput } from 'ink';\nimport { useState } from 'react';\nimport { CardLayout, SplitView } from '../../primitives/index.js';\nimport { HAlign, VAlign, Colors } from '../../styles.js';\n\nconst hAligns = [HAlign.Left, HAlign.Center, HAlign.Right];\nconst vAligns = [VAlign.Top, VAlign.Center, VAlign.Bottom];\nconst hLabels = ['Left', 'Center', 'Right'];\nconst vLabels = ['Top', 'Center', 'Bottom'];\n\nexport const LayoutDemo = () => {\n  const [hIdx, setHIdx] = useState(0);\n  const [vIdx, setVIdx] = useState(0);\n\n  useInput((input) => {\n    if (input === 'h') setHIdx((i) => (i + 1) % hAligns.length);\n    if (input === 'v') setVIdx((i) => (i + 1) % vAligns.length);\n  });\n\n  return (\n    <Box flexDirection=\"column\" flexGrow={1}>\n      <Text bold color={Colors.accent}>\n        Layout Demo\n      </Text>\n      <Text dimColor>\n        Press [h] to cycle hAlign ({hLabels[hIdx]}), [v] to cycle vAlign (\n        {vLabels[vIdx]})\n      </Text>\n      <Box height={1} />\n      <SplitView\n        left={\n          <CardLayout hAlign={hAligns[hIdx]} vAlign={vAligns[vIdx]}>\n            <Box borderStyle=\"single\" borderColor={Colors.primary} paddingX={1}>\n              <Text color={Colors.primary}>Left Pane</Text>\n            </Box>\n          </CardLayout>\n        }\n        right={\n          <CardLayout hAlign={HAlign.Center} vAlign={VAlign.Center}>\n            <Box borderStyle=\"single\" borderColor={Colors.accent} paddingX={1}>\n              <Text color={Colors.accent}>Right Pane</Text>\n            </Box>\n          </CardLayout>\n        }\n      />\n    </Box>\n  );\n};\n"]}

package/dist/src/ui/tui/playground/demos/LogDemo.d.ts

@@ -1,5 +0,0 @@
-/**
- * LogDemo — Demonstrates LogViewer.
- * Writes demo log lines to a temp file, then tails it.
- */
-export declare const LogDemo: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/tui/playground/demos/LogDemo.js

@@ -1,53 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * LogDemo — Demonstrates LogViewer.
- * Writes demo log lines to a temp file, then tails it.
- */
-import { Box, Text } from 'ink';
-import { useEffect, useState } from 'react';
-import * as fs from 'fs';
-import * as path from 'path';
-import * as os from 'os';
-import { LogViewer } from '../../primitives/index.js';
-import { Colors } from '../../styles.js';
-const DEMO_LOG_PATH = path.join(os.tmpdir(), 'posthog-playground.log');
-const LOG_MESSAGES = [
-    '[info] Playground started',
-    '[info] Initializing demo components...',
-    '[debug] Loading primitives barrel export',
-    '[info] ScreenContainer mounted',
-    '[info] TabContainer initialized with 6 tabs',
-    '[debug] LayoutDemo: hAlign=Left, vAlign=Top',
-    '[info] NavigationDemo: screenStack depth = 1',
-    '[warn] TabDemo: arrow key conflict with outer container',
-    '[info] InputDemo: waiting for user selection',
-    '[info] ProgressDemo: tick 0, cycling tasks',
-    '[debug] LogViewer: watching file for changes',
-    '[info] All demos loaded successfully',
-];
-export const LogDemo = () => {
-    const [ready, setReady] = useState(false);
-    useEffect(() => {
-        // Write initial log content
-        fs.writeFileSync(DEMO_LOG_PATH, LOG_MESSAGES.join('\n') + '\n');
-        setReady(true);
-        // Append lines periodically
-        let lineNum = LOG_MESSAGES.length;
-        const timer = setInterval(() => {
-            lineNum++;
-            const msg = `[info] Demo log line #${lineNum} — ${new Date().toISOString()}\n`;
-            fs.appendFileSync(DEMO_LOG_PATH, msg);
-        }, 2000);
-        return () => {
-            clearInterval(timer);
-            try {
-                fs.unlinkSync(DEMO_LOG_PATH);
-            }
-            catch {
-                // ignore
-            }
-        };
-    }, []);
-    return (_jsxs(Box, { flexDirection: "column", flexGrow: 1, children: [_jsx(Text, { bold: true, color: Colors.accent, children: "Log Demo" }), _jsxs(Text, { dimColor: true, children: ["Tailing ", DEMO_LOG_PATH, " (new line every 2s)"] }), _jsx(Box, { height: 1 }), ready && _jsx(LogViewer, { filePath: DEMO_LOG_PATH, height: 15 })] }));
-};
-//# sourceMappingURL=LogDemo.js.map

package/dist/src/ui/tui/playground/demos/LogDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LogDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/LogDemo.tsx"],"names":[],"mappings":";AAAA;;;GAGG;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,EAAE,MAAM,IAAI,CAAC;AACzB,OAAO,KAAK,IAAI,MAAM,MAAM,CAAC;AAC7B,OAAO,KAAK,EAAE,MAAM,IAAI,CAAC;AACzB,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,MAAM,aAAa,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,EAAE,wBAAwB,CAAC,CAAC;AAEvE,MAAM,YAAY,GAAG;IACnB,2BAA2B;IAC3B,wCAAwC;IACxC,0CAA0C;IAC1C,gCAAgC;IAChC,6CAA6C;IAC7C,6CAA6C;IAC7C,8CAA8C;IAC9C,yDAAyD;IACzD,8CAA8C;IAC9C,4CAA4C;IAC5C,8CAA8C;IAC9C,sCAAsC;CACvC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,EAAE;IAC1B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1C,SAAS,CAAC,GAAG,EAAE;QACb,4BAA4B;QAC5B,EAAE,CAAC,aAAa,CAAC,aAAa,EAAE,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC;QAChE,QAAQ,CAAC,IAAI,CAAC,CAAC;QAEf,4BAA4B;QAC5B,IAAI,OAAO,GAAG,YAAY,CAAC,MAAM,CAAC;QAClC,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;YAC7B,OAAO,EAAE,CAAC;YACV,MAAM,GAAG,GAAG,yBAAyB,OAAO,MAAM,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC;YAC/E,EAAE,CAAC,cAAc,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC;QACxC,CAAC,EAAE,IAAI,CAAC,CAAC;QAET,OAAO,GAAG,EAAE;YACV,aAAa,CAAC,KAAK,CAAC,CAAC;YACrB,IAAI,CAAC;gBACH,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;YAC/B,CAAC;YAAC,MAAM,CAAC;gBACP,SAAS;YACX,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,MAAC,GAAG,IAAC,aAAa,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,aACrC,KAAC,IAAI,IAAC,IAAI,QAAC,KAAK,EAAE,MAAM,CAAC,MAAM,yBAExB,EACP,MAAC,IAAI,IAAC,QAAQ,+BAAU,aAAa,4BAA4B,EACjE,KAAC,GAAG,IAAC,MAAM,EAAE,CAAC,GAAI,EACjB,KAAK,IAAI,KAAC,SAAS,IAAC,QAAQ,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,GAAI,IACxD,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * LogDemo — Demonstrates LogViewer.\n * Writes demo log lines to a temp file, then tails it.\n */\n\nimport { Box, Text } from 'ink';\nimport { useEffect, useState } from 'react';\nimport * as fs from 'fs';\nimport * as path from 'path';\nimport * as os from 'os';\nimport { LogViewer } from '../../primitives/index.js';\nimport { Colors } from '../../styles.js';\n\nconst DEMO_LOG_PATH = path.join(os.tmpdir(), 'posthog-playground.log');\n\nconst LOG_MESSAGES = [\n  '[info] Playground started',\n  '[info] Initializing demo components...',\n  '[debug] Loading primitives barrel export',\n  '[info] ScreenContainer mounted',\n  '[info] TabContainer initialized with 6 tabs',\n  '[debug] LayoutDemo: hAlign=Left, vAlign=Top',\n  '[info] NavigationDemo: screenStack depth = 1',\n  '[warn] TabDemo: arrow key conflict with outer container',\n  '[info] InputDemo: waiting for user selection',\n  '[info] ProgressDemo: tick 0, cycling tasks',\n  '[debug] LogViewer: watching file for changes',\n  '[info] All demos loaded successfully',\n];\n\nexport const LogDemo = () => {\n  const [ready, setReady] = useState(false);\n\n  useEffect(() => {\n    // Write initial log content\n    fs.writeFileSync(DEMO_LOG_PATH, LOG_MESSAGES.join('\\n') + '\\n');\n    setReady(true);\n\n    // Append lines periodically\n    let lineNum = LOG_MESSAGES.length;\n    const timer = setInterval(() => {\n      lineNum++;\n      const msg = `[info] Demo log line #${lineNum} — ${new Date().toISOString()}\\n`;\n      fs.appendFileSync(DEMO_LOG_PATH, msg);\n    }, 2000);\n\n    return () => {\n      clearInterval(timer);\n      try {\n        fs.unlinkSync(DEMO_LOG_PATH);\n      } catch {\n        // ignore\n      }\n    };\n  }, []);\n\n  return (\n    <Box flexDirection=\"column\" flexGrow={1}>\n      <Text bold color={Colors.accent}>\n        Log Demo\n      </Text>\n      <Text dimColor>Tailing {DEMO_LOG_PATH} (new line every 2s)</Text>\n      <Box height={1} />\n      {ready && <LogViewer filePath={DEMO_LOG_PATH} height={15} />}\n    </Box>\n  );\n};\n"]}

package/dist/src/ui/tui/playground/demos/McpDemo.d.ts

@@ -1,12 +0,0 @@
-/**
- * McpDemo — Playground demo for the MCP client selection screen.
- *
- * Uses a mock McpInstaller that simulates detecting three editors,
- * a short install delay, and a successful result.
- */
-import { WizardStore } from '../../store.js';
-interface McpDemoProps {
-    store: WizardStore;
-}
-export declare const McpDemo: ({ store }: McpDemoProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/ui/tui/playground/demos/McpDemo.js

@@ -1,27 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { McpScreen } from '../../screens/McpScreen.js';
-const MOCK_CLIENTS = [
-    { name: 'VS Code' },
-    { name: 'Cursor' },
-    { name: 'Windsurf' },
-];
-function createMockInstaller() {
-    return {
-        async detectClients() {
-            await new Promise((r) => setTimeout(r, 800));
-            return MOCK_CLIENTS;
-        },
-        async install(clientNames) {
-            await new Promise((r) => setTimeout(r, 1500));
-            return clientNames;
-        },
-        async remove() {
-            await new Promise((r) => setTimeout(r, 1000));
-            return MOCK_CLIENTS.map((c) => c.name);
-        },
-    };
-}
-export const McpDemo = ({ store }) => {
-    return (_jsx(McpScreen, { store: store, installer: createMockInstaller(), mode: "install" }));
-};
-//# sourceMappingURL=McpDemo.js.map

package/dist/src/ui/tui/playground/demos/McpDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"McpDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/McpDemo.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAGvD,MAAM,YAAY,GAAG;IACnB,EAAE,IAAI,EAAE,SAAS,EAAE;IACnB,EAAE,IAAI,EAAE,QAAQ,EAAE;IAClB,EAAE,IAAI,EAAE,UAAU,EAAE;CACrB,CAAC;AAEF,SAAS,mBAAmB;IAC1B,OAAO;QACL,KAAK,CAAC,aAAa;YACjB,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;YAC7C,OAAO,YAAY,CAAC;QACtB,CAAC;QACD,KAAK,CAAC,OAAO,CAAC,WAAW;YACvB,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC;YAC9C,OAAO,WAAW,CAAC;QACrB,CAAC;QACD,KAAK,CAAC,MAAM;YACV,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC;YAC9C,OAAO,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;QACzC,CAAC;KACF,CAAC;AACJ,CAAC;AAMD,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,KAAK,EAAgB,EAAE,EAAE;IACjD,OAAO,CACL,KAAC,SAAS,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,mBAAmB,EAAE,EAAE,IAAI,EAAC,SAAS,GAAG,CAC7E,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * McpDemo — Playground demo for the MCP client selection screen.\n *\n * Uses a mock McpInstaller that simulates detecting three editors,\n * a short install delay, and a successful result.\n */\n\nimport { WizardStore } from '../../store.js';\nimport { McpScreen } from '../../screens/McpScreen.js';\nimport type { McpInstaller } from '../../services/mcp-installer.js';\n\nconst MOCK_CLIENTS = [\n  { name: 'VS Code' },\n  { name: 'Cursor' },\n  { name: 'Windsurf' },\n];\n\nfunction createMockInstaller(): McpInstaller {\n  return {\n    async detectClients() {\n      await new Promise((r) => setTimeout(r, 800));\n      return MOCK_CLIENTS;\n    },\n    async install(clientNames) {\n      await new Promise((r) => setTimeout(r, 1500));\n      return clientNames;\n    },\n    async remove() {\n      await new Promise((r) => setTimeout(r, 1000));\n      return MOCK_CLIENTS.map((c) => c.name);\n    },\n  };\n}\n\ninterface McpDemoProps {\n  store: WizardStore;\n}\n\nexport const McpDemo = ({ store }: McpDemoProps) => {\n  return (\n    <McpScreen store={store} installer={createMockInstaller()} mode=\"install\" />\n  );\n};\n"]}

package/dist/src/ui/tui/playground/demos/ModalDemo.d.ts

@@ -1,6 +0,0 @@
-/**
- * ModalDemo — Playground demo for the ModalOverlay primitive.
- *
- * Shows several modal variants: info, warning, error, and one with feedback text.
- */
-export declare const ModalDemo: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/tui/playground/demos/ModalDemo.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * ModalDemo — Playground demo for the ModalOverlay primitive.
- *
- * Shows several modal variants: info, warning, error, and one with feedback text.
- */
-import { Box, Text } from 'ink';
-import { ModalOverlay } from '../../primitives/index.js';
-import { Icons } from '../../styles.js';
-export const ModalDemo = () => {
-    return (_jsxs(Box, { flexDirection: "column", gap: 1, flexGrow: 1, children: [_jsx(ModalOverlay, { borderColor: "cyan", title: "Info Modal", width: 60, children: _jsx(Text, { children: "A simple informational modal with default styling." }) }), _jsx(ModalOverlay, { borderColor: "#DC9300", title: `${Icons.warning} Warning Modal`, width: 60, feedback: "Something needs your attention.", children: _jsx(Text, { children: "This modal includes a feedback message shown in yellow." }) }), _jsx(ModalOverlay, { borderColor: "red", title: `${Icons.warning} Error Modal`, width: 60, footer: _jsx(Box, { marginLeft: 2, children: _jsx(Text, { dimColor: true, children: "Continue [Enter] / Exit [Esc] (disabled in playground)" }) }), children: _jsx(Text, { children: "This modal has a footer section below a divider." }) })] }));
-};
-//# sourceMappingURL=ModalDemo.js.map

package/dist/src/ui/tui/playground/demos/ModalDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ModalDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/ModalDemo.tsx"],"names":[],"mappings":";AAAA;;;;GAIG;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAExC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,EAAE;IAC5B,OAAO,CACL,MAAC,GAAG,IAAC,aAAa,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,aAC7C,KAAC,YAAY,IAAC,WAAW,EAAC,MAAM,EAAC,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,EAAE,YAC3D,KAAC,IAAI,qEAA0D,GAClD,EAEf,KAAC,YAAY,IACX,WAAW,EAAC,SAAS,EACrB,KAAK,EAAE,GAAG,KAAK,CAAC,OAAO,gBAAgB,EACvC,KAAK,EAAE,EAAE,EACT,QAAQ,EAAC,iCAAiC,YAE1C,KAAC,IAAI,0EAA+D,GACvD,EAEf,KAAC,YAAY,IACX,WAAW,EAAC,KAAK,EACjB,KAAK,EAAE,GAAG,KAAK,CAAC,OAAO,cAAc,EACrC,KAAK,EAAE,EAAE,EACT,MAAM,EACJ,KAAC,GAAG,IAAC,UAAU,EAAE,CAAC,YAChB,KAAC,IAAI,IAAC,QAAQ,6EAEP,GACH,YAGR,KAAC,IAAI,mEAAwD,GAChD,IACX,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * ModalDemo — Playground demo for the ModalOverlay primitive.\n *\n * Shows several modal variants: info, warning, error, and one with feedback text.\n */\n\nimport { Box, Text } from 'ink';\nimport { ModalOverlay } from '../../primitives/index.js';\nimport { Icons } from '../../styles.js';\n\nexport const ModalDemo = () => {\n  return (\n    <Box flexDirection=\"column\" gap={1} flexGrow={1}>\n      <ModalOverlay borderColor=\"cyan\" title=\"Info Modal\" width={60}>\n        <Text>A simple informational modal with default styling.</Text>\n      </ModalOverlay>\n\n      <ModalOverlay\n        borderColor=\"#DC9300\"\n        title={`${Icons.warning} Warning Modal`}\n        width={60}\n        feedback=\"Something needs your attention.\"\n      >\n        <Text>This modal includes a feedback message shown in yellow.</Text>\n      </ModalOverlay>\n\n      <ModalOverlay\n        borderColor=\"red\"\n        title={`${Icons.warning} Error Modal`}\n        width={60}\n        footer={\n          <Box marginLeft={2}>\n            <Text dimColor>\n              Continue [Enter] / Exit [Esc] (disabled in playground)\n            </Text>\n          </Box>\n        }\n      >\n        <Text>This modal has a footer section below a divider.</Text>\n      </ModalOverlay>\n    </Box>\n  );\n};\n"]}

package/dist/src/ui/tui/playground/demos/ProgressDemo.d.ts

@@ -1,5 +0,0 @@
-/**
- * ProgressDemo — Demonstrates ProgressList + LoadingBox.
- * Auto-animates task progression through states.
- */
-export declare const ProgressDemo: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/ui/tui/playground/demos/ProgressDemo.js

@@ -1,58 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * ProgressDemo — Demonstrates ProgressList + LoadingBox.
- * Auto-animates task progression through states.
- */
-import { Box, Text } from 'ink';
-import { useState, useEffect } from 'react';
-import { ProgressList, LoadingBox } from '../../primitives/index.js';
-import { Colors } from '../../styles.js';
-const INITIAL_ITEMS = [
-    {
-        label: 'Detect framework',
-        activeForm: 'Detecting framework',
-        status: 'pending',
-    },
-    {
-        label: 'Install dependencies',
-        activeForm: 'Installing dependencies',
-        status: 'pending',
-    },
-    {
-        label: 'Configure PostHog',
-        activeForm: 'Configuring PostHog',
-        status: 'pending',
-    },
-    {
-        label: 'Add analytics provider',
-        activeForm: 'Adding analytics provider',
-        status: 'pending',
-    },
-    { label: 'Verify setup', activeForm: 'Verifying setup', status: 'pending' },
-];
-export const ProgressDemo = () => {
-    const [items, setItems] = useState(INITIAL_ITEMS);
-    const [tick, setTick] = useState(0);
-    useEffect(() => {
-        const timer = setInterval(() => {
-            setTick((t) => t + 1);
-        }, 1500);
-        return () => clearInterval(timer);
-    }, []);
-    useEffect(() => {
-        // Cycle: each tick advances the "active" task
-        const total = INITIAL_ITEMS.length;
-        // After all tasks complete, restart
-        const cycle = tick % (total + 2); // +2 for a pause at the end
-        setItems(INITIAL_ITEMS.map((item, i) => {
-            if (i < cycle)
-                return { ...item, status: 'completed' };
-            if (i === cycle)
-                return { ...item, status: 'in_progress' };
-            return { ...item, status: 'pending' };
-        }));
-    }, [tick]);
-    const allDone = items.every((i) => i.status === 'completed');
-    return (_jsxs(Box, { flexDirection: "column", flexGrow: 1, children: [_jsx(Text, { bold: true, color: Colors.accent, children: "Progress Demo" }), _jsx(Text, { dimColor: true, children: "Tasks auto-advance every 1.5s (cycles continuously)" }), _jsx(Box, { height: 1 }), _jsx(ProgressList, { items: items, title: "Setup in progress:" }), _jsx(Box, { height: 1 }), !allDone && _jsx(LoadingBox, { message: "Working..." }), allDone && (_jsxs(Text, { color: Colors.success, bold: true, children: ['\u2714', " All tasks complete! Restarting..."] }))] }));
-};
-//# sourceMappingURL=ProgressDemo.js.map

package/dist/src/ui/tui/playground/demos/ProgressDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ProgressDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/ProgressDemo.tsx"],"names":[],"mappings":";AAAA;;;GAGG;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAErE,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,MAAM,aAAa,GAAmB;IACpC;QACE,KAAK,EAAE,kBAAkB;QACzB,UAAU,EAAE,qBAAqB;QACjC,MAAM,EAAE,SAAS;KAClB;IACD;QACE,KAAK,EAAE,sBAAsB;QAC7B,UAAU,EAAE,yBAAyB;QACrC,MAAM,EAAE,SAAS;KAClB;IACD;QACE,KAAK,EAAE,mBAAmB;QAC1B,UAAU,EAAE,qBAAqB;QACjC,MAAM,EAAE,SAAS;KAClB;IACD;QACE,KAAK,EAAE,wBAAwB;QAC/B,UAAU,EAAE,2BAA2B;QACvC,MAAM,EAAE,SAAS;KAClB;IACD,EAAE,KAAK,EAAE,cAAc,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,EAAE,SAAS,EAAE;CAC5E,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAiB,aAAa,CAAC,CAAC;IAClE,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAEpC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE;YAC7B,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QACxB,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACpC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,8CAA8C;QAC9C,MAAM,KAAK,GAAG,aAAa,CAAC,MAAM,CAAC;QACnC,oCAAoC;QACpC,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,4BAA4B;QAE9D,QAAQ,CACN,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;YAC5B,IAAI,CAAC,GAAG,KAAK;gBAAE,OAAO,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,WAAoB,EAAE,CAAC;YAChE,IAAI,CAAC,KAAK,KAAK;gBAAE,OAAO,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,aAAsB,EAAE,CAAC;YACpE,OAAO,EAAE,GAAG,IAAI,EAAE,MAAM,EAAE,SAAkB,EAAE,CAAC;QACjD,CAAC,CAAC,CACH,CAAC;IACJ,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,KAAK,WAAW,CAAC,CAAC;IAE7D,OAAO,CACL,MAAC,GAAG,IAAC,aAAa,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,aACrC,KAAC,IAAI,IAAC,IAAI,QAAC,KAAK,EAAE,MAAM,CAAC,MAAM,8BAExB,EACP,KAAC,IAAI,IAAC,QAAQ,0EAA2D,EACzE,KAAC,GAAG,IAAC,MAAM,EAAE,CAAC,GAAI,EAClB,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAC,oBAAoB,GAAG,EACzD,KAAC,GAAG,IAAC,MAAM,EAAE,CAAC,GAAI,EACjB,CAAC,OAAO,IAAI,KAAC,UAAU,IAAC,OAAO,EAAC,YAAY,GAAG,EAC/C,OAAO,IAAI,CACV,MAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,EAAE,IAAI,mBAC9B,QAAQ,0CACJ,CACR,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * ProgressDemo — Demonstrates ProgressList + LoadingBox.\n * Auto-animates task progression through states.\n */\n\nimport { Box, Text } from 'ink';\nimport { useState, useEffect } from 'react';\nimport { ProgressList, LoadingBox } from '../../primitives/index.js';\nimport type { ProgressItem } from '../../primitives/index.js';\nimport { Colors } from '../../styles.js';\n\nconst INITIAL_ITEMS: ProgressItem[] = [\n  {\n    label: 'Detect framework',\n    activeForm: 'Detecting framework',\n    status: 'pending',\n  },\n  {\n    label: 'Install dependencies',\n    activeForm: 'Installing dependencies',\n    status: 'pending',\n  },\n  {\n    label: 'Configure PostHog',\n    activeForm: 'Configuring PostHog',\n    status: 'pending',\n  },\n  {\n    label: 'Add analytics provider',\n    activeForm: 'Adding analytics provider',\n    status: 'pending',\n  },\n  { label: 'Verify setup', activeForm: 'Verifying setup', status: 'pending' },\n];\n\nexport const ProgressDemo = () => {\n  const [items, setItems] = useState<ProgressItem[]>(INITIAL_ITEMS);\n  const [tick, setTick] = useState(0);\n\n  useEffect(() => {\n    const timer = setInterval(() => {\n      setTick((t) => t + 1);\n    }, 1500);\n    return () => clearInterval(timer);\n  }, []);\n\n  useEffect(() => {\n    // Cycle: each tick advances the \"active\" task\n    const total = INITIAL_ITEMS.length;\n    // After all tasks complete, restart\n    const cycle = tick % (total + 2); // +2 for a pause at the end\n\n    setItems(\n      INITIAL_ITEMS.map((item, i) => {\n        if (i < cycle) return { ...item, status: 'completed' as const };\n        if (i === cycle) return { ...item, status: 'in_progress' as const };\n        return { ...item, status: 'pending' as const };\n      }),\n    );\n  }, [tick]);\n\n  const allDone = items.every((i) => i.status === 'completed');\n\n  return (\n    <Box flexDirection=\"column\" flexGrow={1}>\n      <Text bold color={Colors.accent}>\n        Progress Demo\n      </Text>\n      <Text dimColor>Tasks auto-advance every 1.5s (cycles continuously)</Text>\n      <Box height={1} />\n      <ProgressList items={items} title=\"Setup in progress:\" />\n      <Box height={1} />\n      {!allDone && <LoadingBox message=\"Working...\" />}\n      {allDone && (\n        <Text color={Colors.success} bold>\n          {'\\u2714'} All tasks complete! Restarting...\n        </Text>\n      )}\n    </Box>\n  );\n};\n"]}

package/dist/src/ui/tui/playground/demos/RunScreenDemo.d.ts

@@ -1,11 +0,0 @@
-/**
- * RunScreenDemo — Renders the real RunScreen with a mock store.
- * Tasks auto-advance every 1.5s. Discovered features (Stripe, LLM)
- * are pre-populated so conditional tips appear.
- */
-import { WizardStore } from '../../store.js';
-interface RunScreenDemoProps {
-    store: WizardStore;
-}
-export declare const RunScreenDemo: ({ store }: RunScreenDemoProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/src/ui/tui/playground/demos/RunScreenDemo.js

@@ -1,159 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * RunScreenDemo — Renders the real RunScreen with a mock store.
- * Tasks auto-advance every 1.5s. Discovered features (Stripe, LLM)
- * are pre-populated so conditional tips appear.
- */
-import { useEffect, useRef, useSyncExternalStore } from 'react';
-import { TaskStatus } from '../../store.js';
-import { DiscoveredFeature } from '../../../../lib/wizard-session.js';
-import { TabContainer, SplitView, ProgressList, LogViewer, EventPlanViewer, HNViewer, } from '../../primitives/index.js';
-import { LearnCard } from '../../components/LearnCard.js';
-import { TipsCard } from '../../components/TipsCard.js';
-const MOCK_TASKS = [
-    {
-        label: 'Checking project structure and finding files for event tracking',
-        activeForm: 'Checking project structure',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Verify PostHog dependencies',
-        activeForm: 'Verifying PostHog dependencies',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Generate events plan (.posthog-events.json)',
-        activeForm: 'Generating events plan',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Install posthog-js and posthog-node packages',
-        activeForm: 'Installing packages',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Set up environment variables',
-        activeForm: 'Setting up environment variables',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Create instrumentation-client.ts',
-        activeForm: 'Creating instrumentation-client.ts',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Update next.config with rewrites',
-        activeForm: 'Updating next.config',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Create posthog-server.ts',
-        activeForm: 'Creating posthog-server.ts',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-    {
-        label: 'Add PostHog capture events to project files',
-        activeForm: 'Adding capture events',
-        status: TaskStatus.Pending,
-        done: false,
-    },
-];
-const MOCK_EVENTS = [
-    { name: 'page_viewed', description: 'Fires when a user views any page' },
-    {
-        name: 'button_clicked',
-        description: 'Fires when the CTA button is clicked',
-    },
-    {
-        name: 'form_submitted',
-        description: 'Fires when the contact form is submitted',
-    },
-    {
-        name: 'signup_started',
-        description: 'Fires when a user begins the signup flow',
-    },
-];
-export const RunScreenDemo = ({ store }) => {
-    const tickRef = useRef(0);
-    const lastStatusRef = useRef('');
-    // Seed the store with mock data on mount
-    useEffect(() => {
-        store.addDiscoveredFeature(DiscoveredFeature.Stripe);
-        store.addDiscoveredFeature(DiscoveredFeature.LLM);
-        store.setEventPlan(MOCK_EVENTS);
-        store.pushStatus('Checking project structure.');
-        lastStatusRef.current = 'Checking project structure.';
-        // Set initial tasks
-        const initial = MOCK_TASKS.map((t, i) => i === 0 ? { ...t, status: TaskStatus.InProgress } : t);
-        store.setTasks(initial);
-    }, []);
-    // Auto-advance tasks every 1.5s
-    useEffect(() => {
-        const timer = setInterval(() => {
-            tickRef.current += 1;
-            const tick = tickRef.current;
-            const total = MOCK_TASKS.length;
-            const cycle = tick % (total + 3); // +3 for pause at end before restart
-            const tasks = MOCK_TASKS.map((t, i) => {
-                if (i < cycle)
-                    return { ...t, status: TaskStatus.Completed, done: true };
-                if (i === cycle)
-                    return { ...t, status: TaskStatus.InProgress, done: false };
-                return { ...t, status: TaskStatus.Pending, done: false };
-            });
-            store.setTasks(tasks);
-            // Only push status when the message actually changes
-            if (cycle < total) {
-                const msg = MOCK_TASKS[cycle].activeForm + '...';
-                if (msg !== lastStatusRef.current) {
-                    store.pushStatus(msg);
-                    lastStatusRef.current = msg;
-                }
-            }
-        }, 1500);
-        return () => clearInterval(timer);
-    }, []);
-    useSyncExternalStore((cb) => store.subscribe(cb), () => store.getSnapshot());
-    const progressItems = store.tasks.map((t) => ({
-        label: t.label,
-        activeForm: t.activeForm,
-        status: t.status,
-    }));
-    const statuses = store.statusMessages.length > 0 ? store.statusMessages : undefined;
-    const tabs = [
-        {
-            id: 'status',
-            label: 'Status',
-            component: (_jsx(SplitView, { left: store.learnCardComplete ? (_jsx(TipsCard, { store: store })) : (_jsx(LearnCard, { store: store, onComplete: () => store.setLearnCardComplete() })), right: _jsx(ProgressList, { items: progressItems, title: "Tasks" }) })),
-        },
-        ...(store.eventPlan.length > 0
-            ? [
-                {
-                    id: 'events',
-                    label: 'Event plan',
-                    component: _jsx(EventPlanViewer, { events: store.eventPlan }),
-                },
-            ]
-            : []),
-        {
-            id: 'logs',
-            label: 'Tail logs',
-            component: _jsx(LogViewer, { filePath: "/tmp/posthog-wizard.log" }),
-        },
-        {
-            id: 'hn',
-            label: 'HN',
-            component: _jsx(HNViewer, {}),
-        },
-    ];
-    return (_jsx(TabContainer, { tabs: tabs, statusMessage: statuses, expandableStatus: true, store: store }));
-};
-//# sourceMappingURL=RunScreenDemo.js.map

package/dist/src/ui/tui/playground/demos/RunScreenDemo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RunScreenDemo.js","sourceRoot":"","sources":["../../../../../../src/ui/tui/playground/demos/RunScreenDemo.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * RunScreenDemo — Renders the real RunScreen with a mock store.\n * Tasks auto-advance every 1.5s. Discovered features (Stripe, LLM)\n * are pre-populated so conditional tips appear.\n */\n\nimport { useEffect, useRef, useSyncExternalStore } from 'react';\nimport { WizardStore, TaskStatus } from '../../store.js';\nimport { DiscoveredFeature } from '../../../../lib/wizard-session.js';\nimport {\n  TabContainer,\n  SplitView,\n  ProgressList,\n  LogViewer,\n  EventPlanViewer,\n  HNViewer,\n} from '../../primitives/index.js';\nimport type { ProgressItem } from '../../primitives/index.js';\nimport { LearnCard } from '../../components/LearnCard.js';\nimport { TipsCard } from '../../components/TipsCard.js';\n\nconst MOCK_TASKS = [\n  {\n    label: 'Checking project structure and finding files for event tracking',\n    activeForm: 'Checking project structure',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Verify PostHog dependencies',\n    activeForm: 'Verifying PostHog dependencies',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Generate events plan (.posthog-events.json)',\n    activeForm: 'Generating events plan',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Install posthog-js and posthog-node packages',\n    activeForm: 'Installing packages',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Set up environment variables',\n    activeForm: 'Setting up environment variables',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Create instrumentation-client.ts',\n    activeForm: 'Creating instrumentation-client.ts',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Update next.config with rewrites',\n    activeForm: 'Updating next.config',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Create posthog-server.ts',\n    activeForm: 'Creating posthog-server.ts',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n  {\n    label: 'Add PostHog capture events to project files',\n    activeForm: 'Adding capture events',\n    status: TaskStatus.Pending,\n    done: false,\n  },\n];\n\nconst MOCK_EVENTS = [\n  { name: 'page_viewed', description: 'Fires when a user views any page' },\n  {\n    name: 'button_clicked',\n    description: 'Fires when the CTA button is clicked',\n  },\n  {\n    name: 'form_submitted',\n    description: 'Fires when the contact form is submitted',\n  },\n  {\n    name: 'signup_started',\n    description: 'Fires when a user begins the signup flow',\n  },\n];\n\ninterface RunScreenDemoProps {\n  store: WizardStore;\n}\n\nexport const RunScreenDemo = ({ store }: RunScreenDemoProps) => {\n  const tickRef = useRef(0);\n  const lastStatusRef = useRef('');\n\n  // Seed the store with mock data on mount\n  useEffect(() => {\n    store.addDiscoveredFeature(DiscoveredFeature.Stripe);\n    store.addDiscoveredFeature(DiscoveredFeature.LLM);\n    store.setEventPlan(MOCK_EVENTS);\n    store.pushStatus('Checking project structure.');\n    lastStatusRef.current = 'Checking project structure.';\n\n    // Set initial tasks\n    const initial = MOCK_TASKS.map((t, i) =>\n      i === 0 ? { ...t, status: TaskStatus.InProgress } : t,\n    );\n    store.setTasks(initial);\n  }, []);\n\n  // Auto-advance tasks every 1.5s\n  useEffect(() => {\n    const timer = setInterval(() => {\n      tickRef.current += 1;\n      const tick = tickRef.current;\n      const total = MOCK_TASKS.length;\n      const cycle = tick % (total + 3); // +3 for pause at end before restart\n\n      const tasks = MOCK_TASKS.map((t, i) => {\n        if (i < cycle)\n          return { ...t, status: TaskStatus.Completed, done: true };\n        if (i === cycle)\n          return { ...t, status: TaskStatus.InProgress, done: false };\n        return { ...t, status: TaskStatus.Pending, done: false };\n      });\n\n      store.setTasks(tasks);\n\n      // Only push status when the message actually changes\n      if (cycle < total) {\n        const msg = MOCK_TASKS[cycle].activeForm + '...';\n        if (msg !== lastStatusRef.current) {\n          store.pushStatus(msg);\n          lastStatusRef.current = msg;\n        }\n      }\n    }, 1500);\n\n    return () => clearInterval(timer);\n  }, []);\n\n  useSyncExternalStore(\n    (cb) => store.subscribe(cb),\n    () => store.getSnapshot(),\n  );\n\n  const progressItems: ProgressItem[] = store.tasks.map((t) => ({\n    label: t.label,\n    activeForm: t.activeForm,\n    status: t.status,\n  }));\n\n  const statuses =\n    store.statusMessages.length > 0 ? store.statusMessages : undefined;\n\n  const tabs = [\n    {\n      id: 'status',\n      label: 'Status',\n      component: (\n        <SplitView\n          left={\n            store.learnCardComplete ? (\n              <TipsCard store={store} />\n            ) : (\n              <LearnCard\n                store={store}\n                onComplete={() => store.setLearnCardComplete()}\n              />\n            )\n          }\n          right={<ProgressList items={progressItems} title=\"Tasks\" />}\n        />\n      ),\n    },\n    ...(store.eventPlan.length > 0\n      ? [\n          {\n            id: 'events',\n            label: 'Event plan',\n            component: <EventPlanViewer events={store.eventPlan} />,\n          },\n        ]\n      : []),\n    {\n      id: 'logs',\n      label: 'Tail logs',\n      component: <LogViewer filePath=\"/tmp/posthog-wizard.log\" />,\n    },\n    {\n      id: 'hn',\n      label: 'HN',\n      component: <HNViewer />,\n    },\n  ];\n\n  return (\n    <TabContainer\n      tabs={tabs}\n      statusMessage={statuses}\n      expandableStatus\n      store={store}\n    />\n  );\n};\n"]}