@wix/origami-transforms 0.1.31 → 0.1.33

package/dist/wrapperImport.d.ts

@@ -5,3 +5,4 @@ export function wrapperImport({ module, symbol }: {
     readonly module: string;
     readonly symbol: string;
 }): string;
+export function moduleFromWrapperEntry(specifier: string): string | undefined;

package/dist/wrapperSideEffects.d.ts

@@ -0,0 +1,25 @@
+/** The module of the site's own (companion) app. Its providers' viewer services come with the export; other apps' come
+ * with the site's services. */
+export const COMPANION_APP: "companionApp";
+/** Where an export puts the viewer services the companion app's wrapped context providers need, relative to the site
+ * app: each service's bundle and the module that registers it, `<package name>/bundle.js` and `<package name>/index.js`. */
+export const VIEWER_SERVICES_FOLDER: "src/site/_generated/viewer-services";
+export function viewerServiceImport(generatedFolder: string, packageName: string): string;
+export function wrapperSideEffectImports(sources: Iterable<string>, catalog: WrapperCatalog, generatedFolder: string): string[];
+/**
+ * the site's component catalog (`site-component-catalog.json`), by module
+ */
+export type WrapperCatalog = {
+    readonly [module: string]: {
+        readonly entries: {
+            readonly components?: {
+                readonly [name: string]: unknown;
+            };
+            readonly contextProviders?: {
+                readonly [name: string]: {
+                    readonly services?: readonly string[];
+                };
+            };
+        };
+    };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/origami-transforms",
-  "version": "0.1.31",
+  "version": "0.1.33",
   "description": "Babel and PostCSS checks and transforms for Wix origami page files.",
   "main": "./src/index.js",
   "files": [
@@ -23,7 +23,7 @@
     "@wix/origami-system-components": "1.10.6",
     "postcss": "^8.5.3",
     "postcss-custom-media": "^12.0.1",
-    "@wix/origami-bi": "0.11.0"
+    "@wix/origami-bi": "0.12.0"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",
@@ -64,6 +64,10 @@
       "types": "./dist/wrapperImport.d.ts",
       "default": "./src/wrapperImport.js"
     },
+    "./wrapper-side-effects": {
+      "types": "./dist/wrapperSideEffects.d.ts",
+      "default": "./src/wrapperSideEffects.js"
+    },
     "./companion-registrations": {
       "types": "./dist/companionRegistrations.d.ts",
       "default": "./src/companionRegistrations.js"
@@ -71,5 +75,5 @@
   },
   "type": "module",
   "types": "./dist/index.d.ts",
-  "falconPackageHash": "eea52f454e6f8d604431d5d69e6ce0bae25496f2528518f4dbdb43dd"
+  "falconPackageHash": "543337a557c7e9b34bf34978fb0fcde189ab7ccc51c0ee4a8e805448"
 }

package/src/wrapperImport.js

@@ -19,3 +19,13 @@ export const wrapperPackageName = module => `${WRAPPERS_SCOPE}/${module}`
  * @param {{ readonly module: string, readonly symbol: string }} component
  */
 export const wrapperImport = ({ module, symbol }) => `${wrapperPackageName(module)}/${symbol.toLowerCase()}`
+
+// The package name keeps the module as is; the symbol comes back from the import specifier.
+const WRAPPER_PACKAGE_IMPORT = new RegExp(`^${WRAPPERS_SCOPE}/([^/]+)/[^/]+$`)
+
+/**
+ * The module whose wrapper a structure imports, or undefined when the import is not a wrapper entry.
+ * @param {string} specifier
+ * @returns {string | undefined}
+ */
+export const moduleFromWrapperEntry = specifier => WRAPPER_PACKAGE_IMPORT.exec(specifier)?.[1]

package/src/wrapperSideEffects.js

@@ -0,0 +1,60 @@
+// What an item's `_generated` entry imports before its structure, for the wrappers the structure imports: each
+// component's defaults sheet, and the registration of each viewer service a companion app provider needs. The export
+// writes these lines, and `yarn dev` and `yarn build` rewrite them when the structure changes, so both follow one rule.
+// Kept free of dependencies, like `wrapperImport.js`, so the generator's bundle doesn't take the transforms with it.
+import { posix } from 'node:path'
+import { moduleFromWrapperEntry, wrapperImport } from './wrapperImport.js'
+
+/** The module of the site's own (companion) app. Its providers' viewer services come with the export; other apps' come
+ * with the site's services. */
+export const COMPANION_APP = 'companionApp'
+
+/** Where an export puts the viewer services the companion app's wrapped context providers need, relative to the site
+ * app: each service's bundle and the module that registers it, `<package name>/bundle.js` and `<package name>/index.js`. */
+export const VIEWER_SERVICES_FOLDER = 'src/site/_generated/viewer-services'
+
+/**
+ * @typedef {{ readonly [module: string]: { readonly entries: {
+ *     readonly components?: { readonly [name: string]: unknown },
+ *     readonly contextProviders?: { readonly [name: string]: { readonly services?: readonly string[] } },
+ * } } }} WrapperCatalog the site's component catalog (`site-component-catalog.json`), by module
+ */
+
+/**
+ * The module that registers a viewer service, as an item's `_generated` folder imports it.
+ * @param {string} generatedFolder the item's `_generated` folder, relative to the site app
+ * @param {string} packageName
+ */
+export const viewerServiceImport = (generatedFolder, packageName) => {
+    const path = posix.relative(generatedFolder, `${VIEWER_SERVICES_FOLDER}/${packageName}/index.js`)
+    return path.startsWith('.') ? path : `./${path}`
+}
+
+/**
+ * The side-effect imports of the wrappers an item's structure imports from, once each, in the structure's order: a
+ * component folder's `<folder>/css`, and a companion app provider folder's viewer service registrations. A folder is the
+ * catalog symbol whose `wrapperImport` it is; a function library's folder, or one the catalog doesn't have, brings
+ * nothing.
+ * @param {Iterable<string>} sources the structure's import sources
+ * @param {WrapperCatalog} catalog
+ * @param {string} generatedFolder the item's `_generated` folder, relative to the site app
+ * @returns {string[]}
+ */
+export const wrapperSideEffectImports = (sources, catalog, generatedFolder) => {
+    /** @type {Set<string>} */
+    const imports = new Set()
+    for (const source of sources) {
+        const module = moduleFromWrapperEntry(source)
+        if (!module) continue
+        const { components = {}, contextProviders = {} } = catalog[module]?.entries ?? {}
+        /** @param {string} name */
+        const isFolder = name => wrapperImport({ module, symbol: name }) === source
+        if (Object.keys(components).some(isFolder)) imports.add(`${source}/css`)
+        if (module !== COMPANION_APP) continue
+        const provider = Object.keys(contextProviders).find(isFolder)
+        for (const service of (provider && contextProviders[provider].services) ?? []) {
+            imports.add(viewerServiceImport(generatedFolder, service))
+        }
+    }
+    return [...imports]
+}