react-components-rails 1.0.0.beta3 → 1.0.0.beta4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: b0c3195d86d0560cf12133385cef8ea31ab04781fef04127f548d8aa57586ef0
-  data.tar.gz: 7c733c62ce9dc6592afa462563ab8882aaf9a003e6aec95c403cfbeb1479ea3c
+  metadata.gz: c1d7d3cf2e6a1a031361b2cc056e9aef369c2f26eda0463fa9f40158a1e21301
+  data.tar.gz: aa3a97e407e6fe6bbacbe4c4b312c13ee7214190daac3459e388513ab0e28ffd
 SHA512:
-  metadata.gz: 17d30edf163397119ab79c3119d43c44be8d8851b0b35a7025ca7002ea77a79c258f0d2ff92bbf01b1085e7b36fa8e131e8b724a12955aa84b6137da1def3aa4
-  data.tar.gz: e967f7206ba91fdd642addeae9f581277300d2ddc30df20d7eecf4588757ef063e14e0139dde49e8d0cdece71f835e0e55954cf2728a407398c35a53aa385d70
+  metadata.gz: 5e45d02f71d0a19ded76e7e77e507a765e843d5f1055b5c77b663d7207d215248b2c46c64e5b435cc2d1ed86a3286d8142469b26eb041fc5624f0cf1722bf7c3
+  data.tar.gz: 6e24bece53a89c2a077024e559d511b7cddf9285cf503d1ce111ae93caaa9555ac5070dd725273ed54bb738926b8285e95fc109178db0f7b012f0b4252215c64

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    react-components-rails (1.0.0.beta3)
+    react-components-rails (1.0.0.beta4)
 
 GEM
   remote: https://rubygems.org/

data/README.md

@@ -9,7 +9,7 @@ React-Components-Rails makes it easy to use [React](https://reactjs.org/) with y
 First, you need to add this gem to your Rails app Gemfile:
 
 ```ruby
-gem 'react-components-rails', "~> 1.0.0.beta.2"
+gem 'react-components-rails', "~> 1.0.0.beta.4"
 ```
 
 Once done, run `bundle` to install the gem.

data/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-components-rails",
-  "version": "1.0.0-beta.3",
+  "version": "1.0.0-beta.4",
   "homepage": "https://github.com/renchap/react-components-rails",
   "repository": "renchap/react-components-rails",
   "author": {
@@ -10,11 +10,12 @@
   "license": "MIT",
   "source": "src/index.ts",
   "exports": {
-    "import": "./dist/index.mjs",
-    "require": "./dist/index.js",
-    "default": "./dist/index.mjs"
+    "import": "./dist/index.js",
+    "require": "./dist/index.cjs",
+    "default": "./dist/index.js"
   },
-  "main": "./dist/index.js",
+  "type": "module",
+  "main": "./dist/index.cjs",
   "types": "dist/index.d.ts",
   "files": [
     "dist/",

data/react-components-rails.gemspec

@@ -6,7 +6,7 @@ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
 Gem::Specification.new do |spec|
   spec.name = "react-components-rails"
   spec.licenses = ["MIT"]
-  spec.version = "1.0.0.beta3"
+  spec.version = "1.0.0.beta4"
   spec.authors = ["Renaud Chaput"]
   spec.email = ["renchap@gmail.com"]
 
@@ -15,7 +15,7 @@ Gem::Specification.new do |spec|
   spec.homepage = "https://github.com/renchap/webpacker-react"
 
   spec.files = `git ls-files -z`.split("\x0").reject do |f|
-    f.match(%r{^(test|spec|features)/})
+    f.match(%r{^(test|spec|features|pnpm-lock.yaml)/})
   end
   spec.bindir = "exe"
   spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }

data/src/index.ts

@@ -1,6 +1,6 @@
 import React from "react"
 import ReactDOM from "react-dom"
-import ReactDOMClient, { Root } from "react-dom/client"
+import type ReactDOMClient from "react-dom/client"
 
 // import ujs from './ujs'
 
@@ -15,11 +15,8 @@ declare global {
 
 class ReactComponentsRails {
   #registeredComponents = {} as { [name: string]: React.ComponentType }
-  #mountedRoots = [] as Root[]
-  #ReactDOMClient = undefined as
-    | typeof ReactDOM
-    | typeof ReactDOMClient
-    | undefined
+  #mountedRoots = [] as ReactDOMClient.Root[]
+  #ReactDOMClient = undefined as typeof ReactDOMClient | undefined | false
 
   static getInstance() {
     if (typeof window.ReactComponentsRails === "undefined") {
@@ -39,13 +36,11 @@ class ReactComponentsRails {
     const reactElement = React.createElement(component, props)
 
     if (this.#ReactDOMClient) {
-      if ("createRoot" in this.#ReactDOMClient) {
-        const root = this.#ReactDOMClient.createRoot(node)
-        root.render(reactElement)
-        this.#mountedRoots.push(root)
-      } else {
-        this.#ReactDOMClient.render(reactElement, node)
-      }
+      const root = this.#ReactDOMClient.createRoot(node)
+      root.render(reactElement)
+      this.#mountedRoots.push(root)
+    } else {
+      ReactDOM.render(reactElement, node)
     }
   }
 
@@ -76,14 +71,12 @@ class ReactComponentsRails {
   // Not used for now, useful for UJS
   // private unmountComponents() {
   //   if (this.#ReactDOMClient) {
-  //     if ("createRoot" in this.#ReactDOMClient) {
-  //       this.#mountedRoots.forEach((root) => root.unmount())
-  //       this.#mountedRoots = []
-  //     } else {
-  //       const mounted = document.querySelectorAll(`[${CLASS_ATTRIBUTE_NAME}]`)
-  //       for (let i = 0; i < mounted.length; i += 1) {
-  //         this.#ReactDOMClient.unmountComponentAtNode(mounted[i])
-  //       }
+  //     this.#mountedRoots.forEach((root) => root.unmount())
+  //     this.#mountedRoots = []
+  //   } else {
+  //     const mounted = document.querySelectorAll(`[${CLASS_ATTRIBUTE_NAME}]`)
+  //     for (let i = 0; i < mounted.length; i += 1) {
+  //       ReactDOM.unmountComponentAtNode(mounted[i])
   //     }
   //   }
   // }
@@ -127,11 +120,14 @@ class ReactComponentsRails {
 
       import("react-dom/client")
         .then((i) => {
-          this.#ReactDOMClient = i
+          // with some bundlers, it can be imported as `.default`, while not with some others
+          this.#ReactDOMClient = i.default || i
           resolve()
         })
         .catch(() => {
-          this.#ReactDOMClient = ReactDOM
+          // if this fails, then we will fallback to the legacy API
+          this.#ReactDOMClient = false
+          resolve()
         })
     })
   }

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: react-components-rails
 version: !ruby/object:Gem::Version
-  version: 1.0.0.beta3
+  version: 1.0.0.beta4
 platform: ruby
 authors:
 - Renaud Chaput