react-components-rails 1.0.0.beta3 → 1.0.0.beta4
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/Gemfile.lock +1 -1
- data/README.md +1 -1
- data/package.json +6 -5
- data/react-components-rails.gemspec +2 -2
- data/src/index.ts +19 -23
- 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: c1d7d3cf2e6a1a031361b2cc056e9aef369c2f26eda0463fa9f40158a1e21301
|
|
4
|
+
data.tar.gz: aa3a97e407e6fe6bbacbe4c4b312c13ee7214190daac3459e388513ab0e28ffd
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 5e45d02f71d0a19ded76e7e77e507a765e843d5f1055b5c77b663d7207d215248b2c46c64e5b435cc2d1ed86a3286d8142469b26eb041fc5624f0cf1722bf7c3
|
|
7
|
+
data.tar.gz: 6e24bece53a89c2a077024e559d511b7cddf9285cf503d1ce111ae93caaa9555ac5070dd725273ed54bb738926b8285e95fc109178db0f7b012f0b4252215c64
|
data/Gemfile.lock
CHANGED
data/README.md
CHANGED
|
@@ -9,7 +9,7 @@ React-Components-Rails makes it easy to use [React](https://reactjs.org/) with y
|
|
|
9
9
|
First, you need to add this gem to your Rails app Gemfile:
|
|
10
10
|
|
|
11
11
|
```ruby
|
|
12
|
-
gem 'react-components-rails', "~> 1.0.0.beta.
|
|
12
|
+
gem 'react-components-rails', "~> 1.0.0.beta.4"
|
|
13
13
|
```
|
|
14
14
|
|
|
15
15
|
Once done, run `bundle` to install the gem.
|
data/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-components-rails",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.4",
|
|
4
4
|
"homepage": "https://github.com/renchap/react-components-rails",
|
|
5
5
|
"repository": "renchap/react-components-rails",
|
|
6
6
|
"author": {
|
|
@@ -10,11 +10,12 @@
|
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"source": "src/index.ts",
|
|
12
12
|
"exports": {
|
|
13
|
-
"import": "./dist/index.
|
|
14
|
-
"require": "./dist/index.
|
|
15
|
-
"default": "./dist/index.
|
|
13
|
+
"import": "./dist/index.js",
|
|
14
|
+
"require": "./dist/index.cjs",
|
|
15
|
+
"default": "./dist/index.js"
|
|
16
16
|
},
|
|
17
|
-
"
|
|
17
|
+
"type": "module",
|
|
18
|
+
"main": "./dist/index.cjs",
|
|
18
19
|
"types": "dist/index.d.ts",
|
|
19
20
|
"files": [
|
|
20
21
|
"dist/",
|
|
@@ -6,7 +6,7 @@ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
|
|
6
6
|
Gem::Specification.new do |spec|
|
|
7
7
|
spec.name = "react-components-rails"
|
|
8
8
|
spec.licenses = ["MIT"]
|
|
9
|
-
spec.version = "1.0.0.
|
|
9
|
+
spec.version = "1.0.0.beta4"
|
|
10
10
|
spec.authors = ["Renaud Chaput"]
|
|
11
11
|
spec.email = ["renchap@gmail.com"]
|
|
12
12
|
|
|
@@ -15,7 +15,7 @@ Gem::Specification.new do |spec|
|
|
|
15
15
|
spec.homepage = "https://github.com/renchap/webpacker-react"
|
|
16
16
|
|
|
17
17
|
spec.files = `git ls-files -z`.split("\x0").reject do |f|
|
|
18
|
-
f.match(%r{^(test|spec|features)/})
|
|
18
|
+
f.match(%r{^(test|spec|features|pnpm-lock.yaml)/})
|
|
19
19
|
end
|
|
20
20
|
spec.bindir = "exe"
|
|
21
21
|
spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
|
data/src/index.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react"
|
|
2
2
|
import ReactDOM from "react-dom"
|
|
3
|
-
import ReactDOMClient
|
|
3
|
+
import type ReactDOMClient from "react-dom/client"
|
|
4
4
|
|
|
5
5
|
// import ujs from './ujs'
|
|
6
6
|
|
|
@@ -15,11 +15,8 @@ declare global {
|
|
|
15
15
|
|
|
16
16
|
class ReactComponentsRails {
|
|
17
17
|
#registeredComponents = {} as { [name: string]: React.ComponentType }
|
|
18
|
-
#mountedRoots = [] as Root[]
|
|
19
|
-
#ReactDOMClient = undefined as
|
|
20
|
-
| typeof ReactDOM
|
|
21
|
-
| typeof ReactDOMClient
|
|
22
|
-
| undefined
|
|
18
|
+
#mountedRoots = [] as ReactDOMClient.Root[]
|
|
19
|
+
#ReactDOMClient = undefined as typeof ReactDOMClient | undefined | false
|
|
23
20
|
|
|
24
21
|
static getInstance() {
|
|
25
22
|
if (typeof window.ReactComponentsRails === "undefined") {
|
|
@@ -39,13 +36,11 @@ class ReactComponentsRails {
|
|
|
39
36
|
const reactElement = React.createElement(component, props)
|
|
40
37
|
|
|
41
38
|
if (this.#ReactDOMClient) {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
this.#ReactDOMClient.render(reactElement, node)
|
|
48
|
-
}
|
|
39
|
+
const root = this.#ReactDOMClient.createRoot(node)
|
|
40
|
+
root.render(reactElement)
|
|
41
|
+
this.#mountedRoots.push(root)
|
|
42
|
+
} else {
|
|
43
|
+
ReactDOM.render(reactElement, node)
|
|
49
44
|
}
|
|
50
45
|
}
|
|
51
46
|
|
|
@@ -76,14 +71,12 @@ class ReactComponentsRails {
|
|
|
76
71
|
// Not used for now, useful for UJS
|
|
77
72
|
// private unmountComponents() {
|
|
78
73
|
// if (this.#ReactDOMClient) {
|
|
79
|
-
//
|
|
80
|
-
//
|
|
81
|
-
//
|
|
82
|
-
//
|
|
83
|
-
//
|
|
84
|
-
//
|
|
85
|
-
// this.#ReactDOMClient.unmountComponentAtNode(mounted[i])
|
|
86
|
-
// }
|
|
74
|
+
// this.#mountedRoots.forEach((root) => root.unmount())
|
|
75
|
+
// this.#mountedRoots = []
|
|
76
|
+
// } else {
|
|
77
|
+
// const mounted = document.querySelectorAll(`[${CLASS_ATTRIBUTE_NAME}]`)
|
|
78
|
+
// for (let i = 0; i < mounted.length; i += 1) {
|
|
79
|
+
// ReactDOM.unmountComponentAtNode(mounted[i])
|
|
87
80
|
// }
|
|
88
81
|
// }
|
|
89
82
|
// }
|
|
@@ -127,11 +120,14 @@ class ReactComponentsRails {
|
|
|
127
120
|
|
|
128
121
|
import("react-dom/client")
|
|
129
122
|
.then((i) => {
|
|
130
|
-
|
|
123
|
+
// with some bundlers, it can be imported as `.default`, while not with some others
|
|
124
|
+
this.#ReactDOMClient = i.default || i
|
|
131
125
|
resolve()
|
|
132
126
|
})
|
|
133
127
|
.catch(() => {
|
|
134
|
-
this
|
|
128
|
+
// if this fails, then we will fallback to the legacy API
|
|
129
|
+
this.#ReactDOMClient = false
|
|
130
|
+
resolve()
|
|
135
131
|
})
|
|
136
132
|
})
|
|
137
133
|
}
|