richbrains/ai-textarea

AI-powered textarea for Symfony as a dedicated form type with a clean modal UI. Let users rewrite text using an OpenAI‑compatible API.

Installs: 1

Dependents: 0

Suggesters: 0

Security: 0

Stars: 0

Watchers: 0

Forks: 0

Open Issues: 0

Language:JavaScript

Type:symfony-bundle

pkg:composer/richbrains/ai-textarea

v0.1.0 2025-09-21 15:03 UTC

This package is not auto-updated.

Last update: 2026-01-12 14:59:31 UTC


README

AI-powered textarea for Symfony as a dedicated form type with a clean modal UI. Let users rewrite text (friendlier, more professional, fix grammar, shorter/longer) using an OpenAI‑compatible API.

Features

  • New form type: AITextareaType (opt‑in per field)
  • Modal UI with quick-action chips, custom prompt, preview, Copy and Replace buttons
  • No external CSS/JS frameworks; ships minimal assets
  • Uses Symfony HttpClient; config via Symfony config/env
  • CSRF-protected backend endpoint
  • Works with OpenAI or any OpenAI‑compatible server (base_url)

Requirements

  • PHP >= 8.1
  • Symfony ^5.4 | ^6.0 | ^7.0
  • Packages: symfony/framework-bundle, symfony/form, symfony/http-client, symfony/twig-bundle, symfony/security-csrf, symfony/asset

Installation

Install via Composer:

composer require richbrains/ai-textarea

If you don’t use Symfony Flex, enable the bundle:

// config/bundles.php
return [
    // ...
    RichBrains\AITextarea\AITextareaBundle::class => ['all' => true],
];

Import routes:

# config/routes/ai_textarea.yaml
ai_textarea:
  resource: '@AITextareaBundle/Resources/config/routes.yaml'

Configure the bundle:

# config/packages/ai_textarea.yaml
ai_textarea:
  api_key: '%env(AI_TEXTAREA_API_KEY)%'
  model: 'gpt-4o-mini'

Add your API key:

# .env.local
AI_TEXTAREA_API_KEY=sk-...

Publish assets (JS/CSS):

php bin/console assets:install --symlink --relative
# If symlinks don’t work (e.g., in multi-container Docker), run without --symlink:
# php bin/console assets:install

Usage

In a form type:

use RichBrains\AITextarea\Form\Type\AITextareaType;

$builder->add('content', AITextareaType::class, [
    'label' => 'Content',
    // Optional quick actions (shown as chips in the modal):
    'ai_actions' => ['friendly', 'professional', 'fix_grammar', 'shorter', 'longer'],
]);

What users see:

  • A small AI button next to the textarea
  • Modal with quick-action chips, custom prompt input, and result preview
  • Copy the result or Replace the original textarea value

Options

Global (config/packages/ai_textarea.yaml):

  • api_key (string|null): Your OpenAI(-compatible) key
  • model (string): Default gpt-4o-mini
  • base_url (string|null): Custom API base for compatible providers
  • system_prompt (string): System message for the assistant
$builder->add('content', AITextareaType::class, [
    'ai_actions' => ['fix_grammar', 'professional'],
]);

Customization

Override Twig theme (optional):

  1. Create templates/bundles/AITextareaBundle/form/ai_textarea.html.twig
  2. Copy the bundle’s template and modify it
  3. If needed (when other configs override themes):
twig:
  form_themes:
    - '@AITextarea/form/ai_textarea.html.twig'

Tweak styles via CSS variables in ai-textarea.css:

:root {
  --ai-textarea-bg: #0b1020;
  --ai-textarea-surface: #131a2b;
  --ai-textarea-text: #e8eefc;
  --ai-textarea-accent: #4f8cff;
  /* ... */
}

Security & Privacy

  • Enhance endpoint is CSRF-protected; ensure sessions are enabled
  • Optionally restrict access (firewall/access_control, voters)
  • Text is sent to the AI provider; ensure user consent and data policy compliance

Troubleshooting

Unknown function asset:

composer require symfony/asset

Ensure framework.assets: true and reinstall assets.

404 /bundles/aitextarea/ai-textarea.{js,css}:

  • Run php bin/console assets:install (avoid --symlink in multi-container setups)
  • Verify files exist under public/bundles/aitextarea/

No route for POST /_ai_textarea/enhance:

  • Ensure routes are imported
  • Check: php bin/console debug:router ai_textarea_enhance

403 Invalid CSRF token:

  • Ensure same session, no full-page caching, CSRF enabled

Cannot autowire TextEnhancer $apiKey:

  • Don’t auto-register the bundle classes via your app’s App: service resource
  • Let the bundle’s services.yaml provide the scalar args

Using other OpenAI‑compatible providers

Set base_url to the provider’s API root and pick the correct model. Example:

ai_textarea:
  api_key: '%env(AI_TEXTAREA_API_KEY)%'
  base_url: 'https://your-provider.example.com'
  model: 'gpt-4o-mini'   # or provider-specific model

How It Works

  • AITextareaType extends TextareaType, adding endpoint URL, CSRF token, and quick actions as data attributes
  • Twig theme includes the bundle’s JS/CSS and initializes the UI
  • Frontend modal collects text + instruction, POSTs to /_ai_textarea/enhance
  • Controller calls TextEnhancer which uses HttpClient to call an OpenAI‑compatible chat completions API and returns the improved text

Changelog

v0.1.0: Initial release with AITextareaType, modal UI, and OpenAI-compatible backend.