mayu-live 0.0.0

data/lib/mayu/resources/transformers/haml.test.rb

@@ -0,0 +1,114 @@
+# typed: true
+
+require "minitest/autorun"
+require "test_helper"
+
+require_relative "haml"
+require "rouge"
+
+class TestHaml < Minitest::Test
+  EXAMPLES_ROOT = File.join(__dir__, "__test__", "haml")
+
+  Dir[File.join(EXAMPLES_ROOT, "*.haml")].each do |input_path|
+    basename = File.basename(input_path, ".*")
+
+    if ENV["MATCH"] in String => match
+      next unless basename.include?(match)
+    end
+
+    skip_path = File.join(EXAMPLES_ROOT, "#{basename}.skip")
+    output_path = File.join(EXAMPLES_ROOT, "#{basename}.rb")
+
+    input = File.read(input_path)
+    expected = File.read(output_path)
+
+    define_method(:"test_#{basename}") do
+      T.bind(self, TestHaml)
+      skip File.read(skip_path) if File.exist?(skip_path)
+      actual = transform_and_format(input, path: input_path)
+      # File.write(output_path, actual)
+      assert_equal(expected, actual)
+    end
+  end
+
+  private
+
+  def transform_and_format_file(root:, path:)
+    transform_and_format(File.read(File.join(root, path)), path:)
+  end
+
+  def transform_and_format(
+    haml,
+    transform_elements_to_classes: false,
+    path: nil
+  )
+    transformed =
+      Mayu::Resources::Transformers::Haml.transform(
+        Mayu::Resources::Transformers::Haml::TransformOptions.new(
+          source: haml,
+          source_path: "app/components/MyComponent.haml",
+          source_line: 1,
+          content_hash: "abc123",
+          transform_elements_to_classes:
+        )
+      ).output
+
+    puts "\e[1mInput:\e[0;2m #{path}\e[0m"
+    puts prepend_line_numbers(
+           colorize_source(haml, Rouge::Lexers::Haml.new).each_line
+         )
+    handle_parse_error(transformed) do
+      formatted = SyntaxTree.format(transformed)
+      puts "\e[1mOutput:\e[0m"
+      puts prepend_line_numbers(
+             colorize_source(formatted, Rouge::Lexers::Ruby).each_line
+           )
+      puts
+      formatted
+    end
+  end
+
+  def handle_parse_error(source)
+    yield
+  rescue SyntaxTree::Parser::ParseError => e
+    start_line = [0, 0].max
+    formatted_source =
+      prepend_line_numbers(
+        extract_lines(source.to_s, start_line, -1),
+        start_line: start_line + 1,
+        error_line: e.lineno
+      ).join
+
+    Console.logger.error(self, <<~ERROR)
+      #{e.message} on line #{e.lineno} col #{e.column}
+      #{formatted_source}
+    ERROR
+
+    raise
+  end
+
+  def extract_lines(str, from, to)
+    str.each_line.to_a[from..to] || []
+  end
+
+  def colorize_source(source, lexer)
+    theme = Rouge::Themes::Monokai.new
+    formatter = Rouge::Formatters::Terminal256.new(theme:)
+    formatter.format(lexer.lex(source.chomp))
+  end
+
+  def prepend_line_numbers(lines, start_line: 1, error_line: nil)
+    number_format = "\e[38;5;250;48;5;236m%3d \e[0m"
+    error_format = "\e[41m%s\e[0m"
+
+    lines
+      .map
+      .with_index(start_line) do |line, i|
+        if error_line == i
+          format(error_format, line.chomp) + "\n"
+        else
+          line
+        end.prepend(format(number_format, i))
+      end
+  end
+end

data/lib/mayu/resources/types/README.md

@@ -0,0 +1,36 @@
+# Resources::Types
+
+These classes implement behaviors for different types of resources.
+
+Some resources can generate static files during build time.
+These static files should have a predictable filename based
+on the content hash + some options.
+Compressable types should be brotlied.
+The generated files could be named like this:
+
+    47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU=.css
+    47DEQpj8HBSa-_TImW-5JCeuQeRkm5NMpJWZG3hSuFU=.css.br
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=.png
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=640w.png
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=768w.png
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=960w.png
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=1024w.png
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=1366w.png
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=1600w.png
+    M4CmsIPAxdPZRaERcnCA8mL7whpfFfArIziflCS0iUY=1920w.png
+    eN3Sv_BzhBLUw72oUgA5sCa8YF74CJm0Z8Z97eQgofk=.css
+    eN3Sv_BzhBLUw72oUgA5sCa8YF74CJm0Z8Z97eQgofk=.css.br
+
+## Resources::Types::Component
+
+Loads a `.rb`-file or `.haml`-file and transpiles the latter,
+then evaluates the code in the scope of a new class that inherits
+`Mayu::Component::Base`.
+
+## Resources::Types::Image
+
+Loads an image, stores its size and information about which
+versions to generate for `srcset`.
+
+During build time it will generate smaller versions of the image,
+and store them in the configured directory for static files.

data/lib/mayu/resources/types/base.rb

@@ -0,0 +1,35 @@
+# frozen_string_literal: true
+# typed: strict
+
+require_relative "../resource"
+require_relative "../asset"
+
+module Mayu
+  module Resources
+    module Types
+      class Base
+        extend T::Sig
+
+        sig { params(resource: Resource).void }
+        def initialize(resource)
+          @resource = resource
+        end
+
+        sig { returns(T::Array[Asset]) }
+        def assets
+          []
+        end
+
+        sig { returns(String) }
+        def name
+          self.class.name.to_s.sub(/.*::/, "")
+        end
+
+        sig { params(assets_dir: String).returns(T::Array[Asset]) }
+        def generate_assets(assets_dir)
+          []
+        end
+      end
+    end
+  end
+end

data/lib/mayu/resources/types/component.rb

@@ -0,0 +1,198 @@
+# frozen_string_literal: true
+# typed: strict
+
+require_relative "base"
+require_relative "../../component/base"
+require_relative "../transformers/haml"
+
+module Mayu
+  module Resources
+    module Types
+      class Component < Base
+        module LoaderUtils
+          extend T::Sig
+
+          sig { params(mod: Module, resource: Resources::Resource).void }
+          def self.define_import(mod, resource)
+            mod.instance_exec(resource) do |resource|
+              define_singleton_method(:__resource) { resource }
+
+              sig do
+                params(path: String).returns(T.class_of(Mayu::Component::Base))
+              end
+              def self.import(path)
+                __resource.import(path) => Component => impl
+                impl.component
+              end
+
+              sig { params(path: String).returns(Image) }
+              def self.image(path)
+                __resource.import(path) => Image => impl
+                impl
+              end
+
+              sig { params(path: String).returns(SVG) }
+              def self.svg(path)
+                __resource.import(path) => SVG => impl
+                impl
+              end
+            end
+          end
+        end
+
+        extend T::Sig
+
+        ComponentBase = Mayu::Component::Base
+
+        sig { params(resource: Resource).void }
+        def initialize(resource)
+          @resource = resource
+
+          original_source = T.let(resource.read(encoding: "utf-8"), String)
+
+          source =
+            case File.extname(resource.path)
+            when ".haml"
+              transform_result =
+                Transformers::Haml.transform(
+                  Transformers::Haml::TransformOptions.new(
+                    source: original_source,
+                    source_path: resource.path,
+                    source_line: 1
+                  )
+                )
+              source = transform_result.output
+
+              @inline_css =
+                T.let(
+                  transform_result.css,
+                  T.nilable(Transformers::CSS::TransformResult)
+                )
+
+              source
+            else
+              original_source
+            end
+
+          @source = T.let(source, String)
+          @component = T.let(nil, T.nilable(T.class_of(ComponentBase)))
+        end
+
+        sig { returns(T::Array[Asset]) }
+        def assets
+          return [] unless @inline_css
+
+          source_map_link =
+            "\n/*# sourceMappingURL=#{@inline_css.filename}.map */\n"
+
+          [
+            Asset.new(
+              @inline_css.filename,
+              Generators::WriteFile.new(
+                contents: @inline_css.output + source_map_link,
+                compress: true
+              )
+            ),
+            Asset.new(
+              @inline_css.filename + ".map",
+              Generators::WriteFile.new(
+                contents: JSON.generate(@inline_css.source_map),
+                compress: true
+              )
+            )
+          ]
+        end
+
+        sig { returns(T.class_of(ComponentBase)) }
+        def component
+          @component ||= setup_component
+        end
+
+        sig { returns(T.class_of(Mayu::Component::Base)) }
+        def setup_component
+          impl = Class.new(Mayu::Component::Base)
+
+          LoaderUtils.define_import(impl, @resource)
+
+          impl.__mayu_resource = @resource
+
+          impl.const_set(:INLINE_CSS_ASSETS, assets)
+          impl.const_set(:H, Mayu::VDOM::H)
+
+          begin
+            # $stderr.puts "\e[33m#{@source}\e[0m"
+            impl.class_eval(@source, @resource.path, 1)
+          rescue SyntaxTree::Parser::ParseError => e
+            $stderr.puts "\e[31mError parsing #{@resource.path}:#{e.lineno} #{e.message}\e[0m"
+
+            puts "Error on line #{e.lineno}"
+            @source
+              .each_line
+              .with_index(1) do |line, lineno|
+                if lineno == e.lineno
+                  puts "\e[31m#{line.chomp}\e[0m"
+                else
+                  puts "\e[33m#{line.chomp}\e[0m"
+                end
+              end
+          rescue => e
+            backtrace =
+              [*e.backtrace].reject { _1.include?("/gems/sorbet-runtime-") }
+                .join("\n")
+            $stderr.puts "\e[31mError loading #{@resource.path}: #{e.class.name}: #{e.message}\n\e[33m#{backtrace}\e[0m"
+            $stderr.puts "\e[33m#{@source}\e[0m"
+            raise "Error parsing #{@resource.absolute_path}"
+          end
+
+          styles =
+            @resource.registry.add_resource(
+              @resource.path.sub(/\.\w+\z/, ".css")
+            )
+
+          @resource.registry.dependency_graph.add_dependency(
+            @resource.path,
+            styles.path
+          )
+
+          classes = T.let(Hash.new, T::Hash[Symbol, String])
+
+          if styles.type.is_a?(Types::Stylesheet)
+            classes.merge!(styles.type.classes)
+
+            impl.instance_exec(styles) do |styles|
+              define_singleton_method(:stylesheet) { styles.type }
+            end
+          end
+
+          classes.merge!(@inline_css.classes) if @inline_css
+
+          unless classes.empty?
+            impl.instance_exec(
+              Resources::Types::Stylesheet::ClassNames.new(classes)
+            ) do |classnames|
+              define_singleton_method(:styles) { classnames }
+              define_method(:styles) { classnames }
+            end
+          end
+
+          impl
+        end
+
+        MarshalFormat =
+          T.type_alias do
+            [String, T.nilable(Transformers::CSS::TransformResult)]
+          end
+
+        sig { returns(MarshalFormat) }
+        def marshal_dump
+          [@source, @inline_css]
+        end
+
+        sig { params(args: MarshalFormat).void }
+        def marshal_load(args)
+          @source, @inline_css = args
+        end
+      end
+    end
+  end
+end

data/lib/mayu/resources/types/image.rb

@@ -0,0 +1,169 @@
+# frozen_string_literal: true
+# typed: strict
+
+require "image_size"
+require "base64"
+require_relative "base"
+
+module Mayu
+  module Resources
+    module Types
+      class Image < Base
+        extend T::Sig
+
+        FORMATS = T.let([:webp], T::Array[Symbol])
+
+        BREAKPOINTS =
+          T.let(
+            [120, 240, 320, 640, 768, 960, 1024, 1366, 1600, 1920, 3840].freeze,
+            T::Array[Integer]
+          )
+
+        class ImageDescriptor < T::Struct
+          const :format, Symbol
+          const :width, Integer
+          const :height, Integer
+          const :filename, String
+        end
+
+        sig { returns(ImageDescriptor) }
+        attr_reader :original
+        sig { returns(T::Array[ImageDescriptor]) }
+        attr_reader :versions
+        sig { returns(String) }
+        attr_reader :blur
+
+        sig { params(resource: Resource).void }
+        def initialize(resource)
+          @resource = resource
+
+          content_hash = Base64.urlsafe_encode64(resource.content_hash)
+          image_size = ImageSize.path(resource.absolute_path)
+
+          extname = File.extname(resource.path)
+          filename = "#{content_hash}.#{image_size.format}"
+
+          @original =
+            T.let(
+              ImageDescriptor.new(
+                format: image_size.format,
+                width: image_size.width,
+                height: image_size.height,
+                filename: filename
+              ),
+              ImageDescriptor
+            )
+
+          breakpoints =
+            BREAKPOINTS.select { _1 < image_size.width }.sort.reverse
+          aspect_ratio = image_size.height / image_size.width.to_f
+
+          formats = [image_size.format, *FORMATS].uniq
+
+          @blur =
+            T.let(
+              [
+                "convert",
+                resource.absolute_path,
+                "-resize",
+                "16x16>",
+                "-strip",
+                "png:-"
+              ].then { Shellwords.shelljoin(_1) }
+                .then { `#{_1}` }
+                .then { Base64.strict_encode64(_1) }
+                .prepend("data:image/png;base64,"),
+              String
+            )
+
+          @versions =
+            T.let(
+              formats
+                .map do |format|
+                  breakpoints.map do |width|
+                    ImageDescriptor.new(
+                      format: format,
+                      width:,
+                      height: (width * aspect_ratio).to_i,
+                      filename: "#{content_hash}#{width}w.#{format}"
+                    )
+                  end
+                end
+                .flatten,
+              T::Array[ImageDescriptor]
+            )
+        end
+
+        sig { returns(T::Array[Asset]) }
+        def assets
+          [
+            Asset.new(
+              @original.filename,
+              Generators::CopyFile.new(@resource.absolute_path)
+            ),
+            *@versions.map do |version|
+              Asset.new(
+                version.filename,
+                Generators::Image.new(@resource.absolute_path, version)
+              )
+            end
+          ]
+        end
+
+        sig { params(asset_dir: String).returns(T::Array[Asset]) }
+        def generate_assets(asset_dir)
+          assets.each { |asset| asset.process(asset_dir) }
+        end
+
+        sig { returns(String) }
+        def src
+          "/__mayu/static/#{@original.filename}"
+        end
+
+        sig { returns(String) }
+        def srcset
+          [@original, *@versions.filter { _1.format == :webp }].map do |version|
+              "/__mayu/static/#{version.filename} #{version.width}w"
+            end
+            .reverse
+            .join(",")
+        end
+
+        sig { returns(String) }
+        def sizes
+          [
+            "100vw",
+            *@versions
+              .filter { _1.format == :webp }
+              .map do |version|
+                "(max-width: #{version.width}px) #{version.width}px"
+              end
+          ].reverse.join(", ")
+        end
+
+        sig { returns(Float) }
+        def aspect_ratio
+          original.width / original.height.to_f
+        end
+
+        MarshalFormat =
+          T.type_alias { [ImageDescriptor, T::Array[ImageDescriptor], String] }
+
+        sig { returns(MarshalFormat) }
+        def marshal_dump
+          [@original, @versions, @blur]
+        end
+
+        sig { params(args: MarshalFormat).void }
+        def marshal_load(args)
+          @original, @versions, @blur = args
+        end
+
+        sig { returns(String) }
+        def inspect
+          "#<Image src=#{src.inspect}>"
+        end
+      end
+    end
+  end
+end

data/lib/mayu/resources/types/javascript.rb

@@ -0,0 +1,50 @@
+# typed: strict
+# frozen_string_literal: true
+
+require "brotli"
+
+module Mayu
+  module Resources
+    module Types
+      class JavaScript < Base
+        extend T::Sig
+
+        sig { returns(String) }
+        attr_reader :filename
+
+        sig { params(resource: Resource).void }
+        def initialize(resource)
+          super
+          @filename =
+            T.let(
+              Base64.urlsafe_encode64(@resource.content_hash).+(".js").freeze,
+              String
+            )
+          @source = T.let(resource.read(encoding: "utf-8").freeze, String)
+        end
+
+        sig { returns(T::Array[Asset]) }
+        def assets
+          [
+            Asset.new(
+              filename,
+              Generators::WriteFile.new(contents: @source, compress: true)
+            )
+          ]
+        end
+
+        MarshalFormat = T.type_alias { [String, String] }
+
+        sig { returns(MarshalFormat) }
+        def marshal_dump
+          [@filename, @source]
+        end
+
+        sig { params(args: MarshalFormat).void }
+        def marshal_load(args)
+          @filename, @source = args
+        end
+      end
+    end
+  end
+end

data/lib/mayu/resources/types/nil.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+# typed: strict
+
+require_relative "base"
+
+module Mayu
+  module Resources
+    module Types
+      class Nil < Base
+        extend T::Sig
+
+        sig { returns(NilClass) }
+        def marshal_dump
+          nil
+        end
+
+        sig { params(args: NilClass).void }
+        def marshal_load(args)
+        end
+      end
+    end
+  end
+end