react-native-showtime 0.0.2

package/LICENSE

@@ -0,0 +1,20 @@
+MIT License
+
+Copyright (c) 2026 Satyajit Sahoo
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,58 @@
+# react-native-showtime
+
+React Native wrapper for [ShowTime](https://github.com/KaneCheshire/ShowTime) — display touch indicators on iOS. Useful for recordings, demos, and presentations.
+
+ShowTime works by visualizing touches as they happen, with zero setup required.
+
+<img src="./demo.webp" alt="Demo" width="402" />
+
+## Installation
+
+```sh
+npm install react-native-showtime
+```
+
+## Usage
+
+ShowTime activates automatically once installed — no code is required to show touch indicators.
+
+To customize the touch indicators, call the `configure` with your desired options:
+
+```js
+import { configure } from 'react-native-showtime';
+
+configure({
+  enabled: 'always',
+  strokeColor: '#3699EC',
+  strokeWidth: 3,
+  size: 44,
+  disappearAnimation: 'standard',
+  disappearDelay: 0.2,
+  shouldShowMultipleTapCount: true,
+  shouldShowForce: true,
+});
+```
+
+## API
+
+### `configure(config)`
+
+Configures ShowTime's appearance and behavior. All options are optional.
+
+| Option                          | Type                                     | Default      | Description                                                                                                                       |
+| ------------------------------- | ---------------------------------------- | ------------ | --------------------------------------------------------------------------------------------------------------------------------- |
+| `enabled`                       | `'always' \| 'never' \| 'debugOnly'`     | `'always'`   | Whether ShowTime is enabled.                                                                                                      |
+| `fillColor`                     | `ColorValue \| 'auto'`                   | `'auto'`     | The fill (background) color of a visual touch. When set to `'auto'`, ShowTime automatically uses the stroke color with 50% alpha. |
+| `strokeColor`                   | `ColorValue`                             | `'#3699EC'`  | The color of the stroke (outline) of a visual touch.                                                                              |
+| `strokeWidth`                   | `number`                                 | `3`          | The width (thickness) of the stroke around a visual touch.                                                                        |
+| `size`                          | `number`                                 | `44`         | The size of a visual touch.                                                                                                       |
+| `disappearAnimation`            | `'standard' \| 'scaleDown' \| 'scaleUp'` | `'standard'` | The style of animation to use when a visual touch disappears.                                                                     |
+| `disappearDelay`                | `number`                                 | `0.2`        | The delay, in seconds, before the visual touch disappears after a touch ends.                                                     |
+| `shouldShowMultipleTapCount`    | `boolean`                                | `false`      | Whether visual touches should indicate a multiple tap (i.e. show a number 2 for a double tap).                                    |
+| `multipleTapCountTextColor`     | `ColorValue`                             | `'#000000'`  | The color of the text to use when showing multiple tap counts.                                                                    |
+| `shouldShowForce`               | `boolean`                                | `true`       | Whether visual touches should visually show how much force is applied.                                                            |
+| `shouldIgnoreApplePencilEvents` | `boolean`                                | `true`       | Whether touch events from Apple Pencil are ignored.                                                                               |
+
+## License
+
+MIT

package/RNShowTime.podspec

@@ -0,0 +1,22 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+
+Pod::Spec.new do |s|
+  s.name         = "RNShowTime"
+  s.version      = package["version"]
+  s.summary      = package["description"]
+  s.homepage     = package["homepage"]
+  s.license      = package["license"]
+  s.authors      = package["author"]
+
+  s.platforms    = { :ios => min_ios_version_supported }
+  s.source       = { :git => "https://github.com/satya164/react-native-showtime.git", :tag => "#{s.version}" }
+
+  s.source_files = "ios/**/*.{h,m,mm,swift,cpp}"
+  s.private_header_files = "ios/**/*.h"
+
+  s.dependency "ShowTime", "~> 2.5"
+
+  install_modules_dependencies(s)
+end

package/ios/RNShowTime.h

@@ -0,0 +1,5 @@
+#import <ShowTimeSpec/ShowTimeSpec.h>
+
+@interface RNShowTime : NSObject <NativeShowTimeSpec>
+
+@end

package/ios/RNShowTime.mm

@@ -0,0 +1,83 @@
+#import "RNShowTime.h"
+#if __has_include("RNShowTime/RNShowTime-Swift.h")
+#import "RNShowTime/RNShowTime-Swift.h"
+#else
+#import "RNShowTime-Swift.h"
+#endif
+#import <React/RCTConvert.h>
+
+@implementation RNShowTime
+
+RCT_EXPORT_MODULE(ShowTime)
+
+- (void)configure:(JS::NativeShowTime::NativeShowTimeOptions &)config {
+  const auto configCopy = config;
+
+  dispatch_async(dispatch_get_main_queue(), ^{
+    if (configCopy.enabled() != nil) {
+      [ShowTimeConfigHelper setEnabled:configCopy.enabled()];
+    }
+
+    if (configCopy.fillColorAuto().has_value() && configCopy.fillColorAuto().value()) {
+      [ShowTimeConfigHelper setFillColorAuto];
+    } else if (configCopy.fillColor().has_value()) {
+      UIColor *color = [RCTConvert UIColor:@(configCopy.fillColor().value())];
+
+      if (color != nil) {
+        [ShowTimeConfigHelper setFillColor:color];
+      }
+    }
+
+    if (configCopy.strokeColor().has_value()) {
+      UIColor *color = [RCTConvert UIColor:@(configCopy.strokeColor().value())];
+
+      if (color != nil) {
+        [ShowTimeConfigHelper setStrokeColor:color];
+      }
+    }
+
+    if (configCopy.strokeWidth().has_value()) {
+      [ShowTimeConfigHelper setStrokeWidth:configCopy.strokeWidth().value()];
+    }
+
+    if (configCopy.size().has_value()) {
+      [ShowTimeConfigHelper setSize:configCopy.size().value()];
+    }
+
+    if (configCopy.disappearAnimation() != nil) {
+      [ShowTimeConfigHelper setDisappearAnimation:configCopy.disappearAnimation()];
+    }
+
+    if (configCopy.disappearDelay().has_value()) {
+      [ShowTimeConfigHelper setDisappearDelay:configCopy.disappearDelay().value()];
+    }
+
+    if (configCopy.shouldShowMultipleTapCount().has_value()) {
+      [ShowTimeConfigHelper setShouldShowMultipleTapCount:configCopy.shouldShowMultipleTapCount().value()];
+    }
+
+    if (configCopy.multipleTapCountTextColor().has_value()) {
+      UIColor *color = [RCTConvert UIColor:@(configCopy.multipleTapCountTextColor().value())];
+
+      if (color != nil) {
+        [ShowTimeConfigHelper setMultipleTapCountTextColor:color];
+      }
+    }
+
+    if (configCopy.shouldShowForce().has_value()) {
+      [ShowTimeConfigHelper setShouldShowForce:configCopy.shouldShowForce().value()];
+    }
+
+    if (configCopy.shouldIgnoreApplePencilEvents().has_value()) {
+      [ShowTimeConfigHelper setShouldIgnoreApplePencilEvents:configCopy.shouldIgnoreApplePencilEvents().value()];
+    }
+  });
+}
+
+- (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:
+  (const facebook::react::ObjCTurboModule::InitParams &)params
+{
+  return std::make_shared<facebook::react::NativeShowTimeSpecJSI>(params);
+}
+
+@end

package/ios/ShowTimeConfigHelper.swift

@@ -0,0 +1,72 @@
+import ShowTime
+import UIKit
+
+@objc(ShowTimeConfigHelper)
+public class ShowTimeConfigHelper: NSObject {
+
+    @objc public static func setEnabled(_ value: String) {
+        switch value {
+        case "always":
+            ShowTime.enabled = .always
+        case "never":
+            ShowTime.enabled = .never
+        case "debugOnly":
+            ShowTime.enabled = .debugOnly
+        default:
+            break
+        }
+    }
+
+    @objc public static func setFillColorAuto() {
+        ShowTime.fillColor = .auto
+    }
+
+    @objc public static func setFillColor(_ color: UIColor) {
+        ShowTime.fillColor = color
+    }
+
+    @objc public static func setStrokeColor(_ color: UIColor) {
+        ShowTime.strokeColor = color
+    }
+
+    @objc public static func setStrokeWidth(_ width: CGFloat) {
+        ShowTime.strokeWidth = width
+    }
+
+    @objc public static func setSize(_ size: CGFloat) {
+        ShowTime.size = CGSize(width: size, height: size)
+    }
+
+    @objc public static func setDisappearAnimation(_ name: String) {
+        switch name {
+        case "standard":
+            ShowTime.disappearAnimation = .standard
+        case "scaleDown":
+            ShowTime.disappearAnimation = .scaleDown
+        case "scaleUp":
+            ShowTime.disappearAnimation = .scaleUp
+        default:
+            break
+        }
+    }
+
+    @objc public static func setDisappearDelay(_ delay: TimeInterval) {
+        ShowTime.disappearDelay = delay
+    }
+
+    @objc public static func setShouldShowMultipleTapCount(_ show: Bool) {
+        ShowTime.shouldShowMultipleTapCount = show
+    }
+
+    @objc public static func setMultipleTapCountTextColor(_ color: UIColor) {
+        ShowTime.multipleTapCountTextColor = color
+    }
+
+    @objc public static func setShouldShowForce(_ show: Bool) {
+        ShowTime.shouldShowForce = show
+    }
+
+    @objc public static func setShouldIgnoreApplePencilEvents(_ ignore: Bool) {
+        ShowTime.shouldIgnoreApplePencilEvents = ignore
+    }
+}

package/lib/module/NativeShowTime.js

@@ -0,0 +1,5 @@
+"use strict";
+
+import { TurboModuleRegistry } from 'react-native';
+export default TurboModuleRegistry.get('ShowTime');
+//# sourceMappingURL=NativeShowTime.js.map

package/lib/module/NativeShowTime.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["TurboModuleRegistry","get"],"sourceRoot":"../../src","sources":["NativeShowTime.ts"],"mappings":";;AAAA,SAASA,mBAAmB,QAA0B,cAAc;AAqBpE,eAAeA,mBAAmB,CAACC,GAAG,CAAO,UAAU,CAAC","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,49 @@
+"use strict";
+
+import { Platform, processColor } from 'react-native';
+import NativeShowTime from "./NativeShowTime.js";
+/**
+ * Configure ShowTime touch visualization.
+ */
+export function configure(options) {
+  if (Platform.OS !== 'ios') {
+    return;
+  }
+  const {
+    fillColor,
+    strokeColor,
+    multipleTapCountTextColor,
+    ...rest
+  } = options;
+  const nativeConfig = {
+    ...rest
+  };
+  if (fillColor === 'auto') {
+    nativeConfig.fillColorAuto = true;
+  } else if (fillColor != null) {
+    const processed = processColor(fillColor);
+    if (typeof processed === 'number') {
+      nativeConfig.fillColor = processed;
+    } else {
+      throw new Error(`Invalid fillColor: ${String(fillColor)}`);
+    }
+  }
+  if (strokeColor != null) {
+    const processed = processColor(strokeColor);
+    if (typeof processed === 'number') {
+      nativeConfig.strokeColor = processed;
+    } else {
+      throw new Error(`Invalid strokeColor: ${String(strokeColor)}`);
+    }
+  }
+  if (multipleTapCountTextColor != null) {
+    const processed = processColor(multipleTapCountTextColor);
+    if (typeof processed === 'number') {
+      nativeConfig.multipleTapCountTextColor = processed;
+    } else {
+      throw new Error(`Invalid multipleTapCountTextColor: ${String(multipleTapCountTextColor)}`);
+    }
+  }
+  NativeShowTime?.configure(nativeConfig);
+}
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Platform","processColor","NativeShowTime","configure","options","OS","fillColor","strokeColor","multipleTapCountTextColor","rest","nativeConfig","fillColorAuto","processed","Error","String"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,QAAQ,EAAEC,YAAY,QAAyB,cAAc;AACtE,OAAOC,cAAc,MAAsC,qBAAkB;AA0F7E;AACA;AACA;AACA,OAAO,SAASC,SAASA,CAACC,OAAwB,EAAQ;EACxD,IAAIJ,QAAQ,CAACK,EAAE,KAAK,KAAK,EAAE;IACzB;EACF;EAEA,MAAM;IAAEC,SAAS;IAAEC,WAAW;IAAEC,yBAAyB;IAAE,GAAGC;EAAK,CAAC,GAClEL,OAAO;EAET,MAAMM,YAAmC,GAAG;IAAE,GAAGD;EAAK,CAAC;EAEvD,IAAIH,SAAS,KAAK,MAAM,EAAE;IACxBI,YAAY,CAACC,aAAa,GAAG,IAAI;EACnC,CAAC,MAAM,IAAIL,SAAS,IAAI,IAAI,EAAE;IAC5B,MAAMM,SAAS,GAAGX,YAAY,CAACK,SAAS,CAAC;IAEzC,IAAI,OAAOM,SAAS,KAAK,QAAQ,EAAE;MACjCF,YAAY,CAACJ,SAAS,GAAGM,SAAS;IACpC,CAAC,MAAM;MACL,MAAM,IAAIC,KAAK,CAAC,sBAAsBC,MAAM,CAACR,SAAS,CAAC,EAAE,CAAC;IAC5D;EACF;EAEA,IAAIC,WAAW,IAAI,IAAI,EAAE;IACvB,MAAMK,SAAS,GAAGX,YAAY,CAACM,WAAW,CAAC;IAE3C,IAAI,OAAOK,SAAS,KAAK,QAAQ,EAAE;MACjCF,YAAY,CAACH,WAAW,GAAGK,SAAS;IACtC,CAAC,MAAM;MACL,MAAM,IAAIC,KAAK,CAAC,wBAAwBC,MAAM,CAACP,WAAW,CAAC,EAAE,CAAC;IAChE;EACF;EAEA,IAAIC,yBAAyB,IAAI,IAAI,EAAE;IACrC,MAAMI,SAAS,GAAGX,YAAY,CAACO,yBAAyB,CAAC;IAEzD,IAAI,OAAOI,SAAS,KAAK,QAAQ,EAAE;MACjCF,YAAY,CAACF,yBAAyB,GAAGI,SAAS;IACpD,CAAC,MAAM;MACL,MAAM,IAAIC,KAAK,CACb,sCAAsCC,MAAM,CAC1CN,yBACF,CAAC,EACH,CAAC;IACH;EACF;EAEAN,cAAc,EAAEC,SAAS,CAACO,YAAY,CAAC;AACzC","ignoreList":[]}

package/lib/module/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/typescript/package.json

@@ -0,0 +1 @@
+{"type":"module"}

package/lib/typescript/src/NativeShowTime.d.ts

@@ -0,0 +1,21 @@
+import { type TurboModule } from 'react-native';
+export type NativeShowTimeOptions = {
+    enabled?: string | undefined;
+    fillColor?: number | undefined;
+    fillColorAuto?: boolean | undefined;
+    strokeColor?: number | undefined;
+    strokeWidth?: number | undefined;
+    size?: number | undefined;
+    disappearAnimation?: string | undefined;
+    disappearDelay?: number | undefined;
+    shouldShowMultipleTapCount?: boolean | undefined;
+    multipleTapCountTextColor?: number | undefined;
+    shouldShowForce?: boolean | undefined;
+    shouldIgnoreApplePencilEvents?: boolean | undefined;
+};
+export interface Spec extends TurboModule {
+    configure(config: NativeShowTimeOptions): void;
+}
+declare const _default: Spec | null | undefined;
+export default _default;
+//# sourceMappingURL=NativeShowTime.d.ts.map

package/lib/typescript/src/NativeShowTime.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeShowTime.d.ts","sourceRoot":"","sources":["../../../src/NativeShowTime.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,WAAW,EAAE,MAAM,cAAc,CAAC;AAErE,MAAM,MAAM,qBAAqB,GAAG;IAClC,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACpC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxC,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,0BAA0B,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACjD,yBAAyB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/C,eAAe,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,6BAA6B,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CACrD,CAAC;AAEF,MAAM,WAAW,IAAK,SAAQ,WAAW;IACvC,SAAS,CAAC,MAAM,EAAE,qBAAqB,GAAG,IAAI,CAAC;CAChD;;AAED,wBAAyD"}

package/lib/typescript/src/index.d.ts

@@ -0,0 +1,81 @@
+import { type ColorValue } from 'react-native';
+export type EnabledMode = 'always' | 'never' | 'debugOnly';
+export type DisappearAnimation = 'standard' | 'scaleDown' | 'scaleUp';
+export type ShowTimeOptions = {
+    /**
+     * Whether ShowTime is enabled.
+     *
+     * @default 'always'
+     */
+    enabled?: EnabledMode | undefined;
+    /**
+     * The fill (background) color of a visual touch.
+     * When set to `'auto'`, ShowTime automatically uses the stroke color
+     * with 50% alpha.
+     *
+     * @default 'auto'
+     */
+    fillColor?: ColorValue | 'auto' | undefined;
+    /**
+     * The color of the stroke (outline) of a visual touch.
+     *
+     * @default '#3699EC'
+     */
+    strokeColor?: ColorValue | undefined;
+    /**
+     * The width (thickness) of the stroke around a visual touch.
+     *
+     * @default 3
+     */
+    strokeWidth?: number | undefined;
+    /**
+     * The size of a visual touch.
+     *
+     * @default 44
+     */
+    size?: number | undefined;
+    /**
+     * The style of animation to use when a visual touch disappears.
+     *
+     * @default 'standard'
+     */
+    disappearAnimation?: DisappearAnimation | undefined;
+    /**
+     * The delay, in seconds, before the visual touch disappears
+     * after a touch ends.
+     *
+     * @default 0.2
+     */
+    disappearDelay?: number | undefined;
+    /**
+     * Whether visual touches should indicate a multiple tap
+     * (i.e. show a number 2 for a double tap).
+     *
+     * @default false
+     */
+    shouldShowMultipleTapCount?: boolean | undefined;
+    /**
+     * The color of the text to use when showing multiple tap counts.
+     *
+     * @default '#000000'
+     */
+    multipleTapCountTextColor?: ColorValue | undefined;
+    /**
+     * Whether visual touches should visually show how much force
+     * is applied.
+     *
+     * @default true
+     */
+    shouldShowForce?: boolean | undefined;
+    /**
+     * Whether touch events from Apple Pencil are ignored.
+     *
+     * @default true
+     */
+    shouldIgnoreApplePencilEvents?: boolean | undefined;
+};
+/**
+ * Configure ShowTime touch visualization.
+ */
+export declare function configure(options: ShowTimeOptions): void;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0B,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAGvE,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,OAAO,GAAG,WAAW,CAAC;AAE3D,MAAM,MAAM,kBAAkB,GAAG,UAAU,GAAG,WAAW,GAAG,SAAS,CAAC;AAEtE,MAAM,MAAM,eAAe,GAAG;IAC5B;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;IAElC;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,SAAS,CAAC;IAE5C;;;;OAIG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IAErC;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAEjC;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAE1B;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,kBAAkB,GAAG,SAAS,CAAC;IAEpD;;;;;OAKG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAEpC;;;;;OAKG;IACH,0BAA0B,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAEjD;;;;OAIG;IACH,yBAAyB,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IAEnD;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAEtC;;;;OAIG;IACH,6BAA6B,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CACrD,CAAC;AAEF;;GAEG;AACH,wBAAgB,SAAS,CAAC,OAAO,EAAE,eAAe,GAAG,IAAI,CA+CxD"}

package/package.json

@@ -0,0 +1,148 @@
+{
+  "name": "react-native-showtime",
+  "version": "0.0.2",
+  "description": "ShowTime wrapper for React Native - Display taps and gestures on iOS",
+  "main": "./lib/module/index.js",
+  "types": "./lib/typescript/src/index.d.ts",
+  "exports": {
+    ".": {
+      "source": "./src/index.tsx",
+      "types": "./lib/typescript/src/index.d.ts",
+      "default": "./lib/module/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "src",
+    "lib",
+    "ios",
+    "cpp",
+    "*.podspec",
+    "react-native.config.js",
+    "!ios/build",
+    "!**/__tests__",
+    "!**/__fixtures__",
+    "!**/__mocks__",
+    "!**/.*"
+  ],
+  "scripts": {
+    "example": "yarn workspace react-native-showtime-example",
+    "clean": "del-cli lib",
+    "prepare": "bob build",
+    "typecheck": "tsc",
+    "lint": "eslint \"**/*.{js,ts,tsx}\"",
+    "release": "release-it --only-version"
+  },
+  "keywords": [
+    "react-native",
+    "ios"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/satya164/react-native-showtime.git"
+  },
+  "author": "Satyajit Sahoo <satyajit.happy@gmail.com> (https://github.com/satya164)",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/satya164/react-native-showtime/issues"
+  },
+  "homepage": "https://github.com/satya164/react-native-showtime#readme",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "devDependencies": {
+    "@commitlint/config-conventional": "^19.8.1",
+    "@eslint/compat": "^1.3.2",
+    "@eslint/eslintrc": "^3.3.1",
+    "@eslint/js": "^9.35.0",
+    "@react-native/babel-preset": "0.83.0",
+    "@react-native/eslint-config": "0.83.0",
+    "@release-it/conventional-changelog": "^10.0.1",
+    "@types/react": "^19.1.12",
+    "commitlint": "^19.8.1",
+    "del-cli": "^6.0.0",
+    "eslint": "^9.35.0",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-prettier": "^5.5.4",
+    "lefthook": "^2.0.3",
+    "prettier": "^2.8.8",
+    "react": "19.2.0",
+    "react-native": "0.83.2",
+    "react-native-builder-bob": "^0.40.18",
+    "release-it": "^19.0.4",
+    "turbo": "^2.5.6",
+    "typescript": "^5.9.2"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*"
+  },
+  "workspaces": [
+    "example"
+  ],
+  "packageManager": "yarn@4.11.0",
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      [
+        "module",
+        {
+          "esm": true
+        }
+      ],
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
+  },
+  "prettier": {
+    "quoteProps": "consistent",
+    "singleQuote": true,
+    "tabWidth": 2,
+    "trailingComma": "es5",
+    "useTabs": false
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  },
+  "release-it": {
+    "git": {
+      "commitMessage": "chore: release ${version}",
+      "tagName": "v${version}"
+    },
+    "npm": {
+      "publish": true
+    },
+    "github": {
+      "release": true
+    },
+    "plugins": {
+      "@release-it/conventional-changelog": {
+        "preset": {
+          "name": "angular"
+        }
+      }
+    }
+  },
+  "codegenConfig": {
+    "name": "ShowTimeSpec",
+    "type": "modules",
+    "jsSrcsDir": "src"
+  },
+  "create-react-native-library": {
+    "type": "turbo-module",
+    "languages": "kotlin-objc",
+    "tools": [
+      "eslint",
+      "lefthook",
+      "release-it"
+    ],
+    "version": "0.57.2"
+  }
+}

package/src/NativeShowTime.ts

@@ -0,0 +1,22 @@
+import { TurboModuleRegistry, type TurboModule } from 'react-native';
+
+export type NativeShowTimeOptions = {
+  enabled?: string | undefined;
+  fillColor?: number | undefined;
+  fillColorAuto?: boolean | undefined;
+  strokeColor?: number | undefined;
+  strokeWidth?: number | undefined;
+  size?: number | undefined;
+  disappearAnimation?: string | undefined;
+  disappearDelay?: number | undefined;
+  shouldShowMultipleTapCount?: boolean | undefined;
+  multipleTapCountTextColor?: number | undefined;
+  shouldShowForce?: boolean | undefined;
+  shouldIgnoreApplePencilEvents?: boolean | undefined;
+};
+
+export interface Spec extends TurboModule {
+  configure(config: NativeShowTimeOptions): void;
+}
+
+export default TurboModuleRegistry.get<Spec>('ShowTime');

package/src/index.tsx

@@ -0,0 +1,142 @@
+import { Platform, processColor, type ColorValue } from 'react-native';
+import NativeShowTime, { type NativeShowTimeOptions } from './NativeShowTime';
+
+export type EnabledMode = 'always' | 'never' | 'debugOnly';
+
+export type DisappearAnimation = 'standard' | 'scaleDown' | 'scaleUp';
+
+export type ShowTimeOptions = {
+  /**
+   * Whether ShowTime is enabled.
+   *
+   * @default 'always'
+   */
+  enabled?: EnabledMode | undefined;
+
+  /**
+   * The fill (background) color of a visual touch.
+   * When set to `'auto'`, ShowTime automatically uses the stroke color
+   * with 50% alpha.
+   *
+   * @default 'auto'
+   */
+  fillColor?: ColorValue | 'auto' | undefined;
+
+  /**
+   * The color of the stroke (outline) of a visual touch.
+   *
+   * @default '#3699EC'
+   */
+  strokeColor?: ColorValue | undefined;
+
+  /**
+   * The width (thickness) of the stroke around a visual touch.
+   *
+   * @default 3
+   */
+  strokeWidth?: number | undefined;
+
+  /**
+   * The size of a visual touch.
+   *
+   * @default 44
+   */
+  size?: number | undefined;
+
+  /**
+   * The style of animation to use when a visual touch disappears.
+   *
+   * @default 'standard'
+   */
+  disappearAnimation?: DisappearAnimation | undefined;
+
+  /**
+   * The delay, in seconds, before the visual touch disappears
+   * after a touch ends.
+   *
+   * @default 0.2
+   */
+  disappearDelay?: number | undefined;
+
+  /**
+   * Whether visual touches should indicate a multiple tap
+   * (i.e. show a number 2 for a double tap).
+   *
+   * @default false
+   */
+  shouldShowMultipleTapCount?: boolean | undefined;
+
+  /**
+   * The color of the text to use when showing multiple tap counts.
+   *
+   * @default '#000000'
+   */
+  multipleTapCountTextColor?: ColorValue | undefined;
+
+  /**
+   * Whether visual touches should visually show how much force
+   * is applied.
+   *
+   * @default true
+   */
+  shouldShowForce?: boolean | undefined;
+
+  /**
+   * Whether touch events from Apple Pencil are ignored.
+   *
+   * @default true
+   */
+  shouldIgnoreApplePencilEvents?: boolean | undefined;
+};
+
+/**
+ * Configure ShowTime touch visualization.
+ */
+export function configure(options: ShowTimeOptions): void {
+  if (Platform.OS !== 'ios') {
+    return;
+  }
+
+  const { fillColor, strokeColor, multipleTapCountTextColor, ...rest } =
+    options;
+
+  const nativeConfig: NativeShowTimeOptions = { ...rest };
+
+  if (fillColor === 'auto') {
+    nativeConfig.fillColorAuto = true;
+  } else if (fillColor != null) {
+    const processed = processColor(fillColor);
+
+    if (typeof processed === 'number') {
+      nativeConfig.fillColor = processed;
+    } else {
+      throw new Error(`Invalid fillColor: ${String(fillColor)}`);
+    }
+  }
+
+  if (strokeColor != null) {
+    const processed = processColor(strokeColor);
+
+    if (typeof processed === 'number') {
+      nativeConfig.strokeColor = processed;
+    } else {
+      throw new Error(`Invalid strokeColor: ${String(strokeColor)}`);
+    }
+  }
+
+  if (multipleTapCountTextColor != null) {
+    const processed = processColor(multipleTapCountTextColor);
+
+    if (typeof processed === 'number') {
+      nativeConfig.multipleTapCountTextColor = processed;
+    } else {
+      throw new Error(
+        `Invalid multipleTapCountTextColor: ${String(
+          multipleTapCountTextColor
+        )}`
+      );
+    }
+  }
+
+  NativeShowTime?.configure(nativeConfig);
+}