react-native-list 1.0.1 → 2.0.0-alpha.2

package/nitrogen/generated/shared/c++/views/HybridViewHolderComponent.cpp

@@ -0,0 +1,72 @@
+///
+/// HybridViewHolderComponent.cpp
+/// This file was generated by nitrogen. DO NOT MODIFY THIS FILE.
+/// https://github.com/mrousavy/nitro
+/// Copyright © Marc Rousavy @ Margelo
+///
+
+#include "HybridViewHolderComponent.hpp"
+
+#include <string>
+#include <exception>
+#include <utility>
+#include <NitroModules/NitroDefines.hpp>
+#include <NitroModules/JSIConverter.hpp>
+#include <NitroModules/PropNameIDCache.hpp>
+#include <react/renderer/core/RawValue.h>
+#include <react/renderer/core/ShadowNode.h>
+#include <react/renderer/core/ComponentDescriptor.h>
+#include <react/renderer/components/view/ViewProps.h>
+
+namespace margelo::nitro::reactnativelist::views {
+
+  extern const char HybridViewHolderComponentName[] = "ViewHolder";
+
+  HybridViewHolderProps::HybridViewHolderProps(const react::PropsParserContext& context,
+                                               const HybridViewHolderProps& sourceProps,
+                                               const react::RawProps& rawProps):
+    react::ViewProps(context, sourceProps, rawProps, filterObjectKeys),
+    hybridRef([&]() -> CachedProp<std::optional<std::function<void(const std::shared_ptr<HybridViewHolderSpec>& /* ref */)>>> {
+      try {
+        const react::RawValue* rawValue = rawProps.at("hybridRef", nullptr, nullptr);
+        if (rawValue == nullptr) return sourceProps.hybridRef;
+        const auto& [runtime, value] = (std::pair<jsi::Runtime*, jsi::Value>)*rawValue;
+        return CachedProp<std::optional<std::function<void(const std::shared_ptr<HybridViewHolderSpec>& /* ref */)>>>::fromRawValue(*runtime, value.asObject(*runtime).getProperty(*runtime, PropNameIDCache::get(*runtime, "f")), sourceProps.hybridRef);
+      } catch (const std::exception& exc) {
+        throw std::runtime_error(std::string("ViewHolder.hybridRef: ") + exc.what());
+      }
+    }()) { }
+
+  bool HybridViewHolderProps::filterObjectKeys(const std::string& propName) {
+    switch (hashString(propName)) {
+      case hashString("hybridRef"): return true;
+      default: return false;
+    }
+  }
+
+  HybridViewHolderComponentDescriptor::HybridViewHolderComponentDescriptor(const react::ComponentDescriptorParameters& parameters)
+    : ConcreteComponentDescriptor(parameters,
+                                  react::RawPropsParser(/* enableJsiParser */ true)) {}
+
+  std::shared_ptr<const react::Props> HybridViewHolderComponentDescriptor::cloneProps(const react::PropsParserContext& context,
+                                                                                      const std::shared_ptr<const react::Props>& props,
+                                                                                      react::RawProps rawProps) const {
+    // 1. Prepare raw props parser
+    rawProps.parse(rawPropsParser_);
+    // 2. Copy props with Nitro's cached copy constructor
+    return HybridViewHolderShadowNode::Props(context, /* & */ rawProps, props);
+  }
+
+#ifdef ANDROID
+  void HybridViewHolderComponentDescriptor::adopt(react::ShadowNode& shadowNode) const {
+    // This is called immediately after `ShadowNode` is created, cloned or in progress.
+    // On Android, we need to wrap props in our state, which gets routed through Java and later unwrapped in JNI/C++.
+    auto& concreteShadowNode = static_cast<HybridViewHolderShadowNode&>(shadowNode);
+    const std::shared_ptr<const HybridViewHolderProps>& constProps = concreteShadowNode.getConcreteSharedProps();
+    const std::shared_ptr<HybridViewHolderProps>& props = std::const_pointer_cast<HybridViewHolderProps>(constProps);
+    HybridViewHolderState state{props};
+    concreteShadowNode.setStateData(std::move(state));
+  }
+#endif
+
+} // namespace margelo::nitro::reactnativelist::views

package/nitrogen/generated/shared/c++/views/HybridViewHolderComponent.hpp

@@ -0,0 +1,109 @@
+///
+/// HybridViewHolderComponent.hpp
+/// This file was generated by nitrogen. DO NOT MODIFY THIS FILE.
+/// https://github.com/mrousavy/nitro
+/// Copyright © Marc Rousavy @ Margelo
+///
+
+#pragma once
+
+#include <optional>
+#include <NitroModules/NitroDefines.hpp>
+#include <NitroModules/NitroHash.hpp>
+#include <NitroModules/CachedProp.hpp>
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+#include <react/renderer/core/PropsParserContext.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+#include <react/renderer/components/view/ViewProps.h>
+
+#include <memory>
+#include "HybridViewHolderSpec.hpp"
+#include <functional>
+#include <optional>
+
+namespace margelo::nitro::reactnativelist::views {
+
+  using namespace facebook;
+
+  /**
+   * The name of the actual native View.
+   */
+  extern const char HybridViewHolderComponentName[];
+
+  /**
+   * Props for the "ViewHolder" View.
+   */
+  class HybridViewHolderProps final: public react::ViewProps {
+  public:
+    HybridViewHolderProps() = default;
+    HybridViewHolderProps(const react::PropsParserContext& context,
+                          const HybridViewHolderProps& sourceProps,
+                          const react::RawProps& rawProps);
+
+  public:
+    CachedProp<std::optional<std::function<void(const std::shared_ptr<HybridViewHolderSpec>& /* ref */)>>> hybridRef;
+
+  private:
+    static bool filterObjectKeys(const std::string& propName);
+  };
+
+  /**
+   * State for the "ViewHolder" View.
+   */
+  class HybridViewHolderState final {
+  public:
+    HybridViewHolderState() = default;
+    explicit HybridViewHolderState(const std::shared_ptr<HybridViewHolderProps>& props):
+      _props(props) {}
+
+  public:
+    [[nodiscard]]
+    const std::shared_ptr<HybridViewHolderProps>& getProps() const {
+      return _props;
+    }
+
+  public:
+#ifdef ANDROID
+  HybridViewHolderState(const HybridViewHolderState& /* previousState */, folly::dynamic /* data */) {}
+  folly::dynamic getDynamic() const {
+    throw std::runtime_error("HybridViewHolderState does not support folly!");
+  }
+  react::MapBuffer getMapBuffer() const {
+    throw std::runtime_error("HybridViewHolderState does not support MapBuffer!");
+  };
+#endif
+
+  private:
+    std::shared_ptr<HybridViewHolderProps> _props;
+  };
+
+  /**
+   * The Shadow Node for the "ViewHolder" View.
+   */
+  using HybridViewHolderShadowNode = react::ConcreteViewShadowNode<HybridViewHolderComponentName /* "HybridViewHolder" */,
+                                                                   HybridViewHolderProps /* custom props */,
+                                                                   react::ViewEventEmitter /* default */,
+                                                                   HybridViewHolderState /* custom state */>;
+
+  /**
+   * The Component Descriptor for the "ViewHolder" View.
+   */
+  class HybridViewHolderComponentDescriptor final: public react::ConcreteComponentDescriptor<HybridViewHolderShadowNode> {
+  public:
+    explicit HybridViewHolderComponentDescriptor(const react::ComponentDescriptorParameters& parameters);
+
+  public:
+    /**
+     * A faster path for cloning props - reuses the caching logic from `HybridViewHolderProps`.
+     */
+    std::shared_ptr<const react::Props> cloneProps(const react::PropsParserContext& context,
+                                                   const std::shared_ptr<const react::Props>& props,
+                                                   react::RawProps rawProps) const override;
+#ifdef ANDROID
+    void adopt(react::ShadowNode& shadowNode) const override;
+#endif
+  };
+
+  /* The actual view for "ViewHolder" needs to be implemented in platform-specific code. */
+
+} // namespace margelo::nitro::reactnativelist::views

package/nitrogen/generated/shared/json/UiListViewConfig.json

@@ -0,0 +1,9 @@
+{
+  "uiViewClassName": "UiListView",
+  "supportsRawText": false,
+  "bubblingEventTypes": {},
+  "directEventTypes": {},
+  "validAttributes": {
+    "hybridRef": true
+  }
+}

package/nitrogen/generated/shared/json/ViewHolderConfig.json

@@ -0,0 +1,9 @@
+{
+  "uiViewClassName": "ViewHolder",
+  "supportsRawText": false,
+  "bubblingEventTypes": {},
+  "directEventTypes": {},
+  "validAttributes": {
+    "hybridRef": true
+  }
+}

package/package.json

@@ -1,8 +1,155 @@
 {
   "name": "react-native-list",
-  "version": "1.0.1",
-  "main": "index.js",
-  "repository": "git@github.com:Kureev/react-native-list.git",
-  "author": "Alexey Kureev <a.g.kureev@gmail.com>",
-  "license": "SEE LICENSE IN LICENSE.md"
+  "version": "2.0.0-alpha.2",
+  "description": "React Native List",
+  "main": "lib/index",
+  "module": "lib/index",
+  "types": "lib/index.d.ts",
+  "react-native": "src/index",
+  "source": "src/index",
+  "files": [
+    "src",
+    "metro",
+    "metro-config.js",
+    "metro-config.d.ts",
+    "react-native.config.js",
+    "lib",
+    "nitrogen",
+    "android/build.gradle",
+    "android/gradle.properties",
+    "android/fix-prefab.gradle",
+    "android/CMakeLists.txt",
+    "android/src",
+    "ios/**/*.h",
+    "ios/**/*.m",
+    "ios/**/*.mm",
+    "ios/**/*.cpp",
+    "ios/**/*.swift",
+    "app.plugin.js",
+    "nitro.json",
+    "*.podspec",
+    "README.md"
+  ],
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "clean": "rm -rf android/build node_modules/**/android/build lib",
+    "lint": "eslint \"**/*.{js,ts,tsx}\" --fix",
+    "lint-ci": "eslint \"**/*.{js,ts,tsx}\" -f @jamesacarr/github-actions",
+    "typescript": "tsc",
+    "specs": "nitrogen --logLevel=\"debug\"",
+    "android": "expo run:android",
+    "ios": "expo run:ios",
+    "bundle:js": "bun run react-bundler/bundle.ts",
+    "bundle:js:prod": "NODE_ENV=production bun run react-bundler/bundle.ts",
+    "prepack": "cp ../README.md ./README.md",
+    "postpack": "rm ./README.md",
+    "release": "release-it"
+  },
+  "keywords": [
+    "react-native",
+    "nitro"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/hannojg/react-native-list.git"
+  },
+  "author": "Hanno Gödecke <hanno@margelo.com> (https://github.com/hannojg)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/hannojg/react-native-list/issues"
+  },
+  "homepage": "https://github.com/hannojg/react-native-list#readme",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "devDependencies": {
+    "@react-native/eslint-config": "0.83.6",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^5.2.1",
+    "flow-remove-types": "^2.299.0",
+    "nitrogen": "catalog:",
+    "prettier": "^3.3.3",
+    "react": "catalog:",
+    "react-native": "catalog:",
+    "react-native-nitro-modules": "catalog:",
+    "react-native-worklets": "catalog:",
+    "react-reconciler": "^0.33.0",
+    "release-it": "^20.0.1",
+    "typescript": "^5.8.3"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*",
+    "react-native-worklets": ">=0.10.0",
+    "react-native-nitro-modules": "*"
+  },
+  "eslintConfig": {
+    "root": true,
+    "extends": [
+      "@react-native",
+      "prettier"
+    ],
+    "plugins": [
+      "prettier"
+    ],
+    "rules": {
+      "no-restricted-syntax": [
+        "error",
+        {
+          "selector": "ImportDeclaration[source.value=/ReactFabricMirror(\\.bundle)?(\\.[jt]sx?)?$/]",
+          "message": "Import React Fabric mirror through src/renderer/react/ReactFabricRenderer instead."
+        },
+        {
+          "selector": "ExportNamedDeclaration[source.value=/ReactFabricMirror(\\.bundle)?(\\.[jt]sx?)?$/]",
+          "message": "Export React Fabric mirror through src/renderer/react/ReactFabricRenderer instead."
+        },
+        {
+          "selector": "ExportAllDeclaration[source.value=/ReactFabricMirror(\\.bundle)?(\\.[jt]sx?)?$/]",
+          "message": "Export React Fabric mirror through src/renderer/react/ReactFabricRenderer instead."
+        },
+        {
+          "selector": "CallExpression[callee.name='require'][arguments.0.value=/ReactFabricMirror(\\.bundle)?(\\.[jt]sx?)?$/]",
+          "message": "Require React Fabric mirror through src/renderer/react/ReactFabricRenderer instead."
+        },
+        {
+          "selector": "TSImportType Literal[value=/ReactFabricMirror(\\.bundle)?(\\.[jt]sx?)?$/]",
+          "message": "Reference React Fabric mirror types through src/renderer/react/ReactFabricRenderer instead."
+        }
+      ],
+      "prettier/prettier": [
+        "warn",
+        {
+          "quoteProps": "consistent",
+          "singleQuote": true,
+          "tabWidth": 2,
+          "trailingComma": "es5",
+          "useTabs": false
+        }
+      ]
+    },
+    "overrides": [
+      {
+        "files": [
+          "src/renderer/react/ReactFabricRenderer.ts"
+        ],
+        "rules": {
+          "no-restricted-syntax": "off"
+        }
+      }
+    ]
+  },
+  "eslintIgnore": [
+    "node_modules/",
+    "lib/"
+  ],
+  "prettier": {
+    "quoteProps": "consistent",
+    "singleQuote": true,
+    "tabWidth": 2,
+    "trailingComma": "es5",
+    "useTabs": false,
+    "semi": false
+  },
+  "patchedDependencies": {}
 }

package/react-native.config.js

@@ -0,0 +1,16 @@
+// https://github.com/react-native-community/cli/blob/main/docs/dependencies.md
+
+module.exports = {
+  dependency: {
+    platforms: {
+      /**
+       * @type {import('@react-native-community/cli-types').IOSDependencyParams}
+       */
+      ios: {},
+      /**
+       * @type {import('@react-native-community/cli-types').AndroidDependencyParams}
+       */
+      android: {},
+    },
+  },
+}

package/src/ListDataSource.ts

@@ -0,0 +1,232 @@
+import { NitroModules } from 'react-native-nitro-modules'
+import type { AnyMap } from 'react-native-nitro-modules'
+import type { NativeListDataSource } from './specs/NativeListDataSource.nitro'
+import { useEffect, useRef } from 'react'
+import { scheduleOnUI } from 'react-native-worklets'
+
+export type ListKey = string
+
+export type ListItemSize = {
+  width?: number
+  height?: number
+}
+
+export type ListItem<
+  Type = string,
+  TData extends AnyMap = AnyMap,
+> = ListItemSize & {
+  key: ListKey
+  type: Type
+  data: TData
+}
+
+export type ListItemType<TItem extends ListItem> = TItem['type']
+
+export type ListItemForType<
+  TItem extends ListItem,
+  TType extends ListItemType<TItem>,
+> =
+  Extract<TItem, { type: TType }> extends never
+    ? TItem
+    : Extract<TItem, { type: TType }>
+
+export type ListContentEqualByType<TItem extends ListItem> = {
+  [TType in ListItemType<TItem>]: (
+    oldItem: ListItemForType<TItem, TType>,
+    newItem: ListItemForType<TItem, TType>
+  ) => boolean
+}
+
+export type ListDataSourceConfig<TItem extends ListItem> = {
+  isContentEqualByType?: ListContentEqualByType<TItem>
+}
+
+export type ListDataSource<TItem extends ListItem> = {
+  release(): void
+  replaceData(data: readonly TItem[], animated?: boolean): void
+  insertItem(index: number, item: TItem): void
+  updateItem(index: number, item: TItem): void
+  removeItem(index: number): void
+  moveItem(fromIndex: number, toIndex: number): void
+}
+
+export type ListDataSourceMutation =
+  | {
+      type: 'replaceData'
+    }
+  | {
+      type: 'removeItem'
+      itemKey: string
+    }
+  | {
+      type: 'updateItem'
+      previousItemKey: string
+    }
+
+type ListDataSourceMutationListener = (mutation: ListDataSourceMutation) => void
+
+type NativeListDataSourceBacked<TItem extends ListItem> =
+  ListDataSource<TItem> & {
+    __nativeDataSource: NativeListDataSource
+    __setConfig(config: unknown): void
+    __addMutationListener(listener: ListDataSourceMutationListener): () => void
+  }
+
+function setContentEqualCallback<TItem extends ListItem>(
+  nativeDataSource: NativeListDataSource,
+  config: ListDataSourceConfig<TItem>
+) {
+  nativeDataSource.setContentEqualCallback((oldItem, newItem) => {
+    if (oldItem.type !== newItem.type) {
+      return false
+    }
+    if (oldItem.width !== newItem.width) {
+      return false
+    }
+    if (oldItem.height !== newItem.height) {
+      return false
+    }
+
+    const type = newItem.type as TItem['type']
+    const isContentEqual = config.isContentEqualByType?.[type]
+    if (isContentEqual == null) {
+      return false
+    }
+
+    return isContentEqual(
+      oldItem as unknown as ListItemForType<TItem, typeof type>,
+      newItem as unknown as ListItemForType<TItem, typeof type>
+    )
+  })
+}
+
+export function createListDataSource<TItem extends ListItem>(
+  config: ListDataSourceConfig<TItem> = {}
+): ListDataSource<TItem> {
+  const nativeDataSource =
+    NitroModules.createHybridObject<NativeListDataSource>(
+      'NativeListDataSource'
+    )
+  let currentConfig = config
+  let currentItems: TItem[] = []
+  const mutationListeners = new Set<ListDataSourceMutationListener>()
+
+  setContentEqualCallback(nativeDataSource, currentConfig)
+
+  function notifyMutationListeners(mutation: ListDataSourceMutation) {
+    mutationListeners.forEach((listener) => {
+      scheduleOnUI(listener, mutation)
+    })
+  }
+
+  const dataSource: NativeListDataSourceBacked<TItem> = {
+    __nativeDataSource: nativeDataSource,
+    __setConfig(nextConfig: unknown) {
+      currentConfig = nextConfig as unknown as ListDataSourceConfig<TItem>
+      setContentEqualCallback(nativeDataSource, currentConfig)
+    },
+    __addMutationListener(listener: ListDataSourceMutationListener) {
+      mutationListeners.add(listener)
+      return () => {
+        mutationListeners.delete(listener)
+      }
+    },
+    release() {
+      currentConfig = {}
+      currentItems = []
+      mutationListeners.clear()
+      nativeDataSource.dispose()
+    },
+    replaceData(data: readonly TItem[], animated: boolean = false) {
+      const nextItems = [...data]
+      currentItems = nextItems
+      notifyMutationListeners({
+        type: 'replaceData',
+      })
+      nativeDataSource.replaceData(nextItems, animated)
+    },
+    insertItem(index: number, item: TItem) {
+      currentItems.splice(index, 0, item)
+      nativeDataSource.insertItem(index, item)
+    },
+    updateItem(index: number, item: TItem) {
+      const previousItem = currentItems[index]
+      if (previousItem != null && previousItem.key !== item.key) {
+        currentItems[index] = item
+        notifyMutationListeners({
+          type: 'updateItem',
+          previousItemKey: previousItem.key,
+        })
+        nativeDataSource.updateItem(index, item)
+        return
+      }
+
+      currentItems[index] = item
+      nativeDataSource.updateItem(index, item)
+    },
+    removeItem(index: number) {
+      const removedItems = currentItems.slice(index, index + 1)
+      const removedItem = removedItems[0]
+      currentItems.splice(index, 1)
+      if (removedItem != null) {
+        notifyMutationListeners({
+          type: 'removeItem',
+          itemKey: removedItem.key,
+        })
+      }
+      nativeDataSource.removeItem(index)
+    },
+    moveItem(fromIndex: number, toIndex: number) {
+      const removedItems = currentItems.slice(fromIndex, fromIndex + 1)
+      const movedItem = removedItems[0]
+      if (movedItem != null) {
+        currentItems.splice(fromIndex, 1)
+        currentItems.splice(toIndex, 0, movedItem)
+      }
+      nativeDataSource.moveItem(fromIndex, toIndex)
+    },
+  }
+  return dataSource
+}
+
+export function getNativeListDataSource<TItem extends ListItem>(
+  dataSource: ListDataSource<TItem>
+): NativeListDataSource {
+  const nativeBackedDataSource = dataSource as NativeListDataSourceBacked<TItem>
+  return nativeBackedDataSource.__nativeDataSource
+}
+
+export function addListDataSourceMutationListener<TItem extends ListItem>(
+  dataSource: ListDataSource<TItem>,
+  listener: ListDataSourceMutationListener
+) {
+  const nativeBackedDataSource = dataSource as NativeListDataSourceBacked<TItem>
+  return nativeBackedDataSource.__addMutationListener(listener)
+}
+
+export function useListDataSource<TItem extends ListItem>(
+  config: ListDataSourceConfig<TItem> & {
+    data: readonly TItem[]
+  }
+): ListDataSource<TItem> {
+  const dataSourceRef = useRef<ListDataSource<TItem> | null>(null)
+  if (dataSourceRef.current == null) {
+    dataSourceRef.current = createListDataSource(config)
+  }
+
+  const dataSource = dataSourceRef.current
+  const nativeBackedDataSource = dataSource as NativeListDataSourceBacked<TItem>
+
+  useEffect(() => {
+    nativeBackedDataSource.__setConfig(config)
+    dataSource.replaceData(config.data, true)
+  }, [config, dataSource, nativeBackedDataSource])
+
+  useEffect(() => {
+    return () => {
+      dataSource.release()
+    }
+  }, [dataSource])
+
+  return dataSource
+}