superLeap-features v1.0.58

Installation & Usage

For React/Vue/Angular Apps (Module Import)

Installation

# Via npm
npm install superleap-features

# Via yarn
yarn add superleap-features

Import Guide

This package is designed to be tree-shakable. Import only what you need using the subpath imports below.

📦 Available Imports

1. Forms - Automation Types and Utils ✅ Recommended

// Automation types
import type { ComponentLocation } from 'superleap-features/automation';

// Automation utilities
import type { executeFunction } from 'superleap-features/automation';

2. Forms - Automation Node Handlers ✅ Recommended

// Form, field, and utility handlers
import {
  handleFormOnLoad,
  handleFormOnSubmit,
  handleFieldOnChange,
  handleSendHttpRequest,
  handleParseJson
} from 'superleap-features/automation/handlers';

2a. Forms - Mobile Automation Node Handlers ✅ For React Native

// Mobile-specific handlers for React Native apps
import {
  handleFrontendExecuteFunctionMob,
  handleScriptTriggerMob,
  setGlobalCodeExecutor
} from 'superleap-features/automation/handlersMob';

3. Forms - CodeEditor Types and Utils ✅ Recommended

// CodeEditor utilities
import { editorUtilityFunctions } from 'superleap-features/automation/codeEditor';

// CodeEditor Types (base, element, layout, media)
import {BaseComponentInstance } from 'superleap-features/automation/codeEditor';

4. Forms - CodeEditor Instance Utils ✅ Recommended

// CodeEditor InstanceUtils (base, element, layout, media)
import { createAudioRecordingInstance } from 'superleap-features/automation/codeEditor/instanceUtils';

4. Forms - Form Types and Utils ✅ Recommended

// Form types and Utils
import { SubmitButtonType, getAllFieldInstances } from 'superleap-features/form';

5. Forms - Form Actions ✅ Recommended

// Granular form actions
import { createAddActions, createGetterActions } from 'superleap-features/form/actions';

6. Workflows Module ✅ Recommended

// Workflow utilities
import {
  executeWorkflow,
  validateWorkflowNode
} from 'superleap-features/workflows';

// Workflow types
import {
  WorkFlowNode,
  ExecutedInOut,
  ValidationError
} from 'superleap-features/workflows';

7. Global Types & Enums ✅ Recommended

// Global types, enums, and utilities
import {
  ErrorCodes,
  DataType,
  FieldType,
  ComponentType,
  AccessLevel,
  Operators,
  ButtonVariant,
  ActionTypeSlug,
  ViewType
} from 'superleap-features';

🎯 Usage Examples

Example 1: Form Automation

import { handleFormOnLoad, handleFieldOnChange } from 'superleap-features/automation/handlers';
import { SubmitButtonType, getAllFieldInstances } from 'superleap-features/form';

const formStore: FormStore = { /* ... */ };

// Handle form load event
const result = handleFormOnLoad(formStore);

// Handle field change
handleFieldOnChange(formStore, 'fieldId', newValue);

Example 1a: React Native Form Automation

import { 
  handleFrontendExecuteFunctionMob,
  setGlobalCodeExecutor
} from 'superleap-features/automation/handlersMob';

// IMPORTANT: Set up custom code executor in your React Native app initialization
// This is required because React Native's Metro bundler restricts eval() in node_modules
// Add this in your app's entry point (e.g., App.tsx or index.js)
setGlobalCodeExecutor((code: string) => {
  // Use eval directly in your app code (not from node_modules)
  // This works because Metro allows eval in app code but not in bundled packages
  return eval(`(function() { ${code} })`);
});

// Now you can use the mobile handlers
const result = await handleFrontendExecuteFunctionMob(
  createSuperLeapSDK,
  getSDKInstance,
  node,
  formStore,
  nodesOutput,
  toast
);

🌲 Tree-Shaking Best Practices

1. ✅ DO: Use specific subpath imports

   import { addField } from 'superleap-features/form/actions';

2. ⚠️ AVOID: Importing from main entry when possible

   import { addField } from 'superleap-features'; // imports everything

3. ✅ DO: Import only what you need

   import { handleFormOnLoad } from 'superleap-features/automation/handlers';

4. ✅ DO: Use type imports separately

   import type { FormStore } from 'superleap-features/form';

📁 Package Structure

superleap-features/
├── index.js                          # Main entry (all modules)
├── global.js                         # Global types, enums & utilities
├── automation/                       # Forms automation
│   ├── index.js                     # Automation utils & types
│   ├── handlers/                    # Node handlers
│   │   └── index.js                # Form, field, utility handlers
│   └── codeEditor/                  # Code editor utilities
│       ├── index.js                # Editor utils & types
│       └── instanceUtils/          # Instance utilities
│           └── index.js            # Base, element, layout, media
├── form/                            # Form module
│   ├── index.js                    # Form utils & types
│   └── actions/                    # Form actions
│       └── index.js               # Add, delete, update, validate
└── workflows/                       # Workflows module
    └── index.js                    # Workflow utils & types