### Install Development Dependencies

Source: https://github.com/leantime/leantime/blob/master/CONTRIBUTING.md

Install all necessary dependencies for development. This command should be run after forking and cloning the repository.

```bash
make install-deps-dev
```

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

### Install Dependencies and Build for Development

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Commands for manually setting up the development environment. This includes installing dependencies, building the project for development, and configuring the web server and database.

```bash
make install-deps-dev
make build-dev
```

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

### Install Leantime with Helm

Source: https://github.com/leantime/leantime/blob/master/helm/README.md

Install the Leantime application in your Kubernetes cluster using Helm, specifying a custom values file for configuration.

```bash
helm install leantime -f values.yaml ./leantime/helm
```

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

### Run Development Build

Source: https://github.com/leantime/leantime/blob/master/CONTRIBUTING.md

Compile the project for local development. This command is part of the development setup process.

```bash
make build-dev
```

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

### Plugin Registration Example

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

This snippet demonstrates how to register a plugin and its associated components using the Leantime Registration service. It shows how to register middleware, language files, menu items, and JavaScript/CSS assets.

```php
$registration = new Registration('MyPlugin');
$registration->registerMiddleware([MyMiddleware::class]);
$registration->registerLanguageFiles(['en-US', 'de-DE']);
$registration->addMenuItem([...], 'project', ['main', 'submenu-key']);
$registration->addCss(['app.css']);
$registration->addHeaderJs(['vendor.js']);
$registration->addFooterJs(['app.js']);
```

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

### Build and Run Development Docker Image

Source: https://github.com/leantime/leantime/blob/master/README.md

Builds the development Docker image using 'make clean build' and then starts the development server with 'make run-dev', which exposes the application on port 5080.

```bash
make clean build
```

```bash
make run-dev
```

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

### Plugin Middleware Registration Example

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Illustrates how plugins can register their custom middleware into the application's second middleware pipeline. This occurs after the core middleware stack and before the router dispatches the request.

```php
// Core middleware -> Plugin middleware -> Router dispatch

Plugins register into this second pipeline via `Registration::registerMiddleware()`.
```

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

### HTMX Controller Example

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Defines an HTMX controller with a view, dependency injection via init(), and action methods for handling requests. Use this pattern for self-fetching or refreshing widgets.

```php
namespace Leantime\Domain\{Module}\Hxcontrollers;

use Leantime\Core\Controller\HtmxController;

class MyController extends HtmxController
{
    // Required: points to a Blade partial
    protected static string $view = '{module}::partials.myPartial';

    // DI via init(), NOT __construct()
    public function init(MyService $service): void
    {
        $this->service = $service;
    }

    // Action methods are named semantically, not by HTTP verb
    public function get($params): void
    {
        $this->tpl->assign('data', $this->service->getData($params['id']));
    }

    public function save(): void
    {
        // Process $_POST
        $this->tpl->setNotification('Saved!', 'success');   // already emits HtmxUiEvents::Notify
        $this->tpl->emit(HtmxTicketEvents::UPDATE);          // tell listeners the entity changed
    }
}
```

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

### Registering a Closure Listener with Wildcard

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Register a listener using a closure for an event name that uses a wildcard. This example uses a wildcard for the domain, service, and method parts of the event name.

```php
EventDispatcher::addEventListener('leantime.domain.auth.*.userSignUpSuccess', function ($params) {
    $helperService = app()->make("\Leantime\Domain\Help\Services\Helper"::class);
    $helperService->createDefaultProject(session('userdata.id'), session('userdata.role'));
});
```

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

### Get Tiptap Editor HTML Content

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Retrieves the HTML content from a Tiptap editor instance. Ensure the editor and its registry are accessible via `window.leantime.tiptapController.registry`.

```javascript
function getEditorContent(textareaId) {
    var textarea = document.getElementById(textareaId);
    var wrapper = textarea.nextElementSibling;
    if (wrapper && wrapper.querySelector) {
        var editorEl = wrapper.querySelector('.tiptap-editor');
        if (editorEl) {
            var editor = window.leantime.tiptapController.registry.get(editorEl);
            if (editor) {
                var html = editor.getHTML();
                document.getElementById(textareaId + '-output').textContent = html;
                return;
            }
        }
    }
    document.getElementById(textareaId + '-output').textContent = 'Editor not found';
}
```

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

### Get Application URL with Ingress Enabled

Source: https://github.com/leantime/leantime/blob/master/helm/templates/NOTES.txt

This snippet generates the application URL when Ingress is enabled in the Helm chart. It iterates through defined hosts and paths to construct the full URL.

```go-template
{{- if .Values.ingress.enabled }}
{{- range $host := .Values.ingress.hosts }}
  {{- range .paths }}
  http{{ if $.Values.ingress.tls }}s{{ end }}://{{ $host.host }}{{ .path }}
  {{- end }}
{{- end }}
{{- end }}
```

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

### Get Application URL with NodePort Service

Source: https://github.com/leantime/leantime/blob/master/helm/templates/NOTES.txt

This snippet retrieves the application URL for a NodePort service. It exports the NodePort and Node IP, then echoes the constructed URL.

```bash
export NODE_PORT=$(kubectl get --namespace {{ .Release.Namespace }} -o jsonpath="{.spec.ports[0].nodePort}" services {{ include "leantime.fullname" . }})
export NODE_IP=$(kubectl get nodes --namespace {{ .Release.Namespace }} -o jsonpath="{.items[0].status.addresses[0].address}")
echo http://$NODE_IP:$NODE_PORT
```

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

### Get Tiptap Editor Text Content

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Retrieves the plain text content from a Tiptap editor instance. This function is useful for getting the text without any HTML formatting.

```javascript
function getEditorText(textareaId) {
    var textarea = document.getElementById(textareaId);
    var wrapper = textarea.nextElementSibling;
    if (wrapper && wrapper.querySelector) {
        var editorEl = wrapper.querySelector('.tiptap-editor');
        if (editorEl) {
            var editor = window.leantime.tiptapController.registry.get(editorEl);
            if (editor) {
                var text = editor.getText();
                document.getElementById(textareaId + '-output').textContent = text;
                return;
            }
        }
    }
    document.getElementById(textareaId + '-output').textContent = 'Editor not found';
}
```

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

### Get Application URL with LoadBalancer Service

Source: https://github.com/leantime/leantime/blob/master/helm/templates/NOTES.txt

This snippet retrieves the application URL for a LoadBalancer service. It notes that the LoadBalancer IP may take time to become available and provides a command to monitor its status.

```bash
NOTE: It may take a few minutes for the LoadBalancer IP to be available.
      You can watch the status of by running 'kubectl get --namespace {{ .Release.Namespace }} svc -w {{ include "leantime.fullname" . }}'
export SERVICE_IP=$(kubectl get svc --namespace {{ .Release.Namespace }} {{ include "leantime.fullname" . }} --template "{{ range (index .status.loadBalancer.ingress 0) }}{{.}}{{ end }}")
echo http://$SERVICE_IP:{{ .Values.service.port }}
```

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

### Run Tests

Source: https://github.com/leantime/leantime/blob/master/CONTRIBUTING.md

Execute unit and acceptance tests to ensure code quality and functionality. These are crucial steps before submitting changes.

```bash
make unit-test
make acceptance-test
```

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

### Run Acceptance Tests

Source: https://github.com/leantime/leantime/blob/master/README.md

Execute the acceptance test suite for the Leantime application. This requires Docker to be running and verifies end-to-end functionality.

```bash
make acceptance-test
```

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

### Initialize simpleColorPicker with a Specific Color Palette

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/example.html

Sets up the simpleColorPicker plugin using a predefined array of colors. This allows for a curated selection of color options.

```javascript
var colors = 
['#000000', '#444444', '#666666', '#999999', '#cccccc', '#eeeeee', '#f3f3f3', '#ffffff'];
$('input#color3').simpleColorPicker({ colors: colors });
```

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

### Common Build Commands

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

A collection of make commands for managing project dependencies, building for development or production, clearing cache, and packaging the release.

```bash
make install-deps-dev    # Install development dependencies
make install-deps        # Install production dependencies
make build-dev           # Build for development (with source maps)
make build               # Build for production
make clear-cache         # Clear cache
make package             # Package for release
npx mix                  # Build js/css using webpack (run in root or within a plugin)
```

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

### Common Leantime CLI Commands

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

A list of frequently used Leantime CLI commands for managing updates, plugins, users, and system settings.

```bash
- `system:update` - Update the Leantime installation
- `plugin:enable [pluginname]` - Enable a specific plugin
- `plugin:disable [pluginname]` - Disable a specific plugin
- `plugin:install [pluginname]` - Install a plugin from the marketplace
- `plugin:list` - List all installed plugins
- `user:add` - Add a new user
- `setting:save [key] [value]` - Save a system setting
```

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

### Clone Leantime Repository

Source: https://github.com/leantime/leantime/blob/master/helm/README.md

Clone the Leantime project repository to your local machine to access the Helm chart.

```bash
git clone https://github.com/Leantime/leantime
```

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

### Build Helm Chart Dependencies

Source: https://github.com/leantime/leantime/blob/master/helm/README.md

Build the necessary chart dependencies for Leantime using the Helm CLI.

```bash
helm dependency build ./leantime/helm
```

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

### Run Unit Tests

Source: https://github.com/leantime/leantime/blob/master/README.md

Execute the unit test suite for the Leantime application. This verifies the correctness of individual components and functions.

```bash
make unit-test
```

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

### Access Application with ClusterIP Service

Source: https://github.com/leantime/leantime/blob/master/helm/templates/NOTES.txt

This snippet provides instructions for accessing an application with a ClusterIP service. It exports the Pod Name and Container Port, then uses port-forwarding to access the application locally.

```bash
export POD_NAME=$(kubectl get pods --namespace {{ .Release.Namespace }} -l "app.kubernetes.io/name={{ include "leantime.name" . }},app.kubernetes.io/instance={{ .Release.Name }}" -o jsonpath="{.items[0].metadata.name}")
export CONTAINER_PORT=$(kubectl get pod --namespace {{ .Release.Namespace }} $POD_NAME -o jsonpath="{.spec.containers[0].ports[0].containerPort}")
echo "Visit http://127.0.0.1:8080 to use your application"
kubectl --namespace {{ .Release.Namespace }} port-forward $POD_NAME 8080:$CONTAINER_PORT
```

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

### Initialize simpleColorPicker with Default Options

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/example.html

Applies the simpleColorPicker plugin to an input element with its default settings. This is the most basic usage.

```javascript
$(document).ready(function() {
	$('input#color').simpleColorPicker();
});
```

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

### Configure LeanTime for Reverse Proxy (Docker)

Source: https://github.com/leantime/leantime/blob/master/README.md

When using LeanTime behind a reverse proxy, set the LEAN_APP_URL environment variable to your custom domain name to ensure correct URL resolution and SSL handling.

```bash
-e LEAN_APP_URL=https://yourdomain.com \
```

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

### Configure simpleColorPicker with Custom Colors Per Line

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/example.html

Initializes the simpleColorPicker plugin, customizing the number of colors displayed per line. Useful for visual organization.

```javascript
$(document).ready(function() {
	$('input#color2').simpleColorPicker({ colorsPerLine: 16 });
});
```

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

### Run All Tiptap Editor Tests

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Executes all Tiptap editor tests defined in `window.leantime.tiptapTests`. It displays a summary of passed, failed, and total tests.

```javascript
function runTests() {
    var output = document.getElementById('test-output');
    output.textContent = 'Running tests...\n';
    if (window.leantime && window.leantime.tiptapTests) {
        var results = window.leantime.tiptapTests.runAll();
        output.textContent = 'Tests complete!\n\n' + 'Passed: ' + results.passed + '\n' + 'Failed: ' + results.failed + '\n' + 'Total: ' + results.total + '\n\n' + 'Check browser console for detailed results.';
    } else {
        output.textContent = 'Test utilities not loaded';
    }
}
```

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

### Run API Acceptance Tests via Docker

Source: https://github.com/leantime/leantime/blob/master/README.md

Execute API-specific acceptance tests within the Dockerized development environment. This command targets the 'api' group of tests.

```bash
docker compose --file .dev/docker-compose.yaml --file .dev/docker-compose.tests.yaml exec leantime-dev php vendor/bin/codecept run -g api --steps
```

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

### Initialize simpleColorPicker with Default Options

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/README.md

Attach the simpleColorPicker plugin to an input element to enable the default color palette functionality upon focus.

```javascript
$(document).ready(function() {
    $('input#color').simpleColorPicker();
});
```

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

### Execute Leantime CLI Commands

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Run Leantime's custom Artisan commands for system management tasks. These commands are executed using the `php bin/leantime` script.

```bash
php bin/leantime [command]
```

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

### Run Static Analysis

Source: https://github.com/leantime/leantime/blob/master/README.md

Execute static analysis using PHPStan to check code quality. This command helps identify potential bugs and code style issues.

```bash
make phpstan
```

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

### Perform Manual System Update

Source: https://github.com/leantime/leantime/blob/master/README.md

Manually update Leantime by replacing files and potentially running a database update script. Ensure a database backup is taken beforehand.

```bash
php bin/leantime system:update
```

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

### Common Testing Commands

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Commands for running static analysis, code style checks, and automated tests (unit and acceptance). Acceptance tests can be run for specific groups.

```bash
make phpstan             # Run static analysis (level 0)
make test-code-style     # Run code style checks (Laravel Pint)
make fix-code-style      # Fix code style issues (Laravel Pint)
make unit-test           # Run unit tests (Docker)
make acceptance-test     # Run acceptance tests (Docker)
```

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

### Log Errors with Log Facade

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Always use the Log Facade for logging errors. Ensure the facade is included in your use statements.

```php
Log::error($exception)
```

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

### Fetch Request with Credentials and XMLHttpRequest Header

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

When making fetch requests, it's recommended to include 'credentials: "include"' to handle cookies and the 'X-Requested-With': 'XMLHttpRequest' header to identify AJAX requests.

```javascript
fetch(url, { credentials: "include", headers: { 'X-Requested-With': 'XMLHttpRequest' } })
```

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

### Run Specific Acceptance Test Groups

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Execute specific groups of acceptance tests within the Dockerized environment. Available groups include api, timesheet, login, ticket, and user.

```bash
docker compose --file .dev/docker-compose.yaml --file .dev/docker-compose.tests.yaml exec leantime-dev php vendor/bin/codecept run -g api --steps
docker compose --file .dev/docker-compose.yaml --file .dev/docker-compose.tests.yaml exec leantime-dev php vendor/bin/codecept run -g timesheet --steps
```

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

### Registering a Class-Based Event Listener

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Register a listener for a specific event using a class name. The listener's `handle()` method will be called.

```php
EventDispatcher::add_event_listener(
    'leantime.domain.projects.services.projects.notifyProjectUsers.notifyProjectUsers',
    NotifyProjectUsers::class
);
```

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

### Run Code Style Checks

Source: https://github.com/leantime/leantime/blob/master/CONTRIBUTING.md

Execute the project's code style checks using make targets. These commands ensure adherence to coding standards.

```bash
make test-code-style
make phpstan
```

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

### Run LeanTime Docker Image

Source: https://github.com/leantime/leantime/blob/master/README.md

This command runs the official LeanTime Docker image in detached mode, restarts it automatically, maps ports, sets up a network, and configures essential environment variables for database connection and email return.

```bash
docker run -d --restart unless-stopped -p 8080:8080 --network leantime-net \
-e LEAN_DB_HOST=mysql_leantime \
-e LEAN_DB_USER=admin \
-e LEAN_DB_PASSWORD=321.qwerty \
-e LEAN_DB_DATABASE=leantime \
-e LEAN_EMAIL_RETURN=changeme@local.local \
--name leantime leantime/leantime:latest
```

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

### Run Timesheet Acceptance Tests via Docker

Source: https://github.com/leantime/leantime/blob/master/README.md

Execute timesheet-specific acceptance tests within the Dockerized development environment. This command targets the 'timesheet' group of tests.

```bash
docker compose --file .dev/docker-compose.yaml --file .dev/docker-compose.tests.yaml exec leantime-dev php vendor/bin/codecept run -g timesheet --steps
```

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

### Show Theme Function

Source: https://github.com/leantime/leantime/blob/master/accessibility-mockup.html

This JavaScript function manages theme display by hiding all theme content and tabs, then showing the selected theme and activating its corresponding tab. Ensure elements with IDs matching the theme name plus '-theme' and class 'theme-content' exist, and tabs have the class 'theme-tab'.

```javascript
function showTheme(theme) { // Hide all theme content document.querySelectorAll('.theme-content').forEach(el => { el.classList.remove('active'); }); // Remove active from all tabs document.querySelectorAll('.theme-tab').forEach(el => { el.classList.remove('active'); }); // Show selected theme document.getElementById(theme + '-theme').classList.add('active'); // Activate selected tab event.target.classList.add('active'); }
```

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

### Configure simpleColorPicker with More Colors Per Line

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/README.md

Customize the color picker to display a different number of colors per line by setting the 'colorsPerLine' option.

```javascript
$(document).ready(function() {
    $('input#color2').simpleColorPicker({ colorsPerLine: 16 });
});
```

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

### Check Tiptap Editor Registry

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Retrieves and displays all currently registered Tiptap editor instances. Useful for debugging and understanding the state of active editors.

```javascript
function checkRegistry() {
  var output = document.getElementById('test-output');
  var all = window.leantime.tiptapController.registry.getAll();
  output.textContent = 'Registry contains ' + all.length + ' editor(s):\n\n';
  all.forEach(function(item, i) {
    output.textContent += (i + 1) + '. ' + (item.element.getAttribute('data-textarea-id') || 'unknown') + '\n';
  });
}
```

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

### Registering a Filter Listener with Priority

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Register a listener for a filter event, specifying a priority to control execution order. Lower numbers execute earlier.

```php
EventDispatcher::add_filter_listener(
    'leantime.domain.menu.repositories.menu.getMenuStructure.menuStructures.project',
    function ($menu) { $menu['newItem'] = [...]; return $menu; },
    50  // lower = earlier execution
);
```

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

### Insert Content into Tiptap Editor

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Inserts specified content into a Tiptap editor instance. This function requires the editor to be initialized and accessible.

```javascript
function insertContent(textareaId, content) {
    var textarea = document.getElementById(textareaId);
    var wrapper = textarea.nextElementSibling;
    if (wrapper && wrapper.querySelector) {
        var editorEl = wrapper.querySelector('.tiptap-editor');
        if (editorEl) {
            var editor = window.leantime.tiptapController.registry.get(editorEl);
            if (editor) {
                editor.commands.insertContent(content);
                document.getElementById(textareaId + '-output').textContent = 'Content inserted!';
                return;
            }
        }
    }
    document.getElementById(textareaId + '-output').textContent = 'Editor not found';
}
```

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

### Initialize Tiptap Editors

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Initializes Tiptap editors on the page after the DOM is loaded and Tiptap is ready. It checks for the Tiptap controller and logs the success or failure status.

```javascript
document.addEventListener('DOMContentLoaded', function() {
    setTimeout(function() {
        var statusEl = document.getElementById('load-status');
        if (window.leantime && window.leantime.tiptapController) {
            // Initialize editors
            var editors = window.leantime.tiptapController.initEditors(document);
            statusEl.className = 'status success';
            statusEl.textContent = 'Tiptap loaded successfully! Initialized ' + editors.length + ' editor(s).';
        } else {
            statusEl.className = 'status error';
            statusEl.textContent = 'Error: Tiptap controller not found. Check console for errors.';
        }
    }, 100);
});
```

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

### Dispatching a Filter to Modify Data

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Use this to pass data through a pipeline of listeners that can modify it. The initial data and an optional context array are passed as arguments.

```php
$result = self::dispatch_filter('beforeReturnAllPlugins', $installedPlugins, ['enabledOnly' => $enabledOnly]);
```

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

### Dispatching a Fire-and-Forget Event

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Use this to trigger an event that does not expect a return value or modification of data. The payload is passed as the second argument.

```php
self::dispatch_event('ticket_created', $payload);
```

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

### Frontcontroller URL Convention

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Defines the convention for mapping URLs to controller actions in the legacy Frontcontroller routing system. This applies to domain and plugin controllers, including Hxcontrollers.

```plaintext
/module/action           -> Domain\{Module}\Controllers\{Action}::get()|post()
/module/action/id        -> Domain\{Module}\Controllers\{Action}::get()|post() with id param
/module/action/id/method -> Domain\{Module}\Controllers\{Action}::method()
/hx/module/action        -> Domain\{Module}\Hxcontrollers\{Action}
```

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

### Use simpleColorPicker with Non-Input Elements and Callbacks

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/README.md

Attach the color picker to elements other than inputs and define a callback function using 'onChangeColor' to handle color selection events. The selected color is passed as an argument to the callback.

```javascript
$(document).ready(function() {
    $('button#color5').simpleColorPicker({ onChangeColor: function(color) { $('label#color-result').text(color); } });
});
```

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

### Customize simpleColorPicker with a Specific Color Array

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/README.md

Provide a custom array of hex color codes to the 'colors' option to define the available color palette.

```javascript
$(document).ready(function() {
    var colors = ['#000000', '#444444', '#666666', '#999999', '#cccccc', '#eeeeee', '#f3f3f3', '#ffffff'];
    $('input#color3').simpleColorPicker({ colors: colors });
});
```

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

### Apply Effects to simpleColorPicker Display and Hide Actions

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/example.html

Configures the simpleColorPicker plugin to use specific visual effects for showing and hiding the color palette. Supports 'fade' and 'slide' effects.

```javascript
$(document).ready(function() {
	$('input#color4').simpleColorPicker({ showEffect: 'fade', hideEffect: 'slide' });
});
```

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

### PHP HxComponent for Subtasks

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Defines an HxComponent for handling subtasks, specifying its view, swap strategy, route, and the HTMX events it listens to and emits. This enables contract-driven HTMX component management.

```php
<?php

class Subtasks extends \Leantime\Core\Controller\HxComponent {
    protected static string $view = 'tickets::partials.subtasks';
    public static string $swap = 'innerHTML';
    public static function route(): string { return 'tickets/subtasks'; }
    public static function listensTo(): array { return [HtmxTicketEvents::SUBTASK_UPDATE]; }
    public static function emits(): array { return [HtmxTicketEvents::SUBTASK_UPDATE]; }
}

```

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

### Apply Effects to simpleColorPicker Show and Hide Actions

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/README.md

Control the visual effects for showing and hiding the color picker using the 'showEffect' and 'hideEffect' options. Supported effects include 'fade' and 'slide'.

```javascript
$(document).ready(function() {
    $('input#color4').simpleColorPicker({ showEffect: 'fade', hideEffect: 'slide' });
});
```

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

### Leantime Global Namespace IIFE Module Pattern

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

All JavaScript code utilizes a global 'leantime' namespace with an Immediately Invoked Function Expression (IIFE) module pattern for encapsulation. This pattern is used for organizing controllers and other JavaScript modules.

```javascript
leantime.ticketsController = (function () {
    function doSomething() { ... }
    return { doSomething: doSomething };
})();
```

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

### Fix Code Style

Source: https://github.com/leantime/leantime/blob/master/README.md

Automatically fix code style issues in the project. This command uses a linter/formatter to ensure consistent code formatting.

```bash
make fix-code-style
```

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

### Use simpleColorPicker on Non-Input Elements with Callback

Source: https://github.com/leantime/leantime/blob/master/public/assets/js/libs/simple-color-picker-master/example.html

Attaches the simpleColorPicker plugin to a button element and defines a callback function to handle color changes. The callback updates a label with the selected color.

```javascript
$(document).ready(function() {
	$('button#color5').simpleColorPicker({ onChangeColor: function(color) { $('label#color-result').text(color); } });
});
```

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

### Handle Form Submission with Tiptap Editor

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Prevents default form submission and displays the content of a Tiptap editor within a form. Ensure the textarea has the ID 'form-editor'.

```javascript
function handleFormSubmit(event) {
  event.preventDefault();
  var output = document.getElementById('form-output');
  var textarea = document.getElementById('form-editor');
  output.textContent = 'Form submitted!\n\nTextarea value:\n' + textarea.value;
  return false;
}
```

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

### Destroy All Tiptap Editors

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Destroys all initialized Tiptap editor instances managed by the controller. Returns the number of editors destroyed.

```javascript
function destroyAll() {
    var output = document.getElementById('test-output');
    var count = window.leantime.tiptapController.destroyAll();
    output.textContent 
}
```

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

### Batch Template Variable Assignment in PHP

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Assigns multiple template variables to the template engine in a single operation using array_map. This is a common pattern in HxControllers for efficiency.

```php
<?php

array_map([$this->tpl, 'assign'], array_keys($tplVars), array_values($tplVars));

```

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

### Reinitialize Tiptap Editors

Source: https://github.com/leantime/leantime/blob/master/public/tiptap-test.html

Resets and reinitializes all Tiptap editors on the page. Use this to refresh the editor instances after DOM manipulations.

```javascript
function reinitialize() {
  var output = document.getElementById('test-output');
  // Reset textareas
  document.querySelectorAll('.tiptap-wrapper').forEach(function(wrapper) {
    var textarea = wrapper.querySelector('textarea');
    if (textarea) {
      textarea.removeAttribute('data-tiptap-initialized');
      textarea.style.display = '';
      wrapper.parentNode.insertBefore(textarea, wrapper);
      wrapper.remove();
    }
  });
  // Reinitialize
  var editors = window.leantime.tiptapController.initEditors(document);
  output.textContent = 'Reinitialized ' + editors.length + ' editor(s)';
}
```

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

### JSONRPC API Method Routing Convention

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Defines the conventions for routing requests to the appropriate service methods via the JSON-RPC API. The routing includes the domain and optionally the service name.

```text
leantime.rpc.{domain}.{methodname}                  # 4 segments (service = domain name)
leantime.rpc.{domain}.{servicename}.{methodname}     # 5 segments
```

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

### Blade Component for HTMX Integration (Route-Driven)

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Renders an HTMX component using the x-global::hx tag, driven by a PHP class. It automatically derives the endpoint and refresh triggers from the specified HxComponent class.

```blade
{{-- contract-driven: route + refresh triggers derived from the class --}}
<x-global::hx :for="\Leantime\Domain\Tickets\Hxcontrollers\Subtasks::class" :id="$ticket->id" trigger="load" />

```

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

### Blade Component for HTMX Integration (Attribute-Driven)

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Renders an HTMX component using the x-global::hx tag with explicit endpoint and listen attributes. This is useful for one-off components or plugin integrations.

```blade
{{-- attribute-driven escape hatch (one-offs / plugins) --}}
<x-global::hx endpoint="comments/reactions/get" :listen="[HtmxTicketEvents::UPDATE]" />

```

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

### Dispatching an Event via Blade Directive

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Use the `@dispatchEvent` directive in Blade templates to trigger a fire-and-forget event.

```blade
@dispatchEvent('eventName')
```

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

### Dispatching a Filter via Blade Directive

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Use the `@dispatchFilter` directive in Blade templates to trigger a filter, passing data to be potentially modified.

```blade
@dispatchFilter('filterName', $data)
```

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

### PHP Enum for HTMX Ticket Events

Source: https://github.com/leantime/leantime/blob/master/CLAUDE.md

Defines a PHP enum for HTMX ticket-related events, implementing the HtmxEvent interface and using the InteractsWithHtmxEvents trait. This is used for emitting specific data events.

```php
<?php

// Per-domain data-event enum
use Leantime\Core\Events\Htmx\{HtmxEvent, InteractsWithHtmxEvents};

enum HtmxTicketEvents: string implements HtmxEvent {
    use InteractsWithHtmxEvents;
    case UPDATE = 'lt:tickets:ticket.updated';
    case SUBTASK_UPDATE = 'lt:tickets:subtask.updated';
}

// Emit from an HxController action
$this->tpl->emit(HtmxTicketEvents::UPDATE);

```

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