@flowgram.ai/form-materials 0.4.9 → 0.4.11

package/src/index.ts

@@ -3,11 +3,104 @@
  * SPDX-License-Identifier: MIT
  */
 
-export * from './components';
-export * from './effects';
-export * from './shared';
-export * from './typings';
-export * from './form-plugins';
-export * from './plugins';
-export * from './validate';
-export * from './hooks';
+export {
+  AssignRow,
+  AssignRows,
+  BatchOutputs,
+  BatchVariableSelector,
+  BlurInput,
+  CodeEditor,
+  CodeEditorMini,
+  ConditionRow,
+  ConstantInput,
+  DBConditionRow,
+  DisplayFlowValue,
+  DisplayInputsValueAllInTag,
+  DisplayInputsValues,
+  DisplayOutputs,
+  DisplaySchemaTag,
+  DisplaySchemaTree,
+  DynamicValueInput,
+  InjectDynamicValueInput,
+  InjectTypeSelector,
+  InjectVariableSelector,
+  InputsValues,
+  InputsValuesTree,
+  JsonEditorWithVariables,
+  JsonSchemaEditor,
+  PromptEditor,
+  PromptEditorWithInputs,
+  PromptEditorWithVariables,
+  TypeSelector,
+  VariableSelector,
+  VariableSelectorProvider,
+  EditorVariableTagInject,
+  EditorVariableTree,
+  EditorInputsTree,
+  getTypeSelectValue,
+  parseTypeSelectValue,
+  type AssignValueType,
+  type CodeEditorPropsType,
+  type ConditionRowValueType,
+  type ConstantInputStrategy,
+  type DBConditionOptionType,
+  type DBConditionRowValueType,
+  type JsonEditorWithVariablesProps,
+  type PromptEditorPropsType,
+  type PromptEditorWithInputsProps,
+  type PromptEditorWithVariablesProps,
+  type TypeSelectorProps,
+  type VariableSelectorProps,
+  useVariableTree,
+} from './components';
+export {
+  autoRenameRefEffect,
+  listenRefSchemaChange,
+  listenRefValueChange,
+  provideBatchInputEffect,
+  provideJsonSchemaOutputs,
+  syncVariableTitle,
+  validateWhenVariableSync,
+} from './effects';
+export {
+  createBatchOutputsFormPlugin,
+  createInferAssignPlugin,
+  createInferInputsPlugin,
+  provideBatchOutputsEffect,
+} from './form-plugins';
+export { useObjectList } from './hooks';
+export {
+  JsonSchemaTypePresetProvider,
+  JsonSchemaUtils,
+  createDisableDeclarationPlugin,
+  createTypePresetPlugin,
+  type ConstantRendererProps,
+  type IJsonSchema,
+  type JsonSchemaBasicType,
+  type JsonSchemaTypeRegistry,
+  useTypeManager,
+} from './plugins';
+export {
+  FlowValueUtils,
+  createInjectMaterial,
+  formatLegacyRefOnInit,
+  formatLegacyRefOnSubmit,
+  formatLegacyRefToNewRef,
+  formatNewRefToLegacyRef,
+  isLegacyFlowRefValueSchema,
+  isNewFlowRefValueSchema,
+  lazySuspense,
+  polyfillCreateRoot,
+  type FlowValueType,
+  type IFlowConstantRefValue,
+  type IFlowConstantValue,
+  type IFlowExpressionValue,
+  type IFlowRefValue,
+  type IFlowTemplateValue,
+  type IFlowValue,
+  type IFlowValueExtra,
+  type IPolyfillRoot,
+  unstableSetCreateRoot,
+  withSuspense,
+} from './shared';
+export { validateFlowValue } from './validate';

package/src/plugins/index.ts

@@ -3,5 +3,14 @@
  * SPDX-License-Identifier: MIT
  */
 
-export * from './json-schema-preset';
-export * from './disable-declaration-plugin';
+export { createDisableDeclarationPlugin } from './disable-declaration-plugin';
+export {
+  JsonSchemaTypePresetProvider,
+  JsonSchemaUtils,
+  createTypePresetPlugin,
+  type ConstantRendererProps,
+  type IJsonSchema,
+  type JsonSchemaBasicType,
+  type JsonSchemaTypeRegistry,
+  useTypeManager,
+} from './json-schema-preset';

package/src/plugins/json-schema-preset/index.tsx

@@ -33,9 +33,9 @@ export {
   createTypePresetPlugin,
   useTypeManager,
   JsonSchemaTypePresetProvider,
-  IJsonSchema,
   JsonSchemaUtils,
-  JsonSchemaTypeRegistry,
-  ConstantRendererProps,
-  JsonSchemaBasicType,
+  type IJsonSchema,
+  type JsonSchemaTypeRegistry,
+  type ConstantRendererProps,
+  type JsonSchemaBasicType,
 };

package/src/shared/flow-value/index.ts

@@ -3,4 +3,14 @@
  * SPDX-License-Identifier: MIT
  */
 
-export * from './utils';
+export { FlowValueUtils } from './utils';
+export {
+  type IFlowValueExtra,
+  type FlowValueType,
+  type IFlowValue,
+  type IFlowConstantValue,
+  type IFlowRefValue,
+  type IFlowExpressionValue,
+  type IFlowTemplateValue,
+  type IFlowConstantRefValue,
+} from './types';

package/src/shared/flow-value/utils.ts

@@ -15,8 +15,7 @@ import {
   IFlowValue,
   IFlowConstantRefValue,
   FlowValueType,
-} from '@/typings';
-
+} from './types';
 import { constantSchema, refSchema, expressionSchema, templateSchema } from './schema';
 
 export namespace FlowValueUtils {

package/src/shared/index.ts

@@ -3,8 +3,29 @@
  * SPDX-License-Identifier: MIT
  */
 
-export * from './format-legacy-refs';
-export * from './inject-material';
-export * from './flow-value';
-export * from './polyfill-create-root';
-export * from './lazy-suspense';
+export {
+  FlowValueUtils,
+  type FlowValueType,
+  type IFlowConstantRefValue,
+  type IFlowConstantValue,
+  type IFlowExpressionValue,
+  type IFlowRefValue,
+  type IFlowTemplateValue,
+  type IFlowValue,
+  type IFlowValueExtra,
+} from './flow-value';
+export {
+  formatLegacyRefOnInit,
+  formatLegacyRefOnSubmit,
+  formatLegacyRefToNewRef,
+  formatNewRefToLegacyRef,
+  isLegacyFlowRefValueSchema,
+  isNewFlowRefValueSchema,
+} from './format-legacy-refs';
+export { createInjectMaterial } from './inject-material';
+export { lazySuspense, withSuspense } from './lazy-suspense';
+export {
+  polyfillCreateRoot,
+  unstableSetCreateRoot,
+  type IPolyfillRoot,
+} from './polyfill-create-root';

package/src/shared/inject-material/index.tsx

@@ -11,6 +11,8 @@ import {
   usePlaygroundContainer,
 } from '@flowgram.ai/editor';
 
+type WithRenderKey<T> = T & { renderKey?: string };
+
 /**
  * Creates a material component wrapper with dependency injection support
  *
@@ -48,12 +50,15 @@ import {
  * @returns Wrapper component with dependency injection support
  */
 export function createInjectMaterial<Props>(
-  Component: React.FC<Props> & { renderKey?: string },
+  Component: WithRenderKey<React.FC<Props> | React.ExoticComponent<Props>>,
   params?: {
     renderKey?: string;
   }
-): React.FC<Props> {
-  const InjectComponent: React.FC<Props> = (props) => {
+): WithRenderKey<React.FC<Props>> {
+  // Determine render key: prioritize param specified, then component renderKey, finally component name
+  const renderKey = params?.renderKey || Component.renderKey || Component.name || '';
+
+  const InjectComponent: WithRenderKey<React.FC<Props>> = (props) => {
     const container = usePlaygroundContainer();
 
     // Check if renderer registry is bound in container
@@ -65,9 +70,6 @@ export function createInjectMaterial<Props>(
     // Get renderer registry instance
     const rendererRegistry = container.get(FlowRendererRegistry);
 
-    // Determine render key: prioritize param specified, then component renderKey, finally component name
-    const renderKey = params?.renderKey || Component.renderKey || Component.name || '';
-
     // Get corresponding renderer from registry
     const renderer = rendererRegistry.tryToGetRendererComponent(renderKey);
 
@@ -83,5 +85,7 @@ export function createInjectMaterial<Props>(
     });
   };
 
+  InjectComponent.renderKey = renderKey;
+
   return InjectComponent;
 }

package/src/validate/index.ts

@@ -0,0 +1,6 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+export { validateFlowValue } from './validate-flow-value';

package/src/validate/validate-flow-value/index.tsx

@@ -6,7 +6,7 @@
 import { isNil } from 'lodash-es';
 import { FeedbackLevel, FlowNodeEntity, getNodeScope } from '@flowgram.ai/editor';
 
-import { IFlowValue } from '@/typings';
+import { IFlowValue } from '@/shared';
 import { FlowValueUtils } from '@/shared';
 
 interface Context {

package/bin/index.ts

@@ -1,80 +0,0 @@
-#!/usr/bin/env -S npx tsx@latest
-
-import inquirer from 'inquirer';
-import { Command } from 'commander';
-import chalk from 'chalk';
-
-import { getProjectInfo, installDependencies, ProjectInfo } from './project.js';
-import { copyMaterial, listAllMaterials, Material } from './materials.js';
-
-const program = new Command();
-
-program
-  .version('1.0.1')
-  .description('Add official materials to your project')
-  .argument('[materialName]', 'Optional material name to skip selection (format: type/name)')
-  .action(async (materialName?: string) => {
-    // materialName can be undefined
-    console.log(chalk.bgGreenBright('Welcome to @flowgram.ai/form-materials CLI!'));
-
-    const projectInfo: ProjectInfo = getProjectInfo();
-
-    console.log(chalk.bold('Project Info:'));
-    console.log(chalk.black(`  - Flowgram Version: ${projectInfo.flowgramVersion}`));
-    console.log(chalk.black(`  - Project Path: ${projectInfo.projectPath}`));
-
-    const materials: Material[] = listAllMaterials();
-
-    let material: Material | undefined; // material can be undefined
-
-    // Check if materialName is provided and exists in materials
-    if (materialName) {
-      const selectedMaterial = materials.find((m) => `${m.type}/${m.name}` === materialName);
-      if (selectedMaterial) {
-        material = selectedMaterial;
-        console.log(chalk.green(`Using material: ${materialName}`));
-      } else {
-        console.log(
-          chalk.yellow(`Material "${materialName}" not found. Please select from the list:`)
-        );
-      }
-    }
-
-    // If material not found or materialName not provided, prompt user to select
-    if (!material) {
-      // User select one component
-      const result = await inquirer.prompt<{
-        material: Material; // Specify type for prompt result
-      }>([
-        {
-          type: 'list',
-          name: 'material',
-          message: 'Select one material to add:',
-          choices: [
-            ...materials.map((_material) => ({
-              name: `${_material.type}/${_material.name}`,
-              value: _material,
-            })),
-          ],
-        },
-      ]);
-      material = result.material;
-    }
-    // Ensure material is defined before proceeding
-    if (!material) {
-      console.error(chalk.red('No material selected. Exiting.'));
-      process.exit(1);
-    }
-
-    // 4. Copy the materials to the project
-    console.log(chalk.bold('The following materials will be added to your project'));
-    console.log(material);
-    let { packagesToInstall } = copyMaterial(material, projectInfo);
-
-    // 4. Install the dependencies
-    console.log(chalk.bold('These npm dependencies will be added to your project'));
-    console.log(packagesToInstall);
-    installDependencies(packagesToInstall, projectInfo);
-  });
-
-program.parse(process.argv);

package/bin/materials.ts

@@ -1,134 +0,0 @@
-/**
- * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
- * SPDX-License-Identifier: MIT
- */
-
-import { fileURLToPath } from 'url';
-import path from 'path';
-import fs from 'fs';
-
-import { traverseRecursiveFiles } from './utils/traverse-file';
-import { replaceImport, traverseFileImports } from './utils/import';
-import { ProjectInfo } from './project'; // Import ProjectInfo
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-
-// Added type definitions
-export interface Material {
-  name: string;
-  type: string;
-  path: string;
-  [key: string]: any; // For other properties from config.json
-}
-
-const _types: string[] = [
-  'components',
-  'effects',
-  'plugins',
-  'shared',
-  'typings',
-  'validate',
-  'form-plugins',
-  'hooks',
-];
-
-export function listAllMaterials(): Material[] {
-  const _materials: Material[] = [];
-
-  for (const _type of _types) {
-    // 在 Node.js 中，import.meta.dirname 不可用，可使用 import.meta.url 结合 url 模块来获取目录路径
-
-    const materialsPath: string = path.join(__dirname, '..', 'src', _type);
-    _materials.push(
-      ...fs
-        .readdirSync(materialsPath)
-        .map((_path: string) => {
-          if (_path === 'index.ts') {
-            return null;
-          }
-
-          return {
-            name: _path, // Assuming the folder name is the material name
-            type: _type,
-            path: path.join(materialsPath, _path),
-          } as Material;
-        })
-        .filter((material): material is Material => material !== null)
-    );
-  }
-
-  return _materials;
-}
-
-export const getFormMaterialDependencies = (): Record<string, string> => {
-  const packageJsonPath: string = path.join(__dirname, '..', 'package.json');
-  const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
-
-  return packageJson.dependencies;
-};
-
-export const copyMaterial = (
-  material: Material,
-  projectInfo: ProjectInfo
-): {
-  packagesToInstall: string[];
-} => {
-  const formMaterialDependencies = getFormMaterialDependencies();
-
-  const sourceDir: string = material.path;
-  const materialRoot: string = path.join(
-    projectInfo.projectPath,
-    'src',
-    'form-materials',
-    `${material.type}`
-  );
-  const targetDir = path.join(materialRoot, material.name);
-  const packagesToInstall: Set<string> = new Set();
-
-  fs.cpSync(sourceDir, targetDir, { recursive: true });
-
-  for (const file of traverseRecursiveFiles(targetDir)) {
-    if (['.ts', '.tsx'].includes(file.suffix)) {
-      for (const importDeclaration of traverseFileImports(file.content)) {
-        const { source } = importDeclaration;
-
-        if (source.startsWith('@/')) {
-          // is inner import
-          console.log(`Replace Import from ${source} to @flowgram.ai/form-materials`);
-          file.replace((content) =>
-            replaceImport(content, importDeclaration, [
-              { ...importDeclaration, source: '@flowgram.ai/form-materials' },
-            ])
-          );
-          if (projectInfo.flowgramVersion !== 'workspace:*') {
-            packagesToInstall.add(`@flowgram.ai/form-materials@${projectInfo.flowgramVersion}`);
-            continue;
-          }
-          packagesToInstall.add('@flowgram.ai/form-materials');
-        } else if (!source.startsWith('.') && !source.startsWith('react')) {
-          // check if is in form material dependencies
-          const [dep, version] =
-            Object.entries(formMaterialDependencies).find(([_key]) => source.startsWith(_key)) ||
-            [];
-          if (!dep) {
-            continue;
-          }
-          if (version === 'workspace:*') {
-            if (projectInfo.flowgramVersion !== 'workspace:*') {
-              packagesToInstall.add(`${dep}@${projectInfo.flowgramVersion}`);
-            } else {
-              packagesToInstall.add(dep);
-            }
-          } else {
-            packagesToInstall.add(`${dep}@${version}`);
-          }
-        }
-      }
-    }
-  }
-
-  return {
-    packagesToInstall: [...packagesToInstall],
-  };
-};

package/bin/project.ts

@@ -1,95 +0,0 @@
-/**
- * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
- * SPDX-License-Identifier: MIT
- */
-
-import path from 'path';
-import fs from 'fs';
-import { execSync } from 'child_process';
-
-// Added type definitions
-interface PackageJson {
-  dependencies: { [key: string]: string };
-  devDependencies?: { [key: string]: string };
-  peerDependencies?: { [key: string]: string };
-  [key: string]: any;
-}
-
-export interface ProjectInfo {
-  projectPath: string;
-  packageJsonPath: string;
-  packageJson: PackageJson;
-  flowgramVersion: string;
-}
-
-export function getProjectInfo(): ProjectInfo {
-  // get nearest package.json
-  let projectPath: string = process.cwd();
-
-  while (projectPath !== '/' && !fs.existsSync(path.join(projectPath, 'package.json'))) {
-    projectPath = path.join(projectPath, '..');
-  }
-
-  if (projectPath === '/') {
-    throw new Error('Please run this command in a valid project');
-  }
-
-  const packageJsonPath: string = path.join(projectPath, 'package.json');
-  const packageJson: PackageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
-
-  // fixed layout or free layout
-  const flowgramVersion: string | undefined =
-    packageJson.dependencies['@flowgram.ai/fixed-layout-editor'] ||
-    packageJson.dependencies['@flowgram.ai/free-layout-editor'] ||
-    packageJson.dependencies['@flowgram.ai/editor'];
-
-  if (!flowgramVersion) {
-    throw new Error(
-      'Please install @flowgram.ai/fixed-layout-editor or @flowgram.ai/free-layout-editor'
-    );
-  }
-
-  return {
-    projectPath,
-    packageJsonPath,
-    packageJson,
-    flowgramVersion, // TypeScript will ensure this is string due to the check above
-  };
-}
-
-export function findRushJson(startPath: string): string | null {
-  let currentPath: string = startPath;
-  while (currentPath !== '/' && !fs.existsSync(path.join(currentPath, 'rush.json'))) {
-    currentPath = path.join(currentPath, '..');
-  }
-  if (fs.existsSync(path.join(currentPath, 'rush.json'))) {
-    return path.join(currentPath, 'rush.json');
-  }
-  return null;
-}
-
-export function installDependencies(packages: string[], projectInfo: ProjectInfo): void {
-  if (fs.existsSync(path.join(projectInfo.projectPath, 'yarn.lock'))) {
-    console.log(`yarn add ${packages.join(' ')}`);
-    execSync(`yarn add ${packages.join(' ')}`, { stdio: 'inherit' });
-    return;
-  }
-
-  if (fs.existsSync(path.join(projectInfo.projectPath, 'pnpm-lock.yaml'))) {
-    console.log(`pnpm add ${packages.join(' ')}`);
-    execSync(`pnpm add ${packages.join(' ')}`, { stdio: 'inherit' });
-    return;
-  }
-
-  //  rush monorepo
-  if (findRushJson(projectInfo.projectPath)) {
-    console.log(`rush add ${packages.map((pkg) => `--package ${pkg}`).join(' ')}`);
-    execSync(`rush add ${packages.map((pkg) => `--package ${pkg}`).join(' ')}`, {
-      stdio: 'inherit',
-    });
-    return;
-  }
-
-  console.log(`npm install ${packages.join(' ')}`);
-  execSync(`npm install ${packages.join(' ')}`, { stdio: 'inherit' });
-}