forgebook 0.1.8 → 0.3.0

package/dist/bin/forgebook/importers/storybook.js

@@ -14,19 +14,23 @@ var __rewriteRelativeImportExtension = (this && this.__rewriteRelativeImportExte
  * `main` is loaded, as Storybook loads it (Node strips a `main.ts`'s types), so a `stories` list it computes is read
  * too. The preview is read from its source, never run: it imports style sheets and components Node cannot load, so its
  * `globalTypes` and `initialGlobals` are read only when written as plain values; anything else is named in the notes
- * instead. Forgebook reads React stories on Vite only, so another framework is refused with what Forgebook supports.
+ * instead. Which Forgebook framework the stories move to, and what it takes besides them, is `storybookFrameworks.ts`'s
+ * choice; a framework it does not know is refused with what Forgebook supports. On-device React Native Storybook keeps
+ * its `main` in `.rnstorybook`, looked for after `.storybook`.
  * Each tool is an importer of its own: another tool is another module beside this one.
  *
  * @module
  */
 import { existsSync, readFileSync } from "node:fs";
-import { basename, join, relative, resolve } from "node:path";
+import { basename, join, relative } from "node:path";
 import { pathToFileURL } from "node:url";
 import ts from "typescript-6";
 import { switchesFromGlobalTypes } from "../../../src/switches.js";
 import { STORY_FILE } from "../../../src/vite/autoTitle.js";
-/** The framework Forgebook reads Storybook's stories for. */
-const REACT_VITE = "@storybook/react-vite";
+import { VITE_PATHS } from "../../../src/vite/vitePaths.js";
+import { frameworkOf, frameworkSettings, STORYBOOK_PACKAGES, storybookPackage } from "./storybookFrameworks.js";
+/** Storybook's folders, in the order they are looked for: Storybook's own, then on-device Storybook's. */
+const STORYBOOK_DIRS = [".storybook", ".rnstorybook"];
 /** Storybook's own default for a `stories` entry given as a folder. */
 const DEFAULT_FILES = "**/*.@(mdx|stories.@(js|jsx|mjs|ts|tsx))";
 /** The names `main` and the preview may have, in the order Storybook looks for them. */
@@ -41,16 +45,33 @@ const isRecord = (value) => typeof value === "object" && value !== null && !Arra
  */
 const scriptFile = (dir, name) => SCRIPT_EXTENSIONS.map((extension) => join(dir, `${name}.${extension}`)).find((file) => existsSync(file));
 /**
- * Every glob a glob with alternatives stands for: `@(a|b)` and `{a,b}` written out, nested ones too, so the
+ * The globs a group stands for, once its alternatives are read: each in place, and nothing in place too for an optional
+ * group (`?(a|b)`), unless nothing leaves two dots or a final dot, which no file's name has.
+ *
+ * @param head - the glob before the group.
+ * @param parts - the group's alternatives.
+ * @param tail - the glob after the group.
+ * @param isOptional - whether the group may be left out.
+ */
+const groupGlobs = (head, parts, tail, isOptional) => {
+    const spelled = parts.flatMap((part) => expandedGlobs(`${head}${part}${tail}`));
+    if (!isOptional || (head.endsWith(".") && (tail === "" || tail.startsWith("."))))
+        return spelled;
+    // nothing in place of a folder's name leaves the folder out (`src/?(ui)/*` is also `src/*`)
+    const without = head.endsWith("/") && tail.startsWith("/") ? `${head}${tail.slice(1)}` : `${head}${tail}`;
+    return [...spelled, ...expandedGlobs(without)];
+};
+/**
+ * Every glob a glob with alternatives stands for: `@(a|b)`, `?(a|b)` and `{a,b}` written out, nested ones too, so the
  * configuration lists plain globs a person reads at a glance.
  *
  * @param glob - the glob.
  */
 export const expandedGlobs = (glob) => {
-    const start = glob.search(/@\(|\{/);
+    const start = glob.search(/[@?]\(|\{/);
     if (start === -1)
         return [glob];
-    const isExtglob = glob[start] === "@";
+    const isExtglob = glob[start] !== "{";
     const separator = isExtglob ? "|" : ",";
     const contentStart = start + (isExtglob ? 2 : 1);
     // every bracket counts, so a group nested in another of the other kind is kept whole
@@ -69,9 +90,7 @@ export const expandedGlobs = (glob) => {
         }
         else if (depth === 0) {
             parts.push(glob.slice(partStart, index));
-            const head = glob.slice(0, start);
-            const tail = glob.slice(index + 1);
-            return parts.flatMap((part) => expandedGlobs(`${head}${part}${tail}`));
+            return groupGlobs(glob.slice(0, start), parts, glob.slice(index + 1), glob[start] === "?");
         }
     }
     return [glob];
@@ -103,21 +122,19 @@ const entryGlob = (entry, fromProject, notes) => {
  * @param entries - `main`'s `stories`.
  * @param storybookDir - the `.storybook` folder, absolute.
  * @param projectDir - the project's folder, absolute.
- * @returns the globs, and what was not read.
+ * @param paths - the path functions; the running system's unless a test names another.
+ * @returns the globs, with forward slashes on every system as globs take them, and what was not read.
  */
-export const storyGlobs = (entries, storybookDir, projectDir) => {
+export const storyGlobs = (entries, storybookDir, projectDir, paths = VITE_PATHS) => {
     const globs = [];
     const notes = [];
-    const fromProject = (path) => relative(projectDir, resolve(storybookDir, path)) || ".";
+    const fromProject = (path) => paths.relative(projectDir, paths.resolve(storybookDir, path)) || ".";
     for (const entry of entries) {
         const glob = entryGlob(entry, fromProject, notes);
         if (glob === undefined)
             continue;
         // `.stories.*` names every script extension: written out as the ones Forgebook reads
-        const named = glob
-            .split("\\")
-            .join("/")
-            .replace(/\.stories\.\*$/, ".stories.@(js|jsx|mjs|ts|tsx)");
+        const named = glob.replace(/\.stories\.\*$/, ".stories.@(js|jsx|mjs|ts|tsx)");
         for (const each of expandedGlobs(named)) {
             if (STORY_FILE.test(each))
                 globs.push(each);
@@ -267,24 +284,34 @@ export const previewSwitches = (text, file) => {
  * @param dir - the project's folder.
  */
 const projectTitle = (dir) => {
+    const manifest = projectManifest(dir);
+    return typeof manifest["name"] === "string" && manifest["name"] !== "" ? manifest["name"] : basename(dir);
+};
+/**
+ * The project's `package.json`, parsed; empty when it has none.
+ *
+ * @param dir - the project's folder.
+ */
+const projectManifest = (dir) => {
     const file = join(dir, "package.json");
-    if (existsSync(file)) {
-        const parsed = JSON.parse(readFileSync(file, "utf8"));
-        if (isRecord(parsed) && typeof parsed["name"] === "string" && parsed["name"] !== "")
-            return parsed["name"];
-    }
-    return basename(dir);
+    const parsed = existsSync(file) ? JSON.parse(readFileSync(file, "utf8")) : {};
+    return isRecord(parsed) ? parsed : {};
 };
 /**
- * The framework `main` names: a text, or an object with its `name`.
+ * Whether a project is on-device Storybook's: its folder is `.rnstorybook` (from version 9), or it depends on
+ * `@storybook/react-native`, whose `main` in `.storybook` names no framework (before version 9).
  *
- * @param main - `main`'s configuration.
+ * @param projectDir - the project's folder.
+ * @param storybookDir - the Storybook folder read.
  */
-const frameworkName = (main) => {
-    const { framework } = main;
-    if (typeof framework === "string")
-        return framework;
-    return isRecord(framework) && typeof framework["name"] === "string" ? framework["name"] : undefined;
+const isOnDeviceStorybook = (projectDir, storybookDir) => {
+    if (basename(storybookDir) === ".rnstorybook")
+        return true;
+    const manifest = projectManifest(projectDir);
+    return ["dependencies", "devDependencies"].some((field) => {
+        const list = manifest[field];
+        return isRecord(list) && "@storybook/react-native" in list;
+    });
 };
 /**
  * Storybook's `main`, loaded as Node loads a module.
@@ -306,14 +333,6 @@ const loadedMain = async (mainFile, projectDir) => {
     const main = isRecord(loaded) && isRecord(loaded["default"]) ? loaded["default"] : loaded;
     return isRecord(main) ? main : `${relative(projectDir, mainFile)} exports no configuration`;
 };
-/**
- * Whether `main`'s framework is React on Vite: its name, or a path to its package, as Storybook's monorepo template
- * writes it (`getAbsolutePath("@storybook/react-vite")`).
- *
- * @param framework - the framework's name or path.
- */
-const isReactVite = (framework) => framework !== undefined &&
-    (framework === REACT_VITE || framework.split("\\").join("/").endsWith(`/${REACT_VITE}`));
 /**
  * Reads a project's Storybook configuration.
  *
@@ -321,32 +340,39 @@ const isReactVite = (framework) => framework !== undefined &&
  * @returns what a Forgebook configuration takes from it, or why it cannot be read.
  */
 export const importStorybook = async (projectDir) => {
-    const storybookDir = join(projectDir, ".storybook");
+    const found = STORYBOOK_DIRS.map((name) => join(projectDir, name)).find((dir) => scriptFile(dir, "main") !== undefined);
+    const storybookDir = found ?? join(projectDir, STORYBOOK_DIRS[0] ?? ".storybook");
     const mainFile = scriptFile(storybookDir, "main");
     if (mainFile === undefined)
-        return `No .storybook/main file in ${projectDir}`;
+        return `No .storybook/main (or .rnstorybook/main) file in ${projectDir}`;
     const main = await loadedMain(mainFile, projectDir);
     if (typeof main === "string")
         return main;
-    const framework = frameworkName(main);
-    if (!isReactVite(framework))
-        return `Forgebook reads Storybook's React stories on Vite (${REACT_VITE}); this project uses ${framework ?? "no framework"}`;
+    const storybook = storybookPackage(main, isOnDeviceStorybook(projectDir, storybookDir));
+    if (storybook === undefined) {
+        const supported = STORYBOOK_PACKAGES.join(", ");
+        return `Forgebook reads the stories of Storybook's ${supported}; this project uses ${frameworkOf(main).name ?? "no framework"}`;
+    }
+    const settings = frameworkSettings(storybook, main, projectDir, storybookDir);
     const entries = Array.isArray(main["stories"]) ? main["stories"] : [];
     const { globs, notes } = storyGlobs(entries, storybookDir, projectDir);
     if (globs.length === 0)
         return `${relative(projectDir, mainFile)} names no story file Forgebook reads`;
     if (Array.isArray(main["addons"]) && main["addons"].length > 0)
         notes.push("The addons are left out: Forgebook has its own panel, toolbar and checks");
+    notes.push(...settings.notes);
     const previewFile = scriptFile(storybookDir, "preview");
     const read = previewFile === undefined
         ? { switches: undefined, notes: [] }
         : previewSwitches(readFileSync(previewFile, "utf8"), previewFile);
     return {
+        framework: settings.framework,
+        frameworkOptions: settings.options,
         title: projectTitle(projectDir),
         stories: globs,
-        preview: previewFile === undefined ? undefined : relative(projectDir, previewFile),
+        // with forward slashes: it is written into the configuration, which may be shared across systems
+        preview: previewFile === undefined ? undefined : VITE_PATHS.relative(projectDir, previewFile),
         switches: read.switches,
         notes: [...notes, ...read.notes]
     };
 };
-//# sourceMappingURL=storybook.js.map

package/dist/bin/forgebook/importers/storybookAngular.d.ts

@@ -0,0 +1,15 @@
+/** What the Angular adapter's options take from the project, and what was not read. */
+export type AngularImport = {
+    /** The adapter's options, as `angular({ … })` writes them; none for the defaults. */
+    readonly options: Readonly<Record<string, string>> | undefined;
+    /** What was not read, each a sentence for the person who runs the command. */
+    readonly notes: readonly string[];
+};
+/**
+ * Reads what an Angular project's Storybook adds to `.storybook`.
+ *
+ * @param projectDir - the project's folder, absolute.
+ * @param storybookDir - the `.storybook` folder, absolute.
+ * @param frameworkOptions - the options `main` gives its framework (`{ name, options }`'s `options`).
+ */
+export declare const importAngular: (projectDir: string, storybookDir: string, frameworkOptions: Readonly<Record<string, unknown>>) => AngularImport;

package/dist/bin/forgebook/importers/storybookAngular.js

@@ -0,0 +1,97 @@
+/**
+ * What `forgebook init --from storybook` reads of an Angular project besides `.storybook`: the TypeScript configuration
+ * the stories are compiled with, and the builder options of `angular.json` it cannot carry over.
+ *
+ * @remarks
+ * Storybook's Angular builders compile the stories with `.storybook/tsconfig.json` unless `angular.json` or the
+ * framework's options name another; Forgebook's Angular adapter takes the same file as its `tsconfig` option, so the
+ * components compile as they did. The builders' `styles` and `compodoc` live in `angular.json`, which Forgebook does not
+ * read: each is named in the notes, with what to do instead.
+ *
+ * @module
+ */
+import { existsSync, readFileSync } from "node:fs";
+import { join, relative, resolve } from "node:path";
+/** The builders whose options hold a Storybook's own settings, by their names in `angular.json`. */
+const STORYBOOK_BUILDERS = [
+    "@storybook/angular:start-storybook",
+    "@analogjs/storybook-angular:start-storybook"
+];
+/** Whether a value is a plain object. */
+const isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+/**
+ * The options of the `angular.json` targets that start a Storybook.
+ *
+ * @param projectDir - the project's folder.
+ */
+const storybookTargets = (projectDir) => {
+    const file = join(projectDir, "angular.json");
+    if (!existsSync(file))
+        return [];
+    let parsed;
+    try {
+        parsed = JSON.parse(readFileSync(file, "utf8"));
+    }
+    catch {
+        return [];
+    }
+    const projects = isRecord(parsed) && isRecord(parsed["projects"]) ? Object.values(parsed["projects"]) : [];
+    return projects.flatMap((project) => {
+        const targets = isRecord(project) ? (project["architect"] ?? project["targets"]) : undefined;
+        if (!isRecord(targets))
+            return [];
+        return Object.values(targets).flatMap((target) => isRecord(target) &&
+            STORYBOOK_BUILDERS.includes(String(target["builder"] ?? target["executor"])) &&
+            isRecord(target["options"])
+            ? [target["options"]]
+            : []);
+    });
+};
+/**
+ * The TypeScript configuration the stories were compiled with, from the project's folder: the framework's `tsconfig`
+ * option, the builder's `tsConfig`, or Storybook's default beside `main`.
+ *
+ * @param projectDir - the project's folder, absolute.
+ * @param storybookDir - the `.storybook` folder, absolute.
+ * @param frameworkOptions - the options `main` gives its framework.
+ * @param targets - the builders' options.
+ */
+const tsconfigOf = (projectDir, storybookDir, frameworkOptions, targets) => {
+    const named = frameworkOptions["tsconfig"];
+    if (typeof named === "string")
+        return relative(projectDir, resolve(storybookDir, named));
+    // a builder's path is from the workspace's folder, and only a single Storybook says which project is meant
+    const fromBuilder = targets.length === 1 ? targets[0]?.["tsConfig"] : undefined;
+    if (typeof fromBuilder === "string")
+        return fromBuilder;
+    const beside = join(storybookDir, "tsconfig.json");
+    return existsSync(beside) ? relative(projectDir, beside) : undefined;
+};
+/**
+ * Reads what an Angular project's Storybook adds to `.storybook`.
+ *
+ * @param projectDir - the project's folder, absolute.
+ * @param storybookDir - the `.storybook` folder, absolute.
+ * @param frameworkOptions - the options `main` gives its framework (`{ name, options }`'s `options`).
+ */
+export const importAngular = (projectDir, storybookDir, frameworkOptions) => {
+    const targets = storybookTargets(projectDir);
+    const tsconfig = tsconfigOf(projectDir, storybookDir, frameworkOptions, targets);
+    const styles = [
+        ...new Set(targets.flatMap((options) => Array.isArray(options["styles"]) ? options["styles"].filter((style) => typeof style === "string") : []))
+    ];
+    const notes = [
+        ...(styles.length === 0
+            ? []
+            : [
+                `angular.json's Storybook styles are not loaded (${styles.join(", ")}): import them in the preview`
+            ]),
+        ...(targets.some((options) => options["compodoc"] === true)
+            ? ["Compodoc is not run: Forgebook reads the components' inputs, outputs and content from their types"]
+            : [])
+    ];
+    return {
+        options: tsconfig === undefined ? undefined : { tsconfig: tsconfig.split("\\").join("/") },
+        notes
+    };
+};

package/dist/bin/forgebook/importers/storybookFrameworks.d.ts

@@ -0,0 +1,53 @@
+/** The frameworks a project's stories can move to Forgebook with: `@forgebook/<name>`. */
+export type ImportedFramework = "react" | "vue" | "svelte" | "sveltekit" | "preact" | "solid" | "nextjs" | "web-components" | "html" | "nuxt" | "angular" | "react-native-web";
+/**
+ * The function each framework's `@forgebook/<name>/vite` exports, which a configuration calls: the framework's name, or
+ * its camel case where the name is no identifier.
+ */
+export declare const ADAPTER_FUNCTIONS: Readonly<Record<ImportedFramework, string>>;
+/** The Storybook packages Forgebook reads, as a refusal names them. */
+export declare const STORYBOOK_PACKAGES: readonly string[];
+/** What a framework takes from a project's Storybook besides its stories. */
+export type FrameworkSettings = {
+    /** The Forgebook framework. */
+    readonly framework: ImportedFramework;
+    /** Its adapter's options, plain values; none for its defaults. */
+    readonly options: Readonly<Record<string, unknown>> | undefined;
+    /** What was not read, each a sentence for the person who runs the command. */
+    readonly notes: readonly string[];
+};
+/**
+ * The framework `main` names: a text, or an object with its `name` and its `options`.
+ *
+ * @param main - `main`'s configuration.
+ */
+export declare const frameworkOf: (main: Readonly<Record<string, unknown>>) => {
+    readonly name: string | undefined;
+    readonly options: Readonly<Record<string, unknown>>;
+};
+/**
+ * The Storybook package that decides a project's framework: React Native Web's addon when `main` lists it, else the
+ * framework `main` names, else on-device Storybook's for a project on it whose `main` names none.
+ *
+ * @param main - `main`'s configuration.
+ * @param isOnDevice - whether the project is on-device Storybook's (`.rnstorybook`, or `@storybook/react-native`).
+ * @returns the package, or none for a framework Forgebook does not read.
+ */
+export declare const storybookPackage: (main: Readonly<Record<string, unknown>>, isOnDevice: boolean) => string | undefined;
+/**
+ * The Forgebook framework of a Storybook package, with what it takes from the project besides its stories: its
+ * adapter's options, and what was not read.
+ *
+ * @param storybook - the Storybook package (`storybookPackage`).
+ * @param main - `main`'s configuration.
+ * @param projectDir - the project's folder, absolute.
+ * @param storybookDir - the Storybook folder, absolute.
+ */
+export declare const frameworkSettings: (storybook: string, main: Readonly<Record<string, unknown>>, projectDir: string, storybookDir: string) => FrameworkSettings;
+/**
+ * The packages a framework's adapter needs beside its own that a project may not have yet: none for most.
+ *
+ * @param framework - the Forgebook framework.
+ * @param options - its adapter's options.
+ */
+export declare const frameworkPeers: (framework: ImportedFramework, options: Readonly<Record<string, unknown>> | undefined) => readonly string[];

package/dist/bin/forgebook/importers/storybookFrameworks.js

@@ -0,0 +1,180 @@
+/**
+ * The Forgebook framework a project's Storybook moves to, chosen from the Storybook framework `main` names (or, for
+ * React Native, the addon or the folder that says it), with what that framework takes from the project: its adapter's
+ * options and what was not read.
+ *
+ * @remarks
+ * One table maps Storybook's frameworks to Forgebook's; `storybook.ts` loads `main` and asks this module which one it
+ * is, so a framework is added in one place. A framework whose project says more than its stories (a Next.js app's
+ * `next.config`, an Angular project's `angular.json`, React Native's compiled packages and Babel) has a reader of its
+ * own beside this one, called from `frameworkSettings`.
+ *
+ * @module
+ */
+import { basename } from "node:path";
+import { VITE_PATHS } from "../../../src/vite/vitePaths.js";
+import { importAngular } from "./storybookAngular.js";
+import { importReactNative, ON_DEVICE_STORYBOOK, REACT_NATIVE_WEB_ADDON, REACT_NATIVE_WEB_VITE, reactNativePeers } from "./storybookReactNative.js";
+/**
+ * The function each framework's `@forgebook/<name>/vite` exports, which a configuration calls: the framework's name, or
+ * its camel case where the name is no identifier.
+ */
+export const ADAPTER_FUNCTIONS = {
+    react: "react",
+    vue: "vue",
+    svelte: "svelte",
+    sveltekit: "sveltekit",
+    preact: "preact",
+    solid: "solid",
+    nextjs: "nextjs",
+    "web-components": "webComponents",
+    html: "html",
+    nuxt: "nuxt",
+    angular: "angular",
+    "react-native-web": "reactNativeWeb"
+};
+/** The Forgebook frameworks a project's Storybook can move to, by Storybook's framework. */
+const STORYBOOK_FRAMEWORKS = {
+    "@storybook/react-vite": "react",
+    "@storybook/vue3-vite": "vue",
+    "@storybook/svelte-vite": "svelte",
+    "@storybook/sveltekit": "sveltekit",
+    "@storybook/preact-vite": "preact",
+    // Solid's Storybook framework is the community's, published under its own name
+    "storybook-solidjs-vite": "solid",
+    "@storybook/web-components-vite": "web-components",
+    "@storybook/html-vite": "html",
+    // Nuxt's Storybook module sets up a framework of its own, on Vue's
+    "@storybook-vue/nuxt": "nuxt",
+    // Angular's two compile a story the same way, through the Angular adapter's Vite plugin
+    "@storybook/angular": "angular",
+    "@analogjs/storybook-angular": "angular",
+    "@storybook/nextjs-vite": "nextjs",
+    "@storybook/nextjs": "nextjs",
+    [REACT_NATIVE_WEB_VITE]: "react-native-web",
+    // an addon beside a React framework on webpack, which makes the stories React Native's whatever the framework
+    [REACT_NATIVE_WEB_ADDON]: "react-native-web",
+    // on-device Storybook, drawn in the browser through react-native-web
+    [ON_DEVICE_STORYBOOK]: "react-native-web"
+};
+/** The Storybook packages Forgebook reads, as a refusal names them. */
+export const STORYBOOK_PACKAGES = Object.keys(STORYBOOK_FRAMEWORKS);
+/** What a Nuxt project's stories get differently once moved, said once the configuration is written. */
+const NUXT_NOTES = [
+    "Nuxt's modules and plugins are not run: a component that needs what one provides (a store, i18n) gets it from a decorator",
+    "A story's route, data, state and cookies are set with parameters.nuxt (route, data, state, cookies), not by a decorator that drives the router"
+];
+/** Whether a value is a plain object. */
+const isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+/**
+ * A framework or an addon as `main` writes it: a text, or an object with its `name` and its `options`.
+ *
+ * @param entry - the entry.
+ */
+const entryOf = (entry) => {
+    if (typeof entry === "string")
+        return { name: entry, options: {} };
+    if (!isRecord(entry))
+        return { name: undefined, options: {} };
+    return {
+        name: typeof entry["name"] === "string" ? entry["name"] : undefined,
+        options: isRecord(entry["options"]) ? entry["options"] : {}
+    };
+};
+/**
+ * The framework `main` names: a text, or an object with its `name` and its `options`.
+ *
+ * @param main - `main`'s configuration.
+ */
+export const frameworkOf = (main) => entryOf(main["framework"]);
+/**
+ * The Storybook package a name or a path stands for, among the table's: its name, or a path to its package, as
+ * Storybook's monorepo template writes it (`getAbsolutePath("@storybook/react-vite")`).
+ *
+ * @param written - the name or the path.
+ */
+const knownPackage = (written) => {
+    if (written === undefined)
+        return undefined;
+    const path = VITE_PATHS.normalize(written).replace(/\/$/, "");
+    return STORYBOOK_PACKAGES.find((name) => path === name || path.endsWith(`/${name}`));
+};
+/**
+ * The addon `main` lists by a package, with its options.
+ *
+ * @param main - `main`'s configuration.
+ * @param name - the addon's package.
+ */
+const addonOf = (main, name) => {
+    const addons = Array.isArray(main["addons"]) ? main["addons"].map(entryOf) : [];
+    return addons.find((addon) => knownPackage(addon.name) === name);
+};
+/**
+ * The Storybook package that decides a project's framework: React Native Web's addon when `main` lists it, else the
+ * framework `main` names, else on-device Storybook's for a project on it whose `main` names none.
+ *
+ * @param main - `main`'s configuration.
+ * @param isOnDevice - whether the project is on-device Storybook's (`.rnstorybook`, or `@storybook/react-native`).
+ * @returns the package, or none for a framework Forgebook does not read.
+ */
+export const storybookPackage = (main, isOnDevice) => {
+    if (addonOf(main, REACT_NATIVE_WEB_ADDON) !== undefined)
+        return REACT_NATIVE_WEB_ADDON;
+    const { name } = frameworkOf(main);
+    if (name === undefined)
+        return isOnDevice ? ON_DEVICE_STORYBOOK : undefined;
+    return knownPackage(name);
+};
+/**
+ * What a Next.js project's Storybook says that the Next.js framework reads: its `next.config` when not where Next.js
+ * looks, and what Forgebook does without being told.
+ *
+ * @param main - `main`'s configuration.
+ * @param storybook - Storybook's framework package.
+ * @param projectDir - the project's folder.
+ * @returns the framework's options, and the notes.
+ */
+const nextjsSettings = (main, storybook, projectDir) => {
+    const notes = [];
+    if (storybook === "@storybook/nextjs")
+        notes.push("Storybook's Next.js framework on webpack: Forgebook runs on Vite, so webpackFinal and a Babel configuration are not read");
+    const features = main["features"];
+    if (isRecord(features) && features["experimentalRSC"] === true)
+        notes.push("experimentalRSC is not needed: Forgebook draws async server components without a flag");
+    const { nextConfigPath } = frameworkOf(main).options;
+    // the Next.js app's folder is where its next.config is: its tsconfig, .env files and PostCSS are there too
+    const file = typeof nextConfigPath === "string" ? VITE_PATHS.resolve(projectDir, nextConfigPath) : undefined;
+    const appDir = file === undefined ? "" : VITE_PATHS.relative(projectDir, VITE_PATHS.dirname(file));
+    const options = file === undefined
+        ? undefined
+        : { ...(appDir === "" ? {} : { dir: appDir }), nextConfig: basename(file) };
+    return { options, notes };
+};
+/**
+ * The Forgebook framework of a Storybook package, with what it takes from the project besides its stories: its
+ * adapter's options, and what was not read.
+ *
+ * @param storybook - the Storybook package (`storybookPackage`).
+ * @param main - `main`'s configuration.
+ * @param projectDir - the project's folder, absolute.
+ * @param storybookDir - the Storybook folder, absolute.
+ */
+export const frameworkSettings = (storybook, main, projectDir, storybookDir) => {
+    const framework = STORYBOOK_FRAMEWORKS[storybook] ?? "react";
+    if (framework === "nextjs")
+        return { framework, ...nextjsSettings(main, storybook, projectDir) };
+    if (framework === "angular")
+        return { framework, ...importAngular(projectDir, storybookDir, frameworkOf(main).options) };
+    if (framework === "react-native-web") {
+        const options = addonOf(main, storybook)?.options ?? frameworkOf(main).options;
+        return { framework, ...importReactNative(storybook, options, main) };
+    }
+    return { framework, options: undefined, notes: framework === "nuxt" ? NUXT_NOTES : [] };
+};
+/**
+ * The packages a framework's adapter needs beside its own that a project may not have yet: none for most.
+ *
+ * @param framework - the Forgebook framework.
+ * @param options - its adapter's options.
+ */
+export const frameworkPeers = (framework, options) => (framework === "react-native-web" ? reactNativePeers(options) : []);

package/dist/bin/forgebook/importers/storybookReactNative.d.ts

@@ -0,0 +1,40 @@
+/**
+ * What `forgebook init --from storybook` reads of a React Native project's Storybook: the options of Storybook's React
+ * Native Web framework or of its older addon, turned into `reactNativeWeb()`'s, and what on-device Storybook draws
+ * differently in a browser.
+ *
+ * @remarks
+ * Pure: the options `main` gives in, the adapter's options and the notes out; `storybookFrameworks.ts` chooses the
+ * framework and hands them over. The packages Storybook compiled (`modulesToTranspile`) become `nativePackages`; its
+ * `pluginReactOptions` (the JSX import source, Babel's plugins and presets, the files) become the adapter's options of
+ * the same meaning; what cannot be written as a plain value (a function, a regular expression) is named in a note.
+ *
+ * @module
+ */
+/** Storybook's React Native framework for the browser, on Vite. */
+export declare const REACT_NATIVE_WEB_VITE = "@storybook/react-native-web-vite";
+/** Storybook's older React Native Web addon, on webpack, beside a React framework. */
+export declare const REACT_NATIVE_WEB_ADDON = "@storybook/addon-react-native-web";
+/** On-device Storybook's package, which `main` names as its framework or not at all. */
+export declare const ON_DEVICE_STORYBOOK = "@storybook/react-native";
+/** What the React Native Web adapter's options take from the project, and what was not read. */
+export type ReactNativeImport = {
+    /** The adapter's options, plain values written into the configuration; none for the defaults. */
+    readonly options: Readonly<Record<string, unknown>> | undefined;
+    /** What was not read, each a sentence for the person who runs the command. */
+    readonly notes: readonly string[];
+};
+/**
+ * What a React Native project's Storybook gives `reactNativeWeb()`.
+ *
+ * @param storybook - the Storybook package read: the framework on Vite, the older addon, or on-device Storybook.
+ * @param options - that framework's or addon's options.
+ * @param main - `main`'s configuration, for on-device Storybook's device addons.
+ */
+export declare const importReactNative: (storybook: string, options: Readonly<Record<string, unknown>>, main: Readonly<Record<string, unknown>>) => ReactNativeImport;
+/**
+ * The packages `reactNativeWeb()` needs beside its own that a project may not have yet.
+ *
+ * @param options - the adapter's options.
+ */
+export declare const reactNativePeers: (options: Readonly<Record<string, unknown>> | undefined) => readonly string[];