react-native-linear-gradient-fabric 0.1.0

package/ios/LinearGradientView.m

@@ -0,0 +1,145 @@
+#import "LinearGradientView.h"
+#import <QuartzCore/QuartzCore.h>
+
+@implementation LinearGradientView {
+    CAGradientLayer *_gradientLayer;
+}
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+    if (self = [super initWithFrame:frame]) {
+        _gradientLayer = [CAGradientLayer layer];
+        _gradientLayer.frame = self.bounds;
+        [self.layer insertSublayer:_gradientLayer atIndex:0];
+
+        // Set default values
+        _startPoint = CGPointMake(0.5, 0);
+        _endPoint = CGPointMake(0.5, 1);
+        _useAngle = NO;
+        _angle = 0;
+        _angleCenter = CGPointMake(0.5, 0.5);
+    }
+    return self;
+}
+
+- (void)layoutSubviews
+{
+    [super layoutSubviews];
+    _gradientLayer.frame = self.bounds;
+}
+
+- (void)setColors:(NSArray<NSNumber *> *)colors
+{
+    _colors = colors;
+    [self updateGradient];
+}
+
+- (void)setLocations:(NSArray<NSNumber *> *)locations
+{
+    _locations = locations;
+    [self updateGradient];
+}
+
+- (void)setStartPoint:(CGPoint)startPoint
+{
+    _startPoint = startPoint;
+    [self updateGradient];
+}
+
+- (void)setEndPoint:(CGPoint)endPoint
+{
+    _endPoint = endPoint;
+    [self updateGradient];
+}
+
+- (void)setUseAngle:(BOOL)useAngle
+{
+    _useAngle = useAngle;
+    [self updateGradient];
+}
+
+- (void)setAngle:(CGFloat)angle
+{
+    _angle = angle;
+    [self updateGradient];
+}
+
+- (void)setAngleCenter:(CGPoint)angleCenter
+{
+    _angleCenter = angleCenter;
+    [self updateGradient];
+}
+
+- (void)updateGradient
+{
+    if (!_colors || _colors.count == 0) {
+        return;
+    }
+
+    // Convert colors from ARGB int to CGColor
+    NSMutableArray<id> *cgColors = [NSMutableArray arrayWithCapacity:_colors.count];
+    for (NSNumber *colorNumber in _colors) {
+        int colorInt = [colorNumber intValue];
+        UIColor *color = [self colorFromInt:colorInt];
+        [cgColors addObject:(id)color.CGColor];
+    }
+    _gradientLayer.colors = cgColors;
+
+    // Set locations if provided
+    if (_locations && _locations.count > 0) {
+        _gradientLayer.locations = _locations;
+    } else {
+        _gradientLayer.locations = nil;
+    }
+
+    // Calculate start and end points
+    CGPoint startPoint, endPoint;
+
+    if (_useAngle) {
+        [self calculatePointsForAngle:_angle
+                              centerX:_angleCenter.x
+                              centerY:_angleCenter.y
+                           startPoint:&startPoint
+                             endPoint:&endPoint];
+    } else {
+        startPoint = _startPoint;
+        endPoint = _endPoint;
+    }
+
+    _gradientLayer.startPoint = startPoint;
+    _gradientLayer.endPoint = endPoint;
+}
+
+- (UIColor *)colorFromInt:(int)colorInt
+{
+    // React Native processColor returns ARGB format on iOS
+    CGFloat alpha = ((colorInt >> 24) & 0xFF) / 255.0;
+    CGFloat red = ((colorInt >> 16) & 0xFF) / 255.0;
+    CGFloat green = ((colorInt >> 8) & 0xFF) / 255.0;
+    CGFloat blue = (colorInt & 0xFF) / 255.0;
+
+    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
+}
+
+- (void)calculatePointsForAngle:(CGFloat)angle
+                        centerX:(CGFloat)centerX
+                        centerY:(CGFloat)centerY
+                     startPoint:(CGPoint *)startPoint
+                       endPoint:(CGPoint *)endPoint
+{
+    // Convert angle from degrees to radians
+    // Angle 0 = up, 90 = right, 180 = down, 270 = left
+    CGFloat angleRad = (angle - 90) * M_PI / 180.0;
+
+    // Calculate the gradient direction vector
+    CGFloat dx = cos(angleRad);
+    CGFloat dy = sin(angleRad);
+
+    // Normalize to ensure the gradient covers the full view
+    CGFloat length = 0.5;
+
+    *startPoint = CGPointMake(centerX - dx * length, centerY - dy * length);
+    *endPoint = CGPointMake(centerX + dx * length, centerY + dy * length);
+}
+
+@end

package/ios/LinearGradientViewComponentView.h

@@ -0,0 +1,13 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+#import <React/RCTViewComponentView.h>
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface LinearGradientViewComponentView : RCTViewComponentView
+
+@end
+
+NS_ASSUME_NONNULL_END
+
+#endif /* RCT_NEW_ARCH_ENABLED */

package/ios/LinearGradientViewComponentView.mm

@@ -0,0 +1,181 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+#import "LinearGradientViewComponentView.h"
+
+#import <React/RCTConversions.h>
+#import <React/RCTFabricComponentsPlugins.h>
+#import <react/renderer/components/RNLinearGradientFabricSpec/ComponentDescriptors.h>
+#import <react/renderer/components/RNLinearGradientFabricSpec/EventEmitters.h>
+#import <react/renderer/components/RNLinearGradientFabricSpec/Props.h>
+#import <react/renderer/components/RNLinearGradientFabricSpec/RCTComponentViewHelpers.h>
+
+using namespace facebook::react;
+
+@interface LinearGradientViewComponentView () <RCTLinearGradientViewViewProtocol>
+@end
+
+@implementation LinearGradientViewComponentView {
+    CAGradientLayer *_gradientLayer;
+    std::vector<int> _colors;
+    std::vector<Float> _locations;
+    Float _startPointX;
+    Float _startPointY;
+    Float _endPointX;
+    Float _endPointY;
+    BOOL _useAngle;
+    Float _angle;
+    Float _angleCenterX;
+    Float _angleCenterY;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+    return concreteComponentDescriptorProvider<LinearGradientViewComponentDescriptor>();
+}
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+    if (self = [super initWithFrame:frame]) {
+        static const auto defaultProps = std::make_shared<const LinearGradientViewProps>();
+        _props = defaultProps;
+
+        _gradientLayer = [CAGradientLayer layer];
+        _gradientLayer.frame = self.bounds;
+        [self.layer insertSublayer:_gradientLayer atIndex:0];
+
+        // Set default values
+        _startPointX = 0.5;
+        _startPointY = 0;
+        _endPointX = 0.5;
+        _endPointY = 1;
+        _useAngle = NO;
+        _angle = 0;
+        _angleCenterX = 0.5;
+        _angleCenterY = 0.5;
+    }
+    return self;
+}
+
+- (void)layoutSubviews
+{
+    [super layoutSubviews];
+    _gradientLayer.frame = self.bounds;
+}
+
+- (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &)oldProps
+{
+    const auto &newProps = *std::static_pointer_cast<const LinearGradientViewProps>(props);
+
+    // Update colors
+    _colors.clear();
+    for (const auto &color : newProps.colors) {
+        _colors.push_back(color);
+    }
+
+    // Update locations
+    _locations.clear();
+    for (const auto &location : newProps.locations) {
+        _locations.push_back(location);
+    }
+
+    // Update start point
+    _startPointX = newProps.startPoint.x;
+    _startPointY = newProps.startPoint.y;
+
+    // Update end point
+    _endPointX = newProps.endPoint.x;
+    _endPointY = newProps.endPoint.y;
+
+    // Update angle settings
+    _useAngle = newProps.useAngle;
+    _angle = newProps.angle;
+    _angleCenterX = newProps.angleCenter.x;
+    _angleCenterY = newProps.angleCenter.y;
+
+    [self updateGradient];
+
+    [super updateProps:props oldProps:oldProps];
+}
+
+- (void)updateGradient
+{
+    if (_colors.empty()) {
+        return;
+    }
+
+    // Convert colors from ARGB int to CGColor
+    NSMutableArray<id> *cgColors = [NSMutableArray arrayWithCapacity:_colors.size()];
+    for (int colorInt : _colors) {
+        UIColor *color = [self colorFromInt:colorInt];
+        [cgColors addObject:(id)color.CGColor];
+    }
+    _gradientLayer.colors = cgColors;
+
+    // Set locations if provided
+    if (!_locations.empty()) {
+        NSMutableArray<NSNumber *> *locationsArray = [NSMutableArray arrayWithCapacity:_locations.size()];
+        for (Float location : _locations) {
+            [locationsArray addObject:@(location)];
+        }
+        _gradientLayer.locations = locationsArray;
+    } else {
+        _gradientLayer.locations = nil;
+    }
+
+    // Calculate start and end points
+    CGPoint startPoint, endPoint;
+
+    if (_useAngle) {
+        [self calculatePointsForAngle:_angle
+                              centerX:_angleCenterX
+                              centerY:_angleCenterY
+                           startPoint:&startPoint
+                             endPoint:&endPoint];
+    } else {
+        startPoint = CGPointMake(_startPointX, _startPointY);
+        endPoint = CGPointMake(_endPointX, _endPointY);
+    }
+
+    _gradientLayer.startPoint = startPoint;
+    _gradientLayer.endPoint = endPoint;
+}
+
+- (UIColor *)colorFromInt:(int)colorInt
+{
+    // React Native processColor returns ARGB format on iOS
+    CGFloat alpha = ((colorInt >> 24) & 0xFF) / 255.0;
+    CGFloat red = ((colorInt >> 16) & 0xFF) / 255.0;
+    CGFloat green = ((colorInt >> 8) & 0xFF) / 255.0;
+    CGFloat blue = (colorInt & 0xFF) / 255.0;
+
+    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
+}
+
+- (void)calculatePointsForAngle:(Float)angle
+                        centerX:(Float)centerX
+                        centerY:(Float)centerY
+                     startPoint:(CGPoint *)startPoint
+                       endPoint:(CGPoint *)endPoint
+{
+    // Convert angle from degrees to radians
+    // Angle 0 = up, 90 = right, 180 = down, 270 = left
+    CGFloat angleRad = (angle - 90) * M_PI / 180.0;
+
+    // Calculate the gradient direction vector
+    CGFloat dx = cos(angleRad);
+    CGFloat dy = sin(angleRad);
+
+    // Normalize to ensure the gradient covers the full view
+    CGFloat length = 0.5;
+
+    *startPoint = CGPointMake(centerX - dx * length, centerY - dy * length);
+    *endPoint = CGPointMake(centerX + dx * length, centerY + dy * length);
+}
+
+@end
+
+Class<RCTComponentViewProtocol> LinearGradientViewCls(void)
+{
+    return LinearGradientViewComponentView.class;
+}
+
+#endif /* RCT_NEW_ARCH_ENABLED */

package/ios/LinearGradientViewManager.h

@@ -0,0 +1,5 @@
+#import <React/RCTViewManager.h>
+
+@interface LinearGradientViewManager : RCTViewManager
+
+@end

package/ios/LinearGradientViewManager.m

@@ -0,0 +1,56 @@
+#import "LinearGradientViewManager.h"
+#import "LinearGradientView.h"
+#import <React/RCTBridge.h>
+#import <React/RCTConvert.h>
+
+@implementation LinearGradientViewManager
+
+RCT_EXPORT_MODULE(LinearGradientView)
+
+- (UIView *)view
+{
+    return [[LinearGradientView alloc] init];
+}
+
+RCT_EXPORT_VIEW_PROPERTY(colors, NSArray)
+RCT_EXPORT_VIEW_PROPERTY(locations, NSArray)
+RCT_CUSTOM_VIEW_PROPERTY(startPoint, NSDictionary, LinearGradientView)
+{
+    if (json) {
+        NSDictionary *dict = [RCTConvert NSDictionary:json];
+        CGFloat x = [[dict objectForKey:@"x"] floatValue];
+        CGFloat y = [[dict objectForKey:@"y"] floatValue];
+        view.startPoint = CGPointMake(x, y);
+    } else {
+        view.startPoint = CGPointMake(0.5, 0);
+    }
+}
+
+RCT_CUSTOM_VIEW_PROPERTY(endPoint, NSDictionary, LinearGradientView)
+{
+    if (json) {
+        NSDictionary *dict = [RCTConvert NSDictionary:json];
+        CGFloat x = [[dict objectForKey:@"x"] floatValue];
+        CGFloat y = [[dict objectForKey:@"y"] floatValue];
+        view.endPoint = CGPointMake(x, y);
+    } else {
+        view.endPoint = CGPointMake(0.5, 1);
+    }
+}
+
+RCT_EXPORT_VIEW_PROPERTY(useAngle, BOOL)
+RCT_EXPORT_VIEW_PROPERTY(angle, CGFloat)
+
+RCT_CUSTOM_VIEW_PROPERTY(angleCenter, NSDictionary, LinearGradientView)
+{
+    if (json) {
+        NSDictionary *dict = [RCTConvert NSDictionary:json];
+        CGFloat x = [[dict objectForKey:@"x"] floatValue];
+        CGFloat y = [[dict objectForKey:@"y"] floatValue];
+        view.angleCenter = CGPointMake(x, y);
+    } else {
+        view.angleCenter = CGPointMake(0.5, 0.5);
+    }
+}
+
+@end

package/lib/commonjs/LinearGradientNativeComponent.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _codegenNativeComponent = _interopRequireDefault(require("react-native/Libraries/Utilities/codegenNativeComponent"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = (0, _codegenNativeComponent.default)('LinearGradientView');
+//# sourceMappingURL=LinearGradientNativeComponent.js.map

package/lib/commonjs/LinearGradientNativeComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_codegenNativeComponent","_interopRequireDefault","require","e","__esModule","default","_default","exports","codegenNativeComponent"],"sourceRoot":"../../src","sources":["LinearGradientNativeComponent.ts"],"mappings":";;;;;;AACA,IAAAA,uBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA6F,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,IAAAG,QAAA,GAAAC,OAAA,CAAAF,OAAA,GAuC9E,IAAAG,+BAAsB,EACnC,oBACF,CAAC","ignoreList":[]}

package/lib/commonjs/index.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LinearGradient = LinearGradient;
+exports.default = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _LinearGradientNativeComponent = _interopRequireDefault(require("./LinearGradientNativeComponent"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const DEFAULT_START = {
+  x: 0.5,
+  y: 0
+};
+const DEFAULT_END = {
+  x: 0.5,
+  y: 1
+};
+const DEFAULT_ANGLE_CENTER = {
+  x: 0.5,
+  y: 0.5
+};
+function processColors(colors) {
+  return colors.map(color => {
+    const processed = (0, _reactNative.processColor)(color);
+    if (processed === null || processed === undefined) {
+      throw new Error(`Invalid color value: ${String(color)}`);
+    }
+    return typeof processed === 'number' ? processed : 0;
+  });
+}
+function validateLocations(locations, colorsLength) {
+  if (!locations) {
+    return undefined;
+  }
+  if (locations.length !== colorsLength) {
+    console.warn(`LinearGradient: locations array length (${locations.length}) does not match colors array length (${colorsLength})`);
+  }
+  return locations;
+}
+function LinearGradient({
+  colors,
+  locations,
+  start = DEFAULT_START,
+  end = DEFAULT_END,
+  useAngle = false,
+  angle = 0,
+  angleCenter = DEFAULT_ANGLE_CENTER,
+  style,
+  children,
+  ...rest
+}) {
+  if (colors.length < 2) {
+    throw new Error('LinearGradient requires at least 2 colors');
+  }
+  const processedColors = React.useMemo(() => processColors(colors), [colors]);
+  const validatedLocations = React.useMemo(() => validateLocations(locations, colors.length), [locations, colors.length]);
+  return /*#__PURE__*/React.createElement(_LinearGradientNativeComponent.default, _extends({}, rest, {
+    style: _reactNative.StyleSheet.flatten(style),
+    colors: processedColors,
+    locations: validatedLocations,
+    startPoint: start,
+    endPoint: end,
+    useAngle: useAngle,
+    angle: angle,
+    angleCenter: angleCenter
+  }), children);
+}
+var _default = exports.default = LinearGradient;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","_interopRequireWildcard","require","_reactNative","_LinearGradientNativeComponent","_interopRequireDefault","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","DEFAULT_START","x","y","DEFAULT_END","DEFAULT_ANGLE_CENTER","processColors","colors","map","color","processed","processColor","undefined","Error","String","validateLocations","locations","colorsLength","console","warn","LinearGradient","start","end","useAngle","angle","angleCenter","style","children","rest","processedColors","useMemo","validatedLocations","createElement","StyleSheet","flatten","startPoint","endPoint","_default","exports"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/LinearGradientNativeComponent.js

@@ -0,0 +1,3 @@
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+export default codegenNativeComponent('LinearGradientView');
+//# sourceMappingURL=LinearGradientNativeComponent.js.map

package/lib/module/LinearGradientNativeComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["codegenNativeComponent"],"sourceRoot":"../../src","sources":["LinearGradientNativeComponent.ts"],"mappings":"AACA,OAAOA,sBAAsB,MAAM,yDAAyD;AAuC5F,eAAeA,sBAAsB,CACnC,oBACF,CAAC","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,64 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import * as React from 'react';
+import { processColor, StyleSheet } from 'react-native';
+import LinearGradientNativeComponent from './LinearGradientNativeComponent';
+const DEFAULT_START = {
+  x: 0.5,
+  y: 0
+};
+const DEFAULT_END = {
+  x: 0.5,
+  y: 1
+};
+const DEFAULT_ANGLE_CENTER = {
+  x: 0.5,
+  y: 0.5
+};
+function processColors(colors) {
+  return colors.map(color => {
+    const processed = processColor(color);
+    if (processed === null || processed === undefined) {
+      throw new Error(`Invalid color value: ${String(color)}`);
+    }
+    return typeof processed === 'number' ? processed : 0;
+  });
+}
+function validateLocations(locations, colorsLength) {
+  if (!locations) {
+    return undefined;
+  }
+  if (locations.length !== colorsLength) {
+    console.warn(`LinearGradient: locations array length (${locations.length}) does not match colors array length (${colorsLength})`);
+  }
+  return locations;
+}
+export function LinearGradient({
+  colors,
+  locations,
+  start = DEFAULT_START,
+  end = DEFAULT_END,
+  useAngle = false,
+  angle = 0,
+  angleCenter = DEFAULT_ANGLE_CENTER,
+  style,
+  children,
+  ...rest
+}) {
+  if (colors.length < 2) {
+    throw new Error('LinearGradient requires at least 2 colors');
+  }
+  const processedColors = React.useMemo(() => processColors(colors), [colors]);
+  const validatedLocations = React.useMemo(() => validateLocations(locations, colors.length), [locations, colors.length]);
+  return /*#__PURE__*/React.createElement(LinearGradientNativeComponent, _extends({}, rest, {
+    style: StyleSheet.flatten(style),
+    colors: processedColors,
+    locations: validatedLocations,
+    startPoint: start,
+    endPoint: end,
+    useAngle: useAngle,
+    angle: angle,
+    angleCenter: angleCenter
+  }), children);
+}
+export default LinearGradient;
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","processColor","StyleSheet","LinearGradientNativeComponent","DEFAULT_START","x","y","DEFAULT_END","DEFAULT_ANGLE_CENTER","processColors","colors","map","color","processed","undefined","Error","String","validateLocations","locations","colorsLength","length","console","warn","LinearGradient","start","end","useAngle","angle","angleCenter","style","children","rest","processedColors","useMemo","validatedLocations","createElement","_extends","flatten","startPoint","endPoint"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,YAAY,EAAEC,UAAU,QAAQ,cAAc;AAEvD,OAAOC,6BAA6B,MAAM,iCAAiC;AAqD3E,MAAMC,aAAoB,GAAG;EAAEC,CAAC,EAAE,GAAG;EAAEC,CAAC,EAAE;AAAE,CAAC;AAC7C,MAAMC,WAAkB,GAAG;EAAEF,CAAC,EAAE,GAAG;EAAEC,CAAC,EAAE;AAAE,CAAC;AAC3C,MAAME,oBAA2B,GAAG;EAAEH,CAAC,EAAE,GAAG;EAAEC,CAAC,EAAE;AAAI,CAAC;AAEtD,SAASG,aAAaA,CAACC,MAAoB,EAAY;EACrD,OAAOA,MAAM,CAACC,GAAG,CAAEC,KAAK,IAAK;IAC3B,MAAMC,SAAS,GAAGZ,YAAY,CAACW,KAAK,CAAC;IACrC,IAAIC,SAAS,KAAK,IAAI,IAAIA,SAAS,KAAKC,SAAS,EAAE;MACjD,MAAM,IAAIC,KAAK,CAAC,wBAAwBC,MAAM,CAACJ,KAAK,CAAC,EAAE,CAAC;IAC1D;IACA,OAAO,OAAOC,SAAS,KAAK,QAAQ,GAAGA,SAAS,GAAG,CAAC;EACtD,CAAC,CAAC;AACJ;AAEA,SAASI,iBAAiBA,CACxBC,SAA+B,EAC/BC,YAAoB,EACE;EACtB,IAAI,CAACD,SAAS,EAAE;IACd,OAAOJ,SAAS;EAClB;EAEA,IAAII,SAAS,CAACE,MAAM,KAAKD,YAAY,EAAE;IACrCE,OAAO,CAACC,IAAI,CACV,2CAA2CJ,SAAS,CAACE,MAAM,yCAAyCD,YAAY,GAClH,CAAC;EACH;EAEA,OAAOD,SAAS;AAClB;AAEA,OAAO,SAASK,cAAcA,CAAC;EAC7Bb,MAAM;EACNQ,SAAS;EACTM,KAAK,GAAGpB,aAAa;EACrBqB,GAAG,GAAGlB,WAAW;EACjBmB,QAAQ,GAAG,KAAK;EAChBC,KAAK,GAAG,CAAC;EACTC,WAAW,GAAGpB,oBAAoB;EAClCqB,KAAK;EACLC,QAAQ;EACR,GAAGC;AACgB,CAAC,EAAsB;EAC1C,IAAIrB,MAAM,CAACU,MAAM,GAAG,CAAC,EAAE;IACrB,MAAM,IAAIL,KAAK,CAAC,2CAA2C,CAAC;EAC9D;EAEA,MAAMiB,eAAe,GAAGhC,KAAK,CAACiC,OAAO,CAAC,MAAMxB,aAAa,CAACC,MAAM,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC;EAC5E,MAAMwB,kBAAkB,GAAGlC,KAAK,CAACiC,OAAO,CACtC,MAAMhB,iBAAiB,CAACC,SAAS,EAAER,MAAM,CAACU,MAAM,CAAC,EACjD,CAACF,SAAS,EAAER,MAAM,CAACU,MAAM,CAC3B,CAAC;EAED,oBACEpB,KAAA,CAAAmC,aAAA,CAAChC,6BAA6B,EAAAiC,QAAA,KACxBL,IAAI;IACRF,KAAK,EAAE3B,UAAU,CAACmC,OAAO,CAACR,KAAK,CAAE;IACjCnB,MAAM,EAAEsB,eAAgB;IACxBd,SAAS,EAAEgB,kBAAmB;IAC9BI,UAAU,EAAEd,KAAM;IAClBe,QAAQ,EAAEd,GAAI;IACdC,QAAQ,EAAEA,QAAS;IACnBC,KAAK,EAAEA,KAAM;IACbC,WAAW,EAAEA;EAAY,IAExBE,QAC4B,CAAC;AAEpC;AAEA,eAAeP,cAAc","ignoreList":[]}

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

@@ -0,0 +1,39 @@
+import type { ViewProps } from 'react-native';
+import type { Float, Int32 } from 'react-native/Libraries/Types/CodegenTypes';
+export interface NativeLinearGradientPoint {
+    x: Float;
+    y: Float;
+}
+export interface NativeLinearGradientProps extends ViewProps {
+    /**
+     * An array of colors in integer format (processed by processColor)
+     */
+    colors: ReadonlyArray<Int32>;
+    /**
+     * An array of locations for each color stop, values should be between 0 and 1
+     */
+    locations?: ReadonlyArray<Float>;
+    /**
+     * The start point of the gradient (x: 0 = left, 1 = right; y: 0 = top, 1 = bottom)
+     */
+    startPoint?: NativeLinearGradientPoint;
+    /**
+     * The end point of the gradient (x: 0 = left, 1 = right; y: 0 = top, 1 = bottom)
+     */
+    endPoint?: NativeLinearGradientPoint;
+    /**
+     * If true, use angle instead of start/end points
+     */
+    useAngle?: boolean;
+    /**
+     * Angle of the gradient in degrees (0 = up, 90 = right, 180 = down, 270 = left)
+     */
+    angle?: Float;
+    /**
+     * The center point for the angle rotation
+     */
+    angleCenter?: NativeLinearGradientPoint;
+}
+declare const _default: import("react-native/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeLinearGradientProps>;
+export default _default;
+//# sourceMappingURL=LinearGradientNativeComponent.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LinearGradientNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/LinearGradientNativeComponent.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,2CAA2C,CAAC;AAE9E,MAAM,WAAW,yBAAyB;IACxC,CAAC,EAAE,KAAK,CAAC;IACT,CAAC,EAAE,KAAK,CAAC;CACV;AAED,MAAM,WAAW,yBAA0B,SAAQ,SAAS;IAC1D;;OAEG;IACH,MAAM,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7B;;OAEG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IACjC;;OAEG;IACH,UAAU,CAAC,EAAE,yBAAyB,CAAC;IACvC;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC;IACrC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,yBAAyB,CAAC;CACzC;;AAED,wBAEE"}

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

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import type { ColorValue, StyleProp, ViewStyle } from 'react-native';
+export interface Point {
+    x: number;
+    y: number;
+}
+export interface LinearGradientProps {
+    /**
+     * An array of at least 2 colors that represent gradient colors
+     */
+    colors: ColorValue[];
+    /**
+     * An array of locations for each color stop, values should be between 0 and 1
+     * The array length must match the colors array length
+     */
+    locations?: number[];
+    /**
+     * The start point of the gradient
+     * Default: { x: 0.5, y: 0 } (top center)
+     */
+    start?: Point;
+    /**
+     * The end point of the gradient
+     * Default: { x: 0.5, y: 1 } (bottom center)
+     */
+    end?: Point;
+    /**
+     * If true, use angle instead of start/end points
+     * Default: false
+     */
+    useAngle?: boolean;
+    /**
+     * Angle of the gradient in degrees (0 = up, 90 = right, 180 = down, 270 = left)
+     * Only used when useAngle is true
+     * Default: 0
+     */
+    angle?: number;
+    /**
+     * The center point for the angle rotation
+     * Default: { x: 0.5, y: 0.5 }
+     */
+    angleCenter?: Point;
+    /**
+     * Style for the gradient view
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Children elements to render on top of the gradient
+     */
+    children?: React.ReactNode;
+}
+export declare function LinearGradient({ colors, locations, start, end, useAngle, angle, angleCenter, style, children, ...rest }: LinearGradientProps): React.ReactElement;
+export default LinearGradient;
+//# sourceMappingURL=index.d.ts.map