react-native-gtkx 0.2.0-alpha.2 → 0.3.0-alpha.1

package/dist/dnd/droppable.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// `Droppable` and `useDroppable`.
+//
+// Upstream registers a rectangle with the provider and the dragged item's
+// own maths decides whether it landed inside. Here GDK decides, against the
+// real widget tree — which is why `collisionAlgorithm` has nothing to
+// configure and why a zone that is full can REFUSE a drop outright (the
+// pointer then shows the no-drop cursor) rather than silently ignoring it.
+import { useCallback, useEffect, useState } from "react";
+import { View } from "../components/view";
+import { useDropContext } from "./context";
+import { DropTargetControllers } from "./gtk-controllers";
+import { FREE_SCOPE, nextDraggableId } from "./payload";
+/** The drop half of the module, as a hook, for a component that owns its own
+ *  view. `viewProps.children` are the GTK controllers; spread them into the
+ *  view the zone should cover. */
+export const useDroppable = (options) => {
+    const { onDrop, dropDisabled = false, onActiveChange, activeStyle, droppableId, capacity = Number.POSITIVE_INFINITY, } = options;
+    const context = useDropContext();
+    const [isActive, setIsActive] = useState(false);
+    // Lazy initial state rather than a ref: stable for the component's
+    // lifetime, and a ref may not be read during render.
+    const [generatedId] = useState(nextDraggableId);
+    const id = droppableId ?? generatedId;
+    useEffect(() => {
+        context.registerDroppable({ droppableId: id, capacity });
+        return () => context.unregisterDroppable(id);
+    }, [context, id, capacity]);
+    useEffect(() => {
+        onActiveChange?.(isActive);
+    }, [isActive, onActiveChange]);
+    // A zone only accepts a free-standing draggable. A `SortableItem` carries
+    // its list's own scope so that dragging a row does not light up every drop
+    // zone on the screen — upstream keeps the two mechanisms apart in the same
+    // way, by never registering sortable items as slots.
+    const accepts = useCallback((payload) => payload.scope === FREE_SCOPE &&
+        context.dataFor(payload.id).found &&
+        context.hasAvailableCapacity(id), [context, id]);
+    const handleDrop = useCallback((payload) => {
+        setIsActive(false);
+        const { found, data } = context.dataFor(payload.id);
+        if (!found) {
+            return;
+        }
+        context.registerDroppedItem(payload.id, id, data);
+        onDrop(data);
+    }, [context, id, onDrop]);
+    const controllers = dropDisabled ? null : (_jsx(DropTargetControllers, { accepts: accepts, onEnter: () => setIsActive(true), onLeave: () => setIsActive(false), onDrop: handleDrop }));
+    return { viewProps: { children: controllers }, isActive, activeStyle };
+};
+/**
+ * A zone that accepts a `Draggable`'s `data`.
+ *
+ * ```tsx
+ * <Droppable
+ *   onDrop={(task) => assign(task)}
+ *   activeStyle={{ borderColor: "accent" }}
+ * >
+ *   <View style={styles.zone}>
+ *     <Text>Assign to me</Text>
+ *   </View>
+ * </Droppable>
+ * ```
+ *
+ * `capacity` is enforced at GDK level: once the zone is full it refuses the
+ * drop, so the cursor says so before the user lets go.
+ */
+export const Droppable = ({ children, style, testID, ...options }) => {
+    const droppable = useDroppable(options);
+    return (_jsxs(View, { style: droppable.isActive && droppable.activeStyle
+            ? [style, droppable.activeStyle]
+            : style, testID: testID, children: [droppable.viewProps.children, children] }));
+};
+//# sourceMappingURL=droppable.js.map

package/dist/dnd/droppable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"droppable.js","sourceRoot":"","sources":["../../src/dnd/droppable.tsx"],"names":[],"mappings":"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","sourcesContent":["// `Droppable` and `useDroppable`.\n//\n// Upstream registers a rectangle with the provider and the dragged item's\n// own maths decides whether it landed inside. Here GDK decides, against the\n// real widget tree — which is why `collisionAlgorithm` has nothing to\n// configure and why a zone that is full can REFUSE a drop outright (the\n// pointer then shows the no-drop cursor) rather than silently ignoring it.\nimport { useCallback, useEffect, useState, type ReactNode } from \"react\"\nimport { View } from \"../components/view\"\nimport { useDropContext } from \"./context\"\nimport { DropTargetControllers } from \"./gtk-controllers\"\nimport { FREE_SCOPE, nextDraggableId } from \"./payload\"\nimport type {\n  DroppableProps,\n  UseDroppableOptions,\n  UseDroppableReturn,\n} from \"./types\"\n\n/** The drop half of the module, as a hook, for a component that owns its own\n *  view. `viewProps.children` are the GTK controllers; spread them into the\n *  view the zone should cover. */\nexport const useDroppable = <TData,>(\n  options: UseDroppableOptions<TData>,\n): UseDroppableReturn => {\n  const {\n    onDrop,\n    dropDisabled = false,\n    onActiveChange,\n    activeStyle,\n    droppableId,\n    capacity = Number.POSITIVE_INFINITY,\n  } = options\n\n  const context = useDropContext()\n  const [isActive, setIsActive] = useState(false)\n\n  // Lazy initial state rather than a ref: stable for the component's\n  // lifetime, and a ref may not be read during render.\n  const [generatedId] = useState(nextDraggableId)\n  const id = droppableId ?? generatedId\n\n  useEffect(() => {\n    context.registerDroppable({ droppableId: id, capacity })\n    return () => context.unregisterDroppable(id)\n  }, [context, id, capacity])\n\n  useEffect(() => {\n    onActiveChange?.(isActive)\n  }, [isActive, onActiveChange])\n\n  // A zone only accepts a free-standing draggable. A `SortableItem` carries\n  // its list's own scope so that dragging a row does not light up every drop\n  // zone on the screen — upstream keeps the two mechanisms apart in the same\n  // way, by never registering sortable items as slots.\n  const accepts = useCallback(\n    (payload: { scope: string; id: string }) =>\n      payload.scope === FREE_SCOPE &&\n      context.dataFor(payload.id).found &&\n      context.hasAvailableCapacity(id),\n    [context, id],\n  )\n\n  const handleDrop = useCallback(\n    (payload: { scope: string; id: string }) => {\n      setIsActive(false)\n      const { found, data } = context.dataFor(payload.id)\n      if (!found) {\n        return\n      }\n      context.registerDroppedItem(payload.id, id, data)\n      onDrop(data as TData)\n    },\n    [context, id, onDrop],\n  )\n\n  const controllers = dropDisabled ? null : (\n    <DropTargetControllers\n      accepts={accepts}\n      onEnter={() => setIsActive(true)}\n      onLeave={() => setIsActive(false)}\n      onDrop={handleDrop}\n    />\n  )\n\n  return { viewProps: { children: controllers }, isActive, activeStyle }\n}\n\n/**\n * A zone that accepts a `Draggable`'s `data`.\n *\n * ```tsx\n * <Droppable\n *   onDrop={(task) => assign(task)}\n *   activeStyle={{ borderColor: \"accent\" }}\n * >\n *   <View style={styles.zone}>\n *     <Text>Assign to me</Text>\n *   </View>\n * </Droppable>\n * ```\n *\n * `capacity` is enforced at GDK level: once the zone is full it refuses the\n * drop, so the cursor says so before the user lets go.\n */\nexport const Droppable = <TData,>({\n  children,\n  style,\n  testID,\n  ...options\n}: DroppableProps<TData>): ReactNode => {\n  const droppable = useDroppable<TData>(options)\n\n  return (\n    <View\n      style={\n        droppable.isActive && droppable.activeStyle\n          ? [style, droppable.activeStyle]\n          : style\n      }\n      testID={testID}\n    >\n      {droppable.viewProps.children}\n      {children}\n    </View>\n  )\n}\n"]}

package/dist/dnd/gtk-controllers.d.ts

@@ -0,0 +1,39 @@
+import { type ReactNode } from "react";
+import { type DragPayload } from "./payload";
+export type DragSourceControllersProps = {
+    payload: DragPayload;
+    /** Reports the grab point in the source widget's own coordinates, which is
+     *  where the drag icon's hotspot goes and where `tx`/`ty` start from. */
+    onGrab?: (x: number, y: number) => void;
+    onDragBegin?: () => void;
+    /** `dropped` is what GDK's own `drag-end` reports: whether a target took
+     *  it. `drag-cancel` reports the negative case separately, so both are
+     *  folded into one callback here. */
+    onDragEnd?: (dropped: boolean) => void;
+};
+/**
+ * A `GtkDragSource` on the enclosing React Native component's widget.
+ *
+ * The drag icon is a `Gtk.WidgetPaintable` of that widget, offset by where
+ * inside it the drag began — so the thing appears to lift off under the
+ * cursor rather than jump to it. That is the visual no JS drag can produce,
+ * and the reason this module is built on GDK at all.
+ */
+export declare const DragSourceControllers: ({ payload, onGrab, onDragBegin, onDragEnd, }: DragSourceControllersProps) => ReactNode;
+export type DropTargetControllersProps = {
+    /** Return false to refuse — GDK then shows the no-drop cursor, which is
+     *  better feedback than upstream's silent skip. */
+    accepts: (payload: DragPayload) => boolean;
+    onDrop: (payload: DragPayload, x: number, y: number) => void;
+    onEnter?: (payload: DragPayload) => void;
+    onMotion?: (payload: DragPayload, x: number, y: number) => void;
+    onLeave?: () => void;
+};
+/**
+ * A `GtkDropTarget` on the enclosing React Native component's widget,
+ * accepting the string payload this module encodes.
+ *
+ * The payload is decoded before `accepts` is consulted, so a string dragged
+ * in from a text editor is refused rather than mistaken for a draggable.
+ */
+export declare const DropTargetControllers: ({ accepts, onDrop, onEnter, onMotion, onLeave, }: DropTargetControllersProps) => ReactNode;

package/dist/dnd/gtk-controllers.js

@@ -0,0 +1,110 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// The two GTK controllers everything in this module is built from, wrapped
+// once so `Draggable`, `Droppable` and `SortableItem` do not each re-derive
+// the drag-icon and payload details.
+//
+// Both go through `Controllers` from react-native-gtkx/gtk — the same public
+// door an app would use. Nothing here is reachable only from inside the
+// platform, which is the property `List`/`ListRow` already established
+// (docs/platform-layer.md).
+import { useRef } from "react";
+import { Controllers } from "../gtk/controllers";
+import { Gdk, GObject, Gtk, GtkDragSource, GtkDropTarget, } from "../gtkx/bridge/index";
+import { decodePayload, encodePayload } from "./payload";
+/**
+ * A `GtkDragSource` on the enclosing React Native component's widget.
+ *
+ * The drag icon is a `Gtk.WidgetPaintable` of that widget, offset by where
+ * inside it the drag began — so the thing appears to lift off under the
+ * cursor rather than jump to it. That is the visual no JS drag can produce,
+ * and the reason this module is built on GDK at all.
+ */
+export const DragSourceControllers = ({ payload, onGrab, onDragBegin, onDragEnd, }) => {
+    // GDK emits `drag-cancel` AND then `drag-end` for a refused drop, so the
+    // cancel is recorded and read by the end handler rather than reported
+    // twice.
+    const cancelled = useRef(false);
+    return (_jsx(Controllers, { children: _jsx(GtkDragSource, { actions: Gdk.DragAction.MOVE, onPrepare: (x, y, self) => {
+                const widget = self.getWidget();
+                if (widget) {
+                    self.setIcon(Gtk.WidgetPaintable.new(widget), Math.round(x), Math.round(y));
+                }
+                onGrab?.(x, y);
+                return Gdk.ContentProvider.newForValue(GObject.buildValue(GObject.TYPE_STRING, (value) => value.setString(encodePayload(payload))));
+            }, onDragBegin: () => {
+                cancelled.current = false;
+                onDragBegin?.();
+            }, onDragCancel: () => {
+                cancelled.current = true;
+                // false: let GTK play its own "snap back" animation, which is the
+                // platform's way of saying the drop was refused.
+                return false;
+            }, onDragEnd: () => onDragEnd?.(!cancelled.current) }) }));
+};
+/**
+ * A `GtkDropTarget` on the enclosing React Native component's widget,
+ * accepting the string payload this module encodes.
+ *
+ * The payload is decoded before `accepts` is consulted, so a string dragged
+ * in from a text editor is refused rather than mistaken for a draggable.
+ */
+export const DropTargetControllers = ({ accepts, onDrop, onEnter, onMotion, onLeave, }) => {
+    // The payload of the drag currently overhead, sampled on `::enter` and kept
+    // for `::motion` (which is not handed the target).
+    const hovering = useRef(null);
+    return (_jsx(Controllers, { children: _jsx(GtkDropTarget, { actions: Gdk.DragAction.MOVE, types: [GObject.TYPE_STRING], 
+            // Without this `gtk_drop_target_get_value()` returns NULL until the
+            // drop itself, so `::enter` could not tell one drag from another and
+            // every zone would light up for every payload. Preloading is exactly
+            // the property GTK provides for reading the data during the drag; the
+            // cost it warns about (fetching data from another process on hover)
+            // does not apply, because the payload is a short string this process
+            // wrote.
+            preload: true, onEnter: (_x, _y, self) => {
+                const payload = payloadOf(self);
+                hovering.current = payload;
+                // A payload that is not readable yet is NOT refused: refusing in
+                // `::enter` ends the drag for this target permanently, while
+                // accepting and re-checking at drop time is recoverable. Only a
+                // payload we can read AND reject is turned away.
+                if (payload && !accepts(payload)) {
+                    return Gdk.DragAction.NONE;
+                }
+                if (payload) {
+                    onEnter?.(payload);
+                }
+                return Gdk.DragAction.MOVE;
+            }, onMotion: (x, y) => {
+                const payload = hovering.current;
+                if (payload && !accepts(payload)) {
+                    return Gdk.DragAction.NONE;
+                }
+                if (payload) {
+                    onMotion?.(payload, x, y);
+                }
+                return Gdk.DragAction.MOVE;
+            }, onLeave: () => {
+                hovering.current = null;
+                onLeave?.();
+            }, onDrop: (value, x, y) => {
+                hovering.current = null;
+                const payload = decodePayload(value.getString());
+                if (!payload || !accepts(payload)) {
+                    return false;
+                }
+                onDrop(payload, x, y);
+                return true;
+            } }) }));
+};
+/**
+ * The payload of the drag currently over a drop target, readable during the
+ * drag because the target above sets `preload`.
+ */
+const payloadOf = (target) => {
+    const value = target.getValue();
+    if (!value) {
+        return null;
+    }
+    return decodePayload(value.getString());
+};
+//# sourceMappingURL=gtk-controllers.js.map

package/dist/dnd/gtk-controllers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gtk-controllers.js","sourceRoot":"","sources":["../../src/dnd/gtk-controllers.tsx"],"names":[],"mappings":"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","sourcesContent":["// The two GTK controllers everything in this module is built from, wrapped\n// once so `Draggable`, `Droppable` and `SortableItem` do not each re-derive\n// the drag-icon and payload details.\n//\n// Both go through `Controllers` from react-native-gtkx/gtk — the same public\n// door an app would use. Nothing here is reachable only from inside the\n// platform, which is the property `List`/`ListRow` already established\n// (docs/platform-layer.md).\nimport { useRef, type ReactNode } from \"react\"\nimport { Controllers } from \"../gtk/controllers\"\nimport {\n  Gdk,\n  GObject,\n  Gtk,\n  GtkDragSource,\n  GtkDropTarget,\n} from \"../gtkx/bridge/index\"\nimport { decodePayload, encodePayload, type DragPayload } from \"./payload\"\n\nexport type DragSourceControllersProps = {\n  payload: DragPayload\n  /** Reports the grab point in the source widget's own coordinates, which is\n   *  where the drag icon's hotspot goes and where `tx`/`ty` start from. */\n  onGrab?: (x: number, y: number) => void\n  onDragBegin?: () => void\n  /** `dropped` is what GDK's own `drag-end` reports: whether a target took\n   *  it. `drag-cancel` reports the negative case separately, so both are\n   *  folded into one callback here. */\n  onDragEnd?: (dropped: boolean) => void\n}\n\n/**\n * A `GtkDragSource` on the enclosing React Native component's widget.\n *\n * The drag icon is a `Gtk.WidgetPaintable` of that widget, offset by where\n * inside it the drag began — so the thing appears to lift off under the\n * cursor rather than jump to it. That is the visual no JS drag can produce,\n * and the reason this module is built on GDK at all.\n */\nexport const DragSourceControllers = ({\n  payload,\n  onGrab,\n  onDragBegin,\n  onDragEnd,\n}: DragSourceControllersProps): ReactNode => {\n  // GDK emits `drag-cancel` AND then `drag-end` for a refused drop, so the\n  // cancel is recorded and read by the end handler rather than reported\n  // twice.\n  const cancelled = useRef(false)\n\n  return (\n    <Controllers>\n      <GtkDragSource\n        actions={Gdk.DragAction.MOVE}\n        onPrepare={(x, y, self) => {\n          const widget = self.getWidget()\n          if (widget) {\n            self.setIcon(\n              Gtk.WidgetPaintable.new(widget),\n              Math.round(x),\n              Math.round(y),\n            )\n          }\n          onGrab?.(x, y)\n          return Gdk.ContentProvider.newForValue(\n            GObject.buildValue(GObject.TYPE_STRING, (value) =>\n              value.setString(encodePayload(payload)),\n            ),\n          )\n        }}\n        onDragBegin={() => {\n          cancelled.current = false\n          onDragBegin?.()\n        }}\n        onDragCancel={() => {\n          cancelled.current = true\n          // false: let GTK play its own \"snap back\" animation, which is the\n          // platform's way of saying the drop was refused.\n          return false\n        }}\n        onDragEnd={() => onDragEnd?.(!cancelled.current)}\n      />\n    </Controllers>\n  )\n}\n\nexport type DropTargetControllersProps = {\n  /** Return false to refuse — GDK then shows the no-drop cursor, which is\n   *  better feedback than upstream's silent skip. */\n  accepts: (payload: DragPayload) => boolean\n  onDrop: (payload: DragPayload, x: number, y: number) => void\n  onEnter?: (payload: DragPayload) => void\n  onMotion?: (payload: DragPayload, x: number, y: number) => void\n  onLeave?: () => void\n}\n\n/**\n * A `GtkDropTarget` on the enclosing React Native component's widget,\n * accepting the string payload this module encodes.\n *\n * The payload is decoded before `accepts` is consulted, so a string dragged\n * in from a text editor is refused rather than mistaken for a draggable.\n */\nexport const DropTargetControllers = ({\n  accepts,\n  onDrop,\n  onEnter,\n  onMotion,\n  onLeave,\n}: DropTargetControllersProps): ReactNode => {\n  // The payload of the drag currently overhead, sampled on `::enter` and kept\n  // for `::motion` (which is not handed the target).\n  const hovering = useRef<DragPayload | null>(null)\n\n  return (\n    <Controllers>\n      <GtkDropTarget\n        actions={Gdk.DragAction.MOVE}\n        types={[GObject.TYPE_STRING]}\n        // Without this `gtk_drop_target_get_value()` returns NULL until the\n        // drop itself, so `::enter` could not tell one drag from another and\n        // every zone would light up for every payload. Preloading is exactly\n        // the property GTK provides for reading the data during the drag; the\n        // cost it warns about (fetching data from another process on hover)\n        // does not apply, because the payload is a short string this process\n        // wrote.\n        preload\n        onEnter={(_x, _y, self) => {\n          const payload = payloadOf(self)\n          hovering.current = payload\n          // A payload that is not readable yet is NOT refused: refusing in\n          // `::enter` ends the drag for this target permanently, while\n          // accepting and re-checking at drop time is recoverable. Only a\n          // payload we can read AND reject is turned away.\n          if (payload && !accepts(payload)) {\n            return Gdk.DragAction.NONE\n          }\n          if (payload) {\n            onEnter?.(payload)\n          }\n          return Gdk.DragAction.MOVE\n        }}\n        onMotion={(x, y) => {\n          const payload = hovering.current\n          if (payload && !accepts(payload)) {\n            return Gdk.DragAction.NONE\n          }\n          if (payload) {\n            onMotion?.(payload, x, y)\n          }\n          return Gdk.DragAction.MOVE\n        }}\n        onLeave={() => {\n          hovering.current = null\n          onLeave?.()\n        }}\n        onDrop={(value, x, y) => {\n          hovering.current = null\n          const payload = decodePayload(value.getString())\n          if (!payload || !accepts(payload)) {\n            return false\n          }\n          onDrop(payload, x, y)\n          return true\n        }}\n      />\n    </Controllers>\n  )\n}\n\n/**\n * The payload of the drag currently over a drop target, readable during the\n * drag because the target above sets `preload`.\n */\nconst payloadOf = (target: Gtk.DropTarget): DragPayload | null => {\n  const value = target.getValue()\n  if (!value) {\n    return null\n  }\n  return decodePayload(value.getString())\n}\n"]}

package/dist/dnd/index.d.ts

@@ -0,0 +1,6 @@
+export { DropProvider, useDropContext } from "./context";
+export { Draggable, DraggableHandle, useDraggable, type UseDraggableResult, } from "./draggable";
+export { Droppable, useDroppable } from "./droppable";
+export { clamp, listToObject, objectMove } from "./order";
+export { Sortable, SortableItem, useSortable, useSortableList, } from "./sortable";
+export { DraggableState, HorizontalScrollDirection, ScrollDirection, SortableDirection, type AnimationFunction, type CollisionAlgorithm, type DraggableHandleProps, type DraggableProps, type DropAlignment, type DroppableProps, type DroppedItemsMap, type DropOffset, type DropProviderProps, type DropProviderRef, type SharedValueLike, type SortableData, type SortableHandleProps, type SortableItemProps, type SortableProps, type SortableRenderItemProps, type UseDraggableOptions, type UseDraggableReturn, type UseDroppableOptions, type UseDroppableReturn, type UseSortableListOptions, type UseSortableListReturn, type UseSortableOptions, type UseSortableReturn, } from "./types";

package/dist/dnd/index.js

@@ -0,0 +1,31 @@
+// react-native-gtkx/dnd — `react-native-reanimated-dnd`'s API, on GTK's own
+// drag-and-drop.
+//
+// WHY this is a subpath of its own rather than part of `common` or `gtk`.
+// `common` is Adwaita's LOOK written in portable React Native; this is
+// behaviour, and GTK behaviour at that. `gtk` exists on the premise that the
+// import is the signal an app is crossing into Linux-only code — and this
+// module's premise is the exact opposite: the app's import should not change
+// at all, so the specifier has to be ALIASABLE. `react-native-gtkx/svg` is
+// the precedent, and the Metro and Vite presets rewrite
+// `react-native-reanimated-dnd` onto this the same way they rewrite
+// `react-native-svg`.
+//
+// The library itself cannot run here: Reanimated 4, worklets and RNGH at
+// module scope in twelve of its files, with the sort algorithm inside
+// `useAnimatedReaction` and the row layout inside `useAnimatedStyle`. The
+// evidence, and the prop-by-prop account of what this mirror honours and
+// what it deliberately does not, is in docs/research/drag-and-drop.md.
+export { DropProvider, useDropContext } from "./context";
+export { Draggable, DraggableHandle, useDraggable, } from "./draggable";
+export { Droppable, useDroppable } from "./droppable";
+export { clamp, listToObject, objectMove } from "./order";
+export { Sortable, SortableItem, useSortable, useSortableList, } from "./sortable";
+export { DraggableState, HorizontalScrollDirection, ScrollDirection, SortableDirection, } from "./types";
+// Upstream exports these from `components/sortableUtils`; they are worklet
+// helpers there, plain functions here. `setPosition` and `setAutoScroll`
+// mutate a SharedValue during a UI-thread gesture — there is no gesture on
+// the UI thread here, so they would have nothing to drive and are NOT
+// re-exported. An app that imported them was reaching into upstream's
+// internals; the build failing at that import is the correct outcome.
+//# sourceMappingURL=index.js.map

package/dist/dnd/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/dnd/index.ts"],"names":[],"mappings":"AAAA,4EAA4E;AAC5E,iBAAiB;AACjB,EAAE;AACF,0EAA0E;AAC1E,uEAAuE;AACvE,6EAA6E;AAC7E,0EAA0E;AAC1E,6EAA6E;AAC7E,2EAA2E;AAC3E,wDAAwD;AACxD,oEAAoE;AACpE,sBAAsB;AACtB,EAAE;AACF,yEAAyE;AACzE,sEAAsE;AACtE,0EAA0E;AAC1E,yEAAyE;AACzE,uEAAuE;AAEvE,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAExD,OAAO,EACL,SAAS,EACT,eAAe,EACf,YAAY,GASb,MAAM,aAAa,CAAA;AAEpB,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAErD,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAEzD,OAAO,EACL,QAAQ,EACR,YAAY,EACZ,WAAW,EACX,eAAe,GAChB,MAAM,YAAY,CAAA;AAEnB,OAAO,EACL,cAAc,EACd,yBAAyB,EACzB,eAAe,EACf,iBAAiB,GAyBlB,MAAM,SAAS,CAAA;AAEhB,2EAA2E;AAC3E,yEAAyE;AACzE,2EAA2E;AAC3E,sEAAsE;AACtE,sEAAsE;AACtE,sEAAsE","sourcesContent":["// react-native-gtkx/dnd — `react-native-reanimated-dnd`'s API, on GTK's own\n// drag-and-drop.\n//\n// WHY this is a subpath of its own rather than part of `common` or `gtk`.\n// `common` is Adwaita's LOOK written in portable React Native; this is\n// behaviour, and GTK behaviour at that. `gtk` exists on the premise that the\n// import is the signal an app is crossing into Linux-only code — and this\n// module's premise is the exact opposite: the app's import should not change\n// at all, so the specifier has to be ALIASABLE. `react-native-gtkx/svg` is\n// the precedent, and the Metro and Vite presets rewrite\n// `react-native-reanimated-dnd` onto this the same way they rewrite\n// `react-native-svg`.\n//\n// The library itself cannot run here: Reanimated 4, worklets and RNGH at\n// module scope in twelve of its files, with the sort algorithm inside\n// `useAnimatedReaction` and the row layout inside `useAnimatedStyle`. The\n// evidence, and the prop-by-prop account of what this mirror honours and\n// what it deliberately does not, is in docs/research/drag-and-drop.md.\n\nexport { DropProvider, useDropContext } from \"./context\"\n\nexport {\n  Draggable,\n  DraggableHandle,\n  useDraggable,\n  // What `useDraggable` actually returns. `UseDraggableReturn` below is the\n  // mirrored half (upstream's field names); this adds the two fields a\n  // caller rendering its own view cannot do without — the measurable ref and\n  // the drag source itself. Unexported, the hook's own documented use case\n  // (\"for a component that owns its own view\") could not be typed by the\n  // component that owns it; porting upstream's `CustomDraggable` is what\n  // found that.\n  type UseDraggableResult,\n} from \"./draggable\"\n\nexport { Droppable, useDroppable } from \"./droppable\"\n\nexport { clamp, listToObject, objectMove } from \"./order\"\n\nexport {\n  Sortable,\n  SortableItem,\n  useSortable,\n  useSortableList,\n} from \"./sortable\"\n\nexport {\n  DraggableState,\n  HorizontalScrollDirection,\n  ScrollDirection,\n  SortableDirection,\n  type AnimationFunction,\n  type CollisionAlgorithm,\n  type DraggableHandleProps,\n  type DraggableProps,\n  type DropAlignment,\n  type DroppableProps,\n  type DroppedItemsMap,\n  type DropOffset,\n  type DropProviderProps,\n  type DropProviderRef,\n  type SharedValueLike,\n  type SortableData,\n  type SortableHandleProps,\n  type SortableItemProps,\n  type SortableProps,\n  type SortableRenderItemProps,\n  type UseDraggableOptions,\n  type UseDraggableReturn,\n  type UseDroppableOptions,\n  type UseDroppableReturn,\n  type UseSortableListOptions,\n  type UseSortableListReturn,\n  type UseSortableOptions,\n  type UseSortableReturn,\n} from \"./types\"\n\n// Upstream exports these from `components/sortableUtils`; they are worklet\n// helpers there, plain functions here. `setPosition` and `setAutoScroll`\n// mutate a SharedValue during a UI-thread gesture — there is no gesture on\n// the UI thread here, so they would have nothing to drive and are NOT\n// re-exported. An app that imported them was reaching into upstream's\n// internals; the build failing at that import is the correct outcome.\n"]}

package/dist/dnd/order.d.ts

@@ -0,0 +1,7 @@
+import type { SortableData } from "./types";
+/** `["a", "b"]` → `{ a: 0, b: 1 }`. Upstream's takes objects with an `id`;
+ *  both shapes are accepted so no call site has to convert. */
+export declare const listToObject: (items: readonly (string | SortableData)[]) => Record<string, number>;
+/** Moves the entry at `from` to `to`, returning a new position map. */
+export declare const objectMove: (positions: Record<string, number>, from: number, to: number) => Record<string, number>;
+export declare const clamp: (value: number, lower: number, upper: number) => number;

package/dist/dnd/order.js

@@ -0,0 +1,20 @@
+/** `["a", "b"]` → `{ a: 0, b: 1 }`. Upstream's takes objects with an `id`;
+ *  both shapes are accepted so no call site has to convert. */
+export const listToObject = (items) => {
+    const result = {};
+    items.forEach((item, index) => {
+        result[typeof item === "string" ? item : item.id] = index;
+    });
+    return result;
+};
+/** Moves the entry at `from` to `to`, returning a new position map. */
+export const objectMove = (positions, from, to) => {
+    const ids = Object.keys(positions).sort((a, b) => (positions[a] ?? 0) - (positions[b] ?? 0));
+    const [moved] = ids.splice(from, 1);
+    if (moved !== undefined) {
+        ids.splice(to, 0, moved);
+    }
+    return listToObject(ids);
+};
+export const clamp = (value, lower, upper) => Math.min(Math.max(value, lower), upper);
+//# sourceMappingURL=order.js.map

package/dist/dnd/order.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order.js","sourceRoot":"","sources":["../../src/dnd/order.ts"],"names":[],"mappings":"AASA;+DAC+D;AAC/D,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,KAAyC,EACjB,EAAE;IAC1B,MAAM,MAAM,GAA2B,EAAE,CAAA;IACzC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;QAC5B,MAAM,CAAC,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,KAAK,CAAA;IAC3D,CAAC,CAAC,CAAA;IACF,OAAO,MAAM,CAAA;AACf,CAAC,CAAA;AAED,uEAAuE;AACvE,MAAM,CAAC,MAAM,UAAU,GAAG,CACxB,SAAiC,EACjC,IAAY,EACZ,EAAU,EACc,EAAE;IAC1B,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,CACrC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CACpD,CAAA;IACD,MAAM,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC,CAAA;IACnC,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACxB,GAAG,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,EAAE,KAAK,CAAC,CAAA;IAC1B,CAAC;IACD,OAAO,YAAY,CAAC,GAAG,CAAC,CAAA;AAC1B,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,KAAa,EAAE,KAAa,EAAE,KAAa,EAAU,EAAE,CAC3E,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,EAAE,KAAK,CAAC,CAAA","sourcesContent":["// The order arithmetic, kept free of every GTK import.\n//\n// Upstream's equivalents live in `components/sortableUtils` and are worklets;\n// here they are plain functions, and they are in their own module so the unit\n// test project — which has no GTK runtime — can import them. `sortable.tsx`\n// re-exports them, so an app still imports them from the subpath root exactly\n// as it does upstream.\nimport type { SortableData } from \"./types\"\n\n/** `[\"a\", \"b\"]` → `{ a: 0, b: 1 }`. Upstream's takes objects with an `id`;\n *  both shapes are accepted so no call site has to convert. */\nexport const listToObject = (\n  items: readonly (string | SortableData)[],\n): Record<string, number> => {\n  const result: Record<string, number> = {}\n  items.forEach((item, index) => {\n    result[typeof item === \"string\" ? item : item.id] = index\n  })\n  return result\n}\n\n/** Moves the entry at `from` to `to`, returning a new position map. */\nexport const objectMove = (\n  positions: Record<string, number>,\n  from: number,\n  to: number,\n): Record<string, number> => {\n  const ids = Object.keys(positions).sort(\n    (a, b) => (positions[a] ?? 0) - (positions[b] ?? 0),\n  )\n  const [moved] = ids.splice(from, 1)\n  if (moved !== undefined) {\n    ids.splice(to, 0, moved)\n  }\n  return listToObject(ids)\n}\n\nexport const clamp = (value: number, lower: number, upper: number): number =>\n  Math.min(Math.max(value, lower), upper)\n"]}

package/dist/dnd/payload.d.ts

@@ -0,0 +1,14 @@
+/** Draggables and droppables that are not part of a `Sortable`. */
+export declare const FREE_SCOPE = "free";
+export type DragPayload = {
+    scope: string;
+    id: string;
+};
+/** `rngtkx-dnd/<scope>/<id>` — the id may itself contain slashes, so only
+ *  the first two separators are structural. */
+export declare const encodePayload: ({ scope, id }: DragPayload) => string;
+export declare const decodePayload: (raw: string | null) => DragPayload | null;
+/** Upstream generates `draggable-<random>` when no `draggableId` is given.
+ *  A counter rather than `Math.random()` so two ids can never collide and a
+ *  test can read them. */
+export declare const nextDraggableId: () => string;

package/dist/dnd/payload.js

@@ -0,0 +1,41 @@
+// What actually crosses GDK during a drag.
+//
+// A GdkContentProvider carries a GValue of a negotiated type, not arbitrary
+// JavaScript — so a `Draggable`'s `data` (an object, a closure, anything)
+// cannot travel on the wire. What travels is a STRING that names the drag:
+// the scope it belongs to and the draggable's id. The `data` itself stays in
+// the provider's own registry on the JS side and is looked up on drop.
+//
+// The consequence worth knowing: a drop that arrives from ANOTHER process
+// carries a string this module did not write, so it resolves to no data and
+// is refused. Cross-application drops are a real capability of the layer
+// underneath (see docs/research/drag-and-drop.md) but they are not what the
+// mirrored API describes, so they are not silently mapped onto it.
+/** Prefix, so a string dragged in from a text editor is never mistaken for
+ *  one of ours. */
+const MARK = "rngtkx-dnd";
+/** Draggables and droppables that are not part of a `Sortable`. */
+export const FREE_SCOPE = "free";
+/** `rngtkx-dnd/<scope>/<id>` — the id may itself contain slashes, so only
+ *  the first two separators are structural. */
+export const encodePayload = ({ scope, id }) => `${MARK}/${scope}/${id}`;
+export const decodePayload = (raw) => {
+    if (!raw) {
+        return null;
+    }
+    const first = raw.indexOf("/");
+    if (first === -1 || raw.slice(0, first) !== MARK) {
+        return null;
+    }
+    const second = raw.indexOf("/", first + 1);
+    if (second === -1) {
+        return null;
+    }
+    return { scope: raw.slice(first + 1, second), id: raw.slice(second + 1) };
+};
+let counter = 0;
+/** Upstream generates `draggable-<random>` when no `draggableId` is given.
+ *  A counter rather than `Math.random()` so two ids can never collide and a
+ *  test can read them. */
+export const nextDraggableId = () => `draggable-${++counter}`;
+//# sourceMappingURL=payload.js.map

package/dist/dnd/payload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"payload.js","sourceRoot":"","sources":["../../src/dnd/payload.ts"],"names":[],"mappings":"AAAA,2CAA2C;AAC3C,EAAE;AACF,4EAA4E;AAC5E,0EAA0E;AAC1E,2EAA2E;AAC3E,6EAA6E;AAC7E,uEAAuE;AACvE,EAAE;AACF,0EAA0E;AAC1E,4EAA4E;AAC5E,yEAAyE;AACzE,4EAA4E;AAC5E,mEAAmE;AAEnE;mBACmB;AACnB,MAAM,IAAI,GAAG,YAAY,CAAA;AAEzB,mEAAmE;AACnE,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAA;AAIhC;+CAC+C;AAC/C,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,KAAK,EAAE,EAAE,EAAe,EAAU,EAAE,CAClE,GAAG,IAAI,IAAI,KAAK,IAAI,EAAE,EAAE,CAAA;AAE1B,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,GAAkB,EAAsB,EAAE;IACtE,IAAI,CAAC,GAAG,EAAE,CAAC;QACT,OAAO,IAAI,CAAA;IACb,CAAC;IACD,MAAM,KAAK,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,CAAA;IAC9B,IAAI,KAAK,KAAK,CAAC,CAAC,IAAI,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC;QACjD,OAAO,IAAI,CAAA;IACb,CAAC;IACD,MAAM,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC,GAAG,EAAE,KAAK,GAAG,CAAC,CAAC,CAAA;IAC1C,IAAI,MAAM,KAAK,CAAC,CAAC,EAAE,CAAC;QAClB,OAAO,IAAI,CAAA;IACb,CAAC;IACD,OAAO,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,EAAE,MAAM,CAAC,EAAE,EAAE,EAAE,GAAG,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,CAAA;AAC3E,CAAC,CAAA;AAED,IAAI,OAAO,GAAG,CAAC,CAAA;AAEf;;0BAE0B;AAC1B,MAAM,CAAC,MAAM,eAAe,GAAG,GAAW,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,CAAA","sourcesContent":["// What actually crosses GDK during a drag.\n//\n// A GdkContentProvider carries a GValue of a negotiated type, not arbitrary\n// JavaScript — so a `Draggable`'s `data` (an object, a closure, anything)\n// cannot travel on the wire. What travels is a STRING that names the drag:\n// the scope it belongs to and the draggable's id. The `data` itself stays in\n// the provider's own registry on the JS side and is looked up on drop.\n//\n// The consequence worth knowing: a drop that arrives from ANOTHER process\n// carries a string this module did not write, so it resolves to no data and\n// is refused. Cross-application drops are a real capability of the layer\n// underneath (see docs/research/drag-and-drop.md) but they are not what the\n// mirrored API describes, so they are not silently mapped onto it.\n\n/** Prefix, so a string dragged in from a text editor is never mistaken for\n *  one of ours. */\nconst MARK = \"rngtkx-dnd\"\n\n/** Draggables and droppables that are not part of a `Sortable`. */\nexport const FREE_SCOPE = \"free\"\n\nexport type DragPayload = { scope: string; id: string }\n\n/** `rngtkx-dnd/<scope>/<id>` — the id may itself contain slashes, so only\n *  the first two separators are structural. */\nexport const encodePayload = ({ scope, id }: DragPayload): string =>\n  `${MARK}/${scope}/${id}`\n\nexport const decodePayload = (raw: string | null): DragPayload | null => {\n  if (!raw) {\n    return null\n  }\n  const first = raw.indexOf(\"/\")\n  if (first === -1 || raw.slice(0, first) !== MARK) {\n    return null\n  }\n  const second = raw.indexOf(\"/\", first + 1)\n  if (second === -1) {\n    return null\n  }\n  return { scope: raw.slice(first + 1, second), id: raw.slice(second + 1) }\n}\n\nlet counter = 0\n\n/** Upstream generates `draggable-<random>` when no `draggableId` is given.\n *  A counter rather than `Math.random()` so two ids can never collide and a\n *  test can read them. */\nexport const nextDraggableId = (): string => `draggable-${++counter}`\n"]}

package/dist/dnd/sortable.d.ts

@@ -0,0 +1,49 @@
+import { type ReactNode } from "react";
+import { type SortableData, type SortableItemProps, type SortableProps, type UseSortableListOptions, type UseSortableListReturn, type UseSortableOptions, type UseSortableReturn } from "./types";
+export { clamp, listToObject, objectMove } from "./order";
+/**
+ * Owns the order of a sortable list, for an app rendering its own container.
+ *
+ * **The order half only.** Upstream's rows get their drag wiring through the
+ * props `getItemProps` hands them; here it travels in context, which only
+ * `Sortable` provides — so rows still have to be inside a `Sortable`, and a
+ * `SortableItem` outside one throws rather than quietly not dragging. This
+ * hook is for reading the order and the `SharedValueLike` boxes, which is
+ * what most callers of it actually want.
+ */
+export declare const useSortableList: <TData extends SortableData>(options: UseSortableListOptions<TData>) => UseSortableListReturn<TData>;
+/**
+ * A list whose rows reorder by dragging.
+ *
+ * ```tsx
+ * <Sortable
+ *   data={tasks}
+ *   onDrop={(id, position, all) => save(all)}
+ *   renderItem={({ item, id, ...rest }) => (
+ *     <SortableItem key={id} id={id} data={item} {...rest}>
+ *       <View style={styles.row}>
+ *         <Text>{item.title}</Text>
+ *         <SortableItem.Handle>
+ *           <Text>⠿</Text>
+ *         </SortableItem.Handle>
+ *       </View>
+ *     </SortableItem>
+ *   )}
+ * />
+ * ```
+ *
+ * The rows carry a real GTK drag icon — a picture of the row itself, lifted
+ * at the point it was grabbed — and the list rearranges live underneath it.
+ */
+export declare const Sortable: <TData extends SortableData>({ data, renderItem, itemKeyExtractor, style, contentContainerStyle, testID, direction, onMove, onDragStart, onDrop, onDragging, }: SortableProps<TData>) => ReactNode;
+/**
+ * The reorder half of the module, as a hook, for a row that owns its own
+ * view. Render `children` inside that view.
+ */
+export declare const useSortable: <TData>(options: UseSortableOptions<TData>) => UseSortableReturn;
+/** One row of a {@link Sortable}. Both a drag source and a drop target: the
+ *  row you drag onto is the position the dragged row takes. */
+export declare const SortableItem: {
+    <TData>({ id, data, children, style, animatedStyle, testID, onMove, onDragStart, onDrop, onDragging, }: SortableItemProps<TData>): ReactNode;
+    Handle: ({ children, style, testID, }: import("./types").DraggableHandleProps) => ReactNode;
+};