Support for dark mode

Author: aarondfrancis

CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Added
+
+- Ability to set multiple themes for e.g. dark mode
+
 ## 0.5.3 - 2022-01-19
 
 ### Added

composer.json

@@ -19,7 +19,7 @@
     ],
     "require": {
         "php": "^7.2|^8.0",
-        "torchlight/torchlight-laravel": "^0.5.9",
+        "torchlight/torchlight-laravel": "dev-main",
         "league/commonmark": "^1.5|^2.0"
     },
     "require-dev": {

src/BaseExtension.php

@@ -21,7 +21,7 @@ abstract class BaseExtension
     protected $customBlockRenderer;
 
     /**
-     * @param  DocumentParsedEvent  $event
+     * @param DocumentParsedEvent $event
      */
     public function onDocumentParsed(DocumentParsedEvent $event)
     {
@@ -50,7 +50,7 @@ public function onDocumentParsed(DocumentParsedEvent $event)
     }
 
     /**
-     * @param  callable  $callback
+     * @param callable $callback
      * @return $this
      */
     public function useCustomBlockRenderer($callback)
@@ -66,7 +66,17 @@ public function useCustomBlockRenderer($callback)
     public function defaultBlockRenderer()
     {
         return function (Block $block) {
-            return "<pre><code {$block->attrsAsString()}class='{$block->classes}' style='{$block->styles}'>{$block->highlighted}</code></pre>";
+            $inner = '';
+
+            // Clones come from multiple themes.
+            $blocks = $block->clones();
+            array_unshift($blocks, $block);
+
+            foreach ($blocks as $block) {
+                $inner .= "<code {$block->attrsAsString()}class='{$block->classes}' style='{$block->styles}'>{$block->highlighted}</code>";
+            }
+
+            return "<pre>$inner</pre>";
         };
     }
 
@@ -84,13 +94,13 @@ abstract protected function getLiteralContent($node);
     /**
      * Bind into a Commonmark V1 or V2 environment.
      *
-     * @param $environment
-     * @param  string  $renderMethod
+     * @param        $environment
+     * @param string $renderMethod
      */
     protected function bind($environment, $renderMethod)
     {
         // We start by walking the document immediately after it's parsed
-        // to gather up all the code blocks and send off our requests.
+        // to gather all the code blocks and send off our requests.
         $environment->addEventListener(DocumentParsedEvent::class, [$this, 'onDocumentParsed']);
 
         foreach ($this->codeNodes() as $blockType) {

tests/BaseRendererTest.php

@@ -5,6 +5,7 @@
 use Illuminate\Support\Facades\Http;
 use Orchestra\Testbench\TestCase;
 use Torchlight\Block;
+use Torchlight\Commonmark\BaseExtension;
 
 abstract class BaseRendererTest extends TestCase
 {
@@ -24,6 +25,7 @@ protected function getEnvironmentSetUp($app)
             'block_id_3',
         ];
 
+        BaseExtension::$torchlightBlocks = [];
         Block::$generateIdsUsing = function () use (&$ids) {
             return array_shift($ids);
         };
@@ -299,6 +301,51 @@ public function it_sends_one_request_only_and_matches_by_id()
         $this->assertEquals($expected, $html);
     }
 
+    /** @test */
+    public function can_render_dark_and_light_themes()
+    {
+        $markdown = <<<'EOT'
+```php theme:dark:github-dark,light:github-light
+some php
+```
+EOT;
+
+        $response = [
+            'blocks' => [[
+                'id' => 'block_id_1',
+                'highlighted' => 'some php 1',
+            ],[
+                'id' => 'block_id_1_clone_0',
+                'highlighted' => 'some php 2',
+            ]]
+        ];
+
+        Http::fake([
+            'api.torchlight.dev/*' => Http::response($response, 200),
+        ]);
+
+        $html = $this->render($markdown);
+
+        Http::assertSentCount(1);
+
+        Http::assertSent(function ($request) {
+            return count($request['blocks']) === 2
+                && $request['blocks'][0]['theme'] === 'dark:github-dark'
+                && $request['blocks'][1]['theme'] === 'light:github-light'
+                && $request['blocks'][1]['id'] === 'block_id_1_clone_0';
+        });
+
+
+
+        $expected = <<<EOT
+<pre><code class='' style=''>some php 1</code><code class='' style=''>some php 2</code></pre>
+
+EOT;
+
+        $this->assertEquals($expected, $html);
+    }
+
+
     /** @test */
     public function it_can_set_a_custom_renderer()
     {