0
# Windows APIs
1

2
Windows-specific APIs providing native platform integration, theme support, accessibility features, and enhanced system interaction capabilities unique to the Windows environment.
3

4
## Capabilities
5

6
### Theme & Appearance Management
7

8
#### AppTheme
9

10
Windows theme detection and high contrast support with real-time change notifications and color management.
11

12
```typescript { .api }
13
/**
14
 * Windows theme detection and high contrast support
15
 * Provides real-time theme changes and accessibility colors
16
 */
17
interface AppTheme {
18
  /** Current high contrast state */
19
  readonly isHighContrast: boolean;
20
  /** Current high contrast color values */
21
  readonly currentHighContrastColors: IHighContrastColors;
22

23
  /** Add listener for high contrast changes */
24
  addListener(
25
    eventName: 'highContrastChanged',
26
    listener: (event: IHighContrastChangedEvent) => void
27
  ): EmitterSubscription;
28

29
  /** Remove specific listener */
30
  removeListener(
31
    eventName: 'highContrastChanged',
32
    listener: (event: IHighContrastChangedEvent) => void
33
  ): void;
34
}
35

36
interface IHighContrastColors {
37
  /** Button face background color */
38
  ButtonFaceColor: string;
39
  /** Button text color */
40
  ButtonTextColor: string;
41
  /** Disabled/gray text color */
42
  GrayTextColor: string;
43
  /** Selection highlight background color */
44
  HighlightColor: string;
45
  /** Selection highlight text color */
46
  HighlightTextColor: string;
47
  /** Hyperlink color */
48
  HotlightColor: string;
49
  /** Window background color */
50
  WindowColor: string;
51
  /** Window text color */
52
  WindowTextColor: string;
53
}
54

55
interface IHighContrastChangedEvent {
56
  /** New high contrast state */
57
  isHighContrast: boolean;
58
  /** Updated high contrast colors */
59
  highContrastColors: IHighContrastColors;
60
}
61

62
interface EmitterSubscription {
63
  remove(): void;
64
}
65

66
declare const AppTheme: AppTheme;
67
```
68

69
**Usage Examples:**
70

71
```typescript
72
import React, { useState, useEffect } from 'react';
73
import { AppTheme } from 'react-native-windows';
74

75
const ThemeAwareComponent: React.FC = () => {
76
  const [isHighContrast, setIsHighContrast] = useState(AppTheme.isHighContrast);
77
  const [colors, setColors] = useState(AppTheme.currentHighContrastColors);
78

79
  useEffect(() => {
80
    const subscription = AppTheme.addListener('highContrastChanged', (event) => {
81
      setIsHighContrast(event.isHighContrast);
82
      setColors(event.highContrastColors);
83
    });
84

85
    return () => subscription.remove();
86
  }, []);
87

88
  const buttonStyle = {
89
    backgroundColor: isHighContrast ? colors.ButtonFaceColor : '#0078d4',
90
    color: isHighContrast ? colors.ButtonTextColor : 'white',
91
  };
92

93
  return (
94
    <View style={{ backgroundColor: isHighContrast ? colors.WindowColor : 'white' }}>
95
      <Text style={{ color: isHighContrast ? colors.WindowTextColor : 'black' }}>
96
        Theme-aware content
97
      </Text>
98
      <Button style={buttonStyle}>Accessible Button</Button>
99
    </View>
100
  );
101
};
102
```
103

104
#### Appearance
105

106
Cross-platform appearance and color scheme detection with Windows integration.
107

108
```typescript { .api }
109
/**
110
 * Cross-platform appearance detection with Windows integration
111
 * Detects system color scheme and theme preferences
112
 */
113
interface Appearance {
114
  /** Get current color scheme */
115
  getColorScheme(): 'light' | 'dark' | null;
116

117
  /** Add color scheme change listener */
118
  addChangeListener(
119
    listener: (preferences: { colorScheme: 'light' | 'dark' | null }) => void
120
  ): void;
121

122
  /** Remove color scheme change listener */
123
  removeChangeListener(
124
    listener: (preferences: { colorScheme: 'light' | 'dark' | null }) => void
125
  ): void;
126
}
127

128
declare const Appearance: Appearance;
129

130
/**
131
 * Hook for color scheme with automatic updates
132
 * Returns current color scheme and updates on changes
133
 */
134
function useColorScheme(): 'light' | 'dark' | null;
135
```
136

137
### System Integration APIs
138

139
#### I18nManager
140

141
Internationalization and RTL (Right-to-Left) support for Windows globalization.
142

143
```typescript { .api }
144
/**
145
 * Internationalization and RTL support
146
 * Handles Windows globalization and text direction
147
 */
148
interface I18nManager {
149
  /** Current RTL state */
150
  readonly isRTL: boolean;
151
  /** Force RTL layout */
152
  forceRTL(isRTL: boolean): void;
153
  /** Allow RTL layout */
154
  allowRTL(allowRTL: boolean): void;
155
  /** Swap left and right in RTL mode */
156
  swapLeftAndRightInRTL(flipStyles: boolean): void;
157
  /** Get locale constants */
158
  getConstants(): I18nConstants;
159
}
160

161
interface I18nConstants {
162
  isRTL: boolean;
163
  doLeftAndRightSwapInRTL: boolean;
164
  localeIdentifier?: string;
165
}
166

167
declare const I18nManager: I18nManager;
168
```
169

170
#### Settings
171

172
Windows-specific app settings management with registry and settings app integration.
173

174
```typescript { .api }
175
/**
176
 * Windows app settings management
177
 * Integrates with Windows settings and registry
178
 */
179
interface Settings {
180
  /** Get setting value */
181
  get(key: string): any;
182
  /** Set setting value */
183
  set(settings: { [key: string]: any }): void;
184
  /** Watch for setting changes */
185
  watchKeys(keys: string[], callback: () => void): number;
186
  /** Clear setting watch */
187
  clearWatch(watchId: number): void;
188
}
189

190
declare const Settings: Settings;
191
```
192

193
#### PermissionsAndroid
194

195
Android permission system compatibility layer for Windows (limited support).
196

197
```typescript { .api }
198
/**
199
 * Android permission compatibility (limited Windows support)
200
 * Provides consistent API across platforms
201
 */
202
interface PermissionsAndroid {
203
  /** Check permission status */
204
  check(permission: string): Promise<boolean>;
205
  /** Request permission */
206
  request(permission: string, rationale?: PermissionRationale): Promise<PermissionStatus>;
207
  /** Request multiple permissions */
208
  requestMultiple(permissions: string[]): Promise<{ [permission: string]: PermissionStatus }>;
209
  /** Permission constants */
210
  PERMISSIONS: { [key: string]: string };
211
  /** Results constants */
212
  RESULTS: {
213
    GRANTED: 'granted';
214
    DENIED: 'denied';
215
    NEVER_ASK_AGAIN: 'never_ask_again';
216
  };
217
}
218

219
interface PermissionRationale {
220
  title: string;
221
  message: string;
222
  buttonPositive?: string;
223
  buttonNegative?: string;
224
  buttonNeutral?: string;
225
}
226

227
type PermissionStatus = 'granted' | 'denied' | 'never_ask_again';
228

229
declare const PermissionsAndroid: PermissionsAndroid;
230
```
231

232
### Native Integration
233

234
#### TurboModuleRegistry
235

236
New architecture module system for high-performance native module integration.
237

238
```typescript { .api }
239
/**
240
 * New architecture module system for native integration
241
 * Provides high-performance bridge-less native modules
242
 */
243
interface TurboModuleRegistry {
244
  /** Get turbo module instance */
245
  get<T extends TurboModule>(name: string): T | null;
246
  /** Get enforcing turbo module instance */
247
  getEnforcing<T extends TurboModule>(name: string): T;
248
}
249

250
interface TurboModule {
251
  /** Module constants */
252
  getConstants(): { [key: string]: any };
253
}
254

255
declare const TurboModuleRegistry: TurboModuleRegistry;
256
```
257

258
#### UIManager
259

260
UI component management and native view operations.
261

262
```typescript { .api }
263
/**
264
 * UI component management and native view operations
265
 * Handles component registration and view manipulation
266
 */
267
interface UIManager {
268
  /** Get view manager config */
269
  getViewManagerConfig(viewManagerName: string): any;
270
  /** Measure view */
271
  measure(
272
    reactTag: number,
273
    callback: (x: number, y: number, width: number, height: number, pageX: number, pageY: number) => void
274
  ): void;
275
  /** Measure view in window */
276
  measureInWindow(
277
    reactTag: number,
278
    callback: (x: number, y: number, width: number, height: number) => void
279
  ): void;
280
  /** Measure layout */
281
  measureLayout(
282
    reactTag: number,
283
    ancestorReactTag: number,
284
    errorCallback: (error: any) => void,
285
    callback: (left: number, top: number, width: number, height: number) => void
286
  ): void;
287
  /** Focus text input */
288
  focus(reactTag: number): void;
289
  /** Blur text input */
290
  blur(reactTag: number): void;
291
  /** Find sub-view in */
292
  findSubviewIn(
293
    reactTag: number,
294
    point: [number, number],
295
    callback: (nativeViewTag: number, left: number, top: number, width: number, height: number) => void
296
  ): void;
297
  /** Dispatch view manager command */
298
  dispatchViewManagerCommand(
299
    reactTag: number,
300
    commandName: string,
301
    commandArgs?: any[]
302
  ): void;
303
  /** Set JS responder */
304
  setJSResponder(reactTag: number, blockNativeResponder: boolean): void;
305
  /** Clear JS responder */
306
  clearJSResponder(): void;
307
}
308

309
declare const UIManager: UIManager;
310
```
311

312
#### NativeModules
313

314
Access to registered native modules with Windows-specific module support.
315

316
```typescript { .api }
317
/**
318
 * Access to registered native modules
319
 * Provides Windows-specific native functionality
320
 */
321
interface NativeModules {
322
  /** Platform-specific native modules */
323
  [moduleName: string]: any;
324

325
  /** Core native modules always available */
326
  DeviceEventManager?: any;
327
  Timing?: any;
328
  AppState?: any;
329
  AsyncLocalStorage?: any;
330
  DeviceInfo?: any;
331
  ImageLoader?: any;
332
  NetworkingIOS?: any;
333
  PlatformConstants?: any;
334
  StatusBarManager?: any;
335
  Vibration?: any;
336
  WebSocketModule?: any;
337
}
338

339
declare const NativeModules: NativeModules;
340
```
341

342
### Event System
343

344
#### NativeEventEmitter
345

346
Native event emission system for cross-platform event handling.
347

348
```typescript { .api }
349
/**
350
 * Native event emission system
351
 * Provides cross-platform event handling with native modules
352
 */
353
class NativeEventEmitter {
354
  constructor(nativeModule?: any);
355

356
  /** Add event listener */
357
  addListener(
358
    eventType: string,
359
    listener: (...args: any[]) => void,
360
    context?: any
361
  ): EmitterSubscription;
362

363
  /** Remove listener */
364
  removeListener(eventType: string, listener: (...args: any[]) => void): void;
365

366
  /** Remove all listeners */
367
  removeAllListeners(eventType?: string): void;
368

369
  /** Emit event */
370
  emit(eventType: string, ...args: any[]): void;
371

372
  /** Get listener count */
373
  listenerCount(eventType: string): number;
374
}
375

376
declare const NativeEventEmitter: typeof NativeEventEmitter;
377
```
378

379
#### DeviceEventEmitter
380

381
Device-level event emission for hardware and system events.
382

383
```typescript { .api }
384
/**
385
 * Device-level event emission
386
 * Handles hardware and system events from Windows
387
 */
388
interface DeviceEventEmitter {
389
  /** Add event listener */
390
  addListener(
391
    eventType: string,
392
    listener: (...args: any[]) => void,
393
    context?: any
394
  ): EmitterSubscription;
395

396
  /** Remove specific listeners */
397
  removeListener(eventType: string, listener: (...args: any[]) => void): void;
398

399
  /** Remove all listeners */
400
  removeAllListeners(eventType?: string): void;
401

402
  /** Emit event */
403
  emit(eventType: string, ...args: any[]): void;
404
}
405

406
declare const DeviceEventEmitter: DeviceEventEmitter;
407
```
408

409
#### NativeAppEventEmitter
410

411
App-level native event emission for application-specific events.
412

413
```typescript { .api }
414
/**
415
 * App-level native event emission
416
 * Handles application-specific events from native code
417
 */
418
interface NativeAppEventEmitter {
419
  /** Add event listener */
420
  addListener(
421
    eventType: string,
422
    listener: (...args: any[]) => void,
423
    context?: any
424
  ): EmitterSubscription;
425

426
  /** Remove listeners */
427
  removeListener(eventType: string, listener: (...args: any[]) => void): void;
428

429
  /** Remove all listeners */
430
  removeAllListeners(eventType?: string): void;
431

432
  /** Emit event */
433
  emit(eventType: string, ...args: any[]): void;
434
}
435

436
declare const NativeAppEventEmitter: NativeAppEventEmitter;
437
```
438

439
### Performance & Debugging
440

441
#### Systrace
442

443
Performance tracing utilities for Windows performance analysis and optimization.
444

445
```typescript { .api }
446
/**
447
 * Performance tracing utilities
448
 * Windows performance analysis and optimization tools
449
 */
450
interface Systrace {
451
  /** Begin async event */
452
  beginAsyncEvent(profileName?: string): void;
453

454
  /** End async event */
455
  endAsyncEvent(profileName?: string): void;
456

457
  /** Begin event */
458
  beginEvent(profileName?: string, args?: any): void;
459

460
  /** End event */
461
  endEvent(): void;
462

463
  /** Counter event */
464
  counterEvent(profileName?: string, value?: number): void;
465

466
  /** Check if profiling enabled */
467
  isEnabled(): boolean;
468

469
  /** Measure function execution */
470
  measure(objName: string, fnName: string, func: Function): Function;
471

472
  /** Swizzle function with profiling */
473
  swizzleJSON(): void;
474

475
  /** Attach to relay profiling */
476
  attachToRelayProfiler(relayProfiler: any): void;
477
}
478

479
declare const Systrace: Systrace;
480
```
481

482
### Utility Functions
483

484
#### findNodeHandle
485

486
React component to native node handle mapping for direct native access.
487

488
```typescript { .api }
489
/**
490
 * React component to native node handle mapping
491
 * Enables direct native view access from React components
492
 */
493
function findNodeHandle(componentOrHandle: any): number | null;
494
```
495

496
#### unstable_batchedUpdates
497

498
React update batching for performance optimization.
499

500
```typescript { .api }
501
/**
502
 * React update batching for performance optimization
503
 * Groups multiple state updates into single render cycle
504
 */
505
function unstable_batchedUpdates<T>(
506
  callback: () => T,
507
  bookkeeping?: any
508
): T;
509
```
510

511
#### requireNativeComponent
512

513
Factory function for creating native component wrappers.
514

515
```typescript { .api }
516
/**
517
 * Factory for creating native component wrappers
518
 * Connects React components to native Windows views
519
 */
520
function requireNativeComponent<T = any>(
521
  viewName: string
522
): React.ComponentType<T>;
523
```
524

525
#### registerCallableModule
526

527
Register callable modules for native-to-JS communication.
528

529
```typescript { .api }
530
/**
531
 * Register callable modules for native-to-JS communication
532
 * Enables native code to call JavaScript functions
533
 */
534
function registerCallableModule(name: string, module: any): void;
535
```
536

537
### Context & State
538

539
#### RootTagContext
540

541
React context for accessing root component tags and hierarchy information.
542

543
```typescript { .api }
544
/**
545
 * React context for root component tags
546
 * Provides access to component hierarchy and native view tags
547
 */
548
interface RootTagContext {
549
  /** Current root tag */
550
  rootTag: number | null;
551
}
552

553
declare const RootTagContext: React.Context<RootTagContext>;
554
```
555

556
### Legacy and Compatibility APIs
557

558
#### Alert
559

560
Cross-platform alert dialog system with Windows native dialogs.
561

562
```typescript { .api }
563
/**
564
 * Cross-platform alert dialogs with Windows native integration
565
 * Provides consistent alert API across platforms
566
 */
567
interface Alert {
568
  /** Show alert dialog */
569
  alert(
570
    title?: string,
571
    message?: string,
572
    buttons?: AlertButton[],
573
    options?: AlertOptions
574
  ): void;
575

576
  /** Show prompt dialog */
577
  prompt(
578
    title?: string,
579
    message?: string,
580
    callbackOrButtons?: ((text: string) => void) | AlertButton[],
581
    type?: AlertType,
582
    defaultValue?: string,
583
    keyboardType?: string
584
  ): void;
585
}
586

587
interface AlertButton {
588
  text?: string;
589
  onPress?: (value?: string) => void;
590
  style?: 'default' | 'cancel' | 'destructive';
591
}
592

593
interface AlertOptions {
594
  cancelable?: boolean;
595
  onDismiss?: () => void;
596
}
597

598
type AlertType = 'default' | 'plain-text' | 'secure-text' | 'login-password';
599

600
declare const Alert: Alert;
601
```
602

603
#### ToastAndroid
604

605
Android toast compatibility layer for Windows notification display.
606

607
```typescript { .api }
608
/**
609
 * Android toast compatibility for Windows notifications
610
 * Provides consistent toast API across platforms
611
 */
612
interface ToastAndroid {
613
  /** Show toast message */
614
  show(message: string, duration: number): void;
615

616
  /** Show toast with gravity */
617
  showWithGravity(message: string, duration: number, gravity: number): void;
618

619
  /** Show toast with gravity and offset */
620
  showWithGravityAndOffset(
621
    message: string,
622
    duration: number,
623
    gravity: number,
624
    xOffset: number,
625
    yOffset: number
626
  ): void;
627

628
  /** Duration constants */
629
  SHORT: number;
630
  LONG: number;
631

632
  /** Gravity constants */
633
  TOP: number;
634
  BOTTOM: number;
635
  CENTER: number;
636
}
637

638
declare const ToastAndroid: ToastAndroid;
639
```
640

641
#### Networking
642

643
Network request utilities and XMLHttpRequest implementation.
644

645
```typescript { .api }
646
/**
647
 * Network request utilities and XMLHttpRequest implementation
648
 * Provides Windows-specific networking capabilities
649
 */
650
interface Networking {
651
  /** Send request */
652
  sendRequest(
653
    method: string,
654
    trackingName: string,
655
    url: string,
656
    headers: { [key: string]: string },
657
    data: string,
658
    responseType: string,
659
    incrementalUpdates: boolean,
660
    timeout: number,
661
    callback: (requestId: number) => void,
662
    withCredentials?: boolean
663
  ): void;
664

665
  /** Abort request */
666
  abortRequest(requestId: number): void;
667

668
  /** Clear cookies */
669
  clearCookies(callback: (result: boolean) => void): void;
670
}
671

672
declare const Networking: Networking;
673
```
674

675
## Types
676

677
```typescript { .api }
678
// Windows-specific type definitions
679
interface WindowsConstants {
680
  Version: string;
681
  Brand: string;
682
  Model: string;
683
  Manufacturer: string;
684
  isTV: boolean;
685
  isTesting: boolean;
686
}
687

688
// Event subscription interface
689
interface EventSubscription {
690
  /** Remove event listener */
691
  remove(): void;
692
}
693

694
// Native module interface
695
interface NativeModule {
696
  /** Module constants */
697
  getConstants?(): { [key: string]: any };
698
  /** Module methods accessible from JS */
699
  [methodName: string]: any;
700
}
701

702
// Turbo module base interface
703
interface TurboModule {
704
  /** Get module constants */
705
  getConstants(): { [key: string]: any };
706
}
707

708
// High contrast event data
709
interface HighContrastChangedEvent {
710
  isHighContrast: boolean;
711
  highContrastColors: IHighContrastColors;
712
}
713

714
// Windows color scheme
715
type WindowsColorScheme = 'light' | 'dark' | 'high-contrast';
716

717
// Platform-specific utilities
718
interface WindowsUtilities {
719
  /** Check if high contrast mode is enabled */
720
  isHighContrastEnabled(): boolean;
721
  /** Get Windows version */
722
  getWindowsVersion(): string;
723
  /** Get device family */
724
  getDeviceFamily(): 'Desktop' | 'Mobile' | 'Xbox' | 'IoT' | 'Team' | 'Holographic';
725
}
726
```
727

728
## Windows Integration Patterns
729

730
### High Contrast Support
731

732
```typescript
733
// Responsive to high contrast changes
734
useEffect(() => {
735
  const subscription = AppTheme.addListener('highContrastChanged', (event) => {
736
    // Update UI based on high contrast state
737
    updateUIForAccessibility(event.isHighContrast, event.highContrastColors);
738
  });
739

740
  return () => subscription.remove();
741
}, []);
742
```
743

744
### Theme-Aware Styling
745

746
```typescript
747
// Automatic theme adaptation
748
const getAdaptiveColors = () => {
749
  if (AppTheme.isHighContrast) {
750
    return {
751
      background: AppTheme.currentHighContrastColors.WindowColor,
752
      text: AppTheme.currentHighContrastColors.WindowTextColor,
753
      button: AppTheme.currentHighContrastColors.ButtonFaceColor,
754
    };
755
  }
756

757
  return useColorScheme() === 'dark'
758
    ? { background: '#333', text: 'white', button: '#555' }
759
    : { background: 'white', text: 'black', button: '#f0f0f0' };
760
};
761
```
762

763
### Native Module Integration
764

765
```typescript
766
// Custom native module access
767
const CustomNativeModule = NativeModules.CustomWindowsModule;
768

769
// Turbo module usage
770
const TurboCustomModule = TurboModuleRegistry.get<CustomTurboModule>('CustomModule');
771
```