react_for_rails 0.0.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/.rspec +3 -0
- data/.rubocop.yml +82 -0
- data/CHANGELOG.md +5 -0
- data/LICENSE.txt +21 -0
- data/README.md +30 -0
- data/Rakefile +12 -0
- data/app/helpers/react_for_rails_helper.rb +5 -0
- data/lib/react_for_rails/engine.rb +6 -0
- data/lib/react_for_rails/helper.rb +23 -0
- data/lib/react_for_rails/version.rb +5 -0
- data/lib/react_for_rails.rb +4 -0
- data/node_modules/.yarn-integrity +10 -0
- data/node_package/src/ReactForRails.js +89 -0
- data/package.json +28 -0
- data/sig/react_for_rails.rbs +4 -0
- data/yarn.lock +4 -0
- metadata +62 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA256:
|
3
|
+
metadata.gz: 9854257125995e1a483db136b560e75176004af5e83043001be76ea654542f6d
|
4
|
+
data.tar.gz: e200204f2b5466fe98bfa6e5538bf98e80d9b8991977886026cd9735a2aee469
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 6e58856cb17aacedecd3b85cfc7dae710c4fd165d6a31c65c06966beaf54780efa4a29ee68465e22e964a06c03a5db7482a64f09581eb571c29a34c9b6f9c20f
|
7
|
+
data.tar.gz: e118639eafbf219f7d64571bb574ec05708b221653dfa370d817000170247c37718fd28df0b8f979acdb24afdd145f45179e7d4dacb090f1516a312d3b669ccc
|
data/.rspec
ADDED
data/.rubocop.yml
ADDED
@@ -0,0 +1,82 @@
|
|
1
|
+
require: rubocop-rails
|
2
|
+
|
3
|
+
AllCops:
|
4
|
+
Exclude:
|
5
|
+
- "lib/tasks/auto_annotate_models.rake"
|
6
|
+
- "db/schema.rb"
|
7
|
+
- "db/data_schema.rb"
|
8
|
+
- "bin/{bundle,rails,rake,setup,spring,webpack,webpack-dev-server,yarn}"
|
9
|
+
- "tmp/**/*"
|
10
|
+
- "config.ru"
|
11
|
+
- "config/boot.rb"
|
12
|
+
NewCops: enable
|
13
|
+
TargetRubyVersion: 3.2.2
|
14
|
+
|
15
|
+
Layout/ArrayAlignment:
|
16
|
+
EnforcedStyle: with_first_element
|
17
|
+
|
18
|
+
Layout/FirstHashElementIndentation:
|
19
|
+
EnforcedStyle: consistent
|
20
|
+
|
21
|
+
Layout/LineLength:
|
22
|
+
Max: 120
|
23
|
+
Exclude:
|
24
|
+
- "db/seeds/*.rb"
|
25
|
+
|
26
|
+
Layout/MultilineMethodCallIndentation:
|
27
|
+
EnforcedStyle: indented
|
28
|
+
|
29
|
+
Lint/AmbiguousBlockAssociation:
|
30
|
+
Exclude:
|
31
|
+
- "spec/**/*_spec.rb"
|
32
|
+
|
33
|
+
Metrics/AbcSize:
|
34
|
+
CountRepeatedAttributes: false
|
35
|
+
Exclude:
|
36
|
+
- "db/migrate/*.rb"
|
37
|
+
- "lib/generators/**/*_generator.rb"
|
38
|
+
AllowedMethods:
|
39
|
+
- required_fields
|
40
|
+
Max: 20
|
41
|
+
|
42
|
+
Metrics/BlockLength:
|
43
|
+
Max: 15
|
44
|
+
Exclude:
|
45
|
+
- "config/routes.rb"
|
46
|
+
- "app/**/*.html.arb"
|
47
|
+
- "spec/**/*_spec.rb"
|
48
|
+
- "spec/factories/**/*.rb"
|
49
|
+
- "spec/support/shared_examples/**/*.rb"
|
50
|
+
- "config/environments/*.rb"
|
51
|
+
- "lib/tasks/*.rake"
|
52
|
+
AllowedMethods:
|
53
|
+
- class_methods
|
54
|
+
|
55
|
+
Metrics/ClassLength:
|
56
|
+
Max: 200
|
57
|
+
|
58
|
+
Metrics/CyclomaticComplexity:
|
59
|
+
Exclude:
|
60
|
+
- "lib/generators/**/*_generator.rb"
|
61
|
+
AllowedMethods:
|
62
|
+
- required_fields
|
63
|
+
|
64
|
+
Metrics/MethodLength:
|
65
|
+
CountAsOne: ["array", "method_call"]
|
66
|
+
Exclude:
|
67
|
+
- "db/migrate/**/*"
|
68
|
+
- "lib/generators/**/*_generator.rb"
|
69
|
+
- "spec/integration/api/models/**/*"
|
70
|
+
AllowedMethods:
|
71
|
+
- required_fields
|
72
|
+
|
73
|
+
Metrics/PerceivedComplexity:
|
74
|
+
Exclude:
|
75
|
+
- "lib/generators/**/*_generator.rb"
|
76
|
+
AllowedMethods:
|
77
|
+
- required_fields
|
78
|
+
|
79
|
+
Style/StringLiterals:
|
80
|
+
EnforcedStyle: single_quotes
|
81
|
+
Exclude:
|
82
|
+
- "Gemfile"
|
data/CHANGELOG.md
ADDED
data/LICENSE.txt
ADDED
@@ -0,0 +1,21 @@
|
|
1
|
+
The MIT License (MIT)
|
2
|
+
|
3
|
+
Copyright (c) 2024 Mateusz Wszeborowski
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
7
|
+
in the Software without restriction, including without limitation the rights
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
10
|
+
furnished to do so, subject to the following conditions:
|
11
|
+
|
12
|
+
The above copyright notice and this permission notice shall be included in
|
13
|
+
all copies or substantial portions of the Software.
|
14
|
+
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
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.
|
data/README.md
ADDED
@@ -0,0 +1,30 @@
|
|
1
|
+
# ReactForRails
|
2
|
+
|
3
|
+
Lightweight Ruby gem + npm package to add React components to Rails app. Inspired by ReactOnRails.
|
4
|
+
|
5
|
+
## Installation
|
6
|
+
|
7
|
+
Install the gem and add to the application's Gemfile by executing:
|
8
|
+
|
9
|
+
$ bundle add react_for_rails
|
10
|
+
|
11
|
+
If bundler is not being used to manage dependencies, install the gem by executing:
|
12
|
+
|
13
|
+
$ gem install react_for_rails
|
14
|
+
|
15
|
+
Add npm package to your package.json
|
16
|
+
|
17
|
+
$ yarn add react-for-rails
|
18
|
+
|
19
|
+
## Usage
|
20
|
+
|
21
|
+
$ ReactForRails.register({Component1, Component2}) // In your javascript
|
22
|
+
$ react_component('Component1', props: {something: 'Test'}) // In your Rails view
|
23
|
+
|
24
|
+
## Contributing
|
25
|
+
|
26
|
+
Bug reports and pull requests are welcome on GitHub at https://github.com/wszeborowskimateusz/react_for_rails.
|
27
|
+
|
28
|
+
## License
|
29
|
+
|
30
|
+
The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
data/Rakefile
ADDED
@@ -0,0 +1,23 @@
|
|
1
|
+
module ReactForRails
|
2
|
+
module Helper
|
3
|
+
def react_component(name, options = {})
|
4
|
+
props = options[:props] || {}
|
5
|
+
props_json = ERB::Util.json_escape(props.is_a?(String) ? props : props.to_json)
|
6
|
+
|
7
|
+
id = "react-component-#{SecureRandom.hex(8)}"
|
8
|
+
|
9
|
+
html_options = options[:html_options] || {}
|
10
|
+
html_options[:id] = id
|
11
|
+
|
12
|
+
content_tag(:div, "", html_options) +
|
13
|
+
content_tag(
|
14
|
+
:script,
|
15
|
+
props_json.html_safe,
|
16
|
+
type: "application/json",
|
17
|
+
"data-dom-id" => id,
|
18
|
+
"data-component-name" => name,
|
19
|
+
class: "custom-react-component-render"
|
20
|
+
)
|
21
|
+
end
|
22
|
+
end
|
23
|
+
end
|
@@ -0,0 +1,89 @@
|
|
1
|
+
import React from "react";
|
2
|
+
import { createRoot } from "react-dom/client";
|
3
|
+
|
4
|
+
const componentsRegistry = {};
|
5
|
+
|
6
|
+
export function register(components) {
|
7
|
+
Object.keys(components).forEach((name) => {
|
8
|
+
if (name in componentsRegistry) {
|
9
|
+
console.warn(
|
10
|
+
"Called register for component that is already registered",
|
11
|
+
name
|
12
|
+
);
|
13
|
+
}
|
14
|
+
|
15
|
+
const component = components[name];
|
16
|
+
if (!component) {
|
17
|
+
throw new Error(`Called register with null component named ${name}`);
|
18
|
+
}
|
19
|
+
|
20
|
+
componentsRegistry[name] = component;
|
21
|
+
});
|
22
|
+
}
|
23
|
+
|
24
|
+
function reactHtmlElements() {
|
25
|
+
return document.getElementsByClassName("custom-react-component-render");
|
26
|
+
}
|
27
|
+
|
28
|
+
function render(el) {
|
29
|
+
const name = el.getAttribute("data-component-name") || "";
|
30
|
+
const domNodeId = el.getAttribute("data-dom-id") || "";
|
31
|
+
const props = el.textContent !== null ? JSON.parse(el.textContent) : {};
|
32
|
+
|
33
|
+
try {
|
34
|
+
const domNode = document.getElementById(domNodeId);
|
35
|
+
if (domNode) {
|
36
|
+
const Component = componentsRegistry[name];
|
37
|
+
|
38
|
+
if (Component != null) {
|
39
|
+
const ReactElement = React.createElement(Component, props);
|
40
|
+
|
41
|
+
const root = createRoot(domNode);
|
42
|
+
root.render(ReactElement);
|
43
|
+
|
44
|
+
window.reactComponentsRoots.push(root);
|
45
|
+
}
|
46
|
+
}
|
47
|
+
} catch (e) {
|
48
|
+
console.error(e.message);
|
49
|
+
e.message = `Encountered an error while rendering component: ${name}. See above error message.`;
|
50
|
+
throw e;
|
51
|
+
}
|
52
|
+
}
|
53
|
+
|
54
|
+
function reactPageUnloaded() {
|
55
|
+
for (const root of window.reactComponentsRoots ?? []) {
|
56
|
+
root.unmount();
|
57
|
+
}
|
58
|
+
}
|
59
|
+
|
60
|
+
function reactPageLoaded() {
|
61
|
+
window.reactComponentsRoots = [];
|
62
|
+
|
63
|
+
const els = reactHtmlElements();
|
64
|
+
for (let i = 0; i < els.length; i += 1) {
|
65
|
+
render(els[i]);
|
66
|
+
}
|
67
|
+
}
|
68
|
+
|
69
|
+
function onPageReady(callback) {
|
70
|
+
if (document.readyState === "complete") {
|
71
|
+
callback();
|
72
|
+
} else {
|
73
|
+
document.addEventListener(
|
74
|
+
"readystatechange",
|
75
|
+
function onReadyStateChange() {
|
76
|
+
onPageReady(callback);
|
77
|
+
document.removeEventListener("readystatechange", onReadyStateChange);
|
78
|
+
}
|
79
|
+
);
|
80
|
+
}
|
81
|
+
}
|
82
|
+
|
83
|
+
function onPageLoaded() {
|
84
|
+
document.addEventListener("turbolinks:before-render", reactPageUnloaded);
|
85
|
+
document.addEventListener("turbolinks:render", reactPageLoaded);
|
86
|
+
reactPageLoaded();
|
87
|
+
}
|
88
|
+
|
89
|
+
onPageReady(onPageLoaded);
|
data/package.json
ADDED
@@ -0,0 +1,28 @@
|
|
1
|
+
{
|
2
|
+
"name": "react-for-rails",
|
3
|
+
"version": "0.0.1",
|
4
|
+
"description": "npm package for ReactForRails ruby gem",
|
5
|
+
"main": "node_package/src/ReactForRails.js",
|
6
|
+
"files": [
|
7
|
+
"node_package/src"
|
8
|
+
],
|
9
|
+
"peerDependencies": {
|
10
|
+
"react": ">= 18",
|
11
|
+
"react-dom": ">= 18"
|
12
|
+
},
|
13
|
+
"repository": {
|
14
|
+
"type": "git",
|
15
|
+
"url": "git+https://github.com/wszeborowskimateusz/react-for-rails.git"
|
16
|
+
},
|
17
|
+
"keywords": [
|
18
|
+
"react",
|
19
|
+
"rails",
|
20
|
+
"ruby"
|
21
|
+
],
|
22
|
+
"author": "wszeborowskimateusz@gmail.com",
|
23
|
+
"license": "MIT",
|
24
|
+
"bugs": {
|
25
|
+
"url": "https://github.com/wszeborowskimateusz/react-for-rails/issues"
|
26
|
+
},
|
27
|
+
"homepage": "https://github.com/wszeborowskimateusz/react-for-rails#readme"
|
28
|
+
}
|
data/yarn.lock
ADDED
metadata
ADDED
@@ -0,0 +1,62 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: react_for_rails
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.0.1
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Mateusz Wszeborowski
|
8
|
+
autorequire:
|
9
|
+
bindir: exe
|
10
|
+
cert_chain: []
|
11
|
+
date: 2024-09-05 00:00:00.000000000 Z
|
12
|
+
dependencies: []
|
13
|
+
description:
|
14
|
+
email:
|
15
|
+
- wszeborowskimateusz@gmail.com
|
16
|
+
executables: []
|
17
|
+
extensions: []
|
18
|
+
extra_rdoc_files: []
|
19
|
+
files:
|
20
|
+
- ".rspec"
|
21
|
+
- ".rubocop.yml"
|
22
|
+
- CHANGELOG.md
|
23
|
+
- LICENSE.txt
|
24
|
+
- README.md
|
25
|
+
- Rakefile
|
26
|
+
- app/helpers/react_for_rails_helper.rb
|
27
|
+
- lib/react_for_rails.rb
|
28
|
+
- lib/react_for_rails/engine.rb
|
29
|
+
- lib/react_for_rails/helper.rb
|
30
|
+
- lib/react_for_rails/version.rb
|
31
|
+
- node_modules/.yarn-integrity
|
32
|
+
- node_package/src/ReactForRails.js
|
33
|
+
- package.json
|
34
|
+
- sig/react_for_rails.rbs
|
35
|
+
- yarn.lock
|
36
|
+
homepage: https://github.com/wszeborowskimateusz/react-for-rails
|
37
|
+
licenses:
|
38
|
+
- MIT
|
39
|
+
metadata:
|
40
|
+
homepage_uri: https://github.com/wszeborowskimateusz/react-for-rails
|
41
|
+
source_code_uri: https://github.com/wszeborowskimateusz/react-for-rails
|
42
|
+
changelog_uri: https://github.com/wszeborowskimateusz/react-for-rails/blob/main/CHANGELOG.md
|
43
|
+
post_install_message:
|
44
|
+
rdoc_options: []
|
45
|
+
require_paths:
|
46
|
+
- lib
|
47
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
48
|
+
requirements:
|
49
|
+
- - ">="
|
50
|
+
- !ruby/object:Gem::Version
|
51
|
+
version: 3.0.0
|
52
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
53
|
+
requirements:
|
54
|
+
- - ">="
|
55
|
+
- !ruby/object:Gem::Version
|
56
|
+
version: '0'
|
57
|
+
requirements: []
|
58
|
+
rubygems_version: 3.4.10
|
59
|
+
signing_key:
|
60
|
+
specification_version: 4
|
61
|
+
summary: Enables using React components in Rails apps. Inspired by react_on_rails
|
62
|
+
test_files: []
|