bulmacomp 0.1.2 → 1.0.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +32 -3
- data/app/components/bulmacomp/dropdown_component.rb +115 -0
- data/lib/bulmacomp/version.rb +1 -1
- metadata +19 -4
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 647bf29f1a9fab7a95e21df2d882988ec017f863d3810d921a2cb48669ff919f
|
|
4
|
+
data.tar.gz: 214f9696e9785dd75b54f503d91a050e3429b84b39ded5ce928635b8e22b7d13
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 85eff114f624eb7351346cc182ace4219e3b7914f72232aa955158119651aee2a9d03ac677eb33d007f06a4f73f0cb8792a750a033dff48b29dd8c0087f3a581
|
|
7
|
+
data.tar.gz: 722d8526dbdb501bfd1deb8f30a4a80a0ee7c16e35f8c5f789b44be8f894ca038172a53851203dd6d5778d7cd95946c863576d58a45a560d4f7cb06d4a92fc63
|
data/README.md
CHANGED
|
@@ -1,10 +1,23 @@
|
|
|
1
1
|
# Bulmacomp
|
|
2
|
+
[](https://badge.fury.io/rb/bulmacomp)
|
|
2
3
|
[](https://codeclimate.com/github/isprambiente/bulmacomp/maintainability)
|
|
3
4
|
[](https://github.com/isprambiente/bulmacomp/actions/workflows/rubyonrails.yml)
|
|
4
5
|
[](https://www.rubydoc.info/github/isprambiente/bulmacomp)
|
|
5
6
|
|
|
7
|
+
Bulmacomp is a [ViewComponent](https://viewcomponent.org/) collection for [Bulma](https://bulma.io/) css framework.
|
|
6
8
|
|
|
7
|
-
|
|
9
|
+
Bulmacomp provide a "view component" for each bulma component:
|
|
10
|
+
|
|
11
|
+
* [Breadcrumb](https://bulma.io/documentation/components/breadcrumb/) - [Bulmacomp::BreadcrumbComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/BreadcrumbComponent)
|
|
12
|
+
* [Card](https://bulma.io/documentation/components/card/) - [Bulmacomp::CardComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/CardComponent)
|
|
13
|
+
* [Dropdown](https://bulma.io/documentation/components/dropdown/) - [Bulmacomp::DropdownComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/DropdownComponent)
|
|
14
|
+
* [Menu](https://bulma.io/documentation/components/menu/) - [Bulmacomp::MenuComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/MenuComponent)
|
|
15
|
+
* [Message](https://bulma.io/documentation/components/message/) - [Bulmacomp::MessageComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/MessageComponent)
|
|
16
|
+
* [Modal](https://bulma.io/documentation/components/modal/) - [Bulmacomp::ModalCompoent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/ModalCompoent)
|
|
17
|
+
* [Navbar](https://bulma.io/documentation/components/navbar/) - [Bulmacomp::NavbarCompoent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/NavbarComponent)
|
|
18
|
+
* [Pagination](https://bulma.io/documentation/components/pagination/) - [Bulmacomp::PaginationComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/PaginationComponent)
|
|
19
|
+
* [Panel](https://bulma.io/documentation/components/panel/) - [Bulmacomp::PanelComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/PanelComponent)
|
|
20
|
+
* [Tabs](https://bulma.io/documentation/components/tabs/) - [Bulmacomp::TabsComponent](https://www.rubydoc.info/github/isprambiente/bulmacomp/Bulmacomp/tabsComponent)
|
|
8
21
|
|
|
9
22
|
## Installation
|
|
10
23
|
Add this line to your application's Gemfile:
|
|
@@ -24,10 +37,26 @@ $ gem install bulmacomp
|
|
|
24
37
|
```
|
|
25
38
|
|
|
26
39
|
## Usage
|
|
27
|
-
|
|
40
|
+
Bulmacomp provide standard view components. You can simply render of a new instance of the components with your parameters:
|
|
41
|
+
```ruby
|
|
42
|
+
render Bulmacomp::MessageComponent.new(title: 'example', close: true, close_options: {id: 'close'}) do
|
|
43
|
+
Some content
|
|
44
|
+
end
|
|
45
|
+
```
|
|
46
|
+
returns
|
|
47
|
+
```html
|
|
48
|
+
<article class="message">
|
|
49
|
+
<div class="message-header">
|
|
50
|
+
<p>Example</p>
|
|
51
|
+
<button id="close" class="delete" aria-label="delete" data-close='message'></button>
|
|
52
|
+
</div>
|
|
53
|
+
<div class="message-body">Some content</div>
|
|
54
|
+
</article>
|
|
55
|
+
```
|
|
56
|
+
You can get more details from [View Component site](https://viewcomponent.org/) and [Bulmacom documentation](https://rubydoc.info/github/isprambiente/bulmacomp/main)
|
|
28
57
|
|
|
29
58
|
## Contributing
|
|
30
|
-
|
|
59
|
+
Issues, forks and pull requests are welcomed
|
|
31
60
|
|
|
32
61
|
## License
|
|
33
62
|
The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
# frozen_string_literal: true
|
|
2
|
+
|
|
3
|
+
module Bulmacomp
|
|
4
|
+
# Make an html structure for a bulma dropdown
|
|
5
|
+
#
|
|
6
|
+
# @example empty dropdown
|
|
7
|
+
# render Bulmacomp::DropdownComponent.new()
|
|
8
|
+
#
|
|
9
|
+
# <div class="dropdown">
|
|
10
|
+
# <div class="dropdown-trigger">
|
|
11
|
+
# <button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
|
|
12
|
+
# <span class="icon is-small"><i class="fas fa-angle-down" aria-hidden="true"></i></span>
|
|
13
|
+
# </button>
|
|
14
|
+
# </div>
|
|
15
|
+
# <div class="dropdown-menu" role="menu">
|
|
16
|
+
# <div class="dropdown-content"></div>
|
|
17
|
+
# </div>
|
|
18
|
+
# </div>
|
|
19
|
+
# @example dropdown with title and elements
|
|
20
|
+
# render Bulmacomp::DropdownComponent.new(title: 'title', elements: [1,2])
|
|
21
|
+
#
|
|
22
|
+
# <div class="dropdown">
|
|
23
|
+
# <div class="dropdown-trigger">
|
|
24
|
+
# <button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
|
|
25
|
+
# <span>title</span>
|
|
26
|
+
# <span class="icon is-small"><i class="fas fa-angle-down" aria-hidden="true"></i></span>
|
|
27
|
+
# </button>
|
|
28
|
+
# </div>
|
|
29
|
+
# <div class="dropdown-menu" role="menu">
|
|
30
|
+
# <div class="dropdown-content">
|
|
31
|
+
# <div class="dropdown-item">1</div>
|
|
32
|
+
# <div class="dropdown-item">2</div>
|
|
33
|
+
# </div>
|
|
34
|
+
# </div>
|
|
35
|
+
# </div>
|
|
36
|
+
#
|
|
37
|
+
# @example dropdown with yield, elements and other option
|
|
38
|
+
# = render Bulmacomp::DropdownComponent.new(title: 'title', elements: [1,2], id: 'menu',
|
|
39
|
+
# button_options: {class: 'button is-success'}, icon: nil) do
|
|
40
|
+
# some content
|
|
41
|
+
#
|
|
42
|
+
# <div class="dropdown">
|
|
43
|
+
# <div class="dropdown-trigger">
|
|
44
|
+
# <button class="button is-success" aria-haspopup="true" aria-controls="dropdown-menu">
|
|
45
|
+
# <span>title</span>
|
|
46
|
+
# </button>
|
|
47
|
+
# </div>
|
|
48
|
+
# <div class="dropdown-menu" role="menu">
|
|
49
|
+
# <div class="dropdown-content">
|
|
50
|
+
# <div class="dropdown-item">1</div>
|
|
51
|
+
# <div class="dropdown-item">2</div>
|
|
52
|
+
# some content
|
|
53
|
+
# </div>
|
|
54
|
+
# </div>
|
|
55
|
+
# </div>
|
|
56
|
+
#
|
|
57
|
+
class DropdownComponent < ViewComponent::Base
|
|
58
|
+
# @param [Hash] opts
|
|
59
|
+
# options to generate content
|
|
60
|
+
# @option opts [String] title
|
|
61
|
+
# Content of button, default empty string
|
|
62
|
+
# @option opts [Array<String>] elements
|
|
63
|
+
# collection of dropdown-item
|
|
64
|
+
# @option opts [String] icon
|
|
65
|
+
# icon span class content for button,
|
|
66
|
+
# default: <i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
67
|
+
# @option opts {Hash} button_options
|
|
68
|
+
# options for button tag
|
|
69
|
+
# @option opts [String] :*
|
|
70
|
+
# each key going as content tag option, default is class: 'dropdown'
|
|
71
|
+
# @yield [optional] dropdown content
|
|
72
|
+
def initialize(title: nil, elements: [], icon: default_icon, button_options: {}, **opts)
|
|
73
|
+
super
|
|
74
|
+
@title = tag.span title if title.present?
|
|
75
|
+
@elements = elements
|
|
76
|
+
@icon = tag.span icon, class: 'icon is-small' if icon.present?
|
|
77
|
+
@button_options = default_button_options.merge(button_options)
|
|
78
|
+
@opts = default_opts.merge(opts)
|
|
79
|
+
end
|
|
80
|
+
|
|
81
|
+
# @return [String] default content for button icon
|
|
82
|
+
def default_icon
|
|
83
|
+
'<i class="fas fa-angle-down" aria-hidden="true"></i>'.html_safe
|
|
84
|
+
end
|
|
85
|
+
|
|
86
|
+
# @return [Hash] default option for content tag
|
|
87
|
+
def default_opts
|
|
88
|
+
{ class: 'dropdown' }
|
|
89
|
+
end
|
|
90
|
+
|
|
91
|
+
# return [Hash] default option for button tag
|
|
92
|
+
def default_button_options
|
|
93
|
+
{ class: 'button', aria: { haspopup: 'true', controls: 'dropdown-menu' } }
|
|
94
|
+
end
|
|
95
|
+
|
|
96
|
+
# Generated html string for bulma dropdown
|
|
97
|
+
# @return [String]
|
|
98
|
+
def call
|
|
99
|
+
tag.div safe_join([tag_trigger, tag_content]), **@opts
|
|
100
|
+
end
|
|
101
|
+
|
|
102
|
+
# generated html for '.dropdown-trigger' div
|
|
103
|
+
# @return [String]
|
|
104
|
+
def tag_trigger
|
|
105
|
+
tag.div tag.button(safe_join([@title, @icon]), **@button_options), class: 'dropdown-trigger'
|
|
106
|
+
end
|
|
107
|
+
|
|
108
|
+
# generated html for '.dropdown-content' div.
|
|
109
|
+
# Map each content of {elements} in a '.dropdown-item' div and add yield content
|
|
110
|
+
# @return [String]
|
|
111
|
+
def tag_content
|
|
112
|
+
tag.div safe_join([@elements.map { |e| tag.div(e, class: 'dropdown-item') }, content]), class: 'dropdown-content'
|
|
113
|
+
end
|
|
114
|
+
end
|
|
115
|
+
end
|
data/lib/bulmacomp/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: bulmacomp
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.1
|
|
4
|
+
version: 1.0.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- MDreW
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2023-03-
|
|
11
|
+
date: 2023-03-26 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: rails
|
|
@@ -24,6 +24,20 @@ dependencies:
|
|
|
24
24
|
- - ">="
|
|
25
25
|
- !ruby/object:Gem::Version
|
|
26
26
|
version: '7.0'
|
|
27
|
+
- !ruby/object:Gem::Dependency
|
|
28
|
+
name: view_component
|
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
|
30
|
+
requirements:
|
|
31
|
+
- - ">="
|
|
32
|
+
- !ruby/object:Gem::Version
|
|
33
|
+
version: '2.76'
|
|
34
|
+
type: :runtime
|
|
35
|
+
prerelease: false
|
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
37
|
+
requirements:
|
|
38
|
+
- - ">="
|
|
39
|
+
- !ruby/object:Gem::Version
|
|
40
|
+
version: '2.76'
|
|
27
41
|
description: Collection of view components for bulma css framework
|
|
28
42
|
email:
|
|
29
43
|
- andrea.ranaldi@gmail.com
|
|
@@ -36,6 +50,7 @@ files:
|
|
|
36
50
|
- Rakefile
|
|
37
51
|
- app/components/bulmacomp/breadcrumb_component.rb
|
|
38
52
|
- app/components/bulmacomp/card_component.rb
|
|
53
|
+
- app/components/bulmacomp/dropdown_component.rb
|
|
39
54
|
- app/components/bulmacomp/menu_component.rb
|
|
40
55
|
- app/components/bulmacomp/message_component.rb
|
|
41
56
|
- app/components/bulmacomp/modal_component.rb
|
|
@@ -52,8 +67,8 @@ licenses:
|
|
|
52
67
|
- MIT
|
|
53
68
|
metadata:
|
|
54
69
|
homepage_uri: https://github.com/isprambiente/bulmacomp
|
|
55
|
-
source_code_uri: https://github.com/
|
|
56
|
-
changelog_uri: https://github.com/
|
|
70
|
+
source_code_uri: https://github.com/isprambiente/bulmacomp
|
|
71
|
+
changelog_uri: https://github.com/isprambiente/bulmacomp
|
|
57
72
|
post_install_message:
|
|
58
73
|
rdoc_options: []
|
|
59
74
|
require_paths:
|