storyblok-richtext-renderer 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 2eb892e77eebea9767d260686015cff5f8948508939f2327a1fcab0494e34e78
+  data.tar.gz: 9f685e352c16d6c929bddf591f0f136aa42f5296ecabe29f5603a609b5ed85b9
+SHA512:
+  metadata.gz: 73b34ed7f2421bd114e770f4ea122a19d0651602901247c90edf8bf12c3cb68f76ba9e94750ec2258f7070dff6ecb0e9f80032ee5abe8fcf8060c6bd20dcd80c
+  data.tar.gz: 4800002870e1b0d0807ad2a0ded413e6aa4aebf337c4fa16ecec70c75c35309d39bb0a2ea1f7b18e57c4a712e24f0e535fe31c199d1e69a4cb51634a2354ae5d

data/.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true

data/.gitignore

@@ -0,0 +1,8 @@
+pkg
+doc/
+.yardoc/
+coverage
+Gemfile.lock
+.idea
+*.DS_Store
+.ruby-version

data/Gemfile

@@ -0,0 +1,3 @@
+source 'https://rubygems.org'
+
+gemspec

data/README.md

@@ -0,0 +1,23 @@
+# About
+
+This is Storyblok's rendering service to render html from the data of the richtext field type. The renderer is also compatible with Prosemirror's json format.
+
+## How to install
+
+Add the gem to your Gemfile
+
+```bash
+gem 'storyblok-richtext-renderer'
+```
+
+### Rendering a richtext field
+
+```
+renderer = Storyblok::Richtext::HtmlRenderer.new
+renderer.render({'type' => 'doc', 'content' => [{'type' => 'paragraph', 'content' => [{'text' => 'Good', 'type' => 'text'}]}]})
+# -> <p>Good</p>
+```
+
+### License
+
+This project is open-sourced software licensed under the [MIT license](http://opensource.org/licenses/MIT)

data/lib/storyblok/richtext.rb

@@ -0,0 +1,2 @@
+require 'richtext/version'
+require 'richtext/html_renderer'

data/lib/storyblok/richtext/html_renderer.rb

@@ -0,0 +1,162 @@
+require "cgi"
+
+module Storyblok
+  module Richtext
+    require_relative "html_renderer/marks/mark"
+    require_relative "html_renderer/marks/strike"
+    require_relative "html_renderer/marks/underline"
+    require_relative "html_renderer/marks/bold"
+    require_relative "html_renderer/marks/strong"
+    require_relative "html_renderer/marks/code"
+    require_relative "html_renderer/marks/italic"
+    require_relative "html_renderer/marks/link"
+    require_relative "html_renderer/nodes/node"
+    require_relative "html_renderer/nodes/bullet_list"
+    require_relative "html_renderer/nodes/code_block"
+    require_relative "html_renderer/nodes/hard_break"
+    require_relative "html_renderer/nodes/heading"
+    require_relative "html_renderer/nodes/image"
+    require_relative "html_renderer/nodes/list_item"
+    require_relative "html_renderer/nodes/ordered_list"
+    require_relative "html_renderer/nodes/paragraph"
+    require_relative "html_renderer/nodes/text"
+    require_relative "html_renderer/nodes/blockquote"
+    require_relative "html_renderer/nodes/horizontal_rule"
+    require_relative "html_renderer/nodes/text"
+    require_relative "html_renderer/nodes/blok"
+
+    class HtmlRenderer
+      def initialize
+        @marks = [
+          Storyblok::Richtext::Marks::Bold,
+          Storyblok::Richtext::Marks::Strike,
+          Storyblok::Richtext::Marks::Underline,
+          Storyblok::Richtext::Marks::Strong,
+          Storyblok::Richtext::Marks::Code,
+          Storyblok::Richtext::Marks::Italic,
+          Storyblok::Richtext::Marks::Link
+        ]
+        @nodes = [
+          Storyblok::Richtext::Nodes::HorizontalRule,
+          Storyblok::Richtext::Nodes::Blockquote,
+          Storyblok::Richtext::Nodes::BulletList,
+          Storyblok::Richtext::Nodes::CodeBlock,
+          Storyblok::Richtext::Nodes::HardBreak,
+          Storyblok::Richtext::Nodes::Heading,
+          Storyblok::Richtext::Nodes::Image,
+          Storyblok::Richtext::Nodes::ListItem,
+          Storyblok::Richtext::Nodes::OrderedList,
+          Storyblok::Richtext::Nodes::Paragraph,
+          Storyblok::Richtext::Nodes::Text,
+          Storyblok::Richtext::Nodes::Blok
+        ]
+      end
+
+      def set_component_resolver(component_resolver)
+        Storyblok::Richtext::Nodes::Blok.define_method :component_resolver, component_resolver
+      end
+
+      def add_node(node)
+        @nodes.push(node)
+      end
+
+      def add_mark(mark)
+        @marks.push(mark)
+      end
+
+      def render(data)
+        html = ""
+        data['content'].each do |node|
+          html += render_node(node)
+        end
+
+        html
+      end
+
+      private
+
+      def render_node(item)
+        html = []
+        if item['marks']
+          item['marks'].each do |m|
+            mark = get_matching_mark(m)
+            html.push(render_opening_tag(mark.tag)) if mark
+          end
+        end
+
+        node = get_matching_node(item)
+        html.push(render_opening_tag(node.tag)) if node and node.tag
+
+        if item['content']
+          item['content'].each do |content|
+            html.push(render_node(content))
+          end
+        elsif node and node.text
+          html.push(CGI.escapeHTML(node.text))
+        elsif node and node.single_tag
+          html.push(render_tag(node.single_tag))
+        elsif node and node.html
+          html.push(node.html)
+        end
+
+        html.push(render_closing_tag(node.tag)) if node and node.tag
+        if item['marks']
+          item['marks'].reverse.each do |m|
+            mark = get_matching_mark(m)
+            html.push(render_closing_tag(mark.tag)) if mark
+          end
+        end
+        return html.join("")
+      end
+
+      def render_tag(tags, ending = ' /')
+        return "<#{tags}#{ending}>" if tags.is_a? String
+        all = tags.map do |tag|
+          if tag.is_a? String
+            "<#{tag}#{ending}>"
+          else
+            h = "<#{tag[:tag]}"
+            tag[:attrs].to_h.each_pair { |key, value| h += " #{key}=\"#{CGI.escapeHTML(value)}\"" if !value.nil? } if tag[:attrs]
+            "#{h}#{ending}>"
+          end
+        end
+        return all.join('')
+      end
+
+      def render_opening_tag(tags)
+        render_tag(tags, '')
+      end
+
+      def render_closing_tag(tags)
+        return "</#{tags}>" if tags.is_a? String
+
+        all = tags.reverse.map do |tag|
+          if tag.is_a? String
+            "</#{tag}>"
+          else
+            "</#{tag[:tag]}>"
+          end
+        end
+        return all.join('')
+      end
+
+      def get_matching_node(item)
+        return get_matching_class(item, @nodes)
+      end
+
+      def get_matching_mark(item)
+        return get_matching_class(item, @marks)
+      end
+
+      def get_matching_class(node, classes)
+        found = classes.select do |clazz|
+          instance = clazz.new(node)
+          if (instance.matching())
+            return instance
+          end
+        end
+        found.first
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/bold.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Marks
+    class Bold < Mark
+
+      def matching
+        @node['type'] === 'bold'
+      end
+
+      def tag
+        'b'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/code.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Marks
+    class Code < Mark
+
+      def matching
+        @node['type'] === 'code'
+      end
+
+      def tag
+        'code'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/italic.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Marks
+    class Italic < Mark
+
+      def matching
+        @node['type'] === 'italic'
+      end
+
+      def tag
+        'i'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/link.rb

@@ -0,0 +1,17 @@
+module Storyblok::Richtext
+  module Marks
+    class Link < Mark
+
+      def matching
+        @node['type'] === 'link'
+      end
+
+      def tag
+        [{
+          tag: "a",
+          attrs: @node['attrs'].slice('href', 'target')
+        }]
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/mark.rb

@@ -0,0 +1,24 @@
+module Storyblok::Richtext
+  module Marks
+    class Mark
+      attr_writer :type
+
+      def type
+        @type || 'mark'
+      end
+
+      def initialize(data)
+        @node = data
+      end
+
+      def matching
+        false
+      end
+
+      def tag
+        nil
+      end
+
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/strike.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Marks
+    class Strike < Mark
+
+      def matching
+        @node['type'] === 'strike'
+      end
+
+      def tag
+        'strike'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/strong.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Marks
+    class Strong < Mark
+
+      def matching
+        @node['type'] === 'strong'
+      end
+
+      def tag
+        'strong'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/marks/underline.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Marks
+    class Underline < Mark
+
+      def matching
+        @node['type'] === 'underline'
+      end
+
+      def tag
+        'u'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/blockquote.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class Blockquote < Node
+
+      def matching
+        @node['type'] === 'blockquote'
+      end
+
+      def tag
+        'blockquote'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/blok.rb

@@ -0,0 +1,22 @@
+module Storyblok::Richtext
+  module Nodes
+    class Blok < Node
+
+      def matching
+        @node['type'] === 'blok'
+      end
+
+      def html
+        body = ''
+        @node['attrs']['body'].each do |blok|
+          body += component_resolver(blok['component'], blok)
+        end
+        body
+      end
+
+      def component_resolver component, data
+        ''
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/bullet_list.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class BulletList < Node
+
+      def matching
+        @node['type'] === 'bullet_list'
+      end
+
+      def tag
+        'ul'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/code_block.rb

@@ -0,0 +1,20 @@
+module Storyblok::Richtext
+  module Nodes
+    class CodeBlock < Node
+
+      def matching
+        @node['type'] === 'code_block'
+      end
+
+      def tag
+        [
+          'pre',
+          {
+            tag: 'code',
+            attrs: @node['attrs'].slice('class')
+          }
+        ]
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/hard_break.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class HardBreak < Node
+
+      def matching
+        @node['type'] === 'hard_break'
+      end
+
+      def single_tag
+        'br'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/heading.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class Heading < Node
+
+      def matching
+        @node['type'] === 'heading'
+      end
+
+      def tag
+        "h#{@node['attrs']['level']}"
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/horizontal_rule.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class HorizontalRule < Node
+
+      def matching
+        @node['type'] === 'horizontal_rule'
+      end
+
+      def single_tag
+        'hr'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/image.rb

@@ -0,0 +1,17 @@
+module Storyblok::Richtext
+  module Nodes
+    class Image < Node
+
+      def matching
+        @node['type'] === 'image'
+      end
+
+      def single_tag
+        [{
+          tag: "img",
+          attrs: @node['attrs'].slice('src', 'alt', 'title')
+        }]
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/list_item.rb

@@ -0,0 +1,13 @@
+module Storyblok::Richtext
+  module Nodes
+    class ListItem < Node
+      def matching
+        @node['type'] === 'list_item'
+      end
+
+      def tag
+        'li'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/node.rb

@@ -0,0 +1,37 @@
+module Storyblok::Richtext
+  module Nodes
+
+    class Node
+      attr_writer :wrapper
+      attr_writer :type
+
+      def type
+        @type || 'node'
+      end
+
+      def initialize(data)
+        @node = data
+      end
+
+      def matching
+        false
+      end
+
+      def single_tag
+        nil
+      end
+
+      def tag
+        nil
+      end
+
+      def text
+        nil
+      end
+
+      def html
+        nil
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/ordered_list.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class OrderedList < Node
+
+      def matching
+        @node['type'] === 'ordered_list'
+      end
+
+      def tag
+        'ol'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/paragraph.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class Paragraph < Node
+
+      def matching
+        @node['type'] === 'paragraph'
+      end
+
+      def tag
+        'p'
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/html_renderer/nodes/text.rb

@@ -0,0 +1,14 @@
+module Storyblok::Richtext
+  module Nodes
+    class Text < Node
+
+      def matching
+        @node['type'] === 'text'
+      end
+
+      def text
+        @node['text']
+      end
+    end
+  end
+end

data/lib/storyblok/richtext/version.rb

@@ -0,0 +1,6 @@
+module Storyblok
+  module Richtext
+    # Gem Version
+    VERSION = '0.0.1'
+  end
+end

data/storyblok.gemspec

@@ -0,0 +1,20 @@
+require File.expand_path('../lib/storyblok/richtext/version', __FILE__)
+
+Gem::Specification.new do |gem|
+  gem.name          = 'storyblok-richtext-renderer'
+  gem.version       = Storyblok::Richtext::VERSION
+  gem.summary       = 'Storyblok richtext renderer'
+  gem.description   = 'This is Storyblok\'s rendering service to render html from the data of the richtext field type. The renderer is compatible with Prosemirror\'s json format.'
+  gem.license       = 'MIT'
+  gem.authors       = ['Storyblok (Alexander Feiglstorfer)']
+  gem.email         = 'it@storyblok.com'
+  gem.homepage      = 'https://github.com/storyblok/storyblok-ruby-richtext-renderer'
+
+  gem.files         = Dir['{**/}{.*,*}'].select { |path| File.file?(path) && !path.start_with?('pkg') && !path.end_with?('.gem') }
+  gem.executables   = gem.files.grep(%r{^bin/}).map { |f| File.basename(f) }
+  gem.test_files    = gem.files.grep(%r{^spec/})
+  gem.require_paths = ['lib/storyblok']
+
+  gem.add_development_dependency 'bundler', '~> 1.5'
+  gem.add_development_dependency 'rspec', '~> 3'
+end

metadata

@@ -0,0 +1,105 @@
+--- !ruby/object:Gem::Specification
+name: storyblok-richtext-renderer
+version: !ruby/object:Gem::Version
+  version: 0.0.1
+platform: ruby
+authors:
+- Storyblok (Alexander Feiglstorfer)
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2019-09-08 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.5'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '1.5'
+- !ruby/object:Gem::Dependency
+  name: rspec
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3'
+description: This is Storyblok's rendering service to render html from the data of
+  the richtext field type. The renderer is compatible with Prosemirror's json format.
+email: it@storyblok.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".DS_Store"
+- ".editorconfig"
+- ".gitignore"
+- ".ruby-version"
+- Gemfile
+- README.md
+- lib/.DS_Store
+- lib/storyblok/.DS_Store
+- lib/storyblok/richtext.rb
+- lib/storyblok/richtext/html_renderer.rb
+- lib/storyblok/richtext/html_renderer/marks/bold.rb
+- lib/storyblok/richtext/html_renderer/marks/code.rb
+- lib/storyblok/richtext/html_renderer/marks/italic.rb
+- lib/storyblok/richtext/html_renderer/marks/link.rb
+- lib/storyblok/richtext/html_renderer/marks/mark.rb
+- lib/storyblok/richtext/html_renderer/marks/strike.rb
+- lib/storyblok/richtext/html_renderer/marks/strong.rb
+- lib/storyblok/richtext/html_renderer/marks/underline.rb
+- lib/storyblok/richtext/html_renderer/nodes/blockquote.rb
+- lib/storyblok/richtext/html_renderer/nodes/blok.rb
+- lib/storyblok/richtext/html_renderer/nodes/bullet_list.rb
+- lib/storyblok/richtext/html_renderer/nodes/code_block.rb
+- lib/storyblok/richtext/html_renderer/nodes/hard_break.rb
+- lib/storyblok/richtext/html_renderer/nodes/heading.rb
+- lib/storyblok/richtext/html_renderer/nodes/horizontal_rule.rb
+- lib/storyblok/richtext/html_renderer/nodes/image.rb
+- lib/storyblok/richtext/html_renderer/nodes/list_item.rb
+- lib/storyblok/richtext/html_renderer/nodes/node.rb
+- lib/storyblok/richtext/html_renderer/nodes/ordered_list.rb
+- lib/storyblok/richtext/html_renderer/nodes/paragraph.rb
+- lib/storyblok/richtext/html_renderer/nodes/text.rb
+- lib/storyblok/richtext/version.rb
+- storyblok.gemspec
+homepage: https://github.com/storyblok/storyblok-ruby-richtext-renderer
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib/storyblok
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.7.6
+signing_key: 
+specification_version: 4
+summary: Storyblok richtext renderer
+test_files: []