skillfed

plugin-add-stimulus-controller

This skill scaffolds a Stimulus controller for Sylius plugins, creating the JS file and syncing declarations across package.json and controllers.json. It handles both admin and shop contexts with configurable lazy or eager loading modes.

plugin-add-stimulus-controller generates a Stimulus JS controller file and registers it in your Sylius plugin's configuration.

AI-generated summary based on this skill's SKILL.md

4 0 MIT updated by Guiziweb

Install

Guiziweb/guiziweb-plugins/plugin-add-stimulus-controller · repository language: TypeScript

CLI (skillfed)coming soon
git clone https://github.com/Guiziweb/guiziweb-plugins
cp -r guiziweb-plugins/plugins/sylius-plugin/skills/plugin-add-stimulus-controller ~/.claude/skills/plugin-add-stimulus-controller

Frequently asked questions

AI-generated answers based on this skill's SKILL.md and metadata

How do I add a Stimulus controller to a Sylius plugin?

plugin-add-stimulus-controller scaffolds a new Stimulus JavaScript controller file and automatically registers it in your Sylius plugin's package.json and controllers.json. The skill creates the controller with proper naming conventions, then syncs declarations across both configuration files so your controller is discoverable and loaded by Sylius's asset pipeline.

How to create Stimulus JS controller Sylius with lazy or eager fetch?

plugin-add-stimulus-controller supports both lazy and eager fetch modes during controller setup. You configure the fetch strategy when scaffolding—lazy mode defers controller loading until needed, while eager mode loads immediately. The skill applies your choice to the controllers.json entry, ensuring Stimulus respects your performance preference in the Sylius admin or shop context.

What is the Stimulus controller package.json Sylius registration process?

plugin-add-stimulus-controller automatically registers your controller in package.json under the controllers section with the correct namespace and path. It ensures the entry points to your generated JS file and includes metadata for Sylius's build system. The skill also updates controllers.json to maintain consistency across your plugin's controller declarations.

Why is my Stimulus controller not working in Sylius?

plugin-add-stimulus-controller helps troubleshoot by ensuring your controller is properly scaffolded and registered in both package.json and controllers.json. Common issues include missing data-controller attributes in Twig templates, incorrect fetch mode settings, or stale builds. Verify your Twig template includes data-controller="namespace--controller-name" and rebuild assets after running this skill.

How does plugin-add-stimulus-controller handle admin vs shop contexts?

plugin-add-stimulus-controller creates controllers for either admin or shop contexts based on your configuration. It places the controller file in the appropriate directory structure and registers it with the correct namespace in both package.json and controllers.json, ensuring Sylius loads it only in the intended context.

What Twig template integration does Stimulus controller setup require?

plugin-add-stimulus-controller generates the controller file and configuration, but you must add data-controller, data-action, and data-target attributes to your Twig templates. Use the format data-controller="namespace--controller-name" on the element you want to control, then reference your controller's actions and targets in the template to activate Stimulus behavior.

SKILL.md

rendered from the published skill — quoted content, verbatim

Add a Stimulus Controller to a Sylius Plugin

Ask the user for ControllerName, target (admin/shop), and fetch mode (lazy/eager) if not provided.


Context — how it works in a plugin

In a Sylius application, controllers in assets/controllers/ are auto-discovered.

In a Sylius plugin, controllers are declared as an npm package. The test application installs the plugin via "@vendor/my-plugin": "file:../../.." in its package.json. The stimulus-bridge resolves controller files by reading symfony.controllers from the plugin's package.json.

Two files must be in sync: - package.json → declares the controller and its JS file path - assets/{admin|shop}/controllers.json → enables it and sets fetch mode


1. Create the JS controller

assets/{admin|shop}/controllers/{ControllerName}Controller.js

```javascript import { Controller } from '@hotwired/stimulus';

export default class extends Controller { // expose methods

(truncated - see the full file via the links below)

Read as markdown · JSON record · Browse the source repository

File tree — 1 file
plugins/sylius-plugin/skills/plugin-add-stimulus-controller/SKILL.md

Related skills

Tags

frontend-framework asset-bundling event-driven-ui plugin-architecture stimulus-bridge controller-registration npm-package-integration twig-templating webpack-build-process interactive-components