feat: iOS implementation of NativeRenderer (#1)

* feat: scaffold module API

* feat: add elem runtime

* docs: update readme

* build: init submodules

* build: disable cocoapods cache

* fix: rename math.h in elementary submodule

* chore: set node version

* fix: exclude third party files from commit checks

* chore: release 0.2.0

* build: slim down vendor files in package

* chore: release 0.2.1

* fix: restore deleted math.h in elementary submodule

* chore: release 0.2.2

.github/workflows/ci.yml

@@ -108,6 +108,8 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v3
+        with:
+          submodules: recursive
 
       - name: Setup
         uses: ./.github/actions/setup
@@ -140,7 +142,7 @@ jobs:
             ${{ runner.os }}-cocoapods-
 
       - name: Install cocoapods
-        if: env.turbo_cache_hit != 1 && steps.cocoapods-cache.outputs.cache-hit != 'true'
+#        if: env.turbo_cache_hit != 1 && steps.cocoapods-cache.outputs.cache-hit != 'true'
         run: |
           yarn example pods
         env:

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "ios/vendor/elementary"]
+	path = ios/vendor/elementary
+	url = https://github.com/elemaudio/elementary.git

.tool-versions

@@ -1 +1,2 @@
 ruby 3.0.2
+nodejs 20.5.0

README.md

@@ -1,6 +1,10 @@
 # react-native-elementary
 
-Use Elementary Audio in your React Native app
+> Use [Elementary Audio][elem] in your React Native app
+
+This is alpha quality software. **iOS only for now**, PRs welcome for Android support.
+
+[elem]: https://elementary.audio
 
 ## Installation
 
@@ -10,12 +14,26 @@ npm install react-native-elementary
 
 ## Usage
 
-```js
-import { multiply } from 'react-native-elementary';
-
-// ...
-
-const result = await multiply(3, 7);
+```jsx
+import { el } from '@elemaudio/core';
+import { useRenderer } from 'react-native-elementary';
+
+const MyComponent = () => {
+  const { core } = useRenderer();
+
+  if (!core) {
+    return <Text>Initialising audio...</Text>;
+  }
+
+  return (
+    <View>
+      <Button
+        title="Play"
+        onPress={() => core.render(el.cycle(440), el.cycle(441))}
+      />
+    </View>
+  );
+};
 ```
 
 ## Contributing

example/Gemfile.lock

@@ -0,0 +1,98 @@
+GEM
+  remote: https://rubygems.org/
+  specs:
+    CFPropertyList (3.0.6)
+      rexml
+    activesupport (7.0.6)
+      concurrent-ruby (~> 1.0, >= 1.0.2)
+      i18n (>= 1.6, < 2)
+      minitest (>= 5.1)
+      tzinfo (~> 2.0)
+    addressable (2.8.5)
+      public_suffix (>= 2.0.2, < 6.0)
+    algoliasearch (1.27.5)
+      httpclient (~> 2.8, >= 2.8.3)
+      json (>= 1.5.1)
+    atomos (0.1.3)
+    claide (1.1.0)
+    cocoapods (1.12.1)
+      addressable (~> 2.8)
+      claide (>= 1.0.2, < 2.0)
+      cocoapods-core (= 1.12.1)
+      cocoapods-deintegrate (>= 1.0.3, < 2.0)
+      cocoapods-downloader (>= 1.6.0, < 2.0)
+      cocoapods-plugins (>= 1.0.0, < 2.0)
+      cocoapods-search (>= 1.0.0, < 2.0)
+      cocoapods-trunk (>= 1.6.0, < 2.0)
+      cocoapods-try (>= 1.1.0, < 2.0)
+      colored2 (~> 3.1)
+      escape (~> 0.0.4)
+      fourflusher (>= 2.3.0, < 3.0)
+      gh_inspector (~> 1.0)
+      molinillo (~> 0.8.0)
+      nap (~> 1.0)
+      ruby-macho (>= 2.3.0, < 3.0)
+      xcodeproj (>= 1.21.0, < 2.0)
+    cocoapods-core (1.12.1)
+      activesupport (>= 5.0, < 8)
+      addressable (~> 2.8)
+      algoliasearch (~> 1.0)
+      concurrent-ruby (~> 1.1)
+      fuzzy_match (~> 2.0.4)
+      nap (~> 1.0)
+      netrc (~> 0.11)
+      public_suffix (~> 4.0)
+      typhoeus (~> 1.0)
+    cocoapods-deintegrate (1.0.5)
+    cocoapods-downloader (1.6.3)
+    cocoapods-plugins (1.0.0)
+      nap
+    cocoapods-search (1.0.1)
+    cocoapods-trunk (1.6.0)
+      nap (>= 0.8, < 2.0)
+      netrc (~> 0.11)
+    cocoapods-try (1.2.0)
+    colored2 (3.1.2)
+    concurrent-ruby (1.2.2)
+    escape (0.0.4)
+    ethon (0.16.0)
+      ffi (>= 1.15.0)
+    ffi (1.15.5)
+    fourflusher (2.3.1)
+    fuzzy_match (2.0.4)
+    gh_inspector (1.1.3)
+    httpclient (2.8.3)
+    i18n (1.14.1)
+      concurrent-ruby (~> 1.0)
+    json (2.6.3)
+    minitest (5.19.0)
+    molinillo (0.8.0)
+    nanaimo (0.3.0)
+    nap (1.1.0)
+    netrc (0.11.0)
+    public_suffix (4.0.7)
+    rexml (3.2.6)
+    ruby-macho (2.5.1)
+    typhoeus (1.4.0)
+      ethon (>= 0.9.0)
+    tzinfo (2.0.6)
+      concurrent-ruby (~> 1.0)
+    xcodeproj (1.22.0)
+      CFPropertyList (>= 2.3.3, < 4.0)
+      atomos (~> 0.1.3)
+      claide (>= 1.0.2, < 2.0)
+      colored2 (~> 3.1)
+      nanaimo (~> 0.3.0)
+      rexml (~> 3.2.4)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  cocoapods (~> 1.12)
+
+RUBY VERSION
+   ruby 3.0.2p107
+
+BUNDLED WITH
+   2.2.22

example/ios/.xcode.env

@@ -8,4 +8,5 @@
 # Customize the NODE_BINARY variable here.
 # For example, to use nvm with brew, add the following line
 # . "$(brew --prefix nvm)/nvm.sh" --no-use
+. "$(brew --prefix asdf)/libexec/asdf.sh"
 export NODE_BINARY=$(command -v node)

example/ios/ElementaryExample.xcodeproj/project.pbxproj

@@ -488,6 +488,7 @@
 				CURRENT_PROJECT_VERSION = 1;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = ElementaryExample/Info.plist;
+				IPHONEOS_DEPLOYMENT_TARGET = 13.0;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",
@@ -514,6 +515,7 @@
 				CLANG_ENABLE_MODULES = YES;
 				CURRENT_PROJECT_VERSION = 1;
 				INFOPLIST_FILE = ElementaryExample/Info.plist;
+				IPHONEOS_DEPLOYMENT_TARGET = 13.0;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",

example/ios/ElementaryExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>

example/metro.config.js

@@ -20,10 +20,15 @@ const config = {
   // So we block them at the root, and alias them to the versions in example's node_modules
   resolver: {
     blacklistRE: exclusionList(
-      modules.map(
-        (m) =>
-          new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`)
-      )
+      modules
+        .map(
+          (m) =>
+            new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`)
+        )
+        .concat(
+          // TODO why do I have to exclude this?
+          new RegExp(`^${escape(path.join(root, 'ios/vendor/elementary/'))}.*$`)
+        )
     ),
 
     extraNodeModules: modules.reduce((acc, name) => {

example/package.json

@@ -9,6 +9,7 @@
     "pods": "pod-install --quiet"
   },
   "dependencies": {
+    "@elemaudio/core": "^2.0.1",
     "react": "18.2.0",
     "react-native": "0.72.3"
   },
@@ -24,4 +25,4 @@
   "engines": {
     "node": ">=16"
   }
-}
+}

example/src/App.tsx

@@ -1,18 +1,28 @@
 import * as React from 'react';
 
-import { StyleSheet, View, Text } from 'react-native';
-import { multiply } from 'react-native-elementary';
+import { StyleSheet, View, Text, Button } from 'react-native';
+import { useRenderer } from 'react-native-elementary';
+import { el } from '@elemaudio/core';
 
 export default function App() {
-  const [result, setResult] = React.useState<number | undefined>();
+  const { core } = useRenderer();
 
-  React.useEffect(() => {
-    multiply(3, 7).then(setResult);
-  }, []);
+  if (!core) {
+    return (
+      <View style={styles.container}>
+        <Text>Initialising audio...</Text>
+      </View>
+    );
+  }
 
   return (
     <View style={styles.container}>
-      <Text>Result: {result}</Text>
+      <Text>Audio engine initialised</Text>
+      <Button
+        title="Play test tone"
+        onPress={() => core.render(el.cycle(440), el.cycle(440))}
+      />
+      <Button title="Stop" onPress={() => core.render()} />
     </View>
   );
 }
@@ -23,9 +33,4 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center',
   },
-  box: {
-    width: 60,
-    height: 60,
-    marginVertical: 20,
-  },
 });

example/yarn.lock

@@ -1143,6 +1143,14 @@
     "@babel/helper-validator-identifier" "^7.22.5"
     to-fast-properties "^2.0.0"
 
+"@elemaudio/core@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@elemaudio/core/-/core-2.0.1.tgz#a8bf282719acca5091ca1c66ce137caa629dc14d"
+  integrity sha512-3CIEnSpzFArUMXzlJWuFfapbAWUyCXU2KyYnTQVX8BBgMLYuPrQszRBJX2m325MDiseqzlGYCMJIkQXWhEkMIA==
+  dependencies:
+    invariant "^2.2.4"
+    shallowequal "^1.1.0"
+
 "@eslint-community/eslint-utils@^4.2.0":
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59"
@@ -4653,6 +4661,11 @@ shallow-clone@^3.0.0:
   dependencies:
     kind-of "^6.0.2"
 
+shallowequal@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
+  integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
+
 shebang-command@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-2.0.0.tgz#ccd0af4f8835fbdc265b82461aaf0c36663f34ea"

ios/Elementary.h

@@ -2,11 +2,20 @@
 #ifdef RCT_NEW_ARCH_ENABLED
 #import "RNElementarySpec.h"
 
-@interface Elementary : NSObject <NativeElementarySpec>
+@interface Elementary : RCTEventEmitter <NativeElementarySpec>
+
 #else
+
 #import <React/RCTBridgeModule.h>
+#import <AVFoundation/AVFoundation.h>
+#import <React/RCTEventEmitter.h>
 
-@interface Elementary : NSObject <RCTBridgeModule>
+#import "vendor/elementary/runtime/Runtime.h"
+
+@interface Elementary : RCTEventEmitter <RCTBridgeModule>
 #endif
 
+@property (nonatomic, strong) AVAudioEngine *audioEngine;
+@property (nonatomic, assign) std::shared_ptr<elem::Runtime<float>> runtime;
+
 @end