### Basic Flutter Code Editor Setup

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Demonstrates the fundamental setup for integrating the CodeEditor widget into a Flutter application. It includes necessary imports, controller initialization with a specific language, and wrapping the CodeField in CodeTheme for styling.

```dart
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:flutter_highlight/themes/monokai-sublime.dart';
import 'package:highlight/languages/java.dart';

void main() {
  runApp(const CodeEditor());
}

final controller = CodeController(
  text: '...', // Initial code
  language: java,
);

class CodeEditor extends StatelessWidget {
  const CodeEditor();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: CodeTheme(
          data: CodeThemeData(styles: monokaiSublimeTheme),
          child: SingleChildScrollView(
            child: CodeField(
              controller: controller,
            ),
          ),
        ),
      ),
    );
  }
}

```

--------------------------------

### Complete Flutter Code Editor Application Example

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

A full Flutter application demonstrating the code editor with dynamic language and theme switching, gutter customization, and analyzer selection. It allows users to switch between Dart, Python, and Java, customize line numbers and folding handles, and apply different themes.

```dart
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:flutter_highlight/themes/monokai-sublime.dart';
import 'package:flutter_highlight/themes/github.dart';
import 'package:highlight/languages/dart.dart';
import 'package:highlight/languages/python.dart';
import 'package:highlight/languages/java.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Code Editor Demo',
      theme: ThemeData.dark(),
      home: const CodeEditorDemo(),
    );
  }
}

class CodeEditorDemo extends StatefulWidget {
  const CodeEditorDemo({super.key});

  @override
  State<CodeEditorDemo> createState() => _CodeEditorDemoState();
}

class _CodeEditorDemoState extends State<CodeEditorDemo> {
  late CodeController _controller;
  Map<String, TextStyle> _currentTheme = monokaiSublimeTheme;
  bool _showLineNumbers = true;
  bool _showFoldingHandles = true;

  @override
  void initState() {
    super.initState באי
    _controller = CodeController(
      text: '''
void main() {
  // Calculate factorial
  int result = factorial(5);
  print('Result: $result');
}

int factorial(int n) {
  if (n <= 1) return 1;
  return n * factorial(n - 1);
}
''',
      language: dart,
      analyzer: DartPadAnalyzer(),
      namedSectionParser: const BracketsStartEndNamedSectionParser(),
    );

    // Fold the first comment
    _controller.foldCommentAtLineZero();
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void _switchLanguage(String lang) {
    setState(() {
      switch (lang) {
        case 'dart':
          _controller.setLanguage(dart, analyzer: DartPadAnalyzer());
          break;
        case 'python':
          _controller.setLanguage(python, analyzer: const DefaultLocalAnalyzer());
          break;
        case 'java':
          _controller.setLanguage(java, analyzer: const DefaultLocalAnalyzer());
          break;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Code Editor'),
        actions: [
          IconButton(
            icon: Icon(_showLineNumbers ? Icons.format_list_numbered : Icons.format_list_numbered_rtl),
            onPressed: () => setState(() => _showLineNumbers = !_showLineNumbers),
          ),
          IconButton(
            icon: Icon(_showFoldingHandles ? Icons.unfold_less : Icons.unfold_more),
            onPressed: () => setState(() => _showFoldingHandles = !_showFoldingHandles),
          ),
          PopupMenuButton<String>(
            onSelected: _switchLanguage,
            itemBuilder: (context) => [
              const PopupMenuItem(value: 'dart', child: Text('Dart')),
              const PopupMenuItem(value: 'python', child: Text('Python')),
              const PopupMenuItem(value: 'java', child: Text('Java')),
            ],
          ),
        ],
      ),
      body: CodeTheme(
        data: CodeThemeData(styles: _currentTheme),
        child: CodeField(
          controller: _controller,
          minLines: 20,
          maxLines: null,
          textStyle: const TextStyle(
            fontFamily: 'monospace',
            fontSize: 14,
          ),
          gutterStyle: GutterStyle(
            showLineNumbers: _showLineNumbers,
            showErrors: true,
            showFoldingHandles: _showFoldingHandles,
          ),
          onChanged: (value) {
            // Handle code changes
          },
        ),
      ),
    );
  }
}

```

--------------------------------

### CMake Installation Rules for Bundled Application

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/CMakeLists.txt

Configures the installation process to create a relocatable bundle. It cleans the build directory, installs the executable, Flutter ICU data, Flutter library, bundled plugin libraries, and assets.

```cmake
# === Installation ===
set(BUILD_BUNDLE_DIR "${PROJECT_BINARY_DIR}/bundle")
if(CMAKE_INSTALL_PREFIX_INITIALIZED_TO_DEFAULT)
  set(CMAKE_INSTALL_PREFIX "${BUILD_BUNDLE_DIR}" CACHE PATH "..." FORCE)
endif()

install(CODE "
  file(REMOVE_RECURSE \"${BUILD_BUNDLE_DIR}/\")
  " COMPONENT Runtime)

set(INSTALL_BUNDLE_DATA_DIR "${CMAKE_INSTALL_PREFIX}/data")
set(INSTALL_BUNDLE_LIB_DIR "${CMAKE_INSTALL_PREFIX}/lib")

install(TARGETS ${BINARY_NAME} RUNTIME DESTINATION "${CMAKE_INSTALL_PREFIX}"
  COMPONENT Runtime)

install(FILES "${FLUTTER_ICU_DATA_FILE}" DESTINATION "${INSTALL_BUNDLE_DATA_DIR}"
  COMPONENT Runtime)

install(FILES "${FLUTTER_LIBRARY}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}"
  COMPONENT Runtime)

foreach(bundled_library ${PLUGIN_BUNDLED_LIBRARIES})
  install(FILES "${bundled_library}"
    DESTINATION "${INSTALL_BUNDLE_LIB_DIR}"
    COMPONENT Runtime)
endforeach(bundled_library)

set(FLUTTER_ASSET_DIR_NAME "flutter_assets")
install(CODE "
  file(REMOVE_RECURSE \"${INSTALL_BUNDLE_DATA_DIR}/${FLUTTER_ASSET_DIR_NAME}\")
  " COMPONENT Runtime)
install(DIRECTORY "${PROJECT_BUILD_DIR}/${FLUTTER_ASSET_DIR_NAME}"
  DESTINATION "${INSTALL_BUNDLE_DATA_DIR}" COMPONENT Runtime)
```

--------------------------------

### Define CMake Minimum Version and Ephemeral Directory

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Sets the minimum required CMake version to 3.10 and defines a variable for the ephemeral build directory. This is a standard CMake setup for project initialization.

```cmake
cmake_minimum_required(VERSION 3.10)

set(EPHEMERAL_DIR "${CMAKE_CURRENT_SOURCE_DIR}/ephemeral")
```

--------------------------------

### Conditional AOT Library Installation (CMake)

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/CMakeLists.txt

This CMake script snippet installs the AOT library only when the build type is not 'Debug'. It specifies the source file, destination directory, and component for the installation.

```cmake
if(NOT CMAKE_BUILD_TYPE MATCHES "Debug")
  install(FILES "${AOT_LIBRARY}" DESTINATION "${INSTALL_BUNDLE_LIB_DIR}"
    COMPONENT Runtime)
endif()
```

--------------------------------

### Manage Code with Named Sections in Dart

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

Demonstrates how to use named sections in Dart code with the flutter_code_editor package. It shows how to define sections using [START name] and [END name] tags, control their visibility, make them read-only, and fold code outside specific sections.

```dart
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:highlight/languages/java.dart';

// Code with named sections using [START name] and [END name] tags
const codeWithSections = '''
class MyClass {
  public static void main(String[] args) {// [START editable_section] 
    int num = 5;
    System.out.println("Result: " + num);
  }// [END editable_section]

  // [START helper_section]
  static int factorial(int n) {
    return n <= 1 ? 1 : n * factorial(n - 1);
  }
  // [END helper_section]
}
''';

final controller = CodeController(
  text: codeWithSections,
  language: java,
  namedSectionParser: const BracketsStartEndNamedSectionParser(),
);

// Make specific sections read-only
controller.readOnlySectionNames = {'helper_section'};

// Show only specific sections (hides everything else)
// This also makes the entire editor read-only
controller.visibleSectionNames = {'editable_section'};

// Clear visible sections to show all code
controller.visibleSectionNames = {};

// Fold everything except specified sections
controller.foldOutsideSections(['editable_section']);

// Access named sections
final sections = controller.code.namedSections;
for (final entry in sections.entries) {
  print('Section "${entry.key}": lines ${entry.value.firstLine}-${entry.value.lastLine}');
}

```

--------------------------------

### Define and Parse Named Sections in Code

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Implement named sections within your source code using special comment tags like '[START section_name]' and '[END section_name]'. Process these sections by providing a named section parser, such as BracketsStartEndNamedSectionParser, to the CodeController. This feature allows for targeted manipulation of code segments and can hide comments containing section tags.

```dart
final text = '''
class MyClass {
    public static void main(String[] args) {// [START section1]
        int num = 5;
        System.out.println("Factorial of " + num + " is " + factorial(5));
    }// [END section1]
}
''';

final controller = CodeController(
  text: text,
  language: java,
  namedSectionParser: const BracketsStartEndNamedSectionParser(), // NEW
);

```

--------------------------------

### Find and Check System Dependencies with PkgConfig

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Uses PkgConfig to find and check for required system libraries: GTK, GLIB, and GIO. This ensures that the necessary development files for these libraries are available before proceeding with the build.

```cmake
# System-level dependencies.
find_package(PkgConfig REQUIRED)
pkg_check_modules(GTK REQUIRED IMPORTED_TARGET gtk+-3.0)
pkg_check_modules(GLIB REQUIRED IMPORTED_TARGET glib-2.0)
pkg_check_modules(GIO REQUIRED IMPORTED_TARGET gio-2.0)
```

--------------------------------

### Flutter Code Editor: CodeController Initialization and Manipulation (Dart)

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

Demonstrates how to initialize and manipulate the `CodeController` for syntax highlighting, code folding, and text operations. It supports dynamic language changes and provides access to both visible and full text content. Ensure `flutter_code_editor` and `highlight` packages are included.

```dart
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:highlight/languages/java.dart';

// Create a basic code controller
final controller = CodeController(
  text: '''
class MyClass {
  static int factorial(int n) {
    if (n == 0) {
      return 1;
    }
    return n * factorial(n - 1);
  }

  public static void main(String[] args) {
    int num = 5;
    System.out.println("Factorial of " + num + " is " + factorial(5));
  }
}
''',
  language: java,
);

// Access and manipulate text
print(controller.text);        // Returns visible text (excluding folded blocks)
print(controller.fullText);    // Returns entire text including folded/hidden sections

// Set text programmatically
controller.fullText = 'new code here';

// Cursor and selection manipulation
controller.setCursor(10);                    // Set cursor to position 10
controller.insertStr('inserted text');       // Insert text at current selection
controller.removeChar();                     // Remove character before cursor
controller.removeSelection();                // Remove selected text
controller.backspace();                      // Remove selection or last character

// Change language dynamically
import 'package:highlight/languages/python.dart';
controller.setLanguage(python, analyzer: const DefaultLocalAnalyzer());

// Clean up when done
controller.dispose();
```

--------------------------------

### Flutter Tool Backend Custom Command

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Defines a custom CMake command to execute the Flutter tool backend script. This command is designed to run every time by using a non-existent output file `_phony_`. It sets up the necessary environment variables and passes build configuration arguments to the script.

```cmake
# _phony_ is a non-existent file to force this command to run every time, 
# since currently there's no way to get a full input/output list from the
# flutter tool.
add_custom_command(
  OUTPUT ${FLUTTER_LIBRARY} ${FLUTTER_LIBRARY_HEADERS}
    ${CMAKE_CURRENT_BINARY_DIR}/_phony_
  COMMAND ${CMAKE_COMMAND} -E env
    ${FLUTTER_TOOL_ENVIRONMENT}
    "${FLUTTER_ROOT}/packages/flutter_tools/bin/tool_backend.sh"
      ${FLUTTER_TARGET_PLATFORM} ${CMAKE_BUILD_TYPE}
  VERBATIM
)
```

--------------------------------

### Include Generated Configuration

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Includes a generated configuration file, typically containing project-specific settings provided by the Flutter tool. This allows for dynamic configuration of the build process.

```cmake
# Configuration provided via flutter tool.
include(${EPHEMERAL_DIR}/generated_config.cmake)
```

--------------------------------

### Define Flutter Library Headers

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Lists the header files required for the Flutter Linux GTK integration. The `list_prepend` function is used to add the correct include path prefix to each header file.

```cmake
list(APPEND FLUTTER_LIBRARY_HEADERS
  "fl_basic_message_channel.h"
  "fl_binary_codec.h"
  "fl_binary_messenger.h"
  "fl_dart_project.h"
  "fl_engine.h"
  "fl_json_message_codec.h"
  "fl_json_method_codec.h"
  "fl_message_codec.h"
  "fl_method_call.h"
  "fl_method_channel.h"
  "fl_method_codec.h"
  "fl_method_response.h"
  "fl_plugin_registrar.h"
  "fl_plugin_registry.h"
  "fl_standard_message_codec.h"
  "fl_standard_method_codec.h"
  "fl_string_codec.h"
  "fl_value.h"
  "fl_view.h"
  "flutter_linux.h"
)
list_prepend(FLUTTER_LIBRARY_HEADERS "${EPHEMERAL_DIR}/flutter_linux/")
```

--------------------------------

### Setting Language for Code Editor

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Illustrates how to specify the programming language for syntax highlighting in the CodeEditor. It shows importing a language definition and assigning it to the CodeController. It also demonstrates dynamically changing the language and analyzer.

```dart
import 'package:highlight/languages/python.dart'; // Each language is defined in its file.

final controller = CodeController(
  text: '...', // Initial code
  language: python,
);

// Dynamically changing the language
controller.setLanguage(go, DefaultLocalAnalyzer());

```

--------------------------------

### Applying Pre-defined Themes to Code Editor

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Demonstrates how to apply pre-defined color themes to the Flutter Code Editor using the `CodeTheme` widget. It shows importing a theme style (e.g., `monokaiSublimeTheme`) and passing it to `CodeThemeData`.

```dart
import 'package:flutter_highlight/themes/monokai-sublime.dart';

return MaterialApp(
  home: Scaffold(
    body: CodeTheme(
      data: CodeThemeData(styles: monokaiSublimeTheme), // <= Pre-defined in flutter_highlight.
      child: SingleChildScrollView(
        child: CodeField(
          controller: controller,
        ),
      ),
    ),
  ),
);

```

--------------------------------

### Configuring Code Analysis in Code Editor

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Shows how to configure and apply code analyzers to the CodeController for features like error highlighting. It demonstrates setting analyzers during controller initialization or by updating the analyzer property.

```dart
import 'package:highlight/languages/dart.dart';

// Example using DartPadAnalyzer
codeController = CodeController(language: dart, analyzer: DartPadAnalyzer());

// Or updating an existing controller
codeController.analyzer = DartPadAnalyzer();

// Setting language and analyzer together
codeController.setLanguage(dart, analyzer: DartPadAnalyzer());

```

--------------------------------

### Implement Code Analyzers in Dart

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

Shows how to use code analyzers with the flutter_code_editor package in Dart. It covers the default local analyzer for bracket matching, DartPadAnalyzer for Dart code analysis, and how to create and use a custom analyzer.

```dart
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:highlight/languages/dart.dart';

// Using the default local analyzer (bracket matching)
final controller = CodeController(
  text: 'void main() { print("Hello"); }',
  language: dart,
  analyzer: const DefaultLocalAnalyzer(),
);

// Using the DartPad analyzer for Dart code
final dartController = CodeController(
  text: '''
void main() {
  int x = "string"; // Type error
  print(x);
}
''',
  language: dart,
  analyzer: DartPadAnalyzer(),
);

// Change analyzer dynamically
dartController.analyzer = const DefaultLocalAnalyzer();

// Access analysis results
print('Issues: ${dartController.analysisResult.issues.length}');
for (final issue in dartController.analysisResult.issues) {
  print('Line ${issue.line}: ${issue.message} (${issue.type})');
}

// Creating a custom analyzer
class CustomAnalyzer extends AbstractAnalyzer {
  @override
  Future<AnalysisResult> analyze(Code code) async {
    final issues = <Issue>[];

    // Custom analysis logic
    final lines = code.text.split('\n');
    for (int i = 0; i < lines.length; i++) {
      if (lines[i].contains('TODO')) {
        issues.add(Issue(
          line: i,
          message: 'TODO comment found',
          type: IssueType.info,
        ));
      }
    }

    return AnalysisResult(issues: issues);
  }
}

// Use custom analyzer
final customController = CodeController(
  text: '// TODO: implement this',
  language: dart,
  analyzer: CustomAnalyzer(),
);

```

--------------------------------

### Set Editor Parameters in Python

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

Illustrates how to configure editor behavior using `EditorParams` in Python with the flutter_code_editor package. It specifically shows how to set the tab size for indentation and lists common keyboard shortcuts.

```python
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:highlight/languages/python.dart';

// Configure editor with custom tab size
final controller = CodeController(
  text: 'def main():\n    pass',
  language: python,
  params: const EditorParams(
    tabSpaces: 4,  // Number of spaces for tab indentation (default: 2)
  ),
);

// The editor supports these keyboard shortcuts:
// - Tab: Indent selection
// - Shift+Tab: Outdent selection
// - Ctrl+/ (Cmd+/ on Mac): Toggle comment
// - Ctrl+Z (Cmd+Z on Mac): Undo
// - Ctrl+Shift+Z (Cmd+Shift+Z on Mac): Redo
// - Ctrl+F (Cmd+F on Mac): Search
// - Escape: Dismiss popups

```

--------------------------------

### CMake Project Configuration and Settings

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/CMakeLists.txt

Sets up the minimum CMake version, project name, and executable name. It also defines the application ID and opts into modern CMake behaviors. Dependencies like GTK are found and configured.

```cmake
cmake_minimum_required(VERSION 3.10)
project(runner LANGUAGES CXX)

set(BINARY_NAME "example")
set(APPLICATION_ID "com.example.example")

cmake_policy(SET CMP0063 NEW)
set(CMAKE_INSTALL_RPATH "$ORIGIN/lib")

if(FLUTTER_TARGET_PLATFORM_SYSROOT)
  set(CMAKE_SYSROOT ${FLUTTER_TARGET_PLATFORM_SYSROOT})
  set(CMAKE_FIND_ROOT_PATH ${CMAKE_SYSROOT})
  set(CMAKE_FIND_ROOT_PATH_MODE_PROGRAM NEVER)
  set(CMAKE_FIND_ROOT_PATH_MODE_PACKAGE ONLY)
  set(CMAKE_FIND_ROOT_PATH_MODE_LIBRARY ONLY)
  set(CMAKE_FIND_ROOT_PATH_MODE_INCLUDE ONLY)
endif()

if(NOT CMAKE_BUILD_TYPE AND NOT CMAKE_CONFIGURATION_TYPES)
  set(CMAKE_BUILD_TYPE "Debug" CACHE
    STRING "Flutter build mode" FORCE)
  set_property(CACHE CMAKE_BUILD_TYPE PROPERTY STRINGS
    "Debug" "Profile" "Release")
endif()

find_package(PkgConfig REQUIRED)
pkg_check_modules(GTK REQUIRED IMPORTED_TARGET gtk+-3.0)

add_definitions(-DAPPLICATION_ID="${APPLICATION_ID}")
```

--------------------------------

### Create Flutter Interface Library Target

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Creates an interface library target named 'flutter'. It specifies include directories and links against the Flutter library and the system dependencies found earlier (GTK, GLIB, GIO). An explicit dependency on 'flutter_assemble' is also added.

```cmake
add_library(flutter INTERFACE)
target_include_directories(flutter INTERFACE
  "${EPHEMERAL_DIR}"
)
target_link_libraries(flutter INTERFACE "${FLUTTER_LIBRARY}")
target_link_libraries(flutter INTERFACE
  PkgConfig::GTK
  PkgConfig::GLIB
  PkgConfig::GIO
)
add_dependencies(flutter flutter_assemble)
```

--------------------------------

### Custom CMake List Prepend Function

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Defines a custom CMake function `list_prepend` to prepend an element to each item in a list. This is a workaround for older CMake versions (pre-3.10) that lack the `list(TRANSFORM ... PREPEND ...)` command.

```cmake
function(list_prepend LIST_NAME PREFIX)
    set(NEW_LIST "")
    foreach(element ${${LIST_NAME}})
        list(APPEND NEW_LIST "${PREFIX}${element}")
    endforeach(element)
    set(${LIST_NAME} "${NEW_LIST}" PARENT_SCOPE)
endfunction()
```

--------------------------------

### Configure Code Syntax Highlighting with CodeTheme

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

The CodeTheme widget allows for syntax highlighting customization. It can use pre-defined themes from flutter_highlight or custom styles defined via a map or individual style properties. This widget passes theme data down to child CodeField widgets.

```dart
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:flutter_highlight/themes/monokai-sublime.dart';
import 'package:flutter_highlight/themes/github.dart';
import 'package:flutter_highlight/themes/atom-one-dark.dart';

// Using a pre-defined theme from flutter_highlight
CodeTheme(
  data: CodeThemeData(styles: monokaiSublimeTheme),
  child: CodeField(controller: controller),
)

// Creating a custom theme
CodeTheme(
  data: CodeThemeData(
    styles: {
      'root': const TextStyle(
        backgroundColor: Color(0xFF1E1E1E),
        color: Color(0xFFD4D4D4),
      ),
      'keyword': const TextStyle(color: Color(0xFF569CD6)),
      'string': const TextStyle(color: Color(0xFFCE9178)),
      'comment': const TextStyle(color: Color(0xFF6A9955)),
      'number': const TextStyle(color: Color(0xFFB5CEA8)),
      'function': const TextStyle(color: Color(0xFFDCDCAA)),
      'class': const TextStyle(color: Color(0xFF4EC9B0)),
      'variable': const TextStyle(color: Color(0xFF9CDCFE)),
    },
  ),
  child: CodeField(controller: controller),
)

// Using individual style parameters
CodeTheme(
  data: CodeThemeData(
    keywordStyle: const TextStyle(color: Colors.blue, fontWeight: FontWeight.bold),
    commentStyle: const TextStyle(color: Colors.green, fontStyle: FontStyle.italic),
    functionStyle: const TextStyle(color: Colors.yellow),
    classStyle: const TextStyle(color: Colors.purple),
    variableStyle: const TextStyle(color: Colors.cyan),
  ),
  child: CodeField(controller: controller),
)
```

--------------------------------

### CMake Executable Target Definition and Linking

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/CMakeLists.txt

Defines the main executable target for the application, including source files and generated plugin registration. It applies standard build settings and links necessary libraries like 'flutter' and 'PkgConfig::GTK'.

```cmake
# Flutter library and tool build rules.
set(FLUTTER_MANAGED_DIR "${CMAKE_CURRENT_SOURCE_DIR}/flutter")
add_subdirectory(${FLUTTER_MANAGED_DIR})

# Define the application target.
add_executable(${BINARY_NAME}
  "main.cc"
  "my_application.cc"
  "${FLUTTER_MANAGED_DIR}/generated_plugin_registrant.cc"
)

apply_standard_settings(${BINARY_NAME})

target_link_libraries(${BINARY_NAME} PRIVATE flutter)
target_link_libraries(${BINARY_NAME} PRIVATE PkgConfig::GTK)

add_dependencies(${BINARY_NAME} flutter_assemble)
```

--------------------------------

### CMake Function for Standard Build Settings

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/CMakeLists.txt

Defines a reusable CMake function `APPLY_STANDARD_SETTINGS` to apply common compilation features, options, and definitions to a target. This includes C++14 standard, warning flags, optimization levels, and NDEBUG definition.

```cmake
function(APPLY_STANDARD_SETTINGS TARGET)
  target_compile_features(${TARGET} PUBLIC cxx_std_14)
  target_compile_options(${TARGET} PRIVATE -Wall -Werror)
  target_compile_options(${TARGET} PRIVATE "<$<NOT:$<CONFIG:Debug>>:-O3>")
  target_compile_definitions(${TARGET} PRIVATE "<$<NOT:$<CONFIG:Debug>>:NDEBUG>")
endfunction()
```

--------------------------------

### Flutter Assemble Custom Target

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Creates a custom target named 'flutter_assemble'. This target depends on the Flutter library and its headers, ensuring that the Flutter tool backend command runs before any targets that require these artifacts.

```cmake
add_custom_target(flutter_assemble DEPENDS
  "${FLUTTER_LIBRARY}"
  ${FLUTTER_LIBRARY_HEADERS}
)
```

--------------------------------

### Flutter Code Editor: CodeField Widget Integration (Dart)

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

Shows how to integrate the `CodeField` widget into a Flutter application for a complete code editing experience. This includes setting up the `CodeController`, applying themes, and configuring editor properties like line wrapping and read-only mode. Requires `flutter_code_editor`, `flutter_highlight`, and `highlight` packages.

```dart
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:flutter_highlight/themes/monokai-sublime.dart';
import 'package:highlight/languages/java.dart';

class CodeEditorScreen extends StatefulWidget {
  @override
  State<CodeEditorScreen> createState() => _CodeEditorScreenState();
}

class _CodeEditorScreenState extends State<CodeEditorScreen> {
  final _controller = CodeController(
    text: 'class MyClass {\n  void main() {}\n}',
    language: java,
  );

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CodeTheme(
        data: CodeThemeData(styles: monokaiSublimeTheme),
        child: CodeField(
          controller: _controller,
          minLines: 10,
          maxLines: null,        // Unlimited lines
          expands: false,
          wrap: false,           // Horizontal scrolling for long lines
          textStyle: const TextStyle(
            fontFamily: 'SourceCodePro',
            fontSize: 14,
          ),
          cursorColor: Colors.white,
          enabled: true,
          readOnly: false,
          onChanged: (String value) {
            print('Code changed: ${value.length} characters');
          },
        ),
      ),
    );
  }
}
```

--------------------------------

### Configure Autocompletion in Dart

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

Explains how to configure autocompletion in the flutter_code_editor for Dart code. It demonstrates adding custom words to the suggestion list and enabling/disabling the autocompletion popup.

```dart
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:highlight/languages/dart.dart';

final controller = CodeController(
  text: 'void main() {}',
  language: dart,
);

// Add custom words to autocomplete suggestions
controller.autocompleter.setCustomWords([
  'customFunction',
  'myVariable',
  'AppController',
  'UserService',
]);

// Disable autocompletion popup
controller.popupController.enabled = false;

// Re-enable autocompletion
controller.popupController.enabled = true;

```

--------------------------------

### Manage Code Folding with CodeController

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

The CodeController facilitates code folding and unfolding for supported languages like Dart, Go, Java, Python, and Scala. It provides methods to fold specific blocks (comments, imports, at a line) or all blocks outside named sections, and to unfold blocks. The current state of folded blocks can be accessed via the `foldedBlocks` property.

```dart
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:highlight/languages/java.dart';

final controller = CodeController(
  text: '''
/*
 * Copyright 2024
 * License: MIT
 */
import java.util.*;
import java.io.*;

class MyClass {
  void method1() {
    // code here
  }

  void method2() {
    // more code
  }
}
''',
  language: java,
);

// Fold the first comment/license block at line 0
controller.foldCommentAtLineZero();

// Fold all import statements
controller.foldImports();

// Fold code at a specific line (0-indexed)
controller.foldAt(8);   // Folds the block starting at line 9 (method1)

// Unfold code at a specific line
controller.unfoldAt(8);

// Fold everything except specific named sections
controller.foldOutsideSections(['section1', 'section2']);

// Access currently folded blocks
final foldedBlocks = controller.code.foldedBlocks;
for (final block in foldedBlocks) {
  print('Folded: lines ${block.firstLine} to ${block.lastLine}');
}
```

--------------------------------

### Define Flutter Library and Related Paths

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/linux/flutter/CMakeLists.txt

Defines the path to the Flutter Linux GTK shared library and the ICU data file. It also sets the project build directory and the AOT (Ahead-Of-Time) compiled library path, publishing them to the parent scope for use in other build steps.

```cmake
set(FLUTTER_LIBRARY "${EPHEMERAL_DIR}/libflutter_linux_gtk.so")

# Published to parent scope for install step.
set(FLUTTER_LIBRARY ${FLUTTER_LIBRARY} PARENT_SCOPE)
set(FLUTTER_ICU_DATA_FILE "${EPHEMERAL_DIR}/icudtl.dat" PARENT_SCOPE)
set(PROJECT_BUILD_DIR "${PROJECT_DIR}/build/" PARENT_SCOPE)
set(AOT_LIBRARY "${PROJECT_DIR}/build/lib/libapp.so" PARENT_SCOPE)
```

--------------------------------

### Configure Code Editor Gutter Appearance with GutterStyle

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

The GutterStyle class customizes the editor's gutter, which displays line numbers, error indicators, and folding handles. Users can configure its width, margin, alignment, visibility of elements, background color, and text styles. The entire gutter can be hidden by setting it to GutterStyle.none.

```dart
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';

// Full gutter with all elements
CodeField(
  controller: controller,
  gutterStyle: GutterStyle(
    width: 80.0,
    margin: 10.0,
    textAlign: TextAlign.right,
    showLineNumbers: true,
    showErrors: true,
    showFoldingHandles: true,
    background: Colors.grey[900],
    textStyle: const TextStyle(
      color: Colors.grey,
      fontSize: 12,
    ),
    errorPopupTextStyle: const TextStyle(
      color: Colors.white,
      fontSize: 12,
    ),
  ),
)

// Hide specific gutter elements
CodeField(
  controller: controller,
  gutterStyle: const GutterStyle(
    showLineNumbers: true,
    showErrors: false,         // Hide error indicators
    showFoldingHandles: false, // Hide folding handles
  ),
)

// Hide the entire gutter
CodeField(
  controller: controller,
  gutterStyle: GutterStyle.none,
)
```

--------------------------------

### Advanced Code Folding Operations

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Perform various code folding actions programmatically using the CodeController. Options include folding the first comment, folding import statements, folding all blocks except specified named sections, and folding/unfolding blocks at specific line numbers. Access the list of currently folded blocks via controller.code.foldedBlocks.

```dart
// Fold the first comment
controller.foldCommentAtLineZero();

// Fold import statements
controller.foldImports();

// Fold all blocks except specified sections
controller.foldOutsideSections(['section1']);

// Fold/unfold at a specific line
controller.foldAt(1);
controller.unfoldAt(1);

// Access folded blocks
final foldedBlocks = controller.code.foldedBlocks;

```

--------------------------------

### Access and Modify Code Text with CodeController

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Interact with the code editor's content using the CodeController, which extends Flutter's TextEditingController. Understand the differences between 'text', 'value', and 'fullText' properties, especially concerning folded code. 'text' and 'value' return only visible content, while 'fullText' includes all content, including folded sections.

```dart
// Accessing text
String visibleText = controller.text;
TextEditingValue visibleValue = controller.value;
String allText = controller.fullText;

// Setting text
controller.text = "new visible text";
controller.value = TextEditingValue(text: "new visible value");
controller.fullText = "new full text";

```

--------------------------------

### Hide Code Sections in Flutter

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Allows hiding all code except for a specified named section, providing enhanced focus. The full text is preserved, and line numbering is maintained. This feature also makes the editor read-only to prevent modifications. Currently, only one visible section is supported.

```dart
controller.visibleSectionNames = {'section1'};
```

--------------------------------

### Hide Gutter Elements in Flutter Code Editor

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Customize the appearance of the code editor's gutter by controlling the visibility of line numbers, error indicators, and folding handles. This is achieved by passing a GutterStyle object to the CodeField widget. For complete gutter hiding, use the GutterStyle.none constant.

```dart
CodeField(
  gutterStyle: GutterStyle(
    showErrors: false,
    showFoldingHandles: false,
    showLineNumbers: false,
  ),
  // ...
),

```

```dart
CodeField(
  gutterStyle: GutterStyle.none,
  // ...
),

```

--------------------------------

### Code Modifiers for Text Transformation

Source: https://context7.com/akvelon/flutter-code-editor/llms.txt

Code modifiers automatically transform text as the user types, enhancing the editing experience. Default modifiers include auto-indentation, auto-closing brackets, tab-to-space conversion, and auto-pairing characters. These can be customized or disabled.

```dart
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:highlight/languages/dart.dart';

// Default modifiers include:
// - IndentModifier: Auto-indent after opening braces
// - CloseBlockModifier: Auto-close brackets, quotes, etc.
// - TabModifier: Convert tabs to spaces
// - InsertionCodeModifier: Auto-pair characters

final controller = CodeController(
  text: '',
  language: dart,
  // Use default modifiers
  modifiers: CodeController.defaultCodeModifiers,
);

// Or create a controller with no modifiers
final minimalController = CodeController(
  text: '',
  language: dart,
  modifiers: [],
);

// Programmatic text manipulation
controller.indentSelection();           // Indent selected lines
controller.outdentSelection();          // Outdent selected lines
controller.commentOutOrUncommentSelection(); // Toggle line comments

```

--------------------------------

### Register Flutter Service Worker on First Frame (JavaScript)

Source: https://github.com/akvelon/flutter-code-editor/blob/main/example/web/index.html

This code snippet registers a service worker for a Flutter web application. It checks for service worker support in the browser and listens for the 'flutter-first-frame' event. Upon receiving this event, it registers the 'flutter_service_worker.js' file. This ensures the service worker is active before the main application frame is rendered.

```javascript
if ('serviceWorker' in navigator) {
  window.addEventListener('flutter-first-frame', function () {
    navigator.serviceWorker.register('flutter_service_worker.js');
  });
}
```

--------------------------------

### Set Read-Only Code Blocks in Flutter Code Editor

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Designate specific named sections as read-only to protect them from user modifications. Assign a set of section names to the controller.readOnlySectionNames property. Note that 'text' and 'value' properties cannot modify read-only sections; use 'fullText' for programmatic changes in such cases.

```dart
controller.readOnlySectionNames = {'section1'};

```

--------------------------------

### Disable Autocompletion in Flutter Code Editor

Source: https://github.com/akvelon/flutter-code-editor/blob/main/README.md

Disables the autocompletion feature in the Flutter Code Editor. Autocompletion normally suggests keywords, existing words, and custom words. Disabling it stops these suggestions from appearing as the user types.

```dart
controller.popupController.enabled = false;
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.