@hanzogui/native 2.0.0

package/src/setup-teleport.ts

@@ -0,0 +1,36 @@
+/**
+ * Setup native portal support for Gui.
+ *
+ * Simply import this module at the top of your app entry point:
+ *
+ * @example
+ * ```tsx
+ * import '@hanzogui/native/setup-teleport'
+ * ```
+ *
+ * This automatically detects and configures react-native-teleport for portals.
+ * Falls back to legacy RN shims if teleport is not installed.
+ */
+
+import { getPortal } from './portalState'
+
+function setup(): void {
+  const g = globalThis as any
+  if (g.__gui_native_portal_setup) return
+  g.__gui_native_portal_setup = true
+
+  // try teleport first (preferred)
+  try {
+    const teleport = require('react-native-teleport')
+    if (teleport?.Portal && teleport?.PortalHost && teleport?.PortalProvider) {
+      g.__gui_teleport = teleport
+      getPortal().set({ enabled: true, type: 'teleport' })
+      return
+    }
+  } catch {
+    // react-native-teleport not installed, that's ok
+  }
+}
+
+// run setup immediately on import
+setup()

package/src/setup-worklets.ts

@@ -0,0 +1,49 @@
+/**
+ * Setup worklets for Hanzo GUI native components.
+ *
+ * Simply import this module at the top of your app entry point:
+ *
+ * @example
+ * ```tsx
+ * import '@hanzogui/native/setup-worklets'
+ * ```
+ *
+ * This automatically detects and configures react-native-worklets-core
+ * for use with Sheet and other components that benefit from synchronous
+ * native-thread execution.
+ *
+ * When combined with setup-gesture-handler, Sheet gets native-quality
+ * gesture coordination between sheet dragging and scroll views.
+ *
+ * @see https://docs.swmansion.com/react-native-worklets/docs/
+ */
+
+import { getWorklets } from './workletsState'
+
+function setup() {
+  const g = globalThis as any
+  if (g.__gui_native_worklets_setup_complete) {
+    return
+  }
+  g.__gui_native_worklets_setup_complete = true
+
+  try {
+    // dynamically require worklets-core
+    const worklets = require('react-native-worklets-core')
+
+    if (worklets) {
+      getWorklets().set({
+        enabled: true,
+        Worklets: worklets.Worklets,
+        useRunOnJS: worklets.useRunOnJS,
+        useWorklet: worklets.useWorklet,
+        createWorkletContextValue: worklets.createWorkletContextValue,
+      })
+    }
+  } catch {
+    // worklets not available, that's fine - will fall back to JS thread
+  }
+}
+
+// run setup immediately on import
+setup()

package/src/setup-zeego.ts

@@ -0,0 +1,42 @@
+/**
+ * Setup zeego for Hanzo GUI native menus.
+ *
+ * Simply import this module at the top of your app entry point:
+ *
+ * @example
+ * ```tsx
+ * import '@hanzogui/native/setup-zeego'
+ * ```
+ *
+ * This automatically detects and configures zeego for use with
+ * Menu and ContextMenu native mode.
+ */
+
+import { getZeego } from './zeegoState'
+
+function setup(): void {
+  const g = globalThis as any
+  if (g.__gui_native_zeego_setup) return
+  g.__gui_native_zeego_setup = true
+
+  try {
+    const DropdownMenu = require('zeego/dropdown-menu')
+    const ContextMenu = require('zeego/context-menu')
+
+    if (DropdownMenu && ContextMenu) {
+      getZeego().set({
+        enabled: true,
+        DropdownMenu,
+        ContextMenu,
+      })
+    }
+  } catch (err) {
+    if (process.env.NODE_ENV === 'development') {
+      console.warn(`Error setting up Zeego`, err)
+    }
+    // zeego not installed
+  }
+}
+
+// run setup immediately on import
+setup()

package/src/types.ts

@@ -0,0 +1,88 @@
+import type { ReactNode } from 'react'
+
+export type NativePortalState = {
+  enabled: boolean
+  type: 'teleport' | 'legacy' | null
+}
+
+export interface GestureState {
+  enabled: boolean
+  Gesture: any
+  GestureDetector: any
+  ScrollView: any
+}
+
+export interface WorkletsState {
+  enabled: boolean
+  Worklets: any
+  useRunOnJS: any
+  useWorklet: any
+  createWorkletContextValue: any
+}
+
+export interface SafeAreaInsets {
+  top: number
+  right: number
+  bottom: number
+  left: number
+}
+
+export interface SafeAreaFrame {
+  x: number
+  y: number
+  width: number
+  height: number
+}
+
+export interface SafeAreaMetrics {
+  insets: SafeAreaInsets
+  frame: SafeAreaFrame
+}
+
+export interface SafeAreaState {
+  enabled: boolean
+  useSafeAreaInsets: (() => SafeAreaInsets) | null
+  useSafeAreaFrame: (() => SafeAreaFrame) | null
+  initialMetrics: SafeAreaMetrics | null
+}
+
+export type NativePortalProps = {
+  hostName?: string
+  children: ReactNode
+}
+
+export type NativePortalHostProps = {
+  name: string
+}
+
+export type NativePortalProviderProps = {
+  children: ReactNode
+}
+
+export interface LinearGradientState {
+  enabled: boolean
+  Component: any
+}
+
+export interface ZeegoState {
+  enabled: boolean
+  DropdownMenu: any
+  ContextMenu: any
+}
+
+export interface BurntState {
+  enabled: boolean
+  toast: ((options: any) => void) | null
+  dismissAllAlerts: (() => void) | null
+}
+
+export interface KeyboardControllerState {
+  enabled: boolean
+  KeyboardProvider: any
+  KeyboardAwareScrollView: any
+  useKeyboardHandler: any
+  useReanimatedKeyboardAnimation: any
+  KeyboardController: any
+  KeyboardEvents: any
+  KeyboardStickyView: any
+}

package/src/workletsState.ts

@@ -0,0 +1,30 @@
+import { createGlobalState } from './globalState'
+import type { WorkletsState } from './types'
+
+const state = createGlobalState<WorkletsState>(`worklets`, {
+  enabled: false,
+  Worklets: null,
+  useRunOnJS: null,
+  useWorklet: null,
+  createWorkletContextValue: null,
+})
+
+export interface WorkletsAccessor {
+  readonly isEnabled: boolean
+  readonly state: WorkletsState
+  set(updates: Partial<WorkletsState>): void
+}
+
+export function getWorklets(): WorkletsAccessor {
+  return {
+    get isEnabled(): boolean {
+      return state.get().enabled
+    },
+    get state(): WorkletsState {
+      return state.get()
+    },
+    set(updates: Partial<WorkletsState>): void {
+      Object.assign(state.get(), updates)
+    },
+  }
+}

package/src/zeegoState.ts

@@ -0,0 +1,28 @@
+import { createGlobalState } from './globalState'
+import type { ZeegoState } from './types'
+
+const state = createGlobalState<ZeegoState>(`zeego`, {
+  enabled: false,
+  DropdownMenu: null,
+  ContextMenu: null,
+})
+
+export interface ZeegoAccessor {
+  readonly isEnabled: boolean
+  readonly state: ZeegoState
+  set(newState: ZeegoState): void
+}
+
+export function getZeego(): ZeegoAccessor {
+  return {
+    get isEnabled(): boolean {
+      return state.get().enabled
+    },
+    get state(): ZeegoState {
+      return state.get()
+    },
+    set(newState: ZeegoState): void {
+      state.set(newState)
+    },
+  }
+}

package/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "extends": "../../../tsconfig.json",
+  "compilerOptions": {
+    "composite": true,
+    "isolatedDeclarations": true
+  },
+  "exclude": [
+    "types",
+    "dist",
+    "**/__tests__"
+  ]
+}

package/types/burntState.d.ts

@@ -0,0 +1,9 @@
+import type { BurntState } from "./types";
+export interface BurntAccessor {
+	readonly isEnabled: boolean;
+	readonly state: BurntState;
+	set(newState: BurntState): void;
+}
+export declare function getBurnt(): BurntAccessor;
+
+//# sourceMappingURL=burntState.d.ts.map

package/types/components.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from "react";
+import type { NativePortalProps, NativePortalHostProps, NativePortalProviderProps } from "./types";
+export type { NativePortalProps, NativePortalHostProps, NativePortalProviderProps };
+/**
+* Renders children into a teleport Portal when available.
+* Returns null when teleport is not set up (allows fallback handling by caller).
+*/
+export declare function NativePortal({ hostName, children }: NativePortalProps): ReactNode;
+/**
+* Renders a teleport PortalHost when available.
+* Returns null when teleport is not set up.
+*/
+export declare function NativePortalHost({ name }: NativePortalHostProps): ReactNode;
+/**
+* Wraps children with teleport PortalProvider when available.
+* Returns children as-is when teleport is not set up.
+*/
+export declare function NativePortalProvider({ children }: NativePortalProviderProps): ReactNode;
+
+//# sourceMappingURL=components.d.ts.map

package/types/gestureState.d.ts

@@ -0,0 +1,25 @@
+import type { GestureState } from "./types";
+export interface Insets {
+	top?: number;
+	left?: number;
+	bottom?: number;
+	right?: number;
+}
+export type PressGestureConfig = {
+	onPressIn?: (e: any) => void;
+	onPressOut?: (e: any) => void;
+	onPress?: (e: any) => void;
+	onLongPress?: (e: any) => void;
+	delayLongPress?: number;
+	hitSlop?: number | Insets | null;
+};
+export interface GestureHandlerAccessor {
+	readonly isEnabled: boolean;
+	readonly state: GestureState;
+	set(updates: Partial<GestureState>): void;
+	disable(): void;
+	createPressGesture(config: PressGestureConfig): any;
+}
+export declare function getGestureHandler(): GestureHandlerAccessor;
+
+//# sourceMappingURL=gestureState.d.ts.map

package/types/globalState.d.ts

@@ -0,0 +1,8 @@
+export declare function createGlobalState<T extends {
+	enabled: boolean;
+}>(key: string, defaultValue: T): {
+	get: () => T;
+	set: (next: T) => void;
+};
+
+//# sourceMappingURL=globalState.d.ts.map

package/types/index.d.ts

@@ -0,0 +1,41 @@
+/**
+* @hanzogui/native
+*
+* Native setup modules for Gui. Import these at the top of your app entry point.
+*
+* @example
+* ```tsx
+* // In your app entry (index.js or App.tsx)
+* import '@hanzogui/native/setup-teleport'
+* import '@hanzogui/native/setup-gesture-handler'
+* import '@hanzogui/native/setup-worklets'
+* import '@hanzogui/native/setup-safe-area'
+* import '@hanzogui/native/expo-linear-gradient'
+* import '@hanzogui/native/setup-keyboard-controller'
+*
+* // Then use Hanzo GUI components normally
+* // Sheet will automatically use native gestures when available
+* // LinearGradient will use expo-linear-gradient when installed
+* ```
+*/
+export type { NativePortalState, GestureState, WorkletsState, SafeAreaState, SafeAreaInsets, SafeAreaFrame, SafeAreaMetrics, LinearGradientState, ZeegoState, BurntState, NativePortalProps, NativePortalHostProps, NativePortalProviderProps } from "./types";
+export { getPortal } from "./portalState";
+export type { PortalAccessor } from "./portalState";
+export { getGestureHandler } from "./gestureState";
+export type { GestureHandlerAccessor, PressGestureConfig } from "./gestureState";
+export { getWorklets } from "./workletsState";
+export type { WorkletsAccessor } from "./workletsState";
+export { getSafeArea } from "./safeAreaState";
+export type { SafeAreaAccessor } from "./safeAreaState";
+export { getLinearGradient } from "./linearGradientState";
+export type { LinearGradientAccessor } from "./linearGradientState";
+export { isKeyboardControllerEnabled, getKeyboardControllerState, setKeyboardControllerState } from "./keyboardControllerState";
+export type { KeyboardControllerState } from "./keyboardControllerState";
+export { getZeego } from "./zeegoState";
+export type { ZeegoAccessor } from "./zeegoState";
+export { NativeMenuContext } from "./nativeMenuContext";
+export { getBurnt } from "./burntState";
+export type { BurntAccessor } from "./burntState";
+export { NativePortal, NativePortalHost, NativePortalProvider } from "./components";
+
+//# sourceMappingURL=index.d.ts.map

package/types/keyboardControllerState.d.ts

@@ -0,0 +1,7 @@
+import type { KeyboardControllerState } from "./types";
+export type { KeyboardControllerState };
+export declare function isKeyboardControllerEnabled(): boolean;
+export declare function getKeyboardControllerState(): KeyboardControllerState;
+export declare function setKeyboardControllerState(updates: Partial<KeyboardControllerState>): void;
+
+//# sourceMappingURL=keyboardControllerState.d.ts.map

package/types/linearGradientState.d.ts

@@ -0,0 +1,9 @@
+import type { LinearGradientState } from "./types";
+export interface LinearGradientAccessor {
+	readonly isEnabled: boolean;
+	readonly state: LinearGradientState;
+	set(newState: LinearGradientState): void;
+}
+export declare function getLinearGradient(): LinearGradientAccessor;
+
+//# sourceMappingURL=linearGradientState.d.ts.map

package/types/nativeMenuContext.d.ts

@@ -0,0 +1,4 @@
+import type React from "react";
+export declare const NativeMenuContext: React.Context<boolean>;
+
+//# sourceMappingURL=nativeMenuContext.d.ts.map

package/types/portalState.d.ts

@@ -0,0 +1,9 @@
+import type { NativePortalState } from "./types";
+export interface PortalAccessor {
+	readonly isEnabled: boolean;
+	readonly state: NativePortalState;
+	set(newState: NativePortalState): void;
+}
+export declare function getPortal(): PortalAccessor;
+
+//# sourceMappingURL=portalState.d.ts.map

package/types/safeAreaState.d.ts

@@ -0,0 +1,13 @@
+import type { SafeAreaState, SafeAreaInsets, SafeAreaFrame } from "./types";
+export interface SafeAreaAccessor {
+	readonly isEnabled: boolean;
+	readonly state: SafeAreaState;
+	set(updates: Partial<SafeAreaState>): void;
+	/** Get initial insets (non-reactive, for style resolution) */
+	getInsets(): SafeAreaInsets;
+	/** Get initial frame (non-reactive) */
+	getFrame(): SafeAreaFrame;
+}
+export declare function getSafeArea(): SafeAreaAccessor;
+
+//# sourceMappingURL=safeAreaState.d.ts.map

package/types/setup-burnt.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-burnt.d.ts.map

package/types/setup-expo-linear-gradient.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-expo-linear-gradient.d.ts.map

package/types/setup-gesture-handler.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-gesture-handler.d.ts.map

package/types/setup-keyboard-controller.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-keyboard-controller.d.ts.map

package/types/setup-keyboard-controller.web.d.ts

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=setup-keyboard-controller.web.d.ts.map

package/types/setup-safe-area.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-safe-area.d.ts.map

package/types/setup-teleport.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-teleport.d.ts.map

package/types/setup-worklets.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-worklets.d.ts.map

package/types/setup-zeego.d.ts

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=setup-zeego.d.ts.map

package/types/types.d.ts

@@ -0,0 +1,76 @@
+import type { ReactNode } from "react";
+export type NativePortalState = {
+	enabled: boolean;
+	type: "teleport" | "legacy" | null;
+};
+export interface GestureState {
+	enabled: boolean;
+	Gesture: any;
+	GestureDetector: any;
+	ScrollView: any;
+}
+export interface WorkletsState {
+	enabled: boolean;
+	Worklets: any;
+	useRunOnJS: any;
+	useWorklet: any;
+	createWorkletContextValue: any;
+}
+export interface SafeAreaInsets {
+	top: number;
+	right: number;
+	bottom: number;
+	left: number;
+}
+export interface SafeAreaFrame {
+	x: number;
+	y: number;
+	width: number;
+	height: number;
+}
+export interface SafeAreaMetrics {
+	insets: SafeAreaInsets;
+	frame: SafeAreaFrame;
+}
+export interface SafeAreaState {
+	enabled: boolean;
+	useSafeAreaInsets: (() => SafeAreaInsets) | null;
+	useSafeAreaFrame: (() => SafeAreaFrame) | null;
+	initialMetrics: SafeAreaMetrics | null;
+}
+export type NativePortalProps = {
+	hostName?: string;
+	children: ReactNode;
+};
+export type NativePortalHostProps = {
+	name: string;
+};
+export type NativePortalProviderProps = {
+	children: ReactNode;
+};
+export interface LinearGradientState {
+	enabled: boolean;
+	Component: any;
+}
+export interface ZeegoState {
+	enabled: boolean;
+	DropdownMenu: any;
+	ContextMenu: any;
+}
+export interface BurntState {
+	enabled: boolean;
+	toast: ((options: any) => void) | null;
+	dismissAllAlerts: (() => void) | null;
+}
+export interface KeyboardControllerState {
+	enabled: boolean;
+	KeyboardProvider: any;
+	KeyboardAwareScrollView: any;
+	useKeyboardHandler: any;
+	useReanimatedKeyboardAnimation: any;
+	KeyboardController: any;
+	KeyboardEvents: any;
+	KeyboardStickyView: any;
+}
+
+//# sourceMappingURL=types.d.ts.map

package/types/workletsState.d.ts

@@ -0,0 +1,9 @@
+import type { WorkletsState } from "./types";
+export interface WorkletsAccessor {
+	readonly isEnabled: boolean;
+	readonly state: WorkletsState;
+	set(updates: Partial<WorkletsState>): void;
+}
+export declare function getWorklets(): WorkletsAccessor;
+
+//# sourceMappingURL=workletsState.d.ts.map

package/types/zeegoState.d.ts

@@ -0,0 +1,9 @@
+import type { ZeegoState } from "./types";
+export interface ZeegoAccessor {
+	readonly isEnabled: boolean;
+	readonly state: ZeegoState;
+	set(newState: ZeegoState): void;
+}
+export declare function getZeego(): ZeegoAccessor;
+
+//# sourceMappingURL=zeegoState.d.ts.map