@contentful/experience-design-system-cli 2.37.1-dev-build-b65632a0.0 → 2.37.1-dev-build-979aba4b.0

package/dist/index.js

@@ -77,11 +77,14 @@ var init_home_theme = __esm({
       orange: "#E44F20",
       yellow: "#FFDA00",
       white: "#FFFFFF",
-      slate: "#8B8D91",
-      steel: "#C4D1DE"
+      slate: "#A6B5C7",
+      steel: "#C4D1DE",
+      mist: "#DDE5EC",
+      fog: "#EFF2F6"
     };
     PALETTE = {
       accent: BRAND.blue,
+      heading: BRAND.white,
       success: BRAND.green,
       error: BRAND.orange,
       warning: BRAND.yellow,
@@ -168,11 +171,12 @@ var init_use_terminal_width = __esm({
 import { Text } from "ink";
 import { jsx } from "react/jsx-runtime";
 function ControlHints({ hints }) {
-  return /* @__PURE__ */ jsx(Text, { children: hints.map((hint) => `[${hint.keys}] ${hint.label}`).join(" \xB7 ") });
+  return /* @__PURE__ */ jsx(Text, { color: PALETTE.muted, children: hints.map((hint) => `${hint.keys} ${hint.label}`).join(" \xB7 ") });
 }
 var init_control_hints = __esm({
   "packages/experience-design-system-cli/src/tui/control-hints.tsx"() {
     "use strict";
+    init_home_theme();
   }
 });
 
@@ -228,7 +232,7 @@ function HomeScreen({ onNavigate }) {
   }
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
     /* @__PURE__ */ jsxs(Box, { flexDirection: "column", alignItems: "center", children: [
-      /* @__PURE__ */ jsx2(Text2, { bold: true, children: HEADING }),
+      /* @__PURE__ */ jsx2(Text2, { bold: true, color: PALETTE.heading, children: HEADING }),
       /* @__PURE__ */ jsx2(Text2, { children: brandBar(HEADING.length).map((segment, i) => /* @__PURE__ */ jsx2(Text2, { color: segment.color, children: segment.text }, i)) }),
       /* @__PURE__ */ jsx2(Text2, { color: PALETTE.muted, children: SUBTITLE }),
       /* @__PURE__ */ jsxs(Text2, { color: PALETTE.muted, children: [
@@ -245,7 +249,8 @@ function HomeScreen({ onNavigate }) {
         Text2,
         {
           bold: focused && !dimmed,
-          color: dimmed ? PALETTE.muted : focused ? PALETTE.accent : display.color,
+          dimColor: dimmed,
+          color: focused && !dimmed ? PALETTE.accent : display.color,
           children: [
             focused ? `${FOCUS_MARKER} ` : "  ",
             display.label
@@ -298,13 +303,14 @@ function ImportScreen({ exitCode, onDone }) {
   });
   const isSuccess = exitCode === 0;
   return /* @__PURE__ */ jsxs2(Box2, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsx3(Text3, { bold: true, children: "Import" }),
     /* @__PURE__ */ jsx3(Text3, { children: " " }),
     isSuccess ? /* @__PURE__ */ jsx3(Text3, { color: PALETTE.success, children: "\u2713 Import complete" }) : /* @__PURE__ */ jsxs2(Text3, { color: PALETTE.error, children: [
       "\u2717 Import failed: process exited with code ",
       exitCode ?? "unknown"
     ] }),
     /* @__PURE__ */ jsx3(Text3, { children: " " }),
-    /* @__PURE__ */ jsx3(Text3, { children: "[Enter] Back to Start" })
+    /* @__PURE__ */ jsx3(Text3, { dimColor: true, children: "[Enter] Back to Start" })
   ] });
 }
 var init_PageContainer = __esm({
@@ -361,16 +367,16 @@ function WelcomeScreen({ onContinue, onQuit, initialPath = "" }) {
   };
   return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", gap: 1, paddingX: 2, paddingY: 1, children: [
     /* @__PURE__ */ jsx4(Text4, { bold: true, color: PALETTE.success, children: "\u{1F44B} Hey! Let's import your design system into Contentful." }),
-    /* @__PURE__ */ jsx4(Text4, { color: PALETTE.muted, children: "I'll walk you through 5 steps to get your components into Contentful ExO." }),
-    /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "I'll walk you through 5 steps to get your components into Contentful ExO." }),
+    /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", marginTop: 1, children: [
       /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: RULE }),
       OVERVIEW.map((item) => /* @__PURE__ */ jsxs3(Box3, { gap: 1, children: [
         /* @__PURE__ */ jsx4(Text4, { bold: true, children: item.label }),
-        /* @__PURE__ */ jsx4(Text4, { color: PALETTE.muted, children: item.description })
+        /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: item.description })
       ] }, item.label)),
       /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: RULE })
     ] }),
-    /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", gap: 1, children: [
+    /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", marginTop: 1, children: [
       /* @__PURE__ */ jsx4(Text4, { children: "Where is your component library?" }),
       /* @__PURE__ */ jsxs3(Box3, { gap: 1, children: [
         /* @__PURE__ */ jsx4(Text4, { color: PALETTE.accent, children: "?" }),
@@ -378,7 +384,7 @@ function WelcomeScreen({ onContinue, onQuit, initialPath = "" }) {
         /* @__PURE__ */ jsx4(TextInput, { value: projectPath, onChange: setProjectPath, onSubmit: submit })
       ] })
     ] }),
-    /* @__PURE__ */ jsx4(Box3, { gap: 3, children: WELCOME_CONTROLS.map((control) => /* @__PURE__ */ jsxs3(Text4, { children: [
+    /* @__PURE__ */ jsx4(Box3, { marginTop: 1, gap: 3, children: WELCOME_CONTROLS.map((control) => /* @__PURE__ */ jsxs3(Text4, { dimColor: true, children: [
       "[",
       control.keys,
       "] ",
@@ -510,7 +516,7 @@ function TokenInputScreen({ onConfirm, onBack, initialPath = "" }) {
   };
   return /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", gap: 1, paddingX: 2, paddingY: 1, children: [
     /* @__PURE__ */ jsx5(Text5, { bold: true, children: "Design tokens" }),
-    /* @__PURE__ */ jsx5(Text5, { color: PALETTE.muted, children: "Point me to your raw token file (e.g. ~/design-tokens/tokens.json). You can use ~, relative, or absolute paths. Claude will map it to Design Token Group Format (DTCG)." }),
+    /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "Point me to your raw token file (e.g. ~/design-tokens/tokens.json). You can use ~, relative, or absolute paths. Claude will map it to Design Token Group Format (DTCG)." }),
     /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", children: [
       /* @__PURE__ */ jsxs4(Box4, { gap: 1, children: [
         /* @__PURE__ */ jsx5(Text5, { color: PALETTE.accent, children: "?" }),
@@ -522,13 +528,13 @@ function TokenInputScreen({ onConfirm, onBack, initialPath = "" }) {
           "\u2717 ",
           failure.error
         ] }),
-        failure.resolvedPath && /* @__PURE__ */ jsxs4(Text5, { color: PALETTE.muted, children: [
+        failure.resolvedPath && /* @__PURE__ */ jsxs4(Text5, { dimColor: true, children: [
           " Resolved to: ",
           failure.resolvedPath
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsx5(Box4, { marginTop: 1, gap: 3, children: TOKEN_INPUT_CONTROLS.map((control) => /* @__PURE__ */ jsxs4(Text5, { children: [
+    /* @__PURE__ */ jsx5(Box4, { marginTop: 1, gap: 3, children: TOKEN_INPUT_CONTROLS.map((control) => /* @__PURE__ */ jsxs4(Text5, { dimColor: true, children: [
       "[",
       control.keys,
       "] ",
@@ -841,6 +847,245 @@ var init_screen3 = __esm({
   }
 });
 
+// packages/experience-design-system-cli/src/tui/import/steps/04-credentials/logic.ts
+function keyAction2(input, key) {
+  if (key.escape) return "back";
+  if (key.tab) return "next-field";
+  if (key.ctrl && input === "s") return "skip";
+  return null;
+}
+function nextField(field) {
+  return FIELDS[(FIELDS.indexOf(field) + 1) % FIELDS.length];
+}
+function toConfiguredHost(host) {
+  const value = (host ?? "").trim().replace(/\/+$/, "");
+  return value === "" ? DEFAULT_HOST : value.replace(/^https:\/\//i, "");
+}
+function toApiHost(host) {
+  const value = host.trim().replace(/\/+$/, "");
+  if (value === "") return `https://${DEFAULT_HOST}`;
+  return /^[a-z][a-z\d+\-.]*:\/\//i.test(value) ? value : `https://${value}`;
+}
+function normalize(values) {
+  return {
+    spaceId: values.spaceId.trim(),
+    environmentId: values.environmentId.trim(),
+    cmaToken: values.cmaToken.trim(),
+    host: toConfiguredHost(values.host)
+  };
+}
+function missingField(values) {
+  return values.spaceId === "" || values.environmentId === "" || values.cmaToken === "";
+}
+function isUnchanged(current, initial) {
+  return FIELDS.every((field) => current[field] === initial[field]);
+}
+var FIELDS, DEFAULT_HOST;
+var init_logic4 = __esm({
+  "packages/experience-design-system-cli/src/tui/import/steps/04-credentials/logic.ts"() {
+    "use strict";
+    FIELDS = ["spaceId", "environmentId", "cmaToken", "host"];
+    DEFAULT_HOST = "api.contentful.com";
+  }
+});
+
+// packages/experience-design-system-cli/src/tui/import/steps/04-credentials/controls.ts
+import { useInput as useInput6 } from "ink";
+function useCredentialsControls(handlers) {
+  useInput6((input, key) => {
+    if (handlers.disabled) return;
+    const action = keyAction2(input, key);
+    if (action === "back") handlers.onBack();
+    else if (action === "next-field") handlers.onNextField();
+    else if (action === "skip") handlers.onSkip();
+  });
+}
+var CREDENTIALS_CONTROLS;
+var init_controls4 = __esm({
+  "packages/experience-design-system-cli/src/tui/import/steps/04-credentials/controls.ts"() {
+    "use strict";
+    init_logic4();
+    CREDENTIALS_CONTROLS = [
+      { keys: "Enter", label: "Next field / Continue" },
+      { keys: "Tab", label: "Switch field" },
+      { keys: "Ctrl+S", label: "Skip (no push)" },
+      { keys: "Esc", label: "Back" }
+    ];
+  }
+});
+
+// packages/experience-design-system-cli/src/tui/import/steps/04-credentials/validate.ts
+function headers(token) {
+  return { Authorization: `Bearer ${token}`, "X-Contentful-User-Agent": USER_AGENT };
+}
+function isApsDenial(body) {
+  try {
+    const id = JSON.parse(body).sys?.id;
+    return id === "NotFound" || id === "AccessDenied";
+  } catch {
+    return false;
+  }
+}
+function messageFrom(body) {
+  try {
+    const message = JSON.parse(body).message;
+    return typeof message === "string" && message !== "" ? message : void 0;
+  } catch {
+    return void 0;
+  }
+}
+async function validateCredentials(values) {
+  const base = toApiHost(values.host);
+  let me;
+  try {
+    me = await fetch(`${base}/users/me`, { headers: headers(values.cmaToken) });
+  } catch (error) {
+    return { ok: false, error: `Could not reach ${base}: ${error instanceof Error ? error.message : String(error)}` };
+  }
+  if (me.status === 401) return { ok: false, error: "CMA token is invalid or revoked." };
+  if (!me.ok) return { ok: false, error: `Unexpected error validating the token (${me.status}).` };
+  let preflight;
+  try {
+    preflight = await fetch(
+      `${base}/spaces/${values.spaceId}/environments/${values.environmentId}/design_systems/preflight`,
+      { headers: headers(values.cmaToken) }
+    );
+  } catch {
+    return { ok: true };
+  }
+  if (preflight.ok || preflight.status >= 500) return { ok: true };
+  const body = await preflight.text();
+  if (preflight.status === 404 && !isApsDenial(body)) return { ok: true };
+  const detail = messageFrom(body);
+  if (preflight.status === 403) {
+    return { ok: false, error: `Access denied. ${detail ?? "Your token cannot write design system components here."}` };
+  }
+  if (preflight.status === 404) {
+    return {
+      ok: false,
+      error: `Not found. Check the space ID, environment and API host.${detail ? ` (${detail})` : ""}`
+    };
+  }
+  return { ok: false, error: `Credential check failed (${preflight.status}).${detail ? ` ${detail}` : ""}` };
+}
+var USER_AGENT;
+var init_validate = __esm({
+  "packages/experience-design-system-cli/src/tui/import/steps/04-credentials/validate.ts"() {
+    "use strict";
+    init_logic4();
+    USER_AGENT = "app contentful.experience-design-system-cli";
+  }
+});
+
+// packages/experience-design-system-cli/src/tui/import/steps/04-credentials/screen.tsx
+import { useRef, useState as useState6 } from "react";
+import { Box as Box6, Text as Text7 } from "ink";
+import TextInput3 from "ink-text-input";
+import { Fragment, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function CredentialsScreen({
+  onDone,
+  onBack,
+  initial = {},
+  validate = validateCredentials
+}) {
+  const initialValues = useRef(
+    normalize({
+      spaceId: initial.spaceId ?? "",
+      environmentId: initial.environmentId || "master",
+      cmaToken: initial.cmaToken ?? "",
+      host: initial.host ?? ""
+    })
+  ).current;
+  const [values, setValues] = useState6(initialValues);
+  const [active, setActive] = useState6("spaceId");
+  const [error, setError] = useState6(null);
+  const [validating, setValidating] = useState6(false);
+  const prefilled = initialValues.spaceId !== "" && initialValues.cmaToken !== "";
+  useCredentialsControls({
+    disabled: validating,
+    onBack,
+    onNextField: () => setActive(nextField),
+    onSkip: () => onDone({ skipped: true })
+  });
+  const change = (field) => (value) => {
+    setValues((current) => ({ ...current, [field]: value }));
+    setError(null);
+  };
+  const submit = async (field) => {
+    if (field !== "host") {
+      setActive(nextField(field));
+      return;
+    }
+    const credentials = normalize(values);
+    if (missingField(credentials)) {
+      setError("Space ID, environment and CMA token are all required.");
+      return;
+    }
+    setValidating(true);
+    const result = await validate(credentials);
+    setValidating(false);
+    if (result.ok) onDone({ skipped: false, credentials });
+    else setError(result.error);
+  };
+  return /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", gap: 1, paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", children: [
+      /* @__PURE__ */ jsx7(Text7, { bold: true, children: "Contentful credentials" }),
+      /* @__PURE__ */ jsx7(Text7, { children: prefilled ? "Credentials pre-filled from the configuration settings." : "Enter the Contentful space you want to import into." }),
+      !prefilled && /* @__PURE__ */ jsxs6(Fragment, { children: [
+        /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "We use it to check what components already exist and to push your import. If you skip, files are saved locally and nothing is pushed." }),
+        /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "Tip: save these under Settings \u2192 Configuration so they pre-fill here." })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx7(Box6, { flexDirection: "column", children: FIELDS.map((field) => /* @__PURE__ */ jsxs6(Box6, { gap: 1, children: [
+      /* @__PURE__ */ jsx7(Text7, { color: active === field ? PALETTE.accent : void 0, children: "?" }),
+      /* @__PURE__ */ jsxs6(Text7, { bold: active === field, children: [
+        LABELS[field],
+        ":"
+      ] }),
+      /* @__PURE__ */ jsx7(
+        TextInput3,
+        {
+          value: values[field],
+          focus: active === field && !validating,
+          mask: field === "cmaToken" ? "\u2022" : void 0,
+          placeholder: field === "host" ? DEFAULT_HOST : void 0,
+          onChange: change(field),
+          onSubmit: () => void submit(field)
+        }
+      )
+    ] }, field)) }),
+    active === "host" && /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "Default: api.contentful.com \xB7 EU spaces: api.eu.contentful.com" }),
+    error && /* @__PURE__ */ jsxs6(Text7, { color: PALETTE.error, children: [
+      "\u2717 ",
+      error
+    ] }),
+    validating && /* @__PURE__ */ jsx7(Text7, { color: PALETTE.accent, children: "Validating credentials..." }),
+    !validating && !error && !isUnchanged(normalize(values), initialValues) && /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "Changed values are saved after they validate." }),
+    /* @__PURE__ */ jsx7(Box6, { marginTop: 1, gap: 3, children: CREDENTIALS_CONTROLS.map((control) => /* @__PURE__ */ jsxs6(Text7, { dimColor: true, children: [
+      "[",
+      control.keys,
+      "] ",
+      control.label
+    ] }, control.keys)) })
+  ] });
+}
+var LABELS;
+var init_screen4 = __esm({
+  "packages/experience-design-system-cli/src/tui/import/steps/04-credentials/screen.tsx"() {
+    "use strict";
+    init_home_theme();
+    init_controls4();
+    init_logic4();
+    init_validate();
+    LABELS = {
+      spaceId: "Space ID",
+      environmentId: "Environment",
+      cmaToken: "CMA Token",
+      host: "API Host"
+    };
+  }
+});
+
 // packages/experience-design-system-cli/src/tui/import/steps/index.ts
 var init_steps = __esm({
   "packages/experience-design-system-cli/src/tui/import/steps/index.ts"() {
@@ -848,6 +1093,7 @@ var init_steps = __esm({
     init_screen();
     init_screen2();
     init_screen3();
+    init_screen4();
   }
 });
 
@@ -868,7 +1114,8 @@ async function spawnV1Import(options = {}) {
   const args = buildArgs(options);
   return new Promise((resolvePromise) => {
     const child = spawn3("node", [cliPath, ...args], {
-      stdio: "inherit"
+      stdio: "inherit",
+      env: options.skipCredentials ? { ...process.env, EDS_IMPORT_SKIP_CREDENTIALS: "1" } : process.env
     });
     child.on("close", (code) => {
       resolvePromise({ exitCode: code ?? 1, result: void 0, stdout: "", stderr: "" });
@@ -1146,20 +1393,20 @@ var init_help_info = __esm({
 });
 
 // packages/experience-design-system-cli/src/tui/help/PageContainer.tsx
-import { useEffect as useEffect4, useState as useState6 } from "react";
-import { Box as Box6, Text as Text7, useInput as useInput6 } from "ink";
-import { Fragment, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { useEffect as useEffect4, useState as useState7 } from "react";
+import { Box as Box7, Text as Text8, useInput as useInput7 } from "ink";
+import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 function Section({ title, rows }) {
-  return /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx7(Text7, { bold: true, color: PALETTE.accent, children: title }),
-    rows.map((row) => /* @__PURE__ */ jsxs6(Box6, { gap: 1, children: [
-      /* @__PURE__ */ jsx7(Box6, { width: 14, flexShrink: 0, children: /* @__PURE__ */ jsx7(Text7, { color: PALETTE.muted, children: row.label }) }),
-      /* @__PURE__ */ jsx7(Text7, { children: row.value })
+  return /* @__PURE__ */ jsxs7(Box7, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx8(Text8, { bold: true, color: PALETTE.accent, children: title }),
+    rows.map((row) => /* @__PURE__ */ jsxs7(Box7, { gap: 1, children: [
+      /* @__PURE__ */ jsx8(Box7, { width: 14, flexShrink: 0, children: /* @__PURE__ */ jsx8(Text8, { dimColor: true, children: row.label }) }),
+      /* @__PURE__ */ jsx8(Text8, { children: row.value })
     ] }, row.label))
   ] });
 }
 function HelpScreen({ onDone }) {
-  const [info, setInfo] = useState6();
+  const [info, setInfo] = useState7();
   useEffect4(() => {
     startDebugRun({ flow: "help", step: "01-help", menuOption: "Help", inputs: {} });
     void readHelpInfo().then(setInfo);
@@ -1168,7 +1415,7 @@ function HelpScreen({ onDone }) {
     void finishDebugRun({ outputs: {}, status: "success", exitMethod });
     onDone();
   };
-  useInput6((input, key) => {
+  useInput7((input, key) => {
     if (key.return) {
       leave("saved");
       return;
@@ -1178,14 +1425,14 @@ function HelpScreen({ onDone }) {
       return;
     }
   });
-  return /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", paddingX: 2, paddingY: 1, gap: 1, children: [
-    /* @__PURE__ */ jsx7(Text7, { bold: true, children: "Help" }),
-    info ? /* @__PURE__ */ jsxs6(Fragment, { children: [
-      /* @__PURE__ */ jsx7(Section, { title: "Where things are stored", rows: info.storage }),
-      /* @__PURE__ */ jsx7(Section, { title: "Troubleshooting", rows: info.troubleshooting }),
-      /* @__PURE__ */ jsx7(Text7, { color: PALETTE.muted, children: "Hit a problem? Turn on Debug Mode in Settings, reproduce it, then share the session folder above. The CMA token is redacted from those logs." })
-    ] }) : /* @__PURE__ */ jsx7(Text7, { color: PALETTE.accent, children: "Loading..." }),
-    /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs7(Box7, { flexDirection: "column", paddingX: 2, paddingY: 1, gap: 1, children: [
+    /* @__PURE__ */ jsx8(Text8, { bold: true, children: "Help" }),
+    info ? /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx8(Section, { title: "Where things are stored", rows: info.storage }),
+      /* @__PURE__ */ jsx8(Section, { title: "Troubleshooting", rows: info.troubleshooting }),
+      /* @__PURE__ */ jsx8(Text8, { dimColor: true, children: "Hit a problem? Turn on Debug Mode in Settings, reproduce it, then share the session folder above. The CMA token is redacted from those logs." })
+    ] }) : /* @__PURE__ */ jsx8(Text8, { color: PALETTE.accent, children: "Loading..." }),
+    /* @__PURE__ */ jsx8(
       ControlHints,
       {
         hints: [
@@ -1207,20 +1454,20 @@ var init_PageContainer2 = __esm({
 });
 
 // packages/experience-design-system-cli/src/tui/settings/PageContainer.tsx
-import { useState as useState7 } from "react";
-import { Box as Box7, Text as Text8, useInput as useInput7 } from "ink";
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { useState as useState8 } from "react";
+import { Box as Box8, Text as Text9, useInput as useInput8 } from "ink";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 function SettingsScreen({
   onNavigate,
   onBack
 }) {
-  const [focusIdx, setFocusIdx] = useState7(0);
+  const [focusIdx, setFocusIdx] = useState8(0);
   const items = [
     { label: "Configuration", screen: "settings-configuration" },
     { label: "Opt-in Analytics", screen: "settings-opt-in-analytics" },
     { label: "Debug Mode", screen: "settings-debug-mode" }
   ];
-  useInput7((input, key) => {
+  useInput8((input, key) => {
     if (key.upArrow) {
       setFocusIdx((i) => (i - 1 + items.length) % items.length);
       return;
@@ -1240,15 +1487,15 @@ function SettingsScreen({
       onBack();
     }
   });
-  return /* @__PURE__ */ jsxs7(Box7, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-    /* @__PURE__ */ jsx8(Text8, { bold: true, children: "Settings" }),
-    /* @__PURE__ */ jsx8(Text8, { children: " " }),
-    items.map((item, i) => /* @__PURE__ */ jsxs7(Text8, { color: i === focusIdx ? "cyan" : void 0, children: [
+  return /* @__PURE__ */ jsxs8(Box8, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsx9(Text9, { bold: true, children: "Settings" }),
+    /* @__PURE__ */ jsx9(Text9, { children: " " }),
+    items.map((item, i) => /* @__PURE__ */ jsxs8(Text9, { color: i === focusIdx ? "cyan" : void 0, children: [
       i === focusIdx ? "> " : "  ",
       item.label
     ] }, item.label)),
-    /* @__PURE__ */ jsx8(Text8, { children: " " }),
-    /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsx9(Text9, { children: " " }),
+    /* @__PURE__ */ jsx9(
       ControlHints,
       {
         hints: [
@@ -1309,10 +1556,10 @@ var init_config_store = __esm({
 });
 
 // packages/experience-design-system-cli/src/tui/settings/contentful-configuration/ContentfulConfigScreen.tsx
-import { useEffect as useEffect5, useState as useState8 } from "react";
-import { Box as Box8, Text as Text9, useInput as useInput8 } from "ink";
-import TextInput3 from "ink-text-input";
-import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { useEffect as useEffect5, useState as useState9 } from "react";
+import { Box as Box9, Text as Text10, useInput as useInput9 } from "ink";
+import TextInput4 from "ink-text-input";
+import { Fragment as Fragment3, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 function debugFields(config) {
   return {
     space_id: config?.spaceId ?? "",
@@ -1324,13 +1571,13 @@ function debugFields(config) {
   };
 }
 function ConfigurationScreen({ onDone }) {
-  const [stage, setStage] = useState8("loading");
-  const [config, setConfig] = useState8(null);
-  const [activeField, setActiveField] = useState8("spaceId");
-  const [notice, setNotice] = useState8(null);
-  const [lastSaved, setLastSaved] = useState8(null);
-  const [editing, setEditing] = useState8(false);
-  const [valueBeforeEdit, setValueBeforeEdit] = useState8("");
+  const [stage, setStage] = useState9("loading");
+  const [config, setConfig] = useState9(null);
+  const [activeField, setActiveField] = useState9("spaceId");
+  const [notice, setNotice] = useState9(null);
+  const [lastSaved, setLastSaved] = useState9(null);
+  const [editing, setEditing] = useState9(false);
+  const [valueBeforeEdit, setValueBeforeEdit] = useState9("");
   useEffect5(() => {
     readCredentials().then((cfg) => {
       setConfig(cfg);
@@ -1371,7 +1618,7 @@ function ConfigurationScreen({ onDone }) {
     );
     onDone();
   }
-  useInput8((input, key) => {
+  useInput9((input, key) => {
     if (stage === "loading" || stage === "saving") return;
     if (editing) {
       if (key.escape) {
@@ -1408,46 +1655,46 @@ function ConfigurationScreen({ onDone }) {
     }
   });
   if (stage === "loading") {
-    return /* @__PURE__ */ jsxs8(Box8, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-      /* @__PURE__ */ jsx9(Text9, { bold: true, children: "Configuration" }),
-      /* @__PURE__ */ jsx9(Text9, { children: " " }),
-      /* @__PURE__ */ jsx9(Text9, { color: PALETTE.accent, children: "Loading..." })
+    return /* @__PURE__ */ jsxs9(Box9, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+      /* @__PURE__ */ jsx10(Text10, { bold: true, children: "Configuration" }),
+      /* @__PURE__ */ jsx10(Text10, { children: " " }),
+      /* @__PURE__ */ jsx10(Text10, { color: PALETTE.accent, children: "Loading..." })
     ] });
   }
-  return /* @__PURE__ */ jsxs8(Box8, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-    /* @__PURE__ */ jsx9(Text9, { bold: true, children: "Configuration" }),
-    /* @__PURE__ */ jsx9(Text9, { children: " " }),
-    /* @__PURE__ */ jsx9(Box8, { flexDirection: "column", children: FIELD_ORDER.map((field) => {
+  return /* @__PURE__ */ jsxs9(Box9, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsx10(Text10, { bold: true, children: "Configuration" }),
+    /* @__PURE__ */ jsx10(Text10, { children: " " }),
+    /* @__PURE__ */ jsx10(Box9, { flexDirection: "column", children: FIELD_ORDER.map((field) => {
       const isActive = activeField === field;
       const value = fieldValue(field);
       const display = field === "cmaToken" ? "\u2022".repeat(value.length) : value;
-      return /* @__PURE__ */ jsxs8(Box8, { gap: 1, children: [
-        /* @__PURE__ */ jsx9(Text9, { color: isActive ? PALETTE.accent : void 0, children: isActive ? "\u276F" : " " }),
-        /* @__PURE__ */ jsxs8(Text9, { bold: isActive, children: [
+      return /* @__PURE__ */ jsxs9(Box9, { gap: 1, children: [
+        /* @__PURE__ */ jsx10(Text10, { color: isActive ? PALETTE.accent : void 0, children: isActive ? "\u276F" : " " }),
+        /* @__PURE__ */ jsxs9(Text10, { bold: isActive, children: [
           FIELD_LABELS[field],
           ":"
         ] }),
-        isActive && editing ? /* @__PURE__ */ jsx9(
-          TextInput3,
+        isActive && editing ? /* @__PURE__ */ jsx10(
+          TextInput4,
           {
             value,
             onChange: (next) => setFieldValue(field, next),
             onSubmit: () => setEditing(false),
             mask: field === "cmaToken" ? "\u2022" : void 0
           }
-        ) : /* @__PURE__ */ jsx9(Text9, { children: display || /* @__PURE__ */ jsx9(Text9, { color: PALETTE.muted, children: "(empty)" }) })
+        ) : /* @__PURE__ */ jsx10(Text10, { children: display || /* @__PURE__ */ jsx10(Text10, { dimColor: true, children: "(empty)" }) })
       ] }, field);
     }) }),
-    notice && /* @__PURE__ */ jsxs8(Fragment2, { children: [
-      /* @__PURE__ */ jsx9(Text9, { children: " " }),
-      /* @__PURE__ */ jsxs8(Text9, { color: notice.kind === "success" ? PALETTE.success : PALETTE.error, children: [
+    notice && /* @__PURE__ */ jsxs9(Fragment3, { children: [
+      /* @__PURE__ */ jsx10(Text10, { children: " " }),
+      /* @__PURE__ */ jsxs9(Text10, { color: notice.kind === "success" ? PALETTE.success : PALETTE.error, children: [
         notice.kind === "success" ? "\u2713" : "\u2717",
         " ",
         notice.text
       ] })
     ] }),
-    /* @__PURE__ */ jsx9(Text9, { children: " " }),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx10(Text10, { children: " " }),
+    /* @__PURE__ */ jsx10(
       ControlHints,
       {
         hints: editing ? [
@@ -1515,12 +1762,12 @@ var init_analytics_store = __esm({
 });
 
 // packages/experience-design-system-cli/src/tui/settings/opt-in-analytics/screen.tsx
-import { useEffect as useEffect6, useState as useState9 } from "react";
-import { Box as Box9, Text as Text10, useInput as useInput9 } from "ink";
-import { Fragment as Fragment3, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import { useEffect as useEffect6, useState as useState10 } from "react";
+import { Box as Box10, Text as Text11, useInput as useInput10 } from "ink";
+import { Fragment as Fragment4, jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 function OptInAnalyticsScreen({ onDone }) {
-  const [loading, setLoading] = useState9(true);
-  const [enabled, setEnabled] = useState9(true);
+  const [loading, setLoading] = useState10(true);
+  const [enabled, setEnabled] = useState10(true);
   useEffect6(() => {
     readAnalyticsSetting().then((setting) => {
       setEnabled(setting.enabled);
@@ -1533,7 +1780,7 @@ function OptInAnalyticsScreen({ onDone }) {
       });
     });
   }, []);
-  useInput9((input, key) => {
+  useInput10((input, key) => {
     if (loading) return;
     if (key.return || input === " ") {
       setEnabled((current) => {
@@ -1548,21 +1795,21 @@ function OptInAnalyticsScreen({ onDone }) {
       onDone();
     }
   });
-  return /* @__PURE__ */ jsxs9(Box9, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-    /* @__PURE__ */ jsx10(Text10, { bold: true, children: "Settings \u203A Opt-in Analytics" }),
-    /* @__PURE__ */ jsx10(Text10, { children: " " }),
-    loading ? /* @__PURE__ */ jsx10(Text10, { color: PALETTE.muted, children: "Loading\u2026" }) : /* @__PURE__ */ jsxs9(Fragment3, { children: [
-      /* @__PURE__ */ jsxs9(Text10, { children: [
+  return /* @__PURE__ */ jsxs10(Box10, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsx11(Text11, { bold: true, children: "Settings \u203A Opt-in Analytics" }),
+    /* @__PURE__ */ jsx11(Text11, { children: " " }),
+    loading ? /* @__PURE__ */ jsx11(Text11, { color: PALETTE.muted, children: "Loading\u2026" }) : /* @__PURE__ */ jsxs10(Fragment4, { children: [
+      /* @__PURE__ */ jsxs10(Text11, { children: [
         "Share anonymous usage data:",
         " ",
-        /* @__PURE__ */ jsx10(Text10, { bold: true, color: enabled ? PALETTE.success : PALETTE.muted, children: enabled ? "On" : "Off" })
+        /* @__PURE__ */ jsx11(Text11, { bold: true, color: enabled ? PALETTE.success : PALETTE.muted, children: enabled ? "On" : "Off" })
       ] }),
-      /* @__PURE__ */ jsx10(Text10, { children: " " }),
-      /* @__PURE__ */ jsx10(Text10, { color: PALETTE.muted, children: "Shares which CLI commands are used and where imports succeed or fail." }),
-      /* @__PURE__ */ jsx10(Text10, { color: PALETTE.muted, children: "Never includes source code, file paths, credentials, or authored content." })
+      /* @__PURE__ */ jsx11(Text11, { children: " " }),
+      /* @__PURE__ */ jsx11(Text11, { dimColor: true, children: "Shares which CLI commands are used and where imports succeed or fail." }),
+      /* @__PURE__ */ jsx11(Text11, { dimColor: true, children: "Never includes source code, file paths, credentials, or authored content." })
     ] }),
-    /* @__PURE__ */ jsx10(Text10, { children: " " }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(Text11, { children: " " }),
+    /* @__PURE__ */ jsx11(
       ControlHints,
       {
         hints: [
@@ -1573,7 +1820,7 @@ function OptInAnalyticsScreen({ onDone }) {
     )
   ] });
 }
-var init_screen4 = __esm({
+var init_screen5 = __esm({
   "packages/experience-design-system-cli/src/tui/settings/opt-in-analytics/screen.tsx"() {
     "use strict";
     init_home_theme();
@@ -1584,11 +1831,11 @@ var init_screen4 = __esm({
 });
 
 // packages/experience-design-system-cli/src/tui/upgrade/PageContainer.tsx
-import { useEffect as useEffect7, useState as useState10 } from "react";
-import { Box as Box10, Text as Text11, useInput as useInput10 } from "ink";
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { useEffect as useEffect7, useState as useState11 } from "react";
+import { Box as Box11, Text as Text12, useInput as useInput11 } from "ink";
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 function UpgradeScreen({ onDone }) {
-  const [upgradeCheck, setUpgradeCheck] = useState10();
+  const [upgradeCheck, setUpgradeCheck] = useState11();
   useEffect7(() => {
     startDebugRun({
       flow: "upgrade",
@@ -1598,7 +1845,7 @@ function UpgradeScreen({ onDone }) {
     });
     checkForUpgrade().then(setUpgradeCheck).catch(() => setUpgradeCheck({ status: "error" }));
   }, []);
-  useInput10((_input, key) => {
+  useInput11((_input, key) => {
     if (key.return) {
       void finishDebugRun({
         outputs: upgradeCheck ?? {},
@@ -1609,12 +1856,12 @@ function UpgradeScreen({ onDone }) {
       return;
     }
   });
-  return /* @__PURE__ */ jsxs10(Box10, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-    /* @__PURE__ */ jsx11(Text11, { bold: true, children: "Upgrade" }),
-    /* @__PURE__ */ jsx11(Text11, { children: " " }),
+  return /* @__PURE__ */ jsxs11(Box11, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsx12(Text12, { bold: true, children: "Upgrade" }),
+    /* @__PURE__ */ jsx12(Text12, { children: " " }),
     renderBody(upgradeCheck),
-    /* @__PURE__ */ jsx11(Text11, { children: " " }),
-    /* @__PURE__ */ jsxs10(Text11, { bold: true, color: PALETTE.accent, children: [
+    /* @__PURE__ */ jsx12(Text12, { children: " " }),
+    /* @__PURE__ */ jsxs11(Text12, { bold: true, color: PALETTE.accent, children: [
       FOCUS_MARKER,
       " Go Back"
     ] })
@@ -1622,34 +1869,34 @@ function UpgradeScreen({ onDone }) {
 }
 function renderBody(upgradeCheck) {
   if (!upgradeCheck) {
-    return /* @__PURE__ */ jsx11(Text11, { color: PALETTE.muted, children: "Checking for updates\u2026" });
+    return /* @__PURE__ */ jsx12(Text12, { color: PALETTE.muted, children: "Checking for updates\u2026" });
   }
   if (upgradeCheck.status === "error") {
-    return /* @__PURE__ */ jsx11(Text11, { color: PALETTE.warning, children: "Couldn't check for updates \u2014 check your network connection and try again." });
+    return /* @__PURE__ */ jsx12(Text12, { color: PALETTE.warning, children: "Couldn't check for updates \u2014 check your network connection and try again." });
   }
   if (upgradeCheck.status === "up-to-date") {
-    return /* @__PURE__ */ jsxs10(Text11, { color: PALETTE.success, children: [
+    return /* @__PURE__ */ jsxs11(Text12, { color: PALETTE.success, children: [
       "You're already on the latest version (v",
       upgradeCheck.current,
       ")."
     ] });
   }
-  return /* @__PURE__ */ jsxs10(Box10, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsxs10(Text11, { color: PALETTE.muted, children: [
-      /* @__PURE__ */ jsxs10(Text11, { bold: true, color: PALETTE.success, children: [
+  return /* @__PURE__ */ jsxs11(Box11, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsxs11(Text12, { color: PALETTE.muted, children: [
+      /* @__PURE__ */ jsxs11(Text12, { bold: true, color: PALETTE.success, children: [
         "v",
         upgradeCheck.latest
       ] }),
       " ",
       "is available (you're on ",
-      /* @__PURE__ */ jsxs10(Text11, { bold: true, children: [
+      /* @__PURE__ */ jsxs11(Text12, { bold: true, children: [
         "v",
         upgradeCheck.current
       ] }),
       "). Exit this program, cd into the root of your local clone of contentful/experience-design-system-sdk-public, then run:"
     ] }),
-    /* @__PURE__ */ jsx11(Text11, { children: " " }),
-    /* @__PURE__ */ jsx11(Box10, { flexDirection: "column", borderStyle: "round", borderColor: PALETTE.border, paddingX: 1, children: UPGRADE_COMMANDS.map((cmd) => /* @__PURE__ */ jsx11(Text11, { bold: true, children: cmd }, cmd)) })
+    /* @__PURE__ */ jsx12(Text12, { children: " " }),
+    /* @__PURE__ */ jsx12(Box11, { flexDirection: "column", borderStyle: "round", borderColor: PALETTE.border, paddingX: 1, children: UPGRADE_COMMANDS.map((cmd) => /* @__PURE__ */ jsx12(Text12, { bold: true, children: cmd }, cmd)) })
   ] });
 }
 var UPGRADE_COMMANDS;
@@ -1664,12 +1911,12 @@ var init_PageContainer4 = __esm({
 });
 
 // packages/experience-design-system-cli/src/tui/settings/debug-mode/screen.tsx
-import { useEffect as useEffect8, useState as useState11 } from "react";
-import { Box as Box11, Text as Text12, useInput as useInput11 } from "ink";
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { useEffect as useEffect8, useState as useState12 } from "react";
+import { Box as Box12, Text as Text13, useInput as useInput12 } from "ink";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
 function DebugModeScreen({ onDone }) {
-  const [loading, setLoading] = useState11(true);
-  const [enabled, setEnabled] = useState11(true);
+  const [loading, setLoading] = useState12(true);
+  const [enabled, setEnabled] = useState12(true);
   useEffect8(() => {
     readDebugModeSetting().then((setting) => {
       setEnabled(setting.enabled);
@@ -1682,7 +1929,7 @@ function DebugModeScreen({ onDone }) {
       });
     });
   }, []);
-  useInput11((input, key) => {
+  useInput12((input, key) => {
     if (loading) return;
     if (key.return || input === " ") {
       setEnabled((current) => {
@@ -1697,16 +1944,16 @@ function DebugModeScreen({ onDone }) {
       onDone();
     }
   });
-  return /* @__PURE__ */ jsxs11(Box11, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-    /* @__PURE__ */ jsx12(Text12, { bold: true, children: "Settings \u203A Debug Mode" }),
-    /* @__PURE__ */ jsx12(Text12, { children: " " }),
-    loading ? /* @__PURE__ */ jsx12(Text12, { color: PALETTE.muted, children: "Loading\u2026" }) : /* @__PURE__ */ jsxs11(Text12, { children: [
+  return /* @__PURE__ */ jsxs12(Box12, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsx13(Text13, { bold: true, children: "Settings \u203A Debug Mode" }),
+    /* @__PURE__ */ jsx13(Text13, { children: " " }),
+    loading ? /* @__PURE__ */ jsx13(Text13, { color: PALETTE.muted, children: "Loading\u2026" }) : /* @__PURE__ */ jsxs12(Text13, { children: [
       "Debug logging:",
       " ",
-      /* @__PURE__ */ jsx12(Text12, { bold: true, color: enabled ? PALETTE.success : PALETTE.muted, children: enabled ? "On" : "Off" })
+      /* @__PURE__ */ jsx13(Text13, { bold: true, color: enabled ? PALETTE.success : PALETTE.muted, children: enabled ? "On" : "Off" })
     ] }),
-    /* @__PURE__ */ jsx12(Text12, { children: " " }),
-    /* @__PURE__ */ jsx12(
+    /* @__PURE__ */ jsx13(Text13, { children: " " }),
+    /* @__PURE__ */ jsx13(
       ControlHints,
       {
         hints: [
@@ -1717,7 +1964,7 @@ function DebugModeScreen({ onDone }) {
     )
   ] });
 }
-var init_screen5 = __esm({
+var init_screen6 = __esm({
   "packages/experience-design-system-cli/src/tui/settings/debug-mode/screen.tsx"() {
     "use strict";
     init_home_theme();
@@ -1732,29 +1979,39 @@ var app_exports = {};
 __export(app_exports, {
   runApp: () => runApp
 });
-import { useEffect as useEffect9, useState as useState12 } from "react";
-import { Fragment as Fragment4, jsx as jsx13 } from "react/jsx-runtime";
+import { useEffect as useEffect9, useState as useState13 } from "react";
+import { Fragment as Fragment5, jsx as jsx14 } from "react/jsx-runtime";
 function App({ onLaunchImport, importExitCode }) {
   const returnedFromImport = importExitCode !== void 0;
-  const [screen, setScreen] = useState12(returnedFromImport ? "import" : "start");
-  const [showImportResult, setShowImportResult] = useState12(returnedFromImport);
-  const [projectPath, setProjectPath] = useState12();
-  const [tokensPath, setTokensPath] = useState12();
-  const [importDefaults, setImportDefaults] = useState12();
+  const [screen, setScreen] = useState13(returnedFromImport ? "import" : "start");
+  const [showImportResult, setShowImportResult] = useState13(returnedFromImport);
+  const [projectPath, setProjectPath] = useState13();
+  const [tokensPath, setTokensPath] = useState13();
+  const [pathConfirmed, setPathConfirmed] = useState13(false);
+  const [importDefaults, setImportDefaults] = useState13();
   useEffect9(() => {
     if (screen !== "import") {
       setImportDefaults(void 0);
       return;
     }
     void readCredentials().then(
-      (saved) => setImportDefaults({ componentDir: saved.defaultComponentDir ?? "", tokenFile: saved.defaultTokenFile ?? "" })
+      (saved) => setImportDefaults({
+        componentDir: saved.defaultComponentDir ?? "",
+        tokenFile: saved.defaultTokenFile ?? "",
+        credentials: saved
+      })
     );
   }, [screen]);
+  const finishCredentials = async (result, project, tokens) => {
+    if (!result.skipped) await writeCredentials({ ...result.credentials });
+    onLaunchImport?.({ project, tokens, skipCredentials: result.skipped });
+  };
   const goToStart = () => setScreen("start");
   const goToSettings = () => setScreen("settings");
   const resetImport = () => {
     setProjectPath(void 0);
     setTokensPath(void 0);
+    setPathConfirmed(false);
   };
   const finishImportResult = () => {
     setShowImportResult(false);
@@ -1767,13 +2024,13 @@ function App({ onLaunchImport, importExitCode }) {
   };
   switch (screen) {
     case "import":
-      if (showImportResult) return /* @__PURE__ */ jsx13(ImportScreen, { exitCode: importExitCode, onDone: finishImportResult });
-      if (importDefaults === void 0) return /* @__PURE__ */ jsx13(Fragment4, {});
+      if (showImportResult) return /* @__PURE__ */ jsx14(ImportScreen, { exitCode: importExitCode, onDone: finishImportResult });
+      if (importDefaults === void 0) return /* @__PURE__ */ jsx14(Fragment5, {});
       if (projectPath === void 0) {
-        return /* @__PURE__ */ jsx13(WelcomeScreen, { onContinue: setProjectPath, onQuit: leaveImport, initialPath: importDefaults.componentDir });
+        return /* @__PURE__ */ jsx14(WelcomeScreen, { onContinue: setProjectPath, onQuit: leaveImport, initialPath: importDefaults.componentDir });
       }
       if (tokensPath === void 0) {
-        return /* @__PURE__ */ jsx13(
+        return /* @__PURE__ */ jsx14(
           TokenInputScreen,
           {
             initialPath: importDefaults.tokenFile,
@@ -1782,35 +2039,45 @@ function App({ onLaunchImport, importExitCode }) {
           }
         );
       }
-      return /* @__PURE__ */ jsx13(
-        PathValidationScreen,
+      if (!pathConfirmed) {
+        return /* @__PURE__ */ jsx14(
+          PathValidationScreen,
+          {
+            projectPath,
+            onConfirm: () => setPathConfirmed(true),
+            onChangePath: resetImport,
+            onBack: () => setTokensPath(void 0)
+          }
+        );
+      }
+      return /* @__PURE__ */ jsx14(
+        CredentialsScreen,
         {
-          projectPath,
-          onConfirm: (project) => onLaunchImport?.({ project, tokens: tokensPath }),
-          onChangePath: resetImport,
-          onBack: () => setTokensPath(void 0)
+          initial: importDefaults.credentials,
+          onBack: () => setPathConfirmed(false),
+          onDone: (result) => void finishCredentials(result, projectPath, tokensPath)
         }
       );
     case "help":
-      return /* @__PURE__ */ jsx13(HelpScreen, { onDone: goToStart });
+      return /* @__PURE__ */ jsx14(HelpScreen, { onDone: goToStart });
     case "upgrade":
-      return /* @__PURE__ */ jsx13(UpgradeScreen, { onDone: goToStart });
+      return /* @__PURE__ */ jsx14(UpgradeScreen, { onDone: goToStart });
     case "settings":
-      return /* @__PURE__ */ jsx13(SettingsScreen, { onNavigate: setScreen, onBack: goToStart });
+      return /* @__PURE__ */ jsx14(SettingsScreen, { onNavigate: setScreen, onBack: goToStart });
     case "settings-configuration":
-      return /* @__PURE__ */ jsx13(ConfigurationScreen, { onDone: goToSettings });
+      return /* @__PURE__ */ jsx14(ConfigurationScreen, { onDone: goToSettings });
     case "settings-opt-in-analytics":
-      return /* @__PURE__ */ jsx13(OptInAnalyticsScreen, { onDone: goToSettings });
+      return /* @__PURE__ */ jsx14(OptInAnalyticsScreen, { onDone: goToSettings });
     case "settings-debug-mode":
-      return /* @__PURE__ */ jsx13(DebugModeScreen, { onDone: goToSettings });
+      return /* @__PURE__ */ jsx14(DebugModeScreen, { onDone: goToSettings });
     case "start":
-      return /* @__PURE__ */ jsx13(HomeScreen, { onNavigate: setScreen });
+      return /* @__PURE__ */ jsx14(HomeScreen, { onNavigate: setScreen });
   }
 }
 async function renderUntilImportRequestedOrExit(renderApp, importExitCode) {
   let requestedImport;
   const instance = renderApp(
-    /* @__PURE__ */ jsx13(
+    /* @__PURE__ */ jsx14(
       App,
       {
         importExitCode,
@@ -1849,9 +2116,9 @@ var init_app = __esm({
     init_PageContainer2();
     init_PageContainer3();
     init_ContentfulConfigScreen();
-    init_screen4();
-    init_PageContainer4();
     init_screen5();
+    init_PageContainer4();
+    init_screen6();
     init_config_store();
     CLEAR_SCREEN = "\x1B[2J\x1B[H";
   }