babel-preset-expo 12.0.4 → 12.1.0-canary-20241211-61c49bd

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.
Files changed (2) hide show
  1. package/build/use-dom-directive-plugin.js +30 -23
  2. package/package.json +4 -5
package/build/use-dom-directive-plugin.js CHANGED
@@ -14,7 +14,6 @@ const url_1 = __importDefault(require("url"));
14
14
  const common_1 = require("./common");
15
15
  function expoUseDomDirectivePlugin(api) {
16
16
  const { types: t } = api;
17
- // TODO: Is exporting
18
17
  const isProduction = api.caller(common_1.getIsProd);
19
18
  const platform = api.caller((caller) => caller?.platform);
20
19
  const projectRoot = api.caller(common_1.getPossibleProjectRoot);
@@ -37,6 +36,7 @@ function expoUseDomDirectivePlugin(api) {
37
36
  // Do nothing for code that isn't marked as a dom component.
38
37
  return;
39
38
  }
39
+ let displayName = 'Component';
40
40
  // Assert that a default export must exist and that no other exports should be present.
41
41
  // NOTE: In the future we could support other exports with extraction.
42
42
  let hasDefaultExport = false;
@@ -53,8 +53,11 @@ function expoUseDomDirectivePlugin(api) {
53
53
  }
54
54
  throw path.buildCodeFrameError('Modules with the "use dom" directive only support a single default export.');
55
55
  },
56
- ExportDefaultDeclaration() {
56
+ ExportDefaultDeclaration(path) {
57
57
  hasDefaultExport = true;
58
+ if (t.isFunctionDeclaration(path.node.declaration) && path.node.declaration.id) {
59
+ displayName = path.node.declaration.id.name;
60
+ }
58
61
  },
59
62
  });
60
63
  if (!hasDefaultExport) {
@@ -78,38 +81,42 @@ function expoUseDomDirectivePlugin(api) {
78
81
  }
79
82
  }
80
83
  const outputKey = url_1.default.pathToFileURL(filePath).href;
81
- const proxyModule = [
82
- `import React from 'react';`,
83
- `import { WebView } from 'expo/dom/internal';`,
84
- ];
85
- if (isProduction) {
86
- // MUST MATCH THE EXPORT COMMAND!
87
- const hash = crypto_1.default.createHash('sha1').update(outputKey).digest('hex');
88
- proxyModule.push(`const filePath = "${hash}.html";`);
89
- }
90
- else {
91
- proxyModule.push(
92
- // Add the basename to improve the Safari debug preview option.
93
- `const filePath = "${fileBasename}?file=" + ${JSON.stringify(outputKey)};`);
94
- }
95
- proxyModule.push(`
96
- export default React.forwardRef((props, ref) => {
97
- return React.createElement(WebView, { ref, ...props, filePath });
98
- });`);
99
84
  // Removes all imports using babel API, that will disconnect import bindings from the program.
100
85
  // plugin-transform-typescript TSX uses the bindings to remove type imports.
101
86
  // If the DOM component has `import React from 'react';`,
102
87
  // the plugin-transform-typescript treats it as an typed import and removes it.
103
- // That will futher cause undefined `React` error.
88
+ // That will further cause undefined `React` error.
104
89
  path.traverse({
105
90
  ImportDeclaration(path) {
106
91
  path.remove();
107
92
  },
108
93
  });
109
- // Clear the body
110
94
  path.node.body = [];
111
95
  path.node.directives = [];
112
- path.pushContainer('body', core_1.template.ast(proxyModule.join('\n')));
96
+ // Create template with declaration first
97
+ const proxyModuleTemplate = `
98
+ import React from 'react';
99
+ import { WebView } from 'expo/dom/internal';
100
+ ${isProduction
101
+ ? `const filePath = "${crypto_1.default.createHash('sha1').update(outputKey).digest('hex')}.html";`
102
+ : `const filePath = "${fileBasename}?file=" + ${JSON.stringify(outputKey)};`}
103
+ const _Expo_DOMProxyComponent = React.forwardRef((props, ref) => {
104
+ return React.createElement(WebView, { ref, ...props, filePath });
105
+ });
106
+ if (__DEV__) _Expo_DOMProxyComponent.displayName = ${JSON.stringify(`DOM(${displayName})`)};
107
+ export default _Expo_DOMProxyComponent;
108
+ `;
109
+ // Convert template to AST and push to body
110
+ const ast = core_1.template.ast(proxyModuleTemplate);
111
+ const results = path.pushContainer('body', ast);
112
+ // Find and register the component declaration
113
+ results.forEach((nodePath) => {
114
+ if (t.isVariableDeclaration(nodePath.node) &&
115
+ 'name' in nodePath.node.declarations[0]?.id &&
116
+ nodePath.node.declarations[0].id.name === '_Expo_DOMProxyComponent') {
117
+ path.scope.registerDeclaration(nodePath);
118
+ }
119
+ });
113
120
  assertExpoMetadata(state.file.metadata);
114
121
  // Save the client reference in the metadata.
115
122
  state.file.metadata.expoDomComponentReference = outputKey;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "babel-preset-expo",
3
- "version": "12.0.4",
3
+ "version": "12.1.0-canary-20241211-61c49bd",
4
4
  "description": "The Babel preset for Expo projects",
5
5
  "main": "build/index.js",
6
6
  "files": [
@@ -47,7 +47,7 @@
47
47
  "@babel/plugin-transform-parameters": "^7.22.15",
48
48
  "@babel/preset-react": "^7.22.15",
49
49
  "@babel/preset-typescript": "^7.23.0",
50
- "@react-native/babel-preset": "0.76.5",
50
+ "@react-native/babel-preset": "0.76.3",
51
51
  "babel-plugin-react-native-web": "~0.19.13",
52
52
  "react-refresh": "^0.14.2"
53
53
  },
@@ -66,9 +66,8 @@
66
66
  "devDependencies": {
67
67
  "@babel/core": "^7.20.0",
68
68
  "babel-plugin-react-compiler": "^19.0.0-beta-9ee70a1-20241017",
69
- "expo-module-scripts": "^4.0.0",
69
+ "expo-module-scripts": "4.0.3-canary-20241211-61c49bd",
70
70
  "jest": "^29.2.1",
71
71
  "react-compiler-runtime": "^19.0.0-beta-8a03594-20241020"
72
- },
73
- "gitHead": "1faceb8d22bebee4571ef3a2f9578bec33dc26b1"
72
+ }
74
73
  }