react-nitro-renderer 0.0.0-stage → 0.0.1-alpha.7

package/src/types/ViewPropsUpdater.ts

@@ -0,0 +1,30 @@
+import type { View as NativeView } from "../specs/View.nitro";
+import type { Label } from "../specs/Label.nitro";
+import type { ViewProps } from "../components/View";
+import type { TextProps } from "../components/Text";
+import type { ScrollView } from "../specs/ScrollView.nitro";
+import type { ScrollViewContent } from "../specs/ScrollViewContent.nitro";
+import type { ScrollViewProps } from "../components/ScrollView";
+import type { ScrollViewContentProps } from "../components/ScrollViewContent";
+
+/** Each host name determines its native view and _public_ props. */
+export interface ViewDefinitionMap {
+  View: { view: NativeView; props: ViewProps };
+  Text: { view: Label; props: TextProps };
+  ScrollView: { view: ScrollView; props: ScrollViewProps };
+  ScrollViewContent: { view: ScrollViewContent; props: ScrollViewContentProps };
+}
+
+export type ViewPropsMap = {
+  [Type in keyof ViewDefinitionMap]: ViewDefinitionMap[Type]["props"];
+};
+
+export type ViewPropsUpdateArgs = {
+  [K in keyof ViewPropsMap]: [
+    view: ViewDefinitionMap[K]["view"],
+    type: K,
+    props: ViewPropsMap[K],
+  ];
+}[keyof ViewPropsMap];
+
+export type ViewPropsUpdater = (...args: ViewPropsUpdateArgs) => void;

package/src/types/YogaStyleProps.ts

@@ -0,0 +1,47 @@
+export interface YogaStyleProps {
+  /** Defaults to relative. Absolute positioning removes the view from flex flow. */
+  position?: "static" | "relative" | "absolute";
+  /** Top offset in points. Removing it clears the offset. */
+  top?: number;
+  /** Right offset in points. Removing it clears the offset. */
+  right?: number;
+  /** Bottom offset in points. Removing it clears the offset. */
+  bottom?: number;
+  /** Left offset in points. Removing it clears the offset. */
+  left?: number;
+  flex?: number;
+  flexDirection?: "column" | "column-reverse" | "row" | "row-reverse";
+  flexShrink?: number;
+  flexGrow?: number;
+  justifyContent?:
+    | "flex-start"
+    | "flex-end"
+    | "center"
+    | "space-between"
+    | "space-around"
+    | "space-evenly";
+  alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline";
+  alignSelf?:
+    | "auto"
+    | "flex-start"
+    | "flex-end"
+    | "center"
+    | "stretch"
+    | "baseline";
+  width?: number;
+  height?: number;
+  margin?: "auto" | number;
+  marginTop?: "auto" | number;
+  marginBottom?: "auto" | number;
+  marginLeft?: "auto" | number;
+  marginRight?: "auto" | number;
+  padding?: number;
+  paddingTop?: number;
+  paddingBottom?: number;
+  paddingLeft?: number;
+  paddingRight?: number;
+  paddingHorizontal?: number;
+  paddingVertical?: number;
+  overflow?: "visible" | "hidden" | "scroll";
+  borderWidth?: number;
+}

package/src/utils/arePropArraysEqual.ts

@@ -0,0 +1,18 @@
+/** Benchmarked, fastest implementation for hermes to compare arrays */
+export function arePropArraysEqual(
+  values: readonly unknown[],
+  previousValues: readonly unknown[],
+): boolean {
+  if (values.length !== previousValues.length) {
+    return false;
+  }
+  // A performance benchmark showed that Hermes compared prop arrays faster
+  // with findIndex than with entries() iteration.
+  // It also visits sparse slots, preserving comparisons with undefined.
+  const changedIndex = values.findIndex((value, index) => {
+    const previousValue = previousValues[index];
+    // Note: technically it misses comparing -0/+0, NaN, but we don't care about them too much in the name of performance.
+    return value !== previousValue;
+  });
+  return changedIndex === -1;
+}