komponent 2.2.0 → 3.0.0.beta1
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 +5 -5
- data/.editorconfig +14 -0
- data/.gitignore +2 -0
- data/.rubocop.yml +10 -7
- data/.travis.yml +4 -5
- data/Appraisals +15 -0
- data/CHANGELOG.md +19 -1
- data/Gemfile +1 -0
- data/README.md +75 -25
- data/app/controllers/komponent/styleguide_controller.rb +20 -0
- data/app/views/komponent/styleguide/index.html.erb +9 -0
- data/app/views/komponent/styleguide/missing_template.html.erb +3 -0
- data/app/views/komponent/styleguide/show.html.erb +1 -0
- data/app/views/layouts/komponent.html.erb +17 -0
- data/config/routes.rb +5 -0
- data/komponent.gemspec +6 -5
- data/lib/generators/component/component_generator.rb +19 -3
- data/lib/generators/component/templates/examples.html.erb.erb +3 -0
- data/lib/generators/component/templates/examples.html.haml.erb +3 -0
- data/lib/generators/component/templates/examples.html.slim.erb +3 -0
- data/lib/generators/component/templates/stimulus_view.html.haml.erb +1 -1
- data/lib/generators/component/templates/view.html.haml.erb +1 -1
- data/lib/generators/komponent/examples_generator.rb +40 -0
- data/lib/generators/komponent/install_generator.rb +37 -41
- data/lib/generators/komponent/styleguide_generator.rb +41 -0
- data/lib/generators/komponent/templates/styleguide/components/container/_komponent_container.html.erb +3 -0
- data/lib/generators/komponent/templates/styleguide/components/container/komponent_container.css +17 -0
- data/lib/generators/komponent/templates/styleguide/components/container/komponent_container.js +1 -0
- data/lib/generators/komponent/templates/styleguide/components/container/komponent_container_component.rb +5 -0
- data/lib/generators/komponent/templates/styleguide/components/footer/_komponent_footer.html.erb +3 -0
- data/lib/generators/komponent/templates/styleguide/components/footer/komponent_footer.css +27 -0
- data/lib/generators/komponent/templates/styleguide/components/footer/komponent_footer.js +1 -0
- data/lib/generators/komponent/templates/styleguide/components/footer/komponent_footer_component.rb +5 -0
- data/lib/generators/komponent/templates/styleguide/components/header/_komponent_header.html.erb +3 -0
- data/lib/generators/komponent/templates/styleguide/components/header/komponent_header.css +15 -0
- data/lib/generators/komponent/templates/styleguide/components/header/komponent_header.js +1 -0
- data/lib/generators/komponent/templates/styleguide/components/header/komponent_header_component.rb +5 -0
- data/lib/generators/komponent/templates/styleguide/components/index.js +4 -0
- data/lib/generators/komponent/templates/styleguide/components/sidebar/_komponent_sidebar.html.erb +10 -0
- data/lib/generators/komponent/templates/styleguide/components/sidebar/komponent_sidebar.css +43 -0
- data/lib/generators/komponent/templates/styleguide/components/sidebar/komponent_sidebar.js +1 -0
- data/lib/generators/komponent/templates/styleguide/components/sidebar/komponent_sidebar_component.rb +5 -0
- data/lib/generators/komponent/templates/styleguide/packs/komponent.js +2 -0
- data/lib/generators/komponent/utils.rb +49 -0
- data/lib/komponent.rb +2 -2
- data/lib/komponent/component.rb +55 -0
- data/lib/komponent/component_path_resolver.rb +6 -6
- data/lib/komponent/component_renderer.rb +3 -1
- data/lib/komponent/{railtie.rb → engine.rb} +21 -1
- data/lib/komponent/komponent_helper.rb +29 -0
- data/lib/komponent/rails/tasks/komponent.rake +12 -0
- data/lib/komponent/translation.rb +15 -3
- data/lib/komponent/version.rb +1 -1
- metadata +62 -18
- data/gemfiles/Gemfile-rails.4.2.x +0 -8
- data/gemfiles/Gemfile-rails.5.0.x +0 -8
- data/gemfiles/Gemfile-rails.5.1.x +0 -8
- data/gemfiles/Gemfile-rails.5.2.x +0 -8
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
|
-
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
2
|
+
SHA256:
|
3
|
+
metadata.gz: 771cfe13a6b0819f90aa68ca915ab8ae03103d24059e78b80daf4a8aeb8d04bd
|
4
|
+
data.tar.gz: 470dd7ad644217fd257f30d0e267951e8520041cf0e9acbf274a7377fcd52fc1
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: ec526ec6e340a674101e894944ad486155a77db9516e2f45b9778ed925c8cc9e05193f3b5d4e11144c30f9b33376de07960053b8020ed532a4ee4d1d773cac8f
|
7
|
+
data.tar.gz: c74cb8685aeb47b9ee9275e22fc9f5dafe56bc5b58644207954ab5fecd9e192464859908d55cc878f3afd42e349a739fcbc6c7b2622165e086d37f03ff4eebad
|
data/.editorconfig
ADDED
@@ -0,0 +1,14 @@
|
|
1
|
+
; top-most EditorConfig file
|
2
|
+
root = true
|
3
|
+
|
4
|
+
; Unix-style newlines
|
5
|
+
[*]
|
6
|
+
end_of_line = LF
|
7
|
+
indent_style = space
|
8
|
+
indent_size = 2
|
9
|
+
charset = utf-8
|
10
|
+
trim_trailing_whitespace = true
|
11
|
+
insert_final_newline = true
|
12
|
+
|
13
|
+
[*.md]
|
14
|
+
trim_trailing_whitespace = false
|
data/.gitignore
CHANGED
data/.rubocop.yml
CHANGED
@@ -2,10 +2,13 @@ AllCops:
|
|
2
2
|
TargetRubyVersion: 2.2
|
3
3
|
DisabledByDefault: true
|
4
4
|
Exclude:
|
5
|
-
-
|
6
|
-
-
|
7
|
-
-
|
8
|
-
-
|
5
|
+
- node_modules/**/*
|
6
|
+
- vendor/**/*
|
7
|
+
- tmp/**/*
|
8
|
+
- fixtures/**/*
|
9
|
+
- Appraisals
|
10
|
+
- gemfiles/**/*
|
11
|
+
- test/tmp/**/*
|
9
12
|
|
10
13
|
Gemspec/OrderedDependencies:
|
11
14
|
Enabled: true
|
@@ -52,9 +55,6 @@ Naming/PredicateName:
|
|
52
55
|
Naming/VariableName:
|
53
56
|
Enabled: true
|
54
57
|
|
55
|
-
Lint/DeprecatedClassMethods:
|
56
|
-
Enabled: true
|
57
|
-
|
58
58
|
Layout/AlignParameters:
|
59
59
|
Enabled: true
|
60
60
|
|
@@ -115,3 +115,6 @@ Layout/SpaceInsideParens:
|
|
115
115
|
|
116
116
|
Layout/TrailingWhitespace:
|
117
117
|
Enabled: true
|
118
|
+
|
119
|
+
Lint/DeprecatedClassMethods:
|
120
|
+
Enabled: true
|
data/.travis.yml
CHANGED
@@ -5,23 +5,22 @@ before_install:
|
|
5
5
|
- gem update --system
|
6
6
|
|
7
7
|
rvm:
|
8
|
-
- 2.2
|
9
8
|
- 2.3
|
10
9
|
- 2.4
|
11
10
|
- 2.5
|
12
11
|
- ruby-head
|
13
12
|
|
14
13
|
gemfile:
|
15
|
-
-
|
16
|
-
-
|
17
|
-
-
|
18
|
-
- Gemfile-rails.5.2.x
|
14
|
+
- gemfiles/rails_5.0.x.gemfile
|
15
|
+
- gemfiles/rails_5.1.x.gemfile
|
16
|
+
- gemfiles/rails_5.2.x.gemfile
|
19
17
|
|
20
18
|
cache:
|
21
19
|
bundler: true
|
22
20
|
yarn: true
|
23
21
|
|
24
22
|
install:
|
23
|
+
- gem install bundler
|
25
24
|
- bundle install
|
26
25
|
- nvm install node
|
27
26
|
- node -v
|
data/Appraisals
ADDED
data/CHANGELOG.md
CHANGED
@@ -2,13 +2,31 @@
|
|
2
2
|
|
3
3
|
## Upcoming release
|
4
4
|
|
5
|
+
## v3.0.0.beta1 (2019-02-28)
|
6
|
+
|
7
|
+
**Breaking changes:**
|
8
|
+
- Dropped support for Rails 4.2
|
9
|
+
- Dropped support for Ruby 2.2
|
10
|
+
|
11
|
+
**Enhancements:**
|
12
|
+
- Komponent now reports component stats when you run `bin/rails stats`
|
13
|
+
- Komponent now includes a styleguide engine that you can mount to your project
|
14
|
+
to document your components, and 2 new generators:
|
15
|
+
- `rails g komponent:styleguide` to set it up
|
16
|
+
- `rails g komponent:examples` to generate an `examples` file for each existing component
|
17
|
+
|
18
|
+
**Bug fixes:**
|
19
|
+
- Removed redundant `class` attribute in HAML templates
|
20
|
+
- Fix `content_for` / `yield` which was no longer working across components, since `v2.0.0`
|
21
|
+
- Fix translation key lookup in partials (helper method `t`)
|
22
|
+
|
5
23
|
## v2.2.0 (2018-07-03)
|
6
24
|
|
7
25
|
**Enhancements:**
|
8
26
|
- Component generator: use `component_name` instead of `module_name` in templates,
|
9
27
|
so when we create a `button` component, by default it contains `button` instead
|
10
28
|
of `button_component`
|
11
|
-
|
29
|
+
|
12
30
|
**Bug fixes:**
|
13
31
|
- Component generator: fix error when the single-quotes are used in `import`s
|
14
32
|
|
data/Gemfile
CHANGED
data/README.md
CHANGED
@@ -34,6 +34,7 @@ This gem has been inspired by our Rails development practices at [Ouvrages](http
|
|
34
34
|
- [Stimulus integration](#stimulus-integration)
|
35
35
|
- [Internationalization](#internationalization)
|
36
36
|
- [Available locales configuration](#available-locales-configuration)
|
37
|
+
- [Styleguide](#styleguide)
|
37
38
|
- [Configuration](#configuration)
|
38
39
|
- [Change default root path](#change-default-root-path)
|
39
40
|
- [Default options for the generators](#default-options-for-the-generators)
|
@@ -41,13 +42,14 @@ This gem has been inspired by our Rails development practices at [Ouvrages](http
|
|
41
42
|
- [Force default templating engine](#force-default-templating-engine)
|
42
43
|
- [Additional paths](#additional-paths)
|
43
44
|
- [Contributing](#contributing)
|
45
|
+
- [Releasing a new version](#releasing-a-new-version)
|
44
46
|
- [License](#license)
|
45
47
|
</details>
|
46
48
|
|
47
49
|
## Compatibility
|
48
50
|
|
49
51
|
- Ruby 2.2+
|
50
|
-
- Rails
|
52
|
+
- Rails 5.0+
|
51
53
|
- Webpacker 3.0.0+
|
52
54
|
|
53
55
|
## Getting started
|
@@ -55,7 +57,7 @@ This gem has been inspired by our Rails development practices at [Ouvrages](http
|
|
55
57
|
```ruby
|
56
58
|
# Gemfile
|
57
59
|
|
58
|
-
gem
|
60
|
+
gem 'komponent'
|
59
61
|
```
|
60
62
|
|
61
63
|
Run the following command to set up your project instantly:
|
@@ -84,8 +86,8 @@ Then, render it in your views with the `component` helper (or its alias `c`).
|
|
84
86
|
```slim
|
85
87
|
/ app/views/pages/home.html.slim
|
86
88
|
|
87
|
-
= component
|
88
|
-
= c
|
89
|
+
= component 'button'
|
90
|
+
= c 'button'
|
89
91
|
```
|
90
92
|
|
91
93
|
Or, directly from your controllers:
|
@@ -94,7 +96,7 @@ Or, directly from your controllers:
|
|
94
96
|
# app/controllers/pages_controller.rb
|
95
97
|
|
96
98
|
def home
|
97
|
-
render html: helpers.component(
|
99
|
+
render html: helpers.component('home')
|
98
100
|
end
|
99
101
|
```
|
100
102
|
|
@@ -106,11 +108,11 @@ Make sure to include javascript pack tag and stylesheet pack tag in your applica
|
|
106
108
|
doctype html
|
107
109
|
html
|
108
110
|
head
|
109
|
-
= stylesheet_pack_tag
|
111
|
+
= stylesheet_pack_tag 'application'
|
110
112
|
|
111
113
|
body
|
112
114
|
= yield
|
113
|
-
= javascript_pack_tag
|
115
|
+
= javascript_pack_tag 'application'
|
114
116
|
```
|
115
117
|
|
116
118
|
Check [Webpacker documentation](https://github.com/rails/webpacker) for further information.
|
@@ -122,7 +124,7 @@ You can pass `locals` to the helper. They are accessible within the component pa
|
|
122
124
|
```slim
|
123
125
|
/ app/views/pages/home.html.slim
|
124
126
|
|
125
|
-
= component
|
127
|
+
= component 'button', text: 'My button'
|
126
128
|
```
|
127
129
|
|
128
130
|
```slim
|
@@ -145,10 +147,10 @@ If you want better control of the cache expiration, you can provide a custom `ca
|
|
145
147
|
/ app/views/pages/home.html.slim
|
146
148
|
|
147
149
|
/ Cache the component based on its locals
|
148
|
-
= component "button", { text:
|
150
|
+
= component "button", { text: 'Click here' }, cached: true
|
149
151
|
|
150
152
|
/ or cache the component with a specific key, such as the last update of a model
|
151
|
-
= component "button", { text:
|
153
|
+
= component "button", { text: 'Click here' }, cached: true, cache_key: @product.updated_at
|
152
154
|
```
|
153
155
|
|
154
156
|
### Passing a block
|
@@ -158,8 +160,8 @@ The component also accepts a `block`. To render the block, just use the standard
|
|
158
160
|
```slim
|
159
161
|
/ app/views/pages/home.html.slim
|
160
162
|
|
161
|
-
= component
|
162
|
-
span=
|
163
|
+
= component 'button'
|
164
|
+
span= 'My button'
|
163
165
|
```
|
164
166
|
|
165
167
|
```slim
|
@@ -180,7 +182,7 @@ Each component comes with a Ruby `module`. You can use it to set properties:
|
|
180
182
|
|
181
183
|
module ButtonComponent
|
182
184
|
property :href, required: true
|
183
|
-
property :text, default:
|
185
|
+
property :text, default: 'My button'
|
184
186
|
end
|
185
187
|
```
|
186
188
|
|
@@ -200,10 +202,10 @@ If your partial becomes too complex and you want to extract logic from it, you m
|
|
200
202
|
|
201
203
|
module ButtonComponent
|
202
204
|
property :href, required: true
|
203
|
-
property :text, default:
|
205
|
+
property :text, default: 'My button'
|
204
206
|
|
205
207
|
def external_link?
|
206
|
-
@href.starts_with?
|
208
|
+
@href.starts_with? 'http'
|
207
209
|
end
|
208
210
|
end
|
209
211
|
```
|
@@ -213,7 +215,7 @@ end
|
|
213
215
|
|
214
216
|
a.button(href=@href)
|
215
217
|
= @text
|
216
|
-
=
|
218
|
+
= ' (external link)' if external_link?
|
217
219
|
```
|
218
220
|
|
219
221
|
```slim
|
@@ -232,7 +234,7 @@ You can also choose to split your component into partials. In this case, we can
|
|
232
234
|
a.button(href=@href)
|
233
235
|
= @text
|
234
236
|
- if external_link?
|
235
|
-
= render
|
237
|
+
= render 'suffix', text: 'external link'
|
236
238
|
```
|
237
239
|
|
238
240
|
```slim
|
@@ -253,7 +255,7 @@ This will create the component in an `admin` folder, and name its Ruby module `A
|
|
253
255
|
|
254
256
|
### Stimulus integration
|
255
257
|
|
256
|
-
Komponent supports [
|
258
|
+
Komponent supports [Stimulus](https://github.com/stimulusjs/stimulus) >= 1.0.
|
257
259
|
|
258
260
|
You can pass `--stimulus` to both generators to use Stimulus in your components.
|
259
261
|
|
@@ -261,7 +263,7 @@ You can pass `--stimulus` to both generators to use Stimulus in your components.
|
|
261
263
|
rails generate komponent:install --stimulus
|
262
264
|
```
|
263
265
|
|
264
|
-
This will yarn
|
266
|
+
This will `yarn add stimulus` and create a `stimulus_application.js` in the `frontend` folder.
|
265
267
|
|
266
268
|
```sh
|
267
269
|
rails generate component button --stimulus
|
@@ -284,7 +286,7 @@ This will create a `yml` file for each locale (using `I18n.available_locales`).
|
|
284
286
|
|
285
287
|
= a.button(href=@href)
|
286
288
|
= @text
|
287
|
-
= render(
|
289
|
+
= render('suffix', text: t(".external_link")) if external_link?
|
288
290
|
```
|
289
291
|
|
290
292
|
```yml
|
@@ -292,7 +294,7 @@ This will create a `yml` file for each locale (using `I18n.available_locales`).
|
|
292
294
|
|
293
295
|
en:
|
294
296
|
button_component:
|
295
|
-
external_link:
|
297
|
+
external_link: external link
|
296
298
|
```
|
297
299
|
|
298
300
|
```yml
|
@@ -300,7 +302,7 @@ en:
|
|
300
302
|
|
301
303
|
fr:
|
302
304
|
button_component:
|
303
|
-
external_link:
|
305
|
+
external_link: lien externe
|
304
306
|
```
|
305
307
|
|
306
308
|
#### Available locales configuration
|
@@ -313,6 +315,34 @@ I18n.available_locales = [:en, :fr]
|
|
313
315
|
> If you have the `rails-i18n` gem in your `Gemfile`, you should whitelist locales to prevent creating a lot of
|
314
316
|
> locale files when you generate a new component.
|
315
317
|
|
318
|
+
### Styleguide
|
319
|
+
|
320
|
+
Komponent includes a basic styleguide engine that you can use in your project to document your components.
|
321
|
+
|
322
|
+

|
323
|
+
|
324
|
+
To set it up, you can use the generator:
|
325
|
+
|
326
|
+
```sh
|
327
|
+
rails generate komponent:styleguide
|
328
|
+
```
|
329
|
+
|
330
|
+
This command will:
|
331
|
+
|
332
|
+
* copy the styleguide components (`komponent/container`, `komponent/footer`, `komponent/header` and `komponent/sidebar`) to your components folder, so you can customize them
|
333
|
+
* add a new `komponent.js` pack to your packs folder
|
334
|
+
* mount the engine in your routes
|
335
|
+
|
336
|
+
Then, for each component, you can describe it and render examples for each state in the `_example.html.slim` file from the component folder. The engine will then render it on the component page.
|
337
|
+
|
338
|
+
If you have existing components, you can generate all their example files at once with:
|
339
|
+
|
340
|
+
```sh
|
341
|
+
rails generate komponent:examples
|
342
|
+
```
|
343
|
+
|
344
|
+
Finally, visit `http://localhost:3000/styleguide` to access your styleguide.
|
345
|
+
|
316
346
|
### Configuration
|
317
347
|
|
318
348
|
#### Change default root path
|
@@ -320,7 +350,7 @@ I18n.available_locales = [:en, :fr]
|
|
320
350
|
You can change the default root path (`frontend`) to another path where Komponent should be installed and components generated. You need to change `komponent.root` in an initializer.
|
321
351
|
|
322
352
|
```rb
|
323
|
-
Rails.application.config.komponent.root = Rails.root.join(
|
353
|
+
Rails.application.config.komponent.root = Rails.root.join('app/frontend')
|
324
354
|
```
|
325
355
|
|
326
356
|
#### Default options for the generators
|
@@ -393,14 +423,14 @@ module MyEngine
|
|
393
423
|
app.config.komponent.component_paths.append(MyEngine::Engine.root.join("frontend/components"))
|
394
424
|
end
|
395
425
|
|
396
|
-
initializer
|
426
|
+
initializer 'my_engine.action_dispatch' do |app|
|
397
427
|
ActiveSupport.on_load :action_controller do
|
398
428
|
ActionController::Base.prepend_view_path MyEngine::Engine.root.join("frontend")
|
399
429
|
end
|
400
430
|
end
|
401
431
|
|
402
432
|
initializer 'my_engine.autoload', before: :set_autoload_paths do |app|
|
403
|
-
app.config.autoload_paths << MyEngine::Engine.root.join(
|
433
|
+
app.config.autoload_paths << MyEngine::Engine.root.join('frontend')
|
404
434
|
end
|
405
435
|
end
|
406
436
|
end
|
@@ -425,10 +455,30 @@ resolved_paths:
|
|
425
455
|
- engine/frontend
|
426
456
|
```
|
427
457
|
|
458
|
+
## Running tests
|
459
|
+
|
460
|
+
Run all Cucumber features and unit tests with `bundle exec appraisal rake test`
|
461
|
+
|
462
|
+
Run the full test matrix with `bundle exec appraisal rake test`
|
463
|
+
|
428
464
|
## Contributing
|
429
465
|
|
430
466
|
Bug reports and pull requests are welcome on GitHub at https://github.com/komposable/komponent.
|
431
467
|
|
468
|
+
## Releasing a new version
|
469
|
+
|
470
|
+
- Update the CHANGELOG (add a title and a date for the new version)
|
471
|
+
- Update the version number in `lib/komponent/version`
|
472
|
+
- Install the `gem-release` gem if you haven't already
|
473
|
+
- Run `gem release --tag --push`
|
474
|
+
- Create or update the release on Github with the same version number and copy-paste the description from the CHANGELOG
|
475
|
+
|
476
|
+
Please note:
|
477
|
+
|
478
|
+
If you're releasing a patch version (eg. from 2.0.1 to 2.0.2) you can run `gem bump patch --release --tag --push --sign` so you don't have to manually change the version number.
|
479
|
+
|
480
|
+
If you want to release a specific version (eg. beta, RC...), you can run `gem bump 3.0.0.beta1 --release --tag --push --sign`
|
481
|
+
|
432
482
|
## License
|
433
483
|
|
434
484
|
The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
|
@@ -0,0 +1,20 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module Komponent
|
4
|
+
class StyleguideController < ::ApplicationController
|
5
|
+
layout 'komponent'
|
6
|
+
rescue_from ActionView::MissingTemplate, with: :missing_template
|
7
|
+
|
8
|
+
def index; end
|
9
|
+
|
10
|
+
def show
|
11
|
+
@component = Komponent::Component.find(params[:id])
|
12
|
+
end
|
13
|
+
|
14
|
+
private
|
15
|
+
|
16
|
+
def missing_template
|
17
|
+
render 'komponent/styleguide/missing_template', status: :not_found
|
18
|
+
end
|
19
|
+
end
|
20
|
+
end
|