@intrig/plugin-react 0.0.2-2 → 0.0.2-4

package/dist/index.cjs

@@ -44,8 +44,10 @@ class InternalGeneratorContext {
     }
 }
 
-function packageJsonTemplate() {
-    const packageJson = fsx__namespace.readJsonSync(path__namespace.resolve('..', '..', 'package.json'));
+function packageJsonTemplate(ctx) {
+    var _ctx_rootDir;
+    const projectDir = (_ctx_rootDir = ctx.rootDir) != null ? _ctx_rootDir : process.cwd();
+    const packageJson = fsx__namespace.readJsonSync(path__namespace.resolve(projectDir, 'package.json'));
     const json = pluginSdk.jsonLiteral(path__namespace.resolve('package.json'));
     var _packageJson_devDependencies_typescript;
     return json`
@@ -1433,6 +1435,72 @@ export function getAxiosInstance(key: string) {
 `;
 }
 
+function flushSyncUtilTemplate(ctx) {
+    var _packageJson_dependencies, _packageJson_devDependencies, _packageJson_peerDependencies;
+    const ts = pluginSdk.typescript(path__namespace.resolve('src', 'utils', 'flush-sync.ts'));
+    var _ctx_rootDir;
+    const projectDir = (_ctx_rootDir = ctx.rootDir) != null ? _ctx_rootDir : process.cwd();
+    const packageJson = fsx__namespace.readJsonSync(path__namespace.resolve(projectDir, 'package.json'));
+    // Check if react-dom is available at generation time
+    const hasReactDom = !!(((_packageJson_dependencies = packageJson.dependencies) == null ? void 0 : _packageJson_dependencies['react-dom']) || ((_packageJson_devDependencies = packageJson.devDependencies) == null ? void 0 : _packageJson_devDependencies['react-dom']) || ((_packageJson_peerDependencies = packageJson.peerDependencies) == null ? void 0 : _packageJson_peerDependencies['react-dom']));
+    if (hasReactDom) {
+        // Generate DOM-compatible version
+        return ts`/**
+ * Platform-compatible flushSync utility
+ * 
+ * This utility provides flushSync functionality for React DOM environments.
+ * Uses the native flushSync from react-dom for synchronous updates.
+ */
+
+import { flushSync as reactDomFlushSync } from 'react-dom';
+
+/**
+ * Cross-platform flushSync implementation
+ * 
+ * Forces React to flush any pending updates synchronously.
+ * Uses react-dom's native flushSync implementation.
+ * 
+ * @param callback - The callback to execute synchronously
+ */
+export const flushSync = reactDomFlushSync;
+
+/**
+ * Check if we're running in a DOM environment
+ * Always true when react-dom is available
+ */
+export const isDOMEnvironment = true;
+`;
+    } else {
+        // Generate React Native/non-DOM version
+        return ts`/**
+ * Platform-compatible flushSync utility
+ * 
+ * This utility provides flushSync functionality for React Native and other non-DOM environments.
+ * In React Native, we don't have the same concurrent rendering concerns,
+ * so we execute the callback immediately.
+ */
+
+/**
+ * Cross-platform flushSync implementation
+ * 
+ * Forces React to flush any pending updates synchronously.
+ * In React Native, executes the callback immediately.
+ * 
+ * @param callback - The callback to execute synchronously
+ */
+export const flushSync = (callback: () => void) => {
+  callback();
+};
+
+/**
+ * Check if we're running in a DOM environment
+ * Always false when react-dom is not available
+ */
+export const isDOMEnvironment = false;
+`;
+    }
+}
+
 function providerMainTemplate(apisToSync) {
     const ts = pluginSdk.typescript(path__namespace.resolve("src", "intrig-provider-main.tsx"));
     return ts`// Re-export all provider functionality from modular templates
@@ -1895,7 +1963,7 @@ import {
 } from './network-state';
 import { Axios, AxiosResponse, isAxiosError } from 'axios';
 import { ZodError, ZodSchema } from 'zod';
-import { flushSync } from 'react-dom';
+import { flushSync } from './utils/flush-sync';
 import { createParser } from 'eventsource-parser';
 
 import { Context, RequestType, GlobalState } from './intrig-context';
@@ -3114,7 +3182,7 @@ function handleComplexSchema(schema, imports) {
 
 async function generateCode(ctx) {
     // Root/project files
-    await ctx.dump(packageJsonTemplate());
+    await ctx.dump(packageJsonTemplate(ctx));
     await ctx.dump(reactTsConfigTemplate());
     await ctx.dump(reactSwcrcTemplate());
     // Top-level src files
@@ -3126,6 +3194,7 @@ async function generateCode(ctx) {
     await ctx.dump(reactMediaTypeUtilsTemplate());
     await ctx.dump(typeUtilsTemplate());
     await ctx.dump(intrigMiddlewareTemplate());
+    await ctx.dump(flushSyncUtilTemplate(ctx));
     // Provider modular files (placed under src)
     await ctx.dump(providerMainTemplate(ctx.sources));
     await ctx.dump(providerHooksTemplate());
@@ -3422,7 +3491,7 @@ Expose play/pause UI for long streams or admin tools.
 import { use${pluginSdk.pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
 import { isPending, isSuccess, isError } from '@intrig/react';
 import { useEffect, useState } from 'react';
-import { flushSync } from 'react-dom';
+import { flushSync } from '../utils/flush-sync';
 
 function MyComponent() {
   const [${respVar}, ${actionName}] = use${pluginSdk.pascalCase(descriptor.name)}({ clearOnUnmount: true });
@@ -4247,7 +4316,8 @@ function createPlugin() {
             return {
                 name: 'intrig-binding',
                 version: '0.0.1',
-                compat: '^0.0.15'
+                compat: '^0.0.15',
+                generator: 'react'
             };
         },
         generate: generateCode,

package/dist/index.js

@@ -20,8 +20,10 @@ class InternalGeneratorContext {
     }
 }
 
-function packageJsonTemplate() {
-    const packageJson = fsx.readJsonSync(path.resolve('..', '..', 'package.json'));
+function packageJsonTemplate(ctx) {
+    var _ctx_rootDir;
+    const projectDir = (_ctx_rootDir = ctx.rootDir) != null ? _ctx_rootDir : process.cwd();
+    const packageJson = fsx.readJsonSync(path.resolve(projectDir, 'package.json'));
     const json = jsonLiteral(path.resolve('package.json'));
     var _packageJson_devDependencies_typescript;
     return json`
@@ -1409,6 +1411,72 @@ export function getAxiosInstance(key: string) {
 `;
 }
 
+function flushSyncUtilTemplate(ctx) {
+    var _packageJson_dependencies, _packageJson_devDependencies, _packageJson_peerDependencies;
+    const ts = typescript(path.resolve('src', 'utils', 'flush-sync.ts'));
+    var _ctx_rootDir;
+    const projectDir = (_ctx_rootDir = ctx.rootDir) != null ? _ctx_rootDir : process.cwd();
+    const packageJson = fsx.readJsonSync(path.resolve(projectDir, 'package.json'));
+    // Check if react-dom is available at generation time
+    const hasReactDom = !!(((_packageJson_dependencies = packageJson.dependencies) == null ? void 0 : _packageJson_dependencies['react-dom']) || ((_packageJson_devDependencies = packageJson.devDependencies) == null ? void 0 : _packageJson_devDependencies['react-dom']) || ((_packageJson_peerDependencies = packageJson.peerDependencies) == null ? void 0 : _packageJson_peerDependencies['react-dom']));
+    if (hasReactDom) {
+        // Generate DOM-compatible version
+        return ts`/**
+ * Platform-compatible flushSync utility
+ * 
+ * This utility provides flushSync functionality for React DOM environments.
+ * Uses the native flushSync from react-dom for synchronous updates.
+ */
+
+import { flushSync as reactDomFlushSync } from 'react-dom';
+
+/**
+ * Cross-platform flushSync implementation
+ * 
+ * Forces React to flush any pending updates synchronously.
+ * Uses react-dom's native flushSync implementation.
+ * 
+ * @param callback - The callback to execute synchronously
+ */
+export const flushSync = reactDomFlushSync;
+
+/**
+ * Check if we're running in a DOM environment
+ * Always true when react-dom is available
+ */
+export const isDOMEnvironment = true;
+`;
+    } else {
+        // Generate React Native/non-DOM version
+        return ts`/**
+ * Platform-compatible flushSync utility
+ * 
+ * This utility provides flushSync functionality for React Native and other non-DOM environments.
+ * In React Native, we don't have the same concurrent rendering concerns,
+ * so we execute the callback immediately.
+ */
+
+/**
+ * Cross-platform flushSync implementation
+ * 
+ * Forces React to flush any pending updates synchronously.
+ * In React Native, executes the callback immediately.
+ * 
+ * @param callback - The callback to execute synchronously
+ */
+export const flushSync = (callback: () => void) => {
+  callback();
+};
+
+/**
+ * Check if we're running in a DOM environment
+ * Always false when react-dom is not available
+ */
+export const isDOMEnvironment = false;
+`;
+    }
+}
+
 function providerMainTemplate(apisToSync) {
     const ts = typescript(path.resolve("src", "intrig-provider-main.tsx"));
     return ts`// Re-export all provider functionality from modular templates
@@ -1871,7 +1939,7 @@ import {
 } from './network-state';
 import { Axios, AxiosResponse, isAxiosError } from 'axios';
 import { ZodError, ZodSchema } from 'zod';
-import { flushSync } from 'react-dom';
+import { flushSync } from './utils/flush-sync';
 import { createParser } from 'eventsource-parser';
 
 import { Context, RequestType, GlobalState } from './intrig-context';
@@ -3090,7 +3158,7 @@ function handleComplexSchema(schema, imports) {
 
 async function generateCode(ctx) {
     // Root/project files
-    await ctx.dump(packageJsonTemplate());
+    await ctx.dump(packageJsonTemplate(ctx));
     await ctx.dump(reactTsConfigTemplate());
     await ctx.dump(reactSwcrcTemplate());
     // Top-level src files
@@ -3102,6 +3170,7 @@ async function generateCode(ctx) {
     await ctx.dump(reactMediaTypeUtilsTemplate());
     await ctx.dump(typeUtilsTemplate());
     await ctx.dump(intrigMiddlewareTemplate());
+    await ctx.dump(flushSyncUtilTemplate(ctx));
     // Provider modular files (placed under src)
     await ctx.dump(providerMainTemplate(ctx.sources));
     await ctx.dump(providerHooksTemplate());
@@ -3398,7 +3467,7 @@ Expose play/pause UI for long streams or admin tools.
 import { use${pascalCase(descriptor.name)} } from '@intrig/react/${descriptor.path}/client';
 import { isPending, isSuccess, isError } from '@intrig/react';
 import { useEffect, useState } from 'react';
-import { flushSync } from 'react-dom';
+import { flushSync } from '../utils/flush-sync';
 
 function MyComponent() {
   const [${respVar}, ${actionName}] = use${pascalCase(descriptor.name)}({ clearOnUnmount: true });
@@ -4223,7 +4292,8 @@ function createPlugin() {
             return {
                 name: 'intrig-binding',
                 version: '0.0.1',
-                compat: '^0.0.15'
+                compat: '^0.0.15',
+                generator: 'react'
             };
         },
         generate: generateCode,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@intrig/plugin-react",
-  "version": "0.0.2-2",
+  "version": "0.0.2-4",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -15,7 +15,7 @@
     }
   },
   "dependencies": {
-    "@intrig/plugin-sdk": "^0.0.2-2",
+    "@intrig/plugin-sdk": "^0.0.2-4",
     "@swc/helpers": "~0.5.11"
   },
   "files": [