@_linked/react 1.4.2-next.20260713192413 → 1.5.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Changelog
 
+## 1.5.0
+
+### Minor Changes
+
+- [#37](https://github.com/linked-cm/react/pull/37) [`03c1d42`](https://github.com/linked-cm/react/commit/03c1d42112b3ad229f4f4814b3d17987ab1fa78e) Thanks [@flyon](https://github.com/flyon)! - Support React 19 and React Native.
+
+  - The `react` peer range is now `^18.2.0 || ^19.0.0`. On React 19 apps (such as any current Expo SDK), `npm install` no longer fails with `ERESOLVE`, so you can remove the `overrides` workaround.
+  - New `@_linked/react/native` entry point. It exports the same API as `@_linked/react`. Importing it sets `LinkedComponentDefaults.loader` to an `ActivityIndicator` (`testID="linked-loader"`) and `LinkedComponentDefaults.errorElement` to an alert `Text` reading "Failed to load" (`testID="linked-error"`), unless your app has already set them. It also replaces `LinkedInfinityLoader` with an `ActivityIndicator`. The built-in `<svg>` loader and error elements crash on React Native, so React Native apps should import from `@_linked/react/native`. If your app set these defaults itself as a workaround, you can remove that code.
+  - `react-native` (`>=0.76`) is an optional peer dependency. The root entry doesn't import it, so web behaviour is unchanged.
+
 ## 1.4.2
 
 ### Patch Changes

package/README.md

@@ -18,6 +18,26 @@ This package provides:
 npm install @_linked/react @_linked/core react react-dom
 ```
 
+Supports React 18 (`^18.2.0`) and React 19 (`^19.0.0`).
+
+## React Native
+
+Import from the `@_linked/react/native` subpath instead of the root:
+
+```tsx
+import {linkedComponent, linkedSetComponent, linkedShape} from '@_linked/react/native';
+```
+
+It exports the same API as `@_linked/react` (the same objects, not copies). Importing it also sets React Native render defaults, because the built-in loader and error elements are `<svg>` elements, and those crash on React Native:
+
+- `LinkedComponentDefaults.loader`: `<ActivityIndicator testID="linked-loader" />`
+- `LinkedComponentDefaults.errorElement`: `<Text testID="linked-error" accessibilityRole="alert">Failed to load</Text>`
+- `LinkedInfinityLoader` renders the same `ActivityIndicator`
+
+It sets a default only when your app hasn't already set it. Instance props and definition options still take precedence as usual. Use the subpath for at least the first `@_linked/react` import your app evaluates, for example in `App.tsx`.
+
+`react-native` (`>=0.76`) is an optional peer dependency. The root entry never imports it, so web apps don't install it and get no peer warning.
+
 ## Usage
 
 ### Setup package exports

package/lib/esm/native.d.ts

@@ -0,0 +1,26 @@
+/**
+ * React Native entry point: `import {...} from '@_linked/react/native'`.
+ *
+ * Re-exports the full root API and, on import, installs React Native render
+ * defaults. The built-in loader and error elements (and `LinkedInfinityLoader`)
+ * render `<svg>` host elements, which crash on React Native
+ * (`View config getter callback for component 'svg'`).
+ *
+ * The defaults are written to `LinkedComponentDefaults` only where the app has
+ * not already set them, so the normal resolution order still applies:
+ *   instance prop > definition options > LinkedComponentDefaults > built-in
+ *
+ * The root barrel (`@_linked/react`) never imports `react-native`; web
+ * behaviour is unchanged.
+ */
+import React from 'react';
+export * from './index.js';
+/** React Native loading element: an `ActivityIndicator` (`testID="linked-loader"`). */
+export declare function createNativeLoader(): React.ReactElement;
+/** React Native error element: an alert `Text` (`testID="linked-error"`). */
+export declare function createNativeErrorElement(): React.ReactElement;
+/**
+ * React Native stand-in for the web `LinkedInfinityLoader` (an SVG), so code
+ * that opts into it keeps working on native. Shadows the root re-export.
+ */
+export declare function LinkedInfinityLoader(): React.ReactElement;

package/lib/esm/native.js

@@ -0,0 +1,44 @@
+/**
+ * React Native entry point: `import {...} from '@_linked/react/native'`.
+ *
+ * Re-exports the full root API and, on import, installs React Native render
+ * defaults. The built-in loader and error elements (and `LinkedInfinityLoader`)
+ * render `<svg>` host elements, which crash on React Native
+ * (`View config getter callback for component 'svg'`).
+ *
+ * The defaults are written to `LinkedComponentDefaults` only where the app has
+ * not already set them, so the normal resolution order still applies:
+ *   instance prop > definition options > LinkedComponentDefaults > built-in
+ *
+ * The root barrel (`@_linked/react`) never imports `react-native`; web
+ * behaviour is unchanged.
+ */
+import React from 'react';
+import { ActivityIndicator, Text } from 'react-native';
+import { LinkedComponentDefaults } from './utils/LinkedComponent.js';
+export * from './index.js';
+/** React Native loading element: an `ActivityIndicator` (`testID="linked-loader"`). */
+export function createNativeLoader() {
+    return React.createElement(ActivityIndicator, {
+        testID: 'linked-loader',
+        accessibilityLabel: 'Loading',
+    });
+}
+/** React Native error element: an alert `Text` (`testID="linked-error"`). */
+export function createNativeErrorElement() {
+    return React.createElement(Text, { testID: 'linked-error', accessibilityRole: 'alert' }, 'Failed to load');
+}
+/**
+ * React Native stand-in for the web `LinkedInfinityLoader` (an SVG), so code
+ * that opts into it keeps working on native. Shadows the root re-export.
+ */
+export function LinkedInfinityLoader() {
+    return createNativeLoader();
+}
+if (LinkedComponentDefaults.loader === undefined) {
+    LinkedComponentDefaults.loader = createNativeLoader();
+}
+if (LinkedComponentDefaults.errorElement === undefined) {
+    LinkedComponentDefaults.errorElement = createNativeErrorElement();
+}
+//# sourceMappingURL=native.js.map

package/lib/esm/native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"native.js","sourceRoot":"","sources":["../../src/native.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,iBAAiB,EAAE,IAAI,EAAC,MAAM,cAAc,CAAC;AACrD,OAAO,EAAC,uBAAuB,EAAC,MAAM,4BAA4B,CAAC;AAEnE,cAAc,YAAY,CAAC;AAE3B,uFAAuF;AACvF,MAAM,UAAU,kBAAkB;IAChC,OAAO,KAAK,CAAC,aAAa,CAAC,iBAAiB,EAAE;QAC5C,MAAM,EAAE,eAAe;QACvB,kBAAkB,EAAE,SAAS;KAC9B,CAAC,CAAC;AACL,CAAC;AAED,6EAA6E;AAC7E,MAAM,UAAU,wBAAwB;IACtC,OAAO,KAAK,CAAC,aAAa,CACxB,IAAI,EACJ,EAAC,MAAM,EAAE,cAAc,EAAE,iBAAiB,EAAE,OAAO,EAAC,EACpD,gBAAgB,CACjB,CAAC;AACJ,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,oBAAoB;IAClC,OAAO,kBAAkB,EAAE,CAAC;AAC9B,CAAC;AAED,IAAI,uBAAuB,CAAC,MAAM,KAAK,SAAS,EAAE,CAAC;IACjD,uBAAuB,CAAC,MAAM,GAAG,kBAAkB,EAAE,CAAC;AACxD,CAAC;AACD,IAAI,uBAAuB,CAAC,YAAY,KAAK,SAAS,EAAE,CAAC;IACvD,uBAAuB,CAAC,YAAY,GAAG,wBAAwB,EAAE,CAAC;AACpE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@_linked/react",
-  "version": "1.4.2-next.20260713192413",
+  "version": "1.5.0",
   "license": "MIT",
   "linkedPackage": true,
   "type": "module",
@@ -10,7 +10,7 @@
   ],
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/Semantu/linked-react.git"
+    "url": "git+https://github.com/linked-cm/react.git"
   },
   "main": "lib/esm/index.js",
   "module": "lib/esm/index.js",
@@ -49,7 +49,13 @@
   },
   "peerDependencies": {
     "@_linked/core": "^2.10",
-    "react": "^18.2.0"
+    "react": "^18.2.0 || ^19.0.0",
+    "react-native": ">=0.76"
+  },
+  "peerDependenciesMeta": {
+    "react-native": {
+      "optional": true
+    }
   },
   "dependencies": {
     "react-usestateref": "^1.0.8"
@@ -60,15 +66,17 @@
     "@changesets/changelog-github": "^0.5.2",
     "@changesets/cli": "^2.29.8",
     "@jest/globals": "^29.7.0",
-    "@testing-library/react": "^14.2.1",
+    "@testing-library/dom": "^10.4.2",
+    "@testing-library/react": "^16.3.3",
     "@types/jest": "^29.5.12",
     "@types/node": "^20.12.7",
-    "@types/react": "^18.2.61",
-    "@types/react-dom": "^18.2.19",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
+    "react-native": "0.86.3",
     "rimraf": "^5.0.7",
     "ts-jest": "^29.1.2",
     "typescript": "^5.7.3"