actionview-svelte-handler 0.5.5 → 0.5.7
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/.gitignore +3 -1
- data/Gemfile.lock +2 -2
- data/README.md +3 -131
- data/actionview-svelte-handler.gemspec +5 -5
- data/lib/svelte/version.rb +1 -1
- data/package-lock.json +2702 -144
- data/package.json +8 -2
- metadata +8 -8
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 35a9952571d74905f67d9219dd86b759f2ac7b11c42fc68a0817f964247fa0d4
|
4
|
+
data.tar.gz: be744cb8c46cfaafe8e4d3a707499038eb6f3200f0256cc947d766ed325d0d08
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: c7ca8ce660365595737c2f60e04b6c027a11f879e540f3af405d31fe168caf58914cb7b7e1a74c08c4ee74e2c226d01c5cb45b39944d981b5eb564074a25c5b2
|
7
|
+
data.tar.gz: 28fbb9843d9893b9a92a03c26296e7fe3271548ceea5a5e2a559d578d3ec5ff545a3de7f0076e0c62b7605b9494d9996ef397130186313f70030427a4ff41c7b
|
data/.gitignore
CHANGED
data/Gemfile.lock
CHANGED
data/README.md
CHANGED
@@ -8,138 +8,10 @@
|
|
8
8
|
|
9
9
|
`actionview-svelte-handler` is a template handler for Action View that allows you to create [Svelte](https://svelte.dev) views in Rails applications with ease.
|
10
10
|
|
11
|
-
|
11
|
+
> [!NOTE]
|
12
|
+
>
|
13
|
+
> The documentation for this gem is available at [svelte.rb.obl.ong](https://svelte.rb.obl.ong)
|
12
14
|
|
13
|
-
Add `.html.svelte` views to your application instead of `.html.erb`.
|
14
|
-
|
15
|
-
> [!CAUTION]
|
16
|
-
> This will make ERB helpers unavailable because Svelte is registered as a template handler, replacing ERB when it is used.
|
17
|
-
|
18
|
-
To pass props, use the `Svelte.props` object in your controller (or set instance variables), and then access them as a store with `$props`.
|
19
|
-
|
20
|
-
### Example usage
|
21
|
-
|
22
|
-
#### Controller
|
23
|
-
|
24
|
-
`app/controllers/users_controller.rb`:
|
25
|
-
|
26
|
-
```ruby
|
27
|
-
def show
|
28
|
-
Svelte.props[:user] = User.find_by(username: params[:username])
|
29
|
-
end
|
30
|
-
```
|
31
|
-
|
32
|
-
#### View
|
33
|
-
|
34
|
-
`app/views/users/show.html.svelte`:
|
35
|
-
|
36
|
-
```html
|
37
|
-
<script>
|
38
|
-
let name = $props.user.name
|
39
|
-
$: mailto = "mailto://" + $props.user.email
|
40
|
-
</script>
|
41
|
-
|
42
|
-
<h1>Hello, {name}</h1>
|
43
|
-
<a href={mailto}>{$props.user.email}</a>
|
44
|
-
|
45
|
-
<style>
|
46
|
-
h1 {
|
47
|
-
color: red
|
48
|
-
}
|
49
|
-
</style>
|
50
|
-
```
|
51
|
-
|
52
|
-
### Configuration
|
53
|
-
|
54
|
-
Configuration options can be found in `config/initializers/svelte.rb`. The following is a list of options and some information:
|
55
|
-
|
56
|
-
| Option with type | Description | Default |
|
57
|
-
| ------------------- | ---------------------------------------------------------------------- | ----------------------------------- |
|
58
|
-
| `ssr <bool>` | Global server-side rendering. Does not override the svelte[ssr] local. | `true` |
|
59
|
-
| `aliases <Hash[Symbol, String]>` | Path aliases when importing from Svelte views. | See [path aliases](#path-aliases) |
|
60
|
-
| `preprocess <Hash[String \| Symbol, String]>` | Configuration for [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess/blob/main/docs/usage.md) | `{}` |
|
61
|
-
|
62
|
-
#### Example usage (with `Svelte.configure` block)
|
63
|
-
|
64
|
-
`config/initializers/svelte.rb`:
|
65
|
-
|
66
|
-
```ruby
|
67
|
-
Svelte.configure do |config|
|
68
|
-
config.ssr = true
|
69
|
-
config.aliases = {
|
70
|
-
:$views => Rails.root.join("app", "views")
|
71
|
-
}
|
72
|
-
end
|
73
|
-
```
|
74
|
-
|
75
|
-
### Locals
|
76
|
-
|
77
|
-
To set per-render options, we use a set of locals underneath the `svelte` hash. Locals are always the highest precedence
|
78
|
-
|
79
|
-
| Option with type | Description | Default |
|
80
|
-
| ------------------- | -------------------------------------------------------------------------- | ------------------------------------- |
|
81
|
-
| `ssr <bool>` | Server-side prerendering | `true` |
|
82
|
-
| `island <Hash[String, String]>` | HTML attributes for [is-land](https://github.com/11ty/is-land) | `{ "on:visible": "", "on:idle": "" }` |
|
83
|
-
|
84
|
-
#### Example usage
|
85
|
-
|
86
|
-
`app/controllers/example_controller.rb`:
|
87
|
-
|
88
|
-
```ruby
|
89
|
-
render "view", locals: { svelte: { ssr: false } }
|
90
|
-
```
|
91
|
-
|
92
|
-
### Variants
|
93
|
-
|
94
|
-
To configure server-side rendering at a file level, you can use the `client` and `server` variants. Just set your file name like in the example.
|
95
|
-
|
96
|
-
#### Example usage
|
97
|
-
|
98
|
-
`app/views/example/show.html+client.svelte`
|
99
|
-
|
100
|
-
`app/views/example/show.html+server.svelte`
|
101
|
-
|
102
|
-
`app/controllers/example_controller.rb`:
|
103
|
-
|
104
|
-
```ruby
|
105
|
-
render "view", variant: "client"
|
106
|
-
```
|
107
|
-
|
108
|
-
### Path aliases
|
109
|
-
|
110
|
-
Path aliases are used as quick references from your Svelte views to key paths in your application. They are primarily utilized when importing other Svelte components (i.e. partials).
|
111
|
-
|
112
|
-
The list of path aliases set by the generator is as follows:
|
113
|
-
|
114
|
-
| Alias | Resolution |
|
115
|
-
| -------- | -------------------------------- |
|
116
|
-
| `$root` | `Rails.root` |
|
117
|
-
| `$app` | `Rails.root.join "app"` |
|
118
|
-
| `$views` | `Rails.root.join "app", "views"` |
|
119
|
-
|
120
|
-
#### Example usage
|
121
|
-
|
122
|
-
```javascript
|
123
|
-
import Card from "$views/application/card.html.svelte"
|
124
|
-
```
|
125
|
-
|
126
|
-
## Installation
|
127
|
-
|
128
|
-
1. Ensure you have [Node.js >=v12.16.0](https://nodejs.org) and [NPM](https://npmjs.com) in your `$PATH`
|
129
|
-
|
130
|
-
3. Add the `actionview-svelte-handler` gem to your Gemfile by executing:
|
131
|
-
|
132
|
-
```bash
|
133
|
-
bundle add actionview-svelte-handler
|
134
|
-
```
|
135
|
-
|
136
|
-
4. And then execute the generator:
|
137
|
-
|
138
|
-
```bash
|
139
|
-
bin/rails generate svelte:install
|
140
|
-
```
|
141
|
-
|
142
|
-
5. Enjoy!
|
143
15
|
|
144
16
|
## Copyright
|
145
17
|
|
@@ -5,17 +5,17 @@ Gem::Specification.new do |spec|
|
|
5
5
|
spec.version = Svelte::VERSION
|
6
6
|
spec.authors = ["reesericci"]
|
7
7
|
spec.email = ["me@reeseric.ci"]
|
8
|
-
spec.homepage = "https://
|
8
|
+
spec.homepage = "https://svelte.rb.obl.ong"
|
9
9
|
spec.summary = "Create .svelte views seamlessly in Rails applications"
|
10
10
|
spec.description = "Documentation is available at #{spec.homepage}"
|
11
|
-
spec.license = "LGPL-
|
11
|
+
spec.license = "LGPL-3.0-or-later"
|
12
12
|
|
13
13
|
spec.metadata["homepage_uri"] = spec.homepage
|
14
|
-
spec.metadata["source_code_uri"] =
|
14
|
+
spec.metadata["source_code_uri"] = "https://codeberg.org/reesericci/actionview-svelte-handler"
|
15
15
|
|
16
16
|
spec.files = Dir.chdir(File.expand_path("..", __FILE__)) do
|
17
|
-
`git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
|
17
|
+
`git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features|docs)/}) }
|
18
18
|
end
|
19
19
|
|
20
|
-
spec.
|
20
|
+
spec.add_runtime_dependency "rails", "~> 7.0"
|
21
21
|
end
|
data/lib/svelte/version.rb
CHANGED