Merge pull request #225 from basemate/issue-183

ISSUE #183 Adds del component

Author: pascalwengerter

app/concepts/matestack/ui/core/del/del.haml

@@ -0,0 +1,5 @@
+%del{@tag_attributes.merge({:cite => options[:cite], :datetime => options[:datetime]})}
+  - if options[:text].nil? && block_given?
+    = yield
+  - else
+    = options[:text]

app/concepts/matestack/ui/core/del/del.rb

@@ -0,0 +1,4 @@
+module Matestack::Ui::Core::Del
+  class Del < Matestack::Ui::Core::Component::Static
+  end
+end

docs/components/del.md

@@ -0,0 +1,51 @@
+# matestack core component: Del
+
+Show [specs](/spec/usage/components/del_spec.rb)
+
+The HTML del tag implemented in ruby.
+
+## Parameters
+
+This component can take 2 optional configuration params and either yield content or display what gets passed to the `text` configuration param.
+
+#### # id (optional)
+Expects a string with all ids the del should have.
+
+#### # class (optional)
+Expects a string with all classes the del should have.
+
+#### # cite (optional)
+Expects a string with a URL to a document that explains the reason why the text was deleted.
+
+#### # datetime (optional)
+Expects a string which specifies the date and time of when the text was deleted.
+
+## Example 1: Yield a given block
+
+```ruby
+del id: "foo", class: "bar" do
+  plain 'Hello World' # optional content
+end
+```
+
+returns
+
+```html
+<del id="foo" class="bar">
+  Hello World
+</del>
+```
+
+## Example 2: Render options[:text] param
+
+```ruby
+del id: "foo", class: "bar", text: 'Hello World'
+```
+
+returns
+
+```html
+<del id="foo" class="bar">
+  Hello World
+</del>
+```

spec/usage/components/del_spec.rb

@@ -0,0 +1,66 @@
+require_relative "../../support/utils"
+include Utils
+RSpec::Support::ObjectFormatter.default_instance.max_formatted_output_length = 10_000
+describe 'Del Component', type: :feature, js: true do
+
+  it 'Example 1 - yield, no options[:text]' do
+
+    class ExamplePage < Matestack::Ui::Page
+
+      def response
+        components {
+          # simple del
+          del cite: 'http://citeurl.com', datetime: '2019-01-01T00:00:00Z' do
+            plain 'I am simple'
+          end
+
+          # enhanced del
+          del id: 'my-id', class: 'my-class', cite: 'http://citeurl.com', datetime: '2019-01-01T00:00:00Z' do
+            plain 'I am enhanced'
+          end
+        }
+      end
+
+    end
+
+    visit '/example'
+
+    static_output = page.html
+
+    expected_static_output = <<~HTML
+    <del cite=\"http://citeurl.com\" datetime=\"2019-01-01T00:00:00Z\">I am simple</del>
+    <del cite=\"http://citeurl.com\" datetime=\"2019-01-01T00:00:00Z\" id=\"my-id\" class=\"my-class\">I am enhanced</del>
+    HTML
+
+    expect(stripped(static_output)).to include(stripped(expected_static_output))
+  end
+
+  it 'Example 2 - render options[:text]' do
+
+    class ExamplePage < Matestack::Ui::Page
+
+      def response
+        components {
+          # simple del
+          del cite: 'http://citeurl.com', datetime: '2019-01-01T00:00:00Z', text: 'I am simple'
+
+          # enhanced del
+          del id: 'my-id', class: 'my-class', cite: 'http://citeurl.com', datetime: '2019-01-01T00:00:00Z', text: 'I am enhanced'
+        }
+      end
+
+    end
+
+    visit '/example'
+
+    static_output = page.html
+
+    expected_static_output = <<~HTML
+    <del cite=\"http://citeurl.com\" datetime=\"2019-01-01T00:00:00Z\">I am simple</del>
+    <del cite=\"http://citeurl.com\" datetime=\"2019-01-01T00:00:00Z\" id=\"my-id\" class=\"my-class\">I am enhanced</del>
+    HTML
+
+    expect(stripped(static_output)).to include(stripped(expected_static_output))
+  end
+
+end