drupol/ecl-twig-bundle

Use the ECL Twig in your Symfony applications.

0.1.6 2019-11-28 21:54 UTC

Requires

• php: >= 7.1.3
• ec-europa/ecl-twig: ^2.16.0
• symfony/framework-bundle: ^4.0 || ^5.0

Requires (Dev)

• drupol/php-conventions: ^1.6

MIT

README

Use the ECL Twig framework in your Symfony applications.

This bundle will download the ECL Twig framework and do the necessary to provide a way to use its components within your application.

It will also provides Twig namespaces automatically.

Requirements

• PHP >= 7.1.3

Limitations

This package does not provide the CSS and the JS files (yet?), feel free to use the CDN version in the meantime (README).

Installation

composer require drupol/ecl-twig-bundle

Then and optionally, you can create a file config/packages/ecl_twig.yaml containing:

ecl_twig:
    namespace: ec

To specify which preset will be the default one. By default, that value is set to ec even if the configuration file does not exists.

We will provide very soon a Symfony Flex recipe so the manual creation of this file will not be necessary anymore.

Usage

Here's a basic example of a simple Symfony controller:

<?php

declare(strict_types=1);

namespace App\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Routing\Annotation\Route;

class Ecl extends AbstractController
{
    /**
     * @Route("/ecl")
     */
    public function ecl()
    {
        return $this->render(
            '@ecl-twig/ec-component-button/ecl-button.html.twig',
            [
                'text' => 'foo',
                'disabled' => 'false',
                'icon' => [
                    'name' => 'plop',
                ],
            ]
        );
    }
}

To check what are the namespaces and the paths that this bundle adds, use the console command:

./bin/console debug:twig

An ECL component can be referenced using multiple notations.

Let's say you want to display the button component.

As there might be multiple flavor (or presets) of ECL, the button component will be in a directory that follows the following pattern:

vendor/ec-europa/ecl-twig/src/[PRESET]/packages/ec-component-button/ecl-button.html.twig

Then, if you want to you can use one of the following notation:

• @ecl-twig/ec-component-button/ecl-button.html.twig

Those names will reference the same file in the ECL Twig sources.

If you use the last notation ecl-button.html.twig, then the preset ec will be the default. Create a config file to override the parameter in config/packages/ecl_twig.yaml:

ecl_twig:
    namespace: ec

Then, loading the component:

• @ecl-twig/ec-component-button/ecl-button.html.twig
• ec-component-button/ecl-button.html.twig
• ecl-button.html.twig

Will respectively load:

• vendor/ec-europa/ecl-twig/src/ec/packages/ec-component-button/ecl-button.html.twig
• vendor/ec-europa/ecl-twig/src/ec/packages/ec-component-button/ecl-button.html.twig
• vendor/ec-europa/ecl-twig/src/ec/packages/ec-component-button/ecl-button.html.twig