aix 0.0.14 → 0.1.0-alpha.1

package/Aix.podspec

@@ -0,0 +1,32 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+
+Pod::Spec.new do |s|
+  s.name         = "Aix"
+  s.version      = package["version"]
+  s.summary      = package["description"]
+  s.homepage     = package["homepage"]
+  s.license      = package["license"]
+  s.authors      = package["author"]
+
+  s.platforms    = { :ios => min_ios_version_supported, :visionos => 1.0 }
+  s.source       = { :git => "https://github.com/vercel/aix.git", :tag => "#{s.version}" }
+
+  s.source_files = [
+    # Implementation (Swift)
+    "ios/**/*.{swift}",
+    # Autolinking/Registration (Objective-C++)
+    "ios/**/*.{m,mm}",
+    # Implementation (C++ objects)
+    "cpp/**/*.{hpp,cpp}",
+  ]
+
+  load 'nitrogen/generated/ios/Aix+autolinking.rb'
+  add_nitrogen_files(s)
+
+  s.dependency 'React-jsi'
+  s.dependency 'React-callinvoker'
+  s.dependency 'react-native-keyboard-controller'
+  install_modules_dependencies(s)
+end

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2018 Jamie McCrindle
+Copyright (c) 2025 Fernando Rojo
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

package/README.md

@@ -1,57 +1,189 @@
-# Async Iterator Extensions
+# aix
 
-A library of async iterator extensions for JavaScript
+Primitives for building beautiful AI chat apps with React Native.
 
-# Installation
+> aix is currently in alpha preview. The API will change, and it is not yet feature complete.
 
-    npm install aix # or yarn install aix
+We're rewriting the engine that powers the chat experience in the v0 mobile app with a focus on native feel.
 
-# Why Aix?
+aix is a native module with UIKit with Nitro Modules.
 
-Async iterators are a useful way to handle asynchronous streams. This library adds a number
-of utility methods similar to those found in lodash, underscore or Ramda.
+## Installation
 
-# Examples
+```bash
+npm i aix react-native-nitro-modules
+```
+
+Next, rebuild your native app. For Expo users, run `npx expo prebuild` and rebuild.
+
+## Usage
+
+Wrap your `ScrollView` with `Aix`, and wrap your messages with `AixCell`.
+
+<details>
+  <summary>Click here to view a full example</summary>
+</details>
+
+```tsx
+import { Aix, AixCell } from 'aix';
+import { Message } from 'path/to/your/message';
+import { Composer } from 'path/to/your/composer';
+
+export function ChatScreen({ messages }) {
+  return (
+    <Aix style={{ flex: 1 }}>
+      <ScrollView>
+        {messages.map((message) => (
+          <AixCell
+            key={message.id}
+            index={index}
+            isLast={index === messages.length - 1}
+          >
+            <Message message={message} />
+          </AixCell>
+        ))}
+      </ScrollView>
+    </Aix>
+  );
+}
+```
 
-## fromEvents
+To add a floating composer which lets content scroll under it, you can use the `AixFooter` and `KeyboardStickyView` from `react-native-keyboard-controller`:
+
+```tsx
+import { Aix, AixCell, AixFooter } from 'aix';
+import { KeyboardStickyView } from 'react-native-keyboard-controller';
+
+export function ChatScreen({ messages }) {
+  return (
+    <Aix style={{ flex: 1 }}>
+      <ScrollView>
+        {messages.map((message) => (
+          <AixCell
+            key={message.id}
+            index={index}
+            isLast={index === messages.length - 1}
+          >
+            <Message message={message} />
+          </AixCell>
+        ))}
+      </ScrollView>
+
+      <KeyboardStickyView offset={{ opened: 0, closed: -bottomInsetPadding }}>
+        <AixFooter style={{ position: 'absolute', inset: 0, top: 'auto'}}>
+          <Composer />
+        </AixFooter>
+      </KeyboardStickyView>
+    </Aix>
+  );
+}
+```
 
-```fromEvents``` turns DOM events into an iterable.
+## TODOs
 
-```javascript
-import { fromEvents } from "aix/fromEvents";
+- [ ] Android support
+- [ ] LegendList support
+- [ ] FlashList support
 
-const clicks = fromEvents(document, 'click');
+## API Reference
 
-for await (const click of clicks) {
-    console.log('a button was clicked');
-}
+### `Aix`
+
+The main container component that provides keyboard-aware behavior and manages scrolling for chat interfaces.
+
+#### Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `shouldStartAtEnd` | `boolean` | - | Whether the scroll view should start scrolled to the end of the content. |
+| `scrollOnFooterSizeUpdate` | `object` | `{ enabled: true, scrolledToEndThreshold: 100, animated: false }` | Control the behavior of scrolling when the footer size changes. By default, changing the height of the footer will shift content up in the scroll view. |
+| `scrollEndReachedThreshold` | `number` | `max(blankSize, 200)` | The number of pixels from the bottom of the scroll view to the end of the content that is considered "near the end". Used to determine if content should shift up when keyboard opens. |
+| `additionalContentInsets` | `object` | - | Additional content insets applied when keyboard is open or closed. Shape: `{ top?: { whenKeyboardOpen, whenKeyboardClosed }, bottom?: { whenKeyboardOpen, whenKeyboardClosed } }` |
+| `additionalScrollIndicatorInsets` | `object` | - | Additional insets for the scroll indicator, added to existing safe area insets. Applied to `verticalScrollIndicatorInsets` on iOS. |
+| `mainScrollViewID` | `string` | - | The `nativeID` of the scroll view to use. If provided, will search for a scroll view with this `accessibilityIdentifier`. |
+| `penultimateCellIndex` | `number` | - | The index of the second-to-last message (typically the last user message in AI chat apps). Used to determine which message will be scrolled into view. Useful when you have custom message types like timestamps in your list. |
+
+#### Ref Methods
+
+Access these methods via `useAixRef()`:
+
+```tsx
+const aix = useAixRef();
+
+// Scroll to the end of the content
+aix.current?.scrollToEnd(animated);
+
+// Scroll to a specific index when the blank size is ready
+aix.current?.scrollToIndexWhenBlankSizeReady(index, animated, waitForKeyboardToEnd);
 ```
 
-## DeferredIterable
+| Method | Parameters | Description |
+|--------|------------|-------------|
+| `scrollToEnd` | `animated?: boolean` | Scrolls to the end of the content. |
+| `scrollToIndexWhenBlankSizeReady` | `index: number, animated?: boolean, waitForKeyboardToEnd?: boolean` | Scrolls to a specific cell index once the blank size calculation is ready. |
 
-```DeferredIterable``` makes it easy to turn stream of events into an iterable. The code below
-is essentially how ```fromEvents``` was implemented.
+---
 
-```javascript
-import { DeferredIterable } from "aix/deferredIterable";
+### `AixCell`
 
-const deferredIterable = new DeferredIterable();
+A wrapper component for each message in the list. It communicates cell position and dimensions to the parent `Aix` component.
 
-// set up a callback that calls value on the deferredIterable
-const callback = value => deferredIterable.value(value);
+#### Props
 
-// attach the callback to the click event
-document.addEventListener('click', callback);
+| Prop | Type | Required | Description |
+|------|------|----------|-------------|
+| `index` | `number` | Yes | The index of this cell in the message list. |
+| `isLast` | `boolean` | Yes | Whether this cell is the last item in the list. Used for scroll positioning and animations. |
 
-// remove the callback when / if the iterable stops
-deferredIterable.finally(() => document.removeEventListener('click', deferredIterable.value));
+---
 
-// go through all the click events
-for await (const click of deferredIterable.iterable) {
-    console.log('a button was clicked');
+### `AixFooter`
+
+A footer component for floating composers that allows content to scroll underneath it. The footer's height is automatically tracked for proper scroll offset calculations.
+
+#### Props
+
+Accepts all standard React Native `View` props.
+
+#### Important Notes
+
+- **Do not apply vertical padding** (`padding`, `paddingBottom`) directly to `AixFooter`. Apply padding to a child view instead.
+- Position the footer absolutely at the bottom of the `Aix` container:
+
+```tsx
+<AixFooter style={{ position: 'absolute', inset: 0, top: 'auto' }}>
+  <Composer />
+</AixFooter>
+```
+
+---
+
+### `useAixRef`
+
+A hook that returns a ref to access imperative methods on the `Aix` component.
+
+```tsx
+import { useAixRef } from 'aix';
+
+function Chat({ messages }) {
+  const aix = useAixRef();
+  const send = useSendMessage()
+  
+  const handleSend = () => {
+    // Scroll to end after sending a message
+    send(message);
+    aix.current?.scrollToIndexWhenBlankSizeReady(messages.length + 1, true);
+    requestAnimationFrame(Keyboard.dismiss);
+  };
+  
+  return <Aix ref={aix}>{/* ... */}</Aix>;
 }
 ```
 
-# Reference Documentation
+## TODOs
+
+
+## Requirements
 
-* [API Reference](./docs/API.md)
+- React Native v0.78.0 or higher
+- Node 18.0.0 or higher

package/android/CMakeLists.txt

@@ -0,0 +1,32 @@
+project(Aix)
+cmake_minimum_required(VERSION 3.9.0)
+
+set (PACKAGE_NAME Aix)
+set (CMAKE_VERBOSE_MAKEFILE ON)
+set (CMAKE_CXX_STANDARD 20)
+
+# Enable Raw Props parsing in react-native (for Nitro Views)
+add_compile_options(-DRN_SERIALIZABLE_STATE=1)
+
+# Define C++ library and add all sources
+add_library(${PACKAGE_NAME} SHARED
+        src/main/cpp/cpp-adapter.cpp
+)
+
+# Add Nitrogen specs :)
+include(${CMAKE_SOURCE_DIR}/../nitrogen/generated/android/Aix+autolinking.cmake)
+
+# Set up local includes
+include_directories(
+        "src/main/cpp"
+        "../cpp"
+)
+
+find_library(LOG_LIB log)
+
+# Link all libraries together
+target_link_libraries(
+        ${PACKAGE_NAME}
+        ${LOG_LIB}
+        android                                   # <-- Android core
+)

package/android/build.gradle

@@ -0,0 +1,148 @@
+buildscript {
+  repositories {
+    google()
+    mavenCentral()
+  }
+
+  dependencies {
+    classpath "com.android.tools.build:gradle:8.8.0"
+  }
+}
+
+def reactNativeArchitectures() {
+  def value = rootProject.getProperties().get("reactNativeArchitectures")
+  return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"]
+}
+
+def isNewArchitectureEnabled() {
+  return rootProject.hasProperty("newArchEnabled") && rootProject.getProperty("newArchEnabled") == "true"
+}
+
+apply plugin: "com.android.library"
+apply plugin: 'org.jetbrains.kotlin.android'
+apply from: '../nitrogen/generated/android/Aix+autolinking.gradle'
+apply from: "./fix-prefab.gradle"
+
+if (isNewArchitectureEnabled()) {
+  apply plugin: "com.facebook.react"
+}
+
+def getExtOrDefault(name) {
+  return rootProject.ext.has(name) ? rootProject.ext.get(name) : project.properties["Aix_" + name]
+}
+
+def getExtOrIntegerDefault(name) {
+  return rootProject.ext.has(name) ? rootProject.ext.get(name) : (project.properties["Aix_" + name]).toInteger()
+}
+
+android {
+  namespace "com.aix"
+
+  ndkVersion getExtOrDefault("ndkVersion")
+  compileSdkVersion getExtOrIntegerDefault("compileSdkVersion")
+
+  defaultConfig {
+    minSdkVersion getExtOrIntegerDefault("minSdkVersion")
+    targetSdkVersion getExtOrIntegerDefault("targetSdkVersion")
+    buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
+
+    externalNativeBuild {
+      cmake {
+        cppFlags "-frtti -fexceptions -Wall -Wextra -fstack-protector-all"
+        arguments "-DANDROID_STL=c++_shared", "-DANDROID_SUPPORT_FLEXIBLE_PAGE_SIZES=ON"
+        abiFilters (*reactNativeArchitectures())
+
+        buildTypes {
+          debug {
+            cppFlags "-O1 -g"
+          }
+          release {
+            cppFlags "-O2"
+          }
+        }
+      }
+    }
+  }
+
+  externalNativeBuild {
+    cmake {
+      path "CMakeLists.txt"
+    }
+  }
+
+  packagingOptions {
+    excludes = [
+        "META-INF",
+        "META-INF/**",
+        "**/libc++_shared.so",
+        "**/libfbjni.so",
+        "**/libjsi.so",
+        "**/libfolly_json.so",
+        "**/libfolly_runtime.so",
+        "**/libglog.so",
+        "**/libhermes.so",
+        "**/libhermes-executor-debug.so",
+        "**/libhermes_executor.so",
+        "**/libreactnative.so",
+        "**/libreactnativejni.so",
+        "**/libturbomodulejsijni.so",
+        "**/libreact_nativemodule_core.so",
+        "**/libjscexecutor.so"
+    ]
+  }
+
+  buildFeatures {
+    buildConfig true
+    prefab true
+  }
+
+  buildTypes {
+    release {
+      minifyEnabled false
+    }
+  }
+
+  lintOptions {
+    disable "GradleCompatible"
+  }
+
+  compileOptions {
+    sourceCompatibility JavaVersion.VERSION_1_8
+    targetCompatibility JavaVersion.VERSION_1_8
+  }
+
+  sourceSets {
+    main {
+      if (isNewArchitectureEnabled()) {
+        java.srcDirs += [
+          // React Codegen files
+          "${project.buildDir}/generated/source/codegen/java"
+        ]
+      }
+    }
+  }
+}
+
+repositories {
+  mavenCentral()
+  google()
+}
+
+
+dependencies {
+  // For < 0.71, this will be from the local maven repo
+  // For > 0.71, this will be replaced by `com.facebook.react:react-android:$version` by react gradle plugin
+  //noinspection GradleDynamicVersion
+  implementation "com.facebook.react:react-native:+"
+
+  // Add a dependency on NitroModules
+  implementation project(":react-native-nitro-modules")
+}
+
+if (isNewArchitectureEnabled()) {
+  react {
+    jsRootDir = file("../src/")
+    libraryName = "Aix"
+    codegenJavaPackageName = "com.aix"
+  }
+}

package/android/fix-prefab.gradle

@@ -0,0 +1,51 @@
+tasks.configureEach { task ->
+  // Make sure that we generate our prefab publication file only after having built the native library
+  // so that not a header publication file, but a full configuration publication will be generated, which
+  // will include the .so file
+
+  def prefabConfigurePattern = ~/^prefab(.+)ConfigurePackage$/
+  def matcher = task.name =~ prefabConfigurePattern
+  if (matcher.matches()) {
+    def variantName = matcher[0][1]
+    task.outputs.upToDateWhen { false }
+    task.dependsOn("externalNativeBuild${variantName}")
+  }
+}
+
+afterEvaluate {
+  def abis = reactNativeArchitectures()
+  rootProject.allprojects.each { proj ->
+    if (proj === rootProject) return
+
+    def dependsOnThisLib = proj.configurations.findAll { it.canBeResolved }.any { config ->
+      config.dependencies.any { dep ->
+        dep.group == project.group && dep.name == project.name
+      }
+    }
+    if (!dependsOnThisLib && proj != project) return
+
+    if (!proj.plugins.hasPlugin('com.android.application') && !proj.plugins.hasPlugin('com.android.library')) {
+      return
+    }
+
+    def variants = proj.android.hasProperty('applicationVariants') ? proj.android.applicationVariants : proj.android.libraryVariants
+    // Touch the prefab_config.json files to ensure that in ExternalNativeJsonGenerator.kt we will re-trigger the prefab CLI to
+    // generate a libnameConfig.cmake file that will contain our native library (.so).
+    // See this condition: https://cs.android.com/android-studio/platform/tools/base/+/mirror-goog-studio-main:build-system/gradle-core/src/main/java/com/android/build/gradle/tasks/ExternalNativeJsonGenerator.kt;l=207-219?q=createPrefabBuildSystemGlue
+    variants.all { variant ->
+      def variantName = variant.name
+      abis.each { abi ->
+        def searchDir = new File(proj.projectDir, ".cxx/${variantName}")
+        if (!searchDir.exists()) return
+        def matches = []
+        searchDir.eachDir { randomDir ->
+          def prefabFile = new File(randomDir, "${abi}/prefab_config.json")
+          if (prefabFile.exists()) matches << prefabFile
+        }
+        matches.each { prefabConfig ->
+          prefabConfig.setLastModified(System.currentTimeMillis())
+        }
+      }
+    }
+  }
+}

package/android/gradle.properties

@@ -0,0 +1,5 @@
+Aix_kotlinVersion=2.1.20
+Aix_minSdkVersion=23
+Aix_targetSdkVersion=35
+Aix_compileSdkVersion=34
+Aix_ndkVersion=27.1.12297006

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,2 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+</manifest>

package/android/src/main/cpp/cpp-adapter.cpp

@@ -0,0 +1,6 @@
+#include <jni.h>
+#include "AixOnLoad.hpp"
+
+JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM* vm, void*) {
+  return margelo::nitro::aix::initialize(vm);
+}

package/android/src/main/java/com/aix/AixPackage.kt

@@ -0,0 +1,29 @@
+package com.aix;
+
+import com.facebook.react.bridge.NativeModule;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.module.model.ReactModuleInfoProvider;
+import com.facebook.react.TurboReactPackage;
+import com.facebook.react.uimanager.ViewManager;
+import com.margelo.nitro.aix.*;
+import com.margelo.nitro.aix.views.*;
+
+
+public class AixPackage : TurboReactPackage() {
+  override fun getModule(name: String, reactContext: ReactApplicationContext): NativeModule? = null
+
+  override fun getReactModuleInfoProvider(): ReactModuleInfoProvider = ReactModuleInfoProvider { emptyMap() }
+  
+  override fun createViewManagers(reactContext: ReactApplicationContext): List<ViewManager<*, *>> {
+    val viewManagers = ArrayList<ViewManager<*, *>>()
+    viewManagers.add(HybridAixManager())
+    return viewManagers
+  }
+
+  companion object {
+    init {
+      AixOnLoad.initializeNative()
+    }
+  }
+}
+

package/android/src/main/java/com/aix/HybridAix.kt

@@ -0,0 +1,27 @@
+package com.aix
+
+import android.graphics.Color
+import android.view.View
+import androidx.annotation.Keep
+import com.facebook.proguard.annotations.DoNotStrip
+import com.facebook.react.uimanager.ThemedReactContext
+import com.margelo.nitro.aix.HybridAixSpec
+
+@Keep
+@DoNotStrip
+class HybridAix(val context: ThemedReactContext): HybridAixSpec() {
+    // View
+    override val view: View = View(context)
+
+    // Props
+    private var _isRed = false
+    override var isRed: Boolean
+        get() = _isRed
+        set(value) {
+            _isRed = value
+            view.setBackgroundColor(
+                if (value) Color.RED
+                else Color.BLACK
+            )
+        }
+}

package/ios/Bridge.h

@@ -0,0 +1,8 @@
+//
+//  Bridge.h
+//  aix
+//
+//  Created by Fernando Rojo on 12/11/2025
+//
+
+#pragma once