import { StateMachine } from 'cs-element';

const element = new CSElement('order');
const stateMachine = element.createStateMachine({
  initialState: 'pending',
  states: {
    pending: { canTransitionTo: ['processing', 'cancelled'] },
    processing: { canTransitionTo: ['completed', 'failed'] },
    completed: { canTransitionTo: [] },
    cancelled: { canTransitionTo: [] },
    failed: { canTransitionTo: ['pending'] }
  },
  transitions: {
    process: { from: 'pending', to: 'processing' },
    complete: { from: 'processing', to: 'completed' },
    cancel: { from: ['pending', 'processing'], to: 'cancelled' },
    fail: { from: 'processing', to: 'failed' },
    retry: { from: 'failed', to: 'pending' }
  }
});

await stateMachine.sendEvent('process');
console.log(stateMachine.currentState); // 'processing'

import { Blueprint, BlueprintManager } from 'cs-element';

const projectBlueprint = new Blueprint({
  id: 'project-template',
  name: 'Project Template',
  parameters: [
    { id: 'name', type: 'string', required: true },
    { id: 'teamSize', type: 'number', default: 5 }
  ],
  generator: async (context) => {
    const project = new CSElement(context.parameters.name);
    
    // Generate team members
    for (let i = 0; i < context.parameters.teamSize; i++) {
      const member = new CSElement(`member-${i}`);
      await member.setData('role', 'developer');
      await project.addElement(member);
    }
    
    return { elements: [project] };
  }
});

const manager = new BlueprintManager();
manager.register(projectBlueprint);

const result = await manager.generate('project-template', {
  name: 'My Project',
  teamSize: 3
});

// Live queries with automatic updates
const liveQuery = CSElement.query()
  .where('status', 'active')
  .where('priority', '>', 5)
  .orderBy('createdAt', 'desc')
  .limit(10)
  .live();

liveQuery.subscribe(results => {
  console.log('Updated results:', results);
});

// Computed properties
const totalValue = CSElement.computed(() => {
  return elements
    .filter(e => e.getData('active'))
    .reduce((sum, e) => sum + e.getData('value'), 0);
});

totalValue.subscribe(value => {
  console.log('Total value:', value);
});

// ACID transactions
await CSElement.transaction(async (tx) => {
  const user = await tx.getElementById('user-1');
  const account = await tx.getElementById('account-1');
  
  const currentBalance = account.getData('balance');
  const transferAmount = 100;
  
  if (currentBalance >= transferAmount) {
    await account.setData('balance', currentBalance - transferAmount);
    await user.setData('credits', user.getData('credits') + transferAmount);
  } else {
    throw new Error('Insufficient funds');
  }
});

import { HistoryManagerImpl } from 'cs-element';

// Configure history tracking
const historyManager = new HistoryManagerImpl({
  maxOperations: 100,
  snapshotInterval: 10,
  autoCleanup: true,
  compression: true
});

// Track operations automatically
const element = new CSElement('document');
await element.setData('title', 'Original Title');

// Manual operation tracking
historyManager.addOperation({
  type: 'update',
  description: 'Changed document title',
  before: { title: 'Original Title' },
  after: { title: 'New Title' },
  canUndo: true,
  canRedo: true
});

// Undo/Redo operations
await historyManager.undo(); // Reverts to 'Original Title'
await historyManager.redo(); // Back to 'New Title'

// Create snapshots
const snapshot = historyManager.createSnapshot(
  element.export(), 
  'Document checkpoint'
);

// History events
historyManager.on('undo-performed', (data) => {
  console.log('Undo performed:', data.operation.description);
});

// Get history state
const state = historyManager.getState();
console.log(`Can undo: ${state.canUndo}, Can redo: ${state.canRedo}`);

import { MigrationBuilder, MigrationManager } from 'cs-element';

// Create migration
const migration = new MigrationBuilder()
  .version('1.1.0')
  .description('Add user preferences')
  .up(async (context) => {
    const users = context.query('user');
    for (const user of users) {
      await user.setData('preferences', {
        theme: 'light',
        notifications: true
      });
    }
  })
  .down(async (context) => {
    const users = context.query('user');
    for (const user of users) {
      await user.deleteData('preferences');
    }
  })
  .build();

const migrationManager = new MigrationManager();
await migrationManager.register(migration);
await migrationManager.migrate('1.1.0');

import { CSElement } from 'cs-element';

// Enable auto-dispose globally
CSElement.configureReactivity({
  autoDispose: true,
  debug: true
});

// Create scope for automatic cleanup
const scope = CSElement.createScope();

CSElement.runInScope(scope.id, () => {
  const parent = CSElement.computed(() => data.value * 2);
  const child1 = CSElement.computed(() => data.value * 2);
  const child2 = CSElement.computed(() => data.value * 3);
  
  return child1.value + child2.value;
});

// Cleanup entire scope
CSElement.disposeScope(scope.id);

import { CSElement, MiddlewarePriority } from 'cs-element';

// Add high-priority validation middleware
CSElement.plugins.addAdvancedMiddleware('setData', {
  name: 'validation-middleware',
  priority: MiddlewarePriority.HIGH,
  condition: (context) => context.args.key === 'email',
  timeout: 1000,
  middleware: async (context, next) => {
    const { key, value } = context.args;
    
    if (key === 'email' && !isValidEmail(value)) {
      throw new Error('Invalid email format');
    }
    
    return await next();
  }
});

// Add logging middleware with metadata
CSElement.plugins.addAdvancedMiddleware('setData', {
  name: 'audit-logger',
  priority: MiddlewarePriority.LOW,
  middleware: async (context, next) => {
    const startTime = Date.now();
    const result = await next();
    
    console.log(`Operation ${context.operation} took ${Date.now() - startTime}ms`);
    return result;
  }
});

import { BatchManager, BatchExecutionStrategy, BatchPriority } from 'cs-element';

const batchManager = new BatchManager();

// Create batch with parallel execution
const batchId = batchManager.createBatch({
  executionStrategy: BatchExecutionStrategy.PARALLEL,
  maxConcurrency: 5,
  errorMode: 'COLLECT_ERRORS'
});

// Add operations with priorities and dependencies
batchManager.addOperation(batchId, {
  id: 'create-users',
  priority: BatchPriority.HIGH,
  execute: async (context) => {
    const users = await createMultipleUsers(userData);
    return users;
  },
  validate: async (context) => ({ valid: true, errors: [] }),
  maxRetries: 3
});

batchManager.addOperation(batchId, {
  id: 'send-notifications',
  priority: BatchPriority.NORMAL,
  dependencies: ['create-users'], // Wait for users to be created
  execute: async (context) => {
    const users = context.previousResults.get('create-users');
    return await sendWelcomeEmails(users);
  }
});

// Execute batch with progress monitoring
const result = await batchManager.executeBatch(batchId);
console.log(`Batch completed: ${result.successCount}/${result.totalOperations}`);

import { VisualizationManager, VisualizationFormat } from 'cs-element';

const visualizer = new VisualizationManager();

// Generate interactive HTML visualization
const htmlViz = await visualizer.visualize(rootElement, {
  format: VisualizationFormat.HTML,
  layout: 'tree',
  interactive: true,
  showData: true,
  animations: true,
  width: 1200,
  height: 800,
  theme: 'dark'
});

// Generate SVG for documentation
const svgViz = await visualizer.visualize(rootElement, {
  format: VisualizationFormat.SVG,
  layout: 'circular',
  nodeStyle: {
    backgroundColor: '#3498db',
    textColor: '#ffffff',
    borderRadius: 8
  },
  edgeStyle: {
    color: '#2c3e50',
    thickness: 2,
    style: 'dashed'
  }
});

// ASCII visualization for console output
const asciiViz = await visualizer.visualize(rootElement, {
  format: VisualizationFormat.ASCII,
  maxDepth: 5,
  showIds: true,
  showIndices: true
});

console.log(asciiViz.content);

import { CSElement } from 'cs-element';

// Configure graph algorithms
CSElement.configureGraphAlgorithms({
  defaultTimeout: 5000,
  enableCaching: true,
  enableEvents: true
});

// Find shortest path between elements
const path = await CSElement.findShortestPath(sourceElement, targetElement, {
  algorithm: 'dijkstra',
  weightFunction: (from, to) => calculateDistance(from, to),
  maxDepth: 10
});

// Detect cycles in the graph
const cycleResult = await CSElement.detectCycles(rootElement, {
  algorithm: 'dfs',
  includeVisualization: true
});

if (cycleResult.hasCycles) {
  console.log(`Found ${cycleResult.cycles.length} cycles`);
  cycleResult.cycles.forEach(cycle => {
    console.log(`Cycle: ${cycle.path.join(' -> ')}`);
  });
}

// Analyze graph connectivity
const components = await CSElement.findConnectedComponents(rootElement);
console.log(`Graph has ${components.componentCount} connected components`);

// Calculate node centrality
const centrality = await CSElement.calculateCentrality(rootElement);
const mostCentralNode = Array.from(centrality.entries())
  .sort(([,a], [,b]) => b - a)[0];
console.log(`Most central node: ${mostCentralNode[0]} (${mostCentralNode[1]})`);

import { DiffEngine, DiffAlgorithm, MergeStrategy } from 'cs-element';

const diffEngine = new DiffEngine();

// Compare elements with different algorithms
const myersDiff = diffEngine.computeDiff(sourceElement, targetElement, {
  algorithm: DiffAlgorithm.MYERS,
  contextLines: 5,
  includeVisualization: true
});

const patienceDiff = diffEngine.computeDiff(sourceElement, targetElement, {
  algorithm: DiffAlgorithm.PATIENCE,
  ignoreWhitespace: true
});

// Three-way merge for conflict resolution
const mergeResult = diffEngine.threeWayMerge(
  baseElement,
  branchAElement,
  branchBElement,
  {
    strategy: MergeStrategy.AUTO,
    conflictResolution: 'auto',
    autoResolveThreshold: 0.8
  }
);

if (mergeResult.success) {
  console.log('Merge completed successfully');
} else {
  console.log(`${mergeResult.conflicts.length} conflicts need manual resolution`);
  mergeResult.conflicts.forEach(conflict => {
    console.log(`Conflict at ${conflict.path.join('.')}: ${conflict.type}`);
  });
}

import { TypedElementManager, TypedElement } from 'cs-element';

const manager = new TypedElementManager();

// Define base schema
const baseSchema = {
  name: 'BaseEntity',
  version: '1.0.0',
  fields: [
    { name: 'id', type: 'number', required: true },
    { name: 'createdAt', type: 'date', defaultValue: () => new Date() },
    { name: 'updatedAt', type: 'date', nullable: true }
  ]
};

// Define inherited schema
const userSchema = manager.createInheritedSchema(
  'User',
  '1.0.0',
  'BaseEntity',
  [
    { name: 'email', type: 'string', required: true, validation: isValidEmail },
    { name: 'name', type: 'string', required: true },
    { name: 'role', type: 'enum', values: ['user', 'admin'], defaultValue: 'user' }
  ]
);

manager.registerSchema(baseSchema);
manager.registerSchema(userSchema);

// Create typed element
const user = await manager.createElement('User', {
  id: 1,
  email: 'john@example.com',
  name: 'John Doe',
  role: 'admin'
});

// Type-safe field access
const email: string = user.getField('email');
await user.setField('role', 'user'); // Type-checked

import { services } from 'cs-element';

// Access built-in services
const persistenceManager = services.persistence;
const reactivityManager = services.reactivity;
const historyManager = services.history;

// Configure services
services.configureHistory({
  maxHistorySize: 1000,
  enableCompression: true,
  autoSnapshot: true,
  snapshotInterval: 5000
});

services.configureReactivity({
  autoDispose: true,
  debug: false,
  warnMemoryLeaks: true,
  maxComputedDepth: 50
});

// Access global element registry
const allElements = services.registry.getAllElements();
const userElements = services.registry.getElementsByName('User');
const specificElement = services.registry.getElementById('element-123');

import { useCSElement } from 'cs-element/react';

function MyComponent() {
  const { 
    root, 
    createElement, 
    query, 
    connected, 
    stats 
  } = useCSElement({
    autoConnect: true,
    enableReactivity: true,
    enablePersistence: true
  });

  const handleCreateUser = () => {
    const user = createElement('user', {
      name: 'New User',
      email: 'user@example.com'
    });
  };

  const users = query('user[active=true]');

  return (
    <div>
      <h1>Users ({stats.elementCount})</h1>
      <button onClick={handleCreateUser}>Add User</button>
      {users.map(user => (
        <div key={user.id}>{user.getData('name')}</div>
      ))}
    </div>
  );
}