Add sizes attribute

Plugin.php

@@ -103,7 +103,7 @@ class Plugin extends PluginBase
     public function registerMarkupTags() {
         return [
             'filters' => [
-                'resize' => fn ($media, $size = 'original') => app(CacheManager::class)->get($media, $size)
+                'resize' => fn ($media, $size = 'original', $sizes = null) => app(CacheManager::class)->get($media, $size, $sizes)
             ]
         ];
     }

classes/CacheManager.php

@@ -16,10 +16,10 @@ class CacheManager
         $this->fileObserver = $fileObserver;
     }
 
-    public function get(string $path, string $size): string
+    public function get(string $path, string $size, ?string $sizes): string
     {
-        return Cache::tags($this->getTag($path))
-            ->rememberForever($this->cacheKey($path, $size), fn () => $this->tag->generate($path, $size));
+        return Cache::tags($this->getTag($path, $sizes))
+            ->rememberForever($this->cacheKey($path, $size), fn () => $this->tag->generate($path, $size, $sizes));
     }
 
     public function delete(string $path): void

classes/TagGenerator.php

@@ -68,7 +68,7 @@ class TagGenerator {
             : null;
     }
 
-    public function generate(string $path, ?string $ratio = 'original'): string
+    public function generate(string $path, ?string $ratio = 'original', $sizes = null): string
     {
         $this->path = $path;
         $files = $this->possibleFiles($ratio);
@@ -77,9 +77,7 @@ class TagGenerator {
             return 'src="'.$this->media->findFiles($path)[0]->publicUrl.'"';
         }
 
-        $sizes = $files->map(function($file) {
-            return "(max-width: {$file->get('width')}px) {$file->get('width')}px";
-        });
+        $sizes = $this->parseSizes($files, $sizes);
 
         $srcset = $files->map(function($file) {
             return "{$file->get('url')} {$file->get('width')}w";
@@ -99,4 +97,22 @@ class TagGenerator {
             return "{$key}=\"{$value}\"";
         })->implode(' ');
     }
+
+    private function parseSizes(Collection $files, ?string $sizes = null): Collection
+    {
+        if (is_null($sizes)) {
+            return $files->map(function($file) {
+                return "(max-width: {$file->get('width')}px) {$file->get('width')}px";
+            });
+        }
+
+        $sizes = collect(explode('|', $sizes));
+        $minSize = $sizes->shift();
+
+        return $sizes->map(function($size) {
+            $components = explode(':', $size);
+
+            return "(min-width: {$components[0]}px) {$components[1]}";
+        })->push($minSize);
+    }
 }

tests/ImageTagTest.php

@@ -125,4 +125,18 @@ class ImageTagTest extends TestCase
         $this->assertEquals($output, Cache::tags(['resizer', 'resizer.pages/test.svg'])->get('resizer.original.pages/test.svg'));
     }
 
+    public function testGenerateSizesAttribute() 
+    {
+        Setting::set('folders', ['pages']);
+        Setting::set('sizes', []);
+        Setting::set('breakpoints', [100, 200]);
+        $this->media->put('/pages/test.jpg', UploadedFile::fake()->image('test.jpg', 500, 500)->get());
+        UploadedFile::fake()->image('test-100x100.jpg', 100, 100)->storeAs('uploads/public/c/pages', 'test-100x100.jpg');
+        UploadedFile::fake()->image('test-200x200.jpg', 200, 200)->storeAs('uploads/public/c/pages', 'test-200x200.jpg');
+        
+        $output = app(Twig::class)->parse('{{ "/pages/test.jpg" | resize("original", "1rem|200:10px|500:20px") }}');
+
+        $this->assertStringContainsString('sizes="(min-width: 200px) 10px, (min-width: 500px) 20px, 1rem"', $output);
+    }
+
 }