bemer 0.1.0 → 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (95) hide show
  1. checksums.yaml +5 -5
  2. data/{LICENSE-RU → LICENSE-RU.txt} +0 -0
  3. data/{LICENSE → LICENSE.txt} +5 -5
  4. data/README.md +47 -16
  5. data/docs/BEMHTML.md +5 -0
  6. data/docs//320/232/320/276/320/275/321/202/320/265/320/272/321/201/321/202-/321/203/320/267/320/273/320/260.md +275 -0
  7. data/docs//320/232/320/276/320/275/321/204/320/270/320/263/321/203/321/200/320/260/321/206/320/270/321/217.md +158 -0
  8. data/docs//320/237/321/200/320/265/320/264/320/270/320/272/320/260/321/202/321/213.md +205 -0
  9. data/docs//320/240/320/265/320/266/320/270/320/274/321/213.md +274 -0
  10. data/docs//320/241/320/276/320/267/320/264/320/260/320/275/320/270/320/265-/320/270-/320/270/321/201/320/277/320/276/320/273/321/214/320/267/320/276/320/262/320/260/320/275/320/270/320/265-UI-/320/272/320/276/320/274/320/277/320/276/320/275/320/265/320/275/321/202.md +173 -0
  11. data/docs//320/244/320/260/320/270/314/206/320/273/320/276/320/262/320/260/321/217-/321/201/321/202/321/200/321/203/320/272/321/202/321/203/321/200/320/260.md +167 -0
  12. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-bem_mix.md +62 -0
  13. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-bem_mods.md +63 -0
  14. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-block_tag.md +215 -0
  15. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-component_asset_path.md +71 -0
  16. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-component_pack.md +101 -0
  17. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-component_partial_path.md +28 -0
  18. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-define_component.md +154 -0
  19. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-define_templates.md +96 -0
  20. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-elem_tag.md +38 -0
  21. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-refine_component.md +114 -0
  22. data/docs//320/245/320/265/320/273/320/277/320/265/321/200-render_component.md +108 -0
  23. data/docs//320/250/320/260/320/261/320/273/320/276/320/275/321/213.md +44 -0
  24. data/lib/bemer.rb +3 -1
  25. data/lib/bemer/builders.rb +8 -0
  26. data/lib/bemer/builders/tree.rb +0 -8
  27. data/lib/bemer/configuration.rb +3 -1
  28. data/lib/bemer/context_extentions/structure.rb +2 -3
  29. data/lib/bemer/entity.rb +2 -2
  30. data/lib/bemer/entity_builder.rb +5 -9
  31. data/lib/bemer/helpers.rb +10 -0
  32. data/lib/bemer/mixin_list.rb +1 -1
  33. data/lib/bemer/modifier_list.rb +2 -2
  34. data/lib/bemer/path_resolver.rb +23 -0
  35. data/lib/bemer/pipeline/handler.rb +4 -6
  36. data/lib/bemer/railtie.rb +22 -9
  37. data/lib/bemer/renderer.rb +1 -1
  38. data/lib/bemer/template_list.rb +2 -4
  39. data/lib/bemer/tree.rb +3 -3
  40. data/lib/bemer/tree/node.rb +5 -7
  41. data/lib/bemer/version.rb +1 -1
  42. data/spec/bemer/railtie_spec.rb +95 -0
  43. data/spec/dummy/config/application.rb +30 -12
  44. data/spec/dummy/config/initializers/backtrace_silencers.rb +1 -5
  45. data/spec/dummy/config/initializers/bemer.rb +1 -3
  46. data/spec/rails_helper.rb +5 -9
  47. metadata +87 -129
  48. data/.gitignore +0 -17
  49. data/.overcommit.yml +0 -59
  50. data/.rspec +0 -4
  51. data/.rubocop.yml +0 -21
  52. data/.rubocop_todo.yml +0 -11
  53. data/Gemfile +0 -12
  54. data/Rakefile +0 -12
  55. data/bemer.gemspec +0 -43
  56. data/spec/dummy/Rakefile +0 -8
  57. data/spec/dummy/app/controllers/concerns/.keep +0 -0
  58. data/spec/dummy/app/helpers/application_helper.rb +0 -4
  59. data/spec/dummy/app/jobs/application_job.rb +0 -4
  60. data/spec/dummy/app/mailers/application_mailer.rb +0 -6
  61. data/spec/dummy/app/models/application_record.rb +0 -5
  62. data/spec/dummy/app/models/concerns/.keep +0 -0
  63. data/spec/dummy/app/views/layouts/mailer.html.erb +0 -13
  64. data/spec/dummy/app/views/layouts/mailer.text.erb +0 -1
  65. data/spec/dummy/bin/bundle +0 -5
  66. data/spec/dummy/bin/rails +0 -6
  67. data/spec/dummy/bin/rake +0 -6
  68. data/spec/dummy/bin/setup +0 -39
  69. data/spec/dummy/bin/update +0 -31
  70. data/spec/dummy/bin/yarn +0 -13
  71. data/spec/dummy/config/cable.yml +0 -10
  72. data/spec/dummy/config/database.yml +0 -25
  73. data/spec/dummy/config/environments/development.rb +0 -51
  74. data/spec/dummy/config/environments/production.rb +0 -84
  75. data/spec/dummy/config/environments/test.rb +0 -44
  76. data/spec/dummy/config/initializers/application_controller_renderer.rb +0 -7
  77. data/spec/dummy/config/initializers/cookies_serializer.rb +0 -7
  78. data/spec/dummy/config/initializers/filter_parameter_logging.rb +0 -6
  79. data/spec/dummy/config/initializers/inflections.rb +0 -17
  80. data/spec/dummy/config/initializers/mime_types.rb +0 -5
  81. data/spec/dummy/config/initializers/wrap_parameters.rb +0 -16
  82. data/spec/dummy/config/locales/en.yml +0 -33
  83. data/spec/dummy/config/puma.rb +0 -58
  84. data/spec/dummy/config/routes.rb +0 -5
  85. data/spec/dummy/config/secrets.yml +0 -32
  86. data/spec/dummy/config/spring.rb +0 -8
  87. data/spec/dummy/lib/assets/.keep +0 -0
  88. data/spec/dummy/log/.keep +0 -0
  89. data/spec/dummy/package.json +0 -5
  90. data/spec/dummy/public/404.html +0 -67
  91. data/spec/dummy/public/422.html +0 -67
  92. data/spec/dummy/public/500.html +0 -66
  93. data/spec/dummy/public/apple-touch-icon-precomposed.png +0 -0
  94. data/spec/dummy/public/apple-touch-icon.png +0 -0
  95. data/spec/dummy/public/favicon.ico +0 -0
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
- SHA1:
3
- metadata.gz: 16debb87f2467a03c58ce016590f7a8782f8058b
4
- data.tar.gz: 106a22bbfb569721d22b9cde7d9f4518ede99ec2
2
+ SHA256:
3
+ metadata.gz: bcd184e6311cfaf5b2e13259388684f7060d3a2dcadb82ee746f0535554700c5
4
+ data.tar.gz: 294e3d815a456c4dff418bd8d2afbf221a43a0f78bfb0f90a1cbb1581eb76259
5
5
  SHA512:
6
- metadata.gz: e01fb9646706fa961e6183bd8ab7bf13a558b9712c6cf2a1bc71fe02869b8f2aaffefff031573c17dcdb4f614afd78b2071d1705cc9039ce63f208f7efa8704f
7
- data.tar.gz: 0e0e17a046595b5b0531e8f1f106bdf4f8895dcef75f3c68e49f6773ef100db3a10bcad819424b3f1665e92882447b15d65074496e1df4bc2bf1643741873095
6
+ metadata.gz: b2e40d1341a003a9755ac895cf0a032b516c30afefa9bf13cc811512188401b32d243022f1a534b2cdb801627b9d366333a1ef95841e9885d548882de1bf8b23
7
+ data.tar.gz: 1e81f6b5e9e76e58a8e90679816277318deadd39182e117b9231f94eb9a4bae647d58fac9e34ba0b91097bedb2f74aeceaeefef3847ef83f3d9b969544c8f251
File without changes
@@ -1,4 +1,4 @@
1
- The MIT License (MIT)
1
+ MIT License
2
2
 
3
3
  Copyright (c) 2017-2018 Alexander Grigorev
4
4
 
@@ -9,13 +9,13 @@ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
9
  copies of the Software, and to permit persons to whom the Software is
10
10
  furnished to do so, subject to the following conditions:
11
11
 
12
- The above copyright notice and this permission notice shall be included in
13
- all copies or substantial portions of the Software.
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
14
 
15
15
  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
16
  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
17
  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
18
  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
19
  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
- THE SOFTWARE.
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
data/README.md CHANGED
@@ -1,27 +1,58 @@
1
1
  # Bemer
2
2
 
3
- Build reusable UI components for Rails applications using the [BEM methodology](https://en.bem.info/methodology/).
3
+ **ВАЖНО**. *Для работы с UI компонентами не обязательно использовать методологию БЭМ.*
4
4
 
5
- ## Installation
5
+ 1. Позволяет создавать переиспользуемые UI компоненты для приложений на Ruby on Rails.
6
+ 1. Предоставляет функционал для разработки приложений на Ruby on Rails с использованием методологии БЭМ.
6
7
 
7
- Add this line to your application's Gemfile:
8
+ ## Дополнительно
8
9
 
9
- ```ruby
10
- gem 'bemer'
11
- ```
12
-
13
- And then execute:
14
-
15
- $ bundle
10
+ 1. Статья на Хабре - [Переиспользуемые UI компоненты в приложениях на Ruby on Rails](https://habrahabr.ru/post/352938/).
11
+ 1. [bemer-bootstrap](https://github.com/vill/bemer-bootstrap) - переиспользуемые компоненты Bootstrap v3.
12
+ 1. [Пример приложения](https://github.com/vill/bemer-example) с использованием `bemer` и [bemer-bootstrap](https://github.com/vill/bemer-bootstrap).
16
13
 
17
- Or install it yourself as:
14
+ ## Установка
18
15
 
19
- $ gem install bemer
16
+ Добавить в `Gemfile`:
20
17
 
21
- ## Usage
18
+ ```ruby
19
+ gem 'bemer', '~> 0.1.0'
20
+ ```
22
21
 
23
- TODO: Write usage instructions here
22
+ Выполнить в терминале команду:
24
23
 
25
- ## Contributing
24
+ $ bundle
26
25
 
27
- Bug reports and pull requests are welcome on GitHub at https://github.com/vill/bemer.
26
+ ## Использование
27
+
28
+ 1. [Файловая структура](docs/%D0%A4%D0%B0%D0%B8%CC%86%D0%BB%D0%BE%D0%B2%D0%B0%D1%8F-%D1%81%D1%82%D1%80%D1%83%D0%BA%D1%82%D1%83%D1%80%D0%B0.md)
29
+ 1. [Конфигурация](docs/%D0%9A%D0%BE%D0%BD%D1%84%D0%B8%D0%B3%D1%83%D1%80%D0%B0%D1%86%D0%B8%D1%8F.md)
30
+ 1. [Создание и использование UI компонент](docs/%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-%D0%B8-%D0%B8%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-UI-%D0%BA%D0%BE%D0%BC%D0%BF%D0%BE%D0%BD%D0%B5%D0%BD%D1%82.md)
31
+ 1. Хелперы для работы с компонентами
32
+ 1. [`define_component`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-define_component.md)
33
+ 1. [`define_templates`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-define_templates.md)
34
+ 1. [`render_component`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-render_component.md)
35
+ 1. [`refine_component`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-refine_component.md)
36
+ 1. [`component_pack`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-component_pack.md)
37
+ 1. [`component_asset_path`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-component_asset_path.md)
38
+ 1. [`component_partial_path`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-component_partial_path.md)
39
+ 1. Дополнительные хелперы для БЭМ методологии
40
+ 1. [`bem_mix`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-bem_mix.md)
41
+ 1. [`bem_mods`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-bem_mods.md)
42
+ 1. [`block_tag`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-block_tag.md)
43
+ 1. [`elem_tag`](docs/%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-elem_tag.md)
44
+ 1. [BEMHTML](docs/BEMHTML.md)
45
+ 1. [Шаблоны](docs/%D0%A8%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD%D1%8B.md)
46
+ 1. [Контекст узла](docs/%D0%9A%D0%BE%D0%BD%D1%82%D0%B5%D0%BA%D1%81%D1%82-%D1%83%D0%B7%D0%BB%D0%B0.md)
47
+ 1. [Предикаты](docs/%D0%9F%D1%80%D0%B5%D0%B4%D0%B8%D0%BA%D0%B0%D1%82%D1%8B.md)
48
+ 1. [Режимы](docs/%D0%A0%D0%B5%D0%B6%D0%B8%D0%BC%D1%8B.md)
49
+
50
+ ## Ссылки
51
+
52
+ 1. https://ru.bem.info/methodology/
53
+ 1. https://github.com/bem/bem-xjst
54
+ 1. https://github.com/bem-site/bem-forum-content-ru/issues
55
+
56
+ ## Лицензия
57
+
58
+ Copyright (c) 2017 - 2018 Александр Григорьев. Более подробную информацию о лицензии можно получить в файле [LICENSE.txt](LICENSE.txt).
@@ -0,0 +1,5 @@
1
+ # BEMHTML
2
+
3
+ **ВАЖНО**. *Только для компонент, [структура (дерево) которых была создана](Создание-и-использование-UI-компонент.md) с помощью [хелпера `define_component`](Хелпер-define_component.md) доступно использование [BEMHTML шаблонов](Шаблоны.md).*
4
+
5
+ Текущая реализация BEMHTML позволяет преобразовывать данные, полученные при использовании хелперов [`block_tag`](Хелпер-block_tag.md), [`elem_tag`](Хелпер-elem_tag.md) и [`define_component`](Хелпер-define_component.md) в выходной HTML код.
@@ -0,0 +1,275 @@
1
+ # Контекст узла
2
+
3
+ **ВАЖНО**. *Методы `apply` и `apply_next` доступны ТОЛЬКО в теле шаблона*.
4
+
5
+ **ВАЖНО**. *Методы `ctx` и `content` доступны ТОЛЬКО в теле шаблона при режимах `replace` и `content`*.
6
+
7
+ Контекст текущего узла доступен в предикате и теле шаблона, если они являются `Proc`, `lambda` или `&block`.
8
+
9
+ ## Список основных методов доступных в предикате и теле шаблона
10
+
11
+ `attrs`, `bem`, `bem_cascade`, `block`, `cls`, `elem`, `first?`, `js`, `last?`, `mix`, `mods`, `name`, `params`, `position`, `tag`.
12
+
13
+ ### Метод `attrs`
14
+
15
+ Возвращает список атрибутов в виде хеша (`Hash`) ключи которого ВСЕГДА имеют тип `Symbol`.
16
+
17
+ Добавить `key: :value` к изначальным атрибутам блока с названием `alert`:
18
+ ```slim
19
+ / Эквивалентные записи
20
+ = render_component :alert do |template|
21
+ = template.block(:alert).attrs ->(node) { { **node.attrs, key: :value } }
22
+
23
+ = render_component :alert do |template|
24
+ = template.block(:alert).attrs ->(node) { node.attrs.merge!(key: :value) }
25
+ ```
26
+ Добавить css класс `css-class` если текущая сущность является блоком с названием `alert` и имеет атрибут с названием `:role`:
27
+ ```slim
28
+ = render_component :alert do |template|
29
+ = template.block(:alert, ->(node) { node.attrs.key?(:role) }).add_cls :css_class
30
+ ```
31
+ ### Метод `bem`
32
+
33
+ Возвращает значение параметра `bem`. Если параметр не был передан, тогда возвращаемое значение будет `nil`.
34
+
35
+ ### Метод `bem_cascade`
36
+
37
+ Возвращает значение параметра `bem_cascade`. Если параметр не был передан, тогда возвращаемое значение будет `nil`.
38
+
39
+ ### Метод `block`
40
+
41
+ Возвращает значение параметра `block`. Если параметр не был передан, тогда возвращаемое значение будет пустая строка `''`.
42
+
43
+ ### Метод `cls`
44
+
45
+ Возвращает нормализованный список css классов ввиде массива (`Array`) строк (`String`).
46
+
47
+ В шаблоне и предикате метод `cls` вернет: `['css-class1', 'css-class2']`:
48
+ ```slim
49
+ / Содержимое файла index.html.slim компонента simple_component
50
+ = define_component do |component|
51
+ = component.block :block1, cls: 'css-class1 css-class2'
52
+ ```
53
+ Добавить css класс `css-class` если текущая сущность является блоком с названием `block1` и имеет css класс `css-class1`:
54
+ ```slim
55
+ = render_component :simple_component do |template|
56
+ = template.block(:block1, ->(node) { node.cls.include?('css-class1') }).add_cls :css_class
57
+ ```
58
+ Добавить css класс `css-class` к изначальным css классам блока с названием `block1`:
59
+ ```slim
60
+ / Эквивалентные записи
61
+ = render_component :simple_component do |template|
62
+ = template.block(:block1).cls ->(node) { [node.cls, :css_class] }
63
+
64
+ = render_component :simple_component do |template|
65
+ = template.block(:block1).cls ->(node) { node.cls << :css_class }
66
+ ```
67
+
68
+ ### Метод `elem`
69
+
70
+ Возвращает значение параметра `elem`, если сущность является блоком, тогда значение будет `nil`, если сущность является элементом и параметр не был передан, тогда возвращаемое значение будет пустая строка `''`.
71
+
72
+ ### Метод `first?`
73
+
74
+ Возвращает `true` если текущий узел среди своих братьев/сестер (siblings) занимает первую позицию, если это не так, возвращает `false`.
75
+
76
+ ```slim
77
+ = render_component :menu do |template|
78
+ = template.elem(:item, ->(node) { node.first? }).add_cls :first
79
+ ```
80
+
81
+ ### Метод `js`
82
+
83
+ Возвращает значение параметра `js`.
84
+
85
+ ### Метод `last?`
86
+
87
+ Возвращает `true` если текущий узел среди своих братьев/сестер (siblings) занимает последнюю позицию, если это не так, возвращает `false`.
88
+
89
+ ```slim
90
+ = render_component :menu do |template|
91
+ = template.elem(:item, ->(node) { node.last? }).add_cls :last
92
+ ```
93
+
94
+ ### Метод `mix`
95
+
96
+ Возвращает нормализованный список миксов ввиде массива (`Array`) строк (`String`).
97
+
98
+ В шаблоне и предикате метод `mix` вернет `['block', 'block2__elem1', 'block2__elem2']`:
99
+ ```slim
100
+ / Содержимое файла index.html.slim компонента simple_component
101
+ = define_component do |component|
102
+ = component.block :block1, mix: [:block, block2: [:elem1, :elem2]]
103
+ ```
104
+
105
+ ### Метод `mods`
106
+
107
+ Возвращает нормализованный список модификаторов в виде хеша ([`ActiveSupport::HashWithIndifferentAccess`](http://api.rubyonrails.org/v5.0/classes/ActiveSupport/HashWithIndifferentAccess.html)) со строковыми `String` и `true` значениями.
108
+
109
+ В шаблоне и предикате метод `mods` вернет `{'enabled' => true, 'theme' => 'green-islands'}`:
110
+ ```slim
111
+ / Содержимое файла index.html.slim компонента simple_component
112
+ = define_component do |component|
113
+ = component.block :block1, mods: [:enabled, theme: :green_islands]]
114
+ ```
115
+ HTML тег изменить на `span` если текущая сущность является блоком с названием `block1` и имеет модификатор с названием `theme` и любым значением этого модификатора:
116
+ ```slim
117
+ = render_component :simple_component do |template|
118
+ = template.block(:block1, ->(node) { node.mods.key?(:theme) }).tag :span
119
+ ```
120
+ HTML тег изменить на `small` если текущая сущность является блоком с названием `block1` и имеет модификатор с названием `theme` и значением `green-islands` этого модификатора:
121
+ ```slim
122
+ = render_component :simple_component do |template|
123
+ = template.block(:block1, mods: { theme: :green_islands }).tag :small
124
+ ```
125
+
126
+ ### Метод `name`
127
+
128
+ **ВАЖНО**. *При формирование названия сущности, действуют [правила преобразования знаков нижнего подчеркивания `_` в тире `-` для `Symbol` и `String`](%D0%A5%D0%B5%D0%BB%D0%BF%D0%B5%D1%80-block_tag.md#%D0%9D%D0%B0%D0%B7%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5-%D1%81%D1%83%D1%89%D0%BD%D0%BE%D1%81%D1%82%D0%B8)*
129
+
130
+ Возвращает название сущности.
131
+
132
+ Для блока без названия метод `name` вернет пустую строку `''`:
133
+ ```slim
134
+ / Содержимое файла index.html.slim компонента simple_component
135
+ = define_component do |component|
136
+ = component.block
137
+ ```
138
+ Для элемента без названия метод `name` вернет указанный в [конфиге разделитель между блоком и элементом `'__'`](%D0%9A%D0%BE%D0%BD%D1%84%D0%B8%D0%B3%D1%83%D1%80%D0%B0%D1%86%D0%B8%D1%8F.md#%D0%9F%D0%B0%D1%80%D0%B0%D0%BC%D0%B5%D1%82%D1%80-element_name_separator):
139
+ ```slim
140
+ / Содержимое файла index.html.slim компонента simple_component
141
+ = define_component do |component|
142
+ = component.elem
143
+ ```
144
+
145
+ Для элемента без указания блока метод `name` вернет `'__elem-name'`:
146
+ ```slim
147
+ / Содержимое файла index.html.slim компонента simple_component
148
+ = define_component do |component|
149
+ = component.elem '', :elem_name
150
+ ```
151
+ Для элемента с указанием только блока метод `name` вернет `'block-name__'`:
152
+ ```slim
153
+ / Содержимое файла index.html.slim компонента simple_component
154
+ = define_component do |component|
155
+ = component.elem :block_name
156
+ ```
157
+
158
+ ### Метод `params`
159
+
160
+ Хеш (`Hash`) содержит данные которые были переданы при вызове методов `ctx`, `content`, `apply` и `apply_next`.
161
+
162
+ ### Метод `position`
163
+
164
+ Возвращает порядковый номер узла, который он занимает среди своих братьев/сестер (siblings), нумерация начинается с 1.
165
+
166
+ ### Метод `tag`
167
+
168
+ Возвращает нормализованное значение параметра `tag` как `Symbol` (все значения с типом `Symbol` возвращаются как есть а не пустые строки `String` преобразуются с помощью `to_sym`), `''` (для `false` и пустой строки `''`) или `nil`.
169
+
170
+ ## Список дополнительных методов доступных в теле шаблона
171
+
172
+ `apply`, `apply_next`, `ctx`, `content`.
173
+
174
+ ### Метод `apply(mode, **params)`
175
+
176
+ **ВАЖНО**. *Методы `apply` и `apply_next` доступны ТОЛЬКО в теле шаблона*.
177
+
178
+ Позволяет вызвать любой основной режим (`Symbol`) в контексте текущего узла, дополнительно можно передать параметры которые будут доступны в `params`.
179
+
180
+ ```slim
181
+ / Содержимое файла index.bemhtml.slim компонента alert
182
+ = define_templates do |template|
183
+ = template.block(:alert).add_cls ->(node) { "alert-#{node.params.fetch(:type, :info)}" }
184
+ ```
185
+ Вызов компонента `alert` с указанием значения `type` в `params`:
186
+ ```slim
187
+ = render_component :alert do |template|
188
+ = template.block(:alert).cls ->(node) { node.apply(:cls, type: :success) }
189
+ ```
190
+
191
+ ### Метод `apply_next(**params)`
192
+
193
+ **ВАЖНО**. *Методы `apply` и `apply_next` доступны ТОЛЬКО в теле шаблона*.
194
+
195
+ Позволяет вызвать следующий по очередности шаблон для текущего режима, дополнительно можно передать параметры которые будут доступны в `params`.
196
+
197
+ ```slim
198
+ / Содержимое файла index.bemhtml.slim компонента alert
199
+ = define_templates do |template|
200
+ = template.block(:alert).add_cls ->(node) { "alert-#{node.params.fetch(:type, :info)}" }
201
+ ```
202
+ Вызов компонента `alert` с указанием значения `type` в `params`:
203
+ ```slim
204
+ = render_component :alert do |template|
205
+ = template.block(:alert) do |alert|
206
+ = alert.cls ->(node) { node.apply(:cls, type: node.params.fetch(:type, :success)) }
207
+ = alert.cls ->(node) { node.apply_next(type: :danger) }
208
+ ```
209
+
210
+ ### Метод `ctx(**params)`
211
+
212
+ **ВАЖНО**. *Методы `ctx` и `content` доступны ТОЛЬКО в теле шаблона при режимах `replace` и `content`*.
213
+
214
+ Ссылка на текущий узел, дополнительно можно передать параметры которые будут доступны в `params` у самого узла и всех его дочерних узлов.
215
+
216
+ Заменить блок `alert` на самого себя:
217
+
218
+ ```slim
219
+ / Эквивалентный результат
220
+ = render_component :alert do |template|
221
+ = template.block(:alert).replace do |node|
222
+ = node.ctx
223
+
224
+ = render_component :alert
225
+ ```
226
+
227
+ Обернуть блок `alert` в дополнительный блок и элемент:
228
+
229
+ ```slim
230
+ = render_component :alert do |template|
231
+ = template.block(:alert).replace do |node, builder|
232
+ = builder.block :top_block do |top_block|
233
+ = top_block.elem :elem_name
234
+ = node.ctx
235
+ ```
236
+
237
+ ### Метод `content(**params)`
238
+
239
+ **ВАЖНО**. *Методы `ctx` и `content` доступны ТОЛЬКО в теле шаблона при режимах `replace` и `content`*.
240
+
241
+ Ссылка на содержимое текущего узла, дополнительно можно передать параметры которые будут доступны в `params` у всех дочерних узлов.
242
+
243
+ Заменить содержимое блока `alert` на само себя:
244
+
245
+ ```slim
246
+ / Эквивалентный результат
247
+ = render_component :alert do |template|
248
+ = template.block(:alert).content do |node|
249
+ = node.content
250
+
251
+ = render_component :alert
252
+ ```
253
+
254
+ Обернуть содержимое блока `alert` в дополнительный блок и элемент:
255
+
256
+ ```slim
257
+ = render_component :alert do |template|
258
+ = template.block(:alert).content do |node, builder|
259
+ = builder.block :top_block do |top_block|
260
+ = top_block.elem :elem_name
261
+ = node.content
262
+ ```
263
+
264
+ Заменить блок `alert` его содержимым:
265
+
266
+ ```slim
267
+ / Эквивалентный результат
268
+ = render_component :alert do |template|
269
+ = template.block(:alert).replace do |node|
270
+ = node.content
271
+
272
+ / Будет быстрее
273
+ = render_component :alert do |template|
274
+ = template.block(:alert).tag false
275
+ ```
@@ -0,0 +1,158 @@
1
+ # Конфигурация
2
+
3
+ Для изменения настроек, необходимо создать файл `config/initializers/bemer.rb` и переопределить параметры по умолчанию:
4
+
5
+ ```ruby
6
+ # Параметры по умолчанию
7
+ Bemer.setup do |config|
8
+ config.bem = false
9
+ config.default_block_tag = :div
10
+ config.default_element_tag = :div
11
+ config.default_path_prefix = nil
12
+ config.element_name_separator = '__'
13
+ config.modifier_name_separator = '_'
14
+ config.modifier_value_separator = '_'
15
+ config.path = 'app/bemer_components'
16
+ config.prepend_asset_paths = true
17
+ end
18
+ ```
19
+
20
+ ## Параметр `bem`
21
+
22
+ Глобально включает или выключает генерацию данных связанных с БЭМ методологией, используется только в [хелпере `define_component`](Хелпер-define_component.md). Порядок применения параметра `bem`:
23
+ ```slim
24
+ / config.bem = false
25
+
26
+ = define_component do |component|
27
+ = component.block :block
28
+
29
+ / => <div></div>
30
+ ```
31
+ ```slim
32
+ / config.bem = true
33
+
34
+ = define_component do |component|
35
+ = component.block :block
36
+
37
+ / => <div class="block"></div>
38
+ ```
39
+ ```slim
40
+ / config.bem = false # Самый низкий приоритет
41
+
42
+ = define_component bem: true do |component| # `config.bem` переопределен
43
+ = component.block :block
44
+
45
+ / => <div class="block"></div>
46
+ ```
47
+ ```slim
48
+ / config.bem = true # Самый низкий приоритет
49
+
50
+ = define_component bem: false do |component| # `config.bem` переопределен
51
+ = component.block :block
52
+
53
+ / => <div></div>
54
+ ```
55
+ ```slim
56
+ / config.bem = false # Самый низкий приоритет
57
+
58
+ = define_component bem: false do |component| # Следующий приоритет после `config.bem`
59
+ = component.block :block, bem: true # Самый высокий приоритет
60
+
61
+ / => <div class="block"></div>
62
+ ```
63
+ ```slim
64
+ / config.bem = true # Самый низкий приоритет
65
+
66
+ = define_component bem: true do |component| # Следующий приоритет после `config.bem`
67
+ = component.block :block, bem: false # Самый высокий приоритет
68
+
69
+ / => <div></div>
70
+ ```
71
+
72
+ ## Параметр `default_block_tag`
73
+
74
+ Устанавливает тег по умолчанию для сущностей типа блок, используется когда у сущности не указан (равен `nil`) HTML тег:
75
+
76
+ ```ruby
77
+ config.default_block_tag = :span
78
+ ```
79
+
80
+ ## Параметр `default_element_tag`
81
+
82
+ Устанавливает тег по умолчанию для сущностей типа элемент, используется когда у сущности не указан (равен `nil`) HTML тег:
83
+
84
+ ```ruby
85
+ config.default_element_tag = :span
86
+ ```
87
+
88
+ ## Параметр `default_path_prefix`
89
+
90
+ Добавляет префикс к пути/названию всех компонент, может быть `Symbol`, `String`, `false`, `nil` а также `Proc` и `lambda` которые должны возвращать `Symbol`, `String`, `false` или `nil`:
91
+
92
+ ```ruby
93
+ # Эквивалентные записи
94
+ config.default_path_prefix = 'common'
95
+ config.default_path_prefix = :common
96
+ config.default_path_prefix = proc { :common }
97
+ config.default_path_prefix = ->(path, view) { :common }
98
+ ```
99
+ Если `default_path_prefix` является `Proc` или `lambda` тогда, при вызове будут переданы указанный путь/название компонента (как `String`) и представление (экземпляр Action View):
100
+ ```ruby
101
+ config.default_path_prefix = proc { |path| path.start_with?('admin') ? '' : :user }
102
+ ```
103
+ ```ruby
104
+ config.default_path_prefix = lambda { |path, view|
105
+ view.controller.instance_of?(Admin::ApplicationController) ? :admin : :user
106
+ }
107
+ ```
108
+ ```ruby
109
+ config.default_path_prefix = lambda { |path, view|
110
+ view.controller.class.name.deconstantize.underscore
111
+ }
112
+ ```
113
+ При вызове `render_component`, `refine_component` параметр `default_path_prefix` будет использоваться:
114
+ ```ruby
115
+ # Эквивалентные записи
116
+ render_component(:modal)
117
+ refine_component(:modal, prefix: true)
118
+ ```
119
+ параметр `default_path_prefix` не будет использоваться и путь/название компонента будет иметь следующие значения:
120
+ ```ruby
121
+ # Эквивалентные записи
122
+ render_component(:modal, prefix: '') # => 'modal'
123
+ refine_component(:modal, prefix: false) # => 'modal'
124
+ refine_component(:modal, prefix: nil) # => 'modal'
125
+ ```
126
+ ```ruby
127
+ # Эквивалентные записи
128
+ render_component(:modal, prefix: :common) # => 'common/modal'
129
+ render_component(:modal, prefix: 'common') # => 'common/modal'
130
+ refine_component('common/modal', prefix: false) # => 'common/modal'
131
+ ```
132
+
133
+ ## Параметр `element_name_separator`
134
+
135
+ Устанавливает разделитель [между названием блока и названием элемента](https://ru.bem.info/methodology/naming-convention/).
136
+
137
+ ## Параметр `modifier_name_separator`
138
+
139
+ Устанавливает разделитель [между названием модификатора и названием блока или элемента](https://ru.bem.info/methodology/naming-convention/):
140
+ ```ruby
141
+ config.modifier_name_separator = '--' # block__elem--modifier-name
142
+ ```
143
+
144
+ ## Параметр `modifier_value_separator`
145
+
146
+ Устанавливает разделитель [между названием модификатора и значением модификатора](https://ru.bem.info/methodology/naming-convention/).
147
+
148
+ ## Параметр `path`
149
+
150
+ Устанавливает каталог в котором будут храниться все компоненты приложения, например если используется [Webpacker](https://github.com/rails/webpacker), тогда можно указать подкаталог в его каталоге:
151
+
152
+ ```ruby
153
+ config.path = Webpacker.config.source_path.join('components')
154
+ ```
155
+
156
+ ## Параметр `prepend_asset_paths`
157
+
158
+ Разрешает или запрещает добавлять пути до каталогов с компонентами в начало списка `assets.paths`, актуально только если приложение использует Sprockets.