material-components-web 1.0.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +5 -0
- data/README.md +4 -4
- data/app/views/{material_components_web/_mdc_checkbox.html.erb → mozaic/_mdc-checkbox.html.erb} +3 -3
- data/app/views/{material_components_web/_mdc_form_field.html.erb → mozaic/_mdc-form-field.html.erb} +0 -0
- data/app/views/mozaic/_mdc-radio.html.erb +8 -0
- data/lib/material-components-web.rb +2 -0
- data/lib/material_components_web/components.rb +11 -0
- data/lib/material_components_web/version.rb +1 -1
- metadata +23 -14
- data/app/helpers/material_components_web/mdc_checkbox/README.md +0 -39
- data/app/helpers/material_components_web/mdc_checkbox/view_helper.rb +0 -19
- data/app/helpers/material_components_web/mdc_form_field/README.md +0 -23
- data/app/helpers/material_components_web/mdc_form_field/view_helper.rb +0 -14
- data/app/helpers/material_components_web/mdc_radio/README.md +0 -38
- data/app/helpers/material_components_web/mdc_radio/view_helper.rb +0 -19
- data/app/views/material_components_web/_mdc_radio.html.erb +0 -8
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: fd7b735ede4c8f71401b13bd28e3351954507ab01eb540f696c4a8b8861d1ecb
|
4
|
+
data.tar.gz: 4dcb97a32910262f8bdb3dd85c1b19229a53b2ac5896f52df355ca2a6b9af62c
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 001c44f9b76924d7f26aa26e93c8e66b21c5ead5d1d0b73f1940ce49e86d60c3bba3af51ee0c831e570a3dcc341225d9e2c35f5d47e0816535d201e91a54dc1b
|
7
|
+
data.tar.gz: 485ee2e4616c246cbce65344a488f3408cb6cb78b0646f4e45ead172776e618c8b1c58609fb0372a57deaad781cf4b7f6a34c7d6cd31e3b830f17489f10a5f27
|
data/CHANGELOG.md
CHANGED
data/README.md
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
|
3
3
|
[](https://badge.fury.io/rb/material-components-web) <img src="https://travis-ci.org/jonhue/material-components-web.svg?branch=master" />
|
4
4
|
|
5
|
-
Material Components Web for Rails provides a set of helpers simplifying the
|
5
|
+
Material Components Web for Rails provides a set of helpers simplifying the use of the [Material Components Web](https://github.com/material-components/material-components-web) library within your Rails app.
|
6
6
|
|
7
7
|
---
|
8
8
|
|
@@ -66,9 +66,9 @@ Then add [Material Components Web](https://github.com/material-components/materi
|
|
66
66
|
|
67
67
|
These are the material components currently supported by Material Components Web for Rails:
|
68
68
|
|
69
|
-
* [`mdc-checkbox`](
|
70
|
-
* [`mdc-form-field`](
|
71
|
-
* [`mdc-radio`](
|
69
|
+
* [`mdc-checkbox`](components/mdc-checkbox.md)
|
70
|
+
* [`mdc-form-field`](components/mdc-form-field.md)
|
71
|
+
* [`mdc-radio`](components/mdc-radio.md)
|
72
72
|
|
73
73
|
You feel a component is missing? Create an issue to make us aware, or implement it yourself. Pull requests are welcome.
|
74
74
|
|
data/app/views/{material_components_web/_mdc_checkbox.html.erb → mozaic/_mdc-checkbox.html.erb}
RENAMED
@@ -1,9 +1,9 @@
|
|
1
1
|
<div class="mdc-checkbox<%= ' mdc-checkbox--disabled' if options[:disabled] %>">
|
2
|
-
<input value="0" type="hidden" name="<%= options[:class_name] ? options[:class_name].to_s + '[' + attribute.to_s + ']' : attribute.to_s %>" />
|
3
|
-
<input checked="<%= options[:checked] %>" class="mdc-checkbox__native-control" type="checkbox" value="1" name="<%= options[:class_name] ? options[:class_name].to_s + '[' + attribute.to_s + ']' : attribute.to_s %>" id="<%= options[:class_name] ? options[:class_name].to_s + '_' + attribute.to_s : attribute.to_s %>" />
|
2
|
+
<input value="0" type="hidden" name="<%= options[:class_name] ? options[:class_name].to_s + '[' + options[:attribute].to_s + ']' : options[:attribute].to_s %>" />
|
3
|
+
<input checked="<%= options[:checked] %>" class="mdc-checkbox__native-control" type="checkbox" value="1" name="<%= options[:class_name] ? options[:class_name].to_s + '[' + options[:attribute].to_s + ']' : options[:attribute].to_s %>" id="<%= options[:class_name] ? options[:class_name].to_s + '_' + options[:attribute].to_s : options[:attribute].to_s %>" />
|
4
4
|
<div class="mdc-checkbox__background">
|
5
5
|
<svg class='mdc-checkbox__checkmark' viewBox='0 0 24 24'><path class='mdc-checkbox__checkmark__path' fill='none' stroke='white' d='M1.73,12.91 8.1,19.28 22.79,4.59'/></svg>
|
6
6
|
<div class="mdc-checkbox__mixedmark"></div>
|
7
7
|
</div>
|
8
8
|
</div>
|
9
|
-
<% if options[:label] %><label for="<%= options[:class_name] ? options[:class_name].to_s + '_' + attribute.to_s : attribute.to_s %>"><%= options[:label].html_safe %></label><% end %>
|
9
|
+
<% if options[:label] %><label for="<%= options[:class_name] ? options[:class_name].to_s + '_' + options[:attribute].to_s : options[:attribute].to_s %>"><%= options[:label].html_safe %></label><% end %>
|
data/app/views/{material_components_web/_mdc_form_field.html.erb → mozaic/_mdc-form-field.html.erb}
RENAMED
File without changes
|
@@ -0,0 +1,8 @@
|
|
1
|
+
<div class="mdc-radio<%= ' mdc-radio--disabled' if options[:disabled] %>">
|
2
|
+
<input checked="<%= options[:checked] %>" class="mdc-radio__native-control" type="radio" value="<%= options[:value] %>" name="<%= options[:class_name] ? options[:class_name].to_s + '[' + options[:attribute].to_s + ']' : options[:attribute].to_s %>" id="<%= options[:class_name] ? options[:class_name].to_s + '_' + options[:attribute].to_s + '_' + options[:value].to_s : options[:attribute].to_s + '_' + options[:value].to_s %>" />
|
3
|
+
<div class="mdc-radio__background">
|
4
|
+
<div class="mdc-radio__outer-circle"></div>
|
5
|
+
<div class="mdc-radio__inner-circle"></div>
|
6
|
+
</div>
|
7
|
+
</div>
|
8
|
+
<% if options[:label] %><label for="<%= options[:class_name] ? options[:class_name].to_s + '_' + options[:attribute].to_s + '_' + options[:value].to_s : options[:attribute].to_s + '_' + options[:value].to_s %>"><%= options[:label].html_safe %></label><% end %>
|
@@ -0,0 +1,11 @@
|
|
1
|
+
require 'mozaic'
|
2
|
+
|
3
|
+
module MaterialComponentsWeb
|
4
|
+
|
5
|
+
Mozaic.configure do |config|
|
6
|
+
config.define_component 'mdc-checkbox', class_name: false, label: false, checked: false, disabled: false
|
7
|
+
config.define_component 'mdc-form-field'
|
8
|
+
config.define_component 'mdc-radio', class_name: false, label: false, checked: false, disabled: false
|
9
|
+
end
|
10
|
+
|
11
|
+
end
|
metadata
CHANGED
@@ -1,17 +1,17 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: material-components-web
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version:
|
4
|
+
version: 2.0.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Jonas Hübotter
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2018-01-
|
11
|
+
date: 2018-01-10 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
|
-
name:
|
14
|
+
name: railties
|
15
15
|
requirement: !ruby/object:Gem::Requirement
|
16
16
|
requirements:
|
17
17
|
- - ">="
|
@@ -24,6 +24,20 @@ dependencies:
|
|
24
24
|
- - ">="
|
25
25
|
- !ruby/object:Gem::Version
|
26
26
|
version: '5.0'
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: mozaic
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - "~>"
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: '1.0'
|
34
|
+
type: :runtime
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - "~>"
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: '1.0'
|
27
41
|
- !ruby/object:Gem::Dependency
|
28
42
|
name: rspec
|
29
43
|
requirement: !ruby/object:Gem::Requirement
|
@@ -52,7 +66,7 @@ dependencies:
|
|
52
66
|
- - "~>"
|
53
67
|
- !ruby/object:Gem::Version
|
54
68
|
version: '0.52'
|
55
|
-
description: Provides a set of helpers simplifying the
|
69
|
+
description: Provides a set of helpers simplifying the use of the Material Components
|
56
70
|
Web library.
|
57
71
|
email: me@jonhue.me
|
58
72
|
executables: []
|
@@ -62,16 +76,11 @@ files:
|
|
62
76
|
- CHANGELOG.md
|
63
77
|
- LICENSE
|
64
78
|
- README.md
|
65
|
-
- app/
|
66
|
-
- app/
|
67
|
-
- app/
|
68
|
-
- app/helpers/material_components_web/mdc_form_field/view_helper.rb
|
69
|
-
- app/helpers/material_components_web/mdc_radio/README.md
|
70
|
-
- app/helpers/material_components_web/mdc_radio/view_helper.rb
|
71
|
-
- app/views/material_components_web/_mdc_checkbox.html.erb
|
72
|
-
- app/views/material_components_web/_mdc_form_field.html.erb
|
73
|
-
- app/views/material_components_web/_mdc_radio.html.erb
|
79
|
+
- app/views/mozaic/_mdc-checkbox.html.erb
|
80
|
+
- app/views/mozaic/_mdc-form-field.html.erb
|
81
|
+
- app/views/mozaic/_mdc-radio.html.erb
|
74
82
|
- lib/material-components-web.rb
|
83
|
+
- lib/material_components_web/components.rb
|
75
84
|
- lib/material_components_web/engine.rb
|
76
85
|
- lib/material_components_web/version.rb
|
77
86
|
- vendor/assets/javascripts/material-components-web.js
|
@@ -101,6 +110,6 @@ rubyforge_project:
|
|
101
110
|
rubygems_version: 2.7.4
|
102
111
|
signing_key:
|
103
112
|
specification_version: 4
|
104
|
-
summary: Provides a set of helpers simplifying the
|
113
|
+
summary: Provides a set of helpers simplifying the use of the Material Components
|
105
114
|
Web library
|
106
115
|
test_files: []
|
@@ -1,39 +0,0 @@
|
|
1
|
-
# Checkboxes
|
2
|
-
|
3
|
-
**[Demo & original documentation](https://github.com/material-components/material-components-web/tree/master/packages/mdc-checkbox)**
|
4
|
-
|
5
|
-
### Usage
|
6
|
-
|
7
|
-
```haml
|
8
|
-
= mdc_checkbox :attribute
|
9
|
-
```
|
10
|
-
|
11
|
-
This translates to:
|
12
|
-
|
13
|
-
```html
|
14
|
-
<div class="mdc-checkbox">
|
15
|
-
<input value="0" type="hidden" name="attribute" />
|
16
|
-
<input checked="false" class="mdc-checkbox__native-control" type="checkbox" value="1" name="attribute" id="attribute" />
|
17
|
-
<div class="mdc-checkbox__background">
|
18
|
-
<svg class='mdc-checkbox__checkmark' viewBox='0 0 24 24'><path class='mdc-checkbox__checkmark__path' fill='none' stroke='white' d='M1.73,12.91 8.1,19.28 22.79,4.59'/></svg>
|
19
|
-
<div class="mdc-checkbox__mixedmark"></div>
|
20
|
-
</div>
|
21
|
-
</div>
|
22
|
-
```
|
23
|
-
|
24
|
-
#### Javascript
|
25
|
-
|
26
|
-
To add JavaScript functionality, add the following snippet to your asset pipeline:
|
27
|
-
|
28
|
-
```js
|
29
|
-
$('.mdc-checkbox').each(function( i, obj ) {
|
30
|
-
var checkbox = new mdc.checkbox.MDCCheckbox(obj);
|
31
|
-
});
|
32
|
-
```
|
33
|
-
|
34
|
-
### Options
|
35
|
-
|
36
|
-
* **`class_name`** A string to indicate the class name of the object the attribute belongs to. Used to define the `type` and `id` attributes of the checkbox. Accepts a string or `false`. Can look like: `'user[settings]'`
|
37
|
-
* **`label`** A string as content of a label used to present information about the checkbox element to the user. Accepts a string or `false`. Can include HTML elements.
|
38
|
-
* **`checked`** Whether the checkbox element should be checked or not. Accepts a boolean.
|
39
|
-
* **`disabled`** Whether the checkbox element should be disabled or not. Accepts a boolean.
|
@@ -1,19 +0,0 @@
|
|
1
|
-
module MaterialComponentsWeb
|
2
|
-
module MdcCheckbox
|
3
|
-
module ViewHelper
|
4
|
-
|
5
|
-
def mdc_checkbox attribute, options = {}
|
6
|
-
defaults = {
|
7
|
-
class_name: false,
|
8
|
-
label: false,
|
9
|
-
checked: false,
|
10
|
-
disabled: false
|
11
|
-
}
|
12
|
-
defaults.merge! options
|
13
|
-
|
14
|
-
render partial: 'material_components_web/mdc_checkbox', locals: { attribute: attribute, options: options }
|
15
|
-
end
|
16
|
-
|
17
|
-
end
|
18
|
-
end
|
19
|
-
end
|
@@ -1,23 +0,0 @@
|
|
1
|
-
# Form Fields
|
2
|
-
|
3
|
-
**[Demo & original documentation](https://github.com/material-components/material-components-web/tree/master/packages/mdc-form-field)**
|
4
|
-
|
5
|
-
### Usage
|
6
|
-
|
7
|
-
```haml
|
8
|
-
= mdc_form_field do
|
9
|
-
...
|
10
|
-
```
|
11
|
-
|
12
|
-
This translates to:
|
13
|
-
|
14
|
-
```html
|
15
|
-
<div class="mdc-form-field">
|
16
|
-
...
|
17
|
-
</div>
|
18
|
-
```
|
19
|
-
|
20
|
-
### Options
|
21
|
-
|
22
|
-
* **`class`** Add classes to the generated `div`. Accepts a string.
|
23
|
-
* **`id`** Add an id to the generated `div`. Accepts a string.
|
@@ -1,14 +0,0 @@
|
|
1
|
-
module MaterialComponentsWeb
|
2
|
-
module MdcFormField
|
3
|
-
module ViewHelper
|
4
|
-
|
5
|
-
def mdc_form_field options = {}, &block
|
6
|
-
defaults = {}
|
7
|
-
defaults.merge! options
|
8
|
-
|
9
|
-
render partial: 'material_components_web/mdc_form_field', locals: { options: options, block: capture(&block) }
|
10
|
-
end
|
11
|
-
|
12
|
-
end
|
13
|
-
end
|
14
|
-
end
|
@@ -1,38 +0,0 @@
|
|
1
|
-
# Radio Buttons
|
2
|
-
|
3
|
-
**[Demo & original documentation](https://github.com/material-components/material-components-web/tree/master/packages/mdc-radio)**
|
4
|
-
|
5
|
-
### Usage
|
6
|
-
|
7
|
-
```haml
|
8
|
-
= mdc_radio :attribute, 'value'
|
9
|
-
```
|
10
|
-
|
11
|
-
This translates to:
|
12
|
-
|
13
|
-
```html
|
14
|
-
<div class="mdc-radio">
|
15
|
-
<input checked="false" class="mdc-radio__native-control" type="radio" value="value" name="attribute" id="attribute" />
|
16
|
-
<div class="mdc-radio__background">
|
17
|
-
<div class="mdc-radio__outer-circle"></div>
|
18
|
-
<div class="mdc-radio__inner-circle"></div>
|
19
|
-
</div>
|
20
|
-
</div>
|
21
|
-
```
|
22
|
-
|
23
|
-
#### Javascript
|
24
|
-
|
25
|
-
To add JavaScript functionality, add the following snippet to your asset pipeline:
|
26
|
-
|
27
|
-
```js
|
28
|
-
$('.mdc-radio').each(function( i, obj ) {
|
29
|
-
var radio = new mdc.radio.MDCRadio(obj);
|
30
|
-
});
|
31
|
-
```
|
32
|
-
|
33
|
-
### Options
|
34
|
-
|
35
|
-
* **`class_name`** A string to indicate the class name of the object the attribute belongs to. Used to define the `type` and `id` attributes of the radio button. Accepts a string or `false`. Can look like: `'user[settings]'`
|
36
|
-
* **`label`** A string as content of a label used to present information about the radio element to the user. Accepts a string or `false`. Can include HTML elements.
|
37
|
-
* **`checked`** Whether the radio element should be checked or not. Accepts a boolean.
|
38
|
-
* **`disabled`** Whether the radio element should be disabled or not. Accepts a boolean.
|
@@ -1,19 +0,0 @@
|
|
1
|
-
module MaterialComponentsWeb
|
2
|
-
module MdcRadio
|
3
|
-
module ViewHelper
|
4
|
-
|
5
|
-
def mdc_radio attribute, value, options = {}
|
6
|
-
defaults = {
|
7
|
-
class_name: false,
|
8
|
-
label: false,
|
9
|
-
checked: false,
|
10
|
-
disabled: false
|
11
|
-
}
|
12
|
-
defaults.merge! options
|
13
|
-
|
14
|
-
render partial: 'material_components_web/mdc_radio', locals: { attribute: attribute, value: value, options: options }
|
15
|
-
end
|
16
|
-
|
17
|
-
end
|
18
|
-
end
|
19
|
-
end
|
@@ -1,8 +0,0 @@
|
|
1
|
-
<div class="mdc-radio<%= ' mdc-radio--disabled' if options[:disabled] %>">
|
2
|
-
<input checked="<%= options[:checked] %>" class="mdc-radio__native-control" type="radio" value="<%= value %>" name="<%= options[:class_name] ? options[:class_name].to_s + '[' + attribute.to_s + ']' : attribute.to_s %>" id="<%= options[:class_name] ? options[:class_name].to_s + '_' + attribute.to_s : attribute.to_s %>" />
|
3
|
-
<div class="mdc-radio__background">
|
4
|
-
<div class="mdc-radio__outer-circle"></div>
|
5
|
-
<div class="mdc-radio__inner-circle"></div>
|
6
|
-
</div>
|
7
|
-
</div>
|
8
|
-
<% if options[:label] %><label for="<%= options[:class_name] ? options[:class_name].to_s + '_' + attribute.to_s : attribute.to_s %>"><%= options[:label].html_safe %></label><% end %>
|