react-native-smooth-clip-view 0.1.0

package/ios/SmoothClipGeometry.h

@@ -0,0 +1,41 @@
+#import <CoreGraphics/CoreGraphics.h>
+
+#include <math.h>
+
+typedef struct {
+  CGRect rect;
+  CGFloat radius;
+} SmoothNormalizedClipGeometry;
+
+/** Mirrors the Android and JavaScript geometry contract without allocating. */
+NS_INLINE BOOL SmoothClipNormalizeGeometry(
+    CGFloat x,
+    CGFloat y,
+    CGFloat width,
+    CGFloat height,
+    CGFloat radius,
+    CGSize hostSize,
+    SmoothNormalizedClipGeometry *result) {
+  if (!isfinite(x) || !isfinite(y) || !isfinite(width) ||
+      !isfinite(height) || !isfinite(radius) ||
+      !isfinite(hostSize.width) || !isfinite(hostSize.height)) {
+    return NO;
+  }
+
+  const CGFloat hostWidth = MAX(0, hostSize.width);
+  const CGFloat hostHeight = MAX(0, hostSize.height);
+  const CGFloat requestedWidth = MAX(0, width);
+  const CGFloat requestedHeight = MAX(0, height);
+  const CGFloat requestedRight = x + requestedWidth;
+  const CGFloat requestedBottom = y + requestedHeight;
+  const CGFloat left = MIN(hostWidth, MAX(0, x));
+  const CGFloat top = MIN(hostHeight, MAX(0, y));
+  const CGFloat right = MIN(hostWidth, MAX(0, requestedRight));
+  const CGFloat bottom = MIN(hostHeight, MAX(0, requestedBottom));
+  const CGFloat visibleWidth = MAX(0, right - left);
+  const CGFloat visibleHeight = MAX(0, bottom - top);
+
+  result->rect = CGRectMake(left, top, visibleWidth, visibleHeight);
+  result->radius = MIN(MAX(0, radius), MIN(visibleWidth, visibleHeight) / 2.0);
+  return YES;
+}

package/ios/SmoothClipView.h

@@ -0,0 +1,9 @@
+#import <React/RCTViewComponentView.h>
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface SmoothClipView : RCTViewComponentView
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/SmoothClipView.mm

@@ -0,0 +1,224 @@
+#import "SmoothClipView.h"
+#import "SmoothClipGeometry.h"
+
+#import <QuartzCore/QuartzCore.h>
+#import <React/RCTConversions.h>
+#import <React/RCTFabricComponentsPlugins.h>
+#import <react/renderer/components/SmoothClipViewSpec/ComponentDescriptors.h>
+#import <react/renderer/components/SmoothClipViewSpec/Props.h>
+#import <react/renderer/components/SmoothClipViewSpec/RCTComponentViewHelpers.h>
+
+using namespace facebook::react;
+
+@interface SmoothClipView () <RCTSmoothClipViewViewProtocol>
+@end
+
+@implementation SmoothClipView {
+  UIView *_clipContainer;
+  CGRect _requestedClip;
+  CGRect _normalizedClip;
+  CGFloat _requestedRadius;
+  CGFloat _normalizedRadius;
+  BOOL _hasLayout;
+  BOOL _commandIsAuthoritative;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider {
+  return concreteComponentDescriptorProvider<SmoothClipViewComponentDescriptor>();
+}
+
++ (BOOL)shouldBeRecycled {
+  return NO;
+}
+
+- (instancetype)initWithFrame:(CGRect)frame {
+  if (self = [super initWithFrame:frame]) {
+    static const auto defaultProps =
+        std::make_shared<const SmoothClipViewProps>();
+    _props = defaultProps;
+
+    _clipContainer = [[UIView alloc] initWithFrame:CGRectZero];
+    _clipContainer.clipsToBounds = YES;
+    _clipContainer.hidden = YES;
+    _clipContainer.accessibilityElementsHidden = YES;
+    [self addSubview:_clipContainer];
+
+    _requestedClip = CGRectZero;
+    _normalizedClip = CGRectZero;
+    _requestedRadius = 0;
+    _normalizedRadius = 0;
+    _hasLayout = NO;
+    _commandIsAuthoritative = NO;
+  }
+  return self;
+}
+
+- (void)mountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView
+                          index:(NSInteger)index {
+  NSAssert(childComponentView.superview == nil,
+           @"SmoothClipView attempted to mount an already-mounted child");
+  [_clipContainer insertSubview:childComponentView atIndex:index];
+}
+
+- (void)unmountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView
+                            index:(NSInteger)index {
+  NSAssert(childComponentView.superview == _clipContainer,
+           @"SmoothClipView attempted to unmount a child from another parent");
+  NSAssert(index < _clipContainer.subviews.count &&
+               _clipContainer.subviews[index] == childComponentView,
+           @"SmoothClipView child index mismatch");
+  [childComponentView removeFromSuperview];
+}
+
+- (void)setRequestedClipX:(CGFloat)x
+                         y:(CGFloat)y
+                    width:(CGFloat)width
+                   height:(CGFloat)height
+                   radius:(CGFloat)radius {
+  if (!isfinite(x) || !isfinite(y) || !isfinite(width) ||
+      !isfinite(height) || !isfinite(radius)) {
+    return;
+  }
+
+  _requestedClip = CGRectMake(x, y, MAX(0, width), MAX(0, height));
+  _requestedRadius = MAX(0, radius);
+  [self applyRequestedClip];
+}
+
+- (void)applyRequestedClip {
+  if (!_hasLayout) {
+    return;
+  }
+
+  const CGFloat hostWidth = MAX(0, self.bounds.size.width);
+  const CGFloat hostHeight = MAX(0, self.bounds.size.height);
+  SmoothNormalizedClipGeometry geometry;
+  if (!SmoothClipNormalizeGeometry(
+          CGRectGetMinX(_requestedClip),
+          CGRectGetMinY(_requestedClip),
+          CGRectGetWidth(_requestedClip),
+          CGRectGetHeight(_requestedClip),
+          _requestedRadius,
+          CGSizeMake(hostWidth, hostHeight),
+          &geometry)) {
+    return;
+  }
+
+  const BOOL rectChanged = !CGRectEqualToRect(_normalizedClip, geometry.rect);
+  const BOOL radiusChanged = _normalizedRadius != geometry.radius;
+  const BOOL isEmpty = CGRectIsEmpty(geometry.rect);
+  const BOOL hiddenChanged = _clipContainer.hidden != isEmpty;
+  const BOOL accessibilityChanged =
+      _clipContainer.accessibilityElementsHidden != isEmpty;
+
+  _normalizedClip = geometry.rect;
+  _normalizedRadius = geometry.radius;
+  if (!rectChanged && !radiusChanged && !hiddenChanged &&
+      !accessibilityChanged) {
+    return;
+  }
+
+  [CATransaction begin];
+  [CATransaction setDisableActions:YES];
+  if (rectChanged) {
+    _clipContainer.bounds = _normalizedClip;
+    _clipContainer.center = CGPointMake(
+        CGRectGetMidX(_normalizedClip), CGRectGetMidY(_normalizedClip));
+  }
+  if (radiusChanged) {
+    _clipContainer.layer.cornerRadius = _normalizedRadius;
+  }
+  if (hiddenChanged) {
+    _clipContainer.hidden = isEmpty;
+  }
+  if (accessibilityChanged) {
+    _clipContainer.accessibilityElementsHidden = isEmpty;
+  }
+  [CATransaction commit];
+}
+
+- (void)updateProps:(const Props::Shared &)props
+            oldProps:(const Props::Shared &)oldProps {
+  const auto &newProps =
+      *std::static_pointer_cast<const SmoothClipViewProps>(props);
+  [super updateProps:props oldProps:oldProps];
+
+  if (!_commandIsAuthoritative) {
+    [self setRequestedClipX:newProps.initialClipX
+                         y:newProps.initialClipY
+                     width:newProps.initialClipWidth
+                    height:newProps.initialClipHeight
+                    radius:newProps.initialClipRadius];
+  }
+}
+
+- (void)updateLayoutMetrics:(const LayoutMetrics &)layoutMetrics
+            oldLayoutMetrics:(const LayoutMetrics &)oldLayoutMetrics {
+  [super updateLayoutMetrics:layoutMetrics oldLayoutMetrics:oldLayoutMetrics];
+  _hasLayout = YES;
+  [self applyRequestedClip];
+}
+
+- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
+  if (![super pointInside:point withEvent:event] ||
+      CGRectIsEmpty(_normalizedClip) ||
+      !CGRectContainsPoint(_normalizedClip, point)) {
+    return NO;
+  }
+
+  const CGFloat radius = _normalizedRadius;
+  if (radius <= 0) {
+    return YES;
+  }
+
+  const CGFloat innerLeft = CGRectGetMinX(_normalizedClip) + radius;
+  const CGFloat innerRight = CGRectGetMaxX(_normalizedClip) - radius;
+  const CGFloat innerTop = CGRectGetMinY(_normalizedClip) + radius;
+  const CGFloat innerBottom = CGRectGetMaxY(_normalizedClip) - radius;
+  if ((point.x >= innerLeft && point.x <= innerRight) ||
+      (point.y >= innerTop && point.y <= innerBottom)) {
+    return YES;
+  }
+
+  const CGFloat centerX = point.x < innerLeft ? innerLeft : innerRight;
+  const CGFloat centerY = point.y < innerTop ? innerTop : innerBottom;
+  const CGFloat dx = point.x - centerX;
+  const CGFloat dy = point.y - centerY;
+  return dx * dx + dy * dy <= radius * radius;
+}
+
+#pragma mark - Native commands
+
+- (void)handleCommand:(const NSString *)commandName args:(const NSArray *)args {
+  RCTSmoothClipViewHandleCommand(self, commandName, args);
+}
+
+- (void)setClipGeometry:(double)x
+                       y:(double)y
+                   width:(double)width
+                  height:(double)height
+                  radius:(double)radius {
+  _commandIsAuthoritative = YES;
+  [self setRequestedClipX:x y:y width:width height:height radius:radius];
+}
+
+- (void)prepareForRecycle {
+  [super prepareForRecycle];
+  _requestedClip = CGRectZero;
+  _normalizedClip = CGRectZero;
+  _requestedRadius = 0;
+  _normalizedRadius = 0;
+  _hasLayout = NO;
+  _commandIsAuthoritative = NO;
+
+  [CATransaction begin];
+  [CATransaction setDisableActions:YES];
+  _clipContainer.bounds = CGRectZero;
+  _clipContainer.center = CGPointZero;
+  _clipContainer.layer.cornerRadius = 0;
+  _clipContainer.hidden = YES;
+  _clipContainer.accessibilityElementsHidden = YES;
+  [CATransaction commit];
+}
+
+@end

package/lib/module/SmoothClipView.js

@@ -0,0 +1,35 @@
+"use strict";
+
+import Animated, { dispatchCommand, useAnimatedReaction, useAnimatedRef } from 'react-native-reanimated';
+import NativeSmoothClipView from './SmoothClipViewNativeComponent';
+import { clipGeometryEquals, isFiniteClipGeometry } from "./geometry.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const AnimatedNativeSmoothClipView = Animated.createAnimatedComponent(NativeSmoothClipView);
+export function SmoothClipView({
+  initialClip,
+  animatedClip,
+  children,
+  ...viewProps
+}) {
+  const nativeRef = useAnimatedRef();
+  useAnimatedReaction(() => animatedClip.value, (clip, previousClip) => {
+    if (!isFiniteClipGeometry(clip) || clipGeometryEquals(previousClip, clip)) {
+      return;
+    }
+    dispatchCommand(nativeRef, 'setClipGeometry', [clip.x, clip.y, clip.width, clip.height, clip.radius]);
+  }, [nativeRef, animatedClip]);
+  const nativeProps = {
+    ...viewProps,
+    initialClipX: initialClip.x,
+    initialClipY: initialClip.y,
+    initialClipWidth: initialClip.width,
+    initialClipHeight: initialClip.height,
+    initialClipRadius: initialClip.radius
+  };
+  return /*#__PURE__*/_jsx(AnimatedNativeSmoothClipView, {
+    ref: nativeRef,
+    ...nativeProps,
+    children: children
+  });
+}
+//# sourceMappingURL=SmoothClipView.js.map

package/lib/module/SmoothClipView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Animated","dispatchCommand","useAnimatedReaction","useAnimatedRef","NativeSmoothClipView","clipGeometryEquals","isFiniteClipGeometry","jsx","_jsx","AnimatedNativeSmoothClipView","createAnimatedComponent","SmoothClipView","initialClip","animatedClip","children","viewProps","nativeRef","value","clip","previousClip","x","y","width","height","radius","nativeProps","initialClipX","initialClipY","initialClipWidth","initialClipHeight","initialClipRadius","ref"],"sourceRoot":"../../src","sources":["SmoothClipView.tsx"],"mappings":";;AAGA,OAAOA,QAAQ,IACbC,eAAe,EACfC,mBAAmB,EACnBC,cAAc,QAET,yBAAyB;AAChC,OAAOC,oBAAoB,MAEpB,iCAAiC;AACxC,SACEC,kBAAkB,EAClBC,oBAAoB,QAEf,eAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEpB,MAAMC,4BAA4B,GAChCT,QAAQ,CAACU,uBAAuB,CAACN,oBAAoB,CAAC;AAQxD,OAAO,SAASO,cAAcA,CAAC;EAC7BC,WAAW;EACXC,YAAY;EACZC,QAAQ;EACR,GAAGC;AACgB,CAAC,EAAE;EACtB,MAAMC,SAAS,GACbb,cAAc,CAAkD,CAAC;EAEnED,mBAAmB,CACjB,MAAMW,YAAY,CAACI,KAAK,EACxB,CAACC,IAAI,EAAEC,YAAY,KAAK;IACtB,IACE,CAACb,oBAAoB,CAACY,IAAI,CAAC,IAC3Bb,kBAAkB,CAACc,YAAY,EAAED,IAAI,CAAC,EACtC;MACA;IACF;IAEAjB,eAAe,CAACe,SAAS,EAAE,iBAAiB,EAAE,CAC5CE,IAAI,CAACE,CAAC,EACNF,IAAI,CAACG,CAAC,EACNH,IAAI,CAACI,KAAK,EACVJ,IAAI,CAACK,MAAM,EACXL,IAAI,CAACM,MAAM,CACZ,CAAC;EACJ,CAAC,EACD,CAACR,SAAS,EAAEH,YAAY,CAC1B,CAAC;EAED,MAAMY,WAAwB,GAAG;IAC/B,GAAGV,SAAS;IACZW,YAAY,EAAEd,WAAW,CAACQ,CAAC;IAC3BO,YAAY,EAAEf,WAAW,CAACS,CAAC;IAC3BO,gBAAgB,EAAEhB,WAAW,CAACU,KAAK;IACnCO,iBAAiB,EAAEjB,WAAW,CAACW,MAAM;IACrCO,iBAAiB,EAAElB,WAAW,CAACY;EACjC,CAAC;EAED,oBACEhB,IAAA,CAACC,4BAA4B;IAACsB,GAAG,EAAEf,SAAU;IAAA,GAAKS,WAAW;IAAAX,QAAA,EAC1DA;EAAQ,CACmB,CAAC;AAEnC","ignoreList":[]}

package/lib/module/SmoothClipView.web.js

@@ -0,0 +1,38 @@
+"use strict";
+
+import Animated, { useAnimatedReaction, useAnimatedStyle, useSharedValue } from 'react-native-reanimated';
+import { clipGeometryEquals, isFiniteClipGeometry } from "./geometry.js";
+import { createWebClipPath } from "./webClipPath.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+/** Build-safe fallback. Web performance is intentionally outside the POC. */
+export function SmoothClipView({
+  initialClip,
+  animatedClip,
+  children,
+  style,
+  ...viewProps
+}) {
+  const acceptedClip = useSharedValue(initialClip);
+  const initialClipStyle = {
+    clipPath: createWebClipPath(initialClip),
+    overflow: 'hidden'
+  };
+  useAnimatedReaction(() => animatedClip.value, (clip, previousClip) => {
+    if (isFiniteClipGeometry(clip) && !clipGeometryEquals(previousClip, clip)) {
+      acceptedClip.value = clip;
+    }
+  }, [animatedClip, acceptedClip]);
+  const clipStyle = useAnimatedStyle(() => {
+    const clip = acceptedClip.value;
+    return {
+      clipPath: createWebClipPath(clip),
+      overflow: 'hidden'
+    };
+  });
+  return /*#__PURE__*/_jsx(Animated.View, {
+    ...viewProps,
+    style: [style, initialClipStyle, clipStyle],
+    children: children
+  });
+}
+//# sourceMappingURL=SmoothClipView.web.js.map

package/lib/module/SmoothClipView.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Animated","useAnimatedReaction","useAnimatedStyle","useSharedValue","clipGeometryEquals","isFiniteClipGeometry","createWebClipPath","jsx","_jsx","SmoothClipView","initialClip","animatedClip","children","style","viewProps","acceptedClip","initialClipStyle","clipPath","overflow","value","clip","previousClip","clipStyle","View"],"sourceRoot":"../../src","sources":["SmoothClipView.web.tsx"],"mappings":";;AAEA,OAAOA,QAAQ,IACbC,mBAAmB,EACnBC,gBAAgB,EAChBC,cAAc,QAET,yBAAyB;AAChC,SACEC,kBAAkB,EAClBC,oBAAoB,QAEf,eAAY;AACnB,SAASC,iBAAiB,QAAQ,kBAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQlD;AACA,OAAO,SAASC,cAAcA,CAAC;EAC7BC,WAAW;EACXC,YAAY;EACZC,QAAQ;EACRC,KAAK;EACL,GAAGC;AACgB,CAAC,EAAE;EACtB,MAAMC,YAAY,GAAGZ,cAAc,CAACO,WAAW,CAAC;EAChD,MAAMM,gBAAgB,GAAG;IACvBC,QAAQ,EAAEX,iBAAiB,CAACI,WAAW,CAAC;IACxCQ,QAAQ,EAAE;EACZ,CAAyB;EAEzBjB,mBAAmB,CACjB,MAAMU,YAAY,CAACQ,KAAK,EACxB,CAACC,IAAI,EAAEC,YAAY,KAAK;IACtB,IACEhB,oBAAoB,CAACe,IAAI,CAAC,IAC1B,CAAChB,kBAAkB,CAACiB,YAAY,EAAED,IAAI,CAAC,EACvC;MACAL,YAAY,CAACI,KAAK,GAAGC,IAAI;IAC3B;EACF,CAAC,EACD,CAACT,YAAY,EAAEI,YAAY,CAC7B,CAAC;EAED,MAAMO,SAAS,GAAGpB,gBAAgB,CAAC,MAAM;IACvC,MAAMkB,IAAI,GAAGL,YAAY,CAACI,KAAK;IAC/B,OAAO;MACLF,QAAQ,EAAEX,iBAAiB,CAACc,IAAI,CAAC;MACjCF,QAAQ,EAAE;IACZ,CAAC;EACH,CAAC,CAAC;EAEF,oBACEV,IAAA,CAACR,QAAQ,CAACuB,IAAI;IAAA,GAAKT,SAAS;IAAED,KAAK,EAAE,CAACA,KAAK,EAAEG,gBAAgB,EAAEM,SAAS,CAAE;IAAAV,QAAA,EACvEA;EAAQ,CACI,CAAC;AAEpB","ignoreList":[]}

package/lib/module/SmoothClipViewNativeComponent.ts

@@ -0,0 +1,34 @@
+import {
+  codegenNativeCommands,
+  codegenNativeComponent,
+  type CodegenTypes,
+  type HostComponent,
+  type ViewProps,
+} from 'react-native';
+
+export interface NativeProps extends ViewProps {
+  initialClipX: CodegenTypes.Double;
+  initialClipY: CodegenTypes.Double;
+  initialClipWidth: CodegenTypes.Double;
+  initialClipHeight: CodegenTypes.Double;
+  initialClipRadius: CodegenTypes.Double;
+}
+
+interface NativeCommands {
+  setClipGeometry: (
+    viewRef: React.ElementRef<HostComponent<NativeProps>>,
+    x: CodegenTypes.Double,
+    y: CodegenTypes.Double,
+    width: CodegenTypes.Double,
+    height: CodegenTypes.Double,
+    radius: CodegenTypes.Double
+  ) => void;
+}
+
+export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({
+  supportedCommands: ['setClipGeometry'],
+});
+
+export default codegenNativeComponent<NativeProps>(
+  'SmoothClipView'
+) as HostComponent<NativeProps>;

package/lib/module/geometry.js

@@ -0,0 +1,41 @@
+"use strict";
+
+export function isFiniteClipGeometry(geometry) {
+  'worklet';
+
+  return Number.isFinite(geometry.x) && Number.isFinite(geometry.y) && Number.isFinite(geometry.width) && Number.isFinite(geometry.height) && Number.isFinite(geometry.radius);
+}
+export function clipGeometryEquals(first, second) {
+  'worklet';
+
+  return first !== null && first.x === second.x && first.y === second.y && first.width === second.width && first.height === second.height && first.radius === second.radius;
+}
+
+/**
+ * Mirrors the native geometry contract for tests and non-native fallbacks.
+ * Native remains authoritative because its bounds are the actual rendered size.
+ */
+export function normalizeClipGeometry(geometry, bounds) {
+  'worklet';
+
+  const values = [geometry.x, geometry.y, geometry.width, geometry.height, geometry.radius, bounds.width, bounds.height];
+  if (!values.every(Number.isFinite)) return null;
+  const boundsWidth = Math.max(0, bounds.width);
+  const boundsHeight = Math.max(0, bounds.height);
+  const requestedWidth = Math.max(0, geometry.width);
+  const requestedHeight = Math.max(0, geometry.height);
+  const left = Math.min(boundsWidth, Math.max(0, geometry.x));
+  const top = Math.min(boundsHeight, Math.max(0, geometry.y));
+  const right = Math.min(boundsWidth, Math.max(0, geometry.x + requestedWidth));
+  const bottom = Math.min(boundsHeight, Math.max(0, geometry.y + requestedHeight));
+  const width = Math.max(0, right - left);
+  const height = Math.max(0, bottom - top);
+  return {
+    x: left,
+    y: top,
+    width,
+    height,
+    radius: Math.min(Math.max(0, geometry.radius), Math.min(width, height) / 2)
+  };
+}
+//# sourceMappingURL=geometry.js.map

package/lib/module/geometry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["isFiniteClipGeometry","geometry","Number","isFinite","x","y","width","height","radius","clipGeometryEquals","first","second","normalizeClipGeometry","bounds","values","every","boundsWidth","Math","max","boundsHeight","requestedWidth","requestedHeight","left","min","top","right","bottom"],"sourceRoot":"../../src","sources":["geometry.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+export { SmoothClipView } from './SmoothClipView';
+export { normalizeClipGeometry } from "./geometry.js";
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SmoothClipView","normalizeClipGeometry"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,SAASA,cAAc,QAAQ,kBAAkB;AAEjD,SAASC,qBAAqB,QAAQ,eAAY","ignoreList":[]}

package/lib/module/index.web.js

@@ -0,0 +1,5 @@
+"use strict";
+
+export { SmoothClipView } from "./SmoothClipView.web.js";
+export { normalizeClipGeometry } from "./geometry.js";
+//# sourceMappingURL=index.web.js.map

package/lib/module/index.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SmoothClipView","normalizeClipGeometry"],"sourceRoot":"../../src","sources":["index.web.ts"],"mappings":";;AAAA,SAASA,cAAc,QAAQ,yBAAsB;AAErD,SAASC,qBAAqB,QAAQ,eAAY","ignoreList":[]}

package/lib/module/package.json

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

package/lib/module/webClipPath.js

@@ -0,0 +1,25 @@
+"use strict";
+
+function px(value) {
+  'worklet';
+
+  return `${value}px`;
+}
+
+/**
+ * Creates a fixed-host CSS clip. Percentage/right/bottom anchored descendants
+ * continue resolving against the host because this never changes its layout.
+ */
+export function createWebClipPath(geometry) {
+  'worklet';
+
+  const width = Math.max(0, geometry.width);
+  const height = Math.max(0, geometry.height);
+  const left = Math.max(0, geometry.x);
+  const top = Math.max(0, geometry.y);
+  const rightEdge = Math.max(0, geometry.x + width);
+  const bottomEdge = Math.max(0, geometry.y + height);
+  const radius = Math.min(Math.max(0, geometry.radius), Math.min(width, height) / 2);
+  return `inset(${px(top)} max(0px, calc(100% - ${px(rightEdge)})) max(0px, calc(100% - ${px(bottomEdge)})) ${px(left)} round ${px(radius)})`;
+}
+//# sourceMappingURL=webClipPath.js.map

package/lib/module/webClipPath.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["px","value","createWebClipPath","geometry","width","Math","max","height","left","x","top","y","rightEdge","bottomEdge","radius","min"],"sourceRoot":"../../src","sources":["webClipPath.ts"],"mappings":";;AAEA,SAASA,EAAEA,CAACC,KAAa,EAAU;EACjC,SAAS;;EACT,OAAO,GAAGA,KAAK,IAAI;AACrB;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASC,iBAAiBA,CAACC,QAAsB,EAAU;EAChE,SAAS;;EACT,MAAMC,KAAK,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,QAAQ,CAACC,KAAK,CAAC;EACzC,MAAMG,MAAM,GAAGF,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,QAAQ,CAACI,MAAM,CAAC;EAC3C,MAAMC,IAAI,GAAGH,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,QAAQ,CAACM,CAAC,CAAC;EACpC,MAAMC,GAAG,GAAGL,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,QAAQ,CAACQ,CAAC,CAAC;EACnC,MAAMC,SAAS,GAAGP,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,QAAQ,CAACM,CAAC,GAAGL,KAAK,CAAC;EACjD,MAAMS,UAAU,GAAGR,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,QAAQ,CAACQ,CAAC,GAAGJ,MAAM,CAAC;EACnD,MAAMO,MAAM,GAAGT,IAAI,CAACU,GAAG,CACrBV,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,QAAQ,CAACW,MAAM,CAAC,EAC5BT,IAAI,CAACU,GAAG,CAACX,KAAK,EAAEG,MAAM,CAAC,GAAG,CAC5B,CAAC;EAED,OAAO,SAASP,EAAE,CAACU,GAAG,CAAC,yBAAyBV,EAAE,CAChDY,SACF,CAAC,2BAA2BZ,EAAE,CAACa,UAAU,CAAC,MAAMb,EAAE,CAChDQ,IACF,CAAC,UAAUR,EAAE,CAACc,MAAM,CAAC,GAAG;AAC1B","ignoreList":[]}

package/lib/typescript/package.json

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

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

@@ -0,0 +1,12 @@
+import type React from 'react';
+import type { ReactNode } from 'react';
+import { type ViewProps } from 'react-native';
+import { type SharedValue } from 'react-native-reanimated';
+import { type ClipGeometry } from './geometry.js';
+export type SmoothClipViewProps = ViewProps & {
+    initialClip: ClipGeometry;
+    animatedClip: SharedValue<ClipGeometry>;
+    children?: ReactNode;
+};
+export declare function SmoothClipView({ initialClip, animatedClip, children, ...viewProps }: SmoothClipViewProps): React.JSX.Element;
+//# sourceMappingURL=SmoothClipView.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SmoothClipView.d.ts","sourceRoot":"","sources":["../../../src/SmoothClipView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAiB,EAIf,KAAK,WAAW,EACjB,MAAM,yBAAyB,CAAC;AAIjC,OAAO,EAGL,KAAK,YAAY,EAClB,MAAM,eAAY,CAAC;AAKpB,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG;IAC5C,WAAW,EAAE,YAAY,CAAC;IAC1B,YAAY,EAAE,WAAW,CAAC,YAAY,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,mBAAmB,qBAuCrB"}

package/lib/typescript/src/SmoothClipView.web.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from 'react';
+import { type ViewProps } from 'react-native';
+import { type SharedValue } from 'react-native-reanimated';
+import { type ClipGeometry } from './geometry.js';
+export type SmoothClipViewProps = ViewProps & {
+    initialClip: ClipGeometry;
+    animatedClip: SharedValue<ClipGeometry>;
+    children?: ReactNode;
+};
+/** Build-safe fallback. Web performance is intentionally outside the POC. */
+export declare function SmoothClipView({ initialClip, animatedClip, children, style, ...viewProps }: SmoothClipViewProps): import("react").JSX.Element;
+//# sourceMappingURL=SmoothClipView.web.d.ts.map

package/lib/typescript/src/SmoothClipView.web.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SmoothClipView.web.d.ts","sourceRoot":"","sources":["../../../src/SmoothClipView.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,KAAK,SAAS,EAAkB,MAAM,cAAc,CAAC;AAC9D,OAAiB,EAIf,KAAK,WAAW,EACjB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAGL,KAAK,YAAY,EAClB,MAAM,eAAY,CAAC;AAGpB,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG;IAC5C,WAAW,EAAE,YAAY,CAAC;IAC1B,YAAY,EAAE,WAAW,CAAC,YAAY,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,6EAA6E;AAC7E,wBAAgB,cAAc,CAAC,EAC7B,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,GAAG,SAAS,EACb,EAAE,mBAAmB,+BAiCrB"}

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

@@ -0,0 +1,15 @@
+import { type CodegenTypes, type HostComponent, type ViewProps } from 'react-native';
+export interface NativeProps extends ViewProps {
+    initialClipX: CodegenTypes.Double;
+    initialClipY: CodegenTypes.Double;
+    initialClipWidth: CodegenTypes.Double;
+    initialClipHeight: CodegenTypes.Double;
+    initialClipRadius: CodegenTypes.Double;
+}
+interface NativeCommands {
+    setClipGeometry: (viewRef: React.ElementRef<HostComponent<NativeProps>>, x: CodegenTypes.Double, y: CodegenTypes.Double, width: CodegenTypes.Double, height: CodegenTypes.Double, radius: CodegenTypes.Double) => void;
+}
+export declare const Commands: NativeCommands;
+declare const _default: HostComponent<NativeProps>;
+export default _default;
+//# sourceMappingURL=SmoothClipViewNativeComponent.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SmoothClipViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/SmoothClipViewNativeComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,YAAY,EACjB,KAAK,aAAa,EAClB,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,YAAY,EAAE,YAAY,CAAC,MAAM,CAAC;IAClC,YAAY,EAAE,YAAY,CAAC,MAAM,CAAC;IAClC,gBAAgB,EAAE,YAAY,CAAC,MAAM,CAAC;IACtC,iBAAiB,EAAE,YAAY,CAAC,MAAM,CAAC;IACvC,iBAAiB,EAAE,YAAY,CAAC,MAAM,CAAC;CACxC;AAED,UAAU,cAAc;IACtB,eAAe,EAAE,CACf,OAAO,EAAE,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,EACrD,CAAC,EAAE,YAAY,CAAC,MAAM,EACtB,CAAC,EAAE,YAAY,CAAC,MAAM,EACtB,KAAK,EAAE,YAAY,CAAC,MAAM,EAC1B,MAAM,EAAE,YAAY,CAAC,MAAM,EAC3B,MAAM,EAAE,YAAY,CAAC,MAAM,KACxB,IAAI,CAAC;CACX;AAED,eAAO,MAAM,QAAQ,EAAE,cAErB,CAAC;wBAIE,aAAa,CAAC,WAAW,CAAC;AAF/B,wBAEgC"}

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

@@ -0,0 +1,19 @@
+export type ClipGeometry = Readonly<{
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    radius: number;
+}>;
+export type ClipBounds = Readonly<{
+    width: number;
+    height: number;
+}>;
+export declare function isFiniteClipGeometry(geometry: ClipGeometry): boolean;
+export declare function clipGeometryEquals(first: ClipGeometry | null, second: ClipGeometry): boolean;
+/**
+ * Mirrors the native geometry contract for tests and non-native fallbacks.
+ * Native remains authoritative because its bounds are the actual rendered size.
+ */
+export declare function normalizeClipGeometry(geometry: ClipGeometry, bounds: ClipBounds): ClipGeometry | null;
+//# sourceMappingURL=geometry.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"geometry.d.ts","sourceRoot":"","sources":["../../../src/geometry.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC;IAClC,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC,CAAC;AAEH,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC,CAAC;AAEH,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,YAAY,GAAG,OAAO,CASpE;AAED,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,YAAY,GAAG,IAAI,EAC1B,MAAM,EAAE,YAAY,GACnB,OAAO,CAUT;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,GACjB,YAAY,GAAG,IAAI,CAoCrB"}

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

@@ -0,0 +1,5 @@
+export { SmoothClipView } from './SmoothClipView';
+export type { SmoothClipViewProps } from './SmoothClipView';
+export { normalizeClipGeometry } from './geometry.js';
+export type { ClipBounds, ClipGeometry } from './geometry.js';
+//# 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.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAY,CAAC;AACnD,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,eAAY,CAAC"}

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

@@ -0,0 +1,5 @@
+export { SmoothClipView } from './SmoothClipView.web.js';
+export type { SmoothClipViewProps } from './SmoothClipView.web.js';
+export { normalizeClipGeometry } from './geometry.js';
+export type { ClipBounds, ClipGeometry } from './geometry.js';
+//# sourceMappingURL=index.web.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../src/index.web.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAsB,CAAC;AACtD,YAAY,EAAE,mBAAmB,EAAE,MAAM,yBAAsB,CAAC;AAChE,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAY,CAAC;AACnD,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,eAAY,CAAC"}

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

@@ -0,0 +1,7 @@
+import type { ClipGeometry } from './geometry.js';
+/**
+ * Creates a fixed-host CSS clip. Percentage/right/bottom anchored descendants
+ * continue resolving against the host because this never changes its layout.
+ */
+export declare function createWebClipPath(geometry: ClipGeometry): string;
+//# sourceMappingURL=webClipPath.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"webClipPath.d.ts","sourceRoot":"","sources":["../../../src/webClipPath.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAY,CAAC;AAO/C;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,YAAY,GAAG,MAAM,CAkBhE"}