view_component-scoped_styles 0.3.0 → 0.4.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/README.md +10 -2
- data/lib/generators/view_component/scoped_styles/install_generator.rb +14 -2
- data/lib/generators/view_component/scoped_styles/templates/view_component_scoped_styles.rb.tt +7 -1
- data/lib/view_component/scoped_styles/configuration.rb +15 -2
- data/lib/view_component/scoped_styles/stylist/writer.rb +9 -3
- data/lib/view_component/scoped_styles/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: c2f015fce0d3e52a95641a3a394e7d348c90db92e29b0d023f7a26990806a544
|
|
4
|
+
data.tar.gz: a856272767f5b7d5a882d6e8576bb0fe5195d94cacc3b11220f718cbdfa9123c
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: b2bb1e1106aa4fdb8c0d44df137c60d21680c050f9a9a9eef0f9b64bb6c05509f6a4f40bc40f9708806833d7a7d757317299417b64c7fb4834bbd8b98d725a32
|
|
7
|
+
data.tar.gz: 9f78813f81df45c463411cb5f3b1079b84c8f3745fbc870fd84e8512e1692eb71f98523a526bff2ad55964c26f2d190eccb57cbfc38d6ffea2da7a337d0a3620
|
data/README.md
CHANGED
|
@@ -206,7 +206,7 @@ or via the `component_class` helper:
|
|
|
206
206
|
|
|
207
207
|
### Using the scoped CSS
|
|
208
208
|
|
|
209
|
-
All scoped CSS will be compiled into `app/assets/stylesheets/components.scoped.css
|
|
209
|
+
All scoped CSS will be compiled into a single bundled stylesheet. By default that is `app/assets/stylesheets/components.scoped.css`; both the directory and filename are configurable (see [Configuration](#configuration)).
|
|
210
210
|
|
|
211
211
|
You should import this stylesheet within your app:
|
|
212
212
|
|
|
@@ -233,7 +233,13 @@ ViewComponent::ScopedStyles.configure do |config|
|
|
|
233
233
|
# Where ViewComponent classes live (relative to Rails.root). Default: "app/components"
|
|
234
234
|
config.components_path = File.join("app", "components")
|
|
235
235
|
|
|
236
|
-
#
|
|
236
|
+
# Where the bundled scoped stylesheet is written (relative to Rails.root). Default: "app/assets/stylesheets"
|
|
237
|
+
config.assets_path = File.join("app", "assets", "stylesheets")
|
|
238
|
+
|
|
239
|
+
# Filename of the bundled scoped stylesheet. Default: "components.scoped.css"
|
|
240
|
+
config.stylesheet_name = "components.scoped.css"
|
|
241
|
+
|
|
242
|
+
# Optional @layer name for the bundled scoped stylesheet (e.g. "components"). Default: nil.
|
|
237
243
|
config.components_layer = nil
|
|
238
244
|
|
|
239
245
|
# Prefix for scoped class names (e.g. "c-" produces "c-a1b2c3d4"). Default: "c-"
|
|
@@ -244,6 +250,8 @@ end
|
|
|
244
250
|
| Option | Default | Description |
|
|
245
251
|
| --- | --- | --- |
|
|
246
252
|
| `components_path` | `"app/components"` | Where ViewComponent classes live, relative to `Rails.root`. |
|
|
253
|
+
| `assets_path` | `"app/assets/stylesheets"` | Directory where the bundled scoped stylesheet is written, relative to `Rails.root`. |
|
|
254
|
+
| `stylesheet_name` | `"components.scoped.css"` | Filename of the bundled scoped stylesheet within `assets_path`. |
|
|
247
255
|
| `components_layer` | `nil` | When set, wraps generated CSS in `@layer <name> { ... }` for cascade control. |
|
|
248
256
|
| `css_class_prefix` | `"c-"` | Prefix prepended to scoped class names (e.g. `"vc-"` → `"vc-a1b2c3d4"`). |
|
|
249
257
|
|
|
@@ -27,8 +27,15 @@ module ViewComponent
|
|
|
27
27
|
end
|
|
28
28
|
|
|
29
29
|
def components_path_expression
|
|
30
|
-
|
|
31
|
-
|
|
30
|
+
path_expression_for(configuration_defaults.components_path)
|
|
31
|
+
end
|
|
32
|
+
|
|
33
|
+
def assets_path_expression
|
|
34
|
+
path_expression_for(configuration_defaults.assets_path)
|
|
35
|
+
end
|
|
36
|
+
|
|
37
|
+
def stylesheet_name_value
|
|
38
|
+
configuration_defaults.stylesheet_name.inspect
|
|
32
39
|
end
|
|
33
40
|
|
|
34
41
|
def components_layer_value
|
|
@@ -38,6 +45,11 @@ module ViewComponent
|
|
|
38
45
|
def css_class_prefix_value
|
|
39
46
|
configuration_defaults.css_class_prefix.inspect
|
|
40
47
|
end
|
|
48
|
+
|
|
49
|
+
def path_expression_for(path)
|
|
50
|
+
segments = Pathname(path).each_filename.to_a
|
|
51
|
+
"File.join(#{segments.map { |segment| %("#{segment}") }.join(", ")})"
|
|
52
|
+
end
|
|
41
53
|
end
|
|
42
54
|
end
|
|
43
55
|
end
|
data/lib/generators/view_component/scoped_styles/templates/view_component_scoped_styles.rb.tt
CHANGED
|
@@ -4,7 +4,13 @@ ViewComponent::ScopedStyles.configure do |config|
|
|
|
4
4
|
# Where ViewComponent classes live (relative to Rails.root). Default: "app/components"
|
|
5
5
|
config.components_path = <%= components_path_expression %>
|
|
6
6
|
|
|
7
|
-
#
|
|
7
|
+
# Where the bundled scoped stylesheet is written (relative to Rails.root). Default: "app/assets/stylesheets"
|
|
8
|
+
config.assets_path = <%= assets_path_expression %>
|
|
9
|
+
|
|
10
|
+
# Filename of the bundled scoped stylesheet. Default: "components.scoped.css"
|
|
11
|
+
config.stylesheet_name = <%= stylesheet_name_value %>
|
|
12
|
+
|
|
13
|
+
# Optional @layer name for the bundled scoped stylesheet (e.g. "components"). Default: nil.
|
|
8
14
|
config.components_layer = <%= components_layer_value %>
|
|
9
15
|
|
|
10
16
|
# Prefix for scoped class names (e.g. "c-" produces "c-a1b2c3d4"). Default: "c-"
|
|
@@ -8,6 +8,8 @@ module ViewComponent
|
|
|
8
8
|
#
|
|
9
9
|
# ViewComponent::ScopedStyles.configure do |config|
|
|
10
10
|
# config.components_path = File.join("app", "view_components")
|
|
11
|
+
# config.assets_path = File.join("app", "assets", "stylesheets")
|
|
12
|
+
# config.stylesheet_name = "components.scoped.css"
|
|
11
13
|
# config.components_layer = "components"
|
|
12
14
|
# end
|
|
13
15
|
class Configuration
|
|
@@ -16,8 +18,17 @@ module ViewComponent
|
|
|
16
18
|
# @return [String] default: +"app/components"+
|
|
17
19
|
attr_accessor :components_path
|
|
18
20
|
|
|
19
|
-
#
|
|
20
|
-
#
|
|
21
|
+
# Directory where the bundled scoped stylesheet is written, relative to {Rails.root}.
|
|
22
|
+
#
|
|
23
|
+
# @return [String] default: +"app/assets/stylesheets"+
|
|
24
|
+
attr_accessor :assets_path
|
|
25
|
+
|
|
26
|
+
# Filename of the bundled scoped stylesheet within {assets_path}.
|
|
27
|
+
#
|
|
28
|
+
# @return [String] default: +"components.scoped.css"+
|
|
29
|
+
attr_accessor :stylesheet_name
|
|
30
|
+
|
|
31
|
+
# Optional CSS cascade layer name for the bundled scoped stylesheet.
|
|
21
32
|
#
|
|
22
33
|
# When set, the bundled stylesheet is wrapped in +@layer <name> { ... }+ so
|
|
23
34
|
# you can control specificity relative to other layers in your app.
|
|
@@ -32,6 +43,8 @@ module ViewComponent
|
|
|
32
43
|
|
|
33
44
|
def initialize
|
|
34
45
|
@components_path = File.join("app", "components")
|
|
46
|
+
@assets_path = File.join("app", "assets", "stylesheets")
|
|
47
|
+
@stylesheet_name = "components.scoped.css"
|
|
35
48
|
@components_layer = nil
|
|
36
49
|
@css_class_prefix = "c-"
|
|
37
50
|
end
|
|
@@ -48,7 +48,7 @@ module ViewComponent
|
|
|
48
48
|
end
|
|
49
49
|
|
|
50
50
|
def write_atomically(content)
|
|
51
|
-
if
|
|
51
|
+
if config.components_layer
|
|
52
52
|
content = content.rstrip + "\n}\n"
|
|
53
53
|
end
|
|
54
54
|
|
|
@@ -84,7 +84,7 @@ module ViewComponent
|
|
|
84
84
|
def initial_content
|
|
85
85
|
content = "/* Generated by ViewComponent::ScopedStyles - Do not edit manually */\n"
|
|
86
86
|
|
|
87
|
-
if (layer =
|
|
87
|
+
if (layer = config.components_layer)
|
|
88
88
|
content += "@layer #{layer} {\n"
|
|
89
89
|
end
|
|
90
90
|
|
|
@@ -92,7 +92,13 @@ module ViewComponent
|
|
|
92
92
|
end
|
|
93
93
|
|
|
94
94
|
def stylesheet_path
|
|
95
|
-
@stylesheet_path ||=
|
|
95
|
+
@stylesheet_path ||= begin
|
|
96
|
+
Rails.root.join(config.assets_path, config.stylesheet_name)
|
|
97
|
+
end
|
|
98
|
+
end
|
|
99
|
+
|
|
100
|
+
def config
|
|
101
|
+
@config ||= ViewComponent::ScopedStyles.configuration
|
|
96
102
|
end
|
|
97
103
|
end
|
|
98
104
|
end
|