Mi aplicación se basa en Laravel 7 y usa graham-campbell/markdown v13.1 y webuni/commonmark-table-extension v2.1.

Me gustaría extender el entorno de rebajas con una clase que agregue las clases css de Bootstrap table table-striped table-bordered a la salida html renderizada en caso de que haya una tabla definida en el html.

Eché un vistazo a muchos ejemplos y se me ocurrió la siguiente solución que, desafortunadamente, no funciona.

Defino la extensión en un archivo App\Classes\Markdown\AddTableClassesExtension.php

<?php

namespace App\Classes\Markdown;

use League\CommonMark\ConfigurableEnvironmentInterface;
use League\CommonMark\Extension\ExtensionInterface;
use League\CommonMark\Extension\Table\Table;

class AddTableClassesExtension implements ExtensionInterface
{
    public function register(ConfigurableEnvironmentInterface $environment): void
    {
        $environment
            ->addBlockRenderer(Table::class, new \App\Classes\Markdown\AddTableClassesRenderer())
        ;
    }
}

El renderizador real que defino en un archivo App\Classes\Markdown\AddTableClassesRenderer

<?php

namespace App\Classes\Markdown;

use League\CommonMark\Block\Element\AbstractBlock;
use League\CommonMark\Block\Renderer\BlockRendererInterface;
use League\CommonMark\ElementRendererInterface;
use League\CommonMark\Extension\Table\Table;
use League\CommonMark\HtmlElement;

class AddTableClassesRenderer implements BlockRendererInterface {

public function render(AbstractBlock $block, ElementRendererInterface $htmlRenderer, bool $inTightList     = false)
    {
        if (!$block instanceof Table) {
            throw new \InvalidArgumentException('Incompatible block type: ' . get_class($block));
        }

        $attrs = [];

        // Add on the class we need:
        $attrs['class'] = $htmlRenderer->escape('table table-striped table-bordered', true);

        return new HtmlElement('table', $attrs, '', true);
    }

}

Y finalmente agrego mi extensión al archivo de configuración config\markdown.php

'extensions' => [
        App\Classes\Markdown\AddTableClassesExtension::class,
        League\CommonMark\Ext\Table\TableExtension::class,
    ],

Esta configuración crea tablas html, pero no agrega las clases css al atributo de tabla.

Cuando lo depuro, ni siquiera alcanzo mi código en la clase de renderizador. Para las pruebas, utilizo el siguiente método con una tabla de la documentación de League\CommonMark (https : //commonmark.thephpleague.com/1.5/extensions/tables/):

public function testMarkdownExtension()
{

    $string = "th | th(center) | th(right)
               ---|:----------:|----------:
               td | td         | td";

    echo Markdown::convertToHtml($string);
}

¿Qué debo hacer para que funcione esta extensión simple?

Muchas gracias por adelantado por su ayuda.

0
LaDude 1 sep. 2020 a las 10:31

1 respuesta

La mejor respuesta

Con la ayuda del problema Solicitud: posibilidad de agregar clases a las imágenes en GitHub Lo descubrí yo mismo.

Redefiní la clase de renderizado

namespace App\Classes\Markdown;

use League\CommonMark\Event\DocumentParsedEvent;
use League\CommonMark\Ext\Table\Table;

class AddTableClassesRenderer {

    /**
     * @param DocumentParsedEvent $e
     *
     * @return void
     */
    public function __invoke(DocumentParsedEvent $e)
    {
        $walker = $e->getDocument()->walker();

        while ($event = $walker->next()) {
            $node = $event->getNode();
            if ($node instanceof Table) {
                $node->data['attributes'] = array('class' => 'table table-striped table-bordered');
            }
        }
    }

}

Y cambié la clase de extensión

namespace App\Classes\Markdown;

use League\CommonMark\ConfigurableEnvironmentInterface;
use League\CommonMark\Event\DocumentParsedEvent;
use League\CommonMark\Extension\ExtensionInterface;

class AddTableClassesExtension implements ExtensionInterface
{
    public function register(ConfigurableEnvironmentInterface $environment): void
    {
            $environment
                ->addEventListener(DocumentParsedEvent::class, new AddTableClassesRenderer());
        ;
    }
}

Ahora, la tabla contiene las clases apropiadas.

<table class="table table-striped table-bordered">
   ...
0
LaDude 3 sep. 2020 a las 06:20