Skip to content

Add dd component. #217

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Oct 4, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions app/concepts/matestack/ui/core/dd/dd.haml
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
%dd{@tag_attributes}
- if options[:text].nil? && block_given?
= yield
- else
= options[:text]
5 changes: 5 additions & 0 deletions app/concepts/matestack/ui/core/dd/dd.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
module Matestack::Ui::Core::Dd
class Dd < Matestack::Ui::Core::Component::Static

end
end
46 changes: 46 additions & 0 deletions docs/components/dd.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
# matestack core component: Dd

Show [specs](/spec/usage/components/dd_spec.rb)

The HTML dd tag implemented in ruby.

## Parameters

This component can take 3 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 `dd` should have.

#### # class (optional)
Expects a string with all classes the `dd` should have.

## Example 1: Yield a given block

```ruby
dd id: "foo", class: "bar" do
plain 'Hello World'
end
```

returns

```html
<dd id="foo" class="bar">
Hello World
</dd>
```

## Example 2: Render options[:text] param

```ruby
dd id: "foo", class: "bar", text: 'Hello World'
```

returns

```html
<dd id="foo" class="bar">
Hello World
</dd>
```

64 changes: 64 additions & 0 deletions spec/usage/components/dd_spec.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
require_relative "../../support/utils"
include Utils

describe 'Dd Component', type: :feature, js: true do

it 'Example 1 - yield, no options[:text]' do

class ExamplePage < Matestack::Ui::Page

def response
components {
# simple dd tag
dd do
plain 'This is simple dd text'
end

# enhanced dd tag
dd id: 'my-id', class: 'my-class' do
plain 'This is a enhanced dd with text'
end
}
end

end

visit '/example'
static_output = page.html

expected_static_output = <<~HTML
<dd>This is simple dd text</dd>
<dd id="my-id" class="my-class">This is a enhanced dd with text</dd>
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 dd tag
dd text: 'This is simple dd text'

# enhanced dd tag
dd id: 'my-id', class: 'my-class', text: 'This is a enhanced dd with text'
}
end

end

visit '/example'

static_output = page.html

expected_static_output = <<~HTML
<dd>This is simple dd text</dd>
<dd id="my-id" class="my-class">This is a enhanced dd with text</dd>
HTML

expect(stripped(static_output)).to include(stripped(expected_static_output))
end

end